/* Boutique V2 — direction premium, calme et centrée sur les produits */
:root {
  --encre: #2b252a;
  --encre-forte: #211b20;
  --encre-doux: #766d73;
  --terre: #7a4e6a;
  --terre-foncee: #5f394f;
  --sauge: #c6a15b;
  --sauge-claire: #f3e8ee;
  --ivoire: #fcfaf8;
  --ivoire-2: #f1ece8;
  --blanc: #ffffff;
  --trait: #e6dfe2;
  --succes: #3f7658;
  --alerte: #b3782d;
  --danger: #a3474d;
  --ombre: 0 18px 55px rgba(30, 39, 34, .10);
  --ombre-douce: 0 8px 28px rgba(30, 39, 34, .08);
  --rayon: 18px;
  --rayon-petit: 10px;
  --display: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  --texte: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --marge-section: clamp(4rem, 8vw, 7rem);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  color: var(--encre);
  background: var(--blanc);
  font-family: var(--texte);
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
main { flex: 1; }
img { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; }
a { color: var(--terre-foncee); text-underline-offset: 3px; }
a:hover { color: var(--terre); }
:focus-visible { outline: 3px solid rgba(169, 86, 63, .38); outline-offset: 3px; }

h1, h2, h3 {
  margin: 0 0 .5em;
  font-family: var(--display);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -.035em;
  color: var(--encre-forte);
}
h1 { font-size: clamp(2.7rem, 6.2vw, 5.5rem); }
h2 { font-size: clamp(2.1rem, 4.1vw, 3.6rem); }
h3 { font-size: 1.5rem; }
p { margin: 0 0 1em; }

.conteneur { width: min(1240px, calc(100% - 40px)); margin-inline: auto; }
.conteneur-etroit { width: min(790px, calc(100% - 40px)); margin-inline: auto; }
.mono { font-family: var(--mono); font-size: .82em; }
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.saut-contenu {
  position: fixed;
  left: 1rem;
  top: -100px;
  z-index: 200;
  background: var(--encre-forte);
  color: #fff;
  padding: .7rem 1rem;
  border-radius: 8px;
}
.saut-contenu:focus { top: 1rem; }

/* En-tête */
.bandeau-annonce { background: var(--encre-forte); color: #f6f2ec; font-size: .8rem; }
.bandeau-annonce-interieur {
  min-height: 38px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1.4rem;
  text-align: center;
  letter-spacing: .025em;
}
.bandeau-annonce a { color: #fff; font-weight: 650; }

.entete {
  position: sticky;
  top: 0;
  z-index: 80;
  border-bottom: 1px solid rgba(221, 216, 208, .88);
  background: rgba(255, 255, 255, .94);
  backdrop-filter: blur(16px);
  transition: box-shadow .2s ease, background .2s ease;
}
.entete.entete-ombre { box-shadow: 0 9px 30px rgba(25, 32, 28, .08); }
.entete-grille {
  min-height: 82px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: clamp(1.2rem, 3vw, 2.6rem);
}
.logo {
  min-width: 205px;
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  color: var(--encre-forte);
  text-decoration: none;
}
.logo-embleme {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  flex: none;
  border-radius: 50%;
  background: var(--encre-forte);
  color: #fff;
  font-family: var(--display);
  font-size: 1.3rem;
}
.logo-texte { display: block; min-width: 0; }
.logo-nom {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--display);
  font-size: 1.45rem;
  line-height: 1;
  letter-spacing: -.02em;
}
.logo-baseline {
  display: block;
  max-width: 210px;
  margin-top: .28rem;
  overflow: hidden;
  color: var(--encre-doux);
  font-size: .64rem;
  line-height: 1.2;
  letter-spacing: .07em;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}
.nav { display: flex; align-items: center; justify-content: center; gap: 1.45rem; }
.nav > a, .nav summary {
  position: relative;
  color: var(--encre);
  font-size: .91rem;
  font-weight: 580;
  text-decoration: none;
  cursor: pointer;
  list-style: none;
  white-space: nowrap;
}
.nav > a::after, .nav summary::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: -8px;
  height: 2px;
  background: var(--terre);
  transition: right .2s ease;
}
.nav > a:hover::after, .nav > a[aria-current="page"]::after, .nav summary:hover::after { right: 0; }
.nav > a[aria-current="page"] { color: var(--terre-foncee); }
.nav summary::-webkit-details-marker { display: none; }
.nav summary::before { content: ""; }
.nav-deroulant { position: relative; }
.nav-deroulant summary { display: flex; align-items: center; gap: .38rem; }
.nav-deroulant summary::before {
  content: "";
  width: 6px;
  height: 6px;
  order: 2;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
}
.nav-sous-menu {
  position: absolute;
  left: 50%;
  top: calc(100% + 19px);
  width: 230px;
  padding: .55rem;
  border: 1px solid var(--trait);
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--ombre-douce);
  transform: translateX(-50%);
}
.nav-sous-menu a {
  display: block;
  padding: .65rem .75rem;
  border-radius: 8px;
  color: var(--encre);
  font-size: .9rem;
  text-decoration: none;
}
.nav-sous-menu a:hover { background: var(--ivoire); color: var(--terre-foncee); }

.entete-actions { display: flex; align-items: center; gap: .65rem; }
.recherche-entete {
  width: 154px;
  height: 42px;
  display: flex;
  align-items: center;
  gap: .4rem;
  padding: 0 .72rem;
  border: 1px solid var(--trait);
  border-radius: 999px;
  background: var(--ivoire);
  transition: width .2s ease, border-color .2s ease, background .2s ease;
}
.recherche-entete:focus-within { width: 215px; border-color: var(--sauge); background: #fff; }
.recherche-entete svg, .recherche-catalogue svg {
  width: 18px;
  height: 18px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
}
.recherche-entete input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--encre);
  font-size: .86rem;
}
.recherche-entete input::placeholder { color: #8d958f; }
.lien-panier {
  height: 42px;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: 0 .82rem;
  border-radius: 999px;
  background: var(--encre-forte);
  color: #fff;
  font-size: .87rem;
  font-weight: 650;
  text-decoration: none;
}
.lien-panier:hover { background: var(--terre-foncee); color: #fff; }
.lien-panier svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.pastille {
  min-width: 22px;
  height: 22px;
  display: inline-grid;
  place-items: center;
  padding: 0 .3rem;
  border-radius: 99px;
  background: #fff;
  color: var(--encre-forte);
  font-size: .7rem;
  font-weight: 750;
}
.pastille-vide { background: rgba(255, 255, 255, .18); color: #fff; }
.burger, .recherche-mobile { display: none; }

/* Composants */
.eyebrow {
  display: flex;
  align-items: center;
  gap: .7rem;
  margin: 0 0 1rem;
  color: var(--terre-foncee);
  font-size: .72rem;
  font-weight: 720;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.eyebrow::before { content: ""; width: 28px; height: 1px; background: currentColor; }
.btn {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  padding: .72rem 1.35rem;
  border: 1px solid var(--encre-forte);
  border-radius: 999px;
  background: var(--encre-forte);
  color: #fff;
  font-size: .91rem;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.btn:hover { transform: translateY(-2px); background: var(--terre-foncee); border-color: var(--terre-foncee); color: #fff; box-shadow: 0 10px 24px rgba(134, 65, 47, .18); }
.btn-clair { background: transparent; color: var(--encre-forte); border-color: var(--trait); }
.btn-clair:hover { background: var(--ivoire); color: var(--encre-forte); border-color: var(--encre-forte); box-shadow: none; }
.btn-large { width: 100%; }
.btn-petit { min-height: 38px; padding: .45rem .9rem; font-size: .82rem; }
.btn[disabled] { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.lien-discret, .lien-fleche {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  border: 0;
  background: transparent;
  color: var(--encre-forte);
  font-size: .86rem;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}
.lien-discret:hover, .lien-fleche:hover { color: var(--terre-foncee); }
.lien-fleche span, .collection-lien i { font-style: normal; transition: transform .18s ease; }
.lien-fleche:hover span, .collection:hover .collection-lien i { transform: translateX(4px); }
.alerte {
  margin: 1.2rem 0;
  padding: .9rem 1.1rem;
  border: 1px solid #bfd3c7;
  border-radius: 11px;
  background: #edf5ef;
  color: #315a44;
  font-size: .92rem;
}
.alerte-erreur { border-color: #e1c0ba; background: #fbefed; color: #7d352b; }
.alerte-info { border-color: #e3d0a9; background: #fbf6e9; color: #78591f; }
.bande { height: 1px; margin: 0; border: 0; background: var(--trait); }
.vide {
  padding: 3.5rem 1.4rem;
  border: 1px dashed #cfc9c0;
  border-radius: var(--rayon);
  background: var(--ivoire);
  color: var(--encre-doux);
  text-align: center;
}

/* Formulaires */
.champ { margin-bottom: 1.1rem; }
.champ label {
  display: block;
  margin-bottom: .4rem;
  color: var(--encre);
  font-size: .78rem;
  font-weight: 700;
}
.champ input, .champ select, .champ textarea {
  width: 100%;
  min-height: 48px;
  padding: .7rem .82rem;
  border: 1px solid var(--trait);
  border-radius: 10px;
  background: #fff;
  color: var(--encre);
  transition: border-color .18s ease, box-shadow .18s ease;
}
.champ textarea { min-height: 145px; resize: vertical; }
.champ input:focus, .champ select:focus, .champ textarea:focus {
  outline: 0;
  border-color: var(--sauge);
  box-shadow: 0 0 0 4px rgba(111, 130, 117, .12);
}
.champ-aide { margin: .38rem 0 0; color: var(--encre-doux); font-size: .8rem; }
.grille-champs { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.1rem; }

/* Accueil */
.hero {
  position: relative;
  overflow: hidden;
  padding: clamp(3.5rem, 7vw, 6.7rem) 0;
  background:
    radial-gradient(circle at 13% 18%, rgba(111, 130, 117, .13), transparent 33%),
    linear-gradient(135deg, #f8f5f0 0%, #f2ede6 100%);
}
.hero::after {
  content: "";
  position: absolute;
  right: -9vw;
  bottom: -20vw;
  width: 42vw;
  height: 42vw;
  border: 1px solid rgba(111, 130, 117, .18);
  border-radius: 50%;
}
.hero-grille { position: relative; z-index: 1; display: grid; grid-template-columns: .92fr 1.08fr; gap: clamp(2.5rem, 7vw, 6.5rem); align-items: center; }
.hero-copy { max-width: 620px; }
.hero-titre { margin-bottom: 1.25rem; font-size: clamp(3rem, 6vw, 5.7rem); }
.hero-texte { max-width: 54ch; color: var(--encre-doux); font-size: 1.08rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.hero-garanties { display: flex; flex-wrap: wrap; gap: 1.25rem; margin-top: 1.45rem; color: var(--encre-doux); font-size: .81rem; }
.hero-garanties span { display: inline-flex; align-items: center; gap: .4rem; }
.hero-garanties i { width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: var(--sauge-claire); color: var(--succes); font-style: normal; font-size: .7rem; font-weight: 800; }
.hero-media { position: relative; padding: 0 0 2.1rem 2.1rem; }
.hero-visuel { margin: 0; overflow: hidden; border-radius: 28px 28px 90px 28px; background: #ddd; box-shadow: var(--ombre); }
.hero-visuel img { width: 100%; aspect-ratio: 4 / 4.7; object-fit: cover; transition: transform .7s ease; }
.hero-media:hover .hero-visuel img { transform: scale(1.025); }
.hero-produit {
  position: absolute;
  left: 0;
  bottom: 0;
  width: min(310px, 72%);
  display: flex;
  flex-direction: column;
  gap: .2rem;
  padding: 1.05rem 1.15rem;
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 14px;
  background: rgba(255,255,255,.94);
  color: var(--encre);
  text-decoration: none;
  box-shadow: var(--ombre-douce);
  backdrop-filter: blur(12px);
}
.hero-produit-kicker { color: var(--terre-foncee); font-size: .66rem; font-weight: 740; letter-spacing: .1em; text-transform: uppercase; }
.hero-produit strong { font-family: var(--display); font-size: 1.2rem; line-height: 1.15; }
.hero-produit > span:last-child { color: var(--encre-doux); font-size: .76rem; }

.bande-reperes { padding: 1.45rem 0; border-top: 1px solid var(--trait); border-bottom: 1px solid var(--trait); background: #fff; }
.bande-reperes-grille { display: grid; grid-template-columns: repeat(3, 1fr); }
.repere { display: flex; gap: .95rem; padding: .85rem 1.7rem; border-right: 1px solid var(--trait); }
.repere:first-child { padding-left: 0; }
.repere:last-child { padding-right: 0; border-right: 0; }
.repere-numero { padding-top: .18rem; color: var(--terre); font-family: var(--mono); font-size: .7rem; }
.repere-cle { margin: 0 0 .15rem; color: var(--encre-forte); font-size: .92rem; font-weight: 750; }
.repere-texte { margin: 0; color: var(--encre-doux); font-size: .8rem; line-height: 1.5; }

.section { padding: var(--marge-section) 0; }
.section-entete { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; margin-bottom: 2.5rem; }
.section-entete h2 { margin-bottom: 0; }
.section-intro { max-width: 55ch; margin: .8rem 0 0; color: var(--encre-doux); }
.section-produits { background: #fff; }
.section-collections { background: var(--ivoire); }
.grille-collections { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.collection { overflow: hidden; border: 1px solid var(--trait); border-radius: var(--rayon); background: #fff; color: var(--encre); text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }
.collection:hover { transform: translateY(-5px); color: var(--encre); box-shadow: var(--ombre-douce); }
.collection-visuel { overflow: hidden; background: var(--ivoire-2); }
.collection-visuel img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .5s ease; }
.collection:hover .collection-visuel img { transform: scale(1.04); }
.collection-corps { display: flex; flex-direction: column; gap: .35rem; padding: 1.25rem; }
.collection-titre { font-family: var(--display); font-size: 1.55rem; color: var(--encre-forte); }
.collection-texte { min-height: 2.7em; color: var(--encre-doux); font-size: .82rem; line-height: 1.5; }
.collection-lien { display: flex; justify-content: space-between; align-items: center; margin-top: .7rem; color: var(--terre-foncee); font-size: .8rem; font-weight: 700; }
.section-histoire { background: var(--encre-forte); color: #e7ece8; }
.histoire-grille { display: grid; grid-template-columns: auto 1fr 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.histoire-grille h2 { color: #fff; }
.histoire-grille p { color: #bfc9c3; }
.histoire-grille .eyebrow { color: #d99a87; }
.histoire-grille .lien-fleche { color: #fff; }
.histoire-citation { margin-top: -.35rem; color: var(--terre); font-family: var(--display); font-size: 5rem; line-height: 1; }

/* Tuiles produits */
.grille-produits { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem 1.25rem; }
.tuile { min-width: 0; display: flex; flex-direction: column; }
.tuile-visuel { position: relative; overflow: hidden; border-radius: 16px; background: var(--ivoire-2); }
.tuile-visuel a { display: grid; place-items: center; aspect-ratio: 4 / 5; }
.tuile-visuel img { width: 100%; height: 100%; aspect-ratio: auto; padding: .65rem; object-fit: contain; object-position: center; transition: opacity .25s ease; }
.tuile:hover .tuile-visuel img { opacity: .94; }
.tuile-marque { position: absolute; top: .75rem; left: .75rem; padding: .32rem .58rem; border-radius: 999px; background: rgba(255,255,255,.93); color: var(--encre-forte); font-size: .63rem; font-weight: 760; letter-spacing: .05em; text-transform: uppercase; box-shadow: 0 3px 14px rgba(30,39,34,.08); }
.tuile-marque-promo { background: var(--terre-foncee); color: #fff; }
.tuile-marque-unique { background: var(--sauge); color: #fff; }
.tuile-marque-epuise { background: var(--encre-forte); color: #fff; }
.tuile-corps { flex: 1; display: flex; flex-direction: column; padding: .95rem .15rem 0; }
.tuile-ref { margin: 0 0 .3rem; color: var(--encre-doux); font-size: .66rem; font-weight: 650; letter-spacing: .075em; text-transform: uppercase; }
.tuile-nom { margin: 0 0 .32rem; font-family: var(--display); font-size: 1.35rem; line-height: 1.18; }
.tuile-nom a { color: var(--encre-forte); text-decoration: none; }
.tuile-detail { margin: 0 0 .8rem; color: var(--encre-doux); font-size: .82rem; line-height: 1.5; }
.tuile-pied { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: .7rem; padding-top: .5rem; }
.tuile-prix { color: var(--encre-forte); font-size: .94rem; font-weight: 750; }
.prix-barre { margin-right: .3rem; color: #8a918c; font-size: .8em; font-weight: 450; text-decoration: line-through; }
.tuile-pied .lien-discret { color: var(--terre-foncee); font-size: .76rem; }

/* Catalogue */
.entete-page { padding: clamp(2.8rem, 6vw, 5.2rem) 0 2rem; }
.entete-page h1 { font-size: clamp(2.8rem, 5vw, 4.7rem); }
.entete-page > p:last-child { max-width: 66ch; color: var(--encre-doux); }
.barre-filtres { margin-bottom: 2.1rem; padding: 1rem; border: 1px solid var(--trait); border-radius: 15px; background: var(--ivoire); }
.recherche-catalogue { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .7rem; min-height: 50px; padding: 0 .45rem 0 .85rem; border: 1px solid var(--trait); border-radius: 11px; background: #fff; }
.recherche-catalogue input { min-width: 0; border: 0; outline: 0; background: transparent; color: var(--encre); }
.recherche-catalogue button { min-height: 38px; padding: .45rem .85rem; border: 0; border-radius: 8px; background: var(--encre-forte); color: #fff; font-size: .79rem; font-weight: 700; cursor: pointer; }
.filtres-ligne { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: .8rem; }
.filtres-cat { display: flex; flex-wrap: wrap; gap: .42rem; }
.puce { display: inline-flex; align-items: center; min-height: 36px; padding: .4rem .82rem; border: 1px solid var(--trait); border-radius: 999px; background: #fff; color: var(--encre); font-size: .78rem; font-weight: 650; text-decoration: none; }
.puce:hover { border-color: var(--sauge); color: var(--encre-forte); }
.puce-active { border-color: var(--encre-forte); background: var(--encre-forte); color: #fff; }
.puce-active:hover { color: #fff; }
.tri select { min-height: 38px; padding: .4rem .7rem; border: 1px solid var(--trait); border-radius: 9px; background: #fff; color: var(--encre); font-size: .78rem; }
.resultat-recherche { margin: -1rem 0 1.8rem; color: var(--encre-doux); font-size: .86rem; }
.pagination { display: flex; justify-content: center; gap: .45rem; margin: 3rem 0; }
.pagination a, .pagination span { min-width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--trait); border-radius: 9px; color: var(--encre); font-size: .82rem; text-decoration: none; }
.pagination .actuelle { border-color: var(--encre-forte); background: var(--encre-forte); color: #fff; }

/* Fiche produit */
.fil-ariane { padding: 1.4rem 0 0; color: var(--encre-doux); font-size: .74rem; }
.fil-ariane a { color: var(--encre-doux); }
.produit-grille { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(2.5rem, 6vw, 5.5rem); align-items: start; padding: 2rem 0 var(--marge-section); }
.galerie-principale { display: grid; place-items: center; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 20px; background: var(--ivoire-2); }
.galerie-principale img { width: 100%; height: 100%; aspect-ratio: auto; padding: clamp(.7rem, 2vw, 1.35rem); object-fit: contain; object-position: center; }
.galerie-vignettes { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: .6rem; margin-top: .7rem; }
.galerie-vignettes button { display: grid; place-items: center; aspect-ratio: 1; overflow: hidden; padding: .25rem; border: 2px solid transparent; border-radius: 10px; background: var(--ivoire-2); cursor: pointer; }
.galerie-vignettes button img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: contain; object-position: center; }
.galerie-vignettes button[aria-pressed="true"] { border-color: var(--terre); }
.produit-grille > div:last-child { position: sticky; top: 112px; }
.produit-ref { margin: 0 0 .65rem; color: var(--encre-doux); font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.produit-grille h1 { font-size: clamp(2.6rem, 4.3vw, 4.1rem); }
.produit-prix { margin: .35rem 0 1rem; color: var(--encre-forte); font-size: 1.5rem; font-weight: 780; }
.produit-resume { color: var(--encre-doux); font-size: 1.02rem; }
.produit-achat { margin: 1.65rem 0; padding: 1.2rem; border: 1px solid var(--trait); border-radius: 14px; background: var(--ivoire); }
.ligne-achat { display: flex; align-items: flex-end; gap: .7rem; }
.ligne-achat .champ { margin: 0; }
.champ-qte { width: 92px; flex: none; }
.ligne-achat .btn { flex: 1; }
.stock-info { display: flex; align-items: center; gap: .45rem; margin: .8rem 0 0; font-size: .79rem; font-weight: 650; }
.stock-info::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.stock-ok { color: var(--succes); }
.stock-bas { color: var(--alerte); }
.stock-zero { color: var(--danger); }
.produit-garanties { display: grid; gap: .55rem; margin: 1rem 0 0; padding-top: 1rem; border-top: 1px solid var(--trait); color: var(--encre-doux); font-size: .78rem; }
.produit-garanties span { display: flex; gap: .55rem; }
.produit-description { margin-top: 1.5rem; }
.fiche-technique { width: 100%; margin-top: 1.35rem; border-collapse: collapse; }
.fiche-technique th, .fiche-technique td { padding: .72rem 0; border-bottom: 1px solid var(--trait); text-align: left; vertical-align: top; font-size: .85rem; }
.fiche-technique th { width: 35%; color: var(--encre-doux); font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }

/* Panier / commande */
.page-simple { padding: clamp(2.5rem, 5vw, 4.5rem) 0 var(--marge-section); }
.page-simple > h1 { font-size: clamp(2.8rem, 5vw, 4.6rem); }
.progression-commande { display: flex; align-items: center; gap: .6rem; margin: 1.3rem 0 2.2rem; color: var(--encre-doux); font-size: .76rem; }
.progression-commande span { display: inline-flex; align-items: center; gap: .4rem; }
.progression-commande i { width: 24px; height: 24px; display: grid; place-items: center; border: 1px solid var(--trait); border-radius: 50%; background: #fff; font-style: normal; font-size: .7rem; }
.progression-commande .actif { color: var(--encre-forte); font-weight: 700; }
.progression-commande .actif i { border-color: var(--encre-forte); background: var(--encre-forte); color: #fff; }
.progression-commande b { width: 38px; height: 1px; background: var(--trait); }
.panier-grille { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(290px, .7fr); gap: 2.4rem; align-items: start; }
.table-panier { width: 100%; border-collapse: collapse; }
.table-panier th { padding: 0 0 .8rem; border-bottom: 1px solid var(--trait); color: var(--encre-doux); font-size: .69rem; font-weight: 700; letter-spacing: .06em; text-align: left; text-transform: uppercase; }
.table-panier td { padding: 1rem .4rem 1rem 0; border-bottom: 1px solid var(--trait); vertical-align: middle; }
.table-panier .col-droite { text-align: right; }
.cellule-produit { display: flex; align-items: center; gap: .9rem; }
.cellule-produit img { width: 72px; height: 90px; flex: none; padding: .2rem; border-radius: 9px; background: var(--ivoire-2); object-fit: contain; object-position: center; }
.cellule-produit strong { display: block; font-family: var(--display); font-size: 1.08rem; line-height: 1.2; }
.cellule-produit strong a { color: var(--encre-forte); text-decoration: none; }
.cellule-produit span { display: block; color: var(--encre-doux); font-size: .72rem; }
.input-qte { width: 65px; min-height: 42px; padding: .35rem; border: 1px solid var(--trait); border-radius: 8px; background: #fff; text-align: center; }
.recap { position: sticky; top: 112px; padding: 1.45rem; border: 1px solid var(--trait); border-radius: 15px; background: var(--ivoire); }
.recap h2 { margin-bottom: 1rem; font-size: 1.65rem; }
.recap-ligne { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem 0; color: var(--encre-doux); font-size: .82rem; }
.recap-total { margin-top: .5rem; padding-top: .9rem; border-top: 1px solid var(--trait); color: var(--encre-forte); font-size: .93rem; font-weight: 760; }
.option-liste { display: grid; gap: .65rem; margin: 0 0 1.5rem; }
.option { display: flex; align-items: flex-start; gap: .8rem; padding: .9rem 1rem; border: 1px solid var(--trait); border-radius: 11px; background: #fff; cursor: pointer; transition: border-color .16s ease, background .16s ease; }
.option:hover { border-color: var(--sauge); }
.option:has(input:checked) { border-color: var(--encre-forte); background: #f7f9f7; box-shadow: 0 0 0 1px var(--encre-forte); }
.option input { margin-top: .25rem; accent-color: var(--encre-forte); }
.option strong { font-size: .9rem; }
.option small { display: block; margin-top: .15rem; color: var(--encre-doux); font-size: .76rem; }
.option-tarif { margin-left: auto; color: var(--encre-forte); font-size: .82rem; font-weight: 760; white-space: nowrap; }
.bloc-etape { margin-bottom: 2rem; padding: 1.35rem; border: 1px solid var(--trait); border-radius: 14px; background: #fff; }
.bloc-etape h2 { margin-bottom: 1.15rem; font-size: 1.65rem; }
.confirmation-encart { margin: 1.8rem 0; padding: 1.5rem; border: 1px solid #bfd3c7; border-radius: 14px; background: #eef5f0; }
.confirmation-ref { color: var(--succes); font-size: 1.18rem; font-weight: 780; }

/* Contenu */
.contenu-riche { color: var(--encre); }
.contenu-riche h2 { margin-top: 2.2rem; font-size: 2rem; }
.contenu-riche ul, .contenu-riche ol { padding-left: 1.25rem; }
.contenu-riche li { margin-bottom: .35rem; }
.contenu-riche li::marker { color: var(--terre); }

/* Pied */
.avant-pied { border-top: 1px solid var(--trait); background: var(--ivoire); }
.avant-pied-grille { display: grid; grid-template-columns: repeat(3, 1fr); }
.avant-pied-grille > div { display: grid; grid-template-columns: auto 1fr; gap: .05rem .8rem; padding: 1.5rem 1.8rem; border-right: 1px solid var(--trait); }
.avant-pied-grille > div:first-child { padding-left: 0; }
.avant-pied-grille > div:last-child { padding-right: 0; border: 0; }
.avant-pied-icone { grid-row: 1 / 3; color: var(--terre); font-size: 1.25rem; }
.avant-pied-grille strong { color: var(--encre-forte); font-size: .83rem; }
.avant-pied-grille span:last-child { color: var(--encre-doux); font-size: .73rem; }
.pied { background: var(--encre-forte); color: #c8d0cb; }
.pied-grille { display: grid; grid-template-columns: 1.45fr 1fr 1fr 1fr; gap: 2.5rem; padding: 4rem 0 3rem; }
.pied-logo { margin: 0 0 .8rem; color: #fff; font-family: var(--display); font-size: 2rem; }
.pied-texte { max-width: 32ch; margin: 0 0 .35rem; color: #9eaaa3; font-size: .82rem; }
.pied-titre { margin: 0 0 .9rem; color: #fff; font-size: .7rem; font-weight: 760; letter-spacing: .1em; text-transform: uppercase; }
.pied-liste { margin: 0; padding: 0; list-style: none; }
.pied-liste li { display: flex; justify-content: space-between; gap: .5rem; margin-bottom: .48rem; color: #9eaaa3; font-size: .8rem; }
.pied-liste a { color: #c8d0cb; text-decoration: none; }
.pied-liste a:hover { color: #fff; }
.pied-reseaux { display: flex; gap: .8rem; margin-top: 1rem; }
.pied-reseaux a { color: #fff; font-size: .78rem; font-weight: 700; }
.pied-bas { display: flex; justify-content: space-between; gap: 1rem; padding: 1.1rem 0; border-top: 1px solid rgba(255,255,255,.1); color: #7e8c84; font-size: .7rem; }

/* Responsive */
@media (max-width: 1080px) {
  .logo { min-width: auto; }
  .logo-baseline { display: none; }
  .nav { gap: 1rem; }
  .recherche-entete { display: none; }
  .grille-produits { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
  .conteneur, .conteneur-etroit { width: min(100% - 28px, 1240px); }
  .bandeau-annonce-interieur { justify-content: center; }
  .bandeau-annonce a { display: none; }
  .entete-grille {
    min-height: 72px;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: .55rem;
  }
  .logo { min-width: 0; max-width: 100%; }
  .logo-texte { min-width: 0; }
  .entete-actions, .burger { min-width: 0; flex: none; }
  .logo-embleme { width: 37px; height: 37px; }
  .logo-nom { font-size: 1.28rem; }
  .burger { width: 42px; height: 42px; display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; order: 3; padding: 0; border: 1px solid var(--trait); border-radius: 50%; background: #fff; cursor: pointer; }
  .burger span:not(.sr-only) { width: 18px; height: 1.5px; margin-inline: auto; background: var(--encre-forte); transition: transform .2s ease, opacity .2s ease; }
  .burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
  .burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
  .entete-actions { order: 2; }
  .panier-texte { display: none; }
  .lien-panier { width: 42px; padding: 0; justify-content: center; position: relative; }
  .lien-panier .pastille { position: absolute; right: -4px; top: -4px; min-width: 18px; height: 18px; border: 2px solid #fff; font-size: .58rem; }
  .nav {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    max-width: 100vw;
    display: none;
    align-items: stretch;
    flex-direction: column;
    gap: 0;
    padding: .8rem 14px 1.1rem;
    overflow-x: hidden;
    border-bottom: 1px solid var(--trait);
    background: #fff;
    box-shadow: 0 18px 35px rgba(25,32,28,.10);
  }
  .nav.ouverte { display: flex; }
  .nav > a, .nav summary { width: 100%; display: block; padding: .72rem .25rem; }
  .nav > a::after, .nav summary::after { display: none; }
  .nav-deroulant { width: 100%; }
  .nav-deroulant summary::before { float: right; margin-top: .4rem; }
  .nav-sous-menu { position: static; width: 100%; padding: .2rem 0 .35rem .7rem; border: 0; box-shadow: none; transform: none; }
  .nav-sous-menu a { padding: .55rem .6rem; }
  .recherche-mobile { display: grid; grid-template-columns: 1fr auto; gap: .45rem; margin-top: .5rem; padding-top: .8rem; border-top: 1px solid var(--trait); }
  .recherche-mobile input { min-width: 0; min-height: 42px; padding: .55rem .75rem; border: 1px solid var(--trait); border-radius: 9px; }
  .recherche-mobile button { border: 0; border-radius: 9px; background: var(--encre-forte); color: #fff; font-size: .76rem; font-weight: 700; }

  .hero-grille, .produit-grille, .panier-grille { grid-template-columns: 1fr; }
  .hero-copy { max-width: none; }
  .hero-media { max-width: 650px; margin-inline: auto; }
  .bande-reperes-grille { grid-template-columns: 1fr; }
  .repere { padding: 1rem 0; border-right: 0; border-bottom: 1px solid var(--trait); }
  .repere:last-child { border-bottom: 0; }
  .grille-collections { grid-template-columns: 1fr 1fr; }
  .histoire-grille { grid-template-columns: auto 1fr; }
  .histoire-grille > div:last-child { grid-column: 2; }
  .produit-grille > div:last-child, .recap { position: static; }
  .avant-pied-grille { grid-template-columns: 1fr; }
  .avant-pied-grille > div, .avant-pied-grille > div:first-child, .avant-pied-grille > div:last-child { padding: 1.1rem 0; border-right: 0; border-bottom: 1px solid var(--trait); }
  .avant-pied-grille > div:last-child { border-bottom: 0; }
  .pied-grille { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 620px) {
  body { font-size: 15.5px; }
  .logo { gap: .55rem; }
  .logo-texte { max-width: none; }
  .logo-nom {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
    font-size: clamp(.98rem, 4.5vw, 1.12rem);
    line-height: 1.05;
  }
  .entete-demo-lecture {
    min-height: 38px;
    padding-inline: .68rem;
    font-size: .82rem;
    white-space: nowrap;
  }
  .hero { padding-top: 3rem; }
  .hero-titre { font-size: clamp(2.75rem, 14vw, 4.3rem); }
  .hero-media { padding: 0 0 1.5rem 0; }
  .hero-visuel { border-radius: 18px 18px 55px 18px; }
  .hero-produit { left: .65rem; bottom: 0; width: calc(100% - 1.3rem); }
  .hero-garanties { display: grid; gap: .6rem; }
  .section-entete { align-items: flex-start; flex-direction: column; gap: .8rem; }
  .grille-produits { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.65rem .8rem; }
  .tuile-corps { padding-top: .7rem; }
  .tuile-nom { font-size: 1.12rem; }
  .tuile-detail { display: none; }
  .tuile-pied { align-items: flex-start; flex-direction: column; gap: .25rem; }
  .grille-collections { grid-template-columns: 1fr; }
  .histoire-grille { grid-template-columns: 1fr; gap: 1rem; }
  .histoire-citation { display: none; }
  .histoire-grille > div:last-child { grid-column: auto; }
  .filtres-ligne { align-items: stretch; flex-direction: column; }
  .tri select { width: 100%; }
  .grille-champs { grid-template-columns: 1fr; }
  .ligne-achat { align-items: stretch; flex-direction: column; }
  .champ-qte { width: 100%; }
  .table-panier thead { display: none; }
  .table-panier tr { display: grid; grid-template-columns: 1fr auto; gap: .35rem 1rem; padding: 1rem 0; border-bottom: 1px solid var(--trait); }
  .table-panier td { display: block; padding: 0; border: 0; }
  .table-panier td:first-child { grid-column: 1 / -1; margin-bottom: .45rem; }
  .table-panier .col-droite { text-align: left; }
  .table-panier td:last-child { text-align: right; }
  .progression-commande b { width: 20px; }
  .pied-grille { grid-template-columns: 1fr; gap: 1.6rem; padding-top: 3rem; }
  .pied-bas { flex-direction: column; }
}

@media (max-width: 390px) {
  .conteneur, .conteneur-etroit { width: min(100% - 22px, 1240px); }
  .entete-grille { gap: .4rem; }
  .logo-embleme { width: 34px; height: 34px; font-size: 1.15rem; }
  .logo { gap: .45rem; }
  .logo-nom { font-size: .98rem; }
  .burger { width: 40px; height: 40px; }
  .entete-demo-lecture { min-height: 36px; padding-inline: .55rem; font-size: .76rem; }
}

@media (max-width: 360px) {
  .progression-commande { gap: .3rem; font-size: .66rem; }
  .progression-commande span { gap: .22rem; min-width: 0; white-space: nowrap; }
  .progression-commande i { width: 21px; height: 21px; flex: 0 0 21px; font-size: .62rem; }
  .progression-commande b { width: 10px; flex: 0 1 10px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

@media print {
  .entete, .pied, .avant-pied, .bandeau-annonce, .btn, .burger { display: none !important; }
  body { background: #fff; }
}

/* Comptes clients */
.lien-compte {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: .42rem;
  padding: 0 .72rem;
  border: 1px solid var(--trait);
  border-radius: 999px;
  background: #fff;
  color: var(--encre-forte);
  font-size: .82rem;
  font-weight: 680;
  text-decoration: none;
  white-space: nowrap;
}
.lien-compte:hover, .lien-compte.actif { border-color: var(--sauge); background: var(--sauge-claire); color: var(--encre-forte); }
.lien-compte svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.nav-compte-mobile { display: none; }

.page-auth-client { display: grid; grid-template-columns: minmax(0, .9fr) minmax(420px, .72fr); gap: clamp(2rem, 7vw, 6rem); align-items: center; }
.auth-client-intro { max-width: 650px; }
.auth-client-intro > p:not(.eyebrow) { max-width: 54ch; color: var(--encre-doux); }
.auth-invite { padding: .9rem 1rem; border-left: 3px solid var(--terre); background: var(--ivoire); }
.liste-avantages-compte { display: grid; gap: .65rem; margin: 1.7rem 0 0; padding: 0; list-style: none; }
.liste-avantages-compte li { position: relative; padding-left: 1.7rem; color: var(--encre); }
.liste-avantages-compte li::before { content: "✓"; position: absolute; left: 0; color: var(--succes); font-weight: 800; }
.carte-auth-client { padding: clamp(1.35rem, 3vw, 2.2rem); border: 1px solid var(--trait); border-radius: 20px; background: var(--ivoire); box-shadow: var(--ombre-douce); }
.carte-auth-client.auth-simple { margin-top: 1.5rem; background: #fff; }
.auth-client-pied { margin: 1.2rem 0 0; padding-top: 1.1rem; border-top: 1px solid var(--trait); color: var(--encre-doux); font-size: .86rem; text-align: center; }
.label-ligne { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: .35rem; }
.label-ligne label { margin: 0; }
.label-ligne a { font-size: .75rem; font-weight: 700; }
.facultatif { color: var(--encre-doux); font-size: .72rem; font-weight: 500; }
.case-client { display: flex; align-items: flex-start; gap: .65rem; margin: .4rem 0 1.15rem; color: var(--encre); font-size: .83rem; cursor: pointer; }
.case-client input { margin-top: .28rem; accent-color: var(--encre-forte); }
.case-client strong, .case-client small { display: block; }
.case-client small { margin-top: .18rem; color: var(--encre-doux); font-size: .75rem; line-height: 1.45; }
.erreur-champ { color: var(--danger); }

.entete-compte { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; margin-bottom: 2rem; }
.entete-compte h1 { margin-bottom: .2rem; }
.entete-compte p:last-child { color: var(--encre-doux); }
.stats-compte { display: grid; grid-template-columns: repeat(3, 1fr); gap: .9rem; margin-bottom: 1.2rem; }
.stats-compte > div { padding: 1.1rem 1.2rem; border: 1px solid var(--trait); border-radius: 13px; background: var(--ivoire); }
.stats-compte span { display: block; margin-bottom: .3rem; color: var(--encre-doux); font-size: .7rem; font-weight: 730; letter-spacing: .06em; text-transform: uppercase; }
.stats-compte strong { color: var(--encre-forte); font-family: var(--display); font-size: 1.35rem; font-weight: 600; }
.nav-compte { position: sticky; top: 94px; z-index: 20; display: flex; gap: .35rem; margin-bottom: 2.6rem; padding: .48rem; border: 1px solid var(--trait); border-radius: 999px; background: rgba(255,255,255,.94); box-shadow: var(--ombre-douce); backdrop-filter: blur(12px); }
.nav-compte a { flex: 1; padding: .62rem .8rem; border-radius: 999px; color: var(--encre); font-size: .78rem; font-weight: 690; text-align: center; text-decoration: none; }
.nav-compte a:hover { background: var(--ivoire); color: var(--terre-foncee); }
.section-compte { scroll-margin-top: 170px; margin-bottom: 2.3rem; }
.section-compte-entete { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.section-compte-entete h2, .carte-compte h2 { font-size: clamp(1.8rem, 3vw, 2.5rem); }
.liste-commandes-client { display: grid; gap: .65rem; }
.commande-client-carte { display: grid; grid-template-columns: minmax(150px, 1fr) auto minmax(100px, auto) auto; align-items: center; gap: 1rem; padding: 1rem 1.15rem; border: 1px solid var(--trait); border-radius: 13px; background: #fff; }
.commande-client-carte > div:first-child { display: flex; flex-direction: column; }
.commande-client-carte > div:first-child strong { color: var(--encre-doux); font-size: .76rem; font-weight: 560; }
.commande-client-total { color: var(--encre-forte); font-weight: 760; text-align: right; }
.etat { display: inline-flex; align-items: center; justify-content: center; min-height: 27px; padding: .2rem .58rem; border-radius: 999px; font-size: .68rem; font-weight: 750; white-space: nowrap; }
.etat-en_attente { background: #fbf1dc; color: #835b19; }
.etat-payee, .etat-actif { background: #e7f1eb; color: #35664c; }
.etat-en_preparation { background: #e9f0f6; color: #3d6689; }
.etat-expediee { background: #eeeaf7; color: #5e4f8a; }
.etat-livree { background: #ebf4e8; color: #477044; }
.etat-retour_autorise { background: #fff1d8; color: #7a5318; }
.etat-retour_recu { background: #e6f1f6; color: #315f72; }
.etat-remboursee { background: #e9e7f5; color: #51487a; }
.etat-verrouillee { background: #f0ece8; color: #65594f; }
.etat-annulee, .etat-inactif { background: #f8eae8; color: #87382d; }
.grille-compte-formulaires { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.carte-compte { padding: 1.45rem; border: 1px solid var(--trait); border-radius: 16px; background: var(--ivoire); }
.carte-securite { display: grid; grid-template-columns: minmax(220px, .65fr) minmax(0, 1.35fr); gap: 2rem; align-items: start; }
.carte-securite > div > p:last-child { color: var(--encre-doux); }

.detail-commande-entete { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin: 1.8rem 0; }
.detail-commande-entete h1 { font-size: clamp(2.4rem, 5vw, 4rem); }
.detail-commande-entete p:last-child { color: var(--encre-doux); }
.table-detail-client th { width: auto; color: var(--encre); font-size: .84rem; font-weight: 620; letter-spacing: 0; text-transform: none; }
.table-detail-client td { text-align: right; }
.ligne-total-client th, .ligne-total-client td { padding-top: 1rem; color: var(--encre-forte); font-size: 1rem; }
.grille-detail-commande { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.actions-confirmation { display: flex; flex-wrap: wrap; gap: .7rem; }

.bandeau-compte-commande { display: flex; align-items: center; gap: .8rem; margin: 0 0 1.25rem; padding: .9rem 1rem; border: 1px solid #bfd3c7; border-radius: 13px; background: #edf5ef; }
.bandeau-compte-commande > div { min-width: 0; display: flex; flex: 1; flex-direction: column; }
.bandeau-compte-commande strong { color: var(--encre-forte); font-size: .86rem; }
.bandeau-compte-commande span:not(.avatar-client) { color: var(--encre-doux); font-size: .76rem; }
.bandeau-compte-commande > a:not(.btn) { font-size: .78rem; font-weight: 750; white-space: nowrap; }
.bandeau-compte-invite { border-color: var(--trait); background: var(--ivoire); }
.avatar-client { width: 38px; height: 38px; display: grid; place-items: center; flex: none; border-radius: 50%; background: var(--encre-forte); color: #fff; font-weight: 760; }
.creation-compte-commande { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--trait); }
.case-compte-commande { margin-bottom: 0; padding: .85rem; border: 1px solid var(--trait); border-radius: 11px; background: var(--ivoire); }
.champs-compte-commande { padding: 1rem .85rem 0; }
.champs-compte-commande[hidden] { display: none; }
.sauvegarde-coordonnees { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--trait); }
.sauvegarde-coordonnees .case-compte-commande { margin-bottom: .6rem; }
.sauvegarde-coordonnees > a { display: inline-flex; font-size: .78rem; font-weight: 750; }

@media (max-width: 1080px) {
  .lien-compte span { display: none; }
  .lien-compte { width: 42px; justify-content: center; padding: 0; }
}

@media (max-width: 860px) {
  .nav-compte-mobile { display: block; }
  .lien-compte { display: none; }
  .page-auth-client { grid-template-columns: 1fr; gap: 1.5rem; }
  .auth-client-intro { max-width: none; }
  .stats-compte { grid-template-columns: 1fr 1fr 1fr; }
  .nav-compte { position: static; overflow-x: auto; border-radius: 14px; }
  .nav-compte a { min-width: max-content; }
  .commande-client-carte { grid-template-columns: 1fr auto; }
  .commande-client-carte .etat { justify-self: end; }
  .commande-client-total { text-align: left; }
  .commande-client-carte .lien-fleche { justify-self: end; }
  .grille-compte-formulaires, .carte-securite { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .page-auth-client { display: block; }
  .auth-client-intro { margin-bottom: 1.5rem; }
  .carte-auth-client { padding: 1.1rem; border-radius: 15px; }
  .entete-compte, .section-compte-entete, .detail-commande-entete { align-items: flex-start; flex-direction: column; }
  .stats-compte { grid-template-columns: 1fr; }
  .commande-client-carte { grid-template-columns: 1fr; align-items: start; }
  .commande-client-carte .etat, .commande-client-carte .lien-fleche { justify-self: start; }
  .grille-detail-commande { grid-template-columns: 1fr; }
  .bandeau-compte-commande { align-items: flex-start; flex-wrap: wrap; }
  .bandeau-compte-commande .btn { width: 100%; }
}

/* Messagerie client V2.3 */
.lien-messages {
  position: relative;
  width: 42px;
  min-height: 42px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--trait);
  border-radius: 999px;
  background: #fff;
  color: var(--encre-forte);
  text-decoration: none;
}
.lien-messages:hover, .lien-messages.actif { border-color: var(--terre); background: var(--terre-claire); color: var(--terre-foncee); }
.lien-messages svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.pastille-message-entete {
  min-width: 19px;
  height: 19px;
  display: inline-grid;
  place-items: center;
  padding: 0 5px;
  border-radius: 999px;
  background: var(--terre);
  color: #fff;
  font-size: .65rem;
  font-weight: 800;
  line-height: 1;
}
.lien-messages .pastille-message-entete { position: absolute; top: -5px; right: -5px; box-shadow: 0 0 0 2px #fff; }
.pastille-message-entete[hidden] { display: none !important; }
.nav-messages-mobile { display: none; align-items: center; justify-content: space-between; gap: .5rem; }
.badge-message-client { display: inline-flex; margin-top: .35rem; padding: .25rem .55rem; border-radius: 999px; background: var(--terre-claire); color: var(--terre-foncee); font-size: .7rem; font-weight: 760; }

.espace-messagerie { max-width: 1240px; }
.entete-messagerie { align-items: center; }
.messagerie-grille { display: grid; grid-template-columns: minmax(270px, .72fr) minmax(0, 1.6fr); min-height: 620px; overflow: hidden; border: 1px solid var(--trait); border-radius: 20px; background: #fff; box-shadow: var(--ombre-douce); }
.messagerie-liste { padding: 1rem; border-right: 1px solid var(--trait); background: var(--ivoire); }
.messagerie-liste-entete { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .3rem .25rem 1rem; }
.conversations-client { display: grid; gap: .45rem; }
.conversation-client { display: grid; gap: .3rem; padding: .9rem; border: 1px solid transparent; border-radius: 13px; color: var(--encre); text-decoration: none; }
.conversation-client:hover { border-color: var(--trait); background: #fff; }
.conversation-client.active { border-color: #c9b7a4; background: #fff; box-shadow: 0 8px 26px rgba(36,49,43,.07); }
.conversation-client-haut { display: flex; align-items: flex-start; justify-content: space-between; gap: .6rem; }
.conversation-client > span:not(.conversation-client-haut) { color: var(--encre-doux); font-size: .78rem; line-height: 1.45; }
.conversation-client small { color: var(--encre-doux); font-size: .68rem; }
.pastille-message { min-width: 21px; height: 21px; display: inline-grid; place-items: center; flex: none; border-radius: 999px; background: var(--terre); color: #fff; font-size: .66rem; font-weight: 800; }
.messagerie-vide { margin: 1rem 0; }
.messagerie-contenu { min-width: 0; display: flex; flex-direction: column; padding: clamp(1.15rem, 3vw, 2rem); }
.fil-entete { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--trait); }
.fil-entete h2 { margin: 0; font-size: clamp(1.5rem, 3vw, 2.2rem); }
.fil-messages { flex: 1; display: flex; flex-direction: column; gap: .85rem; padding: 1.5rem 0; }
.bulle-message { max-width: min(78%, 680px); padding: .9rem 1rem; border: 1px solid var(--trait); border-radius: 16px; background: var(--ivoire); }
.bulle-message p { margin: .55rem 0 0; white-space: normal; }
.bulle-client { align-self: flex-end; border-bottom-right-radius: 5px; background: var(--sauge-claire); }
.bulle-admin { align-self: flex-start; border-bottom-left-radius: 5px; background: #fff; }
.bulle-message-auteur { display: flex; justify-content: space-between; gap: 1rem; color: var(--encre-doux); font-size: .7rem; }
.bulle-message-auteur strong { color: var(--encre-forte); }
.formulaire-reponse-message { padding-top: 1rem; border-top: 1px solid var(--trait); }
.formulaire-reponse-message textarea { min-height: 110px; }
.nouveau-message-client { max-width: 720px; margin: auto; width: 100%; }
.nouveau-message-client > p:not(.eyebrow) { color: var(--encre-doux); }

@media (max-width: 860px) {
  .nav-messages-mobile { display: flex; }
  .messagerie-grille { grid-template-columns: 1fr; }
  .messagerie-liste { border-right: 0; border-bottom: 1px solid var(--trait); }
  .conversations-client { max-height: 300px; overflow-y: auto; }
}

@media (max-width: 620px) {
  .messagerie-grille { border-radius: 14px; }
  .messagerie-contenu { padding: 1rem; }
  .bulle-message { max-width: 92%; }
  .fil-entete { align-items: flex-start; flex-direction: column; }
}

/* Quatre indicateurs dans le tableau de bord client V2.3. */
.stats-compte { grid-template-columns: repeat(4, 1fr); }
.stats-compte a { color: inherit; text-decoration: none; }
@media (max-width: 860px) { .stats-compte { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .stats-compte { grid-template-columns: 1fr; } }

/* V2.4 — commande validée avec l'assistance de l'atelier */
.confirmation-assistee-client { margin-bottom: 1.2rem; }
.confirmation-assistee-client a { display: inline-block; margin-left: .35rem; font-weight: 750; }


.confirmation-retour-client span { display: inline-block; margin-top: .45rem; }
.confirmation-retour-client p { margin: .55rem 0 0; }

.confirmation-annulation-client { border-left-color: #87382d; }

.bandeau-preproduction{position:relative;z-index:1000;padding:.55rem 1rem;background:#6f2d24;color:#fff;text-align:center;font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}

/* Sélection groupée des déclinaisons — V2.7.7 */
.declinaisons-multiples { min-width: 0; margin: 0 0 1rem; padding: 0; border: 0; }
.declinaisons-multiples legend { margin-bottom: .3rem; color: var(--encre-forte); font-size: .95rem; font-weight: 760; }
.declinaison-liste { display: grid; gap: .65rem; margin-top: .9rem; }
.declinaison-ligne { display: grid; grid-template-columns: auto minmax(0, 1fr) 96px; gap: .8rem; align-items: center; padding: .85rem; border: 1px solid var(--trait); border-radius: 12px; background: #fff; transition: border-color .16s ease, box-shadow .16s ease, background .16s ease; }
.declinaison-ligne:hover { border-color: var(--sauge); }
.declinaison-ligne.declinaison-selectionnee { border-color: var(--encre-forte); background: #f7f9f7; box-shadow: 0 0 0 1px var(--encre-forte); }
.declinaison-case { width: 20px; height: 20px; margin: 0; accent-color: var(--encre-forte); cursor: pointer; }
.declinaison-description { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .15rem .75rem; align-items: baseline; cursor: pointer; }
.declinaison-description strong { overflow-wrap: anywhere; color: var(--encre-forte); font-size: .9rem; }
.declinaison-description > span { color: var(--encre-forte); font-size: .82rem; font-weight: 760; white-space: nowrap; }
.declinaison-description small { grid-column: 1 / -1; color: var(--encre-doux); font-size: .72rem; }
.declinaison-quantite { display: grid; gap: .25rem; }
.declinaison-quantite label { color: var(--encre-doux); font-size: .67rem; font-weight: 700; }
.declinaison-quantite input { width: 100%; min-height: 42px; padding: .45rem .55rem; border: 1px solid var(--trait); border-radius: 9px; background: #fff; color: var(--encre-forte); text-align: center; }
.declinaison-indisponible { opacity: .58; background: var(--ivoire-2); }
.declinaison-indisponible:hover { border-color: var(--trait); }
.declinaison-indisponible .declinaison-description, .declinaison-indisponible .declinaison-case { cursor: not-allowed; }
.declinaison-demande { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: .55rem .72rem; border: 1px solid var(--terre-foncee); border-radius: 9px; color: var(--terre-foncee); background: #fff; font-size: .72rem; font-weight: 780; text-align: center; text-decoration: none; }
.declinaison-demande:hover { background: var(--ivoire); }
.lien-demande-rupture { font-weight: 800; text-decoration: underline; text-underline-offset: .18em; }

.selection-declinaisons { display: flex; justify-content: space-between; gap: 1rem; margin: 0 0 .8rem; padding: .75rem .85rem; border-radius: 10px; background: #eef5f0; color: var(--encre-forte); font-size: .78rem; }
.selection-declinaisons strong { font-weight: 800; }
.produit-achat [data-ajouter-selection] { width: 100%; }
.produit-achat [data-ajouter-selection]:disabled { opacity: .52; cursor: not-allowed; }

@media (max-width: 620px) {
  .declinaison-ligne { grid-template-columns: auto minmax(0, 1fr); align-items: start; }
  .declinaison-case { margin-top: .2rem; }
  .declinaison-quantite { grid-column: 2; grid-template-columns: auto minmax(90px, 130px); align-items: center; justify-content: space-between; }
  .declinaison-quantite input { min-height: 40px; }
  .selection-declinaisons { align-items: flex-start; flex-direction: column; gap: .25rem; }
}

/* Boutique V2.7.9 — informations précontractuelles compactes */
.info-legale-commande { display: flex; flex-wrap: wrap; gap: .45rem .9rem; align-items: center; margin-top: .8rem; padding: .75rem .85rem; border: 1px solid var(--trait); border-radius: 10px; background: var(--ivoire-2); color: var(--encre-doux); font-size: .76rem; }
.info-legale-commande strong { color: var(--encre-forte); }
.info-legale-commande a, .liens-legaux-commande a { font-weight: 700; }
.liens-legaux-commande { margin: .15rem 0 0; }

/* Boutique V2.8 — demandes clients structurées */
.page-demande, .page-demandes-client { padding-bottom: 3rem; }
.entete-demande { display: flex; align-items: flex-start; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.5rem; }
.entete-demande > div { max-width: 760px; }
.entete-demande h1 { margin-bottom: .55rem; }
.entete-demande p:not(.eyebrow) { color: var(--encre-doux); }
.demande-formulaires { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem; align-items: start; }
.carte-demande { padding: 1.25rem; border: 1px solid var(--trait); border-radius: 16px; background: #fff; box-shadow: var(--ombre-legere); }
.carte-demande h2 { margin-bottom: 1rem; }
.carte-demande-hors-catalogue { background: var(--ivoire-2); }
.champ-quantite-demande { max-width: 190px; }
.optionnel { color: var(--encre-doux); font-size: .72rem; font-weight: 500; }
.section-demande-recap { margin-top: 1.4rem; padding: 1.25rem; border: 1px solid var(--trait); border-radius: 16px; background: #fff; }
.table-demande { width: 100%; border-collapse: collapse; }
.table-demande th, .table-demande td { padding: .8rem .7rem; border-bottom: 1px solid var(--trait); text-align: left; vertical-align: top; }
.table-demande th { color: var(--encre-doux); font-size: .7rem; text-transform: uppercase; letter-spacing: .04em; }
.table-demande td strong { display: block; color: var(--encre-forte); }
.table-demande td small { display: block; margin-top: .35rem; color: var(--encre-doux); line-height: 1.45; }
.badge-type-demande { display: inline-flex; align-items: center; width: fit-content; margin-bottom: .35rem; padding: .18rem .48rem; border-radius: 999px; font-size: .64rem; font-weight: 780; }
.badge-type-catalogue { background: #e9f1eb; color: #355d48; }
.badge-type-hors_catalogue { background: #f8eadf; color: #8a573c; }
.demande-ligne-meta { display: block; margin-top: .15rem; color: var(--encre-doux); font-size: .74rem; }
.quantite-table { width: 90px; min-height: 40px; padding: .4rem .5rem; border: 1px solid var(--trait); border-radius: 8px; }
.case-retrait { display: inline-flex; align-items: center; gap: .4rem; color: var(--encre-doux); font-size: .76rem; }
.actions-demande-brouillon { display: flex; justify-content: flex-end; margin-top: 1rem; }
.envoi-demande-form { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1rem; padding: 1rem; border-radius: 12px; background: #eef5f0; }
.envoi-demande-form > div { display: grid; gap: .2rem; }
.envoi-demande-form span { color: var(--encre-doux); font-size: .76rem; }
.detail-demande-client { margin-bottom: 1.5rem; padding: 1.25rem; border: 1px solid var(--trait); border-radius: 16px; background: #fff; }
.detail-demande-entete { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.detail-demande-entete h2 { margin: .2rem 0; }
.demande-client-carte { grid-template-columns: minmax(0, 1.4fr) auto auto; }
.demande-client-carte small { display: block; margin-top: .25rem; color: var(--encre-doux); }
.texte-muted { color: var(--encre-doux); }
.etat-demande-nouvelle { background: #fff1cf; color: #785400; }
.etat-demande-en_etude { background: #e9eef7; color: #3d527b; }
.etat-demande-acceptee, .etat-demande-panier_pret, .etat-demande-commandee { background: #e3f1e7; color: #2e6543; }
.etat-demande-partielle { background: #f6e9d8; color: #7b5730; }
.etat-demande-refusee { background: #f4dfdc; color: #843e35; }
.produit-demande-raccourci { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin: 1rem 0; padding: .75rem .85rem; border: 1px solid var(--trait); border-radius: 10px; background: var(--ivoire-2); font-size: .76rem; }
.produit-demande-raccourci span { color: var(--encre-doux); }
.produit-demande-raccourci a { font-weight: 760; text-align: right; }
.tuile-actions-liens { display: inline-flex; align-items: center; gap: .75rem; }
.lien-demande { color: var(--terracotta, #a55e46); }

/* Le compte contient désormais cinq indicateurs. */
.stats-compte { grid-template-columns: repeat(5, 1fr); }

@media (max-width: 860px) {
  .demande-formulaires { grid-template-columns: 1fr; }
  .stats-compte { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 620px) {
  .entete-demande, .detail-demande-entete, .envoi-demande-form, .produit-demande-raccourci { align-items: stretch; flex-direction: column; }
  .envoi-demande-form .btn { width: 100%; }
  .demande-client-carte { grid-template-columns: 1fr; }
  .table-demande { min-width: 650px; }
  .produit-demande-raccourci a { text-align: left; }
  .stats-compte { grid-template-columns: 1fr; }
}


/* Boutique V2.8.6 — liens de facturation dans l'espace client. */
.commande-client-actions { display: flex; flex-wrap: wrap; gap: .7rem 1rem; align-items: center; }
.documents-facturation-client .actions-confirmation { display: flex; flex-wrap: wrap; gap: .65rem; }
@media (max-width: 560px) {
  .commande-client-actions { align-items: stretch; flex-direction: column; }
  .commande-client-actions .lien-fleche { width: 100%; justify-content: space-between; }
  .documents-facturation-client .actions-confirmation .btn { width: 100%; }
}


/* Boutique V2.8.10 — catégories et sous-catégories */
.nav-sous-menu .nav-categorie-principale-lien { font-weight: 720; color: var(--encre-forte); }
.nav-sous-menu .nav-sous-categorie-lien { padding-left: 1.25rem; color: var(--encre-doux); font-size: .84rem; }
.nav-sous-menu .nav-sous-categorie-lien + .nav-categorie-principale-lien { margin-top: .2rem; }
.puce-sous-categorie { border-style: dashed; font-size: .83rem; }
@media (max-width: 860px) {
  .nav-sous-menu .nav-sous-categorie-lien { padding-left: 1.25rem; }
}

/* V2.8.17 — carnet d'adresses et factures dans l'espace client */
.grille-adresses-compte { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); gap: 1.2rem; align-items: start; }
.liste-adresses-client { display: grid; gap: .85rem; }
.adresse-client-carte { padding: 1.15rem; border: 1px solid var(--trait); border-radius: 14px; background: #fff; }
.adresse-client-entete { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; margin-bottom: .75rem; }
.adresse-client-entete > div:first-child { display: flex; min-width: 0; flex-direction: column; }
.adresse-client-entete strong { color: var(--encre-forte); font-size: 1rem; }
.adresse-client-entete span { color: var(--encre-doux); font-size: .78rem; }
.badges-adresse { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .35rem; }
.badge-adresse { display: inline-flex; padding: .24rem .5rem; border-radius: 999px; background: var(--ivoire); color: var(--terre-foncee) !important; font-size: .66rem !important; font-weight: 750; white-space: nowrap; }
.adresse-client-carte > p { margin: 0 0 .9rem; color: var(--encre); line-height: 1.55; }
.actions-adresse-client { display: flex; flex-wrap: wrap; gap: .45rem; }
.actions-adresse-client form { margin: 0; }
.formulaire-adresse-client { position: sticky; top: 110px; }
.usages-adresse { margin: 1rem 0 1.25rem; padding: 1rem; border: 1px solid var(--trait); border-radius: 12px; }
.usages-adresse legend { padding: 0 .4rem; color: var(--encre-forte); font-weight: 750; }
.usages-adresse .case-client { margin-bottom: .65rem; }

.liste-factures-client { display: grid; gap: .75rem; }
.facture-client-carte { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 1rem; align-items: center; padding: 1rem 1.15rem; border: 1px solid var(--trait); border-radius: 14px; background: #fff; }
.facture-client-carte > div:first-child { display: flex; min-width: 0; flex-direction: column; }
.facture-client-carte .eyebrow { margin-bottom: .15rem; }
.facture-client-carte small { margin-top: .25rem; color: var(--encre-doux); }
.facture-client-montant { color: var(--encre-forte); font-weight: 780; white-space: nowrap; }

.adresse-facturation-commande { margin-top: 1.4rem; padding-top: 1.2rem; border-top: 1px solid var(--trait); }
.adresse-facturation-commande > h3 { margin: 0 0 .8rem; font-size: 1.2rem; }
.adresse-facturation-commande [data-bloc-facturation] { margin-top: .9rem; padding: 1rem; border: 1px solid var(--trait); border-radius: 12px; background: var(--ivoire); }
.adresse-facturation-commande [data-bloc-facturation][hidden] { display: none; }

@media (min-width: 861px) {
  .grille-detail-commande { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
  .grille-adresses-compte { grid-template-columns: 1fr; }
  .formulaire-adresse-client { position: static; }
  .facture-client-carte { grid-template-columns: 1fr auto; }
  .facture-client-carte .actions-confirmation { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  .adresse-client-entete { flex-direction: column; }
  .badges-adresse { justify-content: flex-start; }
  .actions-adresse-client, .actions-adresse-client form, .actions-adresse-client .btn { width: 100%; }
  .facture-client-carte { grid-template-columns: 1fr; }
  .facture-client-carte .actions-confirmation, .facture-client-carte .actions-confirmation .btn { width: 100%; }
}

/* V2.8.23 — page d'installation de l'application */
.section-installation-app {
  padding: clamp(3.5rem, 8vw, 7rem) 0;
  background:
    radial-gradient(circle at 86% 12%, rgba(169, 86, 63, .10), transparent 28rem),
    linear-gradient(180deg, #fff 0%, var(--ivoire) 100%);
}
.conteneur-installation-app { max-width: 1080px; }
.installation-app-intro { max-width: 800px; margin-bottom: 2rem; }
.installation-app-intro h1 { font-size: clamp(2.7rem, 6vw, 5rem); }
.installation-app-intro > p:not(.eyebrow):not(.installation-app-statut) { max-width: 700px; color: var(--encre-doux); font-size: 1.08rem; }
.installation-app-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin: 1.4rem 0 .8rem; }
.installation-app-actions [hidden] { display: none !important; }
.installation-app-statut {
  max-width: 720px;
  margin-top: 1rem;
  padding: .9rem 1rem;
  border: 1px solid var(--trait);
  border-radius: var(--rayon-petit);
  background: rgba(255,255,255,.7);
  color: var(--encre-doux);
}
.installation-app-statut[data-etat="ok"] { border-color: rgba(68,115,91,.35); color: var(--succes); background: rgba(68,115,91,.07); }
.installation-app-statut[data-etat="attention"] { border-color: rgba(180,122,41,.35); color: #855815; background: rgba(180,122,41,.08); }
.installation-app-grille { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.carte-installation-app {
  min-width: 0;
  padding: 1.5rem;
  border: 1px solid var(--trait);
  border-radius: var(--rayon);
  background: rgba(255,255,255,.88);
  box-shadow: var(--ombre-douce);
}
.carte-installation-numero {
  width: 2.2rem;
  height: 2.2rem;
  display: grid;
  place-items: center;
  margin-bottom: 1rem;
  border-radius: 50%;
  background: var(--encre-forte);
  color: #fff;
  font-weight: 800;
}
.carte-installation-app h2 { font-size: 1.75rem; }
.carte-installation-app p { color: var(--encre-doux); }
.installation-app-ios { padding: .75rem .85rem; border-radius: 10px; background: var(--sauge-claire); color: var(--encre) !important; }
.installation-app-note { margin-top: 1rem; padding: 1.4rem 1.5rem; border-left: 4px solid var(--terre); background: #fff; border-radius: 0 var(--rayon-petit) var(--rayon-petit) 0; }
.installation-app-note h2 { margin-bottom: .35rem; font-size: 1.5rem; }
.installation-app-note p { margin: 0; color: var(--encre-doux); }
@media (max-width: 820px) {
  .installation-app-grille { grid-template-columns: 1fr; }
}
@media (max-width: 430px) {
  .section-installation-app { padding-top: 2.4rem; }
  .installation-app-actions { display: grid; }
  .installation-app-actions .btn { width: 100%; justify-content: center; }
  .carte-installation-app { padding: 1.2rem; }
}


/* V2.8.33 — accès Administration uniquement dans l'application installée */
.pwa-admin-link { display: none !important; }
body.pwa-installee .pwa-admin-link { display: list-item !important; }
nav .pwa-admin-link { display: none !important; }
body.pwa-installee nav .pwa-admin-link { display: inline-flex !important; }
@media (display-mode: standalone) {
  .pwa-admin-link { display: list-item !important; }
  nav .pwa-admin-link { display: inline-flex !important; }
}

/* V2.8.42 — disponibilité des demandes clients. */
.etat-stock-rupture { background:#fff0f0; color:#9f2727; }
.etat-stock-faible { background:#fff7df; color:#8a5a00; }
.etat-stock-ok { background:#edf8f1; color:#25613d; }

/* V2.8.50 — harmonisation visuelle publique : prune, champagne, creme, charbon. */
:root {
  --prune: #7a4e6a;
  --prune-fonce: #5f394f;
  --champagne: #c6a15b;
  --rose-poudre: #f5edf1;
  --creme: #fcfaf8;
  --charbon: #211b20;
  --ombre: 0 20px 58px rgba(52, 38, 47, .11);
  --ombre-douce: 0 10px 30px rgba(52, 38, 47, .08);
}
body { color:#2b252a; background:#fff; }
.bandeau-annonce { background: linear-gradient(90deg,#211b20,#382932,#211b20); }
.entete { border-bottom-color: rgba(112,83,102,.13); background: rgba(255,253,252,.94); }
.entete.entete-ombre { box-shadow: 0 12px 34px rgba(48,34,43,.09); }
.logo-embleme { background: linear-gradient(145deg,#8c5a77,#5f394f); box-shadow:0 8px 24px rgba(122,78,106,.18); }
.nav > a::after, .nav summary::after { background: linear-gradient(90deg,var(--prune),var(--champagne)); }
.nav > a[aria-current="page"] { color:var(--prune-fonce); }
.recherche-entete { background:#faf6f8; border-color:#e5dbe1; }
.recherche-entete:focus-within { border-color:#b992aa; box-shadow:0 0 0 4px rgba(122,78,106,.08); }
.lien-panier { background:linear-gradient(135deg,#2b2228,#181417); box-shadow:0 8px 22px rgba(33,27,32,.14); }
.nav-sous-menu { border-color:#e6dce2; box-shadow:0 18px 46px rgba(52,38,47,.13); }
.nav-sous-menu a:hover { background:var(--rose-poudre); color:var(--prune-fonce); }
:focus-visible { outline-color:rgba(122,78,106,.34); }
.hero {
  background:
    radial-gradient(circle at 12% 20%, rgba(122,78,106,.12), transparent 34%),
    radial-gradient(circle at 88% 16%, rgba(198,161,91,.13), transparent 28%),
    linear-gradient(135deg,#fcfaf8 0%,#f6eff3 58%,#fbf6ec 100%);
}
.hero::after { border-color:rgba(122,78,106,.16); }
.hero-visuel { box-shadow:0 26px 70px rgba(52,38,47,.15); }
.hero-produit { border-color:rgba(255,255,255,.86); box-shadow:0 18px 45px rgba(52,38,47,.13); }
.btn:hover { background:var(--prune-fonce); border-color:var(--prune-fonce); box-shadow:0 12px 28px rgba(95,57,79,.2); }
.champ input:focus, .champ select:focus, .champ textarea:focus { border-color:#aa8099; box-shadow:0 0 0 4px rgba(122,78,106,.09); }
.section-collections { background:linear-gradient(180deg,#fcfaf8,#f8f3f6); }
.collection { border-color:#e9dfe4; box-shadow:0 8px 28px rgba(52,38,47,.045); }
.collection:hover { border-color:#d9c5d1; box-shadow:0 18px 44px rgba(52,38,47,.10); }
.collection-visuel, .tuile-visuel, .galerie-principale, .galerie-vignettes button { background:linear-gradient(145deg,#faf7f8,#f3ecef); }
.tuile-visuel { border:1px solid #eee4e9; transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease; }
.tuile:hover .tuile-visuel { transform:translateY(-4px); border-color:#d9c5d1; box-shadow:0 18px 42px rgba(52,38,47,.09); }
.tuile-marque-promo { background:var(--prune-fonce); }
.tuile-marque-unique { background:#b28a45; }
.tuile-pied .lien-discret, .collection-lien, .hero-produit-kicker { color:var(--prune-fonce); }
.section-histoire { background:linear-gradient(135deg,#211b20,#382832); }
.histoire-grille p { color:#d6cbd1; }
.histoire-grille .eyebrow { color:#d9bc80; }
.histoire-citation { color:#c6a15b; }
.barre-filtres { border-color:#e7dde3; background:#faf6f8; }
.puce:hover { border-color:#b992aa; color:var(--prune-fonce); }
.puce-active { border-color:var(--prune-fonce); background:var(--prune-fonce); }
.produit-achat { border-color:#e5d9e0; background:#faf6f8; }
.galerie-vignettes button[aria-pressed="true"] { border-color:var(--prune); }

/* V2.8.56 — quatre ambiances visuelles sur le site public.
   Le thème ne modifie aucune règle métier : catalogue, VIP, stock, panier et demandes restent inchangés. */
body[data-public-theme="doux"] {
  --theme-bg: #FFF9F6;
  --theme-card: #FFFFFF;
  --theme-primary: #C97B84;
  --theme-primary-strong: #A85F69;
  --theme-secondary: #8D6E63;
  --theme-accent: #E8CFC4;
  --theme-text: #2E2A2A;
  --theme-muted: #766A6B;
  --theme-border: #EEDFE1;
  --theme-soft: #FBF0F1;
  --theme-hero-mid: #FCEFF1;
  --theme-hero-end: #FFF7F3;
  --theme-banner: #5C3F45;
  --theme-banner-2: #7A5159;
  --theme-header: rgba(255, 252, 250, .95);
  --theme-primary-glow: rgba(201, 123, 132, .15);
  --theme-secondary-glow: rgba(141, 110, 99, .13);
  --theme-shadow: rgba(79, 48, 55, .11);
  --theme-shadow-soft: rgba(79, 48, 55, .075);
}
body[data-public-theme="luxe"] {
  --theme-bg: #FAF7F2;
  --theme-card: #FFFFFF;
  --theme-primary: #1F1F1F;
  --theme-primary-strong: #111111;
  --theme-secondary: #B3875A;
  --theme-accent: #E7D8C9;
  --theme-text: #1F1F1F;
  --theme-muted: #5C534D;
  --theme-border: #E5DDD4;
  --theme-soft: #F4EEE7;
  --theme-hero-mid: #F5EEE7;
  --theme-hero-end: #FBF7F1;
  --theme-banner: #171717;
  --theme-banner-2: #2C2621;
  --theme-header: rgba(253, 251, 248, .96);
  --theme-primary-glow: rgba(31, 31, 31, .10);
  --theme-secondary-glow: rgba(179, 135, 90, .15);
  --theme-shadow: rgba(36, 29, 24, .12);
  --theme-shadow-soft: rgba(36, 29, 24, .075);
}
body[data-public-theme="moderne"] {
  --theme-bg: #F7F8FA;
  --theme-card: #FFFFFF;
  --theme-primary: #6B7A8F;
  --theme-primary-strong: #4F5E73;
  --theme-secondary: #D9B8A8;
  --theme-accent: #EEF1F4;
  --theme-text: #222831;
  --theme-muted: #68717D;
  --theme-border: #E0E5EA;
  --theme-soft: #F2F5F7;
  --theme-hero-mid: #EEF2F6;
  --theme-hero-end: #FAF7F5;
  --theme-banner: #303A49;
  --theme-banner-2: #46556A;
  --theme-header: rgba(251, 252, 253, .96);
  --theme-primary-glow: rgba(107, 122, 143, .15);
  --theme-secondary-glow: rgba(217, 184, 168, .16);
  --theme-shadow: rgba(47, 59, 75, .11);
  --theme-shadow-soft: rgba(47, 59, 75, .07);
}
body[data-public-theme="oriental"] {
  --theme-bg: #FCF8F3;
  --theme-card: #FFFFFF;
  --theme-primary: #7A4E6A;
  --theme-primary-strong: #5F394F;
  --theme-secondary: #C6A15B;
  --theme-accent: #EEDFCF;
  --theme-text: #2D2430;
  --theme-muted: #766D73;
  --theme-border: #E6DFE2;
  --theme-soft: #F5EDF1;
  --theme-hero-mid: #F6EFF3;
  --theme-hero-end: #FBF6EC;
  --theme-banner: #211B20;
  --theme-banner-2: #382932;
  --theme-header: rgba(255, 253, 252, .94);
  --theme-primary-glow: rgba(122, 78, 106, .12);
  --theme-secondary-glow: rgba(198, 161, 91, .13);
  --theme-shadow: rgba(52, 38, 47, .11);
  --theme-shadow-soft: rgba(52, 38, 47, .08);
}

body[data-public-theme] {
  --encre: var(--theme-text);
  --encre-forte: var(--theme-text);
  --encre-doux: var(--theme-muted);
  --terre: var(--theme-primary);
  --terre-foncee: var(--theme-primary-strong);
  --sauge: var(--theme-secondary);
  --sauge-claire: var(--theme-accent);
  --ivoire: var(--theme-bg);
  --ivoire-2: var(--theme-soft);
  --trait: var(--theme-border);
  --ombre: 0 20px 58px var(--theme-shadow);
  --ombre-douce: 0 10px 30px var(--theme-shadow-soft);
  color: var(--theme-text);
  background: var(--theme-card);
  transition: background-color .2s ease, color .2s ease;
}

body[data-public-theme] .bandeau-annonce {
  background: linear-gradient(90deg, var(--theme-banner), var(--theme-banner-2), var(--theme-banner));
}
body[data-public-theme] .entete {
  border-bottom-color: var(--theme-border);
  background: var(--theme-header);
}
body[data-public-theme] .entete.entete-ombre { box-shadow: 0 12px 34px var(--theme-shadow-soft); }
body[data-public-theme] .logo-embleme {
  background: linear-gradient(145deg, var(--theme-primary), var(--theme-primary-strong));
  box-shadow: 0 8px 24px var(--theme-primary-glow);
}
body[data-public-theme] .nav > a::after,
body[data-public-theme] .nav summary::after {
  background: linear-gradient(90deg, var(--theme-primary), var(--theme-secondary));
}
body[data-public-theme] .nav > a[aria-current="page"] { color: var(--theme-primary-strong); }
body[data-public-theme] .recherche-entete,
body[data-public-theme] .barre-filtres,
body[data-public-theme] .produit-achat {
  background: var(--theme-soft);
  border-color: var(--theme-border);
}
body[data-public-theme] .recherche-entete:focus-within,
body[data-public-theme] .champ input:focus,
body[data-public-theme] .champ select:focus,
body[data-public-theme] .champ textarea:focus {
  border-color: var(--theme-primary);
  box-shadow: 0 0 0 4px var(--theme-primary-glow);
}
body[data-public-theme] .lien-panier {
  background: linear-gradient(135deg, var(--theme-banner-2), var(--theme-banner));
  box-shadow: 0 8px 22px var(--theme-shadow);
}
body[data-public-theme] .lien-panier:hover { background: var(--theme-primary-strong); }
body[data-public-theme] .lien-compte:hover,
body[data-public-theme] .lien-compte.actif {
  border-color: var(--theme-secondary);
  background: var(--theme-accent);
  color: var(--theme-text);
}
body[data-public-theme] .nav-sous-menu {
  border-color: var(--theme-border);
  background: var(--theme-card);
  box-shadow: 0 18px 46px var(--theme-shadow);
}
body[data-public-theme] .nav-sous-menu a:hover { background: var(--theme-soft); color: var(--theme-primary-strong); }
body[data-public-theme] :focus-visible { outline-color: var(--theme-primary-glow); }

body[data-public-theme] .hero {
  background:
    radial-gradient(circle at 12% 20%, var(--theme-primary-glow), transparent 34%),
    radial-gradient(circle at 88% 16%, var(--theme-secondary-glow), transparent 28%),
    linear-gradient(135deg, var(--theme-bg) 0%, var(--theme-hero-mid) 58%, var(--theme-hero-end) 100%);
}
body[data-public-theme] .hero::after { border-color: var(--theme-primary-glow); }
body[data-public-theme] .hero-visuel { box-shadow: 0 26px 70px var(--theme-shadow); }
body[data-public-theme] .hero-produit {
  border-color: rgba(255,255,255,.86);
  background: var(--theme-card);
  box-shadow: 0 18px 45px var(--theme-shadow);
}
body[data-public-theme] .btn:hover {
  background: var(--theme-primary-strong);
  border-color: var(--theme-primary-strong);
  box-shadow: 0 12px 28px var(--theme-primary-glow);
}
body[data-public-theme] .section-collections { background: linear-gradient(180deg, var(--theme-bg), var(--theme-soft)); }
body[data-public-theme] .collection,
body[data-public-theme] .tuile-visuel,
body[data-public-theme] .galerie-principale,
body[data-public-theme] .galerie-vignettes button,
body[data-public-theme] .adresse-client-carte,
body[data-public-theme] .facture-client-carte,
body[data-public-theme] .carte-installation-app {
  border-color: var(--theme-border);
}
body[data-public-theme] .collection { box-shadow: 0 8px 28px var(--theme-shadow-soft); }
body[data-public-theme] .collection:hover,
body[data-public-theme] .tuile:hover .tuile-visuel {
  border-color: var(--theme-primary);
  box-shadow: 0 18px 44px var(--theme-shadow);
}
body[data-public-theme] .collection-visuel,
body[data-public-theme] .tuile-visuel,
body[data-public-theme] .galerie-principale,
body[data-public-theme] .galerie-vignettes button {
  background: linear-gradient(145deg, var(--theme-card), var(--theme-soft));
}
body[data-public-theme] .tuile-marque-promo { background: var(--theme-primary-strong); }
body[data-public-theme] .tuile-marque-unique { background: var(--theme-secondary); }
body[data-public-theme] .tuile-pied .lien-discret,
body[data-public-theme] .collection-lien,
body[data-public-theme] .hero-produit-kicker { color: var(--theme-primary-strong); }
body[data-public-theme] .section-histoire,
body[data-public-theme] .pied { background: linear-gradient(135deg, var(--theme-banner), var(--theme-banner-2)); }
body[data-public-theme] .histoire-grille p,
body[data-public-theme] .pied-texte,
body[data-public-theme] .pied-liste,
body[data-public-theme] .pied-liste a { color: rgba(255,255,255,.74); }
body[data-public-theme] .histoire-grille .eyebrow,
body[data-public-theme] .histoire-citation,
body[data-public-theme] .pied-reseaux a { color: var(--theme-secondary); }
body[data-public-theme] .puce:hover { border-color: var(--theme-primary); color: var(--theme-primary-strong); }
body[data-public-theme] .puce-active { border-color: var(--theme-primary-strong); background: var(--theme-primary-strong); }
body[data-public-theme] .galerie-vignettes button[aria-pressed="true"] { border-color: var(--theme-primary); }
body[data-public-theme] .badge-adresse,
body[data-public-theme] .case-compte-commande,
body[data-public-theme] .adresse-facturation-commande [data-bloc-facturation],
body[data-public-theme] .installation-app-ios { background: var(--theme-soft); }
body[data-public-theme] .installation-app-note { border-left-color: var(--theme-primary); }
body[data-public-theme] .section-installation-app {
  background:
    radial-gradient(circle at 86% 12%, var(--theme-primary-glow), transparent 28rem),
    linear-gradient(180deg, var(--theme-card) 0%, var(--theme-bg) 100%);
}

.theme-public-bouton {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 42px;
  padding: 0;
  border: 1px solid var(--theme-border, var(--trait));
  border-radius: 50%;
  background: var(--theme-soft, var(--ivoire));
  color: var(--theme-primary-strong, var(--encre-forte));
  box-shadow: 0 6px 18px var(--theme-shadow-soft, rgba(30,39,34,.08));
  cursor: pointer;
  font-size: 1.05rem;
  line-height: 1;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.theme-public-bouton:hover {
  transform: translateY(-1px);
  border-color: var(--theme-primary, var(--terre));
  background: var(--theme-card, #fff);
  box-shadow: 0 9px 22px var(--theme-shadow, rgba(30,39,34,.10));
}
.theme-public-bouton:active { transform: translateY(0); }

@media (max-width: 860px) {
  body[data-public-theme] .nav { background: var(--theme-card); border-bottom-color: var(--theme-border); box-shadow: 0 18px 35px var(--theme-shadow-soft); }
  body[data-public-theme] .burger { border-color: var(--theme-border); background: var(--theme-card); }
  body[data-public-theme] .burger span:not(.sr-only) { background: var(--theme-text); }
  .theme-public-bouton { width: 42px; height: 42px; flex-basis: 42px; }
}
@media (max-width: 390px) {
  .theme-public-bouton { width: 38px; height: 38px; flex-basis: 38px; font-size: .96rem; }
}
@media print {
  .theme-public-bouton { display: none !important; }
}
body[data-public-theme] .btn:not(.btn-clair) {
  background: var(--theme-primary-strong);
  border-color: var(--theme-primary-strong);
}
body[data-public-theme] .btn:not(.btn-clair):hover {
  background: var(--theme-primary);
  border-color: var(--theme-primary);
}


/* V2.8.68 — en-tête public : aucune action ni nom de boutique ne déborde. */
@media (min-width:1321px) {
  .entete > .conteneur { width:min(1600px,calc(100% - 40px)); }
  .entete-grille { grid-template-columns:minmax(250px,auto) minmax(0,1fr) auto; gap:clamp(1rem,1.7vw,1.8rem); }
  .logo { min-width:250px; max-width:330px; }
  .nav { min-width:0; gap:clamp(.85rem,1.15vw,1.3rem); }
}
@media (min-width:1021px) and (max-width:1320px) {
  .entete > .conteneur { width:min(100% - 28px,1320px); }
  .entete-grille { grid-template-columns:minmax(190px,auto) minmax(0,1fr) auto; gap:.75rem; }
  .logo { min-width:190px; max-width:230px; gap:.6rem; }
  .logo-embleme { width:38px; height:38px; }
  .logo-nom { font-size:1.22rem; }
  .logo-baseline, .recherche-entete, .lien-compte span { display:none; }
  .nav { min-width:0; gap:.62rem; }
  .nav > a, .nav summary { font-size:.79rem; }
  .lien-compte { width:42px; justify-content:center; padding:0; }
  .lien-panier { padding-inline:.68rem; }
  .entete-actions { gap:.45rem; }
}
@media (min-width:861px) and (max-width:1020px) {
  .entete > .conteneur { width:min(100% - 28px,1240px); }
  .entete-grille { position:relative; min-height:72px; grid-template-columns:minmax(0,1fr) auto auto; gap:.55rem; }
  .logo { min-width:0; max-width:100%; }
  .logo-texte { min-width:0; }
  .logo-embleme { width:37px; height:37px; }
  .logo-nom { font-size:1.22rem; }
  .logo-baseline { display:none; }
  .burger { width:42px; height:42px; display:inline-flex; flex-direction:column; justify-content:center; gap:5px; order:3; padding:0; border:1px solid var(--trait); border-radius:50%; background:#fff; cursor:pointer; }
  .burger span:not(.sr-only) { width:18px; height:1.5px; margin-inline:auto; background:var(--encre-forte); transition:transform .2s ease,opacity .2s ease; }
  .burger[aria-expanded="true"] span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
  .burger[aria-expanded="true"] span:nth-child(2) { opacity:0; }
  .burger[aria-expanded="true"] span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }
  .entete-actions { order:2; min-width:0; flex:none; }
  .recherche-entete, .lien-compte { display:none; }
  .panier-texte { display:none; }
  .lien-panier { width:42px; padding:0; justify-content:center; position:relative; }
  .lien-panier .pastille { position:absolute; right:-4px; top:-4px; min-width:18px; height:18px; border:2px solid #fff; font-size:.58rem; }
  .nav { position:absolute; left:0; right:0; top:100%; max-width:100vw; display:none; align-items:stretch; flex-direction:column; gap:0; padding:.8rem 14px 1.1rem; overflow-x:hidden; border-bottom:1px solid var(--trait); background:#fff; box-shadow:0 18px 35px rgba(25,32,28,.10); }
  .nav.ouverte { display:flex; }
  .nav > a, .nav summary { width:100%; display:block; padding:.72rem .25rem; }
  .nav > a::after, .nav summary::after { display:none; }
  .nav-deroulant { width:100%; }
  .nav-deroulant summary::before { float:right; margin-top:.4rem; }
  .nav-sous-menu { position:static; width:100%; padding:.2rem 0 .35rem .7rem; border:0; box-shadow:none; transform:none; }
  .nav-sous-menu a { padding:.55rem .6rem; }
  .nav-compte-mobile { display:block; }
  .recherche-mobile { display:grid; grid-template-columns:1fr auto; gap:.45rem; margin-top:.5rem; padding-top:.8rem; border-top:1px solid var(--trait); }
  .recherche-mobile input { min-width:0; min-height:42px; padding:.55rem .75rem; border:1px solid var(--trait); border-radius:9px; }
  .recherche-mobile button { border:0; border-radius:9px; background:var(--encre-forte); color:#fff; font-size:.76rem; font-weight:700; }
  body[data-public-theme] .nav { background:var(--theme-card); border-bottom-color:var(--theme-border); box-shadow:0 18px 35px var(--theme-shadow-soft); }
  body[data-public-theme] .burger { border-color:var(--theme-border); background:var(--theme-card); }
  body[data-public-theme] .burger span:not(.sr-only) { background:var(--theme-text); }
}