@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Orbitron:wght@500;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root{
  --bg:#030806; --panel:#07120b; --panel2:#0a1810; --green:#73ff36;
  --green2:#1fbe4c; --green3:#0a7e3d; --text:#eaffdf; --muted:#9bb09d;
  --line:rgba(115,255,54,.22); --shadow:0 0 50px rgba(46,255,71,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:radial-gradient(circle at 50% 0%,#0b2413 0,#030806 35%,#020504 100%);
  color:var(--text);font-family:"Space Grotesk",system-ui,sans-serif;overflow-x:hidden;
}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(115,255,54,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(115,255,54,.035) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,black,transparent 80%);z-index:-2}
.matrix{position:fixed;inset:0;pointer-events:none;z-index:-3;opacity:.12;background:radial-gradient(circle at 20% 20%,rgba(115,255,54,.35),transparent 20%),radial-gradient(circle at 80% 30%,rgba(0,255,136,.18),transparent 22%)}
.scanlines{position:fixed;inset:0;pointer-events:none;z-index:20;background:repeating-linear-gradient(to bottom,transparent 0,transparent 3px,rgba(255,255,255,.015) 4px);mix-blend-mode:screen}

.topbar{height:76px;position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:10px 24px;border-bottom:1px solid var(--line);background:rgba(3,8,6,.78);backdrop-filter:blur(18px)}
.brand{display:flex;align-items:center;gap:12px;color:var(--text);text-decoration:none;font-family:Orbitron,sans-serif;font-weight:700}
.brand img{width:42px;height:42px;object-fit:contain;filter:drop-shadow(0 0 9px rgba(115,255,54,.55))}
.clock{display:flex;gap:13px;align-items:center;font:500 11px "DM Mono",monospace;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}
.menu-button{width:48px;height:48px;border:1px solid var(--line);background:rgba(115,255,54,.04);display:grid;place-content:center;gap:5px;cursor:pointer}
.menu-button i{display:block;width:21px;height:2px;background:var(--green);box-shadow:0 0 8px rgba(115,255,54,.65)}
.menu{position:fixed;right:24px;top:84px;z-index:49;width:min(320px,calc(100vw - 48px));padding:10px;background:rgba(3,8,6,.96);border:1px solid var(--line);box-shadow:var(--shadow);transform:translateY(-12px);opacity:0;visibility:hidden;transition:.2s}
.menu.open{transform:none;opacity:1;visibility:visible}
.menu a{display:block;padding:14px;color:var(--text);text-decoration:none;font:500 12px "DM Mono",monospace;border-bottom:1px solid rgba(115,255,54,.1)}
.menu a:hover{background:rgba(115,255,54,.08);color:var(--green)}

main{padding-top:76px}
.hero{min-height:calc(100vh - 76px);position:relative;display:grid;place-items:center;overflow:hidden;border-bottom:1px solid var(--line);isolation:isolate}
.hero-grid{position:absolute;inset:0;background:linear-gradient(transparent 95%,rgba(115,255,54,.16) 96%),linear-gradient(90deg,transparent 95%,rgba(115,255,54,.12) 96%);background-size:70px 70px;transform:perspective(600px) rotateX(62deg) translateY(22%);transform-origin:center bottom;opacity:.45}
.hero:after{content:"";position:absolute;inset:0;background:radial-gradient(circle,transparent 20%,rgba(3,8,6,.55) 75%);z-index:-1}
.hero-logo{position:absolute;width:min(48vw,520px);aspect-ratio:1;display:grid;place-items:center;background:transparent;opacity:.92;filter:drop-shadow(0 0 40px rgba(66,255,55,.25));animation:float 6s ease-in-out infinite}
.hero-logo img{width:100%;height:100%;object-fit:contain;background:transparent}
.hero-copy{position:relative;text-align:center;margin-top:min(48vh,420px);padding:0 20px;text-shadow:0 0 20px rgba(115,255,54,.16)}
.hero h1{font:800 clamp(2.3rem,6vw,6.5rem)/.95 Orbitron,sans-serif;letter-spacing:-.06em;margin:10px 0}
.eyebrow,.hero-email,.tag,.terminal-line{font-family:"DM Mono",monospace}
.eyebrow{font-size:clamp(.68rem,1vw,.9rem);color:var(--muted)}
.hero-email{color:var(--green);margin:18px 0}
.terminal-line{font-size:12px;color:var(--muted);margin-top:26px}
.terminal-line span{color:var(--green)}

.intro,.positions,.terms{width:min(1200px,calc(100% - 40px));margin:auto;padding:90px 0;display:grid;grid-template-columns:90px 1fr;gap:28px}
.section-number{font:700 14px "DM Mono",monospace;color:var(--green);padding-top:7px}
.intro h2,.positions h2,.terms h2{font:700 clamp(2rem,4vw,4rem) Orbitron,sans-serif;margin:0 0 12px;letter-spacing:-.04em}
.intro p{font:14px "DM Mono",monospace;color:var(--muted)}

.projects{width:min(1200px,calc(100% - 40px));margin:auto;display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.project{grid-column:span 6;border:1px solid var(--line);background:linear-gradient(145deg,rgba(9,26,15,.96),rgba(4,10,7,.9));box-shadow:var(--shadow);position:relative;overflow:hidden}
.project:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(var(--green),transparent)}
.project:nth-child(3),.project:nth-child(6){grid-column:span 12}
.project-head{padding:25px 28px 18px;border-bottom:1px solid var(--line)}
.project h2{font:700 clamp(1.25rem,2vw,2rem)/1.15 Orbitron,sans-serif;margin:9px 0}
.tag{font-size:10px;letter-spacing:.12em;color:var(--green)}
.preferred{color:#c8d8c9;font:500 11px/1.5 "DM Mono",monospace;margin:8px 0 0}
.project-body{padding:26px 28px;color:#d4dfd4;font-size:15px;line-height:1.75}
.project-body p{margin:0 0 16px}.project-body p:last-child{margin-bottom:0}
.project-unknown{min-height:190px;display:flex;flex-direction:column}
.project-unknown .project-body{flex:1;display:flex;align-items:center;font-family:"DM Mono",monospace;color:var(--muted)}

.positions{margin-top:70px;border-top:1px solid var(--line)}
.position-grid{grid-column:2;display:grid;grid-template-columns:repeat(2,1fr);gap:1px;border:1px solid var(--line);background:var(--line);margin-top:20px}
.position-grid div{background:var(--panel);padding:18px 20px;font:500 13px "DM Mono",monospace;color:var(--text)}
.position-grid div:hover{background:#0d2114;color:var(--green)}

.terms{border-top:1px solid var(--line)}
.terms ul{list-style:none;padding:0;margin:26px 0 0;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.terms li{font:500 13px/1.5 "DM Mono",monospace;color:#c8d8c9;border-left:2px solid var(--green3);padding-left:14px}

.contact{width:min(1200px,calc(100% - 40px));margin:0 auto 90px}
.contact-console{border:1px solid var(--line);box-shadow:0 0 70px rgba(115,255,54,.08);background:#020705}
.terminal-top{display:flex;justify-content:space-between;gap:20px;padding:13px 18px;border-bottom:1px solid var(--line);font:500 10px "DM Mono",monospace;color:var(--green)}
.contact-grid{display:grid;grid-template-columns:1fr 1.15fr}
.contact-copy{padding:42px;border-right:1px solid var(--line)}
.contact-copy h2{font:700 clamp(1.5rem,3vw,2.7rem) Orbitron,sans-serif;line-height:1.12}
.contact-copy p{font:13px/1.7 "DM Mono",monospace;color:var(--muted)}
form{padding:42px;display:grid;gap:15px}
label{display:grid;gap:7px;font:500 10px "DM Mono",monospace;color:var(--green);text-transform:uppercase;letter-spacing:.08em}
input,textarea{width:100%;border:1px solid rgba(115,255,54,.22);background:#06100a;color:var(--text);padding:13px;font:14px "DM Mono",monospace;outline:none}
input:focus,textarea:focus{border-color:var(--green);box-shadow:0 0 0 2px rgba(115,255,54,.08)}
button[type=submit]{margin-top:5px;padding:15px;border:1px solid var(--green);background:var(--green);color:#031006;font:800 12px "DM Mono",monospace;letter-spacing:.1em;cursor:pointer}
button[type=submit]:hover{box-shadow:0 0 25px rgba(115,255,54,.35)}

footer{border-top:1px solid var(--line);padding:25px 24px;display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;font:10px "DM Mono",monospace;color:var(--muted)}
footer img{width:28px;height:28px;object-fit:contain}

@keyframes float{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-12px) rotate(.7deg)}}

@media(max-width:800px){
  .clock span:nth-child(3){display:none}
  .hero-logo{width:min(78vw,430px)}
  .hero-copy{margin-top:55vh}
  .projects{display:block}
  .project{margin-bottom:18px}
  .intro,.positions,.terms{grid-template-columns:45px 1fr;padding:65px 0}
  .position-grid,.terms ul{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  .contact-copy{border-right:0;border-bottom:1px solid var(--line)}
}
@media(max-width:520px){
  .topbar{padding:8px 12px;height:66px}.brand span{display:none}.clock{font-size:9px;gap:7px}.menu{right:12px;top:74px;width:calc(100vw - 24px)}
  main{padding-top:66px}.hero{min-height:calc(100svh - 66px)}.hero-logo{width:92vw}.hero-copy{margin-top:60vh}
  .projects,.intro,.positions,.terms,.contact{width:min(100% - 24px,1200px)}
  .project-head,.project-body,.contact-copy,form{padding:22px 18px}
  .terminal-top{font-size:8px}.terminal-top span:last-child{display:none}
}


.form-status{
  min-height:18px;
  font:500 10px/1.5 "DM Mono",monospace;
  color:var(--muted);
  letter-spacing:.03em;
}
.form-status.active{color:var(--green)}
.form-status.success{color:var(--green);text-shadow:0 0 10px rgba(115,255,54,.35)}
button[type=submit]:disabled{opacity:.65;cursor:wait}
