@font-face { font-family: Geist; src: url('/assets/geist-latin.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
@font-face { font-family: 'Geist Mono'; src: url('/assets/geist-mono-latin.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
:root { color-scheme: dark; --background: #08090a; --text: #e8e9ec; --muted: #9aa0a9; --accent: #f2a93b; }
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
body { margin: 0; font-family: Geist, system-ui, sans-serif; color: var(--text); background: var(--background); -webkit-font-smoothing: antialiased; }
body > header, main, body > footer { max-width: 1440px; margin-inline: auto; }
main { overflow: clip; }
button, input { font: inherit; color: inherit; }
button { cursor: pointer; }
a { color: inherit; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.mono { font-family: 'Geist Mono', ui-monospace, monospace; }
.site-header > a:last-of-type { margin-left: auto; }
.skip-link { position: fixed; top: 12px; left: 12px; padding: 12px; background: var(--accent); color: #17120a; z-index: 20; transform: translateY(-200%); }
.skip-link:focus { transform: none; }
.hero-image { width: 100%; }
.hero-image img { width: 100%; height: auto; }
.feature:nth-child(even) { flex-direction: row-reverse; }
.detail-text { display: flex; flex-direction: column; gap: 14px; }
.footer-brand { display: flex; align-items: center; gap: 28px; }
.footer-links { display: flex; gap: 28px; margin-left: auto; }
.site-footer { box-sizing: border-box; }
@media (min-width: 701px) and (max-width: 1439px) {
  .site-header { padding-inline: 5.5556vw; }
  .hero { padding-inline: 5.5556vw; }
  .benefits { padding-inline: 8vw; gap: 32px; }
  .feature { padding-inline: 5.5556vw; gap: 5.5556vw; }
  .feature-copy { width: 31.25%; flex-shrink: 1; }
  .feature-image { width: 62.5%; flex-shrink: 1; }
  .feature-image img { width: 100%; }
  .details { padding-inline: 8vw; }
  .site-footer { padding-inline: 5.5556vw; gap: 20px; flex-wrap: wrap; }
  .footer-links { gap: 20px; }
}
@media (min-width: 701px) and (max-width: 1050px) {
  .hero { padding-top: 72px; }
  .hero h1 { font-size: 60px; }
  .hero-copy > p { font-size: 19px; }
  .benefits { padding-top: 80px; padding-inline: 5.5556vw; gap: 24px; }
  .feature, .feature:nth-child(even) { flex-direction: column; align-items: stretch; gap: 32px; padding-block: 56px; }
  .feature-copy, .feature-image { width: 100%; }
  .feature-copy { max-width: 650px; }
  .feature-copy h2 { font-size: 40px; }
  .details { padding: 80px 5.5556vw 40px; gap: 36px; }
  .details > h2 { font-size: 38px; }
  .detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .download { padding-block: 100px; }
  .download h2 { font-size: 52px; }
}
@media (max-width: 700px) {
  .site-header { height: 60px; padding: 0 20px; justify-content: space-between; position: relative; }
  .site-header > a:first-child svg { width: 24px; height: 24px; }
  .site-header > a:first-child span { font-size: 15px; }
  .site-header > a:last-of-type { height: 36px; padding-inline: 14px; font-size: 13.5px; margin-left: auto; }
  .site-header > a:last-of-type svg { width: 13.5px; height: 13.5px; }
  .hero { gap: 22px; padding: 56px 20px 0; }
  .hero-glow { top: 380px; width: 600px; height: 420px; margin-left: -300px; background: radial-gradient(50% 50% at 50% 50%, rgba(242,169,59,.12), transparent 70%); }
  .hero-copy { gap: 22px; width: 100%; }
  .hero-copy > svg { width: 72px; height: 72px; }
  .hero h1 { font-size: 42px; line-height: 1.04; letter-spacing: -.035em; }
  .hero-copy > p { font-size: 17px; line-height: 1.55; }
  .desktop-copy { display: none; }
  .hero-actions { width: 100%; flex-direction: column; gap: 10px; padding-top: 4px; }
  .hero-copy > span { font-size: 13px; }
  .hero-image { margin-top: 28px; }
  .hero-image img { border-radius: 10px; }
  .benefits { display: flex; flex-direction: column; gap: 28px; padding: 64px 24px 16px; }
  .benefits > div { gap: 6px; }
  .benefits > div > span:first-child { font-size: 17px; letter-spacing: normal; }
  .benefits > div > span:last-child { font-size: 15.5px; line-height: 1.55; }
  #features { padding: 0; }
  .feature, .feature:nth-child(even) { flex-direction: column; align-items: stretch; gap: 28px; padding: 56px 20px 8px; }
  .feature-copy { width: auto; gap: 16px; }
  .feature-copy h2 { font-size: 32px; line-height: 1.1; }
  .feature-copy p { font-size: 16.5px; }
  .feature-copy > div { padding-top: 0; }
  .feature-copy li { font-size: 15.5px; }
  .feature-image { position: relative; width: 100%; height: 250px; overflow: hidden; border-radius: 12px; outline: 1px solid rgba(255,255,255,.1); outline-offset: -1px; background: #0d0e10; }
  .feature-image img { position: absolute; max-width: none; border-radius: 0; box-shadow: none; outline: none; }
  #questions img { width: 780px; height: 488px; left: calc(50% - 452px); top: -238px; }
  #review img { width: 760px; height: 428px; left: calc(50% - 471px); top: -55px; }
  #browser img { width: 760px; height: 428px; left: calc(50% - 585px); top: -89px; }
  #hosts img { width: 560px; height: 350px; left: calc(50% - 280px); top: 0; }
  #missions img { width: 700px; height: 438px; left: calc(50% - 294px); top: 0; }
  .details { align-items: stretch; gap: 24px; padding: 80px 20px 8px; }
  .details > h2 { font-size: 30px; text-align: left; text-wrap: balance; }
  .detail-grid { display: flex; flex-direction: column; gap: 14px; }
  .detail-card { flex-direction: row; align-items: flex-start; padding: 18px; border-radius: 14px; }
  .detail-card > span { width: 36px; height: 36px; }
  .detail-card > span svg { width: 18px; height: 18px; }
  .detail-text { gap: 4px; }
  .detail-text > span:first-child { font-size: 16.5px; letter-spacing: normal; }
  .detail-text > span:last-child { font-size: 14.5px; line-height: 1.5; }
  .download { padding: 96px 20px; }
  .download-glow { display: none; }
  .download-copy { width: 100%; gap: 18px; }
  .download-copy > svg { width: 64px; height: 64px; }
  .download h2 { font-size: 40px; letter-spacing: -.035em; line-height: normal; text-wrap: balance; }
  .download p { font-size: 16.5px; }
  .download-copy > div { width: 100%; padding-top: 6px; display: flex; }
  .download a { flex-grow: 1; }
  .download-copy > span { font-size: 13px; }
  .site-footer { flex-direction: column; align-items: stretch; gap: 18px; padding: 28px 20px 40px; }
  .footer-brand { gap: 12px; }
  .footer-brand > span { font-size: 13px; }
  .footer-links { margin: 0; flex-wrap: wrap; gap: 8px 20px; }
  .footer-links a { font-size: 14px; min-height: 28px; display: inline-flex; align-items: center; }
  .site-footer > .mono { font-size: 12px; }
}