/* ============================================================================
   Cryopad — Design system V2 (pages internes)
   Auto-hébergé, sans Tailwind CDN. Direction : Tech / médical épuré
   (taste-skill dials VARIANCE 5 · MOTION 2 · DENSITY 5 · Soft-Structuralism).
   Thème verrouillé : clair (cream) pour le contenu, midnight pour hero + footer.
   Accent UNIQUE = gold. Ice/Amber = sémantique froid/chaud uniquement.
   Typo de marque : Fraunces (titres) + Outfit (corps) — exception documentée (CLAUDE.md).
   Nav : géométrie identique à index.html (pleine largeur, padding 28/40, onglets gap 32).
   ========================================================================== */

:root {
  /* Surfaces (neutres teintés, jamais #000/#fff purs) */
  --midnight:       #05080d;            /* noir profond, identique au hero homepage */
  --midnight-deep:  #03050a;            /* footer / bandeau réponse, un cran plus sombre */
  --cream:          oklch(0.963 0.012 84);
  --cream-2:        oklch(0.945 0.014 84);
  --paper:          oklch(0.992 0.006 84);

  --ink:            oklch(0.27 0.03 252);
  --ink-soft:       oklch(0.44 0.02 252);
  --ink-faint:      oklch(0.57 0.015 252);
  --on-dark:        oklch(0.975 0.008 84);
  --on-dark-soft:   oklch(0.975 0.008 84 / 0.70);
  --on-dark-faint:  oklch(0.975 0.008 84 / 0.42);

  --gold:           oklch(0.74 0.065 80);
  --gold-strong:    oklch(0.67 0.075 78);
  --gold-tint:      oklch(0.74 0.065 80 / 0.12);

  --ice:            oklch(0.68 0.075 245);
  --ice-tint:       oklch(0.68 0.075 245 / 0.12);
  --amber:          oklch(0.68 0.115 52);
  --amber-tint:     oklch(0.68 0.115 52 / 0.12);

  --hair:           oklch(0.24 0.035 252 / 0.10);
  --hair-2:         oklch(0.24 0.035 252 / 0.06);
  --hair-dark:      oklch(0.975 0.008 84 / 0.12);

  /* Ombres diffuses teintées (jamais noir pur) */
  --shadow-soft:    0 24px 60px -28px oklch(0.24 0.035 252 / 0.30), 0 4px 14px -8px oklch(0.24 0.035 252 / 0.12);
  --shadow-lift:    0 36px 80px -32px oklch(0.24 0.035 252 / 0.38), 0 8px 20px -10px oklch(0.24 0.035 252 / 0.16);
  --inset-hi:       inset 0 1px 0 oklch(0.99 0.006 84 / 0.7);

  /* Rayon unique (système cohérent) */
  --r: 16px;  --r-sm: 10px;  --r-lg: 28px;  --r-pill: 999px;

  /* Rythme (DENSITY 5 mais hero/section généreux) */
  --section-y: clamp(5rem, 10vw, 9rem);
  --gut: clamp(1.25rem, 5vw, 2.5rem);
  --nav-pad-x: clamp(20px, 4vw, 40px);

  --ease: cubic-bezier(0.32, 0.72, 0, 1);   /* physique, pas linear/ease-in-out */
  --ease-soft: cubic-bezier(0.22, 1, 0.36, 1);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Outfit', system-ui, -apple-system, sans-serif;
  color: var(--ink); background: var(--cream); line-height: 1.65;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
h1, h2, h3, h4 { font-family: 'Fraunces', Georgia, serif; font-weight: 600; line-height: 1.05; letter-spacing: -0.018em; }
a { color: inherit; }
img, svg, video { display: block; max-width: 100%; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; border-radius: 4px; }
.tnum { font-variant-numeric: tabular-nums; }

.wrap { width: 100%; max-width: 1200px; margin-inline: auto; padding-inline: var(--gut); }
.wrap--narrow { max-width: 760px; }
.wrap--mid { max-width: 980px; }
.lede, .prose p { max-width: 66ch; }

/* ============================================================================
   NAV — géométrie IDENTIQUE à index.html (pleine largeur) + givre
   ========================================================================== */
.site-nav {
  position: fixed; top: 0; left: 0; width: 100%; z-index: 100;
  background: transparent;
  transition: background 0.5s var(--ease), box-shadow 0.5s var(--ease), backdrop-filter 0.5s var(--ease);
}
.site-nav.is-scrolled {
  background: rgba(5, 8, 13, 0.85);
  backdrop-filter: blur(16px) saturate(125%);
  -webkit-backdrop-filter: blur(16px) saturate(125%);
  box-shadow: 0 6px 26px oklch(0.16 0.03 252 / 0.40);
}
.site-nav__frost {
  position: absolute; inset: 0; pointer-events: none; overflow: hidden; opacity: 0;
  transition: opacity 0.7s var(--ease);
  background-image:
    radial-gradient(circle at 12% 32%, oklch(0.92 0.04 245 / 0.55) 0 1.1px, transparent 1.6px),
    radial-gradient(circle at 27% 68%, oklch(0.92 0.04 245 / 0.40) 0 1px,   transparent 1.5px),
    radial-gradient(circle at 46% 24%, oklch(0.95 0.02 245 / 0.50) 0 1.2px, transparent 1.7px),
    radial-gradient(circle at 64% 66%, oklch(0.92 0.04 245 / 0.35) 0 1px,   transparent 1.5px),
    radial-gradient(circle at 82% 34%, oklch(0.95 0.02 245 / 0.45) 0 1.1px, transparent 1.6px),
    radial-gradient(circle at 94% 70%, oklch(0.92 0.04 245 / 0.40) 0 1px,   transparent 1.5px);
}
.site-nav:hover .site-nav__frost, .site-nav.is-scrolled .site-nav__frost { opacity: 0.9; }
.site-nav::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--ice) 22%, var(--gold) 50%, var(--amber) 78%, transparent);
  opacity: 0; transition: opacity 0.7s var(--ease);
}
.site-nav:hover::after, .site-nav.is-scrolled::after { opacity: 0.5; }

/* layout = index.html : pleine largeur, padding 28px 40px, space-between */
.site-nav__inner {
  position: relative; z-index: 1;
  display: flex; align-items: center; justify-content: space-between;
  padding: 28px var(--nav-pad-x); gap: 1.5rem;
}
.brand { display: flex; align-items: center; gap: 11px; text-decoration: none; flex-shrink: 0; }
.brand img { width: 38px; height: 38px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 1px var(--hair-dark); }
.brand__name { display: block; font-family: 'Fraunces', serif; font-weight: 700; font-size: 16px; letter-spacing: 0.04em; color: var(--on-dark); line-height: 1.08; }
.brand__sub  { display: block; font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: var(--gold); }

.nav-menu { display: flex; align-items: center; gap: 32px; list-style: none; }
.nav-menu__item { position: relative; }
.nav-link {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 13.5px; color: var(--on-dark-soft); text-decoration: none; letter-spacing: 0.01em;
  white-space: nowrap; transition: color 0.25s var(--ease), opacity 0.25s var(--ease);
}
.nav-link:hover { color: var(--on-dark); }
.nav-link[aria-current="page"] { color: var(--on-dark); }
.nav-link--accent { color: var(--gold); font-weight: 600; }
.nav-link__caret { width: 11px; height: 11px; opacity: 0.5; transition: transform 0.25s var(--ease); }
.nav-menu__item:hover .nav-link__caret { transform: rotate(180deg); }
.nav-link--lang { font-size: 12px; letter-spacing: 0.12em; color: var(--on-dark-faint); }

.nav-dd {
  position: absolute; top: calc(100% + 12px); left: 50%; transform: translateX(-50%) translateY(8px);
  min-width: 246px; padding: 8px; opacity: 0; visibility: hidden;
  background: rgba(9, 12, 19, 0.97); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  border: 1px solid var(--hair-dark); border-radius: var(--r); box-shadow: var(--shadow-lift);
  transition: opacity 0.25s var(--ease), transform 0.25s var(--ease), visibility 0.25s;
}
.nav-dd::before { content: ''; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
.nav-menu__item:hover .nav-dd, .nav-menu__item:focus-within .nav-dd { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.nav-dd a { display: block; padding: 9px 13px; font-size: 13px; color: var(--on-dark-soft); text-decoration: none; border-radius: var(--r-sm); transition: color 0.15s, background 0.15s; }
.nav-dd a:hover { color: var(--on-dark); background: oklch(0.975 0.008 84 / 0.07); }
.nav-dd hr { border: 0; border-top: 1px solid var(--hair-dark); margin: 6px 8px; }

/* CTA = pilule gold + icône en pastille (button-in-button) */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-family: 'Outfit', sans-serif; font-weight: 600; font-size: 14px; letter-spacing: 0.01em;
  padding: 11px 14px 11px 22px; border-radius: var(--r-pill); text-decoration: none; cursor: pointer;
  border: 1px solid transparent; white-space: nowrap;
  transition: transform 0.4s var(--ease), box-shadow 0.4s var(--ease), background 0.3s var(--ease), color 0.3s, border-color 0.3s;
}
.btn--primary { background: var(--gold); color: var(--midnight); box-shadow: 0 10px 24px -12px oklch(0.74 0.065 80 / 0.7); }
.btn--primary:hover { background: var(--gold-strong); transform: translateY(-2px); box-shadow: 0 16px 34px -14px oklch(0.74 0.065 80 / 0.8); }
.btn:active { transform: translateY(0) scale(0.985); }
.btn--ghost { background: transparent; color: var(--on-dark); border-color: var(--on-dark-faint); padding: 11px 22px; }
.btn--ghost:hover { border-color: var(--gold); color: var(--gold); }
.btn--lg { font-size: 15px; padding: 13px 16px 13px 26px; }
.btn--plain { padding: 11px 22px; }
.btn__ico { width: 30px; height: 30px; border-radius: 50%; background: oklch(0.24 0.035 252 / 0.12); display: grid; place-items: center; flex-shrink: 0; transition: transform 0.4s var(--ease), background 0.3s; }
.btn--lg .btn__ico { width: 34px; height: 34px; }
.btn:hover .btn__ico { transform: translate(2px, -1px); }

/* CTA nav = géométrie identique à index.html (rectangle r6, 13px, sans icône) */
.nav-cta { flex-shrink: 0; border-radius: 6px; padding: 10px 20px; font-size: 13px; letter-spacing: 0.06em; box-shadow: none; }
.nav-cta .btn__ico { display: none; }
.nav-cta:hover { transform: none; box-shadow: none; background: var(--gold-strong); }

/* Burger mobile (morph en X) */
.nav-burger { display: none; background: none; border: 0; color: var(--on-dark); padding: 8px; border-radius: var(--r-sm); cursor: pointer; }
.nav-burger:hover { background: oklch(0.975 0.008 84 / 0.08); }
.mobile-menu { display: none; position: relative; z-index: 1; background: rgba(9, 12, 19, 0.98); border-top: 1px solid var(--hair-dark); padding: 8px var(--nav-pad-x) 20px; }
.mobile-menu.is-open { display: block; }
.mobile-menu a { display: block; padding: 12px 4px; font-size: 15px; color: var(--on-dark-soft); text-decoration: none; border-bottom: 1px solid var(--hair-dark); }
.mobile-menu a:hover { color: var(--gold); }
.mobile-menu .btn { display: flex; margin-top: 16px; }

/* ============================================================================
   HERO — split (texte + visuel réel), pas de hero centré générique
   ========================================================================== */
.hero { position: relative; overflow: hidden; background: var(--midnight); color: var(--on-dark); padding-top: clamp(7rem, 12vh, 9.5rem); padding-bottom: var(--section-y); }
.hero::before, .hero::after { content: ''; position: absolute; width: 32rem; height: 32rem; border-radius: 50%; filter: blur(100px); pointer-events: none; }
.hero::before { top: -9rem; right: -7rem; background: var(--ice); opacity: 0.14; }
.hero::after  { bottom: -11rem; left: -9rem; background: var(--amber); opacity: 0.10; }
.hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.05fr 0.95fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.hero__grid--center { grid-template-columns: 1fr; max-width: 880px; margin-inline: auto; text-align: center; }
.hero h1 { font-size: clamp(2.5rem, 5.5vw, 4.4rem); margin: 1.1rem 0 1.2rem; color: var(--on-dark); }
.hero .lede { font-size: clamp(1.05rem, 1.5vw, 1.22rem); color: var(--on-dark-soft); margin-bottom: 2rem; }
.hero__grid--center .lede { margin-inline: auto; }
.hero__actions { display: flex; gap: 14px; flex-wrap: wrap; }
.hero__grid--center .hero__actions { justify-content: center; }

/* visuel hero en double-bezel (cadre machiné) */
.shell { background: oklch(0.975 0.008 84 / 0.05); border: 1px solid var(--hair-dark); border-radius: var(--r-lg); padding: 8px; box-shadow: var(--shadow-lift); }
.shell > * { border-radius: calc(var(--r-lg) - 8px); }
.hero__media { position: relative; }
.hero__media img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }

/* eyebrow — pilule discrète (usage restreint : ≤1 / 3 sections) */
.eyebrow { display: inline-block; font-size: 11px; font-weight: 600; letter-spacing: 0.24em; text-transform: uppercase; color: var(--gold); padding: 6px 14px; border: 1px solid oklch(0.74 0.065 80 / 0.35); border-radius: var(--r-pill); background: oklch(0.975 0.008 84 / 0.04); }
.section .eyebrow { background: var(--gold-tint); border-color: transparent; }

/* bandeau réponse directe (GEO) */
.answer { background: var(--midnight-deep); color: var(--on-dark-soft); }
.answer .wrap { padding-block: 2.25rem; }
.answer p { text-align: center; font-size: clamp(1rem, 1.4vw, 1.12rem); max-width: 80ch; margin-inline: auto; }
.answer strong { color: var(--on-dark); font-weight: 600; }

/* ============================================================================
   SECTIONS + familles de layout (≥4 différentes / page)
   ========================================================================== */
.section { padding-block: var(--section-y); }
.section--cream { background: var(--cream); }
.section--paper { background: var(--paper); }
.section--cream2 { background: var(--cream-2); }
.section--midnight { background: var(--midnight); color: var(--on-dark); }
.section--midnight h2, .section--midnight h3 { color: var(--on-dark); }

.section-head { max-width: 680px; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.section-head--center { margin-inline: auto; text-align: center; }
.section-head h2 { font-size: clamp(2rem, 4vw, 3.1rem); margin-top: 0.8rem; color: var(--ink); }
.section--midnight .section-head h2 { color: var(--on-dark); }
.section-head p { margin-top: 1rem; color: var(--ink-soft); font-size: 1.08rem; }
.section--midnight .section-head p { color: var(--on-dark-soft); }

/* Famille A — split image/texte (alternable .split--rev) */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.split--rev .split__media { order: 2; }
.split__media img { width: 100%; aspect-ratio: 5/4; object-fit: cover; }
.split__body h2 { font-size: clamp(1.8rem, 3.4vw, 2.7rem); margin-bottom: 1rem; }
.split__body p { color: var(--ink-soft); }
.section--midnight .split__body p { color: var(--on-dark-soft); }

/* Famille B — bento (cellules à nombre exact, tailles variées) */
.bento { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1.1rem; }
.bento > * { grid-column: span 3; }
.bento .cell--wide { grid-column: span 4; }
.bento .cell--narrow { grid-column: span 2; }
.bento .cell--full { grid-column: span 6; }

/* Carte (double-bezel léger, hairline + ombre diffuse) */
.card { position: relative; background: var(--paper); border: 1px solid var(--hair); border-radius: var(--r); padding: clamp(1.5rem, 2.6vw, 2rem); box-shadow: var(--shadow-soft); transition: transform 0.4s var(--ease), box-shadow 0.4s var(--ease); }
.card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lift); }
.card__ico { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; margin-bottom: 1.1rem; color: var(--gold); background: var(--gold-tint); }
.card__ico--ice { color: var(--ice); background: var(--ice-tint); }
.card__ico--amber { color: var(--amber); background: var(--amber-tint); }
.card h3 { font-size: 1.22rem; margin-bottom: 0.5rem; color: var(--ink); }
.card p { color: var(--ink-soft); font-size: 0.95rem; }
.card--media { padding: 8px; overflow: hidden; }
.card--media img { width: 100%; height: 100%; min-height: 180px; object-fit: cover; border-radius: calc(var(--r) - 8px); }
.section--midnight .card { background: oklch(0.975 0.008 84 / 0.045); border-color: var(--hair-dark); }
.section--midnight .card h3 { color: var(--on-dark); }
.section--midnight .card p { color: var(--on-dark-soft); }

/* Famille C — liste divisée (filets), pas de cartes clones */
.divided { display: grid; gap: 0; }
.divided > * { padding: 1.6rem 0; border-top: 1px solid var(--hair); display: grid; grid-template-columns: minmax(0,0.9fr) minmax(0,1.6fr); gap: 1.5rem; align-items: start; }
.divided > *:last-child { border-bottom: 1px solid var(--hair); }
.divided h3 { font-size: 1.25rem; color: var(--ink); }
.divided p { color: var(--ink-soft); font-size: 0.97rem; }
.section--midnight .divided > * { border-color: var(--hair-dark); }
@media (max-width: 680px) { .divided > * { grid-template-columns: 1fr; gap: 0.5rem; } }

/* Famille D — process numéroté */
.steps { display: grid; gap: clamp(1.5rem, 3vw, 2.5rem); grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.step__num { font-family: 'Fraunces', serif; font-size: 2.6rem; font-weight: 600; color: oklch(0.74 0.065 80 / 0.5); line-height: 1; font-variant-numeric: tabular-nums; }
.step h3 { font-size: 1.12rem; margin: 0.7rem 0 0.4rem; }
.step p { font-size: 0.92rem; color: var(--on-dark-soft); }

/* Famille E — stat band (chiffres clés, tabular) */
.statband { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: clamp(1.5rem, 4vw, 3rem); }
.stat { text-align: left; }
.stat__n { font-family: 'Fraunces', serif; font-size: clamp(2.4rem, 5vw, 3.4rem); font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; line-height: 1; }
.section--midnight .stat__n { color: var(--on-dark); }
.stat__l { margin-top: 0.5rem; color: var(--ink-soft); font-size: 0.92rem; }
.section--midnight .stat__l { color: var(--on-dark-soft); }

/* Schéma intégration "Cryopad inside" */
.diagram { display: flex; align-items: stretch; justify-content: center; flex-wrap: wrap; gap: 0.75rem; }
.diagram__node { display: flex; flex-direction: column; justify-content: center; gap: 0.5rem; text-align: center; background: var(--paper); border: 1px solid var(--hair); border-radius: var(--r); padding: 1.5rem 1.6rem; min-width: 168px; box-shadow: var(--shadow-soft); }
.diagram__node strong { font-family: 'Fraunces', serif; font-size: 1.05rem; color: var(--ink); }
.diagram__node span { font-size: 0.82rem; color: var(--ink-faint); }
.diagram__chip { font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); font-weight: 600; }
.diagram__arrow { display: grid; place-items: center; color: var(--gold); flex-shrink: 0; }
@media (max-width: 680px) { .diagram { flex-direction: column; align-items: stretch; } .diagram__arrow { transform: rotate(90deg); } }

/* Tableau technique (épuré, médical) */
.table { width: 100%; border-collapse: collapse; background: var(--paper); border: 1px solid var(--hair); border-radius: var(--r); overflow: hidden; font-variant-numeric: tabular-nums; }
.table th, .table td { padding: 1rem 1.3rem; text-align: left; border-bottom: 1px solid var(--hair); font-size: 0.95rem; }
.table thead th { background: var(--midnight); color: var(--on-dark); font-family: 'Fraunces', serif; font-weight: 600; }
.table tbody tr:last-child td { border-bottom: 0; }
.table tbody tr:nth-child(even) td { background: oklch(0.24 0.035 252 / 0.02); }
.table td:first-child { font-weight: 500; color: var(--ink); }
.table .yes { color: var(--ice); font-weight: 600; }
.table .no { color: var(--ink-faint); }

/* Thermal pair (ice/amber sémantiques) */
.thermal { display: grid; gap: 1.2rem; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.thermal__panel { border-radius: var(--r); padding: clamp(1.7rem, 3vw, 2.4rem); border: 1px solid var(--hair); background: var(--paper); box-shadow: var(--shadow-soft); }
.thermal__panel--cold { border-top: 3px solid var(--ice); }
.thermal__panel--hot  { border-top: 3px solid var(--amber); }
.thermal__tag { display: inline-block; font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700; margin-bottom: 0.8rem; }
.thermal__panel--cold .thermal__tag { color: var(--ice); }
.thermal__panel--hot .thermal__tag { color: var(--amber); }
.thermal__panel h3 { font-size: 1.5rem; margin-bottom: 0.6rem; }
.thermal__panel p { color: var(--ink-soft); font-size: 0.97rem; }

/* Preuves crédibilité */
.proofbar { display: flex; flex-wrap: wrap; gap: clamp(1rem, 4vw, 3rem); justify-content: center; align-items: center; }
.proof { display: flex; align-items: center; gap: 0.65rem; color: var(--ink-soft); font-size: 0.92rem; }
.section--midnight .proof { color: var(--on-dark-soft); }
.proof svg { color: var(--gold); flex-shrink: 0; }
.proof strong { color: var(--ink); font-weight: 600; }
.section--midnight .proof strong { color: var(--on-dark); }

/* FAQ */
.faq { max-width: 1060px; margin-inline: auto; display: grid; grid-template-columns: 1fr 1fr; column-gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.faq details { border-top: 1px solid var(--hair); padding: 1.15rem 0; }
@media (max-width: 760px) { .faq { grid-template-columns: 1fr; } }
.faq summary { font-family: 'Fraunces', serif; font-size: 1.12rem; color: var(--ink); cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; color: var(--gold); font-size: 1.5rem; line-height: 1; transition: transform 0.35s var(--ease); }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { margin-top: 0.8rem; color: var(--ink-soft); font-size: 0.97rem; }

/* CTA final */
.cta-panel { background: var(--paper); border: 1px solid var(--hair); border-radius: var(--r-lg); padding: clamp(2rem, 5vw, 3.2rem); text-align: center; max-width: 640px; margin-inline: auto; box-shadow: var(--shadow-soft); }
.cta-panel .mailtxt { color: var(--ink-faint); font-size: 0.8rem; margin-top: 1.4rem; }

/* Prose (mentions légales) */
.prose h2 { font-size: 1.5rem; margin: 2.2rem 0 0.8rem; color: var(--ink); }
.prose h3 { font-size: 1.15rem; margin: 1.6rem 0 0.5rem; color: var(--ink); }
.prose p, .prose li { color: var(--ink-soft); margin-bottom: 0.7rem; }
.prose ul { padding-left: 1.2rem; }
.prose a { color: var(--gold-strong); text-decoration: underline; text-underline-offset: 2px; }

/* ============================================================================
   FOOTER (simple, classique) — partagé homepage + pages internes
   ========================================================================== */
.site-footer { background: var(--midnight-deep); color: var(--on-dark-soft); padding-top: clamp(3rem, 6vw, 4.5rem); padding-bottom: 1.6rem; border-top: 1px solid var(--hair-dark); }
.footer-top { display: grid; gap: 2.5rem; grid-template-columns: 1.5fr 1fr 1fr; align-items: start; margin-bottom: 2.5rem; }
.footer-brand .brand { margin-bottom: 1rem; }
.footer-brand p { color: var(--on-dark-faint); font-size: 0.9rem; max-width: 40ch; margin-bottom: 1.3rem; }
.footer-col h4 { font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); margin-bottom: 1rem; font-family: 'Outfit', sans-serif; font-weight: 600; }
.footer-col ul { list-style: none; display: grid; gap: 0.6rem; }
.footer-col a { color: var(--on-dark-soft); text-decoration: none; font-size: 0.92rem; transition: color 0.2s; }
.footer-col a:hover { color: var(--gold); }
.footer-bottom { border-top: 1px solid var(--hair-dark); padding-top: 1.4rem; display: flex; flex-wrap: wrap; gap: 0.6rem; justify-content: space-between; align-items: center; color: var(--on-dark-faint); font-size: 0.78rem; }
.footer-bottom .disclaimer { color: oklch(0.975 0.008 84 / 0.34); }

/* ============================================================================
   REVEAL (fade-up + blur léger, MOTION 2)
   ========================================================================== */
.reveal { opacity: 0; transform: translateY(28px); filter: blur(6px); transition: opacity 0.8s var(--ease-soft), transform 0.8s var(--ease-soft), filter 0.8s var(--ease-soft); }
.reveal.visible { opacity: 1; transform: translateY(0); filter: blur(0); }

/* ============================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 1000px) {
  .nav-menu, .nav-cta { display: none; }
  .nav-burger { display: inline-flex; }
  .hero__grid { grid-template-columns: 1fr; text-align: left; }
  .hero__media { order: -1; max-width: 460px; }
  .split { grid-template-columns: 1fr; }
  .split--rev .split__media { order: -1; }
  .bento > *, .bento .cell--wide, .bento .cell--narrow { grid-column: span 6; }
  .footer-top { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) { .footer-top { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; filter: none; transition: none; }
  .site-nav__frost, .site-nav::after { transition: none; }
}