@font-face{font-family:'Archivo';src:url('/v2/fonts/Archivo.woff2') format('woff2');font-weight:100 900;font-stretch:62% 125%;font-display:swap}

/* ── Tokens: Plano Vivo (gris de plano, tinta azul-negra, una sola señal) ── */
:root{
  --bg:#EEF1F3;--surface:#F8FAFB;--ink:#0D1620;--ink-2:#4A5866;--line:#C3CCD4;
  --signal:#086E8F;--signal-soft:rgba(8,110,143,.1);--on-signal:#fff;--danger:#B4321F;--wa:#1F8F55;
  --step--1:clamp(.8125rem,.79rem + .1vw,.875rem);--step-0:clamp(1rem,.96rem + .2vw,1.125rem);--step-1:clamp(1.2rem,1.1rem + .5vw,1.5rem);
  --step-2:clamp(1.6rem,1.3rem + 1.3vw,2.5rem);--step-3:clamp(2.1rem,1.4rem + 3vw,4rem);--step-4:clamp(2.3rem,1rem + 4vw,4.4rem);
  --s5:1.5rem;--s6:2rem;--s7:3rem;--s8:clamp(4rem,3rem + 4vw,7rem);--s9:clamp(5rem,3rem + 8vw,10rem);
  --r:2px;--r-in:12px;--r-card:16px;--gut:clamp(1rem,.5rem + 2.5vw,3rem);--max:1320px;
  --ease-out:cubic-bezier(.23,1,.32,1);--ease-io:cubic-bezier(.77,0,.175,1);
  --shadow:0 1px 2px rgba(13,22,32,.06),0 8px 24px -12px rgba(13,22,32,.18);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --bg:#0B1117;--surface:#111A22;--ink:#E6ECF1;--ink-2:#93A1AE;--line:#26333F;
  --signal:#3CCBEB;--signal-soft:rgba(60,203,235,.12);--on-signal:#05212B;--danger:#FF8A7A;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 12px 32px -12px rgba(0,0,0,.6);color-scheme:dark}}

/* ── Base ── */
*,*::before,*::after{box-sizing:border-box}*{margin:0}
html{-webkit-text-size-adjust:100%;scroll-padding-top:6rem}
html.lenis,html.lenis body{height:auto}.lenis.lenis-smooth{scroll-behavior:auto!important}
body{font-family:'Archivo',ui-sans-serif,system-ui,sans-serif;font-size:var(--step-0);line-height:1.6;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-x:clip;-webkit-tap-highlight-color:transparent;caret-color:var(--signal)}
::selection{background:var(--signal);color:var(--on-signal)}
html{scrollbar-color:var(--line) var(--bg)}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.2em}
button,input,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--signal);outline-offset:3px;border-radius:var(--r)}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:var(--gut);top:-4rem;z-index:100;background:var(--ink);color:var(--bg);padding:.6rem 1rem;border-radius:999px;text-decoration:none}.skip:focus{top:1rem}
.num{font-variant-numeric:tabular-nums;letter-spacing:.01em}
.ic{width:1.15em;height:1.15em;flex:none}
h1,h2,h3{font-stretch:125%;font-weight:800;line-height:.98;letter-spacing:-.02em;text-wrap:balance}
h1{font-size:var(--step-4)}h2{font-size:var(--step-3)}h3{font-size:var(--step-2);line-height:1.02}
p{text-wrap:pretty}
.lede{font-size:var(--step-1);line-height:1.5;color:var(--ink-2);max-width:40ch}
.muted{color:var(--ink-2)}
.sig{color:var(--signal)}

/* ── Escena 3D fija detrás de todo ── */
#scene{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:0;transition:opacity 900ms var(--ease-out)}
.has-3d #scene{opacity:1}
.scrim{position:fixed;inset:0;z-index:0;pointer-events:none;display:none;background:linear-gradient(90deg,var(--bg) 0%,color-mix(in srgb,var(--bg) 82%,transparent) 30%,transparent 58%)}
.has-3d .scrim{display:block}
@media (max-width:860px){.scrim{background:linear-gradient(0deg,var(--bg) 0%,color-mix(in srgb,var(--bg) 86%,transparent) 42%,transparent 64%)}}
.page{position:relative;z-index:1}
section{position:relative}

/* ── Botones ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:48px;padding:.8rem 1.4rem;border-radius:999px;font-weight:600;font-size:1rem;line-height:1.2;text-decoration:none;border:1px solid transparent;cursor:pointer;white-space:nowrap;
  transition:transform 160ms var(--ease-out),background-color 200ms ease,border-color 200ms ease,color 200ms ease;user-select:none;-webkit-user-select:none;touch-action:manipulation}
.btn:active{transform:scale(.97);transition-duration:100ms}
.btn .ic{width:1.1em;height:1.1em}
.btn-p{background:var(--signal);color:var(--on-signal);box-shadow:var(--shadow)}
.btn-g{background:var(--bg);color:var(--ink);border-color:var(--line)}
.btn-wa{background:var(--wa);color:#fff}
.flecha{transition:transform 200ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){.btn-p:hover{background:var(--ink);color:var(--bg)}.btn-g:hover{border-color:var(--ink)}.btn-wa:hover{background:#18784A}.btn:hover .flecha{transform:translateX(3px)}}
.btn[disabled]{opacity:.65;cursor:progress;transform:none}
.link{display:inline-flex;align-items:center;gap:.4rem;font-weight:600;color:var(--signal);text-decoration:none;width:max-content;max-width:100%;padding:.5rem 0}
.link .ic{width:1em;height:1em;transition:transform 200ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){.link:hover{text-decoration:underline}.link:hover .ic{transform:translateX(3px)}}

/* ── Encabezado en islas de cristal ── */
.hdr-progress{position:fixed;top:0;left:0;right:0;height:2px;background:var(--signal);transform-origin:left;transform:scaleX(var(--p,0));pointer-events:none;z-index:51}
.hdr{position:fixed;top:calc(12px + env(safe-area-inset-top));left:0;right:0;z-index:50;padding-inline:var(--gut);transition:transform 360ms var(--ease-out);pointer-events:none}
.hdr.oculto{transform:translateY(calc(-100% - 24px))}
.hdr-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;height:56px}
.isla{pointer-events:auto;border:1px solid transparent;border-radius:999px;transition:background-color 300ms ease,border-color 300ms ease}
.cristal{background:color-mix(in srgb,var(--bg) 64%,transparent);border-color:color-mix(in srgb,var(--line) 65%,transparent);box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 40%,transparent),0 6px 10px -8px rgba(13,22,32,.28)}
@supports (backdrop-filter:blur(1px)){.cristal{backdrop-filter:blur(20px) saturate(1.6);-webkit-backdrop-filter:blur(20px) saturate(1.6)}}
@supports not (backdrop-filter:blur(1px)){.cristal{background:var(--bg)}}
.marca{display:inline-flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--ink);flex:none}
.hdr .marca{justify-self:start;height:52px;padding:0 1.15rem 0 .75rem}
.hdr.sc .marca{background:color-mix(in srgb,var(--bg) 64%,transparent);border-color:color-mix(in srgb,var(--line) 65%,transparent)}
@supports (backdrop-filter:blur(1px)){.hdr.sc .marca{backdrop-filter:blur(20px) saturate(1.6);-webkit-backdrop-filter:blur(20px) saturate(1.6)}}
.marca svg{width:34px;height:34px;overflow:visible}
/* Logo tecnológico: el núcleo brilla y, al pasar el mouse, la señal recorre las pistas hasta los nodos */
.marca .nucleo{filter:drop-shadow(0 0 3px color-mix(in srgb,#19C6EE 70%,transparent))}
.marca .lg-pistas{stroke-dasharray:6;stroke-dashoffset:0}
.marca .lg-nodos circle{transform-box:fill-box;transform-origin:center;transition:transform 300ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .marca:hover .lg-pistas{animation:lg-senal 900ms var(--ease-out)}
  .marca:hover .lg-nodos circle{transform:scale(1.35)}
}
@keyframes lg-senal{from{stroke-dashoffset:6}to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.marca:hover .lg-pistas{animation:none}}
.marca .nucleo{transform-origin:14px 14px;transition:transform 420ms var(--ease-out)}
.marca span{font-stretch:125%;font-weight:700;font-size:1.04rem;letter-spacing:.24em;margin-right:-.24em;line-height:1}
@media (hover:hover) and (pointer:fine){.marca:hover .nucleo{transform:rotate(90deg) scale(.82)}}
.hdr-nav{position:relative;padding:5px}
.hdr-links{display:flex;gap:2px;list-style:none;padding:0}
.hdr-links a,.hdr-links span{display:block;padding:.6rem 1rem;border-radius:999px;font-size:.9rem;line-height:1.2;text-decoration:none;color:var(--ink-2);transition:color 150ms ease;white-space:nowrap}
@media (hover:hover){.hdr-links a:hover{color:var(--ink)}}
.hdr-on{position:absolute;inset:5px;pointer-events:none;clip-path:inset(0 100% 0 0 round 999px);transition:clip-path 260ms var(--ease-io)}
.hdr-on span{background:var(--ink);color:var(--bg)}
.hdr-fin{justify-self:end;display:flex;align-items:center;gap:.5rem;pointer-events:auto}
.hdr-fin .btn{padding:.6rem 1.25rem;font-size:.92rem}
.hdr-menu{display:none;position:relative;width:48px;height:48px;cursor:pointer;transition:transform 160ms var(--ease-out)}
.hdr-menu:active{transform:scale(.97)}
.hdr-menu span{position:absolute;left:15px;right:15px;top:50%;margin-top:-.75px;height:1.5px;background:var(--ink);transition:transform 240ms var(--ease-out)}
.hdr-menu span:first-child{transform:translateY(-4px)}.hdr-menu span:last-child{transform:translateY(4px)}
.hdr-menu[aria-expanded=true] span:first-child{transform:rotate(45deg)}.hdr-menu[aria-expanded=true] span:last-child{transform:rotate(-45deg)}
.mmenu{pointer-events:auto;position:absolute;top:calc(100% + 10px);right:var(--gut);width:min(360px,calc(100vw - 2 * var(--gut)));max-height:calc(100svh - 90px);overflow-y:auto;display:grid;gap:1.25rem;padding:1.5rem;border-radius:var(--r-card);background:var(--bg);border:1px solid var(--line);box-shadow:0 10px 12px -10px rgba(13,22,32,.35);
  transform-origin:top right;opacity:0;transform:scale(.96);visibility:hidden;transition:opacity 200ms var(--ease-out),transform 200ms var(--ease-out),visibility 0s linear 200ms}
.mmenu.abierto{opacity:1;transform:none;visibility:visible;transition:opacity 200ms var(--ease-out),transform 200ms var(--ease-out),visibility 0s}
.mmenu ul{list-style:none;padding:0;display:grid}
.mmenu .mm-p a{display:block;padding:.65rem 0;font-stretch:125%;font-weight:700;font-size:1.3rem;text-decoration:none;border-bottom:1px solid var(--line)}
.mmenu .mm-s{grid-template-columns:1fr 1fr;gap:.2rem .8rem}
.mmenu .mm-s a{display:block;padding:.35rem 0;font-size:.9rem;color:var(--ink-2);text-decoration:none}
.mmenu small{font-size:.8rem;color:var(--ink-2);font-weight:600}
@media (max-width:1080px){.hdr-nav{display:none}.hdr-menu{display:block}.hdr-bar{grid-template-columns:1fr auto}}
@media (max-width:480px){.hdr-fin .btn .largo{display:none}.marca span{font-size:.9rem;letter-spacing:.2em}.marca svg{width:30px;height:30px}.hdr .marca{padding:0 .8rem 0 .55rem}}
@media (min-width:481px){.hdr-fin .btn .corto{display:none}}

/* ── Portada ── */
.hero{min-height:100svh;display:flex;align-items:center;padding-block:calc(84px + var(--s6)) var(--s8)}
.hero-g{width:100%;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s5);row-gap:var(--s6);align-items:start}
.hero h1{grid-column:1 / span 7;font-size:clamp(2.3rem,.9rem + 3.7vw,4.3rem)}
/* Velo suave detrás del texto: la escena 3D nunca compite con el título */
.hero{position:relative;isolation:isolate}
.hero::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,var(--bg) 0%,color-mix(in srgb,var(--bg) 82%,transparent) 30%,color-mix(in srgb,var(--bg) 0%,transparent) 58%)}
.hero h1 .ln{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.hero h1 .ln>span{display:inline-block}
.hero h1 em{font-style:normal;color:var(--signal)}
.hero-g>:is(.hero-lede,.hero-cta,.hero-pie){grid-column:1 / span 6}
.hero-cta{display:flex;flex-wrap:wrap;gap:.75rem}
.hero-pie{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;font-size:var(--step--1);color:var(--ink-2)}
.hero-pie span{display:inline-flex;align-items:center;gap:.45rem}.hero-pie .ic{color:var(--signal)}
/* Respaldo sin WebGL: los servicios como nodos */
.nodos{grid-column:9 / span 4;grid-row:1 / span 3;list-style:none;padding:1rem 0 0;display:grid;align-content:start;gap:1.25rem}
.nodos li{display:inline-flex;align-items:center;gap:.75rem;width:max-content;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:.6rem .9rem .6rem .6rem;font-weight:600;font-size:.95rem}
.nodos li:nth-child(even){justify-self:end}
.nodo{display:grid;place-items:center;width:36px;height:36px;border-radius:var(--r);background:var(--signal-soft);color:var(--signal);flex:none}
.nodo .ic{width:20px;height:20px}
.has-3d .nodos{display:none}
@media (max-width:860px){
  .hero{align-items:flex-start;padding-top:calc(76px + var(--s5))}
  .hero-g>*{grid-column:1 / -1!important}
  .nodos{grid-row:auto;grid-template-columns:1fr 1fr;gap:.5rem}.nodos li{width:auto}
  .has-3d .hero .hero-cta{margin-top:34svh}
  .hero-cta .btn{flex:1 1 100%}
}
@media (prefers-reduced-motion:no-preference){
  .js .hero h1 .ln>span{transform:translateY(105%)}
  .js :is(.hero-lede,.hero-cta,.hero-pie){opacity:0;transform:translateY(12px)}
  .js .hero.listo h1 .ln>span{transform:none;transition:transform 900ms var(--ease-out);transition-delay:calc(120ms + var(--i) * 80ms)}
  .js .hero.listo :is(.hero-lede,.hero-cta,.hero-pie){opacity:1;transform:none;transition:opacity 700ms var(--ease-out) 480ms,transform 700ms var(--ease-out) 480ms}
}

/* ── Capítulos: un servicio por escena ── */
.cap{min-height:130vh;display:flex;align-items:center}
/* En escritorio, el mismo velo del inicio: el texto siempre se lee sobre la escena */
@media (min-width:861px){.cap{position:relative;isolation:isolate}.cap::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,var(--bg) 0%,color-mix(in srgb,var(--bg) 78%,transparent) 32%,transparent 55%)}}
.cap .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s5)}
.cap-c{grid-column:1 / span 5;display:grid;gap:1.25rem;align-content:start}
.cap h2{font-size:var(--step-3)}
.cap p{max-width:46ch;color:var(--ink-2)}
.cap ul{list-style:none;padding:0;display:grid;max-width:46ch;border-top:1px solid var(--line)}
.cap li{display:flex;gap:.75rem;align-items:baseline;padding:.7rem 0;border-bottom:1px solid var(--line)}
.cap li::before{content:'';width:8px;height:8px;flex:none;border:1.5px solid var(--signal);border-radius:1px;transform:translateY(-1px)}
.cap li b{margin-left:auto;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
.cap li b small{font-weight:500;color:var(--ink-2);font-size:.8rem;margin-right:.3rem}
.cap-i{display:flex;align-items:center;gap:.75rem;color:var(--ink-2);font-size:var(--step--1);font-variant-numeric:tabular-nums}
.cap-i i{display:block;width:48px;height:1.5px;background:var(--line);position:relative;overflow:hidden}
.cap-i i::after{content:'';position:absolute;inset:0;background:var(--signal);transform-origin:left;transform:scaleX(var(--p,0))}
.cap-pie{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.5rem}
.desde{display:inline-flex;align-items:baseline;gap:.4rem;padding:.4rem .9rem;border-radius:999px;background:var(--signal-soft);font-size:.9rem;color:var(--ink-2)}
.desde b{color:var(--ink);font-size:1.05rem;font-variant-numeric:tabular-nums}
@media (max-width:860px){.cap{min-height:120svh;align-items:flex-end;padding-bottom:var(--s8)}.cap-c{grid-column:1 / -1}}
.frase{min-height:110vh;display:flex;align-items:center}
.frase h2{font-size:clamp(2.4rem,1rem + 4.6vw,5.5rem);max-width:11ch;line-height:.95}
.frase h2 span{color:var(--signal)}
.frase p{margin-top:var(--s6)}.frase .btn{margin-top:var(--s6)}
@media (max-width:860px){.frase{align-items:flex-end;padding-bottom:var(--s8)}}

/* Aparición por escena */
@media (prefers-reduced-motion:no-preference){
  .js [data-revela]>*{opacity:0;transform:translateY(18px)}
  .js [data-revela].dentro>*{opacity:1;transform:none;transition:opacity 700ms var(--ease-out),transform 700ms var(--ease-out);transition-delay:calc(var(--i,0) * 70ms)}
}

/* ── Láminas ── */
.lam-sec{padding-block:var(--s8)}
.lam{background:color-mix(in srgb,var(--surface) 95%,transparent);border:1px solid var(--line);border-radius:var(--r-card);padding:clamp(1.25rem,.8rem + 3vw,4rem)}
.lam-h{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s5);row-gap:1.25rem;margin-bottom:var(--s7)}
.lam-h h2{grid-column:1 / span 7}
.lam-h>p{grid-column:9 / span 4;align-self:end}
@media (max-width:1023px){.lam-h h2,.lam-h>p{grid-column:1 / -1}}
.lam h3.sub{font-size:var(--step-1);font-stretch:112%;font-weight:700;line-height:1.2;margin-bottom:1rem}

/* Precios */
.pt{width:100%;border-collapse:collapse}
.pt th,.pt td{text-align:left;vertical-align:baseline;padding:1.2rem 0;border-bottom:1px solid var(--line)}
.pt thead th{font-size:var(--step--1);font-weight:500;color:var(--ink-2);padding-block:.8rem;border-bottom:1.5px solid var(--ink)}
.pt .grupo th{padding:2rem 0 .7rem;font-size:.85rem;font-weight:700;letter-spacing:.02em;color:var(--signal);border-bottom:1.5px solid var(--ink)}
.pt tbody:first-of-type .grupo th{padding-top:1.2rem}
.pt tbody th[scope=row]{font-stretch:112%;font-weight:700;font-size:var(--step-1);line-height:1.15;padding-right:var(--s5);width:32%}
.pt tbody th[scope=row] a{text-decoration:none}
@media (hover:hover) and (pointer:fine){.pt tbody th[scope=row] a:hover{color:var(--signal)}}
.pt td.d{color:var(--ink-2);padding-right:var(--s6)}
.pt td.m{text-align:right;white-space:nowrap}
.pt .m strong{font-stretch:112%;font-weight:700;font-size:var(--step-2);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.pt .m small{font-size:.8rem;color:var(--ink-2);margin-right:.35rem}
.pt .m span{display:block;font-size:var(--step--1);color:var(--ink-2)}
.pt .m a{font-weight:600;color:var(--signal)}
.pt-nota{margin-top:var(--s5);font-size:var(--step--1);color:var(--ink-2)}
@media (max-width:720px){
  .pt thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .pt tr{display:grid;grid-template-columns:1fr auto;column-gap:1rem;padding:1.1rem 0;border-bottom:1px solid var(--line)}
  .pt .grupo{padding:1.6rem 0 .5rem;border-bottom:1.5px solid var(--ink)}
  .pt th,.pt td{border:0!important;padding:0!important}
  .pt tbody th[scope=row]{width:auto;grid-column:1;grid-row:1}
  .pt td.m{grid-column:2;grid-row:1 / span 2}
  .pt td.d{grid-column:1;grid-row:2;padding-top:.35rem!important;font-size:.92rem}
  .pt .m strong{font-size:1.35rem}
}

/* GAMSAC-BOT: demostración + paquetes */
.bot-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(1.5rem,4vw,4rem);align-items:center}
.bot-t{display:grid;gap:1.25rem}
.bot-f{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.85rem 1.25rem}
.bot-f li{display:flex;align-items:center;gap:.7rem;font-size:.95rem;line-height:1.35}
.demo{display:flex;flex-direction:column;height:min(540px,76vh);border-radius:var(--r-card);border:1px solid var(--line);background:var(--bg);box-shadow:0 30px 60px -36px rgba(13,22,32,.45);overflow:hidden}
.demo-h{display:flex;align-items:center;gap:.7rem;padding:.9rem 1rem;border-bottom:1px solid var(--line);background:var(--surface)}
.demo-h b{display:block;font-size:.98rem}.demo-h small{display:flex;align-items:center;gap:.4rem;font-size:.78rem;color:var(--ink-2)}
.vivo{width:7px;height:7px;border-radius:50%;background:#2EB872;box-shadow:0 0 0 3px color-mix(in srgb,#2EB872 25%,transparent)}
.demo-b{flex:1;display:flex;flex-direction:column;gap:.55rem;padding:1rem;overflow-y:auto;scrollbar-width:thin}
.msg{max-width:86%;padding:.6rem .9rem;border-radius:16px;font-size:.92rem;line-height:1.5;animation:msg 260ms var(--ease-out)}
.msg.bot{align-self:flex-start;background:var(--surface);border:1px solid var(--line);border-bottom-left-radius:4px}
.msg.yo{align-self:flex-end;background:var(--signal);color:var(--on-signal);border-bottom-right-radius:4px}
.msg a{color:var(--signal);font-weight:600}
.msg.tp{display:flex;gap:4px;padding:.85rem 1rem}.msg.tp i{width:6px;height:6px;border-radius:50%;background:var(--ink-2);animation:tp 1s infinite}.msg.tp i:nth-child(2){animation-delay:.15s}.msg.tp i:nth-child(3){animation-delay:.3s}
@keyframes tp{0%,60%,100%{opacity:.3}30%{opacity:1}}
@keyframes msg{from{opacity:0;transform:translateY(6px)}}
.demo-q{display:flex;gap:.4rem;padding:.6rem 1rem;overflow-x:auto;scrollbar-width:none;border-top:1px solid var(--line)}
.demo-q::-webkit-scrollbar{display:none}
.demo-q button{flex:none;min-height:36px;padding:.35rem .85rem;border:1px solid var(--line);border-radius:999px;background:var(--surface);font-size:.82rem;cursor:pointer;transition:border-color 160ms ease,transform 140ms var(--ease-out)}
.demo-q button:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){.demo-q button:hover{border-color:var(--signal)}}
.demo-f{display:flex;gap:.5rem;padding:.6rem 1rem 1rem}
.demo-f input{flex:1;min-width:0;min-height:48px;padding:.75rem 1rem;border:1px solid var(--line);border-radius:999px;background:var(--surface);font-size:16px}
.demo-f input:focus{outline:0;border-color:var(--signal);box-shadow:0 0 0 4px color-mix(in srgb,var(--signal) 20%,transparent)}
.demo-f .btn{width:48px;padding:0}
@media (max-width:960px){.bot-g{grid-template-columns:1fr}.demo{height:500px}}
@media (max-width:520px){.bot-f{grid-template-columns:1fr}}

/* Selector de paquetes */
.planes{margin-top:var(--s8);display:grid;gap:1.5rem}
.planes-h{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:1rem}
.planes-h p{color:var(--ink-2);max-width:48ch}
.pl{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;background:var(--bg)}
.pl-tabs{position:relative;display:grid;align-content:start;border-right:1px solid var(--line);background:var(--surface)}
.pl-tab{position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;gap:.2rem 1rem;padding:1.15rem 1.4rem;border:0;border-bottom:1px solid var(--line);background:none;text-align:left;cursor:pointer;transition:background-color 200ms ease}
.pl-nota{padding:1.25rem 1.4rem;font-size:.82rem;color:var(--ink-2);line-height:1.5}
.pl-tab::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--signal);transform:scaleY(0);transition:transform 260ms var(--ease-out)}
.pl-tab b{font-stretch:112%;font-weight:700;font-size:1.1rem}
.pl-tab small{grid-column:1;font-size:.8rem;color:var(--ink-2)}
.pl-tab .pl-tp{grid-column:2;grid-row:1 / span 2;text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.pl-tab .pl-tp small{display:block;font-weight:500}
.pl-tab .flag{display:inline-block;margin-left:.5rem;padding:.1rem .5rem;border-radius:999px;background:var(--signal);color:var(--on-signal);font-size:.68rem;font-weight:700;font-stretch:100%;vertical-align:.15em}
.pl-tab[aria-selected=true]{background:var(--bg)}
.pl-tab[aria-selected=true]::before{transform:none}
.pl-tab[aria-selected=true] b{color:var(--signal)}
@media (hover:hover) and (pointer:fine){.pl-tab:hover{background:color-mix(in srgb,var(--bg) 70%,var(--surface))}}
.pl-d{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.5rem 2.5rem;padding:clamp(1.25rem,1rem + 2vw,2.5rem);align-content:start}
.pl-d>*{transition:opacity 220ms ease,transform 300ms var(--ease-out),filter 220ms ease}
.pl-d.cambia>*{opacity:0;transform:translateY(6px);filter:blur(2px)}
.pl-top{grid-column:1 / -1;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1rem;padding-bottom:1.25rem;border-bottom:1px solid var(--line)}
.pl-top h4{font-size:var(--step-2);font-stretch:125%;font-weight:800;line-height:1}
.pl-top p{color:var(--ink-2);margin-top:.5rem;max-width:42ch;font-size:.95rem}
.pl-precio{text-align:right}
.pl-precio b{display:block;font-stretch:112%;font-weight:800;font-size:clamp(2.4rem,1.6rem + 2.4vw,3.6rem);line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.pl-precio b small{font-size:1rem;font-weight:500;color:var(--ink-2);letter-spacing:0}
.pl-precio>span{font-size:.88rem;color:var(--ink-2)}
.pl-m{display:grid;gap:1rem;align-content:start}
.med{display:grid;gap:.4rem}
.med div{display:flex;justify-content:space-between;gap:1rem;font-size:.9rem}
.med div span{color:var(--ink-2)}.med div b{font-variant-numeric:tabular-nums}
.med i{display:block;height:6px;border-radius:999px;background:var(--signal-soft);overflow:hidden}
.med i::after{content:'';display:block;height:100%;border-radius:inherit;background:var(--signal);transform-origin:left;transform:scaleX(var(--v,0));transition:transform 700ms var(--ease-out)}
.pl-redes{display:flex;flex-wrap:wrap;gap:.35rem}
.pl-redes span{padding:.2rem .6rem;border-radius:999px;border:1px solid var(--line);font-size:.78rem;color:var(--ink-2);transition:all 200ms ease}
.pl-redes span.si{border-color:var(--signal);background:var(--signal-soft);color:var(--ink)}
.pl-inc{list-style:none;padding:0;display:grid;gap:.6rem;align-content:start;font-size:.93rem}
.pl-inc li{display:grid;grid-template-columns:20px 1fr;gap:.6rem}
.pl-inc .ic{width:20px;height:20px;color:var(--signal)}
.pl-cta{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;padding-top:1.25rem;border-top:1px solid var(--line)}
.pl-cta small{color:var(--ink-2);font-size:.85rem;max-width:44ch}
.comp{border-top:1px solid var(--line)}
.comp summary{display:flex;align-items:center;gap:.5rem;padding:1rem 0;font-weight:600;color:var(--signal);cursor:pointer;list-style:none;width:max-content}
.comp summary::-webkit-details-marker{display:none}
.comp summary .ic{transition:transform 200ms var(--ease-out)}.comp[open] summary .ic{transform:rotate(180deg)}
.comp-w{overflow-x:auto;scrollbar-width:thin}
.comp table{width:100%;min-width:720px;border-collapse:collapse;font-size:.9rem}
.comp th,.comp td{padding:.75rem .9rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.comp thead th{font-stretch:112%;border-bottom:1.5px solid var(--ink)}
.comp tbody th{font-weight:500;color:var(--ink-2);white-space:nowrap}
.comp .on{background:var(--signal-soft)}
@media (max-width:900px){
  .pl{grid-template-columns:1fr}
  .pl-tabs{display:flex;overflow-x:auto;scrollbar-width:none;border-right:0;border-bottom:1px solid var(--line);scroll-snap-type:x mandatory}
  .pl-tabs::-webkit-scrollbar{display:none}
  .pl-tab{flex:none;min-width:150px;border-bottom:0;border-right:1px solid var(--line);scroll-snap-align:start;padding:1rem 1.1rem}
  .pl-tab::before{left:0;right:0;top:auto;bottom:0;width:auto;height:3px;transform:scaleX(0)}
  .pl-tab[aria-selected=true]::before{transform:none}
  .pl-nota{display:none}
  .pl-tab .pl-tp{grid-column:1;grid-row:auto;text-align:left}.pl-tab .pl-tp small{display:none}.pl-tab>small{display:none}
  .pl-d{grid-template-columns:1fr}
  .pl-precio{text-align:left}
  .pl-cta .btn{width:100%}
}

/* Proyectos */
.pj{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(1.5rem,4vw,4rem);align-items:start}
.pj-l{list-style:none;padding:0;border-top:1.5px solid var(--ink)}
.pj-l li{border-bottom:1px solid var(--line)}
.pj-i{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.15rem 1rem;padding:1.1rem .9rem;margin-inline:-.9rem;text-decoration:none;border-radius:var(--r-in);transition:background-color 160ms ease}
.pj-m{display:none}
.pj-n b{display:block;font-size:clamp(1.15rem,1.05rem + .5vw,1.5rem);font-stretch:112%;font-weight:700;transition:color 160ms ease}
.pj-n span{display:block;font-size:.92rem;color:var(--ink-2)}
.pj-tipo{grid-column:1;font-size:.82rem;color:var(--ink-2)}
.pj-go{grid-column:2;grid-row:1 / span 2;align-self:center;display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;color:var(--ink-2);transition:transform 200ms var(--ease-out),color 160ms,border-color 160ms}
.pj-i.on{background:var(--bg)}.pj-i.on .pj-n b{color:var(--signal)}
@media (hover:hover) and (pointer:fine){.pj-i:hover .pj-go{color:var(--signal);border-color:var(--signal);transform:translate(2px,-2px)}}
.pj-v{position:sticky;top:6rem}
.nav-f{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:var(--r-in);background:var(--bg);box-shadow:0 30px 60px -40px rgba(13,22,32,.55)}
.nav-f-bar{display:flex;align-items:center;gap:5px;height:30px;padding:0 .8rem;border-bottom:1px solid var(--line);font-size:.75rem;color:var(--ink-2)}
.nav-f-bar i{width:8px;height:8px;border-radius:50%;border:1px solid var(--line)}
.nav-f-bar span{margin-left:.6rem;padding:.1rem .7rem;border-radius:999px;background:var(--surface)}
.pj-img{position:relative;aspect-ratio:16/10}
.pj-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;opacity:0;filter:blur(2px);transform:scale(1.015);transition:opacity 380ms ease,filter 380ms ease,transform 600ms var(--ease-out)}
.pj-img img.vis{opacity:1;filter:none;transform:none}
@media (max-width:900px){.pj{grid-template-columns:1fr}.pj-v{display:none}.pj-i{grid-template-columns:96px minmax(0,1fr) auto;align-items:center}.pj-m{display:block;grid-row:1 / span 2;width:96px;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top;border:1px solid var(--line);border-radius:6px}.pj-tipo{grid-column:2}.pj-go{grid-column:3}}

/* Proceso */
.pasos{list-style:none;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1.25rem;position:relative}
.pasos::before,.pasos::after{content:'';position:absolute;left:0;right:0;top:18px;height:1.5px;background:var(--line)}
.pasos::after{background:var(--signal);transform-origin:left;transform:scaleX(var(--p,1))}
.paso{position:relative;display:grid;gap:.6rem;align-content:start}
.paso-m{position:relative;z-index:1;display:grid;place-items:center;width:36px;height:36px;background:var(--surface);border:1.5px solid var(--signal);border-radius:var(--r);color:var(--signal);font-size:.9rem;font-weight:700;margin-bottom:.4rem}
.paso h3{font-size:clamp(1.05rem,.95rem + .3vw,1.2rem);font-stretch:100%;hyphens:auto;font-weight:700;line-height:1.15}
.paso p{color:var(--ink-2);font-size:.92rem}
.paso .rec{display:flex;gap:.45rem;color:var(--ink);font-weight:500}.paso .rec .ic{color:var(--signal);margin-top:.25rem}
@media (max-width:1100px){
  .pasos{grid-template-columns:1fr;gap:var(--s6)}
  .pasos::before,.pasos::after{left:17px;right:auto;top:18px;bottom:18px;width:1.5px;height:auto;transform-origin:top;transform:scaleY(var(--p,1))}
  .paso{grid-template-columns:36px 1fr;column-gap:1.25rem}
  .paso h3,.paso p{grid-column:2}.paso-m{grid-row:1 / span 3;margin:0}
}
.cond{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.75rem 2.5rem;margin-top:var(--s7);padding-top:var(--s6);border-top:1.5px solid var(--ink)}
.cond dt{display:flex;align-items:center;gap:.7rem;font-weight:700;font-stretch:112%;font-size:1.05rem}
.cond dd{margin:.6rem 0 0;color:var(--ink-2);font-size:.95rem}
@media (max-width:900px){.cond{grid-template-columns:1fr 1fr}}@media (max-width:600px){.cond{grid-template-columns:1fr}}

/* Preguntas: carrusel */
.fq-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}
.fq-cats{display:flex;gap:.4rem;overflow-x:auto;scrollbar-width:none;padding:2px}
.fq-cats::-webkit-scrollbar{display:none}
.fq-cats button{flex:none;min-height:40px;padding:.45rem 1rem;border:1px solid var(--line);border-radius:999px;background:var(--bg);font-size:.88rem;font-weight:500;cursor:pointer;transition:background-color 160ms ease,color 160ms ease,border-color 160ms ease,transform 140ms var(--ease-out)}
.fq-cats button:active{transform:scale(.97)}
.fq-cats button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.fq-cats button small{opacity:.6;margin-left:.3rem;font-variant-numeric:tabular-nums}
@media (hover:hover) and (pointer:fine){.fq-cats button:hover{border-color:var(--ink)}}
.fq-s{display:flex;align-items:center;gap:.5rem;min-width:min(100%,300px);padding:0 1rem;border:1px solid var(--line);border-radius:999px;background:var(--bg);color:var(--ink-2)}
.fq-s:focus-within{border-color:var(--signal);box-shadow:0 0 0 4px color-mix(in srgb,var(--signal) 20%,transparent)}
.fq-s input{flex:1;min-width:0;min-height:44px;border:0;background:none;font-size:16px;outline:0;color:var(--ink)}
.fq-vp{--lp:clamp(1.25rem,.8rem + 3vw,4rem);position:relative;margin-inline:calc(-1 * var(--lp));overflow:hidden}
.fq-track{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--lp);padding:.25rem var(--lp) 1rem;scrollbar-width:none;cursor:grab;overscroll-behavior-x:contain}
.fq-track::-webkit-scrollbar{display:none}
.fq-track.arrastra{cursor:grabbing;scroll-snap-type:none;user-select:none}
.fq-c{flex:none;width:min(340px,80vw);scroll-snap-align:start;display:flex;flex-direction:column;gap:.9rem;min-height:250px;padding:1.5rem;border:1px solid var(--line);border-radius:var(--r-card);background:var(--bg);transition:border-color 200ms ease,transform 300ms var(--ease-out),opacity 300ms ease}
.fq-c[hidden]{display:none}
.fq-c header{display:flex;justify-content:space-between;align-items:center;gap:1rem;font-size:.78rem;color:var(--ink-2)}
.fq-c header span:first-child{padding:.15rem .6rem;border-radius:999px;background:var(--signal-soft);color:var(--signal);font-weight:600}
.fq-c h3{font-size:1.2rem;font-stretch:112%;font-weight:700;line-height:1.2;letter-spacing:-.01em}
.fq-c p{color:var(--ink-2);font-size:.95rem;line-height:1.55}
@media (hover:hover) and (pointer:fine){.fq-c:hover{border-color:var(--signal)}}
.fq-pie{display:flex;align-items:center;gap:1rem;margin-top:.5rem}
.fq-prog{flex:1;height:2px;background:var(--line);border-radius:2px;overflow:hidden}
.fq-prog i{display:block;height:100%;background:var(--signal);transform-origin:left;transform:scaleX(var(--p,0));transition:transform 200ms linear}
.fq-cont{font-size:.85rem;color:var(--ink-2);font-variant-numeric:tabular-nums;min-width:4.5em;text-align:right}
.fq-btn{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:var(--bg);cursor:pointer;transition:border-color 160ms ease,transform 140ms var(--ease-out),opacity 160ms ease}
.fq-btn:active{transform:scale(.95)}
.fq-btn:disabled{opacity:.35;cursor:default}
@media (hover:hover) and (pointer:fine){.fq-btn:not(:disabled):hover{border-color:var(--ink)}}
.fq-0{padding:2rem 0;color:var(--ink-2)}.fq-0 a{color:var(--signal);font-weight:600}

/* ── Llegada y contacto ── */
.llegada{min-height:100vh;display:flex;align-items:flex-end;padding-bottom:var(--s8)}
.llegada .wrap{text-align:center;display:grid;justify-items:center;gap:1.25rem}
.llegada h2{font-size:clamp(2.4rem,1rem + 4.6vw,5.5rem);max-width:14ch;line-height:.95}
.llegada .lede{margin-inline:auto;text-align:center}
.contacto{padding-bottom:var(--s9)}
.ct-card{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);box-shadow:0 1px 2px color-mix(in srgb,var(--ink) 6%,transparent),0 24px 48px -32px color-mix(in srgb,var(--ink) 30%,transparent);overflow:hidden}
.ct-a{display:flex;flex-direction:column;gap:1.75rem;padding:clamp(1.5rem,1rem + 2.5vw,3rem);background:var(--signal-soft);border-right:1px solid var(--line)}
.ct-a h3{font-size:var(--step-1);font-stretch:112%;font-weight:700;line-height:1.2}
.ct-l{display:grid;gap:1rem}
.ct-l div{display:grid;grid-template-columns:22px 1fr;gap:.2rem .75rem}
.ct-l .ic{width:22px;height:22px;color:var(--signal);grid-row:1 / span 2}
.ct-l dt{font-size:.82rem;color:var(--ink-2)}.ct-l dd{margin:0;font-weight:600;overflow-wrap:anywhere}.ct-l a{text-decoration:none}
@media (hover:hover) and (pointer:fine){.ct-l a:hover{color:var(--signal);text-decoration:underline}}
.ct-alt{display:grid;gap:.75rem;margin-top:auto;padding-top:1.5rem;border-top:1px solid color-mix(in srgb,var(--signal) 25%,var(--line))}
.ct-alt p{color:var(--ink-2);font-size:.95rem}
.ct-m{padding:clamp(1.5rem,1rem + 2.5vw,3rem)}
.form{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem 1rem}
.form[hidden]{display:none}
.campo{display:grid;gap:.5rem;border:0;padding:0;margin:0;min-width:0;align-content:start}
.campo.full{grid-column:1 / -1}
.campo>label,.campo>legend{font-size:.92rem;font-weight:600;padding:0}
.campo legend{margin-bottom:.6rem}
.opc{font-weight:400;color:var(--ink-2);margin-left:.35rem}
.campo input,.campo textarea{width:100%;min-height:50px;padding:.8rem 1rem;font-size:16px;background:var(--bg);border:1px solid color-mix(in srgb,var(--ink) 18%,var(--line));border-radius:var(--r-in);transition:border-color 150ms ease,box-shadow 150ms ease,background-color 150ms ease;appearance:none}
.campo textarea{min-height:128px;resize:vertical;line-height:1.5}
.campo ::placeholder{color:var(--ink-2);opacity:.85}
.campo input:focus-visible,.campo textarea:focus-visible{outline:none;border-color:var(--signal);background:var(--surface);box-shadow:0 0 0 4px color-mix(in srgb,var(--signal) 20%,transparent)}
.campo [aria-invalid=true]{border-color:var(--danger)}
.err{font-size:.85rem;color:var(--danger)}.err:empty{display:none}
.pills{display:flex;flex-wrap:wrap;gap:.5rem}
.pill{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:.55rem 1rem;border:1px solid color-mix(in srgb,var(--ink) 18%,var(--line));border-radius:999px;background:var(--bg);font-size:.9rem;font-weight:500;cursor:pointer;user-select:none;transition:border-color 150ms ease,background-color 150ms ease,color 150ms ease,transform 160ms var(--ease-out)}
.pill:active{transform:scale(.97)}
.pill input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
@media (hover:hover) and (pointer:fine){.pill:hover{border-color:var(--signal)}}
.pill:has(input:checked){background:var(--ink);border-color:var(--ink);color:var(--bg)}
.pill:has(input:focus-visible){outline:2px solid var(--signal);outline-offset:2px}
.form-err{grid-column:1 / -1;padding:.85rem 1rem;border:1px solid var(--danger);border-radius:var(--r-in);color:var(--danger);font-size:.92rem}
.form-err[hidden]{display:none}
.form-pie{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem}
.form-pie small{font-size:.85rem;color:var(--ink-2);max-width:32ch}
.form-ok{display:grid;justify-items:start;gap:1rem;padding-block:var(--s6);animation:msg 320ms var(--ease-out)}
.form-ok[hidden]{display:none}.form-ok:focus{outline:none}
.form-ok .ic{width:48px;height:48px;color:var(--signal)}
.form-ok h3{font-size:var(--step-2);font-stretch:112%}
.form-ok p{color:var(--ink-2);max-width:46ch}
@media (max-width:900px){.ct-card{grid-template-columns:1fr}.ct-a{border-right:0;border-bottom:1px solid var(--line)}}
@media (max-width:560px){.form{grid-template-columns:1fr}.form-pie{flex-direction:column-reverse;align-items:stretch}.form-pie small{max-width:none;text-align:center}}

/* ── Pie ── */
.pie{position:relative;z-index:1;background:var(--surface);border-top:1px solid var(--line);padding-top:var(--s8);padding-bottom:env(safe-area-inset-bottom)}
.pie-g{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:var(--s7) var(--s6);padding-bottom:var(--s8)}
.pie-m{display:grid;gap:1.25rem;align-content:start;justify-items:start}
.pie-m p{color:var(--ink-2);max-width:34ch}
.pie-c h2{font-size:.95rem;font-stretch:100%;font-weight:700;letter-spacing:0;line-height:1.3;margin-bottom:1rem}
.pie-c ul{list-style:none;padding:0;display:grid;gap:.55rem}
.pie-c a,.pie-c li{color:var(--ink-2);text-decoration:none;font-size:.95rem}
@media (hover:hover){.pie-c a:hover{color:var(--ink);text-decoration:underline}}
.pie-b{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;padding-block:1.5rem 2rem;border-top:1px solid var(--line);font-size:.88rem;color:var(--ink-2)}
/* Cierre del pie: línea de la marca arriba y el nombre en grande al final */
.pie::before{content:'';position:absolute;left:0;right:0;top:-1px;height:2px;background:linear-gradient(90deg,transparent,var(--signal) 20%,var(--signal) 50%,transparent 85%);opacity:.55}
.pie-gigante{container-type:inline-size;overflow:hidden;margin-top:-.5rem;padding-bottom:clamp(.5rem,2vw,1.5rem);user-select:none;pointer-events:none}
.pie-gigante span{display:block;font-weight:800;font-stretch:125%;font-size:17cqi;line-height:.78;letter-spacing:-.03em;text-align:center;
  background:linear-gradient(180deg,color-mix(in srgb,var(--ink) 14%,transparent),color-mix(in srgb,var(--ink) 2%,transparent) 85%);-webkit-background-clip:text;background-clip:text;color:transparent}
@media (prefers-reduced-motion:no-preference){.js .pie-gigante span{transform:translateY(35%);transition:transform 1100ms var(--ease-out)}.js .pie-gigante.visto span{transform:none}}
@media (max-width:1000px){.pie-g{grid-template-columns:1fr 1fr}.pie-m{grid-column:1 / -1}}
@media (max-width:560px){.pie-g{grid-template-columns:1fr}}

/* ── WhatsApp flotante ── */
.wa{position:fixed;right:calc(var(--gut) * .75 + env(safe-area-inset-right));bottom:calc(1rem + env(safe-area-inset-bottom));z-index:40;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--wa);color:#fff;box-shadow:0 2px 4px rgba(0,0,0,.12),0 12px 28px -10px rgba(0,0,0,.45);transition:opacity 200ms ease,transform 240ms var(--ease-out)}
.wa .ic{width:26px;height:26px}
.wa:active{transform:scale(.95)}
.wa.oculto{opacity:0;transform:scale(.96) translateY(8px);pointer-events:none}

/* ── Página de servicio ── */
.sv-hero{min-height:100svh;display:flex;align-items:center;padding-block:calc(84px + var(--s6)) var(--s8)}
.sv-hero .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s5)}
.sv-c{grid-column:1 / span 6;display:grid;gap:1.4rem;justify-items:start}
.migas{display:flex;flex-wrap:wrap;gap:.5rem;font-size:.875rem;color:var(--ink-2)}
.migas a{color:inherit}.migas [aria-current]{color:var(--ink);font-weight:600}
@media (hover:hover) and (pointer:fine){.migas a:hover{color:var(--signal)}}
.sv-c h1{font-size:clamp(2.3rem,1rem + 4vw,4.4rem)}
.sv-meta{display:flex;flex-wrap:wrap;gap:.6rem}
.sv-meta div{padding:.6rem 1rem;border:1px solid var(--line);border-radius:var(--r-in);background:color-mix(in srgb,var(--surface) 80%,transparent)}
.sv-meta small{display:block;font-size:.75rem;color:var(--ink-2)}
.sv-meta b{font-variant-numeric:tabular-nums}
.sv-meta span{font-size:.8rem;color:var(--ink-2);margin-left:.3rem}
@media (max-width:860px){.sv-hero{align-items:flex-end;min-height:120svh}.sv-c{grid-column:1 / -1}}
.sv-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.5rem,5vw,5rem);align-items:start}
.sv-que{display:grid;gap:1rem;justify-items:start}
.sv-big{font-size:var(--step-1);line-height:1.5;margin-bottom:1rem}
.sv-para{list-style:none;padding:0;display:grid;gap:.7rem}
.sv-para li{display:flex;gap:.6rem}.sv-para .ic{color:var(--signal);margin-top:.3rem}
.sv-nota{display:flex;gap:.6rem;padding:1rem;border:1px solid var(--line);border-left:3px solid var(--signal);border-radius:var(--r);color:var(--ink-2)}
.sv-inc ol{list-style:none;padding:0;border-top:1.5px solid var(--ink)}
.sv-inc li{display:grid;grid-template-columns:2.5rem 1fr;gap:.5rem;padding:.9rem 0;border-bottom:1px solid var(--line);font-weight:500}
.sv-inc li span{color:var(--signal);font-weight:700}
.sv-pj{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:1.5rem}
.sv-pj a{display:grid;gap:.9rem;text-decoration:none}
.sv-pj .nav-f{display:block}.sv-pj-n>span{display:block}.sv-pj-n .ic{color:var(--ink-2);flex:none}
.sv-pj img,.sv-pj .vid{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;transition:transform 500ms var(--ease-out)}
.sv-pj-n{display:flex;justify-content:space-between;gap:1rem}
.sv-pj-n b{font-size:1.15rem;font-stretch:112%;display:block}.sv-pj-n span{font-size:.9rem;color:var(--ink-2)}
@media (hover:hover) and (pointer:fine){.sv-pj a:hover :is(img,.vid){transform:scale(1.02)}}
.sv-ot{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));column-gap:1.5rem;border-top:1.5px solid var(--ink)}
.sv-ot a{display:flex;align-items:center;gap:.8rem;padding:1rem 0;border-bottom:1px solid var(--line);text-decoration:none}
.sv-ot b{flex:1;font-weight:600}
.sv-ot a>.ic{color:var(--ink-2);transition:transform 200ms var(--ease-out),color 160ms}
@media (hover:hover) and (pointer:fine){.sv-ot a:hover b{color:var(--signal)}.sv-ot a:hover>.ic{color:var(--signal);transform:translateX(3px)}}
@media (max-width:900px){.sv-g{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;scroll-behavior:auto!important}
  .btn:active,.wa:active{transform:none}
}
@media (max-width:860px){.hdr .marca{background:color-mix(in srgb,var(--bg) 64%,transparent);border-color:color-mix(in srgb,var(--line) 65%,transparent)}
  @supports (backdrop-filter:blur(1px)){.hdr .marca{backdrop-filter:blur(20px) saturate(1.6);-webkit-backdrop-filter:blur(20px) saturate(1.6)}}}

/* Precio a cotizar */
.pt .m strong.cot{font-size:var(--step-1);color:var(--signal)}

/* Proyectos: carrusel con la diapositiva activa al centro */
.pc-vp{--lp:clamp(1.25rem,.8rem + 3vw,4rem);margin-inline:calc(-1 * var(--lp));overflow:hidden;container-type:inline-size}
.pc-track{--w:min(780px,76cqw);position:relative;display:flex;gap:clamp(.75rem,2cqw,2rem);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:.5rem calc((100cqw - var(--w)) / 2) 1.25rem;cursor:grab;overscroll-behavior-x:contain;outline-offset:-4px}
.pc-track::-webkit-scrollbar{display:none}
.pc-track.arrastra{cursor:grabbing;scroll-snap-type:none;user-select:none}
.pc-s{flex:none;width:var(--w);scroll-snap-align:center;display:grid;gap:1.1rem;transform:scale(.9);opacity:.4;filter:saturate(.6);transition:transform 600ms var(--ease-out),opacity 450ms ease,filter 450ms ease}
.pc-s.on{transform:none;opacity:1;filter:none}
.pc-f{display:block;text-decoration:none}
.pc-f img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top;transition:transform 900ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){.pc-s.on .pc-f:hover img{transform:scale(1.02)}}
.pc-s:not(.on) .pc-f{cursor:pointer}
.pc-i{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem 1.5rem;transition:opacity 300ms ease}
.pc-s:not(.on) .pc-i{opacity:0;pointer-events:none}
.pc-i b{display:block;font-size:clamp(1.3rem,1.1rem + .8vw,1.9rem);font-stretch:125%;font-weight:800;line-height:1.1;letter-spacing:-.01em}
.pc-i span{font-size:.92rem;color:var(--ink-2)}
.pc-i .btn{font-size:.92rem;padding:.65rem 1.15rem}
.pc-pie{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:.5rem}
.pc-dots{display:flex;gap:.4rem;overflow-x:auto;scrollbar-width:none;padding:2px}
.pc-dots::-webkit-scrollbar{display:none}
.pc-dots button{position:relative;flex:none;min-height:40px;padding:.45rem 1rem;border:1px solid var(--line);border-radius:999px;background:var(--bg);font-size:.86rem;font-weight:500;cursor:pointer;overflow:hidden;transition:background-color 200ms ease,color 200ms ease,border-color 200ms ease,transform 140ms var(--ease-out)}
.pc-dots button:active{transform:scale(.97)}
.pc-dots button[aria-selected=true]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.pc-dots button i{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--signal);transform:scaleX(0);transform-origin:left}
.pc.auto .pc-dots button[aria-selected=true] i{animation:pc-run 6s linear forwards}
.pc.pausa .pc-dots button i{animation-play-state:paused!important}
@keyframes pc-run{to{transform:scaleX(1)}}
@media (hover:hover) and (pointer:fine){.pc-dots button:hover{border-color:var(--ink)}}
@media (max-width:700px){.pc-track{--w:84cqw}.pc-dots{flex:1;min-width:0}.pc-pie{gap:.5rem}.pc-i .btn{width:100%}}

/* ── Videos en bucle ── */
.vid{display:block;width:100%;height:auto;object-fit:cover;object-position:top;background:var(--surface)}
.nav-f .vid{aspect-ratio:16/10}
/* Celular: marco de dispositivo con la versión móvil en video */
.tel{position:relative;display:block;padding:22px 5px 5px;border-radius:30px;background:#0D1620;box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 30px 50px -24px rgba(13,22,32,.55),0 0 0 1px color-mix(in srgb,var(--line) 60%,transparent)}
.tel::before{content:'';position:absolute;z-index:2;top:7px;left:50%;width:26%;height:9px;margin-left:-13%;border-radius:999px;background:#26333F}
.tel .vid{aspect-ratio:480/1038;border-radius:6px 6px 25px 25px}
/* El celular sube sobre la pantalla grande de la diapositiva activa */
.pc-esc{position:relative}
.pc-tel{position:absolute;right:-4%;bottom:4%;width:21%;opacity:0;transform:translateY(28px) rotate(2deg);transition:opacity 500ms var(--ease-out),transform 800ms var(--ease-out)}
.pc-s.on .pc-tel{opacity:1;transform:none;transition-delay:250ms}
@media (max-width:700px){.pc-tel{width:26%;right:-2%;bottom:-6%}}

/* Muestrario en movimiento */
.reel{padding-block:var(--s8) var(--s9);overflow:hidden;background:color-mix(in srgb,var(--bg) 93%,transparent);border-block:1px solid var(--line)}
@supports (backdrop-filter:blur(1px)){.reel{backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}}
.reel-h{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s5);row-gap:1.25rem;margin-bottom:var(--s7)}
.reel-h h2{grid-column:1 / span 7}.reel-h h2 span{color:var(--signal)}
.reel-h .lede{grid-column:9 / span 4;align-self:end}
@media (max-width:1023px){.reel-h h2,.reel-h .lede{grid-column:1 / -1}}
.reel-vp{padding-inline:var(--gut)}
.reel-l{list-style:none;padding:0 0 4rem;display:flex;gap:clamp(1rem,2.4vw,2.25rem);width:max-content;will-change:transform}
.reel-c{flex:none;width:clamp(200px,16.5vw,250px)}
.reel-c:nth-child(even){margin-top:4rem}
.reel-c a{display:grid;gap:1rem;text-decoration:none}
.reel-c .tel{transition:transform 500ms var(--ease-out),box-shadow 500ms var(--ease-out)}
.reel-n{display:grid;grid-template-columns:1fr auto;column-gap:.75rem;padding-inline:.25rem}
.reel-n b{font-stretch:112%;font-weight:700;font-size:1.05rem;line-height:1.2}
.reel-n small{grid-column:1;font-size:.85rem;color:var(--ink-2)}
.reel-n .ic{grid-column:2;grid-row:1 / span 2;align-self:center;color:var(--ink-2);transition:transform 200ms var(--ease-out),color 160ms ease}
@media (hover:hover) and (pointer:fine){
  .reel-c a:hover .tel{transform:translateY(-8px);box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 44px 60px -26px rgba(13,22,32,.6),0 0 0 1px var(--signal)}
  .reel-c a:hover .reel-n .ic{color:var(--signal);transform:translate(2px,-2px)}
}
@media (max-width:860px){
  .reel-vp{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;scroll-padding-inline:var(--gut)}
  .reel-vp::-webkit-scrollbar{display:none}
  .reel-l{padding-bottom:1rem}
  .reel-c{width:62vw;scroll-snap-align:start}
  .reel-c:nth-child(even){margin-top:0}
}

/* Campo trampa contra robots: invisible para las personas y los lectores de pantalla */
.trampa{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
