:root {
  --ink: #102A2A;
  --ink-2: #26403E;
  --signal: #B9F36B;
  --paper: #F7F8F2;
  --white: #FFFFFF;
  --teal: #27645C;
  --muted: #526662;
  --line: #D8E1D7;
  --line-soft: #E3E8DF;
  --mint: #E7F1E8;
  --sage: #EDF0E6;
  --danger: #A82D32;
  --danger-bg: #FCEBED;
  --dark-2: #1B3A38;
  --dark-line: #24403E;
  --radius: 20px;
  color-scheme: light;
}

/* Manrope, served from this site (no outside font request). Text shows straight away in the fallback, sized to
   match, and switches to Manrope when it arrives. */
@font-face {
  font-family: Manrope;
  src: url("/fonts/manrope-latin.woff2?v=2e95d064bf") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Manrope Fallback";
  src: local(Arial);
  ascent-override: 106.45%;
  descent-override: 29.96%;
  line-gap-override: 0%;
  size-adjust: 100.14%;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; scroll-padding-top: 76px; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Manrope, "Manrope Fallback", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { max-width: 100%; display: block; }
a { color: var(--teal); }
a:hover { color: var(--ink); }
h1, h2, h3, p { margin: 0; }
:focus-visible { outline: 3px solid var(--teal); outline-offset: 3px; border-radius: 6px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 12px; top: -60px; background: var(--ink); color: var(--paper); padding: 10px 14px; border-radius: 10px; z-index: 20; }
.skip:focus { top: 12px; }

.wrap { max-width: 1160px; margin: 0 auto; padding: 0 24px; }
.narrow { max-width: 820px; }
.section { padding: 88px 0; }
.section-tight { padding: 40px 0; }
.h-lg { font-size: clamp(30px, 4.2vw, 44px); line-height: 1.1; font-weight: 800; letter-spacing: -0.02em; max-width: 760px; }
.eyebrow { font-size: 13px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--teal); margin-bottom: 12px; }
.eyebrow.lime { color: var(--signal); }
.muted { color: var(--muted); }
.max { max-width: 620px; margin-top: 14px; }
.note { margin-top: 22px; color: var(--muted); font-size: 15px; }

/* Buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 22px; border-radius: 14px; font: 800 16px/1 Manrope, "Manrope Fallback", Arial, sans-serif; text-decoration: none; cursor: pointer; border: 0; transition: transform .15s ease, box-shadow .15s ease; }
.btn:hover { transform: translateY(-1px); }
.btn-sm { min-height: 40px; padding: 0 16px; font-size: 15px; border-radius: 12px; }
.btn-lime { background: var(--signal); color: var(--ink); }
.btn-lime:hover { color: var(--ink); box-shadow: 0 8px 20px rgba(16, 42, 42, .14); }
.btn-dark { background: var(--ink); color: var(--paper); }
.btn-dark:hover { color: var(--paper); }
.btn-outline { background: transparent; color: var(--ink); border: 1.5px solid var(--ink); }
.btn-ghost-dark { background: transparent; color: var(--paper); border: 1px solid #3B5957; min-height: 42px; font-size: 15px; }
.btn-ghost-dark:hover { color: var(--paper); border-color: var(--signal); }
.btn-block { width: 100%; }

/* Header */
.site-header { position: sticky; top: 0; z-index: 10; background: rgba(247, 248, 242, .94); backdrop-filter: saturate(1.2) blur(8px); border-bottom: 1px solid var(--line-soft); }
.header-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 66px; }
.brand img { height: 34px; width: auto; }
.nav { display: flex; gap: 24px; font-size: 14px; font-weight: 700; margin-left: auto; }
.nav a { color: var(--ink-2); text-decoration: none; }
.nav a:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }

/* Hero */
.hero { padding: 72px 0 80px; }
.hero-grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 56px; align-items: center; }
.soon-pill { display: inline-block; border: 1px solid var(--line); background: var(--white); border-radius: 999px; padding: 7px 14px; font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.hero h1 { font-size: clamp(42px, 6.4vw, 72px); line-height: 1.02; font-weight: 800; letter-spacing: -0.03em; margin-top: 20px; max-width: 600px; }
.lede { font-size: clamp(18px, 2vw, 21px); font-weight: 700; line-height: 1.35; margin-top: 22px; max-width: 520px; }
.sub { color: var(--muted); margin-top: 14px; max-width: 560px; font-size: 17px; }
.calendar-note { color: var(--muted); margin-top: 10px; max-width: 560px; font-size: 15px; }
.cta-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.trust-line { list-style: none; padding: 0; margin: 22px 0 0; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 13px; color: var(--muted); font-weight: 600; }

.call-card { background: var(--white); border: 1px solid var(--line); border-radius: 24px; padding: 24px; box-shadow: 0 24px 60px rgba(16, 42, 42, .08); }
.call-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 13px; color: var(--muted); margin-bottom: 14px; }
.tag-red { background: var(--danger-bg); color: var(--danger); font-weight: 800; border-radius: 999px; padding: 3px 10px; font-size: 12px; }
.tag-new { background: var(--signal); color: var(--ink); font-weight: 800; border-radius: 999px; padding: 3px 10px; font-size: 12px; }
.bubble { border-radius: 14px; padding: 11px 14px; font-size: 14px; line-height: 1.5; margin-top: 10px; max-width: 88%; }
.bubble.ai { background: var(--mint); margin-left: auto; }
.bubble.caller { background: var(--sage); }
.confirm { display: flex; gap: 12px; align-items: center; border: 1px solid var(--line); border-radius: 14px; padding: 14px; margin-top: 14px; }
.confirm .tick { width: 28px; height: 28px; border-radius: 8px; background: var(--ink); color: var(--signal); display: grid; place-items: center; font-weight: 800; flex: none; }
.confirm strong { display: block; font-size: 14px; }
.confirm span { font-size: 12px; color: var(--muted); }

/* Videos band */
.band-dark { background: #102A2A; color: var(--paper); padding: 88px 0; }
.band-dark h2 { font-size: clamp(30px, 4.2vw, 46px); line-height: 1.08; font-weight: 800; letter-spacing: -0.02em; max-width: 620px; }
.on-dark { color: #C9D7D2; margin-top: 16px; max-width: 580px; }
.videos-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; flex-wrap: wrap; }
.progress { width: 240px; font-size: 14px; }
.progress-row { display: flex; justify-content: space-between; color: #C9D7D2; }
.progress-row strong { color: var(--paper); }
.progress-track { height: 6px; background: var(--dark-line); border-radius: 999px; margin-top: 8px; overflow: hidden; }
.progress-fill { height: 100%; width: 0; background: var(--signal); border-radius: 999px; transition: width .4s ease; }
.player-grid { display: grid; grid-template-columns: minmax(0, 1fr) 356px; gap: 24px; margin-top: 36px; align-items: start; }
.player { position: relative; border-radius: var(--radius); overflow: hidden; background: #0B1D1D; border: 1px solid var(--dark-line); aspect-ratio: 16 / 9; }
.player video { width: 100%; height: 100%; display: block; background: #0B1D1D; object-fit: cover; }
.player-play { position: absolute; inset: 0; margin: auto; width: 76px; height: 76px; border-radius: 999px; border: 0; background: var(--signal); color: var(--ink); font-size: 26px; line-height: 1; padding-left: 6px; cursor: pointer; box-shadow: 0 10px 30px rgba(0, 0, 0, .35); transition: transform .15s ease; }
.player-play:hover { transform: scale(1.06); }
.player-error { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; gap: 6px; padding: 24px; background: #0B1D1D; color: #C9D7D2; }
.player-error[hidden] { display: none; }
.player-error strong { color: var(--paper); }
.captions-note { font-size: 13px; color: #9FB3AD; margin-top: 10px; }
.now-title { font-size: 22px; font-weight: 800; margin-top: 14px; }
.now-desc { color: #C9D7D2; margin-top: 6px; max-width: 620px; font-size: 15px; }
#next-btn { margin-top: 16px; }
#next-btn[hidden] { display: none; }
.playlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.pl-item { width: 100%; display: flex; gap: 14px; align-items: center; text-align: left; background: transparent; border: 1px solid var(--dark-line); border-radius: 16px; padding: 14px; color: var(--paper); cursor: pointer; font: inherit; }
.pl-item:hover { border-color: #3B5957; }
.pl-item[aria-current="true"] { background: var(--dark-2); border-color: var(--signal); }
.pl-num { width: 30px; height: 30px; border-radius: 999px; background: var(--dark-line); display: grid; place-items: center; font-size: 13px; font-weight: 800; flex: none; }
.pl-item.done .pl-num { background: var(--signal); color: var(--ink); }
.pl-item.soon { opacity: .6; }
.req.soon { opacity: .6; }
.pl-text strong { display: block; font-size: 15px; }
.pl-text span { display: block; font-size: 13px; color: #9FB3AD; }
.demo-line { margin-top: 14px; border: 1px dashed #3B5957; border-radius: 16px; padding: 14px; font-size: 14px; color: #C9D7D2; }
.demo-line[hidden] { display: none; }
.demo-line strong { color: var(--paper); }

/* Features */
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 36px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.feature { padding: 26px 24px; border-right: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); }
.feature:nth-child(3n) { border-right: 0; }
.feature:nth-last-child(-n+3) { border-bottom: 0; }
.feature h3 { font-size: 19px; font-weight: 800; }
.feature p { color: var(--muted); font-size: 15px; margin-top: 8px; }
.feature a { display: inline-block; margin-top: 12px; font-size: 14px; font-weight: 800; text-decoration: none; }

/* Steps */
.steps { list-style: none; padding: 0; margin: 30px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.step { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 24px; }
.step-num { width: 30px; height: 30px; border-radius: 999px; background: var(--ink); color: var(--signal); display: grid; place-items: center; font-weight: 800; font-size: 14px; }
.step h3 { font-size: 19px; font-weight: 800; margin-top: 16px; }
.step p { color: var(--muted); font-size: 15px; margin-top: 6px; }

/* Safety */
.safety { background: var(--ink); color: var(--paper); border-radius: 24px; padding: 40px; }
.safety h2 { font-size: clamp(26px, 3.2vw, 32px); line-height: 1.2; font-weight: 800; max-width: 620px; }
.safety-list { list-style: none; padding: 0; margin: 24px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 24px; font-size: 14px; color: #D8E3DF; }
.safety-list li::before { content: "✓ "; color: var(--signal); font-weight: 800; }

/* Pricing */
.toggle { display: inline-flex; border: 1px solid var(--line); background: var(--white); border-radius: 999px; padding: 4px; margin-top: 26px; flex-wrap: wrap; }
.toggle button { border: 0; background: transparent; color: var(--ink); font: 700 14px Manrope, "Manrope Fallback", Arial, sans-serif; padding: 10px 18px; border-radius: 999px; cursor: pointer; }
.toggle button[aria-pressed="true"] { background: var(--ink); color: var(--paper); }
.plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 24px; align-items: stretch; }
.plan { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 26px 24px; display: flex; flex-direction: column; }
.plan-popular { border: 2px solid var(--ink); }
.plan-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.plan h3 { font-size: 22px; font-weight: 800; }
.popular { background: var(--signal); font-size: 12px; font-weight: 800; border-radius: 999px; padding: 4px 10px; }
.plan-tag { color: var(--muted); font-size: 14px; margin-top: 4px; }
.price { margin-top: 18px; }
.amount { font-size: 42px; font-weight: 800; letter-spacing: -0.02em; }
.per { color: var(--muted); font-size: 14px; }
.price-sub { font-size: 13px; color: var(--muted); min-height: 20px; }
.minutes { background: var(--mint); border-radius: 12px; padding: 10px 12px; font-size: 14px; font-weight: 700; margin-top: 16px; }
.checks { list-style: none; padding: 0; margin: 16px 0 22px; flex: 1; }
.checks li { position: relative; padding: 6px 0 6px 26px; font-size: 14px; line-height: 1.45; }
.checks li::before { content: "✓"; position: absolute; left: 2px; top: 6px; color: var(--teal); font-weight: 800; }
.terms-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 16px; }
.term { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; }
.term h3 { font-size: 15px; font-weight: 800; }
.term p { font-size: 14px; color: var(--muted); margin-top: 8px; }
.term-dark { background: var(--ink); border-color: var(--ink); }
.term-dark h3 { color: var(--signal); }
.term-dark p { color: #D8E3DF; }

/* FAQ */
.faq { margin-top: 28px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.faq details { border-top: 1px solid #EEF1E8; }
.faq details:first-child { border-top: 0; }
.faq summary { list-style: none; cursor: pointer; padding: 18px 22px; font-weight: 800; font-size: 16px; display: flex; justify-content: space-between; gap: 16px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-weight: 800; color: var(--teal); flex: none; }
.faq details[open] summary::after { content: "−"; }
.faq details p { padding: 0 22px 18px; color: var(--muted); font-size: 15px; }

/* Decide */
.decide { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: stretch; }
.ready { background: var(--white); border: 2px solid var(--ink); border-radius: 24px; padding: 32px; }
.question { background: var(--sage); border: 1px solid var(--line); border-radius: 24px; padding: 32px; }
.ready h2, .question h2 { font-size: clamp(24px, 2.6vw, 28px); line-height: 1.2; font-weight: 800; }
.ready .muted, .question .muted { margin-top: 12px; font-size: 15px; }
.early-form { display: flex; gap: 10px; margin-top: 20px; flex-wrap: wrap; }
.early-form input { flex: 1 1 220px; min-height: 48px; border: 1px solid var(--line); border-radius: 14px; padding: 0 16px; font: 500 16px Manrope, "Manrope Fallback", Arial, sans-serif; color: var(--ink); background: var(--white); min-width: 0; }
.early-form input:focus, .early-form select:focus { outline: 3px solid var(--teal); outline-offset: 1px; }
/* The waitlist's fields (P0-4): email and province side by side on wide screens, stacked on phones. */
.early-form .field { flex: 1 1 220px; display: grid; gap: 6px; min-width: 0; }
.early-form .field label { font-size: 14px; font-weight: 700; color: var(--ink); }
.early-form .field input { flex: none; width: 100%; }
.early-form select { min-height: 48px; width: 100%; border: 1px solid var(--line); border-radius: 14px; padding: 0 12px; font: 500 16px Manrope, "Manrope Fallback", Arial, sans-serif; color: var(--ink); background: var(--white); min-width: 0; }
.early-form .check { flex: 1 1 100%; display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--ink-2); line-height: 1.45; }
.early-form .check input { flex: none; width: 20px; height: 20px; min-height: 0; margin: 1px 0 0; padding: 0; accent-color: var(--teal); }
.early-form .check span { overflow-wrap: anywhere; }
.fine { font-size: 13px; color: var(--muted); margin-top: 12px; }
.form-msg { font-size: 14px; font-weight: 700; margin-top: 10px; min-height: 1px; }
.form-msg.ok { color: var(--teal); }
.form-msg.err { color: var(--danger); }
.req-list { list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 8px; }
.req { width: 100%; display: flex; justify-content: space-between; gap: 12px; background: var(--white); border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; font: 700 14px Manrope, "Manrope Fallback", Arial, sans-serif; color: var(--ink); cursor: pointer; text-align: left; }
.req-state { color: var(--muted); flex: none; }
.req-state.done { color: var(--teal); }
.q-label { display: block; font-weight: 800; font-size: 14px; margin-top: 20px; }
.question textarea { width: 100%; margin-top: 8px; border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; font: 500 15px/1.5 Manrope, "Manrope Fallback", Arial, sans-serif; color: var(--ink); background: var(--white); resize: vertical; }
.question .btn { margin-top: 12px; }

.next-title { font-size: 15px; font-weight: 800; margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--line-soft); }
.next-steps { list-style: none; padding: 0; margin: 12px 0 0; display: grid; gap: 10px; }
.next-steps li { display: flex; gap: 12px; align-items: flex-start; font-size: 15px; color: var(--ink-2); }
.next-steps span { width: 26px; height: 26px; border-radius: 999px; background: var(--ink); color: var(--signal); display: grid; place-items: center; font-size: 13px; font-weight: 800; flex: none; }

/* Footer */
.site-footer { border-top: 1px solid var(--line-soft); padding: 32px 0 40px; font-size: 14px; }
.footer-row { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.footer-links { display: flex; gap: 8px 18px; flex-wrap: wrap; align-items: center; color: var(--muted); }

/* Responsive */
@media (max-width: 980px) {
  .hero-grid { grid-template-columns: 1fr; gap: 40px; }
  .player-grid { grid-template-columns: 1fr; }
  .feature-grid { grid-template-columns: 1fr 1fr; }
  .feature:nth-child(3n) { border-right: 1px solid var(--line-soft); }
  .feature:nth-child(2n) { border-right: 0; }
  .feature:nth-last-child(-n+3) { border-bottom: 1px solid var(--line-soft); }
  .feature:last-child { border-bottom: 0; }
  .plans, .terms-grid { grid-template-columns: 1fr; max-width: 560px; }
  .safety-list { grid-template-columns: 1fr 1fr; }
  .decide { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .nav { display: none; }
  .wrap { padding: 0 16px; }
  .section { padding: 64px 0; }
  .section-tight { padding: 28px 0; }
  .hero { padding: 44px 0 56px; }
  .band-dark { padding: 64px 0; }
  .feature-grid { grid-template-columns: 1fr; }
  .feature { border-right: 0 !important; border-bottom: 1px solid var(--line-soft) !important; }
  .feature:last-child { border-bottom: 0 !important; }
  .steps { grid-template-columns: 1fr; }
  .safety { padding: 28px 22px; }
  .safety-list { grid-template-columns: 1fr; }
  .progress { width: 100%; }
  .ready, .question { padding: 24px 20px; }
  .early-form .btn { width: 100%; }
  .question .btn { width: 100%; }
  .btn-sm { padding: 0 12px; }
}

/* Coming-soon (short) page */
.header-row .btn-sm { margin-left: auto; }
.narrow-video { max-width: 900px; }
.narrow-video h2 { margin-bottom: 28px; }
.player-end { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; text-align: center; gap: 10px; padding: 24px; background: rgba(11, 29, 29, .94); color: #C9D7D2; }
.player-end[hidden] { display: none; }
.player-end strong { color: var(--paper); font-size: 20px; }
.player-end .btn { margin-top: 8px; }
#waitlist { max-width: 640px; margin: 0 auto; }

/* Public site pages (2026-11-04): header links, launch line, how it works, the trades, pricing, FAQ, trust, 404. */
.nav + .btn-sm { margin-left: 0; }
.launch-line { margin-top: 18px; max-width: 560px; font-size: 16px; color: var(--ink-2); border-left: 3px solid var(--signal); padding-left: 12px; }
.calendar-note { margin-top: 18px; }
.card-note { font-size: 12px; color: var(--muted); margin-top: 12px; }
.section-sage { background: var(--sage); }
.section-tight-top { padding-top: 0; }
.h-xl { font-size: clamp(34px, 5vw, 56px); line-height: 1.05; font-weight: 800; letter-spacing: -0.025em; max-width: 820px; }
.h-md { font-size: clamp(24px, 2.8vw, 30px); line-height: 1.2; font-weight: 800; }
.page-head { padding: 64px 0 40px; }
.page-head .lede { max-width: 640px; }
.page-head .max { margin-top: 12px; }
.not-found { padding: 96px 0; }
.trade-list { list-style: none; padding: 0; margin: 28px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.trade-list li { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px 22px; color: var(--ink-2); font-size: 15px; }
.trade-list strong { color: var(--ink); }
.plan-chip { display: inline-block; vertical-align: middle; margin-left: 6px; background: var(--mint); color: var(--teal); font-size: 12px; font-weight: 800; border-radius: 999px; padding: 2px 9px; letter-spacing: 0; }
.plan h2 { font-size: 22px; font-weight: 800; }
.plan-short .price-sub { margin-top: 4px; }
.best-for { font-size: 14px; color: var(--ink-2); margin-top: 14px; }
.offer-line { margin-top: 18px; background: var(--white); border: 2px solid var(--signal); border-radius: 14px; padding: 12px 16px; font-weight: 700; max-width: 760px; }
.checks-2 { columns: 2; column-gap: 32px; margin-top: 18px; }
.checks-2 li { break-inside: avoid; }
.h-sub { margin-top: 26px; font-size: 19px; line-height: 1.3; font-weight: 800; }
.badge-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 18px; }
.badge-grid .checks { margin-bottom: 0; }
.term h3 + .checks { margin-top: 10px; }
.canada-line { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--dark-line); color: var(--paper); font-weight: 700; }
.quotes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 24px; }
.quote { margin: 0; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; }
.quote footer { margin-top: 10px; font-size: 14px; color: var(--muted); font-weight: 700; }
.quote-note { margin-top: 8px; font-size: 13px; color: var(--muted); }
.player-light { border-color: var(--line); }
.faq .answer a { font-weight: 700; }
.legal-line { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 13px; color: var(--muted); }
.price-sub, .minutes, .faq summary, .faq details p, .trade-list li, .step p, .feature p, .checks li { overflow-wrap: anywhere; }

@media (max-width: 980px) {
  .badge-grid, .quotes { grid-template-columns: 1fr; }
  .plans .plan-short { max-width: none; }
}
@media (max-width: 760px) {
  .trade-list { grid-template-columns: 1fr; }
  .checks-2 { columns: 1; }
  .page-head { padding: 40px 0 28px; }
  .not-found { padding: 56px 0; }
  .faq summary { padding: 16px 18px; }
  .faq details p { padding: 0 18px 16px; }
}

/* Redesign v3, direction "1c" (Sara's handoff, 2026-11-07): Spectral for headlines, numbers and the demo number;
   Manrope for everything else; deep-green bands for the header, page heads, hero and footer; hairlines instead of
   cards; 3px corners; lime on each page's one main button only. Same words as before. */
@font-face { font-family: Spectral; src: url("/fonts/spectral-400.woff2?v=cf8daee3b8") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: Spectral; src: url("/fonts/spectral-500.woff2?v=2b70215ed4") format("woff2"); font-weight: 500 600; font-style: normal; font-display: swap; }
@font-face { font-family: Spectral; src: url("/fonts/spectral-400-italic.woff2?v=db397149a9") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
:root { --serif: Spectral, Georgia, "Times New Roman", serif; --on-dark: #C9D6D1; --on-dark-muted: #A9BDB7; --dark-rule: #3A5754; --outline-dark: #5B7572; --hair: #D8E1D7; }

h1, .h-lg, .h-xl, .h-md, .band-dark h2, .safety h2, .ready h2, .hear-title, .amount, .walk-num, .step-num, .trade-card h2, .big-number, .hear-number { font-family: var(--serif); font-weight: 500; letter-spacing: -0.01em; }
h1, .h-lg, .h-xl, .lede { text-wrap: pretty; }
.amount, .big-number, .hear-number { font-variant-numeric: tabular-nums; }

.btn { border-radius: 3px; font-weight: 600; transition: background-color .12s ease, border-color .12s ease, color .12s ease; }
.btn:hover { transform: none; box-shadow: none; }
.btn-lime { font-weight: 700; }
.btn-lime:hover { background: #A9E65A; box-shadow: none; }
.btn-sm { border-radius: 3px; min-height: 42px; padding: 0 18px; }
.btn-outline { border-width: 1px; }
.btn-outline:hover { background: #EEF1E8; }
.btn-line-dark { background: transparent; color: var(--paper); border: 1px solid var(--outline-dark); }
.btn-line-dark:hover { color: var(--paper); border-color: var(--paper); }

/* Header: a dark band. */
.site-header { background: var(--ink); border-bottom: 1px solid var(--dark-line); backdrop-filter: none; }
.site-header .menu-sheet { padding-left: max(16px, calc((100vw - 1180px) / 2)); padding-right: max(16px, calc((100vw - 1180px) / 2)); }
.header-row { min-height: 76px; gap: 20px; position: relative; }
.brand img { height: 24px; width: auto; }
.nav { margin: 0 auto; gap: 28px; font-size: 15px; font-weight: 500; }
.nav a, .sign-in { color: var(--on-dark); text-decoration: none; }
.nav a:hover, .sign-in:hover { color: var(--paper); text-decoration: none; }
.nav + .sign-in { margin-left: 0; }
.sign-in { font-size: 15px; font-weight: 500; white-space: nowrap; }
.header-row .btn-sm { margin-left: 0; }
.menu { display: none; }
.menu summary { list-style: none; cursor: pointer; min-height: 44px; display: inline-flex; align-items: center; padding: 0 16px; border: 1px solid var(--outline-dark); border-radius: 3px; color: var(--paper); font-weight: 600; font-size: 15px; }
.menu summary::-webkit-details-marker { display: none; }
.menu-sheet { position: absolute; left: 0; right: 0; top: 100%; max-height: calc(100vh - 64px); overflow-y: auto; background: var(--ink); border-bottom: 1px solid var(--dark-line); padding: 8px 16px 20px; display: grid; gap: 2px; z-index: 30; }
.menu-sheet a:not(.btn) { color: var(--paper); text-decoration: none; font-size: 17px; padding: 12px 0; border-bottom: 1px solid var(--dark-line); }
.menu-sheet .btn { margin-top: 14px; }

/* Home hero: a dark band, the example call as a transcript. */
.hero-dark { background: var(--ink); color: var(--paper); padding: clamp(48px, 7vw, 96px) 0; }
.hero-dark .hero-grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(40px, 6vw, 80px); align-items: start; }
.hero-dark h1 { font-size: clamp(40px, 5vw, 64px); line-height: 1.04; max-width: 640px; }
.hero-dark .h1-accent { color: inherit; }
.hero-dark .lede { color: var(--on-dark); font-weight: 400; font-size: 19px; line-height: 1.5; max-width: 560px; }
.hero-dark .launch-line { color: var(--paper); }
.hero-dark .sub, .hero-dark .calendar-note { color: var(--on-dark-muted); font-size: 14px; }
.hero-dark .soon-pill { background: transparent; border-color: var(--outline-dark); color: var(--on-dark); border-radius: 3px; }
.hero-dark .btn-outline { color: var(--paper); border-color: var(--outline-dark); }
.hero-dark .btn-outline:hover { background: transparent; border-color: var(--paper); }
.transcript { background: none; border: 0; border-left: 1px solid var(--dark-rule); border-radius: 0; box-shadow: none; padding: 0 0 0 32px; color: #E3EAE6; }
.transcript .call-head { color: var(--on-dark-muted); font-size: 13px; margin-bottom: 4px; }
.transcript .tag-new { background: none; color: var(--signal); padding: 0; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.transcript .bubble { background: none; margin: 18px 0 0; padding: 0; max-width: none; border-radius: 0; font-size: 16px; line-height: 1.5; color: #E3EAE6; }
.transcript .bubble::before { display: block; font: 700 12px/1.4 Manrope, "Manrope Fallback", Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: #8FA8A1; margin-bottom: 4px; }
.transcript .bubble.ai::before { content: "Assistant"; }
.transcript .bubble.caller::before { content: "Caller"; }
.transcript .confirm { border: 0; border-top: 1px solid var(--dark-rule); border-radius: 0; padding: 16px 0 0; margin-top: 20px; }
.transcript .confirm .tick { background: var(--signal); color: var(--ink); border-radius: 3px; }
.transcript .confirm strong { color: var(--paper); }
.transcript .confirm span, .transcript .card-note { color: var(--on-dark-muted); }

/* Section heads and text. */
.h-lg { font-size: clamp(30px, 3.3vw, 42px); line-height: 1.1; }
.h-xl { font-size: clamp(36px, 4.4vw, 56px); line-height: 1.06; }
.eyebrow { font-size: 14px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--muted); }
.more-link { margin-top: 22px; font-weight: 700; }
.more-link a { text-decoration: none; }
.more-link a::after { content: " →"; }

/* Page heads: a dark band on every page but Home. */
.page-head { background: var(--ink); color: var(--paper); padding: clamp(48px, 7vw, 96px) 0; }
.page-head .eyebrow { color: var(--on-dark-muted); }
.page-head .lede { color: var(--on-dark); font-weight: 400; font-size: 19px; line-height: 1.5; max-width: 640px; }
.page-head .max, .page-head .muted, .page-head p { color: var(--on-dark); }
.page-head a:not(.btn) { color: var(--paper); }
.page-head + .section, .page-head + .section-tight-top { padding-top: clamp(40px, 6vw, 80px); }

/* Hairlines instead of cards. */
.steps { gap: 0 40px; }
.step, .trade-list li, .feature, .feature:nth-child(3n), .feature:nth-last-child(-n+3), .term, .quote { background: none; border: 0; border-top: 1px solid var(--hair); border-radius: 0; padding: 20px 0 8px; box-shadow: none; }
.step-num { width: auto; height: auto; background: none; color: var(--teal); font-size: 22px; display: block; place-items: unset; }
.step h3 { margin-top: 8px; font-size: 17px; font-weight: 600; }
.section-sage { background: var(--paper); border-top: 1px solid var(--hair); }
.trade-list { gap: 0 40px; }
.feature-grid { background: none; border: 0; border-radius: 0; overflow: visible; gap: 0 40px; }
.feature h3 { font-size: 17px; font-weight: 600; }
.plan-chip { border-radius: 3px; background: #E7F1EA; }
.plans { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 32px; }
.plan { background: none; border: 0; border-top: 1px solid var(--ink); border-radius: 0; padding: 20px 0 0; }
.plan-featured { border-top: 3px solid var(--ink); padding-top: 18px; }
.plan h2, .plan h3 { font: 700 14px/1.3 Manrope, "Manrope Fallback", Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.amount { font-size: 48px; line-height: 1; }
.minutes { background: none; padding: 0; margin-top: 10px; color: var(--muted); font-weight: 500; }
.checks li { border-top: 1px solid #EEF1E8; padding-top: 9px; padding-bottom: 9px; }
.checks li:first-child { border-top: 0; }
.terms-grid, .badge-grid { gap: 0 40px; }
.term h3 { font-size: 16px; font-weight: 600; }
.offer-line { border: 1px solid var(--teal); background: #E7F1EA; border-radius: 3px; }
.faq { background: none; border: 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--hair); border-radius: 0; }
.faq details { border-top: 1px solid var(--hair); }
.faq summary { padding-left: 0; padding-right: 0; font-weight: 600; }
.faq details p { padding-left: 0; padding-right: 0; }
.safety { border-radius: 3px; }
.ready { background: none; border: 0; border-top: 1px solid var(--ink); border-radius: 0; padding: 28px 0 0; }
.early-form input, .early-form select { border-radius: 3px; border-color: #9FB0A8; }

/* How it works. */
.walk { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--hair); }
.walk-step { display: grid; grid-template-columns: 48px minmax(0, 1.15fr) minmax(0, 1fr); gap: 16px 32px; padding: 28px 0; border-bottom: 1px solid var(--hair); align-items: start; }
.walk-num { font-size: 26px; line-height: 1.1; color: var(--teal); }
.walk-body h2 { font-size: 22px; line-height: 1.25; font-weight: 600; }
.walk-body p { color: var(--ink-2); margin-top: 8px; }
.walk-sees { border-left: 1px solid var(--hair); padding-left: 16px; font-size: 15px; }
.walk-sees strong { display: block; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.walk-sees p { color: var(--ink-2); margin-top: 6px; }
.walk-note { margin-top: 32px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); padding: 20px 0; max-width: 820px; color: var(--ink-2); }
.walk-note strong { font-family: var(--serif); font-weight: 500; font-size: 22px; display: block; color: var(--ink); margin-bottom: 6px; }

/* Trades. */
.trade-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 56px; }
.trade-card { border-top: 1px solid var(--hair); padding: 24px 0 28px; display: flex; flex-direction: column; gap: 8px; }
.trade-card h2 { font-size: 28px; line-height: 1.15; }
.trade-card p { color: var(--ink-2); max-width: 520px; }
.trade-card .trade-tags { color: var(--teal); font-weight: 600; font-size: 14px; }

/* Demo line. */
.demo-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: clamp(40px, 6vw, 80px); align-items: start; }
.big-number { display: inline-block; margin-top: 8px; font-size: clamp(44px, 5vw, 56px); line-height: 1.05; color: var(--paper); text-decoration: none; }
.big-number:hover { color: var(--signal); }
.try-card { border-left: 1px solid var(--dark-rule); padding-left: 32px; }
.try-card h2 { font: 700 12px/1.4 Manrope, "Manrope Fallback", Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--on-dark-muted); }
.try-list { list-style: none; padding: 0; margin: 12px 0 0; }
.try-list li { border-top: 1px solid var(--dark-rule); padding: 14px 0; font-size: 15px; color: var(--on-dark); }
.try-list strong { color: var(--paper); font-weight: 600; }
body:has(.demo-grid) .hear-row { display: none; }

/* Footer: a dark band with the demo number. */
.site-footer { background: var(--ink); color: var(--on-dark-muted); border-top: 0; padding: 0 0 36px; font-size: 13px; }
.hear-row { display: flex; align-items: center; justify-content: space-between; gap: 24px 40px; flex-wrap: wrap; padding: clamp(40px, 6vw, 72px) 0; border-bottom: 1px solid var(--dark-line); }
.hear-title { font-size: 40px; line-height: 1.1; color: var(--paper); }
.hear-lead { color: var(--on-dark); margin-top: 8px; max-width: 560px; font-size: 16px; }
.hear-number { font-size: 44px; line-height: 1; color: var(--paper); text-decoration: none; white-space: nowrap; }
.hear-number:hover { color: var(--signal); }
.site-footer .footer-row { padding-top: 32px; }
.footer-brand strong { color: var(--paper); }
.footer-brand p + p { margin-top: 4px; }
.site-footer a { color: var(--on-dark); }
.site-footer a:hover { color: var(--paper); }
.footer-links { color: var(--on-dark-muted); }
.legal-line { color: var(--on-dark-muted); }
.walk-body p, .walk-sees p, .trade-card p, .try-list li, .hear-lead { overflow-wrap: anywhere; }

@media (max-width: 1100px) {
  .plans { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 32px; max-width: none; }
  .nav { gap: 20px; }
}
@media (max-width: 980px) {
  .hero-dark .hero-grid, .demo-grid { grid-template-columns: 1fr; }
  .walk-step { grid-template-columns: 40px minmax(0, 1fr); }
  .walk-sees { grid-column: 2; }
}
@media (max-width: 760px) {
  .header-row { min-height: 64px; gap: 12px; }
  .brand { margin-right: auto; }
  .nav-cta { display: none; }
  .menu { display: block; }
  .sign-in { font-size: 14px; }
  .plans, .trade-grid { grid-template-columns: 1fr; }
  .walk-step { grid-template-columns: 1fr; gap: 10px; }
  .walk-sees { grid-column: auto; }
  .transcript { padding-left: 20px; }
  .hear-title { font-size: 32px; }
  .hero-dark .cta-row .btn { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .btn { transition: none; } }

/* Third outside review (2026-11-08): hero buttons above the fold, the founding offer readable, less empty space,
   section links as buttons, Storm mode first among the features, plan badges on their own line, long plan lists
   folded after five. Same words as before. */
.section { padding: 64px 0; }
.hero-dark { padding: clamp(32px, 4.5vw, 56px) 0 clamp(40px, 5vw, 64px); }
.hero-dark h1 { font-size: clamp(36px, 3.7vw, 50px); max-width: 720px; margin-top: 16px; }
.hero-dark .calendar-note a { color: var(--paper); }
.hero-dark .hero-grid { grid-template-columns: minmax(0, 8fr) minmax(0, 5fr); }
.hero-dark .lede { margin-top: 16px; }
.hero-dark .cta-row { margin-top: 22px; }
.hero-links { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 14px; font-size: 15px; font-weight: 600; }
.hero-links a { color: var(--paper); text-decoration: underline; text-decoration-color: var(--outline-dark); text-underline-offset: 4px; }
.hero-links a:hover { color: var(--signal); }
.arrow-link::after { content: " →"; }
.page-head .offer-line { color: var(--ink); }
.page-head .lede-sub { color: var(--on-dark); margin-top: 14px; font-size: 16px; }
.more-link .btn::after { content: " →"; }
.feature h3 .plan-chip { display: table; margin: 8px 0 0; }
.feature-grid .feature-lead { background: var(--ink); color: var(--paper); border-top: 3px solid var(--signal); padding: 20px 20px 18px; }
.feature-lead h3 { font-family: var(--serif); font-size: 24px; font-weight: 500; }
.feature-lead p { color: var(--on-dark); }
.feature-lead .plan-chip { background: var(--signal); color: var(--ink); font: 800 12px/1.5 Manrope, "Manrope Fallback", Arial, sans-serif; }
.free-check-soon { margin-top: 10px; font-size: 14px; color: var(--ink-2); }
.free-check-note { margin: 0 0 14px; padding: 10px 14px; border-radius: 12px; background: var(--sage); border: 1px solid var(--line); font-size: 15px; font-weight: 600; }
.free-check-note[hidden] { display: none; }
.more-checks summary { cursor: pointer; padding: 9px 0; font-weight: 700; color: var(--teal); border-top: 1px solid #EEF1E8; list-style: none; }
.more-checks summary::-webkit-details-marker { display: none; }
.more-checks summary::after { content: " ▾"; }
.more-checks[open] summary { display: none; }
.more-checks .checks li:first-child { border-top: 1px solid #EEF1E8; }
@media (max-width: 760px) {
  .section { padding: 48px 0; }
  .hero-dark { padding: 24px 0 40px; }
  .hero-dark h1 { font-size: 32px; margin-top: 12px; }
  .hero-dark .lede { font-size: 17px; }
}
/* Fifth outside review (2026-11-08): the hero stacks on phones and tablets again. The two-column rule above came after
   the 980px stack rule and won, so on a phone the headline and the sample call sat side by side. Keep this block last. */
@media (max-width: 980px) {
  .hero-dark .hero-grid { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .hero-dark .transcript { border-left: 0; border-top: 1px solid var(--dark-rule); padding: 24px 0 0; }
  .transcript .call-head { flex-wrap: wrap; }
}

/* "See the demo" with the demo line's number beside it (Sara, 2026-11-09: no booked demo calls). */
.hero-demo-number { align-self: center; color: var(--paper); font-weight: 700; font-size: 16px; text-decoration: underline; text-decoration-color: var(--outline-dark); text-underline-offset: 4px; white-space: nowrap; }
.hero-demo-number::before { content: "☎ "; text-decoration: none; }
.hero-demo-number:hover { color: var(--signal); }