/* Shared finish for the page and its complete animated components. */
:root { --accent: #7ee04a; --accent-bright: #98ed6c; --ink: #0c0d0b; --white: #f6f6f2; }
::selection { background: #7ee04a; color: #0c0d0b; }
:focus-visible { outline: 2px solid #7ee04a; outline-offset: 6px; }
html { scroll-padding-top: 24px; }
body { -webkit-font-smoothing: antialiased; }
.site-header { width: min(1280px, calc(100% - 96px)); height: 96px; border-color: rgba(246,246,242,.14); }
.site-nav { font-size: .875rem; gap: clamp(24px, 2.5vw, 40px); }
.site-nav > a:not(.nav-cta):hover { color: var(--accent); }
.nav-cta, .button { border-radius: 8px; }
.nav-cta { border-color: rgba(126,224,74,.45); }
.nav-cta:hover { color: #0c0d0b; }
.hero { height: auto; min-height: 100svh; display: flex; flex-direction: column; background: #0c0d0b; }
.hero__content { flex: 1; height: auto; padding: clamp(64px, 8vh, 104px) 0 80px; }
.hero::after { height: 22%; background: linear-gradient(transparent, #0c0d0b); }
.eyebrow { font-size: .75rem; letter-spacing: .16em; }
h1 { font-size: clamp(3.2rem, 5.8vw, 5.6rem); line-height: 1.08; margin: 26px 0; text-wrap: balance; }
.hero__content > p { max-width: 600px; color: #d0d2cb; font-size: 1.0625rem; line-height: 1.8; text-wrap: pretty; }
.hero__actions { gap: 14px; margin-top: 32px; }
.button { font-size: .875rem; min-height: 56px; padding: 0 28px; }
.button--primary { color: #11180c; box-shadow: 0 8px 28px rgba(126,224,74,.14); }
.button--primary:hover { box-shadow: 0 12px 32px rgba(126,224,74,.22); }
.button--ghost { border-color: rgba(246,246,242,.25); background: rgba(12,13,11,.55); }
.button--ghost:hover { border-color: #7ee04a; }
.hero__proof { border-radius: 12px; border-color: rgba(246,246,242,.13); background: rgba(12,13,11,.65); padding: 20px 26px; }
.hero__proof > div { min-width: 165px; text-align: left; }
.hero__proof strong { font-size: .875rem; }
.hero__proof small { color: #b4b8ae; font-size: .75rem; }
.hero__proof svg { width: 24px; height: 24px; flex-shrink: 0; }
.why__inner { width: min(1280px, calc(100% - 96px)); padding: clamp(80px, 7vw, 112px) 0; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(48px, 7vw, 104px); }
.why h2 { font-size: clamp(2.5rem, 4.2vw, 4rem); line-height: 1.08; letter-spacing: -.045em; text-wrap: balance; }
.why__reason { grid-template-columns: 40px minmax(0, 1fr) 36px; gap: 20px; padding: 34px 0; min-height: 0; }
.why__reason p, .why__copy { font-size: 1rem; color: #b6b8ae; }
.why__number { font-size: .75rem; }
.why__statement { border-top: 0; padding-top: 4px; padding-bottom: 4px; }
.why__eyebrow { font-size: .75rem; }
.services-frame, .flow-frame { min-height: 0; }

/* Matching gutters, readable labels, and natural height inside the embeds. */
body:has(> .sv), body:has(> .fs) { min-height: 0; display: block; padding: 0; }
.sv, .fs { padding: clamp(80px, 7vw, 112px) max(48px, calc((100vw - 1280px) / 2)); font-size: 16px; }
.sv-head, .sv-rail, .fs-head, .fs-flow { max-width: 1280px; }
.sv-title, .fs-title { font-size: clamp(2.5rem, 4.2vw, 4rem); line-height: 1.08; letter-spacing: -.04em; text-transform: none; font-weight: 600; }
.sv-lede, .fs-lede { font-size: 1rem; line-height: 1.75; color: #b6b8ae; }
.sv-name { font-weight: 700; line-height: 1.15; }
.sv-row { font-family: inherit; }
.sv-cat, .sv-label, .sv-eyebrow span, .sv-inc-n, .sv-idx, .fs-label, .fs-idx, .fs-time { font-size: .75rem; }
.fs { --fs-dim: #a8aaa0; --fs-faint: #a8aaa0; }
.fs-name { font-size: .875rem; letter-spacing: .08em; }
.fs-desc { font-size: .875rem; line-height: 1.65; }
.fs-step.on .fs-desc, .fs-step.done .fs-desc { color: #c4c6bf; }
.fs-done { font-size: .75rem; letter-spacing: .08em; max-width: 100%; text-align: center; line-height: 1.6; }
@media (max-width: 900px) {
  .site-header { width: calc(100% - 44px); }
  .why__inner { width: calc(100% - 44px); grid-template-columns: 1fr; gap: 48px; }
  .sv, .fs { padding: 72px 22px; }
}
@media (max-width: 620px) {
  .site-header { width: calc(100% - 36px); height: 84px; gap: 12px; }
  .nav-cta { font-size: .75rem; padding: 12px; white-space: nowrap; }
  .hero__content { padding: 56px 0 64px; }
  h1 { font-size: clamp(2.5rem, 10vw, 3.65rem); }
  .hero__content > p { max-width: 100%; font-size: 1rem; }
  .eyebrow { font-size: .75rem; letter-spacing: .09em; }
  .hero__actions { width: min(100%, 360px); }
  .hero__proof { padding: 16px 10px; gap: 8px; }
  .hero__proof > div { min-width: 0; gap: 6px; padding-right: 6px; }
  .hero__proof strong { font-size: .75rem; letter-spacing: 0; }
  .hero__proof svg { width: 18px; height: 18px; }
  .why__inner { width: calc(100% - 36px); padding: 64px 0; }
  .why__reason { grid-template-columns: 32px minmax(0,1fr); gap: 12px; }
  .sv, .fs { padding: 64px 18px; }
  .sv-title, .fs-title, .why h2 { font-size: clamp(2.25rem, 9.5vw, 3rem); }
}