/* ==========================================================================
   BKA 2026 v5 · pages · programme-hub
   Kórházi környezet · Speciális terápiák (cikkcakk checkerboard, brief 17) ·
   Családok támogatása · Gyógyítóink fejlesztése · Tudásmegosztás ·
   Társadalmi szemléletformálás (photo-card grids).
   ========================================================================== */

@import url("programmes-shared.css?v=5.0.1");

/* Checkerboard zig-zag (segelyszervezet.hu /kiknek-segitunk/csalad/ pattern):
   one rounded block, every row = photo half + copy half, the photo swaps
   sides each row so photos and copy meet corner to corner. */
.v5-checker-band__head { margin-bottom: clamp(2rem, 1.4rem + 2vw, 3.5rem); }
.v5-checker {
	display: grid;
	overflow: hidden;
	border-radius: var(--v5-radius-lg);
	background: var(--v5-white);
	box-shadow: var(--v5-shadow-card);
}
.v5-checker__row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}
.v5-checker__media {
	position: relative;
	display: block;
	min-height: clamp(22rem, 10rem + 24vw, 35rem);
	margin: 0;
	overflow: hidden;
	background: var(--v5-mist);
}
.v5-checker__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--v5-dur-slow) var(--v5-ease);
}
.v5-checker__row:hover .v5-checker__media img { transform: scale(1.04); }
.v5-checker__media--mark .v5-placeholder { position: absolute; inset: 0; min-height: 0; }
.v5-checker__row:nth-child(even) .v5-checker__media { order: 2; }
.v5-checker__copy {
	display: flex;
	align-items: center;
	padding: clamp(2.25rem, 1rem + 4vw, 5.5rem) clamp(1.75rem, .5rem + 4.6vw, 6rem);
}
.v5-checker__inner { width: 100%; max-width: 34rem; }
/* A plain decorative red stripe opens every programme: no numbers, no bullets (2026-11-03). */
.v5-checker__inner::before {
	content: "";
	display: block;
	width: 3rem;
	height: 3px;
	margin-bottom: 1.5rem;
	border-radius: 3px;
	background: var(--v5-red);
}
.v5-checker__value { margin: 0 0 .35rem; color: var(--v5-red); font-family: var(--v5-font-display); font-size: var(--v5-fs-h3); }
.v5-checker__title {
	margin: 0 0 1.15rem;
	color: var(--v5-ink);
	font-size: clamp(1.875rem, 1.15rem + 2vw, 3rem);
	line-height: 1.06;
}
.v5-checker__text {
	max-width: none;
	color: var(--v5-ink-soft);
	font-size: clamp(1rem, .96rem + .2vw, 1.125rem);
	line-height: 1.72;
}
.v5-checker__action { margin: 2rem 0 0; }
.v5-checker__row--untitled .v5-checker__text { color: var(--v5-ink); font-size: clamp(1.0625rem, .98rem + .4vw, 1.3125rem); line-height: 1.68; }

/* Photo cards (balanced 12-column grid: 2 · 3 · 2+2 · 2+3+2 …) ----------- */
.v5-hub-cards {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: var(--v5-gap);
}
.v5-hub-card {
	position: relative;
	grid-column: span var(--v5-span, 4);
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: var(--v5-radius);
	background: var(--v5-white);
	box-shadow: var(--v5-shadow-card);
	transition: transform var(--v5-dur) var(--v5-ease), box-shadow var(--v5-dur) var(--v5-ease);
}
.v5-hub-card--link:hover { transform: translateY(-4px); box-shadow: var(--v5-shadow-lift); }
.v5-hub-card:has(.v5-hub-card__link:focus-visible) { box-shadow: var(--v5-focus); }
.v5-hub-card__media {
	position: relative;
	flex: none;
	margin: 0;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--v5-mist);
}
.v5-hub-card--wide .v5-hub-card__media { aspect-ratio: 16 / 9; }
.v5-hub-card__media img,
.v5-hub-card__media .v5-placeholder {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	min-height: 0;
	object-fit: cover;
	transition: transform var(--v5-dur-slow) var(--v5-ease);
}
.v5-hub-card--link:hover .v5-hub-card__media img { transform: scale(1.045); }
.v5-hub-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: .9rem;
	padding: clamp(1.5rem, 1rem + 1.3vw, 2.5rem);
}
.v5-hub-card__value { margin: 0; color: var(--v5-red); font-family: var(--v5-font-display); font-size: var(--v5-fs-h3); }
.v5-hub-card__title {
	margin: 0;
	color: var(--v5-ink);
	font-size: clamp(1.375rem, 1.1rem + .85vw, 1.8125rem);
	line-height: 1.13;
}
.v5-hub-card--wide .v5-hub-card__title { font-size: clamp(1.625rem, 1.15rem + 1.35vw, 2.5rem); line-height: 1.08; }
.v5-hub-card__link { color: inherit; text-decoration: none; }
.v5-hub-card__link:hover { color: inherit; text-decoration: none; }
.v5-hub-card__link:focus-visible { box-shadow: none; }
.v5-hub-card__link::after { content: ""; position: absolute; z-index: 1; inset: 0; }
.v5-hub-card__text {
	color: var(--v5-ink-soft);
	font-size: 1rem;
	line-height: 1.72;
}
.v5-hub-card__text p { margin: 0 0 .85em; }
.v5-hub-card__text > :last-child { margin-bottom: 0; }
.v5-hub-card__text a { position: relative; z-index: 2; }
.v5-hub-card--wide .v5-hub-card__text { font-size: 1.0625rem; }
.v5-hub-card--untitled .v5-hub-card__text { color: var(--v5-ink); font-size: 1.0625rem; }
.v5-hub-card__action { margin: auto 0 0; padding-top: .35rem; }
.v5-hub-card--link:hover .v5-link { color: var(--v5-red-600); }
.v5-hub-card--link:hover .v5-link .v5-icon { transform: translateX(3px); }

@media (max-width: 68.75rem) {
	.v5-hub-card { grid-column: span 6; }
	.v5-hub-card__media,
	.v5-hub-card--wide .v5-hub-card__media { aspect-ratio: 3 / 2; }
	/* An odd last card takes the full row, photo beside the copy. */
	.v5-hub-cards > .v5-hub-card:last-child:nth-child(odd) { grid-column: 1 / -1; flex-direction: row; }
	.v5-hub-cards > .v5-hub-card:last-child:nth-child(odd) .v5-hub-card__media { flex: 0 0 46%; aspect-ratio: auto; min-height: 17rem; }
}

@media (max-width: 56rem) {
	.v5-checker__row { grid-template-columns: 1fr; }
	.v5-checker__row:nth-child(even) .v5-checker__media { order: 0; }
	.v5-checker__media { min-height: 0; aspect-ratio: 4 / 3; }
	.v5-checker__copy { padding: 2.25rem 2rem 2.75rem; }
	.v5-checker__inner { max-width: none; }
}

@media (max-width: 40rem) {
	.v5-checker { margin-inline: calc(-1 * var(--v5-gutter)); border-radius: 0; box-shadow: none; }
	.v5-checker__copy { padding: 1.75rem var(--v5-gutter) 2.5rem; }
	.v5-checker__title { font-size: 1.875rem; }

	.v5-hub-card,
	.v5-hub-cards > .v5-hub-card:last-child:nth-child(odd) { grid-column: 1 / -1; flex-direction: column; }
	.v5-hub-cards > .v5-hub-card:last-child:nth-child(odd) .v5-hub-card__media { flex: none; aspect-ratio: 3 / 2; min-height: 0; }
}