/* afrah-fs-092 */ /* afrah-fs-092c */
/* ==========================================================================
   Afrah theme 2.0 — design layer (BAIRD-style: cinematic dark bands + calm content bands).
   Loaded after style.css. Light/dark tokens from style.css still drive the content bands;
   heroes and cinematic banners are always dark.
   ========================================================================== */

:root{
	--hx:#0E0C09;--hx2:#17140F;--hx-t:#F5EFE3;--hx-m:#BDB29C;--hx-line:rgba(232,207,138,.16);
	--hdr:68px;--rl:20px;
	--f-head:'Alexandria','Beiruti',sans-serif;
}
@media (min-width:900px){:root{--hdr:76px}}
h1,h2,h3{font-family:var(--f-head);font-weight:700;letter-spacing:0}
h2{font-size:clamp(16px,2.21vw,22.5px)}
h3{font-weight:600}

/* ---------- Buttons: smaller, calmer, one clear primary ---------- */
.btn{height:40px;padding:0 16px;border-radius:10px;font-size:11.5px;font-weight:600;gap:6px;border:1px solid var(--line);background:var(--surface);color:var(--text);transition:background .2s,border-color .2s,color .2s}
.btn:hover{border-color:var(--gold);text-decoration:none}
.btn svg.i{width:16px;height:16px}
.btn-gold{background:var(--gold);border-color:var(--gold);color:#17140F}
.btn-gold:hover{background:var(--gold-l);border-color:var(--gold-l)}
.btn-ink{background:var(--hx2);border-color:var(--hx2);color:var(--gold-l)}
.btn-ink:hover{border-color:var(--gold)}
.btn-sm{height:34px;padding:0 12px;font-size:10.5px;border-radius:9px}
.btn-block{height:44px;border-radius:12px}
.btn-icon{width:40px;padding:0}
.lk{display:inline-flex;align-items:center;gap:4px;color:var(--link);font-weight:600;font-size:11.5px;background:none;border:0;padding:0;cursor:pointer}
.lk::after{content:"←";font-size:.95em}
.lk:hover{text-decoration:underline}
.dkz .btn,.cine .btn{background:transparent;border-color:rgba(245,239,227,.3);color:var(--hx-t)}
.dkz .btn:hover,.cine .btn:hover{border-color:var(--gold-l)}
.dkz .btn-gold,.cine .btn-gold{background:var(--gold);border-color:var(--gold);color:#17140F}
.dkz .btn-gold:hover,.cine .btn-gold:hover{background:var(--gold-l);border-color:var(--gold-l)}
.dkz .lk,.cine .lk{color:var(--gold-l)}

/* ---------- Header: dark, quiet ---------- */
.site-header{background:var(--hx);border-bottom:1px solid var(--hx-line);color:var(--hx-t)}
.site-header.scrolled{border-bottom-color:var(--hx-line)}
.brand,.brand span{color:var(--gold-l)}
.hdr-nav a{color:#d8cdb7;border-radius:9px}
.hdr-nav a:hover,.hdr-nav a.on{color:var(--gold-l);background:rgba(255,255,255,.06)}
.hdr-act .btn{height:36px;font-size:10.5px;padding:0 12px;border-radius:9px;background:transparent;border-color:rgba(245,239,227,.22);color:var(--hx-t)}
.hdr-act .btn:hover{border-color:var(--gold-l)}
.hdr-act .btn-icon{width:36px}

/* ---------- Shared pieces ---------- */
.eyeb{display:inline-flex;align-items:center;gap:10px;color:var(--link);font-size:10px;font-weight:700;letter-spacing:.02em}
.eyeb::before{content:"";width:20px;height:2px;background:currentColor;flex:none}
.dkz .eyeb,.cine .eyeb{color:var(--gold-l)}
.sh{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.sh h2{margin-top:4px}
.sh p{margin:4px 0 0;color:var(--muted);font-size:12px}
.band{padding:34px 0}
.band-soft{background:var(--s2)}
.band-dk{background:var(--hx);color:var(--hx-t)}
.band-dk .sh p{color:var(--hx-m)}
.seg{display:inline-flex;gap:3px;flex-wrap:wrap;background:var(--s2);border-radius:11px;padding:3px}
.seg button{border:0;background:transparent;border-radius:8px;padding:5px 12px;font-weight:600;color:var(--muted);font-size:11px;cursor:pointer;font-family:inherit}
.seg button[aria-selected="true"],.seg button[aria-pressed="true"]{background:var(--surface);color:var(--text);box-shadow:0 1px 6px rgba(0,0,0,.08)}
.dkz .seg,.band-dk .seg,.hx-verdict .seg{background:rgba(255,255,255,.07)}
.dkz .seg button,.band-dk .seg button,.hx-verdict .seg button{color:var(--hx-m)}
.dkz .seg button[aria-selected="true"],.band-dk .seg button[aria-selected="true"],.hx-verdict .seg button[aria-selected="true"]{background:var(--gold);color:#17140F}
[data-rv]{transition:opacity .6s ease,transform .6s ease}
.js-rv [data-rv]:not(.in){opacity:0;transform:translateY(14px)}
@media (prefers-reduced-motion:reduce){.js-rv [data-rv]{opacity:1!important;transform:none!important}}

/* ---------- Hero (cinematic) ---------- */
.hx-hero{position:relative;background:var(--hx);color:var(--hx-t);overflow:hidden;isolation:isolate;padding:22px 0 0}
.hx-bg{position:absolute;inset:-24px;width:calc(100% + 48px);height:calc(100% + 48px);max-width:none;object-fit:cover;filter:blur(5px) saturate(1.05);opacity:.5;z-index:-2}
.hx-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 12% 18%,rgba(201,162,74,.22),transparent 45%),linear-gradient(180deg,rgba(14,12,9,.45) 0%,rgba(14,12,9,.82) 55%,var(--hx) 100%)}
.hx-hero .crumbs{color:#bfb39c;padding:0 0 8px}
.hx-hero .crumbs a{color:#bfb39c}
.hx-tags{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0 10px}
.hx-tag{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:2px 11px;font-size:10px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#efe6d4;text-decoration:none}
.hx-tag.ok{background:rgba(63,94,46,.38);border-color:rgba(169,199,154,.4);color:#cfe5c2}
.hx-tag.gd{background:var(--gold);border-color:var(--gold);color:#17140F;font-weight:700}
a.hx-tag:hover{border-color:var(--gold-l);text-decoration:none}
.hx-hero h1{font-size:clamp(24.5px,4.6vw,43.5px);color:#fff;max-width:22ch;margin:6px 0 0;line-height:1.25}
.hx-sub{display:block;color:var(--hx-m);font-size:12px;margin-top:4px}
.hx-lead{font-size:clamp(12.5px,1.47vw,15px);color:#e2d7c2;max-width:62ch;margin:10px 0 0}
.hx-acts{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 10px;align-items:center}
.hx-mini{display:flex;gap:16px;flex-wrap:wrap;font-size:11px;color:#cfc4ad;margin-bottom:4px}
.hx-mini button,.hx-mini a{display:inline-flex;align-items:center;gap:5px;background:none;border:0;color:inherit;padding:0;font:inherit;cursor:pointer;text-decoration:none}
.hx-mini button:hover,.hx-mini a:hover{color:var(--gold-l)}
.hx-mini svg.i{width:15px;height:15px}
.hx-mini .fav.on svg{fill:currentColor;color:#e46a5a}
.hx-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--hx-line);border-radius:16px;overflow:hidden;margin-top:18px}
.hx-fact{background:rgba(23,20,15,.74);backdrop-filter:blur(6px);padding:13px 16px;min-width:0}
.hx-fact small{display:block;color:#b4a88f;font-size:10px}
.hx-fact strong{display:block;font-family:var(--f-head);font-size:clamp(15px,2.21vw,21px);color:#fff;line-height:1.3;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hx-fact strong em{font-style:normal;color:var(--gold-l);font-size:.58em;margin-inline-start:4px;font-weight:600}
.hx-facts.n3{grid-template-columns:repeat(3,1fr)}.hx-facts.n2{grid-template-columns:repeat(2,1fr)}
@media (max-width:760px){.hx-facts,.hx-facts.n3{grid-template-columns:repeat(2,1fr)}.hx-facts.n3 .hx-fact:last-child{grid-column:span 2}}
.hx-stories{display:flex;gap:14px;overflow-x:auto;scrollbar-width:none;padding:16px 2px 20px;margin-top:6px;border-top:1px solid var(--hx-line)}
.hx-stories::-webkit-scrollbar{display:none}
.hx-story{flex:none;width:72px;display:flex;flex-direction:column;align-items:center;gap:6px;background:none;border:0;color:#d8cdb7;cursor:pointer;font:inherit;font-size:10px;padding:0}
.hx-story .rg{width:64px;height:64px;border-radius:50%;padding:3px;background:conic-gradient(from 200deg,#E8CF8A,#8A6A2F,#E8CF8A);display:grid;place-items:center;transition:transform .2s}
.hx-story:hover .rg{transform:scale(1.06)}
.hx-story .rg span{position:relative;width:100%;height:100%;border-radius:50%;border:3px solid var(--hx);overflow:hidden;background:#2a2318;display:grid;place-items:center;color:#fff}
.hx-story .rg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hx-story .rg i{position:relative;font-style:normal;font-size:10.5px;font-weight:700;text-shadow:0 1px 4px rgba(0,0,0,.6)}
.hx-story .rg svg{position:relative;width:18px;height:18px;color:#fff;filter:drop-shadow(0 1px 3px rgba(0,0,0,.6))}
.hx-story.seen .rg{background:#4a4234}
.hx-hero.no-stories{padding-bottom:26px}

/* ---------- Sticky section tabs ---------- */
.hx-tabs{position:sticky;top:var(--hdr);z-index:30;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hx-tabs .wrap{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;padding-block:7px}
.hx-tabs .wrap::-webkit-scrollbar{display:none}
.hx-tabs a{flex:none;color:var(--muted);padding:6px 12px;border-radius:9px;font-weight:600;font-size:11.5px;text-decoration:none;transition:background .2s,color .2s}
.hx-tabs a:hover{color:var(--text);text-decoration:none}
.hx-tabs a.on{background:var(--hx2);color:var(--gold-l)}
:root[data-theme="dark"] .hx-tabs a.on{background:var(--gold);color:#17140F}
@media (min-width:900px){:root:not([data-theme="light"]) .hx-tabs a.on{background:var(--gold);color:#17140F}}

/* ---------- Hall layout ---------- */
.hx-lay{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:30px;align-items:start;padding-top:8px}
@media (max-width:999px){.hx-lay{grid-template-columns:1fr}.hx-side{display:none!important}}
.hx-lay>main,.hx-main{min-width:0}
.hx-main>.sec,.hx-main>section{scroll-margin-top:calc(var(--hdr) + 60px)}
.hx-main .sec{padding-top:30px}
.hx-main .sec-head h2{font-size:clamp(16px,2.21vw,21px)}
.hx-side{position:sticky;top:calc(var(--hdr) + 64px);display:grid;gap:12px;padding-top:30px}
.sd-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--rl);padding:16px}
.sd-card.gold{border-top:3px solid var(--gold)}
.sd-price small{display:block;color:var(--muted);font-size:10px}
.sd-price b{display:block;font-family:var(--f-head);font-size:21px;line-height:1.3}
.sd-card .tier-meter{margin:6px 0 10px}
.sd-card .btn{width:100%}
.sd-card .lk{display:flex;justify-content:center;margin-top:10px}
.sd-card .sd-t{display:block;font-weight:700;margin-bottom:6px}
.sd-ask{display:flex;gap:6px}
.sd-ask input{flex:1;min-width:0;border:1px solid var(--line);border-radius:10px;padding:7px 11px;font:inherit;font-size:11.5px;background:var(--bg);color:var(--text)}
.sd-ask button{height:36px;padding:0 12px;border-radius:9px;border:0;background:var(--hx2);color:var(--gold-l);font:inherit;font-weight:700;cursor:pointer}
.sd-short{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:10px;color:var(--muted)}
.sd-short input{direction:ltr;border:0;background:var(--s2);border-radius:7px;padding:2px 8px;font:inherit;font-size:10px;color:var(--text);flex:1;min-width:0;cursor:copy}
.sd-upd{font-size:10px;color:var(--muted);margin:8px 0 0}

/* badges strip as interactive medals */
.hx-main .bdg-strip{margin:0}
.hx-main .bdg-items{flex-wrap:wrap;gap:8px;overflow:visible}
.hx-main .bdg-it{flex-direction:row;width:auto;gap:8px;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:5px 14px 5px 6px;font-size:11px;text-align:start;transition:border-color .2s,transform .2s}
.hx-main .bdg-it:hover{border-color:var(--gold);transform:translateY(-2px)}
.hx-main .bdg-it .bdg{width:32px!important;height:32px!important}
.hx-main .bdg-it:first-child .bdg{animation:afMedal 2.4s infinite}
@keyframes afMedal{0%,100%{box-shadow:0 0 0 0 rgba(201,162,74,.5)}60%{box-shadow:0 0 0 9px rgba(201,162,74,0)}}

/* gallery bento */
.hx-bento{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:170px 170px;gap:8px;border-radius:var(--rl);overflow:hidden}
.hx-bento button{position:relative;border:0;padding:0;background:var(--img);cursor:zoom-in;overflow:hidden}
.hx-bento img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.hx-bento button:hover img{transform:scale(1.04)}
.hx-bento button:first-child{grid-row:span 2}
.hx-bento .all{position:absolute;bottom:10px;inset-inline-end:10px;background:rgba(14,12,9,.82);color:var(--hx-t);border-radius:999px;padding:3px 12px;font-size:10px;font-weight:700}
.hx-bento.c1{grid-template-columns:1fr;grid-template-rows:320px}.hx-bento.c1 button:first-child{grid-row:auto}
.hx-bento.c2{grid-template-columns:2fr 1fr;grid-template-rows:170px 170px}
.hx-bento.c3{grid-template-columns:2fr 1fr}
.hx-bento.c4 button:nth-child(4){grid-column:span 2}
@media (max-width:620px){.hx-bento,.hx-bento.c2,.hx-bento.c3,.hx-bento.c4{grid-template-columns:1fr 1fr;grid-template-rows:210px 110px 110px}.hx-bento button:first-child{grid-column:span 2;grid-row:auto}.hx-bento button:nth-child(n+6){display:none}.hx-bento.c4 button:nth-child(4){grid-column:span 2}}

/* verdict + score */
.hx-verdict{background:var(--hx2);color:var(--hx-t);border-radius:var(--rl);padding:20px;position:relative;overflow:hidden}
.hx-verdict::after{content:"";position:absolute;inset-inline-end:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(201,162,74,.26),transparent 70%);pointer-events:none}
.hx-vtop{display:flex;align-items:center;gap:16px;flex-wrap:wrap;position:relative;z-index:1}
.hx-ring{width:82px;height:82px;border-radius:50%;background:conic-gradient(var(--gold) calc(var(--p,0)*1%),rgba(255,255,255,.09) 0);display:grid;place-items:center;flex:none;transition:--p 1s}
.hx-ring b{width:64px;height:64px;border-radius:50%;background:var(--hx2);display:grid;place-items:center;font-family:var(--f-head);font-size:18px;color:#fff;line-height:1}
.hx-ring b small{display:block;font-size:10px;color:var(--hx-m);font-family:var(--f-body);margin-top:-14px}
.hx-vtop h3{font-size:15px;color:#fff;margin:2px 0}
.hx-vtop p{margin:0;color:var(--hx-m);font-size:11px}
.hx-verdict q{display:block;quotes:none;font-size:13px;color:#efe4cd;margin:14px 0 0;position:relative;z-index:1}
.hx-verdict .seg{margin:14px 0 10px;position:relative;z-index:1}
.hx-vp{position:relative;z-index:1;margin:0;padding:0;list-style:none;display:grid;gap:7px}
.hx-vp li{display:flex;gap:10px;align-items:flex-start;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:11px;padding:8px 12px;font-size:12px}
.hx-vp li::before{content:"◆";flex:none;color:var(--gold-l);font-size:10px;margin-top:6px}
.hx-vp[data-k="con"] li::before{color:#e8a08f}
.hx-vp[hidden]{display:none}
.hx-vlbl{display:block;font-size:10px;color:var(--gold-l);font-weight:700;margin:12px 0 6px;position:relative;z-index:1}
.js-tabs .hx-vlbl{display:none}
.hx-sum{color:#ddd2bd;font-size:12px;margin:12px 0 0;position:relative;z-index:1}
.hx-bars{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:6px 18px;position:relative;z-index:1}
@media (max-width:620px){.hx-bars{grid-template-columns:1fr}}
.hx-bars a{display:grid;grid-template-columns:22px 1fr auto;gap:8px;align-items:center;color:#e6dbc5;font-size:11px;text-decoration:none}
.hx-bars a:hover{color:var(--gold-l)}
.hx-bars .ic svg{width:16px;height:16px;color:var(--gold-l)}
.hx-bars .br{grid-column:2/4;height:4px;border-radius:4px;background:rgba(255,255,255,.08);overflow:hidden;margin-top:-4px}
.hx-bars .br i{display:block;height:100%;width:0;background:linear-gradient(90deg,#8A6A2F,#E3C273);transition:width 1.1s cubic-bezier(.2,.8,.2,1)}
.hx-bars em{font-style:normal;color:var(--hx-m)}

/* axes as expandable rows */
.axes.v2{display:grid;gap:8px;grid-template-columns:1fr}
.axes.v2 .axis{padding:0;border:1px solid var(--line);background:var(--surface);border-radius:14px;overflow:hidden}
.axes.v2 summary{list-style:none;display:grid;grid-template-columns:40px 1fr auto 16px;gap:12px;align-items:center;padding:11px 14px;cursor:pointer}
.axes.v2 summary::-webkit-details-marker{display:none}
.axes.v2 .axi{width:40px;height:40px;border-radius:12px;background:var(--hx2);display:grid;place-items:center;color:var(--gold-l)}
.axes.v2 .axis-info .axi{background:var(--s2);color:var(--link)}
.axes.v2 .axs{flex-direction:row;align-items:center}
.axes.v2 .axf{padding-top:10px}
.axes.v2 summary:hover .axt h3{color:var(--link)}
.axes.v2 .axt h3{font-size:12px;margin:0}
.axes.v2 .axt small{display:block;color:var(--muted);font-size:10px;line-height:1.4}
.axes.v2 .axbar{display:block;height:5px;border-radius:5px;background:var(--s2);margin-top:6px;overflow:hidden}
.axes.v2 .axbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#8A6A2F,#E3C273);transition:width 1.1s cubic-bezier(.2,.8,.2,1)}
.axes.v2 .axs{display:flex;align-items:center;gap:6px;white-space:nowrap}
.axes.v2 .axs b{font-family:var(--f-head);font-size:12px}
.axes.v2 .axs em{font-style:normal;color:var(--muted);font-size:10px}
.axes.v2 .chev{color:var(--muted);transition:transform .25s;font-size:11.5px}
.axes.v2 details[open] .chev{transform:rotate(180deg)}
.axes.v2 .axf{padding:2px 14px 14px;margin:0;border-top:1px dashed var(--line)}
@media (max-width:520px){.axes.v2 summary{grid-template-columns:34px 1fr auto;gap:10px}.axes.v2 .axi{width:34px;height:34px}.axes.v2 .chev{display:none}.axes.v2 .axs b{display:none}}

/* ---------- Cinematic banners ---------- */
.cine{position:relative;border-radius:var(--rl);overflow:hidden;color:var(--hx-t);background:var(--hx);isolation:isolate;min-height:270px;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:18px;padding:30px}
.cine::before{content:"";position:absolute;inset:-20px;z-index:-2;background:var(--cine,none) center/cover;filter:blur(7px) brightness(.5)}
.cine::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 75% 40%,rgba(232,207,138,.26),transparent 45%),linear-gradient(90deg,rgba(14,12,9,.25),rgba(14,12,9,.8))}
.cine h2,.cine h3{font-size:clamp(18px,2.76vw,26px);color:#fff;line-height:1.4;margin:6px 0 0}
.cine h2 span,.cine h3 span{color:var(--gold-l)}
.cine p{color:#ddd2bd;margin:8px 0 14px;max-width:48ch;font-size:12px}
.cine .sp{position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(2px 2px at 20% 30%,#f5dc95,transparent),radial-gradient(1.5px 1.5px at 70% 20%,#f5dc95,transparent),radial-gradient(2px 2px at 85% 75%,#f5dc95,transparent),radial-gradient(1px 1px at 55% 60%,#fff,transparent),radial-gradient(1.5px 1.5px at 35% 85%,#f5dc95,transparent);animation:afTw 4s ease-in-out infinite alternate}
@keyframes afTw{from{opacity:.35}to{opacity:1}}
.cine-t{min-width:0}
@media (max-width:720px){.cine{grid-template-columns:1fr;padding:22px;text-align:center}.cine p{margin-inline:auto}.cine-dev{order:-1}.cine .chips2,.cine .hx-acts{justify-content:center}.cine .eyeb{justify-content:center}}
.cine-dev{display:flex;justify-content:center}
.phone{width:min(200px,62%);aspect-ratio:9/18.5;border-radius:28px;padding:7px;background:linear-gradient(160deg,rgba(255,255,255,.32),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.32);box-shadow:0 0 38px rgba(232,207,138,.4),inset 0 0 0 1px rgba(232,207,138,.38);transform:rotate(-4deg);transition:transform .4s}
@media (max-width:720px){.phone{width:150px}}
.cine:hover .phone{transform:rotate(0) translateY(-4px)}
.screen{height:100%;border-radius:22px;overflow:hidden;background:#0e0c09;display:flex;flex-direction:column}
.chat{padding:11px 9px;display:flex;flex-direction:column;gap:7px;font-size:10px;line-height:1.5;text-align:start}
.chat .h{display:flex;align-items:center;gap:6px;color:var(--gold-l);font-weight:700;border-bottom:1px solid rgba(255,255,255,.08);padding-bottom:7px;font-size:10px}
.chat .h i{width:20px;height:20px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#f6dc8f,#a57a2c);display:grid;place-items:center;color:#17140F;font-style:normal;font-size:10px}
.bub{max-width:88%;padding:6px 9px;border-radius:11px;opacity:0;transform:translateY(6px);animation:afIn .5s forwards}
.bub.u{align-self:flex-start;background:var(--gold);color:#17140F;border-bottom-left-radius:4px}
.bub.a{align-self:flex-end;background:#2a251c;color:#efe6d4;border-bottom-right-radius:4px}
.chat .bub:nth-child(3){animation-delay:.6s}.chat .bub:nth-child(4){animation-delay:1.4s}
@keyframes afIn{to{opacity:1;transform:none}}
.inv{flex:1;background:linear-gradient(180deg,#f7f0e1,#efe2c6);color:#4a3a1c;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:12px;gap:5px;font-size:10px}
.inv .seal{width:42px;height:42px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#c9473c,#7c1d16);color:#f3d9a4;display:grid;place-items:center;font-family:var(--f-head);font-size:10px}
.inv b{font-family:var(--f-head);font-size:13px;color:#2d2110}
.inv .zg{margin-top:5px;background:#2d2110;color:#efd9a0;border-radius:999px;padding:2px 10px;font-size:10px}
.chips2{display:flex;gap:6px;flex-wrap:wrap}
.chips2 button,.chips2 a{border:1px solid rgba(232,207,138,.4);background:rgba(14,12,9,.42);color:#efe2c4;border-radius:999px;padding:4px 12px;font:inherit;font-size:10.5px;cursor:pointer;text-decoration:none}
.chips2 button:hover,.chips2 a:hover{background:var(--gold);color:#17140F;border-color:var(--gold);text-decoration:none}
.fh-cine-f{display:flex;gap:6px;background:#17140F;border:1px solid rgba(232,207,138,.35);border-radius:12px;padding:4px;margin-top:12px;max-width:460px}
@media (max-width:720px){.fh-cine-f{margin-inline:auto}}
.fh-cine-f input{flex:1;min-width:0;border:0;background:none;font:inherit;font-size:12px;padding:6px 10px;color:#F5EFE3;outline:0}
.fh-cine-f button{border:0;background:var(--gold);color:#17140F;font:inherit;font-weight:700;border-radius:9px;padding:0 16px;height:36px;cursor:pointer}
.fh-cine-f button:hover{background:var(--gold-l)}
.fh-cine{margin:0}
.hx-main .fh-cine,.hx-main .wh-empty{padding-top:30px}
.wh-empty .wh-cta{display:none}

/* 360 banner */
.ts2-b{position:relative;margin:0;border-radius:var(--rl);overflow:hidden;box-shadow:0 18px 44px rgba(14,12,9,.22);background:var(--hx)}
.ts2-b img{width:100%;height:auto;display:block}
.ts2-soon{position:absolute;top:12px;inset-inline-start:12px;background:rgba(14,12,9,.78);border:1px solid rgba(232,207,138,.5);color:var(--gold-l);border-radius:999px;padding:2px 14px;font-weight:700;font-size:10.5px;backdrop-filter:blur(4px)}
.ts2-pts{display:flex;gap:6px 16px;flex-wrap:wrap;list-style:none;margin:10px 0 0;padding:0;color:var(--muted);font-size:11px}
.ts2-pts li::before{content:"◆ ";color:var(--gold)}
.ts-pn .ts2-b{box-shadow:none}

/* ---------- Mobile CTA bar (hall) ---------- */
.cta-bar{gap:8px}
.cta-bar .btn{height:42px;border-radius:11px;font-size:11.5px}

/* ---------- Home ---------- */
.hx-home{padding:46px 0 30px}
@media (min-width:900px){.hx-home{padding:80px 0 40px;min-height:520px}}
.hx-home h1{max-width:20ch}
.sbox{display:grid;grid-template-columns:1.2fr 1fr 1fr auto;background:#17140F;border:1px solid rgba(232,207,138,.28);border-radius:14px;padding:5px;margin-top:22px;max-width:820px;box-shadow:0 18px 44px rgba(0,0,0,.35)}
.sbox label{display:flex;flex-direction:column;padding:4px 12px;border-inline-start:1px solid #2A251C;font-size:10px;color:#A39A89;font-weight:700;min-width:0}
.sbox label:first-child{border:0}
.sbox select,.sbox input{border:0;background:none;font:inherit;font-size:12px;color:#F5EFE3;padding:1px 0;outline:none;font-weight:600;width:100%;min-width:0}
.sbox .btn{height:auto;min-height:46px;align-self:stretch;padding:0 22px}
@media (max-width:760px){.sbox{grid-template-columns:1fr 1fr}.sbox label:first-child{grid-column:span 2}.sbox label{border:0;border-top:1px solid #2A251C;padding:7px 12px}.sbox .btn{grid-column:span 2;margin-top:4px}}
.qchips{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}
.qchips a{border:1px solid rgba(232,207,138,.35);background:rgba(14,12,9,.38);color:#efe2c4;border-radius:999px;padding:3px 13px;font-size:10.5px;text-decoration:none;display:inline-flex;align-items:center;gap:5px}
.qchips a:hover{background:var(--gold);color:#17140F;border-color:var(--gold);text-decoration:none}
.qchips svg.i{width:14px;height:14px}

/* podium «الأعلى هذا الشهر» */
.pod{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:14px;align-items:end}
.pod[hidden]{display:none}
.pod.anim{animation:afPod .45s ease}
@keyframes afPod{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.pc{position:relative;border-radius:var(--rl);overflow:hidden;color:#fff;min-height:240px;display:flex;flex-direction:column;justify-content:flex-end;padding:14px;text-decoration:none;isolation:isolate;background:#2a2318;transition:transform .3s}
.pc:hover{transform:translateY(-4px);text-decoration:none}
.pc>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .6s}
.pc:hover>img{transform:scale(1.06)}
.pc::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 30%,rgba(14,12,9,.92))}
.pc.first{min-height:300px;box-shadow:0 0 0 2px var(--gold),0 18px 44px rgba(201,162,74,.22)}
.pc .rk{position:absolute;top:12px;inset-inline-start:12px;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-family:var(--f-head);font-weight:700;font-size:14.5px;background:rgba(14,12,9,.72);border:1px solid rgba(232,207,138,.5);color:var(--gold-l)}
.pc.first .rk{background:var(--gold);color:#17140F;border:0}
.pc .chg{position:absolute;top:18px;inset-inline-end:12px;font-size:10px;background:rgba(63,94,46,.88);border-radius:999px;padding:1px 9px;font-weight:700}
.pc .chg.dn{background:rgba(120,50,40,.85)}
.pc-t b{display:block;font-family:var(--f-head);font-size:14.5px;line-height:1.35}
.pc-t small{color:#ddd2bd;font-size:10.5px}
.pc .vis{display:flex;align-items:center;gap:8px;margin-top:6px;font-size:10px;color:var(--gold-l)}
.pc .vis i{flex:1;height:4px;border-radius:4px;background:rgba(255,255,255,.15);overflow:hidden}
.pc .vis i b{display:block;height:100%;width:0;background:var(--gold);transition:width 1s}
.pod.in .vis i b,.pod.anim .vis i b{width:var(--w)}
@media (max-width:760px){.pod{grid-template-columns:1fr}.pod .pc.first{order:-1}.pc,.pc.first{min-height:170px}}

/* areas bento */
.areas{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:170px 170px;gap:10px}
.areas a{position:relative;border-radius:18px;overflow:hidden;color:#fff;text-decoration:none;display:flex;flex-direction:column;justify-content:flex-end;padding:14px;isolation:isolate;background:#2a2318}
.areas a:first-child{grid-row:span 2}
.areas img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .6s}
.areas a:hover img{transform:scale(1.07)}
.areas a::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 35%,rgba(14,12,9,.88))}
.areas b{font-family:var(--f-head);font-size:15px}.areas small{color:#e1d6c0;font-size:10.5px}
.areas a:hover{text-decoration:none}
.areas.n2{grid-template-columns:1fr 1fr;grid-template-rows:200px}.areas.n2 a:first-child{grid-row:auto}
.areas.n3{grid-template-columns:2fr 1fr}.areas.n4 a:nth-child(4){grid-column:span 2}
@media (max-width:700px){.areas,.areas.n3,.areas.n4{grid-template-columns:1fr 1fr;grid-template-rows:auto;grid-auto-rows:120px}.areas a:first-child{grid-column:span 2;grid-row:auto;min-height:160px}}

/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;counter-reset:st}
@media (max-width:760px){.steps{grid-template-columns:1fr}}
.step{position:relative;display:block;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:18px;color:var(--text);transition:border-color .2s,transform .2s}
.step:hover{border-color:var(--gold);transform:translateY(-3px);text-decoration:none}
.step::before{counter-increment:st;content:counter(st);position:absolute;top:12px;inset-inline-end:16px;font-family:var(--f-head);font-size:34px;line-height:1;color:color-mix(in srgb,var(--gold) 28%,transparent);font-weight:700}
.step h3{font-size:14px;margin:0 0 4px}
.step p{margin:0 0 10px;color:var(--muted);font-size:12px}

/* supplier category tiles */
.scats{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
@media (max-width:860px){.scats{grid-template-columns:repeat(3,1fr)}}
.scat{display:block;text-align:center;border-radius:16px;padding:14px 8px;background:rgba(255,255,255,.04);border:1px solid var(--hx-line);color:var(--hx-t);transition:border-color .2s,transform .2s}
.scat:hover{border-color:var(--gold);transform:translateY(-3px);text-decoration:none}
.scat i{display:grid;place-items:center;width:44px;height:44px;margin:0 auto 6px;border-radius:13px;background:rgba(201,162,74,.14);font-style:normal;font-size:16px;color:var(--gold-l)}
.scat i img{width:26px;height:26px;object-fit:contain}
.scat b{display:block;font-size:11.5px}.scat small{color:var(--hx-m);font-size:10px}

/* home hall cards: hover lift */
.hall-card{transition:transform .25s,box-shadow .25s}
.hall-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(14,12,9,.12)}
.home-v2 .rail{padding-bottom:6px}
.cine.addhall{min-height:0;display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.addhall .cine-t{max-width:60ch}

/* footer tune */
.site-footer{background:var(--hx);color:#bfb39c}
.site-footer h3{color:var(--gold-l);font-family:var(--f-head)}
.site-footer a{color:#d8cdb7}
.site-footer a:hover{color:var(--gold-l)}
.site-footer .btn-gold{color:#17140F}
.hx-mini .fav{position:static;width:auto;height:auto;border-radius:0;background:none;color:inherit;display:inline-flex;z-index:auto}
.hx-mini .fav.on svg{fill:#e46a5a;stroke:#e46a5a}

/* ---------- 2.1: home intro slides · search · app line · feed in hero ---------- */
.hx-intro{padding:40px 0 18px}
@media (min-width:900px){.hx-intro{padding:64px 0 22px}}
.hs{position:relative;display:grid}
.hs-s{grid-area:1/1;opacity:0;transform:translateY(12px);transition:opacity .6s ease,transform .6s ease;visibility:hidden}
.hs-s.on{opacity:1;transform:none;visibility:visible}
.hs-s h1,.hs-t{font-family:var(--f-head);font-weight:700;font-size:clamp(24.5px,4.6vw,45.5px);color:#fff;max-width:20ch;margin:8px 0 0;line-height:1.25}
.hs-s h1 span,.hs-t span{color:var(--gold-l)}
.hs-dots{display:flex;gap:8px;margin:20px 0 0}
.hs-dots button{width:30px;height:4px;border-radius:4px;border:0;padding:0;background:rgba(255,255,255,.2);cursor:pointer;position:relative;overflow:hidden}
.hs-dots button[aria-selected="true"]::after{content:"";position:absolute;inset:0;background:var(--gold);transform-origin:right;animation:afHs var(--hs,7s) linear forwards}
@keyframes afHs{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.hs-search{display:flex;gap:6px;align-items:center;background:#17140F;border:1px solid rgba(232,207,138,.35);border-radius:13px;padding:4px;max-width:600px;margin-top:22px;box-shadow:0 16px 40px rgba(0,0,0,.3)}
.hs-search input{flex:1;min-width:0;border:0;background:none;font:inherit;font-size:12px;padding:7px 12px;outline:0;color:#F5EFE3}
.hs-near{display:inline-flex;align-items:center;gap:4px;color:#BDB29C;font-size:10.5px;font-weight:600;padding:0 8px;white-space:nowrap;text-decoration:none!important}
.hs-near:hover{color:#E8CF8A}
.hs-search .btn{height:40px}
@media (max-width:520px){.hs-near span{display:none}}
.app-line{display:flex;align-items:center;gap:8px;margin:16px 0 0;padding-top:12px;border-top:1px solid var(--hx-line);color:#d8cdb7;font-size:11.5px;white-space:nowrap;min-width:0}
.app-line img{width:30px;height:30px;border-radius:8px;object-fit:cover;flex:none}
.app-line em{font-style:normal;background:var(--gold);color:#17140F;border-radius:999px;padding:0 9px;font-size:10px;font-weight:700;flex:none}
.app-line .al-t{min-width:0;overflow:hidden;text-overflow:ellipsis}
.app-line b{color:#fff;font-weight:700}
.app-line a{color:var(--gold-l)}
@media (max-width:600px){.app-line{font-size:10.5px;gap:7px}.app-line .al-gl{display:none}}
.hx-intro .afd{margin:16px 0 0}
/* bell in the dark header */
.hdr-act .afn-bell{color:var(--hx-t)}
/* hall: news line sits on the content band */
.hx-main>.afd-line{margin-top:20px}

/* 2.1.1: header on small phones — logo name on one line, account shows the avatar only */
@media (max-width:520px){.brand img{width:36px;height:36px}.brand span{font-size:13px;white-space:nowrap}.hdr-acc span:not(.au-av){display:none}.hdr-acc{width:36px;padding:0}.hdr{gap:6px}}

/* 2.2: Farha in the cinematic banners (uploaded full image) */
.cine-fig{position:relative;align-self:stretch;display:flex;align-items:flex-end;justify-content:center;margin:-30px 0 -30px;min-height:280px}
.cine-fig img{width:min(320px,100%);height:auto;display:block;-webkit-mask-image:radial-gradient(ellipse 44% 72% at 50% 60%,#000 42%,transparent 88%);mask-image:radial-gradient(ellipse 44% 72% at 50% 60%,#000 42%,transparent 88%);transition:transform .5s}
.cine:hover .cine-fig img{transform:translateY(-4px)}
.cine-say{position:absolute;top:30px;left:8%;z-index:2;background:#211D16;color:#F5EFE3;border:1px solid rgba(232,207,138,.4);border-radius:16px 16px 16px 4px;padding:7px 13px;font-weight:700;font-size:11.5px;box-shadow:0 10px 26px rgba(0,0,0,.3);animation:afIn .6s .3s both;max-width:200px;line-height:1.5}
@media (max-width:720px){.cine-fig{order:-1;margin:-22px -22px 0;min-height:220px}.cine-fig img{width:230px}.cine-say{top:14px;left:10%}}

/* ---------- 2.2: about · story · 404 ---------- */
.meet{display:block;width:120px;height:24px;margin:14px 0;color:var(--gold)}
.ab-hero{padding:46px 0 40px}
@media (min-width:900px){.ab-hero{padding:72px 0 56px}}
.ab-hero h1{max-width:16ch}
.ab-hero h1 span{color:var(--gold-l)}
.ab-sig2{display:inline-block;font-family:'Aref Ruqaa','Amiri',serif;font-size:19.5px;color:var(--gold-l);line-height:1.2}
.band .ab-sig2{color:var(--link)}
.ab-letter{display:grid;grid-template-columns:1fr 1.4fr;gap:40px;align-items:start}
.ab-letter.no-ph{grid-template-columns:1fr;max-width:760px}
@media (max-width:800px){.ab-letter{grid-template-columns:1fr;gap:20px}}
.ab-ph{margin:0;border-radius:22px;overflow:hidden;aspect-ratio:4/5;background:var(--s2)}
.ab-ph img{width:100%;height:100%;object-fit:cover}
.ab-txt h2{margin:6px 0 16px;font-size:clamp(19.5px,2.76vw,27.5px)}
.ab-txt p{font-size:14px;margin:0 0 14px}
.ab-q{font-family:var(--f-head);font-size:16px!important;border-inline-start:3px solid var(--gold);padding-inline-start:14px;line-height:1.6}
.ab-wm{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:24px}
@media (max-width:700px){.ab-wm{grid-template-columns:1fr}}
.ab-wl{width:110px;height:110px;border-radius:22px;background:var(--s2);display:grid;place-items:center;overflow:hidden;color:var(--muted);font-family:var(--f-head);font-size:11.5px;text-align:center;padding:10px}
.ab-wl img{max-width:100%;max-height:100%;object-fit:contain}
.ab-wm h2{font-size:clamp(15px,2.02vw,19.5px);margin:4px 0 6px}
.ab-wm p{margin:0}
.ab-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.ab-tags span{border:1px solid var(--line);border-radius:999px;padding:1px 12px;font-size:10.5px;color:var(--muted)}
.ab-vals{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:20px}
@media (max-width:900px){.ab-vals{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.ab-vals{grid-template-columns:1fr}}
.ab-vals div{border-top:2px solid var(--gold);padding-top:12px}
.ab-vals b{font-family:var(--f-head);font-size:14px;color:#fff;display:block}
.ab-vals p{margin:6px 0 0;color:var(--hx-m);font-size:12px}
.ab-team{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width:760px){.ab-team{grid-template-columns:1fr}}
.ab-tm{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:20px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:2px}
.ab-tm b{font-family:var(--f-head);font-size:14px}
.ab-tm small{color:var(--muted)}
.ab-av{width:88px;height:88px;border-radius:50%;overflow:hidden;margin-bottom:10px;display:grid;place-items:center;background:var(--s2);font-family:var(--f-head);font-size:24.5px;color:var(--link);box-shadow:0 0 0 2px var(--gold),0 0 0 5px rgba(201,162,74,.18)}
.ab-av img{width:100%;height:100%;object-fit:cover}
.ab-tm.f{background:var(--hx2);border-color:var(--hx2);color:var(--hx-t)}
.ab-tm.f b{color:var(--gold-l)}.ab-tm.f small{color:var(--hx-m)}
.ab-tm.f .ab-av{animation:afBr 3.2s ease-in-out infinite;background:#0e0c09}
.ab-tm.f .lk{color:var(--gold-l);margin-top:8px}
@keyframes afBr{0%,100%{box-shadow:0 0 0 2px var(--gold),0 0 0 5px rgba(201,162,74,.18)}50%{box-shadow:0 0 0 2px var(--gold),0 0 0 10px rgba(201,162,74,.05)}}
.ab-rules{margin:0;padding-inline-start:20px;display:grid;gap:8px}
.ab-ct{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width:860px){.ab-ct{grid-template-columns:1fr}}
.ab-c{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:18px;display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.ab-c b{font-family:var(--f-head);font-size:13px}
.ab-c p{margin:0;color:var(--muted);font-size:12px;flex:1}
.ab-close{text-align:center;padding:50px 0 60px}
.ab-close p{font-family:var(--f-head);font-size:clamp(16px,2.58vw,22.5px);max-width:26ch;margin:0 auto;line-height:1.6}
.ab-close .meet{margin:18px auto}
.ab-close .hx-acts{justify-content:center}
/* footer story line */
.ft-story{color:#cfc4ad}
.ft-story em{font-style:normal;font-family:'Aref Ruqaa','Amiri',serif;color:var(--gold-l);font-size:1.15em}
/* home story strip */
.story-strip{background:var(--hx2);color:var(--hx-t);padding:22px 0;border-top:1px solid var(--hx-line)}
.story-strip .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.story-strip p{margin:0;font-family:var(--f-head);font-size:clamp(13px,1.84vw,15px)}
.story-strip p span{color:var(--hx-m);font-family:var(--f-body);font-size:.9em}
.story-strip .lk{color:var(--gold-l)}
/* 404 */
.nf2{padding:60px 0 70px;text-align:center}
.nf2 .wrap{display:flex;flex-direction:column;align-items:center}
.nf2-n{font-family:var(--f-head);font-size:clamp(65px,12.88vw,121.5px);font-weight:700;line-height:1;color:transparent;-webkit-text-stroke:1.5px var(--gold-l)}
.nf2 h1{margin:8px auto 0}
.nf2 .hx-lead{margin-inline:auto}
.nf2 .hs-search{width:100%}
.nf2 .qchips{justify-content:center}

/* ---------- 2.2: page heroes (halls, areas, offers, suppliers) ---------- */
.pg-hero{padding:24px 0 26px}
@media (min-width:900px){.pg-hero{padding:34px 0 32px}}
.pg-hero h1{font-size:clamp(22.5px,4.05vw,38.5px)}
.pg-hero .hx-lead p{margin:0 0 8px}
.pg-hero .afd{margin:18px 0 0}
.pg-short .hx-facts{max-width:640px}
.hx-facts.n1{grid-template-columns:1fr;max-width:260px}
.pg-tiers{margin-top:16px}
.pg-tiers .tier-chips{margin:0}
.area-intro2{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:16px 18px;margin:20px 0 6px}
.area-intro2 p:last-child,.area-intro2 .prose>*:last-child{margin-bottom:0}
/* supplier hero */
.sp-hero{padding-bottom:0}
.sp-hero .hx-facts{margin-top:18px}
.sp-hero:not(:has(.hx-stories)){padding-bottom:26px}
.sp-hid{display:flex;align-items:center;gap:14px;margin-top:6px}
.sp-hid .sp-lg{width:68px;height:68px;border-radius:18px;overflow:hidden;flex:none;background:#2a2318;display:grid;place-items:center;color:var(--gold-l);font-family:var(--f-head);font-size:21px;border:1px solid var(--hx-line)}
.sp-hid .sp-lg img{width:100%;height:100%;object-fit:cover}
.sp-hid h1{margin:0}
.hx-mini a img{width:18px;height:18px;border-radius:5px}
.sp-hero .btn img{width:18px;height:18px}
@media (max-width:520px){.sp-hid .sp-lg{width:54px;height:54px}}

/* ---------- 2.3: dark only — tokens at every width, native controls dark ---------- */
:root,:root[data-theme]{--bg:#0B0A08;--surface:#17140F;--s2:#211D16;--line:#2A251C;--text:#F5EFE3;--muted:#A39A89;--link:#E8CF8A;--img:#2A2318;--ink:#1E1A13;--ink-text:#F5EFE3;--ok-bg:#1E2A18;--ok-fg:#A9C79A;color-scheme:dark}
input,select,textarea{color-scheme:dark}
::placeholder{color:#8a8070}
.sbox select option,.hs-search input{background:#17140F;color:#F5EFE3}

/* 2.5 — buttons as Mohamed set them on the canvas: 24px pills, little space top/bottom,
   two side by side when needed (.btn-2). The tap area stays comfortable via ::after. */
.btn,.btn-sm,.btn-block,.cta-bar .btn,.hs-search .btn,.hdr-act .btn{height:24px;min-height:24px;padding:0 12px;border-radius:999px;font-size:10.5px;line-height:1;position:relative}
.btn-sm{padding:0 10px;font-size:10px}
.btn::after{content:"";position:absolute;inset:-10px -2px}
.sbox .btn{min-height:30px;height:auto}
.btn-2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.btn-2 .btn{width:100%}
.hdr-act .ib,.hdr .ib{width:34px;height:34px}
/* Family pages («أفراح عائلة …») */
.fam-pg{padding-block:24px 40px;display:flex;flex-direction:column;gap:26px}
.fam-sec h2{font:600 16px var(--f-head);margin:0 0 12px}
.fam-halls{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.fam-hall{display:flex;gap:10px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:8px;text-decoration:none;color:var(--text)}
.fam-hall img,.fam-hall i{width:56px;height:56px;border-radius:10px;object-fit:cover;background:var(--img);flex:none}
.fam-hall small{display:block;color:var(--muted);font-size:10.5px}
.fam-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px}
.fam-w{display:block;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px;text-decoration:none;color:var(--text)}
.fam-w small{display:block;color:var(--muted);font-size:10.5px}
.fam-note{color:var(--muted);font-size:10.5px;margin:12px 0 0}
.fam-cta{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;background:var(--surface);border:1px solid rgba(201,162,74,.35);border-radius:16px;padding:14px 16px}
.fam-cta span{flex:1;min-width:200px;color:var(--muted)}

/* 2.6 — exclusive gold icons (from the plugin) */
.step-ic{display:block;width:56px;height:56px;object-fit:contain;margin:0 0 8px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.45))}
.sup-ic2{display:block;width:52px;height:52px;object-fit:contain;margin:0 auto 6px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.45))}

/* ===== 2.8 ===== */
.fh-cine-f+.chips2{margin-top:14px}
@media (max-width:760px){
.steps{display:flex;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;margin-inline:-16px;padding:2px 16px 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.steps::-webkit-scrollbar{display:none}
.steps .step{flex:0 0 82%;scroll-snap-align:center}
.steps-dots{display:flex;justify-content:center;gap:6px;margin-top:12px}
.steps-dots i{width:6px;height:6px;border-radius:999px;background:rgba(232,207,138,.3);transition:width .25s,background .25s}
.steps-dots i.on{width:18px;background:var(--gold)}
}
@media (min-width:761px){.steps-dots{display:none}}

/* ===== 2.8 — header «الشريط الزجاجي» ===== */
.site-header.hdr-glass{background:transparent;border:0;padding:8px 0 0;top:0}
.hdr-glass .hdr{height:56px;padding:0 8px 0 10px;border-radius:18px;background:rgba(14,12,9,.62);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(232,207,138,.22);box-shadow:0 10px 30px rgba(0,0,0,.25)}
.hdr-glass.scrolled .hdr{background:rgba(14,12,9,.82)}
.hdr-glass .brand img{width:36px;height:36px;border-radius:11px}
.hdr-glass .brand span{font-size:13px;color:#E8CF8A}
.hdr-over{margin-bottom:-72px}
.hdr-glass .hdr-act{gap:6px}
.hdr-glass .afn-bell{width:36px;height:36px;min-height:36px;padding:0;border-radius:12px;background:rgba(242,234,219,.06);border:1px solid rgba(242,234,219,.14)}
.hdr-glass .afn-bell.has-ci .hdr-ci{width:24px;height:24px;object-fit:contain}
.hdr-glass .afn-bell .afn-n{background:#d3282e;box-shadow:0 0 0 2px #0B0907}
.hdr-glass .hdr-acc{height:36px;min-height:36px;padding:0 4px 0 12px;gap:8px;border-radius:999px;background:rgba(242,234,219,.06);border-color:rgba(242,234,219,.14)}
.hdr-glass .hdr-acc .au-av{width:30px;height:30px;padding:2px;background:linear-gradient(135deg,#E8CF8A,#8a6a2f)}
.hdr-glass .hdr-acc .au-av img{border-radius:50%;background:#1b1610}
.hdr-glass .hdr-acc .au-av img.au-ic{object-fit:contain;padding:1px}
.hdr-glass .hdr-add{height:30px;min-height:30px}
@media (max-width:899px){
.hdr-glass .hdr-add{display:none}
.hdr-glass .hdr-acc{width:36px;padding:0;justify-content:center;background:none;border:0}
.hdr-glass .hdr-acc span:not(.au-av):not(.au-av *){display:none}
.hdr-glass .hdr-acc .au-av{width:34px;height:34px}
.hdr-glass .wrap.hdr{margin-inline:10px;width:auto}
}
@media (min-width:900px){
.hdr-glass .hdr{height:62px;padding:0 10px 0 14px;border-radius:20px}
.hdr-glass .hdr-nav{gap:2px;margin-inline:auto}
.hdr-glass .hdr-nav a{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 11px;border-radius:999px;color:#e3d9c6;font-weight:600}
.hdr-glass .hdr-nav a img{width:20px;height:20px;object-fit:contain}
.hdr-glass .hdr-nav a.on{background:rgba(201,162,74,.16);color:#E8CF8A;box-shadow:inset 0 0 0 1px rgba(232,207,138,.35)}
.hdr-over{margin-bottom:-78px}
}
@media (min-width:900px) and (max-width:1180px){.hdr-glass .hdr-nav a img{display:none}.hdr-glass .hdr-nav a{padding:0 8px}}

/* ===== 2.8 — hero: clear Jordanian photo ===== */
.hx-home{padding-top:96px}
.hx-home .hx-pic{position:absolute;inset:0;z-index:-2;display:block}
.hx-home .hx-photo{width:100%;height:100%;object-fit:cover;display:block}
.hx-home.has-photo::after{background:linear-gradient(180deg,rgba(11,9,7,.45) 0%,rgba(11,9,7,.05) 22%,rgba(11,9,7,.15) 42%,rgba(11,9,7,.78) 68%,var(--hx) 100%)}
.hx-home.has-photo .hx-bg{display:none}
.hx-home h1.hx-kw{font-size:10.5px;line-height:1.5;font-weight:700;color:#E8CF8A;margin:0 0 4px;max-width:none;font-family:inherit;display:flex;align-items:center;gap:8px}
.hx-home h1.hx-kw::after{content:"";width:28px;height:2px;background:#E8CF8A}
.hx-home .hs-t.hs-big{font:700 clamp(27.5px,4.6vw,49.5px)/1.25 var(--f-head);color:#fff;max-width:20ch;margin:6px 0 0;text-shadow:0 2px 16px rgba(0,0,0,.45)}
.hx-home .hx-lead{text-shadow:0 1px 10px rgba(0,0,0,.5)}
.hx-home .hs-search{background:rgba(14,12,9,.72);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
@media (max-width:899px){
.hx-home{padding-top:46vh}
.hx-home.has-photo::after{background:linear-gradient(180deg,rgba(11,9,7,.35) 0%,rgba(11,9,7,0) 18%,rgba(11,9,7,0) 38%,rgba(11,9,7,.72) 58%,var(--hx) 82%)}
}
@media (min-width:900px){
.hx-home{padding-top:150px;min-height:600px}
.hx-home.has-photo::after{background:linear-gradient(270deg,rgba(11,9,7,.9) 0%,rgba(11,9,7,.6) 40%,rgba(11,9,7,.08) 75%),linear-gradient(180deg,rgba(11,9,7,.45),transparent 20%,transparent 80%,var(--hx) 100%)}
}

/* ===== 2.8 — bottom nav colored icons ===== */
.bottom-nav .bn-ci{width:26px;height:26px;object-fit:contain;filter:saturate(.75) brightness(.85);transition:transform .2s,filter .2s}
.bottom-nav a.on .bn-ci{filter:none;transform:translateY(-2px) scale(1.1)}
.bottom-nav a{position:relative}
.bottom-nav a.on::after{content:"";position:absolute;bottom:6px;left:50%;width:16px;height:3px;margin-left:-8px;border-radius:3px;background:var(--gold)}

/* ===== 2.8 — article card (simple) ===== */
.post-card{background:#15110c;border:1px solid rgba(232,207,138,.14);border-radius:18px;transition:border-color .2s,transform .2s}
.post-card:hover{border-color:rgba(232,207,138,.45);transform:translateY(-2px)}
.post-card .ph{position:relative;aspect-ratio:16/10;background:radial-gradient(circle at 70% 30%,rgba(232,207,138,.18),transparent 60%),linear-gradient(150deg,#2a2116,#120e0a);display:grid;place-items:center;overflow:hidden}
.post-card .ph img{width:100%;height:100%;object-fit:cover}
.post-card .ph img.pc-ic{width:72px;height:72px;object-fit:contain}
.post-card .bd{padding:12px 14px 14px;gap:6px}
.post-card h3{font-size:12.5px;line-height:1.5;margin:0;color:#F2EADB}
.post-card small{color:#9c917c;font-size:10px}
@media (max-width:760px){
.home .post-list{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;margin-inline:-16px;padding:2px 16px 4px;scrollbar-width:none}
.home .post-list::-webkit-scrollbar{display:none}
.home .post-list .post-card{flex:0 0 74%;scroll-snap-align:center}
}

/* ===== 2.9 — MapLibre pins ===== */
.maplibregl-marker.hpin span{transform:none}
.map-me{width:18px;height:18px;border-radius:50%;background:#2f6fd6;border:3px solid #fff;box-shadow:0 0 0 6px rgba(47,111,214,.25)}
.maplibregl-ctrl-attrib{font-size:10px}
.hmap-c.maplibregl-map{position:absolute;inset:0}

/* ===== 2.10 — hero carousel (app style) ===== */
.hc-home{padding:14px 0 18px;background:var(--hx)}
.hc-home .hx-kw{font-size:10.5px;line-height:1.5;font-weight:700;color:#E8CF8A;margin:6px 0 10px;display:flex;align-items:center;gap:8px;font-family:inherit}
.hc-home .hx-kw::after{content:"";width:28px;height:2px;background:#E8CF8A}
.hc{position:relative}
.hc-track{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin-inline:-16px;padding:0 16px}
.hc-track::-webkit-scrollbar{display:none}
.hc-s{position:relative;flex:0 0 86%;height:var(--hcm,300px);border-radius:22px;overflow:hidden;scroll-snap-align:center;background:#1b160f;box-shadow:0 14px 30px rgba(0,0,0,.4);isolation:isolate}
.hc-s picture,.hc-s picture img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;z-index:-2}
.hc-s::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,9,7,.05) 20%,rgba(11,9,7,.55) 55%,rgba(11,9,7,.94) 100%)}
.hc-t{position:absolute;right:16px;left:16px;bottom:16px;z-index:2;pointer-events:none}
.hc-t a{pointer-events:auto}
.hc-chip{display:inline-flex;align-items:center;height:22px;padding:0 10px;border-radius:999px;background:rgba(11,9,7,.6);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(232,207,138,.4);color:#E8CF8A;font-size:10px;font-weight:700}
.hc-h{font:700 18px/1.35 var(--f-head);color:#fff;margin:8px 0 4px;text-shadow:0 2px 10px rgba(0,0,0,.6)}
.hc-h span{color:#E8CF8A}
.hc-x{margin:0 0 10px;font-size:11px;line-height:1.7;color:#f2eadb;text-shadow:0 1px 8px rgba(0,0,0,.7);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hc-cover{position:absolute;inset:0;z-index:1}
.hc-dots{display:flex;justify-content:center;gap:6px;margin-top:12px}
.hc-dots i{width:6px;height:6px;border-radius:9px;background:rgba(232,207,138,.3);transition:width .25s,background .25s}
.hc-dots i.on{width:20px;background:var(--gold)}
.hc-arr{display:none}
.hc-search{margin-top:14px;max-width:none}
.hc-qk{display:flex;gap:8px;margin:12px -16px 0;padding:0 16px;overflow-x:auto;scrollbar-width:none}
.hc-qk::-webkit-scrollbar{display:none}
.hc-qk a{flex:none;display:flex;align-items:center;gap:6px;height:36px;padding:0 12px 0 8px;border-radius:999px;background:rgba(242,234,219,.05);border:1px solid rgba(242,234,219,.1);color:#e3d9c6;font-size:10.5px;font-weight:600;text-decoration:none}
.hc-qk a:hover{border-color:rgba(232,207,138,.45);color:#E8CF8A}
.hc-qk img{width:22px;height:22px;object-fit:contain}
@media (min-width:900px){
.hc-home{padding:22px 0 26px}
.hc-track{gap:16px;margin:0;padding:0}
.hc-s{flex:0 0 72%;height:var(--hcd,380px);border-radius:26px}
.hc-s::after{background:linear-gradient(270deg,rgba(11,9,7,.9) 0%,rgba(11,9,7,.55) 42%,rgba(11,9,7,.05) 78%)}
.hc-t{top:50%;bottom:auto;transform:translateY(-50%);right:40px;left:auto;max-width:460px}
.hc-h{font-size:31px;line-height:1.25}
.hc-x{font-size:13px;-webkit-line-clamp:3}
.hc-arr{display:grid;place-items:center;position:absolute;top:calc(var(--hcd,380px)/2 - 21px);z-index:3;width:42px;height:42px;border-radius:50%;background:rgba(14,12,9,.78);border:1px solid rgba(232,207,138,.35);color:#E8CF8A;font-size:18px;cursor:pointer}
.hc-prev{right:-14px}.hc-next{left:-14px}
.hc-dots{justify-content:flex-start}
.hc-qk{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));margin:14px 0 0;padding:0;overflow:visible}
.hc-qk a{justify-content:center;height:44px;border-radius:14px;font-size:11.5px}
}

/* 2.11 — «سطر تعريفي» on hall cards */
.hall-card .tg1{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;font-size:10px;line-height:1.6;color:var(--muted,#a39a89);margin-top:2px}
/* 2.12 — «تقييم فرحة» criteria + «الميزات والخدمات» (afrah-core 1.43) */
.hx-fc{position:relative;z-index:1;list-style:none;margin:12px 0 4px;padding:0;display:grid;gap:6px}
.hx-fc li{display:grid;grid-template-columns:150px auto 1fr;gap:4px 12px;align-items:center;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:11px;padding:8px 12px}
.hx-fc b{font-weight:700;font-size:12px}.hx-fc small{color:var(--muted);font-size:10.5px}
@media(max-width:620px){.hx-fc li{grid-template-columns:1fr auto}.hx-fc small{grid-column:1/-1}}
.ftx-pro{background:linear-gradient(135deg,rgba(232,207,138,.12),rgba(201,162,74,.05));border:1px solid rgba(201,162,74,.35);border-radius:var(--rl);padding:12px 14px;margin:0 0 14px}
.ftx-pro>b{display:block;color:var(--gold-l);font-family:Alexandria,sans-serif;font-size:11.5px;margin:0 0 8px}
.ftx-g{margin:0 0 14px}.ftx-g h3{font-size:12px;margin:0 0 8px;color:var(--muted);font-weight:600}
.ftx ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.ftx li{display:inline-flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:4px 14px 4px 6px;font-size:11.5px}
.ftx li img{width:30px;height:30px;object-fit:contain;flex:none}
.ftx-no{margin-top:6px;color:var(--muted);font-size:11px}.ftx-no summary{cursor:pointer}.ftx-no p{margin:6px 0 0}
.rv-gm .rv-chip{font-size:10px;border:1px solid var(--line);border-radius:999px;padding:1px 8px;color:var(--muted);font-weight:500}

/* 2.13 — «رأي فرحة» + «أرقام ومعلومات» (afrah-core 1.44) */
.hx-tip{position:relative;z-index:1;background:linear-gradient(135deg,rgba(232,207,138,.14),rgba(201,162,74,.05));border:1px solid rgba(201,162,74,.35);border-radius:12px;padding:10px 14px;margin:10px 0;font-size:12px}.hx-tip b{color:var(--gold-l)}
.hx-fit{position:relative;z-index:1;display:flex;gap:6px;flex-wrap:wrap;margin:6px 0 0}.hx-fit span{border:1px solid var(--line);border-radius:999px;padding:3px 12px;font-size:10.5px}
.qfx ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px}
.qfx li{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:2px}.qfx li span{color:var(--muted);font-size:10px}.qfx li b{font-size:12px}