:root{color-scheme:light;--ink:#061724;--gold:#e6b653;--cream:#f6f2eb}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:20px}
body{margin:0;background:var(--ink);color:var(--cream);font-family:Arial,Helvetica,sans-serif}
h1,h2,p,li,a,button{overflow-wrap:anywhere}
a{color:inherit}button{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid #e6b653;outline-offset:5px}
.skip{position:fixed;left:20px;top:-100px;background:white;color:var(--ink);padding:16px;z-index:10}.skip:focus{top:12px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.header{position:absolute;inset:0 0 auto;z-index:3;background:linear-gradient(180deg,#03121dc9,transparent)}
.header-inner{min-height:92px;padding:2px 5%;display:flex;align-items:center;gap:24px;margin:auto}
.header-logo{display:block;flex:0 0 176px;width:176px;margin-right:auto;line-height:0}
.header-logo img{display:block;width:100%;height:auto;mask-image:linear-gradient(90deg,transparent,#000 2%,#000 98%,transparent)}
nav{display:flex;gap:32px;align-items:center;font-size:15px;font-weight:600}
nav a{text-decoration:none;min-height:44px;display:flex;align-items:center;padding:12px 0;border-bottom:1px solid transparent}
nav a:hover{border-color:#d6b673}.header nav{color:#fff;text-shadow:0 1px 5px #0008}
.header .register-link{border:1px solid #d6b67399;background:#07172440;padding:10px 18px;border-radius:3px}
.nav-toggle{display:none}
/* One viewport or the content's natural height, whichever is larger. */
.hero{position:relative;isolation:isolate;display:flex;align-items:center;min-height:100vh;min-height:100svh;min-height:100dvh;padding:140px 5% 70px;background:#061520}
.hero-visual{position:absolute;left:0;top:50%;transform:translateY(-50%);width:100%;aspect-ratio:1672/941;z-index:-1}
.hero-visual>img{display:block;width:100%;height:auto}
@media(min-width:901px){.hero{min-height:max(100vh,56.2799vw);min-height:max(100dvh,56.2799vw)}}
.hero-content{position:relative;width:32%;max-width:510px;color:#fff;text-shadow:0 2px 8px #000b}
.hero-content::before{content:"";position:absolute;inset:-24px -30px;z-index:-1;background:radial-gradient(ellipse,#03121dcc,transparent 72%);pointer-events:none}
.hero-content h1{font-size:clamp(34px,4.1vw,70px);line-height:1.05;letter-spacing:-.035em;margin:0 0 24px;font-weight:700;max-width:7.5em}
.hero-content p{font-size:clamp(16px,1.5vw,25px);line-height:1.6;margin:0 0 28px}
.hero-gold-initial{color:#ffdc79;background:linear-gradient(155deg,#fff3bb 8%,#e6ad36 35%,#fff2a5 53%,#c98b23 78%,#ffe6a0);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 0 2px #ffe99ac0) drop-shadow(0 0 7px #f5b637a0) drop-shadow(0 0 16px #d9953155)}
.hero-actions{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.hero-actions a{display:flex;align-items:center;justify-content:center;min-height:48px;width:100%;max-width:370px;padding:14px 18px;font-size:clamp(14px,1.1vw,18px);font-weight:700;line-height:1.25;text-decoration:none;text-align:center;border-radius:3px;text-shadow:none}
.hero-cta{background:#f3f0e9;color:#081826}.hero-login{background:#07131df0;color:#fff;border:1px solid #40505a}
.hero-actions a:hover,.dealer-actions a:hover{filter:brightness(1.08);box-shadow:0 0 16px #ebc36340}
.hero-motion-toggle{display:block;min-height:44px;max-width:100%;padding:8px 0;margin-top:12px;border:0;background:transparent;color:#d5dee2;font-size:13px;text-decoration:underline;text-underline-offset:4px;cursor:pointer;text-shadow:0 1px 4px #000}
.hero-motion-toggle[hidden]{display:none}
/* The SVG and photograph share exactly the same image coordinate system. */
.hero-motion{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;visibility:hidden;fill:none}
.motion-enabled .hero-motion{visibility:visible}.motion-paused .hero-motion{visibility:hidden}
.hero-motion>*{opacity:0;animation-play-state:paused}
.motion-enabled .panel-pulse{stroke:#ffe4a2;stroke-width:3;fill:#ffd47e;animation:panel-activate 8s ease-in-out infinite}
.motion-enabled .flow-halo,.motion-enabled .flow-pulse{stroke:#ffdc8c;stroke-linecap:round;stroke-dasharray:.065 .935;stroke-dashoffset:1;animation:opening-flow 8s linear infinite}
.flow-halo{stroke-width:12}.flow-pulse{stroke-width:3}
.motion-enabled .door-response{stroke:#ffdaa0;stroke-width:7;animation:door-respond 8s ease-in-out infinite}
.motion-paused .hero-motion>*{animation-play-state:paused}
@keyframes panel-activate{0%,16%,100%{opacity:0;fill-opacity:0}7%{opacity:.75;fill-opacity:.12}}
@keyframes opening-flow{0%,11%{opacity:0;stroke-dashoffset:1}15%{opacity:.8}43%{opacity:.8;stroke-dashoffset:0}49%,100%{opacity:0;stroke-dashoffset:0}}
@keyframes door-respond{0%,40%,70%,100%{opacity:0}52%{opacity:.55}}
.flow-halo{stroke-opacity:.16}
/* Original desktop banners and their functional button overlays are preserved. */
.section-image{display:block;width:100%;height:auto}.buyer{display:flow-root;overflow:clip;background:var(--cream)}
.buyer-art{display:flow-root;overflow:clip;width:100%}
.buyer-art>.section-image{margin-top:calc(-3.6045% - 3px);width:100%}.dealer{background:var(--ink)}.dealer-art{position:relative}
.dealer-actions a{position:absolute;display:flex;align-items:center;justify-content:center;text-decoration:none;text-align:center;font-weight:700;line-height:1.2;border-radius:3px;min-height:44px}
.profile-cta{left:25.72%;top:82.26%;width:26.6%;height:9.14%;background:linear-gradient(110deg,#f9cf78,#ffe0a0);border:1px solid #ffdf9d;color:#071927;font-size:clamp(12px,1.25vw,25px);box-shadow:0 6px 22px #f5bd4440}
.reseller-cta{left:53.55%;top:82.26%;width:20.73%;height:9.14%;border:1px solid #84909a;background:#061420;color:#fff;font-size:clamp(12px,1.2vw,24px)}
.mobile-copy,.mobile-section-art{display:none}
.eyebrow{font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:#e8bd69;margin:0 0 16px}
.mobile-actions{display:flex;flex-direction:column;gap:12px;margin-top:24px;max-width:620px}
.button{min-height:48px;display:flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;border-radius:4px;padding:12px 18px;font-size:16px;font-weight:600}
.button-gold{background:#f9d18a;color:#081826}.button-outline{border:1px solid #69757e;color:#fff}
.footer{background:var(--cream);color:var(--ink);padding:30px 6%;display:flex;align-items:center;justify-content:space-between;gap:22px}
.footer img{width:150px;height:auto;display:block}.footer-nav{gap:24px;flex-wrap:wrap}.footer a{font-size:14px;text-underline-offset:5px}
/* No-JS stays bright; scrolling toggles only the dim state, never layout. */
.buyer,.dealer{min-height:100vh;min-height:100svh;min-height:100dvh;scroll-margin-top:-20px;transition:filter .55s ease-out}
.section-dimmed{filter:brightness(.58)}
.section-instant{transition:none}
@media(min-width:1101px){.buyer,.dealer{display:flex;flex-direction:column;justify-content:center}.dealer-art{width:100%}}
@media(min-width:1800px){.footer{max-width:1800px;margin:auto}}
@media(max-width:1100px){
 .buyer-art>.section-image,.dealer-art>.section-image,.dealer-actions{display:none}
 .mobile-section-art{display:block;width:100%;height:auto;margin:0}
 .buyer>.mobile-section-art{margin:0;padding-top:26px}
 .dealer>.mobile-section-art{padding-top:30px}
 .mobile-copy{display:block;padding:26px max(22px,5%) 38px}
 .mobile-copy h2{font-size:clamp(25px,3.5vw,34px);line-height:1.2;margin:0 0 16px}
 .mobile-copy p,.mobile-copy ol{font-size:16px;line-height:1.65}.mobile-copy ol{padding-left:24px}.mobile-copy li+li{margin-top:12px}
 .buyer .mobile-copy{color:var(--ink)}
 .header-logo{width:144px;flex-basis:144px}.header nav{gap:20px;font-size:14px}
 .hero-content{width:38%}.hero-content h1{font-size:clamp(34px,4.1vw,45px)}
}
@media(max-width:900px){
 .hero{display:flex;flex-direction:column;align-items:stretch;padding:0 0 max(20px,env(safe-area-inset-bottom));}
 .hero-visual{position:relative;left:auto;top:auto;transform:none;flex:none;z-index:0}
 .hero-content{width:auto;max-width:620px;padding:clamp(22px,4svh,40px) 5% 0;margin:0 auto;flex:1;display:flex;flex-direction:column;justify-content:flex-start;text-shadow:none}
 .hero-content::before{display:none}.hero-content h1{font-size:36px;max-width:none;margin:0 0 16px}.hero-content p{font-size:17px;line-height:1.5;margin:0 0 20px}
 .hero-actions a{max-width:none;font-size:16px}.hero-motion-toggle{align-self:flex-start;margin-top:8px}
 .header-inner{min-height:72px;padding:10px max(5%,env(safe-area-inset-right)) 10px max(5%,env(safe-area-inset-left));flex-wrap:wrap;gap:8px 16px}
 .header-logo{width:112px;flex-basis:112px}.nav-toggle:not([hidden]){display:flex;align-items:center;gap:9px;min-height:44px;border:1px solid #d6b67355;border-radius:4px;background:#071724ad;color:#fff;padding:10px 13px;font-size:14px}
 .header-inner nav{width:100%;flex-basis:100%;justify-content:flex-start;gap:8px;padding:12px;background:#071724f5;border:1px solid #d6b67355;border-radius:5px;text-shadow:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .header-inner:has(.nav-toggle:not([hidden])) nav{display:none}.header-inner:has(.nav-toggle:not([hidden])) nav.is-open{display:grid}
 .header nav a{padding:10px;font-size:14px}.header:has(.nav-toggle[hidden]){position:relative}
 .hero-motion .flow-halo{stroke-width:8}.hero-motion .door-response{stroke-width:5}
 .footer{flex-wrap:wrap;padding:24px 5%}.footer-nav{width:100%;gap:14px}
}
@media(max-width:680px){
 .header-inner{min-height:64px;padding-top:8px;padding-bottom:8px}.header-logo{width:96px;flex-basis:96px}
 .hero-content{width:100%;padding:18px 5% 0}.hero-content h1{font-size:34px;line-height:1.08;margin-bottom:14px}
 .hero-content p{font-size:16px;line-height:1.5;margin-bottom:18px}.hero-actions{gap:10px}.hero-actions a{padding:12px 14px;font-size:15px}
 .footer img{width:130px}.mobile-copy{padding-top:24px}.mobile-copy h2{font-size:28px}
}
/* Taller phones can frame the panel-to-door connection more closely. The original
   bitmap remains untouched; image and SVG use the same 560..1672 source crop. */
@media(max-width:680px) and (min-height:740px){
 .hero-visual{aspect-ratio:1112/941;overflow:clip}
 .hero-visual>img{position:relative;width:150.359713%;max-width:none;left:-50.359713%}
 .hero-motion{width:150.359713%;max-width:none;left:-50.359713%}
 .hero-content{padding-top:28px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-motion{display:none}.hero-motion>*{animation:none!important}.buyer,.dealer{transition:none;filter:none}}

/* Mobile navigation occupies its own row and stays available while reading. */
@media(max-width:900px){
 html{scroll-padding-top:88px}
 .header,.header:has(.nav-toggle[hidden]){position:sticky;inset:auto;top:0;z-index:5;background:#061520;border-bottom:1px solid #e6b65326}
 .header-inner{position:relative}
 .header-inner nav{max-height:calc(100svh - 88px);overflow-y:auto}
 .header-inner:has(.nav-toggle:not([hidden])) nav{position:absolute;top:100%;left:5%;width:90%;margin-top:8px}
 .hero{min-height:0;padding-bottom:max(32px,env(safe-area-inset-bottom))}
 .hero-content{flex:none}
 .buyer,.dealer{min-height:0;scroll-margin-top:0}
 .mobile-copy{padding-bottom:32px}
 .mobile-copy p{margin:0 0 20px}
 .mobile-copy ol{margin:0}
 .buyer>.mobile-section-art,.dealer>.mobile-section-art{padding-top:22px}
}