/* Wallled · correcciones sobre el CSS de Tailwind (cargar después de index-*.css) */
@font-face{font-family:"Inter";src:url(/fonts/inter.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(/fonts/jetbrains-mono.woff2) format("woff2");font-weight:100 800;font-style:normal;font-display:swap}

html{scroll-padding-top:80px}
section[id],#hero,#contact{scroll-margin-top:80px}

/* Barra lateral: el header mide 80px, no 64px */
aside .sticky{top:80px;height:calc(100vh - 80px)}

/* Animación que faltaba (capa 4 del diagrama IGE) */
@keyframes shimmer{from{background-position:100% 0}to{background-position:-100% 0}}

/* Escenas three.js */
#wl-hero-stage canvas,#wl-ige-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity .9s ease}
#wl-hero-stage canvas.wl-on,#wl-hero-stage video.wl-on{opacity:.8}
#wl-hero-stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .9s ease}
#wl-ige-stage canvas.wl-on{opacity:1}

/* Fondo sobrio para Fundadores (antes: escena de Unicorn Studio) */
.wl-founders-bg{background:
  radial-gradient(55% 45% at 18% 28%,rgba(184,151,46,.10),transparent 70%),
  radial-gradient(45% 40% at 82% 72%,rgba(47,123,255,.07),transparent 70%)}

/* Formulario: elementos nuevos */
.wl-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.wl-consent{display:flex;gap:12px;align-items:flex-start;font-size:12px;line-height:1.5;color:#a1a1aa;font-family:"JetBrains Mono",ui-monospace,monospace}
.wl-consent input{margin-top:2px;width:16px;height:16px;accent-color:#b8972e;flex:none}
.wl-consent a{color:#d4af37;text-decoration:underline;text-underline-offset:3px}
.wl-error{font-size:13px;line-height:1.5;color:#fca5a5;border:1px solid rgba(248,113,113,.4);background:rgba(127,29,29,.15);padding:12px 14px;font-family:"JetBrains Mono",ui-monospace,monospace}
.wl-tel{color:inherit;text-decoration:none}
.wl-tel:hover{color:#fff}

/* 404 */
.wl-404{min-height:70vh;display:flex;flex-direction:column;justify-content:center;gap:20px;padding:96px 24px}

/* Menú móvil abierto: el fondo no hace scroll */
@media (max-width:1023px){html:has(#wl-mobile-menu.translate-x-0){overflow:hidden}}

/* Foco visible con teclado */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #d4af37;outline-offset:2px}

@layer utilities{
  /* Legibilidad: nada por debajo de 11px y grises con contraste suficiente */
  .text-\[8px\],.text-\[10px\]{font-size:11px}
  .text-zinc-600{color:#8b8b94}
  .text-zinc-700{color:#80808a}
  .text-zinc-500{color:#83838c}
  /* En pantallas táctiles no hay hover: las fotos no se quedan en gris */
  @media (hover:none){.grayscale{filter:none}}
}

/* Móvil: el desenfoque de fondo en áreas grandes cuesta mucha GPU */
@media (max-width:767px){
  .backdrop-blur-sm,.backdrop-blur-md{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
}

/* Respeta "reducir movimiento" del sistema */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important;scroll-behavior:auto!important}
}