/* ============================================================
   OVERVIEW & AGENDA — page-scoped layer
   Loaded by overview-agenda.html ONLY, scoped under .oa (set on <body>),
   so nothing here leaks into the rest of the site. The page reuses the
   shared .pagehero / .facts / .banner / .faq / .agd__* components as-is;
   this file only adds the track-grid cards that are unique to this page.
   ============================================================ */

/* the shared .pagehero__bg crop (object-position:center 20%) assumes the
   subject sits near the top of the source photo; this page's conference-
   panel photo has its subjects (two seated speakers) in the lower half, so
   the default crop showed only the screen graphic above their heads —
   shift the visible window down to bring them into frame. */
.oa .pagehero__bg img{object-position:center 62%}

/* ============================================================
   THEMATIC TRACKS GRID
   ============================================================ */
.oa-trk__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.oa-trk{display:flex;flex-direction:column;gap:10px;padding:26px 24px;border-radius:var(--r-md);
  border:1px solid var(--brd);background:var(--glass);transition:all .25s var(--ease)}
.oa-trk:hover{background:var(--glass-hi);border-color:var(--brd-hi);transform:translateY(-2px)}
.oa-trk__ic{flex:0 0 52px;width:52px;height:52px;display:inline-flex;align-items:center;justify-content:center;
  border-radius:14px;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.14)}
.oa-trk__ic img{width:34px;height:34px;object-fit:contain;display:block}
.oa-trk h3{font-size:15.5px;line-height:1.3;font-weight:750;color:var(--ink)}
.oa-trk p{font-size:13.5px;line-height:1.55;color:var(--w55)}
@media (max-width:900px){.oa-trk__grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.oa-trk__grid{grid-template-columns:1fr}}

/* ============================================================
   LIVE SESSION SCHEDULE — extends the shared .agd__* components
   ============================================================ */
/* Each session card: time + title/type on top, then the joined speaker
   strip (photo, name, role) below — the shared .agd__row only has room
   for a title+description pair, so this adds the speaker line under it. */
.oa-sess__meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.oa-sess__tag{display:inline-flex;align-items:center;font-family:var(--f-m);font-size:10px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--w40);border:1px solid var(--brd);
  border-radius:999px;padding:4px 10px}
.oa-sess__speakers{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.oa-sess__sp{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--w55)}
.oa-sess__sp img{width:26px;height:26px;border-radius:50%;object-fit:cover;flex:none;background:var(--glass)}
.oa-sess__ph{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;
  flex:none;background:var(--wps-dark);color:#fff;font-size:9.5px;font-weight:700;letter-spacing:.02em}
.oa-sess__sp b{font-weight:600;color:var(--ink)}
.oa-sess__sp span{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--w40)}
.oa-mc{display:flex;align-items:center;gap:8px;margin-top:14px;padding-top:14px;border-top:1px solid var(--brd);
  font-size:12.5px;color:var(--w55)}
.oa-mc b{color:var(--ink);font-weight:600}
.programme-api-empty{max-width:900px;margin:22px auto 0}
.agenda-live{margin-top:22px}
.agenda-live .agd__days{grid-template-columns:repeat(3,minmax(0,1fr))}
.agenda-live__card{max-width:1100px;margin-inline:auto}
.agd__foot--center{justify-content:center}
.agenda-live__empty{list-style:none;padding:clamp(28px,5vw,56px);text-align:center;border:1px solid var(--brd);
  border-radius:18px;background:var(--glass)}
.agenda-live__empty strong{display:block;color:var(--ink);font-size:clamp(18px,2vw,24px);font-weight:750}
.agenda-live__empty p{max-width:620px;margin:10px auto 0;color:var(--w55);line-height:1.65}
.agenda-live .agd__row{grid-template-columns:minmax(70px,100px) minmax(0,1fr)}
html[dir="rtl"] .agenda-live{text-align:right}
html[dir="rtl"] .agenda-live .agd__time{direction:ltr;text-align:right}
@media (max-width:760px){
  .agenda-live .agd__days{grid-template-columns:1fr}
  .agenda-live .agd__row{grid-template-columns:1fr}
}