body{background-color:#000;font-family:Courier New,Courier,monospace;margin:0;min-height:100vh;overflow-x:hidden;overflow-y:auto}#root{width:100%}.hero-section{height:100vh;width:100%;display:flex;justify-content:center;align-items:center;flex-direction:column;position:relative;padding:20px;box-sizing:border-box}.projects-section{min-height:100vh;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:4rem 2rem;box-sizing:border-box;background:radial-gradient(circle at 15% 15%,rgba(255,215,0,.08),transparent 45%),radial-gradient(circle at 85% 25%,rgba(255,255,255,.05),transparent 40%),linear-gradient(180deg,#050505,#020202);position:relative}.projects-grid{display:grid;grid-template-columns:1fr;gap:1.5rem;width:100%;max-width:1080px;margin-bottom:4rem}@media(min-width:768px){.projects-grid{grid-template-columns:repeat(12,1fr)}.projects-grid .project-card:nth-child(1){grid-column:span 7}.projects-grid .project-card:nth-child(2){grid-column:span 5}.projects-grid .project-card:nth-child(3){grid-column:span 12}}.projects-header{width:100%;max-width:1080px;margin-bottom:2rem;color:#fff}.eyebrow{color:gold;text-transform:uppercase;letter-spacing:.25rem;font-size:.85rem;margin:0 0 .75rem}.projects-title{margin:0;font-family:Oswald,sans-serif;font-size:clamp(2rem,4vw,3rem);color:#fff;text-transform:uppercase}.projects-intro{margin:.75rem 0 0;color:#bfbfbf;font-family:Arial,sans-serif;line-height:1.6;max-width:60ch}.project-card{background:linear-gradient(180deg,#ffffff05,#fff0),#0a0a0a;border:1px solid rgba(255,215,0,.18);padding:1.3rem;border-radius:16px;text-decoration:none;color:#fff;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;position:relative;min-height:230px;overflow:hidden;box-shadow:0 12px 30px #00000059}.project-card:before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,215,0,.08),transparent 45%);opacity:.75;pointer-events:none}.project-card:hover{transform:translateY(-6px);box-shadow:0 16px 36px #00000073;border-color:gold}.project-card-top,.project-card-body,.project-cta{position:relative;z-index:1}.project-card-top{width:100%;display:flex;justify-content:space-between;align-items:center;gap:1rem}.project-index{color:#ffffff59;font-size:.9rem;letter-spacing:.2rem}.project-category{border:1px solid rgba(255,215,0,.35);color:gold;padding:.2rem .6rem;border-radius:999px;font-size:.72rem;text-transform:uppercase;letter-spacing:.08rem}.project-card-body{margin:1.1rem 0 1.4rem}.project-card h3{font-family:Oswald,sans-serif;font-size:1.65rem;color:gold;margin:0 0 .8rem;text-transform:uppercase;line-height:1.1}.project-card p{font-family:Arial,sans-serif;font-size:1rem;line-height:1.55;color:#ccc;margin:0}.project-cta{color:#fff;font-size:.95rem;letter-spacing:.04rem;opacity:.9}.project-card:hover .project-cta{color:gold}.project-card-realtime:before{background:linear-gradient(115deg,rgba(255,215,0,.12),rgba(255,140,0,.05) 35%,transparent 60%)}.project-card-quiz:before{background:linear-gradient(115deg,rgba(255,215,0,.07),rgba(255,255,255,.04) 45%,transparent 70%)}.project-card-publish:before{background:linear-gradient(115deg,rgba(255,215,0,.1),rgba(255,215,0,.02) 40%,transparent 70%)}.scroll-indicator{position:absolute;bottom:40px;left:50%;transform:translate(-50%);cursor:pointer;display:flex;flex-direction:column;align-items:center;color:#fff;opacity:.7;transition:opacity .3s}.scroll-indicator:hover{opacity:1}.arrow-down{width:20px;height:20px;border-right:3px solid #FFD700;border-bottom:3px solid #FFD700;transform:rotate(45deg);margin-top:10px;animation:bounce 2s infinite}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0) rotate(45deg)}40%{transform:translateY(-10px) rotate(45deg)}60%{transform:translateY(-5px) rotate(45deg)}}h1{font-size:5rem;color:gold;font-family:Oswald,sans-serif;margin:0;text-transform:uppercase}.typing-container{border-right:4px solid #FFD700;white-space:nowrap;overflow:hidden;animation:typing .9s steps(9,end) forwards,blink .75s step-end infinite}h2{color:#fff;font-family:Arial,sans-serif;font-size:1.8rem;margin-top:.5rem;font-weight:400}.hero-section h2{font-size:1.8rem}@keyframes typing{0%{width:0}to{width:9ch}}@keyframes blink{50%{border-color:transparent}}.content{color:#fff;font-family:Arial,sans-serif;text-align:center;position:relative;width:100%;max-width:800px}a{text-decoration:none;font-weight:700;color:#fff;position:relative;transition:color .3s;display:inline-flex;align-items:center}.project-card a,.projects-grid a{align-items:stretch}.social-links a span{position:relative;display:inline-block}.social-links a span:after{content:"";position:absolute;left:0;bottom:0;height:2px;background-color:gold;width:100%;transform:scaleX(0);transform-origin:bottom right;transition:transform .3s ease;z-index:-1}.social-links a:hover span:after{transform:scaleX(1)}.social-links a:hover{color:gold}.divider{height:4px;background:linear-gradient(to right,red,orange,#ff0,green,#00f,indigo,violet);width:80%;border:none;margin:20px auto}.icon{width:30px;height:30px;margin-right:10px;vertical-align:middle;border-radius:50%;background-color:#fff;padding:5px}.social-links{display:flex;justify-content:center;gap:20px;margin-bottom:20px}@media(max-width:640px){.projects-section{padding:3rem 1rem}.project-card{min-height:200px;padding:1rem}.project-card h3{font-size:1.4rem}}
