:root {
  --nl-navy: #073451;
  --nl-navy-dark: #05283e;
  --nl-green: #7e9f62;
  --nl-cream: #f7f4ee;
  --nl-line: #d8dee2;
  --nl-muted: #60707a;
  --nl-white: #fff;
}

.nl-calendar, .nl-upcoming { box-sizing: border-box; color: #17232b; font-family: inherit; }
.nl-upcoming { container-type: inline-size; }
.nl-calendar *, .nl-upcoming * { box-sizing: border-box; }
.nl-calendar a, .nl-upcoming a { text-decoration: none; }

.nl-calendar__hero { margin: 0 0 clamp(2rem, 5vw, 4.5rem); text-align: center; }
.nl-calendar__eyebrow { color: var(--nl-green); font-size: clamp(.95rem, 1.3vw, 1.25rem); font-weight: 750; letter-spacing: .02em; margin: 0 0 1rem; text-transform: uppercase; }
.nl-calendar__hero h2 { color: var(--nl-navy); font-size: clamp(2.25rem, 5vw, 4.6rem); font-weight: 800; letter-spacing: -.035em; line-height: 1.05; margin: 0; text-transform: uppercase; }
.nl-calendar__toolbar { align-items: center; display: grid; gap: 1rem; grid-template-columns: 1fr auto 1fr; margin-bottom: 1.25rem; }
.nl-calendar__toolbar h3 { color: #111; font-size: clamp(1.5rem, 2.3vw, 2.25rem); font-weight: 650; margin: 0; text-align: center; }
.nl-calendar__navigation { align-items: center; display: flex; gap: .5rem; }
.nl-icon-button, .nl-calendar__today { align-items: center; background: var(--nl-white); border: 1px solid #c8d2d8; border-radius: .35rem; color: var(--nl-navy); display: inline-flex; font: inherit; font-weight: 700; justify-content: center; min-height: 2.75rem; }
.nl-icon-button { font-size: 2rem; line-height: 1; width: 2.75rem; }
.nl-calendar__today { padding: .55rem 1rem; }
.nl-icon-button:hover, .nl-calendar__today:hover { background: var(--nl-navy); border-color: var(--nl-navy); color: white; }
.nl-icon-button:focus-visible, .nl-calendar__today:focus-visible, .nl-calendar-event:focus-visible, .nl-upcoming a:focus-visible { outline: 3px solid #e2a900; outline-offset: 2px; }
.nl-calendar__scroll { border: 1px solid var(--nl-line); overflow-x: auto; }
.nl-calendar__grid { border-collapse: collapse; table-layout: fixed; width: 100%; }
.nl-calendar__grid th { background: var(--nl-navy); border-right: 1px solid rgba(255,255,255,.18); color: white; font-size: .9rem; font-weight: 700; padding: .85rem .5rem; text-align: left; }
.nl-calendar__grid td { background: var(--nl-white); border: 1px solid var(--nl-line); height: 9.5rem; padding: .6rem; position: relative; vertical-align: top; width: 14.285%; }
.nl-calendar__grid td:nth-child(1), .nl-calendar__grid td:nth-child(7) { background: #fafbf8; }
.nl-calendar__grid td.is-other-month { background: #f4f5f5; color: #879198; }
.nl-calendar__date { align-items: center; display: inline-flex; font-size: 1rem; font-weight: 750; height: 1.8rem; justify-content: center; min-width: 1.8rem; }
.nl-calendar__grid td.is-today .nl-calendar__date { background: var(--nl-navy); border-radius: 50%; color: white; }
.nl-calendar__events { display: grid; gap: .35rem; margin-top: .45rem; }
.nl-calendar-event { background: var(--nl-event-tint, #edf3e9); border-left: 4px solid var(--nl-event-colour, var(--nl-green)); border-radius: 0 .25rem .25rem 0; color: #14222a; display: block; line-height: 1.25; overflow: hidden; padding: .45rem .5rem; }
.nl-calendar-event:hover { background: var(--nl-event-tint-hover, #dfead8); color: var(--nl-navy-dark); }
.nl-calendar-event__time { color: var(--nl-navy); display: block; font-size: .72rem; font-weight: 750; margin-bottom: .12rem; }
.nl-calendar-event__title { display: block; font-size: .82rem; font-weight: 700; overflow-wrap: anywhere; }
.nl-calendar-event__venue { color: var(--nl-muted); display: block; font-size: .7rem; margin-top: .15rem; }

.nl-upcoming__header { align-items: center; display: grid; gap: .75rem 1.25rem; grid-template-columns: minmax(0,1fr) max-content; margin-bottom: 1.5rem; width: 100%; }
.nl-upcoming__header h2 { color: var(--nl-navy); font-size: clamp(2rem, 7cqi, 3.75rem) !important; letter-spacing: -.035em; line-height: 1.05; margin: 0; min-width: 0; white-space: nowrap; }
.nl-upcoming__header a { align-items: center; color: var(--nl-navy); display: inline-flex; font-size: clamp(.95rem, 2.5cqi, 1.25rem); font-weight: 700; gap: .55rem; line-height: 1.2; white-space: nowrap; }
.nl-upcoming__header a:hover { text-decoration: underline; }
.nl-upcoming__list { display: grid; gap: .75rem; }
.nl-event-card { align-items: stretch; background: var(--nl-event-tint, #edf3e9); border: 1px solid #dbe4d5; border-left: 8px solid var(--nl-event-colour, var(--nl-green)); box-shadow: 0 4px 16px rgba(7,52,81,.07); display: grid; grid-template-columns: clamp(5.25rem, 18cqi, 7.5rem) minmax(0,1fr) clamp(2rem, 7cqi, 3rem); min-height: 7rem; position: relative; transition: box-shadow .2s ease, transform .2s ease; }
.nl-event-card:hover { box-shadow: 0 10px 28px rgba(7,52,81,.13); transform: translateY(-2px); }
.nl-event-card__link { inset: 0; position: absolute; z-index: 1; }
.nl-event-card__date { align-items: center; border-right: 1px solid #bccbd3; color: var(--nl-navy); display: flex; flex-direction: column; justify-content: center; margin: .8rem 0; text-align: center; }
.nl-event-card__date span { font-size: clamp(.78rem, 2.35cqi, .9rem); font-weight: 800; text-transform: uppercase; }
.nl-event-card__date strong { font-size: clamp(2.1rem, 7cqi, 2.65rem); letter-spacing: -.05em; line-height: .92; }
.nl-event-card__content { align-self: center; min-width: 0; padding: .9rem 1.15rem; }
.nl-event-card__content h3 { color: var(--nl-navy); font-size: clamp(1.05rem, 3.2cqi, 1.3rem); line-height: 1.2; margin: 0 0 .5rem; }
.nl-event-card__meta { color: var(--nl-muted); display: flex; flex-wrap: wrap; font-size: clamp(.78rem, 2.35cqi, .95rem); gap: .55rem 1.35rem; }
.nl-event-card__meta span { align-items: center; display: inline-flex; gap: .35rem; }
.nl-event-card__meta svg { fill: none; height: 1.05rem; stroke: var(--nl-green); stroke-width: 1.9; width: 1.05rem; }
.nl-event-card__arrow { align-self: center; color: var(--nl-navy); font-size: 2.3rem; }
.nl-upcoming__empty, .nl-events-notice { background: var(--nl-cream); border-left: 4px solid var(--nl-green); padding: 1rem 1.25rem; }

@media (max-width: 800px) {
  .nl-calendar__toolbar { grid-template-columns: 1fr; }
  .nl-calendar__toolbar h3 { grid-column: 1 / -1; grid-row: 1; }
  .nl-calendar__navigation { grid-column: 1; grid-row: 2; justify-content: center; }
  .nl-calendar__scroll { border: 0; overflow: visible; }
  .nl-calendar__grid, .nl-calendar__grid tbody, .nl-calendar__grid tr, .nl-calendar__grid td { display: block; width: 100%; }
  .nl-calendar__grid thead { display: none; }
  .nl-calendar__grid td { border-width: 0 0 1px; height: auto; min-height: 0; padding: 1rem 0; }
  .nl-calendar__grid td::before { color: var(--nl-navy); content: attr(data-date-label); display: block; font-size: 1rem; font-weight: 800; margin-bottom: .5rem; }
  .nl-calendar__grid td:has(.nl-calendar__events:empty) { display: none; }
  .nl-calendar__date { display: none; }
  .nl-calendar__events { margin: 0; }
  .nl-calendar-event { padding: .7rem .8rem; }
  .nl-calendar-event__time, .nl-calendar-event__title, .nl-calendar-event__venue { font-size: .9rem; }
}

@media (max-width: 600px) {
  .nl-icon-button { width: 2.5rem; }
  .nl-calendar__today { display: none; }
  .nl-upcoming__header { align-items: flex-start; display: flex; flex-direction: column; gap: .5rem; }
  .nl-upcoming__header h2 { white-space: normal; }
  .nl-event-card { grid-template-columns: 4.7rem 1fr 1.5rem; min-height: 6.25rem; }
  .nl-event-card__date strong { font-size: 2.25rem; }
  .nl-event-card__content { padding: .8rem; }
  .nl-event-card__meta { align-items: flex-start; flex-direction: column; }
}

@container (max-width: 32rem) {
  .nl-upcoming__header { align-items: flex-start; grid-template-columns: 1fr; }
  .nl-upcoming__header h2 { font-size: clamp(2rem, 10cqi, 3rem) !important; white-space: normal; }
  .nl-event-card { grid-template-columns: clamp(4.5rem, 20cqi, 5.25rem) minmax(0,1fr) 1.75rem; }
  .nl-event-card__content { padding: .8rem; }
  .nl-event-card__meta { align-items: flex-start; flex-direction: column; gap: .35rem; }
}

@media print {
  @page { size: Letter landscape; margin: .35in; }
  html, body { height: auto !important; margin: 0 !important; padding: 0 !important; width: 100% !important; }
  body * { visibility: hidden !important; }
  .nl-calendar, .nl-calendar * { visibility: visible !important; }
  .nl-calendar { background: white !important; color: black; left: 0; margin: 0 !important; max-width: none !important; padding: 0 !important; position: absolute; top: 0; width: 100%; }
  .nl-calendar__hero { margin: 0 0 .12in; }
  .nl-calendar__eyebrow, .nl-calendar__navigation { display: none !important; }
  .nl-calendar__hero h2 { color: var(--nl-navy) !important; font-size: 19pt; text-transform: none; }
  .nl-calendar__toolbar { display: block; margin-bottom: .1in; }
  .nl-calendar__toolbar h3 { font-size: 15pt; }
  .nl-calendar__scroll { border: 1px solid #777; display: block !important; overflow: visible; width: 100% !important; }
  .nl-calendar__grid { border-collapse: collapse !important; display: table !important; table-layout: fixed !important; width: 100% !important; }
  .nl-calendar__grid thead { display: table-header-group !important; }
  .nl-calendar__grid tbody { display: table-row-group !important; }
  .nl-calendar__grid tr { display: table-row !important; }
  .nl-calendar__grid th { background: var(--nl-navy) !important; color: white !important; font-size: 8.5pt; padding: .05in; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .nl-calendar__grid th, .nl-calendar__grid td { display: table-cell !important; width: 14.285% !important; }
  .nl-calendar__grid td { background: white !important; border: 1px solid #999 !important; height: .98in !important; min-height: 0 !important; padding: .035in; vertical-align: top !important; }
  .nl-calendar__grid td::before { content: none !important; display: none !important; }
  .nl-calendar__date { display: inline-flex !important; font-size: 8pt; height: .18in; min-width: .18in; }
  .nl-calendar__grid td.is-today .nl-calendar__date { background: transparent !important; color: black !important; }
  .nl-calendar__events { display: grid !important; gap: .02in; margin-top: .02in; }
  .nl-calendar-event { background: var(--nl-event-tint, #edf3e9) !important; border-left-color: var(--nl-event-colour, var(--nl-green)) !important; border-left-width: 2px; break-inside: avoid; color: black !important; padding: .025in .035in; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .nl-calendar-event__time, .nl-calendar-event__title { color: black !important; display: inline; font-size: 6.5pt; }
  .nl-calendar-event__time::after { content: " "; }
  .nl-calendar-event__venue { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .nl-event-card { transition: none; }
}