/* ============================================================
   BABOO DE GYCER — DESIGN SYSTEM GLOBAL (storefront)
   Chargé sur toutes les pages front. Tokens + nav + footer + boutons.
   ============================================================ */

:root {
	--bdg-or:#DDA82C; --bdg-or-clair:#e8c06a; --bdg-or-fonce:#C8941F;
	--bdg-vert-hero:#3A4632; --bdg-vert-deep:#2C3627; --bdg-vert-soft:#4A583F;
	--bdg-creme:#FDFBF7; --bdg-creme-2:#F4EFE6;
	--bdg-noir:#23271F; --bdg-gris:#8A8778; --bdg-blanc:#FFFFFF;
	--font-title:'Cormorant Garamond',serif;
	--font-corps:'Plus Jakarta Sans',system-ui,sans-serif;
	--ease:cubic-bezier(0.22,0.61,0.36,1);
	--bdg-maxw:1200px;
}

/* ===== Masquage du chrome Astra sur le storefront (nav/footer Baboo via hooks) ===== */
.bdg-storefront #masthead,
.bdg-storefront header.site-header,
.bdg-storefront .site-header,
.bdg-storefront #colophon,
.bdg-storefront footer.site-footer { display:none !important; }
.bdg-storefront #page { padding-top:0 !important; }
.bdg-storefront .site-content,
.bdg-storefront #primary { padding-top:0 !important; margin-top:0 !important; }
/* On laisse le conteneur Astra gérer la largeur de lecture des pages internes. */

/* ===== Base typographique storefront ===== */
.bdg-storefront { font-family:var(--font-corps); color:var(--bdg-noir); background:var(--bdg-creme); line-height:1.6; }
.bdg-storefront h1,.bdg-storefront h2,.bdg-storefront h3,.bdg-title { font-family:var(--font-title); font-weight:400; line-height:1.05; letter-spacing:-.01em; }
.bdg-storefront img { max-width:100%; height:auto; }

/* ===== Neutralise l'accent bleu par défaut d'Astra → charte Baboo ===== */
.bdg-storefront { --ast-global-color-0:var(--bdg-vert-hero); --ast-global-color-1:var(--bdg-or-fonce); }
.bdg-storefront input:focus, .bdg-storefront select:focus, .bdg-storefront textarea:focus,
.bdg-storefront input[type="text"]:focus, .bdg-storefront input[type="email"]:focus,
.bdg-storefront input[type="password"]:focus, .bdg-storefront input[type="search"]:focus,
.bdg-storefront textarea:focus { border-color:var(--bdg-or) !important; }

.bdg-wrap { width:100%; max-width:var(--bdg-maxw); margin-inline:auto; padding-inline:clamp(20px,5vw,48px); }
.bdg-section { padding:clamp(60px,8vw,120px) 0; position:relative; }

.bdg-eyebrow { display:inline-block; font-family:var(--font-corps); font-size:11px; letter-spacing:.34em; text-transform:uppercase; font-weight:500; color:var(--bdg-or); margin:0 0 24px; }
.bdg-title { font-size:clamp(2.2rem,5vw,3.8rem); font-weight:340; margin:0 0 20px; }
.bdg-title em { font-style:italic; color:var(--bdg-or); }
.bdg-lead { color:var(--bdg-gris); font-size:1.05rem; font-weight:300; max-width:46ch; line-height:1.7; }

/* ===== Boutons ===== */
.bdg-btn { display:inline-flex; align-items:center; gap:14px; cursor:pointer; font-family:var(--font-corps); font-weight:600; font-size:15px; text-decoration:none; border:none; border-radius:999px; padding:15px 16px 15px 30px; background:var(--bdg-or); color:var(--bdg-vert-deep); transition:transform .5s var(--ease),background .5s var(--ease); }
.bdg-btn__circ { width:34px; height:34px; border-radius:999px; background:rgba(44,54,39,.14); display:flex; align-items:center; justify-content:center; font-size:15px; transition:transform .5s var(--ease); }
.bdg-btn:hover { background:var(--bdg-or-clair); transform:translateY(-2px); }
.bdg-btn:hover .bdg-btn__circ { transform:translate(3px,-2px); }
.bdg-btn:active { transform:scale(.98); }
.bdg-btn--outline { background:transparent; color:inherit; border:1px solid currentColor; padding:14px 28px; }
.bdg-btn--outline:hover { background:transparent; color:var(--bdg-or); }
.bdg-btn--sm { padding:9px 18px; font-size:13px; }
.bdg-btn--block { width:100%; justify-content:center; }

/* ===== NAVBAR storefront ===== */
.bdg-nav { position:fixed; top:0; left:0; right:0; z-index:100; }
.bdg-nav--store { display:flex; align-items:center; gap:34px; padding:16px clamp(24px,6vw,80px); background:rgba(44,54,39,.55); backdrop-filter:blur(18px); border-bottom:1px solid rgba(221,168,44,.22); }
.bdg-nav--store > nav { margin-left:auto; }
.bdg-nav__inner { display:flex; align-items:center; gap:34px; }
.bdg-brand { display:flex; align-items:center; gap:10px; font-family:var(--font-title); font-size:19px; letter-spacing:.02em; color:var(--bdg-creme); text-decoration:none; }
.bdg-brand img { height:44px; width:auto; object-fit:contain; }
.bdg-brand em { font-style:normal; color:var(--bdg-or); }
.bdg-nav__menu { display:flex; gap:26px; list-style:none; margin:0; padding:0; }
.bdg-nav__menu a { font-family:var(--font-corps); font-size:13px; letter-spacing:.03em; color:rgba(253,251,247,.72); text-decoration:none; transition:color .4s var(--ease); }
.bdg-nav__menu a:hover { color:var(--bdg-or-clair); }
.bdg-nav__actions { display:flex; align-items:center; gap:16px; }
.bdg-cart { position:relative; color:var(--bdg-creme); display:inline-flex; }
.bdg-cart__count { position:absolute; top:-8px; right:-10px; background:var(--bdg-or); color:var(--bdg-vert-deep); font-family:var(--font-corps); font-weight:600; font-size:.7rem; min-width:18px; height:18px; border-radius:999px; display:grid; place-content:center; padding:0 4px; }
.bdg-burger { display:none; width:40px; height:40px; border:0; background:transparent; cursor:pointer; flex-direction:column; gap:5px; justify-content:center; align-items:center; }
.bdg-burger span { width:22px; height:2px; background:var(--bdg-creme); display:block; transition:.3s; }

/* ===== FOOTER storefront ===== */
.bdg-footer--store { background:var(--bdg-vert-hero); color:var(--bdg-creme); padding:clamp(70px,9vw,120px) 0 44px; }
.bdg-footer__top { display:flex; justify-content:space-between; gap:50px; flex-wrap:wrap; align-items:flex-start; padding-bottom:60px; border-bottom:1px solid rgba(221,168,44,.2); }
.bdg-footer__brand { font-family:var(--font-title); font-size:3rem; font-weight:340; max-width:12ch; color:var(--bdg-creme); display:block; }
.bdg-footer__cols { display:flex; gap:70px; flex-wrap:wrap; }
.bdg-footer__col h4 { font-family:var(--font-corps); font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--bdg-or); margin:0 0 20px; font-weight:600; }
.bdg-footer__col a { display:block; color:rgba(253,251,247,.68); font-size:14px; margin-bottom:12px; text-decoration:none; transition:color .4s var(--ease); }
.bdg-footer__col a:hover { color:var(--bdg-or-clair); }
.bdg-footer__bottom { display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-top:34px; font-size:12px; color:rgba(253,251,247,.60); }

/* ===== Réassurance fiche produit ===== */
.bdg-guarantees { list-style:none; padding:18px 0 0; margin:18px 0 0; border-top:1px solid var(--bdg-creme-2); display:flex; flex-direction:column; gap:10px; }
.bdg-guarantees li { display:flex; align-items:center; gap:12px; font-size:.95rem; color:var(--bdg-noir); }
.bdg-guarantees li span { font-size:1.1rem; }

/* ===== Accessibilité ===== */
.bdg-storefront a:focus-visible, .bdg-storefront button:focus-visible { outline:3px solid var(--bdg-or); outline-offset:2px; border-radius:4px; }
@media (prefers-reduced-motion:reduce){ .bdg-storefront *{ transition:none !important; animation:none !important; } }

/* ===== Responsive nav ===== */
@media (max-width:880px){
	.bdg-nav__menu { display:none; }
	.bdg-burger { display:flex; }
	.bdg-nav--store { gap:14px; padding:12px clamp(16px,4vw,24px); }
	.bdg-nav--store .bdg-btn--sm { display:none; } /* CTA redondant : « Boutique » est dans le menu burger */
	.bdg-nav__menu.is-open { display:flex; position:absolute; top:calc(100% + 10px); left:auto; right:0; min-width:220px; flex-direction:column; gap:4px; background:rgba(44,54,39,.97); backdrop-filter:blur(18px); border:1px solid rgba(221,168,44,.22); border-radius:20px; padding:16px 22px; box-shadow:0 20px 40px rgba(0,0,0,.22); }
	.bdg-nav__menu.is-open a { padding:6px 0; font-size:14px; }
	.bdg-footer__top { flex-direction:column; }
	.bdg-footer__cols { gap:40px; }
}
@media (max-width:600px){
	.bdg-footer__brand { font-size:2.4rem; }
	.bdg-footer__cols { gap:30px; }
	.bdg-footer__bottom { flex-direction:column; gap:6px; }
}

/* ===== Pages de contenu (Contact, À propos, CGV…) ===== */
.bdg-pagehead { background:var(--bdg-vert-hero); color:var(--bdg-creme); padding:clamp(120px,14vw,160px) 0 clamp(60px,8vw,84px); position:relative; overflow:hidden; }
.bdg-pagehead::before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(120% 90% at 82% 0%, rgba(221,168,44,.15), transparent 55%); }
.bdg-pagehead .bdg-eyebrow { color:var(--bdg-or-clair); margin-bottom:26px; position:relative; }
.bdg-pagehead h1 { font-size:clamp(3rem,8vw,5.6rem); font-weight:340; color:var(--bdg-creme); max-width:16ch; margin:0; position:relative; }
.bdg-pagehead h1 em { font-style:italic; color:var(--bdg-or); }
.bdg-pagehead .bdg-lead { margin-top:26px; color:rgba(253,251,247,.72); position:relative; }

.bdg-prose { max-width:65ch; margin-inline:auto; padding:clamp(60px,8vw,110px) clamp(20px,5vw,48px); }
.bdg-prose h2 { font-size:clamp(1.7rem,3.4vw,2.4rem); font-weight:400; margin:2.2em 0 .7em; }
.bdg-prose h2:first-child { margin-top:0; }
.bdg-prose h2 em { font-style:italic; color:var(--bdg-or); }
.bdg-prose p { margin:0 0 1.2em; font-weight:300; color:var(--bdg-noir); }
.bdg-prose ul, .bdg-prose ol { margin:0 0 1.2em; padding-left:1.3em; font-weight:300; }
.bdg-prose li { margin-bottom:.5em; }
.bdg-prose a { color:var(--bdg-or-fonce); text-decoration-color:rgba(221,168,44,.4); }
.bdg-prose hr { border:0; border-top:1px solid rgba(58,70,50,.16); margin:2.6em 0; }
.bdg-prose--manifesto { font-family:var(--font-title); font-size:clamp(1.5rem,3vw,2.1rem); line-height:1.4; font-weight:400; color:var(--bdg-noir); }
.bdg-prose .bdg-filet { padding-left:22px; border-left:1px solid var(--bdg-or); }

/* Champs à compléter (CGV) — visibles tant que non renseignés */
.bdg-fill { background:rgba(221,168,44,.16); border:1px dashed var(--bdg-or); border-radius:6px; padding:1px 8px; font-weight:500; white-space:nowrap; }

/* ===== Formulaire de contact (Contact Form 7) ===== */
.bdg-form label { display:block; font-size:11px; letter-spacing:.24em; text-transform:uppercase; font-weight:600; color:var(--bdg-vert-hero); margin:0 0 8px; }
.bdg-form p { margin:0 0 26px; }
.bdg-form input[type="text"], .bdg-form input[type="email"], .bdg-form textarea { width:100%; font-family:var(--font-corps); font-size:15px; font-weight:300; color:var(--bdg-noir); background:var(--bdg-blanc); border:1px solid rgba(58,70,50,.22); border-radius:14px; padding:14px 18px; transition:border-color .4s var(--ease); }
.bdg-form textarea { min-height:170px; resize:vertical; }
.bdg-form input[type="submit"] { display:inline-flex; cursor:pointer; font-family:var(--font-corps); font-weight:600; font-size:15px; border:none; border-radius:999px; padding:16px 34px; background:var(--bdg-or); color:var(--bdg-vert-deep); transition:transform .5s var(--ease),background .5s var(--ease); }
.bdg-form input[type="submit"]:hover { background:var(--bdg-or-clair); transform:translateY(-2px); }
.bdg-form .wpcf7-not-valid-tip { font-size:12px; color:#a4471f; margin-top:6px; display:block; }
.bdg-form .wpcf7-response-output { border:1px solid var(--bdg-or) !important; border-radius:14px; padding:14px 18px !important; margin:20px 0 0 !important; font-size:14px; }
.bdg-form .wpcf7-spinner { margin-left:14px; }

/* Grain de film (fixe, non bloquant) */
.bdg-storefront::after { content:""; position:fixed; inset:0; z-index:60; pointer-events:none; opacity:.035; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
/* Révélation au scroll */
.bdg-reveal { opacity:0; transform:translateY(38px); filter:blur(6px); transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s var(--ease); }
.bdg-reveal.is-in { opacity:1; transform:none; filter:none; }
@media (prefers-reduced-motion:reduce){ .bdg-reveal{ opacity:1; transform:none; filter:none; } }