
.banner-section { min-height: 70vh; background-repeat: no-repeat; background-size: cover; background-position: center center; position: relative; display: flex; align-items: flex-end; justify-content: center; }

    .banner-section::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.25)); pointer-events: none; }

.banner-content { display: inline-block; text-align: center; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); z-index: 1; padding: 0 1.5rem; width: 85%; max-width: 1100px; }

.banner-title { display: inline-block; }

    .banner-title h1 { font-size: 2.5rem; font-weight: 700; color: #ffffff; /*text-transform: uppercase;*/ letter-spacing: 0.12em; margin: 0 0 0.5rem 0; line-height: 1.2; text-shadow: 2px 4px 8px rgba(0, 0, 0, 0.5); }

.title-divider { width: 100%; height: 4px; background: #dc0a1e; border-radius: 2px; }

@media (max-width: 1200px) {
    .banner-section { min-height: 65vh; }
    .banner-title h1 { font-size: 2.8rem; letter-spacing: 0.11em; }
}

@media (max-width: 992px) {
    .banner-section { min-height: 60vh; }
    .banner-title h1 { font-size: 2.5rem; letter-spacing: 0.1em; }
    .title-divider { height: 3px; }
}

@media (max-width: 768px) {
    .banner-section { min-height: 55vh; }
    .banner-title h1 { font-size: 2rem; letter-spacing: 0.09em; }
    .banner-content { padding: 0 1.25rem; width: 92%; }
}

@media (max-width: 576px) {
    .banner-section { min-height: 50vh; }
    .banner-title h1 { font-size: 1.75rem; letter-spacing: 0.08em; }
    .title-divider { height: 3px; }
    .banner-content { padding: 0 1rem; width: 95%; }
}

@media (max-width: 400px) {
    .banner-section { min-height: 45vh; }
    .banner-title h1 { font-size: 1.5rem; }
    .title-divider { height: 2.5px; }
}