/* ════════════════════════════════════════════════════════════════
   Research Base — responsive.css
   Tablet & mobile. The facility must still feel like a command center
   on a phone — never a collapsed dashboard.
   ════════════════════════════════════════════════════════════════ */

/* ── tablet ─────────────────────────────────────────────────────── */
@media (max-width: 960px) {
    /* the flat horizontal nav folds into a hamburger dropdown */
    .rb-navtoggle { display: grid; }

    .rb-nav {
        position: absolute;
        top: calc(100% + 0.55rem);
        right: clamp(1rem, 3vw, 2rem);
        left: clamp(1rem, 3vw, 2rem);
        flex-direction: column;
        gap: 0.2rem;
        padding: 0.5rem;
        background: rgba(9, 16, 25, 0.96);
        backdrop-filter: blur(14px) saturate(140%);
        -webkit-backdrop-filter: blur(14px) saturate(140%);
        border: 1px solid var(--rb-line-2);
        border-radius: var(--rb-radius-sm);
        box-shadow: 0 18px 44px rgba(0, 0, 0, 0.45);
        /* collapsed state — kept out of the tab order until opened */
        opacity: 0;
        visibility: hidden;
        transform: translateY(-8px);
        transition: opacity .22s ease, transform .22s ease, visibility 0s linear .22s;
    }
    .rb-nav.is-open {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
        transition: opacity .22s ease, transform .22s ease, visibility 0s;
    }
    .rb-nav a { padding: 0.7rem 0.9rem; }

    .rb-actions__grid { grid-template-columns: 1fr; margin-top: -3rem; }
    .rb-room__grid    { grid-template-columns: 1fr; }
    .rb-lab__panel    { grid-template-columns: 1fr; }
    .rb-lab__schematic { order: -1; }
    .rb-footer__inner { grid-template-columns: 1fr; }
    .rb-footer__nav   { justify-self: start; }
}

/* ── compact user control ───────────────────────────────────────── */
@media (max-width: 768px) {
    /* the full-name / "join us" button gives way to a compact avatar-sized control */
    .rb-commandbar__cta { display: none; }
    .rb-profile         { display: grid; }
}

/* ── mobile ─────────────────────────────────────────────────────── */
@media (max-width: 620px) {
    body.rb { font-size: 15px; }

    .rb-commandbar { gap: 0.75rem; padding: 0.6rem 1rem; }
    .rb-brand__meta { display: none; }
    .rb-commandbar__right .rb-btn--ghost { display: none; }

    .rb-hero { min-height: auto; padding-block: 7rem 4rem; }
    .rb-hero__title { font-size: clamp(2.2rem, 11vw, 3.2rem); }
    .rb-hero__cta { flex-direction: column; align-items: stretch; }
    .rb-hero__cta .rb-btn { justify-content: center; }
    .rb-signalstrip__item { flex-basis: calc(50% - 0.4rem); }
    .rb-hero__scroll { display: none; }

    /* the scene stays — it is the identity — but lighten the motion load */
    .rb-scene__grid { opacity: 0.3; }
    .rb-scene__facility { bottom: 20%; }

    .rb-board__grid   { grid-template-columns: 1fr; }
    .rb-archive__grid { grid-template-columns: 1fr; }
    .rb-future__grid  { grid-template-columns: 1fr; }

    .rb-board__rail { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 0.4rem; -webkit-overflow-scrolling: touch; }
    .rb-filter { flex: none; }

    .rb-blueprint { width: 180px; height: 180px; }
}

/* ── very small ─────────────────────────────────────────────────── */
@media (max-width: 380px) {
    .rb-signalstrip__item { flex-basis: 100%; }
}
