/* Brevio.news, refonte lot 3 : pages produit (about, features, pricing, founders), 01/11/2026.
   Couche additive chargée en dernier dans le <head>. Ne modifie ni style.css ni les <style> des pages :
   chaque règle est préfixée par html[data-bv="product"] pour passer devant eux sans !important
   (sauf pour battre un !important ou un attribut style existant, signalé à chaque fois).
   Jetons : /css/brevio-tokens.css. Polices : /css/brevio-fonts.css. */

html[data-bv="product"] {
  --p-max: 1280px;
  --p-pad: 56px;
  --p-nav-h: 72px;
  --p-on-dark: #f0ebe0;
  --p-on-dark-muted: #c9c3b6;
  --p-on-dark-rule: rgba(240, 235, 224, .28);
  scroll-padding-top: calc(var(--p-nav-h) + 16px);
}
html[data-bv="product"] body {
  background: var(--bv-ground);
  color: var(--bv-ink);
  font-family: var(--bv-font-sans);
  text-rendering: optimizeLegibility;
}
html[data-bv="product"] :focus-visible { outline: 2px solid var(--bv-focus); outline-offset: 3px; }
html[data-bv="product"] ::selection { background: var(--bv-amber); color: var(--bv-on-amber); }

/* ───────── En-tête ───────── */
html[data-bv="product"] .nav,
html[data-bv="product"] .nav.scrolled {
  padding: 0 var(--bv-gutter);
  background: var(--bv-ground);
  backdrop-filter: none; -webkit-backdrop-filter: none;
  border-bottom: 1px solid var(--bv-rule);
  box-shadow: none;
}
html[data-bv="product"] .nav-inner { max-width: none; min-height: var(--p-nav-h); gap: 32px; }
html[data-bv="product"] .nav-logo {
  font-family: var(--bv-font-display); font-weight: 800; font-stretch: 115%;
  font-size: 19px; letter-spacing: -.01em; text-transform: uppercase; color: var(--bv-ink);
}
html[data-bv="product"] .nav-logo:hover { opacity: 1; }
html[data-bv="product"] .nav-logo::after {
  display: block; content: ""; position: absolute; left: 0; bottom: -4px;
  width: 0; height: 3px; background: var(--bv-amber); transition: width var(--bv-duration-base) ease;
}
html[data-bv="product"] .nav-logo:hover::after { width: 100%; }
html[data-bv="product"] .nav-links { gap: 30px; }
html[data-bv="product"] .nav-links a {
  font-family: var(--bv-font-display); font-size: 12px; font-weight: 600;
  letter-spacing: .12em; text-transform: uppercase; color: var(--bv-ink); padding: 8px 0;
}
html[data-bv="product"] .nav-links a::after {
  bottom: 0; left: 0; transform: none; height: 3px; background: var(--bv-amber);
  transition: width var(--bv-duration-base) ease;
}
html[data-bv="product"] .nav-links a:hover { color: var(--bv-ink); }
html[data-bv="product"] .nav-links a[aria-current="page"]::after { width: 100%; }
html[data-bv="product"] .nav-actions { gap: 18px; }
html[data-bv="product"] .btn-signin {
  font-family: var(--bv-font-display); font-size: 12px; font-weight: 600;
  letter-spacing: .12em; text-transform: uppercase; color: var(--bv-ink); padding: 10px 4px;
  border-bottom: 3px solid transparent; transition: border-color var(--bv-duration-base) ease;
}
html[data-bv="product"] .btn-signin:hover { color: var(--bv-ink); border-bottom-color: var(--bv-amber); }
html[data-bv="product"] .btn-signup {
  font-family: var(--bv-font-display); font-size: 12px; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  background: var(--bv-amber); color: var(--bv-on-amber); border: 1px solid var(--bv-ink);
  padding: 12px 20px; border-radius: 0;
  transition: background-color var(--bv-duration-base) ease, color var(--bv-duration-base) ease;
}
html[data-bv="product"] .btn-signup:hover { background: var(--bv-ink); color: var(--bv-inverse-ink); border-color: var(--bv-ink); }

/* Sélecteur de langue construit par main.js */
html[data-bv="product"] .lang-toggle {
  font-family: var(--bv-font-display); font-style: normal; font-size: 12px; font-weight: 600;
  letter-spacing: .06em; color: var(--bv-ink); padding: 10px 8px; white-space: nowrap; border-radius: 0;
}
html[data-bv="product"] .lang-toggle:hover { background: var(--bv-hover-soft); }
html[data-bv="product"] .lang-menu {
  border: 1px solid var(--bv-rule); border-radius: 0; box-shadow: none; padding: 0; min-width: 180px;
}
html[data-bv="product"] .lang-menu li {
  font-family: var(--bv-font-sans); font-size: 15px; color: var(--bv-ink); padding: 12px 18px;
  border-bottom: 1px solid var(--bv-rule-soft);
}
html[data-bv="product"] .lang-menu li:last-child { border-bottom: 0; }
html[data-bv="product"] .lang-menu li:hover { background: var(--bv-hover-soft); }

/* Menu mobile */
html[data-bv="product"] .hamburger span { background: var(--bv-ink); height: 2px; }
html[data-bv="product"] .mobile-menu {
  background: var(--bv-ground); border-top: 1px solid var(--bv-rule); border-bottom: 0;
  padding: 8px var(--bv-gutter) 24px;
}
html[data-bv="product"] .mobile-menu a {
  font-family: var(--bv-font-display); font-size: 14px; font-weight: 600; letter-spacing: .1em;
  color: var(--bv-ink); padding: 18px 0; border-bottom: 1px solid var(--bv-rule-soft);
}
html[data-bv="product"] .mobile-menu-divider { background: var(--bv-rule); }
html[data-bv="product"] .mobile-menu a.mobile-menu-signup {
  background: var(--bv-amber); color: var(--bv-on-amber); border: 1px solid var(--bv-ink);
  margin-top: 16px; padding: 18px; text-align: center;
}

/* ───────── Structure commune des pages (.ab, chantier 17) ───────── */
html[data-bv="product"] .ab {
  --ink: var(--bv-ink); --grey-mid: var(--bv-ink-muted); --grey: var(--bv-ink-muted);
  --ivory: var(--p-on-dark); --card-dark: var(--bv-inverse-ground);
  --bronze: var(--bv-ink); --bronze-strong: var(--bv-ink); --amber: var(--bv-amber); --border: var(--bv-rule-soft);
  font-family: var(--bv-font-sans); color: var(--bv-ink);
}
html[data-bv="product"] .ab-inner { max-width: var(--p-max); padding: 0 var(--p-pad); }
html[data-bv="product"] .ab-pad { padding: 104px 0; }
html[data-bv="product"] .ab + .ab:not(.ab-dark):not(.ab-hero) { border-top: 1px solid var(--bv-rule-soft); }

/* Kicker : encre + carré ambre */
html[data-bv="product"] .ab-kicker {
  display: flex; align-items: center; gap: 12px;
  font-family: var(--bv-font-display); font-size: 12px; font-weight: 800;
  letter-spacing: .16em; text-transform: uppercase; color: var(--bv-ink);
}
html[data-bv="product"] .ab-kicker::before { content: ""; flex: 0 0 auto; width: 10px; height: 10px; background: var(--bv-amber); }
html[data-bv="product"] .ab-dark .ab-kicker { color: var(--p-on-dark); }

/* Titres de section */
html[data-bv="product"] .ab h2.ab-sec {
  font-family: var(--bv-font-display); font-style: normal; font-weight: 800; font-stretch: 108%;
  font-size: clamp(32px, 4.2vw, 56px); line-height: 1.02; letter-spacing: -.03em;
  color: var(--bv-ink); margin: 20px 0 44px; max-width: 18ch;
}
html[data-bv="product"] .ab-dark h2.ab-sec { color: var(--p-on-dark); }

/* Texte courant */
html[data-bv="product"] .ab-prose { max-width: 660px; font-size: 18px; line-height: 1.7; color: var(--bv-ink-muted); }
html[data-bv="product"] .ab-prose strong { color: var(--bv-ink); font-weight: 600; }
html[data-bv="product"] .ab-dark .ab-prose { color: var(--p-on-dark-muted); }
html[data-bv="product"] .ab-dark .ab-prose strong { color: var(--p-on-dark); }
html[data-bv="product"] .ab-sig { font-size: 15px; color: var(--bv-ink-muted); margin-top: 32px; }
html[data-bv="product"] .ab-sig a,
html[data-bv="product"] .ab a.ab-inline {
  color: var(--bv-ink); text-decoration: none; border-bottom: 2px solid var(--bv-amber); padding-bottom: 1px;
  transition: background-color var(--bv-duration-base) ease;
}
html[data-bv="product"] .ab-sig a:hover { background: var(--bv-hover-soft); }

/* ───────── Hero ───────── */
html[data-bv="product"] .ab-hero {
  padding: calc(var(--p-nav-h) + 88px) 0 88px; border-bottom: 1px solid var(--bv-rule);
}
html[data-bv="product"] .ab-hero .ab-small {
  font-family: var(--bv-font-display); font-size: clamp(12px, 1.1vw, 14px); font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase; color: var(--bv-ink-muted); margin: 44px 0 20px;
}
html[data-bv="product"] .ab-hero .ab-big {
  font-family: var(--bv-font-serif); font-style: italic; font-weight: 400;
  font-size: clamp(44px, 6.6vw, 104px); line-height: 1; letter-spacing: -.01em;
}
html[data-bv="product"] .ab-hero .ab-big em { color: var(--bv-ink); }
html[data-bv="product"] .ab-hero .ab-big2 {
  font-family: var(--bv-font-display); font-weight: 800; font-stretch: 112%;
  font-size: clamp(36px, 5.2vw, 80px); line-height: 1; letter-spacing: -.035em; margin-top: 14px;
}
/* Surlignage ambre : dégradé en arrière-plan (suit le texte même s'il passe à la ligne) */
html[data-bv="product"] .ab-hl {
  padding: 0 .06em; white-space: normal;
  background: linear-gradient(transparent 54%, var(--bv-amber) 54%, var(--bv-amber) 94%, transparent 94%) no-repeat 0 0 / 100% 100%;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
  animation: bv-hl .9s cubic-bezier(.2,.7,.3,1) .2s both;
}
html[data-bv="product"] .ab-hl::before,
html[data-bv="product"] .ab-hero .ab-hl::before { display: none; }
@keyframes bv-hl { from { background-size: 0 100%; } to { background-size: 100% 100%; } }
html[data-bv="product"] .ab-hero .ab-sub {
  margin-top: 44px; font-size: clamp(17px, 1.4vw, 20px); line-height: 1.65; color: var(--bv-ink-muted); max-width: 620px;
}

/* ───────── Sections sombres : encre pure ───────── */
html[data-bv="product"] .ab-dark { background: var(--bv-inverse-ground); color: var(--p-on-dark-muted); }

/* À propos */
html[data-bv="product"] .ab-tagline {
  font-family: var(--bv-font-display); font-weight: 800; font-stretch: 112%; letter-spacing: .02em;
  font-size: clamp(22px, 3vw, 40px); color: var(--p-on-dark); margin: 20px 0 32px;
}
html[data-bv="product"] .ab-excl { font-family: var(--bv-font-display); font-size: 12px; letter-spacing: .14em; margin-top: 32px; }
html[data-bv="product"] .ab-excl li { color: var(--p-on-dark-muted); border-bottom-color: var(--p-on-dark-rule); padding: 14px 0; }
html[data-bv="product"] .ab-chiffres { gap: 0; background: none; border: 0; border-top: 1px solid var(--p-on-dark-rule); border-left: 1px solid var(--p-on-dark-rule); margin-top: 64px; }
html[data-bv="product"] .ab-chiffre,
html[data-bv="product"] .ab-chiffre:hover { background: var(--bv-inverse-ground); padding: 32px 28px; border-right: 1px solid var(--p-on-dark-rule); border-bottom: 1px solid var(--p-on-dark-rule); }
html[data-bv="product"] .ab-chiffre b,
html[data-bv="product"] .ab-chiffre:hover b {
  font-family: var(--bv-font-display); font-weight: 800; font-stretch: 112%; font-size: clamp(36px, 3.4vw, 48px);
  color: var(--bv-amber); letter-spacing: -.03em;
}
html[data-bv="product"] .ab-chiffre span,
html[data-bv="product"] .ab-chiffre:hover span {
  font-family: var(--bv-font-display); font-size: 12px; letter-spacing: .1em; color: var(--p-on-dark-muted); margin-top: 14px;
}
html[data-bv="product"] .ab-offres { gap: 0; margin-top: 56px; border-top: 1px solid var(--p-on-dark-rule); }
html[data-bv="product"] .ab-offre { padding: 28px 28px 0 0; }
html[data-bv="product"] .ab-offre h6 {
  font-family: var(--bv-font-display); font-weight: 800; font-size: 12px; letter-spacing: .16em;
  color: var(--p-on-dark); border-bottom: 0; padding-bottom: 0; margin-bottom: 12px;
}
html[data-bv="product"] .ab-offre.ab-pro h6 { color: var(--bv-amber); }
html[data-bv="product"] .ab-offre p { font-size: 16px; line-height: 1.65; color: var(--p-on-dark-muted); }
html[data-bv="product"] .ab-offre.ab-pro p { color: var(--p-on-dark); }

/* Étapes numérotées (À propos, Fonctionnalités) */
html[data-bv="product"] .ab-etape { margin-top: 0; padding: 56px 0 0 0; display: grid; grid-template-columns: 120px minmax(0, 1fr); column-gap: 40px; border-top: 1px solid var(--bv-rule-soft); }
html[data-bv="product"] .ab-etape + .ab-etape { margin-top: 56px; }
html[data-bv="product"] .ab-etape:first-of-type { margin-top: 0; }
html[data-bv="product"] .ab-etape > * { grid-column: 2; }
html[data-bv="product"] .ab-ghost {
  position: static; grid-column: 1; grid-row: 1 / span 3; align-self: start;
  font-family: var(--bv-font-display); font-weight: 800; font-stretch: 112%;
  font-size: 72px; line-height: .9; letter-spacing: -.04em;
  color: var(--bv-ink); -webkit-text-stroke: 0; user-select: none;
}
html[data-bv="product"] .ab-etape:hover .ab-ghost { color: var(--bv-ink); }
html[data-bv="product"] .ab-etape-tag {
  font-family: var(--bv-font-display); font-size: 12px; font-weight: 800; letter-spacing: .16em;
  color: var(--bv-ink-muted); margin-bottom: 14px;
}
html[data-bv="product"] .ab-etape h3 {
  font-family: var(--bv-font-serif); font-style: italic; font-weight: 400;
  font-size: clamp(26px, 2.6vw, 34px); line-height: 1.15; margin: 0 0 16px;
}
html[data-bv="product"] .ab-etape ul { font-size: 17px; line-height: 1.8; color: var(--bv-ink-muted); list-style: none; padding-left: 0; }
html[data-bv="product"] .ab-etape ul li { position: relative; padding-left: 22px; }
html[data-bv="product"] .ab-etape ul li::before { content: ""; position: absolute; left: 0; top: .72em; width: 8px; height: 8px; background: var(--bv-amber); }

html[data-bv="product"] .ab-finale,
html[data-bv="product"] .ab-finale:hover {
  margin-top: 88px; max-width: 880px; padding: 48px 52px; border: 0; border-left: 6px solid var(--bv-amber);
  border-radius: 0; box-shadow: none; transform: none; background: var(--bv-inverse-ground);
}
html[data-bv="product"] .ab-finale .ab-etape-tag,
html[data-bv="product"] .ab-finale:hover .ab-etape-tag { color: var(--bv-amber); }
html[data-bv="product"] .ab-finale h3,
html[data-bv="product"] .ab-finale:hover h3 {
  font-family: var(--bv-font-serif); font-style: italic; font-weight: 400; font-size: clamp(28px, 2.8vw, 38px); color: var(--p-on-dark);
}
html[data-bv="product"] .ab-finale p,
html[data-bv="product"] .ab-finale:hover p { color: var(--p-on-dark-muted); font-size: 17px; line-height: 1.7; }

html[data-bv="product"] .ab-pilier {
  font-family: var(--bv-font-serif); font-style: italic; font-weight: 400;
  font-size: clamp(28px, 3.6vw, 52px); line-height: 1.15; color: var(--p-on-dark); max-width: 20ch; margin: 28px 0 64px;
}

/* Blocs de trois (principes, pourquoi, sous le capot) */
html[data-bv="product"] .ab-principes,
html[data-bv="product"] .ab-why,
html[data-bv="product"] .ab-capot { gap: 0; border-top: 1px solid var(--p-on-dark-rule); margin-top: 8px; }
html[data-bv="product"] .ab-principe,
html[data-bv="product"] .ab-why > div,
html[data-bv="product"] .ab-cap { padding: 28px 32px 0 0; }
html[data-bv="product"] .ab-principe h5,
html[data-bv="product"] .ab-why h5,
html[data-bv="product"] .ab-cap h5 {
  font-family: var(--bv-font-display); font-size: 13px; font-weight: 800; letter-spacing: .12em;
  color: var(--bv-amber); margin-bottom: 14px;
}
html[data-bv="product"] .ab-principe p,
html[data-bv="product"] .ab-why p,
html[data-bv="product"] .ab-cap p { font-size: 16px; line-height: 1.7; color: var(--p-on-dark-muted); }

/* Formats (Fonctionnalités) */
html[data-bv="product"] .ab-formats { gap: 0; background: none; border: 0; border-top: 1px solid var(--p-on-dark-rule); border-left: 1px solid var(--p-on-dark-rule); margin-top: 16px; }
html[data-bv="product"] .ab-format,
html[data-bv="product"] .ab-format:hover {
  background: var(--bv-inverse-ground); border: 0; border-right: 1px solid var(--p-on-dark-rule); border-bottom: 1px solid var(--p-on-dark-rule); border-radius: 0; padding: 40px 36px;
  transform: none; box-shadow: none; position: relative;
}
html[data-bv="product"] .ab-format::after { content: ""; position: absolute; left: 0; top: 0; height: 4px; width: 0; background: var(--bv-amber); transition: width var(--bv-duration-slow) cubic-bezier(.2,.7,.3,1); }
html[data-bv="product"] .ab-format:hover::after,
html[data-bv="product"] .ab-format.ab-pro::after { width: 100%; }
html[data-bv="product"] .ab-format.ab-pro { background: var(--bv-inverse-ground); border-top: 0; border-left: 0; }
html[data-bv="product"] .ab-format .ab-ft,
html[data-bv="product"] .ab-format:hover .ab-ft {
  font-family: var(--bv-font-display); font-size: 12px; font-weight: 600; letter-spacing: .14em; color: var(--p-on-dark-muted);
}
html[data-bv="product"] .ab-format h4,
html[data-bv="product"] .ab-format:hover h4 {
  font-family: var(--bv-font-serif); font-style: italic; font-weight: 400; font-size: 32px; line-height: 1.1; color: var(--p-on-dark);
}
html[data-bv="product"] .ab-format p,
html[data-bv="product"] .ab-format:hover p { font-size: 16px; line-height: 1.7; color: var(--p-on-dark-muted); }
html[data-bv="product"] .ab-format .ab-dispo {
  font-family: var(--bv-font-display); font-size: 12px; font-weight: 800; letter-spacing: .12em;
  color: var(--bv-amber); border-bottom: 0; padding-bottom: 0; margin-top: 24px;
}

/* Thèmes (Fonctionnalités) */
html[data-bv="product"] .ab-themes { gap: 0; background: none; border: 0; border-top: 1px solid var(--bv-rule); border-left: 1px solid var(--bv-rule); margin-top: 16px; }
html[data-bv="product"] .ab-theme,
html[data-bv="product"] .ab-theme:hover { background: var(--bv-ground); padding: 32px 28px; border-right: 1px solid var(--bv-rule); border-bottom: 1px solid var(--bv-rule); transition: background-color var(--bv-duration-base) ease; }
html[data-bv="product"] .ab-theme:hover { background: var(--bv-hover-soft); }
html[data-bv="product"] .ab-theme h4,
html[data-bv="product"] .ab-theme:hover h4 {
  font-family: var(--bv-font-display); font-style: normal; font-weight: 800; font-size: 19px; letter-spacing: -.01em; color: var(--bv-ink); margin-bottom: 12px;
}
html[data-bv="product"] .ab-theme p,
html[data-bv="product"] .ab-theme:hover p { font-size: 15px; line-height: 1.65; color: var(--bv-ink-muted); }
html[data-bv="product"] .ab-themes-note { font-size: 15px; color: var(--bv-ink-muted); margin-top: 24px; }

/* ───────── Tarifs ───────── */
html[data-bv="product"] .ab-plans { gap: 0; border: 1px solid var(--bv-rule); grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; margin-top: 0; }
html[data-bv="product"] .ab-plan,
html[data-bv="product"] .ab-plan:hover,
html[data-bv="product"] .ab-plan.ab-pop:hover,
html[data-bv="product"] .ab-plan:not(.ab-pop):hover {
  background: var(--bv-ground); border: 0; border-right: 1px solid var(--bv-rule); border-radius: 0;
  box-shadow: none; transform: none; padding: 48px 36px 40px; display: flex; flex-direction: column;
}
html[data-bv="product"] .ab-plan:last-child,
html[data-bv="product"] .ab-plan:last-child:hover { border-right: 0; }
html[data-bv="product"] .ab-plan.ab-pop,
html[data-bv="product"] .ab-plan.ab-pop:hover { background: var(--bv-inverse-ground); }
html[data-bv="product"] .ab-plan.ab-propl,
html[data-bv="product"] .ab-plan.ab-propl:hover { box-shadow: inset 0 6px 0 var(--bv-amber); }
html[data-bv="product"] .ab-plan .ab-pname,
html[data-bv="product"] .ab-plan:hover .ab-pname {
  font-family: var(--bv-font-display); font-size: 13px; font-weight: 800; letter-spacing: .16em; color: var(--bv-ink); margin-bottom: 22px;
}
html[data-bv="product"] .ab-plan.ab-pop .ab-pname,
html[data-bv="product"] .ab-plan.ab-pop:hover .ab-pname { color: var(--bv-amber); }
html[data-bv="product"] .ab-plan .ab-pprice,
html[data-bv="product"] .ab-plan:hover .ab-pprice {
  font-family: var(--bv-font-display); font-weight: 800; font-stretch: 112%; font-size: clamp(44px, 4.4vw, 60px); letter-spacing: -.04em; color: var(--bv-ink);
}
html[data-bv="product"] .ab-plan.ab-pop .ab-pprice,
html[data-bv="product"] .ab-plan.ab-pop:hover .ab-pprice { color: var(--p-on-dark); }
html[data-bv="product"] .ab-plan .ab-pprice small { font-family: var(--bv-font-sans); font-stretch: 100%; font-size: 15px; font-weight: 500; letter-spacing: 0; color: var(--bv-ink-muted); }
html[data-bv="product"] .ab-plan.ab-pop .ab-pprice small { color: var(--p-on-dark-muted); }
html[data-bv="product"] .ab-plan .ab-ptag,
html[data-bv="product"] .ab-plan:hover .ab-ptag {
  font-family: var(--bv-font-serif); font-style: italic; font-size: 22px; color: var(--bv-ink); margin: 20px 0 28px;
}
html[data-bv="product"] .ab-plan.ab-pop .ab-ptag,
html[data-bv="product"] .ab-plan.ab-pop:hover .ab-ptag { color: var(--p-on-dark); }
html[data-bv="product"] .ab-plan ul { margin: 0 0 36px; flex: 1 1 auto; }
html[data-bv="product"] .ab-plan li,
html[data-bv="product"] .ab-plan:hover li,
html[data-bv="product"] .ab-plan:not(.ab-pop):hover li {
  font-size: 15.5px; line-height: 1.55; color: var(--bv-ink-muted); border-bottom: 1px solid var(--bv-rule-soft); padding: 11px 0 11px 22px;
}
html[data-bv="product"] .ab-plan li::before { content: ""; top: 19px; width: 8px; height: 8px; background: var(--bv-amber); }
html[data-bv="product"] .ab-plan li strong,
html[data-bv="product"] .ab-plan:hover li strong { color: var(--bv-ink); font-weight: 600; }
html[data-bv="product"] .ab-plan.ab-pop li,
html[data-bv="product"] .ab-plan.ab-pop:hover li { color: var(--p-on-dark-muted); border-bottom-color: var(--p-on-dark-rule); }
html[data-bv="product"] .ab-plan.ab-pop li strong,
html[data-bv="product"] .ab-plan.ab-pop:hover li strong { color: var(--p-on-dark); }
html[data-bv="product"] .ab-plan.ab-propl .ab-hebdo,
html[data-bv="product"] .ab-plan.ab-propl:hover .ab-hebdo {
  background: var(--bv-hover-soft); margin: 4px -14px; padding: 14px 14px 14px 36px; border-radius: 0; border-bottom: 0; color: var(--bv-ink);
}
html[data-bv="product"] .ab-plan.ab-propl .ab-hebdo::before { left: 14px; top: 22px; }
html[data-bv="product"] .ab-plan.ab-pop .ab-badge {
  top: 0; left: auto; right: 0; border-radius: 0; background: var(--bv-amber); color: var(--bv-on-amber);
  font-family: var(--bv-font-display); font-size: 11px; font-weight: 800; letter-spacing: .14em; padding: 8px 14px;
}
html[data-bv="product"] .ab-pcta,
html[data-bv="product"] .ab-plan:hover .ab-pcta {
  font-family: var(--bv-font-display); font-size: 12px; font-weight: 700; letter-spacing: .12em;
  background: var(--bv-ink); color: var(--bv-inverse-ink); border: 1px solid var(--bv-ink); border-radius: 0; padding: 18px 16px;
  transform: none; transition: background-color var(--bv-duration-base) ease, color var(--bv-duration-base) ease;
}
html[data-bv="product"] .ab-pcta:hover,
html[data-bv="product"] .ab-plan .ab-pcta:hover { background: var(--bv-amber); color: var(--bv-on-amber); transform: none; }
html[data-bv="product"] .ab-plan.ab-pop .ab-pcta,
html[data-bv="product"] .ab-plan.ab-pop:hover .ab-pcta { background: var(--bv-amber); color: var(--bv-on-amber); border-color: var(--bv-amber); }
html[data-bv="product"] .ab-plan.ab-pop .ab-pcta:hover,
html[data-bv="product"] .ab-plan.ab-pop:hover .ab-pcta:hover { background: var(--p-on-dark); color: var(--bv-ink); border-color: var(--p-on-dark); }
html[data-bv="product"] .ab-allnote { font-size: 15px; color: var(--bv-ink-muted); margin-top: 32px; }

/* Questions fréquentes */
html[data-bv="product"] .ab-faq { gap: 0 56px; margin-top: 8px; }
html[data-bv="product"] .ab-q { border-top: 1px solid var(--bv-rule); padding: 28px 0 36px; }
html[data-bv="product"] .ab-q h5 { font-family: var(--bv-font-serif); font-style: italic; font-weight: 400; font-size: 24px; line-height: 1.25; margin-bottom: 12px; }
html[data-bv="product"] .ab-q p { font-size: 16px; line-height: 1.7; color: var(--bv-ink-muted); }

/* Bandeau fondateurs sur Tarifs (ch.31) : bloc ambre */
html[data-bv="product"] .ch31-founder,
html[data-bv="product"] .ch31-founder:hover {
  background: var(--bv-amber); border: 1px solid var(--bv-ink); border-radius: 0; padding: 36px 40px; margin: 0 0 56px;
  font-family: var(--bv-font-sans);
}
html[data-bv="product"] .ch31-founder .ch31-f-line,
html[data-bv="product"] .ch31-founder:hover .ch31-f-line {
  font-family: var(--bv-font-serif); font-style: italic; font-weight: 400; font-size: clamp(21px, 2vw, 28px); line-height: 1.3; color: var(--bv-ink);
}
html[data-bv="product"] .ch31-founder .ch31-f-sub,
html[data-bv="product"] .ch31-founder:hover .ch31-f-sub { font-size: 15px; color: var(--bv-ink); }
html[data-bv="product"] .ch31-founder .ch31-f-cta,
html[data-bv="product"] .ch31-founder:hover .ch31-f-cta {
  font-family: var(--bv-font-display); font-size: 12px; font-weight: 700; letter-spacing: .12em;
  background: var(--bv-ink); color: var(--bv-inverse-ink); border-radius: 0; padding: 18px 28px; transform: none;
}
html[data-bv="product"] .ch31-founder .ch31-f-cta:hover,
html[data-bv="product"] .ch31-founder:hover .ch31-f-cta:hover { background: var(--bv-ground); color: var(--bv-ink); transform: none; }

/* Page Fondateurs (ch.31) */
html[data-bv="product"] .ch31-harmo-count .num {
  font-family: var(--bv-font-display); font-style: normal; font-weight: 800; font-stretch: 112%;
  font-size: clamp(88px, 11vw, 160px); letter-spacing: -.05em; color: var(--bv-ink);
}
html[data-bv="product"] .ch31-harmo-count .lbl { font-family: var(--bv-font-display); font-size: 12px; font-weight: 800; letter-spacing: .16em; color: var(--bv-ink); }
html[data-bv="product"] .ch31-harmo-count .lbl::before { content: ""; display: inline-block; width: 10px; height: 10px; background: var(--bv-amber); margin-right: 10px; }
html[data-bv="product"] .ch31-harmo-pitch { font-size: 19px; line-height: 1.65; color: var(--bv-ink-muted); max-width: 600px; }
html[data-bv="product"] .ch31-harmo .ab-pcta[aria-disabled="true"] { background: var(--bv-ink-disabled); border-color: var(--bv-ink-disabled); opacity: 1; }
html[data-bv="product"] .ch31-harmo .abf-name { border-radius: 0; background: var(--bv-surface-muted); border: 1px solid var(--bv-rule-soft); font-size: 15px; padding: 8px 14px; }
html[data-bv="product"] .ch31-harmo-discreet { color: var(--bv-ink-muted); font-size: 15px; }
html[data-bv="product"] #founders .ab-hero h1 { margin-top: 44px !important; } /* bat l'attribut style="margin:40px 0 0" */

/* ───────── Appel final (.cta de style.css) : bloc ambre ───────── */
html[data-bv="product"] .cta {
  background: var(--bv-amber); color: var(--bv-on-amber); padding: 120px 0;
  border-top: 1px solid var(--bv-rule); text-align: left;
}
html[data-bv="product"] .cta::before { display: none; }
html[data-bv="product"] .cta-title {
  max-width: var(--p-max); margin: 0 auto 48px; padding: 0 var(--p-pad);
  font-family: var(--bv-font-display); font-weight: 800; font-stretch: 112%;
  font-size: clamp(34px, 7.4vw, 112px); line-height: .94; letter-spacing: -.04em; color: var(--bv-ink);
  overflow-wrap: break-word; hyphens: auto;
}
html[data-bv="product"] .cta-title .serif { font-family: var(--bv-font-serif); font-style: italic; font-weight: 400; font-stretch: 100%; letter-spacing: -.01em; margin-top: 10px; }
html[data-bv="product"] .cta-button {
  display: block; width: fit-content; margin: 0 0 0 max(calc((100% - var(--p-max)) / 2 + var(--p-pad)), var(--p-pad));
  font-family: var(--bv-font-display); font-size: 13px; font-weight: 700; letter-spacing: .14em;
  background: var(--bv-ink); color: var(--bv-inverse-ink); border: 1px solid var(--bv-ink); border-radius: 0; padding: 22px 40px;
  transition: background-color var(--bv-duration-base) ease, color var(--bv-duration-base) ease;
}
html[data-bv="product"] .cta-button::before { display: none; }
html[data-bv="product"] .cta-button::after { content: " →"; }
html[data-bv="product"] .cta-button:hover { background: var(--bv-ground); color: var(--bv-ink); }

/* ───────── Pied de page ───────── */
html[data-bv="product"] .footer { padding: 0; background: var(--bv-ground); border-top: 1px solid var(--bv-rule); }
html[data-bv="product"] .footer-inner { max-width: none; }
html[data-bv="product"] .footer-grid {
  grid-template-columns: 2fr repeat(3, 1fr); gap: 1px; margin: 0; background: var(--bv-rule); border-bottom: 1px solid var(--bv-rule);
}
html[data-bv="product"] .footer-grid > div { background: var(--bv-ground); padding: 36px var(--bv-gutter) 40px; }
html[data-bv="product"] .footer-about h3 { /* !important : bat le <style> Outfit des pages */
  font-family: var(--bv-font-display) !important; font-weight: 800 !important; font-stretch: 115%;
  font-size: 19px !important; letter-spacing: -.01em !important; margin-bottom: 16px;
}
html[data-bv="product"] .footer-about p { font-size: 15px; line-height: 1.6; color: var(--bv-ink-muted); max-width: 46ch; }
html[data-bv="product"] .footer-col h4 { font-family: var(--bv-font-display); font-size: 12px; font-weight: 800; letter-spacing: .16em; color: var(--bv-ink-muted); margin-bottom: 18px; }
html[data-bv="product"] .footer-col a {
  font-size: 15px; font-weight: 400; color: var(--bv-ink); margin-bottom: 10px; padding: 2px 0;
  width: fit-content; border-bottom: 2px solid transparent; transition: border-color var(--bv-duration-base) ease;
}
html[data-bv="product"] .footer-col a:hover { padding-left: 0; border-bottom-color: var(--bv-amber); }
html[data-bv="product"] .footer-bottom { /* !important : bat le <style> Outfit des pages */
  font-family: var(--bv-font-display) !important; font-size: 11px; font-weight: 600; letter-spacing: .14em;
  color: var(--bv-ink); padding: 18px var(--bv-gutter); border-top: 0;
}
/* Sélecteur de langue du pied : styles en attribut, d'où les !important */
html[data-bv="product"] .footer nav[aria-label="Language"] {
  border-top: 1px solid var(--bv-rule); padding: 16px var(--bv-gutter) !important; justify-content: flex-start !important;
  font-family: var(--bv-font-display) !important; font-size: 12px !important; letter-spacing: .1em;
}
html[data-bv="product"] .footer nav[aria-label="Language"] a { color: var(--bv-ink-muted) !important; font-weight: 600 !important; padding: 4px 0; border-bottom: 2px solid transparent; }
html[data-bv="product"] .footer nav[aria-label="Language"] a:hover { color: var(--bv-ink) !important; border-bottom-color: var(--bv-amber); }
html[data-bv="product"] .footer nav[aria-label="Language"] a[style*="#e8b84f"] { color: var(--bv-ink) !important; border-bottom-color: var(--bv-ink); }
html[data-bv="product"] .footer nav[aria-label="Language"] span { color: var(--bv-rule-soft) !important; }

/* ───────── Japonais : polices système, pas d'italique synthétique ───────── */
html[data-bv="product"][lang="ja"] body,
html[data-bv="product"][lang="ja"] .ab { font-family: var(--bv-font-sans), var(--bv-font-ja); }
html[data-bv="product"][lang="ja"] .ab-big,
html[data-bv="product"][lang="ja"] .ab-pilier,
html[data-bv="product"][lang="ja"] .ab-etape h3,
html[data-bv="product"][lang="ja"] .ab-finale h3,
html[data-bv="product"][lang="ja"] .ab-format h4,
html[data-bv="product"][lang="ja"] .ab-ptag,
html[data-bv="product"][lang="ja"] .ab-q h5,
html[data-bv="product"][lang="ja"] .ch31-f-line,
html[data-bv="product"][lang="ja"] .cta-title .serif {
  font-family: var(--bv-font-serif), var(--bv-font-ja); font-style: normal; font-weight: 600; letter-spacing: 0;
}
html[data-bv="product"][lang="ja"] .ab-big em { font-style: normal; }
html[data-bv="product"][lang="ja"] .ab-big2,
html[data-bv="product"][lang="ja"] h2.ab-sec,
html[data-bv="product"][lang="ja"] .cta-title { font-family: var(--bv-font-display), var(--bv-font-ja); letter-spacing: -.01em; line-height: 1.2; }
html[data-bv="product"][lang="ja"] .ab-prose,
html[data-bv="product"][lang="ja"] p { line-break: strict; }

/* ───────── Tailles d'écran ───────── */
@media (max-width: 1100px) {
  html[data-bv="product"] .ab-plans { grid-template-columns: minmax(0, 1fr); }
  html[data-bv="product"] .ab-plan,
  html[data-bv="product"] .ab-plan:hover,
  html[data-bv="product"] .ab-plan.ab-pop:hover,
  html[data-bv="product"] .ab-plan:not(.ab-pop):hover { border-right: 0; border-bottom: 1px solid var(--bv-rule); }
  html[data-bv="product"] .ab-plan:last-child { border-bottom: 0; }
  html[data-bv="product"] .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 960px) {
  html[data-bv="product"] { --p-pad: 24px; --p-nav-h: 64px; }
  html[data-bv="product"] .ab-inner { padding: 0 var(--p-pad); }
  html[data-bv="product"] .ab-pad { padding: 72px 0; }
  html[data-bv="product"] .ab-hero { padding: calc(var(--p-nav-h) + 56px) 0 64px; }
  html[data-bv="product"] .ab-etape { grid-template-columns: 64px minmax(0, 1fr); column-gap: 20px; padding-top: 40px; }
  html[data-bv="product"] .ab-etape + .ab-etape { margin-top: 40px; }
  html[data-bv="product"] .ab-ghost { font-size: 44px; top: auto; }
  html[data-bv="product"] .ab-finale,
  html[data-bv="product"] .ab-finale:hover { padding: 32px 24px; margin-top: 64px; }
  html[data-bv="product"] .ab-faq { grid-template-columns: minmax(0, 1fr); }
  html[data-bv="product"] .ch31-founder,
  html[data-bv="product"] .ch31-founder:hover { padding: 28px 24px; }
  html[data-bv="product"] .cta { padding: 80px 0; }
}
@media (max-width: 600px) {
  html[data-bv="product"] .footer-grid { grid-template-columns: minmax(0, 1fr); }
  html[data-bv="product"] .ab-plan,
  html[data-bv="product"] .ab-plan:hover,
  html[data-bv="product"] .ab-plan.ab-pop:hover,
  html[data-bv="product"] .ab-plan:not(.ab-pop):hover { padding: 40px 24px 32px; }
  html[data-bv="product"] .ab-format,
  html[data-bv="product"] .ab-format:hover { padding: 32px 24px; }
  html[data-bv="product"] .ab-principe,
  html[data-bv="product"] .ab-why > div,
  html[data-bv="product"] .ab-cap { padding-right: 0; }
}
@media (max-width: 480px) {
  html[data-bv="product"] { --p-pad: 20px; --bv-gutter: 20px; }
  html[data-bv="product"] .cta-button { width: auto; margin-right: var(--p-pad); text-align: center; padding: 22px 16px; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-bv="product"] *,
  html[data-bv="product"] *::before,
  html[data-bv="product"] *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
