@font-face{font-family:'Catamaran';font-style:normal;font-weight:700 800;font-display:swap;src:url(/fonts/Catamaran.woff2) format('woff2')}
@font-face{font-family:'Open Sans';font-style:normal;font-weight:400 600;font-display:swap;src:url(/fonts/OpenSans.woff2) format('woff2')}
:root{/* palette "C, Teal transit" (2026-10-22): the ONE place to change landing colours */--navy:#0F2D36;--deep:#0A1F26;--card:#163C47;--primary:#5FE0A8;--mint:#8FE3C7;--blue:#6FA8FF;--text:#EAF6F5;--glow:#1A4855;--border:rgba(111,168,255,.35);--focus:rgba(95,224,168,.25);--muted:#A7C7C5;--muted2:#8FB3B6;--lede:#CFE5E3;--err:var(--err);--on-primary:#0A1F26}
*{box-sizing:border-box}
html{background:var(--navy)}
body{margin:0;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;color:var(--text);font:16px/1.5 'Open Sans',system-ui,sans-serif;
  background:radial-gradient(120% 60% at 50% 0%,var(--glow) 0%,var(--navy) 55%,var(--deep) 100%);-webkit-font-smoothing:antialiased}
h1,h2,.brand{font-family:'Catamaran',system-ui,sans-serif;line-height:1.1;margin:0}
h1{font-size:clamp(30px,8vw,44px);font-weight:800;margin-bottom:10px}
h2{font-size:22px;font-weight:700;color:var(--primary);margin-bottom:12px}
.top{display:flex;align-items:center;gap:10px;padding:18px 20px 0;max-width:520px;width:100%;margin:0 auto}
.top img{border-radius:9px}
.brand{font-size:24px;font-weight:800}
.pill{font-size:12px;font-weight:600;color:var(--on-primary);background:var(--mint);border-radius:99px;padding:2px 9px;text-transform:uppercase;letter-spacing:.06em}
main{flex:1;width:100%;max-width:520px;margin:0 auto;padding:28px 20px 20px;position:relative}
.view{transition:opacity .45s ease,transform .45s ease}
.view.out{opacity:0;transform:translateY(-8px)}
.view.pre{opacity:0;transform:translateY(10px)}
.lede{color:var(--lede);margin:0 0 22px}
.combo{position:relative}
input{width:100%;font:inherit;font-size:18px;color:var(--text);background:var(--card);border:2px solid var(--blue);border-radius:14px;padding:15px 16px;outline:none}
input::placeholder{color:var(--muted2)}
input:focus{border-color:var(--primary);box-shadow:0 0 0 4px var(--focus)}
#sugg{list-style:none;margin:6px 0 0;padding:6px;position:absolute;left:0;right:0;z-index:5;background:var(--card);border:1px solid var(--blue);border-radius:14px;max-height:300px;overflow:auto;box-shadow:0 12px 30px rgba(0,0,0,.4)}
#sugg li{padding:11px 12px;border-radius:10px;cursor:pointer}
#sugg li[aria-selected=true],#sugg li:hover{background:var(--card);box-shadow:inset 0 0 0 2px var(--primary)}
#sugg li.alt{color:var(--mint)}
.btn{display:block;width:100%;text-align:center;font:700 18px/1 'Catamaran',system-ui,sans-serif;letter-spacing:.01em;text-decoration:none;border:0;border-radius:14px;padding:17px 18px;margin-top:14px;cursor:pointer;transition:transform .1s,filter .15s}
.btn:active{transform:scale(.98)}
.btn:hover{filter:brightness(1.06)}
.btn.big{font-size:21px;padding:20px}
.lime,.primary{background:var(--primary);color:var(--on-primary)}
.mint{background:var(--primary);color:var(--on-primary)}
.btn[disabled]{opacity:.6;cursor:wait}
.link{background:none;border:0;color:var(--primary);font:inherit;font-size:15px;padding:12px 0 0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.link.inline{padding:0;font-size:inherit}
.err{color:var(--err);margin:10px 0 0}
.privacy{font-size:13px;color:var(--muted);margin-top:18px}
.card{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:20px;margin-bottom:16px}
.card .btn{margin-top:4px}
.small{font-size:13px;color:var(--muted);margin:10px 0 0}
.center{text-align:center}
.steps{list-style:none;margin:0 0 16px;padding:0}
.steps li{display:flex;gap:12px;align-items:flex-start;margin-bottom:12px}
.steps span{flex:none;width:28px;height:28px;border-radius:50%;background:var(--blue);color:var(--on-primary);font:800 15px/28px 'Catamaran',sans-serif;text-align:center}
.steps a{color:var(--primary)}
.qr{display:block;margin:16px auto 0;border-radius:14px;width:180px;height:180px;image-rendering:pixelated}
.cards{display:flex;flex-direction:column}
.ios-first #ios{order:-1}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
footer{font-size:12px;color:var(--muted2);text-align:center;padding:16px 20px 24px}
@media (prefers-reduced-motion:reduce){.view{transition:none}}
