/*
Theme Name: Masson
Author: Masson Imprimerie
Description: Thème bloc sur mesure pour l'imprimerie Masson. Généré depuis la maquette HTML.
Version: 1.0.1
Requires at least: 6.6
Requires PHP: 8.0
License: GPL-2.0-or-later
Text Domain: masson
*/
/* Masson Imprimerie — maquette
   Registre relevé sur la charte graphique : une famille sans-serif géométrique,
   magenta seul accent, blanc froid, angles droits, filets fins, titres à gauche.
   Balisage pensé pour la phase 4 : chaque élément devient un bloc natif un pour un
   (aucun span à classe, aucun élément décoratif vide : les décors sont en pseudo-éléments). */

:root {
  --magenta: #c80262;
  --magenta-fonce: #a3014f;
  --rose: #fae7f0;
  --rose-filet: #e49abf;
  --noir: #000000;
  --gris: #9a9a9a;
  --gris-texte: #848484;
  --filet: #d9d9d9;
  --blanc: #ffffff;
  --police: "Plus Jakarta Sans", system-ui, sans-serif;
  --large: 1320px;
  --gouttiere: clamp(16px, 4vw, 56px);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--blanc);
  color: var(--noir);
  font-family: var(--police);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3, p, figure { margin: 0; }
h1, h2 { hyphens: none; text-wrap: balance; }
h1 em, h2 em { font-style: normal; color: var(--magenta); }
section[id] { scroll-margin-top: 96px; }

.enveloppe { width: 100%; max-width: var(--large); margin: 0 auto; padding: 0 var(--gouttiere); }

/* ---------- En-tête : logo | filet | libellé ———— filet magenta ———— téléphone + menu ---------- */
.entete { position: sticky; top: 0; z-index: 20; background: var(--blanc); }
.entete .enveloppe { display: flex; align-items: center; gap: 28px; height: 96px; }
.entete .logo img { height: 68px; width: auto; }
.entete .libelle { display: flex; align-items: center; gap: 28px; font-size: 13px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--gris-texte); white-space: nowrap; }
.entete .libelle::before { content: ""; width: 1px; height: 46px; background: var(--gris); opacity: .6; }
.entete .tel { flex: 1; display: flex; align-items: center; gap: 28px; }
.entete .tel::before { content: ""; flex: 1; height: 2px; background: var(--magenta); }
.entete .tel a { font-weight: 700; font-size: 17px; text-decoration: none; color: var(--magenta); white-space: nowrap; }
.burger { flex: none; position: relative; width: 46px; height: 46px; background: var(--magenta); cursor: pointer; font-size: 0; }
.burger::before { content: ""; position: absolute; left: 12px; right: 12px; top: 15px; height: 16px;
  background: linear-gradient(var(--blanc) 0 0) top / 100% 2px no-repeat, linear-gradient(var(--blanc) 0 0) center / 100% 2px no-repeat, linear-gradient(var(--blanc) 0 0) bottom / 100% 2px no-repeat; }

/* ---------- Panneau de navigation (repris du site existant : colonne blanche + colonne magenta) ---------- */
.panneau { position: fixed; inset: 0; z-index: 50; display: grid; grid-template-columns: 1fr 1fr; visibility: hidden; opacity: 0; transition: opacity .25s, visibility .25s; }
.panneau.ouvert { visibility: visible; opacity: 1; }
.panneau .col-nav { background: var(--blanc); padding: 120px 8vw 56px; display: flex; flex-direction: column; justify-content: space-between; }
.menu-principal { list-style: none; margin: 0; padding: 0; counter-reset: n; }
.menu-principal li { counter-increment: n; border-bottom: 1px solid var(--filet); }
.menu-principal a { display: flex; align-items: baseline; gap: 18px; padding: 12px 0; font-size: clamp(22px, 2.4vw, 34px); font-weight: 700; text-decoration: none; letter-spacing: -.01em; }
.menu-principal a::before { content: counter(n, decimal-leading-zero) " —"; color: var(--magenta); font-size: .55em; font-weight: 700; min-width: 52px; }
.menu-principal a:hover, .menu-principal a[aria-current="page"] { color: var(--magenta); }
.panneau .coords { font-size: 15px; color: var(--gris-texte); line-height: 1.7; margin-top: 40px; }
.panneau .coords a { color: var(--noir); font-weight: 600; text-decoration: none; }
.panneau .col-produits { background: var(--magenta); color: var(--blanc); padding: 120px 6vw 56px; }
.panneau .col-produits .etiquette { font-size: 13px; letter-spacing: .16em; text-transform: uppercase; font-weight: 600; opacity: .8; }
.menu-produits { list-style: none; margin: 24px 0 0; padding: 0; }
.menu-produits a { display: block; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.35); font-size: 22px; font-weight: 600; text-decoration: none; }
.fermer { position: absolute; top: 25px; right: var(--gouttiere); width: 46px; height: 46px; background: var(--blanc); color: var(--magenta); font-size: 30px; line-height: 46px; text-align: center; cursor: pointer; }

/* ---------- Héros : titre hors d'échelle + photo posée sur la vague ---------- */
.heros { padding: 56px 0 0; position: relative; }
.heros > .enveloppe { position: relative; z-index: 2; }
.heros h1 { font-size: clamp(46px, 8.4vw, 128px); font-weight: 800; line-height: .98; letter-spacing: -.045em; max-width: 14ch; }
.heros .grille { display: grid; grid-template-columns: 5fr 7fr; gap: 64px; margin-top: 64px; align-items: start; }
.heros .chapo { font-size: 22px; line-height: 1.5; font-weight: 500; }
.heros .chapo-detail { margin-top: 20px; color: var(--gris-texte); font-size: 16px; }

/* Boutons : structure des boutons natifs (conteneur .bouton, style sur le lien) */
.boutons { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; }
.bouton .wp-block-button__link, .formulaire-contact .envoyer { display: inline-flex; align-items: center; gap: 10px; padding: 16px 26px; font-family: inherit; font-weight: 700; font-size: 15px; line-height: 1.2; letter-spacing: .04em; text-transform: uppercase; text-decoration: none; background: var(--magenta); color: var(--blanc); border: 2px solid var(--magenta); border-radius: 0; cursor: pointer; }
.bouton.contour .wp-block-button__link { background: transparent; color: var(--magenta); }
.bouton.contour.clair .wp-block-button__link { color: var(--blanc); border-color: var(--blanc); }
.bouton .wp-block-button__link:hover, .formulaire-contact .envoyer:hover { background: var(--magenta-fonce); border-color: var(--magenta-fonce); color: var(--blanc); }

.zone { position: relative; }
.zone .photo { position: relative; z-index: 1; box-shadow: 0 30px 60px -30px rgba(0,0,0,.45); }
.zone .photo img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.zone.label { display: flex; justify-content: center; }
.zone.label .photo { background: var(--blanc); padding: 32px; }
.zone.label .photo img { width: auto; max-width: 236px; aspect-ratio: auto; object-fit: contain; }

/* ---------- La vague : le mouvement du cygne, en image de fond ----------
   Accueil : sous le héros, elle porte les promesses. Pages internes : en bas de l'intro.
   Le contenu passe devant (z-index 2) et la photo déborde sur elle. */
.pied-heros { position: relative; height: clamp(360px, 44vw, 640px); margin-top: clamp(-460px, -30vw, -200px); }
.pied-heros::before, .intro::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; background: url(assets/img/vague.svg) center / 100% 100% no-repeat; pointer-events: none; }
.pied-heros::before { top: 0; }
.promesses { position: absolute; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(3, 1fr); padding-bottom: 28px; }
.promesses p { padding: 10px 16px; text-align: center; font-weight: 700; font-size: 22px; color: var(--blanc); letter-spacing: -.01em; }
.promesses p + p { border-left: 1px solid rgba(255,255,255,.45); }
.intro { --vague: clamp(240px, 30vw, 440px); --chevauchement: clamp(140px, 20vw, 320px); padding-bottom: calc(var(--vague) - var(--chevauchement)); }
.intro::after { height: var(--vague); }
@media (prefers-reduced-motion: reduce) {
  .pied-heros::before, .intro::after { background-image: url(assets/img/vague-fixe.svg); }
}

/* ---------- Titres de section : « 01 — LOGO » ---------- */
.titre-section { display: flex; align-items: baseline; gap: 18px; font-size: clamp(26px, 2.6vw, 36px); font-weight: 800; text-transform: uppercase; letter-spacing: -.01em; }
.titre-section strong { color: var(--magenta); font-weight: inherit; }
.titre-section strong::after { content: " —"; }

.lien-suite a { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; font-size: 15px; letter-spacing: .04em; text-transform: uppercase; color: var(--magenta); text-decoration: none; border-bottom: 2px solid var(--magenta); padding-bottom: 4px; }
.lien-suite a::after { content: "→"; }
.lien-suite.clair a { color: var(--blanc); }

/* ---------- Histoire (accueil) : texte + visuel, date en surimpression ---------- */
.histoire { padding: 140px 0 120px; }
.histoire .grille { display: grid; grid-template-columns: 6fr 5fr; gap: 72px; margin-top: 48px; align-items: center; }
.histoire .texte p { color: #2b2b2b; }
.histoire .texte p + p { margin-top: 18px; }
.histoire .texte .grand { font-size: 26px; line-height: 1.4; font-weight: 600; color: var(--noir); }
.histoire .texte .encart { background: var(--rose); padding: 24px 28px; font-weight: 700; color: var(--magenta); font-size: 19px; line-height: 1.45; margin-top: 32px; }
.histoire .texte .lien-suite { margin-top: 28px; }
.histoire .fig { position: relative; }
.histoire .fig img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.histoire .date { position: absolute; z-index: 1; left: -40px; top: -40px; background: var(--blanc); padding: 18px 26px 10px 0; font-size: 96px; font-weight: 800; line-height: 1; letter-spacing: -.05em; color: var(--magenta); }

/* ---------- Colonnes : séparées par des filets, pastille de couleur de la charte en tête ---------- */
.competences { padding: 0 0 120px; }
.colonnes { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 48px; border-top: 2px solid var(--noir); }
.colonne { padding: 36px 36px 8px; }
.colonne:first-child { padding-left: 0; }
.colonne + .colonne { border-left: 1px solid var(--filet); }
.colonne::before { content: ""; display: block; height: 120px; background: var(--magenta); margin-bottom: 24px; }
.colonne:nth-child(2)::before { background: var(--noir); }
.colonne:nth-child(3)::before { background: var(--gris); }
.colonnes.quatre { grid-template-columns: repeat(4, 1fr); }
.colonnes.quatre .colonne:nth-child(4)::before { background: var(--rose); }
.colonne h3 { font-size: 21px; font-weight: 700; }
.colonne .sous { color: var(--gris-texte); font-size: 15px; margin-top: 4px; }
.colonne ol { margin: 20px 0 0; padding-left: 20px; font-size: 15px; }
.colonne ol li { padding: 3px 0; }
.colonne ol li::marker { color: var(--magenta); font-weight: 700; }

/* ---------- Chiffres : champ magenta encarté ---------- */
.chiffres { padding-bottom: 120px; }
.grille-chiffres { display: grid; grid-template-columns: repeat(4, 1fr); background: var(--magenta); color: var(--blanc); padding: 0 48px; }
.chiffre { padding: 64px 24px 56px; }
.chiffre:first-child { padding-left: 0; }
.chiffre + .chiffre { border-left: 1px solid rgba(255,255,255,.35); }
.chiffre .num { font-size: clamp(56px, 6.4vw, 104px); font-weight: 800; line-height: 1; letter-spacing: -.05em; }
.chiffre .num + p { margin-top: 12px; font-size: 13px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
.grille-chiffres.unique { grid-template-columns: 1fr; }
.grille-chiffres.unique .chiffre { display: flex; align-items: baseline; gap: 28px; flex-wrap: wrap; }
.grille-chiffres.unique .chiffre .num + p { margin-top: 0; font-size: 15px; }

/* ---------- Équipe : les six engagements ---------- */
.equipe { padding: 0 0 120px; }
.equipe .entete-section { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: end; }
.equipe .entete-section p { color: var(--gris-texte); font-size: 18px; }
.etapes { display: grid; grid-template-columns: repeat(6, 1fr); margin-top: 56px; border-top: 1px solid var(--filet); }
.etape { padding: 28px 22px 0 0; position: relative; }
.etape + .etape { padding-left: 22px; border-left: 1px solid var(--filet); }
.etape .n { font-size: 15px; font-weight: 800; color: var(--magenta); }
.etape h3 { font-size: 22px; font-weight: 700; margin-top: 18px; line-height: 1.2; }
.etape h3 + p { font-size: 15px; color: var(--gris-texte); margin-top: 10px; line-height: 1.5; }
.etape::before { content: ""; position: absolute; top: -1px; left: 0; right: 0; height: 3px; background: var(--magenta); transform-origin: left; transform: scaleX(0); transition: transform .35s ease; }
.etape:hover::before { transform: scaleX(1); }

/* ---------- Produits : mosaïque asymétrique ---------- */
.produits { padding: 0 0 120px; }
.mosaique { display: grid; grid-template-columns: 7fr 5fr; grid-template-rows: repeat(2, 300px); gap: 20px; margin-top: 48px; }
.mosaique > .carte:first-child { grid-row: span 2; }
.mosaique .carte.droite { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; background: none; }
.carte { position: relative; overflow: hidden; background: var(--rose); }
.carte figure, .carte figure a { display: block; height: 100%; }
.carte img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.carte:hover img { transform: scale(1.04); }
.carte .nom { position: absolute; left: 0; bottom: 0; background: var(--blanc); padding: 12px 18px 10px 0; font-weight: 800; font-size: 20px; letter-spacing: -.01em; }
.carte .nom strong { color: var(--magenta); font-weight: inherit; }
.carte.texte { background: var(--magenta); color: var(--blanc); padding: 28px; display: flex; flex-direction: column; justify-content: space-between; }
.carte.texte h3 { font-size: 26px; font-weight: 800; line-height: 1.15; }
.carte.texte h3 a { text-decoration: none; }
.carte.texte p { font-size: 15px; opacity: .9; }

/* ---------- Blocs noirs : Imprim'vert (accueil) et appel à l'action ---------- */
.bloc-noir { background: var(--noir); color: var(--blanc); display: grid; align-items: center; }
.vert .bloc-noir { grid-template-columns: 5fr 7fr; gap: 72px; padding: 80px 64px; }
.vert .geant .num { font-size: clamp(110px, 12vw, 190px); font-weight: 800; line-height: .8; letter-spacing: -.06em; color: var(--magenta); white-space: nowrap; }
.vert .geant .num + p { margin-top: 18px; font-size: 13px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--blanc); }
.vert .titre-section + p { color: #cfcfcf; margin-top: 22px; max-width: 56ch; }
.vert ol { margin: 26px 0 0; padding-left: 20px; color: var(--blanc); font-weight: 600; }
.vert ol li { padding: 3px 0; }
.vert ol li::marker { color: var(--magenta); }
.vert .lien-suite { margin-top: 28px; }

.appel { padding-bottom: 120px; }
.appel .bloc-noir { grid-template-columns: 1fr auto; gap: 40px; padding: 64px; }
.appel h2 { font-size: clamp(34px, 4.4vw, 64px); font-weight: 800; letter-spacing: -.04em; line-height: 1; }
.appel .boutons { margin-top: 0; }

/* ---------- Contact ---------- */
.contact { padding: 120px 0; }
.contact .grille { display: grid; grid-template-columns: 4fr 7fr; margin-top: 48px; border-top: 2px solid var(--noir); }
.contact .infos { padding: 36px 48px 0 0; }
.contact .infos .dt { font-size: 13px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--magenta); margin-top: 28px; }
.contact .infos .dt:first-child { margin-top: 0; }
.contact .infos .dd { margin-top: 6px; font-size: 18px; font-weight: 500; }
.contact .infos .dd a { text-decoration: none; font-weight: 700; }
.formulaire-contact { padding: 36px 0 0 48px; border-left: 1px solid var(--filet); display: grid; grid-template-columns: 1fr 1fr; gap: 18px 20px; }
.champ { display: flex; flex-direction: column; gap: 6px; }
.champ.large { grid-column: 1 / -1; }
.champ label { font-size: 13px; font-weight: 600; color: var(--gris-texte); }
.champ input, .champ textarea { width: 100%; font: inherit; font-size: 16px; padding: 12px 14px; border: 1px solid #cfcfcf; background: var(--blanc); border-radius: 0; }
.champ input:focus, .champ textarea:focus { outline: 2px solid var(--magenta); outline-offset: -1px; border-color: var(--magenta); }
.champ textarea { display: block; min-height: 140px; resize: vertical; }
.accord { grid-column: 1 / -1; font-size: 14px; color: var(--gris-texte); display: flex; gap: 10px; align-items: flex-start; }
.accord input { accent-color: var(--magenta); margin-top: 4px; }
.formulaire-contact .envoyer { justify-self: start; }

.plan { padding-bottom: 120px; }
.plan .adresse-plan { margin-top: 48px; padding-top: 36px; border-top: 2px solid var(--noir); font-size: 22px; font-weight: 500; }
.plan .boutons { margin-top: 28px; }

/* ---------- Pages internes ---------- */
.intro h1 { font-size: clamp(42px, 6.4vw, 96px); max-width: 16ch; }
.etiquette-page { font-size: 13px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--gris-texte); margin-bottom: 28px; }
.etiquette-page a { color: var(--magenta); text-decoration: none; }
.intro + section { padding-top: 120px; }

/* frise : six dates, années hors d'échelle, filets verticaux */
.frise-section { padding-bottom: 120px; }
.frise { margin-top: 48px; display: grid; grid-template-columns: repeat(6, 1fr); border-top: 2px solid var(--noir); }
.frise .li { padding: 28px 20px 0 0; }
.frise .li + .li { padding-left: 20px; border-left: 1px solid var(--filet); }
.frise .num { font-size: clamp(36px, 3.6vw, 56px); font-weight: 800; letter-spacing: -.05em; line-height: 1; color: var(--magenta); }
.frise .li:nth-child(even) .num { color: var(--noir); }
.frise .num + p { margin-top: 14px; font-size: 15px; color: #2b2b2b; }

/* ---------- Pied de page : reprend le pied de la charte ---------- */
.pied { border-top: 1px solid var(--filet); }
.pied .enveloppe { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding-top: 24px; padding-bottom: 24px; font-size: 14px; color: var(--gris-texte); }
.pied .liens-pied { display: flex; gap: 24px; flex-wrap: wrap; }
.pied a { text-decoration: none; }
.pied a:hover { color: var(--magenta); }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .etapes { grid-template-columns: repeat(3, 1fr); }
  .etape:nth-child(4) { border-left: 0; padding-left: 0; }
  .etape { padding-bottom: 28px; }
  .frise { grid-template-columns: repeat(3, 1fr); }
  .frise .li:nth-child(4) { border-left: 0; padding-left: 0; }
  .frise .li { padding-bottom: 28px; }
  .colonnes.quatre { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
  .entete .libelle { display: none; }
  .heros .grille, .histoire .grille, .equipe .entete-section, .vert .bloc-noir, .contact .grille { grid-template-columns: 1fr; gap: 48px; }
  .colonnes, .colonnes.quatre { grid-template-columns: 1fr; }
  .colonne { padding: 32px 0; }
  .colonne + .colonne { border-left: 0; border-top: 1px solid var(--filet); }
  .grille-chiffres { grid-template-columns: 1fr 1fr; padding: 0 28px; }
  .vert .bloc-noir { padding: 48px 28px; }
  .appel .bloc-noir { grid-template-columns: 1fr; padding: 40px 28px; }
  .chiffre:nth-child(3) { border-left: 0; padding-left: 0; }
  .chiffre:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,.35); }
  .mosaique { grid-template-columns: 1fr; grid-template-rows: 340px 300px; }
  .mosaique > .carte:first-child { grid-row: auto; }
  .formulaire-contact { padding-left: 0; border-left: 0; }
  .panneau { grid-template-columns: 1fr; overflow-y: auto; }
  .panneau .col-nav { padding-top: 96px; }
  .panneau .col-produits { padding-top: 40px; }
  .pied-heros { margin-top: -60px; height: 340px; }
  .intro { --vague: 260px; --chevauchement: 40px; }
}
@media (max-width: 600px) {
  .entete .enveloppe { height: 76px; gap: 14px; }
  .entete .logo img { height: 44px; }
  .entete .tel a { font-size: 0; }
  .entete .tel a::before { content: "☎"; font-size: 22px; }
  .histoire .date { font-size: 64px; left: 0; }
  .etapes { grid-template-columns: 1fr 1fr; }
  .etape:nth-child(n) { border-left: 0; padding-left: 0; }
  .etape:nth-child(even) { padding-left: 18px; border-left: 1px solid var(--filet); }
  .frise { grid-template-columns: 1fr 1fr; }
  .frise .li:nth-child(n) { border-left: 0; padding-left: 0; }
  .frise .li:nth-child(even) { padding-left: 16px; border-left: 1px solid var(--filet); }
  .chiffre { padding: 36px 16px; }
  .chiffre:nth-child(odd) { padding-left: 0; }
  .chiffre:nth-child(even) { border-left: 1px solid rgba(255,255,255,.35); }
  .mosaique .carte.droite { grid-template-columns: 1fr; }
  .mosaique { grid-template-rows: 300px auto; }
  .mosaique .carte.droite .carte.texte { min-height: 220px; }
  .mosaique .carte.droite .carte:not(.texte) { height: 240px; }
  .formulaire-contact { grid-template-columns: 1fr; }
  .pied .enveloppe { flex-direction: column; align-items: flex-start; }
  /* la vague au-dessus, les promesses sur un aplat magenta en dessous */
  .pied-heros { height: auto; margin-top: -70px; padding-top: 230px; }
  .pied-heros::before { bottom: auto; height: 230px; }
  .promesses { position: static; grid-template-columns: 1fr; background: var(--magenta); margin-top: -2px; padding-top: 4px; }
  .promesses p { padding: 6px; font-size: 18px; }
  .promesses p + p { border-left: 0; }
  .intro { --vague: 180px; --chevauchement: 40px; }
  .intro + section { padding-top: 72px; }
}

/* =====================================================================
   ADAPTATIONS WORDPRESS — le DOM des blocs natifs diffère de la maquette.
   Le CSS des blocs est imprimé APRÈS cette feuille : toute surcharge
   d'un style de bloc doit être plus spécifique (blocs-gutenberg.md).
   ===================================================================== */

/* Filets de sécurité à spécificité nulle (blockGap coupé dans theme.json) */
:where(.wp-block-group) > :where(*), :where(.wp-block-buttons) { margin-block: 0; }
figure.wp-block-image { margin: 0; }
.wp-site-blocks { padding: 0; }

/* ---- En-tête : la part template est l'élément collant (l'enveloppe .entete n'a plus de hauteur de défilement) ---- */
.entete-site { position: sticky; top: 0; z-index: 20; }
.admin-bar .entete-site { top: 32px; }
@media (max-width: 782px) { .admin-bar .entete-site { top: 46px; } }
.entete .wp-block-site-logo { flex: none; }
.entete .wp-block-site-logo img { height: 68px; width: auto; }

/* ---- Menus du panneau : core/navigation remplace les listes de la maquette ---- */
.wp-block-navigation.menu-principal, .wp-block-navigation.menu-produits { display: block; font-size: inherit; }
.wp-block-navigation.menu-principal .wp-block-navigation__container,
.wp-block-navigation.menu-produits .wp-block-navigation__container { display: block; gap: 0; }
.wp-block-navigation.menu-principal .wp-block-navigation-item,
.wp-block-navigation.menu-produits .wp-block-navigation-item { display: block; }
.wp-block-navigation.menu-principal a.wp-block-navigation-item__content { display: flex; padding: 12px 0; }
.wp-block-navigation.menu-produits a.wp-block-navigation-item__content { display: block; padding: 14px 0; }
.wp-block-navigation.menu-produits { margin-top: 24px; }

/* ---- Images : l'attribut height des blocs l'emporterait sur aspect-ratio et height:100% ---- */
.zone .wp-block-image img, .histoire .fig .wp-block-image img { height: auto; }
.carte .wp-block-image img { height: 100%; }
.carte .wp-block-image a { display: block; height: 100%; }

/* ---- Boutons : la classe est sur le conteneur, le style sur le lien ---- */
.wp-block-buttons.boutons { gap: 12px; }
.wp-block-button.bouton { display: inline-block; }

/* ---- Contact Form 7 : même grille que le formulaire de la maquette ---- */
.wpcf7-form-control-wrap { display: block; }
.formulaire-contact .champ input { display: block; }
.wpcf7-spinner { display: none; }
.formulaire-contact .wpcf7-response-output { grid-column: 1 / -1; margin: 0; padding: 10px 14px; border: 1px solid currentColor; font-size: 14px; }
.formulaire-contact .wpcf7-not-valid-tip { font-size: 13px; color: var(--magenta); margin-top: 4px; }
.formulaire-contact .accord .wpcf7-list-item { margin: 0; }
.formulaire-contact .accord label { display: flex; gap: 10px; align-items: flex-start; }
.formulaire-contact .accord .wpcf7-form-control-wrap, .formulaire-contact .accord .wpcf7-form-control { display: block; }

/* ---- 404 ---- */
.error404 .intro { min-height: 60vh; }
.error404 .intro .chapo { margin-top: 28px; }