/* ------------------------------------------------------------------
   Track 03 — discography timeline and LED equalizer meters.
   ------------------------------------------------------------------ */

.two-col{display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(36px,6vw,72px); align-items:start}
@media(max-width:900px){.two-col{grid-template-columns:1fr}}
.disc-list{position:relative; padding-left:34px}
.disc-list::before{content:""; position:absolute; left:7px; top:8px; bottom:8px; width:2px; background:linear-gradient(var(--accent),var(--border) 70%); transition:background .8s var(--ease)}
.exp{position:relative; padding:0 0 42px}
.exp:last-child{padding-bottom:0}
.exp::before{
  content:""; position:absolute; left:-34px; top:7px; width:16px; height:16px; border-radius:50%;
  background:var(--bg); border:2px solid var(--accent); transition:border-color .8s var(--ease), box-shadow .4s var(--ease);
}
.exp:hover::before{box-shadow:0 0 0 6px var(--accent-soft)}
.exp .when{font-family:var(--font-mono); font-size:.72rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); transition:color .8s var(--ease)}
.exp h3{font-size:1.22rem; font-weight:700; margin:7px 0 3px}
.exp .where{font-size:.93rem; color:var(--text-2); margin-bottom:10px}
.exp .ctx{font-size:.91rem; color:var(--text-3); font-style:italic; margin:0 0 11px; max-width:62ch}
.exp ul{margin:0; padding-left:18px; color:var(--text-2); font-size:.94rem}
.exp li{margin-bottom:5px}

/* skills = LED equalizer meters */
.skill-block{border:1px solid var(--border); border-radius:var(--r-lg); background:var(--surface); padding:26px; margin-bottom:16px}
.skill-block h4{font-size:1.02rem; margin-bottom:18px; color:var(--accent); transition:color .8s var(--ease)}
.meter{margin-bottom:16px}
.meter:last-child{margin-bottom:0}
.meter-top{display:flex; justify-content:space-between; align-items:baseline; font-size:.88rem; margin-bottom:7px}
.meter-top span:last-child{font-family:var(--font-mono); color:var(--text-3); font-size:.72rem; letter-spacing:.06em}
.leds{display:flex; gap:4px}
.led{
  height:14px; flex:1; border-radius:3px; background:var(--chip); border:1px solid var(--border);
  transition:background .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.led.on{background:var(--accent); border-color:transparent; box-shadow:0 0 8px var(--accent-glow)}
.langs{display:flex; flex-direction:column; gap:10px}
.lrow{display:flex; align-items:center; justify-content:space-between; gap:14px; font-size:.95rem; padding-bottom:10px; border-bottom:1px solid var(--border)}
.lrow:last-child{border-bottom:none; padding-bottom:0}
.lrow b{font-size:.8rem; font-weight:600; color:var(--accent); padding:4px 11px; border-radius:999px; background:var(--accent-soft); transition:color .8s var(--ease)}
.skill-block .tags{margin-bottom:20px}
.skill-block .tags .tag{background:transparent}
