/* Approved London panorama. Clip only the artwork, never search suggestions. */
body .catalog-banner{position:relative;isolation:isolate;margin:12px 0 24px;padding:30px 36px 26px;border:1px solid #c7d2ba26;border-radius:30px;min-width:0}
.catalog-banner-art{position:absolute;inset:0;overflow:hidden;border-radius:inherit;z-index:-1;pointer-events:none;background:#101b13}
.catalog-banner-art:before{content:'';position:absolute;inset:-20px;background:url('assets/images/hero-london.jpg') center 52%/cover;filter:blur(6px);opacity:.66}
.catalog-banner-art:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0b170de8 0%,#0b170d8a 55%,#0a140c44),linear-gradient(0deg,#080e08e6,transparent 85%)}
body .catalog-banner .breadcrumbs{padding:0;margin-bottom:32px;color:#d5d9cc}
body .catalog-banner .archive-heading{padding:0;margin:0 0 44px}
body .catalog-banner .archive-heading .eyebrow{display:none}
body .catalog-banner h1{font-size:clamp(30px,3.7vw,52px);line-height:1.15;letter-spacing:-.04em;color:#f3f3ec;margin:0;overflow-wrap:anywhere}
body .catalog-banner .catalog-banner-intro{font-size:17px;line-height:1.6;color:#d3d8c9;margin:18px 0 0;max-width:60ch}
body .catalog-banner>.intro{color:#d3d8c9;max-width:70ch}
body .catalog-banner .directory-filters{margin:0}
body .catalog-banner .advanced-filters{margin-top:14px}
html body .catalog-banner .advanced-filters>summary{background:#101810cc;color:#dce2d5;border-color:#d5e4c02e}
html body .catalog-banner .advanced-filters>summary:hover{background:#233125;color:#f3f3ec}
body .catalog-banner :is(.search-area,.active-filters>a){color:#dce2d5}
body .catalog-banner .active-filters{margin-top:18px}
body .catalog-banner+.category-chips{margin-top:24px}
body .catalog-banner .breadcrumbs a:focus-visible,body .catalog-banner .advanced-filters>summary:focus-visible{outline-color:#dce2d5}
@media(max-width:760px){
 body .catalog-banner{padding:24px;border-radius:24px}
 body .catalog-banner .breadcrumbs{margin-bottom:24px}
 body .catalog-banner .archive-heading{margin-bottom:28px}
 body .catalog-banner .catalog-banner-intro{font-size:15px;margin-top:14px}
}

body .catalog-banner .breadcrumbs :is(a,li,span){color:inherit}
/* Search fields are independent surfaces with one consistent focus boundary. */
.catalog-banner{--search-field:rgba(250,252,248,.96);--search-field-active:#f3f8f1;--search-edge:#d8e1d3;--search-focus:#477755;--search-glow:rgba(71,119,85,.14)}
:root[data-theme=dark] .catalog-banner{--search-field:rgba(17,25,19,.94);--search-field-active:#1a291f;--search-edge:#3c4b3d;--search-focus:#8caa89;--search-glow:rgba(140,170,137,.12)}
html body .catalog-banner .directory-filters .search-bar{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) auto;align-items:stretch;gap:14px;padding:0;background:none;border:0;border-radius:0;box-shadow:none}
html body .catalog-banner .directory-filters .search-bar label{display:grid;grid-template-columns:22px minmax(0,1fr);grid-template-rows:auto auto;column-gap:14px;row-gap:3px;align-content:center;width:100%;min-width:0;min-height:80px;margin:0;padding:15px 20px;border:1px solid var(--search-edge);border-radius:18px;background:var(--search-field);color:var(--ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.04);outline:none;grid-column:auto}
html body .catalog-banner .search-bar label>.icon{grid-column:1;grid-row:1/3;align-self:center;width:21px;height:21px;color:var(--muted)}
html body .catalog-banner .search-bar .search-field-label{position:static;width:auto;height:auto;clip:auto;clip-path:none;overflow:visible;white-space:normal;margin:0;padding:0;border:0;grid-column:2;font-size:12px;line-height:1.4;font-weight:650;color:var(--muted)}
html body .catalog-banner .directory-filters .search-bar input{grid-column:2;grid-row:2;min-height:26px;width:100%;padding:0;border:0;border-radius:0;background:transparent;font-size:16px;line-height:1.5;color:var(--ink)}
html body .catalog-banner .directory-filters .search-bar label:focus-within{outline:none;background:var(--search-field-active);border-color:var(--search-focus);box-shadow:0 0 0 3px var(--search-glow)}
html body .catalog-banner .search-bar label:focus-within>.icon{color:var(--search-focus)}
html body .catalog-banner .directory-filters .search-bar input:focus{outline:none;box-shadow:none;background:transparent}
html body .catalog-banner .directory-filters .search-bar button{grid-column:auto;align-self:stretch;width:auto;min-width:132px;margin:0;border-radius:18px;padding:16px 24px}
html body .catalog-banner .location-results{left:0;right:0;min-width:0}
@media(max-width:900px){
 html body .catalog-banner .directory-filters .search-bar{grid-template-columns:repeat(2,minmax(0,1fr))}
 html body .catalog-banner .directory-filters .search-bar button{grid-column:1/-1;min-height:52px}
}
@media(max-width:600px){
 html body .catalog-banner .directory-filters .search-bar{grid-template-columns:minmax(0,1fr);gap:12px}
 html body .catalog-banner .directory-filters .search-bar label{min-height:76px;padding:13px 16px;column-gap:12px}
}
@media(max-width:480px){body .catalog-banner{padding:20px 16px;margin-top:8px}}
@media(forced-colors:active){html body .catalog-banner .directory-filters .search-bar label:focus-within{outline:2px solid Highlight;outline-offset:2px}}
/* Intro-only banners keep the panorama's visual presence without search controls. */
body .catalog-banner.account-overview-banner{min-height:240px;padding-block:40px;display:flex;flex-direction:column;justify-content:center}
body .account-overview-banner .catalog-banner-intro{width:100%;max-width:64ch;text-wrap:pretty;overflow-wrap:break-word}
body .account-overview-banner h1{text-wrap:balance}
@media(max-width:760px){body .catalog-banner.account-overview-banner{min-height:220px;padding-block:30px}body .account-overview-banner .catalog-banner-intro{max-width:48ch;line-height:1.7}}

@media(max-width:760px){
 body .catalog-banner .catalog-intro-lead,body .catalog-banner .catalog-intro-detail{display:block}
 body .catalog-banner .catalog-intro-detail{max-width:34ch;text-wrap:balance}
}

body .account-overview-banner .account-intro-sentence{display:block;text-wrap:balance}
/* Selected filters need their own foreground on the dark panorama. */
html body .catalog-banner .active-filters>a[data-remove-filter]{background:#dce5d5;border-color:#b1c2a7;color:#203024;font-weight:600}
html body .catalog-banner .active-filters>a[data-remove-filter]:is(:hover,:active){background:#edf3e8;border-color:#d2dfc9;color:#152219;filter:none}
html body .catalog-banner .active-filters>a[data-remove-filter] span{color:inherit}
html body .catalog-banner .active-filters>a:focus-visible{outline:2px solid #f3f3ec;outline-offset:3px}
/* Primary search action stands apart from the panorama in either theme. */
html body .catalog-banner .directory-filters .search-bar>button{background:#d4e4b7;color:#1c2b20;border:1px solid #b4cd91;font-size:16px;font-weight:800;box-shadow:0 4px 16px #07130824;filter:none}
html body .catalog-banner .directory-filters .search-bar>button:hover{background:#e4f0cb;color:#142119;border-color:#d4e7b7;box-shadow:0 5px 20px #07130838;filter:none}
html body .catalog-banner .directory-filters .search-bar>button:active{background:#bfd29e;color:#142119;box-shadow:0 1px 5px #07130824}
html body .catalog-banner .directory-filters .search-bar>button:focus-visible{outline:3px solid #fff;outline-offset:4px}

/* Keep the London Eye in the narrow mobile crop. */
@media(max-width:600px){body .catalog-banner-art:before{background-position:73% center;filter:blur(2px)}}