/* ============ TOKENS ============ */
:root{
  --maroon-900:#5E0E26;
  --maroon-800:#6E1029;
  --maroon-700:#8A1538;
  --maroon-600:#A82049;
  --maroon:#8A1538;
  --blue:#0D4261;
  --blue-deep:#082B40;
  --gray:#A6A6A6;
  --accent:#B8974E;
  --accent-soft:#E0CB94;
  --gold:#B8974E;
  --gold-soft:#E0CB94;

  --ink:#241017;
  --ink-2:#5C4650;
  --ink-3:#86737C;
  --line:#E7DEE2;
  --line-2:#F4EEF0;

  --paper:#FAF7F8;
  --surface:#ffffff;
  --surface-2:#FDFBFC;
  --band:#F6EFF2;

  --shadow-s:0 1px 2px rgba(94,14,38,.06), 0 2px 8px rgba(94,14,38,.05);
  --shadow-m:0 4px 14px rgba(94,14,38,.09);
  --shadow-l:0 16px 40px rgba(94,14,38,.14);

  --r-s:8px; --r-m:14px; --r-l:22px; --r-pill:999px;
  --wrap:1220px;
  --fs:1;
  --amber:#c9791f;

  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --maroon-900:#1A0C11;
    --maroon-800:#2E1119;
    --maroon-700:#7A1230;
    --maroon-600:#A3264A;
    --maroon:#D4738F;
    --accent:#D9B978;
    --accent-soft:#52401F;
    --gold:#d0a95a;
    --gold-soft:#4a3d20;

    --ink:#F0E7EA;
    --ink-2:#C6AEB7;
    --ink-3:#9B848D;
    --line:#3A252D;
    --line-2:#2B1A21;

    --paper:#150B10;
    --surface:#1D1217;
    --surface-2:#190F14;
    --band:#1B1016;

    --shadow-s:0 1px 2px rgba(0,0,0,.4);
    --shadow-m:0 4px 14px rgba(0,0,0,.45);
    --shadow-l:0 16px 40px rgba(0,0,0,.55);
    --amber:#e0a14e;
    color-scheme: dark;
  }
}
:root[data-theme="dark"]{
  --maroon-900:#1A0C11;
  --maroon-800:#2E1119;
  --maroon-700:#7A1230;
  --maroon:#D4738F;
  --accent:#D9B978;
  --accent-soft:#52401F;
  --gold:#d0a95a;
  --gold-soft:#4a3d20;

  --ink:#F0E7EA;
  --ink-2:#C6AEB7;
  --ink-3:#9B848D;
  --line:#3A252D;
  --line-2:#2B1A21;

  --paper:#150B10;
  --surface:#1D1217;
  --surface-2:#190F14;
  --band:#1B1016;

  --shadow-s:0 1px 2px rgba(0,0,0,.4);
  --shadow-m:0 4px 14px rgba(0,0,0,.45);
  --shadow-l:0 16px 40px rgba(0,0,0,.55);
  --amber:#e0a14e;
  color-scheme: dark;
}

*{box-sizing:border-box}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"IBM Plex Sans Arabic","Noto Sans","Segoe UI",Tahoma,sans-serif;
  font-size:calc(15.5px * var(--fs));
  line-height:1.85;
  direction:rtl;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:"Cairo","IBM Plex Sans Arabic",sans-serif;font-weight:600;line-height:1.4;margin:0;text-wrap:balance;letter-spacing:0}
p{margin:0}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:4px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:20px}

/* ============ TOP UTILITY BAR ============ */
.topbar{background:var(--maroon-900);color:#F2DEE5;font-size:.8rem}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:42px}
.tb-social{display:flex;gap:2px}
.tb-social a{width:34px;height:34px;display:grid;place-items:center;border-radius:8px;opacity:.85;transition:.2s}
.tb-social a:hover{background:rgba(255,255,255,.12);opacity:1}
.tb-social svg{width:17px;height:17px;fill:currentColor}
.tb-right{display:flex;align-items:center;gap:14px;color:#D2A5B3;font-size:.78rem}
.tb-right .hijri{font-variant-numeric:tabular-nums}
.tb-dot{width:4px;height:4px;border-radius:50%;background:var(--accent);flex:none}

/* ============ HEADER ============ */
.masthead{background:var(--surface);border-bottom:1px solid var(--line-2)}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:14px}
.brand{display:flex;align-items:center;gap:14px}
.brand-logo{height:86px;width:auto;display:block}
.logo-dark{display:none}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .logo-light{display:none}
  :root:not([data-theme="light"]) .logo-dark{display:block}
}
:root[data-theme="dark"] .logo-light{display:none}
:root[data-theme="dark"] .logo-dark{display:block}
.f-logo{height:92px;width:auto;display:block}

.tools{display:flex;align-items:center;gap:6px}
.tool{border:1px solid var(--line);background:var(--surface);color:var(--ink-2);border-radius:var(--r-pill);padding:7px 12px;font-size:.8rem;display:inline-flex;align-items:center;gap:7px;transition:.18s;white-space:nowrap}
.tool:hover{border-color:var(--maroon);color:var(--maroon);background:var(--surface-2)}
.tool svg{width:15px;height:15px;fill:currentColor}
.tool.sq{width:36px;height:36px;padding:0;justify-content:center}

/* ============ NAV ============ */
.nav{background:var(--maroon-800);position:sticky;top:0;z-index:60;box-shadow:var(--shadow-m)}
.nav .wrap{display:flex;align-items:center;gap:2px;flex-wrap:wrap;padding-block:0}
.nav a{color:#F4E1E7;padding:15px 15px;font-size:.9rem;font-weight:500;position:relative;transition:.18s;white-space:nowrap}
.nav a:hover{color:#fff;background:rgba(255,255,255,.07)}
.nav a.on,
.nav li.current-menu-item > a,
.nav li.current_page_item > a{color:#fff}
.nav a.on::after,
.nav li.current-menu-item > a::after,
.nav li.current_page_item > a::after{content:"";position:absolute;inset-inline:12px;bottom:0;height:3px;background:var(--accent);border-radius:3px 3px 0 0}
.nav-toggle{display:none}

/* ============ PAGES ============ */
.page{display:block}
@keyframes fade{from{opacity:.4}to{opacity:1}}

/* ============ HERO SLIDER ============ */
.hero{padding:26px 0 10px}
.slider{position:relative;border-radius:var(--r-l);overflow:hidden;box-shadow:var(--shadow-l);background:var(--maroon-900)}
.slides{position:relative;height:452px}
.slide{position:absolute;inset:0;opacity:0;transition:opacity .7s ease;display:grid;grid-template-columns:1.05fr .95fr;align-items:center}
.slide.on{opacity:1}
.slide-copy{padding:0 54px;color:#fff;position:relative;z-index:2}
.slide-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:.76rem;letter-spacing:.1em;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);padding:5px 14px;border-radius:var(--r-pill);margin-bottom:16px}
.slide h2{font-size:2.1rem;color:#fff;margin-bottom:12px}
.slide p{color:#EFD4DC;max-width:44ch;font-size:.95rem;line-height:1.8}
.slide-cta{display:inline-flex;align-items:center;gap:9px;margin-top:20px;background:var(--accent);color:#3B2A12;font-weight:600;padding:11px 26px;border-radius:var(--r-pill);font-size:.92rem;box-shadow:0 6px 18px rgba(143,191,63,.35);transition:.2s}
.slide-cta:hover{transform:translateY(-2px)}
.slide-art{height:100%;position:relative}
.slide-art svg{width:100%;height:100%;display:block}
.sl-nav{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);display:grid;place-items:center;color:#fff;z-index:3;backdrop-filter:blur(4px);transition:.2s}
.sl-nav:hover{background:rgba(255,255,255,.28)}
.sl-nav svg{width:18px;height:18px;fill:currentColor}
.sl-prev{right:18px}.sl-next{left:18px}
.slider .dots{position:absolute;bottom:18px;inset-inline:0;display:flex;justify-content:center;gap:8px;z-index:3}
.slider .dots button{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.4);transition:.25s}
.slider .dots button.on{background:var(--accent);width:26px;border-radius:var(--r-pill)}

/* ============ SECTION SHELL ============ */
.sec{padding:56px 0}
.sec.band{background:var(--band)}
.sec.surface{background:var(--surface)}
.sec-head{text-align:center;margin-bottom:38px}
.sec-eyebrow{display:inline-block;font-size:.75rem;letter-spacing:.14em;color:var(--gold);margin-bottom:8px;font-weight:600}
.sec-head h2{font-size:1.85rem;color:var(--maroon-800)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .sec-head h2{color:var(--accent)}}
:root[data-theme="dark"] .sec-head h2{color:var(--accent)}
.sec-rule{width:64px;height:3px;background:var(--accent);border-radius:3px;margin:12px auto 0}
.sec-head p{color:var(--ink-3);max-width:60ch;margin:14px auto 0;font-size:.94rem}
.sec-foot{text-align:center;margin-top:34px}
.btn-ghost{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--maroon);color:var(--maroon);padding:10px 26px;border-radius:var(--r-pill);font-weight:600;font-size:.9rem;transition:.2s}
.btn-ghost:hover{background:var(--maroon);color:#fff}
.btn-solid{display:inline-flex;align-items:center;gap:8px;background:var(--maroon-700);color:#fff;padding:11px 26px;border-radius:var(--r-pill);font-weight:600;font-size:.9rem;transition:.2s;box-shadow:var(--shadow-s)}
.btn-solid:hover{background:var(--maroon-800);transform:translateY(-1px)}

/* ============ QUICK TILES ============ */
.tiles{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.tile{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-m);padding:22px 12px;text-align:center;transition:.22s;box-shadow:var(--shadow-s)}
.tile:hover{transform:translateY(-4px);box-shadow:var(--shadow-m);border-color:var(--accent)}
.tile-ic{width:46px;height:46px;margin:0 auto 12px;border-radius:12px;background:var(--band);display:grid;place-items:center;color:var(--maroon)}
.tile:hover .tile-ic{background:var(--maroon-700);color:#fff}
.tile-ic svg{width:23px;height:23px;fill:currentColor}
.tile span{font-size:.86rem;font-weight:500;display:block;color:var(--ink)}

/* ============ AYAH STRIP ============ */
.ayah-strip{background:var(--maroon-900);color:#fff;padding:46px 0;text-align:center;position:relative;overflow:hidden}
.ayah-strip .pattern{position:absolute;top:50%;inset-inline-start:6%;transform:translateY(-50%);height:150%;width:auto;opacity:.07;pointer-events:none}
.ayah{font-family:"Amiri Quran",serif;font-size:2.05rem;line-height:2.4;position:relative;color:#fff}
.ayah-src{color:var(--accent-soft);font-size:.85rem;margin-top:10px;position:relative}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .ayah-src{color:var(--accent)}}
:root[data-theme="dark"] .ayah-src{color:var(--accent)}

/* ============ PUBLICATION CARDS ============ */
.pub-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.pub{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-m);overflow:hidden;display:flex;flex-direction:column;transition:.22s;box-shadow:var(--shadow-s)}
.pub:hover{transform:translateY(-5px);box-shadow:var(--shadow-l)}
.pub-cover{aspect-ratio:3/4;background:var(--band);position:relative;overflow:hidden}
.pub-cover svg{width:100%;height:100%;display:block}
.pub-tag{position:absolute;top:12px;inset-inline-start:12px;background:rgba(255,255,255,.94);color:var(--maroon-800);font-size:.7rem;font-weight:600;padding:4px 11px;border-radius:var(--r-pill);letter-spacing:.02em}
.pub-body{padding:16px 16px 18px;display:flex;flex-direction:column;gap:9px;flex:1}
.pub-body h3{font-size:1.02rem;color:var(--ink)}
.pub-body p{font-size:.84rem;color:var(--ink-3);line-height:1.8;flex:1;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.pub-author{display:flex;align-items:center;gap:6px;font-size:.79rem;color:var(--maroon);font-weight:500}
.pub-author svg{width:14px;height:14px;fill:currentColor;opacity:.7;flex:none}
.empty{grid-column:1/-1;text-align:center;padding:64px 24px;color:var(--ink-3);background:var(--surface-2);border:1px dashed var(--line);border-radius:var(--r-m)}
.empty svg{width:44px;height:44px;fill:currentColor;opacity:.35;margin-bottom:14px}
.empty h3{font-size:1.1rem;color:var(--ink-2);margin-bottom:6px}
.empty p{font-size:.9rem}
.pub-meta{display:flex;gap:8px;flex-wrap:wrap;font-size:.72rem;color:var(--ink-3)}
.chip{background:var(--band);border:1px solid var(--line);padding:3px 10px;border-radius:var(--r-pill);font-variant-numeric:tabular-nums}
.pub-dl{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--maroon-700);color:#fff;padding:9px;border-radius:var(--r-s);font-size:.85rem;font-weight:600;transition:.2s}
.pub-dl:hover{background:var(--maroon-800)}
.pub-dl svg{width:15px;height:15px;fill:currentColor}

/* filters */
.filters{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;margin-bottom:32px}
.filters button{border:1px solid var(--line);background:var(--surface);padding:8px 20px;border-radius:var(--r-pill);font-size:.86rem;color:var(--ink-2);transition:.2s}
.filters button:hover{border-color:var(--maroon)}
.filters button.on{background:var(--maroon-700);border-color:var(--maroon-700);color:#fff;font-weight:600}

/* ============ NEWS ============ */
.news-layout{display:grid;grid-template-columns:1.5fr 1fr;gap:30px;align-items:start}
.news-feature{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-m);overflow:hidden;box-shadow:var(--shadow-s)}
.news-img{height:250px;position:relative}
.news-img svg{width:100%;height:100%;display:block}
.news-cat{position:absolute;top:14px;inset-inline-start:14px;background:var(--gold);color:#fff;font-size:.72rem;font-weight:600;padding:5px 13px;border-radius:var(--r-pill)}
.news-feature-body{padding:22px 24px 26px}
.news-date{font-size:.78rem;color:var(--ink-3);display:flex;align-items:center;gap:7px;margin-bottom:9px;font-variant-numeric:tabular-nums}
.news-date svg{width:14px;height:14px;fill:currentColor;opacity:.6}
.news-feature-body h3{font-size:1.3rem;margin-bottom:10px;color:var(--maroon-800)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .news-feature-body h3{color:var(--accent)}}
:root[data-theme="dark"] .news-feature-body h3{color:var(--accent)}
.news-feature-body p{font-size:.92rem;color:var(--ink-2);margin-bottom:16px}
.readmore{display:inline-flex;align-items:center;gap:7px;color:var(--maroon);font-weight:600;font-size:.88rem}
.readmore svg{width:14px;height:14px;fill:currentColor;transition:.2s}
.readmore:hover svg{transform:translateX(-4px)}
.news-list{display:flex;flex-direction:column;gap:2px;background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-m);padding:8px;box-shadow:var(--shadow-s)}
.news-item{display:flex;gap:14px;padding:15px 14px;border-radius:var(--r-s);transition:.2s;align-items:flex-start}
.news-item:hover{background:var(--band)}
.news-item + .news-item{border-top:1px solid var(--line-2)}
.ni-date{flex:none;width:52px;text-align:center;background:var(--band);border-radius:var(--r-s);padding:7px 4px;line-height:1.3}
.ni-date b{display:block;font-size:1.05rem;color:var(--maroon-700);font-variant-numeric:tabular-nums}
.ni-date span{font-size:.66rem;color:var(--ink-3)}
.ni-txt h4{font-size:.93rem;font-weight:500;font-family:"IBM Plex Sans Arabic",sans-serif;line-height:1.6;color:var(--ink)}
.ni-txt small{color:var(--ink-3);font-size:.75rem}

/* ============ VIDEO CARDS ============ */
.vid-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.vid{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-m);overflow:hidden;box-shadow:var(--shadow-s);transition:.22s;display:block}
.vid:hover{transform:translateY(-5px);box-shadow:var(--shadow-l)}
.vid-thumb{aspect-ratio:16/9;position:relative;overflow:hidden;background:var(--maroon-900)}
.vid-thumb svg.art{width:100%;height:100%;display:block}
.play{position:absolute;inset:0;display:grid;place-items:center}
.play i{width:56px;height:56px;border-radius:50%;background:rgba(220,40,40,.94);display:grid;place-items:center;box-shadow:0 6px 20px rgba(0,0,0,.35);transition:.2s}
.vid:hover .play i{transform:scale(1.1)}
.play svg{width:20px;height:20px;fill:#fff;margin-inline-start:3px}
.vid-dur{position:absolute;bottom:9px;inset-inline-end:9px;background:rgba(0,0,0,.8);color:#fff;font-size:.72rem;padding:2px 8px;border-radius:5px;font-variant-numeric:tabular-nums}
.vid-body{padding:15px 16px 17px}
.vid-body h3{font-size:.98rem;line-height:1.6;margin-bottom:8px;color:var(--ink)}
.vid-body .m{font-size:.76rem;color:var(--ink-3);display:flex;gap:12px;font-variant-numeric:tabular-nums}

/* playlists */
.pl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pl{position:relative;border-radius:var(--r-m);overflow:hidden;box-shadow:var(--shadow-s);transition:.22s;display:block;background:var(--maroon-800)}
.pl:hover{transform:translateY(-4px);box-shadow:var(--shadow-l)}
.pl-art{aspect-ratio:16/10}
.pl-art svg{width:100%;height:100%;display:block}
.pl-ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(6,32,21,.94) 8%,rgba(6,32,21,.15) 62%);display:flex;flex-direction:column;justify-content:flex-end;padding:18px}
.pl-ov h3{color:#fff;font-size:1.05rem;margin-bottom:5px}
.pl-ov span{color:var(--accent-soft);font-size:.79rem;font-variant-numeric:tabular-nums}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .pl-ov span{color:var(--accent)}}
:root[data-theme="dark"] .pl-ov span{color:var(--accent)}
.pl-count{position:absolute;top:12px;inset-inline-end:12px;background:rgba(0,0,0,.7);color:#fff;font-size:.72rem;padding:4px 11px;border-radius:var(--r-pill);display:flex;align-items:center;gap:6px}
.pl-count svg{width:13px;height:13px;fill:currentColor}

/* ============ APP PAGE ============ */
.app-hero{display:grid;grid-template-columns:1fr .8fr;gap:50px;align-items:center}
.app-hero h2{font-size:2rem;color:var(--maroon-800);margin-bottom:14px}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .app-hero h2{color:var(--accent)}}
:root[data-theme="dark"] .app-hero h2{color:var(--accent)}
.app-hero p{color:var(--ink-2);margin-bottom:24px;font-size:.98rem}
.stores{display:flex;gap:12px;flex-wrap:wrap}
.store{display:flex;align-items:center;gap:11px;background:var(--maroon-900);color:#fff;padding:11px 22px;border-radius:var(--r-m);transition:.2s}
.store:hover{transform:translateY(-2px);box-shadow:var(--shadow-m)}
.store svg{width:26px;height:26px;fill:currentColor;flex:none}
.store b{display:block;font-size:.95rem;line-height:1.3;font-weight:600;font-family:"Noto Sans",sans-serif}
.store span{display:block;font-size:.7rem;opacity:.75}
.phone{max-width:280px;margin-inline:auto}
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.feat{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-m);padding:26px 22px;box-shadow:var(--shadow-s);transition:.2s}
.feat:hover{border-color:var(--accent);transform:translateY(-3px)}
.feat-ic{width:48px;height:48px;border-radius:12px;background:var(--band);color:var(--maroon);display:grid;place-items:center;margin-bottom:15px}
.feat-ic svg{width:24px;height:24px;fill:currentColor}
.feat h3{font-size:1.05rem;margin-bottom:8px;color:var(--ink)}
.feat p{font-size:.87rem;color:var(--ink-3)}

/* ============ ABOUT ============ */
.about-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.vcard{background:var(--surface);border:1px solid var(--line-2);border-top:4px solid var(--maroon);border-radius:var(--r-m);padding:28px 24px;box-shadow:var(--shadow-s)}
.vcard.g{border-top-color:var(--gold)}
.vcard.l{border-top-color:var(--accent)}
.vcard h3{font-size:1.15rem;margin-bottom:10px;color:var(--maroon-800)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .vcard h3{color:var(--accent)}}
:root[data-theme="dark"] .vcard h3{color:var(--accent)}
.vcard p{font-size:.92rem;color:var(--ink-2)}
.vcard ul{margin:0;padding-inline-start:20px;font-size:.9rem;color:var(--ink-2);display:flex;flex-direction:column;gap:7px}

.prose{max-width:72ch;margin-inline:auto}
.prose p{margin-bottom:16px;color:var(--ink-2);font-size:.98rem}
.prose h3{font-size:1.25rem;color:var(--maroon-800);margin:28px 0 12px}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .prose h3{color:var(--accent)}}
:root[data-theme="dark"] .prose h3{color:var(--accent)}

/* timeline */
.tl{max-width:760px;margin-inline:auto;position:relative;padding-inline-start:0}
.tl::before{content:"";position:absolute;inset-inline-start:88px;top:8px;bottom:8px;width:2px;background:var(--line)}
.tl-item{display:grid;grid-template-columns:76px 1fr;gap:28px;padding-bottom:28px;position:relative}
.tl-year{text-align:left;font-family:"Cairo",sans-serif;font-size:1.1rem;color:var(--gold);font-weight:600;font-variant-numeric:tabular-nums;padding-top:2px}
.tl-body{position:relative}
.tl-body::before{content:"";position:absolute;inset-inline-start:-35px;top:9px;width:11px;height:11px;border-radius:50%;background:var(--maroon);border:3px solid var(--surface);box-shadow:0 0 0 2px var(--line)}
.tl-body h4{font-size:1rem;margin-bottom:5px;color:var(--ink);font-family:"IBM Plex Sans Arabic",sans-serif;font-weight:600}
.tl-body p{font-size:.88rem;color:var(--ink-3)}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden}
.stat{background:var(--surface);padding:28px 18px;text-align:center}
.stat b{display:block;font-family:"Cairo",sans-serif;font-size:2.1rem;color:var(--maroon);line-height:1.2;font-variant-numeric:tabular-nums}
.stat span{font-size:.83rem;color:var(--ink-3)}

/* ============ SOCIAL ============ */
.soc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.soc{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-m);padding:26px 24px;box-shadow:var(--shadow-s);transition:.22s;display:flex;align-items:center;gap:18px}
.soc:hover{transform:translateY(-4px);box-shadow:var(--shadow-l)}
.soc-ic{width:54px;height:54px;border-radius:15px;display:grid;place-items:center;flex:none;color:#fff}
.soc-ic svg{width:26px;height:26px;fill:currentColor}
.soc-txt{flex:1;min-width:0}
.soc-txt h3{font-size:1.02rem;margin-bottom:2px;color:var(--ink)}
.soc-txt .handle{font-family:"Noto Sans",sans-serif;font-size:.82rem;color:var(--ink-3);direction:ltr;text-align:right;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.soc-txt .cnt{font-size:.78rem;color:var(--maroon);font-weight:600;font-variant-numeric:tabular-nums}
.soc-go{color:var(--ink-3);flex:none}
.soc-go svg{width:18px;height:18px;fill:currentColor}

/* ============ CONFERENCES ============ */
.conf{display:grid;grid-template-columns:190px 1fr;gap:0;background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-m);overflow:hidden;box-shadow:var(--shadow-s);margin-bottom:20px;transition:.2s}
.conf:hover{box-shadow:var(--shadow-m)}
.conf-side{background:var(--maroon-800);color:#fff;padding:26px 20px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:4px;position:relative;overflow:hidden}
.conf-side .n{font-family:"Cairo",sans-serif;font-size:2.6rem;line-height:1;position:relative}
.conf-side .l{font-size:.78rem;color:var(--accent-soft);position:relative}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .conf-side .l{color:var(--accent)}}
:root[data-theme="dark"] .conf-side .l{color:var(--accent)}
.conf-body{padding:24px 26px}
.conf-body h3{font-size:1.22rem;color:var(--maroon-800);margin-bottom:10px}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .conf-body h3{color:var(--accent)}}
:root[data-theme="dark"] .conf-body h3{color:var(--accent)}
.conf-meta{display:flex;gap:18px;flex-wrap:wrap;font-size:.82rem;color:var(--ink-3);margin-bottom:12px}
.conf-meta span{display:flex;align-items:center;gap:6px}
.conf-meta svg{width:14px;height:14px;fill:currentColor;opacity:.65}
.conf-body p{font-size:.9rem;color:var(--ink-2);margin-bottom:14px}
.axes{display:flex;gap:8px;flex-wrap:wrap}
.axis{background:var(--band);border:1px solid var(--line);font-size:.78rem;padding:5px 13px;border-radius:var(--r-pill);color:var(--ink-2)}
.badge-live{background:var(--accent);color:#3B2A12;font-size:.72rem;font-weight:700;padding:4px 12px;border-radius:var(--r-pill);display:inline-block;margin-bottom:9px}
.badge-past{background:var(--band);color:var(--ink-3);border:1px solid var(--line);font-size:.72rem;font-weight:600;padding:4px 12px;border-radius:var(--r-pill);display:inline-block;margin-bottom:9px}

/* ============ MAGAZINE ============ */
.mag-hero{display:grid;grid-template-columns:.62fr 1fr;gap:44px;align-items:center;background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-l);padding:38px;box-shadow:var(--shadow-m)}
.mag-cover{box-shadow:var(--shadow-l);border-radius:6px;overflow:hidden;transform:rotate(-2deg);transition:.3s}
.mag-cover:hover{transform:rotate(0)}
.mag-info .issue-no{font-size:.8rem;color:var(--gold);font-weight:600;letter-spacing:.1em;margin-bottom:8px;display:block}
.mag-info h2{font-size:1.85rem;color:var(--maroon-800);margin-bottom:12px}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .mag-info h2{color:var(--accent)}}
:root[data-theme="dark"] .mag-info h2{color:var(--accent)}
.mag-info p{color:var(--ink-2);margin-bottom:18px;font-size:.95rem}
.toc{display:flex;flex-direction:column;gap:9px;margin-bottom:22px}
.toc div{display:flex;gap:11px;align-items:flex-start;font-size:.89rem;color:var(--ink-2)}
.toc i{width:6px;height:6px;border-radius:50%;background:var(--accent);flex:none;margin-top:9px}
.mag-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.mag-item{text-align:center;transition:.22s}
.mag-item:hover{transform:translateY(-5px)}
.mag-item .c{border-radius:5px;overflow:hidden;box-shadow:var(--shadow-m);margin-bottom:11px}
.mag-item b{display:block;font-size:.88rem;font-weight:600;color:var(--ink)}
.mag-item span{font-size:.76rem;color:var(--ink-3)}

/* ============ APP CTA BAND ============ */
.cta-band{background:var(--maroon-900);color:#fff;border-radius:var(--r-l);padding:44px 48px;display:grid;grid-template-columns:1fr auto;gap:34px;align-items:center;position:relative;overflow:hidden;box-shadow:var(--shadow-l)}
.cta-band .pattern{position:absolute;top:50%;inset-inline-start:-2%;transform:translateY(-50%);height:210%;width:auto;opacity:.08;pointer-events:none}
.cta-band > *{position:relative}
.cta-band h2{font-size:1.7rem;color:#fff;margin-bottom:10px}
.cta-band p{color:#E9CBD5;max-width:52ch;font-size:.95rem}

/* ============ FOOTER ============ */
footer{background:var(--maroon-900);color:#EBCFD8;padding-top:52px;margin-top:0}
.f-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:38px;padding-bottom:38px}
.f-brand{margin-bottom:18px}


footer h4{color:#fff;font-size:1rem;margin-bottom:16px;position:relative;padding-bottom:10px}
footer h4::after{content:"";position:absolute;bottom:0;inset-inline-start:0;width:32px;height:2px;background:var(--accent)}
.f-links{display:flex;flex-direction:column;gap:10px}
.f-links a{font-size:.88rem;color:#DCB4C2;transition:.18s;display:flex;align-items:center;gap:8px}
.f-links a:hover{color:var(--accent);transform:translateX(-4px)}
.f-links a::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent);opacity:.5;flex:none}
.f-about{font-size:.88rem;color:#D3A6B6;line-height:1.9}
.f-contact{display:flex;flex-direction:column;gap:12px;font-size:.88rem}
.f-contact div{display:flex;gap:11px;align-items:flex-start;color:#DCB4C2}
.f-contact svg{width:17px;height:17px;fill:var(--accent);flex:none;margin-top:4px}
.f-social{display:flex;gap:9px;margin-top:18px}
.f-social a{width:38px;height:38px;border-radius:10px;background:rgba(255,255,255,.09);display:grid;place-items:center;color:#F2DAE2;transition:.2s}
.f-social a:hover{background:var(--accent);color:#3B2A12;transform:translateY(-3px)}
.f-social svg{width:17px;height:17px;fill:currentColor}
.f-bottom{border-top:1px solid rgba(255,255,255,.12);padding:20px 0;font-size:.82rem;color:#BF92A2;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* ============ PAGE HEAD ============ */
.phead{background:var(--maroon-800);color:#fff;padding:46px 0 44px;position:relative;overflow:hidden}
.phead .pattern{position:absolute;top:50%;inset-inline-start:4%;transform:translateY(-50%);height:190%;width:auto;opacity:.075;pointer-events:none}
.phead .wrap{position:relative}
.phead h1{font-size:2.1rem;color:#fff;margin-bottom:8px}
.phead p{color:#E6C4D0;font-size:.95rem;max-width:62ch}
.crumb{font-size:.79rem;color:var(--accent-soft);margin-bottom:12px;display:flex;gap:8px;align-items:center}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .crumb{color:var(--accent)}}
:root[data-theme="dark"] .crumb{color:var(--accent)}
.crumb svg{width:11px;height:11px;fill:currentColor;opacity:.6}

/* ============ RESPONSIVE ============ */
@media (max-width:1080px){
  .tiles{grid-template-columns:repeat(3,1fr)}
  .pub-grid{grid-template-columns:repeat(3,1fr)}
  .mag-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:900px){
  .slides{height:auto}
  .slide{grid-template-columns:1fr;position:relative;display:none}
  .slide.on{display:grid}
  .slide-copy{padding:34px 26px;order:2}
  .slide h2{font-size:1.6rem}
  .slide-art{height:190px;order:1}
  .sl-nav{display:none}
  .news-layout{grid-template-columns:1fr}
  .vid-grid,.pl-grid,.feat-grid,.about-grid,.soc-grid{grid-template-columns:1fr 1fr}
  .app-hero{grid-template-columns:1fr}
  .phone{max-width:230px}
  .mag-hero{grid-template-columns:1fr;gap:28px;padding:26px}
  .mag-cover{max-width:230px;margin-inline:auto}
  .f-grid{grid-template-columns:1fr 1fr;gap:28px}
  .cta-band{grid-template-columns:1fr;padding:32px 26px}
  .stats{grid-template-columns:1fr 1fr}
}
@media (max-width:680px){
  body{font-size:calc(15px * var(--fs))}
  .brand-logo{height:72px}
  .f-logo{height:80px}
  .topbar .wrap{flex-direction:column;gap:0;padding-block:6px}
  .tb-right{font-size:.72rem;padding-bottom:5px}
  .masthead .wrap{flex-direction:column;align-items:flex-start;gap:14px}
  .tools{flex-wrap:wrap}
  .nav .wrap{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .nav .wrap::-webkit-scrollbar{display:none}
  .nav a{padding:13px 12px;font-size:.85rem}
  .tiles{grid-template-columns:repeat(2,1fr)}
  .pub-grid,.vid-grid,.pl-grid,.feat-grid,.about-grid,.soc-grid,.mag-grid{grid-template-columns:1fr}
  .conf{grid-template-columns:1fr}
  .conf-side{flex-direction:row;gap:12px;padding:16px}
  .conf-side .n{font-size:1.7rem}
  .sec{padding:40px 0}
  .sec-head h2{font-size:1.5rem}
  .phead h1{font-size:1.6rem}
  .ayah{font-size:1.5rem;line-height:2.3}
  .f-grid{grid-template-columns:1fr}
  .tl::before{inset-inline-start:52px}
  .tl-item{grid-template-columns:44px 1fr;gap:22px}
  .tl-body::before{inset-inline-start:-28px}
  .stat b{font-size:1.7rem}
}

/* ===== WordPress menu markup ===== */
.nav .wrap ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:2px;flex-wrap:wrap}
.nav .wrap li{position:relative}
@media (max-width:680px){.nav .wrap ul{flex-wrap:nowrap}}

/* ===== single post / page content ===== */
.entry{max-width:none}
.entry-content{font-size:1rem;line-height:1.95;color:var(--ink-2)}
.entry-content h2{font-size:1.4rem;color:var(--maroon-800);margin:30px 0 12px}
.entry-content h3{font-size:1.16rem;color:var(--maroon-800);margin:26px 0 10px}
.entry-content p{margin:0 0 16px}
.entry-content ul,.entry-content ol{margin:0 0 16px;padding-inline-start:22px;display:flex;flex-direction:column;gap:8px}
.entry-content a{color:var(--maroon);text-decoration:underline;text-underline-offset:3px}
.entry-content img{border-radius:var(--r-m);height:auto}
.entry-content blockquote{margin:0 0 18px;padding:16px 20px;border-inline-start:4px solid var(--accent);background:var(--band);border-radius:var(--r-s)}
.entry-hero{border-radius:var(--r-m);overflow:hidden;margin-bottom:26px;box-shadow:var(--shadow-m)}
.entry-hero img{display:block;width:100%;height:auto}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .entry-content h2,:root:not([data-theme="light"]) .entry-content h3{color:var(--accent)}}
:root[data-theme="dark"] .entry-content h2,:root[data-theme="dark"] .entry-content h3{color:var(--accent)}

/* ===== pagination ===== */
.tdb-pagination{display:flex;justify-content:center;gap:8px;margin-top:36px;flex-wrap:wrap}
.tdb-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--surface);color:var(--ink-2);font-size:.9rem;font-variant-numeric:tabular-nums;transition:.18s}
.tdb-pagination .page-numbers:hover{border-color:var(--maroon);color:var(--maroon)}
.tdb-pagination .page-numbers.dots{position:static!important;inset:auto!important;width:auto;min-width:40px;display:inline-flex;z-index:auto;background:transparent;border-color:transparent}
.tdb-pagination .page-numbers.current{background:var(--maroon-700);border-color:var(--maroon-700);color:#fff;font-weight:600}

/* ===== images inside cards ===== */
.pub-cover img,.mag-cover img,.mag-item .c img{width:100%;height:100%;object-fit:cover;display:block}
.vid-thumb img.tdb-vthumb{width:100%;height:100%;object-fit:cover;display:block}
.news-img img{width:100%;height:100%;object-fit:cover;display:block}
.pl-art img{width:100%;height:100%;object-fit:cover;display:block}

/* ===== skip link ===== */
.skip-link{position:absolute;inset-inline-start:-9999px;top:0;background:var(--maroon-700);color:#fff;padding:10px 18px;border-radius:0 0 var(--r-s) var(--r-s);z-index:999}
.skip-link:focus{inset-inline-start:20px}

/* ===== utilities ===== */
[hidden]{display:none!important}
.tdb-chip{display:inline-flex;align-items:center;border:1px solid var(--line);background:var(--surface);padding:8px 20px;border-radius:var(--r-pill);font-size:.86rem;color:var(--ink-2);transition:.2s}
.tdb-chip:hover{border-color:var(--maroon);color:var(--maroon)}
.tdb-chip.on{background:var(--maroon-700);border-color:var(--maroon-700);color:#fff;font-weight:600}
.conf-side{position:relative}