/* ═══════════════════════════════════════════════════════════════
   JLC — Jennifer, cheffe à domicile · Alès (Gard)
   Plancha · Paella · Broche — traiteur événementiel
   Direction artistique : rose pastel & or, esprit champêtre,
   reprise fidèle de la carte de visite (logo, script, laurier).
   ═══════════════════════════════════════════════════════════════ */

:root{
  /* — Palette (6 couleurs nommées) — */
  --creme:        #FDF7F4;   /* fond principal, papier */
  --rose-poudre:  #F8E7E4;   /* aplats doux, cartes */
  --rose-aquarelle:#F3D6D3;  /* lavis, bordures */
  --rose-blush:   #E79AA1;   /* rose du logo */
  --rose-profond: #BE5B6B;   /* titres roses, accents forts */
  --or:           #C0924F;   /* or du monogramme */
  --or-clair:     #E4C68D;   /* filets, éclats */
  --or-sombre:    #9A7333;
  --encre:        #453C36;   /* texte courant */
  --encre-doux:   #7C6E66;
  --encre-nuit:   #33292A;   /* fonds sombres rares */

  --ombre:        rgba(190,91,107,.10);
  --ombre-forte:  rgba(69,60,54,.16);

  --ease-out-expo: cubic-bezier(.16,1,.3,1);
  --ease-smooth:   cubic-bezier(.25,.46,.45,.94);

  --radius:   14px;
  --radius-l: 26px;
  --pad-x: clamp(1.15rem, 5vw, 4rem);
  --sec-y: clamp(4.5rem, 10vw, 9rem);
  --maxw: 1200px;

  --f-display:'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --f-script: 'Great Vibes', 'Cormorant Garamond', cursive;
  --f-body:   'Mulish', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* ── Base ────────────────────────────────────────────────────── */
*,*::before,*::after{ box-sizing:border-box; }
html{ overflow-x:clip; scroll-behavior:smooth; -webkit-text-size-adjust:100%; scroll-padding-top:5rem; }
body{
  margin:0; overflow-x:clip;
  background:var(--creme);
  color:var(--encre);
  font-family:var(--f-body);
  font-size:clamp(1rem,.97rem + .18vw,1.07rem);
  line-height:1.75; font-weight:400;
  -webkit-font-smoothing:antialiased;
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; }
button{ font:inherit; color:inherit; }
h1,h2,h3,h4{ margin:0; font-family:var(--f-display); font-weight:500; line-height:1.08; letter-spacing:-.005em; }
p{ margin:0 0 1.1em; }
ul,ol{ margin:0; padding:0; list-style:none; }

::selection{ background:var(--rose-blush); color:#fff; }
::-webkit-scrollbar{ width:10px; }
::-webkit-scrollbar-track{ background:var(--rose-poudre); }
::-webkit-scrollbar-thumb{ background:var(--or-clair); border-radius:8px; }
::-webkit-scrollbar-thumb:hover{ background:var(--or); }

:focus-visible{ outline:2px solid var(--rose-profond); outline-offset:3px; border-radius:3px; }

.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.skip-link{
  position:fixed; top:-100px; left:1rem; z-index:400;
  background:var(--rose-profond); color:#fff;
  padding:.7rem 1.2rem; border-radius:100px;
  font-size:.82rem; font-weight:700; text-decoration:none;
  transition:top .25s var(--ease-out-expo);
}
.skip-link:focus{ top:1rem; }

.container{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 var(--pad-x); }

/* lavis aquarelle très discret, façon papier de la carte */
body::before{
  content:''; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(58vw 46vw at 6% -6%,  rgba(243,214,211,.62), transparent 62%),
    radial-gradient(52vw 42vw at 104% 22%, rgba(248,231,228,.72), transparent 60%),
    radial-gradient(66vw 50vw at 82% 102%, rgba(243,214,211,.55), transparent 62%);
}

/* ── Typographie partagée ────────────────────────────────────── */
.label{
  font-family:var(--f-body); font-size:.69rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.22em;
  color:var(--or-sombre); margin:0 0 1.1rem;
}
.label--clair{ color:var(--or-clair); }
.h2{ font-size:clamp(2rem,1.15rem + 3.4vw,3.9rem); margin:0 0 1.4rem; color:var(--encre); }
.h2 em{ font-style:italic; color:var(--rose-profond); }
.h2--clair{ color:var(--creme); }
.h2--clair em{ color:var(--or-clair); }
.script{ font-family:var(--f-script); font-weight:400; color:var(--rose-profond); line-height:1.3; }
.chapo{ font-size:clamp(1.05rem,1rem + .35vw,1.22rem); color:var(--encre-doux); max-width:60ch; }

/* ── Ornement doré (filet + laurier de la carte) ─────────────── */
.orn{ display:block; width:min(360px,72%); margin:0 auto; height:auto; color:var(--or); }
.orn--gauche{ margin-left:0; }
.orn path,.orn line{ vector-effect:non-scaling-stroke; }
.orn .trait{
  stroke:currentColor; stroke-width:1.1; fill:none; stroke-linecap:round;
  stroke-dasharray:var(--len,300); stroke-dashoffset:var(--len,300);
}
.orn .feuille{ fill:currentColor; opacity:0; transform-origin:center; }
.orn.is-on .trait{ animation:tracer 1.15s var(--ease-out-expo) forwards; }
.orn.is-on .feuille{ animation:eclore .5s var(--ease-out-expo) forwards; }
.orn.is-on .feuille:nth-of-type(n){ animation-delay:calc(.45s + var(--i,0) * .055s); }
@keyframes tracer{ to{ stroke-dashoffset:0; } }
@keyframes eclore{ from{ opacity:0; transform:scale(.4); } to{ opacity:1; transform:scale(1); } }

/* ── Boutons ─────────────────────────────────────────────────── */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  padding:.92rem 1.8rem; border:1.5px solid transparent; border-radius:100px;
  font-size:.79rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  text-decoration:none; cursor:pointer; white-space:nowrap;
  transition:transform .32s var(--ease-out-expo), box-shadow .32s var(--ease-out-expo),
             background-color .28s var(--ease-smooth), color .28s var(--ease-smooth),
             border-color .28s var(--ease-smooth);
}
.btn:hover{ transform:translateY(-2px); }
.btn svg{ width:16px; height:16px; fill:currentColor; flex:none; }
.btn--primary{ background:var(--rose-profond); color:#fff; box-shadow:0 8px 24px rgba(190,91,107,.26); }
.btn--primary:hover{ background:#a94b5b; box-shadow:0 14px 32px rgba(190,91,107,.34); }
.btn--or{ background:var(--or); color:#fff; box-shadow:0 8px 24px rgba(192,146,79,.26); }
.btn--or:hover{ background:var(--or-sombre); box-shadow:0 14px 32px rgba(192,146,79,.34); }
.btn--outline{ border-color:var(--or); color:var(--or-sombre); background:rgba(255,255,255,.5); }
.btn--outline:hover{ background:var(--or); color:#fff; }
.btn--ghost{ border-color:rgba(228,198,141,.6); color:var(--creme); background:rgba(255,255,255,.07); }
.btn--ghost:hover{ background:var(--or-clair); color:var(--encre-nuit); border-color:var(--or-clair); }

/* ── Navigation ──────────────────────────────────────────────── */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:200;
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; padding:.85rem var(--pad-x);
  transition:background-color .4s var(--ease-smooth), box-shadow .4s var(--ease-smooth), padding .4s var(--ease-smooth);
}
.nav.is-collee{
  background:rgba(253,247,244,.93);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  box-shadow:0 1px 0 rgba(192,146,79,.22), 0 10px 30px rgba(69,60,54,.06);
  padding-top:.55rem; padding-bottom:.55rem;
}
.nav__marque{ display:flex; align-items:center; gap:.65rem; text-decoration:none; flex:none; }
.nav__logo{ width:auto; height:44px; transition:height .4s var(--ease-smooth); }
.nav.is-collee .nav__logo{ height:36px; }
.nav__mot{ display:flex; flex-direction:column; line-height:1; }
.nav__mot b{ font-family:var(--f-display); font-size:1.18rem; font-weight:600; letter-spacing:.16em; color:var(--or-sombre); }
.nav__mot span{ font-family:var(--f-body); font-size:.6rem; font-weight:600; letter-spacing:.19em; text-transform:uppercase; color:var(--rose-profond); margin-top:.22rem; }

.nav__liens{ display:flex; align-items:center; gap:clamp(.9rem,2vw,1.9rem); }
.nav__liens a{
  position:relative; font-size:.78rem; font-weight:600; letter-spacing:.09em;
  text-transform:uppercase; text-decoration:none; color:var(--encre); padding:.35rem 0;
}
.nav__liens a::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:1.5px;
  background:var(--or); transform:scaleX(0); transform-origin:right;
  transition:transform .4s var(--ease-out-expo);
}
.nav__liens a:hover::after,.nav__liens a:focus-visible::after{ transform:scaleX(1); transform-origin:left; }
.nav__cta{ padding:.62rem 1.25rem; font-size:.72rem; }

.burger{
  display:none; position:relative; z-index:3;
  width:44px; height:44px; border:0; background:transparent;
  cursor:pointer; padding:0; place-items:center; border-radius:50%;
}
.burger span{ display:block; width:22px; height:2px; background:var(--encre); margin:4px auto; border-radius:2px;
  transition:transform .38s var(--ease-out-expo), opacity .2s linear; }
.burger.is-ouvert span:nth-child(1){ transform:translateY(10px) rotate(45deg); }
.burger.is-ouvert span:nth-child(2){ opacity:0; }
.burger.is-ouvert span:nth-child(3){ transform:translateY(-10px) rotate(-45deg); }

@media (max-width:920px){
  .burger{ display:grid; }
  .nav__liens{
    position:fixed; z-index:2; inset:0 0 0 auto; width:min(88vw,340px);
    flex-direction:column; justify-content:center; align-items:flex-start;
    gap:1.35rem; padding:5rem 2rem;
    background:var(--creme); border-left:1px solid var(--rose-aquarelle);
    box-shadow:-20px 0 60px rgba(69,60,54,.14);
    transform:translateX(100%); transition:transform .5s var(--ease-out-expo);
    overflow-y:auto;
  }
  .nav__liens.is-ouvert{ transform:translateX(0); }
  .nav__liens a{ font-size:1rem; }
  .nav__cta{ margin-top:.6rem; }
}

/* ── HERO — signature de la page ─────────────────────────────── */
.hero{
  position:relative; min-height:100svh; display:grid; place-items:center;
  padding:7rem var(--pad-x) 4.5rem; text-align:center; overflow:hidden;
}
.hero__fond{ position:absolute; inset:-8% -4%; z-index:0; }
.hero__fond img{
  width:100%; height:100%; object-fit:cover;
  filter:saturate(.72) brightness(1.06) blur(1.5px);
  will-change:transform;
}
.hero__voile{
  position:absolute; inset:0; z-index:1;
  background:
    radial-gradient(66% 56% at 50% 40%, rgba(253,247,244,.90), rgba(253,247,244,.70) 44%, rgba(248,231,228,.52) 72%),
    linear-gradient(180deg, rgba(253,247,244,.82) 0%, rgba(248,231,228,.34) 40%, rgba(253,247,244,.72) 82%, var(--creme) 99%);
}
.hero__in{ position:relative; z-index:2; width:100%; max-width:820px; }

.hero__logo{
  width:min(400px,74vw); margin:0 auto;
  opacity:0; transform:translateY(22px) scale(.965);
  filter:drop-shadow(0 14px 34px rgba(190,91,107,.16));
}
.hero__h1{ margin:1.1rem 0 0; }
.hero__h1 .sur{
  display:block; font-family:var(--f-body); font-size:.7rem; font-weight:700;
  letter-spacing:.34em; text-transform:uppercase; color:var(--or-sombre);
  opacity:0; transform:translateY(14px);
}
.hero__h1 .villes{
  display:block; font-family:var(--f-display); font-style:italic;
  font-size:clamp(1.25rem,.9rem + 1.5vw,1.9rem); color:var(--encre-doux);
  margin-top:.5rem; opacity:0; transform:translateY(14px);
}

.hero__orn{ margin:1.6rem auto 1.5rem; }

/* les trois feux : plancha · paella · broche */
.feux{ display:flex; flex-wrap:wrap; justify-content:center; gap:clamp(1rem,3.5vw,2.9rem); margin:0 0 2.2rem; }
.feu{
  display:flex; align-items:center; gap:.6rem;
  font-family:var(--f-display); font-size:clamp(1.45rem,1rem + 1.9vw,2.5rem);
  color:var(--encre); letter-spacing:.005em;
  opacity:0; transform:translateY(16px);
}
.feu svg{ width:.72em; height:.9em; flex:none; overflow:visible; }
.feu .flamme{ fill:var(--or); transform-origin:50% 85%; }
.feu.is-on .flamme{ animation:vaciller 3.2s var(--ease-smooth) infinite; }
.feu:nth-child(2).is-on .flamme{ animation-delay:-1.1s; }
.feu:nth-child(3).is-on .flamme{ animation-delay:-2.2s; }
@keyframes vaciller{
  0%,100%{ transform:scale(1) rotate(0deg); }
  30%    { transform:scale(1.07,.95) rotate(-3deg); }
  62%    { transform:scale(.96,1.06) rotate(2.5deg); }
}
.hero__actions{ display:flex; flex-wrap:wrap; gap:.8rem; justify-content:center; opacity:0; transform:translateY(16px); }

/* choréographie d'entrée (stagger 70 ms) */
.js .hero__logo{ animation:monter 1.15s var(--ease-out-expo) .15s forwards; }
.js .hero__h1 .sur{ animation:monter .9s var(--ease-out-expo) .55s forwards; }
.js .hero__h1 .villes{ animation:monter .9s var(--ease-out-expo) .62s forwards; }
.js .feu:nth-child(1){ animation:monter .9s var(--ease-out-expo) .90s forwards; }
.js .feu:nth-child(2){ animation:monter .9s var(--ease-out-expo) .97s forwards; }
.js .feu:nth-child(3){ animation:monter .9s var(--ease-out-expo) 1.04s forwards; }
.js .hero__actions{ animation:monter .9s var(--ease-out-expo) 1.18s forwards; }
@keyframes monter{ to{ opacity:1; transform:none; } }

.hero__scroll{
  position:absolute; left:50%; bottom:1.6rem; z-index:2; transform:translateX(-50%);
  display:grid; justify-items:center; gap:.5rem;
  font-size:.62rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase;
  color:var(--or-sombre); text-decoration:none;
}
.hero__scroll i{ display:block; width:1px; height:38px; background:linear-gradient(var(--or),transparent); }
.hero__scroll:hover i{ animation:filer 1.1s var(--ease-smooth) infinite; }
@keyframes filer{ 0%{ transform:scaleY(.4); transform-origin:top; } 100%{ transform:scaleY(1); transform-origin:top; } }

/* ── Reveals génériques ──────────────────────────────────────── */
.js .reveal{ opacity:0; transform:translateY(26px); transition:opacity .9s var(--ease-out-expo), transform .9s var(--ease-out-expo); }
.js .reveal.is-visible{ opacity:1; transform:none; }
.js .reveal[data-d="1"]{ transition-delay:.07s; }
.js .reveal[data-d="2"]{ transition-delay:.14s; }
.js .reveal[data-d="3"]{ transition-delay:.21s; }
.js .reveal[data-d="4"]{ transition-delay:.28s; }
.js .reveal[data-d="5"]{ transition-delay:.35s; }
.js .reveal[data-d="6"]{ transition-delay:.42s; }

/* ── Manifeste ───────────────────────────────────────────────── */
.manifeste{ padding:var(--sec-y) 0; text-align:center; }
.manifeste__phrase{
  font-family:var(--f-display); font-size:clamp(1.75rem,1.1rem + 2.9vw,3.35rem);
  font-weight:400; line-height:1.22; max-width:20ch; margin:0 auto 1.4rem; color:var(--encre);
}
.manifeste__phrase em{ font-style:italic; color:var(--rose-profond); }
.manifeste__sig{ font-size:clamp(1.6rem,1.2rem + 1.6vw,2.4rem); }

/* ── Cheffe ──────────────────────────────────────────────────── */
.cheffe{ padding:var(--sec-y) 0; }
.cheffe__grid{ display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.cheffe__media{ position:relative; }
.cheffe__media img{
  width:100%; aspect-ratio:4/5; object-fit:cover;
  border-radius:180px 180px var(--radius-l) var(--radius-l);
  box-shadow:0 26px 60px rgba(69,60,54,.14);
}
.cheffe__media::after{
  content:''; position:absolute; inset:14px 14px -14px -14px; z-index:-1;
  border:1px solid var(--or-clair);
  border-radius:180px 180px var(--radius-l) var(--radius-l);
}
.parcours{ margin:2rem 0 0; display:grid; gap:.1rem; }
.parcours li{ display:grid; grid-template-columns:auto 1fr; gap:1rem; align-items:start; padding:.72rem 0; border-bottom:1px dashed var(--rose-aquarelle); }
.parcours li:last-child{ border-bottom:0; }
.parcours b{ font-family:var(--f-display); font-size:1.28rem; font-weight:600; color:var(--or); line-height:1.5; min-width:3.2rem; }
.parcours span{ color:var(--encre-doux); }
.parcours strong{ color:var(--encre); font-weight:600; }

/* ── Prestations ─────────────────────────────────────────────── */
.prestations{ padding:var(--sec-y) 0; background:linear-gradient(180deg, transparent, rgba(248,231,228,.55) 18%, rgba(248,231,228,.55) 82%, transparent); }
.prestations__tete{ max-width:64ch; margin:0 0 clamp(2.2rem,5vw,3.4rem); }
.cartes{ display:grid; grid-template-columns:repeat(auto-fit,minmax(236px,1fr)); gap:clamp(1rem,2.2vw,1.6rem); }
.carte{
  position:relative; display:flex; flex-direction:column; overflow:hidden;
  background:var(--creme); border:1px solid var(--rose-aquarelle);
  border-radius:var(--radius-l);
  transition:transform .45s var(--ease-out-expo), box-shadow .45s var(--ease-out-expo), border-color .45s var(--ease-smooth);
}
.carte:hover{ transform:translateY(-5px); box-shadow:0 22px 48px rgba(190,91,107,.14); border-color:var(--or-clair); }
.carte__media{ position:relative; overflow:hidden; }
.carte__media img{ width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform .8s var(--ease-out-expo); }
.carte:hover .carte__media img{ transform:scale(1.05); }
.carte__num{
  position:absolute; top:.85rem; left:.9rem; z-index:2;
  display:grid; place-items:center; width:34px; height:34px; border-radius:50%;
  background:rgba(253,247,244,.92); color:var(--or-sombre);
  font-family:var(--f-display); font-size:1rem; font-weight:600;
}
.carte__corps{ padding:1.5rem 1.5rem 1.7rem; display:flex; flex-direction:column; flex:1; }
.carte__t{ font-size:1.6rem; margin:0 0 .55rem; }
.carte__p{ font-size:.94rem; color:var(--encre-doux); margin:0 0 1rem; }
.carte__liste{ display:flex; flex-wrap:wrap; gap:.4rem; margin-top:auto; }
.carte__liste li{
  font-size:.71rem; font-weight:600; letter-spacing:.05em; text-transform:uppercase;
  color:var(--or-sombre); background:var(--rose-poudre);
  border-radius:100px; padding:.3rem .72rem;
}
.carte__jauge{
  margin-top:1rem; padding-top:.9rem; border-top:1px dashed var(--rose-aquarelle);
  font-size:.8rem; font-weight:700; letter-spacing:.04em; color:var(--rose-profond);
}

/* ── Répertoire (carte dépliante) ────────────────────────────── */
.repertoire{ padding:var(--sec-y) 0; }
.repertoire__grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.25fr); gap:clamp(2rem,5vw,4rem); align-items:start; }
.repertoire__tete{ position:sticky; top:6.5rem; }
.plats{ display:grid; gap:.55rem; }
.plat{ border:1px solid var(--rose-aquarelle); border-radius:var(--radius); background:var(--creme); overflow:hidden; transition:border-color .3s var(--ease-smooth), box-shadow .3s var(--ease-smooth); }
.plat[open]{ border-color:var(--or-clair); box-shadow:0 10px 30px rgba(190,91,107,.09); }
.plat__t{
  display:flex; align-items:center; gap:.9rem; cursor:pointer; list-style:none;
  padding:1.05rem 1.3rem; font-family:var(--f-display); font-size:1.28rem; font-weight:600; color:var(--encre);
}
.plat__t::-webkit-details-marker{ display:none; }
.plat__t:hover{ color:var(--rose-profond); }
.plat__t i{
  margin-left:auto; flex:none; position:relative; width:15px; height:15px;
  transition:transform .4s var(--ease-out-expo);
}
.plat__t i::before,.plat__t i::after{ content:''; position:absolute; inset:50% 0 auto 0; height:1.5px; background:var(--or); border-radius:2px; }
.plat__t i::after{ transform:rotate(90deg); transition:transform .4s var(--ease-out-expo); }
.plat[open] .plat__t i{ transform:rotate(180deg); }
.plat[open] .plat__t i::after{ transform:rotate(0deg); }
.plat__c{ padding:0 1.3rem 1.3rem; color:var(--encre-doux); font-size:.95rem; }
.plat__c ul{ display:grid; gap:.45rem; }
.plat__c li{ position:relative; padding-left:1.15rem; }
.plat__c li::before{ content:''; position:absolute; left:0; top:.72em; width:5px; height:5px; border-radius:50%; background:var(--or-clair); }
.plat__c em{ color:var(--rose-profond); font-style:italic; }

/* ── Formats & jauges ────────────────────────────────────────── */
.formats{ padding:var(--sec-y) 0; }
.formats__panneau{
  position:relative; overflow:hidden; border-radius:var(--radius-l);
  background:var(--encre-nuit); color:var(--creme);
  padding:clamp(2.2rem,5vw,4rem);
}
.formats__panneau::before{
  content:''; position:absolute; inset:0; opacity:.2;
  background:url('../assets/img/braises-broche-feu-de-bois.jpg') center/cover;
}
.formats__panneau::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(115deg, rgba(51,41,42,.95), rgba(51,41,42,.72) 55%, rgba(190,91,107,.45));
}
.formats__in{ position:relative; z-index:2; }
.jauges{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:clamp(1.2rem,3vw,2.2rem); margin:2.2rem 0 2.6rem; }
.jauge{ border-top:1px solid rgba(228,198,141,.4); padding-top:1.1rem; }
.jauge b{ display:block; font-family:var(--f-display); font-size:clamp(2.4rem,1.6rem + 2.6vw,3.6rem); font-weight:500; color:var(--or-clair); line-height:1; }
.jauge span{ display:block; font-size:.86rem; color:rgba(253,247,244,.76); margin-top:.45rem; }
.occasions{ display:flex; flex-wrap:wrap; gap:.5rem; }
.occasions li{
  font-size:.73rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  color:var(--or-clair); border:1px solid rgba(228,198,141,.42);
  border-radius:100px; padding:.36rem .9rem;
}

/* ── Dressage ────────────────────────────────────────────────── */
.dressage{ padding:var(--sec-y) 0; }
.dressage__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:clamp(1.2rem,3vw,2.4rem); align-items:center; }
.dressage__media{ display:grid; grid-template-columns:1fr 1fr; gap:.8rem; }
.dressage__media img{ width:100%; height:100%; object-fit:cover; border-radius:var(--radius); box-shadow:0 16px 38px rgba(69,60,54,.12); }
.dressage__media img:first-child{ aspect-ratio:3/4; margin-top:2.2rem; }
.dressage__media img:last-child{ aspect-ratio:3/4; }

/* ── Desserts (partenaire) ───────────────────────────────────── */
.desserts{ padding:var(--sec-y) 0; background:linear-gradient(180deg, transparent, rgba(248,231,228,.6) 20%, rgba(248,231,228,.6) 80%, transparent); }
.desserts__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:clamp(1.6rem,4vw,3rem); align-items:center; }
.desserts__media img{ width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:var(--radius-l); box-shadow:0 22px 50px rgba(190,91,107,.16); }
.partenaire{
  border:1px dashed var(--or-clair); border-radius:var(--radius-l);
  background:rgba(253,247,244,.7); padding:clamp(1.4rem,3vw,2rem);
  margin-top:1.4rem;
}
.partenaire__slot{ position:relative; width:100%; aspect-ratio:16/10; border-radius:var(--radius); overflow:hidden; background:var(--rose-poudre); display:grid; place-items:center; text-align:center; padding:1.2rem; }
.partenaire__slot iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.partenaire__vide{ font-size:.88rem; color:var(--encre-doux); max-width:34ch; }
.partenaire__vide b{ display:block; font-family:var(--f-display); font-size:1.3rem; color:var(--or-sombre); margin-bottom:.35rem; }

/* ── Producteurs ─────────────────────────────────────────────── */
.producteurs{ padding:var(--sec-y) 0; }
.producteurs__grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(215px,1fr));
  gap:clamp(.9rem,2vw,1.4rem); margin-top:clamp(2rem,4vw,3rem);
}
.prod{
  border:1px solid var(--rose-aquarelle); border-radius:var(--radius-l);
  background:var(--creme); padding:1.6rem 1.5rem 1.7rem;
  display:grid; gap:.3rem; align-content:start;
  transition:border-color .4s var(--ease-smooth), box-shadow .4s var(--ease-out-expo), transform .4s var(--ease-out-expo);
}
.prod:hover{ border-color:var(--or-clair); box-shadow:0 16px 38px rgba(190,91,107,.11); transform:translateY(-4px); }
.prod__role{
  margin:0 0 .7rem; font-size:.66rem; font-weight:700;
  letter-spacing:.2em; text-transform:uppercase; color:var(--or-sombre);
}
.prod__nom{ font-family:var(--f-display); font-size:1.45rem; font-weight:600; color:var(--encre); line-height:1.2; min-height:1.2em; }
.prod__nom a{ text-decoration:none; }
.prod__nom a:hover{ color:var(--rose-profond); }
.prod__lieu{ margin:.15rem 0 0; font-size:.86rem; font-style:italic; color:var(--rose-profond); min-height:1.4em; }
.prod__quoi{
  margin:1rem 0 0; padding-top:.85rem; border-top:1px dashed var(--rose-aquarelle);
  font-size:.88rem; color:var(--encre-doux);
}

/* trou à remplir par le client — filet doré discret */
.trou{
  display:inline-block; vertical-align:baseline;
  width:8.5ch; height:.62em;
  border-bottom:1.5px dotted var(--or-clair);
}
.trou--long{ width:11ch; }

/* ── Galerie — ruban défilant ─────────────────────────────────
   Défilement continu en CSS (transform seul, GPU).
   Le piste est dupliquée en JS pour une boucle sans couture.
   Pause au survol, au focus clavier, et par bouton (WCAG 2.2.2).
   ───────────────────────────────────────────────────────────── */
.galerie{ padding:var(--sec-y) 0; }
.galerie__tete{
  display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between;
  gap:1.2rem 2rem; margin-bottom:clamp(1.8rem,4vw,2.8rem);
}
.galerie__tete .chapo{ margin:0; }

.ruban__pause{
  display:inline-flex; align-items:center; gap:.55rem; flex:none;
  padding:.6rem 1.15rem; border:1px solid var(--or-clair); border-radius:100px;
  background:rgba(255,255,255,.6); color:var(--or-sombre); cursor:pointer;
  font-size:.72rem; font-weight:700; letter-spacing:.11em; text-transform:uppercase;
  transition:background-color .28s var(--ease-smooth), color .28s var(--ease-smooth),
             border-color .28s var(--ease-smooth), transform .28s var(--ease-out-expo);
}
.ruban__pause:hover{ background:var(--or); color:#fff; border-color:var(--or); transform:translateY(-2px); }
.ruban__ic{ width:13px; height:13px; fill:currentColor; flex:none; }
.ruban__ic--play{ display:none; }
.ruban__pause[aria-pressed="true"] .ruban__ic--pause{ display:none; }
.ruban__pause[aria-pressed="true"] .ruban__ic--play{ display:block; }

.ruban{
  position:relative; overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
          mask-image:linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}
.ruban__piste{
  display:flex; width:max-content; gap:.85rem;
  will-change:transform;
}
.js .ruban.est-prete .ruban__piste{
  animation:defiler var(--duree,90s) linear infinite;
}
/* spécificité >= à la règle d'animation ci-dessus, sinon le
   raccourci `animation` remet play-state à running */
.js .ruban.est-prete:hover .ruban__piste,
.js .ruban.est-prete:focus-within .ruban__piste,
.js .ruban.est-prete.est-arretee .ruban__piste{ animation-play-state:paused; }
@keyframes defiler{
  from{ transform:translate3d(0,0,0); }
  to  { transform:translate3d(-50%,0,0); }
}

.ruban__vue{
  margin:0; flex:none; overflow:hidden; border-radius:var(--radius);
  height:clamp(190px,26vw,320px);
  box-shadow:0 10px 26px rgba(69,60,54,.08);
}
.ruban__vue img{
  width:auto; height:100%; max-width:none; object-fit:cover;
  transition:transform .8s var(--ease-out-expo);
}
.ruban__vue:hover img{ transform:scale(1.05); }

/* sans JS, ou en mouvement réduit : ruban parcourable à la main */
.ruban:not(.est-prete){ overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; }
.ruban:not(.est-prete) .ruban__vue{ scroll-snap-align:center; }
.ruban:not(.est-prete)::-webkit-scrollbar{ height:6px; }

/* ── FAQ ─────────────────────────────────────────────────────── */
.faq{ padding:var(--sec-y) 0; }
.faq__grid{ display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(2rem,5vw,4rem); align-items:start; }

/* ── Contact ─────────────────────────────────────────────────── */
.contact{ padding:var(--sec-y) 0; }
.contact__panneau{
  border-radius:var(--radius-l); overflow:hidden;
  background:var(--creme); border:1px solid var(--rose-aquarelle);
  box-shadow:0 26px 70px rgba(190,91,107,.12);
  display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
}
.contact__cote{ padding:clamp(1.8rem,4vw,3rem); background:var(--rose-poudre); display:flex; flex-direction:column; }
.contact__logo{ width:190px; margin:0 0 1.4rem; }
.coord{ display:grid; gap:1.1rem; margin:1.4rem 0 0; }
.coord a,.coord p{ display:flex; align-items:flex-start; gap:.85rem; text-decoration:none; margin:0; color:var(--encre); }
.coord svg{ width:19px; height:19px; fill:var(--rose-profond); flex:none; margin-top:.32rem; }
.coord b{ display:block; font-family:var(--f-display); font-size:1.32rem; font-weight:600; line-height:1.3; }
.coord__txt{ display:block; }
.coord__l{ display:block; font-size:.76rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--or-sombre); }
.coord__pt{ font-size:1.05rem !important; line-height:1.45; word-break:break-word; }
.coord a:hover b{ color:var(--rose-profond); }
.contact__form{ padding:clamp(1.8rem,4vw,3rem); }
.form{ display:grid; gap:1rem; }
.champ{ display:grid; gap:.4rem; }
.champ--duo{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.champ label,.champ > span{ font-size:.72rem; font-weight:700; letter-spacing:.11em; text-transform:uppercase; color:var(--or-sombre); }
.champ input,.champ select,.champ textarea{
  font:inherit; font-size:.95rem; color:var(--encre);
  padding:.8rem .95rem; border:1px solid var(--rose-aquarelle); border-radius:10px;
  background:#fff; width:100%;
  transition:border-color .25s var(--ease-smooth), box-shadow .25s var(--ease-smooth);
}
.champ textarea{ min-height:120px; resize:vertical; }
.champ input:focus,.champ select:focus,.champ textarea:focus{
  outline:none; border-color:var(--rose-blush); box-shadow:0 0 0 3px rgba(231,154,161,.22);
}
.consent{ display:flex; gap:.6rem; align-items:flex-start; font-size:.82rem; color:var(--encre-doux); line-height:1.5; }
.consent input{ margin-top:.28rem; accent-color:var(--rose-profond); flex:none; }
.form .btn{ justify-self:start; }
.form__note{ font-size:.78rem; color:var(--encre-doux); margin:0; }
.hp{ position:absolute; left:-9999px; }

/* ── Pied de page — logo centré + mentions ───────────────────── */
.pied{ background:var(--rose-poudre); border-top:1px solid var(--rose-aquarelle); padding:1.15rem 0; }
.pied__in{ display:grid; justify-items:center; gap:.45rem; text-align:center; }
.pied__marque{ display:block; line-height:0; }
.pied__logo{ width:auto; height:clamp(44px,6vw,56px); }
.pied__mentions{ margin:0; font-size:.74rem; color:var(--encre-doux); }
.pied__mentions span{ margin:0 .3rem; color:var(--or-clair); }
.pied a{ text-decoration:none; color:var(--encre-doux); transition:color .25s var(--ease-smooth); }
.pied a:hover{ color:var(--rose-profond); }

/* ── Barre d'appel mobile ────────────────────────────────────── */
.barre-mobile{
  position:fixed; left:0; right:0; bottom:0; z-index:190; display:none;
  gap:.55rem; padding:.6rem .7rem calc(.6rem + env(safe-area-inset-bottom));
  background:rgba(253,247,244,.96);
  -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  border-top:1px solid var(--rose-aquarelle);
}
.barre-mobile .btn{ flex:1; padding:.78rem .8rem; font-size:.72rem; }
@media (max-width:720px){
  .barre-mobile{ display:flex; }
  body{ padding-bottom:4.4rem; }
  .hero__scroll{ display:none; }
}

/* ── Pages annexes ───────────────────────────────────────────── */
.page-simple{ padding:9rem 0 var(--sec-y); }
.page-simple h1{ font-size:clamp(2rem,1.4rem + 2.6vw,3.2rem); margin:0 0 1.6rem; }
.page-simple h2{ font-family:var(--f-display); font-size:1.5rem; font-weight:600; margin:2.3rem 0 .7rem; color:var(--rose-profond); }
.page-simple a:not(.btn){ color:var(--rose-profond); }
.page-simple .container{ max-width:760px; }

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width:900px){
  .cheffe__grid,.repertoire__grid,.faq__grid,.contact__panneau{ grid-template-columns:1fr; }
  .repertoire__tete{ position:static; }
  .contact__cote{ order:2; }
}
@media (max-width:520px){
  .champ--duo{ grid-template-columns:1fr; }
  .dressage__media img:first-child{ margin-top:0; }
  .parcours li{ grid-template-columns:1fr; gap:.15rem; }
}

/* ── Accessibilité : mouvement réduit ────────────────────────── */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important;
  }
  .js .reveal{ opacity:1 !important; transform:none !important; }
  .hero__logo,.hero__h1 .sur,.hero__h1 .villes,.feu,.hero__actions{ opacity:1 !important; transform:none !important; }
  .orn .trait{ stroke-dashoffset:0 !important; }
  .orn .feuille{ opacity:1 !important; transform:none !important; }
  .hero__fond img{ filter:saturate(.72) brightness(1.06); }
  .ruban__piste{ animation:none !important; transform:none !important; }
  .ruban__pause{ display:none; }
}