body {
    margin: 0;
    padding: 0;
    font-family: 'Inter', sans-serif;
}

header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    background-color: #FFF;
}

main{
    padding-top: 170px;
    max-width: 70% !important;
}
/* Splash ocupa toda la pantalla */
#splash {
  position: fixed;
  inset: 0;
  background: #fff;
  z-index: 2000;
  transition: opacity 1s ease;
}

#splash-logo {
  max-height: 200px;
  transition: all 1s ease;
}

#splash.shrink #splash-logo {
  max-height: 80px;
}

/* Cuando el splash desaparece */
#splash.hidden {
  opacity: 0;
  pointer-events: none;
}

#encabezado {
    margin: 10px auto;
}

.textoContacto{
    font-size: 10pt;
    text-align: left;
}

/* Forzar que todos los list-group-item con ícono y texto estén centrados verticalmente */
.list-group-item.d-flex.align-items-start,
.list-group-item-action.d-flex.align-items-start {
  align-items: center !important;
}
.list-group-item .flex-shrink-0 {
  display: block; /* asegúrate que sea block o inline-block para que se alinee bien */
}

.list-group-item h6 {
  margin-bottom: 0.25rem; /* ajustar para que no haya espacio extra */
}

.list-group-item p {
  margin-bottom: 0; /* ya lo tenés, pero asegurar */
}


/* Logo inicial centrado */
#logo-container {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all 1s ease-in-out;
    z-index: 1050;
}

#logo-container img {
    max-height: 200px; /* tamaño inicial */
    transition: all 1s ease-in-out;
}

/* Estado reducido en el header */
#logo-container.shrink {
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
}

#logo-container.shrink img {
    max-height: 80px;
}


nav.navbar {
    justify-content: center;
    /*background-color: #ec4b48 !important;*/
    font-size: 12pt !important;
    font-weight: 600 !important;
    color: #FFF !important;
}

li.nav-item {
    border: 1px solid #FFF;
    margin: 5px;
    padding: 3px;
    border-radius: 15px; /* Esto hace que los bordes sean redondeados */
    /*background-color: #ec4b48 !important;*/
        background: linear-gradient(#ec4b48, #900);

    transition: background-color 0.3s ease; /* Esto suaviza el cambio de color */
    height:60px;
}

li.nav-item:hover {
    background-color: #A00 !important; /* Esto cambia el color de fondo al pasar el mouse */
}
.nav-link
{
    font-size: 1.3rem !important;
    font-weight: 600 !important;
    color: #FFF !important;
}
.section-divider {
    border: 0;
    height: 2px;
    margin: 3.2em auto;
    padding-top: 120px;
}


@media screen and (max-width: 600px) {
 main{
    padding-top: 170px;
    max-width: 100% !important;
}
}