/* BroKar: continuous header, guided selection and a distinct request area. */
:root{--wine:#800e21}
.site-header{--header-progress:0;--emblem-offset:210px;background:none;box-shadow:none;transition:none;isolation:isolate}
.site-header::before,.site-header::after{content:'';position:absolute;left:0;right:0;top:0;pointer-events:none;z-index:-1}
.site-header::before{height:250px;background:linear-gradient(180deg,#102b3cde,#102b3c64 60%,#102b3c00);opacity:calc(1 - var(--header-progress))}
.site-header::after{height:100%;background:#193647f7;opacity:var(--header-progress);box-shadow:0 6px 24px #102b3c12}
.header-inner{height:106px;min-height:106px;gap:24px;padding-top:20px;position:relative}
.site-header .brand{position:relative;width:420px;max-width:40vw;height:86px;display:flex;align-items:center;gap:0;flex-shrink:0}
.site-header .brand img{position:absolute;left:0;top:-5px;width:197.5px;height:197.5px;opacity:calc(1 - var(--header-progress));transform:scale(calc(1 - .08 * var(--header-progress)));transform-origin:top left;pointer-events:none}
.site-header svg.brand-name{width:clamp(170px,15vw,220px);height:auto;transform:translateX(calc(var(--emblem-offset) * (1 - var(--header-progress))));overflow:hidden;display:block}
.header-tag{top:139px;left:calc(5vw + 215px);opacity:calc(.75 * (1 - var(--header-progress)));display:block;font-size:8px;pointer-events:none}
.header-contact{position:absolute;right:5vw;top:9px;display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:.02em;color:var(--sand)}
.header-contact span{opacity:.7;font-size:8px}
.header-contact a{padding:3px 0}
.site-nav{gap:26px;align-items:center}
.vehicle-nav{position:relative}
.vehicle-nav-toggle{background:none;color:inherit;font:inherit;font-size:13px;padding:12px 0;min-height:44px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.vehicle-nav-toggle span{font-size:15px;transition:transform 180ms ease}
.vehicle-nav-toggle[aria-expanded=true] span{transform:rotate(180deg)}
.vehicle-picker{position:absolute;top:calc(100% + 14px);right:-130px;width:370px;padding:28px;background:#193647;color:var(--paper);border:1px solid #e9dcc350;border-radius:20px;box-shadow:0 20px 50px #00121b40;z-index:10}
.vehicle-picker[hidden]{display:none}
.vehicle-picker .picker-heading{font-size:20px;line-height:1.3;letter-spacing:-.025em;color:var(--sand);margin-bottom:24px}
.vehicle-picker label{display:block;font-size:11px;margin-top:17px;color:var(--sand)}
.vehicle-picker select{background:#244656;color:var(--paper);font-size:16px;border:1px solid #e9dcc360;border-radius:8px;margin-top:8px;padding:12px 10px;min-height:48px}
.vehicle-picker select:disabled{opacity:.6}
.vehicle-picker option{background:#193647;color:var(--paper)}
.vehicle-picker>p:not(.picker-heading){font-size:11px;color:#d1d7d8;line-height:1.6;margin-top:17px}
.vehicle-picker .button{width:100%;font-size:13px;margin-top:20px;padding:13px 20px}
.hero-copy{padding-top:clamp(235px,26vh,290px)}
.hero-hook{position:absolute;right:6vw;bottom:19%;z-index:4;max-width:620px;font-size:clamp(24px,3.4vw,48px);font-weight:550;line-height:1.08;letter-spacing:-.045em;text-align:right;color:var(--paper);text-shadow:0 2px 22px #001a2a99;pointer-events:none}
.hero-bottom{bottom:9%}
.intro .intro-layout .bodycopy{font-size:20px;line-height:1.8;color:#3d5662;max-width:520px}
.clarity-header .bodycopy{font-size:19px;line-height:1.8;color:#3d5662}
.clarity-item p{font-size:17px;line-height:1.8;color:#3d5662}
.journey{padding-top:55px;padding-bottom:55px}
.journey-heading{max-width:none;margin-bottom:14px}
.journey-instruction{font-size:13px;color:var(--muted);margin-top:20px}
.journey-landscape{height:auto;aspect-ratio:1100/290;max-width:none;width:100%;margin:8px 0 18px}
.journey-landscape svg{display:block;overflow:visible}
.route-base{stroke-width:2;stroke:#d4cbbd}
.route-draw{stroke-width:3;transition:none;opacity:1;stroke-linecap:round}
.route-dot{stroke-width:2;fill:var(--paper)}
.route-dot.is-reached{fill:var(--brass)}
.route-marker>circle{fill:var(--ink);stroke:var(--sand);stroke-width:2}
.route-marker>path{fill:none;stroke:var(--sand);stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}
.journey-tab{min-height:140px}
.journey-tab[aria-selected=true] strong{color:#87642f}
.journey-detail{font-size:18px;line-height:1.75;min-height:120px;max-width:720px}
.journey-next{margin-top:10px;margin-left:auto;display:flex;width:max-content;max-width:100%;font-size:15px}
.questions{padding-top:55px;padding-bottom:90px}
.questions-layout{grid-template-columns:.7fr 1.3fr;gap:7vw}
.questions h2{font-size:clamp(32px,3.3vw,46px);max-width:340px}
.answer{grid-template-columns:1fr;gap:15px;padding:27px 0}
.answer h3{font-size:clamp(21px,2vw,28px);line-height:1.4;letter-spacing:-.025em}
.answer p{font-size:18px;line-height:1.8;color:#455d68;max-width:700px}
.faq-word{white-space:nowrap;display:inline-block}
.faq-letter{display:inline-block;transition:transform 180ms cubic-bezier(.23,1,.32,1),color 180ms ease;transition-delay:0ms}
.contact{padding:45px 0 95px;overflow:visible;scroll-margin-top:120px;background:radial-gradient(ellipse at 50% 50%,#ddd1b633,transparent 70%)}
.contact::before{display:none}
.contact-layout{position:relative;isolation:isolate;background:#fcfbf8;border:1px solid #b0905c90;border-radius:38px;padding:clamp(28px,4.5vw,68px);gap:6vw;box-shadow:0 25px 80px -35px #19364735;grid-template-columns:.95fr 1.05fr}
.contact-layout::before{content:'';position:absolute;inset:12px;z-index:-1;border:1px solid #b0905c1a;border-radius:28px;pointer-events:none}
.contact .eyebrow{color:var(--wine);font-size:11px;letter-spacing:.1em}
.contact .section-title{font-size:clamp(38px,4vw,60px)}
.contact .section-title em{color:var(--wine)}
.contact .bodycopy{font-size:18px;line-height:1.75;color:#455d68;margin-top:25px}
.contact-stamp{display:flex;align-items:center;gap:20px;margin-top:30px;flex-wrap:wrap}
.contact-stamp .brand-image{filter:url(#brand-wine);width:220px;height:220px;flex:none}
.contact-stamp p{font-size:14px;color:#455d68;line-height:1.75}
.contact-stamp strong{color:var(--wine);font-size:23px;font-weight:600}
.contact-stamp a{color:var(--wine);font-size:17px;text-decoration:underline;text-underline-offset:4px}
.contact-stamp small{font-size:10px;line-height:1.4;display:block;max-width:190px}
.contact-form{min-width:0}
.field .label{font-size:13px;line-height:1.5}
.contact-form select,.contact-form input{border:1px solid #b8c0c0;background:#fff;border-radius:10px;padding:13px 12px;font-size:16px;line-height:1.5;min-height:52px}
.contact-form select:disabled{background:#efefea;color:#66777e;opacity:1}
.contact-form select:focus-visible,.contact-form input:focus-visible{outline:3px solid #a58953;outline-offset:3px}
.contact-form input::placeholder{font-size:14px;color:#647781}
.contact-form .field-pair{grid-template-columns:1fr 1fr;gap:18px;min-width:0}
.contact-form .field-pair .field{min-width:0}
.contact-form .field{margin-bottom:22px}
.choice-context{font-size:12px;line-height:1.75;margin-top:-5px;margin-bottom:23px;max-width:none;min-height:0}
.contact-form .button{background:var(--wine);min-height:56px;box-shadow:none;margin-top:5px;font-size:15px}
.form-note{font-size:12px;line-height:1.7}
.request-result{border-color:var(--wine)}
@media(hover:hover) and (pointer:fine){.answer:hover .faq-letter{transform:translateY(-3px);color:var(--wine);transition-delay:calc(var(--letter-index) * 12ms)}.answer:hover .faq-letter:nth-child(even){transform:translateY(-1px)}.contact-form .button:hover{background:#660d1c}.vehicle-nav-toggle:hover{color:#fff4dc}}
@media(max-width:1100px){.site-header{--emblem-offset:173px}.site-header .brand{width:345px}.site-header .brand img{width:162.5px;height:162.5px}.site-header svg.brand-name{width:170px}.site-nav{gap:18px}.vehicle-nav-toggle{font-size:12px}.header-tag{left:calc(5vw + 178px);top:125px}.contact-layout{gap:5vw;padding:38px}.contact-stamp .brand-image{width:190px;height:190px}.contact-form .field-pair{grid-template-columns:1fr;gap:0}}
@media(max-width:900px) and (min-width:701px){.site-header{--emblem-offset:140px}.site-header .brand{width:275px;max-width:34vw}.site-header .brand img{width:131.25px;height:131.25px}.site-header svg.brand-name{width:125px}.site-nav{gap:15px}.header-inner{height:100px;min-height:100px}.header-tag{display:none}.contact-layout{grid-template-columns:1fr;gap:35px;padding:40px}.contact-stamp{flex-wrap:nowrap}.contact-form .field-pair{grid-template-columns:1fr 1fr;gap:18px}.questions-layout{grid-template-columns:1fr;gap:30px}.questions h2{max-width:none}}
@media(max-width:700px){.site-header{--emblem-offset:146px}.header-inner{height:88px;min-height:88px;padding-top:10px;gap:8px}.site-header .brand{width:calc(100% - 52px);max-width:none;height:78px}.site-header .brand img{top:0;width:140px;height:140px}.site-header svg.brand-name{width:130px}.header-tag{display:none}.header-contact{top:4px;right:4.5vw;gap:6px;font-size:9px}.header-contact span{font-size:7px}.site-nav{top:calc(100% + 4px);max-height:calc(100svh - 110px);overflow-y:auto;overscroll-behavior:contain;gap:10px}.vehicle-nav-toggle{font-size:15px;width:100%;justify-content:space-between}.vehicle-picker{position:relative;inset:auto;width:100%;border-radius:12px;padding:20px;margin-top:8px;box-shadow:none;background:#244656}.vehicle-picker .picker-heading{font-size:18px}.vehicle-picker select{background:#193647}.menu-toggle{flex:none}.hero-copy{padding-top:190px}.hero-hook{right:auto;left:6vw;bottom:17%;font-size:29px;max-width:88vw;text-align:left}.hero-bottom{bottom:8%}.intro .intro-layout .bodycopy{font-size:18px;line-height:1.8}.clarity-header .bodycopy{font-size:18px}.clarity-item p{font-size:16px}.journey-instruction{font-size:12px;max-width:270px;line-height:1.6}.journey-landscape{height:auto;aspect-ratio:1100/350;margin:18px 0 25px}.journey-tab{min-height:140px}.journey-detail{font-size:16px;min-height:165px;margin-top:24px}.journey-next{font-size:13px;margin-top:0;margin-left:0}.questions{padding:40px 0 50px}.questions-layout{grid-template-columns:1fr;gap:28px}.questions h2{font-size:34px;max-width:none}.answer{grid-template-columns:1fr;padding:24px 0;gap:13px}.answer h3{font-size:23px}.answer p{font-size:17px;line-height:1.8}.contact{padding:25px 0 55px;scroll-margin-top:100px}.contact-layout{width:92vw;grid-template-columns:1fr;gap:32px;padding:27px 22px;border-radius:27px}.contact-layout::before{inset:8px;border-radius:21px}.contact .section-title{font-size:40px}.contact .eyebrow{font-size:9px}.contact .bodycopy{font-size:17px}.contact-stamp{display:flex;flex-wrap:nowrap;gap:14px;margin-top:23px}.contact-stamp .brand-image{width:140px;height:140px}.contact-stamp strong{font-size:20px}.contact-stamp p{font-size:12px}.contact-stamp a{font-size:15px}.contact-stamp small{font-size:9px}.contact-form .field-pair{grid-template-columns:1fr;gap:0}.contact-form select,.contact-form input{font-size:16px}.form-note{font-size:11px}.field .label{font-size:12px}.hero{min-height:910px}.hero-brand{margin-bottom:20px}}
@media(max-width:350px){.site-header{--emblem-offset:126px}.site-header .brand img{width:120px;height:120px}.site-header svg.brand-name{width:105px}.hero-hook{font-size:26px}.contact-layout{padding:27px 18px}.contact-stamp{gap:9px;align-items:center}.contact-stamp .brand-image{width:115px;height:115px}.contact-stamp a{font-size:13px}.contact .section-title{font-size:36px}}
@media(prefers-reduced-motion:reduce){.faq-letter{transition:none!important;transform:none!important}.hero-hook{opacity:1!important;visibility:visible!important}.site-header .brand img{opacity:0!important;transform:none}.site-header svg.brand-name{transform:none}.site-header::before{opacity:0}.site-header::after{opacity:1}.header-tag{display:none}}
@media(max-width:700px){.route-marker>circle{r:40px}.route-marker>path{transform:scale(1.5);transform-origin:0 0;stroke-width:2}}
@media(prefers-contrast:more){.site-header::after{opacity:1}.hero-hook{text-shadow:0 2px 10px #000}.contact-layout{border-color:var(--ink)}}
