/* =============================================================
   agenda.css — Agenda page (mobile-first).
   Attendees will open this ON THEIR PHONES at the venue, so the
   schedule must be readable and tappable at small widths.
   ============================================================= */

/* ---- Agenda hero ---- */
.agenda-hero { background: linear-gradient(160deg,#094e33 0%, #0c6441 60%, #1f9d63 100%); color:#fff; }

/* ---- Sticky track filter ---- */
.track-bar {
  position: sticky; top: var(--header-h); z-index: 30;
  background: rgba(255,255,255,.96); backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--grey-200);
}
.track-scroll { display:flex; gap:.5rem; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.track-scroll::-webkit-scrollbar { display:none; }
.track-chip {
  flex:0 0 auto; white-space:nowrap; cursor:pointer;
  padding:.5rem 1rem; border-radius:9999px; font-weight:600; font-size:.9rem;
  border:1px solid var(--grey-300); color: var(--grey-600); background:#fff;
  transition: all .15s ease;
}
.track-chip:hover { border-color: var(--entre-green); color: var(--entre-green-dark); }
.track-chip.active { background: var(--entre-green); border-color: var(--entre-green); color:#fff; }

/* ---- Session card ---- */
.session {
  border:1px solid var(--grey-200); border-radius:16px; background:#fff;
  overflow:hidden; transition: box-shadow .2s ease, border-color .2s ease;
}
.session:hover { box-shadow: 0 14px 30px -18px rgba(27,31,29,.4); border-color: var(--grey-300); }
.session.hide { display:none; }

.session-time {
  font-family:'Poppins',sans-serif; font-weight:700; color: var(--entre-green-dark);
  font-variant-numeric: tabular-nums;
}

/* Track color dots / labels */
.tk { display:inline-flex; align-items:center; gap:.4rem; font-size:.72rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:.25rem .6rem; border-radius:9999px; }
.tk-keynote  { background:#eaf6ec; color:#1f5a2a; }
.tk-workshop { background:#e6f3fa; color:#0e6ea0; }
.tk-panel    { background:#f3eefb; color:#6b3fa0; }
.tk-expo     { background:#fff0e6; color:#c25f22; }
.tk-break    { background:var(--grey-100); color:var(--grey-600); }
.tk-award    { background:#fdf3e0; color:#9a6b12; }
.tk-mixer    { background:#e9e4fb; color:#5b3fb0; }

/* ---- Speaker ---- */
.speaker-ava {
  width:44px; height:44px; border-radius:9999px; flex:0 0 auto;
  background: linear-gradient(135deg,#d9efdd,#eaf6ec); color: var(--entre-green-dark);
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.85rem;
  border:2px solid #fff; box-shadow:0 0 0 1px var(--grey-200); object-fit:cover;
}
/* bio accordion */
.bio { max-height:0; overflow:hidden; transition: max-height .3s ease; }
.bio.open { max-height: 400px; }
.bio-toggle svg { transition: transform .25s ease; }
.bio-toggle.open svg { transform: rotate(180deg); }

/* ---- Recording pill ---- */
.rec-pill {
  display:inline-flex; align-items:center; gap:.5rem; font-weight:600; font-size:.85rem;
  padding:.5rem .9rem; border-radius:9999px;
}
.rec-soon { background: var(--grey-100); color: var(--grey-500); }
.rec-live { background: var(--entre-green); color:#fff; }

/* ---- Timeline rail (desktop) ---- */
@media (min-width: 768px){
  .rail { position:relative; padding-left: 0; }
}

/* ---- Archive cards ---- */
.archive-card { border:1px solid var(--grey-200); border-radius:16px; background:#fff; transition: all .2s ease; }
.archive-card:hover { transform: translateY(-3px); box-shadow:0 18px 36px -20px rgba(27,31,29,.4); }
.archive-badge { font-size:.68rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:.2rem .55rem; border-radius:9999px; }

/* Agenda phase headers */
.phase-head { margin: 2rem 0 .5rem; padding-top: 1.25rem; border-top: 2px solid var(--grey-200); }
.phase-head:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
.phase-kicker { display:inline-flex; align-items:center; gap:.5rem; font-size:.72rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color: var(--entre-green); }
.phase-name { font-family:'Poppins',sans-serif; font-weight:800; font-size:clamp(1.3rem,3.5vw,1.7rem); color: var(--ink-900,#1b1f1d); line-height:1.15; margin-top:.35rem; }
.phase-time { font-size:.9rem; font-weight:600; color: var(--grey-500); margin-top:.15rem; }
.tk-lab   { background:#e6f3fa; color:#0e6ea0; }
.tk-hub   { background:#e9e4fb; color:#5b3fb0; }