/*!
 * Station Calendar — front-end styles
 * Matches the HBS event design system (Fraunces + Inter; ink / moss / sage / bloom / paper).
 * Scoped to .hbs-events and friends, with !important defenses against Divi's global heading,
 * link, button and input styles.
 * Copyright (c) 2026 Sarah Vickery. All rights reserved.
 */

.hbs-events,
.hbs-events-wrap,
.hbs-events-back {
	--ink: #1c2418;
	--ink-soft: #4d5748;
	--moss: #3a5a40;
	--sage: #a3b18a;
	--bloom: #8a4a14;
	--lake: #3f5f73;
	--paper: #f6f3e9;
	--paper-warm: #efe9da;
	--line: #cdc4ac;
	--card: #fffdf7;
	--serif: 'Fraunces', Georgia, 'Times New Roman', serif;
	--sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

.hbs-events,
.hbs-events *,
.hbs-events *::before,
.hbs-events *::after,
.hbs-events-wrap *,
.hbs-events-wrap *::before,
.hbs-events-wrap *::after {
	box-sizing: border-box;
}

.hbs-events {
	max-width: 1180px;
	margin: 0 auto;
	padding: clamp(20px, 4vw, 52px);
	background: var(--paper);
	color: var(--ink);
	font-family: var(--sans);
	font-size: 16px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
}
.hbs-events.is-plain { background: transparent; padding-left: 0; padding-right: 0; }

/* ---- Divi defenses ---------------------------------------------------- */
body .hbs-events h2,
body .hbs-events h3 {
	font-family: var(--serif) !important;
	color: var(--ink) !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	font-style: normal !important;
	padding: 0 !important;
	margin: 0 !important;
}
body .hbs-events p { margin: 0; padding: 0; color: inherit; font-size: inherit; line-height: inherit; }
body .hbs-events a { text-decoration: none; box-shadow: none; }
body .hbs-events fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
body .hbs-events button,
body .hbs-events input,
body .hbs-events select {
	font-family: var(--sans);
	text-transform: none;
	letter-spacing: normal;
	box-shadow: none;
	text-shadow: none;
	-webkit-appearance: none;
	appearance: none;
	margin: 0;
}
.hbs-ev-sr {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden;
	clip: rect(0 0 0 0); white-space: nowrap;
}
.hbs-events [hidden] { display: none !important; }

/* ---- Controls --------------------------------------------------------- */
.hbs-ev-controls { margin-bottom: 8px; }
.hbs-ev-top {
	display: flex; flex-wrap: wrap; gap: 16px 24px; align-items: center; justify-content: space-between;
	margin-bottom: 26px;
}
body .hbs-ev-search { flex: 1 1 260px; max-width: 420px; display: block; }
body .hbs-ev-search input {
	width: 100%; height: auto; padding: 10px 2px; font-size: 16px; color: var(--ink);
	background: transparent; border: 0; border-bottom: 1.5px solid var(--ink); border-radius: 0;
}
body .hbs-ev-search input::placeholder { color: var(--ink-soft); opacity: .8; }
body .hbs-ev-search input:focus { outline: none; border-bottom-color: var(--bloom); }

.hbs-ev-views { display: inline-flex; border: 1px solid var(--ink); border-radius: 2px; overflow: hidden; }
body .hbs-ev-views button {
	background: transparent; color: var(--ink); border: 0; border-right: 1px solid var(--ink);
	padding: 9px 18px; font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; cursor: pointer;
}
body .hbs-ev-views button:last-child { border-right: 0; }
body .hbs-ev-views button[aria-pressed="true"] { background: var(--ink); color: var(--paper); }

.hbs-ev-filters {
	display: grid; gap: 22px 44px; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	padding: 22px 0; border-top: 1px solid var(--line);
}
body .hbs-ev-group legend {
	display: block; float: none; width: auto; padding: 0; margin: 0 0 10px;
	font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-soft);
}
.hbs-ev-chips { display: flex; flex-wrap: wrap; gap: 8px; }
body .hbs-ev-chip {
	display: inline-flex; align-items: baseline; gap: 6px;
	padding: 6px 14px; border: 1px solid var(--line); border-radius: 999px;
	background: transparent; color: var(--ink); font-size: 14px; font-weight: 500; line-height: 1.4; cursor: pointer;
}
body .hbs-ev-chip .n { font-size: 12px; opacity: .65; }
body .hbs-ev-chip .n:empty { display: none; }
body .hbs-ev-chip:hover { border-color: var(--moss); }
body .hbs-ev-chip[aria-pressed="true"] { background: var(--moss); border-color: var(--moss); color: #fff; }
body .hbs-ev-chip[data-zero="1"][aria-pressed="false"] { opacity: .45; }

.hbs-ev-opts {
	display: flex; flex-wrap: wrap; gap: 12px 26px; align-items: center;
	padding: 16px 0 0; border-top: 1px solid var(--line); font-size: 14px;
}
.hbs-ev-check { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; margin: 0; }
body .hbs-ev-check input {
	-webkit-appearance: checkbox; appearance: auto; width: 17px; height: 17px; accent-color: var(--moss); margin: 0;
}
body .hbs-ev-clear, body .hbs-ev-link {
	background: none; border: 0; padding: 0; color: var(--bloom); font-size: 14px; font-weight: 600;
	text-decoration: underline; text-underline-offset: 3px; cursor: pointer;
}
body .hbs-events a.hbs-ev-sub { margin-left: auto; color: var(--moss); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

.hbs-ev-status { margin: 22px 0 4px; font-size: 13px; color: var(--ink-soft); letter-spacing: .02em; min-height: 1.5em; }

/* ---- Month headings --------------------------------------------------- */
body .hbs-events h2.hbs-ev-month-h {
	font-size: clamp(24px, 3vw, 32px) !important; font-weight: 400 !important; line-height: 1.1 !important;
	color: var(--moss) !important; margin: 44px 0 0 !important; padding-bottom: 12px !important;
	border-bottom: 1.5px solid var(--ink);
}
.hbs-ev-list > .hbs-ev-month-h:first-child { margin-top: 12px !important; }

/* ---- One event: list layout (default) --------------------------------- */
.hbs-ev {
	position: relative; display: flex; gap: 26px; align-items: flex-start;
	padding: 26px 12px 26px 26px; border-bottom: 1px solid var(--line);
	--bar: var(--lake);
}
.hbs-ev::before { content: ""; position: absolute; left: 0; top: 26px; bottom: 26px; width: 4px; background: var(--bar); border-radius: 2px; }
.hbs-ev[data-org~="station"] { --bar: var(--moss); }
.hbs-ev[data-org~="foundation"] { --bar: var(--bloom); }
.hbs-ev[data-org~="station"][data-org~="foundation"]::before { background: linear-gradient(var(--moss) 50%, var(--bloom) 50%); }
.hbs-ev[data-past="1"] { opacity: .62; }
.hbs-ev[hidden] { display: none !important; }

.hbs-ev-date { flex: none; width: 66px; text-align: center; line-height: 1; padding-top: 2px; }
.hbs-ev-date .m { display: block; font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--moss); }
.hbs-ev-date .d { display: block; margin: 6px 0 4px; font-family: var(--serif); font-size: 42px; font-weight: 400; color: var(--ink); }
.hbs-ev-date .w { display: block; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-soft); }

.hbs-ev-media { flex: none; order: 3; width: 176px; aspect-ratio: 4 / 3; overflow: hidden; background: var(--paper-warm); border-radius: 2px; }
.hbs-ev-media.is-blank { display: none; }
.hbs-ev-media img { display: block; width: 100%; height: 100%; object-fit: cover; }

.hbs-ev-body { flex: 1 1 auto; min-width: 0; }
.hbs-ev-kicker { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; margin-bottom: 8px !important; }
.hbs-ev-org {
	--c: var(--lake);
	display: inline-flex; align-items: center; gap: 7px;
	font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--c);
}
.hbs-ev-org::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--c); }
.hbs-ev-org[data-org="station"] { --c: var(--moss); }
.hbs-ev-org[data-org="foundation"] { --c: var(--bloom); }
.hbs-ev-tags { font-size: 12px; letter-spacing: .04em; color: var(--ink-soft); }

body .hbs-ev-title { font-size: clamp(21px, 2.2vw, 26px) !important; font-weight: 600 !important; line-height: 1.2 !important; }
body .hbs-events .hbs-ev-title a { color: var(--ink) !important; }
body .hbs-events .hbs-ev-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
body .hbs-events .hbs-ev-title a:hover { color: var(--moss) !important; text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
body .hbs-events .hbs-ev-title a:focus-visible { outline: 2px solid var(--bloom); outline-offset: 4px; }

.hbs-ev-when { margin-top: 8px !important; font-size: 15px; font-weight: 500; color: var(--ink); }
.hbs-ev-where { margin-top: 2px !important; font-size: 14px; color: var(--ink-soft); }
.hbs-ev-excerpt {
	margin-top: 10px !important; font-size: 15px; color: var(--ink-soft); max-width: 62ch;
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.hbs-ev-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: 14px; }
.hbs-ev-cost { font-size: 13px; font-weight: 500; color: var(--ink-soft); }
.hbs-ev-cost.is-free { color: var(--moss); font-weight: 600; }
.hbs-ev-pastflag { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-soft); }

body .hbs-events a.hbs-ev-btn,
body .hbs-ev-single a.hbs-ev-btn {
	position: relative; z-index: 2; display: inline-block;
	padding: 9px 18px; border: 1px solid var(--moss); border-radius: 2px;
	background: var(--moss); color: #fff !important;
	font-size: 13px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; line-height: 1.2;
}
body .hbs-events a.hbs-ev-btn:hover, body .hbs-ev-single a.hbs-ev-btn:hover { background: var(--ink); border-color: var(--ink); }
body .hbs-events a.hbs-ev-btn.is-ghost, body .hbs-ev-single a.hbs-ev-btn.is-ghost { background: transparent; color: var(--moss) !important; }
body .hbs-events a.hbs-ev-btn.is-ghost:hover, body .hbs-ev-single a.hbs-ev-btn.is-ghost:hover { background: var(--moss); color: #fff !important; border-color: var(--moss); }
body .hbs-events a.hbs-ev-btn:focus-visible { outline: 2px solid var(--bloom); outline-offset: 3px; }

.hbs-ev-empty, .hbs-ev-none { padding: 48px 0; text-align: center; color: var(--ink-soft); font-size: 17px; }
.hbs-ev-more { margin-top: 26px !important; }

/* ---- Card layout ------------------------------------------------------ */
.hbs-events[data-view="grid"] .hbs-ev-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 26px; }
.hbs-events[data-view="grid"] .hbs-ev-month-h { grid-column: 1 / -1; }
.hbs-events[data-view="grid"] .hbs-ev {
	flex-direction: column; gap: 0; padding: 0; background: var(--card); border: 1px solid var(--line); border-radius: 3px; overflow: hidden;
}
.hbs-events[data-view="grid"] .hbs-ev::before { top: 0; bottom: auto; left: 0; right: 0; width: auto; height: 4px; border-radius: 0; z-index: 3; }
.hbs-events[data-view="grid"] .hbs-ev[data-org~="station"][data-org~="foundation"]::before { background: linear-gradient(90deg, var(--moss) 50%, var(--bloom) 50%); }
.hbs-events[data-view="grid"] .hbs-ev-media,
.hbs-events[data-view="grid"] .hbs-ev-media.is-blank { display: block; order: 0; width: 100%; aspect-ratio: 16 / 10; border-radius: 0; }
.hbs-events[data-view="grid"] .hbs-ev-media.is-blank {
	background:
		radial-gradient(circle at 78% 24%, rgba(163, 177, 138, .55) 0 22%, transparent 23%),
		linear-gradient(160deg, var(--paper-warm), #e3dcc6);
}
.hbs-events[data-view="grid"] .hbs-ev-date {
	position: absolute; z-index: 2; top: 16px; left: 14px; width: 58px; padding: 8px 0 7px;
	background: var(--paper); border-radius: 2px; box-shadow: 0 1px 0 var(--line);
}
.hbs-events[data-view="grid"] .hbs-ev-date .d { font-size: 28px; margin: 3px 0 2px; }
.hbs-events[data-view="grid"] .hbs-ev-date .m, .hbs-events[data-view="grid"] .hbs-ev-date .w { font-size: 10px; }
.hbs-events[data-view="grid"] .hbs-ev-body { padding: 20px 22px 22px; width: 100%; }
.hbs-events[data-view="grid"] .hbs-ev-excerpt { -webkit-line-clamp: 3; }
@media (prefers-reduced-motion: no-preference) {
	.hbs-events[data-view="grid"] .hbs-ev { transition: box-shadow .2s ease, transform .2s ease; }
	.hbs-events[data-view="grid"] .hbs-ev:hover { box-shadow: 0 10px 26px -14px rgba(28, 36, 24, .45); transform: translateY(-2px); }
	body .hbs-ev-chip, body .hbs-events a.hbs-ev-btn { transition: background-color .15s ease, color .15s ease, border-color .15s ease; }
}

/* ---- Month calendar --------------------------------------------------- */
.hbs-ev-cal { margin-top: 8px; }
.hbs-ev-calnav { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
body .hbs-ev-calnav h2 { flex: 1; font-size: clamp(24px, 3vw, 32px) !important; font-weight: 400 !important; color: var(--moss) !important; }
body .hbs-ev-calnav button {
	background: transparent; border: 1px solid var(--ink); color: var(--ink); border-radius: 2px;
	padding: 8px 14px; font-size: 13px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; line-height: 1.2;
}
body .hbs-ev-calnav button:hover { background: var(--ink); color: var(--paper); }
.hbs-ev-cal table { width: 100%; table-layout: fixed; border-collapse: collapse; background: var(--card); margin: 0; border: 1px solid var(--line); }
body .hbs-ev-cal th {
	padding: 9px 4px; border: 1px solid var(--line); background: var(--paper-warm); text-align: center;
	font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-soft);
}
body .hbs-ev-cal td { height: 116px; padding: 6px; border: 1px solid var(--line); vertical-align: top; background: transparent; }
.hbs-ev-cal td.is-out { background: var(--paper-warm); opacity: .55; }
.hbs-ev-cal .dn { display: inline-block; min-width: 24px; height: 24px; line-height: 24px; text-align: center; font-size: 13px; color: var(--ink-soft); border-radius: 50%; }
.hbs-ev-cal td.is-today .dn { background: var(--moss); color: #fff; font-weight: 600; }
.hbs-ev-cal .dw { display: none; }
body .hbs-ev-cal a.ce {
	display: block; margin-top: 4px; padding: 3px 6px; border-left: 3px solid var(--lake);
	background: rgba(63, 95, 115, .1); color: var(--ink) !important; font-size: 12px; line-height: 1.3; border-radius: 0 2px 2px 0;
}
body .hbs-ev-cal a.ce[data-org~="station"] { border-left-color: var(--moss); background: rgba(58, 90, 64, .11); }
body .hbs-ev-cal a.ce[data-org~="foundation"] { border-left-color: var(--bloom); background: rgba(138, 74, 20, .1); }
body .hbs-ev-cal a.ce:hover { text-decoration: underline; }
.hbs-ev-cal a.ce b { font-weight: 600; margin-right: 4px; }
.hbs-ev-cal a.ce.is-past { opacity: .6; }

/* ---- Compact (shortcode for other pages) ------------------------------ */
.hbs-events.is-compact .hbs-ev { padding: 18px 8px 18px 24px; }
.hbs-events.is-compact .hbs-ev::before { top: 18px; bottom: 18px; }
.hbs-events.is-compact .hbs-ev-media, .hbs-events.is-compact .hbs-ev-excerpt { display: none; }
body .hbs-events.is-compact .hbs-ev-title { font-size: 20px !important; }
.hbs-events.is-compact .hbs-ev-date .d { font-size: 34px; }

/* ---- Single event page ------------------------------------------------ */
.hbs-events-wrap { font-family: var(--sans); color: var(--ink); }
.hbs-ev-single {
	margin: 0 0 34px; padding: 26px 30px 28px; background: var(--paper);
	border: 1px solid var(--line); border-left: 4px solid var(--moss);
	font-family: var(--sans); font-size: 16px; line-height: 1.55; color: var(--ink);
}
.hbs-ev-single[data-org~="foundation"] { border-left-color: var(--bloom); }
.hbs-ev-single[data-org~="station"] { border-left-color: var(--moss); }
.hbs-ev-single[data-org~="community-partners"] { border-left-color: var(--lake); }
body .hbs-ev-single a { text-decoration: none; box-shadow: none; border-bottom-width: 1px; }
body .hbs-ev-single .hbs-ev-org { display: inline-flex; }
.hbs-ev-single p { margin: 0; }
.hbs-ev-single .hbs-ev-kicker { margin-bottom: 14px; }
.hbs-ev-facts { display: grid; gap: 14px 40px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); margin: 0 0 22px; padding: 0; }
.hbs-ev-facts div { margin: 0; }
.hbs-ev-facts dt { margin: 0 0 3px; font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-soft); }
.hbs-ev-facts dd { margin: 0; font-family: var(--serif); font-size: 19px; line-height: 1.35; color: var(--ink); }
.hbs-ev-single-actions { display: flex; flex-wrap: wrap; gap: 10px 12px; align-items: center; }
.hbs-events-back { margin: 34px 0 0; font-size: 15px; font-family: var(--sans); }
.hbs-events-back a { color: var(--moss); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* Filters toggle: only shown on small screens */
body .hbs-ev-ftoggle { display: none; }

/* ---- Small screens ---------------------------------------------------- */
@media (max-width: 720px) {
	body .hbs-ev-ftoggle {
		display: inline-flex; gap: 6px; align-items: baseline; padding: 9px 18px; background: transparent;
		border: 1px solid var(--moss); border-radius: 2px; color: var(--moss);
		font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; cursor: pointer;
	}
	body .hbs-ev-ftoggle .n:empty { display: none; }
	body .hbs-ev-ftoggle[aria-expanded="true"] { background: var(--moss); color: #fff; }
	.hbs-ev-top { margin-bottom: 18px; }
	.hbs-ev-filters { display: none; grid-template-columns: 1fr; }
	.hbs-ev-controls.is-open .hbs-ev-filters { display: grid; }
	.hbs-ev-calnav { flex-wrap: wrap; }
	body .hbs-ev-calnav h2 { flex: 1 0 100%; }
	body .hbs-events a.hbs-ev-sub { margin-left: 0; }
	.hbs-ev { gap: 16px; padding: 22px 4px 22px 20px; }
	.hbs-ev-date { width: 52px; }
	.hbs-ev-date .d { font-size: 34px; }
	.hbs-events:not([data-view="grid"]) .hbs-ev-media { display: none; }
	.hbs-ev-cal table, .hbs-ev-cal tbody, .hbs-ev-cal tr, .hbs-ev-cal td { display: block; width: 100%; }
	.hbs-ev-cal thead { display: none; }
	body .hbs-ev-cal td { height: auto; border-width: 0 0 1px; padding: 12px 14px; }
	body .hbs-ev-cal td:not(.has) { display: none; }
	.hbs-ev-cal .dw { display: inline; margin-right: 4px; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
	.hbs-ev-cal .dn { min-width: 0; height: auto; line-height: 1.4; }
}

/* Foundation events: published-by line */
body .hbs-events .hbs-ev-by { margin: 4px 0 0; font-size: 13px; font-style: italic; color: var(--ink-soft); }

/* ==== v1.4 Immersive photography ======================================== */

/* -- List view: larger, softer, alive photos ------------------------------ */
.hbs-ev-media {
	position: relative; width: clamp(220px, 34%, 380px); aspect-ratio: 3 / 2; border-radius: 14px;
	box-shadow: 0 14px 30px -18px rgba(10, 16, 22, .6);
}
.hbs-ev-media::after {
	content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: inherit;
	background: linear-gradient(180deg, rgba(10, 16, 22, 0) 55%, rgba(10, 16, 22, .38) 100%);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14);
}
.hbs-ev-media img { transition: transform 1.1s cubic-bezier(.2, .7, .2, 1); }
.hbs-ev:hover .hbs-ev-media img { transform: scale(1.07); }

/* -- Card view: full-bleed photo with the words over it ------------------- */
.hbs-events[data-view="grid"] .hbs-ev-list { grid-template-columns: repeat(auto-fill, minmax(310px, 1fr)); gap: 22px; }
.hbs-events[data-view="grid"] .hbs-ev {
	isolation: isolate; justify-content: flex-end; min-height: 430px; border: 0; border-radius: 20px;
	background: var(--ink); color: #f3f6f9; box-shadow: 0 20px 40px -26px rgba(10, 16, 22, .75);
}
.hbs-events[data-view="grid"] .hbs-ev::before { z-index: 3; }
.hbs-events[data-view="grid"] .hbs-ev-media,
.hbs-events[data-view="grid"] .hbs-ev-media.is-blank {
	position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; aspect-ratio: auto; border-radius: 0; box-shadow: none;
}
.hbs-events[data-view="grid"] .hbs-ev-media::after {
	border-radius: 0; box-shadow: none;
	background: linear-gradient(180deg, rgba(10, 16, 22, .18) 0%, rgba(10, 16, 22, 0) 28%, rgba(10, 16, 22, .55) 56%, rgba(10, 16, 22, .94) 100%);
}
.hbs-events[data-view="grid"] .hbs-ev-media.is-blank {
	background:
		radial-gradient(circle at 80% 18%, rgba(255, 255, 255, .22) 0 14%, transparent 15%),
		radial-gradient(120% 70% at 20% 0%, rgba(255, 255, 255, .14), transparent 60%),
		linear-gradient(165deg, var(--moss), var(--ink));
}
.hbs-events[data-view="grid"] .hbs-ev-body { flex: 0 0 auto; margin-top: auto; padding: 120px 24px 26px; }
.hbs-events[data-view="grid"] .hbs-ev-date { box-shadow: 0 8px 20px -10px rgba(10, 16, 22, .6); border-radius: 10px; }
body .hbs-events[data-view="grid"] .hbs-ev-title { font-size: clamp(22px, 2.2vw, 27px) !important; }
body .hbs-events[data-view="grid"] .hbs-ev-title a { color: #fff !important; }
body .hbs-events[data-view="grid"] .hbs-ev-title a:hover { color: #fff !important; text-decoration-color: rgba(255, 255, 255, .7); }
.hbs-events[data-view="grid"] .hbs-ev-org { color: #e6eef6; }
.hbs-events[data-view="grid"] .hbs-ev-org::before { box-shadow: 0 0 0 2px rgba(255, 255, 255, .75); }
.hbs-events[data-view="grid"] .hbs-ev-tags,
.hbs-events[data-view="grid"] .hbs-ev-where,
.hbs-events[data-view="grid"] .hbs-ev-by,
.hbs-events[data-view="grid"] .hbs-ev-pastflag { color: rgba(243, 246, 249, .82) !important; }
.hbs-events[data-view="grid"] .hbs-ev-when { color: #fff; }
.hbs-events[data-view="grid"] .hbs-ev-excerpt { color: rgba(243, 246, 249, .88); -webkit-line-clamp: 2; }
.hbs-events[data-view="grid"] .hbs-ev-cost { color: rgba(243, 246, 249, .85); }
.hbs-events[data-view="grid"] .hbs-ev-cost.is-free { color: #f0c987; }
body .hbs-events[data-view="grid"] a.hbs-ev-btn { background: #f3f6f9; border-color: #f3f6f9; color: var(--ink) !important; }
body .hbs-events[data-view="grid"] a.hbs-ev-btn:hover { background: #fff; border-color: #fff; }
.hbs-events[data-view="grid"] .hbs-ev[data-past="1"] { opacity: .7; }

@media (prefers-reduced-motion: no-preference) {
	.hbs-events[data-view="grid"] .hbs-ev:hover { transform: translateY(-4px); box-shadow: 0 28px 46px -24px rgba(10, 16, 22, .85); }
}

/* -- Phones: list photos span the row ------------------------------------- */
@media (max-width: 720px) {
	.hbs-ev { flex-wrap: wrap; }
	.hbs-ev-media { order: 0; flex: 0 0 100%; width: 100%; aspect-ratio: 16 / 10; margin: 0 0 4px 0; }
	.hbs-events[data-view="grid"] .hbs-ev { min-height: 380px; }
}

/* ==== v1.5 Whole photo, immersive glow ================================== */
/* Photos are never cropped: each shows at its own proportions, and a blurred
   copy of the same photo glows behind the card. */

/* List view */
.hbs-ev-media { width: clamp(240px, 38%, 430px); aspect-ratio: auto; height: auto; }
.hbs-ev-media img { height: auto; object-fit: contain; }
.hbs-ev:hover .hbs-ev-media img { transform: none; }

/* Cards view */
.hbs-events[data-view="grid"] .hbs-ev-list { grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 24px; }
.hbs-events[data-view="grid"] .hbs-ev { min-height: 0; justify-content: flex-start; overflow: hidden; background: #0a1118; }
.hbs-events[data-view="grid"] .hbs-ev::after {
	content: ""; position: absolute; inset: -30px; z-index: -1; pointer-events: none;
	background: linear-gradient(180deg, rgba(8, 14, 22, .50) 0%, rgba(8, 14, 22, .86) 78%), var(--ev-img, linear-gradient(165deg, var(--moss), var(--ink)));
	background-size: cover; background-position: center;
	filter: blur(26px) saturate(1.35);
}
.hbs-events[data-view="grid"] .hbs-ev-media,
.hbs-events[data-view="grid"] .hbs-ev-media.is-blank {
	position: relative; inset: auto; z-index: auto; display: block; width: calc(100% - 28px); height: auto; aspect-ratio: auto;
	margin: 14px 14px 0; border-radius: 12px; overflow: hidden; box-shadow: 0 18px 34px -16px rgba(0, 0, 0, .75);
}
.hbs-events[data-view="grid"] .hbs-ev-media::after { display: none; }
.hbs-events[data-view="grid"] .hbs-ev-media img { display: block; width: 100%; height: auto; }
.hbs-events[data-view="grid"] .hbs-ev:hover .hbs-ev-media img { transform: none; }
.hbs-events[data-view="grid"] .hbs-ev-media.is-blank {
	aspect-ratio: 16 / 10;
	background:
		radial-gradient(circle at 80% 22%, rgba(255, 255, 255, .22) 0 14%, transparent 15%),
		linear-gradient(165deg, var(--moss), var(--ink));
}
.hbs-events[data-view="grid"] .hbs-ev-date { top: 26px; left: 26px; }
.hbs-events[data-view="grid"] .hbs-ev-body { flex: 0 0 auto; margin-top: 0; padding: 20px 24px 26px; }
.hbs-events[data-view="grid"] .hbs-ev-excerpt { -webkit-line-clamp: 3; }
@media (max-width: 720px) {
	.hbs-ev-media { flex: 0 0 100%; width: 100%; aspect-ratio: auto; }
	.hbs-events:not(.is-compact):not([data-view="grid"]) .hbs-ev-media:not(.is-blank) { display: block; }
	.hbs-events[data-view="grid"] .hbs-ev { min-height: 0; }
}

/* ==== v1.6 Edge-to-edge photos, ambient glow, no clipped text =========== */

/* Nothing is cut off: no line clamps, full titles and summaries */
.hbs-ev-excerpt { display: block; -webkit-line-clamp: unset; -webkit-box-orient: unset; overflow: visible; }
.hbs-events[data-view="grid"] .hbs-ev-excerpt { -webkit-line-clamp: unset; }

/* List view: big whole photo with the photo's own colors glowing behind it */
.hbs-ev { isolation: isolate; }
.hbs-ev-media { width: clamp(260px, 44%, 520px); border-radius: 18px; box-shadow: 0 22px 44px -22px rgba(10, 16, 22, .7); }
.hbs-events:not([data-view="grid"]) .hbs-ev[style*="--ev-img"]::after {
	content: ""; position: absolute; z-index: -1; right: -2%; top: 6%; width: 52%; height: 88%; pointer-events: none;
	background-image: var(--ev-img); background-size: cover; background-position: center;
	filter: blur(46px) saturate(1.5); opacity: .30; border-radius: 30px;
}

/* Cards view: photo runs edge to edge across the top, whole and uncropped */
.hbs-events[data-view="grid"] .hbs-ev-list { grid-template-columns: repeat(auto-fill, minmax(380px, 1fr)); gap: 26px; }
.hbs-events[data-view="grid"] .hbs-ev { border-radius: 22px; }
.hbs-events[data-view="grid"] .hbs-ev-media,
.hbs-events[data-view="grid"] .hbs-ev-media.is-blank { width: 100%; margin: 0; border-radius: 0; box-shadow: 0 20px 36px -18px rgba(0, 0, 0, .8); }
.hbs-events[data-view="grid"] .hbs-ev-media::after {
	display: block; border-radius: 0; box-shadow: none;
	background: linear-gradient(180deg, rgba(8, 14, 22, .22) 0%, rgba(8, 14, 22, 0) 22%, rgba(8, 14, 22, 0) 80%, rgba(8, 14, 22, .38) 100%);
}
.hbs-events[data-view="grid"] .hbs-ev::after { filter: blur(30px) saturate(1.6); background-size: 220% auto; background-position: center bottom; }
.hbs-events[data-view="grid"] .hbs-ev-date { top: 16px; left: 16px; }
.hbs-events[data-view="grid"] .hbs-ev-body { padding: 22px 26px 28px; }

/* Phones: list photos appear (they were hidden) and run edge to edge */
@media (max-width: 720px) {
	.hbs-events:not(.is-compact):not([data-view="grid"]) .hbs-ev-media:not(.is-blank) { display: block; }
	.hbs-ev-media { flex: 0 0 100%; width: 100%; border-radius: 14px; }
	.hbs-events[data-view="grid"] .hbs-ev-list { grid-template-columns: 1fr; }
}

/* ==== v1.7 Featured events ============================================== */
body .hbs-ev-star {
	display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px;
	background: #f0c987; color: #2a1c05; font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; line-height: 1.5;
}
body .hbs-ev-star::before { content: "\2605"; font-size: 11px; letter-spacing: 0; }
.hbs-ev.is-featured .hbs-ev-kicker .hbs-ev-star { margin-right: 4px; }

.hbs-feat-wrap { margin: 0 0 clamp(30px, 4vw, 52px); font-family: var(--sans); color: var(--ink); }
.hbs-feat-wrap *, .hbs-feat-wrap *::before, .hbs-feat-wrap *::after { box-sizing: border-box; }
body .hbs-feat-wrap h2.hbs-feat-h {
	font-family: var(--serif) !important; font-size: clamp(26px, 3.2vw, 36px) !important; font-weight: 500 !important; line-height: 1.1 !important;
	letter-spacing: -.01em !important; text-transform: none !important; color: var(--ink) !important; margin: 0 0 18px !important; padding: 0 !important;
}
.hbs-feat-grid { display: grid; gap: 24px; grid-template-columns: repeat(3, 1fr); }
.hbs-feat-grid.is-2 { grid-template-columns: repeat(2, 1fr); }
.hbs-feat-grid.is-1 { grid-template-columns: 1fr; }

.hbs-feat {
	position: relative; isolation: isolate; display: flex; flex-direction: column; overflow: hidden; border-radius: 22px;
	background: #0a1118; color: #f3f6f9; box-shadow: 0 24px 44px -26px rgba(10, 16, 22, .8);
}
.hbs-feat::after {
	content: ""; position: absolute; inset: -30px; z-index: -1; pointer-events: none;
	background: linear-gradient(180deg, rgba(8, 14, 22, .5), rgba(8, 14, 22, .88) 80%), var(--ev-img, linear-gradient(165deg, var(--moss), var(--ink)));
	background-size: cover; background-position: center; filter: blur(30px) saturate(1.6);
}
.hbs-feat-media { position: relative; width: 100%; background: transparent; box-shadow: 0 20px 36px -18px rgba(0, 0, 0, .8); }
.hbs-feat-media img { display: block; width: 100%; height: auto; }
.hbs-feat-media.is-blank { aspect-ratio: 16 / 10; background: radial-gradient(circle at 80% 22%, rgba(255, 255, 255, .22) 0 14%, transparent 15%), linear-gradient(165deg, var(--moss), var(--ink)); }
.hbs-feat-media .hbs-ev-star { position: absolute; top: 16px; left: 16px; box-shadow: 0 8px 18px -8px rgba(0, 0, 0, .6); }
.hbs-feat-body { padding: 22px 26px 28px; }
.hbs-feat-body .hbs-ev-kicker { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 0 0 8px !important; }
.hbs-feat .hbs-ev-org { color: #e6eef6; }
.hbs-feat .hbs-ev-org::before { box-shadow: 0 0 0 2px rgba(255, 255, 255, .75); }
.hbs-feat .hbs-ev-tags, .hbs-feat .hbs-ev-where, .hbs-feat .hbs-ev-by { color: rgba(243, 246, 249, .82) !important; }
body .hbs-feat h3.hbs-ev-title { font-family: var(--serif) !important; font-size: clamp(24px, 2.4vw, 30px) !important; font-weight: 500 !important; text-transform: none !important; letter-spacing: -.01em !important; margin: 0 !important; padding: 0 !important; line-height: 1.15 !important; }
body .hbs-feat .hbs-ev-title a { color: #fff !important; text-decoration: none !important; }
body .hbs-feat .hbs-ev-title a::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.hbs-feat .hbs-ev-when { margin: 10px 0 0 !important; font-weight: 600; color: #fff; }
.hbs-feat .hbs-ev-where { margin: 2px 0 0 !important; }
.hbs-feat .hbs-ev-by { margin: 4px 0 0 !important; font-style: italic; font-size: 13px; }
.hbs-feat .hbs-ev-excerpt { margin: 10px 0 0 !important; color: rgba(243, 246, 249, .9); font-size: 15px; display: block; overflow: visible; -webkit-line-clamp: unset; }
.hbs-feat .hbs-ev-cost { margin: 12px 0 0 !important; font-size: 13px; font-weight: 600; color: rgba(243, 246, 249, .9); }
.hbs-feat .hbs-ev-cost.is-free { color: #f0c987; }
@media (prefers-reduced-motion: no-preference) {
	.hbs-feat { transition: transform .3s ease, box-shadow .3s ease; }
	.hbs-feat:hover { transform: translateY(-4px); box-shadow: 0 32px 52px -26px rgba(10, 16, 22, .9); }
}

/* One featured event: wide, photo on the left */
@media (min-width: 900px) {
	.hbs-feat-grid.is-1 .hbs-feat { flex-direction: row; align-items: stretch; }
	.hbs-feat-grid.is-1 .hbs-feat-media { width: 58%; flex: none; align-self: center; }
	.hbs-feat-grid.is-1 .hbs-feat-body { flex: 1; align-self: center; padding: 34px 40px; }
}
@media (max-width: 900px) { .hbs-feat-grid, .hbs-feat-grid.is-2 { grid-template-columns: 1fr; } }

/* v1.8: page context blocks (switch with the Hosted By filter) */
[data-hbs-show][hidden], [data-hbs-hide][hidden], [data-hbs-band][hidden] { display: none !important; }
