/* =========================================================
   LE COMPTOIR DES HOMMES — style commun à toutes les pages
   Charte « Terre d'Abidjan » : safran, chocolat, sable.
   Pour changer une couleur partout, modifiez-la ici.
   ========================================================= */
:root{
  --safran:#E2A31B;      /* le mur jaune des photos */
  --safran-clair:#F0C25A;
  --chocolat:#2E1C12;    /* texte et sections sombres (remplace le noir) */
  --cacao:#7B4B2C;       /* brun des tuniques */
  --nuit:#1C2F5E;        /* bleu nuit de la tunique des photos de campagne */
  --rose:#B4729E;        /* fond rose-violet des photos de campagne */
  --sable:#E9DAC0;       /* fonds de section */
  --lait:#FBF6EE;        /* fond principal */
  --gris:#55432F;        /* texte secondaire (assez foncé pour bien se lire) */
  --ligne:#DCCBB0;
  --blanc:#FFFFFF;

  --display:'Fraunces', Georgia, serif;   /* titres : sérif élégant, traits pleins et lisibles */
  --texte:'DM Sans', system-ui, sans-serif;   /* texte courant : très lisible, y compris sur téléphone */
  --marque:'Cinzel', Georgia, serif;

  --gouttiere:clamp(20px, 5vw, 64px);
  --entete:118px;
}

*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:var(--entete)}
body{background:var(--lait);color:var(--chocolat);font-family:var(--texte);font-size:18px;line-height:1.7;font-weight:400;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:2px solid var(--chocolat);outline-offset:3px}
::selection{background:var(--safran);color:var(--chocolat)}
.wrap{max-width:1320px;margin:0 auto;padding:0 var(--gouttiere)}
.etroit{max-width:760px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Typographie ---------- */
h1,h2,h3,h4{font-family:var(--display);font-weight:400;line-height:1.06;letter-spacing:-.015em;font-optical-sizing:auto}
.titre-xl{font-size:clamp(3rem,7.6vw,7.4rem);letter-spacing:-.025em}
.titre-l{font-size:clamp(2.4rem,5vw,4.6rem);letter-spacing:-.02em}
.titre-m{font-size:clamp(1.9rem,3.2vw,2.9rem)}
.chapo{font-size:clamp(1.08rem,1.4vw,1.25rem);line-height:1.6;max-width:44ch}
.texte p{max-width:62ch;margin-bottom:1.1em}
.gris{color:var(--gris)}
.declaration{font-family:var(--display);font-size:clamp(1.8rem,3.6vw,3.3rem);line-height:1.18;letter-spacing:-.012em;max-width:22ch}

/* ---------- Boutons & liens ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 30px;border-radius:2px;border:1px solid var(--chocolat);font-weight:500;font-size:1rem;text-decoration:none;transition:background .25s,color .25s,border-color .25s}
.btn-plein{background:var(--chocolat);color:var(--lait)}
.btn-plein:hover{background:var(--cacao);border-color:var(--cacao)}
.btn-contour{background:transparent;color:var(--chocolat)}
.btn-contour:hover{background:var(--chocolat);color:var(--lait)}
.btn-clair{background:var(--lait);color:var(--chocolat);border-color:var(--lait)}
.btn-clair:hover{background:var(--safran);border-color:var(--safran)}
.btn[disabled]{opacity:.4;cursor:not-allowed}
.btns{display:flex;gap:12px;flex-wrap:wrap}
.lien{font-weight:500;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;padding-bottom:3px;transition:background-size .3s}
.lien:hover{background-size:0 1px;background-position:100% 100%}

/* ---------- En-tête ---------- */
.entete{position:fixed;inset:0 0 auto;z-index:40;height:var(--entete);transition:background .3s,box-shadow .3s}
.entete.plein,.entete.defile{background:rgba(251,246,238,.94);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--ligne)}
.entete-in{height:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
.nav{display:flex;gap:30px;font-size:.96rem}
.nav a{text-decoration:none;font-weight:500;padding:6px 0;border-bottom:1px solid transparent}
.nav a:hover,.nav a[aria-current="page"]{border-color:currentColor}
.nav-droite{justify-content:flex-end;align-items:center}
.marque-lien{display:flex;flex-direction:column;align-items:center;gap:4px;text-decoration:none}
.marque-lien svg{width:30px;height:30px}
.marque-lien span{font-family:var(--marque);font-weight:600;font-size:.9rem;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap}
.outils{display:flex;align-items:center;gap:8px}
.btn-langue{background:none;border:1px solid currentColor;border-radius:999px;height:36px;min-width:44px;font-size:.9rem;font-weight:500;opacity:.85}
.btn-langue:hover{opacity:1}
.btn-panier{background:var(--chocolat);color:var(--lait);border:0;border-radius:999px;height:40px;padding:0 16px;display:flex;align-items:center;gap:8px;font-weight:500;font-size:.92rem}
.btn-panier b{background:var(--safran);color:var(--chocolat);border-radius:999px;min-width:22px;height:22px;display:grid;place-items:center;font-size:.9rem;font-weight:600}
.btn-menu{display:none;background:none;border:0;font-weight:500;padding:8px 4px}
@media (max-width:520px){
  .marque-lien span{font-size:.64rem;letter-spacing:.1em}
  .outils > .btn-langue{display:none}
  .btn-panier .libelle{display:none}
  .btn-langue{min-width:40px;height:34px}
}
@media (max-width:350px){.marque-lien span{display:none}}

/* Sélecteur de devise */
.choix-devise{appearance:none;-webkit-appearance:none;font:inherit;font-size:.9rem;font-weight:500;color:inherit;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23999' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 12px center;border:1px solid currentColor;border-radius:999px;height:36px;padding:0 30px 0 14px;opacity:.9;cursor:pointer}
.choix-devise option{color:#2E1C12;background:#FBF6EE}
.choix-devise:hover{opacity:1}
.note-devise{font-size:.9rem;color:var(--gris);margin-top:6px}
.note-devise:empty{display:none}
.outils-menu{display:flex;gap:10px;align-items:center}

/* Menu mobile plein écran */
.menu-mobile{position:fixed;inset:0;z-index:45;background:var(--safran);padding:calc(var(--entete) + 20px) var(--gouttiere) 40px;display:flex;flex-direction:column;justify-content:space-between;transform:translateY(-100%);transition:transform .45s cubic-bezier(.7,0,.2,1);visibility:hidden}
.menu-mobile.ouvert{transform:none;visibility:visible}
.menu-mobile nav{display:flex;flex-direction:column;gap:6px}
.menu-mobile nav a{font-family:var(--display);font-size:clamp(2.2rem,9vw,3.4rem);text-decoration:none;line-height:1.15}
.menu-mobile .pied-menu{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-weight:500}
.menu-mobile .fermer-menu{position:absolute;top:20px;right:var(--gouttiere);background:none;border:0;font-weight:500;padding:8px 4px}

/* ---------- Sections ---------- */
section{padding:clamp(72px,10vw,140px) 0}
.fond-sable{background:var(--sable)}
.fond-safran{background:var(--safran)}
.fond-chocolat{background:var(--chocolat);color:var(--lait)}
.fond-chocolat .gris{color:#C9B79F}
.tete-section{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:clamp(32px,4vw,56px)}
.tete-section p{max-width:48ch}

/* ---------- Accueil : héros ---------- */
.heros{padding:0;background:var(--safran);min-height:100svh;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)}
.heros h1{font-size:clamp(2.7rem,5.5vw,6.6rem)}
.heros-texte{padding:calc(var(--entete) + 40px) var(--gouttiere) clamp(40px,6vw,80px);display:flex;flex-direction:column;justify-content:flex-end;gap:28px}
.heros-texte .rosace{width:74px;height:74px}
.heros-photo{position:relative;overflow:hidden}
.heros-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.heros h1 .l-titre{display:block;overflow:hidden;padding-bottom:.06em}
.heros h1 .l-titre > span{display:block}
.chiffre-cle{display:flex;gap:28px;flex-wrap:wrap;font-size:.95rem;border-top:1px solid rgba(46,28,18,.3);padding-top:18px;margin-top:8px}
@media (max-width:860px){
  .heros{grid-template-columns:1fr;min-height:0}
  .heros-photo{order:-1;height:72svh;min-height:440px}
  .heros-texte{padding-top:36px}
}

/* Entrée orchestrée du héros (le seul mouvement automatique du site) */
.anim .heros h1 .l-titre > span{transform:translateY(105%);animation:monte 1s cubic-bezier(.2,.7,.1,1) forwards}
.anim .heros h1 .l-titre:nth-child(2) > span{animation-delay:.12s}
.anim .heros h1 .l-titre:nth-child(3) > span{animation-delay:.24s}
.anim .heros .apparait{opacity:0;animation:fondu .9s ease-out .6s forwards}
.anim .heros-photo img{transform:scale(1.08);animation:recule 1.8s cubic-bezier(.2,.7,.1,1) forwards}
.petale{stroke-dasharray:1;stroke-dashoffset:1;animation:trace 1s ease-out forwards}
@keyframes monte{to{transform:none}}
@keyframes fondu{to{opacity:1}}
@keyframes recule{to{transform:none}}
@keyframes trace{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition:none!important;scroll-behavior:auto!important}
}

/* Héros « campagne » : le portrait de la marque, avec le bleu nuit de sa tunique */
.heros-campagne{background:var(--nuit);color:var(--lait)}
.heros-campagne .btn-plein{background:var(--lait);color:var(--nuit);border-color:var(--lait)}
.heros-campagne .btn-plein:hover{background:var(--sable);border-color:var(--sable)}
.heros-campagne .btn-contour{border-color:rgba(251,246,238,.7);color:var(--lait)}
.heros-campagne .btn-contour:hover{background:var(--lait);color:var(--nuit);border-color:var(--lait)}
.heros-campagne .chapo{color:#D9DDEA}
.heros-campagne .fil,.heros-campagne .fil a{color:#B9C0D6}
.heros-campagne:focus-within :focus-visible{outline-color:var(--lait)}
.heros-campagne .heros-photo{background:var(--rose)}
.heros-campagne .heros-photo img{object-position:50% 12%}
.heros-campagne .heros-photo::after{content:"";position:absolute;inset:0 0 auto;height:22%;background:linear-gradient(rgba(20,24,48,.38),transparent);pointer-events:none}
.heros-page{min-height:min(100svh,920px)}
.heros-page .heros-photo img{object-position:50% 18%}
/* En-tête clair posé sur le héros, tant qu'on n'a pas défilé */
.page-campagne .entete:not(.defile){color:var(--lait)}
.page-campagne .entete:not(.defile) .btn-panier{background:var(--lait);color:var(--nuit)}
.page-campagne .entete:not(.defile) :focus-visible{outline-color:var(--lait)}
.regard{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,6vw,96px);align-items:start}
.regard .texte p{color:var(--chocolat)}
@media (max-width:760px){.regard{grid-template-columns:1fr}}
.reperes{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:clamp(48px,7vw,96px);border-top:1px solid var(--chocolat)}
.reperes div{padding:22px 20px 0 0}
.reperes dt{font-family:var(--display);font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.1}
.reperes dd{color:var(--gris);margin-top:6px;font-size:.98rem}
@media (max-width:760px){.reperes{grid-template-columns:1fr 1fr;row-gap:28px}}

/* Bandeau de services */
.services{background:var(--chocolat);color:var(--lait);padding:18px 0;font-size:.95rem}
.services .wrap{display:flex;justify-content:space-between;gap:12px 28px;flex-wrap:wrap}

/* ---------- Collection ---------- */
.fourchette{font-weight:500}
.filtres{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:36px}
.filtres button{background:none;border:1px solid var(--ligne);border-radius:999px;padding:8px 18px;font-size:.92rem;color:var(--gris)}
.filtres button:hover{border-color:var(--chocolat);color:var(--chocolat)}
.filtres button[aria-pressed="true"]{background:var(--chocolat);border-color:var(--chocolat);color:var(--lait)}
.grille{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(36px,4vw,64px) clamp(16px,2vw,28px)}
@media (max-width:980px){.grille{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.grille{grid-template-columns:1fr 1fr;gap:28px 12px}}
.produit{background:none;border:0;text-align:left;display:block;width:100%}
.photo{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--sable)}
.photo img{width:100%;height:100%;object-fit:cover;object-position:50% 18%}
.produit .photo img{transition:transform 1.2s cubic-bezier(.2,.7,.1,1)}
.produit:hover .photo img{transform:scale(1.035)}
.produit h3{font-size:clamp(1.15rem,1.6vw,1.45rem);margin-top:16px}
.produit .meta{display:flex;justify-content:space-between;gap:10px;color:var(--gris);font-size:.94rem;margin-top:4px}
.produit .prix{color:var(--chocolat);font-weight:500;white-space:nowrap}
@media (max-width:520px){.produit .meta{flex-direction:column;gap:0}}
.badge{display:inline-block;background:var(--chocolat);color:var(--lait);font-size:.84rem;font-weight:500;padding:5px 11px;border-radius:999px}
.photo .badge{position:absolute;top:12px;left:12px}
.produit.epuise img{filter:grayscale(.75);opacity:.75}
.note-mini{min-height:22px;margin-top:6px;display:flex;align-items:center;gap:6px}
.etoiles{color:var(--chocolat);letter-spacing:1px;font-size:.92rem;line-height:1}
.etoiles .eteintes{color:#D3C2A6}
.nb-avis{font-size:.92rem;color:var(--gris)}
.vide{color:var(--gris);padding:24px 0}

/* ---------- Blocs éditoriaux ---------- */
.duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch}
.duo > .media{min-height:min(88vh,820px);overflow:hidden}
.duo > .media img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.duo > .contenu{padding:clamp(48px,7vw,110px) var(--gouttiere);display:flex;flex-direction:column;justify-content:center;gap:24px}
.duo.inverse > .media{order:2}
@media (max-width:860px){.duo{grid-template-columns:1fr}.duo > .media{min-height:0;aspect-ratio:4/5}.duo.inverse > .media{order:0}}

.manifeste{text-align:left}
.manifeste .wrap{display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,5vw,80px);align-items:start}
.manifeste svg{width:clamp(64px,8vw,110px);height:auto}
@media (max-width:640px){.manifeste .wrap{grid-template-columns:1fr}}

.bande-photos{display:grid;grid-template-columns:1.2fr .8fr 1fr;gap:clamp(10px,1.4vw,20px);align-items:end}
.bande-photos img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:50% 20%}
.bande-photos img:nth-child(2){aspect-ratio:4/5}
@media (max-width:700px){.bande-photos{grid-template-columns:1fr 1fr}.bande-photos img:first-child{grid-column:1/-1;aspect-ratio:4/5}}

/* ---------- Pages intérieures : en-tête de page ---------- */
.tete-page{padding:calc(var(--entete) + clamp(48px,8vw,110px)) 0 clamp(48px,6vw,80px)}
.tete-page .fil{font-size:.92rem;color:var(--gris);margin-bottom:22px}
.tete-page .fil a{text-decoration:none}
.tete-page .chapo{margin-top:26px}

/* La Maison */
.piliers{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,44px)}
.pilier img{width:100%;aspect-ratio:1/1;object-fit:cover;margin-bottom:22px}
.pilier h3{font-size:1.7rem;margin-bottom:10px}
.pilier p{color:var(--gris)}
@media (max-width:860px){.piliers{grid-template-columns:1fr}.pilier img{aspect-ratio:4/3}}

/* Sur mesure */
.etapes{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,40px);counter-reset:e}
.etapes li{counter-increment:e;border-top:1px solid currentColor;padding-top:20px}
.etapes li::before{content:counter(e);font-family:var(--display);font-size:3.2rem;line-height:1;display:block;margin-bottom:14px}
.etapes h3{font-family:var(--texte);font-weight:500;font-size:1.1rem;margin-bottom:6px;letter-spacing:0}
.etapes p{opacity:.85;font-size:.98rem}
@media (max-width:900px){.etapes{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.etapes{grid-template-columns:1fr}}
.occasions{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px)}
.occasions h3{font-size:1.7rem;margin-bottom:8px}
.occasions p{color:var(--gris)}
@media (max-width:760px){.occasions{grid-template-columns:1fr}}
.mesures{display:grid;grid-template-columns:repeat(3,1fr);gap:0 40px}
.mesures div{padding:20px 0;border-bottom:1px solid var(--ligne)}
.mesures h4{font-family:var(--texte);font-weight:500;font-size:1.02rem;letter-spacing:0;margin-bottom:4px}
.mesures p{color:var(--gris);font-size:.96rem}
@media (max-width:860px){.mesures{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.mesures{grid-template-columns:1fr}}
.tableau{overflow-x:auto;border-top:1px solid var(--chocolat)}
table{width:100%;border-collapse:collapse;min-width:520px;font-size:.98rem}
th,td{padding:16px 14px 16px 0;text-align:left;border-bottom:1px solid var(--ligne)}
th{font-weight:500;color:var(--gris);font-size:.9rem}

.formulaire{display:grid;gap:18px}
.formulaire .deux{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:620px){.formulaire .deux{grid-template-columns:1fr}}
.formulaire label{display:grid;gap:8px;font-size:.92rem;font-weight:500}
.formulaire input,.formulaire select,.formulaire textarea{font:inherit;font-weight:400;color:var(--chocolat);background:transparent;border:0;border-bottom:1px solid var(--chocolat);border-radius:0;padding:10px 0;width:100%}
.formulaire textarea{resize:vertical;min-height:96px}
.formulaire input:focus,.formulaire select:focus,.formulaire textarea:focus{outline:none;border-bottom-width:2px;padding-bottom:9px}
.formulaire .aide{font-size:.92rem;color:var(--gris);font-weight:400}
.formulaire .msg{min-height:1.3em;font-size:.94rem}

/* Lookbook */
.lookbook{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(12px,2vw,28px);align-items:end}
.look{margin:0}
.look img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.look figcaption{display:flex;justify-content:space-between;gap:12px;font-size:.92rem;color:var(--gris);padding-top:10px}
.look figcaption a{color:var(--chocolat)}
.l-large{grid-column:span 7}.l-large img{aspect-ratio:4/5}
.l-moyen{grid-column:span 5}.l-moyen img{aspect-ratio:3/4}
.l-plein{grid-column:1/-1}.l-plein img{aspect-ratio:16/9;object-position:50% 30%}
.l-terrasse img{aspect-ratio:16/10;object-position:50% 42%}
.l-tiers{grid-column:span 4}.l-tiers img{aspect-ratio:3/4}
.l-decale{margin-top:clamp(40px,8vw,120px)}
@media (max-width:760px){.lookbook{grid-template-columns:1fr 1fr}.l-large,.l-plein{grid-column:1/-1}.l-moyen,.l-tiers{grid-column:span 1}.l-plein img{aspect-ratio:4/5}.l-decale{margin-top:0}}

/* Contact */
.contact-grille{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,96px)}
@media (max-width:860px){.contact-grille{grid-template-columns:1fr}}
.infos-pratiques{display:grid;gap:0}
.infos-pratiques div{padding:22px 0;border-bottom:1px solid var(--ligne)}
.infos-pratiques h3{font-family:var(--texte);font-weight:500;font-size:1.06rem;letter-spacing:0;margin-bottom:4px}
.infos-pratiques p{color:var(--gris)}
.faq details{border-bottom:1px solid var(--ligne)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;padding:22px 0;font-weight:500;font-size:1.06rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--display);font-size:1.6rem;line-height:1;transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--gris);padding:0 0 22px;max-width:62ch}
.reseaux{display:flex;gap:22px;flex-wrap:wrap;margin-top:12px}

/* ---------- Pied de page ---------- */
.pied{background:var(--chocolat);color:var(--lait);padding:clamp(64px,8vw,110px) 0 32px}
.pied-haut{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;padding-bottom:56px;border-bottom:1px solid rgba(251,246,238,.18)}
.pied-marque svg{width:54px;height:54px;margin-bottom:20px}
.pied-marque strong{display:block;font-family:var(--marque);font-weight:500;letter-spacing:.18em;text-transform:uppercase;font-size:1rem}
.pied-marque p{color:#C9B79F;margin-top:6px}
.pied h4{font-family:var(--texte);font-weight:500;font-size:.92rem;color:#C9B79F;letter-spacing:0;margin-bottom:14px}
.pied ul{list-style:none;display:grid;gap:8px}
.pied ul a{text-decoration:none}
.pied ul a:hover{text-decoration:underline}
.pied-bas{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:26px;font-size:.94rem;color:#C9B79F}
@media (max-width:860px){.pied-haut{grid-template-columns:1fr 1fr}.pied-marque{grid-column:1/-1}}

/* ---------- Fiche produit (fenêtre) ---------- */
dialog{border:0;border-radius:2px;padding:0;max-width:980px;width:calc(100% - 28px);max-height:92vh;margin:auto;overflow-y:auto;background:var(--lait);color:var(--chocolat)}
dialog::backdrop{background:rgba(46,28,18,.6)}
.fiche{display:grid;grid-template-columns:1fr 1fr;position:relative}
.fiche > .photo{aspect-ratio:auto;min-height:100%}
.fiche-txt{padding:clamp(28px,4vw,48px)}
.fiche-txt h3{font-size:clamp(2rem,3.4vw,2.8rem);margin-bottom:10px}
.fiche-txt .prix{font-size:1.2rem;font-weight:500;margin-bottom:18px}
.fiche-txt p{color:var(--gris);margin-bottom:22px}
.note-fiche{display:flex;gap:6px;align-items:center;margin:-8px 0 16px!important}
.tailles{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 26px}
.tailles button{width:50px;height:46px;border:1px solid var(--ligne);background:var(--blanc);border-radius:2px;font-weight:500}
.tailles button:hover{border-color:var(--chocolat)}
.tailles button[aria-pressed="true"]{border-color:var(--chocolat);background:var(--chocolat);color:var(--lait)}
.btn-large{width:100%}
.alerte-stock{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.fermer{position:absolute;top:12px;right:12px;width:42px;height:42px;border-radius:50%;border:0;background:var(--lait);font-size:1.4rem;line-height:1;box-shadow:0 1px 6px rgba(46,28,18,.18)}
@media (max-width:720px){.fiche{grid-template-columns:1fr}.fiche > .photo{max-height:420px;aspect-ratio:3/4}}
.fiche-avis{grid-column:1/-1;border-top:1px solid var(--ligne);padding:clamp(28px,4vw,48px)}
.fiche-avis h4{font-size:1.9rem;margin-bottom:14px}
.avis-moyenne{display:flex;align-items:center;gap:10px;color:var(--gris);margin-bottom:8px}
.avis-moyenne .etoiles{font-size:1.2rem}
.liste-avis{list-style:none;margin-bottom:32px}
.liste-avis li{padding:18px 0;border-bottom:1px solid var(--ligne)}
.liste-avis p{margin:6px 0 0}
.avis-auteur{font-size:.94rem;color:var(--gris)}
.avis-vide{color:var(--gris);margin-bottom:26px}
.form-avis{display:grid;gap:16px;max-width:540px}
.form-avis h4{font-size:1.4rem;margin:0}
.form-avis fieldset{border:0}
.form-avis legend,.form-avis label{font-size:.92rem;font-weight:500}
.form-avis label{display:grid;gap:6px}
.form-avis input,.form-avis textarea{font:inherit;font-weight:400;color:var(--chocolat);background:var(--blanc);border:1px solid var(--ligne);border-radius:2px;padding:12px;width:100%}
.form-avis input:focus,.form-avis textarea:focus{outline:2px solid var(--chocolat);outline-offset:0;border-color:var(--chocolat)}
.choix-note{display:flex;gap:2px;margin-top:6px}
.choix-note button{background:none;border:0;font-size:2rem;line-height:1;color:#D3C2A6;padding:2px}
.choix-note button.on{color:var(--chocolat)}
.piege{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.msg-avis{font-size:.94rem;color:var(--gris);min-height:1.2em}
.msg-avis.ok{color:var(--chocolat);font-weight:500}

/* ---------- Panier ---------- */
.voile{position:fixed;inset:0;background:rgba(46,28,18,.5);opacity:0;pointer-events:none;transition:opacity .3s;z-index:50}
.voile.ouvert{opacity:1;pointer-events:auto}
.tiroir{position:fixed;top:0;right:0;height:100%;width:min(440px,100%);background:var(--lait);z-index:60;transform:translateX(100%);transition:transform .4s cubic-bezier(.7,0,.2,1);display:flex;flex-direction:column}
.tiroir.ouvert{transform:none}
.tiroir-tete{display:flex;justify-content:space-between;align-items:center;padding:22px 26px;border-bottom:1px solid var(--ligne)}
.tiroir-tete h3{font-size:1.8rem}
.tiroir-tete .fermer{position:static;box-shadow:none;background:none}
.lignes{flex:1;overflow-y:auto;padding:8px 26px}
.ligne{display:grid;grid-template-columns:68px 1fr auto;gap:14px;align-items:center;padding:16px 0;border-bottom:1px solid var(--ligne)}
.ligne .mini{width:68px;height:88px;overflow:hidden;background:var(--sable)}
.ligne .mini img{width:100%;height:100%;object-fit:cover;object-position:50% 18%}
.ligne small{color:var(--gris);display:block}
.ligne .suppr{background:none;border:0;color:var(--gris);text-decoration:underline;font-size:.92rem}
.tiroir-pied{padding:22px 26px;border-top:1px solid var(--ligne)}
.total{display:flex;justify-content:space-between;font-weight:500;font-size:1.05rem;margin-bottom:16px}
.note{font-size:.92rem;color:var(--gris);margin-top:12px;text-align:center}

.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:var(--chocolat);color:var(--lait);padding:12px 22px;border-radius:999px;font-size:.92rem;opacity:0;transition:.3s;z-index:70;pointer-events:none}
.toast.vu{opacity:1;transform:translate(-50%,0)}

/* =========================================================
   BOUTIQUE, FILTRES, GALERIE & LOOKBOOK
   ========================================================= */
/* Grille de la boutique : 4 colonnes sur grand écran, 2 sur téléphone */
.grille-boutique{grid-template-columns:repeat(4,1fr);gap:clamp(32px,3.6vw,56px) clamp(14px,1.8vw,24px)}
@media (max-width:1180px){.grille-boutique{grid-template-columns:repeat(3,1fr)}}
@media (max-width:820px){.grille-boutique{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.grille-boutique{gap:28px 12px}}
.produit .photo-alt{position:absolute;inset:0;opacity:0;transition:opacity .45s ease}
@media (hover:hover){.produit.a-alt:hover .photo-alt{opacity:1}}
.badge-nouveau{background:var(--lait);color:var(--chocolat);box-shadow:0 0 0 1px rgba(46,28,18,.12)}
.voir-tout{display:flex;justify-content:center;margin-top:clamp(40px,5vw,64px)}

/* En-tête de la boutique */
.tete-boutique{padding-bottom:clamp(28px,4vw,48px)}
.tete-boutique-in{display:grid;grid-template-columns:1fr minmax(0,460px);gap:24px 48px;align-items:end}
.tete-boutique .chapo{margin:0 0 10px}
@media (max-width:860px){.tete-boutique-in{grid-template-columns:1fr}}

/* Barre de filtres (collante sur ordinateur) */
.section-boutique{padding-top:0}
.barre-boutique{background:var(--lait);border-block:1px solid var(--ligne);padding:16px 0;margin-bottom:clamp(28px,4vw,48px)}
@media (min-width:900px){.barre-boutique{position:sticky;top:var(--entete);z-index:20}}
.chips-couleur{display:flex;gap:8px;flex-wrap:wrap}
.chips-couleur button{display:inline-flex;align-items:center;gap:8px;background:none;border:1px solid var(--ligne);border-radius:999px;padding:7px 16px 7px 12px;font-size:.94rem;white-space:nowrap}
.chips-couleur button:first-child{padding-left:16px}
.chips-couleur button:hover{border-color:var(--chocolat)}
.chips-couleur button[aria-pressed="true"]{background:var(--chocolat);border-color:var(--chocolat);color:var(--lait)}
.pastille-c{width:14px;height:14px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(46,28,18,.25);flex:none}
@media (max-width:760px){.chips-couleur{flex-wrap:nowrap;overflow-x:auto;margin:0 calc(var(--gouttiere) * -1);padding:2px var(--gouttiere);scrollbar-width:none}
  .chips-couleur::-webkit-scrollbar{display:none}}
.barre-ligne{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;margin-top:14px}
.filtres-plus{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px}
.champ-filtre{display:inline-flex;align-items:center;gap:8px;font-size:.94rem;color:var(--gris)}
.champ-filtre select{appearance:none;-webkit-appearance:none;font:inherit;font-weight:500;color:var(--chocolat);background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%232E1C12' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 2px center;border:0;border-bottom:1px solid var(--chocolat);border-radius:0;padding:4px 20px 4px 0;cursor:pointer}
.case{display:inline-flex;align-items:center;gap:8px;font-size:.94rem;cursor:pointer}
.case input{width:18px;height:18px;accent-color:var(--chocolat)}
button.lien{background:none;border:0;color:inherit;font:inherit;font-size:.94rem;cursor:pointer;padding:0 0 3px}
.barre-droite{margin-left:auto;display:flex;align-items:center;gap:20px}
.compte{font-size:.94rem;color:var(--gris);white-space:nowrap}
.btn-filtres{display:none;background:none;border:1px solid var(--chocolat);border-radius:999px;padding:7px 18px;font-weight:500;font-size:.94rem}
@media (max-width:760px){
  .btn-filtres{display:inline-block}
  .filtres-plus{display:none;order:3;width:100%;padding:14px 0 4px;border-top:1px solid var(--ligne)}
  .filtres-plus.ouvert{display:flex}
  .barre-droite{gap:14px}
  .barre-droite .champ-filtre > span{display:none}
}
.vide-filtres{grid-column:1/-1;text-align:center;padding:48px 0;display:grid;justify-items:center;gap:20px;color:var(--gris)}

/* Fiche produit : galerie de photos */
.galerie{position:relative;min-width:0;background:var(--sable)}
.galerie-piste{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;height:100%}
.galerie-piste::-webkit-scrollbar{display:none}
.galerie-piste img{flex:0 0 100%;width:100%;height:100%;min-height:520px;object-fit:cover;object-position:50% 18%;scroll-snap-align:start}
.galerie-vignettes{position:absolute;left:12px;bottom:12px;display:flex;gap:8px}
.galerie-vignettes button{width:52px;height:66px;padding:0;border:2px solid transparent;background:var(--lait);overflow:hidden;opacity:.85}
.galerie-vignettes button[aria-current="true"]{border-color:var(--lait);opacity:1;box-shadow:0 2px 10px rgba(46,28,18,.3)}
.galerie-vignettes img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
@media (max-width:720px){.galerie-piste img{min-height:0;aspect-ratio:3/4;height:auto}}
.fiche-txt .badge{margin-bottom:14px}
.fiche-txt .specs{font-size:.94rem;line-height:1.6;color:var(--gris);border-top:1px solid var(--ligne);padding-top:14px}
.liens-fiche{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.94rem;margin:18px 0 0!important}

/* Lookbook par ambiance */
.ancres{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.ancres a{border:1px solid var(--chocolat);border-radius:999px;padding:7px 18px;text-decoration:none;font-weight:500;font-size:.94rem}
.ancres a:hover{background:var(--chocolat);color:var(--lait)}
.chapitre{padding:clamp(40px,6vw,80px) 0 0}
.chapitre:last-of-type{padding-bottom:clamp(64px,8vw,110px)}
.tete-chapitre{display:flex;justify-content:space-between;align-items:baseline;gap:20px;border-top:1px solid var(--chocolat);padding-top:18px;margin-bottom:clamp(20px,3vw,36px)}
.mur{columns:3 260px;column-gap:clamp(12px,1.8vw,24px)}
.mur .look{break-inside:avoid;margin:0 0 clamp(12px,1.8vw,24px)}
.mur-studio{columns:2 300px}
.mur-details{columns:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.8vw,24px)}
.mur-details .look{margin:0}
.mur-details img{aspect-ratio:3/4;object-fit:cover}
@media (max-width:860px){.mur-details{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.mur{columns:2;column-gap:10px}.mur .look{margin-bottom:10px}.mur-studio{columns:1}}
.look a{display:block;text-decoration:none;color:inherit}
.look img{width:100%;height:auto;display:block;background:var(--sable)}
.look figcaption{display:flex;justify-content:space-between;gap:10px;font-size:.92rem;padding-top:10px}
.look figcaption .voir{color:var(--gris);white-space:nowrap}
.look a:hover figcaption .voir{color:var(--chocolat);text-decoration:underline}
@media (max-width:560px){.look figcaption .voir{display:none}}
/* cartes alignées en haut, même si le nom tient sur deux lignes */
.produit{align-self:start;vertical-align:top}
.grille-boutique{align-items:start}
button.lien{background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat}

/* =========================================================
   COMPTE, FAVORIS, ALERTES, EMBALLAGE CADEAU
   ========================================================= */
/* Cartes produit : bouton d'ouverture + cœur */
.produit{position:relative}
.produit .ouvrir{background:none;border:0;padding:0;margin:0;text-align:left;display:block;width:100%;color:inherit;font:inherit;cursor:pointer}
.coeur{position:absolute;top:10px;right:10px;z-index:2;width:40px;height:40px;border-radius:50%;border:0;background:rgba(251,246,238,.92);display:grid;place-items:center;color:var(--chocolat);box-shadow:0 1px 6px rgba(46,28,18,.12);transition:transform .2s}
.coeur:hover{transform:scale(1.08)}
.coeur svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7}
.coeur[aria-pressed="true"] svg{fill:#B4313A;stroke:#B4313A}
.coeur-texte{position:static;width:auto;height:auto;border-radius:999px;padding:8px 16px 8px 12px;display:inline-flex;gap:8px;align-items:center;box-shadow:none;border:1px solid var(--ligne);background:none;font-size:.94rem;margin-bottom:18px}
.coeur-texte:hover{transform:none;border-color:var(--chocolat)}
.astuce-cadeau{font-size:.94rem;margin:18px 0 0!important}

/* En-tête : compte */
.btn-compte{position:relative;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;color:inherit;border:1px solid currentColor}
.btn-compte svg{width:20px;height:20px}
.btn-compte .nb-favoris{position:absolute;top:-5px;right:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#B4313A;color:#fff;font-size:.72rem;font-weight:600;display:grid;place-items:center}
@media (max-width:380px){.btn-compte{width:36px;height:36px}}

/* Alerte retour en stock */
.form-alerte{display:grid;gap:10px;border:1px solid var(--ligne);padding:16px;margin:4px 0 16px;background:var(--blanc)}
.form-alerte strong{font-weight:500}
.canaux{display:flex;gap:18px;font-size:.94rem}
.canaux label{display:flex;gap:6px;align-items:center;cursor:pointer}
.canaux input{accent-color:var(--chocolat)}
.ligne-alerte{display:flex;gap:8px}
.ligne-alerte input{flex:1;min-width:0;font:inherit;border:1px solid var(--ligne);padding:10px 12px;background:var(--lait);color:var(--chocolat)}
.ligne-alerte .btn{min-height:46px;padding:0 18px}
.form-alerte .msg-avis{margin:0!important}

/* Panier : emballage, détail du total */
.zone-cadeau{padding:0 26px}
.zone-cadeau:empty{display:none}
.ajout-cadeau{width:100%;display:flex;gap:14px;align-items:center;text-align:left;background:var(--sable);border:1px dashed var(--cacao);padding:14px 16px;margin:16px 0 4px}
.ajout-cadeau .ico{font-size:1.6rem}
.ajout-cadeau strong{display:block;font-weight:500}
.ajout-cadeau small{color:var(--gris)}
.resume-cadeau{display:grid;grid-template-columns:62px 1fr auto;gap:12px;align-items:start;background:var(--sable);padding:12px 14px;margin:16px 0 4px}
.mini-paquet{width:62px;height:auto}
.resume-cadeau strong{display:block;font-weight:500}
.resume-cadeau small{display:block;color:var(--gris);font-size:.86rem}
.actions-cadeau{display:flex;gap:16px;margin-top:6px}
.actions-cadeau .lien{font-size:.86rem}
#detailTotal:empty{display:none}
#detailTotal{margin-bottom:10px}
.ligne-total{display:flex;justify-content:space-between;font-size:.94rem;color:var(--gris);padding:2px 0}
.anniv{background:#FBEBC5;border-left:3px solid var(--safran);padding:10px 12px;font-size:.94rem;margin-bottom:10px;color:var(--chocolat)}

/* Fenêtre emballage cadeau */
.dlg-cadeau{max-width:1040px}
.cadeau-tete{display:flex;justify-content:space-between;align-items:center;padding:22px clamp(20px,3vw,32px);border-bottom:1px solid var(--ligne);position:sticky;top:0;background:var(--lait);z-index:3}
.cadeau-tete h3{font-size:1.9rem}
.cadeau-tete .fermer{position:static;box-shadow:none;background:none}
.cadeau-corps{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(20px,3vw,40px);padding:clamp(20px,3vw,32px)}
@media (max-width:820px){.cadeau-corps{grid-template-columns:1fr}.cadeau-apercu{order:-1}}
.cadeau-options{display:grid;gap:22px}
.cadeau-options fieldset{border:0;display:grid;gap:10px}
.cadeau-options legend{font-weight:500;margin-bottom:10px}
.choix-nom{font-weight:400;color:var(--gris);margin-left:6px}
.formules{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.formule{cursor:pointer}
.formule input{position:absolute;opacity:0;pointer-events:none}
.formule span{display:grid;gap:4px;height:100%;border:1px solid var(--ligne);padding:14px;background:var(--blanc)}
.formule small{color:var(--gris);font-size:.88rem;line-height:1.45}
.formule b{font-weight:500;margin-top:4px}
.formule input:checked + span{border-color:var(--chocolat);box-shadow:inset 0 0 0 1px var(--chocolat)}
.formule input:focus-visible + span{outline:2px solid var(--chocolat);outline-offset:2px}
.nuancier{display:flex;gap:10px;flex-wrap:wrap}
.nuance{width:42px;height:42px;border-radius:50%;border:2px solid transparent;padding:3px;background:none}
.nuance span{display:block;width:100%;height:100%;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(46,28,18,.22)}
.nuance[aria-pressed="true"]{border-color:var(--chocolat)}
.editeur-carte{display:grid;gap:14px;margin-top:6px}
.champ-texte{display:grid;gap:6px;font-size:.92rem;font-weight:500}
.champ-texte textarea{font:inherit;font-weight:400;border:1px solid var(--ligne);padding:12px;background:var(--blanc);color:var(--chocolat);resize:vertical}
.champ-texte small{justify-self:end;color:var(--gris);font-weight:400}
.choix-ligne{display:grid;gap:8px;font-size:.92rem}
.choix-ligne > span{font-weight:500}
.choix-ligne small{color:var(--gris);font-weight:400}
.polices,.segments,.stickers{display:flex;flex-wrap:wrap;gap:8px}
.polices button,.segments button{border:1px solid var(--ligne);background:var(--blanc);padding:8px 14px;font-size:1rem;color:var(--chocolat)}
.polices button[style*="Great Vibes"]{font-size:1.35rem;padding:4px 14px}
.polices button[style*="Caveat"]{font-size:1.25rem;padding:5px 14px}
.polices button[aria-pressed="true"],.segments button[aria-pressed="true"]{border-color:var(--chocolat);background:var(--chocolat);color:var(--lait)}
.stickers button{width:44px;height:44px;border:1px solid var(--ligne);background:var(--blanc);font-size:1.3rem;line-height:1}
.stickers button[aria-pressed="true"]{border-color:var(--chocolat);box-shadow:inset 0 0 0 1px var(--chocolat);background:var(--sable)}
.cadeau-apercu{position:sticky;top:96px;align-self:start;display:grid;gap:18px;background:var(--sable);padding:clamp(18px,2.5vw,28px)}
@media (max-width:820px){.cadeau-apercu{position:static}}
.paquet{width:min(220px,60%);height:auto;justify-self:center;filter:drop-shadow(0 8px 14px rgba(46,28,18,.18))}
.carte-apercu{position:relative;aspect-ratio:3/2;background:#FFFDF8;box-shadow:0 10px 26px rgba(46,28,18,.16),inset 0 0 0 10px #FFFDF8,inset 0 0 0 11px #D9C49A;display:grid;place-items:center;padding:13% 12% 15%;overflow:hidden;container-type:inline-size}
.carte-texte{text-align:center;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.25;color:#2E1C12;font-size:calc(7.2cqw * var(--echelle,1))}
.carte-texte.vide{color:#B9A68A}
.sticker{position:absolute;font-size:9cqw;line-height:1}
.carte-signature{position:absolute;bottom:6%;left:0;right:0;text-align:center;font-family:var(--marque);letter-spacing:.16em;text-transform:uppercase;font-size:2.4cqw;color:#9C8467}
.cadeau-apercu .note{font-size:.86rem;color:var(--gris);margin:0}
.cadeau-pied{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px clamp(20px,3vw,32px);border-top:1px solid var(--ligne);position:sticky;bottom:0;background:var(--lait)}

/* Accueil : l'art d'offrir */
.offrir{background:var(--lait)}
.offrir-in{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(32px,6vw,96px);align-items:center}
.offrir-visuel{background:var(--sable);aspect-ratio:1;display:grid;place-items:center}
.offrir-visuel svg{width:62%;filter:drop-shadow(0 18px 26px rgba(46,28,18,.22))}
.offrir-texte{display:grid;gap:22px;justify-items:start}
@media (max-width:760px){.offrir-in{grid-template-columns:1fr}.offrir-visuel{aspect-ratio:4/3}}

/* Page Mon compte */
.tete-compte{padding-bottom:clamp(20px,3vw,36px)}
.section-compte{padding-top:0}
.compte-grille{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px);align-items:start}
@media (max-width:820px){.compte-grille{grid-template-columns:1fr}.compte-formulaires{order:-1}}
.avantages{list-style:none;display:grid;gap:14px;margin:22px 0}
.avantages li{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:start}
.avantages span{width:30px;height:30px;border-radius:50%;background:var(--sable);display:grid;place-items:center;font-size:.95rem}
.compte-formulaires{background:var(--blanc);border:1px solid var(--ligne);padding:clamp(22px,3vw,36px);display:grid;gap:22px}
.onglets-auth{display:grid;grid-template-columns:1fr 1fr;gap:0}
.onglets-auth button{border:1px solid var(--chocolat);padding:10px}
.formulaire .aide{font-size:.86rem;color:var(--gris);font-weight:400}
.formulaire .attention{color:#8A3B12}
.compte-favoris-locaux{padding:clamp(48px,6vw,80px) 0 0;display:grid;gap:14px}
.compte-favoris-locaux .grille{margin-top:16px}
.barre-compte{display:flex;justify-content:space-between;align-items:center;gap:16px;border-bottom:1px solid var(--ligne);margin-bottom:clamp(28px,4vw,44px)}
.onglets-compte{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.onglets-compte a{padding:12px 14px;text-decoration:none;border-bottom:2px solid transparent;white-space:nowrap;font-weight:500;color:var(--gris)}
.onglets-compte a[aria-current="page"]{color:var(--chocolat);border-color:var(--chocolat)}
.onglets-compte a span{background:var(--sable);border-radius:999px;padding:1px 8px;font-size:.8rem;margin-left:4px;color:var(--chocolat)}
@media (max-width:560px){.barre-compte{flex-direction:column;align-items:stretch;gap:6px}.barre-compte > .lien{align-self:flex-end;margin-bottom:8px}}
.compte-etroit{max-width:620px}
.bloc-anniv{display:grid;gap:10px;border-top:1px solid var(--ligne);padding-top:24px;margin-top:12px}
.bloc-anniv .etiquette{font-size:.92rem;font-weight:500}
.anniv-fixe{font-family:var(--display);font-size:1.5rem}
.supprimer-compte{border-top:1px solid var(--ligne);padding-top:20px;margin-top:20px}
.supprimer-compte .lien{color:#8A3B12;font-size:.9rem}
.liste-commandes{display:grid;gap:16px;max-width:760px}
.commande{border:1px solid var(--ligne);background:var(--blanc);padding:18px 20px;display:grid;gap:8px}
.commande header,.commande footer{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.commande ul{list-style:none;display:grid;gap:4px;font-size:.96rem}
.commande footer{border-top:1px solid var(--ligne);padding-top:10px;font-weight:500}
.statut{font-size:.82rem;font-weight:500;border-radius:999px;padding:4px 12px;background:var(--sable)}
.statut-confirmée{background:#E3ECF8}
.statut-livrée{background:#DCEFDF}
.statut-annulée{background:#F3DEDA}
.liste-alertes{list-style:none;display:grid;gap:10px;max-width:760px}
.liste-alertes li{display:grid;grid-template-columns:auto 1fr auto auto;gap:14px;align-items:center;border:1px solid var(--ligne);background:var(--blanc);padding:10px 14px}
.liste-alertes .mini{width:46px;height:58px;overflow:hidden;display:block}
.liste-alertes .mini img{width:100%;height:100%;object-fit:cover}
.liste-alertes small{display:block;color:var(--gris)}
@media (max-width:560px){.liste-alertes li{grid-template-columns:auto 1fr}.liste-alertes .statut{grid-column:2}}
.conf h2{margin:36px 0 10px}
/* Téléphone : aperçu compact qui reste visible pendant la saisie */
@media (max-width:820px){
  .cadeau-apercu{position:sticky;top:75px;z-index:2;grid-template-columns:84px 1fr;gap:12px;align-items:center;padding:10px 12px;margin:-20px -20px 0;box-shadow:0 6px 12px -8px rgba(46,28,18,.35)}
  .cadeau-apercu .paquet{width:100%}
  .cadeau-apercu .note{display:none}
  .cadeau-apercu #apercuCarte:empty{display:none}
  .cadeau-pied .btn{white-space:nowrap;padding:0 18px}
  .cadeau-pied{font-size:.95rem}
}
/* Accueil : photos de l'emballage cadeau */
.offrir-in{align-items:start}
.offrir-visuels{display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,1.4vw,18px);margin:0}
.offrir-visuels figure{margin:0}
.offrir-visuels img{width:100%;aspect-ratio:1;object-fit:cover;display:block}
.offrir-principal{grid-column:1/-1}
.offrir-principal img{aspect-ratio:4/3}
.offrir-visuels figcaption{font-size:.84rem;line-height:1.45;color:var(--gris);margin-top:8px}
.mention-visuels{grid-column:1/-1;font-size:.84rem;color:var(--gris);margin:0}
.offrir-texte{padding-top:clamp(0px,3vw,40px)}
.formule-photo{width:100%;aspect-ratio:16/10;object-fit:cover;margin-bottom:8px}
.formule span{align-content:start}
.non-inclus{font-size:.9rem;color:var(--gris);font-style:italic;margin-top:10px}
.specs .non-inclus{font-size:inherit;display:inline-block;margin-top:4px}

/* =========================================================
   APERÇU 3D DE L'EMBALLAGE ET CARTE RÉALISTE
   ========================================================= */
.scene3d{--grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .16 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
  position:relative;width:100%;aspect-ratio:300/250;perspective:900px;perspective-origin:50% 20%;cursor:grab;touch-action:pan-y;user-select:none;--s:1}
.scene3d.saisie{cursor:grabbing}
.boite3d{position:absolute;left:50%;top:58%;width:0;height:0;transform-style:preserve-3d;transform:scale(var(--s)) rotateX(-24deg) rotateY(var(--ry))}
.boite3d .f{position:absolute;left:0;top:0;backface-visibility:hidden;background-size:auto,auto,auto,140px 140px,auto}
.boite3d .f-haut,.boite3d .f-bas{background-size:auto,auto,auto,auto,auto,140px 140px,auto}
.ombre3d{position:absolute;left:0;top:0;background:radial-gradient(closest-side,rgba(46,28,18,.38),rgba(46,28,18,.12) 60%,transparent)}
.etiquette3d{position:absolute;left:0;top:0;width:58px;height:40px;margin:-20px 0 0 -29px;background:#FFFDF8;box-shadow:0 0 0 1px rgba(46,28,18,.12);
  background-image:linear-gradient(transparent 12px,rgba(46,28,18,.28) 12px,rgba(46,28,18,.28) 13.5px,transparent 13.5px,transparent 19px,rgba(46,28,18,.28) 19px,rgba(46,28,18,.28) 20.5px,transparent 20.5px);background-size:70% 100%;background-repeat:no-repeat;background-position:center}
.noeud3d{position:absolute;left:0;top:0;width:0;height:0;transform:translateY(var(--haut)) rotateY(calc(var(--ry) * -1)) rotateX(8deg);transform-style:flat}
.noeud3d span{position:absolute;display:block}
.noeud3d .boucle{width:58px;height:34px;top:-30px;border-radius:50% 50% 50% 50% / 58% 58% 42% 42%;
  background:radial-gradient(ellipse at 38% 32%,rgba(255,255,255,.6),rgba(255,255,255,0) 46%),radial-gradient(ellipse at 60% 80%,rgba(0,0,0,.28),rgba(0,0,0,0) 60%),var(--noeud);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.noeud3d .b-g{left:-60px;transform:rotate(-16deg)}
.noeud3d .b-d{left:2px;transform:rotate(16deg) scaleX(-1)}
.noeud3d .queue{width:16px;height:40px;top:-6px;background:linear-gradient(90deg,rgba(0,0,0,.18),rgba(255,255,255,.3) 45%,rgba(0,0,0,.1)),var(--noeud);clip-path:polygon(0 0,100% 0,100% 100%,50% 82%,0 100%)}
.noeud3d .q-g{left:-22px;transform:rotate(24deg);transform-origin:top center}
.noeud3d .q-d{left:6px;transform:rotate(-24deg);transform-origin:top center}
.noeud3d .centre{width:20px;height:20px;left:-10px;top:-24px;border-radius:40%;background:radial-gradient(circle at 40% 35%,rgba(255,255,255,.55),rgba(255,255,255,0) 55%),var(--noeud);box-shadow:0 2px 4px rgba(0,0,0,.25)}
.aide3d{position:absolute;bottom:2px;left:0;right:0;text-align:center;font-size:.8rem;color:var(--gris);pointer-events:none}
@media (prefers-reduced-motion:reduce){.scene3d{cursor:default}}

/* Carte : papier, dorure, inclinaison et verso */
.carte-scene{perspective:1100px}
.carte-3d{position:relative;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.3,.7,.2,1);transform:rotateX(var(--tx,0deg)) rotateY(var(--ty,0deg))}
.carte-3d.retournee{transform:rotateX(var(--tx,0deg)) rotateY(calc(180deg + var(--ty,0deg)))}
.carte-scene:hover .carte-3d:not(.retournee){transition:transform .15s ease-out}
.carte-apercu{backface-visibility:hidden;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .35 0 0 0 0 .2 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23p)'/%3E%3C/svg%3E"),linear-gradient(160deg,#FFFDF8,#F6EEDF);
  box-shadow:0 18px 30px -12px rgba(46,28,18,.35),0 4px 8px rgba(46,28,18,.12),inset 0 0 0 9px transparent}
.carte-apercu::before{content:"";position:absolute;inset:4.5%;border:1.5px solid transparent;border-image:linear-gradient(135deg,#B8872F,#F3D98B 30%,#B8872F 52%,#E8C46A 75%,#9C7024) 1;pointer-events:none}
.carte-recto .carte-texte{color:#4A2A18}
.carte-verso{position:absolute;inset:0;transform:rotateY(180deg);display:grid;place-items:center;align-content:center;gap:4cqw;color:#B8872F}
.rosace-dos{width:16cqw;height:16cqw;display:block}
.rosace-dos svg{width:100%;height:100%}
.mention-dos{font-size:2.6cqw;color:#9C8467;font-style:italic}
.carte-verso .carte-signature{position:static}
.reflet{position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent calc(var(--gx,50%) - 30%),rgba(255,255,255,.35) var(--gx,50%),transparent calc(var(--gx,50%) + 30%));mix-blend-mode:soft-light}
.sticker{filter:drop-shadow(0 1px 1px rgba(0,0,0,.18))}
.retourner{justify-self:center;font-size:.9rem}
.cadeau-apercu #apercuPaquet{width:100%}
@media (max-width:820px){
  .cadeau-apercu .aide3d,.cadeau-apercu .retourner{display:none}
  .cadeau-apercu .scene3d{aspect-ratio:1}
}
.btn-contour-clair{background:transparent;color:var(--lait);border-color:rgba(251,246,238,.7)}
.btn-contour-clair:hover{background:var(--lait);color:var(--chocolat)}
/* Photos dans les avis */
.photos-avis{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.photos-avis img{width:88px;height:88px;object-fit:cover;display:block}
.ajout-photos-avis{display:grid;gap:8px;justify-items:start}
.btn-photos{min-height:44px;padding:0 18px;cursor:pointer;font-size:.94rem}
.ajout-photos-avis small{color:var(--gris);font-size:.86rem}
.vignettes-avis{display:flex;gap:8px}
.vignettes-avis:empty{display:none}
.vign{position:relative;width:72px;height:72px}
.vign img{width:100%;height:100%;object-fit:cover}
.vign button{position:absolute;top:-8px;right:-8px;width:24px;height:24px;border-radius:50%;border:0;background:var(--chocolat);color:var(--lait);font-size:.9rem;line-height:1}

/* =========================================================
   MARIAGES & GROUPES
   ========================================================= */
.form-groupe{max-width:880px;display:grid;gap:clamp(28px,4vw,44px)}
.bloc-groupe{border:0;border-top:1px solid var(--chocolat);padding-top:22px;display:grid;gap:18px;min-width:0}
.bloc-groupe legend{font-family:var(--display);font-size:clamp(1.5rem,2.6vw,2rem);display:flex;align-items:center;gap:14px;padding-bottom:6px;float:left;width:100%}
.bloc-groupe legend + *{clear:both}
.bloc-groupe .num{width:38px;height:38px;border-radius:50%;background:var(--chocolat);color:var(--lait);display:grid;place-items:center;font-family:var(--texte);font-size:1rem;font-weight:500;flex:none}
.coords{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (max-width:620px){.coords{grid-template-columns:1fr}}
.personnes{display:grid;gap:8px}
.personne{display:grid;grid-template-columns:28px minmax(0,1.1fr) minmax(0,1fr) minmax(0,150px) 36px;gap:10px;align-items:center}
.personne input,.personne select{min-width:0}
.num-pers{font-size:.9rem;color:var(--gris);text-align:right}
.suppr-pers{width:36px;height:36px;border-radius:50%;border:1px solid var(--ligne);background:none;font-size:1.1rem;color:var(--gris)}
.suppr-pers:hover:not([disabled]){border-color:var(--chocolat);color:var(--chocolat)}
.suppr-pers[disabled]{opacity:.3;cursor:default}
@media (max-width:620px){
  .personne{grid-template-columns:22px minmax(0,1fr) 36px;row-gap:4px;padding-bottom:12px;border-bottom:1px solid var(--ligne)}
  .personne [name=p-role]{grid-column:2}
  .personne select{grid-column:2}
  .personne .suppr-pers{grid-column:3;grid-row:1}
}
.ajout-personnes{align-items:center}
.resume-groupe{background:var(--sable);padding:16px 18px;display:grid;gap:4px}
.resume-groupe p{margin:0}
.total-groupe{font-family:var(--display);font-size:1.5rem}
.envoi-groupe{display:grid;gap:12px;justify-items:start}
.envoi-groupe .aide{max-width:60ch}
.formule{position:relative}
.formule input{width:1px!important;height:1px;left:0;top:0}
.scene3d{margin-bottom:2.4rem}
.aide3d{bottom:-2.2rem!important;background:none}
/* Aperçu réaliste (WebGL) */
.scene-webgl{position:relative;width:100%;max-width:440px;aspect-ratio:1/1;margin:0 auto 2.4rem;cursor:grab;touch-action:pan-y;animation:fondu3d .6s ease both}
.scene-webgl.saisie{cursor:grabbing}
.scene-webgl canvas{display:block;width:100%!important;height:100%!important}
@keyframes fondu3d{from{opacity:0}to{opacity:1}}
.chargement3d{width:100%;max-width:440px;aspect-ratio:1/1;margin:0 auto 2.4rem;display:grid;place-items:center}
.chargement3d span{width:46%;aspect-ratio:1.3;border-radius:6px;background:linear-gradient(100deg,rgba(255,255,255,.0) 30%,rgba(255,255,255,.45) 50%,rgba(255,255,255,0) 70%) 0 0/250% 100%,rgba(46,28,18,.06);animation:reflet3d 1.4s linear infinite}
@keyframes reflet3d{to{background-position:-250% 0,0 0}}
@media (prefers-reduced-motion:reduce){.scene-webgl{animation:none}.chargement3d span{animation:none}}
.scene-webgl{aspect-ratio:5/4;max-width:480px;margin-bottom:2rem}
.scene-webgl .aide3d{bottom:-1.7rem!important}
@media (max-width:820px){
  .cadeau-apercu{grid-template-columns:44% 1fr}
  .scene-webgl{aspect-ratio:1/1;margin:0}
}
/* Stock par taille */
.tailles button.epuisee{opacity:.45;text-decoration:line-through;cursor:not-allowed;background:transparent}
.note-tailles{font-size:.88rem;color:var(--gris);margin:-4px 0 14px}
.ko-taille{color:#B42318!important}
/* Modèles en rupture : visibles en fin de boutique, sous un voile sombre */
.produit.epuise img{filter:none;opacity:1}
.voile-rupture{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:18px;text-align:center;color:#FBF6EE;background:linear-gradient(180deg,rgba(24,15,9,.5),rgba(24,15,9,.62));transition:background .4s ease;pointer-events:none}
.voile-rupture strong{font-family:var(--marque);font-weight:500;font-size:clamp(.82rem,1.25vw,1.02rem);letter-spacing:.24em;text-transform:uppercase;line-height:1.4}
.voile-rupture .trait{width:38%;max-width:96px;height:1px;background:rgba(251,246,238,.75)}
.voile-rupture em{font-family:var(--display);font-style:italic;font-size:.88rem;opacity:0;transform:translateY(6px);transition:opacity .35s ease,transform .35s ease}
.produit.epuise:hover .voile-rupture,.produit.epuise .ouvrir:focus-visible .voile-rupture{background:linear-gradient(180deg,rgba(24,15,9,.32),rgba(24,15,9,.5))}
.produit.epuise:hover .voile-rupture em,.produit.epuise .ouvrir:focus-visible .voile-rupture em{opacity:.95;transform:none}
@media (hover:none){.voile-rupture em{opacity:.9;transform:none}}
.produit.epuise .prix{color:var(--gris)}
.sep-rupture{grid-column:1/-1;display:grid;gap:4px;padding:28px 0 6px;margin-top:8px;border-top:1px solid var(--ligne)}
.sep-rupture span{font-family:var(--display);font-size:clamp(1.4rem,2.4vw,1.9rem)}
.sep-rupture small{color:var(--gris);font-size:.92rem}
/* =========================================================
   EN-TÊTE (nouvelle version) : logo au centre, pages en dessous
   ========================================================= */
.entete{height:var(--entete);display:flex;flex-direction:column}
.entete-haut{width:100%;height:70px;flex:none;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px}
.entete-gauche{display:flex;align-items:center;gap:8px;justify-self:start}
.reglages-entete{display:flex;align-items:center;gap:8px}
.entete-droite{justify-self:end;display:flex;align-items:center;gap:10px}
.marque-lien{flex-direction:row;align-items:center;gap:12px}
.marque-lien svg{width:32px;height:32px}
.marque-lien span{font-size:1rem;letter-spacing:.2em}
.nav-principale{width:100%;flex:1;border-top:1px solid color-mix(in srgb,currentColor 16%,transparent)}
.nav-principale .wrap{height:100%;display:flex;justify-content:center;align-items:stretch;gap:clamp(22px,3.4vw,52px)}
.nav-principale a{position:relative;display:flex;align-items:center;text-decoration:none;font-size:.78rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;padding:0 2px;opacity:.82;transition:opacity .2s}
.nav-principale a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:currentColor;transform:scaleX(0);transition:transform .3s cubic-bezier(.2,.7,.1,1)}
.nav-principale a:hover{opacity:1}
.nav-principale a:hover::after{transform:scaleX(.5)}
.nav-principale a[aria-current="page"]{opacity:1;font-weight:600}
.nav-principale a[aria-current="page"]::after{transform:scaleX(1)}
.btn-menu{display:none;align-items:center;gap:10px;font-weight:500;font-size:.95rem;color:inherit;padding:8px 2px}
.burger{display:grid;gap:5px;width:22px}
.burger i{display:block;height:1.5px;background:currentColor;border-radius:2px}
.burger i:nth-child(2){width:70%}
@media (max-width:1100px){
  :root{--entete:66px}
  .entete-haut{height:66px}
  .nav-principale,.reglages-entete{display:none}
  .btn-menu{display:flex}
  .marque-lien span{font-size:.86rem;letter-spacing:.16em}
  .marque-lien svg{width:28px;height:28px}
}
@media (max-width:640px){
  .marque-lien span{display:none}
  .btn-menu > span:last-child{font-size:.9rem}
  .entete-droite{gap:8px}
}
@media (max-width:640px) and (min-width:360px){
  .marque-lien span{display:inline;font-size:.66rem;letter-spacing:.12em;white-space:normal;text-align:center;max-width:130px;line-height:1.3}
  .marque-lien{gap:8px}
  .marque-lien svg{width:26px;height:26px;flex:none}
}
/* Menu plein écran (téléphone et tablette) */
.menu-mobile{background:var(--lait);color:var(--chocolat);padding:0 var(--gouttiere) 28px;justify-content:flex-start;gap:20px;overflow-y:auto}
.menu-tete{display:flex;justify-content:space-between;align-items:center;height:66px;flex:none;border-bottom:1px solid var(--ligne)}
.marque-menu{display:flex;align-items:center;gap:10px;font-family:var(--marque);font-weight:600;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase}
.marque-menu svg{width:26px;height:26px}
.menu-mobile .fermer-menu{position:static;display:flex;align-items:center;gap:8px;font-size:.95rem}
.menu-mobile .fermer-menu span{font-size:1.5rem;line-height:1}
.menu-mobile nav{gap:0}
.menu-mobile nav a{display:grid;grid-template-columns:34px 1fr;align-items:center;gap:12px;font-family:var(--texte);font-size:1rem;line-height:1.3;padding:15px 0;border-bottom:1px solid var(--ligne)}
.menu-mobile nav a strong{display:block;font-family:var(--display);font-weight:400;font-size:clamp(1.45rem,6vw,1.9rem);line-height:1.15}
.menu-mobile nav a small{display:block;color:var(--gris);font-size:.86rem;margin-top:3px}
.menu-mobile nav a .num{font-size:.75rem;letter-spacing:.1em;color:var(--gris);align-self:start;padding-top:9px}
.menu-mobile nav a[aria-current="page"] strong{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px}
.menu-mobile nav .lien-accueil{display:block;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:var(--gris);padding:12px 0}
.menu-mobile .pied-menu{align-items:center;margin-top:auto;padding-top:10px}
.menu-mobile .pied-menu .btn{flex:1 1 220px;justify-content:center}
@media (max-width:600px){.voile-rupture{gap:10px;padding:10px}.voile-rupture strong{font-size:.7rem;letter-spacing:.14em}}
/* Mariages & groupes : inspirations */
.grille-inspi{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,28px) clamp(12px,1.6vw,20px);align-items:start}
.inspi{margin:0;display:grid;gap:14px}
.inspi img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}
.inspi-large{grid-column:1/-1}
.inspi-large img{aspect-ratio:1565/1005}
.inspi figcaption{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 16px}
.inspi figcaption strong{font-family:var(--display);font-weight:400;font-size:1.35rem}
.inspi figcaption span{color:var(--gris);font-size:.92rem;grid-column:1}
.inspi figcaption .btn{grid-column:2;grid-row:1/3;white-space:nowrap}
@media (max-width:640px){.grille-inspi{grid-template-columns:1fr}.inspi figcaption{grid-template-columns:1fr}.inspi figcaption .btn{grid-column:1;grid-row:auto;justify-self:start;margin-top:8px}}
/* Atelier du groupe */
.atelier-groupe{display:grid;gap:0;border:1px solid var(--ligne);background:var(--lait)}
.scene-groupe{background:radial-gradient(120% 90% at 50% 100%,#E7DAC3 0%,#F3EBDD 55%,#F8F2E8 100%);padding:22px 12px 8px;overflow-x:auto;scrollbar-width:thin}
.rang{display:flex;justify-content:center;align-items:flex-end;min-width:min-content;margin:0 auto;gap:0}
.membre{position:relative;flex:none;width:clamp(48px,calc(min(780px, 100vw - 72px) / var(--n,4)),124px);background:none;border:0;padding:0 0 6px;margin:0 -4px;display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:transform .25s}
.membre .silhouette{width:100%;height:auto;transform:scale(var(--h,1));transform-origin:50% 100%;transition:filter .25s}
.membre:hover{transform:translateY(-3px)}
.membre.active .silhouette{filter:drop-shadow(0 0 0 transparent) drop-shadow(0 6px 10px rgba(46,28,18,.22))}
.etiquette-membre{display:grid;justify-items:center;line-height:1.2;margin-top:4px;max-width:100%;padding:3px 6px;border-bottom:2px solid transparent}
.etiquette-membre strong{font-size:.74rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.etiquette-membre small{font-size:.7rem;color:var(--gris)}
.membre.active .etiquette-membre{border-color:var(--chocolat)}
.membre.active .etiquette-membre strong{font-weight:600}
.reste{align-self:center;margin-left:14px;font-size:.85rem;color:var(--gris);white-space:nowrap}
.editeur-tenue{border-top:1px solid var(--ligne);padding:18px clamp(14px,2.4vw,24px) 20px;display:grid;gap:14px;background:#fff}
.titre-editeur{font-size:1rem;margin:0}
.titre-editeur strong{font-family:var(--display);font-weight:400;font-size:1.3rem}
.ligne-choix{display:grid;grid-template-columns:120px 1fr;gap:10px;align-items:start}
.ligne-choix > span{font-size:.9rem;font-weight:500;padding-top:6px}
.ligne-choix > span em{display:block;font-style:normal;color:var(--gris);font-weight:400;font-size:.85rem}
.nuancier-t{display:flex;flex-wrap:wrap;gap:8px}
.nuancier-t button{width:34px;height:34px;border-radius:50%;border:1px solid var(--ligne);padding:3px;background:#fff}
.nuancier-t button span{display:block;width:100%;height:100%;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.nuancier-t button[aria-pressed=true]{border:2px solid var(--chocolat);padding:2px}
.segments-t{display:flex;flex-wrap:wrap;gap:6px}
.segments-t button{border:1px solid var(--ligne);background:#fff;border-radius:999px;padding:7px 14px;font-size:.86rem;display:inline-flex;align-items:center;gap:6px;color:var(--chocolat)}
.segments-t button i{width:12px;height:12px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15)}
.segments-t button[aria-pressed=true]{background:var(--chocolat);color:var(--lait);border-color:var(--chocolat)}
.actions-editeur{display:flex;gap:20px;flex-wrap:wrap;font-size:.92rem}
@media (max-width:560px){.ligne-choix{grid-template-columns:1fr;gap:6px}.ligne-choix > span{padding-top:0}.ligne-choix > span em{display:inline;margin-left:6px}}
.pastille-pers{width:28px;height:28px;border-radius:50%;border:1px solid rgba(0,0,0,.12);background:var(--c,#EFE5CF);font-size:.75rem;font-weight:600;padding:0;cursor:pointer}
.pastille-pers.active{outline:2px solid var(--chocolat);outline-offset:2px}
@media (max-width:640px){.personne{grid-template-columns:28px minmax(0,1fr) 36px}}
/* Guide des mesures en 3D */
.guide-mesures{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(20px,3vw,44px);align-items:start}
.vue-mannequin{position:relative;aspect-ratio:4/5;background:radial-gradient(90% 70% at 50% 92%,#E4D5BC 0%,#EFE5D4 45%,#F6F0E6 100%);overflow:hidden;touch-action:pan-y;cursor:grab}
.vue-mannequin.saisie{cursor:grabbing}
.toile-mannequin{position:absolute;inset:0;width:100%!important;height:100%!important;display:block;animation:fondu3d .8s ease both}
.attente-mannequin{position:absolute;inset:0;display:grid;place-items:center}
.attente-mannequin span{width:22%;aspect-ratio:1/3.6;border-radius:40% 40% 18% 18%;background:linear-gradient(100deg,rgba(255,255,255,0) 30%,rgba(255,255,255,.5) 50%,rgba(255,255,255,0) 70%) 0 0/250% 100%,rgba(46,28,18,.07);animation:reflet3d 1.4s linear infinite}
.vue-mannequin.pret .attente-mannequin,.vue-mannequin.sans-3d .attente-mannequin{display:none}
.vue-mannequin.sans-3d{aspect-ratio:auto;min-height:0;background:none}
.vue-mannequin.sans-3d .controle-guide,.vue-mannequin.sans-3d .aide-mannequin,.vue-mannequin.sans-3d .etiquette-3d{display:none}
.etiquette-3d{position:absolute;left:0;top:0;z-index:2;pointer-events:none;background:var(--chocolat);color:var(--lait);font-size:.8rem;font-weight:500;padding:6px 12px;border-radius:999px;white-space:nowrap;opacity:0;transition:opacity .3s;margin:-14px 0 0 12px;box-shadow:0 6px 16px -6px rgba(46,28,18,.4)}
.etiquette-3d:empty{display:none}
.controle-guide{position:absolute;left:14px;right:14px;bottom:14px;z-index:2;display:flex;align-items:center;gap:12px;background:rgba(251,246,238,.88);backdrop-filter:blur(8px);border-radius:999px;padding:6px 14px 6px 6px;box-shadow:0 8px 24px -12px rgba(46,28,18,.35)}
.lecture{display:flex;align-items:center;gap:10px;border:0;background:var(--chocolat);color:var(--lait);border-radius:999px;padding:8px 16px 8px 10px;font-size:.88rem;font-weight:500;white-space:nowrap;flex:none}
.lecture .ico{width:22px;height:22px;border-radius:50%;background:var(--lait);position:relative;flex:none}
.lecture .ico::before{content:"";position:absolute;left:8px;top:6px;border-left:8px solid var(--chocolat);border-top:5px solid transparent;border-bottom:5px solid transparent}
.lecture.en-cours .ico::before{left:7px;top:6px;width:8px;height:10px;border:0;background:linear-gradient(90deg,var(--chocolat) 0 3px,transparent 3px 5px,var(--chocolat) 5px)}
.barre-guide{flex:1;height:3px;background:rgba(46,28,18,.12);border-radius:3px;overflow:hidden;min-width:30px}
.barre-guide i{display:block;height:100%;width:0;background:var(--safran);transition:width .15s linear}
.compteur-guide{font-size:.8rem;color:var(--gris);font-variant-numeric:tabular-nums;white-space:nowrap}
.aide-mannequin{position:absolute;top:14px;left:0;right:0;text-align:center;font-size:.78rem;color:var(--gris);pointer-events:none}
.panneau-mesures{display:grid;gap:22px}
.liste-mesures{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.liste-mesures button{display:flex;align-items:center;gap:12px;text-align:left;background:none;border:1px solid var(--ligne);padding:11px 14px;font-size:.95rem;color:var(--chocolat);transition:background .2s,border-color .2s}
.liste-mesures button .n{font-size:.72rem;letter-spacing:.08em;color:var(--gris);font-variant-numeric:tabular-nums}
.liste-mesures button:hover{border-color:var(--chocolat)}
.liste-mesures button[aria-selected=true]{background:var(--chocolat);border-color:var(--chocolat);color:var(--lait)}
.liste-mesures button[aria-selected=true] .n{color:var(--safran)}
.detail-mesure{background:var(--sable);padding:22px 24px}
.detail-mesure h3{font-size:clamp(1.5rem,2.4vw,1.9rem);margin-bottom:12px}
.detail-mesure ol{margin:0 0 14px 1.2em;display:grid;gap:6px}
.detail-mesure .astuce{margin:0;font-size:.95rem;border-top:1px solid rgba(46,28,18,.15);padding-top:12px}
.detail-mesure .astuce strong{font-weight:600;margin-right:4px}
@media (max-width:900px){
  .guide-mesures{grid-template-columns:1fr}
  .vue-mannequin{aspect-ratio:4/4.4;max-height:72svh}
  .liste-mesures{display:flex;overflow-x:auto;gap:6px;scrollbar-width:none;margin:0 calc(-1 * var(--gouttiere));padding:0 var(--gouttiere)}
  .liste-mesures::-webkit-scrollbar{display:none}
  .liste-mesures button{flex:none;padding:9px 14px;border-radius:999px;font-size:.9rem}
  .liste-mesures button .n{display:none}
}
@media (max-width:420px){.lecture .txt{font-size:.82rem}.compteur-guide{display:none}}
@media (prefers-reduced-motion:reduce){.attente-mannequin span{animation:none}}
.note-illustration{margin-top:18px;font-size:.85rem;font-style:italic;color:var(--gris);max-width:760px}
