.app-showcase{overflow:hidden;background:#edf3ee;padding:94px 0 80px;position:relative}.app-showcase-grid{display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:45px}.app-showcase-copy{position:relative;z-index:2}.app-showcase h1,.app-showcase h2{font-size:clamp(42px,4.7vw,66px);line-height:1.03;letter-spacing:-.055em;margin:18px 0 25px}.app-showcase h1 span,.app-showcase h2 span{color:#138354}.app-showcase-lead{max-width:470px;font-size:18px;color:#53655c;line-height:1.75}.app-platforms{display:flex;gap:10px;flex-wrap:wrap;margin-top:27px}.app-platforms>span{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;border:1px solid #cbd9d0;border-radius:99px;padding:9px 12px}.app-platforms .lucide{width:17px;height:17px}.app-release-note{font-size:12px;color:#66766e;margin-top:12px}.app-showcase-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:29px}.app-text-link{font-weight:700;font-size:13px;border-bottom:1px solid #a3baac;padding:10px 0}.app-device-stage{position:relative;display:flex;justify-content:center;align-items:center;min-height:650px;isolation:isolate;padding-bottom:45px}.app-phone{width:270px;flex-shrink:0;padding:7px;background:linear-gradient(135deg,#67746f,#101815 35%,#56625e 75%,#111815);border-radius:44px;box-shadow:0 30px 45px -18px #13382977,0 0 0 1px #7a8680;position:relative;z-index:1;transform:rotate(-6deg)}.app-device-pair .app-phone+.app-phone{margin-left:-55px;margin-top:85px;transform:rotate(7deg);z-index:2}.app-screen{border:2px solid #080e0d;overflow:hidden;border-radius:37px;background:#031216;color:white;position:relative;height:575px}.phone-status{display:flex;align-items:center;justify-content:space-between;padding:15px 19px 8px;font-size:10px;font-weight:700;height:38px;position:relative;z-index:3}.phone-island{position:absolute;left:50%;transform:translateX(-50%);top:9px;width:78px;height:21px;border-radius:20px;background:#000}.phone-cover{padding:8px 17px 20px;background:linear-gradient(#031a16aa,#031216),url('assets/transporter-hero-v2.png') center/cover}.phone-logo{display:block;font-size:49px;font-weight:800;line-height:1;color:#00b58d;text-align:center}.phone-cover p{font-size:8px;letter-spacing:2px;color:#6ee4ba;font-weight:800;margin:13px 0 9px}.phone-cover h3{font-size:31px;letter-spacing:-1.5px;line-height:1.05}.phone-cover em{font-style:normal;color:#6be5ba}.phone-content{padding:13px}.phone-label{font-size:8px;letter-spacing:1.5px;color:#6fe9bd;font-weight:800;display:flex;justify-content:space-between;align-items:center}.phone-label>span{font-size:22px;background:#28ca99;color:#031216;border-radius:8px;padding:0 8px}.phone-content h4{font-size:17px;letter-spacing:-.6px;margin:6px 0 14px;line-height:1.3}.phone-card{border:1px solid #263a40;border-radius:18px;background:#0c2026;padding:14px 12px}.phone-card-top{font-size:8px;display:flex;justify-content:space-between;gap:5px}.phone-card b,.phone-label b{font-size:6px;color:#6ee4ba;background:#113d35;border-radius:8px;padding:3px 5px;letter-spacing:.5px}.phone-card h4{font-size:14px;margin:15px 0 5px}.phone-card h4 span{color:#62e6b6}.phone-card p,.phone-car{font-size:9px;color:#b4c6cf}.phone-progress{background:#25433d;height:4px;border-radius:8px;margin:13px 0}.phone-progress span{display:block;width:65%;height:100%;background:#32cd9e}.phone-card-bottom{display:flex;justify-content:space-between;font-size:8px;color:#bdd0cf}.phone-card-bottom span{color:#51deb0}.phone-row{display:flex;align-items:center;gap:10px;padding:10px 4px;font-size:11px;color:#69dcb7}.phone-row span{font-size:9px;color:white;flex:1}.phone-row small{display:block;color:#a8bfc4;font-size:8px}.phone-action{display:flex;justify-content:space-between;background:#2bc99a;border-radius:11px;padding:11px 13px;font-size:10px;font-weight:800;color:#031216;margin-top:9px}.phone-nav{position:absolute;bottom:17px;left:7px;right:7px;display:flex;justify-content:space-around;background:#121c2c;border:1px solid #33404d;border-radius:17px;padding:5px}.phone-nav span{display:flex;flex-direction:column;align-items:center;gap:3px;color:#9aa7bc;font-size:8px;padding:6px 10px;border-radius:12px}.phone-nav .lucide{width:18px;height:18px}.phone-nav .selected{background:#2bca9b;color:#031216}.phone-home-indicator{height:3px;width:80px;background:#c0c9c8;position:absolute;bottom:5px;left:50%;transform:translateX(-50%);border-radius:4px}.phone-map{height:222px;position:relative;margin-top:-38px;background:#dce7dd}.phone-map svg{width:100%;height:100%;object-fit:cover}.phone-map-chip{position:absolute;top:47px;left:27px;background:#14212b;border-radius:20px;padding:8px 15px;font-size:9px;font-weight:700}.phone-map-chip b{color:#23c398}.driver-phone-content{border-radius:24px 24px 0 0;background:#031216;margin-top:-18px;position:relative;padding-top:22px}.driver-phone-content>h4{margin:14px 0 6px;font-size:23px}.phone-stops{margin-top:16px;padding:14px 20px}.phone-stops small{font-size:8px;letter-spacing:2px;color:#69e2b8}.phone-stops h4{margin:3px 0}.phone-stop-line{height:18px;border-left:2px solid #2dc699;margin:7px 0}.app-demo-caption{position:absolute;bottom:0;left:0;right:0;text-align:center;font-size:10px;color:#61776a}.app-orbit{position:absolute;border:1px solid #a4c9af88;border-radius:50%;width:590px;height:590px;z-index:-1}.app-orbit-two{width:460px;height:460px;background:radial-gradient(#bee4cd88,transparent 70%)}.app-device-single .app-phone{width:290px;transform:rotate(4deg)}.app-feature-notes{margin-top:35px;border-top:1px solid #ccdbd0;padding-top:16px}.app-feature-notes p{font-size:13px;margin:10px 0;color:#4b6255}.app-feature-notes b{color:#168658;margin-right:12px}.app-page-header{background:#03100f;color:white;padding:24px 0}.app-page-header .shell{display:flex;justify-content:space-between;align-items:center;gap:20px}.app-page-brand{font-weight:800;font-size:22px;letter-spacing:-1px}.app-page-brand span{color:#49e3ae}.app-page-header nav{display:flex;gap:25px;font-size:13px}.app-page-footer{padding:35px 0;background:#03100f;color:#b9cdc1;font-size:13px}.app-page-footer .shell{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.app-showcase .app-phone{animation:app-arrive .85s ease-out both}.app-device-pair .app-phone+.app-phone{animation-delay:.15s}@keyframes app-arrive{from{opacity:0;translate:0 28px}to{opacity:1;translate:0 0}}@media(max-width:1050px){.app-showcase-grid{gap:20px;grid-template-columns:1fr 1fr}.app-device-pair{transform:scale(.86);margin-inline:-35px}.app-showcase h2{font-size:46px}}@media(max-width:760px){.app-showcase{padding:60px 0 45px}.app-showcase-grid{grid-template-columns:1fr;gap:20px}.app-showcase-copy{max-width:540px}.app-showcase h1,.app-showcase h2{font-size:46px}.app-showcase-lead{font-size:16px}.app-device-stage{min-height:660px}.app-device-pair{transform:scale(.9);margin-top:-15px;margin-bottom:-30px}.app-device-single{min-height:640px}.app-page-header nav{gap:13px;font-size:11px}.app-page-header .shell{width:calc(100% - 36px)}}@media(max-width:420px){.app-device-pair{transform:scale(.72);margin-inline:-60px;margin-top:-65px;margin-bottom:-95px}.app-showcase h1,.app-showcase h2{font-size:40px}.app-page-brand{font-size:19px}}@media(prefers-reduced-motion:reduce){.app-showcase .app-phone{animation:none}}
.app-showcase .app-screen { height: 640px; }
.app-showcase .app-device-stage { min-height: 735px; }
@media (max-width: 420px) {
  .app-showcase .app-device-pair { margin-top: -90px; margin-bottom: -100px; }
}
.app-screen .phone-row + .phone-row { display: none; }
.app-screen .phone-stops { padding-block: 10px; }
.app-screen .phone-stops p { display: none; }
.app-screen .phone-stops .phone-stop-line { height: 12px; }
.phone-cover .phone-logo {
  width: 56px;
  height: 49px;
  margin-inline: auto;
}
.phone-map-toolbar {
  position: absolute;
  top: 47px;
  inset-inline: 9px;
  display: grid;
  grid-template-columns: 29px minmax(0, 1fr) 29px;
  align-items: center;
  gap: 6px;
}
.phone-map-toolbar .phone-map-chip {
  position: static;
  padding: 9px 4px;
  font-size: 8px;
  text-align: center;
  white-space: nowrap;
}
.phone-map-control {
  display: grid;
  place-items: center;
  width: 29px;
  height: 29px;
  border: 1px solid white;
  border-radius: 50%;
  background: #f7faf7ed;
  color: #00aa80;
}
.phone-map-control:last-child { color: #008365; }
.phone-map-control svg { width: 14px; height: 14px; }
.app-phone-real {
  padding: 7px;
  background: linear-gradient(115deg, #c0c5c3, #444b48 8%, #101413 35%, #717976 80%, #272d2a);
  box-shadow: inset 0 0 0 1px #d1d8d388, inset 0 0 0 3px #272d2a, 12px 28px 40px -15px #16372c66;
}
.app-showcase .app-phone-real .app-screen {
  height: auto;
  aspect-ratio: 851 / 1849;
  border: 3px solid #050807;
  background: #031216;
  border-radius: 36px;
}
.real-app-screenshot { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.device-island {
  position: absolute;
  top: 9px;
  left: 50%;
  transform: translateX(-50%);
  width: 28%;
  height: 16px;
  border-radius: 20px;
  background: #020303;
  box-shadow: inset 0 1px 2px #40474366;
}
.device-island::after {
  content: '';
  position: absolute;
  right: 7px;
  top: 5px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #20364c, #070b11 65%);
}
.device-home { position: absolute; bottom: 5px; left: 33%; width: 34%; height: 3px; border-radius: 5px; background: #edf2f0; }
.device-volume, .device-power { position: absolute; width: 3px; background: linear-gradient(90deg,#3e4542,#a2aba6,#2b312e); border-radius: 2px; }
.device-volume { left: -2px; top: 110px; height: 40px; box-shadow: 0 48px 0 #616a65; }
.device-power { right: -2px; top: 145px; height: 58px; }
.app-page-brand { display: inline-flex; align-items: center; gap: 11px; white-space: nowrap; }
.app-page-brand img { width: 34px; height: 22px; flex: none; }
.app-showcase-grid > * { min-width: 0; }
.link-arrow { display: inline-block; width: 1.1em; height: 1.1em; vertical-align: -0.15em; flex: none; }
.has-dealer-tour { padding-block: 45px; }
.dealer-tour { display:flex; flex-direction:column; align-items:center; min-width:0; }
.tour-intro { text-align:center; font-size:13px; font-weight:700; margin:0 0 16px; }
.tour-intro span { display:block; color:#61776a; font-size:11px; font-weight:400; margin-top:5px; }
.app-showcase .tour-phone { width:280px; transform:none; border-radius:35px; padding:6px; touch-action:pan-y; }
.app-showcase .tour-phone .app-screen { aspect-ratio:auto; height:570px; border-radius:29px; display:flex; flex-direction:column; }
.tour-brand { display:flex; align-items:center; gap:7px; padding:19px 15px 13px; font-size:14px; font-weight:800; background:linear-gradient(120deg,#103e34,#031216); }
.tour-brand span { margin-left:auto; font-size:8px; letter-spacing:1px; color:#6ee4ba; }
.tour-screenshot .tour-brand,.tour-screenshot .tour-bottom,.tour-screenshot .device-home { display:none; }
.tour-run-image { width:100%; height:100%; object-fit:contain; display:block; min-height:0; }
.tour-screenshot .tour-screen-content { height:100%; }
/* Every slide is loaded up front and stacked, so changing steps only swaps
 * which one is visible and the phone never flashes blank. */
.tour-slides { position:relative; height:100%; background:#f3f5f4; }
.tour-slides .tour-run-image { position:absolute; inset:0; opacity:0; transition:opacity .18s ease; }
.tour-slides .tour-run-image.is-active { opacity:1; }
@media (prefers-reduced-motion: reduce) { .tour-slides .tour-run-image { transition:none; } }
.tour-screen-content { flex:1; min-height:0; display:flex; flex-direction:column; }
.demo-heading { padding:12px 14px; border-bottom:1px solid #29403f; }
.app-showcase .demo-heading h2 { font-size:21px; letter-spacing:-.7px; margin:0 0 4px; }
.demo-heading p { font-size:10px; color:#aebfc7; margin:0; }
.demo-progress { display:flex; gap:5px; margin-top:10px; }
.demo-progress i { flex:1; height:4px; border-radius:4px; background:#233436; }
.demo-progress .done { background:#2acb99; }
.demo-body { padding:10px 12px; display:flex; flex-direction:column; gap:7px; flex:1; min-height:0; }
.demo-body h3 { font-size:19px; line-height:1.13; letter-spacing:-.5px; margin:0; }
.demo-body p { font-size:10px; line-height:1.45; color:#b7c8cf; margin:0; }
.demo-field { padding:8px; border:1px solid #293e43; background:#10242a; border-radius:12px; }
.demo-field small,.demo-summary small,.demo-label { display:block; color:#78dfbc; font-size:9px; font-weight:700; margin-bottom:5px; }
.demo-field strong,.demo-summary strong { display:block; font-size:12px; line-height:1.35; }
.demo-field span { font-size:9px; color:#78dfbc; }
.demo-field p { margin-top:3px; }
.demo-selected { background:#10372f!important; border-color:#41d6a8!important; color:#80e8c4; }
.demo-pair { display:flex; justify-content:space-between; font-size:10px; color:#bdcfd1; }
.demo-pair b { color:#78dfbc; }
.demo-options { display:flex; gap:6px; }
.demo-options>span { flex:1; padding:13px 4px; border:1px solid #293e43; border-radius:12px; text-align:center; background:#10242a; font-size:10px; }
.demo-label { margin-top:9px; margin-bottom:0; }
.demo-transport small { display:block; font-size:9px; line-height:1.4; margin-top:8px; color:#b7c8cf; }
.demo-summary { border:1px solid #293e43; border-radius:12px; background:#10242a; }
.demo-summary>div { padding:8px 10px; }
.demo-summary>div+div { border-top:1px solid #293e43; }
.demo-summary small { margin-bottom:3px; }
.demo-summary p { font-size:9px; }
.demo-action { margin-top:auto; background:#f8fbfa; color:#07141b; padding:10px; border-radius:12px; display:flex; align-items:center; justify-content:center; gap:10px; font-weight:800; font-size:12px; }
.demo-action svg { width:14px; height:14px; }
.tour-bottom { display:flex; align-items:center; justify-content:space-around; font-size:9px; color:#a4b5c3; background:#142032; padding:8px 5px 13px; }
.tour-bottom b { background:#2acb99; color:#031216; border-radius:8px; padding:7px 17px; }
.tour-controls { display:flex; align-items:center; gap:18px; margin:17px 0 10px; }
.tour-controls button { cursor:pointer; border:1px solid #b8cec0; background:transparent; color:#174c39; display:grid; place-items:center; width:40px; height:40px; border-radius:50%; }
.tour-controls button:disabled { opacity:.3; cursor:default; }
.tour-controls button:focus-visible,.tour-phone:focus-visible { outline:3px solid #168658; outline-offset:4px; }
.tour-dots { display:flex; gap:2px; }
.tour-dots button { width:24px; height:34px; border:0; }
.tour-dots button::after { content:''; width:6px; height:6px; border-radius:50%; background:#acbeb3; }
.tour-dots button[aria-current="step"]::after { background:#11764e; width:9px; height:9px; }
.tour-caption { max-width:340px; text-align:center; min-height:99px; }
.tour-caption small { color:#138354; font-size:10px; font-weight:800; letter-spacing:2px; }
.tour-caption h3 { font-size:20px; margin:6px 0; letter-spacing:-.5px; }
.tour-caption p { font-size:13px; color:#53655c; line-height:1.5; margin:0; }
.tour-disclosure { text-align:center; font-size:10px; line-height:1.5; color:#61776a; margin:9px 0 0; }
@media(max-width:760px) {
  .has-dealer-tour { padding-block:35px; }
  .has-dealer-tour .app-showcase-grid { gap:30px; }
  .has-dealer-tour .app-feature-notes { display:none; }
  .has-dealer-tour .app-showcase h1 { font-size:38px; }
  .tour-caption { max-width:300px; }
}
@media (max-width: 760px) {
  .app-device-pair { transform: scale(.78); }
}
@media (max-width: 480px) {
  .app-device-pair { transform: scale(.62); }
}
@media (max-width: 360px) {
  .app-device-pair { transform: scale(.5); }
  .app-page-header .shell { flex-wrap: wrap; gap: 16px; }
  .app-device-single .app-phone { width: 260px; }
}