/* ZARYA legacy bridge: harmonises the four companion pages (How It Works, Earnings, Eligibility, Trust & Security) with the shared design system.
   Loaded LAST on those pages. One controlled file instead of per-page patches. Tokens: paper #faf8f4, ink #081424, Inter ZARYA. */
html{background:#faf8f4!important;scroll-padding-top:80px}
body{background:#faf8f4!important;font-family:"Inter ZARYA",Inter,-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Helvetica,Arial,sans-serif!important;color:#081424}
/* shell hardening against legacy tag selectors (header, footer, nav, a, button) */
.zs-header{margin:0!important;padding:0!important;border-radius:0!important;height:auto!important;display:block!important;box-shadow:none!important;width:auto!important;max-width:none!important}
.zs-footer{margin:0!important;padding:0!important;border-radius:0!important;display:block!important;box-shadow:none!important;border-left:0!important;border-right:0!important;border-bottom:0!important;width:auto!important;max-width:none!important}
.zs-header nav,.zs-footer nav{position:static}
.zs-header a,.zs-footer a{text-decoration:none!important}
.zs-header .zs-btn,.zs-mobile .zs-btn{color:#fff!important;background:#081424!important}
main:focus{outline:none}
/* How It Works: legacy rail was positioned for an 82px header; the shared header is 64px */
.integrated-journey{top:64px!important}
.integrated-story{scroll-margin-top:64px!important}
@media(max-width:820px){.integrated-journey{top:64px!important}.integrated-story{scroll-margin-top:64px!important}}
/* Trust: legacy tabs rail */
.zarya-journey-bar{top:64px!important}
/* Earnings disclaimer line above shared footer */
.zs-disclaimer{max-width:1360px;margin:0 auto;padding:28px clamp(20px,4vw,48px) 36px;font-size:13px;color:#5b6a7e;text-align:center}
/* Eligibility: honest send actions (no backend exists) */
.send-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:26px 0 10px}
.send-primary,.send-secondary{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:12px;font-size:15px;font-weight:620;cursor:pointer;font-family:inherit;text-decoration:none}
.send-primary{background:#081424;color:#fff!important;border:1px solid #081424}
.send-secondary{background:#fff;color:#081424!important;border:1px solid #b7bfca}
.send-primary:hover{background:#13253b}.send-secondary:hover{border-color:#081424}
.send-note{font-size:13px;color:#5b6a7e;text-align:center;max-width:34em;margin:8px auto 0}
/* Earnings: floating proof chips must not cover app UI (they previously hid "LIVE MONITORING" and the car) */
@media(min-width:1100px){.z3-proof-top{transform:translateX(46px)}.z3-proof-bottom{transform:translateX(-54px)}}
/* Trust & Security: always use the live-text hero (the flattened desktop art carried baked-in text with full stops and tiny type on tablets) */
.zarya-approved-hero{display:none!important}
.zarya-mobile-fallback{display:flex!important}
@media(min-width:701px) and (max-width:1100px){.hero .hero-copy h1{font-size:clamp(34px,5.2vw,52px)!important}}

/* a11y contrast harmonisation for legacy companion pages (WCAG AA 4.5:1) */
.eyebrow,.stage-number,.zarya-journey-tab .stage-number{color:#855615!important}
.sub,.intro>p,.hero-copy p{color:#566377!important}
.vehicle button small,button[data-id]>small{color:#566377!important}
#counter{color:#855615!important}
aside>div>p{color:#4a5870!important}
.zarya-journey-tab span:nth-child(2){color:#4a5870!important}
.payout-stage .label,.metric .label,.label{color:#566377!important}
.time-kicker{color:#855615!important}
.fine,.time-kicker~*,.stage small{color:#566377}
.fine{color:#566377!important}
#z3-caption,.z3-fine,.z3-story>p,[id^=z3-proof-][id$=-note]{color:#4f5c70!important}
[id^=z3-proof-][id$=-label]{color:#855615!important}
.contact-link{display:inline-flex!important;align-items:center;min-height:44px}
/* touch targets >= 44px */
.textlink,.button-link,.zarya-journey-tab{min-height:44px}
button[data-months],.months button,.period button,.seg button{min-height:44px}
button[data-z3]{min-height:44px}
label .help,.help{color:#566377!important}
.hw-status{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
#howItWorksStory:focus,#closeHeading:focus{outline:none}
#closeHeading:focus-visible{outline:3px solid #855615;outline-offset:6px}

/* Batch 4: editorial intro/close panels (ZRY-HOW-INT-001) and AA text colours */
.integrated-story .intro-panel,.integrated-story .close-panel{background:#fffefb!important;overflow:hidden}
.integrated-story .intro-panel:after,.integrated-story .close-panel:after{content:"";position:absolute;right:-34%;top:50%;width:min(62vw,760px);aspect-ratio:1;transform:translateY(-50%);border-radius:50%;border:1px solid rgba(133,86,21,.30);background:none!important;pointer-events:none;box-shadow:inset 0 0 0 28px rgba(133,86,21,.03)}
.bookend-panel h1 span{color:#855615!important}
.bookend-panel .eyebrow{color:#855615!important}
.bookend-panel p{color:#4f5c70!important}
@media(max-width:820px){.integrated-story .intro-panel:after,.integrated-story .close-panel:after{right:-60%;top:auto;bottom:-30%;transform:none;width:110vw}}

/* ZRY-HOW-UX-002: signal horizontal scroll on the step bar */
@media(max-width:820px){.journey{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 28px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 28px),transparent 100%)}.journey button{min-height:48px}}
.experience-actions .navbtn,.navbtn{min-height:44px!important}
.bookend-panel h1,.bookend-panel h2{text-wrap:balance}
.bookend-panel h1 span,.bookend-panel h2 span{text-wrap:balance}