[hidden]{display:none!important;}
:root{
  --cream:#fdf6ea;
  --cream-2:#fbeed9;
  --brown:#3a2a20;
  --brown-soft:#6b4636;
  --tan:#e8b15c;
  --tan-deep:#c98a3f;
  --tan-text:#8a5a1f;
  --line:rgba(58,42,32,.12);
  --radius-lg:16px;
  --radius-md:12px;
  --shadow-soft:0 8px 24px -14px rgba(58,42,32,.18);
  --ease:cubic-bezier(.22,1,.36,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Poppins',sans-serif;
  background:var(--cream);
  color:var(--brown);
  font-size:16px;
  line-height:1.6;
  overflow-x:hidden;
}
h1,h2,h3,h4{
  margin:0 0 .4em;
  line-height:1.15;
  color:var(--brown);
}
h1{
  font-family:'Anton',sans-serif;
  text-transform:uppercase;
  letter-spacing:.01em;
  line-height:1.08;
}
h2,h3,h4{
  font-family:'Poppins',sans-serif;
  font-weight:700;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{padding-left:1.1em;margin:.4em 0;}
li{margin-bottom:.35em;}

.skip-link{
  position:absolute;top:-50px;left:1em;z-index:10000;
  background:var(--brown);color:var(--cream);
  padding:.7em 1.2em;border-radius:0 0 var(--radius-md) var(--radius-md);
  font-weight:700;font-size:.9rem;
  transition:top .2s var(--ease);
}
.skip-link:focus{top:0;}

.grain{
  position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.035;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.eyebrow{
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:.82rem;
  color:var(--tan-text);
  margin:0 0 .6em;
}
.center{text-align:center;}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.5em;
  padding:.85em 1.5em;
  border-radius:999px;
  font-weight:700;
  font-family:'Poppins',sans-serif;
  font-size:.95rem;
  cursor:pointer;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease);
  border:none;
  white-space:nowrap;
}
.btn-primary{
  background:var(--brown);
  color:var(--cream);
  box-shadow:var(--shadow-soft);
}
.btn-primary:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 18px 30px -10px rgba(58,42,32,.35);}
.btn-primary:active{transform:translateY(0) scale(.98);}
.btn-ghost{
  background:transparent;
  border:2px solid var(--brown);
  color:var(--brown);
}
.btn-ghost:hover{background:var(--brown);color:var(--cream);transform:translateY(-3px);}
.btn-lg{padding:1em 1.9em;font-size:1rem;}
.btn-card{
  width:100%;
  justify-content:center;
  background:var(--accent,var(--brown));
  color:var(--cream);
  margin-top:.8em;
  white-space:normal;
  text-align:center;
  line-height:1.25;
  padding-top:.75em;
  padding-bottom:.75em;
}
.btn-card:hover{transform:translateY(-2px) scale(1.02);filter:brightness(1.08);}

/* ---------- NAV ---------- */
.nav{
  position:sticky;top:0;z-index:1000;
  background:var(--cream);
  border-bottom:1px solid rgba(58,42,32,.08);
}
.nav-inner{
  position:relative;
  max-width:1340px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  gap:1em;
  padding:.5em .75em .5em 1.5em;
  white-space:nowrap;
}
.brand{
  position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%);
  display:flex;align-items:center;justify-content:center;gap:.5em;
}
.brand-logo{height:120px;width:auto;}
.nav-links{display:flex;gap:1.3em;font-weight:700;font-size:.88rem;flex-shrink:0;}
.nav-links-left{justify-content:flex-start;}
.nav-right{display:flex;align-items:center;justify-content:flex-end;gap:1.4em;flex-shrink:0;}
.nav-links a:not(.btn){position:relative;padding:.2em 0;}
.nav-links a:not(.btn)::after{
  content:"";position:absolute;left:0;bottom:-3px;width:0;height:2px;background:var(--tan-deep);
  transition:width .25s var(--ease);
}
.nav-links a:not(.btn):hover::after{width:100%;}
.nav-club-pulse{animation:nav-club-pulse 1.8s ease-in-out infinite;}
.nav-club-pulse:hover{animation-play-state:paused;}
@keyframes nav-club-pulse{
  0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(201,138,63,.45);}
  50%{transform:scale(1.08);box-shadow:0 0 0 6px rgba(201,138,63,0);}
}
@media (prefers-reduced-motion: reduce){
  .nav-club-pulse{animation:none;}
}
.nav-cta-group{display:flex;align-items:center;gap:.6em;}
.nav-cart-btn{
  display:flex;align-items:center;justify-content:center;
  width:40px;height:40px;flex-shrink:0;
  border:1.5px solid var(--brown);border-radius:50%;
  background:transparent;color:var(--brown);
  cursor:pointer;
  transition:background .2s var(--ease), color .2s var(--ease), transform .2s var(--ease);
}
.nav-cart-btn:hover{background:var(--brown);color:var(--cream);transform:translateY(-2px);}
.nav-cta{padding:.6em 1.3em;font-size:.88rem;}
.nav-cta.btn-ghost{border-width:1.5px;padding:.55em 1.2em;}
@media (max-width:768px){
  .nav-right .currency-toggle,
  .nav-right #accountBtn{display:none;}
  .mobile-menu .currency-toggle{display:flex;margin-top:.3em;}
}
@media (min-width:769px){
  .mobile-menu #accountBtnMobile,
  .mobile-menu .currency-toggle{display:none !important;}
}
.burger{display:flex;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:.4em;}
.burger span{width:24px;height:3px;background:var(--brown);border-radius:2px;transition:.3s var(--ease);}
.burger.open span:nth-child(1){transform:translateY(8px) rotate(45deg);}
.burger.open span:nth-child(2){opacity:0;}
.burger.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg);}
.mobile-menu{
  position:absolute;top:100%;left:0;right:0;z-index:200;
  display:flex;flex-direction:column;gap:.9em;
  background:var(--cream);
  padding:1.1em 1.5em 1.4em;
  font-weight:700;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-6px);
  transition:opacity .22s ease, transform .22s ease, visibility 0s .22s;
}
.mobile-menu.open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
  box-shadow:0 8px 24px rgba(61,43,31,.13);
  border-bottom:1px solid rgba(61,43,31,.08);
  transition:opacity .22s ease, transform .22s ease, visibility 0s 0s;
}
/* TODOS los ítems del menú idénticos a un link plano */
.mobile-menu a,
.mobile-menu .menu-link-btn,
.mobile-menu .btn,
.mobile-menu .currency-btn{
  font-family:inherit;
  font-size:1rem;
  font-weight:700;
  color:var(--brown);
  background:none;
  border:none;
  border-radius:0;
  padding:0;
  margin:0;
  box-shadow:none;
  cursor:pointer;
  text-align:left;
  text-decoration:none;
  display:block;
  width:auto;
  letter-spacing:normal;
  text-transform:none;
}
.mobile-menu a:hover,
.mobile-menu .menu-link-btn:hover,
.mobile-menu .btn:hover,
.mobile-menu .currency-btn:hover{opacity:.6;}
/* Currency toggle: dos botones en fila sin separación visual */
.mobile-menu .currency-toggle{
  display:flex;gap:.6em;
  background:none;border:none;padding:0;border-radius:0;
  margin:0;
}
.mobile-menu .currency-toggle .currency-btn{
  display:inline !important;
  opacity:.4;
  background:none !important;
  border:none !important;
  border-radius:0 !important;
  padding:0 !important;
  color:var(--brown) !important;
  font-weight:700 !important;
  font-size:1rem !important;
  box-shadow:none !important;
}
.mobile-menu .currency-toggle .currency-btn.is-active{opacity:1;}

/* ---------- HERO ---------- */
.hero{
  position:relative;
  background:var(--brown);
  padding:5em 1.5em 4em;
  overflow:hidden;
}
.hero-bg-layer{
  position:absolute;inset:0;z-index:0;
  opacity:0;
  transition:opacity 1s ease;
  background:radial-gradient(circle at 72% 50%, #8a4a26 0%, #0c0b0a 72%);
}
.hero-bg-layer.is-active{opacity:1;}
@keyframes settle-in{
  from{opacity:0;transform:translateY(14px) scale(.92);}
  to{opacity:.9;transform:translateY(0) scale(1);}
}

.hero-grid{
  position:relative;z-index:1;
  max-width:1180px;margin:0 auto;
  display:grid;grid-template-columns:1.1fr .9fr;
  align-items:center;gap:2em;
}
.hero h1{
  color:var(--cream);
  font-size:clamp(3.64rem,7.7vw,5.6rem);
}
.hero-copy .eyebrow{color:var(--tan);}
.highlight{color:var(--tan);}
.hero-sub{max-width:440px;color:var(--cream-2);opacity:.85;font-size:1.05rem;}
.hero-actions{display:flex;gap:1em;flex-wrap:wrap;margin-top:1.8em;}
.hero-copy .btn-ghost{border-color:var(--cream);color:var(--cream);}
.hero-copy .btn-ghost:hover{background:var(--cream);color:var(--brown);}
.hero-badges{display:flex;gap:.6em;flex-wrap:wrap;margin-top:1.6em;}
.hero-badges .pill{border-color:rgba(253,246,234,.25);color:var(--cream-2);}

/* ---------- HERO JARS (4 products rotating through 4 fixed slots) ---------- */
.hero-jars{position:relative;height:460px;}
.hero-jar-slot{
  position:absolute;
  width:432px;
  transition:top 1s var(--ease), left 1s var(--ease), transform 1s var(--ease), opacity 1s var(--ease);
}
.hero-jar-img{
  display:block;width:100%;
  filter:drop-shadow(0 25px 35px rgba(0,0,0,.4));
  animation:hero-jar-bob 6s ease-in-out infinite;
}
@keyframes hero-jar-bob{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-10px);}
}
.slot-main{top:50%;left:52%;transform:translate(-50%,-50%) rotate(-9deg) scale(1);opacity:1;}
/* tr = just exited (slides off to the right), br = waiting offstage,
   aux = about to enter (slides in from the left) */
.slot-tr,.slot-br{top:50%;left:140%;transform:translate(-50%,-50%) rotate(-9deg) scale(1);opacity:0;pointer-events:none;}
.slot-aux{top:50%;left:-20%;transform:translate(-50%,-50%) rotate(-9deg) scale(1);opacity:0;pointer-events:none;}

/* proteína gets its own slightly bigger scale (image is composited
   smaller in source, so it needs the extra boost other jars don't) */
.hero-jar-slot[data-jar="proteina"].slot-main{transform:translate(-50%,-50%) rotate(-9deg) scale(1.2);}

.hero.bg-light h1,
.hero.bg-light .hero-copy .eyebrow,
.hero.bg-light .hero-sub,
.hero.bg-light .hero-badges .pill{color:var(--brown);transition:color .6s ease;}
.hero.bg-light .highlight{color:var(--tan-deep);}
.hero.bg-light .hero-sub{opacity:.85;}
.hero.bg-light .hero-copy .btn-ghost{border-color:var(--brown);color:var(--brown);}
.hero.bg-light .hero-copy .btn-ghost:hover{background:var(--brown);color:var(--cream);}
.hero.bg-light .hero-badges .pill{border-color:rgba(58,42,32,.25);}

@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr;text-align:center;}
  .hero-sub{margin:0 auto;}
  .hero-actions,.hero-badges{justify-content:center;}
  .hero-jars{order:-1;margin-bottom:1em;height:340px;}
  .hero-jar-slot{width:317px;}
}

/* ---------- LLÉVALAS A CASA ---------- */
.takehome{max-width:1180px;margin:0 auto;padding:6.5em 1.5em;}
.takehome-inner{display:grid;grid-template-columns:1fr 1fr;gap:3em;align-items:center;}
.takehome-art{border-radius:var(--radius-lg);overflow:hidden;}
.takehome-art img{width:100%;height:120%;object-fit:cover;display:block;}
.img-parallax{will-change:transform;}
.takehome-text p{color:var(--brown-soft);}
.takehome-text .btn-primary{margin-top:.6em;}
@media (max-width:980px){
  .takehome-inner{grid-template-columns:1fr;text-align:center;}
  .takehome-art{order:-1;max-height:320px;}
}

/* ---------- MARQUEE ---------- */
.marquee{
  background:var(--brown);
  color:var(--cream-2);
  overflow:hidden;
  padding:.7em 0;
}
.marquee-track{
  display:flex;gap:1.2em;white-space:nowrap;
  font-family:'Poppins',sans-serif;font-weight:600;font-size:.82rem;letter-spacing:.12em;
  opacity:.85;
  animation:scroll-left 28s linear infinite;
  width:max-content;
}
.marquee-seed{display:flex;gap:1.2em;white-space:nowrap;flex-shrink:0;}
.marquee-item{display:inline-flex;align-items:center;gap:.45em;}
.marquee-item svg{flex-shrink:0;}
@keyframes scroll-left{
  0%{transform:translateX(0);}
  100%{transform:translateX(-50%);}
}

/* ---------- COLORED PANELS (color lives in the card, not the section) ---------- */
.blob-panel{
  position:relative;
  max-width:1180px;margin:6em auto;
  background:var(--cream);
  border-radius:var(--radius-lg);
  padding:4.5em 1.5em;
  box-shadow:0 24px 50px -20px rgba(0,0,0,.18);
}
.blob-panel::before,.blob-panel::after{
  content:"";position:absolute;border-radius:50%;background:var(--cream);pointer-events:none;
}
.blob-panel::before{width:16px;height:16px;top:-9px;left:9%;}
.blob-panel::after{width:10px;height:10px;top:14px;left:5.5%;}

.panel-tan{background:var(--tan);}
.panel-orange{background:var(--tan-deep);}
.panel-tan::before,.panel-tan::after,.panel-orange::before,.panel-orange::after{background:var(--cream);opacity:.6;}

/* keep text readable on the tinted panels */
.panel-tan .eyebrow,.panel-orange .eyebrow,
.panel-orange .ing-col h3{color:var(--brown);}

@media (max-width:560px){
  .blob-panel{border-radius:32px;padding:2.4em 1.3em;margin:3em auto;}
}

/* ---------- COOKIE CRUMB FLOATERS ---------- */
.crumb-parallax{
  position:absolute;
  pointer-events:none;
  z-index:0;
}
.crumb-float{
  display:block;
  background-image:url("assets/cookie-crumbs.png");
  background-repeat:no-repeat;
  filter:url(#cutWhite);
  opacity:0;
  animation:crumb-settle .8s var(--ease) both;
}
@keyframes crumb-settle{
  from{opacity:0;transform:translateY(16px) rotate(-3deg) scale(.9);}
  to{opacity:1;transform:translateY(0) rotate(0deg) scale(1);}
}

/* Each location shows a single, different cookie piece cropped from the sprite */
.cp1{top:2%;left:50%;}
.cp1 .crumb-float{width:190px;height:190px;background-size:945px 945px;background-position:-271px -172px;animation-delay:.15s;}

.cp3{bottom:4%;right:3%;}
.cp3 .crumb-float{width:190px;height:190px;background-size:945px 945px;background-position:-511px -90px;animation-delay:.2s;}

.cp4{top:4%;right:2%;}
.cp4 .crumb-float{width:150px;height:150px;background-size:591px 591px;background-position:-66px -253px;animation-delay:.1s;}

.cp5{top:2%;left:2%;}
.cp5 .crumb-float{width:150px;height:150px;background-size:591px 591px;background-position:-298px -246px;animation-delay:.25s;}

@media (max-width:768px){
  .crumb-parallax{display:none;}
}

/* ---------- SPOTLIGHT ---------- */
.spotlight{
  position:relative;
  max-width:1180px;margin:5em auto;
  background:var(--brown);
  border-radius:var(--radius-lg);
  padding:4.5em 1.5em;
  overflow:hidden;
}
.spotlight-inner{
  max-width:1180px;margin:0 auto;
  display:grid;grid-template-columns:.8fr 1.2fr;gap:3em;align-items:center;
}
.spotlight-art{display:flex;justify-content:center;align-items:center;}
.spotlight-art img{width:100%;max-width:280px;filter:drop-shadow(0 20px 30px rgba(0,0,0,.35));}
.spotlight-text .eyebrow{color:var(--tan);}
.spotlight-text h2{color:var(--cream);font-size:clamp(1.8rem,3vw,2.4rem);font-family:'Anton',sans-serif;text-transform:uppercase;}
.spotlight-desc{color:var(--cream-2);opacity:.85;max-width:460px;}
.spotlight-text .btn-primary{background:var(--tan);color:var(--brown);margin-top:.6em;}
.spotlight-text .btn-primary:hover{background:var(--cream);}

/* ---------- PROTEIN BANNER (full-bleed photo, no card box, fades to cream) ---------- */
.protein-banner{
  position:relative;
  width:100%;
  margin:5em 0 0;
  min-height:560px;
  overflow:hidden;
  display:flex;align-items:center;
}
.protein-banner-media{position:absolute;inset:0;z-index:0;}
.protein-banner-img{width:100%;height:100%;object-fit:cover;object-position:center center;display:block;}
.protein-banner-package{
  position:absolute;top:52%;left:69%;
  transform:translate(-50%,-50%) rotate(-28deg);
  width:607px;max-width:55%;
  filter:drop-shadow(0 22px 28px rgba(0,0,0,.3));
  z-index:2;
}
.protein-banner-fade{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(to right, var(--cream) 0%, var(--cream) 30%, rgba(253,246,234,0) 62%);
}
.protein-banner-content{
  position:relative;z-index:2;
  max-width:1180px;margin:0 auto;
  padding:0 1.5em;
  width:100%;
}
.protein-banner-text{max-width:440px;}
.protein-banner-text .eyebrow{color:var(--tan-deep);}
.protein-banner-title{
  font-family:'Anton',sans-serif;
  text-transform:uppercase;
  font-size:clamp(2rem,3.6vw,3rem);
  line-height:1.05;
  color:var(--brown);
  margin:.2em 0 .6em;
}
.protein-banner-desc{color:var(--brown-soft);margin:0 0 1.2em;}
@media (max-width:760px){
  .protein-banner{min-height:640px;overflow:hidden;}
  .protein-banner-package{top:30%;left:50%;width:390px;max-width:none;}
  /* Fondo: difumina hacia crema arriba, abajo y lados */
  .protein-banner-fade{
    background:
      linear-gradient(to bottom, var(--cream) 0%, transparent 14%),
      linear-gradient(to top,    var(--cream) 0%, var(--cream) 45%, transparent 65%),
      linear-gradient(to right,  var(--cream) 0%, transparent 20%),
      linear-gradient(to left,   var(--cream) 0%, transparent 20%);
  }
  .protein-banner-text{max-width:none;text-align:center;padding-top:18em;}
  .protein-banner-text .eyebrow{color:var(--brown);}
}

/* ---------- PILLARS ---------- */
.pillars{padding:5em 5vw;}
.pillars-inner{max-width:1100px;margin:0 auto;}
.pillars-title{
  max-width:640px;margin:.3em auto 3em;
  font-size:clamp(1.8rem,3vw,2.4rem);
  text-transform:uppercase;font-family:'Anton',sans-serif;
  color:var(--brown);text-align:center;
}
.pillar-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;}
.pillar-card{
  padding:2.8em 2.4em;
  border-right:1px solid var(--line);
  transition:background .3s var(--ease);
}
.pillar-card:last-child{border-right:none;}
.pillar-card:hover{background:var(--cream-2);}
.pillar-num{
  display:block;
  font-family:'Anton',sans-serif;
  font-size:3.2rem;
  color:var(--tan-deep);
  line-height:1;
  margin-bottom:.5em;
  opacity:.7;
}
.pillar-card h3{
  font-size:1.2rem;font-weight:700;
  color:var(--brown);margin:0 0 .7em;
  text-transform:uppercase;letter-spacing:.02em;
}
.pillar-card p{color:var(--brown-soft);font-size:.97rem;line-height:1.6;margin:0;}

/* ---------- INSULIN CHART ---------- */
.insulin-section{background:var(--cream-2);padding:5em 5vw;}
.insulin-inner{max-width:760px;margin:0 auto;text-align:center;}
.insulin-chart-title{
  font-size:clamp(1.6rem,3vw,2.2rem);color:var(--brown);
  margin:.3em 0 1.6em;text-transform:uppercase;
  font-family:'Anton',sans-serif;line-height:1.15;
}
.insulin-chart-card{
  background:var(--cream);border-radius:var(--radius-lg);
  padding:1.8em 1.6em;
  box-shadow:0 16px 40px -12px rgba(58,42,32,.14);
}
.insulin-chart{display:block;width:100%;height:auto;}
.insulin-chart-area{opacity:0;transition:opacity 1s var(--ease) .6s;}
.insulin-chart.in-view .insulin-chart-area{opacity:1;}
.insulin-chart-line{
  stroke-dasharray:1000;stroke-dashoffset:1000;
  transition:stroke-dashoffset 1.8s var(--ease);
}
.insulin-chart.in-view .insulin-chart-line{stroke-dashoffset:0;}
.insulin-chart.in-view .insulin-chart-line + .insulin-chart-line{transition-delay:.3s;}
.insulin-chart-note{
  max-width:560px;margin:1.2em auto 0;
  font-size:.85rem;color:var(--brown-soft);font-style:italic;
}
@media (prefers-reduced-motion: reduce){
  .insulin-chart-line{stroke-dasharray:none;stroke-dashoffset:0;transition:none;}
  .insulin-chart-area{opacity:1;transition:none;}
}
@media (max-width:700px){
  .pillar-grid{grid-template-columns:1fr;}
  .pillar-card{border-right:none;border-bottom:1px solid var(--line);}
  .pillar-card:last-child{border-bottom:none;}
  .pillars{padding:3.5em 1.5em;}
  .insulin-section{padding:3.5em 1.5em;}
}

/* ---------- MISSION ---------- */
.mission{position:relative;max-width:1180px;margin:0 auto;padding:6.5em 1.5em 2em;overflow:hidden;}
.mission-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:2.5em;
  align-items:start;
}
.mission-title{
  font-family:'Anton',sans-serif;
  text-transform:uppercase;
  font-size:clamp(3.2rem,7.5vw,5.6rem);
  line-height:1.02;
  margin:0;
}
.mission-copy{
  color:var(--brown-soft);
  font-size:1.05rem;
  text-align:justify;
  margin:.3em 0 0;
}
.mission-jars{
  position:relative;
  display:flex;justify-content:center;align-items:flex-end;
  gap:0;
  margin-top:.5em;
}
.mission-jar{
  width:280px;
  mix-blend-mode:multiply;
  filter:drop-shadow(0 18px 25px rgba(58,42,32,.18));
  opacity:0;
  animation:jar-settle .8s var(--ease) both, jar-float 6s ease-in-out 1s infinite;
}
.mj-coco{margin-right:-4.2em;margin-bottom:2.8em;animation-delay:.1s, 1.1s;}
.mj-choco{width:320px;z-index:1;animation-delay:.25s, 1.25s;}
.mj-limon{margin-left:-4.2em;margin-bottom:2.8em;animation-delay:.4s, 1.4s;}

@keyframes jar-settle{
  from{opacity:0;transform:translateY(24px) scale(.95);}
  to{opacity:1;transform:translateY(0) scale(1);}
}
@keyframes jar-float{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-7px);}
}

@media (max-width:768px){
  .mission-grid{grid-template-columns:1fr;text-align:left;}
  .mission-copy{text-align:left;}
  .mission-jars{justify-content:center;margin-top:1em;}
  .mission-jar{width:160px;}
  .mj-choco{width:180px;}
}


/* ---------- WHOLESALE BANNER ---------- */
.wholesale-banner{background:var(--cream-2);padding:5.5em 1.5em;}
.wholesale-inner{
  max-width:1180px;margin:0 auto;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.4em;
  text-align:center;
}
.wholesale-inner h2{
  font-family:'Anton',sans-serif;
  text-transform:uppercase;
  font-size:clamp(2.16rem,3.6vw,2.88rem);
  line-height:1.02;
  margin:0;
}
@media (max-width:768px){
  .wholesale-inner{flex-direction:column;text-align:center;}
}

/* ---------- CLUB BANNER (full-bleed photo, text in its blank space) ---------- */
.club-banner{
  position:relative;
  width:100%;
  min-height:480px;
  overflow:hidden;
  display:flex;align-items:center;
}
.club-banner-media{position:absolute;inset:0;z-index:0;}
.club-banner-img{width:100%;height:100%;object-fit:cover;object-position:35% center;display:block;}
.club-banner-content{
  position:relative;z-index:1;
  width:100%;
  padding:0 2vw 0 5vw;
  display:flex;justify-content:flex-end;
}
.club-banner-text{max-width:420px;}
.club-banner-text .eyebrow{color:var(--tan-text);}
.club-banner-text h2{
  font-family:'Anton',sans-serif;text-transform:uppercase;
  color:var(--brown);
  font-size:clamp(1.8rem,3.2vw,2.6rem);
  line-height:1.1;
  margin:.3em 0 .7em;
}
.club-banner-benefits{
  list-style:none;padding:0;margin:0 0 1.4em;
  display:flex;flex-direction:column;gap:.6em;
}
.club-banner-benefits li{
  display:flex;align-items:center;gap:.5em;
  color:var(--brown-soft);font-weight:700;font-size:.95rem;
}
.club-banner-benefits li::before{content:"✓";color:var(--tan-deep);font-weight:800;}

@media (max-width:760px){
  .club-banner{min-height:520px;align-items:center;}
  .club-banner-content{justify-content:center;align-items:center;padding:2em 1.5em;}
  .club-banner-text{max-width:none;text-align:center;padding-top:0;}
  .club-banner-benefits{align-items:center;}
  /* Gradiente central — oscuro en el medio donde está el texto */
  .club-banner-media::after{
    content:"";
    position:absolute;inset:0;
    background:linear-gradient(to bottom, rgba(0,0,0,.15) 0%, rgba(0,0,0,.65) 40%, rgba(0,0,0,.65) 80%, rgba(0,0,0,.2) 100%);
  }
  /* Texto en blanco para contrastar */
  .club-banner-text .eyebrow{color:rgba(255,255,255,.8);}
  .club-banner-text h2{color:#fff;}
  .club-banner-benefits li{color:rgba(255,255,255,.9);}
  .club-banner-benefits li::before{color:#f5c97a;}
}

/* ---------- MONK FRUIT BANNER (cutout photo floats on the page's own cream background, no boxed panel) ---------- */
.monkfruit-banner{
  background:var(--cream);
  display:grid;grid-template-columns:1fr 1fr;
  align-items:center;
  gap:2vw;
  padding:4em 5vw;
}
.monkfruit-banner-text{
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;
}
.monkfruit-banner-text .eyebrow{color:var(--tan-text);}
.monkfruit-banner-text h2{
  font-family:'Anton',sans-serif;text-transform:uppercase;
  color:var(--brown);
  font-size:clamp(1.8rem,3.2vw,2.6rem);
  line-height:1.1;
  margin:.3em 0 .7em;
}
.monkfruit-banner-text p:not(.eyebrow){color:var(--brown-soft);margin:0 auto .9em;max-width:460px;}
.monkfruit-reasons{
  list-style:none;margin:.3em auto 0;padding:0;
  max-width:460px;
  display:flex;flex-wrap:wrap;justify-content:center;gap:.6em .7em;
}
.monkfruit-reasons li{
  display:flex;align-items:center;gap:.45em;
  background:var(--cream-2);
  color:var(--brown);font-weight:700;
  border-radius:999px;
  padding:.55em 1.1em;
  font-size:.95rem;
}
.monkfruit-reasons li::before{
  content:'✓';
  color:#fff;background:var(--brown);
  width:1.2em;height:1.2em;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:.7em;flex-shrink:0;
}
.monkfruit-banner-media{display:flex;justify-content:center;}
.monkfruit-banner-img{
  width:100%;max-width:528px;height:auto;
  display:block;
  filter:drop-shadow(0 18px 30px rgba(60,40,20,.18));
}

@media (max-width:760px){
  .monkfruit-banner{grid-template-columns:1fr;padding:3em 1.5em;text-align:center;}
  .monkfruit-banner-media{order:-1;}
  .monkfruit-banner-img{max-width:280px;margin:0 auto;}
  .monkfruit-banner-text p:not(.eyebrow){margin:0 auto;}
}

/* ---------- PRODUCTS ---------- */
.products{max-width:1540px;margin:0 auto;padding:6.5em 1.5em 6.5em;}
.products h2{max-width:600px;margin:0 auto .6em;font-size:clamp(1.8rem,3vw,2.4rem);font-family:'Anton',sans-serif;text-transform:uppercase;}
.products-note{max-width:480px;margin:0 auto 2.2em;color:var(--brown-soft);font-size:.92rem;}

/* ---------- FLAVOR GRID (one bold-color card per flavor) ---------- */
.flavor-grid{
  max-width:1540px;margin:0 auto;
  display:grid;grid-template-columns:repeat(3,1fr);gap:2.1em;
}
.flavor-card{
  position:relative;
  border-radius:36px;
  padding:2.3em 1.9em 2em;
  display:flex;flex-direction:column;align-items:center;text-align:center;
  color:#fff;
  min-height:500px;
  overflow:hidden;
  transition:transform .3s var(--ease);
}
.flavor-card:hover{transform:translateY(-6px);}
.flavor-card h3{font-size:1.45rem;margin:0 0 .8em;color:#fff;}
.flavor-ribbon{
  position:absolute;top:22px;right:-44px;z-index:5;
  width:170px;
  padding:.45em 0;
  background:var(--tan-deep);
  color:#fff;
  font-family:'Poppins',sans-serif;font-weight:800;font-size:.95rem;letter-spacing:.05em;
  text-align:center;text-transform:uppercase;
  transform:rotate(45deg) scale(1);
  transform-origin:center;
  box-shadow:0 3px 8px rgba(0,0,0,.3);
  animation:ribbon-pulse 1.8s ease-in-out infinite;
}
@keyframes ribbon-pulse{
  0%,100%{transform:rotate(45deg) scale(1);}
  50%{transform:rotate(45deg) scale(1.15);}
}
@media (prefers-reduced-motion: reduce){
  .flavor-ribbon{animation:none;}
}
.flavor-card-media{
  position:relative;flex:1;width:100%;min-height:234px;
  display:flex;align-items:center;justify-content:center;
}
.flavor-card-img{
  max-width:78%;max-height:300px;object-fit:contain;
  filter:drop-shadow(0 14px 20px rgba(0,0,0,.25));
  transition:opacity .35s ease, transform .35s ease;
}
.flavor-card-img[src*="chispas-choco"]{max-width:90%;}
.flavor-card-img-soft{
  max-width:58%;
  -webkit-mask-image:radial-gradient(circle at 50% 50%, #000 47%, transparent 60%);
  mask-image:radial-gradient(circle at 50% 50%, #000 47%, transparent 60%);
  filter:drop-shadow(0 14px 20px rgba(0,0,0,.25)) saturate(.55) brightness(.97);
}
.flavor-card-desc{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  padding:.6em 1.4em;
  font-size:1.02rem;line-height:1.5;color:#fff;
  opacity:0;transform:translateY(6px);
  transition:opacity .35s ease, transform .35s ease;
}
.flavor-card:hover .flavor-card-img{opacity:0;transform:scale(.92);}
.flavor-card:hover .flavor-card-desc{opacity:1;transform:translateY(0);}
.flavor-card .btn-primary{
  margin:1.2em auto 0;width:auto;
  font-size:1.05rem;padding:.95em 1.7em;
}

.flavor-price{
  display:flex;flex-direction:column;align-items:center;gap:.25em;
  margin-top:.9em;
}
.flavor-price-normal{
  font-family:'Poppins',sans-serif;font-weight:800;font-size:1.35rem;color:#fff;
  text-shadow:0 1px 6px rgba(0,0,0,.4);
}
.flavor-price-member{
  display:inline-flex;align-items:center;gap:.35em;
  font-size:.88rem;font-weight:600;
  color:rgba(255,255,255,.55);
  background:rgba(0,0,0,.32);
  border:1px dashed rgba(255,255,255,.28);
  border-radius:999px;
  padding:.3em .9em;
}
.flavor-price-lock{font-size:.85em;}
.flavor-price-member-amt{font-weight:800;}
/* member logged in with active club plan: unlock the discount */
body.is-club-member .flavor-price-normal{
  font-size:1rem;font-weight:600;
  color:rgba(255,255,255,.55);
  text-decoration:line-through;
}
body.is-club-member .flavor-price-member{
  color:#fff;
  background:var(--tan-deep);
  border-style:solid;border-color:transparent;
  font-size:1.05rem;
}
body.is-club-member .flavor-price-lock{display:none;}

/* Upsell del checkout: el no-socio ve solo el precio normal (sin descuento);
   el socio activo ve el precio de socio tachando el normal. */
.upsell-price-member{display:none;}
body.is-club-member .upsell-price-normal{display:none;}
body.is-club-member .upsell-price-member{display:inline;}

/* Envío: el "gratis · beneficio del club" es solo para socios activos; el
   no-socio ve que se coordina por WhatsApp (no se cobra en la web). */
.envio-socio{display:none;}
.envio-normal{display:inline;}
body.is-club-member .envio-socio{display:inline;}
body.is-club-member .envio-normal{display:none;}

/* todos pueden elegir cantidad y armar el carrito antes de continuar */
.flavor-qty{
  display:flex;
  align-items:center;gap:1em;
  margin-top:.9em;
}
.flavor-qty-btn{
  width:34px;height:34px;border-radius:50%;
  border:1.5px solid rgba(255,255,255,.5);
  background:rgba(0,0,0,.3);color:#fff;
  font-size:1.15rem;font-weight:700;line-height:1;
  cursor:pointer;
  transition:background .2s ease, border-color .2s ease;
}
.flavor-qty-btn:hover{background:var(--tan-deep);border-color:var(--tan-deep);}
.flavor-qty-count{
  min-width:1.6em;text-align:center;
  font-family:'Poppins',sans-serif;font-weight:800;font-size:1.15rem;color:#fff;
}
.checkout-address-choice{margin-bottom:1.2em;}

.auth-email-sub{font-size:.78rem;font-weight:400;color:rgba(58,42,32,.55);}
.cart-iva-note{margin:.2em 0 .8em;font-size:.75rem;text-align:right;color:rgba(58,42,32,.5);}

/* reseñas — sección de prueba social */
.reviews-section{padding:5em 1.5em;max-width:1140px;margin:0 auto;}
.reviews-lead{color:var(--brown);opacity:.7;margin:.4em 0 2.4em;}

/* Muro de notitas — reseñas como notas de papel pegadas con cinta */
.reviews-board{
  columns:3 250px;column-gap:22px;
  padding:2.6em 1.8em 1.4em;
  background:radial-gradient(circle at 28% 18%, #cfa974, #b58a58);
  border-radius:26px;
  box-shadow:inset 0 2px 22px rgba(58,42,32,.28);
}
.review-note{
  break-inside:avoid;display:inline-block;width:100%;
  background:var(--note,#fdf3e0);
  border-radius:5px;
  padding:1.5em 1.4em 1.2em;
  margin:0 0 24px;
  text-align:left;
  box-shadow:0 6px 14px rgba(58,42,32,.16);
  transform:rotate(var(--rot,0deg));
  transition:transform .28s var(--ease), box-shadow .28s var(--ease);
  position:relative;cursor:default;
  outline:none;
}
.review-note::before{
  content:'';position:absolute;top:-11px;left:50%;
  width:76px;height:24px;
  transform:translateX(-50%) rotate(-4deg);
  background:linear-gradient(180deg,rgba(227,176,75,.55),rgba(227,176,75,.4));
  border-radius:2px;
  box-shadow:0 2px 5px rgba(58,42,32,.12);
}
.review-note:hover,.review-note:focus{
  transform:rotate(0deg) translateY(-8px) scale(1.035);
  box-shadow:0 20px 36px -8px rgba(58,42,32,.35);
  z-index:5;
}
.review-rating{font-size:1.15rem;letter-spacing:3px;margin-bottom:.5em;line-height:1;}
.review-note-comment{color:var(--brown);font-size:1rem;line-height:1.55;margin:0 0 .9em;}
.review-note-name{font-weight:800;font-size:.85rem;color:var(--tan-deep);}
@media (prefers-reduced-motion:reduce){
  .review-note{transition:none;}
}
@media (max-width:640px){
  .reviews-board{columns:1;}
  .review-note{transform:rotate(0deg);}
}

/* formulario de reseña en Mi cuenta */
.auth-review{margin:1.2em 0;padding:1em 1.2em;background:rgba(58,42,32,.05);border-radius:14px;}
.auth-review h3{margin:0 0 .3em;font-size:1.05rem;color:var(--brown);}
.auth-review-sub{margin:0 0 .7em;font-size:.85rem;color:var(--brown);opacity:.7;line-height:1.4;}
.auth-review-stars{display:flex;gap:4px;margin-bottom:.7em;}
.auth-review-stars button{background:none;border:none;font-size:1.9rem;line-height:1;color:#d8c3a8;cursor:pointer;padding:0;transition:color .15s;}
.auth-review-stars button.on{color:#e3b04b;}
.auth-review-text{width:100%;box-sizing:border-box;min-height:60px;resize:vertical;padding:.6em .7em;border:1.5px solid rgba(58,42,32,.2);border-radius:10px;font-family:inherit;font-size:.9rem;color:var(--brown);margin-bottom:.6em;}
.auth-review-text:focus{outline:none;border-color:var(--tan-deep);}
.auth-review-msg{font-size:.85rem;color:var(--tan-deep);font-weight:600;margin:.5em 0 0;}

/* signup success screen (replaces the form so nobody misses it) */
.auth-signup-success{text-align:center;padding:1.2em 0 .4em;}
.auth-signup-success-icon{font-size:3rem;line-height:1;margin-bottom:.3em;}
.auth-signup-success h2{margin:0 0 .6em;font-size:1.5rem;color:var(--brown);}
.auth-signup-success p{margin:0 0 1em;font-size:.95rem;line-height:1.55;color:var(--brown);}
.auth-signup-success .btn{margin-top:.4em;}
.auth-signup-waiting{
  font-size:.85rem !important;
  color:rgba(58,42,32,.6) !important;
  font-style:italic;
}
.auth-signup-dots{animation:signup-dots 1.4s steps(4,end) infinite;display:inline-block;overflow:hidden;vertical-align:bottom;}
@keyframes signup-dots{0%{width:0;}100%{width:1.2em;}}

/* referral block in the account modal */
.auth-referral{
  margin:1.2em 0;
  padding:1em 1.2em;
  background:rgba(58,42,32,.06);
  border:1.5px dashed var(--tan-deep);
  border-radius:14px;
  text-align:center;
}
.auth-referral h3{margin:0 0 .4em;font-size:1.05rem;color:var(--brown);}
.auth-referral p{margin:0 0 .6em;font-size:.88rem;line-height:1.5;color:var(--brown);}
.auth-referral-code{
  font-family:'Anton',sans-serif;
  font-size:1.5rem !important;
  letter-spacing:.08em;
  color:var(--tan-deep) !important;
  margin:.2em 0 .6em !important;
}

/* flavor-change modal (members pick next month's potes) */
.flavor-change-note{font-size:.92rem;color:var(--brown);margin:.8em 0 1em;line-height:1.5;}
.flavor-change-list{display:flex;flex-direction:column;gap:.55em;margin-bottom:.9em;}
.flavor-change-row{
  display:flex;align-items:center;justify-content:space-between;
  background:rgba(58,42,32,.06);
  border-radius:12px;
  padding:.55em .9em;
}
.flavor-change-name{font-weight:600;color:var(--brown);}
.flavor-change-count{text-align:center;font-size:.9rem;font-weight:700;color:var(--brown);margin:0 0 1em;}

.flavor-card-limon{background:radial-gradient(circle at 28% 50%, #9fd84a 0%, #0c0b0a 72%);}
.flavor-card-coco{background:radial-gradient(circle at 28% 50%, #f0894c 0%, #0c0b0a 72%);}
.flavor-card-choco{background:radial-gradient(circle at 28% 50%, #8a4a26 0%, #0c0b0a 72%);}
.flavor-card-canela{background:radial-gradient(circle at 28% 50%, #c2492f 0%, #0c0b0a 72%);}
.flavor-card-individual{background:radial-gradient(circle at 28% 50%, #8a4a26 0%, #0c0b0a 72%);}
.flavor-card-proteina{background:radial-gradient(circle at 28% 50%, #ffffff 0%, #0c0b0a 72%);}
.flavor-card-proteina h3{color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.45);}
.flavor-card-proteina .flavor-card-desc{color:var(--brown);}

@media (max-width:980px){
  .flavor-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:560px){
  .flavor-grid{grid-template-columns:1fr;}
}
@media (prefers-reduced-motion: reduce){
  .flavor-card,.flavor-card-img,.flavor-card-desc{transition:none;}
}


/* ---------- GALLERY MOSAIC ---------- */
.gallery{max-width:1180px;margin:0 auto;padding:3em 1.5em 6.5em;}
.gallery h2{
  max-width:560px;margin:0 auto 2.4em;
  font-family:'Anton',sans-serif;
  text-transform:uppercase;
  font-size:clamp(2.2rem,4vw,3.2rem);
  line-height:1.02;
}
.gallery-track{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:1.2em;
}
.gallery-item{
  margin:0;
  border-radius:var(--radius-md);
  overflow:hidden;
}
.gallery-item:nth-child(5n+1){grid-row:span 2;}
.gallery-item:nth-child(5n+2){grid-row:span 3;}
.gallery-item:nth-child(5n+3){grid-row:span 2;}
.gallery-item:nth-child(5n+4){grid-row:span 3;}
.gallery-item:nth-child(5n){grid-row:span 2;}
.gallery-track{grid-auto-rows:90px;}
.gallery-item img{width:100%;height:100%;object-fit:cover;display:block;}

@media (max-width:980px){
  .gallery-track{grid-template-columns:repeat(2,1fr);grid-auto-rows:110px;}
  .gallery-item:nth-child(5n){grid-column:span 2;grid-row:span 3;}
}
@media (max-width:560px){
  .gallery-track{grid-template-columns:1fr;grid-auto-rows:auto;}
  .gallery-item{aspect-ratio:3/4;grid-row:auto !important;}
}

.gallery-item{cursor:pointer;}
.gallery-item.is-hidden{display:none;}
.gallery-item.is-revealed{animation:settle-in .6s var(--ease) both;}

.gallery-more-wrap{display:flex;justify-content:center;margin-top:2em;}

/* ---------- LIGHTBOX ---------- */
.lightbox{
  position:fixed;inset:0;z-index:2000;
  display:flex;align-items:center;justify-content:center;
  background:rgba(26,18,12,.88);
  padding:2em;
  animation:lightbox-fade .25s var(--ease);
}
.lightbox[hidden]{display:none;}
@keyframes lightbox-fade{from{opacity:0;}to{opacity:1;}}
.lightbox img{
  max-width:min(90vw,900px);max-height:85vh;
  border-radius:var(--radius-md);
  box-shadow:0 30px 60px -20px rgba(0,0,0,.6);
}
.lightbox-close{
  position:absolute;top:1.2em;right:1.2em;
  width:44px;height:44px;border-radius:50%;
  background:rgba(253,246,234,.12);color:var(--cream);
  border:1.5px solid rgba(253,246,234,.3);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  transition:background .2s var(--ease);
}
.lightbox-close:hover{background:rgba(253,246,234,.25);}

@media (prefers-reduced-motion: reduce){
  .lightbox{animation:none;}
  .gallery-item.is-revealed{animation:none;}
}

/* ---------- INGREDIENTS ---------- */
.ingredients{max-width:1180px;margin:0 auto;padding:6.5em 1.5em;}
.ingredients .eyebrow{font-size:1rem;}
.ing-split{
  display:grid;grid-template-columns:.55fr 1.45fr;gap:2.5em;
  align-items:start;
}
.ing-split-title{
  font-family:'Anton',sans-serif;
  text-transform:uppercase;
  font-size:clamp(3.2rem,6.5vw,4.8rem);
  line-height:1.02;
  margin:.2em 0 .7em;
  color:var(--brown);
}
.ing-split-copy{color:var(--brown-soft);font-size:1.25rem;max-width:440px;line-height:1.6;}
.ing-split-lists{display:grid;grid-template-columns:1fr 1fr;gap:3.5em;}
.ing-list-block{text-align:center;}
.ing-heading-yes,.ing-heading-no{
  font-family:'Anton',sans-serif;
  font-size:clamp(2.8rem,5vw,4.2rem);
  line-height:1.02;
  letter-spacing:0;text-transform:uppercase;
  white-space:nowrap;
  margin:0 0 .7em;
}
.ing-heading-yes{color:#5d9b2a;}
.ing-heading-no{color:#c0392b;}
.ing-plain-list{
  list-style:none;padding:0;margin:0 auto;
  width:max-content;max-width:100%;
}
.ing-plain-list li{
  display:flex;align-items:flex-start;gap:.6em;
  font-weight:500;color:var(--brown-soft);font-size:1.3rem;
  margin-bottom:.9em;text-align:left;
  max-width:280px;
}
.ing-plain-list li::before{
  content:"";flex-shrink:0;width:13px;height:13px;border-radius:50%;
  margin-top:.55em;
  background:#7eb83f;
}
.ing-plain-list-no li::before{background:#c0392b;}

@media (max-width:760px){
  .ing-split{grid-template-columns:1fr;gap:2.2em;}
  .ing-split-copy{max-width:none;}
}
@media (max-width:560px){
  .ing-split-lists{grid-template-columns:1fr;gap:1.8em;}
}

/* ---------- STOCKISTS ---------- */
.stockists{max-width:980px;margin:0 auto;padding:6.5em 1.5em;}
.stockists h2{max-width:560px;margin:0 auto .6em;font-size:clamp(1.8rem,3vw,2.4rem);font-family:'Anton',sans-serif;text-transform:uppercase;}
.stockists-note{color:var(--brown-soft);font-size:.88rem;margin:0 auto 2.2em;}
.stockists-grid{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:.4em 2em;
}
.stockists-grid li{
  position:relative;padding:0;
  border-bottom:1px solid var(--line);
  margin-bottom:0;
}
.stockists-grid li::before{
  content:"";position:absolute;left:0;top:50%;width:14px;height:14px;
  transform:translateY(-50%);
  background-color:var(--tan-deep);
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5z'/%3E%3C/svg%3E");
  -webkit-mask-size:contain;mask-size:contain;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  pointer-events:none;
}
.stockists-grid li a{
  display:block;padding:.55em 0 .55em 1.5em;
  font-weight:600;font-size:.92rem;color:var(--brown-soft);
  transition:color .2s var(--ease);
}
.stockists-grid li a:hover{color:var(--tan-text);text-decoration:underline;}
.stockists-grid li:hover::before{background-color:var(--tan-text);}

@media (max-width:768px){
  .stockists-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:480px){
  .stockists-grid{grid-template-columns:1fr;}
}

/* ---------- CTA ---------- */
.cta{
  max-width:1180px;margin:0 auto;padding:6.5em 1.5em 7em;
}
.cta-inner{
  background:var(--brown);
  color:var(--cream);
  border-radius:var(--radius-lg);
  padding:3.5em 2em;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.cta-inner h2{color:var(--cream);font-size:clamp(1.8rem,3vw,2.3rem);font-family:'Anton',sans-serif;text-transform:uppercase;}
.cta-inner p{color:var(--cream-2);opacity:.85;}
.cta-actions{display:flex;gap:1em;justify-content:center;flex-wrap:wrap;margin:1.6em 0;}
.cta-inner .btn-ghost{border-color:var(--cream);color:var(--cream);}
.cta-inner .btn-ghost:hover{background:var(--cream);color:var(--brown);}
.cta-address{font-size:.9rem;opacity:.7;}

/* ---------- FOOTER ---------- */
.footer{max-width:1180px;margin:0 auto;padding:2em 1.5em 3em;}
.footer-inner{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:1.5em;}
.footer-logo{height:40px;width:auto;}
.footer-links{display:flex;gap:1.4em;flex-wrap:wrap;font-weight:700;font-size:.9rem;}
.footer-copy{margin-top:2em;font-size:.78rem;color:var(--brown-soft);opacity:.7;text-align:center;}

/* ---------- WHATSAPP FAB ---------- */
.whatsapp-fab{
  position:fixed;bottom:1.4em;right:1.4em;z-index:900;
  width:56px;height:56px;border-radius:50%;
  background:#25D366;color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 24px -6px rgba(0,0,0,.35);
  animation:pulse 4s ease-in-out infinite;
  transition:transform .25s var(--ease);
}
.whatsapp-fab:hover{transform:scale(1.1);}
@keyframes pulse{
  0%,100%{box-shadow:0 10px 24px -6px rgba(37,211,102,.35);}
  50%{box-shadow:0 10px 26px -4px rgba(37,211,102,.55);}
}

/* ---------- REVEAL ANIMATION ---------- */
.reveal{
  opacity:0;
  transform:translateY(46px) scale(.94) rotate(-1.2deg);
  transition:opacity .8s var(--ease), transform .8s var(--ease);
}
.reveal.in-view{opacity:1;transform:translateY(0) scale(1) rotate(0deg);}

/* Staggered entrance for grid/card items — each child pops in slightly
   after the previous one, instead of the whole row arriving at once. */
.pillar-grid.reveal-stagger .pillar-card,
.flavor-grid.reveal-stagger .flavor-card,
.stockists-grid.reveal-stagger > li{
  opacity:0;
  transform:translateY(46px) scale(.94) rotate(-1.2deg);
  transition:opacity .8s var(--ease), transform .8s var(--ease);
}
.pillar-grid.reveal-stagger.in-view .pillar-card,
.flavor-grid.reveal-stagger.in-view .flavor-card,
.stockists-grid.reveal-stagger.in-view > li{
  opacity:1;transform:translateY(0) scale(1) rotate(0deg);
}
.pillar-grid.reveal-stagger.in-view .pillar-card:nth-child(1){transition-delay:0s;}
.pillar-grid.reveal-stagger.in-view .pillar-card:nth-child(2){transition-delay:.1s;}
.pillar-grid.reveal-stagger.in-view .pillar-card:nth-child(3){transition-delay:.2s;}
.flavor-grid.reveal-stagger.in-view .flavor-card:nth-child(1){transition-delay:0s;}
.flavor-grid.reveal-stagger.in-view .flavor-card:nth-child(2){transition-delay:.08s;}
.flavor-grid.reveal-stagger.in-view .flavor-card:nth-child(3){transition-delay:.16s;}
.flavor-grid.reveal-stagger.in-view .flavor-card:nth-child(4){transition-delay:.24s;}
.flavor-grid.reveal-stagger.in-view .flavor-card:nth-child(5){transition-delay:.32s;}
.flavor-grid.reveal-stagger.in-view .flavor-card:nth-child(6){transition-delay:.4s;}

@media (prefers-reduced-motion: reduce){
  .reveal{transition:none;opacity:1;transform:none;}
  .pillar-grid.reveal-stagger .pillar-card,
  .flavor-grid.reveal-stagger .flavor-card,
  .stockists-grid.reveal-stagger > li{transition:none;opacity:1;transform:none;}
  .whatsapp-fab,.marquee-track,.hero-jar-img,.crumb-float,.crumb-parallax,.mission-jar,.club-hero-jar{animation:none;}
  .crumb-float{opacity:.9;transform:none;}
  .mission-jar{opacity:1;transform:none;}
  .hero-jar-slot{transition:none;}
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1480px){
  .brand-logo{height:88px;}
}
@media (max-width:980px){
  .product-grid{grid-template-columns:repeat(2,1fr);}
  .spotlight-inner{grid-template-columns:1fr;text-align:center;}
  .spotlight-art img{max-width:200px;}
  .spotlight-desc{margin:0 auto;}
}
@media (max-width:560px){
  .product-grid{grid-template-columns:1fr;}
  .ing-grid{grid-template-columns:1fr;}
  .cta-inner{padding:2.4em 1.2em;}
}

/* ============================================================
   CLUB MONK COOKIES (club.html)
   ============================================================ */

/* ---------- CLUB HERO ---------- */
.club-hero{
  position:relative;
  background:var(--brown);
  padding:5em 1.5em 4em;
  overflow:hidden;
}
.club-hero-grid{
  position:relative;z-index:1;
  max-width:1180px;margin:0 auto;
  display:grid;grid-template-columns:.9fr 1.1fr;
  align-items:center;gap:2em;
}
.club-hero-copy .eyebrow{color:var(--tan);}
.club-hero h1{color:var(--cream);font-size:clamp(2.6rem,5.4vw,4.2rem);}
.club-hero .highlight{color:var(--tan);}
.club-hero-sub{max-width:480px;color:var(--cream-2);opacity:.85;font-size:1.05rem;margin:0 0 1.4em;}
.club-price-tag{display:flex;align-items:baseline;gap:.7em;flex-wrap:wrap;}
.club-price-old{
  font-family:'Anton',sans-serif;font-size:1.5rem;color:var(--cream-2);
  opacity:.6;text-decoration:line-through;
}
.club-price-new{font-family:'Anton',sans-serif;font-size:2.6rem;color:var(--tan);}
.club-price-new small{font-family:'Poppins',sans-serif;font-size:1rem;font-weight:700;color:var(--cream-2);opacity:.8;}
.club-price-note{color:var(--cream-2);opacity:.75;font-size:.88rem;margin:.5em 0 1.6em;}

.club-hero-art{position:relative;height:380px;}
.club-hero-jar{
  position:absolute;
  top:var(--jar-top, 50%);
  left:var(--jar-left, 50%);
  width:var(--jar-width, 220px);
  z-index:var(--jar-z, 1);
  transform:translate(-50%,-50%) rotate(var(--jar-rot, 0deg));
  filter:drop-shadow(0 25px 35px rgba(0,0,0,.4));
  animation:club-jar-bob var(--jar-duration, 6s) ease-in-out infinite;
  animation-delay:var(--jar-delay, 0s);
}
@keyframes club-jar-bob{
  0%,100%{transform:translate(-50%,-50%) rotate(var(--jar-rot, 0deg)) translateY(0);}
  50%{transform:translate(-50%,-50%) rotate(var(--jar-rot, 0deg)) translateY(-12px);}
}

.club-join-btn{
  font-family:'Anton',sans-serif;
  text-transform:uppercase;
  letter-spacing:.02em;
  font-size:1.4rem;
  padding:1.1em 2.4em;
  background:var(--cream-2);
  color:var(--brown);
  border:2px solid var(--tan);
}
.club-join-btn:hover{background:var(--cream);border-color:var(--cream);color:var(--brown);}

@media (max-width:980px){
  .club-hero-grid{grid-template-columns:1fr;text-align:center;}
  .club-hero-sub{margin:0 auto 1.4em;}
  .club-price-tag,.club-hero-actions{justify-content:center;}
  .club-hero-art{order:-1;margin-bottom:1em;height:280px;}
}

/* ---------- CLUB BENEFITS ---------- */
.club-benefits{max-width:1180px;margin:0 auto;padding:6.5em 1.5em;}
.club-benefits h2{max-width:640px;margin:0 auto 2.4em;font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2rem,3.6vw,2.8rem);}
.club-benefit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.6em;}
.club-benefit-card{
  background:var(--cream-2);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:2.2em 1.6em;
  text-align:center;
  transition:transform .3s var(--ease), border-color .3s var(--ease);
}
.club-benefit-card:hover{transform:translateY(-4px);border-color:var(--tan-deep);}
.club-benefit-card .pillar-icon-wrap{margin:0 auto 1.1em;}
.club-benefit-card h3{font-size:1.1rem;}
.club-benefit-card p{color:var(--brown-soft);font-size:.92rem;}

@media (max-width:980px){
  .club-benefit-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:560px){
  .club-benefit-grid{grid-template-columns:1fr;}
}

/* ---------- CLUB STEPS ---------- */
.club-steps{max-width:1180px;margin:0 auto;padding:0 1.5em 6.5em;}
.club-steps h2{max-width:640px;margin:0 auto 2.4em;font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2rem,3.6vw,2.8rem);}
.club-step-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1.8em;}
.club-step{text-align:center;}
.club-step-num{
  display:inline-flex;align-items:center;justify-content:center;
  width:48px;height:48px;margin:0 auto .8em;
  border-radius:50%;
  background:var(--brown);color:var(--cream);
  font-family:'Anton',sans-serif;font-size:1.3rem;
}
.club-step h3{font-size:1.1rem;}
.club-step p{color:var(--brown-soft);font-size:.92rem;}

@media (max-width:1100px){
  .club-step-grid{grid-template-columns:repeat(3,1fr);gap:2.2em 1.6em;}
}
@media (max-width:980px){
  .club-step-grid{grid-template-columns:repeat(2,1fr);gap:2.2em 1.6em;}
}
@media (max-width:560px){
  .club-step-grid{grid-template-columns:1fr;}
}

/* ---------- CLUB FLAVOR SELECTOR ---------- */
.club-flavors{max-width:1540px;margin:0 auto;padding:0 1.5em 6.5em;}
.club-flavor-grid{grid-template-columns:repeat(2,1fr);max-width:980px;}
.club-flavors h2{max-width:600px;margin:0 auto .6em;font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2rem,3.6vw,2.8rem);}
.club-flavor-total{
  font-family:'Anton',sans-serif;
  font-size:1.3rem;
  color:var(--brown);
  margin:0 auto 2em;
  transition:color .25s var(--ease);
}
.club-flavor-total.is-complete{color:#5d9b2a;}
.club-flavor-total.is-over{color:#c0392b;}

.club-qty{
  display:flex;align-items:center;justify-content:center;gap:1em;
  margin-top:1.2em;
}
.club-qty-btn{
  width:38px;height:38px;flex-shrink:0;
  border-radius:50%;border:2px solid currentColor;
  background:transparent;color:#fff;
  font-family:'Anton',sans-serif;font-size:1.2rem;line-height:1;
  cursor:pointer;
  transition:transform .2s var(--ease), opacity .2s var(--ease);
}
.club-qty-btn:hover{transform:scale(1.08);}
.club-qty-btn:disabled{opacity:.3;cursor:not-allowed;transform:none;}
.club-qty-count{font-family:'Anton',sans-serif;font-size:1.6rem;color:#fff;min-width:1.4em;text-align:center;}
.flavor-card.has-qty{box-shadow:0 0 0 4px var(--tan) inset, var(--shadow-soft);}
.club-flavor-cta{margin-top:2.4em;}
.club-flavor-cta .btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none;}
.club-flavor-cta .btn:disabled:hover{transform:none;}
.club-flavor-cta-hint{margin:.8em 0 0;color:var(--brown-soft);font-size:.85rem;min-height:1.2em;}

/* ---------- CLUB FAQ ---------- */
.club-faq{max-width:760px;margin:0 auto;padding:0 1.5em 6.5em;}
.club-faq h2{margin:0 auto 2.2em;font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2rem,3.6vw,2.8rem);}
.club-faq-list{display:flex;flex-direction:column;gap:.9em;}
.club-faq-item{
  background:var(--cream-2);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:1.1em 1.4em;
}
.club-faq-item summary{
  cursor:pointer;font-weight:700;font-size:1.02rem;
  list-style:none;
  display:flex;align-items:center;justify-content:space-between;gap:1em;
}
.club-faq-item summary::-webkit-details-marker{display:none;}
.club-faq-item summary::after{
  content:"+";flex-shrink:0;
  font-family:'Anton',sans-serif;font-size:1.3rem;color:var(--tan-deep);
  transition:transform .25s var(--ease);
}
.club-faq-item[open] summary::after{transform:rotate(45deg);}
.club-faq-item p{margin:.9em 0 0;color:var(--brown-soft);}

/* ---------- CLUB SIGNUP FORM ---------- */
.club-signup{background:var(--cream-2);padding:6em 1.5em;}
.club-signup-inner{max-width:560px;margin:0 auto;text-align:center;}
.club-signup-inner h2{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2rem,3.6vw,2.8rem);}
.club-signup-sub{color:var(--brown-soft);margin:0 0 2em;}
.club-form{display:flex;flex-direction:column;gap:1.1em;text-align:left;}
.club-form-field{display:flex;flex-direction:column;gap:.4em;font-weight:700;font-size:.9rem;}
.club-form-field input{
  font-family:'Poppins',sans-serif;font-size:1rem;
  padding:.85em 1em;
  border:1.5px solid var(--line);
  border-radius:var(--radius-md);
  background:var(--cream);
  color:var(--brown);
}
.club-form-field input:focus{outline:2px solid var(--tan-deep);outline-offset:1px;}
.club-form-field input[readonly]{color:var(--brown-soft);cursor:default;}
.club-form-submit{justify-content:center;margin-top:.4em;}
.club-form-success{
  margin-top:1.6em;font-weight:700;color:var(--brown);
  background:var(--cream);border-radius:var(--radius-md);padding:1.2em;
}

@media (prefers-reduced-motion: reduce){
  .club-benefit-card,.club-faq-item summary::after{transition:none;}
}

/* ---------- CART DRAWER ---------- */
.cart-overlay{
  position:fixed;inset:0;z-index:1100;
  background:rgba(58,42,32,.45);
}
.cart-drawer{
  position:fixed;top:0;right:0;bottom:0;z-index:1101;
  width:420px;max-width:92vw;
  background:var(--cream);
  box-shadow:-12px 0 40px -10px rgba(0,0,0,.3);
  display:flex;flex-direction:column;
  transform:translateX(100%);
  transition:transform .35s var(--ease);
}
.cart-drawer.is-open{transform:translateX(0);}
.cart-drawer-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:1.2em 1.5em;
  border-bottom:1px solid var(--line);
  flex-shrink:0;
}
.cart-drawer-header h2{margin:0;font-family:'Anton',sans-serif;text-transform:uppercase;font-size:1.3rem;}
.cart-drawer-close{
  background:none;border:none;cursor:pointer;
  font-size:1.7rem;line-height:1;color:var(--brown);
  padding:0;
}
.cart-drawer-body{flex:1;overflow-y:auto;padding:1.5em;}
.cart-empty-state{text-align:center;padding:2.5em 1em;}
.cart-empty-title{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:1.3rem;margin:0 0 .4em;}
.cart-empty-sub{color:var(--brown-soft);font-size:.92rem;margin:0 0 1.6em;}
.cart-empty-shop-btn{display:inline-flex;}
.cart-item{display:flex;gap:1em;align-items:flex-start;}
.cart-item-img{
  width:64px;height:64px;object-fit:contain;flex-shrink:0;
  background:var(--cream-2);border-radius:var(--radius-md);padding:.4em;
}
.cart-item-info{flex:1;}
.cart-item-info h3{margin:0 0 .2em;font-size:1.02rem;}
.cart-item-meta{margin:0;color:var(--brown-soft);font-size:.85rem;}
.cart-item-flavors{margin:.5em 0 0;font-size:.85rem;color:var(--brown-soft);font-weight:700;}
.cart-item-price{text-align:right;flex-shrink:0;}
.cart-item-price-old{display:block;text-decoration:line-through;color:var(--brown-soft);opacity:.6;font-size:.82rem;}
.cart-item-price-new{display:block;font-weight:800;color:var(--tan-deep);}

.cart-item-extra{margin-top:1.2em;padding-top:1.2em;border-top:1px solid var(--line);}
.cart-qty-row{display:flex;align-items:center;gap:.7em;margin-top:.5em;}
.cart-qty-btn{
  width:26px;height:26px;flex-shrink:0;
  border-radius:50%;border:1.5px solid var(--brown);
  background:transparent;color:var(--brown);
  font-family:'Anton',sans-serif;font-size:1rem;line-height:1;
  cursor:pointer;
  transition:background .2s var(--ease), color .2s var(--ease);
}
.cart-qty-btn:hover{background:var(--brown);color:var(--cream);}
.cart-qty-count{font-weight:800;min-width:1.2em;text-align:center;}
.cart-item-remove{
  display:block;margin:0 0 .5em auto;
  background:none;border:none;cursor:pointer;
  font-size:.95rem;line-height:1;opacity:.6;
  transition:opacity .2s var(--ease);
}
.cart-item-remove:hover{opacity:1;}
.cart-addons{
  margin-top:1.6em;
  background:var(--cream-2);
  border-radius:var(--radius-md);
  padding:1.1em 1.2em;
}
.cart-addons-title{
  margin:0 0 .9em;text-align:center;
  font-size:.95rem;font-weight:800;color:var(--brown);
}
.cart-addon{
  display:flex;align-items:center;gap:.9em;
  padding:.8em 0;
  border-top:1px solid var(--line);
}
.cart-addon:first-of-type{border-top:none;padding-top:0;}
.cart-addon-img{
  width:48px;height:48px;flex-shrink:0;object-fit:contain;
  background:var(--cream);border-radius:var(--radius-md);padding:.3em;
}
.cart-addon-info{flex:1;}
.cart-addon-info h4{margin:0 0 .15em;font-size:.92rem;}
.cart-addon-meta{margin:0;font-size:.78rem;color:var(--brown-soft);}
.cart-addon-price{margin:.25em 0 0;display:flex;align-items:baseline;gap:.5em;}
.cart-addon-price-old{text-decoration:line-through;color:var(--brown-soft);opacity:.6;font-size:.8rem;}
.cart-addon-price-new{font-weight:800;font-size:.88rem;color:var(--tan-deep);}
.cart-addon-btn{
  flex-shrink:0;border:none;border-radius:999px;
  padding:.5em 1.1em;
  background:var(--brown);color:var(--cream);
  font-weight:700;font-size:.82rem;
  cursor:pointer;
  transition:background .2s var(--ease), transform .2s var(--ease);
}
.cart-addon-btn:hover{transform:translateY(-2px);}
.cart-addon.is-added .cart-addon-btn{background:var(--tan-deep);}

.cart-savings{
  display:inline-flex;align-items:center;gap:.45em;margin-top:1.2em;
  background:var(--cream-2);color:var(--brown);
  border:1px solid var(--tan-deep);
  border-radius:999px;padding:.5em 1em;
  font-size:.85rem;font-weight:700;
}
.cart-savings[hidden]{display:none;}
.cart-drawer-footer{border-top:1px solid var(--line);padding:1.4em 1.5em;flex-shrink:0;}
.cart-subtotal{display:flex;justify-content:space-between;font-weight:800;margin-bottom:1em;font-size:1.05rem;}
.cart-subtotal-old{text-decoration:line-through;color:var(--brown-soft);opacity:.6;font-weight:600;margin-right:.4em;}
.cart-checkout{width:100%;justify-content:center;}
.cart-clear-btn{
  display:block;width:100%;margin-top:.8em;
  background:none;border:none;
  color:var(--brown-soft);font-size:.85rem;font-weight:700;
  text-align:center;text-decoration:underline;
  cursor:pointer;
}
.cart-clear-btn:hover{color:#c0392b;}

@media (max-width:480px){
  .cart-drawer{width:100%;}
}
@media (prefers-reduced-motion: reduce){
  .cart-drawer{transition:none;}
}

/* ---------- CHECKOUT PAGE ---------- */
.checkout-page{max-width:1180px;margin:0 auto;padding:3em 1.5em 6em;}
.checkout-auth-gate{padding:3em 1.5em;text-align:center;}
.checkout-auth-gate-inner{max-width:420px;margin:0 auto;background:var(--cream-2);border-radius:var(--radius-lg);padding:2.4em 2em;}
.checkout-auth-gate-title{font-size:1.2rem;font-weight:800;color:var(--brown);margin:0 0 .6em;}
.checkout-auth-gate-sub{color:var(--brown-soft);font-size:.9rem;margin:0 0 1.6em;}
.checkout-grid.is-locked{opacity:.35;pointer-events:none;user-select:none;}
.checkout-empty{max-width:480px;margin:4em auto;}
.checkout-empty-sub{color:var(--brown-soft);margin:.6em 0 1.6em;}
.checkout-success-wrap{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 160px);padding:2em 1.5em;}
.checkout-success{max-width:440px;width:100%;text-align:center;}
.checkout-success-jars{display:flex;justify-content:center;align-items:flex-end;gap:.5em;margin:0 auto 1.4em;}
.checkout-success-jars img{width:88px;height:88px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.15));}
.checkout-success-jars img:nth-child(2){width:104px;height:104px;}
.checkout-success-title{font-size:2rem;color:var(--brown);margin:0 0 .6em;}
.checkout-success-msg{font-size:1.05rem;color:var(--brown);margin:0 0 .5em;line-height:1.6;}
.checkout-success-sub{color:var(--brown-soft);font-size:.95rem;margin:0 0 2em;}
.checkout-success-btn{display:inline-block;}
.checkout-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:3.5em;align-items:start;}
.checkout-form h1{font-size:clamp(1.8rem,3vw,2.3rem);margin-bottom:1.2em;}
.checkout-section{margin-bottom:2em;}
.checkout-section h2{font-size:1.05rem;text-transform:uppercase;letter-spacing:.04em;margin-bottom:.8em;}
.checkout-field{display:flex;flex-direction:column;gap:.4em;font-weight:700;font-size:.88rem;margin-bottom:1em;}
.checkout-field input{
  font-family:'Poppins',sans-serif;font-size:1rem;
  padding:.8em 1em;
  border:1.5px solid var(--line);
  border-radius:var(--radius-md);
  background:var(--cream);
  color:var(--brown);
}
.checkout-field input:focus{outline:2px solid var(--tan-deep);outline-offset:1px;}
.checkout-field-row{display:grid;grid-template-columns:1fr 1fr;gap:1em;}
.checkout-secure-note{color:var(--brown-soft);font-size:.85rem;margin:0 0 1em;}
.checkout-payment-methods{display:flex;flex-direction:column;gap:.7em;}
.checkout-payment-option{
  display:flex;align-items:center;gap:.9em;
  background:var(--cream-2);
  border:1.5px solid var(--line);
  border-radius:var(--radius-md);
  padding:.9em 1.1em;
  cursor:pointer;
  transition:border-color .2s var(--ease);
}
.checkout-payment-option:has(input:checked){border-color:var(--tan-deep);}
.checkout-payment-option input{width:18px;height:18px;flex-shrink:0;accent-color:var(--brown);}
.checkout-payment-label{display:flex;flex-direction:column;gap:.15em;}
.checkout-payment-label strong{font-size:.92rem;}
.checkout-payment-label small{color:var(--brown-soft);font-size:.78rem;}
.checkout-disclaimer{color:var(--brown-soft);font-size:.85rem;margin:0 0 1.4em;}
.checkout-required{color:#c0392b;}
.checkout-field input.is-invalid{border-color:#c0392b;}
.checkout-payment-methods.is-invalid .checkout-payment-option{border-color:#c0392b;}
.payment-details{margin-top:.9em;}
.payment-box{background:#fff;border:1.5px solid var(--tan,#c68b4e);border-radius:14px;padding:1em 1.1em;}
.payment-box-title{font-weight:800;font-size:.9rem;color:var(--brown,#3a2a20);margin:0 0 .7em;}
.payment-row{display:flex;justify-content:space-between;align-items:center;gap:.8em;padding:.4em 0;border-bottom:1px dashed #ece0cd;}
.payment-row:last-child{border-bottom:none;}
.payment-row .k{font-size:.75rem;color:rgba(58,42,32,.6);}
.payment-row .v{font-weight:700;font-size:.9rem;color:var(--brown,#3a2a20);word-break:break-all;text-align:right;flex:1;}
.copy-btn{background:var(--brown,#3a2a20);color:#fff;border:none;border-radius:8px;padding:.35em .8em;font-size:.72rem;font-weight:600;cursor:pointer;white-space:nowrap;font-family:inherit;}
.copy-btn.ok{background:var(--ok,#2e7d32);}
.payment-note{font-size:.8rem;color:rgba(58,42,32,.65);margin:0;line-height:1.5;}
.referral-status{font-size:.82rem;font-weight:600;margin:.5em 0 0;line-height:1.4;}
.referral-status.ok{color:#2e7d32;}
.referral-status.bad{color:#c0392b;}
.checkout-validation-error{color:#c0392b;font-weight:700;font-size:.88rem;margin:0 0 1.2em;}
.checkout-submit{width:100%;justify-content:center;}

.checkout-summary{
  background:var(--cream-2);
  border-radius:var(--radius-lg);
  padding:1.8em;
  position:sticky;top:6.5em;
}
.checkout-summary h2{font-size:1.05rem;text-transform:uppercase;letter-spacing:.04em;}
.checkout-line-item{display:flex;gap:1em;align-items:flex-start;padding:1em 0;border-top:1px solid var(--line);}
.checkout-line-item:first-of-type{border-top:none;padding-top:.6em;}
.checkout-line-item img{width:56px;height:56px;object-fit:contain;flex-shrink:0;background:var(--cream);border-radius:var(--radius-md);padding:.3em;}
.checkout-line-item-info{flex:1;}
.checkout-line-item-info h4{margin:0 0 .2em;font-size:.95rem;}
.checkout-line-item-info p{margin:0;color:var(--brown-soft);font-size:.82rem;}
.checkout-line-item-price{font-weight:800;color:var(--tan-deep);white-space:nowrap;}

/* El cupón es un beneficio del Club: oculto para el no-socio (solo lo ve y
   usa el socio activo). */
.checkout-discount{display:none;gap:.6em;margin:1.4em 0 .4em;}
body.is-club-member .checkout-discount{display:flex;}
.checkout-discount input{
  flex:1;font-family:'Poppins',sans-serif;font-size:.92rem;
  padding:.75em 1em;border:1.5px solid var(--line);border-radius:var(--radius-md);
  background:var(--cream);color:var(--brown);
}
.checkout-discount button{
  border:none;border-radius:var(--radius-md);
  padding:.75em 1.2em;background:var(--brown);color:var(--cream);
  font-weight:700;font-size:.85rem;cursor:pointer;
}
.checkout-discount-note{font-size:.82rem;color:var(--brown-soft);margin:0 0 1em;}
.checkout-discount-note.is-success{color:#3e7a1f;font-weight:700;}
.checkout-discount-note.is-error{color:#c0392b;font-weight:700;}
.checkout-coupon-row{color:#3e7a1f !important;font-weight:700;}
.checkout-coupon-row[hidden]{display:none;}

.checkout-totals{border-top:1px solid var(--line);padding-top:1.2em;margin-top:.8em;}
.checkout-totals-row{display:flex;justify-content:space-between;font-size:.92rem;margin-bottom:.7em;color:var(--brown-soft);}
.checkout-total-final{font-weight:800;font-size:1.1rem;color:var(--brown);}
.checkout-recurring{font-size:.8rem;color:var(--brown-soft);margin:.4em 0 0;}

.checkout-upsell{margin-top:1.8em;padding-top:1.4em;border-top:1px solid var(--line);}
.checkout-upsell h3{text-align:center;font-size:.95rem;margin-bottom:1em;}
.checkout-upsell-item{display:flex;align-items:center;gap:.8em;padding:.7em 0;}
.checkout-upsell-item img{width:48px;height:48px;object-fit:contain;flex-shrink:0;background:var(--cream);border-radius:var(--radius-md);padding:.3em;}
.checkout-upsell-info{flex:1;}
.checkout-upsell-info h4{margin:0 0 .15em;font-size:.88rem;}
.checkout-upsell-info p{margin:0;color:var(--brown-soft);font-size:.78rem;}
.checkout-upsell-price{display:block;margin-top:.2em;font-size:.82rem;font-weight:700;color:var(--tan-deep);}
.checkout-upsell-price s{color:var(--brown-soft);opacity:.6;margin-right:.3em;}

.checkout-reviews{margin-top:1.8em;padding-top:1.4em;border-top:1px solid var(--line);}
.checkout-reviews h3{text-align:center;font-size:.95rem;margin-bottom:.2em;}
.checkout-reviews-hint{text-align:center;font-size:.72rem;color:var(--brown-soft);opacity:.7;margin:0 0 1em;}
.checkout-review{margin-bottom:1.2em;}
.checkout-review-stars{color:var(--tan-deep);letter-spacing:.1em;}
.checkout-review p{margin:.3em 0 0;font-size:.86rem;color:var(--brown-soft);}
.checkout-review-author{font-weight:700;color:var(--brown);}

@media (max-width:980px){
  .checkout-grid{grid-template-columns:1fr;}
  .checkout-summary{position:static;}
}
@media (max-width:560px){
  .checkout-field-row{grid-template-columns:1fr;}
}

/* ---------- AUTH MODAL (login / signup / membership status) ---------- */
.auth-overlay{position:fixed;inset:0;z-index:1200;background:rgba(58,42,32,.45);}
.auth-modal{
  position:fixed;top:50%;left:50%;z-index:1201;
  width:380px;max-width:90vw;
  max-height:85vh;
  overflow-y:auto;
  background:var(--cream);
  border-radius:var(--radius-lg);
  box-shadow:0 30px 60px -15px rgba(0,0,0,.35);
  padding:2em 1.8em;
  transform:translate(-50%,-50%) scale(.94);
  opacity:0;
  pointer-events:none;
  transition:opacity .25s var(--ease), transform .25s var(--ease);
}
.auth-modal.is-open{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:auto;}
.auth-modal-close{
  position:absolute;top:1em;right:1.2em;
  background:none;border:none;cursor:pointer;
  font-size:1.6rem;line-height:1;color:var(--brown);
}
.auth-oauth{display:flex;flex-direction:column;gap:.7em;margin-bottom:1.2em;}
.auth-oauth-btn{
  display:flex;align-items:center;justify-content:center;gap:.7em;
  width:100%;padding:.75em 1em;
  border:1.5px solid var(--line);border-radius:var(--radius-md);
  background:var(--cream);color:var(--brown);
  font-family:'Poppins',sans-serif;font-weight:700;font-size:.88rem;
  cursor:pointer;transition:border-color .2s var(--ease), transform .2s var(--ease);
}
.auth-oauth-btn:hover{border-color:var(--tan-deep);transform:translateY(-2px);}
.auth-divider{
  display:flex;align-items:center;gap:.8em;
  margin:0 0 1.4em;
  color:var(--brown-soft);font-size:.78rem;
}
.auth-divider::before,.auth-divider::after{content:"";flex:1;height:1px;background:var(--line);}
.auth-tabs{display:flex;gap:.5em;margin-bottom:1.4em;}
.auth-tab{
  flex:1;padding:.7em 0;border:none;background:var(--cream-2);
  border-radius:var(--radius-md);
  font-weight:700;font-size:.88rem;color:var(--brown-soft);
  cursor:pointer;transition:background .2s var(--ease), color .2s var(--ease);
}
.auth-tab.is-active{background:var(--brown);color:var(--cream);}
.auth-form{display:flex;flex-direction:column;}
.auth-form[hidden]{display:none;}
.auth-submit{width:100%;justify-content:center;margin-top:.4em;}
.auth-error{color:#c0392b;font-size:.82rem;margin:.8em 0 0;}
.auth-note{font-size:.76rem;color:var(--brown-soft);margin:1em 0 0;}
.auth-forgot-link{
  align-self:flex-end;
  background:none;border:none;padding:0;
  margin:-.4em 0 .8em;
  font-size:.78rem;font-weight:700;color:var(--tan-deep);
  text-decoration:underline;cursor:pointer;
}
.auth-forgot-link:hover{color:var(--brown);}
.auth-email{font-weight:800;margin:0 0 .3em;}
.auth-status{color:var(--brown-soft);font-size:.9rem;margin:0 0 1.4em;}
.auth-mobile-trigger{
  background:none;border:none;text-align:left;padding:0;
  font:inherit;color:inherit;cursor:pointer;
}
.auth-orders{margin:0 0 1.4em;padding-top:1.2em;border-top:1px solid var(--line);}
.auth-orders h3{font-size:.92rem;text-transform:uppercase;letter-spacing:.03em;margin:0 0 .8em;}
.auth-orders-empty{color:var(--brown-soft);font-size:.85rem;}
.auth-order-item{
  background:var(--cream-2);border-radius:var(--radius-md);
  padding:.8em 1em;margin-bottom:.7em;font-size:.85rem;
}
.auth-order-item .auth-order-date{color:var(--brown-soft);font-size:.76rem;}
.auth-order-item .auth-order-plan{font-weight:700;margin:.2em 0;}
.auth-order-item .auth-order-total{color:var(--tan-deep);font-weight:800;}

@media (prefers-reduced-motion: reduce){
  .auth-modal{transition:none;}
}

.auth-plan-actions{display:flex;flex-direction:column;gap:.6em;margin-bottom:1em;}
.auth-plan-actions .auth-submit{font-size:.85rem;padding:.55em 1em;}
.auth-cancel-plan-btn{
  display:block;margin:.8em 0 1.4em;
  background:none;border:none;padding:0;
  font-size:.8rem;font-weight:700;color:#c0392b;
  text-decoration:underline;cursor:pointer;
}
.auth-cancel-plan-btn:hover{opacity:.8;}

/* ---------- CANCEL PLAN CONFIRMATION ---------- */
.cancel-overlay{position:fixed;inset:0;z-index:1300;background:rgba(58,42,32,.5);}
.cancel-modal{
  position:fixed;top:50%;left:50%;z-index:1301;
  width:400px;max-width:90vw;
  background:var(--cream);
  border-radius:var(--radius-lg);
  box-shadow:0 30px 60px -15px rgba(0,0,0,.35);
  padding:2em 1.8em;
  text-align:center;
  transform:translate(-50%,-50%) scale(.94);
  opacity:0;
  pointer-events:none;
  transition:opacity .25s var(--ease), transform .25s var(--ease);
}
.cancel-modal.is-open{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:auto;}
.cancel-modal h3{font-size:1.15rem;margin:0 0 .6em;}
.cancel-modal p{color:var(--brown-soft);font-size:.9rem;margin:0 0 1.4em;}
.cancel-modal-actions{display:flex;flex-direction:column;gap:.7em;}
.cancel-modal-yes{background:#c0392b;}
.cancel-modal-yes:hover{background:#a93226;}
@media (prefers-reduced-motion: reduce){
  .cancel-modal{transition:none;}
}

/* ---------- ORDER CHOICE (one-time purchase vs join the Club) ---------- */
.order-choice-overlay{position:fixed;inset:0;z-index:1200;background:rgba(58,42,32,.45);}
.order-choice-modal{
  position:fixed;top:50%;left:50%;z-index:1201;
  width:560px;max-width:92vw;
  max-height:85vh;overflow-y:auto;
  background:var(--cream);
  border-radius:var(--radius-lg);
  box-shadow:0 30px 60px -15px rgba(0,0,0,.35);
  padding:2.4em 2em;
  transform:translate(-50%,-50%) scale(.94);
  opacity:0;
  pointer-events:none;
  transition:opacity .25s var(--ease), transform .25s var(--ease);
}
.order-choice-modal.is-open{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:auto;}
.order-choice-modal h2{
  font-family:'Anton',sans-serif;text-transform:uppercase;
  font-size:clamp(1.6rem,3vw,2.1rem);margin:.2em 0 1.4em;
}
.order-choice-options{display:grid;grid-template-columns:1fr 1fr;gap:1.2em;}
.order-choice-option{
  border:1.5px solid var(--line);border-radius:var(--radius-lg);
  padding:1.6em 1.3em;text-align:center;
  display:flex;flex-direction:column;align-items:center;
}
.order-choice-option h3{font-size:1.1rem;margin:0 0 .5em;}
.order-choice-option p{color:var(--brown-soft);font-size:.85rem;margin:0 0 1.3em;flex:1;}
.order-choice-option-club{border-color:var(--tan-deep);background:var(--cream-2);}

@media (max-width:560px){
  .order-choice-options{grid-template-columns:1fr;}
}
@media (prefers-reduced-motion: reduce){
  .order-choice-modal{transition:none;}
}

/* ---------- PLAN SELECTION MODAL ---------- */
.plans-overlay{position:fixed;inset:0;z-index:1200;background:rgba(58,42,32,.45);}
.plans-modal{
  position:fixed;top:50%;left:50%;z-index:1201;
  width:920px;max-width:94vw;
  max-height:88vh;overflow-y:auto;
  background:var(--cream);
  border-radius:var(--radius-lg);
  box-shadow:0 30px 60px -15px rgba(0,0,0,.35);
  padding:2.6em 2em;
  transform:translate(-50%,-50%) scale(.94);
  opacity:0;
  pointer-events:none;
  transition:opacity .25s var(--ease), transform .25s var(--ease);
}
.plans-modal.is-open{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:auto;}
.plans-modal h2{
  font-family:'Anton',sans-serif;text-transform:uppercase;
  font-size:clamp(1.8rem,3.2vw,2.4rem);margin:.2em 0 1.6em;
}
.plans-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4em;align-items:start;}
.plan-card{
  position:relative;
  border:1.5px solid var(--line);border-radius:var(--radius-lg);
  padding:2em 1.5em;text-align:center;
  display:flex;flex-direction:column;align-items:center;
  background:var(--cream-2);
}
.plan-card-featured{border-color:var(--tan-deep);background:var(--cream);box-shadow:0 18px 40px -18px rgba(58,42,32,.3);transform:scale(1.03);}
.plan-badge{
  position:absolute;top:-14px;left:50%;transform:translateX(-50%);
  background:var(--tan-deep);color:#fff;
  font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;
  padding:.35em 1em;border-radius:999px;white-space:nowrap;
}
.plan-card h3{font-size:1.2rem;margin:0 0 .4em;}
.plan-price{font-family:'Anton',sans-serif;font-size:1.9rem;color:var(--tan-deep);margin:0 0 1em;}
.plan-price small{font-family:'Poppins',sans-serif;font-size:.85rem;font-weight:700;color:var(--brown-soft);}
.plan-price-old{
  display:block;font-family:'Poppins',sans-serif;font-size:1rem;font-weight:700;
  text-decoration:line-through;color:var(--brown-soft);opacity:.6;margin-bottom:.1em;
}
.plan-benefits{list-style:none;padding:0;margin:0 0 1.6em;display:flex;flex-direction:column;gap:.6em;flex:1;}
.plan-benefits li{
  display:flex;align-items:flex-start;gap:.5em;justify-content:center;
  color:var(--brown-soft);font-size:.88rem;text-align:left;
}
.plan-benefits li::before{content:"✓";color:var(--tan-deep);font-weight:800;flex-shrink:0;}
.plan-select-btn{width:100%;justify-content:center;}
.plans-note{text-align:center;color:var(--brown-soft);font-size:.78rem;opacity:.8;margin:1.8em 0 0;}

@media (max-width:760px){
  .plans-grid{grid-template-columns:1fr;}
  .plan-card-featured{transform:none;order:-1;}
}
@media (prefers-reduced-motion: reduce){
  .plans-modal{transition:none;}
}

/* ---------- QUIÉNES SOMOS ---------- */
.about-hero{padding:7em 5vw 3em;text-align:center;}
.about-hero-inner{max-width:700px;margin:0 auto;}
.about-hero-inner h1{
  font-family:'Anton',sans-serif;text-transform:uppercase;color:var(--brown);
  font-size:clamp(2.4rem,5vw,3.6rem);margin:.3em 0 .6em;line-height:1.05;
}
.about-hero-lead{color:var(--brown-soft);font-size:1.1rem;line-height:1.6;margin:0 auto;}

.about-section{padding:1em 5vw 3em;}
.about-section-inner{max-width:720px;margin:0 auto;}
.about-section-inner p{color:var(--brown-soft);font-size:1.02rem;line-height:1.75;text-align:center;}

.about-founder{
  display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:3vw;
  padding:3em 5vw;max-width:1100px;margin:0 auto;
}
.about-founder-text .eyebrow{color:var(--tan-text);}
.about-founder-text p:not(.eyebrow){color:var(--brown-soft);font-size:1.02rem;line-height:1.75;}
.about-founder-media{display:flex;justify-content:flex-end;}
.about-founder-img{
  width:100%;max-width:400px;height:auto;display:block;
  filter:drop-shadow(0 16px 28px rgba(60,40,20,.16));
}

.about-compromiso{background:var(--cream-2);padding:4.5em 5vw;}
.about-compromiso-inner{max-width:1000px;margin:0 auto;}
.about-compromiso .eyebrow{color:var(--tan-text);margin-bottom:1.6em;}
.compromiso-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2em;}
.compromiso-item h3{
  font-size:1.1rem;font-weight:700;color:var(--brown);margin:0 0 .5em;
  text-transform:uppercase;letter-spacing:.02em;
}
.compromiso-item p{color:var(--brown-soft);font-size:.95rem;line-height:1.6;margin:0;}

.about-quote{padding:4em 5vw;}
.about-quote blockquote{
  max-width:680px;margin:0 auto;text-align:center;
  font-family:'Anton',sans-serif;text-transform:uppercase;color:var(--brown);
  font-size:clamp(1.3rem,2.6vw,1.9rem);line-height:1.3;
}

.about-cta{padding:2em 5vw 5em;}
.about-cta-inner{
  max-width:900px;margin:0 auto;background:var(--cream-2);border-radius:var(--radius-lg);
  display:grid;grid-template-columns:auto 1fr;align-items:center;gap:2em;
  padding:2em 2.5em;
}
.about-cta-img{width:140px;height:auto;border-radius:50%;object-fit:cover;aspect-ratio:1/1;}
.about-cta-text h2{font-family:'Anton',sans-serif;text-transform:uppercase;color:var(--brown);margin:0 0 .3em;font-size:1.6rem;}
.about-cta-text p{color:var(--brown-soft);margin:0 0 1em;}

@media (max-width:760px){
  .about-founder{grid-template-columns:1fr;text-align:center;}
  .about-founder-img{max-width:240px;margin:0 auto;}
  .compromiso-grid{grid-template-columns:1fr;gap:1.6em;text-align:center;}
  .about-cta-inner{grid-template-columns:1fr;text-align:center;padding:2em 1.5em;}
  .about-cta-img{margin:0 auto;}
}

/* ---------- CURRENCY TOGGLE (USD / Bs.) ---------- */
.currency-toggle{
  display:flex;
  background:rgba(60,40,20,.08);
  border-radius:999px;
  padding:3px;
  gap:0;
  flex-shrink:0;
  align-items:center;
}
.currency-btn{
  background:none;border:none;
  padding:4px 11px;
  border-radius:999px;
  font-family:'Poppins',sans-serif;
  font-size:.74rem;font-weight:800;
  color:var(--brown-soft);
  cursor:pointer;
  letter-spacing:.05em;
  transition:background .18s var(--ease), color .18s var(--ease);
  line-height:1.4;
}
.currency-btn.is-active{
  background:var(--brown);
  color:var(--cream);
}
.currency-btn:disabled{opacity:.5;cursor:wait;}
.currency-toggle-mobile{
  margin:1em auto 0;
  width:fit-content;
  background:rgba(60,40,20,.12);
}

/* BCV rate bar — thin strip that appears below the nav in Bs. mode */
.bcv-rate-bar{
  background:var(--brown);
  color:var(--cream);
  text-align:center;
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.04em;
  padding:.38em 1em;
  opacity:.92;
}
.bcv-rate-bar[hidden]{display:none;}