body{
 font-family: "Inter", sans-serif;

}
h1, h2, h3, h4, h5, h6 {
    font-family: "Inter", sans-serif;
}
a {
    text-decoration: none !important;
    transition: 500ms;
}
.navbar-nav .nav-link {
    font-family: "Inter", sans-serif;
    /* Técnica para evitar salto al hacer hover con negrita */
    display: flex;
    flex-direction: column;
    align-items: center;
    /* Agregamos la transición para el shadow y el color */
    transition: color 0.3s ease, text-shadow 0.3s ease;
}

/* Pseudo-elemento invisible que tiene el ancho de la negrita */
.navbar-nav .nav-link::after {
    display: block;
    content: attr(title);
    font-weight: 700;
    height: 0;
    overflow: hidden;
    visibility: hidden;
}

.navbar-nav .nav-link:hover{
    color: var(--Azul, #003375);
    /* Usamos text-shadow en lugar de font-weight para permitir la transición */
    font-weight: 400;
    text-shadow: 0 0 1px var(--Azul, #003375);
}

.nav__menu__inicio{
     color: #fff !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-transform: uppercase;
}
.nav__menu__inicio:hover{
     color: #003375 !important;
    font-size: 16px;
    font-style: normal;
    /* Usamos text-shadow en lugar de font-weight */
    font-weight: 400;
    text-shadow: 0 0 1px #003375;
    line-height: normal;
    text-transform: uppercase;
}

.nav__menu{
    color: var(--Gris-oscuro, #1A1F22);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-transform: uppercase;
}

.active__header{
    color: var(--Azul, #003375) !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
}

.btn-primary {
    background-color: #1A386A;
    border-color: #1A386A;
    border-radius: 40px;
    border: 1px solid #1A386A;
    padding: 10px 20px;
    color: #FFFFFF;
}

.btn-primary:hover {
    background-color: #fff;
    border-color: #16325A;
    color: #16325A;
}

.btn-secondary {
    border-radius: 40px;
    border: 1px solid var(--Blanco, #FFF);
    border-radius: 40px;
    color: #FFFFFF;
    padding: 10px 20px;
}
.btn-secondary:hover {
    background-color: #16325A;
    border-color: #16325A;
    color: #FFFFFF;
}

.btn-tertiary {
    background-color: #fff;
    border-radius: 40px;
    border: 1px solid #16325A;
    padding: 10px 20px;
    color: #16325A;
}

.btn-tertiary:hover {
    background-color: #1A386A;
    border-color: #1A386A;
    color: #FFFFFF;
}



/* ==============================
   FOOTER (estilo como la imagen)
   ============================== */

/* Colores (ajustables) */
:root{
  --footer-bg: #173a6a;        /* azul principal */
  --footer-bg-2: #0f3564;      /* franja inferior */
  --footer-accent: #5f4bff;    /* línea violeta */
  --footer-text: #e9f1ff;      /* blanco azulado */
  --footer-muted: #cfe0ff;     /* links */
  --footer-border: rgba(255,255,255,.18);
}

/* Contenedor principal */
footer.footer{
  background: var(--footer-bg);
  color: var(--footer-text);
}

/* Logo */
footer.footer .footer-logo{
  max-width: 170px;
  height: auto;
}

/* Títulos (SECCIONES / SUSCRIBITE / DATOS DE CONTACTO) */
footer.footer h6{
  color: var(--footer-text);
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 22px; /* 137.5% */
 letter-spacing: 0.96px;
  text-transform: uppercase;
  margin-bottom: 12px;
}

/* Links del footer */
footer.footer a,
footer.footer a.nav__footer{
  color: var(--footer-muted);
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.9;
  text-decoration: none;
  padding: 0;
  display: inline-block;
}

footer.footer a:hover,
footer.footer a.nav__footer:hover{
  color: #ffffff;
  text-decoration: none;
}

/* Columnas de links: que queden “en lista” prolija */
footer.footer .d-flex.flex-column a{
  display: block;
  width: fit-content;
}

/* Newsletter */
footer.footer .newsletter-form{
  max-width: 250px;
}

footer.footer .newsletter-input{
  background: rgba(0,0,0,.08);
  border: 1px solid rgba(255,255,255,.28);
  color: #fff;
  height: 34px;
  border-radius: 7px;
  padding-right: 44px; /* espacio para el botón */
  font-size: 12px;
}

footer.footer .newsletter-input::placeholder{
  color: rgba(255,255,255,.75);
}

footer.footer .newsletter-input:focus{
  box-shadow: none;
  outline: none;
  border-color: rgba(255,255,255,.45);
}

footer.footer .newsletter-btn{
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  border: 0;
  background: transparent;
  color: #fff;
  padding: 0;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  cursor: pointer;
}

/* Si usás FontAwesome, esto mejora el tamaño del ícono */
footer.footer .newsletter-btn i{
  font-size: 14px;
}

/* Redes */
footer.footer .fab{
  color: #fff;
  opacity: .95;
  transition: opacity .15s ease;
}
footer.footer .fab:hover{ opacity: 1; }

/* Contacto (icono + texto alineado) */
footer.footer .contact-info > div{
  gap: 10px;
}

footer.footer .contact-info img{
  width: 14px;
  height: 14px;
  margin-top: 3px;
  /* por si tus png son oscuros */
  filter: brightness(0) invert(1);
  opacity: .95;
}

/* =========================
   FRANJA INFERIOR (copyright)
   ========================= */

/* Te recomiendo agregar class="footer-bottom" a ese div.
   Si no querés tocar HTML, igual lo ataco con el selector actual. */
.footer-bottom,
div.border-top.border-dark{
  background: var(--footer-bg-2) !important;
  padding: 12px 0 !important;
}

.footer-bottom p,
div.border-top.border-dark p{
  font-family: "Inter", sans-serif;
  font-size: 11px;
  color: rgba(255,255,255,.92) !important;
}

.footer-bottom a,
div.border-top.border-dark a{
  font-family: "Inter", sans-serif;
  font-size: 11px;
  color: rgba(255,255,255,.92) !important;
  text-decoration: none !important;
}

/* Responsive: en mobile separa un poco más */
@media (max-width: 767.98px){
  footer.footer{
    text-align: left;
  }
  footer.footer .newsletter-form{
    max-width: 100%;
  }
}