/* ───────────────────────────────────────────────
   V2 — éditoriale, crème, gros titres condensés
   ─────────────────────────────────────────────── */
:root {
  --cream: #ffffff;
  --cream-2: oklch(97% 0.008 85);
  --ink: oklch(18% 0.025 250);
  --ink-soft: oklch(40% 0.02 250);
  --ink-mute: oklch(58% 0.015 250);
  --rule: oklch(90% 0.008 85);
  --green-v2: oklch(48% 0.13 152);
  --green-soft: oklch(90% 0.05 152);
  --terra: oklch(62% 0.14 40);
  --terra-soft: oklch(92% 0.05 40);
}

html, body { background: #ffffff; }
body { color: var(--ink); font-family: 'Plus Jakarta Sans', sans-serif; }

/* override nav for white bg */
.site-nav { background: rgba(255,255,255,0.85) !important; border-bottom: 1px solid var(--rule) !important; }
.nav-logo { color: var(--ink) !important; font-family: 'Bricolage Grotesque', sans-serif; font-weight: 700; letter-spacing: -0.8px; }
.nav-logo span { color: var(--green-v2) !important; }
.nav-links a { color: var(--ink-soft) !important; }
.nav-links a:hover { color: var(--ink) !important; }

/* Display utilities */
.serif { font-family: 'Newsreader', serif; font-style: italic; font-weight: 400; }
.display {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95;
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 0.92;
  text-wrap: balance;
}

/* Eyebrow */
.eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 11px; font-weight: 700; letter-spacing: 1.8px; text-transform: uppercase;
  color: var(--ink-mute);
  font-family: 'Plus Jakarta Sans', sans-serif;
}
.eyebrow::before {
  content: ''; width: 28px; height: 1px; background: var(--ink-mute);
}
.eyebrow.green { color: var(--green-v2); }
.eyebrow.green::before { background: var(--green-v2); }

/* Buttons override */
.btn-ink {
  background: var(--ink); color: var(--cream);
  padding: 14px 24px; border-radius: 100px;
  font-size: 14px; font-weight: 600; text-decoration: none;
  display: inline-flex; align-items: center; gap: 10px;
  transition: transform .2s, background .2s;
}
.btn-ink:hover { background: oklch(28% 0.04 250); transform: translateY(-1px); }
.btn-ink .arrow { font-family: 'Newsreader', serif; font-style: italic; font-size: 18px; }
.btn-ghost {
  background: transparent; color: var(--ink);
  padding: 13px 22px; border-radius: 100px; border: 1.5px solid var(--ink);
  font-size: 14px; font-weight: 600; text-decoration: none;
  display: inline-flex; align-items: center; gap: 10px;
  transition: background .2s, color .2s;
}
.btn-ghost:hover { background: var(--ink); color: var(--cream); }
.btn-green-v2 {
  background: var(--green-v2); color: white;
  padding: 14px 24px; border-radius: 100px;
  font-size: 14px; font-weight: 600; text-decoration: none;
  display: inline-flex; align-items: center; gap: 10px;
  transition: transform .2s, opacity .2s;
}
.btn-green-v2:hover { opacity: 0.92; transform: translateY(-1px); }

/* ─── HERO V3 — texte gauche, photo droite ────── */
.v3-hero {
  padding: 120px 32px 56px;
  position: relative; overflow: hidden;
  max-width: 1400px; margin: 0 auto;
}
.v3-hero-grid {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 64px;
  align-items: center;
}
.v3-hero-eq {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95;
  font-weight: 800;
  letter-spacing: -0.045em;
  line-height: 0.92;
  text-wrap: balance;
  font-size: clamp(48px, 5.8vw, 92px);
  margin: 22px 0 0;
  color: var(--ink);
}
.v3-hero-eq .l1 { display: block; }
.v3-hero-eq .equals {
  font-family: 'Newsreader', serif;
  font-style: italic;
  font-weight: 400;
  font-variation-settings: normal;
  color: var(--green-v2);
  font-size: 1.05em;
  padding-right: 0.12em;
}
.v3-hero-eq .l2 {
  display: block;
  color: var(--green-v2);
}
.v3-hero-eq .l2 em {
  font-family: 'Newsreader', serif;
  font-style: italic;
  font-weight: 500;
  color: var(--ink);
  font-variation-settings: normal;
  padding-right: 10px;
}

.v3-hero-intro {
  font-family: 'Newsreader', serif; font-style: italic;
  font-size: clamp(17px, 1.4vw, 20px);
  color: var(--ink-soft);
  font-weight: 400;
  line-height: 1.55;
  max-width: 540px;
  text-wrap: pretty;
  margin: 28px 0 0;
}
.v3-hero-cta-row {
  display: flex; gap: 12px; flex-wrap: wrap;
  margin-top: 32px;
}
.v3-hero-meta {
  margin-top: 36px;
  padding-top: 26px;
  border-top: 1px solid var(--rule);
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px 28px;
}
.v3-hero-meta-col .label {
  font-size: 10.5px; text-transform: uppercase; letter-spacing: 1.5px;
  color: var(--ink-mute); font-weight: 700;
}
.v3-hero-meta-col .val {
  font-size: 14px; color: var(--ink); font-weight: 600;
  margin-top: 5px; line-height: 1.35;
}
.v3-hero-meta-col .val em {
  font-family: 'Newsreader', serif; font-style: italic;
  font-weight: 500; color: var(--green-v2);
}

.v3-hero-photo {
  position: relative;
  border-radius: 28px;
  overflow: hidden;
  background: #fafaf8;
  border: 1px solid var(--rule);
  aspect-ratio: 800 / 504;
}
.v3-hero-photo img {
  display: block; width: 100%; height: 100%;
  object-fit: cover;
  object-position: center center;
}
.v3-hero-photo-badge {
  position: absolute;
  top: 18px; left: 18px;
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,0.94);
  backdrop-filter: blur(8px);
  border-radius: 100px;
  padding: 8px 14px;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.6px;
  color: var(--ink);
  border: 1px solid var(--rule);
}
.v3-hero-photo-badge .live-dot { width: 6px; height: 6px; background: var(--green-v2); border-radius: 50%; animation: blink 1.6s infinite; }
.v3-hero-photo-stat {
  position: absolute;
  bottom: 18px; left: 18px; right: 18px;
  background: rgba(255,255,255,0.94);
  backdrop-filter: blur(8px);
  border: 1px solid var(--rule);
  border-radius: 18px;
  padding: 14px 18px;
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 16px;
}
.v3-hero-photo-stat .num {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 800;
  font-size: clamp(28px, 3.5vw, 44px);
  letter-spacing: -0.04em;
  line-height: 1;
  color: var(--ink);
}
.v3-hero-photo-stat .num em {
  font-family: 'Newsreader', serif;
  font-style: italic; font-weight: 400;
  color: var(--green-v2);
  font-size: 0.55em;
  vertical-align: super;
}
.v3-hero-photo-stat .lbl {
  font-size: 11px; line-height: 1.4;
  color: var(--ink-soft);
  text-align: right;
  max-width: 180px;
  font-weight: 600;
}

@media (max-width: 1000px) {
  .v3-hero-grid { grid-template-columns: 1fr; gap: 36px; }
  .v3-hero-photo { aspect-ratio: 800 / 504; }
}
@media (max-width: 600px) {
  .v3-hero { padding: 100px 18px 36px; }
  .v3-hero-meta { grid-template-columns: 1fr 1fr; gap: 16px; }
  .v3-hero-photo-stat { padding: 10px 12px; }
  .v3-hero-photo-stat .lbl { font-size: 10px; }
}

/* ─── HERO RÉF — texte gauche, bénéfices + photo + produits droite ─── */
:root { --benefit-blue: oklch(52% 0.15 255); }

.hero-ref {
  max-width: 1520px; margin: 0 auto;
  padding: 124px 40px 0;
  position: relative;
}
.hero-ref-grid {
  display: grid;
  grid-template-columns: 0.92fr 1.18fr;
  gap: 60px;
  align-items: start;
}

/* Eyebrow pill */
.hero-ref-pill {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--cream-2);
  border: 1px solid var(--rule);
  border-radius: 100px;
  padding: 9px 18px;
  font-size: 12px; font-weight: 700; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--ink);
  font-family: 'Plus Jakarta Sans', sans-serif;
}
.hero-ref-pill .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green-v2); }
.hero-ref-pill .sep { color: var(--green-v2); }
.hero-ref-pill .accent { color: var(--green-v2); }

/* Headline */
.hero-ref-h1 {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95;
  font-weight: 800;
  letter-spacing: -0.045em;
  line-height: 0.98;
  text-wrap: balance;
  font-size: clamp(42px, 4.4vw, 74px);
  margin: 26px 0 0;
  color: var(--ink);
}
.hero-ref-h1 .ink { display: block; }
.hero-ref-h1 .green { display: block; color: var(--green-v2); }
.hero-ref-h1 .serif-line {
  display: block;
  font-family: 'Newsreader', serif;
  font-style: italic;
  font-weight: 500;
  font-variation-settings: normal;
  letter-spacing: -0.01em;
  color: var(--ink);
  font-size: 0.74em;
  margin-top: 0.18em;
  position: relative;
  width: fit-content;
}
.hero-ref-h1 .serif-line .swoosh {
  position: absolute;
  left: 0; right: 6%;
  bottom: -0.14em;
  height: 12px;
  width: 78%;
  color: var(--green-v2);
}
.hero-ref-h1 .serif-line .swoosh svg { width: 100%; height: 100%; display: block; }

.hero-ref-intro {
  font-size: clamp(15px, 1.15vw, 17px);
  color: var(--ink-soft);
  font-weight: 400;
  line-height: 1.7;
  max-width: 460px;
  text-wrap: pretty;
  margin: 30px 0 0;
}
.hero-ref-cta-row {
  display: flex; gap: 14px; flex-wrap: wrap;
  margin-top: 34px;
}
.hero-ref-cta-row .btn-ink,
.hero-ref-cta-row .btn-ghost { padding: 16px 28px; font-size: 15px; }
/* libellé court du CTA principal : réservé au mobile (cf. media query 640px) */
.hero-ref-cta-row .btn-ink .cta-short { display: none; }
/* pastille statistique en ligne : réservée à la tablette (641-1080px), où le
   badge .hs-stat de la scène n'a plus de place — cf. media query dédiée */
.hero-stat-pill { display: none; }

/* Right column */
.hero-ref-right {
  display: flex; flex-direction: column;
  gap: 28px;
}

/* Benefits */
.hero-ref-benefits-title {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  font-size: clamp(18px, 1.5vw, 22px);
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0 0 4px;
}
.hero-ref-benefits {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
.hero-ref-benefit {
  background: #fff;
  border: 1px solid var(--rule);
  border-radius: 18px;
  padding: 22px 14px 18px;
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  text-align: center;
  box-shadow: 0 10px 30px oklch(0% 0 0 / 0.04);
}
.hero-ref-benefit .ic {
  color: var(--benefit-blue);
  display: flex; align-items: center; justify-content: center;
}
.hero-ref-benefit .ic svg { width: 34px; height: 34px; }
.hero-ref-benefit .lbl {
  font-size: 13.5px; font-weight: 600; line-height: 1.3;
  color: var(--ink); letter-spacing: -0.01em;
}

/* Photo */
.hero-ref-photo {
  display: block; width: 100%; height: auto;
  border-radius: 16px;
}

/* Products lineup */
.hero-ref-products {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  align-items: end;
  margin-top: -6px;
}
.hero-ref-prod {
  display: flex; flex-direction: column; align-items: center;
  position: relative;
}
.hero-ref-prod .pimg {
  height: 132px; width: auto; max-width: 100%;
  object-fit: contain;
  position: relative; z-index: 1;
  filter: drop-shadow(0 14px 18px oklch(0% 0 0 / 0.12));
}
.hero-ref-prod .podium {
  width: 86%; height: 16px;
  margin-top: 2px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, oklch(93% 0.004 250) 0%, oklch(97% 0.003 250) 70%, transparent 100%);
}

/* Trust bar */
.hero-ref-trust {
  max-width: 1520px; margin: 0 auto;
  padding: 30px 40px 0;
}
.hero-ref-trust-inner {
  display: flex; align-items: center; justify-content: center;
  flex-wrap: wrap;
  gap: 16px 56px;
  padding: 26px 32px;
  border-top: 1px solid var(--rule);
}
.hero-ref-trust-item {
  display: inline-flex; align-items: center; gap: 12px;
  font-size: 15px; font-weight: 600; color: var(--ink);
  letter-spacing: -0.01em;
}
.hero-ref-trust-item .ti-ic { color: var(--green-v2); display: flex; }
.hero-ref-trust-item .ti-ic svg { width: 20px; height: 20px; }
.hero-ref-flag {
  width: 22px; height: 15px; border-radius: 3px; overflow: hidden;
  display: inline-grid; grid-template-columns: 1fr 1fr 1fr;
  border: 1px solid var(--rule);
}
.hero-ref-flag i { display: block; }
.hero-ref-flag i:nth-child(1) { background: #1f3a93; }
.hero-ref-flag i:nth-child(2) { background: #fff; }
.hero-ref-flag i:nth-child(3) { background: #d4243a; }

@media (max-width: 1080px) {
  .hero-ref-grid { grid-template-columns: 1fr; gap: 48px; }
  .hero-ref-intro { max-width: none; }
}
@media (max-width: 640px) {
  .hero-ref { padding: 104px 18px 0; }
  /* pill : tenir sur une seule ligne dans 343px de large */
  .hero-ref-pill {
    gap: 5px;
    font-size: 11px;
    letter-spacing: 1.2px;
    padding: 8px 14px;
  }
  /* CTA : les deux boutons sur la même ligne, largeurs égales */
  .hero-ref-cta-row {
    flex-wrap: nowrap;
    gap: 10px;
    margin-top: 28px;
  }
  .hero-ref-cta-row .btn-ink,
  .hero-ref-cta-row .btn-ghost {
    flex: 1 1 0;
    justify-content: center;
    padding: 15px 12px;
    font-size: 14px;
    white-space: nowrap;
  }
  /* pas de place pour la flèche ni pour le libellé long */
  .hero-ref-cta-row .btn-ink .arrow,
  .hero-ref-cta-row .btn-ink .cta-long { display: none; }
  .hero-ref-cta-row .btn-ink .cta-short { display: inline; }
  .hero-ref-benefits { grid-template-columns: 1fr 1fr; }
  .hero-ref-trust { padding: 24px 18px 0; }
  .hero-ref-trust-inner { gap: 16px 28px; padding: 22px 0; }
  .hero-ref-trust-item { font-size: 13.5px; }
  .hero-ref-prod .pimg { height: 92px; }
}

/* ─── HERO ─────────────────────────────────────── */
.v2-hero {
  padding: 140px 32px 64px;
  position: relative; overflow: hidden;
}
.v2-hero-inner {
  max-width: 1400px; margin: 0 auto;
  display: grid; grid-template-columns: 1.15fr 1fr;
  gap: 64px; align-items: end;
}
.v2-hero-headline {
  font-size: clamp(64px, 11vw, 168px);
  margin: 24px 0 0;
}
.v2-hero-headline .l1 { display: block; }
.v2-hero-headline .l2 { display: block; color: var(--green-v2); }
.v2-hero-headline .l2 em {
  font-family: 'Newsreader', serif; font-style: italic;
  font-weight: 500; color: var(--ink);
  letter-spacing: -0.02em;
  font-variation-settings: normal;
  padding-right: 12px;
}
.v2-hero-meta {
  margin-top: 40px;
  display: flex; align-items: baseline; gap: 32px;
  flex-wrap: wrap;
  border-top: 1px solid var(--rule); padding-top: 28px;
}
.v2-hero-meta .label { font-size: 11px; text-transform: uppercase; letter-spacing: 1.5px; color: var(--ink-mute); }
.v2-hero-meta .val { font-size: 15px; color: var(--ink); font-weight: 600; margin-top: 4px; }
.v2-hero-meta-col { min-width: 0; }

.v2-hero-side {
  display: flex; flex-direction: column; gap: 24px;
  align-items: flex-end;
}
.v2-hero-card {
  background: var(--ink); color: var(--cream);
  border-radius: 24px; padding: 28px 28px 24px;
  width: 100%; max-width: 420px;
  position: relative; overflow: hidden;
}
.v2-hero-card-eyebrow {
  font-size: 10px; letter-spacing: 2px; text-transform: uppercase;
  color: oklch(72% 0.06 152); font-weight: 700;
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 18px;
}
.live-dot { width: 6px; height: 6px; background: var(--green-v2); border-radius: 50%; animation: blink 1.6s infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.3} }
.v2-hero-card-num {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 800; font-size: 84px; line-height: 0.9;
  letter-spacing: -0.05em;
}
.v2-hero-card-num em {
  font-family: 'Newsreader', serif; font-style: italic; font-weight: 400;
  font-size: 30px; vertical-align: super; color: oklch(70% 0.10 152);
  margin-left: 4px;
}
.v2-hero-card-sub { font-size: 13px; color: oklch(75% 0.02 250); line-height: 1.55; margin-top: 8px; max-width: 280px; }
.v2-hero-card-foot {
  margin-top: 22px; padding-top: 18px;
  border-top: 1px solid oklch(30% 0.04 250);
  display: flex; align-items: center; justify-content: space-between;
  font-size: 12px; color: oklch(72% 0.02 250);
}
.v2-hero-card-foot strong { color: white; font-weight: 700; }

.v2-hero-product-row {
  display: flex; gap: 12px; width: 100%; max-width: 420px;
}
.v2-hero-prod {
  flex: 1; background: white; border-radius: 18px;
  overflow: hidden; border: 1px solid var(--rule);
  display: flex; flex-direction: column;
}
.v2-hero-prod-img {
  aspect-ratio: 1; background: var(--cream-2);
  display: flex; align-items: center; justify-content: center;
  padding: 14px;
}
.v2-hero-prod-img img { width: 100%; height: 100%; object-fit: contain; }
.v2-hero-prod-name {
  padding: 10px 12px;
  font-size: 11px; font-weight: 700; color: var(--ink);
  letter-spacing: -0.2px;
  line-height: 1.3;
}

.v2-hero-cta-row {
  display: flex; gap: 12px; flex-wrap: wrap;
  margin-top: 36px;
}

.v2-hero-intro {
  font-family: 'Newsreader', serif; font-style: italic;
  font-size: clamp(18px, 1.8vw, 22px); color: var(--ink-soft);
  font-weight: 400; line-height: 1.55;
  max-width: 540px;
  text-wrap: pretty;
}

/* Marquee ticker */
.v2-ticker {
  background: var(--ink); color: var(--cream);
  padding: 18px 0; overflow: hidden; white-space: nowrap;
  border-top: 1px solid oklch(30% 0.04 250);
  border-bottom: 1px solid oklch(30% 0.04 250);
}
.v2-ticker-track {
  display: inline-flex; gap: 56px;
  animation: ticker 38s linear infinite;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700; font-size: 22px; letter-spacing: -0.5px;
  align-items: center;
}
.v2-ticker-track span { display: inline-flex; align-items: center; gap: 56px; }
.v2-ticker-track em {
  font-family: 'Newsreader', serif; font-style: italic; font-weight: 400;
  color: oklch(72% 0.10 152);
}
.v2-ticker-dot {
  width: 8px; height: 8px; border-radius: 50%; background: var(--green-v2); display: inline-block;
}
@keyframes ticker { from { transform: translateX(0) } to { transform: translateX(-50%) } }
@media (max-width: 640px) {
  .v2-ticker { padding: 13px 0; }
  .v2-ticker-track { font-size: 15px; gap: 26px; }
  .v2-ticker-track span { gap: 26px; }
  .v2-ticker-dot { width: 6px; height: 6px; }
}

/* ─── CONSTAT — Le bruit / Le calme ────────────── */
.v2-split {
  padding: 120px 32px;
  max-width: 1400px; margin: 0 auto;
}
.v2-split-head {
  max-width: 720px;
  margin-bottom: 72px;
}
.v2-split-head h2 {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95;
  font-size: clamp(40px, 5.5vw, 72px); font-weight: 800;
  letter-spacing: -0.04em; line-height: 0.95;
  margin: 18px 0 24px;
  text-wrap: balance;
}
.v2-split-head h2 em { font-family: 'Newsreader', serif; font-style: italic; font-weight: 500; font-variation-settings: normal; }
.v2-split-head p { font-size: 17px; color: var(--ink-soft); line-height: 1.7; max-width: 580px; }

.v2-split-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 32px;
}
.v2-split-card {
  border-radius: 28px; padding: 40px 36px 36px;
  display: flex; flex-direction: column;
  min-height: 460px;
  position: relative; overflow: hidden;
}
.v2-split-card.avant {
  background: var(--cream-2);
  border: 1px solid var(--rule);
}
.v2-split-card.apres {
  background: var(--ink); color: var(--cream);
}
.v2-split-tag {
  font-size: 11px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  display: inline-flex; align-items: center; gap: 10px;
}
.v2-split-tag .dot { width: 8px; height: 8px; border-radius: 50%; }
.v2-split-card.avant .dot { background: var(--terra); }
.v2-split-card.apres .dot { background: var(--green-v2); }
.v2-split-card.avant .v2-split-tag { color: var(--terra); }
.v2-split-card.apres .v2-split-tag { color: oklch(72% 0.10 152); }
.v2-split-title {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95;
  font-size: clamp(38px, 5vw, 56px); font-weight: 800;
  letter-spacing: -0.04em; line-height: 0.95;
  margin-top: 18px;
}
.v2-split-title em { font-family: 'Newsreader', serif; font-style: italic; font-weight: 500; font-variation-settings: normal; }
.v2-split-list {
  margin-top: auto;
  padding-top: 32px;
  list-style: none;
}
.v2-split-list li {
  display: flex; align-items: baseline; gap: 14px;
  padding: 14px 0;
  font-size: 15px; line-height: 1.55;
  border-top: 1px solid;
}
.v2-split-card.avant li { border-color: oklch(85% 0.012 85); color: var(--ink-soft); }
.v2-split-card.apres li { border-color: oklch(30% 0.04 250); color: oklch(82% 0.02 250); }
.v2-split-list .n {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700; font-size: 13px;
  min-width: 28px;
  letter-spacing: -0.2px;
}
.v2-split-card.avant .n { color: var(--terra); }
.v2-split-card.apres .n { color: oklch(72% 0.10 152); }

.v2-split-stat {
  display: flex; align-items: baseline; gap: 20px;
  margin-top: 28px;
}
.v2-split-stat .big {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 800; font-size: 88px; line-height: 0.9;
  letter-spacing: -0.05em;
}
.v2-split-card.avant .big { color: var(--terra); }
.v2-split-card.apres .big { color: oklch(78% 0.10 152); }
.v2-split-stat .lbl { font-size: 13px; line-height: 1.4; max-width: 160px; }
.v2-split-card.avant .lbl { color: var(--ink-soft); }
.v2-split-card.apres .lbl { color: oklch(70% 0.02 250); }

/* ─── PRODUCT INDEX ────────────────────────────── */
.v2-index {
  background: var(--ink); color: var(--cream);
  padding: 56px 32px 72px;
}
.v2-index-inner { max-width: 1400px; margin: 0 auto; }
.v2-index-head {
  display: grid; grid-template-columns: 1.2fr 1fr;
  gap: 48px; align-items: end;
  margin-bottom: 72px;
}
/* .pep-h2 = classe posée sur le widget Titre Elementor (le CSS v4 d'Elementor
   force font:inherit sur .elementor-heading-title, la typo doit donc vivre sur
   le wrapper — extension de sélecteur, mêmes valeurs). */
.v2-index-head h2,
.v2-index-head .pep-h2 {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95;
  font-size: clamp(28px, 3.2vw, 44px); font-weight: 800;
  letter-spacing: -0.035em; line-height: 1;
  margin-top: 18px;
}
.v2-index-head .pep-h2 em,
.v2-index-head h2 em {
  font-family: 'Newsreader', serif; font-style: italic; font-weight: 500;
  color: oklch(72% 0.10 152); font-variation-settings: normal;
}
.v2-index-head p {
  font-family: 'Newsreader', serif; font-style: italic;
  font-size: 19px; color: oklch(78% 0.02 250); line-height: 1.6;
  text-wrap: pretty;
}
.v2-index-head .eyebrow { color: oklch(70% 0.10 152); }
.v2-index-head .eyebrow::before { background: oklch(70% 0.10 152); }

.v2-index-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}
.v2-prod {
  grid-column: span 1;
  background: oklch(24% 0.03 250);
  border-radius: 20px; overflow: hidden;
  display: flex; flex-direction: column;
  transition: transform .25s, background .25s;
}
.v2-prod:hover { transform: translateY(-4px); background: oklch(27% 0.035 250); }
.v2-prod-img {
  aspect-ratio: 4/3; background: oklch(20% 0.025 250);
  display: flex; align-items: center; justify-content: center;
  padding: 24px; position: relative;
}
.v2-prod-img img { width: 100%; height: 100%; object-fit: contain; }
.v2-prod-num { display: none;
  position: absolute; top: 16px; left: 18px;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700; font-size: 11px;
  color: oklch(60% 0.02 250); letter-spacing: 2px;
}
.v2-prod-tag {
  position: absolute; top: 16px; right: 16px;
  font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
  padding: 5px 10px; border-radius: 100px;
  background: oklch(30% 0.03 250); color: oklch(78% 0.02 250);
}
.v2-prod-tag.fr { background: var(--green-v2); color: white; }
.v2-prod-tag.hot { background: var(--terra); color: white; }
.v2-prod-body {
  padding: 18px 22px 22px;
  display: flex; flex-direction: column; gap: 6px;
  flex: 1;
}
.v2-prod-cat { font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; color: oklch(62% 0.02 250); font-weight: 600; }
.v2-prod-name {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700; font-size: 19px;
  letter-spacing: -0.02em; color: white;
}
.v2-prod-desc { font-size: 13px; color: oklch(72% 0.02 250); line-height: 1.55; }
.v2-prod-foot {
  margin-top: auto; padding-top: 18px;
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
  border-top: 1px solid oklch(30% 0.03 250); margin-left: 22px; margin-right: 22px; padding-bottom: 18px;
}
.v2-prod-price {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700; font-size: 22px; letter-spacing: -0.02em; color: white;
}
.v2-prod-price small { font-size: 11px; font-weight: 500; color: oklch(62% 0.02 250); }
.v2-prod-link {
  font-size: 12px; color: oklch(72% 0.10 152); text-decoration: none; font-weight: 600;
  display: inline-flex; align-items: center; gap: 6px;
}
.v2-prod-link em { font-family: 'Newsreader', serif; font-style: italic; }

.v2-prod.wide { grid-column: span 2; }

.v2-index-foot {
  margin-top: 56px; display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 16px;
  padding-top: 32px; border-top: 1px solid oklch(30% 0.03 250);
}
.v2-index-foot p { font-family: 'Newsreader', serif; font-style: italic; color: oklch(75% 0.02 250); font-size: 18px; }

/* ─── KIT DÉMO — éditorial ─────────────────────── */
.v2-kit {
  padding: 72px 32px;
  max-width: 1320px; margin: 0 auto; /* maquette (retour client : marges) */
  display: grid; grid-template-columns: 1fr 1.1fr;
  gap: 80px; align-items: center;
}
.v2-kit-headline {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95;
  font-size: clamp(40px, 5.5vw, 76px); font-weight: 800;
  letter-spacing: -0.04em; line-height: 0.95;
  margin: 18px 0 24px;
}
.v2-kit-headline em { font-family: 'Newsreader', serif; font-style: italic; font-weight: 500; font-variation-settings: normal; color: var(--green-v2); }
.v2-kit p { font-size: 17px; color: var(--ink-soft); line-height: 1.7; max-width: 480px; margin-bottom: 28px; }
.v2-kit-info { display: flex; gap: 28px; margin-top: 28px; flex-wrap: wrap; }
.v2-kit-info > div { border-left: 1px solid var(--rule); padding-left: 16px; }
.v2-kit-info-lbl { font-size: 11px; text-transform: uppercase; letter-spacing: 1.5px; color: var(--ink-mute); font-weight: 700; }
.v2-kit-info-val { font-family: 'Bricolage Grotesque', sans-serif; font-size: 26px; font-weight: 700; letter-spacing: -0.04em; margin-top: 4px; color: var(--ink); }
.v2-kit-info-note { font-size: 12px; color: var(--ink-mute); margin-top: 4px; font-family: 'Newsreader', serif; font-style: italic; }

.v2-kit-box {
  background: white; border-radius: 28px; border: 1px solid var(--rule);
  padding: 0; position: relative;
  box-shadow: 0 24px 60px oklch(0% 0 0 / 0.06);
  overflow: hidden;
}
.v2-kit-box-tag {
  position: absolute; top: 20px; right: 20px; z-index: 2;
  background: var(--green-v2); color: white;
  padding: 7px 16px; border-radius: 100px;
  font-size: 11px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase;
}
.v2-kit-box-photo,
.v2-kit-box-photo img { /* extension : classe posée sur le widget Image Elementor */
  display: block; width: 100%; aspect-ratio: 1/1;
  object-fit: contain; object-position: center;
  background: #ffffff;
}
.v2-kit-box { /* clip the scaled image */ }
.v2-kit-box-body { padding: 24px 28px 28px; }
.v2-kit-box-title {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 800; font-size: 22px; letter-spacing: -0.02em;
  margin-bottom: 4px;
}
.v2-kit-box-sub { font-size: 13px; color: var(--ink-mute); margin-bottom: 18px; font-family: 'Newsreader', serif; font-style: italic; font-size: 15px; }
.v2-kit-checks { display: flex; flex-direction: column; gap: 10px; }
.v2-kit-check { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--ink-soft); }
.v2-kit-check svg { flex-shrink: 0; }

/* ─── KIT DÉMO — animation d'entrée ────────────── */
@media (prefers-reduced-motion: no-preference) {
  .v2-kit .kit-rise {
    opacity: 0;
    transform: translateY(26px);
    transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);
    transition-delay: var(--kit-delay, 0s);
    will-change: opacity, transform;
  }
  .v2-kit .kit-box-rise {
    opacity: 0;
    transform: translateY(34px) scale(.97);
    transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1);
    transition-delay: var(--kit-delay, 0s);
    will-change: opacity, transform;
  }
  .v2-kit.kit-in .kit-rise { opacity: 1; transform: none; }
  .v2-kit.kit-in .kit-box-rise { opacity: 1; transform: none; }
  /* flottement continu une fois révélé */
  .v2-kit.kit-in .kit-box-rise { animation: kitFloat 6s ease-in-out 1s infinite; }
  @keyframes kitFloat { 0%,100% { translate: 0 0; } 50% { translate: 0 -9px; } }
  /* pastille de composition */
  .v2-kit.kit-in .v2-kit-box-tag { animation: kitTagPop .5s cubic-bezier(.34,1.56,.64,1) 0.9s both; }
  @keyframes kitTagPop { from { opacity: 0; transform: scale(.7); } to { opacity: 1; transform: scale(1); } }
}

/* ─── LIVRE BLANC ────────────────────────────── */
.v2-livre { padding: 72px 32px; max-width: 1400px; margin: 0 auto; }
.v2-livre-inner { display: grid; grid-template-columns: 1.05fr 1fr; gap: 80px; align-items: center; }
.v2-livre-head .eyebrow { color: var(--green-v2); }
.v2-livre-head .eyebrow::before { background: var(--green-v2); }
.v2-livre h2,
.v2-livre .pep-h2 { /* .pep-h2 : classe posée sur le widget Titre Elementor (typo sur wrapper) */
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95;
  font-size: clamp(40px, 5.5vw, 76px); font-weight: 800;
  letter-spacing: -0.04em; line-height: 0.95;
  margin: 18px 0 24px;
}
.v2-livre h2 em,
.v2-livre .pep-h2 em { font-family: 'Newsreader', serif; font-style: italic; font-weight: 500; font-variation-settings: normal; color: var(--green-v2); }
.v2-livre p { font-size: 17px; color: var(--ink-soft); line-height: 1.7; max-width: 500px; margin-bottom: 28px; }
.v2-livre-meta { display: flex; gap: 28px; margin-top: 28px; flex-wrap: wrap; }
.v2-livre-meta > div { border-left: 1px solid var(--rule); padding-left: 16px; }
.v2-livre-meta-lbl { font-size: 11px; text-transform: uppercase; letter-spacing: 1.5px; color: var(--ink-mute); font-weight: 700; }
.v2-livre-meta-val { font-family: 'Bricolage Grotesque', sans-serif; font-size: 22px; font-weight: 700; letter-spacing: -0.03em; margin-top: 4px; color: var(--ink); }
.v2-livre-cover {
  position: relative; aspect-ratio: 448/640; max-width: 460px; margin: 0 auto;
  border-radius: 12px;
  box-shadow: 0 30px 80px oklch(0% 0 0 / 0.18), 0 6px 20px oklch(0% 0 0 / 0.06);
  overflow: hidden;
  transform: rotate(-1.2deg);
  transition: transform .4s ease;
  background: #fff;
}
.v2-livre-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.v2-livre-cover:hover { transform: rotate(0deg) translateY(-4px); }
@media (max-width: 960px) { .v2-livre-inner { grid-template-columns: 1fr; gap: 56px; } }
@media (max-width: 600px) { .v2-livre { padding: 80px 20px 20px; } }


/* ─── TÉMOIGNAGE PHARE ─────────────────────────── */
.v2-quote {
  background: var(--cream-2);
  padding: 72px 32px;
}
.v2-quote-inner {
  max-width: 1100px; margin: 0 auto;
  text-align: center;
}
.v2-quote-mark {
  font-family: 'Newsreader', serif; font-style: italic;
  font-size: 180px; line-height: 0.5;
  color: var(--green-v2); font-weight: 400;
  height: 80px;
}
.v2-quote-body {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95;
  font-weight: 500; font-size: clamp(28px, 3.6vw, 48px);
  letter-spacing: -0.02em; line-height: 1.18;
  color: var(--ink); text-wrap: balance;
  margin: 32px 0 40px;
}
.v2-quote-body em { font-family: 'Newsreader', serif; font-style: italic; font-weight: 400; font-variation-settings: normal; }
.v2-quote-author {
  display: inline-flex; align-items: center; gap: 14px;
  font-size: 14px; color: var(--ink-soft);
}
.v2-quote-author strong { color: var(--ink); font-weight: 700; }
.v2-quote-author .sep { color: var(--rule); }

.v2-quote-others {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
  margin-top: 80px; padding-top: 56px;
  border-top: 1px solid var(--rule);
}
.v2-quote-mini {
  text-align: left; padding: 24px 0;
  font-size: 15px; color: var(--ink-soft); line-height: 1.6;
  font-family: 'Newsreader', serif; font-style: italic;
}
.v2-quote-mini-author { margin-top: 14px; font-style: normal; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 12px; color: var(--ink-mute); font-weight: 600; }
.v2-quote-mini-author strong { display: block; color: var(--ink); font-size: 13px; font-weight: 700; margin-bottom: 2px; }

/* ─── DÉMARCHE — timeline ─────────────────────── */
.v2-flow { padding: 72px 32px; max-width: 1400px; margin: 0 auto; }
.v2-flow-head { margin-bottom: 80px; max-width: 720px; }
.v2-flow-head h2 {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95;
  font-size: clamp(44px, 6vw, 84px); font-weight: 800;
  letter-spacing: -0.04em; line-height: 0.93;
  margin-top: 18px;
}
.v2-flow-head h2 em { font-family: 'Newsreader', serif; font-style: italic; font-weight: 500; font-variation-settings: normal; }
.v2-flow-steps {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 0;
  border-top: 1px solid var(--ink);
}
.v2-flow-step {
  padding: 32px 24px 28px;
  border-right: 1px solid var(--rule);
  position: relative;
  display: flex; flex-direction: column; gap: 18px;
  min-height: 280px;
}
.v2-flow-step:last-child { border-right: none; }
.v2-flow-step-num {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 800; font-size: 14px; letter-spacing: 2px;
  color: var(--green-v2);
}
.v2-flow-step h4 {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700; font-size: 24px; letter-spacing: -0.03em;
  line-height: 1.05; color: var(--ink);
}
.v2-flow-step h4 em { font-family: 'Newsreader', serif; font-style: italic; font-weight: 500; }
.v2-flow-step p { font-size: 14px; color: var(--ink-soft); line-height: 1.65; margin-top: auto; }

/* ─── VISIO ────────────────────────────────────── */
.v2-call {
  background: var(--ink); color: var(--cream);
  padding: 72px 32px;
}
.v2-call-inner {
  max-width: 1100px; margin: 0 auto;
  display: grid; grid-template-columns: 1.1fr 1fr;
  gap: 80px; align-items: center;
}
.v2-call-headline {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95;
  font-size: clamp(40px, 5.5vw, 72px); font-weight: 800;
  letter-spacing: -0.04em; line-height: 0.95;
  margin: 18px 0 28px;
}
.v2-call-headline em { font-family: 'Newsreader', serif; font-style: italic; font-weight: 500; color: oklch(72% 0.10 152); font-variation-settings: normal; }
.v2-call p { font-size: 17px; color: oklch(78% 0.02 250); line-height: 1.7; max-width: 460px; margin-bottom: 32px; }
.v2-call .eyebrow { color: oklch(72% 0.10 152); }
.v2-call .eyebrow::before { background: oklch(72% 0.10 152); }
.v2-call-list { list-style: none; }
.v2-call-list li { padding: 12px 0; border-top: 1px solid oklch(30% 0.04 250); font-size: 14px; color: oklch(82% 0.02 250); display: flex; gap: 16px; align-items: baseline; }
.v2-call-list .n { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 700; color: oklch(72% 0.10 152); font-size: 13px; min-width: 24px; }

.v2-call-card {
  background: oklch(24% 0.03 250); border-radius: 24px;
  padding: 32px;
  border: 1px solid oklch(32% 0.035 250);
}
.v2-call-card h3,
.v2-call-card .pep-h3 { /* .pep-h3 : classe posée sur le widget Titre (typo sur wrapper) */
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700; font-size: 22px; color: white;
  margin-bottom: 6px;
}
.v2-call-card .sub { font-family: 'Newsreader', serif; font-style: italic; font-size: 15px; color: oklch(70% 0.02 250); margin-bottom: 24px; }
.v2-call-slots { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 20px; }
.v2-slot {
  background: oklch(28% 0.035 250); border-radius: 12px;
  padding: 14px 6px; text-align: center; cursor: pointer;
  transition: all .2s;
  border: 1px solid transparent;
}
.v2-slot:hover { background: oklch(32% 0.04 250); }
.v2-slot.active { background: var(--green-v2); }
.v2-slot-day { font-size: 11px; font-weight: 700; color: oklch(82% 0.02 250); text-transform: uppercase; letter-spacing: 1px; }
.v2-slot.active .v2-slot-day { color: white; }
.v2-slot-hour { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 700; font-size: 16px; color: white; margin-top: 4px; letter-spacing: -0.02em; }
.v2-call-btn {
  width: 100%; padding: 16px; border-radius: 100px;
  background: var(--green-v2); color: white;
  border: none; font-size: 14px; font-weight: 700;
  cursor: pointer; transition: opacity .2s;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  text-decoration: none; box-sizing: border-box; margin-top: 24px;
}
.v2-call-btn:hover { opacity: 0.9; }
/* icône calendrier + libellé court : réservés au mobile (cf. media query 600px) */
.v2-call-btn .ic { display: none; align-items: center; }
.v2-call-btn .ic svg { width: 18px; height: 18px; display: block; }
.v2-call-btn .lbl-short { display: none; }
.v2-call-note { font-size: 12px; color: oklch(62% 0.02 250); text-align: center; margin-top: 12px; font-family: 'Newsreader', serif; font-style: italic; }

/* ─── CTA FINAL ─────────────────────────────────── */
.v2-final {
  padding: 80px 32px;
  background: var(--cream-2);
  text-align: center;
  position: relative; overflow: hidden;
}
.v2-final-inner { max-width: 980px; margin: 0 auto; position: relative; z-index: 1; }
.v2-final h2,
.v2-final .pep-h2 { /* .pep-h2 : classe posée sur le widget Titre (typo sur wrapper) */
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95;
  font-weight: 800; font-size: clamp(48px, 8vw, 128px);
  letter-spacing: -0.05em; line-height: 0.92;
  margin: 24px 0 32px;
}
.v2-final h2 em,
.v2-final .pep-h2 em { font-family: 'Newsreader', serif; font-style: italic; font-weight: 500; color: var(--green-v2); font-variation-settings: normal; }
.v2-final p {
  font-family: 'Newsreader', serif; font-style: italic;
  font-size: 20px; color: var(--ink-soft); line-height: 1.55;
  max-width: 620px; margin: 0 auto 40px;
}
.v2-final-ctas { display: inline-flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
/* libellés courts des deux CTA : réservés au mobile (cf. media query 600px) */
.v2-final-ctas .cta-short { display: none; }
.v2-final-note { margin-top: 36px; font-size: 12px; color: var(--ink-mute); letter-spacing: 1.5px; text-transform: uppercase; font-weight: 600; }

/* footer override — #05294F (retour client 23/07), aligné sur site.css */
.site-footer { background: #05294F !important; }

/* responsive */
@media (max-width: 960px) {
  .v2-hero-inner { grid-template-columns: 1fr; gap: 48px; }
  .v2-hero-side { align-items: stretch; }
  .v2-split-grid { grid-template-columns: 1fr; }
  .v2-index-head { grid-template-columns: 1fr; }
  .v2-index-grid { grid-template-columns: repeat(2, 1fr); }
  .v2-prod, .v2-prod.wide { grid-column: span 1; }
  .v2-kit { grid-template-columns: 1fr; gap: 56px; }
  .v2-quote-others { grid-template-columns: 1fr; }
  .v2-flow-steps { grid-template-columns: 1fr 1fr; }
  .v2-flow-step:nth-child(2) { border-right: none; }
  .v2-call-inner { grid-template-columns: 1fr; gap: 56px; }
}
@media (max-width: 600px) {
  .v2-hero { padding: 110px 20px 48px; }
  .v2-split, .v2-flow { padding: 80px 20px; }
  .v2-kit { padding: 80px 20px 0; } /* kit démo : pas de marge basse en mobile */
  .v2-call, .v2-quote { padding: 80px 20px 20px; }
  /* bouton visio : icône calendrier + « Réserver », le tout sur une seule ligne */
  .v2-call-btn { font-size: 18px; }
  .v2-call-btn .lbl-long,
  .v2-call-btn .arrow { display: none; }
  .v2-call-btn .ic,
  .v2-call-btn .lbl-short { display: inline-flex; }
  /* témoignage : guillemet plus petit et sans réserve de hauteur, citation collée dessous */
  .v2-quote-mark { font-size: 120px; height: 0; }
  .v2-quote-body { margin: 20px 0 40px; }
  .v2-index { padding: 60px 20px 0; } /* catalogue : bloc resserré en mobile, sans marge basse */
  .v2-final { padding: 100px 20px; }
  /* CTA final : les deux boutons sur la même ligne, largeurs égales */
  .v2-final-ctas {
    display: flex; /* et non inline-flex : il faut toute la largeur pour répartir */
    flex-wrap: nowrap; gap: 10px;
  }
  .v2-final-ctas .btn-ink,
  .v2-final-ctas .btn-ghost {
    flex: 1 1 0;
    justify-content: center;
    padding: 15px 12px;
    font-size: 14px;
    white-space: nowrap;
  }
  .v2-final-ctas .cta-long,
  .v2-final-ctas .arrow { display: none; }
  .v2-final-ctas .cta-short { display: inline; }
  .v2-index-grid { grid-template-columns: 1fr; }
  .v2-kit-items { grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
  .v2-flow-steps { grid-template-columns: 1fr; }
  .v2-flow-step { border-right: none; border-bottom: 1px solid var(--rule); }
  .v2-flow-step:last-child { border-bottom: none; }
  .v2-hero-meta { flex-direction: column; gap: 16px; align-items: stretch; }
}

/* ─────────────────────────────────────────────
   ALL-WHITE OVERRIDE — tout la page sur fond blanc
   ───────────────────────────────────────────── */
.v2-ticker { background: #fff !important; color: var(--ink) !important; border-color: var(--rule) !important; }
.v2-ticker-track em { color: var(--green-v2) !important; }

.v2-hero-card { background: #fff !important; color: var(--ink) !important; border: 1px solid var(--rule); }
.v2-hero-card-eyebrow { color: var(--green-v2) !important; }
.v2-hero-card-num em { color: var(--green-v2) !important; }
.v2-hero-card-sub { color: var(--ink-soft) !important; }
.v2-hero-card-foot { border-top-color: var(--rule) !important; color: var(--ink-mute) !important; }
.v2-hero-card-foot strong { color: var(--ink) !important; }
.v2-hero-prod-img { background: #fafaf8 !important; }
.v2-hero-prod { border-color: var(--rule); }

.v2-split-card.avant { background: #fff !important; }
.v2-split-card.apres { background: #fff !important; color: var(--ink) !important; border: 1px solid var(--rule); }
.v2-split-card.apres .v2-split-tag { color: var(--green-v2) !important; }
.v2-split-card.apres li { border-top-color: var(--rule) !important; color: var(--ink-soft) !important; }
.v2-split-card.apres .n { color: var(--green-v2) !important; }
.v2-split-card.apres .lbl { color: var(--ink-soft) !important; }
.v2-split-card.apres .big { color: var(--green-v2) !important; }

.v2-index { background: #fff !important; color: var(--ink) !important; }
.v2-index-head h2 em { color: var(--green-v2) !important; }
.v2-index-head p { color: var(--ink-soft) !important; }
.v2-index-head .eyebrow { color: var(--ink-mute) !important; }
.v2-index-head .eyebrow::before { background: var(--ink-mute) !important; }

.v2-prod { background: #fff !important; border: 1px solid var(--rule); }
.v2-prod:hover { background: #fafaf8 !important; }
.v2-prod-img { background: #fafaf8 !important; }
.v2-prod-num { color: var(--ink-mute) !important; }
.v2-prod-tag { background: #f1efea !important; color: var(--ink-soft) !important; }
.v2-prod-tag.fr { background: var(--green-v2) !important; color: #fff !important; }
.v2-prod-tag.hot { background: var(--terra) !important; color: #fff !important; }
.v2-prod-cat { color: var(--ink-mute) !important; }
.v2-prod-name { color: var(--ink) !important; }
.v2-prod-desc { color: var(--ink-soft) !important; }
.v2-prod-foot { border-top-color: var(--rule) !important; }
.v2-prod-price { color: var(--ink) !important; }
.v2-prod-price small { color: var(--ink-mute) !important; }
.v2-prod-link { color: var(--green-v2) !important; }

.v2-index-foot { border-top-color: var(--rule) !important; }
.v2-index-foot p { color: var(--ink-soft) !important; }

.v2-kit-item { background: #fafaf8 !important; }

.v2-quote { background: #fff !important; }
.v2-quote-others { border-top-color: var(--rule) !important; }

.v2-call { background: #fff !important; color: var(--ink) !important; }
.v2-call-headline em { color: var(--green-v2) !important; }
.v2-call p { color: var(--ink-soft) !important; }
.v2-call .eyebrow { color: var(--ink-mute) !important; }
.v2-call .eyebrow::before { background: var(--ink-mute) !important; }
.v2-call-list li { border-top-color: var(--rule) !important; color: var(--ink-soft) !important; }
.v2-call-list .n { color: var(--green-v2) !important; }

.v2-call-card { background: #fafaf8 !important; border: 1px solid var(--rule) !important; }
.v2-call-card h3 { color: var(--ink) !important; }
.v2-call-card .sub { color: var(--ink-mute) !important; }
.v2-slot { background: #fff !important; border: 1px solid var(--rule) !important; }
.v2-slot:hover { background: #f1efea !important; }
.v2-slot.active { background: var(--green-v2) !important; border-color: var(--green-v2) !important; }
.v2-slot-day { color: var(--ink-mute) !important; }
.v2-slot.active .v2-slot-day { color: #fff !important; }
.v2-slot-hour { color: var(--ink) !important; }
.v2-slot.active .v2-slot-hour { color: #fff !important; }
.v2-call-note { color: var(--ink-mute) !important; }

.v2-final { background: #fff !important; border-top: 1px solid var(--rule); }

/* ═══════════════════════════════════════════════
   SHOP GRID — vignettes produits mises en valeur
   ═══════════════════════════════════════════════ */
.shop-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.shop-card {
  position: relative;
  background: #fff;
  border: 1px solid var(--rule);
  border-radius: 24px;
  overflow: hidden;
  display: flex; flex-direction: column;
  text-decoration: none;
  transition: transform .34s cubic-bezier(.2,.7,.2,1), box-shadow .34s, border-color .34s;
}
.shop-card:hover {
  transform: translateY(-6px);
  border-color: transparent;
}

/* média + halo */
.shop-media {
  position: relative;
  aspect-ratio: 1;
  display: flex; align-items: center; justify-content: center;
  padding: 30px;
  background: #fff;
}
.shop-media::before {
  content: '';
  position: absolute; inset: 16%;
  background: radial-gradient(circle at 50% 46%, oklch(93% 0.06 152 / 0.85), transparent 68%);
  border-radius: 50%;
  transition: transform .5s cubic-bezier(.2,.7,.2,1), opacity .5s;
  opacity: 0;
}
.shop-card:hover .shop-media::before { transform: scale(1.14); opacity: 1; }
.shop-media img {
  position: relative; z-index: 1;
  max-width: 84%; max-height: 84%;
  object-fit: contain;
  transition: transform .5s cubic-bezier(.2,.7,.2,1);
}
.shop-card:hover .shop-media img { transform: scale(1.07) translateY(-6px); }

/* pastille prix */
.shop-price {
  position: absolute; top: 16px; right: 16px; z-index: 3;
  display: inline-flex; align-items: baseline; gap: 3px;
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(6px);
  border: 1px solid var(--rule);
  border-radius: 100px;
  padding: 8px 14px;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 800; font-size: 15px; letter-spacing: -0.02em;
  color: var(--ink);
}
.shop-price small { font-size: 10px; font-weight: 600; color: var(--ink-mute); letter-spacing: 0; }

/* tags */
.shop-tag {
  position: absolute; top: 16px; left: 16px; z-index: 3;
  font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
  padding: 6px 11px; border-radius: 100px;
}
.shop-tag.fr { background: var(--green-v2); color: #fff; }
.shop-tag.hot { background: var(--terra); color: #fff; }

/* corps */
.shop-body {
  padding: 20px 22px 22px;
  display: flex; flex-direction: column; gap: 5px;
  flex: 1;
  border-top: 1px solid var(--rule);
}
.shop-cat {
  font-size: 10.5px; letter-spacing: 1.4px; text-transform: uppercase;
  color: var(--green-v2); font-weight: 700;
}
.shop-name {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700; font-size: 20px; letter-spacing: -0.025em;
  color: var(--ink); line-height: 1.08;
}
.shop-desc {
  font-size: 13px; color: var(--ink-soft); line-height: 1.5;
  margin-top: 2px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.shop-foot {
  margin-top: auto; padding-top: 16px;
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.shop-foot .go {
  font-size: 13px; font-weight: 600; color: var(--ink-soft);
  display: inline-flex; align-items: center; gap: 6px;
  transition: color .25s;
}
.shop-card:hover .shop-foot .go { color: var(--ink); }
.shop-arrow {
  width: 40px; height: 40px; border-radius: 50%;
  border: 1.5px solid var(--rule);
  display: flex; align-items: center; justify-content: center;
  color: var(--ink); flex-shrink: 0;
  transition: background .28s, color .28s, border-color .28s, transform .28s;
}
.shop-card:hover .shop-arrow {
  background: var(--green-v2); border-color: var(--green-v2); color: #fff;
  transform: rotate(-45deg);
}
.shop-arrow svg { width: 17px; height: 17px; }

@media (max-width: 960px) {
  .shop-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .shop-grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════
   HERO SCÈNE (V4) — bannière showroom interactive
   ═══════════════════════════════════════════════ */
.hs {
  position: relative;
  max-width: 1560px; margin: 0 auto;
  padding: 92px 40px 12px;
  overflow: hidden;
}
.hs-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.hs-blob {
  position: absolute; border-radius: 50%;
  background: radial-gradient(circle at 40% 40%, oklch(92% 0.06 152 / 0.55), transparent 68%);
}
.hs-blob.b1 { width: 460px; height: 460px; top: -120px; left: 44%; }
.hs-blob.b2 { width: 520px; height: 520px; bottom: -180px; right: -80px; opacity: 0.7; }
.hs-blob.b3 {
  width: 70px; height: 70px; bottom: 120px; left: 4%;
  background: radial-gradient(circle at 38% 34%, oklch(90% 0.07 152 / 0.9), oklch(86% 0.08 152 / 0.35));
}
.hs-arc {
  position: absolute; top: -140px; left: -180px; width: 620px; height: 620px;
  border: 1px solid oklch(88% 0.02 152 / 0.6); border-radius: 50%;
}
.hs-arc.a2 { top: -100px; left: -140px; width: 540px; height: 540px; border-color: oklch(90% 0.015 152 / 0.5); }

.hs-grid {
  position: relative; z-index: 2;
  display: grid; grid-template-columns: 0.84fr 1.16fr;
  gap: 32px; align-items: center;
}
.hs-copy { padding-bottom: 12px; }

/* Scene */
.hs-scene {
  position: relative; width: 100%;
  aspect-ratio: 800 / 580;
  z-index: 2;
}
@media (prefers-reduced-motion: no-preference) {
  .hs-anim { opacity: 0; animation: hsRise .8s cubic-bezier(.2,.7,.2,1) forwards; }
}
@keyframes hsRise { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes hsRisePhoto { from { opacity: 0; transform: translate(-50%, 22px); } to { opacity: 1; transform: translateX(-50%); } }
@media (prefers-reduced-motion: no-preference) {
  .hs-photo.hs-anim { animation-name: hsRisePhoto; }
}

/* Benefit cards */
.hs-benefits {
  position: absolute; top: 0; left: 0; right: 0; z-index: 5;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px;
}
.hs-benefit {
  background: #fff; border: 1px solid var(--rule); border-radius: 18px;
  padding: 16px 12px 14px;
  display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center;
  box-shadow: 0 14px 30px oklch(0% 0 0 / 0.06);
  transition: transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s;
}
.hs-benefit .ic {
  width: 46px; height: 46px; border-radius: 50%;
  background: oklch(94% 0.05 152); color: var(--green-v2);
  display: flex; align-items: center; justify-content: center;
  transition: transform .3s;
}
.hs-benefit:hover .ic { transform: scale(1.1) rotate(-4deg); }
.hs-benefit .ic svg { width: 24px; height: 24px; }
.hs-benefit .lbl { font-size: 12.5px; font-weight: 600; line-height: 1.28; color: var(--ink); letter-spacing: -0.01em; }

/* Students photo */
.hs-photo {
  position: absolute; top: 13%; left: 50%; transform: translateX(-50%);
  width: 70%; height: auto; z-index: 2;
  border-radius: 24px; border: 1px solid var(--rule);
  box-shadow: 0 34px 60px oklch(0% 0 0 / 0.12);
}
/* Elementor (`.elementor img`, 0,1,1) annule bordure et radius des images :
   on réaffirme le contour maquette avec une spécificité supérieure. */
.elementor img.hs-photo { border-radius: 24px; border: 1px solid var(--rule); }

/* Stage floor */
.hs-stage { display: none; }

/* Products — mini-cartes vitrine en verre dépoli */
.hs-products {
  position: absolute; bottom: 2%; left: 0; right: 0; z-index: 4;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px;
  align-items: end; padding: 0 4px;
}
.hs-prod {
  position: relative; display: flex; flex-direction: column;
  text-decoration: none;
  background: #fff;
  border: 1px solid oklch(90% 0.004 250);
  border-radius: 18px;
  padding: 10px 10px 11px;
  transform-origin: center 58%;
  transition: transform .34s cubic-bezier(.2,.7,.2,1), box-shadow .34s, border-color .34s, opacity .4s ease;
}
.hs-prod:hover {
  transform: translateY(-6px) !important;
  z-index: 6;
}
.hs-prod .pthumb {
  position: relative; width: 100%; height: 92px;
  border-radius: 12px; overflow: hidden;
  background: #fff;
  display: flex; align-items: center; justify-content: center;
}
.hs-prod .pthumb::before {
  content: '';
  position: absolute; inset: 8%;
  background: radial-gradient(circle at 50% 46%, oklch(93% 0.06 152 / 0.85), transparent 68%);
  border-radius: 50%;
  transition: transform .5s cubic-bezier(.2,.7,.2,1), opacity .5s;
  opacity: 0;
}
.hs-prod:hover .pthumb::before { transform: scale(1.14); opacity: 1; }
.hs-prod .pimg {
  position: relative; z-index: 1;
  max-width: 80%; max-height: 80%; object-fit: contain;
  /* fond des visuels fondu dans le blanc de la carte */
  mix-blend-mode: multiply;
  transition: transform .5s cubic-bezier(.2,.7,.2,1);
}
.hs-prod:hover .pimg { transform: scale(1.07) translateY(-6px); }
.hs-prod .plabel {
  margin-top: 9px; padding: 0 2px;
  display: flex; flex-direction: column; gap: 2px;
}
.hs-prod .pname {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700; font-size: 12.5px; letter-spacing: -0.02em;
  color: var(--ink); line-height: 1.08;
}
.hs-prod .pprice {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700; font-size: 11.5px; letter-spacing: -0.01em;
  color: var(--green-v2); white-space: nowrap;
  display: inline-flex; align-items: center; gap: 5px;
}

/* LED bargraph on detector product */
.hs-leds { display: inline-flex; gap: 2px; }
.hs-leds i {
  width: 3px; height: 9px; border-radius: 1px; background: oklch(70% 0.12 152);
  animation: hsLed 1.1s ease-in-out infinite;
}
.hs-leds i:nth-child(2) { animation-delay: .12s; } .hs-leds i:nth-child(3) { animation-delay: .24s; }
.hs-leds i:nth-child(4) { animation-delay: .36s; } .hs-leds i:nth-child(5) { animation-delay: .48s; }
.hs-leds i:nth-child(6) { animation-delay: .60s; }
@keyframes hsLed { 0%,100% { opacity: .25; transform: scaleY(.5); } 50% { opacity: 1; transform: scaleY(1); } }

/* Stat badge */
.hs-stat {
  position: absolute; bottom: 37%; left: -3%; z-index: 6;
  background: #fff; border: 1px solid var(--rule); border-radius: 22px;
  padding: 20px 26px 18px; max-width: 260px;
  box-shadow: 0 24px 52px oklch(0% 0 0 / 0.13);
}
.hs-stat .num {
  font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800;
  font-size: clamp(34px, 4vw, 46px); letter-spacing: -0.04em; line-height: 1;
  color: var(--ink);
}
.hs-stat .num .plus { color: var(--green-v2); }
.hs-stat .cap { font-size: 14px; color: var(--ink-soft); font-weight: 600; line-height: 1.35; margin-top: 6px; }

@media (max-width: 1080px) {
  .hs-grid { grid-template-columns: 1fr; gap: 40px; }
  .hs-scene { max-width: 680px; margin: 0 auto; }
  .hero-ref-intro { max-width: none; }
}
/* Tablette : le badge stat quitte la scène (il chevauchait la photo) et devient
   une pastille posée à droite des deux CTA. */
@media (min-width: 641px) and (max-width: 1080px) {
  .hs-stat { display: none; }
  .hero-ref-cta-row { align-items: center; }
  .hero-stat-pill {
    display: inline-flex; align-items: center; gap: 14px;
    background: #fff; border: 1px solid var(--rule); border-radius: 100px;
    padding: 10px 24px;
    box-shadow: 0 12px 28px oklch(0% 0 0 / 0.08);
  }
  .hero-stat-pill .num {
    font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800;
    font-size: 28px; letter-spacing: -0.04em; line-height: 1;
    color: var(--ink); white-space: nowrap;
  }
  .hero-stat-pill .num .plus { color: var(--green-v2); }
  .hero-stat-pill .cap {
    font-size: 12.5px; color: var(--ink-soft); font-weight: 600; line-height: 1.25;
  }
}
@media (max-width: 640px) {
  .hs { padding: 100px 16px 16px; }
  .hs-scene { aspect-ratio: auto; }
  .hs-benefits { position: static; grid-template-columns: 1fr 1fr; margin-bottom: 22px; }
  .hs-photo { position: static; transform: none; width: 100%; display: block; margin: 0 auto; }
  /* hsRisePhoto se termine sur translateX(-50%) (calage absolu du desktop) et, en
     fill forwards, écrasait le transform:none ci-dessus → photo décalée à gauche.
     En flux normal on repasse donc sur l'animation standard. */
  .hs-photo.hs-anim { animation-name: hsRise; }
  .hs-stage { display: none; }
  .hs-products {
    position: static; margin-top: 18px; gap: 10px;
    grid-template-columns: 1fr 1fr;
  }
  .hs-prod .pthumb { height: 110px; }
  /* badge stat : chiffre et légende côte à côte, alignés sur une même ligne */
  .hs-stat {
    position: static; margin: 22px auto 0; max-width: none;
    display: flex; align-items: center; gap: 15px;
    padding: 18px 20px; /* de la place pour la légende sur 2 lignes à côté du chiffre */
  }
  .hs-stat .num { white-space: nowrap; }
  .hs-stat .cap { margin-top: 0; }
}

@media (max-width: 760px) {
  .v2-source > div { grid-template-columns: 1fr !important; gap: 20px !important; }
}

.v2-journal { padding: 72px 32px; max-width: 1320px; margin: 0 auto; } /* maquette (retour client : marges) */
.v2-journal-head {
  display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: end;
  margin-bottom: 56px;
}
.v2-journal-head h2,
.v2-journal-head .pep-h2 { /* .pep-h2 : classe posée sur le widget Titre (typo sur wrapper) */
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95;
  font-size: clamp(40px, 5.5vw, 72px); font-weight: 800;
  letter-spacing: -0.04em; line-height: 0.95; margin-top: 18px; text-wrap: balance;
}
.v2-journal-head h2 em,
.v2-journal-head .pep-h2 em { font-family: 'Newsreader', serif; font-style: italic; font-weight: 500; font-variation-settings: normal; color: var(--green-v2); }
.v2-journal-head p { font-family: 'Newsreader', serif; font-style: italic; font-size: 19px; color: var(--ink-soft); line-height: 1.6; text-wrap: pretty; }
.v2-journal-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.v2-journal-card {
  border-radius: 22px; overflow: hidden; border: 1px solid var(--rule); background: #fff;
  display: flex; flex-direction: column; text-decoration: none;
  transition: transform .25s, box-shadow .25s;
}
.v2-journal-card:hover { transform: translateY(-4px); box-shadow: 0 18px 44px oklch(0% 0 0 / 0.06); }
.v2-journal-img { height: 168px; position: relative; overflow: hidden; background: var(--ink); display: flex; align-items: flex-end; }
.v2-journal-img-prod { position: absolute; right: 0; bottom: -14px; width: 130px; opacity: 0.2; }
.v2-journal-img-prod img { width: 100%; height: auto; object-fit: contain; filter: brightness(2.4) grayscale(1); }
.v2-journal-img-content { position: relative; z-index: 1; padding: 22px; }
.v2-journal-tag { display: inline-block; background: rgba(255,255,255,0.94); color: var(--ink); font-size: 10px; font-weight: 700; letter-spacing: 0.8px; text-transform: uppercase; padding: 4px 10px; border-radius: 100px; margin-bottom: 10px; }
.v2-journal-title { font-family: 'Bricolage Grotesque', sans-serif; font-size: 18px; font-weight: 700; color: #fff; line-height: 1.2; letter-spacing: -0.01em; text-wrap: pretty; }
.v2-journal-body { padding: 22px; flex: 1; display: flex; flex-direction: column; }
.v2-journal-excerpt { font-size: 14px; color: var(--ink-soft); line-height: 1.6; flex: 1; margin-bottom: 18px; text-wrap: pretty; }
.v2-journal-meta { display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: var(--ink-mute); font-weight: 500; padding-top: 16px; border-top: 1px solid var(--rule); }
.v2-journal-read { font-weight: 700; color: var(--green-v2); display: inline-flex; gap: 5px; align-items: center; }
.v2-journal-read em { font-family: 'Newsreader', serif; font-style: italic; }
.v2-journal-foot { margin-top: 40px; display: flex; justify-content: center; }

/* ── Source officielle : classes DS (le markup d'origine était en styles
   inline — extraits en classes pour la reconstruction en widgets natifs,
   valeurs identiques). ── */
.v2-source { padding: 48px 32px; border-top: 1px solid var(--rule); }
.v2-source-inner { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: auto 1fr auto; gap: 40px; align-items: center; }
.v2-source-label { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: var(--ink-mute); white-space: nowrap; }
.v2-source-label::before { content: ''; display: inline-block; width: 28px; height: 1px; background: var(--ink-mute); vertical-align: middle; margin-right: 10px; }
.v2-source-text p, .v2-source-text { font-family: 'Newsreader', serif; font-style: italic; font-size: clamp(18px, 2vw, 24px); line-height: 1.4; color: var(--ink); margin: 0; text-wrap: pretty; }
.v2-source-link { display: inline-flex; align-items: center; gap: 10px; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 600; font-size: 14px; color: var(--green-v2); text-decoration: none; border-bottom: 1.5px solid var(--green-v2); padding-bottom: 6px; white-space: nowrap; }
.v2-source-link .arr { font-family: 'Newsreader', serif; font-style: italic; font-size: 18px; }
@media (max-width: 600px) { .v2-source { padding: 48px 32px 10px; } }
@media (max-width: 960px) { .v2-journal-head { grid-template-columns: 1fr; gap: 24px; } .v2-journal-grid { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .v2-journal { padding: 80px 20px; } }