/* Events page (ACR-1615): the calendar and the event list that the live /events/events.js draws (kit extension).
   Only the kit's own values: ink #202d32 and muted #606b70 (--site-ink, --site-muted), action #14638f, blue #2180b8,
   line #d6e2ea, tint #edf3f8, paper #fafbfc and white; the kit's label (13px 600), card heading (1.625rem, 1.5rem under 900px),
   question (1.125rem, 1rem under 640px) and body (1rem, 1.7) type; the kit's card radius 1rem and button (.nx-button) look.
   Class names are kx-events-*; .event-card, .event-meta, .past-label, .button, .empty-state, .today and .ui-icon are the
   names events.js writes, so they are styled here, inside .kx-events-grid only. */

.kx-events-grid{display:grid;grid-template-columns:minmax(0,22rem) minmax(0,1fr);gap:3rem;align-items:start;text-align:left}
.kx-events-grid .ui-icon{width:17px;height:17px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* ---------- Calendar panel ---------- */
.kx-events-calendar{padding:1.5rem;border:1px solid #d6e2ea;border-radius:1rem;background:#fff}
.kx-events-month{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.kx-events-month h2{font:600 1.125rem/1.4 NexusManrope,Manrope,system-ui,sans-serif;letter-spacing:-.01em;color:var(--site-ink);text-align:center}
.kx-events-month button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:#14638f;cursor:pointer}
.kx-events-month button:hover{background:#edf3f8}
.kx-events-weekdays,.kx-events-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));text-align:center}
.kx-events-weekdays{margin:1.25rem 0 .5rem;font:600 .8125rem/1.4 var(--site-body);color:var(--site-muted)}
.kx-events-days{gap:.25rem}
.kx-events-days>span,.kx-events-days>button{display:grid;place-items:center;height:40px;padding:0;border:1px solid transparent;border-radius:.75rem;background:transparent;font:400 1rem/1.7 var(--site-body);color:var(--site-ink)}
.kx-events-days>button{border-color:#2180b8;background:#edf3f8;color:#14638f;cursor:pointer}
.kx-events-days>button:hover{background:#fff;border-color:#14638f}
.kx-events-days .today{box-shadow:inset 0 0 0 1px #14638f}
.kx-events-days>button:focus-visible{outline:2px solid #2180b8;outline-offset:2px}
.kx-events-key{display:flex;align-items:center;gap:.5rem;margin:1.25rem 0 0;font:600 .8125rem/1.4 var(--site-body);color:var(--site-muted)}
.kx-events-key span{width:8px;height:8px;border-radius:50%;background:#14638f;flex-shrink:0}
.kx-events-upcoming{margin-top:.5rem;padding:.75rem 0;min-height:44px;border:0;background:transparent;font:600 .8125rem/1.4 var(--site-body);color:#14638f;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.kx-events-upcoming:hover{color:#0f5479}

/* ---------- Event list ---------- */
.kx-events-heading{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:.5rem 1.25rem;margin-bottom:1.5rem}
.kx-events-heading h2{font:600 1.625rem/1.2 NexusManrope,Manrope,system-ui,sans-serif;letter-spacing:-.02em;color:var(--site-ink);text-wrap:balance}
.kx-events-heading p{font:600 .8125rem/1.4 var(--site-body);color:var(--site-muted)}
#event-cards{display:grid;gap:1.5rem}
.kx-events-grid .event-card{padding:2rem;border:1px solid #d6e2ea;border-radius:1rem;background:#fff;text-align:left}
.kx-events-grid .event-card:focus{outline:2px solid #2180b8;outline-offset:3px}
.kx-events-grid .event-card>.event-meta{display:flex;flex-wrap:wrap;gap:.25rem 1rem;font:600 .8125rem/1.4 var(--site-body);color:#14638f}
.kx-events-grid .event-card>.past-label{margin-top:.5rem;font:600 .8125rem/1.4 var(--site-body);color:var(--site-muted)}
.kx-events-grid .event-card>h3{margin-top:1rem;font:600 1.625rem/1.2 NexusManrope,Manrope,system-ui,sans-serif;letter-spacing:-.02em;color:var(--site-ink);text-wrap:balance}
.kx-events-grid .event-card>p:not(.event-meta):not(.past-label){margin-top:1rem;font:400 1rem/1.7 var(--site-body);color:var(--site-muted)}
.kx-events-grid .event-card>.button{display:inline-flex;align-items:center;justify-content:center;gap:22px;min-height:48px;margin-top:1.75rem;padding:13px 25px;border-radius:99px;background:#14638f;color:#fff;font:600 .8125rem/1.3 var(--site-body);text-decoration:none}
.kx-events-grid .event-card>.button:hover{background:#0f5479}
.kx-events-grid .empty-state{padding:1.5rem;border:1px solid #d6e2ea;border-radius:1rem;background:#fafbfc;font:400 1rem/1.7 var(--site-body);color:var(--site-muted)}
.kx-events-grid .empty-state a,.kx-events-list noscript a{color:#14638f;text-decoration:underline;text-underline-offset:3px}
.kx-events-note{margin-top:1.5rem;font:400 1rem/1.7 var(--site-body);color:var(--site-muted)}

@media(max-width:900px){
 .kx-events-grid{grid-template-columns:minmax(0,1fr);gap:2rem}
 .kx-events-calendar{max-width:26rem;width:100%;justify-self:center}
 .kx-events-heading h2,.kx-events-grid .event-card>h3{font-size:1.5rem}
}
@media(max-width:640px){
 .kx-events-month h2{font-size:1rem}
 .kx-events-grid .event-card{padding:1.5rem}
 .kx-events-grid .event-card>.button{font-size:.75rem}
}