/* ============================================================
   Agir & Transformer — site-ottho
   Déclinaison CLAIRE « blanc / rose doré » (demande client, site couple).
   Base : charte-graphique-creme.md (structure, typo, interdits),
   accent action/emphase basculé de l'argile vers le ROSE DORÉ.
   Jamais #FFFFFF / #000000 purs. Fraunces (titres) + Instrument Sans (corps).
   NOTE tokens : les noms --gold* sont conservés pour compatibilité avec les
   styles inline des pages, mais portent désormais le ROSE DORÉ (accent).
   ============================================================ */

:root{
  --black:#FBF5F0;                       /* fond de base blanc rosé chaud */
  --panel:#FAF1EB;                       /* panneau clair */
  --line:#ECDAD2;                        /* filets et séparateurs */
  --card-border:#E6CFC5;                 /* bordure carte rose sable */
  --gold-deep:#8E4F58;                   /* rose doré profond (bordures actives) */
  --gold:#A25E64;                        /* rose doré label / emphase lisible */
  --gold-lite:#B76E79;                   /* rose doré clair (grands titres, italiques) */
  --gold-grad:linear-gradient(135deg,#C4848D,#F0CBBF 45%,#D29A99);
  --sage:#5E6A4A;                        /* sauge positif (fond clair) */
  --sage-lite:#4C5A3A;                   /* sauge texte lisible */
  --rupt:#B0432A;                        /* terracotta négatif */
  --rupt-txt:#8E3418;                    /* terracotta texte lisible */
  --rupt-lite:#8E3418;
  --cream:#3D2B28;                       /* texte principal espresso rosé */
  --muted:#8A7069;                       /* atténué */
  --body:#5C4A44;                        /* corps */
  --r:16px;
  --hdr-h:64px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
img{height:auto}
body{
  background:radial-gradient(120% 120% at 50% -10%, #FFFDF9, #F7E9E2 62%, #FBF5F0) fixed var(--black);
  color:var(--body);
  font-family:'Instrument Sans',system-ui,sans-serif;
  font-size:16.5px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:var(--gold);text-decoration:none}
a:hover{color:var(--gold-deep)}
:focus-visible{outline:2px solid var(--gold-deep);outline-offset:2px}
::selection{background:#EFC9C2;color:var(--cream)}

h1,h2,h3,.serif{font-family:'Fraunces',Georgia,serif;font-weight:600;line-height:1.15;letter-spacing:-0.02em;color:var(--cream)}
h1{font-size:clamp(38px,5vw,58px)}
h2{font-size:clamp(28px,3.4vw,40px)}
h3{font-size:clamp(20px,2.2vw,25px);line-height:1.3}
em,.it{font-family:'Fraunces',Georgia,serif;font-style:italic;color:var(--gold-lite)}
p{max-width:64ch}

.wrap{max-width:1160px;margin-inline:auto;padding-inline:24px}
section.wrap:not(.hero){padding-block:108px}
/* Deux sections claires qui se suivent cumulaient 216 px de vide : on ne garde
   que l'espace de la première. Les bandes colorées (.band) gardent le leur,
   elles ont besoin de respirer pour marquer la rupture de fond. */
section.wrap:not(.hero) + section.wrap:not(.hero){padding-top:0}
section .sec-head{margin-bottom:48px}
.eyebrow{
  display:inline-block;font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold);margin-bottom:16px;
}
.lede{font-size:19px;color:#6B554E;line-height:1.75;max-width:60ch}
.lede b,.lede strong{color:var(--cream)}

/* ---------- Boutons ---------- */
.btn,.btn-ghost{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;padding:12px 26px;border-radius:999px;
  font-weight:600;font-size:16px;line-height:1;cursor:pointer;border:0;
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.btn{background:var(--gold-grad);color:#40282B;box-shadow:0 10px 26px rgba(150,80,80,.18)}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(150,80,80,.26);filter:brightness(1.03);color:#40282B}
.btn:active{transform:translateY(0);filter:brightness(.96)}
.btn-ghost{background:transparent;color:var(--gold);border:1px solid var(--gold-deep)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold-deep);transform:translateY(-2px)}
.btn-note{display:block;margin-top:12px;font-size:13.5px;color:var(--muted)}

/* ---------- Header ---------- */
header#hdr{
  position:sticky;top:0;z-index:100;height:var(--hdr-h);
  display:flex;align-items:center;
  background:rgba(255,253,249,.82);backdrop-filter:blur(12px);
  border-bottom:1px solid transparent;
  transition:border-color .2s ease, box-shadow .2s ease;
}
header#hdr.scrolled{border-bottom-color:var(--line);box-shadow:0 8px 30px rgba(150,95,80,.12)}
.hdr-in{max-width:1160px;margin-inline:auto;padding-inline:24px;width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:19px;color:var(--cream)}
.brand:hover{color:var(--gold-deep)}
nav.main{display:flex;align-items:center;gap:8px}
nav.main > ul{display:flex;align-items:center;gap:4px;list-style:none}
nav.main a.nav-link, nav.main .sub-toggle{
  display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:8px 14px;border-radius:10px;
  color:var(--cream);font-size:15.5px;font-weight:400;background:none;border:0;cursor:pointer;
  font-family:inherit;
}
nav.main a.nav-link:hover, nav.main .sub-toggle:hover{color:var(--gold-deep);background:rgba(183,110,121,.08)}
nav.main .caret{font-size:10px;color:var(--muted);transition:transform .18s ease}
li.has-sub{position:relative;list-style:none}
li.has-sub .sub{
  position:absolute;top:calc(100% + 6px);left:0;min-width:250px;
  background:#FFFDF9;border:1px solid var(--line);border-radius:14px;
  padding:8px;list-style:none;
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .18s ease, transform .18s ease, visibility .18s;
  box-shadow:0 18px 44px rgba(150,95,80,.18);
}
li.has-sub:hover .sub, li.has-sub:focus-within .sub{opacity:1;visibility:visible;transform:translateY(0)}
li.has-sub:hover .caret{transform:rotate(180deg)}
.sub a{display:block;padding:10px 14px;border-radius:9px;color:var(--cream);font-size:15px}
.sub a:hover{background:rgba(183,110,121,.08);color:var(--gold-deep)}
.sub a.sub-hub{color:var(--gold);font-weight:600;border-bottom:1px solid var(--line);border-radius:9px 9px 0 0;margin-bottom:4px}
.hdr-cta{white-space:nowrap}
.burger{
  display:none;background:none;border:1px solid var(--line);border-radius:10px;
  width:44px;height:44px;color:var(--cream);font-size:20px;cursor:pointer;
}

/* ---------- Hero ---------- */
.hero{padding-block:96px 108px}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:56px;align-items:center}
.hero .lede{margin-top:20px}
.hero-cta{display:flex;flex-wrap:wrap;gap:16px;margin-top:36px;align-items:center}
.hero-visual{position:relative}
.hero-visual img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 30%;border-radius:22px;border:1px solid var(--card-border);box-shadow:0 34px 72px rgba(150,95,50,.22)}
.hero-proof{display:flex;gap:16px;margin-top:40px}
.tile{
  flex:1;min-width:150px;background:linear-gradient(180deg,#FFFDF9,#FAF0EA);
  border:1px solid var(--card-border);border-radius:var(--r);padding:20px 22px;
  box-shadow:0 10px 28px rgba(150,95,50,.055);
}
.tile b{display:block;font-family:'Fraunces',Georgia,serif;font-size:27px;color:var(--gold);font-weight:600}
.tile span{font-size:14px;color:var(--muted)}
.hero-sub .eyebrow{margin-bottom:12px}
.hero-short{padding-block:88px 24px}
.hero-short h1{max-width:20ch}

/* ---------- Hero cinématique (accueil) ---------- */
.hero-cine{position:relative;min-height:clamp(560px,86vh,860px);display:flex;align-items:flex-end;overflow:hidden}
.hero-cine-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% center;filter:saturate(.96) contrast(1.02)}
.hero-cine::after{content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg, rgba(251,245,240,.96) 0%, rgba(251,245,240,.72) 38%, rgba(251,245,240,.18) 62%, rgba(251,245,240,0) 100%),
    linear-gradient(0deg, rgba(251,245,240,.82), rgba(251,245,240,.12) 46%, transparent 64%);}
.hero-cine-inner{position:relative;z-index:2;width:100%;max-width:1160px;margin-inline:auto;padding:120px 24px clamp(48px,7vh,84px)}
.hero-cine h1{max-width:17ch;margin:0;font-size:clamp(40px,5.4vw,64px)}
.hero-cine em{white-space:nowrap}
.hero-cine .lede{margin-top:22px;max-width:52ch}
.hero-cine-actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:34px;align-items:center}
.hero-cine .hero-proof{margin-top:40px;max-width:520px}
@media (max-width:820px){
  .hero-cine{min-height:clamp(520px,80vh,760px)}
  .hero-cine-bg{object-position:70% center}
  .hero-cine::after{background:linear-gradient(0deg, rgba(251,245,240,.94) 0%, rgba(251,245,240,.55) 46%, rgba(251,245,240,.08) 72%)}
  .hero-cine-inner{padding-top:80px}
  .hero-cine em{white-space:normal}
}
@media (max-width:560px){
  .hero-cine .hero-proof{flex-direction:row}
  .hero-cine-actions .btn,.hero-cine-actions .btn-ghost{width:100%}
}

/* ---------- Cartes ---------- */
.grid-2,.grid-3,.grid-4{display:grid;gap:24px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.split-13{display:grid;gap:32px;align-items:center;grid-template-columns:1fr 2fr}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.card{
  background:linear-gradient(180deg,#FFFDF9,#FAF0EA);
  border:1px solid var(--line);border-radius:var(--r);padding:28px;
  box-shadow:0 10px 28px rgba(150,95,50,.055);
  transition:transform .2s ease, border-color .2s ease;
}
.card:hover{transform:translateY(-4px);border-color:var(--card-border)}
.card h3{margin-bottom:10px}
.card p{font-size:15.5px;color:var(--body)}
.card.quote p{font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:18.5px;color:var(--cream);line-height:1.5}
.tmoin-sig{margin-top:16px !important;font-family:'Instrument Sans',sans-serif;font-style:normal;font-size:14px;color:var(--gold);font-weight:600}
img[src*="/schema-"]{border:0 !important;box-shadow:none;border-radius:16px}
.schema-fig{margin:28px auto 0;max-width:720px}
.schema-fig img{display:block;width:100%;border-radius:16px}
/* Section en deux colonnes : le texte d'un côté, le schéma de l'autre.
   `.sec-media.rev` inverse l'ordre pour alterner d'une section à l'autre. */
.sec-media{display:grid;gap:40px;align-items:center;grid-template-columns:1fr 1fr}
.sec-media .schema-fig{margin:0;max-width:none}
.sec-media .sec-head{margin-bottom:0}
.sec-media > div > .lede{margin-top:16px}
.sec-media.rev > :last-child{order:-1}
/* full-bleed rhythm bands */
.band{padding-block:108px}
.band-white{background:#FFFDF9}
.band-cream{background:#F4E9E1}
.band-blush{background:radial-gradient(130% 130% at 50% -10%,#FBEBED,#FBF5F0 72%)}
/* open numbered ladder (replaces boxed cards) */
.ladder{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin-top:56px}
/* L'encart produit qui suit l'échelle des étapes respire davantage. */
.ladder + .encart-rn{margin-top:56px}

/* ── Règles de rythme communes à tout le site ──────────────────────────────
   Un paragraphe d'introduction suivi d'une grille de blocs a besoin d'une
   respiration franche, sinon le texte et les blocs se lisent comme un seul
   pavé. Vaut pour l'échelle numérotée, les étapes, les stades et les grilles
   de cartes, sur toutes les pages. */
p.lede + .ladder,
p.lede + .steps,
p.lede + .stades,
p.lede + .grid-2,
p.lede + .grid-3,
p.lede + .grid-4,
p.lede + .cmp-wrap,
p.lede + .art-grid{margin-top:56px}

/* Deux blocs pleine largeur de type bannière ne doivent jamais s'enchaîner
   sans respiration : si le cas se présente, on force au moins l'écart. */
.final + .final,
.encart-rn + .final,
.final + .encart-rn{margin-top:56px}
.lstep{display:flex;gap:18px;align-items:flex-start}
.lstep-n{font-family:'Fraunces',Georgia,serif;font-size:44px;line-height:.85;color:var(--gold-lite);flex:0 0 auto}
.lstep h3{margin-bottom:6px}
.lstep p{font-size:15px;color:var(--body)}
.encart-rn{border:1px solid var(--gold-deep);border-radius:24px;background:radial-gradient(120% 140% at 12% 0%,#FBEFEA,#F5E1D7);padding:48px;box-shadow:0 12px 32px rgba(150,95,50,.09)}
.encart-rn h2{max-width:24ch}
.encart-rn .lede{max-width:60ch}
.rn-price{font-family:'Fraunces',Georgia,serif;font-weight:600;color:var(--gold-deep);font-size:18px}
@media(max-width:560px){.encart-rn{padding:32px 24px}}
.card .k{display:inline-flex;width:40px;height:40px;border-radius:10px;align-items:center;justify-content:center;
  border:1px solid var(--card-border);color:var(--gold);margin-bottom:16px;font-size:18px}

/* ---------- Chips ---------- */
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.chip{
  padding:8px 16px;border-radius:999px;font-size:14.5px;font-weight:600;
  border:1px solid #E3C0B9;color:var(--gold-deep);background:rgba(183,110,121,.07);
}
.chip.eco{border-color:rgba(94,106,74,.4);color:var(--sage-lite);background:rgba(94,106,74,.07)}

/* ---------- Stades ---------- */
.stades{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.stade{border-radius:var(--r);padding:28px;border:1px solid var(--line);background:linear-gradient(180deg,#FFFDF9,#FAF0EA);box-shadow:0 22px 50px rgba(150,95,50,.10)}
.stade .tag{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  padding:5px 12px;border-radius:999px;margin-bottom:16px}
.stade h3{margin-bottom:8px}
.stade p{font-size:15px;color:var(--body)}
.stade.s-sage{border-color:rgba(94,106,74,.4)}
.stade.s-sage .tag{color:var(--sage-lite);border:1px solid rgba(94,106,74,.45);background:rgba(94,106,74,.07)}
.stade.s-gold{border-color:var(--card-border)}
.stade.s-gold .tag{color:var(--gold-deep);border:1px solid #E3C0B9;background:rgba(183,110,121,.07)}
.stade.s-rupt{border-color:rgba(176,67,42,.4)}
.stade.s-rupt .tag{color:var(--rupt-txt);border:1px solid rgba(176,67,42,.45);background:rgba(176,67,42,.07)}

/* ---------- Étapes numérotées ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;counter-reset:step}
.step{position:relative;padding:28px;border:1px solid var(--line);border-radius:var(--r);background:#FFFDF9;box-shadow:0 22px 50px rgba(150,95,50,.08)}
.step::before{
  counter-increment:step;content:"0" counter(step);
  display:block;font-family:'Fraunces',Georgia,serif;font-size:15px;color:var(--gold);
  letter-spacing:.1em;margin-bottom:14px;
}
.step h3{font-size:19px;margin-bottom:8px}
.step p{font-size:15px;color:var(--body)}

/* ---------- Offres ---------- */
.offer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;align-items:stretch}
.offer-card{
  display:flex;flex-direction:column;gap:12px;
  background:linear-gradient(180deg,#FFFDF9,#FAF0EA);
  border:1px solid var(--line);border-radius:var(--r);padding:28px;
  box-shadow:0 10px 28px rgba(150,95,50,.055);
  transition:transform .2s ease, border-color .2s ease;
}
.offer-card:hover{transform:translateY(-4px);border-color:var(--card-border)}
.offer-card.phare{border-color:var(--gold-deep);box-shadow:0 0 0 1px rgba(142,79,88,.3), 0 24px 60px rgba(150,80,80,.18)}
.badge{align-self:flex-start;font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:#40282B;background:var(--gold-grad);padding:5px 12px;border-radius:999px}
.offer-card h3{font-size:21px}
.price{font-family:'Fraunces',Georgia,serif;font-size:34px;color:var(--gold);font-weight:600}
.price small{font-size:14px;color:var(--muted);font-family:'Instrument Sans',sans-serif;font-weight:400}
.offer-card .who{font-size:15px;color:var(--body);flex-grow:1}
.offer-card .dur{font-size:13.5px;color:var(--gold);letter-spacing:.04em}
.inc-list{list-style:none;display:grid;gap:12px;margin-top:8px}
.inc-list li{position:relative;padding-left:30px;font-size:15.5px;color:var(--body)}
.inc-list li b{color:var(--cream)}
.inc-list li::before{content:"";position:absolute;left:0;top:7px;width:16px;height:16px;border-radius:50%;
  border:1px solid var(--gold-deep);background:rgba(183,110,121,.1)}
.inc-list li::after{content:"";position:absolute;left:5px;top:11px;width:6px;height:4px;
  border-left:1.5px solid var(--gold-deep);border-bottom:1.5px solid var(--gold-deep);transform:rotate(-45deg)}

/* ---------- Tableau comparatif ---------- */
.cmp-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);box-shadow:0 22px 50px rgba(150,95,50,.08)}
table.cmp{width:100%;border-collapse:collapse;min-width:680px;background:#FFFDF9}
.cmp th,.cmp td{padding:16px 18px;text-align:left;font-size:15px;border-bottom:1px solid var(--line)}
.cmp thead th{font-family:'Fraunces',Georgia,serif;font-size:16px;color:var(--gold);font-weight:600}
.cmp tbody tr:last-child td{border-bottom:0}
.cmp td{color:var(--body)}
.cmp td:first-child,.cmp th:first-child{color:var(--cream)}
.cmp .hl{background:rgba(183,110,121,.06)}

/* ---------- FAQ ---------- */
.faq{max-width:760px}
.faq-item{border:1px solid var(--line);border-radius:14px;margin-bottom:12px;background:#FFFDF9;overflow:hidden}
.faq-q{
  width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:18px 22px;background:none;border:0;cursor:pointer;text-align:left;
  color:var(--cream);font-size:16.5px;font-weight:600;font-family:inherit;min-height:44px;
}
.faq-q::after{content:"+";font-family:'Fraunces',Georgia,serif;font-size:22px;color:var(--gold);transition:transform .2s ease}
.faq-item.open .faq-q::after{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .25s ease;padding-inline:22px}
.faq-a p{padding-bottom:18px;font-size:15.5px;color:var(--body)}

/* ---------- Formulaires ---------- */
form .field{margin-bottom:20px}
form label{display:block;font-size:14px;font-weight:600;color:var(--cream);margin-bottom:8px;letter-spacing:.02em}
input,select,textarea{
  width:100%;min-height:48px;padding:12px 16px;border-radius:12px;
  background:#FFFDF9;border:1px solid var(--card-border);color:var(--cream);
  font-family:inherit;font-size:16px;
  transition:border-color .18s ease;
}
textarea{min-height:110px;resize:vertical;line-height:1.6}
input::placeholder,textarea::placeholder{color:#B29A92}
input:focus,select:focus,textarea:focus{border-color:var(--gold-deep);outline:none}
input.invalid{border-color:var(--rupt)}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);
  background-position:calc(100% - 21px) 22px,calc(100% - 15px) 22px;background-size:6px 6px;background-repeat:no-repeat}
.rdv-form{max-width:560px;background:var(--panel);border:1px solid var(--card-border);border-radius:var(--r);padding:36px;box-shadow:0 22px 50px rgba(150,95,50,.12)}
.form-note{font-size:13.5px;color:var(--muted);margin-top:14px}
.form-ok{display:none;max-width:560px;border:1px solid rgba(94,106,74,.45);background:rgba(94,106,74,.07);
  border-radius:var(--r);padding:32px;color:var(--sage-lite);font-size:16.5px}
.form-ok.show{display:block}
.form-ok b{color:var(--cream)}

/* ---------- Quiz diagnostic ---------- */
.quiz{max-width:640px}
.quiz-progress{height:6px;border-radius:999px;background:#F0DED7;margin-bottom:36px;overflow:hidden}
.quiz-progress i{display:block;height:100%;width:0;background:var(--gold-grad);transition:width .3s ease}
.quiz-step{display:none}
.quiz-step.active{display:block}
.quiz-step h3{font-size:clamp(21px,2.6vw,27px);margin-bottom:24px}
.quiz-opts{display:grid;gap:12px}
.quiz-opt{
  text-align:left;padding:16px 20px;min-height:52px;border-radius:14px;cursor:pointer;
  background:#FFFDF9;border:1px solid var(--line);color:var(--cream);font-size:16px;font-family:inherit;
  transition:border-color .15s ease, background .15s ease, transform .15s ease;
}
.quiz-opt:hover{border-color:var(--gold-deep);background:rgba(183,110,121,.05);transform:translateY(-1px)}
.quiz-result{display:none}
.quiz-result.show{display:block}
.result-card{border-radius:var(--r);padding:36px;border:1px solid var(--line);background:#FFFDF9;margin-bottom:28px;box-shadow:0 22px 50px rgba(150,95,50,.10)}
.result-card .tag{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  padding:6px 14px;border-radius:999px;margin-bottom:18px}
.result-card.s-sage{border-color:rgba(94,106,74,.45)}
.result-card.s-sage .tag{color:var(--sage-lite);border:1px solid rgba(94,106,74,.45)}
.result-card.s-gold{border-color:var(--card-border)}
.result-card.s-gold .tag{color:var(--gold-deep);border:1px solid #E3C0B9}
.result-card.s-rupt{border-color:rgba(176,67,42,.45)}
.result-card.s-rupt .tag{color:var(--rupt-txt);border:1px solid rgba(176,67,42,.45)}
.result-card h3{margin-bottom:10px}
.result-card p{color:var(--body)}

/* ---------- Articles / ressources ---------- */
.art-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.art-card{
  display:flex;flex-direction:column;border-radius:var(--r);overflow:hidden;
  background:linear-gradient(180deg,#FFFDF9,#FAF0EA);border:1px solid var(--line);
  box-shadow:0 10px 28px rgba(150,95,50,.055);
  transition:transform .2s ease, border-color .2s ease;color:var(--cream);
}
.art-card:hover{transform:translateY(-4px);border-color:var(--card-border)}
.art-thumb{width:100%;aspect-ratio:16/10;object-fit:cover;border-bottom:1px solid var(--line)}
.art-body{display:flex;flex-direction:column;gap:10px;padding:24px}
.art-card .rt{font-size:13px;color:var(--gold);letter-spacing:.06em}
.art-card h3{font-size:20px}
.art-card p{font-size:15px;color:var(--body)}
.art-link{margin-top:6px;align-self:flex-start;font-weight:600;font-size:15px;color:var(--gold-deep)}
.art-card:hover .art-link{color:var(--gold)}

/* liste à croix (négatif, symétrique de .inc-list) */
.no-list{list-style:none;display:grid;gap:12px;margin-top:8px}
.no-list li{position:relative;padding-left:30px;font-size:15.5px;color:var(--body)}
.no-list li::before{content:"";position:absolute;left:0;top:7px;width:16px;height:16px;border-radius:50%;
  border:1px solid var(--rupt);background:rgba(176,67,42,.1)}
.no-list li::after{content:"\00d7";position:absolute;left:0;top:6px;width:16px;height:16px;line-height:16px;
  text-align:center;color:var(--rupt-txt);font-size:14px;font-weight:700}
.article{max-width:720px}
.article h2{font-size:clamp(23px,2.6vw,29px);margin:56px 0 18px}
.article p{margin-bottom:20px;color:var(--body)}
.article p b,.article p strong{color:var(--cream)}
.article .scene{
  border:1px solid var(--card-border);border-radius:14px;background:var(--panel);
  padding:24px 26px;margin:28px 0;font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:17.5px;color:var(--cream);
}
.enc{border:1px solid var(--card-border);border-radius:var(--r);background:rgba(183,110,121,.05);padding:26px;margin:36px 0}
.enc h3{font-size:17px;color:var(--gold);margin-bottom:10px}

/* ---------- Légal ---------- */
.legal-body{max-width:720px}
.legal-body h2{font-size:21px;margin:40px 0 12px}
.legal-body p{margin-bottom:16px;font-size:15.5px;color:var(--body)}
.legal-body p b{color:var(--cream)}

/* ---------- Bande CTA finale ---------- */
.final{
  border:1px solid var(--card-border);border-radius:24px;
  background:radial-gradient(120% 140% at 50% 0%, #F9ECE6, #F1E2D6);
  padding:64px 48px;text-align:center;
  box-shadow:0 12px 32px rgba(150,95,50,.07);
}
.final h2{max-width:22ch;margin-inline:auto}
.final .lede{margin:16px auto 0}
.final .hero-cta{justify-content:center}

/* ---------- Footer ---------- */
footer.foot{border-top:1px solid var(--line);background:#F8EDE7;margin-top:108px}
.foot-in{max-width:1160px;margin-inline:auto;padding:64px 24px 40px}
.foot-cols{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:32px}
.foot h4{font-family:'Fraunces',Georgia,serif;font-size:16px;color:var(--gold);font-weight:600;margin-bottom:16px}
.foot ul{list-style:none;display:grid;gap:10px}
.foot ul a{color:#7C645C;font-size:14.5px}
.foot ul a:hover{color:var(--gold-deep)}
.foot .brand{font-size:21px;margin-bottom:12px;display:block}
.foot .mentions{margin-top:48px;padding-top:24px;border-top:1px solid var(--line);font-size:13.5px;color:var(--muted);max-width:none}
.foot .mentions b{color:var(--cream)}

/* ---------- Barre sticky de conversion ---------- */
.sticky-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:90;
  transform:translateY(130%);transition:transform .32s cubic-bezier(.4,0,.2,1);
  background:rgba(255,253,249,.92);backdrop-filter:blur(14px);
  border-top:1px solid var(--card-border);
  box-shadow:0 -12px 34px rgba(150,95,80,.14);
}
.sticky-bar.show{transform:translateY(0)}
.sticky-in{max-width:1160px;margin-inline:auto;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.sticky-txt{font-size:15.5px;color:var(--body);margin:0;max-width:none;line-height:1.4}
.sticky-txt b{color:var(--cream);font-family:'Fraunces',Georgia,serif;font-weight:600}
.sticky-bar .btn{white-space:nowrap;flex-shrink:0}
@media (max-width:640px){
  .sticky-txt{display:none}
  .sticky-in{justify-content:center;padding:10px 16px}
  .sticky-bar .btn{width:100%}
}

/* ---------- Reveal ---------- */
html.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .5s ease, transform .5s ease}
html.js .reveal.in{opacity:1;transform:none}

/* ---------- Accessibilité ---------- */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
  html{scroll-behavior:auto}
}
[id]{scroll-margin-top:calc(var(--hdr-h) + 16px)}

/* ---------- Responsive ---------- */
@media (max-width: 1020px){
  .grid-4,.offer-grid{grid-template-columns:repeat(2,1fr)}
  .foot-cols{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 900px){
  .burger{display:flex;align-items:center;justify-content:center}
  nav.main{
    position:fixed;inset:var(--hdr-h) 0 auto 0;max-height:calc(100dvh - var(--hdr-h));overflow:auto;
    background:#FFFDF9;border-bottom:1px solid var(--line);
    display:none;padding:16px 24px 28px;
  }
  nav.main.open{display:block}
  nav.main > ul{flex-direction:column;align-items:stretch;gap:2px}
  nav.main a.nav-link,nav.main .sub-toggle{width:100%;justify-content:flex-start;padding:12px 10px;font-size:17px}
  li.has-sub .sub{
    position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;
    border:0;background:none;padding:0 0 8px 14px;min-width:0;
  }
  .sub a{font-size:15.5px;color:#7C645C;padding:9px 10px}
  .sub a.sub-hub{border-bottom:0;margin-bottom:0}
  .hdr-cta{display:none}
  nav.main .nav-cta-m{display:inline-flex;margin-top:14px;width:100%}
}
@media (min-width: 901px){ nav.main .nav-cta-m{display:none} }
@media (max-width: 820px){
  section.wrap:not(.hero){padding-block:64px}
  section.wrap:not(.hero) + section.wrap:not(.hero){padding-top:0}
  .hero{padding-block:56px 64px}
  .hero-grid{grid-template-columns:1fr;gap:40px}
  .grid-3,.stades,.steps{grid-template-columns:1fr}
  .grid-2,.art-grid,.split-13,.ladder,.sec-media{grid-template-columns:1fr}
  .sec-media.rev > :last-child{order:0}
  .band{padding-block:64px}
  .hero-proof{flex-direction:row}
  .final{padding:48px 24px}
  footer.foot{margin-top:64px}
}
@media (max-width: 560px){
  .grid-4,.offer-grid,.foot-cols{grid-template-columns:1fr}
  .hero-cta .btn,.hero-cta .btn-ghost{width:100%}
}