/* ============================================================
   AIXR [studio] — capa PREMIUM v3
   Detalles finos, textura, profundidad y coreografía de motion.
   Se carga DESPUÉS de styles.css. No reemplaza nada: refina.
   ============================================================ */

:root{
  --ease-out:cubic-bezier(.2,.7,.3,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --gutter:clamp(20px,4vw,40px);
  --sec-pad:clamp(64px,9vw,140px);
}

/* ---- grain / noise overlay para textura "cara" ---- */
body::after{
  content:"";position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.025;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---- secciones con más aire (look editorial) ---- */
.section{padding:var(--sec-pad) 0}

/* ---- microtipografía: viudas y guiones ---- */
.lead,.hero .sub,.tcard .quote{text-wrap:pretty}
h1,h2,h3,.h-sec{text-wrap:balance}

/* ---- nav: hairline animado + glow al hacer scroll ---- */
.nav{transition:background .4s var(--ease-out),border-color .4s}
.nav::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,var(--magenta),var(--xr),transparent);
  opacity:0;transition:opacity .5s}
body.scrolled .nav::after{opacity:.5}
body.scrolled .nav{background:rgba(10,7,16,.85)}
.nav-links a{position:relative}
.nav-links a:not(.nav-cta):not(.lang)::after{content:"";position:absolute;left:14px;right:14px;bottom:4px;height:1px;
  background:var(--magenta);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease-out)}
.nav-links a:not(.nav-cta):not(.lang):hover::after,
.nav-links a.active::after{transform:scaleX(1)}
.nav-cta{position:relative;overflow:hidden}
.nav-cta::before{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.35),transparent);transition:left .6s}
.nav-cta:hover::before{left:140%}

/* ---- botones: shine sweep + lift con resorte ---- */
.btn-primary{position:relative;overflow:hidden;box-shadow:0 8px 30px -12px rgba(255,0,210,.5)}
.btn-primary::before{content:"";position:absolute;top:0;left:-120%;width:55%;height:100%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.4),transparent);transition:left .6s}
.btn-primary:hover::before{left:150%}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 16px 40px -12px rgba(255,0,210,.6)}
.btn{transition:.28s var(--ease-spring)}

/* ---- kicker con guion decorativo ---- */
.kicker{display:inline-flex;align-items:center;gap:10px}
.kicker::before{content:"";width:22px;height:1px;background:currentColor;opacity:.6}
.center-head .kicker,.manifesto .kicker{justify-content:center}

/* ============================================================
   HERO — capas, profundidad, scroll cue
   ============================================================ */
.hero{padding-top:clamp(70px,11vh,120px)}
.hero h1{position:relative}
/* gradiente que recorre el "dos motores" */
.hero h1 .ai{background:linear-gradient(95deg,var(--magenta),var(--violet));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;background-size:200% auto;animation:shimmer 7s linear infinite}
.hero .eqn{display:inline-flex;gap:8px;padding:10px 18px;border:1px solid var(--line);border-radius:999px;background:rgba(26,18,38,.4);backdrop-filter:blur(6px)}

/* scroll cue ya existe en styles.css — lo activamos en el HTML */

/* ---- doors: glyph con profundidad + ilustración de fondo ---- */
.door{backdrop-filter:blur(2px)}
.door .glyph{position:relative;display:inline-block;text-shadow:0 0 40px rgba(255,0,210,.25)}
.door.xr .glyph{text-shadow:0 0 40px rgba(125,92,240,.3)}
.door .ill-bg{position:absolute;inset:0;z-index:0;opacity:.30;mix-blend-mode:screen;
  transition:opacity .5s var(--ease-out),transform .6s var(--ease-out)}
.door .ill-bg img{width:100%;height:100%;object-fit:cover}
.door:hover .ill-bg{opacity:.46;transform:scale(1.04)}
.door .corner{position:absolute;top:22px;right:24px;z-index:1;font-family:var(--mono);font-size:.64rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute);opacity:.7}

/* ============================================================
   PUENTE AI × XR — la unión como posibilidad
   ============================================================ */
.bridge{position:relative;border:1px solid var(--line);border-radius:28px;overflow:hidden;
  background:linear-gradient(135deg,rgba(255,0,210,.06),rgba(91,43,208,.08));padding:clamp(32px,5vw,60px)}
.bridge::before{content:"";position:absolute;inset:0;z-index:0;opacity:.18;mix-blend-mode:screen}
.bridge .inner{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,4vw,56px);align-items:center}
@media(max-width:820px){.bridge .inner{grid-template-columns:1fr}}
.bridge h2{font-family:var(--display);font-weight:600;font-size:clamp(1.6rem,3.4vw,2.5rem);letter-spacing:-.02em;line-height:1.08}
.bridge h2 .x{color:var(--ink-mute);font-weight:400;margin:0 .15em}
.bridge p{color:var(--ink-soft);margin-top:18px;max-width:520px}
.bridge .formula{display:flex;align-items:center;gap:14px;margin-top:26px;flex-wrap:wrap}
.bridge .chip{font-family:var(--mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;
  padding:10px 16px;border-radius:999px;border:1px solid var(--line);background:rgba(10,7,16,.4)}
.bridge .chip.ai{color:var(--magenta);border-color:rgba(255,0,210,.35)}
.bridge .chip.xr{color:var(--xr);border-color:rgba(125,92,240,.4)}
.bridge .op{font-family:var(--display);font-size:1.4rem;color:var(--ink-mute)}
.bridge .viz{position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--line);aspect-ratio:4/3;background:var(--black-2)}
.bridge .viz img{width:100%;height:100%;object-fit:cover}
.bridge .note{font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;color:var(--ink-mute);margin-top:18px;text-transform:uppercase}

/* ============================================================
   CREDENCIALES — frase-marco + número con vida
   ============================================================ */
.creds-intro{text-align:center;max-width:760px;margin:0 auto 38px}
.creds-intro .big-line{font-family:var(--display);font-weight:500;font-size:clamp(1.3rem,2.6vw,1.9rem);
  line-height:1.3;letter-spacing:-.01em}
.creds-intro .big-line b{background:linear-gradient(95deg,var(--magenta),var(--violet));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-weight:700;background-size:200% auto;animation:shimmer 7s linear infinite}
.cred{position:relative;overflow:hidden}
.cred::before{content:"";position:absolute;inset:0;background:radial-gradient(300px circle at 50% 0%,rgba(255,0,210,.10),transparent 70%);opacity:0;transition:.4s}
.cred:hover::before{opacity:1}
.cred .big{position:relative}

/* ============================================================
   INDUSTRIAS — de chips a tarjetas con ilustración animada
   ============================================================ */
.ind-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:36px}
@media(max-width:980px){.ind-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:680px){.ind-grid{grid-template-columns:repeat(2,1fr)}}
.ind-tile{position:relative;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--panel);
  transition:.4s var(--ease-out);text-align:left}
.ind-tile .thumb{aspect-ratio:4/3;overflow:hidden;position:relative;background:var(--black-2)}
.ind-tile .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease-out)}
.ind-tile .body{padding:16px 18px 18px}
.ind-tile .nm{font-family:var(--display);font-weight:600;font-size:1.02rem;letter-spacing:-.01em}
.ind-tile .vt{font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-mute);margin-top:6px;display:block}
.ind-tile::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;
  background:linear-gradient(90deg,var(--magenta),var(--xr));transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease-out)}
.ind-tile:hover{transform:translateY(-6px);border-color:var(--violet);box-shadow:0 26px 50px -30px rgba(91,43,208,.7)}
.ind-tile:hover .thumb img{transform:scale(1.07)}
.ind-tile:hover::after{transform:scaleX(1)}

/* ============================================================
   PROYECTOS — galería editorial
   ============================================================ */
.proj-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:40px}
@media(max-width:780px){.proj-grid{grid-template-columns:1fr}}
.proj{position:relative;border:1px solid var(--line);border-radius:22px;overflow:hidden;background:var(--panel);
  transition:.45s var(--ease-out);display:flex;flex-direction:column}
.proj.feat{grid-column:span 2}
@media(max-width:780px){.proj.feat{grid-column:span 1}}
.proj .media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--black-2)}
.proj.feat .media{aspect-ratio:21/9}
.proj .media img,.proj .media iframe{width:100%;height:100%;object-fit:cover;border:0;display:block;transition:transform .8s var(--ease-out)}
.proj:hover .media img{transform:scale(1.05)}
.proj .play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:2;
  background:radial-gradient(circle at center,rgba(10,7,16,.1),rgba(10,7,16,.55));transition:.4s}
.proj:hover .play{background:radial-gradient(circle at center,rgba(255,0,210,.1),rgba(10,7,16,.5))}
.proj .play .disc{width:64px;height:64px;border-radius:50%;border:1.5px solid rgba(255,255,255,.6);
  display:flex;align-items:center;justify-content:center;backdrop-filter:blur(8px);background:rgba(10,7,16,.3);transition:.4s var(--ease-spring)}
.proj:hover .play .disc{transform:scale(1.1);border-color:var(--magenta)}
.proj .play .disc svg{width:22px;height:22px;margin-left:3px;fill:#fff}
.proj .meta{padding:22px 24px 24px;display:flex;flex-direction:column;flex:1}
.proj .tagrow{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:12px}
.proj .vt{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;padding:5px 11px;border-radius:999px;border:1px solid var(--line)}
.proj .vt.ai{color:var(--magenta);border-color:rgba(255,0,210,.4)}
.proj .vt.xr{color:var(--xr);border-color:rgba(125,92,240,.4)}
.proj .vt.sec{color:var(--ink-mute)}
.proj h3{font-family:var(--display);font-weight:600;font-size:1.3rem;letter-spacing:-.01em}
.proj .pdesc{color:var(--ink-soft);font-size:.94rem;margin-top:8px;flex:1}
.proj .open{margin-top:16px;font-weight:600;font-size:.9rem;color:var(--magenta);display:inline-flex;align-items:center;gap:8px}
.proj .open .ar{transition:.3s}
.proj:hover .open .ar{transform:translateX(6px)}
.proj-filter{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:30px}
.proj-filter button{font-family:var(--mono);font-size:.78rem;padding:10px 18px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--ink-soft);cursor:pointer;transition:.2s}
.proj-filter button.on{background:linear-gradient(95deg,var(--magenta),var(--violet-deep));color:#fff;border-color:transparent}
.proj.hide{display:none}

/* lightbox */
.lightbox{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;
  background:rgba(6,4,10,.92);backdrop-filter:blur(10px);padding:24px}
.lightbox.on{display:flex}
.lightbox .frame{width:min(1100px,100%);aspect-ratio:16/9;border-radius:16px;overflow:hidden;border:1px solid var(--line);position:relative;background:#000}
.lightbox iframe{width:100%;height:100%;border:0}
.lightbox .close{position:absolute;top:-46px;right:0;font-family:var(--mono);font-size:.8rem;color:var(--ink-soft);
  border:1px solid var(--line);background:var(--panel);border-radius:999px;padding:8px 16px;cursor:pointer;transition:.2s}
.lightbox .close:hover{border-color:var(--magenta);color:var(--ink)}

/* ============================================================
   NOVEDADES — blog editorial
   ============================================================ */
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}
@media(max-width:920px){.news-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.news-grid{grid-template-columns:1fr}}
.post{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--panel);
  transition:.4s var(--ease-out);display:flex;flex-direction:column}
.post:hover{transform:translateY(-6px);border-color:var(--violet);box-shadow:0 26px 50px -30px rgba(91,43,208,.6)}
.post .ph{aspect-ratio:16/9;overflow:hidden;position:relative;background:var(--black-2)}
.post .ph img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease-out)}
.post:hover .ph img{transform:scale(1.06)}
.post .pc{padding:22px 22px 24px;display:flex;flex-direction:column;flex:1}
.post .cat{font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--magenta)}
.post .cat.xr{color:var(--xr)}
.post h3{font-family:var(--display);font-weight:600;font-size:1.18rem;letter-spacing:-.01em;margin-top:10px;line-height:1.2}
.post .ex{color:var(--ink-soft);font-size:.92rem;margin-top:10px;flex:1}
.post .pmeta{font-family:var(--mono);font-size:.7rem;color:var(--ink-mute);margin-top:16px;display:flex;justify-content:space-between}
.post.feat{grid-column:span 3}
@media(max-width:920px){.post.feat{grid-column:span 2}}
@media(max-width:620px){.post.feat{grid-column:span 1}}
.post.feat{display:grid;grid-template-columns:1.2fr 1fr;align-items:stretch}
@media(max-width:620px){.post.feat{display:flex}}
.post.feat .ph{aspect-ratio:auto;min-height:280px}
.post.feat h3{font-size:1.7rem}

/* article body (single post) */
.article{max-width:760px;margin:0 auto}
.article .a-hero{aspect-ratio:21/9;border-radius:20px;overflow:hidden;border:1px solid var(--line);margin:30px 0;background:var(--black-2)}
.article .a-hero img{width:100%;height:100%;object-fit:cover}
.article h1{font-family:var(--display);font-weight:600;font-size:clamp(2rem,4.6vw,3rem);letter-spacing:-.025em;line-height:1.05}
.article .a-meta{font-family:var(--mono);font-size:.74rem;color:var(--ink-mute);margin-top:18px;display:flex;gap:14px;flex-wrap:wrap}
.article .a-body{font-size:1.08rem;line-height:1.75;color:var(--ink-soft);margin-top:10px}
.article .a-body h2{font-family:var(--display);color:var(--ink);font-weight:600;font-size:1.6rem;margin:38px 0 12px;letter-spacing:-.015em}
.article .a-body h3{font-family:var(--display);color:var(--ink);font-weight:600;font-size:1.25rem;margin:28px 0 10px}
.article .a-body p{margin:16px 0}
.article .a-body a{color:var(--magenta);text-decoration:underline;text-underline-offset:3px}
.article .a-body ul,.article .a-body ol{margin:16px 0 16px 22px}
.article .a-body li{margin:8px 0}
.article .a-body blockquote{border-left:3px solid var(--magenta);padding:6px 0 6px 22px;margin:24px 0;font-style:italic;color:var(--ink)}

/* generic vertical hero for new pages */
.vhero2{padding:clamp(70px,10vh,110px) 0 30px;text-align:center;position:relative;z-index:2}
.vhero2 .badge{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--magenta);border:1px solid var(--line);padding:8px 15px;border-radius:999px;background:var(--panel)}
.vhero2 h1{font-family:var(--display);font-weight:600;font-size:clamp(2.2rem,5.4vw,3.8rem);line-height:1.02;letter-spacing:-.025em;margin-top:22px;max-width:820px;margin-left:auto;margin-right:auto}
.vhero2 h1 .g{background:linear-gradient(95deg,var(--magenta),var(--xr));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;background-size:200% auto;animation:shimmer 7s linear infinite}
.vhero2 .lead{margin:22px auto 0;font-size:1.08rem}

/* breadcrumb */
.crumb{font-family:var(--mono);font-size:.72rem;color:var(--ink-mute);letter-spacing:.06em;margin-top:18px}
.crumb a{color:var(--ink-soft)}.crumb a:hover{color:var(--magenta)}
.crumb span{margin:0 8px;opacity:.5}

/* footer upgrade: bigger closing presence */
.footer{padding-top:clamp(36px,5vw,60px)}
.footer-cta{border-top:1px solid var(--line);padding:clamp(28px,4.5vw,48px) 0;text-align:center}
.footer-cta h2{font-family:var(--display);font-weight:600;font-size:clamp(1.6rem,3.6vw,2.6rem);letter-spacing:-.025em;line-height:1.08}
.footer-cta h2 .g{background:linear-gradient(95deg,var(--magenta),var(--xr));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;background-size:200% auto;animation:shimmer 7s linear infinite}
.footer-cta p{color:var(--ink-soft);max-width:420px;margin:12px auto 20px;font-size:.95rem}

/* reduced motion safety for new animated bits */
@media(prefers-reduced-motion:reduce){
  .hero h1 .ai,.vhero2 h1 .g{animation:none}
  .nav-cta::before,.btn-primary::before{display:none}
}

/* ============================================================
   FAIL-SAFE — el contenido nunca queda invisible
   ============================================================ */
/* Si JS no corre, no-js revela todo (clase puesta por el script al inicio) */
html.no-js .reveal,html.no-js .reveal-l,html.no-js .reveal-r,html.no-js .reveal-scale{opacity:1!important;transform:none!important}
/* Red de seguridad: si algo queda sin .in, se revela tras la carga */
body.revealed-fallback .reveal:not(.in),
body.revealed-fallback .reveal-l:not(.in),
body.revealed-fallback .reveal-r:not(.in),
body.revealed-fallback .reveal-scale:not(.in){opacity:1;transform:none}

/* ============================================================
   FOOTER — redes, contacto con iconos y certificaciones
   ============================================================ */
.f-social{display:flex;gap:11px;margin:14px 0 16px}
.f-social a{width:36px;height:36px;border-radius:8px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--ink);transition:.25s var(--ease-out);background:rgba(255,255,255,.02)}
.f-social a:hover{border-color:var(--magenta);color:#fff;transform:translateY(-3px);box-shadow:0 10px 20px -12px rgba(255,0,210,.5)}
.f-social svg{width:17px;height:17px;fill:currentColor}
.f-contact{list-style:none;display:flex;flex-direction:column;gap:10px;margin-top:2px}
.f-contact li{margin:0}
.f-contact a{display:flex;align-items:center;gap:10px;color:var(--ink-soft);transition:.2s;font-size:.82rem}
.f-contact a:hover{color:var(--ink)}
.f-contact .ic{width:30px;height:30px;flex:0 0 auto;border-radius:7px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--ink);transition:.25s}
.f-contact a:hover .ic{border-color:var(--magenta);color:#fff}
.f-contact .ic svg{width:14px;height:14px;fill:currentColor}
.f-certs{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.f-certs img{height:48px;width:auto;opacity:.9;transition:.3s;border-radius:6px}
.f-certs img:hover{opacity:1}
.f-certs .cert-label{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-mute)}
@media(max-width:780px){.f-certs{justify-content:center}}

/* ============================================================
   TEXTO GRADIENTE REACTIVO AL MOUSE — más fino que el shimmer
   El gradiente se desplaza siguiendo el cursor sobre el título.
   ============================================================ */
.grad-react{
  background:linear-gradient(var(--ga,95deg),var(--magenta),var(--violet) 45%,var(--xr));
  background-size:220% 100%;
  background-position:var(--gp,50%) 50%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  transition:background-position .35s var(--ease-out);
  will-change:background-position;
}
@media(prefers-reduced-motion:reduce){.grad-react{transition:none}}

/* ============================================================
   CREDENCIALES — efecto al pasar el mouse o al entrar en viewport
   (no automático: se activa por hover o por scroll-in)
   ============================================================ */
.cred .big{background-size:200% auto;background-position:0% 50%}
.cred:hover .big{animation:shimmer 1.6s linear}
/* cuando la sección entra en viewport, un barrido único */
.wrap.in .cred .big{animation:credSweep 1.4s ease-out}
@keyframes credSweep{0%{background-position:200% 50%}100%{background-position:0% 50%}}
@media(prefers-reduced-motion:reduce){
  .cred .big,.cred:hover .big{animation:none}
}

/* ============================================================
   HERO — glow "future, now" + scroll-cue de barras animadas
   ============================================================ */
.hero .eqn .glow-now{
  color:#fff;
  background:linear-gradient(95deg,#fff,#ffd9f6 40%,#fff);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  background-size:200% auto;animation:shimmer 6s linear infinite;
  text-shadow:0 0 14px rgba(255,255,255,.45),0 0 30px rgba(255,0,210,.35);
  filter:drop-shadow(0 0 8px rgba(255,255,255,.4));
  letter-spacing:.14em;
}
/* scroll-cue: 3 barras que bajan en secuencia */
.scroll-cue .bars{display:flex;flex-direction:column;align-items:center;gap:5px}
.scroll-cue .bars i{width:2px;height:12px;border-radius:2px;background:linear-gradient(var(--magenta),var(--xr));opacity:.25;animation:cueBar 1.6s ease-in-out infinite}
.scroll-cue .bars i:nth-child(2){animation-delay:.2s}
.scroll-cue .bars i:nth-child(3){animation-delay:.4s}
@keyframes cueBar{
  0%{opacity:.15;transform:translateY(-4px)}
  40%{opacity:1}
  100%{opacity:.15;transform:translateY(8px)}
}
@media(prefers-reduced-motion:reduce){
  .hero .eqn .glow-now{animation:none}
  .scroll-cue .bars i{animation:none;opacity:.5}
}

/* Ayentik — logo protagónico */
.ayentik-logo{height:64px;width:auto;margin:6px 0 4px;display:block}
@media(max-width:780px){.ayentik-logo{margin:6px auto 4px}}

/* cierre: correo bajo los botones */
.footer-cta .cta-mail{margin-top:16px;font-family:var(--mono);font-size:.82rem;color:var(--ink-mute)}
.footer-cta .cta-mail a{color:var(--ink-soft)}
.footer-cta .cta-mail a:hover{color:var(--magenta)}

/* ============================================================
   FOOTER — barra inferior balanceada: redes (izq) · certificaciones (der)
   ============================================================ */
.f-bottom{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
  margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.f-bottom .f-social{margin:0}
.f-bottom .f-cert-img{height:48px;width:auto;opacity:.9;border-radius:6px}
.f-certs{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.f-ea img{height:40px;width:auto;opacity:.85;transition:.25s var(--ease-out)}
.f-ea:hover img{opacity:1;transform:translateY(-2px);filter:drop-shadow(0 4px 12px rgba(255,0,210,.3))}
@media(max-width:560px){.f-bottom{justify-content:center;text-align:center}}

/* ============================================================
   PÁGINA AI — hero más visible, nota resaltada, stat 1 → ∞
   ============================================================ */
.note.note-strong{color:var(--ink)!important;font-weight:500}
/* stat 1 → ∞ con vida: flecha que avanza y ∞ con leve pulso */
.stat-inf{display:inline-flex;align-items:center;gap:.18em}
.stat-inf .arr{display:inline-block;animation:arrGo 2.4s ease-in-out infinite;color:var(--magenta)}
.stat-inf .inf{background:linear-gradient(95deg,var(--magenta),var(--xr));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;background-size:200% auto;animation:shimmer 5s linear infinite;display:inline-block}
@keyframes arrGo{0%,100%{transform:translateX(0);opacity:.7}50%{transform:translateX(6px);opacity:1}}
@media(prefers-reduced-motion:reduce){.stat-inf .arr,.stat-inf .inf{animation:none}}

/* ============================================================
   CLIENTES — carrusel tipográfico doble fila, hover iluminado
   ============================================================ */
.clients{overflow:hidden}
.marquee{margin-top:30px;display:flex;flex-direction:column;gap:18px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.mq-row{display:flex;width:max-content}
.mq-track{display:flex;align-items:center;white-space:nowrap;will-change:transform}
.mq-left .mq-track{animation:mqL 48s linear infinite}
.mq-right .mq-track{animation:mqR 54s linear infinite}
@keyframes mqL{from{transform:translateX(0)}to{transform:translateX(-100%)}}
@keyframes mqR{from{transform:translateX(-100%)}to{transform:translateX(0)}}
.marquee:hover .mq-track{animation-play-state:paused}
.mq-track span{font-family:var(--display);font-weight:600;font-size:clamp(1.3rem,2.4vw,2rem);
  letter-spacing:-.01em;color:var(--ink-mute);padding:0 .55em;transition:.3s var(--ease-out);cursor:default}
.mq-track span:hover{color:#fff;
  text-shadow:0 0 18px rgba(255,0,210,.5)}
.mq-track a{font-family:var(--display);font-weight:600;font-size:clamp(1.3rem,2.4vw,2rem);
  letter-spacing:-.01em;color:var(--ink-soft);padding:0 .55em;transition:.3s var(--ease-out);
  text-decoration:none;cursor:pointer}
.mq-track a em{font-style:normal;font-size:.5em;color:var(--magenta);opacity:0;
  margin-left:.25em;vertical-align:super;transition:.25s}
.mq-track a:hover{color:#fff;text-shadow:0 0 18px rgba(255,0,210,.6)}
.mq-track a:hover em{opacity:1}
.mq-track i{color:var(--magenta);opacity:.45;font-style:normal;font-size:1.1rem}
@media(prefers-reduced-motion:reduce){
  .mq-left .mq-track,.mq-right .mq-track{animation:none}
  .marquee{overflow-x:auto}
}

/* ============================================================
   PÁGINA EMPRESA — ADN
   ============================================================ */
.adn{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:center}
@media(max-width:820px){.adn{grid-template-columns:1fr;gap:28px}}
.adn-media{position:relative;border-radius:22px;overflow:hidden;border:1px solid var(--line);aspect-ratio:16/11}
.adn-media img{width:100%;height:100%;object-fit:cover}
.adn-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(10,7,16,.5));mix-blend-mode:multiply}
.adn-text h2{font-family:var(--display);font-weight:600;font-size:clamp(1.7rem,3.4vw,2.6rem);letter-spacing:-.02em;margin-top:12px;line-height:1.08}
.adn-text p{color:var(--ink-soft);margin-top:16px}
.adn-list{list-style:none;margin-top:22px;display:flex;flex-direction:column;gap:16px}
.adn-list li{position:relative;padding-left:22px;color:var(--ink-soft);line-height:1.55}
.adn-list li::before{content:"";position:absolute;left:0;top:9px;width:9px;height:9px;border-radius:50%;background:linear-gradient(135deg,var(--magenta),var(--xr))}
.adn-list li b{color:var(--ink);font-weight:600}

/* ============================================================
   COMPARTIDOS — credenciales y testimonios (para todas las páginas)
   ============================================================ */
.creds{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media(max-width:780px){.creds{grid-template-columns:repeat(2,1fr)}}
.cred{text-align:center;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:28px 20px;transition:.3s}
.cred:hover{border-color:var(--magenta);transform:translateY(-4px)}
.cred .lbl{color:var(--ink-soft);font-size:.82rem;margin-top:10px;line-height:1.4}
.testi{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media(max-width:780px){.testi{grid-template-columns:1fr}}
.tcard{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:28px;transition:.3s}
.tcard:hover{border-color:var(--violet)}
.tcard .quote{color:var(--ink);font-size:.96rem;line-height:1.6;font-style:italic}
.tcard .who{display:flex;align-items:center;gap:12px;margin-top:18px}
.tcard .av{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--magenta),var(--indigo));flex:0 0 auto;display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:700;color:#fff;font-size:1rem}
.tcard .nm{font-weight:600;font-size:.92rem}
.tcard .co{font-family:var(--mono);font-size:.72rem;color:var(--ink-mute)}
/* .cred .big base (gradiente) — el shimmer hover/scroll ya está definido arriba */
.cred .big{font-family:var(--display);font-weight:700;font-size:2.2rem;line-height:1;background:linear-gradient(95deg,var(--magenta),var(--violet));background-size:200% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* ============================================================
   PÁGINA CONTACTO
   ============================================================ */
.contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:10px}
@media(max-width:820px){.contact-grid{grid-template-columns:1fr}}
.contact-card{display:flex;gap:18px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:26px;transition:.35s var(--ease-out)}
.contact-card:hover{transform:translateY(-5px);border-color:var(--violet);box-shadow:0 26px 50px -30px rgba(91,43,208,.6)}
.contact-card .ci{width:52px;height:52px;flex:0 0 auto;border-radius:14px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(255,0,210,.18),rgba(91,43,208,.18));border:1px solid var(--line)}
.contact-card .ci svg{width:24px;height:24px;fill:var(--ink)}
.contact-card:hover .ci svg{fill:#fff}
.cc-k{font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-mute)}
.cc-v{font-family:var(--display);font-weight:600;font-size:1.15rem;margin-top:4px}
.cc-d{color:var(--ink-soft);font-size:.85rem;margin-top:6px}
.contact-bot{margin-top:40px;background:linear-gradient(135deg,rgba(255,0,210,.07),rgba(91,43,208,.09));border:1px solid var(--line);border-radius:24px;padding:clamp(28px,4vw,48px);display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center}
@media(max-width:820px){.contact-bot{grid-template-columns:1fr}}
.contact-bot h2{font-family:var(--display);font-weight:600;font-size:clamp(1.5rem,3vw,2.1rem);letter-spacing:-.02em;margin-top:10px}
.contact-bot p{color:var(--ink-soft);margin-top:12px}
.cb-widget{min-height:260px;border:1px dashed var(--line);border-radius:18px;display:flex;align-items:center;justify-content:center;background:rgba(10,7,16,.4)}
.cb-placeholder{text-align:center;padding:30px}
.cb-placeholder p{color:var(--ink-mute);margin:12px 0 18px;font-family:var(--mono);font-size:.82rem}
.cb-ping{display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--magenta);box-shadow:0 0 0 0 rgba(255,0,210,.5);animation:ping 1.8s ease-out infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(255,0,210,.5)}100%{box-shadow:0 0 0 18px rgba(255,0,210,0)}}
@media(prefers-reduced-motion:reduce){.cb-ping{animation:none}}

/* ============================================================
   PÁGINA LEGAL — Aviso de Privacidad (lectura cómoda)
   ============================================================ */
.legal-doc{max-width:780px;margin:0 auto;color:var(--ink-soft);font-size:1rem;line-height:1.75}
.legal-doc .intro{font-size:1.08rem;color:var(--ink)}
.legal-doc h2{font-family:var(--display);color:var(--ink);font-weight:600;font-size:1.35rem;letter-spacing:-.01em;margin:38px 0 12px;padding-top:20px;border-top:1px solid var(--line)}
.legal-doc p{margin:14px 0}
.legal-doc b{color:var(--ink)}
.legal-doc a{color:var(--magenta);text-decoration:underline;text-underline-offset:3px}
.legal-doc ul,.legal-doc ol{margin:14px 0 14px 22px;display:flex;flex-direction:column;gap:8px}
.legal-doc dl{margin:14px 0;display:flex;flex-direction:column;gap:14px}
.legal-doc dt{color:var(--ink);font-weight:600;font-family:var(--display)}
.legal-doc dd{margin:4px 0 0;padding-left:16px;border-left:2px solid var(--line)}
.legal-doc dd ul{margin-top:10px}
.legal-updated{margin-top:36px;padding-top:20px;border-top:1px solid var(--line);font-family:var(--mono);font-size:.8rem;color:var(--ink-mute)}
/* footer legal link */
.footer .legal a{color:var(--ink-mute);transition:.2s}
.footer .legal a:hover{color:var(--magenta)}

/* ============================================================
   INDUSTRIAS — tarjetas con ilustración + texto que cambia por filtro
   ============================================================ */
.ind-list .icard{display:grid!important;grid-template-columns:200px 1fr;gap:26px;align-items:center}
@media(max-width:680px){.ind-list .icard{grid-template-columns:1fr}}
.icard-thumb{aspect-ratio:16/11;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:var(--black-2)}
.icard-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.ind-list .icard .no{font-family:var(--display);font-weight:700;font-size:1.1rem;color:transparent;-webkit-text-stroke:1.2px var(--violet);opacity:.6;line-height:1;margin-bottom:6px}
.ind-list .icard h3{font-family:var(--display);font-weight:600;font-size:1.3rem;letter-spacing:-.01em}
.icard .idesc{color:var(--ink-soft);font-size:.95rem;margin-top:8px;transition:opacity .15s ease;min-height:3.2em}
.icard .vtags{display:flex;gap:7px;margin-top:14px;flex-wrap:wrap}

/* Novedades — etiqueta de tipo + categoría */
.post .cat-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.post .cat-type{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink);background:rgba(255,255,255,.06);border:1px solid var(--line);padding:3px 9px;border-radius:999px}

/* ============================================================
   CTA "icta" — composición mejorada, con aire y jerarquía
   (definición global para todas las páginas)
   ============================================================ */
.icta{position:relative;overflow:hidden;text-align:center;
  margin-top:54px;
  background:linear-gradient(135deg,rgba(255,0,210,.07),rgba(91,43,208,.09));
  border:1px solid var(--line);border-radius:26px;
  padding:clamp(48px,7vw,80px) clamp(28px,5vw,64px)}
.icta::before{content:"";position:absolute;inset:0;z-index:0;
  background:radial-gradient(620px 320px at 50% -10%,rgba(255,0,210,.14),transparent 62%)}
.icta > *{position:relative;z-index:1}
.icta h2{font-family:var(--display);font-weight:600;font-size:clamp(1.7rem,3.6vw,2.6rem);letter-spacing:-.02em;line-height:1.08}
.icta p{color:var(--ink-soft);max-width:540px;margin:18px auto 34px;font-size:1.02rem;line-height:1.6}
.icta .btn{margin:0}
.icta > div:last-child{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:4px}

/* ============================================================
   CROSS (AI↔XR) — rediseñado al nivel del bloque bridge
   ============================================================ */
.cross{position:relative;border:1px solid var(--line);border-radius:28px;overflow:hidden;
  background:linear-gradient(135deg,rgba(255,0,210,.06),rgba(91,43,208,.09));
  padding:clamp(32px,5vw,58px)}
.cross-grid{position:absolute;inset:0;z-index:0;opacity:.5;
  background-image:linear-gradient(rgba(125,92,240,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(125,92,240,.07) 1px,transparent 1px);
  background-size:34px 34px;
  -webkit-mask-image:radial-gradient(circle at 70% 50%,#000,transparent 75%);
          mask-image:radial-gradient(circle at 70% 50%,#000,transparent 75%)}
.cross-inner{position:relative;z-index:1;display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,4vw,52px);align-items:center}
@media(max-width:820px){.cross-inner{grid-template-columns:1fr}}
.cross-text h3{font-family:var(--display);font-weight:600;font-size:clamp(1.5rem,3vw,2.2rem);letter-spacing:-.02em;line-height:1.1}
.cross-text p{color:var(--ink-soft);margin:16px 0 26px;max-width:460px;line-height:1.6}
.cross-viz{position:relative;border-radius:18px;overflow:hidden;border:1px solid var(--line);aspect-ratio:4/3;background:var(--black-2)}
.cross-viz img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:820px){.cross-viz{aspect-ratio:16/9}}

/* ============================================================
   NAV — ícono de sobre (Contacto)
   ============================================================ */
.nav-contact{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:10px;
  border:1px solid var(--line);color:var(--ink-soft);transition:.25s var(--ease-out);margin-right:2px}
.nav-contact svg{width:18px;height:18px;fill:currentColor}
.nav-contact:hover{border-color:var(--magenta);color:#fff;transform:translateY(-2px)}
.nav-contact.active{border-color:var(--magenta);color:#fff}
/* copia del sobre visible solo en móvil (cuando el menú colapsa al burger) */
.nav-contact-m{display:none}
@media(max-width:880px){.nav-contact-m{display:inline-flex;margin-left:auto;margin-right:12px}}

/* tarjetas de recorrido abren lightbox */
.proj[data-tour]{cursor:pointer}