/* Responsive hardening for hero banner overlay text on small devices */
.index-banner {
    width: 100%;
    max-width: 100vw;
    box-sizing: border-box;
    overflow: visible;
}

.index-banner .banner-text {
    min-width: 0;
    padding: 0 12px;
    box-sizing: border-box;
}

.index-banner .banner-logo {
    max-width: 100%;
    height: auto;
}

.index-banner .hero-tagline {
    max-width: 100%;
    margin: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    text-wrap: balance;
}

@media (max-width: 768px) {
    .index-banner {
        min-height: auto !important;
        padding: 30px 16px 10px !important;
        grid-template-rows: 1fr auto !important;
    }

    .index-banner .banner-text {
        max-width: calc(100% - 80px) !important;
        top: auto !important;
    }

    .index-banner .banner-logo {
        max-height: 52px;
        width: auto;
    }

    .index-banner .hero-tagline {
        font-size: 10px;
        line-height: 1.2;
        letter-spacing: 0.3px;
    }

    .index-banner .cta-business {
        font-size: 9px !important;
        padding: 6px 14px !important;
        top: auto !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
    }
}

@media (max-width: 480px) {
    .index-banner {
        padding: 24px 12px 8px !important;
    }

    .index-banner .banner-logo {
        max-height: 48px;
    }

    .index-banner .hero-tagline {
        font-size: 10px;
    }

    .index-banner .cta-business {
        font-size: 8px !important;
        padding: 5px 12px !important;
    }
}

@media (max-width: 320px) {
    .index-banner {
        padding: 20px 8px 6px !important;
    }

    .index-banner .banner-logo {
        max-height: 42px;
    }

    .index-banner .hero-tagline {
        font-size: 9px;
        line-height: 1.15;
    }

    .index-banner .cta-business {
        font-size: 7px !important;
        padding: 5px 10px !important;
    }
}