@import url('https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@62..125,300..800&family=Bodoni+Moda:ital,opsz,wght@0,6..96,400..700;1,6..96,400..700&family=Chivo+Mono:wght@300..600&display=swap');
/* ==========================================================================
   Z Club Rhône-Alpes : CSS personnalisé Yapla, V4 « Le lacet » (magazine auto, bleus BMW)
   À coller dans : Sites web > le site > Personnalisation > Avancée > CSS personnalisé
   Source du kit (non limitée). Tant que l'ancien site existe, coller outils/zclub-custom-yapla-v2.css
   (règles du gabarit limitées à body.zc-v2, classe de la page maîtresse « Z Club V2 »).
   Assemblé le 2026-10-01 : charte globale + accueil (.zc-acc-*) + sorties (.zc-sor-*).
   ========================================================================== */
/* Trait d'union plus lisible que celui, très fin, de Bodoni : police système sur ce seul caractère */
@font-face { font-family: 'ZC Trait'; src: local('Arial'), local('ArialMT'), local('Helvetica Neue'), local('Helvetica'), local('Roboto'); unicode-range: U+002D, U+2010-2011; }

:root {
/* Plan : grille éditoriale asymétrique de magazine auto, titres serif calés à gauche, texte décalé d'un tiers, photos à fond perdu, filets et aplats bleus comme structure. */
--zc-papier: #F1F3F6;
--zc-papier-2: #E3E8EE;
--zc-encre: #0E1622;
--zc-gris: #4A5667;
--zc-trait: #C7CFD9;
--zc-bleu: #1C69D4;
--zc-nuit: #0A111C;
--zc-route: #26303D;
--zc-ciel: #DAE7F8;          /* sections teintées */
--zc-ciel-2: #ECF3FC;        /* encarts, cartes */
--zc-marine: #0B3170;        /* aplats profonds */
--zc-bleu-lumiere: #82BBFF;  /* bleu lisible sur marine et nuit */
--zc-titre: 'ZC Trait', 'Bodoni Moda', 'Bodoni 72', Didot, Georgia, serif;
--zc-texte: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
--zc-donnee: 'Chivo Mono', ui-monospace, Menlo, Consolas, monospace;
--zc-s1: 6px; --zc-s2: 12px; --zc-s3: 20px; --zc-s4: 32px; --zc-s5: 52px; --zc-s6: 84px; --zc-s7: 136px;
--zc-largeur: 1280px;
--zc-gouttiere: clamp(16px, 4.4vw, 56px);
/* Jetons dérivés */
--zc-bleu-fonce: #13509F;
--zc-trait-fort: #7A8595;   /* bordures de champs, contraste 3:1 */
--zc-trait-bleu: rgba(28, 105, 212, .3);
--zc-trait-clair: rgba(218, 231, 248, .26);
--zc-brume: #A9C3E8;        /* texte secondaire sur marine et nuit */
--zc-blanc: #FFFFFF;
--zc-voile: rgba(10, 17, 28, .32);
--zc-voile-clair: rgba(255, 255, 255, .09);
--zc-ease: cubic-bezier(.2, .7, .2, 1);
--zc-vw: calc(100vw - var(--zc-barre, 0px)); /* largeur d'écran sans la barre de défilement (--zc-barre posée par menu.js) */
--zc-bord: max(var(--zc-gouttiere), calc((var(--zc-vw) - var(--zc-largeur)) / 2 + var(--zc-gouttiere)));
--zc-decal: 0%;
/* Couleurs de contexte (papier), redéfinies par .zc-ciel, .zc-marine, .zc-nuit, .zc-aplat-bleu */
--zc-x-fond: var(--zc-papier); --zc-x-texte: var(--zc-encre); --zc-x-doux: var(--zc-gris);
--zc-x-accent: var(--zc-bleu); --zc-x-lien: var(--zc-bleu); --zc-x-filet: var(--zc-trait); --zc-x-encart: var(--zc-ciel-2);
--zc-x-plaque: var(--zc-bleu); --zc-x-plaque-txt: var(--zc-blanc);
--zc-x-btn: var(--zc-bleu); --zc-x-btn-txt: var(--zc-blanc); --zc-x-btn-survol: var(--zc-bleu-fonce); --zc-x-ligne: var(--zc-bleu-fonce);
}
@media (min-width: 992px) { :root { --zc-decal: 32%; } }

/* ---------- Contextes de couleur : poser la classe suffit ---------- */
.zc-ciel, .zc-sombre {
background: var(--zc-ciel); color: var(--zc-encre);
--zc-x-fond: var(--zc-ciel); --zc-x-accent: var(--zc-bleu-fonce); --zc-x-lien: var(--zc-bleu-fonce);
--zc-x-filet: var(--zc-trait-bleu); --zc-x-encart: var(--zc-ciel-2);
}
.zc-marine, .zc-nuit, .zc-pied {
background: var(--zc-marine); color: var(--zc-papier);
--zc-x-fond: var(--zc-marine); --zc-x-texte: var(--zc-papier); --zc-x-doux: var(--zc-brume);
--zc-x-accent: var(--zc-bleu-lumiere); --zc-x-lien: var(--zc-bleu-lumiere); --zc-x-filet: var(--zc-trait-clair); --zc-x-encart: var(--zc-voile-clair);
--zc-x-plaque: var(--zc-bleu-lumiere); --zc-x-plaque-txt: var(--zc-marine);
--zc-x-btn: var(--zc-bleu-lumiere); --zc-x-btn-txt: var(--zc-marine); --zc-x-btn-survol: var(--zc-blanc); --zc-x-ligne: var(--zc-papier);
}
.zc-nuit { background: var(--zc-nuit); --zc-x-fond: var(--zc-nuit); --zc-x-plaque-txt: var(--zc-nuit); --zc-x-btn-txt: var(--zc-nuit); }
.zc-aplat-bleu, .zc-entete__inner {
background: var(--zc-bleu); color: var(--zc-blanc);
--zc-x-fond: var(--zc-bleu); --zc-x-texte: var(--zc-blanc); --zc-x-doux: var(--zc-ciel-2);
--zc-x-accent: var(--zc-ciel); --zc-x-lien: var(--zc-blanc); --zc-x-filet: rgba(255, 255, 255, .35); --zc-x-encart: rgba(255, 255, 255, .12);
--zc-x-plaque: var(--zc-blanc); --zc-x-plaque-txt: var(--zc-bleu-fonce);
--zc-x-btn: var(--zc-blanc); --zc-x-btn-txt: var(--zc-bleu-fonce); --zc-x-btn-survol: var(--zc-ciel); --zc-x-ligne: var(--zc-blanc);
}
:is(.zc-ciel, .zc-sombre, .zc-marine, .zc-nuit, .zc-aplat-bleu, .zc-pied, .zc-entete__inner) p { color: inherit; } /* le gabarit colore chaque <p> */

/* ---------- Base ---------- */
html { scroll-behavior: smooth; scroll-padding-top: 96px; }
body {
background: var(--zc-papier); color: var(--zc-encre);
font-family: var(--zc-texte); font-size: 18px; line-height: 1.6; font-stretch: 100%;
-webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
overflow-x: clip; /* jamais hidden : casse le menu collant */
}
/* Variables du gabarit Yapla (00050), redéfinies sur body : les dérivées sont résolues sur :root */
body {
--primary: var(--zc-bleu); --secondary: var(--zc-marine); --primary-dark: var(--zc-bleu-fonce); --primary-light: var(--zc-bleu);
--primary-hover: var(--zc-bleu-fonce); --primary-linkhover: var(--zc-bleu-fonce);
--font: var(--zc-texte); --font-secondary: var(--zc-texte); --font-family: var(--zc-texte); --font-family-alt: var(--zc-texte); --g-font: 'Archivo';
--fontfamily-h1: var(--zc-titre); --fontfamily-h2: var(--zc-titre); --fontfamily-h3: var(--zc-texte); --fontfamily-h4: var(--zc-texte);
--fontfamily-h5: var(--zc-texte); --fontfamily-h6: var(--zc-texte); --fontfamily-p: var(--zc-texte); --line-title-align: left;
--font-color: var(--zc-encre); --default-link-color: var(--zc-bleu); --default-link-color-hover: var(--zc-bleu-fonce);
--desktop-topheader-background: var(--zc-papier); --tablet-topheader-background: var(--zc-papier); --mobile-topheader-background: var(--zc-papier);
--megamenu-background: var(--zc-papier); --line-menu-background: var(--zc-papier); --nav-dropdown-background: var(--zc-papier); --nav-dropdown-color: var(--zc-marine);
--navlink-color: var(--zc-marine); --navlink-color-active: var(--zc-bleu); --mobile-navlink-color: var(--zc-marine); --mobile-nav-slidein-background: var(--zc-papier);
--footer-background: var(--zc-marine); --footer-color: var(--zc-brume); --footer-hover: var(--zc-bleu-lumiere);
--theme-footer-background: var(--zc-marine); --theme-footer-color: var(--zc-brume); --theme-footer-link: var(--zc-papier); --theme-footer-hover: var(--zc-bleu-lumiere);
--banner-background-color: var(--zc-marine); --button-radius-md: 1px; --button-radius-sm: 1px; --form-field-radius: 1px;
--form-highlightcolor: var(--zc-bleu); --form-highlightcolor-hover: var(--zc-bleu-fonce); --theme-primary-background: var(--zc-bleu);
--table-link-color: var(--zc-bleu); --category-color: var(--zc-bleu); --cart-total-amount-price-color: var(--zc-marine);
--pagination-element-bg: var(--zc-bleu); --viewall-hover: var(--zc-bleu); --tag-border: 1px solid var(--zc-bleu); --thermo-color1: var(--zc-bleu);
--semantic-search-icon-color: var(--zc-bleu); --yapla-consent-primary: var(--zc-bleu); --yapla-consent-primary-alt: var(--zc-bleu-fonce);
--yapla-consent-secondary: var(--zc-marine); --yapla-consent-secondary-alt: var(--zc-bleu-fonce);
}
h1, h2, h3, h4 { color: var(--zc-x-texte); text-shadow: none; text-wrap: balance; margin: 0 0 var(--zc-s3); }
h1, h2, .zc-titre-xxl, .zc-titre-xl, .zc-titre-l {
font-family: var(--zc-titre); font-weight: 500; font-optical-sizing: auto;
text-transform: none; letter-spacing: -.015em; line-height: 1.02;
}
h1, .zc-titre-xxl { font-size: clamp(46px, 9.4vw, 148px); line-height: .94; letter-spacing: -.028em; }
.zc-titre-xl { font-size: clamp(40px, 6.6vw, 104px); line-height: .98; letter-spacing: -.022em; }
h2, .zc-titre-l { font-size: clamp(34px, 4.6vw, 66px); }
h3, h4 { font-family: var(--zc-texte); font-stretch: 110%; font-weight: 650; font-size: 21px; line-height: 1.25; letter-spacing: 0; text-transform: none; }
h1 em, h2 em, .zc-titre-xxl em, .zc-titre-xl em, .zc-titre-l em { font-style: italic; font-weight: 400; color: var(--zc-x-accent); }
p { max-width: 64ch; margin: 0 0 1em; }
a { color: var(--zc-x-lien); font-weight: inherit; text-decoration: none; transition: color .2s; }
a:hover, a:focus { color: var(--zc-x-texte); background: none; }
p a, li a, td a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .22em; }
strong, b { font-weight: 650; }
img { max-width: 100%; height: auto; }
::selection { background: var(--zc-bleu); color: var(--zc-blanc); }
:focus-visible { outline: 2px solid var(--zc-x-accent); outline-offset: 3px; }

/* ---------- Gabarit Yapla ---------- */
/* L'en-tête natif est retiré : le module Menu sur mesure porte le logo et l'espace membre */
.line.line-header { display: none; }
.line.line-menu { /* même spécificité que le gabarit */
position: sticky; top: 0; z-index: 40;
background: var(--zc-papier); border-bottom: 1px solid var(--zc-trait);
view-transition-name: zc-menu;
}
.line.line-menu .container > .row > div.zone-html { display: block; } /* masquée au-delà de 992 px par le gabarit */
.line-menu .content { padding: 0; }
.line-main { padding: 0; }
.line.site_line__item:not(.line-footer):not(.line-menu):not(.line-header):has(> .container > .row > .zone-html) { padding-top: 0; padding-bottom: 0; }
.zone-contact .content > h1:first-child { display: none; }
.line.line-footer { background: var(--zc-marine); color: var(--zc-brume); padding: 0; position: relative; }
.line-footer::before { content: none; }
.poweredBy-wrapper, .poweredBy-wrapper .poweredBy-container { background: var(--zc-marine) !important; color: var(--zc-brume); }
.poweredBy-wrapper a { color: var(--zc-brume); }

/* ---------- Boutons (contenu et natifs) ---------- */
.zc-btn, .btn-primary, button[type="submit"], input[type="submit"] {
display: inline-flex; align-items: center; justify-content: center; gap: 12px;
min-height: 50px; padding: 14px 24px; border: 1.5px solid var(--zc-x-btn); border-radius: 1px;
background: var(--zc-x-btn); color: var(--zc-x-btn-txt) !important;
font: 600 14px/1.2 var(--zc-texte); font-stretch: 112%; letter-spacing: .12em; text-transform: uppercase;
text-decoration: none !important; cursor: pointer; box-shadow: none;
transition: background .2s, color .2s, border-color .2s;
}
.zc-btn::after { content: "→"; font-family: var(--zc-donnee); font-weight: 400; transition: transform .25s var(--zc-ease); }
.zc-btn:hover::after { transform: translateX(4px); }
.zc-btn:hover, .btn-primary:hover, .btn-primary:focus, button[type="submit"]:hover, input[type="submit"]:hover { background: var(--zc-x-btn-survol); border-color: var(--zc-x-btn-survol); color: var(--zc-x-btn-txt) !important; }
.zc-btn--ligne, .zc-btn--noir, .zc-btn--blanc, .btn-default { background: transparent; border: 1.5px solid var(--zc-x-ligne); border-radius: 1px; color: var(--zc-x-ligne) !important; }
.zc-btn--ligne:hover, .zc-btn--noir:hover, .zc-btn--blanc:hover, .btn-default:hover { background: var(--zc-x-ligne); border-color: var(--zc-x-ligne); color: var(--zc-x-fond) !important; }
.zc-btn--clair { background: var(--zc-papier); border-color: var(--zc-papier); color: var(--zc-marine) !important; }
.zc-btn--clair:hover { background: var(--zc-blanc); border-color: var(--zc-blanc); color: var(--zc-marine) !important; }
.zc-actions { display: flex; flex-wrap: wrap; gap: var(--zc-s2); margin-top: var(--zc-s4); }

/* ---------- Formulaires natifs ---------- */
.form-control, input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="number"], select, textarea {
min-height: 50px; padding: 12px 14px; border: 1.5px solid var(--zc-trait-fort); border-radius: 1px;
background: var(--zc-blanc); color: var(--zc-encre); font: inherit; font-size: 17px; box-shadow: none;
}
.form-control:focus, input:focus, select:focus, textarea:focus { border-color: var(--zc-bleu); box-shadow: 0 0 0 3px rgba(28, 105, 212, .22); outline: 0; }
input[type="radio"], input[type="checkbox"] { width: 20px; height: 20px; accent-color: var(--zc-bleu); vertical-align: -4px; margin: 0 8px 0 0; }
label { font-weight: 500; }
.table { width: 100%; border-collapse: collapse; font-size: 16px; }
.table th, .table td { text-align: left; padding: 14px 16px 14px 0; border-bottom: 1px solid var(--zc-x-filet); vertical-align: top; }
.table th { font: 500 13px/1.3 var(--zc-donnee); letter-spacing: .06em; text-transform: uppercase; color: var(--zc-x-accent); border-bottom: 2px solid var(--zc-x-accent); }

/* ===== Composants partagés (préfixe zc-) ===== */
.zc-full { width: var(--zc-vw); position: relative; left: 50%; margin-left: calc(var(--zc-vw) / -2); }
.zc-module { position: relative; padding-block: var(--zc-s6); scroll-margin-top: 80px; }
.zc-section { padding-block: clamp(64px, 9vw, 136px); }
.zc-inner { max-width: var(--zc-largeur); margin-inline: auto; padding-inline: var(--zc-gouttiere); box-sizing: border-box; }
.zc-clair { background: var(--zc-papier); border-top: 1px solid var(--zc-trait); }

.zc-surtitre {
display: block; margin: 0 0 var(--zc-s3); max-width: none;
font: 600 14px/1.4 var(--zc-texte); font-stretch: 125%; letter-spacing: .2em; text-transform: uppercase;
color: var(--zc-x-accent);
}
.zc-surtitre::before, .zc-surtitre::after { content: none !important; display: none !important; }
.zc-chapo { max-width: 42ch; font-size: clamp(20px, 1.9vw, 24px); line-height: 1.45; font-weight: 400; color: var(--zc-x-texte); }
.zc-texte { max-width: 62ch; font-size: 18px; line-height: 1.65; color: var(--zc-x-texte); }
.zc-donnee, .zc-chiffre { font-family: var(--zc-donnee); font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.zc-filet { display: block; height: 0; margin: var(--zc-s5) 0; border: 0; border-top: 1px solid var(--zc-x-filet); }
.zc-filet--fort { border-top: 2px solid var(--zc-x-accent); }

/* Photo et légende */
.zc-photo { position: relative; margin: 0; }
.zc-photo::after { content: none; }
.zc-photo img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.zc-legende, .zc-photo figcaption { display: block; margin-top: var(--zc-s2); max-width: 56ch; font-size: 15px; line-height: 1.45; color: var(--zc-x-doux); }

/* Repère de virage numéroté (ordre réel seulement) : <p class="zc-virage"><b>3</b> Libellé</p> */
.zc-virage {
display: flex; align-items: center; gap: var(--zc-s2); margin: 0 0 var(--zc-s3); max-width: none;
font: 600 14px/1.2 var(--zc-texte); font-stretch: 125%; letter-spacing: .18em; text-transform: uppercase; color: var(--zc-x-texte);
}
.zc-virage > :first-child, .zc-virage[data-num]::before, .zc-etape::before, .zc-commandements li::before {
display: inline-grid; place-items: center; flex: none; min-width: 48px; height: 36px; padding: 0 9px;
border-radius: 3px; background: var(--zc-x-plaque); color: var(--zc-x-plaque-txt);
box-shadow: inset 0 0 0 2px var(--zc-x-plaque), inset 0 0 0 3.5px var(--zc-x-plaque-txt);
font: 500 17px/1 var(--zc-donnee); font-variant-numeric: tabular-nums; letter-spacing: 0; text-transform: none;
}
.zc-virage[data-num]::before { content: attr(data-num); }

/* Chiffres */
.zc-chiffres { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: var(--zc-s5); border-top: 2px solid var(--zc-x-accent); }
.zc-chiffres .zc-chiffre { padding: var(--zc-s3) var(--zc-s3) 0 0; }
.zc-chiffres .zc-chiffre + .zc-chiffre { padding-left: var(--zc-s3); border-left: 1px solid var(--zc-x-filet); }
.zc-chiffre strong { display: block; font: 300 clamp(46px, 5.6vw, 84px)/1 var(--zc-donnee); letter-spacing: -.05em; color: var(--zc-x-texte); }
.zc-chiffre span { display: block; margin-top: var(--zc-s2); font: 400 15px/1.4 var(--zc-texte); letter-spacing: 0; color: var(--zc-x-doux); }

/* ---------- Décalage éditorial des pages reprises (sections .zc-section) ---------- */
.zc-section > .zc-inner > :is(p, h3, ul:not([class]), ol:not([class]), .zc-note, .zc-actions, .zc-tablewrap) { margin-left: var(--zc-decal); }
.zc-section > .zc-inner > h2 { max-width: 18ch; }
.zc-section > .zc-inner > h3 { margin-top: var(--zc-s5); width: auto; } /* le gabarit Yapla fixe width: 100% sur les h3 : avec le décalage, débordement à droite */
.zc-section ul:not([class]) { padding-left: 1.1em; }
.zc-section ul:not([class]) li { padding: 6px 0; }
.zc-section ul:not([class]) li::marker { color: var(--zc-x-accent); }

/* ---------- En-tête des pages intérieures : photo à fond perdu, cartouche bleu ---------- */
.zc-entete {
position: relative; display: flex; align-items: flex-end; overflow: hidden;
min-height: clamp(440px, 70vh, 720px); padding: 0;
background-color: var(--zc-marine); background-size: cover; background-position: center; background-repeat: no-repeat;
}
.zc-entete::before, .zc-entete::after { content: none; }
.zc-entete__inner {
position: relative; z-index: 1; box-sizing: border-box;
width: min(100%, calc(var(--zc-bord) + 880px)); margin: 0;
padding: var(--zc-s5) var(--zc-s5) var(--zc-s5) var(--zc-bord);
}
.zc-entete h1 { margin: 0; font-size: clamp(48px, 7.4vw, 116px); }
.zc-entete p { margin: var(--zc-s3) 0 0; max-width: 44ch; font-size: clamp(19px, 1.7vw, 22px); line-height: 1.45; color: var(--zc-x-doux); }

/* ---------- Duo texte et photo, photo à fond perdu ---------- */
.zc-duo { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--zc-s6); align-items: start; }
.zc-duo--inverse { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.zc-duo--inverse > :first-child { order: 2; }
.zc-duo > .zc-photo { margin: var(--zc-s5) calc(-1 * var(--zc-bord)) 0 0; }
.zc-duo--inverse > .zc-photo { margin: var(--zc-s5) 0 0 calc(-1 * var(--zc-bord)); }
.zc-duo > .zc-photo img { aspect-ratio: 3 / 2; }
.zc-duo--inverse > .zc-photo > :is(figcaption, .zc-legende) { padding-left: var(--zc-bord); } /* légende hors du fond perdu */
.zc-duo > ul { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--zc-x-accent); }
.zc-duo > ul li { padding: var(--zc-s2) 0; border-bottom: 1px solid var(--zc-x-filet); }

/* ---------- Calendrier ---------- */
.zc-calendrier { list-style: none; padding: 0; margin: var(--zc-s5) 0 0; border-top: 2px solid var(--zc-x-accent); }
.zc-calendrier li { display: grid; grid-template-columns: minmax(140px, 220px) minmax(0, 1fr) auto; gap: var(--zc-s4); align-items: baseline; padding: var(--zc-s3) 0; border-bottom: 1px solid var(--zc-x-filet); }
.zc-date { font: 400 16px/1.3 var(--zc-donnee); font-variant-numeric: tabular-nums; letter-spacing: .02em; color: var(--zc-x-accent); }
.zc-lieu { font: 500 clamp(22px, 2.4vw, 32px)/1.15 var(--zc-titre); color: var(--zc-x-texte); }
.zc-badge { padding: 7px 10px; border: 1px solid var(--zc-x-filet); font: 500 13px/1 var(--zc-donnee); letter-spacing: .06em; text-transform: uppercase; color: var(--zc-x-doux); white-space: nowrap; }
.zc-badge--avenir { background: var(--zc-x-btn); border-color: var(--zc-x-btn); color: var(--zc-x-btn-txt); }

/* ---------- Bureau (ours de magazine) ---------- */
.zc-equipe { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--zc-s4); margin-top: var(--zc-s5); border-top: 2px solid var(--zc-x-accent); }
.zc-membre { padding: var(--zc-s3) 0 var(--zc-s4); border-bottom: 1px solid var(--zc-x-filet); }
.zc-membre span { display: block; margin-bottom: var(--zc-s1); font: 600 13px/1.3 var(--zc-texte); font-stretch: 125%; letter-spacing: .18em; text-transform: uppercase; color: var(--zc-x-accent); }
.zc-membre strong { display: block; font: 500 clamp(22px, 2vw, 28px)/1.15 var(--zc-titre); }

/* ---------- Z Commandements et étapes : repères de virage ---------- */
.zc-commandements { counter-reset: zc; list-style: none; padding: 0; margin: var(--zc-s5) 0 0; display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--zc-s6); }
.zc-commandements li { counter-increment: zc; display: flex; align-items: center; gap: var(--zc-s3); padding: var(--zc-s3) 0; border-top: 1px solid var(--zc-x-filet); font-size: 18px; }
.zc-commandements li::before { content: counter(zc); }
.zc-etapes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: var(--zc-s5); counter-reset: etape; border-top: 2px solid var(--zc-x-accent); }
.zc-etape { counter-increment: etape; padding: var(--zc-s4) var(--zc-s4) 0 0; }
.zc-etape::before { content: counter(etape); margin-bottom: var(--zc-s3); }
.zc-etape::after { content: none; }
.zc-etape h3 { margin: 0 0 var(--zc-s2); }

/* ---------- Colonnes (ex-cartes) : le filet remplace la boîte ---------- */
.zc-cartes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zc-s4); margin-top: var(--zc-s5); }
.zc-carte { position: relative; padding: var(--zc-s3) 0 0; border: 0; border-top: 2px solid var(--zc-x-accent); background: none; box-shadow: none; }
.zc-carte::before { content: none; }
.zc-carte h3 { margin: 0 0 var(--zc-s2); }
.zc-carte p:last-child { margin-bottom: 0; }
.zc-carte a { font-weight: 600; }
.zc-carte__num { display: block; margin-bottom: var(--zc-s3); font: 400 15px/1 var(--zc-donnee); color: var(--zc-x-accent); }

/* ---------- Tarifs ---------- */
.zc-tarifs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zc-s4); margin-top: var(--zc-s5); }
.zc-tarif { padding: var(--zc-s4) 0 0; border-top: 1px solid var(--zc-x-filet); background: none; }
.zc-tarif--vedette { padding: var(--zc-s4) var(--zc-s4) var(--zc-s3); border-top: 3px solid var(--zc-bleu); background: var(--zc-ciel); }
.zc-tarif h3 { margin: 0; font: 600 14px/1.2 var(--zc-texte); font-stretch: 125%; letter-spacing: .2em; text-transform: uppercase; color: var(--zc-x-accent); }
.zc-tarif--vedette h3 { color: var(--zc-bleu-fonce); }
.zc-prix { margin: var(--zc-s3) 0 var(--zc-s2); font: 300 clamp(56px, 6vw, 92px)/1 var(--zc-donnee); font-variant-numeric: tabular-nums; letter-spacing: -.06em; color: var(--zc-x-texte); }
.zc-prix small { font: 400 16px var(--zc-texte); letter-spacing: 0; color: var(--zc-x-doux); }

/* ---------- Galerie : planche contact horizontale ---------- */
.zc-galerie {
display: grid; grid-auto-flow: column; grid-auto-columns: min(80vw, 520px); align-items: start; gap: var(--zc-s4);
overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--zc-bord);
margin-top: var(--zc-s5); padding: 0 var(--zc-bord) var(--zc-s3);
scrollbar-width: thin; scrollbar-color: var(--zc-bleu) transparent;
}
.zc-galerie figure { margin: 0; scroll-snap-align: start; }
.zc-galerie img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.zc-galerie figure:nth-child(even) img { aspect-ratio: 4 / 5; }
.zc-galerie figcaption { margin-top: var(--zc-s2); font-size: 15px; color: var(--zc-x-doux); }

/* ---------- Encadré et mention ---------- */
.zc-note { max-width: 62ch; margin: var(--zc-s4) 0 0; padding: var(--zc-s3) var(--zc-s4); border: 0; border-left: 3px solid var(--zc-x-accent); background: var(--zc-x-encart); font-size: 17px; }
.zc-mention { max-width: none; margin: var(--zc-s4) 0 0; padding-top: var(--zc-s3); border-top: 1px solid var(--zc-x-filet); font-size: 15px; color: var(--zc-x-doux); }

/* ===== Menu sur mesure et méga-menu (module Contenu personnalisé, ligne Menu) ===== */
.zc-nav { position: relative; width: var(--zc-vw); left: 50%; margin-left: calc(var(--zc-vw) / -2); font-family: var(--zc-texte); }
.zc-nav__barre {
position: relative; z-index: 2; display: flex; align-items: center; gap: var(--zc-s3);
max-width: var(--zc-largeur); min-height: 84px; margin: 0 auto; padding-inline: var(--zc-gouttiere); box-sizing: border-box;
background: var(--zc-papier); box-shadow: 0 0 0 100vmax var(--zc-papier); clip-path: inset(0 -100vmax); /* fond pleine largeur au-dessus du voile */
transition: min-height .35s var(--zc-ease);
}
.zc-nav__logo { display: flex; align-items: center; gap: var(--zc-s2); margin-right: auto; color: var(--zc-marine) !important; text-decoration: none !important; }
.zc-nav__logo img { width: 52px; height: 52px; border-radius: 50%; transition: width .35s var(--zc-ease), height .35s var(--zc-ease); }
.zc-nav__logo span { font: 500 23px/1 var(--zc-titre); letter-spacing: -.01em; white-space: nowrap; }
.zc-nav__liste { display: flex; list-style: none; margin: 0; padding: 0; }
.zc-nav__ouvrir {
position: relative; appearance: none; background: none; border: 0; min-height: 48px; padding: 0 14px; cursor: pointer;
font: 600 15px/1 var(--zc-texte); font-stretch: 110%; letter-spacing: .04em; color: var(--zc-marine);
}
.zc-nav__ouvrir::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 6px; height: 2px; background: var(--zc-bleu); transform: scaleX(0); transform-origin: left; transition: transform .3s var(--zc-ease); }
.zc-nav__ouvrir:hover::after, .zc-nav__ouvrir[aria-expanded="true"]::after { transform: scaleX(1); }
.zc-nav__ouvrir.zc-actif { color: var(--zc-bleu); }
.zc-nav__ouvrir.zc-actif::after { height: 3px; transform: scaleX(1); }
.zc-nav__membre, .zc-nav__burger {
display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 16px; margin-left: var(--zc-s2);
border: 1.5px solid var(--zc-bleu); border-radius: 1px; background: none; cursor: pointer;
font: 600 13px/1 var(--zc-texte); font-stretch: 112%; letter-spacing: .12em; text-transform: uppercase;
color: var(--zc-bleu-fonce) !important; text-decoration: none !important; white-space: nowrap;
}
.zc-nav__membre:hover { background: var(--zc-bleu); color: var(--zc-blanc) !important; }
.zc-nav__burger { display: none; }
.zc-nav__burger::before { content: ""; width: 18px; height: 12px; background: linear-gradient(currentColor 0 0) top / 100% 2px no-repeat, linear-gradient(currentColor 0 0) center / 100% 2px no-repeat, linear-gradient(currentColor 0 0) bottom / 100% 2px no-repeat; }
.zc-nav__burger[aria-expanded="true"]::before { background: linear-gradient(45deg, transparent 45%, currentColor 45% 55%, transparent 55%), linear-gradient(-45deg, transparent 45%, currentColor 45% 55%, transparent 55%); height: 18px; }
.zc-nav.zc-compact .zc-nav__barre { min-height: 62px; }
.zc-nav.zc-compact .zc-nav__logo img { width: 38px; height: 38px; }

/* Panneau */
.zc-mega {
position: absolute; top: 100%; left: 0; right: 0; z-index: 1;
max-height: calc(100dvh - 84px); overflow-y: auto; overscroll-behavior: contain;
background: var(--zc-papier); border-top: 1px solid var(--zc-trait); border-bottom: 3px solid var(--zc-bleu);
visibility: hidden; clip-path: inset(0 0 100% 0);
transition: clip-path .42s var(--zc-ease), visibility 0s linear .42s;
}
.zc-nav[data-zc-ouvert] .zc-mega { visibility: visible; clip-path: inset(0 0 0 0); transition: clip-path .48s var(--zc-ease); }
.zc-nav[data-zc-ouvert]::after { content: ""; position: fixed; inset: 0; z-index: 0; background: var(--zc-voile); pointer-events: none; }
.zc-mega__grille {
display: grid; grid-template-columns: minmax(0, 1.25fr) repeat(4, minmax(0, 1fr)); gap: var(--zc-s4);
max-width: var(--zc-largeur); margin: 0 auto; padding: var(--zc-s5) var(--zc-gouttiere); box-sizing: border-box;
}
.zc-mega__col { transform: translateY(-14px); transition: transform .5s var(--zc-ease); }
.zc-nav[data-zc-ouvert] .zc-mega__col { transform: none; }
.zc-nav[data-zc-ouvert] .zc-mega__col:nth-child(3) { transition-delay: .04s; }
.zc-nav[data-zc-ouvert] .zc-mega__col:nth-child(4) { transition-delay: .08s; }
.zc-nav[data-zc-ouvert] .zc-mega__col:nth-child(5) { transition-delay: .12s; }
.zc-mega__titre {
display: flex; align-items: flex-end; min-height: 2.6em; width: 100%; margin: 0 0 var(--zc-s2); padding: 0; appearance: none; background: none; border: 0; text-align: left; pointer-events: none;
font: 600 13px/1.3 var(--zc-texte); font-stretch: 125%; letter-spacing: .2em; text-transform: uppercase; color: var(--zc-bleu);
}
.zc-mega__col.zc-cible .zc-mega__titre { color: var(--zc-bleu-fonce); text-decoration: underline 2px; text-underline-offset: 6px; }
.zc-mega__liens { list-style: none; margin: 0; padding: 0; }
.zc-mega__liens a { display: block; padding: var(--zc-s2) 0; border-top: 1px solid var(--zc-trait-bleu); color: var(--zc-marine); text-decoration: none; font: 500 clamp(22px, 1.75vw, 26px)/1.12 var(--zc-titre); }
.zc-mega__liens small { display: block; margin-top: 5px; font: 400 15px/1.4 var(--zc-texte); color: var(--zc-gris); }
.zc-mega__liens a:hover, .zc-mega__liens a[aria-current="page"], .zc-mega__carte:hover strong { color: var(--zc-bleu); font-style: italic; }
.zc-mega__carte { display: block; margin-top: var(--zc-s3); padding: var(--zc-s2) var(--zc-s2) var(--zc-s3); background: var(--zc-ciel); color: var(--zc-marine) !important; text-decoration: none !important; }
.zc-mega__carte img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; margin-bottom: var(--zc-s2); }
.zc-mega__carte span { display: block; font: 400 14px/1.3 var(--zc-donnee); color: var(--zc-bleu-fonce); }
.zc-mega__carte strong { display: block; margin: 4px 0 2px; font: 500 22px/1.15 var(--zc-titre); transition: color .2s; }
.zc-mega__carte small { font-size: 15px; color: var(--zc-gris); }
.zc-mega__photo { position: relative; margin: 0; }
.zc-mega__photo img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; }
.zc-mega__photo .zc-mega__calque { position: absolute; top: 0; left: 0; }
.zc-mega__pied { display: none; }

@media (max-width: 1199px) {
.zc-mega__grille { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.zc-mega__photo { display: none; }
.zc-nav__logo span { font-size: 20px; }
.zc-nav__ouvrir { padding: 0 10px; }
}
/* Mobile : accordéon plein écran */
@media (max-width: 991px) {
.zc-nav__liste, .zc-nav__barre > .zc-nav__membre { display: none; }
.zc-nav__burger { display: inline-flex; }
.zc-nav__barre, .zc-nav.zc-compact .zc-nav__barre { min-height: 64px; }
.zc-nav__logo img, .zc-nav.zc-compact .zc-nav__logo img { width: 40px; height: 40px; }
.zc-mega { position: fixed; top: 64px; bottom: 0; max-height: none; border: 0; }
.zc-nav[data-zc-ouvert]::after { content: none; }
.zc-mega__grille { display: block; padding: var(--zc-s2) var(--zc-gouttiere) var(--zc-s5); }
.zc-mega__col { border-bottom: 1px solid var(--zc-trait-bleu); transform: none; }
.zc-mega__titre {
display: flex; justify-content: space-between; align-items: center; min-height: 72px; margin: 0; pointer-events: auto; cursor: pointer;
font: 500 32px/1.1 var(--zc-titre); letter-spacing: -.01em; text-transform: none; color: var(--zc-marine);
}
.zc-mega__titre[aria-expanded="true"] { color: var(--zc-bleu); font-style: italic; }
.zc-mega__titre::after { content: "+"; font: 300 30px/1 var(--zc-donnee); font-style: normal; color: var(--zc-bleu); transition: transform .3s var(--zc-ease); }
.zc-mega__titre[aria-expanded="true"]::after { transform: rotate(45deg); }
.zc-mega__titre[aria-expanded="false"] + .zc-mega__corps { display: none; }
.zc-mega__corps { padding-bottom: var(--zc-s3); }
.zc-mega__liens a { font-size: 22px; }
.zc-mega__carte { display: grid; grid-template-columns: 112px 1fr; column-gap: var(--zc-s3); align-items: start; }
.zc-mega__carte img { grid-row: span 3; margin: 0; }
.zc-mega__pied { display: flex; flex-wrap: wrap; gap: var(--zc-s2); padding-top: var(--zc-s4); }
.zc-mega__pied a { flex: 1 1 160px; }
.zc-mega__pied .zc-nav__membre { margin: 0; justify-content: center; min-height: 50px; }
}
@media (max-width: 479px) {
.zc-nav__barre { gap: var(--zc-s2); }
.zc-nav__logo { gap: 8px; }
.zc-nav__logo span { font-size: 18px; }
.zc-nav__burger { padding: 0 12px; gap: 8px; margin-left: 0; }
.zc-pied__cols > :nth-child(3) { grid-column: 1 / -1; grid-row: 3; } /* l'adresse e-mail garde sa ligne */
}
html.zc-verrou { overflow: hidden; }

/* ---------- Pied de page : aplat marine ---------- */
.zc-pied { padding: var(--zc-s7) 0 var(--zc-s4); color: var(--zc-brume); }
.zc-pied a { color: var(--zc-papier); text-decoration: none; }
.zc-pied a:hover { color: var(--zc-bleu-lumiere); text-decoration: underline; text-underline-offset: .22em; }
.zc-pied__haut { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--zc-s5); align-items: end; padding-bottom: var(--zc-s5); border-bottom: 1px solid var(--zc-x-filet); }
.zc-pied__marque { margin: 0; max-width: none; font: 500 clamp(52px, 8.6vw, 136px)/.9 var(--zc-titre); letter-spacing: -.035em; color: var(--zc-papier) !important; }
.zc-pied__marque em { font-style: italic; font-weight: 400; color: var(--zc-bleu-lumiere); }
.zc-pied__haut p:not(.zc-pied__marque) { font-size: 19px; line-height: 1.5; color: var(--zc-ciel); }
.zc-pied__haut .zc-btn { margin-top: var(--zc-s2); }
.zc-pied__cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--zc-s4); padding-top: var(--zc-s4); }
.zc-pied__titre { margin: 0 0 var(--zc-s2); font: 600 13px/1.3 var(--zc-texte); font-stretch: 125%; letter-spacing: .2em; text-transform: uppercase; color: var(--zc-bleu-lumiere); }
.zc-pied ul { list-style: none; margin: 0; padding: 0; }
.zc-pied li { padding: 5px 0; font-size: 17px; overflow-wrap: anywhere; }

/* ---------- Mouvement : discret, jamais d'état invisible au repos ---------- */
@media (prefers-reduced-motion: no-preference) {
@supports (animation-timeline: view()) {
.zc-reveal { animation: zc-monte linear both; animation-timeline: view(); animation-range: entry 0% cover 24%; }
}
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: zc-vt-sort .22s var(--zc-ease) both; }
::view-transition-new(root) { animation: zc-vt-entre .3s var(--zc-ease) both; }
}
@keyframes zc-monte { from { transform: translateY(28px); } to { transform: none; } }
@keyframes zc-vt-sort { to { opacity: 0; } }
@keyframes zc-vt-entre { from { opacity: 0; transform: translateY(12px); } }
@media (prefers-reduced-motion: reduce) {
html { scroll-behavior: auto; }
.zc-mega, .zc-mega__col, .zc-nav__barre, .zc-nav__logo img, .zc-nav__ouvrir::after { transition: none !important; }
}

/* ---------- Tablette et mobile ---------- */
@media (max-width: 991px) {
.zc-etapes, .zc-chiffres { grid-template-columns: 1fr 1fr; row-gap: var(--zc-s4); }
.zc-chiffres .zc-chiffre:nth-child(odd) { padding-left: 0; border-left: 0; }
.zc-duo { gap: var(--zc-s5); }
.zc-pied__cols { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 767px) {
body { font-size: 17px; }
.zc-texte { font-size: 17px; }
h3, h4 { font-size: 20px; }
.zc-duo, .zc-duo--inverse, .zc-cartes, .zc-tarifs, .zc-equipe, .zc-commandements, .zc-etapes, .zc-pied__haut { grid-template-columns: minmax(0, 1fr); }
.zc-duo--inverse > :first-child { order: 0; }
.zc-duo > .zc-photo, .zc-duo--inverse > .zc-photo { margin: 0 calc(-1 * var(--zc-gouttiere)); }
.zc-duo > .zc-photo > :is(figcaption, .zc-legende) { padding-inline: var(--zc-gouttiere); }
.zc-etape { padding-right: 0; }
.zc-entete { min-height: 0; padding-top: min(66vw, 360px); }
.zc-entete__inner { width: 100%; padding: var(--zc-s4) var(--zc-gouttiere); }
.zc-calendrier li { grid-template-columns: minmax(0, 1fr) auto; gap: var(--zc-s1) var(--zc-s2); }
.zc-calendrier .zc-date { grid-column: 1 / -1; }
.zc-pied { padding-top: var(--zc-s6); }
}


.zc-tablewrap { overflow-x: auto; } /* tableau de la page Confidentialité */

/* ===== Accueil (.zc-acc-*) ===== */
/* Z Club V4 · Accueil « Le lacet » (agent B). Préfixe .zc-acc-, jetons du contrat uniquement.
   À coller à la fin du CSS personnalisé, après css/zclub-v4.css. *//* ---------- Modules de l'accueil : calque du tracé sous le contenu ---------- *//* Teinte par fond : pavés, tracé et Z4 restent lisibles sur papier, ciel, marine et aplat bleu */
.zc-acc-module { position: relative; isolation: isolate; --zc-acc-fond: var(--zc-papier); --zc-acc-route: var(--zc-bleu); --zc-acc-pointille: var(--zc-bleu); --zc-acc-auto: var(--zc-bleu); --zc-acc-auto-trait: var(--zc-marine); }
.zc-acc-module.zc-ciel { --zc-acc-fond: var(--zc-ciel); --zc-acc-route: var(--zc-marine); }
.zc-acc-module.zc-marine { --zc-acc-fond: var(--zc-marine); --zc-acc-route: var(--zc-bleu-lumiere); --zc-acc-pointille: var(--zc-bleu-lumiere); --zc-acc-auto: var(--zc-bleu-lumiere); --zc-acc-auto-trait: var(--zc-blanc); }
.zc-acc-module.zc-aplat-bleu { --zc-acc-fond: var(--zc-bleu); --zc-acc-route: var(--zc-ciel); --zc-acc-pointille: var(--zc-ciel); --zc-acc-auto: var(--zc-blanc); --zc-acc-auto-trait: var(--zc-marine); }
.zc-acc-module > :not(.zc-acc-troncon) { position: relative; z-index: 1; }
.zc-acc-troncon { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }/* Repli sans JavaScript : un fil pointillé sur le côté */
.zc-acc-troncon::before { content: ""; position: absolute; top: 0; bottom: 0; left: max(9px, calc(var(--zc-bord) - 44px)); border-left: 2px dotted var(--zc-acc-pointille); }
.zc-acc-hero .zc-acc-troncon::before, .zc-acc-troncon.is-pret::before { content: none; }
.zc-acc-trace { position: absolute; top: 0; left: 0; overflow: hidden; }
.zc-acc-trace__fond { fill: none; stroke: var(--zc-acc-pointille); stroke-width: 2; stroke-dasharray: .1 9; stroke-linecap: round; opacity: .6; }
.zc-acc-trace__route { fill: none; stroke: var(--zc-acc-route); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }/* La Z4 vue de dessus */
.zc-acc-z4__caisse { fill: var(--zc-acc-auto); stroke: var(--zc-acc-auto-trait); stroke-width: 1.5; stroke-linejoin: round; }
.zc-acc-z4__roue, .zc-acc-z4__vitre, .zc-acc-z4__habitacle { fill: var(--zc-marine); }
.zc-acc-z4__siege { fill: var(--zc-bleu-lumiere); }
.zc-acc-z4__ligne { fill: none; stroke: var(--zc-papier); stroke-width: 1.2; stroke-linecap: round; opacity: .55; }/* Défonce : les blocs de texte masquent le tracé qui passe dessous */
.zc-acc-pave { background: var(--zc-acc-fond); box-shadow: 0 0 0 16px var(--zc-acc-fond); }/* Ouverture de section : repère de virage, la route traverse la ligne */
.zc-acc-ouverture { display: flex; align-items: center; min-height: 56px; margin: 0 0 var(--zc-s5); }
.zc-acc-ouverture .zc-virage { margin: 0; padding-right: var(--zc-s3); background: var(--zc-acc-fond); }/* ---------- 1. Hero ---------- */
.zc-acc-hero { padding-block: 0; }
.zc-acc-hero__scene { position: relative; }
.zc-acc-hero__toile, .zc-acc-hero__indice { display: none; }
.zc-acc-hero__grille { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: var(--zc-s5); align-items: center; min-height: min(900px, calc(100svh - 80px)); padding-block: var(--zc-s5) var(--zc-s6); }
.zc-acc-hero__titre { font-size: clamp(46px, 6.8vw, 112px); margin-bottom: var(--zc-s4); }
.zc-acc-hero .zc-chapo { max-width: 34ch; }
.zc-acc-hero__plan { margin: 0; }
.zc-acc-hero__plan .zc-legende { max-width: 52%; margin-left: 0; }/* Illustration SVG (mobile, mouvement réduit, sans JS) */
.zc-acc-lacet { display: block; width: 100%; height: auto; overflow: visible; }
.zc-acc-lacet__dessus { fill: var(--zc-blanc); stroke: var(--zc-bleu-lumiere); stroke-width: 1; }
.zc-acc-lacet__face { fill: var(--zc-bleu-lumiere); stroke: var(--zc-bleu-lumiere); stroke-width: 1; }
.zc-acc-lacet__courbe { fill: none; stroke: var(--zc-ciel); stroke-width: 1; }
.zc-acc-lacet__courbe--maitresse { stroke: var(--zc-bleu-lumiere); stroke-width: 1.1; }
.zc-acc-lacet__bord { fill: var(--zc-blanc); }
.zc-acc-lacet__route { fill: var(--zc-marine); }
.zc-acc-lacet__axe { fill: none; stroke: var(--zc-blanc); stroke-width: 1; stroke-dasharray: 4 6; }
.zc-acc-lacet__sortie { fill: none; stroke: var(--zc-acc-route); stroke-width: 3; }
@media (prefers-reduced-motion: no-preference) {
  .zc-acc-lacet__dessin { stroke-dasharray: 1 1; animation: zc-acc-dessin 2.4s var(--zc-ease) .2s both; }
}
@keyframes zc-acc-dessin { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }/* Hero 3D (ordinateur) : section épinglée, la caméra descend le col au défilement */
.zc-acc-hero.is-3d .zc-acc-hero__piste { height: 210vh; }
.zc-acc-hero.is-3d .zc-acc-hero__scene { position: sticky; top: var(--zc-acc-menu, 0px); height: calc(100vh - var(--zc-acc-menu, 0px)); overflow: clip; }
.zc-acc-hero.is-3d .zc-acc-hero__toile { display: block; position: absolute; inset: 0; z-index: 0; }
.zc-acc-hero__toile canvas { display: block; width: 100%; height: 100%; }
.zc-acc-hero.is-3d .zc-acc-hero__scene::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, var(--zc-acc-fond) 0, var(--zc-acc-fond) 30%, transparent 58%); }
.zc-acc-hero.is-3d .zc-acc-hero__grille { position: relative; z-index: 2; height: 100%; min-height: 0; padding-block: var(--zc-s4); grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); }
.zc-acc-hero.is-3d .zc-acc-hero__titre { font-size: clamp(44px, min(5.4vw, 10vh), 92px); margin-bottom: min(var(--zc-s4), 3vh); }
.zc-acc-hero.is-3d .zc-chapo { font-size: clamp(18px, 2.6vh, 23px); }
.zc-acc-hero.is-3d .zc-actions { margin-top: min(var(--zc-s4), 3vh); }
.zc-acc-hero.is-3d .zc-acc-pave { background: none; box-shadow: none; }
.zc-acc-hero.is-3d .zc-btn--ligne { background: var(--zc-acc-fond); }
.zc-acc-hero.is-3d .zc-acc-hero__plan { visibility: hidden; }
@media (max-width: 1279px) {
  .zc-acc-hero.is-3d .zc-acc-hero__grille { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); }
  .zc-acc-hero.is-3d .zc-acc-hero__scene::before { background: linear-gradient(90deg, var(--zc-acc-fond) 0, var(--zc-acc-fond) 42%, transparent 70%); }
}
.zc-acc-hero.is-3d .zc-acc-hero__indice { display: block; position: absolute; z-index: 2; right: var(--zc-bord); bottom: var(--zc-s4); max-width: 32ch; margin: 0; padding: 6px 10px; background: var(--zc-acc-fond); text-align: right; font: 400 14px/1.45 var(--zc-donnee); color: var(--zc-marine); }/* ---------- 2. Le club ---------- */
.zc-acc-club__duo { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--zc-s6); align-items: center; }
.zc-acc-club__duo .zc-titre-xl { max-width: 11ch; }
.zc-acc-portrait img { aspect-ratio: 3 / 4; }
.zc-acc-club .zc-chiffres { margin-top: var(--zc-s6); }
@media (min-width: 768px) { .zc-acc-club .zc-chiffres { grid-template-columns: repeat(3, minmax(0, 1fr)); } }/* ---------- 3. Les Z ---------- */
.zc-acc-z__grille { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--zc-s6); align-items: start; }
.zc-acc-modeles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--zc-s5); border-top: 2px solid var(--zc-bleu-lumiere); }
.zc-acc-modeles li { padding: var(--zc-s4) 0; border-bottom: 1px solid var(--zc-bleu); box-shadow: none; }
.zc-acc-modeles p { margin: 0; font-size: 17px; }
.zc-acc-modeles .zc-acc-modele__nom { font: 500 clamp(44px, 4.6vw, 70px)/1 var(--zc-titre); letter-spacing: -.02em; color: var(--zc-blanc); }
.zc-acc-modeles .zc-acc-modele__annees { margin: var(--zc-s1) 0 var(--zc-s2); font: 400 15px/1.3 var(--zc-donnee); letter-spacing: .02em; color: var(--zc-bleu-lumiere); }/* ---------- 4. Au programme ---------- */
.zc-acc-programme__grille { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: var(--zc-s6); align-items: start; }
.zc-acc-programme__photo { margin-left: calc(-1 * var(--zc-bord)); }
.zc-acc-activites { display: grid; gap: var(--zc-s4); margin-top: var(--zc-s4); }
.zc-acc-activites .zc-carte p { font-size: 17px; }
.zc-acc-destinations { margin-top: var(--zc-s6); padding-top: var(--zc-s3); border-top: 1px solid var(--zc-bleu); }
.zc-acc-destinations__liste { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; font: 400 clamp(28px, 3.6vw, 54px)/1.2 var(--zc-titre); letter-spacing: -.01em; color: var(--zc-marine); }
.zc-acc-destinations__liste li:not(:last-child)::after { content: "·"; margin: 0 .32em; color: var(--zc-bleu); }/* ---------- 5. Bandeau photo et devise ---------- */
.zc-acc-bandeau { padding-block: 0 var(--zc-s6); }
.zc-acc-bandeau__photo { margin: 0; }
.zc-acc-bandeau__photo img { display: block; width: 100%; height: auto; max-height: 82vh; aspect-ratio: 1920 / 860; object-fit: cover; }
.zc-acc-citation { position: relative; width: fit-content; max-width: 100%; margin: calc(-1 * var(--zc-s6)) 0 0; padding: var(--zc-s4) var(--zc-s5) 0 0; border: 0; background: var(--zc-papier); }
.zc-acc-citation p { margin: 0; max-width: none; font: 500 clamp(40px, 6.4vw, 104px)/.98 var(--zc-titre); letter-spacing: -.025em; color: var(--zc-marine); }
.zc-acc-citation em { font-weight: 400; color: var(--zc-bleu); }/* ---------- 6. Ouverture des sorties et module natif simulé ---------- */
.zc-acc-sorties { padding-bottom: var(--zc-s4); }
.zc-acc-sorties__tete { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--zc-s4); }
.zc-acc-sorties__tete .zc-chapo { margin: 0; }
.zc-acc-evts { padding-top: var(--zc-s4); }
.zc-acc-exemple { display: inline-block; margin: 0 0 var(--zc-s3); padding: 4px 10px; border: 1px dashed var(--zc-trait-fort); background: var(--zc-papier); font: 400 13px/1.4 var(--zc-donnee); color: var(--zc-gris); }
.zc-acc-evts__liste { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--zc-s4); }
.zc-acc-evt { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); background: var(--zc-blanc); border-top: 3px solid var(--zc-bleu); }
.zc-acc-evt img { display: block; width: 100%; height: 100%; min-height: 220px; object-fit: cover; }
.zc-acc-evt__corps { padding: var(--zc-s4); }
.zc-acc-evt__corps p { font-size: 17px; }
.zc-acc-evt__date { margin: 0 0 var(--zc-s2); font: 400 15px/1.3 var(--zc-donnee) !important; letter-spacing: .02em; color: var(--zc-bleu); }
.zc-acc-evt__tarif { color: var(--zc-gris); }/* ---------- 7. Adhésion ---------- */
.zc-acc-adhesion__grille { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: var(--zc-s6); align-items: center; }
.zc-acc-adhesion .zc-photo { margin-right: calc(-1 * var(--zc-bord)); }

/* ---------- Tablette et mobile ---------- */
@media (max-width: 991px) {
  .zc-acc-hero__grille, .zc-acc-club__duo, .zc-acc-z__grille, .zc-acc-programme__grille, .zc-acc-adhesion__grille, .zc-acc-evts__liste { grid-template-columns: minmax(0, 1fr); }
  .zc-acc-hero__grille { min-height: 0; gap: var(--zc-s4); padding-block: var(--zc-s5); }
  .zc-acc-hero__plan { max-width: 640px; }
  .zc-acc-portrait { max-width: 460px; }
  .zc-acc-programme__photo { margin-right: calc(-1 * var(--zc-bord)); }
  .zc-acc-adhesion .zc-photo { margin-left: calc(-1 * var(--zc-bord)); }
}
@media (max-width: 767px) {/* place pour le fil du tracé dans la marge gauche */
  .zc-acc-module .zc-inner { padding-left: calc(var(--zc-gouttiere) + 14px); }
  .zc-acc-troncon::before { left: 9px; }
  .zc-acc-pave { box-shadow: 0 0 0 8px var(--zc-acc-fond); }
  .zc-acc-bandeau__photo img { aspect-ratio: 4 / 3; }
  .zc-acc-modeles { grid-template-columns: minmax(0, 1fr); }
  .zc-acc-citation { margin-top: calc(-1 * var(--zc-s5)); padding-right: var(--zc-s3); }
  .zc-acc-evt { grid-template-columns: minmax(0, 1fr); }
  .zc-acc-evt img { min-height: 0; height: auto; aspect-ratio: 16 / 9; }
  .zc-acc-evt__corps { padding: var(--zc-s3); }
  .zc-acc-ouverture { margin-bottom: var(--zc-s4); }
}/* Montage (agent A) : légendes des photos à fond perdu ramenées dans la colonne de texte */
.zc-acc-programme__photo > .zc-legende { padding-inline: var(--zc-bord); }
@media (max-width: 991px) { .zc-acc-adhesion .zc-photo > .zc-legende { padding-inline: var(--zc-bord); } }


/* ===== Sorties (.zc-sor-*) ===== */
/* Z Club V4 · Sorties. Classes .zc-sor-*, jetons --zc-* seulement. À coller après zclub-v4.css.
   Fonds : ouverture papier, À la une .zc-ciel, natif papier, calendrier .zc-marine, déroulement .zc-ciel, invités papier, adhésion .zc-aplat-bleu */

.zc-sor-une__date,.zc-sor-fiche dd,.zc-sor-une__compte b,.zc-sor-an,.zc-sor-route__date,.zc-sor-adh__prix .zc-chiffre,.zc-sor-tableau td{font-family:var(--zc-donnee);font-variant-numeric:tabular-nums}
.zc-sor-route__lieu,.zc-sor-jour h3,.zc-sor-check h3{font-family:var(--zc-titre);font-weight:400;line-height:1.15}
.zc-sor-sommaire__titre,.zc-sor-suite,.zc-sor-tableau caption{font-family:var(--zc-titre);font-style:italic;font-size:20px;color:var(--zc-bleu-fonce)}
.zc-sor-fiche dt,.zc-sor-statut,.zc-sor-tableau thead th{font-style:normal;font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--zc-bleu-fonce)}/* 1. Ouverture (papier) */
.zc-sor-ouv,.zc-sor-qui{background:var(--zc-papier)}
.zc-sor-ouv,.zc-sor-une,.zc-sor-jour,.zc-sor-qui{overflow-x:clip}
.zc-sor-ouv{padding-block:var(--zc-s6) var(--zc-s5)}
.zc-sor-ouv__tete{display:grid;grid-template-columns:7fr 5fr;column-gap:var(--zc-s5);align-items:end}
.zc-sor-ouv__tete>.zc-surtitre{grid-column:1/-1;margin:0 0 var(--zc-s2)}
.zc-sor-ouv h1{margin:0;line-height:.88}
.zc-sor-ouv h1::after{content:"";display:inline-block;width:.34em;height:.5em;margin-left:.12em;background:var(--zc-bleu);-webkit-mask:var(--zc-sor-lacet) center/contain no-repeat;mask:var(--zc-sor-lacet) center/contain no-repeat;
--zc-sor-lacet:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 60'%3E%3Cpath d='M4 56h30L6 32h28L6 4h30' fill='none' stroke='%23000' stroke-width='4' stroke-linejoin='round'/%3E%3C/svg%3E")}
.zc-sor-ouv__chapo{border-left:2px solid var(--zc-bleu);padding-left:var(--zc-s4)}
.zc-sor-ouv .zc-sor-ouv__photo{margin:var(--zc-s5) 0 0 max(var(--zc-gouttiere),calc((100% - var(--zc-largeur))/2 + var(--zc-gouttiere)));overflow:clip}
.zc-sor-ouv__photo img{height:clamp(300px,64vh,720px)}
.zc-sor-sommaire{display:flex;flex-wrap:wrap;gap:var(--zc-s2) var(--zc-s4);align-items:baseline;margin-top:var(--zc-s5);padding-top:var(--zc-s3);border-top:2px solid var(--zc-bleu)}
.zc-sor-sommaire p{margin:0}
.zc-sor-sommaire ul{display:flex;flex-wrap:wrap;gap:var(--zc-s2) var(--zc-s4);list-style:none;margin:0;padding:0}
.zc-sor-sommaire a{font-size:17px;text-decoration:none;border-bottom:1px solid}/* 2. À la une (ciel) */
.zc-sor-une{padding-block:var(--zc-s6) var(--zc-s4)}
.zc-sor-une__grille{display:grid;grid-template-columns:7fr 5fr;gap:var(--zc-s5);align-items:center}
.zc-sor-une__date{margin:var(--zc-s2) 0 0;font-size:19px;color:var(--zc-bleu-fonce)}
.zc-sor-une h2{margin:var(--zc-s1) 0 var(--zc-s2)}
.zc-sor-fiche{display:grid;grid-template-columns:1fr 1fr;margin:var(--zc-s4) 0;border-top:2px solid var(--zc-bleu)}
.zc-sor-fiche div{padding:12px 12px 12px 0;border-bottom:1px solid var(--zc-bleu)}
.zc-sor-fiche dd{margin:2px 0 0;font-size:18px}
.zc-sor-une__compte{margin:0 0 var(--zc-s3);font-size:17px}
.zc-sor-une__compte b{color:var(--zc-bleu-fonce)}
.zc-sor-actions{display:flex;flex-wrap:wrap;gap:var(--zc-s2);margin:var(--zc-s3) 0 0}
.zc-sor-suite{margin-top:var(--zc-s5);padding-top:var(--zc-s2);border-top:1px solid var(--zc-bleu);font-size:19px;scroll-margin-top:96px}/* Module natif Espace événements (simulation V3) : au montage, viser les sélecteurs réels de la ligne L2 *//* 3. Calendrier (marine) */
.zc-sor-cal{padding-block:var(--zc-s7)}
.zc-sor-cal__grille{display:grid;grid-template-columns:4fr 8fr;gap:var(--zc-s3) var(--zc-s6);align-items:start}
.zc-sor-cal__tete{position:sticky;top:120px}
.zc-sor-cal__tete h2{margin:var(--zc-s1) 0 0}
.zc-sor-an{margin:var(--zc-s3) 0;font-size:clamp(64px,8vw,120px);line-height:1;color:transparent;-webkit-text-stroke:1.5px var(--zc-bleu-lumiere)}
.zc-sor-route{list-style:none;margin:0;padding:0;border-top:2px solid var(--zc-bleu-lumiere)}
.zc-sor-route li{position:relative;display:grid;grid-template-columns:48px minmax(130px,190px) minmax(0,1fr) auto;gap:var(--zc-s3);align-items:center;padding:18px 0;border-bottom:1px solid var(--zc-bleu)}
.zc-sor-route li::before{content:"";position:absolute;left:23px;top:0;bottom:0;width:3px;background:var(--zc-bleu)}
.zc-sor-route .zc-sor-faite::before{background:var(--zc-bleu-lumiere)}
.zc-sor-route .zc-sor-prochaine::before{background:linear-gradient(var(--zc-bleu-lumiere) 50%,var(--zc-bleu) 50%)}
.zc-sor-borne{position:relative;display:grid;place-items:center;width:48px;height:36px;border:2px solid var(--zc-bleu-lumiere);border-radius:6px;background:var(--zc-marine);font:700 16px/1 var(--zc-donnee);color:var(--zc-blanc)}
.zc-sor-prochaine .zc-sor-borne{background:var(--zc-bleu);border-color:var(--zc-blanc)}
.zc-sor-route__date,.zc-sor-cal .zc-sor-statut,.zc-sor-note{color:var(--zc-bleu-lumiere)}
.zc-sor-route__date{font-size:18px}
.zc-sor-route__lieu{font-size:clamp(22px,2.2vw,30px);color:var(--zc-blanc)}
.zc-sor-statut{max-width:13ch}
.zc-sor-cal .zc-sor-prochaine .zc-sor-statut{color:var(--zc-blanc);font-weight:700}
.zc-sor-route__fin .zc-sor-borne{border-style:dashed}
.zc-sor-note{grid-column:2;margin:0;font-size:17px}/* 4. Déroulement (ciel) */
.zc-sor-jour{padding-block:var(--zc-s7) var(--zc-s6)}
.zc-sor-jour h2{margin:var(--zc-s1) 0 0;max-width:16ch}
.zc-sor-jour__etapes{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--zc-s4);list-style:none;margin:var(--zc-s5) 0 0;padding:0}
.zc-sor-jour__etapes::before{content:"";position:absolute;left:0;right:0;top:17px;height:2px;background:repeating-linear-gradient(90deg,var(--zc-bleu) 0 16px,transparent 16px 26px)}
.zc-sor-jour__etapes .zc-virage{position:relative;display:inline-flex;margin:0 0 var(--zc-s3);padding-right:12px;background:var(--zc-ciel)}
.zc-sor-jour h3,.zc-sor-check h3{margin:0 0 8px;font-size:26px}
.zc-sor-jour li .zc-texte{margin:0}
.zc-sor-check{display:grid;grid-template-columns:4fr 8fr;gap:var(--zc-s3);margin-top:var(--zc-s6);padding:var(--zc-s4);background:var(--zc-ciel-2);border-left:4px solid var(--zc-bleu)}
.zc-sor-check ul{margin:0;padding:0;list-style:none}
.zc-sor-check li{position:relative;padding:0 0 8px 30px;font-size:17px}
.zc-sor-check li::before{content:"✓";position:absolute;left:4px;color:var(--zc-bleu);font-weight:700}/* 5. Invités et adhérents (papier) */
.zc-sor-qui{padding-block:var(--zc-s6) var(--zc-s7)}
.zc-sor-qui__grille{display:grid;grid-template-columns:5fr 7fr;gap:var(--zc-s6);align-items:start}
.zc-sor-qui .zc-sor-qui__photo{margin:var(--zc-s6) 0 0}
.zc-sor-qui__photo img,.zc-sor-adh__photo img{aspect-ratio:3/4}
.zc-sor-qui h2{margin:var(--zc-s1) 0 var(--zc-s3)}
.zc-sor-tableau{margin:var(--zc-s4) 0;overflow-x:auto}
.zc-sor-tableau table{width:100%;border-collapse:collapse;font-size:17px}
.zc-sor-tableau caption{text-align:left;padding-bottom:10px}
.zc-sor-tableau :is(th,td){padding:12px 10px 12px 0;border-bottom:1px solid var(--zc-trait);text-align:left;vertical-align:top}
.zc-sor-tableau thead th{border-bottom:2px solid var(--zc-bleu);font-weight:600}
.zc-sor-tableau tbody th{font-weight:400}
.zc-sor-tableau td{width:16%;font-weight:700;color:var(--zc-bleu-fonce)}/* 6. Adhérer (aplat bleu : textes, boutons et légendes gérés par .zc-aplat-bleu) */
.zc-sor-adh{padding-block:var(--zc-s7)}
.zc-sor-adh__grille{display:grid;grid-template-columns:7fr 4fr;gap:var(--zc-s6);align-items:center}
.zc-sor-adh h2{margin:var(--zc-s1) 0 var(--zc-s3)}
.zc-sor-adh__prix{display:flex;flex-wrap:wrap;gap:var(--zc-s3) var(--zc-s5);list-style:none;margin:var(--zc-s4) 0;padding:var(--zc-s3) 0;border-block:2px solid;font-size:17px}
.zc-sor-adh__prix .zc-chiffre{display:block;font-size:clamp(40px,5vw,60px);line-height:1;color:inherit}

/* Mouvement : progressif, depuis un état visible */
@supports (animation-timeline:view()){
@media (prefers-reduced-motion:no-preference){
.zc-sor-ouv__photo img{animation:zc-sor-para linear both;animation-timeline:view();animation-range:cover}
.zc-sor-revele{animation:zc-sor-monte linear both;animation-timeline:view();animation-range:entry 0% cover 30%}
figure.zc-sor-revele img{animation:zc-sor-ouvre linear both;animation-timeline:view();animation-range:entry 0% cover 35%}
}
}
@keyframes zc-sor-para{from{object-position:50% 15%}to{object-position:50% 85%}}
@keyframes zc-sor-monte{from{transform:translateY(28px)}}
@keyframes zc-sor-ouvre{from{clip-path:inset(4% 6%)}}

/* 1024, 768, 390 */
@media (max-width:1100px){
.zc-sor-jour__etapes{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:var(--zc-s5)}
.zc-sor-jour__etapes::before{display:none}
}
@media (max-width:900px){
.zc-sor-ouv__tete,.zc-sor-une__grille,.zc-sor-cal__grille,.zc-sor-qui__grille,.zc-sor-adh__grille,.zc-sor-check{grid-template-columns:minmax(0,1fr)}
.zc-sor-ouv__chapo{padding-left:var(--zc-s3);margin-top:var(--zc-s3)}
.zc-sor-cal__tete{position:static}
.zc-sor-note{grid-column:1}
.zc-sor-qui .zc-sor-qui__photo{margin:0;order:2}
.zc-sor-qui__photo img,.zc-sor-adh__photo img{aspect-ratio:4/3}
}
@media (max-width:600px){
.zc-sor-ouv h1{font-size:68px}
.zc-sor-ouv .zc-sor-ouv__photo{margin-left:0}
.zc-sor-ouv__photo figcaption{padding-inline:var(--zc-gouttiere)}
.zc-sor-sommaire ul{flex-direction:column;gap:10px}
.zc-sor-route li{grid-template-columns:48px minmax(0,1fr);row-gap:4px;align-items:start}
.zc-sor-route li>:not(.zc-sor-borne){grid-column:2}
.zc-sor-borne{grid-row:1/span 3}
.zc-sor-jour__etapes{grid-template-columns:minmax(0,1fr)}
.zc-sor-jour__etapes::before{display:block;left:23px;right:auto;top:18px;bottom:18px;width:2px;height:auto;background:repeating-linear-gradient(var(--zc-bleu) 0 16px,transparent 16px 26px)}
.zc-sor-jour__etapes li{padding-left:64px}
.zc-sor-jour__etapes .zc-virage{margin-left:-64px}
}

/* ==========================================================================
   Modules natifs Yapla, restylés dans la charte V4 : cartes à filet bleu, titres Bodoni, boutons bleus.
   Sélecteurs relevés le 2026-10-01 sur les pages V2 publiées (DOM réel) :
   Événements en vedette .zone-event_flash · Espace événements .zone-event
   Formulaire de contact .zone-contact · Mosaïque de produits .zone-shop_product_list (composant Vue, rendu différé)
   Préfixe .line.site_line__item sur chaque règle : sans lui, le thème et les styles du composant Vue l'emportent (constaté à la recette).
   ========================================================================== */
/* Ligne qui porte un module natif : bande pleine largeur, papier pour les sorties, ciel pour contact et boutique */
.line.site_line__item:has(> .container > .row > :is(.zone-event_flash, .zone-event, .zone-contact, .zone-shop_product_list)) { padding: var(--zc-s6) 0; background: var(--zc-papier); color: var(--zc-encre); overflow-x: clip; }
.line.site_line__item:has(> .container > .row > :is(.zone-contact, .zone-shop_product_list)) { background: var(--zc-ciel); }
.line.site_line__item:has(> .container > .row > :is(.zone-event_flash, .zone-event, .zone-contact, .zone-shop_product_list)) > .container { width: auto; max-width: var(--zc-largeur); margin-inline: auto; padding-inline: var(--zc-gouttiere); }
.line.site_line__item :is(.zone-event_flash, .zone-event, .zone-contact, .zone-shop_product_list){ float: none; width: 100%; padding-inline: 0; }
/* Titre du module (champ « Titre ») */
.line.site_line__item :is(.zone-event_flash, .zone-event, .zone-shop_product_list) > h2{ margin: 0 0 var(--zc-s4); padding-bottom: var(--zc-s2); border-bottom: 2px solid var(--zc-bleu); font-family: var(--zc-titre); font-weight: 400; font-size: clamp(30px, 3.6vw, 46px); line-height: 1.15; letter-spacing: 0; text-transform: none; text-align: left; color: var(--zc-encre); }
/* Grille de cartes : la .row Bootstrap devient une grille (clearfix neutralisé) */
.line.site_line__item :is(.zone-event_flash .eventsList, .zone-event .events-mosaic) > .row{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zc-s5) var(--zc-s4); margin: 0; }
.line.site_line__item :is(.zone-event_flash .eventsList, .zone-event .events-mosaic) > .row::before,
.line.site_line__item :is(.zone-event_flash .eventsList, .zone-event .events-mosaic) > .row::after{ content: none; display: none; }
.line.site_line__item :is(.zone-event_flash .eventsList, .zone-event .events-mosaic) > .row > [class*="col-"]{ float: none; width: auto; min-height: 0; padding: 0; }
/* Carte d'événement : filet bleu en tête, photo 4:3, titre Bodoni, date en chasse fixe */
.line.site_line__item :is(.zone-event_flash, .zone-event) .item{ display: flex; flex-direction: column; height: 100%; margin: 0; padding: var(--zc-s2) 0 0; border: 0; border-top: 4px solid var(--zc-bleu); border-radius: 0; background: none; box-shadow: none; text-align: left; }
.line.site_line__item :is(.zone-event_flash, .zone-event) .item img.e-thumbnail{ display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; margin: 0 0 var(--zc-s3); border-radius: 0; background: var(--zc-papier-2); }
.line.site_line__item :is(.zone-event_flash, .zone-event) .item h3{ margin: 0 0 8px; font-family: var(--zc-titre); font-weight: 400; font-size: 26px; line-height: 1.15; letter-spacing: 0; text-transform: none; color: var(--zc-encre); }
.line.site_line__item :is(.zone-event_flash, .zone-event) .item h3 a{ color: inherit; text-decoration: none; }
.line.site_line__item :is(.zone-event_flash, .zone-event) .item h3 a:hover{ color: var(--zc-bleu); }
.line.site_line__item :is(.zone-event_flash, .zone-event) .e-date{ display: block; margin: 0 0 var(--zc-s2); font-family: var(--zc-donnee) !important; font-size: 14px !important; font-weight: 500; line-height: 1.5; letter-spacing: .04em; text-transform: uppercase; color: var(--zc-bleu-fonce) !important; } /* !important : le thème impose police et couleur du h4 */
.line.site_line__item :is(.zone-event_flash, .zone-event) .itemInfos{ margin: 0; }
.line.site_line__item :is(.zone-event_flash, .zone-event) .itemInfos > br, .line.site_line__item :is(.zone-event_flash, .zone-event) .city:empty, .line.site_line__item :is(.zone-event_flash, .zone-event) .address:empty, .line.site_line__item :is(.zone-event_flash, .zone-event) .item > hr{ display: none; }
.line.site_line__item :is(.zone-event_flash, .zone-event) :is(.actions, p.actions){ display: flex; flex-wrap: wrap; gap: var(--zc-s2); margin: auto 0 0; padding-top: var(--zc-s3); }
.line.site_line__item :is(.zone-event_flash, .zone-event) .btn{ min-height: 46px; padding: 12px 20px; }
.line.site_line__item .zone-event_flash .viewAll{ display: inline-flex; align-items: center; gap: 10px; margin-top: var(--zc-s5); padding-bottom: 4px; border-bottom: 1.5px solid var(--zc-bleu); font: 600 14px/1.2 var(--zc-texte); font-stretch: 112%; letter-spacing: .12em; text-transform: uppercase; color: var(--zc-bleu); text-decoration: none; }
.line.site_line__item .zone-event_flash .viewAll::after{ content: "→"; font-family: var(--zc-donnee); font-weight: 400; }
.line.site_line__item .zone-event_flash .viewAll:hover{ color: var(--zc-bleu-fonce); border-color: var(--zc-bleu-fonce); }
/* Formulaire de contact : carte blanche à filet bleu, libellés au-dessus des champs */
.line.site_line__item .zone-contact .content.contact{ max-width: 760px; padding: var(--zc-s5) clamp(20px, 4vw, 52px); border-top: 4px solid var(--zc-bleu); background: var(--zc-blanc); }
.line.site_line__item .zone-contact .form-horizontal .form-group{ display: block; margin: 0 0 var(--zc-s3); }
.line.site_line__item .zone-contact .form-horizontal .form-group::before, .line.site_line__item .zone-contact .form-horizontal .form-group::after{ content: none; }
.line.site_line__item .zone-contact .form-horizontal .form-group > [class*="col-md-"]{ float: none; width: 100%; padding: 0; }
.line.site_line__item .zone-contact .form-horizontal .control-label{ display: block; margin: 0 0 8px; padding: 0; text-align: left; font: 500 13px/1.3 var(--zc-donnee); letter-spacing: .06em; text-transform: uppercase; color: var(--zc-encre); }
.line.site_line__item .zone-contact .control-label--required{ color: var(--zc-bleu); }
.line.site_line__item .zone-contact textarea.form-control{ min-height: 180px; resize: vertical; }
.line.site_line__item .zone-contact .crm-footer-frame{ margin-top: var(--zc-s4); }
/* Mosaïque de produits : cartes à filet bleu sur fond ciel, prix en plaque bleue */
.line.site_line__item .zone-shop_product_list .products{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--zc-s5) var(--zc-s4); margin: 0; }
.line.site_line__item .zone-shop_product_list .product{ display: flex; flex-direction: column; margin: 0; border: 0; border-top: 4px solid var(--zc-bleu); border-radius: 0; background: var(--zc-blanc); box-shadow: none; overflow: hidden; }
.line.site_line__item .zone-shop_product_list .product-image-container{ position: relative; aspect-ratio: 1 / 1; margin: 0; background: var(--zc-papier-2); overflow: hidden; }
.line.site_line__item .zone-shop_product_list .product-image{ display: block; width: 100%; height: 100%; object-fit: cover; }
.line.site_line__item .zone-shop_product_list .product-image:not([src]), .line.site_line__item .zone-shop_product_list .product-image[src=""]{ visibility: hidden; }
.line.site_line__item .zone-shop_product_list .product-price{ position: absolute; left: 0; bottom: 0; margin: 0; padding: 8px 14px; background: var(--zc-bleu); color: var(--zc-blanc); font: 500 16px/1.2 var(--zc-donnee); }
.line.site_line__item .zone-shop_product_list .product-content{ display: flex; flex-direction: column; flex: 1; gap: var(--zc-s3); padding: var(--zc-s3); }
.line.site_line__item .zone-shop_product_list .product-title{ margin: 0 0 6px; font-family: var(--zc-titre) !important; font-weight: 400 !important; font-size: 24px !important; line-height: 1.15; color: var(--zc-encre); } /* !important : styles du composant Vue */
.line.site_line__item .zone-shop_product_list .product-description{ margin: 0; font-size: 16px; color: var(--zc-gris); }
.line.site_line__item .zone-shop_product_list .product-content > div:last-child{ margin-top: auto; }
.line.site_line__item .zone-shop_product_list .add-to-cart{ display: inline-flex; align-items: center; gap: 10px; min-height: 46px; padding: 12px 20px; border: 1.5px solid var(--zc-bleu); border-radius: 1px; background: var(--zc-bleu); color: var(--zc-blanc); font: 600 13px/1.2 var(--zc-texte); letter-spacing: .1em; text-transform: uppercase; box-shadow: none; }
.line.site_line__item .zone-shop_product_list .add-to-cart:is(:hover, :focus-visible){ background: var(--zc-bleu-fonce); border-color: var(--zc-bleu-fonce); }
.line.site_line__item .zone-shop_product_list .pagination-container{ display: flex; justify-content: center; gap: var(--zc-s2); margin-top: var(--zc-s4); }
.line.site_line__item .zone-shop_product_list .pagination-container:has(> button:disabled + button:disabled){ display: none; }
/* Rangée Bootstrap : marges négatives annulées pour aligner les modules natifs sur les blocs du site */
.line.site_line__item:has(> .container > .row > :is(.zone-event_flash, .zone-event, .zone-contact, .zone-shop_product_list)) > .container > .row { margin-inline: 0; }
/* Boutons des modules natifs : même dessin que .zc-btn (le thème impose sa police et sa casse) */
.line.site_line__item :is(.zone-event_flash, .zone-event, .zone-contact, .zone-shop_product_list) :is(.btn, .add-to-cart) { font-family: var(--zc-texte) !important; font-size: 14px !important; font-weight: 600; font-stretch: 112%; line-height: 1.2; letter-spacing: .12em; text-transform: uppercase !important; border-radius: 1px !important; box-shadow: none; }
.line.site_line__item :is(.zone-event_flash, .zone-event) .btn.btn-default { background: transparent !important; border: 1.5px solid var(--zc-bleu-fonce) !important; color: var(--zc-bleu-fonce) !important; }
.line.site_line__item :is(.zone-event_flash, .zone-event) .btn.btn-default:is(:hover, :focus-visible) { background: var(--zc-bleu-fonce) !important; color: var(--zc-blanc) !important; }
.line.site_line__item :is(.zone-event_flash, .zone-event, .zone-contact) .btn.btn-primary { background: var(--zc-bleu) !important; border: 1.5px solid var(--zc-bleu) !important; color: var(--zc-blanc) !important; }
.line.site_line__item :is(.zone-event_flash, .zone-event, .zone-contact) .btn.btn-primary:is(:hover, :focus-visible) { background: var(--zc-bleu-fonce) !important; border-color: var(--zc-bleu-fonce) !important; }
@media (max-width: 991px) {
.line.site_line__item :is(.zone-event_flash .eventsList, .zone-event .events-mosaic) > .row, .line.site_line__item .zone-shop_product_list .products{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
.line.site_line__item:has(> .container > .row > :is(.zone-event_flash, .zone-event, .zone-contact, .zone-shop_product_list)) { padding: var(--zc-s5) 0; }
.line.site_line__item :is(.zone-event_flash .eventsList, .zone-event .events-mosaic) > .row, .line.site_line__item .zone-shop_product_list .products{ grid-template-columns: minmax(0, 1fr); }
}