/* ---------- Design tokens ---------- */
:root{
  --bg:#f4f5f7; --panel:#ffffff; --ink:#1d2733; --muted:#697586;
  --line:#e3e8ee; --brand:#0b5cad; --brand-dark:#083f77;
  --accent:#c8102e; --chip:#eef3fb; --chip-ink:#0b5cad;
  --radius:10px; --shadow:0 1px 3px rgba(16,32,64,.08),0 1px 2px rgba(16,32,64,.06);
  --maxw:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 20px}

/* ---------- Header / footer ---------- */
.site-header{
  background:linear-gradient(135deg,var(--brand),var(--brand-dark));
  color:#fff; padding:26px 0 22px; box-shadow:var(--shadow);
}
.site-header h1{margin:0; font-size:1.7rem; letter-spacing:.2px}
.subtitle{margin:.35rem 0 0; opacity:.9; font-size:.95rem}
.header-inner{display:flex; align-items:flex-start; gap:24px; flex-wrap:wrap}
.site-logo{flex:0 0 auto; width:180px; height:auto; background:#fff;
  padding:10px 14px; border-radius:10px; box-shadow:var(--shadow)}
.header-body{flex:1 1 320px; min-width:0}
.header-intro{margin-top:12px; max-width:78ch}
.header-intro p{margin:.5rem 0 0; font-size:.92rem; line-height:1.55; color:rgba(255,255,255,.92)}
.site-header a{color:#fff; text-decoration:underline; text-underline-offset:2px}
.site-header a:hover{color:#dbe9fb}
@media(max-width:520px){ .site-logo{width:150px} }
.site-footer{margin-top:40px; padding:22px 0 40px; color:var(--muted); font-size:.85rem; border-top:1px solid var(--line)}
.site-footer .muted{opacity:.8; margin:.3rem 0 0}
.site-footer p{margin:.2rem 0}
.site-footer .foot-org{font-weight:600; color:var(--ink); margin:0 0 .15rem}
.site-footer a{color:var(--brand)}
.site-footer a:hover{text-decoration:underline}
code{background:#e9edf3; padding:1px 5px; border-radius:4px; font-size:.85em}

/* ---------- Layout ---------- */
.layout{display:grid; grid-template-columns:290px 1fr; gap:26px; align-items:start; margin-top:26px}
@media(max-width:820px){ .layout{grid-template-columns:1fr} }

/* ---------- Filters ---------- */
.filters{
  background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:18px; position:sticky; top:16px;
}
@media(max-width:820px){ .filters{position:static} }
.filter-block{margin-bottom:16px}
.filter-block label{display:block; font-weight:600; font-size:.8rem; text-transform:uppercase;
  letter-spacing:.04em; color:var(--muted); margin-bottom:6px}
.hint{font-weight:400; text-transform:none; letter-spacing:0; color:var(--muted)}
.filters input[type=search],.filters select{
  width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:8px;
  background:#fff; color:var(--ink); font-size:.92rem;
}
.filters input:focus,.filters select:focus{outline:2px solid var(--brand); outline-offset:1px; border-color:var(--brand)}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:12px}

.group-list{margin-top:8px; max-height:280px; overflow:auto; border:1px solid var(--line); border-radius:8px}
.group-list button{
  display:flex; justify-content:space-between; gap:8px; width:100%; text-align:left;
  border:0; background:none; padding:6px 10px; font-size:.88rem; color:var(--ink); cursor:pointer;
  border-bottom:1px solid #f0f2f6;
}
.group-list button:last-child{border-bottom:0}
.group-list button:hover{background:var(--chip)}
.group-list button.active{background:var(--brand); color:#fff; font-weight:600}
.group-list button .n{color:var(--muted); font-variant-numeric:tabular-nums}
.group-list button.active .n{color:#dbe9fb}
.group-list .grp-region{font-size:.72rem; color:var(--muted); text-transform:uppercase; letter-spacing:.04em;
  padding:8px 10px 2px; position:sticky; top:0; background:#fbfcfe}
.group-list button.active .n{color:#e7f0fb}

.reset{
  width:100%; padding:9px; border:1px solid var(--line); background:#fff; color:var(--brand);
  border-radius:8px; font-weight:600; cursor:pointer;
}
.reset:hover{background:var(--chip)}

/* ---------- Results ---------- */
.results-bar{display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:space-between;
  margin-bottom:14px}
.crumbs{display:flex; flex-wrap:wrap; gap:6px; align-items:center}
.crumb{display:inline-flex; align-items:center; gap:6px; background:var(--chip); color:var(--chip-ink);
  border-radius:999px; padding:3px 6px 3px 11px; font-size:.82rem; font-weight:600}
.crumb button{border:0; background:rgba(11,92,173,.15); color:var(--chip-ink); width:18px; height:18px;
  border-radius:50%; cursor:pointer; line-height:1; font-size:.8rem}
.crumb button:hover{background:var(--accent); color:#fff}
.results-tools{display:flex; align-items:center; gap:14px}
.count{color:var(--muted); font-size:.9rem; white-space:nowrap}
.sort{font-size:.85rem; color:var(--muted); display:flex; align-items:center; gap:6px}
.sort select{padding:5px 8px; border:1px solid var(--line); border-radius:7px; background:#fff}

.event-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px}
.event{
  background:var(--panel); border:1px solid var(--line); border-left:4px solid var(--brand);
  border-radius:var(--radius); box-shadow:var(--shadow); padding:14px 16px;
}
.event.sig{border-left-color:var(--accent)}
.event-top{display:flex; flex-wrap:wrap; gap:8px 12px; align-items:baseline}
.event .date{font-weight:700; color:var(--brand-dark); font-variant-numeric:tabular-nums; white-space:nowrap}
.event .date .time{font-weight:400; color:var(--muted); font-size:.85em; margin-left:6px}
.event h3{margin:2px 0 0; font-size:1.06rem; line-height:1.35; flex-basis:100%; cursor:pointer}
.event h3:hover{color:var(--brand)}
.badges{display:flex; flex-wrap:wrap; gap:6px; margin:8px 0 0}
.badge{font-size:.74rem; font-weight:600; padding:2px 9px; border-radius:999px;
  background:var(--chip); color:var(--chip-ink); cursor:pointer; border:0}
.badge:hover{background:var(--brand); color:#fff}
.badge.region{background:#eef7ee; color:#1c6b2b}
.badge.region:hover{background:#1c6b2b; color:#fff}
.badge.type{background:#f3eefb; color:#6a3db8; cursor:default}
.badge.type:hover{background:#f3eefb; color:#6a3db8}
.meta{color:var(--muted); font-size:.9rem; margin:8px 0 0}
.meta .who{color:var(--ink); font-weight:600}
.teaser{margin:8px 0 0; color:#33414f}
.event .full{margin:10px 0 0; white-space:pre-wrap; color:#33414f; border-top:1px dashed var(--line); padding-top:10px}
.event .full[hidden]{display:none}
.more{margin-top:8px; background:none; border:0; color:var(--brand); font-weight:600; cursor:pointer; padding:0; font-size:.9rem}
.more:hover{text-decoration:underline}

.empty{background:var(--panel); border:1px dashed var(--line); border-radius:var(--radius);
  padding:40px; text-align:center; color:var(--muted)}
.sentinel{height:1px}
.loading-more{text-align:center; color:var(--muted); padding:16px; font-size:.9rem}

.spinner{display:inline-block; width:16px; height:16px; border:2px solid var(--chip);
  border-top-color:var(--brand); border-radius:50%; animation:spin .7s linear infinite; vertical-align:-3px; margin-right:6px}
@keyframes spin{to{transform:rotate(360deg)}}
