/* =====================================================================
   ELISSA BAKERY — SITE VITRINE
   Feuille de style unique. Aucune dépendance externe hors Google Fonts.
   ===================================================================== */

:root{
  /* Couleurs de marque : le bordeaux chocolat du logo et des emballages */
  --bordeaux:   #5B2A22;
  --bordeaux-f: #45201A;
  --bordeaux-c: #7A3A2E;
  --rose:       #F8DCD8;
  --rose-f:     #EFBDB6;
  --framboise:  #C9435E;
  --creme:      #FBF6F1;
  --sable:      #F5EDE5;
  --sable-f:    #EADCCD;
  --blanc:      #FFFFFF;
  --texte:      #2E1A14;
  --doux:       #7A645A;
  --ligne:      rgba(46,26,20,.10);
  --wa:         #1F9D55;
  --wa-f:       #17804A;

  --hero-clair: #EFE2D3;
  --hero-sombre:#2A170D;

  --f-titre: "Montserrat", "Helvetica Neue", Arial, sans-serif;
  --f-texte: "Poppins", "Helvetica Neue", Arial, sans-serif;
  --f-display: "Bebas Neue", Impact, sans-serif;

  --r-s: 10px;
  --r:   14px;
  --r-l: 22px;
  --ombre: 0 1px 2px rgba(46,26,20,.05), 0 10px 30px -18px rgba(46,26,20,.35);
  --souple: cubic-bezier(.22,1,.36,1);
  --conteneur: 1240px;
  --gout: clamp(16px, 3.4vw, 40px);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; overflow-x:clip; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{
  margin:0; background:var(--creme); color:var(--texte);
  font-family:var(--f-texte); font-size:15.5px; line-height:1.65;
  -webkit-font-smoothing:antialiased; overflow-x:clip;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; }
h1,h2,h3{ font-family:var(--f-titre); font-weight:800; line-height:1.12; margin:0 0 .5em; color:var(--bordeaux); letter-spacing:-.01em; }
h2{ font-size:clamp(1.45rem, 2.4vw, 1.9rem); }
p{ margin:0 0 1em; }
.ico{ flex:none; }
.sr{ position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.centre{ text-align:center; }
:focus-visible{ outline:3px solid var(--framboise); outline-offset:3px; border-radius:6px; }

.evitement{ position:absolute; left:12px; top:-60px; z-index:200; background:var(--bordeaux); color:#fff; padding:.6rem 1rem; border-radius:8px; }
.evitement:focus{ top:12px; }

.conteneur{ width:100%; max-width:var(--conteneur); margin:0 auto; padding-inline:var(--gout); }

/* ---------- Boutons ---------- */
.bouton{
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  font-family:var(--f-titre); font-weight:700; font-size:.92rem; line-height:1;
  padding:.95rem 1.5rem; border-radius:999px; border:2px solid transparent;
  transition:background .25s, color .25s, border-color .25s, transform .25s var(--souple);
  white-space:nowrap;
}
.bouton .ico{ transition:transform .3s var(--souple); }
.bouton:hover .ico:last-child{ transform:translateX(3px); }
.bouton--plein{ background:var(--bordeaux); color:#fff; }
.bouton--plein:hover{ background:var(--bordeaux-c); }
.bouton--ligne{ border-color:currentColor; color:var(--bordeaux); }
.bouton--ligne:hover{ background:var(--bordeaux); border-color:var(--bordeaux); color:#fff; }
.bouton--contour{ border-color:var(--sable-f); color:var(--bordeaux); background:var(--blanc); }
.bouton--contour:hover{ border-color:var(--bordeaux); }
.bouton--wa{ background:var(--wa); color:#fff; }
.bouton--wa:hover{ background:var(--wa-f); }
.bouton--wa .ico:last-child{ transform:none!important; }
.bouton--clair{ background:#fff; color:var(--bordeaux); }
.bouton--clair:hover{ background:var(--rose); }
.bouton--petit{ padding:.75rem 1.2rem; font-size:.85rem; }

.lien-fleche{ display:inline-flex; align-items:center; gap:.4rem; font-family:var(--f-titre); font-weight:700; font-size:.85rem; color:var(--bordeaux); }
.lien-fleche:hover{ color:var(--framboise); }

/* ---------- Barre haute ---------- */
.topbar{ background:var(--bordeaux-f); color:#F3E3DC; font-size:.8rem; }
.topbar__int{ display:flex; justify-content:space-between; align-items:center; gap:1rem; min-height:38px; }
.topbar p{ margin:0; }
.topbar__droite{ display:flex; align-items:center; gap:.9rem; }
.topbar__droite a{ display:inline-flex; align-items:center; gap:.35rem; opacity:.9; }
.topbar__droite a:hover{ opacity:1; color:#fff; }
.topbar__suivre{ opacity:.7; padding-left:.9rem; border-left:1px solid rgba(255,255,255,.2); }
@media (max-width:720px){ .topbar p, .topbar__suivre{ display:none; } .topbar__int{ justify-content:center; } }

/* ---------- En-tête ---------- */
.entete{ position:sticky; top:0; z-index:60; background:rgba(255,255,255,.96); backdrop-filter:saturate(1.4) blur(10px); border-bottom:1px solid var(--ligne); transition:box-shadow .3s; }
.entete.est-colle{ box-shadow:0 8px 24px -18px rgba(46,26,20,.45); }
.entete__int{ display:flex; align-items:center; gap:clamp(1rem, 2.4vw, 2.4rem); min-height:84px; }
.entete__logo img{ height:58px; width:auto; }
.nav{ display:flex; align-items:center; gap:clamp(.9rem, 2vw, 1.9rem); }
.nav > a{ position:relative; font-family:var(--f-titre); font-weight:600; font-size:.92rem; color:var(--texte); padding:.4rem 0; }
.nav > a::after{ content:""; position:absolute; left:0; right:0; bottom:-4px; height:2px; background:var(--bordeaux); transform:scaleX(0); transform-origin:left; transition:transform .35s var(--souple); }
.nav > a:hover::after, .nav > a.est-actif::after{ transform:scaleX(1); }
.nav > a.est-actif{ color:var(--bordeaux); }
.nav__boutique{ color:var(--framboise)!important; }
.nav__mobile-pied{ display:none; }
.recherche{ flex:1; max-width:330px; margin-left:auto; display:flex; align-items:center; gap:.5rem; background:var(--sable); border-radius:999px; padding:0 1rem; height:44px; color:var(--doux); }
.recherche input{ flex:1; min-width:0; border:0; background:none; font:inherit; font-size:.88rem; color:var(--texte); outline:none; height:100%; }
.recherche:focus-within{ box-shadow:0 0 0 2px var(--bordeaux); }
.entete__actions{ display:flex; align-items:center; gap:.5rem; }
.rond{ width:44px; height:44px; border-radius:50%; display:grid; place-items:center; color:var(--bordeaux); background:var(--sable); transition:background .25s, color .25s; }
.rond:hover{ background:var(--bordeaux); color:#fff; }
.rond--wa{ color:var(--wa); }
.rond--wa:hover{ background:var(--wa); }
.burger{ display:none; }

@media (max-width:1080px){
  .recherche{ max-width:220px; }
  .nav__boutique{ display:none; }
}
@media (max-width:920px){
  /* backdrop-filter créerait un repère pour le menu fixe : on le retire en mobile */
  .entete{ backdrop-filter:none; -webkit-backdrop-filter:none; background:#fff; }
  .entete__int{ min-height:70px; }
  .entete__logo img{ height:46px; }
  .recherche{ display:none; }
  .entete__actions{ margin-left:auto; }
  .burger{ display:grid; }
  .nav{
    position:fixed; top:0; right:0; bottom:0; width:min(340px, 86vw); z-index:80;
    flex-direction:column; align-items:stretch; gap:0; padding:88px 1.6rem 2rem;
    background:#fff; box-shadow:-20px 0 50px -20px rgba(0,0,0,.35);
    transform:translateX(105%); transition:transform .45s var(--souple); overflow-y:auto;
  }
  .nav.est-ouvert{ transform:none; }
  .nav > a{ font-size:1.1rem; padding:1rem 0; border-bottom:1px solid var(--ligne); }
  .nav > a::after{ display:none; }
  .nav__boutique{ display:block!important; }
  .nav__mobile-pied{ display:flex; flex-direction:column; gap:1rem; margin-top:1.6rem; }
  .nav__mobile-tel{ display:flex; align-items:center; gap:.5rem; justify-content:center; color:var(--bordeaux); font-weight:600; }
  .voile-nav{ position:fixed; inset:0; z-index:70; background:rgba(30,15,10,.45); opacity:0; visibility:hidden; transition:opacity .35s, visibility .35s; }
  .voile-nav.est-visible{ opacity:1; visibility:visible; }
  body.nav-ouverte{ overflow:hidden; }
  .burger[aria-expanded="true"]{ position:relative; z-index:90; }
}

/* =====================================================================
   SLIDER « REV » — calques animés, Ken Burns, progression
   ===================================================================== */
.hero{ position:relative; background:var(--hero-clair); overflow:hidden; isolation:isolate; transition:background-color .9s; }
.hero.hero--sombre{ background:var(--hero-sombre); }
.hero__piste{ position:relative; height:clamp(540px, 74vh, 640px); }
.slide{ position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .9s ease, visibility 0s linear .9s; }
.slide.est-actif{ opacity:1; visibility:visible; transition:opacity .9s ease, visibility 0s; z-index:2; }
.slide--clair{ background:linear-gradient(100deg, #F6ECE1 0%, var(--hero-clair) 55%); color:var(--texte); }
.slide--sombre{ background:radial-gradient(120% 90% at 20% 30%, #3B2216 0%, var(--hero-sombre) 60%); color:#F6E9DF; }

/* Calque image : révélé par un rideau, puis lent zoom */
.slide__media{
  position:absolute; top:0; right:0; bottom:0; width:min(50%, 720px);
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 30%);
          mask-image:linear-gradient(90deg, transparent 0%, #000 30%);
  clip-path:inset(0 0 0 100%);
  transition:clip-path 1.25s var(--souple) .1s;
}
.slide__media img{ width:100%; height:100%; object-fit:cover; object-position:center 22%; transform:scale(1.1); }
.slide.est-actif .slide__media{ clip-path:inset(0 0 0 0); }
.slide.est-actif .slide__media img{ animation:kenburns 9s ease-out forwards; }
@keyframes kenburns{ from{ transform:scale(1.1) translateX(2%); } to{ transform:scale(1) translateX(0); } }

.slide__contenu{ position:relative; z-index:2; height:100%; display:flex; flex-direction:column; justify-content:center; padding-bottom:96px; }
.slide__contenu > *{ max-width:560px; }

.couche{ opacity:0; transform:translateY(26px); filter:blur(6px); transition:opacity .6s ease, transform .6s var(--souple), filter .6s ease; }
.slide.est-actif .couche{ opacity:1; transform:none; filter:none; transition-duration:.9s; transition-delay:calc(var(--o) * .2s + .35s); }

.slide__sur{
  display:inline-block; width:max-content; font-family:var(--f-titre); font-weight:700; font-size:.74rem; letter-spacing:.08em; text-transform:uppercase;
  padding:.45rem .9rem; border-radius:6px; margin-bottom:1.1rem;
  background:rgba(91,42,34,.1); color:var(--bordeaux);
}
.slide--sombre .slide__sur{ background:rgba(242,169,59,.16); color:#F2C38B; }

.slide__titre{ font-size:clamp(2.1rem, 4.6vw, 3.55rem); line-height:1.04; letter-spacing:-.02em; margin:0 0 1.1rem; color:var(--bordeaux); }
.slide--sombre .slide__titre{ color:#FFF6EE; }
.mot{ display:inline-block; overflow:hidden; vertical-align:top; padding-bottom:.1em; margin-bottom:-.1em; }
.mot > span{ display:inline-block; transform:translateY(112%); transition:transform .5s ease; }
.slide.est-actif .mot > span{ transform:none; transition:transform 1s var(--souple); transition-delay:calc(var(--o) * .2s + .3s); }

.slide__texte{ font-size:1.05rem; line-height:1.6; margin-bottom:1.7rem; max-width:480px!important; }
.slide--clair .slide__texte{ color:#4B342A; }
.slide__boutons{ display:flex; flex-wrap:wrap; gap:.8rem; }
.slide--sombre .bouton--plein{ background:#F2A93B; color:var(--hero-sombre); }
.slide--sombre .bouton--plein:hover{ background:#FFC266; }
.slide--sombre .bouton--ligne{ color:#FFF1E6; }
.slide--sombre .bouton--ligne:hover{ background:#FFF1E6; color:var(--hero-sombre); border-color:#FFF1E6; }

/* Flèches */
.hero__fleche{
  position:absolute; top:calc(50% - 50px); z-index:5; width:46px; height:46px; border-radius:50%;
  display:grid; place-items:center; background:#fff; color:var(--bordeaux); box-shadow:var(--ombre);
  transition:transform .3s var(--souple), background .25s, color .25s;
}
.hero__fleche:hover{ background:var(--bordeaux); color:#fff; transform:scale(1.07); }
.hero__fleche--g{ left:18px; }
.hero__fleche--d{ right:18px; }

/* Points avec jauge de progression */
.hero__points{ position:absolute; z-index:5; left:50%; bottom:22px; transform:translateX(-50%); display:flex; gap:.55rem; }
.hero__points button{ width:10px; height:10px; border-radius:999px; background:rgba(91,42,34,.25); position:relative; overflow:hidden; transition:width .5s var(--souple), background .3s; }
.hero--sombre .hero__points button{ background:rgba(255,255,255,.3); }
.hero__points button.est-actif{ width:44px; }
.hero__points button span{ position:absolute; inset:0; background:var(--bordeaux); transform:scaleX(0); transform-origin:left; }
.hero--sombre .hero__points button span{ background:#F2A93B; }
.hero__points button.est-actif span{ animation:jauge var(--duree, 7s) linear forwards; }
.hero.est-en-pause .hero__points button.est-actif span{ animation-play-state:paused; }
@keyframes jauge{ to{ transform:scaleX(1); } }

/* Atouts dans le slider */
.hero__atouts{ position:absolute; z-index:4; left:0; right:0; bottom:58px; pointer-events:none; }
.hero__atouts ul{ list-style:none; margin:0; padding:0; display:flex; gap:clamp(1.2rem, 3vw, 2.6rem); pointer-events:auto; }
.hero__atouts li{ display:flex; align-items:center; gap:.7rem; font-size:.8rem; line-height:1.35; color:var(--texte); transition:color .9s; }
.hero__atouts li .ico{ color:var(--bordeaux); transition:color .9s; }
.hero__atouts strong{ display:block; font-family:var(--f-titre); font-weight:700; font-size:.82rem; }
.hero--sombre .hero__atouts li{ color:#F3E3DC; }
.hero--sombre .hero__atouts li .ico{ color:#F2A93B; }

@media (max-width:900px){
  .hero__piste{ height:640px; }
  .slide__media{ width:100%; height:62%; bottom:auto;
    -webkit-mask-image:linear-gradient(180deg, #000 45%, transparent 100%); mask-image:linear-gradient(180deg, #000 45%, transparent 100%);
    clip-path:inset(0 0 100% 0); }
  .slide.est-actif .slide__media{ clip-path:inset(0); }
  .slide__media img{ object-position:center 20%; }
  .slide__contenu{ justify-content:flex-end; padding-bottom:64px; }
  .slide__titre{ font-size:clamp(1.9rem, 8vw, 2.5rem); }
  .slide__texte{ font-size:.95rem; margin-bottom:1.2rem; }
  .hero__fleche{ display:none; }
  .hero__points{ bottom:auto; top:calc(640px - 34px); }
  .hero__atouts{ position:relative; bottom:auto; background:#fff; border-top:1px solid var(--ligne); }
  .hero--sombre .hero__atouts li{ color:var(--texte); }
  .hero--sombre .hero__atouts li .ico{ color:var(--bordeaux); }
  .hero__atouts ul{ display:grid; grid-template-columns:repeat(3, 1fr); gap:.6rem; padding:1rem 0; }
  .hero__atouts li{ flex-direction:column; text-align:center; gap:.35rem; font-size:.72rem; }
  .hero__atouts strong{ font-size:.74rem; }
}
@media (max-width:520px){
  .hero__piste{ height:600px; }
  .hero__points{ top:calc(600px - 34px); }
  .slide__boutons .bouton{ padding:.85rem 1.15rem; font-size:.85rem; }
}

/* =====================================================================
   SECTIONS
   ===================================================================== */
.bloc{ padding:clamp(3rem, 6vw, 4.6rem) 0; }
.bloc--serre{ padding-top:0; }
.bloc--creme{ background:var(--sable); }
.bloc__tete{ display:flex; align-items:center; justify-content:space-between; gap:1rem 2rem; flex-wrap:wrap; margin-bottom:1.6rem; }
.bloc__tete h2{ margin:0; }
.bloc__suite{ text-align:center; margin-top:2.2rem; }

/* ---------- Catégories ---------- */
.grille-cat{ display:grid; grid-template-columns:repeat(6, 1fr); gap:1rem; }
.carte-cat{ background:var(--blanc); border:1px solid var(--ligne); border-radius:var(--r); overflow:hidden; display:flex; flex-direction:column; transition:transform .35s var(--souple), box-shadow .35s; }
.carte-cat:hover{ transform:translateY(-4px); box-shadow:var(--ombre); }
.carte-cat__visuel{ aspect-ratio:4/5; background:var(--sable); overflow:hidden; display:grid; place-items:center; color:var(--rose-f); }
.carte-cat__visuel img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--souple); }
.carte-cat:hover .carte-cat__visuel img{ transform:scale(1.06); }
.carte-cat__visuel--vide{ background:linear-gradient(135deg, var(--rose) 0%, var(--sable) 100%); color:var(--bordeaux); }
.carte-cat__pied{ display:flex; align-items:flex-end; justify-content:space-between; gap:.5rem; padding:.85rem .9rem 1rem; flex:1; }
.carte-cat__nom{ font-family:var(--f-titre); font-weight:700; font-size:.86rem; line-height:1.3; }
.carte-cat__go{ flex:none; width:28px; height:28px; border-radius:50%; background:var(--sable); color:var(--bordeaux); display:grid; place-items:center; transition:background .25s, color .25s; }
.carte-cat:hover .carte-cat__go{ background:var(--bordeaux); color:#fff; }
@media (max-width:1100px){ .grille-cat{ grid-template-columns:repeat(3, 1fr); } }
@media (max-width:560px){ .grille-cat{ grid-template-columns:repeat(2, 1fr); gap:.7rem; } }

/* ---------- Puces de filtre ---------- */
.puces{ display:flex; flex-wrap:wrap; gap:.45rem; }
.puce{ font-family:var(--f-titre); font-weight:600; font-size:.8rem; padding:.55rem 1rem; border-radius:999px; background:var(--sable); color:var(--texte); transition:background .25s, color .25s; }
.puce:hover{ background:var(--sable-f); }
.puce.est-actif{ background:var(--bordeaux); color:#fff; }
.puce span{ opacity:.6; font-weight:500; margin-left:.2rem; }
@media (max-width:720px){
  .bloc__tete .puces{ flex-wrap:nowrap; overflow-x:auto; width:100%; scrollbar-width:none; padding-bottom:2px; }
  .bloc__tete .puce{ flex:none; }
}

/* ---------- Cartes produit (sans prix) ---------- */
.grille-p{ display:grid; grid-template-columns:repeat(6, 1fr); gap:1rem; }
.grille-p--4{ grid-template-columns:repeat(auto-fill, minmax(210px, 1fr)); }
.carte-p{ background:var(--blanc); border:1px solid var(--ligne); border-radius:var(--r); overflow:hidden; display:flex; flex-direction:column; transition:transform .35s var(--souple), box-shadow .35s; }
.carte-p:hover{ transform:translateY(-4px); box-shadow:var(--ombre); }
.carte-p[hidden]{ display:none; }
.carte-p__zone{ display:flex; flex-direction:column; text-align:left; flex:1; }
.carte-p__visuel{ position:relative; display:block; aspect-ratio:1; background:var(--sable); overflow:hidden; }
.carte-p__visuel img{ width:100%; height:100%; object-fit:cover; object-position:center top; transition:transform .6s var(--souple); }
.carte-p:hover .carte-p__visuel img{ transform:scale(1.05); }
.carte-p__nom{ display:block; font-family:var(--f-titre); font-weight:700; font-size:.9rem; line-height:1.3; padding:.95rem .95rem .2rem; color:var(--texte); }
.carte-p__cond{ display:block; font-size:.82rem; color:var(--doux); padding:0 .95rem; }
.carte-p__pied{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:.8rem .95rem .95rem; }
.carte-p__marque{ font-family:var(--f-titre); font-weight:700; font-size:.78rem; color:var(--bordeaux); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.carte-p__devis{ flex:none; width:38px; height:38px; border-radius:9px; display:grid; place-items:center; background:var(--bordeaux); color:#fff; transition:background .25s, transform .25s var(--souple); }
.carte-p__devis:hover{ background:var(--wa); transform:scale(1.06); }
.pastille{ position:absolute; top:.6rem; left:.6rem; font-family:var(--f-titre); font-weight:700; font-size:.68rem; padding:.3rem .6rem; border-radius:6px; }
.pastille--new{ background:var(--framboise); color:#fff; }
.pastille--off{ background:rgba(46,26,20,.75); color:#fff; }
@media (max-width:1180px){ .grille-p:not(.grille-p--4){ grid-template-columns:repeat(4, 1fr); } }
@media (max-width:820px){ .grille-p:not(.grille-p--4){ grid-template-columns:repeat(3, 1fr); } }
@media (max-width:600px){
  .grille-p, .grille-p--4{ grid-template-columns:repeat(2, 1fr)!important; gap:.7rem; }
  .carte-p__nom{ font-size:.84rem; padding:.75rem .75rem .15rem; }
  .carte-p__cond{ padding:0 .75rem; font-size:.78rem; }
  .carte-p__pied{ padding:.6rem .75rem .75rem; }
}

/* ---------- Bandeau professionnels (photo plein cadre, texte sur la zone rose) ---------- */
.bandeau-pro{ position:relative; overflow:hidden; background:#F6CFC3; isolation:isolate; }
.bandeau-pro__fond{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:left center; z-index:-1; }
.bandeau-pro::after{ content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(90deg, transparent 38%, rgba(248,214,203,.72) 56%, rgba(248,214,203,.55) 100%); }
.bandeau-pro__int{ display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); min-height:clamp(380px, 33vw, 480px); align-items:center; }
.bandeau-pro__texte{ grid-column:2; position:relative; padding:clamp(2.4rem, 4vw, 3.4rem) 0 clamp(2.4rem, 4vw, 3.4rem) clamp(0rem, 2vw, 2rem); max-width:540px; }
.bandeau-pro__texte h2{ font-size:clamp(1.6rem, 3vw, 2.4rem); margin-bottom:.6rem; }
.bandeau-pro__texte p{ color:#4E3029; }
.etiquette{ display:inline-block; background:var(--framboise); color:#fff!important; font-family:var(--f-titre); font-weight:700; font-size:.74rem; letter-spacing:.06em; text-transform:uppercase; padding:.35rem .8rem; border-radius:999px; margin-bottom:.9rem; }
.bandeau-pro__boutons{ display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.3rem; }
.bandeau-pro__sceau{
  position:absolute; top:clamp(-.5rem, 1vw, 1rem); right:-1.5rem; width:118px; height:118px; border-radius:50%;
  background:var(--bordeaux); color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center;
  box-shadow:0 0 0 7px rgba(91,42,34,.14); transform:rotate(-8deg); text-align:center;
}
.bandeau-pro__sceau span{ font-size:.76rem; opacity:.85; }
.bandeau-pro__sceau strong{ font-family:var(--f-display); font-weight:400; font-size:2.2rem; line-height:1; letter-spacing:.02em; white-space:nowrap; }
@media (min-width:1101px){ .bandeau-pro__texte h2, .bandeau-pro__texte .etiquette{ margin-right:110px; } }
@media (max-width:1100px){ .bandeau-pro__texte{ padding-top:5.2rem; } .bandeau-pro__sceau{ right:0; top:1.2rem; width:96px; height:96px; } .bandeau-pro__sceau strong{ font-size:1.8rem; } }
@media (max-width:900px){
  .bandeau-pro{ background:#F8D6CB; }
  .bandeau-pro::after{ display:none; }
  .bandeau-pro__fond{ position:relative; inset:auto; height:260px; object-position:22% center;
    -webkit-mask-image:linear-gradient(180deg, #000 70%, transparent 100%); mask-image:linear-gradient(180deg, #000 70%, transparent 100%); z-index:0; }
  .bandeau-pro__int{ grid-template-columns:1fr; min-height:0; }
  .bandeau-pro__texte{ grid-column:1; padding:.4rem 0 2.6rem; max-width:none; }
  .bandeau-pro__sceau{ top:-7.4rem; right:0; width:92px; height:92px; box-shadow:0 0 0 5px rgba(255,255,255,.35); }
  .bandeau-pro__sceau span{ font-size:.7rem; }
  .bandeau-pro__sceau strong{ font-size:1.65rem; }
}

/* ---------- Pourquoi nous ---------- */
.pourquoi{ background:var(--blanc); border-bottom:1px solid var(--ligne); }
.pourquoi__int{ display:grid; grid-template-columns:minmax(0, .9fr) minmax(0, 1.25fr) minmax(0, 2fr); gap:clamp(1.2rem, 3vw, 2.6rem); align-items:center; padding-block:clamp(2.2rem, 4vw, 3rem); }
.pourquoi__photo{ border-radius:var(--r-l); overflow:hidden; aspect-ratio:4/3.2; }
.pourquoi__photo img{ width:100%; height:100%; object-fit:cover; }
.pourquoi__texte h2{ font-size:clamp(1.3rem, 2vw, 1.6rem); }
.pourquoi__texte p{ font-size:.9rem; color:var(--doux); }
.pourquoi__tuiles{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4, 1fr); gap:.8rem; }
.pourquoi__tuiles li{ background:var(--creme); border:1px solid var(--ligne); border-radius:var(--r); padding:1.3rem .7rem; text-align:center; display:flex; flex-direction:column; align-items:center; gap:.7rem; }
.pourquoi__tuiles .ico{ color:var(--bordeaux); }
.pourquoi__tuiles span{ font-family:var(--f-titre); font-weight:600; font-size:.8rem; line-height:1.35; }
@media (max-width:1100px){ .pourquoi__int{ grid-template-columns:minmax(0, 1fr) minmax(0, 1.3fr); } .pourquoi__tuiles{ grid-column:1 / -1; } }
@media (max-width:640px){ .pourquoi__int{ grid-template-columns:1fr; } .pourquoi__tuiles{ grid-template-columns:repeat(2, 1fr); } }

/* ---------- Marques partenaires (logos) ---------- */
.marques{ background:var(--creme); padding:clamp(2.6rem, 5vw, 3.6rem) 0; }
.marques__titre{ text-align:center; margin-bottom:.3rem; }
.marques__sous{ text-align:center; color:var(--doux); font-size:.92rem; margin:0 auto 1.8rem; max-width:560px; }
/* Logos centrés, toujours alignés quel que soit le nombre de marques (--cols posé par marques.php) */
.marques__liste{ --cols:5; --gap:1rem; list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; justify-content:center; gap:var(--gap); }
.marques__item{ flex:0 0 calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols)); max-width:230px; min-width:0; background:#fff; border:1px solid var(--ligne); border-radius:var(--r); height:130px; display:grid; place-items:center; padding:1.1rem 1.4rem; transition:transform .35s var(--souple), box-shadow .35s; }
.marques__item > a{ display:grid; place-items:center; width:100%; height:100%; }
.marques__item:hover{ transform:translateY(-3px); box-shadow:var(--ombre); }
.marques__item img{ max-width:100%; max-height:84px; width:auto; height:auto; object-fit:contain; }
.marques__item--texte span{ font-family:var(--f-display); font-size:1.8rem; letter-spacing:.04em; color:var(--bordeaux); }
@media (max-width:900px){ .marques__liste{ --cols:3 !important; } }
/* Téléphone : carrousel compact qui défile logo par logo */
@media (max-width:640px){
  .marques{ padding:2rem 0; }
  .marques__sous{ font-size:.84rem; margin-bottom:1.1rem; }
  .marques__liste{
    display:flex; flex-wrap:nowrap; justify-content:flex-start; gap:.6rem; overflow-x:auto; scroll-snap-type:x mandatory;
    scrollbar-width:none; -webkit-overflow-scrolling:touch;
    margin-inline:calc(var(--gout) * -1); padding-inline:var(--gout);
    scroll-padding-inline:var(--gout);
  }
  .marques__liste::-webkit-scrollbar{ display:none; }
  .marques__item{ flex:0 0 calc((100% - 1.2rem) / 3); max-width:none; height:64px; padding:.5rem .7rem; scroll-snap-align:start; border-radius:var(--r-s); }
  .marques__item:hover{ transform:none; box-shadow:none; }
  .marques__item img{ max-height:40px; }
  .marques__item--texte span{ font-size:1.05rem; }
}

/* ---------- En-tête des pages intérieures ---------- */
.entete-page{ background:linear-gradient(100deg, var(--rose) 0%, #F6E7DF 60%, var(--sable) 100%); padding:clamp(2rem, 5vw, 3.4rem) 0; }
.entete-page h1{ font-size:clamp(1.9rem, 4vw, 2.8rem); margin-bottom:.4rem; }
.entete-page p{ max-width:640px; color:#5A3F37; margin:0; }
.ariane{ display:flex; gap:.5rem; font-size:.8rem; color:var(--doux); margin-bottom:.9rem; }
.ariane a:hover{ color:var(--bordeaux); }

/* ---------- Catalogue ---------- */
.catalogue__int{ display:grid; grid-template-columns:260px minmax(0, 1fr); gap:clamp(1.5rem, 3vw, 2.6rem); align-items:start; }
.catalogue__filtres{ position:sticky; top:104px; display:flex; flex-direction:column; gap:1rem; }
.champ-recherche{ display:flex; align-items:center; gap:.5rem; background:#fff; border:1px solid var(--ligne); border-radius:12px; padding:0 .9rem; height:48px; color:var(--doux); }
.champ-recherche:focus-within{ border-color:var(--bordeaux); box-shadow:0 0 0 3px rgba(91,42,34,.12); }
.champ-recherche input{ flex:1; min-width:0; border:0; outline:none; background:none; font:inherit; font-size:.9rem; color:var(--texte); height:100%; }
.catalogue__h{ font-family:var(--f-titre); font-weight:700; font-size:.85rem; margin:.4rem 0 -.3rem; }
.puces--colonne{ flex-direction:column; }
.puces--colonne .puce{ text-align:left; border-radius:10px; display:flex; justify-content:space-between; padding:.7rem .9rem; background:#fff; border:1px solid var(--ligne); }
.puces--colonne .puce.est-actif{ background:var(--bordeaux); border-color:var(--bordeaux); }
.catalogue__aide{ background:var(--rose); border-radius:var(--r); padding:1.2rem; color:var(--bordeaux); }
.catalogue__aide p{ font-size:.84rem; color:#5A3F37; margin:.6rem 0 1rem; }
.catalogue__aide strong{ display:block; color:var(--bordeaux); font-family:var(--f-titre); }
.catalogue__compte{ font-size:.85rem; color:var(--doux); margin:0 0 1rem; }
.vide{ text-align:center; padding:3rem 1rem; background:#fff; border:1px dashed var(--sable-f); border-radius:var(--r); color:var(--doux); }
.vide .ico{ color:var(--bordeaux); margin:0 auto .8rem; }
.vide p{ max-width:440px; margin:0 auto 1.2rem; }
.vide strong{ display:block; color:var(--texte); }
@media (max-width:900px){
  .catalogue__int{ grid-template-columns:1fr; }
  .catalogue__filtres{ position:static; }
  .puces--colonne{ flex-direction:row; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; }
  .puces--colonne .puce{ flex:none; gap:.4rem; }
  .catalogue__aide{ display:none; }
}

/* ---------- À propos ---------- */
.apropos{ display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); gap:clamp(2rem, 5vw, 4rem); align-items:center; }
.apropos__texte p{ color:#4B342A; }
.apropos__boutons{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.6rem; }
.apropos__photos{ position:relative; padding:0 0 18% 12%; }
.apropos__p1{ width:78%; margin-left:auto; aspect-ratio:4/5; object-fit:cover; object-position:center 20%; border-radius:var(--r-l); }
.apropos__p2{ position:absolute; left:0; bottom:0; width:58%; aspect-ratio:16/10; object-fit:cover; border-radius:var(--r); border:6px solid var(--creme); box-shadow:var(--ombre); }
@media (max-width:820px){ .apropos{ grid-template-columns:1fr; } }

.clients{ list-style:none; margin:2rem 0 0; padding:0; display:grid; grid-template-columns:repeat(4, 1fr); gap:1rem; }
.clients li{ background:#fff; border-radius:var(--r); padding:1.6rem 1.3rem; display:flex; flex-direction:column; gap:.4rem; }
.clients .ico{ color:var(--bordeaux); margin-bottom:.4rem; }
.clients strong{ font-family:var(--f-titre); color:var(--bordeaux); }
.clients span{ font-size:.88rem; color:var(--doux); }
@media (max-width:900px){ .clients{ grid-template-columns:repeat(2, 1fr); } }
@media (max-width:520px){ .clients{ grid-template-columns:1fr; } }

.etapes{ list-style:none; margin:2rem 0 0; padding:0; display:grid; grid-template-columns:repeat(3, 1fr); gap:1.4rem; counter-reset:e; }
.etapes li{ position:relative; padding:1.6rem 1.4rem; background:#fff; border:1px solid var(--ligne); border-radius:var(--r); }
.etapes__n{ font-family:var(--f-display); font-size:3rem; line-height:1; color:var(--rose-f); display:block; margin-bottom:.4rem; }
.etapes strong{ font-family:var(--f-titre); color:var(--bordeaux); display:block; margin-bottom:.4rem; }
.etapes p{ margin:0; font-size:.9rem; color:var(--doux); }
@media (max-width:820px){ .etapes{ grid-template-columns:1fr; } }

/* ---------- Contact ---------- */
.contact{ display:grid; grid-template-columns:minmax(0, 380px) minmax(0, 1fr); gap:clamp(1.5rem, 4vw, 3rem); align-items:start; }
.contact__infos{ display:flex; flex-direction:column; gap:.7rem; }
.contact__carte{ display:flex; align-items:center; gap:1rem; background:#fff; border:1px solid var(--ligne); border-radius:var(--r); padding:1rem 1.2rem; color:var(--bordeaux); transition:border-color .25s; }
a.contact__carte:hover{ border-color:var(--bordeaux); }
.contact__carte span{ display:flex; flex-direction:column; font-size:.8rem; color:var(--doux); }
.contact__carte strong{ font-family:var(--f-titre); font-size:.95rem; color:var(--texte); word-break:break-word; }
.contact__carte--wa{ background:var(--wa); border-color:var(--wa); color:#fff; }
.contact__carte--wa span, .contact__carte--wa strong{ color:#fff; }
.contact__carte--wa:hover{ background:var(--wa-f); }
.contact__form{ background:#fff; border:1px solid var(--ligne); border-radius:var(--r-l); padding:clamp(1.4rem, 3vw, 2.4rem); }
.form-2{ display:grid; grid-template-columns:1fr 1fr; gap:0 1rem; }
.champ{ margin-bottom:1rem; }
.champ label{ display:block; font-family:var(--f-titre); font-weight:600; font-size:.82rem; margin-bottom:.35rem; }
.champ input, .champ select, .champ textarea{ width:100%; font:inherit; font-size:.95rem; color:var(--texte); background:var(--creme); border:1px solid var(--sable-f); border-radius:10px; padding:.8rem .9rem; }
.champ input:focus, .champ select:focus, .champ textarea:focus{ outline:none; border-color:var(--bordeaux); box-shadow:0 0 0 3px rgba(91,42,34,.12); background:#fff; }
.form-note{ font-size:.8rem; color:var(--doux); }
.piege{ position:absolute; left:-9999px; }
.alerte{ border-radius:12px; padding:1rem 1.2rem; margin-bottom:1.4rem; font-size:.92rem; }
.alerte ul{ margin:0; padding-left:1.1rem; }
.alerte--ok{ background:#E7F5EC; color:#1C5E3A; }
.alerte--ko{ background:#FBE9E7; color:#8A2C22; }
@media (max-width:860px){ .contact{ grid-template-columns:1fr; } }
@media (max-width:520px){ .form-2{ grid-template-columns:1fr; } }

/* ---------- Pied de page ---------- */
.pied{ background:var(--bordeaux-f); color:#E9D6CE; font-size:.88rem; }
.pied__grille{ display:grid; grid-template-columns:1.4fr 1fr 1.2fr 1.4fr 1.2fr; gap:2rem; padding-block:clamp(2.6rem, 5vw, 3.6rem) 2rem; }
.pied h2{ font-family:var(--f-titre); font-size:.95rem; font-weight:700; color:#fff; margin-bottom:1rem; }
.pied ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.55rem; }
.pied a:hover{ color:#fff; text-decoration:underline; text-underline-offset:3px; }
.pied__marque img{ width:190px; height:auto; margin-bottom:1rem; }
.pied__marque p{ font-size:.84rem; opacity:.8; max-width:260px; }
.pied__contact li{ display:flex; gap:.6rem; align-items:flex-start; }
.pied__contact .ico{ margin-top:2px; color:#F2A9A0; }
.pied__reseaux{ display:flex; gap:.5rem; margin-bottom:1.4rem; }
.pied__reseaux a{ width:38px; height:38px; border-radius:50%; background:#fff; color:var(--bordeaux-f); display:grid; place-items:center; }
.pied__reseaux a:hover{ background:var(--rose); text-decoration:none; }
.pied__h-devis{ margin-top:.4rem; }
.pied__bas{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:.5rem 1rem; border-top:1px solid rgba(255,255,255,.12); padding-block:1.2rem 1.6rem; font-size:.78rem; opacity:.75; }
.pied__bas p{ margin:0; }
@media (max-width:1000px){ .pied__grille{ grid-template-columns:1fr 1fr 1fr; } .pied__marque{ grid-column:1 / -1; } }
@media (max-width:600px){ .pied__grille{ grid-template-columns:1fr 1fr; } .pied__grille > div:last-child{ grid-column:1 / -1; } }

/* ---------- WhatsApp flottant ---------- */
.wa-flottant{ position:fixed; right:18px; bottom:calc(18px + env(safe-area-inset-bottom, 0px)); z-index:50; width:58px; height:58px; border-radius:50%; background:var(--wa); color:#fff; display:grid; place-items:center; box-shadow:0 12px 26px -10px rgba(23,128,74,.8); transition:transform .3s var(--souple); }
.wa-flottant:hover{ transform:scale(1.08); }

/* ---------- Fenêtre produit ---------- */
.modale{ position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:1.2rem; }
.modale[hidden]{ display:none; }
.modale__fond{ position:absolute; inset:0; background:rgba(30,15,10,.55); animation:apparition .3s ease; }
.modale__boite{ position:relative; width:min(940px, 100%); max-height:calc(100vh - 2.4rem); overflow:auto; background:#fff; border-radius:var(--r-l); display:grid; grid-template-columns:1fr 1.1fr; animation:monte .45s var(--souple); outline:none; }
.modale__fermer{ position:absolute; top:12px; right:12px; z-index:2; width:40px; height:40px; border-radius:50%; background:#fff; color:var(--bordeaux); display:grid; place-items:center; box-shadow:var(--ombre); }
.modale__visuel{ background:var(--sable); }
.modale__visuel{ display:grid; place-items:center; }
.modale__visuel img{ width:100%; height:100%; object-fit:contain; min-height:320px; max-height:560px; }
.modale__infos{ padding:clamp(1.4rem, 3vw, 2.2rem); }
.modale__cat{ font-size:.8rem; color:var(--framboise); font-weight:600; margin-bottom:.4rem; }
.modale__infos h2{ font-size:clamp(1.3rem, 2.4vw, 1.7rem); margin-bottom:.2rem; padding-right:2rem; }
.modale__marque{ font-family:var(--f-titre); font-weight:700; color:var(--doux); font-size:.9rem; }
.modale__acc{ font-weight:500; color:var(--bordeaux); }
.modale__desc{ font-size:.92rem; color:#4B342A; }
.modale__fiche{ display:grid; grid-template-columns:1fr 1fr; gap:.6rem; margin:1rem 0; }
.modale__fiche div{ background:var(--creme); border-radius:10px; padding:.6rem .8rem; }
.modale__fiche dt{ font-size:.72rem; color:var(--doux); }
.modale__fiche dd{ margin:0; font-weight:600; font-size:.9rem; }
.modale__decl p{ font-size:.82rem; font-weight:600; margin-bottom:.4rem; }
.modale__decl ul{ list-style:none; margin:0 0 1rem; padding:0; display:flex; flex-wrap:wrap; gap:.35rem; }
.modale__decl li{ font-size:.78rem; padding:.3rem .65rem; border-radius:999px; background:var(--rose); color:var(--bordeaux); }
.modale__actions{ display:flex; flex-wrap:wrap; gap:.6rem; }
.modale__note{ font-size:.78rem; color:var(--doux); margin:1rem 0 0; }
body.modale-ouverte{ overflow:hidden; }
@keyframes apparition{ from{ opacity:0; } }
@keyframes monte{ from{ opacity:0; transform:translateY(24px) scale(.98); } }
@media (max-width:720px){
  .modale{ padding:0; place-items:end stretch; }
  .modale__boite{ grid-template-columns:1fr; max-height:92vh; border-radius:var(--r-l) var(--r-l) 0 0; }
  .modale__visuel img{ min-height:0; aspect-ratio:4/3; }
}

/* ---------- Mouvement réduit ---------- */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; transition-delay:0s!important; }
  .slide__media{ clip-path:none!important; }
}