:root{
  --y:#FFD600;
  --y2:#F0C800;
  --k:#111111;
  --k2:#1c1c1c;
  --k3:#2a2a2a;
  --w:#FAFAF5;
  --cream:#F4F1E6;
  --muted:#8a8a80;
  --r:22px;
  --ease:cubic-bezier(.2,.8,.2,1);
  --font:"Archivo",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
body{font-family:var(--font);background:var(--y);color:var(--k);overflow-x:clip;line-height:1.5;-webkit-font-smoothing:antialiased}
body.loading{overflow:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
img,svg{display:block;max-width:100%}
::selection{background:var(--k);color:var(--y)}
.container{width:min(1240px,100% - 32px);margin-inline:auto}

/* ---------- LOADER ---------- */
.loader{position:fixed;inset:0;background:var(--k);z-index:1000;display:grid;place-items:center;transition:clip-path 1s var(--ease);clip-path:inset(0 0 0 0)}
.loader.done{clip-path:inset(0 0 100% 0)}
.loader-word{display:flex;font-weight:900;font-size:clamp(64px,16vw,200px);letter-spacing:-.04em;color:var(--y);overflow:hidden;line-height:1}
.loader-word span{display:inline-block;transform:translateY(110%);animation:up .7s var(--ease) forwards}
.loader-word span:nth-child(2){animation-delay:.06s}.loader-word span:nth-child(3){animation-delay:.12s}
.loader-word span:nth-child(4){animation-delay:.18s}.loader-word span:nth-child(5){animation-delay:.24s}
.loader-word .dot{animation-delay:.4s;color:var(--w)}
@keyframes up{to{transform:translateY(0)}}

/* ---------- CURSOR + PROGRESS ---------- */
.cursor{position:fixed;top:0;left:0;width:18px;height:18px;border-radius:50%;background:var(--k);box-shadow:0 0 0 2px var(--y);pointer-events:none;z-index:999;transform:translate(-50%,-50%);transition:width .25s var(--ease),height .25s var(--ease);opacity:0}
.cursor.big{width:56px;height:56px;background:rgba(255,214,0,.25);box-shadow:0 0 0 2px var(--k)}
@media (hover:hover) and (pointer:fine){.cursor{opacity:1}}
.progress{position:fixed;top:0;left:0;height:4px;width:100%;background:var(--k);transform-origin:0 50%;transform:scaleX(0);z-index:200}

/* ---------- NAV ---------- */
.nav{position:fixed;top:14px;left:50%;transform:translateX(-50%);width:min(1240px,100% - 24px);display:flex;align-items:center;gap:24px;padding:10px 10px 10px 22px;border-radius:999px;z-index:100;transition:background .35s,box-shadow .35s,top .35s}
.nav.scrolled{background:rgba(255,214,0,.85);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 10px 30px rgba(0,0,0,.08),inset 0 0 0 2px var(--k)}
.nav.on-dark.scrolled{background:rgba(17,17,17,.8);color:var(--w);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.nav.on-dark .nav-cta{background:var(--y);color:var(--k)}
.brand{font-weight:900;font-size:26px;letter-spacing:-.04em}
.brand span{color:var(--w)}
.nav.on-dark .brand span{color:var(--y)}
.nav-links{display:flex;gap:4px;margin-left:auto}
.nav-links a{font-weight:600;font-size:15px;padding:8px 14px;border-radius:999px;transition:background .2s}
.nav-links a:hover{background:rgba(0,0,0,.08)}
.nav.on-dark .nav-links a:hover{background:rgba(255,255,255,.1)}
.burger{display:none;width:44px;height:44px;border-radius:50%;background:var(--k);position:relative}
.burger span{position:absolute;left:13px;right:13px;height:2px;background:var(--y);transition:transform .3s}
.burger span:first-child{top:17px}.burger span:last-child{top:25px}
.burger.open span:first-child{transform:translateY(4px) rotate(45deg)}
.burger.open span:last-child{transform:translateY(-4px) rotate(-45deg)}

/* ---------- BUTTONS ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:15px;padding:13px 22px;border-radius:999px;transition:transform .25s var(--ease),background .25s,color .25s,box-shadow .25s;white-space:nowrap;will-change:transform}
.btn .arr{display:inline-block;transition:transform .3s var(--ease)}
.btn:hover .arr{transform:translateX(5px)}
.btn-lg{font-size:17px;padding:18px 30px}
.btn-dark{background:var(--k);color:var(--y)}
.btn-dark:hover{box-shadow:6px 6px 0 var(--w)}
.btn-yellow{background:var(--y);color:var(--k)}
.btn-yellow:hover{box-shadow:6px 6px 0 var(--w)}
.btn-ghost{box-shadow:inset 0 0 0 2px var(--k)}
.btn-ghost:hover{background:var(--k);color:var(--y)}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:100svh;overflow-x:clip;padding:120px 0 40px;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.hero-grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(0,0,0,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.07) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(ellipse at 70% 45%,#000 20%,transparent 70%);-webkit-mask-image:radial-gradient(ellipse at 70% 45%,#000 20%,transparent 70%)}
.hero-inner{position:relative;width:min(1240px,100% - 32px);margin-inline:auto;display:grid;grid-template-columns:1.35fr 1fr;gap:40px;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;background:var(--k);color:var(--y);padding:8px 16px;border-radius:999px;margin-bottom:28px}
.pulse{width:8px;height:8px;border-radius:50%;background:#35e06b;box-shadow:0 0 0 0 rgba(53,224,107,.6);animation:pulse 1.6s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(53,224,107,0)}100%{box-shadow:0 0 0 0 rgba(53,224,107,0)}}
.hero-title{font-weight:900;font-size:clamp(42px,6.2vw,96px);line-height:.92;letter-spacing:-.045em;margin-bottom:28px}
.hero-title .line{display:block;overflow:hidden;padding-bottom:.06em}
.hero-title .word{display:inline-block;transform:translateY(105%);transition:transform 1s var(--ease)}
.ready .hero-title .word{transform:none}
.ready .hero-title .line:nth-child(2) .word{transition-delay:.08s}
.ready .hero-title .line:nth-child(3) .word{transition-delay:.16s}
.hero-title em{font-style:normal;position:relative;z-index:0;color:var(--w);-webkit-text-stroke:2px var(--k);paint-order:stroke fill}
.hero-title .rotator-line .word{font-size:.5em;letter-spacing:-.02em;font-weight:800}
.rotator{display:inline-block;white-space:nowrap;background:var(--k);color:var(--y);padding:.02em .18em .08em;border-radius:.14em;transform:translateY(105%) rotate(-2deg);transition:transform 1s var(--ease) .24s}
.ready .rotator{transform:rotate(-2deg)}
.rotator span{display:inline-block}
.rotator span.out{animation:rotOut .35s var(--ease) forwards}
.rotator span.in{animation:rotIn .45s var(--ease) forwards}
@keyframes rotOut{to{transform:translateY(-60%);opacity:0;filter:blur(4px)}}
@keyframes rotIn{from{transform:translateY(60%);opacity:0;filter:blur(4px)}to{transform:none;opacity:1;filter:none}}
.hero-sub{font-size:clamp(17px,1.5vw,21px);max-width:560px;margin-bottom:34px}
.hero-ctas{display:flex;flex-wrap:wrap;gap:14px}

.hero-monkey{position:relative;aspect-ratio:1;max-width:560px;width:100%;justify-self:center}
.monkey{width:100%;height:100%;overflow:visible;filter:drop-shadow(14px 18px 0 var(--k));transform:scale(.6) rotate(-12deg);opacity:0;transition:transform 1.2s cubic-bezier(.3,1.5,.5,1) .2s,opacity .6s .2s}
.ready .monkey{transform:none;opacity:1}
.m-head{fill:var(--y2);stroke:var(--k);stroke-width:14}
.m-face{fill:var(--w)}
.m-glasses path,.m-glasses rect{fill:var(--k)}
.m-glasses .m-shine{fill:rgba(255,255,255,.28)}
.m-glasses{transition:transform .15s linear}
.m-nose{fill:var(--k)}
.m-smile{fill:none;stroke:var(--k);stroke-width:5;stroke-linecap:round}
.monkey-inner{transform-origin:50% 60%}
.monkey-shadow{position:absolute;bottom:-4%;left:22%;width:56%;height:6%;background:rgba(0,0,0,.14);border-radius:50%;filter:blur(8px);animation:shadow 5s ease-in-out infinite}
.hero-monkey .monkey{animation:bob 5s ease-in-out infinite 1.4s}
@keyframes bob{50%{translate:0 -14px;rotate:1.5deg}}
@keyframes shadow{50%{transform:scaleX(.85);opacity:.7}}
.sticker{position:absolute;z-index:2;font-weight:800;font-size:15px;padding:10px 16px;border-radius:14px;background:var(--w);box-shadow:4px 4px 0 var(--k),inset 0 0 0 2px var(--k);white-space:nowrap;opacity:0;transform:scale(.4);transition:transform .7s cubic-bezier(.3,1.6,.5,1),opacity .4s}
.ready .sticker{opacity:1;transform:rotate(var(--r,0deg))}
.s1{top:6%;left:-2%;--r:-8deg;transition-delay:.9s!important}
.s2{top:22%;right:-6%;--r:6deg;background:var(--k)!important;color:var(--y);box-shadow:4px 4px 0 var(--w)!important;transition-delay:1s!important}
.s3{bottom:18%;left:-6%;--r:5deg;transition-delay:1.1s!important}
.s4{bottom:4%;right:4%;--r:-5deg;transition-delay:1.2s!important}
.sticker:hover{animation:wiggle .5s}
@keyframes wiggle{25%{rotate:6deg}75%{rotate:-6deg}}

.hero-bottom{position:relative;width:min(1240px,100% - 32px);margin:56px auto 0;display:grid;grid-template-columns:repeat(4,1fr);border-top:2px solid var(--k)}
.hero-bottom div{padding:18px 0 0;display:flex;align-items:baseline;gap:10px}
.hero-bottom b{font-size:clamp(28px,3vw,40px);font-weight:900;letter-spacing:-.04em}
.hero-bottom span{font-size:14px;font-weight:600;line-height:1.2}

/* ---------- MARQUEE ---------- */
.marquee{background:var(--k);color:var(--y);overflow:hidden;padding:22px 0;transform:rotate(-1.5deg);margin:0 -20px;position:relative;z-index:5;border-block:3px solid var(--y)}
.marquee-track{display:flex;gap:36px;width:max-content;animation:marq 26s linear infinite;font-weight:900;font-size:clamp(28px,4vw,52px);letter-spacing:-.03em;white-space:nowrap;align-items:center}
.marquee-track i{font-style:normal;color:var(--w);font-size:.6em}
@keyframes marq{to{transform:translateX(-50%)}}

/* ---------- SECTIONS ---------- */
.section{padding:clamp(90px,12vw,160px) 0;position:relative}
.dark{background:var(--k);color:var(--w)}
.yellow{background:var(--y);color:var(--k)}
.cream{background:var(--cream);color:var(--k)}
.sec-head{max-width:980px;margin-bottom:clamp(40px,6vw,72px)}
.sec-head.center{margin-inline:auto;text-align:center}
.tag{font-family:var(--mono);font-size:13px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:18px;opacity:.7}
h2{font-weight:900;font-size:clamp(38px,6vw,84px);line-height:.95;letter-spacing:-.045em;margin-bottom:22px}
.lead{font-size:clamp(17px,1.4vw,20px);max-width:620px;opacity:.85}
.hl{color:var(--y)}
.hl-dark{background:var(--k);color:var(--y);padding:0 .15em;border-radius:.1em;display:inline-block;transform:rotate(-2deg)}
.mark{background:linear-gradient(transparent 55%,var(--y) 55%);background-size:0% 100%;background-repeat:no-repeat;transition:background-size 1s var(--ease) .3s}
.in .mark,.mark.in{background-size:100% 100%}
.strike{position:relative;opacity:.45;white-space:nowrap}
.strike::after{content:"";position:absolute;left:-4px;right:-4px;top:52%;height:.12em;background:var(--k);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease) .6s}
.in .strike::after{transform:scaleX(1)}

/* reveal */
.reveal{opacity:0;transform:translateY(40px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ---------- PANELS ---------- */
.panels{display:flex;gap:14px;height:560px}
.panel{position:relative;flex:1;min-width:0;border-radius:var(--r);background:var(--k2);border:1px solid var(--k3);overflow:hidden;cursor:pointer;transition:flex .7s var(--ease),background .5s,color .5s}
.panel.active{flex:3.4;background:var(--y);color:var(--k);cursor:default}
.panel-num{position:absolute;top:22px;left:24px;font-family:var(--mono);font-size:14px;opacity:.6}
.panel-title-v{position:absolute;bottom:26px;left:50%;transform:translateX(-50%) rotate(180deg);writing-mode:vertical-rl;font-weight:900;font-size:40px;letter-spacing:-.03em;white-space:nowrap;transition:opacity .3s}
.panel.active .panel-title-v{opacity:0}
.panel:not(.active):hover{background:var(--k3)}
.panel:not(.active):hover .panel-title-v{color:var(--y)}
.panel-body{position:absolute;inset:0;padding:64px 40px 36px;display:flex;flex-direction:column;opacity:0;transform:translateY(20px);transition:opacity .3s,transform .3s;pointer-events:none;min-width:420px}
.panel.active .panel-body{opacity:1;transform:none;transition:opacity .5s .3s,transform .6s var(--ease) .3s;pointer-events:auto}
.panel-icon{font-size:40px;width:72px;height:72px;display:grid;place-items:center;border-radius:18px;background:var(--k);color:var(--y);margin-bottom:22px}
.panel h3{font-size:clamp(32px,3.4vw,48px);font-weight:900;letter-spacing:-.04em;line-height:1;margin-bottom:12px}
.panel p{font-size:18px;max-width:520px;margin-bottom:22px}
.panel ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px 22px;max-width:640px}
.panel li{font-weight:600;padding-left:26px;position:relative;font-size:15px}
.panel li::before{content:"✓";position:absolute;left:0;top:0;width:18px;height:18px;border-radius:50%;background:var(--k);color:var(--y);font-size:11px;display:grid;place-items:center;margin-top:2px}
.panel-price{margin-top:auto;font-size:18px;font-weight:600}
.panel-price b{font-size:clamp(36px,3.6vw,52px);font-weight:900;letter-spacing:-.04em}

/* ---------- DEMO ---------- */
.demo-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}
.demo-pick-label{font-weight:700;margin:30px 0 12px}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{padding:11px 18px;border-radius:999px;font-weight:700;font-size:15px;box-shadow:inset 0 0 0 2px var(--k);transition:all .25s var(--ease)}
.chip:hover{transform:translateY(-2px)}
.chip.active{background:var(--k);color:var(--y)}
.demo-stats{display:flex;gap:40px;margin-top:40px}
.demo-stats b{display:block;font-size:48px;font-weight:900;letter-spacing:-.04em;line-height:1}
.demo-stats span{font-size:14px;font-weight:600}
.phone-wrap{position:relative;justify-self:center}
.phone{width:340px;height:640px;background:#0b141a;border-radius:46px;padding:14px;box-shadow:0 0 0 10px var(--k),20px 24px 0 10px rgba(0,0,0,.18);position:relative;display:flex;flex-direction:column;overflow:hidden;transform:rotate(3deg);transition:transform .6s var(--ease)}
.phone:hover{transform:rotate(0)}
.phone-notch{position:absolute;top:14px;left:50%;transform:translateX(-50%);width:110px;height:26px;background:var(--k);border-radius:0 0 16px 16px;z-index:3}
.wa-head{display:flex;align-items:center;gap:12px;background:#1f2c34;color:#e9edef;padding:38px 14px 12px;border-radius:32px 32px 0 0;margin:-14px -14px 0}
.wa-head b{display:block;font-size:15px}
.wa-head small{font-size:12px;color:#8696a0}
.wa-avatar{width:38px;height:38px;border-radius:50%;background:var(--y);color:var(--k);font-weight:900;display:grid;place-items:center;font-size:14px}
.wa-body{flex:1;overflow-y:auto;padding:14px 4px;display:flex;flex-direction:column;gap:8px;scrollbar-width:none;background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.025) 2px,transparent 2px) 0 0/22px 22px}
.wa-body::-webkit-scrollbar{display:none}
.msg{max-width:82%;padding:8px 12px 18px;border-radius:12px;font-size:14px;line-height:1.35;color:#e9edef;position:relative;animation:msgIn .4s var(--ease) both;white-space:pre-line}
.msg.in{background:#202c33;align-self:flex-start;border-top-left-radius:2px}
.msg.out{background:#005c4b;align-self:flex-end;border-top-right-radius:2px}
.msg.bot{background:#005c4b}
.msg time{position:absolute;right:8px;bottom:3px;font-size:10px;color:rgba(233,237,239,.6)}
.msg .ai{display:inline-block;font-size:10px;font-weight:700;background:var(--y);color:var(--k);border-radius:4px;padding:0 5px;margin-bottom:3px}
.typing{align-self:flex-end;background:#005c4b;padding:12px 14px;border-radius:12px;border-top-right-radius:2px;display:flex;gap:4px;animation:msgIn .3s both}
.typing.left{align-self:flex-start;background:#202c33;border-radius:12px;border-top-left-radius:2px}
.typing i{width:7px;height:7px;border-radius:50%;background:#8696a0;animation:dot 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes dot{50%{transform:translateY(-4px);opacity:.4}}
@keyframes msgIn{from{opacity:0;transform:translateY(10px) scale(.96)}}
.wa-input{display:flex;align-items:center;justify-content:space-between;background:#1f2c34;color:#8696a0;border-radius:999px;padding:10px 16px;font-size:14px;margin-top:6px}
.wa-input i{font-style:normal;color:var(--y)}
.phone-badge{position:absolute;bottom:60px;left:-70px;background:var(--k);color:var(--y);font-weight:800;padding:12px 18px;border-radius:14px;box-shadow:4px 4px 0 var(--w);transform:rotate(-6deg);animation:float 4s ease-in-out infinite;white-space:nowrap}
@keyframes float{50%{translate:0 -10px}}

/* ---------- FLYWHEEL ---------- */
.fly-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.orbit{position:relative;width:min(480px,86%);aspect-ratio:1;margin-inline:auto}
.orbit-ring{position:absolute;inset:12%;border:2px dashed rgba(255,214,0,.4);border-radius:50%}
.orbit-core{position:absolute;inset:34%;border-radius:50%;background:var(--y);color:var(--k);display:grid;place-items:center;font-weight:900;font-size:clamp(20px,3vw,32px);letter-spacing:-.04em;box-shadow:0 0 0 14px rgba(255,214,0,.12),0 0 80px rgba(255,214,0,.45)}
.orbit-core span{color:var(--w)}
.orbit-rot{position:absolute;inset:0;animation:spin 24s linear infinite}
.node{position:absolute;width:26%;aspect-ratio:1;border-radius:50%;background:var(--k2);border:2px solid var(--y);display:grid;place-items:center;font-weight:800;font-size:clamp(13px,1.4vw,17px);color:var(--y)}
.node span{animation:spin 24s linear infinite reverse}
.n1{top:-1%;left:37%}.n2{top:37%;right:-1%}.n3{bottom:-1%;left:37%}.n4{top:37%;left:-1%}
@keyframes spin{to{transform:rotate(360deg)}}
.steps{list-style:none;counter-reset:s;display:grid;gap:14px;margin-top:10px}
.steps li{counter-increment:s;position:relative;padding:18px 20px 18px 70px;border-radius:16px;background:var(--k2);border:1px solid var(--k3);font-size:17px;transition:border-color .3s,transform .3s var(--ease)}
.steps li:hover{border-color:var(--y);transform:translateX(6px)}
.steps li::before{content:"0" counter(s);position:absolute;left:20px;top:50%;transform:translateY(-50%);font-family:var(--mono);font-weight:600;color:var(--y)}
.steps b{color:var(--y)}

/* ---------- CALC ---------- */
.calc{display:grid;grid-template-columns:1fr 1fr;border-radius:28px;overflow:hidden;box-shadow:10px 10px 0 var(--k),inset 0 0 0 3px var(--k);background:var(--w)}
.calc-inputs{padding:44px;display:grid;gap:30px}
.calc-inputs label span{display:flex;justify-content:space-between;font-weight:700;margin-bottom:12px;font-size:17px}
.calc-inputs output{font-family:var(--mono);background:var(--k);color:var(--y);padding:2px 10px;border-radius:8px;font-size:15px}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:10px;border-radius:999px;background:linear-gradient(90deg,var(--k) var(--p,20%),#ddd9c8 var(--p,20%));outline:none}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;border-radius:50%;background:var(--y);border:3px solid var(--k);cursor:grab;transition:transform .2s}
input[type=range]::-webkit-slider-thumb:active{transform:scale(1.2);cursor:grabbing}
input[type=range]::-moz-range-thumb{width:26px;height:26px;border-radius:50%;background:var(--y);border:3px solid var(--k);cursor:grab}
input[type=range]:focus-visible{box-shadow:0 0 0 3px var(--y),0 0 0 5px var(--k)}
.calc-note{font-size:13px;color:var(--muted)}
.calc-out{background:var(--k);color:var(--w);padding:44px;display:flex;flex-direction:column;gap:22px;justify-content:center}
.calc-big small{display:block;font-family:var(--mono);font-size:13px;text-transform:uppercase;letter-spacing:.08em;opacity:.7}
.calc-big b{font-size:clamp(52px,6vw,88px);font-weight:900;letter-spacing:-.05em;line-height:1;color:var(--y);font-variant-numeric:tabular-nums}
.calc-verdict{font-size:18px;font-weight:700;padding:14px 18px;border-radius:14px;background:var(--k3)}
.calc-out .btn{align-self:flex-start}

/* ---------- A LA MEDIDA ---------- */
.medida h2{max-width:1040px}
.versus{display:grid;grid-template-columns:1fr auto 1.25fr;gap:24px;align-items:center;margin-bottom:72px}
.vs-card{background:var(--k2);border:1px solid var(--k3);border-radius:28px;padding:32px;transition:transform .4s var(--ease),border-color .3s,opacity .9s var(--ease)}
.vs-card:hover{border-color:var(--y)}
.vs-card.big{background:var(--y);color:var(--k);border-color:var(--y);padding:44px 40px;box-shadow:10px 10px 0 var(--w)}
.vs-emoji{font-size:52px;display:block;margin-bottom:14px;line-height:1}
.vs-card.big .vs-emoji{font-size:76px}
.vs-card h3{font-size:clamp(28px,3vw,40px);font-weight:900;letter-spacing:-.04em;line-height:1}
.vs-card.big h3{font-size:clamp(34px,4vw,56px)}
.vs-sub{font-family:var(--mono);font-size:13px;text-transform:uppercase;letter-spacing:.06em;opacity:.7;margin:12px 0 18px}
.vs-card ul{list-style:none;display:grid;gap:10px}
.vs-card li{padding-left:26px;position:relative;font-weight:600}
.vs-card li::before{content:"→";position:absolute;left:0;color:var(--y);font-weight:900}
.vs-card.big li::before{color:var(--k)}
.vs-sign{font-size:clamp(64px,8vw,120px);font-weight:900;color:var(--y);line-height:1;text-align:center}
.factors h3{font-size:clamp(24px,2.4vw,32px);font-weight:900;letter-spacing:-.03em;margin-bottom:22px}
.factor-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:56px}
.factor{border-top:3px solid var(--y);padding-top:16px}
.factor span{font-family:var(--mono);color:var(--y);font-size:14px}
.factor b{display:block;font-size:21px;font-weight:800;margin:6px 0}
.factor p{opacity:.75;font-size:15px}
.medida-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;padding:32px;border-radius:28px;border:2px dashed rgba(255,214,0,.5)}
.medida-cta p{max-width:640px;font-size:18px}
.medida-cta b{color:var(--y)}
@media (max-width:1024px){.versus{grid-template-columns:1fr;gap:16px}.factor-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.factor-grid{grid-template-columns:1fr}.medida-cta{padding:22px}.vs-card.big{padding:30px 24px;box-shadow:6px 6px 0 var(--w)}}

/* ---------- MARKET ---------- */
.market{display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:end}
.bars{display:flex;align-items:flex-end;gap:14px;height:380px;border-bottom:3px solid var(--k);padding-top:40px}
.bar-col{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:0}
.bar-col small{font-family:var(--mono);font-weight:600;position:relative;top:34px;height:0}
.bar{width:100%;height:0;background:var(--k);border-radius:12px 12px 0 0;position:relative;transition:height 1.4s var(--ease)}
.bars.in .bar{height:var(--h)}
.bars.in .bar-col:nth-child(2) .bar{transition-delay:.1s}.bars.in .bar-col:nth-child(3) .bar{transition-delay:.2s}
.bars.in .bar-col:nth-child(4) .bar{transition-delay:.3s}.bars.in .bar-col:nth-child(5) .bar{transition-delay:.4s}
.bar span{position:absolute;top:-36px;left:50%;transform:translateX(-50%);font-weight:900;font-size:18px;white-space:nowrap}
.bar.big{background:repeating-linear-gradient(-45deg,var(--k) 0 14px,#2b2b2b 14px 28px)}
.bar.big span{font-size:24px;background:var(--k);color:var(--y);padding:2px 10px;border-radius:8px;top:-44px}
.market-stats{display:grid;gap:26px}
.mstat{border-top:3px solid var(--k);padding-top:14px}
.mstat b{display:block;font-size:clamp(56px,7vw,96px);font-weight:900;letter-spacing:-.05em;line-height:1}
.mstat span{font-weight:600;font-size:16px}

/* ---------- COMPARATIVA ---------- */
.table-wrap{overflow-x:auto;border-radius:var(--r);border:1px solid var(--k3)}
.cmp{width:100%;border-collapse:collapse;min-width:720px}
.cmp th,.cmp td{padding:20px 18px;text-align:center;border-bottom:1px solid var(--k3)}
.cmp th{font-family:var(--mono);font-size:13px;text-transform:uppercase;letter-spacing:.06em;opacity:.7;font-weight:600}
.cmp td:first-child,.cmp th:first-child{text-align:left;font-weight:700}
.cmp td{font-size:20px;color:#555}
.cmp td:first-child{font-size:16px;color:var(--w)}
.cmp tr.us td{background:var(--y);color:var(--k);font-weight:900;font-size:24px}
.cmp tr.us td:first-child{font-size:24px;letter-spacing:-.04em}
.cmp tr.us td:first-child span{color:var(--w)}
.cmp tbody tr:not(.us):hover td{background:var(--k2)}
.cmp tr:last-child td{border-bottom:0}

/* ---------- TIMELINE ---------- */
.timeline{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.tl-line{position:absolute;top:30px;left:30px;right:30px;height:4px;background:#ddd9c8;border-radius:4px}
.tl-fill{height:100%;background:var(--k);border-radius:4px;transform-origin:0 50%;transform:scaleX(0)}
.tl-step{position:relative}
.tl-step span{width:64px;height:64px;border-radius:50%;background:var(--y);border:3px solid var(--k);display:grid;place-items:center;font-weight:900;font-size:24px;margin-bottom:20px;position:relative;box-shadow:4px 4px 0 var(--k);transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.tl-step:hover span{transform:scale(1.12) rotate(-8deg)}
.tl-step h4{font-size:22px;font-weight:900;letter-spacing:-.03em;margin-bottom:6px}
.tl-step p{font-size:15px;opacity:.75}

/* ---------- LATAM ---------- */
.latam{background:var(--y);padding:50px 0;overflow:hidden;border-block:3px solid var(--k)}
.latam-track{display:flex;gap:16px;width:max-content;animation:marq 40s linear infinite reverse}
.latam-track span{font-weight:800;font-size:20px;padding:12px 22px;border-radius:999px;background:var(--w);box-shadow:inset 0 0 0 2px var(--k);white-space:nowrap}
.latam-track span:nth-child(10n+1){background:var(--k);color:var(--y)}
.latam-cap{text-align:center;font-weight:800;font-size:clamp(20px,2.4vw,28px);letter-spacing:-.02em;margin-top:26px;padding-inline:16px}

/* ---------- FAQ ---------- */
.faq-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:60px;align-items:start}
.faq-grid>div:first-child{position:sticky;top:120px}
.faq details{border-bottom:1px solid var(--k3)}
.faq summary{list-style:none;cursor:pointer;padding:24px 50px 24px 0;font-size:clamp(18px,1.7vw,22px);font-weight:700;position:relative;transition:color .2s}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;background:var(--k2);border:1px solid var(--k3);display:grid;place-items:center;font-size:22px;color:var(--y);transition:transform .35s var(--ease),background .3s}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg);background:var(--y);color:var(--k)}
.faq summary:hover{color:var(--y)}
.faq details p{padding:0 50px 24px 0;opacity:.8;font-size:17px;animation:msgIn .4s var(--ease)}

/* ---------- CTA ---------- */
.cta{background:var(--y);padding:clamp(90px,12vw,160px) 0;position:relative;overflow:hidden}
.cta::before{content:"MONKI.";position:absolute;right:-4%;bottom:-8%;font-weight:900;font-size:32vw;letter-spacing:-.06em;line-height:.8;color:rgba(0,0,0,.05);pointer-events:none}
.cta-grid{position:relative;display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center}
.cta-title{font-size:clamp(56px,8.6vw,128px);line-height:.82;letter-spacing:-.06em;margin-bottom:28px}
.cta-title span{color:var(--w);-webkit-text-stroke:3px var(--k);display:inline-block;animation:bounceQ 2s ease-in-out infinite}
@keyframes bounceQ{0%,100%{transform:rotate(0)}50%{transform:rotate(14deg) translateY(-8px)}}
.form{background:var(--w);border-radius:28px;padding:36px;display:grid;gap:18px;box-shadow:10px 10px 0 var(--k),inset 0 0 0 3px var(--k)}
.form label>span,.form legend{display:block;font-weight:700;margin-bottom:8px;font-size:15px}
.form input:not([type=checkbox]){width:100%;font:inherit;font-size:17px;padding:14px 18px;border-radius:14px;border:2px solid var(--k);background:#fff;outline:none;transition:box-shadow .2s}
.form input:not([type=checkbox]):focus{box-shadow:4px 4px 0 var(--y),4px 4px 0 2px var(--k)}
.form input.err{border-color:#d62828;animation:wiggle .35s}
.form fieldset{border:0}
.checks{display:flex;flex-wrap:wrap;gap:8px}
.checks label{cursor:pointer}
.checks input{position:absolute;opacity:0;pointer-events:none}
.checks span{display:inline-block;padding:10px 16px;border-radius:999px;border:2px solid var(--k);font-weight:700;font-size:15px;transition:all .2s var(--ease)}
.checks input:checked+span{background:var(--k);color:var(--y);transform:rotate(-3deg)}
.checks input:focus-visible+span{box-shadow:0 0 0 3px var(--y)}
.form .btn{justify-content:center}
.form-msg{font-weight:700;min-height:1.5em;font-size:15px}

/* ---------- CLIENTES ---------- */
.logos{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.logo-card{margin:0;display:flex;flex-direction:column;gap:14px}
.logo-card img{width:100%;aspect-ratio:4/3;object-fit:contain;padding:22px;border-radius:var(--r);box-shadow:inset 0 0 0 3px var(--k),8px 8px 0 var(--k);transition:transform .45s cubic-bezier(.3,1.6,.5,1),box-shadow .3s}
.logo-card.on-dark img{background:#000;box-shadow:inset 0 0 0 3px var(--k),8px 8px 0 var(--w)}
.logo-card img.tight{padding:0;object-fit:cover}
.logo-card.on-light img{background:#fff}
.logo-card:nth-child(odd):hover img{transform:rotate(-3deg) translateY(-6px)}
.logo-card:nth-child(even):hover img{transform:rotate(3deg) translateY(-6px)}
.logo-card figcaption{font-family:var(--mono);font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.06em}

/* ---------- EQUIPO ---------- */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.member{display:flex;flex-direction:column;gap:22px;background:var(--k2);border:1px solid var(--k3);border-radius:28px;padding:28px;transition:border-color .3s,transform .4s var(--ease)}
.member:hover{border-color:var(--y);transform:translateY(-6px)}
.member-photo{position:relative;aspect-ratio:4/5;display:grid;place-items:end center}
.member-blob{position:absolute;inset:6% 0 0;width:100%;height:94%;fill:var(--y);transition:transform .6s cubic-bezier(.3,1.5,.5,1)}
.member:hover .member-blob{transform:rotate(-6deg) scale(1.04)}
.member-initials{position:absolute;inset:0;display:grid;place-items:center;font-weight:900;font-size:clamp(56px,6vw,88px);letter-spacing:-.05em;color:var(--k);padding-top:12%}
.member-photo img{position:absolute;inset:6% 0 0;width:100%;height:94%;object-fit:cover;object-position:50% 8%;mix-blend-mode:multiply;
  -webkit-mask:var(--blob) center/contain no-repeat;mask:var(--blob) center/contain no-repeat;transition:transform .6s cubic-bezier(.3,1.5,.5,1)}
.member:hover .member-photo img{transform:rotate(-6deg) scale(1.04)}
.member-photo{--blob:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='180 0 1260 1500'%3E%3Cpath d='M795 15 C990 15 1160 255 1170 265 L1305 420 C1380 505 1405 610 1397 660 C1385 780 1383 920 1383 920 C1380 1150 1320 1300 1240 1355 C1080 1475 870 1483 860 1483 C810 1485 520 1480 320 1210 C150 980 210 700 300 490 C330 420 355 410 380 380 C520 180 670 15 795 15 Z'/%3E%3C/svg%3E");isolation:isolate}
.member-sticker{z-index:2}
.member .member-photo{width:min(100%,280px);margin-inline:auto}
.member-photo img.headshot{object-position:50% 30%;filter:brightness(1.1) contrast(1.05)}
.member-photo:has(img) .member-initials{display:none}
.member-sticker{position:absolute;top:4%;right:-4%;background:var(--w);color:var(--k);font-weight:900;font-size:15px;padding:6px 12px;border-radius:10px;box-shadow:3px 3px 0 var(--y),inset 0 0 0 2px var(--k);transform:rotate(8deg)}
.member h3{font-size:clamp(26px,2.6vw,36px);font-weight:900;letter-spacing:-.04em;line-height:1}
.member-role{font-family:var(--mono);font-size:13px;text-transform:uppercase;letter-spacing:.12em;color:var(--y);margin:10px 0 14px}
.member-info>p:not(.member-role){opacity:.8;font-size:16px}
.member-skills{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.member-skills li{font-size:13px;font-weight:700;padding:6px 12px;border-radius:999px;border:1px solid var(--y);color:var(--y)}

@media (max-width:1024px){
  .logos{grid-template-columns:1fr 1fr}
  .team{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .team{grid-template-columns:1fr}
  .member{padding:22px}
  .member-photo{max-width:260px;margin-inline:auto;width:100%}
  .logos{gap:14px}
  .logo-card img{padding:14px;box-shadow:inset 0 0 0 3px var(--k),5px 5px 0 var(--k)}
  .logo-card.on-dark img{box-shadow:inset 0 0 0 3px var(--k),5px 5px 0 var(--w)}
}

/* ---------- WHATSAPP FLOAT ---------- */
.wa-float{position:fixed;right:20px;bottom:20px;z-index:150;display:flex;align-items:center;gap:10px;background:var(--k);color:var(--y);font-weight:800;padding:12px 18px 12px 12px;border-radius:999px;box-shadow:4px 4px 0 var(--y),4px 4px 0 2px var(--k);transform:translateY(120px);transition:transform .6s cubic-bezier(.3,1.5,.5,1),box-shadow .2s}
.ready .wa-float{transform:none;transition-delay:1.6s}
.wa-float:hover{box-shadow:6px 6px 0 var(--y),6px 6px 0 2px var(--k)}
.wa-float svg{width:34px;height:34px;padding:6px;border-radius:50%;background:var(--y);fill:var(--k)}
.wa-float::before{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 0 rgba(255,214,0,.7);animation:waPing 2.4s infinite 3s}
@keyframes waPing{70%,100%{box-shadow:0 0 0 16px rgba(255,214,0,0)}}
@media (max-width:720px){.wa-float span{display:none}.wa-float{padding:10px}}

/* ---------- FOOTER ---------- */
.footer{background:var(--k);color:var(--w);padding:60px 0 40px}
.foot-grid{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px 30px}
.foot-brand{font-weight:900;font-size:48px;letter-spacing:-.05em;color:var(--y);margin-right:auto}
.foot-brand span{color:var(--w)}
.foot-small{width:100%;opacity:.5;font-size:14px}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1024px){
  .nav-links{display:none}
  .burger{display:block}
  .nav-cta{margin-left:auto}
  .nav-links.open{display:flex;position:absolute;top:calc(100% + 10px);left:0;right:0;flex-direction:column;background:var(--k);color:var(--w);padding:16px;border-radius:24px}
  .nav-links.open a{padding:14px 18px;font-size:18px}
  .hero-inner{grid-template-columns:1fr}
  .hero-monkey{max-width:380px;order:-1;margin-top:10px}
  .demo-grid,.fly-grid,.market,.faq-grid,.cta-grid{grid-template-columns:1fr}
  .faq-grid>div:first-child{position:static}
  .panels{flex-direction:column;height:auto}
  .panel{flex:none;height:84px}
  .panel.active{flex:none;height:auto}
  .panel-title-v{writing-mode:horizontal-tb;transform:translateY(-50%);top:50%;bottom:auto;left:72px;font-size:28px}
  .panel-num{top:50%;transform:translateY(-50%)}
  .panel.active .panel-num{top:22px;transform:none}
  .panel-body{position:relative;min-width:0;display:none;padding:60px 26px 30px}
  .panel.active .panel-body{display:flex}
  .timeline{grid-template-columns:1fr;gap:28px}
  .tl-line{top:30px;bottom:30px;left:30px;right:auto;width:4px;height:auto}
  .tl-fill{transform-origin:50% 0;transform:scaleY(0)}
  .tl-step{padding-left:90px}
  .tl-step span{position:absolute;left:0;top:0}
}
@media (max-width:720px){
  .nav{padding:8px 8px 8px 18px;gap:12px}
  .nav-cta{padding:11px 16px;font-size:14px}
  .nav-cta .arr{display:none}
  .hero{padding-top:100px}
  .eyebrow{font-size:11px;letter-spacing:.03em}
  .hero-monkey{max-width:280px}
  .sticker{font-size:12px;padding:7px 11px}
  .hero-bottom{grid-template-columns:1fr 1fr;gap:0 16px}
  .hero-bottom div{flex-direction:column;gap:0}
  .btn-lg{font-size:16px;padding:16px 22px;white-space:normal}
  .panel ul{grid-template-columns:1fr}
  .panel-price b{font-size:44px}
  .calc{grid-template-columns:1fr}
  .calc-inputs,.calc-out{padding:28px 22px}
  .phone{width:300px;height:580px}
  .phone-badge{left:-10px;bottom:-20px}
  .bars{height:280px;gap:8px}
  .bar span{font-size:13px}
  .bar.big span{font-size:16px}
  .form{padding:24px}
}
@media (max-width:400px){
  .nav-cta{display:none}
  .burger{margin-left:auto}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}