/* onco.hospital — warm & hopeful design system
   Cream backgrounds, deep teal as primary, coral as the action color,
   editorial serif headlines (Fraunces) paired with Inter for body. */

:root{
  /* Surfaces */
  --c-bg: #FAF6F0;            /* cream */
  --c-bg-warm: #F4ECDF;       /* warmer cream for accent blocks */
  --c-surface: #FFFFFF;
  --c-surface-soft: #FDFAF4;
  --c-surface-deep: #1F3A3D;  /* deep teal for inverse sections */

  /* Text */
  --c-text: #1F2937;          /* deep warm charcoal */
  --c-text-soft: #4A5363;
  --c-text-muted: #80796E;    /* warm brown-grey */
  --c-text-inverse: #FAF6F0;

  /* Brand */
  --c-primary: #265A60;       /* deep teal */
  --c-primary-dark: #1A3F44;
  --c-primary-soft: #3D8389;
  --c-accent: #E07A5F;        /* warm coral / terracotta */
  --c-accent-dark: #C25A40;
  --c-accent-soft: #F2A98E;
  --c-gold: #C8A063;
  --c-sage: #B5C9A6;

  /* Lines */
  --c-line: #E5DDC8;
  --c-line-soft: #EFE7D2;
  --c-line-strong: #C7BCA1;

  /* States */
  --c-success: #2F7D52;
  --c-error: #C84B31;

  /* Radius */
  --r-xs: 4px;
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-xl: 36px;
  --r-pill: 999px;

  /* Shadow */
  --shadow-sm: 0 1px 3px rgba(31,58,61,.06), 0 2px 8px rgba(31,58,61,.04);
  --shadow-md: 0 8px 24px rgba(31,58,61,.08), 0 2px 6px rgba(31,58,61,.04);
  --shadow-lg: 0 24px 60px rgba(31,58,61,.12), 0 6px 16px rgba(31,58,61,.06);

  /* Type */
  --font-serif: "Fraunces", "Source Serif Pro", "Georgia", serif;
  --font-sans: "Inter", "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;

  /* Layout */
  --max-w: 1240px;
  --max-w-prose: 720px;
  --gutter: clamp(20px, 4vw, 40px);

  /* Motion */
  --ease: cubic-bezier(.2,.7,.3,1);
  --t-fast: 160ms;
  --t-mid:  260ms;
  --t-slow: 540ms;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; scroll-padding-top:90px; }
body{
  margin:0;
  font-family:var(--font-sans);
  font-size:17px;
  line-height:1.6;
  color:var(--c-text);
  background:var(--c-bg);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg{ display:block; max-width:100%; height:auto; }
a{ color:var(--c-primary); text-decoration:none; transition:color var(--t-fast) var(--ease); }
a:hover{ color:var(--c-accent-dark); }

/* Typography */
.h-display, .h1, .h2, h1, h2, h3 { font-family:var(--font-serif); color:var(--c-text); letter-spacing:-.015em; font-weight:500; line-height:1.1; }
h1{ font-size:clamp(2.5rem, 5.5vw, 4.5rem); margin:0 0 .35em; font-variation-settings:"opsz" 144, "SOFT" 30; }
h2{ font-size:clamp(2rem, 3.6vw, 3rem); margin:0 0 .4em; font-variation-settings:"opsz" 96, "SOFT" 20; }
h3{ font-size:clamp(1.25rem, 1.8vw, 1.5rem); margin:0 0 .4em; }
h4{ font-family:var(--font-sans); font-size:1.05rem; margin:0 0 .3em; font-weight:600; letter-spacing:-.005em; color:var(--c-text); }
p{ margin:0 0 1em; color:var(--c-text-soft); }
.lede{ font-size:clamp(1.1rem, 1.4vw, 1.25rem); color:var(--c-text-soft); line-height:1.55; max-width:54ch; }
.eyebrow{
  display:inline-block;
  font-family:var(--font-sans);
  font-size:.78rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--c-accent-dark);
  margin-bottom:14px;
}
.eyebrow--soft{ color:var(--c-text-muted); }

/* Layout */
.container{ max-width:var(--max-w); margin:0 auto; padding:0 var(--gutter); }
.container--narrow{ max-width:var(--max-w-prose); margin:0 auto; padding:0 var(--gutter); }
.section{ padding:clamp(64px, 9vw, 130px) 0; }
.section--soft{ background:var(--c-bg-warm); }
.section--surface{ background:var(--c-surface); }
.section--deep{ background:var(--c-surface-deep); color:var(--c-text-inverse); }
.section--deep h1,.section--deep h2,.section--deep h3,.section--deep h4{ color:var(--c-text-inverse); }
.section--deep p{ color:rgba(250,246,240,.78); }
.section--deep a{ color:var(--c-accent-soft); }
.section--deep a:hover{ color:#fff; }
.section--deep .eyebrow{ color:var(--c-accent-soft); }

/* Top bar */
.topbar{
  position:sticky; top:0; z-index:50;
  background:rgba(250,246,240,.85);
  backdrop-filter:saturate(160%) blur(14px);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid rgba(199,188,161,.4);
}
.topbar__inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px var(--gutter); max-width:var(--max-w); margin:0 auto; gap:24px;
}
.brand{
  display:flex; align-items:center; gap:10px;
  font-family:var(--font-serif); font-weight:600; font-size:1.4rem; color:var(--c-text); letter-spacing:-.02em;
}
.brand:hover{ color:var(--c-primary); }
.brand__dot{
  width:10px; height:10px; border-radius:50%; background:var(--c-accent);
  display:inline-block; box-shadow:0 0 0 3px rgba(224,122,95,.18);
}

.nav{ display:none; gap:4px; flex:1; justify-content:center; }
@media (min-width: 920px){ .nav{ display:flex; } }
.nav a{
  padding:8px 14px; border-radius:var(--r-pill);
  color:var(--c-text-soft); font-weight:500; font-size:.96rem;
  transition:background var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.nav a:hover{ background:var(--c-line-soft); color:var(--c-text); }
.nav a.is-active{ color:var(--c-primary-dark); background:var(--c-line-soft); }

.toptools{ display:flex; align-items:center; gap:10px; }
.topbar__call{
  display:none; align-items:center; gap:6px;
  font-weight:600; color:var(--c-text); font-size:.92rem;
}
.topbar__call:hover{ color:var(--c-accent-dark); }
@media (min-width: 1100px){ .topbar__call{ display:inline-flex; } }

.lang-toggle{
  border:1px solid var(--c-line-strong);
  background:transparent; color:var(--c-text);
  padding:7px 12px; font-weight:600; font-size:.82rem; letter-spacing:.04em;
  border-radius:var(--r-pill); cursor:pointer;
  transition:all var(--t-fast) var(--ease);
}
.lang-toggle:hover{ background:var(--c-text); color:var(--c-bg); border-color:var(--c-text); }

.menu-btn{
  display:inline-flex; align-items:center; justify-content:center;
  width:42px; height:42px; border:1px solid var(--c-line-strong); background:transparent;
  cursor:pointer; padding:0; border-radius:var(--r-pill);
}
.menu-btn:hover{ background:var(--c-line-soft); }
.menu-btn span{ display:block; width:18px; height:1.8px; background:var(--c-text); border-radius:2px; box-shadow:0 -6px 0 var(--c-text), 0 6px 0 var(--c-text); }
@media (min-width: 920px){ .menu-btn{ display:none; } }

/* Mobile drawer */
.mobile-nav{
  position:fixed; inset:0 0 0 auto; width:min(86vw, 360px);
  background:var(--c-bg); z-index:60;
  transform:translateX(100%); transition:transform var(--t-mid) var(--ease);
  padding:32px var(--gutter); overflow-y:auto;
  box-shadow:-12px 0 32px rgba(31,58,61,.12);
}
.mobile-nav.is-open{ transform:translateX(0); }
.mobile-nav a{
  display:block; padding:14px 0; font-family:var(--font-serif); font-size:1.3rem; color:var(--c-text);
  border-bottom:1px solid var(--c-line-soft);
}
.mobile-nav .close{ float:right; font-size:1.6rem; line-height:1; cursor:pointer; background:none; border:0; color:var(--c-text); }
.scrim{
  position:fixed; inset:0; background:rgba(31,58,61,.4); z-index:55;
  opacity:0; pointer-events:none; transition:opacity var(--t-mid) var(--ease);
  backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px);
}
.scrim.is-open{ opacity:1; pointer-events:auto; }

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--font-sans); font-weight:600; font-size:1rem;
  padding:15px 28px; border-radius:var(--r-pill); cursor:pointer;
  border:1px solid transparent;
  transition:transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease), background var(--t-fast) var(--ease), color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
  text-decoration:none; white-space:nowrap;
}
.btn:hover{ text-decoration:none; transform:translateY(-1px); }
.btn:active{ transform:translateY(0); }
.btn--primary{ background:var(--c-accent); color:#fff; box-shadow:0 4px 14px rgba(224,122,95,.34); }
.btn--primary:hover{ background:var(--c-accent-dark); color:#fff; box-shadow:0 8px 22px rgba(224,122,95,.42); }
.btn--ghost{ background:transparent; color:var(--c-text); border-color:var(--c-line-strong); }
.btn--ghost:hover{ background:var(--c-text); color:var(--c-bg); border-color:var(--c-text); }
.btn--dark{ background:var(--c-primary); color:#fff; }
.btn--dark:hover{ background:var(--c-primary-dark); color:#fff; }
.btn--inverse{ background:#fff; color:var(--c-text); }
.btn--inverse:hover{ background:var(--c-accent); color:#fff; }
.btn--lg{ padding:18px 34px; font-size:1.05rem; }
.btn .ico{ width:18px; height:18px; }

/* Hero */
.hero{
  position:relative;
  padding:clamp(48px, 6vw, 88px) 0 clamp(56px, 7vw, 96px);
  overflow:hidden;
}
.hero__grid{
  display:grid; gap:48px;
  grid-template-columns:1fr;
  align-items:center;
}
@media (min-width: 980px){
  .hero__grid{ grid-template-columns:1.1fr .9fr; gap:72px; }
}
.hero__media{
  position:relative;
  aspect-ratio: 4 / 5;
  border-radius:var(--r-lg);
  overflow:hidden;
  background:linear-gradient(135deg, #1F3A3D 0%, #265A60 60%, #3D8389 100%);
  box-shadow:var(--shadow-lg);
}
.hero__media img{ width:100%; height:100%; object-fit:cover; }
.hero__media-overlay{
  position:absolute; inset:auto 0 0 0;
  padding:28px 28px 26px; background:linear-gradient(180deg, transparent 0%, rgba(0,0,0,.55) 100%);
  color:#fff;
}
.hero__media-overlay strong{ display:block; font-family:var(--font-serif); font-size:1.25rem; }
.hero__media-overlay span{ color:rgba(255,255,255,.84); font-size:.92rem; }
.hero__badges{ display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.badge{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--c-surface); border:1px solid var(--c-line);
  border-radius:var(--r-pill); padding:8px 14px; font-size:.86rem; color:var(--c-text-soft); font-weight:500;
}
.badge--dot::before{ content:""; width:8px; height:8px; background:var(--c-success); border-radius:50%; display:inline-block; }
.badge--accent{ background:rgba(224,122,95,.12); color:var(--c-accent-dark); border-color:transparent; }

.hero__cta-row{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.hero h1 em{ font-style:italic; color:var(--c-accent-dark); font-weight:400; }

/* Stats banner */
.stats{
  display:grid; gap:28px;
  grid-template-columns:repeat(2, 1fr);
  padding:clamp(48px, 6vw, 80px) 0;
  border-top:1px solid var(--c-line); border-bottom:1px solid var(--c-line);
}
@media (min-width: 720px){ .stats{ grid-template-columns:repeat(4, 1fr); } }
.stat{ text-align:center; }
.stat__num{
  font-family:var(--font-serif); font-size:clamp(2.5rem, 4.4vw, 3.4rem);
  color:var(--c-primary); font-weight:500; letter-spacing:-.02em; line-height:1; font-variation-settings:"opsz" 144;
}
.stat__label{
  font-size:.92rem; color:var(--c-text-muted); margin-top:8px;
  letter-spacing:.04em; text-transform:uppercase; font-weight:600;
}

/* Lead form card */
.lead-card{
  background:var(--c-surface); border:1px solid var(--c-line);
  border-radius:var(--r-lg); padding:clamp(24px, 3vw, 36px);
  box-shadow:var(--shadow-md);
}
.lead-card h3{ font-family:var(--font-serif); font-size:1.6rem; margin:0 0 .3em; }
.lead-card__lede{ color:var(--c-text-soft); margin-bottom:22px; font-size:.96rem; }
.field{ display:flex; flex-direction:column; gap:6px; margin-bottom:16px; }
.field label{ font-size:.84rem; color:var(--c-text-soft); font-weight:500; letter-spacing:.02em; }
.field input, .field select, .field textarea{
  font:inherit; padding:13px 15px; border-radius:var(--r-sm);
  border:1px solid var(--c-line); background:var(--c-surface); color:var(--c-text);
  transition:border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none;
  border-color:var(--c-primary); box-shadow:0 0 0 3px rgba(38,90,96,.16);
}
.consent{ font-size:.78rem; color:var(--c-text-muted); margin:6px 0 16px; line-height:1.5; }
.form-status{ margin-top:14px; font-size:.92rem; font-weight:500; }

/* Card grids */
.grid{ display:grid; gap:22px; }
.grid--2{ grid-template-columns:1fr; }
.grid--3{ grid-template-columns:1fr; }
.grid--4{ grid-template-columns:1fr 1fr; }
@media (min-width: 720px){
  .grid--2{ grid-template-columns:1fr 1fr; }
  .grid--3{ grid-template-columns:repeat(3, 1fr); }
  .grid--4{ grid-template-columns:repeat(4, 1fr); }
}
@media (min-width: 980px){ .grid{ gap:28px; } }

.card{
  position:relative; background:var(--c-surface); border:1px solid var(--c-line);
  border-radius:var(--r-md); padding:26px;
  display:flex; flex-direction:column; gap:10px;
  transition:transform var(--t-fast) var(--ease), box-shadow var(--t-mid) var(--ease), border-color var(--t-fast) var(--ease);
  text-decoration:none; color:inherit;
}
.card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:var(--c-primary-soft); text-decoration:none; }
.card h3{ font-family:var(--font-serif); margin:0; font-size:1.2rem; color:var(--c-text); }
.card p{ margin:0; color:var(--c-text-soft); font-size:.95rem; }
.card__tag{
  display:inline-block; font-size:.74rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--c-accent-dark); padding:0; width:max-content;
}
.card__link{
  margin-top:auto; padding-top:12px;
  font-weight:600; color:var(--c-primary); font-size:.92rem;
  display:inline-flex; align-items:center; gap:6px;
  transition:gap var(--t-fast) var(--ease);
}
.card:hover .card__link{ gap:10px; }
.card__media{
  aspect-ratio: 4 / 3;
  margin:-26px -26px 18px;
  border-radius:var(--r-md) var(--r-md) 0 0;
  overflow:hidden;
}
.card__media img{ width:100%; height:100%; object-fit:cover; transition:transform var(--t-slow) var(--ease); }
.card:hover .card__media img{ transform:scale(1.04); }

/* Placeholder image — graceful fallback when no real photo is set */
.ph{
  width:100%; height:100%;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-serif); font-weight:500;
  background-size:cover; background-position:center;
  position:relative; overflow:hidden;
  color:#fff;
}
.ph::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 30% 20%, rgba(255,255,255,.18) 0%, transparent 50%),
             radial-gradient(circle at 80% 70%, rgba(0,0,0,.16) 0%, transparent 50%);
}
.ph__mono{
  font-size:clamp(2rem, 6vw, 3.4rem); position:relative; z-index:1;
  font-variation-settings:"opsz" 144;
}
.ph--teal{ background:linear-gradient(135deg, #265A60 0%, #1F3A3D 100%); }
.ph--coral{ background:linear-gradient(135deg, #E07A5F 0%, #C25A40 100%); }
.ph--sage{ background:linear-gradient(135deg, #7C9C6E 0%, #4F6E47 100%); }
.ph--gold{ background:linear-gradient(135deg, #C8A063 0%, #8E6F3F 100%); }
.ph--cream{ background:linear-gradient(135deg, #F2E8D8 0%, #D9C9A4 100%); color:var(--c-primary-dark); }

/* Process steps */
.steps{
  display:grid; gap:20px; counter-reset:step;
  grid-template-columns:1fr;
}
@media (min-width: 720px){ .steps{ grid-template-columns:repeat(3, 1fr); gap:24px; } }
.step{
  position:relative; background:var(--c-surface); border:1px solid var(--c-line);
  border-radius:var(--r-md); padding:32px 28px 28px;
  counter-increment:step;
  transition:transform var(--t-fast) var(--ease), box-shadow var(--t-mid) var(--ease);
}
.step:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); }
.step::before{
  content:"0" counter(step);
  position:absolute; top:24px; right:28px;
  font-family:var(--font-serif); font-size:2.4rem; color:var(--c-line-strong); line-height:1;
  font-variation-settings:"opsz" 96;
}
.step h4{ margin:0 0 8px; font-family:var(--font-serif); font-size:1.3rem; font-weight:500; max-width:80%; }
.step p{ margin:0; color:var(--c-text-soft); font-size:.96rem; }

/* Featured story */
.story-feature{
  display:grid; gap:36px;
  grid-template-columns:1fr;
  align-items:center;
}
@media (min-width: 920px){ .story-feature{ grid-template-columns:1fr 1fr; gap:60px; } }
.story-feature__media{
  aspect-ratio: 4 / 5;
  border-radius:var(--r-lg);
  overflow:hidden;
  position:relative;
  box-shadow:var(--shadow-md);
}
.story-feature__media img{ width:100%; height:100%; object-fit:cover; }
.story-feature blockquote{
  margin:0 0 24px; padding:0;
  font-family:var(--font-serif); font-size:clamp(1.5rem, 2.4vw, 2.1rem); line-height:1.3;
  color:var(--c-text); font-weight:500; letter-spacing:-.01em;
  font-style:italic;
}
.story-feature blockquote::before{ content:"\201C"; color:var(--c-accent); font-size:1.4em; line-height:0; vertical-align:-.18em; margin-right:.05em; }
.story-feature blockquote::after{ content:"\201D"; color:var(--c-accent); font-size:1.4em; line-height:0; vertical-align:-.5em; margin-left:.02em; }
.story-feature cite{
  display:flex; align-items:center; gap:14px;
  font-style:normal; color:var(--c-text); font-weight:600;
}
.story-feature cite span{ display:block; color:var(--c-text-muted); font-weight:400; font-size:.92rem; }

/* Patient stories grid */
.stories{
  display:grid; gap:18px;
  grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));
}
.story{
  background:var(--c-surface); border:1px solid var(--c-line);
  border-radius:var(--r-md); overflow:hidden;
  display:flex; flex-direction:column;
  transition:transform var(--t-fast) var(--ease), box-shadow var(--t-mid) var(--ease);
}
.story:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); }
.story__media{ aspect-ratio: 1 / 1; }
.story__body{ padding:18px 20px 20px; }
.story__name{ display:block; font-family:var(--font-serif); font-size:1.15rem; color:var(--c-text); margin-bottom:2px; }
.story__age{ color:var(--c-text-muted); font-size:.86rem; }
.story__diag{ display:block; color:var(--c-primary); font-weight:600; font-size:.9rem; margin-top:8px; }

/* Clinic card — magazine style */
.clinic-feature{
  position:relative; border-radius:var(--r-lg); overflow:hidden;
  background:var(--c-surface-deep); color:#fff;
  aspect-ratio: 5 / 6;
  display:flex; align-items:flex-end;
  text-decoration:none;
  transition:transform var(--t-fast) var(--ease), box-shadow var(--t-mid) var(--ease);
}
.clinic-feature:hover{ transform:translateY(-3px); box-shadow:var(--shadow-lg); text-decoration:none; }
.clinic-feature__media{ position:absolute; inset:0; }
.clinic-feature__media img{ width:100%; height:100%; object-fit:cover; opacity:.55; transition:transform var(--t-slow) var(--ease), opacity var(--t-mid) var(--ease); }
.clinic-feature:hover .clinic-feature__media img{ transform:scale(1.06); opacity:.7; }
.clinic-feature__media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 30%, rgba(31,58,61,.92) 100%);
}
.clinic-feature__body{ position:relative; padding:30px 28px 28px; color:#fff; z-index:1; }
.clinic-feature__city{ font-size:.78rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--c-accent-soft); }
.clinic-feature h3{ color:#fff; font-family:var(--font-serif); margin:8px 0 10px; font-size:1.4rem; }
.clinic-feature p{ color:rgba(255,255,255,.84); font-size:.95rem; margin:0; }

@media (min-width: 980px){
  .clinic-feature--big{ aspect-ratio: 5 / 4; }
  .clinic-feature--big h3{ font-size:2rem; }
}

/* Doctor portrait */
.doctor-grid{
  display:grid; gap:24px;
  grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));
}
.doctor{
  background:var(--c-surface); border-radius:var(--r-md); overflow:hidden;
  border:1px solid var(--c-line);
  text-decoration:none; color:inherit;
  display:flex; flex-direction:column;
  transition:transform var(--t-fast) var(--ease), box-shadow var(--t-mid) var(--ease);
}
.doctor:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); text-decoration:none; }
.doctor__media{ aspect-ratio: 1 / 1; }
.doctor__body{ padding:18px 20px 22px; }
.doctor h3{ font-family:var(--font-serif); font-size:1.15rem; margin:0; color:var(--c-text); }
.doctor__country{ color:var(--c-text-muted); font-size:.86rem; margin-top:2px; }
.doctor__focus-label{ font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--c-accent-dark); margin-top:14px; }
.doctor__focus{ color:var(--c-text-soft); font-size:.92rem; margin-top:4px; line-height:1.45; }

/* Section header */
.section-head{ text-align:center; max-width:48ch; margin:0 auto 56px; }
.section-head--start{ text-align:left; margin-left:0; margin-right:auto; }
.section-head h2{ margin:0; }
.section-head p{ color:var(--c-text-soft); margin:.6em auto 0; }
.section-head--start p{ margin-left:0; }

/* Breadcrumbs */
.crumbs{
  font-size:.84rem; color:var(--c-text-muted); margin:0 0 24px; font-weight:500;
}
.crumbs a{ color:var(--c-text-muted); }
.crumbs a:hover{ color:var(--c-primary); }
.crumbs .sep{ margin:0 .5em; color:var(--c-line-strong); }

/* Page head */
.page-head{ padding:clamp(56px, 7vw, 96px) 0 clamp(28px, 3vw, 40px); }
.page-head h1{ font-size:clamp(2.2rem, 4.4vw, 3.6rem); margin:.2em 0; }
.page-head .lede{ margin-top:.6em; }

/* Numbered list */
.numbered{ list-style:none; padding:0; counter-reset:li;
  display:grid; gap:18px; }
@media (min-width: 720px){ .numbered{ grid-template-columns:1fr 1fr; } }
.numbered li{
  padding:24px 24px 22px 80px; position:relative;
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-md); margin:0;
}
.numbered li::before{
  content:counter(li, decimal-leading-zero); counter-increment:li;
  position:absolute; left:24px; top:22px;
  font-family:var(--font-serif); font-size:1.6rem; color:var(--c-accent); font-weight:600;
}
.numbered li strong{ display:block; font-size:1.05rem; margin-bottom:4px; color:var(--c-text); font-weight:600; }
.numbered li span{ color:var(--c-text-soft); font-size:.94rem; }

/* FAQ accordion */
.faq{ display:grid; gap:10px; }
.faq details{
  border:1px solid var(--c-line); border-radius:var(--r-md);
  padding:0; background:var(--c-surface); overflow:hidden;
  transition:border-color var(--t-fast) var(--ease);
}
.faq details[open]{ box-shadow:var(--shadow-sm); border-color:var(--c-primary-soft); }
.faq summary{
  list-style:none; cursor:pointer;
  padding:22px 26px; font-weight:600; color:var(--c-text); font-size:1.05rem;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  font-family:var(--font-serif); font-weight:500; font-size:1.15rem;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:""; width:22px; height:22px;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E07A5F' stroke-width='2'><path d='M12 5v14M5 12h14'/></svg>") center/contain no-repeat;
  transition:transform var(--t-mid) var(--ease);
}
.faq details[open] summary::after{ transform:rotate(45deg); }
.faq summary:hover{ background:var(--c-bg-warm); }
.faq .answer{ padding:0 26px 22px; color:var(--c-text-soft); font-size:1rem; line-height:1.6; }

/* Disclaimer */
.disclaimer{
  background:var(--c-bg-warm); border-left:4px solid var(--c-accent);
  padding:22px 26px; border-radius:var(--r-sm);
  font-size:.94rem; color:var(--c-text-soft); margin:28px 0;
}
.disclaimer h4{ margin:0 0 8px; color:var(--c-text); font-size:1rem; font-family:var(--font-sans); font-weight:600; }
.disclaimer p{ margin:0; line-height:1.55; }

/* Footer */
.footer{
  background:var(--c-surface-deep); color:rgba(250,246,240,.78); padding:88px 0 32px; margin-top:0;
}
.footer a{ color:rgba(250,246,240,.85); transition:color var(--t-fast) var(--ease); }
.footer a:hover{ color:#fff; }
.footer h4{
  color:#fff; font-size:.78rem; margin:0 0 16px;
  letter-spacing:.16em; text-transform:uppercase; font-family:var(--font-sans); font-weight:700;
}
.footer__grid{
  display:grid; gap:42px; grid-template-columns:1fr;
}
@media (min-width: 760px){ .footer__grid{ grid-template-columns:2fr 1fr 1fr 1.2fr; } }
.footer__brand{
  font-family:var(--font-serif); font-weight:500; color:#fff; font-size:1.5rem;
  margin-bottom:14px; display:flex; align-items:center; gap:10px;
}
.footer__brand .brand__dot{ background:var(--c-accent); box-shadow:0 0 0 3px rgba(224,122,95,.24); }
.footer__brand-sub{ font-size:.95rem; color:rgba(250,246,240,.68); max-width:36ch; }
.footer__list{ list-style:none; padding:0; margin:0; display:grid; gap:10px; font-size:.94rem; }
.footer__bottom{
  border-top:1px solid rgba(255,255,255,.1); margin-top:48px; padding-top:24px;
  font-size:.82rem; color:rgba(250,246,240,.5); text-align:center;
}
.footer .disclaimer{
  background:rgba(255,255,255,.04); border-color:var(--c-accent);
  color:rgba(250,246,240,.7); margin-top:40px;
}
.footer .disclaimer h4{ color:#fff; }

/* Cookie banner */
.cookie-banner{
  position:fixed; left:24px; right:24px; bottom:24px; z-index:80;
  background:var(--c-surface); border:1px solid var(--c-line);
  border-radius:var(--r-md); padding:20px 24px;
  box-shadow:var(--shadow-lg);
  display:flex; flex-wrap:wrap; align-items:center; gap:16px;
  font-size:.94rem; color:var(--c-text-soft);
  max-width:680px; margin:0 auto;
}
.cookie-banner p{ margin:0; flex:1 1 320px; }
.cookie-banner .btns{ display:flex; gap:8px; }
.cookie-banner .btn{ padding:10px 18px; font-size:.9rem; }
.cookie-banner.is-hidden{ display:none; }

/* Floating call-to-action (sticky on scroll, mobile only) */
.float-cta{
  position:fixed; right:20px; bottom:90px; z-index:70;
  background:var(--c-accent); color:#fff;
  padding:14px 22px; border-radius:var(--r-pill);
  font-weight:600; font-size:.95rem;
  box-shadow:0 8px 24px rgba(224,122,95,.42);
  display:flex; align-items:center; gap:8px;
  opacity:0; transform:translateY(20px); pointer-events:none;
  transition:opacity var(--t-mid) var(--ease), transform var(--t-mid) var(--ease);
  text-decoration:none;
}
.float-cta.is-visible{ opacity:1; transform:translateY(0); pointer-events:auto; }
.float-cta:hover{ background:var(--c-accent-dark); color:#fff; text-decoration:none; }
@media (min-width: 920px){ .float-cta{ display:none; } }

/* Category block */
.category-block{ margin-bottom:48px; }
.category-block h2{ font-size:1.6rem; padding-bottom:14px; margin:0 0 24px; border-bottom:2px solid var(--c-line); }

/* Trust / partners strip */
.trust{
  display:flex; flex-wrap:wrap; gap:48px; justify-content:center; align-items:center;
  padding:32px 0; opacity:.7;
}
.trust__item{
  font-family:var(--font-serif); font-size:1.1rem; color:var(--c-text-muted);
  font-weight:500; letter-spacing:.02em;
}

/* Reveal on scroll */
.reveal{ opacity:0; transform:translateY(20px); transition:opacity var(--t-slow) var(--ease), transform var(--t-slow) var(--ease); }
.reveal.is-in{ opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  *{ transition:none !important; animation:none !important; }
}

/* Related links */
.related{ display:grid; gap:12px; grid-template-columns:1fr; }
@media (min-width: 720px){ .related{ grid-template-columns:1fr 1fr; } }
.related a{
  display:flex; align-items:center; justify-content:space-between;
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-md);
  padding:16px 22px; color:var(--c-text); font-weight:500;
  transition:border-color var(--t-fast) var(--ease), transform var(--t-fast) var(--ease);
}
.related a:hover{ border-color:var(--c-primary); transform:translateX(4px); text-decoration:none; }
.related a::after{ content:"→"; color:var(--c-accent); margin-left:12px; }

/* Utilities */
.center{ text-align:center; }
.muted{ color:var(--c-text-muted); }
.small{ font-size:.88rem; }
.mt-0{ margin-top:0; }
.mt-16{ margin-top:16px; }
.mt-24{ margin-top:24px; }
.mt-32{ margin-top:32px; }
.mt-48{ margin-top:48px; }
.row{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; }

/* Accessibility */
:focus-visible{ outline:2px solid var(--c-accent); outline-offset:3px; }
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* Print */
@media print{
  .topbar, .footer, .cookie-banner, .lead-card, .btn, .float-cta{ display:none; }
  body{ font-size:11pt; }
}