/* ==========================================================================
   EICADD — design system v2
   Editorial, calm, warm ground + serif display type. Brand accents kept:
   violet #815FA9 · cyan #11ACE4 · green #6FC063
   ========================================================================== */

/* ---------- Fonts (all self-hosted) ---------- */
@font-face{font-family:"DIN Next";src:url("../fonts/din-next-lt-w23-medium.woff2") format("woff2");font-weight:400 500;font-style:normal;font-display:swap}
@font-face{font-family:"DIN Next";src:url("../fonts/din-next-lt-w23-bold.woff2") format("woff2");font-weight:600 700;font-style:normal;font-display:swap}
@font-face{font-family:"DIN Next";src:url("../fonts/din-next-lt-w23-black.woff2") format("woff2");font-weight:800 900;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url("../fonts/instrument-serif-400-latin.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Instrument Serif";src:url("../fonts/instrument-serif-400-italic-latin.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Amiri";src:url("../fonts/amiri-400-latin.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Amiri";src:url("../fonts/amiri-700-latin.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Amiri";src:url("../fonts/amiri-400-arabic.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;
  unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"Amiri";src:url("../fonts/amiri-700-arabic.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap;
  unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}

/* ---------- Tokens ---------- */
:root{
  --violet:#815FA9; --violet-600:#6E4C96; --violet-700:#5B3C80; --violet-100:#EEE7F6; --violet-50:#F7F3FB;
  --cyan:#11ACE4;   --cyan-600:#0B8FC1;   --cyan-100:#DDF3FC;
  --green:#6FC063;  --green-600:#4E9C44;  --green-100:#E4F6E0;

  --ink:#1B1226;    --ink-2:#312642;  --muted:#6E6380;  --muted-2:#9C93A9;
  --bg:#FCFBFA;     --sand:#F5F2EF;   --sand-2:#ECE7E2; --sand-3:#E0D9D2;  --white:#FFFFFF;
  --dark:#1D1330;   --dark-2:#2A1D40;
  --accent:#CDF3C2; --accent-2:#B9ECAA; --accent-ink:#1B1226;
  --line:var(--sand-2); --line-2:#F0ECE8;

  --grad:linear-gradient(120deg,var(--violet) 0%,var(--cyan) 55%,var(--green) 110%);

  --r-sm:12px; --r:16px; --r-lg:24px; --r-xl:32px; --r-2xl:36px; --r-pill:999px;
  --sh-1:0 1px 2px rgba(27,18,38,.05);
  --sh-2:0 8px 24px -12px rgba(27,18,38,.16), 0 2px 6px rgba(27,18,38,.04);
  --sh-3:0 28px 56px -24px rgba(27,18,38,.28), 0 6px 16px -8px rgba(27,18,38,.08);

  --nav-h:72px; --wrap:1280px;
  --pad:clamp(1rem,4vw,2rem);
  --sec:clamp(4.5rem,9vw,8rem);
  --ease:cubic-bezier(.22,.9,.28,1); --ease-out:cubic-bezier(.16,1,.3,1);

  --font-sans:"DIN Next",Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --font-serif:"Instrument Serif","Amiri",Georgia,"Times New Roman",serif;
  color-scheme:light;
}
html[dir="rtl"]{
  --font-sans:"DIN Next","Segoe UI",system-ui,"Noto Naskh Arabic",Tahoma,sans-serif;
  --font-serif:"Amiri","Instrument Serif",Georgia,"Times New Roman",serif;
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:calc(var(--nav-h) + 24px)}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }
body{font-family:var(--font-sans); background:var(--bg); color:var(--ink); font-size:1rem; line-height:1.6;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; overflow-x:hidden; font-weight:400}
img,svg,video,iframe{display:block; max-width:100%}
img{height:auto}
a{color:inherit; text-decoration:none}
button,input,select,textarea{font:inherit; color:inherit}
ul,ol{padding:0; list-style:none}
h1,h2,h3,h4,h5,h6{font-family:var(--font-serif); font-weight:400; line-height:1.06; letter-spacing:-.03em; text-wrap:balance}
html[dir="rtl"] h1,html[dir="rtl"] h2,html[dir="rtl"] h3,html[dir="rtl"] h4{letter-spacing:0; line-height:1.4}
h1 em,h2 em,h3 em,.serif em{font-style:italic; color:var(--violet-700)}
html[dir="rtl"] h1 em,html[dir="rtl"] h2 em,html[dir="rtl"] h3 em{font-style:normal}
p{text-wrap:pretty}
:focus-visible{outline:3px solid var(--cyan); outline-offset:3px; border-radius:6px}
::selection{background:var(--accent); color:var(--ink)}

/* ---------- Layout ---------- */
.wrap{width:min(100% - (var(--pad) * 2), var(--wrap)); margin-inline:auto}
.wrap-narrow{width:min(100% - (var(--pad) * 2), 780px); margin-inline:auto}
.section{padding-block:var(--sec); position:relative}
.section--tight{padding-block:clamp(2.5rem,5vw,4rem)}
.section--flush{padding-top:0}
.section--alt{background:var(--sand)}
.section--alt .card,.section--alt .mcard,.section--alt .branch,.section--alt .spec,.section--alt .bcard,.section--alt .trust{background:#fff}
.section--alt .card:hover,.section--alt .mcard:hover{background:#fff}
.section--alt .card .ic,.section--alt .stat{background:var(--sand)}
.grid{display:grid; gap:1rem}
.g2{grid-template-columns:repeat(2,1fr)} .g3{grid-template-columns:repeat(3,1fr)} .g4{grid-template-columns:repeat(4,1fr)}
@media (max-width:980px){ .g3,.g4{grid-template-columns:repeat(2,1fr)} }
@media (max-width:640px){ .g2,.g3,.g4{grid-template-columns:1fr} }
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute; inset-inline-start:1rem; top:-100px; z-index:2000; background:var(--ink); color:#fff;
  padding:.75rem 1.25rem; border-radius:var(--r-sm); transition:top .2s}
.skip:focus{top:1rem}

/* ---------- Type ---------- */
.kicker{display:inline-block; font-family:var(--font-sans); font-size:.8rem; font-weight:600; letter-spacing:.09em;
  text-transform:uppercase; color:var(--muted); margin-bottom:1rem}
html[dir="rtl"] .kicker{letter-spacing:0; text-transform:none; font-size:.92rem}
.h-display{font-size:clamp(2.5rem,1.6rem + 3.6vw,4.6rem); max-width:22ch}
.h1{font-size:clamp(2.3rem,1.55rem + 2.9vw,4rem); max-width:24ch}
.h2{font-size:clamp(1.95rem,1.4rem + 2.1vw,3.1rem); max-width:26ch}
.h3{font-size:clamp(1.35rem,1.2rem + .7vw,1.8rem)}
html[dir="rtl"] .h-display{font-size:clamp(2.35rem,1.5rem + 3.4vw,4.35rem)}
html[dir="rtl"] .h1{font-size:clamp(2.2rem,1.5rem + 2.7vw,3.75rem)}
html[dir="rtl"] .h2{font-size:clamp(1.85rem,1.35rem + 2vw,2.9rem)}
.lead{font-size:clamp(1.05rem,1rem + .3vw,1.2rem); color:var(--muted); line-height:1.6; max-width:60ch}
.muted{color:var(--muted)}
.prose p{color:var(--muted); margin-bottom:1.1em}
.prose p:last-child{margin-bottom:0}
.prose strong{color:var(--ink)}
.gradient-text{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.section-head{max-width:820px; margin-bottom:clamp(2.25rem,4vw,3.5rem)}
.section-head.center{margin-inline:auto; text-align:center}
.section-head.center .h2,.section-head.center .h1{margin-inline:auto}
.section-head .lead{margin-top:1rem}
.section-head.center .lead{margin-inline:auto}
.sec-title{margin-bottom:clamp(2rem,4vw,3rem)}
.sec-title .h2{max-width:20ch}
.sec-title .lead{margin-top:1rem}

/* ---------- Buttons ---------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.7rem 1.15rem; min-height:44px;
  border-radius:var(--r-sm); border:1px solid transparent; font-weight:500; font-size:.95rem; line-height:1.2; cursor:pointer;
  white-space:nowrap; transition:background .2s,color .2s,border-color .2s,transform .25s var(--ease),box-shadow .25s var(--ease)}
.btn svg{width:1.05em; height:1.05em; flex:none}
html[dir="rtl"] .btn .ico-arrow{transform:scaleX(-1)}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--ink); color:#fff}
.btn-primary:hover{background:var(--dark-2); box-shadow:var(--sh-2)}
.btn-accent{background:var(--accent); color:var(--accent-ink)}
.btn-accent:hover{background:var(--accent-2); box-shadow:var(--sh-2)}
.btn-brand{background:var(--ink); color:#fff}
.btn-brand:hover{background:var(--dark-2); box-shadow:var(--sh-2)}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--sand-3)}
.btn-ghost:hover{background:var(--sand); border-color:var(--sand-3)}
.btn-white{background:#fff; color:var(--ink); border-color:var(--sand-2)}
.btn-white:hover{background:var(--sand)}
.btn-quiet{background:transparent; color:var(--ink); padding-inline:.85rem}
.btn-quiet:hover{background:var(--sand)}
.btn-sm{min-height:38px; padding:.5rem .9rem; font-size:.9rem}
.btn-lg{min-height:52px; padding:.85rem 1.4rem; font-size:1rem; border-radius:14px}
.btn-icon{width:44px; padding:0}
.btn-row{display:flex; flex-wrap:wrap; gap:.65rem; align-items:center}
.btn-row.center{justify-content:center}
.link-arrow{display:inline-flex; align-items:center; gap:.4rem; font-weight:600; color:var(--ink); font-size:.95rem}
.link-arrow svg{width:1em;height:1em;transition:transform .25s var(--ease)}
html[dir="rtl"] .link-arrow svg{transform:scaleX(-1)}
.link-arrow:hover svg{transform:translateX(4px)}
html[dir="rtl"] .link-arrow:hover svg{transform:scaleX(-1) translateX(4px)}
.btn .ico-arrow{transition:transform .3s var(--ease)}
.btn:hover .ico-arrow{transform:translateX(3px)}
html[dir="rtl"] .btn:hover .ico-arrow{transform:scaleX(-1) translateX(3px)}

/* Bidi isolation for phone numbers, emails and latin terms inside Arabic text */
.ltr,bdi.num{direction:ltr; unicode-bidi:isolate; display:inline-block}
html[dir="rtl"] .announce-phones a,html[dir="rtl"] .phone-chip,html[dir="rtl"] .branch dd a[href^="tel"],html[dir="rtl"] .branch dd a[href^="mailto"]{direction:ltr; unicode-bidi:isolate}
html[dir="rtl"] .footer li a[href^="tel"],html[dir="rtl"] .footer li a[href^="mailto"]{direction:ltr; unicode-bidi:isolate}

/* ---------- Announcement bar + Nav ---------- */
.announce{background:var(--accent); color:var(--ink); font-size:.85rem; position:relative; z-index:60}
.announce .wrap{display:flex; align-items:center; justify-content:center; gap:.5rem 1.5rem; min-height:36px; flex-wrap:wrap; padding-block:.35rem}
.announce-msg{font-weight:500}
.announce-phones{display:flex; gap:1.1rem; flex-wrap:wrap}
.announce-phones a{display:inline-flex; align-items:center; gap:.4rem; font-weight:600}
.announce-phones a:hover{text-decoration:underline; text-underline-offset:3px}
.announce-phones img{width:18px; height:13px; border-radius:2px; object-fit:cover}
@media (max-width:720px){ .announce-msg{display:none} }

.nav{position:sticky; top:0; z-index:90; background:rgba(252,251,250,.86);
  backdrop-filter:saturate(160%) blur(18px); -webkit-backdrop-filter:saturate(160%) blur(18px);
  border-bottom:1px solid transparent; transition:border-color .3s,box-shadow .3s}
.nav.is-stuck{border-bottom-color:var(--sand-2)}
.nav .wrap{display:flex; align-items:center; gap:1rem; min-height:var(--nav-h)}
.brand{display:flex; align-items:center; gap:.7rem; flex:none}
.brand img{height:40px; width:auto}
.brand-txt{display:none}
.nav > .wrap > nav{margin-inline:auto}
.navlist{display:flex; align-items:center; gap:.1rem}
@media (max-width:1100px){ .navlist{display:none} }
.navlist > li{position:relative}
.navlink{font-family:inherit; border:0; background:none; cursor:pointer; display:inline-flex; align-items:center; gap:.3rem;
  padding:.5rem .8rem; border-radius:var(--r-sm); font-size:.95rem; font-weight:500; color:var(--ink-2); transition:background .2s,color .2s}
.navlink:hover,.navlink[aria-expanded="true"]{background:var(--sand); color:var(--ink)}
.navlink[aria-current="page"]{color:var(--ink); font-weight:600}
.navlink .chev{width:.7em; height:.7em; opacity:.5; transition:transform .25s var(--ease)}
.navlink[aria-expanded="true"] .chev{transform:rotate(180deg)}
.dropdown{position:absolute; inset-inline-start:0; top:calc(100% + 10px); min-width:260px; background:#fff;
  border:1px solid var(--sand-2); border-radius:var(--r); box-shadow:var(--sh-3); padding:.45rem; z-index:5;
  opacity:0; visibility:hidden; transform:translateY(-6px); transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s}
.navlist > li.open .dropdown,.langmenu.open .dropdown{opacity:1; visibility:visible; transform:translateY(0)}
.dropdown a{display:block; padding:.6rem .8rem; border-radius:10px; font-size:.93rem; font-weight:500; color:var(--ink-2)}
.dropdown a:hover{background:var(--sand); color:var(--ink)}
.dropdown a[aria-current="true"]{color:var(--ink); font-weight:600; background:var(--sand)}
.nav-actions{display:flex; align-items:center; gap:.45rem; flex:none}
.langmenu{position:relative}
.langmenu .dropdown{inset-inline-start:auto; inset-inline-end:0; min-width:180px}
.lang-btn{display:inline-flex; align-items:center; gap:.4rem; padding:.5rem .7rem; min-height:40px; border-radius:var(--r-sm);
  border:1px solid transparent; font-size:.9rem; font-weight:500; color:var(--ink-2); background:transparent; cursor:pointer}
.lang-btn svg{width:1.1em; height:1.1em; flex:none}
.lang-btn .chev{width:.7em;height:.7em;opacity:.5}
.lang-btn:hover,.lang-btn[aria-expanded="true"]{background:var(--sand); color:var(--ink)}
.nav-call{display:none}
@media (max-width:1100px){ .lang-cur,.langmenu .chev{display:none} .lang-btn{width:40px; justify-content:center; padding:0} .nav-call{display:inline-flex} }
@media (max-width:480px){ .nav-actions .btn-book{display:none} }
.burger{display:none; width:40px; height:40px; border:1px solid var(--sand-2); background:#fff;
  border-radius:var(--r-sm); cursor:pointer; padding:0; place-items:center}
@media (max-width:1100px){ .burger{display:grid} }
.burger span{display:block; width:18px; height:2px; background:var(--ink); border-radius:2px; transition:transform .3s var(--ease),opacity .2s}
.burger span + span{margin-top:4px}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* Mobile drawer */
.drawer{position:fixed; inset:0; z-index:95; background:var(--bg); padding:1rem var(--pad) 3rem;
  overflow-y:auto; transform:translateY(-8px); opacity:0; visibility:hidden;
  transition:opacity .28s var(--ease),transform .28s var(--ease),visibility .28s}
.drawer.open{opacity:1; visibility:visible; transform:none}
.drawer-top{display:flex; align-items:center; justify-content:space-between; min-height:var(--nav-h); margin-bottom:.5rem}
.drawer nav > ul > li{border-bottom:1px solid var(--sand-2)}
.drawer nav a,.drawer .acc-btn{display:flex; align-items:center; justify-content:space-between; width:100%;
  padding:1rem .1rem; font-family:var(--font-serif); font-size:1.6rem; font-weight:400; background:none; border:0; text-align:start; cursor:pointer; color:var(--ink)}
html[dir="rtl"] .drawer nav a,html[dir="rtl"] .drawer .acc-btn{font-size:1.5rem}
.drawer .sub{display:none; padding-bottom:.75rem}
.drawer .sub.open{display:block}
.drawer .sub a{font-family:var(--font-sans); font-size:1rem; font-weight:500; color:var(--muted); padding:.55rem .1rem .55rem 1rem}
html[dir="rtl"] .drawer .sub a{padding:.55rem 1rem .55rem .1rem}
.drawer .acc-btn .chev{width:.8em;height:.8em;opacity:.5;transition:transform .25s}
.drawer .acc-btn[aria-expanded="true"] .chev{transform:rotate(180deg)}
.drawer-cta{margin-top:1.5rem; display:grid; gap:.6rem}
.drawer-langs{margin-top:2rem; padding-top:1.5rem; border-top:1px solid var(--sand-2)}
.drawer-langs h2{font-family:var(--font-sans); font-size:.8rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); display:flex; align-items:center; gap:.4rem; margin-bottom:.75rem}
html[dir="rtl"] .drawer-langs h2{letter-spacing:0; text-transform:none; font-size:.9rem}
.drawer-langs h2 svg{width:1em;height:1em}
.lang-grid{display:flex; flex-wrap:wrap; gap:.5rem}
.lang-grid a{display:inline-flex; align-items:center; padding:.45rem .85rem; border-radius:var(--r-pill); border:1px solid var(--sand-3); font-size:.9rem; font-weight:500}
.lang-grid a[aria-current="true"]{background:var(--ink); color:#fff; border-color:var(--ink)}

/* ---------- Hero (home) ---------- */
.hero{padding-block:clamp(3rem,6vw,5.5rem) clamp(2rem,4vw,3rem)}
.hero-copy{display:flex; flex-direction:column; align-items:center; text-align:center; margin-bottom:clamp(2rem,4vw,3rem)}
.hero-copy .h-display{margin-inline:auto; margin-bottom:1.25rem; max-width:26ch}
.hero-copy .lead{margin-inline:auto; margin-bottom:1.75rem; max-width:62ch}
.hero-panel{position:relative; border-radius:var(--r-2xl); overflow:hidden; background:var(--sand); aspect-ratio:16/8.4; isolation:isolate}
.hero-panel picture,.hero-panel > img{position:absolute; inset:0; width:100%; height:100%}
.hero-panel img{width:100%; height:100%; object-fit:cover; object-position:center 30%}
.hero-veil{position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg,rgba(27,18,38,0) 40%,rgba(27,18,38,.42) 100%),
             radial-gradient(60% 50% at 10% 100%,rgba(129,95,169,.35),transparent 70%),
             radial-gradient(50% 45% at 92% 90%,rgba(17,172,228,.28),transparent 70%)}
.hero-stat{position:absolute; z-index:2; top:1.25rem; inset-inline-end:1.25rem; display:flex; align-items:baseline; gap:.5rem;
  background:rgba(255,255,255,.9); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-radius:var(--r-pill); padding:.55rem 1rem .5rem; box-shadow:var(--sh-2)}
.hero-stat .n{font-family:var(--font-serif); font-size:1.5rem; line-height:1; color:var(--ink)}
.hero-stat .t{font-size:.82rem; color:var(--muted)}
.aidi-card{position:absolute; z-index:2; bottom:1.25rem; inset-inline:1.25rem; margin-inline:auto; width:min(600px,calc(100% - 2.5rem));
  background:rgba(255,255,255,.92); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-radius:20px; padding:1rem 1.1rem 1.05rem; box-shadow:var(--sh-3); display:grid; gap:.8rem}
.aidi-head{display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; font-size:.9rem}
.aidi-head strong{font-weight:700; letter-spacing:.02em}
.aidi-dot{width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(111,192,99,.22)}
.aidi-meta{color:var(--muted); margin-inline-start:auto; font-size:.85rem}
.aidi-bar{height:8px; border-radius:var(--r-pill); background:var(--sand-2); overflow:hidden}
.aidi-bar span{display:block; height:100%; width:100%; border-radius:inherit; background:var(--grad); transform-origin:var(--to,left); transform:scaleX(1)}
html[dir="rtl"] .aidi-bar span{--to:right}
.aidi-chips{display:flex; flex-wrap:wrap; gap:.4rem}
.aidi-chips span{display:inline-flex; align-items:center; gap:.35rem; padding:.32rem .7rem; border-radius:var(--r-pill);
  border:1px solid var(--sand-3); background:#fff; font-size:.82rem; font-weight:500; color:var(--ink-2)}
.aidi-chips span::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--violet)}
.aidi-chips span:nth-child(2)::before{background:var(--cyan)}
.aidi-chips span:nth-child(3)::before{background:var(--green)}
.aidi-chips span:nth-child(4)::before{background:var(--violet-600)}
@media (max-width:760px){
  .hero-panel{aspect-ratio:4/5; border-radius:var(--r-lg)}
  .hero-stat{top:.85rem; inset-inline-end:.85rem; padding:.45rem .8rem} .hero-stat .n{font-size:1.25rem}
  .aidi-card{bottom:.85rem; inset-inline:.85rem; width:min(600px,calc(100% - 1.7rem)); padding:.85rem .9rem; gap:.65rem; border-radius:16px}
  .aidi-meta{margin-inline-start:0; width:100%}
}

/* ---------- Trust panel + stats ---------- */
.trust{background:var(--sand); border-radius:var(--r-2xl); padding:clamp(1.5rem,3.5vw,2.5rem); display:grid; gap:clamp(1.25rem,3vw,2rem)}
.trust-line{text-align:center; font-size:clamp(1.05rem,1rem + .5vw,1.35rem); font-weight:500; color:var(--ink); display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:.45rem .55rem}
.trust-num{display:inline-flex; align-items:baseline; background:var(--accent); border-radius:var(--r-pill); padding:.15rem .8rem;
  font-family:var(--font-serif); font-size:1.35em; line-height:1.2; letter-spacing:-.01em; font-variant-numeric:tabular-nums}
.stat-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem}
.stats{display:grid; grid-template-columns:repeat(4,1fr); gap:.75rem}
@media (max-width:760px){ .stat-grid,.stats{grid-template-columns:repeat(2,1fr)} }
@media (max-width:420px){ .stat-grid{grid-template-columns:1fr} }
.stat{background:#fff; border-radius:var(--r-lg); padding:clamp(1.1rem,2.5vw,1.6rem) clamp(1rem,2vw,1.4rem); text-align:center; transition:transform .35s var(--ease)}
.stats .stat{background:var(--sand)}
.stat .n{font-family:var(--font-serif); font-size:clamp(2rem,1.4rem + 2vw,3rem); line-height:1.05; letter-spacing:-.02em; color:var(--ink); font-variant-numeric:tabular-nums}
.stat .l{font-size:.9rem; color:var(--muted); margin-top:.45rem}

/* ---------- Big quote ---------- */
.bigquote{text-align:center; max-width:880px; margin-inline:auto}
.bigquote blockquote{font-family:var(--font-serif); font-size:clamp(1.5rem,1.15rem + 1.6vw,2.4rem); line-height:1.25; letter-spacing:-.02em; color:var(--ink); text-wrap:balance}
html[dir="rtl"] .bigquote blockquote{letter-spacing:0; line-height:1.55}
.bigquote figcaption{margin-top:1.25rem; font-size:.95rem; color:var(--muted)}
.bigquote figcaption strong{color:var(--ink); font-weight:600}
.bigquote .stars{display:inline-flex; gap:2px; color:#F5A623; margin-bottom:1rem}
.bigquote .stars svg{width:1.05rem;height:1.05rem}
.bigquote .tr-note{display:block; font-size:.8rem; color:var(--muted-2); margin-top:.3rem}

/* ---------- Bento ---------- */
.bento{display:grid; grid-template-columns:repeat(2,1fr); gap:1rem}
.bcard{position:relative; background:var(--sand); border-radius:var(--r-xl); overflow:hidden; display:flex; flex-direction:column; min-height:100%}
.bcard .bbody{padding:clamp(1.5rem,3vw,2.5rem); display:flex; flex-direction:column; gap:.9rem; align-items:flex-start}
.bcard .bbody .h3{font-size:clamp(1.5rem,1.25rem + 1vw,2rem); max-width:18ch}
.bcard .bbody p{color:var(--muted); max-width:46ch}
.bcard .bbody .btn{margin-top:.35rem}
.bcard .bmedia{position:relative; overflow:hidden; background:var(--sand-2); aspect-ratio:16/10; margin:0}
.bcard .bmedia picture{display:contents}
.bcard .bmedia img{position:absolute; inset:0; width:100%; height:100%}
.bcard .bmedia img{object-fit:cover; transition:transform .8s var(--ease)}
.bcard:hover .bmedia img{transform:scale(1.03)}
.bcard-wide{grid-column:1 / -1; display:grid; grid-template-columns:1fr 1.15fr; align-items:stretch}
.bcard-wide .bmedia{aspect-ratio:auto; min-height:380px; border-radius:var(--r-xl); margin:.75rem; margin-inline-start:0}
html[dir="rtl"] .bcard-wide .bmedia{margin-inline-start:.75rem; margin-inline-end:0}
.bcard-wide .bbody{justify-content:center}
@media (max-width:900px){
  .bento{grid-template-columns:1fr}
  .bcard-wide{grid-template-columns:1fr}
  .bcard-wide .bmedia{min-height:0; aspect-ratio:16/10; margin:0 .75rem .75rem; order:1}
  html[dir="rtl"] .bcard-wide .bmedia{margin:0 .75rem .75rem}
}

/* ---------- Cards ---------- */
.card{background:var(--sand); border-radius:var(--r-lg); padding:clamp(1.4rem,2.6vw,2rem); position:relative; height:100%;
  transition:background .3s var(--ease),transform .35s var(--ease)}
.card:hover{background:var(--sand-2)}
.card .ic{width:48px; height:48px; border-radius:14px; display:grid; place-items:center; margin-bottom:1.15rem; background:#fff; color:var(--violet-700)}
.card .ic svg{width:24px;height:24px}
.card:nth-child(3n+2) .ic{color:var(--cyan-600)}
.card:nth-child(3n+3) .ic{color:var(--green-600)}
.card h3{margin-bottom:.6rem; font-size:clamp(1.3rem,1.15rem + .6vw,1.6rem)}
.card p{color:var(--muted); font-size:.975rem}
.card ul.checklist li{color:var(--ink-2)}

/* media card (service / therapy / protocol) */
.mcard{display:flex; flex-direction:column; background:var(--sand); border-radius:var(--r-lg); overflow:hidden; height:100%;
  transition:transform .35s var(--ease),background .3s}
.mcard:hover{background:var(--sand-2)}
.mcard .thumb{aspect-ratio:16/10; overflow:hidden; background:var(--sand-2); margin:.6rem; border-radius:calc(var(--r-lg) - .5rem)}
.mcard .thumb img{width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease)}
.mcard:hover .thumb img{transform:scale(1.04)}
.mcard .body{padding:.75rem 1.4rem 1.5rem; display:flex; flex-direction:column; gap:.55rem; flex:1}
.mcard h3{font-size:1.45rem}
.mcard p{color:var(--muted); font-size:.95rem; flex:1}
.mcard .link-arrow{margin-top:.4rem}

/* feature row (alternating image/text) */
.frow{display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,5rem); align-items:center}
@media (max-width:900px){ .frow{grid-template-columns:1fr; gap:2rem} }
.frow + .frow{margin-top:clamp(3.5rem,7vw,6rem)}
.frow .media{border-radius:var(--r-xl); overflow:hidden; background:var(--sand); aspect-ratio:4/3}
.frow .media picture{display:contents}
.frow .media img{width:100%; height:100%; object-fit:cover; object-position:center 25%}
.frow:nth-child(even) .media{order:-1}
@media (max-width:900px){ .frow:nth-child(even) .media{order:0} }
.frow ol.steps{counter-reset:s; display:grid; gap:1.1rem; margin-top:1.5rem}
ol.steps li{counter-increment:s; position:relative; padding-inline-start:3.1rem}
ol.steps li::before{content:counter(s,decimal-leading-zero); position:absolute; inset-inline-start:0; top:.1rem; width:2.2rem; height:2.2rem;
  border-radius:50%; background:var(--sand); color:var(--ink); font-weight:600; font-size:.8rem; display:grid; place-items:center; font-variant-numeric:tabular-nums}
ol.steps h3{font-size:1.35rem; margin-bottom:.2rem}
ol.steps p{color:var(--muted); font-size:.95rem}

/* pill list */
.pills{display:flex; flex-wrap:wrap; gap:.5rem}
.pill{display:inline-flex; align-items:center; gap:.45rem; padding:.5rem .95rem; border-radius:var(--r-pill);
  background:#fff; border:1px solid var(--sand-3); font-size:.9rem; font-weight:500; color:var(--ink-2)}
.section--alt .pill{background:#fff}
.pill svg{width:.95em;height:.95em;color:var(--green-600)}

/* checklist */
.checklist{display:grid; gap:.8rem}
.checklist li{display:flex; gap:.7rem; align-items:flex-start; color:var(--muted)}
.checklist svg{width:1.3em; height:1.3em; flex:none; color:var(--green-600); margin-top:.15em}

/* spec strip */
.specs{display:grid; grid-template-columns:repeat(4,1fr); gap:.75rem; margin-top:2rem}
@media (max-width:760px){ .specs{grid-template-columns:repeat(2,1fr)} }
.spec{background:var(--sand); border-radius:var(--r); padding:1.1rem 1.15rem}
.spec .v{font-family:var(--font-serif); font-size:1.5rem; line-height:1.15; color:var(--ink)}
.spec .k{font-size:.85rem; color:var(--muted); margin-top:.25rem}

/* ---------- Dark marquee band ---------- */
.tasks{background:var(--dark); color:#fff; overflow:hidden}
.tasks .wrap{display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:2rem; min-height:520px}
.tasks-label{font-weight:700; font-size:1rem; line-height:1.4; max-width:22ch; white-space:pre-line}
.tasks-cta{justify-self:end}
.tasks-list{height:24rem; overflow:hidden; position:relative;
  -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 32%,#000 68%,transparent 100%);
  mask-image:linear-gradient(180deg,transparent 0%,#000 32%,#000 68%,transparent 100%)}
.tasks-list ul{display:grid; gap:0; animation:ticker 26s linear infinite}
.tasks-list li{font-family:var(--font-serif); font-size:clamp(1.6rem,1.2rem + 1.6vw,2.6rem); line-height:1.35; letter-spacing:-.02em; white-space:nowrap; text-align:center; padding:.55rem 0; color:#fff}
html[dir="rtl"] .tasks-list li{letter-spacing:0; line-height:1.6}
.tasks:hover .tasks-list ul{animation-play-state:paused}
@keyframes ticker{ from{transform:translateY(0)} to{transform:translateY(-50%)} }
@media (max-width:900px){
  .tasks .wrap{grid-template-columns:1fr; text-align:center; gap:1.5rem; min-height:0; padding-block:3.5rem}
  .tasks-label{margin-inline:auto} .tasks-cta{justify-self:center} .tasks-list{height:16rem}
}

/* ---------- Photo strip (marquee of images) ---------- */
.strip{overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent); mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.strip-track{display:flex; gap:1rem; width:max-content; animation:scrollx 60s linear infinite}
html[dir="rtl"] .strip-track{animation-name:scrollx-rtl}
.strip:hover .strip-track{animation-play-state:paused}
.strip figure{margin:0; width:clamp(220px,26vw,340px); aspect-ratio:4/3; border-radius:var(--r-lg); overflow:hidden; background:var(--sand); flex:none}
.strip img{width:100%;height:100%;object-fit:cover}

/* ---------- Tabs ---------- */
.tabs{display:flex; gap:.35rem; flex-wrap:wrap; margin-bottom:2rem; padding:.35rem; background:var(--sand); border-radius:var(--r-pill); width:fit-content; max-width:100%}
.tab{padding:.55rem 1.1rem; border-radius:var(--r-pill); border:0; background:transparent; cursor:pointer; font-weight:500; font-size:.92rem; color:var(--muted); transition:background .25s,color .25s}
.tab[aria-selected="true"]{background:#fff; color:var(--ink); box-shadow:var(--sh-1)}
.tabpanel[hidden]{display:none}
.tabpanel{animation:fadeUp .45s var(--ease-out)}

/* ---------- Accordion ---------- */
.acc{border-top:1px solid var(--sand-3)}
.acc details{border-bottom:1px solid var(--sand-3)}
.acc summary{display:flex; align-items:center; justify-content:space-between; gap:1rem; cursor:pointer;
  padding:1.35rem .1rem; font-family:var(--font-serif); font-size:1.4rem; line-height:1.3; list-style:none}
.acc summary::-webkit-details-marker{display:none}
.acc summary .plus{width:1.5rem;height:1.5rem;flex:none;position:relative;border-radius:50%;background:var(--sand);transition:transform .3s var(--ease)}
.acc summary .plus::before,.acc summary .plus::after{content:"";position:absolute;inset-inline:.4rem;top:50%;height:2px;background:var(--ink);border-radius:2px;transform:translateY(-50%)}
.acc summary .plus::after{transform:translateY(-50%) rotate(90deg); transition:transform .3s var(--ease)}
.acc details[open] summary .plus::after{transform:translateY(-50%) rotate(0)}
.acc .acc-body{padding:0 .1rem 1.5rem; color:var(--muted); max-width:72ch}
.acc details[open] .acc-body{animation:fadeUp .35s var(--ease-out)}

/* ---------- Video ---------- */
.vidcard{position:relative; border-radius:var(--r-xl); overflow:hidden; background:var(--dark); aspect-ratio:16/9; cursor:pointer; border:0; padding:0; width:100%; display:block}
.vidcard img{width:100%;height:100%;object-fit:cover;opacity:.9;transition:transform .7s var(--ease),opacity .3s}
.vidcard:hover img{transform:scale(1.04); opacity:.8}
.vidcard .play{position:absolute; inset:0; display:grid; place-items:center}
.vidcard .play span{width:68px;height:68px;border-radius:50%;background:rgba(255,255,255,.94);display:grid;place-items:center;box-shadow:0 8px 30px rgba(0,0,0,.35);transition:transform .3s var(--ease)}
.vidcard:hover .play span{transform:scale(1.08)}
.vidcard .play svg{width:22px;height:22px;color:var(--ink); margin-inline-start:3px}
html[dir="rtl"] .vidcard .play svg{margin-inline-start:0; margin-inline-end:3px}
.vidcard iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
.vid-title{margin-top:.9rem; font-size:.975rem; font-weight:500; line-height:1.45; color:var(--ink-2)}
.video-feature{margin-bottom:1rem}
.video-feature .vidcard{border-radius:var(--r-2xl)}
@media (max-width:640px){ .vidcard,.video-feature .vidcard{border-radius:var(--r-lg)} }

/* ---------- Gallery grid (inner pages) ---------- */
.gallery{display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:1rem}
.gallery figure{margin:0; border-radius:var(--r-lg); overflow:hidden; aspect-ratio:4/3; background:var(--sand)}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.gallery figure:hover img{transform:scale(1.05)}

/* ---------- Testimonials ---------- */
.marquee{overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.marquee-track{display:flex; gap:1rem; width:max-content; animation:scrollx 70s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
html[dir="rtl"] .marquee-track{animation-name:scrollx-rtl}
@keyframes scrollx{ from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes scrollx-rtl{ from{transform:translateX(0)} to{transform:translateX(50%)} }
.quote{width:min(380px,82vw); flex:none; background:var(--sand); border-radius:var(--r-lg); padding:1.6rem; display:flex; flex-direction:column; gap:1rem}
.section--alt .quote{background:#fff}
.quote .stars{display:flex; gap:2px; color:#F5A623}
.quote .stars svg{width:1rem;height:1rem}
.quote p{font-size:1rem; line-height:1.65; color:var(--ink-2); flex:1}
.quote .tr-note{font-size:.75rem; color:var(--muted-2); font-style:italic; margin-top:-.4rem}
.quote figcaption{display:flex; align-items:center; gap:.6rem; font-size:.85rem; color:var(--muted)}
.quote figcaption .av{width:34px;height:34px;border-radius:50%;background:#fff;color:var(--violet-700);display:grid;place-items:center;flex:none}
.section--alt .quote figcaption .av{background:var(--sand)}
.quote figcaption .av svg{width:16px;height:16px}
.quote-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:1rem}
.quote-grid .quote{width:auto}

/* ---------- CTA panel ---------- */
.cta-panel{position:relative; overflow:hidden; border-radius:var(--r-2xl); padding:clamp(3rem,7vw,6rem) clamp(1.5rem,4vw,3rem);
  background:var(--sand); text-align:center; isolation:isolate}
.cta-panel::before{content:""; position:absolute; inset:0; z-index:-1; opacity:.9; pointer-events:none;
  background:radial-gradient(40% 70% at 0% 100%,rgba(129,95,169,.16),transparent 70%),
             radial-gradient(40% 70% at 100% 0%,rgba(17,172,228,.14),transparent 70%),
             radial-gradient(35% 60% at 100% 100%,rgba(111,192,99,.18),transparent 70%)}
.cta-panel .cta-lines{position:absolute; inset:0; z-index:-1; width:100%; height:100%; pointer-events:none; opacity:.9}
.cta-panel .h2{margin-inline:auto; max-width:20ch}
.cta-panel p{color:var(--muted); max-width:56ch; margin:1rem auto 1.75rem}
.cta-panel .btn-row{justify-content:center}
@media (max-width:640px){ .cta-panel{border-radius:var(--r-lg)} }

/* ---------- Page header (inner pages) ---------- */
.pagehead{padding-block:clamp(2.5rem,5vw,4.5rem) clamp(1rem,2vw,1.5rem); text-align:center}
.pagehead .h1{margin-inline:auto}
.pagehead .lead{margin:1.1rem auto 0; max-width:60ch}
.crumbs{display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:.45rem; font-size:.85rem; color:var(--muted); margin-bottom:1.5rem}
.crumbs a:hover{color:var(--ink); text-decoration:underline; text-underline-offset:3px}
.crumbs .sep{opacity:.45}
html[dir="rtl"] .crumbs .sep{transform:scaleX(-1); display:inline-block}
.pagehead + .section{padding-top:clamp(2rem,4vw,3.5rem)}

/* ---------- Branch / contact ---------- */
.branch{background:var(--sand); border-radius:var(--r-xl); overflow:hidden}
.branch .head{padding:1.6rem clamp(1.25rem,2.4vw,1.8rem) 1rem; display:flex; align-items:center; gap:.75rem}
.branch .head img{width:30px;height:22px;border-radius:4px;object-fit:cover}
.branch .head h3{font-size:1.6rem}
.branch dl{padding:0 clamp(1.25rem,2.4vw,1.8rem) 1.5rem; display:grid; gap:1rem; margin:0}
.branch dt{font-size:.78rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--muted-2); margin-bottom:.2rem}
html[dir="rtl"] .branch dt{text-transform:none; letter-spacing:0; font-size:.85rem}
.branch dd{margin:0; font-size:.975rem; color:var(--ink-2)}
.branch .infoline{display:flex; gap:.65rem; align-items:flex-start}
.branch .infoline > svg{width:1.15rem;height:1.15rem;flex:none;color:var(--violet-700);margin-top:.15rem}
.branch .mapwrap{aspect-ratio:16/9; background:var(--sand-2); position:relative; margin:0 .6rem .6rem; border-radius:calc(var(--r-xl) - .6rem); overflow:hidden}
.branch .mapwrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.mapholder{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem; background:var(--sand-2); cursor:pointer; border:0; width:100%; transition:background .25s}
.mapholder:hover{background:var(--sand-3)}
.mapholder svg{width:34px; height:34px; color:var(--violet-700); opacity:.8}
.mapholder .t{font-weight:600; color:var(--ink)}
.mapholder .s{font-size:.85rem; color:var(--muted)}

/* ---------- Form ---------- */
.form{display:grid; gap:1.1rem}
.field{display:grid; gap:.4rem}
.field label{font-size:.875rem; font-weight:600; color:var(--ink-2)}
.field input,.field select,.field textarea{width:100%; padding:.85rem 1rem; border:1px solid var(--sand-3); border-radius:var(--r-sm); background:#fff; font-size:1rem; transition:border-color .2s,box-shadow .2s; min-height:48px}
.field textarea{min-height:128px; resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:0; border-color:var(--violet); box-shadow:0 0 0 4px var(--violet-100)}
.field .hint{font-size:.8rem; color:var(--muted-2)}
.consent{display:flex; gap:.65rem; align-items:flex-start; font-size:.9rem; color:var(--muted)}
.consent input{width:20px;height:20px;min-height:0;flex:none;margin-top:.15rem;accent-color:var(--violet)}
.form-note{font-size:.85rem; color:var(--muted); background:var(--sand); border-radius:var(--r-sm); padding:.85rem 1rem}
.form-status{font-size:.9rem; font-weight:600; padding:.85rem 1rem; border-radius:var(--r-sm); display:none}
.form-status.show{display:block}
.form-status.ok{background:var(--green-100); color:var(--green-600)}
.form-status.err{background:#FDEBEB; color:#C0392B}

/* ---------- Legal / article ---------- */
.legal{display:grid; grid-template-columns:250px 1fr; gap:clamp(2rem,5vw,4.5rem); align-items:start}
@media (max-width:920px){ .legal{grid-template-columns:1fr} }
.toc{position:sticky; top:calc(var(--nav-h) + 24px); background:var(--sand); border-radius:var(--r); padding:1.25rem}
@media (max-width:920px){ .toc{position:static} }
.toc h2{font-family:var(--font-sans); font-size:.78rem; font-weight:600; text-transform:uppercase; letter-spacing:.08em; color:var(--muted-2); margin-bottom:.85rem}
html[dir="rtl"] .toc h2{text-transform:none; letter-spacing:0; font-size:.9rem}
.toc a{display:block; padding:.4rem 0; font-size:.9rem; color:var(--muted); border-inline-start:2px solid transparent; padding-inline-start:.75rem}
.toc a:hover,.toc a.active{color:var(--ink); border-color:var(--ink)}
.article h2{font-size:clamp(1.5rem,1.2rem + 1vw,2rem); margin:2.5rem 0 .9rem; scroll-margin-top:calc(var(--nav-h) + 24px)}
.article h2:first-child{margin-top:0}
.article p{color:var(--muted); margin-bottom:1rem; max-width:72ch}
.article ul{display:grid; gap:.6rem; margin:0 0 1.25rem; max-width:72ch}
.article ul li{display:flex; gap:.65rem; color:var(--muted)}
.article ul li::before{content:""; width:6px;height:6px;border-radius:50%;background:var(--violet);flex:none;margin-top:.62em}
.article a{color:var(--violet-700); text-decoration:underline; text-underline-offset:3px}
.meta-line{font-size:.85rem; color:var(--muted-2); padding-bottom:1.5rem; border-bottom:1px solid var(--sand-2); margin-bottom:2rem}
.legal .article .lead{text-align:start}

/* ---------- Footer (light) ---------- */
.footer{background:var(--sand); color:var(--ink-2); padding-block:clamp(3rem,6vw,4.5rem) 2rem; margin-top:0}
.footer a{color:var(--ink-2); transition:color .2s}
.footer a:hover{color:var(--ink)}
.footer-grid{display:grid; grid-template-columns:1.5fr repeat(4,1fr); gap:clamp(1.5rem,3vw,2.5rem)}
@media (max-width:1000px){ .footer-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:520px){ .footer-grid{grid-template-columns:1fr} }
.footer h3{font-family:var(--font-sans); color:var(--ink); font-size:.95rem; font-weight:600; margin-bottom:1rem}
.footer ul{display:grid; gap:.6rem; font-size:.92rem}
.footer ul a{color:var(--muted)}
.footer-brand img{height:44px; margin-bottom:1rem}
.footer-brand p{font-size:.92rem; color:var(--muted); max-width:34ch; line-height:1.65}
/* Languages sit behind one button; the pill list only appears on demand. */
.footer-langs{margin-bottom:1.25rem}
.footer-langs summary{display:inline-flex; align-items:center; gap:.45rem; min-height:40px; padding:.35rem .9rem .35rem .75rem; border-radius:var(--r-pill);
  border:1px solid var(--sand-3); background:#fff; color:var(--ink-2); font-size:.88rem; font-weight:500; cursor:pointer; list-style:none; user-select:none; transition:background .2s,color .2s,border-color .2s}
.footer-langs summary::-webkit-details-marker{display:none}
.footer-langs summary svg{width:1.1em; height:1.1em; flex:none}
.footer-langs summary .chev{width:.75em; height:.75em; opacity:.55; transition:transform .2s var(--ease)}
.footer-langs summary:hover,.footer-langs[open] summary{background:var(--ink); color:#fff; border-color:var(--ink)}
.footer-langs[open] summary .chev{transform:rotate(180deg)}
.footer-langs ul{display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.7rem}
.footer-langs ul a{display:inline-flex; align-items:center; padding:.3rem .7rem; border-radius:var(--r-pill); border:1px solid var(--sand-3); font-size:.82rem; font-weight:500; color:var(--ink-2); background:#fff}
.footer-langs ul a[aria-current="true"]{background:var(--ink); color:#fff; border-color:var(--ink)}
.socials{display:flex; gap:.5rem; margin-top:1.25rem}
.socials a{width:38px;height:38px;border-radius:50%;background:#fff;display:grid;place-items:center;transition:background .25s,transform .25s var(--ease)}
.socials a:hover{background:var(--ink); color:#fff}
.socials svg{width:17px;height:17px;fill:currentColor}
.footer-bottom{margin-top:clamp(2.5rem,5vw,3.5rem); padding-top:1.5rem; border-top:1px solid var(--sand-3);
  display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between; align-items:center; font-size:.85rem; color:var(--muted)}
.footer-bottom .dis{max-width:62ch; font-size:.8rem}
.footer-legal{display:flex; flex-wrap:wrap; gap:1.15rem}
/* Payment marks + developer credit */
.footer-base{margin-top:1.25rem; padding-top:1.25rem; border-top:1px solid var(--sand-3); display:flex; flex-wrap:wrap; gap:.75rem 1.5rem; justify-content:space-between; align-items:center; font-size:.82rem; color:var(--muted)}
.pay{display:flex; flex-wrap:wrap; align-items:center; gap:.45rem}
.pay span{margin-inline-end:.35rem}
.pay svg{width:46px; height:31px; border:1px solid var(--sand-3); border-radius:6px; background:#fff; flex:none}
.credit a{color:var(--ink); font-weight:600; text-decoration:underline; text-underline-offset:3px}

/* ---------- Floating actions ---------- */
.fab{position:fixed; inset-inline-end:clamp(1rem,2.5vw,1.5rem); bottom:clamp(1rem,2.5vw,1.5rem); z-index:70; display:grid; gap:.55rem; justify-items:center}
.fab a,.fab button{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;border:0;cursor:pointer;box-shadow:var(--sh-3);transition:transform .25s var(--ease),box-shadow .25s}
.fab a:hover,.fab button:hover{transform:translateY(-3px)}
.fab .wa{background:#25D366; color:#fff}
.fab .call{background:var(--ink); color:#fff}
.fab .top{background:#fff; color:var(--ink); border:1px solid var(--sand-2); opacity:0; visibility:hidden; transform:translateY(8px)}
.fab .top.show{opacity:1; visibility:visible; transform:none}
.fab svg{width:22px;height:22px}
@media (max-width:560px){ .fab a,.fab button{width:46px;height:46px} .fab svg{width:20px;height:20px} }

/* ---------- Cookie banner ---------- */
.cookie{position:fixed; inset-inline:clamp(.75rem,2vw,1.5rem); bottom:clamp(.75rem,2vw,1.5rem); z-index:120; max-width:540px;
  background:#fff; border:1px solid var(--sand-2); border-radius:var(--r-lg); box-shadow:var(--sh-3); padding:clamp(1.15rem,2.4vw,1.5rem);
  transform:translateY(130%); transition:transform .5s var(--ease-out); margin-inline-end:auto}
.cookie.show{transform:none}
.cookie h2{font-family:var(--font-sans); font-size:1.05rem; font-weight:600; margin-bottom:.4rem}
.cookie p{font-size:.9rem; color:var(--muted); margin-bottom:1.1rem}
.cookie .btn-row{gap:.5rem}
.cookie-opts{display:grid; gap:.6rem; margin-bottom:1.1rem; padding-top:.25rem}
.cookie-opts[hidden]{display:none}
.cookie-opt{display:flex; align-items:center; justify-content:space-between; gap:1rem; font-size:.9rem; background:var(--sand); border-radius:var(--r-sm); padding:.7rem .9rem}
.switch{position:relative; width:44px; height:26px; flex:none}
.switch input{position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer; z-index:2}
.switch .sl{position:absolute; inset:0; background:var(--sand-3); border-radius:var(--r-pill); transition:background .25s}
.switch .sl::before{content:""; position:absolute; width:20px;height:20px;border-radius:50%;background:#fff;top:3px;inset-inline-start:3px; transition:transform .25s var(--ease); box-shadow:var(--sh-1)}
.switch input:checked + .sl{background:var(--ink)}
.switch input:checked + .sl::before{transform:translateX(18px)}
html[dir="rtl"] .switch input:checked + .sl::before{transform:translateX(-18px)}
.switch input:disabled + .sl{opacity:.55; cursor:not-allowed}

/* ---------- 404 ---------- */
.notfound{padding-block:clamp(5rem,12vw,9rem); text-align:center}
.notfound .h-display{margin-inline:auto}
.notfound .lead{margin:1.25rem auto 2rem}

/* ---------- Motion ---------- */
@keyframes fadeUp{ from{opacity:0; transform:translateY(14px)} to{opacity:1; transform:none} }
@keyframes enterDown{ from{opacity:0; transform:translateY(-10px)} to{opacity:1; transform:none} }
@keyframes enterUp{   from{opacity:0; transform:translateY(18px)}  to{opacity:1; transform:none} }
@keyframes enterPop{  from{opacity:0; transform:scale(.9)}         to{opacity:1; transform:none} }
@keyframes scan{ 0%{transform:scaleX(0)} 80%{transform:scaleX(1)} 100%{transform:scaleX(1)} }

html.js .reveal{opacity:0; transform:translateY(20px); transition:opacity .75s var(--ease-out) var(--d,0ms),transform .75s var(--ease-out) var(--d,0ms)}
html.js .reveal.in{opacity:1; transform:none}
html.js .reveal-stagger > *{opacity:0; transform:translateY(20px); transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
html.js .reveal-stagger.in > *{opacity:1; transform:none; transition-delay:calc(var(--d,0ms) + var(--i,0) * 70ms)}
/* images settle from a slight zoom while their block slides in */
html.js .reveal .media img,html.js .reveal .thumb img,html.js .reveal .bmedia img,html.js .reveal-stagger > * img{transition:transform 1.2s var(--ease-out) var(--d,0ms)}
html.js .reveal:not(.in) .media img,html.js .reveal:not(.in) .thumb img,html.js .reveal:not(.in) .bmedia img,html.js .reveal-stagger:not(.in) > * img{transform:scale(1.06)}
html.js .hero-panel img{transform:scale(1.08); will-change:transform}
html.js .reveal[data-reveal="left"]{transform:translateX(-30px)}
html.js .reveal[data-reveal="right"]{transform:translateX(30px)}
html[dir="rtl"].js .reveal[data-reveal="left"]{transform:translateX(30px)}
html[dir="rtl"].js .reveal[data-reveal="right"]{transform:translateX(-30px)}
html.js .reveal[data-reveal="zoom"]{transform:scale(.95)}
html.js .reveal[data-reveal="fade"]{transform:none}
html.js .reveal.in[data-reveal]{transform:none}

.nav{animation:enterDown .5s var(--ease-out) both}
.hero-copy > *{animation:enterUp .8s var(--ease-out) both}
.hero-copy > *:nth-child(1){animation-delay:.05s}
.hero-copy > *:nth-child(2){animation-delay:.14s}
.hero-copy > *:nth-child(3){animation-delay:.23s}
.hero-copy > *:nth-child(4){animation-delay:.32s}
.hero-panel{animation:enterUp .9s var(--ease-out) .3s both}
.hero-stat{animation:enterPop .6s var(--ease-out) .9s both}
.aidi-card{animation:enterUp .7s var(--ease-out) .7s both}
html.js .aidi-bar span{animation:scan 6.5s var(--ease) 1.2s infinite}
.fab .wa{animation:enterPop .5s var(--ease-out) 1s both}
.fab .call{animation:enterPop .5s var(--ease-out) 1.1s both}
.fab .top{transition:opacity .35s var(--ease),visibility .35s,transform .35s var(--ease)}
.stat{transition:transform .35s var(--ease)}
.stat:hover{transform:translateY(-3px)}
.footer ul a{display:inline-block; transition:transform .25s var(--ease),color .25s}
.footer ul a:hover{transform:translateX(3px)}
html[dir="rtl"] .footer ul a:hover{transform:translateX(-3px)}

/* page enter / leave */
html.js body{animation:pageIn .45s var(--ease-out) both}
html.js.page-out body{animation:pageOut .18s ease forwards}
@keyframes pageIn{ from{opacity:0} to{opacity:1} }
@keyframes pageOut{ to{opacity:0} }

/* kicker glides into place as its block reveals */
.section-head .kicker,.sec-title .kicker{transition:letter-spacing .6s var(--ease-out),opacity .6s}
html.js .reveal:not(.in) .kicker{letter-spacing:.2em; opacity:0}

/* hover micro-interactions */
.card{transition:background .3s var(--ease),transform .35s var(--ease),box-shadow .35s var(--ease)}
.card:hover{transform:translateY(-4px); box-shadow:var(--sh-2)}
.card .ic{transition:transform .35s var(--ease),background .3s}
.card:hover .ic{transform:scale(1.08) rotate(-4deg)}
.spec,.pill{transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .25s}
.spec:hover{transform:translateY(-3px); box-shadow:var(--sh-1)}
.pill:hover{transform:translateY(-2px)}
.mcard,.bcard,.vidcard{transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.mcard:hover,.bcard:hover,.vidcard:hover{transform:translateY(-5px); box-shadow:var(--sh-3)}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(1px)}
.link-arrow{position:relative}
.link-arrow::after{content:""; position:absolute; inset-inline-start:0; bottom:-2px; width:100%; height:1.5px; background:currentColor; transform:scaleX(0); transform-origin:0 50%; transition:transform .35s var(--ease-out)}
html[dir="rtl"] .link-arrow::after{transform-origin:100% 50%}
.link-arrow:hover::after{transform:scaleX(1)}
.related li a,.toc a{display:inline-block; transition:transform .25s var(--ease),color .25s}
.related li a:hover,.toc a:hover{transform:translateX(4px)}
html[dir="rtl"] .related li a:hover,html[dir="rtl"] .toc a:hover{transform:translateX(-4px)}
.acc summary{transition:background .25s}
.acc summary:hover{background:var(--sand)}
.frow .media img{transition:transform .9s var(--ease)}
.frow .media:hover img{transform:scale(1.04)}

@media (prefers-reduced-motion:reduce){
  html.js body,html.js.page-out body{animation:none !important; opacity:1 !important}
  html.js .reveal img,html.js .reveal-stagger > * img,html.js .hero-panel img,html.js .reveal .kicker{transform:none !important; opacity:1 !important; letter-spacing:inherit}
  *,*::before,*::after{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important}
  .reveal,.reveal-stagger > *{opacity:1 !important; transform:none !important}
  .nav,.hero-copy > *,.hero-panel,.hero-stat,.aidi-card,.fab .wa,.fab .call{animation:none !important; opacity:1 !important; transform:none !important}
  .aidi-bar span{animation:none !important; transform:scaleX(1)}
  .marquee-track,.strip-track,.tasks-list ul{animation:none !important}
  .marquee,.strip{mask-image:none; -webkit-mask-image:none; overflow-x:auto}
  .marquee-track,.strip-track{width:auto}
  .tasks-list{height:auto; mask-image:none; -webkit-mask-image:none}
  .tasks-list ul > li:nth-child(n+9){display:none}
}

/* ---------- Print ---------- */
@media print{
  .nav,.announce,.fab,.cookie,.footer,.cta-panel,.drawer,.tasks{display:none !important}
  body{color:#000; background:#fff}
  .section{padding-block:1rem}
}

/* ---------- Articles ---------- */
.art-meta{display:inline-flex; flex-wrap:wrap; align-items:center; gap:.6rem; font-size:.85rem; color:var(--muted-2)}
.art-meta .dot{width:4px;height:4px;border-radius:50%;background:var(--muted-2);opacity:.6}
.art-head .art-meta{justify-content:center; margin-top:1.1rem}
.art-hero{margin:0 auto; max-width:920px; border-radius:var(--r-xl); overflow:hidden; aspect-ratio:16/9; background:var(--sand-2)}
.art-hero img{width:100%; height:100%; object-fit:cover; display:block}
.art-card .art-cat{font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.08em; color:var(--violet-700)}
.art-card .art-meta{margin-top:.15rem}
.toc .toc-cta{margin-top:1.1rem; width:100%; justify-content:center}
.article .acc{margin-bottom:2.5rem}
.article .acc summary{padding:1rem 0; font-size:1.05rem}
.author-card{display:flex; gap:1.1rem; align-items:center; background:var(--sand); border-radius:var(--r-lg); padding:1.25rem 1.4rem; margin:0 0 2rem}
.author-card .av{width:64px;height:64px;border-radius:50%;overflow:hidden;flex:none;background:var(--sand-2)}
.author-card .av img{width:100%;height:100%;object-fit:cover;display:block}
.author-card .k{display:block; font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color:var(--muted-2)}
.author-card strong{font-size:1.05rem; color:var(--ink)}
.author-card p{margin:.2rem 0 0; font-size:.9rem; max-width:none}
.art-cta{background:var(--dark); color:#fff; border-radius:var(--r-xl); padding:clamp(1.5rem,3vw,2.25rem)}
.art-cta .h3{color:#fff}
.art-cta p{color:rgba(255,255,255,.78); max-width:none; margin:.6rem 0 1.25rem}
.art-cta .btn-ghost{color:#fff; border-color:rgba(255,255,255,.35)}
.art-cta .btn-ghost:hover{background:rgba(255,255,255,.1)}

/* ==========================================================================
   Phones & small screens
   The layout above is fluid, so this block only fixes what genuinely breaks
   on a handset: notch/home-indicator insets, tap targets that fell under
   44px, and the eight-language menu, which needs the drawer rather than a
   cramped dropdown.
   ========================================================================== */

/* ---------- Safe areas (iPhone notch + home indicator) ----------
   The pages ship `viewport-fit=cover`, so anything pinned to an edge has to
   pay the inset back or it lands under the system UI. */
:root{
  --sa-t:env(safe-area-inset-top,0px);   --sa-b:env(safe-area-inset-bottom,0px);
  --sa-l:env(safe-area-inset-left,0px);  --sa-r:env(safe-area-inset-right,0px);
}
.topbar .wrap,.nav .wrap,.footer .wrap{
  padding-inline-start:max(var(--pad),var(--sa-l));
  padding-inline-end:max(var(--pad),var(--sa-r));
  width:100%; max-width:calc(var(--wrap) + var(--pad) * 2);
}
.drawer{padding-inline:max(var(--pad),var(--sa-l)) max(var(--pad),var(--sa-r));
        padding-bottom:calc(3rem + var(--sa-b))}
.fab{bottom:calc(clamp(1rem,2.5vw,1.75rem) + var(--sa-b));
     inset-inline-end:calc(clamp(1rem,2.5vw,1.75rem) + var(--sa-r));
     transition:opacity .3s var(--ease), visibility .3s}
.cookie{bottom:calc(clamp(.75rem,2vw,1.5rem) + var(--sa-b))}
.skip{inset-inline-start:max(1rem,var(--sa-l))}

/* The consent bar spans the full width of a phone and sits on top of the
   floating buttons; step them aside while it is on screen. */
@media (max-width:640px){
  body.cookie-open .fab{opacity:0; visibility:hidden}
}

/* ---------- Language menu ----------
   Eight languages in a header dropdown is unusable on a phone. The drawer
   already carries a roomier grid, so the header menu steps aside there. */
@media (max-width:1100px){
  .langmenu{display:none}
  .nav-actions .btn-book{display:none}
}

/* ---------- Tap targets ----------
   WCAG 2.2 target size: the top-bar numbers were 22px tall and the footer
   links 25px. Both are primary actions on a phone. */
@media (max-width:900px){
  /* Announcement bar: the two branch numbers are the most-tapped links on a phone. */
  .announce .wrap,.topbar .wrap{min-height:48px}
  .announce-phones,.topbar-phones{gap:.35rem}
  .announce a,.topbar a{min-height:44px; padding-inline:.6rem; border-radius:var(--r-sm)}
  /* Compact buttons still have to be tappable: cookie bar, bento cards, cards. */
  .btn-sm{min-height:44px}
  .burger{width:44px; height:44px}
  .brand{min-height:44px}
  .lang-grid a{min-height:44px}
  .footer ul a{display:inline-flex; align-items:center; min-height:44px}
  .footer-legal a{display:inline-flex; align-items:center; min-height:44px}
  .socials a{width:44px; height:44px}
  .toc a{display:flex; align-items:center; min-height:44px}
  .crumbs a,.crumbs span[aria-current]{display:inline-flex; align-items:center; min-height:36px}
  .cookie p a{display:inline-block; padding-block:.55rem}
  .drawer .sub a{min-height:44px; display:flex; align-items:center}
}

/* ---------- Hero ----------
   Keep the headline from eating the first screen, so the booking button and
   the phone numbers stay reachable without scrolling. */
@media (max-width:640px){
  .hero{padding-block:2.5rem 2.75rem}
  .hero .h-display{font-size:clamp(1.85rem,1.2rem + 2.8vw,2.35rem); line-height:1.2; max-width:none}
  /* `html[dir="rtl"] .h-display` outranks `.hero .h-display`, so the RTL size
     has to be restated at matching specificity or Arabic/Urdu keep the desktop scale. */
  html[dir="rtl"] .hero .h-display{font-size:clamp(1.95rem,1.3rem + 2.6vw,2.5rem); line-height:1.4; max-width:none}
  .hero h1{margin-bottom:1rem}
  .hero .lead{font-size:1.02rem; margin-bottom:.85rem}
  .hero-note{font-size:.88rem; margin-bottom:1.35rem}
  .hero-phones{margin-top:1.25rem; gap:.5rem}
  .hero-grid{gap:1.75rem}
  .hero .btn-row{gap:.6rem}
  .hero .btn-row .btn{flex:1 1 100%}
}
/* Phones held sideways have very little height — drop the vertical rhythm. */
@media (max-height:520px) and (orientation:landscape){
  .hero{padding-block:1.75rem}
  .hero-media{display:none}
  .section{padding-block:2.5rem}
  .tasks .wrap{min-height:0}
}

/* ---------- Narrow phones (iPhone SE / small Androids) ---------- */
@media (max-width:380px){
  :root{--pad:1rem}
  .stats{grid-template-columns:1fr}
  .specs{grid-template-columns:1fr}
  .btn{padding-inline:1.15rem; font-size:.94rem}
  .btn-lg{padding-inline:1.3rem}
  .btn-row{gap:.55rem}
  .btn-row .btn{flex:1 1 100%}
  .topbar{font-size:.8rem}
  .topbar-phones{gap:.15rem}
  .brand img{height:34px}
  .lang-grid{grid-template-columns:1fr}
  .footer-bottom{font-size:.8rem}
}

/* ---------- At-a-glance facts (answer-engine block) ---------- */
.glance-wrap .glance-title{margin-bottom:.9rem; color:var(--muted); font-weight:600; font-size:.95rem; letter-spacing:.02em; text-transform:uppercase}
.glance{margin:0}
.glance .spec{display:flex; flex-direction:column-reverse; justify-content:flex-end}
.glance .v{font-size:1.15rem; line-height:1.35; overflow-wrap:anywhere}
.glance .k{margin:0 0 .2rem}
.section--alt .glance .spec{background:#fff}
@media (max-width:1100px){ .glance{grid-template-columns:repeat(3,1fr)} }
@media (max-width:760px){ .glance{grid-template-columns:repeat(2,1fr)} }
@media (max-width:420px){ .glance{grid-template-columns:1fr} }

/* ---------- Related pages ---------- */
.related{border-top:1px solid var(--sand-3); padding-top:2rem}
.related h2{margin-bottom:1rem}
.related ul{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,1fr); gap:.75rem}
.related li{background:var(--sand); border-radius:var(--r); padding:1rem 1.15rem}
.related li a{display:inline-flex; align-items:center; gap:.35rem; font-weight:600; color:var(--ink)}
.related li a svg{width:1em; height:1em}
[dir="rtl"] .related li a svg{transform:scaleX(-1)}
.related li p{margin:.35rem 0 0; font-size:.88rem; color:var(--muted); line-height:1.5}
@media (max-width:1000px){ .related ul{grid-template-columns:repeat(3,1fr)} }
@media (max-width:760px){ .related ul{grid-template-columns:repeat(2,1fr)} }
@media (max-width:480px){ .related ul{grid-template-columns:1fr} }

/* ---------- Research page ---------- */
.specs--3{grid-template-columns:repeat(3,1fr)}
@media (max-width:760px){ .specs--3{grid-template-columns:repeat(2,1fr)} }
.pubs{display:grid; gap:1rem}
.pub{background:#fff; border:1px solid var(--sand-2); border-radius:var(--r-lg); padding:clamp(1.4rem,2.6vw,2rem)}
.pub-top{display:flex; align-items:center; justify-content:space-between; gap:.75rem; flex-wrap:wrap; margin-bottom:.9rem}
.pub-year{font-family:var(--font-serif); font-size:1.6rem; line-height:1; color:var(--violet-700)}
.pub-tags{display:flex; gap:.4rem; flex-wrap:wrap}
.pub-tag{display:inline-flex; align-items:center; padding:.3rem .7rem; border-radius:var(--r-pill); background:var(--sand); font-size:.78rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted)}
.pub-tag--first{background:var(--green-100); color:var(--green-600)}
.pub-title{margin-bottom:.6rem; text-align:start}
[dir="rtl"] .pub-title,[dir="rtl"] .pub-authors{text-align:left}
.pub-authors{font-size:.88rem; color:var(--muted); line-height:1.55; margin-bottom:1rem}
.pub-authors strong{color:var(--ink)}
.pub-lbl{font-weight:600; color:var(--ink-2)}
.pub-summary{color:var(--ink-2); margin-bottom:1rem}
.pub-meta{display:flex; flex-wrap:wrap; gap:.6rem 2rem; margin:0 0 1.2rem; padding-top:1rem; border-top:1px solid var(--sand-2)}
.pub-meta div{min-width:0}
.pub-meta dt{font-size:.75rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--muted-2)}
.pub-meta dd{font-size:.93rem; color:var(--ink-2); margin:0}
.pub-meta a{color:var(--violet-700); text-decoration:underline; text-underline-offset:3px; word-break:break-all}
.pub-links{margin-top:.25rem}
.pills a.pill:hover{background:var(--sand); border-color:var(--sand-3); color:var(--ink)}
.pub-note{font-size:.9rem; margin-top:1.5rem}

/* ==========================================================================
   Accessibility panel + modes (classes live on <html>, persisted in localStorage)
   ========================================================================== */
.fab .a11y-btn{background:var(--violet); color:#fff; animation:enterPop .5s var(--ease-out) .9s both}
.fab .a11y-btn[aria-expanded="true"]{background:var(--violet-700)}
.a11y{position:fixed; inset-inline-end:clamp(1rem,2.5vw,1.5rem); bottom:clamp(1rem,2.5vw,1.5rem); z-index:125;
  width:min(340px, calc(100vw - 2rem)); max-height:calc(100vh - 2rem); overflow:auto; background:#fff; color:var(--ink);
  border:1px solid var(--sand-2); border-radius:var(--r-lg); box-shadow:var(--sh-3); padding:1.1rem 1.15rem 1rem;
  font-size:.95rem; line-height:1.4}
.a11y[hidden]{display:none}
.a11y-head{display:flex; align-items:center; justify-content:space-between; gap:.75rem; margin-bottom:.9rem}
.a11y-head h2{font-family:var(--font-sans); font-size:1.05rem; font-weight:600; display:flex; align-items:center; gap:.5rem; letter-spacing:0; line-height:1.3}
.a11y-head h2 svg{width:22px; height:22px; color:var(--violet)}
.a11y-x{width:36px; height:36px; border-radius:50%; border:1px solid var(--sand-2); background:var(--sand); font-size:1.4rem; line-height:1; cursor:pointer; display:grid; place-items:center}
.a11y-lbl{display:block; font-weight:600; font-size:.85rem; color:var(--muted); margin-bottom:.4rem}
.a11y-font-ctl{display:flex; align-items:center; gap:.4rem; flex-wrap:wrap}
.a11y-font-ctl button{min-width:44px; min-height:44px; border-radius:var(--r-sm); border:1px solid var(--sand-3); background:var(--sand); cursor:pointer; font-weight:600; font-size:1.05rem; padding:0 .6rem}
.a11y-font-ctl button:hover{background:var(--sand-2)}
.a11y-font-ctl sup{font-size:.7em}
.a11y-font-ctl output{min-width:3.6rem; text-align:center; font-weight:600; font-variant-numeric:tabular-nums}
.a11y-font-ctl .a11y-font-reset{font-size:.85rem; font-weight:500; margin-inline-start:auto}
.a11y-list{display:grid; gap:.35rem; margin-block:1rem}
.a11y-tog{display:flex; align-items:center; gap:.7rem; width:100%; min-height:44px; padding:.45rem .6rem; border:1px solid transparent; border-radius:var(--r-sm); background:transparent; cursor:pointer; text-align:start}
.a11y-tog:hover{background:var(--sand)}
.a11y-tog[aria-checked="true"]{background:var(--violet-50); border-color:var(--violet-100)}
.a11y-sw{flex:none; width:38px; height:22px; border-radius:999px; background:var(--sand-3); position:relative; transition:background .2s}
.a11y-sw::after{content:""; position:absolute; top:3px; inset-inline-start:3px; width:16px; height:16px; border-radius:50%; background:#fff; transition:transform .2s}
.a11y-tog[aria-checked="true"] .a11y-sw{background:var(--violet)}
.a11y-tog[aria-checked="true"] .a11y-sw::after{transform:translateX(16px)}
html[dir="rtl"] .a11y-tog[aria-checked="true"] .a11y-sw::after{transform:translateX(-16px)}
.a11y-read{width:100%; margin-bottom:.75rem}
.a11y-read[aria-pressed="true"]{background:var(--violet-700)}
.a11y-foot{display:flex; align-items:center; justify-content:space-between; gap:.6rem; flex-wrap:wrap}
.a11y-foot a{font-size:.85rem; text-decoration:underline; text-underline-offset:3px; color:var(--violet-700)}
.a11y-live{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
body.a11y-open .fab .top{display:none}

/* --- Colour-blind mode: Okabe-Ito safe palette, shapes and underlines carry meaning --- */
html.a11y-cvd{
  --violet:#0072B2; --violet-600:#005A8E; --violet-700:#003F66; --violet-100:#D6E9F7; --violet-50:#EDF5FC;
  --cyan:#56B4E9;   --cyan-600:#2A8CC7;   --cyan-100:#DDF0FB;
  --green:#E69F00;  --green-600:#B57C00;  --green-100:#FFF0CC;
  --accent:#FFD97A; --accent-2:#FFCB4D;
  --grad:linear-gradient(120deg,#0072B2 0%,#56B4E9 55%,#E69F00 110%)}
html.a11y-cvd main a:not(.btn),html.a11y-cvd .footer a{text-decoration:underline; text-underline-offset:3px}
html.a11y-cvd .btn-primary{outline:2px solid #000; outline-offset:-2px}

/* --- High contrast (low vision): black on white, thick borders, no soft greys --- */
html.a11y-contrast{
  --ink:#000; --ink-2:#000; --muted:#000; --muted-2:#222; --bg:#fff; --sand:#fff; --sand-2:#f2f2f2; --sand-3:#000;
  --line:#000; --line-2:#000; --violet:#3B1A6E; --violet-600:#2C1254; --violet-700:#1F0C3D; --violet-100:#fff; --violet-50:#fff;
  --cyan:#004B7A; --cyan-600:#003859; --cyan-100:#fff; --green:#1F5E14; --green-600:#164410; --green-100:#fff;
  --accent:#FFE600; --accent-2:#FFD400; --accent-ink:#000; --dark:#000; --dark-2:#111;
  --sh-1:none; --sh-2:none; --sh-3:0 0 0 2px #000; --grad:#000}
html.a11y-contrast body{background:#fff; color:#000}
html.a11y-contrast .card,html.a11y-contrast .a11y,html.a11y-contrast .cookie,html.a11y-contrast .nav,html.a11y-contrast .drawer,
html.a11y-contrast .footer{border:2px solid #000}
html.a11y-contrast .btn{border:2px solid #000}
html.a11y-contrast .btn-primary,html.a11y-contrast .fab .call{background:#000; color:#fff}
html.a11y-contrast .btn-accent{background:#FFE600; color:#000}
html.a11y-contrast main a:not(.btn),html.a11y-contrast .footer a{text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:2px}
html.a11y-contrast .gradient-text{background:none; color:#000; -webkit-text-fill-color:#000}
html.a11y-contrast h1 em,html.a11y-contrast h2 em,html.a11y-contrast h3 em{color:#000; text-decoration:underline}
html.a11y-contrast :focus-visible{outline:4px solid #000; outline-offset:3px}
html.a11y-contrast .lead,html.a11y-contrast .prose p,html.a11y-contrast .card p,html.a11y-contrast .muted{color:#000}
html.a11y-contrast img:not(.no-hc){filter:contrast(1.15)}

/* --- Inverted colours (dark): filter on the root keeps fixed elements working; media re-inverted --- */
html.a11y-invert{filter:invert(1) hue-rotate(180deg); background:#000}
html.a11y-invert img,html.a11y-invert video,html.a11y-invert iframe,html.a11y-invert .pay svg,html.a11y-invert .vidcard{filter:invert(1) hue-rotate(180deg)}

/* --- Screen-reader mode: no motion, huge focus rings, larger targets, always-visible skip link --- */
html.a11y-reader *,html.a11y-motion *,html.a11y-reader *::before,html.a11y-motion *::before,html.a11y-reader *::after,html.a11y-motion *::after{
  animation:none!important; transition:none!important; scroll-behavior:auto!important}
html.a11y-reader .reveal,html.a11y-motion .reveal,html.a11y-reader [class*="enter"],html.a11y-motion [class*="enter"]{opacity:1!important; transform:none!important; visibility:visible!important}
html.a11y-reader .reveal-stagger > *,html.a11y-motion .reveal-stagger > *,html.a11y-reader .reveal img,html.a11y-motion .reveal img,html.a11y-reader .hero-panel img,html.a11y-motion .hero-panel img,html.a11y-reader body,html.a11y-motion body{opacity:1!important; transform:none!important}
html.a11y-reader .kicker,html.a11y-motion .kicker{opacity:1!important; letter-spacing:.09em!important}
html.a11y-reader :focus-visible{outline:4px solid #000; outline-offset:4px; box-shadow:0 0 0 8px #FFE600}
html.a11y-reader .skip{top:1rem; position:sticky; display:inline-block; z-index:2000}
html.a11y-reader a,html.a11y-reader button{min-height:44px}
html.a11y-reader main a:not(.btn){text-decoration:underline; text-underline-offset:3px}
html.a11y-reader .fab .top{display:none}

/* --- Highlight links --- */
html.a11y-links main a:not(.btn),html.a11y-links .footer a,html.a11y-links .nav a:not(.btn):not(.brand){
  text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:3px; background:#FFF3B0; color:#000; border-radius:3px; box-decoration-break:clone; -webkit-box-decoration-break:clone; padding-inline:.15em}

@media (max-width:560px){ .a11y{inset-inline:.75rem; width:auto; bottom:.75rem} }

/* ---------- Standards / how we work / EU & Canada (home) ---------- */
.std .card{background:#fff}
.std .card .ic{background:var(--sand)}
.flow{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; counter-reset:none}
.flow-step{position:relative; background:var(--sand); border-radius:var(--r-lg); padding:clamp(1.4rem,2.6vw,2rem); display:flex; flex-direction:column; gap:.6rem;
  transition:background .3s var(--ease)}
.flow-step:hover{background:var(--sand-2)}
.flow-step .num{font-family:var(--font-serif); font-size:clamp(2.4rem,2rem + 1.5vw,3.4rem); line-height:1; color:var(--violet-700); letter-spacing:-.02em; margin-bottom:.4rem}
.flow-step:nth-child(2) .num{color:var(--cyan-600)} .flow-step:nth-child(3) .num{color:var(--green-600)} .flow-step:nth-child(4) .num{color:var(--violet-600)}
.flow-step .h3{font-size:clamp(1.2rem,1.1rem + .5vw,1.5rem)}
.flow-step p{color:var(--muted); font-size:.975rem}
@media (max-width:980px){ .flow{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .flow{grid-template-columns:1fr} }

.geo{position:relative; overflow:hidden; isolation:isolate; background:var(--dark); color:#fff; border-radius:var(--r-2xl);
  padding:clamp(2rem,4.5vw,3.75rem); display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(2rem,5vw,4rem); align-items:center}
.geo::before{content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(45% 70% at 100% 0%,rgba(129,95,169,.45),transparent 70%),
             radial-gradient(40% 60% at 0% 100%,rgba(17,172,228,.22),transparent 70%)}
.geo .kicker{color:var(--accent)}
.geo .h2{color:#fff; max-width:22ch}
.geo .lead{color:rgba(255,255,255,.78); margin-top:1rem}
.geo-how{color:rgba(255,255,255,.62); font-size:.95rem; margin-top:.9rem; max-width:56ch}
.geo .btn-row{margin-top:1.75rem}
.geo .btn-primary{background:var(--accent); color:var(--accent-ink)}
.geo .btn-primary:hover{background:var(--accent-2)}
.geo .btn-ghost{color:#fff; border-color:rgba(255,255,255,.28)}
.geo .btn-ghost:hover{background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.4)}
.geo-side{background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); border-radius:var(--r-xl); padding:clamp(1.4rem,3vw,2.2rem)}
.geo-globe{width:52px; height:52px; border-radius:16px; display:grid; place-items:center; background:rgba(255,255,255,.1); color:var(--accent); margin-bottom:1.1rem}
.geo-globe svg{width:26px; height:26px}
.geo-label{font-size:.85rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.62); margin-bottom:.8rem}
html[dir="rtl"] .geo-label{letter-spacing:0; text-transform:none; font-size:.95rem}
.geo-list{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:.5rem}
.geo-list li{display:inline-flex; align-items:center; gap:.4rem; padding:.42rem .85rem; border-radius:var(--r-pill); font-size:.92rem; font-weight:500;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.12); color:#fff}
.geo-list li::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--cyan)}
.geo-list li.is-ca{background:var(--accent); color:var(--accent-ink); border-color:transparent}
.geo-list li.is-ca::before{background:var(--green-600)}
.geo-more{font-size:.88rem; color:rgba(255,255,255,.55); margin-top:.9rem}
@media (max-width:900px){ .geo{grid-template-columns:1fr; border-radius:var(--r-xl)} .geo .btn-row .btn{width:100%} }

/* ---------- Footer: ask AI tools about us ---------- */
.ask-ai{margin-top:1.5rem}
.ask-ai p{font-size:.85rem; font-weight:600; color:var(--ink); margin-bottom:.6rem; max-width:none}
.ask-ai-row{display:flex; flex-wrap:wrap; gap:.5rem}
.ask-ai-row a{display:inline-flex; align-items:center; gap:.5rem; padding:.4rem .85rem .4rem .5rem; border-radius:var(--r-pill); background:#fff; border:1px solid var(--sand-3);
  font-size:.86rem; font-weight:500; color:var(--ink-2); transition:background .25s,color .25s,border-color .25s,transform .25s var(--ease)}
html[dir="rtl"] .ask-ai-row a{padding:.4rem .5rem .4rem .85rem}
.ask-ai-row .ai-logo{width:26px; height:26px; border-radius:50%; display:grid; place-items:center; background:var(--sand); color:var(--brand); flex:none}
.ask-ai-row .ai-logo svg{width:15px; height:15px}
.ask-ai-row a:hover{background:var(--brand); border-color:var(--brand); color:#fff; transform:translateY(-1px)}
.ask-ai-row a:hover .ai-logo{background:rgba(255,255,255,.2); color:#fff}