.hero-banner{position:relative;z-index:3;width:72%;max-width:900px}.hero-slides{display:grid}.hero-slide{grid-area:1/1;animation:banner-enter .55s ease-out}.hero-slide[hidden]{display:none}.hero-banner h1,.hero-banner h2{font-size:clamp(44px,5.5vw,76px);font-weight:800;line-height:1.02;letter-spacing:-.05em;margin:22px 0 24px;max-width:100%}.hero-banner p{max-width:100%;font-size:20px}.hero-slides{min-height:355px}.banner-controls{display:flex;gap:14px;align-items:center;margin-top:28px}.banner-controls button{border:1px solid #d5d5d5;background:#fff;color:#111315;border-radius:24px;min-height:44px;min-width:44px;padding:8px 14px;font:inherit;cursor:pointer}.banner-controls button:hover{border-color:#f15a29}.banner-controls span{font-size:12px;letter-spacing:2px}.hero-proof{position:relative;z-index:3}@keyframes banner-enter{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}@media(max-width:800px){.hero-banner{width:72%}.hero-banner h1,.hero-banner h2{font-size:44px}.hero-slides{min-height:440px}}@media(max-width:600px){.hero-banner{width:100%}.hero-banner h1,.hero-banner h2{font-size:42px}.hero-banner p{font-size:17px}.hero-slides{min-height:440px}.banner-controls{gap:8px}.hero-banner .actions{flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){.hero-slide{animation:none}}
/* Reserve room for the longest panel so rotation does not move the content below. */
@media(min-width:801px){.hero-slides{min-height:440px}}
@media(min-width:601px) and (max-width:800px){.hero-slides{min-height:600px}}
@media(max-width:600px){.hero-slides{min-height:540px}}
.banner-controls{gap:2px}.banner-controls .banner-dot{position:relative;border:0;background:transparent;border-radius:50%;width:44px;height:44px;min-width:44px;padding:0}.banner-dot:before{content:"";position:absolute;width:9px;height:9px;left:17px;top:17px;border-radius:50%;background:#818589;transition:background .2s,transform .2s}.banner-dot[aria-current=true]:before{background:#f15a29;transform:scale(1.35)}.banner-dot:focus-visible{outline:2px solid #111315;outline-offset:0}.hero{background-color:#f7f8f8}.hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(255,255,255,.94),rgba(255,255,255,.78) 60%,rgba(255,255,255,.65)),url('../images/city-triptych.png');background-size:100% 100%,300% 100%;background-position:center,left center;pointer-events:none}.hero[data-city="1"]:before{background-position:center,center center}.hero[data-city="2"]:before{background-position:center,right center}.hero:after{opacity:.5}@media(max-width:600px){.hero:before{background-size:100% 100%,auto 100%;background-image:linear-gradient(rgba(255,255,255,.92),rgba(255,255,255,.82)),url('../images/city-triptych.png')}}
.hero[data-city="0"]:before{background-image:linear-gradient(90deg,rgba(255,255,255,.92),rgba(255,255,255,.76) 60%,rgba(255,255,255,.62)),url('../images/washington-photo.jpg');background-size:100% 100%,cover;background-position:center,center 55%}
@media(max-width:600px){.hero[data-city="0"]:before{background-image:linear-gradient(rgba(255,255,255,.92),rgba(255,255,255,.82)),url('../images/washington-photo.jpg');background-position:center,52% center}}
/* Keep all foreground copy legible independently of the city photograph. */
.hero-banner{background:rgba(255,255,255,.94);border-radius:18px;padding:24px;box-shadow:0 8px 36px rgba(17,19,21,.035)}
.hero-banner h1,.hero-banner h2{color:#111315;overflow-wrap:normal}
.hero-banner p{color:#34383c}
.hero-banner .eyebrow{color:#ad390f}
.hero-proof{background:rgba(255,255,255,.96);padding:24px;border-radius:12px}
.hero-proof span{color:#45494d}
@media(max-width:600px){.hero-banner{padding:18px}.hero-banner h1,.hero-banner h2{font-size:clamp(32px,9.6vw,42px)}.hero-slides{min-height:580px}.hero-proof{padding:18px}.hero-banner .eyebrow{font-size:11px;letter-spacing:1.4px}}

/* One approved background for all slides; globe removed from this homepage. */
.hero:before,.hero[data-city]:before{background-image:linear-gradient(90deg,rgba(255,255,255,.88),rgba(255,255,255,.65) 60%,rgba(255,255,255,.45)),url('../images/washington-photo.jpg');background-size:100% 100%,cover;background-position:center,center 55%}
.hero:after{display:none}
@media(max-width:600px){.hero:before,.hero[data-city]:before{background-image:linear-gradient(rgba(255,255,255,.90),rgba(255,255,255,.78)),url('../images/washington-photo.jpg');background-position:center,52% center}}
/* Frosted glass keeps the architecture visible behind readable copy. */
.hero-banner{background:rgba(255,255,255,.48);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.65);box-shadow:0 8px 32px rgba(17,19,21,.04)}
.hero-proof{background:rgba(255,255,255,.58);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.65)}
.hero:before,.hero[data-city]:before{background-image:linear-gradient(90deg,rgba(255,255,255,.32),rgba(255,255,255,.15) 60%,rgba(255,255,255,.08)),url('../images/washington-photo.jpg')}
@supports not ((backdrop-filter:blur(8px)) or (-webkit-backdrop-filter:blur(8px))){.hero-banner,.hero-proof{background:rgba(255,255,255,.88)}}


/* User-supplied photographs replace generated artwork. */
.hero[data-city="1"]:before{background-image:linear-gradient(90deg,rgba(255,255,255,.32),rgba(255,255,255,.15) 60%,rgba(255,255,255,.08)),url('../images/brickell-bridge.jpg');background-position:center,center 42%}

.hero[data-city="2"]:before{background-image:linear-gradient(90deg,rgba(255,255,255,.32),rgba(255,255,255,.15) 60%,rgba(255,255,255,.08)),url('../images/exchange-detail-retouched.jpg');background-position:center,center center}