/* ==========================================================================
   Les Pieds sous la Table — feuille de style
   Refonte « moderne et clair » du 2026-10-06 (demande d'Anthony : clair,
   élégant, épuré). Principes, à tenir partout :
   - fond blanc, beaucoup d'air, une alternance douce avec --surface ;
   - une seule famille sans (Inter), l'italique d'Instrument Serif pour les
     mots mis en valeur (<em> dans les titres), Fredoka pour le nom du logo ;
   - le noir pour l'action, le rouge des escarpins du logo en touches
     (puce des surtitres, astérisques, erreurs) ;
   - des filets de 1 px pour structurer : ni ombres portées, ni dégradés.
   ========================================================================== */

@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/inter-variable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Serif";
  src: url("/assets/fonts/instrument-serif-italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Serif";
  src: url("/assets/fonts/instrument-serif-normal.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Fredoka";
  src: url("/assets/fonts/fredoka-variable.woff2") format("woff2");
  font-weight: 300 700;
  font-stretch: 75% 125%;
  font-display: swap;
}

:root {
  --fond: #ffffff;
  --surface: #f6f4f0;
  --surface-2: #ece9e3;
  --ligne: #e6e2db;
  --ligne-2: #d3cec5;
  --texte: #141414;
  --texte-2: #4b4b4b;
  --texte-3: #7c7c7c;
  --accent: #e3261a;
  --accent-2: #b51d12;
  --rouge-pale: #fdf1ef;
  --vert: #2f6b3a;
  --vert-pale: #edf5ee;
  --rayon: 20px;
  --rayon-s: 12px;
  --sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --serif: "Instrument Serif", Georgia, "Times New Roman", serif;
  --conteneur: 1200px;
  --gouttiere: clamp(20px, 5vw, 48px);
  --section: clamp(80px, 10vw, 136px);
  --entete: 80px;
  --doux: cubic-bezier(0.2, 0.7, 0.2, 1);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--entete) + 16px); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0;
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.65;
  color: var(--texte-2);
  background: var(--fond);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
img, svg, picture, video { display: block; max-width: 100%; }
img { height: auto; }
[hidden] { display: none !important; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--texte); }
h1, h2, h3, h4 { font-family: var(--sans); color: var(--texte); font-weight: 500; margin: 0 0 0.5em; text-wrap: balance; }
h1 { font-size: clamp(2.75rem, 6.2vw, 5rem); line-height: 1.02; letter-spacing: -0.042em; font-variation-settings: "opsz" 32; }
h2 { font-size: clamp(2rem, 3.9vw, 3.1rem); line-height: 1.06; letter-spacing: -0.035em; font-variation-settings: "opsz" 32; }
h3 { font-size: 1.2rem; line-height: 1.3; letter-spacing: -0.015em; font-weight: 600; }
h1 em, h2 em, h3 em { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 1.08em; letter-spacing: -0.01em; line-height: 0; }
p { margin: 0 0 1em; text-wrap: pretty; }
ul, ol { margin: 0 0 1em; padding-left: 1.2em; }
address { font-style: normal; }
abbr[title] { text-decoration: none; color: var(--accent); }
strong { font-weight: 600; }
button { font: inherit; cursor: pointer; }
:focus-visible { outline: 2px solid var(--texte); outline-offset: 3px; border-radius: 4px; }
::selection { background: #f5d5d1; color: var(--texte); }
.conteneur { width: min(100% - 2 * var(--gouttiere), var(--conteneur)); margin-inline: auto; }
.visuellement-cache { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.evitement { position: absolute; left: -999px; top: 8px; background: var(--texte); color: #fff; padding: 8px 14px; border-radius: 8px; z-index: 100; }
.evitement:focus { left: 8px; }
.ico { width: 1.15em; height: 1.15em; flex: none; stroke-width: 1.6; }
.ico--grand { width: 26px; height: 26px; color: var(--texte); }
.ancre { display: block; position: relative; top: calc(-1 * var(--entete) - 24px); }

/* ---------- Éléments communs ---------- */
.surtitre { display: inline-flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 500; line-height: 1.4; letter-spacing: 0.12em; text-transform: uppercase; color: var(--texte-3); margin: 0 0 20px; }
.surtitre::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); flex: none; }

.bouton {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5em;
  height: 48px; padding: 0 24px; border-radius: 999px; border: 1px solid transparent;
  font-family: var(--sans); font-weight: 500; font-size: 15px; line-height: 1; letter-spacing: -0.005em;
  text-decoration: none; white-space: nowrap; cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s, color 0.2s;
}
.bouton--chaud { background: var(--texte); color: #fff; }
.bouton--chaud:hover { background: #3a3a3a; color: #fff; }
.bouton--contour { background: transparent; color: var(--texte); border-color: var(--ligne-2); }
.bouton--contour:hover { border-color: var(--texte); color: var(--texte); }
.bouton--grand { height: 56px; padding: 0 30px; font-size: 16px; }
.bouton--petit { height: 40px; padding: 0 18px; font-size: 14px; }
.bouton .ico { width: 1.05em; height: 1.05em; }

.lien-fleche { display: inline-flex; align-items: center; gap: 0.45em; font-weight: 500; font-size: 15px; color: var(--texte); text-decoration: none; padding-bottom: 3px; border-bottom: 1px solid currentColor; }
.lien-fleche .ico { width: 1em; height: 1em; transition: transform 0.25s var(--doux); }
.lien-fleche:hover .ico, a:hover > .lien-fleche .ico { transform: translateX(3px); }
.lien-simple { color: var(--texte-2); }
.note { font-size: 14px; color: var(--texte-3); }

.photo { display: block; width: 100%; overflow: hidden; }
.photo img { width: 100%; height: 100%; object-fit: cover; }
.photo--arrondie, .photo--arrondie img { border-radius: var(--rayon); }
.photo--absente { background: var(--surface-2); min-height: 200px; border-radius: var(--rayon-s); }
.video { width: 100%; height: auto; display: block; background: #000; border-radius: var(--rayon-s); }

.pastille { position: absolute; left: 12px; top: 12px; padding: 6px 12px; border-radius: 999px; background: var(--fond); color: var(--texte); font-size: 13px; font-weight: 500; line-height: 1.2; }
.liste-coches { list-style: none; padding: 0; margin: 0; }
.liste-coches li { display: flex; gap: 12px; align-items: flex-start; padding: 8px 0; font-size: 15px; }
.liste-coches .ico { width: 18px; height: 18px; margin-top: 3px; color: var(--texte); }
.liste-num { margin: 0; padding-left: 1.2em; font-size: 15px; }
.liste-num li { padding: 4px 0; }
.liste-prix { list-style: none; padding: 0; margin: 0 0 12px; }
.liste-prix li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--ligne); font-size: 15px; }
.liste-prix li span:last-child { color: var(--texte); font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; }

.alerte { padding: 14px 18px; border-radius: var(--rayon-s); margin: 0 0 24px; font-size: 15px; }
.alerte--erreur { background: var(--rouge-pale); color: #8f1d15; border: 1px solid #f2cdc8; }
.alerte--info { background: var(--surface); color: var(--texte-2); }
.alerte--succes { background: var(--vert-pale); color: var(--vert); }

/* ---------- Sections ---------- */
.section { padding: var(--section) 0; }
.section--surface { background: var(--surface); }
.section--sans-haut { padding-top: 0; }
.section__tete { max-width: 760px; margin-bottom: clamp(40px, 5vw, 64px); }
.section__tete h2 { margin: 0; }
.section__tete--ligne { max-width: none; display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
.section__intro { font-size: 18px; color: var(--texte-2); margin: 20px 0 0; max-width: 60ch; }

/* ---------- Écran d'accueil : le logo s'anime en grand ----------
   Affiché seulement si le script de tête a posé .avec-intro (une fois par visite,
   jamais en « moins d'animations »). Il se retire seul en CSS au bout de 2,8 s,
   même si site.js ne se charge pas ; un clic ou une touche l'écourte. */
.intro { display: none; }
.avec-intro .intro { position: fixed; inset: 0; z-index: 300; display: grid; place-items: center; background: var(--fond); cursor: pointer; animation: intro-sortie 0.55s var(--doux) 2.3s forwards; }
.avec-intro .intro.est-passee { animation: intro-sortie-rapide 0.3s ease forwards; }
@keyframes intro-sortie { to { opacity: 0; visibility: hidden; } }
@keyframes intro-sortie-rapide { to { opacity: 0; visibility: hidden; } }
.intro__logo { display: flex; flex-direction: column; align-items: center; gap: 24px; color: var(--texte); }
.intro .logo-anime { height: clamp(150px, 26vw, 230px); animation: intro-dessin 0.7s var(--doux) both; }
.intro .marque__nom { align-items: center; text-align: center; font-size: clamp(1.9rem, 4.6vw, 2.8rem); animation: intro-nom 0.7s var(--doux) 0.25s both; }
.intro .logo-anime__pied { animation: intro-pied 1.2s ease-in-out 0.55s both; }
.intro .logo-anime__escarpin { animation: intro-escarpin 1.2s ease-in-out 1.05s both; }
.intro .logo-anime__vapeur { animation: logo-vapeur 1.3s ease-in-out infinite alternate; }
@keyframes intro-dessin { from { opacity: 0; transform: translateY(14px) scale(0.94); } }
@keyframes intro-nom { from { opacity: 0; transform: translateY(10px); } }
@keyframes intro-pied { 0% { transform: rotate(0); } 25% { transform: rotate(-16deg); } 45% { transform: rotate(-5deg); } 65% { transform: rotate(-16deg); } 100% { transform: rotate(0); } }
@keyframes intro-escarpin { 0% { transform: rotate(0); } 25% { transform: rotate(-22deg); } 45% { transform: rotate(-12deg); } 65% { transform: rotate(-22deg); } 100% { transform: rotate(0); } }

/* ---------- Fenêtre d'annonce ---------- */
.annonce-modale { width: min(560px, calc(100% - 32px)); max-height: calc(100% - 32px); margin: auto; padding: 0; border: 0; border-radius: var(--rayon); background: var(--fond); color: var(--texte-2); overflow: auto; box-shadow: 0 40px 120px -40px rgba(0, 0, 0, 0.45); }
.annonce-modale::backdrop { background: rgba(20, 20, 20, 0.45); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.annonce-modale[open] { animation: modale-entree 0.45s var(--doux); }
@keyframes modale-entree { from { opacity: 0; transform: translateY(16px) scale(0.98); } }
.annonce-modale__image .photo { aspect-ratio: 16 / 9; }
.annonce-modale__image img { object-position: center 62%; }
.annonce-modale__corps { padding: 28px 32px 30px; }
.annonce-modale .surtitre { margin-bottom: 14px; }
.annonce-modale h2 { margin: 0 0 12px; font-size: clamp(1.7rem, 4.4vw, 2.2rem); }
.annonce-modale__texte { margin: 0; font-size: 17px; color: var(--texte-2); }
.annonce-modale__boutons { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.annonce-modale__credit { margin: 22px 0 0; padding-top: 16px; border-top: 1px solid var(--ligne); font-size: 12px; line-height: 1.5; color: var(--texte-3); }
.annonce-modale__credit a { color: var(--texte-3); }
.annonce-modale__x { position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.92); color: var(--texte); font-size: 22px; line-height: 1; display: grid; place-items: center; }
.annonce-modale__x:hover { background: #fff; }
@media (max-width: 480px) { .annonce-modale__corps { padding: 22px 20px 24px; } .annonce-modale__boutons .bouton { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .annonce-modale[open] { animation: none; } }

/* ---------- En-tête ---------- */
.entete { position: sticky; top: 0; z-index: 50; background: rgba(255, 255, 255, 0.92); -webkit-backdrop-filter: saturate(180%) blur(12px); backdrop-filter: saturate(180%) blur(12px); border-bottom: 1px solid transparent; transition: border-color 0.2s; }
.entete.est-colle { border-bottom-color: var(--ligne); }
.entete__nav { display: flex; align-items: center; justify-content: space-between; gap: 32px; height: var(--entete); }
.marque { position: relative; z-index: 60; display: inline-flex; align-items: center; gap: 12px; flex: none; text-decoration: none; color: var(--texte); }
.marque:hover { color: var(--texte); }
.entete__menu { display: flex; align-items: center; gap: 32px; }
.entete__liens { list-style: none; margin: 0; padding: 0; display: flex; gap: 28px; }
.entete__lien { position: relative; display: inline-block; padding: 6px 0; font-size: 15px; font-weight: 450; color: var(--texte-2); text-decoration: none; transition: color 0.15s; }
.entete__lien:hover, .entete__lien.est-actif { color: var(--texte); }
.entete__lien::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--texte); transform: scaleX(0); transform-origin: left; transition: transform 0.25s var(--doux); }
.entete__lien:hover::after, .entete__lien.est-actif::after { transform: scaleX(1); }
.entete__actions { display: flex; align-items: center; gap: 20px; }
.entete__tel { font-size: 15px; font-weight: 500; color: var(--texte); text-decoration: none; white-space: nowrap; font-variant-numeric: tabular-nums; }
.entete__burger { display: none; position: relative; z-index: 60; width: 44px; height: 44px; margin-right: -10px; border: 0; background: none; flex-direction: column; align-items: center; justify-content: center; gap: 7px; }
.entete__burger-trait { width: 22px; height: 1.5px; background: var(--texte); border-radius: 1px; transition: transform 0.25s var(--doux); }
.menu-ouvert .entete__burger-trait:nth-child(1) { transform: translateY(4.25px) rotate(45deg); }
.menu-ouvert .entete__burger-trait:nth-child(2) { transform: translateY(-4.25px) rotate(-45deg); }
@media (max-width: 1240px) { .entete__tel { display: none; } .entete__liens { gap: 22px; } }
@media (max-width: 1060px) {
  .entete { background: var(--fond); -webkit-backdrop-filter: none; backdrop-filter: none; }
  .entete__burger { display: flex; }
  .entete__menu { position: fixed; inset: 0; z-index: 40; background: var(--fond); padding: calc(var(--menu-haut, var(--entete)) + 8px) var(--gouttiere) 32px; flex-direction: column; align-items: stretch; justify-content: space-between; gap: 32px; overflow: auto; transform: translateX(100%); visibility: hidden; transition: transform 0.3s var(--doux), visibility 0s 0.3s; }
  .menu-ouvert .entete__menu { transform: none; visibility: visible; transition: transform 0.3s var(--doux); }
  .menu-ouvert { overflow: hidden; }
  .entete__liens { flex-direction: column; gap: 0; border-top: 1px solid var(--ligne); }
  .entete__liens li { border-bottom: 1px solid var(--ligne); }
  .entete__lien { display: block; padding: 18px 0; font-size: 24px; font-weight: 500; letter-spacing: -0.02em; color: var(--texte); }
  .entete__lien::after { display: none; }
  .entete__actions { flex-direction: column; align-items: stretch; gap: 12px; }
  .entete__tel { display: block; text-align: center; padding: 12px; font-size: 17px; }
  .entete__actions .bouton { height: 56px; font-size: 16px; }
}

/* ---------- Logo animé ----------
   Quatre calques de 445 × 490 superposés (outils/logo.php). Chaque partie
   mobile pivote autour de sa cheville : les transform-origin sont les
   coordonnées du pivot dans le dessin, en %. Pied : (285, 325). Escarpin :
   (188, 338). Vapeur : pied des volutes, (166, 117).
   Le scénario, sur 7 s : l'homme fait du pied deux fois, l'escarpin répond
   deux fois, puis un temps de repos. La vapeur ondule en continu. */
.logo-anime { position: relative; display: block; flex: none; height: 50px; aspect-ratio: 445 / 490; }
.logo-anime img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; }
.logo-anime__pied { transform-origin: 64.04% 66.33%; }
.logo-anime__escarpin { transform-origin: 42.25% 68.98%; }
.logo-anime__vapeur { transform-origin: 37.3% 23.88%; }
.marque__nom { display: flex; flex-direction: column; font-family: "Fredoka", var(--sans); font-weight: 600; font-stretch: 78%; font-variation-settings: "wdth" 78; font-size: 1.2rem; line-height: 0.86; letter-spacing: -0.005em; text-transform: uppercase; white-space: nowrap; color: currentColor; }
.marque--pied .logo-anime { height: 64px; }
.marque--pied .marque__nom { font-size: 1.45rem; }
@media (max-width: 600px) { .entete .logo-anime { height: 44px; } .entete .marque__nom { font-size: 1.06rem; } }
@media (prefers-reduced-motion: no-preference) {
  .logo-anime__pied { animation: logo-pied 7s ease-in-out 0.8s infinite; }
  .logo-anime__escarpin { animation: logo-escarpin 7s ease-in-out 0.8s infinite; }
  .logo-anime__vapeur { animation: logo-vapeur 2.6s ease-in-out infinite alternate; }
  .marque:hover .logo-anime__pied, .marque:focus-visible .logo-anime__pied,
  .marque:hover .logo-anime__escarpin, .marque:focus-visible .logo-anime__escarpin { animation-duration: 3.5s; }
}
@keyframes logo-pied {
  0%, 10% { transform: rotate(0); }
  16% { transform: rotate(-16deg); }
  21% { transform: rotate(-5deg); }
  27% { transform: rotate(-16deg); }
  35%, 100% { transform: rotate(0); }
}
@keyframes logo-escarpin {
  0%, 36% { transform: rotate(0); }
  42% { transform: rotate(-22deg); }
  47% { transform: rotate(-13deg); }
  52% { transform: rotate(-22deg); }
  60%, 100% { transform: rotate(0); }
}
@keyframes logo-vapeur {
  0% { transform: skewX(4deg) scaleY(0.97); opacity: 0.85; }
  50% { transform: skewX(-3deg) scaleY(1.03); opacity: 1; }
  100% { transform: skewX(-6deg) scaleY(0.99) translateY(-2%); opacity: 0.9; }
}

/* ---------- Accueil : premier écran ---------- */
.hero { padding: clamp(40px, 6vw, 88px) 0 0; }
.hero__int { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 32px clamp(32px, 6vw, 96px); align-items: end; margin-bottom: clamp(36px, 5vw, 64px); }
.hero h1 { margin: 0; max-width: 11ch; }
.hero__accroche { font-size: clamp(17px, 1.4vw, 19px); color: var(--texte-2); margin: 0 0 28px; max-width: 44ch; }
.hero__boutons { display: flex; flex-wrap: wrap; gap: 12px; }
.hero__visuel .photo { aspect-ratio: 2.3 / 1; border-radius: var(--rayon); }
@media (max-width: 900px) { .hero__int { grid-template-columns: 1fr; } .hero__visuel .photo { aspect-ratio: 4 / 3; } }
@media (max-width: 560px) { .hero__boutons, .entete-page__boutons { flex-direction: column; align-items: stretch; } .hero__boutons .bouton, .entete-page__boutons .bouton { width: 100%; } }

.preuves { list-style: none; margin: clamp(32px, 4vw, 48px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--ligne); }
.preuves li { display: flex; gap: 14px; align-items: flex-start; padding: 24px 24px 0 0; }
.preuves li + li { padding-left: 24px; border-left: 1px solid var(--ligne); }
.preuves .ico { width: 22px; height: 22px; margin-top: 1px; color: var(--texte); }
.preuves span { font-size: 14px; line-height: 1.5; color: var(--texte-3); }
.preuves strong { display: block; font-size: 15px; font-weight: 600; color: var(--texte); }
@media (max-width: 900px) { .preuves { grid-template-columns: 1fr 1fr; gap: 0 24px; } .preuves li, .preuves li + li { padding: 20px 0 0; border-left: 0; } }
@media (max-width: 480px) { .preuves { grid-template-columns: 1fr; } }

/* ---------- Prestations ---------- */
.prestations { display: grid; grid-template-columns: repeat(4, 1fr); gap: 48px 24px; }
.prestation { display: flex; flex-direction: column; text-decoration: none; color: var(--texte-2); }
.prestation:hover { color: var(--texte-2); }
.prestation__photo { border-radius: var(--rayon-s); overflow: hidden; margin-bottom: 20px; }
.prestation__photo .photo { aspect-ratio: 4 / 5; }
.prestation__photo img { transition: transform 0.7s var(--doux); }
.prestation:hover .prestation__photo img { transform: scale(1.04); }
.prestation__sur { font-size: 13px; color: var(--texte-3); margin: 0 0 6px; }
.prestation h3 { font-size: 1.3rem; margin: 0 0 8px; }
.prestation__texte { font-size: 15px; margin: 0 0 18px; flex: 1; }
.prestation .lien-fleche { align-self: flex-start; }
@media (max-width: 1100px) { .prestations { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .prestations { grid-template-columns: 1fr; } .prestation__photo .photo { aspect-ratio: 4 / 3; } }

/* ---------- Duo photo / texte ---------- */
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 7vw, 112px); align-items: center; }
.duo__visuel .photo, .duo__visuel .video { aspect-ratio: 4 / 5; border-radius: var(--rayon); object-fit: cover; }
.duo__texte h2 { margin-bottom: 28px; }
.duo__texte .lien-fleche { margin-top: 12px; }
.duo--inverse .duo__visuel { order: 2; }
@media (max-width: 900px) { .duo { grid-template-columns: 1fr; } .duo--inverse .duo__visuel { order: 0; } .duo__visuel .photo, .duo__visuel .video { aspect-ratio: 4 / 3; } }

/* ---------- Étapes, colonnes, chiffres ---------- */
.etapes, .colonnes, .chiffres { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px 32px; }
.chiffres, .colonnes--3 { grid-template-columns: repeat(3, 1fr); }
.etapes > li, .colonnes > *, .chiffres > * { border-top: 1px solid var(--texte); padding-top: 24px; }
.colonnes > * { border-top-color: var(--ligne-2); }
.etapes__num, .chiffre__valeur { display: block; font-family: var(--serif); font-style: italic; font-size: 2.5rem; line-height: 1; color: var(--texte); margin-bottom: 20px; }
.chiffre__valeur { font-size: clamp(2.5rem, 4vw, 3.25rem); }
.etapes h3, .colonnes h3, .chiffres h3 { margin: 0 0 8px; }
.etapes p, .colonnes p, .chiffres p { margin: 0; font-size: 15px; }
.colonnes .ico { width: 24px; height: 24px; color: var(--texte); margin-bottom: 20px; }
@media (max-width: 900px) { .etapes, .colonnes, .chiffres, .colonnes--3 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .etapes, .colonnes, .chiffres, .colonnes--3 { grid-template-columns: 1fr; } }

/* ---------- Mosaïques et bandes de photos ---------- */
.mosaique-accueil { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 12px; aspect-ratio: 2.2 / 1; }
.mosaique-accueil__item { display: block; border-radius: var(--rayon-s); overflow: hidden; }
.mosaique-accueil__item:first-child { grid-column: span 2; grid-row: span 2; }
.mosaique-accueil__item .photo { height: 100%; }
.mosaique-accueil__item img, .bande-photos__item img, .mosaique__item a img { transition: transform 0.7s var(--doux); }
.mosaique-accueil__item:hover img, .bande-photos__item:hover img, .mosaique__item a:hover img { transform: scale(1.04); }
@media (max-width: 700px) { .mosaique-accueil { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: 150px; aspect-ratio: auto; } .mosaique-accueil__item:first-child { grid-row: span 1; } }
.bande-photos { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.bande-photos__item { display: block; border-radius: var(--rayon-s); overflow: hidden; }
.bande-photos__item .photo { aspect-ratio: 1; }
@media (max-width: 760px) { .bande-photos { grid-template-columns: repeat(3, 1fr); } .bande-photos__item:nth-child(n+4) { display: none; } }
.videos-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.videos-duo figure { margin: 0; }
.videos-duo .video { aspect-ratio: 16 / 9; object-fit: cover; }
.videos-duo figcaption, .mosaique figcaption { font-size: 14px; color: var(--texte-3); padding-top: 10px; }
@media (max-width: 760px) { .videos-duo { grid-template-columns: 1fr; } }

/* ---------- Devis ---------- */
.devis-section__int { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 6vw, 96px); align-items: start; }
.devis-section__texte { position: sticky; top: calc(var(--entete) + 40px); }
.devis-section__contacts { list-style: none; padding: 0; margin: 36px 0 0; display: grid; gap: 14px; border-top: 1px solid var(--ligne-2); padding-top: 28px; }
.devis-section__contacts li { display: flex; gap: 12px; align-items: flex-start; font-size: 15px; }
.devis-section__contacts .ico { width: 20px; height: 20px; margin-top: 2px; color: var(--texte); }
.devis-section__contacts a { color: var(--texte); font-weight: 500; word-break: break-word; }
@media (max-width: 900px) { .devis-section__int { grid-template-columns: 1fr; } .devis-section__texte { position: static; } }

/* ---------- Simulateur de devis ---------- */
.simulateur { background: var(--fond); border: 1px solid var(--ligne); border-radius: var(--rayon); padding: clamp(24px, 3.5vw, 40px); }
.simulateur__progression { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 0; margin: 0 0 32px; font-size: 13px; font-weight: 500; color: var(--texte-3); }
.simulateur__progression li { display: flex; align-items: center; gap: 8px; padding-top: 12px; border-top: 2px solid var(--ligne); transition: border-color 0.2s, color 0.2s; }
.simulateur__progression li span { font-variant-numeric: tabular-nums; }
.simulateur__progression li.est-actif, .simulateur__progression li.est-fait { color: var(--texte); border-top-color: var(--texte); }
.simulateur fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.simulateur legend, .formulaire legend { padding: 0; margin: 0 0 20px; font-size: 1.35rem; font-weight: 500; letter-spacing: -0.02em; line-height: 1.3; color: var(--texte); }
.legende__aide { display: block; margin-top: 4px; font-size: 14px; font-weight: 400; letter-spacing: 0; color: var(--texte-3); }
.simulateur__nav { display: flex; justify-content: space-between; gap: 12px; margin-top: 28px; }
.simulateur__nav .bouton:only-child { margin-left: auto; }
.simulateur.est-pas-a-pas .simulateur__etape:not(.est-courante) { display: none; }
.simulateur:not(.est-pas-a-pas) .simulateur__nav button[type=button] { display: none; }
.simulateur:not(.est-pas-a-pas) .simulateur__progression { display: none; }
.simulateur:not(.est-pas-a-pas) .simulateur__etape + .simulateur__etape { margin-top: 36px; }
.puces { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.puce, .case { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border: 1px solid var(--ligne-2); border-radius: var(--rayon-s); background: var(--fond); cursor: pointer; font-size: 15px; transition: border-color 0.15s, background-color 0.15s, box-shadow 0.15s; }
.puce:hover, .case:hover { border-color: var(--texte-3); }
.puce:has(input:checked), .case:has(input:checked) { border-color: var(--texte); box-shadow: inset 0 0 0 1px var(--texte); background: var(--surface); }
.puce input, .case input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--texte); flex: none; }
.puce span { display: flex; flex-direction: column; line-height: 1.35; }
.puce strong { font-weight: 500; color: var(--texte); }
.puce small { font-size: 13px; color: var(--texte-3); margin-top: 2px; }
@media (max-width: 480px) { .puces { grid-template-columns: 1fr; } }

/* ---------- Champs de formulaire ---------- */
.grille-champs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 16px; }
.champ { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.champ--large { grid-column: 1 / -1; }
.champ label, .champ__etiquette { margin: 0; font-size: 14px; font-weight: 500; color: var(--texte); }
.champ__aide { font-weight: 400; color: var(--texte-3); }
.champ input:not([type=checkbox]):not([type=radio]), .champ select, .champ textarea {
  width: 100%; height: 48px; padding: 0 14px; font: inherit; font-size: 16px; color: var(--texte);
  background: var(--fond); border: 1px solid var(--ligne-2); border-radius: var(--rayon-s);
  transition: border-color 0.15s, box-shadow 0.15s; -webkit-appearance: none; appearance: none;
}
.champ select { padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%23141414' stroke-width='1.5'%3E%3Cpath d='m1 1.5 5 5 5-5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; }
.champ textarea { height: auto; min-height: 120px; padding: 12px 14px; line-height: 1.5; resize: vertical; }
.champ input::placeholder, .champ textarea::placeholder { color: #a5a29c; }
.champ input:focus, .champ select:focus, .champ textarea:focus { outline: none; border-color: var(--texte); box-shadow: 0 0 0 3px rgba(20, 20, 20, 0.08); }
.champ.est-erreur input, .champ.est-erreur select { border-color: var(--accent); background-color: var(--rouge-pale); }
.champ.est-erreur label::after { content: " · à corriger"; color: var(--accent-2); font-weight: 400; }
.champ__erreur { margin: 0 0 12px; font-size: 14px; font-weight: 500; color: var(--accent-2); }
.champ-piege { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.cases { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.cases--colonnes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.case em { font-style: normal; color: var(--texte-3); }
.case--ligne { border: 0; padding: 6px 0; background: none !important; box-shadow: none !important; }
.formulaire__rgpd { margin: 20px 0 0; font-size: 13px; color: var(--texte-3); }
.cf-turnstile { margin-top: 20px; }
@media (max-width: 560px) { .grille-champs, .cases, .cases--colonnes { grid-template-columns: 1fr; } }

.formulaire { background: var(--fond); border: 1px solid var(--ligne); border-radius: var(--rayon); padding: clamp(24px, 4vw, 48px); }
.formulaire fieldset { border: 0; padding: 0; margin: 0 0 40px; min-width: 0; }
.formulaire > .bouton--grand { width: 100%; }
.formulaire--compact { max-width: 420px; padding: 0; border: 0; }
.formulaire-section { padding: 0 0 var(--section); }
.formulaire-section__int { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: clamp(32px, 5vw, 72px); align-items: start; }
.formulaire-aside { display: grid; gap: 16px; position: sticky; top: calc(var(--entete) + 24px); }
.encadre { border: 1px solid var(--ligne); border-radius: var(--rayon); padding: 28px; background: var(--fond); }
.encadre--doux { background: var(--surface); border-color: transparent; }
.encadre h2 { margin: 0 0 12px; font-size: 1.15rem; font-weight: 600; letter-spacing: -0.015em; line-height: 1.3; }
.encadre p { font-size: 15px; }
.encadre p:last-child { margin-bottom: 0; }
.encadre .bouton { margin: 4px 0 12px; }
@media (max-width: 960px) { .formulaire-section__int { grid-template-columns: 1fr; } .formulaire-aside { position: static; } }

/* Commande : sélection des articles */
.selection { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ligne); }
.selection__ligne { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto auto; gap: 16px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--ligne); }
.selection__ligne.est-epuise { opacity: 0.5; }
.selection__photo .photo { aspect-ratio: 1; border-radius: 10px; }
.selection__photo--vide { width: 64px; height: 64px; border-radius: 10px; background: var(--surface); }
.selection__corps label { font-size: 15px; color: var(--texte); cursor: pointer; }
.selection__corps p { margin: 2px 0 0; font-size: 13px; line-height: 1.45; color: var(--texte-3); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.selection__pers { margin-left: 4px; font-size: 13px; font-weight: 400; color: var(--texte-3); }
.selection__prix { font-weight: 600; color: var(--texte); font-variant-numeric: tabular-nums; white-space: nowrap; }
.selection__ligne .pastille { position: static; background: var(--surface); }
.quantite { display: inline-flex; align-items: center; height: 40px; border: 1px solid var(--ligne-2); border-radius: 999px; transition: border-color 0.15s; }
.selection__ligne.est-choisi .quantite { border-color: var(--texte); }
.quantite button { width: 38px; height: 38px; border: 0; border-radius: 999px; background: none; font-size: 18px; color: var(--texte); }
.quantite button:hover { background: var(--surface); }
.quantite input { width: 36px; text-align: center; border: 0; background: none; font: 600 15px var(--sans); color: var(--texte); -moz-appearance: textfield; }
.quantite input::-webkit-outer-spin-button, .quantite input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.quantite input:focus { outline: none; }
.minimum { margin: 16px 0 0; padding: 12px 16px; border-radius: var(--rayon-s); background: var(--rouge-pale); color: #8f1d15; font-size: 14px; }
.recap { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 4px 12px; margin: -16px 0 40px; padding: 18px 20px; border-radius: var(--rayon-s); background: var(--surface); font-weight: 500; color: var(--texte); }
.recap__note { flex-basis: 100%; margin: 0; font-size: 14px; font-weight: 400; color: var(--texte-3); }
.recap strong { font-size: 1.4rem; font-weight: 600; font-variant-numeric: tabular-nums; }
@media (max-width: 640px) { .selection__ligne { grid-template-columns: 56px minmax(0, 1fr); } .selection__prix, .quantite, .selection__ligne .pastille { grid-column: 2; justify-self: start; } .selection__photo--vide { width: 56px; height: 56px; } }

/* ---------- FAQ ---------- */
.faq { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 6vw, 96px); align-items: start; }
.faq .section__tete { margin: 0; }
.faq__liste { border-top: 1px solid var(--ligne); }
.faq__item { border-bottom: 1px solid var(--ligne); }
.faq__item summary { position: relative; padding: 22px 44px 22px 0; list-style: none; cursor: pointer; font-size: 17px; font-weight: 500; line-height: 1.45; color: var(--texte); }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary::after { content: ""; position: absolute; right: 6px; top: 50%; width: 10px; height: 10px; border-right: 1.5px solid var(--texte); border-bottom: 1.5px solid var(--texte); transform: translateY(-70%) rotate(45deg); transition: transform 0.25s var(--doux); }
.faq__item[open] summary::after { transform: translateY(-20%) rotate(-135deg); }
.faq__item p { margin: 0; padding: 0 44px 24px 0; font-size: 16px; }
@media (max-width: 900px) { .faq { grid-template-columns: 1fr; } }

/* ---------- Appel à l'action ---------- */
.cta { padding: 0 0 var(--section); }
.section--surface + .cta, .entete-page + .cta { padding-top: var(--section); }
.cta__int { display: flex; justify-content: space-between; align-items: center; gap: 32px; flex-wrap: wrap; padding: clamp(40px, 6vw, 72px); border-radius: var(--rayon); background: var(--surface); }
.cta__titre { margin: 0 0 10px; font-size: clamp(1.75rem, 3vw, 2.4rem); }
.cta__texte { margin: 0; max-width: 52ch; }
.cta__boutons { display: flex; flex-wrap: wrap; gap: 12px; }

/* ---------- En-tête des pages intérieures ---------- */
.entete-page { padding: clamp(40px, 6vw, 88px) 0 clamp(56px, 7vw, 96px); }
.entete-page__int { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 28px clamp(32px, 6vw, 96px); align-items: end; }
.entete-page h1 { margin: 0; max-width: 14ch; }
.entete-page__intro { margin: 0; font-size: clamp(17px, 1.4vw, 19px); color: var(--texte-2); max-width: 46ch; }
.entete-page__boutons { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.entete-page__visuel { margin-top: clamp(36px, 5vw, 64px); }
.entete-page__visuel .photo { aspect-ratio: 2.4 / 1; border-radius: var(--rayon); }
@media (max-width: 900px) { .entete-page__int { grid-template-columns: 1fr; } .entete-page__visuel .photo { aspect-ratio: 4 / 3; } }

/* ---------- Formules en blocs alternés ---------- */
.formules-alternees { display: grid; gap: clamp(72px, 10vw, 128px); }
.formule-bloc { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 7vw, 112px); align-items: center; }
.formule-bloc:nth-child(even) .formule-bloc__photo { order: 2; }
.formule-bloc__photo .photo, .formule-bloc__photo .video { aspect-ratio: 5 / 4; border-radius: var(--rayon); object-fit: cover; }
.formule-bloc__texte h2 { margin-bottom: 20px; font-size: clamp(1.8rem, 3vw, 2.5rem); }
.formule-bloc__liste { list-style: none; padding: 0; margin: 28px 0 32px; border-top: 1px solid var(--ligne); }
.formule-bloc__liste li { padding: 14px 0; border-bottom: 1px solid var(--ligne); font-size: 15px; }
.formule-bloc__liste strong { display: block; margin-bottom: 2px; color: var(--texte); }
.formule-bloc__actions { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
@media (max-width: 860px) { .formule-bloc { grid-template-columns: 1fr; } .formule-bloc:nth-child(even) .formule-bloc__photo { order: 0; } }

/* ---------- Catalogue (plateaux) ---------- */
.catalogue__filtres { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 40px; }
.filtre { height: 38px; padding: 0 16px; border: 1px solid var(--ligne-2); border-radius: 999px; background: transparent; font-family: var(--sans); font-size: 14px; font-weight: 500; color: var(--texte-2); transition: all 0.15s; }
.filtre:hover { border-color: var(--texte); color: var(--texte); }
.filtre.est-actif { background: var(--texte); border-color: var(--texte); color: #fff; }
.cartes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px 24px; }
.carte { display: flex; flex-direction: column; }
.carte__photo { position: relative; margin-bottom: 18px; border-radius: var(--rayon-s); overflow: hidden; }
.carte__photo .photo { aspect-ratio: 4 / 3; }
.carte__ligne { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
.carte__ligne h3 { margin: 0; font-size: 1.15rem; }
.carte__prix { font-size: 1.05rem; font-weight: 600; color: var(--texte); font-variant-numeric: tabular-nums; white-space: nowrap; }
.carte__personnes { margin: 4px 0 8px; font-size: 14px; color: var(--texte-3); }
.carte__desc { margin: 0 0 16px; font-size: 15px; flex: 1; }
.carte__note { font-size: 14px; color: var(--texte-3); }
.carte .lien-fleche { align-self: flex-start; }
.carte.est-indisponible .carte__photo img { filter: grayscale(1); opacity: 0.55; }
@media (max-width: 960px) { .cartes { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .cartes { grid-template-columns: 1fr; } }
.extras { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 32px; }
.extras__bloc { border-top: 1px solid var(--texte); padding-top: 24px; }
.extras__bloc h2 { margin-bottom: 16px; font-size: 1.4rem; letter-spacing: -0.02em; }
@media (max-width: 860px) { .extras { grid-template-columns: 1fr; } }

/* ---------- Plats du jour ---------- */
.jours-grille { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; align-items: start; }
.jour-carte { border: 1px solid var(--ligne); border-radius: var(--rayon); padding: clamp(24px, 3vw, 36px); }
.jour-carte h3 { margin: 0 0 4px; font-size: 1.5rem; letter-spacing: -0.02em; font-weight: 500; }
.jour-carte__note { margin: 0 0 16px; font-size: 14px; color: var(--texte-3); }
.jour-carte ul { list-style: none; margin: 0; padding: 0; }
.plat { display: flex; gap: 16px; padding: 18px 0; border-top: 1px solid var(--ligne); }
.plat:first-child { border-top: 0; padding-top: 6px; }
.plat__photo { width: 72px; flex: none; }
.plat__photo .photo { aspect-ratio: 1; border-radius: 10px; }
.plat__corps { flex: 1; min-width: 0; }
.plat__ligne { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.plat__ligne strong { color: var(--texte); }
.plat__prix { font-weight: 600; color: var(--texte); font-variant-numeric: tabular-nums; white-space: nowrap; }
.plat p { margin: 4px 0 0; font-size: 14px; }
.plat.est-epuise { opacity: 0.5; }
.plat.est-epuise strong { text-decoration: line-through; }
.jour-carte--ferme { background: var(--surface); border-color: transparent; }
.jour-carte--ferme h3 { color: var(--texte-3); }
@media (max-width: 760px) { .jours-grille { grid-template-columns: 1fr; } }
.encart { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; padding: 20px 24px; border: 1px solid var(--ligne); border-radius: var(--rayon-s); }
.encart p { margin: 0; }

/* ---------- Contact ---------- */
.contact-infos { display: grid; grid-template-columns: 1fr 1.5fr 1fr 1fr; gap: 32px; margin-bottom: clamp(48px, 6vw, 80px); }
.contact-info { display: block; border-top: 1px solid var(--texte); padding-top: 24px; text-decoration: none; color: var(--texte-2); }
a.contact-info:hover { color: var(--texte-2); }
.contact-info .ico { width: 22px; height: 22px; margin-bottom: 18px; color: var(--texte); }
.contact-info h2 { margin: 0 0 8px; font-size: 13px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: var(--texte-3); }
.contact-info p { margin: 0 0 4px; font-size: 17px; font-weight: 500; color: var(--texte); word-break: break-word; }
.contact-info span { font-size: 14px; color: var(--texte-3); }
.contact__lieu { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); border: 1px solid var(--ligne); border-radius: var(--rayon); overflow: hidden; }
.contact__adresse { padding: clamp(28px, 4vw, 48px); }
.contact__adresse h2 { font-size: clamp(1.6rem, 2.6vw, 2.1rem); }
.contact__adresse address { margin-bottom: 12px; font-size: 1.2rem; line-height: 1.45; color: var(--texte); }
.contact__boutons { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.contact__carte-osm iframe { display: block; width: 100%; height: 100%; min-height: 420px; border: 0; filter: grayscale(0.3); }
@media (max-width: 960px) { .contact-infos { grid-template-columns: 1fr 1fr; } .contact__lieu { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .contact-infos { grid-template-columns: 1fr; } }

/* ---------- Galerie ---------- */
.mosaique { columns: 3 280px; column-gap: 16px; }
.mosaique__item { break-inside: avoid; margin: 0 0 20px; }
.mosaique__item[hidden] { display: none; }
.mosaique__item a { display: block; border-radius: var(--rayon-s); overflow: hidden; background: var(--surface); }
.mosaique__duree { color: var(--texte-3); }
.lightbox { border: 0; padding: 0; background: transparent; width: 100vw; height: 100vh; max-width: 100vw; max-height: 100vh; }
.lightbox::backdrop { background: rgba(15, 15, 15, 0.94); }
.lightbox[open] { display: grid; place-items: center; }
.lightbox__figure { margin: 0; max-width: min(1400px, 92vw); max-height: 92vh; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.lightbox__figure img { width: auto; height: auto; max-width: 100%; max-height: 84vh; border-radius: 8px; }
.lightbox__figure figcaption { color: rgba(255, 255, 255, 0.8); font-size: 14px; text-align: center; }
.lightbox__fermer, .lightbox__nav { position: fixed; top: 50%; transform: translateY(-50%); width: 48px; height: 48px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.1); color: #fff; font-size: 28px; line-height: 1; display: grid; place-items: center; }
.lightbox__fermer { top: 20px; right: 20px; transform: none; font-size: 26px; }
.lightbox__nav--prec { left: 20px; }
.lightbox__nav--suiv { right: 20px; }
.lightbox__fermer:hover, .lightbox__nav:hover { background: rgba(255, 255, 255, 0.22); }
@media (max-width: 600px) { .lightbox__nav { top: auto; bottom: 20px; transform: none; } }

/* ---------- Conseils et articles ---------- */
.conseils-grille { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px 24px; }
.conseil-carte { display: flex; flex-direction: column; text-decoration: none; color: var(--texte-2); }
.conseil-carte:hover { color: var(--texte-2); }
.conseil-carte__photo { margin-bottom: 20px; border-radius: var(--rayon-s); overflow: hidden; }
.conseil-carte__photo .photo { aspect-ratio: 3 / 2; }
.conseil-carte__photo img { transition: transform 0.7s var(--doux); }
.conseil-carte:hover .conseil-carte__photo img { transform: scale(1.04); }
.conseil-carte__meta { margin: 0 0 8px; font-size: 13px; color: var(--texte-3); }
.conseil-carte h2 { margin: 0 0 10px; font-size: 1.3rem; line-height: 1.3; letter-spacing: -0.02em; }
.conseil-carte p { margin: 0 0 18px; font-size: 15px; flex: 1; }
.conseil-carte .lien-fleche { align-self: flex-start; }
@media (max-width: 900px) { .conseils-grille { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .conseils-grille { grid-template-columns: 1fr; } }
.article { padding: clamp(40px, 6vw, 88px) 0 var(--section); }
.article__int { max-width: 720px; margin: 0 auto; }
.article__fil { margin: 0 0 28px; font-size: 14px; color: var(--texte-3); }
.article__fil a { color: var(--texte-3); }
.article h1 { margin-bottom: 24px; font-size: clamp(2.2rem, 4.6vw, 3.4rem); }
.article__chapo { font-size: 20px; line-height: 1.55; color: var(--texte-2); }
.article__photo .photo { aspect-ratio: 16 / 9; margin: 40px 0 8px; border-radius: var(--rayon); }
.article h2 { margin: 56px 0 16px; font-size: clamp(1.5rem, 2.6vw, 1.9rem); letter-spacing: -0.025em; }
.article ul { padding-left: 1.2em; }
.article li { margin: 0.4em 0; }
.article__encadre { margin: 40px 0; padding: 24px 28px; border-radius: var(--rayon-s); background: var(--surface); }
.article__encadre p { margin: 0; color: var(--texte); }
.article__pied { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; margin-top: 56px; padding-top: 32px; border-top: 1px solid var(--ligne); }

/* ---------- Pages légales ---------- */
.legale { padding: clamp(40px, 6vw, 88px) 0 var(--section); }
.legale__int { max-width: 760px; }
.legale h1 { font-size: clamp(2.2rem, 4.6vw, 3.4rem); }
.legale h2 { margin: 48px 0 12px; font-size: 1.35rem; letter-spacing: -0.02em; }
.legale p, .legale li { font-size: 16px; }
.legale__chapo { font-size: 19px; color: var(--texte-2); }
.legale__date { margin-top: 48px; font-size: 14px; color: var(--texte-3); }
.tableau { width: 100%; margin: 0 0 1em; border-collapse: collapse; font-size: 14px; }
.tableau th, .tableau td { padding: 12px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--ligne); }
.tableau th { font-weight: 600; color: var(--texte); background: var(--surface); }
@media (max-width: 700px) { .tableau { display: block; overflow-x: auto; } }

/* ---------- Merci, 404 ---------- */
.merci { padding: var(--section) 0; }
.merci__int { max-width: 640px; margin: 0 auto; text-align: center; }
.merci .surtitre { justify-content: center; }
.merci__coche { width: 64px; height: 64px; margin: 0 auto 28px; border-radius: 50%; background: var(--vert-pale); display: grid; place-items: center; }
.merci__coche .ico { width: 28px; height: 28px; color: var(--vert); }
.merci__texte { font-size: 17px; }
.merci__boutons { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 32px; }

/* ---------- Gestion ---------- */
.gestion { padding: clamp(32px, 5vw, 64px) 0 var(--section); }
.gestion__int { max-width: 480px; }
.gestion__int--large { max-width: none; }
.encadre--gestion { padding: 40px; }
.encadre--gestion h1 { font-size: 2rem; }
.gestion__tete { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; flex-wrap: wrap; margin-bottom: 24px; }
.gestion__tete h1 { font-size: clamp(2rem, 4vw, 2.8rem); }
.gestion__aide { font-size: 14px; color: var(--texte-3); }
.gestion__form.formulaire { padding: 0; border: 0; }
.gestion__form fieldset { margin-bottom: 24px; padding: 28px; border: 1px solid var(--ligne); border-radius: var(--rayon); }
.gestion__form legend { margin-left: -8px; padding: 0 8px; }
.gestion__jour { padding: 20px 0; border-top: 1px solid var(--ligne); }
.gestion__jour-tete { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 12px; }
.champ--inline { flex-direction: row; align-items: center; gap: 12px; flex: 1; max-width: 480px; }
.champ--inline label { white-space: nowrap; }
.tableau--gestion td { padding: 6px; border-bottom: 0; }
.tableau--gestion th { padding: 6px; font-size: 13px; background: transparent; }
.tableau--gestion input:not([type=checkbox]), .tableau--gestion select { width: 100%; height: 40px; padding: 0 10px; font: inherit; font-size: 14px; border: 1px solid var(--ligne-2); border-radius: 8px; background: var(--fond); }
.tableau--gestion input[type=checkbox] { width: 20px; height: 20px; accent-color: var(--texte); }
.col-prix { width: 90px; }
.col-photo { width: 170px; }
.col-dispo { width: 64px; text-align: center; }
.gestion__pied { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }

/* ---------- Pied de page ---------- */
.pied { background: var(--surface); color: var(--texte-2); padding: clamp(56px, 7vw, 96px) 0 0; font-size: 15px; --dycast-credit-fond: transparent; --dycast-credit-couleur: var(--texte-3); }
.pied a { color: var(--texte-2); text-decoration: none; }
.pied a:hover { color: var(--texte); text-decoration: underline; }
.pied .bouton--chaud, .pied .bouton--chaud:hover { color: #fff; text-decoration: none; }
.pied .marque, .pied .marque:hover { color: var(--texte); text-decoration: none; }
.pied__grille { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.3fr; gap: 40px; padding-bottom: 56px; }
.pied__baseline { margin: 20px 0 24px; max-width: 34ch; }
.pied__titre { margin: 0 0 16px; font-size: 13px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: var(--texte-3); }
.pied__colonne a { display: block; padding: 4px 0; }
.pied__contact address { margin-bottom: 8px; color: var(--texte); }
.pied__mail { overflow-wrap: anywhere; }
.pied__horaire { margin: 10px 0 0; font-size: 14px; color: var(--texte-3); }
.pied__bas { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 24px 0; border-top: 1px solid var(--ligne); font-size: 13px; color: var(--texte-3); }
.pied__bas p { margin: 0; }
.pied__bas a { color: var(--texte-3); }
.pied .dycast-credit { border-top: 1px solid var(--ligne); }
@media (max-width: 900px) { .pied__grille { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .pied__grille { grid-template-columns: 1fr; } }

/* ---------- Apparitions au défilement ---------- */
.reveler { opacity: 0; transform: translateY(16px); transition: opacity 0.8s var(--doux), transform 0.8s var(--doux); }
.reveler.est-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .reveler { opacity: 1; transform: none; transition: none; } .prestation__photo img, .lien-fleche .ico { transition: none; } }
.chiffres + .encart { margin-top: 56px; }
.rappel-annonce { margin-bottom: 40px; } .rappel-annonce strong { color: var(--texte); margin-right: 4px; }
.annonce-modale__corps:focus { outline: none; }

/* ---------- Pages locales et zones desservies ---------- */
.preuves--seules { margin-top: 0; }
.duo__visuel--carte iframe { display: block; width: 100%; aspect-ratio: 4 / 5; border: 0; border-radius: var(--rayon); background: var(--surface-2); filter: grayscale(0.2); }
@media (max-width: 900px) { .duo__visuel--carte iframe { aspect-ratio: 4 / 3; } }
.communes-voisines__titre { margin: 28px 0 12px; font-size: 15px; font-weight: 500; color: var(--texte); }
.communes-voisines { list-style: none; margin: 0 0 28px; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; border-top: 1px solid var(--ligne-2); }
.communes-voisines li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--ligne-2); font-size: 15px; }
.communes-voisines a { color: var(--texte); text-decoration: none; }
.communes-voisines a:hover { text-decoration: underline; }
.communes-voisines span { color: var(--texte-3); font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 480px) { .communes-voisines { grid-template-columns: 1fr; } }
.zones-secteur { padding: 40px 0; border-top: 1px solid var(--ligne); display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 24px clamp(32px, 6vw, 96px); }
.zones-secteur:first-child { border-top: 0; padding-top: 0; }
.zones-secteur h2 { font-size: clamp(1.4rem, 2.4vw, 1.8rem); letter-spacing: -0.025em; margin: 0 0 8px; }
.zones-secteur__meta { margin: 0; font-size: 14px; color: var(--texte-3); }
.zones-liste { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 24px; }
.zones-liste li { border-bottom: 1px solid var(--ligne); }
.zones-liste a { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; font-size: 15px; color: var(--texte); text-decoration: none; }
.zones-liste a:hover span:first-child { text-decoration: underline; }
.zones-liste a span:last-child { color: var(--texte-3); font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 900px) { .zones-secteur { grid-template-columns: 1fr; } .zones-liste { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .zones-liste { grid-template-columns: 1fr; } }
.pied__zones { padding: 0 0 32px; font-size: 13px; line-height: 1.8; color: var(--texte-3); }
.pied__zones a { color: var(--texte-2); }
.zones-methode { margin-top: 40px; }

.grille-champs--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 760px) { .grille-champs--3 { grid-template-columns: 1fr; } }
.gestion__pied--mdp { margin-top: 20px; }
.gestion__oubli { margin: 20px 0 0; }

/* ---------- Page de paiement (/payer/<jeton>/) ---------- */
.paiement__int { max-width: 640px; }
.paiement h1 { margin-bottom: 20px; }
.paiement .alerte { margin: 0 0 20px; }
.paiement__recap { border: 1px solid var(--ligne); border-radius: var(--rayon); padding: 24px; margin: 8px 0 24px; background: var(--fond); }
.paiement__libelle { margin: 0 0 4px; color: var(--texte-2); }
.paiement__montant { color: var(--texte); font-size: clamp(2.2rem, 5vw, 3rem); font-weight: 600; letter-spacing: -0.03em; line-height: 1.1; margin: 0 0 12px; }
.paiement__recap .liste-prix { margin: 16px 0 0; }
.paiement__securite { margin-top: 14px; }

/* ---------- Commande en ligne (2026-10-06) ---------- */
.selection__ligne.est-hors-jour { opacity: 0.45; }
.selection__ligne.est-hors-jour .quantite { pointer-events: none; }
.formulaire__securite { margin: 12px 0 0; font-size: 13px; color: var(--texte-3); }
.commandes-fermees { max-width: 720px; padding-top: clamp(16px, 3vw, 32px); padding-bottom: clamp(48px, 7vw, 96px); }
.commandes-fermees h2 { margin-bottom: 16px; }
.actions-ligne { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
[data-date-message] { display: block; margin: 6px 0 0; font-size: 14px; }