/*
 * Legacy Cherry shortcode layout (loaded only on pages that still use those shortcodes).
 * Generated grid: 12 columns, breakpoints sm 768px, md 992px, lg 1200px (same as the old Bootstrap grid).
 */

.cab-row {
	display: flex;
	flex-wrap: wrap;
	margin-inline: -0.75rem;
}

.cab-col {
	box-sizing: border-box;
	flex: 0 0 100%;
	max-width: 100%;
	min-width: 0;
	padding-inline: 0.75rem;
}

.cab-col-xs-1 { flex-basis: 8.3333%; max-width: 8.3333%; }
.cab-col-xs-2 { flex-basis: 16.6667%; max-width: 16.6667%; }
.cab-col-xs-3 { flex-basis: 25%; max-width: 25%; }
.cab-col-xs-4 { flex-basis: 33.3333%; max-width: 33.3333%; }
.cab-col-xs-5 { flex-basis: 41.6667%; max-width: 41.6667%; }
.cab-col-xs-6 { flex-basis: 50%; max-width: 50%; }
.cab-col-xs-7 { flex-basis: 58.3333%; max-width: 58.3333%; }
.cab-col-xs-8 { flex-basis: 66.6667%; max-width: 66.6667%; }
.cab-col-xs-9 { flex-basis: 75%; max-width: 75%; }
.cab-col-xs-10 { flex-basis: 83.3333%; max-width: 83.3333%; }
.cab-col-xs-11 { flex-basis: 91.6667%; max-width: 91.6667%; }
.cab-col-xs-12 { flex-basis: 100%; max-width: 100%; }
.cab-offset-xs-1 { margin-inline-start: 8.3333%; }
.cab-offset-xs-2 { margin-inline-start: 16.6667%; }
.cab-offset-xs-3 { margin-inline-start: 25%; }
.cab-offset-xs-4 { margin-inline-start: 33.3333%; }
.cab-offset-xs-5 { margin-inline-start: 41.6667%; }
.cab-offset-xs-6 { margin-inline-start: 50%; }
.cab-offset-xs-7 { margin-inline-start: 58.3333%; }
.cab-offset-xs-8 { margin-inline-start: 66.6667%; }
.cab-offset-xs-9 { margin-inline-start: 75%; }
.cab-offset-xs-10 { margin-inline-start: 83.3333%; }
.cab-offset-xs-11 { margin-inline-start: 91.6667%; }

@media (min-width: 768px) {
	.cab-col-sm-1 { flex-basis: 8.3333%; max-width: 8.3333%; }
	.cab-col-sm-2 { flex-basis: 16.6667%; max-width: 16.6667%; }
	.cab-col-sm-3 { flex-basis: 25%; max-width: 25%; }
	.cab-col-sm-4 { flex-basis: 33.3333%; max-width: 33.3333%; }
	.cab-col-sm-5 { flex-basis: 41.6667%; max-width: 41.6667%; }
	.cab-col-sm-6 { flex-basis: 50%; max-width: 50%; }
	.cab-col-sm-7 { flex-basis: 58.3333%; max-width: 58.3333%; }
	.cab-col-sm-8 { flex-basis: 66.6667%; max-width: 66.6667%; }
	.cab-col-sm-9 { flex-basis: 75%; max-width: 75%; }
	.cab-col-sm-10 { flex-basis: 83.3333%; max-width: 83.3333%; }
	.cab-col-sm-11 { flex-basis: 91.6667%; max-width: 91.6667%; }
	.cab-col-sm-12 { flex-basis: 100%; max-width: 100%; }
	.cab-offset-sm-1 { margin-inline-start: 8.3333%; }
	.cab-offset-sm-2 { margin-inline-start: 16.6667%; }
	.cab-offset-sm-3 { margin-inline-start: 25%; }
	.cab-offset-sm-4 { margin-inline-start: 33.3333%; }
	.cab-offset-sm-5 { margin-inline-start: 41.6667%; }
	.cab-offset-sm-6 { margin-inline-start: 50%; }
	.cab-offset-sm-7 { margin-inline-start: 58.3333%; }
	.cab-offset-sm-8 { margin-inline-start: 66.6667%; }
	.cab-offset-sm-9 { margin-inline-start: 75%; }
	.cab-offset-sm-10 { margin-inline-start: 83.3333%; }
	.cab-offset-sm-11 { margin-inline-start: 91.6667%; }
}

@media (min-width: 992px) {
	.cab-col-md-1 { flex-basis: 8.3333%; max-width: 8.3333%; }
	.cab-col-md-2 { flex-basis: 16.6667%; max-width: 16.6667%; }
	.cab-col-md-3 { flex-basis: 25%; max-width: 25%; }
	.cab-col-md-4 { flex-basis: 33.3333%; max-width: 33.3333%; }
	.cab-col-md-5 { flex-basis: 41.6667%; max-width: 41.6667%; }
	.cab-col-md-6 { flex-basis: 50%; max-width: 50%; }
	.cab-col-md-7 { flex-basis: 58.3333%; max-width: 58.3333%; }
	.cab-col-md-8 { flex-basis: 66.6667%; max-width: 66.6667%; }
	.cab-col-md-9 { flex-basis: 75%; max-width: 75%; }
	.cab-col-md-10 { flex-basis: 83.3333%; max-width: 83.3333%; }
	.cab-col-md-11 { flex-basis: 91.6667%; max-width: 91.6667%; }
	.cab-col-md-12 { flex-basis: 100%; max-width: 100%; }
	.cab-offset-md-1 { margin-inline-start: 8.3333%; }
	.cab-offset-md-2 { margin-inline-start: 16.6667%; }
	.cab-offset-md-3 { margin-inline-start: 25%; }
	.cab-offset-md-4 { margin-inline-start: 33.3333%; }
	.cab-offset-md-5 { margin-inline-start: 41.6667%; }
	.cab-offset-md-6 { margin-inline-start: 50%; }
	.cab-offset-md-7 { margin-inline-start: 58.3333%; }
	.cab-offset-md-8 { margin-inline-start: 66.6667%; }
	.cab-offset-md-9 { margin-inline-start: 75%; }
	.cab-offset-md-10 { margin-inline-start: 83.3333%; }
	.cab-offset-md-11 { margin-inline-start: 91.6667%; }
}

@media (min-width: 1200px) {
	.cab-col-lg-1 { flex-basis: 8.3333%; max-width: 8.3333%; }
	.cab-col-lg-2 { flex-basis: 16.6667%; max-width: 16.6667%; }
	.cab-col-lg-3 { flex-basis: 25%; max-width: 25%; }
	.cab-col-lg-4 { flex-basis: 33.3333%; max-width: 33.3333%; }
	.cab-col-lg-5 { flex-basis: 41.6667%; max-width: 41.6667%; }
	.cab-col-lg-6 { flex-basis: 50%; max-width: 50%; }
	.cab-col-lg-7 { flex-basis: 58.3333%; max-width: 58.3333%; }
	.cab-col-lg-8 { flex-basis: 66.6667%; max-width: 66.6667%; }
	.cab-col-lg-9 { flex-basis: 75%; max-width: 75%; }
	.cab-col-lg-10 { flex-basis: 83.3333%; max-width: 83.3333%; }
	.cab-col-lg-11 { flex-basis: 91.6667%; max-width: 91.6667%; }
	.cab-col-lg-12 { flex-basis: 100%; max-width: 100%; }
	.cab-offset-lg-1 { margin-inline-start: 8.3333%; }
	.cab-offset-lg-2 { margin-inline-start: 16.6667%; }
	.cab-offset-lg-3 { margin-inline-start: 25%; }
	.cab-offset-lg-4 { margin-inline-start: 33.3333%; }
	.cab-offset-lg-5 { margin-inline-start: 41.6667%; }
	.cab-offset-lg-6 { margin-inline-start: 50%; }
	.cab-offset-lg-7 { margin-inline-start: 58.3333%; }
	.cab-offset-lg-8 { margin-inline-start: 66.6667%; }
	.cab-offset-lg-9 { margin-inline-start: 75%; }
	.cab-offset-lg-10 { margin-inline-start: 83.3333%; }
	.cab-offset-lg-11 { margin-inline-start: 91.6667%; }
}

.cab-row > .cab-col > :first-child {
	margin-top: 0;
}

/* Full-bleed rows (no type="fixed-width"): edge to edge on full-width pages, normal inside the sidebar layout. */
.cab-row--full {
	margin-block: 0;
}

.cab-row--full > .cab-col {
	padding-inline: 0;
}

.cab-row--full .cab-parallax {
	margin-block: var(--wp--preset--spacing--50);
}

.cab-layout-with-sidebar .cab-row--full {
	max-width: 100%;
	margin-inline: 0 !important;
}

/* Parallax band: photo + dark overlay + white text (contrast >= 4.5:1). */
.cab-parallax {
	position: relative;
	display: grid;
	align-items: center;
	min-height: 200px;
	margin-block: var(--wp--preset--spacing--50);
	padding: clamp(2.5rem, 9vw, 9rem) clamp(1rem, 4vw, 2rem);
	background-color: #333;
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
	color: #fff;
}

.cab-parallax::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgb(0 0 0 / 0.55);
}

.cab-parallax.is-decorative::before {
	background: none;
}

.cab-parallax__inner {
	position: relative;
}

.cab-parallax :where(h1, h2, h3, h4, p, a) {
	color: #fff;
}

/* iOS/iPadOS ignore fixed backgrounds and zoom the image; scroll instead. */
@supports (-webkit-touch-callout: none) {
	.cab-parallax {
		background-attachment: scroll;
	}
}

.cab-title-box {
	text-align: center;
}

.cab-title-box h2 {
	margin: 0 0 0.5rem;
	font-size: var(--wp--preset--font-size--hero);
}

.cab-title-box__subtitle {
	font-size: var(--wp--preset--font-size--large);
}

.cab-dropcap {
	float: left;
	margin: 0.1em 0.12em 0 0;
	font-size: 3.5em;
	font-weight: 700;
	line-height: 0.8;
}

.cab-accordion {
	display: grid;
	gap: 0.5rem;
}

.cab-spoiler {
	border: 1px solid var(--wp--preset--color--muted, #ddd);
}

.cab-spoiler summary {
	padding: 0.75rem 1rem;
	font-weight: 700;
	cursor: pointer;
}

.cab-spoiler[open] summary {
	border-bottom: 1px solid var(--wp--preset--color--muted, #ddd);
}

.cab-spoiler__content {
	padding: 0 1rem;
}

.cab-map {
	margin: 0 0 var(--wp--preset--spacing--40);
}

.cab-map iframe {
	display: block;
	width: 100%;
	border: 0;
}

.cab-posts {
	display: grid;
	gap: var(--wp--preset--spacing--50);
	grid-template-columns: 1fr;
}

@media (min-width: 768px) {
	.cab-posts--cols-2,
	.cab-posts--cols-3,
	.cab-posts--cols-4 {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 992px) {
	.cab-posts--cols-3 {
		grid-template-columns: repeat(3, 1fr);
	}

	.cab-posts--cols-4 {
		grid-template-columns: repeat(4, 1fr);
	}
}

.cab-posts__item img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 570 / 396;
	object-fit: cover;
}

.cab-posts__title {
	margin: 1rem 0 0.5rem;
	font-size: var(--wp--preset--font-size--large);
}