@import url("tokens.css");
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap");

/* ============ base ============ */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--v-texte);
  font-size: 16.5px;
  line-height: 1.65;
  color: #1B2033;
  background: var(--v-blanc-casse);
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }

h1, h2, h3, .serif {
  font-family: var(--v-titre);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -0.01em;
  margin: 0;
}
h1 { font-size: clamp(2.6rem, 5.6vw, 4.6rem); }
h2 { font-size: clamp(2rem, 3.6vw, 3.1rem); }
h3 { font-size: 1.3rem; }
p  { margin: 0 0 1.1em; }

.wrap { width: min(100% - 3rem, var(--v-page)); margin-inline: auto; }
.eyebrow {
  font-size: .72rem; letter-spacing: .22em; text-transform: uppercase;
  color: var(--v-or); font-weight: 600; margin-bottom: 1.1rem; display: block;
}
.eyebrow--pale { color: var(--v-or-clair); }
.lead { font-size: 1.12rem; color: #3A4257; max-width: 62ch; }
.muted { color: var(--v-gris); }

/* filet doré */
.rule-gold { height: 1px; background: var(--v-or-degrade); border: 0; margin: 0; }

/* ============ boutons ============ */
.btn {
  display: inline-flex; align-items: center; gap: .6rem;
  padding: .95rem 1.7rem; border: 1px solid transparent; border-radius: var(--v-rayon);
  font-size: .82rem; letter-spacing: .13em; text-transform: uppercase; font-weight: 600;
  cursor: pointer; transition: background .25s, color .25s, border-color .25s;
}
.btn--gold { background: var(--v-or-degrade); color: #2A1802; }
.btn--gold:hover { filter: brightness(1.08); }
.btn--marine { background: var(--v-marine); color: #fff; }
.btn--marine:hover { background: var(--v-marine-clair); }
.btn--ghost { border-color: rgba(255,255,255,.4); color: #fff; }
.btn--ghost:hover { border-color: var(--v-or-clair); color: var(--v-or-clair); }
.btn--ghost-dark { border-color: var(--v-gris-bord); color: var(--v-marine); }
.btn--ghost-dark:hover { border-color: var(--v-or); color: var(--v-or-fonce); }

/* ============ en-tête ============ */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(0,15,61,.96); backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(208,128,8,.35);
}
.site-header__inner { display: flex; align-items: center; gap: 2rem; padding: .9rem 0; }
.site-header__logo img { height: 38px; width: auto; }
.nav { margin-left: auto; display: flex; align-items: center; gap: 1.9rem; }
.nav a {
  color: #E8E9EE; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase;
  padding-bottom: 3px; border-bottom: 1px solid transparent; transition: .2s;
}
.nav a:hover, .nav a[aria-current="page"] { color: var(--v-or-clair); border-bottom-color: var(--v-or); }
.nav .btn { color: #2A1802; }
.burger { display: none; background: none; border: 0; color: #fff; font-size: 1.5rem; cursor: pointer; }

/* ============ hero ============ */
.hero {
  position: relative; overflow: hidden; color: #fff;
  background:
    radial-gradient(120% 90% at 78% 15%, #0A2A8C 0%, transparent 60%),
    linear-gradient(160deg, #001868 0%, #000F3D 72%);
}
.hero::after {
  content: ""; position: absolute; inset: auto 0 0 0; height: 1px; background: var(--v-or-degrade);
}
.hero__inner {
  display: grid; grid-template-columns: 1.05fr .95fr; gap: 3rem; align-items: center;
  padding: clamp(3.5rem, 8vw, 7rem) 0 clamp(3rem, 6vw, 5.5rem);
}
.hero h1 { color: #fff; }
.hero h1 em { font-style: normal; color: var(--v-or-clair); }
.hero__lead { color: #C7CCDA; font-size: 1.15rem; max-width: 46ch; margin-top: 1.6rem; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2.4rem; }
.hero__proof { display: flex; gap: 1.8rem; margin-top: 3.2rem; flex-wrap: wrap; }
.hero__proof div { border-left: 1px solid rgba(208,128,8,.5); padding-left: .9rem; }
.hero__proof b { display: block; font-family: var(--v-titre); font-size: 1.6rem; white-space: nowrap; color: var(--v-or-clair); }
.hero__proof span { font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: #9AA3BB; }

.bottles { position: relative; display: flex; justify-content: center; align-items: flex-end; }
.bottles img { filter: drop-shadow(0 30px 45px rgba(0,0,0,.45)); }
.bottles img:nth-of-type(1) { width: 32%; transform: translateY(14px) rotate(-3deg); z-index: 1; }
.bottles img:nth-of-type(2) { width: 40%; margin-inline: -3%; z-index: 3; }
.bottles img:nth-of-type(3) { width: 33%; transform: translateY(14px) rotate(3deg); z-index: 2; }

/* ============ sections ============ */
section { padding: clamp(3.5rem, 7vw, 6.5rem) 0; }
.section-head { max-width: 70ch; margin-bottom: 3rem; }
.section-head h2 { color: var(--v-marine); }
.section--marine { background: var(--v-marine-profond); color: #E8E9EE; }
.section--marine h2 { color: #fff; }
.section--marine .lead { color: #B9C0D2; }
.section--white { background: #fff; }

/* bandeau chiffres */
.stats { display: grid; grid-template-columns: repeat(4, 1fr); }
.stats div { padding: 2.2rem 1.4rem; text-align: center; border-left: 1px solid rgba(208,128,8,.35); }
.stats div:first-child { border-left: 0; }
.stats b { display: block; font-family: var(--v-titre); font-size: clamp(2rem,3.4vw,2.9rem); color: var(--v-or-clair); }
.stats span { font-size: .74rem; letter-spacing: .13em; text-transform: uppercase; color: #9AA3BB; }

/* cartes produit */
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; }
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.6rem; }
.card {
  background: #fff; border: 1px solid var(--v-gris-bord); border-radius: var(--v-rayon);
  padding: 2rem 1.8rem 1.8rem; display: flex; flex-direction: column;
  transition: border-color .25s, transform .25s;
}
.card:hover { border-color: var(--v-or); transform: translateY(-3px); }
.card__media { height: 250px; display: grid; place-items: center; margin-bottom: 1.4rem; overflow: hidden; }
.card__media img { height: 250px; width: auto; max-width: 100%; object-fit: contain; }
.card h3 { color: var(--v-marine); }
.card__meta { font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: var(--v-or); margin: .5rem 0 .9rem; }
.card p { font-size: .95rem; color: #4A5165; }
.card__foot { margin-top: auto; padding-top: 1.2rem; border-top: 1px solid var(--v-gris-bord); font-size: .85rem; color: var(--v-gris); }

/* secteurs */
.sector { border-top: 1px solid var(--v-gris-bord); padding: 2rem 0; display: grid; grid-template-columns: 5rem 1fr 14rem; gap: 2rem; align-items: start; }
.sector__num { font-family: var(--v-titre); font-size: 2.2rem; color: var(--v-or); line-height: 1; }
.sector h3 { color: var(--v-marine); margin-bottom: .5rem; }
.sector p { margin: 0; font-size: .97rem; color: #4A5165; }
.sector ul { margin: 0; padding-left: 1.1rem; font-size: .9rem; color: var(--v-gris); }

/* liste à puces dorées */
.ticks { list-style: none; margin: 0; padding: 0; }
.ticks li { position: relative; padding-left: 1.7rem; margin-bottom: .8rem; }
.ticks li::before {
  content: ""; position: absolute; left: 0; top: .62em; width: 10px; height: 1px;
  background: var(--v-or-degrade);
}

/* tableau */
.table { width: 100%; border-collapse: collapse; font-size: .93rem; background: #fff; }
.table th, .table td { text-align: left; padding: .95rem 1.1rem; border-bottom: 1px solid var(--v-gris-bord); }
.table th { font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--v-marine); background: #FAF9F6; }
.table tr:hover td { background: #FBFAF7; }
.table-scroll { overflow-x: auto; border: 1px solid var(--v-gris-bord); border-radius: var(--v-rayon); }

/* formulaire */
.form { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.2rem; }
.field { display: flex; flex-direction: column; gap: .45rem; }
.field--full { grid-column: 1 / -1; }
label { font-size: .74rem; letter-spacing: .13em; text-transform: uppercase; color: var(--v-marine); font-weight: 600; }
input, select, textarea {
  font-family: inherit; font-size: .97rem; color: inherit;
  padding: .85rem 1rem; border: 1px solid var(--v-gris-bord); border-radius: var(--v-rayon);
  background: #fff; transition: border-color .2s;
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--v-or); }
textarea { min-height: 130px; resize: vertical; }
.form__note { font-size: .82rem; color: var(--v-gris); }

/* pied de page */
.site-footer { background: var(--v-marine-profond); color: #AEB6CA; padding: 4rem 0 2rem; font-size: .92rem; }
.site-footer h4 { font-size: .74rem; letter-spacing: .15em; text-transform: uppercase; color: var(--v-or-clair); margin: 0 0 1.1rem; }
.site-footer a:hover { color: var(--v-or-clair); }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 2.5rem; }
.site-footer img { height: 34px; margin-bottom: 1.2rem; }
.footer-bottom { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.12); display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; font-size: .82rem; color: #7E88A2; }

/* bandeau d'appel */
.cta-band { background: var(--v-marine); color: #fff; text-align: center; }
.cta-band h2 { color: #fff; margin-bottom: 1rem; }
.cta-band p { color: #C7CCDA; max-width: 58ch; margin-inline: auto; }

/* apparition */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.reveal.is-in { opacity: 1; transform: none; }

/* ============ responsive ============ */
@media (max-width: 960px) {
  .hero__inner { grid-template-columns: 1fr; }
  .bottles { order: -1; }
  .bottles img { width: 30% !important; }
  .grid-3, .grid-2, .footer-grid { grid-template-columns: 1fr 1fr; }
  .stats { grid-template-columns: 1fr 1fr; }
  .stats div:nth-child(3) { border-left: 0; }
  .sector { grid-template-columns: 3rem 1fr; }
  .sector ul { grid-column: 2; }
}
@media (max-width: 680px) {
  .nav { position: fixed; inset: 64px 0 auto; flex-direction: column; align-items: flex-start;
         gap: 1.2rem; padding: 1.6rem 1.5rem 2rem; background: var(--v-marine-profond);
         border-bottom: 1px solid rgba(208,128,8,.35); display: none; }
  .nav.is-open { display: flex; }
  .burger { display: block; margin-left: auto; }
  .grid-3, .grid-2, .footer-grid, .form { grid-template-columns: 1fr; }
  .stats { grid-template-columns: 1fr 1fr; }
}

/* ============ v2 — halo héros, prix, parfums, tarifs ============ */

/* chiffres lisibles : figures alignées (pas de chiffres "à l'ancienne" facon I/O) */
.stats b, .hero__proof b, .chip b, .price b, .price small, .card__tag, .ibc__price,
.bottles__badge b, .sector__num, h1, h2, h3, .serif {
  font-variant-numeric: lining-nums proportional-nums;
  font-feature-settings: "lnum" 1, "pnum" 1;
}
.table, .table th, .table td { font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: "lnum" 1, "tnum" 1; }

/* halo derrière le flacon central + vague basse */
.hero__inner { position: relative; z-index: 2; }
.hero__halo {
  position: absolute; z-index: 0; right: 12%; top: 46%; width: 46%; aspect-ratio: 1;
  transform: translateY(-50%);
  background: radial-gradient(closest-side, rgba(255,213,74,.20), rgba(255,213,74,0) 70%);
  pointer-events: none;
}
.hero__wave { position: absolute; inset: auto 0 0 0; z-index: 1; width: 100%; height: 90px;
  opacity: .5; pointer-events: none; }
.bottles { z-index: 2; }
.bottles__badge {
  position: absolute; z-index: 4; left: 4%; top: 8%;
  width: 96px; height: 96px; border-radius: 50%;
  background: var(--v-or-degrade); color: #2A1802;
  display: grid; place-items: center; text-align: center; line-height: 1;
  box-shadow: 0 10px 24px rgba(0,0,0,.35); rotate: -8deg;
}
.bottles__badge b { font-family: var(--v-titre); font-size: 2rem; display: block; }
.bottles__badge span { font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; font-weight: 700; }

/* chips prix dans le héros */
.hero__chips { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.8rem; }
.chip {
  display: inline-flex; align-items: baseline; gap: .45rem;
  padding: .5rem .9rem; border: 1px solid rgba(255,213,74,.4); border-radius: 100px;
  font-size: .78rem; letter-spacing: .04em; color: #DCE1EE; background: rgba(255,255,255,.04);
}
.chip b { font-family: var(--v-titre); font-size: 1.05rem; color: var(--v-or-clair); }

/* prix sur cartes claires */
.price { margin: .1rem 0 1rem; display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; }
.price b { font-family: var(--v-titre); font-size: 1.7rem; font-weight: 600; color: var(--v-marine);
  line-height: 1; }
.price small { font-size: .82rem; color: var(--v-gris); }
.price .price__from { font-size: .68rem; letter-spacing: .16em; text-transform: uppercase;
  color: var(--v-or); font-weight: 700; width: 100%; margin-bottom: -.1rem; }

/* étiquettes de parfums */
.parfums { display: flex; flex-wrap: wrap; gap: .45rem; margin: 0 0 1.1rem; padding: 0; list-style: none; }
.parfums li { font-size: .76rem; padding: .3rem .75rem; border: 1px solid var(--v-gris-bord);
  border-radius: 100px; color: var(--v-marine); background: #FAF9F6; }

/* carte "sans photo" — cartouche de format */
.card__tag { display: inline-grid; place-items: center; height: 74px; width: 74px; border-radius: 50%;
  border: 1px solid var(--v-or); color: var(--v-or-fonce); font-family: var(--v-titre);
  font-size: 1.15rem; font-weight: 600; margin-bottom: 1.2rem; text-align: center; line-height: 1.05; }

/* colonne prix mise en avant dans les tableaux */
.table td.is-price, .table th.is-price { color: var(--v-marine); font-weight: 600;
  background: #FBF7EE; border-left: 1px solid var(--v-gris-bord); }
.table td.is-price { font-family: var(--v-titre); font-size: 1.02rem; }
.table caption { caption-side: top; text-align: left; font-size: .8rem; color: var(--v-gris);
  padding: 0 0 .8rem; }

/* bandeau note tarifaire */
.tarif-note { display: flex; gap: 1rem; align-items: flex-start; margin-top: 1.4rem;
  padding: 1.1rem 1.3rem; border: 1px solid var(--v-gris-bord); border-left: 3px solid var(--v-or);
  border-radius: var(--v-rayon); background: #fff; font-size: .9rem; color: #4A5165; }
.tarif-note b { color: var(--v-marine); }

/* bannière photo avec voile marine */
.banner { position: relative; margin: 0; border-radius: var(--v-rayon); overflow: hidden;
  border: 1px solid var(--v-gris-bord); }
.banner::before { content:""; position:absolute; inset:0; z-index:0;
  background: var(--bimg) center/cover no-repeat; filter: blur(34px) brightness(.82) saturate(1.05); transform: scale(1.15); }
.banner img { position:relative; z-index:1; width: 100%; height: clamp(220px, 34vw, 430px); object-fit: contain; display: block; }
.banner figcaption { position: absolute; left: 0; right: 0; bottom: 0; z-index:2;
  background: linear-gradient(transparent, rgba(0,15,61,.88));
  color: #E8E9EE; font-size: .88rem; letter-spacing: .01em; padding: 3rem 1.5rem 1rem; }
.banner figcaption b { color: var(--v-or-clair); }

/* ruban IBC */
.ibc { display: grid; grid-template-columns: 1.1fr .9fr; gap: 2.4rem; align-items: center;
  background: var(--v-marine-voile); border: 1px solid rgba(208,128,8,.3);
  border-radius: var(--v-rayon); padding: 2.4rem; }
.ibc h3 { color: #fff; }
.ibc__price { font-family: var(--v-titre); font-size: 1.9rem; color: var(--v-or-clair); }
.ibc__art { display: grid; place-items: center; }
.ibc__art svg { width: 100%; max-width: 260px; height: auto; }
.ibc__art img { width: 100%; border-radius: var(--v-rayon); border: 1px solid rgba(208,128,8,.35); display: block; }

@media (max-width: 960px) {
  .hero__halo { right: 4%; width: 60%; }
  .bottles__badge { width: 76px; height: 76px; }
  .bottles__badge b { font-size: 1.5rem; }
  .ibc { grid-template-columns: 1fr; gap: 1.6rem; }
  .ibc__art { order: -1; }
}

/* ═══════════════════════════════════════════════════════════════
   v3 — refonte « MANIFESTE » : couche donnée mono (ticket / étiquette
   d'expédition), photos plein cadre, filets or. Signature = le mono.
   ═══════════════════════════════════════════════════════════════ */
:root{
  --v-titre: "Manrope", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  --v-texte: "Manrope", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  --v-mono:  "Manrope", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  --v-marine-nuit: #00092E;
  --v-encre: #12172B;
}
html, body { overflow-x: hidden; }
body { color: var(--v-encre); }

/* — la couche « donnée » en mono — */
.eyebrow{
  font-family: var(--v-mono); font-weight: 700; font-size: .68rem;
  letter-spacing: .22em; text-transform: uppercase;
  display: inline-flex; align-items: center; gap: .7rem;
}
.eyebrow::before{ content:""; width: 26px; height: 2px; background: var(--v-or-degrade); flex: none; }
.eyebrow--pale::before{ background: var(--v-or-clair); }

.btn{ font-family: var(--v-mono); font-weight: 700; letter-spacing: .12em; font-size: .74rem; border-radius: 0; }
.card__meta{ font-family: var(--v-mono); font-weight: 700; letter-spacing: .12em; font-size: .68rem; }
.card__foot{ font-family: var(--v-mono); font-size: .74rem; letter-spacing: .02em; }
.stats span, .hero__proof span{ font-family: var(--v-mono); font-weight: 700; letter-spacing: .16em; }
.parfums li{ font-family: var(--v-mono); font-size: .68rem; letter-spacing: .04em; border-radius: 0; }
.table th{ font-family: var(--v-mono); letter-spacing: .1em; }
.form__note, label{ font-family: var(--v-mono); }
label{ font-size: .66rem; letter-spacing: .14em; }

/* — coins légèrement adoucis (moins brut) — */
:root{ --v-rayon: 7px; }
.card, .table-scroll, .ibc, .ibc__art img, .tarif-note, .price-chip{ border-radius: var(--v-rayon) !important; }
.banner{ border-radius: 0 !important; }

/* — héros : plus profond, plus affirmé — */
.hero{
  background:
    radial-gradient(120% 90% at 82% 12%, #0A2A8C 0%, transparent 55%),
    linear-gradient(158deg, #001A72 0%, var(--v-marine-nuit) 78%);
}
.hero h1{ font-weight: 600; letter-spacing: -.015em; }
.hero__lead{ font-size: 1.18rem; }

/* chips = étiquettes ticket mono */
.hero__chips{ gap: 0; border: 1px solid rgba(255,213,74,.28); width: fit-content; max-width: 100%; flex-wrap: wrap; }
.chip{
  font-family: var(--v-mono); font-size: .72rem; letter-spacing: .02em; border: 0;
  border-right: 1px solid rgba(255,213,74,.22); background: transparent; padding: .7rem 1.1rem;
}
.chip:last-child{ border-right: 0; }
.chip b{ font-family: var(--v-mono); font-weight: 700; font-size: .82rem; letter-spacing: 0; }

/* proof = manifeste vertical : ligne « volume — libellé » à filet or */
.hero__proof{ display: flex; flex-direction: column; align-items: flex-start; gap: .7rem;
  border-top: 1px solid rgba(208,128,8,.4); padding-top: 1.5rem; }
.hero__proof div{ border-left: 2px solid var(--v-or); padding: .05rem 0 .05rem .85rem;
  display: flex; flex-wrap: wrap; align-items: baseline; gap: .1rem .7rem; }
.hero__proof b{ font-family: var(--v-mono); font-weight: 700; font-size: 1.02rem; letter-spacing: -.02em; color: var(--v-or-clair); }
.hero__proof span{ font-family: var(--v-mono); font-weight: 400; font-size: .68rem; letter-spacing: .12em; }

/* stats = ligne de manifeste */
.stats b{ font-family: var(--v-mono); font-weight: 700; letter-spacing: -.02em; }

/* — prix : grand chiffre Cormorant, mais libellés mono — */
.price__from{ font-family: var(--v-mono); letter-spacing: .18em; font-size: .62rem; }
.price small{ font-family: var(--v-mono); font-size: .74rem; letter-spacing: .01em; }

/* — cartes : filet net + accent d'angle or au survol — */
.card{ position: relative; transition: border-color .25s, transform .25s; }
.card:hover{ transform: none; border-color: var(--v-or); }
.card::after{
  content:""; position: absolute; top: -1px; right: -1px; width: 0; height: 0;
  border-top: 14px solid var(--v-or); border-left: 14px solid transparent; opacity: 0; transition: opacity .25s;
}
.card:hover::after{ opacity: 1; }

/* — PHOTOS PLEIN CADRE : rupture pleine largeur + légende façon étiquette — */
.banner{
  width: 100vw; margin-inline: calc(50% - 50vw); border-left: 0; border-right: 0;
}
.banner img{ height: clamp(300px, 46vw, 600px); }
.banner figcaption{
  font-family: var(--v-mono); font-size: .78rem; letter-spacing: .02em; text-transform: none;
  padding: 3.4rem 1.5rem 1.3rem;
  padding-left: max(1.5rem, calc((100vw - var(--v-page)) / 2 + .25rem));
}
.banner figcaption b{ letter-spacing: .06em; text-transform: uppercase; font-size: .72rem; }

/* — filets or de séparation entre sections claires — */
.section--white + section:not(.section--marine):not(.hero),
section + .section--white{ border-top: 1px solid var(--v-gris-bord); }

/* — tableau : lignes plus aérées, prix en mono lisible — */
.table td.is-price{ font-family: var(--v-mono); font-weight: 700; font-size: .92rem; letter-spacing: -.01em; }
.table th, .table td{ padding: 1.05rem 1.15rem; }

/* — IBC : cadre plus riche — */
.ibc{ padding: 2.6rem; background:
  linear-gradient(150deg, var(--v-marine-voile), var(--v-marine-nuit)); }

@media (max-width: 680px){
  .banner figcaption{ padding-left: 1.5rem; }
  .banner img{ height: clamp(240px, 60vw, 360px); }
}

/* ── Héros éditorial « split » : texte marine à gauche + photo pleine hauteur à droite ── */
.hero--split{ position: relative; overflow: hidden; min-height: min(84vh, 780px); display: flex; align-items: center; }
.hero--split .hero__inner{ display: block; padding-block: clamp(3rem, 7vw, 5.5rem); }
.hero__content{ max-width: 590px; position: relative; z-index: 2; }
.hero--split h1{ font-size: clamp(2.7rem, 5.4vw, 4.4rem); margin-top: .35rem; }
.hero--split .hero__lead{ max-width: 44ch; }

.hero__media{ position: absolute; inset: 0 0 0 auto; width: 45%; z-index: 1; }
.hero__media > img{ width: 100%; height: 100%; object-fit: cover; object-position: 56% center; }
.hero__media::before{ content:""; position: absolute; inset: 0 auto 0 0; width: 2px; background: var(--v-or-degrade); z-index: 3; }
.hero__media::after{ content:""; position: absolute; inset: 0; z-index: 2;
  background: linear-gradient(90deg, var(--v-marine-nuit) 0%, rgba(0,9,46,.5) 22%, transparent 56%); }
.hero__tag{ position: absolute; left: 1.6rem; bottom: 1.6rem; z-index: 4;
  background: rgba(0,9,46,.74); border: 1px solid rgba(255,213,74,.4); backdrop-filter: blur(4px);
  padding: .65rem .95rem; display: flex; flex-direction: column; gap: .15rem; }
.hero__tag b{ font-family: var(--v-mono); font-weight: 700; font-size: .8rem; color: #fff; letter-spacing: .02em; }
.hero__tag i{ font-family: var(--v-mono); font-style: normal; font-size: .66rem; letter-spacing: .05em; color: var(--v-or-clair); }

/* ── petites icônes de marque (traits or) ── */
.ico{ width: 40px; height: 40px; display: inline-flex; color: var(--v-or); margin-bottom: 1.1rem; }
.ico svg{ width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.4;
  stroke-linecap: round; stroke-linejoin: round; }
.card--dark .ico, .section--marine .ico{ color: var(--v-or-clair); }
/* puce feuille dorée pour les listes */
.ticks li::before{ background: var(--v-or-degrade); }
.leaf-rule{ display: flex; align-items: center; gap: .9rem; margin: 0 0 1.4rem; color: var(--v-or); }
.leaf-rule svg{ width: 26px; height: 26px; flex: none; }
.leaf-rule::after{ content: ""; height: 1px; flex: 1; background: linear-gradient(90deg, var(--v-or), transparent); }

/* ── Achat au camion : schéma 33 palettes + manifeste ── */
.camion__diagram{ width: 100%; max-width: 780px; margin: .5rem auto 0; display: block;
  filter: drop-shadow(0 18px 40px rgba(0,0,0,.35)); }
.camion__stats{ display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 2.6rem;
  border: 1px solid rgba(208,128,8,.4); }
.camion__stats div{ padding: 1.4rem 1.2rem; border-left: 1px solid rgba(208,128,8,.22); text-align: center; }
.camion__stats div:first-child{ border-left: 0; }
.camion__stats b{ font-family: var(--v-mono); font-weight: 700; font-size: clamp(1.4rem, 2.6vw, 1.9rem);
  color: var(--v-or-clair); display: block; letter-spacing: -.02em; }
.camion__stats span{ font-family: var(--v-mono); font-size: .64rem; letter-spacing: .13em;
  text-transform: uppercase; color: #9AA3BB; }
@media (max-width: 680px){ .camion__stats{ grid-template-columns: 1fr 1fr; }
  .camion__stats div:nth-child(3){ border-left: 0; } }

@media (max-width: 900px){
  .hero--split{ flex-direction: column-reverse; min-height: 0; }
  .hero__media{ position: relative; width: 100%; height: clamp(260px, 56vw, 380px); }
  .hero__media > img{ object-position: 56% 40%; }
  .hero__media::before{ inset: 0 0 auto 0; width: auto; height: 2px; }
  .hero__media::after{ background: linear-gradient(0deg, var(--v-marine-nuit) 2%, transparent 52%); }
  .hero--split .hero__inner{ padding-top: 2.4rem; padding-bottom: 3rem; }
}

/* ═══════════════════════════════════════════════════════════════
   v4 — MANROPE, épuré : typo affirmée, moins de « tricks », plus d'air.
   ═══════════════════════════════════════════════════════════════ */
h1, h2, h3, .serif{ font-weight: 800; letter-spacing: -.03em; }
h1{ font-size: clamp(2.8rem, 6.2vw, 5.1rem); line-height: 1.0; }
h2{ font-size: clamp(2rem, 3.9vw, 3.3rem); line-height: 1.04; }
h3{ font-size: 1.25rem; font-weight: 700; letter-spacing: -.015em; }
.lead{ font-weight: 400; font-size: 1.16rem; color: #414A63; }
.hero--split h1{ font-size: clamp(2.9rem, 5.9vw, 4.9rem); font-weight: 800; letter-spacing: -.035em; }

/* eyebrow sobre (plus de style « ticket ») */
.eyebrow{ font-weight: 700; font-size: .74rem; letter-spacing: .15em; }
.eyebrow::before{ width: 20px; height: 2px; }

/* boutons Manrope, coins doux */
.btn{ font-weight: 700; letter-spacing: .03em; font-size: .84rem; border-radius: 6px; padding: 1rem 1.8rem; }

/* prix : grand chiffre Manrope 800 */
.price b{ font-weight: 800; letter-spacing: -.035em; font-size: 1.85rem; }
.price__from{ font-weight: 700; letter-spacing: .13em; }

/* données en Manrope 800 (fin du look ticket mono) */
.hero__proof b, .stats b, .camion__stats b, .chip b, .table td.is-price{ font-weight: 800; letter-spacing: -.02em; }
.card__meta{ font-weight: 700; letter-spacing: .1em; }

/* on retire les fioritures qui « font template » */
.card::after{ display: none; }
.card:hover{ transform: translateY(-2px); }

/* chips héros : pastilles douces séparées, pas un bloc-ticket */
.hero__chips{ border: 0; width: auto; gap: .6rem; }
.hero__chips .chip{ border: 1px solid rgba(255,213,74,.32); border-radius: 999px; padding: .55rem 1rem; }
.hero__chips .chip:last-child{ border-right: 1px solid rgba(255,213,74,.32); }

/* plus d'air */
section{ padding-block: clamp(4.5rem, 8vw, 8rem); }
.section-head{ margin-bottom: 3.4rem; }

/* FIX : le bouton du menu ne doit pas hériter du souligné doré des liens nav */
.nav a.btn, .nav a.btn:hover, .nav a.btn[aria-current="page"]{ border-bottom: 0; padding-bottom: 1rem; }

/* ═══════════════════════════════════════════════════════════════
   v5 — présence du LOGO (filigranes) + plus de DYNAMISME
   ═══════════════════════════════════════════════════════════════ */
/* filigrane logo doré dans le héros */
.hero__mark{ position: absolute; left: -3%; bottom: -8%; width: min(48%, 540px);
  opacity: .05; z-index: 0; pointer-events: none; }

/* bandeau CTA : logo clair au-dessus + grand filigrane */
.cta-band{ position: relative; overflow: hidden; }
.cta-band .wrap{ position: relative; z-index: 1; }
.cta-band__logo{ height: 46px; width: auto; display: block; margin: 0 auto 1.8rem; }
.cta-band__mark{ position: absolute; right: -5%; top: 50%; transform: translateY(-50%);
  width: min(56%, 680px); opacity: .06; z-index: 0; pointer-events: none; }

/* logo un peu plus présent en pied de page */
.site-footer img{ height: 42px; }

/* — DYNAMISME — */
/* zoom doux des photos plein cadre au survol */
.banner{ overflow: hidden; }
.banner img{ transition: transform .9s cubic-bezier(.2,.7,.2,1); }
.banner:hover img{ transform: scale(1.045); }
/* le flacon du héros respire au survol */
@media (min-width: 901px){
  .hero__media > img{ transition: transform 1.2s ease; }
  .hero--split:hover .hero__media > img{ transform: scale(1.03); }
}
/* entrée animée du héros au chargement */
@keyframes riseIn{ from{ opacity: 0; transform: translateY(18px); } to{ opacity: 1; transform: none; } }
.hero__content > *{ animation: riseIn .7s both; }
.hero__content > *:nth-child(1){ animation-delay: .05s; }
.hero__content > *:nth-child(2){ animation-delay: .13s; }
.hero__content > *:nth-child(3){ animation-delay: .21s; }
.hero__content > *:nth-child(4){ animation-delay: .29s; }
.hero__content > *:nth-child(5){ animation-delay: .37s; }
.hero__content > *:nth-child(6){ animation-delay: .45s; }
.hero__media{ animation: riseIn 1s both .12s; }
/* manifeste : le marqueur glisse au survol */
.hero__proof div{ transition: border-color .25s, padding-left .25s; }
.hero__proof div:hover{ border-color: var(--v-or-clair); padding-left: 1.1rem; }
/* cartes : ombre douce qui monte au survol (plus vivant) */
.card{ transition: border-color .25s, transform .25s, box-shadow .25s; }
.card:hover{ box-shadow: 0 18px 40px rgba(0,15,61,.10); }

@media (prefers-reduced-motion: reduce){
  .hero__content > *, .hero__media{ animation: none; }
  .banner img, .hero__media > img{ transition: none; }
}

/* ═══════════════════════════════════════════════════════════════
   THÈME BÔHEME SECRET PARIS — page « Capillaire professionnel ».
   Portée : .theme-boheme (n'affecte pas le reste du site marine).
   Vert #14342A · émeraude #2C6E50 · or #B08D3E · ivoire #F5F2E9.
   ═══════════════════════════════════════════════════════════════ */
.theme-boheme{
  --bo-vert:#14342A; --bo-emeraude:#2C6E50; --bo-or:#B08D3E; --bo-or-clair:#D8B978;
  --bo-ivoire:#F5F2E9; --bo-craie:#FBFAF5; --bo-encre:#2B2E27;
  --bo-or-degrade:linear-gradient(100deg,#8B6B2E 0%,#B08D3E 40%,#D8B978 62%,#B08D3E 100%);
  background:var(--bo-ivoire); color:var(--bo-encre);
}
.theme-boheme h1,.theme-boheme h2,.theme-boheme h3,.theme-boheme .serif{
  font-family:"Cambria","Georgia","Times New Roman",serif; font-weight:600;
  letter-spacing:-.005em; color:var(--bo-vert);
}
.theme-boheme .lead{ color:#4C5046; }
.theme-boheme .eyebrow{ color:var(--bo-or); }
.theme-boheme .eyebrow::before{ background:var(--bo-or-degrade); }
.theme-boheme .eyebrow--pale{ color:var(--bo-or-clair); }
.theme-boheme .eyebrow--pale::before{ background:var(--bo-or-clair); }

/* sections claires / vertes */
.theme-boheme .bo-vert{ background:var(--bo-vert); color:#EDE7D8; }
.theme-boheme .bo-vert h2, .theme-boheme .bo-vert h3{ color:#fff; }
.theme-boheme .bo-vert .lead{ color:#CFC9B6; }
.theme-boheme .bo-craie{ background:var(--bo-craie); }

/* boutons Bôheme */
.theme-boheme .btn--gold{ background:var(--bo-or-degrade); color:#2C2205; }
.theme-boheme .btn--ghost-dark{ border-color:rgba(20,52,42,.35); color:var(--bo-vert); }
.theme-boheme .btn--ghost-dark:hover{ border-color:var(--bo-or); color:var(--bo-or); }
.theme-boheme .btn--ghost{ border-color:rgba(216,185,120,.5); color:#F0E9D6; }

/* cartes Bôheme */
.theme-boheme .card{ background:#fff; border-color:#E6E0CF; }
.theme-boheme .card:hover{ border-color:var(--bo-or); box-shadow:0 18px 40px rgba(20,52,42,.10); }
.theme-boheme .card h3{ color:var(--bo-vert); }
.theme-boheme .card__meta{ color:var(--bo-or); }
.theme-boheme .card__foot{ color:#6B6F63; border-color:#E6E0CF; }
.theme-boheme .card p{ color:#4C5046; }
.theme-boheme .ico{ color:var(--bo-or); }
.theme-boheme .ticks li::before{ background:var(--bo-or-degrade); }
.theme-boheme .banner figcaption b{ color:var(--bo-or-clair); }

/* héros Bôheme : logo + filigrane */
.bo-hero{ position:relative; overflow:hidden; background:
  radial-gradient(120% 80% at 80% 10%, #FBFAF5 0%, var(--bo-ivoire) 55%); }
.bo-hero__logo{ height:64px; width:auto; margin-bottom:2rem; }
.bo-hero__mark{ position:absolute; right:-4%; bottom:-10%; width:min(46%,520px); opacity:.05; pointer-events:none; }
.bo-band{ background:var(--bo-vert); }
.bo-band__logo{ height:52px; margin:0 auto 1.6rem; display:block; }

/* header + footer verts sur la page Bôheme (cohérence, plus de marine qui jure) */
.theme-boheme .site-header{ background:rgba(18,44,35,.97); border-bottom-color:rgba(176,141,62,.4); }
.theme-boheme .nav a:hover,
.theme-boheme .nav a[aria-current="page"]{ color:var(--bo-or-clair); border-bottom-color:var(--bo-or); }
.theme-boheme .nav a.btn.btn--gold{ background:var(--bo-or-degrade); color:#2C2205; }
.theme-boheme .site-footer{ background:#0F241C; }
.theme-boheme .site-footer h4{ color:var(--bo-or-clair); }
.theme-boheme .site-footer a:hover{ color:var(--bo-or-clair); }

/* héros split Bôheme : ivoire + photo campagne, filet + voile or */
.theme-boheme .hero--split{ background:radial-gradient(120% 85% at 12% 16%, #FBFAF6 0%, var(--bo-ivoire) 60%); }
.theme-boheme .hero--split h1{ color:var(--bo-vert); }
.theme-boheme .hero__media::before{ background:var(--bo-or-degrade); }
.theme-boheme .hero__media::after{ background:linear-gradient(90deg, var(--bo-ivoire) 0%, rgba(245,242,233,.35) 24%, transparent 58%); }
.theme-boheme .hero__media > img{ object-position:50% center; }
.theme-boheme .bo-hero__logo{ height:60px; margin-bottom:1.9rem; }
/* packshots produits : flacon ENTIER, jamais coupé (contain, cadre ivoire) */
.theme-boheme .card__media{ height:300px; background:#fff; border:1px solid #ECE7D9; border-radius:12px; }
.theme-boheme .card__media img{ max-width:90%; max-height:88%; width:auto; height:auto; object-fit:contain; }
.theme-boheme .card:hover .card__media img{ transform:scale(1.03); transition:transform .5s ease; }
.theme-boheme .prod-group{ color:var(--bo-vert); }
.theme-boheme .prod-group::before{ background:var(--bo-or); }
.theme-boheme .prod-group span{ color:#8A8676; }
@media (max-width:900px){
  .theme-boheme .hero__media::after{ background:linear-gradient(0deg, var(--bo-ivoire) 2%, transparent 52%); }
}

/* teaser Bôheme sur l'accueil VESCERA — bande IVOIRE (s'intègre, ne jure pas avec le marine) */
.brand-switch{ background:#F5F2E9; color:#3B3F35; overflow:hidden;
  border-top:1px solid #E7E1D0; border-bottom:1px solid #E7E1D0; }
.brand-switch__inner{ display:grid; grid-template-columns:1.02fr .98fr; gap:3.2rem; align-items:center; }
.brand-switch__logo{ height:42px; width:auto; margin-bottom:1.4rem; }
.brand-switch h2{ font-family:"Cambria","Georgia",serif; color:#14342A; font-weight:600; letter-spacing:-.005em; }
.brand-switch .eyebrow{ color:#A9822F; }
.brand-switch .eyebrow::before{ background:linear-gradient(100deg,#B08D3E,#D8B978); }
.brand-switch p{ color:#4C5046; max-width:46ch; margin:1.1rem 0 1.7rem; }
.brand-switch .btn--gold{ background:linear-gradient(100deg,#8B6B2E,#B08D3E 45%,#D8B978 65%,#B08D3E); color:#2C2205; }
.brand-switch__media{ position:relative; }
.brand-switch__media img{ width:100%; border-radius:8px; box-shadow:0 20px 44px rgba(20,52,42,.16); }
@media (max-width:900px){ .brand-switch__inner{ grid-template-columns:1fr; gap:2rem; } .brand-switch__media{ order:-1; } }

/* ---- v18 : cartes produit "flacon entier sur scène" ---------------------- */
.card--scene .card__media{ position:relative; height:clamp(320px,40vw,430px); border-radius:16px; overflow:hidden; background:#EEF3F5; }
.card--scene .card__media::before{ content:""; position:absolute; inset:-8%; background:var(--img) center/cover no-repeat; filter:blur(24px) saturate(1.08); transform:scale(1.12); }
.card--scene .card__media::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,0) 34%,rgba(0,0,0,.05)); }
.card--scene .card__media img{ position:relative; z-index:1; max-height:clamp(300px,38vw,410px); max-width:94%; width:auto; height:auto; margin:0 auto; display:block; object-fit:contain;
  filter:drop-shadow(0 14px 26px rgba(10,30,60,.22)); transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.card--scene:hover .card__media img{ transform:translateY(-4px) scale(1.03); }
/* savon : panneau marine, même hauteur que les cartes scène */
.card--savon .card__media{ position:relative; height:clamp(320px,40vw,430px); border-radius:16px; overflow:hidden;
  background:radial-gradient(120% 100% at 50% 0,#0a2a6e,#001868 70%); display:grid; place-items:center; }
.card--savon .card__media b{ display:block; font-family:var(--v-titre); font-weight:800; font-size:3.2rem; color:var(--v-or-clair); line-height:1; }
.card--savon .card__media span{ color:#cdd9f2; letter-spacing:.14em; text-transform:uppercase; font-size:.82rem; }

/* ---- v18 : sous-titres de famille produit -------------------------------- */
.prod-group{ font-family:var(--v-titre); font-weight:800; font-size:clamp(1.3rem,2.2vw,1.6rem); color:var(--v-marine);
  margin:2.6rem 0 1.15rem; display:flex; align-items:center; gap:.6rem; }
.prod-group::before{ content:""; width:28px; height:3px; background:var(--v-or); border-radius:2px; }
.prod-group span{ font-family:var(--v-texte); font-weight:600; font-size:.9rem; color:#6b7280; letter-spacing:.01em; }
.card--scene h3, .card--savon h3{ margin-top:.2rem; }

/* ---- v20 : héros "pub" plein cadre (image d'accueil Océan) --------------- */
.hero-ad{ position:relative; min-height:clamp(480px,66vh,700px); display:flex; align-items:flex-end;
  overflow:hidden; color:#fff; background:#0a2740; }
.hero-ad__bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; z-index:0; }
.hero-ad__scrim{ position:absolute; inset:0; z-index:1;
  background:linear-gradient(90deg, transparent 0%, transparent 36%, rgba(2,14,34,.40) 58%, rgba(2,14,34,.82) 100%),
             linear-gradient(0deg, rgba(2,14,34,.52) 0%, transparent 42%); }
.hero-ad__inner{ position:relative; z-index:2; width:min(100% - 3rem, var(--v-page)); margin-inline:auto;
  padding-block:clamp(2rem,5vw,3.6rem); }
.hero-ad__copy{ max-width:37rem; margin-left:auto; }
.hero-ad h1{ color:#fff; font-size:clamp(2.4rem,5.4vw,4.6rem); max-width:20ch; text-shadow:0 2px 26px rgba(0,0,0,.4); }
.hero-ad h1 em{ font-style:normal; color:var(--v-or-clair); }
.hero-ad__lead{ color:#E7EEFB; font-size:clamp(1.04rem,1.5vw,1.26rem); max-width:46ch; margin-top:1.1rem;
  text-shadow:0 1px 14px rgba(0,0,0,.5); }
.hero-ad__actions{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:1.9rem; }
.hero-ad__tag{ position:absolute; right:clamp(1rem,3vw,2.4rem); top:clamp(1rem,3vw,2rem); z-index:2;
  background:rgba(2,14,34,.55); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.18);
  border-radius:999px; padding:.5rem 1.1rem; font-size:.82rem; letter-spacing:.04em; color:#EAF1FB; }
.hero-ad__tag b{ color:var(--v-or-clair); }
@media (max-width:900px){
  /* le bidon est dans le tiers gauche de la photo : on recadre dessus */
  .hero-ad__bg{ object-position:30% center; }
}
@media (max-width:640px){
  .hero-ad{ min-height:78vh; }
  .hero-ad__bg{ object-position:26% center; }
  .hero-ad__scrim{ background:linear-gradient(0deg, rgba(2,14,34,.92) 0%, rgba(2,14,34,.55) 38%, rgba(2,14,34,.2) 70%); }
  .hero-ad__copy{ max-width:none; }
  .hero-ad__tag{ font-size:.74rem; padding:.4rem .85rem; }
}

/* ---- v21 : cartes photo lifestyle carrées (capillaire = scènes générées) - */
.card--photo .card__media{ aspect-ratio:1/1; height:auto; border-radius:14px; overflow:hidden; margin-bottom:1.4rem; background:#ECE7D9; border:0; }
.card--photo .card__media img{ width:100%; height:100%; max-width:none; max-height:none; object-fit:cover; object-position:center; display:block; transition:transform .55s ease; }
.card--photo:hover .card__media img{ transform:scale(1.045); }

/* ---- v24 : module "Composez votre semi" --------------------------------- */
.semi{ display:grid; grid-template-columns:1.3fr .7fr; gap:2rem; align-items:start; }
.semi__panel{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.14); border-radius:16px; padding:.4rem 1.5rem 1.5rem; }
.semi__row{ display:grid; grid-template-columns:1.5fr auto auto; gap:1.2rem; align-items:end;
  padding:1.25rem 0; border-top:1px solid rgba(255,255,255,.12); }
.semi__row:first-child{ border-top:0; }
.semi__ident b{ display:block; color:#fff; font-family:var(--v-titre); font-weight:700; font-size:1.05rem; }
.semi__ident span{ display:block; font-size:.78rem; color:#9AA3BB; margin-top:.25rem; }
.semi__ctrl label{ display:block; font-size:.68rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--v-or-clair); margin-bottom:.4rem; }
.semi__ctrl label small{ color:#7C86A0; letter-spacing:0; text-transform:none; }
.semi__step{ display:flex; align-items:center; gap:.25rem; }
.semi__step button{ width:30px; height:30px; border-radius:7px; cursor:pointer; font-size:1.05rem; line-height:1;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); color:#fff; transition:.18s; }
.semi__step button:hover{ background:var(--v-or); border-color:var(--v-or); color:#2A1802; }
.semi__step input{ width:52px; height:30px; text-align:center; font-family:var(--v-titre); font-weight:700;
  font-variant-numeric:lining-nums; background:rgba(0,0,0,.3); border:1px solid rgba(255,255,255,.2);
  border-radius:7px; color:#fff; font-size:.95rem; -moz-appearance:textfield; }
.semi__step input::-webkit-outer-spin-button,.semi__step input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.semi__out{ grid-column:1 / -1; font-size:.85rem; color:#B9C0D2; font-variant-numeric:lining-nums; }
.semi__out b{ color:var(--v-or-clair); }
.semi__idle{ color:#6E7891; }
.semi__actions{ display:flex; flex-wrap:wrap; gap:.7rem; padding-top:1.3rem; border-top:1px solid rgba(255,255,255,.12); }
.semi__actions .btn{ padding:.6rem 1.05rem; font-size:.7rem; }

.semi__recap{ background:rgba(255,255,255,.07); border:1px solid rgba(208,128,8,.38); border-radius:16px;
  padding:1.6rem; position:sticky; top:88px; }
.semi__recap h3{ color:#fff; margin-bottom:1.1rem; }
.semi__gline{ display:flex; justify-content:space-between; align-items:baseline; margin:.9rem 0 .35rem; }
.semi__gline span{ font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:#9AA3BB; }
.semi__gline b{ font-family:var(--v-titre); color:var(--v-or-clair); font-variant-numeric:lining-nums; font-size:.95rem; }
.gauge{ height:9px; background:rgba(255,255,255,.14); border-radius:99px; overflow:hidden; }
.gauge i{ display:block; height:100%; width:0; background:var(--v-or-degrade); border-radius:99px; transition:width .35s ease; }
.gauge.is-over i{ background:linear-gradient(90deg,#C2392C,#E0483C); }
.semi__alerte{ font-size:.82rem; color:#B9C0D2; margin:1.1rem 0 0; padding:.7rem .9rem;
  background:rgba(255,255,255,.06); border-left:2px solid rgba(255,255,255,.25); border-radius:0 7px 7px 0; }
.semi__alerte.is-bad{ color:#FFD9D4; border-left-color:#E0483C; background:rgba(224,72,60,.14); }
.semi__alerte.is-good{ color:#FFE9B8; border-left-color:var(--v-or); background:rgba(208,128,8,.14); }
.semi__dispatch{ list-style:none; margin:1.2rem 0 0; padding:0; }
.semi__dispatch li{ padding:.65rem 0; border-top:1px solid rgba(255,255,255,.1); font-size:.83rem; }
.semi__dispatch li:first-child{ border-top:0; }
.semi__dl{ display:block; color:#fff; font-weight:600; }
.semi__dq{ display:block; color:var(--v-or-clair); font-size:.76rem; }
.semi__dv{ display:block; color:#9AA3BB; font-size:.76rem; font-variant-numeric:lining-nums; }
.semi__totaux{ display:grid; grid-template-columns:repeat(3,1fr); gap:.6rem; margin:1.3rem 0 1.2rem;
  padding-top:1.1rem; border-top:1px solid rgba(208,128,8,.35); }
.semi__totaux span{ display:block; font-size:.64rem; letter-spacing:.1em; text-transform:uppercase; color:#9AA3BB; }
.semi__totaux b{ font-family:var(--v-titre); font-size:1.15rem; color:#fff; font-variant-numeric:lining-nums; }
.semi__recap .btn{ width:100%; justify-content:center; }
.semi__mention{ font-size:.72rem; color:#7C86A0; margin:1rem 0 0; }

@media (max-width:1000px){
  .semi{ grid-template-columns:1fr; }
  .semi__recap{ position:static; }
}
@media (max-width:640px){
  .semi__row{ grid-template-columns:1fr 1fr; }
  .semi__ident{ grid-column:1 / -1; }
  .semi__panel{ padding:.4rem 1.1rem 1.2rem; }
}
/* détail par ligne produit */
.semi__out{ grid-column:1 / -1; display:flex; flex-wrap:wrap; gap:.2rem 1.4rem; font-size:.79rem;
  font-variant-numeric:lining-nums; color:#B9C0D2; }
.semi__pal{ color:#8F99B2; }
.semi__tot b{ color:var(--v-or-clair); font-family:var(--v-titre); }

/* ---- v25 : composeur en lignes de chargement ---------------------------- */
.semi__add{ display:grid; grid-template-columns:1.6fr auto auto auto; gap:1rem; align-items:end;
  padding:1.3rem 0 1.4rem; border-bottom:1px solid rgba(208,128,8,.35); }
.semi__ctrl--wide select{ width:100%; height:38px; padding:0 .7rem; border-radius:8px;
  background:rgba(0,0,0,.34); border:1px solid rgba(255,255,255,.22); color:#fff;
  font-family:var(--v-texte); font-size:.9rem; }
.semi__ctrl--wide select optgroup{ background:#0b1f3a; color:var(--v-or-clair); }
.semi__ctrl--wide select option{ background:#0b1f3a; color:#fff; }
.semi__addbtn{ padding:.72rem 1.2rem; font-size:.72rem; white-space:nowrap; }
.semi__apercu{ grid-column:1 / -1; margin:.2rem 0 0; font-size:.78rem; color:#9AA3BB;
  font-variant-numeric:lining-nums; }
.semi__apercu b{ color:var(--v-or-clair); }

.semi__lignes{ padding-top:.4rem; }
.semi__vide{ color:#7C86A0; font-size:.86rem; padding:1.4rem 0 .4rem; margin:0; }
.semi__ligne{ position:relative; display:grid; grid-template-columns:1.6fr auto auto 32px;
  gap:1rem; align-items:end; padding:1.1rem 0; border-bottom:1px solid rgba(255,255,255,.1); }
.semi__lref b{ display:block; color:#fff; font-family:var(--v-titre); font-weight:700; font-size:1rem; }
.semi__lref span{ display:block; font-size:.75rem; color:#8F99B2; margin-top:.2rem; }
.semi__lout{ grid-column:1 / -1; display:flex; flex-wrap:wrap; gap:.2rem 1.4rem;
  font-size:.78rem; color:#B9C0D2; font-variant-numeric:lining-nums; margin-top:.15rem; }
.semi__del{ width:30px; height:30px; border-radius:7px; cursor:pointer; font-size:1.15rem; line-height:1;
  background:transparent; border:1px solid rgba(255,255,255,.2); color:#9AA3BB; transition:.18s; }
.semi__del:hover{ background:rgba(224,72,60,.18); border-color:#E0483C; color:#FFD9D4; }

@media (max-width:760px){
  .semi__add{ grid-template-columns:1fr 1fr; }
  .semi__ctrl--wide{ grid-column:1 / -1; }
  .semi__addbtn{ grid-column:1 / -1; width:100%; justify-content:center; }
  .semi__ligne{ grid-template-columns:1fr 1fr 32px; }
  .semi__lref{ grid-column:1 / -1; }
}

/* ---- v27 : configurateur "Créez votre marque" --------------------------- */
.cfg{ color:#EAE6DA; }
.cfg__fil{ display:flex; gap:.3rem; overflow-x:auto; padding-bottom:1.4rem; margin-bottom:1.6rem;
  border-bottom:1px solid rgba(255,255,255,.14); scrollbar-width:thin; }
.cfg__pas{ flex:0 0 auto; display:flex; align-items:center; gap:.5rem; padding:.5rem .8rem;
  background:transparent; border:1px solid rgba(255,255,255,.16); border-radius:99px; cursor:pointer;
  color:#9FA895; font-size:.76rem; white-space:nowrap; transition:.2s; }
.cfg__pas i{ font-style:normal; width:20px; height:20px; border-radius:50%; display:grid; place-items:center;
  background:rgba(255,255,255,.12); font-size:.68rem; font-weight:700; }
.cfg__pas:hover{ border-color:var(--bo-or); color:#fff; }
.cfg__pas.is-fait{ color:#CFC9B6; } .cfg__pas.is-fait i{ background:var(--bo-or); color:#241a05; }
.cfg__pas.is-on{ background:rgba(176,141,62,.18); border-color:var(--bo-or); color:#fff; }
.cfg__pas.is-on i{ background:var(--bo-or); color:#241a05; }

.cfg__scene{ display:grid; grid-template-columns:1fr .38fr; gap:2rem; align-items:start; }
.cfg__main h3{ color:#fff; font-size:clamp(1.4rem,2.4vw,1.9rem); }
.cfg__aide{ color:#B9BCA8; font-size:.95rem; margin:.5rem 0 1.6rem; max-width:60ch; }
.cfg__zone{ min-height:220px; }
.cfg__sous{ color:var(--bo-or-clair); font-size:.74rem; letter-spacing:.14em; text-transform:uppercase;
  margin:1.6rem 0 .7rem; }
.cfg__note{ font-size:.82rem; color:#9FA895; margin:1.1rem 0 0; }
.cfg__note b{ color:var(--bo-or-clair); }

.cfg__chips{ display:flex; flex-wrap:wrap; gap:.5rem; }
.cfg__chip{ padding:.5rem .9rem; border-radius:99px; cursor:pointer; font-size:.84rem;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.18); color:#EAE6DA; transition:.18s; }
.cfg__chip:hover{ border-color:var(--bo-or); color:#fff; }
.cfg__chip.is-on{ background:var(--bo-or); border-color:var(--bo-or); color:#241a05; font-weight:600; }
.cfg__fam{ margin-bottom:1.1rem; }
.cfg__fam > span{ display:block; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase;
  color:#8E9682; margin-bottom:.45rem; }

.cfg__cartes{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:.9rem; }
.cfg__cartes--large{ grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); }
.cfg__carte{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:.4rem;
  padding:1.1rem .8rem; border-radius:14px; cursor:pointer; transition:.2s;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16); color:#EAE6DA; }
.cfg__carte:hover{ border-color:var(--bo-or); transform:translateY(-2px); }
.cfg__carte.is-on{ border-color:var(--bo-or); background:rgba(176,141,62,.18); box-shadow:0 0 0 1px var(--bo-or) inset; }
.cfg__carte b{ font-family:var(--v-titre); font-size:.92rem; color:#fff; }
.cfg__desc{ font-size:.74rem; color:#9FA895; line-height:1.4; }
.cfg__dessin{ display:block; color:var(--bo-or-clair); }
.cfg__dessin svg{ width:56px; height:86px; }
.cfg__carte.is-on .cfg__dessin{ color:#fff; }

.cfg__refs{ display:flex; flex-wrap:wrap; align-items:center; gap:.8rem 1.4rem; margin-top:1.4rem; }
.cfg__refs label{ font-size:.74rem; letter-spacing:.12em; text-transform:uppercase; color:var(--bo-or-clair); }
.cfg__nav{ display:flex; justify-content:space-between; align-items:center; gap:1rem;
  margin-top:2rem; padding-top:1.4rem; border-top:1px solid rgba(255,255,255,.14); }
.cfg__navbtns{ display:flex; gap:.7rem; flex-wrap:wrap; }
.cfg .btn--ghost-dark{ border-color:rgba(255,255,255,.35); color:#EAE6DA; }
.cfg .btn--ghost-dark:hover{ border-color:var(--bo-or); color:var(--bo-or-clair); }

.cfg__apercu{ background:rgba(255,255,255,.07); border:1px solid rgba(176,141,62,.4);
  border-radius:16px; padding:1.4rem; position:sticky; top:88px; }
.cfg__apDessin{ display:block; text-align:center; color:var(--bo-or-clair); margin-bottom:.6rem; }
.cfg__apDessin svg{ width:66px; height:100px; }
.cfg__apercu h4{ color:#fff; font-family:var(--v-titre); font-size:1rem; text-align:center; margin-bottom:1rem; }
.cfg__ap{ list-style:none; margin:0 0 1rem; padding:0; }
.cfg__ap li{ display:flex; justify-content:space-between; gap:.6rem; padding:.4rem 0;
  border-top:1px solid rgba(255,255,255,.1); font-size:.78rem; }
.cfg__ap span{ color:#8E9682; } .cfg__ap b{ color:#EAE6DA; text-align:right; }
.cfg__prix{ display:grid; gap:.15rem; padding-top:.9rem; border-top:1px solid rgba(176,141,62,.4); }
.cfg__prix span{ font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:#8E9682; }
.cfg__prix b{ font-family:var(--v-titre); font-size:1.25rem; color:var(--bo-or-clair);
  font-variant-numeric:lining-nums; margin-bottom:.4rem; }
.cfg__prix b.is-total{ font-size:1.6rem; color:#fff; margin-bottom:0; }

.dev{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.16); border-radius:14px; padding:1.4rem; }
.dev__head{ display:flex; justify-content:space-between; align-items:baseline;
  padding-bottom:.8rem; margin-bottom:1rem; border-bottom:1px solid rgba(176,141,62,.4); }
.dev__head b{ font-family:var(--v-titre); color:var(--bo-or-clair); font-size:1.05rem; }
.dev__head span{ font-size:.8rem; color:#8E9682; }
.dev__alerte{ background:rgba(224,72,60,.16); border-left:2px solid #E0483C; color:#FFD9D4;
  padding:.7rem .9rem; border-radius:0 7px 7px 0; font-size:.84rem; margin:0 0 1rem; }
.dev__tab{ width:100%; border-collapse:collapse; font-size:.85rem; margin-bottom:1rem; }
.dev__tab td{ padding:.45rem 0; border-bottom:1px solid rgba(255,255,255,.09); color:#CFC9B6; vertical-align:top; }
.dev__tab td:first-child{ color:#8E9682; width:42%; }
.dev__tab--prix td:last-child{ text-align:right; font-variant-numeric:lining-nums; color:#EAE6DA; }
.dev__tab .is-strong td{ color:#fff; font-weight:600; }
.dev__tab .is-total td{ border-bottom:0; border-top:1px solid rgba(176,141,62,.5); padding-top:.7rem;
  font-family:var(--v-titre); font-size:1.15rem; color:#fff; }

@media (max-width:1000px){ .cfg__scene{ grid-template-columns:1fr; } .cfg__apercu{ position:static; } }
@media (max-width:640px){ .cfg__pas span{ display:none; } .cfg__pas{ padding:.5rem; } }
@media print{
  .site-header,.site-footer,.cfg__fil,.cfg__panneau,.cfg__main,.cfg__nav,.hero,.cta-band{ display:none !important; }
  body,.bo-vert{ background:#fff !important; color:#000 !important; }
  .cfg__apercu,.dev{ background:#fff !important; border-color:#ccc !important; }
  .dev__tab td,.cfg__ap b{ color:#000 !important; }
}
/* photos packagings réels */
.cfg__photo{ display:grid; place-items:center; height:104px; width:100%; margin-bottom:.2rem; }
.cfg__photo img{ max-height:104px; max-width:100%; width:auto; height:auto; object-fit:contain;
  filter:drop-shadow(0 6px 14px rgba(0,0,0,.35)); }
.cfg__ref{ font-size:.68rem; letter-spacing:.08em; color:var(--bo-or-clair); font-variant-numeric:lining-nums; }
.cfg__carte.is-on .cfg__ref{ color:#fff; }
.cfg__apDessin img{ max-height:110px; width:auto; margin-inline:auto;
  filter:drop-shadow(0 8px 18px rgba(0,0,0,.4)); }

/* ---- v30 : vignettes packagings lisibles -------------------------------- */
.cfg__cartes{ grid-template-columns:repeat(auto-fill,minmax(178px,1fr)); gap:1rem; }
.cfg__carte{ padding:.75rem .75rem 1rem; gap:.55rem; }
/* la photo sur fond clair : les flacons blancs et transparents ressortent */
.cfg__photo{ height:176px; width:100%; background:linear-gradient(170deg,#FFFFFF,#F1EEE4);
  border-radius:11px; padding:14px; box-shadow:inset 0 0 0 1px rgba(20,52,42,.10); }
.cfg__photo img{ max-height:148px; filter:drop-shadow(0 4px 10px rgba(20,52,42,.22)); }
.cfg__carte b{ font-size:.86rem; line-height:1.25; }
.cfg__ref{ font-size:.7rem; letter-spacing:.06em; opacity:.95; }
.cfg__carte.is-on .cfg__photo{ box-shadow:inset 0 0 0 2px var(--bo-or); }
/* aperçu latéral : même traitement */
.cfg__apDessin{ background:linear-gradient(170deg,#FFFFFF,#F1EEE4); border-radius:12px;
  padding:14px; margin-bottom:.9rem; box-shadow:inset 0 0 0 1px rgba(20,52,42,.10); }
.cfg__apDessin img{ max-height:132px; filter:drop-shadow(0 4px 10px rgba(20,52,42,.22)); }
@media (max-width:640px){ .cfg__cartes{ grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); }
  .cfg__photo{ height:142px; } .cfg__photo img{ max-height:116px; } }

/* ---- v31 : vitrine produit — le flacon est le héros --------------------- */
.cfg__cartes{ grid-template-columns:repeat(auto-fill,minmax(196px,1fr)); gap:1.5rem 1.2rem; }

/* la carte packaging n'a plus de cadre : seul le produit compte */
.cfg__carte--pack{ background:transparent; border:0; padding:0; gap:.7rem; }
.cfg__carte--pack:hover{ transform:none; }
.cfg__carte--pack .cfg__photo{
  position:relative; height:232px; width:100%; padding:20px 16px 10px;
  background:radial-gradient(120% 90% at 50% 12%, #FFFDF8 0%, #F4F0E4 62%, #E9E3D2 100%);
  border-radius:16px; box-shadow:none; overflow:hidden;
  transition:box-shadow .28s ease, transform .28s ease; }
/* le sol : une ombre douce sous le flacon */
.cfg__carte--pack .cfg__photo::after{
  content:""; position:absolute; left:50%; bottom:16px; transform:translateX(-50%);
  width:56%; height:14px; border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(20,52,42,.26), rgba(20,52,42,0) 70%); }
.cfg__carte--pack .cfg__photo img{
  position:relative; z-index:1; max-height:196px; width:auto;
  filter:drop-shadow(0 10px 14px rgba(20,52,42,.18));
  transition:transform .32s cubic-bezier(.2,.7,.2,1); }
.cfg__carte--pack:hover .cfg__photo{ transform:translateY(-4px); box-shadow:0 16px 34px rgba(0,0,0,.28); }
.cfg__carte--pack:hover .cfg__photo img{ transform:scale(1.05); }

/* sélection : anneau or + pastille cochée */
.cfg__carte--pack.is-on .cfg__photo{ box-shadow:0 0 0 2px var(--bo-or), 0 16px 34px rgba(0,0,0,.3); }


/* le texte sous le produit, sobre */
.cfg__carte--pack b{ font-family:var(--v-titre); font-weight:600; font-size:.88rem;
  color:#EFEBDD; line-height:1.3; letter-spacing:.01em; }
.cfg__carte--pack .cfg__ref{ font-size:.68rem; letter-spacing:.1em; color:#8E9682; }
.cfg__carte--pack.is-on b{ color:#fff; }
.cfg__carte--pack.is-on .cfg__ref{ color:var(--bo-or-clair); }

@media (max-width:640px){
  .cfg__cartes{ grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:1.1rem .8rem; }
  .cfg__carte--pack .cfg__photo{ height:176px; } .cfg__carte--pack .cfg__photo img{ max-height:146px; }
}

/* ---- v32 : vitrine — les flacons flottent, plus de vignette ------------- */
.cfg__cartes{ grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:2.2rem 1.4rem; }

.cfg__carte--pack{ background:transparent; border:0; padding:0; gap:.9rem; }
.cfg__carte--pack .cfg__photo{
  position:relative; height:256px; width:100%; padding:0;
  background:none; border-radius:0; box-shadow:none; overflow:visible; }

/* halo doré derrière le produit, au survol et à la sélection */
.cfg__carte--pack .cfg__photo::before{
  content:""; position:absolute; inset:-6% -10%; z-index:0; pointer-events:none;
  background:radial-gradient(58% 52% at 50% 44%, rgba(176,141,62,.26), rgba(176,141,62,0) 72%);
  opacity:0; transition:opacity .4s ease; }
.cfg__carte--pack:hover .cfg__photo::before,
.cfg__carte--pack.is-on .cfg__photo::before{ opacity:1; }

/* le flacon pose sur une ombre, il ne flotte pas dans le vide */
.cfg__carte--pack .cfg__photo::after{
  content:""; position:absolute; left:50%; bottom:6px; transform:translateX(-50%);
  width:48%; height:13px; border-radius:50%; z-index:0;
  background:radial-gradient(ellipse at center, rgba(0,0,0,.5), rgba(0,0,0,0) 72%);
  transition:width .35s ease, opacity .35s ease; }
.cfg__carte--pack:hover .cfg__photo::after{ width:40%; opacity:.75; }

.cfg__carte--pack .cfg__photo img{
  position:relative; z-index:1; max-height:224px; width:auto;
  filter:drop-shadow(0 16px 24px rgba(0,0,0,.42));
  transition:transform .38s cubic-bezier(.2,.7,.2,1); }
.cfg__carte--pack:hover .cfg__photo img{ transform:translateY(-8px) scale(1.03); }
.cfg__carte--pack.is-on .cfg__photo img{ transform:translateY(-4px); }

/* nom : serif Bôheme, discret, avec un filet or à la sélection */
.cfg__carte--pack b{ font-family:"Cambria",Georgia,serif; font-weight:400; font-size:.94rem;
  color:#DCD9CC; line-height:1.3; letter-spacing:.01em; position:relative; padding-bottom:.45rem; }
.cfg__carte--pack b::after{ content:""; position:absolute; left:50%; bottom:0; width:0; height:1px;
  background:var(--bo-or); transform:translateX(-50%); transition:width .35s ease; }
.cfg__carte--pack:hover b::after{ width:28px; }
.cfg__carte--pack.is-on b{ color:#fff; }
.cfg__carte--pack.is-on b::after{ width:46px; }
.cfg__carte--pack .cfg__ref{ font-size:.66rem; letter-spacing:.16em; color:#7E876F; }
.cfg__carte--pack.is-on .cfg__ref{ color:var(--bo-or-clair); }
.cfg__carte--pack.is-on .cfg__photo::before{ opacity:1; }
/* plus de pastille cochée : le halo et le filet suffisent */
.cfg__carte--pack.is-on .cfg__photo::before{ content:""; }

/* aperçu latéral : même traitement, sans cadre */
.cfg__apDessin{ background:none; box-shadow:none; padding:0 0 .4rem; position:relative; }
.cfg__apDessin::after{ content:""; position:absolute; left:50%; bottom:2px; transform:translateX(-50%);
  width:44%; height:11px; border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(0,0,0,.5), rgba(0,0,0,0) 72%); }
.cfg__apDessin img{ position:relative; z-index:1; max-height:150px;
  filter:drop-shadow(0 14px 22px rgba(0,0,0,.45)); }

@media (max-width:640px){
  .cfg__cartes{ grid-template-columns:repeat(auto-fill,minmax(148px,1fr)); gap:1.6rem 1rem; }
  .cfg__carte--pack .cfg__photo{ height:186px; }
  .cfg__carte--pack .cfg__photo img{ max-height:162px; }
}
/* la carte packaging sélectionnée n'a AUCUN cadre : halo + filet or seulement */
.cfg__carte--pack.is-on,
.cfg__carte--pack:hover{ background:transparent !important; border-color:transparent !important;
  box-shadow:none !important; transform:none; }
.cfg__carte--pack{ transition:none; }
/* neutralise tout cadre hérité sur la vignette packaging */
.cfg__carte--pack .cfg__photo,
.cfg__carte--pack:hover .cfg__photo,
.cfg__carte--pack.is-on .cfg__photo{
  box-shadow:none !important; background:none !important; border:0 !important;
  border-radius:0 !important; transform:none !important; }

/* ---- v35 : cartes ACTIFS (image + bénéfice) ----------------------------- */
.cfg__actifs{ display:grid; grid-template-columns:repeat(auto-fill,minmax(268px,1fr));
  gap:.7rem; margin-bottom:1.8rem; }
.cfg__actif{ display:grid; grid-template-columns:76px 1fr; gap:.9rem; align-items:center;
  text-align:left; padding:.7rem .9rem .7rem .7rem; cursor:pointer; border-radius:14px;
  background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.10);
  color:#DCD9CC; transition:border-color .25s, background .25s, transform .25s; }
.cfg__actif:hover{ border-color:rgba(176,141,62,.55); background:rgba(176,141,62,.08); transform:translateY(-2px); }
.cfg__actif.is-on{ border-color:var(--bo-or); background:rgba(176,141,62,.14); }
.cfg__actifImg{ position:relative; width:76px; height:76px; border-radius:50%; overflow:hidden;
  display:grid; place-items:center; flex:0 0 auto;
  background:radial-gradient(120% 120% at 35% 25%, #2C4E3F, #17352A);
  box-shadow:0 0 0 1px rgba(176,141,62,.40), inset 0 2px 8px rgba(0,0,0,.35); }
.cfg__actifImg i{ font-family:"Cambria",Georgia,serif; font-style:normal; font-size:1.85rem;
  color:rgba(176,141,62,.72); line-height:1; }
.cfg__actifImg img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.cfg__actif.is-on .cfg__actifImg{ box-shadow:0 0 0 2px var(--bo-or), inset 0 2px 8px rgba(0,0,0,.35); }
.cfg__actif b{ display:block; font-family:"Cambria",Georgia,serif; font-weight:400;
  font-size:1rem; color:#EFEBDD; margin-bottom:.15rem; }
.cfg__actif.is-on b{ color:#fff; }
.cfg__actifTxt{ display:block; font-size:.78rem; line-height:1.45; color:#9FA895; }
.cfg__actif.is-on .cfg__actifTxt{ color:#CFC9B6; }

/* ---- petits habillages : filets, feuille, coins ------------------------- */
.cfg__sous{ display:flex; align-items:center; gap:.7rem; }
.cfg__sous::before{ content:""; width:16px; height:1px; background:var(--bo-or); flex:0 0 auto; }
.cfg__sous::after{ content:""; flex:1; height:1px;
  background:linear-gradient(90deg, rgba(176,141,62,.45), rgba(176,141,62,0)); }
.cfg__main h3{ position:relative; padding-bottom:.55rem; }
.cfg__main h3::after{ content:""; position:absolute; left:0; bottom:0; width:42px; height:2px;
  background:var(--bo-or-degrade, linear-gradient(90deg,var(--bo-or),rgba(176,141,62,0))); }
/* coins dorés sur le panneau d'aperçu */
.cfg__apercu{ position:sticky; }
.cfg__apercu::before, .cfg__apercu::after{ content:""; position:absolute; width:16px; height:16px;
  border:1px solid var(--bo-or); opacity:.55; pointer-events:none; }
.cfg__apercu::before{ top:10px; left:10px; border-right:0; border-bottom:0; border-radius:4px 0 0 0; }
.cfg__apercu::after{ bottom:10px; right:10px; border-left:0; border-top:0; border-radius:0 0 4px 0; }

@media (max-width:640px){ .cfg__actifs{ grid-template-columns:1fr; } }
/* actif : image à gauche, nom + bénéfice à droite */
.cfg__actif{ grid-template-areas:"img nom" "img txt"; grid-template-rows:auto auto;
  column-gap:.9rem; row-gap:.1rem; align-items:center; padding:.8rem 1rem .8rem .8rem; }
.cfg__actifImg{ grid-area:img; align-self:center; }
.cfg__actif b{ grid-area:nom; align-self:end; margin:0; }
.cfg__actifTxt{ grid-area:txt; align-self:start; }

/* ---- v37 : accompagnement & parcours ------------------------------------ */
.prises{ display:grid; grid-template-columns:repeat(auto-fit,minmax(232px,1fr)); gap:1px;
  background:rgba(20,52,42,.14); border:1px solid rgba(20,52,42,.14); border-radius:16px; overflow:hidden; }
.prise{ background:var(--bo-ivoire,#F5F2E9); padding:1.5rem 1.4rem 1.6rem; position:relative; }
.prise span{ display:block; font-family:"Cambria",Georgia,serif; font-size:.82rem;
  letter-spacing:.18em; color:var(--bo-or); margin-bottom:.7rem; }
.prise b{ display:block; font-family:"Cambria",Georgia,serif; font-weight:400; font-size:1.18rem;
  color:var(--bo-vert); margin-bottom:.4rem; }
.prise p{ margin:0; font-size:.9rem; color:#5B6156; line-height:1.55; }
.prise::after{ content:""; position:absolute; left:1.4rem; bottom:0; width:0; height:2px;
  background:var(--bo-or); transition:width .4s ease; }
.prise:hover::after{ width:34px; }
.prises__note{ margin:1.8rem 0 0; font-family:"Cambria",Georgia,serif; font-size:1.06rem;
  color:var(--bo-vert); max-width:62ch; }

/* le parcours : un fil doré, des jalons */
.parcours{ list-style:none; margin:0; padding:0; position:relative; max-width:76ch; }
.parcours::before{ content:""; position:absolute; left:19px; top:14px; bottom:34px; width:1px;
  background:linear-gradient(180deg, var(--bo-or), rgba(176,141,62,.25)); }
.parcours li{ position:relative; display:grid; grid-template-columns:40px 1fr; gap:1.2rem;
  padding:0 0 2rem; }
.parcours li i{ position:relative; z-index:1; width:40px; height:40px; border-radius:50%;
  display:grid; place-items:center; font-style:normal; font-family:"Cambria",Georgia,serif;
  font-size:1rem; color:var(--bo-vert); background:var(--bo-ivoire,#F5F2E9);
  box-shadow:0 0 0 1px var(--bo-or); }
.parcours li b{ display:block; font-family:"Cambria",Georgia,serif; font-weight:400;
  font-size:1.25rem; color:var(--bo-vert); margin-bottom:.3rem; }
.parcours li p{ margin:0 0 .5rem; color:#5B6156; font-size:.95rem; line-height:1.6; max-width:58ch; }
.parcours__t{ display:inline-block; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--bo-or-fonce,#8B6B2E); background:rgba(176,141,62,.14);
  border:1px solid rgba(176,141,62,.32); border-radius:99px; padding:.28rem .75rem; }
.parcours__fin{ margin:.6rem 0 0 4rem; font-family:"Cambria",Georgia,serif;
  font-size:clamp(1.3rem,2.4vw,1.75rem); color:var(--bo-vert); line-height:1.4; }
.parcours__fin b{ color:var(--bo-or-fonce,#8B6B2E); }

@media (max-width:640px){
  .parcours li{ grid-template-columns:32px 1fr; gap:.9rem; }
  .parcours::before{ left:15px; }
  .parcours li i{ width:32px; height:32px; font-size:.86rem; }
  .parcours__fin{ margin-left:0; }
}
/* tuile d'appel dans la grille d'accompagnement */
.prise--cta{ background:var(--bo-vert); display:flex; flex-direction:column; justify-content:center;
  text-decoration:none; transition:background .3s ease; }
.prise--cta b{ color:#fff; }
.prise--cta p{ color:#B9BCA8; }
.prise--cta .prise__go{ display:inline-flex; align-items:center; gap:.45rem; margin-top:1rem;
  font-family:var(--v-texte); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--bo-or-clair); }
.prise--cta .prise__go::after{ content:"→"; transition:transform .3s ease; }
.prise--cta:hover{ background:#0F2A22; }
.prise--cta:hover .prise__go::after{ transform:translateX(5px); }
.prise--cta::after{ display:none; }

/* ---- v39 : le logo ne se laisse plus écraser ---------------------------- */
.site-header__inner{ gap:1.4rem; flex-wrap:nowrap; }
.site-header__logo{ flex:0 0 auto; display:block; line-height:0; }
.site-header__logo img{ height:38px; width:auto; max-width:none; flex:0 0 auto;
  image-rendering:auto; }
.nav{ flex-wrap:nowrap; }
.nav a{ white-space:nowrap; }
/* on resserre au lieu de déborder */
@media (max-width:1240px){ .nav{ gap:1.15rem; } .nav a{ font-size:.72rem; letter-spacing:.1em; } }
@media (max-width:1080px){ .nav{ gap:.85rem; } .nav a{ font-size:.68rem; letter-spacing:.07em; }
  .nav .btn{ padding:.7rem 1rem; font-size:.66rem; } }
/* logo : un peu plus de présence, rendu net */
.site-header__logo img{ height:41px; }
.site-footer img{ image-rendering:auto; }

/* ---- v41 : packaging avec rendu premium (fond intégré) ------------------ */
.cfg__carte--pack.has-render .cfg__photo{ height:238px; border-radius:16px; overflow:hidden;
  box-shadow:0 12px 30px rgba(0,0,0,.34); }
.cfg__carte--pack.has-render .cfg__photo::before,
.cfg__carte--pack.has-render .cfg__photo::after{ display:none; }
.cfg__carte--pack.has-render .cfg__photo img{ position:absolute; inset:0; width:100%; height:100%;
  max-height:none; object-fit:cover; filter:none; transition:transform .5s cubic-bezier(.2,.7,.2,1); }
.cfg__carte--pack.has-render:hover .cfg__photo img{ transform:scale(1.05); }
.cfg__carte--pack.has-render.is-on .cfg__photo{ box-shadow:0 0 0 2px var(--bo-or), 0 12px 30px rgba(0,0,0,.4); }
/* aperçu latéral : rendu premium en médaillon carré */
.cfg__apDessin:has(img[src*="/render/"]){ background:none; box-shadow:none; padding:0; border-radius:14px; overflow:hidden; }
.cfg__apDessin img[src*="/render/"]{ width:100%; max-height:none; height:auto; object-fit:cover; filter:none; border-radius:14px; }