.page-intro-banner { position:relative; isolation:isolate; overflow:hidden; background:var(--ink); min-height:340px; display:flex; align-items:center; }
.page-banner-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.page-intro-banner::before { content:''; position:absolute; inset:0; background:linear-gradient(100deg,rgba(9,25,40,.9),rgba(9,25,40,.55)); z-index:-1; }
.page-intro-banner h1 { color:#fff; }
.page-intro-banner .lead { color:#edf3f9; }
.page-intro-banner .eyebrow { color:#b9d7fa; }
.page-intro-copy { position:relative; }
.banner-manager { margin-top:24px; margin-bottom:24px; padding-top:20px; padding-bottom:20px; border:1px solid var(--line); border-radius:12px; background:var(--paper); }
.banner-manager summary { cursor:pointer; font-weight:700; padding:8px 0; }
.banner-manager summary:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
.banner-options { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:16px; max-height:480px; overflow:auto; padding:8px; }
.banner-option { display:flex; flex-direction:column; border:1px solid var(--line); border-radius:10px; background:white; overflow:hidden; cursor:pointer; }
.banner-option img { width:100%; height:110px; object-fit:cover; }
.banner-option span { padding:12px; font-size:.78rem; overflow-wrap:anywhere; }
.banner-option:has(input:checked) { outline:3px solid var(--blue); }
.banner-option input { width:18px; height:18px; vertical-align:middle; accent-color:var(--blue); }
.banner-status { font-weight:600; }
.banner-form[aria-busy="true"] { opacity:.7; }
.banner-manager .button { border:0; }
@media(max-width:767px) { .page-intro-banner { min-height:300px; } .banner-options { grid-template-columns:repeat(2,minmax(0,1fr)); } }