/* Media/Text carousel — measured from reference media-text-carousel component.
   Fade-style slider: text + image slides, round arrow buttons + "n / total"
   count. Driven by assets/js/media-text-carousel.js; the first slide carries
   .is-active server-side so the component degrades gracefully without JS. */

.media-text-carousel {
	display: block;
	--media-carousel-arrow-size: 5px;
}

.media-text-carousel--slide_text { --media-carousel-arrow-size: 36px; }
@media screen and (min-width: 1280px) {
	.media-text-carousel--slide_text { --media-carousel-arrow-size: 46px; }
}

@media screen and (min-width: 1024px) {
	.media-text-carousel__slider { position: relative; }
}

/* Slides stack in place; active slide participates in layout */
.media-text-carousel__slides { position: relative; }

.media-text-carousel__slide {
	inset: 0;
	opacity: 0;
	position: absolute;
	transition: opacity var(--transition-time) var(--transition-easing),
		visibility var(--transition-time) var(--transition-easing);
	visibility: hidden;
}
.media-text-carousel__slide.is-active {
	opacity: 1;
	position: relative;
	visibility: visible;
}

@media screen and (min-width: 1024px) {
	.media-text-carousel__grid {
		align-items: center;
		grid-template-columns: repeat(2, 1fr);
		row-gap: var(--grid-row-gutter);
	}
}

.media-text-carousel__content { order: 1; }
@media screen and (min-width: 1024px) {
	.media-text-carousel__content {
		display: flex;
		flex-direction: column;
		height: 100%;
		order: 0;
		padding-bottom: calc(var(--media-carousel-arrow-size) + 20px);
	}
}
@media screen and (min-width: 1400px) {
	.media-text-carousel__content {
		justify-content: center;
		padding-top: 25px;
	}
}
.media-text-carousel--slide_text .media-text-carousel__content {
	justify-content: flex-start;
	padding-top: 0;
}
.media-text-carousel--slide_text .media-text-carousel__media { height: 100%; }

.media-text-carousel__image-wrap {
	border-radius: 0;
	height: 100%;
	margin: 0;
	overflow: hidden;
}
.media-text-carousel__image {
	aspect-ratio: 3 / 2;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.media-text-carousel__tag {
	color: var(--color-gray-600);
	margin-bottom: 4px;
}
.media-text-carousel__title { margin-bottom: 6px; }

/* ----------------------------------------------------------------- arrows */

.media-text-carousel__arrows {
	align-items: center;
	display: flex;
	margin-top: 10px;
}
@media screen and (min-width: 1024px) {
	.media-text-carousel__arrows {
		bottom: 0;
		margin-top: 0;
		position: absolute;
		z-index: 2;
	}
	/* media in the left column: arrows sit under the right (text) column */
	.media-text-carousel--align-left .media-text-carousel__arrows {
		left: calc(50% + var(--grid-col-gutter) / 2 + 1px);
	}
}

.media-text-carousel__arrow-button {
	align-items: center;
	background-color: transparent;
	border: 1px solid var(--color-gray-400);
	border-radius: 50%;
	color: var(--color-soft-black);
	cursor: pointer;
	display: inline-flex;
	height: var(--media-carousel-arrow-size, 36px);
	justify-content: center;
	padding: 0;
	transition: all var(--transition-time) var(--transition-easing);
	user-select: none;
	width: var(--media-carousel-arrow-size, 36px);
}
.media-text-carousel__arrow-button svg { scale: 0.8; }
@media screen and (min-width: 1280px) {
	.media-text-carousel__arrow-button svg { scale: 1; }
}
@media (hover: hover) {
	.media-text-carousel__arrow-button:hover { background-color: var(--color-gray-100); }
}
.media-text-carousel__arrow-button:disabled {
	cursor: auto;
	opacity: 0.3;
}
.media-text-carousel__arrow-button:disabled:hover { background-color: transparent; }
.media-text-carousel__arrow-button--right svg { transform: rotate(180deg); }

.media-text-carousel__count {
	display: inline-block;
	min-width: 41px;
	padding: 0 7px;
	text-align: center;
	white-space: nowrap;
}

/* dark section support (mirrors reference section overrides) */
.section--has-background-burgundy-2 .media-text-carousel__arrow-button,
.section--has-background-soft-black .media-text-carousel__arrow-button {
	border-color: var(--color-soft-white);
	color: var(--color-soft-white);
}
.section--has-background-burgundy-2 .media-text-carousel__arrow-button:hover,
.section--has-background-soft-black .media-text-carousel__arrow-button:hover {
	background-color: #ffffff1a;
}

/* =====================================================================
   Destination-page rebuilt sections (single-destination.php).
   The old media-text highlight bands were replaced by the reference's
   cards slider + tabbed expeditions + reviews + inquiry + post cards.
   Slider layout/nav comes from the shared .cards / .slider-nav component
   (components/categories.css); rules below cover only destination-page
   specifics and are scoped to classes rendered by that template alone.
   ===================================================================== */

/* Post cards ("More About …") keep the reference's h4-scale titles */
.dest-post-cards .cards__title { font-size: 19px; }
@media (min-width: 400px)  { .dest-post-cards .cards__title { font-size: calc(0.7vw + 16.2px); } }
@media (min-width: 1400px) { .dest-post-cards .cards__title { font-size: 26px; } }

/* --- tabbed expeditions ------------------------------------------------ */
.dest-expedition-tabs .product-cards__image { min-height: 0; }
.dest-expedition-tabs .product-cards__image img {
	aspect-ratio: 600 / 269;
	height: auto;
	object-fit: cover;
	width: 100%;
}

.dest-tab-ctas {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: center;
	margin-top: var(--grid-section-gutter);
}

/* Block-style CTAs (reference wp-block-button recipe) */
.btn.btn--block {
	border: 0;
	font-size: 1em;
	letter-spacing: normal;
	line-height: 1.5;
	min-width: 0;
	padding: calc(0.667em + 2px) calc(1.333em + 2px);
	text-transform: none;
}
.btn.btn--block-outline {
	background-color: transparent;
	border: 2px solid var(--color-soft-black);
	color: var(--color-soft-black);
	padding: 0.667em 1.333em;
}
.btn.btn--block-outline:hover {
	background-color: var(--color-soft-black);
	color: var(--color-soft-white);
	filter: none;
}

/* --- reviews slide titles ---------------------------------------------- */
.reviews-carousel__title {
	font-size: 22px;
	font-weight: var(--font-weight-light);
	margin-bottom: 0;
}
@media (min-width: 400px)  { .reviews-carousel__title { font-size: calc(0.4vw + 20.4px); } }
@media (min-width: 1400px) { .reviews-carousel__title { font-size: 26px; } }

/* --- inquiry info-box tweaks -------------------------------------------- */
.dest-inquiry .form-row { grid-template-columns: 1fr; }
@media screen and (min-width: 768px) {
	.dest-inquiry .form-row { grid-template-columns: 1fr 1fr; }
}
.dest-inquiry .checkbox__content a {
	color: #fff;
	line-height: 1.6;
	white-space: nowrap;
}
/* Consent link tracks the reference's body-text-tiny scale (12px → 13px at
   >=1400), not the parent .checkbox__content 12px pin, so it matches theirs. */
@media (min-width: 1400px) {
	.dest-inquiry .checkbox.body-text-tiny .checkbox__content a { font-size: 13px; }
}
.dest-radio-row {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 20px;
}
.dest-radio-row .radio { margin: 0; }
