@font-face{font-family:'Gabarito';font-style:normal;font-weight:400 900;font-display:swap;src:url(../fuentes/Gabarito-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Gabarito';font-style:normal;font-weight:400 900;font-display:swap;src:url(../fuentes/Gabarito-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+1E00-1EFF}
@font-face{font-family:'Albert Sans';font-style:normal;font-weight:100 900;font-display:swap;src:url(../fuentes/AlbertSans-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Albert Sans';font-style:normal;font-weight:100 900;font-display:swap;src:url(../fuentes/AlbertSans-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+1E00-1EFF}

:root{
  --noche:#07022F;
  --tinta:#090055;
  --blanco:#FFFFFF;
  --niebla:#F3F2FA;
  --lavanda:#B7B2DE;
  --dorado:#FFB03A;
  --firma:linear-gradient(90deg,#A652FF 0%,#D77FB0 52%,#FFB03A 100%);
  --firma-v:linear-gradient(180deg,#A652FF 0%,#D77FB0 52%,#FFB03A 100%);
  --curva:cubic-bezier(.32,.72,0,1);
  --corte:cubic-bezier(.65,0,.35,1);
  --g:'Gabarito',system-ui,sans-serif;
  --a:'Albert Sans',system-ui,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--noche);color:var(--blanco);font-family:var(--a);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--dorado);outline-offset:3px;border-radius:8px}
.wa-ico{flex:none}

/* =================== HERO =================== */
.hero{
  position:relative;overflow:hidden;overflow:clip;isolation:isolate;
  min-height:900px;padding:0 24px 92px;background:var(--noche);
}
/* papel de molde: cuadrícula de mesa de corte, muy tenue, sin brillos */
.hero::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(rgba(183,178,222,.07) 1px,transparent 1px) 0 0/160px 160px,
    linear-gradient(90deg,rgba(183,178,222,.07) 1px,transparent 1px) 0 0/160px 160px,
    linear-gradient(rgba(183,178,222,.035) 1px,transparent 1px) 0 0/32px 32px,
    linear-gradient(90deg,rgba(183,178,222,.035) 1px,transparent 1px) 0 0/32px 32px;
  -webkit-mask-image:linear-gradient(100deg,transparent 30%,#000 62%,#000 100%);
          mask-image:linear-gradient(100deg,transparent 30%,#000 62%,#000 100%);
}

/* ---------- HEADER (isla) ---------- */
.isla{
  position:relative;z-index:40;max-width:1280px;margin:20px auto 0;
  display:flex;align-items:center;gap:20px;height:66px;padding:0 9px 0 14px;
  background:rgba(9,0,85,.66);border:1px solid rgba(255,255,255,.10);border-radius:999px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 20px 40px -24px rgba(0,0,0,.6);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
}
.marca{display:flex;align-items:center;gap:11px;min-height:44px;text-decoration:none;flex:none}
.sello{position:relative;width:38px;height:38px;border-radius:11px;background:var(--firma);flex:none;overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}
.sello::before{content:"";position:absolute;inset:0 0 auto 0;height:13px;
  background:
    repeating-linear-gradient(90deg,rgba(7,2,47,.85) 0 1.5px,transparent 1.5px 12px) 5px 0/100% 13px no-repeat,
    repeating-linear-gradient(90deg,rgba(7,2,47,.6) 0 1px,transparent 1px 4px) 5px 0/100% 6px no-repeat}
.sello b{position:absolute;left:0;right:0;bottom:5px;text-align:center;font-family:var(--g);font-weight:800;font-size:16px;letter-spacing:-.04em;color:var(--noche);line-height:1}
.nombre{display:flex;flex-direction:column;line-height:1}
.nombre strong{font-family:var(--g);font-weight:700;font-size:19px;letter-spacing:-.015em}
.nombre small{display:flex;align-items:center;gap:6px;margin-top:5px;font-size:11.5px;font-weight:500;color:var(--lavanda);letter-spacing:.01em}
.nombre small img{height:11px;width:auto;opacity:.92}
.menu{display:flex;gap:2px;margin:0 0 0 auto;padding:0;list-style:none}
.menu a{display:block;padding:10px 14px;border-radius:999px;font-family:var(--g);font-weight:500;font-size:15.5px;color:#DDDAF3;text-decoration:none;transition:background .35s var(--curva),color .35s var(--curva)}
.menu a:hover{background:rgba(255,255,255,.08);color:#fff}
.btn-isla{display:inline-flex;align-items:center;gap:9px;height:48px;padding:0 20px 0 14px;border-radius:999px;background:#fff;color:var(--tinta);font-family:var(--g);font-weight:600;font-size:15.5px;text-decoration:none;flex:none;transition:transform .5s var(--curva)}
.btn-isla .wa-ico{width:24px;height:24px}
.btn-isla:hover{transform:translateY(-2px)}
.btn-isla:active{transform:scale(.98)}
.btn-wa-mini,.btn-menu{display:none}

/* panel de menú en celular */
.panel{position:fixed;inset:0;z-index:30;display:flex;flex-direction:column;padding:96px 24px 32px;
  background:rgba(7,2,47,.94);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  visibility:hidden;opacity:0;transition:opacity .45s var(--curva),visibility 0s .45s}
.panel ul{margin:0;padding:0;list-style:none}
.panel li{overflow:hidden;border-bottom:1px solid rgba(183,178,222,.14)}
.panel li a{display:block;padding:16px 0;font-family:var(--g);font-weight:600;font-size:30px;letter-spacing:-.025em;text-decoration:none;transform:translateY(100%);transition:transform .6s var(--curva)}
.panel .btn-wa{margin-top:auto}
.menu-abierto .panel{visibility:visible;opacity:1;transition:opacity .45s var(--curva)}
.menu-abierto .panel li a{transform:none}
.menu-abierto .panel li:nth-child(2) a{transition-delay:.04s}
.menu-abierto .panel li:nth-child(3) a{transition-delay:.08s}
.menu-abierto .panel li:nth-child(4) a{transition-delay:.12s}
.menu-abierto .panel li:nth-child(5) a{transition-delay:.16s}
.menu-abierto .panel li:nth-child(6) a{transition-delay:.2s}
.menu-abierto{overflow:hidden}
.btn-menu span{position:absolute;left:13px;width:18px;height:1.6px;border-radius:2px;background:#fff;transition:transform .5s var(--curva),opacity .3s}
.btn-menu span:nth-child(1){top:16px}.btn-menu span:nth-child(2){top:21px}.btn-menu span:nth-child(3){top:26px;width:12px}
.menu-abierto .btn-menu span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.menu-abierto .btn-menu span:nth-child(2){opacity:0}
.menu-abierto .btn-menu span:nth-child(3){width:18px;transform:translateY(-5px) rotate(-45deg)}

/* ---------- rejilla del hero ---------- */
.hero-in{position:relative;max-width:1280px;margin:0 auto;display:grid;grid-template-columns:minmax(0,600px) minmax(0,1fr);gap:40px;padding-top:44px}
.copy{position:relative;z-index:5;padding-top:8px}
.h1-chico{display:flex;align-items:center;gap:12px;margin:0 0 22px;font-family:var(--a);font-weight:600;font-size:15px;line-height:1.3;color:var(--lavanda)}
.mini-cinta{flex:none;width:44px;height:12px;border-radius:2px;background:
  repeating-linear-gradient(90deg,rgba(7,2,47,.75) 0 1px,transparent 1px 5px) top left/100% 5px no-repeat, var(--firma)}
.titular{margin:0;font-family:var(--g);font-weight:800;font-size:80px;line-height:.98;letter-spacing:-.042em;color:#fff;text-wrap:balance}
.lead{margin:28px 0 0;max-width:520px;font-size:19px;line-height:1.58;color:#CFCBEA}
.lead b{color:#fff;font-weight:600}
.acciones{display:flex;align-items:center;gap:28px;margin-top:38px;flex-wrap:wrap}
.btn-wa{display:inline-flex;align-items:center;gap:12px;height:62px;padding:0 28px 0 20px;border-radius:999px;
  background:#fff;color:var(--tinta);text-decoration:none;font-family:var(--g);font-weight:600;font-size:18px;
  box-shadow:0 0 0 6px rgba(255,255,255,.08), 0 22px 40px -20px rgba(0,0,0,.7);
  transition:transform .6s var(--curva),box-shadow .6s var(--curva)}
.btn-wa .wa-ico{width:30px;height:30px}
.btn-wa:hover{transform:translateY(-3px);box-shadow:0 0 0 9px rgba(255,255,255,.10), 0 26px 44px -20px rgba(0,0,0,.75)}
.btn-wa:active{transform:scale(.98)}
.liga{display:inline-flex;align-items:center;min-height:44px;font-family:var(--g);font-weight:500;font-size:17px;color:#fff;text-decoration:none;padding:0;background:var(--firma) left calc(100% - 7px)/100% 2px no-repeat;transition:background-size .5s var(--curva)}
.liga:hover{background-size:100% 4px}
.respaldo{margin-top:44px}
.fundadores{display:flex;align-items:center;gap:14px;margin:0 0 20px}
.fundadores .caras{width:64px;height:64px;border-radius:50%;object-fit:cover;object-position:50% 30%;background:#DCE8FA;box-shadow:0 0 0 3px var(--noche),0 0 0 4.5px rgba(255,176,58,.7);flex:none}
.fundadores p{margin:0;display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--lavanda)}
.fundadores p b{font-family:var(--g);font-weight:600;font-size:16px;color:#fff}
.fundadores p span{display:block}
.fundadores p span img{display:inline;height:13px;width:auto;vertical-align:-2px;margin:0 3px}
.respaldo .quien b{color:#fff;font-weight:600}
.cifras{display:flex;margin:0;padding:0;list-style:none}
.cifras li{display:flex;align-items:baseline;gap:7px;padding:0 22px;border-left:1px solid rgba(183,178,222,.22);white-space:nowrap}
.cifras li:first-child{padding-left:0;border-left:0;align-items:center}
.cifras .n{font-family:var(--g);font-weight:700;font-size:24px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.cifras .t{font-size:14px;color:var(--lavanda)}
.cifras .g{width:20px;height:20px;align-self:center}

/* ---------- escena (diseñada a 640 px y escalada con unidades de contenedor) ---------- */
.escena{position:relative;z-index:2;container-type:inline-size;aspect-ratio:640/680;align-self:start;--u:calc(100cqw/640)}
.rotulo{position:absolute;top:0;left:calc(6*var(--u));margin:0;display:flex;align-items:center;gap:8px;font-size:13px;line-height:1.3;color:var(--lavanda);white-space:nowrap;transition:opacity .5s var(--curva),transform .5s var(--curva)}
.rotulo i{width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.12);flex:none}
.rotulo b{color:#fff;font-weight:600}
.r-antes{opacity:0;transform:translateY(6px)}
.r-antes i{background:#8F8AAE;box-shadow:0 0 0 4px rgba(143,138,174,.18)}

.charola{position:absolute;margin:0;padding:calc(8*var(--u));background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.13);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 50px 90px -30px rgba(0,0,0,.7)}
.navegador{top:calc(34*var(--u));left:0;width:100%;border-radius:calc(28*var(--u))}
.navegador .pantalla{position:relative;border-radius:calc(20*var(--u));overflow:hidden;background:#fff}
.chrome{display:flex;align-items:center;gap:calc(7*var(--u));height:calc(34*var(--u));padding:0 calc(14*var(--u));background:var(--niebla);border-bottom:1px solid #E4E2F0}
.chrome span{width:calc(9*var(--u));height:calc(9*var(--u));border-radius:50%;background:#D3D0E4}
.chrome em{margin-left:calc(14*var(--u));padding:calc(3*var(--u)) calc(12*var(--u));border-radius:999px;background:#fff;font-style:normal;font-size:max(9px,calc(11.5*var(--u)));color:#6B6890}
.lienzo{position:relative}
.real{position:relative;z-index:2;width:100%;height:auto}

/* la licencia genérica (solo se ve durante la animación) */
.paquete{position:absolute;inset:0;z-index:1;display:grid;grid-template-columns:22% 1fr;background:#ECECEF;color:#8A8A96;font-family:var(--a);visibility:hidden}
.paquete .lado{background:#DCDCE2;padding:7% 9%;display:flex;flex-direction:column;gap:9%}
.paquete .lado b{display:block;height:8%;border-radius:4px;background:#C6C6CF}
.paquete .lado b:first-child{background:#B4B4BF;height:11%}
.paquete .cuerpo{padding:4.5% 5%;display:flex;flex-direction:column;gap:3.4%}
.paquete .tit{font-family:var(--g);font-weight:700;font-size:calc(21*var(--u));color:#6E6E7C}
.paquete .aviso{display:flex;align-items:center;gap:calc(10*var(--u));padding:2.2% 3%;border-radius:8px;background:#E2E2E8;border:1px dashed #B9B9C4;font-size:max(9px,calc(14*var(--u)));color:#6E6E7C}
.paquete .fila{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:3%;align-items:center;padding:1.2% 0;border-bottom:1px solid #DADAE0;font-size:max(8px,calc(12*var(--u)))}
.paquete .fila i{display:block;height:calc(9*var(--u));border-radius:4px;background:#D3D3DA}
.paquete .fila.cab{color:#9A9AA6;font-weight:600}
.paquete .candado{display:inline-flex;align-items:center;gap:calc(8*var(--u));align-self:flex-start;margin-top:auto;padding:1.8% 3%;border-radius:999px;background:#D9D9E0;font-weight:600;font-size:max(9px,calc(13*var(--u)));color:#7C7C8A}
.paquete svg{width:1.2em;height:1.2em;flex:none}

/* la cinta que mide y corta (dentro de la pantalla, solo en la animación) */
.barrido{position:absolute;inset:0;z-index:3;pointer-events:none;visibility:hidden}
.barrido::before{content:"";position:absolute;top:-2px;bottom:-2px;left:calc(-13*var(--u));width:calc(26*var(--u));background:var(--firma-v);
  box-shadow:0 0 0 1px rgba(255,255,255,.35), 0 0 30px rgba(7,2,47,.45)}
.barrido::after{content:"";position:absolute;top:0;bottom:0;left:calc(-13*var(--u));width:calc(10*var(--u));
  background:repeating-linear-gradient(180deg,rgba(7,2,47,.8) 0 1.5px,transparent 1.5px 9px)}

.telefono{top:calc(266*var(--u));left:calc(-36*var(--u));width:calc(204*var(--u));border-radius:calc(40*var(--u));z-index:4}
.telefono .pantalla{border-radius:calc(32*var(--u));overflow:hidden;background:#EDE9E2}
.telefono img{width:100%;height:auto}

.alfiler{position:absolute;z-index:6;display:flex;align-items:center}
.alfiler .cabeza{width:max(11px,calc(15*var(--u)));height:max(11px,calc(15*var(--u)));border-radius:50%;flex:none;
  background:radial-gradient(circle at 35% 30%,#FFE3B0 0 18%,#FFB03A 45%,#D9861A 100%);
  box-shadow:0 4px 10px rgba(0,0,0,.35),0 0 0 calc(5*var(--u)) rgba(255,176,58,.18)}
.alfiler .aguja{width:calc(30*var(--u));height:1.5px;background:linear-gradient(90deg,#FFB03A,rgba(255,255,255,.9))}
.alfiler .nota{padding:calc(8*var(--u)) calc(13*var(--u));border-radius:calc(12*var(--u));background:#fff;color:var(--tinta);font-family:var(--g);font-weight:600;font-size:max(11.5px,calc(14*var(--u)));line-height:1.2;white-space:nowrap;box-shadow:0 14px 30px -10px rgba(7,2,47,.6)}
.alfiler.izq{flex-direction:row-reverse}
.alfiler.izq .aguja{background:linear-gradient(270deg,#FFB03A,rgba(255,255,255,.9))}
.a1{top:calc(229*var(--u));left:calc(360*var(--u))}
.a2{top:calc(287*var(--u));right:calc(224*var(--u))}
.a3{top:calc(517*var(--u));left:calc(112*var(--u))}

/* ---------- la cinta de medir del pie (firma) ---------- */
.cinta{position:absolute;z-index:3;left:-6%;right:-6%;bottom:30px;height:58px;transform:rotate(-2.6deg);
  background:var(--firma);overflow:hidden;
  box-shadow:0 22px 40px -14px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.35),inset 0 -1px 0 rgba(0,0,0,.18)}
.cinta::before{content:"";position:absolute;inset:0 0 auto 0;height:18px;pointer-events:none;
  background:
    repeating-linear-gradient(90deg,rgba(7,2,47,.78) 0 1.5px,transparent 1.5px 40px) 0 0/100% 18px no-repeat,
    repeating-linear-gradient(90deg,rgba(7,2,47,.55) 0 1px,transparent 1px 8px) 0 0/100% 9px no-repeat}
.cinta .tren{position:absolute;left:0;bottom:9px;display:flex;width:max-content;animation:correr 90s linear infinite}
.cinta .tren span{display:flex;align-items:center;gap:18px;padding-right:18px;font-family:var(--g);font-weight:700;font-size:16px;color:var(--noche);white-space:nowrap}
.cinta .tren span::after{content:"";width:2px;height:18px;background:rgba(7,2,47,.6);border-radius:1px}
@keyframes correr{to{transform:translateX(-50%)}}

/* =========== EL MOMENTO ANIMADO ===========
   Sin JS, con reduced-motion o fuera de pantalla: se ve el estado final (sistema real).
   .armado = "antes" (licencia genérica). .corre = la cinta mide y corta hacia el sistema a la medida. */
.armado .paquete,.armado .barrido{visibility:visible}
.armado .real{clip-path:inset(0 100% 0 0)}
.armado .barrido{transform:translateX(0)}
.armado .r-antes{opacity:1;transform:none}
.armado .r-nav{opacity:0;transform:translateY(6px)}
.armado .alfiler{opacity:0;transform:translateY(-14px)}
.armado .telefono{opacity:0;transform:translateY(46px)}

.armado.corre .real{clip-path:inset(0 0 0 0);transition:clip-path 1.5s var(--corte)}
.armado.corre .barrido{transform:translateX(calc(100% + 40px));transition:transform 1.5s var(--corte)}
.armado.corre .r-antes{opacity:0;transform:translateY(-6px);transition-delay:.1s}
.armado.corre .r-nav{opacity:1;transform:none;transition-delay:1.25s}
.armado.corre .telefono{opacity:1;transform:none;transition:opacity .8s var(--curva) 1.05s,transform .9s var(--curva) 1.05s}
.armado.corre .alfiler{opacity:1;transform:none;transition:opacity .6s var(--curva),transform .7s var(--curva)}
.armado.corre .a1{transition-delay:1.55s}
.armado.corre .a2{transition-delay:1.75s}
.armado.corre .a3{transition-delay:1.95s}

@media (prefers-reduced-motion:reduce){
  .cinta .tren{animation:none}
  *,*::before,*::after{transition:none!important}
}

/* =================== RESPONSIVE =================== */
@media (max-width:1366px){
  .hero-in{grid-template-columns:minmax(0,520px) minmax(0,1fr)}
  .titular{font-size:70px}
}
@media (max-width:1240px){
  .menu{display:none}
  .btn-menu{display:inline-block;position:relative;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:transparent;cursor:pointer;flex:none}
  .isla .btn-isla{margin-left:auto}
}
@media (max-width:1100px){
  .hero-in{grid-template-columns:minmax(0,440px) minmax(0,1fr);gap:36px}
  .titular{font-size:58px}
  .lead{font-size:17px}
  .cifras{display:grid;grid-template-columns:auto auto;justify-content:start;gap:12px 0}
  .cifras li:nth-child(3){padding-left:0;border-left:0}
  .cifras .n{font-size:21px}
}
@media (max-width:900px){
  .hero-in{grid-template-columns:minmax(0,1fr);gap:48px;padding-top:56px}
  .copy{max-width:600px}
  .escena{width:min(100%,620px);margin-left:4%}
  .cifras{display:flex}
  .cifras li:nth-child(3){padding-left:22px;border-left:1px solid rgba(183,178,222,.22)}
  .hero{padding-bottom:150px}
}
@media (max-width:767px){
  body{font-size:16px}
  .hero{padding:0 16px 116px;min-height:0}
  .isla{margin-top:12px;height:60px;padding:0 6px 0 8px;gap:8px}
  .sello{width:34px;height:34px;border-radius:10px}
  .sello b{font-size:14px;bottom:4px}
  .nombre strong{font-size:17px}
  .nombre small{font-size:10.5px;margin-top:4px}
  .nombre small img{height:10px}
  .isla .btn-isla{display:none}
  .btn-wa-mini{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#25D366;margin-left:auto;flex:none}
  .btn-wa-mini .wa-ico{width:24px;height:24px}
  .hero-in{padding-top:40px;gap:40px}
  .h1-chico{font-size:13.5px;margin-bottom:16px;gap:10px}
  .mini-cinta{width:32px;height:10px}
  .titular{font-size:clamp(34px,11.2vw,46px);line-height:1;letter-spacing:-.04em}
  .lead{margin-top:20px;font-size:17px;line-height:1.55}
  .acciones{flex-direction:column;align-items:stretch;gap:14px;margin-top:28px}
  .btn-wa{justify-content:center;height:58px;font-size:17px;padding:0 16px}
  .liga{align-self:center}
  .respaldo{margin-top:34px}
  .cifras{display:grid;grid-template-columns:auto auto;gap:12px 0}
  .cifras li{padding:0 14px}
  .cifras li:nth-child(3){padding-left:0;border-left:0}
  .cifras .n{font-size:21px}
  .cifras .t{font-size:13px}
  .escena{width:auto;margin-left:9%;margin-right:-4%}
  .escena{margin-top:22px}
  .rotulo{font-size:12px;top:-26px;left:-9cqw;white-space:normal;max-width:105cqw}
  .a2{display:none}
  .a1{flex-direction:column;align-items:center;transform:translateX(calc(-50% + 7px))}
  .a1 .aguja{width:1.5px;height:14px;background:linear-gradient(180deg,#FFB03A,rgba(255,255,255,.9))}
  .armado .a1{transform:translateX(calc(-50% + 7px)) translateY(-14px)}
  .armado.corre .a1{transform:translateX(calc(-50% + 7px))}
  .cinta{height:46px;bottom:32px}
  .cinta::before{height:14px;background:
    repeating-linear-gradient(90deg,rgba(7,2,47,.78) 0 1.5px,transparent 1.5px 32px) 0 0/100% 14px no-repeat,
    repeating-linear-gradient(90deg,rgba(7,2,47,.55) 0 1px,transparent 1px 8px) 0 0/100% 7px no-repeat}
  .cinta .tren{bottom:7px}
  .cinta .tren span{font-size:14px;gap:14px;padding-right:14px}
  .panel li a{font-size:28px}
}
@media (max-width:360px){
  .escena{margin-top:36px}
  .rotulo{top:-40px}
  .nombre small{display:none}
  .isla{gap:6px;padding:0 5px 0 7px}
  .sello{width:30px;height:30px;border-radius:9px}
  .sello b{font-size:12.5px}
  .nombre strong{font-size:15px}
  .btn-wa-mini,.btn-menu{width:42px;height:42px}
  .btn-menu span{left:11px}
  .btn-menu span:nth-child(1){top:14px}.btn-menu span:nth-child(2){top:19px}.btn-menu span:nth-child(3){top:24px}
  .cifras li{padding:0 10px}
  .cifras .t{font-size:12px;white-space:normal}
  .cifras li{white-space:normal}
  .btn-wa{font-size:16px;gap:10px}
  .btn-wa .wa-ico{width:26px;height:26px}
}

/* =====================================================================
   PORTADA · SECCIONES (mismo lenguaje: noche/blanco, cinta y alfileres)
   ===================================================================== */
.env{max-width:1280px;margin:0 auto;padding:0 24px}
.sec{position:relative;padding:128px 0}
.sec-blanca{background:#fff;color:var(--tinta)}
.sec-niebla{background:var(--niebla);color:var(--tinta)}
.sec-noche{background:var(--noche);color:#fff}
.sec-cab{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:end;margin-bottom:64px}
.h2{margin:0;font-family:var(--g);font-weight:700;font-size:54px;line-height:1.02;letter-spacing:-.035em;text-wrap:balance}
.bajada{margin:0;max-width:520px;font-size:18px;line-height:1.6;color:#4A4770}
.sec-noche .bajada{color:#CFCBEA}
.bajada b{font-weight:600;color:var(--tinta)}
.sec-noche .bajada b{color:#fff}
.ir{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-family:var(--g);font-weight:600;font-size:15.5px;color:inherit;text-decoration:none}
.ir .flecha{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:rgba(9,0,85,.07);transition:transform .5s var(--curva),background .5s var(--curva)}
.ir .flecha svg{width:14px;height:14px}
.sec-noche .ir .flecha{background:rgba(255,255,255,.12)}
.pin-punto{display:inline-block;width:11px;height:11px;border-radius:50%;flex:none;
  background:radial-gradient(circle at 35% 30%,#FFE3B0 0 18%,#FFB03A 45%,#D9861A 100%);box-shadow:0 0 0 4px rgba(255,176,58,.16)}
.marco{padding:6px;border-radius:22px;background:rgba(9,0,85,.045);border:1px solid rgba(9,0,85,.08)}
.marco>.vidrio{border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 24px 40px -28px rgba(7,2,47,.45)}
.marco img{width:100%;height:auto}

/* ---------- 1 · Servicios ---------- */
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:20px}
.srv{position:relative;display:flex;flex-direction:column;gap:10px;padding:30px;border-radius:28px;background:var(--niebla);color:var(--tinta);text-decoration:none;
  transition:transform .55s var(--curva),box-shadow .55s var(--curva)}
.srv:hover{transform:translateY(-4px);box-shadow:0 30px 50px -34px rgba(7,2,47,.45)}
.srv:hover .flecha{transform:translateX(3px);background:var(--tinta);color:#fff}
.srv h3{margin:0;font-family:var(--g);font-weight:600;font-size:25px;line-height:1.15;letter-spacing:-.02em}
.srv p{margin:0;font-size:15.5px;line-height:1.55;color:#4A4770;max-width:46ch}
.srv .ir{margin-top:auto;padding-top:8px}
.s7{grid-column:span 7}.s5{grid-column:span 5}.s4{grid-column:span 4}.s12{grid-column:span 12}
.srv .pant{margin:6px 0 10px}
.srv-agenda{flex-direction:row;gap:28px;align-items:stretch}
.srv-agenda .txt{display:flex;flex-direction:column;gap:10px;flex:1;min-width:0}
.tel-mini{flex:none;width:236px;padding:6px;border-radius:34px;background:rgba(9,0,85,.06);border:1px solid rgba(9,0,85,.09);align-self:flex-start;margin:10px 0 -40px}
.tel-mini .vidrio{border-radius:28px 28px 0 0;overflow:hidden;height:540px;background:#EDE9E2}
.tel-mini img{width:100%;height:auto}
.srv-agenda{overflow:hidden}
.pila{display:flex;flex-direction:column;gap:20px}
.pila .srv{flex:1}
.srv-oscura{background:var(--tinta);color:#fff}
.srv-oscura p{color:#CFCBEA}
.srv-oscura .flecha{background:rgba(255,255,255,.12)}
.srv-oscura:hover .flecha{background:#fff;color:var(--tinta)}
.wa-sello{width:40px;height:40px}
.ingredientes{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 0;padding:0;list-style:none}
.ingredientes li{padding:6px 12px;border-radius:999px;background:#fff;font-size:13.5px;font-weight:500;color:var(--tinta)}
.srv-oscura .ingredientes li{background:rgba(255,255,255,.1);color:#fff}
/* moldes: lo que se diseña desde cero (sin pantallas que finjan) */
.srv.molde{background:#fff;border:1.5px dashed #C9C4EA}
.srv.molde:hover{border-color:#A99FE0}
.molde-dibujo{display:block;width:100%;height:auto;max-width:220px;margin-bottom:6px}
.etiqueta-molde{align-self:flex-start;display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;background:#EEEBFB;color:#3C3480;font-size:12.5px;font-weight:600}
.srv-int{flex-direction:row;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap}
.srv-int .txt{display:flex;flex-direction:column;gap:10px;max-width:460px}
.conecta{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none;max-width:640px}
.conecta li{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;background:#fff;border:1px solid rgba(9,0,85,.09);font-family:var(--g);font-weight:600;font-size:15px}
.conecta li svg{width:20px;height:20px}

/* ---------- 2 · Licencias contra software propio ---------- */
.versus{display:grid;grid-template-columns:minmax(0,1fr) 22px minmax(0,1fr);align-items:stretch}
.lado-v{padding:40px;border-radius:28px}
.lado-v h3{margin:0 0 6px;font-family:var(--g);font-weight:700;font-size:28px;letter-spacing:-.02em}
.lado-v .sub{margin:0 0 26px;font-size:15px}
.lado-v ul{margin:0;padding:0;list-style:none;display:grid;gap:16px}
.lado-v li{display:flex;gap:14px;align-items:baseline;font-size:17px;line-height:1.45}
.renta{background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.1);color:#A9A4CF}
.renta h3{color:#D9D6EE}
.renta .sub{color:#8F8AB8}
.renta li::before{content:"";flex:none;width:9px;height:9px;border-radius:50%;border:1.5px solid #6F6A99;transform:translateY(-1px)}
.propio{background:#fff;color:var(--tinta);box-shadow:0 40px 80px -40px rgba(0,0,0,.7)}
.propio .sub{color:#4A4770}
.propio li .pin-punto{transform:translateY(1px)}
.cinta-v{align-self:stretch;margin:28px 0;border-radius:3px;background:var(--firma-v);position:relative;overflow:hidden}
.cinta-v::before{content:"";position:absolute;inset:0 auto 0 0;width:9px;background:repeating-linear-gradient(180deg,rgba(7,2,47,.75) 0 1.5px,transparent 1.5px 8px)}
.calc{margin-top:28px;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:40px;align-items:center;padding:36px 40px;border-radius:28px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1)}
html:not(.js) .calc{display:none}
.calc h3{margin:0 0 4px;font-family:var(--g);font-weight:700;font-size:24px}
.calc .nota-calc{margin:0 0 22px;font-size:14px;color:var(--lavanda)}
.campos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.campo label{display:block;margin-bottom:8px;font-size:13.5px;line-height:1.3;color:#CFCBEA;min-height:2.6em}
.campo input{width:100%;height:56px;padding:0 16px;border-radius:14px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.07);color:#fff;font-family:var(--g);font-weight:600;font-size:21px;font-variant-numeric:tabular-nums;-moz-appearance:textfield}
.campo input::placeholder{color:rgba(207,203,234,.45);font-weight:500}
.campo input:focus{outline:none;border-color:#FFB03A;box-shadow:0 0 0 3px rgba(255,176,58,.25)}
.campo input::-webkit-outer-spin-button,.campo input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.resultado{display:flex;flex-direction:column;gap:14px}
.resultado .rotulo-r{margin:0;font-size:15px;color:#CFCBEA}
.resultado output{display:block;font-family:var(--g);font-weight:800;font-size:52px;line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:#fff}
.resultado output.vacio{font-size:22px;font-weight:600;color:var(--lavanda);letter-spacing:0}
.btn-wa.chico{height:54px;font-size:16px;padding:0 22px 0 16px;align-self:flex-start}
.btn-wa.chico .wa-ico{width:26px;height:26px}

/* ---------- 3 · Proyectos reales ---------- */
.caso-grande{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:center;padding:44px;border-radius:32px;background:var(--niebla);margin-bottom:20px}
.caso-logo{height:40px;width:auto;margin-bottom:22px;align-self:flex-start;object-fit:contain}
.caso h3{margin:0 0 10px;font-family:var(--g);font-weight:700;font-size:30px;letter-spacing:-.025em;line-height:1.1}
.caso p{margin:0;font-size:16px;line-height:1.6;color:#4A4770}
.medidas{margin:22px 0 18px;padding:0;list-style:none;display:grid;gap:12px}
.medidas li{display:flex;gap:12px;align-items:baseline;font-size:15.5px;line-height:1.45;color:var(--tinta)}
.medidas .pin-punto{transform:translateY(1px)}
.estado{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#1F7A3A}
.estado i{width:8px;height:8px;border-radius:50%;background:#2DB55D;box-shadow:0 0 0 4px rgba(45,181,93,.15)}
.estado.etapas{color:#6B4FB8}.estado.etapas i{background:#A652FF;box-shadow:0 0 0 4px rgba(166,82,255,.15)}
.pie-caso{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.caso-pant{position:relative}
.caso-pant .alfiler{position:absolute;z-index:3}
.cp1{top:61.5%;right:16.5%}
.casos3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.caso-c{display:flex;flex-direction:column;padding:28px;border-radius:28px;background:var(--niebla)}
.caso-c .escaparate{position:relative;display:grid;place-items:center;height:300px;margin:-8px -8px 26px;border-radius:22px;background:#E8E6F4;overflow:hidden}
.caso-c .escaparate .marco{width:132%;align-self:end;justify-self:start;margin:0 0 -24px 24px}
.caso-c .caso-logo{height:34px;margin-bottom:16px}
.caso-c h3{font-size:24px}
.caso-c .pie-caso{margin-top:auto}
.tel-caso{width:196px;align-self:start;margin-top:30px;padding:5px;border-radius:30px;background:rgba(9,0,85,.07);border:1px solid rgba(9,0,85,.1)}
.tel-caso .vidrio{border-radius:25px;overflow:hidden;background:#EDE9E2}
.tel-caso img{width:100%;height:auto}
.logos-fila{display:flex;align-items:center;gap:18px;margin-bottom:16px;flex-wrap:wrap}
.logos-fila img{height:30px;width:auto;object-fit:contain}
/* chat de ejemplo (agentes) */
.chat{width:236px;align-self:start;margin-top:54px;border-radius:26px 26px 0 0;overflow:hidden;background:#EFEAE2;box-shadow:0 24px 40px -24px rgba(7,2,47,.5);font-family:var(--a)}
.chat .barra-wa{display:flex;align-items:center;gap:9px;padding:12px 14px;background:#008069;color:#fff}
.chat .barra-wa i{width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.25);flex:none}
.chat .barra-wa b{display:block;font-size:12.5px;font-weight:600;line-height:1.2}
.chat .barra-wa small{display:block;font-size:10.5px;opacity:.8}
.chat .hilo{display:flex;flex-direction:column;gap:7px;padding:12px 10px 52px}
.chat .b{max-width:84%;padding:7px 10px;border-radius:9px;font-size:12px;line-height:1.35;color:#111B21;box-shadow:0 1px 0 rgba(0,0,0,.08)}
.chat .yo{align-self:flex-end;background:#D9FDD3;border-top-right-radius:2px}
.chat .el{align-self:flex-start;background:#fff;border-top-left-radius:2px}
.chat .aviso-sis{align-self:center;padding:4px 10px;border-radius:7px;background:#FFF3C4;font-size:10.5px;color:#54656F}
.ejemplo{position:absolute;top:14px;left:14px;z-index:2;display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.92);border:1px dashed #A99FE0;font-size:11.5px;font-weight:600;color:#3C3480}

/* ---------- 4 · Giros ---------- */
.giros{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:56px;margin:0;padding:0;list-style:none}
.giro{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:20px;min-height:44px;padding:28px 0;border-top:1px solid rgba(9,0,85,.12);color:var(--tinta);text-decoration:none}
.giros li:nth-last-child(-n+2) .giro{border-bottom:1px solid rgba(9,0,85,.12)}
.giro .nom{display:block;font-family:var(--g);font-weight:600;font-size:30px;letter-spacing:-.025em;line-height:1.1;transition:transform .5s var(--curva)}
.giro .que{display:block;margin-top:8px;font-size:15.5px;line-height:1.5;color:#4A4770}
.giro .caso-tag{display:inline-flex;align-items:center;gap:7px;margin-top:12px;font-size:13px;font-weight:600;color:#3C3480}
.giro .flecha{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:50%;border:1px solid rgba(9,0,85,.18);transition:background .5s var(--curva),color .5s var(--curva),transform .5s var(--curva)}
.giro .flecha svg{width:16px;height:16px}
.giro:hover .nom{transform:translateX(6px)}
.giro:hover .flecha{background:var(--tinta);color:#fff;border-color:var(--tinta)}
.giro.otro .nom{color:#5B4FC4}

/* ---------- 5 · Proceso ---------- */
.ruta{position:relative;margin-top:8px}
.ruta .cinta-h{position:relative;height:46px;border-radius:4px;background:var(--firma);overflow:hidden;box-shadow:0 24px 40px -20px rgba(0,0,0,.6)}
.ruta .cinta-h::before{content:"";position:absolute;inset:0 0 auto 0;height:16px;
  background:repeating-linear-gradient(90deg,rgba(7,2,47,.78) 0 1.5px,transparent 1.5px 40px) 0 0/100% 16px no-repeat,
             repeating-linear-gradient(90deg,rgba(7,2,47,.55) 0 1px,transparent 1px 8px) 0 0/100% 8px no-repeat}
.pasos{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px;margin:-23px 0 0;padding:0;list-style:none;position:relative}
.paso .cab-paso{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;margin-bottom:26px;font-family:var(--g);font-weight:800;font-size:18px;color:var(--noche);
  background:radial-gradient(circle at 35% 30%,#FFE9C2 0 16%,#FFB03A 50%,#D9861A 100%);box-shadow:0 0 0 6px var(--noche),0 0 0 7px rgba(255,176,58,.35)}
.paso{display:flex;flex-direction:column}
.paso p:not(.llevas){flex:1}
.paso h3{margin:0 0 10px;font-family:var(--g);font-weight:700;font-size:23px;letter-spacing:-.02em}
.paso p{margin:0 0 18px;font-size:15.5px;line-height:1.55;color:#CFCBEA}
.paso .llevas{margin:0;padding-top:14px;border-top:1px solid rgba(255,255,255,.14);font-size:14px;line-height:1.45;color:#fff}
.paso .llevas b{display:block;font-weight:600;color:var(--dorado);font-size:12.5px;margin-bottom:3px}

/* ---------- 6 · Por qué nosotros ---------- */
.nosotros{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px;align-items:center}
.de-quien{display:flex;align-items:center;gap:9px;margin:0 0 22px;font-size:16px;font-weight:500;color:#4A4770}
.de-quien img{height:24px;width:auto;position:relative;top:1px}
.nosotros .h2{font-size:48px}
.nosotros .bajada{margin-top:20px}
.cifras-claras{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 24px;margin:34px 0 30px;padding:0;list-style:none}
.cifras-claras li{padding-top:14px;border-top:1px solid rgba(9,0,85,.12)}
.cifras-claras .n{display:flex;align-items:center;gap:8px;font-family:var(--g);font-weight:700;font-size:38px;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.cifras-claras .n svg{width:28px;height:28px}
.cifras-claras .t{display:block;margin-top:6px;font-size:14.5px;color:#4A4770}
.liga.oscura{color:var(--tinta);display:inline-flex;align-items:center;min-height:44px}
.muro{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.muro li{display:grid;place-items:center;height:104px;padding:18px;border-radius:20px;background:var(--niebla);list-style:none}
.muro{margin:0;padding:0}
.muro img{max-width:100%;max-height:44px;width:auto;height:auto;object-fit:contain}

/* ---------- 7 · Preguntas ---------- */
.faq-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:64px;align-items:start}
.faq-grid .h2{font-size:46px}
.faq-grid .bajada{margin-top:18px}
.faq-lado{position:sticky;top:110px}
.faq-lado .ir{margin-top:18px}
.faq details{margin-bottom:10px;border-radius:20px;background:#fff;border:1px solid rgba(9,0,85,.07);transition:box-shadow .5s var(--curva)}
.faq details[open]{box-shadow:0 26px 40px -30px rgba(7,2,47,.4)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:44px;padding:22px 26px;cursor:pointer;list-style:none;font-family:var(--g);font-weight:600;font-size:19px;line-height:1.3;color:var(--tinta)}
.faq summary::-webkit-details-marker{display:none}
.faq summary .mas{position:relative;flex:none;width:34px;height:34px;border-radius:50%;background:var(--niebla);transition:transform .5s var(--curva),background .5s var(--curva)}
.faq summary .mas::before,.faq summary .mas::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.8px;margin:-.9px 0 0 -6px;border-radius:2px;background:var(--tinta)}
.faq summary .mas::after{transform:rotate(90deg)}
.faq details[open] .mas{transform:rotate(45deg);background:#FFE3B0}
.faq .resp{padding:0 26px 24px;font-size:16px;line-height:1.65;color:#4A4770;max-width:68ch}
.faq .resp p{margin:0}
.faq .resp a{color:var(--tinta);font-weight:600}

/* ---------- 8 · Cierre ---------- */
.cierre .env{max-width:980px;text-align:center}
.cierre .h2{font-size:60px}
.cierre .bajada{margin:20px auto 0}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:40px 0 0;padding:0;border:0}
.chips legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.chip{position:relative}
.chip input{position:absolute;opacity:0;width:1px;height:1px}
.chip span{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 18px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.05);font-family:var(--g);font-weight:600;font-size:15.5px;color:#E5E2F7;cursor:pointer;transition:background .4s var(--curva),color .4s var(--curva),border-color .4s var(--curva)}
.chip span:hover{border-color:rgba(255,255,255,.45)}
.chip input:checked+span{background:#fff;color:var(--tinta);border-color:#fff}
.chip input:checked+span::before{content:"";width:10px;height:10px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#FFE3B0 0 18%,#FFB03A 45%,#D9861A 100%)}
.chip input:focus-visible+span{outline:3px solid var(--dorado);outline-offset:3px}
.vista{display:flex;flex-direction:column;align-items:center;gap:22px;margin-top:40px}
.vista .asi{margin:0;font-size:13.5px;color:var(--lavanda)}
.burbuja{position:relative;max-width:440px;padding:12px 16px 22px;border-radius:14px 3px 14px 14px;background:#D9FDD3;color:#111B21;text-align:left;font-size:16px;line-height:1.45;box-shadow:0 20px 40px -20px rgba(0,0,0,.6)}
.burbuja small{position:absolute;right:12px;bottom:6px;font-size:11px;color:#667781}

/* ---------- Pie ---------- */
.pie{position:relative;background:#05011F;color:#CFCBEA;padding:88px 0 0;font-size:15px}
.pie::before{content:"";position:absolute;inset:0 0 auto 0;height:8px;background:
  repeating-linear-gradient(90deg,rgba(7,2,47,.8) 0 1px,transparent 1px 8px) 0 0/100% 4px no-repeat,var(--firma)}
.pie-grid{display:grid;grid-template-columns:minmax(0,3.4fr) repeat(3,minmax(0,2.5fr)) minmax(0,2.4fr);gap:36px}
.pie .marca{margin-bottom:20px}
.pie .desc{margin:0 0 18px;max-width:300px;line-height:1.6}
.pie .proyecto{display:flex;align-items:center;gap:7px;margin:0;font-size:14px;color:var(--lavanda)}
.pie .proyecto img{height:14px;width:auto;position:relative;top:1px}
.pie h2{margin:0 0 12px;font-family:var(--g);font-weight:600;font-size:16px;color:#fff;letter-spacing:0}
.pie ul{margin:0;padding:0;list-style:none}
.pie li a{display:inline-flex;align-items:center;min-height:44px;min-width:44px;line-height:1.3;color:#CFCBEA;text-decoration:none;transition:color .3s}
.pie li a:hover{color:#fff}
.pie address{font-style:normal;line-height:1.6}
.pie address a{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:#fff;text-decoration:none;font-weight:600}
.pie address a svg{width:20px;height:20px}
.pie-base{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:64px;padding:18px 0 22px;border-top:1px solid rgba(255,255,255,.08);font-size:13.5px;color:#8F8AB8}
.pie-base a{display:inline-flex;align-items:center;min-height:44px;color:#B7B2DE;text-decoration:none}

/* ---------- responsive de secciones ---------- */
@media (max-width:1180px){
  .h2{font-size:46px}
  .sec-cab{grid-template-columns:1fr;gap:20px;margin-bottom:52px}
  .caso-grande{grid-template-columns:1fr;gap:36px}
  .casos3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .casos3>:last-child{grid-column:span 2}
  .nosotros{grid-template-columns:1fr;gap:48px}
  .faq-grid{grid-template-columns:1fr;gap:36px}
  .faq-lado{position:static}
  .pie-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pie-grid>:first-child{grid-column:span 3}
  .calc{grid-template-columns:1fr;gap:26px}
  .pasos{grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
  .paso h3{font-size:20px}
}
@media (max-width:1024px){
  .s7,.s5{grid-column:span 12}
  .s4{grid-column:span 6}
  .t-full{grid-column:span 12}
  .giros{grid-template-columns:1fr}
  .giros li:nth-last-child(2) .giro{border-bottom:0}
  .ruta .cinta-h{display:none}
  .pasos{grid-template-columns:1fr;gap:0;margin:0;padding-left:0}
  .paso{position:relative;display:grid;grid-template-columns:46px minmax(0,1fr);column-gap:24px;padding-bottom:34px}
  .paso::before{content:"";position:absolute;left:18px;top:0;bottom:0;width:10px;border-radius:3px;background:var(--firma-v)}
  .paso:last-child::before{bottom:auto;height:46px}
  .paso .cab-paso{position:relative;grid-row:span 3;margin:0}
  .paso>*:not(.cab-paso){grid-column:2}
}
@media (max-width:767px){
  .env{padding:0 16px}
  .sec{padding:80px 0}
  .h2{font-size:clamp(32px,9.4vw,40px);line-height:1.05}
  .bajada{font-size:16.5px}
  .sec-cab{margin-bottom:40px}
  .bento{gap:14px}
  .s4,.s7,.s5,.t-full{grid-column:span 12}
  .srv{padding:24px;border-radius:24px}
  .srv h3{font-size:22px}
  .srv-agenda{flex-direction:column}
  .tel-mini{align-self:center;width:150px;margin:6px 0 -26px}
  .tel-mini .vidrio{height:220px}
  .srv-int{flex-direction:column;align-items:flex-start}
  .versus{grid-template-columns:1fr;grid-template-rows:auto 14px auto}
  .cinta-v{margin:0 24px;height:14px;background:var(--firma)}
  .cinta-v::before{inset:0 0 auto 0;width:auto;height:7px;background:repeating-linear-gradient(90deg,rgba(7,2,47,.75) 0 1.5px,transparent 1.5px 8px)}
  .lado-v{padding:28px 24px;border-radius:24px}
  .lado-v h3{font-size:24px}
  .lado-v li{font-size:16px}
  .calc{padding:26px 22px;border-radius:24px}
  .campos{grid-template-columns:1fr}
  .campo label{min-height:0}
  .resultado output{font-size:42px}
  .btn-wa.chico{align-self:stretch;justify-content:center}
  .caso-grande{padding:24px;border-radius:26px}
  .caso h3{font-size:25px}
  .casos3{grid-template-columns:1fr}
  .casos3>:last-child{grid-column:auto}
  .caso-c{padding:22px;border-radius:24px}
  .caso-c .escaparate{height:260px}
  .giro{padding:24px 0}
  .giro .nom{font-size:25px}
  .giro .flecha{width:44px;height:44px}
  .nosotros .h2,.faq-grid .h2{font-size:clamp(32px,9.4vw,40px)}
  .muro{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .muro li{height:88px;padding:16px}
  .cifras-claras .n{font-size:32px}
  .faq summary{font-size:17px;padding:18px 18px}
  .faq .resp{padding:0 18px 20px;font-size:15.5px}
  .cierre .h2{font-size:clamp(34px,10vw,44px)}
  .chip span{font-size:14.5px;padding:0 14px}
  .burbuja{font-size:15px}
  .pie{padding-top:64px}
  .pie-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 20px}
  .pie-grid>:first-child,.pie-grid>:last-child{grid-column:span 2}
}


/* ===== hilo conductor: un pedazo de cinta antes de cada título de sección ===== */
.h2::before{content:"";display:block;width:58px;height:12px;margin-bottom:24px;border-radius:2px;
  background:repeating-linear-gradient(90deg,rgba(7,2,47,.78) 0 1.5px,transparent 1.5px 6px) 0 0/100% 5px no-repeat,var(--firma)}
.cierre .h2::before{margin-left:auto;margin-right:auto}

/* ===== Clientes grandote (componente muro de adcenter.com.mx, sobre oscuro) ===== */
.clientes{padding-top:112px}
.muro-g{position:relative;overflow:hidden;border-radius:32px;background:#fff;padding:48px 56px 0;box-shadow:0 60px 120px -60px rgba(0,0,0,.8)}
.muro-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:30px 40px;margin:0;padding:0;list-style:none;max-height:600px;overflow:hidden}
.muro-grid li{display:grid;place-items:center;height:96px}
.muro-grid img{max-width:100%;max-height:72px;width:auto;height:auto;object-fit:contain}
.muro-g .muro-pie{position:relative;display:flex;justify-content:center;padding:28px 0 36px;margin-top:-104px;background:linear-gradient(rgba(255,255,255,0),#fff 62%);border-radius:0 0 32px 32px}
.btn-muro{min-height:48px;padding:0 26px;border-radius:999px;border:1px solid #D8D8D8;background:#fff;font-family:var(--g);font-weight:600;font-size:15px;color:var(--tinta);cursor:pointer;box-shadow:0 8px 22px rgba(9,0,85,.07);transition:background .4s var(--curva),color .4s var(--curva)}
.btn-muro:hover{background:var(--tinta);color:#fff}
.muro-g.abierto .muro-grid,html:not(.js) .muro-grid{max-height:none}
.muro-g.abierto .muro-pie{margin-top:0;background:none}
html:not(.js) .muro-pie{display:none}

/* ===== Familias de servicios ===== */
.todo{margin-top:96px}
.todo-tit{margin:0 0 8px;font-family:var(--g);font-weight:700;font-size:30px;letter-spacing:-.02em}
.todo-tit span{color:#7A74B5;font-weight:600}
.familia{display:grid;grid-template-columns:minmax(0,3.2fr) minmax(0,8.8fr);gap:40px;padding:36px 0;border-top:1px solid rgba(9,0,85,.12)}
.familia:last-child{border-bottom:1px solid rgba(9,0,85,.12)}
.fam-cab h3{margin:0 0 6px;font-family:var(--g);font-weight:700;font-size:22px;line-height:1.2;letter-spacing:-.015em}
.fam-cab p{margin:0 0 12px;font-size:15px;color:#4A4770}
.fam-cab .cuenta{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#3C3480}
.fam-cab .cuenta::before{content:"";width:26px;height:8px;border-radius:2px;background:repeating-linear-gradient(90deg,rgba(7,2,47,.7) 0 1px,transparent 1px 4px) 0 0/100% 4px no-repeat,var(--firma)}
.minis{display:flex;flex-wrap:wrap;gap:12px;margin:0;padding:0;list-style:none}
.minis li{flex:1 1 calc(25% - 9px);min-width:0}
.mini{display:flex;flex-direction:column;gap:4px;height:100%;min-height:44px;padding:16px 18px;border-radius:16px;background:var(--niebla);color:var(--tinta);text-decoration:none;transition:background .4s var(--curva),color .4s var(--curva),transform .4s var(--curva)}
.mini b{font-family:var(--g);font-weight:600;font-size:16.5px;line-height:1.25}
.mini span{font-size:14px;line-height:1.45;color:#5A5680;transition:color .4s var(--curva)}
.mini:hover{background:var(--tinta);color:#fff;transform:translateY(-2px)}
.mini:hover span{color:#CFCBEA}

/* ===== Así trabajamos: promesas ===== */
.promesas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 48px;margin:0 0 88px;padding:0;list-style:none}
.promesas li{position:relative;padding-left:30px}
.promesas .pin-punto{position:absolute;left:0;top:7px;width:13px;height:13px}
.promesas h3{margin:0 0 6px;font-family:var(--g);font-weight:700;font-size:21px;letter-spacing:-.015em}
.promesas p{margin:0;font-size:15.5px;line-height:1.55;color:#CFCBEA}
.ruta-tit{margin:0 0 24px;font-family:var(--g);font-weight:600;font-size:15px;color:var(--lavanda)}

/* ===== Reseñas (gigante, va y viene) ===== */
.resenas .g5{display:inline-flex;align-items:center;gap:6px;margin-right:6px;color:var(--tinta);font-weight:600}
.resenas .g5 svg{width:18px;height:18px}
.carril-wrap{display:flex;flex-direction:column;gap:20px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.carril{display:flex;gap:20px;width:max-content;animation:carril 140s linear infinite}
.carril.reversa{animation-direction:reverse}
.carril:hover,.carril:focus-within{animation-play-state:paused}
@keyframes carril{to{transform:translateX(-50%)}}
.resena{flex:none;width:440px;display:flex;flex-direction:column;gap:14px;padding:28px 30px;border-radius:24px;background:#fff;border:1px solid rgba(9,0,85,.07);color:var(--tinta)}
.resena .estrellas{display:flex;gap:2px;color:#FBBC05;font-size:18px;letter-spacing:1px}
.resena blockquote{margin:0;font-size:17px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.resena footer{display:flex;align-items:center;gap:10px;margin-top:auto;font-size:14px;color:#5A5680}
.resena footer b{font-family:var(--g);font-weight:600;color:var(--tinta);font-size:15px}
.resena footer svg{width:18px;height:18px;margin-left:auto}
.hueco-resenas{width:100%}
.hueco-resenas p{margin:0;padding:48px 40px;border-radius:24px;border:2px dashed #B9B3E6;background:repeating-linear-gradient(135deg,#fff 0 14px,#F7F6FC 14px 28px);text-align:center;font-size:16px;color:#3C3480}
.hueco-resenas code{font-size:14px;background:#EEEBFB;padding:2px 6px;border-radius:6px}
@media (prefers-reduced-motion:reduce){
  .carril{animation:none;width:auto;overflow-x:auto;padding:0 24px;scroll-snap-type:x mandatory}
  .resena{scroll-snap-align:start}
}

/* ===== Equipo ===== */
.equipo{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px;align-items:center}
.eq-fund{width:260px;height:auto;margin-bottom:32px}
.eq-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 24px;margin:0;padding:0;list-style:none}
.eq-grid li{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px}
.eq-grid img{width:132px;height:132px;border-radius:50%;object-fit:cover;margin-bottom:12px;box-shadow:0 0 0 1px rgba(255,255,255,.14),0 24px 40px -20px rgba(0,0,0,.8)}
.eq-grid b{font-family:var(--g);font-weight:600;font-size:16.5px}
.eq-grid span{font-size:13.5px;color:var(--lavanda);line-height:1.35}
.eq-grid li:nth-child(1) img,.eq-grid li:nth-child(2) img{box-shadow:0 0 0 3px var(--noche),0 0 0 5px rgba(255,176,58,.75)}

/* ===== Tecnologías ===== */
.tec-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
.tec-grid li{display:grid;place-items:center;height:84px;padding:6px 10px;border-radius:16px;background:#fff;border:1px solid rgba(9,0,85,.09)}
.tec-grid img{max-width:100%;max-height:56px;width:auto;height:auto}
.tec-grid .t-wa{display:flex;align-items:center;justify-content:center;gap:9px;font-family:var(--g);font-weight:600;font-size:17px;color:#1C1E21}
.tec-grid .t-wa svg{width:30px;height:30px}
.tec-grid .pendiente{border:1.5px dashed #C9C4EA;background:#FBFAFF}
.tec-grid .pendiente span{font-family:var(--g);font-weight:600;font-size:15px;color:#6F69A8;text-align:center;line-height:1.2}
.tec-grid .pendiente span::after{content:"logo en camino";display:block;margin-top:3px;font-family:var(--a);font-weight:500;font-size:11px;color:#9C97C8}

/* ===== Empresa matriz ===== */
.matriz{background:#fff;color:var(--tinta);padding:96px 0}
.matriz-in{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:36px;align-items:center;padding:36px 40px;border-radius:28px;background:var(--niebla)}
.matriz-in>img{height:30px;width:auto}
.matriz h2{margin:0 0 4px;font-family:var(--g);font-weight:700;font-size:24px;letter-spacing:-.015em}
.matriz p{margin:0;font-size:15.5px;color:#4A4770}
.btn-matriz{display:inline-flex;align-items:center;min-height:50px;padding:0 24px;border-radius:999px;background:var(--tinta);color:#fff;font-family:var(--g);font-weight:600;font-size:15.5px;text-decoration:none;transition:transform .5s var(--curva)}
.btn-matriz:hover{transform:translateY(-2px)}
#preguntas{padding-bottom:112px}

/* ===== Cierre: modo ===== */
.chips.modo{margin-top:32px}
.pregunta-chips{margin:30px 0 0;font-size:14px;color:var(--lavanda)}
.chips#chips{margin-top:14px}

/* ===== responsive de lo nuevo ===== */
@media (max-width:1180px){
  .muro-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
  .familia{grid-template-columns:1fr;gap:18px}
  .promesas{grid-template-columns:repeat(2,minmax(0,1fr))}
  .equipo{grid-template-columns:1fr;gap:48px}
}
@media (max-width:1024px){
  .muro-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 28px}
  .minis li{flex-basis:calc(50% - 6px)}
  .tec-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .matriz-in{grid-template-columns:1fr;gap:18px;justify-items:start}
}
@media (max-width:767px){
  .h2::before{width:48px;height:10px;margin-bottom:18px}
  .clientes{padding-top:80px}
  .muro-g{padding:28px 20px 0;border-radius:24px}
  .muro-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 16px;max-height:520px}
  .muro-grid li{height:64px}
  .muro-grid img{max-height:48px}
  .muro-g .muro-pie{padding:20px 0 26px;border-radius:0 0 24px 24px}
  .todo{margin-top:64px}
  .todo-tit{font-size:24px}
  .todo-tit span{display:block}
  .familia{padding:28px 0}
  .minis{gap:8px}
  .minis li{flex-basis:100%}
  .mini{padding:14px 16px}
  .promesas{grid-template-columns:1fr;gap:24px;margin-bottom:64px}
  .resena{width:300px;padding:22px}
  .resena blockquote{font-size:15.5px}
  .eq-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 12px}
  .eq-grid img{width:112px;height:112px}
  .eq-fund{width:200px}
  .tec-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .tec-grid li{height:64px;padding:4px 6px;border-radius:12px}
  .tec-grid .t-wa{font-size:13px;gap:5px}
  .tec-grid .t-wa svg{width:22px;height:22px}
  .tec-grid .pendiente span{font-size:12.5px}
  .tec-grid .pendiente span::after{font-size:9.5px}
  .matriz{padding:64px 0}
  .matriz-in{padding:26px 22px;border-radius:24px}
  .matriz h2{font-size:21px}
  .btn-matriz{align-self:stretch;justify-content:center;width:100%}
}


@media (max-width:480px){
  .minis li{flex-basis:calc(50% - 4px)}
  .mini span{display:none}
  .mini b{font-size:15px}
}

/* ===== WhatsApp flotante: visible desde el primer momento (regla de Fer) ===== */
.wa-flota{position:fixed;right:20px;bottom:20px;z-index:50;display:flex;align-items:center;gap:12px;min-height:64px;padding:7px 22px 7px 7px;border-radius:999px;background:#25D366;color:#fff;text-decoration:none;
  box-shadow:0 18px 36px -12px rgba(18,140,126,.55),0 2px 6px rgba(0,0,0,.18);transition:transform .5s var(--curva)}
.wa-flota:hover{transform:translateY(-3px)}
.wa-flota img{width:50px;height:50px;border-radius:50%;object-fit:cover;background:#fff;flex:none}
.wa-flota .txt{display:flex;flex-direction:column;line-height:1.2}
.wa-flota .txt b{font-family:var(--g);font-weight:600;font-size:15.5px}
.wa-flota .txt small{font-size:12.5px;opacity:.92}
.wa-flota svg{width:28px;height:28px;flex:none}
.wa-flota::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 0 rgba(37,211,102,.55);animation:anillo 2.4s var(--curva) 3}
@keyframes anillo{to{box-shadow:0 0 0 16px rgba(37,211,102,0)}}
.globo{position:fixed;right:20px;bottom:100px;z-index:50;max-width:290px;padding:16px 40px 16px 18px;border-radius:18px 18px 4px 18px;background:#fff;color:#111B21;font-size:15px;line-height:1.45;box-shadow:0 24px 50px -20px rgba(7,2,47,.55);
  opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .4s var(--curva),transform .5s var(--curva)}
.globo b{font-family:var(--g);font-weight:600}
.globo.ver{opacity:1;transform:none;pointer-events:auto}
.globo button{position:absolute;top:4px;right:4px;width:44px;height:44px;border:0;background:none;font-size:22px;line-height:1;color:#667781;cursor:pointer}
@media (max-width:767px){
  .wa-flota{right:16px;bottom:16px;min-height:0;padding:0;width:62px;height:62px;justify-content:center}
  .wa-flota .txt,.wa-flota img{display:none}
  .wa-flota svg{width:34px;height:34px}
  .globo{right:16px;bottom:90px}
}
@media (max-width:480px){.globo{display:none}}
@media (prefers-reduced-motion:reduce){.wa-flota::after{animation:none}}
@media (max-width:360px){.btn-wa-mini,.btn-menu{width:44px;height:44px}}
/* ===== integración de activos reales ===== */
.muro-grid li{height:auto}
.muro-grid img{width:100%;max-width:220px;max-height:none;height:auto}
.resena{gap:16px}
.r-cab{display:flex;align-items:center;gap:12px}
.r-ini{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--tinta);color:#fff;font-family:var(--g);font-weight:700;font-size:16px;flex:none}
.r-cab>span:nth-child(2){display:flex;flex-direction:column;min-width:0}
.r-cab b{font-family:var(--g);font-weight:600;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.r-cab small{font-size:13px;color:#6B6890}
.r-cab .estrellas{margin-left:auto}
.resena blockquote small{font-size:12.5px;color:#8A86AE}
.resena footer{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:14px;border-top:1px solid rgba(9,0,85,.08);font-size:12.5px;color:#6B6890}
.resena footer svg{width:16px;height:16px;margin:0}
.resena footer a{margin-left:auto;display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:var(--tinta);text-decoration:none}
.fuente-resenas{margin:28px 0 0;font-size:13.5px;color:#6B6890;max-width:760px}
.bts{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,220px)) minmax(0,1fr);gap:24px;align-items:end;margin-top:24px}
.bts figure{margin:0}
.bts img{width:100%;height:auto;border-radius:22px;box-shadow:0 30px 60px -30px rgba(0,0,0,.8)}
.bts figcaption{margin-top:10px;font-size:13.5px;color:var(--lavanda)}
.bts p{margin:0 0 30px;max-width:420px;font-size:18px;line-height:1.55;color:#CFCBEA}
.bts p b{color:#fff;font-weight:600}
.eq-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.tec-grupos{display:grid;gap:34px}
.tec-grupo h3{margin:0 0 14px;font-family:var(--g);font-weight:600;font-size:16px;color:#4A4770}
.tec-grupo .tec-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.tec-grupo .tec-grid li{display:flex;align-items:center;justify-content:flex-start;gap:12px;height:60px;padding:0 16px;border-radius:14px;background:#fff;border:1px solid rgba(9,0,85,.09)}
.tec-grupo .tec-grid img{width:28px;height:28px;max-height:none;flex:none;object-fit:contain}
.tec-grupo .tec-grid span{font-family:var(--g);font-weight:600;font-size:15px;color:var(--tinta);line-height:1.2}
.tec-grupo .sin-logo{border-style:dashed}
.tec-grupo .sin-logo::before{content:"";width:28px;height:28px;border-radius:8px;flex:none;background:repeating-linear-gradient(90deg,rgba(7,2,47,.7) 0 1px,transparent 1px 4px) 0 0/100% 7px no-repeat,var(--firma)}
@media (max-width:1180px){.bts{grid-template-columns:repeat(2,minmax(0,1fr));}.bts p{grid-column:1/-1;margin:0}}
@media (max-width:767px){
  .muro-grid img{max-width:150px}
  .eq-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bts{gap:14px}
  .bts p{font-size:16px}
  .tec-grupo .tec-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .tec-grupo .tec-grid li{height:54px;padding:0 12px;gap:10px}
  .tec-grupo .tec-grid img{width:24px;height:24px}
  .tec-grupo .tec-grid span{font-size:14px}
  .r-cab .estrellas{font-size:14px}
}

.tec-grupo .tec-grid img[src$="kommo.svg"],.tec-grupo .tec-grid img[src$="mercado-libre.svg"]{width:auto;height:18px;max-width:84px}

/* =====================================================================
   KIT · plantillas internas (familia, subsolución, giros, conversión, soporte, blog)
   ===================================================================== */
.hero-int{min-height:0;padding-bottom:150px}
.hero-int .hero-in{grid-template-columns:minmax(0,640px) minmax(0,1fr);padding-top:40px;align-items:center}
.hero-int .hero-in.uno{grid-template-columns:minmax(0,860px)}
.hero-int .titular{font-size:62px;line-height:1.02}
.titular .grad{background:var(--firma);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.hero-int .fundadores{margin-top:40px}
.titular-blog{font-size:52px;margin:0}
.meta-post{margin:18px 0 0;font-size:15px;color:var(--lavanda)}
.migas ol{display:flex;flex-wrap:wrap;gap:6px 10px;margin:0 0 22px;padding:0;list-style:none;font-size:13.5px;color:var(--lavanda)}
.migas li{display:flex;align-items:center;gap:10px}
.migas li+li::before{content:"";width:5px;height:5px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);opacity:.6}
.migas a{display:inline-flex;align-items:center;min-height:44px;color:#DDDAF3;text-decoration:none}
.migas a:hover{color:#fff}
.migas [aria-current]{color:#fff;font-weight:600}
.hero-visual{position:relative}
.rotulo-real{display:flex;align-items:center;gap:8px;margin:0 0 12px;font-size:13px;color:var(--lavanda)}
.rotulo-real i{width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.12)}
.rotulo-real b{color:#fff}
.marco.oscuro{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.13)}
.pines-hero{display:grid;gap:14px;margin:0;padding:28px 30px;border-radius:28px;list-style:none;background:rgba(255,255,255,.05);border:1px dashed rgba(183,178,222,.35)}
.pines-hero li{display:flex;align-items:center;gap:14px;padding:14px 18px;border-radius:14px;background:#fff;color:var(--tinta);font-family:var(--g);font-weight:600;font-size:17px;box-shadow:0 14px 30px -18px rgba(0,0,0,.7)}
.mas-info{margin:28px 0 0}
.h2-chico{margin:0 0 20px;font-family:var(--g);font-weight:700;font-size:26px;letter-spacing:-.015em}
.sec-problema .dolores{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.sec-problema .dolores li{padding:26px 28px;border-radius:22px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}
.sec-problema .dolores h3{margin:0 0 8px;font-family:var(--g);font-weight:700;font-size:20px;color:#fff}
.sec-problema .dolores p{margin:0;color:#CFCBEA;font-size:15.5px;line-height:1.55}
.beneficios-lista,.tarjetas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 40px;margin:0;padding:0;list-style:none}
.beneficios-lista li,.tarjetas li{position:relative;padding-left:30px}
.beneficios-lista .pin-punto,.tarjetas .pin-punto{position:absolute;left:0;top:7px;width:13px;height:13px}
.beneficios-lista h3,.tarjetas h3{margin:0 0 6px;font-family:var(--g);font-weight:700;font-size:20px;letter-spacing:-.015em}
.beneficios-lista p,.tarjetas p{margin:0;font-size:15.5px;line-height:1.55;color:#4A4770}
.sec-noche .beneficios-lista p,.sec-noche .tarjetas p{color:#CFCBEA}
.funciones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none}
.funcion{display:flex;flex-direction:column;gap:6px;padding:22px 24px;border-radius:20px;background:var(--niebla)}
.sec-niebla .funcion{background:#fff}
.funcion b{font-family:var(--g);font-weight:600;font-size:18px}
.funcion span{font-size:15px;line-height:1.5;color:#4A4770}
.demo{position:relative;border-radius:24px;background:#fff;border:1px solid rgba(9,0,85,.1);overflow:hidden;box-shadow:0 40px 70px -40px rgba(7,2,47,.45)}
.demo.es-demo{background:repeating-linear-gradient(135deg,#fff 0 16px,#FBFAFF 16px 32px)}
.rotulo-demo{position:absolute;top:14px;right:14px;z-index:2;display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;background:#FFF3C4;border:1px dashed #D9A400;font-size:12.5px;font-weight:700;color:#6A4E00}
.demo-barra{display:flex;gap:7px;padding:14px 18px;border-bottom:1px solid rgba(9,0,85,.08);background:var(--niebla)}
.demo-barra i{width:9px;height:9px;border-radius:50%;background:#D3D0E4}
.demo-filas{margin:0;padding:10px 22px 22px;list-style:none}
.demo-filas li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:20px;padding:14px 0;border-bottom:1px solid rgba(9,0,85,.07);font-size:15px}
.demo-filas b{font-family:var(--g);font-weight:600}
.demo-filas span{color:#4A4770}
.tabla-comp{overflow-x:auto;border-radius:24px;background:#fff}
.tabla-comp table{width:100%;border-collapse:collapse;color:var(--tinta)}
.tabla-comp th,.tabla-comp td{padding:18px 24px;text-align:left;vertical-align:top;border-bottom:1px solid rgba(9,0,85,.08);font-size:15.5px;line-height:1.5}
.tabla-comp th{width:32%;font-family:var(--g);font-weight:600}
.giros-det{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 40px;margin:0;padding:0;list-style:none}
.giro-det{padding:24px 0;border-top:1px solid rgba(9,0,85,.12);scroll-margin-top:24px}
.giro-det h2{margin:0 0 8px;font-family:var(--g);font-weight:700;font-size:24px;letter-spacing:-.02em}
.giro-det p{margin:0;font-size:15.5px;line-height:1.55;color:#4A4770}
.relacionadas{padding:72px 0}
.relacionadas .minis li{flex-basis:calc(25% - 9px)}
.prosa{max-width:760px}
.prosa-sec .env.prosa{max-width:1280px}
.articulo{font-size:18px;line-height:1.75;color:#25214F}
.articulo h2{margin:48px 0 14px;font-family:var(--g);font-weight:700;font-size:32px;line-height:1.15;letter-spacing:-.02em;color:var(--tinta)}
.articulo h3{margin:32px 0 10px;font-family:var(--g);font-weight:700;font-size:23px;color:var(--tinta)}
.articulo p{margin:0 0 18px}
.articulo ul,.articulo ol{margin:0 0 20px;padding-left:22px}
.articulo li{margin-bottom:8px}
.articulo a{color:var(--tinta);font-weight:600;text-decoration-color:#A652FF;text-underline-offset:4px}
.articulo table{width:100%;border-collapse:collapse;margin:8px 0 26px;font-size:15.5px}
.articulo th,.articulo td{padding:12px 14px;border-bottom:1px solid rgba(9,0,85,.1);text-align:left}
.articulo th{font-family:var(--g);background:var(--niebla)}
.articulo>p:first-child{font-size:20px;line-height:1.65;color:var(--tinta)}
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.post-card{display:flex;flex-direction:column;gap:8px;height:100%;padding:26px;border-radius:22px;background:var(--niebla);color:var(--tinta);text-decoration:none;transition:transform .5s var(--curva),background .5s var(--curva)}
.post-card:hover{transform:translateY(-3px);background:#ECEAF8}
.post-card small{font-size:13px;color:#6B6890}
.post-card b{font-family:var(--g);font-weight:700;font-size:21px;line-height:1.2}
.post-card span{font-size:15px;line-height:1.5;color:#4A4770}
.posts .vacio{grid-column:1/-1;padding:40px;border-radius:22px;border:1.5px dashed #C9C4EA;color:#4A4770;text-align:center}
.cta-sec .env{display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.btn-claro{background:var(--tinta);color:#fff}
.btn-claro .wa-ico{background:none}
.sin-captura{display:grid;place-items:center;width:84%;height:200px;border-radius:20px;border:1.5px dashed #B9B3E6;background:repeating-linear-gradient(135deg,#fff 0 14px,#F7F6FC 14px 28px);font-family:var(--g);font-weight:600;color:#6F69A8}
.caso-cliente{margin:0 0 14px;font-family:var(--g);font-weight:600;font-size:15px;color:#5B4FC4}
.lista-casos{display:grid;gap:20px}
.lista-casos .caso-grande{margin:0}
.lista-casos .caso-grande .sin-captura{width:100%;height:260px}
.ruta .cinta-h .avance{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,2,47,0),rgba(255,255,255,.35));transform-origin:left;transform:scaleX(1);mix-blend-mode:soft-light}
.pasos-4{grid-template-columns:repeat(4,minmax(0,1fr))}.pasos-6{grid-template-columns:repeat(6,minmax(0,1fr))}.pasos-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.beneficios .sec-cab{margin-bottom:48px}

/* ===== animaciones de entrada (las arma el JS; sin JS todo se ve) ===== */
.rv-armado .rv{opacity:0;transform:translateY(26px)}
.rv-armado .rv.rv-ok{opacity:1;transform:none;transition:opacity .8s var(--curva),transform .9s var(--curva)}
.ruta.arma .paso .cab-paso{transform:scale(.4);opacity:0}
.ruta.arma .paso h3,.ruta.arma .paso p{opacity:0;transform:translateY(12px)}
.ruta.arma .cinta-h{clip-path:inset(0 100% 0 0)}
.ruta.arma.vamos .cinta-h{clip-path:inset(0 0 0 0);transition:clip-path 1.6s var(--corte)}
.ruta.arma.vamos .paso .cab-paso{transform:none;opacity:1;transition:transform .6s var(--curva),opacity .4s}
.ruta.arma.vamos .paso h3,.ruta.arma.vamos .paso p{opacity:1;transform:none;transition:opacity .6s var(--curva),transform .7s var(--curva)}
.ruta.arma.vamos .paso:nth-child(1) *{transition-delay:.2s}.ruta.arma.vamos .paso:nth-child(2) *{transition-delay:.5s}.ruta.arma.vamos .paso:nth-child(3) *{transition-delay:.8s}
.ruta.arma.vamos .paso:nth-child(4) *{transition-delay:1.1s}.ruta.arma.vamos .paso:nth-child(5) *{transition-delay:1.4s}.ruta.arma.vamos .paso:nth-child(6) *{transition-delay:1.7s}
@media (prefers-reduced-motion:reduce){.rv-armado .rv{opacity:1;transform:none}.ruta.arma .paso *,.ruta.arma .cinta-h{opacity:1!important;transform:none!important;clip-path:none!important}}

@media (max-width:1100px){
  .hero-int .titular{font-size:50px}
  .beneficios-lista,.tarjetas,.funciones{grid-template-columns:repeat(2,minmax(0,1fr))}
  .posts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .relacionadas .minis li{flex-basis:calc(50% - 6px)}
}
@media (max-width:900px){
  .hero-int .hero-in{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:767px){
  .hero-int{padding-bottom:116px}
  .hero-int .hero-in{padding-top:28px}
  .hero-int .titular{font-size:clamp(32px,9.6vw,40px)}
  .titular-blog{font-size:clamp(30px,8.6vw,38px)}
  .sec-problema .dolores,.beneficios-lista,.tarjetas,.funciones,.giros-det,.posts{grid-template-columns:1fr}
  .demo-filas li{grid-template-columns:1fr;gap:4px}
  .tabla-comp th,.tabla-comp td{display:block;width:auto;padding:12px 18px}
  .tabla-comp th{padding-bottom:0;border:0}
  .articulo{font-size:17px}
  .articulo h2{font-size:26px}
  .pines-hero{padding:18px}
  .pines-hero li{font-size:15px;padding:12px 14px}
  .relacionadas .minis li{flex-basis:100%}
  .pasos-4,.pasos-6,.pasos-3{grid-template-columns:1fr}
}

/* ===== giros (página única), saltos y últimos artículos ===== */
.saltos{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.saltos a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;background:#fff;border:1px solid rgba(9,0,85,.12);color:var(--tinta);font-family:var(--g);font-weight:600;font-size:14.5px;text-decoration:none;transition:background .4s var(--curva),color .4s var(--curva)}
.saltos a:hover{background:var(--tinta);color:#fff}
.sec-niebla .saltos a{background:#fff}
.giros-bloques{display:grid;gap:14px}
.giro-bloque{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:36px;padding:32px 34px;border-radius:26px;background:#fff;border:1px solid rgba(9,0,85,.08);scroll-margin-top:20px}
.sec-blanca .giro-bloque{background:var(--niebla);border-color:transparent}
.giro-bloque h2{margin:10px 0 10px;font-family:var(--g);font-weight:700;font-size:26px;line-height:1.15;letter-spacing:-.02em;color:var(--tinta)}
.giro-bloque .gb-izq p{margin:0;font-size:16px;line-height:1.6;color:#4A4770}
.gb-der{padding-left:28px;border-left:2px dashed #D6D1F2}
.gb-der h3{margin:0 0 8px;font-family:var(--g);font-weight:600;font-size:15px;color:#5B4FC4}
.gb-der p{margin:0 0 14px;font-size:15.5px;line-height:1.55;color:var(--tinta)}
.gb-sols{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px;padding:0;list-style:none}
.gb-sols a{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:999px;background:var(--tinta);color:#fff;font-family:var(--g);font-weight:600;font-size:14px;text-decoration:none}
.giro-caso{display:flex;gap:10px;align-items:baseline;margin:0;font-size:14.5px;color:#3C3480}
.giro-caso a{color:var(--tinta);font-weight:700;white-space:nowrap}
.badge-respaldo{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:999px;font-size:12.5px;font-weight:700}
.r-caso-real{background:#E3F7E6;color:#1F7A3A}
.r-proyecto-relacionado{background:#EEEBFB;color:#3C3480}
.r-sin-caso-aun{background:#F1F0F5;color:#6B6890;border:1px dashed #C9C4EA}
.ultimos{padding:96px 0}
@media (max-width:900px){.giro-bloque{grid-template-columns:1fr;gap:18px}.gb-der{padding-left:0;border-left:0;padding-top:16px;border-top:2px dashed #D6D1F2}}
@media (max-width:767px){.giro-bloque{padding:24px 20px;border-radius:22px}.giro-bloque h2{font-size:22px}.ultimos{padding:72px 0}}

/* ===== variantes de tarjetas del contrato ===== */
.beneficios-lista .con-enlace a{display:block;color:inherit;text-decoration:none}
.beneficios-lista .con-enlace a:hover h3{text-decoration:underline;text-decoration-color:#A652FF;text-underline-offset:4px}
.beneficios-lista .badge-respaldo{margin:0 0 8px}
.para-quien{margin-top:8px!important;font-size:14.5px!important}
.para-quien b{color:var(--tinta);font-weight:600}
.sec-noche .para-quien b{color:#fff}
.funcion a{display:flex;flex-direction:column;gap:6px;color:inherit;text-decoration:none}
.funcion-wa{display:inline-flex;align-items:center;gap:8px;margin-top:6px;font-family:var(--g);font-weight:600;color:#128C7E!important}
.funcion-wa .wa-ico{width:22px;height:22px}
.cta-botones{display:flex;flex-wrap:wrap;gap:14px}
.btn-borde{background:transparent;color:var(--tinta);box-shadow:inset 0 0 0 1.5px var(--tinta)}
.caso-texto{grid-template-columns:1fr}
.medidas-caso{margin-top:28px}
.calc-gen .campos-gen{grid-template-columns:repeat(3,minmax(0,1fr))}
.calc .formula{margin-top:16px;font-size:13.5px;color:var(--lavanda)}
.calc .formula summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:600;color:#DDDAF3}
.calc .formula p{margin:0;line-height:1.55}
html:not(.js) .calc-gen{display:grid}
html:not(.js) .calc-gen [data-salida]{display:none}
.tabla-comp thead th{background:var(--niebla);font-family:var(--g)}
.tabla-comp .col-propio{background:#F6F2FF}
.saltos-wa a{gap:8px}
@media (max-width:767px){.calc-gen .campos-gen{grid-template-columns:1fr}.cta-botones .btn-wa{width:100%;justify-content:center}}
.tabla-scroll{overflow-x:auto;margin:8px 0 26px;-webkit-overflow-scrolling:touch}
.tabla-scroll table{margin:0;min-width:520px}
.articulo{overflow-wrap:anywhere}
.grupos-lado{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.grupo-lado{padding:28px;border-radius:24px;background:#fff;color:var(--tinta)}
.grupo-lado h3{margin:0 0 16px;font-family:var(--g);font-weight:700;font-size:21px}
.grupo-lado ul{margin:0;padding:0;list-style:none;display:grid;gap:14px}
.grupo-lado li{display:flex;gap:12px;align-items:baseline;font-size:15.5px;line-height:1.5}
.grupo-lado li b{font-weight:600}
.g-no,.g-baja{background:rgba(255,255,255,.06);color:#DDDAF3;border:1px solid rgba(255,255,255,.12)}
.g-no h3,.g-baja h3{color:#fff}
.lado-v li div b{font-weight:600}
.en-oscuro p{color:#CFCBEA}
.en-oscuro h3{color:#fff}

/* =====================================================================
   RONDA 2 (revisión de Fer 1)
   ===================================================================== */
/* lockup Ad Center Software */
.lockup{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-height:44px;justify-content:center;text-decoration:none;flex:none;padding-left:10px}
.lockup img{height:24px;width:auto;display:block}
.lockup .lk-sw{position:relative;font-family:var(--g);font-weight:600;font-size:12.5px;letter-spacing:.32em;text-transform:uppercase;color:#fff;padding-left:2px;line-height:1}
.lockup .lk-sw::after{content:"";display:inline-block;width:26px;height:6px;margin-left:8px;vertical-align:1px;border-radius:1px;background:repeating-linear-gradient(90deg,rgba(7,2,47,.8) 0 1px,transparent 1px 4px) 0 0/100% 3px no-repeat,var(--firma)}
.pie .lockup{padding-left:0;margin-bottom:18px}
.pie .lockup img{height:30px}

/* mega menú */
.menu{align-items:center}
.menu>li{position:relative}
.con-mega>.mm-boton{display:flex;align-items:center;gap:7px}
.con-mega>.mm-boton i{width:7px;height:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .4s var(--curva)}
.mega{position:absolute;top:calc(100% + 14px);left:50%;z-index:60;width:min(1040px,calc(100vw - 48px));transform:translate(-36%,8px);
  background:#fff;color:var(--tinta);border-radius:24px;box-shadow:0 40px 80px -30px rgba(7,2,47,.6),0 0 0 1px rgba(9,0,85,.06);
  opacity:0;visibility:hidden;transition:opacity .35s var(--curva),transform .45s var(--curva),visibility 0s .35s}
#mega-giros{width:min(760px,calc(100vw - 48px));transform:translate(-44%,8px)}
.mega::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.con-mega:hover>.mega,.con-mega:focus-within>.mega,.con-mega.abierto>.mega{opacity:1;visibility:visible;transform:translate(-36%,0);transition:opacity .35s var(--curva),transform .45s var(--curva)}
.con-mega:hover>#mega-giros,.con-mega:focus-within>#mega-giros,.con-mega.abierto>#mega-giros{transform:translate(-44%,0)}
.con-mega:hover>.mm-boton i,.con-mega.abierto>.mm-boton i{transform:rotate(225deg) translateY(-1px)}
.mega-in{display:grid;gap:8px 24px;padding:26px 28px 18px}
.mm-servicios{grid-template-columns:repeat(5,minmax(0,1fr))}
.mm-giros{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr)}
.mm-col-2 ul{columns:2;column-gap:20px}
.mega .mm-fam{display:block;border-radius:0;margin:0 0 10px;padding-bottom:10px;border-bottom:1px solid rgba(9,0,85,.1);font-family:var(--g);font-weight:700;font-size:15px;color:var(--tinta);text-decoration:none}
.mega a.mm-fam:hover{color:#6B3FD8;background:none}
.mega ul{margin:0;padding:0;list-style:none}
.mega li a{display:flex;align-items:center;gap:9px;min-height:36px;padding:4px 8px;margin:0 -8px;border-radius:10px;font-family:var(--a);font-weight:500;font-size:14px;line-height:1.25;color:#2E2A5C;text-decoration:none;break-inside:avoid;transition:background .25s}
.mega li a:hover{background:var(--niebla);color:var(--tinta)}
.ico-mm{width:22px;height:22px;flex:none}
.mm-pie{display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;padding:14px 28px;border-top:1px solid rgba(9,0,85,.08);background:var(--niebla);border-radius:0 0 24px 24px;font-family:var(--g);font-weight:600;font-size:14px}
.mm-pie a{color:var(--tinta);text-decoration:none;min-height:36px;display:inline-flex;align-items:center}
.mm-pie a:hover{color:#6B3FD8}
.mm-pie .mm-wa{margin-left:auto;gap:8px;padding:0 16px;border-radius:999px;background:var(--tinta);color:#fff}
.mm-pie .mm-wa:hover{color:#fff}
.mm-pie .mm-wa .wa-ico{width:20px;height:20px}
/* panel celular */
.panel{overflow-y:auto;padding:88px 22px 28px;gap:6px}
.pn-tit{margin:0 0 4px;font-family:var(--g);font-weight:600;font-size:13px;letter-spacing:.02em;color:var(--lavanda)}
.pn-fams details{border-bottom:1px solid rgba(183,178,222,.14)}
.pn-fams summary{display:flex;align-items:center;justify-content:space-between;min-height:54px;font-family:var(--g);font-weight:600;font-size:21px;color:#fff;cursor:pointer;list-style:none}
.pn-fams summary::-webkit-details-marker{display:none}
.pn-fams summary::after{content:"";width:9px;height:9px;border-right:1.8px solid #fff;border-bottom:1.8px solid #fff;transform:rotate(45deg);transition:transform .4s var(--curva)}
.pn-fams details[open] summary::after{transform:rotate(225deg)}
.pn-fams ul{margin:0 0 12px;padding:0;list-style:none}
.pn-fams li a{display:flex;align-items:center;gap:10px;min-height:44px;font-size:16px;color:#DDDAF3;text-decoration:none}
.panel .pn-links{margin:10px 0 18px;padding:0;list-style:none}
.panel .pn-links li{overflow:visible;border-bottom:1px solid rgba(183,178,222,.14)}
.panel .pn-links li a{display:block;padding:12px 0;font-family:var(--g);font-weight:600;font-size:21px;color:#fff;text-decoration:none;transform:none}
.panel .btn-wa{margin-top:auto}

/* "tu propio software": degradado vivo */
.grad-vivo{color:#fff}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .grad-vivo{background:linear-gradient(100deg,#fff 0%,#E7D3FF 12%,#A652FF 30%,#D77FB0 50%,#FFB03A 68%,#FFE3B0 80%,#fff 100%) 0 0/250% 100%;
    -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;background-position:100% 0}
  .js .grad-vivo{animation:grad-vivo 7s cubic-bezier(.45,0,.2,1) .4s infinite alternate}
}
@keyframes grad-vivo{0%{background-position:100% 0}100%{background-position:0 0}}
@media (prefers-reduced-motion:reduce){.js .grad-vivo{animation:none;background-position:50% 0}}

/* "Una empresa de Ad Center México" */
.una-empresa b{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.una-empresa b img{height:16px;width:auto;position:relative;top:1px}
.fundadores .una-empresa span{display:block}

/* franja de clientes tras el hero (páginas internas) */
.franja-clientes{background:#fff;padding:26px 0;border-bottom:1px solid rgba(9,0,85,.07)}
.fc-in{display:grid;grid-template-columns:minmax(0,250px) minmax(0,1fr);gap:28px;align-items:center}
.fc-in p{margin:0;font-family:var(--g);font-weight:600;font-size:15px;line-height:1.35;color:var(--tinta)}
.fc-tira{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.fc-tren{display:flex;align-items:center;gap:44px;width:max-content;margin:0;padding:0;list-style:none;animation:carril 70s linear infinite}
.fc-tren img{height:46px;width:auto;max-width:130px;object-fit:contain}
@media (prefers-reduced-motion:reduce){.fc-tren{animation:none}}

/* muro estilizado: celdas con línea de corte, logos grandes y parejos */
.muro-g{padding:0;background:#fff;border-radius:32px}
.muro-grid{gap:0;grid-template-columns:repeat(6,minmax(0,1fr));max-height:640px}
.muro-grid li{position:relative;height:128px;padding:22px 26px;display:grid;place-items:center;border-right:1px solid #EEECF7;border-bottom:1px solid #EEECF7;transition:background .4s var(--curva)}
.muro-grid li:nth-child(6n){border-right:0}
.muro-grid li:hover{background:#FBFAFF}
.muro-grid li::after{content:"";position:absolute;right:-3px;bottom:-3px;width:5px;height:5px;border-radius:50%;background:#E3DEF7}
.muro-grid img{max-width:150px;max-height:62px;width:100%;height:auto;object-fit:contain;filter:saturate(1.05)}
.muro-g .muro-pie{margin-top:-140px;padding:40px 0 34px}

/* reseñas compactas, alto parejo, leer más */
.resena{width:330px;height:236px;padding:20px 22px;gap:10px;border-radius:20px;overflow:hidden}
.resena .r-cab{gap:10px}
.resena .r-ini{width:38px;height:38px;font-size:14px}
.resena .r-cab b{font-size:15px}
.resena .r-g{width:18px;height:18px;margin-left:auto;flex:none}
.resena .estrellas{font-size:15px;letter-spacing:1px;color:#FBBC05}
.resena blockquote{font-size:15px;line-height:1.5;-webkit-line-clamp:4}
.leer-mas{align-self:flex-start;margin-top:auto;min-height:32px;padding:0;border:0;background:none;font-family:var(--g);font-weight:600;font-size:14px;color:#6B3FD8;cursor:pointer}
.resena.abierta{height:auto;min-height:236px}
.resena.abierta blockquote{-webkit-line-clamp:unset;display:block}
.carril{align-items:flex-start}
.carril-wrap:has(.abierta) .carril{animation-play-state:paused}

/* dónde estamos (en lugar de equipo) */
.ubicacion{padding:104px 0}
.ub-in{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:56px;align-items:center}
.ub-acciones{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin-top:28px}
.ub-tarjeta{border-radius:28px;background:var(--noche);overflow:hidden;box-shadow:0 40px 70px -40px rgba(7,2,47,.6)}
.ub-mapa{position:relative;height:220px;background:
  linear-gradient(rgba(183,178,222,.09) 1px,transparent 1px) 0 0/28px 28px,linear-gradient(90deg,rgba(183,178,222,.09) 1px,transparent 1px) 0 0/28px 28px,#0D0742}
.ub-calle{position:absolute;background:rgba(255,255,255,.14);border-radius:6px}
.ub-calle.c1{left:-10%;right:-10%;top:58%;height:12px;transform:rotate(-8deg)}
.ub-calle.c2{top:-10%;bottom:-10%;left:38%;width:10px;transform:rotate(14deg)}
.ub-calle.c3{left:52%;right:-10%;top:24%;height:8px;transform:rotate(18deg);background:rgba(255,255,255,.08)}
.ub-pin{position:absolute;left:44%;top:30%;width:26px;height:26px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:radial-gradient(circle at 35% 30%,#FFE3B0 0 18%,#FFB03A 45%,#D9861A 100%);box-shadow:0 10px 20px rgba(0,0,0,.4)}
.ub-pin i{position:absolute;left:8px;top:8px;width:10px;height:10px;border-radius:50%;background:var(--noche)}
.ub-tarjeta p{display:flex;flex-direction:column;gap:3px;margin:0;padding:20px 24px 24px;color:#CFCBEA;font-size:15px}
.ub-tarjeta p b{font-family:var(--g);font-weight:700;font-size:18px;color:#fff}

/* tecnologías ligeras */
.tecno{padding:104px 0}
.tec-ligera{display:grid;gap:0;border-top:1px solid rgba(9,0,85,.1)}
.tg{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:24px;padding:20px 0;border-bottom:1px solid rgba(9,0,85,.1);align-items:baseline}
.tg h3{margin:0;font-family:var(--g);font-weight:600;font-size:15px;color:#6B6890}
.tg ul{display:flex;flex-wrap:wrap;gap:10px 26px;margin:0;padding:0;list-style:none}
.tg li{display:inline-flex;align-items:center;gap:8px;font-family:var(--g);font-weight:600;font-size:15px;color:var(--tinta)}
.tg li img{width:20px;height:20px;object-fit:contain;filter:grayscale(1) opacity(.75);transition:filter .3s}
.tg li:hover img{filter:none}
.tec-sin{display:inline-block;width:16px;height:6px;border-radius:1px;background:repeating-linear-gradient(90deg,rgba(7,2,47,.7) 0 1px,transparent 1px 4px) 0 0/100% 3px no-repeat,var(--firma)}

/* cierre de un solo botón */
.cierre-uno .env{display:flex;flex-direction:column;align-items:center;text-align:center}
.btn-gigante{margin-top:38px;height:72px;padding:0 38px 0 26px;font-size:20px;gap:14px}
.btn-gigante .wa-ico{width:34px;height:34px}
.cierre-nota{margin:22px 0 0;font-size:14px;color:var(--lavanda)}

/* comparativo paquete contra a la medida */
.vs{display:grid;gap:0;border-radius:28px;overflow:hidden;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}
.vs-cab,.vs-fila{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr) minmax(0,1.15fr)}
.vs-cab>div,.vs-fila>div{padding:18px 24px}
.vs-h{display:flex;flex-direction:column;gap:6px;padding-top:26px!important;padding-bottom:22px!important}
.vs-h b{font-family:var(--g);font-weight:700;font-size:22px;letter-spacing:-.015em}
.vs-tag{align-self:flex-start;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:700}
.vs-a.vs-h .vs-tag{background:rgba(255,255,255,.08);color:#B7B2DE}
.vs-b.vs-h .vs-tag{background:#F1E6FF;color:#5B2BB5}
.vs-a{color:#A9A4CF}
.vs-a.vs-h b{color:#D9D6EE}
.vs-b{position:relative;background:#fff;color:var(--tinta)}
.vs-cinta{position:absolute;left:0;right:0;top:0;height:10px;background:repeating-linear-gradient(90deg,rgba(7,2,47,.75) 0 1px,transparent 1px 6px) 0 0/100% 5px no-repeat,var(--firma)}
.vs-fila{border-top:1px solid rgba(255,255,255,.08)}
.vs-fila .vs-b{border-top:1px solid rgba(9,0,85,.07)}
.vs-crit{font-family:var(--g);font-weight:600;font-size:15px;color:#fff}
.vs-fila .vs-a,.vs-fila .vs-b{display:flex;gap:12px;align-items:baseline;font-size:16px;line-height:1.45}
.vs-fila .vs-b{font-weight:500}
.vs-x{flex:none;width:10px;height:10px;border-radius:50%;border:1.5px solid #6F6A99;transform:translateY(1px)}
.vs-fila .vs-b .pin-punto{transform:translateY(1px)}
.sec-blanca .vs,.sec-niebla .vs{background:var(--noche)}

/* bento, diagrama, capturas en tarjetas, íconos */
.bento-r2{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.bt{display:flex;flex-direction:column;gap:8px;padding:24px;border-radius:24px;background:var(--niebla)}
.bt-grande{grid-column:span 2;grid-row:span 2;background:var(--tinta);color:#fff}
.bt-grande p{color:#CFCBEA}
.bt h3{margin:0;font-family:var(--g);font-weight:700;font-size:19px}
.bt p{margin:0;font-size:15px;line-height:1.55;color:#4A4770}
.t-cap{position:relative;margin:0 0 12px;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 16px 30px -22px rgba(7,2,47,.5)}
.t-cap img{width:100%;height:auto;display:block}
.mini-rot{top:8px;right:8px;font-size:11px;padding:3px 8px}
.diagrama-r2{display:flex;flex-wrap:wrap;gap:0;margin:0;padding:0;list-style:none;counter-reset:dg}
.dg-nodo{position:relative;flex:1 1 180px;display:flex;flex-direction:column;gap:6px;padding:22px 26px 22px 22px;margin:0 18px 18px 0;border-radius:20px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);color:#CFCBEA;font-size:15px}
.dg-nodo b{font-family:var(--g);font-size:18px;color:#fff}
.dg-nodo:not(:last-child)::after{content:"";position:absolute;right:-18px;top:50%;width:18px;height:6px;background:repeating-linear-gradient(90deg,rgba(7,2,47,.7) 0 1px,transparent 1px 4px) 0 0/100% 3px no-repeat,var(--firma)}
.ico,.ico-t,.ico-b,.ico-pr,.ico-giro,.ico-paso{width:40px;height:40px;flex:none;display:block}
.con-ico li{padding-left:0}
.con-ico .ico-b{margin-bottom:12px}
.giro .ico-giro{width:44px;height:44px;margin-right:4px}
.demo-img{padding:0}
.demo-img img{display:block;width:100%;height:auto}
.ejemplo-r i{background:#FFB03A!important;box-shadow:0 0 0 4px rgba(255,176,58,.2)!important}

@media (max-width:1180px){
  .mm-servicios{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:1100px){.muro-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.muro-grid li:nth-child(6n){border-right:1px solid #EEECF7}.muro-grid li:nth-child(5n){border-right:0}}
@media (max-width:900px){
  .ub-in{grid-template-columns:1fr;gap:36px}
  .fc-in{grid-template-columns:1fr;gap:12px}
  .vs-cab,.vs-fila{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .vs-crit{grid-column:1/-1;padding-bottom:0!important}
  .vs-cab>div:first-child{display:none}
  .bento-r2{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:767px){
  .lockup{padding-left:6px}
  .lockup img{height:20px}
  .lockup .lk-sw{font-size:11px;letter-spacing:.28em}
  .lockup .lk-sw::after{width:20px}
  .muro-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-height:560px}
  .muro-grid li{height:92px;padding:14px}
  .muro-grid li:nth-child(5n){border-right:1px solid #EEECF7}
  .muro-grid li:nth-child(3n){border-right:0}
  .muro-grid img{max-height:44px}
  .resena{width:286px;height:226px;padding:18px}
  .ubicacion,.tecno{padding:76px 0}
  .tg{grid-template-columns:1fr;gap:12px}
  .tg ul{gap:10px 18px}
  .btn-gigante{height:64px;font-size:17px;padding:0 22px;width:100%;justify-content:center}
  .vs-cab>div,.vs-fila>div{padding:14px 16px}
  .vs-h b{font-size:17px}
  .vs-fila .vs-a,.vs-fila .vs-b{font-size:14.5px}
  .bento-r2{grid-template-columns:1fr}
  .bt-grande{grid-column:auto;grid-row:auto}
  .fc-tren img{height:38px}
}
@media (max-width:360px){.lockup img{height:17px}.lockup .lk-sw{font-size:10px}}
.panel .pn-fams li{border-bottom:0;overflow:visible}
.panel .pn-fams li a{font-family:var(--a);font-weight:500;font-size:16px!important;padding:0;min-height:42px;color:#DDDAF3;transform:none}
.panel .pn-fams li:last-child a{font-family:var(--g);font-weight:600;color:#FFB03A}
.menu-abierto .wa-flota,.menu-abierto .globo{display:none}
.vs-fila{border-top:0}
.vs-fila>div{border-top:1px solid rgba(255,255,255,.08)}
.vs-fila>.vs-b{border-top:1px solid #EEECF7}
.ub-txt .bajada{margin-top:18px}
/* secciones de texto: menos muro */
.prosa-sec .sec-cab{align-items:start;margin-bottom:0}
.prosa-sec .bajada{max-width:600px}
.prosa-sec .bajada p:first-child{font-size:19px;line-height:1.55;color:var(--tinta);font-weight:500}
.prosa-sec .bajada p+p{padding-left:18px;border-left:2px solid #E6E1F8}
.prosa-sec{padding:96px 0}
@media (max-width:767px){.prosa-sec{padding:68px 0}.prosa-sec .bajada p:first-child{font-size:17px}}
@media (max-width:767px){
  .migas ol{margin-bottom:10px}
  .migas li{display:none}
  .migas li:nth-last-child(2){display:flex}
  .migas li:nth-last-child(2)::before{content:"";width:6px;height:6px;border-top:1.6px solid currentColor;border-left:1.6px solid currentColor;border-right:0;transform:rotate(-45deg);opacity:.8}
}

/* ===== Ronda 3: íconos inline de dos tonos, logos oficiales, mockups ===== */
:root{--ico-acento:#B86E00;--ico-acento-o:#FFB03A}
.sec-noche,.hero,.pie,.mega .mm-col[style],.panel,.bt-grande,.ub-tarjeta{--ico-acento:var(--ico-acento-o)}
svg.ico,svg.ico-t,svg.ico-b,svg.ico-pr,svg.ico-giro,svg.ico-paso,svg.ico-mm,svg.ico-fam{flex:none;display:block;color:currentColor;overflow:visible}
svg.ico-t,svg.ico-b,svg.ico-pr{width:32px;height:32px;margin-bottom:12px;color:var(--tinta)}
.sec-noche svg.ico-t,.sec-noche svg.ico-pr,.sec-noche svg.ico-b{color:#fff}
.promesas li{padding-left:0}
.promesas svg.ico-pr{position:static;margin-bottom:10px}
.promesas .pin-punto{position:static;display:block;margin-bottom:12px}
.beneficios-lista li:has(> svg),.beneficios-lista li:has(> .ico-logo){padding-left:0}
.beneficios-lista li > svg.ico-t,.beneficios-lista li > svg.ico-b{position:static}
.funcion svg.ico-t{width:28px;height:28px;margin-bottom:6px}
.funcion .ico-logo{display:flex;align-items:center;height:31px;margin-bottom:8px}
.sec-problema .dolores svg.ico-t{width:28px;height:28px;margin-bottom:10px;color:#fff}
svg.ico-mm{width:20px;height:20px;color:var(--tinta)}
.mega svg.ico-mm{--ico-acento:inherit}
.mega .mm-col[style] svg{--ico-acento:var(--ico-acento)}
.mega .mm-col{--ico-acento:var(--ico-acento)}
svg.ico-fam{width:22px;height:22px;display:inline-block;vertical-align:-5px;margin-right:8px}
.panel svg.ico-mm{color:#fff}
svg.ico-giro{width:40px;height:40px;color:var(--tinta)}
.giro{grid-template-columns:auto minmax(0,1fr) auto}
.giro:not(:has(svg.ico-giro)){grid-template-columns:minmax(0,1fr) auto}
svg.ico-paso{width:26px;height:26px;color:#fff;margin-bottom:10px}
/* logos oficiales: color sobre claro, blanco sobre Noche; nunca recolorear */
.ico-logo{display:inline-flex;align-items:center}
.logo-int{height:28px;width:auto;max-width:132px;object-fit:contain}
.logo-int[src$=".png"]{max-height:31px}
.logo-b{display:none}
.sec-noche .logo-c,.hero .logo-c,.pie .logo-c,.bt-grande .logo-c{display:none}
.sec-noche .logo-b,.hero .logo-b,.pie .logo-b,.bt-grande .logo-b{display:inline-block}
.tg li img{filter:none;opacity:.9}
.tg li img[src*="/r2/integraciones/"]{max-height:22px;width:auto;max-width:86px}
.tg li:hover img{opacity:1}
/* antes / después */
.antes-despues .renta h3{color:#D9D6EE}
.antes-despues .propio h3{color:var(--tinta)}
.g-antes{background:rgba(255,255,255,.06);color:#DDDAF3;border:1px solid rgba(255,255,255,.12)}
.g-antes h3{color:#fff}
/* mockup en demo y hero */
.demo-img img{display:block;width:100%;height:auto}
.hero-visual .vidrio img{display:block;width:100%;height:auto}
.caso-sin-img{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center}
.caso-sin-img .medidas{margin:0;padding:24px 28px;border-radius:20px;background:#fff}
.caso-c .escaparate:empty{display:none}
.funcion .logo-int{height:30px;max-width:150px}
@media (max-width:900px){.caso-sin-img{grid-template-columns:1fr}}
.prosa-sec .sec-cab:has(+ ul){margin-bottom:40px}
/* portada r3: tarjetas con mockup y logos de integraciones */
.srv.con-mockup .mk-tarjeta{position:relative;margin:0 0 6px}
.srv.con-mockup .mk-tarjeta .mini-rot{top:10px;right:10px;z-index:2}
.srv.con-mockup .mk-tarjeta img{display:block;width:100%;height:auto}
.conecta-logos{gap:10px}
.conecta-logos li{min-height:52px;padding:0 18px;justify-content:center;background:#fff}
.conecta-logos img{height:24px;width:auto;max-width:118px;object-fit:contain}
.conecta-logos img[src$=".png"]{max-height:31px;height:auto}
@media (max-width:767px){.conecta-logos li{min-height:46px;padding:0 14px}.conecta-logos img{height:20px;max-width:100px}}
.conecta-logos li.con-texto{gap:8px;font-family:var(--g);font-weight:600;font-size:14px;color:var(--tinta)}.conecta-logos li.con-texto img{height:22px}
/* capturas reales r3 */
.cap-r2 .vidrio,.marco .vidrio{position:relative}
.cap-r2 picture,.marco picture,.tel-caso picture{display:block}
.cap-r2 img,.marco picture img{display:block;width:100%;height:auto}
.marco .mini-rot,.tel-caso .mini-rot{top:10px;right:10px;z-index:3}
.tel-caso .vidrio{position:relative}
.galeria-caso{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.62fr) minmax(0,.34fr);gap:14px;align-items:end}
.galeria-caso .gal-principal{grid-column:1/-1}
.galeria-caso figure{margin:0}
.galeria-caso .gal-cel .tel-caso{width:100%;margin:0}
.lista-casos .caso-grande{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
.hero-visual .hero-cel{max-width:280px;margin-left:auto}
.tally-filas{margin-top:18px}
@media (max-width:900px){.lista-casos .caso-grande{grid-template-columns:1fr}.galeria-caso{grid-template-columns:minmax(0,1fr) minmax(0,.5fr)}}
@media (max-width:767px){.galeria-caso{grid-template-columns:minmax(0,1fr) 120px}.galeria-caso .gal-esc{display:none}}
@media (max-width:1024px){.pasos-4,.pasos-6,.pasos-3{grid-template-columns:1fr}}
.galeria-caso{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}
.galeria-caso .gal-cel{justify-self:center;width:100%;max-width:200px}
.galeria-caso .gal-principal .tel-caso{max-width:250px;margin:0 auto}
.galeria-caso:has(.gal-principal .tel-caso){grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
@media (max-width:767px){.galeria-caso{grid-template-columns:minmax(0,1fr) 120px}}
/* Esc cierra el mega aunque haya hover o foco */
.con-mega.cerrado-esc>.mega{opacity:0!important;visibility:hidden!important;pointer-events:none}

/* ===== Ronda 4 (QA final) ===== */
/* B1/B2: el hero ya no encierra ni recorta el menú: queda por encima de main y solo recorta en horizontal */
header.hero{z-index:20}
@supports (overflow:clip){header.hero{overflow:visible;overflow-x:clip}}
/* C1: "Ver más" legible sobre Noche */
.sec-noche .liga.oscura,.hero .liga.oscura,.pie .liga.oscura,.cierre .liga.oscura{color:#fff}
.sec-noche .mas-info a{color:#fff}
/* C2: reseñas a 4 líneas exactas con puntos suspensivos */
.resena{height:auto;min-height:0}
.resena blockquote{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;line-height:23px;max-height:92px}
.resena.abierta blockquote{max-height:none}
/* C3: tarjetas sin hueco: la última se estira si queda sola */
.casos3{grid-auto-flow:row dense}
.casos3>:last-child:nth-child(3n+1){grid-column:1/-1}
.casos3>:last-child:nth-child(3n+2){grid-column:span 2}
.funciones>li:last-child:nth-child(3n+1){grid-column:1/-1}
.funciones>li:last-child:nth-child(3n+2){grid-column:span 2}
@media (max-width:1100px){.funciones>li:last-child:nth-child(3n+1),.funciones>li:last-child:nth-child(3n+2){grid-column:auto}.funciones>li:last-child:nth-child(odd){grid-column:1/-1}}
@media (max-width:1180px){.casos3>:last-child:nth-child(3n+1),.casos3>:last-child:nth-child(3n+2){grid-column:auto}.casos3>:last-child:nth-child(odd){grid-column:1/-1}}
@media (max-width:767px){.funciones>li,.casos3>*{grid-column:auto!important}}
/* C4: botón flotante con texto oscuro sobre verde; en pantallas bajas se hace círculo */
.wa-flota{color:#062b14}
.wa-flota .txt small{opacity:1}
@media (max-height:700px) and (max-width:767px){.wa-flota{width:54px;height:54px;right:12px;bottom:12px}.wa-flota svg{width:30px;height:30px}}
/* C5: áreas táctiles de 44 px */
.leer-mas{min-height:44px;padding:0 4px;margin-left:-4px}
.fam-cab h3 a{display:inline-flex;align-items:center;min-height:44px}
.gb-sols a{min-height:44px}
.giro-caso a{display:inline-flex;align-items:center;min-height:44px}
.cta-precio{margin:0 0 22px;font-size:16px;color:#4A4770}
.cta-precio a{color:var(--tinta);font-weight:600;text-underline-offset:4px;text-decoration-color:#A652FF}
/* r4 · huérfanas en dolores, tarjetas y beneficios */
@media (min-width:768px){.sec-problema .dolores>li:last-child:nth-child(odd){grid-column:1/-1}}
@media (min-width:1101px){
  .tarjetas>:last-child:nth-child(3n+1){grid-column:1/-1}
  .tarjetas>:last-child:nth-child(3n+2){grid-column:span 2}
  .beneficios-lista:has(>li:nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
  .beneficios-lista>li:last-child:nth-child(3n+1):not(:nth-child(4)){grid-column:1/-1}
}
@media (min-width:768px) and (max-width:1100px){.tarjetas>:last-child:nth-child(odd),.beneficios-lista>li:last-child:nth-child(odd){grid-column:1/-1}}
@media (max-width:767px){header.hero .respaldo .fundadores{padding-right:64px}}

/* ronda 3: grupos de proyectos, destacados, caso_refs, tarjetas de clientes sin logo */
.ancla-grupo{display:block;position:relative;top:-90px;height:0}
.grupo-cab{margin:0 0 18px;font-family:var(--g);font-weight:700;font-size:15px;letter-spacing:.04em;text-transform:uppercase;color:#3C3480}
.pill-dest{display:inline-flex;margin:0 0 14px;padding:6px 14px;border-radius:999px;background:linear-gradient(90deg,#FFB02E,#FF7A3D);color:#090055;font-size:13px;font-weight:800;letter-spacing:.02em}
.caso-refs{display:flex;flex-wrap:wrap;gap:6px 10px;margin:12px 0 0;font-size:14px;color:#3C3480}
.caso-refs span{font-weight:700}
.caso-refs a{color:var(--tinta);font-weight:700;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(60,52,128,.35)}
.giro-bloque .caso-refs{grid-column:1/-1}
.gb-der .caso-refs{margin-top:10px}
.galeria-caso figure,.marco.cap-r2{position:relative}

/* ronda 5-6: campo "mockup" en cualquier sección (2 columnas si el contenido es corto; si no, debajo a lo ancho) */
.mk-lado{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:56px;align-items:center}
.mk-lado .sec-cab{grid-template-columns:1fr;gap:18px;margin-bottom:36px}
.mk-lado .beneficios-lista,.mk-lado .tarjetas,.mk-lado .funciones,.mk-lado .dolores{grid-template-columns:1fr!important;gap:22px}
.mk-lado .beneficios-lista>li{grid-column:auto!important}
.mk-fig{position:relative;margin:0;min-width:0}
.mk-fig .marco{position:relative}
.mk-fig img{display:block;width:100%;height:auto}
.mk-fig figcaption{margin:12px 4px 0;font-size:14px;line-height:1.5;color:#5A567F}
.sec-noche .mk-fig figcaption{color:#B7B2DE}
.mk-abajo{max-width:1040px;margin:56px auto 0}
@media (max-width:1000px){.mk-lado{grid-template-columns:1fr;gap:36px}}
.mk-fig .mk-rot{position:static;margin:0 0 12px;font-size:12.5px}
@media (max-width:767px){.mk-abajo{margin-top:36px}.mk-fig .mk-rot{font-size:11.5px;padding:5px 10px}}

/* ronda 5: centro de giros en tarjetas (H3 corto + enlace con la keyword del giro a su página) */
.giro-tarjeta .gb-cab{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.giro-tarjeta .gb-cab .ico-giro{width:34px;height:34px;flex:none}
.giro-tarjeta h3{margin:12px 0 8px;font-family:var(--g);font-weight:700;font-size:24px;line-height:1.15;letter-spacing:-.02em;color:var(--tinta)}
.giro-tarjeta .gb-ir{margin-top:12px;color:var(--tinta);font-weight:700;text-decoration:underline;text-decoration-color:rgba(166,82,255,.45);text-underline-offset:4px}
.giro-tarjeta .gb-tit{margin:0 0 10px;font-family:var(--g);font-weight:600;font-size:15px;color:#5B4FC4}
@media (max-width:767px){.giro-tarjeta h3{font-size:21px}}
.sec-respaldo{display:inline-flex;margin:0 0 18px}
.hero-respaldo{margin:0 0 14px}.hero-respaldo .badge-respaldo{margin:0}
.badge-respaldo[class*="r-solucion"]{background:#FFF3DC;color:#7A4B00}