:root{--bg:#07080a;--fg:#f4f4f5;--muted:#8b9098;--accent:#4b7bec;--line:rgb(244 244 245 / .14)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg);color:var(--fg)}
body{margin:0;min-height:100svh;background:var(--bg);color:var(--fg);font-family:"Google Sans",system-ui,sans-serif;font-size:1rem;line-height:1.5}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
a{color:inherit;text-decoration:none}
::selection{background:var(--accent);color:var(--bg)}
.display{font-weight:500;letter-spacing:-.035em;line-height:.95}
.hero-title{font-size:clamp(3rem,8vw,5rem);margin:.75rem 0 0}
.wordmark{letter-spacing:.22em;font-size:.875rem}
.kicker,.nav-link,.index,.lang button{letter-spacing:.14em;text-transform:uppercase}
.kicker{font-size:.75rem;color:var(--muted);margin:0}
.muted{color:var(--muted)}
.wrap{width:min(72rem,100%);margin:0 auto;padding:0 1.25rem}
@media(min-width:768px){.wrap{padding:0 2.5rem}}
header{position:fixed;inset:0 0 auto 0;z-index:30;height:auto;border-bottom:1px solid var(--line);background:rgb(7 8 10 / .8);backdrop-filter:blur(12px)}
.topbar{display:flex;align-items:center;justify-content:space-between;height:3.5rem}
.desk{display:none;align-items:center;gap:1.5rem}
@media(min-width:768px){.desk{display:flex}.nav-toggle,.mobile-panel{display:none!important}}
@media(min-width:768px){.topbar{position:relative;justify-content:center}.wordmark{position:absolute;left:2.5rem}.desk .lang{position:absolute;right:2.5rem}}
.nav-link{font-size:.75rem;color:var(--muted);padding:.75rem 0}
.nav-link:hover,.lang button.on{color:var(--accent)}
.lang{display:flex;gap:.25rem;font-size:.75rem}
.lang button{color:var(--muted);min-width:2.75rem;min-height:2.75rem}
@media(min-width:768px){.lang button{min-width:2rem;min-height:2rem}}
.nav-toggle{display:grid;width:2.75rem;height:2.75rem;place-items:center}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{display:block;width:1.25rem;height:1px;background:var(--fg);position:relative;transition:transform .28s ease,background .2s ease}
.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:0}
.nav-toggle span::before{top:-6px}
.nav-toggle span::after{top:6px}
.nav-toggle.open span{background:transparent}
.nav-toggle.open span::before{top:0;transform:rotate(45deg)}
.nav-toggle.open span::after{top:0;transform:rotate(-45deg)}
.mobile-panel{position:fixed;z-index:20;inset:3.5rem 0 0;display:flex;flex-direction:column;justify-content:space-between;padding:2.5rem 1.5rem 2rem;background:var(--bg);opacity:0;visibility:hidden;transition:opacity .28s ease,visibility .28s ease}
.mobile-panel.open{opacity:1;visibility:visible}
.sheet-link{display:block;width:100%;padding:1.05rem 0;border-bottom:1px solid var(--line);font-size:clamp(2rem,9vw,2.75rem);font-weight:500;letter-spacing:-.035em;text-align:left}
.hero{display:flex;align-items:center;padding:7.5rem 0 3.5rem}
.line{max-width:36rem;margin:2rem 0 0;font-size:1.125rem;color:var(--muted)}
@media(min-width:768px){.line{font-size:1.25rem}}
.cta{display:inline-flex;align-items:center;min-height:2.75rem;margin-top:2.5rem;padding:0 1.5rem;border:1px solid rgb(244 244 245 / .8);font-size:.875rem}
.cta:hover{border-color:var(--accent);color:var(--accent)}
a.go{display:inline-block;margin-top:1.75rem;border-bottom:1px solid var(--accent);padding-bottom:.15rem}
a.go:hover{color:var(--accent)}
section.block{border-top:1px solid var(--line);padding:6rem 0}
@media(min-width:768px){section.block{padding:8rem 0}}
h2.display{font-size:clamp(3rem,6vw,4.5rem);margin:0}
.split{display:grid;gap:3rem}
@media(min-width:768px){.split{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:5rem}}
.svc{display:block;width:100%;border-top:1px solid var(--line);padding:1.25rem 0;text-align:left}
.svc:last-child{border-bottom:1px solid var(--line)}
.svc .row{display:flex;gap:1rem;align-items:baseline}
.svc .title{color:var(--muted)}
.svc.on .title{color:var(--fg)}
.index{margin-right:1rem;font-size:.75rem;color:var(--accent)}
.svc .desc{display:none;max-width:32rem;margin:.75rem 0 0 2.5rem;font-size:.875rem;color:var(--muted)}
.svc.on .desc{display:block}
.certs{display:grid;margin:2.5rem 0 0;padding:0;max-width:48rem;list-style:none;color:var(--muted)}
@media(min-width:768px){.certs{grid-template-columns:1fr 1fr;column-gap:3rem}}
.certs li{display:flex;align-items:center;gap:.85rem;padding:.7rem 0;border-top:1px solid var(--line)}
.certs .badge{width:3rem;height:3rem;flex:none}
.brand{display:inline-flex;align-items:center;gap:1rem}
.brand:hover{color:var(--accent)}
.mark{width:1.15rem;height:1.15rem;flex:none}
.mark-lg{width:2.4rem;height:2.4rem}
.mark-spacexai{width:3.4rem;height:auto}
footer .mark-spacexai{width:2.4rem}
.mark-bitpanda{width:1.7rem;height:1.7rem}
.mark-typesafe{width:.8rem}
.trade-powered{justify-content:flex-start;margin-top:.75rem}
.contact{text-align:center}
.contact h2{font-size:clamp(3rem,6vw,4.5rem)}
.links{width:min(32rem,100%);margin:2.5rem auto 0;padding:0;text-align:left}
.links li{list-style:none;border-top:1px solid var(--line)}
.links li:last-child{border-bottom:1px solid var(--line)}
.links a,.links .row{display:flex;min-height:3.5rem;align-items:center;justify-content:space-between;gap:1rem}
.links a:hover{color:var(--accent)}
.links .val{color:var(--muted)}
.links .ch{display:inline-flex;align-items:center;gap:.75rem}
footer{border-top:1px solid var(--line);padding:2.5rem 1.25rem;text-align:center;color:var(--muted);font-size:.875rem}
.powered{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem 2rem;margin-top:1.25rem}
.powered a{display:inline-flex;align-items:center;gap:.5rem;color:var(--fg)}
.powered a:hover{color:var(--accent)}
.held{display:none!important}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* utilities: replace former inline style="" attributes (blocked by a strict CSP); !important keeps inline-style precedence */
.u-muted{color:var(--muted) !important}.u-plain{text-transform:none !important;letter-spacing:.02em !important}.u-mt1{margin-top:1rem !important}.u-mt2{margin-top:2rem !important}.u-lead{font-size:1.125rem !important}.u-pair{margin-top:.5rem !important;font-size:.875rem !important;letter-spacing:.14em !important}.u-hint{max-width:16rem !important;margin-top:1.5rem !important}

/* hero chip with status dot */
.chip{display:inline-flex;align-items:center;gap:.55rem;margin:0;padding:.4rem .95rem;border:1px solid var(--line);border-radius:999px;background:rgb(244 244 245 / .04);font-size:.8rem;font-weight:500;color:var(--muted);white-space:pre}
.hero-title+.chip{margin-top:1.5rem}
.dot{width:.45rem;height:.45rem;border-radius:50%;background:#34d399;box-shadow:0 0 0 4px rgb(52 211 153 / .18)}

/* certificates: badge cards (from the redesign preview) */
.certs.ct-grid{max-width:none;margin-top:3.5rem;gap:.75rem;grid-template-columns:1fr;color:var(--fg)}
@media(min-width:600px){.certs.ct-grid{grid-template-columns:1fr 1fr}}
@media(min-width:960px){.certs.ct-grid{grid-template-columns:repeat(5,1fr)}}
.ct-grid li{padding:1rem;border:1px solid var(--line);border-radius:1.15rem;background:rgb(244 244 245 / .025);font-size:.9rem;line-height:1.35;transition:border-color .2s,transform .2s}
.ct-grid li:hover{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 8px 28px -10px rgb(75 123 236 / .6);transform:translateY(-2px)}
/* trading bot: coin list, blue glow on hover like the certificate tiles */
.coin{display:inline-block;transition:color .2s,text-shadow .2s,transform .2s}
.coin:hover{color:var(--accent);text-shadow:0 0 14px rgb(75 123 236 / .75);transform:translateY(-2px)}
@media(min-width:960px){.ct-grid li{flex-direction:column;align-items:flex-start;padding:1.25rem}.ct-grid .badge{width:3.5rem;height:3.5rem}}

/* Redact: centred head, numbered cards, pill button, redaction bar */
.rd-head{max-width:40rem;margin:0 auto;text-align:center}
.rd-head .u-lead{margin:1.5rem auto 0}
.redacted{position:relative;display:inline-block}
.redacted::after{content:"";position:absolute;left:-.04em;right:-.06em;top:.1em;bottom:.02em;background:var(--fg);border-radius:.06em;transform:scaleX(0);transform-origin:left;animation:redact 7s ease-in-out infinite}
@keyframes redact{0%,55%{transform:scaleX(0);transform-origin:left}68%{transform:scaleX(1);transform-origin:left}78%{transform:scaleX(1);transform-origin:right}90%,100%{transform:scaleX(0);transform-origin:right}}
.rd-grid{display:grid;gap:1rem;margin-top:3rem}
@media(min-width:768px){.rd-grid{grid-template-columns:1fr 1fr}}
.point{padding:2rem;border:1px solid var(--line);border-radius:1.5rem;background:linear-gradient(180deg,rgb(244 244 245 / .045),rgb(244 244 245 / .015))}
.point .num{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:.75rem;background:linear-gradient(135deg,#3fa9ff,var(--accent));font-weight:600;font-size:.9rem;color:#fff}
.point .title{margin:1.25rem 0 0;font-size:1.25rem;font-weight:500;letter-spacing:-.02em;line-height:1.3;color:var(--fg)}
.point .muted{margin:.6rem 0 0}
.rd-cta{margin-top:.75rem;text-align:center}

/* footer: "Powered by" as a moving band. One set of logos spans at least the full
   viewport width (6 x 30vw), so the copy needed for the loop never shows a company twice at once. */
.ticker{margin-top:1.25rem;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.ticker-track{display:flex;width:max-content;animation:slide 42s linear infinite}
.ticker-track a{flex:0 0 max(30vw,11rem);display:inline-flex;justify-content:center;align-items:center;gap:.5rem;color:var(--fg);white-space:nowrap}
.ticker-track a:hover{color:var(--accent)}
.ticker:hover .ticker-track{animation-play-state:paused}
@keyframes slide{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.ticker-track,.redacted::after{animation:none}}
/* Affiliate disclosure: directly in the link, same size, never truncated */
.ad-note{font-size:inherit;color:var(--fg);white-space:normal;overflow:visible}
.ad-fixed{margin:1.5rem auto 0;max-width:40rem;padding:0 1.25rem}
.ad-fixed a{display:inline-flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.25rem .5rem;color:var(--fg)}
.ad-fixed a:hover{color:var(--accent)}