.fourDHero { padding-bottom: 12px; }
.fourDEyebrow { display:block; margin:0 0 10px; color:#0088af; font-size:12px; font-weight:700; letter-spacing:.09em; }
.fourDQuickLinks { display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
.fourDQuickLinks a { display:flex; align-items:center; gap:9px; padding:12px 16px; border:1px solid #d7e7ee; border-radius:10px; color:#153c55; background:#fff; text-decoration:none; font-size:14px; font-weight:600; }
.fourDQuickLinks a span { color:#009dc8; font-size:12px; }
.fourDQuickLinks a:hover { border-color:#00a9d3; background:#effbff; }
.fourDResourceGrid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin:24px 0 48px; align-items:start; }
.fourDResource { min-width:0; padding:24px; background:#fff; border:1px solid #dce8ef; border-radius:16px; scroll-margin-top:90px; }
.fourDResourceHeader h2 { margin:0 0 10px; color:#102b40; font-size:24px; line-height:1.35; }
.fourDResourceHeader p { margin:0 0 20px; color:#587084; font-size:15px; line-height:1.7; }
.fourDImageLink { display:block; padding:12px; border:1px solid #e2ecf2; border-radius:10px; text-decoration:none; background:#fff; }
.fourDImageLink img { display:block; width:100%; height:auto; max-width:560px; margin:auto; }
.fourDImageLink > span { display:flex; justify-content:space-between; padding:14px 2px 2px; color:#007caa; font-size:13px; font-weight:600; }
.fourDArchiveNote { margin:0 0 18px; border-left:3px solid #e4a629; border-radius:4px; padding:12px 14px; color:#79581b; background:#fff8e7; font-size:14px; line-height:1.6; }
.fourDViewer { width:min(960px,94vw); max-width:94vw; max-height:92vh; padding:0; border:0; border-radius:14px; color:#102b40; background:white; }
.fourDViewer::backdrop { background:rgba(4,20,37,.8); }
.fourDViewerBar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 20px; border-bottom:1px solid #dce8ef; }
.fourDViewerBar h2 { margin:0; font-size:18px; }
.fourDViewerBar button { flex-shrink:0; min-height:44px; padding:8px 14px; border:0; border-radius:8px; background:#eaf6fb; color:#125073; font:inherit; cursor:pointer; }
.fourDViewerBody { max-height:calc(92vh - 78px); overflow:auto; padding:20px; }
.fourDViewerBody img { display:block; max-width:100%; height:auto; margin:auto; }
.fourDQuickLinks a:focus-visible,.fourDImageLink:focus-visible,.fourDViewer button:focus-visible { outline:3px solid #00a7ce; outline-offset:4px; }
@media(max-width:760px) { .fourDResourceGrid { grid-template-columns:1fr; gap:18px; } .fourDResource { padding:18px; } .fourDResourceHeader h2 { font-size:22px; } .fourDQuickLinks { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); } .fourDQuickLinks a { padding:12px; font-size:13px; } .fourDViewerBody { padding:8px; } }
@media(prefers-reduced-motion:no-preference) { html:has(.fourDHero) { scroll-behavior:smooth; } }