/* ================================================
   Hero del logo animado (kit de marca, Drive)
   Logo oficial de Aztra como protagonista, sobre el
   navy de marca, con el titular y los CTAs debajo.
   ================================================ */
#home.hero-logo { position: relative; overflow: hidden; }
#home.hero-logo .aztra-floor { display: none; }
#home.hero-logo > .container { position: relative; z-index: 1; }

/* contenido centrado alrededor del logo */
#home.hero-logo .hero-content-2 {
    display: flex; flex-direction: column; align-items: center; text-align: center;
    gap: clamp(12px, 2vw, 22px);
}

/* el logo (líder, pero sin empujar los CTAs fuera de pantalla) */
.aztra-herologo { width: min(340px, 62vw); margin: 0 auto; }
.aztra-herologo .aztra-herologo__svg { width: 100%; height: auto; display: block; overflow: visible; }
/* fills del SVG en tema oscuro (mismas variables del kit) */
.aztra-herologo {
    --ink: #ededed; --bg: #0d1220; --accent: #8aa6c9; --spark: #567599; --shine: #567599;
}
.aztra-herologo .ink { fill: var(--ink); }
.aztra-herologo .cutout { fill: var(--bg); }
.aztra-herologo #lam { fill: var(--bg); stroke: var(--bg); stroke-width: 1.2; stroke-linejoin: round; }
.aztra-herologo #trail { stroke: var(--bg); opacity: 0; }
.aztra-herologo #spark line { stroke: var(--spark); }
.aztra-herologo #ripple1, .aztra-herologo #ripple2 { stroke: var(--accent); }
.aztra-herologo #shine { color: var(--shine); }

/* resplandor que respira detrás del logo */
.hero-glow {
    position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background: radial-gradient(ellipse 48% 44% at 50% 40%, rgba(86, 117, 153, 0.30), rgba(86, 117, 153, 0.08) 42%, rgba(13, 18, 32, 0) 70%);
    animation: heroGlowBreathe 7.5s ease-in-out infinite;
}
@keyframes heroGlowBreathe {
    0%, 100% { opacity: 0.72; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.06); }
}

/* el titular acompaña al logo: más contenido que el hero original */
#home.hero-logo .hero-content-2 h1 { margin: 2px 0 0; font-size: clamp(30px, 4.6vw, 58px); line-height: 1.02; }
#home.hero-logo .hero-content-2 .sub-title-2 { margin: 0; max-width: 52ch; }
#home.hero-logo .hero-content-2 .sub-title-2 p { font-size: clamp(15px, 1.5vw, 17px); }

/* reveal del texto (entra mientras sube "aztra"); sólo con JS/motion */
html.aztra-motion #home.hero-logo .aztra-rv { opacity: 0; transform: translateY(24px); filter: blur(6px); will-change: transform, opacity; }
html.aztra-motion #home.hero-logo .hero-content-2.is-in .aztra-rv {
    opacity: 1; transform: none; filter: none;
    transition: opacity .8s ease, transform .9s cubic-bezier(.16, 1, .3, 1), filter .8s ease;
    transition-delay: calc(var(--d, 0) * 0.12s);
}

@media (prefers-reduced-motion: reduce) {
    .hero-glow { animation: none; }
    #home.hero-logo .aztra-rv { opacity: 1 !important; transform: none !important; filter: none !important; }
}
@media (max-width: 575px) {
    .aztra-herologo { width: min(340px, 84vw); }
}
