*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --gold:#C8A44A;--gold2:#E8CC7A;--gold3:#8B6A1A;--gold4:#F5E4A0;
  /* Fond réchauffé : bruns profonds (cire/expresso) au lieu du quasi-noir, pour
     donner de la lumière et de la matière sans perdre le luxe sombre */
  --bg:#160F06;--bg2:#201608;--bg3:#2A1F0E;
  --cream:#F2E8CC;--cream2:#E4D4A0;--muted:#8A7A52;
  --H:'Cormorant Garamond',Georgia,serif;
  --P:'Playfair Display',Georgia,serif;
  --B:'Inter',sans-serif;
  /* MONO système (aucun fichier à charger) — porte les détails « atelier/récoltant »
     (libellés, lot, coordonnées, °C, %) et casse l'effet tout-serif générique */
  --M:ui-monospace,'SF Mono','Cascadia Code','Segoe UI Mono',Menlo,Consolas,monospace;
  /* dégradé de repli affiché tant qu'une photo n'est pas déposée */
  --ph:linear-gradient(135deg,#241a06 0%,#140d03 55%,#0a0702 100%);
}
html{scroll-behavior:smooth;background:#160F06}
/* curseur custom masqué UNIQUEMENT quand le JS a activé l'abeille (pointeur fin) —
   sinon le vrai curseur reste visible (robustesse si le JS échoue, accessibilité) */
html.bee-cursor{cursor:none}
/* PERF — décors animés gelés hors écran / onglet masqué (posé par js/site.js) */
.anim-off,.anim-off::before,.anim-off::after,.anim-off *,.anim-off *::before,.anim-off *::after,
.anim-off-tab,.anim-off-tab::before,.anim-off-tab::after{animation-play-state:paused!important}
body{background:var(--bg);color:var(--cream);font-family:var(--B);font-size:16px;line-height:1.7;overflow-x:hidden}

/* MATIÈRE — grain de film très subtil sur tout le site : donne de la texture et
   lève légèrement le noir (jeu de lumière). Fixe, n'intercepte aucun clic. */
#grain{position:fixed;inset:0;z-index:9990;pointer-events:none;opacity:.05;transform:translateZ(0);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.7'/%3E%3C/svg%3E")}
@media(prefers-reduced-motion:reduce){#grain{opacity:.035}}

/* ACCESSIBILITÉ — lien d'évitement + focus clavier visible (le curseur custom masque le pointeur) */
.skip-link{position:fixed;top:-60px;left:16px;z-index:10000;background:var(--gold);color:var(--bg);font-family:var(--B);font-size:12px;letter-spacing:.1em;text-transform:uppercase;padding:12px 22px;text-decoration:none;transition:top .25s;border-radius:0 0 4px 4px}
.skip-link:focus{top:0;outline:none}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--gold2);outline-offset:3px;border-radius:2px}
:focus:not(:focus-visible){outline:none}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* CURSOR */
#bee{position:fixed;top:0;left:0;width:44px;height:44px;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);will-change:transform}
#bee svg{width:100%;height:100%}
@media (hover:none),(pointer:coarse){#bee{display:none}html{cursor:auto}}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:20px 48px;display:flex;align-items:center;justify-content:space-between;background:rgba(15,10,4,.92);border-bottom:1px solid rgba(200,164,74,.14);transition:background-color .4s,padding .4s,border-color .4s}
nav.scrolled{background:rgba(15,10,4,.97);padding:15px 48px;border-bottom:1px solid rgba(200,164,74,.18)}
.nav-logo{display:flex;flex-direction:row;align-items:center;gap:11px;text-decoration:none}
.nav-logo-mark{height:40px;width:auto;display:block;flex-shrink:0}
.nav-logo-txt{display:flex;flex-direction:column}
.nav-logo-main{font-family:var(--H);font-size:16px;font-weight:400;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);line-height:1.2}
.nav-logo-sub{font-family:var(--M);font-size:9px;letter-spacing:.28em;text-transform:uppercase;color:var(--muted);margin-top:4px;font-weight:400}
.nav-links{display:flex;gap:36px;list-style:none}
.nav-links a{font-family:var(--B);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--cream);text-decoration:none;opacity:.9;transition:opacity .3s,color .3s}
.nav-links a:hover{opacity:1;color:var(--gold)}
.nav-actions{display:flex;align-items:center;gap:12px}
.nav-icon{background:transparent;border:1px solid rgba(200,164,74,.4);color:var(--gold);width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:none;transition:background-color .3s,color .3s}
.nav-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.nav-icon:hover{background:var(--gold);color:var(--bg)}
.nav-cart{background:transparent;border:1px solid rgba(200,164,74,.4);color:var(--gold);font-family:var(--B);font-size:11px;letter-spacing:.15em;text-transform:uppercase;padding:10px 24px;cursor:none;transition:all .3s}
.nav-cart:hover{background:var(--gold);color:var(--bg)}
#cart-count{background:var(--gold);color:var(--bg);border-radius:50%;width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:600;margin-left:8px;vertical-align:middle}

/* HERO */
#hero{position:relative;min-height:100vh;overflow:hidden;background:var(--bg);display:flex}
/* IMAGE plein cadre + voile dégradé pour garder le texte (à gauche) lisible */
#heroBg{position:absolute;inset:0;z-index:0;background:url('../images/hero.jpg') center/cover no-repeat}
/* Vidéo de fond du hero (miel qui coule) — muette, ralentie en JS, en boucle.
   Posée par-dessus #heroBg (poster/fallback), sous le voile .hero-scrim. */
#heroVid{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
@media(prefers-reduced-motion:reduce){#heroVid{display:none}}
.hero-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,rgba(8,6,1,.88) 0%,rgba(8,6,1,.62) 38%,rgba(8,6,1,.22) 66%,rgba(8,6,1,.05) 100%),linear-gradient(to top,rgba(8,6,1,.78),transparent 44%)}
.hero-wrap{position:relative;z-index:2;width:100%;max-width:1480px;margin:0 auto;padding:140px 48px 56px;display:grid;grid-template-columns:minmax(0,860px);grid-template-rows:auto 1fr auto;grid-template-areas:"label" "title" "cta";align-items:start}
/* cartouche d'identité — façon étiquette de pot */
.hero-label{grid-area:label;display:flex;flex-direction:column;gap:9px;max-width:300px}
.hl-line{display:flex;align-items:center;gap:12px;font-family:var(--M);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--cream2);text-shadow:0 1px 8px rgba(0,0,0,.7)}
.hl-line::before{content:"";width:16px;height:1px;background:var(--gold);opacity:.7;flex-shrink:0}
.hl-strong{color:var(--gold2);font-weight:600}
.hl-coord{font-variant-numeric:tabular-nums;letter-spacing:.1em;opacity:.7}
/* titre disproportionné, désaligné ; « des Monts d'Or » déborde vers la droite */
.hero-headline{grid-area:title;align-self:end;position:relative;z-index:3}
.hero-headline h1{margin:0;font-family:var(--H);font-weight:300;line-height:.9;letter-spacing:-.01em;color:var(--cream);text-shadow:0 3px 36px rgba(0,0,0,.62)}
.hl-1{display:block;font-size:clamp(40px,6.5vw,82px)}
.hl-2{display:block;font-style:italic;color:var(--gold2);font-size:clamp(52px,9.5vw,128px);margin-left:clamp(16px,5vw,96px);white-space:nowrap;text-shadow:0 0 60px rgba(200,164,74,.2)}
.hero-kicker{font-family:var(--B);font-size:13px;line-height:1.75;color:var(--cream2);opacity:.92;max-width:380px;margin-top:26px;text-shadow:0 1px 12px rgba(0,0,0,.8)}
.hero-kicker strong{color:var(--cream);opacity:1;font-weight:500}
/* CTA : un seul, en lien souligné (pas un bouton générique) + lien secondaire discret */
.hero-cta{grid-area:cta;align-self:end;display:flex;align-items:baseline;gap:28px;flex-wrap:wrap;margin-top:40px}
.hero-go{font-family:var(--B);font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--cream);text-decoration:none;display:inline-flex;align-items:center;gap:12px;padding-bottom:7px;border-bottom:1px solid var(--gold);transition:color .3s,gap .3s}
.hero-go .arr{color:var(--gold);transition:transform .3s}
.hero-go:hover{color:var(--gold2)}
.hero-go:hover .arr{transform:translateX(6px)}
.hero-alt{font-family:var(--B);font-size:11px;letter-spacing:.06em;color:var(--muted);text-decoration:none;transition:color .3s}
.hero-alt:hover{color:var(--gold)}
/* réassurance sous les CTA du hero — faits réels (lève le frein « est-ce sûr ? ») */
.hero-trust{flex-basis:100%;list-style:none;margin:24px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px 22px;font-family:var(--B);font-size:11px;letter-spacing:.04em;color:var(--cream2);opacity:.86}
.hero-trust li{display:flex;align-items:center;gap:9px;text-shadow:0 1px 10px rgba(0,0,0,.7)}
.hero-trust li::before{content:"";width:5px;height:5px;border:1px solid var(--gold);transform:rotate(45deg);flex-shrink:0;opacity:.85}
/* entrée en CSS pur (joue dès le 1er rendu, sans attendre GSAP) */
@keyframes heroIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
.hero-label,.hero-headline,.hero-cta{animation:heroIn .9s cubic-bezier(.33,1,.68,1) both}
.hero-label{animation-delay:.1s}
.hero-headline{animation-delay:.34s}
.hero-cta{animation-delay:.56s}
@media(max-width:880px){
  .hero-wrap{grid-template-columns:1fr;grid-template-areas:"label" "title" "cta";padding:116px 24px 48px;row-gap:28px;column-gap:0}
  .hero-headline{align-self:start}
  .hl-2{white-space:normal;margin-left:0;font-size:clamp(46px,14vw,86px)}
  .hl-1{font-size:clamp(34px,9vw,58px)}
  .hero-cta{margin-top:30px}
}
/* PARTICULES — poussière de pollen doré (transform/opacity = GPU) */
.particles{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.particles.paused .particle{animation-play-state:paused}
.particle{position:absolute;bottom:-12px;border-radius:50%;background:radial-gradient(circle,rgba(245,228,160,.95),rgba(200,164,74,.35) 55%,transparent 72%);opacity:0;animation:floatUp linear infinite;will-change:transform,opacity}
@keyframes floatUp{
  0%{transform:translate3d(0,0,0) scale(.7);opacity:0}
  12%{opacity:var(--mop,.7)}
  88%{opacity:var(--mop,.7)}
  100%{transform:translate3d(var(--dx,18px),-108vh,0) scale(1);opacity:0}
}
@media(prefers-reduced-motion:reduce){.particles{display:none}}
.hero-ctas{display:flex;gap:20px;justify-content:center;flex-wrap:wrap}
.btn-gold{background:var(--gold);color:var(--bg);font-family:var(--B);font-size:11px;letter-spacing:.2em;text-transform:uppercase;padding:16px 44px;cursor:none;transition:all .35s;border:none;text-decoration:none;display:inline-block;font-weight:500;position:relative;overflow:hidden}
.btn-gold:hover{background:var(--gold2);transform:translateY(-2px);box-shadow:0 8px 32px rgba(200,164,74,.3)}
/* éclat lumineux au survol (04/07, pattern « shine button » adapté) */
.btn-gold::after{content:'';position:absolute;top:0;bottom:0;left:-80%;width:55%;background:linear-gradient(105deg,transparent,rgba(255,248,222,.55),transparent);transform:skewX(-18deg);transition:left .65s ease;pointer-events:none}
.btn-gold:hover::after{left:135%}

/* ═══ UI 04/07 (patterns 21st.dev adaptés en vanilla, DA maison) ═══ */
/* fil de progression de lecture — hairline dorée au ras du haut de l'écran */
#read-progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:101;background:linear-gradient(90deg,var(--gold),var(--gold2));transform:scaleX(0);transform-origin:left;pointer-events:none}
/* retour en haut — au-dessus de la bulle « Une question ? » */
#to-top{position:fixed;right:33px;bottom:96px;z-index:79;width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:rgba(22,15,6,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(200,164,74,.4);border-radius:50%;color:var(--gold2);opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .35s,transform .35s,border-color .3s;cursor:none}
#to-top.show{opacity:1;transform:none;pointer-events:auto}
#to-top:hover{border-color:var(--gold);color:var(--gold)}
#to-top svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* toast — confirmation d'ajout au panier, sans interrompre la navigation */
#toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,150%);z-index:710;display:flex;align-items:center;gap:20px;background:rgba(22,15,6,.96);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(200,164,74,.45);padding:15px 22px;box-shadow:0 18px 50px rgba(0,0,0,.55);transition:transform .55s cubic-bezier(.22,1,.36,1);max-width:min(92vw,480px)}
#toast.show{transform:translate(-50%,0)}
#toast::before{content:'';width:8px;height:8px;flex-shrink:0;background:var(--gold);clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
.toast-msg{font-family:var(--B);font-size:13px;color:var(--cream)}
.toast-act{font-family:var(--M);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);background:none;border:none;border-bottom:1px solid rgba(200,164,74,.5);padding:2px 0;cursor:none;white-space:nowrap;transition:color .3s,border-color .3s}
.toast-act:hover{color:var(--gold2);border-color:var(--gold2)}
/* pastille panier qui pulse à l'ajout */
#cart-count.bump{animation:cartBump .55s cubic-bezier(.34,1.56,.64,1)}
@keyframes cartBump{30%{transform:scale(1.5)}}
@media(prefers-reduced-motion:reduce){
  .btn-gold::after{display:none}
  #cart-count.bump{animation:none}
  #toast{transition:opacity .3s}
  #to-top{transition:opacity .3s}
}
.btn-outline{background:transparent;color:var(--cream);font-family:var(--B);font-size:11px;letter-spacing:.2em;text-transform:uppercase;padding:15px 44px;cursor:none;transition:all .35s;border:1px solid rgba(242,232,204,.2);text-decoration:none;display:inline-block}
.btn-outline:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-2px)}
.hero-scroll{position:absolute;bottom:38px;right:48px;display:flex;flex-direction:column;align-items:center;gap:10px;opacity:.5;z-index:3}
/* on masque l'indicateur « Défiler » quand la hauteur est juste (sinon il chevauche les boutons) */
@media(max-height:820px){.hero-scroll{display:none}}
.hero-scroll span{font-family:var(--B);font-size:9px;letter-spacing:.35em;text-transform:uppercase;color:var(--cream)}
.scroll-line{width:1px;height:48px;background:linear-gradient(to bottom,var(--gold),transparent);animation:scrollAnim 2s ease-in-out infinite}
@keyframes scrollAnim{0%,100%{opacity:.3;transform:scaleY(1)}50%{opacity:1;transform:scaleY(.6)}}

/* MARQUEE */
.marquee-wrap{padding:26px 0;border-top:1px solid rgba(200,164,74,.1);border-bottom:1px solid rgba(200,164,74,.1);background:rgba(200,164,74,.03);overflow:hidden;white-space:nowrap}
.marquee-track{display:inline-flex;animation:marqueeAnim 34s linear infinite;will-change:transform}
.marquee-track span{font-family:var(--H);font-size:clamp(22px,3.4vw,34px);font-style:italic;letter-spacing:.1em;color:var(--gold);opacity:.74;padding:0 44px}
.marquee-track .sep{color:var(--gold3);opacity:.7}
@keyframes marqueeAnim{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* CTA FLOTTANT — rappel d'action discret, révélé au scroll */
#floatCta{position:fixed;right:28px;bottom:28px;z-index:80;display:inline-flex;align-items:center;gap:11px;padding:14px 24px;background:rgba(22,15,6,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(200,164,74,.4);color:var(--gold2);font-family:var(--B);font-size:11px;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;box-shadow:0 14px 40px rgba(0,0,0,.5);opacity:0;visibility:hidden;transform:translateY(16px);transition:opacity .3s,transform .3s,visibility .3s,border-color .3s,color .3s;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}
#floatCta.show{opacity:1;visibility:visible;transform:translateY(0)}
#floatCta:hover{border-color:var(--gold2);color:var(--cream)}
#floatCta .arr{transition:transform .3s}
#floatCta:hover .arr{transform:translateX(5px)}
@media(max-width:680px){#floatCta{left:16px;right:16px;bottom:16px;justify-content:center;padding:16px 24px}}
@media(prefers-reduced-motion:reduce){#floatCta{transition:opacity .2s,visibility .2s}#floatCta.show{transform:none}}

/* SECTION COMMON */
.section-eyebrow{font-family:var(--M);font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--gold);opacity:.85;margin-bottom:16px;display:inline-flex;align-items:center;gap:9px}
.section-eyebrow::before{content:"";width:22px;height:1px;background:var(--gold);opacity:.6}
/* TITRES — voix couture façon maison de parfum (Xerjoff / M.F.Kurkdjian) :
   Cormorant Garamond LIGHT (300), grand, aéré, fort contraste avec le corps Inter.
   On quitte le Playfair « luxe par défaut » (tell de slop IA). */
.section-title{font-family:var(--H);font-size:clamp(40px,5.4vw,76px);font-weight:300;line-height:.98;letter-spacing:-.004em;color:var(--cream);margin-bottom:18px}
.section-title em{font-style:italic;font-weight:300;color:var(--gold)}
/* révélation mot à mot des titres : chaque mot monte derrière son masque */
.wr-line{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.14em;margin-bottom:-.14em}
.wr-word{display:inline-block}
.section-eyebrow{letter-spacing:.36em}
.section-line{width:48px;height:1px;background:var(--gold);opacity:.45;margin-bottom:28px;position:relative;overflow:hidden}
.section-line::after{content:'';position:absolute;top:0;left:0;width:45%;height:100%;background:linear-gradient(90deg,transparent,rgba(245,228,160,.95),transparent);animation:lineSheen 5.5s ease-in-out infinite;will-change:transform}
@keyframes lineSheen{0%{transform:translateX(-120%)}55%,100%{transform:translateX(360%)}}
@media(prefers-reduced-motion:reduce){.section-line::after{display:none}}

/* MIELS — accordéon horizontal (lamelles qui s'ouvrent au survol) */
/* overflow-x:clip : l'atmo décorative (inset négatif) créait 6px de scroll
   horizontal aux largeurs intermédiaires (~950px) — bug relevé à l'audit 11/07 */
#miels{padding:100px 48px;background:transparent;position:relative;overflow-x:clip}
/* EN-TÊTES ÉDITORIAUX — titre à gauche, intro à droite (sort du tout-centré) */
.miels-header,.creations-header,.precom-header{display:grid;grid-template-columns:1.35fr 1fr;column-gap:52px;align-items:end;text-align:left;margin-bottom:54px}
.miels-header .section-eyebrow,.creations-header .section-eyebrow,.precom-header .section-eyebrow{grid-column:1;grid-row:1;margin:0 0 14px}
.miels-header .section-title,.creations-header .section-title,.precom-header .section-title{grid-column:1;grid-row:2;margin:0}
.miels-header .section-line,.creations-header .section-line,.precom-header .section-line{grid-column:1;grid-row:3;margin:16px 0 0}
.miels-header>p,.creations-header>p,.precom-header>p{grid-column:2;grid-row:2/4;align-self:end;margin:0!important;max-width:460px}
@media(max-width:760px){
  .miels-header,.creations-header,.precom-header{grid-template-columns:1fr;row-gap:18px}
  .miels-header>p,.creations-header>p,.precom-header>p{grid-column:1;grid-row:auto}
}
/* ── MIELS : décor « matières & abeilles » autour de l'en-tête (inspirations fournies) ── */
.miels-header{position:relative;z-index:1}
.miels-atmo{position:absolute;inset:-70px -30px -120px;z-index:0;pointer-events:none}
.atmo-glow{position:absolute;left:30%;top:46%;width:560px;height:380px;transform:translate(-50%,-50%);background:radial-gradient(ellipse,rgba(200,164,74,.15),transparent 66%);filter:blur(8px)}
.miels-atmo .hex{position:absolute;opacity:.5;will-change:transform}
.miels-atmo .hex polygon{fill:none;stroke:rgba(200,164,74,.5);stroke-width:2.5}
.miels-atmo .hex.solid polygon{fill:rgba(200,164,74,.07);stroke:rgba(200,164,74,.34)}
.miels-atmo .pollen{position:absolute;width:6px;height:6px;border-radius:50%;background:radial-gradient(circle,var(--gold4),rgba(200,164,74,.25));box-shadow:0 0 11px 2px rgba(232,204,122,.45);opacity:.7;will-change:transform}
.miels-atmo .bee{display:none}
@media (prefers-reduced-motion:reduce){.bee-wings{animation:none}}
.miels-strip{display:flex;gap:8px;max-width:1500px;margin:0 auto;height:560px;contain:layout}

/* HONEY CARD — lamelle fermée, s'ouvre au survol.
   Coins nets + liseré or intérieur (étiquette de luxe).
   Pas de filter sur l'image : l'assombrissement passe par l'overlay (composité). */
.hc{
  position:relative;overflow:hidden;cursor:none;
  flex:1 1 0;min-width:0;
  border-radius:5px;
  border:1px solid rgba(200,164,74,.16);
  box-shadow:0 22px 44px -20px rgba(0,0,0,.55),inset 0 1px 0 rgba(200,164,74,.1);
  transition:flex .55s cubic-bezier(.33,1,.68,1),border-color .45s;
  background:var(--bg3);
  contain:layout paint;
}
.hc::after{content:'';position:absolute;inset:9px;border:1px solid rgba(200,164,74,.18);border-radius:2px;pointer-events:none;z-index:3;transition:border-color .45s}
.hc:hover{flex:4.6 1 0;border-color:rgba(200,164,74,.38)}
.hc:hover::after{border-color:rgba(200,164,74,.45)}
/* will-change posé seulement au survol (pas 6 couches GPU permanentes) */
.hc-bg{position:absolute;inset:-1px;background-size:cover;background-position:center;transform:translateZ(0);transition:transform .6s cubic-bezier(.33,1,.68,1)}
.hc:hover .hc-bg{transform:scale(1.035) translateZ(0);will-change:transform}
.hc-overlay{position:absolute;inset:0;background:linear-gradient(rgba(8,6,1,.26),rgba(8,6,1,.26)),linear-gradient(to top,rgba(8,6,1,.95) 0%,rgba(8,6,1,.5) 45%,rgba(8,6,1,.18) 100%);opacity:1;transition:opacity .58s cubic-bezier(.33,1,.68,1)}
.hc:hover .hc-overlay{opacity:.78}

/* étiquette fermée — nom vertical sur la tranche */
.hc-spine{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:18px;padding-bottom:28px;transition:opacity .35s}
.hc:hover .hc-spine{opacity:0;transition:opacity .2s}
.hc-spine-idx{font-family:var(--B);font-size:10px;letter-spacing:.25em;color:var(--gold);opacity:.7}
.hc-spine-name{font-family:var(--H);font-size:22px;font-style:italic;color:var(--cream);writing-mode:vertical-rl;transform:rotate(180deg);letter-spacing:.05em;white-space:nowrap;text-shadow:0 2px 14px rgba(0,0,0,.7)}

/* contenu ouvert */
.hc-content{position:absolute;bottom:0;left:0;padding:34px 30px;width:360px;max-width:88%;opacity:0;transform:translateY(16px);transition:opacity .4s .18s,transform .55s .18s}
.hc:hover .hc-content{opacity:1;transform:translateY(0)}
.hc-tag{font-family:var(--M);font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);opacity:.75;margin-bottom:7px;white-space:nowrap}
.hc-name{font-family:var(--H);font-size:32px;font-weight:400;font-style:italic;color:var(--cream);line-height:1.1;margin-bottom:8px;white-space:nowrap}
.hc-note{font-family:var(--B);font-size:12.5px;color:var(--cream2);opacity:.7;line-height:1.55;margin-bottom:12px}
.hc-price{font-family:var(--H);font-size:19px;font-weight:500;color:var(--gold)}
.hc-add{position:absolute;top:16px;left:16px;width:34px;height:34px;background:rgba(40,28,10,.62);border:1px solid rgba(200,164,74,.32);color:var(--gold);font-size:18px;cursor:none;display:flex;align-items:center;justify-content:center;opacity:0;transition:all .3s .2s}
.hc:hover .hc-add{opacity:1}
.hc-add:hover{background:var(--gold);color:var(--bg)}

/* CREATIONS */
#creations{padding:100px 48px;background:transparent}
.creations-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;max-width:1500px;margin:0 auto}

.cc{position:relative;overflow:hidden;cursor:none;aspect-ratio:2/3;border-radius:5px;border:1px solid rgba(200,164,74,.14);box-shadow:0 22px 44px -20px rgba(0,0,0,.5),inset 0 1px 0 rgba(200,164,74,.08);transition:transform .4s,border-color .4s;background:var(--bg3)}
.cc::after{content:'';position:absolute;inset:9px;border:1px solid rgba(200,164,74,.16);border-radius:2px;pointer-events:none;z-index:3;transition:border-color .4s}
.cc:hover{transform:translateY(-8px);border-color:rgba(200,164,74,.36)}
.cc:hover::after{border-color:rgba(200,164,74,.42)}
.cc-bg{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .65s}
.cc:hover .cc-bg{transform:scale(1.07)}
.cc-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(8,6,1,.92) 0%,rgba(8,6,1,.38) 50%,transparent 100%);transition:opacity .4s}
.cc:hover .cc-overlay{opacity:.85}
.cc-content{position:absolute;bottom:24px;left:24px;right:24px}
.cc-cat{font-family:var(--M);font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:8px;opacity:.8}
.cc-name{font-family:var(--H);font-size:24px;font-style:italic;font-weight:400;color:var(--cream);line-height:1.2;margin-bottom:6px}
.cc-desc{font-family:var(--B);font-size:12px;color:var(--cream2);opacity:.6;line-height:1.6;margin-bottom:12px}
.cc-price{font-family:var(--H);font-size:18px;color:var(--gold);font-weight:500}

/* PRECOMMANDES */
#precommandes{padding:100px 48px;background:transparent}
.precom-tabs{display:flex;gap:0;justify-content:center;margin-bottom:52px;border:1px solid rgba(200,164,74,.18)}
.ptab{background:transparent;border:none;color:var(--cream2);font-family:var(--B);font-size:11px;letter-spacing:.2em;text-transform:uppercase;padding:14px 48px;cursor:none;transition:all .3s;opacity:.55}
.ptab.active{background:var(--gold);color:var(--bg);opacity:1}
.pane{display:none}
.pane.active{display:grid;grid-template-columns:1fr 1fr;gap:64px;max-width:1100px;margin:0 auto;align-items:start}
.precom-info h3{font-family:var(--P);font-size:26px;font-weight:400;font-style:italic;color:var(--cream);margin-bottom:16px;line-height:1.3}
.precom-info p{font-family:var(--B);font-size:14px;line-height:1.85;color:var(--cream2);opacity:.72;margin-bottom:18px}
.precom-info p strong{color:var(--cream);opacity:1;font-weight:500}
.precom-details{list-style:none;margin-bottom:28px}
.precom-details li{font-family:var(--B);font-size:13px;color:var(--cream2);opacity:.68;padding:9px 0;border-bottom:1px solid rgba(200,164,74,.08);display:flex;justify-content:space-between}
.precom-details li span{color:var(--gold);font-weight:500}
.cal-label{font-family:var(--B);font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);opacity:.65;margin-bottom:18px}
.cal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:28px}
.cal-m{font-family:var(--B);font-size:11px;text-align:center;padding:11px 6px;border:1px solid rgba(200,164,74,.08);color:var(--cream2);opacity:.3;cursor:default;letter-spacing:.04em}
.cal-m.avail{opacity:1;border-color:rgba(200,164,74,.38);cursor:none;color:var(--cream);transition:all .25s}
.cal-m.avail:hover,.cal-m.sel{background:var(--gold);color:var(--bg);border-color:var(--gold);opacity:1}
.cal-m.full{opacity:.45;color:var(--muted);position:relative}
.cal-m.full::after{content:'complet';display:block;font-size:8px;letter-spacing:.08em;color:var(--muted);margin-top:2px}
.cal-mois{grid-column:1/-1;font-family:var(--M,var(--B));font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold2);opacity:.85;padding:8px 2px 2px;margin-top:4px}
.lot-note{font-family:var(--B);font-size:12px;line-height:1.6;color:var(--cream2);opacity:.75;margin:-4px 0 4px;padding:11px 14px;border-left:2px solid rgba(200,164,74,.4);background:rgba(200,164,74,.05)}
.lot-note strong{color:var(--gold2)}
.cal-grid[data-cal="reines"] .cal-mois:first-child{margin-top:0}
.precom-form{display:flex;flex-direction:column;gap:13px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.form-field input,.form-field textarea,.form-field select{width:100%;background:rgba(255,255,255,.035);border:1px solid rgba(200,164,74,.18);color:var(--cream);font-family:var(--B);font-size:13px;padding:13px 16px;outline:none;transition:border-color .3s;resize:none;-webkit-appearance:none}
.form-field input:focus,.form-field textarea:focus,.form-field select:focus{border-color:rgba(200,164,74,.55)}
.form-field select option{background:var(--bg2);color:var(--cream)}
.form-label{font-family:var(--B);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:5px;display:block}
.mois-line{font-family:var(--B);font-size:12px;color:var(--cream2);opacity:.75;padding:11px 16px;border:1px dashed rgba(200,164,74,.28);display:flex;gap:6px;flex-wrap:wrap}
.mois-line strong{color:var(--gold);font-weight:500}
.form-ok{display:none;font-family:var(--B);font-size:12.5px;line-height:1.65;color:var(--cream2);background:rgba(200,164,74,.06);border:1px solid rgba(200,164,74,.32);padding:13px 16px}
.form-ok.on{display:block}
.form-err{margin-top:12px;font-family:var(--B);font-size:12.5px;line-height:1.6;color:#E6B98C;background:rgba(190,120,70,.08);border:1px solid rgba(190,120,70,.34);padding:12px 15px}
.form-err a{color:var(--gold);text-decoration:underline}
.precom-form button[type=submit]:disabled{opacity:.55}

/* GARANTIES */
.trust-strip{background:var(--bg2);border-top:1px solid rgba(200,164,74,.08);padding:38px 48px}
.trust-inner{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.tb{display:flex;align-items:center;gap:15px}
.tb svg{width:32px;height:32px;flex-shrink:0;stroke:var(--gold);fill:none;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
.tb-title{font-family:var(--B);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--cream);opacity:.88;font-weight:500}
.tb-sub{font-family:var(--B);font-size:11px;color:var(--muted);margin-top:3px;letter-spacing:.02em;line-height:1.5}

/* AVIS */
#avis{padding:100px 0;background:transparent;overflow:hidden;content-visibility:auto;contain-intrinsic-size:auto 640px}
.avis-header{text-align:center;margin-bottom:22px;padding:0 48px}
.avis-header .section-line{margin:0 auto 28px}
.avis-note{font-family:var(--B);font-size:12px;letter-spacing:.04em;color:var(--muted);margin-top:14px;font-style:italic}
.avis-agg{display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:50px;flex-wrap:wrap;padding:0 24px}
.avis-agg-note{font-family:var(--H);font-size:36px;font-style:italic;color:var(--gold);line-height:1}
.avis-stars{display:flex;gap:2px}
.avis-stars svg{width:15px;height:15px;fill:var(--gold)}
.avis-stars svg.half{opacity:.35}
.avis-agg-src{font-family:var(--B);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.avis-wrap{position:relative}
.avis-wrap::before,.avis-wrap::after{content:'';position:absolute;top:0;bottom:0;width:110px;z-index:2;pointer-events:none}
.avis-wrap::before{left:0;background:linear-gradient(to right,var(--bg),transparent)}
.avis-wrap::after{right:0;background:linear-gradient(to left,var(--bg),transparent)}
/* Double marquee (04/07, pattern Magic UI adapté) : rangée A vers la gauche,
   rangée B vers la droite, vitesses désynchronisées — survol = pause de la rangée */
.avis-wrap{display:flex;flex-direction:column;gap:20px}
.avis-track{display:flex;gap:20px;width:max-content;padding:8px 0;animation:avisScroll var(--av-dur,60s) linear infinite;will-change:transform}
.avis-track--a{--av-dur:56s}
.avis-track--b{--av-dur:72s;animation-direction:reverse}
.avis-track:hover{animation-play-state:paused}
@keyframes avisScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.av{width:360px;flex-shrink:0;position:relative;background:linear-gradient(160deg,rgba(31,22,9,.94),rgba(15,10,4,.9));border:1px solid rgba(200,164,74,.16);clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%);padding:28px 26px 22px;display:flex;flex-direction:column;gap:12px;transition:border-color .4s,transform .4s cubic-bezier(.33,1,.68,1),background-color .4s}
/* guillemet doré en filigrane — la carte devient une citation */
.av::before{content:'«';position:absolute;top:6px;right:22px;font-family:var(--H);font-style:italic;font-size:70px;line-height:1;color:var(--gold);opacity:.13;pointer-events:none;transition:opacity .4s}
/* liseré d'encre qui se tire au survol */
.av::after{content:'';position:absolute;top:0;left:0;right:14px;height:2px;background:linear-gradient(90deg,var(--gold),transparent);transform:scaleX(0);transform-origin:left;transition:transform .55s cubic-bezier(.33,1,.68,1)}
.av:hover{transform:translateY(-7px);border-color:rgba(200,164,74,.5)}
.av:hover::before{opacity:.3}
.av:hover::after{transform:scaleX(1)}
.av-stars{color:var(--gold);font-size:10.5px;letter-spacing:2.5px;margin-left:7px;text-shadow:0 0 10px rgba(200,164,74,.45)}
.av:hover{border-color:rgba(200,164,74,.32);transform:translateY(-3px)}
.av-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.av-prod{font-family:var(--B);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);opacity:.65}
.av-text{font-family:var(--B);font-size:13px;line-height:1.7;color:var(--cream2);opacity:.82;flex:1}
.av-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:10px;padding-top:4px}
.av-who{font-family:var(--H);font-size:15px;font-style:italic;color:var(--cream)}
.av-where{font-family:var(--B);font-size:10.5px;color:var(--muted);margin-top:2px}
.av-badge{font-family:var(--M);font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);opacity:.78;border:1px solid rgba(200,164,74,.28);padding:4px 8px;white-space:nowrap}
@media (prefers-reduced-motion:reduce){.avis-track{animation:none;flex-wrap:wrap;width:auto;justify-content:center;padding:8px 24px}}

/* SAVOIR-FAIRE */
/* overflow:clip (03/07) : contient le fond débordant SANS créer de conteneur de défilement —
   indispensable pour que le rail sticky du protocole colle au viewport */
#savoir{position:relative;padding:96px 48px;overflow:clip}
#savoirBg{position:absolute;inset:-20%;background:url('../images/miel-acacia-sm.jpg') center/cover no-repeat;filter:brightness(.32) saturate(.6)}
/* voile renforcé au centre (03/07) : les gestes n'ont plus de fond de carte, le texte pose directement sur la photo */
.savoir-overlay{position:absolute;inset:0;background:radial-gradient(ellipse 80% 70% at 50% 50%,rgba(200,164,74,.04),transparent 70%),linear-gradient(to bottom,rgba(8,6,1,.68),rgba(8,6,1,.52),rgba(8,6,1,.74))}
.savoir-inner{position:relative;z-index:2;max-width:1300px;margin:0 auto}
.savoir-header{text-align:center;margin-bottom:28px}
.savoir-header .section-line{margin:0 auto 16px}
/* accroche condensée (remplace l'ancien bandeau-portrait : Jan est désormais au centre de l'éventail) */
.savoir-lead-wrap{max-width:780px;margin:0 auto 40px;text-align:center}
.savoir-lead{font-family:var(--B);font-size:15px;line-height:1.7;color:var(--cream2);opacity:.82}
.savoir-lead strong{color:var(--cream);opacity:1;font-weight:500}
.savoir-lead-wrap .savoir-chips{justify-content:center;margin-top:16px}
/* bandeau humain : portrait de Jan + accroche */
.savoir-intro{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:center;margin-bottom:64px;padding-bottom:60px;border-bottom:1px solid rgba(200,164,74,.12)}
.savoir-portrait{position:relative;aspect-ratio:4/5;border-radius:8px;overflow:hidden;border:1px solid rgba(200,164,74,.2);background-image:var(--ph);background-size:cover;background-position:center;box-shadow:0 30px 60px -28px rgba(0,0,0,.7)}
.savoir-portrait::after{content:'';position:absolute;inset:0;border:1px solid rgba(200,164,74,.18);border-radius:7px;margin:9px;pointer-events:none}
.savoir-portrait-img{position:absolute;inset:0;background-size:cover;background-position:center}
.savoir-sign{font-family:var(--B);font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);opacity:.8;margin-bottom:16px}
.savoir-intro h3{font-family:var(--P);font-size:clamp(24px,3vw,34px);font-weight:400;font-style:italic;color:var(--cream);line-height:1.2;margin-bottom:20px}
.savoir-intro h3 em{font-style:normal;color:var(--gold2)}
.savoir-intro p{font-family:var(--B);font-size:14.5px;line-height:1.85;color:var(--cream2);opacity:.74;margin-bottom:16px;max-width:560px}
.savoir-intro p strong{color:var(--cream);opacity:1;font-weight:500}
.savoir-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.savoir-chip{font-family:var(--B);font-size:11px;letter-spacing:.04em;color:var(--cream2);background:rgba(200,164,74,.06);border:1px solid rgba(200,164,74,.2);border-radius:40px;padding:7px 15px;display:flex;align-items:center;gap:8px}
.savoir-chip svg{width:13px;height:13px;stroke:var(--gold);fill:none;stroke-width:1.6}
/* LE PROTOCOLE — lecture par chapitres (03/07 v2) : rail sticky à gauche avec numéral
   romain géant AU TRAIT (contour, pas de remplissage) qui change au fil du scroll +
   ligne de progression. Le registre se lit à droite. Mobile / sans JS : registre seul. */
.proto{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:290px 1fr;gap:64px;align-items:start}
.proto-rail{position:sticky;top:110px;display:grid;grid-template-rows:auto auto auto;gap:30px;padding:8px 0 4px}
.proto-cap{font-family:var(--M);font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);opacity:.8}
.proto-cap span{display:block;font-family:var(--H);font-style:italic;font-size:17px;letter-spacing:.02em;text-transform:none;color:var(--cream2);opacity:.62;margin-top:7px}
.proto-num-stage{display:flex;align-items:center;justify-content:center;overflow:hidden;height:236px}
.proto-num{font-family:var(--H);font-style:italic;font-weight:400;font-size:clamp(150px,15vw,218px);line-height:1;color:transparent;-webkit-text-stroke:1.5px rgba(200,164,74,.6);letter-spacing:.04em;user-select:none}
.proto-num.swap{animation:protoSwap .65s cubic-bezier(.22,1,.36,1)}
@keyframes protoSwap{from{opacity:0;filter:blur(7px);transform:translateY(22px)}}
@media(prefers-reduced-motion:reduce){.proto-num.swap{animation:none}.proto-fill{transition:none}}
.proto-foot{display:flex;align-items:center;gap:16px}
.proto-track{flex:1;height:1px;background:rgba(200,164,74,.18);position:relative;overflow:hidden}
.proto-fill{position:absolute;inset:0;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .25s linear}
.proto-count{font-family:var(--M);font-size:10.5px;letter-spacing:.2em;color:var(--gold);opacity:.75;font-variant-numeric:tabular-nums}
@media(max-width:980px){.proto{grid-template-columns:1fr;gap:0}.proto-rail{display:none}}
@media(min-width:981px){
  /* le rail porte le numéral : la colonne I–VI du registre devient redondante à droite */
  .proto .geste{grid-template-columns:1fr 236px}
  .proto .geste-n{display:none}
}
.gestes{list-style:none;margin:0 auto;padding:0;max-width:1120px}
.geste{display:grid;grid-template-columns:104px 1fr 236px;gap:48px;align-items:center;padding:36px 10px;border-top:1px solid rgba(200,164,74,.2);transition:background .45s,padding-left .45s}
.geste:last-child{border-bottom:1px solid rgba(200,164,74,.2)}
.geste:hover{background:linear-gradient(90deg,rgba(200,164,74,.05),transparent 68%);padding-left:26px}
.geste-n{font-family:var(--H);font-style:italic;font-weight:400;font-size:56px;line-height:.9;color:var(--gold);opacity:.3;letter-spacing:.02em;transition:opacity .45s;justify-self:center}
.geste:hover .geste-n{opacity:.8}
.geste-title{font-family:var(--P);font-size:clamp(21px,2.3vw,28px);font-weight:500;color:var(--cream);line-height:1.18;margin:0 0 11px}
.geste-title em{font-style:italic;color:var(--gold2)}
.geste-body{font-family:var(--B);font-size:14px;line-height:1.78;color:var(--cream2);opacity:.86;max-width:58ch;margin:0}
.geste-diff{position:relative;padding-left:18px;font-family:var(--B);font-size:13px;font-weight:500;line-height:1.6;color:#fff}
.geste-diff::before{content:'';position:absolute;left:0;top:2px;bottom:2px;width:2px;background:var(--gold);opacity:.6;transition:opacity .4s}
.geste:hover .geste-diff::before{opacity:1}
.geste-diff span{display:block;font-family:var(--M);font-size:9px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--gold2);margin-bottom:6px}
@media(max-width:980px){
  .geste{grid-template-columns:52px 1fr;gap:8px 20px;padding:28px 2px;align-items:start}
  .geste:hover{padding-left:2px}
  .geste-n{font-size:32px;justify-self:start;margin-top:5px}
  .geste-diff{grid-column:2;margin-top:14px}
}
/* Motion « maison » (03/07) — scroll-driven, amélioration progressive (Chrome) :
   les filets du protocole se tirent au fil du défilement, les numéros romains se posent,
   le colophon s'ouvre depuis le centre. Ignoré ailleurs, coupé si reduced-motion. */
@keyframes mhLine{from{transform:scaleX(0)}}
@keyframes mhNum{from{transform:translateY(16px)}}
@supports(animation-timeline:view()){
  @media(prefers-reduced-motion:no-preference){
    .geste{position:relative}
    .geste::before{content:'';position:absolute;top:-1px;left:0;right:0;height:1px;background:rgba(200,164,74,.5);transform-origin:left;animation:mhLine linear both;animation-timeline:view();animation-range:entry 0% cover 32%}
    .geste-n{animation:mhNum linear both;animation-timeline:view();animation-range:entry 0% cover 40%}
    .mentions{position:relative}
    .mentions::before{content:'';position:absolute;top:-1px;left:0;right:0;height:1px;background:rgba(200,164,74,.6);transform-origin:center;animation:mhLine linear both;animation-timeline:view();animation-range:entry 0% cover 42%}
  }
}
/* CARTES STAGES (11/07) — refonte : « cases génériques » → cartes-modules à photo.
   Une vraie image par niveau (rucher / cadre / élevage de reines), badge de niveau,
   titre serif, prix en évidence. `.sk` ne sert plus que dans .srv-grid (stages). */
.sk{position:relative;display:flex;flex-direction:column;overflow:hidden;border-radius:14px;border:1px solid rgba(200,164,74,.18);background:linear-gradient(155deg,rgba(36,26,10,.92),rgba(19,13,5,.88));box-shadow:0 18px 40px -26px rgba(0,0,0,.72),inset 0 1px 0 rgba(255,225,150,.06);transition:transform .45s cubic-bezier(.33,1,.68,1),border-color .4s,box-shadow .4s}
/* trait d'accent doré en haut qui s'illumine au survol (au-dessus de la photo) */
.sk::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;z-index:3;background:linear-gradient(to right,transparent,var(--gold2),transparent);transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.33,1,.68,1)}
.sk:hover{transform:translateY(-6px);border-color:rgba(200,164,74,.42);box-shadow:0 32px 60px -28px rgba(0,0,0,.82),0 0 44px -12px rgba(200,164,74,.28),inset 0 1px 0 rgba(255,225,150,.1)}
.sk:hover::after{transform:scaleX(1)}
.sk-media{position:relative;height:160px;overflow:hidden}
.sk-media-img{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .7s cubic-bezier(.22,1,.36,1)}
.sk:hover .sk-media-img{transform:scale(1.07)}
.sk-media::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(16,11,4,.97),rgba(16,11,4,.16) 58%,rgba(16,11,4,.44));pointer-events:none}
.sk-badge{position:absolute;left:15px;bottom:13px;z-index:1;display:inline-flex;align-items:center;gap:8px;font-family:var(--M);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);background:rgba(8,6,1,.55);border:1px solid rgba(200,164,74,.4);padding:6px 12px;border-radius:2px;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.sk-badge-n{font-family:var(--P);font-size:12px;font-weight:700;color:var(--gold2)}
.sk-in{display:flex;flex-direction:column;flex:1;padding:18px 22px 20px}
.sk-title{font-family:var(--P);font-size:22px;font-weight:600;color:var(--cream);margin-bottom:9px;line-height:1.2}
.sk-body{font-family:var(--B);font-size:13.5px;line-height:1.7;color:var(--cream2);opacity:.86;flex:1}
.sk-foot{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:16px;padding-top:13px;border-top:1px solid rgba(200,164,74,.16)}
.sk-price{font-family:var(--P);font-size:19px;font-style:italic;font-weight:600;color:var(--gold2)}
.sk-when{font-family:var(--M);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}

/* ───────────────────────────────────────────────────────────────
   L'ÉVENTAIL DU SAVOIR-FAIRE (desktop ≥1100px)
   Jan au centre dans son cadre ; les 6 gestes sont des CARTES
   lisibles déployées en éventail derrière sa carte — on lit tout
   directement, sans survol ni scroll. Survol = la carte se redresse
   et avance. Amélioration progressive (.fan-on) : sans JS, sur mobile
   ou en reduced-motion → bento ci-dessus.
   ─────────────────────────────────────────────────────────────── */
.fan{display:none}
@media(min-width:1100px){
  #savoir.fan-on .savoir-grid{display:none}
  #savoir.fan-on .fan{display:block}
}
.fan-stage{position:relative;height:806px;max-width:1340px;margin:0 auto;perspective:1400px}
.fan-ring{position:absolute;inset:0;z-index:1;will-change:transform}
/* cœur : portrait de Jan */
/* Jan : un CADRE rectangulaire (même langage que les portraits du site), pas une bulle */
.fan-core{position:absolute;left:50%;top:50%;z-index:10;width:clamp(300px,24vw,360px);aspect-ratio:4/5;text-align:left;pointer-events:none;will-change:transform;border-radius:14px;overflow:hidden;border:1px solid rgba(200,164,74,.42);box-shadow:0 54px 100px -30px rgba(0,0,0,.9),0 0 92px -12px rgba(200,164,74,.16)}
.fan-core-img{position:absolute;inset:0;background-size:cover;background-position:center 24%;background-image:var(--ph)}
.fan-core::after{content:"";position:absolute;inset:9px;border-radius:6px;border:1px solid rgba(232,204,122,.3);pointer-events:none;z-index:2}
.fan-core-cap{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:46px 22px 20px;background:linear-gradient(to top,rgba(8,6,1,.94),rgba(8,6,1,.45),transparent);font-family:var(--B);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--cream2);opacity:.9}
.fan-core-cap span{display:block;font-family:var(--H);font-style:italic;font-size:30px;letter-spacing:.02em;text-transform:none;color:var(--gold2);opacity:1;margin-bottom:3px}
/* halo derrière Jan */
.fan-stage::before{content:"";position:absolute;left:50%;top:50%;width:720px;height:580px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(ellipse,rgba(200,164,74,.11),transparent 64%);pointer-events:none;z-index:0}
/* carte-geste lisible (déployée en éventail derrière Jan) */
.fan-card{position:absolute;width:clamp(282px,21vw,332px);padding:26px 26px 24px;background:linear-gradient(158deg,rgba(41,31,12,.975),rgba(19,13,5,.95));border:1px solid rgba(200,164,74,.2);border-radius:16px;box-shadow:0 34px 64px -28px rgba(0,0,0,.86),inset 0 1px 0 rgba(255,225,150,.05);cursor:pointer;text-align:left;will-change:transform;transition:border-color .4s,box-shadow .4s}
.fan-card:hover,.fan-card:focus-visible{border-color:rgba(200,164,74,.5);box-shadow:0 40px 72px -26px rgba(0,0,0,.92),0 0 50px -12px rgba(200,164,74,.36),inset 0 1px 0 rgba(255,225,150,.1)}
.fan-card:focus{outline:none}
.fan-card:focus-visible{outline:2px solid var(--gold2);outline-offset:4px}
.fan-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.fan-card-ico{width:54px;height:54px;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,rgba(200,164,74,.2),rgba(200,164,74,.04));border:1px solid rgba(200,164,74,.32);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.fan-card-ico svg{width:27px;height:27px;stroke:var(--gold2);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.fan-card-num{font-family:var(--M);font-size:13px;letter-spacing:.22em;color:var(--gold);opacity:.55}
.fan-card-title{font-family:var(--P);font-size:23px;font-weight:500;color:var(--cream);line-height:1.2;margin-bottom:12px}
.fan-card-title em{font-style:italic;color:var(--gold2)}
.fan-card-body{font-family:var(--B);font-size:14.5px;line-height:1.6;color:var(--cream2);opacity:.88;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}

/* LA MIELLERIE EN CHIFFRES — bande de crédibilité, chiffres animés (count-up) */
#chiffres{padding:60px 48px;border-top:1px solid rgba(200,164,74,.14);border-bottom:1px solid rgba(200,164,74,.14);background:linear-gradient(180deg,rgba(20,14,6,.45),rgba(8,6,1,.12))}
.chiffres-inner{max-width:1080px;margin:0 auto}
.chiffres-kicker{display:flex;align-items:center;justify-content:center;gap:14px;font-family:var(--M);font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--gold);opacity:.85;margin-bottom:34px}
.chiffres-kicker::before,.chiffres-kicker::after{content:"";width:30px;height:1px;background:var(--gold);opacity:.5}
.chiffres-row{display:grid;grid-template-columns:repeat(3,1fr)}
.chiffre{position:relative;text-align:center;padding:4px 18px}
.chiffre + .chiffre::before{content:"";position:absolute;left:0;top:12%;height:76%;width:1px;background:rgba(200,164,74,.16)}
.ch-num{display:block;font-family:var(--H);font-weight:300;font-size:clamp(40px,4.8vw,64px);line-height:.95;letter-spacing:-.01em;color:var(--gold2)}
.ch-label{display:block;margin-top:13px;font-family:var(--M);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--cream2);opacity:.68}
@media(max-width:680px){.chiffres-row{grid-template-columns:repeat(2,1fr);row-gap:36px}.chiffre + .chiffre::before{display:none}}

/* NOTRE HISTOIRE — editorial magazine */
/* overflow:clip (pas hidden) : hidden neutralisait le position:sticky du portrait
   (il défilait au lieu de rester épinglé) — même piège que #savoir. clip contient
   quand même le portrait en parallaxe sans casser le collage (corrigé 11/07). */
#histoire{padding:120px 48px;background:transparent;overflow:clip}
.histoire-header{text-align:center;margin-bottom:72px}
.histoire-header .section-line{margin:0 auto 28px}

/* HISTOIRE — intro éditoriale avec portrait */
.hist-intro{max-width:1180px;margin:0 auto 30px;display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:center}
.hist-portrait{position:relative;aspect-ratio:4/5;border-radius:8px;overflow:hidden;border:1px solid rgba(200,164,74,.2);background-image:var(--ph);background-size:cover;background-position:center;box-shadow:0 34px 64px -30px rgba(0,0,0,.75);margin:0}
/* v4 : le cadre intérieur cède la place aux coins forgés (animés par GSAP) */
.hist-portrait::after{content:none}
/* z-index 1 : les crochets bas glissent SOUS la plaque de légende (z2) — plus de
   collision avec le texte « Jan », les crochets hauts restent francs sur l'image */
.hp-corner{position:absolute;width:26px;height:26px;z-index:1;pointer-events:none;opacity:.9}
.hp-c1{top:11px;left:11px;border-top:2px solid var(--gold);border-left:2px solid var(--gold)}
.hp-c2{top:11px;right:11px;border-top:2px solid var(--gold);border-right:2px solid var(--gold)}
.hp-c3{bottom:11px;left:11px;border-bottom:2px solid var(--gold);border-left:2px solid var(--gold)}
.hp-c4{bottom:11px;right:11px;border-bottom:2px solid var(--gold);border-right:2px solid var(--gold)}
/* image débordante haut/bas : la marge de la parallaxe GSAP (scrub) */
.hist-portrait-img{position:absolute;inset:-7% 0;background-size:cover;background-position:center;will-change:transform}
.hist-portrait-cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px 20px 16px;background:linear-gradient(to top,rgba(8,6,1,.9),transparent);font-family:var(--H);font-size:18px;font-style:italic;color:var(--cream)}
.hist-portrait-cap span{display:block;font-family:var(--B);font-size:10px;font-style:normal;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);opacity:.8;margin-top:5px}
.hist-lead .section-eyebrow{margin-bottom:20px}
/* ═══ « LA UNE » v5 (04/07) — LISIBLE : la phrase coule sur un seul axe, un seul
   accent monumental (le 40, Playfair, halo doré). La lumière guide la lecture. ═══ */
.hist-lock{display:block;font-family:var(--H);font-style:italic;font-weight:500;font-size:clamp(30px,3.5vw,47px);line-height:1.24;color:var(--cream);margin:0 0 24px;text-shadow:0 2px 26px rgba(0,0,0,.4)}
/* hlk- : préfixe propre au lock (un .hl-line « étiquette mono » existe déjà ailleurs) */
.hlk-line{display:block;font-family:inherit;font-size:inherit;letter-spacing:normal;text-transform:none}
.hlk-line2{margin-top:4px}
.hist-lock em{font-style:italic;color:var(--gold);text-shadow:0 0 22px rgba(200,164,74,.42)}
.hl-num{display:inline-block;font-family:var(--P);font-style:normal;font-weight:800;font-size:2.05em;line-height:.8;color:var(--gold);letter-spacing:-.03em;vertical-align:-.08em;margin:0 .05em;font-variant-numeric:lining-nums tabular-nums;text-shadow:0 0 28px rgba(200,164,74,.55),0 0 72px rgba(200,164,74,.25)}
/* récit : lettrine lumineuse, corps à pleine lisibilité */
.hist-p{font-family:var(--B);font-size:15.5px;line-height:1.95;color:var(--cream2);opacity:.92;max-width:58ch;margin-bottom:16px}
.hist-p strong{color:var(--cream);opacity:1;font-weight:500}
.hist-p::first-letter{font-family:var(--H);font-style:italic;font-weight:500;font-size:54px;line-height:.78;color:var(--gold);float:left;padding:7px 11px 0 0;text-shadow:0 0 20px rgba(200,164,74,.4)}
@media(max-width:700px){.hist-p::first-letter{font-size:42px;padding:5px 9px 0 0}}
/* v4 : le rêve devient une exergue — guillemet géant, plus de boîte ni de picto */
.hist-dream{position:relative;margin-top:26px;padding:4px 0 4px 24px;background:none;border:none;border-left:2px solid rgba(200,164,74,.55);border-radius:0;display:block}
.hist-dream svg{display:none}
.hist-dream::before{content:'«';position:absolute;top:-14px;left:8px;font-family:var(--H);font-style:italic;font-size:58px;line-height:1;color:var(--gold);opacity:.3;pointer-events:none}
.hist-dream p{font-family:var(--H);font-size:19.5px;font-style:italic;color:var(--gold2);line-height:1.55;margin:0;opacity:1;text-shadow:0 0 18px rgba(200,164,74,.22)}

/* HISTOIRE — frise verticale datée (récit, 02/07). Repères hexagonaux = signature ruche. */
.hist-frise{max-width:800px;margin:64px auto 0}
.hf-item{position:relative;display:grid;grid-template-columns:118px 1fr;gap:36px;padding-bottom:42px}
/* le fil : entre la date et le texte, il descend d'un jalon à l'autre */
.hf-item::before{content:'';position:absolute;left:135px;top:14px;bottom:-8px;width:1px;background:linear-gradient(to bottom,rgba(200,164,74,.4),rgba(200,164,74,.1))}
.hf-item:last-child{padding-bottom:0}
.hf-item:last-child::before{display:none}
/* le jalon : hexagone or */
.hf-item::after{content:'';position:absolute;left:130.5px;top:7px;width:10px;height:11px;background:var(--gold);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
/* v4 04/07 : les dates passent en Playfair gras — les jalons se voient de loin */
.hf-date{font-family:var(--P);font-style:normal;font-weight:700;font-size:clamp(21px,2.1vw,27px);letter-spacing:-.01em;color:var(--gold2);text-align:right;line-height:1.12;padding-top:0;text-shadow:0 0 16px rgba(200,164,74,.25)}
.hf-body{font-family:var(--B);font-size:15px;line-height:1.85;color:var(--cream2);opacity:.82;max-width:56ch}
.hf-body strong{color:var(--cream);opacity:1;font-weight:600}
@media(max-width:680px){
  .hf-item{grid-template-columns:1fr;gap:8px;padding-left:26px;padding-bottom:34px}
  .hf-item::before{left:4px;top:12px}
  .hf-item::after{left:0;top:5px}
  .hf-date{text-align:left}
}

/* HISTOIRE — distinctions */
.hist-distinctions{max-width:1180px;margin:72px auto 0;padding-top:8px}
.hist-dist-head{text-align:center;margin-bottom:38px}
.hist-dist-head .section-eyebrow{margin-bottom:10px}
.hist-dist-head h3{font-family:var(--H);font-size:clamp(28px,3.4vw,42px);font-weight:300;font-style:italic;color:var(--cream);letter-spacing:.01em}
.hist-dist-head h3 em{font-style:normal;color:var(--gold)}
/* Colophon asymétrique (03/07) : mention majeure à gauche, marge filetée à droite — plus de cases */
.mentions{display:grid;grid-template-columns:1.12fr 1fr;gap:26px 72px;align-items:start;border-top:1px solid rgba(200,164,74,.28);padding-top:46px}
.mention-tag{font-family:var(--B);font-size:9px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);display:inline-flex;align-items:center;gap:9px}
.mention-tag::before{content:'';width:18px;height:1px;background:var(--gold);opacity:.55;transition:width .45s cubic-bezier(.22,1,.36,1)}
.mention:hover .mention-tag::before{width:34px}
.mention--lead .mention-title{font-family:var(--H);font-size:clamp(29px,3.6vw,46px);font-weight:400;line-height:1.08;color:var(--cream);letter-spacing:-.01em;margin:16px 0 18px}
.mention--lead .mention-title em{font-style:italic;color:var(--gold);background:linear-gradient(rgba(200,164,74,.16),rgba(200,164,74,.16)) no-repeat left 84%/100% 28%}
/* l'encre se peint au défilement (amélioration progressive Chrome) */
@supports(animation-timeline:view()){
  @media(prefers-reduced-motion:no-preference){
    .mention--lead .mention-title em{animation:mhInk linear both;animation-timeline:view();animation-range:entry 20% cover 55%}
  }
}
@keyframes mhInk{from{background-size:0% 28%}to{background-size:100% 28%}}
.mention--lead .mention-body{font-family:var(--B);font-size:14.5px;line-height:1.85;color:var(--cream2);opacity:.78;max-width:48ch}
.mentions-list{display:flex;flex-direction:column}
.mentions-list .mention{padding:20px 0 22px;border-bottom:1px solid rgba(200,164,74,.14);transition:padding-left .4s}
.mentions-list .mention:first-child{padding-top:2px}
.mentions-list .mention:last-child{border-bottom:none}
.mentions-list .mention:hover{padding-left:10px}
.mentions-list .mention-title{font-family:var(--H);font-style:italic;font-size:21px;font-weight:500;color:var(--cream);line-height:1.24;margin:9px 0 6px}
.mentions-list .mention-body{font-family:var(--B);font-size:12.5px;line-height:1.7;color:var(--cream2);opacity:.72;margin:0}
@media(max-width:900px){.mentions{grid-template-columns:1fr;gap:34px;padding-top:34px}}
/* .hdist retiré le 03/07 : les 4 cases « reconnaissances » remplacées par le colophon .mentions */

/* CONTACT */
#contact{padding:100px 48px;background:transparent;content-visibility:auto;contain-intrinsic-size:auto 560px}
.contact-inner{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.contact-info .section-line{margin-bottom:28px}
.contact-info p{font-family:var(--B);font-size:14px;line-height:1.85;color:var(--cream2);opacity:.68;margin-bottom:24px}
.contact-info p strong{color:var(--cream);opacity:1}
.contact-detail{display:flex;flex-direction:column;gap:12px;margin-bottom:32px}
.cdetail{font-family:var(--B);font-size:13px;color:var(--cream2);opacity:.62;display:flex;gap:16px;align-items:flex-start}
.cdetail-label{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);opacity:.65;min-width:64px;padding-top:1px}
.contact-form{display:flex;flex-direction:column;gap:14px}

/* FOOTER */
footer{padding:44px 48px;background:var(--bg);border-top:1px solid rgba(200,164,74,.08)}
.footer-inner{max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px}
.footer-logo{display:flex;align-items:center;opacity:.92}
.footer-logo-mark{width:250px;max-width:62vw;height:auto;display:block}
.footer-text{font-family:var(--B);font-size:11px;color:var(--muted);letter-spacing:.08em;opacity:.7}
/* flex-wrap : sans lui, les 5 liens (478px) débordaient sur mobile → « Rétractation »
   et « Instagram » coupés hors écran, liens légaux inaccessibles (audit 11/07) */
.footer-links{display:flex;gap:14px 24px;flex-wrap:wrap;justify-content:center}
.footer-links a{font-family:var(--B);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);text-decoration:none;opacity:.45;transition:opacity .3s,color .3s}
.footer-links a:hover{opacity:1;color:var(--gold)}

/* PRODUCT MODAL */
#prod-modal{position:fixed;inset:0;z-index:500;display:flex;opacity:0;pointer-events:none;transition:opacity .45s}
#prod-modal.open{opacity:1;pointer-events:all}
.pm-backdrop{position:absolute;inset:0;background:rgba(8,6,1,.85);backdrop-filter:blur(14px)}
.pm-inner{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;width:100%;height:100vh;overflow-y:auto;overflow-x:hidden}
.pm-img{position:sticky;top:0;height:100vh;background-size:cover;background-position:center;overflow:hidden}
/* photo dans un enfant : Ken Burns très lent (la fiche respire), clippé par le conteneur */
.pm-photo{position:absolute;inset:0;background-size:cover;background-position:center;animation:pmKen 26s ease-in-out infinite alternate;will-change:transform}
@keyframes pmKen{from{transform:scale(1)}to{transform:scale(1.07)}}
.pm-img-overlay{position:absolute;inset:0;background:linear-gradient(to right,transparent 55%,rgba(8,6,1,.65))}
/* SANS SCROLL (exigence 04/07) : la fiche tient à l'écran — contenu centré, compact */
/* overflow:hidden coupait ~80px du bas sur écrans courts (réassurance/boutons
   invisibles). overflow-y:auto + justify safe-center : centré quand ça tient,
   défile proprement sinon — plus jamais de contenu coupé (corrigé 11/07). */
.pm-content{position:relative;padding:22px 50px;display:flex;flex-direction:column;justify-content:safe center;gap:1px;background:var(--bg2);overflow:hidden auto;min-height:100%;scrollbar-width:none}
.pm-content::-webkit-scrollbar{display:none}
#prod-modal .pm-content{transform:translateX(30px);opacity:0;transition:transform .65s cubic-bezier(.22,1,.36,1) .08s,opacity .5s ease .08s}
#prod-modal.open .pm-content{transform:none;opacity:1}
@media(prefers-reduced-motion:reduce){.pm-photo{animation:none}#prod-modal .pm-content{transform:none;opacity:1;transition:none}}
/* halo de saveur — deux nappes qui respirent en alternance */
.pm-content::before,.pm-content::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:0}
.pm-content::before{background:radial-gradient(ellipse 80% 60% at 88% 4%,var(--tint,transparent),transparent 68%);animation:tintA 8s ease-in-out infinite alternate}
.pm-content::after{background:radial-gradient(ellipse 70% 65% at 4% 98%,var(--tint2,var(--tint,transparent)),transparent 70%);animation:tintB 8s ease-in-out infinite alternate}
@keyframes tintA{from{opacity:.09}to{opacity:.22}}
@keyframes tintB{from{opacity:.18}to{opacity:.07}}
.pm-content>*{position:relative;z-index:1}
@media (prefers-reduced-motion:reduce){.pm-content::before,.pm-content::after{animation:none;opacity:.13}}
.pm-close{position:absolute;top:24px;right:24px;width:40px;height:40px;background:rgba(200,164,74,.1);border:1px solid rgba(200,164,74,.22);color:var(--gold);font-size:17px;cursor:none;display:flex;align-items:center;justify-content:center;transition:all .3s;z-index:2}
.pm-close:hover{background:var(--gold);color:var(--bg)}
.pm-france{display:inline-flex;align-items:center;gap:11px;margin:0 0 18px;padding:7px 14px 7px 11px;border:1px solid rgba(200,164,74,.3);background:rgba(255,255,255,.025);width:max-content;max-width:100%}
.pm-france svg{width:60px;height:21px;flex-shrink:0;display:block}
.pm-france span{font-family:var(--M);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--cream2);line-height:1.3}

/* ═══ FAVORIS (liste d'envies) ═══ */
.fav-btn{background:rgba(20,14,5,.62);border:1px solid rgba(200,164,74,.35);color:var(--gold);cursor:none;display:flex;align-items:center;justify-content:center;padding:0;transition:background-color .25s,border-color .25s,transform .2s,opacity .3s}
.fav-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7}
.fav-btn:hover{border-color:var(--gold);background:rgba(200,164,74,.14)}
.fav-btn.is-fav svg{fill:var(--gold);stroke:var(--gold)}
.fav-card{position:absolute;top:16px;right:16px;width:34px;height:34px;z-index:4;opacity:0}
.hc:hover .fav-card,.cc:hover .fav-card,.fav-card.is-fav{opacity:1}
@media(hover:none){.fav-card{opacity:1}}
.nav-fav{position:relative}
.nav-fav svg{width:19px;height:19px}
.nav-fav-count{position:absolute;top:-5px;right:-5px;min-width:16px;height:16px;padding:0 4px;background:var(--gold);color:var(--bg);font-family:var(--B);font-size:9px;font-weight:600;display:flex;align-items:center;justify-content:center;border-radius:9px}
.pm-fav{position:absolute;top:24px;right:70px;width:38px;height:38px;z-index:3}
.pm-fav svg{width:19px;height:19px}
#favs-drawer{position:fixed;top:0;right:0;bottom:0;width:380px;max-width:90vw;background:var(--bg2);border-left:1px solid rgba(200,164,74,.12);z-index:400;transform:translateX(100%);transition:transform .45s cubic-bezier(.25,.46,.45,.94);display:flex;flex-direction:column;box-shadow:-30px 0 70px -30px rgba(0,0,0,.7)}
#favs-drawer.open{transform:translateX(0)}
.favs-items{flex:1;overflow-y:auto;padding:8px 20px 24px}
.fav-item{display:flex;gap:14px;padding:16px 0;border-bottom:1px solid rgba(200,164,74,.1)}
.fav-item-img{width:58px;height:74px;flex-shrink:0;background-size:cover;background-position:center;border:1px solid rgba(200,164,74,.18);background-color:var(--bg3)}
.fav-item-body{flex:1;min-width:0}
.fav-item-name{font-family:var(--P);font-size:15px;color:var(--cream);margin-bottom:3px}
.fav-item-price{font-family:var(--B);font-size:13px;color:var(--gold);margin-bottom:9px}
.fav-item-actions{display:flex;gap:7px;flex-wrap:wrap}
.fav-item-actions button{font-family:var(--B);font-size:10px;letter-spacing:.1em;text-transform:uppercase;background:transparent;border:1px solid rgba(200,164,74,.3);color:var(--cream2);padding:6px 12px;cursor:none;transition:border-color .2s,color .2s}
.fav-item-actions button:hover{border-color:var(--gold);color:var(--cream)}
@media(max-width:680px){.pm-fav{top:18px;right:58px;width:34px;height:34px}.fav-card{width:38px;height:38px}}

/* ═══ « Venir à la miellerie » (bande contact bas de page) ═══ */
.venir-band{border-top:1px solid rgba(200,164,74,.18);padding:clamp(40px,6vh,66px) clamp(20px,5vw,56px);background:linear-gradient(to bottom,transparent,rgba(200,164,74,.03))}
.venir-inner{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:auto 1fr auto;gap:clamp(24px,4vw,56px);align-items:center}
.venir-title{font-family:var(--H);font-weight:600;font-size:clamp(28px,3.6vw,44px);line-height:1;color:var(--cream);margin:.12em 0 0}
.venir-facts{display:flex;flex-direction:column;gap:10px}
.venir-fact{font-family:var(--B);font-size:13px;line-height:1.5;color:var(--cream2)}
.venir-k{display:inline-block;min-width:72px;font-family:var(--M);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold2);margin-right:12px}
.venir-actions{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.venir-map,.venir-write{font-family:var(--B);font-size:11px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;padding:12px 22px;border:1px solid rgba(200,164,74,.3);color:var(--cream);transition:border-color .25s,color .25s;cursor:none;white-space:nowrap}
.venir-map:hover,.venir-write:hover{border-color:var(--gold);color:var(--gold2)}
.venir-ig{color:var(--gold);opacity:.8;transition:opacity .25s;cursor:none;display:inline-flex}
.venir-ig svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6}
.venir-ig:hover{opacity:1}
@media(max-width:820px){.venir-inner{grid-template-columns:1fr;gap:20px}.venir-actions{flex-direction:row;flex-wrap:wrap;align-items:center}}
/* Miel « à venir » : pastille au lieu du prix sur la carte */
.hc-price--soon{color:var(--gold2);font-style:italic;opacity:.9}
/* Produit « à venir » (non tarifé) : achat masqué, prix en texte discret */
.pm-soon .pm-qty,.pm-soon .pm-actions .btn-outline{display:none}
.pm-soon .pm-price{font-family:var(--B);font-size:12.5px;font-style:normal;text-transform:none;letter-spacing:0;color:var(--gold2)}
.pm-eyebrow{font-family:var(--M);font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);opacity:.75;margin-bottom:10px}
/* nouvelle typo (04/07) : Playfair droit et gras — le nom du miel s'affirme */
.pm-title{font-family:var(--P);font-size:clamp(27px,3.2vw,40px);font-style:normal;font-weight:600;letter-spacing:-.015em;color:var(--cream);line-height:1.06;margin-bottom:6px}
/* soulignement à l'encre du produit (la couleur change avec chaque miel) */
.pm-title::after{content:'';display:block;width:76px;height:3px;margin-top:10px;background:linear-gradient(90deg,var(--tint,#C8A44A),transparent);transform-origin:left}
#prod-modal.open .pm-title::after{animation:mRule .9s cubic-bezier(.77,0,.18,1) .18s both}
.pm-eyebrow{color:var(--tint,var(--gold));opacity:.9}
.pm-subtitle{font-family:var(--B);font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);margin-bottom:16px}
.pm-desc{font-family:var(--B);font-size:13.5px;line-height:1.7;color:var(--cream2);opacity:.82;margin-bottom:12px;max-width:62ch}
.pm-desc strong{color:var(--cream);opacity:1}
.pm-benefits{margin-bottom:12px}
.pm-benefits-title{font-family:var(--B);font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);opacity:.7;margin-bottom:8px}
/* ARGUMENTS DE VENTE (04/07) : chaque bénéfice = barre en surbrillance colorée + picto
   animé maison. Trois encres distinctes : or miel · vert prairie · cuivre rosé. */
.pmb-c1{--bc:#E2B54B;--bw:rgba(226,181,75,.14)}
.pmb-c2{--bc:#9BB35C;--bw:rgba(155,179,92,.13)}
.pmb-c3{--bc:#CD7F5D;--bw:rgba(205,127,93,.13)}
.pm-benefit{display:flex;gap:13px;align-items:center;font-family:var(--B);font-size:12.5px;line-height:1.48;color:var(--cream);padding:6px 14px 6px 11px;margin:5px 0;background:linear-gradient(90deg,var(--bw),transparent 82%);border-left:2px solid var(--bc)}
.pm-benefit>div{opacity:.88}
.pm-benefit .pmb-ico{width:22px;height:22px;flex-shrink:0;stroke:var(--bc);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 5px var(--bw))}
/* les pictos vivent : la goutte se balance, la fleur tourne, la cuillère goutte */
.pmb-ico--drop{animation:pmbBob 3.8s ease-in-out infinite}
@keyframes pmbBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-2.5px)}}
.pmb-ico--drop .shine{opacity:.65}
.pmb-ico--flower .petals{transform-box:view-box;transform-origin:50% 50%;animation:pmbSpin 15s linear infinite}
@keyframes pmbSpin{to{transform:rotate(360deg)}}
.pmb-ico--dipper .drip{animation:pmbDrip 3s ease-in infinite}
@keyframes pmbDrip{0%,52%{transform:translateY(0);opacity:1}78%{transform:translateY(4.5px);opacity:0}80%{transform:translateY(-1px);opacity:0}100%{transform:translateY(0);opacity:1}}
/* entrée en cascade à l'ouverture (le 1er enfant est le titre) */
#prod-modal.open .pm-benefits>div:nth-child(2){animation:mRise .6s cubic-bezier(.22,1,.36,1) .15s backwards}
#prod-modal.open .pm-benefits>div:nth-child(3){animation:mRise .6s cubic-bezier(.22,1,.36,1) .27s backwards}
#prod-modal.open .pm-benefits>div:nth-child(4){animation:mRise .6s cubic-bezier(.22,1,.36,1) .39s backwards}
@media(prefers-reduced-motion:reduce){
  .pmb-ico--drop,.pmb-ico--flower .petals,.pmb-ico--dipper .drip{animation:none}
  #prod-modal.open .pm-benefits>div{animation:none}
}
/* v2 04/07 : la boîte devient une fiche à points de conduite (clé …… valeur),
   même langage de registre que le reste du site */
/* « En détail » refait (11/07) : les fuites en pointillés + le réordonnancement
   flex cassaient l'affichage dès qu'une valeur passait à la ligne. Ici : paires
   empilées (intitulé fin au-dessus, valeur lisible en dessous), robustes au retour
   ligne, dans une grille 2 colonnes propre. */
.pm-attrs{display:grid;grid-template-columns:1fr 1fr;gap:13px 28px;margin-bottom:14px;padding-top:14px;border-top:1px solid rgba(200,164,74,.2)}
.pm-attrs-title{grid-column:1/-1;font-family:var(--M);font-size:9.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);opacity:.85;margin-bottom:1px}
.pm-attr{display:flex;flex-direction:column;gap:3px;min-width:0}
.pm-attr-key{font-family:var(--M);font-size:8.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--muted)}
.pm-attr-val{font-family:var(--B);font-size:13px;line-height:1.34;color:var(--cream);opacity:.94}
.pm-craft{display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:13px}
.pm-craft span{font-family:var(--M);font-size:10px;letter-spacing:.04em;color:var(--muted);display:flex;align-items:center;gap:7px}
.pm-craft span::before{content:'';width:4px;height:4px;background:var(--gold);opacity:.55;transform:rotate(45deg);flex-shrink:0}
.pm-price-row{display:flex;align-items:center;gap:22px;margin-bottom:14px}
.pm-price{font-family:var(--H);font-size:29px;font-style:italic;color:var(--gold);display:flex;flex-direction:column;line-height:1.05}
.pm-price-tot{font-size:29px}
.pm-price-unit{font-family:var(--B);font-style:normal;font-size:11px;letter-spacing:.02em;color:var(--muted);margin-top:3px}
.pm-qty{display:flex;align-items:center}
.pm-qty button{width:34px;height:34px;background:rgba(200,164,74,.08);border:1px solid rgba(200,164,74,.22);color:var(--gold);font-size:16px;cursor:none;transition:all .2s}
.pm-qty button:hover{background:var(--gold);color:var(--bg)}
.pm-qty span{width:40px;text-align:center;font-family:var(--H);font-size:16px;color:var(--cream);border-top:1px solid rgba(200,164,74,.22);border-bottom:1px solid rgba(200,164,74,.22);height:34px;line-height:34px}
.pm-actions{display:flex;gap:10px}
.pm-actions .btn-gold,.pm-actions .btn-outline{flex:1;text-align:center;padding:14px 18px;white-space:nowrap}

/* CART */
#cart{position:fixed;top:0;right:0;bottom:0;width:380px;background:var(--bg2);border-left:1px solid rgba(200,164,74,.12);z-index:400;transform:translateX(100%);transition:transform .45s cubic-bezier(.25,.46,.45,.94);display:flex;flex-direction:column}
#cart.open{transform:translateX(0)}
.cart-header{padding:26px 26px 18px;border-bottom:1px solid rgba(200,164,74,.1);display:flex;justify-content:space-between;align-items:center}
.cart-title{font-family:var(--P);font-size:22px;font-style:italic;color:var(--cream)}
.cart-close{background:none;border:none;color:var(--muted);font-size:20px;cursor:none;transition:color .2s}
.cart-close:hover{color:var(--gold)}
.cart-items{flex:1;overflow-y:auto;padding:18px 26px}
.cart-item{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid rgba(200,164,74,.07);align-items:center}
.cart-item-img{width:52px;height:52px;background:var(--bg3);background-size:cover;background-position:center;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,0 100%);flex-shrink:0}
.cart-item-info{flex:1}
.cart-item-name{font-family:var(--H);font-size:15px;font-style:italic;color:var(--cream);margin-bottom:3px}
.cart-item-price{font-family:var(--B);font-size:12px;color:var(--gold)}
.cart-item-remove{background:none;border:none;color:var(--muted);cursor:none;font-size:13px;transition:color .2s;padding:4px}
.cart-item-remove:hover{color:var(--gold)}
.cart-footer{padding:22px 26px;border-top:1px solid rgba(200,164,74,.1)}
.cart-total{display:flex;justify-content:space-between;font-family:var(--H);font-size:21px;color:var(--cream);margin-bottom:18px}
.cart-total span{color:var(--gold)}
.cart-empty{text-align:center;padding:56px 20px;font-family:var(--H);font-style:italic;color:var(--muted);font-size:17px;opacity:.55}

/* CHECKOUT */
#checkout-modal{position:fixed;inset:0;z-index:600;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .4s}
#checkout-modal.open{opacity:1;pointer-events:all}
.chk-backdrop{position:absolute;inset:0;background:rgba(8,6,1,.88);backdrop-filter:blur(16px)}
.chk-inner{position:relative;z-index:1;width:min(660px,90vw);background:var(--bg2);border:1px solid rgba(200,164,74,.18);clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%);box-shadow:0 24px 80px rgba(0,0,0,.6),0 0 60px rgba(200,164,74,.06)}
.chk-header{padding:38px 46px 26px;border-bottom:1px solid rgba(200,164,74,.1);display:flex;justify-content:space-between;align-items:flex-start}
.chk-title{font-family:var(--H);font-size:30px;font-style:italic;font-weight:300;color:var(--cream)}
.chk-subtitle{font-family:var(--B);font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.chk-close{background:none;border:none;color:var(--muted);font-size:18px;cursor:none;padding:4px}
.chk-body{padding:30px 46px}
.chk-order-items{margin-bottom:22px}
.chk-item{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid rgba(200,164,74,.07);font-family:var(--B);font-size:13px}
.chk-item-name{color:var(--cream2)}
.chk-item-price{color:var(--gold)}
.chk-total{display:flex;justify-content:space-between;padding:14px 0;font-family:var(--H);font-size:21px;color:var(--cream);margin-bottom:26px}
.chk-total span{color:var(--gold);font-style:italic}
.chk-info{background:rgba(200,164,74,.04);border:1px solid rgba(200,164,74,.1);padding:14px 18px;margin-bottom:26px}
.chk-info p{font-family:var(--B);font-size:12px;color:var(--cream2);opacity:.68;line-height:1.72}
.chk-info strong{color:var(--gold);opacity:1}
.chk-actions{display:flex;gap:12px}
.chk-actions .btn-gold{flex:1;text-align:center}

/* COMPTE CLIENT — relié à Shopify */
#account-modal{position:fixed;inset:0;z-index:600;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .4s}
#account-modal.open{opacity:1;pointer-events:all}
.acc-backdrop{position:absolute;inset:0;background:rgba(8,6,1,.88);backdrop-filter:blur(16px)}
.acc-inner{position:relative;z-index:1;width:min(440px,92vw);max-height:92vh;display:flex;flex-direction:column;overflow:hidden;background:var(--bg2);border:1px solid rgba(200,164,74,.18);clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%);box-shadow:0 24px 80px rgba(0,0,0,.6),0 0 60px rgba(200,164,74,.06)}
.acc-head{padding:34px 40px 18px;text-align:center;position:relative;flex-shrink:0}
.acc-emblem{width:46px;height:46px;margin:0 auto 16px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(200,164,74,.3);border-radius:50%}
.acc-emblem svg{width:22px;height:22px;stroke:var(--gold);fill:none;stroke-width:1.5}
.acc-title{font-family:var(--H);font-size:30px;font-style:italic;font-weight:300;color:var(--cream);line-height:1.1}
.acc-sub{font-family:var(--B);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-top:7px}
.acc-close{position:absolute;top:18px;right:20px;z-index:6;width:34px;height:34px;background:none;border:none;color:var(--muted);font-size:18px;cursor:none;padding:4px;transition:color .2s}
.acc-close:hover{color:var(--gold)}
.acc-tabs{display:flex;margin:8px 40px 0;border:1px solid rgba(200,164,74,.18);flex-shrink:0}
.acc-tab{flex:1;background:transparent;border:none;color:var(--cream2);font-family:var(--B);font-size:11px;letter-spacing:.16em;text-transform:uppercase;padding:12px;cursor:none;transition:all .3s;opacity:.55}
.acc-tab.active{background:var(--gold);color:var(--bg);opacity:1}
.acc-body{padding:24px 40px 36px;overflow-y:auto;min-height:0;flex:1 1 auto;scrollbar-width:none;-ms-overflow-style:none}
.acc-body::-webkit-scrollbar{width:0;height:0;display:none}
.acc-form{display:none;flex-direction:column;gap:13px}
.acc-form.active{display:flex}
.acc-field label{font-family:var(--B);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:5px;display:block}
.acc-field label .req{color:var(--gold);opacity:.7}
.acc-field input{width:100%;background:rgba(255,255,255,.035);border:1px solid rgba(200,164,74,.18);color:var(--cream);font-family:var(--B);font-size:13px;padding:13px 16px;outline:none;transition:border-color .3s;-webkit-appearance:none}
.acc-field input:focus{border-color:rgba(200,164,74,.55)}
.acc-field input:invalid:not(:placeholder-shown){border-color:rgba(190,90,70,.5)}
.acc-news{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;background:rgba(200,164,74,.05);border:1px solid rgba(200,164,74,.16);border-radius:4px;cursor:none}
.acc-news input{appearance:none;-webkit-appearance:none;width:20px;height:20px;flex-shrink:0;border:1px solid rgba(200,164,74,.4);background:transparent;cursor:none;position:relative;margin-top:1px;transition:background-color .2s,border-color .2s}
.acc-news input:checked{background:var(--gold);border-color:var(--gold)}
.acc-news input:checked::after{content:'';position:absolute;left:6px;top:2px;width:6px;height:11px;border:solid var(--bg);border-width:0 2px 2px 0;transform:rotate(45deg)}
.acc-news-text{font-family:var(--B);font-size:12px;line-height:1.5;color:var(--cream2);opacity:.8}
.acc-news-text strong{color:var(--cream);opacity:1;font-weight:500}
.acc-foot{font-family:var(--B);font-size:11px;color:var(--muted);text-align:center;margin-top:6px;line-height:1.6}
.acc-foot a{color:var(--gold);text-decoration:none;cursor:none}
.acc-foot a:hover{text-decoration:underline}
.acc-secure{display:flex;align-items:center;justify-content:center;gap:8px;font-family:var(--B);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);opacity:.7;margin-top:18px}
.acc-secure svg{width:13px;height:13px;stroke:var(--gold);fill:none;stroke-width:1.6}
/* honeypot anti-bot : hors écran (pas display:none, que certains bots ignorent) */
.hp{position:absolute!important;left:-9999px!important;top:auto;width:1px;height:1px;overflow:hidden}

/* REVEALS */
.r{opacity:0;transform:translateY(32px)}
.rl{opacity:0;transform:translateX(-32px)}
.rr{opacity:0;transform:translateX(32px)}
/* A11y : en mouvement réduit, le bloc JS qui révèle .r/.rl/.rr est court-circuité
   (initAnimations → if(hasGsap && !reduce)). Sans cette règle, leur opacity:0 CSS
   resterait → contenu invisible à jamais. On livre donc l'état final visible en CSS,
   indépendamment de GSAP/JS (résiste même si le script échoue ou ne charge pas). */
@media(prefers-reduced-motion:reduce){
  .r,.rl,.rr,.sk,.hdist{opacity:1!important;transform:none!important}
}

@media(max-width:1024px){
  .creations-grid{grid-template-columns:1fr 1fr}
  .pane.active{grid-template-columns:1fr}
  .contact-inner{grid-template-columns:1fr}
  .savoir-intro{grid-template-columns:1fr;gap:32px}
  .savoir-portrait{max-width:380px;margin:0 auto;width:100%}
  .hist-intro{grid-template-columns:1fr;gap:34px}
  .hist-portrait{max-width:360px;margin:0 auto;width:100%}
  nav{padding:18px 24px}
  nav.scrolled{padding:14px 24px}
  #miels,#creations,#precommandes,#savoir,#contact{padding:72px 24px}
  .trust-strip{padding:32px 24px}
  .trust-inner{grid-template-columns:1fr 1fr;gap:22px}
  #histoire{padding:88px 24px}
}
/* Accordéon miels → pile verticale dès que le survol n'est plus pertinent */
@media(max-width:860px){
  .miels-strip{flex-direction:column;height:auto;gap:10px}
  .hc{flex:0 0 auto;height:300px}
  .hc:hover{flex:0 0 auto;transform:translateY(-4px)}
  .hc-spine{display:none}
  .hc-content{opacity:1;transform:none;position:absolute;left:0;right:0;width:auto;max-width:100%}
  .hc-add{opacity:1}
}
@media(max-width:640px){
  .creations-grid{grid-template-columns:1fr}
  .pm-inner{grid-template-columns:1fr}
  .pm-img{display:none}
  .pm-attrs{grid-template-columns:1fr}
  .chapter{grid-template-columns:72px 1fr}
  .nav-links{display:none}
  .trust-inner{grid-template-columns:1fr}
  .av{width:280px}
  #avis{padding:72px 0}
}

/* FOND VIVANT — une seule couche continue derrière TOUTES les sections (devenues
   transparentes) : plus aucune coupure entre les parties. Des foyers de lumière
   chaude (miel) dérivent et respirent très lentement = matière + vie, sans slop.
   100 % transform/opacity (GPU), gelé en reduced-motion. */
#bg-motion{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:var(--bg);transform:translateZ(0)}
/* Pas de will-change ici : 3 calques GPU de ~60vw promus en permanence = lourd en
   mémoire pour une dérive très lente (36-54s) où le jank serait invisible. */
.bg-blob{position:absolute;border-radius:50%}
.bg-blob.b1{width:65vw;height:65vw;left:-12vw;top:-8vh;background:radial-gradient(circle,rgba(206,156,68,.2),rgba(160,110,40,.06) 45%,transparent 66%);animation:drift1 36s ease-in-out infinite alternate}
.bg-blob.b2{width:58vw;height:58vw;right:-14vw;top:38vh;background:radial-gradient(circle,rgba(150,100,44,.18),rgba(120,80,30,.05) 48%,transparent 68%);animation:drift2 46s ease-in-out infinite alternate}
.bg-blob.b3{width:50vw;height:50vw;left:28vw;bottom:-12vh;background:radial-gradient(circle,rgba(232,200,120,.13),transparent 66%);animation:drift3 54s ease-in-out infinite alternate}
@keyframes drift1{from{transform:translate(0,0) scale(1)}to{transform:translate(9vw,7vh) scale(1.18)}}
@keyframes drift2{from{transform:translate(0,0) scale(1.12)}to{transform:translate(-8vw,-6vh) scale(1)}}
@keyframes drift3{from{transform:translate(0,0) scale(1)}to{transform:translate(6vw,-8vh) scale(1.22)}}
@media(prefers-reduced-motion:reduce){.bg-blob{animation:none}}

/* MENTION RGPD sous les formulaires */
.form-consent{font-family:var(--B);font-size:11px;line-height:1.55;color:var(--muted);margin-top:4px}
.form-consent a{color:var(--gold);text-decoration:none}
.form-consent a:hover{text-decoration:underline}

/* RECHERCHE — overlay de recherche produits */
#search-modal{position:fixed;inset:0;z-index:450;display:none;align-items:flex-start;justify-content:center;padding:14vh 24px 24px}
#search-modal.open{display:flex}
.search-backdrop{position:absolute;inset:0;background:rgba(8,6,1,.88);backdrop-filter:blur(14px)}
.search-inner{position:relative;z-index:1;width:min(620px,94vw)}
.search-box{display:flex;align-items:center;gap:14px;background:var(--bg2);border:1px solid rgba(200,164,74,.3);padding:14px 22px;border-radius:999px;box-shadow:0 24px 80px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,225,150,.06)}
.search-box:focus-within{border-color:rgba(200,164,74,.55);box-shadow:0 24px 80px rgba(0,0,0,.55),0 0 0 4px rgba(200,164,74,.08),inset 0 1px 0 rgba(255,225,150,.08)}
.search-box>svg{width:20px;height:20px;stroke:var(--gold);fill:none;stroke-width:1.7;stroke-linecap:round;flex-shrink:0}
.search-box input{flex:1;background:none;border:none;outline:none;color:var(--cream);font-family:var(--B);font-size:16px}
.search-box input::placeholder{color:var(--muted)}
.search-close{background:none;border:1px solid rgba(200,164,74,.18);color:var(--muted);font-size:14px;cursor:none;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:color .2s,border-color .2s,background .2s}
.search-close:hover{color:var(--gold);border-color:rgba(200,164,74,.5);background:rgba(200,164,74,.08)}
.search-results{margin-top:14px;background:var(--bg2);border:1px solid rgba(200,164,74,.14);border-radius:18px;max-height:52vh;overflow:hidden;overflow-y:auto;padding:6px;box-shadow:0 24px 80px rgba(0,0,0,.45)}
.search-res{display:flex;align-items:center;gap:14px;padding:11px 14px;cursor:none;border-radius:12px;transition:background-color .2s}
.search-res:hover{background:rgba(200,164,74,.09)}
.search-res-img{width:48px;height:48px;background:var(--bg3) center/cover no-repeat;flex-shrink:0;border-radius:50%;border:1px solid rgba(200,164,74,.18)}
.search-res-t{font-family:var(--H);font-style:italic;font-size:16px;color:var(--cream);line-height:1.2}
.search-res-s{font-family:var(--B);font-size:11px;color:var(--muted);margin-top:2px}
.search-empty{padding:22px 20px;font-family:var(--B);font-size:13px;color:var(--muted);text-align:center}
/* barre de recherche dans la nav + filtres par catégorie */
.nav-search-pill{display:flex;align-items:center;gap:10px;background:rgba(20,14,6,.5);border:1px solid rgba(200,164,74,.28);border-radius:40px;padding:9px 16px;cursor:none;transition:border-color .3s,background .3s;font-family:var(--B);font-size:12px}
.nav-search-pill:hover{border-color:rgba(200,164,74,.55);background:rgba(20,14,6,.72)}
.nav-search-pill svg{width:16px;height:16px;stroke:var(--gold);fill:none;stroke-width:1.8;stroke-linecap:round;flex-shrink:0}
.nav-search-pill span{color:var(--muted);white-space:nowrap}
@media(max-width:880px){.nav-search-pill span{display:none}.nav-search-pill{padding:9px 11px}}
.search-cats{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.scat{font-family:var(--M);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--cream2);background:rgba(200,164,74,.05);border:1px solid rgba(200,164,74,.22);border-radius:40px;padding:8px 16px;cursor:none;transition:background .25s,border-color .25s,color .25s}
.scat:hover{border-color:rgba(200,164,74,.5);color:var(--gold)}
.scat.active{background:var(--gold);border-color:var(--gold);color:var(--bg);font-weight:600}

/* BANDEAU COOKIES (CNIL : refus aussi simple que l'acceptation) */
#cookie-banner{position:fixed;left:0;right:0;bottom:0;z-index:700;background:rgba(8,6,1,.96);backdrop-filter:blur(12px);border-top:1px solid rgba(200,164,74,.2);transform:translateY(110%);transition:transform .5s cubic-bezier(.33,1,.68,1)}
#cookie-banner.show{transform:translateY(0)}
.cookie-inner{max-width:1200px;margin:0 auto;padding:18px 32px;display:flex;align-items:center;gap:24px;flex-wrap:wrap;justify-content:space-between}
.cookie-text{font-family:var(--B);font-size:12.5px;line-height:1.6;color:var(--cream2);opacity:.82;max-width:680px;flex:1 1 360px}
.cookie-text a{color:var(--gold);text-decoration:none}
.cookie-text a:hover{text-decoration:underline}
.cookie-actions{display:flex;gap:12px;flex-shrink:0}
.cookie-btn{font-family:var(--B);font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:12px 26px;cursor:none;border:1px solid rgba(200,164,74,.4);transition:background-color .3s,color .3s}
.cookie-btn.refuse{background:transparent;color:var(--cream2)}
.cookie-btn.refuse:hover{border-color:var(--gold);color:var(--gold)}
.cookie-btn.accept{background:var(--gold);color:var(--bg);border-color:var(--gold)}
.cookie-btn.accept:hover{background:var(--gold2)}
@media(max-width:640px){.cookie-actions{width:100%}.cookie-btn{flex:1;text-align:center}}

/* ════════════════ PACKS MOTION · INTERACTION · TYPO ════════════════
   Signatures distillées d'Aceternity (card-spotlight, hover-border-gradient),
   Aliimam/Cult (magnétique), ReactBits (type cinétique), Uiverse (shine),
   Shadergradient (ambiance mesh) — recodées maison, GSAP/CSS, sobres & dorées.
   Coupées en reduced-motion et sur pointeur grossier. */

/* A · curseur abeille réactif au survol d'un élément cliquable */
#bee.bee-hot svg{filter:drop-shadow(0 0 9px rgba(232,204,122,.6))}

/* A · SPOTLIGHT — halo doré qui suit le curseur dans les cartes */
.spot{position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;opacity:0;
  transition:opacity .5s ease;mix-blend-mode:screen;
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(232,204,122,.18),transparent 62%)}
.hc:hover .spot,.cc:hover .spot,.fan-card:hover .spot{opacity:1}
/* contenu au-dessus du spotlight (qui s'insère en z-index 2) */
.hc-content,.cc-content{z-index:4}
.fan-card-top,.fan-card-title,.fan-card-body{position:relative;z-index:3}

/* C · TILT 3D — cartes Créations (perspective sur la grille, rotation au curseur) */
.creations-grid{perspective:1100px}
.cc{will-change:transform}

/* D · BORDURE OR animée au survol (hover-border-gradient) — cartes Créations */
@property --ba{syntax:'<angle>';inherits:false;initial-value:0deg}
.cc::before{content:'';position:absolute;inset:0;z-index:2;border-radius:inherit;padding:1px;pointer-events:none;
  opacity:0;transition:opacity .45s;
  background:conic-gradient(from var(--ba),transparent 0deg,var(--gold4) 55deg,var(--gold) 120deg,transparent 210deg,transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;animation:baSpin 3.4s linear infinite;animation-play-state:paused}
.cc:hover::before{opacity:1;animation-play-state:running}
@keyframes baSpin{to{--ba:360deg}}

/* D · SHINE — éclat doré qui balaie les boutons au survol (luxe sobre) */
.shine{position:relative;overflow:hidden}
.shine::before{content:'';position:absolute;top:-20%;left:-160%;width:55%;height:140%;z-index:1;pointer-events:none;
  transform:skewX(-18deg);transition:left .65s cubic-bezier(.4,0,.2,1);
  background:linear-gradient(100deg,transparent,rgba(245,228,160,.5),transparent)}
.shine:hover::before{left:170%}

/* C · AMBIANCE mesh ambré derrière Créations (vibe Shadergradient, CSS pur, GPU) */
#creations{position:relative;isolation:isolate}
.crea-atmo{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;opacity:.6}
.crea-atmo::before,.crea-atmo::after{content:'';position:absolute;width:62vw;height:62vw;border-radius:50%;filter:blur(72px)}
.crea-atmo::before{top:-12%;left:-6%;background:radial-gradient(circle,rgba(200,164,74,.13),transparent 64%);animation:meshA 19s ease-in-out infinite alternate}
.crea-atmo::after{bottom:-16%;right:-9%;background:radial-gradient(circle,rgba(139,106,26,.16),transparent 64%);animation:meshB 23s ease-in-out infinite alternate}
@keyframes meshA{to{transform:translate(7vw,5vh) scale(1.18)}}
@keyframes meshB{to{transform:translate(-6vw,-5vh) scale(1.14)}}

/* B · TITRE HERO cinétique — lettre par lettre. CSS pur = joue au 1er rendu,
   immunisé au gel rAF (le repos n'est jamais invisible). */
.hero-headline.kinetic{animation:none}
.hletter{display:inline-block;animation:heroLetter .85s cubic-bezier(.2,.7,.2,1) both}
@keyframes heroLetter{from{opacity:0;transform:translateY(.42em) rotate(2.5deg)}to{opacity:1;transform:none}}

@media(prefers-reduced-motion:reduce){
  .spot,.cc::before,.shine::before{display:none}
  .crea-atmo::before,.crea-atmo::after{animation:none}
  .hletter{animation:none}
}
@media (hover:none),(pointer:coarse){.spot,.cc::before{display:none}}

/* ════════════ AUDIT CRO — affordances d'achat, panier, réassurance ════════════ */
/* ajout rapide au panier sur les cartes Créations (parité avec les miels) */
.cc-add{position:absolute;top:14px;right:14px;width:38px;height:38px;z-index:5;background:rgba(40,28,10,.66);border:1px solid rgba(200,164,74,.34);color:var(--gold);font-size:19px;cursor:none;display:flex;align-items:center;justify-content:center;border-radius:3px;opacity:0;transition:opacity .3s,background .25s,color .25s}
.cc:hover .cc-add,.cc-add:focus-visible{opacity:1}
.cc-add:hover{background:var(--gold);color:var(--bg)}
/* réassurance sous le CTA d'achat — faits réels du site, aucune promesse inventée */
.pm-reassure{display:flex;flex-wrap:wrap;gap:7px 18px;margin-top:10px}
.pm-reassure span{display:inline-flex;align-items:center;gap:7px;font-family:var(--B);font-size:11px;letter-spacing:.02em;color:var(--cream2);opacity:.74}
.pm-reassure svg{width:14px;height:14px;stroke:var(--gold);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
/* stepper de quantité dans le panier (avant : suppression seule) */
.cart-qty{display:inline-flex;align-items:center;margin-top:7px}
.cart-qty button{width:26px;height:26px;background:rgba(200,164,74,.08);border:1px solid rgba(200,164,74,.22);color:var(--gold);font-size:14px;cursor:none;line-height:1;transition:background .2s,color .2s}
.cart-qty button:hover{background:var(--gold);color:var(--bg)}
.cart-qty span{min-width:32px;text-align:center;font-family:var(--B);font-size:12px;color:var(--cream);border-top:1px solid rgba(200,164,74,.22);border-bottom:1px solid rgba(200,164,74,.22);height:26px;line-height:26px}
/* rappel livraison dans le panier (frais/délais calculés au paiement Shopify) */
.cart-ship{padding:16px 26px 2px}
.cart-ship-msg{display:flex;align-items:center;gap:9px;font-family:var(--B);font-size:12px;color:var(--cream2);letter-spacing:.01em}
.cart-ship-msg svg{width:18px;height:18px;stroke:var(--gold);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.cart-ship-msg strong{color:var(--gold);font-weight:600}
/* cibles tactiles ≥44px sur pointeur grossier (miels/créations toujours visibles) */
@media (hover:none),(pointer:coarse){
  .hc-add,.cc-add{width:44px;height:44px;opacity:1}
  .cart-sugg-add{width:44px;height:44px}
  .pm-qty button{width:44px;height:44px}.pm-qty span{height:44px;line-height:44px}
  .cart-qty button{width:38px;height:38px}.cart-qty span{height:38px;line-height:38px}
}


/* ============ AJOUTS MULTI-PAGES (27/06) ============ */

/* espace sous la nav fixe (pages internes) + onglet actif */
.page-top{height:74px}
@media(max-width:880px){.page-top{height:60px}}
.nav-links a.active{color:var(--gold);opacity:1}
.nav-links a.active::after{content:"";display:block;height:1px;background:var(--gold);margin-top:5px;opacity:.7}

/* === 3 CARRÉS (accueil) === */
#univers{padding:86px 48px 74px;max-width:1540px;margin:0 auto}
.univers-head{text-align:center;margin-bottom:44px;display:flex;flex-direction:column;align-items:center}
.univers-head .section-eyebrow::before{display:none}
.univers-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
/* Produits = bandeau large 16:9 (la photo des pots rentre en entier, sans rognage) */
/* .uni.uni--wide (2 classes) : sinon le min-height de .uni, déclaré PLUS BAS,
   écrase le min-height:0 → l'aspect-ratio 2.1/1 le convertit en largeur mini
   ~1070px → 175px de scroll horizontal vers ~950px de fenêtre (audit 11/07) */
.uni.uni--wide{grid-column:1 / -1;min-height:0;aspect-ratio:2.1/1}
.uni--wide .uni-bg{background-position:center}
/* voile plus discret sur le bandeau pour laisser respirer la photo, dégradé coin bas-gauche pour le texte */
.uni--wide .uni-veil{background:linear-gradient(to top,rgba(8,6,1,.82),rgba(8,6,1,.28) 42%,transparent 68%),linear-gradient(to right,rgba(8,6,1,.6),transparent 46%)}
@media(max-width:900px){#univers{padding:58px 22px 50px}.univers-grid{grid-template-columns:1fr}}
.uni{position:relative;display:block;text-decoration:none;overflow:hidden;border-radius:6px;border:1px solid rgba(200,164,74,.18);background:var(--bg3);min-height:clamp(440px,54vh,580px);box-shadow:0 22px 44px -20px rgba(0,0,0,.6),inset 0 1px 0 rgba(200,164,74,.1);transition:border-color .45s,transform .5s cubic-bezier(.33,1,.68,1)}
.uni::after{content:'';position:absolute;inset:10px;border:1px solid rgba(200,164,74,.18);border-radius:3px;pointer-events:none;z-index:3;transition:border-color .45s}
.uni:hover{transform:translateY(-8px);border-color:rgba(200,164,74,.42)}
.uni:hover::after{border-color:rgba(200,164,74,.5)}
.uni:focus-visible{outline:2px solid var(--gold2);outline-offset:3px}
.uni-bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:translateZ(0);transition:transform .7s cubic-bezier(.33,1,.68,1)}
.uni-bg.ph{background-image:var(--ph)}
.uni:hover .uni-bg{transform:scale(1.06)}
.uni-veil{position:absolute;inset:0;background:linear-gradient(to top,rgba(8,6,1,.93),rgba(8,6,1,.5) 56%,rgba(8,6,1,.26));transition:opacity .5s}
.uni:hover .uni-veil{opacity:.84}
.uni-num{position:absolute;top:26px;left:30px;z-index:4;font-family:var(--M);font-size:12px;letter-spacing:.3em;color:var(--gold);opacity:.85}
.uni-in{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;padding:36px 32px}
.uni-eyebrow{font-family:var(--M);font-size:12px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold2);margin-bottom:10px}
.uni-title{font-family:var(--H);font-size:clamp(34px,3.4vw,50px);font-weight:300;font-style:italic;color:var(--cream);line-height:1;margin-bottom:13px}
.uni-desc{font-family:var(--B);font-size:14px;line-height:1.6;color:var(--cream2);opacity:.82;max-width:300px;margin-bottom:22px}
.uni-go{font-family:var(--B);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--cream);display:inline-flex;align-items:center;gap:10px;padding-bottom:6px;border-bottom:1px solid var(--gold);align-self:flex-start;transition:gap .3s,color .3s}
.uni-go .arr{color:var(--gold);transition:transform .3s}
.uni:hover .uni-go{color:var(--gold2)}
.uni:hover .uni-go .arr{transform:translateX(6px)}

/* === SERVICES (parrainage / stages / école) === */
.srv{padding:84px 48px;max-width:1280px;margin:0 auto}
.srv + .srv{padding-top:22px}
.srv-head{text-align:center;max-width:760px;margin:0 auto 40px;display:flex;flex-direction:column;align-items:center}
.srv-head .section-eyebrow::before{display:none}
.srv-head .section-line{margin:16px auto 0}
.srv-lead{font-family:var(--B);font-size:15px;line-height:1.8;color:var(--cream2);opacity:.84;margin-top:18px}
.srv-lead strong{color:var(--cream);opacity:1;font-weight:500}
.srv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:28px}
.srv-grid .sk-title em{font-style:italic;color:var(--gold2)}
.srv-cta{text-align:center}
.srv-partner{display:inline-flex;align-items:center;gap:10px;font-family:var(--B);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold2);border:1px solid rgba(200,164,74,.32);border-radius:40px;padding:9px 18px;margin-top:22px}
.srv-partner svg{width:15px;height:15px;stroke:var(--gold2);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.srv-note{max-width:680px;margin:22px auto 0;text-align:center;font-family:var(--M);font-size:11px;line-height:1.6;letter-spacing:.02em;color:var(--muted)}
@media(max-width:860px){.srv{padding:58px 22px}.srv-grid{grid-template-columns:1fr}}

/* ═══════════════════════════════════════════════════════════════
   PARRAINAGE — Direction A « Registre d'atelier »
   Typo mixte (serif personnalité + mono atelier), insignes-sceaux,
   numéros gravés hors-texte, mur partenaires = registre à logos.
═══════════════════════════════════════════════════════════════ */
#parrainage.parrain-section{padding:0;max-width:none;margin:0}
.pv{opacity:0;transform:translateY(26px);transition:opacity .75s ease,transform .75s ease}
.pv.pv-in{opacity:1;transform:none}

/* libellé « atelier » réutilisable : mono + tiret de filet */
.p-tag{font-family:var(--M);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);opacity:.62;display:inline-flex;align-items:center;gap:12px}
.p-tag::before{content:'';width:26px;height:1px;background:var(--gold);opacity:.55}

/* — INSIGNE / SCEAU hexagonal (langage unifiant, gravure dorée) — */
.seal{display:block;flex-shrink:0}
.seal .ring{fill:none;stroke:var(--gold);stroke-width:1;opacity:.4}
.seal .ring2{fill:none;stroke:var(--gold);stroke-width:1;opacity:.16}
.seal .g{fill:none;stroke:var(--gold);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.seal .gf{fill:var(--gold);stroke:none}

/* 1 · IMPACT HEADER */
.parrain-impact{padding:96px 48px 60px;max-width:1280px;margin:0 auto}
.parrain-eyebrow{font-family:var(--M);font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);opacity:.62;margin-bottom:46px;display:flex;align-items:center;gap:12px}
.parrain-eyebrow::before{content:'';width:30px;height:1px;background:var(--gold);opacity:.55}
.parrain-impact-row{display:grid;grid-template-columns:1fr 320px;gap:80px;align-items:end}
.parrain-main-title{font-family:var(--H);font-size:clamp(40px,6.4vw,74px);font-weight:400;color:var(--cream);line-height:1.02;letter-spacing:-.02em;margin-bottom:26px}
.parrain-main-title em{color:var(--gold);font-style:italic}
.parrain-pitch-lead{font-family:var(--B);font-size:15px;line-height:1.85;color:var(--cream);opacity:.74;max-width:54ch}
.parrain-pitch-lead strong{opacity:1;font-weight:500;color:var(--cream)}
.parrain-stats{display:flex;flex-direction:column;border-top:1px solid rgba(200,164,74,.3)}
.parrain-stat-item{padding:18px 0;border-bottom:1px solid rgba(200,164,74,.1);display:flex;align-items:baseline;gap:16px}
.parrain-stat-item:last-child{border-bottom:none}
.parrain-stat-n{font-family:var(--H);font-size:clamp(40px,5vw,56px);font-weight:600;color:var(--gold);line-height:.85;letter-spacing:-.03em;min-width:1.6em}
.parrain-stat-l{font-family:var(--M);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--cream);opacity:.5;line-height:1.4}

/* 2 · BIODIVERSITÉ — articles : numéro gravé qui déborde + insigne */
/* .parrain-why-* retiré le 02/07 : bloc « Pourquoi » fusionné dans .parrain-del-grid--4 (élagage) */

/* Visuels placeholder Higgsfield */
.parrain-visual{width:100%;aspect-ratio:21/8;background:rgba(200,164,74,.03);border-top:1px dashed rgba(200,164,74,.2);border-bottom:1px dashed rgba(200,164,74,.2);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.parrain-visual::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(200,164,74,.06) 0%,transparent 55%)}
/* .parrain-visual-hint / --mid retirés (audit 02/07) : placeholder « visuel à générer » supprimé */
/* Visuel RÉEL (photo) — bandeau cinématique, drift lent « vivant », légende mono */
.parrain-visual--photo{aspect-ratio:2.3/1;max-height:540px;overflow:hidden;border-top:1px solid rgba(200,164,74,.22);border-bottom:1px solid rgba(200,164,74,.22);background:#0c0802;display:block;padding:0}
.parrain-visual--photo::before{display:none}
.parrain-visual--photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 36%;transform:scale(1.02);transform-origin:center 40%;animation:shotDrift 32s ease-in-out infinite alternate;will-change:transform}
@keyframes shotDrift{from{transform:scale(1.02)}to{transform:scale(1.055)}}
.parrain-visual--photo::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(8,6,1,.62),rgba(8,6,1,.06) 28%,transparent 50%);pointer-events:none;z-index:1}
.parrain-shot-cap{position:absolute;left:0;right:0;bottom:18px;z-index:2;margin:0;text-align:center;font-family:var(--M);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--cream2);opacity:.85;padding:0 22px}
@media(prefers-reduced-motion:reduce){.parrain-visual--photo img{animation:none;transform:scale(1.02)}}
@media(max-width:860px){.parrain-visual--photo{aspect-ratio:3/2;max-height:none}.parrain-visual--photo img{object-position:58% 40%}}

/* ═══════════════════════════════════════════════════════════════
   NAV — sous-menu au survol : aperçu des sections de chaque page
   (accès à l'info sans cliquer ; apparaît aussi au focus clavier)
═══════════════════════════════════════════════════════════════ */
.nav-item{position:relative}
.nav-drop{position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%) translateY(8px);min-width:212px;display:flex;flex-direction:column;padding:7px;background:rgba(16,11,4,.975);border:1px solid rgba(200,164,74,.2);box-shadow:0 26px 54px -22px rgba(0,0,0,.78);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .26s ease,transform .26s ease;z-index:130}
.nav-drop::before{content:'';position:absolute;left:-14px;right:-14px;top:-16px;height:16px}
.nav-drop::after{content:'';position:absolute;top:-5px;left:50%;transform:translateX(-50%) rotate(45deg);width:9px;height:9px;background:rgba(16,11,4,.975);border-left:1px solid rgba(200,164,74,.2);border-top:1px solid rgba(200,164,74,.2)}
.nav-item:hover>.nav-drop,.nav-item:focus-within>.nav-drop{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.nav-drop a{display:flex;align-items:center;gap:11px;padding:10px 16px;font-family:var(--B);font-size:13px;letter-spacing:0;text-transform:none;color:var(--cream);opacity:.8;text-decoration:none;white-space:nowrap;transition:background .2s,color .2s,opacity .2s,padding .2s}
.nav-drop a::after{display:none}
.nav-drop a::before{content:'';width:5px;height:5px;flex-shrink:0;background:var(--gold);opacity:.5;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);transition:opacity .2s,transform .2s}
.nav-drop a:hover{opacity:1;color:var(--gold2);background:rgba(200,164,74,.07);padding-left:21px}
.nav-drop a:hover::before{opacity:1;transform:scale(1.35)}
@media (hover:none){.nav-drop{display:none}}

/* ═══════════════════════════════════════════════════════════════
   SERVICES — jeu de lumière doré en fond (sobre, dérive lente,
   pausé hors écran via .anim-off, coupé en reduced-motion)
═══════════════════════════════════════════════════════════════ */
#parrainage{position:relative;isolation:isolate}
.svc-aura{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.svc-aura span{position:absolute;display:block;border-radius:50%}
.svc-aura .a1{width:48vw;height:48vw;left:-12vw;top:-3vw;background:radial-gradient(circle,rgba(200,164,74,.15),transparent 62%);animation:svcAura1 28s ease-in-out infinite alternate}
.svc-aura .a2{width:42vw;height:42vw;right:-14vw;top:33%;background:radial-gradient(circle,rgba(232,200,120,.11),transparent 66%);animation:svcAura2 34s ease-in-out infinite alternate}
.svc-aura .a3{width:40vw;height:40vw;left:16vw;bottom:-8vw;background:radial-gradient(circle,rgba(139,106,26,.14),transparent 68%);animation:svcAura3 38s ease-in-out infinite alternate}
@keyframes svcAura1{from{transform:translate3d(0,0,0)}to{transform:translate3d(6%,5%,0)}}
@keyframes svcAura2{from{transform:translate3d(0,0,0)}to{transform:translate3d(-7%,-4%,0)}}
@keyframes svcAura3{from{transform:translate3d(0,0,0)}to{transform:translate3d(5%,-6%,0)}}
@media(prefers-reduced-motion:reduce){.svc-aura span{animation:none}}

/* 3 · DEUX FORMULES — en-tête explicite, cartes encadrées, médaillon « ou » (réagencé 03/07 :
   il doit être évident d'un regard que ce sont deux offres au choix) */
.parrain-formules-head{max-width:1280px;margin:0 auto;padding:70px 48px 42px;border-top:1px solid rgba(200,164,74,.12);text-align:center}
.parrain-formules-head .p-tag{justify-content:center;margin-bottom:16px}
.parrain-formules-head .p-tag::after{content:'';width:26px;height:1px;background:var(--gold);opacity:.55}
.parrain-formules{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:stretch;gap:38px;max-width:1280px;margin:0 auto;padding:0 48px}
.parrain-formule{padding:54px 46px 46px;position:relative;border:1px solid rgba(200,164,74,.28);background:linear-gradient(180deg,rgba(200,164,74,.05),rgba(200,164,74,.012) 60%)}
.parrain-formule::before{content:'';position:absolute;top:-1px;left:-1px;right:-1px;height:2px;background:linear-gradient(90deg,var(--gold),rgba(200,164,74,.15))}
.parrain-formule::after{content:'01';position:absolute;top:20px;right:28px;font-family:var(--H);font-style:italic;font-size:84px;line-height:1;color:var(--gold);opacity:.09;pointer-events:none}
.parrain-formule--alt::after{content:'02'}
.parrain-f-tag{display:inline-block;margin-bottom:20px;background:var(--gold);color:#14100a;font-family:var(--M);font-size:10px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;padding:7px 14px 6px}
.formules-ou{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;width:56px;height:56px;border-radius:50%;border:1px solid rgba(200,164,74,.5);background:var(--bg);display:flex;align-items:center;justify-content:center;font-family:var(--H);font-style:italic;font-size:20px;color:var(--gold);box-shadow:0 0 0 8px var(--bg)}
.parrain-f-title{font-family:var(--H);font-size:clamp(26px,3.5vw,38px);font-weight:400;color:var(--cream);line-height:1.1;margin-bottom:18px;letter-spacing:-.01em}
.parrain-f-title em{color:var(--gold);font-style:italic}
.parrain-f-lead{font-family:var(--B);font-size:14px;line-height:1.8;color:var(--cream);opacity:.7;margin-bottom:22px}
.parrain-f-list{list-style:none;padding:0;margin:0 0 18px;display:flex;flex-direction:column;gap:11px}
.parrain-f-list li{font-family:var(--B);font-size:13.5px;line-height:1.5;color:var(--cream);padding-left:24px;position:relative;opacity:.8}
.parrain-f-list li::before{content:'';position:absolute;left:0;top:3px;width:13px;height:13px;background:var(--gold);opacity:.8;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
.parrain-f-list li::after{content:'';position:absolute;left:5px;top:7.5px;width:3px;height:3px;background:var(--bg);border-radius:50%}
.parrain-f-note{font-family:var(--M);font-size:10px;color:var(--gold);opacity:.55;letter-spacing:.08em;text-transform:uppercase}

/* 4 · PROCESS 4 étapes */
.parrain-process{padding:72px 48px 64px;max-width:1280px;margin:0 auto;position:relative}
.parrain-process-kicker{margin-bottom:48px;display:flex;justify-content:center}
.parrain-process-line{position:absolute;top:calc(72px + 40px + 40px);left:calc(48px + 40px);right:calc(48px + 40px);height:1px;background:linear-gradient(to right,transparent,rgba(200,164,74,.35) 10%,rgba(200,164,74,.35) 90%,transparent)}
.parrain-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;position:relative;z-index:1}
.parrain-step{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px}
/* Hexagone SVG plat (contour net + fond opaque qui masque le fil derrière) au lieu
   de clip-path+border qui tronquait le contour (corrigé 11/07). */
.parrain-step-n{font-family:var(--M);font-size:clamp(16px,2vw,22px);font-weight:600;color:var(--gold);width:80px;height:80px;display:flex;align-items:center;justify-content:center;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpolygon points='26,4 74,4 97,50 74,96 26,96 3,50' fill='%23080601' stroke='%23C8A44A' stroke-opacity='.5' stroke-width='3'/%3E%3C/svg%3E") center/contain no-repeat;position:relative;flex-shrink:0;transition:filter .4s,transform .45s cubic-bezier(.33,1,.68,1)}
.parrain-step:hover .parrain-step-n{filter:drop-shadow(0 8px 18px rgba(200,164,74,.28));transform:translateY(-2px)}
.parrain-step-title{font-family:var(--H);font-size:19px;font-weight:400;color:var(--cream);letter-spacing:.01em;margin:0}
.parrain-step p{font-family:var(--B);font-size:12.5px;line-height:1.7;color:var(--cream);opacity:.62;max-width:190px}
/* Refonte 13/07 — moins de friction : offre + CTA fort tôt, preuve en renfort, citation en clôture */
.parrain-steps--3{grid-template-columns:repeat(3,1fr)}
.parrain-visual--slim{aspect-ratio:2.9/1;max-height:400px}
/* Encart CTA remonté juste après les formules : espacement adapté (plus au fond de page) */
.parrain-final-wrap--top{padding:44px 48px 20px}

/* 5 · CE QUE VOUS RECEVEZ — blasons à insignes (planche) */
.parrain-deliverables{border-top:1px solid rgba(200,164,74,.12);padding:78px 48px;max-width:1280px;margin:0 auto}
.parrain-del-head{margin-bottom:44px}
.parrain-del-kicker{margin-bottom:18px}
.parrain-del-title{font-family:var(--H);font-size:clamp(28px,4vw,46px);font-weight:400;color:var(--cream);letter-spacing:-.01em;line-height:1.04}
.parrain-del-title em{color:var(--gold);font-style:italic}
/* registre en lignes (les 4 cases identiques en grille → lignes lisibles, retour 03/07) */
.parrain-del-list{border-top:1px solid rgba(200,164,74,.22)}
.del-row{display:grid;grid-template-columns:62px minmax(200px,.55fr) 1fr auto;gap:36px;align-items:center;padding:27px 10px;border-bottom:1px solid rgba(200,164,74,.13);transition:background .4s,padding-left .4s}
.del-row:hover{background:linear-gradient(90deg,rgba(200,164,74,.045),transparent 60%);padding-left:22px}
.del-row .seal{width:46px;height:46px}
.del-row:hover .seal .g{stroke:var(--gold2)}
.del-name{font-family:var(--H);font-size:clamp(20px,2.2vw,27px);font-weight:400;color:var(--cream);line-height:1.12}
.del-desc{font-family:var(--B);font-size:13px;line-height:1.68;color:var(--cream);opacity:.62;max-width:56ch}
.del-meta{font-family:var(--M);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);opacity:.55;justify-self:end;white-space:nowrap}

/* 6 · CITATION */
.parrain-quote{padding:56px 48px;max-width:1100px;margin:0 auto;position:relative}
.parrain-quote::before{content:'';position:absolute;left:48px;top:0;bottom:0;width:2px;background:rgba(200,164,74,.45)}
.parrain-quote p{font-family:var(--H);font-size:clamp(22px,3vw,32px);font-style:italic;color:var(--cream);line-height:1.55;padding-left:34px}
.parrain-quote footer{margin-top:18px;padding-left:34px;font-family:var(--M);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);opacity:.7}

/* 7 · MUR PARTENAIRES — LE REGISTRE (logos monochromes) */
.parrain-partners{border-top:1px solid rgba(200,164,74,.14);background:linear-gradient(180deg,rgba(200,164,74,.022),transparent 38%)}
.parrain-partners-inner{max-width:1180px;margin:0 auto;padding:78px 48px 64px}
.pp-head{display:flex;align-items:baseline;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:34px}
.pp-kicker{font-family:var(--H);font-size:clamp(22px,3vw,34px);font-weight:400;color:var(--cream);letter-spacing:-.01em}
.pp-kicker em{color:var(--gold);font-style:italic}
.pp-sub{font-family:var(--M);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--cream);opacity:.4}
.pp-wall{display:flex;flex-direction:column}
.pp-item{display:grid;grid-template-columns:1fr auto;align-items:center;gap:32px;padding:26px 10px;border-bottom:1px solid rgba(200,164,74,.1);text-decoration:none;color:inherit;transition:padding-left .4s ease,background .4s ease}
.pp-item:first-child{border-top:1px solid rgba(200,164,74,.1)}
.pp-item:hover{padding-left:22px;background:linear-gradient(90deg,rgba(200,164,74,.05),transparent 55%)}
.pp-logo{height:32px;display:flex;align-items:center}
.pp-logo svg{height:100%;width:auto;display:block;overflow:visible}
.pp-logo svg text{fill:var(--cream);opacity:.82;transition:fill .35s,opacity .35s}
.pp-logo svg .accent{fill:var(--gold);transition:fill .35s}
.pp-item:hover .pp-logo svg text{fill:var(--gold2);opacity:1}
.pp-item:hover .pp-logo svg .accent{fill:var(--gold4)}
.pp-item--lead .pp-logo{height:42px}
.pp-meta{display:flex;align-items:baseline;gap:12px;white-space:nowrap}
.pp-ruche-n{font-family:var(--H);font-size:34px;font-weight:600;color:var(--gold);line-height:1}
.pp-ruche-l{font-family:var(--M);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--cream);opacity:.45;text-align:left;line-height:1.5;max-width:12ch;white-space:normal}

/* 8 · ENCART FINAL EN SURBRILLANCE — le point de contact unique du parrainage (03/07) */
.parrain-final-wrap{max-width:1280px;margin:0 auto;padding:26px 48px 92px}
.parrain-final{position:relative;text-align:center;padding:72px 40px 78px;border:1px solid rgba(200,164,74,.38);background:radial-gradient(ellipse 75% 100% at 50% 0%,rgba(200,164,74,.12),rgba(200,164,74,.025) 58%,transparent)}
.parrain-final::before,.parrain-final::after{content:'';position:absolute;width:26px;height:26px;border:1px solid var(--gold);opacity:.7}
.parrain-final::before{top:-1px;left:-1px;border-right:none;border-bottom:none}
.parrain-final::after{bottom:-1px;right:-1px;border-left:none;border-top:none}
.pf-kicker{justify-content:center}
.pf-kicker::after{content:'';width:26px;height:1px;background:var(--gold);opacity:.55}
.pf-title{font-family:var(--H);font-size:clamp(32px,4.8vw,56px);font-weight:400;color:var(--cream);letter-spacing:-.015em;line-height:1.04;margin:22px 0 16px}
.pf-title em{color:var(--gold);font-style:italic}
.pf-sub{font-family:var(--B);font-size:13.5px;line-height:1.8;color:var(--cream);opacity:.68;max-width:52ch;margin:0 auto 34px}
.pf-sub strong{color:var(--gold2);font-weight:500;opacity:1;white-space:nowrap}
.pf-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 60% 80% at 50% 8%,rgba(200,164,74,.09),transparent 62%);animation:mBreath 8s ease-in-out infinite alternate}
.parrain-final>*:not(.pf-glow){position:relative;z-index:1}

/* ═══ MOTION « registre d'atelier » (03/07) — la règle, le tampon, le sceau.
   Animations (pas transitions) : elles jouent une fois au reveal et n'interfèrent
   jamais avec les hovers. `backwards` tient l'état initial pendant le délai. ═══ */
@keyframes mRule{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes mRise{from{opacity:0;transform:translateY(16px)}}
@keyframes mGo{from{opacity:0;transform:translateX(-18px)}}
@keyframes mStamp{from{opacity:0;transform:scale(1.4) rotate(-5deg)}}
@keyframes mGhost{from{opacity:0;transform:translateY(18px)}}
@keyframes mOu{from{opacity:0;scale:.4}}
@keyframes mDraw{from{stroke-dashoffset:210}}
@keyframes mFade{from{opacity:0}}
@keyframes mCorner{from{width:0;height:0}}
@keyframes mSettle{from{opacity:0;letter-spacing:.07em}}
@keyframes mBreath{from{opacity:.55}to{opacity:1}}

/* 1 · Sommaire : le filet se tire à la règle sous chaque ligne, la flèche arrive en dernier */
.pidx::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;background:rgba(200,164,74,.4);transform:scaleX(1);transform-origin:left}
.pidx.pv-in::after{animation:mRule 1.25s cubic-bezier(.77,0,.18,1) both}
.pidx:nth-child(2).pv-in::after{animation-delay:.18s}
.pidx:nth-child(3).pv-in::after{animation-delay:.36s}
.pidx.pv-in .pidx-go{animation:mGo .7s cubic-bezier(.22,1,.36,1) .5s backwards}
.pidx.pv-in .pidx-d{animation:mRise .8s cubic-bezier(.22,1,.36,1) .25s backwards}

/* 2 · Formules : liseré tiré, badge apposé comme un tampon, numéro en filigrane qui monte */
.parrain-formule.pv-in::before{animation:mRule 1.1s cubic-bezier(.77,0,.18,1) .12s both;transform-origin:left}
.parrain-formule.pv-in .parrain-f-tag{animation:mStamp .55s cubic-bezier(.34,1.56,.64,1) .5s backwards}
.parrain-formule.pv-in::after{animation:mGhost 1.1s cubic-bezier(.22,1,.36,1) .65s backwards}
.parrain-formule--alt.pv-in .parrain-f-tag{animation-delay:.68s}
.parrain-formule--alt.pv-in::after{animation-delay:.83s}
.formules-ou.mv.pv-in{animation:mOu .8s cubic-bezier(.34,1.56,.64,1) .85s backwards}

/* 3 · Registre : les sceaux se gravent (tracé des anneaux), le motif apparaît ensuite */
.del-row .seal .ring,.del-row .seal .ring2{stroke-dasharray:210;stroke-dashoffset:0}
.del-row.pv-in .seal .ring{animation:mDraw 1.5s ease .2s backwards}
.del-row.pv-in .seal .ring2{animation:mDraw 1.5s ease .38s backwards}
.del-row.pv-in .seal .g,.del-row.pv-in .seal .gf{animation:mFade .9s ease .75s backwards}
.del-row.pv-in .del-meta{animation:mFade 1s ease .6s backwards}

/* 4 · Encart final : les coins se forgent, le titre « se pose » (interlettrage qui se resserre) */
.parrain-final.pv-in::before,.parrain-final.pv-in::after{animation:mCorner .85s cubic-bezier(.6,0,.2,1) .55s backwards}
.parrain-final.pv-in::after{animation-delay:.7s}
.parrain-final.pv-in .pf-title{animation:mSettle 1.35s cubic-bezier(.22,1,.36,1) .15s backwards}
.parrain-final.pv-in .pf-sub{animation:mRise .9s cubic-bezier(.22,1,.36,1) .45s backwards}
.parrain-final.pv-in .btn-gold{animation:mRise .8s cubic-bezier(.22,1,.36,1) .65s backwards}

@media(prefers-reduced-motion:reduce){
  .pidx.pv-in::after,.pidx.pv-in .pidx-go,.pidx.pv-in .pidx-d,
  .parrain-formule.pv-in::before,.parrain-formule.pv-in::after,.parrain-formule.pv-in .parrain-f-tag,
  .formules-ou.mv.pv-in,.del-row.pv-in .seal .ring,.del-row.pv-in .seal .ring2,
  .del-row.pv-in .seal .g,.del-row.pv-in .seal .gf,.del-row.pv-in .del-meta,
  .parrain-final.pv-in::before,.parrain-final.pv-in::after,.parrain-final.pv-in .pf-title,
  .parrain-final.pv-in .pf-sub,.parrain-final.pv-in .btn-gold,.pf-glow{animation:none}
}

/* RESPONSIVE */
@media(max-width:1040px){
  .parrain-impact-row{grid-template-columns:1fr;gap:44px}
  .parrain-stats{border-top:1px solid rgba(200,164,74,.3)}
  .parrain-formules{grid-template-columns:1fr;gap:26px;padding:0 22px}
  .parrain-formules-head{padding:52px 22px 30px}
  .formules-ou{position:static;transform:none;order:2;justify-self:center;box-shadow:none}
  .parrain-formule{order:1;padding:42px 26px 38px}
  .parrain-formule--alt{order:3}
  .parrain-steps{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:860px){
  .parrain-impact{padding:64px 22px 44px}
  .parrain-process{padding:48px 22px 40px}
  .parrain-process-line{display:none}
  .parrain-deliverables{padding:52px 22px}
  .del-row{grid-template-columns:46px 1fr;gap:6px 18px;padding:22px 4px}
  .del-row:hover{padding-left:4px}
  .del-row .seal{width:40px;height:40px;align-self:start}
  .del-desc{grid-column:2}
  .del-meta{grid-column:2;justify-self:start;margin-top:3px}
  .parrain-quote{padding:38px 22px}
  .parrain-quote::before{left:22px}
  .parrain-quote p,.parrain-quote footer{padding-left:24px}
  .parrain-partners-inner{padding:52px 22px}
  .pp-item{grid-template-columns:1fr;gap:14px;padding:22px 4px}
  .pp-item:hover{padding-left:4px}
  .pp-logo{height:28px}
  .pp-item--lead .pp-logo{height:34px}
  .pp-meta{gap:10px}
  .pp-ruche-n{font-size:28px}
  .parrain-steps{grid-template-columns:1fr;gap:24px}
  .parrain-step{flex-direction:row;text-align:left;align-items:flex-start;gap:18px}
  .parrain-step-n{flex-shrink:0;width:58px;height:58px}
  .parrain-final-wrap{padding:14px 22px 60px}
  .parrain-final{padding:52px 22px 58px}
}


/* bandeau photo en tete de page interne */
.page-banner{position:relative;height:clamp(220px,34vh,360px);margin:0 0 14px;overflow:hidden}
.page-banner img{width:100%;height:100%;object-fit:cover;object-position:center 38%;display:block}
.page-banner::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(8,6,1,.45),rgba(8,6,1,.2) 38%,var(--bg))}
.page-banner figcaption{position:absolute;left:0;right:0;bottom:18px;text-align:center;z-index:2;font-family:var(--M);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--cream2);opacity:.85}

/* ═══ PAGE FAQ ═══ */
.faq-head{max-width:760px;margin:0 auto;padding:78px 24px 8px;text-align:center;position:relative;isolation:isolate}
.faq-head>*{position:relative;z-index:1}
/* (11/07) Le fond de la FAQ paraissait vide/cheap → profondeur sobre & on-brand :
   halo doré chaud + trame d'alvéoles derrière le titre. */
.faq-head::before{content:'';position:absolute;left:50%;top:6%;width:min(820px,92vw);height:360px;transform:translateX(-50%);z-index:0;background:radial-gradient(ellipse 56% 72% at 50% 42%,rgba(200,164,74,.15),rgba(200,164,74,.045) 54%,transparent 74%);filter:blur(3px);pointer-events:none}
.faq-head::after{content:'';position:absolute;left:0;right:0;top:0;height:300px;z-index:0;background-image:url("data:image/svg+xml,%3Csvg width='28' height='49' viewBox='0 0 28 49' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23C8A44A' fill-opacity='.09'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/g%3E%3C/svg%3E");background-size:34px 59.5px;-webkit-mask-image:radial-gradient(ellipse 72% 92% at 50% 26%,#000,transparent 72%);mask-image:radial-gradient(ellipse 72% 92% at 50% 26%,#000,transparent 72%);pointer-events:none}
.faq-title{font-family:var(--H);font-weight:600;font-size:clamp(40px,7.4vw,72px);line-height:1.02;color:var(--cream);margin:.16em 0 .34em}
.faq-intro{font-family:var(--B);font-size:14.5px;line-height:1.75;color:var(--cream2);opacity:.85;max-width:600px;margin:0 auto}
.faq-intro a{color:var(--gold);text-decoration:underline}

/* 2 colonnes : index collant + contenu.
   (11/07) Filigrane d'alvéoles pleine hauteur RETIRÉ : jugé moche au défilement.
   Les alvéoles ne restent que derrière le titre (.faq-head::after). */
.faq-layout{max-width:1080px;margin:0 auto;padding:34px clamp(20px,5vw,56px) 92px;display:grid;grid-template-columns:236px 1fr;gap:clamp(30px,5vw,72px);align-items:start}
.faq-index{position:sticky;top:104px}
.faq-index-kicker{font-family:var(--M);font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted);margin-bottom:16px}
.faq-index ol{list-style:none;margin:0;padding:0;border-left:1px solid rgba(200,164,74,.2)}
.faq-index a{display:flex;align-items:baseline;gap:10px;padding:10px 0 10px 18px;margin-left:-1px;border-left:1px solid transparent;font-family:var(--B);font-size:13px;line-height:1.4;color:var(--cream2);opacity:.58;text-decoration:none;transition:color .25s,opacity .25s,border-color .25s}
.faq-index a .fi-n{font-family:var(--M);font-size:10px;letter-spacing:.1em;color:var(--gold);opacity:.7}
.faq-index a:hover{opacity:.95;color:var(--cream)}
.faq-index a.active{opacity:1;color:var(--cream);border-left-color:var(--gold)}
.faq-index a.active .fi-n{opacity:1}

.faq-content{min-width:0}
.faq-group{margin-bottom:54px;scroll-margin-top:104px}
.faq-group-head{display:flex;align-items:baseline;gap:14px;padding-bottom:12px;margin-bottom:6px;border-bottom:1px solid rgba(200,164,74,.22)}
.faq-group-n{font-family:var(--H);font-weight:600;font-size:clamp(28px,4vw,46px);line-height:1;color:transparent;-webkit-text-stroke:1px rgba(200,164,74,.4)}
.faq-group-title{font-family:var(--P);font-weight:600;font-size:clamp(19px,2.6vw,26px);color:var(--gold2);margin:0}
.faq-item{border-bottom:1px solid rgba(200,164,74,.12)}
.faq-q{list-style:none;cursor:none;display:flex;align-items:flex-start;gap:16px;padding:19px 2px;font-family:var(--B);font-size:14.5px;line-height:1.5;font-weight:500;color:var(--cream);transition:color .25s}
.faq-q::-webkit-details-marker{display:none}
.faq-q::before{content:'';flex-shrink:0;width:13px;height:13px;margin-top:4px;background:var(--gold);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);transition:transform .4s cubic-bezier(.33,1,.68,1)}
.faq-item[open]>.faq-q::before{transform:rotate(180deg) scale(1.12)}
.faq-q:hover{color:var(--gold2)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .42s cubic-bezier(.33,1,.68,1)}
.faq-item[open] .faq-a{grid-template-rows:1fr}
.faq-a-in{overflow:hidden;min-height:0}
.faq-a-in p{margin:0;padding:2px 2px 22px 29px;font-family:var(--B);font-size:13.5px;line-height:1.78;color:var(--cream2);opacity:.86}
.faq-a-in a{color:var(--gold);text-decoration:underline}
@media(prefers-reduced-motion:reduce){.faq-a{transition:none}.faq-q::before{transition:none}}
.faq-cta{margin-top:50px;text-align:center;padding-top:30px;border-top:1px solid rgba(200,164,74,.16)}
.faq-cta p{font-family:var(--P);font-size:clamp(18px,2.4vw,22px);color:var(--cream);margin:0 0 20px}
@media(max-width:820px){
  .faq-layout{grid-template-columns:1fr;gap:22px}
  .faq-index{position:static;top:auto}
  .faq-index ol{display:flex;flex-wrap:wrap;gap:8px;border-left:0}
  .faq-index a{padding:8px 13px;border:1px solid rgba(200,164,74,.18);margin-left:0}
  .faq-index a.active{border-color:var(--gold);border-left-color:var(--gold)}
}

/* ── LANCEUR FAQ : bouton alvéole fixe (mène à faq.html), injecté par site.js ── */
.faq-bee{position:fixed;right:28px;bottom:28px;z-index:79;width:54px;height:54px;display:flex;align-items:center;justify-content:center;text-decoration:none;color:var(--gold2);background:rgba(22,15,6,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(200,164,74,.4);border-radius:50%;box-shadow:0 14px 40px rgba(0,0,0,.5);transition:color .3s,border-color .3s,transform .3s,box-shadow .3s}
.faq-bee:hover,.faq-bee:focus-visible{color:var(--cream);border-color:var(--gold2);transform:translateY(-2px);box-shadow:0 18px 48px rgba(0,0,0,.55);outline:none}
.faq-bee svg{width:26px;height:26px;display:block}
.faq-bee text{font-family:var(--B);font-weight:600}
.faq-bee-label{position:absolute;right:calc(100% + 12px);white-space:nowrap;font-family:var(--B);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--cream);background:rgba(22,15,6,.94);border:1px solid rgba(200,164,74,.3);padding:8px 12px;opacity:0;transform:translateX(6px);pointer-events:none;transition:opacity .25s,transform .25s}
.faq-bee:hover .faq-bee-label,.faq-bee:focus-visible .faq-bee-label{opacity:1;transform:translateX(0)}
.faq-bee.above-cta{bottom:96px}
@media(max-width:680px){.faq-bee{right:16px;bottom:16px;width:48px;height:48px}.faq-bee.above-cta{bottom:84px}.faq-bee-label{display:none}}
@media(prefers-reduced-motion:reduce){.faq-bee,.faq-bee-label{transition:none}.faq-bee:hover,.faq-bee:focus-visible{transform:none}}

/* ═══ QUIZ « Trouvez votre miel » ═══ */
/* (11/07) « background à mourir » → profondeur : halo doré + trame d'alvéoles,
   comme la FAQ, pour donner de la matière à la page conseil. */
.quiz-head{max-width:740px;margin:0 auto;padding:78px 24px 14px;text-align:center;position:relative;isolation:isolate}
.quiz-head>*{position:relative;z-index:1}
.quiz-head::before{content:'';position:absolute;left:50%;top:8%;width:min(820px,92vw);height:360px;transform:translateX(-50%);z-index:0;background:radial-gradient(ellipse 56% 72% at 50% 42%,rgba(200,164,74,.16),rgba(200,164,74,.05) 54%,transparent 74%);filter:blur(3px);pointer-events:none}
.quiz-head::after{content:'';position:absolute;left:0;right:0;top:0;height:300px;z-index:0;background-image:url("data:image/svg+xml,%3Csvg width='28' height='49' viewBox='0 0 28 49' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23C8A44A' fill-opacity='.09'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/g%3E%3C/svg%3E");background-size:34px 59.5px;-webkit-mask-image:radial-gradient(ellipse 72% 92% at 50% 26%,#000,transparent 72%);mask-image:radial-gradient(ellipse 72% 92% at 50% 26%,#000,transparent 72%);pointer-events:none}
.quiz-title{font-family:var(--H);font-weight:600;font-size:clamp(40px,7.4vw,72px);line-height:1.02;color:var(--cream);margin:.16em 0 .34em}
.quiz-intro{font-family:var(--B);font-size:14.5px;line-height:1.75;color:var(--cream2);opacity:.85;max-width:600px;margin:0 auto}
.quiz-wrap{max-width:740px;margin:0 auto;padding:26px 24px 92px}
.quiz-q{border:0;margin:0 0 38px;padding:0}
.quiz-q legend{display:flex;align-items:center;gap:13px;font-family:var(--P);font-weight:600;font-size:clamp(18px,2.5vw,23px);color:var(--cream);margin-bottom:18px;padding:0}
/* Numéro en hexagone dessiné SVG (contour net) — plus de clip-path+border tronqué */
.quiz-n{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:38px;height:38px;font-family:var(--P);font-weight:700;font-size:16px;color:var(--gold2);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpolygon points='50,3 96,26 96,74 50,97 4,74 4,26' fill='%23C8A44A' fill-opacity='.10' stroke='%23C8A44A' stroke-opacity='.6' stroke-width='3'/%3E%3C/svg%3E") center/contain no-repeat}
.quiz-opts{display:flex;flex-wrap:wrap;gap:12px}
/* Options plus engageantes : cibles généreuses, marqueur alvéole à la sélection,
   remplissage doré net, micro-relief au survol. */
.quiz-opt{position:relative;display:inline-flex;align-items:center;gap:11px;font-family:var(--B);font-size:14px;color:var(--cream2);background:linear-gradient(150deg,rgba(200,164,74,.05),rgba(255,255,255,.015));border:1px solid rgba(200,164,74,.22);padding:15px 22px;min-height:52px;cursor:none;transition:border-color .25s,background-color .25s,color .25s,transform .25s cubic-bezier(.33,1,.68,1),box-shadow .25s;text-align:left}
.quiz-opt::before{content:'';width:16px;height:16px;flex-shrink:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpolygon points='50,3 96,26 96,74 50,97 4,74 4,26' fill='none' stroke='%23C8A44A' stroke-opacity='.5' stroke-width='6'/%3E%3C/svg%3E") center/contain no-repeat;transition:background-image .2s,transform .3s cubic-bezier(.33,1,.68,1)}
.quiz-opt:hover{border-color:rgba(200,164,74,.5);color:var(--cream);transform:translateY(-2px);box-shadow:0 12px 26px -18px rgba(200,164,74,.7)}
.quiz-opt[aria-pressed="true"]{background:linear-gradient(150deg,rgba(200,164,74,.2),rgba(200,164,74,.08));border-color:var(--gold);color:var(--cream);box-shadow:0 0 0 1px rgba(200,164,74,.35) inset}
.quiz-opt[aria-pressed="true"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpolygon points='50,3 96,26 96,74 50,97 4,74 4,26' fill='%23C8A44A'/%3E%3Cpath d='M32 52l12 12 24-26' fill='none' stroke='%23140d04' stroke-width='9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");transform:scale(1.12)}
.quiz-actions{margin-top:8px;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.quiz-go:disabled,#quizGo:disabled{opacity:.42;pointer-events:none}
.quiz-hint{font-family:var(--B);font-size:12px;letter-spacing:.04em;color:var(--muted);margin:0}
.quiz-result{margin-top:18px;border-top:1px solid rgba(200,164,74,.18);padding-top:40px;animation:quizIn .6s cubic-bezier(.33,1,.68,1) both}
@keyframes quizIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.quiz-result{animation:none}}
.quiz-result-eyebrow{font-family:var(--M);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);text-align:center;margin-bottom:18px}
.quiz-result-card{display:grid;grid-template-columns:230px 1fr;gap:30px;align-items:center;background:linear-gradient(155deg,rgba(36,26,10,.9),rgba(19,13,5,.85));border:1px solid rgba(200,164,74,.2);border-radius:14px;padding:26px;box-shadow:0 24px 56px -30px rgba(0,0,0,.8)}
.quiz-result-img{aspect-ratio:4/5;border-radius:10px;background-size:cover;background-position:center;border:1px solid rgba(200,164,74,.22);background-color:var(--bg3)}
.quiz-result-kicker{font-family:var(--M);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold2);margin-bottom:8px}
.quiz-result-title{font-family:var(--H);font-weight:600;font-size:clamp(28px,4vw,40px);line-height:1.05;color:var(--cream);margin:0 0 12px}
.quiz-result-why{font-family:var(--B);font-size:13.5px;line-height:1.7;color:var(--cream2);opacity:.88;margin:0 0 14px}
.quiz-result-price{font-family:var(--P);font-size:20px;color:var(--gold);margin-bottom:20px}
.quiz-result-cta{display:flex;flex-wrap:wrap;gap:12px}
.quiz-result-note{text-align:center;font-family:var(--B);font-size:12.5px;line-height:1.7;color:var(--muted);margin:26px auto 0;max-width:520px}
.quiz-result-note a{color:var(--gold);text-decoration:underline}
@media(max-width:620px){.quiz-result-card{grid-template-columns:1fr;text-align:center}.quiz-result-img{max-width:200px;margin:0 auto}.quiz-result-cta{justify-content:center}.quiz-opt{flex:1 1 100%}}

/* ═══ NAV MOBILE (audit 02/07) — burger + panneau générés par site.js ═══ */
.nav-burger{display:none;width:44px;height:44px;background:transparent;border:1px solid rgba(200,164,74,.4);flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:0;cursor:pointer}
.nav-burger span{display:block;width:18px;height:1.5px;background:var(--gold);transition:transform .3s,opacity .3s}
.nav-burger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.nav-burger.open span:nth-child(2){opacity:0}
.nav-burger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
@media(max-width:640px){.nav-burger{display:flex}.nav-logo{gap:9px}.nav-logo-mark{height:34px}}
/* panneau : sous la barre de nav (z 100), on garde le burger accessible pour fermer */
#mobile-nav{position:fixed;inset:0;z-index:90;background:rgba(22,15,6,.97);backdrop-filter:blur(12px);display:none;padding:104px 34px 44px;overflow:auto;overscroll-behavior:contain}
#mobile-nav.open{display:block}
body.mnav-open{overflow:hidden}
.mnav-list{display:flex;flex-direction:column}
.mnav-top{display:block;font-family:var(--H);font-style:italic;font-size:31px;font-weight:400;color:var(--cream);text-decoration:none;padding:13px 0 11px;border-bottom:1px solid rgba(200,164,74,.14)}
.mnav-top[aria-current]{color:var(--gold)}
.mnav-sub{display:block;font-family:var(--B);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--cream2);opacity:.72;text-decoration:none;padding:10px 0 10px 3px}
.mnav-sub:last-of-type{margin-bottom:6px}

/* ═══ Cibles tactiles ≥44px (audit 02/07) ═══ */
@media(pointer:coarse){
  .nav-icon{width:44px;height:44px}
  .nav-cart{padding:13px 24px;min-height:44px}
  .nav-search-pill{min-height:44px}
  .hc-add{width:44px;height:44px}
  .pm-qty button{min-width:44px;min-height:44px}
}

/* ═══ Filet curseur (audit 02/07) : si le curseur-abeille n'est PAS actif (JS coupé,
   navigateur restreint), aucun élément ne doit faire disparaître le curseur natif ═══ */
html:not(.bee-cursor) a,html:not(.bee-cursor) button,html:not(.bee-cursor) [onclick],
html:not(.bee-cursor) .hc,html:not(.bee-cursor) .cc{cursor:pointer!important}

/* ═══════════════════════════════════════════════════════════════════
   SIGNATURES MOTION PAR PAGE (02/07) — chaque page a SON geste, sobre.
   Accueil = couture typographique · Produits = pots posés au cellier ·
   Maison = frise qui se trace · Productions = alvéoles qui se remplissent ·
   Services = fil d'or qui se déroule. Le bloc reduced-motion global
   (transition/animation-duration:.01ms) neutralise tout automatiquement.
   ═══════════════════════════════════════════════════════════════════ */

/* ── ACCUEIL · entrée « couture » du titre : les lettres se resserrent et
      se précisent, comme un monogramme qu'on ajuste. CSS pur : joue dès le
      premier rendu, sans attendre GSAP (même logique que heroIn). ── */
.hl-1{animation:heroCouture 1.25s cubic-bezier(.22,1,.36,1) both .12s}
.hl-2{animation:heroCouture 1.45s cubic-bezier(.22,1,.36,1) both .3s}
@keyframes heroCouture{
  from{opacity:0;letter-spacing:.09em;filter:blur(7px)}
  60%{opacity:1}
  to{opacity:1;letter-spacing:normal;filter:blur(0)}
}

/* ── TYPOGRAPHIE · micro-réglages de composition (pro pass) ── */
.section-title,.parrain-main-title,.pm-title,.venir-title,.quiz-title,.hist-lead h3{text-wrap:balance;font-kerning:normal;font-feature-settings:'liga' 1,'kern' 1}
/* chiffres alignés en colonne : prix, totaux, stats (lining + tabular) */
.hc-price,.cc-price,.pm-price,.cart-total,.chk-total,.precom-details li span,.sk-price,.parrain-stat-n,.chiffre .ch-num{font-variant-numeric:lining-nums tabular-nums}

/* ── MAISON · la frise se TRACE : le fil descend, le jalon s'allume,
      la date s'encre. Piloté par GSAP via variables CSS (défaut = état
      final → rien ne casse sans JS ni en reduced-motion). ── */
.hf-item::before{transform-origin:top center;transform:scaleY(var(--hfLine,1))}
.hf-item::after{transform:scale(var(--hfDot,1))}
.hf-date{opacity:var(--hfTxt,1);transform:translateX(calc((1 - var(--hfTxt,1)) * -12px))}
.hf-body{opacity:calc(var(--hfTxt,1) * .82 + .18)}

/* ── PRODUCTIONS · le calendrier se remplit comme des alvéoles qu'on
      operculerait — pop bref cellule par cellule. Vanilla : la classe
      .cal-anim est posée par JS (sans JS → état final). ── */
.cal-grid.cal-anim .cal-m{transform:scale(.78);transition:transform .5s cubic-bezier(.3,1.45,.45,1)}
.cal-grid.cal-anim .cal-mois{opacity:0;transition:opacity .6s ease}
.cal-grid.cal-anim.cal-in .cal-m{transform:scale(1)}
.cal-grid.cal-anim.cal-in .cal-mois{opacity:.85}

/* ── SERVICES · le fil d'or du process se DÉROULE de gauche à droite
      (métier à tisser) ; .line-anim posé par JS avant peinture. ── */
.parrain-process.line-anim .parrain-process-line{transform:scaleX(0);transform-origin:left center;transition:transform 1.5s cubic-bezier(.22,1,.36,1) .1s}
.parrain-process.line-anim.line-in .parrain-process-line{transform:scaleX(1)}
/* … et chaque partenaire reçoit son trait d'or, tiré sous le logo. */
.pp-item::after{content:'';position:absolute;left:10px;right:auto;bottom:-1px;width:calc(100% - 20px);height:1px;background:linear-gradient(to right,var(--gold2),rgba(200,164,74,.06));transform:scaleX(0);transform-origin:left center;transition:transform 1s cubic-bezier(.22,1,.36,1) .3s;pointer-events:none}
.pp-item{position:relative}
.pp-item.pv-in::after{transform:scaleX(1)}
.pp-item:nth-child(2).pv-in::after{transition-delay:.42s}
.pp-item:nth-child(3).pv-in::after{transition-delay:.54s}
.pp-item:nth-child(4).pv-in::after{transition-delay:.66s}
.pp-item:nth-child(5).pv-in::after{transition-delay:.78s}
.pp-item:nth-child(6).pv-in::after{transition-delay:.9s}
.pp-item:nth-child(7).pv-in::after{transition-delay:1.02s}

/* ═══ SERVICES v2 (réarchitecture 02/07) — ouverture « trois portes »,
   CTA intermédiaire, Transmission en deux volets ═══ */

/* Ancres : le contenu ne se cache pas sous la nav fixe */
#parrainage,#stages,#ecole,#transmission,#contact,#savoir,#histoire{scroll-margin-top:88px}

/* OUVERTURE — trois portes (écho des trois carrés de l'accueil, version registre) */
.svc-portes{padding:136px 48px 30px;max-width:1280px;margin:0 auto}
.portes-head{text-align:center;margin-bottom:46px}
.portes-head .section-line{margin:0 auto 22px}
.portes-lead{font-family:var(--B);font-size:15px;line-height:1.85;color:var(--cream2);opacity:.7;max-width:580px;margin:0 auto}
/* Sommaire éditorial — trois grandes lignes typographiques (remplace les cases en grille, 03/07) */
.portes-idx{border-top:1px solid rgba(200,164,74,.24)}
.pidx{display:grid;grid-template-columns:64px 1fr 1.05fr 54px;align-items:center;gap:38px;padding:36px 14px;border-bottom:1px solid rgba(200,164,74,.15);text-decoration:none;color:inherit;position:relative;transition:background-color .45s,padding-left .45s}
.pidx::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(200,164,74,.06),transparent 60%);opacity:0;transition:opacity .45s;pointer-events:none}
.pidx:hover{background:rgba(200,164,74,.028);padding-left:32px}
.pidx:hover::before{opacity:1}
.pidx-n{font-family:var(--H);font-style:italic;font-weight:400;font-size:34px;color:var(--gold);opacity:.32;line-height:1;transition:opacity .4s}
.pidx:hover .pidx-n{opacity:.75}
.pidx-t{display:block;font-family:var(--H);font-weight:400;font-size:clamp(27px,3.4vw,44px);line-height:1.05;color:var(--cream);letter-spacing:-.01em;transition:color .4s}
.pidx-t em{font-style:italic;color:var(--gold2)}
.pidx-pub{display:block;font-family:var(--M);font-size:9.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);opacity:.6;margin-top:9px}
.pidx-d{font-family:var(--B);font-size:13px;line-height:1.72;color:var(--cream2);opacity:.68;max-width:46ch}
.pidx-go{font-family:var(--H);font-size:27px;color:var(--gold);opacity:.45;justify-self:end;transition:transform .4s,opacity .4s}
.pidx:hover .pidx-go{transform:translateX(9px);opacity:1}
@media(max-width:900px){
  .svc-portes{padding:118px 22px 12px}
  .pidx{grid-template-columns:40px 1fr;gap:8px 18px;padding:28px 4px}
  .pidx:hover{padding-left:4px}
  .pidx-n{font-size:24px;align-self:start;margin-top:4px}
  .pidx-d{grid-column:2}
  .pidx-go{display:none}
}

/* CTA intermédiaire du parrainage — sobre, ne vole pas le CTA final */
/* .parrain-cta--mid retiré le 03/07 : CTA milieu de page fusionné dans .parrain-final (retour utilisateur) */

/* TRANSMISSION — deux volets sous une même tête de section */
.trans-part{max-width:1180px;margin:0 auto;padding:34px 0 10px;border-top:1px solid rgba(200,164,74,.12)}
.trans-part + .trans-part{margin-top:44px}
.trans-sub{font-family:var(--H);font-style:italic;font-weight:500;font-size:clamp(23px,2.6vw,32px);color:var(--cream);margin-bottom:10px}
.trans-sub-note{display:inline-block;margin-left:14px;font-family:var(--M);font-style:normal;font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);opacity:.75;vertical-align:middle}
.trans-lead{font-family:var(--B);font-size:14.5px;line-height:1.8;color:var(--cream2);opacity:.75;max-width:66ch;margin-bottom:28px}
.trans-part .srv-cta{text-align:left}
.trans-part .srv-note{text-align:left;margin-left:0}
.ecole-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:46px;align-items:start;margin-bottom:24px}
.ecole-grid .trans-lead{margin-bottom:0}
.eco-facts{list-style:none;border-left:1px solid rgba(200,164,74,.28);padding-left:24px;margin:0}
.eco-facts li{font-family:var(--B);font-size:13.5px;color:var(--cream);padding:9px 0;margin:0}
.eco-k{display:block;font-family:var(--M);font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);opacity:.8;margin-bottom:3px}
@media(max-width:820px){
  .ecole-grid{grid-template-columns:1fr;gap:22px}
  .trans-sub-note{display:block;margin:8px 0 0}
}

/* ═══ MAISON v2 (02/07) — moins de scroll, rien de perdu ═══ */
/* Histoire : portrait COLLANT à gauche, récit + frise à droite (3 blocs → 1 composition) */
.hist-flow{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:.72fr 1.28fr;gap:56px;align-items:start}
.hist-side{position:sticky;top:96px;display:flex;flex-direction:column;gap:18px}
.hist-side .hist-dream{margin-top:0}
.hist-main .hist-lead{margin-bottom:6px}
.hist-main .hist-frise{max-width:none;margin:30px 0 0}
.hist-main .hf-item{padding-bottom:30px}
/* Respirations resserrées (les règles tardives gagnent) */
#histoire{padding:112px 48px 60px}
.histoire-header{margin-bottom:44px}
.hist-distinctions{margin:52px auto 0}
.hist-dist-head{margin-bottom:22px}
#savoir{padding:64px 48px 72px}
.savoir-lead-wrap{margin-bottom:30px}
#contact{padding:76px 48px}
@media(max-width:900px){
  .hist-flow{grid-template-columns:1fr;gap:28px}
  .hist-side{position:static}
  #histoire{padding:88px 24px 48px}
}

/* ═══ COMPACTAGE GLOBAL (02/07) — « moins de pages à scroll » sur toutes les
   pages, même geste que Maison : on resserre les respirations par défaut,
   les espaces restants sont ceux qui respirent VOLONTAIREMENT. ═══ */

/* Accueil */
#univers{padding:64px 48px 56px}
#avis{padding:64px 0}
/* Produits */
#miels{padding:72px 48px 64px}
#creations{padding:64px 48px 72px}
.miels-header,.creations-header,.precom-header{margin-bottom:38px}
#chiffres{padding:46px 48px}
/* Productions */
#precommandes{padding:76px 48px 72px}
.precom-tabs{margin-bottom:38px}
/* FAQ & Quiz */
.faq-head{padding:60px 24px 8px}
.faq-layout{padding-bottom:64px}
.quiz-head{padding-top:60px}
.quiz-wrap{padding-bottom:64px}
/* Bande « Venir » partout */
.venir-band{padding:clamp(32px,4.6vh,48px) clamp(20px,5vw,56px)}
/* Ré-déclaration mobile APRÈS les overrides ci-dessus (sinon le padding
   latéral 24px du bloc @media 1024px plus haut serait écrasé) */
@media(max-width:1024px){
  #miels,#creations,#precommandes{padding:64px 24px 56px}
  #savoir{padding:56px 24px 64px}
  #contact{padding:64px 24px}
  #histoire{padding:96px 24px 52px}
}
@media(max-width:900px){#univers{padding:52px 22px 44px}#histoire{padding:88px 24px 48px}}

/* ═══════════ CONVERSION (11/07) — audit face aux normes du miel premium ═══════════
   Panier persistant + suggestion de comptoir, parcours « boutique bientôt reliée »
   (fin des alertes techniques), vitrine achetable sur l'accueil, quiz & réassurance
   en tête de collection. Une seule suggestion, jamais de carrousel : luxe sobre. */

/* Panier vide ≠ impasse : porte de sortie vers la collection */
.cart-empty-go{display:block;margin:20px auto 0;width:max-content;font-family:var(--M);font-style:normal;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);border:1px solid rgba(200,164,74,.4);padding:12px 20px;cursor:none;transition:background .3s,color .3s}
.cart-empty-go:hover{background:var(--gold);color:#080601}

/* Suggestion « pour accompagner » — une ligne, au-dessus du rappel livraison */
.cart-sugg{margin:0 0 14px;padding:13px 14px;border:1px solid rgba(200,164,74,.16);background:rgba(200,164,74,.04)}
.cart-sugg-kicker{font-family:var(--M);font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);opacity:.85;margin-bottom:10px}
.cart-sugg-item{display:flex;align-items:center;gap:12px}
.cart-sugg-img{width:44px;height:44px;flex-shrink:0;background-size:cover;background-position:center;border:1px solid rgba(200,164,74,.2)}
.cart-sugg-info{flex:1;min-width:0}
.cart-sugg-name{font-family:var(--H);font-size:15px;color:var(--cream);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cart-sugg-price{font-family:var(--B);font-size:11px;color:var(--muted);margin-top:2px}
.cart-sugg-add{width:36px;height:36px;flex-shrink:0;background:none;border:1px solid rgba(200,164,74,.45);color:var(--gold);font-size:16px;line-height:1;cursor:none;transition:background .3s,color .3s}
.cart-sugg-add:hover{background:var(--gold);color:#080601}

/* « Boutique bientôt reliée » — aucun message technique ne doit atteindre un client */
#soon-modal{position:fixed;inset:0;z-index:720;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .4s}
#soon-modal.open{opacity:1;pointer-events:all}
.soon-backdrop{position:absolute;inset:0;background:rgba(8,6,1,.88);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.soon-inner{position:relative;z-index:1;width:min(480px,92vw);background:var(--bg2);border:1px solid rgba(200,164,74,.22);clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%);box-shadow:0 24px 80px rgba(0,0,0,.6),0 0 60px rgba(200,164,74,.07);padding:44px 40px 32px;text-align:center}
.soon-close{position:absolute;top:12px;right:12px;background:none;border:none;color:var(--muted);font-size:15px;cursor:none;padding:9px;transition:color .3s}
.soon-close:hover{color:var(--cream)}
.soon-emblem{width:46px;height:46px;margin:0 auto 18px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(200,164,74,.35)}
.soon-emblem svg{width:22px;height:22px;stroke:var(--gold);fill:none;stroke-width:1.4}
.soon-title{font-family:var(--H);font-style:italic;font-weight:400;font-size:26px;line-height:1.25;color:var(--cream);margin-bottom:12px}
.soon-text{font-family:var(--B);font-size:13.5px;line-height:1.75;color:var(--cream2);opacity:.85;margin-bottom:24px}
.soon-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:20px}
.soon-actions a{cursor:none}
.soon-hours{font-family:var(--M);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);line-height:1.8}
@media(max-width:520px){.soon-inner{padding:36px 22px 24px}.soon-title{font-size:22px}}

/* Produits — invitation quiz (refonte 11/07 : l'ancienne pilule mono-majuscules
   encadrée était illisible). Ici : question en serif italique (personnalité) +
   CTA doré lisible à la flèche qui glisse. Pas de souligné, cadre discret. */
.miels-tools{margin-top:30px;display:flex;flex-direction:column;align-items:center;gap:18px}
.finder{display:inline-flex;align-items:center;gap:18px;text-decoration:none;padding:15px 26px 15px 18px;color:var(--gold2);background:linear-gradient(118deg,rgba(200,164,74,.10),rgba(200,164,74,.028));border:1px solid rgba(200,164,74,.22);border-radius:3px;cursor:none;transition:border-color .45s,background .45s,transform .45s cubic-bezier(.33,1,.68,1),box-shadow .45s}
.finder:hover{border-color:rgba(200,164,74,.46);background:linear-gradient(118deg,rgba(200,164,74,.15),rgba(200,164,74,.05));transform:translateY(-2px);box-shadow:0 16px 34px -22px rgba(200,164,74,.6)}
.finder-emblem{width:46px;height:46px;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--gold);filter:drop-shadow(0 0 10px rgba(200,164,74,.28));transition:transform .5s cubic-bezier(.33,1,.68,1)}
.finder-emblem svg{width:46px;height:46px}
.finder:hover .finder-emblem{transform:rotate(-6deg) scale(1.05)}
.finder-text{display:flex;flex-direction:column;gap:4px;text-align:left}
.finder-q{font-family:var(--H);font-style:italic;font-weight:500;font-size:21px;line-height:1.18;color:var(--cream);letter-spacing:.005em}
.finder-cta{font-family:var(--B);font-size:12.5px;letter-spacing:.02em;color:var(--gold2);display:inline-flex;align-items:center;gap:9px}
.finder-arr{font-family:var(--B);transition:transform .45s cubic-bezier(.33,1,.68,1)}
.finder:hover .finder-arr{transform:translateX(6px)}
.miels-note{font-family:var(--B);font-size:11.5px;letter-spacing:.02em;color:var(--cream2);opacity:.72;display:flex;align-items:center;gap:20px;flex-wrap:wrap;justify-content:center}
.miels-note span{display:flex;align-items:center;gap:8px}
.miels-note svg{width:15px;height:15px;stroke:var(--gold);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:.85;flex-shrink:0}
/* Desktop : l'en-tête Nos Miels est une grille 2 colonnes — placement EXPLICITE
   en rangée 4 pleine largeur (l'auto-placement collait la barre dans la cellule
   vide 1/2 et débordait de sa rangée), invitation à gauche, réassurance à droite */
@media(min-width:901px){
  .miels-header .miels-tools{grid-column:1/-1;grid-row:4;flex-direction:row;justify-content:space-between;align-items:center;margin-top:40px}
}

/* (11/07) Vitrine « collection » de l'accueil RETIRÉE à la demande : jugée obsolète
   + frôlait le « 3 cartes identiques en grille » proscrit par le manifeste. L'accueil
   renvoie déjà vers la boutique via la section « Trois univers » et le CTA flottant. */