/* SCHEDULE: вертикальный тайм-лайн с marker-точками.
   z-index:3 — секция должна перекрывать sticky-фото venue в location выше. */

.schedule {
  position: relative;
  z-index: 3;
  background: var(--color-bg);
}

.schedule__list {
  position: relative;
  max-width: 720px;
  margin: 0 auto;
  list-style: none;
  padding: 0;
  /* Прогресс «рисования» линии: 0…1 (управляется GSAP-скроллом
     в animations.js, либо стоит на 1 как fallback). */
  --timeline-progress: 1;
}

/* Вертикальная линия — нарисованная фломастером.
   Скрытая часть «обрезается» через linear-gradient mask. */
.schedule__list::before {
  content: "";
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: clamp(80px, 12vw, 110px);
  width: var(--stroke-mid);
  background: var(--color-gold);
  filter: url(#marker-rough);
  opacity: 0.7;
  --p: calc(var(--timeline-progress) * 100%);
  -webkit-mask-image: linear-gradient(to bottom, #000 0, #000 var(--p), transparent var(--p));
          mask-image: linear-gradient(to bottom, #000 0, #000 var(--p), transparent var(--p));
}

.schedule__item {
  position: relative;
  display: grid;
  grid-template-columns: clamp(80px, 12vw, 110px) 1fr;
  align-items: start;
  gap: clamp(20px, 3vw, 40px);
  padding: clamp(16px, 2vw, 24px) 0;
}

.schedule__item::before {
  content: "";
  position: absolute;
  top: clamp(24px, 2.6vw, 32px);
  left: clamp(80px, 12vw, 110px);
  transform: translate(-50%, -50%);
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--color-bg-deep);
  border: var(--stroke-mid) solid var(--color-gold);
  filter: url(#marker-rough);
  z-index: 1;
}

.schedule__item--soft::before {
  background: var(--color-gold);
  border-color: var(--color-gold-deep);
}

/* Пульс точки при попадании item'а в видимость (управляется GSAP) */
.schedule__item.is-pulsed::before {
  animation: schedule-pulse 800ms var(--ease-out-expo);
}
@keyframes schedule-pulse {
  0%   { box-shadow: 0 0 0 0   color-mix(in oklab, var(--color-gold) 60%, transparent); transform: translate(-50%, -50%) scale(1); }
  60%  { box-shadow: 0 0 0 14px transparent; transform: translate(-50%, -50%) scale(1.3); }
  100% { box-shadow: 0 0 0 0   transparent; transform: translate(-50%, -50%) scale(1); }
}

.schedule__time {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(1.2rem, 2.4vw, 1.7rem);
  color: var(--color-gold-deep);
  text-align: right;
  letter-spacing: 0.02em;
  padding-top: 4px;
  font-variant-numeric: tabular-nums;
}

.schedule__body {
  padding-left: clamp(8px, 1.5vw, 16px);
}
.schedule__title {
  font-family: var(--font-display);
  font-size: clamp(1.3rem, 2.2vw, 1.6rem);
  font-weight: 500;
  color: var(--color-ink);
  margin-bottom: 6px;
}
.schedule__desc {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  color: var(--color-muted);
  line-height: 1.65;
}

@media (max-width: 520px) {
  .schedule__list::before { left: 68px; }
  .schedule__item { grid-template-columns: 68px 1fr; gap: 16px; }
  .schedule__item::before { left: 68px; }
  .schedule__time { font-size: 1.05rem; }
}