/* ==========================================================
   RESPONSIVE
   Mobile-first breakpoint refinements for the global system.
   Breakpoints: sm 480 · md 768 · lg 1024 · xl 1280
   ========================================================== */

/* ---------- Small (480px+) ---------- */

@media (min-width: 480px) {
    .form__actions--stretch > .btn {
        flex: 0 1 auto;
    }
}

/* ---------- Medium (768px+) ---------- */

@media (min-width: 768px) {
    /* Grid column counts */
    .grid--2 {
        grid-template-columns: repeat(2, 1fr);
    }

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

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

    /* Split layouts */
    .split {
        grid-template-columns: 1fr 1fr;
    }

    .split--60-40 {
        grid-template-columns: 1.4fr 1fr;
    }

    .split--40-60 {
        grid-template-columns: 1fr 1.4fr;
    }

    .split--reverse .split__media {
        order: 1;
    }

    .split--reverse .split__content {
        order: 0;
    }

    /* Form rows — two columns when marked */
    .form__row--2 {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Cover height */
    .cover {
        min-height: min(80vh, 48rem);
    }

    /* Visibility helpers */
    .u-md-block  { display: block !important; }
    .u-md-flex   { display: flex !important; }
    .u-md-grid   { display: grid !important; }
    .u-md-none   { display: none !important; }

    .u-md-text-left   { text-align: left !important; }
    .u-md-text-center { text-align: center !important; }
    .u-md-text-right  { text-align: right !important; }
}

/* ---------- Large (1024px+) ---------- */

@media (min-width: 1024px) {
    .grid--3 {
        grid-template-columns: repeat(3, 1fr);
    }

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

    .section__header {
        margin-bottom: var(--space-8);
    }

    .cover {
        min-height: min(85vh, 52rem);
    }

    .u-lg-block  { display: block !important; }
    .u-lg-flex   { display: flex !important; }
    .u-lg-grid   { display: grid !important; }
    .u-lg-none   { display: none !important; }
}

/* ---------- Extra Large (1280px+) ---------- */

@media (min-width: 1280px) {
    .u-xl-block { display: block !important; }
    .u-xl-none  { display: none !important; }
}

/* ---------- Max-width hide/show (mobile-only patterns) ---------- */

@media (max-width: 767.98px) {
    .u-sm-only-none {
        display: none !important;
    }

    .btn-group {
        width: 100%;
    }

    .btn-group > .btn {
        flex: 1 1 auto;
        min-width: min(100%, 12rem);
    }

    .btn-group--stack {
        flex-direction: column;
        align-items: stretch;
    }

    .btn-group--stack > .btn {
        width: 100%;
    }

    /* Prevent horizontal overflow from long words in headings */
    h1,
    h2,
    .section__title {
        overflow-wrap: break-word;
    }
}

/* ---------- Hover-capable devices ---------- */

@media (hover: hover) and (pointer: fine) {
    .btn--primary:hover,
    .btn--accent:hover {
        transform: translateY(-1px);
    }

    .btn--primary:active,
    .btn--accent:active {
        transform: translateY(0);
    }
}

/* ---------- Print ---------- */

@media print {
    *,
    *::before,
    *::after {
        background: transparent !important;
        box-shadow: none !important;
        text-shadow: none !important;
        color: #000 !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

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

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

    .btn,
    .skip-link,
    .site-header__toggle,
    .u-fade-in {
        display: none !important;
    }

    .js .reveal,
    .reveal {
        opacity: 1 !important;
        transform: none !important;
    }

    .container {
        max-width: none;
        padding: 0;
    }

    .section {
        padding-block: 1.5rem;
    }
}