/* The same city dialog opens from the outlined header pill and the inline h1. */
.header-brand{display:flex;align-items:center;gap:22px;min-width:0;flex-shrink:1}
.header-brand>.wordmark{flex-shrink:0}
.city-picker{display:inline-flex;align-items:center;max-width:100%;min-width:0;pointer-events:auto;flex-shrink:1}
.city-pill{display:flex;align-items:center;justify-content:space-between;gap:14px;width:148px;min-height:38px;max-width:100%;padding:8px 15px;border:1px solid #ffffff45;border-radius:30px;background:#ffffff03;color:var(--paper);font:inherit;font-size:12px;line-height:1.5;letter-spacing:0;text-align:left;cursor:pointer;transition:border-color .2s,background .2s}
.city-pill [data-city-current]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.city-pill:hover,.city-pill[aria-expanded=true]{border-color:var(--coral);background:#ff63350a}
.city-chevron{width:10px;height:7px;flex-shrink:0;fill:none;stroke:var(--coral);stroke-width:1.5;pointer-events:none;transition:transform .2s}
[aria-expanded=true]>.city-chevron{transform:rotate(180deg)}
.city-inline{display:inline-flex;align-items:baseline;gap:.14em;padding:0 0 .02em;border:0;border-bottom:1px solid currentColor;background:none;color:inherit;font:inherit;letter-spacing:inherit;text-transform:inherit;line-height:inherit;vertical-align:baseline;white-space:nowrap;cursor:pointer;pointer-events:auto;text-align:left;transition:opacity .2s}
.city-inline>.city-chevron{width:.22em;height:.15em;min-width:8px;min-height:6px;align-self:center;stroke:currentColor;stroke-width:1.25}
.city-inline:hover{opacity:.75}
.city-inline:disabled,.city-pill:disabled{opacity:1}
.city-inline:focus-visible,.city-pill:focus-visible{outline:2px solid var(--coral);outline-offset:5px}
.models-hero .model-hero-copy>h1.hero-eyebrow{margin-top:0;font-size:12px;font-weight:600;line-height:1.6;letter-spacing:1.8px;text-transform:uppercase}
.models-hero .hero-eyebrow .line{flex-shrink:0}
.models-hero-title{font-family:inherit}
/* Allow the title's city line to grow without pushing the CTA into the footer. */
@media(min-width:761px){.hero:has(.city-inline){height:auto;max-height:none}}
.header{gap:22px}
.city-dialog-open{overflow:hidden}
.city-menu{position:fixed;box-sizing:border-box;width:min(520px,calc(100% - 32px));max-height:calc(100svh - 32px);margin:auto;padding:30px;border:1px solid #ffffff30;border-radius:24px;background:radial-gradient(ellipse at 100% 0%,#ff633517,transparent 65%),linear-gradient(145deg,#252525,#111 75%);color:#f4f2ef;box-shadow:0 24px 100px #0009,0 0 0 1px #0008;overflow:auto;overscroll-behavior:contain;text-align:left;animation:city-arrive .22s ease-out}
.city-menu::backdrop{background:#060808b8;backdrop-filter:blur(9px);animation:city-shade .22s ease-out}
.city-menu-top{display:flex;align-items:center;gap:10px;color:#aaa;font-size:10px;font-weight:500;letter-spacing:1.8px}
.city-menu-mark{width:25px;height:25px;color:var(--coral);fill:currentColor;flex-shrink:0}
.city-menu-close{display:flex;align-items:center;justify-content:center;width:40px;height:40px;margin:-10px -10px -10px auto;border:1px solid #ffffff24;border-radius:50%;background:transparent;color:#bbb;font:300 26px/1 Arial,sans-serif;cursor:pointer;transition:color .2s,border-color .2s}
.city-menu-close:hover{color:var(--coral);border-color:var(--coral)}
.city-menu#city-menu>h2{font-size:34px;font-weight:500;line-height:1.15;letter-spacing:-1.1px;margin:28px 0 26px;color:#f4f2ef}
.city-options{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
.city-option{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:58px;padding:13px 16px;border:1px solid #ffffff16;border-radius:12px;background:#ffffff03;color:#d5d3d0;font:inherit;font-size:14px;line-height:1.4;letter-spacing:0;text-align:left;text-decoration:none;cursor:pointer;transition:background .18s,border-color .18s,color .18s}
.city-option--wide,.city-option:last-child{grid-column:1/-1}
.city-option--wide{margin-bottom:8px}
.city-option:hover{background:#ffffff08;border-color:#ffffff45;color:#fff}
.city-option[aria-current=true]{background:linear-gradient(105deg,#ff633519,#ff633505);border-color:#ff63357a;color:var(--coral)}
.city-option:focus-visible,.city-menu-close:focus-visible{outline:2px solid var(--coral);outline-offset:2px}
.city-check{width:18px;height:18px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.5;opacity:0}
.city-option[aria-current=true]>.city-check{opacity:1}
@keyframes city-arrive{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
@keyframes city-shade{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.city-menu,.city-menu::backdrop{animation:none}.city-menu *,.city-inline,.city-pill,.city-chevron{transition:none}}
@media(min-width:1281px){.header .desktop-nav{gap:clamp(14px,1.5vw,24px)}.header .header-cta{gap:16px}}
@media(max-width:1280px) and (min-width:761px){
 .header .desktop-nav,.header .header-cta{display:none}
 .header .menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:6px;border:1px solid #ffffff50;background:transparent;width:44px;height:44px;border-radius:50%;padding:12px;z-index:40;flex-shrink:0}
 .menu-toggle span{width:18px;height:1px;background:var(--paper);transition:transform .25s}
 .menu-open .menu-toggle span:first-child{transform:translateY(3.5px) rotate(45deg)}
 .menu-open .menu-toggle span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
 .mobile-menu{display:flex;position:fixed;inset:0;background:var(--ink);z-index:29;padding:150px var(--pad) 40px;flex-direction:column;justify-content:space-between;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
 .mobile-menu nav{display:flex;flex-direction:column;gap:24px}
 .mobile-menu a{font-size:32px;letter-spacing:-1px}
 .mobile-menu>span{font-size:10px;letter-spacing:2px;color:var(--muted)}
 .menu-open .mobile-menu{opacity:1;visibility:visible}
 .menu-open .header{position:fixed;background:var(--ink)}
}
@media(max-width:760px){
 .header{gap:12px}
 .header-brand{gap:16px}
 .header .city-pill{width:clamp(88px,22vw,148px);min-height:36px;padding:7px 11px;font-size:11px;gap:8px}
 .header .city-chevron{width:8px;height:6px}
 .header .menu-toggle{flex-shrink:0}
 .models-hero .model-hero-copy>h1.hero-eyebrow{font-size:9px;letter-spacing:1px}
}
@media(max-width:420px){
 .header{gap:10px}
 .header-brand{gap:10px}
 .header-brand>.wordmark{font-size:20px;gap:8px}
 .header-brand .brand-glyph{width:24px;height:30px}
 .city-menu{padding:24px 20px;border-radius:20px}
 .city-menu#city-menu>h2{font-size:29px;margin:26px 0 22px}
 .city-option{padding:12px;min-height:56px;font-size:13px}
 .city-menu-top{font-size:9px;letter-spacing:1.3px}
}
@media(max-width:360px){
 .header{gap:8px}
 .header-brand{gap:8px}
 .header-brand>.wordmark{font-size:18px;gap:7px}
 .header-brand .brand-glyph{width:22px;height:28px}
 .header .city-pill{width:82px;padding-inline:9px;font-size:10px}
 .city-option{padding:11px 9px;font-size:12px;gap:4px}
}