/* ============================================================
   Dr. Monica Păun — multi-page personal brand
   Editorial / clinical-luxe system
   ============================================================ */

/* ----------------------------------------------------------------
   Palettes — all light backgrounds, footer matches header.
   Tuned for WCAG 2.2 AAA: ink/ink-soft >= 7:1 on paper & card;
   accent dark enough for small text on paper AND light text on accent.
   ---------------------------------------------------------------- */
:root,
[data-theme="asphalt"] {
  /* Brick on Jade — very light jade ground, brighter brick red.
     Body text AAA; red AA for small text, brightest brick #C84B2F reserved for large/UI. */
  --paper:#E3F0E8; --paper-2:#d4e6db; --card:#eef6f1;
  --ink:#1F2421; --ink-soft:#39433d; --ink-faint:#4f5a53;
  --line:#bdd5c7; --line-soft:#cde2d6;
  --accent:#B43A26; --accent-deep:#93301e; --accent-tint:#ecd5cd; --on-accent:#ffffff;
  --brick:#C84B2F; --coral:#E37A60; --charcoal:#1F2421;
}
[data-theme="nude"] {
  --paper:#f4eee6; --paper-2:#ece1d4; --card:#fbf7f0;
  --ink:#231c18; --ink-soft:#43392f; --ink-faint:#4e4337;
  --line:#ddd0bf; --line-soft:#e9dfce;
  --accent:#6d3020; --accent-deep:#572618; --accent-tint:#ebd7cc; --on-accent:#fbf7f0;
}
[data-theme="olive"] {
  --paper:#eef0e8; --paper-2:#e2e6da; --card:#f7f9f2;
  --ink:#1e231a; --ink-soft:#3b4232; --ink-faint:#3f4633;
  --line:#d4dac9; --line-soft:#e1e6d6;
  --accent:#40492c; --accent-deep:#313823; --accent-tint:#dbe1cd; --on-accent:#f7f9f2;
}
[data-theme="bordeaux"] {
  --paper:#f4ede9; --paper-2:#e9ddd5; --card:#fbf5f1;
  --ink:#241b18; --ink-soft:#473733; --ink-faint:#50403a;
  --line:#e1d4cb; --line-soft:#ede1d9;
  --accent:#6d282c; --accent-deep:#541f22; --accent-tint:#ecd4d4; --on-accent:#fbf5f1;
}
[data-theme="slate"] {
  --paper:#eceef0; --paper-2:#dfe3e5; --card:#f7f9fa;
  --ink:#1a1f23; --ink-soft:#363f46; --ink-faint:#3b454c;
  --line:#d3d9dc; --line-soft:#e2e6e9;
  --accent:#30474f; --accent-deep:#243a41; --accent-tint:#d4dfe3; --on-accent:#f7f9fa;
}
[data-theme="plum"] {
  --paper:#f1edf0; --paper-2:#e5dce6; --card:#f9f5f8;
  --ink:#201a22; --ink-soft:#3f3542; --ink-faint:#4a404d;
  --line:#dbd1dc; --line-soft:#e8dfe8;
  --accent:#4c2c4e; --accent-deep:#3a223c; --accent-tint:#e2d5e2; --on-accent:#f9f5f8;
}
[data-theme="silk"] {
  /* Liquid Silk — bright alabaster ground, midnight plum ink,
     champagne reserved for interactive UI. Small accent text uses the
     deepened champagne (AA); true #A38562 silk appears on buttons and bands. */
  --paper:#F9F9FA; --paper-2:#EFEDF1; --card:#FFFFFF;
  --ink:#2B1528; --ink-soft:#1A0A18; --ink-faint:#5F4A5A;
  --line:#E3DFE3; --line-soft:#EDEAED;
  --accent:#84684A; --accent-deep:#6B5339; --accent-tint:#EAE0D1; --on-accent:#F9F9FA;
  --silk:#A38562; --plum-deep:#1A0A18;
}
[data-theme="noir"] {
  --paper:#f1efe9; --paper-2:#e6e2d9; --card:#faf8f3;
  --ink:#191714; --ink-soft:#3a352e; --ink-faint:#443f37;
  --line:#dad4c8; --line-soft:#e8e2d6;
  --accent:#332f2a; --accent-deep:#1c1a16; --accent-tint:#ddd7cb; --on-accent:#faf8f3;
}

/* ---------- Fonts ---------- */
:root {
  --font-display:'Bodoni Moda', Georgia, serif;
  --font-body:'Jost', system-ui, sans-serif;
  --maxw:1240px;
  --gutter:clamp(20px,5vw,64px);
  --radius:2px;
  --navh:72px;
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
body{
  margin:0; font-family:var(--font-body); color:var(--ink); background:var(--paper);
  font-size:17px; line-height:1.6; font-weight:300; letter-spacing:.01em;
  -webkit-font-smoothing:antialiased; transition:background-color .5s ease,color .5s ease;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }
h1,h2,h3,h4{ font-weight:400; margin:0; }

/* ---------- Helpers ---------- */
.eyebrow{ font-size:12px; font-weight:500; letter-spacing:.3em; text-transform:uppercase; color:var(--accent); }
.display{ font-family:var(--font-display); font-weight:400; line-height:1.04; letter-spacing:-.01em; font-optical-sizing:auto; }
.lead{ font-size:clamp(18px,2vw,21px); line-height:1.65; color:var(--ink-soft); font-weight:300; }
.wrap{ max-width:var(--maxw); margin:0 auto; padding-inline:var(--gutter); }
section{ position:relative; }
.section-pad{ padding-block:clamp(64px,9vw,128px); }
.rule{ height:1px; background:var(--line); border:0; margin:0; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  font-size:12.5px; letter-spacing:.16em; font-weight:500; text-transform:uppercase;
  padding:13px 26px; border:1px solid var(--accent);
  background:var(--accent); color:var(--on-accent); border-radius:var(--radius);
  transition:background-color .3s,color .3s,border-color .3s;
}
.btn:hover{ background:var(--accent-deep); border-color:var(--accent-deep); }
.btn--ghost{ background:transparent; color:var(--ink); border-color:var(--line); }
.btn--ghost:hover{ background:transparent; color:var(--accent); border-color:var(--accent); }
.btn .arr{ transition:transform .3s; }
.btn:hover .arr{ transform:translateX(4px); }
.link-line{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent);
  border-bottom:1px solid currentColor; padding-bottom:3px; transition:gap .3s;
}
.link-line:hover{ gap:13px; }

/* ============================================================
   Skip link (keyboard accessibility)
   ============================================================ */
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;white-space:nowrap;}
.skip-link:focus{position:fixed;top:0;left:0;width:auto;height:auto;padding:12px 24px;background:var(--ink);color:var(--paper);font-size:14px;font-family:var(--font-body);font-weight:500;z-index:200;text-decoration:none;border-radius:0 0 var(--radius) 0;}

/* ============================================================
   Nav  (solid background, single clickable logo)
   ============================================================ */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:50; height:var(--navh);
  display:flex; align-items:center; justify-content:space-between;
  padding-inline:var(--gutter);
  background:color-mix(in srgb,var(--paper-2) 94%,transparent);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid transparent; transition:border-color .4s,background-color .4s;
}
.nav.scrolled{ border-bottom-color:var(--line-soft); }
.logo{
  font-family:var(--font-display); font-size:23px; letter-spacing:.02em; color:var(--ink);
  display:inline-block; line-height:1; white-space:nowrap;
}
.logo .dot{ color:var(--accent); }
.logo:hover{ color:var(--accent); }
.nav__links{ display:flex; align-items:center; gap:clamp(16px,2.2vw,34px); }
.nav__link{
  font-size:12.5px; letter-spacing:.16em; text-transform:uppercase; font-weight:400;
  color:var(--ink-soft); position:relative; padding-block:6px; white-space:nowrap;
}
.nav__link::after{ content:""; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--accent); transition:width .35s; }
.nav__link:hover{ color:var(--ink); }
.nav__link:hover::after,.nav__link[aria-current="page"]::after{ width:100%; }
.nav__link[aria-current="page"]{ color:var(--ink); }
.nav__cta{ margin-left:6px; }
.nav__burger{ display:none; width:42px; height:42px; border:0; background:none; flex-direction:column; gap:5px; align-items:center; justify-content:center; }
.nav__burger span{ width:22px; height:1.5px; background:var(--ink); transition:transform .3s,opacity .3s; }
@media (max-width:1080px){
  .nav__links{
    position:fixed; inset:var(--navh) 0 auto 0; flex-direction:column; align-items:flex-start; gap:0;
    background:var(--paper-2); border-bottom:1px solid var(--line); padding:8px var(--gutter) 22px;
    transform:translateY(-130%); transition:transform .45s cubic-bezier(.6,0,.2,1); pointer-events:none;
  }
  .nav__links.open{ transform:translateY(0); pointer-events:auto; }
  .nav__link{ width:100%; padding:15px 0; border-bottom:1px solid var(--line-soft); font-size:14px; }
  .nav__cta{ margin:16px 0 0; }
  .nav__burger{ display:flex; }
  .nav.menu-open .nav__burger span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
  .nav.menu-open .nav__burger span:nth-child(2){ opacity:0; }
  .nav.menu-open .nav__burger span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }
}

/* ============================================================
   Page header band (interior pages)
   ============================================================ */
.pagehead{ padding-top:calc(var(--navh) + clamp(48px,7vw,92px)); padding-bottom:clamp(40px,6vw,72px); background:var(--paper); border-bottom:1px solid var(--line); }
.pagehead__inner{ max-width:var(--maxw); margin:0 auto; padding-inline:var(--gutter); }
.pagehead .eyebrow{ display:block; margin-bottom:20px; }
.pagehead h1{ font-size:clamp(38px,6.4vw,84px); max-width:16ch; }
.pagehead p{ max-width:54ch; margin-top:24px; }

/* ============================================================
   Hero (home) — single background colour, framed portrait
   ============================================================ */
.hero{ background:var(--paper); padding-top:var(--navh); }
.hero__inner{
  max-width:var(--maxw); margin:0 auto; padding:clamp(40px,6vw,80px) var(--gutter) clamp(56px,7vw,90px);
  display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(36px,6vw,84px); align-items:center;
  min-height:calc(100svh - var(--navh));
}
.hero__name{ font-size:clamp(52px,8vw,116px); margin:0; }
.hero__role{ font-size:clamp(13px,1.4vw,15px); letter-spacing:.28em; text-transform:uppercase; color:var(--ink-soft); margin:22px 0 0; font-weight:400; }
.hero__tag{ max-width:34ch; margin:26px 0 38px; }
.hero__cta{ display:flex; flex-wrap:wrap; gap:14px; }
.hero__figure{ position:relative; }
.hero__figure .frame{ position:relative; overflow:hidden; aspect-ratio:4/5; border:1px solid var(--line); border-radius:var(--radius); background:var(--paper-2); }
.hero__figure img{ width:100%; height:100%; object-fit:cover; object-position:50% 20%; }
.hero__figure .tagcard{
  position:absolute; left:-14px; bottom:-14px; background:var(--card); border:1px solid var(--line);
  padding:14px 18px; max-width:230px; border-radius:var(--radius);
}
.hero__figure .tagcard b{ font-family:var(--font-display); font-size:17px; display:block; }
.hero__figure .tagcard span{ font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-faint); }
@media (max-width:880px){
  .hero__inner{ grid-template-columns:1fr; min-height:0; padding-top:clamp(32px,8vw,56px); }
  .hero__figure{ max-width:420px; order:-1; }
}

/* ============================================================
   Section header (no decorative numbers)
   ============================================================ */
.shead{ max-width:720px; margin-bottom:clamp(40px,6vw,68px); }
.shead.center{ margin-inline:auto; text-align:center; }
.shead .eyebrow{ display:block; margin-bottom:18px; }
.shead h2{ font-size:clamp(30px,4.4vw,52px); }
.shead p{ margin-top:18px; max-width:54ch; }
.shead.center p{ margin-inline:auto; }

/* ============================================================
   About
   ============================================================ */
.about__grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(36px,6vw,84px); align-items:start; }
.about__portrait{ position:relative; }
.about__portrait image-slot{ width:100%; aspect-ratio:3/4; }
.about__frame{ position:absolute; inset:14px -14px -14px 14px; border:1px solid var(--accent); z-index:-1; border-radius:var(--radius); }
.about__body p{ margin:0 0 20px; max-width:58ch; }
.about__body .lead{ margin-bottom:26px; }
.facts{ list-style:none; padding:0; margin:30px 0 0; border-top:1px solid var(--line); }
.facts > div{ display:grid; grid-template-columns:.6fr 1.4fr; gap:18px; padding:16px 0; border-bottom:1px solid var(--line); }
.facts dt{ font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-faint); margin:0; padding-top:3px; }
.facts dd{ margin:0; font-size:15.5px; color:var(--ink); line-height:1.5; }
.about__cta{ margin-top:32px; display:flex; gap:16px; flex-wrap:wrap; align-items:center; }
@media (max-width:860px){ .about__grid{ grid-template-columns:1fr; } .about__portrait{ max-width:420px; } }

/* ============================================================
   Focus (hair) band
   ============================================================ */
.focus{ background:var(--accent); color:var(--on-accent); }
/* Asphalt theme: focus band sits on charcoal with coral highlights (5.5:1, AA) */
[data-theme="asphalt"] .focus{ background:var(--charcoal); color:#E3F0E8; }
[data-theme="asphalt"] .focus .eyebrow{ color:var(--coral); }
[data-theme="asphalt"] .focus__stat b{ color:var(--coral); }
[data-theme="asphalt"] .btn{ background:var(--accent); border-color:var(--brick); }
[data-theme="asphalt"] .about__frame{ border-color:var(--brick); }
[data-theme="asphalt"] .clinic:hover{ border-color:var(--brick); }
/* Silk theme: champagne buttons carry plum-black text (4.7:1); focus band
   sits on plum-black with champagne highlights. */
[data-theme="silk"] .btn{ background:var(--silk); border-color:var(--silk); color:var(--plum-deep); }
[data-theme="silk"] .btn:hover{ background:#B2956F; border-color:#B2956F; color:var(--plum-deep); }
[data-theme="silk"] .btn--ghost{ background:transparent; color:var(--ink); border-color:var(--line); }
[data-theme="silk"] .btn--ghost:hover{ background:transparent; color:var(--accent); border-color:var(--silk); }
[data-theme="silk"] .focus{ background:var(--plum-deep); color:#F2ECF0; }
[data-theme="silk"] .focus .eyebrow{ color:var(--silk); }
[data-theme="silk"] .focus__stat b{ color:var(--silk); }
[data-theme="silk"] .about__frame{ border-color:var(--silk); }
[data-theme="silk"] .clinic:hover{ border-color:var(--silk); }
.focus .eyebrow{ color:color-mix(in srgb,var(--on-accent) 82%,transparent); }
.focus__grid{ display:grid; grid-template-columns:1fr .8fr; gap:clamp(36px,6vw,80px); align-items:center; }
.focus h2{ color:var(--on-accent); font-size:clamp(28px,4vw,48px); margin-top:16px; }
.focus__lead{ color:color-mix(in srgb,var(--on-accent) 88%,transparent); margin-top:22px; max-width:48ch; }
.focus__stats{ display:grid; gap:22px; }
.focus__stat{ border-top:1px solid color-mix(in srgb,var(--on-accent) 32%,transparent); padding-top:14px; }
.focus__stat b{ font-family:var(--font-display); font-size:clamp(26px,3.4vw,40px); display:block; line-height:1; }
.focus__stat span{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:color-mix(in srgb,var(--on-accent) 80%,transparent); display:block; margin-top:9px; }
@media (max-width:860px){ .focus__grid{ grid-template-columns:1fr; } }

/* ============================================================
   Services
   ============================================================ */
.svc__area{ border-top:1px solid var(--line); }
.svc__area:last-child{ border-bottom:1px solid var(--line); }
.svc__head{ padding:30px 0 12px; }
.svc__areatitle{ font-family:var(--font-display); font-size:clamp(24px,3vw,34px); }
.svc__areadesc{ font-size:15px; color:var(--ink-soft); max-width:56ch; margin:10px 0 4px; }
.svc__list{ list-style:none; margin:0 0 28px; padding:0; }
.svc__item{ border-top:1px solid var(--line-soft); }
.svc__item:first-child{ border-top:0; }
.svc__btn{ width:100%; background:none; border:0; text-align:left; display:flex; align-items:center; gap:18px; justify-content:space-between; padding:18px 2px; color:var(--ink); }
.svc__btn:hover{ color:var(--accent); }
.svc__name{ font-size:clamp(17px,2vw,20px); font-weight:400; }
.svc__plus{ position:relative; width:16px; height:16px; flex:none; }
.svc__plus::before,.svc__plus::after{ content:""; position:absolute; background:var(--accent); transition:transform .35s; }
.svc__plus::before{ left:0; top:7.5px; width:16px; height:1.4px; }
.svc__plus::after{ left:7.5px; top:0; width:1.4px; height:16px; }
.svc__btn[aria-expanded="true"] .svc__plus::after{ transform:scaleY(0); }
.svc__panel{ overflow:hidden; height:0; transition:height .4s ease; }
.svc__panelinner{ padding:0 2px 22px; max-width:62ch; color:var(--ink-soft); font-size:15px; }

/* ============================================================
   Clinics
   ============================================================ */
.clinic__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,40px); }
.clinic{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column; transition:border-color .3s; }
.clinic:hover{ border-color:var(--accent); }
.clinic image-slot{ width:100%; aspect-ratio:16/10; }
.clinic__body{ padding:26px 28px 30px; display:flex; flex-direction:column; flex:1; }
.clinic__city{ font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--accent); }
.clinic__name{ font-family:var(--font-display); font-size:26px; margin:10px 0 6px; }
.clinic__addr{ font-size:14.5px; color:var(--ink-soft); margin:0 0 16px; line-height:1.5; }
.clinic__meta{ font-size:13.5px; color:var(--ink-faint); margin:0 0 22px; display:grid; gap:7px; }
.clinic__meta b{ color:var(--ink); font-weight:500; }
.clinic__links{ margin-top:auto; display:flex; gap:14px; flex-wrap:wrap; align-items:center; }
@media (max-width:760px){ .clinic__grid{ grid-template-columns:1fr; } }

/* ============================================================
   Learn
   ============================================================ */
.learn__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,3vw,34px); }
.vid{ display:flex; flex-direction:column; }
.vid__thumb{ position:relative; width:100%; aspect-ratio:16/10; }
.vid__thumb image-slot{ width:100%; height:100%; }
.vid__thumb img{ width:100%; height:100%; object-fit:cover; }
.img-placeholder{ width:100%; height:100%; background:var(--paper-2); }
.vid__play{ position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; }
.vid__play span{ width:54px; height:54px; border-radius:50%; background:color-mix(in srgb,var(--card) 90%,transparent); border:1px solid var(--line); display:grid; place-items:center; }
.vid__play span::after{ content:""; border-left:13px solid var(--accent); border-top:8px solid transparent; border-bottom:8px solid transparent; margin-left:3px; }
.vid__tag{ font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--accent); margin:18px 0 8px; }
.vid__title{ font-family:var(--font-display); font-size:21px; line-height:1.2; }
.vid__sub{ font-size:14px; color:var(--ink-soft); margin-top:8px; }
@media (max-width:820px){ .learn__grid{ grid-template-columns:1fr; max-width:440px; } }

/* ============================================================
   Footer (light — matches header)
   ============================================================ */
.foot{ background:var(--paper-2); color:var(--ink); border-top:1px solid var(--line); }

/* language switcher */
.nav__lang{ display:flex; align-items:center; gap:2px; border:1px solid var(--line); border-radius:var(--radius); padding:3px; }
.nav__lang button{
  background:none; border:0; font-size:11.5px; letter-spacing:.12em; font-weight:500;
  color:var(--ink-soft); padding:6px 10px; border-radius:1px; text-transform:uppercase;
  transition:background-color .25s,color .25s;
}
.nav__lang button:hover{ color:var(--ink); }
.nav__lang button[aria-pressed="true"]{ background:var(--accent); color:var(--on-accent); }
@media (max-width:1080px){ .nav__lang{ margin-top:16px; align-self:flex-start; } }
.foot__cta{ text-align:center; padding-block:clamp(56px,8vw,104px); border-bottom:1px solid var(--line); }
.foot__cta .eyebrow{ display:block; margin-bottom:18px; }
.foot__cta h2{ font-family:var(--font-display); font-size:clamp(32px,5vw,64px); }
.foot__cta p{ color:var(--ink-soft); max-width:44ch; margin:20px auto 30px; }
.foot__grid{ display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:clamp(28px,5vw,64px); padding-block:clamp(48px,6vw,80px); }
.foot__brand .logo{ font-size:26px; }
.foot__brand p{ color:var(--ink-soft); margin:18px 0 22px; max-width:32ch; font-size:15px; }
.foot__col h4{ font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-faint); margin:0 0 16px; }
.foot__col p{ margin:0 0 14px; font-size:14.5px; color:var(--ink-soft); line-height:1.5; }
.foot__col a.link-line{ font-size:12px; }
.foot__social{ display:flex; gap:12px; }
.foot__social a{ width:42px; height:42px; border:1px solid var(--line); border-radius:50%; display:grid; place-items:center; color:var(--ink); transition:background-color .3s,color .3s,border-color .3s; }
.foot__social a:hover{ background:var(--accent); border-color:var(--accent); color:var(--on-accent); }
.foot__social svg{ width:18px; height:18px; }
.foot__bar{ display:flex; flex-wrap:wrap; gap:14px 26px; align-items:center; justify-content:space-between; padding-block:24px; border-top:1px solid var(--line); font-size:12px; letter-spacing:.04em; color:var(--ink-faint); }
.foot__legal{ display:flex; flex-wrap:wrap; gap:8px 22px; }
.foot__legal button{ background:none; border:0; color:inherit; font-size:12px; letter-spacing:.04em; padding:0; }
.foot__legal button:hover{ color:var(--ink); text-decoration:underline; text-underline-offset:3px; }
@media (max-width:820px){ .foot__grid{ grid-template-columns:1fr 1fr; } .foot__brand{ grid-column:1 / -1; } }
@media (max-width:520px){ .foot__grid{ grid-template-columns:1fr; } }

/* ============================================================
   Modal
   ============================================================ */
.modal{ position:fixed; inset:0; z-index:100; display:none; align-items:center; justify-content:center; padding:24px; }
.modal.open{ display:flex; }
.modal__scrim{ position:absolute; inset:0; background:rgba(20,16,12,.5); backdrop-filter:blur(4px); }
.modal__card{ position:relative; background:var(--card); color:var(--ink); max-width:720px; width:100%; max-height:86vh; overflow:auto; border-radius:var(--radius); padding:clamp(28px,4vw,52px); border:1px solid var(--line); box-shadow:0 30px 80px rgba(0,0,0,.22); }
.modal__card h3{ font-family:var(--font-display); font-size:clamp(24px,3.4vw,34px); margin-bottom:8px; }
.modal__card .eyebrow{ margin-bottom:18px; display:block; }
.modal__card p{ color:var(--ink-soft); font-size:15px; margin:0 0 16px; max-width:60ch; }
.modal__card h4{ font-size:13px; letter-spacing:.14em; text-transform:uppercase; margin:26px 0 8px; color:var(--ink); }
.modal__close{ position:absolute; top:16px; right:16px; width:40px; height:40px; border:1px solid var(--line); background:var(--paper); border-radius:50%; display:grid; place-items:center; color:var(--ink); font-size:18px; line-height:1; }
.modal__close:hover{ border-color:var(--ink); }

/* ---------- Reveal ---------- */
.reveal{ opacity:0; transform:translateY(20px); transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .reveal{ opacity:1; transform:none; transition:none; } }
.no-motion .reveal{ opacity:1 !important; transform:none !important; transition:none !important; }

/* ============================================================
   Clinic availability badges (services page)
   ============================================================ */
.svc__legend{ display:flex; align-items:center; gap:20px; margin-bottom:clamp(28px,4vw,48px); padding:16px 20px; background:var(--card); border:1px solid var(--line); border-radius:var(--radius); flex-wrap:wrap; }
.svc__legend-item{ display:flex; align-items:center; gap:8px; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); font-weight:500; }
.clinic-dot{ width:12px; height:12px; border-radius:50%; flex:none; }
/* Brussels = blue (#2563A8); Bucharest = amber (#C47B1A) — distinct by hue, both ≥3:1 on paper */
.clinic-dot--bxl{ background:#2563A8; }
.clinic-dot--buc{ background:#C47B1A; }
.clinic-badges{ display:flex; gap:8px; margin-left:auto; flex:none; align-items:center; }
.clinic-badge{ width:12px; height:12px; border-radius:50%; }
.clinic-badge--bxl{ background:#2563A8; }
.clinic-badge--buc{ background:#C47B1A; }
.svc__btn{ position:relative; }
.svc__btn-inner{ display:flex; align-items:center; gap:12px; flex:1; }
.svc__subgroup{ border-top:1px solid var(--line-soft); }
.svc__subgroup-title{ font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-faint); padding:16px 2px 6px; font-weight:500; }
.svc__sub-list{ list-style:none; margin:0; padding:0; }
.svc__sub-list .svc__item{ padding-left:0; }

/* ============================================================
   Video block (homepage)
   ============================================================ */
.vid__play{ position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; }
.vid__play span{ width:54px; height:54px; border-radius:50%; background:color-mix(in srgb,var(--card) 90%,transparent); border:1px solid var(--line); display:grid; place-items:center; }
.vid__play span::after{ content:""; border-left:13px solid var(--accent); border-top:8px solid transparent; border-bottom:8px solid transparent; margin-left:3px; }

/* ============================================================
   Map embed (booking page)
   ============================================================ */
.clinic__map{ width:100%; aspect-ratio:16/10; border:0; display:block; background:var(--paper-2); }

/* ============================================================
   FAQ page — two-column layout reusing svc__ accordion
   ============================================================ */
.faq-section{ background:var(--paper); }
.faq__cols{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,72px); margin-top:clamp(40px,6vw,72px); }
@media(max-width:860px){ .faq__cols{ grid-template-columns:1fr; } }

.faq__group-title{
  font-family:var(--font-display);
  font-size:clamp(15px,1.5vw,18px);
  font-weight:500;
  letter-spacing:.04em;
  color:var(--ink);
  margin:0 0 4px;
  padding-bottom:12px;
  border-bottom:1px solid var(--line);
}

/* ============================================================
   Patient leaflets grid (learn page)
   ============================================================ */
.leaflet__card{
  display:flex; flex-direction:column; align-items:center; gap:8px;
  padding:20px 16px 16px;
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  text-decoration:none; color:var(--ink); transition:box-shadow .2s, border-color .2s;
  text-align:center;
}
.leaflet__card:hover{ border-color:var(--accent); box-shadow:0 4px 16px rgba(0,0,0,.08); }
.leaflet__icon{ font-size:28px; line-height:1; }
.leaflet__title{ font-size:13.5px; font-weight:500; line-height:1.35; color:var(--ink); }
.leaflet__hint{ font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); margin-top:4px; }

/* ============================================================
   Social preview cards (learn page)
   ============================================================ */
.social-preview{
  display:flex; flex-wrap:wrap; gap:16px;
  margin-top:clamp(32px,4vw,52px);
}
.social-card{
  display:flex; align-items:center; gap:18px;
  padding:24px 28px;
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  text-decoration:none; color:var(--ink);
  flex:1; min-width:240px;
  transition:box-shadow .2s, border-color .2s;
}
.social-card:hover{ border-color:var(--accent); box-shadow:0 4px 20px rgba(0,0,0,.08); }
.social-card__icon{
  width:52px; height:52px; border-radius:50%; flex-shrink:0;
  display:grid; place-items:center;
  background:var(--accent-tint); color:var(--accent);
}
.social-card__icon svg{ width:24px; height:24px; }
.social-card__body{ flex:1; }
.social-card__body b{ display:block; font-size:16px; font-weight:500; }
.social-card__body span{ display:block; font-size:13px; color:var(--ink-faint); margin-top:3px; }
.social-card__arrow{ font-size:20px; color:var(--ink-faint); flex-shrink:0; }