/* En-tête de site, scopé .st-site-header, chargé sur toutes les pages.
   Valeurs alignées sur le header de l'accueil (maquette validée). */
.st-site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(38,36,48,.12);
}
.st-site-header .st-sh-inner{
  max-width:1180px; margin:0 auto; padding:0 24px; height:72px;
  display:flex; align-items:center; justify-content:space-between; gap:1.5rem;
}
.st-site-header a{ text-decoration:none; }
.st-site-header .st-sh-brand{ display:flex; align-items:center; gap:11px; }
.st-site-header .st-sh-brand img{ height:42px; width:42px; border-radius:50%; display:block; }
.st-site-header .st-sh-brand b{
  font-family:'Hanken Grotesk',sans-serif; font-weight:800;
  font-size:1.18rem; letter-spacing:-.03em; color:#1C1B24;
}
.st-site-header .st-sh-nav{ display:flex; align-items:center; gap:1.7rem; }
.st-site-header .st-sh-nav a{
  font-family:'Hanken Grotesk',sans-serif; font-weight:600; font-size:.95rem;
  color:#262430; display:inline-flex; align-items:center;
}
.st-site-header .st-sh-nav a:hover{ color:#3F6CB0; }
.st-site-header .st-sh-badge{
  font-family:'JetBrains Mono',monospace; font-size:.58rem; font-weight:700;
  background:#FCCC48; color:#1C1B24; padding:.12rem .4rem; border-radius:5px; margin-left:.35rem;
}
.st-site-header .st-sh-actions{ display:flex; align-items:center; gap:14px; }
.st-site-header .st-sh-cart{
  display:flex; align-items:center; gap:.4rem;
  font-family:'Hanken Grotesk',sans-serif; font-weight:600; font-size:.9rem; color:#1C1B24;
}
.st-site-header .st-sh-cart:hover{ color:#3F6CB0; }
.st-site-header .st-sh-cta{
  display:inline-flex; align-items:center; white-space:nowrap;
  font-family:'Hanken Grotesk',sans-serif; font-weight:700; font-size:.88rem;
  padding:.6rem 1.15rem; border-radius:10px;
  background:#6C9CE4 !important; color:#fff !important; border:1.5px solid transparent;
  box-shadow:0 8px 18px -6px rgba(108,156,228,.65); transition:.2s;
}
.st-site-header .st-sh-cta:hover{ transform:translateY(-2px); box-shadow:0 12px 22px -6px rgba(108,156,228,.7); }
@media(max-width:860px){
  .st-site-header .st-sh-nav{ display:none; }
  .st-site-header .st-sh-cart span{ display:none; }
}

/* Icônes compte + panier avec compteur en direct */
.st-site-header .st-sh-ico{ color:#1C1B24; display:inline-flex; align-items:center; position:relative; }
.st-site-header .st-sh-ico:hover{ color:#3F6CB0; }
.st-site-header .st-sh-cart{ position:relative; }
.st-site-header .st-sh-cart-count{ display:none !important; }
.st-site-header .st-sh-cart-count.has{
  display:flex !important; align-items:center; justify-content:center;
  position:absolute; top:-7px; right:-9px;
  min-width:17px; height:17px; padding:0 4px;
  background:#1C1B24; color:#fff;
  font-family:'Hanken Grotesk',sans-serif; font-weight:700; font-size:.62rem;
  border-radius:999px; line-height:1;
}

/* Nav header en menu WordPress (ul) */
.st-site-header ul.st-sh-nav{ list-style:none; margin:0; padding:0; }
.st-site-header .st-sh-nav li{ margin:0; }
.st-site-header .st-sh-nav a{ white-space:nowrap; }

/* ============ Footer harmonisé ============ */
.st-site-footer{ background:#1C1B24; color:rgba(255,255,255,.7); }
.st-site-footer .st-ft-inner{ max-width:1180px; margin:0 auto; padding:56px 24px 30px; }
.st-site-footer .st-ft-grid{ display:grid; grid-template-columns:1.7fr 1fr 1fr 1fr; gap:36px; }
.st-site-footer .st-ft-id{ display:inline-flex; align-items:center; gap:10px; }
.st-site-footer .st-ft-brand img{ height:40px; width:40px; border-radius:50%; }
.st-site-footer .st-ft-brand b{ font-family:'Hanken Grotesk',sans-serif; font-weight:800; color:#fff; font-size:1.15rem; letter-spacing:-.02em; }
.st-site-footer .st-ft-brand p{ margin-top:14px; font-size:.9rem; line-height:1.7; color:rgba(255,255,255,.6); max-width:320px; }
.st-site-footer .st-ft-col h4{ font-family:'JetBrains Mono',monospace; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:#fff; margin:0 0 14px; }
.st-site-footer .st-ft-col ul{ list-style:none; margin:0; padding:0; }
.st-site-footer .st-ft-col li{ margin-bottom:10px; }
.st-site-footer .st-ft-col a{ color:rgba(255,255,255,.7); text-decoration:none; font-size:.92rem; }
.st-site-footer .st-ft-col a:hover{ color:#fff; }
.st-site-footer .st-ft-bottom{ margin-top:42px; padding-top:22px; border-top:1px solid rgba(255,255,255,.12); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-family:'JetBrains Mono',monospace; font-size:.78rem; color:rgba(255,255,255,.5); }
@media(max-width:860px){ .st-site-footer .st-ft-grid{ grid-template-columns:1fr 1fr; gap:28px; } .st-site-footer .st-ft-brand{ grid-column:1 / -1; } }
@media(max-width:520px){ .st-site-footer .st-ft-grid{ grid-template-columns:1fr; } }

/* Pastille "BIENTÔT" : ajouter la classe CSS "st-soon" sur l'élément de menu */
.st-site-header .st-sh-nav li.st-soon > a{ display:inline-flex; align-items:center; }
.st-site-header .st-sh-nav li.st-soon > a::after{
  content:"BIENTÔT";
  font-family:'JetBrains Mono',monospace; font-size:.58rem; font-weight:700; letter-spacing:.04em;
  background:#FCCC48; color:#1C1B24; padding:.12rem .42rem; border-radius:5px;
  margin-left:.4rem; line-height:1.4; text-transform:uppercase;
}

/* Reset des liens issus du menu WordPress (espacement identique partout) */
.st-site-header .st-sh-nav li > a{ padding:0; display:inline-flex; align-items:center; }
.st-site-header .st-sh-nav .sub-menu{ display:none; } /* pas de sous-menus déroulants dans le header */

/* icônes réseaux sociaux footer */
.st-ft-social{ display:flex; gap:9px; margin-top:16px; }
.st-ft-social a{ width:38px; height:38px; border-radius:10px; background:rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; color:#fff; transition:.15s; }
.st-ft-social a:hover{ background:#6C9CE4; transform:translateY(-2px); }
.st-ft-social svg{ width:18px; height:18px; }

/* liens légaux du bas de footer */
.st-ft-bottom a{ color:inherit; text-decoration:none; transition:.15s; }
.st-ft-bottom a:hover{ color:#6C9CE4; }

/* ================================================================
   Menu mobile (hamburger)
   ================================================================ */
.st-site-header .st-sh-burger{ display:none; flex-direction:column; justify-content:center; gap:5px; width:42px; height:42px; border:none; background:none; cursor:pointer; padding:0; margin-left:2px; }
.st-site-header .st-sh-burger span{ display:block; width:24px; height:2.5px; border-radius:2px; background:#1C1B24; transition:.2s; margin:0 auto; }
.st-site-header .st-sh-burger.open span:nth-child(1){ transform:translateY(7.5px) rotate(45deg); }
.st-site-header .st-sh-burger.open span:nth-child(2){ opacity:0; }
.st-site-header .st-sh-burger.open span:nth-child(3){ transform:translateY(-7.5px) rotate(-45deg); }

.st-sh-mobile{ display:none; }

@media(max-width:860px){
  .st-site-header .st-sh-burger{ display:flex; }
  .st-sh-mobile.open{ display:block; padding:6px 22px 24px; border-top:1px solid rgba(38,36,48,.1); background:#fff; }
  .st-sh-mobile.open .st-sh-nav{ display:flex !important; flex-direction:column; gap:0; align-items:stretch; }
  .st-sh-mobile.open .st-sh-nav li{ margin:0; width:100%; }
  .st-sh-mobile.open .st-sh-nav a{ display:block; width:100%; padding:15px 0; font-family:'Hanken Grotesk',sans-serif; font-weight:700; font-size:1.05rem; color:#1C1B24; border-bottom:1px solid rgba(38,36,48,.07); }
  .st-sh-mobile.open .st-sh-nav a:hover{ color:#3F6CB0; }
  .st-sh-mobile.open .st-sh-mobile-actions{ display:flex; flex-direction:column; gap:2px; padding-top:6px; }
  .st-sh-mobile.open .st-sh-m-link{ display:block; padding:14px 0; font-family:'Hanken Grotesk',sans-serif; font-weight:700; font-size:1.05rem; color:#1C1B24; text-decoration:none; border-bottom:1px solid rgba(38,36,48,.07); }
  .st-sh-mobile.open .st-sh-m-cta{ margin-top:14px; text-align:center; padding:14px; }
}

/* Compactage du header sur mobile (éviter le débordement horizontal) */
@media(max-width:860px){
  .st-site-header .st-sh-actions .st-sh-cta{ display:none; } /* "La boutique" est dans le menu hamburger */
  .st-site-header .st-sh-inner{ gap:.75rem; padding:0 16px; }
  .st-site-header .st-sh-actions{ gap:10px; }
}
@media(max-width:480px){
  .st-site-header .st-sh-brand img{ height:34px; width:34px; }
  .st-site-header .st-sh-brand b{ font-size:1rem; }
  .st-site-header .st-sh-inner{ height:62px; padding:0 12px; }
}