/* A clear, Lark-inspired type scale. Inter is an openly available substitute. */
:root {
  --ink: #17333a;
  --muted: #425b60;
}

html { font-size: 16px; }
body {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4,
.brand-mark, .footer-brand,
.hero h1, .intro h2, .section-top h2, .arrival-lead h2,
.closing-inner h2, .result-head h3, .route-card h4,
.arrival-card h3, .update-feature h3, .update-list h3,
.essential h3, .dialog-inner h2 {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

.hero h1 em, h2 em, .intro h2 span {
  font-family: inherit;
  font-style: normal;
  font-weight: inherit;
  letter-spacing: inherit;
}
.hero h1 em { color: #d6ede5; }
.intro h2 span, .section-top h2 em { color: #377477; }
.arrival-lead h2 em, .closing-inner h2 em { color: #bfe5d9; }

.brand-name { font-size: 13px; letter-spacing: 1px; }
.desktop-nav { font-size: 15px; }
.nav-action { font-size: 14px; }
.mobile-nav a { font-size: 16px; }
.eyebrow { font-size: 14px; letter-spacing: 1.2px; }
.hero h1 { font-size: clamp(48px, 6.2vw, 80px); line-height: 1.09; letter-spacing: -.05em; }
.hero-copy { max-width: 550px; font-size: 18px; line-height: 1.65; }
.button, .hero-link { font-size: 15px; }
.hero-bottom { font-size: 14px; letter-spacing: .7px; }
.strip-inner > div:nth-child(2) { font-size: 15px; }
.strip-inner a { font-size: 14px; }
.intro h2, .section-top h2, .arrival-lead h2 { letter-spacing: -.045em; }
.intro > p { font-size: 17px; color: var(--muted); }
.section-top > p { font-size: 16px; color: var(--muted); }

.control-label, .arrival-select-wrap label { font-size: 14px; letter-spacing: .8px; }
.control-label, .result-count { color: #3e6266; }
.option, .chip { font-size: 14px; padding: 11px 15px; }
.result-kicker, .result-count { font-size: 14px; }
.result-head h3 { font-size: 28px; }
.route-meta { font-size: 14px; letter-spacing: .7px; color: #23656b; }
.route-card h4 { font-size: 22px; }
.route-card p { font-size: 15px; color: var(--muted); }
.route-open { font-size: 15px; }
.planner-note p { font-size: 14px; color: var(--muted); }

.arrival-lead p:not(.eyebrow) { font-size: 17px; }
.arrival-select-wrap select { font-size: 15px; }
.arrival-card .mini-label { font-size: 14px; }
.arrival-card h3 { font-size: 27px; }
.arrival-card li { font-size: 15px; }
.arrival-card a { font-size: 14px; }
.update-tag { font-size: 14px; }
.update-feature h3 { font-size: 32px; }
.update-feature p { font-size: 16px; color: var(--muted); }
.verified { font-size: 14px; }
.update-list h3 { font-size: 20px; }
.update-list a strong { font-size: 15px; }
.update-list a small { font-size: 14px; color: #526a70; }
.update-disclaimer { font-size: 14px; color: var(--muted); }

.essential { min-height: 330px; }
.essential-num { font-size: 14px; color: #4e6b68; }
.essential h3 { font-size: 19px; }
.essential p { font-size: 15px; color: var(--muted); }
.essential a { font-size: 14px; }
.footer-main p, .footer-links a { font-size: 14px; }
.footer-bottom { font-size: 14px; }
.dialog-inner .route-meta { font-size: 14px; }
.dialog-inner h2 { font-size: 32px; }
.dialog-inner > p { font-size: 16px; color: var(--muted); }
.dialog-inner h3 { font-size: 14px; }
.dialog-inner li { font-size: 15px; }
.dialog-inner .dialog-note { font-size: 14px; }
.dialog-inner a { font-size: 14px; }

a:focus-visible, button:focus-visible, select:focus-visible {
  outline: 3px solid #ff8c73;
  outline-offset: 3px;
}

@media (max-width: 680px) {
  .brand-name { font-size: 12px; letter-spacing: .8px; }
  .hero h1 { font-size: clamp(46px, 10vw, 62px); }
  .hero-copy { font-size: 16px; }
  .intro > p { font-size: 16px; }
  .section-top > p { font-size: 16px; }
  .option, .chip { font-size: 14px; }
  .route-card h4 { font-size: 21px; }
  .route-card p { font-size: 15px; }
  .essential { min-height: 275px; }
}