:root{--navy:#101a2b;--navy2:#16243a;--ink:#152136;--muted:#788394;--amber:#ffc35a;--cream:#f8f7f3;--line:#e7e8eb;--green:#50d3a0}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',sans-serif}.topbar{height:78px;padding:0 max(calc((100% - 1160px)/2),6%);display:flex;align-items:center;justify-content:space-between;background:var(--navy);color:white}.brand{display:flex;align-items:center;gap:9px;color:white;text-decoration:none;font:800 19px Manrope,sans-serif;letter-spacing:-.7px}.brand-mark{display:grid;place-items:center;width:29px;height:29px;background:var(--amber);color:var(--navy);border-radius:9px;font-size:20px}.dot{color:var(--amber)}nav{display:flex;gap:34px;margin-left:auto;margin-right:35px}nav a{color:#b4becc;text-decoration:none;font-size:13px}nav a:hover{color:white}.install-button{border:1px solid #39455a;color:white;background:transparent;border-radius:8px;padding:10px 14px;font:600 12px 'DM Sans';cursor:pointer}.hero{position:relative;background:var(--navy);color:white;padding:75px max(calc((100% - 1160px)/2),6%) 60px;min-height:667px;display:grid;grid-template-columns:1fr 1fr;gap:55px;overflow:hidden}.hero:before{content:'';position:absolute;width:580px;height:580px;right:-200px;top:-310px;border:1px solid #25354d;border-radius:50%;box-shadow:0 0 0 52px #16243a,0 0 0 53px #25354d,0 0 0 105px #16243a,0 0 0 106px #25354d;opacity:.5}.hero-copy{z-index:1;padding-top:15px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:#aab6c6}.live-dot,.state-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);margin-right:8px;box-shadow:0 0 9px #50d3a0}.hero h1{font:700 clamp(46px,5.3vw,68px)/1.06 Manrope,sans-serif;letter-spacing:-3px;margin:25px 0 17px}.hero h1 span,.section-heading h2 span,.banner h2 span{color:var(--amber)}.hero-lead{font-size:15px;line-height:1.75;color:#b5bfcd;max-width:430px}.hero-points{display:flex;gap:20px;color:#d8dee6;font-size:11px;margin:26px 0 28px}.primary-link{display:inline-flex;gap:34px;align-items:center;background:var(--amber);border-radius:8px;padding:15px 20px;color:#172135;text-decoration:none;font-weight:700;font-size:13px}.primary-link span{font-size:17px}.trust-note{margin-top:31px;display:flex;align-items:center;gap:11px;color:#98a5b6;font-size:11px}.avatar-stack{display:flex;padding-left:3px}.avatar-stack i{font-style:normal;width:23px;height:23px;border:2px solid var(--navy);border-radius:50%;display:grid;place-items:center;margin-left:-4px;background:#e4a17d;color:#372a26;font-size:9px}.avatar-stack i:nth-child(2){background:#9eb7aa}.avatar-stack i:nth-child(3){background:#d7bf82}.meter-wrap{position:relative;z-index:2;padding:0 12px 20px}.meter-card{position:relative;background:#fff;border-radius:16px;padding:23px 26px 18px;color:var(--ink);box-shadow:0 20px 65px #060d1970;max-width:425px;margin:0 auto}.card-top{display:flex;justify-content:space-between;align-items:flex-start}.card-kicker{font-size:9px;font-weight:700;letter-spacing:1.5px;color:#7f8b9b}.trip-state{font-size:11px;color:#657185;margin-top:8px}.state-dot{width:6px;height:6px;background:#bdc6d1;box-shadow:none}.state-dot.running{background:#18b982;box-shadow:0 0 7px #18b982}.settings-trigger{border:0;background:#f4f5f7;color:#536174;width:31px;height:31px;border-radius:8px;font-size:17px;cursor:pointer}.fare-label{display:flex;justify-content:space-between;margin-top:22px;font-size:9px;letter-spacing:1.3px;font-weight:700;color:#8993a1}.fare-label span{font-weight:600;letter-spacing:0}.fare-value{font:700 48px Manrope,sans-serif;letter-spacing:-2.8px;margin:3px 0 0}.fare-hint{font-size:10px;color:#8a94a2}.metrics{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:18px 0 0;padding:14px 0}.metric{display:flex;align-items:center;gap:10px}.metric+.metric{border-left:1px solid var(--line);padding-left:18px}.metric-icon{width:31px;height:31px;background:#fff5e4;color:#d9951f;display:grid;place-items:center;border-radius:9px;font-size:19px}.metric-value{font:700 17px Manrope;display:block;letter-spacing:-.5px}.metric-value small{font:500 10px 'DM Sans';color:#768193}.metric-label{display:block;font-size:8px;letter-spacing:1px;color:#9099a7;margin-top:3px}.fare-breakdown{padding:11px 0 5px}.fare-breakdown>div{display:flex;justify-content:space-between;align-items:center;padding:5px 0;font-size:10px;color:#697587}.fare-breakdown b{font-size:10px;color:#233149}.fare-breakdown small{font-size:9px;color:#a0a8b3;margin-left:4px}.distance-entry{border-top:1px dashed #e6e8ec;padding-top:10px;margin-top:4px}.distance-entry label{font-size:9px;font-weight:700;color:#5e6b7e}.input-row{display:flex;gap:7px;margin-top:6px}.input-row input,.settings-grid input{min-width:0;border:1px solid #e2e6eb;border-radius:7px;padding:9px 10px;font:12px 'DM Sans';outline:none}.input-row input:focus,.settings-grid input:focus{border-color:#e7a936;box-shadow:0 0 0 3px #ffc35a30}.input-row input{flex:1}.input-row button{border:0;border-radius:7px;background:#edf2f6;color:#25354c;font:700 10px 'DM Sans';padding:0 13px;cursor:pointer}.input-help{font-size:8px;color:#98a1ae;margin-top:5px}.meter-actions{display:flex;gap:8px;margin-top:12px}.meter-actions button{height:38px;border:0;border-radius:7px;cursor:pointer;font:700 11px 'DM Sans'}.meter-actions button:disabled{opacity:.42;cursor:not-allowed}.start-button{flex:1;background:var(--navy);color:white}.start-button span{color:var(--amber);margin-right:5px}.pause-button{width:40px;background:#edf1f5;color:#394960;font-size:14px!important}.end-button{width:60px;background:#fff1ee;color:#bc574b}.meter-footer{display:flex;justify-content:space-between;margin-top:12px;font-size:8px;color:#969eaa}.meter-footer span:first-child{color:#569879}.floating-note{position:absolute;right:-10px;bottom:-2px;display:flex;gap:10px;align-items:center;background:#fff;border-radius:10px;padding:12px 15px;color:var(--ink);box-shadow:0 7px 30px #0308124f}.floating-note>span{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:#fff4de;color:#d49527}.floating-note b,.floating-note small{display:block}.floating-note b{font-size:10px}.floating-note small{font-size:9px;color:#8b95a3;margin-top:3px}.hero-bottom{position:absolute;bottom:20px;left:max(calc((100% - 1160px)/2),6%);right:max(calc((100% - 1160px)/2),6%);border-top:1px solid #28374b;padding-top:13px;display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.3px;color:#8492a5}.journey{padding:83px max(calc((100% - 1060px)/2),7%) 88px}.section-heading{text-align:center}.section-heading .eyebrow{color:#b18132}.section-heading h2{font:700 34px Manrope;letter-spacing:-1.5px;margin:14px 0 7px}.section-heading h2 span{color:#c38822}.section-heading p{color:#7e8999;font-size:13px}.journey-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:41px}.journey-step{position:relative;background:white;border:1px solid #ececef;border-radius:12px;padding:18px;box-shadow:0 7px 22px #18274408}.step-number{font:700 10px Manrope;color:#c28a2b;letter-spacing:1px}.step-visual{height:110px;margin:13px 0 14px;border-radius:9px;background:#f8f7f3;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.pin-visual>span{font-size:36px;color:#dda333;position:absolute;top:20px;z-index:2}.pin-visual b{position:absolute;bottom:17px;font-size:8px;letter-spacing:1px;color:#84909e}.route-line{position:absolute;width:130px;height:40px;border-top:2px dashed #d5b066;border-radius:50%;transform:rotate(-17deg);top:55px}.meter-visual{gap:11px}.meter-visual>span,.receipt-visual>span{width:36px;height:36px;background:#fff0d2;border-radius:10px;color:#c58e2d;display:grid;place-items:center;font:700 20px Manrope}.meter-visual b,.receipt-visual b{font:700 18px Manrope;display:block}.meter-visual small,.receipt-visual small{font-size:8px;letter-spacing:.5px;color:#8893a1}.receipt-visual>span{background:#e2f7ef;color:#36a77e}.journey-step h3{font:700 14px Manrope;margin:0 0 7px}.journey-step p{font-size:11px;color:#7f8a98;line-height:1.65;margin:0}.banner{margin:0 auto 68px;max-width:1060px;min-height:280px;border-radius:16px;background:#18263a;color:white;padding:42px 55px;position:relative;overflow:hidden;display:flex;justify-content:space-between}.banner .eyebrow{color:#bac4d0}.banner h2{font:700 34px/1.16 Manrope;letter-spacing:-1px;margin:15px 0 8px}.banner p{font-size:12px;color:#aeb8c5}.banner a{display:inline-flex;gap:23px;margin-top:12px;padding:11px 14px;background:var(--amber);color:#18263a;border-radius:7px;text-decoration:none;font-weight:700;font-size:11px}.banner-art{position:absolute;right:20px;top:0;width:48%;height:100%;overflow:hidden}.sun{position:absolute;width:135px;height:135px;border-radius:50%;background:#e0a947;opacity:.9;right:130px;top:23px}.road{position:absolute;width:130%;height:80px;background:#293b51;transform:rotate(-14deg);bottom:23px;left:-10%}.road-two{height:3px;background:repeating-linear-gradient(90deg,#eac36d 0 28px,transparent 28px 48px);bottom:61px;opacity:.8}.car{position:absolute;width:100px;height:38px;background:#f7b943;border-radius:28px 31px 13px 13px;right:111px;bottom:67px;transform:rotate(-14deg);box-shadow:inset 0 -7px #de9c2f}.car:before{content:'';position:absolute;width:42px;height:17px;border-radius:18px 18px 0 0;background:#d8e1e8;top:-12px;left:29px}.car:after{content:'●       ●';position:absolute;bottom:-8px;left:13px;font-size:15px;color:#111a26;letter-spacing:38px}.car span{position:absolute;z-index:1;left:47px;top:5px;color:#152136;font:bold 11px Manrope}.sign{position:absolute;right:15px;top:45px;color:#d9e3ef;font-size:10px;letter-spacing:2px;border-left:2px solid #d9e3ef;padding:8px}.sign b{color:var(--amber);font-size:15px}footer{max-width:1060px;margin:0 auto;padding:0 0 28px;display:flex;justify-content:space-between;align-items:center;color:#8a94a1;font-size:10px}footer .brand{color:var(--ink);font-size:15px}footer .brand-mark{width:24px;height:24px;border-radius:7px;font-size:16px}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,15px);background:#152136;color:white;padding:11px 17px;border-radius:8px;font-size:12px;opacity:0;pointer-events:none;transition:.25s;z-index:10}.toast.show{opacity:1;transform:translate(-50%,0)}.settings-panel{position:absolute;z-index:4;inset:0;background:white;border-radius:16px;padding:23px 26px;box-shadow:0 3px 25px #18274420}.settings-head{display:flex;justify-content:space-between;align-items:center;font:700 16px Manrope}.settings-head button{border:0;background:#f1f3f5;border-radius:7px;width:27px;height:27px;font-size:19px;cursor:pointer}.settings-panel p{font-size:11px;color:#7f8a98}.settings-grid{display:grid;gap:11px;margin:20px 0}.settings-grid label{font-size:10px;color:#5f6c7e;font-weight:600;display:grid;gap:5px}.settings-grid input{width:100%}.save-rates{width:100%;border:0;border-radius:7px;background:var(--navy);color:white;font:700 11px 'DM Sans';padding:11px;cursor:pointer}
@media(max-width:800px){.topbar{padding:0 5%;height:66px}nav{gap:18px;margin-right:18px}nav a{font-size:11px}.hero{padding:55px 6% 65px;grid-template-columns:1fr;gap:37px}.hero-copy{text-align:center}.hero-lead{margin:0 auto}.hero-points{justify-content:center}.trust-note{justify-content:center}.meter-wrap{width:min(100%,470px);margin:auto}.hero-bottom{left:6%;right:6%}.journey{padding:65px 6%}.banner{margin:0 6% 55px}.banner-art{opacity:.75}.banner{padding-left:35px}footer{margin:0 6%;gap:10px}}@media(max-width:560px){nav{display:none}.install-button{margin-left:auto}.hero{padding-top:42px}.hero h1{font-size:51px}.hero-lead{font-size:13px}.hero-points{font-size:9px;gap:11px}.meter-card{padding:20px 18px 16px}.fare-value{font-size:43px}.floating-note{right:-2px}.journey-grid{grid-template-columns:1fr;gap:12px}.journey-step{display:grid;grid-template-columns:48px 1fr;column-gap:10px;padding:14px}.step-number{grid-row:1 / span 3;padding-top:5px}.step-visual{grid-column:2;height:83px;margin:0 0 10px}.journey-step h3,.journey-step p{grid-column:2}.section-heading h2{font-size:28px}.banner{min-height:300px;margin-left:5%;margin-right:5%;padding:31px 25px;align-items:flex-start}.banner-art{right:-66px;width:70%;opacity:.42}.banner>div:first-child{position:relative;z-index:2}.banner h2{font-size:30px}.banner p{max-width:190px;line-height:1.5}footer{flex-wrap:wrap}footer>span:last-child{width:100%}}
/* Persistent PWA install call to action */
.install-button{border:0;background:var(--amber);color:var(--navy);font-weight:700}
#gpsStatus{color:#758396;font-weight:500}