@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=EB+Garamond:ital,wght@0,400;0,500;1,400&family=Space+Mono:wght@400;700&display=swap");
/* =========================================================
   HENRI MEZZADRI — Charte "Noir · Blanc · Sang · Or"
   Thème enfant hummingbird-hmezzadri — Édition MMXXVI
   Port du design system statique vers le thème PrestaShop actif.
   ========================================================= */

/* Garde-fou : le custom.css de l'ancien thème (fond crème/bleu-doré, plein
   de !important) reste combiné dans le bundle et gagne sur nos couleurs.
   On réaffirme chaque fond explicitement, section par section (jamais de
   transparent générique : ça effacerait aussi nos propres fonds sombres). */
body,#index body{background-color:#F3EFE7 !important;color:#17130F !important;font-family:'EB Garamond',Perpetua,Georgia,serif !important}
.hero,.turn,.atelier,.contact{background-color:#17130F !important}
.manifesto,.works-home,.order,.product__infos{background-color:#F3EFE7 !important}
.card,.card__body,.works,.grid{background-color:transparent !important}
.header-top,.header-bottom,#header{background-color:transparent !important}
#footer,.foot,.footer__before{background-color:#211b16 !important;color:#F3EFE7 !important;font-family:'EB Garamond',Perpetua,Georgia,serif !important}
.foot *,.footer__before *{font-family:inherit}
.foot .foot__name{font-family:Perpetua,'Cormorant Garamond','EB Garamond',Georgia,serif !important;
  font-weight:400 !important;letter-spacing:.08em !important;text-transform:uppercase !important}

/* Voile sombre Bootstrap (.modal-backdrop) qui reste visible/coincé à
   l'ouverture des fiches produit (aperçu rapide, modales de personnalisation…) —
   retiré du site entier à la demande de l'atelier. */
.modal-backdrop{display:none !important}

/* Éléments hors charte à retirer : partage social, réseaux sociaux, adresse en pied de page */
.social-sharing,.block-social,.social{display:none !important}
.contact__infos,.contact__details .contact__item:first-of-type{display:none !important}
h1,h2,h3,.h2,.h3,.h4{font-family:'Cormorant Garamond',Perpetua,'EB Garamond',Georgia,serif !important;
  font-weight:600 !important;margin-bottom:0 !important;line-height:.98 !important;letter-spacing:-.01em !important}
/* L'ancien fichier forçait font-size:2rem !important sur tout h2/h3 : on reprend
   la main explicitement, taille par taille, pour chaque titre de la charte. */
.hero__title{font-size:clamp(2.8rem,6.6vw,6.6rem) !important}
.manifesto__title{font-size:clamp(2.8rem,6.2vw,5.2rem) !important}
.hero__copy{max-width:none}
.atelier__title{font-size:clamp(2.4rem,6.4vw,5.6rem) !important;font-style:italic}
.contact__title{font-size:clamp(1.4rem,4vw,3.5rem) !important}
.works__title{font-size:clamp(2.6rem,6vw,5rem) !important}
.pinfo__title,.product__name{font-size:clamp(2rem,4.2vw,3.4rem) !important}
.card__row h3{font-size:1.5rem !important;margin-bottom:0 !important}
.btn-primary,.btn-outline-primary,.form-check-input:checked{
  background-color:#7C1517 !important;border-color:#7C1517 !important;color:#F3EFE7 !important}
.btn-primary:hover,.btn-outline-primary:hover{background-color:#17130F !important;border-color:#17130F !important}
.all-product-link,.all-product-link:hover{background-color:transparent !important;border-color:#17130F !important;color:#17130F !important}

/* iOS/Safari adapte automatiquement les contrôles natifs (menus <select>,
   dropdowns, sélecteurs de date) aux couleurs du Dark Mode du téléphone,
   indépendamment du design de la page — d'où le texte gris foncé illisible
   sur iPhone en mode sombre alors que le site reste en charte claire.
   color-scheme:light force ces contrôles à toujours utiliser la palette
   claire du système, cohérente avec le fond papier du site. */
:root{color-scheme:light}

:root{
  /* Palette charte */
  --encre:#17130F;      /* Noir de presse */
  --encre-2:#211b16;
  --papier:#F3EFE7;     /* Blanc cassé */
  --papier-2:#E9E3D6;
  --sang:#7C1517;       /* Accent / titres */
  --sang-2:#9a1c1e;
  --or:#A98A50;         /* Rare / filets */
  --acier:#737C87;      /* Pierre / neutre */

  --ink-soft:rgba(23,19,15,.62);
  --paper-soft:rgba(243,239,231,.60);
  --paper-fade:rgba(243,239,231,.28);

  --border-light:rgba(23,19,15,.18);
  --border-dark:rgba(243,239,231,.18);

  --serif:'Cormorant Garamond', Perpetua, 'EB Garamond', Georgia, serif;
  --body:'EB Garamond', Perpetua, Georgia, serif;
  --mono:'Space Mono', ui-monospace, monospace;

  --maxw:1360px;
  --gutter:clamp(20px, 6vw, 96px);
  --ease:cubic-bezier(.19,1,.22,1);
  --ease-out:cubic-bezier(.16,.84,.44,1);

  --duo-pierre:grayscale(1) contrast(1.08) brightness(.95) sepia(.06);
  --duo-sang:grayscale(1) sepia(.4) hue-rotate(-46deg) saturate(2.6) brightness(.82) contrast(1.12);
  --duo-none:grayscale(0) contrast(1.02) brightness(1) sepia(0);
}

/* ---------- Base ---------- */
/* Filet de sécurité responsive : sans box-sizing:border-box, tout élément
   cumulant une largeur (100%, var(--maxw)…) et un padding/border déborde
   de son conteneur d'exactement ce padding — la cause la plus fréquente
   des débordements horizontaux qui n'apparaissent qu'à certaines tailles
   d'écran. Bootstrap le pose déjà côté PrestaShop, mais on le réaffirme
   ici pour ne pas en dépendre (et pour rester correct isolément). */
*,*::before,*::after{box-sizing:border-box}
/* overflow-x est déclaré UNIQUEMENT sur body (jamais sur html) : dès que
   les deux définissent un overflow, body cesse de propager le sien à la
   fenêtre et devient lui-même une boîte de scroll interne non bornée au
   viewport — cela casse position:sticky pour tous ses descendants
   (dont .turn__sticky de la section #bonaparte, qui ne s'épingle plus
   et défile comme un bloc mort sur toute sa hauteur). */
html{max-width:100%}
body{
  font-family:var(--body);
  background:var(--papier);
  color:var(--encre);
  line-height:1.48;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;max-width:100%;
}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;letter-spacing:-.01em}
::selection{background:var(--sang);color:var(--papier)}

.mono{font-family:var(--mono);font-size:.76rem;letter-spacing:.28em;text-transform:uppercase;font-weight:400}

/* =========================================================
   Textures globales — grain argentique + poussière/pli
   ========================================================= */
.grain{
  position:fixed;top:-60vh;left:-60vw;width:220vw;height:220vh;z-index:9000;pointer-events:none;
  background-image:url("../textures/grain.png");
  background-size:256px 256px;
  opacity:.075;mix-blend-mode:soft-light;
  animation:grain 7s steps(6) infinite;
}
@keyframes grain{
  0%{transform:translate(0,0)} 10%{transform:translate(-4%,-4%)}
  30%{transform:translate(3%,-2%)} 50%{transform:translate(-2%,3%)}
  70%{transform:translate(4%,2%)} 90%{transform:translate(-3%,4%)} 100%{transform:translate(0,0)}
}
.vignette{
  position:fixed;inset:0;z-index:8999;pointer-events:none;
  box-shadow:inset 0 0 220px 40px rgba(23,19,15,.14);
}
.grain-strong{position:relative}
.grain-strong::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background-image:url("../textures/grain.png");
  background-size:230px 230px;
  opacity:.19;mix-blend-mode:soft-light;
  animation:grain 8s steps(6) infinite reverse;
}
.paper-tex{position:relative}
.paper-tex::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(115deg, rgba(23,19,15,.035), transparent 40%, rgba(23,19,15,.02) 70%, rgba(23,19,15,.05)),
    url("../textures/speckle.png");
  background-size:cover, 256px 256px;
  background-blend-mode:normal, multiply;
  opacity:.7;
}
.paper-tex > *{position:relative;z-index:1}

/* =========================================================
   Préchargeur
   ========================================================= */
.preloader{
  position:fixed;inset:0;z-index:9999;background:var(--encre);color:var(--papier);
  display:grid;place-items:center;transition:opacity .8s var(--ease), visibility .8s;
  overflow:hidden;
}
.preloader.is-done{opacity:0;visibility:hidden}
.preloader__grain{position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:url("../textures/grain.png");background-size:230px 230px;
  opacity:.19;mix-blend-mode:soft-light;animation:grain 7s steps(6) infinite}
.preloader__inner{position:relative;z-index:1;text-align:center;width:min(92vw,560px)}
.preloader__logo{width:min(92vw,473px);height:auto;margin:0 auto 26px;opacity:0;
  animation:markIn 1s var(--ease) .1s both}
@keyframes markIn{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
.preloader__rule{display:block;width:0;height:2px;margin:0 auto 22px;background:var(--sang);
  animation:ruleIn .7s var(--ease) .5s forwards}
@keyframes ruleIn{to{width:74px}}
.preloader__tagline{font-family:var(--serif);font-style:italic;font-weight:500;
  font-size:clamp(.95rem,1.8vw,1.28rem);color:var(--paper-soft);margin:0 auto 16px;max-width:38ch;white-space:nowrap;
  opacity:0;transform:translateY(10px);animation:fadeUp .8s var(--ease) .75s forwards}
.preloader__role{color:var(--paper-fade);margin:0 auto 34px;
  opacity:0;transform:translateY(10px);animation:fadeUp .8s var(--ease) .95s forwards}
.preloader__meta{font-family:var(--mono);font-size:.6rem;letter-spacing:.3em;opacity:.5;
  opacity:0;transform:translateY(10px);animation:fadeUp .8s var(--ease) .95s forwards}
@keyframes fadeUp{to{opacity:1;transform:none}}
.preloader__bar{height:1px;width:min(60vw,260px);margin:14px auto;background:rgba(243,239,231,.22);overflow:hidden}
.preloader__bar i{display:block;height:100%;width:0;background:var(--sang);animation:load 1.5s var(--ease) 1.1s forwards}
@keyframes load{to{width:100%}}

/* =========================================================
   Curseur
   ========================================================= */
.cursor{position:fixed;top:0;left:0;z-index:9500;pointer-events:none;
  width:9px;height:9px;border-radius:50%;background:var(--sang);
  transform:translate(-50%,-50%);transition:width .3s var(--ease),height .3s var(--ease),background .3s;mix-blend-mode:normal}
.cursor.is-hover{width:64px;height:64px;background:rgba(124,21,23,.12);border:1px solid var(--sang)}
.cursor__label{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--mono);
  font-size:.5rem;letter-spacing:.18em;text-transform:uppercase;color:var(--sang);opacity:0;transition:opacity .25s}
.cursor.is-hover .cursor__label{opacity:1}
@media (hover:none){.cursor{display:none}}

/* =========================================================
   Navigation (surcharge complète du header.tpl)
   ========================================================= */
#header{background:transparent;box-shadow:none}
#nav{
  position:fixed;top:0;left:0;width:100%;z-index:900;
  display:flex;align-items:center;justify-content:space-between;
  padding:20px var(--gutter);
  color:var(--papier);
  transition:transform .5s var(--ease),background .4s,color .4s,padding .4s;
}
#nav.is-solid{background:rgba(23,19,15,.86);backdrop-filter:blur(9px);
  color:var(--papier);padding-top:14px;padding-bottom:14px;border-bottom:1px solid rgba(243,239,231,.1)}
.nav__brand{display:flex;align-items:center;gap:12px}
.nav__logo{height:34px;width:auto;transition:height .4s var(--ease)}
#nav.is-solid .nav__logo{height:30px}
.nav__right{display:flex;align-items:center;gap:20px;flex-wrap:nowrap}
.nav__links{display:flex;gap:28px;align-items:center}
.nav__links a,.nav__links a:hover,.nav__links a:focus{font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;position:relative;padding:6px 0;
  color:var(--papier) !important;text-decoration:none !important}
/* text-decoration n'est pas une propriété "sûre" pour :visited (restriction
   navigateur anti-fingerprinting de l'historique) : groupée avec les autres
   états ci-dessus, elle pouvait être ignorée pour un lien visité. Règle
   séparée, couleur seule. */
.nav__links a:visited{color:var(--papier) !important}
.nav__links a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:currentColor;transition:width .4s var(--ease)}
.nav__links a:hover::after{width:100%}
.nav__links a.is-accent,.nav__links a.is-accent:hover,.nav__links a.is-accent:visited{color:var(--sang-2) !important}
.nav__cta{font-size:.68rem;letter-spacing:.14em;color:var(--papier) !important;background:var(--sang);
  border:1px solid var(--sang);padding:10px 20px;white-space:nowrap;position:relative;overflow:hidden;
  transition:color .4s var(--ease);display:inline-flex;align-items:center;gap:6px}
.nav__cta::before{content:"";position:absolute;inset:0;background:var(--encre);transform:scaleY(0);
  transform-origin:bottom;transition:transform .4s var(--ease);z-index:-1}
.nav__cta:hover::before{transform:scaleY(1)}
.nav__burger{display:none;flex-direction:column;gap:6px;width:34px;height:34px;align-items:center;justify-content:center;background:none;border:none;color:inherit;cursor:pointer}
.nav__burger span{width:24px;height:1.5px;background:currentColor;transition:.4s var(--ease)}
#nav.is-open .nav__burger span:first-child{transform:translateY(3.75px) rotate(45deg)}
#nav.is-open .nav__burger span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
.nav__blocks{display:flex;align-items:center;gap:16px}
.nav__blocks .header-block{display:flex;align-items:center}
.nav__blocks .header-block__action-btn{color:inherit;display:inline-flex;align-items:center;gap:4px;text-decoration:none}
.nav__blocks .material-icons{font-size:20px}

/* Comptes / panier / contact — intégrés dans la même barre nav, jamais de bloc à part */
.nav__blocks{display:flex;align-items:center;gap:18px;font-size:.66rem;letter-spacing:.1em}
.nav__blocks a,.nav__blocks button,.nav__blocks span,.nav__blocks i,.nav__blocks .material-icons{color:var(--papier) !important;text-decoration:none}
.nav__blocks a:hover,.nav__blocks a:hover .material-icons{color:var(--sang-2) !important}
.nav__blocks .material-icons{font-size:18px}
/* Bloc panier du header retiré : le CTA « Commander » fait déjà office de panier */
.nav__blocks .blockcart,.nav__blocks .blockcart.cart-preview,#_desktop_cart{display:none !important}
.nav__blocks-item--contact{display:none}
@media (min-width:1200px){.nav__blocks-item--contact{display:flex}}
.nav__blocks-item{display:flex;align-items:center;gap:14px}
.nav__blocks .header-block__badge{background:var(--sang) !important;color:var(--papier) !important;
  border-radius:50%;font-family:var(--mono);font-size:.6rem;min-width:16px;height:16px;
  display:inline-flex;align-items:center;justify-content:center;padding:0 3px}

/* Version compacte pour la nav : icônes seules (connexion/panier), tout le reste masqué */
.nav__blocks--compact{gap:14px}
.nav__blocks--compact .header-block__title,
.nav__blocks--compact #_desktop_currency_selector,
.nav__blocks--compact .currency-selector__wrapper{display:none !important}
.nav__blocks--compact .material-icons{font-size:19px}
.nav__blocks #currency-selector,.nav__blocks .form-select{
  background-color:transparent !important;color:var(--paper-soft) !important;border:1px solid rgba(243,239,231,.24) !important;
  font-family:var(--mono) !important;font-size:.62rem !important;letter-spacing:.1em;padding:4px 22px 4px 8px !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23F3EFE7'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E") !important}
/* Barre de recherche : hors charte, retirée de la nav */
#search_widget,#_desktop_search,.search__mobile,#searchCanvas{display:none !important}
.search-widgets__dropdown{background:var(--encre) !important;border:1px solid rgba(243,239,231,.14) !important}
.search-widgets__results{color:var(--paper-soft)}

/* Newsletter (footer) — charte sombre, on retire le petit graphisme "main" hérité de l'ancien site */
.email-subscription{background:var(--encre-2) !important;color:var(--paper-soft);padding:34px var(--gutter) !important}
.email-subscription .hand-title img.hand{display:none}
.email-subscription__label{font-family:var(--serif);font-style:italic;font-size:1.3rem;color:var(--papier);margin:0}
.email-subscription__content__inputs{display:flex;gap:10px;flex-wrap:wrap}
.email-subscription .form-control{background:transparent !important;border:1px solid rgba(243,239,231,.24) !important;
  color:var(--papier) !important;font-family:var(--body);padding:12px 14px;flex:1;min-width:200px}
.email-subscription .form-control::placeholder{color:var(--paper-fade)}
.email-subscription__content__infos{color:var(--paper-fade);font-size:.68rem;margin-top:10px;max-width:60ch}

.menu{position:fixed;inset:0;z-index:850;background:var(--encre);color:var(--papier);
  display:flex;flex-direction:column;justify-content:center;padding:0 var(--gutter);
  clip-path:inset(0 0 100% 0);transition:clip-path .7s var(--ease);visibility:hidden}
.menu.is-open{clip-path:inset(0 0 0 0);visibility:visible}
.menu__links{display:flex;flex-direction:column;gap:6px}
/* opacity:.4 au repos rendait le blanc quasi gris sur fond encre (lisible
   mais pas "blanc") ; et seul :hover était couvert -> :active/:visited
   retombaient sur le bleu par défaut du navigateur au clic. */
.menu__links a{font-family:var(--serif);font-size:clamp(2.2rem,10vw,4rem);line-height:1.02;display:flex;align-items:baseline;gap:18px;
  opacity:.92;transition:opacity .3s,color .3s,transform .5s var(--ease);transform:translateY(20px);
  color:var(--papier) !important}
.menu.is-open .menu__links a{transform:none}
.menu__links a em{font-family:var(--mono);font-size:.8rem;letter-spacing:.2em;color:var(--sang-2);font-style:normal}
.menu__links a:hover,.menu__links a:focus,.menu__links a:active,.menu__links a:visited{
  opacity:1;color:var(--sang-2) !important;
}
.menu__links a:hover em,.menu__links a:focus em,.menu__links a:active em{color:var(--papier)}
.menu__foot{position:absolute;bottom:34px;left:var(--gutter);right:var(--gutter);
  display:flex;justify-content:space-between;font-family:var(--mono);font-size:.62rem;letter-spacing:.2em;color:var(--paper-soft)}

/* Le commentaire historique ci-dessous supposait que ps_mainmenu gérait son
   propre repli mobile — ce thème utilise son propre burger (#burger/.menu,
   piloté par charte-v12.js), jamais activé faute de contrepartie responsive :
   .nav__burger restait display:none à toutes les tailles, .nav__links (Œuvres/
   Atelier/Contact) restait affiché en ligne et débordait/se chevauchait sur
   mobile — le menu plein écran existait mais était inaccessible. */
@media (max-width:900px){
  .nav__blocks .d-md-inline{display:none}
}
#nav{flex-wrap:nowrap !important}
@media (max-width:760px){
  .nav__links{display:none !important}
  .nav__burger{display:flex !important}
}

/* =========================================================
   Éléments communs
   ========================================================= */
.kicker{font-family:var(--mono);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:12px;color:var(--sang)}
.kicker--light{color:var(--sang-2)}
.kicker__dot{width:7px;height:7px;background:currentColor;border-radius:50%;box-shadow:0 0 0 4px rgba(124,21,23,.14)}

.btn,a.btn,button.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.72rem;
  letter-spacing:.16em;text-transform:uppercase;padding:16px 28px;border:1px solid currentColor;
  position:relative;overflow:hidden;transition:color .45s var(--ease);isolation:isolate;background:none;color:var(--encre);text-decoration:none}
.btn::before{content:"";position:absolute;inset:0;background:currentColor;transform:scaleY(0);transform-origin:bottom;
  transition:transform .45s var(--ease);z-index:-1}
.btn:hover::before{transform:scaleY(1)}
.btn--solid,a.btn--solid,.btn--solid:visited{background:var(--sang) !important;border-color:var(--sang) !important;color:var(--papier) !important}
.btn--solid::before{background:var(--encre)}
.btn--solid:hover,a.btn--solid:hover{color:var(--papier) !important}
.btn--ghost,a.btn--ghost{color:var(--encre) !important}
.btn--ghost:hover,a.btn--ghost:hover{color:var(--papier) !important}
.btn--ghost::before{background:var(--encre)}
/* .contact est toujours en fond sombre (encre) : un .btn--ghost y reprend
   la même variante claire que .hero__actions/.turn__panel-actions, sinon
   texte encre sur fond encre = invisible ("Voir les autres œuvres"). */
.contact .btn--ghost,.contact a.btn--ghost{color:var(--papier) !important}
.contact .btn--ghost::before{background:var(--papier)}
.contact .btn--ghost:hover,.contact a.btn--ghost:hover{color:var(--encre) !important}

.section-head{display:flex;justify-content:space-between;align-items:center;
  padding:26px var(--gutter);border-bottom:1px solid var(--border-light);color:var(--ink-soft)}
.section-head__idx{color:var(--sang)}
.section-head--light{color:var(--paper-soft);border-color:var(--border-dark)}
.section-head--light .section-head__idx{color:var(--acier)}

.reveal{opacity:0}
[data-rise]{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
[data-rise].is-in{opacity:1;transform:none}
[data-rise][data-d="1"]{transition-delay:.06s}
[data-rise][data-d="2"]{transition-delay:.16s}
[data-rise][data-d="3"]{transition-delay:.26s}
[data-rise][data-d="4"]{transition-delay:.36s}

.on-dark{filter:invert(1) brightness(1.9)}

/* =========================================================
   Pied (surcharge complète du footer.tpl)
   ========================================================= */
#footer{background:var(--encre-2)}
.foot{background:var(--encre-2);color:var(--papier);border-top:1px solid var(--border-dark)}
.foot__top{max-width:var(--maxw);margin:0 auto;padding:clamp(50px,6vw,80px) var(--gutter) 40px;
  display:grid;grid-template-columns:1.3fr 1.7fr;gap:50px}
.foot__brand .foot__mark-img{height:52px;width:auto;margin-bottom:16px}
.foot__name{font-family:Perpetua,'Cormorant Garamond','EB Garamond',Georgia,serif;
  font-size:1.6rem;font-weight:400;letter-spacing:.08em;text-transform:uppercase;display:block}
.foot__tag{color:var(--paper-fade);margin-top:12px}
.foot__nav{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}
.foot__nav div{display:flex;flex-direction:column;gap:12px}
.foot__nav .foot__h{color:var(--acier);margin-bottom:6px;display:block}
.foot__nav a{color:var(--paper-soft);transition:color .3s;font-size:1.02rem;width:fit-content;position:relative;display:block;text-decoration:none}
.foot__nav a:hover{color:var(--papier)}
@media (max-width:1024px){.foot__top{grid-template-columns:1fr}}
.foot__bar{max-width:var(--maxw);margin:0 auto;padding:22px var(--gutter);display:flex;justify-content:space-between;
  align-items:center;border-top:1px solid var(--border-dark);color:var(--paper-fade);flex-wrap:wrap;gap:10px}
.foot__bar .copyright{color:var(--paper-fade);display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.foot__bar .copyright-signature{height:20px;width:auto;filter:invert(1) brightness(1.9)}
.footer__before{background:var(--encre);color:var(--paper-soft);border-bottom:1px solid var(--border-dark)}
.footer__before .container{max-width:var(--maxw);padding:26px var(--gutter)}

.totop{position:fixed;right:24px;bottom:24px;z-index:800;width:48px;height:48px;border-radius:50%;
  background:var(--sang);color:var(--papier);display:grid;place-items:center;font-size:1.1rem;
  opacity:0;transform:translateY(20px) scale(.8);transition:.5s var(--ease);pointer-events:none;
  box-shadow:0 12px 30px -8px rgba(124,21,23,.6);text-decoration:none}
.totop.is-show{opacity:1;transform:none;pointer-events:auto}
.totop:hover{background:var(--encre)}

/* =========================================================
   Page produit — habillage charte de la fiche PrestaShop réelle
   ========================================================= */
body#product{background:var(--papier)}

/* Fil d'ariane natif -> look .pcrumb */
.breadcrumb__wrapper{background:var(--encre);padding:110px 0 0;margin-bottom:0 !important}
.breadcrumb__wrapper .container{max-width:var(--maxw);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:10px;color:var(--paper-fade);
  font-size:.62rem;letter-spacing:.16em;font-family:var(--mono);text-transform:uppercase;list-style:none;padding:0 0 20px;margin:0}
.breadcrumb-item{display:flex;align-items:center;gap:10px}
.breadcrumb-item:not(:last-child)::after{content:"/"}
.breadcrumb-link{color:var(--paper-soft);transition:color .3s;text-decoration:none}
.breadcrumb-link:hover{color:var(--papier)}
.breadcrumb-item:last-child{color:var(--sang-2)}

/* Bloc héro produit : fond encre, grille image/infos */
.product.js-product-container{
  background:var(--encre);color:var(--papier);
  max-width:var(--maxw);margin:0 auto;
  padding:36px var(--gutter) clamp(60px,8vw,110px);
}
.product__left{position:relative}
.product__images{aspect-ratio:3/4;overflow:hidden;background:var(--encre-2)}
.product__images .carousel-item img{width:100%;height:100%;object-fit:cover;object-position:top center}

/* Galerie épurée, comme le site de référence : pas de flèches, pas de loupe, pas de badge */
.product__images .carousel-control-prev,.product__images .carousel-control-next{display:none !important}
.product__images__modal-opener{display:none !important}
.product-flags{display:none !important}
.thumbnails__container{margin-top:14px}
.thumbnails__list{list-style:none;display:flex;gap:10px;flex-wrap:wrap;padding:0;margin:0}
.thumbnail{width:60px;height:60px;padding:0;border:1px solid var(--border-dark);
  cursor:pointer;overflow:hidden;opacity:.55;transition:opacity .3s,border-color .3s;list-style:none}
.thumbnail img{width:100%;height:100%;object-fit:cover}
.thumbnail:hover{opacity:.85}
.thumbnail.active{opacity:1;border-color:var(--sang-2)}

.product__col{padding-top:6px}
.product__name{font-family:var(--serif);font-size:clamp(2rem,4.2vw,3.4rem);font-weight:600;
  line-height:1.08;margin:0 0 18px;color:var(--papier)}
.product__description-short{font-family:var(--serif);font-style:italic;font-size:1.18rem;line-height:1.5;
  color:var(--paper-soft);max-width:46ch;margin-bottom:20px}

.product__prices{margin:20px 0}
.product__current-price{font-family:var(--mono);font-weight:700;font-size:2rem;color:var(--sang-2)}
.product__price-regular{color:var(--paper-fade);text-decoration:line-through;font-size:1rem}
.product__tax-info,.product__tax-label{color:var(--paper-fade);font-size:.62rem;letter-spacing:.1em}
.product__discount-percentage,.product__discount-amount{color:var(--or);font-size:.8rem}

/* Sélecteur de variantes (matière, taille…) -> look .pmaterial */
.product__variants .variant{margin-top:22px}
.product__variants .form-label{font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--paper-fade);margin-bottom:10px;display:block}
.product__variants .radio-variants,.product__variants .color-variants{display:flex;gap:12px;flex-wrap:wrap;list-style:none;padding:0;margin:0}
.product__variants .radio-variant,.product__variants .color-variant{list-style:none}
.product__variants .radio-variant label{display:flex;flex-direction:column;gap:6px;padding:12px 20px;
  border:1px solid rgba(243,239,231,.22);color:var(--paper-soft);cursor:pointer;font-family:var(--body);font-size:.95rem;
  transition:border-color .3s,background .3s,color .3s}
.product__variants .input-radio:checked + .radio-label,
.product__variants label:has(.input-radio:checked){border-color:var(--sang-2);background:rgba(124,21,23,.14);color:var(--papier)}
.product__variants .input-radio{position:absolute;opacity:0;pointer-events:none}
.product__variants .form-select{background-color:var(--encre-2);color:var(--papier);border:1px solid rgba(243,239,231,.22);
  font-family:var(--body);padding:10px 14px}

.product__specs,.pspecs{display:flex;gap:10px;flex-wrap:wrap;margin:24px 0 0;color:var(--paper-fade);font-size:.6rem;list-style:none;padding:0}
.product__specs li,.pspecs li{border:1px solid rgba(243,239,231,.16);padding:7px 12px}

/* Disponibilité / stock réel */
.product__availability{color:var(--paper-soft);font-size:.86rem;gap:8px}
.product-available{color:#7fae7f !important}
.product-unavailable{color:var(--sang-2) !important}
.product-last-items{color:var(--or) !important}
.product__delivery__information{color:var(--paper-fade);font-size:.78rem;display:block;margin-top:6px}

/* Bloc actions / ajout panier */
.product__add-to-cart{margin-top:26px}
.quantity-button .form-control{background:var(--encre-2);border:1px solid rgba(243,239,231,.22);color:var(--papier);width:70px;text-align:center}
.add-to-cart,button.add-to-cart{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.72rem;
  letter-spacing:.16em;text-transform:uppercase;padding:16px 28px;border:1px solid var(--sang);
  background:var(--sang);color:var(--papier);position:relative;overflow:hidden;transition:background .35s var(--ease)}
.add-to-cart:hover{background:var(--encre);border-color:var(--encre)}
.product__minimal-quantity{color:var(--paper-fade);font-size:.72rem;margin-top:10px}

/* Alma (paiement en plusieurs fois) — le widget définit lui-même ses couleurs via
   --off-black, non fournie par PrestaShop : sans elle son logo restait invisible.
   Gris clair pour rester lisible sur le fond sombre de la fiche produit. */
.alma-payment-plans-container{
  --off-black: #C9C4B6;
  margin-top:18px;padding:16px 18px;border:1px solid rgba(243,239,231,.16);
  background:rgba(243,239,231,.05);border-radius:2px;font-family:var(--body) !important;color:var(--paper-soft)}
.alma-payment-plans-container p{color:var(--paper-soft) !important;font-size:.82rem !important}
.alma-payment-plans-eligibility-options{background:rgba(243,239,231,.06);border-radius:20px;padding:3px}
.alma-payment-plans-active-option{background:var(--sang) !important;color:var(--papier) !important;border-radius:16px !important}

/* Logos de paiement (PayPal, cartes) — le module ps_checkout injecte lui-
   même un <style> inline qui définit .paypal-mark (la plaque blanche
   contenant chaque logo réel, chargé depuis paypalobjects.com — pas une
   image blanche, un vrai logo PayPal couleur sur fond blanc, très
   correctement conçu par PayPal). Une ancienne règle à nous utilisait
   accidentellement ce même nom de classe pour un usage totalement
   différent (padding/margin d'un conteneur qu'on croyait à nous), et une
   tentative précédente forçait un fond sombre directement sur les <img> —
   les deux entraient en collision avec le style de PayPal et cassaient
   l'affichage (fond noir superposé au logo à l'intérieur de sa propre
   plaque blanche). On ne combat plus le composant : on l'habille juste
   (coins carrés, bordure charte), sans toucher à son fond ni son padding
   internes dont le logo a besoin pour rester lisible. */
#ps_checkout-payment-method-logos-container{
  display:flex !important;align-items:center;justify-content:center;gap:10px;
  padding:0;background:transparent;border:none;margin:0 auto;width:100%;flex-wrap:wrap;
}
.paypal-mark{
  border-radius:0 !important;border-color:var(--border-light) !important;
}
#ps_checkout-payment-method-logo-block-container{
  margin-top:14px;text-align:center;
}
/* Logos personnalisés fournis par l'atelier, en remplacement des visuels
   réels du module (impossible à éditer via un template — rendu en JS par
   le SDK PayPal). Portée volontairement NON limitée à
   #ps_checkout-payment-method-logos-container : le module réutilise les
   mêmes classes .paypal-mark / img.cards-logo à l'étape Paiement du
   tunnel de commande (dans .payment__option .ps_checkout-mark), en
   dehors de ce conteneur — d'où les logos d'origine qui réapparaissaient
   sur /commande malgré le premier correctif. background-image sur
   .paypal-mark (ciblé via :has(), rendu fiable) pour PayPal/Pay Later ;
   content:url() pour les 4 icônes carte qui partagent une même plaque
   (chaque <img> doit rester individuellement remplaçable). */
.paypal-mark:has(img.paypal-logo-paypal){
  background-image:url("../img/payment/paypal.png") !important;
  background-repeat:no-repeat;background-position:center;background-size:contain;
  width:100px;height:34px;padding:0 !important;
}
.paypal-mark:has(img.paypal-logo-paypal) img{
  visibility:hidden;
}
.paypal-mark:has(img.paypal-logo-pp){
  background-image:url("../img/payment/paypal-4x.png") !important;
  background-repeat:no-repeat;background-position:center;background-size:contain;
  width:110px;height:66px;padding:0 !important;
}
.paypal-mark:has(img.paypal-logo-pp) img,
.paypal-mark:has(img.paypal-logo-pp) .paypal-button-text{
  visibility:hidden;
}
img.cards-logo[alt="MASTERCARD"]{
  content:url("../img/payment/mastercard.png") !important;height:30px !important;width:auto !important;
}
img.cards-logo[alt="VISA"]{
  content:url("../img/payment/visa.png") !important;height:30px !important;width:auto !important;
}
img.cards-logo[alt="AMEX"]{
  content:url("../img/payment/amex.png") !important;height:30px !important;width:auto !important;
}
img.cards-logo[alt="CB_NATIONALE"]{
  content:url("../img/payment/gb.png") !important;height:30px !important;width:auto !important;
}

/* Réassurance (livraison / paiement sécurisé / poids) — colonne verticale
   à droite des informations produit (3e colonne de .phero__grid), plutôt
   qu'une bande horizontale sous la fiche. Le module écrit des styles
   inline (color:#262627) : !important requis. */
.phero__reassurance{
  padding-left:clamp(24px,3vw,36px);border-left:1px solid rgba(243,239,231,.14);
  align-self:start;
}
.phero__reassurance .blockreassurance_product{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(24px,3vw,34px)}
.phero__reassurance .blockreassurance_product > div{display:flex;flex-direction:column;align-items:flex-start;
  text-align:left;max-width:220px;gap:4px;cursor:pointer}
.phero__reassurance .item-product{display:flex;justify-content:flex-start}
.phero__reassurance .item-product svg{width:30px !important;height:30px !important;filter:invert(1) brightness(1.6)}
.phero__reassurance .block-title{font-family:'Cormorant Garamond',Perpetua,'EB Garamond',Georgia,serif !important;
  font-weight:600 !important;font-size:1.02rem !important;color:var(--papier) !important;display:block}
.phero__reassurance p{color:var(--paper-soft) !important;font-size:.8rem !important;margin:0 !important}
@media (max-width:1200px){
  .phero__grid{grid-template-columns:1fr}
  .phero__reassurance{
    grid-column:auto;border-left:none;padding-left:0;margin-top:clamp(30px,5vw,54px);padding-top:clamp(24px,4vw,36px);
    border-top:1px solid rgba(243,239,231,.14);
  }
  .phero__reassurance .blockreassurance_product{flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center}
  .phero__reassurance .blockreassurance_product > div{align-items:center;text-align:center}
  .phero__reassurance .item-product{justify-content:center}
}

/* Partage social — retiré de la fiche produit */
.social-sharing{display:none !important}

/* Sélecteur de quantité et mention de délai — retirés à la demande */
.quantity-button,.js-quantity-button{display:none !important}
.product__delivery__information{display:none !important}

/* Bouton liste de souhaits — retiré de la fiche produit */
.wishlist-button-add.wishlist-button-product{display:none !important}
/* Bouton liste de souhaits sur les vignettes produit (panier, home) — retiré, hors charte */
.wishlist-button-add{display:none !important}

/* Bloc newsletter — retiré de l'accueil */
.email-subscription{display:none !important}

/* Bloc contact/adresse — retiré du pied de page (accueil + fiche produit) */
.footer__block.block-contact{display:none !important}

/* =========================================================
   Pop-up d'ajout au panier — tiroir latéral, même esthétique que
   l'aside .cartdrawer__panel du site de référence (fond encre, plein
   hauteur, glissement depuis la droite) plutôt qu'une modale Bootstrap
   centrée. On ne touche qu'à la présentation (transform/position) :
   le module ps_shoppingcart et son JS (ouverture/fermeture Bootstrap)
   restent intacts.
   ========================================================= */
.blockcart-modal.modal{padding:0 !important}
.blockcart-modal .modal-dialog{
  position:fixed !important;top:0;right:0;bottom:0;left:auto;margin:0 !important;
  width:min(420px,100%);max-width:100%;height:100vh;max-height:100vh;
  transform:translateX(100%) !important;transition:transform .5s var(--ease) !important;
}
.blockcart-modal.show .modal-dialog{transform:translateX(0) !important}
.blockcart-modal .modal-content{
  height:100%;background:var(--encre) !important;color:var(--papier) !important;
  border:none !important;border-radius:0 !important;border-left:1px solid var(--border-dark) !important;
  box-shadow:-20px 0 60px -20px rgba(0,0,0,.6) !important;display:flex;flex-direction:column;
}
.blockcart-modal .modal-header{
  border-bottom:1px solid var(--border-dark) !important;padding:22px var(--gutter) !important;
  align-items:center;flex:0 0 auto;
}
.blockcart-modal .modal-title,.blockcart-modal .modal-title.h4{
  font-family:var(--mono) !important;font-weight:400 !important;font-size:.72rem !important;
  letter-spacing:.18em;text-transform:uppercase;
  color:var(--papier) !important;display:flex;align-items:center;gap:10px}
.blockcart-modal .modal-title .material-icons{color:var(--sang-2) !important;font-size:18px}
.blockcart-modal .btn-close{
  filter:invert(1) brightness(1.7) !important;opacity:.6 !important;transition:opacity .3s}
.blockcart-modal .btn-close:hover{opacity:1 !important}
.blockcart-modal .modal-body{padding:6px var(--gutter) !important;flex:1 1 auto;overflow-y:auto}
.blockcart-modal .modal-body .row{margin:0}
.blockcart-modal .modal-body .col-md-7,.blockcart-modal .modal-body .col-md-5{
  padding:0;max-width:100%;flex:0 0 100%;
}
.blockcart-modal .blockcart-modal__product{padding-top:20px}
.blockcart-modal .product-image{border:1px solid var(--border-dark)}
.blockcart-modal .product-name{
  font-family:var(--serif) !important;font-size:1.1rem !important;font-weight:600 !important;color:var(--papier) !important}
.blockcart-modal .product-price{
  font-family:var(--mono) !important;color:var(--sang-2) !important;font-weight:700 !important}
.blockcart-modal .product-quantity{color:var(--paper-soft) !important;font-size:.9rem}
.blockcart-modal__summery{
  border-left:none !important;padding-left:0 !important;
  border-top:1px solid var(--border-dark);margin-top:20px;padding-top:20px;
}
.blockcart-modal__summery > p{color:var(--paper-soft) !important;font-size:.92rem}
.blockcart-modal__total{display:flex;justify-content:space-between;gap:16px;margin-bottom:8px;color:var(--paper-soft)}
.blockcart-modal__total .label{color:var(--paper-fade) !important;font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
.blockcart-modal__total .value{color:var(--papier) !important;font-family:var(--mono);font-weight:700}
.blockcart-modal .modal-footer{
  flex:0 0 auto;border-top:1px solid var(--border-dark) !important;padding:20px var(--gutter) 26px !important;
  margin:0;background:var(--encre);
}
.blockcart-modal .cart-footer-actions{gap:12px}
.blockcart-modal .cart-footer-actions .btn{
  width:100% !important;margin:0 !important;justify-content:center;font-family:var(--mono) !important;
  font-size:.7rem !important;letter-spacing:.12em;border-radius:0 !important;
}

/* =========================================================
   Page panier — reprise à l'identique de ".cartpage grain-strong" du
   site vitrine (hmezzadri-site/cart.html). Le conteneur .cartpage porte
   maintenant le fond/texture/padding (au lieu de #content-wrapper),
   exactement comme sur la page de référence. Les valeurs ci-dessous
   (tailles, espacements, couleurs) sont recopiées depuis styles.css du
   site vitrine, seuls les sélecteurs changent pour viser les vraies
   classes PrestaShop (.cart-grid, .product-line, .cart-summary…).
   ========================================================= */
body#cart .logo-top-page{display:none !important}
body#cart #wrapper,body#cart #content-wrapper{padding:0;margin:0;max-width:none}
body#cart .container{max-width:none;padding:0}
body#cart .cartpage{position:relative;background:var(--encre);color:var(--papier);min-height:80vh;overflow:hidden}
body#cart .cartpage::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background-image:url("../textures/grain.png");background-size:230px 230px;
  opacity:.19;mix-blend-mode:soft-light;animation:grain 8s steps(6) infinite reverse;
}
body#cart .cartpage > *{position:relative;z-index:2}
body#cart h1,body#cart h2,body#cart .h4{font-family:var(--serif) !important;color:var(--papier) !important;font-weight:600}

/* ---- Fil d'Ariane + étapes de commande ---- */
body#cart .cartpage__head{max-width:var(--maxw);margin:0 auto;
  padding:130px var(--gutter) 0;display:flex;justify-content:space-between;align-items:center;
  flex-wrap:wrap;gap:14px}
body#cart .pcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:10px;color:var(--paper-fade);
  font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;padding:0}
body#cart .pcrumb a{color:var(--paper-soft);text-decoration:none;transition:color .3s}
body#cart .pcrumb a:hover{color:var(--papier)}
body#cart .pcrumb [aria-current]{color:var(--sang-2)}
body#cart .csteps{display:flex;align-items:center;gap:10px;font-size:.62rem;letter-spacing:.16em;color:var(--paper-fade);
  list-style:none;margin:0;padding:0}
body#cart .csteps__step{display:flex;align-items:center;gap:8px;text-transform:uppercase}
body#cart .csteps__step+.csteps__step::before{content:"";display:block;width:20px;height:1px;
  background:rgba(243,239,231,.2);margin-right:2px}
body#cart .csteps__num{width:18px;height:18px;border:1px solid rgba(243,239,231,.24);border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:.56rem;color:var(--paper-fade)}
body#cart .csteps__step.is-active{color:var(--papier)}
body#cart .csteps__step.is-active .csteps__num{background:var(--sang);border-color:var(--sang);color:var(--papier)}

/* ---- Grille panier / récap : 1fr 400px, comme .cartpage__grid mais
   agrandie — au pixel près la référence se lit "petite" sur un écran
   large ; on grossit la colonne récap et les espacements en conséquence. ---- */
body#cart .cart-grid{max-width:var(--maxw);margin:0 auto;
  padding:20px var(--gutter) clamp(60px,7vw,90px);
  display:grid !important;grid-template-columns:1fr 400px;gap:70px;align-items:start}
body#cart .cart-grid__body,body#cart .cart-grid__right{width:auto;max-width:none;flex:none;padding:0}
body#cart .cart-grid__body .kicker{margin-bottom:0;font-size:.82rem}
body#cart .cart-grid__body h1{font-size:clamp(2.3rem,4.6vw,3.4rem) !important;font-weight:600;margin:16px 0 12px;font-style:normal}
body#cart .cartpage__lead{color:var(--paper-soft);font-size:1.12rem;line-height:1.65;max-width:480px;margin:0 0 6px}
body#cart .cartpage__discover{margin:22px 0 34px}

/* ---- En-tête de colonnes (desktop) ---- */
body#cart .cartpage__listhead{display:grid;grid-template-columns:1fr 130px 130px;gap:12px;
  padding:28px 0 12px;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--paper-fade);
  border-bottom:1px solid rgba(243,239,231,.1)}
body#cart .cartpage__listhead span:nth-child(2){text-align:center}
body#cart .cartpage__listhead span:last-child{text-align:right}

/* ---- Lignes produit : grille 96px image / contenu / actions, comme
   .cartitem — les colonnes Bootstrap vides (spaceurs mobile) sont
   retirées de la mise en page sans toucher au DOM ni aux data-attributes
   qui font fonctionner le module panier. ---- */
body#cart .cart__item{border-bottom:1px solid rgba(243,239,231,.1);padding:0}
/* La règle globale ".quantity-button,.js-quantity-button{display:none
   !important}" (retrait du sélecteur de quantité sur la fiche produit)
   cache aussi par erreur celui du panier, plus spécifique que les
   règles internes ci-dessous. On le réaffiche ici, uniquement sur cette
   page, sans toucher à la fiche produit. */
body#cart .quantity-button,body#cart .js-quantity-button{display:block !important}
/* Grille 2 colonnes (image / contenu), 2 lignes : l'image couvre les deux
   lignes, le titre occupe la ligne du haut et la quantité+le prix la ligne
   du bas — dans la MÊME colonne que le titre (comme .cartitem__body qui
   empile name/material/row), plutôt qu'une 3e colonne étalée jusqu'au bord
   droit de la ligne. C'est ce regroupement qui manquait pour retrouver
   l'allure de .cartitem de la référence. */
body#cart .product-line.row{
  display:grid !important;grid-template-columns:130px 1fr;grid-template-rows:auto auto;
  column-gap:28px;row-gap:16px;
  padding:32px 0;margin:0;position:relative;transition:background .35s var(--ease)}
body#cart .cart__item:hover .product-line.row{background:rgba(243,239,231,.03)}
body#cart .product-line > div:empty{display:none}
body#cart .product-line__image{grid-column:1;grid-row:1/3;width:auto;max-width:none;flex:none;padding:0;border:none;line-height:0}
body#cart .product-line__image a{display:block;width:130px;height:130px;overflow:hidden;
  border:1px solid rgba(243,239,231,.16)}
body#cart .product-line__image picture,body#cart .product-line__image img{
  display:block;width:100%;height:100%;object-fit:cover;
  transition:transform .6s var(--ease),filter .6s var(--ease)}
body#cart .cart__item:hover .product-line__image img{transform:scale(1.06)}
body#cart .product-line__content{grid-column:2;grid-row:1;width:auto;max-width:none;flex:none;padding:0;
  display:flex;flex-direction:column;gap:5px}
body#cart .product-line__title{font-family:var(--serif) !important;color:var(--papier) !important;
  font-size:1.55rem;text-decoration:none;transition:color .3s var(--ease)}
body#cart .product-line__title:hover{color:var(--sang-2) !important}
body#cart .product-line__info{font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--paper-fade) !important;margin-top:3px}
body#cart .product-line__info .label,body#cart .product-line__info .value{color:inherit !important;font-family:var(--mono) !important}
/* Le prix unitaire sous le titre fait doublon avec le total affiché dans
   la ligne quantité/total (comme sur la référence, un seul prix affiché) */
body#cart .product-line__prices{display:none}
/* Quantité + total, alignés sur toute la largeur de la colonne contenu
   (space-between), pas étalés jusqu'au bord droit de la ligne entière. */
body#cart .product-line__informations{grid-column:2;grid-row:2;width:auto;max-width:none;flex:none;padding:0;margin-top:6px}
body#cart .product-line__informations .row{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:0;flex-wrap:nowrap}
body#cart .product-line__informations .row>div{width:auto;max-width:none;flex:none;padding:0}
body#cart .product-line__discount .price,
body#cart .product-line__informations .price{
  font-family:var(--serif) !important;font-size:1.35rem;color:var(--papier) !important;font-weight:600}
/* Bouton retirer : icône corbeille (SVG en masque, suit currentColor)
   plutôt que le "×" texte — plus grand, plus clair au survol, et sans
   le contour bleu de focus par défaut du navigateur (remplacé par un
   anneau dans la charte, gardé au clavier pour l'accessibilité). Sorti
   du flux de grille pour ne pas créer une 4e colonne : positionné dans
   le coin de la ligne, comme la référence. */
body#cart .product-line__actions{position:absolute;top:28px;right:0;width:auto;padding:0}
/* Abandon du masque CSS/SVG en data-URI (technique fragile selon
   navigateur, cause probable du trait bleu signalé plusieurs fois —
   un rendu de secours non masqué peut fuir hors du cercle). Remplacé
   par un simple caractère "×", sans marge d'erreur de rendu. */
body#cart .remove-from-cart,
body#cart .remove-from-cart:link,
body#cart .remove-from-cart:visited,
body#cart .remove-from-cart:hover,
body#cart .remove-from-cart:active,
body#cart .remove-from-cart:focus,
body#cart .remove-from-cart:focus-visible{
  outline:none !important;box-shadow:none !important;-webkit-tap-highlight-color:transparent !important;
  -webkit-touch-callout:none !important;-webkit-appearance:none !important;appearance:none !important;
}
/* Structure radicalement simplifiée : plus aucun enfant (span, pseudo-
   élément) pouvant se décaler ou entrer en conflit — juste une image de
   fond SVG (le "×", couleur figée dans le SVG lui-même, indépendante de
   currentColor/couleurs héritées) centrée sur le cercle. Le texte réel
   "Retirer" reste dans le DOM pour l'accessibilité (lu au clavier/lecteur
   d'écran) mais à taille nulle, sans espace pour décaler quoi que ce soit. */
body#cart .remove-from-cart{
  display:block;width:42px;height:42px;overflow:hidden;
  border:1px solid rgba(243,239,231,.16);border-radius:50%;
  color:transparent !important;font-size:0 !important;line-height:0 !important;text-decoration:none !important;
  background-color:transparent;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 6l12 12M18 6L6 18' stroke='%23F3EFE7' stroke-width='2' stroke-linecap='round' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:center;background-size:14px 14px;
  user-select:none;-webkit-user-select:none;
  transition:background-color .3s var(--ease),border-color .3s var(--ease)}
body#cart .remove-from-cart:visited{color:transparent !important}
body#cart .remove-from-cart:hover,body#cart .remove-from-cart:focus-visible,body#cart .remove-from-cart:active{
  border-color:var(--sang-2) !important;background-color:rgba(154,28,30,.12);text-decoration:none !important;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 6l12 12M18 6L6 18' stroke='%239a1c1e' stroke-width='2' stroke-linecap='round' fill='none'/%3E%3C/svg%3E");
}
body#cart .remove-from-cart:focus-visible{box-shadow:0 0 0 3px rgba(154,28,30,.35)}

/* ---- Groupe quantité en pilule unique ---- */
body#cart .quantity-button .input-group{display:flex;border:1px solid rgba(243,239,231,.2);width:fit-content;gap:0}
body#cart .quantity-button .decrement,body#cart .quantity-button .increment{
  border:none !important;border-radius:0 !important;background:transparent !important;color:var(--papier) !important;
  width:40px;height:40px;padding:0;transition:background .3s var(--ease),color .3s var(--ease)}
body#cart .quantity-button .decrement .material-icons,body#cart .quantity-button .increment .material-icons{font-size:1.35rem}
body#cart .quantity-button .decrement{border-right:1px solid rgba(243,239,231,.2) !important}
body#cart .quantity-button .increment{border-left:1px solid rgba(243,239,231,.2) !important}
body#cart .quantity-button .decrement:hover,body#cart .quantity-button .increment:hover{
  background:var(--sang) !important;color:var(--papier) !important;border-color:var(--sang) !important}
body#cart .quantity-button input.form-control{
  border:none !important;width:42px;text-align:center;font-size:1rem;
  background:transparent !important;color:var(--papier) !important}

/* ---- État vide (message natif PrestaShop) ---- */
body#cart .cart-container>p{padding:60px 0 20px;color:var(--paper-fade)}

/* ---- Récapitulatif (.cart-summary) — carte à filet dégradé + total mis
   en avant, comme .cartpage__summary/.cartpage__row--total ---- */
/* Titre "RÉCAPITULATIF" en mono estompé (comme .cartpage__summary-title),
   pas en serif : la règle globale body#cart h2{serif} l'écrasait. */
body#cart .cartpage__summary-title{
  font-family:var(--mono) !important;font-size:.85rem !important;font-weight:400 !important;
  letter-spacing:.26em;text-transform:uppercase;color:var(--paper-fade) !important;margin:0 0 24px !important}
body#cart .card,body#cart .cart-summary{
  background:transparent !important;border:1px solid rgba(243,239,231,.14) !important;border-radius:0 !important;
  box-shadow:none !important;color:var(--papier)}
/* .cart-container (liste des articles) ne porte pas de cadre sur la
   référence — seule la carte récap (.cart-summary) en a un. */
body#cart .cart-container{background:transparent !important;border:none !important;box-shadow:none !important;color:var(--papier)}
body#cart .cart-summary{
  padding:38px;position:relative;overflow:hidden;
  background:linear-gradient(180deg,rgba(243,239,231,.03),transparent) !important;
}
body#cart hr{border-color:rgba(243,239,231,.14) !important;opacity:1}
/* Les <hr> natifs du gabarit panier (un avant la liste, un après chaque
   article) utilisent le style "inset" par défaut du navigateur — un
   <hr> seul y dessine 2 traits (haut+bas), plus notre propre bordure
   .cart__item : 4 traits visibles pour 1 seul article. On masque ces
   <hr> natifs, notre bordure CSS suffit comme séparateur unique. */
body#cart .cart-overview>hr,body#cart .cart__item>hr{display:none !important}
body#cart .cart-summary__label{color:var(--paper-soft) !important;font-size:1.02rem}
body#cart .cart-summary__value{color:var(--papier) !important;font-family:var(--mono);font-weight:700;font-size:1.02rem}
body#cart .cart-summary__line{display:flex;justify-content:space-between;margin-bottom:16px}
body#cart .cart-total .cart-summary__label,body#cart .cart-total .cart-summary__value{
  color:var(--papier) !important;font-size:1.25rem}
body#cart .cart-total{padding-top:18px;margin-top:2px;border-top:1px dashed rgba(243,239,231,.16)}
body#cart .cart-total .cart-summary__value{
  font-family:var(--serif) !important;color:var(--sang-2) !important;font-size:1.65rem !important;font-weight:600}
body#cart .cart-summary__label--sub{color:var(--paper-fade) !important}
body#cart .price,body#cart .value{color:var(--papier)}
body#cart .product-price{color:var(--sang-2) !important}
body#cart .btn-outline-primary{color:var(--papier) !important;border-color:rgba(243,239,231,.2) !important}
body#cart .btn-outline-primary:hover{background:var(--papier) !important;color:var(--encre) !important;border-color:var(--papier) !important}
body#cart .cart-grid__promo,body#cart .block-promo .promo-code{background:transparent !important}
body#cart .card-footer,body#cart .cart-detailed__actions{
  background:transparent !important;border:none !important;padding:0 !important;margin-top:26px}
body#cart .card-footer .btn-primary,body#cart .cart-detailed__actions .btn-primary,
body#cart .card-footer .checkout,body#cart .cart-detailed__actions .checkout{
  background:var(--sang) !important;border:1px solid var(--sang) !important;color:var(--papier) !important;
  border-radius:0 !important;font-family:var(--mono) !important;font-size:.8rem !important;
  letter-spacing:.16em;text-transform:uppercase;padding:19px 28px !important;width:100%;justify-content:center;
  transition:background .4s var(--ease),border-color .4s var(--ease)}
body#cart .card-footer .btn-primary:hover,body#cart .cart-detailed__actions .btn-primary:hover,
body#cart .card-footer .checkout:hover,body#cart .cart-detailed__actions .checkout:hover{
  background:var(--sang-2) !important;border-color:var(--sang-2) !important}
body#cart .material-icons{color:var(--paper-soft)}
/* Bouton "Continuer mes achats" : fantôme pleine largeur DANS le récap,
   sous "Commander", comme .cartpage__continue de la référence. */
body#cart .cartpage__continue{
  width:100%;justify-content:center;margin-top:14px;
  background:transparent !important;border:1px solid var(--papier) !important;color:var(--papier) !important;
  border-radius:0 !important;font-family:var(--mono) !important;font-size:.8rem !important;
  letter-spacing:.16em;text-transform:uppercase;padding:19px 28px !important;
  transition:background .35s var(--ease),color .35s var(--ease)}
body#cart .cartpage__continue:hover{background:var(--papier) !important;color:var(--encre) !important}

/* ---- Réassurance (.cartpage__trust), à l'identique de #cartPageSummary
   sur le site vitrine : dans la carte récap, mêmes 3 icônes/liens. Le
   hook displayReassurance (blockreassurance_product) n'est plus appelé
   sur cette page — retiré du template, doublon avec ce bloc. ---- */
body#cart .cartpage__trust{margin-top:28px;padding-top:26px;
  border-top:1px solid rgba(243,239,231,.14);display:flex;flex-direction:column;gap:20px}
body#cart .cartpage__trust-item{display:flex;align-items:flex-start;gap:14px;color:var(--sang-2);
  text-decoration:none;transition:color .3s}
body#cart .cartpage__trust-item svg{flex:none;margin-top:1px;opacity:.9;width:24px;height:24px}
body#cart .cartpage__trust-item span{display:flex;flex-direction:column;gap:3px;
  font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;color:var(--paper-fade)}
body#cart .cartpage__trust-item b{font-family:var(--serif);font-size:1.05rem;color:var(--papier);font-weight:600}
body#cart .cartpage__trust-item:hover{color:var(--sang-2)}
body#cart .cartpage__trust-item:hover b{color:var(--sang-2)}

/* ---- État vide, comme .cartpage__empty de la référence ---- */
body#cart .cartpage__empty-wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter)}
body#cart .cartpage__empty-wrap .kicker{margin-bottom:0}
body#cart .cartpage__empty-wrap h1{font-size:clamp(2rem,4vw,3rem) !important;font-weight:600;margin:14px 0 0}
body#cart .cartpage__empty{padding:40px 0 clamp(60px,7vw,90px);display:flex;flex-direction:column;
  align-items:flex-start;gap:14px}
body#cart .cartpage__empty-icon{color:var(--paper-fade)}
body#cart .cartpage__empty-title{font-family:var(--serif);font-size:1.6rem;font-weight:600;color:var(--papier);margin:0}
body#cart .cartpage__empty-text{color:var(--paper-fade);margin:0 0 6px;font-size:.72rem;letter-spacing:.06em}

/* ---- Ventes croisées (.featured-products) = .crosssell de la référence
   à l'identique : reste sur le fond sombre du panier (pas de bascule vers
   du papier clair), mêmes tailles/couleurs de police, même intitulé
   "Vous aimerez aussi". ---- */
body#cart .featured-products,body#cart .best-sellers-products,body#cart .new-products{
  background:transparent !important;position:relative;z-index:3;max-width:var(--maxw);margin:0 auto;
  padding:10px var(--gutter) clamp(70px,9vw,110px) !important;
  border-top:1px solid rgba(243,239,231,.1);
}
body#cart .featured-products::after,body#cart .best-sellers-products::after,body#cart .new-products::after{
  display:none;
}
body#cart .hand-title{border-bottom:none;margin-bottom:0}
body#cart .hand-title::before{color:var(--sang-2)}
/* Titre réel du module ("Produits populaires", configuré en back-office)
   masqué au profit du même intitulé que la référence : "Vous aimerez
   aussi", en police/taille identiques à .crosssell__title. */
body#cart .hand-title .section-title,body#cart .hand-title.h2{
  font-size:0 !important;color:var(--papier) !important;font-style:normal !important;margin:10px 0 30px !important;
}
body#cart .hand-title .section-title::after,body#cart .hand-title.h2::after{
  content:"Vous aimerez aussi";display:block;
  font-family:var(--serif);font-size:clamp(1.7rem,3vw,2.4rem);font-weight:600;font-style:normal;
}
/* Grille 4 colonnes (repeat(4,1fr), gap 26px) comme .crosssell__grid /
   .grid--related, plutôt que la grille Bootstrap flex/gouttières par
   défaut du module (cartes plus larges, espacement irrégulier). */
body#cart .featured-products .products,body#cart .best-sellers-products .products,body#cart .new-products .products{
  display:grid !important;grid-template-columns:repeat(4,1fr) !important;gap:26px !important;margin:0 !important}
body#cart .product-miniature{
  width:auto !important;max-width:none !important;flex:none !important;padding:0 !important;margin:0 !important;list-style:none}
body#cart .product-miniature .card{background:none !important;border:none !important}
body#cart .product-miniature__image-container{background:var(--encre-2);border:2px solid var(--sang)}
body#cart .product-miniature__infos,body#cart .product-miniature__infos.card-body,
body#cart div.product-miniature__infos{
  background:transparent !important;background-color:transparent !important;
  padding:16px 0 4px !important;position:static;
}
body#cart .product-miniature__infos::after{display:none}
/* Vrais coupables du fond blanc : des enfants plus profonds et jamais
   ciblés jusqu'ici (.product-miniature__infos__top,
   .product-miniature__infos__bottom, et toute variante du même schéma),
   qui portent leur propre fond blanc en dur indépendamment du conteneur
   parent déjà transparent. Sélecteur large (tout ce qui commence par
   "product-miniature__infos__") pour ne plus rejouer cette chasse au
   cas par cas à chaque nouvel enfant découvert. */
body#cart [class^="product-miniature__infos__"],
body#cart [class*=" product-miniature__infos__"],
body#cart [class^="product-miniature__infos__"] *,
body#cart [class*=" product-miniature__infos__"] *{
  background:transparent !important;background-color:transparent !important;
}
body#cart .product-miniature__title{
  color:var(--papier) !important;font-size:1.15rem !important;
  border-bottom:1px solid rgba(243,239,231,.14);padding-bottom:10px;display:block;
}
body#cart .product-miniature__prices{margin-top:8px}
body#cart .product-miniature__price{color:var(--sang-2) !important;font-size:.78rem !important}
body#cart .product-miniature__regular-price{color:var(--paper-fade) !important}
/* Bouton "Ajouter au panier" : texte + flèche (comme .card__cta "Ajouter
   au panier →" de la référence), pas l'icône panier carrée par défaut.
   L'icône est masquée, le libellé "visually-hidden" réaffiché et stylé,
   une flèche ajoutée après. Le bouton reste le vrai bouton PrestaShop
   (data-button-action=add-to-cart) : fonction intacte. */
body#cart .product-miniature [data-button-action="add-to-cart"]{
  display:inline-flex !important;align-items:center;gap:8px;
  background:none !important;border:none !important;color:var(--papier) !important;
  min-width:0 !important;padding:0 !important;margin-top:14px;
  font-family:var(--mono) !important;font-size:.68rem !important;letter-spacing:.14em;text-transform:uppercase;
  position:relative;width:fit-content}
body#cart .product-miniature [data-button-action="add-to-cart"] .material-icons{display:none !important}
body#cart .product-miniature [data-button-action="add-to-cart"] .visually-hidden{
  position:static !important;width:auto !important;height:auto !important;overflow:visible !important;
  clip:auto !important;clip-path:none !important;white-space:normal !important;margin:0 !important}
body#cart .product-miniature [data-button-action="add-to-cart"]::after{
  content:"→";color:var(--sang);transition:transform .4s var(--ease)}
body#cart .product-miniature [data-button-action="add-to-cart"]:hover{
  background:none !important;color:var(--papier) !important}
body#cart .product-miniature [data-button-action="add-to-cart"]:hover::after{transform:translateX(6px)}

/* ---- Responsive : seuils ajustés pour la colonne récap élargie (400px) ---- */
@media (max-width:1180px){
  body#cart .cart-grid{grid-template-columns:1fr;gap:30px}
  body#cart .cart-grid__right{position:static}
}
@media (min-width:1181px){
  body#cart .cart-grid__right{position:sticky;top:110px}
}
@media (max-width:1100px){
  body#cart .featured-products .products,body#cart .best-sellers-products .products,body#cart .new-products .products{
    grid-template-columns:repeat(2,1fr) !important}
}
@media (max-width:900px){
  body#cart .product-line__image a{width:90px;height:90px}
  body#cart .product-line.row{grid-template-columns:90px 1fr;padding-right:44px}
  body#cart .product-line__informations{grid-column:1/-1;justify-content:flex-start;margin-top:12px}
}
@media (max-width:720px){
  body#cart .cartpage__head{padding-top:96px}
  body#cart .cartpage__listhead{display:none}
  body#cart .cart-grid{padding-top:16px}
  body#cart .cart-grid__body h1{font-size:clamp(1.9rem,7vw,2.5rem) !important}
  body#cart .csteps__label{display:none}
  body#cart .featured-products .products,body#cart .best-sellers-products .products,body#cart .new-products .products{
    grid-template-columns:1fr !important}
}

/* =========================================================
   Pages compte client — connexion, adresses, identité, historique,
   avoirs, réductions, GDPR, listes d'envies.
   Charte claire "papier", comme les pages légales : un compte client
   est un espace de lecture et de formulaire, pas une page d'atelier
   immersive. Le premier jet plaquait la charte sombre du panier sur
   ces pages (uniformément marron/noir) ; ici fond papier, encre pour
   le texte, rouge sang et or en accents — la charte complète, pas
   une seule de ses couleurs.
   ========================================================= */
body#authentication,
body#addresses,
body#address,
body#identity,
body#history,
body#order-detail,
body#order-slip,
body#discount,
body#module-psgdpr-gdpr,
body#module-blockwishlist-lists{
  background:var(--papier) !important;
}body#authentication .logo-top-page,
body#addresses .logo-top-page,
body#address .logo-top-page,
body#identity .logo-top-page,
body#history .logo-top-page,
body#order-detail .logo-top-page,
body#order-slip .logo-top-page,
body#discount .logo-top-page,
body#module-psgdpr-gdpr .logo-top-page,
body#module-blockwishlist-lists .logo-top-page{display:none !important}body#authentication #wrapper,
body#authentication #content-wrapper,
body#addresses #wrapper,
body#addresses #content-wrapper,
body#address #wrapper,
body#address #content-wrapper,
body#identity #wrapper,
body#identity #content-wrapper,
body#history #wrapper,
body#history #content-wrapper,
body#order-detail #wrapper,
body#order-detail #content-wrapper,
body#order-slip #wrapper,
body#order-slip #content-wrapper,
body#discount #wrapper,
body#discount #content-wrapper,
body#module-psgdpr-gdpr #wrapper,
body#module-psgdpr-gdpr #content-wrapper,
body#module-blockwishlist-lists #wrapper,
body#module-blockwishlist-lists #content-wrapper{
  padding:0;margin:0;max-width:none;
}
/* Même "papier + pli" que .manifesto.paper-tex (accueil, planche 7 de la
   charte graphique) plutôt qu'un fond papier plat, pour rester dans la
   même famille visuelle sur les pages compte/légales. */
body#authentication #content-wrapper,
body#addresses #content-wrapper,
body#address #content-wrapper,
body#identity #content-wrapper,
body#history #content-wrapper,
body#order-detail #content-wrapper,
body#order-slip #content-wrapper,
body#discount #content-wrapper,
body#module-psgdpr-gdpr #content-wrapper,
body#module-blockwishlist-lists #content-wrapper{
  position:relative;
}
body#authentication #content-wrapper::after,
body#addresses #content-wrapper::after,
body#address #content-wrapper::after,
body#identity #content-wrapper::after,
body#history #content-wrapper::after,
body#order-detail #content-wrapper::after,
body#order-slip #content-wrapper::after,
body#discount #content-wrapper::after,
body#module-psgdpr-gdpr #content-wrapper::after,
body#module-blockwishlist-lists #content-wrapper::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(115deg, rgba(23,19,15,.035), transparent 40%, rgba(23,19,15,.02) 70%, rgba(23,19,15,.05)),
    url("../textures/speckle.png");
  background-size:cover, 256px 256px;
  background-blend-mode:normal, multiply;
  opacity:.7;
}
body#authentication #content-wrapper > *,
body#addresses #content-wrapper > *,
body#address #content-wrapper > *,
body#identity #content-wrapper > *,
body#history #content-wrapper > *,
body#order-detail #content-wrapper > *,
body#order-slip #content-wrapper > *,
body#discount #content-wrapper > *,
body#module-psgdpr-gdpr #content-wrapper > *,
body#module-blockwishlist-lists #content-wrapper > *{
  position:relative;z-index:1;
}
body#authentication .container,
body#addresses .container,
body#address .container,
body#identity .container,
body#history .container,
body#order-detail .container,
body#order-slip .container,
body#discount .container,
body#module-psgdpr-gdpr .container,
body#module-blockwishlist-lists .container{
  max-width:none;padding:0;
}body#authentication #content-wrapper,
body#addresses #content-wrapper,
body#address #content-wrapper,
body#identity #content-wrapper,
body#history #content-wrapper,
body#order-detail #content-wrapper,
body#order-slip #content-wrapper,
body#discount #content-wrapper,
body#module-psgdpr-gdpr #content-wrapper,
body#module-blockwishlist-lists #content-wrapper{
  background:var(--papier) !important;color:var(--encre);min-height:80vh;
  padding:clamp(120px,14vh,170px) var(--gutter) clamp(70px,9vw,110px);
}body#authentication .container--limited-sm,
body#addresses .container--limited-sm,
body#address .container--limited-sm,
body#identity .container--limited-sm,
body#history .container--limited-sm,
body#order-detail .container--limited-sm,
body#order-slip .container--limited-sm,
body#discount .container--limited-sm,
body#module-psgdpr-gdpr .container--limited-sm,
body#module-blockwishlist-lists .container--limited-sm{
  max-width:var(--maxw);margin:0 auto;
}body#authentication,
body#addresses,
body#address,
body#identity,
body#history,
body#order-detail,
body#order-slip,
body#discount,
body#module-psgdpr-gdpr,
body#module-blockwishlist-lists{
  font-family:var(--body) !important;
}body#authentication h1,
body#authentication h2,
body#authentication .h4,
body#addresses h1,
body#addresses h2,
body#addresses .h4,
body#address h1,
body#address h2,
body#address .h4,
body#identity h1,
body#identity h2,
body#identity .h4,
body#history h1,
body#history h2,
body#history .h4,
body#order-detail h1,
body#order-detail h2,
body#order-detail .h4,
body#order-slip h1,
body#order-slip h2,
body#order-slip .h4,
body#discount h1,
body#discount h2,
body#discount .h4,
body#module-psgdpr-gdpr h1,
body#module-psgdpr-gdpr h2,
body#module-psgdpr-gdpr .h4,
body#module-blockwishlist-lists h1,
body#module-blockwishlist-lists h2,
body#module-blockwishlist-lists .h4{
  font-family:var(--serif) !important;color:var(--encre) !important;font-weight:600;
}body#authentication p,
body#authentication li,
body#authentication td,
body#authentication .form-control,
body#addresses p,
body#addresses li,
body#addresses td,
body#addresses .form-control,
body#address p,
body#address li,
body#address td,
body#address .form-control,
body#identity p,
body#identity li,
body#identity td,
body#identity .form-control,
body#history p,
body#history li,
body#history td,
body#order-detail p,
body#order-detail li,
body#order-detail td,
body#order-slip p,
body#order-slip li,
body#order-slip td,
body#discount p,
body#discount li,
body#discount td,
body#module-blockwishlist-lists p,
body#module-blockwishlist-lists li,
body#module-blockwishlist-lists td{
  font-family:var(--body) !important;
}/* Kicker éditorial au-dessus du titre de page (::before = libellé,
::after = pastille) — pur CSS,
aucun template touché. */
body#identity .page-header,
body#addresses .page-header,
body#address .page-header,
body#history .page-header,
body#order-detail .page-header,
body#order-slip .page-header,
body#discount .page-header,
body#module-blockwishlist-lists .page-header{
  display:flex;flex-direction:column;gap:10px;margin-bottom:32px;padding-bottom:24px;
  border-bottom:1px solid var(--border-light);
}body#identity .page-header::before,
body#addresses .page-header::before,
body#address .page-header::before,
body#history .page-header::before,
body#order-detail .page-header::before,
body#order-slip .page-header::before,
body#discount .page-header::before,
body#module-blockwishlist-lists .page-header::before{
  content:"Mon compte";order:-1;font-family:var(--mono) !important;font-size:.72rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--sang);display:flex;align-items:center;gap:12px;
}body#identity .page-header::after,
body#addresses .page-header::after,
body#address .page-header::after,
body#history .page-header::after,
body#order-detail .page-header::after,
body#order-slip .page-header::after,
body#discount .page-header::after,
body#module-blockwishlist-lists .page-header::after{
  content:"";order:-1;width:7px;height:7px;border-radius:50%;background:var(--sang);
  box-shadow:0 0 0 4px rgba(124,21,23,.12);margin-left:-2px;
}body#identity .page-header h1,
body#addresses .page-header h1,
body#address .page-header h1,
body#history .page-header h1,
body#order-detail .page-header h1,
body#order-slip .page-header h1,
body#discount .page-header h1,
body#module-blockwishlist-lists .page-header h1{
  font-size:clamp(1.9rem,3.6vw,2.8rem) !important;font-style:italic;margin-bottom:0;
}

/* Sidebar "Mon compte" — panneau papier-2, liens mono capitales,
   soulignement/couleur au survol, état actif en rouge sang. */
.account-menu{padding:28px 24px;border:1px solid var(--border-light);background:var(--papier-2)}
.account-menu__title{font-family:var(--serif) !important;color:var(--encre) !important;font-style:italic;
  font-size:1.3rem !important;margin-bottom:20px !important;padding-bottom:16px;border-bottom:1px solid var(--border-light)}
.account-menu__line{display:flex;align-items:center;gap:10px;padding:11px 0;color:var(--ink-soft) !important;
  font-family:var(--mono) !important;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
  text-decoration:none;position:relative;transition:color .3s,padding-left .3s}
.account-menu__line .link-item{display:flex;align-items:center;gap:10px}
.account-menu__line .material-icons{font-size:17px;color:inherit}
.account-menu__line:hover{color:var(--encre) !important;padding-left:6px}
.account-menu__line.active{color:var(--sang) !important}
.account-menu__line.active .material-icons{color:var(--sang) !important}
.account-menu__line:not(:last-child){border-bottom:1px solid var(--border-light)}
.account-menu--signout{margin-top:8px;color:var(--acier) !important}
.account-menu--signout:hover{color:var(--sang) !important}/* Cartes (formulaires,
récap,
adresses…) — panneau papier-2 net,
micro-interaction au survol pour les adresses cliquables. */
body#authentication .card,
body#authentication .login,
body#addresses .card,
body#address .card,
body#identity .card,
body#history .card,
body#order-detail .card,
body#order-slip .card,
body#discount .card,
body#module-psgdpr-gdpr .card,
body#module-blockwishlist-lists .card{
  background:var(--papier-2) !important;border:1px solid var(--border-light) !important;border-radius:0 !important;
  box-shadow:none !important;color:var(--encre);padding:28px !important;
}
body#addresses .address-item{background:var(--papier-2) !important;border:1px solid var(--border-light) !important;
  color:var(--encre);padding:24px !important;transition:border-color .3s,background .3s}
body#addresses .address-item:hover{border-color:var(--sang);background:var(--papier) !important}
body#addresses .address-item .address-item-title{color:var(--encre) !important;font-family:var(--serif);font-style:italic}
body#addresses .addresses__new-address,body#addresses a[data-link-action="add-address"]{
  border:1px dashed var(--border-light) !important;color:var(--ink-soft) !important;background:transparent !important;
  display:flex;align-items:center;justify-content:center;gap:10px;min-height:100%;
  font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;
  text-decoration:none;transition:color .3s,border-color .3s;
}
body#addresses .addresses__new-address:hover{color:var(--sang) !important;border-color:var(--sang) !important}/* Formulaires */
body#authentication .form-label,
body#addresses .form-label,
body#address .form-label,
body#identity .form-label,
body#history .form-label,
body#discount .form-label,
body#module-psgdpr-gdpr .form-label,
body#module-blockwishlist-lists .form-label{
  color:var(--ink-soft) !important;font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
}body#authentication .form-control,
body#authentication .form-select,
body#addresses .form-control,
body#addresses .form-select,
body#address .form-control,
body#address .form-select,
body#identity .form-control,
body#identity .form-select,
body#history .form-control,
body#discount .form-control,
body#module-psgdpr-gdpr .form-control,
body#module-blockwishlist-lists .form-control{
  background:var(--papier) !important;border:1px solid var(--border-light) !important;color:var(--encre) !important;
  border-radius:0 !important;box-shadow:none !important;transition:border-color .3s;
}
body#authentication .form-control:focus,body#authentication .form-select:focus,
body#addresses .form-control:focus,body#addresses .form-select:focus,
body#address .form-control:focus,body#address .form-select:focus,
body#identity .form-control:focus,body#identity .form-select:focus{
  border-color:var(--sang) !important;box-shadow:0 0 0 3px rgba(124,21,23,.12) !important;
}
body#authentication .form-control::placeholder,body#addresses .form-control::placeholder,
body#address .form-control::placeholder,body#identity .form-control::placeholder{
  color:var(--paper-fade) !important;
}/* Cases à cocher / radios (civilité,
conditions…) : accent rouge sang au
   lieu du bleu Bootstrap par défaut — c'est ce bleu résiduel qui restait
   visible au clic sur les boutons de choix (civilité,
options). */
body#authentication .form-check-input,
body#addresses .form-check-input,
body#address .form-check-input,
body#identity .form-check-input,
body#history .form-check-input,
body#discount .form-check-input,
body#module-psgdpr-gdpr .form-check-input{
  border-color:var(--border-light) !important;
}body#authentication .form-check-input:checked,
body#addresses .form-check-input:checked,
body#address .form-check-input:checked,
body#identity .form-check-input:checked,
body#history .form-check-input:checked,
body#discount .form-check-input:checked,
body#module-psgdpr-gdpr .form-check-input:checked{
  background-color:var(--sang) !important;border-color:var(--sang) !important;
}
body#authentication .form-check-input:focus,body#addresses .form-check-input:focus,
body#address .form-check-input:focus,body#identity .form-check-input:focus{
  box-shadow:0 0 0 3px rgba(124,21,23,.14) !important;border-color:var(--sang) !important;
}
body#authentication .form-check-label,body#addresses .form-check-label,body#address .form-check-label,
body#identity .form-check-label,body#module-psgdpr-gdpr .form-check-label{color:var(--ink-soft) !important}/* Liens */
body#authentication a,
body#addresses a,
body#address a,
body#identity a,
body#history a,
body#order-detail a,
body#order-slip a,
body#discount a,
body#module-psgdpr-gdpr a,
body#module-blockwishlist-lists a{color:var(--sang)}body#authentication hr,
body#addresses hr,
body#address hr,
body#identity hr,
body#history hr,
body#order-detail hr,
body#order-slip hr,
body#discount hr,
body#module-psgdpr-gdpr hr,
body#module-blockwishlist-lists hr{border-color:var(--border-light) !important;opacity:1}

/* Tableaux (historique, avoirs, réductions, liste d'envies) */
body#authentication table,body#history table,body#order-slip table,body#discount table,
body#module-blockwishlist-lists table{color:var(--encre);border-color:var(--border-light) !important}
body#history table th,body#order-slip table th,body#discount table th,
body#module-blockwishlist-lists table th{
  color:var(--acier) !important;font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;
  text-transform:uppercase;border-color:var(--border-light) !important;background:transparent !important;padding:12px 10px !important;
}
body#history table td,body#order-slip table td,body#discount table td,
body#module-blockwishlist-lists table td{border-color:var(--border-light) !important;background:transparent !important;padding:14px 10px !important}
body#history table tr,body#order-slip table tr,body#discount table tr,
body#module-blockwishlist-lists table tr{transition:background .25s}
body#history table tbody tr:hover,body#order-slip table tbody tr:hover,
body#discount table tbody tr:hover,body#module-blockwishlist-lists table tbody tr:hover{
  background:rgba(23,19,15,.03) !important;
}/* Boutons — même traitement "remplissage au survol" que .btn du reste
   du site,
plutôt que l'outline Bootstrap plat/bleu. */
body#authentication .btn-outline-primary,
body#addresses .btn-outline-primary,
body#address .btn-outline-primary,
body#identity .btn-outline-primary,
body#history .btn-outline-primary,
body#discount .btn-outline-primary,
body#module-psgdpr-gdpr .btn-outline-primary,
body#module-blockwishlist-lists .btn-outline-primary{
  font-family:var(--mono) !important;font-size:.7rem !important;letter-spacing:.14em;text-transform:uppercase;
  border-radius:0 !important;position:relative;overflow:hidden;isolation:isolate;
  color:var(--encre) !important;border-color:var(--encre) !important;background:transparent !important;
  transition:color .4s var(--ease) !important;
}body#authentication .btn-outline-primary::before,
body#addresses .btn-outline-primary::before,
body#address .btn-outline-primary::before,
body#identity .btn-outline-primary::before,
body#history .btn-outline-primary::before,
body#discount .btn-outline-primary::before,
body#module-blockwishlist-lists .btn-outline-primary::before{
  content:"";position:absolute;inset:0;background:var(--encre);transform:scaleY(0);transform-origin:bottom;
  transition:transform .4s var(--ease);z-index:-1;
}body#authentication .btn-outline-primary:hover,
body#addresses .btn-outline-primary:hover,
body#address .btn-outline-primary:hover,
body#identity .btn-outline-primary:hover,
body#history .btn-outline-primary:hover,
body#discount .btn-outline-primary:hover,
body#module-blockwishlist-lists .btn-outline-primary:hover{
  color:var(--papier) !important;
}body#authentication .btn-outline-primary:hover::before,
body#addresses .btn-outline-primary:hover::before,
body#address .btn-outline-primary:hover::before,
body#identity .btn-outline-primary:hover::before,
body#history .btn-outline-primary:hover::before,
body#discount .btn-outline-primary:hover::before,
body#module-blockwishlist-lists .btn-outline-primary:hover::before{
  transform:scaleY(1);
}body#authentication .material-icons,
body#addresses .material-icons,
body#address .material-icons,
body#identity .material-icons,
body#history .material-icons,
body#discount .material-icons,
body#module-psgdpr-gdpr .material-icons,
body#module-blockwishlist-lists .material-icons{color:var(--acier)}
/* Liste d'envies (blockwishlist) */
body#module-blockwishlist-lists .wishlist-view-table,
body#module-blockwishlist-lists .wishlist-products{color:var(--encre)}
/* GDPR (psgdpr) */
body#module-psgdpr-gdpr .psgdprinfo,body#module-psgdpr-gdpr .form-check-label{color:var(--ink-soft) !important}

/* =========================================================
   Dropdown "Mon compte" du header (icône connecté) : le panneau
   Bootstrap garde son fond clair par défaut alors que .nav__blocks
   force le texte en blanc — texte blanc sur fond blanc, invisible.
   On aligne le panneau sur la charte sombre de la nav, comme
   .search-widgets__dropdown et .blockcart-modal.
   ========================================================= */
.nav__blocks .dropdown-menu{
  background:var(--encre) !important;color:var(--papier) !important;
  border:1px solid rgba(243,239,231,.14) !important;border-radius:0 !important;
  padding:8px 0 !important;box-shadow:0 24px 60px -20px rgba(0,0,0,.6) !important;
}
.nav__blocks .dropdown-menu .dropdown-item,.nav__blocks .dropdown-menu a{
  color:var(--paper-soft) !important;font-family:var(--mono) !important;font-size:.68rem;
  letter-spacing:.1em;text-transform:uppercase;padding:10px 18px !important;
  transition:color .3s,background .3s;background:transparent !important;
}
/* :visited isolé (couleur seule) : les autres propriétés ci-dessus ne
   sont pas "sûres" pour ce pseudo-état côté navigateur et seraient
   silencieusement ignorées si groupées dans la même règle. */
.nav__blocks .dropdown-menu a:visited{color:var(--paper-soft) !important}
/* :active manquait -> au clic, le lien retombait sur le bleu par défaut
   du navigateur (non couvert par :hover/:focus seuls). Survol et clic en
   rouge sang, comme demandé. */
.nav__blocks .dropdown-menu .dropdown-item:hover,.nav__blocks .dropdown-menu a:hover,
.nav__blocks .dropdown-menu .dropdown-item:focus,.nav__blocks .dropdown-menu a:focus,
.nav__blocks .dropdown-menu .dropdown-item:active,.nav__blocks .dropdown-menu a:active,
.nav__blocks .dropdown-menu .dropdown-item.active{
  color:var(--sang-2) !important;background:rgba(243,239,231,.06) !important;
}
.nav__blocks .dropdown-menu .dropdown-divider{border-color:var(--border-dark) !important;opacity:1}

/* Le header (#nav) est transparent par défaut et ne devient sombre
   qu'au scroll (.is-solid) ou visuellement grâce au hero sombre en
   dessous. Sur les pages compte à fond clair (identité/adresses/
   historique…), il n'y a ni hero ni scroll au chargement : le texte
   blanc du logo/nav se retrouvait sur fond clair, illisible. On applique
   le même traitement que .is-solid en permanence sur ces pages. Le
   tunnel de commande (body#checkout) est désormais sombre lui aussi et
   n'a plus besoin de ce correctif. */
body#authentication #nav,body#addresses #nav,body#address #nav,
body#identity #nav,body#history #nav,body#order #nav,body#order-detail #nav,
body#order-slip #nav,body#discount #nav,body#module-psgdpr-gdpr #nav,
body#module-blockwishlist-lists #nav{
  background:rgba(23,19,15,.86) !important;backdrop-filter:blur(9px);
  padding-top:14px !important;padding-bottom:14px !important;
  border-bottom:1px solid rgba(243,239,231,.1);
}

/* =========================================================
   Messages système (#notifications) — succès / erreur / avertissement /
   info. Boîtes pleine couleur charte plutôt que les alertes Bootstrap
   pâles héritées de l'ancien thème ; l'erreur est la plus appuyée
   (fond sang, texte papier gras) pour rester lisible immédiatement.
   Portée globale : ces messages apparaissent sur toutes les pages
   (connexion, formulaires, panier…), pas seulement le compte client.
   ========================================================= */
#notifications{margin:0}
#notifications .container{max-width:var(--maxw);margin:0 auto;padding:14px var(--gutter) 0}
#notifications .alert,#notifications [data-alert]{
  border:none !important;border-radius:0 !important;box-shadow:none !important;
  padding:16px 20px !important;margin-bottom:12px !important;
  font-family:var(--body) !important;font-size:.95rem;line-height:1.5;
}
#notifications .alert ul,#notifications [data-alert] ul{margin:0 !important;padding-left:20px}
#notifications [data-alert="danger"]{
  background:var(--sang) !important;color:var(--papier) !important;font-weight:700 !important;
  border-left:4px solid var(--encre) !important;
}
#notifications [data-alert="danger"] a{color:var(--papier) !important;text-decoration:underline}
#notifications [data-alert="warning"]{
  background:var(--or) !important;color:var(--encre) !important;font-weight:600 !important;
}
#notifications [data-alert="success"]{
  background:var(--encre) !important;color:var(--papier) !important;
  border-left:4px solid var(--or) !important;
}
#notifications [data-alert="info"]{
  background:var(--papier-2) !important;color:var(--encre) !important;border:1px solid var(--border-light) !important;
}
/* Erreurs de formulaire inline (sous les champs) — même rouge, sans la
   boîte pleine couleur, pour rester lisibles au fil du formulaire. */
.form-control.is-invalid,.form-select.is-invalid,.invalid-feedback{border-color:var(--sang) !important}
.invalid-feedback{color:var(--sang) !important;font-family:var(--mono) !important;font-size:.72rem;
  letter-spacing:.04em;font-weight:600;margin-top:6px !important;display:block !important}
.alert-danger,.alert.alert-danger{background:var(--sang) !important;color:var(--papier) !important;
  font-weight:700 !important;border:none !important;border-radius:0 !important}

/* =========================================================
   Garde-fou anti-bleu Bootstrap — le custom.css de l'ancien thème et
   les composants Bootstrap par défaut réintroduisent le bleu
   (--bs-primary) sur les états actifs/focus (pagination, onglets,
   sélections) partout où on ne l'a pas explicitement recouvert.
   ========================================================= */
.page-item.active .page-link,.page-link.active{
  background-color:var(--sang) !important;border-color:var(--sang) !important;color:var(--papier) !important;
}
.page-link{color:var(--encre)}
.page-link:hover{color:var(--sang);background:rgba(124,21,23,.06)}
.nav-pills .nav-link.active,.nav-tabs .nav-link.active{
  background-color:var(--sang) !important;color:var(--papier) !important;border-color:var(--sang) !important;
}
.form-control:focus,.form-select:focus,.form-check-input:focus{
  border-color:var(--sang) !important;box-shadow:0 0 0 3px rgba(124,21,23,.12) !important;
}
.badge.bg-primary,.badge.rounded-pill.bg-primary{background-color:var(--sang) !important}
/* Onglet "Commander en tant qu'invité / Connexion" : hérite un fond
   sang de nos règles .btn-primary globales sans le texte clair associé
   -> texte encre sur fond sang, peu lisible. */
.nav-tabs .nav-link{color:var(--papier) !important;font-family:var(--mono) !important;
  font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;border-radius:0 !important}

/* =========================================================
   Tunnel de commande (/commande) — même charte sombre que l'accueil et
   le panier, pour une continuité visuelle complète du parcours d'achat
   (hero → catalogue → panier → commande), plutôt qu'un fond clair isolé.
   ========================================================= */
body#checkout{background:var(--encre) !important}
body#checkout .container{max-width:var(--maxw) !important;padding-left:var(--gutter) !important;padding-right:var(--gutter) !important}
body#checkout,body#checkout p,body#checkout li,body#checkout td{font-family:var(--body) !important;color:var(--papier)}
body#checkout h1,body#checkout h2,body#checkout .h4{font-family:var(--serif) !important;color:var(--papier) !important;font-weight:600}

/* Bandeau étapes (1 Informations / 2 Adresses / 3 Livraison / 4 Paiement) */
/* checkout.tpl surcharge le bloc content_columns du thème parent en
   entier (au lieu du seul bloc content) : #content-wrapper — sur lequel
   repose la marge qui dégage la nav fixe sur toutes les autres pages —
   n'existe donc jamais ici. On redonne cette même marge directement au
   bandeau, seul élément réellement en tête de page ici. */
.checkout__steps{
  background:var(--encre) !important;border-color:var(--border-dark) !important;
  margin-top:clamp(90px,11vh,130px) !important;
}
/* Le vrai bug de centrage n'était pas une histoire de marge : le
   composant Bootstrap porte la classe générique "nav" (héritée de
   nav-tabs), qui collisionnait avec notre #nav de header (position:fixed
   top:0 left:0 width:100%). Corrigé en scopant notre nav de header sur
   #nav plutôt que .nav (cf. section Navigation plus haut) ; le
   margin:auto natif du thème parent suffit maintenant à centrer
   .checkout__steps__list normalement. */
.checkout__steps__number{background:var(--border-dark) !important;color:var(--papier) !important}
.checkout__steps__text{color:var(--paper-fade) !important;font-family:var(--mono) !important;
  font-size:.64rem !important;letter-spacing:.1em;font-weight:400 !important}
.checkout__steps__item:before,.checkout__steps__item:after{background:var(--border-dark) !important}
.checkout__steps--current .checkout__steps__number{background:var(--papier) !important;color:var(--encre) !important}
.checkout__steps--current .checkout__steps__text{color:var(--papier) !important;font-weight:600 !important}
.checkout__steps--success .checkout__steps__number,.checkout__steps--current:before{background:var(--sang-2) !important}
.checkout__steps--success .checkout__steps__text{color:var(--sang-2) !important}
.checkout__steps--success:after,.checkout__steps--success:before{background:var(--sang-2) !important}
.checkout__steps .nav-tabs .checkout__steps--success .nav-link.active{color:var(--sang-2) !important;background:transparent !important}
.checkout__steps .nav-tabs .checkout__steps--current .nav-link.active{color:var(--papier) !important;background:transparent !important}
.checkout__steps__text.nav-link{background:transparent !important}

/* Colonne de gauche (étapes) / droite (récap) */
body#checkout .card{background:transparent !important;border:1px solid var(--border-dark) !important;
  border-radius:0 !important;box-shadow:none !important;color:var(--papier)}
body#checkout .accordion,body#checkout .accordion-item,body#checkout .accordion-button{
  background:transparent !important;color:var(--papier) !important;box-shadow:none !important;
}
body#checkout .accordion-button{font-family:var(--mono) !important;font-size:.72rem;letter-spacing:.1em;
  text-transform:uppercase;border-bottom:1px solid var(--border-dark) !important}

/* Formulaires (informations personnelles, adresses) — perdaient leur
   habillage en sortant du groupe partagé "pages compte" (désormais
   claires) : rétablis ici en sombre, comme le reste du tunnel. */
body#checkout .form-label{color:var(--paper-soft) !important;font-family:var(--mono);font-size:.7rem;
  letter-spacing:.1em;text-transform:uppercase}
body#checkout .form-control,body#checkout .form-select{
  background:transparent !important;border:1px solid var(--border-dark) !important;color:var(--papier) !important;
  border-radius:0 !important;box-shadow:none !important;transition:border-color .3s;
}
body#checkout .form-control:focus,body#checkout .form-select:focus{
  border-color:var(--sang-2) !important;box-shadow:0 0 0 3px rgba(154,28,30,.16) !important;
}
body#checkout .form-control::placeholder{color:var(--paper-fade) !important}
body#checkout .form-check-input{border-color:var(--border-dark) !important}
body#checkout .form-check-input:checked{background-color:var(--sang-2) !important;border-color:var(--sang-2) !important}
body#checkout .form-check-label{color:var(--paper-soft) !important}
body#checkout a{color:var(--sang-2)}
body#checkout .btn-outline-primary{
  font-family:var(--mono) !important;font-size:.7rem !important;letter-spacing:.14em;text-transform:uppercase;
  border-radius:0 !important;position:relative;overflow:hidden;isolation:isolate;
  color:var(--papier) !important;border-color:var(--papier) !important;background:transparent !important;
  transition:color .4s var(--ease) !important;
}
body#checkout .btn-outline-primary::before{
  content:"";position:absolute;inset:0;background:var(--papier);transform:scaleY(0);transform-origin:bottom;
  transition:transform .4s var(--ease);z-index:-1;
}
body#checkout .btn-outline-primary:hover{color:var(--encre) !important}
body#checkout .btn-outline-primary:hover::before{transform:scaleY(1)}
body#checkout .material-icons{color:var(--paper-soft)}

/* Récap panier (partagé avec la page panier) */
body#checkout .cart-summary,body#checkout .cart-summary-products{color:var(--papier)}
body#checkout .cart-summary-product-line,body#checkout .media{border-color:var(--border-dark) !important}
body#checkout .cart-summary-line,body#checkout .cart-summary__label{
  font-family:var(--mono) !important;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--paper-soft) !important;
}
body#checkout .cart-summary-line .value,body#checkout .cart-summary__value{
  font-family:var(--mono) !important;color:var(--papier) !important;font-weight:600;
}
body#checkout .cart-total,body#checkout .cart-summary-line--total{
  font-family:var(--serif) !important;font-size:1.1rem !important;color:var(--papier) !important;font-weight:700;
}
body#checkout hr{border-color:var(--border-dark) !important;opacity:1}

/* Étape Livraison : liste des transporteurs, sans dépendre d'une classe
   dédiée du thème parent (il n'y en a pas — tout repose sur la grille
   Bootstrap .row/.col-*). On habille le conteneur et on force le widget
   "Locker / Point Relais" du transporteur à rester DANS son propre bloc,
   sous la ligne principale, au lieu de chevaucher le texte au-dessus. */
.delivery-options__container{max-width:100%}
.delivery-options__list{background:transparent !important;border:1px solid var(--border-dark) !important;
  border-radius:0 !important;padding:6px var(--gutter) !important;}
.delivery-options__item{padding:22px 4px}
.delivery-options__item hr{border-color:var(--border-dark) !important;opacity:1;margin:0}
.delivery-options__item label{cursor:pointer;width:100%}
.delivery-options__item .row{row-gap:8px;align-items:center}
.carrier-name{font-family:var(--serif) !important;font-style:italic;color:var(--papier) !important;font-weight:600;font-size:1.05rem}
.delivery-option__center,.delivery-option__right{font-family:var(--mono) !important;font-size:.78rem;color:var(--paper-soft);letter-spacing:.02em}
.delivery-option__right{text-align:right}
@media (min-width:576px){.delivery-option__right{justify-content:flex-end}}
.delivery-option__right{color:var(--sang-2) !important;font-weight:600}
.carrier__extra-content-wrapper{
  display:block;clear:both;width:100%;margin-top:14px;
}
/* max-height:none plutôt qu'une valeur fixe : le widget Mondial Relay
   (liste de points relais / carte) peut dépasser n'importe quelle limite
   arbitraire — mieux vaut perdre la transition d'ouverture que risquer
   de couper le widget et casser son usage. */
.carrier__extra-content-wrapper--active{
  max-height:none !important;
}
.carrier__extra-content{
  padding:16px;background:var(--encre-2) !important;border:1px solid var(--border-dark) !important;
  color:var(--papier);overflow:visible;
}
.carrier__extra-content .btn{margin-top:8px;max-width:100%;white-space:normal !important;word-break:break-word}
/* "Utiliser ce locker" et "Changer de locker" viennent de deux <div>
   distinctes et non adjacentes du module Mondial Relay
   (#mondialrelay_save-container et #mondialrelay_result > #mondialrelay_summary
   > .col-md-12.clearfix) : pas un bug CSS, leur structure HTML natives les
   empile en blocs sans lien entre elles. display:contents "aplatit" les
   conteneurs intermédiaires pour que les deux boutons deviennent frères
   directs dans une même grille flex, et order les regroupe côte à côte
   après le bloc d'adresse. */
#mondialrelay_content{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start}
#mondialrelay_widget,#mondialrelay_errors{flex:1 1 100%;order:0}
/* Le widget pose style="display:none" en dur sur ce conteneur et ne le
   retire jamais lui-même (seuls les boutons individuels à l'intérieur
   sont togglés en JS) — sans !important, notre display:contents externe
   perdait face à ce style inline, et le bouton "Utiliser ce locker"
   restait invisible (rect 0,0) même une fois sélectionné. */
#mondialrelay_save-container{display:contents !important}
#mondialrelay_result{display:contents}
#mondialrelay_summary{display:contents}
#mondialrelay_summary .col-md-12.clearfix{display:contents}
#mondialrelay_summary .pull-left{flex:1 1 100%;order:1;float:none}
.mondialrelay_save-relay,.mondialrelay_change-relay{
  order:2;flex:0 1 auto;margin:0;
}

/* Cases à cocher / radios natives (paiement, CGV, civilité…) : le
   background-color ciblé sur :checked ne s'applique pas de façon fiable
   au rendu natif d'un <input radio/checkbox> selon les navigateurs —
   accent-color est la propriété standard pour ça. */
body#authentication input[type="radio"],body#authentication input[type="checkbox"],
body#addresses input[type="radio"],body#addresses input[type="checkbox"],
body#address input[type="radio"],body#address input[type="checkbox"],
body#identity input[type="radio"],body#identity input[type="checkbox"]{
  accent-color:var(--sang);width:1.1em;height:1.1em;cursor:pointer;
}

/* Étape Paiement : options en lignes nettes, logos de moyens de paiement
   (PayPal, cartes, Alma…) alignés sans être recolorés — ce sont des
   éléments de confiance, on les encadre plutôt qu'on ne les repeint. */
.payment__option{padding:16px 4px;border-bottom:1px solid var(--border-dark)}
.payment__option:last-of-type{border-bottom:none}
.payment__option .form-check-label{font-family:var(--body) !important;color:var(--papier) !important;font-size:1rem}
.payment__option img{max-height:28px;width:auto;object-fit:contain}
.payment__definitions,.additional-information{
  font-family:var(--body) !important;color:var(--paper-soft) !important;font-size:.9rem;
  padding:14px 16px !important;background:var(--encre-2) !important;border:1px solid var(--border-dark) !important;margin-top:10px;
}
#conditions-to-approve .form-check-label{font-size:.88rem;color:var(--paper-soft) !important}
#conditions-to-approve .form-check-label a{color:var(--sang-2) !important;text-decoration:underline}

/* Bouton de commande désactivé (aucun moyen de paiement sélectionné) :
   état clairement "inactif" plutôt qu'un rouge délavé qui ressemble à
   un bug ou à un bouton actif mal chargé. */
body#checkout .btn-primary.disabled,body#checkout .btn.disabled,
body#checkout .btn-primary:disabled{
  background:var(--border-dark) !important;border-color:var(--border-dark) !important;
  color:var(--paper-fade) !important;opacity:1 !important;cursor:not-allowed;
}

/* Icônes/chevrons du récap panier ("Afficher les détails", "Code
   promo") : héritaient le bleu Bootstrap par défaut, jamais recouvert. */
body#checkout .cart-summary__show .material-icons,
body#checkout .cart-summary .material-icons,
body#checkout [data-bs-toggle="collapse"] .material-icons{
  color:var(--paper-soft) !important;
}

body#checkout .btn-with-icon{gap:8px}
body#checkout .btn-with-icon .material-icons{font-size:16px}
body#checkout input[type="radio"],body#checkout input[type="checkbox"]{
  accent-color:var(--sang-2);width:1.1em;height:1.1em;cursor:pointer;
}

/* =========================================================
   Fiche produit — hero (phero/pgallery/pinfo), gabarit de référence
   ========================================================= */
.phero{position:relative;background:var(--encre);color:var(--papier);overflow:hidden}
.phero__grid{position:relative;z-index:3;max-width:var(--maxw);margin:0 auto;
  padding:36px var(--gutter) clamp(60px,8vw,110px);
  display:grid;grid-template-columns:minmax(360px,560px) 1fr minmax(200px,240px);gap:48px;align-items:start}
@media (max-width:1200px){.phero__grid{grid-template-columns:1fr;gap:36px;padding-top:24px}}

.pgallery{margin:0}
.product__images{aspect-ratio:3/4 !important;border:none !important;box-shadow:none !important}
.product__images .carousel-item img{cursor:zoom-in}

.pinfo__title{font-family:var(--serif) !important;font-size:clamp(1.6rem,3.36vw,2.72rem) !important;font-weight:600 !important;
  line-height:1.08 !important;margin:20px 0 18px !important;color:var(--papier)}
.pinfo__title em{font-style:italic;color:var(--sang-2)}
.pinfo__lead{font-family:var(--serif);font-style:italic;font-size:1.18rem;line-height:1.5;
  color:var(--paper-soft) !important;max-width:46ch;margin-bottom:0}

/* Nuances de matière — swatch rond réel (déjà branché via color_type de PrestaShop) */
.product__variants .color-variant label{display:flex;align-items:center;gap:10px}
.product__variants .color{width:30px;height:30px;border-radius:50%;display:inline-block;border:1px solid rgba(243,239,231,.3)}

.pspecs,.product__specs{display:flex;gap:10px;flex-wrap:wrap;margin:24px 0 0;color:var(--paper-fade);font-size:.6rem;list-style:none;padding:0}
.pspecs li,.product__specs li{border:1px solid rgba(243,239,231,.16);padding:7px 12px}

/* Barre de stock réel (remplace le compteur fictif) */
.turn__stock{margin-top:26px;padding:22px 24px;max-width:none;display:flex;flex-direction:column;gap:10px;
  border:1px solid rgba(243,239,231,.14)}

/* =========================================================
   Section Histoire — vraie description, mise en page éditoriale
   ========================================================= */
.histoire{position:relative;background:var(--papier)}
.histoire__grid{max-width:var(--maxw);margin:0 auto;padding:clamp(60px,8vw,110px) var(--gutter);
  display:grid;grid-template-columns:.6fr 1.4fr;gap:clamp(40px,6vw,80px);align-items:center}
.histoire__figure{position:relative;aspect-ratio:3/4;overflow:hidden;max-width:340px;margin-inline:auto;
  border:1px solid rgba(23,19,15,.14);box-shadow:0 40px 90px -30px rgba(23,19,15,.35)}
.histoire__figure img{width:100%;height:100%;object-fit:cover;filter:var(--duo-pierre)}
.histoire__title{font-size:clamp(2.6rem,5vw,4.4rem) !important;margin-bottom:26px !important;color:var(--encre)}
.histoire__title em{font-style:italic;color:var(--sang)}
.histoire__body{font-size:1.14rem;line-height:1.65;color:rgba(23,19,15,.82)}
.histoire__body p{margin-bottom:18px}
.histoire__body em{font-style:italic;color:var(--sang)}
@media (max-width:1024px){.histoire__grid{grid-template-columns:1fr;gap:30px}}

/* Frise chronologique — Napoléon uniquement */
.ptimeline{display:flex;flex-wrap:wrap;gap:0;margin-top:24px;list-style:none;
  border-top:1px solid var(--border-light);padding:0}
.ptimeline li{display:flex;flex-direction:column;gap:6px;padding:18px 28px 0 0;
  margin-right:28px;position:relative;font-size:.62rem;letter-spacing:.14em;color:var(--ink-soft)}
.ptimeline li::before{content:"";position:absolute;top:-1px;left:0;width:34px;height:2px;background:var(--sang)}
.ptimeline__y{color:var(--acier);font-size:.62rem;display:block}
.ptimeline .is-sang{color:var(--sang)}

/* =========================================================
   Section La pièce & Livraison — visualiseur 3D central
   ========================================================= */
.showcase{position:relative;overflow:hidden;background:var(--sang)}
.showcase::before{content:"";position:absolute;inset:0;opacity:.14;pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(23,19,15,.6) 3px 4px)}
.showcase__grid{max-width:var(--maxw);margin:0 auto;position:relative;z-index:1;
  display:grid;grid-template-columns:1fr minmax(340px,480px) 1fr;align-items:stretch}
.showcase__col{display:flex;flex-direction:column;justify-content:center;gap:2px;
  padding:clamp(40px,6vw,70px) clamp(24px,3vw,44px);position:relative}
.showcase__col--dark{background:#241a12;color:var(--papier)}
.showcase__col--light{background:var(--papier-2)}
.showcase__label{position:relative;z-index:1;display:block;font-size:.62rem;letter-spacing:.22em;margin-bottom:16px}
.showcase__col--dark .showcase__label{color:var(--or)}
.showcase__col--light .showcase__label{color:var(--sang)}
.showcase__item{position:relative;z-index:1;padding:16px 18px;display:flex;flex-direction:column;gap:6px;
  transition:transform .35s var(--ease),background .35s var(--ease)}
.showcase__col--dark .showcase__item:hover{background:rgba(243,239,231,.05);transform:translateX(-6px)}
.showcase__col--light .showcase__item:hover{background:rgba(23,19,15,.04);transform:translateX(6px)}
.showcase__item .pcol__n{font-size:.72rem;letter-spacing:.18em;position:relative;
  display:inline-block;padding-bottom:8px;transition:color .3s var(--ease)}
.showcase__item .pcol__n::after{content:"";position:absolute;left:0;bottom:0;width:20px;height:2px;
  transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.showcase__item:hover .pcol__n::after{transform:scaleX(1)}
.showcase__col--dark .pcol__n{color:var(--acier)}
.showcase__col--dark .pcol__n::after{background:var(--sang-2)}
.showcase__col--light .pcol__n{color:var(--sang)}
.showcase__col--light .pcol__n::after{background:var(--sang)}
.showcase__item h3{font-size:1.08rem;font-weight:600 !important;font-family:'Cormorant Garamond',Perpetua,'EB Garamond',Georgia,serif !important}
.showcase__col--dark .showcase__item h3{color:var(--papier)}
.showcase__col--light .showcase__item h3{color:var(--encre)}
.showcase__item p{font-size:.84rem;line-height:1.45}
.showcase__col--dark .showcase__item p{color:var(--paper-soft)}
.showcase__col--light .showcase__item p{color:var(--ink-soft)}
.showcase__viewer{position:relative;z-index:1;padding:clamp(40px,5vw,60px) 30px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--encre)}
.showcase__viewer .pviewer{width:100%;max-width:420px}
.showcase__viewer .pviewer__label{text-align:center;color:var(--acier);font-size:.58rem;letter-spacing:.2em;margin-bottom:10px}
.pviewer{position:relative}
.pviewer__stage{position:relative;aspect-ratio:1;border:1px solid var(--border-dark);overflow:hidden;
  box-shadow:0 30px 70px -26px rgba(0,0,0,.75);
  background:radial-gradient(circle at 50% 42%, rgba(169,138,80,.18), rgba(23,19,15,.96) 72%);
  cursor:grab;touch-action:none;user-select:none}
.pviewer__stage.is-dragging{cursor:grabbing}
.pviewer__canvas,.pviewer__fallback{width:100%;height:100%;object-fit:contain;pointer-events:none;filter:contrast(1.03) saturate(.98)}
.pviewer__deg{position:absolute;top:14px;right:14px;color:var(--sang-2);font-size:.8rem;font-variant-numeric:tabular-nums;pointer-events:none}
.pviewer__hint{position:absolute;left:0;right:0;bottom:14px;display:flex;align-items:center;justify-content:center;gap:8px;
  color:var(--paper-fade);font-size:.56rem;letter-spacing:.14em;pointer-events:none;transition:opacity .4s var(--ease)}
.pviewer__hint i{width:16px;height:16px;border:1px solid currentColor;border-radius:50%;position:relative;animation:pviewerHint 1.8s ease-in-out infinite}
.pviewer__hint.is-hidden{opacity:0}
@keyframes pviewerHint{0%,100%{transform:translateX(-3px)}50%{transform:translateX(3px)}}
.showcase__col--dark [data-rise]{transform:translateX(-36px)}
.showcase__col--light [data-rise]{transform:translateX(36px)}
.showcase__col--dark [data-rise].is-in,.showcase__col--light [data-rise].is-in{transform:none}
@media (max-width:1024px){.showcase__grid{grid-template-columns:1fr}.showcase__viewer{order:-1}}

/* Bouton "Donnez votre avis" (module productcomments, .post-product-comment
   sur le bouton d'ouverture ET son doublon dans .additional-links) —
   retiré des fiches produit, jugé inutile. Le lien "Lire les avis"
   (.link-comment sans la classe post-product-comment) reste affiché. */
.post-product-comment{display:none !important}

/* Onglets description / détails / avis -> style presse charte */
.product__infos{background:var(--papier);color:var(--encre);max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter) clamp(60px,8vw,110px)}
.product__infos .accordion-item{border:none;border-bottom:1px solid var(--border-light);background:none}
.product__infos .accordion-button{font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;
  background:none;color:var(--encre);padding:22px 4px;box-shadow:none}
.product__infos .accordion-button:not(.collapsed){color:var(--sang)}
.product__infos .accordion-button::after{filter:none}
.product__infos .accordion-body{font-family:var(--body);font-size:1.05rem;line-height:1.6;color:var(--ink-soft);padding:0 4px 26px}
.product__details,.product__features{list-style:none;padding:0;margin:0}
.detail{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--border-light)}
.detail__title{color:var(--ink-soft);font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase}

/* Stock / urgence — réutilisation du bandeau charte avec vraies données */
.product__stockbar{margin-top:26px;padding:22px 24px;border:1px solid rgba(243,239,231,.14);
  background:linear-gradient(155deg, rgba(243,239,231,.05), transparent)}
.product__stockbar-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;color:var(--paper-soft);font-family:var(--mono);font-size:.72rem;letter-spacing:.1em}
.product__stockbar-row .is-or{color:var(--sang-2);font-size:1.05rem;font-weight:700}
.product__stockbar-bar{height:3px;width:100%;background:rgba(243,239,231,.2);margin-top:10px}
.product__stockbar-bar i{display:block;height:3px;background:var(--sang-2)}

/* Barre d'achat sticky mobile */
.psticky{display:none}
@media (max-width:900px){
  body#product{padding-bottom:78px}
  .psticky{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:850;
    align-items:center;justify-content:space-between;gap:14px;
    padding:12px var(--gutter);background:rgba(23,19,15,.94);backdrop-filter:blur(10px);
    border-top:1px solid rgba(243,239,231,.14)}
  .psticky__info{display:flex;flex-direction:column;color:var(--papier);min-width:0}
  .psticky__name{font-family:var(--serif);font-size:.98rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .psticky__price{color:var(--sang-2);font-size:.72rem;font-weight:700;margin-top:2px}
  .psticky .btn{padding:12px 18px;font-size:.62rem;white-space:nowrap;flex-shrink:0}
}

/* =========================================================
   Petits composants natifs — toasts, loader
   ========================================================= */
.toast{background:var(--encre);color:var(--papier);border:1px solid rgba(243,239,231,.14);font-family:var(--body)}
.js-page-loading-overlay,.page-loader{background:rgba(23,19,15,.7)}
/* Le spinner de chargement (affiché pendant l'appel AJAX de suppression
   d'un article, entre autres) est bleu par défaut Bootstrap (.text-primary,
   avec !important) — d'où le trait/anneau bleu aperçu près du bouton
   "Retirer" pendant la requête. Recoloré aux teintes de la charte. */
.page-loader .spinner-border,.spinner-border.text-primary,.text-primary{color:var(--sang) !important}
.cart-count{background:var(--papier);color:var(--sang)}

/* =========================================================
   ACCUEIL — Héros
   ========================================================= */
body#index #wrapper,body#index #content-wrapper,
body#product #wrapper,body#product #content-wrapper{padding:0;margin:0;max-width:none}
body#index .container,body#product .container{max-width:none;padding:0}
.hero{position:relative;min-height:100svh;background:var(--encre);color:var(--papier);
  display:flex;flex-direction:column;justify-content:flex-end;padding:0 var(--gutter) 0;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;
  background:radial-gradient(120% 90% at 78% 8%, rgba(169,138,80,.10), transparent 55%),
             radial-gradient(80% 70% at 12% 100%, rgba(124,21,23,.14), transparent 60%);pointer-events:none}
.hero__diagonal{position:absolute;top:-10%;left:58%;width:2px;height:130%;
  background:linear-gradient(180deg, #9E1B1B, #5c0f11);transform:rotate(9deg);transform-origin:top;
  box-shadow:0 0 14px rgba(124,21,23,.5);opacity:.82;z-index:2}
.hero__grid{position:relative;z-index:3;flex:1;display:grid;grid-template-columns:1.05fr .95fr;
  gap:40px;align-items:center;max-width:var(--maxw);width:100%;margin:0 auto;padding-top:130px}
.hero__title{font-size:clamp(2.8rem,6.6vw,6.6rem);margin:24px 0 28px;font-weight:600}
.hero__title .line{display:block;overflow:visible}
.hero__title em{font-style:italic;color:var(--papier)}
.hero__sub{color:var(--paper-soft);font-size:1.15rem;max-width:42ch;line-height:1.55}
.hero__note{color:var(--paper-soft);font-family:var(--serif);font-style:italic;font-size:1.18rem;
  max-width:44ch;margin-top:16px;line-height:1.5}
.hero__actions{display:flex;gap:16px;margin-top:38px;flex-wrap:wrap}
.hero__actions .btn--ghost,.hero__actions a.btn--ghost{color:var(--papier) !important}
.hero__actions .btn--ghost::before{background:var(--papier)}
.hero__actions .btn--ghost:hover,.hero__actions a.btn--ghost:hover{color:var(--encre) !important}

.hero__figure{position:relative;justify-self:end;width:100%;max-width:440px}
.hero__plate{position:relative;aspect-ratio:3/4;border:1px solid var(--border-dark);overflow:hidden;
  box-shadow:0 40px 90px -30px rgba(0,0,0,.8)}
.hero__plate img{width:100%;height:110%;object-fit:cover;object-position:center;filter:var(--duo-pierre)}
.hero__plate::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(23,19,15,.65))}
.hero__caption{position:absolute;left:14px;bottom:14px;z-index:2;color:var(--paper-soft);font-size:.58rem}
.hero__badge{position:absolute;top:14px;right:14px;z-index:2;color:var(--or);font-size:.62rem}
.hero__price{position:absolute;top:80px;left:14px;z-index:3;display:flex;flex-direction:column;gap:3px;
  background:var(--sang);color:var(--papier);padding:9px 13px;border:1px solid rgba(243,239,231,.22);
  box-shadow:0 10px 24px -10px rgba(0,0,0,.7)}
.hero__price-label{font-size:.5rem;letter-spacing:.2em;opacity:.85}
.hero__price-value{font-size:1.05rem;font-weight:700;letter-spacing:.03em;text-transform:none}
.hero__plate--art{aspect-ratio:2/3}
.hero__plate--art img{height:100%;filter:none;transition:filter .5s var(--ease)}
@media (hover:hover){.hero__plate--art:hover img{filter:invert(1) contrast(1.05)}}
.hero__plate--art.is-inverted img{filter:invert(1) contrast(1.05)}
.hero__buy{position:absolute;left:0;right:0;bottom:0;z-index:3;display:flex;align-items:center;
  justify-content:center;gap:10px;padding:16px 14px;background:var(--sang);color:var(--papier);
  font-size:.64rem;letter-spacing:.2em;text-align:center;transition:background .3s,padding .3s var(--ease)}
.hero__buy:hover{background:var(--encre);padding-left:22px;padding-right:22px}
.hero__buy i{transition:transform .35s var(--ease)}
.hero__buy:hover i{transform:translateX(5px)}
.hero__side{position:absolute;top:0;right:-14px;transform:translateX(100%);
  display:flex;flex-direction:column;gap:16px;writing-mode:vertical-rl;
  font-size:.58rem;color:var(--paper-fade);letter-spacing:.24em}
.hero__foot{position:relative;z-index:3;display:flex;justify-content:space-between;align-items:center;
  max-width:var(--maxw);width:100%;margin:0 auto;padding:26px 0 30px;color:var(--paper-fade);
  border-top:1px solid rgba(243,239,231,.12);margin-top:60px}
.hero__scroll{display:inline-flex;align-items:center;gap:10px;color:var(--paper-soft)}
.hero__scroll i{width:22px;height:22px;border:1px solid currentColor;border-radius:50%;position:relative}
.hero__scroll i::after{content:"";position:absolute;left:50%;top:6px;width:1px;height:7px;background:currentColor;
  transform:translateX(-50%);animation:scrolldot 1.6s var(--ease) infinite}
@keyframes scrolldot{0%{opacity:0;transform:translate(-50%,-4px)}40%{opacity:1}100%{opacity:0;transform:translate(-50%,6px)}}

/* =========================================================
   Bandeau défilant
   ========================================================= */
.marquee{background:var(--sang);color:var(--papier);overflow:hidden;padding:16px 0;
  position:relative;border-top:1px solid rgba(23,19,15,.2);border-bottom:1px solid rgba(23,19,15,.2)}
.marquee::before{content:"";position:absolute;inset:0;opacity:.14;pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(23,19,15,.6) 3px 4px)}
.marquee__track{display:flex;white-space:nowrap;width:max-content;animation:marq 34s linear infinite}
.marquee__track span{font-family:var(--serif);font-size:clamp(1.4rem,3vw,2.2rem);font-style:italic;padding-right:1ch}
.marquee__track b{color:var(--or);font-style:normal;margin:0 .3ch}
@keyframes marq{to{transform:translateX(-50%)}}

/* =========================================================
   Manifeste
   ========================================================= */
.manifesto{background:var(--papier);position:relative}
.manifesto::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background:radial-gradient(60% 50% at 80% 10%, rgba(115,124,135,.10), transparent 60%)}
.manifesto__row{max-width:var(--maxw);margin:0 auto;padding:clamp(50px,7vw,90px) var(--gutter) clamp(14px,2vw,24px);
  display:grid;grid-template-columns:1fr 225px;gap:50px;align-items:start}
.manifesto__grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:44px;align-items:start;position:relative}
.manifesto__title{font-size:clamp(2.8rem,6.2vw,5.2rem)}
.manifesto__title em{font-style:italic;color:var(--sang)}
.manifesto__body{padding-left:26px;border-left:2px solid var(--sang-2)}
.manifesto__body p{font-size:1.16rem;line-height:1.6;color:rgba(23,19,15,.82)}
.manifesto__body em{font-style:italic;color:var(--sang)}

/* Insert — Cénacle des Lys */
.cenacle{position:relative;width:225px;height:391px;overflow:hidden;
  border:1px solid rgba(28,58,56,.4);flex-shrink:0}
.cenacle__media{display:block;width:100%;height:100%}
.cenacle__media img{width:100%;height:100%;object-fit:cover;object-position:50% 12%;
  transition:transform .6s var(--ease)}
.cenacle:hover .cenacle__media img{transform:scale(1.05)}
.cenacle::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:linear-gradient(180deg, rgba(18,48,46,.18) 0%, transparent 38%, rgba(12,24,22,.94) 100%)}
.cenacle::after{content:"";position:absolute;top:16px;left:16px;right:16px;height:2px;z-index:1;
  background:linear-gradient(90deg, #B8963E, transparent)}
.cenacle__overlay{position:absolute;left:0;right:0;bottom:0;padding:18px;z-index:2}
.cenacle__kicker{font-family:var(--serif);font-weight:600;font-size:1.2rem;line-height:1.15;
  color:#EDE7D8;display:block;margin-bottom:9px}
.cenacle__text{display:block;font-family:var(--body);font-size:.78rem;line-height:1.5;
  color:rgba(237,231,216,.85);margin-bottom:14px}
.cenacle__btn{display:inline-flex;align-items:center;justify-content:center;background:#B8963E;
  color:#12302E;font-size:.62rem;letter-spacing:.12em;padding:11px 20px;font-weight:700;
  transition:background .3s var(--ease)}
.cenacle__btn:hover{background:#D9BB63}
.cenacle.reveal{opacity:1}
.cenacle[data-rise]{opacity:1;transform:none;clip-path:inset(0 100% 0 0);transition:clip-path .9s var(--ease)}
.cenacle[data-rise].is-in{clip-path:inset(0 0 0 0)}

/* Carrousel horizontal des projets */
.pcarousel{max-width:var(--maxw);margin:0 auto;padding:0 0 clamp(50px,7vw,90px)}
.pcarousel__label{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter);
  color:var(--acier);font-size:.62rem;letter-spacing:.2em;margin-bottom:22px;display:block}
.pcarousel__viewport{position:relative;overflow:hidden;perspective:1600px;cursor:grab;
  padding:16px 0 6px;touch-action:pan-y;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.pcarousel__viewport.is-dragging{cursor:grabbing}
.pcarousel__track{display:flex;gap:24px;list-style:none;width:max-content;padding-left:var(--gutter);margin:0}
.pcarousel__card{position:relative;flex-shrink:0;width:clamp(160px,15vw,210px);
  transform-style:preserve-3d;will-change:transform;user-select:none;list-style:none}
.pcarousel__card img{width:100%;aspect-ratio:9/16;object-fit:cover;display:block;
  border:1px solid rgba(23,19,15,.16);filter:var(--duo-pierre);-webkit-user-drag:none}
/* Blason cœur sanglant — filigrane centré sur chaque toile du carrousel */
.pcarousel__mark{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:56%;height:auto;aspect-ratio:auto !important;object-fit:contain !important;
  border:none !important;opacity:.34;mix-blend-mode:soft-light;
  pointer-events:none;filter:none !important}
.pcarousel__cat{display:none}
.pcarousel__caption{padding-top:12px}
.pcarousel__name{display:block;font-family:var(--serif);font-size:1rem;font-weight:600;
  color:var(--encre);margin-bottom:4px;line-height:1.2}
.pcarousel__desc{font-size:.8rem;line-height:1.4;color:var(--ink-soft);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pcarousel__card--book .pcarousel__book{aspect-ratio:9/16;border:1px solid rgba(23,19,15,.16);
  display:flex;align-items:center;justify-content:center;padding:20px;text-align:center;
  background:radial-gradient(circle at 50% 30%, rgba(169,138,80,.16), transparent 68%), var(--encre)}
.pcarousel__book .pcarousel__cat{display:block;margin-bottom:10px;color:var(--sang-2);
  font-size:.56rem;letter-spacing:.14em}
.pcarousel__book h3{font-family:var(--serif);font-style:italic;font-weight:500;font-size:1.2rem;
  color:var(--papier);line-height:1.25}
@media (max-width:1024px){
  .manifesto__row{grid-template-columns:1fr;gap:30px}
  .cenacle{width:225px;margin:0 auto}
}

.pillars{max-width:var(--maxw);margin:0 auto;padding:20px var(--gutter) clamp(60px,9vw,120px);
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(23,19,15,.14);border:1px solid rgba(23,19,15,.14);list-style:none}
.pillar{background:var(--papier);padding:34px 26px 30px;display:flex;flex-direction:column;gap:14px}
.pillar__k{color:var(--sang)}
.pillar p{font-family:var(--serif);font-size:1.28rem;line-height:1.2;color:var(--encre)}

/* =========================================================
   Turntable — Bonaparte piloté au scroll
   ========================================================= */
.turn{position:relative;height:220vh;background:var(--encre);color:var(--papier)}
.turn__sticky{position:sticky;top:0;height:100vh;overflow:hidden;
  display:grid;grid-template-columns:minmax(280px,360px) 1fr;align-items:center;
  gap:24px;padding:0 var(--gutter)}
.turn__sticky::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:radial-gradient(circle at 50% 44%, rgba(169,138,80,.1), rgba(124,21,23,.05) 42%, transparent 66%);
  background-color:rgba(23,19,15,.3)}
.turn__grain{position:absolute;inset:0;z-index:1;pointer-events:none;
  background-image:url("../textures/grain.png");background-size:230px 230px;
  opacity:.19;mix-blend-mode:soft-light}
.turn__sticky::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:5;
  background:radial-gradient(70% 62% at 50% 46%, transparent 50%, rgba(23,19,15,.72) 100%)}
.turn__dust{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.turn__dust i{position:absolute;bottom:8%;width:var(--size,3px);height:var(--size,3px);border-radius:50%;
  background:var(--paper-fade);opacity:0;
  animation:dustFloat var(--dur,10s) ease-in var(--delay,0s) infinite;
  box-shadow:0 0 6px 1px rgba(243,239,231,.25)}
.turn__dust i:nth-child(3n){background:var(--or);box-shadow:0 0 6px 1px rgba(169,138,80,.4)}
@keyframes dustFloat{
  0%{transform:translate(0,0);opacity:0}
  12%{opacity:.6}
  55%{transform:translate(2vw,-22vh);opacity:.45}
  92%{opacity:0}
  100%{transform:translate(-1vw,-32vh);opacity:0}
}
.turn__bigword{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1;
  display:flex;flex-direction:column;align-items:center;line-height:.8;pointer-events:none;
  font-family:var(--serif);font-weight:700;letter-spacing:.02em;
  font-size:clamp(4rem,20vw,17rem);will-change:transform}
.turn__bigword span{color:transparent;-webkit-text-stroke:1.5px rgba(243,239,231,.26)}
.turn__bigword .is-sang{-webkit-text-stroke:1.5px rgba(124,21,23,.68)}
.turn__panel{position:relative;z-index:4;max-width:360px;display:flex;flex-direction:column;gap:20px;
  padding:30px 32px;border-left:2px solid var(--sang-2);
  background:linear-gradient(155deg, rgba(23,19,15,.66), rgba(23,19,15,.4) 70%, transparent)}
.turn__panel-kicker{color:var(--paper-soft)}
.turn__panel-story{font-family:var(--serif);font-style:italic;font-size:1.26rem;line-height:1.55;color:var(--papier)}
.turn__panel-desc{font-family:var(--body);font-size:1.06rem;line-height:1.65;color:var(--paper-soft)}
.turn__panel .is-or{color:var(--sang-2)}
.turn__stock{display:flex;flex-direction:column;gap:12px}
.turn__stock-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;color:var(--paper-soft)}
.turn__stock-row .is-or{font-family:var(--serif);font-size:1.5rem;font-weight:600;letter-spacing:.01em;color:var(--sang-2);line-height:1}
.turn__stock-num-value{font-variant-numeric:tabular-nums}
.turn__stock-num{color:var(--paper-fade);font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase}
/* Jauge d'exemplaires — filet gradué, remplissage sang, liseré d'or lumineux */
.turn__stock-bar{position:relative;height:10px;width:100%;cursor:pointer;box-sizing:border-box;
  background:rgba(243,239,231,.05);border:1px solid var(--border-dark);overflow:visible;
  transition:border-color .3s var(--ease)}
.turn__stock-bar::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background-image:repeating-linear-gradient(90deg,transparent 0,transparent calc(10% - 1px),rgba(243,239,231,.16) calc(10% - 1px),rgba(243,239,231,.16) 10%)}
.turn__stock-bar i{position:relative;display:block;height:100%;width:0;
  background:linear-gradient(90deg,var(--sang) 0%,var(--sang-2) 100%);
  box-shadow:inset 0 0 8px rgba(0,0,0,.28);transition:width 1.1s var(--ease)}
.turn__stock-bar i::after{content:"";position:absolute;top:-1px;bottom:-1px;right:-1px;width:2px;z-index:3;
  background:var(--or);box-shadow:0 0 9px 1px rgba(169,138,80,.85)}
.turn__stock-bar:hover,.turn__stock-bar:focus-visible{border-color:var(--sang-2);outline:none}
.turn__stock-bar:hover i,.turn__stock-bar:focus-visible i{box-shadow:inset 0 0 8px rgba(0,0,0,.28),0 0 14px rgba(154,28,30,.5)}
.turn__stock-detail{color:var(--paper-fade);font-family:var(--mono);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;
  max-height:0;opacity:0;overflow:hidden;transition:max-height .4s var(--ease),opacity .3s}
.turn__stock.is-detail .turn__stock-detail{max-height:60px;opacity:1;margin-top:2px}
.turn__panel-actions{display:flex;gap:14px;flex-wrap:wrap;align-items:stretch}
.turn__panel-form{display:contents}
.turn__panel-actions .btn--ghost,.turn__panel-actions a.btn--ghost{color:var(--papier) !important}
.turn__panel-actions .btn--ghost::before{background:var(--papier)}
.turn__panel-actions .btn--ghost:hover,.turn__panel-actions a.btn--ghost:hover{color:var(--encre) !important}
.turn__stage{position:relative;z-index:2;width:min(80vh,580px);aspect-ratio:1;justify-self:center}
.turn__stage::after{content:"";position:absolute;left:50%;bottom:3%;width:52%;height:5%;z-index:-1;
  transform:translateX(-50%);background:radial-gradient(ellipse,rgba(0,0,0,.6),transparent 72%);filter:blur(7px)}
.turn__canvas,.turn__fallback{width:100%;height:100%;object-fit:contain;filter:contrast(1.03) saturate(.98)}
.turn__hud{position:absolute;z-index:4;display:flex;flex-direction:column;gap:6px;color:var(--paper-soft)}
.turn__hud .is-or{color:var(--sang-2)}
.turn__hud--tr{top:calc(var(--gutter));right:var(--gutter);text-align:right}
.turn__hud--tr #turnDeg{color:var(--sang-2);font-size:1.1rem;font-variant-numeric:tabular-nums}
.turn__cue{position:absolute;z-index:4;bottom:var(--gutter);left:50%;transform:translateX(-50%);
  color:var(--paper-fade);display:flex;align-items:center;gap:10px;transition:opacity .5s}
.turn__cue.is-hidden{opacity:0}
.turn__cue i{width:18px;height:26px;border:1px solid currentColor;border-radius:10px;position:relative;display:inline-block}
.turn__cue i::after{content:"";position:absolute;left:50%;top:5px;width:2px;height:6px;background:currentColor;
  transform:translateX(-50%);animation:scrolldot 1.6s var(--ease) infinite}
.turn__ticker{position:absolute;top:0;bottom:0;z-index:4;width:30px;overflow:hidden;
  display:flex;justify-content:center;pointer-events:none;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent);
  mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent)}
.turn__ticker--left{left:calc(var(--gutter) / 2)}
.turn__ticker--right{right:calc(var(--gutter) / 2)}
.turn__ticker-track{display:flex;flex-direction:column;align-items:center;gap:34px;
  writing-mode:vertical-rl;text-orientation:mixed;white-space:nowrap;
  color:var(--paper-fade);animation:tickerY 26s linear infinite}
.turn__ticker-track span{font-size:.6rem;letter-spacing:.2em}
.turn__ticker--right .turn__ticker-track{animation-direction:reverse;animation-duration:30s}
@keyframes tickerY{to{transform:translateY(-50%)}}
@media (max-width:900px){
  .turn__sticky{grid-template-columns:1fr;justify-items:center;align-content:start;
    padding:82px var(--gutter) 150px}
  .turn__bigword{top:36%}
  .turn__panel{position:absolute;left:var(--gutter);right:var(--gutter);bottom:calc(var(--gutter) + 20px);
    max-width:none;gap:6px;padding:12px 16px}
  .turn__panel-kicker{font-size:.6rem}
  .turn__panel-story{display:none}
  .turn__panel-desc{font-size:.84rem;line-height:1.38}
  .turn__panel-actions{gap:10px}
  .turn__panel-actions .btn{padding:11px 16px;font-size:.62rem}
  /* width basé uniquement sur 71vh : sur un téléphone étroit mais haut
     (375×812…), ça dépassait la largeur d'écran — .turn__sticky le
     découpait silencieusement (overflow:hidden), coupant une partie
     du buste. Plafonné aussi par la largeur disponible. */
  .turn__stage{width:min(71vh,391px,100%);max-width:100%}
}

/* =========================================================
   Catalogue accueil — habillage des vraies sections PrestaShop
   (ps_featuredproducts / ps_bestsellers / ps_newproducts / section-title)
   ========================================================= */
.works-home{position:relative}

/* Slider d'accueil réel (ps_imageslider) — pleine largeur, immersif, sombre */
/* Carrousel d'accueil et bannière : hors charte, on les retire de l'accueil */
#home-slider,.works-home .banner{display:none !important}
#home-slider.ratio-homeSlider{position:relative;min-height:100vh;background:var(--encre);overflow:hidden}
#home-slider .carousel,#home-slider .carousel-inner,#home-slider .carousel-item{height:100%;min-height:100vh}
#home-slider .carousel-inner{list-style:none;margin:0;padding:0}
#home-slider .carousel-item{position:absolute;inset:0;opacity:0;transition:opacity .6s var(--ease);list-style:none}
#home-slider .carousel-item.active{position:relative;opacity:1}
#home-slider .carousel-content{position:relative;width:100%;height:100%;min-height:100vh;margin:0}
#home-slider .carousel-content img{width:100%;height:100%;min-height:100vh;object-fit:cover}
#home-slider .carousel-content::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,19,15,.15),rgba(23,19,15,.75));pointer-events:none}
#home-slider .carousel-title{position:absolute;top:38%;left:50%;transform:translate(-50%,-50%);z-index:2;
  font-family:var(--serif);font-style:italic;font-size:clamp(2.4rem,6vw,5rem);color:var(--papier);text-align:center;width:100%;max-width:80%;margin:0}
#home-slider .carousel-caption{position:absolute;top:62%;left:50%;transform:translate(-50%,-50%);z-index:2;
  width:100%;max-width:70%;text-align:center;color:var(--paper-soft)}
#home-slider .carousel-caption h2{font-family:var(--mono);font-size:.9rem;letter-spacing:.2em;color:var(--paper-soft);font-weight:400;margin-bottom:10px}
#home-slider .caption-description{font-family:var(--body);font-size:1.1rem;color:var(--paper-soft)}
#home-slider .carousel-indicators{position:absolute;z-index:3;bottom:26px;left:0;right:0;display:flex;justify-content:center;gap:10px;padding:0;margin:0;list-style:none}
#home-slider .carousel-indicators button{width:26px;height:2px;border:none;background:rgba(243,239,231,.4);padding:0}
#home-slider .carousel-indicators button.active{background:var(--sang-2)}
#home-slider .carousel-control-prev,#home-slider .carousel-control-next{position:absolute;top:0;bottom:0;z-index:3;width:60px;
  display:flex;align-items:center;justify-content:center;background:none;border:none;opacity:.5;transition:opacity .3s}
#home-slider .carousel-control-prev{left:0}
#home-slider .carousel-control-next{right:0}
#home-slider .carousel-control-prev:hover,#home-slider .carousel-control-next:hover{opacity:1}

/* Bannière (ps_banner) */
.banner{display:block;text-align:center;max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter)}
.banner img{width:100%;height:auto}

/* Grilles produits réelles (ps_featuredproducts…) — fond papier, look
   catalogue, même vocabulaire que .works/.section-head plutôt que le
   bloc Bootstrap générique. L'illustration "main" de l'ancien thème est
   retirée (hors charte, sans fonction) ; un kicker mono la remplace. */
.featured-products,.best-sellers-products,.new-products{
  position:relative;background:var(--papier);max-width:var(--maxw);margin:0 auto;
  padding:14px var(--gutter) clamp(50px,7vw,90px);
}
/* Même grain papier que .works/.atelier sur la page d'accueil, plutôt
   qu'un blanc plat — ce bloc utilisait déjà --papier mais sans la
   texture qui l'accompagne partout ailleurs sur le site. */
.featured-products::after,.best-sellers-products::after,.new-products::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(115deg, rgba(23,19,15,.035), transparent 40%, rgba(23,19,15,.02) 70%, rgba(23,19,15,.05)),
    url("../textures/speckle.png");
  background-size:cover, 256px 256px;
  background-blend-mode:normal, multiply;
  opacity:.7;
}
.featured-products > *,.best-sellers-products > *,.new-products > *{position:relative;z-index:1}
.hand-title{display:flex;flex-direction:column;gap:10px;margin-bottom:34px;padding-bottom:22px;
  border-bottom:1px solid var(--border-light)}
.hand-title .hand{display:none}
.hand-title::before{content:"Sélection de l'atelier";order:-1;font-family:var(--mono);font-size:.72rem;
  letter-spacing:.22em;text-transform:uppercase;color:var(--sang);display:flex;align-items:center;gap:12px}
.hand-title .section-title,.hand-title.h2{font-family:var(--serif);font-size:clamp(2rem,4.4vw,3.2rem);
  font-weight:600;font-style:italic;color:var(--encre);margin:0}
.product-miniature{list-style:none}
.product-miniature .card{background:none;border:none;border-radius:0}
.product-miniature__link{display:block;text-decoration:none;color:inherit;position:relative}
.product-miniature__image-container{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--encre-2);border:2px solid var(--sang)}
.product-miniature__image{width:100%;height:100%;object-fit:cover;
  transition:transform 1s var(--ease), filter .7s var(--ease);filter:var(--duo-sang)}
.product-miniature:hover .product-miniature__image{transform:scale(1.06);filter:var(--duo-none)}
/* Aperçu rapide retiré : opacity:0 masquait visuellement le bouton mais
   le laissait cliquable (opacity, contrairement à display, ne retire pas
   l'élément des événements de pointeur) — superposé au coin de l'image,
   un clic à cet endroit déclenchait la modale d'aperçu (grande image) au
   lieu d'ouvrir la fiche produit normalement. Fonction non désirée :
   entièrement désactivée, pas seulement corrigée. */
.product-miniature__quickview_touch,.product-miniature__quickview_button,
.product-miniature__quickview{display:none !important;pointer-events:none !important}
.product-miniature__infos{padding:18px 2px 6px}
.product-miniature__title{font-family:var(--serif);font-size:1.4rem;font-weight:600;color:var(--encre);margin:0}
.product-miniature__prices{display:flex;align-items:baseline;gap:8px;margin-top:8px}
.product-miniature__price{color:var(--sang);font-family:var(--mono);font-size:.9rem;letter-spacing:.04em}
.product-miniature__regular-price{color:var(--ink-soft);text-decoration:line-through;font-family:var(--mono);font-size:.78rem}
/* Sélecteur de quantité (-/+) retiré des vignettes : une pièce d'atelier
   se commande à l'unité depuis cette vignette, le bouton panier suffit. */
.product-miniature .quantity-button{display:none !important}
.product-miniature [data-button-action="add-to-cart"]{
  background:var(--sang) !important;border-color:var(--sang) !important;color:var(--papier) !important;
  border-radius:0 !important;min-width:44px;transition:background .3s,border-color .3s}
.product-miniature [data-button-action="add-to-cart"]:hover{background:var(--encre) !important;border-color:var(--encre) !important}
.all-product-link,.featured-products-footer .btn,.best-sellers-products-footer .btn,.new-products-footer .btn{
  display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--encre);border:1px solid var(--encre);padding:14px 24px;
  background:none;text-decoration:none;margin-top:20px}
.all-product-link:hover{background:var(--encre);color:var(--papier)}

/* =========================================================
   Atelier
   ========================================================= */
.atelier{background:var(--encre);color:var(--papier);position:relative;overflow:hidden}
.atelier::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(70% 60% at 15% 0%, rgba(169,138,80,.10), transparent 55%)}
.atelier__lead{max-width:var(--maxw);margin:0 auto;padding:clamp(60px,9vw,130px) var(--gutter) 20px;
  display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(30px,5vw,60px);align-items:center;position:relative}
.atelier__leadtext{display:flex;flex-direction:column;gap:30px}
.atelier__title{font-size:clamp(2.4rem,6.4vw,5.6rem) !important;font-style:italic;font-weight:500 !important}
.atelier__quote{color:var(--paper-soft);font-size:1.22rem;line-height:1.6;max-width:56ch;
  padding-left:26px;border-left:2px solid var(--sang-2)}
.atelier__quote em{color:var(--or);font-style:italic}
.atelier__portrait{position:relative;aspect-ratio:3/4;overflow:hidden;margin-left:auto;
  border:1px solid rgba(243,239,231,.14);box-shadow:0 30px 70px -26px rgba(0,0,0,.6)}
.atelier__portrait img{width:100%;height:100%;object-fit:cover;object-position:top center;filter:var(--duo-pierre)}
.atelier__cols{max-width:var(--maxw);margin:0 auto;padding:40px var(--gutter) clamp(60px,8vw,110px);
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--sang);border:1px solid rgba(243,239,231,.14);
  position:relative;overflow:hidden}
.atelier__cols::before{content:"";position:absolute;inset:0;opacity:.14;pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(23,19,15,.6) 3px 4px)}
@media (max-width:1024px){.atelier__lead{grid-template-columns:1fr}}
@media (max-width:720px){.atelier__portrait{max-width:280px;margin:0 auto;order:-1}}
.acol{background:var(--encre);padding:40px 30px;display:flex;flex-direction:column;gap:14px;position:relative;
  transition:transform .35s var(--ease),background .35s var(--ease)}
.acol:hover{transform:translateY(-8px);background:#211a15}
.acol__n{color:var(--acier);font-size:.9rem;letter-spacing:.2em;position:relative;
  display:inline-block;padding-bottom:12px;transition:color .3s var(--ease)}
.acol__n::after{content:"";position:absolute;left:0;bottom:0;width:24px;height:2px;background:var(--sang-2);
  transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.acol:hover .acol__n{color:var(--sang-2)}
.acol:hover .acol__n::after{transform:scaleX(1)}
.acol h3{font-size:1.7rem;font-weight:600}
.acol p{color:var(--paper-soft);font-size:1.02rem}
.atelier__strip{max-width:var(--maxw);margin:20px auto 0;padding:0 var(--gutter) clamp(60px,8vw,110px)}
.atelier__strip figure{aspect-ratio:21/8;overflow:hidden;border:1px solid rgba(243,239,231,.14)}
.atelier__strip img{width:100%;height:120%;object-fit:cover;object-position:center 40%;filter:var(--duo-pierre)}

/* =========================================================
   Œuvres — grille du catalogue (design du site de référence)
   ========================================================= */
.works{background:var(--papier)}
.works__intro{max-width:var(--maxw);margin:0 auto;padding:clamp(56px,7vw,100px) var(--gutter) 30px;
  display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap}
.works__title{font-size:clamp(2.6rem,6vw,5rem)}
.filters{display:flex;gap:8px;flex-wrap:wrap}
.filter{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;
  padding:10px 18px;border:1px solid var(--border-light);transition:.35s var(--ease);color:var(--ink-soft);background:none;cursor:pointer}
.filter:hover{border-color:var(--encre);color:var(--encre)}
.filter.is-active{background:var(--encre);color:var(--papier);border-color:var(--encre)}

.grid{max-width:var(--maxw);margin:0 auto;padding:14px var(--gutter) 20px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.grid--related{grid-template-columns:repeat(4,1fr)}
.grid .card{grid-column:span 1;opacity:0;transform:translateY(30px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.grid .card.is-in{opacity:1;transform:none}
.grid .card.is-hide{display:none}
.card--wide{grid-column:span 1}
.card__media{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;background:var(--encre-2);
  border:2px solid var(--sang);text-decoration:none}
.card--wide .card__media{aspect-ratio:1/1}
.card__media img{width:100%;height:100%;object-fit:cover;
  transition:transform 1s var(--ease), filter .7s var(--ease);
  filter:var(--duo-sang)}
.card__media:hover img,.card__media.is-center-reveal img{transform:scale(1.06);filter:var(--duo-none)}
.card__flag{position:absolute;left:12px;top:12px;background:rgba(23,19,15,.82);color:var(--papier);
  padding:6px 10px;font-size:.6rem;letter-spacing:.24em;font-family:var(--mono)}
.card__flag--sang{background:var(--sang)}
.card__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(23,19,15,.4));
  opacity:0;transition:opacity .5s}
.card__media:hover::after,.card__media.is-center-reveal::after{opacity:1}
.card__media::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.16;
  transition:opacity .7s var(--ease);
  background:repeating-linear-gradient(0deg, rgba(23,19,15,.7) 0 1px, transparent 1px 4px)}
.card__media:hover::before,.card__media.is-center-reveal::before{opacity:0}
.card__body{padding:18px 2px 6px}
.card__row{display:flex;justify-content:space-between;align-items:baseline;gap:14px;border-bottom:1px solid var(--border-light);padding-bottom:10px}
.card__row h3{font-size:1.5rem;font-weight:600;font-family:var(--serif);color:var(--encre)}
.card__price{color:var(--sang);font-size:.78rem;letter-spacing:.06em;white-space:nowrap;font-variant-numeric:tabular-nums;font-family:var(--mono)}
.card__price s{color:var(--ink-soft);margin-right:4px}
.card__desc{color:var(--ink-soft) !important;font-size:1rem !important;margin:12px 0 14px;font-family:'EB Garamond',Perpetua,Georgia,serif !important;font-weight:400 !important}
.card__cta{display:inline-flex;align-items:center;gap:8px;color:var(--encre);position:relative;text-decoration:none;font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase}
.card__cta i{transition:transform .4s var(--ease);color:var(--sang);font-style:normal}
.card__cta:hover i{transform:translateX(6px)}
.card__cta::after{content:"";position:absolute;left:0;bottom:-3px;width:0;height:1px;background:var(--sang);transition:width .4s var(--ease)}
.card__cta:hover::after{width:100%}
.works__all{margin:26px var(--gutter) clamp(60px,8vw,110px);color:var(--encre);display:inline-flex}
@media (min-width:1024px){.works__all{margin-left:auto;margin-right:auto;display:inline-flex;
  position:relative;left:50%;transform:translateX(-50%)}}
@media (max-width:1024px){.grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:720px){.grid{grid-template-columns:1fr;gap:20px}}

/* =========================================================
   Commande
   ========================================================= */
.order{background:var(--papier)}
.order__grid{max-width:var(--maxw);margin:0 auto;padding:clamp(50px,7vw,90px) var(--gutter);
  display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.ofeat{border-top:2px solid var(--sang);padding-top:22px;display:flex;flex-direction:column;gap:14px}
.ofeat__k{color:var(--sang)}
.ofeat p{font-family:var(--serif);font-size:1.5rem;line-height:1.28}
.ofeat b{color:var(--encre);font-weight:600}

/* =========================================================
   Contact
   ========================================================= */
.contact{background:var(--encre);color:var(--papier);position:relative;overflow:hidden}
.contact::before{content:"";position:absolute;width:60vw;height:60vw;right:-20vw;top:-20vw;border-radius:50%;
  background:radial-gradient(circle,rgba(124,21,23,.22),transparent 70%);pointer-events:none}
.contact__inner{max-width:var(--maxw);margin:0 auto;padding:clamp(70px,10vw,150px) var(--gutter);position:relative}
.contact__title{font-size:clamp(1.4rem,4vw,3.5rem);margin:14px 0 28px}
.contact__title em{font-style:italic;color:var(--sang-2)}
.contact__rows{border-top:1px solid var(--border-dark);max-width:820px}
.crow{display:grid;grid-template-columns:150px 1fr 30px;align-items:center;gap:20px;
  padding:24px 4px;border-bottom:1px solid var(--border-dark);transition:padding .4s var(--ease),background .4s;text-decoration:none;color:inherit}
.crow:hover{padding-left:20px;background:rgba(243,239,231,.03)}
.crow__k{color:var(--sang-2)}
.crow__v{font-family:var(--serif);font-size:clamp(1.4rem,3vw,2.1rem)}
.crow__a{color:var(--sang-2);text-align:right;transition:transform .4s var(--ease)}
.crow:hover .crow__a{transform:translateX(8px)}
.contact__btn{margin-top:44px}

/* =========================================================
   Responsive — accueil
   ========================================================= */
@media (max-width:1024px){
  .hero__grid{grid-template-columns:1fr;gap:40px;padding-top:120px;align-content:center}
  .hero__figure{justify-self:start;max-width:340px;order:-1}
  .hero__side{display:none}
  .manifesto__grid{grid-template-columns:1fr;gap:30px;align-items:start}
  .pillars{grid-template-columns:repeat(2,1fr)}
  .order__grid{grid-template-columns:1fr}
  .atelier__cols{grid-template-columns:repeat(2,1fr)}
  .acol{padding:30px 24px}
}
@media (max-width:720px){
  .hero{min-height:auto}
  .hero__grid{padding-top:70px;gap:22px}
  .hero__title{font-size:clamp(2.1rem,9vw,2.8rem);margin:16px 0 18px}
  .hero__sub{font-size:1rem;line-height:1.5}
  .hero__note{font-size:1rem;margin-top:10px}
  .hero__actions{margin-top:22px;gap:10px}
  .hero__foot{flex-direction:column;gap:14px;text-align:center;margin-top:30px}
  .hero__foot .hero__scroll{display:none}
  .manifesto__grid{padding:clamp(36px,9vw,60px) var(--gutter) 6px}
  .manifesto__title{font-size:clamp(1.7rem,8vw,2.3rem)}
  .atelier__cols{grid-template-columns:1fr}
  .acol:hover{transform:none}
  .manifesto__body p{font-size:1rem;line-height:1.5}
  .pillars{padding:16px var(--gutter) clamp(36px,9vw,60px)}
  .pillar{padding:22px 18px 20px}
  .pillar p{font-size:1.08rem}
  .crow{grid-template-columns:1fr;gap:4px;padding:20px 4px}
  .crow__a{display:none}
  .section-head{flex-direction:column;gap:6px;text-align:center}
}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width:1024px){
  .product.js-product-container{padding-top:24px}
  .pinfo__actions--hero{display:none}
}
@media (max-width:720px){
  :root{--gutter:20px}
  .nav__cta{padding:8px 14px;font-size:.6rem}
  .breadcrumb__wrapper{padding-top:88px}
  .product__name{font-size:clamp(1.7rem,7vw,2.4rem)}
}
/* Logo + CTA + burger sur une seule ligne : le logo (large à taille
   desktop) ne laissait plus la place au bouton Panier + au burger une
   fois .nav__links basculé en menu plein écran. Réduction progressive,
   même logo, même proportions — juste plus petit. */
@media (max-width:520px){
  .nav__logo{height:26px}
}

/* =========================================================
   Pages légales / CMS (CGV, Livraison, Paiement, Remboursement…)
   ========================================================= */
.legalpage{background:var(--papier)}
.legalpage__inner{max-width:820px;margin:0 auto;padding:clamp(110px,12vw,130px) var(--gutter) clamp(70px,9vw,110px)}
.legalpage__kicker{color:var(--acier)}
.legalpage__title{font-family:var(--serif);font-size:clamp(2.4rem,5.5vw,3.6rem);font-weight:600;
  color:var(--encre);margin:18px 0 14px}
.legalpage__updated{color:var(--ink-soft);font-size:.72rem;letter-spacing:.1em;margin-bottom:50px;display:block}
.legalpage__body h2{font-family:var(--serif);font-size:1.5rem;font-weight:600;margin:46px 0 16px;
  padding-top:26px;border-top:1px solid var(--border-light);color:var(--encre)}
.legalpage__body h2:first-child{margin-top:0;padding-top:0;border-top:none}
.legalpage__body p{font-size:1.05rem;line-height:1.7;color:rgba(23,19,15,.8);margin-bottom:16px}
.legalpage__body ul{margin:0 0 16px 22px;color:rgba(23,19,15,.8);font-size:1.05rem;line-height:1.7}
.legalpage__body li{margin-bottom:6px}
.legalpage__body strong{color:var(--encre);font-weight:600}
.legalpage__body a{color:var(--sang);text-decoration:underline;text-underline-offset:2px}
.legalpage__note{margin-top:50px;padding:20px 22px;background:rgba(169,138,80,.08);
  border-left:2px solid var(--or);font-size:.86rem;line-height:1.6;color:var(--ink-soft)}
.legalpage__toc{display:flex;flex-wrap:wrap;gap:10px 22px;margin-bottom:46px;padding-bottom:30px;
  border-bottom:1px solid var(--border-light)}
.legalpage__toc a{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-soft);transition:color .3s;text-decoration:none}
.legalpage__toc a:hover,.legalpage__toc a.is-active{color:var(--sang)}

/* =========================================================
   Accessibilité — mouvement réduit
   ========================================================= */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  .grain{animation:none}
  [data-rise],.reveal{opacity:1!important;transform:none!important}
  .cursor{display:none}
}
:focus-visible{outline:2px solid var(--or);outline-offset:3px}

@media print{
  .grain,.vignette,.cursor,#nav,.menu,.totop,.preloader{display:none!important}
}
