@font-face{
  font-family:'TAN Nimbus';
  src:url('../assets/fonts/TAN-NIMBUS.woff2') format('woff2'),
      url('../assets/fonts/TAN-NIMBUS.woff') format('woff');
  font-weight:normal;font-style:normal;font-display:swap;
}
:root{
  --blanco:#FFFFFF;
  --papel:#FBFAF7;
  --verde-oscuro:#13322B;
  --verde:#009963;
  --naranja:#F2961D;
  --naranja-d:#D96831;
  --gris-verde:#92BAC3;
  --ink:#22433B;
  --radius:22px;
  --display:'TAN Nimbus', Georgia, serif;
  --script:'Mr Dafoe', cursive;
  --body:'Montserrat', system-ui, sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}
body{
  font-family:var(--body);
  color:var(--verde-oscuro);
  background:var(--blanco);
  line-height:1.6;
  font-size:16px;
  overflow-x:hidden;
}
/* textura de papel sutil (Agrega Textura — manual p.31) */
.paper{position:relative}
.paper::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.35;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.07 0 0 0 0 0.2 0 0 0 0 0.17 0 0 0 0.045 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
img{display:block;max-width:100%}
a{color:inherit}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
.eyebrow{font-family:var(--script);font-size:clamp(1.7rem,3.2vw,2.4rem);color:var(--verde);line-height:1;display:block;transform:rotate(-2deg);transform-origin:left}
h1,h2{font-family:var(--display);font-weight:normal;line-height:1.04;letter-spacing:.5px}
h1{font-size:clamp(2.6rem,6vw,4.6rem)}
h2{font-size:clamp(2rem,4vw,3rem)}
p.lead{font-size:clamp(1rem,1.5vw,1.15rem);max-width:34em}
strong{font-weight:700}

/* ===== pixel checker (Mundo Digital — manual p.29) ===== */
.pixels{display:grid;grid-template-columns:repeat(4,26px);grid-auto-rows:26px;gap:0}
.pixels span{display:block}
.px-d{background:var(--verde-oscuro)}
.px-m{background:#577c6e}
.px-l{background:#cfe0d6}
.px-g{background:var(--verde)}

/* ===== NAV ===== */
nav{
  position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);
  backdrop-filter:blur(8px);border-bottom:1px solid #eef0ec;
}
.nav-in{display:flex;align-items:center;justify-content:space-between;padding:10px 24px;max-width:1160px;margin:0 auto}
.nav-logo img{height:56px;width:auto}
.nav-links{display:flex;gap:28px;align-items:center;font-size:.85rem;font-weight:600}
.nav-links a.lnk{text-decoration:none;color:var(--verde-oscuro)}
.nav-links a.lnk:hover{color:var(--verde)}
@media(max-width:760px){.nav-links a.lnk{display:none}}
.btn{
  display:inline-flex;align-items:center;gap:10px;justify-content:center;
  font-family:var(--body);font-weight:700;font-size:.95rem;text-decoration:none;
  background:var(--naranja);color:#fff;padding:14px 28px;border-radius:999px;
  box-shadow:0 4px 0 var(--naranja-d);transition:transform .15s ease, box-shadow .15s ease;
}
.btn:hover{transform:translateY(2px);box-shadow:0 2px 0 var(--naranja-d)}
.btn.small{padding:10px 20px;font-size:.85rem}
.btn.ghost{background:transparent;color:var(--verde-oscuro);box-shadow:inset 0 0 0 2px var(--verde-oscuro)}
.btn.ghost:hover{background:var(--verde-oscuro);color:#fff}

/* ===== HERO ===== */
.hero{padding:64px 0 40px;position:relative;overflow:hidden;background:var(--papel)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
@media(max-width:880px){.hero-grid{grid-template-columns:1fr}}
.pill{
  display:inline-flex;align-items:center;gap:8px;background:var(--verde);color:#fff;
  font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  padding:8px 18px;border-radius:999px;margin-bottom:18px;
}
.pill .dot{width:8px;height:8px;border-radius:50%;background:#fff;animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.hero h1 .sc{font-family:var(--script);color:var(--verde);font-size:.78em;display:block;transform:rotate(-2deg);margin-bottom:.06em}
.hero p.lead{margin:22px 0 28px}
.store-badges{display:flex;gap:10px;flex-wrap:nowrap;margin-bottom:14px}
.store{
  display:inline-flex;align-items:center;gap:8px;background:var(--verde-oscuro);color:#fff;
  text-decoration:none;padding:10px 16px 10px 14px;border-radius:14px;flex:1;
  transition:transform .15s ease,background .15s ease;
}
.store:hover{transform:translateY(-2px);background:#0c241f}
.store svg{flex:0 0 26px}
.store .t{line-height:1.15}
.store .t small{display:block;font-size:.62rem;letter-spacing:.06em;opacity:.85;text-transform:uppercase}
.store .t b{font-size:1.02rem;font-weight:600;font-family:var(--body)}
.hero-note{font-size:.78rem;color:#5d736c}
.hero-visual{position:relative;max-width:430px;margin:0 auto;width:100%}
.hero-photo{
  border-radius:var(--radius);overflow:hidden;box-shadow:0 24px 60px rgba(19,50,43,.18);
  transform:rotate(1.2deg);aspect-ratio:4/5;
}
.hero-photo img{width:100%;height:100%;object-fit:cover}
.hero-pixels-tr{position:absolute;top:-26px;right:-12px;z-index:2}
.hero-pixels-bl{position:absolute;bottom:-20px;left:-26px;z-index:2}
.hero-char{position:absolute;left:-34px;top:34%;width:130px;filter:drop-shadow(0 6px 0 rgba(19,50,43,.08));z-index:3}
.bubble{
  position:absolute;left:-58px;top:8%;background:#fff;border:3px solid var(--verde-oscuro);
  border-radius:24px;padding:10px 18px;z-index:4;transform:rotate(-4deg);
  box-shadow:4px 4px 0 rgba(19,50,43,.12);
}
.bubble::after{
  content:"";position:absolute;bottom:-14px;left:34px;width:16px;height:16px;background:#fff;
  border-right:3px solid var(--verde-oscuro);border-bottom:3px solid var(--verde-oscuro);
  transform:rotate(45deg) skew(8deg,8deg);
}
.bubble .l1{font-family:var(--script);color:var(--verde);font-size:1.25rem;line-height:1;display:block}
.bubble .l2{font-family:var(--display);font-size:1.05rem;line-height:1.05;display:block}
@media(max-width:880px){
  .hero-visual{max-width:480px}
  .hero-photo{aspect-ratio:1/1}
  .hero-char{left:auto;right:-8px;top:auto;bottom:-14px;width:100px}
  .bubble{left:auto;right:86px;top:auto;bottom:92px}
  .hero-pixels-bl{display:none}
  .hero-pixels-tr{top:-20px;right:-6px}
}

/* ===== MARQUEE ===== */
.marquee{background:var(--verde-oscuro);color:#fff;overflow:hidden;padding:14px 0;white-space:nowrap}
.marquee .track{display:inline-block;animation:slide 26s linear infinite}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.marquee span{font-family:var(--display);font-size:1.15rem;letter-spacing:.08em;padding:0 26px}
.marquee i{font-style:normal;color:var(--naranja)}

/* ===== SECCIONES ===== */
section{padding:84px 0}
.sec-head{text-align:center;margin-bottom:54px}
.sec-head .eyebrow{display:inline-block}
.sec-head p{max-width:46em;margin:14px auto 0;color:var(--ink)}

/* pasos */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
@media(max-width:980px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.steps{grid-template-columns:1fr}}
.step{
  background:var(--papel);border-radius:var(--radius);padding:32px 26px 28px;position:relative;
  border:1px solid #edf0ea;
}
.step .num{
  font-family:var(--display);font-size:2.4rem;color:var(--naranja);line-height:1;
  display:block;margin-bottom:14px;
}
.step h3{font-family:var(--body);font-weight:700;font-size:1.05rem;margin-bottom:8px}
.step p{font-size:.92rem;color:var(--ink)}
.step svg.ic{position:absolute;top:26px;right:24px;width:34px;height:34px;stroke:var(--verde);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}

/* platillos */
.menu-sec{background:var(--papel)}
.dishes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:880px){.dishes{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.dishes{grid-template-columns:1fr}}
.dish{
  background:#fff;border-radius:var(--radius);overflow:hidden;border:1px solid #edf0ea;
  transition:transform .2s ease, box-shadow .2s ease;
}
.dish:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(19,50,43,.12)}
.dish img{aspect-ratio:1/1;object-fit:cover;width:100%}
.dish .info{padding:16px 18px 18px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.dish .info h3{font-family:var(--body);font-weight:700;font-size:.95rem;line-height:1.3}
.chip{font-size:.68rem;font-weight:700;letter-spacing:.04em;background:#e7f5ef;color:var(--verde);padding:5px 11px;border-radius:999px;white-space:nowrap}
.dish.more{
  background:var(--verde);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:36px 28px;gap:14px;border:none;
}
.dish.more .big{font-family:var(--display);font-size:2.6rem;line-height:1}
.dish.more p{font-size:.95rem;max-width:18em}
.dish.more a{color:#fff;font-weight:700;text-decoration:underline;text-underline-offset:4px}

/* por qué */
.why{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
@media(max-width:980px){.why{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.why{grid-template-columns:1fr}}
.why .card{padding:8px 6px}
.why h3{font-family:var(--display);font-size:1.35rem;margin:16px 0 8px;font-weight:normal}
.why p{font-size:.92rem;color:var(--ink)}
.why .ico{
  width:62px;height:62px;border-radius:18px;background:var(--papel);border:2px solid var(--verde-oscuro);
  display:flex;align-items:center;justify-content:center;box-shadow:4px 4px 0 rgba(19,50,43,.12);
}
.why .ico svg{width:32px;height:32px;stroke:var(--verde-oscuro);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}

/* oferta */
.offer{background:var(--verde-oscuro);color:#fff;position:relative;overflow:hidden}
.offer .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:54px;align-items:center;position:relative;z-index:2}
@media(max-width:880px){.offer .wrap{grid-template-columns:1fr}}
.offer .eyebrow{color:#7fd4b3}
.offer h2{color:#fff}
.offer .nums{display:flex;align-items:center;gap:22px;margin:26px 0 10px;flex-wrap:wrap}
.offer .nums .n{font-family:var(--display);font-size:clamp(3.4rem,7vw,5.2rem);line-height:1}
.offer .nums .n small{font-size:.34em;vertical-align:super}
.offer .nums .sep{width:2px;height:74px;background:rgba(255,255,255,.35)}
.offer .sub{font-weight:600;letter-spacing:.04em;font-size:1.05rem}
.offer .fine{font-size:.74rem;opacity:.65;margin-top:18px;max-width:34em}
.offer .btn{margin-top:26px}
.offer-pixels{position:absolute;top:0;right:0;opacity:.9}
.phone{
  width:min(290px,80%);margin:0 auto;background:#0c241f;border-radius:42px;padding:12px;
  box-shadow:0 30px 70px rgba(0,0,0,.4);transform:rotate(2deg);
}
.phone .screen{border-radius:32px;overflow:hidden}
.phone img{width:100%}

/* cobertura */
.cover{background:var(--papel)}
.cover-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;max-width:880px;margin:0 auto}
@media(max-width:720px){.cover-grid{grid-template-columns:1fr}}
.cover .mode{
  background:#fff;border:2px solid var(--verde-oscuro);border-radius:var(--radius);
  padding:30px 28px;box-shadow:6px 6px 0 rgba(19,50,43,.12);
}
.cover .mode h3{font-family:var(--display);font-size:1.4rem;font-weight:normal;margin-bottom:8px;display:flex;align-items:center;gap:12px}
.cover .mode h3 svg{width:30px;height:30px;stroke:var(--verde);stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
.cover .mode p{font-size:.93rem;color:var(--ink)}
.cover .wait{
  text-align:center;margin-top:34px;font-size:.92rem;color:var(--ink);
}
.cover .wait a{color:var(--verde);font-weight:700}

/* video */
.video-sec{padding:54px 0 72px}
.video-wrap{
  position:relative;padding-bottom:56.25%;height:0;overflow:hidden;
  border-radius:var(--radius);box-shadow:0 24px 60px rgba(19,50,43,.18);
  max-width:900px;margin:0 auto;
}
.video-wrap iframe{
  position:absolute;top:0;left:0;width:100%;height:100%;border:0;
}

/* subs info */
.subs-info{padding:0 0 64px}
.subs-box{
  max-width:760px;margin:0 auto;display:flex;gap:20px;align-items:flex-start;
  background:var(--papel);border:2px solid #d6e8e2;border-radius:var(--radius);
  padding:28px 32px;
}
.subs-icon{
  flex:0 0 28px;width:28px;height:28px;margin-top:2px;
  stroke:var(--verde);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;
}
.subs-box div{display:flex;flex-direction:column;gap:12px}
.subs-box p{font-size:.92rem;color:var(--ink);line-height:1.65}
@media(max-width:560px){
  .subs-box{flex-direction:column;gap:14px;padding:22px 20px}
  .subs-icon{display:none}
}

/* FAQ */
.faq-list{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.faq-item{
  background:#fff;border:2px solid var(--verde-oscuro);border-radius:var(--radius);
  overflow:hidden;box-shadow:4px 4px 0 rgba(19,50,43,.1);
}
.faq-item summary{
  list-style:none;cursor:pointer;display:flex;justify-content:space-between;
  align-items:center;gap:16px;padding:22px 26px;
  font-weight:700;font-size:.98rem;transition:background .15s ease;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{
  content:"+";font-size:1.5rem;font-weight:300;line-height:1;flex-shrink:0;
  color:var(--verde);transition:transform .25s ease;
}
.faq-item[open]>summary{background:var(--papel)}
.faq-item[open]>summary::after{transform:rotate(45deg)}
.faq-item>p{
  padding:0 26px 22px;font-size:.92rem;color:var(--ink);
  border-top:1px solid #edf0ea;padding-top:16px;
}

/* CTA final */
.final{text-align:center;position:relative;overflow:hidden}
.final .chars{display:flex;justify-content:center;gap:8px;margin-bottom:10px}
.final .chars img{width:96px}
.final .chars img:nth-child(2){width:104px;margin-top:-8px}
.final h2 .sc{font-family:var(--script);color:var(--verde);font-size:.8em;display:block;transform:rotate(-2deg)}
.final .store-badges{justify-content:center;margin-top:30px}
.final .slog{font-family:var(--display);font-size:clamp(1rem,4.8vw,2.8rem);margin-top:26px;display:block;letter-spacing:.02em;line-height:1}
.final .slog .s-good{color:var(--naranja)}
.final .slog .s-food{color:var(--verde)}
.final .slog .s-every{color:var(--verde-oscuro)}

/* footer */
footer{background:var(--verde-oscuro);color:#cfe0d6;padding:54px 0 30px;font-size:.85rem}
.f-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:34px;margin-bottom:38px}
@media(max-width:720px){
  .f-grid{grid-template-columns:1fr}
  .f-grid>div:first-child{display:none}
}
footer h4{font-family:var(--display);color:#fff;font-weight:normal;font-size:1.1rem;margin-bottom:14px}
footer a{color:#cfe0d6;text-decoration:none}
footer a:hover{color:#fff;text-decoration:underline}
footer ul{list-style:none}
footer li{margin-bottom:8px}
.social-row{display:flex;align-items:center;gap:12px;margin-top:4px}
.f-logo-mobile{display:none;width:110px;height:auto;background:#fff;border-radius:12px;padding:6px 12px}
.f-tagline-mobile{display:none;margin-top:14px;font-size:.82rem;color:#cfe0d6;line-height:1.5}
@media(max-width:720px){
  .f-logo-mobile{display:block}
  .f-tagline-mobile{display:block}
}
.social-icons{display:flex;gap:12px}
.social-icons a{
  display:flex;align-items:center;justify-content:center;
  width:42px;height:42px;border-radius:12px;
  background:rgba(255,255,255,.1);color:#cfe0d6;
  transition:background .15s ease,color .15s ease;
}
.social-icons a:hover{background:var(--verde);color:#fff}
.social-icons svg{width:22px;height:22px}
.f-bottom{border-top:1px solid rgba(255,255,255,.14);padding-top:22px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:.78rem;opacity:.85}
.f-legal{display:flex;gap:20px;flex-wrap:wrap}
.f-logo{height:40px;width:auto;background:#fff;border-radius:10px;padding:6px 14px;margin-bottom:14px}

/* reveal */
.rv{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s ease}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){.rv{opacity:1;transform:none}}
:focus-visible{outline:3px solid var(--naranja);outline-offset:3px;border-radius:6px}