/* Ejecta study: the hero pins while scrolling breaks the mark apart and throws
   the three products clear of the crater. Without JS or with reduced motion,
   the stage renders as ordinary stacked content. */
.impact-scroll{position:relative;border-top:1px solid var(--line)}
.stage{position:relative;isolation:isolate}
.stage-canvas{display:none}
.stage-hero{padding-top:72px;padding-bottom:56px}
.stage-hero .eyebrow{color:var(--muted);margin-bottom:28px}
.stage-hero h1{font-size:clamp(64px,8.4vw,120px);line-height:1.01;letter-spacing:-.064em;margin:0}
.stage-hero h1 em{color:#d1dae0;line-height:1.1}
.hero-lede{font-size:16px;line-height:1.65;color:#b5bec5;margin:25px 0 27px}
.stage-hero .small-button{align-self:flex-start}
.stage-products{display:flex;flex-direction:column;gap:clamp(28px,5vh,52px);padding-bottom:64px}
.stage-title .eyebrow{color:var(--muted);margin-bottom:20px}
.stage-title h2{font-size:clamp(40px,4.6vw,66px);text-wrap:balance}
.shards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.2vw,32px)}
.shard{--heat:0;--detail:1;position:relative;display:flex;flex-direction:column;gap:12px;min-width:0;min-height:228px;padding:22px 24px 20px;border-radius:4px;color:#1d252b;background:color-mix(in oklab,var(--ember) calc(var(--heat)*100%),var(--cool));box-shadow:0 12px 45px #0000002a;transform-origin:50% 50%}
.shard>*{opacity:calc(1 - var(--heat)*1.4)}
.shard-meta{display:flex;justify-content:space-between;gap:12px;font:12px/1.5 monospace;color:#44525c}
.shard-glyph{color:#b8452a;font-size:20px;line-height:1}
.shard-glyph.serif{font-family:var(--serif);font-size:40px;height:20px}
.shard strong{font-size:clamp(28px,2.7vw,40px);font-weight:400;letter-spacing:-.05em;line-height:1.05;text-wrap:balance}
.shard-line{font-size:15px;line-height:1.5;max-width:30ch;color:#303b43}
.shard-more{margin-top:auto;padding-top:12px;border-top:1px solid #0000001f;font-size:13px;opacity:calc(var(--detail) - var(--heat)*1.4)}
.shard:hover .shard-more,.shard:focus-visible .shard-more{text-decoration:underline;text-underline-offset:3px}
.stage-readout{display:none}

/* Pinned, scroll-driven mode (added by impact-scroll.js). */
.impact-scroll.is-live{height:420vh;height:420svh}
.is-live .stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.is-live .stage-canvas{display:block;position:absolute;inset:0;width:100%;height:100%;z-index:0}
.is-live .stage-hero{position:absolute;inset:0 0 56px;margin:auto;display:flex;flex-direction:column;justify-content:center;padding-top:0;padding-bottom:0;z-index:2;pointer-events:none}
.is-live .stage-hero .small-button{pointer-events:auto}
.is-live .stage-products{position:absolute;inset:0;margin:auto;justify-content:center;padding-top:clamp(20px,5vh,56px);padding-bottom:clamp(120px,22vh,220px);z-index:3;pointer-events:none}
.is-live .stage-title{opacity:var(--title,0);transform:translateY(calc((1 - var(--title,0))*28px))}
.is-live .shard{opacity:0;will-change:transform,clip-path}
.is-live .stage-readout{display:block;position:absolute;left:0;right:0;bottom:0;z-index:4;font:12px/1.5 monospace;color:#84929e}
.readout-line{display:block;height:1px;background:var(--line)}
.readout-line i{display:block;height:2px;margin-top:-1px;background:var(--ember);transform:scaleX(0);transform-origin:left}
.readout-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:16px;padding-bottom:18px}
.readout-steps{display:flex;gap:clamp(14px,3vw,36px);list-style:none;margin:0;padding:0}
.readout-steps li{display:flex;align-items:center;gap:8px;transition:color .3s}
.readout-steps li:before{content:'';width:6px;height:6px;border-radius:50%;border:1px solid currentColor;transition:background .3s,border-color .3s}
.readout-steps li.is-done{color:#b5bec5}
.readout-steps li.is-active{color:var(--paper)}
.readout-steps li.is-active:before{background:var(--ember);border-color:var(--ember)}
.scroll-cue{white-space:nowrap}
.scroll-cue span{color:var(--ember)}
.impact-scroll+.products{padding-top:96px}
.page-veil{position:fixed;inset:0;z-index:60;background:var(--ink);opacity:0;pointer-events:none;transition:opacity .32s ease}
.page-veil.is-on{opacity:1}
[tabindex="-1"]:focus{outline:none}

@media(max-width:1050px){.shard{padding:18px 18px 16px;min-height:210px}.shard-line{font-size:14px}}
@media(max-width:760px){
  .stage-hero{padding-top:48px}
  .shards{grid-template-columns:1fr;gap:12px}
  .shard{min-height:0;padding:14px 16px;gap:6px}
  .shard strong{font-size:28px}
  .shard-line{font-size:14px}
  .shard-more{display:none}
  .stage-title .eyebrow{margin-bottom:12px}
  .stage-title h2{font-size:clamp(34px,9vw,44px)}
  .is-live .stage-hero{justify-content:flex-start;padding-top:9vh}
  .is-live .stage-products{gap:20px;padding-bottom:clamp(96px,16vh,150px)}
  .scroll-cue{display:none}
  .readout-steps li:before{display:none}
  .readout-steps{justify-content:space-between;width:100%}
}
@media(max-width:760px) and (max-height:760px){.is-live .shard-line{display:none}.is-live .stage-title .eyebrow{display:none}}

/* Trailside panel: the working-card treatment from the Trailside Reactive Board
   design (accent sweep, orbiting agent mark, glow, blinking caret). */
.trail-board-demo{--tb-accent:#2563eb;--tb-text:#18212b;--tb-muted:#4b5563;--tb-border:#dde3ea;--tb-lane:#eef2f6;background:#f7f8fa;color:var(--tb-text);font-family:system-ui,-apple-system,"Segoe UI",sans-serif}
.trail-board-demo .demo-top{border-bottom-color:var(--tb-border)}
.trail-board-demo .demo-label{color:var(--tb-muted)}
.tb-routing{display:flex;align-items:center;gap:8px;margin:14px 18px 0;padding:8px 10px;border-radius:6px;background:#fff;border:1px solid var(--tb-border);font-size:12px;line-height:1.45;color:var(--tb-muted)}
.tb-live{width:7px;height:7px;flex:none;border-radius:50%;background:var(--tb-accent);animation:tb-live 1.4s ease-in-out infinite}
.tb-lanes{display:grid;grid-template-columns:repeat(3,minmax(190px,1fr));gap:8px;padding:12px 18px 4px;overflow-x:auto}
.tb-lanes:focus-visible{outline:2px solid var(--tb-accent);outline-offset:-2px}
.tb-lane{display:flex;flex-direction:column;gap:8px;min-width:0;padding:10px;border-radius:8px;background:var(--tb-lane)}
.tb-lane h4{display:flex;align-items:center;gap:6px;margin:0;font-size:12.5px;font-weight:600}
.tb-lane h4 span{font-weight:500;color:var(--tb-muted);font-size:11px}
.tb-rule{margin:0;padding:5px 8px;border:1px dashed #c3ccd7;border-radius:6px;font-size:11px;color:var(--tb-muted)}
.tb-card{position:relative;display:flex;flex-direction:column;gap:5px;padding:10px 11px;border:1px solid var(--tb-border);border-radius:6px;background:#fff;font-size:12px;overflow:hidden}
.tb-card p{margin:0}
.tb-row{display:flex;align-items:center;gap:6px}
.tb-num{font:11px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--tb-muted)}
.tb-tag{margin-left:auto;padding:1px 6px;border:1px solid var(--tb-border);border-radius:4px;font:11px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--tb-muted)}
.tb-attempt{padding:1px 5px;border-radius:4px;background:#fdecea;color:#b42318;font-size:11px}
.tb-title{font-size:12.5px;font-weight:600;line-height:1.35}
.tb-repo,.tb-who{font-size:11px;color:var(--tb-muted)}
.tb-fail{display:flex;align-items:center;gap:6px;padding:4px 7px;border-radius:5px;background:#fdf3f2;font-size:11px}
.tb-fail i{width:6px;height:6px;border-radius:50%;background:#d92d20;flex:none}
.tb-fail span{margin-left:auto;color:var(--tb-muted)}
.tb-routed{font-size:11px;color:#1d4ed8}
.tb-ask{font-size:11px;color:#9a3412;font-weight:600}
.tb-ok{font-size:11px;color:#067647}
.tb-card.is-working{border-color:#bfd2fa}
.tb-card.is-working::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent 0%,var(--tb-accent) 50%,transparent 100%);background-size:50% 100%;background-repeat:no-repeat;animation:tb-sweep 1.8s ease-in-out infinite}
.tb-work{display:flex;align-items:center;gap:8px;margin-top:2px;min-width:0}
.tb-botwrap{position:relative;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;flex:none}
.tb-orbit{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgb(37 99 235/0%) 0deg,rgb(37 99 235/0%) 200deg,#2563eb 330deg,rgb(37 99 235/0%) 360deg);-webkit-mask:radial-gradient(circle,transparent 12.5px,#000 13px);mask:radial-gradient(circle,transparent 12.5px,#000 13px);animation:tb-orbit 1.4s linear infinite}
.tb-bot{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:var(--tb-accent);color:#fff;box-shadow:0 0 8px rgb(37 99 235/40%);animation:tb-glow 2s ease-in-out infinite}
.tb-act{display:flex;align-items:center;gap:6px;flex:1;min-width:0;padding:4px 8px;border-radius:6px;background:#f3f6fb}
.tb-act code{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:11px ui-monospace,SFMono-Regular,Menlo,monospace;color:#1e3a8a}
.tb-caret{width:6px;height:11px;flex:none;background:var(--tb-accent);animation:tb-blink 1s steps(1) infinite}
.trail-board-demo .demo-disclaimer{color:var(--tb-muted)}
@keyframes tb-sweep{0%{background-position:-100% 0}100%{background-position:200% 0}}
@keyframes tb-orbit{to{transform:rotate(360deg)}}
@keyframes tb-glow{0%,100%{box-shadow:0 0 0 0 rgb(37 99 235/0%),0 0 6px rgb(37 99 235/30%)}50%{box-shadow:0 0 0 3px rgb(37 99 235/14%),0 0 14px rgb(37 99 235/55%)}}
@keyframes tb-blink{50%{opacity:0}}
@keyframes tb-live{0%,100%{opacity:1}50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.tb-card.is-working::before{animation:none;background:var(--tb-accent);opacity:.35}.tb-orbit{opacity:.5}}

.product-visit{margin:-12px 0 26px;align-self:flex-start;color:var(--paper)}

/* Company footer. Bracketed values are placeholders to fill in before launch. */
.llc-footer{padding-top:64px;padding-bottom:32px;border-top:1px solid var(--line);color:#aeb9c2;font-size:14px;line-height:1.6}
.llc-grid{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:40px}
.llc-brand p{max-width:36ch;margin:14px 0 0}
.llc-brand .llc-motto{margin-top:24px;font-size:clamp(26px,2.4vw,34px);line-height:1.12;letter-spacing:-.045em;color:var(--paper)}
.llc-motto em{font-family:var(--serif);font-weight:400;color:var(--blue)}
.llc-footer nav{display:flex;flex-direction:column;gap:6px}
.llc-footer h3{margin:0 0 8px;font-size:12px;font-weight:400;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.llc-footer nav a,.llc-base a{color:var(--paper);align-self:flex-start;padding:4px 0}
.llc-footer nav a:hover,.llc-base a:hover{color:var(--ember)}
.llc-contact{color:var(--paper);padding:4px 0}
.llc-todo{font:12px/1.6 monospace;color:#c88a74}
.llc-base{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 28px;margin-top:56px;padding-top:22px;border-top:1px solid var(--line);font-size:12px;color:#85939e}
.llc-base p{margin:0}
@media(max-width:760px){.llc-grid{grid-template-columns:1fr 1fr;gap:32px 24px}.llc-brand{grid-column:1/-1}.llc-footer{padding-top:44px}.llc-base{flex-direction:column;align-items:flex-start}}
.llc-brand .brand{color:var(--paper)}

@media(max-width:460px){.site-header nav>a:last-child{display:inline-flex}.site-header nav{gap:16px}}