/* ========================================
   HERO BLOCK STYLES
   ======================================== */

/* Hero section base - height is controlled by JS */
.hero-section {
    min-height: 100vh;
    /* Fallback only */
}

/* Fixed 620px height option */
.hero-section[data-hero-height="620px"] {
    min-height: 620px !important;
}

.hero-container {
    min-height: clamp(500px, 80vh, 1080px);
}

/* Limit container height for fixed 620px hero */
.hero-section[data-hero-height="620px"] .hero-container {
    min-height: 620px !important;
    max-height: 620px !important;
    height: 620px !important;
}

/* Mobile */
@media (max-width: 640px) {
    .hero-container {
        min-height: 100svh !important;
        padding-top: 100px !important;
    }
}

/* Tablet (641px - 1279px) */
@media (min-width: 641px) and (max-width: 1279px) {
    .hero-container {
        min-height: clamp(600px, 85vh, 900px) !important;
        padding-top: 140px !important;
    }
}

/* Desktop (1280px+) */
@media (min-width: 1280px) {
    .hero-container {
        padding-top: 300px !important;
    }
}

@media (min-width: 1600px) {
    .hero-container {
        padding-top: 350px !important;
    }
}

/* Reduce text spacing on mobile/tablet */
@media (max-width: 1279px) {
    .hero-text-content {
        gap: 0.75rem !important;
    }

    .hero-text-content>* {
        margin-bottom: 0.25rem;
    }
}

/* Mobile text sizing - scale down hero text */
@media (max-width: 640px) {
    .hero-text-content .text-6xl {
        font-size: 2rem !important;
        /* 32px instead of 60px */
        line-height: 1.2 !important;
    }

    .hero-text-content .text-5xl {
        font-size: 1.75rem !important;
        /* 28px instead of 48px */
        line-height: 1.2 !important;
    }

    .hero-text-content .text-4xl {
        font-size: 1.5rem !important;
        /* 24px instead of 36px */
        line-height: 1.25 !important;
    }

    .hero-text-content .text-3xl {
        font-size: 1.25rem !important;
        /* 20px instead of 30px */
        line-height: 1.3 !important;
    }

    .hero-text-content .text-2xl {
        font-size: 1.125rem !important;
        /* 18px instead of 24px */
        line-height: 1.4 !important;
    }

    .hero-text-content .text-xl {
        font-size: 1rem !important;
        /* 16px instead of 20px */
        line-height: 1.5 !important;
    }
}