/* =========================================================
   ANNA DRESS' — Design System
   Boutique de mode féminine — Saint-Denis, La Réunion
   Mobile-first. Aucune dépendance CSS externe.
   ========================================================= */

/* ---------- 1. TOKENS ---------- */
:root{
  /* Couleurs — inspirées de la devanture : ivoire, beige, encre, rose poudré */
  --ivoire:#FDFBF7;
  --creme:#F8F2EA;
  --beige:#EFE4D6;
  --beige-2:#E2D3BF;
  --encre:#1C1A18;
  --encre-2:#3A3531;
  --gris:#6E655C;
  --gris-clair:#A79C90;
  --ligne:#E7DDD0;

  /* Accents — repris des pièces en vitrine */
  --rose:#DE8394;
  --rose-fonce:#C96A7C;
  --rose-voile:#FBEDEF;
  --vert:#2F6B54;
  --vert-voile:#E7F0EB;
  --bleu:#6E9AC4;
  --corail:#E2724C;
  --or:#C4A46A;

  --blanc:#FFFFFF;
  --ok:#2F6B54;
  --alerte:#B4553F;

  /* Typo */
  --serif:'Cormorant Garamond', 'Times New Roman', Georgia, serif;
  --script:'Parisienne', 'Snell Roundhand', 'Brush Script MT', cursive;
  --sans:'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;

  /* Espacements */
  --sp-1:.25rem; --sp-2:.5rem;  --sp-3:.75rem; --sp-4:1rem;
  --sp-5:1.5rem; --sp-6:2rem;   --sp-7:3rem;   --sp-8:4rem;  --sp-9:6rem;
  --sp-10:8rem;  --sp-11:11rem;

  /* Divers */
  --r-xs:2px; --r-sm:4px; --r-md:8px; --r-full:999px;
  --ombre-s:0 1px 3px rgba(28,26,24,.06);
  --ombre-m:0 6px 24px rgba(28,26,24,.08);
  --ombre-l:0 18px 50px rgba(28,26,24,.14);
  --trans:.28s cubic-bezier(.4,0,.2,1);
  --max:1320px;
  --h-header:64px;
}
@media (min-width:1024px){ :root{ --h-header:78px; } }

/* ---------- 2. RESET ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--ivoire);
  color:var(--encre);
  font-family:var(--sans);
  font-size:15px;
  line-height:1.78;
  font-weight:300;
  letter-spacing:.005em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
@media (min-width:768px){ body{font-size:15.5px;} }
img{max-width:100%;display:block;height:auto;}
button,input,select,textarea{font:inherit;color:inherit;}
button{background:none;border:0;cursor:pointer;padding:0;}
a{color:inherit;text-decoration:none;}
ul,ol{list-style:none;margin:0;padding:0;}
h1,h2,h3,h4,h5,p,figure{margin:0;}
table{border-collapse:collapse;width:100%;}
:focus-visible{outline:2px solid var(--rose-fonce);outline-offset:3px;border-radius:var(--r-xs);}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important;}
}

/* ---------- 3. TYPOGRAPHIE ---------- */
h1,h2,h3,h4{font-family:var(--serif);font-weight:300;line-height:1.08;letter-spacing:-.012em;}
h1{font-size:clamp(2.4rem,7.4vw,4.6rem);}
h2{font-size:clamp(1.9rem,4.6vw,3.1rem);}
h3{font-size:clamp(1.25rem,2.6vw,1.65rem);line-height:1.2;}
h4{font-size:1.05rem;line-height:1.3;}

/* Type d'affichage — réservé aux grands titres éditoriaux */
.display{
  font-family:var(--serif);font-weight:300;
  /* 6.4vw et non 8.4 : au-delà, « Votre moment. » déborde de sa
     colonne sur les écrans intermédiaires (1100–1300 px) */
  font-size:clamp(2.8rem,6.4vw,5.5rem);
  line-height:.98;letter-spacing:-.022em;
}
.display em{font-style:italic;font-weight:300;}
.serif-it{font-family:var(--serif);font-style:italic;font-weight:300;}

.eyebrow{
  font-family:var(--sans);font-size:.63rem;font-weight:400;
  letter-spacing:.3em;text-transform:uppercase;color:var(--rose-fonce);
  display:block;margin-bottom:var(--sp-4);
}
.eyebrow--gris{color:var(--gris);}
.eyebrow--num{display:flex;align-items:center;gap:.7rem;}
.eyebrow--num::before{content:"";width:26px;height:1px;background:currentColor;flex:0 0 26px;}
.script{font-family:var(--script);font-weight:400;text-transform:none;letter-spacing:0;}
.lead{font-size:1.06rem;line-height:1.8;color:var(--gris);max-width:56ch;}
.small{font-size:.83rem;color:var(--gris);}
.tiny{font-size:.72rem;color:var(--gris-clair);letter-spacing:.01em;}
.center{text-align:center;}
.rose{color:var(--rose-fonce);}
.mesure{max-width:60ch;}

/* Titre de section — filet fin, discret, à la place du gros soulignement */
.section-head{text-align:center;margin-bottom:var(--sp-7);}
@media (min-width:768px){ .section-head{margin-bottom:var(--sp-8);} }
.section-head h2{position:relative;display:inline-block;padding-bottom:var(--sp-4);}
.section-head h2::after{
  content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:0;
  width:38px;height:1px;background:var(--rose);
}
.section-head p{margin-top:var(--sp-4);color:var(--gris);max-width:52ch;margin-inline:auto;}
.section-head--row{
  display:flex;align-items:flex-end;justify-content:space-between;
  text-align:left;gap:var(--sp-5);
}
.section-head--row h2::after{left:0;transform:none;}
.section-head--row p{margin-inline:0;}

/* ---------- 4. LAYOUT ---------- */
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--sp-4);}
@media (min-width:768px){ .wrap{padding-inline:var(--sp-6);} }
.wrap--narrow{max-width:820px;}
.wrap--mid{max-width:1080px;}
.wrap--large{max-width:1600px;}
.section{padding-block:var(--sp-8);}
@media (min-width:768px){ .section{padding-block:var(--sp-9);} }
@media (min-width:1200px){ .section{padding-block:var(--sp-10);} }
.section--serre{padding-block:var(--sp-7)!important;}
.section--creme{background:var(--creme);}
.section--beige{background:var(--beige);}
.section--rose{background:var(--rose-voile);}
main{min-height:60vh;}
.stack>*+*{margin-top:var(--sp-4);}

/* ---------- 5. BOUTONS ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);
  padding:.85rem 1.7rem;border-radius:var(--r-xs);
  font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:400;
  border:1px solid transparent;cursor:pointer;
  transition:background var(--trans),color var(--trans),border-color var(--trans),transform var(--trans);
  text-align:center;line-height:1.2;
}
.btn:active{transform:translateY(1px);}
/* Libellé encre et non blanc : le blanc sur le rose de la marque
   ne donne que 2,7:1, très en dessous du seuil WCAG AA (4,5:1).
   L'encre sur ce même rose monte à 6,4:1, sans toucher à la palette. */
.btn--primary{background:var(--rose);color:var(--encre);}
.btn--primary:hover{background:var(--rose-fonce);color:var(--encre);}
.btn--dark{background:var(--encre);color:#fff;}
.btn--dark:hover{background:var(--encre-2);}
.btn--outline{border-color:var(--encre);color:var(--encre);background:transparent;}
.btn--outline:hover{background:var(--encre);color:#fff;}
.btn--light{border-color:#fff;color:#fff;background:transparent;}
.btn--light:hover{background:#fff;color:var(--encre);}
.btn--ghost{border-color:var(--ligne);background:var(--blanc);color:var(--encre);}
.btn--ghost:hover{border-color:var(--encre);}
.btn--block{display:flex;width:100%;}
.btn--sm{padding:.6rem 1.1rem;font-size:.66rem;}
.btn--lg{padding:1.05rem 2.2rem;}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed;pointer-events:none;}
.link-arrow{
  font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  border-bottom:1px solid var(--encre);padding-bottom:3px;white-space:nowrap;
  transition:color var(--trans),border-color var(--trans);
}
.link-arrow:hover{color:var(--rose-fonce);border-color:var(--rose);}
.link-souligne{border-bottom:1px solid var(--ligne);transition:border-color var(--trans);}
.link-souligne:hover{border-color:var(--encre);}

/* ---------- 6. LOGO ---------- */
.logo{display:inline-flex;align-items:baseline;gap:.28em;line-height:1;white-space:nowrap;}
.logo__anna{
  font-family:var(--serif);font-weight:500;letter-spacing:.1em;
  font-size:1.32rem;text-transform:uppercase;
}
.logo__dress{font-family:var(--script);font-size:1.22rem;position:relative;top:.06em;}
.logo--lg .logo__anna{font-size:2.1rem;}
.logo--lg .logo__dress{font-size:1.9rem;}
.logo--xl .logo__anna{font-size:clamp(2.2rem,6vw,3.4rem);}
.logo--xl .logo__dress{font-size:clamp(2rem,5.4vw,3rem);}

/* ---------- 7. BANDEAU ANNONCE ---------- */
.annonce{
  background:var(--rose-voile);color:var(--encre-2);
  font-size:.72rem;letter-spacing:.06em;
  display:flex;align-items:center;justify-content:center;gap:var(--sp-5);
  padding:.5rem var(--sp-4);text-align:center;
}
.annonce span{display:inline-flex;align-items:center;gap:.4rem;min-width:0;overflow:hidden;}
.annonce span:first-child{flex:0 1 auto;}
.annonce em{
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  min-width:0;font-style:normal;
}
.annonce .annonce__adresse{display:none;}
@media (min-width:1024px){
  .annonce{justify-content:space-between;}
  .annonce .annonce__adresse{display:inline-flex;}
}

/* ---------- 8. HEADER ---------- */
.header{
  position:sticky;top:0;z-index:60;background:var(--ivoire);
  border-bottom:1px solid var(--ligne);
}
.header__inner{
  height:var(--h-header);display:flex;align-items:center;gap:var(--sp-3);
  max-width:var(--max);margin-inline:auto;padding-inline:var(--sp-4);
}
@media (min-width:768px){ .header__inner{padding-inline:var(--sp-6);} }
.header__burger{display:flex;align-items:center;justify-content:center;width:40px;height:40px;margin-left:-8px;}
.header__logo{flex:1;display:flex;justify-content:center;}
.header__actions{display:flex;align-items:center;gap:var(--sp-1);}
.icon-btn{
  width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;
  border-radius:var(--r-full);position:relative;transition:background var(--trans);
}
.icon-btn:hover{background:var(--creme);}
.icon-btn svg{width:19px;height:19px;stroke:var(--encre);stroke-width:1.4;fill:none;}
/* Sous 360 px (iPhone SE 1re génération), logo + 4 icônes ne tiennent
   plus : on resserre sans jamais descendre sous la cible tactile de 40 px. */
@media (max-width:359px){
  .header__actions{gap:0;}
  .icon-btn{width:40px;}
  .header__burger{margin-left:-10px;}
}
.pastille{
  position:absolute;top:4px;right:2px;min-width:16px;height:16px;padding:0 4px;
  background:var(--rose);color:var(--encre);border-radius:var(--r-full);
  font-size:.6rem;line-height:16px;text-align:center;font-weight:500;
}
.pastille[hidden]{display:none;}

/* Navigation desktop */
.nav{display:none;}
@media (min-width:1024px){
  .header__burger{display:none;}
  .header__logo{flex:0 0 auto;justify-content:flex-start;}
  .nav{display:flex;align-items:center;gap:var(--sp-5);flex:1;justify-content:center;}
  .nav__link{
    font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;
    padding:.5rem 0;position:relative;color:var(--encre-2);transition:color var(--trans);
  }
  .nav__link::after{
    content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;
    background:var(--rose);transition:right var(--trans);
  }
  .nav__link:hover{color:var(--encre);}
  .nav__link:hover::after,.nav__link[aria-current="page"]::after{right:0;}
  .nav__link[aria-current="page"]{color:var(--rose-fonce);}
  .nav__item{position:relative;}
  .nav__item--drop:hover .nav__drop,.nav__item--drop:focus-within .nav__drop{
    opacity:1;visibility:visible;transform:translate(-50%,0);
  }
  .nav__drop{
    position:absolute;top:100%;left:50%;transform:translate(-50%,8px);
    background:var(--blanc);border:1px solid var(--ligne);box-shadow:var(--ombre-m);
    padding:var(--sp-4);min-width:210px;opacity:0;visibility:hidden;
    transition:all var(--trans);
  }
  .nav__drop a{
    display:block;padding:.42rem 0;font-size:.82rem;color:var(--encre-2);
    transition:color var(--trans),padding-left var(--trans);
  }
  .nav__drop a:hover{color:var(--rose-fonce);padding-left:6px;}
  .nav__drop hr{border:0;border-top:1px solid var(--ligne);margin:var(--sp-3) 0;}
}

/* Menu mobile (drawer gauche) */
.mmenu{
  position:fixed;inset:0 auto 0 0;width:min(86vw,360px);background:var(--ivoire);
  z-index:90;transform:translateX(-100%);transition:transform var(--trans);
  display:flex;flex-direction:column;overflow-y:auto;box-shadow:var(--ombre-l);
}
.mmenu.is-open{transform:none;}
.mmenu__top{
  display:flex;align-items:center;justify-content:space-between;
  padding:var(--sp-4);border-bottom:1px solid var(--ligne);
}
.mmenu__nav{padding:var(--sp-4) var(--sp-4) var(--sp-6);flex:1;}
.mmenu__nav>li{border-bottom:1px solid var(--ligne);}
.mmenu__nav a,.mmenu__acc{
  display:flex;align-items:center;justify-content:space-between;width:100%;
  padding:.95rem 0;font-family:var(--serif);font-size:1.22rem;text-align:left;
}
.mmenu__sub{padding:0 0 var(--sp-3) var(--sp-3);display:none;}
.mmenu__sub.is-open{display:block;}
.mmenu__sub a{font-family:var(--sans);font-size:.9rem;padding:.5rem 0;color:var(--gris);}
.mmenu__acc svg{width:14px;height:14px;stroke:var(--encre);stroke-width:1.6;fill:none;transition:transform var(--trans);}
.mmenu__acc[aria-expanded="true"] svg{transform:rotate(180deg);}
.mmenu__pied{
  padding:var(--sp-5) var(--sp-4);background:var(--creme);font-size:.85rem;color:var(--gris);
}
.mmenu__pied a{display:block;padding:.2rem 0;}
.mmenu__pied strong{color:var(--encre);font-weight:400;}

/* Overlay */
.overlay{
  position:fixed;inset:0;background:rgba(28,26,24,.42);z-index:80;
  opacity:0;visibility:hidden;transition:opacity var(--trans),visibility var(--trans);
  backdrop-filter:blur(2px);
}
.overlay.is-open{opacity:1;visibility:visible;}

/* Recherche */
.recherche{
  position:fixed;top:0;left:0;right:0;background:var(--ivoire);z-index:95;
  padding:var(--sp-5) var(--sp-4);box-shadow:var(--ombre-m);
  transform:translateY(-100%);transition:transform var(--trans);
}
.recherche.is-open{transform:none;}
.recherche__form{display:flex;gap:var(--sp-3);max-width:720px;margin-inline:auto;align-items:center;}
.recherche__form input{
  flex:1;border:0;border-bottom:1px solid var(--encre);background:transparent;
  font-family:var(--serif);font-size:1.4rem;padding:.4rem 0;
}
.recherche__form input::placeholder{color:var(--gris-clair);}
.recherche__res{max-width:720px;margin:var(--sp-4) auto 0;max-height:52vh;overflow-y:auto;}
.recherche__item{display:flex;gap:var(--sp-3);align-items:center;padding:.6rem 0;border-bottom:1px solid var(--ligne);}
.recherche__item img{width:52px;height:78px;object-fit:cover;background:var(--creme);}
.recherche__item strong{font-weight:400;font-size:.9rem;display:block;}

/* ---------- 9. HERO ---------- */
.hero{position:relative;background:var(--creme);overflow:hidden;}
.hero__grid{display:grid;}
.hero__media{position:relative;aspect-ratio:4/3;background:var(--beige);}
.hero__media img,.hero__media svg{width:100%;height:100%;object-fit:cover;object-position:center 14%;}
.hero__txt{padding:var(--sp-6) var(--sp-4) var(--sp-7);}
.hero h1{margin-bottom:var(--sp-4);}
.hero h1 .l3{color:var(--rose);}
.hero__filet{width:56px;height:2px;background:var(--rose);margin-bottom:var(--sp-4);}
.hero__p{color:var(--gris);margin-bottom:var(--sp-5);max-width:44ch;}
.hero__cta{display:flex;flex-wrap:wrap;gap:var(--sp-3);}
@media (min-width:900px){
  .hero__grid{grid-template-columns:1fr 1fr;align-items:center;min-height:min(76vh,660px);}
  .hero__media{aspect-ratio:auto;height:100%;min-height:min(76vh,660px);}
  .hero__txt{padding:var(--sp-8) clamp(2rem,5vw,4.5rem);}
}

/* ---------- 10. RASSURANCE ---------- */
.rassurance{border-bottom:1px solid var(--ligne);background:var(--blanc);}
.rassurance__grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-4);
  padding-block:var(--sp-5);
}
@media (min-width:900px){ .rassurance__grid{grid-template-columns:repeat(4,1fr);gap:var(--sp-5);} }
.rassurance__item{display:flex;gap:var(--sp-3);align-items:flex-start;}
.rassurance__item svg{width:22px;height:22px;stroke:var(--rose-fonce);stroke-width:1.2;fill:none;flex:0 0 22px;margin-top:2px;}
.rassurance__item strong{display:block;font-weight:400;font-size:.82rem;letter-spacing:.02em;}
.rassurance__item span{font-size:.74rem;color:var(--gris);line-height:1.4;display:block;}

/* ---------- 11. CARTE PRODUIT ---------- */
.grille{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-6) var(--sp-3);}
@media (min-width:640px){ .grille{grid-template-columns:repeat(3,1fr);gap:var(--sp-7) var(--sp-5);} }
@media (min-width:1024px){ .grille{grid-template-columns:repeat(4,1fr);gap:var(--sp-8) var(--sp-5);} }
.grille--3{grid-template-columns:repeat(2,1fr);}
@media (min-width:768px){ .grille--3{grid-template-columns:repeat(3,1fr);} }

.produit{position:relative;display:flex;flex-direction:column;}

/* Média — format portrait 2/3, plus éditorial que le 3/4 classique */
.produit__media{
  position:relative;display:block;aspect-ratio:2/3;overflow:hidden;background:var(--creme);
}
.produit__img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:transform 1.1s cubic-bezier(.22,1,.36,1), opacity .55s ease;
}
.produit__img--2{opacity:0;}
@media (hover:hover){
  .produit:hover .produit__img{transform:scale(1.04);}
  .produit:hover .produit__img--2{opacity:1;}
}

/* Mentions — texte fin, sans pastille colorée : plus haut de gamme */
.produit__badges{
  position:absolute;top:14px;left:14px;z-index:2;
  display:flex;flex-direction:column;gap:5px;align-items:flex-start;
}
/* Cartouche translucide indispensable : posé sur une vraie
   photographie, un texte seul devient illisible dès que le fond
   est clair ou chargé. Le voile reste assez discret pour ne pas
   alourdir la carte. */
.badge{
  font-size:.56rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--encre);line-height:1;
  background:rgba(253,251,247,.88);padding:.32rem .55rem;
  backdrop-filter:blur(4px);
}
.badge--rose{color:var(--rose-fonce);}
.badge--rupture{color:var(--gris);}

.produit__fav{
  position:absolute;top:10px;right:10px;z-index:3;width:34px;height:34px;
  display:flex;align-items:center;justify-content:center;
  transition:opacity var(--trans),transform var(--trans);
}
.produit__fav svg{width:16px;height:16px;stroke:var(--encre);stroke-width:1.1;fill:none;
  transition:fill var(--trans),stroke var(--trans),transform var(--trans);}
.produit__fav:hover svg{transform:scale(1.12);}
.produit__fav.is-on svg{fill:var(--rose);stroke:var(--rose);}
@media (hover:hover){
  .produit__fav{opacity:0;}
  .produit:hover .produit__fav,.produit__fav.is-on,.produit__fav:focus-visible{opacity:1;}
}

/* Bandeau d'action au survol */
.produit__apercu{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  opacity:0;transform:translateY(100%);transition:all .42s cubic-bezier(.22,1,.36,1);
}
.produit__apercu .btn{
  background:rgba(253,251,247,.94);color:var(--encre);border:0;
  backdrop-filter:blur(4px);letter-spacing:.2em;font-size:.63rem;padding:.95rem 1rem;
}
.produit__apercu .btn:hover{background:var(--encre);color:#fff;}
@media (hover:hover){
  .produit:hover .produit__apercu{opacity:1;transform:none;}
}
@media (hover:none){ .produit__apercu{display:none;} }

/* Bloc d'information — hiérarchie resserrée, prix en serif */
.produit__info{padding-top:var(--sp-4);text-align:left;}
.produit__nom{
  font-family:var(--sans);font-size:.87rem;font-weight:300;letter-spacing:.015em;
  line-height:1.4;display:block;color:var(--encre);
  transition:color var(--trans);
  /* deux lignes réservées : les prix restent alignés d'une carte à l'autre */
  min-height:2.4em;
}
.produit:hover .produit__nom{color:var(--rose-fonce);}
.produit__prix{
  font-family:var(--serif);font-size:1.06rem;letter-spacing:0;
  margin-top:5px;color:var(--encre-2);
}
.produit__prix del{color:var(--gris-clair);margin-right:.45rem;font-size:.92rem;}
.produit__prix ins{text-decoration:none;color:var(--rose-fonce);}
.produit__pastilles{display:flex;gap:7px;margin-top:var(--sp-3);align-items:center;}
.pastille-couleur{
  width:11px;height:11px;border-radius:var(--r-full);border:1px solid rgba(28,26,24,.14);
  display:inline-block;padding:0;position:relative;
  transition:transform var(--trans);
}
button.pastille-couleur{cursor:pointer;}
button.pastille-couleur:hover{transform:scale(1.25);}
.pastille-couleur.is-on::after{
  content:"";position:absolute;inset:-4px;border:1px solid var(--gris-clair);border-radius:var(--r-full);
}
.pastille-couleur.is-plus{
  width:auto;height:auto;border:0;font-size:.66rem;color:var(--gris-clair);line-height:11px;
  letter-spacing:.04em;
}

/* Carrousel horizontal (mobile) */
.rail{
  display:grid;grid-auto-flow:column;grid-auto-columns:64%;gap:var(--sp-3);
  overflow-x:auto;scroll-snap-type:x mandatory;
  padding-bottom:var(--sp-3);margin-inline:calc(var(--sp-4)*-1);padding-inline:var(--sp-4);
  scrollbar-width:none;
}
.rail::-webkit-scrollbar{display:none;}
.rail>*{scroll-snap-align:start;}
@media (min-width:640px){ .rail{grid-auto-columns:34%;} }
@media (min-width:1024px){
  .rail{grid-auto-flow:row;grid-template-columns:repeat(5,1fr);overflow:visible;margin-inline:0;padding-inline:0;}
}

/* ---------- 12. CATÉGORIES ---------- */
.cats{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-3);}
@media (min-width:768px){ .cats{grid-template-columns:repeat(4,1fr);gap:var(--sp-4);} }
.cat{
  position:relative;display:block;aspect-ratio:4/5;overflow:hidden;background:var(--creme);
}
@media (min-width:768px){ .cat{aspect-ratio:3/4;} }
.cat img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.4,0,.2,1);}
.cat:hover img{transform:scale(1.06);}
.cat::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(28,26,24,.45) 0%,rgba(28,26,24,.06) 45%,transparent 70%);
}
.cat__label{
  position:absolute;left:var(--sp-3);bottom:var(--sp-3);z-index:2;color:#fff;
}
.cat__label strong{font-family:var(--serif);font-size:1.25rem;font-weight:400;display:block;}
.cat__label span{font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;opacity:.9;}

/* ---------- 13. À PROPOS / ÉDITO ---------- */
.edito{display:grid;gap:var(--sp-5);align-items:center;}
@media (min-width:900px){ .edito{grid-template-columns:1.05fr 1fr;gap:var(--sp-8);} }
.edito__media img{width:100%;aspect-ratio:4/3;object-fit:cover;}
.edito__points{display:flex;flex-wrap:wrap;gap:var(--sp-5);margin-top:var(--sp-5);}
.edito__point{display:flex;flex-direction:column;align-items:flex-start;gap:6px;max-width:120px;}
.edito__point svg{width:24px;height:24px;stroke:var(--rose-fonce);stroke-width:1.1;fill:none;}
.edito__point span{font-size:.74rem;color:var(--gris);line-height:1.35;}

/* ---------- 14. INSTAGRAM ---------- */
.insta{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-2);}
@media (min-width:640px){ .insta{grid-template-columns:repeat(3,1fr);} }
@media (min-width:1024px){ .insta{grid-template-columns:repeat(5,1fr);} }
.insta a{position:relative;aspect-ratio:1;overflow:hidden;background:var(--creme);display:block;}
.insta img{width:100%;height:100%;object-fit:cover;transition:transform .6s;}
.insta a:hover img{transform:scale(1.07);}
.insta a::after{
  content:"";position:absolute;inset:0;background:rgba(28,26,24,.28);
  opacity:0;transition:opacity var(--trans);
}
.insta a:hover::after{opacity:1;}

/* ---------- 15. BANDEAU BOUTIQUE PHYSIQUE ---------- */
.visite{position:relative;background:var(--encre);color:#fff;overflow:hidden;}
.visite__grid{display:grid;}
@media (min-width:900px){
  /* minmax(0,…) indispensable : sinon l'image impose sa largeur
     minimale et écrase la colonne texte (boutons illisibles) */
  .visite__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch;}
}
.visite__media{aspect-ratio:16/10;}
@media (min-width:900px){ .visite__media{aspect-ratio:auto;min-height:560px;} }
.visite__media img{width:100%;height:100%;object-fit:cover;}
.visite__txt{padding:var(--sp-7) var(--sp-4);}
@media (min-width:900px){ .visite__txt{padding:var(--sp-8) clamp(2.5rem,4vw,4.5rem);align-self:center;} }
.visite h2{color:#fff;}
.visite p{color:rgba(255,255,255,.72);}
.visite__horaires{
  margin:var(--sp-5) 0;font-size:.85rem;color:rgba(255,255,255,.82);
  display:grid;gap:.2rem;
}
.visite__horaires div{display:flex;justify-content:space-between;max-width:320px;gap:var(--sp-4);}
.visite__horaires .ferme{color:rgba(255,255,255,.45);}

/* ---------- 16. FOOTER ---------- */
.pied-services{background:var(--creme);border-top:1px solid var(--ligne);}
.pied-services__grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-5);padding-block:var(--sp-6);
}
@media (min-width:900px){ .pied-services__grid{grid-template-columns:repeat(4,1fr);} }
.footer{background:var(--ivoire);border-top:1px solid var(--ligne);padding-top:var(--sp-7);}
.footer__grid{display:grid;gap:var(--sp-6);}
/* Sans min-width:0, les colonnes de grille prennent la largeur minimale
   de leur contenu (ici le formulaire newsletter) et débordent sur les
   très petits écrans. */
.footer__grid>*{min-width:0;}
@media (min-width:768px){ .footer__grid{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);} }
@media (min-width:1100px){ .footer__grid{grid-template-columns:minmax(0,1.5fr) minmax(0,1.2fr) minmax(0,.9fr) minmax(0,.9fr);} }
.footer h4{
  font-family:var(--sans);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;
  margin-bottom:var(--sp-4);font-weight:400;
}
.footer__liens a{display:block;padding:.28rem 0;font-size:.85rem;color:var(--gris);transition:color var(--trans);}
.footer__liens a:hover{color:var(--encre);}
.footer__socials{display:flex;gap:var(--sp-3);margin-top:var(--sp-4);}
.footer__socials a{
  width:36px;height:36px;border:1px solid var(--ligne);border-radius:var(--r-full);
  display:flex;align-items:center;justify-content:center;transition:all var(--trans);
}
.footer__socials a:hover{border-color:var(--encre);background:var(--encre);}
.footer__socials svg{width:16px;height:16px;stroke:var(--encre);stroke-width:1.3;fill:none;}
.footer__socials a:hover svg{stroke:#fff;}
.footer__bas{
  border-top:1px solid var(--ligne);margin-top:var(--sp-6);padding-block:var(--sp-4);
  display:flex;flex-wrap:wrap;gap:var(--sp-3) var(--sp-5);justify-content:space-between;
  font-size:.75rem;color:var(--gris);
}
.newsletter{background:var(--creme);padding:var(--sp-5);}
.newsletter form{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-3);}
.newsletter input{
  flex:1;min-width:0;border:1px solid var(--ligne);background:#fff;padding:.7rem .8rem;font-size:.85rem;
}

/* ---------- 17. PANIER (drawer) ---------- */
.panier-drawer{
  position:fixed;top:0;right:0;bottom:0;width:min(92vw,420px);background:var(--ivoire);
  z-index:90;transform:translateX(100%);transition:transform var(--trans);
  display:flex;flex-direction:column;box-shadow:var(--ombre-l);
}
.panier-drawer.is-open{transform:none;}
.panier-drawer__top{
  display:flex;align-items:center;justify-content:space-between;
  padding:var(--sp-4);border-bottom:1px solid var(--ligne);
}
.panier-drawer__top h3{font-size:1.15rem;}
.panier-drawer__corps{flex:1;overflow-y:auto;padding:var(--sp-4);}
.panier-drawer__pied{border-top:1px solid var(--ligne);padding:var(--sp-4);background:var(--creme);}
.panier-vide{text-align:center;padding:var(--sp-7) var(--sp-3);color:var(--gris);}
.panier-vide svg{width:44px;height:44px;stroke:var(--gris-clair);stroke-width:1;fill:none;margin:0 auto var(--sp-4);}

.ligne{display:grid;grid-template-columns:76px 1fr;gap:var(--sp-3);padding-block:var(--sp-4);border-bottom:1px solid var(--ligne);}
.ligne:first-child{padding-top:0;}
.ligne__img{aspect-ratio:2/3;object-fit:cover;background:var(--creme);width:100%;}
.ligne__nom{font-size:.88rem;display:block;margin-bottom:2px;}
.ligne__var{font-size:.74rem;color:var(--gris);display:block;}
.ligne__bas{display:flex;align-items:center;justify-content:space-between;margin-top:var(--sp-3);gap:var(--sp-2);}
.qte{display:inline-flex;align-items:center;border:1px solid var(--ligne);background:#fff;}
.qte button{width:30px;height:30px;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--gris);transition:color var(--trans);}
.qte button:hover{color:var(--encre);}
.qte span{min-width:26px;text-align:center;font-size:.85rem;}
.ligne__sup{font-size:.72rem;color:var(--gris);border-bottom:1px solid var(--ligne);transition:color var(--trans);}
.ligne__sup:hover{color:var(--alerte);border-color:var(--alerte);}
.recap-ligne{display:flex;justify-content:space-between;padding-block:.35rem;font-size:.88rem;}
.recap-ligne--total{
  font-size:1.05rem;border-top:1px solid var(--ligne);margin-top:var(--sp-3);padding-top:var(--sp-3);
  font-family:var(--serif);
}
.recap-ligne--total span:last-child{font-size:1.25rem;}

/* ---------- 18. FIL D'ARIANE + EN-TÊTE DE PAGE ---------- */
.ariane{font-size:.72rem;color:var(--gris);padding-block:var(--sp-4);display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;}
.ariane a:hover{color:var(--encre);}
.ariane span{color:var(--gris-clair);}
.page-head{padding-block:var(--sp-7) var(--sp-8);text-align:center;background:var(--creme);}
@media (min-width:768px){ .page-head{padding-block:var(--sp-8) var(--sp-9);} }
.page-head h1{margin-bottom:var(--sp-4);}
.page-head p{color:var(--gris);max-width:52ch;margin-inline:auto;font-size:1.02rem;}

/* ---------- 19. BOUTIQUE : FILTRES ---------- */
.boutique{display:grid;gap:var(--sp-5);align-items:start;}
@media (min-width:1024px){ .boutique{grid-template-columns:236px 1fr;gap:var(--sp-7);} }
.filtres{
  position:fixed;inset:auto 0 0 0;max-height:88vh;background:var(--ivoire);z-index:90;
  transform:translateY(100%);transition:transform var(--trans);
  display:flex;flex-direction:column;border-radius:var(--r-md) var(--r-md) 0 0;
}
.filtres.is-open{transform:none;}
.filtres__top{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-4);border-bottom:1px solid var(--ligne);}
.filtres__corps{overflow-y:auto;padding:var(--sp-4);flex:1;}
.filtres__pied{padding:var(--sp-4);border-top:1px solid var(--ligne);display:flex;gap:var(--sp-3);background:var(--creme);}
@media (min-width:1024px){
  .filtres{position:sticky;top:calc(var(--h-header) + 16px);transform:none;max-height:none;background:transparent;border-radius:0;}
  .filtres__top,.filtres__pied{display:none;}
  .filtres__corps{padding:0;overflow:visible;}
}
.fgroupe{border-bottom:1px solid var(--ligne);padding-block:var(--sp-4);}
.fgroupe:first-child{padding-top:0;}
.fgroupe__titre{
  display:flex;align-items:center;justify-content:space-between;width:100%;
  font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;padding-bottom:var(--sp-3);
}
.fgroupe__titre svg{width:12px;height:12px;stroke:var(--encre);stroke-width:1.6;fill:none;transition:transform var(--trans);}
.fgroupe__titre[aria-expanded="false"] svg{transform:rotate(-90deg);}
.fgroupe__corps[hidden]{display:none;}
.check{display:flex;align-items:center;gap:.6rem;padding:.3rem 0;cursor:pointer;font-size:.86rem;color:var(--encre-2);}
.check input{
  appearance:none;width:15px;height:15px;border:1px solid var(--gris-clair);
  display:grid;place-content:center;transition:all var(--trans);flex:0 0 15px;
}
.check input::after{content:"";width:7px;height:7px;background:var(--rose);transform:scale(0);transition:transform var(--trans);}
.check input:checked{border-color:var(--rose);}
.check input:checked::after{transform:scale(1);}
.check .nb{margin-left:auto;font-size:.72rem;color:var(--gris-clair);}
.tailles-filtre{display:flex;flex-wrap:wrap;gap:6px;}
.taille-chip{
  min-width:38px;padding:.4rem .5rem;border:1px solid var(--ligne);background:#fff;
  font-size:.78rem;text-align:center;transition:all var(--trans);
}
.taille-chip:hover{border-color:var(--encre);}
.taille-chip.is-on{background:var(--encre);color:#fff;border-color:var(--encre);}
.couleurs-filtre{display:flex;flex-wrap:wrap;gap:9px;}
.couleur-chip{
  width:26px;height:26px;border-radius:var(--r-full);position:relative;
  border:1px solid rgba(28,26,24,.15);transition:transform var(--trans);
}
.couleur-chip:hover{transform:scale(1.1);}
.couleur-chip.is-on::after{
  content:"";position:absolute;inset:-4px;border:1px solid var(--encre);border-radius:var(--r-full);
}
.prix-range{display:flex;align-items:center;gap:var(--sp-3);margin-top:var(--sp-2);}
.prix-range input[type=range]{flex:1;accent-color:var(--rose);}
.prix-valeur{font-size:.82rem;color:var(--gris);}

.barre-outils{
  display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);
  padding-bottom:var(--sp-4);border-bottom:1px solid var(--ligne);margin-bottom:var(--sp-5);
}
.barre-outils__nb{font-size:.8rem;color:var(--gris);}
.tri{border:1px solid var(--ligne);background:#fff;padding:.55rem 2rem .55rem .7rem;font-size:.8rem;
  appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'><path d='M1 3l4 4 4-4' stroke='%231C1A18' fill='none' stroke-width='1.2'/></svg>");
  background-repeat:no-repeat;background-position:right .7rem center;cursor:pointer;}
.btn-filtres{display:inline-flex;}
@media (min-width:1024px){ .btn-filtres{display:none;} }
.puces-actives{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:var(--sp-4);}
.puce{
  display:inline-flex;align-items:center;gap:.4rem;background:var(--creme);
  padding:.3rem .6rem;font-size:.74rem;border-radius:var(--r-full);
}
.puce button{font-size:.9rem;line-height:1;color:var(--gris);}
.puce button:hover{color:var(--alerte);}
.vide-resultat{text-align:center;padding:var(--sp-8) var(--sp-4);color:var(--gris);}

/* Onglets catégories (scroll horizontal mobile) */
.onglets{
  display:flex;gap:var(--sp-2);overflow-x:auto;padding-bottom:var(--sp-3);
  margin-inline:calc(var(--sp-4)*-1);padding-inline:var(--sp-4);scrollbar-width:none;
}
.onglets::-webkit-scrollbar{display:none;}
.onglet{
  white-space:nowrap;padding:.5rem 1rem;border:1px solid var(--ligne);background:#fff;
  font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;border-radius:var(--r-full);
  transition:all var(--trans);
}
.onglet.is-on{background:var(--encre);color:#fff;border-color:var(--encre);}

/* ---------- 20. FICHE PRODUIT ---------- */
.fiche{display:grid;gap:var(--sp-5);align-items:start;}
@media (min-width:900px){ .fiche{grid-template-columns:1.15fr 1fr;gap:var(--sp-7);} }
.galerie{position:relative;}
.galerie__principale{aspect-ratio:2/3;background:var(--creme);overflow:hidden;position:relative;}
.galerie__principale img{width:100%;height:100%;object-fit:cover;}
.galerie__slider{
  display:grid;grid-auto-flow:column;grid-auto-columns:100%;overflow-x:auto;
  scroll-snap-type:x mandatory;scrollbar-width:none;
}
.galerie__slider::-webkit-scrollbar{display:none;}
.galerie__slider>*{scroll-snap-align:center;aspect-ratio:2/3;}
.galerie__slider img{width:100%;height:100%;object-fit:cover;}
.galerie__points{display:flex;gap:6px;justify-content:center;padding-top:var(--sp-3);}
.galerie__points button{width:6px;height:6px;border-radius:var(--r-full);background:var(--beige-2);transition:all var(--trans);}
.galerie__points button.is-on{background:var(--encre);width:18px;border-radius:var(--r-full);}
.galerie__vignettes{display:none;}
@media (min-width:900px){
  .galerie{display:grid;grid-template-columns:74px 1fr;gap:var(--sp-3);}
  .galerie__slider{display:block;overflow:visible;}
  .galerie__slider>*+*{margin-top:var(--sp-3);}
  .galerie__points{display:none;}
  .galerie__vignettes{display:flex;flex-direction:column;gap:var(--sp-2);}
  .galerie__vignettes button{aspect-ratio:2/3;overflow:hidden;border:1px solid transparent;background:var(--creme);}
  .galerie__vignettes button.is-on{border-color:var(--encre);}
  .galerie__vignettes img{width:100%;height:100%;object-fit:cover;}
}
.fiche__infos{position:sticky;top:calc(var(--h-header) + 20px);}
@media (max-width:899px){ .fiche__infos{position:static;} }
.fiche__cat{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gris);}
.fiche__titre{margin:var(--sp-2) 0 var(--sp-3);}
.fiche__prix{font-size:1.4rem;font-family:var(--serif);margin-bottom:var(--sp-2);}
.fiche__prix del{font-size:1rem;color:var(--gris-clair);margin-right:.5rem;}
.fiche__dispo{display:inline-flex;align-items:center;gap:.45rem;font-size:.78rem;color:var(--ok);margin-bottom:var(--sp-4);}
.fiche__dispo::before{content:"";width:6px;height:6px;border-radius:var(--r-full);background:currentColor;}
.fiche__dispo.is-bas{color:var(--corail);}
.fiche__dispo.is-rupture{color:var(--gris);}
.fiche__bloc{padding-block:var(--sp-4);border-top:1px solid var(--ligne);}
.fiche__label{
  display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-3);
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:var(--sp-3);
}
.fiche__label em{font-style:normal;text-transform:none;letter-spacing:0;color:var(--gris);font-size:.8rem;}
.opt-tailles{display:flex;flex-wrap:wrap;gap:8px;}
.opt-taille{
  min-width:46px;padding:.6rem .6rem;border:1px solid var(--ligne);background:#fff;
  font-size:.84rem;transition:all var(--trans);position:relative;
}
.opt-taille:hover:not(:disabled){border-color:var(--encre);}
.opt-taille.is-on{background:var(--encre);color:#fff;border-color:var(--encre);}
.opt-taille:disabled{color:var(--gris-clair);cursor:not-allowed;background:var(--creme);}
.opt-taille:disabled::after{
  content:"";position:absolute;left:8%;right:8%;top:50%;height:1px;background:var(--gris-clair);transform:rotate(-14deg);
}
.opt-couleurs{display:flex;flex-wrap:wrap;gap:12px;}
.opt-couleur{width:32px;height:32px;border-radius:var(--r-full);position:relative;border:1px solid rgba(28,26,24,.15);}
.opt-couleur.is-on::after{content:"";position:absolute;inset:-5px;border:1px solid var(--encre);border-radius:var(--r-full);}
.fiche__actions{display:flex;flex-direction:column;gap:var(--sp-3);padding-block:var(--sp-5);}
.fiche__actions-row{display:flex;gap:var(--sp-3);align-items:stretch;}
.fiche__actions-row .qte{flex:0 0 auto;}
.fiche__actions-row .qte button{width:44px;height:100%;}
.fiche__actions-row .btn{flex:1;}

.accordeon{border-top:1px solid var(--ligne);}
.accordeon__t{
  display:flex;align-items:center;justify-content:space-between;width:100%;
  padding:1rem 0;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;text-align:left;
}
.accordeon__t svg{width:13px;height:13px;stroke:var(--encre);stroke-width:1.5;fill:none;transition:transform var(--trans);flex:0 0 13px;}
.accordeon__t[aria-expanded="true"] svg{transform:rotate(45deg);}
.accordeon__c{padding-bottom:var(--sp-4);font-size:.88rem;color:var(--gris);}
.accordeon__c[hidden]{display:none;}
.accordeon__c table{font-size:.82rem;margin-top:var(--sp-2);}
.accordeon__c th,.accordeon__c td{border:1px solid var(--ligne);padding:.5rem;text-align:center;}
.accordeon__c th{background:var(--creme);font-weight:400;color:var(--encre);}

/* Barre d'achat mobile collante */
.achat-mobile{
  position:fixed;left:0;right:0;bottom:0;z-index:70;background:var(--ivoire);
  border-top:1px solid var(--ligne);padding:var(--sp-3) var(--sp-4);
  display:flex;gap:var(--sp-3);align-items:center;
  transform:translateY(110%);transition:transform var(--trans);
  padding-bottom:calc(var(--sp-3) + env(safe-area-inset-bottom));
}
.achat-mobile.is-on{transform:none;}
.achat-mobile__info{flex:1;min-width:0;}
.achat-mobile__info strong{display:block;font-size:.82rem;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.achat-mobile__info span{font-size:.78rem;color:var(--gris);}
@media (min-width:900px){ .achat-mobile{display:none;} }

/* ---------- 21. FORMULAIRES ---------- */
.champ{margin-bottom:var(--sp-4);}
.champ label{display:block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:.45rem;color:var(--encre-2);}
.champ input,.champ select,.champ textarea{
  width:100%;border:1px solid var(--ligne);background:#fff;padding:.78rem .85rem;font-size:.92rem;
  transition:border-color var(--trans);border-radius:var(--r-xs);
}
.champ input:focus,.champ select:focus,.champ textarea:focus{border-color:var(--encre);outline:none;}
.champ textarea{min-height:130px;resize:vertical;}
.champ .aide{font-size:.72rem;color:var(--gris-clair);margin-top:.35rem;display:block;}
.champ--err input,.champ--err textarea,.champ--err select{border-color:var(--alerte);}
.champ .err{font-size:.74rem;color:var(--alerte);margin-top:.3rem;display:none;}
.champ--err .err{display:block;}
.duo{display:grid;gap:0 var(--sp-3);}
@media (min-width:600px){ .duo{grid-template-columns:1fr 1fr;} }

/* ---------- 22. CONTACT ---------- */
.contact{display:grid;gap:var(--sp-6);}
@media (min-width:900px){ .contact{grid-template-columns:1fr 1.15fr;gap:var(--sp-7);} }
.info-carte{background:var(--creme);padding:var(--sp-5);}
.info-carte+.info-carte{margin-top:var(--sp-4);}
.info-ligne{display:flex;gap:var(--sp-3);padding-block:.6rem;align-items:flex-start;}
.info-ligne svg{width:19px;height:19px;stroke:var(--rose-fonce);stroke-width:1.3;fill:none;flex:0 0 19px;margin-top:3px;}
.horaires{width:100%;font-size:.88rem;}
.horaires tr{border-bottom:1px solid var(--ligne);}
.horaires tr:last-child{border:0;}
.horaires td{padding:.5rem 0;}
.horaires td:last-child{text-align:right;color:var(--gris);}
.horaires tr.aujourdhui td{color:var(--rose-fonce);}
.horaires tr.aujourdhui td:first-child::before{content:"● ";font-size:.6rem;vertical-align:middle;}
.carte-map{
  width:100%;aspect-ratio:4/3;border:1px solid var(--ligne);background:var(--creme);
  display:block;filter:grayscale(.25);   /* adoucit les couleurs Google vers la palette */
}
@media (min-width:768px){ .carte-map{aspect-ratio:16/11;} }

/* Panneau de consentement — même encombrement que la carte,
   pour que la page ne saute pas au moment de l'affichage */
.carte-zone{position:relative;}
.carte-accord{
  aspect-ratio:4/3;border:1px solid var(--ligne);background:var(--creme);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:var(--sp-5);gap:var(--sp-3);
  background-image:radial-gradient(circle at 30% 25%, rgba(232,174,184,.16), transparent 55%),
                   radial-gradient(circle at 75% 78%, rgba(168,192,160,.14), transparent 52%);
}
@media (min-width:768px){ .carte-accord{aspect-ratio:16/11;} }
.carte-accord__ico svg{width:30px;height:30px;stroke:var(--rose-fonce);stroke-width:1.1;fill:none;}
.carte-accord__titre{font-family:var(--serif);font-size:1.4rem;line-height:1.2;}
.carte-accord__txt{font-size:.83rem;color:var(--gris);max-width:42ch;line-height:1.7;}
.carte-accord__lien{font-size:.72rem;color:var(--gris-clair);margin-top:var(--sp-2);}
.carte-retrait{
  display:block;margin-top:var(--sp-2);font-size:.7rem;letter-spacing:.06em;
  color:var(--gris);text-decoration:underline;text-underline-offset:3px;
  background:none;border:0;padding:0;cursor:pointer;
}
.carte-retrait:hover{color:var(--encre);}
.actions-contact{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3);margin-top:var(--sp-4);}
/* WhatsApp : présent mais discret, pour rester dans la palette de la boutique */
.wa{background:transparent;color:#1F7A44;border-color:#1F7A44;}
.wa::before{content:"";width:8px;height:8px;border-radius:var(--r-full);background:#25D366;}
.wa:hover{background:#1F7A44;color:#fff;border-color:#1F7A44;}
.wa:hover::before{background:#fff;}

/* ---------- 23. TUNNEL DE COMMANDE ---------- */
.etapes{display:flex;align-items:center;justify-content:center;gap:var(--sp-2);padding-block:var(--sp-5);flex-wrap:wrap;}
.etape{display:flex;align-items:center;gap:.5rem;font-size:.74rem;color:var(--gris-clair);letter-spacing:.08em;text-transform:uppercase;}
.etape__n{
  width:24px;height:24px;border-radius:var(--r-full);border:1px solid currentColor;
  display:grid;place-content:center;font-size:.7rem;
}
.etape.is-on{color:var(--encre);}
.etape.is-on .etape__n{background:var(--encre);color:#fff;border-color:var(--encre);}
.etape.is-ok{color:var(--rose-fonce);}
.etape.is-ok .etape__n{background:var(--rose);border-color:var(--rose);color:var(--encre);}
.etapes__sep{width:26px;height:1px;background:var(--ligne);}
@media (max-width:600px){ .etapes__sep{width:14px;} }

.checkout{display:grid;gap:var(--sp-6);align-items:start;}
@media (min-width:900px){ .checkout{grid-template-columns:1.35fr .8fr;gap:var(--sp-7);} }
.recap{background:var(--creme);padding:var(--sp-5);position:sticky;top:calc(var(--h-header) + 16px);}
@media (max-width:899px){ .recap{position:static;} }
.option-livraison{
  display:flex;gap:var(--sp-3);align-items:flex-start;border:1px solid var(--ligne);
  background:#fff;padding:var(--sp-4);cursor:pointer;transition:border-color var(--trans);
}
.option-livraison+.option-livraison{margin-top:var(--sp-3);}
.option-livraison:hover{border-color:var(--gris-clair);}
.option-livraison.is-on{border-color:var(--encre);}
.option-livraison input{margin-top:4px;accent-color:var(--rose);flex:0 0 auto;}
.option-livraison strong{display:block;font-weight:400;font-size:.94rem;}
.option-livraison span{font-size:.8rem;color:var(--gris);display:block;}
.option-livraison .prix-liv{margin-left:auto;font-size:.9rem;white-space:nowrap;}

.confirmation{text-align:center;padding-block:var(--sp-8);}
.confirmation__ico{
  width:74px;height:74px;border-radius:var(--r-full);background:var(--vert-voile);
  display:grid;place-content:center;margin:0 auto var(--sp-5);
}
.confirmation__ico svg{width:32px;height:32px;stroke:var(--vert);stroke-width:1.3;fill:none;}

/* ---------- 24. DIVERS ---------- */
.note-demo{
  display:flex;gap:var(--sp-3);align-items:flex-start;
  background:var(--rose-voile);border-left:2px solid var(--rose);
  padding:var(--sp-4);font-size:.82rem;color:var(--encre-2);
}
.note-demo strong{font-weight:400;}
.note-config{
  background:var(--creme);border:1px dashed var(--beige-2);padding:var(--sp-4);
  font-size:.82rem;color:var(--gris);
}
.note-config code{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem;
  background:#fff;padding:.1rem .35rem;border:1px solid var(--ligne);
}
.toast{
  position:fixed;left:50%;bottom:24px;transform:translate(-50%,140%);
  background:var(--encre);color:#fff;padding:.85rem 1.3rem;font-size:.85rem;
  z-index:120;border-radius:var(--r-sm);box-shadow:var(--ombre-l);
  display:flex;align-items:center;gap:.6rem;max-width:92vw;
  transition:transform .35s cubic-bezier(.34,1.4,.64,1);
}
.toast.is-on{transform:translate(-50%,0);}
.toast svg{width:16px;height:16px;stroke:var(--rose);stroke-width:1.6;fill:none;flex:0 0 16px;}
.skip{
  position:absolute;left:-9999px;top:0;background:var(--encre);color:#fff;
  padding:.7rem 1rem;z-index:200;font-size:.8rem;
}
.skip:focus{left:8px;top:8px;}
.body-lock{overflow:hidden;}
[hidden]{display:none!important;}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

.valeurs{display:grid;gap:var(--sp-5);}
@media (min-width:768px){ .valeurs{grid-template-columns:repeat(3,1fr);gap:var(--sp-6);} }
.valeur{text-align:center;}
.valeur svg{width:30px;height:30px;stroke:var(--rose-fonce);stroke-width:1.1;fill:none;margin:0 auto var(--sp-3);}
.valeur h3{font-size:1.15rem;margin-bottom:var(--sp-2);}
.valeur p{font-size:.88rem;color:var(--gris);}

.citation{
  font-family:var(--serif);font-size:clamp(1.4rem,3.4vw,2.1rem);line-height:1.35;
  text-align:center;max-width:22ch;margin-inline:auto;
}
.citation .script{color:var(--rose-fonce);}

.tableau-simple{font-size:.88rem;width:100%;}
/* Sur très petit écran, le contenu (SIRET, n° de TVA…) ne peut plus
   se comprimer : on le fait défiler dans son cadre plutôt que de
   laisser toute la page déborder. */
.tableau-defilant{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.tableau-defilant>.tableau-simple{min-width:340px;}
.tableau-simple th,.tableau-simple td{border:1px solid var(--ligne);padding:.7rem .8rem;text-align:left;}
@media (max-width:420px){
  .tableau-simple{font-size:.82rem;}
  .tableau-simple th,.tableau-simple td{padding:.55rem .5rem;}
}
.tableau-simple th{background:var(--creme);font-weight:400;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;}
.tableau-simple td.a-definir{color:var(--gris-clair);font-style:italic;}

/* =========================================================
   PAGE 404
   ---------------------------------------------------------
   Autonome et sans dépendance au catalogue : elle doit
   fonctionner aussi bien pendant la préparation qu'une fois
   la boutique ouverte.
   ========================================================= */
.err404{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:var(--ivoire);padding:var(--sp-7) var(--sp-4);text-align:center;
}
.err404__inner{max-width:520px;}
.err404__logo{font-size:1.4rem;display:inline-block;margin-bottom:var(--sp-6);}
.err404__filet{width:44px;height:1px;background:var(--rose);margin:var(--sp-5) auto;}
.err404__txt{color:var(--gris);line-height:1.8;max-width:44ch;margin-inline:auto;}
.err404__cta{
  display:flex;flex-wrap:wrap;gap:var(--sp-3);
  justify-content:center;margin-top:var(--sp-6);
}
.err404__adresse{
  font-size:.76rem;color:var(--gris-clair);margin-top:var(--sp-7);
  padding-top:var(--sp-4);border-top:1px solid var(--ligne);
}

/* =========================================================
   PAGE D'ATTENTE (attente.html)
   ---------------------------------------------------------
   Mise en page autonome : ni entête boutique, ni panier.
   Elle porte les informations réellement utiles tout de suite
   — adresse, horaires, téléphone, réseaux.
   ========================================================= */
.att{display:grid;min-height:100vh;}
@media (min-width:900px){
  .att{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch;}
}
.att__media{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--creme);}
@media (min-width:900px){ .att__media{aspect-ratio:auto;min-height:100vh;} }
.att__media img{width:100%;height:100%;object-fit:cover;object-position:center 22%;}
.att__legende{
  position:absolute;left:var(--sp-4);bottom:var(--sp-4);
  font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:var(--encre);
  background:rgba(253,251,247,.86);padding:.4rem .7rem;backdrop-filter:blur(3px);
}
@media (min-width:900px){ .att__legende{left:var(--sp-6);bottom:var(--sp-6);} }

.att__txt{
  display:flex;align-items:center;
  padding:var(--sp-7) var(--sp-4) var(--sp-8);
  background:var(--ivoire);
}
@media (min-width:900px){ .att__txt{padding:var(--sp-8) clamp(2.5rem,5vw,5.5rem);} }
.att__inner{width:100%;max-width:560px;}
.att__logo{font-size:1.5rem;display:inline-block;margin-bottom:var(--sp-6);}
.att__filet{width:44px;height:1px;background:var(--rose);margin:var(--sp-5) 0;}
.att__intro{color:var(--gris);font-size:1.02rem;line-height:1.85;max-width:44ch;}

.att__infos{
  display:grid;gap:var(--sp-5);margin-top:var(--sp-6);
  padding-top:var(--sp-5);border-top:1px solid var(--ligne);
}
@media (min-width:560px){ .att__infos{grid-template-columns:1fr 1fr;gap:var(--sp-5);} }
.att__bloc h2{
  font-family:var(--sans);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;
  font-weight:400;color:var(--gris);margin-bottom:var(--sp-3);
}
.att__bloc p{font-size:.88rem;line-height:1.7;color:var(--encre-2);}
.att__bloc .lien-fin{margin-top:var(--sp-3);}
.att__horaires{width:100%;font-size:.8rem;border-collapse:collapse;}
.att__horaires th{
  text-align:left;font-weight:300;color:var(--gris);padding:.14rem 0;
}
.att__horaires td{text-align:right;color:var(--encre-2);padding:.14rem 0;white-space:nowrap;}
.att__horaires .ferme th,.att__horaires .ferme td{color:var(--gris-clair);}
.att__statut{
  display:flex;align-items:center;gap:.45rem;
  font-size:.78rem;color:var(--gris);margin-top:var(--sp-3);
}
.pastille-statut{
  width:7px;height:7px;border-radius:var(--r-full);background:var(--gris-clair);
  flex:0 0 7px;
}
.pastille-statut.is-ouvert{background:#2F7D4F;}

.att__cta{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin-top:var(--sp-6);}
.att__cta .btn{flex:1 1 auto;justify-content:center;min-width:190px;}
.att__suivre{margin-top:var(--sp-6);}
.att__socials{display:flex;gap:var(--sp-3);margin-top:var(--sp-3);}
.att__socials a{
  width:40px;height:40px;border:1px solid var(--ligne);
  display:flex;align-items:center;justify-content:center;
  transition:border-color var(--trans),background var(--trans);
}
.att__socials a:hover{border-color:var(--encre);background:var(--creme);}
.att__socials svg{width:18px;height:18px;stroke:var(--encre);stroke-width:1.2;fill:none;}

.att__pied{
  border-top:1px solid var(--ligne);background:var(--ivoire);
  padding-block:var(--sp-4);font-size:.76rem;color:var(--gris);
}
.att__pied .wrap{
  display:flex;flex-wrap:wrap;gap:var(--sp-3);
  justify-content:space-between;align-items:center;
}

/* ---------- Mention de financement FEDER ----------
   Les emblèmes officiels ne doivent pas être modifiés : l'arrondi
   porte sur le cartouche blanc qui les entoure, jamais sur l'image
   utile, qui garde ses marges d'origine. */
.feder{
  border-top:1px solid var(--ligne);
  background:var(--creme);
  padding-block:var(--sp-5);
}
.feder__grid{
  display:flex;flex-direction:column;align-items:center;gap:var(--sp-4);
  text-align:center;
}
@media (min-width:820px){
  .feder__grid{flex-direction:row;text-align:left;gap:var(--sp-5);}
}
.feder__logos{
  display:flex;align-items:center;gap:var(--sp-4);flex:0 0 auto;
}
.feder__logos img{
  height:56px;width:auto;display:block;
  background:#fff;
  padding:6px 10px;
  border-radius:10px;
  border:1px solid var(--ligne);
}
@media (min-width:820px){ .feder__logos img{height:64px;} }
.feder__txt{
  font-size:.76rem;line-height:1.7;color:var(--gris);
  max-width:74ch;margin:0;
}

/* ---------- Bandeau de consentement ----------
   Volontairement non bloquant : le site reste lisible et
   utilisable derrière. « Tout refuser » a exactement le même
   poids visuel que « Tout accepter » (exigence CNIL). */
.consent{
  position:fixed;left:0;right:0;bottom:0;z-index:120;
  padding:var(--sp-4);
  transform:translateY(110%);opacity:0;
  transition:transform .5s cubic-bezier(.22,1,.36,1), opacity .4s ease;
}
.consent.is-on{transform:none;opacity:1;}
.consent__boite{
  max-width:1100px;margin:0 auto;background:var(--ivoire);
  border:1px solid var(--ligne);box-shadow:0 8px 40px rgba(28,26,24,.13);
  padding:var(--sp-5);
}
@media (min-width:900px){ .consent__boite{padding:var(--sp-5) var(--sp-6);} }
.consent__txt h2{font-size:1.3rem;margin-bottom:var(--sp-2);}
.consent__txt p{font-size:.86rem;color:var(--gris);max-width:74ch;line-height:1.7;}
.consent__actions{
  display:flex;flex-wrap:wrap;gap:var(--sp-3);margin-top:var(--sp-4);
}
.consent__actions .btn{flex:1 1 auto;min-width:150px;justify-content:center;}
@media (min-width:700px){ .consent__actions .btn{flex:0 0 auto;} }
.consent__lien{margin-top:var(--sp-3);font-size:.75rem;color:var(--gris-clair);}
.consent__reglages{
  margin-top:var(--sp-4);padding-top:var(--sp-4);border-top:1px solid var(--ligne);
  display:grid;gap:var(--sp-3);
}
.consent__reglages[hidden]{display:none;}
.consent__cat{display:flex;gap:var(--sp-3);align-items:flex-start;cursor:pointer;}
.consent__cat input{
  appearance:none;width:17px;height:17px;flex:0 0 17px;margin-top:3px;
  border:1px solid var(--gris-clair);background:var(--blanc);
  display:grid;place-content:center;cursor:pointer;transition:all var(--trans);
}
.consent__cat input::after{
  content:"";width:9px;height:9px;background:var(--rose);
  transform:scale(0);transition:transform var(--trans);
}
.consent__cat input:checked{border-color:var(--rose);}
.consent__cat input:checked::after{transform:scale(1);}
.consent__cat input:focus-visible{outline:2px solid var(--encre);outline-offset:2px;}
.consent__cat strong{display:block;font-weight:400;font-size:.88rem;margin-bottom:2px;}
.consent__cat span span{font-size:.78rem;color:var(--gris);line-height:1.6;display:block;}

/* Lien présenté comme du texte, mais réellement un bouton */
.lien-bouton{
  background:none;border:0;padding:0;cursor:pointer;font:inherit;color:inherit;
  text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:var(--gris-clair);transition:text-decoration-color var(--trans);
}
.lien-bouton:hover{text-decoration-color:var(--encre);}

/* Échec de transmission d'une commande — doit se remarquer */
.alerte-envoi{
  border:1px solid var(--corail);border-left-width:3px;
  background:rgba(232,115,74,.06);
  padding:var(--sp-4);margin-bottom:var(--sp-4);
  font-size:.86rem;line-height:1.7;color:var(--gris);
}
.alerte-envoi[hidden]{display:none;}

/* =========================================================
   25. COUCHE ÉDITORIALE — direction artistique
   ========================================================= */

/* ---- Révélations au scroll (IntersectionObserver) ---- */
.reveal{
  opacity:0;transform:translateY(26px);
  transition:opacity .9s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1);
  transition-delay:calc(var(--i,0) * 90ms);
  will-change:opacity,transform;
}
.reveal.is-in{opacity:1;transform:none;}
.reveal--voile{transform:translateY(40px) scale(.985);}
.reveal--voile.is-in{transform:none;}
/* Volet qui se lève sur une image */
.reveal-media{position:relative;overflow:hidden;}
.reveal-media::after{
  content:"";position:absolute;inset:0;background:var(--ivoire);z-index:2;
  transform:translateY(0);transition:transform 1.15s cubic-bezier(.76,0,.24,1);
  transition-delay:calc(var(--i,0) * 90ms);
}
.reveal-media.is-in::after{transform:translateY(-101%);}
@media (prefers-reduced-motion:reduce){
  .reveal,.reveal--voile{opacity:1;transform:none;}
  .reveal-media::after{display:none;}
}

/* ---- Hero éditorial ---- */
.hero-edito{position:relative;background:var(--ivoire);overflow:hidden;}
.hero-edito__grid{display:grid;gap:0;}
.hero-edito__media{position:relative;aspect-ratio:4/5;background:var(--creme);overflow:hidden;}
.hero-edito__media img{width:100%;height:100%;object-fit:cover;object-position:center 16%;}
.hero-edito__legende{
  position:absolute;left:var(--sp-4);bottom:var(--sp-4);z-index:3;
  font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:var(--encre);
  background:rgba(253,251,247,.8);padding:.4rem .7rem;backdrop-filter:blur(3px);
}
.hero-edito__txt{padding:var(--sp-7) var(--sp-4) var(--sp-8);}
.hero-edito__filet{width:44px;height:1px;background:var(--rose);margin:var(--sp-5) 0;}
.hero-edito h1{margin-bottom:0;}
.hero-edito__p{color:var(--gris);max-width:38ch;font-size:1.02rem;line-height:1.85;}
.hero-edito__cta{display:flex;flex-wrap:wrap;gap:var(--sp-4);margin-top:var(--sp-6);align-items:center;}
@media (min-width:900px){
  .hero-edito__grid{
    /* minmax(0,…) : sans lui, le grand titre impose sa largeur minimale
       et déséquilibre complètement la composition */
    grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
    align-items:center;min-height:min(88vh,860px);
  }
  .hero-edito__media{aspect-ratio:auto;height:min(88vh,860px);}
  .hero-edito__txt{padding:var(--sp-8) clamp(2.5rem,5.5vw,6rem);}
  .hero-edito__legende{left:var(--sp-6);bottom:var(--sp-6);}
}
/* Filigrane du nom, très discret, derrière le titre */
.hero-edito__txt{position:relative;}
.hero-edito__filigrane{
  position:absolute;right:-1.5rem;bottom:-1rem;z-index:0;pointer-events:none;
  font-family:var(--script);font-size:clamp(7rem,13vw,13rem);
  color:var(--rose);opacity:.06;line-height:1;user-select:none;
}
/* le filigrane garde son positionnement absolu */
.hero-edito__txt>*:not(.hero-edito__filigrane){position:relative;z-index:1;}
.defil-cue{
  display:none;position:absolute;left:50%;bottom:22px;z-index:4;
  transform:translateX(-50%);font-size:.58rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gris);align-items:center;gap:.6rem;
}
@media (min-width:900px){ .defil-cue{display:flex;} }
.defil-cue::after{
  content:"";width:1px;height:34px;background:linear-gradient(var(--gris-clair),transparent);
  animation:cue 2.4s ease-in-out infinite;
}
@keyframes cue{0%,100%{opacity:.3;transform:scaleY(.6);transform-origin:top}50%{opacity:1;transform:scaleY(1)}}

/* ---- Bandeau défilant ---- */
.marquee{
  overflow:hidden;border-block:1px solid var(--ligne);background:var(--ivoire);
  padding-block:var(--sp-4);
}
.marquee__piste{
  display:flex;width:max-content;gap:var(--sp-7);
  animation:defile 42s linear infinite;
}
.marquee:hover .marquee__piste{animation-play-state:paused;}
.marquee span{
  font-family:var(--serif);font-size:1.15rem;font-style:italic;color:var(--encre-2);
  white-space:nowrap;display:flex;align-items:center;gap:var(--sp-7);
}
.marquee span::after{content:"◦";color:var(--rose);font-style:normal;font-size:.9rem;}
@keyframes defile{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  .marquee__piste{animation:none;flex-wrap:wrap;width:auto;justify-content:center;}
}

/* ---- Catégories : composition asymétrique ---- */
.cats-edito{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-3);}
@media (min-width:900px){
  .cats-edito{grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(190px,auto);gap:var(--sp-4);}
  .cats-edito>a:nth-child(1){grid-column:span 2;grid-row:span 2;}
  .cats-edito>a:nth-child(6){grid-column:span 2;}
}
.cats-edito .cat{aspect-ratio:auto;height:100%;min-height:190px;}
@media (max-width:899px){ .cats-edito .cat{aspect-ratio:4/5;} }
.cat__label strong{letter-spacing:-.01em;}
/* Voile léger : on garde la clarté des visuels, on assure juste la lisibilité */
.cat::after{
  background:linear-gradient(to top,rgba(28,26,24,.34) 0%,rgba(28,26,24,.05) 34%,transparent 55%);
  transition:opacity var(--trans);
}
.cat:hover::after{opacity:.8;}
.cats-edito .cat__label{left:var(--sp-4);bottom:var(--sp-4);}
@media (min-width:900px){
  .cats-edito>a:nth-child(1) .cat__label strong{font-size:2.1rem;}
  .cats-edito>a:nth-child(1) .cat__label,
  .cats-edito>a:nth-child(6) .cat__label{left:var(--sp-5);bottom:var(--sp-5);}
}
.cat__label span{opacity:0;transform:translateY(4px);transition:all var(--trans);display:block;}
.cat:hover .cat__label span{opacity:.92;transform:none;}
@media (hover:none){ .cat__label span{opacity:.9;transform:none;} }

/* ---- Le look du moment ---- */
.look{background:var(--creme);overflow:hidden;}
.look__grid{display:grid;}
@media (min-width:900px){ .look__grid{grid-template-columns:1.12fr .88fr;align-items:stretch;} }
.look__media{position:relative;aspect-ratio:4/5;overflow:hidden;}
@media (min-width:900px){ .look__media{aspect-ratio:auto;min-height:660px;} }
.look__media img{width:100%;height:100%;object-fit:cover;}
.look__num{
  position:absolute;top:var(--sp-5);left:var(--sp-5);z-index:2;
  font-family:var(--serif);font-size:3.4rem;line-height:1;color:var(--encre);
  opacity:.22;font-style:italic;
}
.look__txt{padding:var(--sp-7) var(--sp-4);align-self:center;}
@media (min-width:900px){ .look__txt{padding:var(--sp-8) clamp(2.5rem,4.5vw,4.5rem);} }
.look__liste{margin-top:var(--sp-6);border-top:1px solid var(--ligne);}
.look__item{
  display:grid;grid-template-columns:64px 1fr auto;gap:var(--sp-4);align-items:center;
  padding-block:var(--sp-4);border-bottom:1px solid var(--ligne);
  transition:padding-left var(--trans);
}
.look__item:hover{padding-left:6px;}
.look__item img{width:64px;aspect-ratio:2/3;object-fit:cover;background:var(--ivoire);}
.look__item strong{font-weight:300;font-size:.88rem;display:block;}
.look__item .look__cat{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gris-clair);display:block;margin-bottom:3px;}
.look__item em{font-family:var(--serif);font-style:normal;font-size:1rem;white-space:nowrap;}

/* ---- Manifeste ---- */
.manifeste{background:var(--ivoire);text-align:center;}
.manifeste p{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(1.75rem,4.4vw,3.3rem);line-height:1.22;letter-spacing:-.015em;
  max-width:19ch;margin-inline:auto;
}
.manifeste em{font-style:italic;color:var(--rose-fonce);}
.manifeste__signature{
  font-family:var(--script);font-size:1.7rem;color:var(--encre-2);
  margin-top:var(--sp-6);display:block;
}
.manifeste__filet{width:1px;height:56px;background:var(--ligne);margin:0 auto var(--sp-6);}

/* ---- Collections éditoriales (page collections) ---- */
.col-edito{display:grid;gap:var(--sp-7);}
.col-edito__bloc{display:grid;gap:var(--sp-5);align-items:center;}
@media (min-width:900px){
  .col-edito{gap:var(--sp-10);}
  .col-edito__bloc{grid-template-columns:1fr 1fr;gap:var(--sp-8);}
  .col-edito__bloc:nth-child(even) .col-edito__media{order:2;}
}
.col-edito__media{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--creme);}
.col-edito__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.22,1,.36,1);}
.col-edito__bloc:hover .col-edito__media img{transform:scale(1.035);}
.col-edito__num{
  font-family:var(--serif);font-style:italic;font-size:1.05rem;color:var(--rose-fonce);
  display:block;margin-bottom:var(--sp-3);
}
.col-edito__txt h3{font-size:clamp(1.7rem,3.4vw,2.5rem);margin-bottom:var(--sp-4);}
.col-edito__txt p{color:var(--gris);max-width:44ch;}
.col-edito__meta{
  display:flex;gap:var(--sp-5);margin-top:var(--sp-5);padding-top:var(--sp-4);
  border-top:1px solid var(--ligne);font-size:.74rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gris-clair);flex-wrap:wrap;
}

/* ---- Rail : pas de coupe brutale en bord d'écran ---- */
.rail{scroll-padding-inline:var(--sp-4);}
@media (min-width:1024px){ .rail{gap:var(--sp-5);} }

/* ---- Instagram : légende au survol ---- */
.insta a::before{
  content:attr(data-legende);position:absolute;inset:auto 0 0 0;z-index:2;
  padding:var(--sp-3);color:#fff;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;
  opacity:0;transform:translateY(6px);transition:all var(--trans);
}
.insta a:hover::before{opacity:1;transform:none;}

/* ---- Bouton : trait qui se déploie ---- */
.btn--outline{position:relative;overflow:hidden;}
.lien-fin{
  display:inline-flex;align-items:center;gap:.55rem;
  font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--encre);
  padding-bottom:4px;position:relative;white-space:nowrap;
}
.lien-fin::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;
  background:var(--encre);transform-origin:right;transform:scaleX(1);
  transition:transform .45s cubic-bezier(.76,0,.24,1);
}
.lien-fin:hover::after{transform:scaleX(0);}
.lien-fin i{font-style:normal;transition:transform var(--trans);}
.lien-fin:hover i{transform:translateX(4px);}