/* FUENTES Y ESTILOS GENERALES */
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css');

:root { 
    --font-headings: 'Montserrat', sans-serif; 
}

html { 
    scroll-behavior: smooth; 
}

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

.page-main-title {
    font-family: var(--font-headings);
    font-size: clamp(1.8rem, 5vw, 2.5rem);
    line-height: 1.2;
}

/* HEADER */
.image-hero {
    background-color: #1f2937;
    overflow: hidden;
}

/* BANNER DE NOTICIAS */
#dynamic-top-banner a { 
    text-decoration: underline; 
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    min-width: 0; 
}
#dynamic-top-banner a:hover { 
    color: #d1d5db; 
}

/* NUEVAS TARJETAS DE EVENTO (ESTILO /conciertos) */
.event-card-date-number {
    font-size: 1.875rem; /* text-3xl */
    line-height: 2.25rem;
}
.event-card-month {
    font-size: 0.875rem; /* text-sm */
}
.date-separator {
    font-size: 1.25rem;
    font-weight: 400;
    vertical-align: baseline;
}

/* FOOTER */
.footer-social-icons a { 
    transition: color 0.3s ease, transform 0.3s ease; 
}
.footer-social-icons a:hover { 
    color: #ffffff; 
    transform: translateY(-2px); 
}

/* NAVEGACIÓN */
.nav-social-icons a i { 
    color: #4B5563; 
    transition: color 0.3s ease; 
}
.nav-social-icons a:hover i { 
    color: #4f46e5; 
}

.image-hero {
    aspect-ratio: 16 / 9; /* Forzamos al contenedor a tener la proporción correcta */
}

.image-hero picture,
.image-hero img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}