@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:'Space Grotesk','Inter',"SF Pro Display",system-ui,sans-serif;background:#0a0a0b;color:#e5e5e7;line-height:1.55}
body::before{content:"";position:fixed;inset:0;background:radial-gradient(ellipse 80% 60% at 50% -20%,#B3571A 0%,transparent 50%);opacity:.18;pointer-events:none;z-index:0}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:18px 32px;background:rgba(20,20,22,.85);backdrop-filter:blur(12px);position:sticky;top:0;border-bottom:1px solid #232326}
.topbar .logo{font-weight:700;font-size:16px}
.topbar .links{display:flex;gap:20px}
.topbar a{color:#a1a1a6;text-decoration:none;font-size:14px}
.topbar a.active{color:#B3571A}
main{max-width:880px;margin:0 auto;padding:64px 24px}
.title{font-size:48px;font-weight:800;letter-spacing:-.03em;margin:0 0 12px;background:linear-gradient(120deg,#fff,#B3571A);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:18px;color:#a1a1a6;margin:0 0 48px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.tile{background:#17171a;border:1px solid #27272a;border-radius:16px;padding:24px}
.tile h3{margin:0 0 8px;font-size:14px;color:#a1a1a6;font-weight:500;text-transform:uppercase;letter-spacing:.06em}
.tile a{color:#B3571A;text-decoration:none}
.tile{transition:transform .25s ease,border-color .25s ease,box-shadow .3s ease}
.tile:hover{transform:translateY(-3px);border-color:#B3571A;box-shadow:0 0 0 1px #B3571A,0 12px 32px rgba(168,85,247,0.18)}
.contact-button{display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:13px 28px;background:#B3571A;color:#0a0a14;border-radius:14px;text-decoration:none;font-weight:600;transition:transform .15s ease,box-shadow .3s ease}
.contact-button:hover{transform:translateY(-2px);box-shadow:0 0 30px rgba(168,85,247,0.5);color:#0a0a14}
.contact-button .cb-arrow{transition:transform .25s}
.contact-button:hover .cb-arrow{transform:translateX(4px)}
/* Scroll reveal — fade + scale + glow */
.reveal{opacity:0;transform:translateY(50px) scale(.96);filter:blur(8px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1),filter .9s ease}
.reveal.in{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}
.about{background:#17171a;border:1px solid #27272a;border-radius:16px;padding:24px;margin-bottom:24px}
.about h3{margin:0 0 12px;font-size:18px;color:#fff}
.about p{color:#c7c7cc;margin:0 0 12px;line-height:1.6}
.about .features{list-style:none;padding:0;margin:12px 0 0}
.about .features li{padding:8px 0;color:#a1a1a6;border-top:1px solid #27272a}
.about .features li::before{content:"→ ";color:#B3571A;font-weight:600}
.prose h1{font-size:36px;margin:0 0 8px}
.prose h2{font-size:22px;margin:32px 0 10px;color:#B3571A}
.prose h3{font-size:16px;color:#c7c7cc;margin:20px 0 8px}
.prose a{color:#B3571A}
footer{text-align:center;padding:32px;color:#6e6e73;font-size:13px}

/* font-pair: techno */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;700&family=Inter:wght@400;500;600&display=swap');
:root{--asc-fh:'Space Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;--asc-fb:'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif}
body,p,li,td,span,a,button,input,textarea,.muted,nav,footer,.big-card span,.big-card-static span,.cb-label{font-family:var(--asc-fb)!important}
h1,h2,h3,h4,h5,h6,strong,.hero h1,.prose h1,.prose h2,.prose h3,.big-card strong,.big-card-static strong{font-family:var(--asc-fh)!important}