/* bzsc-jornadas-build: 2.4.3 */

.bzsc-jornadas,
.bzsc-j-single {
	--bzsc-j-cols: 3;
	--bzsc-j-accent: #0a98d9;
	--bzsc-j-deep: #0f3550;
	--bzsc-j-ink: #1f2937;
	--bzsc-j-muted: #5b7183;
	--bzsc-j-line: #dde8ef;
	--bzsc-j-surface: #ffffff;
	--bzsc-j-radius: 14px;
	--bzsc-j-gap: 24px;
	color: var(--bzsc-j-ink);
}

/* --- Section head ------------------------------------------------------ */

.bzsc-j-head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 22px;
}

html body .bzsc-jornadas .bzsc-j-heading {
	margin: 0;
	font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.375rem);
	font-weight: 800;
	line-height: 1.15;
	color: var(--bzsc-j-deep);
}

html body .bzsc-jornadas .bzsc-j-head-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 22px;
	border-radius: 999px;
	background: var(--bzsc-j-accent) !important;
	color: #ffffff !important;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none !important;
}

.bzsc-j-icon {
	display: inline-flex;
	flex: 0 0 auto;
	width: 1em;
	height: 1em;
}

.bzsc-j-icon svg {
	width: 100%;
	height: 100%;
}

/* --- Year filter ------------------------------------------------------- */

/* Deliberately the same control as the events filters: one ruled bar holding a
   segmented group, the active item a raised white pill on a grey track. The two
   listings sit one click apart in the menu, so they should not look like two
   different plugins. Values mirror bzsc-events.css. */
.bzsc-j-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: var(--bzsc-j-gap);
	padding-bottom: 12px;
	border-bottom: 1px solid var(--bzsc-j-line);
}

.bzsc-j-periods {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 4px;
	padding: 4px;
	background: #f3f4f6;
	border-radius: 999px;
}

html body .bzsc-jornadas a.bzsc-j-period,
html body .bzsc-jornadas .bzsc-j-period {
	appearance: none;
	-webkit-appearance: none;
	display: inline-block;
	padding: 7px 16px;
	border: 0 !important;
	border-radius: 999px;
	background: transparent !important;
	color: var(--bzsc-j-muted) !important;
	font: inherit;
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.2;
	text-transform: none;
	text-decoration: none !important;
	cursor: pointer;
}

html body .bzsc-jornadas a.bzsc-j-period:hover,
html body .bzsc-jornadas a.bzsc-j-period:focus {
	color: var(--bzsc-j-accent) !important;
	text-decoration: none !important;
}

html body .bzsc-jornadas a.bzsc-j-period.is-active,
html body .bzsc-jornadas .bzsc-j-period.is-active {
	background: var(--bzsc-j-surface) !important;
	color: var(--bzsc-j-accent) !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}

/* --- Cards ------------------------------------------------------------- */

.bzsc-j-grid {
	display: grid;
	grid-template-columns: repeat(var(--bzsc-j-cols), minmax(0, 1fr));
	gap: var(--bzsc-j-gap);
	/* Stretch, not start: every card in a row takes the height of the tallest,
	   so a long summary next to a short one no longer leaves a ragged edge. */
	align-items: stretch;
}

@media (max-width: 1024px) {
	.bzsc-j-grid {
		grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
	}
}

html body .bzsc-jornadas a.bzsc-j-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: var(--bzsc-j-surface) !important;
	border: 1px solid var(--bzsc-j-line);
	border-radius: var(--bzsc-j-radius);
	overflow: hidden;
	text-decoration: none !important;
	color: inherit !important;
	box-shadow: 0 2px 10px rgba(15, 53, 80, 0.05);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.bzsc-j-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 32px rgba(15, 53, 80, 0.12);
}

.bzsc-j-card-figure {
	position: relative;
	display: block;
	aspect-ratio: 16 / 10;
	background: #e3ecf2;
	overflow: hidden;
}

.bzsc-j-card-img,
.bzsc-j-card-empty {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.bzsc-j-card-date,
.bzsc-j-card-video {
	position: absolute;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 11px;
	border-radius: 999px;
	background: rgba(15, 53, 80, 0.88);
	color: #ffffff;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.3;
}

.bzsc-j-card-date {
	top: 12px;
	left: 12px;
}

.bzsc-j-card-video {
	bottom: 12px;
	right: 12px;
}

.bzsc-j-card-body {
	display: flex;
	flex-direction: column;
	gap: 9px;
	padding: 18px 20px 20px;
	flex: 1 1 auto;
}

.bzsc-j-card-title {
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.3;
	color: var(--bzsc-j-deep);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Three lines, then an ellipsis. Equal card heights alone would only move the
   problem — the tallest summary would set the height and every other card would
   end in white space. Clamping caps how much any one card can claim, and the
   full text is one click away on the jornada's own page. */
.bzsc-j-card-summary {
	font-size: 0.875rem;
	line-height: 1.55;
	color: var(--bzsc-j-muted);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* auto pushes the location and photo count to the bottom of every card, so
   they line up across the row instead of floating under uneven summaries. */
.bzsc-j-card-meta {
	display: flex;
	flex-direction: column;
	gap: 5px;
	margin-top: auto;
	padding-top: 4px;
}

.bzsc-j-card-row {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: 0.8125rem;
	color: #78909f;
}

.bzsc-j-empty {
	padding: 32px;
	text-align: center;
	color: var(--bzsc-j-muted);
	background: #f8fbfd;
	border-radius: var(--bzsc-j-radius);
}

/* --- Modal ------------------------------------------------------------- */

.bzsc-j-modal[hidden] {
	display: none !important;
}

.bzsc-j-modal {
	position: fixed;
	inset: 0;
	z-index: 99998;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 28px;
	opacity: 0;
	transition: opacity 0.22s ease;
}

.bzsc-j-modal.is-open {
	opacity: 1;
}

.bzsc-j-modal-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(9, 32, 48, 0.68);
}

.bzsc-j-modal-dialog {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 760px;
	max-height: calc(100vh - 56px);
	overflow: auto;
	background: #ffffff;
	border-radius: 18px;
	box-shadow: 0 30px 70px rgba(5, 24, 38, 0.45);
	transform: translateY(10px) scale(0.99);
	transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

.bzsc-j-modal.is-open .bzsc-j-modal-dialog {
	transform: none;
}

.bzsc-j-modal-media {
	position: relative;
	flex: 0 0 auto;
	width: 100%;
	aspect-ratio: 16 / 9;
	background: #11212c;
}

.bzsc-j-modal-media iframe,
.bzsc-j-modal-media img {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
	object-fit: cover;
}

html body .bzsc-j-modal .bzsc-j-modal-close {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 38px;
	height: 38px;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 999px;
	background: rgba(9, 32, 48, 0.72) !important;
	color: #ffffff !important;
	font: inherit;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	z-index: 2;
}

.bzsc-j-modal-body {
	display: flex;
	flex-direction: column;
	gap: 13px;
	padding: 24px 28px 20px;
}

.bzsc-j-modal-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
}

.bzsc-j-modal-badge {
	padding: 5px 12px;
	border-radius: 999px;
	background: #eef5f9;
	color: #2d5a74;
	font-size: 12px;
	font-weight: 700;
}

.bzsc-j-modal-badge.is-unit {
	background: var(--bzsc-j-accent, #0a98d9);
	color: #ffffff;
}

html body .bzsc-j-modal .bzsc-j-modal-title {
	margin: 0;
	font-size: 1.6875rem;
	font-weight: 800;
	line-height: 1.2;
	color: #0f3550;
}

.bzsc-j-modal-summary {
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.65;
	color: #45606f;
}

.bzsc-j-modal-summary:empty {
	display: none;
}

.bzsc-j-modal-strip {
	display: flex;
	gap: 8px;
}

.bzsc-j-modal-strip:empty {
	display: none;
}

html body .bzsc-j-modal .bzsc-j-strip-shot,
html body .bzsc-j-modal .bzsc-j-strip-more {
	flex: 1;
	height: 74px;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 9px;
	background-color: #e3ecf2 !important;
	background-size: cover;
	background-position: center;
	cursor: pointer;
	font: inherit;
	font-size: 13px;
	font-weight: 800;
}

html body .bzsc-j-modal .bzsc-j-strip-more {
	background-color: #0f3550 !important;
	color: #ffffff !important;
}

.bzsc-j-modal-foot {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	padding: 18px 28px 24px;
	border-top: 1px solid #eef3f6;
}

html body .bzsc-j-modal a.bzsc-j-modal-more {
	flex: 1 1 260px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 14px 22px;
	border-radius: 999px;
	background: var(--bzsc-j-accent, #0a98d9) !important;
	color: #ffffff !important;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none !important;
}

html body .bzsc-j-modal a.bzsc-j-modal-all {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 22px;
	border-radius: 999px;
	border: 1.5px solid #cddfe9 !important;
	background: #ffffff !important;
	color: #2d5a74 !important;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none !important;
}

/* --- Single page ------------------------------------------------------- */

.bzsc-j-single {
	display: block;
}

.bzsc-j-hero {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 380px;
	background: #0f3550 center / cover no-repeat;
	border-radius: 16px;
	overflow: hidden;
}

.bzsc-j-hero-veil {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(15, 53, 80, 0.15) 0%, rgba(15, 53, 80, 0.88) 100%);
}

.bzsc-j-hero-inner {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 13px;
	padding: 44px 40px 40px;
	width: 100%;
}

.bzsc-j-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.bzsc-j-badge {
	padding: 6px 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.2);
	color: #ffffff;
	font-size: 13px;
	font-weight: 700;
}

.bzsc-j-badge--unit {
	background: var(--bzsc-j-accent);
}

html body .bzsc-j-single .bzsc-j-title {
	margin: 0;
	font-size: clamp(2rem, 1.5rem + 2vw, 2.875rem);
	font-weight: 800;
	line-height: 1.1;
	color: #ffffff;
}

.bzsc-j-lead {
	margin: 0;
	max-width: 760px;
	font-size: 1.0625rem;
	line-height: 1.55;
	color: #d4e6f1;
}

.bzsc-j-layout {
	display: flex;
	flex-wrap: wrap;
	gap: 40px;
	align-items: flex-start;
	margin-top: 44px;
}

.bzsc-j-main {
	flex: 999 1 560px;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 40px;
}

.bzsc-j-aside {
	flex: 1 1 290px;
	min-width: 270px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

html body .bzsc-j-single .bzsc-j-section-title {
	margin: 0 0 12px;
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #78909f;
}

.bzsc-j-story {
	font-size: 1rem;
	line-height: 1.75;
	color: #3c5567;
}

/* The theme's paragraph rhythm is built for long prose and leaves short lines
   floating apart. !important because Elementor's kit sets p margins globally. */
.bzsc-j-story p {
	margin: 0 0 12px !important;
}

.bzsc-j-story p:last-child {
	margin-bottom: 0 !important;
}

/* The aside is a flex column with its own gap — no margin needed here, or the
   video would sit twice as far from the ficha as everything else. */
.bzsc-j-aside-video {
	line-height: 0;
}

html body .bzsc-j-single .bzsc-j-video {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	aspect-ratio: 16 / 9;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 12px;
	background-color: #11212c !important;
	background-size: cover;
	background-position: center;
	cursor: pointer;
}

.bzsc-j-video::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(9, 32, 48, 0.35);
	border-radius: 12px;
}

.bzsc-j-play {
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 50px;
	border-radius: 12px;
	background: #ff0000;
}

.bzsc-j-play svg {
	width: 26px;
	height: 26px;
}

.bzsc-j-video-frame {
	width: 100%;
	aspect-ratio: 16 / 9;
	border-radius: 12px;
	overflow: hidden;
}

.bzsc-j-video-frame iframe {
	width: 100%;
	height: 100%;
	border: 0;
}

.bzsc-j-gallery {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
}

html body .bzsc-j-single .bzsc-j-shot {
	padding: 0 !important;
	border: 0 !important;
	border-radius: 12px;
	background: #e3ecf2 !important;
	cursor: zoom-in;
	overflow: hidden;
	line-height: 0;
	aspect-ratio: 4 / 3;
}

html body .bzsc-j-single .bzsc-j-shot.is-lead {
	grid-column: span 2;
	grid-row: span 2;
	aspect-ratio: auto;
}

.bzsc-j-shot img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media (max-width: 600px) {
	.bzsc-j-gallery {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	html body .bzsc-j-single .bzsc-j-shot.is-lead {
		grid-column: span 2;
		grid-row: auto;
		aspect-ratio: 4 / 3;
	}
}

.bzsc-j-facts {
	border: 1px solid var(--bzsc-j-line);
	border-radius: var(--bzsc-j-radius);
	overflow: hidden;
	background: #ffffff;
}

.bzsc-j-facts-head {
	padding: 13px 20px;
	background: #f4f9fc;
	border-bottom: 1px solid #e2ecf2;
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #42606f;
}

.bzsc-j-facts-list {
	margin: 0;
	padding: 6px 20px 16px;
}

.bzsc-j-fact {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 11px 0;
	border-bottom: 1px solid #eef3f6;
}

.bzsc-j-fact:last-child {
	border-bottom: 0;
}

.bzsc-j-fact dt {
	margin: 0;
	font-size: 0.8125rem;
	color: #78909f;
}

.bzsc-j-fact dd {
	margin: 0;
	font-size: 0.8125rem;
	font-weight: 700;
	color: #0f3550;
	text-align: right;
}

html body .bzsc-j-single .bzsc-j-share {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 12px 18px !important;
	border: 1px solid var(--bzsc-j-line) !important;
	border-radius: 999px;
	background: #ffffff !important;
	color: #42606f !important;
	font: inherit;
	font-size: 0.875rem;
	font-weight: 700;
	cursor: pointer;
}

.bzsc-j-others {
	padding: 16px 18px;
	border-radius: 12px;
	background: #f4f9fc;
	border: 1px solid #e2ecf2;
}

.bzsc-j-others-head {
	margin-bottom: 8px;
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #78909f;
}

html body .bzsc-j-single a.bzsc-j-other {
	display: block;
	padding: 7px 0;
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.4;
	color: #0a6d9e !important;
	text-decoration: none !important;
}

/* --- Lightbox ---------------------------------------------------------- */

.bzsc-j-lightbox {
	position: fixed;
	inset: 0;
	z-index: 100001;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(9, 12, 20, 0.92);
	cursor: zoom-out;
}

.bzsc-j-lightbox.is-open {
	display: flex;
}

.bzsc-j-lightbox img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	border-radius: 6px;
}

html body .bzsc-j-lightbox .bzsc-j-lightbox-close {
	position: absolute;
	top: 16px;
	right: 16px;
	width: 42px;
	height: 42px;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.14) !important;
	color: #ffffff !important;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
}

.bzsc-j-locked {
	overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
	.bzsc-j-card,
	.bzsc-j-modal,
	.bzsc-j-modal-dialog {
		transition-duration: 0.01ms !important;
	}
}

/* --- Related event ----------------------------------------------------- */

.bzsc-j-event {
	border: 1px solid var(--bzsc-j-line);
	border-radius: var(--bzsc-j-radius);
	overflow: hidden;
	background: #ffffff;
}

.bzsc-j-event-head {
	padding: 13px 18px;
	background: #f4f9fc;
	border-bottom: 1px solid #e2ecf2;
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #42606f;
}

.bzsc-j-event-figure {
	line-height: 0;
	background: #eef3f6;
}

.bzsc-j-event-figure img {
	display: block;
	width: 100%;
	height: auto;
	/* Event posters are portrait; cap the height so the aside stays readable. */
	max-height: 320px;
	object-fit: contain;
}

.bzsc-j-event-body {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 14px 18px 18px;
}

.bzsc-j-event-title {
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1.35;
	color: var(--bzsc-j-deep);
}

.bzsc-j-event-dates {
	font-size: 0.8125rem;
	font-weight: 600;
	color: #78909f;
}

.bzsc-j-event-intro {
	margin: 4px 0 0;
	font-size: 0.8125rem;
	line-height: 1.55;
	color: var(--bzsc-j-muted);
}