*{margin:0;padding:0;box-sizing:border-box} :root{ --black:#050505;--void:#000;--carbon:#0a0a0a;--graphite:#121212; --red:#0017A3;--rg:rgba(0,23,163,0.35);--rdim:rgba(0,23,163,0.12);--rglow:rgba(0,23,163,0.04); --white:#ffffff;--silver:#f5f5f7;--gray:#86868b;--dark:#333336; } html{scroll-behavior:smooth;scroll-padding-top:90px;background:var(--void)} body{ font-family:'Inter',sans-serif;background:var(--void);color:var(--white); line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased; } .bg-grid{ position:fixed;inset:0;pointer-events:none;z-index:0; background-image:linear-gradient(rgba(0,23,163,0.02) 1px,transparent 1px),linear-gradient(90deg,rgba(0,23,163,0.02) 1px,transparent 1px); background-size:80px 80px; } .bg-gradient{ position:fixed;top:-50%;left:-20%;width:140%;height:140%; background:radial-gradient(circle at 50% 0%,rgba(0,23,163,0.05) 0%,transparent 50%); pointer-events:none;z-index:0; } .reveal{opacity:0;transform:translateY(30px);transition:opacity .7s ease,transform .7s ease;will-change:transform,opacity} .reveal.vis{opacity:1;transform:translateY(0)} .reveal-delay-1{transition-delay:.1s} .reveal-delay-2{transition-delay:.2s} .reveal-delay-3{transition-delay:.3s} @keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}} nav{ position:fixed;top:0;left:0;right:0;z-index:100; display:flex;justify-content:space-between;align-items:center; padding:20px 48px; background:rgba(0,0,0,0.8);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px); border-bottom:1px solid rgba(255,255,255,0.04);animation:fadeUp .6s ease both; } .brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:0.18em;font-size:0.85rem;color:var(--white);text-decoration:none} .brand svg{width:16px;height:16px;fill:var(--white);transition:fill 0.3s} .brand:hover svg{fill:var(--red)} .nav-links{display:flex;align-items:center;gap:2.5rem;list-style:none} .nav-links a{ font-family:'JetBrains Mono',monospace;font-size:0.65rem;font-weight:400;letter-spacing:0.12em;text-transform:uppercase; color:var(--gray);text-decoration:none;transition:color .25s; } .nav-links a:hover{color:var(--white)} .nav-cta{ font-family:'Inter',sans-serif;font-size:0.65rem;font-weight:700;letter-spacing:0.1em; text-transform:uppercase;padding:10px 24px; background:transparent;color:var(--white);border:1px solid var(--white);cursor:pointer;border-radius:100px; transition:all .3s; } .nav-cta:hover{background:var(--white);color:var(--void)} section{position:relative;z-index:1} .sec{padding:120px 48px;max-width:1300px;margin:0 auto} .ey{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:0.25em;text-transform:uppercase;color:var(--red);margin-bottom:12px;display:flex;align-items:center;gap:10px} .ey::before{content:'//';color:var(--dark)} .sh{font-size:clamp(1.8rem,4.5vw,3.2rem);font-weight:800;letter-spacing:-0.03em;margin-bottom:16px;line-height:1.1;text-transform:uppercase} .sh em{font-style:normal;color:var(--red);font-weight:700} .ss{font-size:0.95rem;color:var(--gray);line-height:1.7;max-width:600px;margin-bottom:56px} #hero{padding:140px 48px 80px;max-width:1100px;margin:0 auto;text-align:center} .h-badge{ display:inline-flex;align-items:center;gap:6px; background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.08); padding:4px 12px 4px 8px;border-radius:2px;font-family:'JetBrains Mono',monospace; font-size:0.65rem;font-weight:400;color:var(--silver);margin-bottom:24px;letter-spacing:0.1em; } .h-badge-dot{width:4px;height:4px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red);animation:pulse 2s ease-in-out infinite} @keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}} h1{font-size:clamp(1.1rem,2.8vw,1.8rem);font-weight:800;line-height:1.15;letter-spacing:-0.02em;margin-bottom:1.25rem;text-transform:uppercase;overflow-wrap:break-word;word-break:break-word} h1 em{font-style:normal;color:var(--red)} .h-sub{font-size:0.9rem;color:var(--gray);line-height:1.6;max-width:640px;margin:0 auto 2rem} .h-sub strong{color:var(--white);font-weight:700} .h-acts{display:flex;align-items:center;justify-content:center;gap:1.5rem;flex-wrap:wrap} .btn-p{ font-family:'Inter',sans-serif;font-size:0.65rem;font-weight:700;letter-spacing:0.08em; padding:12px 28px;background:var(--red);color:var(--white);border:none; cursor:pointer;border-radius:100px;transition:all .25s;text-transform:uppercase; text-decoration:none;display:inline-flex;align-items:center;gap:6px; } .btn-p:hover{background:var(--white);color:var(--void);transform:translateY(-1px)} .btn-g{ font-family:'Inter',sans-serif;font-size:0.65rem;font-weight:700;letter-spacing:0.08em; padding:11px 28px;background:transparent;color:var(--white);text-transform:uppercase; border:1px solid rgba(255,255,255,0.15);cursor:pointer;border-radius:100px; transition:all .25s;text-decoration:none;display:inline-flex;align-items:center;gap:6px; } .btn-g:hover{background:var(--white);color:var(--void);border-color:var(--white)} footer{padding:60px 48px;text-align:center;border-top:1px solid rgba(255,255,255,0.04);position:relative;z-index:1;background:var(--void)} .footer-brand{font-size:0.75rem;font-weight:700;letter-spacing:0.2em;margin-bottom:12px;color:var(--gray)} .footer-brand span{color:var(--red)} .footer-note{font-family:'JetBrains Mono',monospace;font-size:0.7rem;letter-spacing:0.15em;color:var(--dark);text-transform:uppercase} .hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px;background:none;border:none} .hamburger span{display:block;width:22px;height:2px;background:var(--white);transition:all .3s} .hamburger.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)} .hamburger.active span:nth-child(2){opacity:0} .hamburger.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)} .nav-overlay{display:none} .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px} @media(max-width:900px){.grid-3{grid-template-columns:repeat(2,1fr)}} @media(max-width:550px){.grid-3{grid-template-columns:1fr}} .card{background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.04);padding:32px 28px;transition:all .4s cubic-bezier(.25,.46,.45,.94);text-align:left} .card:hover{background:rgba(255,255,255,0.04);border-color:rgba(0,23,163,0.3);transform:translateY(-4px)} .card-label{font-family:'JetBrains Mono',monospace;font-size:0.65rem;letter-spacing:0.15em;color:var(--red);text-transform:uppercase;margin-bottom:6px} .card-title{font-size:0.85rem;font-weight:700;margin-bottom:6px;line-height:1.4} .card-date{font-family:'JetBrains Mono',monospace;font-size:0.6rem;letter-spacing:0.08em;color:var(--dark);margin-bottom:4px} .card-desc{font-size:0.75rem;color:var(--gray);line-height:1.6} .card a{color:var(--red);text-decoration:none;display:inline-flex;align-items:center;gap:4px;margin-top:10px;font-family:'JetBrains Mono',monospace;font-size:0.65rem;letter-spacing:0.08em;text-transform:uppercase;transition:color .2s} .card a:hover{color:var(--white)} .category-heading{margin:72px 0 32px} .category-heading:first-of-type{margin-top:0} .category-heading h2{font-size:clamp(1.1rem,2vw,1.4rem);font-weight:700;letter-spacing:-0.02em;text-transform:uppercase;margin-bottom:6px} .category-heading h2 em{font-style:normal;color:var(--red);font-weight:700} .category-heading p{font-family:'JetBrains Mono',monospace;font-size:0.65rem;letter-spacing:0.15em;color:var(--gray);text-transform:uppercase} .category-heading .count{color:var(--red)} .cat-nav{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:56px;justify-content:center} .cat-nav a{ font-family:'JetBrains Mono',monospace;font-size:0.6rem;letter-spacing:0.1em;text-transform:uppercase; padding:6px 14px;background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.06); color:var(--gray);text-decoration:none;transition:all .25s;border-radius:2px; } .cat-nav a:hover{background:rgba(0,23,163,0.06);border-color:rgba(0,23,163,0.2);color:var(--white)} @media(max-width:768px){ .hamburger{display:flex} nav{padding:14px 20px} .nav-links{display:none;position:fixed;top:60px;left:0;right:0;flex-direction:column;background:rgba(0,0,0,0.98);backdrop-filter:blur(20px);padding:24px 20px;gap:4px;border-bottom:1px solid rgba(255,255,255,0.04);z-index:99} .nav-links a{display:block;padding:14px 16px;min-height:48px;font-size:0.75rem} .nav-links.show{display:flex} .nav-overlay.show{display:block;position:fixed;inset:0;z-index:98;background:rgba(0,0,0,0.6)} .nav-cta-desktop{display:none} .sec{padding:64px 20px} #hero{padding:100px 20px 48px} .h-sub{font-size:0.95rem} .ss{font-size:0.85rem} } @media(max-width:480px){ html{font-size:14px} .sec{padding:48px 16px} #hero{padding:100px 16px 48px} h1{font-size:clamp(0.8rem,2.2vw,1.2rem);overflow-wrap:break-word;word-break:break-word} .h-sub{font-size:0.8rem;padding:0 4px} .btn-p,.btn-g{padding:12px 24px;font-size:0.7rem;width:100%;justify-content:center} .ss{max-width:100%} }
