/*
  Page-specific styles for: Schriever Air Force Base (modern template)
  Loaded AFTER css/base.css and css/modern.css, so anything here overrides
  them for this page only. Put per-page layout tweaks in this file so a
  fix for this case study can never affect any other page.
  Scope every rule under #case-schriever-air-force-base.
*/

/* Source PDF right-aligns the title/tagline block under the banner,
   with the tagline set bold+italic (not just italic). */
#case-schriever-air-force-base .vbm-hero {
    text-align: right;
}
#case-schriever-air-force-base .vbm-title {
    font-weight: 700;
    font-family: Arial, Helvetica, sans-serif;
}
#case-schriever-air-force-base .vbm-tagline {
    font-weight: bold;
    color: #17365d;
}

/*
  The "OFFICES" label was sorting AFTER its own photo instead of before
  it (a live bug in the shared row_major_sort pipeline, tracked in
  PROGRESS_NOTES.md item #1) — fixed here by hand-ordering this page's
  markup. The wide top photo also turned out to be 2 real photos
  (office desk + hallway) merged into one asset by a false seam-match;
  they were split back out. Photos keep their true aspect ratio (no
  cropping, matching modern.css's own stated design) — this only
  replaces the flex-wrap odd-percentage-width rows with real grids.
*/
#case-schriever-air-force-base .vbm-gallery-row--grid2,
#case-schriever-air-force-base .vbm-gallery-row--grid3 {
    display: grid;
    gap: 16px 18px;
    margin-left: 0;
}
#case-schriever-air-force-base .vbm-gallery-row--grid2 { grid-template-columns: repeat(2, 1fr); }
#case-schriever-air-force-base .vbm-gallery-row--grid3 { grid-template-columns: repeat(3, 1fr); }
#case-schriever-air-force-base .vbm-gallery-row--grid2 .vbm-gallery__item,
#case-schriever-air-force-base .vbm-gallery-row--grid3 .vbm-gallery__item {
    flex: none;
    width: auto;
}
#case-schriever-air-force-base .vbm-gallery-row--grid2 .vbm-gallery__item img,
#case-schriever-air-force-base .vbm-gallery-row--grid3 .vbm-gallery__item img {
    width: 100%;
    height: auto;
}

/*
  photo-12/13 are noticeably taller than the wireframe (photo-11) at the
  same column width. Cap all 3 cells to the wireframe's own height
  (rather than letting the row stretch to the tallest photo) so they
  read as one consistent row — images stay uncropped and centered
  (object-fit: contain) instead of just clipping the taller ones.
*/
#case-schriever-air-force-base .vbm-gallery-row--capped .vbm-gallery__item {
    height: 370px;
    display: flex;
    align-items: center;
    justify-content: center;
}
#case-schriever-air-force-base .vbm-gallery-row--capped .vbm-gallery__item img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

@media (max-width: 768px) {
    #case-schriever-air-force-base .vbm-gallery-row--capped .vbm-gallery__item { height: 260px; }
}

@media (max-width: 480px) {
    #case-schriever-air-force-base .vbm-gallery-row--grid2,
    #case-schriever-air-force-base .vbm-gallery-row--grid3 {
        grid-template-columns: 1fr;
    }
}

/*
  PANEL UNITS pairs a wider label+swatches column against a narrower
  column of 2 stacked photos on the right (confirmed against the actual
  PDF page — roughly a 65/35 split, not even halves).
*/
#case-schriever-air-force-base .vbm-split-row {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 16px 18px;
    margin-top: 16px;
}
#case-schriever-air-force-base .vbm-split-row__left,
#case-schriever-air-force-base .vbm-split-row__right {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
#case-schriever-air-force-base .vbm-split-row__left img,
#case-schriever-air-force-base .vbm-split-row__right img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 2px;
}
#case-schriever-air-force-base .vbm-split-row .vbm-section-label {
    margin-top: 0;
}

@media (max-width: 480px) {
    #case-schriever-air-force-base .vbm-split-row {
        grid-template-columns: 1fr;
    }
}