/* =====================================================================
   Zaalas — Portada / Home (v0.17.0).
   Capa de secciones propias de la home. Reutiliza tokens.css + experiencia.css
   (nav, .eyebrow, .disp, .band, .editorial, .btn, .foot, .reveal). Aquí solo van
   las piezas nuevas: hero de portada, producto destacado, valores, sobre, footer
   con NAP, y el estado revelado de .reveal (sin GSAP; IntersectionObserver).
   ===================================================================== */

/* Accesibilidad: salto al contenido */
.inlab-skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--negro);color:#FFFFFE;
  padding:10px 16px;border-radius:0 0 8px 0;font-family:'Poppins',sans-serif;font-size:.85rem}
.inlab-skip:focus{left:0}

/* Reveal on-scroll (equivalente ligero al motion de la experiencia, sin GSAP) */
.reveal{opacity:0;transform:translateY(40px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.is-visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ── HERO de portada (foto ambiente full-bleed + copy) ─────────────── */
.home-hero{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden;background:#000}
.home-hero__media{position:absolute;inset:0;z-index:0}
.home-hero__media img{width:100%;height:100%;object-fit:cover}
.home-hero::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.4) 42%,rgba(0,0,0,.12) 100%)}
.home-hero__copy{position:relative;z-index:2;max-width:var(--maxw);width:100%;margin:0 auto;padding:0 7vw;color:#FFFFFE}
.home-hero .eyebrow{display:inline-flex;align-items:center;margin-bottom:20px;color:#FFFFFE}
.home-hero .eyebrow::before{content:"";width:24px;height:2px;background:var(--rojo);display:inline-block;margin-right:12px}
.home-hero h1{font-size:clamp(2.3rem,6.2vw,4.8rem);max-width:16ch;margin:0}
.home-hero h1 em.red{color:#FFFFFE;font-weight:700}
.home-hero .sub{margin:22px 0 0;max-width:46ch;font-size:clamp(1rem,1.4vw,1.18rem);font-weight:300;color:#f0ede5}
.home-hero__actions{margin-top:38px}
.home-hero .btn{margin-top:0}
.home-hero .scrollcue{color:#FFFFFE;opacity:.85}
.home-hero .scrollcue i{width:1px;height:36px;background:#FFFFFE;display:block}

/* ── PRODUCTO DESTACADO ────────────────────────────────────────────── */
.feature{padding:16vh 0;background:var(--blanco)}
.feature__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:7vw;align-items:center}
.feature__media{aspect-ratio:4/3;overflow:hidden;border-radius:8px;background:#f0ede5;box-shadow:0 30px 60px rgba(0,0,0,.08)}
.feature__media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.feature__media a:hover img{transform:scale(1.04)}
.feature__copy .eyebrow{display:block;margin-bottom:18px}
.feature__copy h2{font-size:clamp(2rem,5vw,4rem);margin:0}
.feature__tag{margin:10px 0 0;font-family:'Poppins',sans-serif;font-weight:500;font-size:.72rem;
  letter-spacing:.22em;text-transform:uppercase;color:var(--gris)}
.feature__copy p:not(.feature__tag):not(.feature__price):not(.feature__cta){margin-top:22px;max-width:42ch;color:#2d3b32;font-weight:300;font-size:1.05rem}
.feature__price{margin-top:20px;font-family:'Poppins',sans-serif;font-weight:600;font-size:1.2rem;color:var(--negro)}
.feature__cta{margin:0}
.feature__cta .btn{margin-top:30px}

/* ── PROPUESTAS DE VALOR ───────────────────────────────────────────── */
.values{padding:14vh 0;background:var(--grisc)}
.values h2{font-size:clamp(1.9rem,4.6vw,3.4rem);margin-bottom:clamp(34px,5vw,56px);max-width:14ch}
.values__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,38px)}
.values__item{padding-top:20px;border-top:2px solid var(--rojo)}
.values__k{display:block;font-family:'Poppins',sans-serif;font-weight:600;font-size:1.05rem;margin-bottom:8px;color:var(--negro)}
.values__item p{color:#2d3b32;font-weight:300;font-size:.98rem;margin:0}

/* ── CATÁLOGO + ENTREGA INMEDIATA (declaración centrada) ───────────── */
.home-claim{padding:16vh 0;background:var(--blanco);text-align:center}
.home-claim .eyebrow{display:block;margin-bottom:22px}
.home-claim h2{font-size:clamp(2rem,5.4vw,4.2rem);max-width:18ch;margin:0 auto}
.home-claim h2 em{font-style:normal;color:var(--rojo);font-weight:500}
.home-claim .lead{margin:28px auto 0;max-width:52ch;color:#2d3b32;font-weight:300;font-size:1.1rem}
.home-claim .lead strong{font-weight:600;color:var(--negro)}

/* ── SOBRE LA MARCA / SEO LOCAL ────────────────────────────────────── */
.about{padding:16vh 0;background:var(--blanco)}
.about .eyebrow{display:block;margin-bottom:24px}
.about h2{font-size:clamp(1.9rem,5vw,3.8rem);max-width:16ch}
.about .lead{margin-top:28px;max-width:60ch;color:#2d3b32;font-weight:300;font-size:1.08rem}
.about .lead strong{font-weight:600;color:var(--negro)}

/* ── FRANJA: ENTREGAS CON CALENDARIO (beneficio premium, fondo claro) ── */
.home-strip{background:var(--grisc);color:var(--negro);padding:clamp(28px,4vw,40px) 0;border-block:1px solid #e7e2d8}
.home-strip .wrap{display:flex;align-items:center;justify-content:center;gap:18px;text-align:center;flex-wrap:wrap}
.home-strip__icon{width:42px;height:42px;flex:0 0 auto;border-radius:50%;border:2px solid var(--rojo);
  display:flex;align-items:center;justify-content:center;color:var(--rojo)}
.home-strip__t{font-family:'Poppins',sans-serif;font-weight:500;font-size:clamp(1.05rem,2.2vw,1.4rem);letter-spacing:-.01em}
.home-strip__t em{font-style:normal;color:var(--rojo);font-weight:600}
.home-strip__s{display:block;font-family:'Lato',sans-serif;font-weight:300;font-size:.95rem;color:#5c5c5f;margin-top:2px;letter-spacing:0}
@media(max-width:560px){ .home-strip .wrap{flex-direction:column;gap:10px} }

/* Banda full-bleed reutilizada de la experiencia: optimiza el repintado del blur */
.inlab-home-page .band__media img,
.inlab-home-page .band__cap{will-change:filter,opacity}

/* ── RESPONSIVE ────────────────────────────────────────────────────── */
@media(max-width:980px){
  .values__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:820px){
  .home-hero::after{background:linear-gradient(180deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,.55) 100%)}
  .feature__grid{grid-template-columns:1fr;gap:40px}
  .home-foot__grid{grid-template-columns:1fr;gap:36px}
}
@media(max-width:560px){
  .values__grid{grid-template-columns:1fr}
}

/* Nota de cobertura del asterisco "Envíos a todo México*" (copy v0.22.0) */
.home-hero__fn{margin:.4rem 0 0;font-size:.8rem;line-height:1.4;color:var(--gris,#8c8c90)}
.values__item small,.about small{display:inline-block;margin-top:.15rem;font-size:.82em;color:var(--gris,#8c8c90)}

/* ── Sección Contacto (formulario AJAX → hola@) v0.23.0 ───────────── */
.home-contact{padding:16vh 0;background:var(--grisc)}
.home-contact .lead{margin-bottom:8px}
.contact-form{max-width:680px;margin-top:30px}
.contact-form__grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.contact-form__field{display:flex;flex-direction:column;gap:6px;font-family:'Poppins',sans-serif;font-weight:500;font-size:.72rem;letter-spacing:.04em;color:#878f88}
.contact-form__field--wide{grid-column:1/-1}
.contact-form__opt{font-weight:400;text-transform:none;letter-spacing:0;color:var(--gris)}
.contact-form input,.contact-form textarea{font-family:'Lato',system-ui,sans-serif;font-size:1rem;color:var(--negro);padding:.78em .9em;border:1px solid rgba(45,59,50,.16);border-radius:8px;background:#FFFFFE;width:100%}
.contact-form textarea{resize:vertical;min-height:120px;line-height:1.5}
.contact-form input:focus-visible,.contact-form textarea:focus-visible{outline:2px solid var(--rojo);outline-offset:1px;border-color:var(--rojo)}
.contact-form input.has-error,.contact-form textarea.has-error{border-color:var(--error);background:rgba(181,82,63,.04)}
.contact-form__hp{position:absolute!important;left:-9999px!important;top:auto;width:1px;height:1px;overflow:hidden}
.contact-form__foot{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:20px}
.contact-form__msg{margin:0;font-family:'Lato',system-ui,sans-serif;font-size:.92rem;line-height:1.4}
.contact-form__msg.is-ok{color:#1a7f37}
.contact-form__msg.is-err{color:var(--error)}
@media(max-width:560px){ .contact-form__grid{grid-template-columns:1fr} }

/* ===== MÓVIL: espaciado vertical de sección más compacto (menos scroll) v0.25.1 =====
   Recorte ~38% (≤768) / ~44% (≤480). Solo responsive — desktop intacto. */
@media(max-width:768px){
  .feature,.home-claim,.about,.home-contact{padding:10vh 0}
  .values{padding:9vh 0}
}
@media(max-width:480px){
  .feature,.home-claim,.about,.home-contact{padding:9vh 0}
  .values{padding:8vh 0}
}