/* Farstarry — quiet space, clear ambition. */
:root {
  color-scheme: dark;
  --bg: #080f1b;
  --paper: #101b2a;
  --paper-strong: #142234;
  --ink: #edf3f6;
  --muted: #a4b1c1;
  --line: #253244;
  --accent: #a0e7de;
  --accent-strong: #c6f5ef;
  --accent-soft: #173b42;
  --card-accent: #7bd7cb;
  --warning: #f0d5a0;
  --warning-soft: #30291d;
  --success: #b7eacb;
  --success-soft: #16342b;
  --danger: #ffbebd;
  --danger-soft: #38222c;
  --shadow: #030810;
  --max: 1240px;
  --sans: "Avenir Next", "Segoe UI", system-ui, sans-serif;
  --serif: var(--sans);
}
html { scroll-behavior: smooth; scroll-padding-top: 28px; }
body {
  background: radial-gradient(ellipse at 85% 5%, #152d3c80, transparent 32%),
    url('/assets/stars.svg') top center / 1600px 1200px repeat-y, var(--bg);
  -webkit-font-smoothing: antialiased;
}
::selection { background: #82d6ca; color: #07121d; }
.shell { width: min(var(--max), calc(100% - 96px)); }
.site-nav { padding: 30px 0 26px; border-bottom: 1px solid var(--line); }
.nav-brand { gap: 11px; color: var(--ink); font-size: 24px; letter-spacing: -.045em; font-weight: 500; text-transform: lowercase; }
.nav-brand::before { display: none; }
.brand-mark { width: 29px; height: 29px; color: #e0f4ef; }
.nav-links { gap: 22px; }
.nav-links a { font-size: 13px; font-weight: 500; padding: 8px 0; color: #b5bfcd; border-radius: 0; }
.nav-links a:hover, .nav-links a[aria-current="page"] { background: transparent; color: var(--ink); }
.nav-links .nav-cta { background: #d7f0ea; color: #0b2029 !important; box-shadow: none; padding: 10px 20px !important; border-radius: 5px; margin-left: 8px; font-size: 12px !important; }
.nav-links .nav-cta:hover { background: #effbf7 !important; color: #0b2029 !important; }
.hero { position: relative; text-align: left; min-height: 710px; padding: 100px 0 112px; isolation: isolate; }
.hero-copy { position: relative; z-index: 2; width: 61%; max-width: 725px; }
.eyebrow { display: flex; align-items: center; gap: 10px; font-size: 10px; font-weight: 500; letter-spacing: .19em; color: #a4e2db; margin-bottom: 26px; }
.eyebrow::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #9ae9dc; box-shadow: 0 0 10px #68caba60; flex-shrink: 0; }
.hero h1 { max-width: none; margin: 0; font-size: clamp(48px, 6.15vw, 88px); font-weight: 500; line-height: 1.06; letter-spacing: -.065em; }
.hero h1 em { font-family: Georgia, serif; font-weight: 400; letter-spacing: -.07em; color: #aae4df; }
.hero .lede { max-width: 48ch; margin: 28px 0 0; font-size: 15px; line-height: 1.8; color: #a8b8c7; }
.hero-bullets { max-width: 48ch; margin: 22px 0 0; gap: 8px; }
.hero-bullets li { padding-left: 17px; font-size: 12px; color: #9cabbc; line-height: 1.7; }
.hero-bullets li::before { width: 4px; height: 4px; top: 8px; background: #77b8b6; }
.hero-bullets li::after { display: none; }
.hero .cta-row { justify-content: flex-start; margin-top: 28px; gap: 12px; }
.cta-primary, .button-primary, .cta-secondary, .button-secondary { min-height: 48px; padding: 13px 22px; border-radius: 5px; font-size: 12px; letter-spacing: .02em; font-weight: 600; }
.cta-primary, .button-primary { background: #c3eee5; color: #082129; box-shadow: 0 4px 28px #71b9ae10; gap: 20px; }
.cta-primary:hover, .button-primary:hover { background: #e3faf4; box-shadow: 0 6px 32px #85cebf18; }
.cta-primary span { font-size: 18px; font-weight: 400; }
.cta-secondary, .button-secondary { color: #d0dbe4; background: #101b2a80; border: 1px solid #344255; }
.cta-secondary:hover, .button-secondary:hover { background: #172436; border-color: #6d909b; }
.celestial-scene { position: absolute; z-index: -1; width: 610px; right: -20px; top: 42px; pointer-events: none; }
.orbit-art { position: relative; width: 100%; height: auto; overflow: visible; }
.orbit-glow { position: absolute; inset: 12%; background: radial-gradient(circle, #71b8b710, transparent 70%); border-radius: 50%; }
.celestial-caption { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: -70px; color: #7b97a6; font-size: 10px; letter-spacing: .055em; }
.signal-dot { width: 4px; height: 4px; background: #83d5c7; border-radius: 50%; }
.orbit-ring { transform-origin: 330px 330px; animation: orbit-drift 90s linear infinite; }
@keyframes orbit-drift { to { transform: rotate(360deg); } }
.hero-footnote { position: absolute; bottom: 28px; width: 100%; display: flex; justify-content: space-between; align-items: center; color: #6f8397; font-size: 9px; letter-spacing: .16em; }
.hero-footnote a { text-decoration: none; color: #93a7b7; letter-spacing: .03em; font-size: 11px; }
.hero-footnote a span { padding-left: 15px; color: #a4e2db; }
.section { padding: 84px 0; }
.section-header { max-width: 640px; margin-bottom: 32px; }
.section-title { font-size: clamp(28px, 3.3vw, 43px); line-height: 1.2; font-weight: 500; letter-spacing: -.045em; }
.section-intro { font-size: 14px; line-height: 1.8; }
main > #explore { display: grid; grid-template-columns: 1fr 1fr; gap: 90px; align-items: start; }
#explore .section-header { margin: 0; }
.pain-list { gap: 20px; }
.pain-list li { font-size: 14px; line-height: 1.8; color: #b0becb; }
.pain-list li::before { color: #71aea9; font-weight: 400; }
.output-grid { gap: 16px; }
.output-card { padding: 32px; border-radius: 8px; }
.output-card h4 { font-size: 17px; font-weight: 500; letter-spacing: -.02em; }
.output-card p { font-size: 13px; margin-top: 12px; line-height: 1.8; }
.card, .signup-card, .status-card, .workflow-card, .pricing-card, .segment-card, .output-card, .team-card, .pilot-form-card { background: linear-gradient(145deg, #132132, #0e1826); border: 1px solid #26374b; box-shadow: none; }
.workflow-grid { gap: 18px; }
.workflow-card { border-radius: 8px; padding: 32px; position: relative; }
.workflow-card::before { content: '✦'; display: block; color: #91d4c9; font-size: 24px; margin-bottom: 24px; }
.workflow-card h3 { font-size: 22px; font-weight: 500; letter-spacing: -.035em; }
.workflow-card p { font-size: 13px; line-height: 1.8; max-width: 45ch; }
.workflow-meta { background: transparent; color: #b4e4da; padding: 0; border: 0; border-radius: 0; margin-top: 18px; font-size: 13px; letter-spacing: .02em; }
.workflow-card:hover, .team-card:hover, .output-card:hover { border-color: #4b6d79; transition: border-color 200ms; }
.steps-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 64px; row-gap: 30px; }
.step-number { background: transparent; color: #98cec8; border: 1px solid #34525c; border-radius: 5px; width: 32px; height: 32px; font-size: 12px; font-weight: 500; }
.step-body { padding-top: 4px; }
.step-body strong { color: #e2ebef; font-size: 14px; font-weight: 500; }
.step-body p { font-size: 13px; margin-top: 9px; line-height: 1.8; }
.pilot-section { margin: 0 0 50px; padding: 80px 32px; background: radial-gradient(ellipse at 50% 100%, #2b6a702b, transparent 75%), #111d2b; border: 1px solid #304354; border-radius: 8px; position: relative; }
.pilot-section::before { content: '✦'; display: block; font-size: 27px; color: #adede3; margin-bottom: 24px; }
.pilot-section h2 { font-size: clamp(30px, 4vw, 48px); font-weight: 500; letter-spacing: -.045em; max-width: 23ch; }
.pilot-section .lede { font-size: 14px; }
.page-hero { padding: 76px 0 60px; gap: 24px; position: relative; }
.page-hero::after { content: '✦'; position: absolute; right: 6%; top: 68px; font-size: 160px; line-height: 1; font-weight: 100; color: #74c2b8; opacity: .09; z-index: -1; }
.page-hero .eyebrow { margin: 0; }
.page-hero h1 { font-weight: 500; letter-spacing: -.055em; font-size: clamp(40px, 5vw, 66px); max-width: 21ch; }
.page-hero .lede { font-size: 15px; line-height: 1.8; }
.page-hero .cta-row { gap: 12px; }
.team-comparison { background: #101c2b; border-radius: 8px; box-shadow: none; }
.team-comparison-row { font-size: 12px; padding: 17px 24px; }
.team-comparison-head { background: #162638; font-size: 9px; }
.team-grid { gap: 20px; }
.team-card { border-radius: 8px; padding: 32px; }
.team-card h3 { font-size: 27px; font-weight: 500; letter-spacing: -.035em; }
.featured-team { border-color: #527d84; background: linear-gradient(135deg, #18313b, #101d2e); }
.team-badge, .badge { border: 1px solid #315359; border-radius: 4px; background: #18383c; color: #a4dfd6; font-size: 9px; font-weight: 500; }
.team-price { font-size: 13px; font-weight: 500; }
.team-outcome, .team-best-for { font-size: 13px; line-height: 1.8; }
.team-best-for { background: #09152170; border-radius: 4px; border-left: 1px solid #44706f; }
.team-playbooks { font-size: 12px; line-height: 1.8; }
.team-card-cta { border: 1px solid #36525d; background: #1a303a; color: #c4e5e1; border-radius: 5px; font-size: 12px; }
.team-card-cta:hover { background: #24434b; border-color: #659c9b; }
.pricing-grid { gap: 20px; }
.pricing-card { border-radius: 8px; padding: 30px; }
.pricing-card.featured { background: linear-gradient(145deg, #203942, #122337); border: 1px solid #7ea9aa; padding-top: 42px; }
.pricing-card.featured::before { background: #b5e1d7; color: #10242c; font-size: 8px; padding: 6px 14px; font-weight: 600; letter-spacing: .15em; border-radius: 0 0 4px 4px; }
.pricing-name { color: #a9d7d3; font-size: 10px; }
.pricing-price { font-size: 42px; font-weight: 500; letter-spacing: -.045em; }
.pricing-price span { color: #a5b7c3; font-size: 12px; letter-spacing: 0; }
.pricing-for, .pricing-members, .pricing-features { font-size: 12px; line-height: 1.8; }
.pricing-label { color: #8eaabb; font-size: 9px; }
.pricing-members li { background: #09162480; border-color: #2c4456; border-radius: 4px; }
.pricing-members strong { font-size: 12px; font-weight: 500; }
.pricing-members span { font-size: 11px; }
.trust-content { font-size: 13px; line-height: 1.8; }
.trust-marker { font-size: 11px; border-radius: 4px; }
.faq-question { font-size: 19px; font-weight: 500; letter-spacing: -.02em; }
.faq-answer { font-size: 13px; line-height: 1.8; }
.signup-card, .status-card, .pilot-form-card { border-radius: 8px; }
.signup-card h2, .status-card h2, .pilot-form-card h2 { font-size: 25px; font-weight: 500; letter-spacing: -.03em; }
.field label, .field-span label { font-size: 12px; font-weight: 500; color: #d0dce6; }
.field input, .field select, .field textarea, .field-span input, .field-span select, .field-span textarea { background: #091421; border: 1px solid #334659; color: #edf3f6; border-radius: 5px; font-size: 13px; min-height: 44px; }
input::placeholder, textarea::placeholder { color: #718496; }
.field-hint, .support-copy { font-size: 12px; line-height: 1.8; }
.notice { font-size: 12px; border-radius: 5px; line-height: 1.8; }
.notice.info { background: #172d3d; border-color: #355769; color: #c6dce8; }
.notice.warning { color: #eed4a5; background: #30291d; border-color: #695735; }
.notice.success { color: #bae7c7; background: #16342b; border-color: #306b51; }
.notice.error { color: #efbdc3; background: #38222c; border-color: #764655; }
.summary-row { font-size: 13px; }
.summary-total { border-color: #38535c; }
.summary-total .summary-row dd { color: #b6e8df; }
footer { padding: 14px 0 32px; text-align: left; border-top: 0; }
.footer-links { justify-content: flex-start; gap: 28px; margin-bottom: 30px; }
.footer-links a { font-size: 12px; color: #acb8c7; }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; border-top: 1px solid #283647; padding-top: 26px; font-size: 10px; color: #75879c; }
.footer-signature { font-family: Georgia, serif; font-size: 15px; font-style: italic; color: #a7bac5; }
.skip-link { background: #c3eee5; color: #082129; }
:focus-visible { outline: 2px solid #a2e6dc; outline-offset: 5px; }
@media (min-width: 1500px) { .hero h1 { font-size: 92px; } .hero { min-height: 770px; padding-top: 110px; } .celestial-scene { width: 650px; right: -32px; top: 25px; } }
@media (max-width: 1100px) {
  .shell { width: calc(100% - 64px); }
  .hero { min-height: 710px; padding-top: 85px; }
  .hero-copy { width: 66%; }
  .hero h1 { font-size: clamp(52px, 6.4vw, 70px); }
  .celestial-scene { width: 530px; right: -25px; top: 76px; opacity: .8; }
  main > #explore { gap: 45px; }
}
@media (max-width: 767px) {
  .shell { width: calc(100% - 40px); }
  .site-nav { padding: 23px 0 20px; flex-direction: row; align-items: center; gap: 20px; }
  .nav-brand { font-size: 24px; }
  .nav-links { width: auto; gap: 18px; }
  .nav-links a { font-size: 11px; }
  .nav-links .nav-cta { padding: 8px 14px !important; margin-left: 0; }
  .hero { padding: 76px 0 78px; min-height: 0; }
  .hero-copy { width: 100%; max-width: 580px; }
  .hero h1 { max-width: none; font-size: clamp(48px, 7.8vw, 62px); }
  .eyebrow { font-size: 9px; letter-spacing: .12em; margin-bottom: 23px; }
  .hero .lede { font-size: 14px; max-width: 47ch; }
  .hero-bullets { max-width: 49ch; gap: 8px; }
  .hero-bullets li { font-size: 11px; }
  .hero .cta-row { flex-direction: row; align-items: stretch; margin-top: 28px; }
  .cta-primary, .cta-secondary, .button-primary, .button-secondary { font-size: 11px; padding: 12px 17px; min-height: 46px; }
  .celestial-scene { width: 340px; right: -10px; top: 30px; opacity: .25; }
  .celestial-caption { display: none; }
  .hero-footnote { bottom: 20px; font-size: 8px; letter-spacing: .08em; }
  .hero-footnote a { font-size: 9px; }
  .section { padding: 52px 0; }
  main > #explore { grid-template-columns: 1fr; gap: 24px; }
  .section-header { margin-bottom: 26px; }
  .section-title { font-size: 30px; line-height: 1.2; }
  .section-intro { font-size: 13px; }
  .pain-list li { font-size: 13px; }
  .steps-list { grid-template-columns: 1fr; gap: 25px; }
  .output-card, .workflow-card, .team-card { padding: 26px; }
  .page-hero { padding: 54px 0 36px; }
  .page-hero h1 { font-size: 43px; }
  .page-hero .lede { font-size: 14px; }
  .page-hero::after { font-size: 110px; top: 50px; }
  .pilot-section { padding: 54px 22px; margin-bottom: 32px; }
  .pilot-section h2 { font-size: 33px; }
  .signup-card, .status-card, .pilot-form-card { border-radius: 8px; padding: 24px; }
  .footer-links { gap: 18px; margin-bottom: 22px; }
  .footer-links a { font-size: 10px; }
  .footer-bottom { align-items: center; gap: 12px; }
  .footer-signature { font-size: 13px; }
}
@media (max-width: 480px) {
  .site-nav { flex-wrap: wrap; gap: 18px; }
  .nav-brand { font-size: 22px; }
  .nav-links { width: 100%; justify-content: space-between; gap: 10px; }
  .hero { padding-top: 58px; }
  .hero h1 { font-size: 48px; }
  .hero .cta-row { flex-direction: column; }
  .hero-bullets li { font-size: 12px; }
  .hero .lede { line-height: 1.85; }
  .celestial-scene { top: 20px; width: 280px; right: 0; opacity: .18; }
  .hero-footnote { bottom: 20px; }
  .hero-footnote > span { max-width: 140px; line-height: 1.5; }
  .page-hero h1 { font-size: 38px; }
  .team-card-topline { align-items: flex-start; flex-wrap: wrap; }
  .footer-bottom { align-items: flex-start; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }
