/* Paso Solo · identidad: papel crema, tinta, mandarina, verde agua · Fredoka + Nunito Sans (tema claro) */
:root{
  --papel:#FFF8EC;--papel2:#FBEFDB;--tinta:#1F2A37;--gris:#6B6659;--suave:#E9DFCC;
  --nar:#FF6A3D;--nar2:#FFB08F;--ver:#1FA98F;--ver2:#9FE0D1;--sol:#F5B82E;
  --card:rgba(255,255,255,.72);--borde:rgba(31,42,55,.10);--r:20px;
  --grad:linear-gradient(120deg,#FF6A3D 0%,#FF8F5A 45%,#1FA98F 100%);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--papel);color:var(--tinta);font-family:'Nunito Sans',system-ui,sans-serif;font-size:17px;line-height:1.6;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.wrap{width:min(1120px,100% - 32px);margin:0 auto}
.narrow{width:min(760px,100% - 32px);margin:0 auto}
h1,h2,h3,.fred{font-family:'Fredoka',system-ui,sans-serif;letter-spacing:-.015em;line-height:1.08}
h1{font-size:clamp(2.35rem,6.4vw,4.3rem);font-weight:700;text-wrap:balance}
h2{font-size:clamp(1.8rem,4.4vw,2.8rem);font-weight:700;text-wrap:balance;margin-bottom:.5em}
h3{font-size:1.3rem;font-weight:600;margin-bottom:.35em}
p+p{margin-top:.8em}
.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.eyebrow{font-weight:800;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ver)}
.sec{padding:clamp(64px,9vw,112px) 0;position:relative}
.alt{background:var(--papel2)}
.oscuro{background:var(--tinta);color:var(--papel)}
.oscuro .eyebrow{color:var(--nar2)}
.centro{text-align:center}
/* grano sutil */
body::after{content:"";position:fixed;inset:0;pointer-events:none;opacity:.05;z-index:60;
  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='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E")}
/* hero */
.hero{position:relative;overflow:hidden;padding:clamp(28px,5vw,56px) 0 clamp(56px,8vw,96px)}
.hero::before,.hero::after{content:"";position:absolute;border-radius:50%;filter:blur(20px);z-index:0}
.hero::before{width:720px;height:720px;right:-260px;top:-320px;background:radial-gradient(circle,rgba(255,106,61,.30),transparent 66%)}
.hero::after{width:560px;height:560px;left:-240px;bottom:-280px;background:radial-gradient(circle,rgba(31,169,143,.26),transparent 66%)}
.hero>*{position:relative;z-index:1}
.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:clamp(20px,4vw,40px)}
.marca{font-family:'Fredoka';font-weight:700;font-size:1.45rem;text-decoration:none}.marca b{color:var(--nar)}
.hero-split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,56px);align-items:center}
.hero .sub{font-size:clamp(1.05rem,2.1vw,1.25rem);color:#3E4652;margin:18px 0 26px;max-width:36em}
.hero .mock{animation:flota 7s ease-in-out infinite}
@keyframes flota{50%{transform:translateY(-10px)}}
.confianza{display:flex;gap:18px;flex-wrap:wrap;margin-top:16px;font-size:.9rem;color:var(--gris);font-weight:700}
.confianza span::before{content:"✓ ";color:var(--ver);font-weight:800}
/* botones */
.cta{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--nar);color:#fff;text-decoration:none;font-family:'Fredoka';font-weight:600;
  font-size:1.2rem;padding:18px 34px;border-radius:999px;box-shadow:0 14px 40px rgba(255,106,61,.38);transition:transform .2s,box-shadow .2s;text-align:center}
.cta:hover{transform:translateY(-3px);box-shadow:0 18px 50px rgba(255,106,61,.46)}
.cta:focus-visible{outline:3px solid var(--ver);outline-offset:3px}
.cta small{display:block;font-family:'Nunito Sans';font-weight:700;font-size:.78rem;opacity:.9}
.sticky{position:fixed;left:12px;right:12px;bottom:12px;z-index:50;display:none;justify-content:center}
.sticky.on{display:flex}
.sticky .cta{width:min(560px,100%);padding:15px 20px;font-size:1.08rem}
@media(min-width:900px){.sticky{left:auto;right:24px;bottom:24px}.sticky .cta{width:auto}}
/* tarjetas */
.card{background:var(--card);border:1px solid var(--borde);border-radius:var(--r);padding:24px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
/* preguntas del sí */
.si{list-style:none;display:grid;gap:12px;margin-top:24px}
.si li{background:#fff;border:1px solid var(--borde);border-radius:16px;padding:16px 18px 16px 58px;position:relative;font-size:1.06rem}
.si li::before{content:"Sí";position:absolute;left:14px;top:14px;width:32px;height:32px;border-radius:10px;background:var(--nar);color:#fff;font-family:'Fredoka';font-weight:700;display:flex;align-items:center;justify-content:center;font-size:.9rem}
/* voz de mercado */
.voz{font-style:italic;font-size:1.08rem;border-left:4px solid var(--nar2);padding:6px 0 6px 18px;color:#39414C}
.voz small{display:block;font-style:normal;font-size:.78rem;color:var(--gris);margin-top:6px;font-weight:700}
.nota-voz{font-size:.8rem;color:var(--gris);margin-top:14px}
/* escalera (dispositivo firma) */
.escalera{display:flex;align-items:flex-end;gap:5px;height:190px;margin:26px 0 10px}
.escalera i{flex:1;background:var(--suave);border-radius:6px 6px 2px 2px;transform-origin:bottom;transition:background .4s}
.escalera.in i{background:var(--nar);animation:sube .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes sube{from{transform:scaleY(.05)}}
.etapas{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:8px}
.etapa{background:#fff;border:1px solid var(--borde);border-radius:14px;padding:12px;text-align:center;font-size:.92rem}
.etapa b{display:block;font-family:'Fredoka';font-size:1.05rem;color:var(--ver)}
.etapa svg{margin:6px auto 0;display:block}
/* pasos */
.pasos{counter-reset:p;display:grid;gap:16px;margin-top:24px}
.pasos li{list-style:none;display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:start}
.pasos li::before{counter-increment:p;content:counter(p);width:52px;height:52px;border-radius:16px;background:var(--ver);color:#fff;font-family:'Fredoka';font-weight:700;font-size:1.5rem;display:flex;align-items:center;justify-content:center}
/* comparativa */
.comp{width:100%;border-collapse:separate;border-spacing:0;margin-top:22px;background:#fff;border-radius:18px;overflow:hidden;border:1px solid var(--borde);font-size:.98rem}
.comp th,.comp td{padding:14px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--suave)}
.comp th{font-family:'Fredoka';font-weight:600;background:var(--tinta);color:var(--papel)}
.comp td:last-child{background:#F1FAF7;font-weight:700}
.comp tr:last-child td{border-bottom:0}
/* stats */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:26px;border-top:1px solid var(--borde)}
.stats div{padding:22px 10px;text-align:center;border-right:1px solid var(--borde)}.stats div:last-child{border-right:0}
.stats b{display:block;font-family:'Fredoka';font-size:clamp(2.2rem,5vw,3.2rem);color:var(--nar);line-height:1}
.stats span{font-size:.92rem;color:var(--gris);font-weight:700}
/* oferta */
.incluye{display:grid;grid-template-columns:120px 1fr;gap:18px;align-items:center;padding:16px 0;border-bottom:1px dashed var(--suave)}
.incluye img{border-radius:12px}
.incluye h3{margin:0}.incluye p{font-size:.96rem;color:#3E4652;margin-top:4px}
.bono{position:relative;overflow:hidden}
.bono::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--grad)}
.bono .tag{display:inline-block;background:var(--ver);color:#fff;font-family:'Fredoka';font-size:.8rem;padding:3px 10px;border-radius:999px;margin-bottom:8px}
.precio{text-align:center;margin-top:28px}
.precio .num{font-family:'Fredoka';font-weight:700;font-size:clamp(3rem,9vw,4.6rem);line-height:1}
.precio .num small{font-size:.4em;vertical-align:super}
.anclas{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:14px 0 22px}
.anclas span{background:#fff;border:1px solid var(--borde);border-radius:999px;padding:7px 14px;font-size:.88rem;font-weight:700;color:var(--gris)}
.garantia{display:flex;gap:18px;align-items:center;background:#fff;border:2px dashed var(--ver);border-radius:20px;padding:20px 22px;margin-top:26px}
.garantia .sello{flex:none;width:86px;height:86px;border-radius:50%;background:var(--ver);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:'Fredoka';font-weight:700;line-height:1}
.garantia .sello b{font-size:2rem}
/* faq */
details{background:#fff;border:1px solid var(--borde);border-radius:16px;padding:0 18px;margin-top:10px}
summary{cursor:pointer;list-style:none;font-family:'Fredoka';font-weight:600;font-size:1.1rem;padding:16px 28px 16px 0;position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:0;top:12px;font-size:1.6rem;color:var(--nar)}
details[open] summary::after{content:"–"}
details p{padding-bottom:16px;color:#3E4652}
/* bloques marcados (no se inventan) */
.pendiente{border:2px dashed #C9B89B;background:repeating-linear-gradient(45deg,#FFFBF3,#FFFBF3 12px,#FBF3E4 12px,#FBF3E4 24px);border-radius:18px;padding:22px;color:#6B5E48;font-size:.95rem}
.pendiente b{font-family:'Fredoka';color:#8A6A3B}
/* aparición */
.js .rise{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.js .rise.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.hero .mock{animation:none}.js .rise{opacity:1;transform:none}.escalera.in i{animation:none}}
/* pie */
footer{padding:40px 0 110px;font-size:.86rem;color:var(--gris);border-top:1px solid var(--suave)}
footer p+p{margin-top:.6em}
.derivacion{background:#fff;border-left:5px solid var(--ver);border-radius:12px;padding:14px 16px;margin-bottom:16px;color:#3E4652}
/* upsell */
.widget{background:#fff;border:2px solid var(--nar);border-radius:22px;padding:22px;margin-top:22px;min-height:120px}
.barra-paso{display:flex;gap:6px;justify-content:center;margin-bottom:18px}
.barra-paso i{width:36px;height:6px;border-radius:9px;background:var(--suave)}.barra-paso i.on{background:var(--nar)}
/* responsive */
@media(max-width:860px){
  .hero-split,.grid2,.grid3{grid-template-columns:1fr}
  .hero .mock{order:-1;max-width:520px;margin:0 auto}
  .etapas{grid-template-columns:repeat(2,1fr)}
  .stats{grid-template-columns:1fr}.stats div{border-right:0;border-bottom:1px solid var(--borde)}
  .incluye{grid-template-columns:84px 1fr}
  .comp{font-size:.9rem}.comp th,.comp td{padding:10px}
}
/* los hijos de las cuadrículas pueden encoger por debajo del ancho natural de sus imágenes (evita scroll horizontal en móvil) */
.hero-split>*,.grid2>*,.grid3>*,.stats>*{min-width:0}
.hero .mock{width:100%;height:auto}
.cta{flex-direction:column;gap:2px;line-height:1.15}
.bono img{width:100%;max-height:260px;object-fit:contain;margin:-6px auto 6px}
@media(max-width:860px){.bono img{max-height:200px}}