/*
Theme Name: Souam Rent A Car
Theme URI: https://souamrentacar.com
Author: Souam Rent A Car
Description: Thème bloc sur mesure de Souam Rent A Car, location de voitures à Meknès. Converti depuis la maquette validée (méthode claude-to-wordpress). L'affichage des voitures et la réservation sont fournis par le plugin souam-fleet.
Version: 1.0.0
Requires at least: 6.6
Tested up to: 6.9
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: souam
Tags: block-theme, full-site-editing, business, rtl-language-support
*/

/* Registre validé : page entièrement noire, titres serif, texte sans-serif, accent unique or (logo).
   Propriétés logiques partout (inline/block) : le passage en arabe RTL ne demande pas de réécriture.
   Les sélecteurs suivent le DOM des blocs natifs : la classe du composant est posée par className. */

:root {
  --noir: #070707;
  --graphite: #282828;
  --bronze: #362A13;
  --or: #D4AC61;
  --or-clair: #EAC473;
  --argent: #DADADA;
  --blanc: #FFFFFF;
  --gris: #A3A3A3;
  --gris-sombre: #8E8E8E;
  --filet: rgba(212, 172, 97, .22);
  --filet-neutre: rgba(255, 255, 255, .09);
  --carte-fond: linear-gradient(160deg, #100E0B 0%, #0A0907 55%, #1F180C 100%);

  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --sans: Poppins, system-ui, -apple-system, "Segoe UI", sans-serif;

  --largeur: 1200px;
  --gouttiere: 24px;
  --h-entete: 92px;
  --rayon: 16px;
  --bloc: clamp(60px, 6.6vw, 96px);

  /* Icônes en masques CSS (substitution n° 1 de blocs-gutenberg.md) : la couleur vient de background. */
  --ico-voiture: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 16.5v-3.2c0-.6.2-1.1.6-1.5l2.4-2.5c.4-.5 1-.8 1.6-.8h7.8c.6 0 1.2.3 1.6.8l2.4 2.5c.4.4.6.9.6 1.5v3.2M9.3 16.5h5.4M6 11.5h12'/%3E%3Ccircle cx='7.5' cy='16.5' r='1.8'/%3E%3Ccircle cx='16.5' cy='16.5' r='1.8'/%3E%3C/svg%3E");
  --ico-formulaire: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4.5' y='3.5' width='15' height='17' rx='2'/%3E%3Cpath d='M8 8h8M8 12h8M8 16h5'/%3E%3C/svg%3E");
  --ico-whatsapp: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.5 11.6a8.5 8.5 0 0 1-12.6 7.4L3.5 20.5l1.6-4.2A8.5 8.5 0 1 1 20.5 11.6z'/%3E%3Cpath fill='%23000' stroke='none' d='M9 8.2c.2-.4.5-.5.8-.5h.5c.2 0 .4.1.5.4l.7 1.7c.1.2 0 .5-.1.7l-.5.6c-.1.2-.1.4 0 .5.6 1 1.4 1.8 2.4 2.4.2.1.4.1.5 0l.6-.5c.2-.2.5-.2.7-.1l1.7.7c.3.1.4.3.4.5v.5c0 .3-.2.6-.5.8-.6.4-1.4.6-2.2.4-2.7-.7-4.8-2.8-5.5-5.5-.2-.8 0-1.6.4-2.2z'/%3E%3C/svg%3E");
  --ico-validation: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M8.3 12.3l2.5 2.5 5-5.3'/%3E%3C/svg%3E");
  --ico-tel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.5 3.5h2.2c.4 0 .8.3.9.7l.9 3.4c.1.4 0 .8-.3 1L8.6 10a12 12 0 0 0 5.4 5.4l1.4-1.6c.3-.3.7-.4 1-.3l3.4.9c.4.1.7.5.7.9v2.2c0 1.1-.9 2-2 2A16.5 16.5 0 0 1 4.5 5.5c0-1.1.9-2 2-2z'/%3E%3C/svg%3E");
  --ico-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-11.5A7 7 0 0 1 19 9.5C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E");
  --ico-route: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6' cy='18' r='2'/%3E%3Ccircle cx='18' cy='6' r='2'/%3E%3Cpath d='M8 18h7.5a3.5 3.5 0 0 0 0-7h-7a3.5 3.5 0 0 1 0-7H16'/%3E%3C/svg%3E");
  --ico-fleche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--noir);
  color: var(--blanc);
  font: 400 16px/1.65 var(--sans);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
body.reservation-ouverte { overflow: hidden; }
img { display: block; max-width: 100%; height: auto; } /* height:auto obligatoire, sinon l'attribut height des blocs image l'emporte */
a { color: inherit; text-decoration: none; }
h1, h2, h3, p, figure { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button, input, select, textarea { font: inherit; color: inherit; }

/* Espacement automatique de Gutenberg : coupé dans theme.json (blockGap 0px),
   filet de sécurité ici À SPÉCIFICITÉ NULLE — jamais « .wp-block-group > * ». */
:where(.wp-block-group) > :where(*), :where(.wp-block-buttons) { margin-block: 0; }
figure.wp-block-image { margin: 0; }
.wp-element-caption { margin: 0; }

:focus-visible { outline: 2px solid var(--or-clair); outline-offset: 3px; border-radius: 6px; }
.screen-reader-text { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.enveloppe {
  inline-size: 100%;
  max-inline-size: calc(var(--largeur) + 2 * var(--gouttiere));
  margin-inline: auto;
  padding-inline: var(--gouttiere);
}
.enveloppe-etroite { max-inline-size: calc(820px + 2 * var(--gouttiere)); }
.centre { text-align: center; }

/* ---------- Boutons ---------- */
/* Boutons Gutenberg : la classe atterrit sur le conteneur div.wp-block-button (blocs-gutenberg.md). */
.wp-block-buttons { display: flex; flex-wrap: wrap; gap: 12px; }
.wp-block-button > .wp-block-button__link {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  white-space: nowrap;
  transition: background-color .25s, color .25s, border-color .25s, transform .25s;
}
.wp-block-button.bouton-contour > .wp-block-button__link {
  background: transparent; color: var(--or-clair);
  border: 1px solid rgba(234, 196, 115, .5);
}
.wp-block-button.bouton-contour > .wp-block-button__link:hover { background: rgba(234, 196, 115, .08); border-color: var(--or-clair); color: var(--or-clair); }
.wp-block-button.bouton-petit > .wp-block-button__link { padding: 10px 24px; font-size: 14px; }
.wp-block-button.bouton-mini > .wp-block-button__link { padding: 9px 18px; font-size: 13px; }
.wp-block-button[class*="ico-"] > .wp-block-button__link::before {
  content: ""; flex: none; inline-size: 18px; block-size: 18px;
  background: currentColor;
  -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat;
}
.ico-voiture { --ico: var(--ico-voiture); }
.ico-formulaire { --ico: var(--ico-formulaire); }
.ico-whatsapp { --ico: var(--ico-whatsapp); }
.ico-validation { --ico: var(--ico-validation); }
.ico-tel { --ico: var(--ico-tel); }
.ico-pin { --ico: var(--ico-pin); }
.ico-route { --ico: var(--ico-route); }

/* Boutons rendus par le plugin (balises <button> et <a>) : même dessin. */
.bouton {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  padding: 14px 30px;
  border: 1px solid transparent; border-radius: 999px;
  background: none;
  font: 500 15px/1.2 var(--sans);
  cursor: pointer; white-space: nowrap;
  transition: background-color .25s, color .25s, border-color .25s;
}
.bouton .ico { inline-size: 18px; block-size: 18px; }
.bouton-or { background: var(--or-clair); color: var(--noir); }
.bouton-or:hover { background: var(--or); }
.bouton.bouton-contour { border-color: rgba(234, 196, 115, .5); color: var(--or-clair); }
.bouton.bouton-contour:hover { background: rgba(234, 196, 115, .08); border-color: var(--or-clair); }
.bouton.bouton-petit { padding: 10px 24px; font-size: 14px; }
.bouton.bouton-mini { padding: 9px 18px; font-size: 13px; }
.bouton.bouton-large { inline-size: 100%; margin-block-start: 24px; padding-block: 16px; }
.bouton[disabled] { opacity: .55; cursor: wait; }
.ico {
  inline-size: 1.15em; block-size: 1.15em; flex: none;
  fill: none; stroke: currentColor; stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round;
}
.a-confirmer { color: var(--gris-sombre); font-style: normal; border-block-end: 1px dashed rgba(212, 172, 97, .45); }

/* ---------- En-tête (template part) ---------- */
.wp-site-blocks > header.wp-block-template-part {
  position: sticky; inset-block-start: var(--wp-admin--admin-bar--height, 0px); z-index: 50;
  block-size: var(--h-entete);
  border-block-end: 1px solid transparent;
  transition: background-color .35s, border-color .35s;
}
/* Le logo est livré sur fond noir : tant que l'en-tête est transparent, il fusionne en
   « lighten » avec la page ; une fois défilé, fond plein de la teinte exacte du logo. */
.wp-site-blocks > header.wp-block-template-part:not(.est-defile):not(:has(.is-menu-open)) { mix-blend-mode: lighten; }
.wp-site-blocks > header.wp-block-template-part.est-defile { background: var(--noir); border-block-end-color: var(--filet); }
.entete { block-size: 100%; }
.entete-ligne { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 28px; block-size: 100%; }
.entete-logo img { block-size: 74px; inline-size: auto; }
.entete-logo a { display: block; }
.nav { justify-self: center; }
.nav .wp-block-navigation__container { gap: clamp(18px, 2.2vw, 34px); }
.nav .wp-block-navigation-item__content {
  position: relative; display: block; padding-block: 8px;
  color: #CFCFCF; font-size: 14px; white-space: nowrap;
  transition: color .2s;
}
.nav .wp-block-navigation-item__content:hover,
.nav .current-menu-item > .wp-block-navigation-item__content { color: var(--or-clair); }
.nav .current-menu-item > .wp-block-navigation-item__content::after {
  content: ""; position: absolute; inset-inline: 30%; inset-block-end: 0; block-size: 1px; background: var(--or-clair);
}
.nav .wp-block-navigation__responsive-container-open,
.nav .wp-block-navigation__responsive-container-close {
  inline-size: 44px; block-size: 44px; justify-content: center; align-items: center;
  border: 1px solid var(--filet-neutre); border-radius: 50%; color: var(--blanc);
}
/* Panneau mobile : sans ceci il s'ouvre blanc sur blanc (CSS du bloc imprimé après le thème). */
.wp-block-navigation.nav .wp-block-navigation__responsive-container.is-menu-open {
  background-color: var(--noir) !important; color: var(--blanc) !important;
}
.wp-block-navigation.nav .is-menu-open .wp-block-navigation__responsive-container-content { align-items: center; padding-block-start: 96px; }
.wp-block-navigation.nav .is-menu-open .wp-block-navigation__container { align-items: center; gap: 18px; }
.wp-block-navigation.nav .is-menu-open .wp-block-navigation-item__content { font: 400 30px/1.2 var(--serif); color: var(--blanc); }
.entete-actions { display: flex; align-items: center; justify-content: flex-end; gap: 20px; }
.lien-tel a { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; white-space: nowrap; transition: color .2s; }
.lien-tel a::before {
  content: ""; inline-size: 18px; block-size: 18px; background: var(--or-clair);
  -webkit-mask: var(--ico-tel) center / contain no-repeat; mask: var(--ico-tel) center / contain no-repeat;
}
.lien-tel a:hover { color: var(--or-clair); }

/* ---------- Héros ---------- */
.heros, .page-tete, .page-ariane { margin-block-start: calc(-1 * var(--h-entete)); }
.heros {
  position: relative; overflow: hidden;
  padding-block: calc(var(--h-entete) + clamp(28px, 4vw, 52px)) 0;
  background:
    radial-gradient(70% 55% at 0% 0%, rgba(54, 42, 19, .75), transparent 70%),
    radial-gradient(40% 35% at 100% 8%, rgba(54, 42, 19, .35), transparent 70%),
    var(--noir);
}
.heros-texte { position: relative; z-index: 2; text-align: center; }
.surtitre {
  margin-block-end: 20px;
  color: var(--or-clair);
  font-size: 12px; font-weight: 500; letter-spacing: .32em; text-transform: uppercase;
}
.titre-heros {
  font: 400 clamp(40px, 5.5vw, 78px)/1.06 var(--serif);
  letter-spacing: -.01em;
  text-wrap: balance; hyphens: none;
}
.titre-heros em, .page-tete h1 em { font-style: normal; color: var(--or-clair); }
.heros-sous { max-inline-size: 600px; margin: 22px auto 0; color: var(--gris); font-size: 16px; }
.heros-scene {
  position: relative;
  inline-size: min(1240px, 100%);
  block-size: clamp(320px, 42vw, 600px);
  margin: clamp(-30px, -1.5vw, -8px) auto 0;
}
.heros-voiture { block-size: 100%; }
.heros-voiture img {
  inline-size: 100%; block-size: 100%;
  object-fit: cover; object-position: 50% 53%;
  filter: brightness(.9) contrast(1.05);
  -webkit-mask-image: radial-gradient(50% 56% at 50% 52%, #000 38%, transparent 100%);
          mask-image: radial-gradient(50% 56% at 50% 52%, #000 38%, transparent 100%);
}
.lien-cercle {
  position: absolute; inset-inline-end: max(var(--gouttiere), calc((100% - var(--largeur)) / 2));
  inset-block-start: 14%;
}
.lien-cercle a { position: relative; display: inline-flex; align-items: center; gap: 14px; color: var(--or-clair); font-size: 14px; }
.lien-cercle a::before {
  content: ""; inline-size: 54px; block-size: 54px; flex: none;
  border: 1px dashed rgba(234, 196, 115, .65); border-radius: 50%;
  transition: transform .35s, background-color .35s;
}
.lien-cercle a::after {
  content: ""; position: absolute; inset-inline-start: 18px; inset-block-start: calc(50% - 9px);
  inline-size: 18px; block-size: 18px; background: var(--or-clair);
  -webkit-mask: var(--ico-fleche) center / contain no-repeat; mask: var(--ico-fleche) center / contain no-repeat;
}
.lien-cercle a:hover::before { transform: rotate(-45deg); background: rgba(234, 196, 115, .08); }
.recherches {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px;
  padding-block: 26px clamp(56px, 6vw, 84px);
  font-size: 13.5px; font-weight: 500;
}
.recherches a {
  padding: 7px 16px;
  background: #181818; border: 1px solid var(--filet-neutre); border-radius: 999px;
  color: #CFCFCF; font-size: 12.5px; font-weight: 400;
  transition: border-color .2s, color .2s;
}
.recherches a:hover { border-color: var(--filet); color: var(--or-clair); }

/* ---------- Sections ---------- */
.bloc { padding-block: var(--bloc); }
.entete-section h2 {
  font: 400 clamp(32px, 3.7vw, 52px)/1.12 var(--serif);
  letter-spacing: -.005em; text-wrap: balance;
}
.entete-section p { margin-block-start: 18px; color: var(--gris); font-size: 15px; text-wrap: pretty; }
.entete-section.centre { max-inline-size: 720px; margin-inline: auto; }
.lien-suite { margin-block-start: clamp(32px, 3vw, 44px); }
.lien-suite.centre { justify-content: center; }
.lien-texte a, a.lien-texte, .entete-section p a, .prose a, .encart a:not(.wp-block-button__link) {
  color: var(--or-clair); border-block-end: 1px solid rgba(234, 196, 115, .4); transition: border-color .2s;
}
.note-illustration { margin-block-start: 14px; color: var(--gris-sombre); font-size: 12.5px; }

/* Voitures (accueil) : en-tête de section, le carrousel vient du plugin */
.flotte { padding-block-start: clamp(36px, 4vw, 60px); }
.flotte .entete-section p { max-inline-size: 440px; }

/* Pourquoi choisir Souam : chiffres */
.chiffres {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px;
  margin-block-start: clamp(48px, 5vw, 72px);
  text-align: center;
}
.chiffre-valeur { color: var(--or-clair); font: 400 clamp(36px, 3.6vw, 52px)/1.1 var(--serif); white-space: nowrap; }
.chiffre-libelle { margin-block-start: 10px; color: var(--gris); font-size: 13px; line-height: 1.55; }

/* Comment réserver : médaillons (icône en masque, numéro par compteur CSS) */
.liste-etapes {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(24px, 3.5vw, 52px);
  margin-block-start: clamp(52px, 5vw, 76px);
  text-align: center;
  counter-reset: etape;
}
.etape { position: relative; counter-increment: etape; }
.etape::before {
  content: ""; display: block;
  inline-size: 92px; block-size: 92px; margin-inline: auto;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #3B301B 0%, #1A150C 60%, #0D0B07 100%);
  box-shadow: 0 0 0 1px rgba(212, 172, 97, .55), 0 0 0 7px rgba(54, 42, 19, .35), 0 18px 40px rgba(0, 0, 0, .6);
}
.etape h3::before {
  content: ""; position: absolute; inset-block-start: 29px; inset-inline-start: calc(50% - 17px);
  inline-size: 34px; block-size: 34px; background: var(--or-clair);
  -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat;
}
.etape::after {
  content: counter(etape);
  position: absolute; inset-block-start: -4px; inset-inline-start: calc(50% + 22px);
  display: grid; place-items: center;
  inline-size: 28px; block-size: 28px;
  background: var(--or-clair); color: var(--noir);
  border-radius: 50%;
  font: 600 13px/1 var(--sans);
}
.etape h3 { margin-block-start: 28px; font: 600 18px/1.35 var(--sans); }
.etape p { max-inline-size: 250px; margin: 10px auto 0; color: var(--gris); font-size: 14px; }
.etapes-action { margin-block-start: clamp(44px, 4vw, 60px); justify-content: center; }

/* Découvrir Meknès : texte et vignettes */
.escapades-grille {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: center;
  gap: clamp(32px, 6vw, 96px);
}
.escapades-texte h2 { font: 400 clamp(32px, 3.4vw, 48px)/1.14 var(--serif); text-wrap: balance; }
.escapades-texte > p { margin-block: 20px 34px; max-inline-size: 460px; color: var(--gris); font-size: 15px; }
.vignettes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.vignette {
  position: relative; overflow: hidden;
  block-size: clamp(320px, 33vw, 460px);
  border: 1px solid var(--filet-neutre); border-radius: 14px;
}
.vignette img { inline-size: 100%; block-size: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2, .7, .2, 1); }
.vignette:hover img { transform: scale(1.06); }
.vignette::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(7, 7, 7, .45) 0%, transparent 30%, transparent 70%, rgba(7, 7, 7, .35) 100%);
}
.vignette figcaption {
  position: absolute; inset-block-start: 14px; inset-inline: 0; z-index: 1;
  inline-size: max-content; margin-inline: auto;
  padding: 4px 14px;
  background: rgba(7, 7, 7, .45);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border-radius: 999px;
  color: var(--blanc); font-size: 12px; font-weight: 500;
}
.vignette-meknes img { object-position: 50% 50%; }
.vignette-volubilis img { object-position: 72% 50%; }

/* Services : cartes image + texte, filet doré */
.grille-services {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 40px;
  margin-block-start: clamp(44px, 5vw, 68px);
}
.services-page .grille-services { margin-block-start: 0; }
.carte-service {
  display: grid; grid-template-columns: minmax(150px, 2fr) minmax(0, 3fr); align-items: center; gap: 26px;
  padding: 14px;
  border: 1px solid var(--filet); border-radius: var(--rayon);
  background: linear-gradient(155deg, #0E0D0B 0%, #0A0907 50%, #251C0E 100%);
  transition: border-color .3s, transform .3s;
}
.carte-service:hover { border-color: rgba(212, 172, 97, .45); transform: translateY(-3px); }
.grille-services > .carte-service:last-child:nth-child(odd) { grid-column: 1 / -1; justify-self: center; inline-size: min(100%, calc(50% - 20px)); }
.carte-service .wp-block-image img { inline-size: 100%; block-size: 200px; object-fit: cover; border-radius: 10px; }
.carte-service h3 { font: 500 20px/1.3 var(--sans); }
.carte-service p { margin-block: 10px 20px; color: var(--gris); font-size: 13.5px; line-height: 1.6; padding-inline-end: 12px; }

/* FAQ de l'accueil : rail qui déborde des deux côtés, points ajoutés par le script */
.rail {
  margin-block-start: clamp(48px, 5vw, 72px);
  overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scrollbar-width: none;
}
.rail::-webkit-scrollbar { display: none; }
.piste-questions {
  display: flex; gap: 30px; inline-size: max-content;
  padding-inline: calc(50vw - min(210px, 42vw));
  padding-block: 4px 8px;
}
.carte-question {
  position: relative;
  inline-size: min(420px, 84vw); min-block-size: 220px;
  padding: 32px 32px 30px;
  border: 1px solid var(--filet); border-radius: var(--rayon);
  background: var(--carte-fond);
  scroll-snap-align: center;
  opacity: .55; transition: opacity .4s, border-color .4s;
}
.carte-question.est-active { opacity: 1; border-color: rgba(212, 172, 97, .45); }
.carte-question::before {
  content: "?"; position: absolute; inset-block-start: 14px; inset-inline-end: 26px;
  color: var(--or-clair); font: 400 64px/1 var(--serif);
}
.carte-question h3 { padding-inline-end: 52px; font: 500 18px/1.4 var(--sans); }
.carte-question p { margin-block-start: 16px; color: var(--gris); font-size: 14px; }
.points { display: flex; justify-content: center; align-items: center; gap: 10px; margin-block-start: 40px; }
.point {
  inline-size: 8px; block-size: 8px; padding: 0;
  background: #5A5A5A; border: 0; border-radius: 50%;
  cursor: pointer; transition: inline-size .3s, background-color .3s;
}
.point[aria-current="true"] { inline-size: 26px; border-radius: 999px; background: var(--or-clair); }

/* Contact et localisation */
.appel { padding-block-end: clamp(70px, 8vw, 120px); }
.appel-grille { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); align-items: center; gap: clamp(32px, 5vw, 80px); }
.appel-texte h2 { font: 400 clamp(34px, 3.8vw, 54px)/1.1 var(--serif); text-wrap: balance; }
.appel-texte > p { margin-block: 20px 28px; max-inline-size: 440px; color: var(--gris); font-size: 15px; }
.coordonnees-contact { display: grid; gap: 16px; margin-block-end: 34px; }
.coord { position: relative; padding-inline-start: 54px; min-block-size: 40px; display: grid; align-content: center; }
.coord::before {
  content: ""; position: absolute; inset-inline-start: 0; inset-block-start: calc(50% - 20px);
  inline-size: 40px; block-size: 40px; border: 1px solid var(--filet); border-radius: 50%;
}
.coord::after {
  content: ""; position: absolute; inset-inline-start: 11px; inset-block-start: calc(50% - 9px);
  inline-size: 18px; block-size: 18px; background: var(--or-clair);
  -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat;
}
.coord-libelle { color: var(--gris-sombre); font-size: 12px; letter-spacing: .04em; text-transform: uppercase; }
.coord-valeur { font-size: 17px; font-weight: 500; }
.coord-valeur a:hover { color: var(--or-clair); }
.appel-actions .wp-block-button > .wp-block-button__link { padding-inline: 24px; }

.carte-plan {
  position: relative; overflow: hidden;
  aspect-ratio: 4 / 3;
  border: 1px solid var(--filet); border-radius: 20px;
  background:
    radial-gradient(40% 45% at 50% 48%, rgba(234, 196, 115, .16), transparent 70%),
    repeating-linear-gradient(0deg, transparent 0 46px, rgba(255, 255, 255, .045) 46px 47px),
    repeating-linear-gradient(90deg, transparent 0 46px, rgba(255, 255, 255, .045) 46px 47px),
    linear-gradient(160deg, #121110, #0A0907 60%, #1F180C);
  box-shadow: 0 40px 80px rgba(0, 0, 0, .6);
}
.carte-plan::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(90deg, transparent calc(50% - 1px), rgba(212, 172, 97, .2) calc(50% - 1px), rgba(212, 172, 97, .2) calc(50% + 1px), transparent calc(50% + 1px)),
    linear-gradient(0deg, transparent 63%, rgba(255, 255, 255, .07) 63%, rgba(255, 255, 255, .07) calc(63% + 2px), transparent calc(63% + 2px));
}
.carte-voile {
  position: absolute; inset: 0; z-index: 1;
  display: grid; place-content: center; justify-items: center; gap: 12px;
  padding: 32px; text-align: center;
}
/* Repère : l'icône (trait noir) est posée en image de fond sur le disque or. */
.carte-voile::before {
  content: ""; inline-size: 64px; block-size: 64px; border-radius: 50%;
  background: var(--ico-pin) center / 28px no-repeat, var(--or-clair);
  box-shadow: 0 0 0 10px rgba(234, 196, 115, .14), 0 20px 40px rgba(0, 0, 0, .6);
}
.carte-titre { margin-block-start: 14px; font: 400 26px/1.2 var(--serif); }
.carte-note { max-inline-size: 340px; color: var(--gris); font-size: 13px; }
.carte-plan iframe { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; border: 0; z-index: 2; }

/* ---------- Pages internes ---------- */
.page-tete {
  position: relative;
  padding-block: calc(var(--h-entete) + clamp(36px, 5vw, 64px)) clamp(40px, 5vw, 64px);
  background:
    radial-gradient(70% 90% at 0% 0%, rgba(54, 42, 19, .7), transparent 70%),
    radial-gradient(40% 60% at 100% 0%, rgba(54, 42, 19, .3), transparent 70%),
    var(--noir);
  text-align: center;
}
.page-tete h1 { margin-block-start: 18px; font: 400 clamp(38px, 4.6vw, 64px)/1.08 var(--serif); text-wrap: balance; hyphens: none; }
.page-tete .enveloppe > p:not(.ariane):not(.surtitre) { max-inline-size: 640px; margin: 18px auto 0; color: var(--gris); font-size: 16px; text-wrap: pretty; }
.page-tete .surtitre { margin-block: 18px 0; }
.page-tete .wp-block-post-excerpt { max-inline-size: 640px; margin: 18px auto 0; color: var(--gris); font-size: 16px; }
.page-404 { min-block-size: 70vh; padding-block-end: var(--bloc); }
.page-ariane {
  padding-block: calc(var(--h-entete) + 20px) 8px;
  background: radial-gradient(60% 140% at 0% 0%, rgba(54, 42, 19, .6), transparent 70%), var(--noir);
}
.ariane { color: var(--gris-sombre); font-size: 13px; word-spacing: 4px; }
.ariane a { color: var(--argent); word-spacing: normal; transition: color .2s; }
.ariane a:hover { color: var(--or-clair); }

/* Texte courant, encarts, colonnes */
.deux-colonnes-grille { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 5vw, 72px); align-items: start; }
.prose h2 { margin-block: 40px 14px; font: 400 clamp(26px, 2.6vw, 34px)/1.2 var(--serif); }
.prose > h2:first-child, .prose > .encart:first-child + h2 { margin-block-start: 0; }
.prose h3 { margin-block: 26px 8px; font: 600 17px/1.4 var(--sans); }
.prose p, .prose li { color: #CFCFCF; font-size: 16px; line-height: 1.75; }
.prose p + p { margin-block-start: 14px; }
.prose ul, .encart ul { display: grid; gap: 8px; margin-block: 14px; }
.prose ul li, .encart li { position: relative; padding-inline-start: 22px; }
.prose ul li::before, .encart li::before {
  content: ""; position: absolute; inset-inline-start: 2px; inset-block-start: .7em;
  inline-size: 7px; block-size: 7px; border-radius: 50%; background: var(--or-clair);
}
.encart {
  padding: clamp(24px, 3vw, 34px);
  border: 1px solid var(--filet); border-radius: var(--rayon);
  background: var(--carte-fond);
}
.prose .encart { margin-block: 32px; }
.prose > .encart:first-child { margin-block-start: 0; }
.encart h2 { margin-block: 0 14px; font: 400 26px/1.2 var(--serif); }
.encart li { color: var(--argent); font-size: 14.5px; }
.encart ul { margin-block-end: 24px; }
.encart-a-fournir { border-style: dashed; }
.encart-a-fournir ul { margin-block-end: 0; }
.encart-a-fournir p { color: var(--argent); font-size: 14px; }
.avantages { display: grid; gap: 14px; }
.avantage { display: grid; gap: 4px; padding: 20px 22px; border: 1px solid var(--filet); border-radius: 14px; background: var(--carte-fond); }
.avantage h3 { font: 500 16px/1.4 var(--sans); }
.avantage p { color: var(--gris); font-size: 14px; }
.avantage a { color: var(--or-clair); border-block-end: 1px solid rgba(234, 196, 115, .4); }
.choix-modeles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-block-start: clamp(40px, 4vw, 56px); }
.choix { display: grid; gap: 12px; align-content: start; padding: 30px 28px; border: 1px solid var(--filet); border-radius: var(--rayon); background: var(--carte-fond); }
.choix h3 { font: 400 28px/1.15 var(--serif); }
.choix h3 a:hover { color: var(--or-clair); }
.choix p { color: var(--gris); font-size: 14.5px; }
.liste-trajets { display: grid; margin-block: 24px 0; border-block-start: 1px solid var(--filet-neutre); }
.liste-trajets li { display: flex; justify-content: space-between; gap: 16px; padding-block: 13px; border-block-end: 1px solid var(--filet-neutre); }
.liste-trajets strong { font-weight: 500; }
.liste-trajets em { font-style: normal; color: var(--or-clair); white-space: nowrap; }
.escapades-texte .liste-trajets + .note-illustration { margin-block: 12px 26px; }

/* FAQ en accordéon (core/details) */
.faq-theme { margin-block: 48px 18px; font: 400 clamp(26px, 2.6vw, 32px)/1.2 var(--serif); }
.faq-page .faq-theme:first-child { margin-block-start: 0; }
.faq-liste { display: grid; gap: 12px; margin-block-start: 32px; }
.faq-theme + .faq-liste { margin-block-start: 0; }
.faq-liste .wp-block-details { border: 1px solid var(--filet); border-radius: 14px; background: var(--carte-fond); transition: border-color .3s; }
.faq-liste .wp-block-details[open] { border-color: rgba(212, 172, 97, .45); }
.faq-liste summary {
  position: relative; padding: 20px 58px 20px 24px;
  font: 500 16.5px/1.45 var(--sans); cursor: pointer; list-style: none;
}
.faq-liste summary::-webkit-details-marker { display: none; }
.faq-liste summary::after {
  content: "+"; position: absolute; inset-inline-end: 22px; inset-block-start: 50%; translate: 0 -50%;
  display: grid; place-items: center; inline-size: 28px; block-size: 28px;
  border: 1px solid var(--filet); border-radius: 50%;
  color: var(--or-clair); font: 400 20px/1 var(--sans);
}
.faq-liste .wp-block-details[open] summary::after { content: "–"; background: rgba(234, 196, 115, .1); }
.faq-liste .wp-block-details > p { padding: 0 24px 22px; color: var(--gris); font-size: 15px; line-height: 1.7; }
.faq-liste .wp-block-details a { color: var(--or-clair); border-block-end: 1px solid rgba(234, 196, 115, .4); }

/* Bandeau d'appel */
.bandeau-appel-boite {
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 28px;
  padding-block: clamp(32px, 4vw, 48px);
  border-block: 1px solid var(--filet);
}
.bandeau-appel h2 { font: 400 clamp(28px, 3vw, 40px)/1.15 var(--serif); }
.bandeau-appel p { margin-block-start: 10px; color: var(--gris); font-size: 15px; }

/* Conseils : liste des articles (core/query) et article seul */
.grille-articles .wp-block-post-template { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 28px; list-style: none; padding: 0; }
.grille-articles .wp-block-post-featured-image { overflow: hidden; aspect-ratio: 4 / 3; border: 1px solid var(--filet-neutre); border-radius: 14px; }
.grille-articles .wp-block-post-featured-image img { inline-size: 100%; block-size: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2, .7, .2, 1); }
.grille-articles li:hover .wp-block-post-featured-image img { transform: scale(1.05); }
.grille-articles .wp-block-post-date { margin-block-start: 18px; color: var(--or-clair); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.grille-articles .wp-block-post-title { margin-block-start: 10px; font: 400 25px/1.2 var(--serif); }
.grille-articles .wp-block-post-title a:hover { color: var(--or-clair); }
.grille-articles .wp-block-post-excerpt { margin-block-start: 10px; color: var(--gris); font-size: 14.5px; }
.grille-articles .wp-block-post-excerpt__more-link { color: var(--or-clair); }
.article-image { margin-block-end: clamp(40px, 5vw, 64px); }
.article-image img { inline-size: 100%; max-block-size: 560px; object-fit: cover; border: 1px solid var(--filet-neutre); border-radius: var(--rayon); }
.article-image figcaption { margin-block-start: 10px; color: var(--gris-sombre); font-size: 12.5px; }
.article-corps { padding-block-end: var(--bloc); }

/* ---------- Composants rendus par le plugin souam-fleet ---------- */
/* Carrousel, cartes, filtres, fiche, barre de demande, formulaire : mêmes classes que la maquette. */
.fleches { display: flex; justify-content: flex-end; gap: 12px; margin-block-start: -48px; }
.fleche {
  display: grid; place-items: center;
  inline-size: 48px; block-size: 48px; padding: 0;
  background: #1E1E1E; border: 1px solid var(--filet-neutre); border-radius: 50%;
  color: var(--argent); cursor: pointer;
  transition: background-color .2s, opacity .2s;
}
.fleche:hover { background: #2A2A2A; }
.fleche-or { background: var(--or-clair); border-color: var(--or-clair); color: var(--noir); }
.fleche-or:hover { background: var(--or); }
.fleche .ico { inline-size: 20px; block-size: 20px; stroke-width: 2; }
.fleche:disabled { opacity: .35; cursor: default; }
.carrousel {
  margin-block-start: clamp(28px, 3vw, 44px);
  overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: max(var(--gouttiere), calc((100vw - var(--largeur)) / 2));
  scrollbar-width: none;
}
.carrousel::-webkit-scrollbar { display: none; }
.piste {
  display: flex; gap: 26px; inline-size: max-content;
  padding-inline: max(var(--gouttiere), calc((100vw - var(--largeur)) / 2));
  padding-block-end: 8px;
}
.carte-vehicule { inline-size: clamp(280px, 26vw, 370px); scroll-snap-align: start; }
.vehicule-photo {
  position: relative; overflow: hidden; margin: 0;
  aspect-ratio: 5 / 4;
  border: 1px solid var(--filet); border-radius: var(--rayon);
  background: linear-gradient(180deg, #0B0B0B 0%, #1A150C 55%, var(--bronze) 100%);
}
.vehicule-photo img {
  inline-size: 100%; block-size: 100%; object-fit: cover; object-position: 50% 62%;
  filter: saturate(.8) brightness(.9);
  transition: transform .8s cubic-bezier(.2, .7, .2, 1);
}
.vehicule-photo::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(120% 70% at 50% 58%, transparent 45%, rgba(7, 7, 7, .55) 100%),
    linear-gradient(180deg, rgba(7, 7, 7, .78) 0%, rgba(7, 7, 7, .12) 34%, rgba(54, 42, 19, .25) 66%, rgba(54, 42, 19, .92) 100%);
}
.carte-vehicule:hover .vehicule-photo img { transform: scale(1.05); }
.vehicule-photo figcaption { position: absolute; inset-inline-start: 14px; inset-block-end: 12px; z-index: 1; color: rgba(255, 255, 255, .78); font-size: 11px; }
.nombre {
  position: absolute; inset-inline-end: 12px; inset-block-start: 12px; z-index: 1;
  padding: 4px 12px;
  background: rgba(7, 7, 7, .55); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border: 1px solid var(--filet); border-radius: 999px;
  color: var(--or-clair); font-size: 12px; font-weight: 500;
}
.carte-vehicule h3 { margin-block-start: 20px; font: 500 19px/1.3 var(--sans); }
.carte-vehicule h3 a:hover { color: var(--or-clair); }
.vehicule-type { margin-block-start: 4px; color: var(--gris-sombre); font-size: 13px; }
.pastilles { display: flex; flex-wrap: wrap; gap: 8px; margin-block-start: 14px; }
.pastilles li {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 5px 12px;
  background: #1C1C1C; border: 1px solid var(--filet-neutre); border-radius: 999px;
  color: var(--argent); font-size: 12.5px;
}
.pastilles .ico { inline-size: 15px; block-size: 15px; color: var(--or-clair); }
.vehicule-pied { margin-block-start: 18px; padding-block-start: 16px; border-block-start: 1px solid var(--filet-neutre); }
.prix { color: var(--or-clair); font-size: 15px; font-weight: 600; }
.vehicule-actions { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-block-start: 12px; }
.lien-fiche { color: var(--argent); font-size: 13.5px; border-block-end: 1px solid rgba(218, 218, 218, .3); transition: color .2s, border-color .2s; }
.lien-fiche:hover { color: var(--or-clair); border-color: var(--or-clair); }

.filtres { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.filtre {
  min-block-size: 42px; padding: 8px 18px;
  background: #181818; border: 1px solid var(--filet-neutre); border-radius: 999px;
  color: #CFCFCF; font-size: 13.5px; cursor: pointer;
  transition: border-color .2s, color .2s, background-color .2s;
}
.filtre:hover { border-color: var(--filet); color: var(--or-clair); }
.filtre[aria-pressed="true"] { background: var(--or-clair); border-color: var(--or-clair); color: var(--noir); font-weight: 500; }
.compte { margin-block: 18px 36px; color: var(--gris-sombre); font-size: 13px; text-align: center; }
.grille-voitures { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 44px 26px; }
.grille-voitures .carte-vehicule { inline-size: auto; }
.catalogue .grille-voitures { grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); }
.est-masque { display: none !important; }

.barre-demande {
  position: relative; z-index: 3;
  display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr)) auto; align-items: center;
  margin-block-start: clamp(-110px, -7vw, -48px);
  padding: 14px 14px 14px 10px;
  background: rgba(40, 40, 40, .62);
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  border: 1px solid var(--filet-neutre); border-radius: 24px;
  box-shadow: 0 30px 70px rgba(0, 0, 0, .55);
}
.champ { display: grid; gap: 2px; padding: 6px 26px; min-inline-size: 0; }
.champ + .champ { border-inline-start: 1px solid rgba(255, 255, 255, .14); }
.champ label { display: flex; align-items: center; gap: 9px; font-size: 14.5px; font-weight: 500; }
.champ label .ico { color: var(--or-clair); }
.champ input, .champ select {
  inline-size: 100%; min-block-size: 30px; padding: 0;
  background: transparent; border: 0; border-radius: 4px;
  color: var(--gris); font-size: 13.5px; color-scheme: dark; cursor: pointer;
}
.champ select option { background: var(--graphite); color: var(--blanc); }
.barre-demande .bouton { padding-block: 18px; padding-inline: 30px; }

.fiche { padding-block: 20px var(--bloc); }
.fiche-grille { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 5vw, 72px); align-items: start; }
.fiche-photo { aspect-ratio: 4 / 3; }
.fiche-photo img { position: absolute; inset: 0; opacity: 0; transition: opacity .5s; }
.fiche-photo img.est-actif { position: relative; opacity: 1; }
.miniatures { display: flex; gap: 12px; margin-block-start: 14px; }
.miniature {
  inline-size: 104px; aspect-ratio: 4 / 3; padding: 0; overflow: hidden;
  background: none; border: 1px solid var(--filet-neutre); border-radius: 10px; cursor: pointer;
  opacity: .6; transition: opacity .2s, border-color .2s;
}
.miniature img { inline-size: 100%; block-size: 100%; object-fit: cover; }
.miniature.est-actif, .miniature:hover { opacity: 1; border-color: var(--or-clair); }
.fiche-infos h1 { margin-block-start: 14px; font: 400 clamp(36px, 3.8vw, 52px)/1.1 var(--serif); text-wrap: balance; }
.fiche-intro { margin-block-start: 16px; color: var(--gris); font-size: 15.5px; }
.fiche-prix { margin-block-start: 22px; color: var(--or-clair); font: 400 28px/1.2 var(--serif); }
.fiche-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-block-start: 20px; }
.fiche-rappel { margin-block-start: 14px; color: var(--gris-sombre); font-size: 13px; }
.fiche-sous-titre { margin-block-start: 40px; font: 400 26px/1.2 var(--serif); }
.fiche-specs { margin: 16px 0 0; border-block-start: 1px solid var(--filet-neutre); }
.fiche-specs div { display: flex; justify-content: space-between; gap: 16px; padding-block: 12px; border-block-end: 1px solid var(--filet-neutre); font-size: 14.5px; }
.fiche-specs dt { color: var(--gris); }
.fiche-specs dd { margin: 0; font-weight: 500; text-align: end; }
.autres-voitures .entete-section { margin-block-end: clamp(32px, 4vw, 48px); }

/* Formulaire de demande (fenêtre modale du plugin) */
.reservation {
  inline-size: min(540px, calc(100% - 32px));
  max-block-size: calc(100dvh - 32px);
  margin: auto; padding: 0;
  overflow: auto; overscroll-behavior: contain;
  background: var(--carte-fond);
  border: 1px solid rgba(212, 172, 97, .4); border-radius: 22px;
  color: var(--blanc);
  box-shadow: 0 40px 120px rgba(0, 0, 0, .8);
}
.reservation::backdrop { background: rgba(0, 0, 0, .74); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); }
.form-reservation { padding: clamp(22px, 4vw, 40px); }
.reservation-tete { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.reservation h2 { font: 400 clamp(28px, 3vw, 38px)/1.15 var(--serif); }
.fermer {
  display: grid; place-items: center; flex: none;
  inline-size: 44px; block-size: 44px; padding: 0;
  background: #1A1A1A; border: 1px solid var(--filet-neutre); border-radius: 50%; cursor: pointer;
}
.fermer .ico { inline-size: 20px; block-size: 20px; }
.reservation-intro { margin-block: 10px 24px; color: var(--gris); font-size: 14px; }
.grille-champs { display: grid; gap: 16px; }
.f-champ { display: grid; gap: 7px; align-content: start; min-inline-size: 0; }
.f-champ label, .f-duo legend { font-size: 13.5px; font-weight: 500; }
.f-facultatif { color: var(--gris-sombre); font-weight: 400; }
.f-duo { display: block; min-inline-size: 0; margin: 0; padding: 0; border: 0; }
.f-duo legend { margin-block-end: 7px; padding: 0; }
.f-duo-ligne { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 10px; }
.f-duo .f-erreur { margin-block-start: 7px; }
.f-champ input, .f-champ select, .f-champ textarea {
  inline-size: 100%; min-block-size: 48px; padding: 12px 14px;
  background: #141414; border: 1px solid rgba(255, 255, 255, .13); border-radius: 12px;
  color: var(--blanc); font-size: 15px; color-scheme: dark;
  transition: border-color .2s, background-color .2s;
}
.f-champ textarea { resize: vertical; min-block-size: 84px; }
.f-champ input:focus, .f-champ select:focus, .f-champ textarea:focus { outline: none; border-color: var(--or-clair); background: #181818; }
.f-champ [aria-invalid="true"] { border-color: var(--or-clair); box-shadow: inset 4px 0 0 var(--or-clair); }
.f-erreur { color: var(--or-clair); font-size: 12.5px; }
.f-erreur:not(:empty)::before { content: "! "; font-weight: 600; }
.f-piege { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); }
.reservation-mention { margin-block-start: 14px; color: var(--gris-sombre); font-size: 12.5px; text-align: center; }
.reservation-mention a { color: var(--or-clair); border-block-end: 1px solid rgba(234, 196, 115, .4); }
.reservation-statut:not(:empty) {
  margin-block-start: 20px; padding: 16px 18px;
  border: 1px solid var(--filet); border-radius: 14px; background: rgba(234, 196, 115, .06);
  color: var(--argent); font-size: 14px;
}
.reservation-statut a { color: var(--or-clair); border-block-end: 1px solid rgba(234, 196, 115, .4); }

/* ---------- Pied de page (template part) ---------- */
.pied {
  padding-block: 76px 96px;
  border-block-start: 1px solid var(--filet);
  background: radial-gradient(50% 80% at 100% 100%, rgba(54, 42, 19, .35), transparent 70%), var(--noir);
}
.pied-grille { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.3fr; gap: 40px; }
.pied-logo img { inline-size: 170px; block-size: auto; margin-inline-start: -10px; mix-blend-mode: lighten; }
.pied-marque > p { margin-block-start: 14px; max-inline-size: 300px; color: var(--gris); font-size: 14px; }
.pied-titre { margin-block-end: 20px; font: 600 15px/1.3 var(--sans); }
.pied-liens li + li { margin-block-start: 12px; }
.pied-liens a { color: var(--gris); font-size: 14px; transition: color .2s; }
.pied-liens a:hover { color: var(--or-clair); }
.pied-coordonnees li { position: relative; padding-inline-start: 30px; }
.pied-coordonnees li::before {
  content: ""; position: absolute; inset-inline-start: 0; inset-block-start: 3px;
  inline-size: 18px; block-size: 18px; background: var(--or-clair);
  -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat;
}
.pied-coordonnees li:nth-child(1) { --ico: var(--ico-tel); }
.pied-coordonnees li:nth-child(2) { --ico: var(--ico-whatsapp); }
.pied-coordonnees li:nth-child(3) { --ico: var(--ico-pin); }
.pied-bas {
  display: flex; justify-content: space-between; gap: 16px 40px; flex-wrap: wrap;
  margin-block-start: 56px; padding-block-start: 24px;
  border-block-start: 1px solid var(--filet-neutre);
  color: var(--gris-sombre); font-size: 12px;
}
.pied-bas p:last-child { max-inline-size: 640px; text-align: end; }
.pied-bas a { color: var(--or-clair); }

/* Bouton WhatsApp flottant (core/button, texte lu par les lecteurs d'écran, masqué à l'écran) */
.wa-flottant { position: fixed; inset-block-end: 22px; inset-inline-end: 22px; z-index: 55; }
.wa-flottant .wp-block-button__link {
  inline-size: 58px; block-size: 58px; padding: 0;
  border-radius: 50%; font-size: 0;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .55), 0 0 0 6px rgba(234, 196, 115, .12);
}
.wa-flottant.ico-whatsapp > .wp-block-button__link::before { inline-size: 28px; block-size: 28px; }
.wa-flottant .wp-block-button__link:hover { transform: translateY(-3px); }
.reservation-ouverte .wa-flottant { display: none; }

/* ---------- Apparitions ---------- */
.js [data-revele] { opacity: 0; transform: translateY(22px); transition: opacity .8s ease, transform .8s cubic-bezier(.2, .7, .2, 1); }
.js [data-revele].est-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .js [data-revele] { opacity: 1; transform: none; transition: none; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* ---------- Responsive ---------- */
/* core/navigation replie à 600 px : on force le menu mobile dès 1180 px (5 liens + téléphone + bouton). */
@media (max-width: 1180px) {
  .entete-ligne { grid-template-columns: auto 1fr auto; }
  .nav { justify-self: end; order: 3; }
  .nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex !important; }
  .nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none !important; }
}

@media (max-width: 900px) {
  :root { --h-entete: 78px; }
  .entete-logo img { block-size: 60px; }
  .barre-demande { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 8px; }
  .barre-demande .bouton { grid-column: 1 / -1; }
  .chiffres { grid-template-columns: repeat(3, 1fr); row-gap: 40px; }
  .liste-etapes { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 48px; }
  .escapades-grille, .appel-grille, .fiche-grille, .deux-colonnes-grille { grid-template-columns: 1fr; }
  .grille-services { grid-template-columns: 1fr; }
  .grille-services > .carte-service:last-child:nth-child(odd) { justify-self: stretch; inline-size: auto; }
  .choix-modeles, .grille-articles .wp-block-post-template { grid-template-columns: 1fr 1fr; }
  .pied-grille { grid-template-columns: 1fr 1fr; }
  .pied-bas p:last-child { text-align: start; }
  .lien-cercle { inset-block-start: auto; inset-block-end: 26%; }
}

@media (max-width: 640px) {
  :root { --gouttiere: 16px; --h-entete: 70px; }
  .entete-logo img { block-size: 54px; }
  .entete-ligne { gap: 8px; }
  .entete-actions { gap: 8px; }
  .entete-actions .wp-block-button > .wp-block-button__link { padding: 9px 16px; font-size: 13px; }
  .lien-tel a { inline-size: 44px; block-size: 44px; justify-content: center; border: 1px solid var(--filet-neutre); border-radius: 50%; font-size: 0; gap: 0; }
  .wp-block-button > .wp-block-button__link, .bouton, .recherches a { min-block-size: 44px; }
  .recherches a { display: inline-flex; align-items: center; }
  .champ input, .champ select { min-block-size: 40px; }
  .titre-heros { font-size: 38px; }
  .heros-sous { font-size: 15px; }
  .heros-scene { block-size: 320px; margin-block-start: 0; }
  .heros-voiture img { object-position: 50% 54%; transform: scale(1.5); transform-origin: 50% 54%; }
  .lien-cercle { display: none; }
  .barre-demande { grid-template-columns: 1fr; padding: 10px; margin-block-start: -56px; border-radius: 20px; }
  .champ { padding: 12px 14px; }
  .champ + .champ { border-inline-start: 0; border-block-start: 1px solid rgba(255, 255, 255, .12); }
  .barre-demande .bouton { margin-block-start: 8px; inline-size: 100%; }
  .fleches { justify-content: flex-start; margin-block-start: 24px; }
  .chiffres { grid-template-columns: 1fr 1fr; }
  .chiffres > :last-child { grid-column: 1 / -1; }
  .liste-etapes { grid-template-columns: 1fr; gap: 44px; }
  .vignettes { grid-template-columns: 1fr 1fr; }
  .vignette { block-size: 240px; }
  .carte-question { padding: 26px 22px 24px; min-block-size: 0; }
  .appel-actions .wp-block-button { flex: 1 1 100%; }
  .appel-actions .wp-block-button__link { inline-size: 100%; }
  .carte-service { grid-template-columns: 112px minmax(0, 1fr); gap: 16px; padding: 12px; }
  .carte-service .wp-block-image img { block-size: 150px; }
  .carte-service h3 { font-size: 17px; }
  .carte-service p { margin-block: 6px 14px; font-size: 13px; padding-inline-end: 0; }
  .choix-modeles, .grille-articles .wp-block-post-template { grid-template-columns: 1fr; }
  .filtres { justify-content: flex-start; }
  .fiche-actions .bouton { flex: 1 1 100%; }
  .pied-grille { grid-template-columns: 1fr; gap: 34px; }
  .wa-flottant { inset-block-end: 16px; inset-inline-end: 16px; }
  .wa-flottant .wp-block-button__link { inline-size: 52px; block-size: 52px; }
  .reservation { inline-size: 100%; max-inline-size: 100%; block-size: 100dvh; max-block-size: 100dvh; border-radius: 0; border-inline: 0; }
}