/*****INICIO CSS GLOBAL-COMÚN*****/

    /* DIVIDER divisor de las secciones HORIZONTAL */
    .divider { width:90%; margin:2rem auto; border-top:2px solid rgba(0,78,137,0.3); }


/* FUENTES-COMÚN */
/* Nunito Sans - Local first, then Google Fonts */
@font-face {
    font-family: 'Nunito Sans';
    src: local('Nunito Sans Light'), local('NunitoSans-Light'), /* Intenta cargar la fuente del sistema primero */
         url('../fonts/Nunito_Sans/WebFonts/NunitoSans-Light.woff2') format('woff2'), /* Busca en tu servidor local */
         url('../fonts/Nunito_Sans/WebFonts/NunitoSans-Light.woff') format('woff'),
         url('https://fonts.gstatic.com/s/nunitosans/v15/FBV8dKuLpFxE6U2TxENwK_h_uGz.woff2') format('woff2'); /* Fallback a Google Fonts */
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Nunito Sans';
    src: local('Nunito Sans Regular'), local('NunitoSans-Regular'),
         url('../fonts/Nunito_Sans/WebFonts/NunitoSans-Regular.woff2') format('woff2'),
         url('../fonts/Nunito_Sans/WebFonts/NunitoSans-Regular.woff') format('woff'),
         url('https://fonts.gstatic.com/s/nunitosans/v15/FBV8dKuLpFxE6U2TxENwK_h_uGz.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Nunito Sans';
    src: local('Nunito Sans SemiBold'), local('NunitoSans-SemiBold'),
         url('../fonts/Nunito_Sans/WebFonts/NunitoSans-SemiBold.woff2') format('woff2'),
         url('../fonts/Nunito_Sans/WebFonts/NunitoSans-SemiBold.woff') format('woff'),
         url('https://fonts.gstatic.com/s/nunitosans/v15/FBV8dKuLpFxE6U2TxENwK_h_uGz.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Nunito Sans';
    src: local('Nunito Sans Bold'), local('NunitoSans-Bold'),
         url('../fonts/Nunito_Sans/WebFonts/NunitoSans-Bold.woff2') format('woff2'),
         url('../fonts/Nunito_Sans/WebFonts/NunitoSans-Bold.woff') format('woff'),
         url('https://fonts.gstatic.com/s/nunitosans/v15/FBV7dKuLpFxE6U2TxENwK_h_uGj_S5.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* IBM Plex Sans */
@font-face {
    font-family: 'IBM Plex Sans';
    src: local('IBM Plex Sans Light'), local('IBMPlexSans-Light'),
         url('../fonts/Ibm_Plex_Sans/WebFonts/IBMPlexSans-Light.woff2') format('woff2'),
         url('../fonts/Ibm_Plex_Sans/WebFonts/IBMPlexSans-Light.woff') format('woff'),
         url('https://fonts.gstatic.com/s/ibmplexsans/v14/zYXgMqdnDcC6z_BxGpOyHMMPp_zUgo_f.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'IBM Plex Sans';
    src: local('IBM Plex Sans Regular'), local('IBMPlexSans-Regular'),
         url('../fonts/Ibm_Plex_Sans/WebFonts/IBMPlexSans-Regular.woff2') format('woff2'),
         url('../fonts/Ibm_Plex_Sans/WebFonts/IBMPlexSans-Regular.woff') format('woff'),
         url('https://fonts.gstatic.com/s/ibmplexsans/v14/zYXgMqdnDcC6z_BxGpOyHMMPp_zUgo_f.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'IBM Plex Sans';
    src: local('IBM Plex Sans SemiBold'), local('IBMPlexSans-SemiBold'),
         url('../fonts/Ibm_Plex_Sans/WebFonts/IBMPlexSans-SemiBold.woff2') format('woff2'),
         url('../fonts/Ibm_Plex_Sans/WebFonts/IBMPlexSans-SemiBold.woff') format('woff'),
         url('https://fonts.gstatic.com/s/ibmplexsans/v14/zYXgMqdnDcC6z_BxGpOyHMMPp_zUgo_f.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'IBM Plex Sans';
    src: local('IBM Plex Sans Bold'), local('IBMPlexSans-Bold'),
         url('../fonts/Ibm_Plex_Sans/WebFonts/IBMPlexSans-Bold.woff2') format('woff2'),
         url('../fonts/Ibm_Plex_Sans/WebFonts/IBMPlexSans-Bold.woff') format('woff'),
         url('https://fonts.gstatic.com/s/ibmplexsans/v14/zYX9MqdnDcC6z_BxGpOyHMMPp_zUTpGAf4Q.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}


/*****CABECERA COMÚN*****/

/* RESET */
    * { margin:0; padding:0; box-sizing:border-box }
    html { scroll-behavior: smooth; }
    body { font-family: Arial, sans-serif; display:flex; flex-direction:column; min-height:100vh; background:#fff; color:#333; }

    /* HEADER */
    header {
      position:fixed; top:0; left:0; width:100%; background:#004e89; color:#fff; display:flex; align-items:center;
      justify-content:space-between;
      padding:10px 20px; z-index:1000; transition:padding .3s, background .3s; }
      header.shrink { padding:5px 20px; background:rgba(0,78,137,0.95); }
      .logo img { height:40px; transition:transform .3s }
      header.shrink .logo img { transform:scale(0.85)
    }

      /* iconos cabecera */
      .header-group-left, .header-group-right { display: flex; align-items: center; gap: 40px; /* Espacio entre logo/icono y icono/hamburguesa */ }

      .header-icon img { height: 30px; width: auto; vertical-align: middle; transition: transform 0.3s; }

      .header-icon:hover img { transform: scale(1.15); }

       header.shrink .header-icon img { transform: scale(0.85); /* Aplica el mismo efecto de escala que al logo */ }

    /* NAV */
    nav { display:none }
    @media(min-width:768px){ 
      nav { display:flex; justify-content:center }
      nav a { padding:0 12px; color:#fff; text-decoration:none; font-weight:500; transition:opacity .2s; }
      nav a:hover { opacity:.7 }
      nav a.active { border-bottom:2px solid #fff; background-color: #ff5722; /* un tono más contrastante */ }
    }
    header.nav-open nav { 
      display:flex; position:absolute; top:100%; right:20px; flex-direction:column; background:#004e89; width:200px;
      border-radius:6px; box-shadow:0 4px 12px rgba(0,0,0,0.1);
    }
    header.nav-open nav a {
      padding:10px 15px; color:#fff; text-decoration:none; border-bottom:1px solid rgba(255,255,255,0.3);
      transition:background .2s;
    }
    header.nav-open nav a:last-child { border-bottom:none }
    header.nav-open nav a:hover { background:rgba(255,255,255,0.1) }
    header.nav-open nav a.active { background:#FF4500; }

    /* HAMBURGER */
    #menu-btn { background:none; border:none; cursor:pointer; padding:10px }
    .hamburger, .hamburger::before, .hamburger::after {
      width:25px; height:3px; background:#fff; display:block; position:relative; transition:all .3s;
    }
    .hamburger::before, .hamburger::after {
      content:''; position:absolute; width:25px; height:3px; background:#fff;
    }
    .hamburger::before { top:-8px }
    .hamburger::after  { top:8px }
    #menu-btn.open .hamburger { background:transparent }
    #menu-btn.open .hamburger::before {
      transform:rotate(45deg) translate(5px,5px);
    }
    #menu-btn.open .hamburger::after {
      transform:rotate(-45deg) translate(5px,-5px);
    }

/*****FOOTER COMÚN*****/

    /* FOOTER */
    footer { 
     margin-top: auto; background: #FF4500; color: #fff; padding: 40px 20px 20px; position: relative;
    }
    .footer-content {
      max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: stretch; flex-wrap: wrap;
    }

    /* Cambiar fuente del título en el footer */

    .footer-left { 
      flex: 1; min-width: 280px; text-align: left; font-size: 0.95rem; line-height: 1.4;
      font-family: 'Nunito Sans', sans-serif;
    }

    .footer-center { 
      flex: 1; min-width: 280px; text-align: center; 
    }

    .footer-center p a:last-child {
        margin-right: 0;
    }

    .footer-right { 
      flex: 1; min-width: 150px; display: flex;flex-direction: column; justify-content: flex-end; align-items: flex-end;
    }

    .footer-logo { margin-bottom: 5px;                                                   /* Espacio entre el logo y el copyright */
    }

    .footer-right .footer-logo img { 
       max-height: 40px; width: auto; 
    }

    .contact-email, .contact-tel { color: #fff; text-decoration: none; margin: 5px 0; display: inline-block; }

    .contact-email, .contact-tel { color: #fff; text-decoration: none; display: inline-flex; align-items: center; margin-bottom: 5px; margin-right: 15px; }

    .contact-email:hover, .contact-tel:hover { text-decoration:underline }
    .footer-copy { font-size: 0.85rem; color: #fff; text-align: right;                            /* Alinea el texto a la derecha dentro de su propio div */
      width: 100%;                                                                                /* Asegura que ocupe todo el ancho para que el text-align funcione */
                                                                                                  /* Sin posicionamiento absoluto, ya que flexbox lo maneja */
    }
    .contact-tel img { width:25px; height:auto; margin-right:10px; }

    .contact-email img { width:20px; height:auto; margin-right:10px; }


    .footer-emails { display: none; }           /* desaparece correo sobre logo pie de página */


/**** responsivo ****/

/* Media query para pantallas más pequeñas 768px (móviles) */

@media (max-width: 768px) {

    header { padding: 8px 12px; }

    nav a { font-size: 0.95rem; }

    .logo img { height: 32px; }

    .footer-content { flex-direction: column; align-items: center; text-align: center; padding: 0 10px; }

    .footer-center, .footer-right { text-align: center; font-size: 0.9rem; width: 100%; margin-bottom: 10px; position: static; align-items: center;
        justify-content: center; }

    #.#footer-center p { flex-direction: column; align-items: center; margin-bottom: 10px; }

    .footer-center p { flex-direction: column; align-items: flex-start; margin-bottom: 10px; width: fit-content; margin-left: auto; margin-right: auto; }

    #.#contact-email, .contact-tel { display: flex; margin: 5px 0; margin-right: 0; justify-content: center; }

    .contact-email, .contact-tel { display: flex; margin: 5px 0; margin-right: 0; justify-content: flex-start; }

    .footer-left { display: none; }               /* Modificado para ocultar solo footer-left */

    .footer-emails_2 { display: none; }           /* desaparece correo en footer */

    .footer-logo { margin-bottom: 10px; }

    .footer-copy { text-align: center; }

    .contact-email, .contact-tel { display: block; margin: 5px 0; }

    .header-icon { display: block; }
}


/* Media query para pantallas más pequeñas 480px (móviles) */

@media (max-width: 480px) {

    header { padding: 8px 12px; }

    nav a { font-size: 0.95rem; }

    .logo img { height: 32px; }

    .footer-content { flex-direction: column; align-items: center; text-align: center; padding: 0 10px; }

    .footer-center, .footer-right { text-align: center; font-size: 0.9rem; width: 100%; margin-bottom: 10px; position: static; align-items: center;
        justify-content: center; }

    .footer-center p { flex-direction: column; align-items: center; margin-bottom: 10px; }

    .contact-email, .contact-tel { display: flex; margin: 5px 0; margin-right: 0; justify-content: center; }

    .footer-left { display: none; }               /* Modificado para ocultar solo footer-left */

    .footer-emails_2 { display: none; }           /* desaparece correo en footer */

    .footer-logo { margin-bottom: 10px; }

    .footer-copy { text-align: center; }

    .contact-email, .contact-tel { display: block; margin: 5px 0; }
}


/* --- MEDIA QUERY PARA MÓVILES/TABLETS EN ORIENTACIÓN HORIZONTAL --- */
@media (max-width: 768px) and (orientation: landscape) {

  .footer-content {
    flex-direction: row; /* Las dos columnas principales (teléfonos y el grupo de derecha) una al lado de la otra */
    justify-content: space-between; /* Espacio entre las dos columnas */
    align-items: flex-end; /* Alinea ambas columnas a la parte inferior del footer */
    padding: 10px 20px;
    height: auto;
  }

  .footer-left {
    display: none; /* Oculta la columna de la izquierda para esta vista */
  }

  .footer-emails2 { display: none; }           /* desaparece correo en footer */

  .footer-center { /* Ahora solo contiene los teléfonos */
    width: 50%; /* Ocupa la mitad izquierda del footer */
    display: flex;
    flex-direction: column; /* Apila los contenidos (los párrafos de teléfono) */
    align-items: flex-start; /* Alinea los teléfonos a la izquierda */
    padding-right: 15px; /* Espacio entre esta columna y la de la derecha */
  }

  .footer-phones p { /* Estilo para los párrafos dentro de footer-phones */
      display: flex;
      flex-direction: column; /* Asegura que los enlaces de teléfono se apilen */
      align-items: flex-start; /* Alinea cada enlace de teléfono a la izquierda */
  }

  /* Asegura que los iconos y texto dentro de cada enlace de teléfono se alineen correctamente */
  .footer-phones .contact-tel {
      justify-content: flex-start; /* Alinea el icono y texto del enlace de teléfono a la izquierda */
      margin-right: 0; /* Elimina cualquier margen horizontal residual */
  }

  .footer-right { /* Ahora contiene correos, logo y copyright */
    width: 50%; /* Ocupa la mitad derecha del footer */
    display: flex;
    flex-direction: column; /* Apila correos, logo y copyright */
    align-items: flex-end; /* Alinea todos los contenidos de esta columna a la DERECHA */
    justify-content: flex-end; /* Empuja el grupo (correos, logo, copyright) hacia ABAJO en la columna derecha */
    margin-bottom: 0;
    padding-left: 15px; /* Espacio entre esta columna y la de la izquierda */
  }

  .footer-emails { 
      width: 100%; 
      text-align: right;
      display: block;  
  }

  .footer-emails p { /* Estilo para los párrafos dentro de footer-emails */
      display: flex;
      flex-direction: column; /* Asegura que los enlaces de correo se apilen */
      align-items: flex-end; /* Alinea cada enlace de correo a la DERECHA */
  }

  /* Asegura que los iconos y texto dentro de cada enlace de correo se alineen correctamente */
  .footer-emails .contact-email {
      justify-content: flex-end; /* Alinea el icono y texto del enlace de correo a la derecha */
      margin-right: 0; /* Elimina cualquier margen horizontal residual */
  }

  .footer-logo { /* Estilo del logo dentro de footer-right */
    margin-bottom: 5px; /* Espacio entre el logo y el copyright */
  }

  .footer-copy { /* Estilo del copyright dentro de footer-right */
    text-align: right;
    font-size: 0.8rem;
  }
}

/* Opcional: Si quieres un ajuste más fino para tablets grandes en landscape */

@media (min-width: 769px) and (max-width: 1024px) and (orientation: landscape) {

    .footer-content { flex-direction: row; justify-content: space-between; align-items: flex-start; padding: 20px 40px; }

    .footer-left { display: none; }

    .footer-emails2 { display: none; }           /* desaparece correo en footer responsivo */

    .footer-center { width: 35%; text-align: left; }

    .footer-right { width: 30%; text-align: right; }

    .footer-center p { flex-direction: column; align-items: flex-start; } 
}

/* MAIN: formulario */
    main {
      width:100%; padding:90px 0 20px; flex:1;
    }

/*****FIN CSS GLOBAL-COMÚN*****/