/**
 * Galveston Deck Builder — responsive layer
 *
 * The drawer breakpoint is 1279px, not 1024px: measured 2026-09-14, the full desktop nav
 * (7 items + search + phone + quote button) pushed the header to 101px tall and overflowed
 * horizontally at 1100px. Keep in sync with mobileQuery in assets/js/main.js.
 */

/* ── Below 1280px: drawer navigation ──────────────────────────── */
@media (max-width: 1279px) {
    .gdb-nav__hamburger {
        display: inline-flex; align-items: center; gap: 10px;
        min-height: 48px; padding: 8px 12px;
        background: none; border: 2px solid var(--gdb-navy); border-radius: var(--gdb-radius-sm);
        color: var(--gdb-navy); font-weight: 700; cursor: pointer;
    }
    .gdb-nav__bars { display: inline-flex; flex-direction: column; gap: 4px; }
    .gdb-nav__bars span { display: block; width: 22px; height: 2px; background: currentColor; border-radius: 2px; }

    /* Closed menu is display:none, so its links are not in the tab order. */
    .gdb-nav {
        display: none;
        position: fixed; top: var(--gdb-header-h); left: 0; right: 0; bottom: 0; z-index: 999;
        flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0;
        padding: var(--gdb-space-sm) var(--gdb-space-md) var(--gdb-space-lg);
        background: var(--gdb-white); overflow-y: auto; border-top: 1px solid var(--gdb-border);
    }
    .gdb-nav.open { display: flex; }
    body.menu-open { overflow: hidden; }

    .gdb-nav__list { flex-direction: column; align-items: stretch; gap: 0; max-width: 720px; }
    .gdb-nav__item { border-bottom: 1px solid var(--gdb-border); }
    .gdb-nav__item--dropdown { flex-wrap: wrap; }
    .gdb-nav__link { flex: 1; min-height: 48px; padding: 12px 4px; font-size: 1.05rem; display: flex; align-items: center; }
    .gdb-nav__link[aria-current="page"] { box-shadow: inset 4px 0 0 var(--gdb-gold); padding-left: 12px; }
    .gdb-nav__toggle { width: 48px; height: 48px; margin: 0; }

    .gdb-nav__dropdown,
    .gdb-nav__item--dropdown:hover > .gdb-nav__dropdown,
    .gdb-nav__item--dropdown:focus-within > .gdb-nav__dropdown {
        display: none; position: static; flex-basis: 100%;
        min-width: 0; columns: 1; box-shadow: none; border: 0; border-left: 3px solid var(--gdb-gold);
        border-radius: 0; margin: 0 0 12px 8px; padding: 0;
    }
    .gdb-nav__item--dropdown.open > .gdb-nav__dropdown { display: block; }
    .gdb-nav__dropdown a { min-height: 44px; display: flex; align-items: center; padding: 8px 14px; white-space: normal; }

    .gdb-nav__cta { flex-direction: column; align-items: stretch; gap: 12px; margin-top: var(--gdb-space-md); max-width: 720px; }
    .gdb-nav__search { min-height: 48px; border: 1px solid var(--gdb-field); }
    .gdb-nav__search-word { position: static; width: auto; height: auto; overflow: visible; clip: auto; font-weight: 600; }
    .gdb-nav__phone { text-align: center; font-size: 1.2rem; min-height: 48px; }
    .gdb-btn-nav { min-height: 48px; }
}

/* ── Tablet and below: single-column heroes ─────────────────────── */
@media (max-width: 1024px) {
    .gdb-hero__inner, .gdb-page-hero__inner { grid-template-columns: 1fr; }
    .gdb-form-panel { max-width: 600px; }
    .gdb-grid-4 { grid-template-columns: repeat(2, 1fr); }
    .gdb-grid-3, .gdb-gallery { grid-template-columns: repeat(2, 1fr); }
    .gdb-footer__inner { grid-template-columns: repeat(2, 1fr); }
    .gdb-footer__col--brand { grid-column: 1 / -1; }
    .gdb-stats__inner { grid-template-columns: repeat(2, 1fr); }
}

/* ── Phones ──────────────────────────────────────────────────── */
@media (max-width: 768px) {
    :root { --gdb-space-xl: 48px; --gdb-space-lg: 32px; --gdb-header-h: 72px; }

    .gdb-header__logo img { height: 52px; }
    .gdb-grid-2, .gdb-grid-3, .gdb-gallery { grid-template-columns: 1fr; }
    .gdb-grid-4 { grid-template-columns: 1fr 1fr; }
    .gdb-link-list { columns: 1; }
    .gdb-footer__inner { grid-template-columns: 1fr 1fr; }
    .gdb-footer__bottom { flex-direction: column; align-items: flex-start; }
    .gdb-details { grid-template-columns: 1fr; gap: 2px; }
    .gdb-details dd { margin-bottom: 10px; }

    .gdb-hero__btns { flex-direction: column; }
    .gdb-hero__btns a { width: 100%; }

    /* Sticky call bar (Standard, Appendix F). Body padding keeps it off the footer. */
    .gdb-callbar {
        display: grid; grid-template-columns: 1fr 1fr;
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 900;
        box-shadow: 0 -2px 12px rgba(0, 32, 64, 0.2);
    }
    .gdb-callbar a {
        display: flex; align-items: center; justify-content: center; min-height: 56px;
        font-family: var(--gdb-font-display); font-size: 1.1rem; font-weight: 700;
        letter-spacing: 0.05em; text-transform: uppercase; text-decoration: none;
    }
    .gdb-callbar__call { background: var(--gdb-sun); color: var(--gdb-navy); }
    .gdb-callbar__quote { background: var(--gdb-navy); color: var(--gdb-white); }
    body { padding-bottom: 56px; }
    body.menu-open .gdb-callbar { display: none; }
}

@media (max-width: 480px) {
    .gdb-grid-4, .gdb-footer__inner { grid-template-columns: 1fr; }
    .gdb-header__logo img { height: 46px; }
    .gdb-search__row { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
}