/* One ARCANE WARRIOR identity across the public site. */
.brand-site{--rail:96px}
.brand-site>main,.brand-site>.site-footer{margin-left:var(--rail);width:calc(100% - var(--rail))}
.brand-site .site-header.brand-header{padding-left:calc(var(--rail) + var(--gutter))}
.field-rail{position:fixed;inset:0 auto 0 0;z-index:35;isolation:isolate;width:var(--rail);display:flex;flex-direction:column;justify-content:center;padding-block:16px;background:var(--accent);color:#171817;border-right:1px solid #1718171a;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#17181766 transparent}
.field-rail::before{content:'';position:absolute;inset:0 14px;z-index:-1;background:url("../brand/offroad-tread.2240c783830f.svg") center top/100% auto repeat-y;opacity:.12;pointer-events:none}
.field-rail a{display:flex;align-items:center;justify-content:center;flex:none;min-height:76px;padding:8px 4px;font-family:'Nunito',Arial,sans-serif;text-align:center;text-decoration:none}
.field-rail__label{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:68px;padding:5px 2px;background:var(--accent)}
.field-rail a strong{display:grid;place-items:center;width:34px;height:30px;font:700 15px/1 'Montserrat',Arial,sans-serif;font-variant-numeric:tabular-nums}
.field-rail__label>span{font-size:11px;line-height:1.3;font-weight:700}
.field-rail a[aria-current] strong{background:#171817;color:var(--accent)}
.field-rail a:hover strong{background:#17181718}
.field-rail a[aria-current]:hover strong{background:#171817}
.field-rail a:hover .field-rail__label>span{text-decoration:underline;text-underline-offset:3px}
.field-rail a:focus-visible{outline:2px solid #171817;outline-offset:-5px}
.brand-site #vehicle{scroll-margin-top:112px}
@media(max-height:520px) and (min-width:901px){.field-rail{justify-content:flex-start}.field-rail a{min-height:68px}}
@media(max-width:1100px){.brand-site{--rail:80px}}
@media(max-width:900px){.brand-site{--rail:0px}.field-rail{display:none}}
html:has(.brand-header){scroll-padding-top:100px}
.site-header.brand-header{min-height:88px;padding:16px var(--gutter);gap:32px;background:#171817;border-bottom:1px solid #ffffff29}
.brand-lockup{flex:none;display:block}
.brand-header .brand-logo{width:168px;height:auto}
.brand-header .desktop-nav{align-items:center;gap:28px;font:700 14px/1.3 'Nunito',Arial,sans-serif}
.brand-header .desktop-nav a{min-height:44px;display:flex;align-items:center;padding:8px 0}
.brand-header .nav-vehicle{color:var(--accent)}
.brand-header .header-cta{font:700 14px/1.3 'Nunito',Arial,sans-serif;margin-left:0;gap:16px}
.brand-lockup:focus-visible,.brand-header :is(a,button):focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.brand-header~.mobile-menu{background:#171817;padding:16px var(--gutter) 40px;color:#f1f1ed}
.brand-header~.mobile-menu a{font:700 20px/1.3 'Montserrat',Arial,sans-serif;letter-spacing:-.025em;min-height:58px;padding:16px 0;border-bottom:1px solid #ffffff29}
.brand-header~.mobile-menu .nav-vehicle{display:flex;justify-content:space-between;color:var(--accent)}
.brand-header~.site-footer{padding-block:48px 24px;border-top:1px solid #ffffff29;background:#171817}
.footer-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:8px 32px;font-size:15px}
.footer-nav a{padding-block:8px;line-height:1.45}
.footer-nav a:hover{color:var(--accent)}
@media(max-width:1050px){.brand-header .header-cta{display:none}.brand-header .desktop-nav{gap:20px}}
@media(max-width:760px){
 .site-header.brand-header{min-height:80px;padding:12px var(--gutter);gap:16px}
 .brand-header .brand-logo{width:148px}
 .brand-header .menu-toggle{align-items:center;justify-content:center;width:52px;height:52px;min-height:52px;flex:none;padding:12px;background:var(--accent);color:#171817;cursor:pointer}
 .menu-bars{display:flex;flex-direction:column;gap:5px;width:28px}
 .menu-bars>span{display:block;width:28px;height:4px;background:currentColor;transition:transform .15s,opacity .15s}
 .menu-toggle[aria-expanded="true"] .menu-bars>span:first-child{transform:translateY(9px) rotate(45deg)}
 .menu-toggle[aria-expanded="true"] .menu-bars>span:nth-child(2){opacity:0}
 .menu-toggle[aria-expanded="true"] .menu-bars>span:last-child{transform:translateY(-9px) rotate(-45deg)}
 html:not(.js) .brand-header{flex-wrap:wrap}
 html:not(.js) .brand-header .desktop-nav{flex-basis:100%;margin-left:0;flex-wrap:wrap;justify-content:space-between;gap:8px 16px}
 .footer-nav{grid-template-columns:minmax(0,1fr);gap:4px}
}
@media(prefers-reduced-motion:reduce){.menu-bars>span{transition:none}}

/* The selected city and the published dealer phone remain visible in the header. */
.header-contacts{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:2px;min-width:190px;color:#f1f1ed}
.header-city{display:flex;align-items:center;gap:8px;margin:0;max-width:100%}
.header-city select{max-width:200px;min-height:32px;padding:4px 24px 4px 0;border:0;border-radius:0;background-color:#171817;color:#d1d1c8;font:700 13px/1.4 'Nunito',Arial,sans-serif;cursor:pointer}
.header-phone{display:block;white-space:nowrap;color:var(--accent);font:800 19px/1.5 'Nunito',Arial,sans-serif;font-variant-numeric:tabular-nums;text-decoration:none}
.header-phone:hover{text-decoration:underline;text-underline-offset:4px}
.header-city-submit{padding:6px;border:1px solid var(--accent);background:transparent;color:var(--accent);font:700 12px/1.4 'Nunito',Arial,sans-serif;cursor:pointer}
.brand-header select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(min-width:761px) and (max-width:1200px){
 .site-header.brand-header{gap:20px}
 .brand-header .desktop-nav{gap:16px;font-size:13px}
 .brand-header .brand-logo{width:148px}
 .header-contacts{min-width:176px}
 .header-phone{font-size:18px}
}
@media(max-width:760px){
 .site-header.brand-header{display:grid;grid-template-columns:minmax(88px,108px) minmax(0,1fr) 44px;gap:12px;min-height:68px;padding-block:10px}
 .brand-header .brand-logo{width:100%;max-width:108px}
 .brand-header .menu-toggle{grid-column:3;grid-row:1;margin:0;width:44px;height:44px;min-height:44px;padding:10px}
 .menu-bars,.menu-bars>span{width:24px}
 .brand-header .header-contacts{grid-column:2;grid-row:1;min-width:0;gap:0}
 .header-city{min-width:0;max-width:100%}
 .header-city select{min-width:0;width:100%;max-width:180px;min-height:32px;font-size:12px;padding-right:16px;text-overflow:ellipsis}
 .js .brand-header .header-city{display:none}
 .header-phone{display:flex;align-items:center;min-height:44px;font-size:15px;font-weight:700}
 .menu-contacts{align-items:stretch;min-width:0;gap:8px;padding-bottom:16px;margin-bottom:8px;border-bottom:1px solid #ffffff29}
 .menu-contacts .header-city{flex-direction:column;align-items:stretch;gap:6px}
 .menu-contacts label{font:600 12px/1.4 'Nunito',Arial,sans-serif;color:#d1d1c8}
 .menu-contacts select{max-width:none;min-height:44px;padding:8px 32px 8px 12px;border:1px solid #ffffff55;font-size:16px}
 .brand-header~.mobile-menu .header-phone{min-height:44px;padding:4px 0;border:0;font:700 20px/1.4 'Nunito',Arial,sans-serif;letter-spacing:0}
 html:has(.brand-header){scroll-padding-top:88px}
 html:not(.js) .brand-header .desktop-nav{grid-column:1/-1;grid-row:2}
 html:not(.js) .brand-header .header-contacts{grid-column:2/-1}
}
@media(max-width:360px){
 .site-header.brand-header{grid-template-columns:88px minmax(0,1fr) 44px;gap:8px;padding-inline:12px}
 .brand-site .site-header.brand-header{padding-inline:12px}
 .brand-header .menu-toggle{width:44px;height:44px;min-height:44px;padding:8px}
 .header-phone{font-size:14px}
}
