/* The calendar deliberately only uses Wizardeo's theme tokens. */
.events-calendar {
  --calendar-text: var(--wz-text-color, #212529);
  --calendar-muted: color-mix(in srgb, var(--wz-text-color, #212529) 62%, transparent);
  --calendar-surface: var(--wz-surface-bg, #fbf3e8);
  --calendar-elevated: var(--wz-surface-elevated, #f3e5d2);
  --calendar-border: color-mix(in srgb, var(--primary-wizardeo) 25%, transparent);
  padding: .75rem 0 5rem;
  color: var(--calendar-text);
}

.events-calendar__hero { max-width: 820px; margin: 0 auto clamp(1.75rem, 3vw, 2.75rem); text-align: center; }

.section-kicker {
  color: var(--primary-wizardeo);
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.events-calendar__hero h1 { margin: .1rem 0 .55rem; font-size: clamp(2.3rem, 5vw, 4.1rem); font-weight: 800; letter-spacing: -.055em; line-height: 1.05; text-align: center; }.events-calendar__hero h1 span, .events-calendar__hero h1 em { display: inline-block; color: var(--primary-wizardeo); font-style: normal; }
.events-calendar__hero p { max-width: 700px; margin: 0 auto; color: var(--calendar-muted); font-size: clamp(1rem, 1.5vw, 1.12rem); line-height: 1.65; }
.events-calendar__hero .events-calendar__month { display: table; margin: 0 auto 1.15rem; padding: .55rem .9rem; border: 1px solid color-mix(in srgb, var(--primary-wizardeo) 48%, transparent); border-radius: 999px; background: color-mix(in srgb, var(--primary-wizardeo) 12%, transparent); color: var(--primary-wizardeo-lighter, var(--primary-wizardeo)); font-size: clamp(1rem, 2vw, 1.18rem); font-weight: 900; letter-spacing: .035em; line-height: 1.2; }

.events-month { margin: 0 auto 3rem; padding: clamp(1rem, 2.5vw, 1.5rem); border: 1px solid var(--calendar-border); border-top: 3px solid var(--primary-wizardeo); border-radius: 14px; background: linear-gradient(135deg, color-mix(in srgb, var(--primary-wizardeo) 7%, transparent), transparent 52%); }.events-month__header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }.events-month__header h2 { margin: .15rem 0 0; color: var(--calendar-text); font-size: clamp(1.25rem, 2.5vw, 1.65rem); font-weight: 800; text-transform: capitalize; }.events-month__controls { display: flex; gap: .4rem; }.events-month__controls button { display: grid; width: 2.35rem; height: 2.35rem; place-items: center; border: 1px solid var(--calendar-border); border-radius: 8px; background: transparent; color: var(--calendar-text); }.events-month__controls button:hover, .events-month__controls button:focus-visible { border-color: var(--primary-wizardeo); color: var(--primary-wizardeo); }.events-month__controls button[hidden] { display: none; }.events-month__weekdays, .events-month__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }.events-month__weekdays { margin-bottom: .35rem; color: var(--calendar-muted); font-size: .71rem; font-weight: 800; text-align: center; text-transform: uppercase; }.events-month__day { display: flex; min-height: 112px; flex-direction: column; gap: .35rem; padding: .45rem; border: 1px solid color-mix(in srgb, var(--calendar-border) 70%, transparent); }.events-month__day--empty { background: color-mix(in srgb, var(--calendar-text) 3%, transparent); }.events-month__day-number { color: var(--calendar-text); font-size: .78rem; font-weight: 800; }.events-month__day.is-today .events-month__day-number { display: grid; width: 1.5rem; height: 1.5rem; place-items: center; border-radius: 50%; background: var(--primary-wizardeo); color: #fff; }.events-month__event { position: relative; display: flex; flex-direction: column; align-items: stretch; min-width: 0; border: 1px solid color-mix(in srgb, var(--primary-wizardeo) 30%, transparent); border-radius: 5px; background: color-mix(in srgb, var(--primary-wizardeo) 12%, transparent); color: var(--calendar-text); font-size: .67rem; font-weight: 700; line-height: 1.25; text-decoration: none; }.events-month__event:hover, .events-month__event:focus-visible { z-index: 2; border-color: var(--primary-wizardeo); background: color-mix(in srgb, var(--primary-wizardeo) 22%, transparent); color: var(--calendar-text); }.events-month__event.is-active { border-color: var(--primary-wizardeo); background: var(--primary-wizardeo-darker, var(--primary-wizardeo)); color: #fff; }.events-month__event img { display: block; align-self: center; width: min(56%, 72px); height: auto; max-height: 42px; filter: grayscale(1); object-fit: contain; opacity: .72; }.events-month__event.is-active img { filter: none; opacity: 1; }.events-month__event b { padding: .35rem .4rem; font-weight: 800; overflow-wrap: anywhere; text-align: center; white-space: normal; }.events-month__event::after { position: absolute; z-index: 5; bottom: calc(100% + .45rem); left: 50%; width: max-content; max-width: 210px; padding: .45rem .6rem; border: 1px solid var(--calendar-border); border-radius: 7px; background: var(--calendar-elevated); box-shadow: 0 10px 20px -12px rgba(0, 0, 0, .9); color: var(--calendar-text); content: attr(data-tooltip); font-size: .74rem; font-weight: 700; line-height: 1.3; opacity: 0; pointer-events: none; transform: translate(-50%, .25rem); transition: opacity .15s ease, transform .15s ease; }.events-month__event:hover::after, .events-month__event:focus-visible::after { opacity: 1; transform: translate(-50%, 0); }

.sof-card { display: grid; grid-template-columns: minmax(260px, 34%) minmax(0, 1fr); gap: clamp(1.5rem, 3vw, 3rem); align-items: center; margin: 0 auto 3.25rem; padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid var(--calendar-border); border-top: 4px solid var(--primary-wizardeo); border-radius: 16px; background: linear-gradient(135deg, color-mix(in srgb, var(--primary-wizardeo) 12%, var(--calendar-surface, transparent)), var(--calendar-surface, transparent) 58%); box-shadow: 0 18px 36px -30px rgba(0, 0, 0, .9); }

.sof-card__image, .event-card__image { display: grid; place-items: center; color: var(--primary-wizardeo); font-size: 2rem; }.sof-card__image img, .event-card__image img { display: block; width: auto; max-width: 100%; height: auto; max-height: none; }.sof-card h2 { margin: .7rem 0 .7rem; color: var(--calendar-text); font-size: clamp(1.45rem, 2.5vw, 2rem); font-weight: 800; line-height: 1.15; }.sof-card__copy { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; }.sof-card__date { margin-top: .45rem; padding: .25rem 0 .25rem .7rem; border-left: 3px solid var(--primary-wizardeo); color: var(--calendar-text); font-size: .88rem; }

.events-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin: 0 0 1.35rem; padding-bottom: .9rem; border-bottom: 1px solid var(--calendar-border); }.events-section-heading--all { margin-top: 3.25rem; }.events-section-heading h2 { margin: .15rem 0 0; color: var(--calendar-text); font-size: clamp(1.6rem, 3vw, 2rem); font-weight: 800; letter-spacing: -.03em; }.events-section-heading > span { color: var(--calendar-muted); font-size: .9rem; }.events-section-heading--live { position: relative; border-color: color-mix(in srgb, var(--primary-wizardeo) 55%, transparent); }.events-section-heading--live::after { position: absolute; bottom: -1px; left: 0; width: min(180px, 42vw); height: 3px; background: var(--primary-wizardeo); content: ""; }.events-section-heading--live .section-kicker { display: inline-flex; align-items: center; gap: .5rem; }.events-section-heading--live .section-kicker::before { width: 8px; height: 8px; border-radius: 50%; background: var(--primary-wizardeo); box-shadow: 0 0 0 0 color-mix(in srgb, var(--primary-wizardeo) 45%, transparent); animation: calendar-live-pulse 1.8s ease-out infinite; content: ""; }

.events-grid, .events-grid--active { display: grid; grid-template-columns: 1fr; gap: 0; }
.event-card { display: grid; grid-template-columns: minmax(230px, 300px) minmax(0, 1fr); gap: clamp(1.1rem, 3vw, 2.25rem); align-items: center; padding: 1.5rem 0; border-bottom: 1px solid var(--calendar-border); scroll-margin-top: calc(var(--navbar-offset, var(--navbar-height, 0px)) + 1rem); transition: transform .2s ease; }.event-card:hover { transform: translateX(.35rem); }.event-card--active { border-left: 4px solid var(--primary-wizardeo); padding-left: 1rem; background: linear-gradient(90deg, color-mix(in srgb, var(--primary-wizardeo) 9%, transparent), transparent 62%); }
.event-card__content { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; }.event-date { display: inline-flex; align-items: center; max-width: 100%; margin-top: .65rem; padding: .25rem 0 .25rem .7rem; border-left: 3px solid var(--primary-wizardeo); color: var(--calendar-text); font-size: .9rem; font-weight: 800; line-height: 1.4; }.event-date i { flex: 0 0 auto; color: var(--primary-wizardeo); margin-right: .4rem; }.event-card h3 { margin: .7rem 0 .7rem; color: var(--calendar-text); font-size: clamp(1.15rem, 2vw, 1.42rem); font-weight: 800; line-height: 1.25; }.event-description { display: grid; gap: .65rem; margin: 0 0 1rem; }.event-description p { margin: 0; color: var(--calendar-text); font-size: .94rem; line-height: 1.65; }.event-link { color: var(--primary-wizardeo-darker); font-size: .86rem; font-weight: 800; text-decoration: none; }.event-link:hover, .event-link:focus-visible { color: var(--primary-wizardeo); }.event-link i { margin-left: .22rem; font-size: .7rem; }.event-link--button { display: inline-flex; align-items: center; justify-content: center; align-self: center; gap: .6rem; width: 190px; margin-top: auto; padding: .8rem 1rem; border: 1px solid color-mix(in srgb, var(--primary-wizardeo) 45%, transparent); border-radius: 8px; background: color-mix(in srgb, var(--primary-wizardeo) 13%, transparent); color: var(--calendar-text); text-align: center; }.event-link--button:hover, .event-link--button:focus-visible { border-color: var(--primary-wizardeo); background: var(--primary-wizardeo); color: #fff; }.event-link--button i { display: inline-flex; align-items: center; margin-left: 0; font-size: .8rem; line-height: 1; }.status-pill { display: inline-flex; align-items: center; padding: .15rem 0; color: var(--primary-wizardeo-darker); font-size: .72rem; font-weight: 900; line-height: 1.15; text-transform: uppercase; letter-spacing: .12em; }.status-pill--live::before { content: ""; width: 9px; height: 9px; margin-right: .55rem; border-radius: 50%; background: var(--primary-wizardeo); box-shadow: 0 0 0 0 color-mix(in srgb, var(--primary-wizardeo) 45%, transparent); animation: calendar-live-pulse 1.8s ease-out infinite; }.events-calendar__empty { color: var(--calendar-muted); }

/* Calendar states: inactive entries deliberately recede; today does not change a grid row's height. */
.events-month__day { min-height: 0; }
.events-month__day.is-today .events-month__day-number { display: inline; width: auto; height: auto; border-radius: 0; background: transparent; color: var(--primary-wizardeo); }
.events-month__event:not(.is-active) { border-color: color-mix(in srgb, #8b8b8b 48%, transparent); background: color-mix(in srgb, #8b8b8b 16%, transparent); color: color-mix(in srgb, var(--calendar-text) 76%, transparent); }
.events-month__event:not(.is-active):hover, .events-month__event:not(.is-active):focus-visible { border-color: #aaa; background: color-mix(in srgb, #8b8b8b 25%, transparent); color: var(--calendar-text); }
.events-month__event img { width: min(48%, 60px); max-height: 36px; }

/* Compact calendar entries: a dark visual panel and a separate text panel. */
.events-month__event { flex-direction: row; align-items: stretch; justify-content: center; min-height: 50px; padding: 0; overflow: hidden; }
.events-month__event-media { display: grid; flex: 0 0 52px; min-width: 52px; place-items: center; background: color-mix(in srgb, var(--calendar-elevated) 72%, var(--primary-wizardeo-darker, #25344d)); }
.events-month__event img { align-self: center; width: 48px; height: 42px; max-height: none; border: 0; border-radius: 0; background: transparent; box-shadow: none; object-fit: contain; }
.events-month__event b { display: grid; flex: 1; place-items: center; padding: .3rem .4rem; text-align: center; }
.events-month__event:not(.is-active) .events-month__event-media { background: color-mix(in srgb, var(--calendar-elevated) 82%, #4a4e58); }

.events-month__controls .events-month__toggle { grid-template-columns: auto auto; width: auto; gap: .4rem; padding: 0 .7rem; font-size: .76rem; font-weight: 800; }
.events-month.is-collapsed [data-events-month-prev], .events-month.is-collapsed [data-events-month-next] { display: none; }
.events-month__scroll { max-height: 1800px; overflow: hidden; opacity: 1; transition: max-height .42s ease, opacity .22s ease; }
.events-month__header { transition: margin-bottom .32s ease; }
.events-month.is-collapsed .events-month__header { margin-bottom: 0; }
.events-month.is-collapsed .events-month__scroll { max-height: 0; overflow: hidden; opacity: 0; }
@media (prefers-reduced-motion: reduce) { .events-month__scroll, .events-month__header { transition: none; } }

@keyframes calendar-live-pulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--primary-wizardeo) 48%, transparent); } 70% { box-shadow: 0 0 0 9px color-mix(in srgb, var(--primary-wizardeo) 0%, transparent); } 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--primary-wizardeo) 0%, transparent); } }
@media (prefers-reduced-motion: reduce) { .events-section-heading--live .section-kicker::before, .status-pill--live::before, .event-card.is-anchor-target { animation: none; } }

.event-date { gap: .55rem; }
.event-date i { margin-right: 0; }
.event-card.is-anchor-target { animation: event-anchor-feedback 1.45s ease-out; }
@keyframes event-anchor-feedback { 0% { background-color: color-mix(in srgb, var(--primary-wizardeo) 24%, transparent); box-shadow: 0 0 0 0 color-mix(in srgb, var(--primary-wizardeo) 46%, transparent); } 38% { background-color: color-mix(in srgb, var(--primary-wizardeo) 15%, transparent); box-shadow: 0 0 0 9px color-mix(in srgb, var(--primary-wizardeo) 0%, transparent); } 100% { background-color: transparent; box-shadow: 0 0 0 0 transparent; } }

@media (max-width: 650px) { .events-calendar { padding-top: .5rem; padding-bottom: 3.5rem; }.events-calendar__hero { text-align: left; }.events-calendar__hero h1, .events-calendar__hero .events-calendar__month { text-align: center; }.events-calendar__hero .events-calendar__month { margin-right: auto; margin-left: auto; }.events-calendar__hero p { margin-left: 0; }.sof-card, .event-card { grid-template-columns: 1fr; }.sof-card { gap: 1.2rem; margin-bottom: 2.5rem; padding: 1rem; }.sof-card__image, .event-card__image { justify-items: start; }.sof-card__image img { max-height: none; }.sof-card__side { width: 100%; padding: .85rem 1rem; }.sof-card .event-date { text-align: left; }.events-section-heading { align-items: flex-start; flex-direction: column; }.events-month__weekdays { display: none; }.events-month__scroll { overflow: visible; }.events-month__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }.events-month__day { min-height: 132px; gap: .45rem; padding: .55rem; border: 1px solid var(--calendar-border); border-radius: 8px; }.events-month__day--empty { display: none; }.events-month__day-number { font-size: .9rem; }.events-month__event { font-size: .74rem; }.events-month__event img { flex-basis: 72px; width: 72px; height: 42px; }.events-month__event b { display: block; }.event-card { gap: 1rem; padding: 1.25rem 0; }.event-card--active { padding-left: .8rem; }.event-date { font-size: .85rem; }.events-section-heading--all { margin-top: 2.5rem; } }
@media (max-width: 650px) { .events-month__day { min-height: 0; }.events-month__event-media { flex-basis: 54px; min-width: 54px; }.events-month__event img { width: 48px; height: 36px; max-height: 36px; } }
