:root{
  --brand:#002D62; --brand-2:#CE1126; --accent:#F7D117;
  --text:#1a202c; --text-2:#4a5568; --beige:#F6EFE6;
}

/* Resets útiles */
html,body{max-width:100%;overflow-x:hidden}
*,*::before,*::after{box-sizing:border-box}
img{max-width:100%;height:auto;display:block}

/* NAV base */
#nav{transition:background .25s ease, box-shadow .25s ease, transform .25s ease, backdrop-filter .25s ease}
#nav.nav-solid{background:rgba(0,15,32,.82);backdrop-filter:blur(8px);box-shadow:0 8px 22px rgba(0,0,0,.25)}
#nav.nav-hidden{transform:translateY(-100%)}
.nav-link{display:inline-block;padding:.5rem 0;color:rgba(255,255,255,.9);position:relative;font-weight:700;letter-spacing:.2px}
.nav-link:hover{color:#fff}
.nav-link::after{content:"";position:absolute;left:0;right:0;bottom:-.6rem;width:0;height:3px;border-radius:999px;background:var(--brand-2);transition:width .25s}
.nav-link:hover::after,.nav-link.active::after{width:36px}

/* Menú móvil overlay/panel */
#mobileMenu{position:fixed;inset:0;z-index:60;background:rgba(0,25,55,.95);backdrop-filter:saturate(120%) blur(4px)}
#mobileMenu.hidden{display:none}
#mobileMenu a{color:#fff}
#mobileMenu a:hover{color:var(--accent)}

/* Hero overlay (si tu página tiene hero) */
.hero-overlay::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,45,98,.65),rgba(0,45,98,.45) 30%, rgba(0,45,98,.65));backdrop-filter:blur(1px)}
.hero-kicker{letter-spacing:.35em}

/* Footer */
footer{background:#0a0f1f;color:#cbd5e0}
footer h3{color:#fff}
.footer-link{position:relative;display:inline-block;color:#cbd5e0;transition:color .2s}
.footer-link::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;width:0;margin:auto;background:var(--brand-2);transition:width .2s}
.footer-link:hover{color:var(--accent)}
.footer-link:hover::after{width:100%}
.footer-graphic-logo{height:32px;width:auto}

/* Línea superior animada del footer */
@keyframes gradientMove{0%{background-position:0% 50%}100%{background-position:200% 50%}}
.footer-gradient-line{position:relative;margin-top:.5rem}
.footer-gradient-line::before{
  content:"";position:absolute;left:0;right:0;top:-1px;height:2px;
  background-image:linear-gradient(90deg,var(--brand-2),var(--accent),var(--brand));
  background-size:200% 100%;animation:gradientMove 2.5s linear infinite;
}

/* Micro-animación reveal para bloques al hacer scroll */
.reveal{opacity:0;transform:translateY(10px);transition:opacity .35s ease, transform .35s ease}
.reveal.is-in{opacity:1;transform:translateY(0)}