/* ═══════════════════════════════
   HERO
   ═══════════════════════════════ */
.hero {
  position: relative; min-height: 100svh;
  display: flex; align-items: flex-end;
  padding: 0 0 clamp(3rem, 7svh, 5.5rem);
  overflow: hidden;
}

/* ═══ Animation d'entrée du hero ═══
   Image de fond : deflou dramatique
   Contenu : fade-up en cascade
   Note : !important nécessaire pour override `landscapeDrift` sur .hero-bg-img */
@keyframes heroDefocus {
  0%   {
    filter: brightness(.72) saturate(.85) blur(22px);
    transform: scale(1.12);
    opacity: 0;
  }
  60%  { opacity: 1; }
  100% {
    filter: brightness(.72) saturate(.85) blur(0);
    transform: scale(1.055);
    opacity: 1;
  }
}
@keyframes heroContentRise {
  0%   { opacity: 0; transform: translateY(24px); filter: blur(8px); }
  100% { opacity: 1; transform: translateY(0);    filter: blur(0);   }
}
.hero.is-revisit .hero-bg-img {
  animation: heroDefocus 2.2s cubic-bezier(.16,.7,.2,1) both !important;
}
.hero.is-revisit .hero-content > * {
  animation: heroContentRise 1s cubic-bezier(.2,.7,.2,1) both;
}
.hero.is-revisit .hero-eyebrow { animation-delay: .35s; }
.hero.is-revisit .hero-title   { animation-delay: .55s; }
.hero.is-revisit .hero-sub     { animation-delay: .8s;  }
.hero.is-revisit .hero-cta     { animation-delay: 1s;   }

@media (prefers-reduced-motion: reduce) {
  .hero.is-revisit .hero-bg-img,
  .hero.is-revisit .hero-content > * { animation: none !important; }
}

/* Background image */
.hero-bg {
  position: absolute; inset: 0; z-index: 0;
  overflow: hidden;
}
.hero-bg-img {
  width: 100%; height: 100%; object-fit: cover;
  object-position: center 20%;
  filter: brightness(.72) saturate(.85);
  transform: scale(1.055);
  animation: landscapeDrift 34s ease-in-out infinite alternate;
}
/* Pas d'image → fond de secours */
.hero-bg-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(8,11,22,.55) 0%,
    rgba(8,11,22,.2) 40%,
    rgba(8,11,22,.7) 75%,
    rgba(8,11,22,1) 100%
  );
}
.hero-bg-gradient {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 80% 60% at 25% 50%, rgba(0,0,0,.3) 0%, transparent 70%);
}
.hero-bg::before,
.hero-bg::after {
  content: '';
  position: absolute;
  inset: -12% -18%;
  pointer-events: none;
  mix-blend-mode: screen;
}
.hero-bg::before {
  background:
    radial-gradient(ellipse 42% 15% at 12% 26%, rgba(205,210,202,.32), transparent 68%),
    radial-gradient(ellipse 34% 12% at 45% 17%, rgba(230,220,198,.22), transparent 70%),
    radial-gradient(ellipse 46% 16% at 86% 30%, rgba(175,182,180,.28), transparent 72%);
  filter: blur(16px);
  opacity: .82;
  animation: cloudDriftSlow 38s linear infinite alternate;
}
.hero-bg::after {
  background:
    radial-gradient(ellipse 50% 18% at 28% 42%, rgba(95,105,108,.24), transparent 70%),
    radial-gradient(ellipse 38% 14% at 74% 24%, rgba(235,220,190,.16), transparent 72%),
    linear-gradient(95deg, transparent 0%, rgba(255,235,190,.08) 48%, transparent 64%);
  filter: blur(24px);
  opacity: .68;
  animation: cloudDriftDeep 54s linear infinite alternate;
}
@keyframes landscapeDrift {
  from { transform: scale(1.055) translate3d(-1.2%, .2%, 0); }
  to { transform: scale(1.09) translate3d(1.2%, -.7%, 0); }
}
@keyframes cloudDriftSlow {
  from { transform: translate3d(-9%, .4%, 0); }
  to { transform: translate3d(10%, -1.6%, 0); }
}
@keyframes cloudDriftDeep {
  from { transform: translate3d(8%, 1%, 0); }
  to { transform: translate3d(-11%, -1%, 0); }
}

/* Contenu */
.hero-content {
  position: relative; z-index: 1;
  width: min(620px, calc(100vw - 4rem));
  max-width: 620px;
  padding: 0 1.5rem 0 clamp(1.5rem, 5vw, 5rem);
  box-sizing: border-box;
}
.hero-eyebrow {
  font-family: var(--font-head); font-size: clamp(.9rem, 1.3vw, 1.1rem);
  letter-spacing: .32em; text-transform: uppercase;
  color: #fff;
  text-shadow: 0 1px 8px rgba(0,0,0,.8);
  margin-bottom: 1.2rem;
}
.hero-title {
  font-family: var(--font-head); font-weight: 600;
  font-size: clamp(2.1rem, 4vw, 3.55rem);
  line-height: 1.08; letter-spacing: .035em;
  max-width: 100%; overflow-wrap: normal;
  color: #fff;
  text-shadow: 0 2px 40px rgba(0,0,0,.6);
  margin-bottom: 1.6rem;
}
.hero-title em {
  font-style: normal;
  color: var(--gold-light);
  text-shadow: 0 0 40px rgba(201,165,84,.4), 0 2px 40px rgba(0,0,0,.6);
}
.hero-sub {
  font-family: var(--font-body); font-weight: 300;
  font-size: clamp(.88rem, 1.15vw, 1rem);
  line-height: 1.8; letter-spacing: .06em;
  color: rgba(255,255,255,.72);
  margin-bottom: 2.4rem; max-width: 560px;
}
.hero-potions {
  font-weight: 700;
  background: linear-gradient(90deg, #e8c97a 0%, #fff6d6 35%, #c9a554 55%, #f0d898 75%, #b8922e 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  background-size: 200% auto;
  animation: chromaShimmer 3s linear infinite;
}
@keyframes chromaShimmer {
  0%   { background-position: 0% center; }
  100% { background-position: 200% center; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-potions { animation: none; background-position: 0% center; }
}
.hero-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-head); font-size: clamp(.65rem, 1vw, .78rem);
  letter-spacing: .28em; text-indent: .28em; text-transform: uppercase;
  color: var(--bg); background: var(--gold);
  padding: 1.1rem 2.8rem;
  transition: background .3s, transform .15s;
  position: relative; overflow: hidden;
}
.hero-cta::after {
  content: ''; position: absolute; top: 0; left: -100%;
  width: 60%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.3), transparent);
  animation: shimmer 3s ease-in-out infinite;
}
.hero-cta:hover { background: var(--gold-light); color: var(--bg); box-shadow: 0 0 24px rgba(201,165,84,.45); }
@keyframes shimmer { 0% { left: -100%; } 50% { left: 120%; } 100% { left: 120%; } }

/* Scroll hint */
.scroll-hint {
  position: absolute; bottom: 2rem; right: 5vw; z-index: 1;
  opacity: .4; animation: bob 2s ease-in-out infinite;
  color: var(--gold);
}
.scroll-hint svg { width: 20px; height: 20px; }
@keyframes bob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(6px); } }

/* ═══════════════════════════════
   SECTION GUARANTEES
   ═══════════════════════════════ */
.section-guarantees {
  background: rgba(201,165,84,.04);
  border-top: 1px solid rgba(201,165,84,.12);
  border-bottom: 1px solid rgba(201,165,84,.12);
  position: relative; z-index: 2;
}
.section-guarantees,
.section-why,
.section-potions,
.section-science,
.section-almanach,
.section-founder,
.section-craft,
.section-newsletter {
  box-shadow: inset 0 1px rgba(232,201,122,.08), inset 0 -1px rgba(0,0,0,.55);
}

/* Sections visibles par défaut — le JS ajoute .will-reveal avant d'observer */
.section-guarantees,
.section-why,
.section-potions,
.section-science,
.section-craft,
.section-almanach,
.section-founder,
.section-newsletter {
  transition: opacity .8s ease, transform .8s cubic-bezier(.22,1,.36,1);
}
/* État caché : seulement si JS a pu s'exécuter */
.section-guarantees.will-reveal,
.section-why.will-reveal,
.section-potions.will-reveal,
.section-science.will-reveal,
.section-craft.will-reveal,
.section-almanach.will-reveal,
.section-founder.will-reveal,
.section-newsletter.will-reveal {
  opacity: 0;
  transform: translateY(18px);
}
/* Visible : override will-reveal */
.section-guarantees.is-visible,
.section-why.is-visible,
.section-potions.is-visible,
.section-science.is-visible,
.section-craft.is-visible,
.section-almanach.is-visible,
.section-founder.is-visible,
.section-newsletter.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.section-guarantees::after,
.section-why::after,
.section-potions::after,
.section-science::after,
.section-craft::after,
.section-almanach::after,
.section-founder::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 0;
  width: min(760px, 82vw);
  height: 1px;
  transform: translateX(-50%) scaleX(0);
  transform-origin: center;
  background: linear-gradient(90deg, transparent, rgba(232,201,122,.58), transparent);
  transition: transform 1.1s cubic-bezier(.22,1,.36,1);
  pointer-events: none;
}
.section-guarantees.is-visible::after,
.section-why.is-visible::after,
.section-potions.is-visible::after,
.section-science.is-visible::after,
.section-craft.is-visible::after,
.section-almanach.is-visible::after,
.section-founder.is-visible::after {
  transform: translateX(-50%) scaleX(1);
}
.guarantees-inner {
  max-width: 1100px; margin: 0 auto;
  padding: 4rem 2rem;
}
.guarantees-title {
  font-family: var(--font-head); font-weight: 400;
  font-size: clamp(.75rem, 1.5vw, .95rem);
  letter-spacing: .3em; text-transform: uppercase;
  color: var(--gold-light); text-align: center;
  margin-bottom: 3rem;
}
.guarantees-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 0;
}
.guarantee-item {
  display: flex; gap: 1.4rem; align-items: flex-start;
  padding: 1.8rem 2.5rem;
  border-right: 1px solid rgba(201,165,84,.1);
}
.guarantee-item:last-child { border-right: none; }
.gi-icon {
  flex-shrink: 0; width: 44px; height: 44px;
  color: var(--gold);
}
.gi-icon svg { width: 100%; height: 100%; }
.gi-title {
  font-family: var(--font-head); font-size: .82rem;
  letter-spacing: .18em; text-transform: uppercase;
  color: #f0d88c; margin-bottom: .6rem;
}
.gi-desc {
  font-family: var(--font-body); font-weight: 400;
  font-size: .95rem; line-height: 1.75;
  color: rgba(232,222,202,.92); letter-spacing: .02em;
}

/* ═══════════════════════════════
   SECTION WHY
   ═══════════════════════════════ */
.section-why {
  position: relative; z-index: 2;
  background:
    linear-gradient(rgba(8,11,22,.85), rgba(8,11,22,.85)),
    repeating-linear-gradient(
      45deg,
      rgba(201,165,84,.015) 0px,
      rgba(201,165,84,.015) 1px,
      transparent 1px,
      transparent 12px
    );
  border-bottom: 1px solid rgba(201,165,84,.08);
}
.why-inner {
  max-width: 1100px; margin: 0 auto;
  padding: 5rem 2rem;
  display: flex; flex-direction: column; gap: 3rem;
}
.why-text {
  max-width: 860px;
  margin: 0 auto;
  text-align: center;
}
.why-kicker {
  display: block;
  font-family: var(--font-head);
  font-size: clamp(.75rem, 1.2vw, .92rem);
  letter-spacing: .32em;
  text-transform: uppercase;
  color: rgba(201,165,84,.72);
  margin-bottom: 1.4rem;
}
.why-title {
  font-family: var(--font-head); font-weight: 600;
  font-size: clamp(1.4rem, 2.4vw, 1.9rem);
  letter-spacing: .06em; line-height: 1.3;
  color: var(--gold-light); margin-bottom: 1.2rem;
}
.why-desc {
  font-family: var(--font-body);
  font-weight: 300;
  font-style: normal;
  font-size: clamp(.95rem, 1.4vw, 1.1rem);
  line-height: 1.7;
  letter-spacing: .06em;
  color: rgba(232,222,202,.7);
  margin: 0;
}
.why-desc-line {
  white-space: nowrap;
}
@media (max-width: 760px) {
  .why-desc-line {
    white-space: normal;
  }
}
/* ── Rituel : parallax premium piloté par GSAP ── */
.ritual {
  --ritual-red: #b42024;
  --ritual-red-hot: #f04b45;
  --ritual-bottle-x: 58%;
  --ritual-bottle-y: 48%;
  --ritual-bottle-w: clamp(270px, 28vw, 410px);
  position: relative;
  width: min(1120px, 100%);
  /* Hauteur gérée par le pin GSAP (insertion d'un pin-spacer en JS). */
  height: auto;
  margin: 1.2rem auto 0;
}

.ritual::before {
  content: '';
  position: absolute;
  inset: 0 calc(50% - 50vw);
  background:
    radial-gradient(ellipse 64% 30% at 66% 42%, rgba(180,32,36,.14), transparent 70%),
    radial-gradient(ellipse 52% 24% at 24% 48%, rgba(201,165,84,.10), transparent 68%),
    linear-gradient(180deg, rgba(8,7,20,0), rgba(8,7,20,.9) 11%, #080714 38%, #080714 72%, rgba(8,7,20,.2));
  pointer-events: none;
}

/* Conteneur de la scène parallax — pinned via ScrollTrigger côté JS. */
.ritual-sticky {
  position: relative;
  z-index: 1;
  height: 100svh;
  min-height: 620px;
  display: grid;
  grid-template-columns: minmax(260px, 340px) minmax(420px, 1fr);
  align-items: center;
  gap: clamp(2rem, 7vw, 6rem);
  padding: clamp(4.8rem, 9svh, 7rem) clamp(1rem, 3vw, 2rem) clamp(2rem, 5svh, 4rem);
  overflow: hidden;
}

.ritual-copy {
  position: relative;
  z-index: 3;
  max-width: 34ch;
}

.ritual-act-kicker {
  display: block;
  font-family: var(--font-head);
  font-size: .68rem;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: rgba(201,165,84,.68);
  margin-bottom: 1.05rem;
}

.ritual-act-title {
  font-family: var(--font-head);
  font-weight: 600;
  font-size: clamp(1.65rem, 3vw, 2.45rem);
  line-height: 1.12;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #f3df9d;
  text-shadow: 0 0 28px rgba(201,165,84,.22);
  margin: 0 0 1rem;
}

.ritual-act-text {
  min-height: 7.4em;
  font-family: var(--font-body);
  font-weight: 300;
  font-size: .95rem;
  line-height: 1.8;
  letter-spacing: .04em;
  color: rgba(232,222,202,.72);
  margin: 0;
}

.ritual-act-list {
  display: grid;
  gap: .78rem;
  margin-top: 2rem;
}

.ritual-act-list span {
  display: block;
  font-family: var(--font-head);
  font-weight: 600;
  font-size: clamp(.95rem, 1.45vw, 1.42rem);
  line-height: 1.02;
  letter-spacing: .11em;
  text-transform: uppercase;
  color: rgba(201,165,84,.34);
  transform: translateX(0);
  transition: color .3s ease, text-shadow .3s ease, transform .3s ease;
}

.ritual-act-list span.is-active {
  color: var(--gold-light);
  text-shadow: 0 0 18px rgba(201,165,84,.30);
  transform: translateX(.32rem);
}

.ritual-stage {
  position: relative;
  z-index: 2;
  height: min(74svh, 700px);
  min-height: 500px;
  isolation: isolate;
}

.ritual-stage::before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: 7%;
  width: min(520px, 78%);
  height: 52px;
  transform: translateX(-50%);
  background: radial-gradient(ellipse, rgba(0,0,0,.76), transparent 70%);
  filter: blur(8px);
  opacity: .86;
}

.ritual-aura {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(600px, 86%);
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.ritual-aura-gold {
  background: radial-gradient(circle, rgba(201,165,84,.15), transparent 66%);
  filter: blur(20px);
  opacity: .72;
}

.ritual-aura-red {
  background: radial-gradient(circle, rgba(203,28,33,.34), transparent 62%);
  filter: blur(28px);
  opacity: 0;
  mix-blend-mode: screen;
}

.ritual-asset {
  position: absolute;
  display: block;
  width: auto;
  max-width: none;
  user-select: none;
  pointer-events: none;
  transform-origin: 50% 50%;
  /* Seulement transform + opacity : GPU-cheap. filter/clip-path en will-change
     créent une couche par asset, trop lourd pour les GPU mobiles modestes. */
  will-change: transform, opacity;
  filter: drop-shadow(0 24px 30px rgba(0,0,0,.55));
}

.ritual-asset.is-missing {
  display: none;
}

.ritual-doypack {
  left: 2%;
  top: 24%;
  width: clamp(235px, 26vw, 360px);
  z-index: 4;
}

.ritual-spoon {
  left: 30%;
  top: 43%;
  width: clamp(190px, 22vw, 320px);
  z-index: 7;
}

.ritual-spoon-powder,
.ritual-spoon-spill {
  opacity: 0;
}

.ritual-spoon-spill {
  z-index: 10;
}

.ritual-bottle {
  left: var(--ritual-bottle-x);
  top: var(--ritual-bottle-y);
  width: var(--ritual-bottle-w);
  height: auto;
  z-index: 5;
  transform: translate(-50%, -50%);
}

.ritual-bottle-empty {
  opacity: 0;
}

.ritual-bottle-red {
  opacity: 0;
  z-index: 9;
  filter:
    drop-shadow(0 24px 30px rgba(0,0,0,.62))
    drop-shadow(0 0 32px rgba(188,31,37,.18));
}

.ritual-powder-stream {
  left: calc(var(--ritual-bottle-x) + .35%);
  top: 22%;
  width: clamp(58px, 6.2vw, 96px);
  z-index: 8;
  opacity: 0;
  transform: translate(-50%, -10%);
  mix-blend-mode: screen;
  filter: none;
}

.ritual-powder-stream::before {
  content: '';
  position: absolute;
  inset: -10% 0 42%;
  background: url('../img/rituel/powder-stream.png') center top / 100% auto no-repeat;
  opacity: .62;
  filter: blur(8px);
  mix-blend-mode: screen;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, rgba(0,0,0,.72) 42%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 0%, rgba(0,0,0,.72) 42%, transparent 100%);
}

.ritual-powder-stream-img {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 16px 18px rgba(0,0,0,.35));
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.38) 11%, #000 25%);
  mask-image: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.38) 11%, #000 25%);
}

.ritual-water-wrap {
  position: absolute;
  left: var(--ritual-bottle-x);
  top: var(--ritual-bottle-y);
  width: var(--ritual-bottle-w);
  transform: translate(-50%, -50%);
  z-index: 6;
  opacity: 0;
  clip-path: inset(100% 0 0 0);
  overflow: hidden;
  will-change: clip-path, opacity;
}

.ritual-water {
  position: relative;
  width: 100%;
  filter: drop-shadow(0 16px 22px rgba(0,0,0,.4));
  opacity: .88;
}

.ritual-aquarelle {
  left: var(--ritual-bottle-x);
  top: var(--ritual-bottle-y);
  width: calc(var(--ritual-bottle-w) * 1.22);
  z-index: 7;
  opacity: 0;
  transform: translate(-50%, -50%) scale(.46) rotate(-8deg);
  mix-blend-mode: screen;
  filter:
    saturate(1.18)
    contrast(1.08)
    drop-shadow(0 0 24px rgba(211,33,40,.34));
}

.ritual-particles {
  position: absolute;
  left: var(--ritual-bottle-x);
  top: 49%;
  width: calc(var(--ritual-bottle-w) * 1.25);
  height: calc(var(--ritual-bottle-w) * 1.25);
  z-index: 8;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.ritual-particles span {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 4px;
  height: 4px;
  border-radius: 999px;
  background: #ff7768;
  opacity: 0;
  box-shadow: 0 0 13px rgba(255,79,66,.72);
}

.ritual-particles span:nth-child(1) { --tx: -78px; --ty: -92px; }
.ritual-particles span:nth-child(2) { --tx: 84px; --ty: -72px; }
.ritual-particles span:nth-child(3) { --tx: -110px; --ty: 8px; }
.ritual-particles span:nth-child(4) { --tx: 116px; --ty: 24px; }
.ritual-particles span:nth-child(5) { --tx: -52px; --ty: 84px; }
.ritual-particles span:nth-child(6) { --tx: 44px; --ty: 96px; }
.ritual-particles span:nth-child(7) { --tx: -28px; --ty: -132px; }
.ritual-particles span:nth-child(8) { --tx: 136px; --ty: -10px; }
.ritual-particles span:nth-child(9) { --tx: -138px; --ty: 52px; }
.ritual-particles span:nth-child(10) { --tx: 18px; --ty: -104px; }
.ritual-particles span:nth-child(11) { --tx: -96px; --ty: -36px; }
.ritual-particles span:nth-child(12) { --tx: 92px; --ty: 82px; }

.ritual-bottle-glow {
  position: absolute;
  left: var(--ritual-bottle-x);
  top: 49%;
  width: calc(var(--ritual-bottle-w) * 1.12);
  aspect-ratio: 1 / 1.25;
  z-index: 4;
  opacity: 0;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(225,32,39,.38), rgba(225,32,39,.12) 34%, transparent 68%);
  filter: blur(18px);
  mix-blend-mode: screen;
  pointer-events: none;
}

.ritual-complete-svg {
  position: absolute;
  left: calc(var(--ritual-bottle-x) + 1.4%);
  top: calc(var(--ritual-bottle-y) + 5.5%);
  width: calc(var(--ritual-bottle-w) * .56);
  height: auto;
  z-index: 12;
  opacity: 0;
  transform: translate(-50%, -50%) scale(.86);
  transition: opacity .65s ease, transform .9s cubic-bezier(.22,1,.36,1);
  pointer-events: none;
  overflow: visible;
  mix-blend-mode: screen;
}

.ritual.is-complete .ritual-complete-svg {
  opacity: .82;
  transform: translate(-50%, -50%) scale(1);
}

.complete-svg-spark {
  fill: rgba(248,232,170,.62);
  stroke: none;
  transform-box: fill-box;
  transform-origin: center;
  opacity: 0;
  filter:
    drop-shadow(0 0 4px rgba(248,232,170,.42))
    drop-shadow(0 0 12px rgba(201,165,84,.22));
}

.ritual.is-complete .complete-svg-spark {
  animation: ritualSparkTwinkle 4s cubic-bezier(.4,0,.6,1) infinite;
}

.complete-svg-spark.s1 { animation-delay: .2s; }
.complete-svg-spark.s2 { animation-delay: 1.5s; }
.complete-svg-spark.s3 { animation-delay: .85s; }
.complete-svg-spark.s4 { animation-delay: 2.4s; }
.complete-svg-spark.s5 { animation-delay: 1.15s; }
.complete-svg-spark.s6 { animation-delay: 2.05s; }

@keyframes ritualSparkTwinkle {
  0%, 100% { opacity: 0;   transform: scale(.3)  rotate(-8deg); }
  20%      { opacity: .75; transform: scale(1)   rotate(0deg); }
  46%      { opacity: .35; transform: scale(.78) rotate(4deg); }
  68%      { opacity: .65; transform: scale(.92) rotate(-2deg); }
  84%      { opacity: .18; transform: scale(.6)  rotate(2deg); }
}

.complete-svg-dot {
  fill: rgba(248,232,170,.42);
  transform-box: fill-box;
  transform-origin: center;
  opacity: 0;
  filter:
    drop-shadow(0 0 3px rgba(248,232,170,.36))
    drop-shadow(0 0 8px rgba(201,165,84,.18));
}

.ritual.is-complete .complete-svg-dot {
  animation: ritualDotTwinkle 4.6s ease-in-out infinite;
}

.complete-svg-dot.d1 { animation-delay: .6s; }
.complete-svg-dot.d2 { animation-delay: 2.3s; }
.complete-svg-dot.d3 { animation-delay: 1.4s; }

@keyframes ritualDotTwinkle {
  0%, 100% { opacity: 0;   transform: scale(.4); }
  50%      { opacity: .6;  transform: scale(1); }
}

.ritual-scroll-meter {
  --meter-label-gap: .82rem;
  --meter-label-width: 2.4ch;
  position: absolute;
  right: clamp(3.25rem, 5vw, 4.5rem);
  top: 50%;
  z-index: 4;
  width: 1px;
  height: min(340px, 44vh);
  transform: translateY(-50%);
  background: linear-gradient(180deg, transparent, rgba(201,165,84,.28), transparent);
  overflow: visible;
}

.ritual-scroll-meter [data-ritual-progress] {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 0;
  background: linear-gradient(180deg, #f0d98a, #e9423e);
  box-shadow: 0 0 12px rgba(233,66,62,.6);
}

.ritual-scroll-node {
  position: absolute;
  left: 50%;
  top: var(--node-y);
  width: 9px;
  height: 9px;
  border-radius: 999px;
  transform: translate(-50%, -50%);
  background: #080714;
  border: 1px solid rgba(201,165,84,.52);
  box-shadow: 0 0 0 4px rgba(8,7,20,.9), 0 0 14px rgba(201,165,84,.12);
  transition: background .28s ease, border-color .28s ease, box-shadow .28s ease, transform .28s ease;
}

.ritual-scroll-node::after {
  content: attr(data-label);
  position: absolute;
  left: calc(100% + var(--meter-label-gap));
  top: 50%;
  width: var(--meter-label-width);
  transform: translateY(-50%);
  font-family: var(--font-head);
  font-size: .68rem;
  line-height: 1;
  letter-spacing: .12em;
  text-align: left;
  color: rgba(201,165,84,.34);
  transition: color .28s ease, text-shadow .28s ease;
  white-space: nowrap;
  pointer-events: none;
}

.ritual-scroll-node.is-complete {
  background: rgba(201,165,84,.78);
  border-color: rgba(240,216,140,.78);
  box-shadow: 0 0 0 4px rgba(8,7,20,.9), 0 0 16px rgba(201,165,84,.22);
}

.ritual-scroll-node.is-active {
  background: #f0d98a;
  border-color: #f6e8b3;
  transform: translate(-50%, -50%) scale(1.28);
  box-shadow: 0 0 0 4px rgba(8,7,20,.92), 0 0 20px rgba(240,216,140,.44);
}

.ritual-scroll-node.is-active::after {
  color: var(--gold-light);
  text-shadow: 0 0 12px rgba(201,165,84,.34);
}

/* Timeline verticale du rituel : utilisée comme version mobile (où le parallax
   scroll-driven causait des tremblements) et comme fallback no-JS / reduced-motion.
   Visible UNIQUEMENT quand .ritual a la classe .is-static (ajoutée par JS sur mobile
   ou quand GSAP/ScrollTrigger échouent à charger). */
.ritual-static {
  display: none;
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
}

/* Fil doré vertical qui relie les actes (timeline) */
.ritual-static::before {
  content: '';
  position: absolute;
  left: calc(2.4rem + 32px);          /* centré sous les visuels (visual = 64px de large + offset) */
  top: 60px;
  bottom: 60px;
  width: 1px;
  background: linear-gradient(180deg,
    transparent 0%,
    rgba(201,165,84,.32) 8%,
    rgba(201,165,84,.32) 92%,
    transparent 100%);
  pointer-events: none;
}

.ritual-static-act {
  display: grid;
  grid-template-columns: minmax(64px, 80px) 1fr;
  gap: clamp(1rem, 4vw, 1.6rem);
  align-items: center;
  padding: 1.4rem 0;
  position: relative;
}

.ritual-static-visual {
  position: relative;
  width: 64px;
  aspect-ratio: 1 / 1;
  margin-left: 2.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  /* Halo doré derrière le visuel */
  background: radial-gradient(circle at center,
    rgba(201,165,84,.18) 0%,
    rgba(201,165,84,.06) 50%,
    transparent 75%);
  border-radius: 50%;
  z-index: 1;
}

/* Cercle doré qui marque le nœud sur la timeline */
.ritual-static-visual::before {
  content: '';
  position: absolute;
  inset: -6px;
  border: 1px solid rgba(201,165,84,.35);
  border-radius: 50%;
  z-index: -1;
}

.ritual-static-visual picture,
.ritual-static-visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 6px 12px rgba(0,0,0,.55));
}

.ritual-static-content {
  min-width: 0;            /* empêche le text d'overflow le grid */
}

.ritual-static-kicker {
  display: block;
  font-family: var(--font-head);
  font-size: .62rem;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: rgba(201,165,84,.62);
  margin-bottom: .5rem;
}

.ritual-static-title {
  font-family: var(--font-head);
  font-weight: 600;
  font-size: 1.15rem;
  line-height: 1.15;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold-light);
  text-shadow: 0 0 14px rgba(201,165,84,.18);
  margin: 0 0 .55rem;
}

.ritual-static-text {
  font-family: var(--font-body);
  font-weight: 300;
  font-size: .9rem;
  line-height: 1.65;
  letter-spacing: .03em;
  color: rgba(232,222,202,.78);
  margin: 0;
}

/* IMPORTANT : la section du rituel ne doit porter aucun transform, sinon elle casse
   le sticky de la scène parallax. Elle garde son fondu d'opacité. */
.section-why.will-reveal,
.section-why.is-visible { transform: none; }

@media (prefers-reduced-motion: reduce) {
  .ritual {
    height: auto;
    min-height: 0;
  }

  .ritual::before,
  .ritual-sticky {
    display: none;
  }

  .ritual-static {
    display: grid;
  }
}

.ritual.is-static {
  height: auto;
  min-height: 0;
}

.ritual.is-static::before,
.ritual.is-static .ritual-sticky {
  display: none;
}

.ritual.is-static .ritual-static {
  display: grid;
}

/* ═══════════════════════════════
   SECTION POTIONS
   ═══════════════════════════════ */
.section-potions {
  position: relative; z-index: 2;
  background: var(--bg);
}
.potions-inner {
  max-width: 1140px; margin: 0 auto;
  padding: 6rem 2rem;
}
.potions-heading {
  font-family: var(--font-head); font-weight: 400;
  font-size: clamp(.8rem, 1.6vw, 1rem);
  letter-spacing: .35em; text-transform: uppercase;
  color: var(--gold-light); text-align: center;
  margin-bottom: 1.2rem;
}
.ornament {
  display: block;
  pointer-events: none;
  user-select: none;
}
.ornament-divider {
  width: min(500px, 52vw);
  margin: .1rem auto 2.9rem;
  opacity: .22;
  filter: drop-shadow(0 0 16px rgba(201,165,84,.06));
}
.ornament-divider-dark {
  animation: celestialBreathe 7.5s ease-in-out infinite alternate;
}
@keyframes celestialBreathe {
  from { opacity: .22; filter: drop-shadow(0 0 4px rgba(201,165,84,.06)) drop-shadow(0 0 0px rgba(201,165,84,0)) brightness(.88); }
  to   { opacity: .38; filter: drop-shadow(0 0 22px rgba(201,165,84,.55)) drop-shadow(0 0 7px rgba(201,165,84,.28)) brightness(1.13); }
}
@media (prefers-reduced-motion: reduce) {
  .ornament-divider-dark { animation: none; }
}

/* Grille potions */
.potions-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem; margin-bottom: 3rem;
}

/* Carte potion */
.p-card {
  cursor: pointer;
  background:
    linear-gradient(180deg, rgba(13,17,30,.94), rgba(5,7,16,.98)),
    radial-gradient(ellipse 80% 36% at 50% 0%, var(--p-accent-soft, rgba(201,165,84,.06)), transparent 70%);
  border: 1px solid rgba(201,165,84,.15);
  border-radius: 8px;
  display: flex; flex-direction: column;
  transition: border-color .4s, transform .4s, box-shadow .4s;
  position: relative; overflow: hidden;
}
.p-card::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse 80% 50% at 50% 0%, rgba(201,165,84,.04), transparent 60%);
  pointer-events: none;
}
.p-card::after {
  content: '';
  position: absolute;
  inset: -40%;
  background:
    radial-gradient(circle at var(--mx, 50%) var(--my, 50%), var(--ink, var(--ink-gold)), transparent 28%),
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.045), transparent 18%);
  opacity: 0;
  transform: scale(.96);
  transition: opacity .45s ease, transform .7s ease;
  pointer-events: none;
  mix-blend-mode: screen;
}
.p-card:hover::after {
  opacity: 1;
  transform: scale(1);
}
.p-card[data-potion="vita"]  { --pc: rgba(196,43,43,.5); --pcs: rgba(196,43,43,.12); }
.p-card[data-potion="mana"]  { --pc: rgba(59,111,212,.5); --pcs: rgba(59,111,212,.12); }
.p-card[data-potion="vigor"] { --pc: rgba(45,140,78,.5); --pcs: rgba(45,140,78,.12); }
.p-card[data-potion="vita"]  { --p-accent: #c43a3a; --p-accent-soft: rgba(196,58,58,.18); }
.p-card[data-potion="mana"]  { --p-accent: #5d8fe8; --p-accent-soft: rgba(93,143,232,.18); }
.p-card[data-potion="vigor"] { --p-accent: #56c77a; --p-accent-soft: rgba(86,199,122,.18); }
.p-card[data-potion="vita"]  { --ink: var(--ink-red); }
.p-card[data-potion="mana"]  { --ink: var(--ink-blue); }
.p-card[data-potion="vigor"] { --ink: var(--ink-green); }

.p-card:hover {
  border-color: var(--pc);
  transform: translateY(-6px);
  box-shadow: 0 20px 60px rgba(0,0,0,.5), 0 0 30px var(--pcs);
}

/* Header carte */
.p-card-header {
  padding: 1.6rem 1.55rem 1.25rem;
  display: flex; flex-direction: column; align-items: center; gap: 1.2rem;
  border-bottom: 1px solid rgba(201,165,84,.1);
  background:
    radial-gradient(ellipse 64% 36% at 50% 42%, var(--p-accent-soft, rgba(201,165,84,.08)), transparent 72%);
}
.p-bottle-wrap {
  position: relative;
  width: 100%;
  display: grid;
  place-items: center;
}
.p-bottle-placeholder {
  width: 92px;
  height: 146px;
  margin: 0 auto;
  position: relative;
  isolation: isolate;
  display: grid;
  place-items: center;
  filter: drop-shadow(0 0 20px var(--pc, rgba(201,165,84,.3)));
  transition: filter .4s;
}
.p-card:hover .p-bottle-placeholder {
  filter: drop-shadow(0 0 32px var(--pc, rgba(201,165,84,.5)));
}
.p-bottle-placeholder svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.potion-svg-vita .potion-liquid-wave,
.potion-svg-vita .potion-liquid-spark,
.potion-svg-mana .mana-liquid-wave,
.potion-svg-mana .mana-spark,
.potion-svg-vigor .vigor-liquid-wave,
.potion-svg-vigor .vigor-spark {
  transform-box: fill-box;
  transform-origin: center;
  will-change: transform, opacity;
}
.potion-svg-vita .potion-liquid-wave-a {
  animation: vitaLiquidSwayA 5.8s ease-in-out infinite;
}
.potion-svg-vita .potion-liquid-wave-b {
  animation: vitaLiquidSwayB 7.2s ease-in-out infinite reverse;
}
.potion-svg-vita .potion-liquid-spark {
  animation: vitaSparkRise 5.6s ease-in-out infinite;
}
.potion-svg-vita .potion-liquid-spark.s2 {
  animation-delay: .9s;
}
.potion-svg-vita .potion-liquid-spark.s3 {
  animation-delay: 1.65s;
}
.potion-svg-mana .mana-liquid-wave-a {
  animation: manaLiquidSwayA 6.1s ease-in-out infinite;
}
.potion-svg-mana .mana-liquid-wave-b {
  animation: manaLiquidSwayB 7.8s ease-in-out infinite reverse;
}
.potion-svg-mana .mana-spark {
  animation: manaSparkDrift 5.4s ease-in-out infinite;
}
.potion-svg-mana .mana-spark.s2 {
  animation-delay: .9s;
}
.potion-svg-mana .mana-spark.s3 {
  animation-delay: 1.7s;
}
.potion-svg-mana .mana-spark.s4 {
  animation-delay: 2.4s;
}
.potion-svg-vigor .vigor-liquid-wave-a {
  animation: vigorLiquidSwayA 6.3s ease-in-out infinite;
}
.potion-svg-vigor .vigor-liquid-wave-b {
  animation: vigorLiquidSwayB 7.9s ease-in-out infinite reverse;
}
.potion-svg-vigor .vigor-spark {
  animation: vigorSparkDrift 5.7s ease-in-out infinite;
}
.potion-svg-vigor .vigor-spark.s2 {
  animation-delay: .85s;
}
.potion-svg-vigor .vigor-spark.s3 {
  animation-delay: 1.6s;
}
.potion-svg-vigor .vigor-spark.s4 {
  animation-delay: 2.35s;
}

@keyframes vitaLiquidSwayA {
  0%, 100% {
    transform: translate3d(-7px, 0, 0) rotate(-1deg);
  }
  50% {
    transform: translate3d(8px, -2px, 0) rotate(1deg);
  }
}
@keyframes vitaLiquidSwayB {
  0%, 100% {
    transform: translate3d(7px, 1px, 0) rotate(1.2deg);
  }
  50% {
    transform: translate3d(-8px, -1px, 0) rotate(-1deg);
  }
}
@keyframes vitaSparkRise {
  0%, 100% {
    opacity: .3;
    transform: translate3d(0, 6px, 0) scale(.82);
  }
  42% {
    opacity: .84;
    transform: translate3d(2px, -5px, 0) scale(1.08);
  }
  70% {
    opacity: .46;
    transform: translate3d(-1px, -1px, 0) scale(.94);
  }
}
@keyframes manaLiquidSwayA {
  0%, 100% {
    transform: translate3d(-8px, 0, 0) rotate(-.8deg);
  }
  50% {
    transform: translate3d(7px, -2px, 0) rotate(.8deg);
  }
}
@keyframes manaLiquidSwayB {
  0%, 100% {
    transform: translate3d(7px, 1px, 0) rotate(.5deg);
  }
  50% {
    transform: translate3d(-8px, -1px, 0) rotate(-.5deg);
  }
}
@keyframes manaSparkDrift {
  0%, 100% {
    opacity: .16;
    transform: translate3d(0, 4px, 0) scale(.8);
  }
  45% {
    opacity: .48;
    transform: translate3d(1px, -4px, 0) scale(1.08);
  }
}
@keyframes vigorLiquidSwayA {
  0%, 100% {
    transform: translate3d(-7px, 0, 0) rotate(-.7deg);
  }
  50% {
    transform: translate3d(8px, -2px, 0) rotate(.7deg);
  }
}
@keyframes vigorLiquidSwayB {
  0%, 100% {
    transform: translate3d(7px, 1px, 0) rotate(.45deg);
  }
  50% {
    transform: translate3d(-8px, -1px, 0) rotate(-.45deg);
  }
}
@keyframes vigorSparkDrift {
  0%, 100% {
    opacity: .16;
    transform: translate3d(0, 4px, 0) scale(.8);
  }
  45% {
    opacity: .48;
    transform: translate3d(1px, -4px, 0) scale(1.08);
  }
}

.p-card-title-wrap { text-align: center; }
.p-name {
  font-family: var(--font-head); font-weight: 600;
  font-size: clamp(1.02rem, 1.6vw, 1.18rem);
  letter-spacing: .1em; margin-bottom: .48rem;
  text-shadow: 0 0 14px color-mix(in srgb, var(--p-accent) 32%, transparent);
}
.vita-color  { color: #e05050; }
.mana-color  { color: #6090e8; }
.vigor-color { color: #50c070; }

.p-discipline {
  font-family: var(--font-head); font-size: .68rem;
  letter-spacing: .14em; text-transform: uppercase;
  line-height: 1.5;
  color: rgba(236,226,202,.82);
}

/* Corps carte */
.p-card-body {
  padding: 1.25rem 1.45rem;
  flex: 1;
}
.p-ingredients {
  font-family: var(--font-body);
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
  line-height: 1.3;
  border-top: 1px solid rgba(201,165,84,.1);
  border-bottom: 1px solid rgba(201,165,84,.1);
  padding: .78rem 0;
  margin-bottom: 1rem;
  text-align: center;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .36rem;
}
.p-ingredients span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  min-width: 0;
  padding: .34rem .36rem .31rem;
  border: 1px solid color-mix(in srgb, var(--p-accent) 38%, transparent);
  border-radius: 5px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--p-accent) 15%, transparent), color-mix(in srgb, var(--p-accent) 6%, transparent));
  color: color-mix(in srgb, var(--p-accent) 68%, #fff4d8);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 0 14px color-mix(in srgb, var(--p-accent) 12%, transparent);
  white-space: nowrap;
}
.p-benefits {
  list-style: none;
  font-family: var(--font-body); font-weight: 400;
  font-size: .86rem; line-height: 1.58; letter-spacing: .01em;
  color: rgba(242,236,220,.9);
  display: grid;
  gap: .58rem;
}
.p-benefits li { display: flex; align-items: flex-start; gap: .6rem; }
.p-benefits li::before {
  content: '';
  width: .42rem;
  height: .42rem;
  flex-shrink: 0;
  margin-top: .58em;
  transform: rotate(45deg);
  border-radius: 1px;
  background: var(--p-accent);
  box-shadow: 0 0 9px color-mix(in srgb, var(--p-accent) 55%, transparent);
}
.p-coffret {
  margin-top: 1rem;
  padding-top: .85rem;
  border-top: 1px solid rgba(201,165,84,.12);
  display: grid;
  gap: .4rem;
}
.p-coffret span {
  display: flex;
  align-items: center;
  gap: .55rem;
  font-family: var(--font-head);
  font-size: .68rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(240,216,140,.72);
}
.p-coffret span::before {
  content: '✧';
  color: var(--gold-light);
  text-shadow: 0 0 10px rgba(240,216,140,.28);
  flex-shrink: 0;
}

/* Footer carte */
.p-card-footer {
  padding: 1.2rem 1.45rem 1.35rem;
  display: flex; align-items: center; justify-content: space-between;
  border-top: 1px solid rgba(201,165,84,.1);
}
.p-price {
  font-family: var(--font-head); font-size: 1.2rem;
  letter-spacing: .08em; color: var(--gold-light);
}
.p-cta {
  min-width: 148px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-head); font-size: .8rem;
  letter-spacing: .18em; text-transform: uppercase;
  padding: .86rem 1.35rem .82rem;
  border-radius: 6px;
  color: #fff4d8;
  transition: background .25s, color .25s, border-color .25s, box-shadow .25s, transform .25s;
}
.vita-btn,
.mana-btn,
.vigor-btn {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--p-accent) 34%, rgba(255,255,255,.06)), color-mix(in srgb, var(--p-accent) 18%, rgba(0,0,0,.3)));
  border: 1px solid color-mix(in srgb, var(--p-accent) 62%, rgba(255,255,255,.16));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 12px 30px color-mix(in srgb, var(--p-accent) 16%, transparent);
}
.vita-btn:hover,
.mana-btn:hover,
.vigor-btn:hover {
  color: #fff9ea;
  border-color: color-mix(in srgb, var(--p-accent) 76%, rgba(255,255,255,.25));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--p-accent) 46%, rgba(255,255,255,.08)), color-mix(in srgb, var(--p-accent) 24%, rgba(0,0,0,.22)));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 16px 36px color-mix(in srgb, var(--p-accent) 24%, transparent);
  transform: translateY(-1px);
}

/* Pack Trinité Banner */
.pack-trinity-banner {
  display: flex; align-items: center; justify-content: space-between;
  padding: 2.5rem 3rem;
  border: 1px solid rgba(201,165,84,.2);
  background: rgba(201,165,84,.04);
  position: relative; overflow: hidden;
}
.pack-trinity-banner::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(to right, transparent, var(--gold), transparent);
}
.ornamented-block::after {
  content: "";
  position: absolute;
  right: -26px;
  top: -28px;
  width: 170px;
  height: 120px;
  background: url("../public/ornaments/ornament-corner.webp") no-repeat right top / contain;
  opacity: .2;
  filter: sepia(.45) saturate(.85) contrast(1.15);
  pointer-events: none;
}
.pt-badge {
  font-family: var(--font-head); font-size: .6rem;
  letter-spacing: .3em; text-transform: uppercase;
  color: rgba(201,165,84,.72); border: 1px solid rgba(201,165,84,.28);
  padding: .48rem 1rem; display: inline-block; margin-bottom: .8rem;
  position: relative; overflow: hidden;
  background: rgba(201,165,84,.035);
}
.pt-title {
  font-family: var(--font-head); font-weight: 600;
  font-size: clamp(1.2rem, 2vw, 1.6rem);
  letter-spacing: .08em; color: #fff; margin-bottom: .4rem;
}
.pt-sub {
  font-family: var(--font-body); font-weight: 300;
  font-size: .85rem; letter-spacing: .06em;
  color: rgba(201,165,84,.75);
}
.pt-right {
  display: flex; align-items: center; gap: 2rem; flex-shrink: 0;
}
.pt-price-new {
  font-family: var(--font-head); font-size: 2.4rem;
  color: var(--gold-light); letter-spacing: .04em;
}
.pt-price-old {
  font-family: var(--font-body); font-size: .9rem;
  color: rgba(201,165,84,.4); text-decoration: line-through;
}
.pt-cta {
  font-family: var(--font-head); font-size: .62rem;
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--bg); background: var(--gold);
  padding: 1rem 2rem;
  transition: background .25s;
}
.pt-cta:hover { background: var(--gold-light); color: var(--bg); }

.hero-cta,
.p-cta,
.pt-cta,
.almanach-cta,
.qb-cta,
.founder-form-row button,
.nl-form button {
  isolation: isolate;
  overflow: hidden;
  position: relative;
}
.hero-cta .seal-ripple,
.p-cta .seal-ripple,
.pt-cta .seal-ripple,
.almanach-cta .seal-ripple,
.qb-cta .seal-ripple,
.founder-form-row button .seal-ripple,
.nl-form button .seal-ripple {
  position: absolute;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 1px solid rgba(255,248,220,.65);
  background: radial-gradient(circle, rgba(255,248,220,.22), transparent 68%);
  transform: translate(-50%, -50%) scale(.2);
  opacity: .75;
  pointer-events: none;
  animation: sealPress .72s ease-out forwards;
  z-index: 0;
}
@keyframes sealPress {
  0% { transform: translate(-50%, -50%) scale(.2); opacity: .8; }
  45% { opacity: .5; }
  100% { transform: translate(-50%, -50%) scale(10); opacity: 0; }
}

/* ═══════════════════════════════
   SECTION SCIENCE
   ═══════════════════════════════ */
.section-science {
  position: relative;
  z-index: 2;
  overflow: hidden;
  background:
    radial-gradient(circle at 68% 21%, rgba(201,165,84,.13), transparent 17rem),
    radial-gradient(circle at 18% 28%, rgba(255,244,204,.055), transparent 18rem),
    linear-gradient(180deg, rgba(2,6,13,.96), rgba(5,9,17,.98) 58%, rgba(4,8,16,1)),
    repeating-linear-gradient(
      -45deg,
      rgba(201,165,84,.014) 0px,
      rgba(201,165,84,.014) 1px,
      transparent 1px,
      transparent 18px
    );
  border-top: 1px solid rgba(201,165,84,.08);
  border-bottom: 1px solid rgba(201,165,84,.08);
}
.section-proof::before,
.section-proof::after {
  content: '';
  position: absolute;
  pointer-events: none;
}
.section-proof::before {
  inset: 0;
  background-image:
    radial-gradient(circle, rgba(235,198,118,.55) 0 1px, transparent 1.6px),
    radial-gradient(circle, rgba(255,245,209,.24) 0 1px, transparent 1.4px);
  background-size: 132px 132px, 211px 211px;
  background-position: 18px 32px, 88px 7px;
  opacity: .2;
}
.section-proof::after {
  left: 3.1rem;
  top: 6.8rem;
  bottom: 8.5rem;
  width: 1px;
  height: auto;
  transform: none;
  transition: none;
  background: linear-gradient(transparent, rgba(201,165,84,.55) 9%, rgba(201,165,84,.18) 50%, rgba(201,165,84,.55) 91%, transparent);
}
.section-proof.is-visible::after {
  transform: none;
}
.science-inner {
  max-width: 1100px; margin: 0 auto;
  padding: 6rem 2rem;
}
.proof-inner { padding-top: 5rem; padding-bottom: 5rem; }
.science-header {
  text-align: center; margin-bottom: 3.5rem;
}
.proof-header { max-width: 760px; margin-left: auto; margin-right: auto; }
.proof-kicker {
  font-family: var(--font-head); font-size: clamp(.78rem, 1.35vw, 1rem);
  letter-spacing: .32em; text-transform: uppercase;
  color: rgba(201,165,84,.68); margin-bottom: 1rem;
}
.science-title {
  font-family: var(--font-head); font-weight: 400;
  font-size: clamp(1.25rem, 2.8vw, 2rem);
  letter-spacing: .3em; text-transform: uppercase;
  color: var(--gold-light); margin-bottom: .8rem;
}
.science-sub {
  font-family: var(--font-body); font-weight: 300;
  font-size: .9rem; letter-spacing: .06em;
  color: rgba(201,165,84,.7); line-height: 1.8;
}
.proof-layout {
  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  gap: 1.2rem; margin-bottom: 1.2rem;
}
.proof-main,
.proof-card {
  border: 1px solid rgba(201,165,84,.16);
  background: linear-gradient(145deg, rgba(201,165,84,.055), rgba(201,165,84,.018)), rgba(8,11,22,.42);
  position: relative;
}
.proof-main {
  min-height: 310px;
  padding: 2.8rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
}
.proof-ornament {
  position: absolute;
  right: 1.4rem;
  bottom: 1rem;
  width: min(190px, 30%);
  opacity: .18;
  filter: sepia(.22) saturate(.85) drop-shadow(0 0 14px rgba(201,165,84,.06));
  pointer-events: none;
}
.proof-stack { display: grid; grid-template-rows: 1fr 1fr; gap: 1.2rem; }
.proof-card { padding: 2rem; }
.proof-main::before,
.proof-card::before,
.trust-item::before {
  content: ''; position: absolute; inset: 10px;
  border: 1px solid rgba(201,165,84,.08); pointer-events: none;
}
.proof-step {
  position: relative;
  z-index: 2;
  font-family: var(--font-head); font-size: .66rem;
  letter-spacing: .24em; color: rgba(201,165,84,.65);
  display: inline-block; margin-bottom: 1rem;
}
.proof-main h3,
.proof-card h3 {
  position: relative;
  z-index: 2;
  font-family: var(--font-head); font-weight: 500;
  font-size: clamp(1.25rem, 2.4vw, 1.75rem);
  letter-spacing: .08em; color: var(--gold-light); margin-bottom: .8rem;
}
.proof-card h3 { font-size: 1.08rem; }
.proof-main p,
.proof-card p {
  position: relative;
  z-index: 2;
  font-family: var(--font-body); font-weight: 300;
  font-size: .98rem; line-height: 1.85;
  color: rgba(201,165,84,.78); letter-spacing: .035em;
}
.trust-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 0; border: 1px solid rgba(201,165,84,.16);
  border-bottom: 0; background: rgba(201,165,84,.025);
}
.trust-item {
  position: relative; min-height: 175px; padding: 1.7rem 1.5rem;
  border-right: 1px solid rgba(201,165,84,.12);
  display: flex; flex-direction: column; justify-content: center; text-align: center;
}
.trust-item:last-child { border-right: 0; }
.trust-mark {
  font-family: var(--font-head); font-size: 1.45rem;
  letter-spacing: .16em; color: var(--gold-light); margin-bottom: .8rem;
}
.trust-item p {
  font-family: var(--font-body); font-weight: 300;
  font-size: .8rem; line-height: 1.7; letter-spacing: .03em;
  color: rgba(201,165,84,.72);
}
/* Transparency bar */
.transparency-bar {
  position: relative;
  overflow: hidden;
  padding: 2.8rem 3rem;
  background:
    radial-gradient(circle at 50% 0%, rgba(201,165,84,.08), transparent 26rem),
    linear-gradient(90deg, rgba(201,165,84,.035), rgba(201,165,84,.012), rgba(201,165,84,.035));
}
.tb-balance {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 220px;
  opacity: .1;
  filter: invert(1) brightness(1.4);
  pointer-events: none;
  user-select: none;
}
.tb-title {
  font-family: var(--font-head);
  font-size: clamp(.76rem, 1.4vw, .95rem);
  letter-spacing: .22em;
  text-transform: uppercase;
  text-align: center;
  color: rgba(232,211,159,.76);
  margin-bottom: 2rem;
}
.tb-items {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.2rem;
}
.tb-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .7rem;
  min-height: 112px;
  text-align: center;
  font-family: var(--font-head);
  font-weight: 500;
  font-size: .78rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(232,222,202,.76);
}
.tb-cross {
  color: rgba(201,165,84,.72);
  font-family: var(--font-body);
  font-size: 1.35rem;
  line-height: 1;
}



/* ═══════════════════════════════
   SECTION ALMANACH
   ═══════════════════════════════ */
.section-almanach {
  position: relative; z-index: 2;
  background:
    linear-gradient(rgba(8,11,22,.88), rgba(8,11,22,.88)),
    repeating-linear-gradient(
      0deg,
      rgba(201,165,84,.012) 0px, rgba(201,165,84,.012) 1px,
      transparent 1px, transparent 20px
    ),
    repeating-linear-gradient(
      90deg,
      rgba(201,165,84,.012) 0px, rgba(201,165,84,.012) 1px,
      transparent 1px, transparent 20px
    );
  border-top: 1px solid rgba(201,165,84,.1);
  border-bottom: 1px solid rgba(201,165,84,.1);
}
.almanach-inner {
  max-width: 700px; margin: 0 auto;
  padding: 6rem 2rem; text-align: center;
  position: relative;
}
.almanach-book-ornament {
  position: absolute;
  right: -8rem;
  top: 1.2rem;
  width: min(360px, 34vw);
  opacity: .16;
  filter: drop-shadow(0 0 20px rgba(226,213,178,.05));
  pointer-events: none;
}
.almanach-title {
  font-family: var(--font-display); font-weight: 400;
  font-size: clamp(.82rem, 1.25vw, 1.15rem);
  letter-spacing: .08em; color: var(--gold-light);
  margin-bottom: 1.2rem; margin-top: 0;
  white-space: nowrap;
}
.almanach-sub {
  font-family: var(--font-body); font-weight: 300;
  font-size: clamp(.85rem, 1.3vw, .98rem);
  line-height: 1.9; letter-spacing: .06em;
  color: rgba(201,165,84,.75); margin-bottom: 2.5rem;
}
.almanach-cta {
  display: inline-block;
  font-family: var(--font-head); font-size: .65rem;
  letter-spacing: .28em; text-transform: uppercase;
  color: var(--bg); background: var(--gold);
  padding: 1.1rem 2.6rem;
  transition: background .3s;
}
.almanach-cta:hover { background: var(--gold-light); color: var(--bg); }

/* ═══════════════════════════════
   SECTION FOUNDER
   ═══════════════════════════════ */
.section-founder {
  position: relative; z-index: 2;
  background: rgba(5,7,16,.97);
  border-top: 1px solid rgba(201,165,84,.12);
}
.founder-inner {
  max-width: 1100px; margin: 0 auto;
  padding: 6rem 2rem;
  display: grid; grid-template-columns: 1fr 1.2fr;
  gap: 5rem; align-items: center;
}
.founder-pack-visual {
  margin: 0;
  border: 1px solid rgba(201,165,84,.18);
  background:
    radial-gradient(ellipse 80% 65% at 50% 45%, rgba(201,165,84,.1), transparent 64%),
    rgba(201,165,84,.025);
  min-height: 340px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
}
.founder-pack-visual::before,
.founder-pack-visual::after {
  content: '';
  position: absolute;
  inset: 12px;
  border: 1px solid rgba(201,165,84,.12);
  pointer-events: none;
}
.founder-pack-visual::after {
  inset: 20px;
  border-color: rgba(201,165,84,.06);
}
.founder-pack-visual img {
  width: 100%;
  height: 100%;
  min-height: 340px;
  object-fit: cover;
  object-position: center;
  filter: saturate(.9) contrast(1.05);
}

/* ═══ CRAFT / PROOF BAND ═══ */
.section-craft {
  position: relative;
  z-index: 2;
  background:
    linear-gradient(rgba(8,11,22,.9), rgba(8,11,22,.92)),
    repeating-linear-gradient(90deg, rgba(201,165,84,.015) 0 1px, transparent 1px 18px);
  border-top: 1px solid rgba(201,165,84,.12);
  border-bottom: 1px solid rgba(201,165,84,.12);
}
.craft-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 3rem 2rem;
  display: grid;
  grid-template-columns: 1.1fr 1.2fr 1fr;
  gap: 1.4rem;
  align-items: stretch;
}
.craft-copy,
.craft-visual-placeholder,
.craft-seals {
  border: 1px solid rgba(201,165,84,.16);
  background: rgba(201,165,84,.025);
}
.craft-copy {
  padding: 2rem;
}
.craft-kicker {
  font-family: var(--font-head);
  font-size: .62rem;
  letter-spacing: .25em;
  text-transform: uppercase;
  color: rgba(201,165,84,.55);
  margin-bottom: .8rem;
}
.craft-title {
  font-family: var(--font-head);
  font-weight: 500;
  font-size: clamp(1.1rem, 2vw, 1.45rem);
  line-height: 1.35;
  color: var(--gold-light);
  margin-bottom: 1rem;
}
.craft-text {
  font-family: var(--font-body);
  font-weight: 300;
  font-size: .88rem;
  line-height: 1.85;
  color: rgba(201,165,84,.78);
}
.craft-visual-placeholder {
  min-height: 280px;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 2rem;
  background:
    radial-gradient(ellipse 70% 45% at 50% 50%, rgba(201,165,84,.08), transparent 68%),
    repeating-linear-gradient(135deg, rgba(201,165,84,.035) 0 1px, transparent 1px 12px),
    rgba(201,165,84,.025);
}
.craft-visual-placeholder::before {
  content: '';
  position: absolute;
  inset: 12px;
  border: 1px dashed rgba(201,165,84,.18);
  pointer-events: none;
}
.craft-visual-placeholder p {
  max-width: 340px;
  font-family: var(--font-body);
  font-weight: 300;
  font-size: .82rem;
  line-height: 1.75;
  letter-spacing: .035em;
  color: rgba(201,165,84,.68);
}
.craft-visual-image {
  min-height: 320px;
  padding: 0;
  overflow: hidden;
  align-items: stretch;
  justify-content: flex-end;
}
.craft-visual-image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(.92) contrast(1.1) saturate(1.02);
  transform: scale(1.02);
  transition: transform 1.2s cubic-bezier(.22,1,.36,1), filter .6s;
}
.craft-visual-image:hover img {
  transform: scale(1.06);
  filter: brightness(1) contrast(1.12) saturate(1.08);
}
.craft-visual-image::before {
  inset: 0;
  z-index: 1;
  border: 0;
  background:
    radial-gradient(ellipse 75% 60% at 50% 55%, transparent 0%, rgba(5,7,16,.18) 65%, rgba(5,7,16,.62) 100%),
    linear-gradient(0deg, rgba(5,7,16,.42) 0%, rgba(5,7,16,.06) 40%, transparent 70%);
}
.craft-visual-image::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  box-shadow: inset 0 0 80px rgba(201,165,84,.12);
  pointer-events: none;
  border: 1px solid rgba(201,165,84,.22);
}
.craft-seals {
  display: grid;
  grid-template-columns: 1fr;
}
.craft-seal {
  min-height: 118px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  border-bottom: 1px solid rgba(201,165,84,.12);
  padding: 1rem 1.15rem;
}
.craft-seal:last-child {
  border-bottom: 0;
}
.craft-seal span {
  font-family: var(--font-head);
  font-size: 1.35rem;
  color: var(--gold-light);
  letter-spacing: .16em;
}
.craft-seal small {
  font-family: var(--font-head);
  font-size: .64rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(201,165,84,.52);
  margin-top: .35rem;
}
.craft-seal p {
  font-family: var(--font-body);
  font-weight: 300;
  font-size: .72rem;
  line-height: 1.55;
  letter-spacing: .025em;
  color: rgba(201,165,84,.66);
  margin-top: .6rem;
  max-width: 210px;
}

.founder-badge-wrap { margin-bottom: 1rem; }
.founder-badge-pill {
  font-family: var(--font-head); font-size: .6rem;
  letter-spacing: .3em; text-transform: uppercase;
  color: var(--gold-light); border: 1px solid rgba(240,216,140,.5);
  padding: .5rem 1.15rem;
  position: relative; overflow: hidden; display: inline-block;
  background: linear-gradient(120deg, rgba(201,165,84,.08), rgba(255,255,255,.04), rgba(201,165,84,.08));
  box-shadow: inset 0 0 22px rgba(255,255,255,.04), 0 0 22px rgba(201,165,84,.12);
}
.founder-badge-pill::after {
  content: '';
  position: absolute;
  inset: -45% -70%;
  background: linear-gradient(
    105deg,
    transparent 28%,
    rgba(255,255,255,.04) 36%,
    rgba(255,244,232,.9) 44%,
    rgba(255,177,208,.72) 50%,
    rgba(183,154,255,.64) 57%,
    rgba(255,255,255,.12) 64%,
    transparent 74%
  );
  transform: translateX(-65%) rotate(7deg);
  animation: iridescentSweep 5.8s ease-in-out infinite;
  mix-blend-mode: screen;
  pointer-events: none;
}
@keyframes iridescentSweep {
  0%, 34% { transform: translateX(-68%) rotate(7deg); opacity: 0; }
  43% { opacity: .95; }
  58% { transform: translateX(68%) rotate(7deg); opacity: .75; }
  72%, 100% { transform: translateX(68%) rotate(7deg); opacity: 0; }
}
@keyframes mythicPearlShift {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}
.founder-title {
  font-family: var(--font-head); font-weight: 600;
  font-size: clamp(1.5rem, 3vw, 2.4rem);
  letter-spacing: .06em; color: #fff;
  margin-bottom: 1.8rem;
}
.founder-perks {
  list-style: none;
  font-family: var(--font-body); font-weight: 300;
  font-size: .9rem; line-height: 2.2; letter-spacing: .04em;
  color: rgba(201,165,84,.85); margin-bottom: 2.5rem;
}
.founder-perks li { display: flex; align-items: center; gap: .8rem; }
.founder-perks li::before {
  content: '✦'; color: var(--gold);
  text-shadow: 0 0 8px rgba(201,165,84,.5); flex-shrink: 0;
}

.founder-mythic-link {
  display: inline-block;
  color: var(--gold-light);
  font-weight: 700;
  text-decoration: none;
  transition: color .2s ease;
}
.founder-mythic-word {
  color: transparent;
  background: linear-gradient(105deg, #fff7dc 0%, #cfeeff 30%, #f3c8ff 58%, #fff0b8 100%);
  background-size: 180% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  text-shadow:
    0 0 8px rgba(183,233,255,.18),
    0 0 12px rgba(240,184,255,.12);
  animation: mythicPearlShift 6.8s ease-in-out infinite;
}
.founder-mythic-link:hover,
.founder-mythic-link:focus-visible {
  color: #fff3c2;
}

/* Compteur */
.founder-counter { margin-bottom: 2.5rem; }
.fc-number {
  font-family: var(--font-head);
  font-size: clamp(2.5rem, 5vw, 4rem);
  line-height: 1; letter-spacing: .04em;
  color: var(--gold-light);
  display: flex; align-items: baseline; gap: .3rem;
}
.fc-slash { color: rgba(201,165,84,.35); font-size: .7em; }
.fc-total { color: rgba(201,165,84,.35); font-size: .6em; }
.fc-label {
  font-family: var(--font-head); font-size: .7rem;
  letter-spacing: .26em; text-transform: uppercase;
  color: rgba(201,165,84,.5); margin-top: .4rem;
}

/* Formulaire Fondateur */
.hp { position: absolute; left: -9999px; }
.founder-form-row {
  display: flex; gap: 0; margin-bottom: .8rem;
}
.founder-form-row input[type="email"] {
  flex: 1; background: rgba(201,165,84,.06);
  border: 1px solid rgba(201,165,84,.25); border-right: none;
  color: var(--gold-light); font-family: var(--font-body);
  font-size: .88rem; letter-spacing: .05em;
  padding: .9rem 1.2rem; outline: none;
  transition: border-color .3s, background .3s;
}
.founder-form-row input::placeholder { color: rgba(201,165,84,.4); }
.founder-form-row input:focus {
  border-color: var(--gold); background: rgba(201,165,84,.1);
}
.founder-form-row button {
  background: var(--gold); border: 1px solid var(--gold);
  color: var(--bg); font-family: var(--font-head);
  font-size: .62rem; letter-spacing: .2em; text-transform: uppercase;
  padding: .9rem 1.6rem; cursor: pointer; white-space: nowrap;
  transition: background .25s;
}
.founder-form-row button:hover { background: var(--gold-light); }
.founder-form-row button:disabled { opacity: .6; cursor: not-allowed; }
.rgpd {
  display: flex; align-items: flex-start; gap: .5rem;
  font-size: .78rem; color: rgba(201,165,84,.7); line-height: 1.6;
}
.rgpd input[type="checkbox"] { accent-color: var(--gold); margin-top: 2px; flex-shrink: 0; }
.rgpd a { color: rgba(201,165,84,.6); text-decoration: underline; }
.form-feedback {
  display: none; font-family: var(--font-head); font-size: .72rem;
  letter-spacing: .15em; margin-top: .8rem;
}
.form-feedback.success { color: var(--gold-light); display: block; }
.form-feedback.error { color: #e06060; display: block; }

/* ═══════════════════════════════
   SECTION NEWSLETTER
   ═══════════════════════════════ */
.section-newsletter {
  position: relative; z-index: 2;
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 15%, rgba(255,248,220,.42), transparent 24%),
    radial-gradient(circle at 86% 78%, rgba(87,56,25,.14), transparent 28%),
    linear-gradient(90deg, rgba(36,24,15,.18), transparent 18%, transparent 82%, rgba(36,24,15,.18)),
    linear-gradient(180deg, #d9c7aa 0%, #cdb995 52%, #bca884 100%);
  border-top: 3px solid rgba(10,11,12,.9);
  border-bottom: 3px solid rgba(10,11,12,.9);
  box-shadow:
    inset 0 1px 0 rgba(255,248,220,.35),
    inset 0 -1px 0 rgba(60,38,18,.35);
}
.nl-ornament {
  position: absolute;
  bottom: -6px;
  z-index: 0;
  width: min(190px, 16vw);
  opacity: .28;
  mix-blend-mode: multiply;
  filter: sepia(.34) saturate(.62) contrast(.96) brightness(1.12);
}
.nl-ornament-left { left: 1.2rem; }
.newsletter-inner {
  position: relative; z-index: 1;
  max-width: 1200px; margin: 0 auto;
  padding: 2.2rem 2rem;
  display: flex; align-items: center; gap: 4rem;
}
.nl-left {
  flex: 1;
  padding-left: clamp(1.5rem, 4vw, 4.5rem);
}
.nl-title {
  font-family: var(--font-head); font-weight: 400;
  font-size: clamp(1rem, 1.65vw, 1.45rem);
  letter-spacing: .12em; text-transform: uppercase;
  color: #21170d; margin-bottom: .55rem;
  text-shadow: 0 1px 0 rgba(255,248,220,.35);
}
.nl-sub {
  font-family: var(--font-body); font-weight: 300;
  font-size: .95rem; line-height: 1.65; letter-spacing: .035em;
  color: rgba(33,23,13,.43);
}
.nl-right { flex-shrink: 0; }
.nl-form {
  display: flex; gap: 0;
  box-shadow: 0 10px 26px rgba(36,24,15,.14);
}
.nl-form input[type="email"] {
  width: 320px; background: rgba(255,248,220,.26);
  border: 1px solid rgba(36,24,15,.28); border-right: none;
  color: #21170d; font-family: var(--font-body);
  font-size: .85rem; letter-spacing: .05em;
  padding: .85rem 1.2rem; outline: none;
  transition: border-color .3s, background .3s;
}
.nl-form input::placeholder { color: rgba(33,23,13,.48); text-transform: uppercase; }
.nl-form input:focus {
  border-color: rgba(33,23,13,.58);
  background: rgba(255,248,220,.46);
}
.nl-form button {
  background: #0b0d12; border: 1px solid rgba(36,24,15,.72);
  color: #c9a554; font-family: var(--font-head);
  font-size: .6rem; letter-spacing: .2em; text-transform: uppercase;
  padding: .85rem 1.6rem; cursor: pointer; white-space: nowrap;
  transition: background .25s, color .25s, border-color .25s;
}
.nl-form button:hover {
  background: #15110b;
  color: #f0d88c;
  border-color: rgba(201,165,84,.55);
}
.nl-privacy {
  margin-top: .55rem;
  font-family: var(--font-body);
  font-size: .68rem;
  letter-spacing: .04em;
  color: rgba(33,23,13,.58);
}
.nl-privacy a {
  color: rgba(33,23,13,.68);
  text-decoration: underline;
}

/* ═══════════════════════════════
   QUEST BAR
   ═══════════════════════════════ */
.quest-bar {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 400;
  height: 60px;
  background: rgba(5,7,16,.96); backdrop-filter: blur(20px);
  border-top: 1px solid rgba(201,165,84,.14);
  transform: translateY(100%);
  transition: transform .55s cubic-bezier(.22,1,.36,1);
}
.quest-bar.qb-visible { transform: translateY(0); }
.quest-bar::before {
  content: ''; position: absolute; top: -1px; left: -40%; width: 40%; height: 2px;
  background: linear-gradient(90deg,
    transparent,
    #ff6eb4 15%,
    #ff9f40 28%,
    #fff060 42%,
    #60ffb0 57%,
    #40d0ff 70%,
    #c060ff 83%,
    transparent
  );
  animation: qbShimmer 5s ease-in-out infinite; pointer-events: none;
}
.quest-bar::after {
  content: ''; position: absolute; top: -3px; left: -40%; width: 40%; height: 8px;
  background: linear-gradient(90deg,
    transparent,
    rgba(255,110,180,.5) 15%,
    rgba(255,159,64,.5) 28%,
    rgba(255,240,96,.5) 42%,
    rgba(96,255,176,.5) 57%,
    rgba(64,208,255,.5) 70%,
    rgba(192,96,255,.5) 83%,
    transparent
  );
  filter: blur(3px);
  animation: qbShimmer 5s ease-in-out infinite; pointer-events: none;
}
@keyframes qbShimmer { 0% { left: -40%; } 100% { left: 140%; } }
.qb-inner {
  max-width: 1200px; margin: 0 auto; height: 100%;
  display: flex; align-items: center; padding: 0 2rem; gap: 1.5rem;
}
.qb-sigil { flex-shrink: 0; width: 32px; height: 32px; color: var(--gold); opacity: .7; }
.qb-center { flex: 1; text-align: center; line-height: 1; }
.qb-label {
  display: block; font-family: var(--font-head); font-size: .62rem;
  letter-spacing: .28em; text-transform: uppercase;
  margin-bottom: .25rem;
  background: linear-gradient(90deg,
    #c9a554 0%, #f0d98a 25%, #fff4cc 45%, #e8c97a 60%, #b8813a 75%, #c9a554 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: chromaShimmer 2.4s linear infinite;
  filter: drop-shadow(0 0 6px rgba(201,165,84,.55)) drop-shadow(0 0 14px rgba(201,165,84,.25));
}
.qb-count {
  font-family: var(--font-head); font-size: .65rem;
  letter-spacing: .12em; color: rgba(201,165,84,.75);
}
.qb-count strong {
  color: var(--gold-light); font-size: .8rem;
  display: inline-block;
  animation: qbGlow 3s ease-in-out infinite;
}
@keyframes qbGlow {
  0%, 100% { text-shadow: 0 0 4px rgba(201,165,84,.2); opacity: .85; }
  50%       { text-shadow: 0 0 8px rgba(201,165,84,1), 0 0 20px rgba(201,165,84,.8), 0 0 40px rgba(201,165,84,.4); opacity: 1; }
}
.qb-cta {
  flex-shrink: 0; font-family: var(--font-head); font-size: .7rem;
  letter-spacing: .2em; text-transform: uppercase;
  color: var(--bg); background: var(--gold); padding: .65rem 1.5rem;
  transition: background .25s;
}
.qb-cta:hover { background: var(--gold-light); color: var(--bg); }

/* ═══════════════════════════════
   RESPONSIVE
   ═══════════════════════════════ */
@media (max-width: 900px) {
/* Hero */
  .hero-content { padding: 0 1.5rem; }

  /* Carousel potions */
  .section-potions {
    background:
      radial-gradient(ellipse 110% 44% at 50% 18%, rgba(201,165,84,.065), transparent 58%),
      linear-gradient(180deg, rgba(5,7,16,.98), rgba(8,11,22,.98));
    overflow: hidden;
  }

  .potions-inner {
    padding-left: 0;
    padding-right: 0;
  }

  .potions-heading,
  .ornament-divider {
    margin-left: auto;
    margin-right: auto;
  }

  .potions-heading {
    max-width: min(320px, calc(100vw - 2.4rem));
    line-height: 1.75;
  }

  .potions-grid {
    --p-card-mobile: min(78vw, 318px);
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    overflow-x: auto;
    overflow-y: visible;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: max(1.2rem, calc((100vw - var(--p-card-mobile)) / 2));
    -webkit-overflow-scrolling: touch;
    gap: .95rem;
    padding: 1.25rem max(1.2rem, calc((100vw - var(--p-card-mobile)) / 2)) 1.35rem;
    margin: 0 0 1rem;
    scrollbar-width: none;
  }

  .potions-grid::-webkit-scrollbar { display: none; }

  .potions-grid .p-card {
    flex: 0 0 var(--p-card-mobile);
    width: var(--p-card-mobile);
    min-width: var(--p-card-mobile);
    height: 548px;
    border-radius: 8px;
    scroll-snap-align: center;
    scroll-snap-stop: always;
    align-self: stretch;
    margin: .15rem 0;
    overflow: hidden;
    background:
      linear-gradient(180deg, rgba(14,18,33,.96), rgba(5,7,16,.99)),
      radial-gradient(ellipse 80% 38% at 50% 4%, var(--pcs), transparent 68%);
    border-color: rgba(201,165,84,.24);
    box-shadow:
      0 18px 34px rgba(0,0,0,.38),
      inset 0 0 0 1px rgba(255,240,190,.035);
  }

  .potions-grid .p-card::before {
    background:
      linear-gradient(180deg, rgba(255,255,255,.035), transparent 26%),
      radial-gradient(ellipse 70% 34% at 50% 12%, var(--pcs), transparent 72%);
  }

  .potions-grid .p-card::after {
    opacity: .32;
    transform: scale(1);
    background:
      radial-gradient(circle at 50% 22%, var(--ink, var(--ink-gold)), transparent 26%),
      linear-gradient(120deg, transparent 20%, rgba(255,255,255,.035) 42%, transparent 58%);
    mix-blend-mode: screen;
  }

  .p-card:hover {
    transform: none;
  }

  .p-card-header {
    min-height: 236px;
    padding: 1.35rem 1.15rem 1rem;
    justify-content: center;
    gap: .9rem;
    border-bottom: 1px solid rgba(201,165,84,.08);
    background:
      radial-gradient(ellipse 72% 42% at 50% 44%, var(--pcs), transparent 70%),
      linear-gradient(180deg, rgba(201,165,84,.035), transparent 78%);
  }

  .p-bottle-placeholder {
    width: 98px;
    height: 154px;
    filter:
      drop-shadow(0 0 18px var(--pc, rgba(201,165,84,.28)))
      drop-shadow(0 18px 18px rgba(0,0,0,.26));
  }

  .p-bottle-wrap::before {
    top: 1px;
    width: 32px;
    height: 26px;
  }

  .p-name {
    font-size: .98rem;
    letter-spacing: .105em;
    margin-bottom: .32rem;
  }

  .p-discipline {
    max-width: 26ch;
    margin-inline: auto;
    font-size: .6rem;
    letter-spacing: .12em;
    line-height: 1.5;
  }

  .p-card-body {
    padding: 1.05rem 1.15rem .85rem;
  }

  .p-ingredients {
    margin-bottom: .85rem;
    padding: .6rem 0;
    font-size: .56rem;
    letter-spacing: .055em;
    line-height: 1.35;
    gap: .28rem;
  }

  .p-ingredients span {
    min-height: 24px;
    padding: .28rem .24rem .25rem;
  }

  .p-benefits {
    display: grid;
    gap: .42rem;
    font-size: .75rem;
    line-height: 1.45;
    color: rgba(226,213,178,.82);
  }

  .p-benefits li {
    gap: .5rem;
  }

  .p-benefits li::before {
    margin-top: .55em;
    width: .36rem;
    height: .36rem;
  }

  .p-coffret {
    margin-top: .8rem;
    padding-top: .8rem;
    gap: .36rem;
  }

  .p-coffret span {
    font-size: .6rem;
    letter-spacing: .1em;
    color: rgba(240,216,140,.68);
  }

  .p-card-footer {
    margin-top: auto;
    padding: .95rem 1.15rem 1.05rem;
  }

  .p-price {
    font-size: 1.05rem;
  }

  .p-cta {
    min-width: 120px;
    padding: .72rem .95rem;
    font-size: .64rem;
    letter-spacing: .16em;
    text-align: center;
  }

  /* Guarantees */
  .guarantees-inner { padding: 3rem 1.5rem; }
  .guarantees-grid { grid-template-columns: 1fr; }
  .guarantee-item { border-right: none; border-bottom: 1px solid rgba(201,165,84,.1); padding: 1.2rem 1.5rem; }
  .guarantee-item:last-child { border-bottom: none; }

  /* Why : sur mobile (< 900px), .ritual passe en mode statique (.is-static), .ritual-sticky
     est masqué. La timeline .ritual-static (visible) a son propre layout (vois plus haut). */
  .why-inner { padding: 4rem 1.5rem; gap: 2rem; }
  .section-why { overflow-x: clip; }

  /* Proof / Science */
  .section-proof::after { display: none; }
  .proof-inner { padding-top: 4.4rem; padding-bottom: 4.4rem; }
  .proof-hero {
    grid-template-columns: 1fr;
    min-height: auto;
    gap: 1.8rem;
  }
  .proof-copy { max-width: 100%; }
  .science-title {
    font-size: clamp(2rem, 7.2vw, 3.2rem);
    letter-spacing: .18em;
  }
  .proof-lede { max-width: 640px; }
  .proof-visual {
    min-height: 420px;
    width: min(520px, 100%);
    margin: 0 auto;
  }
  .proof-cards { grid-template-columns: 1fr; }
  .proof-card {
    min-height: auto;
    padding: 2rem;
  }
  .proof-alliance {
    grid-template-columns: 110px 1fr;
    padding: 1.4rem;
  }
  .proof-alliance img { display: none; }
  .proof-founder-strip {
    align-items: stretch;
    flex-direction: column;
    padding: 1.5rem;
  }
  .proof-founder-cta {
    width: 100%;
    min-width: 0;
  }

  /* Founder */
  .founder-inner { grid-template-columns: 1fr; gap: 2.5rem; padding: 4rem 1.5rem; }
  .founder-left { display: none; }

  /* Craft */
  .craft-inner { grid-template-columns: 1fr; }
  .craft-seals { grid-template-columns: repeat(3, 1fr); }
  .craft-seal { border-bottom: 0; border-right: 1px solid rgba(201,165,84,.12); }
  .craft-seal:last-child { border-right: 0; }

  /* Almanach */
  .almanach-book-ornament { display: none; }
  .almanach-inner { padding: 4rem 1.5rem; }
  .almanach-title { white-space: normal; font-size: clamp(.72rem, 2.8vw, .92rem); }

  /* Pack trinity */
  .pack-trinity-banner { flex-direction: column; gap: 1.5rem; text-align: center; }
  .pt-right { flex-direction: column; gap: 1rem; }

  /* Newsletter */
  .newsletter-inner { flex-direction: column; gap: 1.5rem; padding: 2.5rem 1.5rem; }
  .nl-left { padding-left: 0; }
  .nl-ornament { display: none; }
  .nl-form { flex-direction: column; }
  .nl-form input[type="email"] { width: 100%; border-right: 1px solid rgba(36,24,15,.28); border-bottom: none; }
}

@media (max-height: 760px) and (min-width: 901px) {
  .hero {
    padding-bottom: 5vh;
  }
  .hero-title {
    font-size: clamp(2rem, 3.7vw, 3.05rem);
    line-height: 1.08;
    margin-bottom: 1.1rem;
  }
  .hero-eyebrow {
    font-size: .92rem;
    margin-bottom: .9rem;
  }
  .hero-sub {
    font-size: .88rem;
    line-height: 1.65;
    margin-bottom: 1.5rem;
  }
  .hero-cta {
    padding: 1rem 2rem;
  }
}

@media (max-width: 600px) {
  /* Hero — aligné à gauche, compact */
  .hero { align-items: flex-end; padding: 5rem 0 3.5rem; }
  .hero-content { padding: 0 1.5rem; text-align: left; }
  .hero-title { font-size: clamp(1.85rem, 7.5vw, 2.6rem); }
  .hero-sub { margin: 0 0 2rem; max-width: 100%; }

  /* Sections — padding vertical réduit */
  .section-potions .potions-inner {
    padding: 3rem 0;
  }

  .potions-grid {
    --p-card-mobile: min(82vw, 304px);
    gap: .85rem;
    padding-top: 1.1rem;
  }

  .potions-grid .p-card {
    height: 532px;
  }

  .p-card-header {
    min-height: 222px;
    padding-top: 1.2rem;
  }

  .p-bottle-placeholder {
    width: 92px;
    height: 146px;
  }

  .p-card-body {
    padding: .95rem 1rem .75rem;
  }

  .p-benefits {
    font-size: .73rem;
  }

  .p-coffret span {
    font-size: .58rem;
  }
  .p-card.card-in {
    animation: none;
  }
  .proof-inner { padding: 3rem 1.2rem; }
  .science-inner { padding: 3rem 1.2rem; }
  .pack-trinity-banner { padding: 2rem 1.5rem; }

  /* Proof */
  .proof-kicker {
    gap: .55rem;
    letter-spacing: .16em;
    margin-bottom: 1.4rem;
  }
  .proof-kicker::after { width: 84px; }
  .science-title {
    font-size: clamp(1.85rem, 8.4vw, 2.6rem);
    line-height: 1.22;
    letter-spacing: .12em;
  }
  .proof-lede {
    font-size: .92rem;
    line-height: 1.75;
  }
  .proof-visual {
    min-height: 350px;
    transform: scale(.9);
    transform-origin: center top;
    margin-bottom: -1.4rem;
  }
  .proof-seal {
    right: 6%;
    width: 104px;
    height: 104px;
  }
  .proof-seal span {
    font-size: .45rem;
  }
  .proof-cards {
    gap: 1rem;
  }
  .proof-card {
    padding: 1.55rem;
  }
  .proof-card-icon {
    width: 104px;
    height: 104px;
    margin-bottom: 1rem;
  }
  .proof-card h3 {
    font-size: 1.28rem;
    letter-spacing: .12em;
  }
  .proof-card > p:not(.proof-card-sub) {
    font-size: .88rem;
  }
  .proof-alliance {
    grid-template-columns: 1fr;
    text-align: center;
    gap: 1rem;
    padding: 1.5rem;
  }
  .proof-alliance-orbit {
    width: 76px;
    height: 76px;
  }
  .proof-alliance p {
    font-size: .8rem;
    letter-spacing: .12em;
  }
  .proof-alliance span {
    font-size: .88rem;
  }
  .proof-founder-count {
    justify-content: center;
    gap: 1rem;
  }
  .proof-founder-sigil {
    width: 68px;
    height: 68px;
  }
  .proof-founder-count p {
    font-size: .82rem;
    letter-spacing: .14em;
  }
  .proof-founder-cta {
    min-height: 62px;
    font-size: .92rem;
    letter-spacing: .14em;
    text-align: center;
  }

  /* Craft */
  .craft-inner { padding: 2.5rem 1.2rem; }
  .craft-copy { padding: 1.5rem; }
  .craft-visual-placeholder { min-height: 200px; }
  .craft-seals { grid-template-columns: 1fr; }
  .craft-seal { border-right: 0; border-bottom: 1px solid rgba(201,165,84,.12); }
  .craft-seal:last-child { border-bottom: 0; }

  /* Newsletter */
  .newsletter-inner { padding: 2.4rem 1.2rem; text-align: center; }

  /* Ornements */
  .ornament-divider { width: 70vw; opacity: .16; }

  /* Founder form */
  .founder-form-row { flex-direction: column; }
  .founder-form-row input[type="email"] { border-right: 1px solid rgba(201,165,84,.25); border-bottom: none; }
  .founder-form-row button { width: 100%; }

  /* Quest bar */
  .qb-label { display: none; }
  .qb-sigil { width: 24px; height: 24px; }
}

/* ═══ CARD CASCADE REVEAL ═══ */
@keyframes cardReveal {
  from { opacity: 0; translate: 0 28px; }
  to   { opacity: 1; translate: 0 0; }
}
.p-card.card-in {
  animation: cardReveal .7s cubic-bezier(.22,1,.36,1) both;
}

/* ═══ CAROUSEL DOTS ═══ */
.carousel-dots {
  display: none;
  justify-content: center; gap: .6rem;
  margin: .5rem 0 2rem;
}
.cdot {
  width: 6px; height: 6px; border-radius: 50%;
  background: rgba(201,165,84,.25);
  transition: background .3s, transform .3s;
}
.cdot.active {
  background: var(--gold);
  transform: scale(1.3);
}
@media (max-width: 900px) {
  .carousel-dots { display: flex; }
}

/* REDUCED MOTION */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .section-guarantees,
  .section-why,
  .section-potions,
  .section-science,
  .section-craft,
  .section-almanach,
  .section-founder,
  .section-newsletter {
    opacity: 1 !important;
    transform: none !important;
  }
  .p-card::after,
  .founder-badge-pill::after {
    display: none !important;
  }
  .founder-mythic-word {
    background-position: 50% 50%;
  }
  .hero-bg-img {
    transform: none !important;
  }
  .hero-bg::before,
  .hero-bg::after {
    display: none !important;
  }
}

@media (max-height: 780px) and (min-width: 901px) {
  .hero-title { font-size: clamp(1.9rem, 3.25vw, 2.95rem); }
  .hero-sub { line-height: 1.55; margin-bottom: 1.4rem; }
  .hero-cta { padding: 1rem 2rem; }
}