/* ============================================================
   Caplan — homepage components (mobile-first). Uses tokens.css.
   Section rhythm: light (paper/surface) ~65%, garnet ~35%.
   Headings: Libre Caslon Text 400 (thin, editorial). No boxed "pillars".
   Polish pass: generous vertical rhythm, editorial eyebrows with a
   leading rule, tasteful scroll-reveal + hover micro-interaction.
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }
img { display:block; max-width:100%; }
figure { margin:0; }
em { font-style: italic; }

/* sticky-nav-aware anchor scrolling */
html { scroll-behavior:smooth; }
:where(section[id]) { scroll-margin-top:88px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } }

/* keyboard focus — visible, on-brand */
:where(a, button, input, [tabindex]):focus-visible {
  outline:2px solid var(--garnet-link); outline-offset:3px; border-radius:4px;
}
.section--garnet :where(a, button, input):focus-visible { outline-color:var(--surface); }

/* ---------- scroll reveal (progressive enhancement) ----------
   Hidden state applies ONLY when JS is on AND motion is allowed.
   No-JS or reduced-motion users always see content. */
/* Scroll-reveal is disabled on all viewports — content is shown immediately,
   with no fade-up on scroll. (The JS still tags [data-reveal]/.in, but with no
   CSS hiding rule it has no visual effect.) */

/* ---------- shared layout ---------- */
.section { padding-block: clamp(4.5rem, 2.5rem + 9vw, 9rem); }
.section-inner { max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); }

/* editorial eyebrow: small-caps label preceded by a hairline rule */
.eyebrow {
  display:inline-flex; align-items:center; gap:.85em;
  font-family:var(--font-sans); font-size:var(--step--1); font-weight:600;
  letter-spacing:.18em; text-transform:uppercase; color:var(--garnet-link);
  margin:0 0 1.6em;
}
.eyebrow::before {
  content:""; width:2.25em; height:1px; flex:none;
  background:currentColor; opacity:.55;
}
.measure { max-width:60ch; }

/* ---------- buttons ---------- */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:.55em;
  font-family:var(--font-sans); font-weight:400; font-size:var(--step--1);
  line-height:1; padding:1.05em 1.7em; border-radius:4px; border:1px solid transparent;
  cursor:pointer; text-decoration:none; min-height:50px;
  transition:background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .25s ease;
}
.btn-primary { background:var(--garnet); color:var(--surface); box-shadow:0 1px 2px rgba(30,27,23,.08); }
.btn-primary:hover { background:var(--garnet-hover); color:var(--surface); transform:translateY(-1px); box-shadow:0 8px 22px -10px rgba(98,13,29,.55); }
.btn-secondary { background:transparent; border-color:var(--border-strong); color:var(--ink); }
.btn-secondary:hover { background:var(--surface); border-color:var(--ink); transform:translateY(-1px); }
.btn:active { transform:translateY(0); }
.btn-block { width:100%; }
/* centred call-to-action block placed at the end of a content section */
.sec-cta { display:flex; justify-content:center; margin-top:clamp(1.9rem, 1.2rem + 2vw, 3rem); }

/* ---------- top navigation ---------- */
.nav {
  position:sticky; top:0; z-index:50;
  background:color-mix(in srgb, var(--paper) 88%, transparent);
  backdrop-filter:saturate(1.1) blur(12px);
  border-bottom:1px solid var(--line);
}
.nav-inner {
  max-width:var(--container); margin-inline:auto; padding:.65rem var(--gutter);
  display:flex; align-items:center; gap:1.5rem; min-height:66px;
}
.brand { display:flex; align-items:center; gap:.7rem; text-decoration:none; color:var(--ink); margin-right:auto; }
.brand img { width:50px; height:50px; flex:none; }
.brand-name { font-family:var(--font-wordmark); font-weight:300; font-size:1.85rem; line-height:.8; letter-spacing:.16em; text-transform:uppercase; }
.brand-sub { display:block; font-family:var(--font-sans); font-weight:500; font-size:10.5px; line-height:1; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); margin-top:0; }
.nav-links { display:none; gap:1.9rem; align-items:center; }
.nav-links a {
  position:relative; font-family:var(--font-sans); font-size:var(--step--1);
  color:var(--ink); text-decoration:none; padding-block:.4em;
}
.nav-links a::after {
  content:""; position:absolute; left:0; right:0; bottom:0; height:1.5px;
  background:var(--garnet-link); transform:scaleX(0); transform-origin:left;
  transition:transform .3s cubic-bezier(.16,1,.3,1);
}
.nav-links a:hover { color:var(--garnet-link); }
.nav-links a:hover::after { transform:scaleX(1); }
.nav-cta { display:none; }
.nav-wa {
  display:inline-flex; align-items:center; justify-content:center; flex:none;
  width:40px; height:40px; border-radius:50%;
  color:var(--garnet); background:var(--garnet-tint);
  transition:background .2s ease, color .2s ease;
}
.nav-wa svg { width:21px; height:21px; }
.nav-wa:hover { background:var(--garnet); color:var(--surface); }
/* header social icons — only on wide screens, so the nav never crowds */
.nav-soc { display:none; }
@media (min-width:1200px){ .nav-soc { display:flex; align-items:center; gap:.45rem; } }
/* mobile-menu social icons */
.mm-soc { display:flex; justify-content:center; gap:.8rem; margin-top:1.15rem; }
.mm-soc a {
  display:inline-flex; align-items:center; justify-content:center;
  width:44px; height:44px; border-radius:50%;
  background:var(--garnet-tint); color:var(--garnet);
  transition:background .2s ease, color .2s ease;
}
.mm-soc a:hover, .mm-soc a:active { background:var(--garnet); color:var(--surface); }
.mm-soc svg { width:22px; height:22px; }
/* floating WhatsApp button (every page) */
.wa-fab {
  position:fixed; z-index:120;
  right:clamp(14px, 10px + 1vw, 28px); bottom:clamp(14px, 10px + 1vw, 28px);
  width:56px; height:56px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--garnet); color:var(--surface);
  box-shadow:0 12px 30px -10px rgba(98,13,29,.6), 0 2px 6px rgba(30,27,23,.18);
  transition:transform .2s ease, box-shadow .25s ease, background-color .2s ease;
}
.wa-fab:hover { background:var(--garnet-hover); transform:translateY(-2px);
  box-shadow:0 16px 36px -12px rgba(98,13,29,.7), 0 3px 8px rgba(30,27,23,.2); }
.wa-fab svg { width:28px; height:28px; }
@media print { .wa-fab { display:none; } }
.footer .wa-link, .footer .soc-link { display:flex; align-items:center; gap:.5em; }
.footer .wa-link svg, .footer .soc-link svg { width:18px; height:18px; flex:none; }
.nav-toggle {
  display:inline-flex; flex-direction:column; gap:5px; width:44px; height:44px;
  align-items:center; justify-content:center; background:none; border:none; cursor:pointer; margin-right:calc(var(--gutter) * -.35);
}
.nav-toggle span { width:22px; height:2px; background:var(--ink); display:block; }
.mobile-menu { display:none; border-top:1px solid var(--line); background:var(--surface);
  max-height:calc(100svh - 64px); overflow-y:auto; -webkit-overflow-scrolling:touch;
  padding:.35rem var(--gutter) 1.6rem; }
.mobile-menu.open { display:block; }

@media (min-width:1000px) {
  .nav-links { display:flex; }
  .nav-cta { display:inline-flex; }
  .nav-toggle { display:none; }
  .mobile-menu { display:none !important; }
}

/* ---------- HERO (full-bleed video, left-aligned) ---------- */
.hero { position:relative; min-height:90svh; display:grid; place-items:center; overflow:hidden; background:var(--paper); isolation:isolate; }
.hero-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; z-index:0; display:block; }
.hero-scrim {
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background-image:
    linear-gradient(90deg, color-mix(in srgb, var(--paper) 84%, transparent) 0%, color-mix(in srgb, var(--paper) 55%, transparent) 40%, color-mix(in srgb, var(--paper) 18%, transparent) 70%, transparent 88%);
}
.hero-content {
  position:relative; z-index:2; text-align:left; color:var(--ink);
  width:100%; max-width:var(--container); margin-inline:auto;
  padding:clamp(5rem, 3rem + 10vw, 9rem) var(--gutter);
  display:flex; flex-direction:column; align-items:flex-start;
}
.hero-content .display { color:var(--ink); max-width:16ch; margin:0 0 .55em; text-shadow:0 0 22px color-mix(in srgb, var(--paper) 70%, transparent); }
.hero-content .display em { color:var(--garnet); }
.hero-lead {
  font-size:var(--step-1); line-height:1.55; max-width:44ch; margin:0 0 2.5rem;
  color:var(--ink); text-shadow:0 0 16px color-mix(in srgb, var(--paper) 80%, transparent);
}

.hero-actions { display:flex; flex-wrap:wrap; gap:.9rem; }

@media (min-width:900px) { .hero { min-height:100svh; } }
/* mobile: portrait video has the cell at the top → drop the text to the lower half */
@media (max-width:600px) {
  .hero { min-height:calc(100svh - 30px); align-items:end; }
  .hero-bg { top:-45px; bottom:auto; height:calc(100% + 45px); object-position:center top; }
  .hero-content { padding-block:1.5rem clamp(2.5rem, 1.5rem + 6vw, 4rem); transform:translateY(10px); }
  .hero-scrim {
    background-image:
      linear-gradient(180deg, transparent 0%, transparent 30%, color-mix(in srgb, var(--paper) 66%, transparent) 58%, color-mix(in srgb, var(--paper) 92%, transparent) 100%);
  }
}

/* ---------- duotone image utility (warms a photo toward garnet, keeps it legible) ---------- */
.duo { position:relative; overflow:hidden; border-radius:4px; background:var(--garnet); }
.duo img { width:100%; height:100%; object-fit:cover; display:block;
  filter:saturate(.8) contrast(1.03); }
.duo::after { content:""; position:absolute; inset:0; pointer-events:none;
  background:var(--garnet); mix-blend-mode:multiply; opacity:.2; }

/* ---------- grain texture for flat garnet sections (printed, not digital) ---------- */
.garnet-grain { position:relative; isolation:isolate; }
.garnet-grain::before {
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.05;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
}
.garnet-grain > * { position:relative; z-index:1; }

/* ---------- full-bleed image band (credibility, replaces the old trust strip) ---------- */
.imageband { position:relative; width:100%; overflow:hidden; background:var(--garnet-tint);
  min-height:clamp(360px, 22rem + 16vw, 620px); display:flex; }
.imageband img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.imageband-scrim { position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 28%, color-mix(in srgb, var(--ink) 84%, var(--garnet)) 100%); }
.imageband-note { position:relative; align-self:flex-end; width:100%;
  max-width:var(--container); margin-inline:auto;
  padding:0 var(--gutter) clamp(2rem, 1rem + 3vw, 3.75rem); color:var(--surface); }
.imageband-note .eyebrow { color:color-mix(in srgb, var(--surface) 86%, var(--garnet)); margin-bottom:1em; }
.imageband-note p:not(.eyebrow) { margin:0; max-width:54ch; font-size:var(--step-1); line-height:1.55;
  color:var(--surface); }

/* ---------- approach intro: text + duotone lab image inside the garnet section ---------- */
.approach-intro { display:grid; grid-template-columns:1fr; gap:clamp(2.25rem, 1.5rem + 3vw, 3.5rem); align-items:center; }
.approach-intro .block-head { margin-bottom:0; max-width:none; }
.approach-figure { aspect-ratio:16/10; }
.approach-figure img { object-position:center 42%; }
@media (min-width:880px){
  .approach-intro { grid-template-columns:1.05fr .95fr; gap:clamp(3rem, 2rem + 3vw, 5rem); }
  .approach-figure { aspect-ratio:1/1; }
}

/* ---------- statement band: full-bleed treatment photo + editorial pull-quote ---------- */
.statement { position:relative; overflow:hidden; background:var(--garnet);
  min-height:clamp(440px, 26rem + 16vw, 720px); display:grid; place-items:center; }
.statement-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 30%; }
.statement-scrim { position:absolute; inset:0;
  background:linear-gradient(180deg, color-mix(in srgb, var(--ink) 60%, transparent) 0%, color-mix(in srgb, var(--garnet) 88%, #000) 100%); opacity:.84; }
.statement-inner { position:relative; z-index:1; max-width:60ch; margin-inline:auto; text-align:center;
  padding:clamp(3.5rem, 2rem + 7vw, 7rem) var(--gutter); color:var(--surface); }
.statement-inner h2 { color:var(--surface); margin:0 0 .6em;
  text-shadow:0 3px 20px rgba(98,13,29,.75), 0 1px 4px rgba(18,4,9,.55); }
.statement-inner p { font-size:var(--step-1); line-height:1.6; margin:0 auto; max-width:58ch;
  color:var(--surface); text-shadow:0 2px 16px rgba(98,13,29,.65), 0 1px 3px rgba(18,4,9,.45); }

/* ---------- evidence: registry of patient outcomes (bars) beside the image ---------- */
.evidence-grid { display:grid; grid-template-columns:1fr; gap:clamp(2.25rem, 1.5rem + 3vw, 4rem); align-items:start; }
.evidence-figure { aspect-ratio:1/1; }
.evidence-body { min-width:0; }
.evidence-body .block-head { max-width:none; margin-bottom:clamp(1.85rem, 1rem + 2vw, 2.75rem); }
@media (min-width:601px){ .evidence-figure { aspect-ratio:4/3; } }
@media (min-width:880px){
  .evidence-grid { grid-template-columns:1fr 1.05fr; gap:clamp(3rem, 2rem + 3vw, 5rem); align-items:stretch; }
  .evidence-figure { aspect-ratio:auto; }
  .evidence-figure img { position:absolute; inset:0; object-position:center; }
}
.registry-note { font-family:var(--font-sans); font-size:var(--step--1); letter-spacing:.04em;
  color:color-mix(in srgb, var(--surface) 82%, var(--garnet)); margin:0 0 1.75rem; }
.registry-highlight { margin-top:clamp(1.75rem, 1rem + 2vw, 2.5rem); display:flex; align-items:center;
  gap:clamp(1rem, .7rem + 1vw, 1.5rem); padding:clamp(1.1rem, .8rem + 1vw, 1.6rem) clamp(1.25rem, .9rem + 1.2vw, 1.9rem);
  background:color-mix(in srgb, var(--surface) 9%, transparent);
  border:1px solid color-mix(in srgb, var(--surface) 24%, transparent); border-radius:6px; }
.rh-v { font-family:var(--font-serif); font-size:var(--step-3); line-height:1; color:var(--surface); flex:none; }
.rh-l { font-family:var(--font-sans); font-size:var(--step--1); line-height:1.45; margin:0;
  color:color-mix(in srgb, var(--surface) 84%, var(--garnet)); }
.bars { list-style:none; margin:0; padding:0; display:grid; gap:clamp(1.1rem, .8rem + .8vw, 1.6rem); }
.bar-head { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; margin-bottom:.55em; }
.bar-label { font-family:var(--font-sans); font-size:var(--step-0); line-height:1.3; color:var(--surface); }
.bar-val { font-family:var(--font-serif); font-size:var(--step-1); line-height:1; color:var(--surface); flex:none; }
.bar-track { height:7px; border-radius:99px; background:color-mix(in srgb, var(--surface) 16%, transparent); overflow:hidden; }
.bar-fill { display:block; height:100%; width:var(--v); border-radius:99px; background:var(--surface); }
@media (prefers-reduced-motion: no-preference){
  .js .bar-fill { width:0; transition:width 1.2s cubic-bezier(.16,1,.3,1); }
  .js .bar.in .bar-fill { width:var(--v); }
}

/* ---------- stories: portrait image + horizontal review carousel ---------- */
.stories-grid { display:grid; grid-template-columns:1fr; gap:clamp(2.5rem, 1.5rem + 4vw, 4.5rem); align-items:start; }
.stories-figure { aspect-ratio:1/1; }
.stories-figure img { object-position:center; }
.stories-body { min-width:0; }
.stories-head { display:flex; align-items:flex-end; justify-content:space-between; gap:1.5rem; }
.stories-head .block-head { margin-bottom:0; }
.stories-nav { display:none; gap:.6rem; flex:none; }
.stories-arrow {
  width:48px; height:48px; flex:none; display:inline-flex; align-items:center; justify-content:center;
  background:transparent; border:1px solid color-mix(in srgb, var(--surface) 38%, transparent);
  color:var(--surface); border-radius:4px; cursor:pointer; font-size:1.4rem; line-height:1;
  font-family:var(--font-serif); transition:background-color .2s ease, border-color .2s ease, opacity .2s ease;
}
.stories-arrow:hover { background:color-mix(in srgb, var(--surface) 12%, transparent); border-color:var(--surface); }
.stories-arrow:disabled { opacity:.35; cursor:default; }
@media (min-width:760px){ .stories-nav { display:flex; } }
@media (min-width:900px){
  .stories-grid { grid-template-columns:.78fr 1.22fr; gap:clamp(3rem, 2rem + 3vw, 5rem); align-items:stretch; }
  .stories-figure { aspect-ratio:auto; }
  .stories-figure img { position:absolute; inset:0; object-position:center; }
}

/* ---------- section heads ---------- */
.block-head { max-width:48ch; margin-bottom:clamp(3rem,1.5rem + 5vw,5rem); }
.block-head h2 { margin:0 0 .6em; }
.block-head p { color:var(--text-soft); font-size:var(--step-1); margin:0; line-height:1.6; }
.section--garnet .block-head p { color:color-mix(in srgb, var(--surface) 84%, var(--garnet)); }

/* ---------- conditions: icon cards grouped by adults / children ---------- */
.cond-grid {
  list-style:none; margin:clamp(2rem, 1.2rem + 2.5vw, 3.3rem) 0 0; padding:0;
  display:grid; grid-template-columns:repeat(2, 1fr); align-items:stretch;
  gap:clamp(.6rem, .4rem + .9vw, 1.1rem);
}
@media (min-width:620px){ .cond-grid { grid-template-columns:repeat(3, 1fr); } }
@media (min-width:1000px){ .cond-grid { grid-template-columns:repeat(5, 1fr); } }

.cond-head {
  grid-column:1 / -1; margin:0; padding-bottom:clamp(.55rem, .4rem + .4vw, .85rem);
  border-bottom:1px solid var(--border-strong);
  display:flex; align-items:baseline; flex-wrap:wrap; gap:.2rem .7rem;
}
.cond-head:not(:first-child) { margin-top:clamp(1.3rem, .8rem + 1.6vw, 2.4rem); }
.cond-head .g-main { font-family:var(--font-serif); font-weight:500; font-size:var(--step-1); text-transform:uppercase; letter-spacing:.05em; color:var(--ink); line-height:1.1; }
.cond-head .g-sub { font-size:var(--step--1); color:var(--muted); }

.cond-card {
  display:flex; flex-direction:column; align-items:center; text-align:center;
  gap:clamp(.6rem, .45rem + .5vw, .9rem);
  padding:clamp(1.15rem, .85rem + 1.1vw, 1.7rem) clamp(.7rem, .4rem + 1vw, 1.2rem);
  background:var(--surface); border:1px solid var(--line); border-radius:6px;
  transition:border-color .25s ease, box-shadow .25s ease;
}
.cond-card:hover { border-color:var(--border-strong); box-shadow:0 16px 34px -24px rgba(30,27,23,.45); }
.cond-card--link { position:relative; }
.cond-card--link:hover { cursor:pointer; }
.cond-stretch { position:absolute; inset:0; z-index:1; border-radius:inherit; }
/* Arrow marks a card that links to a full condition page — always shown, on any
   .cond-card--link, so future condition pages get it automatically. */
.cond-card--link .cond-name::after { content:"\2192"; font-size:.8em; margin-left:.45em; color:var(--garnet-link); opacity:1; transform:translateX(0); transition:transform .2s ease, color .2s ease; display:inline-block; }
.cond-card--link:hover .cond-name::after { transform:translateX(3px); color:var(--garnet); }
.cond-ic {
  display:grid; place-items:center; flex:none;
  width:clamp(2.7rem, 2.2rem + 1.6vw, 3.4rem); aspect-ratio:1;
  border-radius:50%; background:var(--garnet-tint); color:var(--garnet);
  transition:background .25s ease, color .25s ease;
}
.cond-ic svg { width:54%; height:54%; }
.cond-card:hover .cond-ic { background:var(--garnet); color:var(--surface); }
.cond-name { font-family:var(--font-serif); font-weight:500; font-size:var(--step-0); letter-spacing:.025em; color:var(--ink); line-height:1.1; }
.cond-full { font-size:var(--step--1); color:var(--muted); line-height:1.3; max-width:18ch; }

/* ---------- approach: programme components as an accordion ---------- */
.programme {
  list-style:none; padding:0;
  margin-top:clamp(3rem,1.5rem + 3.5vw,4.5rem);
  border-top:1px solid color-mix(in srgb, var(--surface) 24%, transparent);
}
.prog-row { border-bottom:1px solid color-mix(in srgb, var(--surface) 20%, transparent); scroll-margin-top:clamp(78px, 70px + 1vw, 92px); }
.prog-head {
  width:100%; display:grid; grid-template-columns:auto 1fr auto; align-items:center;
  gap:clamp(1.1rem,.7rem + 1.2vw,2rem);
  padding:clamp(1.4rem,1rem + 1.4vw,2rem) clamp(0rem,-.5rem + 1vw,1rem);
  background:none; border:0; cursor:pointer; text-align:left; color:var(--surface); font:inherit;
}
.prog-head .n {
  font-family:var(--font-serif); font-size:var(--step-3); line-height:.9;
  color:color-mix(in srgb, var(--surface) 50%, var(--garnet)); transition:color .3s ease;
}
.prog-head .name { font-family:var(--font-serif); font-size:var(--step-2); line-height:1.2; color:var(--surface); }
.prog-head:hover .n, .prog-row.open .prog-head .n { color:color-mix(in srgb, var(--surface) 72%, var(--garnet)); }
.prog-ic { position:relative; width:20px; height:20px; flex:none; align-self:center; opacity:.85; }
.prog-ic::before, .prog-ic::after { content:""; position:absolute; background:var(--surface); }
.prog-ic::before { left:1px; right:1px; top:50%; height:1.5px; transform:translateY(-50%); }
.prog-ic::after { top:1px; bottom:1px; left:50%; width:1.5px; transform:translateX(-50%); transition:opacity .3s ease, transform .3s ease; }
.prog-row.open .prog-ic::after { opacity:0; transform:translateX(-50%) rotate(90deg); }
.prog-panel { display:grid; grid-template-rows:0fr; transition:grid-template-rows .42s cubic-bezier(.16,1,.3,1); }
.prog-row.open .prog-panel { grid-template-rows:1fr; }
.prog-panel-in { overflow:hidden; }
.prog-body {
  display:grid; grid-template-columns:1fr; align-items:center;
  gap:clamp(1.1rem, .7rem + 1.5vw, 2rem);
  padding:clamp(.3rem, .1rem + .3vw, .6rem) clamp(0rem,-.5rem + 1vw,1rem) clamp(1.6rem,1rem + 1.5vw,2.2rem);
}
.prog-row .desc {
  font-family:var(--font-sans); font-size:var(--step-0); line-height:1.62; margin:0; max-width:58ch;
  color:color-mix(in srgb, var(--surface) 82%, var(--garnet));
}
.prog-figure {
  position:relative; margin:0; overflow:hidden; border-radius:6px; aspect-ratio:3/2;
  border:1px solid color-mix(in srgb, var(--surface) 14%, transparent);
  box-shadow:0 26px 54px -30px rgba(0,0,0,.65);
}
.prog-figure img { width:100%; height:100%; object-fit:cover; display:block; }
@media (min-width:760px){
  /* image height tracks the text height, so opening a panel never grows it taller than the copy */
  .prog-body { grid-template-columns:1fr clamp(15rem, 22vw, 19rem); gap:clamp(1.8rem, 1rem + 2.5vw, 3.2rem); align-items:stretch; }
  .prog-figure { aspect-ratio:auto; }
  .prog-figure img { position:absolute; inset:0; }
}
@media (prefers-reduced-motion: reduce){ .prog-panel { transition:none; } }

/* ---------- journey: numbered sequence ---------- */
.steps { display:grid; grid-template-columns:1fr; gap:clamp(2rem,1rem + 2.5vw,3rem); }
.step { padding-top:1.75rem; border-top:2px solid var(--garnet); }
.step .n { font-family:var(--font-serif); color:var(--garnet); font-size:var(--step-3); line-height:1; }
.step h3 { font-size:var(--step-1); margin:.6em 0 .5em; }
.step p { color:var(--text-soft); font-size:var(--step--1); line-height:1.65; margin:0; }
@media (min-width:760px){ .steps { grid-template-columns:repeat(4,1fr); gap:clamp(2rem,1rem + 2vw,3.25rem); } }

/* ---------- evidence stats (garnet) ---------- */
.stats { display:grid; grid-template-columns:1fr; gap:clamp(2.25rem,1rem + 3.5vw,4rem); margin-top:clamp(3rem,1.5rem + 3.5vw,4.5rem); }
.stat { border-top:1px solid color-mix(in srgb, var(--surface) 32%, transparent); padding-top:1.5rem; }
.stat .v { font-family:var(--font-serif); font-size:var(--step-4); line-height:1; display:block; color:var(--surface); }
.stat .v small { font-size:.45em; }
.stat .l { font-size:var(--step--1); line-height:1.65; color:color-mix(in srgb, var(--surface) 84%, var(--garnet)); margin:1em 0 0; max-width:34ch; }
@media (min-width:760px){ .stats { grid-template-columns:repeat(3,1fr); gap:clamp(2.75rem,1rem + 3.5vw,5rem); } }

/* ---------- image + text split ---------- */
.split { display:grid; grid-template-columns:1fr; gap:clamp(2.25rem,1.5rem + 4vw,5rem); align-items:stretch; }
.split-media { position:relative; overflow:hidden; border-radius:4px; aspect-ratio:4/3; }
.split-media img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.split-text h2 { margin:0 0 .6em; }
.split-text p { color:var(--text-soft); margin:0 0 1em; line-height:1.65; }
/* readable split text on garnet sections (dark grey body would vanish on garnet) */
.section--garnet .split-text h2, .section--garnet .split-text h3 { color:var(--surface); }
.section--garnet .split-text p { color:color-mix(in srgb, var(--surface) 84%, var(--garnet)); }
.section--garnet .split-list li { color:color-mix(in srgb, var(--surface) 84%, var(--garnet)); border-color:color-mix(in srgb, var(--surface) 22%, transparent); }
.section--garnet .split-list li::before { background:var(--surface); }
.split-list { list-style:none; padding:0; margin:1.6em 0 0; }
.split-list li {
  font-family:var(--font-sans); font-size:var(--step-0); line-height:1.55;
  padding:.85em 0 .85em 1.8em; position:relative; border-top:1px solid var(--line);
}
.split-list li:first-child { border-top:none; }
.split-list li::before { content:""; position:absolute; left:0; top:1.35em; width:.5em; height:.5em; border-radius:50%; background:var(--garnet); }
@media (min-width:900px){ .split { grid-template-columns:1fr 1fr; gap:clamp(3rem,2rem + 3.5vw,6.5rem); } .split--rev .split-media { order:2; } .split-media { aspect-ratio:auto; } }
/* mobile: render the split image in-flow with aspect-ratio on the <img> itself.
   A div with aspect-ratio whose only child is position:absolute can collapse to
   zero height in WebKit/Safari (no in-flow content to size the box), so the image
   never paints. Putting the ratio on the replaced <img> element is WebKit-safe. */
@media (max-width:899px){
  .split-media { aspect-ratio:auto; }
  .split-media img { position:static; width:100%; height:auto; aspect-ratio:4/3; }
}

/* ---------- the building: swipe gallery on phone, photo mosaic on desktop ---------- */
/* desktop: editorial two-column header so the heading + text fill the row width
   instead of leaving the right half empty */
@media (min-width:880px){
  .building .block-head {
    display:grid; grid-template-columns:1fr 1fr;
    gap:clamp(2.5rem, 1.5rem + 3vw, 5rem); align-items:end;
    max-width:none; margin-bottom:clamp(2.25rem, 1.5rem + 2vw, 3.5rem);
  }
  .building .block-head h2 { margin-bottom:0; max-width:16ch; }
  .building .block-head p { max-width:50ch; }
}
.bld-track {
  display:flex; gap:clamp(.7rem, .5rem + .7vw, 1.1rem);
  overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain; scrollbar-width:none;
  margin-inline:calc(var(--gutter) * -1);
  padding-inline:var(--gutter); scroll-padding-inline:var(--gutter);
  padding-bottom:.4rem;
}
.bld-track::-webkit-scrollbar { display:none; }
.bld-item {
  position:relative; flex:0 0 min(84%, 420px); scroll-snap-align:start;
  overflow:hidden; border-radius:4px; background:var(--surface);
  box-shadow:0 18px 40px -30px rgba(30,27,23,.45);
  transition:box-shadow .35s ease;
}
/* in-flow img with its own ratio (WebKit-safe, same reasoning as .split-media above) */
.bld-item img { width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; display:block;
  transition:transform .6s cubic-bezier(.16,1,.3,1); }
.bld-note {
  display:flex; align-items:center; gap:.85rem;
  margin-top:clamp(1.2rem, .9rem + 1vw, 1.9rem);
  font-family:var(--font-sans); font-size:var(--step--1); letter-spacing:.04em; color:var(--muted);
}
.bld-note::before {
  content:""; width:8px; height:8px; flex:none; transform:rotate(45deg); border-radius:1.5px;
  background:linear-gradient(135deg, var(--gold-1), var(--gold-2));
}
@media (min-width:880px){
  .bld-track {
    display:grid; grid-template-columns:1.55fr 1fr;
    overflow:visible; margin-inline:0; padding-inline:0; padding-bottom:0;
    gap:clamp(.9rem, .6rem + 1vw, 1.4rem);
  }
  .bld-item { border-radius:6px; }
  .bld-item--main { grid-row:1 / span 2; }
  /* the tall image fills the height set by the two stacked photos beside it */
  .bld-item--main img { position:absolute; inset:0; height:100%; aspect-ratio:auto; }
}
/* tasteful gallery micro-interaction — slow contained zoom, pointer devices only */
@media (min-width:880px) and (hover:hover){
  .bld-item:hover { box-shadow:0 26px 54px -28px rgba(30,27,23,.5); }
  .bld-item:hover img { transform:scale(1.035); }
}

/* ---------- Why Budapest: full-bleed photo, heading + cards top-left ---------- */
.budapest-feature {
  position:relative; isolation:isolate; overflow:hidden;
  display:flex; align-items:center;
  min-height:clamp(33rem, 25rem + 27vw, 52rem);
  padding-block:clamp(2.5rem, 1.6rem + 3.5vw, 5rem);
  padding-inline:var(--gutter);
}
.bf-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 42%; z-index:-2; }
.bf-scrim {
  position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(102deg, rgba(20,8,11,.88) 0%, rgba(20,8,11,.66) 30%, rgba(20,8,11,.24) 58%, rgba(20,8,11,0) 82%),
    linear-gradient(to bottom, rgba(20,8,11,.48) 0%, rgba(20,8,11,0) 42%, rgba(20,8,11,.34) 100%);
}
.bf-inner {
  width:100%; max-width:var(--container); margin-inline:auto;
  display:flex; flex-direction:column; align-items:flex-start;
  gap:clamp(1.7rem, 1rem + 2.4vw, 3rem);
}
.bf-head { max-width:40rem; }
.bf-head h2 { color:var(--surface); margin:0 0 .55em; text-shadow:0 1px 24px rgba(8,3,5,.4); }
.bf-head p { color:rgba(252,250,245,.92); max-width:36rem; margin:0; line-height:1.6; text-shadow:0 1px 18px rgba(8,3,5,.4); }
.bf-cards { display:grid; grid-template-columns:1fr; gap:clamp(.7rem, .4rem + 1vw, 1.1rem); width:100%; max-width:30rem; }
.bf-card {
  background:rgba(252,250,245,.94);
  border:1px solid rgba(255,255,255,.5);
  border-radius:4px;
  padding:clamp(1.05rem, .8rem + .9vw, 1.5rem);
  box-shadow:0 20px 44px -26px rgba(8,3,5,.6);
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
}
.bf-card h3 { font-size:var(--step-1); letter-spacing:.02em; color:var(--ink); margin:0 0 .4em; }
.bf-card p { font-size:var(--step--1); color:var(--text-soft); line-height:1.55; margin:0; max-width:none; }
@media (min-width:760px){
  .bf-cards { grid-template-columns:repeat(3, 1fr); max-width:64rem; gap:clamp(.9rem, .6rem + .8vw, 1.4rem); }
}
/* phone: drop the cards, show a red-dot bullet list (as before), readable over the photo */
@media (max-width:759px){
  .budapest-feature .bf-scrim {
    background:
      linear-gradient(176deg, rgba(18,7,10,.72) 0%, rgba(18,7,10,.54) 46%, rgba(18,7,10,.72) 100%),
      linear-gradient(96deg, rgba(18,7,10,.52) 0%, rgba(18,7,10,.18) 74%, rgba(18,7,10,0) 100%);
  }
  .bf-cards { display:block; max-width:34rem; }
  .bf-card {
    background:none; border:0; border-radius:0; box-shadow:none;
    -webkit-backdrop-filter:none; backdrop-filter:none;
    position:relative; padding:.9em 0 .9em 1.6em;
    border-top:1px solid rgba(252,250,245,.2);
  }
  .bf-card:first-child { border-top:0; padding-top:.2em; }
  .bf-card::before {
    content:""; position:absolute; left:0; top:1.02em;
    width:.5em; height:.5em; border-radius:50%; background:#C53149;
  }
  .bf-card:first-child::before { top:.34em; }
  .bf-card h3 { color:var(--surface); font-size:var(--step-0); letter-spacing:.01em; margin:0 0 .18em; text-shadow:0 1px 14px rgba(8,3,5,.45); }
  .bf-card p { color:rgba(252,250,245,.86); font-size:var(--step--1); line-height:1.5; text-shadow:0 1px 14px rgba(8,3,5,.45); }
}

/* ---------- GARNET section base ---------- */
.section--garnet { background:var(--garnet); color:var(--surface); }
.section--garnet .eyebrow { color:color-mix(in srgb, var(--surface) 86%, var(--garnet)); }
.section--garnet h2, .section--garnet h3 { color:var(--surface); }
.section--garnet .btn-primary { background:var(--surface); color:var(--garnet); box-shadow:0 1px 2px rgba(0,0,0,.18); }
.section--garnet .btn-primary:hover { background:#fff; box-shadow:0 10px 26px -12px rgba(0,0,0,.5); }

/* ---------- testimonials carousel (garnet) ---------- */
.stories-track {
  display:flex; gap:clamp(1.25rem, 1rem + 1.5vw, 2rem);
  margin-top:clamp(2rem, 1.5rem + 2vw, 2.75rem); padding-bottom:.5rem;
  overflow-x:auto; scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain; scrollbar-width:none;
}
.stories-track::-webkit-scrollbar { display:none; }
.stories-track:focus-visible { outline:2px solid var(--surface); outline-offset:4px; }
.quote {
  flex:0 0 min(86%, 340px); scroll-snap-align:start;
  position:relative; padding-top:2.6rem;
  border-top:1px solid color-mix(in srgb, var(--surface) 30%, transparent);
}
.quote::before {
  content:"\201C"; position:absolute; top:.02em; left:0;
  font-family:var(--font-serif); font-size:3.2em; line-height:1;
  color:color-mix(in srgb, var(--surface) 34%, var(--garnet));
}
.quote blockquote { font-family:var(--font-serif); font-size:var(--step-1); line-height:1.5; margin:0 0 1.3em; color:var(--surface); }
.quote .who { font-family:var(--font-sans); font-size:var(--step--1); line-height:1.5; color:color-mix(in srgb, var(--surface) 82%, var(--garnet)); }
@media (min-width:760px){ .quote { flex-basis:clamp(340px, 32vw, 420px); } }

/* ---------- final CTA (light bg image, centered column, text stays left) ---------- */
.cta-final { position:relative; isolation:isolate; text-align:left; padding-block:clamp(3.5rem, 2rem + 5vw, 6rem); }
.cta-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; display:block; }
.cta-scrim { position:absolute; inset:0; z-index:1; pointer-events:none;
  background-color: color-mix(in srgb, var(--paper) 56%, transparent);
  background-image: radial-gradient(95% 80% at 50% 50%, color-mix(in srgb, var(--paper) 62%, transparent) 0%, color-mix(in srgb, var(--paper) 28%, transparent) 62%, transparent 88%);
}
.cta-final .section-inner { position:relative; z-index:2; }
.cta-col { max-width:640px; margin-inline:auto; }
.cta-final h2 { max-width:none; }
.cta-final .lead-line { font-size:var(--step-1); line-height:1.55; max-width:none; margin:.9em 0 1.9rem; color:var(--ink); }
.cta-form { display:grid; grid-template-columns:1fr; gap:1rem; max-width:none; margin:0; text-align:left; }
.cta-form input {
  width:100%; padding:1.05em 1.15em; border-radius:4px; border:1px solid var(--border-strong);
  background:var(--paper); color:var(--ink);
  font-family:var(--font-sans); font-size:max(16px,1rem); transition:border-color .2s ease, background-color .2s ease;
}
.cta-form input::placeholder { color:var(--muted); }
.cta-form input:focus { outline:none; border-color:var(--garnet); background:#fff; }
.cta-form .btn { min-height:54px; }
.cta-reassure { font-size:var(--step--1); color:var(--text-soft); margin-top:1.6rem; }
@media (min-width:620px){ .cta-form { grid-template-columns:1fr 1fr; } .cta-form .span2 { grid-column:1 / -1; } }

/* ---- form card (cream, the colour of the fields) ---- */
.cta-card { padding:clamp(1.6rem, 1.1rem + 2vw, 2.6rem);
  background:var(--surface); border:1px solid var(--line); border-radius:6px;
  box-shadow:0 26px 70px -38px rgba(30,27,23,.55); }
.cta-card .cta-reassure { margin-top:1.3rem; }

/* ---- phone field with searchable country dialling code ---- */
.phone-field { display:flex; gap:.6rem; align-items:stretch; }
.ccpick { position:relative; flex:none; }
.cc-btn {
  display:flex; align-items:center; gap:.45em; padding:0 .95em; height:100%;
  border:1px solid var(--border-strong); border-radius:4px; background:var(--paper); color:var(--ink);
  font-family:var(--font-sans); font-size:max(16px,1rem); cursor:pointer; white-space:nowrap;
  transition:border-color .2s ease, background-color .2s ease;
}
.cc-btn:hover { border-color:var(--ink); }
.cc-caret { font-size:.68em; color:var(--muted); }
.cc-phone { flex:1 1 0%; min-width:0; width:auto; }
.cc-menu {
  position:absolute; z-index:30; top:calc(100% + .45rem); left:0; width:min(330px, 84vw); padding:.5rem;
  background:var(--surface); border:1px solid var(--border-strong); border-radius:6px;
  box-shadow:0 24px 60px -22px rgba(30,27,23,.5);
}
.cc-search {
  width:100%; padding:.7em .85em; margin-bottom:.45rem; border:1px solid var(--border-strong); border-radius:4px;
  background:var(--paper); color:var(--ink); font-family:var(--font-sans); font-size:max(16px,1rem);
}
.cc-search:focus { outline:none; border-color:var(--garnet); background:#fff; }
.cc-list { list-style:none; margin:0; padding:0; max-height:230px; overflow-y:auto; }
.cc-opt { display:flex; align-items:baseline; justify-content:space-between; gap:1rem;
  padding:.6em .7em; border-radius:3px; cursor:pointer; font-size:var(--step--1); color:var(--ink); }
.cc-opt:hover, .cc-opt:focus { background:var(--paper); outline:none; }
.cc-opt-dial { color:var(--muted); flex:none; }
.cc-empty { padding:.7em; font-size:var(--step--1); color:var(--muted); }

/* ---------- footer (garnet) ---------- */
.footer { background:var(--garnet); color:color-mix(in srgb, var(--surface) 84%, var(--garnet)); }
.footer-inner { max-width:var(--container); margin-inline:auto; padding:clamp(3.5rem,2rem + 4vw,5.5rem) var(--gutter) 2.5rem;
  display:grid; grid-template-columns:1fr; gap:clamp(2.25rem,1.5rem + 2vw,3rem); }
.footer-brand img { width:230px; height:auto; margin-bottom:1.4rem; }
.footer-brand .brand-name { color:var(--surface); font-size:1.5rem; letter-spacing:.14em; }
.footer-brand p { margin:.8em 0 0; font-size:var(--step--1); line-height:1.7; max-width:34ch; color:color-mix(in srgb, var(--surface) 82%, var(--garnet)); }
.footer h4 { font-family:var(--font-sans); font-size:var(--step--1); font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:color-mix(in srgb, var(--surface) 88%, var(--garnet)); margin:0 0 1.3em; }
.footer a { color:color-mix(in srgb, var(--surface) 84%, var(--garnet)); text-decoration:none; display:block; padding:.4em 0; font-size:var(--step--1); transition:color .2s ease; }
.footer a:hover { color:var(--surface); }
.footer address { font-style:normal; font-size:var(--step--1); line-height:1.9; color:color-mix(in srgb, var(--surface) 84%, var(--garnet)); }
.footer address strong { color:var(--surface); font-weight:600; }
.footer-disclaimer { max-width:var(--container); margin:0 auto; padding:0 var(--gutter);
  font-size:13px; line-height:1.7; color:color-mix(in srgb, var(--surface) 76%, var(--garnet)); }
.footer-bottom { border-top:1px solid color-mix(in srgb, var(--surface) 22%, transparent); margin-top:2.25rem;
  padding:1.5rem var(--gutter); max-width:var(--container); margin-inline:auto;
  display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between; font-size:13px;
  color:color-mix(in srgb, var(--surface) 78%, var(--garnet)); }
@media (min-width:760px){ .footer-inner { grid-template-columns:1.7fr 1fr 1fr 1.3fr; } .footer-brand img { width:300px; margin-top:-34px; } }

/* ============ Gold decorative system — gradient #BCA980 → #A18052 ============ */
:root { --gold-1:#BCA980; --gold-2:#A18052; --gold-grad:linear-gradient(90deg, var(--gold-1), var(--gold-2)); }

/* editorial divider: a gilded line fading to a centred diamond */
.deco-rule { display:flex; align-items:center; justify-content:center; gap:1.05rem; padding-block:clamp(1.6rem, 1.1rem + 1.6vw, 2.6rem); }
.deco-rule + .section { padding-top:0; }
.deco-rule::before, .deco-rule::after { content:""; height:1.5px; width:clamp(60px, 16vw, 180px); border-radius:2px; }
.deco-rule::before { background:linear-gradient(90deg, transparent, var(--gold-1) 55%, var(--gold-2)); }
.deco-rule::after  { background:linear-gradient(90deg, var(--gold-2), var(--gold-1) 45%, transparent); }
.deco-rule span { width:9px; height:9px; flex:none; transform:rotate(45deg); border-radius:1.5px;
  background:linear-gradient(135deg, var(--gold-1), var(--gold-2));
  box-shadow:0 0 0 4px color-mix(in srgb, var(--gold-1) 16%, transparent); }
.section--garnet .deco-rule span { box-shadow:0 0 0 4px color-mix(in srgb, var(--gold-1) 26%, transparent); }

/* cream diamond+lines flourish, left-aligned above a heading on dark/garnet sections
   (same motif as .deco-rule but in the light-section colour instead of gold) */
.deco-head { display:flex; align-items:center; justify-content:center; gap:.9rem; margin:0 0 clamp(1rem, .7rem + .9vw, 1.6rem); }
.deco-head::before, .deco-head::after { content:""; height:1.5px; width:clamp(48px, 12vw, 96px); border-radius:2px; }
.deco-head::before { background:linear-gradient(90deg, transparent, var(--surface)); }
.deco-head::after  { background:linear-gradient(90deg, var(--surface), transparent); }
.deco-head span { width:9px; height:9px; flex:none; transform:rotate(45deg); border-radius:1.5px;
  background:linear-gradient(135deg, var(--surface), color-mix(in srgb, var(--surface) 78%, var(--garnet)));
  box-shadow:0 0 0 4px color-mix(in srgb, var(--surface) 16%, transparent); }

/* gilded footer */
.footer { position:relative; }
.footer::before { content:""; position:absolute; inset:0 0 auto 0; height:3px; background:var(--gold-grad); }
.footer h4::after { content:""; display:block; width:26px; height:2px; margin-top:.8em; border-radius:2px; background:var(--gold-grad); }
.footer-bottom { border-top:1px solid transparent;
  border-image:linear-gradient(90deg, transparent, var(--gold-1), var(--gold-2), transparent) 1; }

/* ============ Conditions dropdown (header mega-menu) ============ */
.nav-dd { position:relative; display:inline-flex; align-items:center; }
.nav-dd-trigger { font-family:var(--font-sans); font-size:var(--step--1); color:var(--ink);
  text-decoration:none; cursor:pointer; display:inline-flex; align-items:center; gap:.4em; padding-block:.4em; }
.nav-dd-trigger:hover { color:var(--garnet); }
.nav-dd-caret { font-size:.62em; color:var(--muted); transition:transform .2s ease; }
.nav-dd:hover .nav-dd-caret, .nav-dd:focus-within .nav-dd-caret { transform:rotate(180deg); color:var(--garnet); }
.nav-dd-menu { position:absolute; top:100%; left:50%; transform:translateX(-50%);
  padding-top:14px; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .18s ease; z-index:60; }
.nav-dd:hover .nav-dd-menu, .nav-dd:focus-within .nav-dd-menu { opacity:1; visibility:visible; pointer-events:auto; }
.nav-dd-cols { display:grid; grid-template-columns:1fr 1fr; gap:1.4rem 2.4rem;
  background:var(--surface); border:1px solid var(--line); border-radius:14px;
  box-shadow:0 26px 64px -30px rgba(30,27,23,.55); padding:1.5rem 1.7rem; min-width:540px; }
.nav-dd-h { display:block; font-family:var(--font-sans); font-size:11px; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-bottom:.6rem; }
.nav-dd-menu a { display:block; text-decoration:none; padding:.5rem .6rem; margin:0 -.6rem;
  border-radius:8px; transition:background-color .15s ease; }
.nav-dd-menu a:hover { background:var(--paper); }
.nav-dd-menu a strong { display:block; font-family:var(--font-serif); font-weight:500; font-size:var(--step-0);
  color:var(--ink); letter-spacing:.015em; line-height:1.2; }
.nav-dd-menu a span { display:block; font-size:var(--step--1); color:var(--muted); margin-top:1px; line-height:1.3; }
/* mobile menu — accordion nav */
.mm-nav { display:flex; flex-direction:column; }
.mm-item, .mm-acc { display:flex; align-items:center; justify-content:space-between; width:100%;
  padding:1.05rem .1rem; font-family:var(--font-serif); font-size:var(--step-1); font-weight:500;
  color:var(--ink); text-decoration:none; text-align:left; letter-spacing:.01em; line-height:1.15;
  background:none; border:0; border-bottom:1px solid var(--line); cursor:pointer; }
.mm-caret { font-size:.62em; color:var(--muted); transition:transform .28s ease; margin-left:1rem; }
.mm-acc.open { color:var(--garnet); border-bottom-color:transparent; }
.mm-acc.open .mm-caret { transform:rotate(180deg); color:var(--garnet); }
.mm-sub { display:grid; grid-template-rows:0fr; overflow:hidden;
  transition:grid-template-rows .32s cubic-bezier(.4,0,.2,1); }
.mm-sub.open { grid-template-rows:1fr; }
.mm-sub-inner { min-height:0; }
.mm-all { display:block; padding:.15rem 0 .75rem .95rem; font-family:var(--font-sans);
  font-size:var(--step--1); font-weight:600; letter-spacing:.04em; text-transform:uppercase;
  color:var(--garnet); text-decoration:none; }
.mm-sub-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 1rem;
  padding:0 0 .5rem .95rem; margin-bottom:.3rem;
  border-left:2px solid transparent; border-image:var(--gold-grad) 1; }
.mm-sub-grid a { display:block; padding:.5rem 0; font-family:var(--font-sans);
  font-size:var(--step--1); color:var(--text-soft); text-decoration:none; line-height:1.25; }
.mm-sub-grid a:active { color:var(--garnet); }
.mm-foot { margin-top:1.25rem; padding-top:1.35rem;
  border-top:2px solid transparent; border-image:var(--gold-grad) 1; }
.mm-foot .btn { width:100%; }
.mm-contact { display:block; text-align:center; margin-top:1rem; font-family:var(--font-sans);
  font-size:var(--step--1); color:var(--muted); text-decoration:none; letter-spacing:.02em; }

/* Section pages (Conditions/Treatment/Laboratory/For patients/Institute/FAQ):
   tighter vertical rhythm so text-led sections don't leave large empty bands. */
.lp .section { padding-block:clamp(2.5rem, 1.6rem + 3vw, 4.25rem); }
.lp .deco-rule { padding-block:clamp(1.3rem, 1rem + 1.3vw, 2.25rem); }
.lp .deco-rule + .section { padding-top:0; }
/* headings sit closer to their content, so short text sections and their CTAs don't float */
.lp .block-head { margin-bottom:clamp(1.6rem, 1.1rem + 1.9vw, 2.75rem); }
.lp .sec-cta { margin-top:clamp(1.5rem, 1rem + 1.6vw, 2.4rem); }


/* ============ legal / policy pages ============ */
.legal { max-width:74ch; }
.legal-updated { color:var(--muted); font-size:var(--step--1); margin-top:1rem; }
.legal h2 { font-size:var(--step-2); margin:clamp(2rem, 1.4rem + 1.6vw, 2.8rem) 0 .55em; line-height:1.2; }
.legal h3 { font-size:var(--step-1); margin:1.7em 0 .5em; }
.legal p, .legal li { color:var(--text-soft); font-size:var(--step-0); line-height:1.7; }
.legal p { margin:0 0 1em; }
.legal ul { margin:0 0 1.2em; padding-left:1.2em; }
.legal li { margin:.4em 0; }
.legal a { color:var(--garnet-link); text-decoration:underline; }
.legal strong { color:var(--ink); }
.legal-table { width:100%; border-collapse:collapse; margin:0 0 1.4em; font-size:var(--step--1); }
.legal-table th, .legal-table td { text-align:left; padding:.7em .8em; border:1px solid var(--line); vertical-align:top; color:var(--text-soft); }
.legal-table th { background:color-mix(in srgb, var(--gold-1) 10%, transparent); color:var(--ink); font-weight:600; }
.legal-note { margin-top:2.4rem; padding:1.15rem 1.35rem; border-left:3px solid transparent; border-image:var(--gold-grad) 1;
  background:color-mix(in srgb, var(--gold-1) 8%, transparent); border-radius:0 8px 8px 0; }
.legal-note p { margin:0; font-size:var(--step--1); color:var(--muted); }

/* footer legal links — keep inline (footer <a> are block by default) */
.footer-bottom .legal-links { display:inline; }
.footer-bottom .legal-links a { display:inline; color:inherit; text-decoration:none; }
.footer-bottom .legal-links a:hover { text-decoration:underline; }

/* ============ cookie consent banner ============ */
.cookie-banner { position:fixed; left:0; right:0; bottom:0; z-index:200; background:var(--surface);
  border-top:2px solid transparent; border-image:var(--gold-grad) 1; box-shadow:0 -10px 34px -14px rgba(20,10,8,.35); }
.cookie-banner[hidden] { display:none; }
.cookie-inner { max-width:1100px; margin:0 auto; padding:clamp(1rem, .8rem + .8vw, 1.35rem) var(--gutter);
  display:flex; align-items:center; gap:clamp(1rem, .8rem + 1.4vw, 2.2rem); flex-wrap:wrap; }
.cookie-text { flex:1 1 300px; }
.cookie-text strong { display:block; font-family:var(--font-serif); font-weight:500; font-size:var(--step-0); color:var(--ink); margin-bottom:.2em; }
.cookie-text p { margin:0; font-size:var(--step--1); line-height:1.55; color:var(--text-soft); }
.cookie-text a { color:var(--garnet-link); text-decoration:underline; }
.cookie-actions { display:flex; gap:.7rem; flex:0 0 auto; }
.cookie-actions .btn { white-space:nowrap; }
@media (max-width:620px){ .cookie-actions { width:100%; } .cookie-actions .btn { flex:1 1 0; } }

/* honeypot field (spam trap) - visually hidden, off-screen (not display:none, which bots skip) */
.hp-field { position:absolute !important; left:-9999px !important; top:auto; width:1px; height:1px; overflow:hidden; }

/* consultation form status message */
.form-status { margin:.9rem 0 0; font-size:var(--step--1); line-height:1.5; min-height:1.2em; }
.form-status.is-ok { color:var(--garnet); font-weight:500; }
.form-status.is-error { color:#B3261E; }

/* required-field validation cue (shows only after the user interacts / submits) */
.cta-form input:user-invalid { border-color:#B3261E; background:#fff; }

/* ============ language switcher — desktop dropdown + mobile pills, SVG flags ============ */
.flag { display:inline-block; width:1.45em; height:.98em; border-radius:2px; flex:none;
  box-shadow:0 0 0 1px rgba(30,27,23,.16); vertical-align:middle; }

/* desktop: dropdown (CSS hover/focus — mirrors the Conditions mega-menu, no JS) */
.lang-dd { position:relative; display:none; }
.lang-dd-trigger { display:inline-flex; align-items:center; gap:.45em; background:none; border:0; cursor:pointer;
  font-family:var(--font-sans); font-size:var(--step--1); color:var(--ink); letter-spacing:.06em;
  text-transform:uppercase; padding:.4em .2em; }
.lang-dd-trigger:hover { color:var(--garnet); }
.lang-dd-code { line-height:1; }
.lang-dd-caret { font-size:.62em; color:var(--muted); transition:transform .2s ease; }
.lang-dd:hover .lang-dd-caret, .lang-dd:focus-within .lang-dd-caret { transform:rotate(180deg); color:var(--garnet); }
.lang-dd-menu { position:absolute; top:100%; right:0; padding-top:12px; opacity:0; visibility:hidden;
  pointer-events:none; transition:opacity .18s ease; z-index:60; }
.lang-dd:hover .lang-dd-menu, .lang-dd:focus-within .lang-dd-menu { opacity:1; visibility:visible; pointer-events:auto; }
.lang-dd-menu-inner { background:var(--surface); border:1px solid var(--line); border-radius:12px;
  box-shadow:0 22px 52px -28px rgba(30,27,23,.55); padding:.4rem; min-width:172px; }
.lang-dd-menu a { display:flex; align-items:center; gap:.65em; padding:.5rem .6rem; margin:0; border-radius:8px;
  font-family:var(--font-sans); font-size:var(--step--1); color:var(--ink); text-decoration:none; letter-spacing:.01em;
  transition:background-color .15s ease, color .15s ease; }
.lang-dd-menu a:hover { background:var(--paper); color:var(--garnet-link); }
.lang-dd-menu a.is-current { color:var(--garnet); font-weight:600; }

/* mobile: pills with flags inside the mobile menu foot */
.mm-lang { display:flex; gap:.5rem; justify-content:center; margin-top:1.1rem; }
.mm-lang a { display:inline-flex; align-items:center; gap:.5em;
  font-family:var(--font-sans); font-size:var(--step--1); line-height:1; letter-spacing:.06em;
  text-transform:uppercase; color:var(--muted); text-decoration:none;
  padding:.5em .8em; border:1px solid var(--line); border-radius:8px;
  transition:color .18s ease, border-color .18s ease; }
.mm-lang a.is-current { color:var(--ink); border-color:var(--border-strong); font-weight:600; }

@media (min-width:1000px) { .nav-inner > .lang-dd { display:inline-flex; align-items:center; margin-left:.1rem; } }

/* ── Related conditions & cross-links (SEO internal linking) ─────────────────
   Photo cards: each condition's 3D render (images/related/), gold accent tick,
   garnet duotone wash that lifts on hover — same language as the rest of the site. */
.related-grid { display:grid; gap:clamp(.8rem, .6rem + .8vw, 1.5rem); grid-template-columns:repeat(2, 1fr); margin-top:clamp(1.6rem, 1.1rem + 1.8vw, 2.6rem); }
@media (min-width:1000px) {
  .related-grid { grid-template-columns:repeat(4, 1fr); }
  /* pages with only two related conditions: two generous cards, not a half-empty row */
  .related-grid:has(> :nth-child(2):last-child) { grid-template-columns:repeat(2, 1fr); max-width:820px; }
}
.related-card { position:relative; display:flex; flex-direction:column; text-decoration:none;
  background:var(--surface); border:1px solid var(--line); border-radius:6px; overflow:hidden;
  transition:border-color .25s ease, box-shadow .25s ease, transform .25s ease; }
.related-card:hover { border-color:var(--border-strong); transform:translateY(-3px);
  box-shadow:0 26px 48px -28px rgba(30,27,23,.5); }
.rc-media { position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--garnet-tint); }
.rc-media img { width:100%; height:100%; object-fit:cover; object-position:62% center; display:block;
  transition:transform .55s cubic-bezier(.16,1,.3,1); }
.related-card:hover .rc-media img { transform:scale(1.05); }
.rc-media::after { content:""; position:absolute; inset:0; pointer-events:none;
  background:var(--garnet); mix-blend-mode:multiply; opacity:.08; transition:opacity .3s ease; }
.related-card:hover .rc-media::after { opacity:0; }
.rc-body { position:relative; flex:1; padding:1rem 1.15rem 1.1rem; }
/* gold tick at the image seam — house divider motif */
.rc-body::before { content:""; position:absolute; top:-1px; left:1.15rem; width:30px; height:2px;
  border-radius:2px; background:var(--gold-grad); }
.related-card .rc-k { display:block; color:var(--ink); font-weight:600; font-size:var(--step-0); line-height:1.3; transition:color .2s ease; }
.related-card .rc-k::after { content:"\2192"; display:inline-block; font-size:.8em; font-weight:400; margin-left:.4em;
  color:var(--garnet-link); transition:transform .25s ease; }
.related-card:hover .rc-k { color:var(--garnet-link); }
.related-card:hover .rc-k::after { transform:translateX(4px); }
.related-card .rc-d { display:block; color:var(--muted); font-size:var(--step--1); letter-spacing:.08em; text-transform:uppercase; margin-top:.35rem; }
.related-more { margin-top:clamp(1.9rem, 1.3rem + 2vw, 3rem); color:var(--text-soft); max-width:66ch; line-height:1.65; }
@media (prefers-reduced-motion: reduce) {
  .related-card, .rc-media img, .related-card .rc-k::after { transition:none; }
  .related-card:hover { transform:none; }
  .related-card:hover .rc-media img { transform:none; }
}
.related-more { margin-top:clamp(1.3rem, 1rem + 1.2vw, 2rem); font-size:var(--step-0);
  color:var(--text-soft); max-width:60ch; line-height:1.6; }
.related-more a { color:var(--garnet-link); text-underline-offset:3px; }