/* ============================================================
   EXPERIENCE SECTION
   ============================================================ */

#experience {
  background: var(--deep);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.exp-container {
  max-width: 900px;
  margin: 0 auto;
}

/* Timeline */
.timeline {
  position: relative;
}

.timeline::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 1px;
  background: linear-gradient(to bottom, var(--cyan), var(--purple), transparent);
}

/* Item */
.exp-item {
  padding-left: 3rem;
  margin-bottom: 3.5rem;
  position: relative;
  opacity: 0;
  transform: translateX(-20px);
  transition: opacity .6s var(--ease-out), transform .6s var(--ease-out);
}
.exp-item.visible {
  opacity: 1;
  transform: translateX(0);
}

.exp-dot {
  position: absolute;
  left: -6px; top: 4px;
  width: 13px; height: 13px;
  background: var(--black);
  border: 2px solid var(--cyan);
  border-radius: 50%;
  transition: all .3s;
}
.exp-item:hover .exp-dot {
  background: var(--cyan);
  box-shadow: 0 0 15px var(--cyan);
}

.exp-period {
  font-family: var(--font-mono);
  font-size: .75rem;
  color: var(--cyan);
  letter-spacing: .1em;
  margin-bottom: .5rem;
}

.exp-title {
  font-size: 1.2rem;
  font-weight: 800;
  color: var(--white);
  margin-bottom: .3rem;
}

.exp-company {
  font-size: .9rem;
  color: var(--purple);
  font-weight: 600;
  margin-bottom: 1rem;
}

.exp-bullets {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}

.exp-bullets li {
  font-size: .9rem;
  color: var(--grey);
  line-height: 1.6;
  padding-left: 1.2rem;
  position: relative;
}

.exp-bullets li::before {
  content: '▸';
  position: absolute;
  left: 0;
  color: var(--cyan);
  font-size: .7rem;
}

@media (max-width: 768px) {
  .timeline::before { left: 4px; }
  .exp-item { padding-left: 1.5rem; margin-bottom: 2rem; }
  .exp-dot { left: -8px; }
  .exp-title { font-size: 1.1rem; }
  .exp-company, .exp-period { font-size: .85rem; }
  .exp-bullets li { padding-left: 1rem; }
}