/* vietnamese */
@font-face {
  font-family: 'Familjen Grotesk';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/FamiljenGrotesk-italic-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Familjen Grotesk';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/FamiljenGrotesk-italic-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Familjen Grotesk';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/FamiljenGrotesk-italic-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Familjen Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/FamiljenGrotesk-normal-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Familjen Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/FamiljenGrotesk-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Familjen Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/FamiljenGrotesk-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: italic;
  font-weight: 300 700;
  font-display: swap;
  src: url("fonts/HankenGrotesk-italic-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* vietnamese */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: italic;
  font-weight: 300 700;
  font-display: swap;
  src: url("fonts/HankenGrotesk-italic-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: italic;
  font-weight: 300 700;
  font-display: swap;
  src: url("fonts/HankenGrotesk-italic-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: italic;
  font-weight: 300 700;
  font-display: swap;
  src: url("fonts/HankenGrotesk-italic-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("fonts/HankenGrotesk-normal-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* vietnamese */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("fonts/HankenGrotesk-normal-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("fonts/HankenGrotesk-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("fonts/HankenGrotesk-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============================================================
   PETGATE — feuille de style unique
   Charte « Le Seuil ». Jetons repris de la section 12 de la charte.
   Règles absolues : rayon 0, aucune ombre, aucun dégradé.
   ============================================================ */

/* --- POLICES ------------------------------------------------------------
   PROVISOIRE : les WOFF2 auto-hébergés ne sont pas encore déposés, donc la
   charte se chargeait en police système. On passe par Google Fonts le temps
   de la validation visuelle.
   AVANT MISE EN LIGNE : déposer les 2 fichiers (licences OFL) dans
   /site/fonts/, puis remplacer l'@import ci-dessous par deux regles @font-face
   pointant sur FamiljenGrotesk-Variable.woff2 et HankenGrotesk-Variable.woff2
   (format woff2-variations). La charte interdit Google Fonts en production.
   Familjen Grotesk : variable 400..700. Hanken Grotesk : variable 300..700. */


/* ---------------- JETONS — position B2B (défaut, tout le site) -------- */
:root{
  /* primaires */
  --pg-ink:#12100F; --pg-chalk:#F4F1EA;
  --pg-ochre:#E8A33D; --pg-amber:#F5DCA8;
  /* secondaires */
  --pg-slate:#4A5551; --pg-sage:#A9BDA9; --pg-sand:#D8C9B0;
  /* neutres dérivés */
  --pg-ink-70:#4A4741; --pg-ink-45:#8A8680;
  --pg-rule:#E3E0DA; --pg-rule-strong:#C9C6C0;
  /* sémantiques PetClaim */
  --pg-ok:#1F6349; --pg-warn:#7A4E0C; --pg-err:#96291F;
  /* typographie */
  --pg-display:'Familjen Grotesk',ui-sans-serif,system-ui,sans-serif;
  --pg-text:'Hanken Grotesk',ui-sans-serif,system-ui,sans-serif;
  /* espace & structure */
  --pg-unit:8px; --pg-module:34px;
  --pg-max:1240px; --pg-radius:0;
  --pg-gutter:24px; --pg-pad:24px;
  /* rôles de surface */
  --pg-bg:var(--pg-chalk); --pg-fg:var(--pg-ink);
  --pg-accent:var(--pg-ochre); --pg-accent-area:5%;
  --pg-link:var(--pg-warn); --pg-link-hover:#4A2F07;
  /* mouvement — section 06 de la charte */
  --pg-dur:120ms; --pg-ease:ease-out;
  --pg-dur-reveal:320ms; --pg-ease-reveal:cubic-bezier(.22,1,.36,1);
  --pg-dur-menu:220ms; --pg-ease-menu:cubic-bezier(.16,1,.3,1);
}

/* ---------------- POSITION NUIT — PRÉSENTE, NON CÂBLÉE ----------------
   La position nuit de la charte (curseur encre + 12 % d'accent) vise la
   démo « pet parent », hors périmètre de ce site. Les jetons sont posés
   ici pour un usage ultérieur : AUCUNE page ne porte data-light="night",
   aucun sélecteur du site ne l'active. Ne pas supprimer.
   Idem position jour (B2C, fond ambre) : réservée au produit, pas au site. */
body[data-light="night"]{
  --pg-bg:var(--pg-ink); --pg-fg:var(--pg-chalk);
  --pg-accent:var(--pg-ochre); --pg-accent-area:12%;
  --pg-ink-70:#CFCBC2; --pg-ink-45:#8A8680;
  --pg-rule:#2C2A28; --pg-rule-strong:#3A3835;
  --pg-link:var(--pg-ochre); --pg-link-hover:#F5DCA8;
}
body[data-light="day"]{
  --pg-bg:var(--pg-amber); --pg-fg:var(--pg-ink);
  --pg-accent:var(--pg-ink); --pg-accent-area:60%;
}

/* ---------------- BASE ------------------------------------------------ */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--pg-bg);color:var(--pg-fg);font:400 17px/1.62 var(--pg-text);-webkit-font-smoothing:antialiased;text-wrap:pretty}
img,svg{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{margin:0;font-family:var(--pg-display);letter-spacing:-.02em;text-wrap:balance}
h1{font-weight:700;font-size:clamp(32px,5vw,56px);line-height:1.04;letter-spacing:-.03em}
h2{font-weight:600;font-size:clamp(25px,2.8vw,34px);line-height:1.12}
h3{font-weight:600;font-size:21px;line-height:1.2}
h4{font-weight:600;font-size:17px;line-height:1.3}
p{margin:0 0 1em}
p,li{max-width:75ch}
a{color:var(--pg-link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:color var(--pg-dur) var(--pg-ease)}
a:hover{color:var(--pg-link-hover)}
:focus-visible{outline:3px solid var(--pg-ochre);outline-offset:2px}
::selection{background:var(--pg-amber);color:var(--pg-ink)}
hr{border:0;border-top:1px solid var(--pg-rule);margin:var(--pg-module) 0}
.pg-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.pg-skip{position:absolute;left:-9999px;top:0;z-index:99}
.pg-skip:focus{left:8px;top:8px;background:var(--pg-ink);color:var(--pg-chalk);padding:10px 16px}

/* ---------------- GRILLE & SECTIONS ---------------------------------- */
.pg-wrap{width:100%;max-width:var(--pg-max);margin:0 auto;padding:0 var(--pg-pad)}
.pg-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--pg-gutter)}
.pg-sec{padding:calc(var(--pg-module)*2) 0}
.pg-sec--tight{padding:var(--pg-module) 0}
.pg-sec--ink{background:var(--pg-ink);color:var(--pg-chalk);--pg-fg:var(--pg-chalk);--pg-rule:#2C2A28;--pg-rule-strong:#3A3835;--pg-ink-70:#CFCBC2;--pg-link:var(--pg-ochre);--pg-link-hover:#F5DCA8}
/* ZONE D'ACCENT PLEINE — une seule par écran. Blocs de conversion. */
.pg-sec--amber{background:var(--pg-amber)}
.pg-sec--sage{background:#DCE4DC}
.pg-sec--sand{background:#EDE5D7}
.pg-cols{display:grid;gap:var(--pg-module);grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.pg-cols--2{grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr))}
/* Trois colonnes tenues, qui passent à une seule sous 760 px. */
.pg-cols--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:760px){.pg-cols--3{grid-template-columns:minmax(0,1fr)}}
.pg-split{display:grid;gap:var(--pg-module);grid-template-columns:minmax(0,1fr)}
@media(min-width:900px){.pg-split{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:calc(var(--pg-module)*1.5)}.pg-split--even{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.pg-measure{max-width:68ch}

/* ---------------- LE MOTIF : encoche ocre, pied gauche --------------- */
.pg-notch{position:relative;padding-bottom:22px}
.pg-notch::after{content:'';position:absolute;left:0;bottom:0;width:44px;height:11px;background:var(--pg-ochre)}
.pg-rule-ochre{width:60px;height:11px;background:var(--pg-ochre);border:0;margin:0 0 22px}

/* ---------------- ÉLÉMENTS DE TEXTE --------------------------------- */
.pg-kicker{font:600 11px/1.2 var(--pg-text);letter-spacing:.16em;text-transform:uppercase;color:var(--pg-warn);margin:0 0 14px}
.pg-kicker--ochre{color:var(--pg-ochre)} /* uniquement sur fond encre : ocre jamais en texte sous 24px sur craie */
.pg-lede{font-size:clamp(18px,1.5vw,21px);line-height:1.5;color:var(--pg-ink-70);max-width:62ch}
.pg-sec--ink .pg-lede{color:#CFCBC2}
.pg-small{font-size:14px;line-height:1.5;color:var(--pg-ink-70)}
.pg-source{font:600 11px/1.3 var(--pg-text);letter-spacing:.12em;text-transform:uppercase;color:var(--pg-ink-70)}
/* variable chiffrée laissée à remplir — voir note de handoff */
.pg-var{border-bottom:2px solid var(--pg-ochre);font-weight:600;white-space:nowrap}

/* ---------------- BOUTONS ------------------------------------------- */
.pg-btns{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.pg-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 26px;border:0;border-radius:0;cursor:pointer;font:600 15px/1 var(--pg-text);background:var(--pg-ink);color:var(--pg-chalk);text-decoration:none;transition:background var(--pg-dur) var(--pg-ease)}
.pg-btn:hover{background:#2A2724;color:var(--pg-chalk)}
.pg-btn--inv{background:var(--pg-chalk);color:var(--pg-ink)}
.pg-btn--inv:hover{background:#fff;color:var(--pg-ink)}
.pg-btn--outline{background:transparent;color:var(--pg-fg);border:1.5px solid currentColor}
.pg-btn--outline:hover{background:transparent;color:var(--pg-fg);border-color:var(--pg-ochre)}
.pg-btn[disabled]{opacity:.45;cursor:not-allowed}
.pg-link-arrow{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px}
.pg-link-arrow::after{content:'→';transition:transform var(--pg-dur) var(--pg-ease)}
.pg-link-arrow:hover::after{transform:translateX(4px)}

/* ---------------- CARTES ------------------------------------------- */
.pg-card{background:var(--pg-chalk);border:1px solid var(--pg-rule);padding:26px 24px 30px;position:relative}
.pg-sec--ink .pg-card{background:#1A1817;border-color:#2C2A28}
.pg-card > :last-child{margin-bottom:0}
.pg-card h3{margin-bottom:10px}
.pg-card__n{font:600 11px/1 var(--pg-text);letter-spacing:.14em;color:var(--pg-ink-45);margin-bottom:18px;display:block}
.pg-cardlink{display:block;text-decoration:none;color:inherit}
.pg-cardlink:hover{color:inherit;border-color:var(--pg-rule-strong)}
.pg-cardlink:hover h3{text-decoration:underline;text-underline-offset:3px}

/* ---------------- LISTES ------------------------------------------- */
.pg-list{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.pg-list li{padding-left:26px;position:relative}
.pg-list li::before{content:'';position:absolute;left:0;top:.62em;width:12px;height:2px;background:var(--pg-ochre)}
.pg-steps{list-style:none;counter-reset:s;margin:0;padding:0;display:grid;gap:var(--pg-module)}
.pg-steps > li{counter-increment:s;border-top:1px solid var(--pg-rule);padding-top:18px;display:grid;gap:6px 22px;grid-template-columns:auto minmax(0,1fr)}
.pg-steps > li::before{content:counter(s,decimal-leading-zero);font:600 13px/1.6 var(--pg-text);letter-spacing:.08em;color:var(--pg-ink-45)}
.pg-steps h3{grid-column:2}
.pg-steps > li > :not(h3):not(:first-child){grid-column:2}

/* ---------------- PASTILLES D'ÉTAT (PetClaim, dépôt de pièces) -------
   Filet de 6 px + libellé. JAMAIS d'aplat coloré. */
.pg-state{display:grid;gap:8px;padding-top:0}
.pg-state::before{content:'';display:block;width:100%;height:6px;background:var(--pg-ink-45)}
.pg-state__label{font:600 11px/1.2 var(--pg-text);letter-spacing:.14em;text-transform:uppercase}
.pg-state--ok::before{background:var(--pg-ok)}
.pg-state--ok .pg-state__label{color:var(--pg-ok)}
.pg-state--warn::before{background:var(--pg-warn)}
.pg-state--warn .pg-state__label{color:var(--pg-warn)}
.pg-state--err::before{background:var(--pg-err)}
.pg-state--err .pg-state__label{color:var(--pg-err)}
.pg-dot{display:inline-flex;align-items:center;gap:9px;font:600 11px/1.2 var(--pg-text);letter-spacing:.14em;text-transform:uppercase}
.pg-dot::before{content:'';width:18px;height:6px;background:var(--pg-ink-45);flex:none}
.pg-dot--ok{color:var(--pg-ok)}.pg-dot--ok::before{background:var(--pg-ok)}
.pg-dot--warn{color:var(--pg-warn)}.pg-dot--warn::before{background:var(--pg-warn)}
.pg-dot--err{color:var(--pg-err)}.pg-dot--err::before{background:var(--pg-err)}

/* ---------------- TABLEAUX ----------------------------------------- */
.pg-tablewrap{overflow-x:auto}
.pg-table{width:100%;border-collapse:collapse;font-size:15px}
.pg-table th,.pg-table td{text-align:left;padding:14px 16px 14px 0;border-bottom:1px solid var(--pg-rule);vertical-align:top}
.pg-table thead th{font:600 11px/1.2 var(--pg-text);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-ink-70);border-bottom:1.5px solid var(--pg-rule-strong)}
.pg-table td p{margin:0}

/* ---------------- FORMULAIRES -------------------------------------- */
.pg-form{display:grid;gap:22px}
.pg-fieldrow{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.pg-field{display:grid;gap:8px;min-width:0}
.pg-field > label,.pg-legend{font:600 11px/1.2 var(--pg-text);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-ink);padding:0}
.pg-field input,.pg-field select,.pg-field textarea{font:400 16px/1.4 var(--pg-text);color:var(--pg-ink);background:#FBF9F5;border:1.5px solid var(--pg-rule-strong);border-radius:0;padding:13px 14px;min-height:48px;width:100%}
.pg-field textarea{min-height:130px;resize:vertical}
.pg-field input:focus,.pg-field select:focus,.pg-field textarea:focus{outline:0;border-color:var(--pg-ink);box-shadow:0 0 0 3px rgba(232,163,61,.4)}
.pg-field input[type=file]{padding:10px;background:transparent}
.pg-hint{font-size:13px;line-height:1.45;color:var(--pg-ink-70)}
.pg-req{color:var(--pg-err)}
/* La case fait 22 px (charte), mais la ligne entière est cliquable via le
   <label> : on lui garantit 44 px de hauteur pour rester une cible tactile. */
.pg-check{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:center;font-size:14px;line-height:1.5;min-height:44px}
.pg-check input{width:22px;height:22px;margin:1px 0 0;accent-color:var(--pg-ink);flex:none}
.pg-check label{max-width:70ch}
fieldset{border:0;margin:0;padding:0}
.pg-consents{display:grid;gap:16px;border-top:1px solid var(--pg-rule);padding-top:20px}

/* ---------------- EN-TÊTE ------------------------------------------ */
.pg-header{background:var(--pg-chalk);border-bottom:1px solid var(--pg-rule);position:sticky;top:0;z-index:40}
.pg-header__in{height:84px;display:flex;align-items:center;gap:28px;max-width:var(--pg-max);margin:0 auto;padding:0 var(--pg-pad)}
.pg-logo{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--pg-ink);flex:none}
.pg-logo__word{font:700 19px/1 var(--pg-display);letter-spacing:-.02em}
.pg-nav{display:flex;align-items:center;gap:26px;margin-left:auto}
.pg-nav a{font:500 15px/1 var(--pg-text);color:var(--pg-ink);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.pg-nav a:hover,.pg-nav a[aria-current]{color:var(--pg-ink);text-decoration:underline;text-underline-offset:5px}
/* La pastille de menu occupe toute la hauteur de l'en-tête : le volet peut alors
   s'ancrer sur l'arête basse réelle (top:100% + la hairline) au lieu de flotter
   à partir du bouton, qui est centré dans la bande. */
.pg-nav__drop{position:relative;align-self:stretch;display:flex;align-items:center}
.pg-nav__btn{font:500 15px/1 var(--pg-text);color:var(--pg-ink);background:0;border:0;padding:0;cursor:pointer;display:inline-flex;gap:7px;align-items:center;min-height:44px}
.pg-nav__btn::after{content:'';width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px)}
/* Volet de navigation : il pend sous l'en-tête, arête contre arête. Fond plus
   clair que la craie, filet encre, encoche ocre sur l'angle. */
.pg-nav__menu{position:absolute;top:calc(100% + 1px);left:-18px;min-width:322px;background:#FBF9F5;border:1.5px solid var(--pg-ink);padding:8px;display:grid;visibility:hidden;opacity:0;transform:translateY(-8px);transition:opacity var(--pg-dur-menu) var(--pg-ease-menu),transform var(--pg-dur-menu) var(--pg-ease-menu),visibility var(--pg-dur-menu)}
.pg-nav__menu::after{content:'';position:absolute;left:-1.5px;top:-1.5px;width:44px;height:5px;background:var(--pg-ochre)}
.pg-nav__drop[data-open="true"] .pg-nav__menu{visibility:visible;opacity:1;transform:none}
.pg-nav__drop[data-open="true"] .pg-nav__btn{text-decoration:underline;text-underline-offset:5px}
.pg-nav__drop[data-open="true"] .pg-nav__btn::after{transform:rotate(225deg) translateY(-2px)}
.pg-nav__menu a{display:grid;gap:3px;padding:13px 14px;font-weight:600}
.pg-nav__menu a + a{border-top:1px solid var(--pg-rule)}
.pg-nav__menu a:hover{background:var(--pg-ink);color:var(--pg-chalk);text-decoration:none}
.pg-nav__menu a:hover span{color:#CFCBC2}
.pg-nav__menu span{font-size:13px;line-height:1.4;color:var(--pg-ink-70);font-weight:400}
.pg-header .pg-btn{min-height:44px;padding:0 20px}
.pg-header__cta{flex:none;margin-left:22px;white-space:nowrap}
.pg-burger{display:none;width:44px;height:44px;background:0;border:1.5px solid var(--pg-rule-strong);cursor:pointer;align-items:center;justify-content:center}
.pg-burger span{display:block;width:20px;height:1.5px;background:var(--pg-ink);position:relative}
.pg-burger span::before,.pg-burger span::after{content:'';position:absolute;left:0;width:20px;height:1.5px;background:var(--pg-ink)}
.pg-burger span::before{top:-6px}.pg-burger span::after{top:6px}
@media(max-width:1023px){
  .pg-burger{display:flex;margin-left:14px}
  .pg-header__cta{margin-left:auto}
  .pg-nav{position:fixed;inset:84px 0 auto;flex-direction:column;align-items:stretch;gap:0;background:var(--pg-chalk);border-bottom:1px solid var(--pg-rule);padding:8px var(--pg-pad) 24px;margin:0;display:none}
  .pg-header[data-open="true"] .pg-nav{display:flex}
  .pg-nav > *{padding:14px 0;border-bottom:1px solid var(--pg-rule)}
  .pg-nav__drop{align-self:auto;display:block}
  .pg-nav__menu{position:static;border:0;background:transparent;padding:0 0 0 14px;display:grid;visibility:visible;opacity:1;transform:none;transition:none;min-width:0}
  .pg-nav__menu::after{display:none}
  .pg-nav__menu a + a{border-top:0}
  .pg-nav__menu a{padding:12px 0}
  .pg-header[data-open="true"] .pg-nav{animation:pg-menu var(--pg-dur-menu) var(--pg-ease-menu)}
}
@media(max-width:559px){
  .pg-header__cta{padding:0 14px;font-size:14px}
  .pg-logo__word{display:none}
}

/* ---------------- HÉROS ------------------------------------------- */
.pg-hero{padding:calc(var(--pg-module)*2.2) 0 calc(var(--pg-module)*2)}
.pg-hero--ink{background:var(--pg-ink);color:var(--pg-chalk);--pg-fg:var(--pg-chalk);--pg-link:var(--pg-ochre);--pg-link-hover:#F5DCA8;position:relative;overflow:hidden}
/* trame verticale de filets craie à 5 %, pas de 34 px */
.pg-hero--ink::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(244,241,234,.05) 0 1px,transparent 1px var(--pg-module));pointer-events:none}
.pg-hero--ink .pg-lede{color:#CFCBC2}
.pg-hero__in{position:relative}

/* ---------------- SCHÉMAS ----------------------------------------- */
.pg-fig{margin:0;display:grid;gap:16px}
.pg-fig svg{width:100%;height:auto}
/* Rail horizontal des schémas : plancher de lisibilité à 14 px.
   Le filet ocre sous le rail signale qu'il se parcourt. */
.pg-figrail{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:thin;padding-bottom:10px;border-bottom:1px solid var(--pg-rule)}
.pg-figrail:focus-visible{outline:3px solid var(--pg-ochre);outline-offset:4px}
.pg-figrail::-webkit-scrollbar{height:8px}
.pg-figrail::-webkit-scrollbar-track{background:var(--pg-rule)}
.pg-figrail::-webkit-scrollbar-thumb{background:var(--pg-ink-45)}
.pg-sec--ink .pg-figrail,.pg-sec--sand .pg-figrail,.pg-sec--sage .pg-figrail{border-bottom-color:var(--pg-rule-strong)}
.pg-fig figcaption{font-size:14px;line-height:1.5;color:var(--pg-ink-70);max-width:70ch}
/* placeholder photo — documentaire N&B sur aplat ocre décalé */
.pg-photo{position:relative;padding:0 14px 14px 0}
.pg-photo::before{content:'';position:absolute;right:0;bottom:0;width:70%;height:70%;background:var(--pg-ochre)}
.pg-photo__box{position:relative;aspect-ratio:4/5;background:#DEDAD2;border:1px solid var(--pg-rule-strong);display:grid;align-content:end;gap:6px;padding:18px;filter:grayscale(1)}
.pg-photo__box span{font:600 11px/1.3 var(--pg-text);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-ink-70)}
.pg-photo__box em{font-style:normal;font-size:13px;color:var(--pg-ink-70)}

/* ---------------- BLOG -------------------------------------------- */
.pg-posts{display:grid;gap:var(--pg-gutter);grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.pg-post{background:var(--pg-chalk);border:1px solid var(--pg-rule);padding:22px 22px 26px;display:grid;gap:10px;align-content:start;text-decoration:none;color:inherit;position:relative;padding-bottom:34px}
.pg-post::after{content:'';position:absolute;left:22px;bottom:18px;width:44px;height:11px;background:var(--pg-ochre)}
.pg-post:hover{color:inherit;border-color:var(--pg-rule-strong)}
.pg-post:hover h3{text-decoration:underline;text-underline-offset:3px}
.pg-post h3{font-size:19px}
.pg-post p{margin:0;font-size:15px;color:var(--pg-ink-70)}
.pg-post time{font:400 13px/1 var(--pg-text);color:var(--pg-ink-45)}
.pg-tabs{display:flex;flex-wrap:wrap;gap:0;border-bottom:1.5px solid var(--pg-rule-strong);margin-bottom:var(--pg-module)}
.pg-tabs button{font:600 14px/1 var(--pg-text);background:0;border:0;border-bottom:3px solid transparent;padding:14px 20px;margin-bottom:-1.5px;cursor:pointer;color:var(--pg-ink-70)}
.pg-tabs button[aria-selected="true"]{color:var(--pg-ink);border-bottom-color:var(--pg-ochre)}
.pg-chips{display:flex;flex-wrap:wrap;gap:10px}
.pg-chip{font:500 14px/1 var(--pg-text);padding:11px 16px;border:1px solid var(--pg-rule-strong);background:transparent;color:var(--pg-ink);text-decoration:none;cursor:pointer;min-height:44px;display:inline-flex;align-items:center}
.pg-chip[aria-pressed="true"],.pg-chip[aria-current="page"]{background:var(--pg-ink);color:var(--pg-chalk);border-color:var(--pg-ink)}
.pg-search{display:flex;gap:0;max-width:420px}
.pg-search input{flex:1;min-width:0;font:400 16px/1 var(--pg-text);padding:13px 14px;border:1.5px solid var(--pg-rule-strong);background:#FBF9F5}
.pg-pager{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:var(--pg-module)}
.pg-crumbs{font-size:13px;color:var(--pg-ink-70);margin-bottom:20px}
.pg-crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.pg-crumbs li+li::before{content:'/';margin-right:8px;color:var(--pg-ink-45)}

/* ---------------- ARTICLE ----------------------------------------- */
.pg-article{display:grid;gap:var(--pg-module)}
@media(min-width:1000px){.pg-article{grid-template-columns:minmax(0,1fr) 260px;align-items:start;gap:calc(var(--pg-module)*1.5)}}
.pg-prose{max-width:72ch;font-size:18px}
.pg-prose h2{margin:calc(var(--pg-module)*1.2) 0 14px}
.pg-prose h3{margin:var(--pg-module) 0 10px}
.pg-prose ul,.pg-prose ol{padding-left:22px;margin:0 0 1em}
.pg-prose li{margin-bottom:.5em}
.pg-toc{position:sticky;top:104px;border-top:1.5px solid var(--pg-ink);padding-top:16px;font-size:15px}
.pg-toc ol{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.pg-toc a{color:var(--pg-ink-70);text-decoration:none}
.pg-toc a:hover{color:var(--pg-ink);text-decoration:underline}
.pg-keep{background:#EDE5D7;padding:24px;margin:var(--pg-module) 0;display:grid;gap:10px}
.pg-keep > :last-child{margin-bottom:0}
.pg-meta{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px;color:var(--pg-ink-70);margin-bottom:22px}
.pg-author{display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;align-items:start;border-top:1px solid var(--pg-rule);padding-top:24px;margin-top:var(--pg-module)}
.pg-author .pg-photo{width:110px;padding:0 8px 8px 0}
.pg-author .pg-photo__box{aspect-ratio:1}
/* passerelle contextuelle / CTA article — ambre, une seule zone par écran */
.pg-gate{background:var(--pg-amber);padding:28px;display:grid;gap:14px;margin:var(--pg-module) 0}
.pg-gate > :last-child{margin-bottom:0}
.pg-faq{display:grid;gap:0;border-top:1px solid var(--pg-rule)}
.pg-faq details{border-bottom:1px solid var(--pg-rule)}
.pg-faq summary{cursor:pointer;padding:18px 0;font:600 17px/1.3 var(--pg-display);list-style:none;display:flex;justify-content:space-between;gap:20px;align-items:center}
.pg-faq summary::-webkit-details-marker{display:none}
.pg-faq summary::after{content:'+';font:400 22px/1 var(--pg-text);color:var(--pg-warn)}
.pg-faq details[open] summary::after{content:'–'}
.pg-faq details > :not(summary){padding:0 0 18px;max-width:72ch}

/* ---------------- PIED DE PAGE ------------------------------------ */
.pg-footer{background:var(--pg-ink);color:#CFCBC2;--pg-link:var(--pg-ochre);--pg-link-hover:#F5DCA8;padding:calc(var(--pg-module)*1.6) 0 var(--pg-module);font-size:15px}
.pg-footer h2{font:600 11px/1.2 var(--pg-text);letter-spacing:.14em;text-transform:uppercase;color:#8A8680;margin-bottom:18px}
.pg-footer__cols{display:grid;gap:var(--pg-module);grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
.pg-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.pg-footer a{color:#CFCBC2;text-decoration:none}
.pg-footer a:hover{color:var(--pg-chalk);text-decoration:underline}
.pg-footer__base{border-top:1px solid #2C2A28;margin-top:calc(var(--pg-module)*1.4);padding-top:22px;display:flex;flex-wrap:wrap;gap:12px 26px;font-size:13px;color:#8A8680}
.pg-footer__legal{border:1px dashed #3A3835;padding:16px;margin-top:22px;font-size:13px;color:#8A8680;max-width:80ch}

/* ---------------- BANDEAU COOKIES --------------------------------- */
.pg-cookie{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--pg-chalk);border-top:1.5px solid var(--pg-ink);padding:22px var(--pg-pad)}
.pg-cookie[hidden]{display:none}
.pg-cookie__in{max-width:var(--pg-max);margin:0 auto;display:grid;gap:18px;align-items:center}
@media(min-width:900px){.pg-cookie__in{grid-template-columns:minmax(0,1fr) auto}}

/* ---------------- LANDING (sans navigation) ----------------------- */
.pg-lp-head{background:var(--pg-chalk);border-bottom:1px solid var(--pg-rule)}
.pg-lp-head__in{height:84px;display:flex;align-items:center;max-width:var(--pg-max);margin:0 auto;padding:0 var(--pg-pad)}

/* ---------------- WIDGET EMBARQUÉ -------------------------------- */
/* Widget de triage seul, sans décor d'assureur autour : c'est le produit
   qu'on montre, pas l'interface qui l'accueille. */
.pg-widget{width:100%;height:660px;border:1px solid var(--pg-rule-strong);background:#FBF9F5;display:block}
@media(max-width:700px){.pg-widget{height:600px}}

/* ---------------- MOUVEMENT --------------------------------------- */
/* Filet de progression de lecture — injecté par js/motion.js */
.pg-progress{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--pg-ochre);transform:scaleX(0);transform-origin:0 50%;transition:transform 120ms linear;pointer-events:none}
/* Apparition au défilement : opacité + 12 px, 320 ms.
   L'état RÉVÉLÉ est l'état par défaut : le masquage n'existe que sous
   html.pg-motion, que js/motion.js ne pose qu'après une trame confirmée.
   Sans JS, onglet en arrière-plan, prérendu, impression ou capture : tout
   le contenu reste visible. */
html.pg-motion .pg-r{opacity:0;transform:translateY(12px);transition:opacity var(--pg-dur-reveal) var(--pg-ease-reveal),transform var(--pg-dur-reveal) var(--pg-ease-reveal);will-change:opacity,transform}
html.pg-motion .pg-r.is-in{opacity:1;transform:none}
/* Le filet ocre du héros se trace à l'ouverture — en scaleX sur une largeur
   acquise, pour qu'il mesure 60 px même animations suspendues. */
html.pg-motion .pg-hero .pg-rule-ochre{transform-origin:0 50%;animation:pg-rule 320ms var(--pg-ease-reveal)}
@keyframes pg-rule{from{transform:scaleX(0)}to{transform:none}}
@keyframes pg-menu{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
/* L'encoche s'allonge au survol — seul mouvement de couleur autorisé */
.pg-notch::after,.pg-post::after{transition:width var(--pg-dur) var(--pg-ease)}
.pg-card.pg-notch:hover::after,.pg-cardlink.pg-notch:hover::after,.pg-post:hover::after{width:64px}
.pg-card,.pg-post{transition:border-color var(--pg-dur) var(--pg-ease)}
.pg-nav a,.pg-nav__btn,.pg-chip,.pg-tabs button{transition:color var(--pg-dur) var(--pg-ease),background var(--pg-dur) var(--pg-ease),border-color var(--pg-dur) var(--pg-ease)}
.pg-field input,.pg-field select,.pg-field textarea{transition:border-color var(--pg-dur) var(--pg-ease),box-shadow var(--pg-dur) var(--pg-ease)}
.pg-faq summary::after{transition:color var(--pg-dur) var(--pg-ease)}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-delay:0ms!important;transition-duration:.001ms!important;transition-delay:0ms!important;scroll-behavior:auto!important}
  .pg-r{opacity:1!important;transform:none!important}
  .pg-hero .pg-rule-ochre{animation:none;transform:none}
}
/* À l'impression et à l'export PDF, rien ne peut rester masqué. */
@media print{
  .pg-r{opacity:1!important;transform:none!important}
  .pg-hero .pg-rule-ochre{animation:none;transform:none}
  .pg-progress{display:none}
}

/* ============================================================
   PETGATE v2 — composants de la refonte « montrer, pas raconter ».
   Charte Le Seuil respectée : rayon 0, aucune ombre, ocre ≈ 5 %.
   ============================================================ */

/* --- Héros court : le titre porte, la lede tient en une ligne ------- */
.v2-hero{padding:calc(var(--pg-module)*2) 0 calc(var(--pg-module)*1.8)}
.v2-h1{font:700 clamp(34px,5.4vw,62px)/1.02 var(--pg-display);letter-spacing:-.035em;margin:0 0 20px;max-width:19ch;text-wrap:balance}
.v2-h1 em{font-style:normal;color:var(--pg-ochre)}
.v2-sub{font-size:clamp(17px,1.5vw,20px);line-height:1.5;max-width:56ch;margin:0 0 30px}
.v2-hero .v2-sub{color:#CFCBC2}

/* --- Bandeau des deux produits, sous le héros ----------------------- */
.v2-duo{display:grid;gap:1px;background:#2C2A28;border:1px solid #2C2A28;margin-top:calc(var(--pg-module)*1.2)}
@media(min-width:800px){.v2-duo{grid-template-columns:1fr 1fr}}
.v2-duo__c{background:var(--pg-ink);padding:24px 26px 26px;display:grid;gap:9px;align-content:start;text-decoration:none;color:var(--pg-chalk);transition:background var(--pg-dur) var(--pg-ease)}
.v2-duo__c:hover{background:#1C1A18;color:var(--pg-chalk)}
.v2-duo__n{font:700 19px/1 var(--pg-display);letter-spacing:-.01em;display:flex;align-items:center;gap:11px}
.v2-duo__n::before{content:'';width:22px;height:5px;background:var(--pg-ochre);flex:none}
.v2-duo__t{font-size:15px;line-height:1.5;color:#CFCBC2;margin:0;max-width:44ch}
.v2-duo__go{font:600 13px/1 var(--pg-text);color:var(--pg-ochre);display:inline-flex;gap:7px;align-items:center;margin-top:4px}
.v2-duo__go::after{content:'→';transition:transform var(--pg-dur) var(--pg-ease)}
.v2-duo__c:hover .v2-duo__go::after{transform:translateX(4px)}

/* --- Bloc démonstration : l'écran d'abord, le texte en appui -------- */
.v2-demo{display:grid;gap:var(--pg-module)}
@media(min-width:980px){.v2-demo{grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:calc(var(--pg-module)*1.4);align-items:start}}
.v2-demo__aside{display:grid;gap:22px;align-content:start}
.v2-beats{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid var(--pg-rule)}
.v2-beats li{border-bottom:1px solid var(--pg-rule);padding:15px 0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:baseline}
.v2-beats b{font:600 11px/1.5 var(--pg-text);letter-spacing:.14em;color:var(--pg-ink-45)}
.v2-beats span{font-size:15px;line-height:1.5;color:var(--pg-ink-70)}
.v2-beats strong{color:var(--pg-ink);font-weight:600}

/* --- Bénéfices d'un produit : deux ou trois, jamais plus ------------ */
.v2-gains{display:grid;gap:1px;background:var(--pg-rule-strong);border:1px solid var(--pg-rule-strong)}
@media(min-width:800px){.v2-gains{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}}
.v2-gain{background:var(--pg-chalk);padding:26px 24px 28px;display:grid;gap:11px;align-content:start}
.v2-gain__n{font:600 11px/1 var(--pg-text);letter-spacing:.14em;color:var(--pg-warn)}
.v2-gain__h{font:700 clamp(19px,1.8vw,23px)/1.14 var(--pg-display);letter-spacing:-.02em;margin:0;text-wrap:balance}
.v2-gain__p{font-size:14.5px;line-height:1.55;color:var(--pg-ink-70);margin:0}
.pg-sec--ink .v2-gains{background:#2C2A28;border-color:#2C2A28}
.pg-sec--ink .v2-gain{background:var(--pg-ink)}
.pg-sec--ink .v2-gain__n{color:var(--pg-ochre)}
.pg-sec--ink .v2-gain__p{color:#CFCBC2}

/* --- Avertissements réglementaires : lus, pas cachés ---------------
   Filet haut de 6 px comme .pg-state — jamais de bordure latérale. */
.v2-warns{display:grid;gap:var(--pg-module);margin-top:var(--pg-module)}
@media(min-width:820px){.v2-warns{grid-template-columns:1fr 1fr}}
.v2-warn{padding-top:0;display:grid;gap:9px;align-content:start}
.v2-warn::before{content:'';display:block;width:100%;height:6px;background:var(--pg-warn)}
.v2-warn__t{font:600 11px/1.2 var(--pg-text);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-warn);margin:5px 0 0}
.v2-warn__h{font:700 18px/1.25 var(--pg-display);margin:0;color:var(--pg-ink)}
.v2-warn p:not([class]){margin:0;font-size:14.5px;line-height:1.55;color:var(--pg-ink-70);max-width:48ch}
.pg-sec--ink .v2-warn::before{background:var(--pg-ochre)}
.pg-sec--ink .v2-warn__t{color:var(--pg-ochre)}
.pg-sec--ink .v2-warn__h{color:var(--pg-chalk)}
.pg-sec--ink .v2-warn p:not([class]){color:#CFCBC2}

/* --- PetClaim : la facture lue, montrée ----------------------------- */
.v2-claim{display:grid;gap:var(--pg-module)}
@media(min-width:900px){.v2-claim{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:calc(var(--pg-module)*1.2);align-items:start}}
.v2-inv{background:#FBF9F5;border:1px solid var(--pg-rule-strong);padding:24px 24px 26px;font-size:13px;line-height:1.7;color:var(--pg-ink-70)}
.v2-inv__hd{display:flex;align-items:baseline;gap:12px;border-bottom:1.5px solid var(--pg-rule-strong);padding-bottom:12px;margin-bottom:14px}
.v2-inv__hd b{font:700 15px/1.2 var(--pg-display);color:var(--pg-ink)}
.v2-inv__hd span{font:600 11px/1 var(--pg-text);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-ink-45);margin-left:auto}
.v2-inv__l{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;padding:5px 0}
.v2-inv mark{background:rgba(232,163,61,.42);color:var(--pg-ink);padding:1px 3px;font-weight:600}
.v2-inv__ft{border-top:1.5px solid var(--pg-rule-strong);margin-top:12px;padding-top:11px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;font-weight:600;color:var(--pg-ink)}
.v2-out{display:grid;gap:0;border-top:1px solid var(--pg-rule)}
.v2-out__l{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr);gap:16px;padding:13px 0;border-bottom:1px solid var(--pg-rule);align-items:baseline}
.v2-out__k{font:600 11px/1.4 var(--pg-text);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-ink-45)}
.v2-out__v{font-size:15px;line-height:1.45;color:var(--pg-ink);font-weight:500}
.v2-verdict{border:1.5px solid var(--pg-ok);padding:18px 20px;display:grid;gap:7px;margin-top:22px}
.v2-verdict__t{font:600 11px/1 var(--pg-text);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-ok)}
.v2-verdict__h{font:700 19px/1.2 var(--pg-display);margin:0;color:var(--pg-ink)}
.v2-verdict p{margin:0;font-size:14px;line-height:1.5;color:var(--pg-ink-70)}

/* --- Intégration : trois pas, tenus sur une ligne ------------------- */
.v2-steps{display:grid;gap:1px;background:var(--pg-rule-strong);border:1px solid var(--pg-rule-strong)}
@media(min-width:860px){.v2-steps{grid-template-columns:repeat(3,1fr)}}
.v2-step{background:var(--pg-chalk);padding:26px 24px 28px;display:grid;gap:10px;align-content:start}
.v2-step__n{font:700 34px/1 var(--pg-display);letter-spacing:-.03em;color:var(--pg-ochre)}
.v2-step__h{font:700 17px/1.2 var(--pg-display);margin:0}
.v2-step p{margin:0;font-size:14.5px;line-height:1.55;color:var(--pg-ink-70)}

/* --- Appel final ---------------------------------------------------- */
.v2-cta{display:grid;gap:22px;justify-items:start}
.v2-cta h2{font:700 clamp(27px,3.4vw,42px)/1.06 var(--pg-display);letter-spacing:-.03em;margin:0;max-width:20ch;text-wrap:balance}

/* --- Paires problème / réponse -------------------------------------- */
.v2-pair{display:grid;gap:var(--pg-module);padding:calc(var(--pg-module)*1.1) 0;border-top:1px solid var(--pg-rule)}
@media(min-width:900px){.v2-pair{grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:calc(var(--pg-module)*1.3)}}
.v2-pair__k{font:600 11px/1 var(--pg-text);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-ink-45);margin:0 0 12px}
.v2-pair__h{font:700 clamp(21px,2.2vw,28px)/1.14 var(--pg-display);letter-spacing:-.022em;margin:0 0 12px;text-wrap:balance}
.v2-pair p:not([class]){margin:0 0 10px;font-size:15px;line-height:1.6;color:var(--pg-ink-70)}
.v2-pair p:not([class]):last-child{margin-bottom:0}
.v2-ans{background:var(--pg-chalk);border:1px solid var(--pg-rule-strong);padding:24px 24px 26px;position:relative}
.v2-ans::after{content:'';position:absolute;left:0;top:0;width:44px;height:6px;background:var(--pg-ochre)}
.v2-ans__k{font:600 11px/1 var(--pg-text);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-warn);margin:6px 0 10px}
.v2-ans__h{font:700 19px/1.2 var(--pg-display);margin:0 0 10px}

/* --- Chiffres qu'on peut défendre ----------------------------------- */
.v2-figs{display:grid;gap:1px;background:#2C2A28;border:1px solid #2C2A28}
@media(min-width:800px){.v2-figs{grid-template-columns:repeat(3,1fr)}}
.v2-fig{background:var(--pg-ink);padding:28px 24px 30px;display:grid;gap:10px;align-content:start}
.v2-fig__n{font:700 clamp(40px,5vw,58px)/.92 var(--pg-display);letter-spacing:-.04em;color:var(--pg-ochre)}
.v2-fig__h{font:700 16px/1.25 var(--pg-display);margin:0;color:var(--pg-chalk)}
.v2-fig p{margin:0;font-size:14px;line-height:1.55;color:#CFCBC2}

/* --- Cent carrés : une demande entrante = un carré -------------------
   Remplace le schéma SVG en rail. Grille fluide, aucun débordement. */
.v2-hundred{display:grid;gap:var(--pg-module)}
@media(min-width:900px){.v2-hundred{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:calc(var(--pg-module)*1.3);align-items:start}}
.v2-grid100{display:grid;grid-template-columns:repeat(10,1fr);gap:4px}
.v2-grid100 i{display:block;aspect-ratio:1;background:var(--pg-rule-strong)}
.v2-grid100 i[data-o="1"]{background:#A9BDA9}
.v2-grid100 i[data-o="2"]{background:#D8C9B0}
.v2-grid100 i[data-o="3"]{background:var(--pg-ink)}
.v2-grid100 i[data-o="4"]{background:var(--pg-ochre)}
.v2-key{display:grid;gap:0;border-top:1px solid var(--pg-rule-strong)}
.v2-key__r{display:grid;grid-template-columns:auto auto minmax(0,1fr);gap:14px;align-items:baseline;padding:15px 0;border-bottom:1px solid var(--pg-rule)}
.v2-key__s{width:16px;height:16px;align-self:center}
.v2-key__n{font:700 26px/1 var(--pg-display);letter-spacing:-.03em;min-width:2.4ch}
.v2-key__t{font-size:14.5px;line-height:1.45}
.v2-key__t b{display:block;font:700 15px/1.25 var(--pg-display);margin-bottom:3px}