/* Zion · web comercial (3 nov 2026). Base neutra (mineral, grafito, noche) y el Espectro Zion: el portal del isotipo separa una
   sola luz en cuatro bandas, una por línea de servicio (--acento → --acento-2, con --acento-tinta para texto ≥ 4.9:1).
   El degradado maestro (--espectro) marca los momentos de marca; el color vive en orbes, filos y estados, nunca en párrafos. */
@font-face{font-family:"Archivo";src:url("fuentes/archivo-var-latin.woff2") format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}

:root{
  --mineral:#F7F7F4; --blanco:#FFFFFF; --niebla:#EEEEE9; --niebla-2:#E5E5DF; --platino:#C4C8CB; --platino-2:#DCDEDF;
  --grafito:#15181E; --grafito-2:#353A43; --gris:#5C616A; --noche:#0D0F14; --noche-2:#161A22; --claro-noche:#B9BEC6;
  --acento:#15181E; --acento-2:#353A43; --acento-tinta:#15181E; --error:#B3261E; --ok:#0B7A5E;
  --cobalto:#2D5BFF; --cian:#19C3F0; --coral:#FF5A47; --magenta:#F0367F; --jade:#10A37F; --lima:#A6E35B; --violeta:#7346FF; --orquidea:#D35CFF; --ambar:#FFB238;
  --espectro:linear-gradient(100deg,#2D5BFF 0%,#19C3F0 17%,#10A37F 33%,#A6E35B 45%,#FFB238 57%,#FF5A47 69%,#F0367F 82%,#7346FF 100%);
  --espectro-conico:conic-gradient(from 210deg,#2D5BFF,#19C3F0,#10A37F,#A6E35B,#FFB238,#FF5A47,#F0367F,#7346FF,#2D5BFF);
  --foco:#1E40C8;
  --margen:clamp(20px,5vw,72px); --ancho:1280px; --cab:72px;
  --ease-out:cubic-bezier(.23,1,.32,1); --ease-io:cubic-bezier(.77,0,.175,1); --ease-cajon:cubic-bezier(.32,.72,0,1);
  --sombra:0 1px 2px rgba(21,24,30,.06),0 18px 40px -22px rgba(21,24,30,.28);
  --sombra-alta:0 2px 6px rgba(21,24,30,.08),0 32px 64px -28px rgba(21,24,30,.38);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--mineral);scroll-padding-top:calc(var(--cab) + 20px);-webkit-text-size-adjust:100%;scrollbar-color:#b9bdc0 var(--mineral);scrollbar-width:thin}
body{margin:0;font:400 1.0625rem/1.6 "Archivo",system-ui,sans-serif;color:var(--grafito);background:transparent;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
/* el fondo deja de ser plano: campos de luz del espectro y un grano fino, fijos detrás de todo */
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:
  radial-gradient(circle at 1px 1px,rgba(21,24,30,.13) 1px,transparent 1.4px) 0 0/26px 26px,
  radial-gradient(56rem 40rem at 0% -6%,rgba(45,91,255,.24),transparent 68%),radial-gradient(46rem 34rem at 104% 10%,rgba(115,70,255,.2),transparent 68%),
  radial-gradient(50rem 34rem at 40% 112%,rgba(255,90,71,.16),transparent 68%),radial-gradient(34rem 26rem at 100% 86%,rgba(16,163,127,.15),transparent 68%),
  radial-gradient(30rem 22rem at -4% 60%,rgba(25,195,240,.14),transparent 68%),
  linear-gradient(180deg,#F4F4F1,#EAEAE5)}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.07;mix-blend-mode:multiply;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
img,video,canvas,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-underline-offset:.24em;text-decoration-thickness:1px}
h1,h2,h3,h4{margin:0;font-weight:640;font-stretch:115%;letter-spacing:-.03em;line-height:1.02;text-wrap:balance}
p{margin:0}
ul,ol{margin:0;padding:0}
::selection{background:var(--cobalto);color:#fff}
:focus{outline:none}
:focus-visible{outline:2px solid var(--foco);outline-offset:3px;border-radius:4px}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--mineral)}::-webkit-scrollbar-thumb{background:#c3c6c9;border-radius:10px;border:2px solid var(--mineral)}
input,textarea,select{caret-color:var(--grafito)}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ico{width:1em;height:1em;flex:none}
.saltar{position:fixed;left:16px;top:-80px;z-index:200;background:var(--grafito);color:var(--mineral);padding:.7rem 1rem;border-radius:6px;font-weight:600;text-decoration:none}
.saltar:focus{top:12px}

/* ---------- botones, enlaces, chips ---------- */
.boton{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:48px;padding:0 1.4rem;border-radius:999px;border:1px solid transparent;
  font:620 .92rem/1 "Archivo",sans-serif;font-stretch:108%;letter-spacing:.005em;text-decoration:none;cursor:pointer;
  transition:background-color .18s var(--ease-out),border-color .18s var(--ease-out),color .18s var(--ease-out),transform .12s var(--ease-out)}
.boton:active{transform:scale(.97)}
.boton .ico{transition:transform .25s var(--ease-out)}
.boton-negro{background:var(--grafito);color:var(--mineral)}
.boton-linea{background:rgba(255,255,255,.6);border-color:var(--platino);color:var(--grafito)}
.boton-claro{background:var(--mineral);color:var(--grafito)}
.boton-chico{min-height:40px;padding:0 1.05rem;font-size:.86rem}
.boton-linea-claro{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.34);color:#fff}
.boton-linea-claro:hover{background:rgba(255,255,255,.14)}
.boton-color{color:#fff;background:var(--acento-tinta) linear-gradient(100deg,var(--acento-tinta),color-mix(in oklab,var(--acento-tinta) 74%,var(--acento)));box-shadow:0 10px 26px -14px var(--acento)}
@media (hover:hover) and (pointer:fine){
  .boton-negro:hover{background:#2a2f38}
  .boton-color:hover{background-image:linear-gradient(100deg,color-mix(in oklab,var(--acento-tinta) 88%,#000),var(--acento-tinta))}
  .boton-linea:hover{border-color:var(--grafito);background:var(--blanco)}
  .boton:hover .ico{transform:translateX(3px)}
}
.enlace{display:inline-flex;align-items:center;gap:.45em;min-height:44px;font-weight:600;text-decoration:underline;text-decoration-color:var(--platino)}
.enlace:hover{text-decoration-color:currentColor}
.enlace-sec{color:var(--gris)}
.acciones{display:flex;flex-wrap:wrap;gap:10px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips button{min-height:40px;padding:0 .95rem;border-radius:999px;border:1px solid var(--platino);background:var(--blanco);color:var(--grafito-2);font:560 .88rem "Archivo",sans-serif;cursor:pointer;
  transition:background-color .15s var(--ease-out),border-color .15s var(--ease-out),color .15s var(--ease-out),transform .12s var(--ease-out)}
.chips button:active{transform:scale(.97)}
.chips button[aria-pressed="true"]{background:var(--acento-tinta);border-color:var(--acento-tinta);color:#fff}
.chips button:disabled{opacity:.45;cursor:not-allowed}
@media (hover:hover) and (pointer:fine){.chips button:not([aria-pressed="true"]):not(:disabled):hover{border-color:var(--grafito);color:var(--grafito)}}
.lista{list-style:none}
.lista li{position:relative;padding:.62rem 0 .62rem 1.3rem;border-bottom:1px solid var(--platino-2)}
.lista li::before{content:"";position:absolute;left:0;top:1.15rem;width:7px;height:7px;border:1.5px solid var(--acento);border-radius:2px;transform:rotate(45deg)}
.lista-grande li{font-size:1.06rem}
/* orbe: esfera de luz del color de la línea (el giro vive en ::before para que el reflejo quede fijo) */
.orbe{position:absolute;aspect-ratio:1;border-radius:50%;overflow:hidden;isolation:isolate;pointer-events:none;background:var(--acento-tinta);box-shadow:0 46px 90px -40px var(--acento),inset 0 0 0 1px rgba(255,255,255,.25)}
/* corriente interior: manchas de la banda y un hilo de luz que giran dentro del vidrio */
.orbe::before{content:"";position:absolute;inset:-30%;filter:blur(14px);animation:orbe-giro 16s linear infinite;
  background:radial-gradient(circle at 30% 34%,var(--acento-2) 0,transparent 26%),radial-gradient(circle at 68% 62%,var(--acento) 0,transparent 30%),radial-gradient(ellipse 34% 12% at 52% 46%,rgba(255,255,255,.85) 0,transparent 100%),radial-gradient(circle at 40% 78%,color-mix(in oklab,var(--acento-2) 70%,#fff) 0,transparent 22%),conic-gradient(from 90deg,var(--acento),var(--acento-tinta),var(--acento-2),var(--acento))}
.orbe::after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 32% 24%,rgba(255,255,255,.75),rgba(255,255,255,0) 26%),radial-gradient(circle at 72% 84%,color-mix(in oklab,var(--acento-2) 55%,transparent),transparent 34%),radial-gradient(circle at 50% 50%,transparent 60%,rgba(10,12,16,.26) 100%)}
.orbe-espectro::before{background:var(--espectro-conico)}
@keyframes orbe-giro{to{transform:rotate(1turn)}}

/* ---------- cabecera: logo exacto y los cuatro accesos ---------- */
.cabecera{position:sticky;top:0;z-index:50;height:var(--cab);display:flex;align-items:center;gap:20px;padding:0 var(--margen);
  background:rgba(247,247,244,.97);border-bottom:1px solid var(--platino-2)}
.cabecera::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--espectro);opacity:.85;pointer-events:none}
.marca{display:inline-flex;align-items:center;gap:11px;text-decoration:none;min-height:44px}
.isotipo{width:40px;height:40px;object-fit:contain}
.marca-texto{display:flex;flex-direction:column;line-height:1}
.marca-nombre{font-weight:700;font-stretch:125%;letter-spacing:.16em;font-size:1.02rem}
.marca-desc{font-weight:560;font-size:.55rem;letter-spacing:.56em;color:var(--gris);margin-top:5px}
.nav{margin-left:auto}
.nav ul{display:flex;list-style:none;border:1px solid var(--platino);border-radius:999px;padding:4px;background:rgba(255,255,255,.7);gap:2px}
.nav a{display:flex;align-items:center;min-height:38px;padding:0 1rem;border-radius:999px;font:600 .88rem/1 "Archivo",sans-serif;font-stretch:106%;text-decoration:none;color:var(--grafito-2);transition:background-color .16s var(--ease-out),color .16s var(--ease-out)}
.nav a:hover{background:var(--niebla)}
.nav a[aria-current="page"]{background:var(--grafito);color:var(--mineral)}
.nav .nav-cotizar{color:var(--grafito);border:1.5px solid transparent;background:linear-gradient(#fff,#fff) padding-box,var(--espectro) border-box}
.nav .nav-cotizar[aria-current="page"]{background:linear-gradient(var(--grafito),var(--grafito)) padding-box,var(--espectro) border-box;color:#fff}
@media (max-width:760px){
  /* celular: una sola fila compacta (isotipo + cuatro accesos); bajo 360 px pasa a una segunda línea deliberada */
  :root{--cab:56px}
  .cabecera{gap:10px;padding:0 12px}
  .marca-texto{display:none}
  .isotipo{width:34px;height:34px}
  .nav ul{padding:3px;gap:0}
  .nav a{padding:0 .7rem;font-size:.84rem;min-height:40px;white-space:nowrap}
}
@media (max-width:359px){
  :root{--cab:auto}
  .cabecera{height:auto;flex-wrap:wrap;padding:8px 10px;position:relative}
  .nav{margin-left:0;width:100%}.nav ul{justify-content:space-between}
}

/* ---------- inicio: la mesa ---------- */
/* el lienzo conserva el alto completo; al abrir una estación el escenario se recorta y la cámara recentra la pieza */
.mesa{position:relative;--alto-escena:clamp(560px,calc(100svh - var(--cab)),1100px)}
.escenario{position:relative;height:var(--alto-escena);transition:height .42s var(--ease-cajon);overflow:hidden;background:radial-gradient(80% 90% at 62% 32%,#3c4048 0,#1c1f25 55%,#0f1115 100%);color:#F2F3F5}
.escena-lienzo{position:absolute;inset:0}
/* el póster (render real de la misma mesa y el mismo encuadre) se ve desde el primer cuadro; el 3D entra encima */
.mundo-respaldo{position:absolute;inset:0 0 auto 0;width:100%;height:var(--alto-escena);object-fit:cover;object-position:50% 50%}
.mundo{position:absolute;inset:0 0 auto 0;width:100%;height:var(--alto-escena);touch-action:pan-y;opacity:0;transition:opacity .6s var(--ease-out)}
.mundo-listo .mundo{opacity:1}
.sin-3d .mundo{display:none}
.portada{position:absolute;z-index:4;left:var(--margen);top:clamp(28px,6svh,64px);width:min(31rem,calc(100% - 2*var(--margen)))}
/* velo suave detrás de la portada: la mesa nunca compite con el titular */
.escenario::before{content:"";position:absolute;z-index:2;inset:0 auto 0 0;width:min(48rem,72%);pointer-events:none;background:linear-gradient(90deg,rgba(14,16,20,.82),rgba(14,16,20,.5) 50%,rgba(14,16,20,0));transition:opacity .35s var(--ease-out)}
.escenario.en-sala::before{opacity:0}
.portada h1{font-size:clamp(2.4rem,4.3vw,4.3rem);font-weight:660;font-stretch:116%;line-height:1;letter-spacing:-.04em;max-width:13ch;text-wrap:balance}
.acento-espectro{background:linear-gradient(100deg,var(--cobalto) 10%,var(--violeta) 90%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.portada .bajada{margin-top:1rem;font-size:clamp(1.05rem,1.3vw,1.25rem);color:#C9CCD0;max-width:30rem}
.portada .acento-espectro,.srv-portada .acento-espectro{background-image:linear-gradient(100deg,#19C3F0 8%,#D35CFF 92%)}
.portada .acciones{margin-top:1.6rem}
.etiquetas{position:absolute;inset:0 0 auto 0;height:var(--alto-escena,100%);z-index:3;pointer-events:none;overflow:hidden}
.etiqueta{position:absolute;left:0;top:0;opacity:0;white-space:nowrap;transition:opacity .2s var(--ease-out)}
.etiqueta.visible{opacity:1}
.etiqueta-sala{margin-top:-14px;translate:-50% 0;pointer-events:auto;cursor:pointer;padding:.25rem .45rem;border-radius:6px;background:rgba(247,247,244,.72);
  font:640 .74rem/1 "Archivo",sans-serif;font-stretch:108%;color:var(--grafito);transition:opacity .2s var(--ease-out),background-color .2s var(--ease-out),box-shadow .2s var(--ease-out)}
.etiqueta-sala::before{content:"";display:inline-block;width:9px;height:9px;margin-right:.45em;vertical-align:-1px;border-radius:50%;background:linear-gradient(135deg,var(--acento,#15181E),var(--acento-2,#5C616A))}
.etiqueta-sala.sobre{background:#fff;box-shadow:0 10px 24px -14px var(--acento,rgba(0,0,0,.4))}
.etiqueta-capa,.etiqueta-estancia{translate:10px -50%;padding:.3rem .55rem;border-radius:4px;background:rgba(255,255,255,.95);border:1px solid var(--platino);font-size:.76rem;font-weight:600;color:var(--grafito)}
.escena-estado{position:absolute;z-index:4;right:var(--margen);top:20px;font-size:.85rem;color:#C9CCD0;transition:opacity .4s var(--ease-out)}
.escena-estado.oculto{opacity:0}
.en-sala .portada{opacity:0;pointer-events:none;transition:opacity .25s var(--ease-out)}
.portada{transition:opacity .35s var(--ease-out)}

/* el borde de la mesa: lectura estable mientras la cámara se mueve */
.borde{position:relative;z-index:5;margin-top:-1px;background:linear-gradient(var(--blanco),var(--mineral));border-top:1px solid var(--platino);box-shadow:0 -1px 0 #fff inset,0 -14px 30px -24px rgba(21,24,30,.35)}
.borde::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--espectro);opacity:.9}
.estaciones{max-width:var(--ancho);margin:0 auto;padding:10px var(--margen) 12px}
.estaciones-indicacion{display:flex;align-items:center;gap:.5em;margin:0 0 8px;font:640 .7rem/1 "Archivo",sans-serif;font-stretch:115%;letter-spacing:.12em;text-transform:uppercase;color:var(--gris)}
.estaciones-indicacion::before{content:"";width:18px;height:2px;border-radius:2px;background:var(--espectro)}
.estaciones ul{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.estacion{position:relative;width:100%;min-height:68px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:.28rem;padding:.7rem .95rem .7rem 1.15rem;text-align:left;cursor:pointer;
  padding-left:2.7rem;border-radius:14px;border:1.5px solid var(--platino-2);background:var(--blanco);color:var(--grafito);transition:border-color .18s var(--ease-out),box-shadow .18s var(--ease-out),transform .12s var(--ease-out)}
.estacion::before{content:"";position:absolute;left:.85rem;top:50%;width:1.2rem;height:1.2rem;margin-top:-.6rem;border-radius:50%;
  background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.85),rgba(255,255,255,0) 42%),conic-gradient(from 200deg,var(--acento),var(--acento-2),var(--acento));box-shadow:0 4px 12px -4px var(--acento);transition:transform .25s var(--ease-out)}
.estacion:active{transform:scale(.985)}
.estacion-nombre{font:660 .98rem/1.1 "Archivo",sans-serif;font-stretch:112%;letter-spacing:-.01em}
.estacion-linea{font-size:.82rem;color:var(--gris);line-height:1.3}
.estacion.sobre,.estacion:hover{border-color:color-mix(in oklab,var(--acento) 45%,var(--platino-2));box-shadow:0 16px 34px -22px var(--acento)}
.estacion.sobre::before,.estacion:hover::before{transform:scale(1.12)}
.estacion[aria-current="true"]{border-color:transparent;background:linear-gradient(var(--blanco),var(--blanco)) padding-box,linear-gradient(120deg,var(--acento),var(--acento-2)) border-box;box-shadow:0 18px 36px -22px var(--acento)}
.infos{position:absolute;left:0;right:0;bottom:100%;z-index:6;display:grid;grid-template-rows:0fr;transition:grid-template-rows .42s var(--ease-cajon);
  background:rgba(255,255,255,.98)}
.borde.abierto .infos{grid-template-rows:1fr;box-shadow:0 -1px 0 var(--platino-2),0 -24px 48px -36px rgba(21,24,30,.4)}
.infos>div,.infos{min-height:0}
.infos>.info{overflow:hidden}
.info:not([hidden]){animation:info-entra .24s var(--ease-out)}
@keyframes info-entra{from{opacity:0;transform:translateY(6px)}}
.flujo-decision{margin-top:6px;padding:.7rem .85rem;border-radius:12px;background:color-mix(in oklab,var(--acento) 9%,var(--blanco));border:1px solid color-mix(in oklab,var(--acento) 30%,var(--platino-2));font-size:.9rem;color:var(--grafito-2)}
.flujo-decision b{display:block;margin-bottom:.15rem;color:var(--acento-tinta);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase}
.flujo-decision.a-persona{background:color-mix(in oklab,var(--coral) 9%,var(--blanco));border-color:color-mix(in oklab,var(--coral) 35%,var(--platino-2))}
.flujo-decision.a-persona b{color:#C42640}
.info{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,5fr) minmax(200px,240px);gap:22px 40px;align-items:start;max-width:var(--ancho);margin:0 auto;padding:22px var(--margen) 22px;min-height:0;overflow:hidden}
.info-texto{position:relative;padding-left:20px}
.info-texto::before{content:"";position:absolute;left:0;top:.25rem;bottom:.25rem;width:3px;border-radius:3px;background:linear-gradient(var(--acento),var(--acento-2))}
.info h2{font-size:clamp(1.5rem,2.1vw,2rem)}
.info-beneficio{margin-top:.45rem;color:var(--grafito-2);font-size:1.02rem;max-width:34rem}
.info-entregas{margin-top:.55rem;font-size:.9rem;color:var(--grafito-2);max-width:34rem}
.info-entregas span{font-size:.7rem;font-weight:650;letter-spacing:.12em;text-transform:uppercase;color:var(--acento-tinta);margin-right:.4rem}
.info-servicios{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin-top:.9rem}
.info-servicios a{display:inline-flex;align-items:center;min-height:34px;padding:0 .8rem;border-radius:999px;background:color-mix(in oklab,var(--acento) 10%,var(--blanco));color:var(--acento-tinta);font-size:.86rem;font-weight:600;text-decoration:none}
.info-servicios a:hover{background:color-mix(in oklab,var(--acento) 18%,var(--blanco))}
.info-controles{display:flex;flex-direction:column;gap:12px}
.control-nombre{display:block;font:640 .68rem/1 "Archivo",sans-serif;font-stretch:115%;letter-spacing:.12em;text-transform:uppercase;color:var(--gris);margin-bottom:.5rem}
.control-estado{font-size:.85rem;color:var(--gris);min-height:1.2em}
.boton-ejecutar{border-color:var(--acento)!important}
.info-acciones{display:flex;flex-direction:column;align-items:stretch;gap:8px;min-width:200px}
.volver{display:inline-flex;align-items:center;justify-content:center;gap:.45em;min-height:44px;border:0;background:none;color:var(--gris);font:560 .9rem "Archivo",sans-serif;cursor:pointer}
.volver:hover{color:var(--grafito)}
.pasos{list-style:none;counter-reset:paso}
.pasos li{position:relative;padding:.45rem 0 .45rem 2rem;border-bottom:1px solid var(--platino-2);color:var(--gris);counter-increment:paso;font-size:.9rem;transition:color .25s var(--ease-out)}
.pasos li::before{content:counter(paso);position:absolute;left:0;top:.42rem;width:1.4rem;height:1.4rem;border-radius:50%;display:grid;place-items:center;font-size:.72rem;font-variant-numeric:tabular-nums;border:1px solid var(--platino);transition:background-color .25s,border-color .25s,color .25s}
.pasos li.hecho{color:var(--grafito-2)}
.pasos li.actual{color:var(--grafito)}
.pasos li.actual::before{background:var(--acento-tinta);border-color:var(--acento-tinta);color:#fff}
@media (max-width:1080px){.info{grid-template-columns:1fr 1fr}.info-acciones{grid-column:1 / -1;flex-direction:row;flex-wrap:wrap;align-items:center;min-width:0}.info-muestra{flex:0 0 112px}}
@media (max-width:760px){
  /* celular: el titular va arriba, fuera de la escena; la mesa ocupa su propio bloque debajo */
  .mesa{--alto-escena:clamp(340px,50svh,440px)}
  .escenario{display:flex;flex-direction:column;height:auto!important}
  .escenario::before{display:none}
  .portada{order:-1;position:relative;left:auto;top:auto;width:auto;padding:24px var(--margen) 4px}
  .escena-lienzo{position:relative;height:var(--alto-escena)}
  .en-sala .portada{display:none}
  .portada h1{font-size:clamp(2.1rem,9.4vw,2.6rem)}.portada .bajada{font-size:1rem}
  .portada .acciones{gap:8px}.portada .acciones .boton{min-height:46px;padding:0 .95rem;font-size:.86rem}
  .estaciones ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .info{grid-template-columns:1fr;gap:16px;padding-top:10px}
  .infos{position:static;background:none;-webkit-backdrop-filter:none;backdrop-filter:none}
  .borde.abierto .infos{box-shadow:none}
}


/* ---------- secciones ---------- */
.seccion{max-width:var(--ancho);margin:0 auto;padding:clamp(80px,10vw,140px) var(--margen) 0}
.seccion h2{font-size:clamp(2rem,3.4vw,3.2rem);max-width:22ch}
.seccion-bajada{margin-top:.9rem;max-width:42rem;color:var(--grafito-2);font-size:1.08rem}
.seccion-cabeza{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:12px}
.paquetes-seccion{position:relative;isolation:isolate;overflow:hidden;max-width:none;margin-top:clamp(80px,10vw,140px);padding:clamp(72px,9vw,120px) max(var(--margen),calc((100vw - var(--ancho))/2 + var(--margen)));background:var(--noche);color:#F2F3F5}
/* auroras: halos separados de tonos vecinos (mezclar opuestos bajo el desenfoque ensucia el color) */
.paquetes-seccion::before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;
  background:radial-gradient(34% 46% at 14% 0%,rgba(16,163,127,.30),transparent 70%),radial-gradient(36% 50% at 52% -6%,rgba(45,91,255,.34),transparent 70%),radial-gradient(34% 48% at 92% 4%,rgba(240,54,127,.30),transparent 70%)}
.paquetes-seccion .seccion-bajada{color:var(--claro-noche)}
.paquetes{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1fr);gap:14px;margin-top:2.4rem;align-items:stretch}
.paquete{position:relative;display:flex;flex-direction:column;gap:1rem;padding:28px 26px 24px;border-radius:22px;background:var(--blanco);border:1px solid var(--platino-2);box-shadow:var(--sombra);overflow:hidden}
.paquetes-seccion .paquete{background:linear-gradient(170deg,color-mix(in oklab,var(--acento) 16%,var(--noche-2)),var(--noche-2) 55%);border-color:rgba(255,255,255,.09);box-shadow:none;color:#F2F3F5}
.paquetes-seccion .paquete::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--acento),var(--acento-2))}
.paquetes-seccion .paquete::after{content:"";position:absolute;right:-60px;top:-60px;width:200px;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,color-mix(in oklab,var(--acento-2) 65%,transparent),transparent 68%);filter:blur(8px);opacity:.55;pointer-events:none}
.paquetes-seccion .paquete-texto,.paquetes-seccion .paquete-amplia{color:#C9CCD0}
.paquetes-seccion .paquete h4{color:var(--acento-2)}
.paquetes-seccion .paquete .lista li{border-color:rgba(255,255,255,.1)}
.paquetes-seccion .paquete .lista li::before{border-color:var(--acento-2)}
.paquetes-seccion .paquete .boton-negro{background:#fff;color:var(--grafito)}
.paquetes-seccion .paquete .enlace{text-decoration-color:rgba(255,255,255,.4)}
.paquete h3{font-size:1.6rem}
.paquete-texto{color:var(--grafito-2)}
.paquete-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.paquete h4{font:640 .7rem/1 "Archivo",sans-serif;font-stretch:115%;letter-spacing:.12em;text-transform:uppercase;color:var(--gris);margin-bottom:.4rem}
.paquete .lista li{font-size:.92rem;padding:.42rem 0 .42rem 1.15rem}
.paquete .lista li::before{top:.9rem;width:6px;height:6px}
.paquete-amplia{font-size:.9rem;color:var(--gris)}
.paquete-acciones{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}
.paquetes-seccion .paquete-0 h3{font-size:2.1rem}
.paquetes-seccion .paquete-1{margin-top:28px}.paquetes-seccion .paquete-2{margin-top:56px}
.paquetes-compactos{grid-template-columns:1fr;gap:10px;margin-top:1rem}
.paquetes-compactos .paquete{padding:18px 20px;border-radius:16px;box-shadow:none;margin:0}
.paquetes-compactos .paquete h3{font-size:1.2rem}.paquetes-compactos .paquete-cols{display:none}
.paquetes-compactos .paquete{padding-left:24px}
.paquetes-compactos .paquete::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(var(--acento),var(--acento-2))}
.proceso{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:2.4rem}
.proceso li{padding-top:1rem;border-top:2px solid;border-image:linear-gradient(90deg,var(--p1),var(--p2)) 1}
.proceso li:nth-child(1){--p1:#2D5BFF;--p2:#19C3F0}.proceso li:nth-child(2){--p1:#FF5A47;--p2:#F0367F}.proceso li:nth-child(3){--p1:#10A37F;--p2:#A6E35B}.proceso li:nth-child(4){--p1:#7346FF;--p2:#D35CFF}
.paso-num{display:inline-block;font-weight:680;font-stretch:125%;font-size:2.4rem;line-height:1;font-variant-numeric:tabular-nums;margin-bottom:.8rem;background:linear-gradient(120deg,var(--p1),var(--p2));-webkit-background-clip:text;background-clip:text;color:transparent}
.proceso h3{font-size:1.15rem;margin-bottom:.4rem}
.proceso p{color:var(--gris);font-size:.98rem}
.preguntas-lista{margin-top:1.8rem;border-top:1px solid var(--platino-2)}
.pregunta{border-bottom:1px solid var(--platino-2)}
.pregunta summary{display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:62px;padding:.85rem 0;font-weight:600;font-size:1.08rem;cursor:pointer;list-style:none}
.pregunta summary::-webkit-details-marker{display:none}
.pregunta summary .ico{color:var(--gris);font-size:1.15rem;transition:transform .25s var(--ease-out)}
.pregunta[open] summary .ico{transform:rotate(45deg);color:var(--cobalto)}
.pregunta p{color:var(--grafito-2);padding:0 0 1.3rem;max-width:46rem}
.cta{position:relative;isolation:isolate;overflow:hidden;margin-top:clamp(80px,10vw,140px);max-width:none;padding:clamp(64px,8vw,112px) max(var(--margen),calc((100vw - var(--ancho))/2 + var(--margen)));background:var(--noche);color:#F2F3F5}
.cta::before{content:"";position:absolute;z-index:-1;inset:-20% -10%;pointer-events:none;filter:blur(18px);animation:aurora 22s var(--ease-io) infinite alternate;
  background:radial-gradient(30% 52% at 76% 34%,rgba(45,91,255,.62),transparent 70%),radial-gradient(26% 46% at 62% 78%,rgba(240,54,127,.5),transparent 70%),radial-gradient(24% 44% at 92% 74%,rgba(115,70,255,.6),transparent 70%),radial-gradient(18% 30% at 54% 22%,rgba(25,195,240,.32),transparent 70%)}
@keyframes aurora{to{transform:translate3d(-4%,3%,0) scale(1.06)}}
.cta .seccion-bajada{color:var(--claro-noche)}
.paquetes-seccion+.cta{margin-top:0;border-top:1px solid rgba(255,255,255,.08)}
.cta .boton-negro{background:#fff;color:var(--grafito)}
.cta .boton-linea{background:transparent;border-color:rgba(255,255,255,.32);color:#fff}
.cta .acciones{margin-top:1.6rem}
.canales{display:flex;flex-wrap:wrap;gap:10px;margin-top:1rem}.canales:empty{display:none}
/* ---------- pie comercial: isotipo, lema, accesos y canal confirmado ---------- */
.pie{position:relative;padding:44px var(--margen) 40px;background:var(--noche);color:#E8EAED}
.pie::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--espectro);opacity:.6}
.pie-fila{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px 40px;max-width:var(--ancho);margin:0 auto}
.pie-marca{display:flex;flex-direction:column;gap:.6rem}
.pie-marca p{color:var(--claro-noche);font-size:.92rem}
.pie .marca-desc{color:var(--claro-noche)}
.pie nav ul{display:flex;flex-wrap:wrap;gap:2px 22px;list-style:none}
.pie nav a{display:inline-flex;min-height:44px;align-items:center;color:#C9CCD0;text-decoration:none;font-size:.95rem}
.pie nav a:hover{color:#fff;text-decoration:underline}
.canales-pie .boton-linea{background:transparent;border-color:rgba(255,255,255,.3);color:#fff}

/* ---------- inicio: dos ofertas con su muestra ---------- */
.ofertas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:2.2rem}
.oferta{position:relative;display:grid;grid-template-rows:auto 1fr;border-radius:22px;overflow:hidden;background:var(--blanco);border:1px solid var(--platino-2);box-shadow:var(--sombra)}
.oferta::before{content:"";position:absolute;z-index:1;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--acento),var(--acento-2))}
.oferta-muestra{display:block;overflow:hidden;background:var(--niebla)}
.oferta-muestra img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .6s var(--ease-out)}
.oferta-muestra:hover img{transform:scale(1.025)}
.oferta-texto{display:flex;flex-direction:column;gap:.8rem;padding:22px 24px 24px}
.oferta-texto h3{font-size:1.5rem}
.oferta-texto>p{color:var(--grafito-2)}
.oferta .lista li{font-size:.94rem;padding:.4rem 0 .4rem 1.2rem}.oferta .lista li::before{top:.85rem;width:6px;height:6px}
.oferta .acciones{margin-top:auto;align-items:center;gap:8px 18px}

/* ---------- páginas interiores ---------- */
.pagina-cabeza{max-width:var(--ancho);margin:0 auto;padding:clamp(56px,8vw,110px) var(--margen) 0}
.pagina-cabeza h1{font-size:clamp(2.6rem,5.6vw,5.2rem);letter-spacing:-.045em}
.pagina-cabeza .bajada{margin-top:1rem;max-width:40rem;font-size:1.15rem;color:var(--grafito-2)}
.miga{font-size:.88rem;color:var(--gris);margin-bottom:.6rem}
.miga a{color:var(--grafito-2)}
.nota{display:inline-flex;align-items:center;gap:.45em;padding:.28rem .6rem;border-radius:999px;background:color-mix(in oklab,var(--acento) 10%,var(--blanco));color:var(--acento-tinta);font:640 .7rem/1 "Archivo",sans-serif;font-stretch:112%;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.nota::before{content:"";width:7px;height:7px;border-radius:50%;background:linear-gradient(135deg,var(--acento),var(--acento-2))}
.servicios-indice{max-width:var(--ancho);margin:0 auto;padding:0 var(--margen)}
.centro-grupo{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:24px 64px;padding:clamp(48px,6vw,80px) 0;border-bottom:1px solid var(--platino-2)}
.centro-grupo-cabeza{position:relative}
.centro-grupo-cabeza h2{font-size:clamp(1.8rem,2.8vw,2.6rem);padding-top:.9rem;border-top:3px solid;border-image:linear-gradient(90deg,var(--acento),var(--acento-2) 50%,transparent) 1}
.centro-grupo-cabeza .orbe{position:relative;display:block;width:64px;margin-bottom:1.2rem}
.centro-grupo-cabeza p{margin-top:.6rem;color:var(--gris)}
.servicio-lista{list-style:none}
.servicio-fila a{display:grid;grid-template-columns:1fr auto;gap:4px 24px;padding:1.3rem 0;border-bottom:1px solid var(--platino-2);text-decoration:none}
.servicio-fila:first-child a{padding-top:.4rem}
.servicio-fila h3{font-size:1.45rem}
.servicio-fila p{grid-column:1;color:var(--grafito-2)}
.servicio-entregables{grid-column:1;color:var(--gris);font-size:.9rem}
.servicio-fila .ico{grid-column:2;grid-row:1 / span 3;align-self:center;font-size:1.3rem;color:var(--gris);transition:transform .2s var(--ease-out)}
.servicio-fila a:hover .ico{transform:translateX(4px);color:var(--acento-tinta)}
.servicio-fila a:hover h3{text-decoration:underline;text-decoration-color:var(--acento);text-decoration-thickness:2px}

/* ---------- página de servicio: título breve, prueba visible y una acción; composición según la interacción ---------- */
.servicio-escena{position:relative;isolation:isolate;max-width:calc(var(--ancho) + 2 * var(--margen));margin:0 auto;padding:clamp(28px,4vw,56px) var(--margen) clamp(40px,5vw,64px);display:grid;gap:22px 48px}
.escena-texto{position:relative;z-index:1}
.servicio-nombre{display:inline-flex;align-items:center;gap:.5em;font:660 .8rem/1 "Archivo",sans-serif;font-stretch:115%;letter-spacing:.1em;text-transform:uppercase;color:var(--acento-tinta);margin-bottom:.7rem}
.servicio-nombre::before{content:"";width:22px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--acento),var(--acento-2))}
.escena-texto h1{font-size:clamp(2rem,3.3vw,3.1rem);letter-spacing:-.035em;max-width:20ch;text-wrap:balance}
.disposicion-lado .escena-texto h1,.disposicion-torre .escena-texto h1{font-size:clamp(1.9rem,2.6vw,2.6rem);max-width:none}
.escena-texto .bajada{margin-top:.8rem;font-size:1.12rem;color:var(--grafito-2);max-width:34rem}
.escena-texto .acciones{margin-top:1.2rem}
.escena-demo{position:relative;z-index:1;min-width:0}
.demo-cabeza{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin-bottom:14px}
.demo-cabeza h2{font-size:clamp(1.2rem,1.7vw,1.5rem);letter-spacing:-.02em}
.demo-cabeza p{flex-basis:100%;color:var(--grafito-2);font-size:.98rem;max-width:44rem}
.demo-pie{margin-top:14px}
.demo-pie .enlace{color:var(--acento-tinta);text-decoration-color:color-mix(in oklab,var(--acento) 50%,transparent)}
.orbe-escena{z-index:0;width:clamp(120px,15vw,210px);right:var(--margen);top:clamp(18px,3vw,40px);opacity:.9}
/* dispositivo (sitios): texto en una franja y la interfaz a todo el ancho */
.disposicion-dispositivo .servicio-escena{grid-template-columns:minmax(0,1fr);background:radial-gradient(60rem 26rem at 85% 0%,color-mix(in oklab,var(--acento) 14%,transparent),transparent 70%)}
.disposicion-dispositivo .escena-texto{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:6px 40px;align-items:end;padding-right:clamp(0px,14vw,220px)}
.disposicion-dispositivo .escena-texto .miga,.disposicion-dispositivo .escena-texto .servicio-nombre,.disposicion-dispositivo .escena-texto h1{grid-column:1}
.disposicion-dispositivo .escena-texto .bajada,.disposicion-dispositivo .escena-texto .acciones{grid-column:2}
/* lado (apps, producto, automatización): texto angosto y la herramienta en uso a la derecha */
.disposicion-lado .servicio-escena,.disposicion-torre .servicio-escena{grid-template-columns:minmax(0,4fr) minmax(0,8fr);align-items:start;background:linear-gradient(180deg,color-mix(in oklab,var(--acento) 7%,var(--mineral)),var(--mineral) 70%)}
.disposicion-lado .escena-texto,.disposicion-torre .escena-texto{position:sticky;top:calc(var(--cab) + 78px);padding-top:clamp(0px,4vw,40px)}
/* oscuro (juego, cine): banda noche, la pieza manda */
.disposicion-oscuro .servicio-escena{max-width:none;grid-template-columns:minmax(0,1fr);padding-left:max(var(--margen),calc((100vw - var(--ancho)) / 2 + var(--margen)));padding-right:max(var(--margen),calc((100vw - var(--ancho)) / 2 + var(--margen)));background:var(--noche);color:#F2F3F5}
.disposicion-oscuro .servicio-escena::before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(40% 60% at 85% 10%,color-mix(in oklab,var(--acento) 40%,transparent),transparent 70%),radial-gradient(30% 50% at 10% 90%,color-mix(in oklab,var(--acento-2) 28%,transparent),transparent 70%)}
.disposicion-oscuro .escena-texto{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:6px 40px;align-items:end}
.disposicion-oscuro .escena-texto .miga,.disposicion-oscuro .escena-texto .servicio-nombre,.disposicion-oscuro .escena-texto h1{grid-column:1}
.disposicion-oscuro .escena-texto .bajada,.disposicion-oscuro .escena-texto .acciones{grid-column:2}
.disposicion-oscuro .miga,.disposicion-oscuro .miga a{color:var(--claro-noche)}
.disposicion-oscuro .servicio-nombre{color:var(--acento-2)}
.disposicion-oscuro .escena-texto .bajada,.disposicion-oscuro .demo-cabeza p{color:var(--claro-noche)}
.disposicion-oscuro .demo-pie .enlace{color:#fff}
.disposicion-oscuro .nota{background:rgba(255,255,255,.1);color:#fff}
.disposicion-oscuro .juego-marcador{color:#fff}
.disposicion-oscuro .momentos button{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);color:#F2F3F5}
.disposicion-oscuro .momentos button small{color:var(--claro-noche)}
.disposicion-oscuro .momentos button[aria-current="true"] b{color:var(--acento-2)}
.disposicion-oscuro .secuencia-formato{color:var(--claro-noche)}
/* comparar (redes, edición): franja niebla, las piezas lado a lado */
.disposicion-comparar .servicio-escena{grid-template-columns:minmax(0,1fr);background:linear-gradient(180deg,var(--niebla),var(--mineral))}
.disposicion-comparar .escena-texto{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:6px 40px;align-items:end}
.disposicion-comparar .escena-texto .miga,.disposicion-comparar .escena-texto .servicio-nombre,.disposicion-comparar .escena-texto h1{grid-column:1}
.disposicion-comparar .escena-texto .bajada,.disposicion-comparar .escena-texto .acciones{grid-column:2}

/* ficha del servicio: qué resuelve, qué recibes, qué hace falta y cómo empezar */
.servicio-ficha{max-width:var(--ancho);margin:0 auto;padding:clamp(48px,6vw,88px) var(--margen) 0}
.ficha-pasos{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.ficha-pasos>li{position:relative;padding-top:1rem;border-top:2px solid;border-image:linear-gradient(90deg,var(--acento),var(--acento-2) 60%,transparent) 1}
.ficha-num{display:inline-block;font-weight:680;font-stretch:125%;font-size:1.9rem;line-height:1;margin-bottom:.6rem;background:linear-gradient(120deg,var(--acento-tinta),var(--acento));-webkit-background-clip:text;background-clip:text;color:transparent}
.ficha-pasos h2{font-size:1.2rem;margin-bottom:.6rem}
.ficha-pasos h3{font-size:.95rem;margin:1rem 0 .3rem}
.ficha-pasos p{color:var(--grafito-2)}
.ficha-para{margin-top:.6rem;font-size:.94rem}.ficha-para b{color:var(--acento-tinta)}
.ficha-pasos .acciones{margin:.9rem 0 .4rem}
.ficha-pasos .lista li{font-size:.95rem;padding:.5rem 0 .5rem 1.2rem}.ficha-pasos .lista li::before{top:1rem;width:6px;height:6px}
.lista-ampliaciones li{color:var(--grafito-2)}.lista-ampliaciones b{color:var(--grafito);font-weight:620}

/* ---------- demos: la acción principal de cada demostración lleva el color de su línea ---------- */
.demo{position:relative}
.escena-demo .boton-negro{color:#fff;background:var(--acento-tinta) linear-gradient(100deg,var(--acento-tinta),color-mix(in oklab,var(--acento-tinta) 74%,var(--acento)));box-shadow:0 10px 26px -14px var(--acento)}
.demo-barra{display:flex;gap:6px;margin-bottom:14px}
.demo-barra button{min-height:44px;padding:0 1.1rem;border-radius:999px;border:1px solid var(--platino);background:var(--blanco);font:560 .9rem "Archivo",sans-serif;cursor:pointer}
.demo-barra button[aria-pressed="true"]{background:var(--acento-tinta);border-color:var(--acento-tinta);color:#fff}
.dispositivo{position:relative;margin:0 auto;overflow:hidden;background:var(--blanco);border:1px solid var(--platino);border-radius:16px;box-shadow:var(--sombra-alta);transition:width .45s var(--ease-io),height .45s var(--ease-io),border-radius .45s var(--ease-io)}
.dispositivo[data-modo="celular"]{border-radius:34px;border:8px solid var(--grafito)}
.dispositivo iframe{display:block;border:0;transform-origin:0 0;background:#fff}
.demo-agenda{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:20px}
.agenda{display:flex;flex-direction:column;gap:16px;padding:24px;border-radius:20px;background:var(--blanco);border:1px solid var(--platino-2);box-shadow:var(--sombra)}
.agenda fieldset{border:0;margin:0;padding:0}
.agenda legend{font:640 .7rem/1 "Archivo",sans-serif;font-stretch:115%;letter-spacing:.12em;text-transform:uppercase;color:var(--gris);margin-bottom:.6rem}
.agenda .dias button{flex-direction:column;min-width:64px;min-height:56px;line-height:1.1;display:inline-flex;align-items:center;justify-content:center;border-radius:14px}
.agenda .dias small{font-size:.72rem;color:inherit;opacity:.75}
.agenda .horas button:disabled{text-decoration:line-through}
.campo{display:flex;flex-direction:column;gap:.4rem;border:0;margin:0;padding:0}
.campo>span,.campo label,.campo legend{font-weight:600;font-size:.95rem}
.campo input,.campo select,.campo textarea{min-height:48px;padding:.7rem .9rem;border-radius:12px;border:1px solid var(--platino);background:var(--blanco);color:var(--grafito);font:inherit;transition:border-color .18s var(--ease-out),box-shadow .18s var(--ease-out)}
.campo textarea{resize:vertical}
.campo input:focus-visible,.campo select:focus-visible,.campo textarea:focus-visible{outline:none;border-color:var(--foco);box-shadow:0 0 0 3px rgba(45,91,255,.18)}
.campo [aria-invalid="true"]{border-color:var(--error)}
.error{color:var(--error);font-size:.9rem}
.opcional{color:var(--gris);font-weight:400}
.agenda-resultado{display:flex;align-items:center;justify-content:center;padding:24px;border-radius:20px;background:var(--blanco);border:1px dashed var(--platino);min-height:220px}
.agenda-vacio{color:var(--gris)}
.agenda-confirmada{position:relative;overflow:hidden;width:100%;align-self:stretch;display:flex;flex-direction:column;gap:.6rem;padding:22px;border-radius:16px;background:var(--blanco);border:1px solid var(--platino-2);box-shadow:0 18px 40px -26px var(--acento)}
.agenda-confirmada::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--acento),var(--acento-2))}
.agenda-confirmada h3{font-size:1.3rem}
.agenda-confirmada dl{display:grid;grid-template-columns:auto 1fr;gap:.35rem 1rem;margin:0}.agenda-confirmada dt{color:var(--gris)}.agenda-confirmada dd{margin:0;font-weight:600}
.agenda-nota{font-size:.82rem;color:var(--gris)}
.demo-juego{display:flex;flex-direction:column;gap:12px}
.juego-lienzo{width:100%;height:auto;aspect-ratio:16/9;border-radius:20px;background:#0b0d12;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 40px 80px -40px var(--acento);touch-action:manipulation;cursor:pointer}
.juego-barra{display:flex;justify-content:space-between;align-items:center;gap:12px}
.juego-marcador{font-weight:600;font-variant-numeric:tabular-nums}
.demo-producto{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:28px;align-items:center}
.producto-marco{position:relative;margin:0 auto;width:100%;max-height:640px;border-radius:18px;overflow:hidden;background:#e9e8e3;box-shadow:var(--sombra-alta);transition:aspect-ratio .4s var(--ease-io),width .4s var(--ease-io)}
.producto-marco[data-formato="1:1"]{aspect-ratio:1/1;width:min(100%,560px)}
.producto-marco[data-formato="4:5"]{aspect-ratio:4/5;width:min(100%,500px)}
.producto-marco[data-formato="9:16"]{aspect-ratio:9/16;width:min(100%,360px)}
.producto-lienzo{width:100%;height:100%;cursor:grab;touch-action:pan-y}
/* salida: la misma toma como anuncio o como ficha de catálogo (capa HTML sobre el render) */
.producto-salida{position:absolute;inset:0;pointer-events:none}
.producto-salida>div{position:absolute;opacity:0;transition:opacity .25s var(--ease-out),transform .25s var(--ease-out);transform:translateY(6px)}
.salida-anuncio{left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;padding:18px 20px;background:linear-gradient(transparent,rgba(13,15,20,.72));color:#fff}
.salida-anuncio .salida-marca{font:660 .7rem/1 "Archivo",sans-serif;letter-spacing:.14em;text-transform:uppercase;opacity:.85}
.salida-anuncio b{font-size:clamp(1rem,2.4vw,1.35rem);font-stretch:112%;letter-spacing:-.01em}
.salida-anuncio em{font-style:normal;margin-top:.3rem;padding:.45rem .9rem;border-radius:999px;background:#fff;color:var(--grafito);font-weight:640;font-size:.82rem}
.salida-catalogo{left:14px;right:14px;bottom:14px;display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:12px 14px;border-radius:12px;background:rgba(255,255,255,.94);color:var(--grafito);box-shadow:var(--sombra)}
.salida-catalogo span{color:var(--gris);font-size:.85rem}
.producto-marco[data-salida="anuncio"] .salida-anuncio,.producto-marco[data-salida="catalogo"] .salida-catalogo{opacity:1;transform:none}
.producto-controles{display:flex;flex-direction:column;gap:16px}
.producto-nota{color:var(--gris);font-size:.9rem}
.demo-recorte{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.62fr) minmax(0,1fr);gap:22px;align-items:start}
.demo-recorte figure{margin:0;display:flex;flex-direction:column;gap:8px}
.demo-recorte video{width:100%;border-radius:14px;background:#000}
.demo-recorte .clip video{aspect-ratio:9/16;object-fit:cover;border-radius:20px;box-shadow:0 30px 60px -36px var(--acento)}
.demo-recorte .clip .recorte-etiqueta{background:linear-gradient(100deg,var(--acento-tinta),color-mix(in oklab,var(--acento-tinta) 74%,var(--acento)))}
.demo-recorte figcaption{font-size:.9rem;color:var(--gris)}
.recorte-cambios h3{font-size:1.05rem;margin-bottom:.4rem}
.recorte-cambios .boton{margin-top:14px}
.recorte-estado{margin-top:.6rem;color:var(--gris);font-size:.9rem;min-height:1.3em}
.ajustes{list-style:none;counter-reset:a;display:flex;flex-direction:column;gap:2px}
.ajustes li{position:relative;padding:.6rem 0 .6rem 2rem;border-bottom:1px solid var(--platino-2);font-size:.94rem;counter-increment:a}
.ajustes li::before{content:counter(a);position:absolute;left:0;top:.62rem;width:1.4rem;height:1.4rem;border-radius:50%;background:linear-gradient(135deg,var(--acento-tinta),var(--acento));color:#fff;display:grid;place-items:center;font-size:.72rem}
.video-error{padding:.6rem .8rem;border-radius:10px;background:var(--blanco);border:1px solid var(--platino-2);color:var(--grafito-2);font-size:.88rem}
.demo-secuencia{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:24px;align-items:start}
.secuencia-video{width:100%;border-radius:18px;background:#000;box-shadow:0 40px 80px -40px var(--acento)}
.momentos{list-style:none;display:flex;flex-direction:column;gap:6px}
.momentos button{width:100%;display:flex;gap:12px;align-items:flex-start;min-height:52px;padding:10px 14px;border-radius:12px;border:1px solid var(--platino-2);background:var(--blanco);font:560 .95rem "Archivo",sans-serif;text-align:left;cursor:pointer;transition:border-color .15s var(--ease-out),background-color .15s var(--ease-out)}
.momentos button span{display:flex;flex-direction:column;gap:2px}
.momentos button small{font-weight:400;font-size:.84rem;color:var(--gris)}
.momentos button b{font-variant-numeric:tabular-nums;color:var(--gris);font-weight:600;padding-top:1px}
.momentos button[aria-current="true"]{border-color:var(--acento);box-shadow:inset 3px 0 0 var(--acento)}
.momentos button[aria-current="true"] b{color:var(--acento-tinta)}
.secuencia-formato{margin-top:14px;font-size:.88rem;color:var(--gris)}
.demo-torre{position:relative;display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:0;border-radius:22px;overflow:hidden;background:#eeeee9;box-shadow:var(--sombra-alta);min-height:520px}
.torre-lienzo{width:100%;height:100%;min-height:520px}
.demo-torre .etiquetas{right:auto;width:66.6%}
.torre-controles{display:flex;flex-direction:column;gap:16px;padding:24px;background:var(--blanco)}
.torre-estado{color:var(--gris);font-size:.92rem}
.torre-ficha{position:relative;overflow:hidden;margin-top:auto;padding:16px 16px 14px;border-radius:14px;background:var(--mineral);border:1px solid var(--platino-2)}
.torre-ficha::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--acento),var(--acento-2))}
.ficha-tipo{font:640 .68rem/1 "Archivo",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--acento-tinta)}
.torre-ficha h3{font-size:1.25rem;margin:.45rem 0 .2rem}
.torre-ficha p{font-size:.9rem;color:var(--grafito-2)}
.torre-ficha .ficha-nota{margin-top:.5rem;font-size:.8rem;color:var(--gris)}
.demo-flujo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
.flujo-entrada{display:flex;flex-direction:column;gap:14px;padding:24px;border-radius:20px;background:var(--blanco);border:1px solid var(--platino-2);box-shadow:var(--sombra)}
.flujo-salida{display:flex;flex-direction:column;gap:10px}
.flujo-pasos{list-style:none;display:flex;flex-direction:column;gap:10px}
.flujo-pasos li{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border-radius:16px;background:var(--blanco);border:1px solid var(--platino-2);opacity:.55;transform:translateY(0);transition:opacity .3s var(--ease-out),border-color .3s var(--ease-out),transform .3s var(--ease-out)}
.flujo-pasos li b{font:640 .72rem/1 "Archivo",sans-serif;font-stretch:115%;letter-spacing:.12em;text-transform:uppercase;color:var(--gris)}
.flujo-pasos li span{font-size:1rem}
.flujo-pasos li.activo{opacity:1;border-color:var(--acento);box-shadow:0 14px 30px -20px var(--acento);transform:translateY(-2px)}
.flujo-pasos li.hecho{opacity:1}
.flujo-pasos .marca-clase{display:inline-flex;align-items:center;gap:.4em;padding:.2rem .6rem;border-radius:999px;background:color-mix(in oklab,var(--acento) 12%,var(--blanco));color:var(--acento-tinta);font-size:.86rem;font-weight:600;margin-right:.4rem}
.demo-flujo .flujo-decision{padding:14px 16px;border-radius:16px;font-size:.98rem}

/* ---------- explorar: por lo que el visitante puede hacer ---------- */
.explorar-grupos{max-width:var(--ancho);margin:0 auto;padding:0 var(--margen)}
.explorar-grupo{padding-top:clamp(40px,5vw,64px)}
.explorar-grupo>h2{font-size:clamp(1.4rem,2.2vw,1.9rem);margin-bottom:1rem}
.explorar{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.pieza{display:flex;flex-direction:column;gap:12px}
.pieza-medio{display:block;overflow:hidden;border-radius:18px;background:var(--niebla);border:1px solid var(--platino-2);transition:box-shadow .3s var(--ease-out),border-color .3s var(--ease-out)}
.pieza-medio img,.pieza-medio video{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .6s var(--ease-out)}
.pieza-vertical .pieza-medio img,.pieza-vertical .pieza-medio video{aspect-ratio:16/10;object-position:50% 40%}
.pieza-medio:hover{border-color:var(--acento);box-shadow:0 24px 50px -30px var(--acento)}
.pieza-medio:hover img,.pieza-medio:hover video{transform:scale(1.025)}
.pieza-texto{display:flex;flex-direction:column;align-items:flex-start;gap:.45rem}
.pieza h3{font-size:1.2rem}
.pieza-resultado{color:var(--grafito-2)}
.pieza-acciones{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;margin-top:.3rem}

/* ---------- ayuda ---------- */
.ayuda-proceso{scroll-margin-top:calc(var(--cab) + 20px)}

/* ---------- cotizar: el formulario manda; los paquetes ayudan a elegir sin ponerse delante ---------- */
.pagina-cotizar main{background:radial-gradient(60rem 30rem at 0% 0%,rgba(45,91,255,.08),transparent 70%),radial-gradient(50rem 30rem at 100% 10%,rgba(240,54,127,.07),transparent 70%)}
.cotizar-pagina{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);grid-template-areas:"cabeza form" "paquetes form";grid-template-rows:auto 1fr;gap:24px clamp(28px,5vw,80px);max-width:var(--ancho);margin:0 auto;padding:clamp(40px,6vw,88px) var(--margen) clamp(64px,8vw,110px)}
.cotizar-cabeza{grid-area:cabeza}
.cotizar-cabeza h1{font-size:clamp(2.4rem,5vw,4.4rem);letter-spacing:-.045em}
.cotizar-cabeza .bajada{margin-top:1rem;color:var(--grafito-2);font-size:1.1rem;max-width:30rem}
.cotizar-paquetes{grid-area:paquetes;align-self:start}
.cotizar-paquetes h2{font-size:1.2rem}.cotizar-paquetes>p{color:var(--gris);font-size:.94rem;margin-top:.3rem}
.formulario{grid-area:form;position:relative;overflow:hidden;display:flex;flex-direction:column;gap:1.05rem;padding:30px 28px 28px;border-radius:24px;background:var(--blanco);border:1px solid var(--platino-2);box-shadow:var(--sombra-alta);align-self:start;scroll-margin-top:calc(var(--cab) + 16px)}
.formulario::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--espectro);transition:opacity .3s var(--ease-out)}
.formulario.con-color::before{background:linear-gradient(90deg,var(--acento),var(--acento-2))}
.formulario.con-color{box-shadow:0 2px 6px rgba(21,24,30,.06),0 40px 80px -46px var(--acento)}
.formulario.con-color .boton-negro{color:#fff;background:var(--acento-tinta) linear-gradient(100deg,var(--acento-tinta),color-mix(in oklab,var(--acento-tinta) 74%,var(--acento)))}
.formulario.con-color .opciones label:has(input:checked){background:linear-gradient(var(--blanco),var(--blanco)) padding-box,linear-gradient(120deg,var(--acento),var(--acento-2)) border-box}
.formulario.con-color .opciones input{accent-color:var(--acento-tinta)}
.eleccion{padding:14px 16px;border-radius:14px;background:var(--mineral);border:1px solid var(--platino-2)}
.formulario.con-color .eleccion{background:color-mix(in oklab,var(--acento) 8%,var(--blanco));border-color:color-mix(in oklab,var(--acento) 28%,var(--platino-2))}
.eleccion-etiqueta{font:640 .68rem/1 "Archivo",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--gris)}
.eleccion-nombre{margin-top:.35rem;font-weight:660;font-size:1.1rem;color:var(--acento-tinta)}
.eleccion-resumen{margin-top:.15rem;font-size:.92rem;color:var(--grafito-2)}
.opcionales{border-top:1px solid var(--platino-2);padding-top:.8rem}
.opcionales summary{min-height:44px;display:flex;align-items:center;font-weight:600;cursor:pointer}
.opcionales[open]{display:flex;flex-direction:column;gap:1rem}
.opciones{display:flex;flex-wrap:wrap;gap:8px}
.opciones label{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;padding:0 .9rem;border-radius:999px;border:1px solid var(--platino);font-weight:500;font-size:.92rem;cursor:pointer;transition:border-color .15s var(--ease-out),background-color .15s var(--ease-out)}
.opciones label:has(input:checked){border-color:transparent;background:linear-gradient(var(--blanco),var(--blanco)) padding-box,var(--espectro) border-box;font-weight:600}
.opciones input{accent-color:var(--cobalto)}
.resultado{margin-top:.4rem;padding:1.2rem;border-radius:16px;border:1.5px solid transparent;background:linear-gradient(var(--mineral),var(--mineral)) padding-box,var(--espectro) border-box}
.resultado h2{font-size:1.3rem}
.resultado-texto{white-space:pre-wrap;font:400 .95rem/1.55 "Archivo",sans-serif;color:var(--grafito-2);margin:.8rem 0}
.resultado-acciones{display:flex;flex-wrap:wrap;gap:10px}
.resultado-estado{margin-top:.6rem;color:var(--grafito-2);font-size:.94rem}

@media (max-width:980px){
  .paquetes,.ofertas{grid-template-columns:1fr}.paquetes-seccion .paquete-1,.paquetes-seccion .paquete-2{margin-top:0}
  .centro-grupo,.demo-agenda,.demo-producto,.demo-secuencia,.demo-flujo,.demo-torre{grid-template-columns:1fr}
  .cotizar-pagina{grid-template-columns:1fr;grid-template-areas:"cabeza" "form" "paquetes"}
  .disposicion-lado .servicio-escena,.disposicion-torre .servicio-escena{grid-template-columns:1fr}
  .disposicion-lado .escena-texto,.disposicion-torre .escena-texto{position:relative;top:auto;padding-top:0}
  .disposicion-dispositivo .escena-texto,.disposicion-oscuro .escena-texto,.disposicion-comparar .escena-texto{grid-template-columns:1fr;padding-right:0}
  .disposicion-dispositivo .escena-texto>*,.disposicion-oscuro .escena-texto>*,.disposicion-comparar .escena-texto>*{grid-column:1!important}
  .ficha-pasos{grid-template-columns:1fr 1fr}
  .proceso{grid-template-columns:1fr 1fr}
  .demo-recorte{grid-template-columns:1fr 1fr}.demo-recorte .fuente{grid-column:1 / -1}
  .demo-torre .etiquetas{width:100%;height:520px}
}
@media (max-width:640px){
  .proceso,.ficha-pasos{grid-template-columns:1fr}
  .demo-recorte{grid-template-columns:1fr 1.15fr}.demo-recorte .recorte-cambios{grid-column:1 / -1}
  .variante video{border-width:4px;border-radius:18px}
  .paquete-cols{grid-template-columns:1fr}
  .servicio-escena{padding-top:18px;gap:14px}
  .escena-texto h1{font-size:clamp(1.8rem,7.6vw,2.3rem)}
  .escena-texto .bajada{font-size:1rem;margin-top:.5rem}
  .escena-texto .acciones{margin-top:.8rem}
  .orbe-escena{display:none}
  .demo-torre,.torre-lienzo{min-height:360px}.demo-torre .etiquetas{height:360px}
  .formulario{padding:24px 18px 20px}
}
/* ---------- profundidad: tarjetas que se inclinan con el puntero y reflejan la luz ---------- */
[data-inclinar]{transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s var(--ease-out),box-shadow .5s var(--ease-out);will-change:transform}
[data-inclinar]:hover{transition-duration:.15s}
[data-inclinar]::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s var(--ease-out);background:radial-gradient(28rem 20rem at var(--lx,50%) var(--ly,0%),rgba(255,255,255,.28),transparent 60%)}
[data-inclinar]:hover::after{opacity:1}

/* ---------- cajón de la mesa: una muestra del resultado ---------- */
.info-muestra{display:block;border-radius:12px;overflow:hidden;border:1px solid var(--platino-2);box-shadow:0 14px 30px -20px var(--acento)}
.info-muestra img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .5s var(--ease-out)}
.info-muestra:hover img{transform:scale(1.04)}

/* ---------- variedad: cinta de entregables en movimiento ---------- */
.cinta{display:flex;flex-direction:column;gap:10px;overflow:hidden;padding:6px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.cinta-pista{display:flex;gap:10px;width:max-content;animation:cinta 70s linear infinite}
.cinta-inversa .cinta-pista{animation-direction:reverse;animation-duration:80s}
.cinta:hover .cinta-pista,.cinta:focus-within .cinta-pista{animation-play-state:paused}
@keyframes cinta{to{transform:translateX(-50%)}}
.cinta-chip{flex:none;display:inline-flex;align-items:center;gap:.55em;min-height:42px;padding:0 1.05rem;border-radius:999px;background:rgba(255,255,255,.86);border:1px solid color-mix(in oklab,var(--acento) 26%,var(--platino-2));color:var(--grafito);font-weight:580;font-size:.92rem;text-decoration:none;box-shadow:0 10px 24px -18px var(--acento);transition:transform .2s var(--ease-out),border-color .2s var(--ease-out)}
.cinta-chip::before{content:"";width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,var(--acento),var(--acento-2))}
.cinta-chip:hover{border-color:var(--acento);transform:translateY(-2px)}
.medida{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:24px 40px;align-items:center;max-width:calc(var(--ancho) + 2 * var(--margen));margin:clamp(56px,7vw,96px) auto 0;padding:0 var(--margen)}
.medida-texto h2{font-size:clamp(1.8rem,3vw,2.6rem)}
.medida-texto p{margin:.7rem 0 1.2rem;color:var(--grafito-2)}

/* ---------- Servicios: portada viva con un punto por línea ---------- */
.srv-portada{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column-reverse;min-height:calc(100svh - var(--cab));padding-bottom:clamp(24px,3vw,48px);background:#101217;color:#F2F3F5}
.srv-escena{position:relative;aspect-ratio:16/8.2;margin-top:clamp(-210px,-12vw,-48px);overflow:hidden;--px:0;--py:0;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 30%);mask-image:linear-gradient(180deg,transparent 0,#000 30%)}
/* la escena es más ancha que 16:9, así que la capa cubre por ancho (corrida a la izquierda: el perfume no sale de cuadro en el acercamiento): video y puntos comparten la misma caja y los puntos quedan anclados a sus objetos */
.srv-capa{position:absolute;left:48.5%;top:50%;width:106%;aspect-ratio:16/9;transform:translate(-50%,-50%) translate3d(calc(var(--px) * -24px),calc(var(--py) * -16px),0);transition:transform .8s var(--ease-out)}
.srv-fondo{display:block;width:100%;height:100%;object-fit:cover}
.srv-escena::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(16,18,23,0) 80%,rgba(16,18,23,.6) 100%)}
/* --k va de 0 (último cuadro, el póster) a 1 (primer cuadro): la cámara se acerca un 6.8 % y se corre; los puntos la siguen */
.srv-puntos{position:absolute;inset:0;z-index:1;transform-origin:0 0;transform:translate(calc(var(--k,0) * 5.3%),calc(var(--k,0) * -1.7%)) scale(calc(1 + var(--k,0) * .068))}
.punto{position:absolute;left:var(--x);top:var(--y);width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;background:radial-gradient(circle,#fff 0 3px,var(--acento) 4px 6px,transparent 7px);text-decoration:none;color:#fff}
.punto::before{content:"";position:absolute;inset:-6px;border-radius:50%;border:1.5px solid var(--acento-2);animation:punto 2.4s var(--ease-out) infinite}
@keyframes punto{from{transform:scale(.6);opacity:1}to{transform:scale(1.9);opacity:0}}
.punto span{position:absolute;left:50%;bottom:calc(100% + 10px);translate:-50% 0;white-space:nowrap;padding:.4rem .7rem;border-radius:999px;background:rgba(14,16,20,.9);border:1px solid color-mix(in oklab,var(--acento-2) 50%,transparent);font:620 .8rem/1 "Archivo",sans-serif;opacity:.9;transition:opacity .2s var(--ease-out),transform .2s var(--ease-out)}
.punto:hover span,.punto:focus-visible span{opacity:1;transform:translateY(-3px);background:var(--acento-tinta)}
.punto-der span{left:auto;right:calc(100% + 10px);bottom:auto;top:50%;translate:0 -50%}

.srv-texto{position:relative;z-index:3;width:100%;max-width:calc(var(--ancho) + 2 * var(--margen));margin:0 auto;padding:clamp(36px,6vw,72px) var(--margen) 0}
.srv-texto h1{font-size:clamp(2.3rem,4.4vw,4.1rem);letter-spacing:-.04em;max-width:19ch;text-wrap:balance}
.srv-texto .bajada{margin-top:.9rem;max-width:34rem;color:#C9CCD0;font-size:1.1rem}
.srv-texto .acciones{margin-top:1.4rem}
.srv-texto .servicio-nombre{color:#fff}.srv-texto .servicio-nombre::before{background:var(--espectro)}
.pagina-servicios>.cinta,.pagina-servicios main>.cinta{margin-top:clamp(20px,2.5vw,36px);position:relative;z-index:3}
/* «Arma tu proyecto» */
.arma{position:relative;padding-bottom:clamp(36px,5vw,64px)}
.arma::before{content:"";position:absolute;z-index:-1;inset:clamp(40px,6vw,88px) max(6px,calc(var(--margen) - 36px)) 0;border-radius:36px;background:linear-gradient(150deg,rgba(255,255,255,.78),rgba(255,255,255,.5));-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);border:1px solid rgba(255,255,255,.9);box-shadow:0 50px 100px -60px rgba(45,91,255,.45),0 30px 60px -50px rgba(115,70,255,.4)}
.arma-cuerpo{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:28px;margin-top:2rem;align-items:start}
.arma-grupo{border:0;margin:0 0 20px;padding:0}
.arma-grupo legend{margin-bottom:.6rem;font:640 .72rem/1 "Archivo",sans-serif;font-stretch:115%;letter-spacing:.12em;text-transform:uppercase;color:var(--gris)}
.arma-chips{display:flex;flex-wrap:wrap;gap:8px}
.necesidad{position:relative;display:inline-flex}
.necesidad input{position:absolute;opacity:0;width:1px;height:1px}
.necesidad span{display:inline-flex;align-items:center;gap:.5em;min-height:46px;padding:0 1.05rem;border-radius:999px;background:rgba(255,255,255,.88);border:1px solid var(--platino);font-weight:560;cursor:pointer;transition:border-color .15s var(--ease-out),background-color .15s var(--ease-out),box-shadow .15s var(--ease-out),transform .12s var(--ease-out)}
.necesidad span::before{content:"+";display:grid;place-items:center;width:1.2rem;height:1.2rem;border-radius:50%;background:color-mix(in oklab,var(--acento) 14%,#fff);color:var(--acento-tinta);font-weight:700;font-size:.9rem;line-height:1}
.necesidad:hover span{border-color:var(--acento)}
.necesidad input:checked+span{border-color:var(--acento);background:linear-gradient(120deg,color-mix(in oklab,var(--acento) 16%,#fff),#fff);color:var(--acento-tinta);box-shadow:0 12px 26px -16px var(--acento)}
.necesidad input:checked+span::before{content:"✓";background:linear-gradient(135deg,var(--acento-tinta),var(--acento));color:#fff}
.necesidad input:focus-visible+span{outline:2px solid var(--foco);outline-offset:3px}
.necesidad span:active{transform:scale(.97)}
.arma-resumen{position:sticky;top:calc(var(--cab) + 20px);display:flex;flex-direction:column;gap:12px;padding:24px;border-radius:22px;background:var(--noche);color:#F2F3F5;box-shadow:var(--sombra-alta);overflow:hidden;isolation:isolate}
.arma-resumen::before{content:"";position:absolute;z-index:-1;inset:-30% -30% auto auto;width:260px;aspect-ratio:1;border-radius:50%;background:var(--espectro-conico);filter:blur(60px);opacity:.35}
.arma-resumen .eleccion-etiqueta{color:var(--claro-noche)}
.arma-vacio{color:var(--claro-noche)}
.arma-lista{list-style:none;display:flex;flex-direction:column;gap:8px}
.arma-lista li{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.06);border-left:3px solid var(--acento);animation:info-entra .25s var(--ease-out)}
.arma-lista b{color:#fff}.arma-lista span{font-size:.86rem;color:var(--claro-noche)}
.arma-resumen .boton-negro{background:#fff;color:var(--grafito)}
.arma-resumen .volver{color:var(--claro-noche);justify-content:flex-start;padding:0}
/* catálogo: cuatro líneas con cartas en 3D */
.linea{padding-top:clamp(40px,5vw,64px)}
.linea-cabeza{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:6px 16px;margin-bottom:18px}
.linea-cabeza .orbe{position:relative;width:46px;grid-row:1 / span 2}
.linea-cabeza h3{font-size:clamp(1.5rem,2.4vw,2rem)}
.linea-cabeza p{grid-column:2;color:var(--gris)}
.linea-cabeza .enlace{grid-column:3;grid-row:1 / span 2}
.cartas{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}
.carta{position:relative;display:flex;flex-direction:column;border-radius:22px;overflow:hidden;background:rgba(255,255,255,.9);border:1px solid color-mix(in oklab,var(--acento) 22%,var(--platino-2));box-shadow:0 34px 64px -42px var(--acento),var(--sombra);text-decoration:none;color:inherit}
.carta-medio{display:block;overflow:hidden;background:var(--noche)}
.carta-medio img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .7s var(--ease-out)}
.carta:hover .carta-medio img{transform:scale(1.05)}
.carta-texto{display:flex;flex-direction:column;gap:.5rem;padding:18px 20px 20px;flex:1}
.carta-titulo{font-weight:680;font-stretch:112%;font-size:1.22rem;letter-spacing:-.015em}
.carta-frase{color:var(--grafito-2);font-size:.96rem}
.carta-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:.2rem}
.carta-chips span{padding:.22rem .55rem;border-radius:999px;background:color-mix(in oklab,var(--acento) 10%,#fff);color:var(--acento-tinta);font-size:.76rem;font-weight:600}
.carta-ir{margin-top:auto;padding-top:.6rem;display:inline-flex;align-items:center;gap:.4em;color:var(--acento-tinta);font-weight:640;font-size:.92rem}
.linea-1 .cartas{grid-template-columns:1fr}
.linea-1 .carta{flex-direction:row}.linea-1 .carta-medio{flex:0 0 58%}.linea-1 .carta-medio img{height:100%;max-height:380px;aspect-ratio:16/9}
.linea-1 .carta-texto{justify-content:center;padding:28px 30px}

/* ---------- página de servicio: navegación entre los nueve, «Así se ve», «Combínalo con», anterior y siguiente ---------- */
.srv-nav{position:sticky;top:var(--cab);z-index:40;background:rgba(247,247,244,.98);border-bottom:1px solid var(--platino-2)}
.srv-nav ul{display:flex;gap:4px;list-style:none;overflow-x:auto;scrollbar-width:none;max-width:calc(var(--ancho) + 2 * var(--margen));margin:0 auto;padding:8px var(--margen)}
.srv-nav ul::-webkit-scrollbar{display:none}
.srv-nav a{display:inline-flex;align-items:center;gap:.45em;min-height:38px;padding:0 .85rem;border-radius:999px;white-space:nowrap;font:600 .84rem/1 "Archivo",sans-serif;color:var(--grafito-2);text-decoration:none;transition:background-color .15s var(--ease-out),color .15s var(--ease-out)}
.srv-nav a::before{content:"";width:7px;height:7px;border-radius:50%;background:linear-gradient(135deg,var(--acento),var(--acento-2))}
.srv-nav a:hover{background:color-mix(in oklab,var(--acento) 10%,#fff)}
.srv-nav a[aria-current="page"]{background:var(--acento-tinta);color:#fff}.srv-nav a[aria-current="page"]::before{background:#fff}
.asi-se-ve{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,64px);align-items:center;margin-top:clamp(40px,5vw,72px);padding:clamp(48px,6vw,96px) max(var(--margen),calc((100vw - var(--ancho)) / 2 + var(--margen)));background:var(--noche);color:#F2F3F5}
.asi-se-ve::before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(40% 70% at 30% 50%,color-mix(in oklab,var(--acento) 32%,transparent),transparent 70%),radial-gradient(30% 50% at 90% 10%,color-mix(in oklab,var(--acento-2) 24%,transparent),transparent 70%)}
.asi-medio{position:relative;margin:0;border-radius:24px;overflow:hidden;box-shadow:0 60px 110px -50px var(--acento),0 0 0 1px rgba(255,255,255,.1)}
.asi-medio img{width:100%;max-height:640px;object-fit:cover}
.asi-texto{display:flex;flex-direction:column;align-items:flex-start;gap:.9rem}
.asi-texto h2{font-size:clamp(1.7rem,3vw,2.6rem)}
.asi-texto p{color:#C9CCD0;max-width:30rem}
.asi-texto .nota{background:rgba(255,255,255,.1);color:#fff}
.combina{padding-bottom:0}
.combina-cartas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:1.4rem}
.combina-carta{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);border-radius:20px;overflow:hidden;background:rgba(255,255,255,.9);border:1px solid color-mix(in oklab,var(--acento) 24%,var(--platino-2));box-shadow:0 26px 54px -40px var(--acento);text-decoration:none;color:inherit}
.combina-carta img{width:100%;height:100%;min-height:150px;object-fit:cover;object-position:left center}
.combina-carta span{display:flex;flex-direction:column;justify-content:center;gap:.35rem;padding:18px 20px;color:var(--grafito-2)}
.combina-carta b{font-size:1.12rem;color:var(--acento-tinta)}
.vecinos{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:var(--ancho);margin:0 auto;padding:clamp(40px,5vw,64px) var(--margen) clamp(64px,8vw,110px)}
.vecino{display:flex;flex-direction:column;gap:.3rem;padding:20px 22px;border-radius:18px;background:linear-gradient(135deg,color-mix(in oklab,var(--acento) 12%,#fff),rgba(255,255,255,.9));border:1px solid color-mix(in oklab,var(--acento) 26%,var(--platino-2));text-decoration:none;color:var(--grafito-2);transition:transform .2s var(--ease-out),box-shadow .2s var(--ease-out)}
.vecino:hover{transform:translateY(-3px);box-shadow:0 20px 40px -26px var(--acento)}
.vecino b{color:var(--grafito);font-size:1.15rem}
.vecino-dir{font:640 .7rem/1 "Archivo",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--acento-tinta)}
.vecino-sig{align-items:flex-end;text-align:right}

/* ---------- Explorar: visor propio de cada pieza ---------- */
.visor{padding:0;border:0;border-radius:24px;width:min(1120px,94vw);max-height:92vh;background:var(--noche);color:#F2F3F5;box-shadow:0 60px 120px -40px rgba(0,0,0,.65);overflow:hidden}
.visor::backdrop{background:rgba(10,12,16,.62);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.visor[open]{animation:visor-entra .28s var(--ease-out)}
@keyframes visor-entra{from{opacity:0;transform:translateY(12px) scale(.98)}}
.visor-caja{position:relative;display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr)}
.visor-medio img,.visor-medio video{display:block;width:100%;height:100%;max-height:84vh;object-fit:cover;background:#000}
.visor-texto{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:.9rem;padding:32px 30px}
.visor-texto h2{font-size:clamp(1.5rem,2.4vw,2.1rem)}
.visor-texto p{color:#C9CCD0}
.visor-texto .nota{background:rgba(255,255,255,.1);color:#fff}
.visor-texto .boton-linea{background:transparent;border-color:rgba(255,255,255,.32);color:#fff}
.visor-cerrar{position:absolute;top:12px;right:12px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:0;background:rgba(13,15,20,.6);color:#fff;font-size:1.3rem;cursor:pointer;transform:rotate(45deg)}
.visor-cerrar:hover{background:rgba(13,15,20,.85)}
.eleccion-extras{margin-top:.35rem;font-size:.9rem;font-weight:600;color:var(--acento-tinta)}

@media (max-width:980px){
  .arma-cuerpo,.medida,.asi-se-ve,.visor-caja{grid-template-columns:1fr}
  .arma-resumen{position:relative;top:auto}
  .linea-1 .carta{flex-direction:column}.linea-1 .carta-medio{flex:none}
  .combina-cartas{grid-template-columns:1fr}
}
@media (max-width:760px){
  .srv-escena{aspect-ratio:16/9;margin-top:-8px}
  .srv-puntos{display:none}
  .srv-texto{padding-top:28px}
  .linea-cabeza{grid-template-columns:auto 1fr}.linea-cabeza .enlace{grid-column:1 / -1;grid-row:auto}
  .vecinos{grid-template-columns:1fr}.vecino-sig{align-items:flex-start;text-align:left}
  .srv-nav{top:var(--cab)}
}
@media (max-width:359px){.srv-nav{top:0}}
@media (prefers-reduced-motion:reduce){
  .cinta-pista{animation:none!important;flex-wrap:wrap;width:auto;justify-content:center}
  .cinta-chip[aria-hidden]{display:none}
  .punto::before{animation:none!important;opacity:0}
  [data-inclinar]{transform:none!important}
}
/* ================================================================ 4 nov · ronda «ejemplos de todo» */

/* ---------- cabecera con profundidad: vidrio, isotipo con halo y navegación en relieve ---------- */
.cabecera{background:linear-gradient(180deg,#fff,#f4f4f0);box-shadow:0 1px 0 rgba(255,255,255,.95) inset,0 16px 36px -28px rgba(21,24,30,.45)}
.cabecera::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(28rem 7rem at 8% 0,rgba(45,91,255,.10),transparent 70%),radial-gradient(30rem 7rem at 92% 0,rgba(115,70,255,.09),transparent 70%)}
.cabecera>*{position:relative}
.cabecera .marca .isotipo{width:44px;height:44px;filter:drop-shadow(0 6px 12px rgba(90,47,224,.28)) drop-shadow(0 2px 3px rgba(21,24,30,.25));transition:transform .5s var(--ease-out)}
.cabecera .marca:hover .isotipo{transform:rotate(-8deg) scale(1.04)}
.cabecera .marca{position:relative;padding-right:14px}
.cabecera .marca::after{content:"";position:absolute;right:0;top:20%;bottom:20%;width:1px;background:linear-gradient(180deg,transparent,var(--platino),transparent)}
.cabecera .marca-nombre{background:linear-gradient(100deg,var(--grafito) 30%,#3d2fb0 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.nav ul{background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(242,242,238,.85));border-color:rgba(21,24,30,.08);box-shadow:0 1px 0 #fff inset,0 10px 24px -16px rgba(21,24,30,.35),0 0 0 1px rgba(255,255,255,.6)}
.nav a{position:relative}
.nav a:not(.nav-cotizar):not([aria-current="page"]):hover{background:linear-gradient(180deg,#fff,var(--niebla));box-shadow:0 1px 0 #fff inset,0 4px 10px -6px rgba(21,24,30,.3)}
.nav a[aria-current="page"]:not(.nav-cotizar){background:linear-gradient(180deg,#2a2e36,var(--grafito));box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 8px 16px -10px rgba(21,24,30,.6)}
.nav a[aria-current="page"]::after{content:"";position:absolute;left:30%;right:30%;bottom:4px;height:2px;border-radius:2px;background:var(--espectro)}

/* ---------- portada de Inicio: escena llena, sin vacío ---------- */
.escenario::after{content:"";position:absolute;inset:auto 0 0 0;height:90px;z-index:2;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(13,15,20,.35))}

/* ---------- «Todo lo que hacemos»: una tarjeta enmarcada por servicio ---------- */
.srv-tarjetas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:2rem}
.srv-tarjeta{position:relative;display:flex;flex-direction:column;border-radius:22px;overflow:hidden;background:rgba(255,255,255,.92);border:1px solid color-mix(in oklab,var(--acento) 22%,var(--platino-2));box-shadow:0 30px 60px -44px var(--acento),0 2px 6px -3px rgba(21,24,30,.12);text-decoration:none;color:inherit}
.srv-tarjeta::before{content:"";position:absolute;z-index:1;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--acento),var(--acento-2))}
.srv-tarjeta-medio{display:block;overflow:hidden;background:var(--noche)}
.srv-tarjeta-medio img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .7s var(--ease-out)}
.srv-tarjeta:hover .srv-tarjeta-medio img{transform:scale(1.05)}
.srv-tarjeta-texto{display:flex;flex-direction:column;gap:.35rem;padding:16px 18px 18px;flex:1}
.srv-tarjeta-linea{font:640 .68rem/1 "Archivo",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--acento-tinta)}
.srv-tarjeta b{font-size:1.18rem;font-weight:680;font-stretch:110%;letter-spacing:-.01em}
.srv-tarjeta-texto>span:not(.srv-tarjeta-linea):not(.carta-ir){color:var(--grafito-2);font-size:.95rem}
.ayuda-breve .preguntas-lista{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px;border-top:0}
.ayuda-breve .pregunta{border-top:1px solid var(--platino-2);border-bottom:0}

/* ---------- a petición ---------- */
.peticion{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px 28px;max-width:var(--ancho);margin:clamp(48px,6vw,80px) auto 0;padding:28px clamp(22px,3vw,40px);border-radius:28px;background:linear-gradient(120deg,#12151c,#1d2130);color:#F2F3F5;box-shadow:0 40px 80px -50px rgba(90,47,224,.6)}
.peticion::before{content:"";position:absolute;z-index:-1;inset:-40% -10% auto auto;width:360px;aspect-ratio:1;border-radius:50%;background:var(--espectro-conico);filter:blur(70px);opacity:.35}
.peticion h2{font-size:clamp(1.3rem,2.2vw,1.8rem)}
.peticion p{margin-top:.4rem;color:var(--claro-noche);max-width:44rem}
.peticion .boton-negro{background:#fff;color:var(--grafito)}
.peticion-orbe{width:56px;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.85),rgba(255,255,255,0) 40%),var(--espectro-conico);box-shadow:0 10px 30px -8px rgba(115,70,255,.7)}
.arma-otro .campo span{font-size:.92rem;color:var(--grafito-2)}
.arma-otro textarea{width:100%;margin-top:.45rem;padding:12px 14px;border-radius:14px;border:1px solid var(--platino);background:rgba(255,255,255,.9);font:inherit;resize:vertical}
.arma-otro textarea:focus-visible{outline:2px solid var(--foco);outline-offset:2px}
.arma-lista li.arma-peticion{border-left-color:#D35CFF}

/* ---------- Ayuda ---------- */
.ayuda-portada{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,64px);align-items:end;padding:clamp(56px,7vw,104px) max(var(--margen),calc((100vw - var(--ancho)) / 2 + var(--margen))) clamp(48px,5vw,72px);background:var(--noche);color:#F2F3F5}
.ayuda-portada::before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(40% 80% at 0% 0%,rgba(45,91,255,.35),transparent 70%),radial-gradient(35% 70% at 100% 100%,rgba(211,92,255,.28),transparent 70%),radial-gradient(30% 60% at 60% 10%,rgba(16,163,127,.18),transparent 70%)}
.ayuda-portada::after{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;opacity:.25;background:radial-gradient(circle at 1px 1px,rgba(255,255,255,.35) 1px,transparent 1.4px) 0 0/26px 26px;-webkit-mask-image:linear-gradient(180deg,#000,transparent);mask-image:linear-gradient(180deg,#000,transparent)}
.ayuda-portada h1{font-size:clamp(2.6rem,5.4vw,5rem);letter-spacing:-.045em}
.ayuda-portada .bajada{margin-top:1rem;max-width:36rem;font-size:1.15rem;color:#C9CCD0}
.ayuda-portada .servicio-nombre{color:#fff}
.ayuda-portada-datos{display:flex;flex-wrap:wrap;gap:10px;margin-top:1.6rem}
.ayuda-portada-datos span{padding:.5rem .9rem;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);font-size:.9rem;color:#E8EAED}
.ayuda-portada-datos b{font-weight:700;color:#fff}
.ayuda-portada-pasos{list-style:none;display:flex;flex-direction:column;gap:10px;padding:20px;border-radius:22px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.ayuda-portada-pasos li{display:flex;align-items:center;gap:12px;font-weight:600}
.ayuda-portada-pasos span{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,var(--p1,#2D5BFF),var(--p2,#19C3F0));color:#fff;font-size:.9rem}
.ayuda-portada-pasos li:nth-child(2){--p1:#FF5A47;--p2:#F0367F}.ayuda-portada-pasos li:nth-child(3){--p1:#10A37F;--p2:#A6E35B}.ayuda-portada-pasos li:nth-child(4){--p1:#7346FF;--p2:#D35CFF}
.ayuda-cuerpo{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:clamp(24px,4vw,56px);max-width:calc(var(--ancho) + 2 * var(--margen));margin:0 auto;padding:clamp(40px,5vw,72px) var(--margen) 0;align-items:start}
.ayuda-indice{position:sticky;top:calc(var(--cab) + 20px);padding:18px;border-radius:22px;background:rgba(255,255,255,.8);border:1px solid var(--platino-2);box-shadow:0 24px 50px -36px rgba(21,24,30,.4);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.ayuda-indice ol{list-style:none;display:flex;flex-direction:column;gap:2px;margin-top:.6rem}
.ayuda-indice a{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;min-height:42px;padding:6px 10px;border-radius:12px;text-decoration:none;font-weight:580;font-size:.92rem;color:var(--grafito-2);transition:background-color .15s var(--ease-out)}
.ayuda-indice a:hover,.ayuda-indice a[aria-current="true"]{background:color-mix(in oklab,var(--acento) 10%,#fff);color:var(--grafito)}
.indice-num{font:700 .74rem/1 "Archivo",sans-serif;font-variant-numeric:tabular-nums;color:var(--acento-tinta)}
.indice-n{min-width:24px;padding:.2rem .45rem;border-radius:999px;background:var(--niebla);font-size:.74rem;text-align:center;color:var(--gris)}
.ayuda-grupos{display:flex;flex-direction:column;gap:18px}
.ayuda-grupo{scroll-margin-top:calc(var(--cab) + 20px);padding:8px 26px 10px;border-radius:24px;background:rgba(255,255,255,.88);border:1px solid color-mix(in oklab,var(--acento) 20%,var(--platino-2));box-shadow:0 30px 60px -48px var(--acento);border-top:3px solid var(--acento)}
.ayuda-grupo:nth-child(4n+1),.ayuda-indice li:nth-child(4n+1){--acento:#2D5BFF;--acento-2:#19C3F0;--acento-tinta:#1E40C8}
.ayuda-grupo:nth-child(4n+2),.ayuda-indice li:nth-child(4n+2){--acento:#FF5A47;--acento-2:#F0367F;--acento-tinta:#C42640}
.ayuda-grupo:nth-child(4n+3),.ayuda-indice li:nth-child(4n+3){--acento:#10A37F;--acento-2:#A6E35B;--acento-tinta:#0B7A5E}
.ayuda-grupo:nth-child(4n+4),.ayuda-indice li:nth-child(4n+4){--acento:#7346FF;--acento-2:#D35CFF;--acento-tinta:#5A2FE0}
.ayuda-grupo-cabeza{display:flex;align-items:center;gap:14px;padding:18px 0 10px}
.ayuda-grupo-cabeza .indice-num{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--acento),var(--acento-2));color:#fff;font-size:.85rem}
.ayuda-grupo-cabeza h2{font-size:clamp(1.3rem,2vw,1.65rem);flex:1}
.ayuda-grupo-n{font-size:.84rem;color:var(--gris)}
.ayuda-grupo .preguntas-lista{margin-top:0;border-top:0}
.ayuda-grupo .pregunta:last-child{border-bottom:0}
.ayuda-grupo .pregunta summary{font-size:1.02rem}
.ayuda-grupo .pregunta[open] summary{color:var(--acento-tinta)}

/* ---------- inmobiliario: el mismo cuarto ---------- */
.asi-cuarto{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:start}
.cuarto-vista{position:relative;aspect-ratio:16/9;border-radius:24px;overflow:hidden;background:#111;box-shadow:0 60px 110px -50px var(--acento),0 0 0 1px rgba(255,255,255,.1)}
.cuarto-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s var(--ease-out)}
.cuarto-img.activa{opacity:1}
.cuarto-antes{position:absolute;inset:0;z-index:2;clip-path:inset(0 calc(100% - var(--corte,50%)) 0 0)}
.cuarto-antes img{width:100%;height:100%;object-fit:cover}
.cuarto-antes::after{content:"";position:absolute;top:0;bottom:0;left:var(--corte,50%);width:3px;margin-left:-1.5px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.2),0 0 18px rgba(255,255,255,.6)}
.comparando .cuarto-vista{cursor:ew-resize;touch-action:pan-y}
.cuarto-corte{position:absolute;z-index:3;left:50%;bottom:14px;width:min(320px,60%);translate:-50% 0;accent-color:#fff}
.cuarto-controles{display:flex;flex-direction:column;gap:12px;width:100%}
.cuarto-controles .control-nombre{color:var(--claro-noche)}
.asi-cuarto .chips button{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16);color:#F2F3F5}
.asi-cuarto .chips button[aria-pressed="true"]{background:#fff;color:var(--grafito);border-color:#fff}
.cuarto-comparar{display:flex;align-items:center;gap:.6rem;min-height:44px;font-weight:600;cursor:pointer}
.cuarto-comparar input{width:20px;height:20px;accent-color:var(--acento-2)}
.cuarto-ayuda{font-size:.86rem;color:var(--claro-noche)}
.cuarto-recorridos{grid-column:1 / -1}
.cuarto-recorridos-cabeza{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}
.cuarto-recorridos h3{font-size:1.25rem}
.recorridos{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.recorrido{margin:0;display:flex;flex-direction:column;gap:8px}
.recorrido video{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:18px;background:#000;box-shadow:0 30px 60px -40px var(--acento)}
.recorrido figcaption{font-size:.9rem;color:var(--claro-noche)}

/* ---------- producto: galería por categoría ---------- */
.asi-galeria{grid-template-columns:1fr;align-items:start}
.asi-galeria .asi-texto{max-width:44rem}
.galeria{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.galeria-foto{position:relative;margin:0;border-radius:18px;overflow:hidden;background:#000;box-shadow:0 30px 60px -44px var(--acento)}
.galeria-foto:first-child{grid-row:span 2}
.galeria-foto:first-child img{aspect-ratio:auto;height:100%}
.galeria-foto img{width:100%;height:100%;aspect-ratio:4/5;object-fit:cover;transition:transform .7s var(--ease-out)}
.galeria-foto:hover img{transform:scale(1.04)}
.galeria-foto figcaption{position:absolute;left:12px;bottom:12px;padding:.35rem .7rem;border-radius:999px;background:rgba(13,15,20,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font-size:.82rem;font-weight:600}
.galeria-video h3{font-size:1.25rem;margin-bottom:14px}
.galeria-video .demo-reels{grid-template-columns:repeat(2,minmax(0,280px))}

/* ---------- reels en pantalla de teléfono ---------- */
.demo-reels{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.reel{margin:0;display:flex;flex-direction:column;gap:8px;cursor:pointer;transition:transform .35s var(--ease-out)}
.reel-pantalla{position:relative;padding:7px;border-radius:30px;background:linear-gradient(160deg,#30343d,#0e1015);box-shadow:0 0 0 1px rgba(255,255,255,.08) inset,0 34px 60px -36px var(--acento),0 10px 20px -12px rgba(0,0,0,.5)}
.reel-pantalla::before{content:"";position:absolute;z-index:2;top:14px;left:50%;width:56px;height:14px;margin-left:-28px;border-radius:10px;background:#0b0c10}
.reel video{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:24px;background:#000}
.reel figcaption{font-size:.88rem;font-weight:600;text-align:center;color:var(--gris)}
.reel:hover{transform:translateY(-4px)}
.reel:focus-visible{outline:2px solid var(--foco);outline-offset:4px;border-radius:30px}
.reel.ampliado{transform:scale(1.06);z-index:2}
.disposicion-comparar .demo-reels .reel figcaption{color:var(--grafito-2)}

/* ---------- cine: comercial vertical ---------- */
.demo-secuencia-vertical{grid-template-columns:minmax(0,340px) minmax(0,1fr)}
.demo-secuencia-vertical .secuencia-video{aspect-ratio:4/5;object-fit:cover;max-height:620px}

/* ---------- videojuegos: segundo juego ---------- */
.asi-juego{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.asi-medio-demo{min-width:0}
.asi-juego .juego-marcador{color:#E8EAED}
.demo-atrapa .juego-lienzo{cursor:none;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 40px 80px -40px #FFB238}

@media (max-width:980px){
  .srv-tarjetas{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ayuda-breve .preguntas-lista{grid-template-columns:1fr}
  .ayuda-portada,.ayuda-cuerpo,.asi-cuarto,.asi-juego{grid-template-columns:1fr}
  .ayuda-indice{position:relative;top:auto}
  .ayuda-indice ol{flex-direction:row;flex-wrap:wrap}
  .galeria{grid-template-columns:repeat(2,minmax(0,1fr))}
  .demo-reels{grid-template-columns:repeat(2,minmax(0,1fr))}
  .peticion{grid-template-columns:auto 1fr}.peticion .boton{grid-column:1 / -1;justify-self:start}
  .demo-secuencia-vertical{grid-template-columns:1fr}.demo-secuencia-vertical .secuencia-video{max-height:560px;width:auto;max-width:100%;margin:0 auto}
}
@media (max-width:760px){
  .srv-tarjetas{grid-template-columns:1fr}
  .recorridos{grid-template-columns:1fr}
  .galeria-foto:first-child{grid-row:auto;grid-column:span 2}.galeria-foto:first-child img{aspect-ratio:4/5}
  .ayuda-grupo{padding:4px 18px 8px}
  .ayuda-grupo-n{display:none}
  .peticion{grid-template-columns:1fr;text-align:left}.peticion-orbe{width:44px}
  .cabecera .marca::after{display:none}
  .cabecera .marca .isotipo{width:40px;height:40px}
}
@media (prefers-reduced-motion:reduce){
  .srv-escena{transform:none!important}
  .reel,.reel.ampliado{transform:none!important}
}
/* ================================================================ 4 nov · noche */

/* ---------- Inicio: en escritorio la información de la estación es un panel lateral; la escena conserva su alto ---------- */
@media (min-width:1081px){
  .infos{display:block;left:auto;right:max(var(--margen),calc((100vw - var(--ancho)) / 2));bottom:calc(100% + 18px);width:min(440px,36vw);max-height:calc(var(--alto-escena) - 36px);overflow:auto;overscroll-behavior:contain;
    border-radius:24px;border:1px solid var(--platino-2);background:rgba(255,255,255,.98);box-shadow:0 40px 80px -40px rgba(0,0,0,.6);
    visibility:hidden;opacity:0;transform:translateX(18px);transition:opacity .28s var(--ease-out),transform .42s var(--ease-cajon),visibility 0s .42s}
  .borde.abierto .infos{visibility:visible;opacity:1;transform:none;transition-delay:0s}
  .infos>.info{overflow:visible}
  .info{grid-template-columns:1fr;gap:16px;padding:22px 24px 18px}
  .info-acciones{flex-direction:row;flex-wrap:wrap;align-items:center;min-width:0}
  .info-muestra{flex:1 1 100%}
  .info-acciones .boton{flex:1 1 auto}
}

/* ---------- Inicio en escritorio: la franja de estaciones vive dentro de la escena (abrir una estación no mueve la página) ---------- */
@media (min-width:1081px){
  .borde{position:absolute;left:0;right:0;bottom:0;margin:0;padding-top:30px;border-top:0;box-shadow:none;background:linear-gradient(180deg,rgba(13,15,20,0),rgba(13,15,20,.7) 40%,rgba(13,15,20,.9))}
  .borde::before{display:none}
  .estaciones-indicacion{color:var(--claro-noche)}
  .estacion{background:rgba(22,26,34,.8);border-color:rgba(255,255,255,.14);color:#F2F3F5}
  .estacion-linea{color:var(--claro-noche)}
  .estacion.sobre,.estacion:hover{border-color:color-mix(in oklab,var(--acento) 62%,rgba(255,255,255,.2));box-shadow:0 18px 36px -20px var(--acento)}
  .estacion[aria-current="true"]{background:linear-gradient(rgba(24,28,37,.94),rgba(24,28,37,.94)) padding-box,linear-gradient(120deg,var(--acento),var(--acento-2)) border-box}
  .infos{max-height:calc(var(--alto-escena) - 170px)}
}
@media (min-width:1081px) and (max-height:820px){   /* laptops de poca altura: la portada no toca la franja */
  .portada{top:clamp(20px,4svh,40px)}
  .portada h1{font-size:clamp(2.2rem,7svh,3.6rem)}
  .portada .bajada{margin-top:.7rem;font-size:1rem}
  .portada .acciones{margin-top:1.1rem}
}

/* ---------- menú de Servicios: se despliega al pasar el puntero o al enfocar ---------- */
.nav-desplegable{position:static}
.menu-servicios{position:fixed;z-index:60;top:calc(var(--cab) - 4px);left:50%;translate:-50% 0;width:min(980px,calc(100vw - 2 * var(--margen)));padding:20px 22px 16px;border-radius:24px;
  background:#fff;border:1px solid var(--platino-2);box-shadow:0 40px 80px -40px rgba(21,24,30,.5),0 2px 8px -4px rgba(21,24,30,.12);
  visibility:hidden;opacity:0;transform:translateY(-8px);transition:opacity .18s var(--ease-out),transform .22s var(--ease-out),visibility 0s .22s}
.menu-servicios::before{content:"";position:absolute;left:0;right:0;top:-18px;height:18px}
.nav-desplegable:hover .menu-servicios,.nav-desplegable:focus-within .menu-servicios{visibility:visible;opacity:1;transform:none;transition-delay:0s}
.nav-desplegable.cerrado .menu-servicios{visibility:hidden;opacity:0}
.menu-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.menu-linea-nombre{display:flex;align-items:center;gap:.5em;padding-bottom:.6rem;margin-bottom:.4rem;border-bottom:2px solid;border-image:linear-gradient(90deg,var(--acento),var(--acento-2) 60%,transparent) 1;font:660 .72rem/1 "Archivo",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--acento-tinta)}
.menu-linea-nombre::before{content:"";width:10px;height:10px;border-radius:50%;background:linear-gradient(135deg,var(--acento),var(--acento-2))}
.nav .menu-linea ul{list-style:none;display:flex;flex-direction:column;justify-content:flex-start;gap:2px;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
.nav .menu-linea a{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-height:0;padding:9px 10px;border-radius:12px;font:inherit;color:var(--grafito);white-space:normal;background:none;box-shadow:none}
.nav .menu-linea a:hover,.nav .menu-linea a:focus-visible{background:color-mix(in oklab,var(--acento) 9%,#fff)}
.menu-linea b{font-weight:650;font-size:.93rem;font-stretch:106%}
.menu-linea span{font-size:.8rem;line-height:1.35;color:var(--gris)}
.menu-pie{display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:12px;padding-top:12px;border-top:1px solid var(--platino-2)}
.nav .menu-pie a{display:inline-flex;align-items:center;gap:.4em;min-height:36px;padding:0;background:none;box-shadow:none;font:600 .86rem/1 "Archivo",sans-serif;color:var(--grafito-2)}
.nav .menu-pie a:hover{color:var(--grafito);background:none}
.nav .menu-pie a::after{display:none}
@media (hover:none),(max-width:980px){.menu-servicios{display:none}}

/* ---------- Inmobiliario: dos recorridos horizontales y uno vertical, a la misma altura ---------- */
.cuarto-recorridos-cabeza p{flex:1 1 280px;color:var(--claro-noche);font-size:.92rem}
.recorridos{grid-template-columns:1fr 1fr .42fr}
.recorrido-vertical video{aspect-ratio:3/4}
@media (max-width:760px){.recorridos{grid-template-columns:1fr 1fr}.recorrido-vertical{grid-column:1 / -1;max-width:260px}}

/* ---------- Producto: video horizontal y pieza de campaña ---------- */
.videos-producto{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.video-producto{margin:0;display:flex;flex-direction:column;gap:8px}
.video-producto video{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:18px;background:#000;box-shadow:0 30px 60px -40px var(--acento)}
.video-producto figcaption{font-size:.88rem;color:var(--claro-noche)}
.campana{margin:0;border-radius:22px;overflow:hidden;background:#000;box-shadow:0 50px 100px -50px var(--acento)}
.campana img{width:100%;display:block}
.campana figcaption{padding:14px 18px;font-size:.92rem;color:var(--claro-noche);background:rgba(255,255,255,.04)}
.campana figcaption b{color:#fff;margin-right:.4em}
.asi-video video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#000}
@media (max-width:980px){.videos-producto{grid-template-columns:1fr}}
/* ---------- Redes: influencers con IA (el tango al frente, los demás personajes como ejemplos) ---------- */
.asi-influencer{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.influencer-video{position:relative;margin:0;border-radius:24px;overflow:hidden;background:#000;box-shadow:0 60px 110px -50px var(--acento),0 0 0 1px rgba(255,255,255,.1)}
.influencer-video video{display:block;width:100%;aspect-ratio:720/964;object-fit:cover}
.influencer-video figcaption{position:absolute;left:14px;bottom:14px;padding:.4rem .8rem;border-radius:999px;background:rgba(13,15,20,.62);font-size:.82rem;color:#fff}
.influencer-ejemplos{grid-column:1 / -1}
.influencer-ejemplos h3{font-size:1.25rem;margin-bottom:14px}
.influencer-fotos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.influencer-foto{margin:0;display:flex;flex-direction:column;gap:8px}
.influencer-foto img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:18px;box-shadow:0 30px 60px -40px var(--acento)}
.influencer-foto figcaption{font-size:.88rem;color:var(--claro-noche)}
@media (max-width:980px){.asi-influencer{grid-template-columns:1fr}.influencer-video{max-width:440px}.influencer-fotos{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- Sitios web: exposición de sitios completos dentro de un marco de navegador ---------- */
.asi-expo{grid-template-columns:1fr;align-items:start}
.asi-expo>.asi-texto{max-width:44rem}
.expos{display:flex;flex-direction:column;gap:clamp(44px,5vw,80px)}
.expo{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:clamp(20px,3vw,48px);align-items:center}
.expo:nth-child(even){grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
.expo:nth-child(even) .expo-marco{order:2}
.expo-marco{border-radius:18px;overflow:hidden;background:#05060A;border:1px solid rgba(255,255,255,.12);box-shadow:0 70px 130px -60px var(--acento)}
.expo-barra{display:flex;align-items:center;gap:12px;height:38px;padding:0 14px;background:linear-gradient(#1B1F28,#13161D);border-bottom:1px solid rgba(255,255,255,.08)}
.expo-puntos{display:flex;gap:6px}.expo-puntos i{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.18)}
.expo-url{flex:1;max-width:30rem;margin:0 auto;padding:.28rem .8rem;border-radius:8px;background:rgba(255,255,255,.06);font-size:.76rem;color:var(--claro-noche);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.expo-pantalla{position:relative;aspect-ratio:16/10;background:#000}
.expo-pantalla img,.expo-pantalla iframe{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover;object-position:top center}
.expo-pantalla.en-vivo img{visibility:hidden}
.expo-pantalla.cargando::after{content:"Cargando el sitio…";position:absolute;left:50%;top:50%;translate:-50% -50%;padding:.55rem 1.1rem;border-radius:999px;background:rgba(13,15,20,.72);color:#fff;font-size:.86rem}
.expo-cargar{position:absolute;left:50%;top:50%;translate:-50% -50%;display:inline-flex;align-items:center;gap:.55em;min-height:50px;padding:0 1.4rem;border-radius:999px;border:1px solid rgba(255,255,255,.32);background:rgba(13,15,20,.74);color:#fff;font:600 .95rem "Archivo",sans-serif;cursor:pointer;transition:transform .18s var(--ease-out),background-color .18s var(--ease-out)}
.expo-cargar:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){.expo-cargar:hover{background:rgba(13,15,20,.9)}}
.expo-texto{display:flex;flex-direction:column;align-items:flex-start;gap:.85rem}
.expo-texto h3{font-size:clamp(1.3rem,2vw,1.75rem)}
.expo-texto p{color:#C9CCD0}
.expo-datos{list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.expo-datos li{padding:.36rem .72rem;border-radius:999px;border:1px solid rgba(255,255,255,.14);font-size:.8rem;color:#E4E6E9}
@media (max-width:980px){.expo,.expo:nth-child(even){grid-template-columns:1fr}.expo:nth-child(even) .expo-marco{order:0}.expo-pantalla.cargando,.expo-pantalla.en-vivo{aspect-ratio:3/4}}

/* ---------- Automatización: workflows explicados ---------- */
.wf-lista{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:16px;margin-top:2rem}
.wf{display:flex;flex-direction:column;gap:.75rem;padding:22px;border-radius:20px;background:rgba(255,255,255,.9);border:1px solid color-mix(in oklab,var(--acento) 22%,var(--platino-2));box-shadow:var(--sombra)}
.wf-area{font:640 .68rem/1 "Archivo",sans-serif;font-stretch:115%;letter-spacing:.12em;text-transform:uppercase;color:var(--acento-tinta)}
.wf h3{font-size:1.2rem;line-height:1.15}
.wf-disparador,.wf-resultado{font-size:.93rem;color:var(--grafito-2)}
.wf-disparador span,.wf-resultado span{display:block;margin-bottom:.2rem;font:600 .74rem/1.2 "Archivo",sans-serif;color:var(--gris)}
.wf-pasos{list-style:none;counter-reset:paso;display:flex;flex-direction:column;gap:.5rem;padding:.85rem 0;border-block:1px solid var(--niebla-2)}
.wf-pasos li{counter-increment:paso;display:grid;grid-template-columns:22px 1fr;gap:.55rem;font-size:.92rem;line-height:1.4}
.wf-pasos li::before{content:counter(paso);display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:color-mix(in oklab,var(--acento) 14%,#fff);color:var(--acento-tinta);font:640 .72rem/1 "Archivo",sans-serif}
.wf-resultado{margin-top:auto;color:var(--grafito)}
.wf-pie{margin-top:1.2rem;max-width:44rem;color:var(--gris);font-size:.95rem}

/* ---------- Automatización: calculadora de tiempo recuperado ---------- */
.calculadora{position:relative;isolation:isolate;overflow:hidden;margin-top:clamp(64px,8vw,110px);padding:clamp(56px,7vw,100px) max(var(--margen),calc((100vw - var(--ancho)) / 2 + var(--margen)));background:var(--noche);color:#F2F3F5}
.calculadora::before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(40% 60% at 8% 0%,color-mix(in oklab,var(--acento) 30%,transparent),transparent 70%),radial-gradient(36% 50% at 100% 100%,color-mix(in oklab,var(--acento-2) 22%,transparent),transparent 70%)}
.calc-cabeza{max-width:46rem}
.calc-cabeza h2{font-size:clamp(1.8rem,3.2vw,2.8rem)}
.calc-cabeza p{margin-top:.9rem;color:var(--claro-noche)}
.calc{display:flex;flex-direction:column;gap:1.4rem;margin-top:2rem}
.calc-casos .control-nombre{color:var(--claro-noche)}
.calc .chips button{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16);color:#F2F3F5}
.calc .chips button[aria-pressed="true"]{background:#fff;border-color:#fff;color:var(--grafito)}
.calc-marco{border-radius:18px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);overflow:hidden}
.calc-tabla{width:100%;border-collapse:collapse}
.calc-tabla th,.calc-tabla td{padding:12px 16px;text-align:left;border-bottom:1px solid rgba(255,255,255,.08);font-size:.95rem}
.calc-tabla thead th{font:600 .74rem/1.25 "Archivo",sans-serif;letter-spacing:.04em;color:var(--claro-noche)}
.calc-tabla tbody th{font-weight:500;color:#F2F3F5}
.calc-tabla tbody tr:last-child>*{border-bottom:0}
.calc input{width:88px;min-height:42px;padding:0 .65rem;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:#fff;font:500 .98rem "Archivo",sans-serif;font-variant-numeric:tabular-nums;caret-color:#fff}
.calc input:focus-visible{outline:2px solid var(--cian);outline-offset:1px}
.calc-horas{font-variant-numeric:tabular-nums;font-weight:640;color:#fff}
.calc-pie{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:16px;align-items:stretch}
.calc-costo{display:flex;flex-direction:column;justify-content:center;gap:.6rem;padding:18px 20px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);font-size:.92rem;color:var(--claro-noche)}
.calc-moneda{display:flex;align-items:center;gap:.55rem;color:#fff}
.calc-moneda input{width:120px}
.calc-resultado{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.calc-resultado p{display:flex;flex-direction:column;justify-content:center;gap:.35rem;padding:18px;border-radius:18px;background:linear-gradient(160deg,color-mix(in oklab,var(--acento) 26%,var(--noche-2)),var(--noche-2));border:1px solid rgba(255,255,255,.1)}
.calc-resultado b{font-size:clamp(1.5rem,2.6vw,2.2rem);font-weight:640;font-stretch:115%;letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums;color:#fff}
.calc-resultado span{font-size:.85rem;color:var(--claro-noche)}
.calc-nota{max-width:52rem;font-size:.88rem;color:var(--claro-noche)}
@media (max-width:980px){.calc-pie{grid-template-columns:1fr}.calc-resultado{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){
  .calc-tabla thead{display:none}
  .calc-tabla tbody tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(56px,auto);align-items:end;gap:8px 10px;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.08)}
  .calc-tabla tbody tr:last-child{border-bottom:0}
  .calc-tabla tbody th{grid-column:1 / -1;padding:0;border:0}
  .calc-tabla td{padding:0;border:0}
  .calc-tabla td::before{content:attr(data-etiqueta);display:block;margin-bottom:5px;font-size:.7rem;line-height:1.2;color:var(--claro-noche)}
  .calc-tabla td input{width:100%}
  .calc-horas{padding-bottom:11px!important;text-align:right!important}
}
/* ---------- Explorar: cuadrícula visual sin títulos; cada pieza se explica al tocarla ---------- */
.pagina-explora main,.pagina-explora{background:transparent}
.explora-cabeza{max-width:calc(1180px + 2 * var(--margen));margin:0 auto;padding:clamp(28px,4vw,48px) var(--margen) 18px;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px}
.explora-cabeza h1{font-size:clamp(1.6rem,2.4vw,2.2rem)}
.explora-cabeza p{color:var(--gris);font-size:.95rem}
.explora{--gap:4px;--cols:3;--celda:calc((min(100vw - 2 * var(--margen), 1180px) - (var(--cols) - 1) * var(--gap)) / var(--cols));
  display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));grid-auto-rows:var(--celda);grid-auto-flow:dense;gap:var(--gap);max-width:calc(1180px + 2 * var(--margen));margin:0 auto;padding:0 var(--margen)}
@media (min-width:1100px){.explora{--cols:4}}
@media (max-width:640px){.explora{--margen:0px;--gap:2px;padding:0}}
.tesela{position:relative;display:block;width:100%;height:100%;margin:0;padding:0;border:0;overflow:hidden;background:#101218;cursor:pointer;border-radius:2px}
.tesela img,.tesela video{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease-out),filter .3s var(--ease-out)}
.tesela-alto{grid-row:span 2}
.tesela-ancho{grid-column:span 2}
.tesela-grande{grid-column:span 2;grid-row:span 2}
@media (max-width:640px){.tesela-ancho{grid-column:span 2}.tesela-grande{grid-column:span 2;grid-row:span 2}}
.tesela::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 60%,rgba(0,0,0,.25));opacity:0;transition:opacity .25s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.tesela:hover img,.tesela:hover video{transform:scale(1.04);filter:brightness(1.06)}.tesela:hover::after{opacity:1}}
.tesela:focus-visible{outline:3px solid var(--foco);outline-offset:-3px}
.tesela-icono{position:absolute;z-index:1;top:8px;right:8px;display:grid;place-items:center;width:26px;height:26px;color:#fff;filter:drop-shadow(0 1px 3px rgba(0,0,0,.6))}
.tesela-icono .ico{width:20px;height:20px}
.pagina-explora .cta{margin-top:clamp(56px,7vw,96px)}

/* ---------- sitios en vivo, grandes, dentro de un marco de navegador ---------- */
.sitio-vivo{display:flex;flex-direction:column;align-items:center;gap:0;width:100%}
.sitio-barra{display:flex;align-items:center;gap:12px;width:100%;max-width:1282px;min-height:46px;padding:6px 10px 6px 14px;border-radius:16px 16px 0 0;background:linear-gradient(#1B1F28,#13161D);color:#E8EAED;border:1px solid rgba(255,255,255,.08);border-bottom:0}
.sitio-barra .expo-url{flex:1;min-width:0}
.sitio-barra .demo-barra{display:flex;gap:4px;margin:0}
.sitio-barra .demo-barra button{min-height:32px;padding:0 .8rem;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:transparent;color:#E8EAED;font:600 .78rem "Archivo",sans-serif;cursor:pointer}
.sitio-barra .demo-barra button[aria-pressed="true"]{background:#fff;color:var(--grafito);border-color:#fff}
.sitio-abrir{display:inline-flex;align-items:center;gap:.4em;min-height:32px;padding:0 .8rem;border-radius:999px;color:#E8EAED;font:600 .78rem "Archivo",sans-serif;text-decoration:none;white-space:nowrap}
.sitio-abrir:hover{background:rgba(255,255,255,.08)}
.sitio-vivo .dispositivo{border-radius:0 0 16px 16px;border-color:rgba(255,255,255,.1);box-shadow:0 60px 120px -60px var(--acento),0 30px 60px -40px rgba(0,0,0,.5)}
.sitio-vivo .dispositivo[data-modo="celular"]{margin-top:18px;border-radius:34px}
.sitio-vivo:has(.dispositivo[data-modo="celular"]) .sitio-barra{border-radius:16px}
@media (max-width:640px){.sitio-barra .expo-puntos,.sitio-barra .expo-url{display:none}.sitio-barra{justify-content:space-between}}
.expo-grande{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;gap:18px}
.asi-expo{grid-template-columns:1fr}
.asi-expo>.asi-texto{max-width:46rem}
.asi-expo .expo-datos{justify-content:center}

/* ---------- Redes: el tango al frente y otros personajes en mosaico ---------- */
.influencer-fotos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(180px,20vw,290px);gap:14px}
.influencer-foto{position:relative;margin:0;overflow:hidden;border-radius:18px;background:#000}
.influencer-foto img,.influencer-foto video{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;border-radius:0;box-shadow:none}
.influencer-grande{grid-column:span 2;grid-row:span 2}
.influencer-foto figcaption{position:absolute;left:10px;bottom:10px;right:10px;width:max-content;max-width:calc(100% - 20px);padding:.35rem .7rem;border-radius:999px;background:rgba(13,15,20,.62);font-size:.8rem;color:#fff}
@media (max-width:980px){.influencer-fotos{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:clamp(200px,48vw,320px)}}

/* ---------- Edición: video vertical; Cine: dos videos ---------- */
.asi-vertical{grid-template-columns:minmax(0,4fr) minmax(0,7fr)}
.asi-vertical .asi-video video{aspect-ratio:9/16;max-height:680px;width:auto;max-width:100%;margin:0 auto}
.asi-vertical .asi-medio{background:#000;justify-self:center}
.asi-cine{grid-template-columns:1fr}
.asi-cine>.asi-texto{max-width:44rem}
.cine-videos{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cine-videos figcaption{padding:10px 14px;font-size:.88rem;color:var(--claro-noche);background:rgba(255,255,255,.04)}
@media (max-width:980px){.asi-vertical,.cine-videos{grid-template-columns:1fr}}

/* ---------- «Combínelo con»: tarjetas de texto, sin repetir imágenes ---------- */
.combina-carta{grid-template-columns:minmax(0,1fr) auto;align-items:center;padding:4px 18px 4px 0;background:linear-gradient(135deg,color-mix(in oklab,var(--acento) 10%,#fff),rgba(255,255,255,.92))}
.combina-carta span{padding:18px 22px}
.combina-ir{color:var(--acento-tinta)}
.combina-carta:hover{box-shadow:0 26px 54px -30px var(--acento)}

/* ---------- pie: WhatsApp e Instagram debajo de los enlaces ---------- */
.pie-enlaces{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.canales-pie{margin-top:0}
.canal{gap:.5em}
.canal .ico{width:18px;height:18px}
.canal-whatsapp{background:#25D366;color:#06210f;border:0}
.canal-whatsapp:hover{background:#1fbe5b}
.canal-instagram{background:linear-gradient(45deg,#F9CE34,#EE2A7B 50%,#6228D7);color:#fff;border:0}
@media (max-width:760px){.pie-enlaces{align-items:flex-start}}

/* ---------- Inmobiliario: una sala real con otro acomodo ---------- */
.sala-real{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,64px);align-items:center;max-width:var(--ancho);margin:clamp(56px,7vw,96px) auto 0;padding:0 var(--margen)}
.sala-vista{position:relative;aspect-ratio:3/4;max-height:720px;width:100%;margin:0 auto;border-radius:22px;overflow:hidden;background:#111;box-shadow:0 50px 100px -50px var(--acento)}
.sala-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s var(--ease-out)}
.sala-img.activa{opacity:1}
.sala-antes{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--corte,50%)) 0 0);z-index:2}
.sala-antes img{width:100%;height:100%;object-fit:cover}
.sala-antes::after{content:"";position:absolute;top:0;bottom:0;left:var(--corte,50%);width:2px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.2)}
.sala-corte{position:absolute;inset:0;z-index:3;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}
.sala-pie{position:absolute;z-index:4;left:12px;bottom:12px;padding:.4rem .8rem;border-radius:999px;background:rgba(13,15,20,.66);color:#fff;font-size:.82rem}
.sala-texto{display:flex;flex-direction:column;gap:1rem}
.sala-texto h2{font-size:clamp(1.7rem,3vw,2.6rem)}
.sala-texto p{color:var(--grafito-2);max-width:34rem}
@media (max-width:980px){.sala-real{grid-template-columns:1fr}.sala-vista{max-width:520px}}

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