/* Jenny Light — sistema de diseño compartido (extraído del home) */
:root{
  --ink:           oklch(0.20 0.025 250);
  --ink-soft:      oklch(0.38 0.020 250);
  --paper:         oklch(0.985 0.008 80);
  --paper-warm:    oklch(0.965 0.018 75);
  --line:          oklch(0.88 0.015 80);

  --brand:         oklch(0.42 0.10 240);
  --brand-deep:    oklch(0.28 0.085 245);
  --brand-soft:    oklch(0.92 0.025 240);

  --gold:          oklch(0.82 0.135 82);
  --gold-deep:     oklch(0.72 0.155 70);

  --olive:         oklch(0.55 0.075 115);
  --red:           oklch(0.55 0.180 25);
  --wa:            oklch(0.62 0.170 150);

  --shadow-1:      0 1px 2px oklch(0.20 0.025 250 / 0.06), 0 2px 8px oklch(0.20 0.025 250 / 0.04);
  --shadow-2:      0 4px 14px oklch(0.20 0.025 250 / 0.08), 0 18px 42px oklch(0.20 0.025 250 / 0.06);
  --shadow-3:      0 30px 80px oklch(0.20 0.025 250 / 0.18);

  --radius-s:      8px;
  --radius-m:      14px;
  --radius-l:      22px;
  --radius-xl:     32px;

  --ease:          cubic-bezier(0.22, 1, 0.36, 1);
  --ease-expo:     cubic-bezier(0.19, 1, 0.22, 1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  font-family:"Inter", system-ui, -apple-system, sans-serif;
  font-size:17px; line-height:1.55;
  color:var(--ink); background:var(--paper);
  font-feature-settings: "ss01", "cv11";
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; cursor:pointer; }
h1,h2,h3,h4{
  font-family:"Fraunces", Georgia, serif;
  font-weight:480;
  letter-spacing:-0.02em;
  line-height:1.06;
  font-variation-settings:"opsz" 144, "SOFT" 30;
  margin:0;
}
h1{ font-size:clamp(34px, 4.6vw, 60px); font-weight:440; line-height:1.05; }
h2{ font-size:clamp(34px, 4.8vw, 60px); font-weight:440; }
h3{ font-size:clamp(22px, 2.6vw, 30px); font-weight:500; }
.eyebrow{
  font-family:"Inter", sans-serif;
  font-size:13px; font-weight:600;
  letter-spacing:0.14em; text-transform:uppercase;
  color:var(--ink-soft);
  display:inline-flex; align-items:center; gap:10px;
}
.eyebrow::before{
  content:""; width:24px; height:1px; background:var(--gold-deep);
}

/* ===================== NAV ===================== */
.topbar{
  position:sticky; top:0; z-index:50;
  background:var(--brand-deep);
  border-bottom:1px solid color-mix(in oklch, var(--paper) 12%, transparent);
}
.nav{
  max-width:1320px; margin:0 auto;
  padding:14px 28px;
  display:grid; grid-template-columns:auto 1fr auto;
  align-items:center; gap:40px;
}
.logo{
  font-family:"Fraunces", serif;
  font-weight:430; font-size:26px;
  letter-spacing:-0.025em;
  color:var(--brand-deep);
  display:flex; align-items:center; gap:10px;
}
.logo-img img{ height:48px; width:auto; display:block; }
.logo .dot{ width:11px; height:11px; border-radius:50%; background:var(--gold-deep); transform:translateY(-6px); }
.nav-links{ display:flex; gap:28px; justify-self:center; }
.nav-links a{
  font-size:14.5px; font-weight:500;
  color:color-mix(in oklch, var(--paper) 80%, transparent);
  transition:color 0.2s var(--ease);
}
.nav-links a:hover{ color:var(--gold); }
.nav-cta{ display:flex; gap:10px; align-items:center; }
.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:11px 18px;
  border-radius:999px;
  font-weight:600; font-size:14.5px;
  border:none;
  transition:transform 0.25s var(--ease), background 0.25s var(--ease), box-shadow 0.25s var(--ease);
}
.btn:hover{ transform:translateY(-1px); }
.btn-primary{ background:var(--brand-deep); color:var(--paper); }
.btn-primary:hover{ background:oklch(0.24 0.085 245); box-shadow:var(--shadow-2); }
.btn-ghost{ background:transparent; color:var(--ink); border:1px solid var(--line); }
.btn-ghost:hover{ border-color:var(--brand-deep); color:var(--brand-deep); }
.topbar .btn-ghost{ color:color-mix(in oklch, var(--paper) 85%, transparent); border-color:color-mix(in oklch, var(--paper) 22%, transparent); }
.topbar .btn-ghost:hover{ color:var(--paper); border-color:var(--gold); background:color-mix(in oklch, var(--paper) 6%, transparent); }
.btn-wa{ background:var(--wa); color:white; }
.btn-gold{ background:var(--gold); color:var(--brand-deep); }
.btn-gold:hover{ background:var(--gold-deep); }
.btn-lg{ padding:16px 28px; font-size:15.5px; }
.btn-xl{ padding:20px 36px; font-size:16.5px; }

/* ===================== HERO ===================== */
.hero{
  position:relative;
  background:var(--paper);
  padding:48px 28px 72px;
}
.hero-grid{
  max-width:1320px; margin:0 auto;
  display:grid; grid-template-columns:1.05fr 0.95fr;
  gap:80px; align-items:center;
}
.hero-copy .eyebrow{ margin-bottom:24px; }
.hero h1 .accent{
  font-style:italic;
  font-variation-settings:"opsz" 144, "SOFT" 100;
  color:var(--brand-deep);
  position:relative;
}
.hero h1 .accent::after{
  content:""; position:absolute; left:0; right:0; bottom:0.02em;
  height:0.16em; background:var(--gold); z-index:-1; opacity:0.55;
  border-radius:2px;
}
.hero-lede{
  margin-top:20px; font-size:17px; line-height:1.5;
  color:var(--ink-soft); max-width:54ch;
}
.hero-anchor{
  margin-top:36px; padding:22px 26px;
  background:var(--paper-warm);
  border-radius:var(--radius-l);
  border:1px solid var(--line);
  display:grid; grid-template-columns:auto 1fr; gap:22px; align-items:center;
}
.price-block{
  display:flex; align-items:baseline; gap:6px;
  padding-right:22px; border-right:1px solid var(--line);
}
.price-block .from{ font-size:13px; color:var(--ink-soft); font-weight:500; }
.price-block .num{
  font-family:"Fraunces", serif; font-weight:480;
  font-size:46px; line-height:1; color:var(--brand-deep);
  letter-spacing:-0.03em;
}
.price-block .unit{ font-size:14px; color:var(--ink-soft); }
.hero-anchor .note{ font-size:13.5px; color:var(--ink-soft); line-height:1.45; }
.hero-anchor .note b{ color:var(--ink); font-weight:600; }

.hero-cta{ margin-top:28px; display:flex; gap:12px; flex-wrap:wrap; }
.hero-meta{
  margin-top:36px;
  display:flex; gap:28px; align-items:center;
  font-size:13.5px; color:var(--ink-soft);
}
.hero-meta .avatars{ display:flex; }
.hero-meta .avatars > div{
  width:34px; height:34px; border-radius:50%;
  border:2px solid var(--paper);
  background-size:cover; background-position:center;
  margin-left:-10px;
}
.hero-meta .avatars > div:first-child{ margin-left:0; }
.hero-meta .stars{ color:var(--gold-deep); letter-spacing:1.5px; }

/* Hero image */
.hero-stage{ position:relative; aspect-ratio: 4/5; }
.hero-video{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow-3);
  background:var(--brand-deep);
}
.hero-stage::after{
  content:""; position:absolute; inset:0;
  border-radius:var(--radius-xl);
  background:linear-gradient(155deg, transparent 55%, oklch(0.20 0.025 250 / 0.45));
  pointer-events:none;
}
.float-card{
  position:absolute;
  background:var(--paper);
  border-radius:var(--radius-m);
  padding:14px 18px;
  box-shadow:var(--shadow-2);
  display:flex; align-items:center; gap:12px;
}
.float-card .icon-circle{
  width:38px; height:38px; border-radius:50%;
  background:var(--brand-soft); color:var(--brand-deep);
  display:grid; place-items:center; font-weight:700;
}
.float-card .label{ font-size:11px; text-transform:uppercase; letter-spacing:0.08em; color:var(--ink-soft); }
.float-card .value{ font-family:"Fraunces",serif; font-size:22px; font-weight:500; line-height:1; }
.float-1{ top:32px; right:-22px; }
.float-2{ bottom:60px; left:-26px; }
.float-3{ bottom:-14px; right:32px; background:var(--brand-deep); color:var(--paper); }
.float-3 .label{ color:color-mix(in oklch, var(--paper) 80%, transparent); }
.float-3 .icon-circle{ background:var(--gold); color:var(--brand-deep); }

/* ===================== TRUST RIBBON ===================== */
.ribbon{
  background:var(--brand-deep); color:var(--paper);
  padding:28px 28px;
}
.ribbon-inner{
  max-width:1320px; margin:0 auto;
  display:grid; grid-template-columns:repeat(5, 1fr);
  gap:48px; align-items:center;
}
.ribbon-item{ display:flex; gap:14px; align-items:center; }
.ribbon-item .big{ font-family:"Fraunces",serif; font-size:36px; line-height:1; color:var(--gold); font-weight:500; letter-spacing:-0.03em; }
.ribbon-item .lbl{ font-size:13px; line-height:1.35; color:color-mix(in oklch, var(--paper) 80%, transparent); max-width:14ch; }
.radio-strip{
  grid-column:span 5;
  margin-top:18px; padding-top:22px;
  border-top:1px solid color-mix(in oklch, var(--paper) 18%, transparent);
  display:grid; grid-template-columns:auto 1fr; gap:32px;
  align-items:center;
}
.radio-meta{ display:flex; align-items:center; gap:14px; }
.radio-pulse{
  width:44px; height:44px; border-radius:50%;
  background:var(--gold); color:var(--brand-deep);
  display:grid; place-items:center;
  position:relative;
}
.radio-pulse::after{
  content:""; position:absolute; inset:-2px;
  border-radius:50%; border:2px solid var(--gold);
  animation:pulse 2.4s var(--ease-expo) infinite;
}
@keyframes pulse{
  0%{ transform:scale(1); opacity:0.6; }
  100%{ transform:scale(1.6); opacity:0; }
}
.radio-lbl{
  font-size:11px; text-transform:uppercase; letter-spacing:0.14em;
  color:color-mix(in oklch, var(--paper) 72%, transparent); font-weight:600;
}
.radio-station{
  font-family:"Fraunces",serif; font-size:18px; font-weight:500;
  color:var(--paper); margin-top:4px;
}
.radio-player{
  width:100%; max-width:480px;
  filter:invert(1) hue-rotate(180deg) brightness(1.15);
}

/* ===================== SECTION BASE ===================== */
section{ padding:120px 28px; }
.container{ max-width:1320px; margin:0 auto; }
.section-head{ max-width:760px; margin-bottom:64px; }
.section-head .eyebrow{ margin-bottom:20px; }
.section-head p{ font-size:18px; color:var(--ink-soft); margin:20px 0 0; max-width:60ch; }

/* ===================== CALCULATOR ===================== */
.calc-section{
  background:var(--paper-warm);
  padding-bottom:140px;
}
.calc{
  display:grid; grid-template-columns:1fr 1fr;
  gap:0; border-radius:var(--radius-xl); overflow:hidden;
  box-shadow:var(--shadow-2);
  background:var(--paper);
}
.calc-left{ padding:56px 56px; }
.calc-left h2{ font-size:clamp(28px, 3.4vw, 40px); }
.calc-left p{ color:var(--ink-soft); margin:18px 0 32px; max-width:42ch; }
.field{ margin-bottom:24px; }
.field label{ display:block; font-weight:600; font-size:14px; margin-bottom:10px; }
.field .helper{ font-size:12.5px; color:var(--ink-soft); margin-top:6px; }
.chip-row{ display:flex; flex-wrap:wrap; gap:8px; }
.chip{
  padding:10px 16px; border-radius:999px;
  border:1px solid var(--line); background:var(--paper);
  font-size:14px; font-weight:500;
  transition:all 0.25s var(--ease);
}
.chip:hover{ border-color:var(--brand); }
.chip.active{ background:var(--brand-deep); color:var(--paper); border-color:var(--brand-deep); }
.range{
  -webkit-appearance:none; appearance:none;
  width:100%; height:6px; border-radius:999px;
  background:linear-gradient(to right, var(--brand-deep) var(--p, 30%), var(--line) var(--p, 30%));
  outline:none;
}
.range::-webkit-slider-thumb{
  -webkit-appearance:none; appearance:none;
  width:24px; height:24px; border-radius:50%;
  background:var(--gold); border:3px solid var(--paper);
  box-shadow:var(--shadow-1);
}
.range-val{
  font-family:"Fraunces",serif; font-size:32px; font-weight:500;
  color:var(--brand-deep); letter-spacing:-0.02em;
}

.calc-right{
  background:var(--brand-deep); color:var(--paper);
  padding:56px 56px;
  display:flex; flex-direction:column; justify-content:space-between;
  position:relative; overflow:hidden;
}
.calc-right::before{
  content:""; position:absolute; right:-80px; top:-80px;
  width:280px; height:280px; border-radius:50%;
  background:radial-gradient(circle, var(--gold) 0%, transparent 70%);
  opacity:0.22;
}
.calc-out-lbl{ font-size:13px; text-transform:uppercase; letter-spacing:0.12em; color:color-mix(in oklch, var(--paper) 70%, transparent); }
.calc-out-num{
  font-family:"Fraunces",serif; font-weight:430;
  font-size:96px; line-height:1; letter-spacing:-0.035em;
  color:var(--gold);
  margin:6px 0 0;
}
.calc-out-sub{ font-size:14.5px; color:color-mix(in oklch, var(--paper) 78%, transparent); margin-top:6px; }
.calc-divider{ height:1px; background:color-mix(in oklch, var(--paper) 18%, transparent); margin:24px 0; }
.calc-row{ display:flex; justify-content:space-between; align-items:baseline; font-size:14.5px; padding:8px 0; }
.calc-row b{ font-family:"Fraunces",serif; font-size:22px; font-weight:480; color:var(--paper); }
.calc-cta{ margin-top:24px; display:flex; flex-direction:column; gap:10px; }

/* ===================== MENU GALLERY ===================== */
.menu-section{ background:var(--paper); }
.menu-marquee{
  margin:-60px -28px 60px;
  overflow:hidden;
  padding:18px 0;
  border-block:1px solid var(--line);
  background:var(--paper-warm);
  font-family:"Fraunces",serif; font-style:italic;
  font-size:34px; color:var(--brand-deep); letter-spacing:-0.02em;
}
.marquee-track{
  display:flex; gap:48px;
  animation: marquee 38s linear infinite;
  white-space:nowrap;
}
.marquee-track span{ display:inline-flex; align-items:center; gap:48px; }
.marquee-track .sep{ color:var(--gold-deep); }
@keyframes marquee{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}

.menu-grid{
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  grid-auto-rows:130px;
  gap:14px;
}
.dish{
  position:relative;
  border-radius:var(--radius-l); overflow:hidden;
  background-size:cover; background-position:center;
  box-shadow:var(--shadow-1);
  cursor:pointer;
  transition:transform 0.4s var(--ease), box-shadow 0.4s var(--ease);
}
.dish:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); }
.dish::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 50%, oklch(0.18 0.025 250 / 0.78));
}
.dish .caption{
  position:absolute; left:18px; right:18px; bottom:16px;
  color:var(--paper); z-index:1;
}
.dish .cat{
  font-size:11px; text-transform:uppercase; letter-spacing:0.12em;
  color:var(--gold); font-weight:600;
}
.dish .name{
  font-family:"Fraunces",serif; font-size:22px; line-height:1.1; font-weight:480;
  margin-top:4px; letter-spacing:-0.015em;
}
.d1{ grid-column:span 6; grid-row:span 3; background-image:url("https://jennylight.com.mx/wp-content/uploads/2024/02/pechuga_rellena_en_salsa_poblana.png"); }
.d2{ grid-column:span 3; grid-row:span 2; background-image:url("https://jennylight.com.mx/wp-content/uploads/2024/02/fetuccini_al_pesto.png"); }
.d3{ grid-column:span 3; grid-row:span 2; background-image:url("https://jennylight.com.mx/wp-content/uploads/2024/02/crema_de_calabaza.png"); }
.d4{ grid-column:span 3; grid-row:span 2; background-image:url("https://jennylight.com.mx/wp-content/uploads/2024/02/Filete_a_la_pimienta.png"); }
.d5{ grid-column:span 3; grid-row:span 2; background-image:url("https://jennylight.com.mx/wp-content/uploads/2024/02/Tinga_de_Pollo.png"); }
.d6{ grid-column:span 4; grid-row:span 3; background-image:url("https://jennylight.com.mx/wp-content/uploads/2024/02/Huarache_de_nopal.png"); }
.d7{ grid-column:span 4; grid-row:span 3; background-image:url("https://jennylight.com.mx/wp-content/uploads/2024/02/Atun_a_la_mexicana.png"); }
.d8{ grid-column:span 4; grid-row:span 3; background-image:url("https://jennylight.com.mx/wp-content/uploads/2024/02/lasana_de_requeson_con_espinacas.png"); }

.menu-foot{
  margin-top:36px; padding:28px 36px;
  background:var(--paper-warm);
  border-radius:var(--radius-l);
  display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap;
}
.menu-foot .left{ display:flex; gap:20px; align-items:center; }
.menu-foot .pill-row{ display:flex; gap:10px; flex-wrap:wrap; }
.pill{
  padding:7px 14px; border-radius:999px;
  background:var(--paper); border:1px solid var(--line);
  font-size:12.5px; font-weight:500; color:var(--ink-soft);
}
.pill b{ color:var(--brand-deep); font-weight:600; }

/* ===================== BRAND BEHIND THE SCENES ===================== */
.brand-section{ background:var(--paper); padding-top:80px; padding-bottom:80px; }
.brand-grid{
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  grid-auto-rows:140px;
  gap:14px;
}
.b-tile{
  border-radius:var(--radius-l);
  background-size:cover; background-position:center;
  background-color:var(--paper-warm);
  box-shadow:var(--shadow-1);
  transition:transform 0.5s var(--ease-expo);
}
.b-tile:hover{ transform:scale(1.02); }
.b1{ grid-column:span 5; grid-row:span 3; }
.b2{ grid-column:span 4; grid-row:span 2; }
.b3{ grid-column:span 3; grid-row:span 2; }
.b4{ grid-column:span 3; grid-row:span 2; }
.b5{ grid-column:span 4; grid-row:span 2; }
.b6{ grid-column:span 5; grid-row:span 3; }
.b7{ grid-column:span 4; grid-row:span 2; }
.b8{ grid-column:span 3; grid-row:span 2; }

/* ===================== TRANSFORMATIONS ===================== */
.trans-section{ background:var(--paper-warm); }
.trans-grid{
  display:grid; grid-template-columns:repeat(3, 1fr);
  gap:28px;
}
.testimonials-real{
  display:grid; grid-template-columns:repeat(4, 1fr);
  gap:20px;
}
.t-real{
  display:block; border-radius:var(--radius-l);
  overflow:hidden;
  box-shadow:var(--shadow-1);
  background:var(--paper);
  transition:transform 0.4s var(--ease), box-shadow 0.4s var(--ease);
}
.t-real:hover{ transform:translateY(-6px); box-shadow:var(--shadow-2); }
.t-real img{ width:100%; height:auto; display:block; aspect-ratio:1/1; object-fit:cover; }
.trans-card{
  background:var(--paper); border-radius:var(--radius-l);
  overflow:hidden; box-shadow:var(--shadow-1);
  transition:transform 0.4s var(--ease), box-shadow 0.4s var(--ease);
}
.trans-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); }
.trans-photo{
  position:relative;
  aspect-ratio:4/3;
  background-size:cover; background-position:center top;
  background-color:var(--paper-warm);
}
.trans-photo::after{
  content:""; position:absolute; inset:auto 0 0 0; height:50%;
  background:linear-gradient(180deg, transparent, oklch(0.18 0.025 250 / 0.45));
}
.trans-photo .badge-real{
  position:absolute; top:14px; left:14px;
  padding:5px 10px; border-radius:999px;
  background:var(--gold); color:var(--brand-deep);
  font-size:11px; font-weight:600; letter-spacing:0.08em; text-transform:uppercase;
  z-index:2;
}
.trans-body{ padding:24px 26px 28px; }
.trans-body .name{ font-family:"Fraunces",serif; font-size:22px; font-weight:500; }
.trans-body .meta{ display:flex; gap:14px; margin-top:10px; }
.trans-body .meta span{ font-size:13px; color:var(--ink-soft); display:inline-flex; align-items:center; gap:6px; }
.trans-body .meta b{ color:var(--brand-deep); font-weight:600; font-family:"Fraunces",serif; font-size:18px; }
.trans-body .quote{
  margin-top:14px; padding-top:14px;
  border-top:1px solid var(--line);
  font-size:14.5px; color:var(--ink-soft); line-height:1.5;
}
.trans-foot{
  margin-top:36px; display:flex; justify-content:space-between; align-items:center; gap:18px; flex-wrap:wrap;
  padding-top:36px; border-top:1px solid var(--line);
}
.trans-counter{
  font-family:"Fraunces",serif; font-size:18px; color:var(--ink-soft);
}
.trans-counter b{ color:var(--brand-deep); font-size:30px; font-weight:500; }

/* ===================== HOW IT WORKS ===================== */
.how-section{ background:var(--paper); }
.steps{
  display:grid; grid-template-columns:repeat(4, 1fr);
  gap:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.step{
  padding:48px 36px 56px;
  border-right:1px solid var(--line);
  position:relative;
}
.step:last-child{ border-right:none; }
.step .num{
  font-family:"Fraunces",serif; font-size:14px; font-weight:600;
  color:var(--gold-deep); letter-spacing:0.1em;
}
.step h3{ margin:18px 0 14px; }
.step p{ color:var(--ink-soft); font-size:15px; }
.step .ico{
  width:54px; height:54px; border-radius:14px;
  background:var(--brand-soft); color:var(--brand-deep);
  display:grid; place-items:center; margin-bottom:24px;
}
.step .ico svg{ width:26px; height:26px; }

/* ===================== NUTRIÓLOGAS ===================== */
.nutri-section{ background:var(--paper); }
.nutri-grid{
  display:grid; grid-template-columns:repeat(4, 1fr);
  gap:24px;
}
.nutri-card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius-l);
  overflow:hidden;
  transition:transform 0.4s var(--ease), box-shadow 0.4s var(--ease), border-color 0.4s var(--ease);
}
.nutri-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-2);
  border-color:var(--brand-deep);
}
.nutri-photo{
  aspect-ratio:1/1;
  background-size:cover; background-position:center top;
  background-color:var(--paper-warm);
}
.nutri-body{ padding:20px 22px 24px; }
.nutri-name{
  font-family:"Fraunces",serif; font-size:22px; font-weight:500;
  letter-spacing:-0.015em; color:var(--brand-deep);
}
.nutri-suc{
  font-size:12.5px; font-weight:600;
  color:var(--gold-deep); margin-top:4px;
  text-transform:uppercase; letter-spacing:0.06em;
}
.nutri-bio{
  margin:14px 0 0; font-size:13.5px; line-height:1.5;
  color:var(--ink-soft);
}
.nutri-cta{
  margin-top:48px; display:flex; gap:12px; justify-content:center; flex-wrap:wrap;
  padding-top:40px; border-top:1px solid var(--line);
}

/* ===================== VS COMPARE ===================== */
.vs-section{ background:var(--brand-deep); color:var(--paper); }
.vs-section .eyebrow{ color:var(--gold); }
.vs-section .eyebrow::before{ background:var(--gold); }
.vs-section h2{ color:var(--paper); }
.vs-section .section-head p{ color:color-mix(in oklch, var(--paper) 75%, transparent); }
.vs-table{
  background:color-mix(in oklch, var(--paper) 6%, transparent);
  border-radius:var(--radius-l);
  border:1px solid color-mix(in oklch, var(--paper) 14%, transparent);
  overflow:hidden;
}
.vs-row{
  display:grid; grid-template-columns:1.4fr repeat(4, 1fr);
  border-top:1px solid color-mix(in oklch, var(--paper) 10%, transparent);
}
.vs-row:first-child{ border-top:none; background:color-mix(in oklch, var(--paper) 6%, transparent); }
.vs-cell{
  padding:22px 24px; font-size:14.5px;
  display:flex; align-items:center; gap:8px;
}
.vs-cell.head{ font-family:"Fraunces",serif; font-size:20px; font-weight:500; }
.vs-cell.jl{ background:color-mix(in oklch, var(--gold) 14%, transparent); }
.vs-cell.jl.head{ color:var(--gold); }
.vs-cell .ok{ color:var(--gold); font-weight:700; }
.vs-cell .no{ color:color-mix(in oklch, var(--paper) 45%, transparent); }
.vs-cell .feat{ color:color-mix(in oklch, var(--paper) 80%, transparent); }

/* ===================== BRANCHES ===================== */
.branches-section{ background:var(--paper-warm); }
.branches{
  display:grid; grid-template-columns:1fr 1.4fr;
  gap:48px;
}
.branch-list .branch{
  display:grid; grid-template-columns:auto 1fr auto;
  gap:20px; align-items:center;
  padding:22px 0;
  border-bottom:1px solid var(--line);
  cursor:pointer;
  transition:padding 0.3s var(--ease);
}
.branch:hover{ padding-left:8px; }
.branch:first-child{ padding-top:0; }
.branch .marker{
  width:44px; height:44px; border-radius:50%;
  background:var(--brand-soft); color:var(--brand-deep);
  display:grid; place-items:center;
  font-family:"Fraunces",serif; font-weight:500; font-size:18px;
}
.branch.active .marker{ background:var(--gold); }
.branch .info .nm{ font-family:"Fraunces",serif; font-size:20px; font-weight:500; }
.branch .info .ad{ font-size:13.5px; color:var(--ink-soft); margin-top:4px; }
.branch .actions{ display:flex; gap:8px; }
.branch .actions .ic{
  width:38px; height:38px; border-radius:50%;
  display:grid; place-items:center;
  border:1px solid var(--line);
  transition:all 0.25s var(--ease);
}
.branch .actions .ic:hover{ border-color:var(--brand-deep); background:var(--brand-deep); color:var(--paper); }
.branch .actions .ic.wa{ background:var(--wa); color:var(--paper); border-color:var(--wa); }
.branches-map{
  background:var(--brand-deep);
  border-radius:var(--radius-xl);
  min-height:560px;
  background-image:
    linear-gradient(155deg, oklch(0.20 0.08 245 / 0.55), oklch(0.28 0.085 245 / 0.75)),
    url("https://jennylight.com.mx/wp-content/uploads/2024/02/bg-2-scaled-1.jpg");
  background-size:cover; background-position:center;
  position:relative;
}
.branches-map::after{
  content:""; position:absolute; inset:0;
  background:radial-gradient(ellipse at center, transparent 0%, oklch(0.28 0.085 245 / 0.55) 100%);
  border-radius:var(--radius-xl);
}
.map-pin{
  position:absolute;
  width:44px; height:44px; border-radius:50% 50% 50% 0;
  background:var(--gold);
  transform:rotate(-45deg);
  display:grid; place-items:center;
  box-shadow:0 6px 20px oklch(0.20 0.025 250 / 0.4);
}
.map-pin span{
  transform:rotate(45deg);
  font-family:"Fraunces",serif; font-weight:500; font-size:14px; color:var(--brand-deep);
}
.pin-1{ top:32%; left:24%; }
.pin-2{ top:52%; left:42%; }
.pin-3{ top:68%; left:36%; }
.pin-4{ top:38%; left:62%; }
.pin-5{ top:58%; left:74%; }

/* ===================== URGENCY / GUARANTEE ===================== */
.guarantee-section{ background:var(--paper); }
.guarantee-card{
  background:var(--paper-warm);
  border-radius:var(--radius-xl);
  padding:56px 56px;
  display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center;
  border:1px solid var(--line);
}
.guarantee-card .badge{
  display:inline-flex; align-items:center; gap:10px;
  padding:8px 14px; border-radius:999px;
  background:var(--gold); color:var(--brand-deep);
  font-size:12.5px; font-weight:600; letter-spacing:0.05em; text-transform:uppercase;
}
.guarantee-card h2{ margin-top:18px; }
.guarantee-card p{ color:var(--ink-soft); margin-top:18px; max-width:46ch; }
.guarantee-bullets{ margin-top:24px; list-style:none; padding:0; }
.guarantee-bullets li{
  display:flex; gap:12px; align-items:flex-start;
  padding:10px 0; font-size:15px;
}
.guarantee-bullets li svg{ flex-shrink:0; margin-top:3px; color:var(--gold-deep); }
.urgency{
  background:var(--brand-deep); color:var(--paper);
  border-radius:var(--radius-l);
  padding:36px 36px;
  text-align:center;
}
.urgency .lbl{ font-size:12px; text-transform:uppercase; letter-spacing:0.14em; color:var(--gold); font-weight:600; }
.urgency .countdown{
  margin:18px 0;
  font-family:"Fraunces",serif; font-weight:430;
  font-size:64px; line-height:1; color:var(--paper);
  letter-spacing:-0.04em;
  display:flex; gap:10px; justify-content:center; align-items:baseline;
}
.urgency .countdown small{ font-size:14px; color:color-mix(in oklch, var(--paper) 60%, transparent); font-weight:500; letter-spacing:0.05em; text-transform:uppercase; }
.urgency .countdown .col{ display:flex; flex-direction:column; align-items:center; gap:4px; }
.urgency p{ font-size:14.5px; color:color-mix(in oklch, var(--paper) 78%, transparent); margin:18px 0 24px; }
.urgency .btn{ width:100%; justify-content:center; }

/* ===================== FAQ ===================== */
.faq-section{ background:var(--paper-warm); }
.faq{
  max-width:920px;
  margin:0 auto;
  border-top:1px solid var(--line);
}
.faq details{
  border-bottom:1px solid var(--line);
  padding:0;
}
.faq summary{
  list-style:none; cursor:pointer;
  padding:28px 8px;
  display:flex; justify-content:space-between; align-items:center; gap:24px;
  font-family:"Fraunces",serif; font-size:22px; font-weight:500;
  letter-spacing:-0.015em;
  transition:padding 0.3s var(--ease);
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:""; flex-shrink:0;
  width:32px; height:32px; border-radius:50%;
  background:var(--paper); border:1px solid var(--line);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%231b3a5a' stroke-width='2.4'><line x1='12' y1='5' x2='12' y2='19'/><line x1='5' y1='12' x2='19' y2='12'/></svg>");
  background-repeat:no-repeat; background-position:center;
  transition:transform 0.3s var(--ease), background-color 0.3s var(--ease);
}
.faq details[open] summary::after{ transform:rotate(45deg); background-color:var(--gold); }
.faq details[open] summary{ padding-bottom:10px; }
.faq .body{
  padding:0 8px 28px;
  color:var(--ink-soft); font-size:16px; line-height:1.6;
  max-width:72ch;
}

/* ===================== CLOSING CTA ===================== */
.close-section{
  background:linear-gradient(180deg, var(--paper) 0%, var(--paper-warm) 100%);
  padding-bottom:140px;
}
.close{
  text-align:center; max-width:880px; margin:0 auto;
  padding:88px 32px;
  border:1px solid var(--line);
  border-radius:var(--radius-xl);
  background:var(--paper);
  position:relative; overflow:hidden;
  box-shadow:var(--shadow-2);
}
.close::before{
  content:""; position:absolute; top:-100px; left:50%; transform:translateX(-50%);
  width:600px; height:600px; border-radius:50%;
  background:radial-gradient(circle, var(--gold) 0%, transparent 65%);
  opacity:0.18; z-index:0;
}
.close > *{ position:relative; z-index:1; }
.close h2{ font-size:clamp(40px, 5.4vw, 72px); }
.close h2 .it{ font-style:italic; font-variation-settings:"opsz" 144, "SOFT" 100; color:var(--brand-deep); }
.close p{ margin-top:20px; color:var(--ink-soft); font-size:18px; max-width:50ch; margin-inline:auto; }
.close-cta{ margin-top:36px; display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.close-trust{ margin-top:28px; font-size:13px; color:var(--ink-soft); }

/* ===================== FOOTER ===================== */
footer{
  background:var(--brand-deep); color:color-mix(in oklch, var(--paper) 75%, transparent);
  padding:80px 28px 40px;
}
.foot-grid{
  max-width:1320px; margin:0 auto;
  display:grid; grid-template-columns:1.8fr 1fr 1fr 1fr 1fr;
  gap:40px;
}
.foot-grid h4{
  font-family:"Inter",sans-serif; font-size:13px; font-weight:600;
  letter-spacing:0.1em; text-transform:uppercase;
  color:var(--gold); margin-bottom:16px;
}
.foot-grid a{ display:block; font-size:14px; padding:5px 0; }
.foot-grid a:hover{ color:var(--paper); }
.foot-grid .logo{ color:var(--paper); margin-bottom:18px; }
.foot-grid p{ font-size:14px; max-width:38ch; }
.foot-base{
  max-width:1320px; margin:48px auto 0;
  padding-top:24px;
  border-top:1px solid color-mix(in oklch, var(--paper) 15%, transparent);
  display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap;
  font-size:12.5px;
}

/* ===================== STICKY MOBILE BAR ===================== */
.mob-bar{
  position:fixed; left:0; right:0; bottom:0; z-index:60;
  display:none;
  background:var(--paper);
  border-top:1px solid var(--line);
  padding:10px 14px calc(10px + env(safe-area-inset-bottom));
  box-shadow:0 -10px 30px oklch(0.20 0.025 250 / 0.14);
  gap:12px;
  align-items:stretch;
}
.mob-bar .price-tag{
  display:flex; flex-direction:column; justify-content:center;
  padding:4px 14px 4px 4px;
  border-right:1px solid var(--line);
  flex-shrink:0;
}
.mob-bar .price-tag small{
  font-size:9.5px; color:var(--ink-soft);
  text-transform:uppercase; letter-spacing:0.1em;
  line-height:1; margin-bottom:4px; font-weight:600;
}
.mob-bar .price-tag b{
  font-family:"Fraunces",serif; font-size:22px; font-weight:500;
  color:var(--brand-deep); line-height:1; letter-spacing:-0.02em;
}
.mob-bar .price-tag .unit{
  font-size:11px; color:var(--ink-soft);
  font-family:"Inter",sans-serif; font-weight:500;
  margin-left:2px;
}
.mob-bar .mob-cta{
  flex:1; justify-content:center; gap:10px;
  padding:0 18px; font-size:16px; font-weight:700;
  min-height:56px;
  border-radius:16px;
  letter-spacing:-0.005em;
  white-space:nowrap;
  box-shadow:0 6px 18px oklch(0.62 0.170 150 / 0.35);
  position:relative;
}
.mob-bar .mob-cta::after{
  content:""; position:absolute; inset:0;
  border-radius:inherit;
  background:linear-gradient(180deg, oklch(1 0 0 / 0.12), transparent 50%);
  pointer-events:none;
}

/* Nav WhatsApp button (top) — responsive labels */
.nav-wa{ white-space:nowrap; }
.nav-wa .lbl-short{ display:none; }
.nav-wa svg{ flex-shrink:0; }

/* ===================== RESPONSIVE ===================== */
@media (max-width: 1080px){
  .hero-grid{ grid-template-columns:1fr; gap:48px; }
  .hero-stage{ aspect-ratio: 3/4; max-width:520px; margin:0 auto; }
  .calc{ grid-template-columns:1fr; }
  .ribbon-inner{ grid-template-columns:repeat(3, 1fr); gap:24px; }
  .radio-strip{ grid-column:span 3; grid-template-columns:1fr; gap:14px; }
  .steps{ grid-template-columns:repeat(2, 1fr); }
  .step:nth-child(2){ border-right:none; }
  .step:nth-child(1), .step:nth-child(2){ border-bottom:1px solid var(--line); }
  .trans-grid{ grid-template-columns:repeat(2, 1fr); }
  .testimonials-real{ grid-template-columns:repeat(2, 1fr); }
  .nutri-grid{ grid-template-columns:repeat(3, 1fr); }
  .brand-grid{ grid-auto-rows:110px; gap:10px; }
  .b1, .b6{ grid-column:span 12; grid-row:span 3; }
  .b2, .b5, .b7{ grid-column:span 6; grid-row:span 2; }
  .b3, .b4, .b8{ grid-column:span 6; grid-row:span 2; }
  .branches{ grid-template-columns:1fr; }
  .guarantee-card{ grid-template-columns:1fr; gap:36px; }
  .menu-grid{ grid-auto-rows:110px; gap:10px; }
  .d1, .d6, .d7, .d8{ grid-column:span 12; grid-row:span 3; }
  .d2, .d3, .d4, .d5{ grid-column:span 6; grid-row:span 2; }
  .vs-row{ grid-template-columns:1.2fr repeat(2, 1fr); }
  .vs-row .vs-cell:nth-child(4), .vs-row .vs-cell:nth-child(5){ display:none; }
  .foot-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width: 720px){
  body{ font-size:16px; padding-bottom:90px; }
  section{ padding:64px 18px; }
  .nav{ padding:10px 14px; gap:12px; grid-template-columns:auto 1fr auto; }
  .nav-links{ display:none; }
  .nav-cta .btn-ghost{ display:none; }
  .nav-wa{
    padding:11px 16px; font-size:14px; font-weight:700;
    gap:7px; letter-spacing:-0.005em;
    border-radius:999px;
    box-shadow:0 4px 12px oklch(0.62 0.170 150 / 0.32);
  }
  .nav-wa .lbl-full{ display:none; }
  .nav-wa .lbl-short{ display:inline; }
  .logo{ font-size:22px; }
  .hero{ padding:24px 18px 56px; }
  .hero-grid{ gap:32px; }
  h1{ font-size:30px; line-height:1.08; }
  .hero-lede{ font-size:16px; margin-top:16px; }
  .hero-anchor{ grid-template-columns:1fr; gap:12px; padding:18px 20px; }
  .price-block{ border-right:none; border-bottom:1px solid var(--line); padding-right:0; padding-bottom:12px; }
  .price-block .num{ font-size:40px; }
  .hero-cta{ flex-direction:column; margin-top:22px; gap:10px; }
  .hero-cta .btn{ width:100%; justify-content:center; padding:18px; font-size:16px; min-height:54px; font-weight:700; }
  .hero-meta{ margin-top:24px; }
  .hero-stage{ aspect-ratio:4/3; max-width:none; }
  .float-1, .float-2, .float-3{ display:none; }
  .ribbon{ padding:20px 18px; }
  .ribbon-inner{ grid-template-columns:repeat(2, 1fr); gap:14px; }
  .ribbon-item{ gap:10px; }
  .ribbon-item .big{ font-size:28px; }
  .ribbon-item .lbl{ font-size:12px; }
  .calc-left, .calc-right{ padding:32px 22px; }
  .calc-out-num{ font-size:64px; }
  .chip{ padding:12px 16px; font-size:14px; min-height:44px; }
  .section-head{ margin-bottom:40px; }
  h2{ font-size:28px; }
  .menu-marquee{ font-size:24px; margin:-40px -18px 40px; }
  .menu-grid{ grid-auto-rows:90px; gap:8px; }
  .menu-foot{ padding:22px 22px; flex-direction:column; align-items:stretch; gap:14px; }
  .menu-foot .btn{ width:100%; justify-content:center; }
  .menu-foot:last-child{ padding:0; }
  .trans-grid{ grid-template-columns:1fr; gap:18px; }
  .testimonials-real{ grid-template-columns:repeat(2, 1fr); gap:12px; }
  .nutri-grid{ grid-template-columns:repeat(2, 1fr); gap:14px; }
  .nutri-body{ padding:16px 16px 18px; }
  .nutri-name{ font-size:18px; }
  .nutri-bio{ font-size:12.5px; }
  .nutri-cta{ flex-direction:column; }
  .nutri-cta .btn{ width:100%; justify-content:center; }
  .brand-grid{ grid-auto-rows:90px; gap:8px; }
  .logo-img img{ height:38px; }
  .steps{ grid-template-columns:1fr; }
  .step{ padding:32px 24px; border-right:none; border-bottom:1px solid var(--line); }
  .step:last-child{ border-bottom:none; }
  .branches{ gap:24px; }
  .branch{ padding:18px 0; }
  .branches-map{ min-height:280px; }
  .guarantee-card{ padding:32px 22px; gap:28px; }
  .urgency{ padding:28px 22px; }
  .urgency .lbl{ font-size:11px; }
  .faq summary{ font-size:18px; padding:22px 4px; gap:12px; }
  .faq .body{ font-size:15px; padding:0 4px 22px; }
  .close{ padding:48px 22px; }
  .close h2{ font-size:32px; }
  .close-cta{ flex-direction:column; gap:10px; }
  .close-cta .btn{ width:100%; justify-content:center; min-height:54px; font-weight:700; }
  .foot-grid{ grid-template-columns:1fr; gap:32px; }
  .vs-cell{ padding:16px 14px; font-size:13.5px; }
  .vs-cell.head{ font-size:16px !important; }
  .mob-bar{ display:flex; }
}
