:root{
  --bg:#0A0E13;
  --bg-alt:#0E141B;
  --card:#131A22;
  --card-hover:#171F29;
  --border:#212B35;
  --text:#E7ECF0;
  --text-dim:#7C8896;
  --gold:#D4AF37;
  --gold-dim:#8A742A;
  --teal:#4FD8C4;
  --teal-dim:#2E8A7C;
  --red:#E5484D;
  --radius:10px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:
    radial-gradient(circle at 1px 1px, rgba(255,255,255,0.035) 1px, transparent 0) 0 0/28px 28px,
    var(--bg);
  color:var(--text);
  font-family:'Inter',sans-serif;
  line-height:1.6;
  overflow-x:hidden;
  animation:page-in .5s ease;
}
@keyframes page-in{ from{opacity:0;} to{opacity:1;} }
::selection{background:var(--gold);color:#0A0E13;}

/* ===== Ticker bar ===== */
.ticker-wrap{
  position:sticky;top:0;z-index:100;
  background:var(--bg-alt);
  border-bottom:1px solid var(--border);
  overflow:hidden;
  padding:9px 0;
}
.ticker-track{ display:flex; width:max-content; animation:scroll-ticker 32s linear infinite; }
@keyframes scroll-ticker{ 0%{transform:translateX(0);} 100%{transform:translateX(-50%);} }
.ticker-item{
  font-family:'IBM Plex Mono',monospace; font-size:12.5px; white-space:nowrap;
  padding:0 22px; display:flex; align-items:center; gap:7px;
  color:var(--text-dim); border-right:1px solid var(--border);
}
.ticker-item b{color:var(--text);font-weight:600;}
.up{color:var(--teal);} .down{color:var(--red);}

/* ===== Nav ===== */
nav{
  display:flex;justify-content:space-between;align-items:center;
  padding:22px 6%;max-width:1200px;margin:0 auto;
}
.logo{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:18px; letter-spacing:0.5px; }
.logo a{color:var(--text);text-decoration:none;}
.logo .dot-sep{color:var(--gold);}
.nav-links{display:flex;gap:32px;list-style:none;}
.nav-links a{
  color:var(--text-dim);text-decoration:none;font-size:14px;
  font-family:'IBM Plex Mono',monospace;transition:color .2s;position:relative;padding-bottom:4px;
}
.nav-links a:hover{color:var(--teal);}
.nav-links a.active{color:var(--gold);}
.nav-links a.active::after{
  content:'';position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--gold);
}
@media(max-width:700px){.nav-links{gap:18px;}}

section, .wrap-section{max-width:1200px;margin:0 auto;padding:0 6%;}

/* ===== Page hero (inner pages) ===== */
.page-hero{padding:56px 0 44px;border-bottom:1px solid var(--border);margin-bottom:60px;}
.sec-eyebrow{
  font-family:'IBM Plex Mono',monospace;color:var(--gold);
  font-size:12.5px;letter-spacing:2px;text-transform:uppercase;margin-bottom:12px;
}
.page-hero h1{
  font-family:'Space Grotesk',sans-serif;font-size:clamp(28px,5vw,44px);font-weight:700;margin-bottom:14px;
}
.page-hero p{color:var(--text-dim);font-size:16px;max-width:620px;}

/* ===== Home hero ===== */
.hero{ min-height:72vh; display:flex; flex-direction:column; justify-content:center; position:relative; }
.hero-tag{
  font-family:'IBM Plex Mono',monospace;color:var(--teal);font-size:13px;
  display:flex;align-items:center;gap:8px;margin-bottom:22px;
}
.hero-tag::before{
  content:'';width:7px;height:7px;border-radius:50%;background:var(--teal);display:inline-block;
  animation:pulse 1.6s infinite;
}
@keyframes pulse{ 0%,100%{opacity:1;} 50%{opacity:0.3;} }
h1.hero-h1{
  font-family:'Space Grotesk',sans-serif;font-size:clamp(34px,6vw,62px);font-weight:700;line-height:1.08;max-width:820px;
}
#typed-cursor{ display:inline-block;width:3px;background:var(--gold);animation:blink 1s step-end infinite;margin-left:2px; }
@keyframes blink{50%{opacity:0;}}
.hero-sub{color:var(--text-dim);font-size:17px;max-width:560px;margin:22px 0 34px;}
.hero-badges{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:40px;}
.badge{
  font-family:'IBM Plex Mono',monospace;font-size:13px;padding:8px 16px;border-radius:20px;
  border:1px solid var(--border);display:flex;align-items:center;gap:8px;
}
.badge.dev{color:var(--teal);border-color:var(--teal-dim);}
.badge.trade{color:var(--gold);border-color:var(--gold-dim);}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap;}
.btn{
  font-family:'IBM Plex Mono',monospace;font-size:14px;padding:13px 26px;border-radius:var(--radius);
  text-decoration:none;transition:all .2s;cursor:pointer;border:1px solid transparent;display:inline-block;
}
.btn-primary{background:var(--gold);color:#0A0E13;font-weight:600;}
.btn-primary:hover{background:#e8c250;transform:translateY(-2px);}
.btn-outline{border-color:var(--border);color:var(--text);}
.btn-outline:hover{border-color:var(--teal);color:var(--teal);}
.chart-bg{position:absolute;right:0;top:8%;width:42%;height:70%;opacity:0.35;pointer-events:none;}
@media(max-width:900px){.chart-bg{display:none;}}

/* ===== Stat strip ===== */
.stat-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--border);border:1px solid var(--border);border-radius:var(--radius);
  overflow:hidden;margin:50px 0;
}
@media(max-width:700px){.stat-grid{grid-template-columns:repeat(2,1fr);}}
.stat-cell{background:var(--card);padding:24px 18px;text-align:center;}
.stat-cell .v{font-family:'Space Grotesk',sans-serif;font-size:30px;font-weight:700;color:var(--gold);}
.stat-cell .l{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--text-dim);margin-top:6px;}

/* ===== Explore grid (home) ===== */
.explore-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:90px;}
@media(max-width:900px){.explore-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.explore-grid{grid-template-columns:1fr;}}
.explore-card{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  padding:24px 20px;text-decoration:none;color:var(--text);transition:all .2s;display:block;
}
.explore-card:hover{border-color:var(--teal-dim);transform:translateY(-4px);}
.explore-card .num{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--gold);}
.explore-card h3{font-family:'Space Grotesk',sans-serif;font-size:18px;margin:10px 0 8px;}
.explore-card p{color:var(--text-dim);font-size:13.5px;}
.explore-card .arrow{color:var(--teal);font-family:'IBM Plex Mono',monospace;font-size:13px;margin-top:12px;display:block;}

/* ===== About ===== */
.about-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:60px;align-items:start;margin-bottom:90px;}
@media(max-width:800px){.about-grid{grid-template-columns:1fr;}}
.about-text p{color:var(--text-dim);font-size:15.5px;margin-bottom:18px;}
.about-text strong{color:var(--text);font-weight:600;}
.terminal{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;}
.terminal-bar{background:var(--bg-alt);padding:10px 14px;display:flex;gap:6px;border-bottom:1px solid var(--border);}
.dot{width:10px;height:10px;border-radius:50%;}
.dot.r{background:#E5484D;} .dot.y{background:#D4AF37;} .dot.g{background:#4FD8C4;}
.terminal-body{padding:20px;font-family:'IBM Plex Mono',monospace;font-size:13px;}
.terminal-row{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px dashed var(--border);}
.terminal-row:last-child{border-bottom:none;}
.terminal-row .k{color:var(--text-dim);} .terminal-row .v{color:var(--teal);}

/* ===== Skills ===== */
.skills-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:40px;}
@media(max-width:800px){.skills-grid{grid-template-columns:1fr;}}
.skill-panel{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:24px;}
.skill-panel h3{font-family:'Space Grotesk',sans-serif;font-size:16px;margin-bottom:18px;display:flex;align-items:center;gap:8px;}
.skill-panel.dev h3{color:var(--teal);} .skill-panel.trade h3{color:var(--gold);}
.skill-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--border);font-family:'IBM Plex Mono',monospace;font-size:13.5px;}
.skill-row:last-child{border-bottom:none;}
.skill-name{color:var(--text);}
.skill-bar-wrap{flex:1;margin:0 16px;height:4px;background:var(--border);border-radius:4px;overflow:hidden;}
.skill-bar{height:100%;border-radius:4px;}
.dev .skill-bar{background:var(--teal);} .trade .skill-bar{background:var(--gold);}
.skill-pct{color:var(--text-dim);min-width:38px;text-align:right;}
.tools-row{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:90px;}
.tool-tag{
  font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--text-dim);
  background:var(--card);padding:8px 14px;border-radius:20px;border:1px solid var(--border);
}

/* ===== Projects ===== */
.projects-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-bottom:90px;}
@media(max-width:800px){.projects-grid{grid-template-columns:1fr;}}
.project-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:24px;transition:all .25s;cursor:pointer;}
.project-card:hover{border-color:var(--teal-dim);transform:translateY(-4px);}
.project-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px;}
.position-tag{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--gold);border:1px solid var(--gold-dim);padding:3px 9px;border-radius:4px;}
.project-card h4{font-family:'Space Grotesk',sans-serif;font-size:18px;margin-bottom:10px;}
.project-card p{color:var(--text-dim);font-size:14px;margin-bottom:16px;}
.project-meta{display:flex;justify-content:space-between;font-family:'IBM Plex Mono',monospace;font-size:12px;margin-bottom:14px;}
.project-meta .label{color:var(--text-dim);} .project-meta .val{color:var(--teal);}
.tag-row{display:flex;gap:8px;flex-wrap:wrap;}
.tech-tag{font-size:11px;font-family:'IBM Plex Mono',monospace;color:var(--text-dim);background:var(--bg-alt);padding:4px 9px;border-radius:4px;border:1px solid var(--border);}

/* ===== Modal ===== */
.modal-overlay{
  position:fixed;inset:0;background:rgba(6,9,13,0.75);display:none;
  align-items:center;justify-content:center;z-index:200;padding:24px;backdrop-filter:blur(2px);
}
.modal-overlay.open{display:flex;}
.modal-box{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  max-width:560px;width:100%;padding:32px;max-height:85vh;overflow-y:auto;animation:modal-in .25s ease;
}
@keyframes modal-in{ from{opacity:0;transform:translateY(14px);} to{opacity:1;transform:translateY(0);} }
.modal-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px;}
.modal-close{
  background:none;border:1px solid var(--border);color:var(--text-dim);width:30px;height:30px;
  border-radius:50%;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:all .2s;
}
.modal-close:hover{border-color:var(--red);color:var(--red);}
.modal-box h3{font-family:'Space Grotesk',sans-serif;font-size:22px;margin-bottom:6px;}
.modal-detail-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px dashed var(--border);font-family:'IBM Plex Mono',monospace;font-size:13px;}
.modal-detail-row .k{color:var(--text-dim);} .modal-detail-row .v{color:var(--gold);text-align:right;}
.modal-box p.modal-desc{color:var(--text-dim);font-size:14.5px;margin:16px 0;}

/* ===== Contact ===== */
.contact-box{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:44px;text-align:center;margin-bottom:60px;}
.contact-prompt{font-family:'IBM Plex Mono',monospace;color:var(--gold);font-size:14px;margin-bottom:12px;}
.contact-box h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(24px,4vw,36px);margin-bottom:16px;}
.contact-box p{color:var(--text-dim);max-width:480px;margin:0 auto 30px;}
.contact-form{max-width:460px;margin:0 auto;text-align:left;}
.form-group{margin-bottom:16px;}
.form-group label{display:block;font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--text-dim);margin-bottom:6px;}
.form-group input,.form-group textarea{
  width:100%;background:var(--bg-alt);border:1px solid var(--border);border-radius:var(--radius);
  padding:12px 14px;color:var(--text);font-family:'Inter',sans-serif;font-size:14px;resize:vertical;
}
.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--teal);}
.form-submit{width:100%;text-align:center;border:none;font-size:14px;}
.form-status{font-family:'IBM Plex Mono',monospace;font-size:12.5px;margin-top:12px;display:none;}
.form-status.ok{color:var(--teal);display:block;} .form-status.err{color:var(--red);display:block;}
.social-row{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;}
.social-link{
  font-family:'IBM Plex Mono',monospace;font-size:13px;padding:11px 20px;border:1px solid var(--border);
  border-radius:var(--radius);color:var(--text);text-decoration:none;transition:all .2s;
}
.social-link:hover{border-color:var(--teal);color:var(--teal);}

footer{text-align:center;padding:24px 6%;color:var(--text-dim);font-family:'IBM Plex Mono',monospace;font-size:12px;border-top:1px solid var(--border);}

.reveal{opacity:0;transform:translateY(24px);transition:all .7s ease;}
.reveal.show{opacity:1;transform:translateY(0);}

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