/*
  Page-specific styles for: Fort Stewart (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-fort-stewart.
*/

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

/*
  The source PDF's gallery had several places where 2 real, distinct
  photos had been merged into a single asset by the extraction pipeline
  (a false-positive seam match), a duplicated photo embedded twice, and
  every section label (OFFICES/RECEPTION/PANELING/CONFERENCE) dropped.
  All of that was re-extracted directly from the source PDF pages and
  rebuilt here. 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 a real 2-column grid.
*/
#case-fort-stewart .vbm-gallery-row--grid2,
#case-fort-stewart .vbm-gallery-row--grid3 {
    display: grid;
    gap: 16px 18px;
    margin-left: 0;
}
#case-fort-stewart .vbm-gallery-row--grid2 { grid-template-columns: repeat(2, 1fr); }
#case-fort-stewart .vbm-gallery-row--grid3 { grid-template-columns: 1fr 1.5fr 1fr; }
#case-fort-stewart .vbm-gallery-row--grid2 .vbm-gallery__item,
#case-fort-stewart .vbm-gallery-row--grid3 .vbm-gallery__item {
    flex: none;
    width: auto;
}
#case-fort-stewart .vbm-gallery-row--grid2 .vbm-gallery__item img,
#case-fort-stewart .vbm-gallery-row--grid3 .vbm-gallery__item img {
    width: 100%;
    height: auto;
}

@media (max-width: 768px) {
    #case-fort-stewart .vbm-gallery-row--grid3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    #case-fort-stewart .vbm-gallery-row--grid2,
    #case-fort-stewart .vbm-gallery-row--grid3 {
        grid-template-columns: 1fr;
    }
}