/*
  Page-specific styles for: Maxwell 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-maxwell-air-force-base.
*/

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

/*
  Section-label ordering bug (tracked in PROGRESS_NOTES.md item #1): photos
  that belong under a given section label were sorting BEFORE it instead of
  after — fixed here by hand-reordering this page's markup (OFFICES moved
  above photo-1/2/3, the 4 OUTDOOR LOUNGE furniture photos regrouped after
  their label). The 4 outdoor-lounge photos also get a real 4-col grid
  instead of scattered flex-wrap rows at odd widths/margins. Photos keep
  their true aspect ratio (no cropping, matching modern.css's own stated
  design).
*/
#case-maxwell-air-force-base .vbm-gallery-row--grid4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px 18px;
    margin-left: 0;
    align-items: end;
}
#case-maxwell-air-force-base .vbm-gallery-row--grid4 .vbm-gallery__item {
    flex: none;
    width: auto;
}
#case-maxwell-air-force-base .vbm-gallery-row--grid4 .vbm-gallery__item img {
    width: 100%;
    height: auto;
}

@media (max-width: 768px) {
    #case-maxwell-air-force-base .vbm-gallery-row--grid4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    #case-maxwell-air-force-base .vbm-gallery-row--grid4 { grid-template-columns: 1fr; }
}

/*
  The "Wall Talker" + "Mobile Glassboard" photo was 1 asset containing 3
  real captioned product shots (2 Wall Talker install photos + the
  glassboard) scattered as a single oddly-sized image. Split into 3 real
  photos and laid out as a 3-col row with their real captions rebuilt as
  text (captions were baked into the original PDF image, lost on split).
*/
#case-maxwell-air-force-base .vbm-gallery-row--grid3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px 18px;
    margin-left: 0;
    align-items: start;
}
#case-maxwell-air-force-base .vbm-gallery-row--grid3 .vbm-gallery__item {
    flex: none;
    width: auto;
}
#case-maxwell-air-force-base .vbm-gallery-row--grid3 .vbm-gallery__item img {
    width: 100%;
    height: auto;
    display: block;
}
#case-maxwell-air-force-base .vbm-caption {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid var(--vbcs-rule);
    font-size: 12px;
    color: var(--vbcs-text);
}

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