:root {
  --green: #00ff41;
  --green-dim: #00cc33;
  --green-dark: #003b00;
  --green-glow: rgba(0, 255, 65, 0.15);
  --bg: #000000;
  --card-bg: rgba(0, 10, 0, 0.85);
  --border: rgba(0, 255, 65, 0.3);
}


@media (max-width:600px) { #proj-modal { max-height:90vh; } }
/* ─────────────────────────────────────────
   SCREEN
───────────────────────────────────────── */
/* ── TABLET ── */
@media screen and (max-width: 900px) {
  header { padding: 60px 20px 30px; }
  section { padding: 20px 18px; }
  .card, #terminal { padding: 22px;}
  .skills-container {display: flex;flex-wrap: wrap;gap: 12px;margin-top: 20px;}
  .skill-box {padding: 10px 16px;border: 1px solid var(--green);background: rgba(0, 255, 65, 0.08);color: var(--green);border-radius: 8px;font-size: 14px;}
  .projects-grid{grid-template-columns:repeat(2, 1fr);justify-items: center;}
}

/* ── MOBILE ── */
@media screen and (max-width: 768px) {
  body { cursor: default; }
  header { padding: 5px 15px; }
  header h1 {font-size: clamp(2rem, 12vw, 3.5rem);line-height: 1;word-break: break-word; margin-top:15px }
  .work-exp { margin-top:15px; margin-bottom:15px; }
  .stats { margin-bottom:-4px; margin-top:15px;font-size:0.8em;}
  header .subtitle {padding: 0 10px;font-size: 0.75rem; line-height: 1.6; letter-spacing: 0.08em;}
  section { padding: 20px 14px; scroll-margin-top: 60px;}
  section h2 { margin-bottom: 20px; font-size: 1.8rem; }
  .card, #terminal { padding: 18px; min-height:110px; }
  .card p, #terminal-output { font-size: 0.82rem; line-height: 1.7; }
  .skills{display:grid; grid-template-columns:repeat(3, 1fr);gap:16px; padding:26px;align-items:center; }
  .skills span{ width:100%;text-align:center;padding:8px 4px;font-size:.7rem;align-items:center;justify-content:center;}
  .work-item{font-size:.72rem;padding:10px 14px;}
  .work-exp::before,
  .work-exp::after{ width:40px;}
  nav{ gap:3px;padding:8px 8px;}
  nav a{  padding:7px 10px;}
}

/* ── SMALL PHONES ── */
@media screen and (max-width: 480px) and (hover: none) {
  header { padding:5px 15px; }
  .work-exp { margin-top:15px; margin-bottom:15px; }
  header h1 { font-size: 2rem; margin-top:15px}
  header .subtitle { margin-top: 8px; font-size: 0.68rem; }
  section { padding: 15px 12px; scroll-margin-top: 30px;}
  section h2 { font-size: 1.6rem; }
  .stats { margin-bottom:-2px; margin-top:15px;font-size:0.8em; }
  .card, #terminal { padding: 16px; min-height:80px;}
  .card p, #terminal-output { font-size: 0.76rem; line-height: 1.6;}
  .skills{ display:grid; grid-template-columns:repeat(2, 1fr); gap:10px;padding:18px; align-items:center; }
  .skills span{width:100%;text-align:center;padding:8px 4px;font-size:.7rem;align-items:center;justify-content:center; }
  nav{gap:2px;padding:6px 6px;}
  nav a{padding:6px 8px;font-size:.66rem;letter-spacing:.05em;}
  footer { letter-spacing: 0.08em; }
  footer { padding: 20px 10px; font-size: 0.7rem; }
  #matrix { opacity: 0.3; }
}

/* ── VERY SMALL ── */
@media screen and (max-width: 340px) {
  header h1 { font-size: 1.6rem; margin-top:15px }
  .work-exp { margin-top:15px; margin-bottom:15px; }
  .card p, #terminal-output { font-size: 0.72rem; }
  .skills{display:grid;grid-template-columns:repeat(1, 1fr);gap:10px;padding:18px;align-items:center;}
}

/* mobile */
@media (max-width:600px){
  .projects-grid{grid-template-columns:1fr;justify-items: center;}
}