.lab-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp-5); }
.lab-card { position:relative; border-radius:var(--radius-md); overflow:hidden; aspect-ratio:3/4; }
.lab-card img { width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease-out); }
.lab-card:hover img { transform:scale(1.08); }
.lab-overlay {
  position:absolute; inset:0; background:linear-gradient(180deg, transparent 40%, rgba(20,17,13,.88) 100%);
  display:flex; align-items:flex-end; padding:var(--sp-5);
}
.lab-overlay h4 { color:#fff; font-size:1.05rem; }
.lab-overlay span { color:#E8CBA6; font-family:var(--font-mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; }

@media (max-width:980px){ .lab-grid { grid-template-columns:repeat(2,1fr); } }
/* =========================================================
   PREMIUM MOBILE TOPBAR
========================================================= */

@media (max-width: 768px) {

    .topbar {
        width: 100%;
        background: #111827;
        color: #fff;
        overflow: hidden;
        border-bottom: 1px solid rgba(255,255,255,.08);
    }

    .topbar .container {
        width: 100%;
        max-width: 100%;
        padding: 0 10px;
    }

    /* Main content */
    .topbar .row {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 6px 8px !important;
        padding: 8px 0 !important;
    }

    /* Every item stays visible */
    .topbar a {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        color: #fff;
        text-decoration: none;
        white-space: nowrap;
        font-size: 11px;
        font-weight: 600;
        line-height: 1;
    }

    /* -----------------------------------------
       PHONE + EMAIL
    ----------------------------------------- */

    .topbar a[href^="tel:"],
    .topbar a[href^="mailto:"] {
        padding: 7px 9px;
        background: rgba(255,255,255,.07);
        border: 1px solid rgba(255,255,255,.08);
        border-radius: 8px;
    }

    /* -----------------------------------------
       ADMISSION
    ----------------------------------------- */

    .topbar a[href*="admission"],
    .topbar .admission {
        color: #fff;
        background: #ff671f;
        padding: 7px 11px;
        border-radius: 8px;
        font-weight: 800;
        box-shadow: 0 4px 12px rgba(255,103,31,.22);
    }

    /* -----------------------------------------
       360 TOUR
    ----------------------------------------- */

    .topbar a[href*="maps"] {
        padding: 7px 10px;
        background: rgba(255,255,255,.06);
        border: 1px solid rgba(255,255,255,.08);
        border-radius: 8px;
    }

    /* -----------------------------------------
       ALUMNI / CAREERS / NOTICES
    ----------------------------------------- */

    .topbar a[href*="alumni"],
    .topbar a[href*="careers"],
    .topbar a[href*="notices"] {
        padding: 6px 10px;
        background: rgba(255,255,255,.05);
        border-radius: 7px;
    }

    /* Hover / tap */
    .topbar a:active,
    .topbar a:hover {
        color: #ffb18c;
    }

}