/* ==========================================================================
   PVSC history page. Scoped to .pv-history.
   ========================================================================== */

.pv-history {
  --pv-navy: #0a2540;
  --pv-navy-2: #0f3b66;
  --pv-blue: #1f74d4;
  --pv-sun: #f6c343;
  --pv-ink: #142033;
  --pv-muted: #5b6b80;
  --pv-line: #e5eaf1;
  --pv-soft: #f2f6fb;

  font-family: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  color: var(--pv-ink);
  margin-bottom: 40px;
}
.pv-history *, .pv-history *::before, .pv-history *::after { box-sizing: border-box; }

.pv-history-lead {
  font-size: 16px; line-height: 1.65; color: var(--pv-muted);
  max-width: 720px; margin: 0 0 24px;
}

/* ---------- Stats ---------- */
.pv-stats {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px;
  margin: 0 0 28px;
}
.pv-stat {
  padding: 16px 18px; border-radius: 12px;
  background: var(--pv-soft); border: 1px solid var(--pv-line);
}
.pv-stat-num { display: block; font-size: 28px; font-weight: 600; line-height: 1.1; color: var(--pv-navy); letter-spacing: -.02em; }
.pv-stat-label { display: block; margin-top: 4px; font-size: 12.5px; color: var(--pv-muted); }

/* ---------- Next conference ---------- */
.pv-next {
  position: relative; overflow: hidden;
  display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap;
  padding: 24px 26px; margin: 0 0 32px;
  border-radius: 16px; color: #fff;
  background:
    radial-gradient(90% 140% at 100% 0%, rgba(246, 195, 67, .32) 0%, rgba(246, 195, 67, 0) 60%),
    linear-gradient(135deg, var(--pv-navy) 0%, var(--pv-blue) 100%);
}
.pv-next-eyebrow { font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--pv-sun); }
.pv-next-title { margin: 4px 0 6px; font-size: 22px; font-weight: 600; line-height: 1.25; color: #fff; }
.pv-next-meta { font-size: 14px; color: rgba(255, 255, 255, .85); }
.pv-next-note { margin-top: 8px; font-size: 13px; color: rgba(255, 255, 255, .72); }
.pv-history a.pv-next-btn {
  flex: none;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 11px 18px; border-radius: 999px;
  font-size: 14px; font-weight: 600; text-decoration: none;
  color: var(--pv-navy); background: var(--pv-sun);
  transition: transform .15s, box-shadow .15s;
}
.pv-history a.pv-next-btn:hover { transform: translateY(-1px); box-shadow: 0 10px 20px -10px rgba(0, 0, 0, .5); color: var(--pv-navy); }

/* ---------- Decade jump links ---------- */
.pv-decades {
  position: sticky; top: 78px; z-index: 5;
  display: flex; flex-wrap: wrap; gap: 6px;
  padding: 10px 0; margin: 0 0 8px;
  background: rgba(255, 255, 255, .96);
  border-bottom: 1px solid var(--pv-line);
}
.pv-history a.pv-decade-chip {
  padding: 6px 12px; border-radius: 999px;
  font-size: 13px; font-weight: 500; text-decoration: none;
  color: var(--pv-navy-2); background: var(--pv-soft); border: 1px solid var(--pv-line);
  transition: background-color .15s, color .15s, border-color .15s;
}
.pv-history a.pv-decade-chip:hover { color: #fff; background: var(--pv-blue); border-color: var(--pv-blue); }

/* ---------- Timeline ---------- */
.pv-decade { scroll-margin-top: 140px; }
.pv-decade-title {
  display: flex; align-items: center; gap: 12px;
  margin: 28px 0 14px;
  font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  color: var(--pv-muted);
}
.pv-decade-title::after { content: ""; flex: 1; height: 1px; background: var(--pv-line); }

.pv-timeline { position: relative; margin: 0; padding: 0 0 0 28px; list-style: none; }
.pv-timeline::before {
  content: ""; position: absolute; left: 9px; top: 6px; bottom: 6px;
  width: 2px; border-radius: 2px; background: var(--pv-line);
}

.pv-event { position: relative; margin: 0 0 10px; }
.pv-event::before {
  content: ""; position: absolute; left: -24px; top: 22px;
  width: 12px; height: 12px; border-radius: 50%;
  background: #fff; border: 3px solid var(--pv-blue);
}
.pv-event.is-world::before { border-color: var(--pv-sun); }
.pv-event.is-virtual::before { border-color: #9aa8bb; }

.pv-event-card {
  display: flex; align-items: center; gap: 16px;
  padding: 14px 16px; border-radius: 12px;
  background: #fff; border: 1px solid var(--pv-line);
  transition: border-color .15s, box-shadow .15s;
}
.pv-event-card:hover { border-color: #cfdcef; box-shadow: 0 10px 22px -16px rgba(10, 37, 64, .45); }

.pv-event-num {
  flex: none;
  width: 52px; height: 52px; border-radius: 12px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  color: var(--pv-navy); background: var(--pv-soft);
  line-height: 1;
}
.pv-event-num small { font-size: 9px; font-weight: 600; letter-spacing: .1em; color: var(--pv-muted); }
.pv-event-num b { font-size: 20px; font-weight: 600; margin-top: 3px; }
.pv-event.is-world .pv-event-num { background: #fdf3d4; }

.pv-event-body { flex: 1; min-width: 0; }
.pv-event-place { font-size: 16px; font-weight: 600; color: var(--pv-navy); line-height: 1.3; }
.pv-event-venue { font-weight: 400; color: var(--pv-muted); }
.pv-event-meta { margin-top: 3px; font-size: 13px; color: var(--pv-muted); line-height: 1.5; }
.pv-event-meta .pv-dot { margin: 0 6px; opacity: .6; }

.pv-tag {
  display: inline-block; margin-left: 8px; vertical-align: 2px;
  padding: 2px 8px; border-radius: 999px;
  font-size: 10.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
}
.pv-tag-world { color: #6b4d00; background: #fdefc4; }
.pv-tag-virtual { color: #44546a; background: #e9edf3; }

.pv-history a.pv-event-link {
  flex: none;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 12px; border-radius: 8px;
  font-size: 13px; font-weight: 500; text-decoration: none;
  color: var(--pv-blue); background: #edf4fd;
  transition: background-color .15s, color .15s;
}
.pv-history a.pv-event-link:hover { color: #fff; background: var(--pv-blue); }

@media (max-width: 767px) {
  .pv-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pv-decades { top: 70px; }
  .pv-event-card { flex-wrap: wrap; gap: 12px; }
  .pv-event-num { width: 44px; height: 44px; }
  .pv-event-num b { font-size: 17px; }
  .pv-event-body { flex-basis: calc(100% - 60px); }
  .pv-history a.pv-event-link { margin-left: 56px; }
  .pv-next-title { font-size: 19px; }
}