/* ==========================================================================
   Responsive Styles - Global Adjustments
   ========================================================================== */

/* Desktop Large (≥1200px) - Default styles in base.css */

/* Desktop (992px - 1199px)
   ========================================================================== */
@media (max-width: 1199px) {
    :root {
        --container-padding: 20px;
    }

    h1 {
        font-size: 56px;
    }

    h2 {
        font-size: 32px;
    }
}

/* Tablet (768px - 991px)
   ========================================================================== */
@media (max-width: 991px) {
    :root {
        --spacing-xl: 60px;
        --spacing-xxl: 80px;
    }

    h1 {
        font-size: 48px;
    }

    h2 {
        font-size: 28px;
    }

    h3 {
        font-size: 22px;
    }

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

    /* Grid Adjustments */
    .col-3,
    .col-4 {
        width: 50%;
    }

    .row {
        margin: 0 -10px;
    }

    .col {
        padding: 0 10px;
    }
}

/* Mobile (≤767px)
   ========================================================================== */
@media (max-width: 767px) {
    :root {
        --container-padding: 15px;
        --spacing-md: 20px;
        --spacing-lg: 40px;
        --spacing-xl: 50px;
        --spacing-xxl: 60px;
    }

    body {
        font-size: 15px;
    }

    h1 {
        font-size: 36px;
    }

    h2 {
        font-size: 24px;
    }

    h3 {
        font-size: 20px;
    }

    h4 {
        font-size: 18px;
    }

    .section {
        padding: var(--spacing-lg) 0;
    }

    .section-title h2 {
        font-size: 28px;
    }

    /* Grid - All columns full width on mobile */
    .col,
    .col-2,
    .col-3,
    .col-4 {
        width: 100%;
        margin-bottom: 30px;
    }

    .col:last-child {
        margin-bottom: 0;
    }

    /* Buttons */
    .btn {
        padding: 12px 30px;
        font-size: 13px;
        width: 100%;
        text-align: center;
    }

    /* Cards */
    .card {
        padding: 30px 20px;
    }

    /* Utilities */
    .text-center-mobile {
        text-align: center;
    }

    .mb-mobile-0 {
        margin-bottom: 0;
    }

    .mb-mobile-1 {
        margin-bottom: var(--spacing-xs);
    }

    .mb-mobile-2 {
        margin-bottom: var(--spacing-sm);
    }

    .mb-mobile-3 {
        margin-bottom: var(--spacing-md);
    }
}

/* Small Mobile (≤480px)
   ========================================================================== */
@media (max-width: 480px) {
    h1 {
        font-size: 32px;
    }

    h2 {
        font-size: 22px;
    }

    .section-title h2 {
        font-size: 24px;
    }

    .btn {
        padding: 10px 25px;
    }
}

/* Print Styles
   ========================================================================== */
@media print {

    .site-header,
    .site-footer,
    .btn,
    .search-form-wrapper,
    .mobile-menu-toggle {
        display: none;
    }

    body {
        font-size: 12pt;
        color: #000;
        background: #fff;
    }

    a {
        text-decoration: underline;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        page-break-after: avoid;
    }

    img {
        max-width: 100%;
        page-break-inside: avoid;
    }
}