/* Tienditas · landing (prueba de 15 días y planes Gratis y Full). Reutiliza los tokens de landing.css y marca.css (verde #1E4D2B). Mobile first. */
.landing-unico { --u-verde: #1E4D2B; --u-acento: #b8d8bf; --u-suave: #f1f7f2; --u-tinta: #14321f; }
.landing-unico h1, .landing-unico h2, .landing-unico h3 { text-wrap: balance; }
.landing-unico .btn-grande { min-height: 60px; padding: 0 34px; font-size: 18px; }
.landing-unico .btn-green { background: var(--u-verde); color: #fff; }
.landing-unico .u-hero .btn-green, .landing-unico .u-precio .btn-green { box-shadow: 0 12px 30px #0000003d; }
.landing-unico .u-hero .btn-green { background: #fff; color: var(--u-verde); }
.landing-unico .u-hero .btn-green:hover { background: var(--u-suave); }
.landing-unico .btn-green:hover { background: #2a6a3c; color: #fff; }
.landing-unico .u-hero .btn-green:hover { color: var(--u-verde); }

/* 1 · Hero */
.u-hero { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(28px, 5vw, 70px); align-items: center; margin-top: -76px; padding: calc(76px + clamp(40px, 6vw, 90px)) clamp(16px, 6vw, 90px) clamp(48px, 7vw, 96px); background: var(--u-verde); color: #fff; }
.u-hero > * { min-width: 0; }
.u-hero h1 { margin: 20px 0 20px; font-size: clamp(36px, 5vw, 68px); line-height: 1.04; letter-spacing: -.045em; font-weight: 700; }
.u-hero h1 em { color: var(--u-acento); }
.u-hero .lead { max-width: 540px; margin-bottom: 0; color: #e3eee6; }
.u-hero-acciones { margin: 30px 0 14px; }
.u-hero-nota { margin: 0; font-size: 14px; color: #cfe0d3; }
.u-hero-chico { grid-template-columns: 1fr; padding-bottom: clamp(40px, 5vw, 70px); }
.u-hero-chico h1 { margin-top: 8px; }
.u-hero-media { position: relative; aspect-ratio: 4 / 5; }
.u-hero { overflow-x: clip; }
/* Más color: halo de tonos cálidos y fríos detrás, saturación y marco en el video. */
.u-hero-media::before { content: ""; position: absolute; inset: -7% -9%; z-index: 0; border-radius: 44px; pointer-events: none;
  background: radial-gradient(58% 48% at 18% 12%, #fbbf24b3, transparent 70%), radial-gradient(52% 46% at 86% 20%, #f472b6a6, transparent 70%), radial-gradient(60% 50% at 78% 88%, #38bdf8b3, transparent 70%), radial-gradient(46% 40% at 12% 86%, #a3e635a6, transparent 70%);
  filter: blur(22px); opacity: 1; }
.u-hero-video { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; object-fit: cover; border-radius: var(--radius); background: #16281d; filter: saturate(1.45) contrast(1.07) brightness(1.05); box-shadow: 0 0 0 3px #ffffff40, 0 26px 60px #00000052; }
.u-hero-media::after { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: var(--radius); pointer-events: none;
  background: linear-gradient(155deg, #fbbf2430 0%, transparent 42%, #38bdf82e 100%); mix-blend-mode: soft-light; }
.u-hero-media .float-card { z-index: 3; }

/* Rubros */
.u-rubros { background: #fff; }

/* Secciones */
.u-seccion { padding: clamp(56px, 8vw, 110px) clamp(16px, 6vw, 90px); }
.u-cabecera { max-width: 720px; margin: 0 auto clamp(30px, 4vw, 50px); text-align: center; }
.u-cabecera h1, .u-cabecera h2, .u-porque h2 { margin: 0 0 12px; font-size: clamp(30px, 4.4vw, 54px); line-height: 1.06; letter-spacing: -.04em; font-weight: 700; color: var(--u-tinta); }
.u-cabecera em, .u-porque h2 em, .u-precio h2 em, .u-conf-caja h2 em, .u-faq h1 em, .u-faq h2 em { color: var(--u-verde); }
.landing-unico .kicker { color: var(--u-verde); }
.u-ico { flex: none; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: var(--u-verde); color: #fff; }
.u-centro { margin: clamp(26px, 4vw, 44px) 0 0; text-align: center; }

/* 2 · ¿Por qué? */
.u-porque { background: var(--u-suave); }
.u-porque-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: clamp(28px, 5vw, 80px); align-items: center; max-width: 1200px; margin: 0 auto; }
.u-beneficios { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 28px; margin: 30px 0 0; padding: 0; list-style: none; }
.u-beneficios li { display: flex; gap: 14px; align-items: flex-start; }
.u-beneficios b, .u-beneficios small { display: block; }
.u-beneficios b { margin-bottom: 3px; font-size: 18px; color: var(--u-tinta); }
.u-beneficios small { font-size: 15px; line-height: 1.5; color: #3f5646; }
.u-mockup { display: grid; place-items: center; }
.u-celu { position: relative; width: min(260px, 100%); padding: 14px; border: 8px solid var(--u-verde); border-radius: 36px; background: #fff; box-shadow: 0 26px 50px #1e4d2b33; }
.u-celu-barra { display: grid; place-items: center; height: 18px; margin-bottom: 8px; }
.u-celu-barra span { width: 60px; height: 6px; border-radius: 6px; background: #d3e1d6; }
.u-celu-url { margin: 0 0 12px; padding: 7px 12px; border-radius: 999px; background: var(--u-suave); font: 600 12px ui-monospace, Menlo, Consolas, monospace; color: var(--u-tinta); }
.u-celu-url i { font-style: normal; margin-right: 4px; }
.u-celu-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 12px; }
.u-celu-grid span { aspect-ratio: 1; border-radius: 14px; background: linear-gradient(135deg, #dcead0, #b8d8bf); }
.u-celu-grid span:nth-child(2) { background: linear-gradient(135deg, #e9efe9, #cfd9d1); }
.u-celu-grid span:nth-child(3) { background: linear-gradient(135deg, #cfe3d4, #9fc4aa); }
.u-celu-venta { display: grid; gap: 2px; margin-top: 8px; padding: 10px 14px; border-radius: 14px; background: var(--u-verde); color: #fff; }
.u-celu-venta small { color: #d8e8dc; }
.u-celu-venta-online { background: var(--u-suave); color: var(--u-tinta); border: 1.5px solid var(--u-verde); }
.u-celu-venta-online small { color: #3f5646; }

/* 3 · Pasos */
.u-pasos-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; max-width: 1100px; margin: 0 auto; padding: 0; list-style: none; }
.u-paso { overflow: hidden; border: 1px solid #d7e4da; border-radius: 26px; background: #fff; }
.u-paso h3 { margin: 20px 24px 6px; font-size: 22px; letter-spacing: -.02em; color: var(--u-tinta); }
.u-paso p { margin: 0 24px 26px; line-height: 1.55; color: #3f5646; }
.u-paso-arte { display: grid; place-items: center; height: 150px; background: linear-gradient(135deg, #dcead0, #b8d8bf); }
.u-paso-arte.paso-b { background: linear-gradient(135deg, #cfe3d4, #9fc4aa); }
.u-paso-arte.paso-c { background: linear-gradient(135deg, var(--u-verde), #2f6b40); }
.u-paso-arte span { font-size: 64px; font-weight: 800; letter-spacing: -.05em; line-height: 1; color: var(--u-verde); }
.u-paso-arte.paso-c span { color: #fff; }

/* 4 · Funcionalidades */
.u-funciones { background: #fff; }
.u-oferta-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; max-width: 1100px; margin: 0 auto; padding: 0; list-style: none; }
.u-oferta { --c: var(--u-verde); display: flex; flex-direction: column; padding: 24px; border: 1px solid #dfeadf; border-top: 5px solid var(--c); border-radius: 24px; background: #fff; box-shadow: 0 12px 32px #1e4d2b14; }
.u-oferta.c1 { --c: #1E4D2B; } .u-oferta.c2 { --c: #0E7490; } .u-oferta.c3 { --c: #B45309; }
.u-oferta.c4 { --c: #4F46E5; } .u-oferta.c5 { --c: #BE185D; } .u-oferta.c6 { --c: #3F6212; }
.u-oferta .u-ico { width: 56px; height: 56px; margin-bottom: 14px; background: var(--c); }
.u-oferta h3 { margin: 0 0 4px; font-size: 21px; letter-spacing: -.02em; color: var(--u-tinta); }
.u-oferta > p { margin: 0 0 12px; line-height: 1.5; color: #3f5646; }
.u-oferta ul { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }
.u-oferta ul li { position: relative; padding-left: 22px; line-height: 1.45; color: #243b2c; }
.u-oferta ul li::before { content: ""; position: absolute; left: 0; top: .5em; width: 10px; height: 10px; border-radius: 50%; background: var(--c); }
.u-func-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; max-width: 1000px; margin: 0 auto; padding: 0; list-style: none; text-align: center; }
.u-func-grid li { padding: 10px 14px; }
.u-func-grid .u-ico { margin: 0 auto 16px; width: 64px; height: 64px; border-radius: 20px; }
.u-func-grid h3 { margin: 0 0 6px; font-size: 22px; letter-spacing: -.02em; color: var(--u-tinta); }
.u-func-grid p { margin: 0; line-height: 1.55; color: #3f5646; }

/* 5 · Confianza */
.u-confianza { padding: 0 clamp(12px, 3vw, 28px); }
.u-conf-caja { max-width: 1100px; margin: clamp(10px, 3vw, 30px) auto clamp(56px, 8vw, 100px); padding: clamp(32px, 5vw, 64px); border-radius: 36px; background: radial-gradient(circle at 90% 0, #b8d8bf2e 0, transparent 45%), var(--u-verde); color: #fff; }
.u-conf-caja .kicker { color: var(--u-acento); }
.u-conf-caja h2 { margin: 0 0 24px; font-size: clamp(28px, 3.8vw, 46px); line-height: 1.08; letter-spacing: -.04em; }
.u-conf-caja h2 em { color: var(--u-acento); }
.u-conf-caja ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 28px; margin: 0 0 24px; padding: 0; list-style: none; }
.u-conf-caja li { display: flex; gap: 14px; align-items: flex-start; font-size: 17px; line-height: 1.5; }
.u-conf-caja li span { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: #ffffff1f; }
.u-conf-caja .text-link { color: var(--u-acento); text-decoration: underline; }

/* 6 · Precio */
.u-precio { padding: 0 clamp(16px, 6vw, 90px) clamp(56px, 8vw, 100px); }
.u-precio-card { max-width: 560px; margin: 0 auto; padding: clamp(28px, 5vw, 48px); border: 3px solid var(--u-verde); border-radius: 36px; background: #fff; box-shadow: 0 30px 60px #1e4d2b26; text-align: center; }
.u-pildora { display: inline-block; margin: 0 0 12px; padding: 6px 16px; border-radius: 999px; background: var(--u-suave); color: var(--u-verde); font-size: 14px; font-weight: 800; letter-spacing: .04em; }
.u-precio h2 { margin: 0 0 10px; font-size: clamp(28px, 4vw, 40px); line-height: 1.08; letter-spacing: -.04em; color: var(--u-tinta); }
.u-precio-monto { display: flex; align-items: baseline; justify-content: center; gap: 8px; margin: 0; color: var(--u-tinta); }
.u-precio-monto b { font-size: clamp(60px, 14vw, 88px); line-height: 1; letter-spacing: -.05em; }
.u-precio-monto span { font-size: 20px; font-weight: 600; color: #3f5646; }
.u-precio-prueba { margin: 6px 0 24px; font-weight: 800; color: var(--u-verde); }
.u-lista { display: grid; gap: 12px; margin: 0 0 28px; padding: 0; list-style: none; text-align: left; }
.u-lista li { display: flex; gap: 12px; align-items: flex-start; line-height: 1.45; color: var(--u-tinta); }
.u-lista li span { flex: none; display: grid; place-items: center; width: 24px; height: 24px; margin-top: 1px; border-radius: 50%; background: var(--u-suave); color: var(--u-verde); }
.u-lista svg { width: 16px; height: 16px; }
.u-precio-card small { display: block; margin-top: 14px; color: #3f5646; }

/* 7 · FAQ */
.u-faq { background: var(--u-suave); }
.u-faq .section-head { max-width: 860px; margin-inline: auto; }
.u-faq .section-head h1, .u-faq .section-head h2 { margin: 0 0 12px; font-size: clamp(30px, 4.4vw, 54px); line-height: 1.06; letter-spacing: -.04em; color: var(--u-tinta); }
.u-faq .faq-list { margin-inline: auto; }
.u-mas { margin: 10px 0 0; text-align: center; }
.u-mas a { color: var(--u-verde); font-weight: 800; }

@media (max-width: 1040px) {
  .u-hero { grid-template-columns: 1fr; }
  /* Marco vertical 9/16 como el video, para ver el cuadro completo en celular y tablet. */
  .u-hero-media { width: 100%; max-width: 320px; margin: 0 auto; aspect-ratio: 9 / 16; }
  .u-porque-grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .u-hero h1 { font-size: clamp(34px, 10vw, 44px); }
  .u-hero-acciones .btn { width: 100%; }
  .u-beneficios, .u-conf-caja ul { grid-template-columns: 1fr; }
  .u-pasos-grid, .u-func-grid, .u-oferta-grid { grid-template-columns: 1fr; }
  .u-paso-arte { height: 110px; }
  .u-paso-arte span { font-size: 48px; }
  .u-conf-caja { border-radius: 28px; }
  .u-precio-card { border-radius: 28px; }
  .float-sale { left: 10px; bottom: 14px; }
  .float-stock { right: 10px; top: 14px; }
  .landing-unico .wa-flotante span { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  /* Con movimiento reducido el video no se reproduce: queda la portada quieta. */
  .u-hero-media { background: #16281d; border-radius: var(--radius); }
}
.landing-unico .nav-actions .btn { white-space: nowrap; }
.u-hero-chico + .u-precio { padding-top: clamp(32px, 5vw, 56px); }

/* Pie: enlaces legales chicos y discretos (términos, privacidad, arrepentimiento y baja). */
.landing-unico .footer-legal { display: flex; flex-wrap: wrap; gap: 4px 6px; margin-top: 10px; font-size: 12px; line-height: 1.6; }
.landing-unico .footer-legal a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.landing-unico .footer-legal nav[aria-label="Derechos y condiciones"] { display: inline; padding: 0; border: 0; background: none; color: inherit; font-size: inherit; }
.landing-unico .footer-legal nav[aria-label="Derechos y condiciones"] a { color: inherit; font-weight: 400; }

/* Encabezado limpio: sin sombra ni halo detrás del logo. */
.landing-unico .nav { box-shadow: none; backdrop-filter: none; }
.landing-unico .brand-logo { box-shadow: none; filter: none; }

/* Pie en verde Tienditas (la landing no depende de las revisiones de color de DEV/QA). */
.landing-unico .footer { background: var(--u-verde); color: #e3eee6; }
.landing-unico .footer-top { border-bottom-color: #ffffff2e; }
.landing-unico .footer a:hover { color: var(--u-acento); }

/* Encabezado de las páginas internas (tu dirección): mismo verde que el hero. */
.landing-unico .page-hero { background: var(--u-verde); }
.landing-unico .page-hero h1 em { color: var(--u-acento); }
.landing-unico .page-hero .lead { color: #e3eee6; }

/* Plan único: una sola tarjeta centrada */
.u-hero-acciones { display: flex; flex-wrap: wrap; gap: 12px; }
.landing-unico .u-btn-planes { border: 2px solid #ffffff99; color: #fff; background: transparent; }
.landing-unico .u-btn-planes:hover { border-color: #fff; background: #ffffff1f; }
.u-planes-intro { margin: 0; font-size: 18px; line-height: 1.5; color: #3f5646; }
.u-planes { display: grid; grid-template-columns: minmax(0, 520px); justify-content: center; max-width: 940px; margin: 0 auto; }
.u-monto { margin: 6px 0 12px; font-size: clamp(40px, 6vw, 56px); font-weight: 800; letter-spacing: -.04em; color: var(--u-tinta); }
.u-monto span { font-size: 18px; font-weight: 600; letter-spacing: 0; color: #3f5646; }
.u-plan { display: flex; flex-direction: column; padding: clamp(24px, 4vw, 40px); border: 2px solid #1e4d2b33; border-radius: 32px; background: #fff; }
.u-plan-full { border: 3px solid var(--u-verde); box-shadow: 0 30px 60px #1e4d2b26; }
.u-plan h3 { margin: 0 0 18px; font-size: clamp(20px, 2.4vw, 24px); line-height: 1.2; letter-spacing: -.02em; color: var(--u-tinta); }
.u-plan .u-lista { flex: 1; }
.u-plan small { display: block; margin-top: 14px; color: #3f5646; }
.u-incluye { max-width: 940px; margin: clamp(24px, 4vw, 40px) auto 0; padding: clamp(22px, 4vw, 36px); border-radius: 28px; background: var(--u-suave); }
.u-incluye h3 { margin: 0 0 16px; font-size: 20px; color: var(--u-tinta); }
.u-lista-doble { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 18px; column-gap: 28px; }
.u-incluye small { color: #3f5646; }
@media (max-width: 700px) {
  .u-planes, .u-lista-doble { grid-template-columns: 1fr; }
  .u-plan { border-radius: 24px; }
  .u-incluye { border-radius: 22px; }
}

@media (max-width: 1040px) and (min-width: 701px) { .u-oferta-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Ventajas del modelo de precio, debajo de la introducción de planes. */
.u-ventajas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; max-width: 940px; margin: 22px auto 0; padding: 0; list-style: none; text-align: left; }
.u-ventajas li { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border: 1px solid #dfeadf; border-radius: 18px; background: #fff; }
.u-ventajas li > span { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--u-verde); color: #fff; }
.u-ventajas li > span svg { width: 18px; height: 18px; }
.u-ventajas b, .u-ventajas small { display: block; }
.u-ventajas b { color: var(--u-tinta); }
.u-ventajas small { margin-top: 2px; color: #3f5646; line-height: 1.4; }
@media (max-width: 700px) { .u-ventajas { grid-template-columns: 1fr; } }

/* Propuesta visual: marca verde, precio visible y tarjetas con más aire. */
.landing-unico .u-hero{background:radial-gradient(ellipse at 90% 0%,#4e8157 0,transparent 48%),linear-gradient(135deg,#163c22,#1e4d2b 65%);isolation:isolate}
.landing-unico .u-hero h1{font-weight:750;max-width:700px}
.landing-unico .u-hero h1 em{font-style:normal;color:#d4edb0}
.landing-unico .u-hero .lead{font-size:clamp(17px,1.55vw,20px);line-height:1.65;max-width:600px}
.landing-unico .u-hero-media{position:relative;padding-bottom:36px}
.u-hero-price{position:absolute;right:-12px;bottom:0;z-index:3;background:#f5f2df;color:#173d23;padding:20px 26px;border-radius:22px;box-shadow:0 18px 45px #102c2440;transform:rotate(-3deg)}
.u-hero-price>span{font-size:10px;letter-spacing:.12em;font-weight:800;display:block}
.u-hero-price strong{display:block;font-size:38px;letter-spacing:-.04em;margin:6px 0}
.u-hero-price strong small{font-size:15px;letter-spacing:0;font-weight:500}
.u-hero-price p{margin:0;font-size:13px}
.landing-unico .u-oferta-card{border-radius:24px;box-shadow:0 8px 30px #163c2208}
.landing-unico .btn:focus-visible{outline:3px solid #c7e0a6;outline-offset:5px}
@media(max-width:700px){.u-hero-price{right:8px;padding:16px 20px}.u-hero-price strong{font-size:32px}.landing-unico .u-hero-acciones .btn{width:100%;justify-content:center}.landing-unico .u-hero-media{margin-top:12px}}

/* Subtítulos sobrios: misma familia del título, sin cursiva. */
.landing-unico h1 em,.landing-unico h2 em,.landing-unico .flip-words>span{font-family:var(--sans);font-style:normal;font-weight:400;color:var(--u-verde)}
.landing-unico .u-hero h1 em,.landing-unico .page-hero h1 em{color:#a9d8a9}

.landing-unico h1 em,.landing-unico h2 em{font-size:.5em}
.landing-unico .flip-words{font-size:.5em}

/* Jerarquía final de subtítulos. */
.landing-unico h1 em,.landing-unico h2 em{display:block;margin-top:.22em;font-size:.68em;line-height:1.2;letter-spacing:-.025em;font-weight:400;text-wrap:balance}
.landing-unico .flip-words{display:inline-grid;margin-top:0;font-size:1em;line-height:inherit}

/* Cursiva solicitada, conservando familia y jerarquía actuales. */
.landing-unico h1 em,.landing-unico h2 em,.landing-unico .flip-words>span{font-style:italic}

.landing-unico .u-hero h1 em,.landing-unico .page-hero h1 em{font-style:italic}
