/* ═══════════════════════════════════════════════════════════════════════════════════
   The index page's Sixt-derived section language, packaged so other pages can use it.
   Every block reads its ground from --sx-bg / --sx-ink / --sx-muted, so the same markup
   works on the white index and on the black rideshare page.
   ═══════════════════════════════════════════════════════════════════════════════════ */
:root{
  --sx-ink:#1A1A1A; --sx-muted:#8D9299; --sx-line:#E4E6EA; --sx-soft:#F5F6F8;
  --sx-sh1:0 2px 6px rgba(0,0,0,.1); --sx-sh2:0 4px 14px rgba(0,0,0,.1);
}
/* Dark ground: opt in with class="sx-dark" on the section. */
.sx-dark{--sx-ink:#fff; --sx-muted:rgba(255,255,255,.6); --sx-line:rgba(255,255,255,.12);
  --sx-soft:#0F1114;}

/* ── Announcement strip ───────────────────────────────────────────────────────── */
.sxbar{position:fixed;top:0;left:0;right:0;z-index:1400;background:var(--red);color:#fff;
  text-align:center;font-size:13px;font-weight:700;padding:9px 16px;line-height:1.4;
  height:var(--sxbar-h,36px);}
@media(max-width:600px){.sxbar{font-size:11.5px;padding:8px 12px;}}

/* ── Red rule + eyebrow ───────────────────────────────────────────────────────── */
.sx-eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:11px;font-weight:800;
  letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:14px;}
.sx-eyebrow:before{content:"";width:20px;height:2px;background:var(--red);border-radius:2px;}

/* ── Value props ──────────────────────────────────────────────────────────────── */
.sxprops{background:var(--sx-bg,#fff);padding:44px 16px;}
.sxprops-hdr{max-width:1180px;margin:0 auto 30px;text-align:center;}
.sxprops-h{font-size:clamp(19px,5.2vw,26px);font-weight:700;line-height:1.3;
  color:var(--sx-ink);max-width:720px;margin:0 auto;}
.sxprops-in{max-width:1180px;margin:0 auto;display:grid;gap:30px;}
.sxprop{text-align:center;}
.sxprop .sxp-i{display:block;color:var(--sx-ink);margin:0 auto 11px;width:max-content;}
.sxprop b{display:block;font-size:13px;font-weight:800;color:var(--sx-ink);margin-bottom:6px;}
.sxprop p{font-size:19px;font-weight:700;line-height:1.28;color:var(--sx-ink);}
@media(min-width:820px){
  .sxprops{padding:60px 24px;}
  .sxprops-hdr{margin-bottom:44px;}
  .sxprops-in{grid-template-columns:repeat(3,1fr);gap:40px;}
}

/* ── Card rail ────────────────────────────────────────────────────────────────── */
.sxm2{background:var(--sx-bg,#fff);padding:44px 0 40px;}
.sxm2-h{font-family:var(--font-body),'Inter',sans-serif;font-size:clamp(30px,8vw,44px);
  font-weight:900;letter-spacing:.03em;text-transform:uppercase;line-height:1;
  color:var(--sx-ink);text-align:center;margin:0 16px 22px;}
.sxm2-rail{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;padding:0 16px 4px;}
.sxm2-rail::-webkit-scrollbar{display:none;}
.sxm2-card{position:relative;flex:0 0 min(86vw,420px);scroll-snap-align:center;
  border-radius:18px;overflow:hidden;background:#111316;min-height:430px;
  display:flex;align-items:center;justify-content:center;}
.sxm2-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5;}
.sxm2-card:after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,11,13,.55),rgba(10,11,13,.82));}
.sxm2-in{position:relative;z-index:2;text-align:center;padding:30px 24px;max-width:340px;}
.sxm2-i{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:50%;
  border:1.5px solid rgba(255,255,255,.55);color:#fff;margin-bottom:16px;}
.sxm2-in h3{font-family:var(--font-body),'Inter',sans-serif;font-size:27px;font-weight:900;
  letter-spacing:.03em;text-transform:uppercase;line-height:1.06;color:#fff;margin-bottom:14px;}
.sxm2-in p{font-size:16px;line-height:1.5;color:rgba(255,255,255,.82);margin-bottom:22px;}
.sxm2-btn{display:inline-block;border:1.5px solid #fff;border-radius:99px;padding:13px 30px;
  font-size:16px;font-weight:700;color:#fff;text-decoration:none;transition:background .18s,color .18s;}
.sxm2-btn:hover{background:#fff;color:#1A1A1A;}
.sxm2-dots{display:flex;justify-content:center;gap:7px;margin-top:20px;}
.sxm2-dots i{width:7px;height:7px;border-radius:50%;background:#D2D6DD;transition:background .2s,width .2s;}
.sx-dark .sxm2-dots i{background:rgba(255,255,255,.28);}
.sxm2-dots i.on{background:var(--red);width:22px;border-radius:99px;}
@media(min-width:1050px){
  .sxm2{padding:70px 0 60px;}
  .sxm2-rail{padding:0 24px 4px;}
  .sxm2-card{flex:0 0 min(46vw,560px);min-height:470px;}
}

/* ── Closing statement + photo + locations ────────────────────────────────────── */
.sxend{background:var(--sx-bg,#fff);padding:46px 16px 56px;}
.sxend-in{max-width:1180px;margin:0 auto;}
.sxend h2{font-family:var(--font-body),'Inter',sans-serif;font-size:clamp(30px,8vw,44px);
  font-weight:900;letter-spacing:.03em;text-transform:uppercase;line-height:1.02;
  color:var(--sx-ink);margin-bottom:16px;}
.sxend > .sxend-in > p{font-size:16px;line-height:1.5;color:var(--sx-ink);max-width:660px;
  margin-bottom:28px;}
.sxend-photo{margin:0 0 28px;border-radius:18px;overflow:hidden;aspect-ratio:16/10;
  background:var(--sx-soft);box-shadow:var(--sx-sh2);}
.sxend-photo img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .5s cubic-bezier(.2,.85,.25,1);}
.sxend-photo:hover img{transform:scale(1.03);}
.sxend-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:26px;}
.sxt{background:var(--sx-soft);border:none;border-radius:99px;padding:12px 20px;
  font-family:inherit;font-size:15px;font-weight:600;color:var(--sx-ink);cursor:pointer;
  transition:background .18s,color .18s;}
.sxt:hover{background:var(--sx-line);}
.sxt.on{background:#111316;color:#fff;}
.sx-dark .sxt.on{background:#fff;color:#111316;}
.sxend-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 22px;}
.sxend-grid a,.sxend-grid span{font-size:16px;font-weight:400;color:var(--sx-ink);
  text-decoration:none;line-height:1.3;position:relative;width:max-content;max-width:100%;
  padding-bottom:2px;}
.sxend-grid a:after{content:"";position:absolute;left:0;bottom:0;height:1.5px;width:0;
  background:var(--red);transition:width .26s cubic-bezier(.2,.85,.25,1);}
.sxend-grid a:hover:after{width:100%;}
.sxend-grid span{color:var(--sx-muted);}
.sxend-grid [hidden]{display:none;}
@media(max-width:560px){.sxend-grid{grid-template-columns:1fr;gap:15px;}}
@media(min-width:900px){
  .sxend{padding:70px 24px 80px;}
  .sxend-in{display:grid;grid-template-columns:1.05fr .95fr;gap:0 48px;align-items:start;}
  .sxend h2,.sxend > .sxend-in > p,.sxend-tabs,.sxend-grid{grid-column:1;}
  .sxend-photo{grid-column:2;grid-row:1 / span 4;margin:0;aspect-ratio:4/5;
    position:sticky;top:96px;}
  .sxend-grid{grid-template-columns:1fr 1fr;gap:20px 24px;}
}

/* ── Room for the fixed announcement strip (pages that link this file) ─────────── */
/* The announcement strip is gone; zero keeps every offset written against it collapsing
   cleanly rather than leaving a band of empty space under the header. */
:root{--sxbar-h:0px;}
body nav{top:var(--sxbar-h)!important;}
body .rs-hero{padding-top:var(--sxbar-h);}

/* ═══ Numbered step cards — one component for "what you need to qualify" and
       "four steps to the road", in the same language as the index's how-it-works. ═══ */
.vsteps{display:grid;gap:11px;max-width:1180px;margin:0 auto;}
.vstep{background:#fff;border:1px solid #E6E8EE;border-radius:18px;padding:20px;
  box-shadow:0 1px 2px rgba(16,24,40,.04);
  transition:box-shadow .2s,transform .2s,border-color .2s;}
.vstep:hover{box-shadow:0 4px 14px rgba(0,0,0,.1);transform:translateY(-2px);border-color:#D9DDE6;}
.vstep-n{font-family:var(--font-body),'Inter',sans-serif;font-size:30px;font-weight:900;
  letter-spacing:.02em;line-height:1;color:rgba(232,0,29,.38);margin-bottom:12px;}
.vstep-n:after{content:".";}
.vstep-t{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700;
  color:#1A1A1A;line-height:1.3;margin-bottom:6px;}
.vstep-i{flex:0 0 auto;display:inline-grid;place-items:center;width:34px;height:34px;
  border-radius:10px;background:rgba(232,0,29,.09);color:var(--red);}
.vstep-i svg{width:19px;height:19px;}
.vstep-d{font-size:14px;font-weight:400;color:#8D9299;line-height:1.55;}
@media(min-width:700px){.vsteps{grid-template-columns:1fr 1fr;gap:14px;}}
@media(min-width:1050px){.vsteps.vsteps-4{grid-template-columns:repeat(4,1fr);}}

/* ── The closing photo, presented as a card rather than a bare image ───────────── */
.sxend-photo{background:#fff;border:1px solid var(--sx-line,#E4E6EA);border-radius:20px;
  padding:10px;aspect-ratio:auto;overflow:visible;box-shadow:0 4px 14px rgba(0,0,0,.1);}
.sxend-photo figure{margin:0;border-radius:14px;overflow:hidden;aspect-ratio:16/11;background:#EDEFF2;}
.sxend-photo img{width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(1.06) contrast(1.04) brightness(1.06);
  transition:transform .5s cubic-bezier(.2,.85,.25,1);}
.sxend-photo:hover img{transform:scale(1.03);}
.sxend-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:14px 6px 6px;}
.sxend-fact{display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center;}
.sxend-fact i{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;
  background:rgba(232,0,29,.09);color:var(--red);}
.sxend-fact i svg{width:18px;height:18px;}
.sxend-fact b{font-size:13px;font-weight:700;color:#1A1A1A;line-height:1.25;}
.sxend-fact span{font-size:12px;font-weight:400;color:#8D9299;line-height:1.3;}
@media(min-width:900px){.sxend-photo figure{aspect-ratio:4/5;}}


/* ═══ Four steps to the road — a connected timeline, deliberately NOT the card grid
       used by "what you need to qualify", so the two sections don't read the same. ═══ */
.vtl{max-width:1120px;margin:0 auto;display:grid;gap:0;}
.vtl-s{position:relative;display:grid;grid-template-columns:auto 1fr;column-gap:18px;
  padding:0 0 30px;}
.vtl-s:last-child{padding-bottom:0;}
.vtl-rail{position:relative;display:flex;flex-direction:column;align-items:center;}
.vtl-dot{position:relative;z-index:2;flex:0 0 auto;display:grid;place-items:center;
  width:50px;height:50px;border-radius:50%;background:#fff;color:var(--red);
  border:1.5px solid rgba(232,0,29,.28);box-shadow:0 2px 8px rgba(232,0,29,.1);}
.vtl-dot svg{width:22px;height:22px;}
.vtl-line{flex:1;width:2px;background:linear-gradient(180deg,rgba(232,0,29,.32),rgba(232,0,29,.08));
  margin-top:6px;border-radius:2px;}
.vtl-s:last-child .vtl-line{display:none;}
.vtl-b{padding-top:4px;}
.vtl-n{font-family:var(--font-body),'Inter',sans-serif;font-size:11px;font-weight:800;
  letter-spacing:.16em;text-transform:uppercase;color:var(--red);margin-bottom:6px;}
.vtl-t{font-size:19px;font-weight:800;color:#1A1A1A;line-height:1.2;margin-bottom:6px;}
.vtl-d{font-size:14.5px;font-weight:400;color:#8D9299;line-height:1.6;max-width:520px;}
@media(min-width:900px){
  .vtl{grid-template-columns:repeat(4,1fr);column-gap:26px;}
  .vtl-s{grid-template-columns:1fr;padding:0;text-align:center;}
  /* Fixed rail height so every step's text starts on the same line. */
  .vtl-s{grid-template-rows:auto 1fr;align-content:start;}
  .vtl-rail{flex-direction:row;justify-content:center;align-items:center;
    height:58px;margin-bottom:18px;}
  .vtl-dot{width:58px;height:58px;}
  .vtl-dot svg{width:25px;height:25px;}
  /* the connector runs between the discs rather than under them */
  .vtl-line{position:absolute;top:29px;left:calc(50% + 34px);right:-26px;width:auto;height:2px;
    margin:0;background:linear-gradient(90deg,rgba(232,0,29,.32),rgba(232,0,29,.08));}
  .vtl-b{padding-top:0;}
  .vtl-d{margin:0 auto;}
}

/* ── The closing photo, given the same treatment as the "what comes with it" cards ── */
.sxend-photo{margin:0 0 28px;padding:0;border:none;background:none;box-shadow:none;}
.sxend-card{position:relative;display:flex;align-items:center;justify-content:center;
  min-height:420px;border-radius:18px;overflow:hidden;background:#111316;
  text-decoration:none;isolation:isolate;}
.sxend-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5;
  transition:transform .6s cubic-bezier(.2,.85,.25,1);}
.sxend-card:hover img{transform:scale(1.04);}
.sxend-card:after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,11,13,.5),rgba(10,11,13,.82));}
.sxend-card-in{position:relative;z-index:2;display:block;text-align:center;
  padding:30px 24px;max-width:340px;}
.sxend-card-i{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:50%;
  border:1.5px solid rgba(255,255,255,.55);color:#fff;margin-bottom:16px;}
.sxend-card-i svg{width:25px;height:25px;}
.sxend-card-t{display:block;font-family:var(--font-body),'Inter',sans-serif;font-size:27px;
  font-weight:900;letter-spacing:.03em;text-transform:uppercase;line-height:1.06;color:#fff;
  margin-bottom:14px;}
.sxend-card-s{display:block;font-size:16px;line-height:1.5;color:rgba(255,255,255,.82);
  margin-bottom:22px;}
.sxend-card-b{display:inline-block;border:1.5px solid #fff;border-radius:99px;padding:13px 30px;
  font-size:16px;font-weight:700;color:#fff;transition:background .18s,color .18s;}
.sxend-card:hover .sxend-card-b{background:#fff;color:#1A1A1A;}
@media(min-width:900px){.sxend-card{min-height:560px;}}

/* -- The closing photo, given the "what comes with it" card treatment -- */
.sxend-photo{margin:0 0 28px;padding:0;border:none;background:none;box-shadow:none;}
.sxend-card{position:relative;display:flex;align-items:center;justify-content:center;
  min-height:420px;border-radius:18px;overflow:hidden;background:#111316;
  text-decoration:none;isolation:isolate;}
.sxend-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5;
  transition:transform .6s cubic-bezier(.2,.85,.25,1);}
.sxend-card:hover img{transform:scale(1.04);}
.sxend-card:after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,11,13,.5),rgba(10,11,13,.82));}
.sxend-card-in{position:relative;z-index:2;display:block;text-align:center;
  padding:30px 24px;max-width:340px;}
.sxend-card-i{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:50%;
  border:1.5px solid rgba(255,255,255,.55);color:#fff;margin-bottom:16px;}
.sxend-card-i svg{width:25px;height:25px;}
.sxend-card-t{display:block;font-family:var(--font-body),'Inter',sans-serif;font-size:27px;
  font-weight:900;letter-spacing:.03em;text-transform:uppercase;line-height:1.06;color:#fff;
  margin-bottom:14px;}
.sxend-card-s{display:block;font-size:16px;line-height:1.5;color:rgba(255,255,255,.82);
  margin-bottom:22px;}
.sxend-card-b{display:inline-block;border:1.5px solid #fff;border-radius:99px;padding:13px 30px;
  font-size:16px;font-weight:700;color:#fff;transition:background .18s,color .18s;}
.sxend-card:hover .sxend-card-b{background:#fff;color:#1A1A1A;}
@media(min-width:900px){.sxend-card{min-height:560px;}}

/* ── Mascot stays inside the eligibility section ───────────────────────────────
   That section no longer carries the qualify cards, so his fixed `top` let him hang
   past its bottom edge into the next band. Bottom-anchored and height-capped, he
   stands exactly where he did before: to the right of the cost breakdown. */
@media(min-width:821px){
  .qual-mascot{top:auto!important;bottom:0!important;max-height:calc(100% - 8px)!important;}
}

/* ── Announcement strip: the tail phrase rotates, like the assistant's prompts ──── */
.sxbar-in{display:inline;}
.sxbar-rot{position:relative;display:inline-block;overflow:hidden;vertical-align:baseline;
  height:1.25em;line-height:1.25em;top:.28em;
  transition:width .42s cubic-bezier(.2,.85,.25,1);white-space:nowrap;}
.sxbar-rot b{position:absolute;left:0;top:0;font-weight:700;white-space:nowrap;
  opacity:0;transform:translateY(105%);
  transition:opacity .34s ease,transform .42s cubic-bezier(.2,.85,.25,1);}
.sxbar-rot b.on{opacity:1;transform:none;}
.sxbar-rot b.out{opacity:0;transform:translateY(-105%);}
@media(prefers-reduced-motion:reduce){
  .sxbar-rot b{transition:none;} .sxbar-rot{transition:none;}
}

/* Short lead-in on phones so the strip stays a single centred line. */
.sxbar-lead-long{display:inline;}
.sxbar-lead-short{display:none;}
@media(max-width:560px){
  .sxbar{font-size:11.5px;padding:8px 10px;}
  .sxbar-lead-long{display:none;}
  .sxbar-lead-short{display:inline;}
}

/* Status bar stays white; the red strip starts below it. */
:root{--sat:env(safe-area-inset-top,0px);}
.sxbar{top:var(--sat);}
body:before{content:"";position:fixed;top:0;left:0;right:0;height:var(--sat);
  background:#fff;z-index:1500;pointer-events:none;}
body nav{top:calc(var(--sat) + var(--sxbar-h))!important;}
body .rs-hero{padding-top:calc(var(--sat) + var(--sxbar-h));}

/* The header shifted as you scrolled because `nav.sc` re-declares its own top/padding.
   Pin all three so the logo stays exactly where it started. */
body nav,body nav.sc{padding-left:48px;padding-right:48px;}
@media(max-width:1024px){
  body nav,body nav.sc{padding-left:20px;padding-right:20px;}
}

/* ── Announcement strip: it belongs to the top of the page, not to the screen ────
   Pinning it meant it sat over the content the whole way down. It now scrolls away
   with the page, and the header takes its place at the top once you pass it. */
body .sxbar{position:absolute!important;top:var(--sat)!important;}
body nav{top:calc(var(--sat) + var(--sxbar-h))!important;}
body nav.sc{top:0!important;}
