:root{
  --bg:#14171a;
  --line:#2b3136;
  --text:#ece9e2;
  --text-dim:#93999e;
  --text-dimmer:#666d73;
  --copper:#c98249;
  --copper-bright:#e2a066;
  --teal:#5b98a3;
  --maxw:920px;
}
*{box-sizing:border-box;}
html{scroll-padding-top:72px;-webkit-text-size-adjust:100%;}
body{
  margin:0;
  overflow-x:clip;
  background:var(--bg);
  color:var(--text);
  font-family:'Inter',system-ui,sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--copper-bright);text-decoration:none;}
a:hover{color:var(--text);}
a:focus-visible{outline:2px solid var(--teal); outline-offset:3px;}
h1,h3{font-family:'Space Grotesk',sans-serif;font-weight:600;margin:0;color:var(--text);}
.mono{font-family:'JetBrains Mono',monospace;}
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:max(28px,env(safe-area-inset-left));padding-right:max(28px,env(safe-area-inset-right));}

/* ---------- header ---------- */
header{
  position:sticky;top:0;z-index:20;
  background:rgba(20,23,26,0.9);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:60px;}
.logo{font-family:'JetBrains Mono',monospace;font-size:14px;letter-spacing:0.04em;color:var(--text);display:flex;align-items:center;gap:8px;}
.logo .dot{width:7px;height:7px;background:var(--copper);border-radius:50%;display:inline-block;}
nav ul{list-style:none;display:flex;gap:28px;margin:0;padding:0;}
nav a{font-size:13.5px;color:var(--text-dim);}
nav a:hover{color:var(--copper-bright);}

/* ---------- hero ---------- */
#hero{padding:76px 0 64px;position:relative;overflow:hidden;}
#hero svg.traces{position:absolute;inset:0;width:100%;height:100%;opacity:0.35;pointer-events:none;}
.hero-grid{position:relative;display:grid;grid-template-columns:1.25fr 0.75fr;gap:48px;align-items:center;}
.hero-text p.role{font-family:'JetBrains Mono',monospace;font-size:13px;letter-spacing:0.03em;color:var(--copper-bright);margin:0 0 14px;}
.hero-text h1{font-size:clamp(34px,5vw,50px);line-height:1.08;margin-bottom:14px;}
.hero-text p.tagline{color:var(--text-dim);max-width:46ch;margin:0 0 28px;font-size:15.5px;}
.hero-loc{font-family:'JetBrains Mono',monospace;font-size:12.5px;color:var(--text-dimmer);margin-bottom:28px;}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;}
.btn{
  font-family:'JetBrains Mono',monospace;font-size:13px;
  padding:10px 18px;border:1px solid var(--line);color:var(--text);
}
.btn:hover{border-color:var(--copper);color:var(--copper-bright);}
.btn.primary{background:var(--copper);border-color:var(--copper);color:#14171a;font-weight:500;}
.btn.primary:hover{background:var(--copper-bright);border-color:var(--copper-bright);color:#14171a;}

.photo-frame{background:var(--bg);
  position:relative;
  width:100%;max-width:280px;margin-left:auto;
  aspect-ratio:1/1;
  border:1px solid var(--line);
  padding:10px;
}
.photo-frame::before{
  content:"";position:absolute;top:-1px;left:-1px;
  width:16px;height:16px;
  background:var(--copper);
  clip-path:polygon(0 0, 100% 0, 0 100%);
}
.photo-frame img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(15%) contrast(1.02);}

/* ---------- no photo: hide portrait, single-column hero ---------- */
.photo-frame{display:none;}
.hero-grid{grid-template-columns:1fr;}

/* ---------- datasheet row layout ---------- */
section.row{border-top:1px solid var(--line);padding:52px 0;}
section.row .wrap{display:grid;grid-template-columns:150px 1fr;gap:36px;}
.field-label{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:0.03em;color:var(--text-dimmer);padding-top:2px;}
.field-label span{display:block;color:var(--text);font-family:'Space Grotesk',sans-serif;font-size:19px;font-weight:600;letter-spacing:0;margin-top:4px;}

#about .content p{max-width:66ch;color:var(--text-dim);margin:0 0 18px;font-size:15.5px;}
#about .content p:last-of-type{margin-bottom:0;}
.stat-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:28px;}
.stat{border-left:1px solid var(--line);padding-left:14px;}
.stat .num{font-family:'JetBrains Mono',monospace;font-size:22px;color:var(--copper-bright);}
.stat .lab{font-size:12.5px;color:var(--text-dimmer);margin-top:3px;}

/* experience */
.exp-entry{padding:26px 0;border-top:1px solid var(--line);}
.exp-entry:first-child{border-top:none;padding-top:0;}
.exp-head{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px 16px;margin-bottom:6px;}
.exp-idx{font-family:'JetBrains Mono',monospace;font-size:11.5px;color:var(--teal);}
.exp-title{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:17px;}
.exp-org{color:var(--text-dim);font-size:14px;}
.exp-dates{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--text-dimmer);white-space:nowrap;}
.exp-summary{color:var(--text-dim);font-size:14.5px;max-width:64ch;margin:6px 0 10px;}
.exp-entry ul{margin:0 0 10px;padding-left:18px;color:var(--text-dim);font-size:14px;}
.exp-entry li{margin-bottom:4px;}
.tech-line{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--copper-bright);}
.tech-line span.lbl{color:var(--text-dimmer);}

/* education */
.edu-entry{padding:18px 0;border-top:1px solid var(--line);}
.edu-entry:first-child{border-top:none;padding-top:0;}
.edu-title{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:16.5px;}
.edu-meta{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--text-dimmer);margin-top:4px;}
.edu-desc{color:var(--text-dim);font-size:14px;margin-top:6px;max-width:62ch;}

/* skills */
.skill-group{padding:14px 0;border-top:1px solid var(--line);}
.skill-group:first-child{border-top:none;padding-top:0;}
.skill-group h3{font-size:13px;font-family:'JetBrains Mono',monospace;color:var(--text-dimmer);font-weight:500;margin-bottom:8px;letter-spacing:0.02em;}
.skill-group p{margin:0;color:var(--text);font-size:14.5px;}

/* contact */
.contact-intro{color:var(--text-dim);max-width:56ch;margin:0 0 18px;}
.contact-links{display:flex;flex-direction:column;gap:10px;margin-top:6px;}
.contact-links a{font-size:15px;}

footer{border-top:1px solid var(--line);padding:28px 0;}
footer .wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;}
footer p{margin:0;font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--text-dimmer);}


/* ---------- language switcher + mobile menu ---------- */
.lang{display:flex;gap:2px;margin-left:28px;font-family:'JetBrains Mono',monospace;font-size:12px;}
.lang a{color:var(--text-dimmer);padding:6px 8px;border:1px solid transparent;}
.lang a:hover{color:var(--copper-bright);}
.lang a[aria-current]{color:var(--copper-bright);border-color:var(--line);}

/* ---------- smartphones ---------- */
@media (max-width:720px){
html{scroll-padding-top:0;}
header{position:static;}
header .wrap{flex-wrap:wrap;height:auto;padding-top:6px;}
nav{order:3;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
nav ul{gap:16px;white-space:nowrap;}
nav a{display:block;padding:12px 0;font-size:13px;}
.wrap{padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right));}
.lang{margin-left:auto;}
#hero{padding:36px 0 40px;}
.hero-grid{grid-template-columns:1fr;gap:28px;}
.photo-frame{background:var(--bg);order:-1;margin:0;max-width:150px;}
.hero-text h1{font-size:clamp(28px,8.5vw,36px);}
.cta-row .btn{flex:1 1 auto;text-align:center;padding:12px 14px;}
section.row{padding:36px 0;}
section.row .wrap{grid-template-columns:1fr;gap:12px;}
.field-label span{margin-top:0;}
.stat-strip{grid-template-columns:repeat(2,1fr);gap:16px;}
.exp-entry{padding:22px 0;}
.contact-links a{padding:6px 0;overflow-wrap:anywhere;}
.tech-line{line-height:1.7;overflow-wrap:anywhere;}
}