/* EXPERIENCE */
#experience{position:relative;}
.timeline{position:relative; max-width:820px; margin:0 auto; padding-left:2.6rem;}
.timeline::before{content:''; position:absolute; left:6px; top:6px; bottom:6px; width:1.5px; background:linear-gradient(180deg,var(--lavender-deep),var(--gold),transparent);}
.tl-item{position:relative; padding:1.5rem; margin-bottom:1.5rem; border-radius:22px;}
.tl-item:last-child{margin-bottom:0;}
.tl-dot{position:absolute; left:-2.6rem; top:1.8rem; width:14px; height:14px; border-radius:50%; background:var(--cream); border:2px solid var(--lavender-deep); box-shadow:0 0 0 5px rgba(198,182,232,0.2);}
.tl-heading{display:flex; align-items:center; gap:1rem; margin-bottom:1rem;}
.tl-logo{width:64px; height:64px; flex:0 0 64px; object-fit:contain; border-radius:14px; padding:0.35rem; background:rgba(255,255,255,0.8); border:1px solid rgba(56,37,63,0.08);}
.tl-role{font-size:1.22rem; font-style:italic; margin-bottom:0.2rem;}
.tl-company{color:var(--plum-soft); font-size:0.9rem; font-weight:700; transition:color 0.2s ease;}
.tl-company:hover{color:var(--lavender-deep);}
.tl-company span{font-size:0.8em; margin-left:0.15rem;}
.tl-meta{display:flex; flex-wrap:wrap; gap:0.45rem 1rem; font-family:var(--font-mono); font-size:0.68rem; color:var(--gold); letter-spacing:0.02em; margin-bottom:1rem;}
.tl-meta span+span::before{content:'·'; margin-right:1rem; color:var(--lavender-deep);}
.tl-list{list-style:none; display:flex; flex-direction:column; gap:0.55rem;}
.tl-list li{color:var(--plum-soft); font-size:0.94rem; padding-left:1.3rem; position:relative;}
.tl-list li::before{content:''; position:absolute; left:0; top:0.55em; width:6px; height:6px; border-radius:50%; background:var(--lavender-deep);}
.tl-skills{display:flex; flex-wrap:wrap; align-items:center; gap:0.4rem; margin-top:1.1rem;}
.tl-skills-label{font-family:var(--font-mono); font-size:0.65rem; color:var(--plum-soft); margin-right:0.25rem;}
.tl-skills .tech-badge{margin:0;}
@media (max-width:600px){
  .timeline{padding-left:1.9rem;}
  .timeline::before{left:4px;}
  .tl-item{padding:1.1rem; border-radius:18px;}
  .tl-dot{left:-1.9rem; top:1.4rem;}
  .tl-heading{align-items:flex-start; gap:0.75rem;}
  .tl-logo{width:50px; height:50px; flex-basis:50px; border-radius:11px;}
  .tl-role{font-size:1.05rem;}
  .tl-company{font-size:0.82rem;}
  .tl-meta{display:grid; gap:0.35rem;}
  .tl-meta span+span::before{content:none;}
}