/* ==========================================================================
   Big Thum — Still Water design system
   Tokens > reset > type > layout > components > motion
   ========================================================================== */

/* ---------- Fonts (self hosted, variable) ---------- */
@font-face{font-family:"Cormorant Garamond";src:url("../fonts/cormorant-normal.woff2") format("woff2-variations"),url("../fonts/cormorant-normal.woff2") format("woff2");font-weight:300 700;font-style:normal;font-display:swap;}
@font-face{font-family:"Cormorant Garamond";src:url("../fonts/cormorant-italic.woff2") format("woff2-variations"),url("../fonts/cormorant-italic.woff2") format("woff2");font-weight:300 600;font-style:italic;font-display:swap;}
@font-face{font-family:"Jost";src:url("../fonts/jost-normal.woff2") format("woff2-variations"),url("../fonts/jost-normal.woff2") format("woff2");font-weight:300 600;font-style:normal;font-display:swap;}

/* Arabic faces. Subset to the Arabic block only, so Latin runs inside Arabic
   sentences (the brand name, phone numbers, prices) fall through to Jost and
   nothing is downloaded twice. Only fetched when a rule below asks for them,
   which is only under [dir="rtl"]. */
@font-face{font-family:"Noto Naskh Arabic";src:url("../fonts/bt-naskh-arabic.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+200C-200D,U+2010-2011,U+FD3E-FD3F,U+FDF2,U+FDFD,U+FEFF;}
@font-face{font-family:"IBM Plex Sans Arabic";src:url("../fonts/bt-plex-arabic-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+200C-200D,U+2010-2011,U+FD3E-FD3F,U+FDF2,U+FDFD,U+FEFF;}
@font-face{font-family:"IBM Plex Sans Arabic";src:url("../fonts/bt-plex-arabic-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+200C-200D,U+2010-2011,U+FD3E-FD3F,U+FDF2,U+FDFD,U+FEFF;}

/* ---------- Tokens ---------- */
:root{
  --ground:#F8F5EF;
  --ground-alt:#EFE8DC;
  --petrol:#0C2B31;
  --petrol-deep:#071D21;
  --ink:#10292E;
  --ink-soft:#4F6266;
  --champagne:#B98C4E;
  --bronze-ink:#85602F;
  --champagne-soft:#D8C09A;
  --sage:#86A07E;

  --line:rgba(16,41,46,.14);
  --line-strong:rgba(16,41,46,.26);
  --line-dark:rgba(216,192,154,.22);
  --line-dark-strong:rgba(216,192,154,.4);

  --font-display:"Cormorant Garamond",Iowan Old Style,Palatino,Georgia,serif;
  --font-ui:"Jost",Avenir Next,Segoe UI,Helvetica Neue,Arial,sans-serif;

  --wrap:1240px;
  --wrap-narrow:820px;
  --gutter:clamp(20px,5vw,56px);

  /* airy spacing scale (density 0.25) */
  --s1:8px; --s2:16px; --s3:24px; --s4:36px; --s5:52px;
  --s6:76px; --s7:clamp(72px,9vw,132px); --s8:clamp(96px,12vw,180px);

  --pill:999px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ---------- Reset (:where keeps specificity at 0 so components always win) ---------- */
:where(*,*::before,*::after){box-sizing:border-box;}
:where(html){-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
:where(body){margin:0;}
:where(h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd,ul,ol){margin:0;padding:0;}
:where(ul,ol){list-style:none;}
:where(img,picture,svg,video){display:block;max-width:100%;height:auto;}
:where(svg){fill:none;stroke:currentColor;stroke-width:1.35;width:1em;height:1em;flex:none;}
:where(a){color:inherit;text-decoration:none;}
:where(button,input,select,textarea){font:inherit;color:inherit;}
:where(table){border-collapse:collapse;width:100%;}
:where(blockquote,figure){margin:0;border:0;padding:0;}
@media (prefers-reduced-motion:reduce){:where(html){scroll-behavior:auto;}}

/* ---------- Base ---------- */
body{
  background:var(--ground);
  color:var(--ink);
  font-family:var(--font-ui);
  font-size:1.0625rem;
  font-weight:400;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:clip;
}

/* ---------- Type ---------- */
.display,h1,h2,h3,.h1,.h2,.h3{
  font-family:var(--font-display);
  font-weight:300;
  line-height:1.06;
  letter-spacing:-.005em;
  color:var(--ink);
  text-wrap:balance;
}
.h-xl{font-size:clamp(2.9rem,6.4vw,5.4rem);line-height:1.02;}
.h-lg{font-size:clamp(2.2rem,4.4vw,3.5rem);line-height:1.06;}
.h-md{font-size:clamp(1.7rem,2.8vw,2.4rem);line-height:1.1;}
.h-sm{font-size:clamp(1.3rem,1.8vw,1.6rem);line-height:1.18;font-weight:400;}
.h-xs{font-family:var(--font-ui);font-size:1.02rem;font-weight:500;line-height:1.4;letter-spacing:.005em;}
h1{font-size:clamp(2.9rem,6.4vw,5.4rem);line-height:1.02;}
h2{font-size:clamp(2.2rem,4.4vw,3.5rem);}
h3{font-size:clamp(1.3rem,1.8vw,1.6rem);font-weight:400;}
em,i{font-style:italic;line-height:1.14;padding-bottom:.04em;}

.lede{font-size:clamp(1.08rem,1.5vw,1.28rem);line-height:1.65;color:var(--ink-soft);max-width:56ch;}
.body-copy{max-width:66ch;color:var(--ink-soft);}
.body-copy p + p{margin-top:1.15em;}
.body-copy strong{color:var(--ink);font-weight:500;}
.measure{max-width:66ch;}

.eyebrow{
  font-family:var(--font-ui);
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--bronze-ink);
  display:block;
  margin-bottom:var(--s3);
}
.eyebrow::after{content:"";display:inline-block;width:28px;height:1px;background:var(--champagne);margin-inline-start:12px;vertical-align:.35em;}

/* numerals set large, inline in headings */
.figure-xl{font-family:var(--font-display);font-size:clamp(3.4rem,8vw,7rem);font-weight:300;line-height:.9;color:var(--champagne);display:inline-block;}

/* ---------- Layout ---------- */
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter);}
.wrap-narrow{width:100%;max-width:var(--wrap-narrow);margin-inline:auto;padding-inline:var(--gutter);}
.section{padding-block:var(--s7);}
.section-tight{padding-block:var(--s6);}
.stack>*+*{margin-top:var(--s3);}
.stack-lg>*+*{margin-top:var(--s5);}

.band-dark{background:var(--petrol);color:var(--ground);}
.band-dark h1,.band-dark h2,.band-dark h3,.band-dark .display{color:var(--ground);}
.band-dark .lede,.band-dark .body-copy{color:rgba(248,245,239,.74);}
.band-dark .eyebrow{color:var(--champagne-soft);}
.band-dark .eyebrow::after{background:var(--champagne-soft);}
.band-deep{background:var(--petrol-deep);color:var(--ground);}
.band-sand{background:var(--ground-alt);}

.rule{height:1px;background:var(--line);border:0;}
.band-dark .rule{background:var(--line-dark);}

/* section header: headline stacked over body, never the floating-right-paragraph split */
.section-head{max-width:70ch;}
.section-head .lede{margin-top:var(--s3);}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  font-family:var(--font-ui);font-size:.9rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;
  padding:1.05em 2.1em;border-radius:var(--pill);border:1px solid transparent;
  cursor:pointer;text-align:center;line-height:1;
  transition:background-color .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease),transform .35s var(--ease);
}
.btn:focus-visible{outline:2px solid var(--champagne);outline-offset:3px;}
.btn-primary{background:var(--champagne);color:var(--petrol-deep);}
.btn-primary:hover{background:#a87c42;}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--line-strong);}
.btn-ghost:hover{border-color:var(--ink);background:rgba(16,41,46,.04);}
.band-dark .btn-ghost,.band-deep .btn-ghost,.hero .btn-ghost,.page-hero .btn-ghost{color:var(--ground);border-color:var(--line-dark-strong);}
.band-dark .btn-ghost:hover,.band-deep .btn-ghost:hover,.hero .btn-ghost:hover,.page-hero .btn-ghost:hover{border-color:var(--champagne-soft);background:rgba(216,192,154,.09);}
.btn-solid{background:var(--petrol);color:var(--ground);}
.btn-solid:hover{background:var(--petrol-deep);}
.btn-sm{padding:.85em 1.6em;font-size:.78rem;}
.btn svg{width:1.1em;height:1.1em;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;}

/* text link with underline that grows */
.link-line{
  display:inline-flex;align-items:center;gap:.5em;
  font-family:var(--font-ui);font-size:.82rem;font-weight:500;letter-spacing:.13em;text-transform:uppercase;
  color:var(--bronze-ink);padding-bottom:.35em;position:relative;max-width:100%;
}
.link-line::after{content:"";position:absolute;inset-inline-start:0;bottom:0;height:1px;width:100%;background:var(--champagne);transform:scaleX(.34);transform-origin:left;transition:transform .45s var(--ease);}
.link-line:hover::after{transform:scaleX(1);}
.band-dark .link-line{color:var(--champagne-soft);}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:60;background:rgba(248,245,239,.9);backdrop-filter:saturate(140%) blur(14px);border-bottom:1px solid var(--line);}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);min-height:82px;}
.brand{display:flex;align-items:center;flex:none;}
.brand picture{display:block;}
.brand img{width:172px;height:auto;}
.nav{display:flex;align-items:center;gap:var(--s4);}
.nav a{font-family:var(--font-ui);font-size:.86rem;font-weight:400;letter-spacing:.07em;color:var(--ink);white-space:nowrap;padding-block:.4em;position:relative;}
.nav a::after{content:"";position:absolute;inset-inline:0;bottom:0;height:1px;background:var(--champagne);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease);}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1);}
.nav-item{position:relative;}
.nav-toggle{background:none;border:0;padding:.4em 0;display:inline-flex;align-items:center;gap:.4em;font-family:var(--font-ui);font-size:.86rem;letter-spacing:.07em;cursor:pointer;}
.nav-toggle svg{width:.66em;height:.66em;fill:none;stroke:currentColor;stroke-width:2.2;transition:transform .35s var(--ease);}
.nav-item[data-open="true"] .nav-toggle svg{transform:rotate(180deg);}
.mega{
  position:absolute;top:calc(100% + 18px);left:50%;transform:translateX(-50%) translateY(-6px);
  background:var(--ground);border:1px solid var(--line);padding:var(--s4);
  min-width:min(660px,86vw);opacity:0;visibility:hidden;transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s;
  box-shadow:0 24px 60px -30px rgba(12,43,49,.4);
}
.nav-item[data-open="true"] .mega{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.mega-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2) var(--s4);}
.mega-grid a{font-size:.85rem;color:var(--ink-soft);letter-spacing:0;padding-block:.3em;}
.mega-grid a:hover{color:var(--ink);}
.mega-head{font-family:var(--font-ui);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--bronze-ink);margin-bottom:var(--s2);}
.mega-foot{margin-top:var(--s4);padding-top:var(--s3);border-top:1px solid var(--line);display:flex;gap:var(--s4);flex-wrap:wrap;}
.header-cta{display:flex;align-items:center;gap:var(--s2);flex:none;}
.burger{display:none;background:none;border:1px solid var(--line-strong);border-radius:var(--pill);width:46px;height:46px;align-items:center;justify-content:center;cursor:pointer;}
.burger span{display:block;width:17px;height:1px;background:var(--ink);position:relative;transition:background .2s;}
.burger span::before,.burger span::after{content:"";position:absolute;inset-inline-start:0;width:17px;height:1px;background:var(--ink);transition:transform .35s var(--ease);}
.burger span::before{top:-5px;} .burger span::after{top:5px;}
body.nav-open .burger span{background:transparent;}
body.nav-open .burger span::before{transform:translateY(5px) rotate(45deg);}
body.nav-open .burger span::after{transform:translateY(-5px) rotate(-45deg);}

/* mobile drawer */
.drawer{position:fixed;inset:0;z-index:70;background:var(--ground);transform:translateY(-100%);transition:transform .5s var(--ease);overflow-y:auto;display:flex;flex-direction:column;}
body.nav-open .drawer{transform:translateY(0);}
.drawer-inner{padding:var(--s3) var(--gutter) var(--s6);flex:1;}
.drawer-top{display:flex;align-items:center;justify-content:space-between;min-height:82px;}
.drawer nav{margin-top:var(--s4);}
.drawer nav>ul>li{border-top:1px solid var(--line);}
.drawer nav>ul>li:last-child{border-bottom:1px solid var(--line);}
.drawer nav a,.drawer nav .acc-btn{display:flex;width:100%;align-items:center;justify-content:space-between;gap:var(--s2);padding:1.05em 0;font-family:var(--font-display);font-size:1.5rem;font-weight:400;color:var(--ink);background:none;border:0;text-align:start;cursor:pointer;}
.drawer .sub{display:none;padding-bottom:var(--s3);}
.drawer li[data-open="true"] .sub{display:block;}
.drawer .sub a{font-family:var(--font-ui);font-size:.95rem;color:var(--ink-soft);padding:.5em 0;}
.drawer .acc-btn svg{width:.5em;height:.5em;fill:none;stroke:currentColor;stroke-width:2.2;transition:transform .3s var(--ease);}
.drawer li[data-open="true"] .acc-btn svg{transform:rotate(180deg);}
.drawer-cta{display:grid;gap:var(--s2);margin-top:var(--s5);}

/* ---------- Hero ---------- */
.hero{position:relative;background:var(--petrol);color:var(--ground);overflow:hidden;}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.24fr) minmax(0,.76fr);grid-template-rows:minmax(0,1fr);gap:var(--s5);align-items:stretch;min-height:min(76vh,720px);padding-block:var(--s6);}
.hero-copy{position:relative;z-index:2;max-width:none;align-self:center;}
.hero h1{color:var(--ground);font-size:clamp(2.3rem,3.75vw,3.3rem);line-height:1.05;max-width:24ch;}
.hero .lede{color:rgba(248,245,239,.76);margin-top:var(--s3);max-width:46ch;font-size:clamp(1.02rem,1.25vw,1.15rem);line-height:1.6;}
.hero .btn-row{margin-top:var(--s4);}
.hero-accent{color:var(--champagne-soft);font-style:italic;}
/* image bleeds past the container to the viewport edge */
.hero-visual{position:relative;align-self:stretch;margin-inline-end:calc(var(--gutter) * -1);margin-block:calc(var(--s6) * -1);}
.hero-visual .slot::before{display:none;}
@media (min-width:1000px){.hero-visual{margin-inline-end:calc(50% - 50vw);}}
.hero-visual .frame{position:absolute;inset:0;}
.hero-visual .slot{position:absolute;inset:0;}
.hero-visual img{width:100%;height:100%;object-fit:cover;}
.hero-scrim{position:absolute;inset:0;background:linear-gradient(90deg,var(--petrol) 0%,rgba(12,43,49,.5) 42%,rgba(12,43,49,0) 78%);}

/* trust strip sits below the hero, never inside it */
.trust-strip{border-top:1px solid var(--line-dark);background:var(--petrol);}
.trust-strip ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));}
.trust-strip li{padding:var(--s4) var(--s3);border-inline-start:1px solid var(--line-dark);display:flex;align-items:center;gap:.75em;color:rgba(248,245,239,.8);font-size:.76rem;letter-spacing:.07em;text-transform:uppercase;line-height:1.35;}
.trust-strip li:first-child{border-inline-start:0;padding-inline-start:0;}
.trust-strip svg{width:20px;height:20px;flex:none;stroke:var(--champagne-soft);fill:none;stroke-width:1.2;}

/* ---------- Image slots (premium placeholder until real photography lands) ---------- */
.slot{position:relative;overflow:hidden;background:
   radial-gradient(85% 70% at 26% 14%, rgba(216,192,154,.34), transparent 58%),
   radial-gradient(80% 75% at 84% 86%, rgba(134,160,126,.30), transparent 60%),
   radial-gradient(120% 120% at 50% 50%, transparent 40%, rgba(7,29,33,.55) 100%),
   linear-gradient(152deg,#1B4B53 0%,#123940 42%,#082227 100%);
}
.slot::after{content:"";position:absolute;inset:0;opacity:.9;background-image:
   repeating-linear-gradient(115deg, rgba(216,192,154,.10) 0 1px, transparent 1px 38px);}
.slot::before{content:"";position:absolute;inset:14px;border:1px solid rgba(216,192,154,.16);pointer-events:none;z-index:1;}
.slot-light{background:
   radial-gradient(90% 80% at 18% 10%, rgba(185,140,78,.26), transparent 58%),
   radial-gradient(85% 80% at 85% 90%, rgba(134,160,126,.28), transparent 60%),
   linear-gradient(150deg,#F5EFE4 0%,#EBE2D3 55%,#DED2BE 100%);}
.slot-light::after{background-image:repeating-linear-gradient(115deg, rgba(16,41,46,.06) 0 1px, transparent 1px 38px);opacity:1;}
.slot-light::before{border-color:rgba(133,96,47,.20);}
.slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.slot-mark{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(42%,190px);opacity:.30;z-index:1;}
.slot-mark svg{width:100%;height:auto;stroke:var(--champagne-soft);fill:none;stroke-width:.8;}
.slot-light .slot-mark svg{stroke:var(--bronze-ink);}
.ratio-4-5{aspect-ratio:4/5;} .ratio-3-4{aspect-ratio:3/4;} .ratio-1-1{aspect-ratio:1/1;}
.ratio-16-9{aspect-ratio:16/9;} .ratio-3-2{aspect-ratio:3/2;} .ratio-2-1{aspect-ratio:2/1;}

/* ---------- Editorial split (used sparingly, max 2 in a row) ---------- */
.split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s6);align-items:center;}
.split-wide{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);}
.split-rev>*:first-child{order:2;}

/* ---------- Pillars (asymmetric bento, not three identical cards) ---------- */
.pillars{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:var(--s5);align-items:stretch;}
.pillar-feature{position:relative;min-height:520px;display:flex;flex-direction:column;justify-content:flex-end;padding:var(--s5);color:var(--ground);}
.pillar-feature .slot{position:absolute;inset:0;}
.pillar-feature::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(7,29,33,.97) 0%,rgba(7,29,33,.96) 54%,rgba(7,29,33,.66) 70%,rgba(7,29,33,.2) 100%);pointer-events:none;}
.pillar-feature .pf-body{position:relative;z-index:2;max-width:36ch;}
.pillar-feature h3{color:var(--ground);}
.pillar-feature p{color:rgba(248,245,239,.76);margin-top:var(--s2);}
.pillar-list{display:flex;flex-direction:column;justify-content:space-between;}
.pillar{padding-block:var(--s4);border-top:1px solid var(--line);display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s3);align-items:start;}
.pillar:first-child{border-top:0;padding-top:0;}
.pillar-ico{width:44px;height:44px;border:1px solid var(--line);border-radius:var(--pill);display:grid;place-items:center;flex:none;}
.pillar-ico svg{width:20px;height:20px;stroke:var(--champagne);fill:none;stroke-width:1.2;}
.pillar h3{margin-bottom:.35em;}
.pillar p{color:var(--ink-soft);font-size:.98rem;}

/* ---------- Treatment grid (varied cells, not a uniform card wall) ---------- */
.treat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5) var(--s4);}
.treat{display:flex;flex-direction:column;}
.treat .slot{margin-bottom:var(--s3);transition:transform 1.1s var(--ease);}
.treat a.treat-media{display:block;overflow:hidden;}
.treat a.treat-media:hover .slot{transform:scale(1.035);}
.treat h3{margin-bottom:.4em;}
.treat h3 a:hover{color:var(--bronze-ink);}
.treat p{color:var(--ink-soft);font-size:.95rem;margin-bottom:var(--s3);flex:1;}
.treat-price{font-family:var(--font-ui);font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;color:var(--bronze-ink);margin-bottom:var(--s2);}
.treat-actions{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap;}
/* the first cell spans two columns for rhythm */
.treat-grid.featured .treat:first-child{grid-column:span 2;}
.treat-grid.featured .treat:first-child .slot{aspect-ratio:2/1;}

/* ---------- Locations ---------- */
.loc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line-dark);}
.loc{position:relative;min-height:440px;display:flex;flex-direction:column;justify-content:flex-end;padding:var(--s5) var(--s4);color:var(--ground);overflow:hidden;background:var(--petrol);}
.loc .slot{position:absolute;inset:0;transition:transform 1.2s var(--ease);}
.loc::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(7,29,33,.97) 0%,rgba(7,29,33,.94) 45%,rgba(7,29,33,.6) 70%,rgba(7,29,33,.15) 100%);pointer-events:none;}
.loc:hover .slot{transform:scale(1.05);}
.loc-body{position:relative;z-index:2;}
.loc h3{font-size:clamp(2rem,3vw,2.7rem);color:var(--ground);line-height:1;}
.loc p{color:rgba(248,245,239,.72);font-size:.93rem;margin-top:var(--s2);max-width:30ch;}
.loc .link-line{margin-top:var(--s3);}

/* ---------- Steps (horizontal timeline on a hairline) ---------- */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s4);position:relative;}
.step{padding-top:var(--s4);border-top:1px solid var(--line);}
.band-dark .step{border-top-color:var(--line-dark);}
.step-n{font-family:var(--font-display);font-size:2.6rem;line-height:1;color:var(--bronze-ink);display:block;margin-bottom:var(--s2);}
.step h3{font-size:1.25rem;font-weight:400;margin-bottom:.45em;}
.step p{font-size:.95rem;color:var(--ink-soft);}
.band-dark .step p{color:rgba(248,245,239,.7);}

/* ---------- Value list (hairline table, no cards) ---------- */
.value-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--s6);}
.value{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s3);padding-block:var(--s4);border-top:1px solid var(--line);align-items:start;}
.band-dark .value{border-top-color:var(--line-dark);}
.value-ico{width:36px;height:36px;display:grid;place-items:center;flex:none;}
.value-ico svg{width:25px;height:25px;stroke:var(--champagne);fill:none;stroke-width:1.3;}
.value h3{font-size:1.22rem;font-weight:400;margin-bottom:.3em;}
.value p{font-size:.94rem;color:var(--ink-soft);}
.band-dark .value p{color:rgba(248,245,239,.7);}

/* ---------- Quote ---------- */
.tst-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:var(--s5);align-items:end;margin-bottom:var(--s6);}
.tst-head>div:last-child{justify-self:end;text-align:end;}
.tst-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4);}
.tst{border:1px solid var(--line);padding:var(--s5);background:var(--ground-alt);display:flex;flex-direction:column;}
.tst.is-sample{background:transparent;border-style:dashed;border-color:var(--line-strong);}
.tst .quote-mark{font-size:3rem;margin-bottom:var(--s1);}
.tst p{font-family:var(--font-display);font-size:1.12rem;line-height:1.42;font-weight:300;color:var(--ink);max-width:none;flex:1;}
.tst cite{display:block;margin-top:var(--s4);font-family:var(--font-ui);font-style:normal;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--bronze-ink);}
.quote{max-width:none;}
.quote-mark{font-family:var(--font-display);font-size:5rem;line-height:.6;color:var(--bronze-ink);display:block;}
.quote p{font-family:var(--font-display);font-size:clamp(1.35rem,2.1vw,1.85rem);line-height:1.3;font-weight:300;max-width:30ch;}
.quote cite{display:block;margin-top:var(--s3);font-family:var(--font-ui);font-style:normal;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);}

/* placeholder marker: visible to the owner, honest to the visitor */
.placeholder{border:1px dashed var(--line-strong);padding:var(--s4);background:rgba(185,140,78,.05);}
.placeholder-tag{display:inline-block;font-family:var(--font-ui);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--bronze-ink);border:1px solid var(--champagne);border-radius:var(--pill);padding:.35em 1em;margin-bottom:var(--s3);}
.band-dark .placeholder{border-color:var(--line-dark-strong);background:rgba(216,192,154,.05);}
.band-dark .placeholder-tag{color:var(--champagne-soft);border-color:var(--champagne-soft);}

/* ---------- Price moment ---------- */
.price-moment{text-align:center;max-width:44ch;margin-inline:auto;}
.price-line{font-family:var(--font-display);font-size:clamp(2.4rem,5vw,4rem);line-height:1.05;font-weight:300;}
.price-line .amt{color:var(--bronze-ink);}
.price-note{margin-top:var(--s3);font-size:.95rem;color:var(--ink-soft);}
.band-dark .price-note{color:rgba(248,245,239,.7);}
.incl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4);margin-top:var(--s6);text-align:start;}
.incl li{border-top:1px solid var(--line);padding-top:var(--s3);font-size:.95rem;color:var(--ink-soft);}
.band-dark .incl li{border-top-color:var(--line-dark);color:rgba(248,245,239,.72);}
.incl b{display:block;color:var(--ink);font-weight:500;font-size:1rem;margin-bottom:.3em;}
.band-dark .incl b{color:var(--ground);}

/* ---------- FAQ accordion ---------- */
.faq{border-top:1px solid var(--line);}
.band-dark .faq{border-top-color:var(--line-dark);}
.faq-item{border-bottom:1px solid var(--line);}
.band-dark .faq-item{border-bottom-color:var(--line-dark);}
.faq-q{width:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s3);
  background:none;border:0;padding:var(--s4) 0;cursor:pointer;text-align:start;
  font-family:var(--font-display);font-size:clamp(1.15rem,1.7vw,1.4rem);font-weight:400;line-height:1.3;color:var(--ink);}
.band-dark .faq-q{color:var(--ground);}
.faq-q:focus-visible{outline:2px solid var(--champagne);outline-offset:2px;}
.faq-ico{flex:none;width:22px;height:22px;position:relative;margin-top:.3em;}
.faq-ico::before,.faq-ico::after{content:"";position:absolute;background:var(--champagne);transition:transform .4s var(--ease),opacity .3s;}
.faq-ico::before{inset-inline-start:0;top:10px;width:22px;height:1px;}
.faq-ico::after{inset-inline-start:10px;top:0;width:1px;height:22px;}
.faq-item[data-open="true"] .faq-ico::after{transform:scaleY(0);opacity:0;}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s var(--ease);}
.faq-item[data-open="true"] .faq-a{grid-template-rows:1fr;}
.faq-a>div{overflow:hidden;}
.faq-a p{padding-bottom:var(--s4);max-width:70ch;color:var(--ink-soft);}
.band-dark .faq-a p{color:rgba(248,245,239,.72);}
.faq-a p+p{padding-bottom:var(--s2);}

/* ---------- Breadcrumbs ---------- */
.crumbs a{display:inline-block;padding-block:.14em;min-height:24px;}
.crumbs{font-size:.78rem;letter-spacing:.06em;color:var(--ink-soft);padding-block:var(--s3);}
.crumbs ol{display:flex;flex-wrap:wrap;gap:.5em;align-items:center;}
.crumbs li{display:flex;align-items:center;gap:.5em;}
.crumbs li+li::before{content:"/";color:var(--line-strong);}
.crumbs a:hover{color:var(--bronze-ink);}
.band-dark .crumbs,.hero .crumbs,.page-hero .crumbs{color:rgba(248,245,239,.7);}
.hero .crumbs li+li::before,.page-hero .crumbs li+li::before,.band-dark .crumbs li+li::before{color:rgba(216,192,154,.45);}
.hero .crumbs a:hover,.page-hero .crumbs a:hover,.band-dark .crumbs a:hover{color:var(--champagne-soft);}

/* ---------- Page hero (inner pages) ---------- */
.page-hero{background:var(--petrol);color:var(--ground);position:relative;overflow:hidden;}
.page-hero .wrap{position:relative;z-index:2;padding-block:var(--s6) var(--s7);}
.page-hero h1{color:var(--ground);max-width:20ch;}
.page-hero .lede{color:rgba(248,245,239,.76);margin-top:var(--s3);}
.page-hero .btn-row{margin-top:var(--s5);}
.page-hero .slot{position:absolute;inset:0;opacity:.5;}
.page-hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:var(--s6);align-items:end;}

/* ---------- Benefit cards ---------- */
.benefits{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--s6);}
.benefit{padding-block:var(--s4);border-top:1px solid var(--line);}
.benefit h3{font-size:1.06rem;font-weight:400;margin-bottom:.3em;display:flex;gap:.6em;align-items:baseline;}
.benefit h3 span{font-family:var(--font-ui);font-size:.72rem;letter-spacing:.14em;color:var(--bronze-ink);}
.benefit p{font-size:.94rem;color:var(--ink-soft);}

/* ---------- Related / chips ---------- */
.chips{display:flex;flex-wrap:wrap;gap:var(--s2);}
.chip{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:var(--pill);padding:.65em 1.25em;font-size:.85rem;color:var(--ink-soft);transition:border-color .3s var(--ease),color .3s var(--ease);}
.chip:hover{border-color:var(--champagne);color:var(--ink);}
.band-dark .chip{border-color:var(--line-dark);color:rgba(248,245,239,.78);}
.band-dark .chip:hover{border-color:var(--champagne-soft);color:var(--ground);}

/* ---------- Blog ---------- */
.post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5) var(--s4);}
.post-card .slot{margin-bottom:var(--s3);}
.post-meta{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--bronze-ink);margin-bottom:var(--s2);display:flex;gap:.8em;flex-wrap:wrap;}
.post-card h3{font-size:1.35rem;margin-bottom:.4em;}
.post-card p{font-size:.94rem;color:var(--ink-soft);}
.post-lead{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:var(--s6);align-items:center;}
.post-lead .slot{aspect-ratio:4/3;}
.article{max-width:none;}
.article-body{max-width:68ch;}
.article-body>*+*{margin-top:1.35em;}
.article-body h2{font-size:clamp(1.7rem,2.6vw,2.3rem);margin-top:1.8em;}
.article-body h3{font-size:1.35rem;margin-top:1.5em;}
.article-body p,.article-body li{color:var(--ink-soft);}
.article-body ul{list-style:none;}
.article-body ul li{position:relative;padding-inline-start:1.5em;}
.article-body ul li::before{content:"";position:absolute;inset-inline-start:0;top:.75em;width:8px;height:1px;background:var(--champagne);}
.article-body ol{counter-reset:n;}
.article-body ol li{counter-increment:n;position:relative;padding-inline-start:2em;}
.article-body ol li::before{content:counter(n);position:absolute;inset-inline-start:0;font-family:var(--font-display);color:var(--bronze-ink);}
.article-body a{color:var(--bronze-ink);border-bottom:1px solid var(--champagne);}
.article-body blockquote{border-inline-start:1px solid var(--champagne);padding-inline-start:var(--s4);font-family:var(--font-display);font-size:1.4rem;line-height:1.35;color:var(--ink);}
.article-aside{position:sticky;top:110px;align-self:start;display:flex;flex-direction:column;gap:var(--s4);max-height:calc(100vh - 130px);}
.toc{border:1px solid var(--line);padding:var(--s4);display:flex;flex-direction:column;min-height:0;}
.toc-list{min-height:0;overflow-y:auto;overscroll-behavior:contain;}
.aside-cta{flex:none;}
.toc h2{font-family:var(--font-ui);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--bronze-ink);margin-bottom:var(--s3);}
.toc a{display:block;font-size:.9rem;color:var(--ink-soft);padding:.35em 0;border-inline-start:1px solid transparent;padding-inline-start:.9em;margin-inline-start:-.9em;}
.toc a:hover{color:var(--ink);border-inline-start-color:var(--champagne);}
.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:var(--s6);align-items:start;}

/* ---------- Forms ---------- */
.form{display:grid;gap:var(--s3);}
.field{display:grid;gap:.5em;}
.field label{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);}
.field input,.field select,.field textarea{
  background:var(--ground);border:0;border-bottom:1px solid var(--line-strong);
  padding:.85em 0;font-size:1rem;color:var(--ink);border-radius:0;transition:border-color .3s var(--ease);
}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-bottom-color:var(--champagne);}
.field textarea{resize:vertical;min-height:100px;}
.field-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3);}
.form-note{font-size:.82rem;color:var(--ink-soft);}
.band-sand .field input,.band-sand .field select,.band-sand .field textarea{background:transparent;}

/* ---------- Footer ---------- */
.site-footer{background:var(--petrol-deep);color:rgba(248,245,239,.72);padding-block:var(--s7) var(--s4);}
.footer-top{display:grid;grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,1fr));gap:var(--s5);}
.site-footer picture{display:block;}
.site-footer img.f-logo{width:190px;margin-bottom:var(--s3);}
.site-footer h3{font-family:var(--font-ui);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--champagne-soft);margin-bottom:var(--s3);font-weight:500;}
.site-footer a:not(.btn){color:rgba(248,245,239,.72);font-size:.92rem;}
/* WCAG 2.2 target size: footer nav links are not inline in a sentence, so
   give them a 24px tall hit area rather than the 22px the text alone made. */
.footer-top li a:not(.btn){display:inline-block;padding-block:.14em;min-height:24px;}
.site-footer a:not(.btn):hover{color:var(--ground);}
.site-footer li+li{margin-top:.6em;}
.footer-contact li{display:flex;gap:.7em;align-items:flex-start;}
.footer-contact svg{width:16px;height:16px;stroke:var(--champagne-soft);fill:none;stroke-width:1.3;margin-top:.3em;flex:none;}
.footer-bottom{margin-top:var(--s6);padding-top:var(--s4);border-top:1px solid var(--line-dark);display:flex;justify-content:space-between;gap:var(--s3);flex-wrap:wrap;font-size:.82rem;}
.footer-bottom nav{display:flex;gap:var(--s3);flex-wrap:wrap;}

/* ---------- Mobile action bar ---------- */
.action-bar{display:none;position:fixed;inset-inline:0;bottom:0;z-index:65;background:var(--petrol-deep);border-top:1px solid var(--line-dark);}
.action-bar ul{display:grid;grid-template-columns:repeat(3,1fr);}
.action-bar a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35em;padding:.85em .5em calc(.85em + env(safe-area-inset-bottom));
  color:rgba(248,245,239,.82);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;border-inline-start:1px solid var(--line-dark);}
.action-bar li:first-child a{border-inline-start:0;}
.action-bar a.primary{background:var(--champagne);color:var(--petrol-deep);}
.action-bar svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.4;}

/* ---------- Motion (gated: subtle only, degrades to visible) ---------- */
.js .reveal{opacity:0;transform:translateY(18px);}
.js .reveal.in{opacity:1;transform:none;transition:opacity .9s var(--ease),transform .9s var(--ease);}
@media (prefers-reduced-motion:reduce){
  .js .reveal,.js .reveal.in{opacity:1!important;transform:none!important;transition:none!important;}
  .treat a.treat-media:hover .slot,.loc:hover .slot{transform:none;}
}

/* ---------- Skip link ---------- */
.skip{position:absolute;inset-inline-start:0;top:0;z-index:100;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;background:var(--champagne);color:var(--petrol-deep);padding:1em 1.5em;font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;}
.skip:focus{width:auto;height:auto;overflow:visible;clip-path:none;}

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .nav{display:none;}
  .burger{display:inline-flex;}
  .header-cta .btn{display:none;}
  .treat-grid,.post-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .tst-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .treat-grid.featured .treat:first-child{grid-column:span 2;}
  .article-layout{grid-template-columns:minmax(0,1fr);}
  .article-aside{position:static;max-height:none;}
  .toc-list{overflow-y:visible;}
}
@media (max-width:900px){
  .hero-grid{grid-template-columns:minmax(0,1fr);gap:var(--s5);min-height:0;padding-block:var(--s6);}
  /* The desktop rule bleeds the visual by -s6 top AND bottom so it fills the
     hero's full height as a side column. Stacked on mobile that top bleed
     pulled the photo up over the CTA buttons. Keep the bottom bleed only, so
     the image still meets the bottom edge of the hero cleanly. */
  .hero-visual{margin-inline:calc(var(--gutter) * -1);margin-block:0 calc(var(--s6) * -1);height:56vw;max-height:420px;position:relative;}
  .hero-copy{max-width:none;}
  .split,.pillars,.page-hero-grid,.post-lead{grid-template-columns:minmax(0,1fr);gap:var(--s5);}
  .tst-head{grid-template-columns:minmax(0,1fr);align-items:start;}
  .tst-head>div:last-child{justify-self:start;text-align:start;}
  .tst-grid{grid-template-columns:minmax(0,1fr);}
  .split-rev>*:first-child{order:0;}
  .pillar-feature{min-height:400px;}
  .loc-grid{grid-template-columns:minmax(0,1fr);}
  .loc{min-height:320px;}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s5) var(--s4);}
  .trust-strip ul{grid-template-columns:repeat(2,minmax(0,1fr));}
  .trust-strip li{border-inline-start:0;border-top:1px solid var(--line-dark);padding-inline:0;}
  .trust-strip li:nth-child(2){border-inline-start:1px solid var(--line-dark);padding-inline-start:var(--s3);}
  .trust-strip li:nth-child(4){border-inline-start:1px solid var(--line-dark);padding-inline-start:var(--s3);}
  .trust-strip li:first-child,.trust-strip li:nth-child(2){border-top:0;}
  .value-list,.benefits,.incl{grid-template-columns:minmax(0,1fr);}
  .footer-top{grid-template-columns:repeat(2,minmax(0,1fr));}
  .action-bar{display:block;}
  body{padding-bottom:72px;}
}
@media (max-width:620px){
  .treat-grid,.post-grid{grid-template-columns:minmax(0,1fr);}
  .treat-grid.featured .treat:first-child{grid-column:span 1;}
  .treat-grid.featured .treat:first-child .slot{aspect-ratio:3/2;}
  .steps,.footer-top{grid-template-columns:minmax(0,1fr);}
  .field-row{grid-template-columns:minmax(0,1fr);}
  .btn{width:100%;}
  .btn-row{flex-direction:column;align-items:stretch;}
  .hero .btn-row .btn{width:100%;}
  .mega{display:none;}
}
@media print{.site-header,.action-bar,.site-footer,.drawer{display:none!important;}}

/* ---------- Additional dark grounds (deep band, heroes) ---------- */
.band-deep h1,.band-deep h2,.band-deep h3,.band-deep h4,.band-deep .display,
.page-hero h2,.page-hero h3,.hero h2,.hero h3{color:var(--ground);}
.band-deep .lede,.band-deep .body-copy,.page-hero .body-copy{color:rgba(248,245,239,.74);}
.band-deep .eyebrow,.page-hero .eyebrow,.hero .eyebrow{color:var(--champagne-soft);}
.band-deep .eyebrow::after,.page-hero .eyebrow::after,.hero .eyebrow::after{background:var(--champagne-soft);}
.band-deep .rule,.page-hero .rule{background:var(--line-dark);}
.band-deep .link-line,.page-hero .link-line{color:var(--champagne-soft);}
.band-deep .chip,.page-hero .chip{border-color:var(--line-dark);color:rgba(248,245,239,.78);}
.band-deep .chip:hover,.page-hero .chip:hover{border-color:var(--champagne-soft);color:var(--ground);}
.band-deep .step,.page-hero .step{border-top-color:var(--line-dark);}
.band-deep .step p,.page-hero .step p{color:rgba(248,245,239,.7);}
.band-deep .value,.page-hero .value{border-top-color:var(--line-dark);}
.band-deep .value p,.page-hero .value p{color:rgba(248,245,239,.7);}
.band-deep .faq,.page-hero .faq{border-top-color:var(--line-dark);}
.band-deep .faq-item,.page-hero .faq-item{border-bottom-color:var(--line-dark);}
.band-deep .faq-q,.page-hero .faq-q{color:var(--ground);}
.band-deep .faq-a p,.page-hero .faq-a p{color:rgba(248,245,239,.72);}
.band-deep .placeholder{border-color:var(--line-dark-strong);background:rgba(216,192,154,.05);}
.band-deep .placeholder-tag{color:var(--champagne-soft);border-color:var(--champagne-soft);}
.band-deep .price-note{color:rgba(248,245,239,.7);}
.band-deep .incl li{border-top-color:var(--line-dark);color:rgba(248,245,239,.72);}
.band-deep .incl b{color:var(--ground);}
.band-deep .benefit{border-top-color:var(--line-dark);}
.band-deep .benefit p{color:rgba(248,245,239,.72);}
.band-deep .crumbs{color:rgba(248,245,239,.6);}
.band-dark .step-n,.band-deep .step-n,.page-hero .step-n{color:var(--champagne-soft);}
.band-dark .price-line .amt,.band-deep .price-line .amt,.hero .price-line .amt{color:var(--champagne-soft);}
.band-dark .benefit h3 span,.band-deep .benefit h3 span{color:var(--champagne-soft);}
.band-dark .quote-mark,.band-deep .quote-mark{color:var(--champagne-soft);}

/* ---------- Real photography ---------- */
.slot.has-photo::after,.slot.has-photo::before,.slot.has-photo .slot-mark{display:none;}
.slot.has-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.slot.fill{position:absolute;inset:0;}
/* Page hero photographs sit behind large ivory type, so they carry their own scrim. */
.page-hero>.slot{position:absolute;inset:0;opacity:1;}
.page-hero>.slot.has-photo{opacity:1;}
.page-hero::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(100deg,rgba(7,29,33,.94) 0%,rgba(7,29,33,.84) 38%,rgba(7,29,33,.62) 70%,rgba(7,29,33,.5) 100%);}
.page-hero>.slot:not(.has-photo){opacity:.5;}
.hero-visual .slot.has-photo img{object-position:center;}

/* ---------- Direct answer block (AEO / AI overview extractable) ---------- */
.answer-band{background:var(--ground-alt);}
.answer-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:var(--s5) var(--s6);align-items:start;}
.answer-block{border-inline-start:2px solid var(--champagne);padding-inline-start:var(--s4);}
.answer-text{font-family:var(--font-display);font-size:clamp(1.2rem,1.9vw,1.55rem);line-height:1.45;font-weight:400;color:var(--ink);max-width:60ch;}
.facts{display:grid;gap:0;}
.fact{display:grid;grid-template-columns:minmax(0,.42fr) minmax(0,.58fr);gap:var(--s3);padding-block:.85em;border-top:1px solid var(--line);}
.fact:first-child{border-top:0;padding-top:0;}
.fact dt{font-family:var(--font-ui);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--bronze-ink);padding-top:.2em;}
.fact dd{margin:0;font-size:.95rem;color:var(--ink-soft);}
@media (max-width:900px){
  .answer-grid{grid-template-columns:minmax(0,1fr);}
  .fact{grid-template-columns:minmax(0,1fr);gap:.2em;}
}

/* ---------- Language switch ---------- */
.lang-switch{display:inline-flex;align-items:center;justify-content:center;
  min-height:32px;min-width:44px;padding:.35em .8em;
  font-family:var(--font-ui);font-size:.8rem;font-weight:500;letter-spacing:.06em;
  color:var(--ink);border:1px solid var(--line-strong);border-radius:999px;
  transition:color .3s var(--ease),border-color .3s var(--ease),background-color .3s var(--ease);}
.lang-switch:hover{color:var(--bronze-ink);border-color:var(--champagne);}
/* The Arabic label is four characters on an otherwise English page. Pulling a
   28KB webfont for it is not worth it, so it renders in the system Arabic face.
   On Arabic pages the inherited token already points at IBM Plex Sans Arabic. */
.lang-switch[lang="ar"]{font-family:Segoe UI,Tahoma,Geeza Pro,Arial,sans-serif;letter-spacing:0;font-size:.92rem;}
[dir="rtl"] .lang-switch[lang="ar"]{font-family:var(--font-ui);}
.lang-switch-block{display:flex;width:100%;}
.drawer-cta .lang-switch{order:-1;margin-bottom:var(--s2);}
.band-dark .lang-switch,.page-hero .lang-switch{color:var(--ground);border-color:var(--line-dark-strong);}

/* ==========================================================================
   Arabic / right to left
   The sheet above is written in logical properties, so the layout mirrors on
   its own. Only three classes of thing need saying explicitly: type that has
   to breathe more, artwork that carries a direction of its own, and Latin runs
   that the bidi algorithm would otherwise reorder.
   ========================================================================== */

[dir="rtl"]{
  /* Latin sits second in both stacks: the Arabic faces carry no Latin glyphs,
     so brand names, digits and phone numbers fall through to Jost. */
  --font-display:"Noto Naskh Arabic","Jost",Georgia,serif;
  --font-ui:"IBM Plex Sans Arabic","Jost",Segoe UI,Tahoma,Arial,sans-serif;
}

/* Arabic needs more leading than Latin. The display leading here is set tight
   enough for Cormorant that Naskh ascenders and the dots below the baseline
   would collide. */
[dir="rtl"] .display,[dir="rtl"] h1,[dir="rtl"] h2,[dir="rtl"] h3,
[dir="rtl"] .h1,[dir="rtl"] .h2,[dir="rtl"] .h3{line-height:1.34;letter-spacing:0;}
[dir="rtl"] .h-xl,[dir="rtl"] h1{line-height:1.26;}
[dir="rtl"] .h-lg,[dir="rtl"] h2{line-height:1.3;}
[dir="rtl"] .h-md{line-height:1.34;}
[dir="rtl"] .h-sm,[dir="rtl"] h3,[dir="rtl"] .h-xs{line-height:1.5;}
[dir="rtl"] .figure-xl{line-height:1.12;}
[dir="rtl"] .price-line{line-height:1.4;}
[dir="rtl"] .step-n{line-height:1.25;}
[dir="rtl"] .quote-mark{line-height:.75;}
[dir="rtl"] .answer-text{line-height:1.85;}
[dir="rtl"] .tst p,[dir="rtl"] .quote p{line-height:1.8;}
[dir="rtl"] .drawer nav a,[dir="rtl"] .drawer nav .acc-btn{line-height:1.5;}
[dir="rtl"] body{line-height:1.9;}

/* Letterspacing and uppercase are Latin devices. Tracking breaks the joins
   between Arabic letters, and there is no case to raise. */
[dir="rtl"] .eyebrow,[dir="rtl"] .link-line,[dir="rtl"] .btn,[dir="rtl"] .nav a,
[dir="rtl"] .nav-toggle,[dir="rtl"] .crumbs,[dir="rtl"] .fact dt,[dir="rtl"] .h-xs,
[dir="rtl"] .trust-strip li,[dir="rtl"] .action-bar a,[dir="rtl"] .skip,
[dir="rtl"] .form label,[dir="rtl"] .mega-head,[dir="rtl"] .tag{
  letter-spacing:0;text-transform:none;}

/* Artwork that points somewhere. The chevrons point down and the burger is
   symmetric, so neither is touched; the forward arrow is the only glyph on the
   site with a direction, and it only ever appears inside .link-line. */
[dir="rtl"] .link-line svg{transform:scaleX(-1);}
[dir="rtl"] .link-line::after,[dir="rtl"] .nav a::after{transform-origin:right;}

/* Both hero scrims darken the side the headline sits on so ivory type stays
   legible over photography. Mirror the gradient with the layout or the type
   ends up on bare image. */
[dir="rtl"] .hero-scrim{background:linear-gradient(270deg,var(--petrol) 0%,rgba(12,43,49,.5) 42%,rgba(12,43,49,0) 78%);}
[dir="rtl"] .page-hero::after{background:linear-gradient(260deg,rgba(7,29,33,.94) 0%,rgba(7,29,33,.84) 38%,rgba(7,29,33,.62) 70%,rgba(7,29,33,.5) 100%);}

/* Latin inside Arabic. Without isolation the bidi algorithm reorders a phone
   number's groups and moves trailing punctuation to the wrong end. */
[dir="rtl"] .ltr,
[dir="rtl"] a[href^="tel:"],
[dir="rtl"] a[href^="mailto:"]{direction:ltr;unicode-bidi:isolate;}
[dir="rtl"] .brand,[dir="rtl"] .f-logo{direction:ltr;}

/* Form controls that browsers render in their own direction. */
[dir="rtl"] input[type="date"],[dir="rtl"] input[type="time"]{direction:ltr;text-align:start;}