/*
 * Group trip pages (template "Group Trip", patterns in the "Group trips" category).
 *
 * Every trip page is plain core blocks inside one root Group with the class `dct-trip`;
 * all of the design lives here so the page itself holds nothing but editable content.
 * Section groups carry `dct-trip-*` classes from the patterns; small text treatments are
 * registered block styles (`is-style-trip-*`) Pam can pick in the Styles panel.
 *
 * Numbering is generated, never typed: itinerary days, highlight tags and the final-day
 * plane come from CSS counters and :last-child, so days can be added, removed or
 * reordered without renumbering anything.
 *
 * Loaded on the front end only for pages that contain a trip, and in the block editor
 * (scoped to `.editor-styles-wrapper` by core) so the editor matches the page.
 */

.dct-trip {
	--trip-coral: var(--wp--preset--color--primary, #ff735f);
	--trip-coral-ink: #cd4937; /* darker than the palette's dark-primary: AA on white */
	--trip-salmon: var(--wp--preset--color--light-pink, #f5ab99);
	--trip-peach: var(--wp--preset--color--light-orange, #feb47b);
	--trip-plum: var(--wp--preset--color--secondary, #351c4d);
	--trip-purple: var(--wp--preset--color--purle, #765285);
	--trip-ink: #333;
	--trip-gray: var(--wp--preset--color--tertiary, #f0f0f0);
	--trip-white: #fff;
	--trip-shadow: 0 18px 46px rgb(53, 28, 77, 0.16);
	--trip-shadow-sm: 0 8px 24px rgb(53, 28, 77, 0.1);
	--trip-maxw: 1180px;
	--trip-gutter: 24px;
	--trip-head: Georgia, "Times New Roman", serif;
	--trip-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	/* Full-bleed sections pad their content back to the centred column. */
	--trip-bleed: max(var(--trip-gutter), calc((100% - var(--trip-maxw)) / 2));

	/* Spacing is set explicitly below; switch off the theme's flow gap inside trips. */
	--wp--style--block-gap: 0px;

	position: relative;
	isolation: isolate;
	overflow-x: clip;
	background: var(--trip-white);
	color: var(--trip-ink);
	font-family: var(--trip-body);
	font-size: 17px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}
.dct-trip * {
	--wp--style--block-gap: 0px;
}
.dct-trip *,
.dct-trip *::before,
.dct-trip *::after {
	box-sizing: border-box;
}
.dct-trip img {
	display: block;
	max-width: 100%;
	height: auto;
}
.dct-trip figure {
	margin: 0;
}
/* Global styles print the flow gap as a literal (`:root :where(.is-layout-flow) > *
 * { margin-block-start: 20px }`), so the variable above can't reach it. Later, more
 * specific rules in this file set the margins that matter. */
.dct-trip :is(.is-layout-flow, .is-layout-constrained) > * {
	margin-block-start: 0;
}
.dct-trip p {
	margin: 0 0 1em;
}
.dct-trip :where(h1, h2, h3, h4) {
	margin: 0;
	font-family: var(--trip-head);
	font-style: normal;
	color: var(--trip-plum);
}
.dct-trip a {
	color: var(--trip-coral-ink);
}
/* Plum ring on light backgrounds, peach on the plum panels: 3:1 against either. */
.dct-trip :where(a, summary, button):focus-visible {
	outline: 3px solid var(--trip-plum);
	outline-offset: 4px;
}
.dct-trip :where(.dct-trip-highlights, .dct-trip-fit, .dct-trip-final) :where(a, summary, button):focus-visible {
	outline-color: var(--trip-peach);
}

/* The decorative dashed route that wanders behind the page and ducks under panels. */
.dct-trip::before {
	content: "";
	position: absolute;
	z-index: -1;
	inset: 0;
	pointer-events: none;
	opacity: 0.4;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 12000' preserveAspectRatio='none'%3E%3Cpath d='M-120 520 C260 300 240 1040 650 1120 C1080 1210 1190 720 930 650 C690 585 680 1260 1320 1490 C1540 1570 1290 2280 790 2470 C230 2680 280 3370 -100 3590 C-250 3680 260 4270 760 4490 C1260 4710 1430 5350 1110 5660 C830 5930 510 5540 700 5310 C880 5090 1130 5580 860 6210 C500 7040 30 7100 150 7780 C250 8340 1140 8200 1350 9020 C1510 9680 840 10420 300 11220 C40 11610 -130 11930 -280 12180' fill='none' stroke='%23ff735f' stroke-width='3' stroke-dasharray='18 14' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center top / 100% 100% no-repeat;
}

/* ------------------------------------------------------------------ shared */
.dct-trip .dct-trip-section {
	max-width: var(--trip-maxw);
	margin: 0 auto;
	padding: 88px var(--trip-gutter);
}
.dct-trip .dct-trip-head {
	margin: 0 0 36px;
}
.dct-trip h2 {
	max-width: 760px;
	font-size: clamp(1.8rem, 4vw, 2.9rem);
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -0.035em;
}

/* Block style: Trip eyebrow — the small uppercase label above a heading. */
.dct-trip .is-style-trip-eyebrow {
	margin: 0 0 12px;
	font-family: var(--trip-body);
	font-size: 0.74rem;
	font-weight: 800;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--trip-coral-ink);
}
.dct-trip .dct-trip-hero .is-style-trip-eyebrow::before {
	content: "\2726\00a0";
	color: var(--trip-coral);
}

/* Block style: Trip note — a tinted call-out; bold text leads in coral. */
.dct-trip .is-style-trip-note {
	margin: 22px 0 0;
	padding: 16px 20px;
	border-left: 4px solid var(--trip-coral);
	border-radius: 4px 16px 16px 4px;
	background: rgb(245, 171, 153, 0.24);
	font-size: 1rem;
	line-height: 1.55;
	color: var(--trip-ink);
}
.dct-trip .is-style-trip-note strong:first-child {
	font-family: var(--trip-head);
	color: var(--trip-coral-ink);
}

/* Buttons: default = coral pill, Outline style = plum outline pill. White text sits on
 * the darker coral (4.6:1); the brand coral alone is only 2.7:1 with white. */
.dct-trip .wp-block-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}
.dct-trip .wp-block-button__link {
	display: inline-block;
	padding: 14px 28px;
	border: 2px solid var(--trip-coral-ink);
	border-radius: 999px;
	background: var(--trip-coral-ink);
	color: var(--trip-white);
	font-family: var(--trip-body);
	font-size: 0.98rem;
	font-weight: 800;
	letter-spacing: 0.02em;
	text-align: center;
	text-decoration: none;
	text-transform: none;
	transition: transform 0.12s ease, background-color 0.15s ease, color 0.15s ease;
}
.dct-trip .wp-block-button__link:hover {
	border-color: var(--trip-plum);
	background: var(--trip-plum);
	color: var(--trip-white);
	transform: translateY(-2px);
}
.dct-trip .is-style-outline .wp-block-button__link {
	border-color: var(--trip-purple);
	background: var(--trip-white);
	color: var(--trip-plum);
}
.dct-trip .is-style-outline .wp-block-button__link:hover {
	border-color: var(--trip-plum);
	background: var(--trip-plum);
	color: var(--trip-white);
}

/* --------------------------------------------------------------------- hero */
.dct-trip .dct-trip-hero {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr);
	gap: 56px;
	align-items: center;
	max-width: var(--trip-maxw);
	margin: 0 auto;
	padding: 72px var(--trip-gutter) 86px;
}
.dct-trip .dct-trip-hero:not(:has(.dct-trip-hero__media img[src])) {
	grid-template-columns: 1fr;
}
.dct-trip .dct-trip-hero__text {
	max-width: 560px;
}
.dct-trip .dct-trip-hero h1 {
	margin: 0 0 18px;
	font-size: clamp(2.65rem, 5.6vw, 5rem);
	font-weight: 700;
	line-height: 0.96;
	letter-spacing: -0.055em;
	color: var(--trip-plum);
}
/* Italicised words in the title turn coral and drop to their own line. */
.dct-trip .dct-trip-hero h1 em {
	display: inline-block;
	margin-top: 10px;
	font-style: italic;
	color: var(--trip-coral-ink);
}
.dct-trip .dct-trip-lede {
	max-width: 620px;
	margin: 0 0 26px;
	font-size: clamp(1.05rem, 2vw, 1.3rem);
}
.dct-trip .dct-trip-hero__media {
	position: relative;
	height: 600px;
	border-radius: 180px 28px 180px 28px;
	overflow: hidden;
	box-shadow: var(--trip-shadow);
}
.dct-trip .dct-trip-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/* The image caption is the round "UP CLOSE!" sticker. Leave it empty for none. */
.dct-trip .dct-trip-hero__media figcaption {
	position: absolute;
	right: 40px;
	bottom: 40px;
	display: grid;
	place-items: center;
	width: 96px;
	aspect-ratio: 1;
	margin: 0;
	padding: 14px;
	border: 3px solid var(--trip-white);
	border-radius: 50%;
	background: var(--trip-coral-ink);
	color: var(--trip-white);
	font-family: var(--trip-body);
	font-size: 0.72rem;
	font-weight: 900;
	line-height: 1.25;
	letter-spacing: 0.12em;
	text-align: center;
	text-transform: uppercase;
	transform: rotate(-8deg);
}
.dct-trip .dct-trip-hero__media figcaption:empty {
	display: none;
}

/* Block style: Trip fact tiles — list items "<strong>13</strong> Days". */
.dct-trip .is-style-trip-facts {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0 0 34px;
	padding: 0;
	list-style: none;
}
.dct-trip .is-style-trip-facts li {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0;
	padding: 10px 20px 11px;
	border-left: 4px solid var(--trip-coral);
	border-radius: 5px 16px 16px 5px;
	background: rgb(245, 171, 153, 0.3);
	box-shadow: var(--trip-shadow-sm);
	color: var(--trip-purple);
	font-size: 0.68rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	white-space: nowrap;
}
.dct-trip .is-style-trip-facts strong {
	display: block; /* stacks in the editor too, where the item isn't a flex box */
	order: -1;
	font-family: var(--trip-head);
	font-size: 1.55rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	text-transform: none;
	color: var(--trip-plum);
}

/* -------------------------------------------------------------- route ribbon */
.dct-trip .dct-trip-route {
	max-width: var(--trip-maxw);
	margin: 0 auto 30px;
	border-radius: 28px;
	background: var(--trip-gray);
	overflow: hidden;
}
.dct-trip .dct-trip-route__title {
	margin: 0;
	padding: 24px 24px 0;
	font-size: 0.72rem;
	font-weight: 900;
	letter-spacing: 0.12em;
	text-align: center;
	text-transform: uppercase;
	color: var(--trip-plum);
}
.dct-trip .dct-trip-route__stops {
	display: flex;
	align-items: flex-start;
	margin: 0;
	padding: 34px 24px 28px;
	overflow-x: auto;
	list-style: none;
}
/* Equal-width stops so each dashed segment meets the next pin centre to centre. */
.dct-trip .dct-trip-route__stops li {
	position: relative;
	flex: 1 1 0;
	min-width: 96px;
	margin: 0;
	padding: 24px 4px 0;
	font-size: 0.82rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.02em;
	text-align: center;
	color: var(--trip-plum);
}
.dct-trip .dct-trip-route__stops li::after {
	content: "";
	position: absolute;
	z-index: 1;
	top: 2px;
	left: 50%;
	width: 13px;
	height: 13px;
	border: 2px solid var(--trip-gray);
	border-radius: 50%;
	background: var(--trip-coral);
	transform: translateX(-50%);
}
.dct-trip .dct-trip-route__stops li + li::before {
	content: "";
	position: absolute;
	top: 8px;
	left: -50%;
	width: 100%;
	border-top: 2px dashed rgb(245, 171, 153, 0.9);
}
/* Bold text in a stop is a country label riding above the pin ("<strong>Kenya</strong>Nairobi"). */
.dct-trip .dct-trip-route__stops strong {
	position: absolute;
	top: -18px;
	left: 50%;
	transform: translateX(-50%);
	font-size: 0.62rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--trip-coral-ink);
}
/* A flight leg (list item class `dct-trip-route__fly`): a plane instead of a pin. */
.dct-trip .dct-trip-route__stops li.dct-trip-route__fly {
	color: var(--trip-coral-ink);
}
.dct-trip .dct-trip-route__stops li.dct-trip-route__fly::after {
	content: "\2708\FE0E";
	top: -6px;
	width: auto;
	height: auto;
	border: 0;
	background: none;
	font-family: Arial, "Segoe UI Symbol", sans-serif;
	font-size: 1.35rem;
	line-height: 1;
	color: var(--trip-coral-ink);
	transform: translateX(-50%) rotate(-10deg);
}

/* ----------------------------------------------------------------- overview */
.dct-trip .dct-trip-overview {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);
	gap: 70px;
	align-items: start;
}
.dct-trip .dct-trip-big {
	margin: 14px 0 0;
	font-family: var(--trip-head);
	font-size: clamp(1.25rem, 2vw, 1.65rem);
	line-height: 1.55;
	color: var(--trip-plum);
}
.dct-trip .dct-trip-host {
	align-self: end;
	border-radius: 28px 28px 28px 4px;
	background: var(--trip-salmon);
	overflow: hidden;
}
.dct-trip .dct-trip-host .wp-block-image {
	aspect-ratio: 5 / 3;
	overflow: hidden;
}
.dct-trip .dct-trip-host .wp-block-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 30%;
}
.dct-trip .dct-trip-host__body {
	padding: 22px 26px 26px;
	font-size: 0.96rem;
	line-height: 1.55;
}
.dct-trip .dct-trip-host__body .is-style-trip-eyebrow {
	margin-bottom: 8px;
	letter-spacing: 0.16em;
	font-size: 0.72rem;
}
.dct-trip .dct-trip-host__name {
	margin: 2px 0 12px;
	font-family: var(--trip-head);
	font-size: 1.7rem;
	font-weight: 700;
	line-height: 1;
	color: var(--trip-plum);
}
.dct-trip .dct-trip-host__note {
	margin: 0;
	font-size: 0.92rem;
	color: var(--trip-plum);
}

/* --------------------------------------------------------- highlight mosaic */
.dct-trip .dct-trip-highlights {
	max-width: none;
	padding-inline: var(--trip-bleed);
	background: var(--trip-plum);
}
.dct-trip .dct-trip-highlights .is-style-trip-eyebrow {
	color: var(--trip-peach);
}
.dct-trip .dct-trip-highlights h2 {
	color: var(--trip-white);
}
/* A 7/5 feature row, then up to four across. Cards grow to fill their row, so a short
 * last row (5 or 7 cards, say) stretches instead of leaving holes. */
.dct-trip .dct-trip-cards {
	counter-reset: trip-card;
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}
.dct-trip .dct-trip-card {
	counter-increment: trip-card;
	position: relative;
	display: flex;
	flex: 1 1 calc(25% - 12px);
	align-items: flex-end;
	height: 230px;
	border-radius: 26px;
	background: var(--trip-purple);
	overflow: hidden;
}
.dct-trip .dct-trip-card:nth-child(1) {
	flex-basis: calc(58.33% - 8px);
	height: 300px;
}
.dct-trip .dct-trip-card:nth-child(2) {
	flex-basis: calc(41.67% - 8px);
	height: 300px;
}
.dct-trip .dct-trip-card .wp-block-image {
	position: absolute;
	inset: 0;
}
.dct-trip .dct-trip-card .wp-block-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}
.dct-trip .dct-trip-card:hover .wp-block-image img {
	transform: scale(1.06);
}
.dct-trip .dct-trip-card::before {
	content: counter(trip-card, decimal-leading-zero);
	position: absolute;
	z-index: 2;
	top: 12px;
	left: 12px;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--trip-coral); /* plum on coral: 4.6:1 */
	font-family: var(--trip-head);
	font-size: 0.82rem;
	font-weight: 900;
	color: var(--trip-plum);
}
.dct-trip .dct-trip-card h3 {
	position: relative;
	z-index: 2;
	width: 100%;
	margin: 0;
	padding: 12px 18px;
	background: rgb(0, 0, 0, 0.7);
	font-family: var(--trip-head);
	font-size: 1.1rem;
	font-weight: 800;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	color: var(--trip-white);
}

/* --------------------------------------------------------------- testimonials */
.dct-trip .dct-trip-reviews__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 22px;
}
.dct-trip .dct-trip-review {
	position: relative;
	padding: 30px 32px 28px;
	border-top: 6px solid var(--trip-coral);
	border-radius: 26px;
	background: var(--trip-gray);
}
.dct-trip .dct-trip-review::before {
	content: "\201C";
	display: block;
	height: 34px;
	font-family: var(--trip-head);
	font-size: 4.5rem;
	line-height: 0.85;
	color: var(--trip-salmon);
}
/* Review text matches the original's 1rem; the headline and byline set their own. */
.dct-trip .dct-trip-review :where(p) {
	font-size: 1rem;
	line-height: 1.6;
}
.dct-trip .dct-trip-review__hi {
	margin: 0 0 14px;
	font-family: var(--trip-head);
	font-size: clamp(1.25rem, 2vw, 1.6rem);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -0.02em;
	color: var(--trip-plum);
}
.dct-trip .dct-trip-review__by {
	margin: 0;
	font-family: var(--trip-head);
	font-weight: 700;
	color: var(--trip-plum);
}
.dct-trip .dct-trip-review__by::before {
	content: "\2605\2605\2605\2605\2605";
	display: block;
	margin-bottom: 2px;
	font-family: var(--trip-body);
	font-size: 0.95rem;
	letter-spacing: 0.15em;
	color: var(--trip-coral);
}

/* --------------------------------------------------- who it's for + price */
.dct-trip .dct-trip-band {
	display: grid;
	grid-template-columns: 1.3fr 1fr;
	gap: 44px;
	align-items: center;
	max-width: var(--trip-maxw);
	margin: 88px auto;
	padding: 64px 24px;
	border-radius: 40px;
	background: var(--trip-plum);
	color: var(--trip-white);
}
.dct-trip .dct-trip-band .is-style-trip-eyebrow {
	color: var(--trip-peach);
}
.dct-trip .dct-trip-band h2 {
	color: var(--trip-white);
}
.dct-trip .dct-trip-fit p:not(.is-style-trip-eyebrow) {
	margin: 16px 0 22px;
	font-size: 1.16rem;
	color: var(--trip-gray);
}

/* Block style: Trip chips — rounded tick chips (used on the plum band). */
.dct-trip .is-style-trip-chips {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.dct-trip .is-style-trip-chips li {
	position: relative;
	margin: 0;
	padding: 10px 14px 10px 36px;
	border: 1px solid var(--trip-salmon);
	border-radius: 999px;
	font-size: 0.92rem;
	font-weight: 600;
}
.dct-trip .is-style-trip-chips li::before {
	content: "\2714";
	position: absolute;
	top: 10px;
	left: 14px;
	font-weight: 700;
	color: var(--trip-peach);
}

/* Price card. */
.dct-trip .dct-trip-cost {
	padding: 30px 30px 26px;
	border-top: 5px solid var(--trip-coral);
	border-radius: 30px;
	background: var(--trip-white);
	color: var(--trip-ink);
}
.dct-trip .dct-trip-cost .is-style-trip-eyebrow {
	margin-bottom: 4px;
	letter-spacing: 0.16em;
	font-size: 0.7rem;
	color: var(--trip-coral-ink);
}
.dct-trip .dct-trip-cost__price {
	margin: 0 0 4px;
	font-family: var(--trip-head);
	font-size: 3rem;
	font-weight: 900;
	line-height: 1;
	color: var(--trip-plum);
}
.dct-trip .dct-trip-cost__dates {
	margin: 0 0 18px;
	font-size: 0.94rem;
	font-weight: 700;
	color: var(--trip-purple);
}
.dct-trip .dct-trip-cost .is-style-trip-note {
	margin: 0 0 18px;
	padding: 12px 14px;
	border-left: 0;
	border-radius: 10px;
	background: rgb(245, 171, 153, 0.28);
	font-size: 0.88rem;
	line-height: 1.45;
}
.dct-trip .dct-trip-cost .is-style-trip-note strong:first-child {
	font-family: var(--trip-body);
	font-weight: 800;
}
.dct-trip .dct-trip-cost .is-style-trip-note strong:not(:first-child) {
	color: var(--trip-plum);
}
/* Payment schedule: "<strong>Deposit</strong> $1000 (non-refundable)". */
.dct-trip .dct-trip-cost__pay {
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
}
.dct-trip .dct-trip-cost__pay li {
	margin: 0;
	padding: 9px 0;
	border-bottom: 1px solid var(--trip-salmon);
	font-size: 0.93rem;
}
.dct-trip .dct-trip-cost__pay li:last-child {
	border-bottom: 0;
}
.dct-trip .dct-trip-cost__pay strong {
	display: block;
	font-size: 0.74rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--trip-coral-ink);
}
.dct-trip .dct-trip-cost .wp-block-button,
.dct-trip .dct-trip-cost .wp-block-button__link {
	width: 100%;
}
.dct-trip .dct-trip-cost__excl {
	margin: 16px 0 0;
	font-size: 0.82rem;
	line-height: 1.5;
	color: var(--trip-purple);
}
.dct-trip .dct-trip-cost__excl strong {
	color: var(--trip-ink);
}

/* Early-bird offer (pattern "Trip: early-bird offer"). Hidden automatically once the
 * date written in it has passed — server-side, and again in the browser for cached pages. */
.dct-trip .dct-trip-offer {
	margin: 0 0 18px;
	padding: 14px 16px;
	border: 2px dashed var(--trip-coral);
	border-radius: 16px;
	background: rgb(255, 115, 95, 0.08);
	font-size: 0.9rem;
	line-height: 1.45;
	color: var(--trip-plum);
}
.dct-trip .dct-trip-offer > :last-child {
	margin-bottom: 0;
}
.dct-trip .dct-trip-offer__badge {
	display: inline-block;
	margin: 0 0 8px;
	padding: 6px 14px;
	border-radius: 999px;
	background: var(--trip-coral-ink);
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	line-height: 1;
	text-transform: uppercase;
	color: var(--trip-white);
}
.dct-trip .dct-trip-offer s {
	color: var(--trip-purple);
}
.dct-trip .dct-trip-offer.is-expired {
	display: none;
}

/* ---------------------------------------------------------------- itinerary */
.dct-trip .dct-trip-itinerary {
	padding-top: 28px;
}
.dct-trip .dct-trip-itinerary .dct-trip-head {
	max-width: 860px;
	margin-inline: auto;
}
.dct-trip .dct-trip-days {
	counter-reset: trip-day;
	position: relative;
	max-width: 860px;
	margin: 0 auto;
}
/* The dashed flight path down the left rail. */
.dct-trip .dct-trip-days::before {
	content: "";
	position: absolute;
	top: 6px;
	bottom: 22px;
	left: 23px;
	border-left: 3px dashed var(--trip-salmon);
}
.dct-trip .dct-trip-day {
	counter-increment: trip-day;
	position: relative;
	display: grid;
	grid-template-columns: 200px 1fr;
	margin: 0 0 26px 74px;
	border-radius: 24px;
	background: var(--trip-white);
	box-shadow: var(--trip-shadow-sm);
	overflow: visible;
}
/* Core renders nothing for an image block without a photo; give the text the full card. */
.dct-trip .dct-trip-day:not(:has(> .wp-block-image img[src])) {
	grid-template-columns: 1fr;
}
.dct-trip .dct-trip-day::before {
	content: counter(trip-day);
	position: absolute;
	z-index: 2;
	top: 0;
	left: -74px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border: 3px solid var(--trip-white);
	border-radius: 50%;
	background: var(--trip-coral-ink);
	box-shadow: 0 5px 12px rgb(255, 115, 95, 0.4);
	font-family: var(--trip-head);
	font-size: 1.05rem;
	font-weight: 800;
	color: var(--trip-white);
}
/* The last day ends the rail with a plane heading home. */
.dct-trip .dct-trip-day:last-child {
	margin-bottom: 58px;
}
.dct-trip .dct-trip-day:last-child::after {
	content: "\2708";
	position: absolute;
	z-index: 2;
	bottom: -58px;
	left: -74px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border: 3px solid var(--trip-white);
	border-radius: 50%;
	background: var(--trip-plum);
	box-shadow: 0 5px 12px rgb(53, 28, 77, 0.32);
	font-family: Arial, "Segoe UI Symbol", sans-serif;
	font-size: 1.15rem;
	line-height: 1;
	color: var(--trip-white);
	transform: rotate(90deg);
}
/* A day that ends with a flight (Advanced → Additional CSS class `dct-trip-day--fly`):
 * a plane rides the rail down to the next day. */
.dct-trip .dct-trip-day--fly:not(:last-child)::after {
	content: "\2708";
	position: absolute;
	z-index: 2;
	bottom: -20px;
	left: -50px;
	padding: 10px 0;
	background: var(--trip-white);
	box-shadow: 0 0 10px 8px var(--trip-white);
	font-family: Arial, "Segoe UI Symbol", sans-serif;
	font-size: 1.7rem;
	line-height: 1;
	color: var(--trip-coral-ink);
	transform: translateX(-50%) rotate(90deg);
}
.dct-trip .dct-trip-day > .wp-block-image {
	min-height: 160px;
	border-radius: 24px 0 0 24px;
	overflow: hidden;
}
.dct-trip .dct-trip-day > .wp-block-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.dct-trip .dct-trip-day__body {
	padding: 20px 24px;
}
.dct-trip .dct-trip-day h3 {
	margin: 0 0 10px;
	font-size: 1.28rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.02em;
}
.dct-trip .dct-trip-day__body p {
	margin: 0 0 14px;
	font-size: 0.95rem;
}
/* What's included that day: pill chips in a gray tray. */
.dct-trip .dct-trip-day__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 8px;
	margin: 14px 0 0;
	padding: 14px 16px;
	border-radius: 12px;
	background: var(--trip-gray);
	list-style: none;
}
.dct-trip .dct-trip-day__meta li {
	margin: 0;
	padding: 4px 12px;
	border: 1px solid var(--trip-salmon);
	border-radius: 999px;
	background: var(--trip-white);
	font-size: 0.84rem;
}

/* A centred call to action under the itinerary. */
.dct-trip .dct-trip-cta-row {
	margin-top: 40px;
}
.dct-trip .dct-trip-cta-row .wp-block-buttons {
	justify-content: center;
}

/* --------------------------------------------------- included / not included */
.dct-trip .dct-trip-incl {
	max-width: none;
	padding-inline: var(--trip-bleed);
	background: var(--trip-gray);
}
.dct-trip .dct-trip-incl__grid {
	display: grid;
	grid-template-columns: 1.5fr 1fr;
	gap: 26px;
	align-items: start;
}
.dct-trip .dct-trip-incl__col {
	padding: 12px 32px 30px;
	border-top: 6px solid var(--trip-coral);
	border-radius: 28px;
	background: var(--trip-white);
	box-shadow: var(--trip-shadow-sm);
}
.dct-trip .dct-trip-incl__col--no {
	border-top-color: var(--trip-purple);
	background: var(--trip-gray);
}
.dct-trip .dct-trip-incl__col h3 {
	margin: 22px 0 14px;
	padding-bottom: 12px;
	border-bottom: 3px solid var(--trip-salmon);
	font-size: 1.15rem;
	font-weight: 900;
	color: var(--trip-coral-ink);
}
.dct-trip .dct-trip-incl__col--no h3 {
	border-bottom-color: var(--trip-purple);
}
.dct-trip .dct-trip-incl__sub {
	margin: 22px 0 12px;
	padding-top: 14px;
	border-top: 2px dashed var(--trip-salmon);
	font-family: var(--trip-head);
	font-size: 0.82rem;
	font-weight: 800;
	text-transform: uppercase;
	color: var(--trip-coral-ink);
}

/* Block styles: Trip checklist (coral ticks) and Trip cross list (purple crosses). */
.dct-trip :is(.is-style-trip-check, .is-style-trip-cross) {
	margin: 0;
	padding: 0;
	list-style: none;
}
.dct-trip :is(.is-style-trip-check, .is-style-trip-cross) li {
	position: relative;
	margin: 0;
	padding: 7px 0 7px 28px;
	border-bottom: 1px solid var(--trip-salmon);
	font-size: 0.94rem;
}
.dct-trip :is(.is-style-trip-check, .is-style-trip-cross) li:last-child {
	border-bottom: 0;
}
.dct-trip .is-style-trip-check li::before {
	content: "";
	position: absolute;
	top: 15px;
	left: 3px;
	width: 12px;
	height: 7px;
	border-bottom: 2.5px solid var(--trip-coral);
	border-left: 2.5px solid var(--trip-coral);
	transform: rotate(-45deg);
}
.dct-trip .is-style-trip-cross li::before {
	content: "\00d7";
	position: absolute;
	top: 10px;
	left: 6px;
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1;
	color: var(--trip-purple);
}

/* ---------------------------------------------------------------------- FAQ */
.dct-trip .dct-trip-faq .dct-trip-head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 14px 20px;
}
/* "Expand all" is added by group-trip.js. */
.dct-trip .dct-trip-faq__toggle {
	padding: 9px 20px;
	border: 2px solid var(--trip-salmon);
	border-radius: 999px;
	background: transparent;
	font-family: var(--trip-body);
	font-size: 0.82rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	color: var(--trip-coral-ink);
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.dct-trip .dct-trip-faq__toggle:hover {
	border-color: var(--trip-coral);
	background: var(--trip-coral);
	color: var(--trip-white);
}
.dct-trip .dct-trip-faq__list {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	align-items: start;
}
.dct-trip .dct-trip-faq__list .wp-block-details {
	margin: 0;
	border: 1px solid var(--trip-salmon);
	border-radius: 16px;
	background: var(--trip-white);
	overflow: hidden;
}
.dct-trip .dct-trip-faq__list summary {
	position: relative;
	padding: 18px 56px 18px 22px;
	list-style: none;
	font-family: var(--trip-head);
	font-size: 1rem;
	font-weight: 800;
	color: var(--trip-plum);
	cursor: pointer;
	transition: background-color 0.15s ease;
}
.dct-trip .dct-trip-faq__list summary::-webkit-details-marker {
	display: none;
}
/* Plus drawn from two centred bars so it stays aligned when rotated into an ×. */
.dct-trip .dct-trip-faq__list summary::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 16px;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background-color: rgb(245, 171, 153, 0.4);
	background-image: linear-gradient(var(--trip-coral-ink), var(--trip-coral-ink)), linear-gradient(var(--trip-coral-ink), var(--trip-coral-ink));
	background-position: center, center;
	background-repeat: no-repeat;
	background-size: 12px 2px, 2px 12px;
	transform: translateY(-50%);
	transition: transform 0.2s ease, background-color 0.15s ease;
}
.dct-trip .dct-trip-faq__list details:not([open]) summary:hover {
	background: rgb(245, 171, 153, 0.16);
}
.dct-trip .dct-trip-faq__list details[open] summary::after {
	background-color: var(--trip-coral);
	background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff);
	transform: translateY(-50%) rotate(45deg);
}
.dct-trip .dct-trip-faq__list details > :not(summary) {
	margin: 0;
	padding: 0 22px 12px;
}
.dct-trip .dct-trip-faq__list details > :last-child {
	padding-bottom: 20px;
}
.dct-trip .dct-trip-faq__list details :is(ul, ol) {
	padding-left: 42px;
}
.dct-trip .dct-trip-faq__list details li {
	margin: 0 0 6px;
}
.dct-trip .dct-trip-faq__list details em {
	color: var(--trip-purple);
}
.dct-trip .dct-trip-faq__contact {
	margin: 40px auto 0;
	text-align: center;
}

/* ---------------------------------------------------------------- final CTA */
.dct-trip .dct-trip-final.wp-block-cover {
	min-height: 0;
	padding: 88px var(--trip-gutter);
	color: var(--trip-white);
	text-align: center;
}
.dct-trip .dct-trip-final .wp-block-cover__inner-container {
	max-width: 672px;
	margin: 0 auto;
	color: var(--trip-white);
}
.dct-trip .dct-trip-final .is-style-trip-eyebrow {
	color: var(--trip-peach);
}
.dct-trip .dct-trip-final h2 {
	max-width: none;
	margin: 0 0 16px;
	font-size: clamp(2rem, 4.4vw, 3.2rem);
	line-height: 1.02;
	letter-spacing: -0.03em;
	color: var(--trip-white);
}
.dct-trip .dct-trip-final p:not(.is-style-trip-eyebrow) {
	margin: 0 0 28px;
	font-size: 1.18rem;
}
.dct-trip .dct-trip-final .wp-block-buttons {
	justify-content: center;
}
.dct-trip .dct-trip-final .wp-block-button__link {
	padding: 18px 42px;
	font-size: 1.08rem;
}
.dct-trip .dct-trip-final p.dct-trip-final__note {
	margin: 24px 0 0;
	font-size: 1rem;
	color: var(--trip-salmon);
}
.dct-trip .dct-trip-final__note a {
	color: var(--trip-salmon);
}

/* --------------------------------------------------------------- newsletter */
.dct-trip .dct-trip-news {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding: 32px var(--trip-bleed);
	background: var(--trip-salmon);
}
.dct-trip .dct-trip-news h3 {
	margin: 0 0 4px;
	font-size: 1.3rem;
	font-weight: 900;
}
.dct-trip .dct-trip-news p {
	margin: 0;
	color: var(--trip-plum);
}
.dct-trip .dct-trip-news .is-style-outline .wp-block-button__link {
	border-color: var(--trip-plum);
	background: transparent;
}

/* Travelpayouts' Emerald widgets don't belong on a sales page. */
body:has(.dct-trip) .emerald-block,
body:has(.dct-trip) [class*="emerald-block"] {
	display: none !important;
}

/* --------------------------------------------------------------- responsive */
@media (max-width: 980px) {
	.dct-trip .dct-trip-hero {
		grid-template-columns: 1fr 0.9fr;
		gap: 32px;
	}
	.dct-trip .dct-trip-hero__media {
		height: 520px;
		border-radius: 120px 24px 120px 24px;
	}
	.dct-trip .dct-trip-overview {
		grid-template-columns: 1fr;
		gap: 30px;
	}
	.dct-trip .dct-trip-band {
		grid-template-columns: 1fr;
		gap: 32px;
		margin-inline: var(--trip-gutter);
	}
	.dct-trip .dct-trip-incl__grid {
		grid-template-columns: 1fr;
	}
	.dct-trip .dct-trip-faq__list {
		grid-template-columns: 1fr;
	}
	.dct-trip .dct-trip-day {
		grid-template-columns: 170px 1fr;
	}
}

@media (max-width: 720px) {
	.dct-trip {
		--trip-gutter: 18px;
		font-size: 16px;
	}
	.dct-trip .dct-trip-section {
		padding-block: 58px;
	}
	.dct-trip .dct-trip-hero {
		grid-template-columns: 1fr;
		gap: 28px;
		padding: 36px var(--trip-gutter) 58px;
	}
	.dct-trip .dct-trip-hero__media {
		height: 440px;
		border-radius: 96px 20px 96px 20px;
	}
	.dct-trip .dct-trip-hero .wp-block-buttons {
		flex-direction: column;
	}
	.dct-trip .dct-trip-hero .wp-block-button,
	.dct-trip .dct-trip-hero .wp-block-button__link {
		width: 100%;
	}
	.dct-trip .dct-trip-route {
		margin-inline: var(--trip-gutter);
	}
	.dct-trip .dct-trip-cards > .dct-trip-card:nth-child(n) {
		flex-basis: calc(50% - 8px);
		height: 230px;
	}
	.dct-trip .dct-trip-reviews__grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}
	.dct-trip .dct-trip-band {
		margin-block: 58px;
		padding: 40px 24px;
		border-radius: 30px;
	}
	.dct-trip .is-style-trip-chips {
		grid-template-columns: 1fr;
	}
	.dct-trip .dct-trip-days::before {
		left: 19px;
	}
	.dct-trip .dct-trip-day {
		grid-template-columns: 1fr;
		margin-left: 58px;
	}
	.dct-trip .dct-trip-day::before,
	.dct-trip .dct-trip-day:last-child::after {
		left: -58px;
		width: 40px;
		height: 40px;
		font-size: 0.95rem;
	}
	.dct-trip .dct-trip-day--fly:not(:last-child)::after {
		left: -38px;
	}
	.dct-trip .dct-trip-day > .wp-block-image {
		max-height: 230px;
		border-radius: 24px 24px 0 0;
	}
	.dct-trip .dct-trip-news {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* style.css forces `height: auto !important` on content images below 600px; these
 * photos are cropped to fill a frame, like the featured-image exception there. */
@media (max-width: 599px) {
	.dct-trip :is(.dct-trip-hero__media, .dct-trip-card .wp-block-image, .dct-trip-day > .wp-block-image, .dct-trip-host .wp-block-image) img {
		height: 100% !important;
	}
}

@media (max-width: 460px) {
	.dct-trip .dct-trip-hero h1 {
		font-size: 2.7rem;
	}
	.dct-trip .dct-trip-hero__media {
		height: 360px;
	}
	.dct-trip .dct-trip-hero__media figcaption {
		right: 16px;
		bottom: 16px;
		width: 88px;
		font-size: 0.58rem;
	}
	.dct-trip .dct-trip-cards > .dct-trip-card:nth-child(n) {
		flex-basis: 100%;
	}
	.dct-trip .dct-trip-route__title {
		text-align: left;
	}
}

@media (prefers-reduced-motion: reduce) {
	.dct-trip * {
		transition: none !important;
	}
}