:root{
    --navy:#3B2A1D; --navy-deep:#221709; --emerald:#6B4A2E;
    --gold:#C6A15B; --gold-bright:#E9CE8A; --ivory:#F7EEDF;
    --crimson:#7C1F2E; --ink:#2A2016; --ink-soft:rgba(42,32,22,0.62); --line:rgba(198,161,91,0.38);
    --oxford-navy:#41618C; --forest-green:#3F6B4E; --terracotta:#C9784B;
    /* Prestige palette — supporting tones deployed for section rhythm
       (see docs/design-rhythm.md): the site's own brand colours are only
       coffee-brown (--navy) and royal gold (--gold); these extend the
       ecosystem so sections can alternate light/dark instead of
       repeating brown on brown. */
    --cream:#F1E4C8; --milk:#FCFAF6; --parchment:#EAE0C0;
    --charcoal:#2A2621; --charcoal-deep:#1C1914; --on-charcoal-soft:rgba(241,231,214,0.68);
    --bronze:#7C5430; --bronze-bright:#A47843;
    /* Personalisation Centre — Theme. --surface/--on-surface alias the
       light-reading-surface roles of --ivory/--ink specifically (body
       background and the ivory-banded content sections' text), NOT the
       navy-banded editorial sections, where --ivory/#fff are used as
       fixed light-text-on-dark-band pairs and must stay untouched. This
       split keeps every theme's contrast pairing intact — see
       docs/personalisation-centre.md for why the navy/gold dramatic
       bands intentionally don't re-theme. */
    --surface:var(--ivory); --on-surface:var(--ink); --on-surface-soft:var(--ink-soft);
    /* Reading-surface variants — same theme-aware alias pattern as
       --surface, so light-content sections can alternate cream/milk/
       parchment for rhythm without breaking the reading-mode toggle:
       every variant still collapses to the same dark/white surface
       the user picked in the Personalisation Centre. */
    --surface-alt:var(--cream); --surface-tertiary:var(--milk); --surface-warm:var(--parchment);
  }
  :root[data-pc-theme="dark"]{
    --surface:#1C140C; --on-surface:#F1E7D6; --on-surface-soft:rgba(241,231,214,0.66);
    --surface-alt:#1C140C; --surface-tertiary:#1C140C; --surface-warm:#1C140C;
  }
  :root[data-pc-theme="light"]{
    --surface:#FFFFFF; --on-surface:#241B12; --on-surface-soft:rgba(36,27,18,0.6);
    --surface-alt:#FFFFFF; --surface-tertiary:#FFFFFF; --surface-warm:#FFFFFF;
  }

  /* Personalisation Centre — Accent Colour. Scoped deliberately: it
     recolours the Personalisation Centre panel's own interactive
     elements, the sitewide primary button (.btn-gold), and the floating
     action buttons — NOT the crest, seal, ledger headings, or mega-menu
     gold treatments, which are brand-identity gold and stay constant
     regardless of a visitor's accent choice, the same way a university's
     crest doesn't recolour when a student picks a UI accent. Extending
     this to every decorative gold use sitewide would need a broader
     token audit (see docs/personalisation-centre.md). */
  :root{
    --accent:var(--gold); --accent-bright:var(--gold-bright);
    --accent-shadow:rgba(198,161,91,0.55); --accent-wash:rgba(198,161,91,0.12);
  }
  :root[data-pc-accent="coffee-brown"]{
    --accent:#8B5E34; --accent-bright:#B98653; --accent-shadow:rgba(139,94,52,0.55); --accent-wash:rgba(139,94,52,0.12);
  }
  :root[data-pc-accent="emerald"]{
    --accent:#2F7D5C; --accent-bright:#4FAF85; --accent-shadow:rgba(47,125,92,0.55); --accent-wash:rgba(47,125,92,0.12);
  }
  :root[data-pc-accent="navy"]{
    --accent:#41618C; --accent-bright:#6D8FBD; --accent-shadow:rgba(65,97,140,0.55); --accent-wash:rgba(65,97,140,0.12);
  }
  :root[data-pc-accent="burgundy"]{
    --accent:#7C1F2E; --accent-bright:#A8455A; --accent-shadow:rgba(124,31,46,0.55); --accent-wash:rgba(124,31,46,0.12);
  }

  /* Personalisation Centre — Text Size. The whole site is built on rem
     units, so scaling the root font-size scales every component
     proportionally — genuinely functional, not a partial/cosmetic toggle. */
  html[data-pc-text="small"]{font-size:93.75%;}
  html[data-pc-text="large"]{font-size:112.5%;}

  /* Personalisation Centre — Reduced Motion. Kills CSS animations and
     transitions site-wide; js/site.js and js/personalisation.js also
     check this attribute before running any requestAnimationFrame-based
     animation (e.g. the stat-band counters), so this covers both CSS and
     JS-driven motion, not just one or the other. */
  html[data-pc-motion="reduced"] *,
  html[data-pc-motion="reduced"] *::before,
  html[data-pc-motion="reduced"] *::after{
    animation-duration:0.001ms !important; animation-iteration-count:1 !important;
    transition-duration:0.001ms !important; scroll-behavior:auto !important;
  }
  /* Variable names kept as --navy/--navy-deep/--emerald for minimal diff;
     values now render Royal Coffee Brown / Deep Espresso / Warm Bronze per
     the confirmed palette. --ivory now renders Premium Cream. --oxford-navy
     and --forest-green are supporting accents used sparingly and only where
     scoped (governance structure, Qur'an College) — the coffee/gold/cream
     identity remains the lead instrument everywhere else. */

  /* === Institutional signature system === */
  .institutional-frame{position:relative;}
  .institutional-frame::before,.institutional-frame::after{
    content:"";position:absolute;width:34px;height:34px;border:1px solid var(--gold);opacity:0.55;pointer-events:none;
  }
  .institutional-frame::before{top:0;left:24px;border-right:none;border-bottom:none;}
  .institutional-frame::after{bottom:0;right:24px;border-left:none;border-top:none;}
  .crest-watermark{position:relative;isolation:isolate;}
  .crest-watermark::before{
    content:"";position:absolute;top:50%;right:-60px;transform:translateY(-50%);
    width:420px;height:374px;
    background-image:url("/assets/images/crest-watermark.png");
    background-size:contain;background-repeat:no-repeat;
    opacity:0.055;pointer-events:none;z-index:0;
  }
  @media (max-width:900px){ .crest-watermark::before{width:260px;height:231px;right:-40px;} }
  .crest-watermark > .wrap{position:relative;z-index:1;}
  /* Ledger/directory rows — replaces boxed card grids for people & department listings */
  .ledger{display:flex;flex-direction:column;}
  .ledger-row{
    display:grid;grid-template-columns:1.3fr 1.7fr 1fr;gap:20px;align-items:baseline;
    padding:20px 0;border-bottom:1px solid var(--line);
  }
  @media (max-width:760px){.ledger-row{grid-template-columns:1fr;gap:4px;}}
  .ledger-row .lg-name{font-family:'Cormorant Garamond','Amiri',serif;font-size:1.18rem;color:#fff;}
  .ledger-row .lg-cred{font-size:0.82rem;color:rgba(248,244,233,0.62);}
  .ledger-row .lg-role{font-family:'Cinzel','Amiri',serif;font-size:0.68rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold-bright);text-align:right;}
  @media (max-width:760px){.ledger-row .lg-role{text-align:left;margin-top:4px;}}
  .ledger-heading{font-family:'Cinzel','Amiri',serif;font-size:0.72rem;letter-spacing:0.16em;color:var(--gold-bright);text-transform:uppercase;margin:44px 0 6px;padding-bottom:10px;border-bottom:1px solid var(--gold);}
  .ledger-heading:first-of-type{margin-top:36px;}
  .ledger.on-light .lg-name{color:var(--navy);}
  .ledger.on-light .lg-cred{color:#54534e;}
  .ledger.on-light .lg-role{color:var(--crimson);}
  /* Founder & CEO spotlight */
  .founder-spotlight{display:flex;align-items:center;gap:32px;margin-top:34px;padding:28px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  @media (max-width:600px){.founder-spotlight{flex-direction:column;align-items:flex-start;text-align:left;gap:20px;}}
  .founder-spotlight .fs-photo{width:132px;height:132px;flex-shrink:0;border-radius:50%;overflow:hidden;border:1px solid var(--gold);box-shadow:0 0 0 6px rgba(198,161,91,0.12);}
  .founder-spotlight .fs-photo img{width:100%;height:100%;object-fit:cover;display:block;}
  .founder-spotlight .fs-label{font-family:'Cinzel','Amiri',serif;font-size:0.64rem;letter-spacing:0.16em;color:var(--gold);text-transform:uppercase;display:block;margin-bottom:8px;}
  .founder-spotlight .fs-name{font-family:'Cormorant Garamond','Amiri',serif;font-size:1.55rem;color:#fff;display:block;}
  .founder-spotlight .fs-cred{font-size:0.86rem;color:rgba(248,244,233,0.62);margin-top:4px;display:block;}
  .founder-spotlight .fs-role{font-family:'Cinzel','Amiri',serif;font-size:0.7rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold-bright);margin-top:10px;display:block;}
  /* Asymmetric Mission/Vision — replaces twin boxed cards */
  .mv-asym{display:grid;grid-template-columns:1.6fr 1fr;gap:50px;align-items:start;margin-bottom:56px;}
  @media (max-width:800px){.mv-asym{grid-template-columns:1fr;gap:28px;}}
  .mv-lead{border-left:2px solid var(--gold);padding-left:32px;}
  .mv-lead .mv-label{font-family:'Cinzel','Amiri',serif;font-size:0.68rem;letter-spacing:0.16em;color:var(--gold);text-transform:uppercase;margin-bottom:14px;display:block;}
  .mv-lead p{font-family:'Cormorant Garamond','Amiri',serif;font-size:1.7rem;line-height:1.35;color:var(--navy);font-weight:500;}
  .mv-aside{padding-top:52px;}
  .mv-aside .mv-label{font-family:'Cinzel','Amiri',serif;font-size:0.62rem;letter-spacing:0.14em;color:var(--crimson);text-transform:uppercase;margin-bottom:10px;display:block;}
  .mv-aside p{font-size:0.92rem;color:#54534e;}
  /* Monogram rail — replaces CLEVER box grid */
  .monogram-rail{display:flex;align-items:stretch;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  .mono-letter{flex:1;text-align:center;padding:26px 6px;position:relative;}
  .mono-letter:not(:last-child)::after{content:"";position:absolute;top:20%;bottom:20%;right:0;width:1px;background:var(--line);}
  .mono-letter .mg{font-family:'Cinzel','Amiri',serif;font-size:2.1rem;color:var(--gold);display:block;line-height:1;}
  .mono-letter .mw{font-family:'Cinzel','Amiri',serif;font-size:0.6rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--navy);margin-top:10px;display:block;}
  .mono-letter .md{font-size:0.76rem;color:#6b6a63;margin-top:6px;display:block;font-style:italic;font-family:'Cormorant Garamond','Amiri',serif;}
  @media (max-width:760px){.monogram-rail{flex-wrap:wrap;} .mono-letter{flex:1 1 33%;border-bottom:1px solid var(--line);} .mono-letter::after{display:none;}}
  /* Facility index — dot-leader list, replaces box grid */
  .fac-index{display:flex;flex-direction:column;}
  .fac-row{display:flex;align-items:center;gap:10px;padding:13px 0;border-bottom:1px solid var(--line);break-inside:avoid;}
  .fac-row .fn{font-family:'Cinzel','Amiri',serif;font-size:0.72rem;color:var(--gold);width:22px;flex-shrink:0;}
  .fac-row .fic{color:var(--gold);flex-shrink:0;display:flex;width:18px;height:18px;}
  .fac-row .fic svg{width:100%;height:100%;}
  .fac-row .ft{font-family:'Cormorant Garamond','Amiri',serif;font-size:1.02rem;color:var(--ivory);flex-shrink:0;}
  /* Facility framework — three real categories, grouped from the same
     12 real facilities above (numbering stays consistent with the
     gallery captions' "Facility 0N" references) */
  .fac-framework{margin-top:40px;display:grid;grid-template-columns:repeat(3,1fr);gap:0 40px;}
  @media (max-width:820px){.fac-framework{grid-template-columns:1fr;gap:36px;}}
  .fac-group-heading{font-family:'Cinzel','Amiri',serif;font-size:0.68rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--gold-bright);margin-bottom:8px;}
  .fac-group-outcome{font-size:0.82rem;color:rgba(248,244,233,0.62);line-height:1.5;margin-bottom:14px;}
  .stat-band.cols-3{grid-template-columns:repeat(3,1fr);}
  @media (max-width:760px){.stat-band.cols-3{grid-template-columns:1fr 1fr 1fr;}}
  .fac-row .fdots{flex:1;border-bottom:1px dotted rgba(248,244,233,0.28);transform:translateY(-5px);}
  /* Folio marker — recurring heritage device at section openings */
  .folio{font-family:'Cinzel','Amiri',serif;font-size:0.62rem;letter-spacing:0.18em;color:var(--gold);text-transform:uppercase;display:flex;align-items:center;gap:12px;margin-bottom:18px;}
  .folio::after{content:"";flex:0 0 60px;height:1px;background:var(--gold);opacity:0.6;}
  /* Hero headline choreography */
  .hero h1 .word{display:inline-block;opacity:0;transform:translateY(16px);animation:wordIn .7s ease forwards;}
  @keyframes wordIn{to{opacity:1;transform:translateY(0);}}
  /* Homepage hero title — slow, deliberate typewriter reveal (not a
     looping gimmick: the caret blinks a handful of times, then settles).
     Width is measured and driven by JS (see js/site.js), not guessed via
     ch units — the serif display face's proportional metrics make a
     fixed character-count width unreliable and risk clipping the text. */
  .hero-type{display:inline-block;max-width:100%;vertical-align:bottom;}
  .hero-type.js-type{
    overflow:hidden;white-space:nowrap;border-right:2px solid var(--gold-bright);
    transition:width 1.7s steps(27,end);animation:heroCaret .8s step-end 9;
  }
  .hero-type.js-type.is-done{border-right-color:transparent;}
  @keyframes heroCaret{50%{border-color:transparent;}}
  /* Idle crest breathing — ceremonial, not gimmicky */
  .seal-inner .crest-img{animation:crestBreathe 7s ease-in-out infinite;}
  .seal-inner{position:relative;}
  .seal-inner .crest-img{position:relative;}
  .crest-shimmer-wrap{position:relative;display:inline-block;}
  .crest-shimmer-wrap::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(115deg,transparent 30%,rgba(233,206,138,0.35) 45%,rgba(233,206,138,0.55) 50%,rgba(233,206,138,0.35) 55%,transparent 70%);
    background-size:250% 250%;background-position:200% 200%;
    mix-blend-mode:screen;animation:foilSweep 6s ease-in-out infinite;pointer-events:none;
  }
  @keyframes foilSweep{0%,40%{background-position:200% 200%;}55%,100%{background-position:-50% -50%;}}
  @media (prefers-reduced-motion:reduce){.crest-shimmer-wrap::after{animation:none;display:none;}}
  @keyframes crestBreathe{0%,100%{transform:scale(1);}50%{transform:scale(1.018);}}
  /* Refined hover states */
  .ledger-row{transition:padding-left .3s ease, border-color .3s ease;}
  .ledger-row:hover{padding-left:14px;border-color:var(--gold);}
  .ledger-row:hover .lg-name{color:var(--gold-bright) !important;}
  .ledger.on-light .ledger-row:hover .lg-name{color:var(--crimson) !important;}
  .school-block{transition:box-shadow .35s ease, border-color .35s ease;}
  .school-block:hover{border-color:var(--gold);box-shadow:0 22px 50px -30px rgba(59,42,29,0.35);}
  .fac-row{transition:padding-left .3s ease;}
  .fac-row:hover{padding-left:8px;}
  .fac-row:hover .ft{color:var(--gold-bright);}
  .mono-letter{transition:transform .3s ease;}
  .mono-letter:hover{transform:translateY(-4px);}
  @media (prefers-reduced-motion:reduce){.hero h1 .word{animation:none;opacity:1;transform:none;} .seal-inner .crest-img{animation:none;}}
  /* === Depth & gold-edge material system (sharp-cornered, per heritage/crest logic) === */
  .gold-edge{
    border:1px solid var(--gold);
    box-shadow:0 1px 0 rgba(198,161,91,0.5) inset, 0 24px 44px -28px rgba(34,23,9,0.45);
  }
  .surface-lift{box-shadow:0 20px 44px -26px rgba(34,23,9,0.4);}
  .director-card{box-shadow:0 26px 50px -28px rgba(34,23,9,0.5);}
  .quote-panel{box-shadow:0 26px 50px -28px rgba(34,23,9,0.5);}
  .boarding-panel{box-shadow:0 26px 50px -28px rgba(34,23,9,0.5);}
  .docs-box,.placeholder-block{box-shadow:0 16px 34px -24px rgba(34,23,9,0.3);}
  .school-block{border:1px solid var(--line);box-shadow:0 18px 40px -28px rgba(34,23,9,0.28), 0 1px 0 rgba(198,161,91,0.35) inset;}
  .found-card{border:1px solid var(--line);box-shadow:0 16px 32px -24px rgba(34,23,9,0.25), 0 1px 0 rgba(198,161,91,0.3) inset;}
  /* Crimson used with intent: milestones and role distinction only */
  .folio{color:var(--gold);}
  .folio .chapter-word{color:var(--crimson);font-weight:700;}
  /* staggered reveal for children of a section */
  .stagger > *{opacity:0;transform:translateY(10px);transition:opacity .55s ease, transform .55s ease;}
  .stagger.in > *{opacity:1;transform:translateY(0);}
  .stagger.in > *:nth-child(1){transition-delay:.03s;} .stagger.in > *:nth-child(2){transition-delay:.09s;}
  .stagger.in > *:nth-child(3){transition-delay:.15s;} .stagger.in > *:nth-child(4){transition-delay:.21s;}
  .stagger.in > *:nth-child(5){transition-delay:.27s;} .stagger.in > *:nth-child(6){transition-delay:.33s;}
  .stagger.in > *:nth-child(7){transition-delay:.39s;} .stagger.in > *:nth-child(n+8){transition-delay:.45s;}
  /* refined nav mark replacing boxed CTA button */
  .nav-mark{border:1px solid var(--gold);color:var(--gold-bright) !important;padding:8px 18px !important;font-family:'Cinzel','Amiri',serif;font-size:0.66rem !important;letter-spacing:0.14em;white-space:nowrap;flex-shrink:0;}
  .nav-mark:hover{background:rgba(198,161,91,0.12);border-color:var(--gold-bright);}
  *{box-sizing:border-box;margin:0;padding:0;}
  html{scroll-behavior:smooth;overflow-x:hidden;}
  body{font-family:'Inter','Cairo',sans-serif;color:var(--on-surface);background:var(--surface);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
  /* The crest-watermark bleed and similar decorative elements intentionally
     extend past the viewport edge; without this, that harmless extra
     scroll width shifts the default RTL scroll origin and clips the start
     of every right-aligned line (Arabic nav/text) on narrow screens. */
  h1,h2,h3,h4{font-family:'Cormorant Garamond','Amiri',serif;font-weight:600;color:var(--navy);line-height:1.15;}
  .crest-type{font-family:'Cinzel','Amiri',serif;}
  a{color:inherit;text-decoration:none;}
  img{max-width:100%;display:block;}
  /* Editorial text-link — the one recurring "this is clickable" signal,
     reused instead of inventing a new link style per section */
  .text-link{color:var(--crimson);font-weight:600;border-bottom:1px solid rgba(124,31,46,0.35);}
  .text-link:hover{border-color:var(--crimson);}
  .text-link.on-dark{color:var(--gold-bright);border-bottom-color:rgba(233,206,138,0.4);}
  .text-link.on-dark:hover{border-color:var(--gold-bright);}
  .ledger-row a{border-bottom:1px solid transparent;}
  .ledger-row a:hover{color:var(--crimson);border-color:var(--crimson);}
  /* Cross-links between sibling pages (e.g. the four Academics schools) */
  .page-crosslinks{margin-top:56px;padding-top:26px;border-top:1px solid var(--line);}
  .page-crosslinks p{font-size:0.92rem;color:#54534e;}
  .page-crosslinks a{color:var(--crimson);font-weight:600;}
  .page-crosslinks a:hover{border-bottom:1px solid var(--crimson);}
  /* Condensed-flow chips — a homepage teaser summarising a longer,
     numbered process (e.g. 4 of Admission's 12 stages) without
     borrowing the full step-counter component, which would misnumber */
  .mini-flow{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:30px;}
  .mini-flow span{font-family:'Cinzel','Amiri',serif;font-size:0.7rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--navy);background:#fff;border:1px solid var(--line);padding:11px 18px;}
  .mini-flow .arrow{color:var(--gold);font-size:0.9rem;}
  /* Homepage teaser sections link out to their full chapter */
  .teaser-link{display:inline-block;margin-top:24px;}
  /* Marks a link that crosses back to the English site because this
     page hasn't been translated yet — visible, not hidden, matching
     the placeholder-block's "say so plainly" convention */
  .en-tag{font-family:'Inter','Cairo',sans-serif;font-size:0.62em;opacity:0.6;letter-spacing:0.04em;margin-inline-start:5px;}
  .eyebrow{font-family:'Cinzel','Amiri',serif;font-size:0.68rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold);font-weight:600;display:flex;align-items:center;gap:0.6em;}
  .eyebrow::before{content:"";width:22px;height:1px;background:var(--gold);display:inline-block;}
  .wrap{max-width:1180px;margin:0 auto;padding:0 24px;}
  section{padding:96px 0;}
  @media (max-width:720px){section{padding:56px 0;}}
  .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease;}
  .reveal.in{opacity:1;transform:translateY(0);}
  .placeholder-block{border-top:1px solid var(--gold);border-bottom:1px solid var(--gold);background:rgba(198,161,91,0.05);padding:26px 30px;margin-top:26px;position:relative;}
  .placeholder-block::before{content:"";position:absolute;top:4px;bottom:4px;left:4px;right:4px;border:1px solid rgba(198,161,91,0.25);pointer-events:none;}
  .placeholder-block .tag{font-family:'Inter','Cairo',sans-serif;font-size:0.68rem;text-transform:uppercase;letter-spacing:0.1em;color:var(--crimson);font-weight:700;}
  .placeholder-block p{font-size:0.9rem;color:#54534e;margin-top:8px;}

  /* topbar / nav (unchanged pattern) */
  .topbar{background:var(--navy-deep);color:var(--gold-bright);font-size:0.76rem;}
  .topbar .wrap{display:flex;justify-content:space-between;align-items:center;padding:9px 24px;flex-wrap:wrap;gap:8px;}
  .topbar a{opacity:0.85;} .topbar a:hover{opacity:1;color:#fff;}
  .topbar .contacts{display:flex;gap:20px;flex-wrap:wrap;align-items:center;}
  .topbar .contacts a{display:inline-flex;align-items:center;gap:6px;}
  .ci-icon{flex-shrink:0;opacity:0.75;}
  /* Mobile: one clean aligned line (email │ phone │ phone) instead of
     wrapping across 2-3 rows. Icons shrink rather than disappear (they
     stay a real alignment anchor), pipe separators replace the wider
     desktop gap, and type steps down to the same small-label size
     already used elsewhere on the site (.fd-item, .pc-strip-item). */
  @media (max-width:600px){
    .topbar .contacts{flex-wrap:nowrap;gap:0;font-size:0.62rem;justify-content:flex-start;}
    .topbar .contacts a{gap:3px;white-space:nowrap;}
    .topbar .contacts a:not(:last-child)::after{
      content:"";display:inline-block;width:1px;height:9px;background:rgba(233,206,138,0.3);
      margin:0 8px;flex-shrink:0;
    }
    .ci-icon{width:10px;height:10px;}
  }
  .topbar .socials{display:flex;gap:14px;align-items:center;}
  .topbar-divider{width:1px;height:14px;background:rgba(233,206,138,0.25);flex-shrink:0;}
  /* Real recognisable platform icons rather than plain text names —
     monochrome line-icon treatment matching the site's own icon
     language (nav-mega, footer) rather than colour brand logos, which
     would clash with the topbar's refined gold/ivory palette. */
  .social-icon{display:flex;align-items:center;justify-content:center;width:26px;height:26px;flex-shrink:0;opacity:0.85;transition:opacity .2s ease,transform .2s ease;}
  .social-icon:hover{opacity:1;color:#fff;transform:translateY(-1px);}
  header.nav{position:sticky;top:0;z-index:50;background:var(--navy);border-bottom:1px solid var(--line);position:relative;}
  header.nav::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,transparent,var(--gold) 20%,var(--gold-bright) 50%,var(--gold) 80%,transparent);opacity:0.85;pointer-events:none;}
  nav.wrap{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;}
  .brand{display:flex;align-items:center;gap:12px;flex-shrink:0;}
  .brand-mark{width:36px;height:36px;flex-shrink:0;animation:crestIn .9s ease .1s both;}
  .brand-text .line1{font-size:1.05rem;font-weight:700;letter-spacing:0.03em;color:#fff;font-family:'Cinzel','Amiri',serif;white-space:nowrap;}
  .brand-text .line2{font-size:0.58rem;letter-spacing:0.2em;color:var(--gold-bright);text-transform:uppercase;font-family:'Inter','Cairo',sans-serif;white-space:nowrap;}
  .navlinks{display:flex;gap:26px;align-items:center;}
  .navlinks a{color:var(--ivory);font-size:0.82rem;font-weight:500;padding:6px 0;border-bottom:1px solid transparent;position:relative;transition:color .25s ease;white-space:nowrap;}
  .navlinks a::after{content:"";position:absolute;left:0;bottom:-1px;width:0;height:1px;background:var(--gold-bright);transition:width .3s cubic-bezier(.4,0,.2,1);}
  .navlinks a:hover{color:var(--gold-bright);border-color:transparent;}
  .navlinks a:hover::after{width:100%;}
  .navlinks a.nav-mark::after,.navlinks a.nav-cta::after{display:none;}
  .nav-cta{background:linear-gradient(135deg,var(--gold) 0%,var(--gold-bright) 100%);color:var(--navy-deep) !important;font-weight:700 !important;padding:9px 18px !important;border-radius:2px;box-shadow:0 6px 16px -6px rgba(198,161,91,0.55);transition:box-shadow .3s ease,transform .3s ease;}
  .nav-cta:hover{box-shadow:0 10px 24px -6px rgba(233,206,138,0.7);transform:translateY(-1px);}
  .menu-toggle{
    display:none;align-items:center;gap:7px;color:var(--gold-bright);background:none;cursor:pointer;
    border:1px solid var(--gold);padding:8px 14px;font-family:'Inter','Cairo',sans-serif;
    font-size:0.7rem;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;
    transition:background .25s ease,border-color .25s ease;
  }
  .menu-toggle:hover{background:rgba(198,161,91,0.12);border-color:var(--gold-bright);}
  .menu-toggle svg{flex-shrink:0;}
  /* Mobile quick-actions row — a persistent second strip beneath the
     main header bar so Apply / Portal / Contact stay visible before
     the drawer is ever opened, instead of the header reading as bare
     crest + search + hamburger. Desktop never sees this; the row
     duplicates the same nav-mark/nav-cta destinations already in the
     drawer, just surfaced a level higher on narrow screens. */
  /* Mobile nav ribbon — the institutional architecture (all 7 header
     categories) surfaced as large icon cards, swipeable, visible the
     instant the page loads. This is the PRIMARY mobile navigation;
     the hamburger drawer becomes a secondary "Full Menu" fallback
     (its final card) for reaching the deeper mega-panel sub-items and
     Featured callouts, not the only way to see the site has sections. */
  .mobile-nav-ribbon{display:none;}
  .mnr-item{
    scroll-snap-align:start;flex:0 0 auto;display:flex;flex-direction:column;align-items:center;
    gap:7px;width:78px;padding:13px 6px 11px;text-align:center;
    border:1px solid rgba(198,161,91,0.28);background:rgba(198,161,91,0.05);
    font-family:'Inter','Cairo',sans-serif;color:var(--ivory);
    transition:background .2s ease,border-color .2s ease;cursor:pointer;
  }
  .mnr-item:hover,.mnr-item:active{background:rgba(198,161,91,0.14);border-color:var(--gold-bright);}
  .mnr-item svg{width:26px;height:26px;color:var(--gold-bright);flex-shrink:0;}
  .mnr-item span{font-size:0.62rem;font-weight:600;letter-spacing:0.02em;line-height:1.25;}
  .mnr-item.mnr-more{border-style:dashed;background:none;}
  .mobile-quick-row{display:none;}
  .mqr-item{
    display:flex;align-items:center;gap:6px;flex:0 0 auto;justify-content:center;scroll-snap-align:start;
    padding:10px 14px;font-family:'Inter','Cairo',sans-serif;font-size:0.72rem;font-weight:600;white-space:nowrap;
    letter-spacing:0.02em;color:var(--ivory);border-inline-end:1px solid rgba(198,161,91,0.18);
    transition:background .2s ease,color .2s ease;
  }
  .mqr-item:last-child{border-inline-end:none;}
  .mqr-item:hover{background:rgba(198,161,91,0.1);color:var(--gold-bright);}
  .mqr-item svg{flex-shrink:0;color:var(--gold-bright);}
  .mqr-item.mqr-cta{color:var(--navy-deep);background:linear-gradient(135deg,var(--gold) 0%,var(--gold-bright) 100%);}
  .mqr-item.mqr-cta svg{color:var(--navy-deep);}
  .mqr-item.mqr-cta:hover{background:linear-gradient(135deg,var(--gold-bright) 0%,var(--gold) 100%);color:var(--navy-deep);}
  /* Prayer Times opens the Personalisation Centre's Islamic tab via a
     <button>, not a link — reset the UA button chrome so it matches
     the surrounding <a> items exactly. */
  button.mqr-item{background:none;border:none;border-inline-end:1px solid rgba(198,161,91,0.18);cursor:pointer;}
  button.mqr-item:last-child{border-inline-end:none;}
  /* A touch more heraldic presence for the crest at true mobile
     widths — larger mark, soft static glow behind it (no animation;
     restraint over spectacle, matching the rest of the site's motion
     language). */
  @media (max-width:600px){
    .brand{position:relative;}
    .brand::before{
      content:"";position:absolute;left:-7px;top:50%;transform:translateY(-50%);
      width:54px;height:54px;border-radius:50%;
      background:radial-gradient(circle,var(--gold-bright) 0%,transparent 70%);
      opacity:0.2;filter:blur(9px);pointer-events:none;
    }
    .brand-mark{width:40px;height:40px;position:relative;}
  }
  .search-toggle{
    display:flex;align-items:center;justify-content:center;width:36px;height:36px;flex-shrink:0;
    color:var(--ivory);background:none;border:1px solid transparent;cursor:pointer;transition:color .2s ease, border-color .2s ease;
  }
  .search-toggle:hover{color:var(--gold-bright);border-color:rgba(233,206,138,0.3);}

  /* Site search overlay — a centered panel over a dimmed backdrop,
     not a full navigation takeover. */
  .search-overlay{
    position:fixed;inset:0;z-index:300;background:rgba(20,13,6,0.72);
    display:flex;align-items:flex-start;justify-content:center;padding:10vh 20px 20px;
  }
  .search-overlay[hidden]{display:none;}
  body.search-lock{overflow:hidden;}
  .search-panel{
    width:100%;max-width:560px;background:var(--surface);border:1px solid var(--gold);
    box-shadow:0 40px 80px -20px rgba(0,0,0,0.6);max-height:70vh;display:flex;flex-direction:column;
  }
  .search-panel-head{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line);color:var(--navy);flex-shrink:0;}
  .search-panel-head input{
    flex:1;border:none;outline:none;background:none;font-family:'Inter','Cairo',sans-serif;font-size:1rem;color:var(--on-surface);
  }
  .search-close{background:none;border:none;color:var(--on-surface-soft);cursor:pointer;font-size:0.9rem;flex-shrink:0;}
  .search-results{overflow-y:auto;padding:8px 0;}
  .search-result{display:flex;flex-direction:column;gap:3px;padding:12px 18px;text-decoration:none;border-bottom:1px solid var(--line);}
  .search-result:last-child{border-bottom:none;}
  .search-result:hover{background:rgba(198,161,91,0.08);}
  .search-result-title{font-family:'Cinzel','Amiri',serif;font-size:0.88rem;color:var(--navy);}
  .search-result-desc{font-family:'Inter','Cairo',sans-serif;font-size:0.76rem;color:var(--on-surface-soft);
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
  .search-empty{padding:20px 18px;color:var(--on-surface-soft);font-size:0.85rem;}
  /* "Our Story" nav dropdown — a bordered panel in the brand's own
     material, not a generic drop-shadow menu */
  .nav-drop{position:relative;}
  .nav-drop-panel{
    position:absolute;top:calc(100% + 13px);left:0;min-width:200px;z-index:60;
    background:var(--navy-deep);border:1px solid var(--line);border-top:2px solid var(--gold);
    padding:6px 0;display:none;flex-direction:column;
  }
  .nav-drop-panel a{padding:11px 20px;white-space:nowrap;border-bottom:none !important;}
  .nav-drop:hover .nav-drop-panel,
  .nav-drop:focus-within .nav-drop-panel{display:flex;}

  /* Academics mega-menu — two columns: institution list + a featured
     callout, built on the same .nav-drop-panel base as the simpler
     single-column dropdowns above. */
  .nav-mega-panel{flex-direction:row;min-width:520px;padding:0;}
  .nav-mega-col{display:flex;flex-direction:column;padding:8px 0;flex:1;}
  .nav-mega-item{display:flex !important;align-items:center;gap:11px;padding:10px 20px !important;}
  .nav-mega-icon{color:var(--gold-bright);flex-shrink:0;display:flex;}
  .nav-mega-text{display:flex;flex-direction:column;gap:2px;}
  .nav-mega-text .t{font-size:0.82rem;color:var(--ivory);}
  .nav-mega-text .d{font-size:0.66rem;color:rgba(248,244,233,0.55);}
  .nav-mega-featured{
    width:210px;flex-shrink:0;background:rgba(198,161,91,0.08);
    border-inline-start:1px solid var(--line);padding:22px 20px;
    display:flex;flex-direction:column;gap:7px;
  }
  .nav-mega-featured-label{font-size:0.62rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold-bright);}
  .nav-mega-featured-link{font-family:'Cinzel','Amiri',serif;font-size:0.86rem;color:#fff !important;padding:0 !important;}
  .nav-mega-featured p{font-size:0.72rem;line-height:1.5;color:rgba(248,244,233,0.6);margin:0;}

  @media (max-width:1200px){
    .navlinks{position:absolute;top:100%;left:0;right:0;background:var(--navy);flex-direction:column;align-items:flex-start;padding:18px 24px 26px;display:none;border-bottom:1px solid var(--line);gap:4px;max-height:calc(100vh - 70px);overflow-y:auto;}
    .navlinks.open{display:flex;}
    .menu-toggle{display:flex;}
    .mobile-nav-ribbon{
      display:flex;gap:9px;overflow-x:auto;scroll-snap-type:x proximity;
      padding:12px 16px;border-top:1px solid rgba(198,161,91,0.18);border-bottom:1px solid rgba(198,161,91,0.18);
      background:rgba(0,0,0,0.16);-webkit-overflow-scrolling:touch;scrollbar-width:none;
    }
    .mobile-nav-ribbon::-webkit-scrollbar{display:none;}
    .mobile-quick-row{
      display:flex;overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;
      border-bottom:1px solid rgba(198,161,91,0.15);background:rgba(0,0,0,0.12);
    }
    .mobile-quick-row::-webkit-scrollbar{display:none;}
    .nav-drop{width:100%;display:flex;flex-wrap:wrap;align-items:center;border-bottom:1px solid rgba(198,161,91,0.15);}
    .nav-drop:last-of-type{border-bottom:none;}
    .nav-drop-trigger{flex:1;padding:12px 0 !important;}
    /* Mobile-only accordion toggle — each mega-panel is now large
       (icon + description + links), too big to leave permanently
       expanded like the old simple link-list dropdowns were. */
    .nav-drop-toggle{
      display:flex;align-items:center;justify-content:center;flex-shrink:0;
      width:32px;height:32px;background:none;border:1px solid var(--line);color:var(--gold-bright);
      cursor:pointer;transition:border-color .25s ease;
    }
    .nav-drop-toggle svg{transition:transform .25s ease;}
    .nav-drop.open .nav-drop-toggle{border-color:var(--gold-bright);}
    .nav-drop.open .nav-drop-toggle svg{transform:rotate(180deg);}
    .nav-drop-panel{position:static;display:none;background:none;border:none;padding:2px 0 14px 14px;width:100%;}
    .nav-drop.open .nav-drop-panel{display:flex;}
    .nav-drop-panel a{padding:8px 0;}
    .nav-mega-panel{flex-direction:column;min-width:0;}
    .nav-mega-item{padding:8px 0 !important;}
    .nav-mega-featured{width:auto;border-inline-start:none;border-top:1px solid var(--line);margin-top:6px;padding:14px 0 6px;}
    .nav-mega-intro{width:auto !important;border-inline-end:none !important;padding:6px 0 10px !important;}
  }

  /* === Premium mega-menu upgrade — large icon + description intro
     column on every dropdown, not just Academics === */
  .navlinks{gap:22px;}
  .nav-mega-panel{align-items:stretch;}
  .nav-mega-intro{width:220px;flex-shrink:0;padding:24px 22px;background:rgba(198,161,91,0.06);border-inline-end:1px solid var(--line);display:flex;flex-direction:column;gap:9px;}
  .nav-mega-intro .nmi-icon{width:38px;height:38px;color:var(--gold-bright);}
  .nav-mega-intro .nmi-icon svg{width:100%;height:100%;}
  .nav-mega-intro h4{font-family:'Cinzel','Amiri',serif;color:#fff;font-size:1.02rem;margin-top:2px;font-weight:600;}
  .nav-mega-intro p{font-size:0.76rem;line-height:1.55;color:rgba(248,244,233,0.6);}
  .nav-mega-panel.is-compact{min-width:300px;}
  .nav-mega-panel.is-compact .nav-mega-intro{border-inline-end:none;width:auto;}
  .nav-mega-panel.is-compact .nmi-cta{margin-top:4px;align-self:flex-start;font-family:'Cinzel','Amiri',serif;font-size:0.66rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold-bright);border:1px solid rgba(233,206,138,0.4);padding:9px 16px;transition:border-color .25s ease,background .25s ease;}
  .nav-mega-panel.is-compact .nmi-cta:hover{border-color:var(--gold-bright);background:rgba(198,161,91,0.1);}
  .nav-mega-panel.is-compact .nmi-secondary{margin-top:2px;font-size:0.78rem;color:var(--ivory);opacity:0.75;}
  .nav-mega-panel.is-compact .nmi-secondary:hover{opacity:1;color:var(--gold-bright);}

  /* Active-page indicator — set client-side by js/site.js */
  .navlinks > a.is-active{color:var(--gold-bright);}
  .navlinks > a.is-active::after{width:100%;}
  .nav-drop.is-active > .nav-drop-trigger{color:var(--gold-bright);}

  /* hero */
  .hero{position:relative;background-image:url("/assets/images/gallery/campus-hero.jpg");background-size:cover;background-position:center 65%;color:var(--ivory);padding:120px 0 100px;overflow:hidden;}
  .hero::before{content:"";position:absolute;inset:0;z-index:0;background:radial-gradient(circle at 15% 20%,rgba(198,161,91,0.14),transparent 45%),radial-gradient(circle at 85% 80%,rgba(198,161,91,0.10),transparent 40%),linear-gradient(180deg,rgba(59,42,29,0.88) 0%,rgba(34,23,9,0.93) 100%);}
  .hero .frame{position:absolute;inset:26px;border:1px solid var(--line);pointer-events:none;z-index:1;}
  .hero .corner{position:absolute;width:44px;height:44px;z-index:1;}
  .hero .corner svg{width:100%;height:100%;}
  .hero .corner.tl{top:26px;left:26px;} .hero .corner.tr{top:26px;right:26px;transform:scaleX(-1);}
  .hero .corner.bl{bottom:26px;left:26px;transform:scaleY(-1);} .hero .corner.br{bottom:26px;right:26px;transform:scale(-1,-1);}
  .hero-inner{position:relative;z-index:2;max-width:840px;margin:0 auto;text-align:center;}
  .hero-crest{width:150px;height:auto;margin:0 auto 30px;opacity:0;animation:crestIn 1.2s ease .1s both;}
  .hero-inner .eyebrow{justify-content:center;margin-bottom:22px;} .hero-inner .eyebrow::before{display:none;}
  .hero h1{font-family:'Cinzel','Amiri',serif;font-size:clamp(2rem,4.6vw,3.4rem);color:#fff;letter-spacing:0.01em;animation:riseIn 1s ease both;}
  .hero h1 span{display:block;color:var(--gold-bright);font-size:0.5em;letter-spacing:0.28em;margin-top:14px;font-family:'Inter','Cairo',sans-serif;font-weight:600;}
  .hero h1 .hero-subline{opacity:0;transform:translateY(10px);animation:riseIn .8s ease 2.1s forwards;}
  @media (prefers-reduced-motion:reduce){.hero h1 .hero-subline{animation:none;opacity:1;transform:none;}}
  .hero p.lede{font-size:1.06rem;color:rgba(248,244,233,0.82);max-width:640px;margin:26px auto 0;animation:riseIn 1s ease .15s both;}
  .hero-ctas{display:flex;gap:16px;justify-content:center;margin-top:40px;flex-wrap:wrap;animation:riseIn 1s ease .3s both;}
  @keyframes riseIn{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:translateY(0);}}
  @keyframes crestIn{from{opacity:0;transform:translateY(-10px) scale(.92);}to{opacity:1;transform:translateY(0) scale(1);}}
  /* The mobile header (topbar + Hijri strip + main row + nav ribbon +
     quick-actions row) is taller than desktop's single-row header, so
     the hero's own top spacing has to compress on true mobile widths
     or its heading lands underneath the fixed WhatsApp/Call buttons —
     both of which are deliberately always-visible (see their rules
     below) and can't be the ones that move. Same content, same order,
     same hierarchy — just a tighter rhythm before the headline. */
  @media (max-width:600px){
    .hero{padding-top:14px;}
    .hero-crest{width:40px;margin-bottom:4px;}
    .hero-inner .eyebrow{margin-bottom:4px;}
    .hero h1{font-size:1.15rem;}
    .hero h1 span{margin-top:4px;}
    .hero p.lede{margin-top:6px;font-size:0.84rem;}
    /* Stacked full-width, not flex-wrapped — a wrapped 2-then-1 layout's
       total height depends on exactly how much text fits per row, which
       flips unpredictably between ~360-428px viewports and reopens the
       clearance gap against the fixed WhatsApp/Call buttons below. A
       single column has one fixed, calculable height at every width. */
    .hero-ctas{margin-top:10px;gap:6px;flex-direction:column;align-items:stretch;}
    .hero-ctas .btn{padding:8px 18px;font-size:0.64rem;justify-content:center;}
  }
  .btn{display:inline-flex;align-items:center;gap:9px;padding:15px 30px;font-size:0.78rem;letter-spacing:0.14em;text-transform:uppercase;font-weight:600;transition:transform .3s cubic-bezier(.4,0,.2,1),box-shadow .3s ease,background .3s ease,letter-spacing .3s ease;position:relative;font-family:'Cinzel','Amiri',serif;}
  .btn-gold{overflow:hidden;background:linear-gradient(135deg,var(--navy) 0%,var(--emerald) 45%,var(--accent) 100%);background-size:180% 180%;background-position:0% 0%;color:#fff;border:1px solid var(--accent);box-shadow:0 10px 26px -12px var(--accent-shadow);}
  .btn-gold:hover{background-position:100% 100%;box-shadow:0 14px 34px -10px var(--accent-shadow);transform:translateY(-2px);color:#fff;}
  .btn-gold::after{
    content:"";position:absolute;top:0;left:-60%;width:35%;height:100%;
    background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,0.32) 50%,transparent 100%);
    transform:skewX(-18deg);transition:left .55s ease;pointer-events:none;
  }
  .btn-gold:hover::after{left:130%;}
  @media (prefers-reduced-motion:reduce){.btn-gold::after{transition:none;display:none;}}
  .btn-outline{border-top:1px solid rgba(198,161,91,0.5);border-bottom:1px solid rgba(198,161,91,0.5);color:var(--gold-bright);}
  .btn-outline::before,.btn-outline::after{content:"";position:absolute;top:3px;bottom:3px;width:1px;background:rgba(198,161,91,0.4);}
  .btn-outline::before{left:0;} .btn-outline::after{right:0;}
  .btn-outline:hover{background:rgba(198,161,91,0.08);letter-spacing:0.18em;transform:translateY(-1px);}
  .arrow{display:inline-block;transition:transform .3s cubic-bezier(.4,0,.2,1);}
  .btn:hover .arrow,.nav-cta:hover .arrow,.foot-quick-actions a:hover .arrow{transform:translateX(4px);}
  [dir="rtl"] .btn:hover .arrow,[dir="rtl"] .nav-cta:hover .arrow,[dir="rtl"] .foot-quick-actions a:hover .arrow{transform:translateX(-4px);}

  /* director message */
  .director{background:#fff;}
  .director-grid{display:grid;grid-template-columns:0.85fr 1.15fr;gap:60px;align-items:start;}
  @media (max-width:860px){.director-grid{grid-template-columns:1fr;gap:30px;}}
  .director-card{background:var(--navy);color:var(--ivory);padding:40px 32px;position:relative;transition:box-shadow .35s ease,transform .35s ease;}
  .director-card:hover{transform:translateY(-3px);box-shadow:0 32px 60px -30px rgba(34,23,9,0.6);}
  .director-card .role{font-family:'Cinzel','Amiri',serif;font-size:0.7rem;letter-spacing:0.16em;color:var(--gold-bright);text-transform:uppercase;}
  .director-card h3{color:#fff;font-size:1.6rem;margin:10px 0 6px;}
  .director-card .creds{font-size:0.82rem;color:rgba(248,244,233,0.7);}
  .director-body p{margin-bottom:16px;font-size:0.97rem;color:#3a3934;}
  .director-body p:first-of-type::first-letter{font-family:'Cinzel','Amiri',serif;font-size:2.6rem;color:var(--gold);float:left;line-height:0.8;margin:6px 8px 0 0;}

  /* welcome/intro & mvv reused */
  .intro{background:var(--surface-warm);}
  .intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start;}
  @media (max-width:860px){.intro-grid{grid-template-columns:1fr;gap:34px;}}
  .intro h2{font-size:2.2rem;margin:14px 0 22px;}
  .intro ul{list-style:none;margin-top:22px;display:flex;flex-direction:column;gap:14px;}
  .intro ul li{display:flex;gap:14px;align-items:flex-start;font-size:0.98rem;color:#33322f;}
  .intro ul li::before{content:"◆";color:var(--gold);font-size:0.6rem;margin-top:7px;flex-shrink:0;}
  /* Homepage "Today's Reflection" — a single rotating dhikr, picked
     client-side from js/adhkar-data.js (morning/evening by local clock),
     linking to the full Adhkar Centre. Reuses the parchment/milk-card
     language already established for the Adhkar Centre itself. */
  .adhkar-teaser{background:var(--surface-warm);}
  .adhkar-teaser-card{background:var(--milk);border:1px solid var(--line);border-top:2px solid var(--gold);padding:36px 34px;text-align:center;min-height:120px;}
  .at-arabic{font-family:'Amiri',serif;font-size:clamp(1.3rem,2.6vw,1.6rem);line-height:2.1;color:var(--ink);margin-bottom:14px;}
  .at-translation{font-size:0.94rem;color:#4a4944;line-height:1.6;margin-bottom:12px;}
  .at-ref{font-family:'Cinzel','Amiri',serif;font-size:0.7rem;letter-spacing:0.06em;color:var(--gold-bright);background:var(--navy-deep);padding:3px 12px;display:inline-block;}
  .quote-panel{background:var(--navy);color:var(--ivory);padding:44px 38px;position:relative;border-left:3px solid var(--gold);}
  .quote-panel .mark{font-family:'Cormorant Garamond','Amiri',serif;font-size:4rem;color:var(--gold);line-height:0.4;display:block;margin-bottom:14px;}
  .quote-panel p{font-family:'Cormorant Garamond','Amiri',serif;font-style:italic;font-size:1.3rem;color:#fff;}
  .quote-panel .who{margin-top:22px;font-family:'Inter','Cairo',sans-serif;font-style:normal;font-size:0.78rem;color:var(--gold-bright);letter-spacing:0.05em;text-transform:uppercase;}

  .mvv{background:var(--surface-alt);}
  .mvv-top{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-bottom:56px;}
  @media (max-width:760px){.mvv-top{grid-template-columns:1fr;}}
  .mvv-card{border:1px solid var(--line);padding:34px 32px;}
  .mvv-card h3{font-size:1.45rem;margin-bottom:12px;}
  .mvv-card p{color:#4a4944;font-size:0.97rem;}
  .clever-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;}
  @media (max-width:960px){.clever-grid{grid-template-columns:repeat(3,1fr);}}
  @media (max-width:560px){.clever-grid{grid-template-columns:repeat(2,1fr);}}
  .clever-item{background:var(--surface);border-top:3px solid var(--gold);padding:22px 16px;text-align:center;}
  .clever-item .letter{font-family:'Cinzel','Amiri',serif;font-size:2rem;color:var(--navy);font-weight:700;}
  .clever-item .word{font-size:0.75rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--crimson);font-weight:600;margin:6px 0 8px;}
  .clever-item .desc{font-size:0.8rem;color:#55534d;}

  /* Chapter band — a full-bleed nested zone for splitting a long,
     single-section "chapter" page (governance, facilities) into two
     distinct dark tones instead of one unbroken block, the same way
     .contact/.foot-arrival vary their tone from the surrounding navy.
     Ivory/gold text stays legible on either tone, so no component
     needs a separate light-background variant to use it. */
  .chapter-band-alt{background:var(--charcoal);border-top:1px solid var(--line);padding:64px 0;margin-top:56px;}
  @media (max-width:760px){.chapter-band-alt{padding:44px 0;margin-top:36px;}}

  /* ============================================================
     Adhkar Centre — the Islamic Spiritual Life layer's flagship
     surface. Parchment ground (Islamic heritage/historical-content
     role, per the prestige palette), calm and reflective rather than
     card-hover-heavy — this is content to be read slowly.
     ============================================================ */
  .adhkar-page{background:var(--surface-warm);}
  .adhkar-intro{max-width:720px;color:var(--ink-soft);margin-top:14px;}
  .adhkar-note{
    margin-top:26px;padding:16px 20px;background:rgba(198,161,91,0.08);border:1px solid rgba(198,161,91,0.35);
    font-size:0.84rem;color:var(--ink-soft);line-height:1.6;max-width:720px;
  }
  .adhkar-note strong{color:var(--ink);}

  /* --- No-JS-safe static fallback: the words themselves must survive
     JavaScript being blocked, failing, or not having loaded yet. Hidden
     by js/adhkar-app.js only once the full interactive app has actually
     mounted — see that file's end-of-init() call. --- */
  .adk-static-fallback{margin-top:30px;}
  .adk-static-jump{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:28px;}
  .adk-static-jump-btn{
    flex:1;min-width:200px;text-align:center;padding:14px 18px;background:var(--navy);color:var(--gold-bright);
    border:1px solid var(--navy);font-family:'Cinzel','Amiri',serif;font-size:0.8rem;letter-spacing:0.06em;
    text-transform:uppercase;text-decoration:none;transition:background .2s ease;
  }
  .adk-static-jump-btn:hover{background:var(--navy-deep);}
  .adk-static-section{margin-bottom:36px;scroll-margin-top:100px;}
  .adk-static-section h3{font-family:'Cinzel','Amiri',serif;font-size:1.05rem;color:var(--navy);margin-bottom:16px;}
  .adk-static-list{display:flex;flex-direction:column;gap:16px;}
  .adk-static-item{background:var(--milk);border:1px solid var(--line);border-top:2px solid var(--gold);padding:20px 22px;}
  .adk-static-item h4{font-family:'Cinzel','Amiri',serif;font-size:0.92rem;color:var(--navy);margin:0 0 10px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
  .adk-static-repeat{font-family:'Inter','Cairo',sans-serif;font-size:0.68rem;letter-spacing:0.03em;text-transform:uppercase;color:var(--gold-bright);background:var(--navy);padding:2px 9px;}
  .adk-static-arabic{font-family:'Amiri',serif;font-size:1.2rem;line-height:1.95;color:var(--ink);margin:0 0 10px;text-align:right;}
  .adk-static-translit{font-size:0.82rem;font-style:italic;color:var(--ink-soft);margin:0 0 8px;}
  .adk-static-translation{font-size:0.9rem;color:var(--ink);line-height:1.6;margin:0 0 8px;}
  .adk-static-ref{font-size:0.76rem;color:var(--ink-soft);margin:0;}
  [dir="rtl"] .adk-static-item h4{flex-direction:row-reverse;}

  /* --- Priority panel: Daily Essentials / Most Rewarding / Protection --- */
  .adk-priority-panel{margin-top:36px;}
  .adk-priority-head{font-family:'Cinzel','Amiri',serif;font-size:0.7rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--gold-bright);background:var(--navy-deep);display:inline-block;padding:4px 12px;margin-bottom:16px;}
  .adk-priority-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
  @media (max-width:900px){.adk-priority-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:520px){.adk-priority-grid{grid-template-columns:1fr;}}
  .adk-priority-card{
    background:var(--navy);color:var(--ivory);padding:20px 18px;border-top:2px solid var(--gold);cursor:pointer;
    transition:transform .25s ease,box-shadow .25s ease;text-align:left;
  }
  [dir="rtl"] .adk-priority-card{text-align:right;}
  .adk-priority-card:hover{transform:translateY(-3px);box-shadow:0 20px 40px -22px rgba(34,23,9,0.5);}
  .adk-priority-card svg{width:24px;height:24px;color:var(--gold-bright);margin-bottom:10px;}
  .adk-priority-card h4{font-family:'Cormorant Garamond','Amiri',serif;font-size:1.05rem;margin:0 0 4px;color:#fff;}
  .adk-priority-card p{font-size:0.76rem;color:rgba(248,244,233,0.65);margin:0;}
  .adk-priority-card .apc-arabic{
    font-family:'Amiri','Cairo',serif;font-size:0.92rem;line-height:1.55;color:var(--ivory);margin:12px 0 6px;
    display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;
  }
  .adk-priority-card .apc-translation{
    font-size:0.72rem;line-height:1.5;color:rgba(248,244,233,0.75);margin:0;font-style:italic;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  }
  .adk-priority-card .apc-count{font-family:'Cinzel','Amiri',serif;font-size:0.66rem;color:var(--gold-bright);margin-top:10px;display:block;}

  /* --- Quick modes: 2 / 5 / 10-minute Essentials + Complete --- */
  .adk-quick-modes{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px;}
  .adk-quick-btn{
    flex:1;min-width:140px;text-align:center;padding:14px 12px;border:1px solid var(--gold);color:var(--navy);
    background:var(--milk);cursor:pointer;font-family:'Inter','Cairo',sans-serif;transition:background .2s ease,color .2s ease;
  }
  .adk-quick-btn:hover{background:rgba(198,161,91,0.14);}
  .adk-quick-btn.is-active{background:var(--gold);color:var(--navy-deep);}
  .adk-quick-btn .aqb-time{display:block;font-family:'Cinzel','Amiri',serif;font-size:1.1rem;margin-bottom:2px;}
  .adk-quick-btn .aqb-label{display:block;font-size:0.68rem;letter-spacing:0.04em;text-transform:uppercase;}

  /* --- Category nav --- */
  .adk-cat-nav{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-top:22px;}
  @media (max-width:900px){.adk-cat-nav{grid-template-columns:repeat(4,1fr);}}
  @media (max-width:600px){.adk-cat-nav{grid-template-columns:repeat(3,1fr);}}
  .adk-cat-btn{
    display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:14px 8px;
    border:1px solid var(--line);background:var(--milk);cursor:pointer;transition:border-color .2s ease,background .2s ease;
  }
  .adk-cat-btn svg{width:20px;height:20px;color:var(--gold-bright);background:var(--navy);padding:5px;box-sizing:content-box;}
  .adk-cat-btn span{font-size:0.66rem;font-weight:600;color:var(--ink);line-height:1.25;}
  .adk-cat-btn:hover, .adk-cat-btn.is-active{border-color:var(--gold);background:rgba(198,161,91,0.12);}

  /* --- Search --- */
  .adk-search{margin-top:22px;position:relative;max-width:420px;}
  .adk-search input{
    width:100%;padding:12px 16px 12px 40px;border:1px solid var(--line);background:var(--milk);color:var(--ink);
    font-family:'Inter','Cairo',sans-serif;font-size:0.88rem;
  }
  [dir="rtl"] .adk-search input{padding:12px 40px 12px 16px;}
  .adk-search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--ink-soft);pointer-events:none;}
  [dir="rtl"] .adk-search svg{left:auto;right:14px;}

  /* --- Session dashboard --- */
  .adk-session-dash{
    margin-top:30px;background:var(--navy);color:var(--ivory);padding:26px 28px;display:flex;align-items:center;gap:26px;
    flex-wrap:wrap;border-top:2px solid var(--gold);
  }
  .adk-session-dash[hidden]{display:none;}
  .adk-sd-ring{position:relative;width:84px;height:84px;flex-shrink:0;}
  .adk-sd-ring svg{width:100%;height:100%;transform:rotate(-90deg);}
  .adk-sd-ring circle{fill:none;stroke-width:6;}
  .adk-sd-ring .sd-track{stroke:rgba(233,206,138,0.2);}
  .adk-sd-ring .sd-fill{stroke:var(--gold-bright);stroke-linecap:round;transition:stroke-dashoffset .4s ease;}
  .adk-sd-ring .sd-pct{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:'Cinzel','Amiri',serif;font-size:0.9rem;color:#fff;}
  .adk-sd-stats{display:flex;gap:26px;flex-wrap:wrap;flex:1;}
  .adk-sd-stat .label{font-size:0.66rem;letter-spacing:0.05em;text-transform:uppercase;color:rgba(248,244,233,0.6);}
  .adk-sd-stat .value{font-family:'Cinzel','Amiri',serif;font-size:1.15rem;color:var(--gold-bright);margin-top:3px;}
  .adk-sd-close{background:none;border:1px solid rgba(233,206,138,0.4);color:var(--gold-bright);padding:8px 14px;cursor:pointer;font-size:0.72rem;text-transform:uppercase;letter-spacing:0.04em;}

  /* --- Content: category section heading + item list (reused card language) --- */
  .adk-section-head{display:flex;align-items:center;gap:12px;margin:36px 0 18px;padding-bottom:12px;border-bottom:2px solid var(--gold);flex-wrap:wrap;}
  .adk-section-head svg{width:24px;height:24px;color:var(--gold);flex-shrink:0;}
  .adk-section-head h2{font-size:1.35rem;margin:0;flex:1;}
  .adk-section-time{font-family:'Cinzel','Amiri',serif;font-size:0.7rem;color:var(--navy);border:1px solid var(--gold);padding:3px 10px;white-space:nowrap;}
  .adk-list{display:flex;flex-direction:column;gap:18px;}
  .adk-item{background:var(--milk);border:1px solid var(--line);border-top:2px solid var(--gold);padding:22px 24px;cursor:pointer;transition:box-shadow .2s ease,transform .2s ease;}
  .adk-item:hover{box-shadow:0 16px 32px -22px rgba(34,23,9,0.4);transform:translateY(-2px);}
  .adk-item-head{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
  .adk-num{
    font-family:'Cinzel','Amiri',serif;font-size:0.72rem;color:var(--gold-bright);background:var(--navy);
    width:28px;height:28px;flex-shrink:0;display:flex;align-items:center;justify-content:center;
  }
  .adk-item-head h3{font-size:1rem;margin:0;flex:1;color:var(--navy);}
  .adk-repeat{font-family:'Cinzel','Amiri',serif;font-size:0.68rem;letter-spacing:0.04em;color:var(--navy);border:1px solid var(--gold);padding:2px 9px;flex-shrink:0;}
  .adk-fav-btn{background:none;border:none;cursor:pointer;color:var(--line);flex-shrink:0;padding:2px;}
  .adk-fav-btn svg{width:18px;height:18px;}
  .adk-fav-btn.is-fav{color:var(--gold);}
  .adk-item.is-done{border-top-color:var(--forest-green);}
  .adk-item.is-done .adk-num{background:var(--forest-green);}
  .adk-arabic-preview{font-family:'Amiri',serif;font-size:1.15rem;line-height:1.9;color:var(--ink);margin-bottom:8px;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-align:right;}
  .adk-translation-preview{font-size:0.86rem;color:var(--ink-soft);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
  .adk-item-empty{padding:30px;text-align:center;color:var(--ink-soft);font-size:0.9rem;}
  [dir="rtl"] .adk-item-head h3{text-align:right;}

  /* ============================================================
     Smart Tasbih Counter — full-screen modal, theme-able.
     ============================================================ */
  .adk-counter-modal{
    position:fixed;inset:0;z-index:400;background:rgba(20,14,8,0.72);display:flex;align-items:center;justify-content:center;padding:20px;
  }
  .adk-counter-modal[hidden]{display:none;}
  .adk-counter-card{
    width:100%;max-width:480px;max-height:92vh;overflow-y:auto;background:var(--ctr-bg,var(--ivory));color:var(--ctr-ink,var(--ink));
    border:1px solid var(--ctr-border,var(--gold));position:relative;padding:0;
    box-shadow:0 40px 90px -30px rgba(0,0,0,0.6);
  }
  .adk-ctr-topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--ctr-border,var(--line));}
  .adk-ctr-topbar .ctr-cat{font-family:'Cinzel','Amiri',serif;font-size:0.66rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--ctr-accent,var(--gold-bright));}
  .adk-ctr-topbar .ctr-pos{font-size:0.72rem;color:var(--ctr-ink-soft,var(--ink-soft));margin-top:2px;}
  .adk-ctr-icon-btn{background:none;border:1px solid var(--ctr-border,var(--line));color:var(--ctr-ink,var(--ink));width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;}
  .adk-ctr-icon-btn svg{width:15px;height:15px;}
  .adk-ctr-icon-btn.is-on{background:var(--ctr-accent,var(--gold));color:var(--ctr-bg,#fff);border-color:var(--ctr-accent,var(--gold));}
  .adk-ctr-btns{display:flex;gap:6px;}
  .adk-ctr-body{padding:26px 24px;}
  .adk-ctr-title{font-family:'Cormorant Garamond','Amiri',serif;font-size:1.2rem;text-align:center;margin-bottom:4px;color:var(--ctr-ink,var(--ink));}
  .adk-ctr-arabic{
    font-family:'Amiri',serif;font-size:clamp(1.4rem,4.5vw,2rem);line-height:2.15;text-align:center;color:var(--ctr-ink,var(--ink));
    margin:18px 0;direction:rtl;
  }
  .adk-ctr-translit{font-size:0.8rem;font-style:italic;text-align:center;color:var(--ctr-ink-soft,var(--ink-soft));margin-bottom:10px;}
  .adk-ctr-translation{font-size:0.86rem;text-align:center;color:var(--ctr-ink-soft,var(--ink-soft));line-height:1.6;margin-bottom:14px;}
  .adk-ctr-meta{text-align:center;font-size:0.72rem;color:var(--ctr-accent,var(--gold-bright));margin-bottom:20px;}

  .adk-ctr-dial-wrap{display:flex;justify-content:center;margin:8px 0 18px;}
  .adk-ctr-dial{position:relative;width:180px;height:180px;cursor:pointer;-webkit-tap-highlight-color:transparent;user-select:none;touch-action:manipulation;}
  .adk-ctr-dial svg{width:100%;height:100%;transform:rotate(-90deg);}
  .adk-ctr-dial circle{fill:none;stroke-width:8;}
  .adk-ctr-dial .ctr-track{stroke:var(--ctr-track,rgba(198,161,91,0.2));}
  .adk-ctr-dial .ctr-fill{stroke:var(--ctr-accent,var(--gold));stroke-linecap:round;transition:stroke-dashoffset .25s ease;}
  .adk-ctr-dial-inner{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;}
  .adk-ctr-dial-inner .ctr-count{font-family:'Cinzel','Amiri',serif;font-size:2.3rem;color:var(--ctr-ink,var(--ink));line-height:1;}
  .adk-ctr-dial-inner .ctr-target{font-size:0.78rem;color:var(--ctr-ink-soft,var(--ink-soft));margin-top:4px;}
  .adk-ctr-dial.is-complete .ctr-fill{stroke:var(--forest-green);}
  .adk-ctr-dial.is-complete .ctr-count{color:var(--forest-green);}
  .adk-ctr-tap-hint{text-align:center;font-size:0.68rem;letter-spacing:0.04em;text-transform:uppercase;color:var(--ctr-ink-soft,var(--ink-soft));margin-bottom:18px;}
  .adk-ctr-complete-badge{
    text-align:center;font-family:'Cinzel','Amiri',serif;font-size:0.78rem;color:#fff;background:var(--forest-green);
    padding:10px;margin-bottom:16px;display:none;
  }
  .adk-ctr-dial.is-complete ~ .adk-ctr-complete-badge, .adk-ctr-body.is-complete .adk-ctr-complete-badge{display:block;}

  .adk-ctr-controls{display:flex;justify-content:center;gap:10px;margin-bottom:16px;flex-wrap:wrap;}
  .adk-ctr-nav{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 24px;border-top:1px solid var(--ctr-border,var(--line));}
  .adk-ctr-nav-btn{background:none;border:1px solid var(--ctr-border,var(--line));color:var(--ctr-ink,var(--ink));padding:9px 16px;cursor:pointer;font-size:0.76rem;display:flex;align-items:center;gap:6px;}
  .adk-ctr-nav-btn:hover{border-color:var(--ctr-accent,var(--gold));}
  .adk-ctr-nav-btn:disabled{opacity:0.35;cursor:default;}
  .adk-ctr-nav-btn svg{width:13px;height:13px;}
  .adk-ctr-reset{background:none;border:none;color:var(--ctr-ink-soft,var(--ink-soft));font-size:0.7rem;text-decoration:underline;cursor:pointer;}

  /* TTS panel within the counter */
  .adk-ctr-tts{border-top:1px solid var(--ctr-border,var(--line));padding:14px 24px;}
  .adk-ctr-tts-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
  .adk-ctr-tts select{font-size:0.76rem;padding:6px 8px;border:1px solid var(--ctr-border,var(--line));background:transparent;color:var(--ctr-ink,var(--ink));}
  .adk-ctr-tts-note{font-size:0.68rem;color:var(--ctr-ink-soft,var(--ink-soft));margin-top:6px;}

  /* Theme swatches (settings) */
  .adk-theme-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:16px 24px;border-top:1px solid var(--ctr-border,var(--line));}
  .adk-theme-swatch{
    display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;padding:8px;border:1px solid transparent;
  }
  .adk-theme-swatch.is-active{border-color:var(--ctr-accent,var(--gold));}
  .adk-theme-swatch .swatch-dot{width:28px;height:28px;border-radius:50%;border:1px solid rgba(0,0,0,0.15);}
  .adk-theme-swatch span{font-size:0.62rem;text-align:center;color:var(--ctr-ink,var(--ink));}

  /* --- Theme definitions --- */
  .adk-counter-card[data-theme="royal"]{--ctr-bg:#F7EEDF;--ctr-ink:#2A2016;--ctr-ink-soft:rgba(42,32,22,0.62);--ctr-accent:#C6A15B;--ctr-border:#C6A15B;--ctr-track:rgba(198,161,91,0.22);}
  .adk-counter-card[data-theme="madinah"]{--ctr-bg:#FBFAF7;--ctr-ink:#2E2E2C;--ctr-ink-soft:rgba(46,46,44,0.6);--ctr-accent:#3F6B4E;--ctr-border:#c9c4b8;--ctr-track:rgba(63,107,78,0.16);}
  .adk-counter-card[data-theme="makkah"]{--ctr-bg:#1B1815;--ctr-ink:#F1E7D2;--ctr-ink-soft:rgba(241,231,210,0.62);--ctr-accent:#D4AF37;--ctr-border:#3a332a;--ctr-track:rgba(212,175,55,0.2);}
  .adk-counter-card[data-theme="emerald"]{--ctr-bg:#0F2A22;--ctr-ink:#EAF3EE;--ctr-ink-soft:rgba(234,243,238,0.62);--ctr-accent:#6FC29A;--ctr-border:#1d4536;--ctr-track:rgba(111,194,154,0.2);}
  .adk-counter-card[data-theme="desert"]{--ctr-bg:#EAE0C0;--ctr-ink:#3A2E17;--ctr-ink-soft:rgba(58,46,23,0.62);--ctr-accent:#8B6A2E;--ctr-border:#c9b98a;--ctr-track:rgba(139,106,46,0.2);}
  .adk-counter-card[data-theme="executive"]{--ctr-bg:#2A2621;--ctr-ink:#F1E7D2;--ctr-ink-soft:rgba(241,231,210,0.6);--ctr-accent:#B9BEC7;--ctr-border:#43403a;--ctr-track:rgba(185,190,199,0.2);}

  /* --- Achievements & streak (portal reuse) --- */
  .adk-achv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:14px;}
  .adk-achv-badge{border:1px solid var(--line);padding:12px 10px;text-align:center;opacity:0.4;}
  .adk-achv-badge.is-earned{opacity:1;border-color:var(--gold);background:rgba(198,161,91,0.08);}
  .adk-achv-badge svg{width:20px;height:20px;color:var(--gold);margin-bottom:6px;}
  .adk-achv-badge span{display:block;font-size:0.66rem;font-weight:600;color:var(--ink);}

  @media (max-width:600px){
    .adk-priority-grid{gap:10px;}
    .adk-item{padding:18px 16px;}
    .adk-ctr-dial{width:150px;height:150px;}
    .adk-ctr-dial-inner .ctr-count{font-size:1.9rem;}
    .adk-ctr-body{padding:20px 18px;}
    .adk-ctr-arabic{line-height:1.95;}
    .adk-session-dash{padding:20px;gap:16px;}
  }

  /* governance */
  .governance{background:var(--navy);color:var(--ivory);}
  .governance .eyebrow{color:var(--gold-bright);} .governance h2{color:#fff;}
  .gov-sub{font-family:'Cinzel','Amiri',serif;font-size:0.85rem;letter-spacing:0.1em;color:var(--gold-bright);text-transform:uppercase;margin:44px 0 20px;}
  .gov-sub:first-of-type{margin-top:40px;}
  .team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);}
  @media (max-width:900px){.team-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:520px){.team-grid{grid-template-columns:1fr;}}
  .team-card{background:var(--navy-deep);padding:24px 20px;}
  .team-card h4{color:#fff;font-size:1.05rem;margin-bottom:4px;}
  .team-card .cred{font-size:0.74rem;color:rgba(248,244,233,0.6);margin-bottom:8px;}
  .team-card .role{font-size:0.72rem;text-transform:uppercase;letter-spacing:0.07em;color:var(--gold-bright);font-weight:600;}
  .staff-list{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);}
  @media (max-width:820px){.staff-list{grid-template-columns:1fr 1fr;}}
  @media (max-width:520px){.staff-list{grid-template-columns:1fr;}}
  .staff-item{background:var(--navy-deep);padding:18px 20px;font-size:0.86rem;}
  .staff-item strong{display:block;color:#fff;font-size:0.92rem;}
  .staff-item span{color:rgba(248,244,233,0.62);font-size:0.76rem;}

  /* academics */
  .academics{background:var(--surface-tertiary);}
  .school-block{border:1px solid var(--line);background:#fff;padding:34px 32px;margin-top:26px;}
  .school-block .tag{font-family:'Cinzel','Amiri',serif;font-size:0.68rem;letter-spacing:0.14em;color:var(--gold);text-transform:uppercase;}
  .school-block h3{font-size:1.7rem;margin:8px 0 14px;}
  .school-block p{font-size:0.95rem;color:#4a4944;margin-bottom:10px;}
  .dept-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:20px;}
  @media (max-width:700px){.dept-grid{grid-template-columns:1fr;}}
  .dept-item{background:var(--surface);padding:16px 18px;border-left:2px solid var(--gold);}
  .dept-item strong{display:block;font-size:0.86rem;color:var(--navy);margin-bottom:4px;}
  .dept-item span{font-size:0.82rem;color:#54534e;}
  .schedule-row{display:flex;gap:24px;margin-top:16px;flex-wrap:wrap;}
  .schedule-row div{background:var(--surface);padding:14px 18px;border-left:2px solid var(--gold);font-size:0.86rem;flex:1;min-width:200px;}
  .schedule-row strong{display:block;color:var(--navy);font-size:0.78rem;text-transform:uppercase;letter-spacing:0.05em;margin-bottom:4px;}

  .curriculum{margin-top:40px;background:var(--emerald);color:var(--ivory);padding:44px;display:grid;grid-template-columns:1fr 1fr;gap:40px;}
  @media (max-width:800px){.curriculum{grid-template-columns:1fr;}}
  .curriculum h4{color:var(--gold-bright);font-size:1.2rem;margin-bottom:10px;}
  .curriculum p{font-size:0.9rem;color:rgba(248,244,233,0.85);}

  /* boarding */
  .boarding{background:var(--surface-alt);}
  .boarding-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;}
  @media (max-width:840px){.boarding-grid{grid-template-columns:1fr;}}
  .boarding-panel{background:var(--navy);color:var(--ivory);padding:38px 32px;}
  .boarding-panel .stat{display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line);font-size:0.88rem;}
  .boarding-panel .stat strong{color:var(--gold-bright);font-weight:600;}

  /* admission (reused) */
  .admission{background:var(--surface);}
  .steps{counter-reset:step;margin-top:44px;display:grid;grid-template-columns:1fr 1fr;gap:0 50px;}
  @media (max-width:800px){.steps{grid-template-columns:1fr;}}
  .step{counter-increment:step;display:flex;gap:18px;padding:16px 0;border-bottom:1px solid var(--line);}
  .step::before{content:counter(step,decimal-leading-zero);font-family:'Cinzel','Amiri',serif;font-size:1.3rem;color:var(--gold);font-weight:700;flex-shrink:0;width:44px;}
  .step .txt strong{color:var(--navy);display:block;font-size:0.96rem;margin-bottom:2px;}
  .step .txt span{font-size:0.85rem;color:#55534d;}
  .docs-box{margin-top:32px;background:#fff;border-top:1px solid var(--gold);border-bottom:1px solid var(--gold);padding:24px 28px;position:relative;}
  .docs-box::before{content:"";position:absolute;top:4px;bottom:4px;left:4px;right:4px;border:1px solid rgba(198,161,91,0.22);pointer-events:none;}
  .docs-box h4{font-size:1.05rem;margin-bottom:10px;}
  .docs-box ul{list-style:none;display:flex;flex-wrap:wrap;gap:10px 28px;}
  .docs-box li{font-size:0.88rem;color:#3a3934;} .docs-box li::before{content:"— ";}

  /* facilities */
  .facilities{background:var(--navy);color:var(--ivory);}
  .facilities .eyebrow{color:var(--gold-bright);} .facilities h2{color:#fff;}
  .fac-grid{margin-top:40px;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);}
  @media (max-width:900px){.fac-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:520px){.fac-grid{grid-template-columns:1fr;}}
  .fac-item{background:var(--navy-deep);padding:26px 20px;font-family:'Cormorant Garamond','Amiri',serif;font-size:1.02rem;display:flex;align-items:center;min-height:80px;}
  .fac-item span{color:var(--gold);margin-right:10px;}

  /* achievement spotlight — light-theme photo card (academics, etc.) */
  .achievement-spotlight{display:flex;align-items:center;gap:36px;margin-top:40px;border:1px solid var(--line);background:#fff;box-shadow:0 18px 40px -28px rgba(34,23,9,0.28), 0 1px 0 rgba(198,161,91,0.35) inset;}
  @media (max-width:760px){.achievement-spotlight{flex-direction:column;align-items:stretch;}}
  .achievement-spotlight .as-photo{flex:0 0 42%;aspect-ratio:4/3;overflow:hidden;}
  @media (max-width:760px){.achievement-spotlight .as-photo{flex:none;aspect-ratio:16/10;}}
  .achievement-spotlight .as-photo img{width:100%;height:100%;object-fit:cover;display:block;}
  .achievement-spotlight .as-body{padding:28px 32px 28px 0;}
  @media (max-width:760px){.achievement-spotlight .as-body{padding:22px 24px 26px;}}
  .achievement-spotlight .as-label{font-family:'Cinzel','Amiri',serif;font-size:0.64rem;letter-spacing:0.16em;color:var(--crimson);text-transform:uppercase;display:block;margin-bottom:10px;}
  .achievement-spotlight .as-title{font-family:'Cormorant Garamond','Amiri',serif;font-size:1.4rem;color:var(--navy);display:block;line-height:1.3;}
  .achievement-spotlight .as-body p{color:#54534e;font-size:0.92rem;margin-top:10px;}
  [dir="rtl"] .achievement-spotlight .as-body{padding:28px 0 28px 32px;}
  @media (max-width:760px){[dir="rtl"] .achievement-spotlight .as-body{padding:22px 24px 26px;}}

  /* light-theme photo pair — two related photos with a shared caption */
  .light-photo-pair{margin-top:40px;}
  .light-photo-pair .lpp-label{font-family:'Cinzel','Amiri',serif;font-size:0.64rem;letter-spacing:0.16em;color:var(--crimson);text-transform:uppercase;display:block;margin-bottom:14px;}
  .light-photo-pair .lpp-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
  @media (max-width:640px){.light-photo-pair .lpp-grid{grid-template-columns:1fr;}}
  .light-photo-pair .lpp-frame{aspect-ratio:16/10;overflow:hidden;border:1px solid var(--line);box-shadow:0 18px 40px -28px rgba(34,23,9,0.28);}
  .light-photo-pair .lpp-frame img{width:100%;height:100%;object-fit:cover;display:block;}
  .light-photo-pair p{color:#54534e;font-size:0.9rem;margin-top:14px;}

  /* campus gallery — real photography, added to the facilities chapter */
  .campus-gallery{margin-top:56px;padding-top:36px;border-top:1px solid var(--line);}
  .campus-gallery .folio{margin-bottom:22px;}
  .gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
  @media (max-width:900px){.gallery-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:560px){.gallery-grid{grid-template-columns:1fr;}}
  .gallery-item{border:1px solid var(--line);background:var(--navy-deep);overflow:hidden;transition:border-color .3s ease;}
  .gallery-item:hover{border-color:var(--gold);}
  .gallery-item .gi-frame{position:relative;width:100%;aspect-ratio:4/3;overflow:hidden;}
  .gallery-item .gi-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease;}
  .gallery-item:hover .gi-frame img{transform:scale(1.04);}
  .gallery-item .gi-cap{padding:16px 18px 18px;}
  .gallery-item .gi-cap .gi-title{font-family:'Cormorant Garamond','Amiri',serif;font-size:1.05rem;color:var(--ivory);display:block;}
  .gallery-item .gi-cap .gi-sub{font-family:'Cinzel','Amiri',serif;font-size:0.62rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--gold);display:block;margin-top:6px;}
  .gallery-item.gi-lead{grid-column:span 3;}
  .gallery-item.gi-lead .gi-frame{aspect-ratio:21/9;}
  @media (max-width:900px){.gallery-item.gi-lead{grid-column:span 2;}}
  @media (max-width:560px){.gallery-item.gi-lead{grid-column:span 1;} .gallery-item.gi-lead .gi-frame{aspect-ratio:4/3;}}

  /* foundation */
  .foundation{background:var(--surface-alt);}
  .found-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:36px;}
  @media (max-width:800px){.found-grid{grid-template-columns:1fr;}}
  .found-card{border:1px solid var(--line);padding:26px 24px;}
  .found-card h4{font-size:1.15rem;margin-bottom:8px;}
  .found-card p{font-size:0.88rem;color:#54534e;}

  /* policies (reused compact) */
  .policies{background:var(--surface);}
  .policy-category{margin-top:44px;}
  .policy-category:first-of-type{margin-top:40px;}
  .policy-category-title{
    font-family:'Cinzel','Amiri',serif;font-size:0.68rem;letter-spacing:0.16em;text-transform:uppercase;
    color:var(--crimson);font-weight:600;margin-bottom:14px;
  }
  .policy-list{margin-top:0;display:flex;flex-direction:column;gap:1px;background:var(--line);}
  .policy{background:#fff;transition:box-shadow .3s ease;}
  .policy.open{box-shadow:0 20px 40px -28px rgba(34,23,9,0.3);}
  .policy-head{width:100%;text-align:left;background:none;border:none;cursor:pointer;display:flex;justify-content:flex-start;align-items:baseline;gap:20px;padding:24px 26px;font-family:'Cormorant Garamond','Amiri',serif;font-size:1.2rem;color:var(--navy);position:relative;transition:padding-left .3s ease;}
  .policy.open .policy-head{padding-left:34px;}
  .policy-head .stat-num{font-family:'Cinzel','Amiri',serif;font-size:0.82rem;color:var(--gold);letter-spacing:0.05em;flex-shrink:0;width:52px;}
  .policy-head .title-text{flex:1;}
  .policy-head .plus{font-family:'Cormorant Garamond','Amiri',serif;color:var(--gold);font-size:1.1rem;transition:transform .3s ease,opacity .3s ease;font-style:italic;margin-left:auto;flex-shrink:0;}
  .policy.open .plus{transform:rotate(180deg);opacity:0.6;}
  .policy.open .policy-head{border-bottom:1px solid var(--gold);}
  .policy-body{max-height:0;overflow:hidden;transition:max-height .35s ease;padding:0 26px;}
  .policy.open .policy-body{padding-bottom:26px;}
  .policy-body .section-block{margin-bottom:16px;}
  .policy-body h5{font-family:'Inter','Cairo',sans-serif;font-size:0.72rem;text-transform:uppercase;letter-spacing:0.1em;color:var(--crimson);font-weight:700;margin-bottom:7px;}
  .policy-body p,.policy-body li{font-size:0.9rem;color:#3d3c37;}
  .policy-body ul{padding-left:20px;margin-top:6px;display:flex;flex-direction:column;gap:5px;}
  .grade-table{width:100%;border-collapse:collapse;margin-top:8px;font-size:0.86rem;}
  .grade-table th,.grade-table td{border:1px solid var(--line);padding:6px 10px;text-align:left;}
  .grade-table th{background:var(--surface);color:var(--navy);}
  .sign-row{margin-top:18px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;border-top:1px solid var(--line);padding-top:14px;}
  @media (max-width:700px){.sign-row{grid-template-columns:1fr 1fr;}}
  .sign-row div{font-size:0.76rem;}
  .sign-row .lab{text-transform:uppercase;letter-spacing:0.06em;color:var(--gold);font-weight:700;display:block;margin-bottom:3px;font-size:0.66rem;}

  /* Related Documents + Revision History — real cross-references and
     version notes drawn only from each policy's own published text,
     not a generic "see also" list. */
  .related-docs p{display:flex;flex-wrap:wrap;gap:6px 14px;}
  .related-docs a{
    font-size:0.8rem;color:var(--crimson);text-decoration:none;border-bottom:1px dotted var(--crimson);
    transition:opacity .2s ease;
  }
  .related-docs a:hover{opacity:0.7;}
  .revision-history{font-size:0.78rem;color:#8a8880;font-style:italic;margin-top:10px;line-height:1.5;}
  /* Briefly highlight a policy jumped to from another policy's Related
     Documents link or an external #policy-XX URL, so it's clear which
     one the reader landed on. */
  .policy.is-highlighted .policy-head{background:rgba(198,161,91,0.12);}
  @keyframes policyHighlightFade{from{background:rgba(198,161,91,0.22);}to{background:rgba(198,161,91,0.12);}}
  .policy.is-highlighted .policy-head{animation:policyHighlightFade 1.6s ease;}

  /* contact / footer reused */
  .contact{background:var(--charcoal);color:var(--ivory);}
  .contact .eyebrow{color:var(--gold-bright);} .contact h2{color:#fff;}
  .contact-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:54px;margin-top:44px;}
  @media (max-width:860px){.contact-grid{grid-template-columns:1fr;}}
  /* Premium contact cards — real icons, hover lift, not a plain text list */
  .contact-item{display:flex;gap:18px;align-items:flex-start;padding:22px 4px;border-bottom:1px solid var(--line);transition:padding-left .3s ease,background .3s ease;position:relative;}
  .contact-item:last-child{border-bottom:none;}
  .contact-item:hover{padding-left:14px;background:rgba(198,161,91,0.05);}
  .contact-item .ico{color:var(--gold);width:34px;height:34px;flex-shrink:0;display:flex;transition:color .3s ease,transform .3s ease;}
  .contact-item .ico svg{width:100%;height:100%;}
  .contact-item:hover .ico{color:var(--gold-bright);transform:scale(1.08);}
  .contact-item strong{display:block;font-size:0.76rem;text-transform:uppercase;letter-spacing:0.09em;color:var(--gold-bright);margin-bottom:5px;}
  .contact-item span,.contact-item a{font-size:0.95rem;color:var(--ivory);line-height:1.5;}
  .contact-form{background:rgba(248,244,233,0.05);border:1px solid var(--line);padding:30px;}
  .contact-form label{font-size:0.74rem;text-transform:uppercase;letter-spacing:0.06em;color:var(--gold-bright);display:block;margin-bottom:6px;}
  .contact-form input,.contact-form textarea{width:100%;background:rgba(255,255,255,0.03);border:1px solid var(--line);color:#fff;padding:11px 13px;margin-bottom:16px;font-family:'Inter','Cairo',sans-serif;font-size:0.9rem;}
  .contact-form input:focus,.contact-form textarea:focus{outline:2px solid var(--gold);border-color:var(--gold);}
  .contact-form button{width:100%;border:none;cursor:pointer;}
  footer{background:var(--navy-deep);border-top:1px solid var(--line);padding:0 0 24px;color:rgba(248,244,233,0.65);font-size:0.84rem;}

  /* Prestige arrival zone — a deliberate transition between the page's
     content and the footer's information architecture, on a distinct
     charcoal ground with corner ornaments so it reads as its own
     institutional moment rather than an abrupt drop into the footer. */
  .foot-arrival{position:relative;background:var(--charcoal);border-bottom:1px solid var(--line);padding:88px 24px 78px;overflow:hidden;text-align:center;}
  .foot-arrival::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,rgba(198,161,91,0.12),transparent 55%);pointer-events:none;}
  .foot-arrival .corner{position:absolute;width:36px;height:36px;opacity:0.5;}
  .foot-arrival .corner svg{width:100%;height:100%;}
  .foot-arrival .corner.tl{top:22px;left:22px;} .foot-arrival .corner.tr{top:22px;right:22px;transform:scaleX(-1);}
  .foot-arrival .corner.bl{bottom:22px;left:22px;transform:scaleY(-1);} .foot-arrival .corner.br{bottom:22px;right:22px;transform:scale(-1,-1);}
  .foot-statement{position:relative;z-index:1;max-width:680px;margin:0 auto;}
  .foot-statement::before{content:"";position:absolute;left:50%;top:-24px;transform:translateX(-50%);width:60px;height:1px;background:var(--gold);}
  .foot-statement p{font-family:'Cormorant Garamond','Amiri',serif;font-size:clamp(1.3rem,2.6vw,1.7rem);font-style:italic;color:var(--gold-bright);line-height:1.5;margin:0;}
  .foot-statement .fs-mark{margin-top:26px;display:flex;align-items:center;justify-content:center;gap:14px;opacity:0.85;}
  .foot-statement .fs-mark::before,.foot-statement .fs-mark::after{content:"";width:34px;height:1px;background:rgba(198,161,91,0.4);}
  .foot-statement .fs-mark svg{width:15px;height:15px;color:var(--gold);flex-shrink:0;}
  @media (max-width:760px){
    .foot-arrival{padding:52px 22px 46px;}
    .foot-statement p{font-size:1.12rem;}
    .foot-arrival .corner{width:26px;height:26px;}
  }
  .foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:32px;margin:38px 0 30px;}
  @media (max-width:980px){.foot-grid{grid-template-columns:1fr 1fr 1fr;gap:26px;}}
  .foot-grid h5{color:var(--gold-bright);font-family:'Cinzel','Amiri',serif;font-size:0.72rem;text-transform:uppercase;letter-spacing:0.1em;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
  .foot-grid h5 svg{flex-shrink:0;opacity:0.85;}
  .foot-grid ul{list-style:none;display:flex;flex-direction:column;gap:8px;}
  .foot-grid a:hover{color:var(--gold-bright);}
  .foot-contact-item{margin-bottom:8px;line-height:1.5;}

  /* At-a-glance institutional dashboard — every major facet of the
     school as a compact icon badge, all visible in one grid with no
     scroll or tap required, sitting above the more detailed zone
     ribbon below it. This is the honest version of "the whole
     footer visible at once": a real overview immediately, with the
     full link lists one swipe away rather than requiring either
     illegibly tiny text or hiding content behind an accordion. */
  .foot-dash-eyebrow{font-family:'Cinzel','Amiri',serif;font-size:0.66rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold-bright);text-align:center;margin-top:34px;margin-bottom:16px;}
  .foot-dashboard{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;}
  .fd-item{
    display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center;
    padding:14px 6px;border:1px solid rgba(198,161,91,0.2);background:rgba(198,161,91,0.04);
    transition:background .2s ease,border-color .2s ease,transform .2s ease;
  }
  .fd-item:hover{background:rgba(198,161,91,0.12);border-color:var(--gold);transform:translateY(-2px);}
  .fd-item svg{width:24px;height:24px;color:var(--gold-bright);flex-shrink:0;}
  .fd-item span{font-size:0.66rem;font-weight:600;letter-spacing:0.01em;line-height:1.25;color:var(--ivory);}
  @media (max-width:900px){.foot-dashboard{grid-template-columns:repeat(4,1fr);}}
  @media (max-width:520px){
    .foot-dashboard{grid-template-columns:repeat(3,1fr);gap:8px;}
    .fd-item{padding:12px 4px;}
    .fd-item svg{width:22px;height:22px;}
    .fd-item span{font-size:0.62rem;}
  }

  /* Mobile footer — horizontally-scrollable zone cards rather than a
     tall single-column stack. Every zone keeps its full heading, icon,
     and complete link list (nothing removed, nothing behind a tap) —
     only the CONTAINER changes from vertical stacking to a swipeable
     row, the same technique already used for the mobile nav ribbon.
     A 5-zone vertical stack measured ~1000px of pure link-list height
     alone before this; a horizontal row reduces that to one card's
     height regardless of zone count. */
  @media (max-width:760px){
    .foot-grid{
      display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x proximity;
      margin:28px 0 22px;padding-bottom:4px;-webkit-overflow-scrolling:touch;scrollbar-width:none;
    }
    .foot-grid::-webkit-scrollbar{display:none;}
    .foot-grid > div{
      scroll-snap-align:start;flex:0 0 auto;width:238px;
      background:rgba(198,161,91,0.05);border:1px solid var(--line);border-top:2px solid var(--gold);
      padding:20px 18px;
    }
    .foot-grid h5{font-size:0.8rem;margin-bottom:14px;gap:10px;}
    .foot-grid h5 svg{width:26px;height:26px;color:var(--gold);opacity:1;}
    .foot-grid ul{gap:11px;}
    .foot-grid a{display:inline-block;padding:2px 0;}
    .foot-contact-item{font-size:0.88rem;}
  }

  .foot-quick-actions{display:flex;flex-wrap:wrap;gap:12px;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:22px;}
  .foot-quick-actions a{
    font-family:'Cinzel','Amiri',serif;font-size:0.68rem;letter-spacing:0.1em;text-transform:uppercase;
    padding:11px 20px;border:1px solid rgba(233,206,138,0.4);color:var(--gold-bright);
  }
  .foot-quick-actions a:hover{border-color:var(--gold-bright);background:rgba(198,161,91,0.08);}
  .foot-quick-actions a.is-primary{background:linear-gradient(135deg,var(--gold) 0%,var(--gold-bright) 100%);color:var(--navy-deep);border-color:var(--gold);box-shadow:0 6px 16px -6px rgba(198,161,91,0.5);}
  .foot-quick-actions a.is-primary:hover{box-shadow:0 10px 22px -6px rgba(233,206,138,0.65);transform:translateY(-1px);}
  @media (max-width:600px){
    .foot-quick-actions{flex-direction:column;}
    .foot-quick-actions a{text-align:center;padding:14px 20px;}
  }

  /* ============================================================
     Footer campus/map destination section — full-bleed band between
     the quick actions and the closing seal, echoing .foot-statement's
     full-width pattern. Real address, real embed, no fabricated hours.
     ============================================================ */
  .foot-map-section{background:var(--navy-deep);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:52px 0;}
  .foot-map-intro{max-width:620px;margin:0 auto 30px;text-align:center;}
  .foot-map-intro .fm-eyebrow{font-family:'Cinzel','Amiri',serif;font-size:0.7rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold-bright);margin-bottom:10px;display:block;}
  .foot-map-intro .fm-lede{font-family:'Cormorant Garamond','Amiri',serif;font-size:1.15rem;font-style:italic;color:rgba(248,244,233,0.75);line-height:1.55;}
  .foot-map-panel{border:1px solid var(--gold);}
  .fm-label{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;background:rgba(198,161,91,0.08);border-bottom:1px solid var(--line);}
  .fm-label .fm-campus-name{font-family:'Cinzel','Amiri',serif;font-size:0.7rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold-bright);}
  .fm-label .fm-campus-tag{font-size:0.68rem;color:rgba(248,244,233,0.5);}
  .fm-frame{position:relative;aspect-ratio:21/8;min-height:260px;}
  .fm-frame iframe{width:100%;height:100%;display:block;border:0;filter:saturate(0.75) contrast(1.05);}
  .fm-overlay{position:absolute;top:16px;left:16px;background:rgba(34,23,9,0.9);border:1px solid var(--gold);padding:12px 18px;pointer-events:none;}
  [dir="rtl"] .fm-overlay{left:auto;right:16px;}
  .fm-overlay-title{display:block;font-family:'Cinzel','Amiri',serif;font-size:0.85rem;color:#fff;}
  .fm-overlay-sub{display:block;font-size:0.7rem;color:var(--gold-bright);letter-spacing:0.05em;margin-top:3px;}
  .fm-actions{display:flex;flex-wrap:wrap;gap:1px;background:var(--line);border-top:1px solid var(--gold);}
  .fm-btn{flex:1;min-width:170px;text-align:center;padding:16px 12px;background:var(--navy-deep);font-family:'Cinzel','Amiri',serif;font-size:0.66rem;letter-spacing:0.06em;text-transform:uppercase;color:var(--gold-bright);transition:background .25s ease;}
  .fm-btn:hover{background:rgba(198,161,91,0.12);}
  .fm-btn.is-primary{background:linear-gradient(135deg,var(--gold) 0%,var(--gold-bright) 100%);color:var(--navy-deep);font-weight:700;}
  .fm-btn.is-primary:hover{background:linear-gradient(135deg,var(--gold-bright) 0%,var(--gold) 100%);}
  @media (max-width:760px){
    /* The map itself stays real, functional, and fully visible — only
       the surrounding whitespace tightens. Cutting padding (not the
       map) is what actually reduces the footer's scroll length. */
    .foot-map-section{padding:30px 0;}
    .foot-map-intro{margin-bottom:20px;}
    .fm-frame{aspect-ratio:16/10;min-height:190px;}
    .fm-btn{min-width:50%;flex:1 1 50%;}
  }

  .foot-seal{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:26px;border-top:1px solid var(--line);flex-wrap:wrap;}
  .foot-seal-brand{display:flex;align-items:center;gap:14px;}
  .foot-seal-brand img{width:34px;height:34px;opacity:0.9;}
  .foot-seal-text{display:flex;flex-direction:column;gap:2px;}
  .foot-seal-text .fs-copy{font-size:0.78rem;color:rgba(248,244,233,0.7);}
  .foot-seal-text .fs-sig{font-family:'Cinzel','Amiri',serif;font-size:0.62rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold-bright);}
  .foot-seal-badge{font-family:'Cinzel','Amiri',serif;font-size:0.62rem;letter-spacing:0.1em;text-transform:uppercase;color:rgba(248,244,233,0.55);border:1px solid var(--line);padding:8px 16px;}
  @media (max-width:600px){
    .foot-seal{flex-direction:column;text-align:center;}
    .foot-seal-brand{flex-direction:column;text-align:center;}
  }
  .foot-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:22px;border-top:1px solid var(--line);flex-wrap:wrap;gap:12px;}

  .seal-section{background:var(--navy-deep);color:var(--ivory);padding:110px 0;position:relative;overflow:hidden;}
  .seal-section::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 40%,rgba(198,161,91,0.12),transparent 60%);}
  .seal-inner{position:relative;z-index:2;text-align:center;}
  .seal-inner .crest-img{width:190px;margin:0 auto 30px;}
  .seal-inner h2{color:#fff;font-family:'Cinzel','Amiri',serif;font-size:1.7rem;margin-bottom:44px;}
  .seal-quads{display:grid;grid-template-columns:repeat(4,1fr);gap:0;max-width:960px;margin:0 auto;border-top:1px solid var(--line);}
  @media (max-width:820px){.seal-quads{grid-template-columns:repeat(2,1fr);}}
  .seal-quad{padding:34px 22px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);}
  .seal-quad:last-child{border-right:none;}
  .seal-quad .glyph{font-family:'Cinzel','Amiri',serif;font-size:0.66rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold-bright);margin-bottom:10px;}
  .seal-quad p{font-family:'Cormorant Garamond','Amiri',serif;font-size:1.02rem;color:rgba(248,244,233,0.82);font-style:italic;}
  ::selection{background:var(--gold);color:var(--navy-deep);}
  :focus-visible{outline:2px solid var(--gold-bright);outline-offset:2px;}
  @media (prefers-reduced-motion:reduce){*{transition:none !important;scroll-behavior:auto !important;animation:none !important;}}

  /* ============================================================
     Phase 2 — icon-led headings, premium card polish, honest
     image slots, stat band, Qur'an College distinct treatment
     ============================================================ */
  .found-card h4,.school-block h3,.mvv-card h3,.director-card h3,.ledger-heading{display:flex;align-items:center;gap:10px;}
  .found-card h4 svg,.school-block h3 svg,.mvv-card h3 svg{flex-shrink:0;color:var(--gold);}
  .director-card h3 svg,.ledger-heading svg{flex-shrink:0;color:var(--gold-bright);}

  /* Corner-tick accents — a lighter echo of .institutional-frame, sized for cards */
  .school-block,.mvv-card,.found-card,.director-card{position:relative;transition:transform .3s ease, box-shadow .3s ease;}
  .school-block::before,.school-block::after,
  .mvv-card::before,.mvv-card::after,
  .found-card::before,.found-card::after{
    content:"";position:absolute;width:14px;height:14px;border:1px solid var(--gold);opacity:0;transition:opacity .3s ease;pointer-events:none;
  }
  .school-block::before,.mvv-card::before,.found-card::before{top:-1px;left:-1px;border-right:none;border-bottom:none;}
  .school-block::after,.mvv-card::after,.found-card::after{bottom:-1px;right:-1px;border-left:none;border-top:none;}
  .school-block:hover::before,.school-block:hover::after,
  .mvv-card:hover::before,.mvv-card:hover::after,
  .found-card:hover::before,.found-card:hover::after{opacity:0.9;}
  .school-block:hover,.mvv-card:hover,.found-card:hover{transform:translateY(-3px);}
  .found-card:hover{box-shadow:0 22px 44px -26px rgba(34,23,9,0.4);}
  .director-card::before,.director-card::after{content:"";position:absolute;width:16px;height:16px;border:1px solid var(--gold-bright);opacity:0.4;pointer-events:none;}
  .director-card::before{top:10px;left:10px;border-right:none;border-bottom:none;}
  .director-card::after{bottom:10px;right:10px;border-left:none;border-top:none;}

  /* Facility index rows — subtle gold rail on hover, matches .dept-item's left-border language */
  .fac-item{position:relative;border-left:2px solid transparent;transition:background .3s ease, border-color .3s ease;}
  .fac-item:hover{background:#2c1e10;border-left-color:var(--gold);}

  /* Honest image slot — used only where no real photograph exists yet.
     Deliberately dashed and muted so it can never be mistaken for a real photo. */
  .image-slot{
    border:1px dashed var(--line);background:linear-gradient(135deg,rgba(198,161,91,0.05),rgba(198,161,91,0.012));
    display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
    padding:44px 26px;aspect-ratio:21/9;position:relative;
  }
  /* A designed frame around the honest placeholder — the same
     gold-corner motif used on real cards elsewhere — so the empty
     state reads as "intentionally awaiting a photograph" rather than
     a bare dashed box, without ever pretending to be an actual image. */
  .image-slot::before,.image-slot::after{
    content:"";position:absolute;width:18px;height:18px;border:1px solid rgba(198,161,91,0.4);pointer-events:none;
  }
  .image-slot::before{top:10px;left:10px;border-right:none;border-bottom:none;}
  .image-slot::after{bottom:10px;right:10px;border-left:none;border-top:none;}
  [dir="rtl"] .image-slot::before{left:auto;right:10px;border-right:1px solid rgba(198,161,91,0.4);border-left:none;}
  [dir="rtl"] .image-slot::after{right:auto;left:10px;border-left:1px solid rgba(198,161,91,0.4);border-right:none;}
  @media (max-width:640px){.image-slot{aspect-ratio:4/3;padding:34px 20px;}}
  .image-slot svg{color:var(--gold);opacity:0.55;margin-bottom:14px;width:36px;height:36px;}
  .image-slot .is-label{font-family:'Cinzel','Amiri',serif;font-size:0.64rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold);opacity:0.85;}
  .image-slot .is-sub{font-size:0.85rem;color:#8a8477;margin-top:8px;font-style:italic;font-family:'Cormorant Garamond','Amiri',serif;max-width:420px;}
  .photo-slot-band{margin-top:40px;}
  .photo-slot-band .lpp-label{font-family:'Cinzel','Amiri',serif;font-size:0.64rem;letter-spacing:0.16em;color:var(--crimson);text-transform:uppercase;display:block;margin-bottom:14px;}

  /* Stat band — real, verifiable counts only; distinct from the full-bleed .seal-quads CTA */
  .stat-band{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:44px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  @media (max-width:760px){.stat-band{grid-template-columns:repeat(2,1fr);}}
  .stat-tile{padding:26px 18px;text-align:center;border-right:1px solid var(--line);}
  .stat-tile:last-child{border-right:none;}
  @media (max-width:760px){.stat-tile{border-bottom:1px solid var(--line);} .stat-tile:nth-child(2n){border-right:none;} .stat-tile:nth-last-child(-n+2){border-bottom:none;}}
  .stat-tile .num{font-family:'Cinzel','Amiri',serif;font-size:2.1rem;color:var(--gold-bright);display:block;line-height:1;}
  .stat-tile .label{font-size:0.72rem;letter-spacing:0.06em;text-transform:uppercase;color:rgba(248,244,233,0.62);display:block;margin-top:10px;}

  /* Qur'an College — distinct manuscript/geometric treatment, scoped to this page only */
  /* Forest Green carried through Qur'an College's distinctive
     elements — scholarship-and-tradition personality, distinct from
     the other three schools, while .btn-gold/.nav-cta/header/footer
     keep the site's gold identity untouched. */
  #quran-college .school-block{border-color:var(--forest-green);}
  #quran-college .school-block::before,#quran-college .school-block::after{border-color:var(--forest-green);opacity:0.75;}
  #quran-college .school-block .tag{color:var(--forest-green);}
  #quran-college .lpp-frame{border-color:var(--forest-green);}
  #quran-college .lpp-label{color:var(--forest-green);}
  #quran-college .folio::after{background:repeating-linear-gradient(90deg,var(--forest-green) 0 4px,transparent 4px 8px);opacity:0.75;}
  #quran-college .light-photo-pair{position:relative;padding-top:28px;}
  #quran-college .light-photo-pair::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:repeating-linear-gradient(90deg,var(--forest-green) 0 6px,transparent 6px 12px);opacity:0.6;}
  #quran-college .page-hero-icon{color:var(--forest-green);}

  /* Nursery & Primary — a warm terracotta accent, distinct from Qur'an
     College's Forest Green and Governance's Oxford Navy, giving the
     school its own scoped page personality (matching the pattern
     already established for the other two schools) without inventing
     any new facts — only presentational, scoped strictly to this page. */
  #nursery-primary .school-block{border-color:var(--terracotta);}
  #nursery-primary .school-block::before,#nursery-primary .school-block::after{border-color:var(--terracotta);opacity:0.75;}
  #nursery-primary .school-block .tag{color:var(--terracotta);}
  #nursery-primary .page-hero-icon{color:var(--terracotta);}
  #nursery-primary .image-slot{border-color:rgba(201,120,75,0.4);}
  #nursery-primary .image-slot svg{color:var(--terracotta);}

  /* Arabic & Islamic Studies — a Crimson accent, in the spirit of
     "rubrication" (the historic use of red ink for headings/emphasis in
     illuminated manuscripts) — a real, fitting design rationale for a
     page centred on classical Arabic/Islamic scholarship, not an
     arbitrary colour pick. Scoped strictly to this page. */
  #arabic-islamic-studies .school-block{border-color:var(--crimson);}
  #arabic-islamic-studies .school-block::before,#arabic-islamic-studies .school-block::after{border-color:var(--crimson);opacity:0.75;}
  #arabic-islamic-studies .school-block .tag{color:var(--crimson);}
  #arabic-islamic-studies .page-hero-icon{color:var(--crimson);}
  #arabic-islamic-studies .image-slot{border-color:rgba(124,31,46,0.35);}
  #arabic-islamic-studies .image-slot svg{color:var(--crimson);}

  /* Nursery & Primary — "Two Foundations" diagram. Visualises the same
     secular/Islamic curriculum blend already stated in this page's own
     text (and the sitewide intro bullets) as a diagram instead of prose
     — no new facts, just a clearer presentation of published ones. */
  .foundations-diagram{display:flex;align-items:stretch;gap:0;margin-top:30px;flex-wrap:wrap;}
  .foundation-card{flex:1;min-width:220px;background:#fff;border:1px solid var(--line);padding:26px 22px;transition:box-shadow .3s ease,transform .3s ease,border-color .3s ease;}
  .foundation-card:hover{transform:translateY(-3px);box-shadow:0 22px 44px -26px rgba(34,23,9,0.28);border-color:var(--terracotta);}
  .foundation-card .fd-icon{display:inline-flex;width:34px;height:34px;color:var(--terracotta);margin-bottom:12px;}
  .foundation-card .fd-icon svg{width:100%;height:100%;}
  .foundation-card h4{font-family:'Cinzel','Amiri',serif;font-size:0.86rem;letter-spacing:0.03em;color:var(--navy);margin-bottom:8px;}
  .foundation-card p{font-size:0.86rem;color:#6b6a63;line-height:1.55;}
  .fd-connector{display:flex;align-items:center;justify-content:center;flex:0 0 46px;font-family:'Cinzel','Amiri',serif;font-size:1.1rem;color:var(--terracotta);}
  @media (max-width:700px){.foundations-diagram{flex-direction:column;}.fd-connector{padding:6px 0;}}

  /* Arabic & Islamic Studies — visual timetable strip. Reformats the
     page's own already-verified schedule (Mon-Wed 2-6pm, Sat-Sun
     9am-3pm) as a 7-day strip instead of two plain text lines. */
  .timetable-strip{display:flex;gap:6px;margin-top:28px;flex-wrap:wrap;}
  .tt-day{flex:1;min-width:74px;text-align:center;border:1px solid var(--line);padding:14px 6px;}
  .tt-day .tt-name{font-family:'Cinzel','Amiri',serif;font-size:0.66rem;letter-spacing:0.06em;text-transform:uppercase;color:#8a8880;display:block;}
  .tt-day .tt-time{font-size:0.7rem;color:#6b6a63;display:block;margin-top:6px;line-height:1.35;}
  .tt-day.is-weekday{border-color:var(--crimson);background:rgba(124,31,46,0.05);}
  .tt-day.is-weekday .tt-name{color:var(--crimson);}
  .tt-day.is-weekend{border-color:var(--crimson);background:rgba(124,31,46,0.09);}
  .tt-day.is-weekend .tt-name{color:var(--crimson);}
  .timetable-legend{display:flex;gap:20px;margin-top:12px;font-size:0.78rem;color:#6b6a63;flex-wrap:wrap;}
  .timetable-legend span{display:inline-flex;align-items:center;gap:6px;}
  .timetable-legend .tl-dot{width:9px;height:9px;border-radius:2px;background:rgba(124,31,46,0.09);border:1px solid var(--crimson);display:inline-block;}

  /* ============================================================
     Phase 5 — process-flow diagrams, org chart, large hero icons.
     Built only from data already published elsewhere on the site
     (admission steps, Hifz Regulations stages, governance ledger).
     ============================================================ */
  /* --- Admissions: an immediate, real first action, not just a
     description of the process. Step 1 of the school's own 12-stage
     process is a human-mediated enquiry — this makes that enquiry
     start-able in one tap, rather than leaving it as prose. --- */
  .adm-enquiry-cta{margin-top:28px;padding:22px 26px;background:var(--navy);border-top:2px solid var(--gold);max-width:640px;}
  .adm-enquiry-lead{color:var(--ivory);font-size:0.92rem;margin:0 0 16px;line-height:1.5;}
  .adm-enquiry-actions{display:flex;flex-wrap:wrap;gap:10px;}
  .adm-enquiry-btn{
    display:inline-flex;align-items:center;gap:8px;padding:10px 16px;font-size:0.82rem;text-decoration:none;
    color:var(--gold-bright);border:1px solid rgba(233,206,138,0.4);transition:border-color .2s ease,background .2s ease;white-space:nowrap;
  }
  .adm-enquiry-btn:hover{border-color:var(--gold-bright);background:rgba(233,206,138,0.08);}
  .adm-enquiry-btn-primary{background:var(--gold);color:var(--navy-deep);border-color:var(--gold);font-weight:600;}
  .adm-enquiry-btn-primary:hover{background:var(--gold-bright);}
  @media (max-width:520px){.adm-enquiry-actions{flex-direction:column;}.adm-enquiry-btn{justify-content:center;}}

  .flow-diagram{display:flex;align-items:stretch;margin-top:36px;flex-wrap:wrap;gap:0;}
  .flow-stage{flex:1;min-width:150px;background:#fff;border:1px solid var(--line);padding:22px 16px;text-align:center;}
  .flow-stage .fs-num{font-family:'Cinzel','Amiri',serif;font-size:0.64rem;color:var(--gold);letter-spacing:0.12em;text-transform:uppercase;}
  .flow-stage h4{font-size:1rem;margin:9px 0 6px;}
  .flow-stage p{font-size:0.78rem;color:#6b6a63;line-height:1.4;}
  .flow-arrow{display:flex;align-items:center;justify-content:center;flex:0 0 30px;color:var(--gold);}
  .flow-diagram.on-dark .flow-stage{background:var(--navy-deep);border-color:var(--line);}
  .flow-diagram.on-dark .flow-stage h4{color:#fff;}
  .flow-diagram.on-dark .flow-stage p{color:rgba(248,244,233,0.6);}
  @media (max-width:820px){
    .flow-diagram{flex-direction:column;}
    .flow-arrow{transform:rotate(90deg);flex:0 0 26px;}
  }

  /* Org chart — real hierarchy only (Board → CEO → Principals/VPs → Departments) */
  .org-chart{margin-top:40px;display:flex;flex-direction:column;align-items:center;}
  .org-tier{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;}
  .org-tier + .org-connector{margin:0 auto;}
  .org-connector{width:1px;height:22px;background:var(--gold);opacity:0.5;}
  .org-node{background:var(--navy-deep);border:1px solid var(--gold);padding:13px 20px;text-align:center;min-width:140px;transition:box-shadow .3s ease,border-color .3s ease,transform .3s ease;}
  .org-node:hover{transform:translateY(-2px);border-color:var(--gold-bright);box-shadow:0 14px 30px -18px rgba(34,23,9,0.5);}
  /* Governance structure: a restrained Oxford Navy accent on the
     structural lines/borders only — an "official record" register
     distinct from the school's warm coffee/gold identity, without
     recolouring the type or the rest of the page. */
  .governance .org-connector{background:var(--oxford-navy);opacity:0.75;}
  .governance .org-node{border-color:var(--oxford-navy);}
  /* Oxford Navy carried through the rest of the Governance page's
     structural accents — an "official record" register that reads
     as a deliberate page personality, not a token touch. The site's
     gold identity stays untouched in the header/footer/buttons. */
  .governance .page-hero-icon{color:#7FA3D6;}
  .governance .ledger-heading{border-bottom-color:var(--oxford-navy);}
  .governance .ledger-heading svg{color:#7FA3D6;}
  .governance .founder-spotlight .fs-photo{border-color:var(--oxford-navy);box-shadow:0 0 0 6px rgba(65,97,140,0.2);}
  .governance .stat-band{border-color:rgba(65,97,140,0.4);}
  .governance .stat-tile{border-color:rgba(65,97,140,0.4);}
  .governance .stat-tile .num{color:#7FA3D6;}
  /* Qur'an College: a small Forest Green accent on the Hifz journey's
     stage numerals — scholarship-and-tradition mood, distinct from the
     gold used for the other three schools' equivalents. */
  #quran-college .flow-stage .fs-num{color:var(--forest-green);}
  .org-node .on-role{font-family:'Cinzel','Amiri',serif;font-size:0.64rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--gold-bright);}
  .org-node .on-count{font-size:0.78rem;color:rgba(248,244,233,0.6);margin-top:3px;display:block;}
  @media (max-width:640px){.org-tier{flex-direction:column;align-items:center;}}

  /* Large hero icon — a standalone institutional mark above a page's
     opening heading, distinct from the small inline icons used
     elsewhere in headings/cards. */
  .page-hero-icon{display:inline-block;width:56px;height:56px;color:var(--gold);margin-bottom:18px;}
  .page-hero-icon svg{width:100%;height:100%;}
  .facilities .page-hero-icon,.contact .page-hero-icon{color:var(--gold-bright);}

  /* Foundation — a small real, countable stat (not a fabricated figure) */
  .found-stat{display:inline-flex;align-items:center;gap:10px;margin-top:22px;padding:10px 18px;border:1px solid var(--line);}
  .found-stat .fst-num{font-family:'Cinzel','Amiri',serif;font-size:1.3rem;color:var(--crimson);}
  .found-stat .fst-label{font-size:0.78rem;color:#6b6a63;text-transform:uppercase;letter-spacing:0.05em;}

  /* ============================================================
     RIGHT-TO-LEFT (Arabic) — structural mirrors only. Font-family
     falls back to Amiri/Cairo automatically per-glyph (Cinzel etc.
     have no Arabic glyphs), so no font-family overrides needed here.
     ============================================================ */
  [dir="rtl"] body{font-family:'Cairo','Inter',sans-serif;}
  /* Arabic script doesn't take decorative letter-tracking well —
     cursive joining reads as broken/loose at these values */
  [dir="rtl"] .eyebrow, [dir="rtl"] .folio, [dir="rtl"] .chapter-word,
  [dir="rtl"] .ledger-row .lg-role, [dir="rtl"] .ledger-heading,
  [dir="rtl"] .mv-lead .mv-label, [dir="rtl"] .mv-aside .mv-label,
  [dir="rtl"] .mono-letter .mw, [dir="rtl"] .fac-row .fn,
  [dir="rtl"] .nav-mark, [dir="rtl"] .brand-text .line1, [dir="rtl"] .brand-text .line2,
  [dir="rtl"] .hero h1, [dir="rtl"] .hero h1 span, [dir="rtl"] .btn,
  [dir="rtl"] .director-card .role, [dir="rtl"] .quote-panel .who,
  [dir="rtl"] .gov-sub, [dir="rtl"] .team-card .role, [dir="rtl"] .school-block .tag,
  [dir="rtl"] .schedule-row strong, [dir="rtl"] .contact-item strong,
  [dir="rtl"] .contact-form label, [dir="rtl"] .foot-grid h5, [dir="rtl"] .seal-quad .glyph,
  [dir="rtl"] .mini-flow span, [dir="rtl"] .en-tag, [dir="rtl"] .policy-head .stat-num,
  [dir="rtl"] .policy-body h5, [dir="rtl"] .sign-row .lab, [dir="rtl"] .placeholder-block .tag,
  [dir="rtl"] .clever-item .word{letter-spacing:normal;}

  /* Ledger role column: 3rd grid column in source order becomes the
     visually-outer (left) column once the grid auto-mirrors for RTL */
  [dir="rtl"] .ledger-row .lg-role{text-align:left;}
  @media (max-width:760px){[dir="rtl"] .ledger-row .lg-role{text-align:right;}}

  /* Accent borders that hug the "leading" edge of their content —
     that edge is the right in RTL, not the left */
  [dir="rtl"] .mv-lead{border-left:none;border-right:2px solid var(--gold);padding-left:0;padding-right:32px;}
  [dir="rtl"] .quote-panel{border-left:none;border-right:3px solid var(--gold);}
  [dir="rtl"] .dept-item{border-left:none;border-right:2px solid var(--gold);}
  [dir="rtl"] .schedule-row div{border-left:none;border-right:2px solid var(--gold);}

  /* CLEVER monogram rail dividers: flexbox visually reverses the row,
     so the divider that was safely on the last (rightmost) item now
     needs to move off the new rightmost (first) item instead */
  [dir="rtl"] .mono-letter:first-child::after{display:none;}
  [dir="rtl"] .mono-letter:last-child::after{content:"";position:absolute;top:20%;bottom:20%;left:0;width:1px;background:var(--line);}

  /* Seal quadrants: CSS Grid mirrors column order for RTL, so the
     divider convention (border on every item but the last) needs the
     same first/last swap as the monogram rail above */
  [dir="rtl"] .seal-quad{border-right:none;border-left:1px solid var(--line);}
  [dir="rtl"] .seal-quad:first-child{border-left:none;}
  [dir="rtl"] .seal-quad:last-child{border-left:1px solid var(--line);}

  /* Stat band dividers mirror the seal-quad convention above */
  [dir="rtl"] .stat-tile{border-right:none;border-left:1px solid var(--line);}
  [dir="rtl"] .stat-tile:last-child{border-left:none;}
  @media (max-width:760px){[dir="rtl"] .stat-tile:nth-child(2n){border-left:none;}}
  [dir="rtl"] .fac-item{border-left:none;border-right:2px solid transparent;}
  [dir="rtl"] .fac-item:hover{border-right-color:var(--gold);}

  /* Institutional corner frame + watermark bleed: mirror the diagonal */
  [dir="rtl"] .institutional-frame::before{left:auto;right:24px;border-right:1px solid var(--gold);border-left:none;}
  [dir="rtl"] .institutional-frame::after{right:auto;left:24px;border-left:1px solid var(--gold);border-right:none;}
  [dir="rtl"] .crest-watermark::before{right:auto;left:-60px;}
  @media (max-width:900px){[dir="rtl"] .crest-watermark::before{right:auto;left:-40px;}}

  /* Nav dropdown opens from the trigger's leading edge (right in RTL) */
  [dir="rtl"] .nav-drop-panel{left:auto;right:0;}

  /* Policy accordion: open-state indent and the chevron's auto-margin
     push both assume LTR "end" = right; flip both to the true end */
  [dir="rtl"] .policy-head{transition:padding-right .3s ease;}
  [dir="rtl"] .policy.open .policy-head{padding-left:0;padding-right:34px;}
  [dir="rtl"] .policy-head .plus{margin-left:0;margin-right:auto;}
  [dir="rtl"] .policy-body ul{padding-left:0;padding-right:20px;}
  [dir="rtl"] .grade-table th, [dir="rtl"] .grade-table td{text-align:right;}

  /* ============================================================
     Admissions Assistant — honest digital assistant widget, not a
     generic chat-bubble template: square corners, gold hairlines,
     and the same type system as the rest of the site.
     ============================================================ */
  .assistant-root{position:fixed;bottom:26px;right:26px;z-index:200;}
  [dir="rtl"] .assistant-root{right:auto;left:26px;}
  .assistant-launcher{
    width:56px;height:56px;border-radius:50%;background:var(--navy);
    border:1px solid var(--gold);box-shadow:0 14px 30px -12px rgba(34,23,9,0.55);
    display:flex;align-items:center;justify-content:center;cursor:pointer;
    transition:transform .25s ease, background .25s ease;
  }
  .assistant-launcher:hover{transform:translateY(-2px);background:var(--navy-deep);}
  .assistant-panel{
    position:absolute;bottom:70px;right:0;width:min(380px, calc(100vw - 40px));
    max-height:min(620px, calc(100vh - 120px));flex-direction:column;
    background:var(--surface);border:1px solid var(--gold);
    box-shadow:0 30px 60px -20px rgba(34,23,9,0.5);
    display:flex;
  }
  [dir="rtl"] .assistant-panel{right:auto;left:0;}
  /* Author-stylesheet display rules below (flex, on several widget
     elements) otherwise beat the UA [hidden]{display:none} rule
     regardless of selector specificity — this restores it. */
  .assistant-root [hidden], .whatsapp-float [hidden]{display:none !important;}
  .assistant-head{
    display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
    background:var(--navy);color:var(--ivory);padding:16px 18px;border-bottom:2px solid var(--gold);
  }
  .assistant-head-title{display:block;font-family:'Cinzel','Amiri',serif;font-size:0.76rem;letter-spacing:0.08em;text-transform:uppercase;color:#fff;}
  [dir="rtl"] .assistant-head-title{letter-spacing:normal;}
  .assistant-head-sub{display:block;font-size:0.72rem;color:var(--gold-bright);margin-top:4px;}
  .assistant-close{background:none;border:none;color:var(--gold-bright);font-size:0.9rem;cursor:pointer;line-height:1;padding:2px;flex-shrink:0;}
  .assistant-head-actions{display:flex;align-items:center;gap:6px;flex-shrink:0;}
  .assistant-head-actions .assistant-icon-btn{color:var(--gold-bright);width:26px;height:26px;border-color:rgba(233,206,138,0.4);}
  .assistant-head-actions .assistant-icon-btn:hover{border-color:var(--gold-bright);color:#fff;}
  .assistant-icon-btn .icon-compress{display:none;}
  .assistant-icon-btn.is-active .icon-expand{display:none;}
  .assistant-icon-btn.is-active .icon-compress{display:flex;}

  .assistant-body{flex:1;display:flex;flex-direction:column;min-height:0;}
  .assistant-panel.is-minimized .assistant-body{display:none;}
  .assistant-panel.is-minimized{max-height:none;cursor:pointer;}

  .assistant-panel.is-fullscreen{
    position:fixed;inset:0;width:100vw;height:100vh;max-height:100vh;
    border:none;box-shadow:none;
  }
  [dir="rtl"] .assistant-panel.is-fullscreen{left:0;}
  .assistant-panel.is-fullscreen .assistant-body{max-width:640px;width:100%;margin:0 auto;}
  body.assistant-fullscreen-lock{overflow:hidden;}

  .assistant-disclosure{
    margin:0;padding:10px 18px;font-size:0.72rem;line-height:1.5;color:var(--on-surface-soft);
    background:rgba(233,206,138,0.14);border-bottom:1px solid var(--line);flex-shrink:0;
  }
  .assistant-messages{flex:1;overflow-y:auto;padding:16px 18px;display:flex;flex-direction:column;gap:10px;min-height:120px;}
  .assistant-msg{max-width:85%;padding:10px 13px;font-size:0.88rem;line-height:1.5;white-space:pre-wrap;}
  .assistant-msg-bot{align-self:flex-start;background:#fff;border:1px solid var(--line);color:var(--on-surface);}
  .assistant-msg-user{align-self:flex-end;background:var(--navy);color:var(--ivory);}
  .assistant-msg-pending{color:var(--on-surface-soft);font-style:italic;}
  .assistant-msg-error{align-self:flex-start;background:#fff;border:1px solid var(--crimson);color:var(--crimson);}
  .assistant-msg-notice{align-self:center;max-width:100%;background:none;border:none;color:var(--on-surface-soft);font-size:0.78rem;text-align:center;padding:2px 8px;}
  .assistant-link{align-self:flex-start;font-size:0.85rem;color:var(--crimson);font-weight:600;border-bottom:1px solid rgba(124,31,46,0.35);margin-top:-4px;}
  .assistant-link:hover{border-color:var(--crimson);}
  .assistant-starters{padding:0 18px 12px;display:flex;flex-wrap:wrap;gap:8px;flex-shrink:0;}
  .assistant-chip{
    font-family:'Inter','Cairo',sans-serif;font-size:0.8rem;padding:8px 14px;
    background:none;border:1px solid var(--gold);color:var(--navy);cursor:pointer;
    transition:background .2s ease, color .2s ease;
  }
  .assistant-chip:hover{background:var(--gold);color:var(--navy-deep);}
  .assistant-contact-form{display:flex;flex-direction:column;gap:8px;width:100%;}
  .assistant-contact-form input{
    font-family:'Inter','Cairo',sans-serif;font-size:0.85rem;padding:9px 11px;
    border:1px solid var(--line);background:#fff;color:var(--on-surface);
  }
  .assistant-contact-form input:focus{outline:2px solid var(--gold);outline-offset:1px;}
  .assistant-contact-form button{margin-top:2px;font-size:0.72rem !important;padding:11px !important;}

  .assistant-attachment{
    margin:0 18px 10px;padding:6px 10px;align-items:center;justify-content:space-between;gap:8px;
    background:rgba(233,206,138,0.14);border:1px solid var(--gold);font-size:0.76rem;color:var(--navy);flex-shrink:0;
    display:flex;
  }
  .assistant-attachment span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .assistant-attachment button{background:none;border:none;color:var(--crimson);cursor:pointer;font-size:0.8rem;flex-shrink:0;}

  .assistant-composer{border-top:1px solid var(--line);padding:12px 14px;flex-shrink:0;}
  .assistant-composer-row{display:flex;align-items:flex-end;gap:6px;}
  .assistant-icon-btn{
    width:34px;height:34px;flex-shrink:0;display:flex;align-items:center;justify-content:center;
    background:none;border:1px solid var(--line);color:var(--navy);cursor:pointer;
    transition:border-color .2s ease, color .2s ease;
  }
  .assistant-icon-btn:hover{border-color:var(--gold);color:var(--crimson);}
  .assistant-icon-btn:disabled{opacity:0.4;cursor:default;}
  .assistant-icon-btn.is-listening{border-color:var(--crimson);color:var(--crimson);background:rgba(124,31,46,0.08);}
  .assistant-input{
    flex:1;resize:none;font-family:'Inter','Cairo',sans-serif;font-size:0.86rem;line-height:1.4;
    padding:8px 10px;border:1px solid var(--line);background:#fff;color:var(--on-surface);max-height:120px;
  }
  .assistant-input:focus{outline:2px solid var(--gold);outline-offset:1px;}
  .assistant-input:disabled{background:var(--surface);}
  .assistant-send-btn{
    width:34px;height:34px;flex-shrink:0;display:flex;align-items:center;justify-content:center;
    background:var(--navy);border:1px solid var(--navy);color:var(--gold-bright);cursor:pointer;
    transition:background .2s ease;
  }
  .assistant-send-btn:hover{background:var(--navy-deep);}
  .assistant-stop-btn{background:var(--crimson);border-color:var(--crimson);}
  .assistant-composer-footer{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px;}
  .assistant-text-btn{
    background:none;border:none;padding:0;font-family:'Inter','Cairo',sans-serif;font-size:0.7rem;
    color:var(--on-surface-soft);cursor:pointer;text-decoration:underline;text-underline-offset:2px;
  }
  .assistant-text-btn:hover{color:var(--crimson);}
  .assistant-text-btn[aria-pressed="true"]{color:var(--crimson);font-weight:600;}
  .assistant-escalate{
    align-self:flex-start;display:inline-flex;align-items:center;gap:6px;margin-top:2px;
    font-family:'Inter','Cairo',sans-serif;font-size:0.78rem;font-weight:600;color:#25963f;
    border-bottom:1px solid rgba(37,150,63,0.35);
  }
  .assistant-escalate:hover{border-color:#25963f;}

  /* ============================================================
     Floating WhatsApp launcher — a second, always-real contact
     channel alongside the AI assistant, stacked above it. Hidden
     while the assistant panel is open so the two never overlap.
     ============================================================ */
  .whatsapp-float{position:fixed;bottom:96px;right:26px;z-index:199;}
  [dir="rtl"] .whatsapp-float{right:auto;left:26px;}
  .whatsapp-float.is-hidden{display:none;}
  .whatsapp-launcher{
    width:52px;height:52px;border-radius:50%;background:#25D366;border:1px solid rgba(0,0,0,0.08);
    box-shadow:0 14px 26px -12px rgba(37,211,102,0.6);display:flex;align-items:center;justify-content:center;
    cursor:pointer;transition:transform .25s ease;
  }
  .whatsapp-launcher:hover{transform:translateY(-2px) scale(1.04);}
  .whatsapp-menu{
    position:absolute;bottom:62px;right:0;width:min(280px, calc(100vw - 40px));
    background:var(--surface);border:1px solid var(--gold);box-shadow:0 24px 50px -18px rgba(34,23,9,0.5);
  }
  .whatsapp-menu[hidden]{display:none;}
  [dir="rtl"] .whatsapp-menu{right:auto;left:0;}
  .whatsapp-menu-head{
    font-family:'Cinzel','Amiri',serif;font-size:0.72rem;letter-spacing:0.06em;text-transform:uppercase;
    color:var(--navy);background:rgba(233,206,138,0.18);padding:12px 16px;border-bottom:1px solid var(--line);
  }
  [dir="rtl"] .whatsapp-menu-head{letter-spacing:normal;}
  .whatsapp-menu-item{
    display:flex;flex-direction:column;gap:2px;padding:11px 16px;border-bottom:1px solid var(--line);
    text-decoration:none;transition:background .2s ease;
  }
  .whatsapp-menu-item:last-child{border-bottom:none;}
  .whatsapp-menu-item:hover{background:rgba(37,211,102,0.08);}
  .whatsapp-menu-item .wm-title{font-family:'Inter','Cairo',sans-serif;font-size:0.85rem;font-weight:600;color:var(--navy);}
  .whatsapp-menu-item .wm-sub{font-family:'Inter','Cairo',sans-serif;font-size:0.72rem;color:var(--on-surface-soft);}

  @media (max-width:520px){
    .assistant-root{bottom:16px;right:16px;}
    [dir="rtl"] .assistant-root{left:16px;}
    .assistant-panel{width:calc(100vw - 32px);bottom:66px;}
    .whatsapp-float{bottom:82px;right:16px;}
    [dir="rtl"] .whatsapp-float{left:16px;}
  }

  /* Floating-action collision reduction: four fixed-position buttons
     (Call School, Apply Now, WhatsApp, Assistant) sit in the bottom
     corners on every page. Below ~900px, page content is narrower and
     more likely to have real interactive elements (buttons, forms) pass
     through that same corner while scrolling — found and fixed one real
     case on the admission page. Widening the compact footprint (smaller
     padding/font, tighter inset) beyond just the 520px mobile band
     shrinks the collision surface across tablet widths too, without
     losing the text labels that make these discoverable. Not a
     guarantee no content will ever momentarily pass under them during
     active scrolling — that's normal for any fixed-position UI — but
     meaningfully lower risk at the widths where it was actually observed.*/
  @media (max-width:900px){
    .call-float a{padding:9px 13px;font-size:0.62rem;}
    .apply-float a{padding:12px 18px;font-size:0.7rem;}
  }

  /* ============================================================
     Floating "Apply Now" CTA — opposite corner from the
     assistant/WhatsApp cluster, revealed once the hero has
     scrolled out of view. Reuses the existing gold-foil shimmer
     keyframe for a subtle, non-flashy accent.
     ============================================================ */
  .apply-float{
    position:fixed;bottom:26px;left:26px;z-index:198;
    opacity:0;transform:translateY(14px);pointer-events:none;
    transition:opacity .4s ease,transform .4s ease;
  }
  [dir="rtl"] .apply-float{left:auto;right:26px;}
  .apply-float.is-visible{opacity:1;transform:translateY(0);pointer-events:auto;}
  /* Subtle gold glow pulse — a soft blurred ring breathing behind the
     button, separate from the hover box-shadow so the two never
     conflict. Restrained: slow (4.5s), low-amplitude, easy to miss if
     not looking for it — a signature detail, not a flashing banner. */
  .apply-float::before{
    content:"";position:absolute;inset:-10px;border-radius:3px;
    background:radial-gradient(circle,var(--accent-bright) 0%,transparent 70%);
    opacity:0.45;filter:blur(13px);z-index:-1;
    animation:applyGlowPulse 4.5s ease-in-out infinite;
  }
  @keyframes applyGlowPulse{0%,100%{opacity:0.32;transform:scale(0.97);}50%{opacity:0.65;transform:scale(1.08);}}
  @media (prefers-reduced-motion:reduce){.apply-float::before{animation:none;opacity:0.3;}}
  .apply-float a{
    display:flex;align-items:center;gap:10px;position:relative;overflow:hidden;
    background:linear-gradient(135deg,var(--navy) 0%,var(--emerald) 45%,var(--accent) 100%);
    background-size:180% 180%;background-position:0% 0%;
    color:#fff;border:1px solid var(--accent-bright);padding:16px 26px;
    font-family:'Cinzel','Amiri',serif;font-size:0.8rem;letter-spacing:0.1em;text-transform:uppercase;font-weight:600;
    box-shadow:0 16px 36px -14px var(--accent-shadow),0 0 0 1px rgba(233,206,138,0.15);
    transition:box-shadow .3s ease,transform .3s ease,background-position .3s ease;
  }
  .apply-float a:hover{box-shadow:0 18px 38px -12px var(--accent-shadow);transform:translateY(-2px);background-position:100% 100%;color:#fff;}
  .apply-float a::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(115deg,transparent 30%,rgba(233,206,138,0.32) 45%,rgba(233,206,138,0.48) 50%,rgba(233,206,138,0.32) 55%,transparent 70%);
    background-size:250% 250%;background-position:200% 200%;
    mix-blend-mode:screen;animation:foilSweep 6s ease-in-out infinite;pointer-events:none;
  }
  @media (prefers-reduced-motion:reduce){.apply-float a::after{animation:none;display:none;}}
  @media (max-width:520px){
    .apply-float{bottom:16px;left:16px;}
    [dir="rtl"] .apply-float{left:auto;right:16px;}
    .apply-float a{padding:12px 18px;font-size:0.7rem;}
  }

  /* Floating "Call School" — stacked above Apply Now on the same
     (left) corner, mirroring the WhatsApp/Assistant stack on the right.
     Always available (not scroll-gated) — a phone call is the one
     channel that should never require a scroll to reach. */
  .call-float{position:fixed;bottom:96px;left:26px;z-index:198;}
  [dir="rtl"] .call-float{left:auto;right:26px;}
  .call-float.is-hidden{display:none;}
  .call-float a{
    display:flex;align-items:center;gap:8px;
    background:var(--surface);color:var(--navy);border:1px solid var(--accent);
    padding:11px 16px;border-radius:999px;
    font-family:'Cinzel','Amiri',serif;font-size:0.68rem;letter-spacing:0.08em;text-transform:uppercase;font-weight:600;
    box-shadow:0 12px 26px -14px rgba(34,23,9,0.4);text-decoration:none;
    transition:box-shadow .25s ease,transform .25s ease,background .25s ease;
  }
  .call-float a:hover{box-shadow:0 16px 32px -12px var(--accent-shadow);transform:translateY(-2px);background:var(--accent-bright);}
  @media (max-width:520px){
    .call-float{bottom:82px;left:16px;}
    [dir="rtl"] .call-float{left:auto;right:16px;}
    .call-float a{padding:9px 13px;font-size:0.62rem;}
  }

  /* ============================================================
     Print stylesheet — built for the Policies page (25+ full
     governance documents), but applies sitewide. Site chrome (nav,
     floating actions, search overlay, Personalisation Centre, footer)
     is print-noise, not content, so it's hidden. Every accordion
     .policy-body is forced open regardless of its on-screen state —
     a printed page has no "collapsed" concept — and the interactive-
     only chevron is hidden. Real content — headings, tables, sign-off
     rows — gets clean black-on-white typography with page-break
     control so a policy's sections don't split awkwardly.
     ============================================================ */
  @media print{
    .topbar, header.nav, .pc-root, .assistant-root, .whatsapp-float,
    .apply-float, .call-float, .search-overlay, footer,
    .policy-head .plus{ display:none !important; }

    body{background:#fff;color:#1a1611;}
    .wrap{max-width:100%;padding:0;}

    .policy-body{
      max-height:none !important; overflow:visible !important;
      padding:0 0 18px !important; transition:none !important;
    }
    .policy{page-break-inside:avoid;border-bottom:1px solid #ccc;margin-bottom:14px;}
    .policy-head{
      background:none !important; border:none !important; color:#1a1611 !important;
      padding:8px 0 !important; pointer-events:none;
    }
    .policy-head .stat-num{color:#7C1F2E !important;}
    .section-block{page-break-inside:avoid;margin-bottom:10px;}
    .grade-table, .grade-table th, .grade-table td{border:1px solid #999 !important;color:#1a1611 !important;}
    .sign-row{border-top:1px solid #999;color:#1a1611 !important;}
    .sign-row .lab{color:#555 !important;}
    a{color:#1a1611 !important;text-decoration:underline;}
    .related-docs a{font-weight:600;}
    .revision-history{color:#444 !important;}

    /* One clean line identifying the source, since the site's own
       header/footer branding is hidden in print. */
    .policies > .wrap > .policy-category:first-of-type::before{
      content:"Sultan Hanafi Royal Schools — Policies Centre — shroyalschools.ng/policies/";
      display:block;font-size:0.7rem;color:#888;margin-bottom:16px;
    }
  }