/* ... (El @import de la fuente y el body siguen igual) ... */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&display=swap');

body {
    font-family: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
    background-color: #212529;
}

/*
  ESTA CLASE SE MANTIENE
  Sigue siendo nuestro fondo de página completa.
  Ya no necesita 'd-flex' porque lo pusimos en el HTML.
*/
.page-wrapper {
    background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), 
                      url('../images/home-construccion.png');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    color: #ffffff;
}


/* NUEVA SECCIÓN: Estilos del Modal 
*/

.construction-modal {
    /* El color gris oscuro del modal */
    background-color: #555555; /* O el gris que prefieras */
    
    /* Los bordes curvos que pediste */
    border-radius: 15px;
    
    padding: 2.5rem; /* Espaciado interno */
    
    /* Sombra sutil para darle profundidad */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    
    /* Necesario para posicionar la 'X' */
    position: relative; 
}

.modal-close {
    position: absolute;
    top: 15px;
    right: 25px;
    font-size: 1.75rem;
    font-weight: 300; /* Hacemos la 'X' más delgada */
    color: #ffffff;
    cursor: pointer;
    opacity: 0.7;
}
.modal-close:hover {
    opacity: 1;
}

.construction-modal h1 {
    font-size: 2rem; /* 32px */
    font-weight: 500;
    line-height: 1.4;
    text-transform: uppercase;
    margin-bottom: 2rem; /* Espacio antes del divisor */

    @media (min-width: 768px) {
        font-size: 2.25rem; /* 36px */
    }
}

.modal-divider {
    /* Hacemos el <hr> blanco y visible */
    color: #ffffff;
    opacity: 0.75;
}

/* Estilos para el footer del modal (MKDI / 2025) */
.footer-brand,
.footer-year {
    font-size: 1.25rem; /* 20px */
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

/* CLASES ANTIGUAS (YA NO SE USAN)
  Las borramos o comentamos para limpiar
*/

/*
.logo-text { ... }
.main-heading { ... }
.year-text { ... }
*/