/* Portada: composiciones propias de index.html (el sistema base vive en site.css) */

:root{
  --bleed:max(var(--gut),calc((100vw - var(--w)) / 2 + var(--gut)));
  --tint-o:linear-gradient(160deg,#fff3e6 0%,#ffffff 62%);
  --tint-b:linear-gradient(160deg,#e3eeff 0%,#ffffff 68%);
  --check:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.6 6.3l2.2 2.2 4.6-4.9' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --spot:rgba(24,164,251,.12);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --tint-o:linear-gradient(160deg,#241a3a 0%,#0e1741 62%);
    --tint-b:linear-gradient(160deg,#122a6b 0%,#0e1741 68%);
    --spot:rgba(106,169,255,.14);
  }
}

#top{position:absolute;top:0;left:0;width:1px;height:.5rem;pointer-events:none}
.sec{position:relative;padding-block:clamp(3.5rem,7.5vw,6.5rem)}
.sec.tight{padding-block:clamp(1.75rem,4vw,3.5rem)}
.anchor{position:absolute;top:0;left:0}
.sec-head{max-width:47.5rem;margin-bottom:clamp(1.875rem,4vw,3.5rem)}
.sec-head .lead{margin-top:1rem}

/* viñetas: círculo de degradado con marca de verificación */
.chk,.pl{display:grid;gap:.625rem;margin-top:1rem}
.chk li,.pl li{position:relative;padding-left:1.75rem;text-wrap:pretty}
.chk li::before,.pl li::before{content:"";position:absolute;left:0;top:.2em;width:1.1875rem;height:1.1875rem;border-radius:50%;background:var(--check) center/.6875rem .6875rem no-repeat,var(--grad-brand);box-shadow:0 3px 8px -3px rgba(11,71,207,.6)}
.chk.big{gap:.8125rem;font-size:1rem;margin-top:1.5rem}
.chk.two{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem 2.5rem;margin-top:1.375rem}
.chk.two li{display:grid;gap:2px}
.chk.two li span{color:var(--ink-2);font-size:.875rem}
.on-dark .chk li,.on-dark .pl li{color:#d6e0ff}
.on-dark .chk li::before,.on-dark .pl li::before{background:var(--check) center/.6875rem .6875rem no-repeat,rgba(255,255,255,.18);box-shadow:inset 0 0 0 1px rgba(255,255,255,.32)}

/* ---------- inicio ---------- */
.hero{padding-top:.375rem}
.hero-stage{position:relative;margin-inline:.75rem;border-radius:var(--r-xl);background:var(--grad-night);color:#fff;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);padding-block:clamp(1.75rem,3.4vw,3.25rem) clamp(3.5rem,5.4vw,5rem)}
.hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,11fr) minmax(0,13fr);gap:clamp(1.25rem,3vw,3.5rem);align-items:center}
.hero-copy .h1{color:#fff;font-size:clamp(2rem,3.7vw,3.25rem)}
.hero-copy .lead{margin-top:1.25rem;color:#bccaf2;font-size:clamp(1.05rem,1.4vw,1.2rem);max-width:34ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}

.hero-visual{--hh:clamp(19rem,calc(100svh - 12.5rem),34rem);position:relative;justify-self:end;width:min(100%,calc(var(--hh) * 1.34));aspect-ratio:1.34/1;perspective:2000px}
.hv{position:absolute}
.hv .dev{transform-origin:50% 50%}
.l-main{right:0;top:0;width:80%}
.l-main .dev{transform:rotateY(-7deg) rotateX(3deg) rotateZ(.4deg)}
.l-desk{left:0;bottom:0;width:54%}
.l-desk .dev{transform:rotateY(8deg) rotateX(3deg) rotateZ(-1.5deg)}
.l-phone{right:3%;bottom:0;width:22%}
.l-phone .dev{transform:rotateZ(3deg) rotateY(-6deg)}
.hero-visual .chip{position:absolute;z-index:3}
.c1{left:1%;top:9%}
.c2{right:-1%;top:34%}
.c3{left:49%;bottom:2%}
.js .hv{animation:hvIn 1s var(--ease) backwards}
.js .l-desk{animation-delay:.12s}
.js .l-phone{animation-delay:.24s}
@keyframes hvIn{from{opacity:0;translate:0 34px;scale:.96}}
.js .chip.c1{animation:floaty 7s ease-in-out .4s infinite}
.js .chip.c2{animation:floaty 8s ease-in-out 1.2s infinite}
.js .chip.c3{animation:floaty 6.5s ease-in-out .8s infinite}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}

.proof{position:relative;z-index:3;margin-top:-2.375rem;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:1rem clamp(1.25rem,3vw,2.75rem);padding:.875rem clamp(1.25rem,3vw,2.125rem) .875rem .875rem;background:var(--surface);border-radius:var(--r-l);box-shadow:var(--shadow-m),inset 0 0 0 1px var(--line)}
.proof-logo{display:grid;place-items:center;width:4.25rem;height:4.25rem;border-radius:1.125rem;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.proof-logo img{height:3.125rem;width:auto}
.proof-txt{display:grid;gap:.25rem;font-size:.95rem}
.proof-txt b{font-weight:600}
.proof-stat{display:grid;gap:.25rem;align-content:center}
.proof-stat strong{font-size:1.4rem;font-weight:600;letter-spacing:-.03em;line-height:1}
.proof-stat span{font-size:.78rem;color:var(--ink-3);white-space:nowrap}

/* ---------- ficha: un dato, tres lectores ---------- */
.ficha-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.ficha-lead{margin:.625rem 0 1.375rem;color:var(--ink-2);max-width:42ch}
.ficha-card{padding:1.375rem;background:var(--surface);border-radius:var(--r-l);box-shadow:var(--shadow-m),inset 0 0 0 1px var(--line)}
.ficha-top{display:flex;align-items:center;gap:.875rem;padding-bottom:1rem;border-bottom:1px solid var(--line)}
.avatar{display:grid;place-items:center;width:2.875rem;height:2.875rem;flex:none;border-radius:50%;background:var(--grad-brand);color:#fff;font-weight:600;font-size:.9rem;box-shadow:0 8px 16px -8px rgba(11,71,207,.7)}
.ficha-name{font-weight:600;font-size:1.05rem;letter-spacing:-.01em}
.ficha-sub{font-size:.78rem}
.tagpill{margin-left:auto;padding:.3125rem .75rem;border-radius:999px;background:var(--bg-2);color:var(--blue);font-weight:600;font-size:.75rem}
.fl{margin-top:.5rem}
.fl li{display:flex;justify-content:space-between;gap:.875rem;padding:.6875rem .75rem;margin-inline:-.75rem;border-radius:.75rem;font-size:.95rem;transition:background-color .35s var(--ease)}
.fl li>i{display:none}
.fl li b{font-weight:500;color:var(--ink-2)}
.fl li span{font-weight:600;text-align:right}
.fl li.hit{background:var(--hl)}
.ficha-note{margin-top:.875rem;font-size:.8125rem;color:var(--ink-3);text-wrap:pretty}

.ficha-stage{position:relative;aspect-ratio:1400/880;border-radius:var(--r-xl);background:var(--grad-night);overflow:hidden;box-shadow:var(--shadow-l)}
.fs{position:absolute;inset:0;margin:0;display:flex;justify-content:center;align-items:center;opacity:0;visibility:hidden;transform:translateY(10px) scale(.985);filter:blur(4px);
  transition:opacity .3s var(--ease),transform .3s var(--ease),filter .3s var(--ease),visibility 0s .3s}
.fs.on{opacity:1;visibility:visible;transform:none;filter:none;transition-delay:0s}
.fs .dev.browser{width:86%;box-shadow:0 30px 60px -20px rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,255,255,.08)}
.fs .dev.phone{height:90%;aspect-ratio:509/779;width:auto}
.fs .dev.phone img{height:100%;width:100%;object-fit:cover}
.ficha-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.625rem;margin-top:.875rem}
.ftab{display:flex;align-items:center;gap:.625rem;text-align:left;padding:.625rem .875rem .625rem .625rem;border:0;border-radius:var(--r-m);background:var(--surface);box-shadow:var(--shadow-s),var(--edge);font-weight:600;font-size:.875rem;letter-spacing:-.01em;line-height:1.3;color:var(--ink-2);transition:box-shadow .3s var(--ease),color .25s}
.ftab .ibadge{width:2.25rem;height:2.25rem;border-radius:.6875rem}
.ftab .ibadge .ico{width:1.125rem;height:1.125rem}
.ftab .ft-desc{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ftab.on{color:var(--ink);box-shadow:var(--shadow-m),inset 0 0 0 2px var(--sky)}
@media (hover:hover){.ftab:hover{color:var(--ink)}}
.ficha-desc{margin-top:.875rem;padding:.875rem 1.125rem;border-radius:var(--r-m);background:var(--hl);color:var(--ink-2);font-size:.9rem;text-wrap:pretty;min-height:4.4em}
.ficha-desc em{font-style:normal;font-weight:600;color:var(--ink)}
.ficha-close{margin-top:clamp(1.75rem,4vw,3rem);max-width:62ch;color:var(--ink-2);font-size:1rem}

/* ---------- demostración (carrusel a sangre) ---------- */
.demo-sec{margin-inline:.75rem;border-radius:var(--r-xl);background:var(--grad-soft);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden}
.shot-car{margin-top:-.375rem}
.car-track{display:flex;gap:1.5rem;overflow-x:auto;scroll-snap-type:x mandatory;cursor:grab;padding:.5rem var(--bleed) 2.25rem;scroll-padding-inline:var(--bleed);scrollbar-width:none}
.car-track::-webkit-scrollbar{display:none}
.car-track.drag{cursor:grabbing;scroll-snap-type:none;user-select:none}
.car-slide{flex:0 0 min(80vw,55rem);scroll-snap-align:start;margin:0}
.car-slide img{pointer-events:none;-webkit-user-drag:none}
.car-slide figcaption{margin-top:1rem;font-weight:600;color:var(--ink-2);text-align:center}
.car-ctl{display:flex;justify-content:space-between;align-items:center;gap:1.25rem;padding-bottom:.375rem}
.dots{display:flex;gap:.5rem}
.dots button{position:relative;width:1.875rem;height:.375rem;padding:0;border:0;background:none}
.dots button::before{content:"";position:absolute;inset:-.875rem -.1875rem}
.dots button::after{content:"";position:absolute;inset:0;border-radius:.375rem;background:var(--line-2);transform:scaleX(.4);transform-origin:left;transition:transform .3s var(--ease),background .25s}
.dots button.on::after{transform:scaleX(1);background:var(--grad-brand)}
.car-arrows{display:flex;gap:.625rem}
.car-btn{display:grid;place-items:center;width:3rem;height:3rem;border:0;border-radius:.875rem;background:var(--surface);box-shadow:var(--shadow-s),inset 0 0 0 1px var(--line);transition:transform .16s var(--ease),box-shadow .25s}
.car-btn:first-child .ico{transform:rotate(180deg)}
.car-btn:active{transform:scale(.95)}
@media (hover:hover){.car-btn:hover{box-shadow:var(--shadow-m),inset 0 0 0 1px var(--sky)}}

/* ---------- CZ Wisp: mosaico ---------- */
.bento{--pad:clamp(1.375rem,2.6vw,2rem);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1.125rem}
.cell{position:relative;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;gap:1.375rem;min-height:30.625rem;padding:var(--pad) var(--pad) 0;border-radius:var(--r-xl);background:var(--surface);box-shadow:var(--shadow-s),inset 0 0 0 1px var(--line)}
.cell .fx{z-index:-1}
.cell-txt{position:relative;display:grid;gap:.75rem;align-content:start;justify-items:start}
.cell-head{display:flex;align-items:center;gap:.875rem}
.cell-txt p{max-width:46ch;text-wrap:pretty;color:var(--ink-2)}
.cell-txt .chk{justify-self:stretch}
.on-dark .cell-txt p,.on-dark .lead{color:#c7d3f6}
.c-a{grid-column:span 7;background:var(--grad-night);color:#fff}
.c-b{grid-column:span 5;background:var(--tint-o)}
.c-c{grid-column:span 5;background:var(--tint-b)}
.c-d{grid-column:span 7;background:var(--grad-brand);color:#fff}
.cell-crop{margin-top:auto;margin-right:calc(-1 * var(--pad));height:16.25rem;overflow:hidden}
.cell-crop .dev{width:112%;border-radius:1.125rem 0 0 0;transform:perspective(1400px) rotateX(4deg) rotateY(-5deg);transform-origin:0 0;box-shadow:0 -10px 50px -18px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.08)}
.cell-crop .vp{overflow:hidden;height:15.625rem}
.cell-crop .vp img{width:190%;max-width:none;margin-left:var(--ox,-30%);margin-top:var(--oy,-4%)}
.spot::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .35s;background:radial-gradient(26.25rem circle at var(--mx,50%) var(--my,30%),var(--spot),transparent 62%)}
.on-dark.spot::after{background:radial-gradient(26.25rem circle at var(--mx,50%) var(--my,30%),rgba(255,255,255,.14),transparent 62%)}
@media (hover:hover){.spot:hover::after{opacity:1}}

/* ---------- app de autogestión ---------- */
.app-panel{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(1.5rem,4vw,4rem);align-items:center;padding:clamp(1.75rem,4vw,4rem);border-radius:var(--r-xl);background:var(--grad-soft);box-shadow:inset 0 0 0 1px var(--line)}
.dia.light{border-color:rgba(11,95,216,.16);background:linear-gradient(135deg,rgba(24,164,251,.22),rgba(24,164,251,0) 62%)}
.app-copy,.phone-car{position:relative}
.app-copy .lead{margin-top:1rem}
.phones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.75rem,2vw,1.625rem);align-items:end}
.phone{margin:0;transition:transform .5s var(--ease)}
.phone:nth-child(2){transform:translateY(-30px)}
.phone figcaption{margin-top:1rem;text-align:center;font-weight:600;font-size:.84rem;color:var(--ink-2);text-wrap:balance}
.phone-car .dots{display:none}

/* ---------- CZ Desk ---------- */
.desk-panel{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:center;padding:clamp(1.75rem,4vw,4rem);border-radius:var(--r-xl)}
.desk-plates,.desk-copy{position:relative}
.desk-plates{padding-bottom:24%}
.dp-a{width:96%}
.dp-a .dev{transform:perspective(1600px) rotateY(8deg) rotateX(3deg)}
.dp-b{position:absolute;right:-2%;bottom:0;width:72%}
.dp-b .dev{transform:perspective(1600px) rotateY(-6deg) rotateX(3deg);box-shadow:0 40px 70px -20px rgba(0,0,0,.7),inset 0 0 0 1px rgba(255,255,255,.1)}
.desk-copy .h2{font-size:clamp(1.6rem,2.8vw,2.3rem);color:#fff}
.desk-copy .lead{margin-top:1rem;color:#c0cdf3}
.asist{display:flex;gap:.875rem;margin:1.5rem 0 1.375rem;padding:1.25rem 0 0;border-top:1px solid rgba(255,255,255,.18)}
.asist h3{margin-bottom:.375rem;color:#fff}
.asist p{color:#c0cdf3;font-size:.9rem;text-wrap:pretty}

/* ---------- integraciones ---------- */
.marquee{overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.mq-track{display:flex;width:max-content;padding:.625rem 0 1.625rem;animation:mq 48s linear infinite}
.marquee:hover .mq-track{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-50%)}}
.itile{display:flex;align-items:center;gap:1rem;width:23.125rem;margin-right:1rem;padding:1.125rem 1.5rem 1.125rem 1.125rem;background:var(--surface);border-radius:var(--r-l);box-shadow:var(--shadow-s),inset 0 0 0 1px var(--line)}
.itile h3{font-size:1rem;font-weight:600;letter-spacing:-.015em}
.itile p{margin-top:2px;font-size:.84rem;color:var(--ink-2);text-wrap:pretty}
.mono{display:grid;place-items:center;width:3.625rem;height:3.625rem;flex:none;border-radius:1.125rem;background:var(--grad-brand);color:#fff;font-weight:700;font-size:1rem;letter-spacing:-.02em;box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 10px 18px -8px rgba(11,71,207,.6)}
.m2{background:linear-gradient(135deg,#0b2e96,#2aa9ff)}
.m3{background:var(--grad-orange);color:var(--on-orange);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 10px 18px -8px rgba(247,126,33,.7)}
.m4{background:linear-gradient(135deg,#050c33,#0a3fc0)}
.m5{background:linear-gradient(135deg,#0a3fc0,#18a4fb)}
@media (prefers-reduced-motion:reduce){
  .mq-track{animation:none;flex-wrap:wrap;width:auto;justify-content:center;padding-inline:var(--gut);row-gap:1rem}
  .itile.dup{display:none}
  .marquee{-webkit-mask:none;mask:none}
}

/* ---------- precios ---------- */
.ptabs{position:relative;display:inline-flex;padding:.3125rem;margin-bottom:1.875rem;background:var(--surface);border-radius:999px;box-shadow:var(--shadow-s),inset 0 0 0 1px var(--line)}
.ptabs::before{content:"";position:absolute;top:.3125rem;bottom:.3125rem;left:.3125rem;width:calc(50% - .3125rem);border-radius:999px;background:var(--grad-brand);box-shadow:0 8px 16px -8px rgba(11,71,207,.7);transition:transform .34s var(--ease)}
.ptabs[data-i="1"]::before{transform:translateX(100%)}
.pt{position:relative;flex:1 1 0;min-width:7.75rem;padding:.6875rem 1.625rem;border:0;background:none;border-radius:999px;font-weight:600;color:var(--ink-2);transition:color .25s}
.pt.on{color:#fff}
.pane{display:none}
.pane.on{display:block;opacity:1;transform:none;transition:opacity .28s var(--ease),transform .28s var(--ease)}
@starting-style{.pane.on{opacity:0;transform:translateY(8px)}}
.plans{display:grid;gap:1rem;align-items:stretch}
.plans-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.plans-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.plan{position:relative;display:flex;flex-direction:column;gap:1.125rem;padding:1.625rem 1.5rem 1.5rem;border-radius:var(--r-xl);background:var(--surface);box-shadow:var(--shadow-s),inset 0 0 0 1px var(--line)}
.pn{display:flex;align-items:center;justify-content:space-between;gap:.625rem}
.badge{padding:.25rem .6875rem;border-radius:999px;background:var(--grad-orange);color:var(--on-orange);font-style:normal;font-weight:700;font-size:.72rem;white-space:nowrap}
.pp{display:flex;align-items:baseline;gap:.375rem;white-space:nowrap}
.pp strong{font-size:clamp(2.5rem,3.6vw,3.3rem);font-weight:600;letter-spacing:-.035em;line-height:1}
.pp small{font-size:.9rem;color:var(--ink-3)}
.pl{flex:1;margin-top:0;font-size:.92rem}
.sub{font-size:.8125rem;color:var(--ink-3);text-wrap:pretty}
.plan.pop{color:#fff;background:var(--grad-brand);translate:0 -10px;box-shadow:var(--shadow-l),inset 0 0 0 1px rgba(255,255,255,.2);padding-bottom:1.875rem}
.plan.pop .pl li{color:#e2eaff}
.plan.pop .pl li::before{background:var(--check) center/.6875rem .6875rem no-repeat,rgba(255,255,255,.2);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.plan.pop .pp small,.plan.pop .sub{color:#c5d3fb}
@media (hover:hover){.plan:not(.pop):hover{box-shadow:var(--shadow-m),inset 0 0 0 1px var(--sky)}}
.incl{margin-top:clamp(1.75rem,4vw,2.75rem);padding:clamp(1.375rem,3vw,2.25rem);background:var(--surface);border-radius:var(--r-xl);box-shadow:var(--shadow-s),inset 0 0 0 1px var(--line)}
.fine{margin-top:1.375rem;font-size:.8125rem;color:var(--ink-3);max-width:70ch}

/* ---------- compromiso ---------- */
.promise-stage{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,13fr) minmax(0,10fr);gap:clamp(1.5rem,4vw,4rem);align-items:center;padding:clamp(1.75rem,4vw,4rem);border-radius:var(--r-xl);background:var(--grad-soft);box-shadow:var(--edge)}
.promise-copy,.promise-visual{position:relative}
.promise-copy .lead{margin-top:1rem}
.promise-copy .chk.two{gap:1.125rem 2rem}
.promise-visual{padding:2% 0 8%}
.promise-visual .dev{transform:perspective(1600px) rotateY(-9deg) rotateX(4deg) rotateZ(1deg)}
.promise-visual .chip{position:absolute;z-index:2}
.pc1{left:-4%;bottom:2%}
.pc2{right:-2%;top:1%}

/* ---------- nosotros ---------- */
.about-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(1.5rem,5vw,4.5rem);align-items:start}
.about-copy .prose{margin-top:1.375rem}
.about-copy .prose p{font-size:1rem;color:var(--ink-2)}
.dev-cont{display:flex;gap:1rem;margin-top:1.875rem;padding:1.25rem;border-radius:var(--r-l);background:var(--surface);box-shadow:var(--shadow-s),inset 0 0 0 1px var(--line)}
.dev-cont h3{margin-bottom:.375rem}
.dev-cont p{color:var(--ink-2);font-size:.92rem;text-wrap:pretty}
.facts{position:relative;overflow:hidden;display:flex;flex-direction:column;align-self:stretch;padding:clamp(1.5rem,3vw,2.5rem) clamp(1.5rem,3vw,2.5rem) 0;border-radius:var(--r-xl);background:var(--grad-brand);color:#fff;box-shadow:var(--shadow-l)}
.facts>*:not(.fx){position:relative}
.fact-main output{display:block;font-size:clamp(3.2rem,6.2vw,5.2rem);font-weight:600;letter-spacing:-.04em;line-height:1}
.fact-main span{display:block;margin-top:.5rem;color:#cddaff}
.fact-line{display:flex;align-items:center;gap:.625rem;margin-top:1.375rem;padding-top:1.125rem;border-top:1px solid rgba(255,255,255,.22);color:#e6edff;font-size:.95rem}
.fact-line .ico{color:#8fd0ff}
.fact-visual{margin-top:auto;padding-top:1.375rem;height:15.625rem;overflow:hidden}
.fact-visual .dev.phone{width:13.125rem;margin-left:auto;margin-right:2%;transform:rotate(3deg)}
.custom-band{position:relative;overflow:hidden;isolation:isolate;margin-top:clamp(2.25rem,5vw,4rem);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1.375rem 2.75rem;padding:clamp(1.625rem,3.6vw,2.875rem);border-radius:var(--r-xl);background:var(--grad-night);color:#fff}
.custom-band .fx{z-index:-1}
.custom-band h3{font-size:clamp(1.3rem,2.2vw,1.8rem);max-width:24ch;color:#fff}
.custom-band p{margin-top:.5rem;color:#c0cdf3;max-width:56ch}

/* ---------- aliado ---------- */
.ally{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(1.5rem,5vw,4.5rem);align-items:center;padding:clamp(1.5rem,4vw,3.5rem);border-radius:var(--r-xl);background:var(--surface);box-shadow:var(--shadow-m),inset 0 0 0 1px var(--line)}
.ally-logo{display:grid;place-items:center;padding:clamp(1.75rem,4vw,3rem);border-radius:var(--r-l);background:linear-gradient(160deg,#f7faff,#e4eeff);box-shadow:inset 0 0 0 1px var(--line)}
.ally-logo img{height:clamp(12.5rem,24vw,18.75rem);width:auto}
.ally-copy .h2{font-size:clamp(1.6rem,2.8vw,2.4rem)}
.ally-copy .lead{margin-top:1.125rem}
.ally-copy p+p{margin-top:.875rem}
.ally-copy>p:not(.lead){color:var(--ink-2)}
.ally-copy .btn{margin-top:1.5rem}

/* ---------- preguntas frecuentes ---------- */
.faq-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(1.5rem,5vw,4.5rem);align-items:start}
.faq-head{position:sticky;top:calc(var(--hdr) + 1.75rem)}
.faq-head .lead{margin-top:.875rem}
.faq-cta{display:flex;flex-wrap:wrap;align-items:center;gap:.875rem 1.375rem;margin-top:1.375rem}
.q{margin-bottom:.625rem;border-radius:var(--r-l);background:var(--surface);box-shadow:var(--shadow-s),inset 0 0 0 1px var(--line);transition:box-shadow .3s var(--ease)}
.q.open{box-shadow:var(--shadow-m),inset 0 0 0 1px color-mix(in srgb,var(--sky) 45%,var(--line))}
.q h3{font-size:1rem}
.q button{display:flex;justify-content:space-between;align-items:center;gap:1.25rem;width:100%;padding:1.125rem 1.25rem 1.125rem 1.5rem;border:0;background:none;text-align:left;border-radius:var(--r-l);font-weight:600;font-size:1rem;letter-spacing:-.01em;line-height:1.35}
.qi{display:grid;place-items:center;width:2.125rem;height:2.125rem;flex:none;border-radius:50%;background:var(--bg-2);transition:transform .25s var(--ease),background-color .25s,color .25s}
.qi .ico{width:1.0625rem;height:1.0625rem}
@media (hover:hover){.q button:hover .qi{background:var(--hl)}}
.q.open .qi{transform:rotate(45deg);background:var(--grad-brand);color:#fff}
.a>div{overflow:hidden}
.a p{padding:0 4rem 1.375rem 1.5rem;max-width:64ch;color:var(--ink-2)}
.js .a{display:grid;grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows .3s var(--ease),visibility 0s .3s}
.js .q.open .a{grid-template-rows:1fr;visibility:visible;transition:grid-template-rows .3s var(--ease),visibility 0s}

/* ---------- contraportada: contacto ---------- */
.contact-wrap{padding-block:clamp(1.5rem,4vw,3rem) clamp(1.5rem,4vw,3.5rem)}
.contact-sec{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(1.5rem,5vw,4.5rem);align-items:start;padding:clamp(1.75rem,5vw,4.5rem);border-radius:var(--r-xl)}
.contact-copy,.form-sheet{position:relative}
.contact-copy .h2{font-size:clamp(1.8rem,3.3vw,2.8rem);color:#fff}
.contact-copy .lead{margin:1rem 0 1.75rem}
.contact-lines{display:grid;gap:.875rem;margin-top:2.375rem}
.contact-lines li{display:flex;align-items:center;gap:.875rem}
.contact-lines small{display:block;font-size:.75rem;color:#9fb0e4}
.contact-lines a{color:#8fd0ff;font-weight:600;text-underline-offset:.1875rem}
@media (hover:hover){.contact-lines a:hover{color:var(--orange-2)}}
.contact-lines .muted{color:#a9b7e6}
.form-sheet{padding:clamp(1.375rem,3vw,2.25rem);border-radius:var(--r-l);background:var(--surface);color:var(--ink);box-shadow:var(--shadow-l)}
.form-lead{margin:.5rem 0 1.375rem;color:var(--ink-2);font-size:.9rem}
.frow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 1rem}
.form-sheet .campo{margin-bottom:1rem}
.form-sheet .btn{margin-top:.25rem}
.preview{margin-top:1.25rem;padding-top:1rem;border-top:1px solid var(--line)}
.preview-t{font-size:.8125rem;color:var(--ink-3);margin-bottom:.625rem}
.preview pre{margin:0;padding:.75rem 1rem;max-height:10.625rem;overflow:auto;white-space:pre-wrap;word-break:break-word;background:var(--bg-2);color:var(--ink-2);border-radius:1.125rem 1.125rem 1.125rem .375rem;font:inherit;font-size:.84rem;line-height:1.5}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .plans-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .plan.pop{translate:none}
  .proof{grid-template-columns:auto minmax(0,1fr) auto}
  .proof-stat:last-child{display:none}
}
@media (max-width:900px){
  .hero-grid{grid-template-columns:minmax(0,1fr)}
  .hero-visual{justify-self:center;width:min(100%,38rem);aspect-ratio:1.25/1;margin-top:.75rem}
  .ficha-grid,.app-panel,.desk-panel,.about-grid,.ally,.faq-grid,.contact-sec{grid-template-columns:minmax(0,1fr)}
  .faq-head{position:static}
  .desk-plates{order:2}
  .plans-3{grid-template-columns:minmax(0,1fr)}
  .promises{grid-template-columns:repeat(2,minmax(0,1fr))}
  .p-a,.p-b,.p-c,.p-d,.p-e{grid-column:span 1}
  .bento .cell{grid-column:1/-1;min-height:0}
  .cell-crop{height:13.75rem}
  .chk.two{grid-template-columns:minmax(0,1fr)}
  .ficha-tabs{grid-template-columns:minmax(0,1fr)}
  .promise-stage{grid-template-columns:minmax(0,1fr)}
  .ficha-stage{aspect-ratio:1400/940}
  .phones{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding:.375rem 1.25rem .875rem;scroll-padding-inline:1.25rem;gap:1rem;scrollbar-width:none}
  .phones::-webkit-scrollbar{display:none}
  .phone{flex:0 0 54%;scroll-snap-align:start}
  .phone:nth-child(2){transform:none}
  .phone-car{margin-inline:calc(-1 * clamp(1.75rem,4vw,4rem))}
  .phone-car .dots{display:flex;justify-content:center;padding:.375rem 0 0}
  .proof{grid-template-columns:auto minmax(0,1fr)}
  .proof-stat{display:none}
}
@media (max-width:640px){
  .frow{grid-template-columns:minmax(0,1fr)}
  .plans-4{grid-template-columns:minmax(0,1fr)}
  .promises{grid-template-columns:minmax(0,1fr)}
  .fact-row{grid-template-columns:minmax(0,1fr)}
  .car-slide{flex-basis:86vw}
  .car-arrows{display:none}
  .hero-visual{aspect-ratio:1.12/1}
  .l-desk{display:none}
  .l-main{width:100%}
  .l-phone{right:2%;bottom:0;width:30%}
  .hero-stage{padding-bottom:4.5rem}
  .c1{left:0;top:-6%}.c2,.c3{display:none}
  .itile{width:18.125rem}
  .promise-visual{padding-bottom:18%}
  .pc1{left:0}.pc2{right:0}
  .p-f{grid-template-columns:minmax(0,1fr);grid-template-areas:"i" "t" "p"}
}