/* Homepage split stage. Loaded only on "/", after marketing.css and the vendored
   scroll-craft engine stylesheet. Every component rule is scoped to
   .tc-site--home so it outranks the shared .tc-site element rules. The engine
   files are never edited; this file and home.js are the page. */

:root {
  /* Connected world (the default ground) */
  --sc-canvas: #071832;
  --sc-surface: #0e2446;
  --sc-ink: #eef3fa;
  --sc-ink-soft: #a9bbd3;
  --sc-accent: #ff5a14;
  --sc-accent-ink: #1a0902;
  --sc-font-display: "Archivo TC", system-ui, sans-serif;
  --sc-font-text: "Geist TC", system-ui, sans-serif;
  --sc-shadow-color: 216 70% 8%;

  /* Today world: cool paper, with the accent at a second, deeper stop */
  --paper: #e9edf2;
  --paper-2: #f6f8fb;
  --paper-ink: #142238;
  --paper-soft: #475872;
  --paper-accent: #b0380a;
  --line: #1b3a66;

  /* written every frame by home.js */
  --seam: 42vw;
  --bar-h: 68px;
}

html { background: var(--sc-canvas); }
body { background: transparent; overflow-x: clip; }
.tc-site.tc-site--home { min-height: 0; color: var(--sc-ink); background: transparent; font-family: var(--sc-font-text); }
.tc-site--home h1, .tc-site--home h2, .tc-site--home h3 { color: inherit; }
.tc-site--home p { line-height: inherit; }
::selection { background: var(--sc-accent); color: var(--sc-accent-ink); }

/* header: fixed over the split world, hides on the way down */
.tc-site--home .tc-header { position: fixed; inset: 0 0 auto 0; transition: transform .35s var(--sc-ease-out); }
.tc-site--home .tc-header.is-hidden { transform: translateY(-100%); }
.tc-site--home .tc-footer { position: relative; z-index: 2; }

/* ------------------------------------------------------------ the world -- */
.tc-site--home .world { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
.tc-site--home .ground { position: absolute; inset: 0; overflow: hidden; }
.tc-site--home .ground--today {
  background: radial-gradient(120% 90% at 10% 0%, var(--paper-2) 0%, var(--paper) 55%, #dfe5ec 100%);
  clip-path: inset(0 calc(100% - var(--seam)) 0 0);
}
.tc-site--home .ground--connected {
  background: radial-gradient(90% 70% at 85% 30%, #0f2a52 0%, #071832 60%, #05122a 100%);
  clip-path: inset(0 0 0 var(--seam));
}
.tc-site--home .paper-grid, .tc-site--home .blueprint { position: absolute; inset: -80px; will-change: transform; }
.tc-site--home .paper-grid { background-image: radial-gradient(circle, #c3cedb 1.1px, transparent 1.3px); background-size: 26px 26px; opacity: .75; }
.tc-site--home .blueprint {
  background-image:
    linear-gradient(#123057 1px, transparent 1px), linear-gradient(90deg, #123057 1px, transparent 1px),
    linear-gradient(#0c2244 1px, transparent 1px), linear-gradient(90deg, #0c2244 1px, transparent 1px);
  background-size: 120px 120px, 120px 120px, 24px 24px, 24px 24px;
  opacity: .55;
}

/* system graph */
.tc-site--home .graph { position: absolute; inset: 0; width: 100%; height: 100%; will-change: transform; }
.tc-site--home .graph__far path { fill: none; stroke: #102b50; stroke-width: 1.5; }
.tc-site--home .graph .link { fill: none; stroke: var(--sc-accent); stroke-width: 2.5; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; }
.tc-site--home .graph__pulses path { fill: none; stroke: #ffd2bd; stroke-width: 3.5; stroke-linecap: round;
  stroke-dasharray: .012 .988; animation: tc-home-pulse 7s linear infinite; opacity: 0; transition: opacity .6s; }
.tc-site--home .graph__pulses path + path { animation-duration: 4.5s; animation-delay: -1.2s; }
.tc-site--home .graph.is-live .graph__pulses path { opacity: .9; }
@keyframes tc-home-pulse { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
.tc-site--home .node { opacity: 0; transition: opacity .5s var(--sc-ease-out); }
.tc-site--home .node.is-on { opacity: 1; }
.tc-site--home .node rect { fill: #0d2345; stroke: #2e5a93; stroke-width: 1.5; }
.tc-site--home .node--core rect { stroke: var(--sc-accent); stroke-width: 2; fill: #13305a; }
.tc-site--home .node text { fill: #dbe6f4; font: 600 19px/1 var(--sc-font-text); text-anchor: middle; letter-spacing: .01em; }
.tc-site--home .node__glow { opacity: 0; transition: opacity .8s; }
.tc-site--home .node.is-on .node__glow { opacity: 1; }
.tc-site--home .route { fill: none; stroke: none; }
.tc-site--home .twin { opacity: 0; }
.tc-site--home .twin rect { fill: #10284d; stroke: var(--sc-accent); stroke-width: 1.5; }
.tc-site--home .twin__title { fill: #fff; font: 700 17px/1 var(--sc-font-text); }
.tc-site--home .twin__stamp { fill: #ffb48f; font: 500 14px/1 var(--sc-font-text); font-variant-numeric: tabular-nums; }

/* the desk: manual windows on the Today side */
.tc-site--home .desk { position: absolute; inset: 0; clip-path: inset(0 calc(100% - var(--seam)) 0 0); }
.tc-site--home .win {
  position: absolute; left: 0; top: 0; width: 250px; background: #fff; border-radius: 10px;
  box-shadow: 0 1px 0 #fff inset, 0 2px 4px hsl(216 40% 30% / .10), 0 14px 30px -10px hsl(216 45% 25% / .28);
  will-change: transform; transform-origin: 50% 50%; color: var(--paper-soft); font: 500 12px/1.2 var(--sc-font-text);
}
.tc-site--home .win__bar { display: flex; align-items: center; gap: 5px; padding: 9px 11px; border-bottom: 1px solid #e3e8ef; }
.tc-site--home .win__bar i { width: 7px; height: 7px; border-radius: 50%; background: #d3dae4; }
.tc-site--home .win__bar span { margin-left: 6px; color: var(--paper-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tc-site--home .win__sheet { display: grid; grid-template-columns: 1fr 1.6fr 1fr; gap: 1px; background: #e3e8ef; margin: 10px; border: 1px solid #e3e8ef; }
.tc-site--home .win__sheet b { height: 16px; background: #fff; }
.tc-site--home .win__sheet b:nth-child(5) { background: #fde7dc; }
.tc-site--home .win__lines, .tc-site--home .win__form { display: grid; gap: 8px; padding: 12px; }
.tc-site--home .win__lines b, .tc-site--home .win__form b { height: 9px; border-radius: 3px; background: #e6ebf2; }
.tc-site--home .win__lines b:nth-child(2) { width: 80%; }
.tc-site--home .win__lines b:nth-child(3) { width: 60%; }
.tc-site--home .win__form b { height: 22px; border: 1px solid #dfe5ee; background: #f8fafc; }
.tc-site--home .win--mail { width: 230px; }
.tc-site--home .win--crm { width: 240px; }
.tc-site--home .win--doc { width: 238px; }
.tc-site--home .win--note { width: 160px; background: #fff3c4; border-radius: 4px; }
.tc-site--home .win__scrawl { padding: 16px 14px; color: #6b5412; font: 600 14px/1.5 var(--sc-font-text); transform: rotate(-1.5deg); }
.tc-site--home .chip {
  position: absolute; left: 0; top: 0; z-index: 5; opacity: 0; display: grid; gap: 2px; padding: 9px 12px; border-radius: 9px;
  background: #fff; border: 1.5px solid var(--paper-accent); box-shadow: 0 10px 24px -8px hsl(18 80% 30% / .35);
  font: 500 12.5px/1.25 var(--sc-font-text); color: var(--paper-soft); will-change: transform, opacity; white-space: nowrap;
}
.tc-site--home .chip strong { color: var(--paper-ink); font-size: 13.5px; }
.tc-site--home .chip__stamp { color: var(--paper-accent); font-variant-numeric: tabular-nums; }

/* the divider: the page's primary chrome */
.tc-site--home .seam { position: absolute; top: 0; bottom: 0; left: 0; width: 0; transform: translate3d(var(--seam), 0, 0); will-change: transform; }
.tc-site--home .seam__line { position: absolute; top: 0; bottom: 0; left: -1px; width: 2px; background: linear-gradient(transparent, var(--sc-accent) 12%, var(--sc-accent) 88%, transparent); }
.tc-site--home .seam__tag {
  position: absolute; bottom: 26px; left: 0; transform: translateX(-50%); display: flex; border-radius: 999px; overflow: hidden;
  font: 700 11px/1 var(--sc-font-text); letter-spacing: .14em; text-transform: uppercase; box-shadow: 0 8px 22px -8px hsl(216 70% 5% / .6);
}
.tc-site--home .seam__tag span { padding: 8px 12px; }
.tc-site--home .seam__today { background: #fff; color: var(--paper-ink); }
.tc-site--home .seam__conn { background: var(--sc-accent); color: var(--sc-accent-ink); }
.tc-site--home .world.is-closed .seam { opacity: 0; transition: opacity .4s; }

/* ------------------------------------------------------------ type -- */
.tc-site--home .display { margin: 0; font-family: var(--sc-font-display); font-weight: 760; font-stretch: 104%; letter-spacing: -.028em; line-height: 1.02; text-wrap: balance; }
.tc-site--home .display--hero { font-size: clamp(2.5rem, 1.1rem + 3.5vw, 4.6rem); font-stretch: 100%; letter-spacing: -.035em; line-height: .98; }
.tc-site--home .display--hero span { color: var(--sc-accent); }
.tc-site--home .display--lg { font-size: clamp(2rem, 1.2rem + 2.2vw, 3.4rem); }
.tc-site--home .display--md { font-size: clamp(1.7rem, 1.1rem + 1.5vw, 2.6rem); }
.tc-site--home .eyebrow { margin: 0 0 18px; font: 700 12px/1 var(--sc-font-text); letter-spacing: .16em; text-transform: uppercase; color: var(--sc-accent); }
.tc-site--home .eyebrow--today { color: var(--paper-accent); }
.tc-site--home .lead { margin: 22px 0 0; max-width: 54ch; font-size: clamp(1rem, .95rem + .25vw, 1.14rem); line-height: 1.65; color: var(--sc-ink-soft); text-wrap: pretty; }
.tc-site--home .body { margin: 20px 0 0; max-width: 52ch; line-height: 1.68; color: var(--sc-ink-soft); text-wrap: pretty; }

/* buttons */
.tc-site--home .actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 30px; }
.tc-site--home .btn { display: inline-flex; align-items: center; min-height: 48px; padding: 0 22px; border-radius: 10px;
  font: 650 15px/1 var(--sc-font-text); text-decoration: none; white-space: nowrap;
  transition: transform .14s var(--sc-ease-out), background-color .15s, box-shadow .15s; }
.tc-site--home .btn:active { transform: translateY(1px) scale(.985); }
.tc-site--home .btn--accent { background: var(--sc-accent); color: var(--sc-accent-ink);
  box-shadow: inset 0 1px 0 hsl(20 100% 80% / .6), 0 10px 24px -10px hsl(18 100% 40% / .7); }
.tc-site--home .btn--accent:hover { background: #ff6d2e; }
.tc-site--home .btn--ghost { color: #fff; box-shadow: inset 0 0 0 1.5px #35598a; }
.tc-site--home .btn--ghost:hover { box-shadow: inset 0 0 0 1.5px #7b9cc6; }
.tc-site--home .textlink { color: #ffb48f; text-decoration: none; font-weight: 600; border-bottom: 1.5px solid color-mix(in oklab, #ffb48f 45%, transparent); padding-bottom: 2px; transition: border-color .15s; }
.tc-site--home .textlink:hover { border-color: #ffb48f; }

/* ------------------------------------------------------------ acts -- */
.tc-site--home main { position: relative; z-index: 2; }
.tc-site--home .act [data-sc-stage] { height: 100vh; height: 100svh; }
.tc-site--home .col { position: absolute; top: 0; bottom: 0; display: flex; flex-direction: column; justify-content: center; }

/* 1 hero: seam rests at 42% */
.tc-site--home .act--hero .col--right { left: 42vw; right: 0; padding: calc(var(--bar-h) + 3vh) 6vw 6vh 5.5vw; }
.tc-site--home .hero__inner { max-width: 44rem; }

/* 2 friction: seam rests at 60% */
.tc-site--home .act--friction { color: var(--paper-ink); }
.tc-site--home .act--friction .col--left { left: 0; width: 38vw; padding: calc(var(--bar-h) + 2vh) 2vw 5vh clamp(20px, 5.5vw, 88px); }
.tc-site--home .act--friction .display { color: var(--paper-ink); font-size: clamp(1.9rem, 1rem + 1.9vw, 3rem); }
.tc-site--home .act--friction .body { color: var(--paper-soft); }
.tc-site--home .friction__list { list-style: none; margin: 26px 0 0; padding: 0; display: grid; gap: 2px; }
.tc-site--home .friction__list li { position: relative; padding: 10px 0 10px 26px; border-top: 1px solid #cfd8e3; font-weight: 550; color: var(--paper-ink); }
.tc-site--home .friction__list li::before { content: ""; position: absolute; left: 2px; top: 50%; width: 10px; height: 10px; margin-top: -5px; border-radius: 2px; border: 1.5px solid var(--paper-accent); transform: rotate(45deg); }
.tc-site--home .illus-note { position: absolute; left: 63vw; top: calc(var(--bar-h) + 22px); margin: 0; font: 600 11px/1 var(--sc-font-text); letter-spacing: .12em; text-transform: uppercase; color: #8fa6c4; }

/* 3 services: seam rests at 30% */
.tc-site--home .act--services { position: relative; padding: 42vh 0 18vh; }
.tc-site--home .act--services .col--right { position: relative; margin-left: 30vw; padding: 0 6vw 0 5vw; display: block; }
.tc-site--home .services__head { max-width: 46rem; }
.tc-site--home .ledger { margin-top: 56px; border-top: 1px solid var(--line); }
.tc-site--home .row { position: relative; display: grid; grid-template-columns: minmax(170px, .8fr) 1.2fr auto; gap: 8px 36px; align-items: baseline; padding: 26px 0; border-bottom: 1px solid var(--line); }
.tc-site--home .row::before { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: var(--sc-accent);
  transform: scaleX(0); transform-origin: left; transition: transform .9s var(--sc-ease-out) .15s; }
.tc-site--home .row.sc-in::before { transform: scaleX(1); }
.tc-site--home .row__kicker { grid-column: 1; margin: 0; font: 700 11px/1 var(--sc-font-text); letter-spacing: .15em; text-transform: uppercase; color: #ff8a57; }
.tc-site--home .row h3 { grid-column: 1; margin: 0; font: 720 1.35rem/1.15 var(--sc-font-display); letter-spacing: -.015em; font-stretch: 104%; }
.tc-site--home .row__text { grid-column: 2; grid-row: 1 / span 2; margin: 0; color: var(--sc-ink-soft); line-height: 1.6; max-width: 52ch; }
.tc-site--home .row__link { grid-column: 3; grid-row: 1 / span 2; align-self: center; color: #ffb48f; text-decoration: none; font-weight: 600; white-space: nowrap; font-size: 14.5px; }
.tc-site--home .row__link:hover { color: #fff; }
.tc-site--home .struck { position: sticky; top: 34vh; z-index: 1; width: 30vw; height: 0; overflow: visible; padding-left: clamp(20px, 4vw, 64px); }
.tc-site--home .struck span { position: relative; display: block; width: max-content; max-width: 22vw; margin: 0 0 14px; color: var(--paper-soft); font: 550 14px/1.35 var(--sc-font-text); transition: color .5s; }
.tc-site--home .struck span::after { content: ""; position: absolute; left: -2px; right: -2px; top: 52%; height: 2px; background: var(--paper-accent);
  transform: scaleX(0); transform-origin: left; transition: transform .6s var(--sc-ease-out); }
.tc-site--home .struck span.is-struck { color: #93a1b4; }
.tc-site--home .struck span.is-struck::after { transform: scaleX(1); }

/* 4 proof: seam rests at 12% */
.tc-site--home .act--proof .col--right { left: 12vw; right: 0; padding: calc(var(--bar-h) + 2vh) 6vw 6vh 5vw; }
.tc-site--home .proof__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 26px 48px; margin: 40px 0 34px; max-width: 70rem; }
.tc-site--home .stat { padding-top: 22px; border-top: 1px solid var(--line); }
.tc-site--home .stat--wide { grid-column: 1 / -1; }
.tc-site--home .stat__num { margin: 0 0 12px; font: 780 clamp(3rem, 1.6rem + 3.6vw, 5.6rem)/.9 var(--sc-font-display); font-stretch: 112%; letter-spacing: -.04em; color: #fff; font-variant-numeric: tabular-nums; }
.tc-site--home .stat h3 { margin: 0 0 6px; font: 650 1.05rem/1.3 var(--sc-font-text); color: #fff; letter-spacing: 0; }
.tc-site--home .stat p:not(.stat__num) { margin: 0; color: var(--sc-ink-soft); line-height: 1.6; max-width: 58ch; }
.tc-site--home .shrink { margin-bottom: 16px; }
.tc-site--home .shrink__track { height: 14px; border-radius: 7px; background: #0f2a50; box-shadow: inset 0 1px 2px hsl(216 70% 4% / .6); overflow: hidden; }
.tc-site--home .shrink__bar { height: 100%; width: 100%; border-radius: 7px; background: linear-gradient(90deg, var(--sc-accent), #ff8a57); transform-origin: left; transform: scaleX(var(--shrink, 1)); }
.tc-site--home .shrink__labels { display: flex; justify-content: space-between; margin-top: 10px; font: 600 13px/1 var(--sc-font-text); color: var(--sc-ink-soft); font-variant-numeric: tabular-nums; }
.tc-site--home .shrink__to { color: #ffb48f; }

/* 5 close: the collapse */
.tc-site--home .close { overflow: hidden; }
.tc-site--home .close__links { position: absolute; inset: 0; width: 100%; height: 100%; }
.tc-site--home .close__links path { fill: none; stroke: var(--sc-accent); stroke-width: 2.5; stroke-dasharray: 1; stroke-dashoffset: 1; stroke-linejoin: round; }
.tc-site--home .close__nodes { position: absolute; inset: 0; }
.tc-site--home .cn {
  --k: 0;
  position: absolute; left: 0; top: 0; width: 210px; height: 56px; opacity: 0; display: grid; place-items: center; border-radius: 12px;
  background: color-mix(in oklab, #ffffff calc((1 - var(--k)) * 100%), #10284d);
  border: 1.5px solid color-mix(in oklab, #d7dee8 calc((1 - var(--k)) * 100%), #3a6aa6);
  box-shadow: 0 2px 4px hsl(216 60% 10% / .2), 0 18px 36px -14px hsl(216 70% 4% / .7);
  font: 600 15px/1 var(--sc-font-text); will-change: transform, opacity;
}
.tc-site--home .cn--core { border-color: color-mix(in oklab, #d7dee8 calc((1 - var(--k)) * 100%), var(--sc-accent)); }
.tc-site--home .cn span { grid-area: 1 / 1; white-space: nowrap; max-width: calc(100% - 20px); overflow: hidden; text-overflow: ellipsis; }
.tc-site--home .cn__old { color: var(--paper-ink); opacity: calc(1 - var(--k) * 1.6); }
.tc-site--home .cn__new { color: #fff; opacity: calc(var(--k) * 1.6 - .6); }
.tc-site--home .close__copy { position: absolute; left: clamp(20px, 7vw, 120px); top: 50%; translate: 0 -46%; max-width: 36rem; }

/* ------------------------------------------------------------ phones -- */
@media (max-width: 860px) {
  :root { --bar-h: 64px; }
  .tc-site--home .world { display: none; }

  .tc-site--home .act--hero { background: radial-gradient(120% 80% at 90% 10%, #123661 0%, #071832 60%); }
  .tc-site--home .act--hero .col--right { left: 0; padding: calc(var(--bar-h) + 28px) 20px 40px; }
  .tc-site--home .display--hero { font-size: clamp(2.3rem, 1.2rem + 5vw, 3.2rem); }

  .tc-site--home .act--friction { background: var(--paper); }
  .tc-site--home .act--friction .col--left { width: auto; right: 0; padding: calc(var(--bar-h) + 16px) 20px 28px; }
  .tc-site--home .act--friction .display { font-size: clamp(1.7rem, 1rem + 3.4vw, 2.3rem); }
  .tc-site--home .friction__list li { padding: 8px 0 8px 24px; font-size: 15px; }
  .tc-site--home .illus-note { display: none; }

  .tc-site--home .act--services { padding: 72px 0 48px; }
  .tc-site--home .act--services .col--right { margin-left: 0; padding: 0 20px; }
  .tc-site--home .struck { display: none; }
  .tc-site--home .row { grid-template-columns: 1fr; padding: 22px 0; }
  .tc-site--home .row__text, .tc-site--home .row__link { grid-column: 1; grid-row: auto; }
  .tc-site--home .row__link { justify-self: start; margin-top: 6px; }

  .tc-site--home .act--proof .col--right { left: 0; padding: calc(var(--bar-h) + 12px) 20px 24px; }
  .tc-site--home .proof__grid { grid-template-columns: 1fr; gap: 16px; margin: 20px 0 18px; }
  .tc-site--home .stat { padding-top: 14px; }
  .tc-site--home .stat__num { font-size: clamp(2.4rem, 1.4rem + 5vw, 3.4rem); margin-bottom: 6px; }
  .tc-site--home .stat p:not(.stat__num) { font-size: 14.5px; line-height: 1.5; }

  .tc-site--home .close__copy { left: 20px; right: 20px; top: auto; bottom: 7vh; translate: none; }
  .tc-site--home .close__links { display: none; }
  .tc-site--home .cn { width: 148px; height: 44px; font-size: 13px; border-radius: 10px; }

  /* reading acts flow on phones (home.js removes their pin) */
  .tc-site--home .act--flowed [data-sc-stage] { height: auto; }
  .tc-site--home .act--flowed .col { position: relative; inset: auto; }
  .tc-site--home .act--hero.act--flowed [data-sc-stage] { min-height: 100svh; display: flex; }
  .tc-site--home .act--hero.act--flowed .col { justify-content: center; }
  .tc-site--home .act--proof.act--flowed { padding-bottom: 32px; }
}

@media (max-height: 760px) and (min-width: 861px) {
  .tc-site--home .proof__grid { gap: 16px 40px; margin: 22px 0 18px; }
  .tc-site--home .stat__num { font-size: clamp(2.6rem, 1.4rem + 3vw, 4.2rem); }
  .tc-site--home .act--friction .display { font-size: clamp(1.7rem, .9rem + 1.6vw, 2.5rem); }
  .tc-site--home .friction__list li { padding: 7px 0 7px 26px; }
}

@media (prefers-reduced-motion: reduce) {
  .tc-site--home .graph__pulses path { animation: none; }
  .tc-site--home .tc-header { transition: none; }
}