/* Blochpoint site styles */
:root{--ink:#18212E;--night:#111A33;--paper:#EEF1F4;--accent:#2A45C9;--point:#E3A21A;--steel:#566170;--rule:#C9D0D9}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Source Serif 4",Georgia,"Times New Roman",serif;-webkit-font-smoothing:antialiased}
a{color:var(--accent)}a:hover{color:#1C2F94}
a:focus-visible,button:focus-visible,input:focus-visible,svg:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.bp-dark a:focus-visible,.bp-dark button:focus-visible,.bp-dark svg:focus-visible{outline-color:#FFFFFF}
.sans{font-family:"Bricolage Grotesque","Helvetica Neue",Arial,sans-serif}

@keyframes bpFadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes bpMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes bpPulse{0%,100%{box-shadow:0 0 0 0 rgba(61,91,255,.55),0 0 28px rgba(61,91,255,.45)}50%{box-shadow:0 0 0 8px rgba(61,91,255,0),0 0 40px rgba(61,91,255,.6)}}
.bp-marquee:hover .bp-track{animation-play-state:paused}
.svc-row{transition:background 250ms ease,padding 250ms ease}
.svc-row:hover{background:#FFFFFF !important;padding-left:24px !important;padding-right:24px !important}
.lane-col{transition:transform 250ms ease}
.lane-col:hover{transform:translateY(-4px)}

/* Sphere */
.sphere-wrap{width:480px;max-width:100%;display:flex;flex-direction:column;align-items:center;gap:16px;color:#EEF1F4}
.sphere-wrap svg{width:100%;max-width:460px;height:auto;cursor:grab;touch-action:pan-y;border-radius:50%;overflow:visible}
.pill{min-height:44px;padding:0 18px;border-radius:999px;border:1.5px solid #56657F;background:transparent;color:#FFFFFF;font:600 15px "Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;cursor:pointer}
.pill[aria-pressed="true"]{background:#FFFFFF;border-color:#FFFFFF;color:var(--night)}
.ghost-dark{min-height:44px;padding:0 14px;border:1px solid #56657F;border-radius:6px;background:transparent;color:#FFFFFF;font:600 14px "Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;cursor:pointer}

/* Router */
.rt-grid{display:grid;grid-template-columns:minmax(0,400px) minmax(0,1fr);gap:56px}
.chip{min-height:44px;padding:0 16px;border-radius:6px;border:1.5px solid #9AA5B3;background:#FFFFFF;color:var(--ink);font:600 15px "Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#FFFFFF}
.rt-lanes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.lane{height:132px;padding:18px;border-radius:8px;border:1.5px solid var(--rule);background:#FFFFFF;color:var(--ink);display:flex;flex-direction:column;justify-content:space-between;transition:background 300ms ease,color 300ms ease,border-color 300ms ease}
.lane-name{font:700 19px "Bricolage Grotesque","Helvetica Neue",Arial,sans-serif}
.lane-hint{font-size:14px;line-height:1.4;color:var(--steel)}
.lane.is-on{background:var(--ink);border-color:var(--ink);color:#FFFFFF}
.lane.is-on .lane-hint{color:#C7D0DB}
.rt-token,.rt-halo{position:absolute;border-radius:50%;background:var(--point);transition:left 700ms cubic-bezier(.2,.8,.2,1)}
.rt-halo{top:2px;width:40px;height:40px;margin-left:-20px;opacity:.22}
.rt-token{top:12px;width:20px;height:20px;margin-left:-10px}
input[type="range"]{width:100%;min-height:44px;accent-color:var(--accent);cursor:pointer}

/* Assessment */
.assess{width:560px;max-width:100%;min-height:760px;padding:36px;border-radius:10px;background:#FFFFFF;border:1px solid var(--rule);display:flex;flex-direction:column}
.assess-inner{display:flex;flex-direction:column;gap:22px;flex:1}
.opt{min-height:52px;padding:12px 18px;text-align:left;border-radius:8px;border:1.5px solid var(--rule);background:#FFFFFF;color:var(--ink);font:400 17px "Source Serif 4",Georgia,serif;cursor:pointer;width:100%}
.opt[aria-pressed="true"]{border:2px solid var(--accent);background:#EEF1FB;font-weight:600}
.btn{min-height:48px;padding:0 22px;border-radius:6px;border:none;background:var(--accent);color:#FFFFFF;font:600 16px "Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;cursor:pointer}
.btn:disabled{background:#9AA5B3;cursor:not-allowed}
.btn-outline{min-height:48px;padding:0 20px;border-radius:6px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);font:600 16px "Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;cursor:pointer}
.btn-small{min-height:44px;padding:0 14px;border:1px solid #9AA5B3;border-radius:6px;background:transparent;color:var(--ink);font:600 14px "Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;cursor:pointer}
.bar{height:8px;border-radius:4px;background:#E1E6EC;overflow:hidden}
.bar>div{height:8px;border-radius:4px;width:0;transition:width 1000ms cubic-bezier(.2,.8,.2,1)}
.dial{transition:stroke-dashoffset 1100ms cubic-bezier(.2,.8,.2,1)}
.email-in{flex:1 1 auto;min-width:0;min-height:48px;padding:0 14px;border:1.5px solid #9AA5B3;border-radius:6px;font:16px "Source Serif 4",Georgia,serif;color:var(--ink)}

/* Ions and stats */
.ions{width:100%;max-width:560px;display:flex;flex-direction:column;gap:14px}
.ions svg{width:100%;height:auto}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.stat{padding:28px 32px 28px 0;border-top:1px solid #2E3B57;display:flex;flex-direction:column;gap:10px}
.stat-n{font:700 72px/1 "Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;letter-spacing:-.03em;color:#FFFFFF}
.stat-l{font-size:17px;line-height:1.5;color:#AEB9CC;max-width:22em}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Tablet and phone */
@media (max-width: 900px){
  .wrap{padding-left:24px !important;padding-right:24px !important}
  .g-stack{grid-template-columns:1fr !important;gap:28px !important}
  .rt-grid{grid-template-columns:1fr}
  .rt-lanes{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stats{grid-template-columns:1fr}
  .stat{padding:20px 0}
  .stat-n{font-size:56px}
  .lane-col{padding:20px 0 0 !important;border-left:0 !important;border-top:1px solid var(--rule)}
  h1{font-size:52px !important}
  h2{font-size:32px !important}
  .assess{padding:24px;min-height:0}
  nav a:not(.nav-cta){display:none !important}
}
@media (prefers-reduced-motion: reduce){*{transition:none !important;animation:none !important}html{scroll-behavior:auto}}
@media (max-width: 900px){.rt-track{display:none !important}.sphere-wrap{width:100%}}
.wrap > *{min-width:0}