/* Next events strip — calm, modern */
.section--next { padding-top: 32px; }
.next-head { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; }
.next-sub { color:#667085; margin:0; }

/* --- Next events strip (fixed) --- */

.events-scroll{
  display: grid;
  grid-auto-flow: column;

  /* Fix: make each implicit column a fixed, clamped width so it
     doesn’t expand against the viewport and push the page wider */
  grid-auto-columns: clamp(240px, 80vw, 320px);

  gap: 14px;
  padding: 14px 12px 4px;

  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;

  scroll-snap-type: x proximity;           /* 'proximity' is less jumpy than 'mandatory' */
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;          /* don’t bubble scroll to the page */
}

/* Ensure children never force the scroller to grow wider than intended */
.events-scroll > * { min-width: 0; }

/* Optional: slightly wider cards on big screens */
@media (min-width: 900px){
  .events-scroll{ grid-auto-columns: clamp(280px, 28vw, 360px); }
}

/* Card (keep your existing styles; just remove any fixed widths) */
.event-card-mini{
  scroll-snap-align: start;
  background:#fff; border:1px solid #eef1f4; border-radius:16px; padding:14px;
  box-shadow:0 6px 22px rgba(16,24,40,.06);
  display:flex; flex-direction:column; gap:8px; min-height:150px;
  transition:transform .1s ease, box-shadow .15s ease, border-color .15s ease;
}

.events-scroll::-webkit-scrollbar{ height:8px }
.events-scroll::-webkit-scrollbar-thumb{ background:#d8dde6; border-radius:999px }

.event-card-mini{
  scroll-snap-align:start;
  background:#fff; border:1px solid #eef1f4; border-radius:16px; padding:14px;
  box-shadow:0 6px 22px rgba(16,24,40,.06);
  display:flex; flex-direction:column; gap:8px; min-height:150px;
  transition:transform .1s ease, box-shadow .15s ease, border-color .15s ease;
}
.event-card-mini:hover{ transform:translateY(-2px); box-shadow:0 10px 32px rgba(16,24,40,.08) }
.event-card-mini .eyebrow{ font-size:12px; color:#667085; display:flex; gap:8px; align-items:center }
.event-card-mini .eyebrow .dot{ width:6px; height:6px; background:#f59e0b; border-radius:999px; opacity:.9 }
.event-card-mini .title{ font-weight:700; letter-spacing:-.01em; margin:4px 0 0 }
.event-card-mini .meta{ font-size:13px; color:#475467 }
.event-card-mini .actions{ margin-top:auto; display:flex; gap:8px; align-items:center; flex-wrap:wrap }
.event-card-mini .actions .button{ padding:8px 10px; border-radius:10px; font-size:14px }
.event-card-mini .badge{ margin-left:auto; font-size:11px; color:#b45309; background:#fff8eb; border:1px solid #ffe7c2; padding:3px 8px; border-radius:999px }

.event-card .event-card__title{ font-size: clamp(20px, 2.2vw, 28px); letter-spacing:-.01em; margin: 2px 0 6px; }
.event-card .event-card__meta{ color:#667085; font-size:14px; margin: 0 0 10px; }
.event-card .event-card__actions .button{ padding:10px 14px; border-radius:12px; }

/* badges */
.badge {
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; padding:2px 8px; border-radius:999px;
  border:1px solid rgba(0,0,0,.08); background:#fff; color:#0e1116;
}
.badge--major { border-color:#ffae76; background:#fff7ef; }
.badge--free  { border-color:#9ed39f; background:#eef9ef; }

/* info button */
.icon-btn{
  appearance:none; border:1px solid var(--line, #eef1f4);
  background:#fff; border-radius:10px; padding:6px 8px; cursor:pointer;
  font-weight:700; line-height:1; min-width:34px;
}
.icon-btn:hover{ background:#fafafa; }

/* collapsible panel */
.mini-more{ margin-top:10px; border-top:1px dashed var(--line, #eef1f4); padding-top:10px; }
.mini-desc{ margin:0 0 8px; color:#475467; }
.mini-label{ margin:0 0 4px; font-weight:600; color:#0e1116; }
.mini-list{ margin:0; padding-left:18px; color:#344054; }
.event-card-mini .actions{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }




/* container holds edge fades & buttons */
.events-wrap{
  position: relative;
  /* prevent the scroller from “widening” the page */
  overflow: clip;            /* modern, safer than hidden */
}

/* horizontal scroller - FLEX (no overflow bugs) */
.events-scroll{
  display: flex;
  gap: 14px;
  padding: 14px 12px 4px;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;     /* gentler than mandatory */
  scroll-padding-inline: 12px;       /* first snap aligns nicely with left padding */
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;

  /* Edge fade hint (works in modern browsers) */
  mask-image: linear-gradient(to right, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%);
}

/* Card width: fixed-but-clamped, no growth */
.events-scroll > *{
  flex: 0 0 clamp(240px, 80vw, 320px);
  min-width: 0;
  scroll-snap-align: start;
}

@media (min-width: 900px){
  .events-scroll > *{ flex-basis: clamp(280px, 28vw, 360px); }
}

/* optional: slimmer, nicer scrollbar */
.events-scroll::-webkit-scrollbar{ height: 8px }
.events-scroll::-webkit-scrollbar-thumb{ background:#d8dde6; border-radius:999px }
.events-scroll{ scrollbar-width: thin; }

/* Prev/Next buttons */
.events-btn{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  inline-size: 36px;
  block-size: 36px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  border: 1px solid #eaecef;
  background: #fff;
  color: #0e1116;
  box-shadow: 0 6px 22px rgba(16,24,40,.06);
  cursor: pointer;
  z-index: 1;
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
  opacity: .95;
}
.events-btn:hover{ transform: translateY(-50%) scale(1.05); box-shadow: 0 10px 32px rgba(16,24,40,.09); }

.events-btn--prev{ left: 6px; }
.events-btn--next{ right: 6px; }

/* hide buttons on very small screens */
@media (max-width: 420px){
  .events-btn{ display:none; }
}

/* global guards against white bar */
html, body { width: 100%; overflow-x: hidden; }
body { overflow-x: clip; }