/*
  Page-specific styles for: The United States Naval Academy Alumni Association & Foundation (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-theunitedstatesnavalacademyalumniassociationfoundation.
*/

/* Unlike other modern pages, this source PDF keeps the (2-line) title
   left-aligned and only right-aligns the tagline underneath it, set
   bold+italic. */
#case-theunitedstatesnavalacademyalumniassociationfoundation .vbm-title {
    font-weight: 700;
    font-family: Arial, Helvetica, sans-serif;
}
#case-theunitedstatesnavalacademyalumniassociationfoundation .vbm-tagline {
    text-align: right;
    font-weight: bold;
    color: #17365d;
}

/* The 3 bottom gallery photos share a similar ~4:3 aspect ratio and
   were laid out as 2 separate flex rows (2 photos, then 1 alone with a
   lot of empty space beside it) — replace with one real 2-col grid. */
#case-theunitedstatesnavalacademyalumniassociationfoundation .vbm-gallery-row--grid2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px 18px;
    margin-left: 0;
}
#case-theunitedstatesnavalacademyalumniassociationfoundation .vbm-gallery-row--grid2 .vbm-gallery__item {
    flex: none;
    width: auto;
    aspect-ratio: 4 / 3;
    overflow: hidden;
}
#case-theunitedstatesnavalacademyalumniassociationfoundation .vbm-gallery-row--grid2 .vbm-gallery__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width: 480px) {
    #case-theunitedstatesnavalacademyalumniassociationfoundation .vbm-gallery-row--grid2 {
        grid-template-columns: 1fr;
    }
}