/* Homepage footer ("Command"): framework marquee, link grid, wordmark. Uses the tokens from v3.css. */
.ft,.ft *,.ft *::before,.ft *::after{box-sizing:border-box}
:where(.ft) a{color:inherit;text-decoration:none}
:where(.ft) :where(p,h3){margin:0}
.ft .mono{font-family:var(--mono);font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.ft-wrap{width:min(1280px,100% - 2 * clamp(20px,4vw,48px));margin:0 auto}
/* shared pieces */
.ft{position:relative}
.fbtn{display:inline-flex;align-items:center;gap:10px;padding:14px 24px;border-radius:99px;font:600 15px/1 var(--ui);border:1px solid transparent;transition:background .3s,color .3s,border-color .3s,transform .45s var(--out),box-shadow .3s}
.fbtn svg{width:12px;height:12px;flex:none;transition:transform .45s var(--out)}
.fbtn:hover svg{transform:translate(2px,-2px)}
.fbtn:active{transform:scale(.98)}
.fbtn-lg{padding:20px 34px;font-size:18px}
.fbtn-mint{background:var(--mint);color:#03130d}
.fbtn-mint:hover{background:#4fd3a6;box-shadow:0 12px 32px -10px rgba(45,189,142,.6)}
.fbtn-line{border-color:rgba(255,255,255,.22);color:#fff}
.fbtn-line:hover{border-color:var(--mint);background:rgba(45,189,142,.1)}
.fbtn-ink{background:var(--ink);color:#fff}
.fbtn-ink:hover{background:var(--green)}
.fbtn-ghost{border-color:rgba(12,31,28,.18);color:var(--ink)}
.fbtn-ghost:hover{border-color:var(--ink);background:#fff}
.ft .brand{display:inline-flex;align-items:center;gap:11px;font:500 21px var(--disp);letter-spacing:-.025em;color:#fff}
.ft .brand svg{width:28px;height:30px;flex:none}
.ft-bottom{display:flex;align-items:center;gap:20px;padding:22px 0 26px;border-top:1px solid rgba(255,255,255,.1);font-size:13px}
.ft-note{margin-right:auto;opacity:.85}
.ft-top{position:relative;flex:none;width:44px;height:44px;border-radius:50%;border:0;background:transparent;color:inherit;cursor:pointer;display:grid;place-items:center;transition:transform .45s var(--out),color .3s}
.ft-top svg{width:18px;height:18px;position:relative}
.ft-top .ring{position:absolute;inset:0;width:44px;height:44px;transform:rotate(-90deg)}
.ft-top circle{fill:none;stroke-width:2}
.ft-top .r0{stroke:rgba(255,255,255,.14)}
.ft-top .r1{stroke:var(--mint);stroke-linecap:round;transition:stroke-dashoffset .15s linear}
.ft-top:hover{transform:translateY(-3px);color:var(--mint)}

/* reveal on scroll */
.fjs [data-r]{opacity:0;transform:translateY(26px);transition:opacity .9s var(--out),transform 1.1s var(--out);transition-delay:var(--d,0s)}
.fjs [data-r].in{opacity:1;transform:none}

/* ================= A: Command (dark: framework marquee, link grid, wordmark) ================= */
.fa{background:linear-gradient(180deg,#06130f,#050f0b);color:#8fa59d;overflow:hidden;border-top:1px solid rgba(255,255,255,.08)}
.fa-halo{position:absolute;left:50%;top:-1px;translate:-50% 0;width:min(900px,80%);height:1px;background:linear-gradient(90deg,transparent,rgba(120,235,195,.7),transparent);box-shadow:0 0 40px 6px rgba(45,189,142,.25)}
.fa-marq{padding:60px 0 44px;display:grid;gap:22px}
.fa-cap{color:var(--mint);font-size:11.5px}
.fa-track{display:flex;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.fa-run{display:flex;gap:12px;padding-right:12px;flex:none;animation:faMarq 70s linear infinite}
.fa-track:hover .fa-run{animation-play-state:paused}
.fa-run a{white-space:nowrap;padding:11px 20px;border:1px solid rgba(255,255,255,.12);border-radius:99px;color:#cfe0d9;font-size:14.5px;transition:border-color .3s,background .3s,color .3s,transform .4s var(--out)}
.fa-run a:hover{border-color:var(--mint);background:rgba(45,189,142,.12);color:#fff;transform:translateY(-2px)}
@keyframes faMarq{to{transform:translateX(-100%)}}
.fa-grid{display:grid;grid-template-columns:1.55fr repeat(3,1fr);gap:clamp(28px,4vw,64px);padding:60px 0 56px;border-top:1px solid rgba(255,255,255,.08)}
.fa-brand{display:grid;gap:22px;align-content:start;justify-items:start}
.fa-brand p{max-width:25em;font-size:16px;line-height:1.55;color:#a9c0b8}
.fa-btns{display:flex;flex-wrap:wrap;gap:10px}
.fa-col{display:grid;align-content:start}
.fa-col h3{display:grid;gap:14px;margin-bottom:10px;font-size:11.5px;color:#fff}
.fa-col h3 i{display:block;height:1px;background:rgba(255,255,255,.14);transform:scaleX(0);transform-origin:left;transition:transform 1.2s .15s var(--out);position:relative}
.fa-col h3 i::after{content:"";position:absolute;left:0;top:0;width:28px;height:1px;background:var(--mint);box-shadow:0 0 10px var(--mint)}
.fa-col.in h3 i{transform:scaleX(1)}
.fa-col a{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;color:#9fb8b0;font-size:15.5px;transition:color .3s,padding .45s var(--out)}
.fa-col a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(255,255,255,.07)}
.fa-col a::before{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--mint);transform:scaleX(0);transform-origin:left;transition:transform .55s var(--out);z-index:1}
.fa-col a:hover{color:#fff;padding-left:8px}
.fa-col a:hover::before{transform:scaleX(1)}
.fa-col a svg{width:11px;height:11px;opacity:0;transform:translate(-6px,6px);transition:opacity .3s,transform .45s var(--out);color:var(--mint)}
.fa-col a:hover svg{opacity:1;transform:none}
.fa-col em{font:500 10.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;font-style:normal;color:#5f7a71;transition:color .3s}
.fa-col a:hover em{color:var(--mint)}
.fa .ft-bottom{color:#7f9a92}
.fa-word{position:relative;height:clamp(70px,11.6vw,190px);overflow:hidden;display:flex;justify-content:center;pointer-events:none;user-select:none;-webkit-mask-image:linear-gradient(180deg,#000 35%,transparent 98%);mask-image:linear-gradient(180deg,#000 35%,transparent 98%)}
.fa-word span{display:block;padding-right:.09em;font:600 clamp(96px,19vw,330px)/.82 var(--disp);letter-spacing:-.065em;white-space:nowrap;color:transparent;background:linear-gradient(105deg,rgba(255,255,255,.05) 30%,rgba(120,235,195,.55) 48%,rgba(255,255,255,.05) 66%) 0 0/260% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:1px rgba(255,255,255,.08);transform:translateY(46%);opacity:0;transition:transform 1.6s var(--out),opacity 1.2s}
.fa-word.in span{transform:none;opacity:1;animation:faSweep 9s 1.6s linear infinite}
@keyframes faSweep{from{background-position:100% 0}to{background-position:0% 0}}


@media(max-width:1000px){.fa-grid{grid-template-columns:1fr 1fr}.fa-brand{grid-column:1/-1}}
@media(max-width:640px){.fa-grid{grid-template-columns:1fr}.ft-bottom{flex-wrap:wrap;justify-content:space-between}.ft-note{order:3;flex-basis:100%;margin:0}}
@media(prefers-reduced-motion:reduce){
  .fa-run{animation:none}.fa-track{overflow-x:auto;-webkit-mask-image:none;mask-image:none}
  .fjs [data-r],.fa-word span{opacity:1!important;transform:none!important;transition:none!important;animation:none!important}
  .fa-col h3 i{transform:none!important;transition:none!important}
}
