/*
 * Gresley — ajouts propres à WordPress, absents de la maquette.
 * Aucun de ces styles ne modifie l'apparence de la maquette au repos.
 */

/* Accessibilité : texte réservé aux lecteurs d'écran, lien d'évitement, focus clavier */
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link:focus{clip:auto;width:auto;height:auto;margin:0;overflow:visible;white-space:normal;z-index:100;
  top:.6rem;left:.6rem;padding:.8rem 1.2rem;background:var(--ink);color:var(--paper);
  font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* Barre d'administration (connecté) : l'en-tête collant passe dessous */
.admin-bar header.site{top:32px}
@media(max-width:782px){.admin-bar header.site{top:46px}}

/* Menu mobile : la maquette masque la navigation sous 1040 px ; le bouton menu l'ouvre ici */
@media(max-width:1040px){
  header.site.nav-open .nav-links{
    display:flex;flex-direction:column;gap:0;position:absolute;left:0;right:0;top:100%;
    max-height:calc(100vh - 100%);overflow-y:auto;
    background:var(--cream);border-bottom:1px solid var(--line);
    padding:.6rem clamp(20px,5vw,64px) 1.4rem;box-shadow:0 26px 54px -30px rgba(28,24,20,.5)}
  header.site.nav-open .nav-links > li{border-bottom:1px solid var(--line-soft)}
  header.site.nav-open .nav-links a{display:block;padding:.85rem 0;font-size:.95rem}
  header.site.nav-open .nav-links a::after{display:none}
  header.site.nav-open .submenu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;
    border:0;background:none;padding:0 0 .6rem 1rem;min-width:0}
  header.site.nav-open .submenu a{padding:.45rem 0;font-size:.88rem}
  header.site.nav-open .burger span:nth-child(1){transform:translateY(6.6px) rotate(45deg)}
  header.site.nav-open .burger span:nth-child(2){opacity:0}
  header.site.nav-open .burger span:nth-child(3){transform:translateY(-6.6px) rotate(-45deg)}
}

/* Panier dans l'en-tête (ajout au balisage de la maquette : indispensable à une boutique) */
.ic-btn--cart{position:relative}
.cart-count{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;
  background:var(--gold);color:#fff;font-family:var(--mono);font-size:.56rem;line-height:18px;text-align:center}
.cart-count[hidden]{display:none}
@media(max-width:1040px){.nav-cta .ic-btn--cart{display:grid}}

/* Liens d'information du bas de page */
.foot-legal{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem}
.foot-legal a{font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
.foot-legal a:hover{color:var(--gold)}

/* ==========================================================================
   Charte sombre commune (accueil v2, étendue à tout le site le 2026-10-11) :
   en-tête et pied de page espresso, comme les bandes sombres de l'accueil.
   ========================================================================== */
:root{
  --espresso:#17120E;   /* fond dominant sombre */
  --tobacco:#221A14;    /* panneaux sombres secondaires */
  --ivory:#F4EEE3;      /* texte sur sombre */
  --smoke:#B9AD98;      /* texte secondaire sur sombre */
  --hair-dark:rgba(244,238,227,.12);
}

header.site{background:rgba(23,18,14,.94);border-bottom-color:rgba(199,163,92,.16)}
header.site.scrolled{box-shadow:0 14px 40px -24px rgba(0,0,0,.8)}
.nav-links > li > a{color:#d9cfbd}
.nav-links > li > a:hover{color:#fff}
.nav-links a.promo{color:var(--gold-foil)}
.ic-btn{border-color:rgba(244,238,227,.2);color:#d9cfbd}
.ic-btn:hover{border-color:var(--gold-foil);color:var(--gold-foil)}
.burger span{background:var(--ivory)}
header.site.nav-open .nav-links > li > a{color:var(--ink-2)}

footer.foot{background:var(--espresso);border-top:1px solid var(--hair-dark);color:var(--ivory)}
.foot p.tag{color:var(--smoke)}
.foot h5{color:var(--gold-foil)}
.foot ul a{color:#d9cfbd}
.foot ul a:hover{color:#fff}
.foot-bottom{border-top-color:var(--hair-dark)}
.foot-bottom .mono,.foot-legal a{color:var(--smoke)}
.foot-legal a:hover{color:var(--gold-foil)}
.socials a{border-color:rgba(244,238,227,.2);color:#d9cfbd}
.socials a:hover{border-color:var(--gold);background:var(--gold);color:#fff}