:root{--g:#0D631B;--gd:#0A3D12;--cream:#FBF4E4;--o:#FF7043;--o2:#FF9800;--ink:#1B2A1B;--mut:#4B5A4B;--w:#fff}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{font-family:"Plus Jakarta Sans",system-ui,sans-serif;background:var(--cream);color:var(--ink);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
nav{display:flex;align-items:center;justify-content:space-between;padding:20px 0}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:22px;color:var(--g);text-decoration:none;letter-spacing:-.02em}
.brand img{height:34px}
.pill{display:inline-flex;align-items:center;gap:8px;height:48px;padding:0 24px;border-radius:99px;background:var(--g);color:#fff;font-weight:700;font-size:16px;border:0;text-decoration:none;cursor:pointer}
.pill.o{background:var(--o)}
.pill.sm{height:40px;padding:0 18px;font-size:14px}
/* HERO */
.hero{position:relative;padding:20px 0 90px;overflow-x:clip}
.hero .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:30px;align-items:center}
h1{font-size:clamp(52px,9vw,112px);line-height:.92;letter-spacing:-.045em;font-weight:800;color:var(--gd)}
h1 .b{position:relative;color:var(--g)}
h1 .b::after{content:"";position:absolute;left:-2%;right:-2%;bottom:.04em;height:.16em;background:var(--o);border-radius:99px;z-index:-1;transform:rotate(-1.5deg)}
.sub{font-size:clamp(18px,2.2vw,22px);line-height:1.5;color:var(--mut);max-width:30em;margin:26px 0 28px}
.sub b{color:var(--ink)}
.form{display:flex;gap:10px;flex-wrap:wrap;max-width:520px}
.form input[type=email]{flex:1 1 230px;height:56px;border-radius:99px;border:2px solid var(--gd);background:#fff;padding:0 22px;font:inherit;font-size:16px}
.form .pill{height:56px}
.consent{flex-basis:100%;display:flex;gap:10px;font-size:13px;color:var(--mut);line-height:1.45;margin-top:2px}
.consent input{margin-top:3px;accent-color:var(--g);width:17px;height:17px;flex:none}
.free{display:inline-block;margin-top:16px;font-size:14px;color:var(--mut)}
.stage{position:relative;height:640px}
.plate{position:absolute;right:-30px;top:0;width:430px;height:430px;border-radius:50%;background:url(assets/img/plato2.webp) center/cover;
  -webkit-mask-image:radial-gradient(circle at 88% 20%,transparent 0 17%,#000 17.6%),radial-gradient(circle at 99% 40%,transparent 0 11%,#000 11.6%),radial-gradient(circle at 78% 5%,transparent 0 10%,#000 10.6%);
  -webkit-mask-composite:source-in;mask-composite:intersect;
  box-shadow:0 30px 60px -20px rgba(10,61,18,.45)}
.sticker{z-index:3;position:absolute;left:-6px;top:70px;width:118px;height:118px;border-radius:50%;background:var(--o);color:#fff;display:grid;place-items:center;text-align:center;font-weight:800;font-size:19px;line-height:1.05;transform:rotate(-12deg);box-shadow:0 10px 24px -8px rgba(255,112,67,.7)}
.sticker small{display:block;font-size:11px;font-weight:700;opacity:.9}
.phone{z-index:2;position:absolute;left:10px;bottom:0;width:250px;border-radius:38px;background:#fff;border:8px solid var(--gd);box-shadow:0 40px 60px -24px rgba(10,61,18,.5);overflow:hidden;transform:rotate(-4deg)}
.phone img{display:block;width:100%;height:auto}
.phone .bar{background:#FDF8FD;padding:16px 16px 10px;font-size:11.5px}
.phone .bar b{font-size:17px;display:block;color:var(--gd)}
.macro{display:flex;gap:3px;height:7px;border-radius:9px;overflow:hidden;margin-top:8px}.macro i{display:block}
.m1{flex:43;background:#66CC6E}.m2{flex:34;background:#C1441A}.m3{flex:23;background:#D9A62E}
.row{display:flex;gap:10px;align-items:center;padding:9px 12px;background:#fff;border-top:1px solid #eee}
.row img{width:48px;height:48px;border-radius:12px;object-fit:cover;flex:none}
.row small{display:block;font-size:9.5px;font-weight:800;letter-spacing:.06em;color:var(--g);text-transform:uppercase}
.row span{display:block;font-size:12px;font-weight:700;line-height:1.25}
.row em{font-style:normal;font-size:10.5px;color:var(--mut)}
.note-ph{position:absolute;left:290px;bottom:12px;font-size:12px;color:var(--mut);max-width:150px;line-height:1.35;transform:rotate(3deg)}
@media (max-width:900px){.hero .wrap{grid-template-columns:1fr}.stage{height:560px;margin-top:10px}.plate{right:-60px;width:360px;height:360px}.sticker{left:6px;top:20px}.phone{left:6px;width:230px}.note-ph{display:none}}
/* COLLAGE */
.collage{padding:10px 0 80px}
.collage .wrap{display:flex;gap:18px;align-items:flex-end}
.collage figure{flex:1;position:relative}
.collage img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:30px;box-shadow:0 18px 30px -16px rgba(10,61,18,.4)}
.collage figure:nth-child(1){transform:rotate(-3deg) translateY(10px)}.collage figure:nth-child(2){transform:translateY(-24px) rotate(2deg)}.collage figure:nth-child(3){transform:rotate(-1.5deg) translateY(14px)}.collage figure:nth-child(4){transform:translateY(-14px) rotate(3deg)}
.collage figcaption{position:absolute;left:10px;bottom:10px;background:#fff;border-radius:99px;padding:5px 12px;font-size:12px;font-weight:700}
.collage .count{flex:0 0 190px;align-self:center;font-size:15px;color:var(--mut);line-height:1.4}
.collage .count b{display:block;font-size:64px;line-height:.9;letter-spacing:-.04em;color:var(--g)}
@media (max-width:760px){.collage .wrap{flex-wrap:wrap}.collage figure{flex:0 0 calc(50% - 9px)}.collage .count{flex:1 1 100%;order:-1;margin-bottom:34px}}
/* PASOS */
.how{background:var(--gd);color:#fff;padding:90px 0;border-radius:48px 48px 0 0}
.how h2{font-size:clamp(34px,5vw,60px);letter-spacing:-.035em;line-height:1;font-weight:800;max-width:11em}
.how h2 span{color:var(--o2)}
.list{margin-top:46px;display:grid;gap:0}
.item{display:grid;grid-template-columns:90px 1fr;gap:20px;padding:26px 0;border-top:1px solid rgba(255,255,255,.18);align-items:baseline}
.item .n{font-size:56px;font-weight:800;letter-spacing:-.04em;color:var(--o2);line-height:1}
.item h3{font-size:clamp(24px,3vw,34px);letter-spacing:-.02em;line-height:1.1;font-weight:800}
.item p{color:#C8D8C8;font-size:17px;line-height:1.5;margin-top:6px;max-width:34em}
/* DOS */
.two{background:var(--o);color:#fff;padding:90px 0}
.two .wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;align-items:center}
@media (max-width:860px){.two .wrap{grid-template-columns:1fr}}
.faces{display:flex;justify-content:center;padding-bottom:16px}
.face{position:relative;width:230px;height:230px;transform:rotate(-3deg)}
.face img{width:100%;height:100%;display:block;object-fit:cover;border-radius:50%;border:6px solid #fff;background:#fff}
.face small{position:absolute;left:50%;bottom:-14px;transform:translateX(-50%);background:#fff;color:var(--gd);font-size:12px;font-weight:800;padding:5px 12px;border-radius:99px;white-space:nowrap}
.two h2{font-size:clamp(34px,5vw,58px);letter-spacing:-.035em;line-height:1;font-weight:800}
.two p{font-size:19px;line-height:1.55;margin-top:18px;max-width:34em}
.two blockquote{font-size:22px;font-weight:700;line-height:1.35;letter-spacing:-.01em;margin-top:22px;max-width:28em;padding-left:18px;border-left:4px solid #fff}
.tag{display:inline-block;background:rgba(255,255,255,.2);border-radius:99px;padding:6px 14px;font-weight:700;font-size:14px;margin-top:20px}
/* HONESTO */
.honest{padding:70px 0 20px}
.honest .box{border:2px dashed var(--gd);border-radius:28px;padding:26px 30px;max-width:860px;margin:0 auto;display:flex;gap:18px;align-items:flex-start}
.honest b{font-size:20px;display:block;margin-bottom:4px}
.honest p{color:var(--mut);line-height:1.55}
.honest .ico{font-size:30px;line-height:1}
/* FAQ */
.faq{padding:50px 0 40px}
.faq .wrap{max-width:820px}
.faq h2{font-size:clamp(30px,4vw,44px);letter-spacing:-.03em;margin-bottom:14px;font-weight:800}
details{border-top:2px solid rgba(10,61,18,.15);padding:18px 0}
details:last-of-type{border-bottom:2px solid rgba(10,61,18,.15)}
summary{font-weight:700;font-size:19px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px}
summary::after{content:"+";color:var(--o);font-size:28px;line-height:.8;font-weight:800}
details[open] summary::after{content:"–"}
details p{color:var(--mut);line-height:1.55;margin-top:10px}
/* CTA */
.cta{background:var(--gd);color:#fff;text-align:center;padding:100px 0;border-radius:48px 48px 0 0;margin-top:40px}
.cta h2{font-size:clamp(40px,7vw,84px);letter-spacing:-.045em;line-height:.95;font-weight:800}
.cta h2 span{color:var(--o2)}
.cta p{color:#C8D8C8;font-size:19px;margin:20px auto 30px;max-width:30em}
.cta .form{margin:0 auto;justify-content:center}
.cta .form input[type=email]{border-color:#fff}
.cta .consent{color:#C8D8C8;text-align:left}
footer{background:var(--gd);color:#A9BDA9;font-size:14px;padding:26px 0 40px}
footer .wrap{display:flex;gap:12px 28px;flex-wrap:wrap;justify-content:space-between;border-top:1px solid rgba(255,255,255,.14);padding-top:24px}
footer a{color:#fff}

/* Formulario: mensajes y trampa para bots */
.msg{flex-basis:100%;font-size:14.5px;min-height:20px;font-weight:600}
.msg.ok{color:var(--g)}.msg.err{color:#BA1A1A}
.cta .msg.ok{color:#9BE7A0}.cta .msg.err{color:#FFB4A8}
.hp{position:absolute;left:-9999px;opacity:0;height:0;width:0}
.pill:disabled{opacity:.6;cursor:default}
/* Páginas legales */
.legal{max-width:760px;margin:0 auto;padding:30px 24px 70px}
.legal h1{font-size:clamp(34px,5vw,52px);letter-spacing:-.035em;line-height:1;font-weight:800;color:var(--gd);margin-bottom:22px}
.legal h2{font-size:28px;letter-spacing:-.02em;margin-top:40px;font-weight:800;color:var(--gd)}
.legal h3{font-size:18px;margin-top:22px;font-weight:700}
.legal p{color:var(--mut);line-height:1.6;margin-top:6px}
.draft{background:#FFE9DD;color:#7A2600;padding:12px 16px;border-radius:14px;font-size:14px;margin-bottom:22px}
.footlight{background:var(--gd);color:#A9BDA9;font-size:14px;padding:26px 0 40px;margin-top:40px}

/* Galería de capturas reales */
.shots{padding:20px 0 90px}
.shots h2{font-size:clamp(30px,4.4vw,52px);letter-spacing:-.035em;line-height:1;font-weight:800;color:var(--gd);margin-bottom:40px}
.row-shots{display:flex;gap:26px;justify-content:center;align-items:flex-start}
.row-shots figure{flex:0 0 220px}
.row-shots figure:nth-child(odd){transform:rotate(-2deg)}.row-shots figure:nth-child(even){transform:translateY(34px) rotate(2deg)}
.shot{border:7px solid var(--gd);border-radius:32px;overflow:hidden;box-shadow:0 26px 40px -22px rgba(10,61,18,.5);background:#fff}
.shot img{display:block;width:100%;height:auto}
.row-shots figcaption{margin-top:14px;text-align:center;font-weight:700;font-size:15px;color:var(--gd)}
@media (max-width:900px){.row-shots{justify-content:flex-start;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 24px 50px;margin:0 -24px}.row-shots figure{scroll-snap-align:center;flex:0 0 200px}}