/* ── Design tokens ──────────────────────────────────────────────────────────── */
:root {
  --rx-ink:        #0B2440;
  --rx-ink-soft:   #3A5275;
  --rx-muted:      #6A7B95;
  --rx-line:       #E3ECF5;
  --rx-bg:         #FFFFFF;
  --rx-bg-tint:    #F4F8FC;

  --rx-primary:    #1E7BC8;
  --rx-primary-d:  #145A98;
  --rx-sky:        #7BB6D9;
  --rx-sky-soft:   #DCEAF5;
  --rx-deep:       #0E3A66;

  --rx-amber:      #F59E0B;
  --rx-amber-d:    #D97706;
  --rx-red:        #EF4444;
  --rx-red-d:      #DC2626;
  --rx-green:      #22C55E;
  --rx-danger:     #DC4438;

  --rx-radius:     14px;
  --rx-radius-lg:  22px;

  --shadow-sm: 0 1px 2px rgba(11,36,64,.06), 0 1px 1px rgba(11,36,64,.04);
  --shadow-md: 0 6px 24px -8px rgba(20,90,152,.18), 0 2px 6px rgba(11,36,64,.06);
  --shadow-lg: 0 30px 80px -30px rgba(20,90,152,.35), 0 10px 30px -10px rgba(11,36,64,.15);
}

/* ── Base ────────────────────────────────────────────────────────────────────── */
html, body {
  background: var(--rx-bg);
  color: var(--rx-ink);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
body { font-size: 17px; line-height: 1.55; }
.mono { font-family: 'JetBrains Mono', ui-monospace, monospace; }

h1, h2, h3, h4 { color: var(--rx-ink); letter-spacing: -0.02em; font-weight: 700; }
h1 { font-size: clamp(2.4rem, 4.6vw, 4rem); line-height: 1.05; letter-spacing: -0.035em; font-weight: 800; }
h2 { font-size: clamp(1.8rem, 3.2vw, 2.6rem); line-height: 1.1; letter-spacing: -0.03em; }
h3 { font-size: 1.25rem; }

.eyebrow {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px; font-weight: 600;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--rx-primary);
}
.lead-rx { font-size: 1.18rem; color: var(--rx-ink-soft); line-height: 1.55; }

/* ── Nav ─────────────────────────────────────────────────────────────────────── */
.rx-nav {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255,255,255,0.85);
  backdrop-filter: saturate(160%) blur(14px);
  -webkit-backdrop-filter: saturate(160%) blur(14px);
  border-bottom: 1px solid var(--rx-line);
}
.rx-nav .inner {
  display: flex; align-items: center; justify-content: space-between; padding: 14px 0;
}
.brand { display: inline-flex; align-items: center; text-decoration: none; }
.brand-logo { display: block; width: auto; }
.brand-logo-nav { height: 56px; }
.brand-logo-footer { height: 56px; }
.rx-nav .links {
  display: flex; gap: 28px; align-items: center;
  margin-left: auto; margin-right: 32px;
}
.rx-nav .links a:not(.btn-rx):not(.btn-rx-ghost) {
  color: var(--rx-ink-soft); text-decoration: none; font-weight: 500; font-size: 15px;
}
.rx-nav .links a:not(.btn-rx):not(.btn-rx-ghost):hover { color: var(--rx-primary); }

.nav-toggle {
  display: none;
  background: none; border: none; color: var(--rx-ink);
  padding: 4px; cursor: pointer;
}
.mobile-nav-cta { display: none; }

@media (max-width: 720px) {
  .rx-nav .links { display: none; margin-right: 0; }
  .nav-toggle { display: block; }
  .rx-nav .links.open {
    display: flex; flex-direction: column;
    position: absolute; top: 100%; left: 0; right: 0;
    background: #fff; border-bottom: 1px solid var(--rx-line);
    padding: 16px 24px; gap: 16px; z-index: 100;
  }
  .rx-nav .links.open .mobile-nav-cta {
    display: flex; flex-direction: column; gap: 10px;
    padding-top: 8px; border-top: 1px solid var(--rx-line);
  }
}

/* ── Scroll offset for sticky nav ───────────────────────────────────────────── */
#download { scroll-margin-top: 90px; }

/* ── Buttons ─────────────────────────────────────────────────────────────────── */
.btn-rx {
  background: var(--rx-primary); color: #fff;
  border: 1px solid var(--rx-primary);
  border-radius: 999px; padding: 12px 22px;
  font-weight: 600; font-size: 15px;
  transition: transform .15s ease, background .2s ease, box-shadow .2s ease;
  box-shadow: 0 6px 16px -8px rgba(20,90,152,.55);
  text-decoration: none; display: inline-block;
}
.btn-rx:hover {
  background: var(--rx-primary-d); border-color: var(--rx-primary-d);
  color: #fff; transform: translateY(-1px);
}
.btn-rx-ghost {
  background: transparent; color: var(--rx-primary);
  border: 1px solid var(--rx-primary);
  border-radius: 999px; padding: 12px 22px;
  font-weight: 600; font-size: 15px;
  text-decoration: none; display: inline-block;
}
.btn-rx-ghost:hover { background: var(--rx-primary); color: #fff; }

/* ── Store badges ────────────────────────────────────────────────────────────── */
.store-row { display: flex; gap: 12px; flex-wrap: wrap; }
.store-btn {
  display: inline-flex; align-items: center; gap: 12px;
  background: #0B2440; color: #fff; text-decoration: none;
  padding: 11px 18px; border-radius: 12px;
  border: 1px solid #0B2440;
  transition: transform .15s ease, background .2s ease;
  min-width: 180px;
}
.store-btn:hover { background: #1a3a60; color: #fff; transform: translateY(-1px); }
.store-btn .small { font-size: 11px; opacity: .8; line-height: 1; letter-spacing: .04em; }
.store-btn .big { font-size: 18px; font-weight: 700; line-height: 1.1; letter-spacing: -0.01em; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; }
.store-btn svg { flex: 0 0 auto; }
.store-btn--soon { opacity: .5; cursor: default; pointer-events: none; }

/* ── Footer ──────────────────────────────────────────────────────────────────── */
footer {
  background: #0B2440;
  color: #B9CCE2;
  padding: 48px 0 32px;
  margin-top: auto;
}
.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 40px;
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
@media (max-width: 768px) {
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 480px) {
  .footer-grid { grid-template-columns: 1fr; }
}
.footer-tagline { font-size: 14px; color: #BFD4EA; margin-top: 4px; }
.footer-col h5 { color: #E8F1FA; font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 14px; }
.footer-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.footer-col ul li a { color: #CCDCEA; text-decoration: none; font-size: 14px; }
.footer-col ul li a:hover { color: #fff; }
.footer-copy { display: flex; align-items: center; gap: 16px; padding-top: 24px; font-size: 13px; color: #4A6280; }
.footer-copy span:nth-child(2) { margin-left: auto; }
.footer-version { font-size: 11px; color: #344D61; font-variant-numeric: tabular-nums; }
.footer-legal { padding-top: 8px; font-size: 11px; color: #6B8299; }

/* ── Utility ─────────────────────────────────────────────────────────────────── */
.text-primary { color: var(--rx-primary) !important; }
.text-muted-rx { color: var(--rx-muted) !important; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.ic-green { background: #D9EAD8; }
.ic-sky   { background: #E8F2FB; color: var(--rx-primary); }
.text-danger-rx { color: var(--rx-danger); }
.text-ink-soft  { color: var(--rx-ink-soft); }
.btn-rx-sm { padding: 8px 18px; font-size: 14px; }