/* Main-page layout follows the supplied 1080px-wide reference. */
.home-content { padding: 0; background: #000; min-height: 100vh; }
.home-layout { width: 100%; max-width: 1080px; margin: auto; padding: clamp(8px, 2.314815vw, 25px); display: grid; gap: clamp(8px, 2.314815vw, 25px); }
.home-three-columns, .home-two-columns, .home-four-columns, .home-column { display: grid; gap: clamp(8px, 2.314815vw, 25px); align-items: start; min-width: 0; }
.home-three-columns { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.home-two-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.home-four-columns { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.home-image { display: block; padding: 0; border: 0; width: 100%; background: black; cursor: zoom-in; min-width: 0; }
.main-content .home-image img { display: block; width: 100%; height: auto; margin: 0; }
.home-image:focus-visible { outline: 3px solid white; outline-offset: 3px; }
html.home-viewer-open { overflow: hidden; }
.home-viewer { position: fixed; inset: 0; margin: auto; padding: 44px 0 0; border: 8px solid rgb(3, 27, 98); background: rgb(3, 27, 98); max-width: 80vw; max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow: hidden; color: white; }
.home-viewer::backdrop { background: rgba(0, 0, 0, .85); }
.home-viewer-image { display: block; object-fit: contain; background: black; }
.home-viewer-close { position: absolute; top: 4px; right: 4px; width: 36px; height: 36px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.home-viewer-close img { display: block; width: 100%; height: 100%; object-fit: contain; }
.home-viewer-close:focus-visible { outline: 2px solid white; outline-offset: 2px; }
@media (max-width: 760px) {
    .home-content { margin-left: 0; }
    /* Keep the existing navigation within a narrow phone screen. */
    .sidebar .nav { padding: 0; gap: 4px; }
    .sidebar .nav a { min-width: 0; }
    .sidebar .nav a img { width: 100%; max-width: 250px; }
}
