/* Banners exclusivos de Contacto y Refiere y Gana. */
.contact-hero.tspr-page-banner,
.referral-hero.tspr-page-banner {
    box-sizing: border-box;
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    width: 100%;
    height: auto;
    min-height: 300px;
    padding: 56px 24px;
    margin: 0;
    text-align: center;
    color: #fff;
    background-color: #111;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    border-bottom: none;
}
.contact-hero.tspr-page-banner {
    background-image: linear-gradient(rgba(0,0,0,.65), rgba(0,0,0,.78)), url('../images/hero-contacto.webp');
}
.referral-hero.tspr-page-banner {
    background-image: linear-gradient(rgba(0,0,0,.65), rgba(0,0,0,.78)), url('../images/back-refiere.webp');
}
/* Sustituye cualquier overlay anterior para evitar oscurecer dos veces. */
.tspr-page-banner.contact-hero::before,
.tspr-page-banner.contact-hero::after,
.tspr-page-banner.referral-hero::before,
.tspr-page-banner.referral-hero::after { content: none; }
.tspr-page-banner .referral-hero-content {
    position: relative;
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    padding: 0;
    background: transparent;
}
.contact-hero.tspr-page-banner h1,
.referral-hero.tspr-page-banner h1 {
    margin: 0 0 12px;
    color: #fff;
    font-size: clamp(30px, 4vw, 48px);
    line-height: 1.15;
    text-shadow: 0 2px 16px rgba(0,0,0,.5);
}
.contact-hero.tspr-page-banner p,
.referral-hero.tspr-page-banner p {
    max-width: 680px;
    margin: 0 auto;
    color: #eee;
    font-size: clamp(16px, 1.6vw, 19px);
    line-height: 1.6;
}
.referral-hero.tspr-page-banner .referral-main-button { margin-top: 24px; }
@media (max-width: 600px) {
    .contact-hero.tspr-page-banner,
    .referral-hero.tspr-page-banner {
        min-height: 240px;
        padding: 40px 20px;
        gap: 8px;
    }
    .contact-hero.tspr-page-banner {
        background-image: linear-gradient(rgba(0,0,0,.65), rgba(0,0,0,.78)), url('../images/hero-contacto-movil.webp');
    }
    .referral-hero.tspr-page-banner {
        background-image: linear-gradient(rgba(0,0,0,.65), rgba(0,0,0,.78)), url('../images/back-refiere-movil.webp');
    }
}
.referral-hero.tspr-page-banner {
    border-bottom: 0 !important;
    box-shadow: none !important;
}

.referral-hero.tspr-page-banner + section {
    border-top: 0 !important;
}

.referral-hero.tspr-page-banner::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 65px;
    background: linear-gradient(transparent, #080808);
    pointer-events: none;
}

.referral-hero.tspr-page-banner .referral-hero-content {
    z-index: 1;
}