/* =========================
VIDYA — RESPONSIVE.CSS
Mobile-first overrides. Breakpoints checked: 360, 390, 430, 768,
1024, 1280, 1440.
========================= */

/* =========================
   TABLET (<=1024px)
========================= */

@media (max-width: 1024px) {

    .pillars-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .programme-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .anthology-facts {
        grid-template-columns: repeat(2, 1fr);
    }

    .footer-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .hero h1 {
        font-size: 42px;
    }
}

/* =========================
   MOBILE (<=768px)
========================= */

@media (max-width: 768px) {

    h1 { font-size: 34px; }
    h2 { font-size: 28px; }

    section {
        padding: var(--space-xl) 0;
    }

    /* Header collapses to hamburger */

    .nav-toggle-btn {
        display: flex;
    }

    .brand-tagline {
        display: none;
    }

    .site-nav {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: var(--surface);
        border-bottom: 1px solid var(--border);
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
        padding: var(--space-sm) 20px var(--space-md);
        display: none;
    }

    .site-nav ul {
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
        width: 100%;
    }

    .site-nav ul li {
        width: 100%;
        border-bottom: 1px solid var(--border);
    }

    .site-nav ul li a {
        display: block;
        padding: 14px 0;
    }

    .nav-cta {
        margin-top: var(--space-sm);
        width: 100%;
        text-align: center;
    }

    .nav-toggle-input:checked ~ .site-nav {
        display: flex;
    }

    .header-inner {
        position: relative;
    }

    /* Hero stacks */

    .hero-inner {
        flex-direction: column;
        text-align: center;
    }

    .hero-actions {
        justify-content: center;
    }

    .hero-subtitle {
        margin-left: auto;
        margin-right: auto;
    }

    /* Grids collapse to one column */

    .pillars-grid,
    .programme-grid,
    .anthology-facts {
        grid-template-columns: 1fr;
    }

    .featured-programme {
        text-align: center;
    }

    .featured-programme-content .hero-actions {
        justify-content: center;
    }

    .footer-grid {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .footer-bottom {
        flex-direction: column;
        text-align: center;
    }

    .footer-bottom nav a {
        margin: 0 8px;
    }
}

/* =========================
   SMALL MOBILE (<=430px)
========================= */

@media (max-width: 430px) {

    .container {
        padding: 0 16px;
    }

    .hero {
        padding: var(--space-lg) 0;
    }

    .hero h1 {
        font-size: 30px;
    }

    .brand-name {
        font-size: 1.1rem;
    }

    .btn {
        width: 100%;
        text-align: center;
    }

    .hero-actions {
        flex-direction: column;
    }
}

/* =========================
   LARGE DESKTOP (>=1440px)
========================= */

@media (min-width: 1440px) {

    .container {
        max-width: 1320px;
    }
}
