:root{
  --bg:#0F1419;
  --surface:#161C26;
  --surface-2:#1D2532;
  --line:#2A3341;
  --text:#E7EAEE;
  --muted:#8B93A1;
  --amber:#E8A33D;
  --teal:#4FD1C5;
  --red:#FF6B4A;
  --mono:'JetBrains Mono', monospace;
  --sans:'Inter', sans-serif;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--sans);
  line-height:1.6;
  overflow-x:hidden;
}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1040px; margin:0 auto; padding:0 24px;}

/* nav */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(15,20,25,0.85);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
nav{display:flex; align-items:center; justify-content:space-between; padding:16px 24px; max-width:1040px; margin:0 auto;}
.logo{font-family:var(--mono); font-weight:700; font-size:15px; letter-spacing:0.5px;}
.logo span{color:var(--amber);}
.navlinks{display:flex; gap:28px; font-family:var(--mono); font-size:13px; color:var(--muted);}
.navlinks a:hover{color:var(--teal);}
.navlinks a:focus-visible, a:focus-visible, button:focus-visible{outline:2px solid var(--teal); outline-offset:3px; border-radius:2px;}
.navlinks{display:none;}
@media(min-width:720px){.navlinks{display:flex;}}

/* hero */
.hero{padding:90px 0 70px; position:relative;}
.eyebrow{font-family:var(--mono); color:var(--teal); font-size:13px; letter-spacing:1px; margin-bottom:18px; display:flex; align-items:center; gap:10px;}
.eyebrow::before{content:''; width:8px; height:8px; border-radius:50%; background:var(--teal); box-shadow:0 0 0 4px rgba(79,209,197,0.15); animation:pulse 2s infinite;}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:0.4;}}
h1{font-family:var(--sans); font-size:clamp(32px,5vw,52px); font-weight:800; line-height:1.1; margin-bottom:16px;}
h1 .accent{color:var(--amber);}
.hero-sub{color:var(--muted); font-size:18px; max-width:560px; margin-bottom:40px;}

.terminal{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 30px 60px -20px rgba(0,0,0,0.6);
}
.term-bar{display:flex; align-items:center; gap:8px; padding:12px 16px; background:var(--surface-2); border-bottom:1px solid var(--line);}
.dot{width:11px; height:11px; border-radius:50%;}
.dot.r{background:#FF5F56;} .dot.y{background:#FFBD2E;} .dot.g{background:#27C93F;}
.term-title{margin-inline-start:12px; font-family:var(--mono); font-size:12px; color:var(--muted);}
.term-body{padding:22px 20px; font-family:var(--mono); font-size:14px; min-height:230px;}
.term-line{margin-bottom:10px; white-space:pre-wrap;}
.prompt{color:var(--teal);}
.cmd{color:var(--text);}
.out{color:var(--muted); padding-inline-start:2px;}
.out .ok{color:var(--amber);}
.cursor{display:inline-block; width:8px; height:16px; background:var(--teal); vertical-align:middle; animation:blink 1s step-end infinite;}
@keyframes blink{50%{opacity:0;}}

/* sections */
section{padding:70px 0;}
.section-head{display:flex; align-items:baseline; gap:14px; margin-bottom:36px;}
.tag{font-family:var(--mono); font-size:13px; color:var(--amber);}
h2{font-size:26px; font-weight:700;}
.divider{height:1px; background:var(--line); flex:1;}

.about-grid{display:grid; grid-template-columns:1fr; gap:36px;}
@media(min-width:760px){.about-grid{grid-template-columns:1.3fr 1fr;}}
.about-text p{color:var(--muted); margin-bottom:14px; font-size:15.5px;}
.about-text strong{color:var(--text); font-weight:600;}
.facts{display:flex; flex-direction:column; gap:0; border:1px solid var(--line); border-radius:10px; overflow:hidden;}
.fact{display:flex; justify-content:space-between; padding:14px 18px; font-size:13.5px; border-bottom:1px solid var(--line);}
.fact:last-child{border-bottom:none;}
.fact span:first-child{color:var(--muted); font-family:var(--mono);}
.fact span:last-child{font-weight:600;}

/* experience */
.job{border-inline-start:2px solid var(--line); padding:2px 0 32px 24px; position:relative;}
.job::before{content:''; position:absolute; left:-7px; top:4px; width:12px; height:12px; border-radius:50%; background:var(--bg); border:2px solid var(--amber);}
.job:last-child{padding-bottom:2px;}
.job-head{display:flex; flex-wrap:wrap; align-items:baseline; gap:10px; margin-bottom:4px;}
.job-role{font-weight:700; font-size:17px;}
.job-period{font-family:var(--mono); font-size:12.5px; color:var(--muted); margin-inline-start:auto;}
.job-org{color:var(--teal); font-size:14px; margin-bottom:12px; font-weight:500;}
.job ul{list-style:none;}
.job li{color:var(--muted); font-size:14.5px; margin-bottom:8px; padding-inline-start:18px; position:relative;}
.job li::before{content:'▹'; position:absolute; left:0; color:var(--amber);}

/* projects */
.proj-grid{display:grid; grid-template-columns:1fr; gap:18px;}
@media(min-width:700px){.proj-grid{grid-template-columns:1fr 1fr;}}
.card{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:24px; transition:border-color .2s, transform .2s;}
.card:hover{border-color:var(--amber); transform:translateY(-3px);}
.card-top{display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:10px;}
.card h3{font-size:17px; font-weight:700;}
.card-links{display:flex; align-items:center; gap:14px; flex-shrink:0;}
.card-link{font-family:var(--mono); font-size:12px; color:var(--teal); white-space:nowrap;}
.card-link:hover{color:var(--amber);}
.card p{color:var(--muted); font-size:14px; margin-bottom:14px;}
.chips{display:flex; flex-wrap:wrap; gap:8px;}
.chip{font-family:var(--mono); font-size:11.5px; color:var(--amber); background:rgba(232,163,61,0.1); border:1px solid rgba(232,163,61,0.25); padding:3px 9px; border-radius:100px;}

/* skills */
.skill-groups{display:grid; grid-template-columns:1fr; gap:24px;}
@media(min-width:700px){.skill-groups{grid-template-columns:repeat(3,1fr);}}
.skill-col h4{font-family:var(--mono); font-size:12.5px; color:var(--teal); margin-bottom:14px; letter-spacing:0.5px;}
.skill-col ul{list-style:none;}
.skill-col li{color:var(--muted); font-size:14px; margin-bottom:9px; display:flex; align-items:center; gap:9px;}
.skill-col li::before{content:''; width:5px; height:5px; background:var(--amber); border-radius:50%; flex-shrink:0;}

/* contact */
.contact-box{background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:48px 32px; text-align:center;}
.contact-box h2{font-size:28px; margin-bottom:12px;}
.contact-box p{color:var(--muted); margin-bottom:28px; max-width:480px; margin-left:auto; margin-right:auto;}
.cta-row{display:flex; flex-wrap:wrap; gap:14px; justify-content:center;}
.btn{font-family:var(--mono); font-size:13.5px; padding:12px 22px; border-radius:8px; border:1px solid var(--line); transition:all .2s; display:inline-flex; align-items:center; gap:8px;}
.btn.primary{background:var(--amber); color:#0F1419; border-color:var(--amber); font-weight:700;}
.btn.primary:hover{background:#f0b25c;}
.btn.ghost{color:var(--text);}
.btn.ghost:hover{border-color:var(--teal); color:var(--teal);}

footer{padding:32px 0; text-align:center; color:var(--muted); font-family:var(--mono); font-size:12.5px; border-top:1px solid var(--line);}

@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important;}
}