/* Mobile First - Responsive Breakpoints */

/* Mobile: default styles */
@media (max-width: 767px) {
    :root {
        --font-size-4xl: 2rem;
        --font-size-3xl: 1.5rem;
        --font-size-2xl: 1.25rem;
    }

    .site-logo {
        font-size: var(--font-size-sm);
    }

    .logo-icon-divider {
        height: 1.5rem;
    }

    main {
        margin-top: 4rem;
    }

    /* Hide desktop nav, show hamburger */
    .main-nav {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: var(--color-bg);
        flex-direction: column;
        justify-content: center;
        padding: var(--space-xl);
        transform: translateX(100%);
        transition: transform var(--transition-base);
        z-index: 99;
    }

    .main-nav.open {
        transform: translateX(0);
    }

    .nav-list {
        flex-direction: column;
        gap: 0;
        width: 100%;
    }

    .nav-link {
        display: block;
        padding: var(--space-md) 0;
        font-size: var(--font-size-lg);
        border-bottom: 1px solid var(--color-border);
    }

    .nav-link::after {
        display: none;
    }

    .menu-toggle {
        display: block;
    }

    /* On mobile, hide bottom nav row */
    .site-header > .container > .main-nav {
        display: none;
    }

    .site-header > .container > .main-nav.open {
        display: flex;
    }

    .header-top {
        padding: var(--space-sm) 0;
    }

    /* Grid */
    .grid-3 {
        grid-template-columns: 1fr;
    }

    .grid-2 {
        grid-template-columns: 1fr;
    }

    /* Hero */
    .hero {
        min-height: auto;
        padding: var(--space-3xl) 0;
    }

    .hero-content {
        flex-direction: column;
        align-items: flex-start;
    }

    .hero p {
        margin-bottom: var(--space-lg);
    }

    /* Footer */
    .footer-grid {
        grid-template-columns: 1fr;
        gap: var(--space-xl);
    }

    .footer-bottom {
        flex-direction: column;
        gap: var(--space-sm);
        text-align: center;
    }

    /* Cookie Consent */
    .cookie-consent .container {
        flex-direction: column;
        text-align: center;
    }

    /* Contact Form & Info */
    .contact-grid {
        grid-template-columns: 1fr;
    }

    /* Info Table */
    .info-table th,
    .info-table td {
        display: block;
        width: 100%;
        padding: var(--space-xs) 0;
    }

    .info-table th {
        padding-top: var(--space-sm);
    }

    .info-table td {
        padding-bottom: var(--space-sm);
    }
}

/* Tablet */
@media (min-width: 768px) and (max-width: 1023px) {
    .grid-3 {
        grid-template-columns: repeat(2, 1fr);
    }

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

/* Desktop (1024px+) */
@media (min-width: 1024px) {
    .hero h1 {
        font-size: 2.5rem;
    }

    .contact-grid {
        grid-template-columns: 1.5fr 1fr;
        gap: var(--space-3xl);
    }
}