/* ==========================================================================
   IQ Brain Consult — Responsive rules
   Desktop-first, matching Bootstrap breakpoints:
   xxl 1400 · xl 1200 · lg 992 · md 768 · sm 576
   ========================================================================== */

/* ≥1200px: desktop navigation — open the Services menu on hover as well as click */
@media (min-width: 1200px) and (hover: hover) {
    .nav-services:hover > .dropdown-menu { display: block; }
    .nav-services:hover .nav-caret .bi { transform: rotate(180deg); }
    .nav-services > .dropdown-menu::before {
        /* invisible bridge so the menu doesn't close while moving the pointer */
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: -12px;
        height: 12px;
    }
}
@media (min-width: 1200px) {
    .nav-services > .dropdown-menu { top: calc(100% + 8px); }
}

/* ≤1399px */
@media (max-width: 1399.98px) {
    .site-header .nav-link { padding: 8px 11px !important; font-size: .93rem; }
    .site-header .nav-link.active::after { left: 11px; right: 11px; }
    .pillar-rail__item { padding: 24px 20px 26px; }
}

/* ≤1199px: mobile/tablet navigation (slide-in panel) */
@media (max-width: 1199.98px) {
    :root { --header-h: 72px; }
    .brand-logo { height: 32px; }

    .offcanvas {
        --bs-offcanvas-width: min(380px, 88vw);
        background: var(--white);
    }
    .offcanvas-header { padding: 20px 24px; border-bottom: 1px solid var(--line); }
    .offcanvas-body { padding: 8px 24px 32px; display: flex; flex-direction: column; }

    .site-header .offcanvas .nav-link,
    .site-header.is-scrolled .offcanvas .nav-link {
        color: var(--ink);
        font-size: 1.12rem;
        padding: 15px 0 !important;
    }
    .site-header .offcanvas .nav-link.active { color: var(--blue); }
    .site-header .offcanvas .nav-link.active::after { display: none; }
    .offcanvas .nav-item { border-bottom: 1px solid var(--line); }
    .offcanvas .nav-split { justify-content: space-between; }
    .offcanvas .nav-caret,
    .site-header.is-scrolled .offcanvas .nav-caret {
        color: var(--ink);
        width: 44px;
        height: 44px;
        padding: 0;
        font-size: 1rem;
        display: grid;
        place-items: center;
    }
    .offcanvas .nav-services .dropdown-menu {
        border: 0;
        box-shadow: none;
        padding: 0 0 12px;
        margin: 0;
        background: transparent;
    }
    .offcanvas .nav-services .dropdown-item { padding: 10px 0 10px 4px; font-size: 1rem; }
    .offcanvas .nav-services .dropdown-item:hover,
    .offcanvas .nav-services .dropdown-item.active { background: transparent; color: var(--blue); }
    .offcanvas .nav-cta { border-bottom: 0; margin: 28px 0 0; }
    .offcanvas .nav-cta .btn { width: 100%; --bs-btn-padding-y: .9rem; }

    .offcanvas-contact {
        display: flex;
        flex-direction: column;
        gap: 14px;
        margin-top: auto;
        padding-top: 32px;
        font-size: .95rem;
    }
    .offcanvas-contact a { color: var(--body); text-decoration: none; display: flex; align-items: center; gap: 12px; }
    .offcanvas-contact .bi { color: var(--blue); font-size: 1.1rem; }

    .hero__media { inset: 0 0 0 30%; }
    .program-grid { grid-template-columns: repeat(2, 1fr); }
    .why-media__badge { right: 16px; }
    .framework-grid { grid-template-columns: repeat(3, 1fr); }
    .pillar-rail__item .bi { display: none; }
}

/* ≤991px: tablet */
@media (max-width: 991.98px) {
    body { font-size: 1rem; }

    /* Hero: image becomes a full background, rail drops below the copy */
    .hero { min-height: 0; }
    .hero__media { inset: 0; }
    .hero__media::after {
        background: linear-gradient(180deg, rgba(6, 20, 35, .8) 0%, rgba(6, 20, 35, .88) 55%, var(--navy-900) 100%);
    }
    .hero__inner { padding-top: calc(var(--header-h) + 64px); padding-bottom: 56px; }
    .pillar-rail { position: relative; background: var(--navy-950); backdrop-filter: none; }
    .pillar-rail .container { padding: 0; max-width: none; }
    .pillar-rail__list { grid-template-columns: repeat(2, 1fr); }
    .pillar-rail__list li { border-top: 1px solid var(--line-dark); }
    .pillar-rail__list li + li { border-left: 0; }
    .pillar-rail__list li:nth-child(even) { border-left: 1px solid var(--line-dark); }
    .pillar-rail__list li:last-child { grid-column: 1 / -1; }
    .pillar-rail__item { padding: 20px 24px; flex-direction: row; align-items: baseline; gap: 12px; }

    .section-head { flex-direction: column; align-items: flex-start; margin-bottom: 40px; }

    .stats { grid-template-columns: repeat(2, 1fr); margin-top: 56px; }
    .stat { padding: 28px 20px 28px 0; }
    .stat + .stat { padding-left: 0; border-left: 0; }
    .stat:nth-child(even) { padding-left: 24px; border-left: 1px solid #D9D5CB; }
    .stat:nth-child(n+3) { border-top: 1px solid #D9D5CB; }

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

    .focus-row { grid-template-columns: 1fr; gap: 32px; padding: 48px 0; }
    .focus-row--reverse .focus-row__media { order: 0; }
    .focus-row__media img { aspect-ratio: 16 / 10; }

    .why-media img { aspect-ratio: 16 / 11; }
    .why-media__badge { right: 16px; bottom: 16px; }

    .cta-band__inner { flex-direction: column; align-items: flex-start; }

    .contact-strip__grid { grid-template-columns: 1fr; }
    .contact-strip__item { padding: 22px 0; }
    .contact-strip__item + .contact-strip__item { border-left: 0; border-top: 1px solid var(--line); }
    .contact-strip__item:hover { background: transparent; }

    .offering-grid { grid-template-columns: repeat(2, 1fr); }
    .steps { grid-template-columns: repeat(2, 1fr); row-gap: 48px; }
    .other-services { grid-template-columns: repeat(2, 1fr); }
    .engagement-list li { grid-template-columns: 1fr; gap: 4px; }
    .program-grid--catalog { grid-template-columns: repeat(2, 1fr); }
    .framework-grid { grid-template-columns: repeat(2, 1fr); }
    .pool-band { grid-template-columns: 1fr; gap: 20px; }
    .hub-list { grid-template-columns: repeat(2, 1fr); }
    .article-hero-img { margin-top: -48px; }
    .footer-top { padding: 64px 0 48px; }
}

/* ≤767px: large phones */
@media (max-width: 767.98px) {
    .service-grid,
    .program-grid,
    .program-grid--catalog,
    .offering-grid,
    .why-grid { grid-template-columns: 1fr; }
    .why-grid { gap: 0; }
    .steps { grid-template-columns: 1fr; row-gap: 40px; }
    .service-card { padding: 30px 26px 28px; }
    .offering { padding: 28px 24px; }
    .focus-row__num { font-size: 1.6rem; padding: 10px 16px; }
    .map-embed iframe { height: 340px; }
    .article p, .article li { font-size: 1.05rem; }
    .article blockquote { font-size: 1.25rem; }
}

/* ≤575px: phones */
@media (max-width: 575.98px) {
    .container { padding-left: 20px; padding-right: 20px; }
    .hero__title { font-size: clamp(2.3rem, 10.5vw, 2.9rem); }
    .hero__lead { font-size: 1.06rem; }
    .hero__actions .btn { width: 100%; }
    .pillar-rail__list { grid-template-columns: 1fr; }
    .pillar-rail__list li:nth-child(even) { border-left: 0; }
    .pillar-rail__item { padding: 16px 20px; }

    .stats { grid-template-columns: 1fr 1fr; }
    .stat:nth-child(even) { padding-left: 16px; }
    .stat__label { font-size: .88rem; }

    .page-hero__lead { font-size: 1.05rem; }
    .cta-band__actions, .cta-band__actions .btn { width: 100%; }
    .other-services { grid-template-columns: 1fr; }
    .framework-grid { grid-template-columns: 1fr; }
    .hub-list { grid-template-columns: 1fr; }
    .why-media__badge { position: static; max-width: none; margin-top: 12px; }
    .glance { padding: 28px 22px; }
    .form-panel { padding: 24px 20px; }
    .footer-bottom { flex-direction: column; }
    .filter-bar { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; margin-left: -20px; margin-right: -20px; padding-left: 20px; padding-right: 20px; scrollbar-width: none; }
    .filter-bar::-webkit-scrollbar { display: none; }
    .filter-btn { flex: none; }
}

/* Page-specific responsive additions */
@media (max-width: 1199.98px) {
    .other-services--five { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 991.98px) {
    .svc-index__row { grid-template-columns: 72px 1fr; gap: 20px 24px; }
    .svc-index__row > :last-child { grid-column: 2; }
    .svc-index__num { font-size: 2.2rem; }
    .other-services--five { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 575.98px) {
    .svc-index__row { grid-template-columns: 1fr; padding: 36px 0; }
    .svc-index__row > :last-child { grid-column: auto; }
    .svc-index__list { columns: 1; }
    .other-services--five { grid-template-columns: 1fr; }
    .fact-list div { grid-template-columns: 1fr; gap: 2px; }
}