/* ============================================================================
   AL ARABIYA FARSI — house style
   Dark, cinematic, gold hairlines. A fixed vertical navigation rail, mosaic
   hero, timeline feed. Nothing here is shared with the Euronews build.
   ========================================================================== */

:root{
  --ar-bg:#0a0a0c; --ar-bg2:#111114; --ar-panel:#16161b; --ar-panel2:#1d1d23;
  --ar-gold:#c9a227; --ar-gold2:#e8c96a; --ar-gold-dim:#6b5a20;
  --ar-line:#26262e; --ar-line2:#1b1b21; --ar-red:#d92b2b;

  --brand:#c9a227; --brand-dark:#a8871c; --brand-2:#e8c96a;
  --ink:#f6f3ec; --text:#cfc9be; --muted:#948d82; --faint:#6c665d;
  --bg:#0a0a0c; --bg-2:#111114; --bg-3:#16161b; --card:#111114;
  --border:#26262e; --border-2:#1b1b21;
  --radius:0; --radius-sm:0; --shadow:none;
  --maxw:1240px; --gap:26px;
  --heading-color:#f6f3ec;
  --ar-rail:92px;
}
html,html[data-theme=light],html[data-theme=dark]{
  --bg:#0a0a0c; --bg-2:#111114; --bg-3:#16161b; --card:#111114;
  --ink:#f6f3ec; --text:#cfc9be; --muted:#948d82; --border:#26262e;
}
body{background:var(--ar-bg);color:var(--text);font-size:15.5px}
h1,h2,h3,h4{color:var(--ink)}
img{opacity:.94}
a:hover img{opacity:1}
::selection{background:var(--ar-gold);color:#0a0a0c}
.container{max-width:var(--maxw);padding-inline:22px}

/* remove the inherited chrome */
.site-header,.site-footer,.tabbar,.mobile-drawer,.drawer-backdrop,.breaking-bar{display:none !important}

/* content is pushed away from the fixed rail */
body{padding-inline-start:var(--ar-rail)}

/* ============================== SIDE RAIL =========================== */
.ar-rail{position:fixed;inset-block:0;inset-inline-start:0;width:var(--ar-rail);background:#08080a;
  border-inline-end:1px solid var(--ar-line);display:flex;flex-direction:column;align-items:center;
  padding:18px 0;z-index:100;gap:6px}
.ar-rail-logo{display:block;margin-bottom:14px}
.ar-rail-logo img{width:46px;height:46px}
.ar-rail nav{display:flex;flex-direction:column;gap:2px;width:100%;align-items:center;overflow-y:auto;scrollbar-width:none}
.ar-rail nav::-webkit-scrollbar{display:none}
.ar-rail nav a{width:100%;display:flex;flex-direction:column;align-items:center;gap:5px;padding:11px 4px;color:#7d776e;
  font-size:10.5px;font-weight:700;border-inline-end:2px solid transparent}
.ar-rail nav a svg{opacity:.85}
.ar-rail nav a:hover{color:var(--ar-gold2);background:#0e0e11}
.ar-rail nav a.on{color:var(--ar-gold2);border-inline-end-color:var(--ar-gold);background:#0e0e11}
.ar-rail-bot{margin-top:auto;display:flex;flex-direction:column;align-items:center;gap:12px;padding-top:14px;width:100%;border-top:1px solid var(--ar-line)}
.ar-rail-soc{display:flex;flex-direction:column;gap:10px}
.ar-rail-soc a{color:#6c665d}
.ar-rail-soc a:hover{color:var(--ar-gold2)}
.ar-rail-lang{display:flex;flex-direction:column;gap:3px;align-items:center}
.ar-rail-lang a{font-size:10.5px;font-weight:800;color:#5f5a52;letter-spacing:.5px}
.ar-rail-lang a.on{color:#0a0a0c;background:var(--ar-gold);padding:1px 6px}
.ar-rail-burger{display:none}

/* ============================== TOP STRIP =========================== */
.ar-top{border-bottom:1px solid var(--ar-line);background:#08080a}
.ar-top-in{display:flex;align-items:center;gap:18px;height:52px}
.ar-live{display:inline-flex;align-items:center;gap:8px;color:#fff;font-weight:800;font-size:13px;flex:none;
  background:var(--ar-red);padding:6px 13px}
.ar-live i{width:7px;height:7px;border-radius:50%;background:#fff;animation:arpulse 1.3s infinite}
@keyframes arpulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.75)}}
.ar-top-tick{flex:1;overflow:hidden;position:relative;height:100%}
.ar-top-track{display:flex;align-items:center;height:100%;gap:40px;white-space:nowrap;animation:artick 50s linear infinite}
.ar-top-tick:hover .ar-top-track{animation-play-state:paused}
@keyframes artick{from{transform:translateX(0)}to{transform:translateX(-100%)}}
html[dir=rtl] .ar-top-track{animation-name:artick-rtl}
@keyframes artick-rtl{from{transform:translateX(0)}to{transform:translateX(100%)}}
.ar-top-track a{font-size:14px;color:#b3ada3;font-weight:600}
.ar-top-track a:hover{color:var(--ar-gold2)}
.ar-top-track a::before{content:"—";color:var(--ar-gold);margin-inline-end:10px}
.ar-top-r{display:flex;align-items:center;gap:14px;flex:none;color:var(--muted);font-size:12.5px}
.ar-top-r .cl{color:var(--ar-gold2);font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.5px}

/* ============================== MASTHEAD =========================== */
.ar-mast{padding:34px 0 26px;text-align:center;border-bottom:1px solid var(--ar-line);position:relative}
.ar-mast::after{content:"";position:absolute;inset-inline:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,var(--ar-gold),transparent);opacity:.6}
.ar-mast img{height:82px;width:auto;margin-inline:auto}
.ar-mast .sub{margin-top:12px;font-size:11px;letter-spacing:5px;color:var(--ar-gold);font-family:var(--font-lat);text-transform:uppercase}
.ar-mast form{margin:20px auto 0;display:flex;max-width:520px;border:1px solid var(--ar-line);background:#0e0e11}
.ar-mast form input{flex:1;background:transparent;border:0;outline:0;padding:12px 16px;font:inherit;font-size:14px;color:var(--ink)}
.ar-mast form button{background:transparent;color:var(--ar-gold);padding:0 18px;font-weight:800;font-size:13px;border-inline-start:1px solid var(--ar-line)}
.ar-mast form button:hover{background:var(--ar-gold);color:#0a0a0c}

/* =============================== HERO ============================== */
.ar-hero{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);gap:2px;margin-top:34px;background:var(--ar-line)}
.ar-hero-main{position:relative;display:block;min-height:520px;background:#000;overflow:hidden}
.ar-hero-main img{width:100%;height:100%;min-height:520px;object-fit:cover;opacity:.72;transition:transform .8s,opacity .4s}
.ar-hero-main:hover img{transform:scale(1.04);opacity:.82}
.ar-hero-b{position:absolute;inset-inline:0;bottom:0;padding:40px 36px 34px;
  background:linear-gradient(to top,rgba(6,6,8,.97) 10%,rgba(6,6,8,.75) 45%,transparent)}
.ar-tag{display:inline-flex;align-items:center;gap:8px;color:var(--ar-gold);font-size:12px;font-weight:800;letter-spacing:1px;margin-bottom:14px}
.ar-tag::before{content:"";width:26px;height:1px;background:var(--ar-gold)}
.ar-hero-b h1{font-size:38px;line-height:1.32;font-weight:900;color:#fff;max-width:20ch}
.ar-hero-b p{margin-top:14px;color:#a9a298;font-size:15.5px;line-height:1.8;max-width:56ch}
.ar-hero-b .m{margin-top:16px;font-size:12.5px;color:var(--ar-gold-dim);font-weight:700}
.ar-hero-side{display:grid;grid-template-rows:1fr 1fr;gap:2px}
.ar-hero-s{position:relative;display:block;min-height:259px;background:#000;overflow:hidden}
.ar-hero-s img{width:100%;height:100%;min-height:259px;object-fit:cover;opacity:.6;transition:transform .8s,opacity .4s}
.ar-hero-s:hover img{transform:scale(1.05);opacity:.75}
.ar-hero-s span{position:absolute;inset-inline:0;bottom:0;padding:34px 20px 22px;
  background:linear-gradient(to top,rgba(6,6,8,.985) 26%,rgba(6,6,8,.8) 62%,transparent)}
.ar-hero-s h3{font-size:18px;line-height:1.5;font-weight:800;color:#fff}
.ar-hero-s .c{display:block;color:var(--ar-gold);font-size:11.5px;font-weight:800;letter-spacing:.8px;margin-bottom:8px}

/* ============================== SECTIONS =========================== */
.ar-sec{margin-top:56px}
.ar-sec-h{display:flex;align-items:center;gap:20px;margin-bottom:26px}
.ar-sec-h h2{font-size:26px;font-weight:900;color:var(--ink);flex:none;letter-spacing:-.3px}
.ar-sec-h .lat{flex:none;font-size:10.5px;letter-spacing:4px;color:var(--ar-gold);font-family:var(--font-lat);text-transform:uppercase}
.ar-sec-h .ln{flex:1;height:1px;background:linear-gradient(90deg,var(--ar-gold-dim),transparent)}
html[dir=rtl] .ar-sec-h .ln{background:linear-gradient(-90deg,var(--ar-gold-dim),transparent)}
.ar-sec-h a.more{flex:none;font-size:13px;font-weight:800;color:var(--ar-gold);letter-spacing:.3px}
.ar-sec-h a.more:hover{color:var(--ar-gold2)}

/* ============================== TIMELINE =========================== */
.ar-wrap{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:48px;align-items:start}
.ar-tl{position:relative;padding-inline-start:26px}
.ar-tl::before{content:"";position:absolute;inset-block:6px;inset-inline-start:5px;width:1px;background:var(--ar-line)}
.ar-tli{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 168px;gap:22px;padding:22px 0;border-bottom:1px solid var(--ar-line2)}
.ar-tli::before{content:"";position:absolute;inset-inline-start:-25px;top:30px;width:9px;height:9px;background:var(--ar-bg);
  border:2px solid var(--ar-gold-dim);border-radius:50%;transition:border-color .25s,background .25s}
.ar-tli:hover::before{border-color:var(--ar-gold);background:var(--ar-gold)}
.ar-tli .tm{display:block;font-size:11.5px;font-weight:800;color:var(--ar-gold-dim);letter-spacing:.5px;margin-bottom:8px}
.ar-tli h3{font-size:19.5px;line-height:1.55;font-weight:800}
.ar-tli:hover h3{color:var(--ar-gold2)}
.ar-tli p{margin-top:9px;font-size:14.5px;color:var(--muted);line-height:1.8}
.ar-tli .im{display:block;width:168px;height:110px;overflow:hidden;background:var(--ar-panel)}
.ar-tli .im img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.ar-tli:hover .im img{transform:scale(1.05)}
.ar-tli .c{color:var(--ar-gold);font-size:11.5px;font-weight:800}

.ar-btn{display:block;width:max-content;margin:34px auto 0;border:1px solid var(--ar-gold-dim);color:var(--ar-gold);
  font-weight:800;font-size:13.5px;padding:13px 40px;letter-spacing:.5px}
.ar-btn:hover{background:var(--ar-gold);color:#0a0a0c;border-color:var(--ar-gold)}

/* =============================== ASIDE ============================= */
.ar-box{border:1px solid var(--ar-line);margin-bottom:28px;background:var(--ar-bg2)}
.ar-box-h{padding:14px 16px;border-bottom:1px solid var(--ar-line);display:flex;align-items:center;justify-content:space-between}
.ar-box-h b{font-size:14.5px;font-weight:800;color:var(--ink)}
.ar-box-h span{font-size:10px;letter-spacing:2.5px;color:var(--ar-gold);font-family:var(--font-lat)}
.ar-list{list-style:none}
.ar-list li{border-bottom:1px solid var(--ar-line2)}
.ar-list li:last-child{border-bottom:0}
.ar-list a{display:flex;gap:14px;padding:14px 16px;align-items:baseline}
.ar-list b{font-family:var(--font-lat);font-size:16px;font-weight:900;color:var(--ar-gold-dim);flex:none;min-width:18px}
.ar-list span{font-size:14.5px;font-weight:600;line-height:1.6;color:var(--text)}
.ar-list a:hover span{color:var(--ar-gold2)}
.ar-list a:hover b{color:var(--ar-gold)}

.ar-quote{border:1px solid var(--ar-line);border-top:2px solid var(--ar-gold);padding:24px 20px;margin-bottom:28px;background:var(--ar-bg2);position:relative}
.ar-quote::before{content:"”";position:absolute;inset-inline-end:18px;top:2px;font-size:64px;color:var(--ar-line);font-family:Georgia,serif;line-height:1}
.ar-quote .h{font-size:10.5px;letter-spacing:3px;color:var(--ar-gold);font-family:var(--font-lat);text-transform:uppercase}
.ar-quote h3{margin-top:12px;font-size:18.5px;line-height:1.55;font-weight:900}
.ar-quote p{margin-top:12px;font-size:14px;color:var(--muted);line-height:1.85}
.ar-quote .who{margin-top:18px;display:flex;align-items:center;gap:11px;padding-top:14px;border-top:1px solid var(--ar-line)}
.ar-quote .who img{width:40px;height:40px;object-fit:cover;border-radius:50%;border:1px solid var(--ar-gold-dim)}
.ar-quote .who b{display:block;font-size:13.5px;color:var(--ink)}
.ar-quote .who small{font-size:12px;color:var(--muted)}

.ar-mkt{border:1px solid var(--ar-line);background:var(--ar-bg2);margin-bottom:28px}
.ar-mkt li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;border-bottom:1px solid var(--ar-line2);list-style:none;font-size:13.5px}
.ar-mkt li:last-child{border-bottom:0}
.ar-mkt .n{color:var(--muted);font-weight:600}
.ar-mkt .v{font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.ar-mkt .u{color:#3fa96a;font-size:12px;font-weight:800}
.ar-mkt .d{color:var(--ar-red);font-size:12px;font-weight:800}

.ar-send{display:flex;gap:14px;align-items:center;padding:20px;border:1px solid var(--ar-gold-dim);background:linear-gradient(135deg,#17140c,#0e0e11)}
.ar-send svg{color:var(--ar-gold);flex:none}
.ar-send b{display:block;font-size:15px;color:var(--ink)}
.ar-send small{display:block;font-size:12.5px;color:var(--muted);margin-top:5px;line-height:1.6}

/* =========================== HORIZONTAL RAIL ======================= */
.ar-scroll{display:flex;gap:2px;overflow-x:auto;scroll-snap-type:x mandatory;background:var(--ar-line);padding-bottom:0;scrollbar-width:thin}
.ar-scroll::-webkit-scrollbar{height:3px}
.ar-scroll::-webkit-scrollbar-thumb{background:var(--ar-gold-dim)}
.ar-sc{flex:0 0 300px;scroll-snap-align:start;background:var(--ar-bg);display:flex;flex-direction:column}
.ar-sc .im{display:block;position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--ar-panel);flex:none}
.ar-sc .im img{width:100%;height:100%;object-fit:cover;opacity:.8;transition:transform .6s,opacity .3s}
.ar-sc:hover .im img{transform:scale(1.05);opacity:1}
.ar-sc .num{position:absolute;inset-inline-start:0;top:0;background:var(--ar-gold);color:#0a0a0c;font-family:var(--font-lat);
  font-weight:900;font-size:16px;width:34px;height:34px;display:grid;place-items:center}
.ar-sc .bd{display:block;padding:16px 16px 22px;flex:1}
.ar-sc .c{display:block;font-size:11px;font-weight:800;color:var(--ar-gold);letter-spacing:.8px}
.ar-sc h3{margin-top:9px;font-size:16.5px;line-height:1.55;font-weight:800}
.ar-sc:hover h3{color:var(--ar-gold2)}
.ar-sc .m{display:block;margin-top:10px;font-size:11.5px;color:var(--faint);font-weight:600}

/* ============================== TV BLOCK =========================== */
.ar-tv{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:2px;background:var(--ar-line);border:1px solid var(--ar-line)}
.ar-tv-main{position:relative;display:block;aspect-ratio:16/9;background:#000;overflow:hidden}
.ar-tv-main img{width:100%;height:100%;object-fit:cover;opacity:.66}
.ar-tv-main:hover img{opacity:.8}
.ar-tv-play{position:absolute;inset:0;display:grid;place-items:center}
.ar-tv-play i{width:74px;height:74px;border:2px solid var(--ar-gold);color:var(--ar-gold);display:grid;place-items:center;
  font-style:normal;font-size:24px;padding-inline-start:5px;border-radius:50%;background:rgba(10,10,12,.45)}
.ar-tv-main:hover .ar-tv-play i{background:var(--ar-gold);color:#0a0a0c}
.ar-tv-main b{position:absolute;inset-inline:0;bottom:0;padding:24px;font-size:20px;font-weight:800;color:#fff;
  background:linear-gradient(to top,rgba(6,6,8,.95),transparent)}
.ar-tv-list{background:var(--ar-bg2);display:flex;flex-direction:column}
.ar-tvi{display:flex;gap:13px;padding:15px 16px;border-bottom:1px solid var(--ar-line2);align-items:center;flex:1}
.ar-tvi:last-child{border-bottom:0}
.ar-tvi .im{display:block;position:relative;width:96px;height:60px;flex:none;overflow:hidden;background:#000}
.ar-tvi .im img{width:100%;height:100%;object-fit:cover;opacity:.8}
.ar-tvi h4{font-size:14px;font-weight:700;line-height:1.55}
.ar-tvi:hover h4{color:var(--ar-gold2)}
.ar-tvi .t{position:absolute;inset-inline-end:4px;bottom:4px;background:rgba(0,0,0,.85);color:var(--ar-gold2);font-size:10.5px;padding:1px 5px}

/* ============================ CATEGORY BAND ======================== */
.ar-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--ar-line);border:1px solid var(--ar-line)}
.ar-cat{position:relative;display:block;height:170px;background:var(--ar-panel);overflow:hidden}
.ar-cat img{width:100%;height:100%;object-fit:cover;opacity:.33;transition:transform .7s,opacity .35s}
.ar-cat:hover img{transform:scale(1.08);opacity:.5}
.ar-cat span{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;text-align:center;padding:16px}
.ar-cat i{font-style:normal;font-size:10px;letter-spacing:3px;color:var(--ar-gold);font-family:var(--font-lat)}
.ar-cat b{font-size:20px;font-weight:900;color:#fff}
.ar-cat em{font-style:normal;width:24px;height:1px;background:var(--ar-gold-dim)}

/* =============================== FOOTER ============================ */
.ar-footer{margin-top:70px;border-top:1px solid var(--ar-line);background:#08080a;position:relative}
.ar-footer::before{content:"";position:absolute;inset-inline:0;top:-1px;height:1px;
  background:linear-gradient(90deg,transparent,var(--ar-gold),transparent);opacity:.7}
.ar-foot-top{text-align:center;padding:44px 0 34px;border-bottom:1px solid var(--ar-line)}
.ar-foot-top img{height:66px;margin-inline:auto}
.ar-foot-top p{margin-top:16px;color:var(--muted);font-size:14px;line-height:1.9;max-width:60ch;margin-inline:auto}
.ar-foot-soc{margin-top:20px;display:flex;justify-content:center;gap:12px}
.ar-foot-soc a{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--ar-line);color:var(--muted)}
.ar-foot-soc a:hover{border-color:var(--ar-gold);color:var(--ar-gold)}
.ar-foot-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;padding:36px 0}
.ar-foot-cols h4{font-size:12px;letter-spacing:2.5px;color:var(--ar-gold);font-family:var(--font-lat);text-transform:uppercase;margin-bottom:15px}
.ar-foot-cols ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.ar-foot-cols a{font-size:14px;color:#918b81}
.ar-foot-cols a:hover{color:var(--ar-gold2)}
.ar-foot-bar{border-top:1px solid var(--ar-line);padding:18px 0;display:flex;align-items:center;justify-content:space-between;
  gap:14px;flex-wrap:wrap;font-size:12.5px;color:var(--faint)}
.ar-foot-bar .lat{font-family:var(--font-lat);letter-spacing:2px;font-size:11px;color:var(--ar-gold-dim)}

/* ======================== INNER PAGES RESTYLE ====================== */
.card,.news-row,.widget,.rep-card,.post-card{background:var(--ar-bg2);border-radius:0;box-shadow:none;border:1px solid var(--ar-line)}
.card h3 a:hover,.news-row h3 a:hover{color:var(--ar-gold2)}
.cat-badge,.rcat{border-radius:0;color:var(--ar-gold) !important}
.btn,.pagination a,.pagination span{border-radius:0}
.widget-title{color:var(--ink)}
.art-title{letter-spacing:-.3px}
.art-body a{color:var(--ar-gold2)}

/* ============================= RESPONSIVE ========================== */
@media(max-width:1080px){
  .ar-hero{grid-template-columns:1fr}
  .ar-hero-main,.ar-hero-main img{min-height:400px}
  .ar-hero-b h1{font-size:29px}
  .ar-hero-side{grid-template-rows:auto auto}
  .ar-hero-s,.ar-hero-s img{min-height:210px}
  .ar-wrap{grid-template-columns:1fr;gap:38px}
  .ar-tv{grid-template-columns:1fr}
  .ar-cats{grid-template-columns:repeat(2,1fr)}
  .ar-foot-cols{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  :root{--ar-rail:0px}
  body{padding-inline-start:0;padding-bottom:66px}
  .ar-rail{inset-block:auto;bottom:0;inset-inline:0;width:100%;height:66px;flex-direction:row;justify-content:space-around;
    padding:0;border-inline-end:0;border-top:1px solid var(--ar-line)}
  .ar-rail-logo,.ar-rail-bot{display:none}
  .ar-rail nav{flex-direction:row;justify-content:space-around;overflow:visible}
  .ar-rail nav a{border-inline-end:0;border-top:2px solid transparent;padding:10px 2px;font-size:10px}
  .ar-rail nav a.on{border-inline-end-color:transparent;border-top-color:var(--ar-gold)}
  .ar-rail nav a.ar-hide-sm{display:none}
  .ar-mast{padding:22px 0 18px}
  .ar-mast img{height:56px}
  .ar-mast form{margin-top:16px}
  .ar-tli{grid-template-columns:minmax(0,1fr) 108px;gap:14px}
  .ar-tli .im{width:108px;height:76px}
  .ar-tli h3{font-size:16.5px}
  .ar-tli p{display:none}
  .ar-sec-h h2{font-size:21px}
  .ar-hero-b{padding:22px 18px 20px}
  .ar-hero-b h1{font-size:23px}
  .ar-hero-b p{display:none}
  .ar-top-r .dt{display:none}
  .ar-sc{flex-basis:250px}
}
@media(max-width:520px){
  .ar-cats{grid-template-columns:1fr}
  .ar-foot-cols{grid-template-columns:1fr}
}