/* Inspire Acquire · site styles
   Foundation: https://claude.ai/artifact/3oJrZdtKYggva2ZyDPyDGd
   Palette, type, and motion tokens live here. Components are still open. */

:root{
  --void:#0a0c10; --graphite:#14171c; --gunmetal:#2a2f36; --silver:#c5cdd6;
  --ink:#e4e9ef; --mist:#8d97a3; --signal:#2f86ff; --signal-deep:#1a5fd0;
  --paper:#f4f6f8; --slate:#4f5a66;
  --line:#1f252e; --line-2:#2c343f; --soft:#b8c0c9;
  --ease:cubic-bezier(.2,.7,.2,1); --t-fast:180ms; --t-reveal:600ms; --t-story:1200ms;
  --wrap:1200px; --gutter:20px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{background:var(--void)}
body{margin:0;background:var(--void);color:var(--ink);font:17px/1.6 Geist,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit}
.page{position:relative;z-index:1}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:var(--gutter)}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--void);padding:10px 14px;border-radius:4px;z-index:50}
.skip:focus{left:12px}
:focus-visible{outline:2px solid var(--signal);outline-offset:3px}

/* type */
.lab{font:500 11px/1.2 "Geist Mono",ui-monospace,monospace;letter-spacing:.18em;text-transform:uppercase;color:#a3adb8}
.eyeb{font:500 11px/1 "Geist Mono",monospace;letter-spacing:.3em;text-transform:uppercase;color:var(--signal);display:flex;align-items:center;gap:12px}
.eyeb::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--signal);box-shadow:0 0 12px var(--signal)}
.display{font-weight:250;font-size:clamp(44px,7vw,88px);line-height:1;letter-spacing:-.035em;margin:22px 0;text-wrap:balance}
h2.h{font:300 clamp(32px,4.4vw,56px)/1.04 Geist,sans-serif;letter-spacing:-.03em;margin:14px 0;max-width:20ch;text-wrap:balance}
h3{font:500 18px/1.3 Geist,sans-serif;margin:0 0 8px}
p{margin:0 0 12px;max-width:62ch}
.lead{font-size:clamp(18px,1.6vw,21px);font-weight:300;color:var(--soft);max-width:52ch}
.sub{color:var(--soft);font-size:18px;max-width:58ch;margin-bottom:34px}
.mono{font-family:"Geist Mono",monospace}

/* nav */
.nav{position:sticky;top:0;z-index:20;background:rgba(10,12,16,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:border-color var(--t-fast) var(--ease)}
.nav.scrolled{border-bottom-color:var(--line)}
.nav .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;height:72px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand span{font:500 12px/1 Geist,sans-serif;letter-spacing:.38em;text-transform:uppercase;color:var(--silver);white-space:nowrap}
.links{display:flex;gap:28px;font-size:14px}
.links a{color:#9aa4b0;text-decoration:none;transition:color var(--t-fast) var(--ease)}
.links a:hover,.links a[aria-current="page"]{color:var(--ink)}
.nav .cta{font-size:13px;padding:10px 14px}
.menu-btn{display:none;background:none;border:1px solid var(--line-2);color:var(--ink);border-radius:5px;padding:9px 12px;font-size:13px;cursor:pointer}
@media (max-width:860px){
  .links{display:none}.nav .cta{display:none}.menu-btn{display:block}
  .nav.open .links{display:flex;flex-direction:column;gap:0;position:absolute;left:0;right:0;top:72px;background:var(--void);border-bottom:1px solid var(--line);padding:8px var(--gutter) 18px}
  .nav.open .links a{padding:14px 0;font-size:17px;border-bottom:1px solid var(--line)}
}

/* buttons */
.btn{display:inline-block;font:500 15px/1 Geist,sans-serif;padding:14px 20px;border-radius:5px;white-space:nowrap;text-decoration:none;cursor:pointer;border:1px solid transparent;transition:background var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease),color var(--t-fast) var(--ease)}
.btn.p{background:var(--ink);color:var(--void)}
.btn.p:hover{background:#fff}
.btn.g{border-color:#333c48;color:var(--ink)}
.btn.g:hover{border-color:#56606b}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}

/* sections and panels */
section.s{padding-block:112px 0}
.band{margin-top:112px;border-block:1px solid var(--line);background:linear-gradient(180deg,rgba(14,18,24,.55),rgba(10,12,16,0))}
.band > .wrap{padding-block:88px 80px}
.panel{background:var(--graphite);border:1px solid var(--line);border-radius:16px;padding:28px}
.panel.us{border-color:#274a7a;background:linear-gradient(180deg,#0f1826,var(--graphite))}
.panel ul{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:14px}
.panel li{display:grid;grid-template-columns:20px 1fr;gap:12px;color:#d3dae1;font-size:17px;line-height:1.45}
.panel li::before{content:"";width:8px;height:8px;border-radius:2px;background:#3a4452;margin-top:8px}
.panel.us li::before{background:var(--signal)}
.panel.you li::before{background:var(--silver)}
.panel li small{display:block;color:var(--mist);font-size:14px;margin-top:2px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media (max-width:900px){.grid2,.grid3{grid-template-columns:1fr}}
.field-bg{position:relative}
.field-bg::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#1c232d 1px,transparent 1px);background-size:22px 22px;opacity:.6;pointer-events:none;-webkit-mask-image:radial-gradient(60% 80% at 75% 30%,#000,transparent 75%);mask-image:radial-gradient(60% 80% at 75% 30%,#000,transparent 75%)}
.field-bg > *{position:relative}
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.facts div{background:var(--graphite);padding:22px}
.facts .k{font:500 11px/1.3 "Geist Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--mist)}
.facts .v{font:300 24px/1.15 Geist,sans-serif;margin-top:10px;letter-spacing:-.01em}
@media (max-width:860px){.facts{grid-template-columns:repeat(2,minmax(0,1fr))}.facts div{padding:16px}.facts .v{font-size:19px}}

/* page hero (inner pages) */
.phero{padding-block:72px 8px}

/* closing call to action */
.close{margin-top:120px;border-top:1px solid var(--line);background:radial-gradient(50% 90% at 50% 100%,#0f1a2a,transparent 70%);padding:104px var(--gutter) 116px;text-align:center}
.close h2.h{margin:16px auto}
.close p{margin:0 auto 28px;color:var(--soft)}

/* footer */
.foot{border-top:1px solid var(--line);padding:44px 0 56px;font-size:14px;color:var(--mist)}
.foot .wrap{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:28px}
.foot a{color:#aab3bd;text-decoration:none}.foot a:hover{color:var(--ink)}
.foot ul{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}
.foot .fine{grid-column:1/-1;border-top:1px solid var(--line);padding-top:20px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font:500 11px/1.4 "Geist Mono",monospace;letter-spacing:.12em;text-transform:uppercase}
@media (max-width:700px){.foot .wrap{grid-template-columns:1fr}}

/* attention layer */
#attn{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}

/* reveal */
[data-in]{opacity:1;transform:none;transition:opacity var(--t-reveal) var(--ease),transform var(--t-reveal) var(--ease)}
.js [data-in]:not(.seen){opacity:.001;transform:translateY(14px)}
@media (prefers-reduced-motion:reduce){.js [data-in]:not(.seen){opacity:1;transform:none}}

/* ---------- goal explorer ---------- */
.ctrl{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;margin-bottom:28px}
.tabs{display:flex;flex-wrap:wrap;gap:10px}
.tabs button,.pbtn{font:500 15px/1 Geist,sans-serif;color:#c9d1da;background:#10141a;border:1px solid #333c48;border-radius:999px;padding:13px 18px;cursor:pointer;transition:color var(--t-fast),border-color var(--t-fast),background var(--t-fast)}
.tabs button:hover,.pbtn:hover{border-color:#56606b;color:#fff}
.tabs button[aria-selected="true"]{color:var(--void);background:var(--ink);border-color:var(--ink)}
.play{display:flex;gap:8px;align-items:center}
.pbtn.icon{padding:13px 15px}
.pbtn[aria-pressed="true"]{border-color:var(--signal);color:#fff}
.flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:34px;position:relative}
.flow li{position:relative;display:flex}
.flow li:not(:last-child)::after{content:"";position:absolute;top:50%;right:-31px;width:28px;height:2px;background:#333c48;transition:background .35s}
.flow li:not(:last-child)::before{content:"";position:absolute;top:calc(50% - 5px);right:-32px;border-left:7px solid #333c48;border-top:6px solid transparent;border-bottom:6px solid transparent;transition:border-color .35s}
.flow li.lit::after{background:var(--signal)}.flow li.lit::before{border-left-color:var(--signal)}
.st{flex:1;text-align:left;background:#0f1319;border:1px solid var(--line-2);border-radius:12px;padding:18px 18px 16px;cursor:pointer;display:grid;gap:6px;color:inherit;transition:border-color .3s,background .3s}
.st:hover{border-color:#48525e}
.st .num{font:500 12px/1 "Geist Mono",monospace;letter-spacing:.14em;color:#7d8793}
.st .nm{font:400 21px/1.15 Geist,sans-serif;color:var(--ink);letter-spacing:-.01em}
.st .role{font-size:14px;color:#a3adb8;line-height:1.35}
.st[aria-current="step"]{border-color:var(--signal);background:#0f1a2a;box-shadow:0 0 0 1px rgba(47,134,255,.25),0 10px 30px rgba(15,70,170,.18)}
.st[aria-current="step"] .num{color:var(--signal)}
.st.done{border-color:#34506f}
.ret{position:relative;margin:14px 10% 0;height:34px;border:2px dashed #333c48;border-top:0;border-radius:0 0 14px 14px;transition:border-color .35s}
.ret::before{content:"";position:absolute;left:-8px;top:-8px;border-bottom:9px solid #333c48;border-left:7px solid transparent;border-right:7px solid transparent;transition:border-color .35s}
.ret span{position:absolute;left:50%;bottom:-11px;transform:translateX(-50%);background:var(--void);padding:0 12px;font:500 12px/1.4 "Geist Mono",monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--mist);white-space:nowrap;transition:color .35s}
.ret.lit{border-color:var(--signal)}.ret.lit::before{border-bottom-color:var(--signal)}.ret.lit span{color:#9cc4ff}
.xpanel{margin-top:40px;display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.35fr);gap:22px}
@media (max-width:900px){.xpanel{grid-template-columns:1fr}}
.info,.out{background:#0c0f14;border:1px solid var(--line);border-radius:16px;padding:30px}
.info{display:flex;flex-direction:column;gap:22px}
.info .step{font:500 12px/1 "Geist Mono",monospace;letter-spacing:.18em;text-transform:uppercase;color:var(--signal)}
.info h3{font:300 clamp(28px,3vw,36px)/1.08 Geist,sans-serif;letter-spacing:-.02em;margin:0;color:#eef2f6}
.info .blk{display:grid;gap:8px}
.info .blk .k{font:500 11px/1 "Geist Mono",monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--mist)}
.info .blk p{margin:0;color:#d3dae1;font-size:18px;line-height:1.5}
.info .hand{margin-top:auto;padding-top:18px;border-top:1px solid var(--line);font-size:16px;color:var(--soft);display:flex;gap:12px;align-items:flex-start}
.info .hand svg{flex:none;margin-top:3px}
.out{display:flex;flex-direction:column;gap:16px}
.out .ohead{display:flex;justify-content:space-between;gap:12px;font:500 11px/1.3 "Geist Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--mist)}
.art{flex:1;min-height:540px;border-radius:12px;overflow:hidden;position:relative}
.xfoot{margin-top:18px;font:500 11px/1.4 "Geist Mono",monospace;letter-spacing:.12em;text-transform:uppercase;color:#6f7984}
.brief{background:#10141a;border:1px solid #232a33;height:100%;padding:26px;display:grid;gap:18px;align-content:start}
.brief .k{font:500 11px/1 "Geist Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:#7d8793;margin-bottom:8px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips span{font-size:14px;color:#dfe5ec;border:1px solid #333c48;border-radius:999px;padding:6px 12px}
.brief .msg{font:300 26px/1.2 Geist,sans-serif;color:#eef2f6;letter-spacing:-.01em}
.poster{height:100%;min-height:540px;padding:40px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.poster .brand-x{font:600 13px/1 Geist,sans-serif;letter-spacing:.2em;text-transform:uppercase;position:relative}
.poster .hl{font-weight:600;letter-spacing:-.035em;line-height:.95;position:relative}
.poster .sm{font-size:18px;position:relative;max-width:30ch}
.p-launch{background:radial-gradient(90% 70% at 85% 20%,#ff8a2b 0%,#b43d0a 28%,#1a0b05 62%,#0c0604 100%);color:#fff4ea}
.p-launch::after{content:"";position:absolute;inset:0;background:repeating-radial-gradient(circle at 85% 20%,transparent 0 38px,rgba(255,200,150,.09) 39px 40px);pointer-events:none}
.p-launch .hl{font-size:clamp(52px,7vw,104px)}
.p-event{background:linear-gradient(160deg,#0a3f3a 0%,#062522 45%,#030d0c 100%);color:#e6fff9}
.p-event::after{content:"";position:absolute;right:-60px;top:40px;width:320px;height:320px;border:1.5px solid rgba(120,255,220,.35);border-radius:50%;box-shadow:0 0 0 30px rgba(120,255,220,.05),0 0 0 62px rgba(120,255,220,.035)}
.p-event .hl{font-size:clamp(44px,6vw,86px);max-width:11ch}
.p-hire{background:#efe9df;color:#16130f}
.p-hire::after{content:"";position:absolute;left:30px;right:30px;top:52%;height:6px;background:#d6341f}
.p-hire .hl{font-size:clamp(48px,6.4vw,96px);max-width:9ch}
.feed{background:#f3f4f6;color:#15181c;height:100%;padding:18px;display:grid;gap:12px;align-content:start}
.feed .who{display:flex;gap:10px;align-items:center;font-size:14px}
.feed .av{width:36px;height:36px;border-radius:8px;background:#15181c;color:#fff;display:grid;place-items:center;font:600 13px/1 Geist,sans-serif}
.feed .who small{display:block;color:#6b7280;font-size:12px}
.feed .cap{font-size:15px;line-height:1.45}
.feed .mini{border-radius:8px;overflow:hidden;height:340px}
.feed .mini .poster{min-height:340px;padding:24px}
.feed .mini .hl{font-size:52px!important}
.feed .tgt{display:flex;flex-wrap:wrap;gap:6px}
.feed .tgt span{font:500 11px/1 "Geist Mono",monospace;letter-spacing:.06em;background:#e3e7ec;color:#374151;border-radius:4px;padding:6px 8px}
.mail{background:#10141a;border:1px solid #232a33;height:100%;padding:24px;display:grid;gap:14px;align-content:start}
.mail .subj{font:400 20px/1.3 Geist,sans-serif;color:#eef2f6}
.mail .line{display:grid;grid-template-columns:86px 1fr;gap:12px;font-size:15px;color:#c9d1da;padding:10px 0;border-top:1px solid #1f252e}
.mail .line b{font:500 11px/1.6 "Geist Mono",monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--signal);font-weight:500}
.scorex{background:#10141a;border:1px solid #232a33;height:100%;padding:24px;display:grid;gap:4px;align-content:start}
.scorex .row{display:grid;grid-template-columns:1fr 120px;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #1f252e;font-size:16px;color:#d3dae1}
.scorex .row i{font-style:normal;border:1px dashed #3a4452;border-radius:6px;height:30px;display:grid;place-items:center;font:500 10px/1 "Geist Mono",monospace;letter-spacing:.12em;text-transform:uppercase;color:#6f7984}
.scorex .note{margin-top:10px;font-size:13px;color:var(--mist)}
@media (max-width:760px){
  .flow{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px var(--gutter) 10px;margin:0 calc(var(--gutter) * -1);scrollbar-width:none}
  .flow::-webkit-scrollbar{display:none}
  .flow li{flex:0 0 58%;scroll-snap-align:center}
  .flow li:not(:last-child)::after{right:-20px;width:18px}
  .flow li:not(:last-child)::before{right:-21px}
  .st{padding:14px 14px 12px}.st .nm{font-size:19px}.st .role{font-size:13px}
  .ret{margin:12px 8% 0;height:22px}.ret span{font-size:11px}
  .ctrl{flex-direction:column;align-items:stretch}
  .tabs{flex-wrap:nowrap;overflow-x:auto;margin:0 calc(var(--gutter) * -1);padding:0 var(--gutter);scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tabs button{white-space:nowrap;flex:none}
  .xpanel{margin-top:30px}.info,.out{padding:22px}.info .blk p{font-size:17px}
  .art{min-height:300px}.poster{min-height:460px;padding:28px}
  .feed .mini{height:300px}.feed .mini .poster{min-height:300px}.feed .mini .sm{display:none}
}
.handoffs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
@media (max-width:860px){.handoffs{grid-template-columns:1fr;gap:18px}}
.handoffs p{color:var(--soft);font-size:19px;margin:0}
/* explorer: goal cards + scroll-driven walkthrough */
.band > .wrap.xhead{padding-block:88px 30px}
.xscroll{padding-bottom:80px}
.gtop{display:flex;align-items:center;gap:16px;margin-bottom:12px}
.ghint{font-size:14px;color:var(--mist)}
.gskip{margin-left:auto;font:500 13px/1 Geist,sans-serif;color:#aab3bd;background:none;border:1px solid #333c48;border-radius:999px;padding:9px 14px;cursor:pointer}
.gskip:hover{color:#fff;border-color:#56606b}
.goals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:24px}
.goal{text-align:left;background:#0f1319;border:1px solid var(--line-2);border-radius:14px;padding:16px 18px 14px;cursor:pointer;color:inherit;font:inherit;display:grid;gap:6px;transition:border-color .3s,background .3s}
.goal:hover{border-color:#48525e}
.goal .gk{font:500 11px/1 "Geist Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:#7d8793}
.goal .gn{font:400 clamp(17px,1.6vw,21px)/1.2 Geist,sans-serif;color:#c9d1da;letter-spacing:-.01em}
.goal .gbar{height:3px;background:#1f252e;border-radius:2px;margin-top:8px;overflow:hidden}
.goal .gbar i{display:block;height:100%;width:0;background:var(--signal);transition:width .45s var(--ease)}
.goal[aria-selected="true"]{border-color:var(--signal);background:#0f1a2a;box-shadow:0 0 0 1px rgba(47,134,255,.25)}
.goal[aria-selected="true"] .gk{color:var(--signal)}
.goal[aria-selected="true"] .gn{color:var(--ink)}
.goal.done .gbar i{width:100%;background:#34506f}
@media (max-width:760px){.goals{grid-template-columns:1fr;gap:8px}.goal{padding:12px 14px}.goal .gbar{margin-top:4px}.gskip,.ghint{display:none}}
/* pinned mode (desktop): the section holds still while scrolling advances it */
.xscroll.pin{padding-bottom:0}
.xscroll.pin .xsticky{position:sticky;top:var(--navh,76px);height:calc(100vh - var(--navh,76px));display:flex}
.xscroll.pin .xsticky > .wrap{display:flex;flex-direction:column;width:100%;padding-block:16px 18px}
.xscroll.pin .goals{margin-bottom:18px}
.xscroll.pin .st{padding:13px 16px 11px}.xscroll.pin .st .nm{font-size:19px}.xscroll.pin .st .role{font-size:13px}
.xscroll.pin .ret{margin-top:10px;height:22px}
.xscroll.pin .xpanel{flex:1;min-height:0;margin-top:24px}
.xscroll.pin .info,.xscroll.pin .out{min-height:0;overflow:hidden;padding:22px 24px}
.xscroll.pin .info{gap:14px}
.xscroll.pin .info h3{font-size:clamp(24px,2.2vw,30px)}
.xscroll.pin .info .blk p{font-size:16px}
.xscroll.pin .info .hand{padding-top:12px;font-size:15px}
.xscroll.pin .art{min-height:0}
.xscroll.pin .poster{min-height:0;height:100%;padding:28px}
.xscroll.pin .p-launch .hl{font-size:clamp(40px,4.4vw,70px)}
.xscroll.pin .p-event .hl,.xscroll.pin .p-hire .hl{font-size:clamp(36px,4vw,62px)}
.xscroll.pin .feed{display:flex;flex-direction:column;height:100%}
.xscroll.pin .feed .mini{flex:1;min-height:0;height:auto}
.xscroll.pin .feed .mini .poster{min-height:0}
.xscroll.pin .feed .mini .hl{font-size:clamp(30px,3vw,44px)!important}
.xscroll.pin .xfoot{margin-top:12px}
.xscroll.pin .feed .mini .sm{font-size:14px}
/* home: the attention statement between the hero and the handoffs */
.stmt{text-align:center}
.stmt .h{display:inline-block;max-width:none;margin:0 auto 18px;padding:6px 10px}
.stmt p{max-width:46ch;margin:0 auto;color:var(--soft);font-size:clamp(18px,1.6vw,21px);font-weight:300}
