/*
Theme Name:   WP-Journeys Child
Template:     astra
Version:      1.0.0
Description:  Astra child theme for WP-Journeys. Carries only the design's animations, masks and scroll effects; layout, colour and typography stay in Elementor.
Text Domain:  wpj-child
*/

/*
 * How this file is organised
 * - Colours come from the Elementor global variables (--wpj-*), so they stay editable in Elementor.
 * - Effects that hide or move content only apply under html.wpj-fx, a class the script adds.
 *   Without JavaScript (and in the Elementor editor) the page shows its plain Elementor layout.
 * - Static masks and decorative layers apply without the script.
 */

.wpj-sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* =========================================================== container context */

/* The element wrapping the whole page is the query container: every band height, offset
   and mask size in the design is in cqw, and resolves against this box (not the viewport,
   whose vw includes the scrollbar). Elementor has no container-type control, so it lives here. */
.wpj-page {
	container-type: inline-size;
	overflow-x: clip;
}

/* Elementor gives every atomic container `transition: transform .4s`. The script writes these
   elements' transforms itself on every frame (ring cards, parallax bands, hero texts), so any
   CSS easing on top would make them trail behind the computed position. The design has none. */
html.wpj-fx .wpj-carou-card,
html.wpj-fx .wpj-anaga-band,
html.wpj-fx .wpj-cliff-band,
html.wpj-fx .wpj-teide-band,
html.wpj-fx .wpj-hero-copy {
	transition: none;
}

/* =========================================================== hero */

.wpj-hero-video {
	-webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 82%, rgba(0, 0, 0, 0.86) 89%, rgba(0, 0, 0, 0.5) 95%, rgba(0, 0, 0, 0) 100%);
	mask-image: linear-gradient(to bottom, #000 0%, #000 82%, rgba(0, 0, 0, 0.86) 89%, rgba(0, 0, 0, 0.5) 95%, rgba(0, 0, 0, 0) 100%);
}

/* follower clips and texts wait hidden; the script cross-fades them (visible in the editor for editing) */
body:not(.elementor-editor-active) .wpj-hero-video-b,
body:not(.elementor-editor-active) .wpj-hero-copy-b {
	opacity: 0;
}

@keyframes wpjRiseIn {
	from { opacity: 0; transform: translateY(22px); }
	to { opacity: 1; transform: translateY(0); }
}

@keyframes wpjCueBob {
	0%, 100% { transform: translateY(0); opacity: 0.5; }
	50% { transform: translateY(12px); opacity: 1; }
}

.wpj-fx .wpj-hero-kicker { animation: wpjRiseIn 0.8s 0.1s both; }
.wpj-fx .wpj-hero-title { animation: wpjRiseIn 0.9s 0.28s both; }
.wpj-fx .wpj-hero-lead { animation: wpjRiseIn 0.9s 0.46s both; }
.wpj-fx .wpj-hero-inner > .wpj-btn-row { animation: wpjRiseIn 0.9s 0.62s both; }
.wpj-cue-bar { animation: wpjCueBob 2.4s ease-in-out infinite; }

/* =========================================================== mountain bands */

/* haze and sunset wash: decorative layers the script inserts into .wpj-bands */
.wpj-haze {
	position: relative;
	z-index: 0;
	flex: none;
	width: 100%;
	height: 40.52cqw; /* --haze-h */
	opacity: 0.75;
	filter: blur(34px) saturate(1.1);
	background-repeat: no-repeat;
	pointer-events: none;
	will-change: transform;
	-webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.14) 22%, rgba(0, 0, 0, 0.4) 44%, rgba(0, 0, 0, 0.7) 66%, rgba(0, 0, 0, 0.92) 84%, #000 100%);
	mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.14) 22%, rgba(0, 0, 0, 0.4) 44%, rgba(0, 0, 0, 0.7) 66%, rgba(0, 0, 0, 0.92) 84%, #000 100%);
}

/* .haze-anaga: margin-top calc(--haze-off-a - --haze-h), margin-bottom calc(0px - --haze-off-a) */
.wpj-haze-anaga {
	margin-top: calc(40.39cqw - 40.52cqw);
	margin-bottom: calc(0px - 40.39cqw);
	background-image: url("/wp-content/uploads/2026/09/wpj-anaga-ridge-sm.png");
	background-size: cover;
	background-position: right top;
	-webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 5%, rgba(0, 0, 0, 0.4) 11%, #000 18%, #000 26%, rgba(0, 0, 0, 0.6) 38%, rgba(0, 0, 0, 0.24) 48%, rgba(0, 0, 0, 0) 58%);
	mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 5%, rgba(0, 0, 0, 0.4) 11%, #000 18%, #000 26%, rgba(0, 0, 0, 0.6) 38%, rgba(0, 0, 0, 0.24) 48%, rgba(0, 0, 0, 0) 58%);
}

/* .haze-cliff, from --band-h 55.82, --cliff-drop 9.80, --cliff-h 43.14, --haze-h-c 19.61, --haze-off-c 29.41 */
.wpj-haze-cliff {
	width: 58%;
	height: 19.61cqw;
	margin-top: calc(55.82cqw + 9.8cqw - 43.14cqw - 19.61cqw + 29.41cqw);
	margin-bottom: calc(43.14cqw - 55.82cqw - 9.8cqw - 29.41cqw);
	background-image: url("/wp-content/uploads/2026/09/wpj-gigantes-cliff-flip.png");
	background-size: auto 190%;
	background-position: left bottom;
}

/* .edge-haze: flex 0 0 --edge-h, margin-top --edge-off, margin-bottom calc(0px - --edge-h - --edge-off) */
.wpj-edge-haze {
	position: relative;
	z-index: 1;
	flex: 0 0 44.44cqw;
	width: 100%;
	height: 44.44cqw;
	margin-top: -29.1cqw;
	margin-bottom: calc(0px - 44.44cqw - -29.1cqw);
	background: url("/wp-content/uploads/2026/09/wpj-sky-sunset.webp") center bottom / cover no-repeat;
	pointer-events: none;
	will-change: transform;
	-webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 30%);
	mask-image: linear-gradient(to bottom, transparent 0%, #000 30%);
}

.wpj-fx .wpj-anaga-band,
.wpj-fx .wpj-cliff-band,
.wpj-fx .wpj-teide-band {
	will-change: transform;
}

/* Glowing ridge lines. Each SVG sits in exactly the box of its photo: pinned to the band's
   top, full width, height:auto with the PNG's own 1376:768 proportion (the viewBox has the
   same ratio, so preserveAspectRatio="xMinYMin meet" never letterboxes). The band clips both. */
.wpj-ridge {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	width: 100%;
	pointer-events: none;
}

.wpj-ridge svg {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1376 / 768;
	overflow: visible;
}

.wpj-ridge path {
	fill: none;
	stroke: var(--wpj-sun);
	stroke-width: 8px;
	vector-effect: non-scaling-stroke;
	stroke-linecap: round;
	stroke-linejoin: round;
	opacity: 0.92;
	filter: blur(1.1px);
	transition: filter 0.9s ease;
}

.wpj-ridge-cliff path { stroke: var(--wpj-ember); }
.wpj-ridge-teide path { stroke: var(--wpj-on-dark); }
.wpj-ridge-anaga.wpj-ridge-on path { filter: blur(1.1px) drop-shadow(0 0 12px var(--wpj-sun-60)) drop-shadow(0 0 34px var(--wpj-sun-30)); }
.wpj-ridge-cliff.wpj-ridge-on path { filter: blur(1.1px) drop-shadow(0 0 10px var(--wpj-sky-60)) drop-shadow(0 0 28px var(--wpj-sky-30)); }
.wpj-ridge-teide.wpj-ridge-on path { filter: blur(1.1px) drop-shadow(0 0 12px var(--wpj-snow-60)) drop-shadow(0 0 34px var(--wpj-snow-30)); }

/* =========================================================== mission */

/* dark plate behind the copy, soft on every edge (desktop, where the copy sits on the mountains) */
@media (min-width: 1025px) {
	.wpj-fx .wpj-mission {
		opacity: 0;
		transition: opacity 1.1s ease;
	}

	.wpj-fx .wpj-mission.is-on {
		opacity: 1;
	}

	.wpj-fx .wpj-mission::before {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		top: -48px;
		bottom: -48px;
		z-index: 0;
		pointer-events: none;
		background-color: rgba(12, 16, 15, 0);
		transition: background-color 1.3s ease 1.1s;
		-webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 8%, #000 20%, #000 80%, rgba(0, 0, 0, 0.5) 92%, rgba(0, 0, 0, 0) 100%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.22) 12%, rgba(0, 0, 0, 0.6) 22%, #000 34%, #000 62%, rgba(0, 0, 0, 0.6) 78%, rgba(0, 0, 0, 0.22) 90%, rgba(0, 0, 0, 0) 100%);
		mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 8%, #000 20%, #000 80%, rgba(0, 0, 0, 0.5) 92%, rgba(0, 0, 0, 0) 100%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.22) 12%, rgba(0, 0, 0, 0.6) 22%, #000 34%, #000 62%, rgba(0, 0, 0, 0.6) 78%, rgba(0, 0, 0, 0.22) 90%, rgba(0, 0, 0, 0) 100%);
		-webkit-mask-composite: source-in;
		mask-composite: intersect;
	}

	.wpj-fx .wpj-mission.is-plate::before {
		background-color: var(--wpj-plate);
	}

	.wpj-fx .wpj-mission-col {
		position: relative;
		z-index: 1;
	}
}

/* lines slide up out of their own mask */
.wpj-fx .wpj-reveal {
	display: block;
	overflow: hidden;
}

.wpj-fx .wpj-reveal-line {
	display: block;
	transform: translateY(115%);
	transition: transform 0.76s cubic-bezier(0.16, 0.84, 0.24, 1);
}

.wpj-fx .wpj-reveal.is-on .wpj-reveal-line {
	transform: translateY(0);
}

/* "Our mission": letters roll over in 3D, blue face then sun face on hover */
html.wpj-fx .wpj-flip-title {
	background-image: none;
	-webkit-background-clip: border-box;
	background-clip: border-box;
	color: inherit;
}

.wpj-flip-mask {
	display: block;
	overflow: hidden;
	padding-top: 8px;
	mix-blend-mode: hard-light;
}

.wpj-flip-mask .wpj-flip-line {
	transform: translateY(118%);
	transition: transform 0.76s cubic-bezier(0.16, 0.84, 0.24, 1);
}

.wpj-flip-mask.is-on .wpj-flip-line {
	transform: translateY(0);
}

.wpj-flip-line {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	perspective: 900px;
	transform-style: preserve-3d;
	padding-bottom: 4px;
	cursor: pointer;
}

.wpj-flip-ch {
	position: relative;
	display: inline-block;
	height: 1em;
	line-height: 1em;
	transform-style: preserve-3d;
	transform: translateZ(-0.5em) rotateX(90deg);
	transition: transform 0.68s cubic-bezier(0.2, 0.86, 0.2, 1);
}

.wpj-flip-face {
	display: block;
	height: 1em;
	line-height: 1em;
	user-select: none;
	-webkit-user-select: none;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

.wpj-flip-face-a {
	background-image: linear-gradient(to bottom, var(--wpj-ocean-lt) 0%, var(--wpj-ember) 54%, var(--wpj-deep) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
	transform: translateZ(0.5em);
}

.wpj-flip-face-b {
	position: absolute;
	top: 0;
	left: 0;
	background-image: linear-gradient(to bottom, var(--wpj-sun-2) 0%, var(--wpj-sun) 54%, var(--wpj-sun-dk) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
	transform: rotateX(-90deg) translateZ(0.5em);
}

.wpj-flip-sp {
	display: inline-block;
	width: 0.5em;
}

.wpj-flip-line.is-on .wpj-flip-ch {
	transform: translateZ(-0.5em) rotateX(0deg);
}

@keyframes wpjFlipRound {
	0% { transform: translateZ(-0.5em) rotateX(0deg); }
	44% { transform: translateZ(-0.5em) rotateX(90deg); }
	100% { transform: translateZ(-0.5em) rotateX(0deg); }
}

.wpj-flip-line.is-on:hover .wpj-flip-ch {
	animation: wpjFlipRound 0.88s cubic-bezier(0.3, 0.7, 0.3, 1) both;
}

/* "Your tan will fade." dissolves letter by letter, "Your stories won't." takes its place */
html.wpj-fx .wpj-h2-swap {
	display: flex;
	flex-direction: column;
	padding: 0.22em 0;
	margin: -0.22em 0;
	overflow: hidden;
	/* cut top and bottom only: the last word grows past the end of a line that fills the box */
	overflow-x: visible;
	overflow-y: clip;
}

.wpj-swap-a,
.wpj-swap-b {
	line-height: 1.55;
}

.wpj-fx .wpj-swap-a {
	transition: transform 1.3s cubic-bezier(0.16, 0.84, 0.24, 1), opacity 0.8s ease;
}

.wpj-fx .wpj-swap-b {
	margin-top: -1.55em;
	opacity: 0;
	transition: transform 1.3s cubic-bezier(0.16, 0.84, 0.24, 1), opacity 0.9s ease;
}

.wpj-fx .wpj-reveal.is-on .wpj-swap-b { transform: translateY(160%); }
.wpj-fx .wpj-swap-done .wpj-swap-a { transform: translateY(-160%); opacity: 0; }
.wpj-fx .wpj-reveal.wpj-swap-done .wpj-swap-b { transform: translateY(0); opacity: 1; }

.wpj-fade-ch {
	display: inline-block;
	filter: blur(0);
	opacity: 1;
	transition: filter 1.1s ease, opacity 1.1s ease;
}

.wpj-fade-blur .wpj-fade-ch {
	filter: blur(calc(var(--bl) * 2.2));
	opacity: 0;
}

.wpj-swap-sp {
	display: inline-block;
	width: 0.28em;
}

.wpj-swap-pop {
	display: inline-block;
	margin-left: 4px;
	transform-origin: 0% 78%;
	transition: transform 1.15s cubic-bezier(0.2, 1.35, 0.3, 1);
}

.wpj-reveal.is-on .wpj-swap-a .wpj-swap-pop { transform: scale(1.18); transition-delay: 1.6s; }
.wpj-swap-done .wpj-swap-b .wpj-swap-pop { transform: scale(1.18); transition-delay: 1.4s; }

/* handwritten highlights inside the mission copy (Caveat is loaded by the Elementor font variable) */
.wpj-mark {
	font-family: var(--wpj-ff-hand), "Segoe Script", cursive;
	font-weight: 700;
	font-size: 1.38em;
	line-height: 0.8;
	letter-spacing: 0.01em;
	paint-order: stroke fill;
	-webkit-text-stroke: 1px currentColor;
}

.wpj-mark-sun { color: var(--wpj-sun); }
.wpj-mark-sky { color: var(--wpj-ocean-lt); }

/* tablet and phone: the copy sits in the blue section, fully shown, white text (as in the design) */
@media (max-width: 1024px) {
	html.wpj-fx .wpj-mission .wpj-reveal-line {
		transform: none;
	}

	.wpj-flip-face-a {
		background-image: none;
		color: #fff;
		-webkit-text-fill-color: #fff;
	}

	.wpj-mark-sky {
		color: #fff;
	}

	.wpj-ridge path {
		stroke-width: 5px;
		filter: blur(0.8px);
	}
}

@media (max-width: 767px) {
	.wpj-ridge path {
		stroke-width: 3px;
		filter: blur(0.5px);
	}

	.wpj-edge-haze {
		flex-basis: 52cqw;
		height: 52cqw;
		margin-top: -41cqw;
		margin-bottom: calc(0px - 52cqw - -41cqw);
	}
}

@media (min-width: 768px) and (max-width: 1024px) {
	.wpj-edge-haze {
		flex-basis: 48cqw;
		height: 48cqw;
		margin-top: -35cqw;
		margin-bottom: calc(0px - 48cqw - -35cqw);
	}
}

@media (max-width: 1024px) {
	.wpj-haze-cliff {
		display: none;
	}
}

/* =========================================================== blue section */

/* soft wave and glow where the blue section meets the clouds */
/* .wave-soft and .tint-glow: 108% wide, -4% in, measured from the top of the blue section
   (their own flow position is the end of the mountain section, --tint-drop above it) */
.wpj-section-tint::before,
.wpj-section-tint::after {
	content: "";
	position: absolute;
	left: -4%;
	width: 108%;
	z-index: -1;
	pointer-events: none;
}

.wpj-section-tint::before {
	top: calc(0px - 7.84cqw);          /* calc(--tint-drop - --slant) - --tint-drop */
	height: calc(7.84cqw * 4);         /* --slant * 4 */
	background-color: var(--wpj-tint-a);
	filter: blur(0.7cqw);
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%201200%20300'%20preserveAspectRatio%3D'none'%3E%3Cfilter%20id%3D'f'%20x%3D'-8%25'%20y%3D'-20%25'%20width%3D'116%25'%20height%3D'140%25'%3E%3CfeGaussianBlur%20stdDeviation%3D'5'%2F%3E%3C%2Ffilter%3E%3Cpath%20d%3D'M%200%2062%20L%2024%2059.92%20L%2048%2056.91%20L%2072%2053.29%20L%2096%2049.06%20L%20120%2043.88%20L%20144%2038.78%20L%20168%2034.82%20L%20192%2031.6%20L%20216%2029.19%20L%20240%2028%20L%20264%2028.26%20L%20288%2029.73%20L%20312%2032.08%20L%20336%2035.3%20L%20360%2039.75%20L%20384%2044.38%20L%20408%2048.16%20L%20432%2051.54%20L%20456%2054.34%20L%20480%2056%20L%20504%2056.3%20L%20528%2055.5%20L%20552%2053.76%20L%20576%2051.09%20L%20600%2047.31%20L%20624%2042.95%20L%20648%2038.49%20L%20672%2033.43%20L%20696%2028.31%20L%20720%2024%20L%20744%2020.63%20L%20768%2017.95%20L%20792%2016.28%20L%20816%2015.89%20L%20840%2016.69%20L%20864%2018.43%20L%20888%2020.94%20L%20912%2024.6%20L%20936%2028.89%20L%20960%2033%20L%20984%2036.93%20L%201008%2040.82%20L%201032%2044.13%20L%201056%2046.42%20L%201080%2047.94%20L%201104%2048.78%20L%201128%2048.97%20L%201152%2048.16%20L%201176%2046.9%20L%201200%2046%20L%201200%20300%20L%200%20300%20Z'%20fill%3D'%23fff'%20filter%3D'url(%23f)'%2F%3E%3C%2Fsvg%3E"), linear-gradient(to bottom, #000 0%, #000 42%, rgba(0, 0, 0, 0.55) 66%, rgba(0, 0, 0, 0.18) 85%, rgba(0, 0, 0, 0) 100%);
	mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%201200%20300'%20preserveAspectRatio%3D'none'%3E%3Cfilter%20id%3D'f'%20x%3D'-8%25'%20y%3D'-20%25'%20width%3D'116%25'%20height%3D'140%25'%3E%3CfeGaussianBlur%20stdDeviation%3D'5'%2F%3E%3C%2Ffilter%3E%3Cpath%20d%3D'M%200%2062%20L%2024%2059.92%20L%2048%2056.91%20L%2072%2053.29%20L%2096%2049.06%20L%20120%2043.88%20L%20144%2038.78%20L%20168%2034.82%20L%20192%2031.6%20L%20216%2029.19%20L%20240%2028%20L%20264%2028.26%20L%20288%2029.73%20L%20312%2032.08%20L%20336%2035.3%20L%20360%2039.75%20L%20384%2044.38%20L%20408%2048.16%20L%20432%2051.54%20L%20456%2054.34%20L%20480%2056%20L%20504%2056.3%20L%20528%2055.5%20L%20552%2053.76%20L%20576%2051.09%20L%20600%2047.31%20L%20624%2042.95%20L%20648%2038.49%20L%20672%2033.43%20L%20696%2028.31%20L%20720%2024%20L%20744%2020.63%20L%20768%2017.95%20L%20792%2016.28%20L%20816%2015.89%20L%20840%2016.69%20L%20864%2018.43%20L%20888%2020.94%20L%20912%2024.6%20L%20936%2028.89%20L%20960%2033%20L%20984%2036.93%20L%201008%2040.82%20L%201032%2044.13%20L%201056%2046.42%20L%201080%2047.94%20L%201104%2048.78%20L%201128%2048.97%20L%201152%2048.16%20L%201176%2046.9%20L%201200%2046%20L%201200%20300%20L%200%20300%20Z'%20fill%3D'%23fff'%20filter%3D'url(%23f)'%2F%3E%3C%2Fsvg%3E"), linear-gradient(to bottom, #000 0%, #000 42%, rgba(0, 0, 0, 0.55) 66%, rgba(0, 0, 0, 0.18) 85%, rgba(0, 0, 0, 0) 100%);
	-webkit-mask-size: 100% 100%, 100% 100%;
	mask-size: 100% 100%, 100% 100%;
	-webkit-mask-repeat: no-repeat, no-repeat;
	mask-repeat: no-repeat, no-repeat;
	-webkit-mask-composite: source-in;
	mask-composite: intersect;
}

.wpj-section-tint::after {
	top: calc(7.84cqw - 15cqw * 0.55);  /* calc(--tint-drop + --slant - --glow-h * 0.55) - --tint-drop */
	height: 15cqw;                      /* --glow-h */
	filter: blur(1.8cqw);
	background-image: linear-gradient(to bottom, var(--wpj-tint-0) 0%, var(--wpj-tint-15) 34%, var(--wpj-tint-45) 62%, var(--wpj-tint-80) 84%, var(--wpj-tint-a) 100%);
}

/* the running dot in the "Scroll" cue */
@keyframes wpjCueRun {
	0% { transform: translateY(-16px); }
	45%, 55% { transform: translateY(24px); }
	100% { transform: translateY(48px); }
}

.wpj-dt-cue-track {
	display: flex;
	justify-content: center;
	overflow: hidden;
}

.wpj-dt-cue-track::after {
	content: "";
	display: block;
	width: 2px;
	height: 16px;
	border-radius: 999px;
	background-color: var(--wpj-sun);
	animation: wpjCueRun 2.1s cubic-bezier(0.4, 0, 0.5, 1) infinite;
}

/* =========================================================== activity carousel */

/* The design's ring, 1:1: .carou-view > .carou-track > .carou-card > .carou-face + .carou-panel.
   The breakpoint sizes are the design's custom properties on the view; the script reads them
   (cqw resolved against the page container) and places every card from the centre of the view. */
html.wpj-fx .wpj-carou-view {
	--wpj-carou-panel: 32.68cqw;
	--wpj-carou-h-on: 21.33cqw;
	--wpj-carou-side: 6.81cqw;
	position: relative;
	display: flex;
	height: var(--wpj-carou-h-on);
	overflow: hidden;
	padding: 0;
	cursor: grab;
	touch-action: pan-y;
	user-select: none;
	-webkit-user-select: none;
}

/* Small desktops: the design's shares of the width make a card too small for its words,
   so the centre card has a floor there. From about 1600px up nothing changes. */
@media (min-width: 1025px) {
	html.wpj-fx .wpj-carou-view {
		--wpj-carou-panel: max(32.68cqw, 520px);
		--wpj-carou-h-on: max(21.33cqw, 340px);
	}
}

@media (max-width: 1024px) {
	html.wpj-fx .wpj-carou-view {
		--wpj-carou-panel: 480px;
		--wpj-carou-h-on: 47.96cqw;
		--wpj-carou-side: 88px;
	}
}

@media (max-width: 767px) {
	html.wpj-fx .wpj-carou-view {
		--wpj-carou-panel: 84.62cqw;
		--wpj-carou-h-on: 107.69cqw;
		--wpj-carou-side: 16.92cqw;
	}
}

html.wpj-fx .wpj-carou-view:active {
	cursor: grabbing;
}

/* .carou-track: spans the whole view */
html.wpj-fx .wpj-carou-view > .wpj-carou-track {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	display: flex;
	gap: 16px;
	align-items: center;
	padding: 0;
}

/* .carou-card: anchored at the centre of the view; translate3d(x - w/2, -h/2, 0) places it */
html.wpj-fx .wpj-carou-track > .wpj-carou-card {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 0;
	height: 0;
	flex: none;
	margin: 0;
	padding: 0;
	opacity: 0;
	box-sizing: border-box;
	overflow: hidden;
	contain: paint;
	background-color: var(--wpj-card-ivory);
	border-radius: 18px;
	will-change: transform;
}

/* .carou-face: the photo, all a card shows away from the centre */
html.wpj-fx .wpj-carou-card > .wpj-carou-face {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center;
	background-color: var(--wpj-basalt);
	border-radius: 10px;
}

/* .carou-panel: always the full panel size, pinned to the card's top-left and clipped by it */
html.wpj-fx .wpj-carou-card > .wpj-carou-panel {
	position: absolute;
	left: 0;
	top: 0;
	contain: paint;
	width: var(--wpj-carou-panel);
	height: var(--wpj-carou-h-on);
	display: flex;
	flex-direction: row;
	background-color: var(--wpj-card-ivory);
	box-sizing: border-box;
	padding: 8px;
	overflow: hidden;
}

html.wpj-fx .wpj-carou-panel > .wpj-carou-copy {
	flex: 1 1 0;
	min-width: 0;
	padding: clamp(18px, 2.18cqw, 60px) clamp(14px, 1.45cqw, 40px);
	transform: translateY(18px);
	transition: transform 0.5s cubic-bezier(0.2, 0.8, 0.24, 1);
	user-select: text;
	-webkit-user-select: text;
	cursor: auto;
}

html.wpj-fx .wpj-carou-panel > .wpj-carou-copy.is-in {
	transform: translateY(0);
}

html.wpj-fx .wpj-carou-panel > .wpj-carou-shot {
	flex: 0 0 42%;
	width: 42%;
	min-width: 0;
	max-width: none;
	height: 100%;
	object-fit: cover;
	border-radius: 10px;
}

@media (max-width: 767px) {
	html.wpj-fx .wpj-carou-card > .wpj-carou-face {
		display: none;
	}
}

.wpj-carou-bar {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 24px;
}

.wpj-carou-bar .wpj-carou-arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	padding: 0;
	font-size: 21px;
	line-height: 1;
	color: var(--wpj-on-dark);
	background: transparent;
	border: 1px solid var(--wpj-rail);
	border-radius: 999px;
	box-shadow: none;
	cursor: pointer;
}

.wpj-carou-bar .wpj-carou-arrow:hover,
.wpj-carou-bar .wpj-carou-arrow:focus-visible {
	color: var(--wpj-sun);
	background: transparent;
	border-color: var(--wpj-sun);
}

.wpj-carou-dots {
	display: flex;
	align-items: center;
	gap: 8px;
}

.wpj-carou-bar .wpj-carou-dot {
	width: 12px;
	height: 12px;
	min-height: 0;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: var(--wpj-rail);
	box-shadow: none;
	overflow: hidden;
	cursor: pointer;
	transition: width 0.32s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.wpj-carou-bar .wpj-carou-dot.is-on {
	width: 64px;
}

.wpj-carou-fill {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 999px;
	background: var(--wpj-sun);
	transform: scaleX(0);
	transform-origin: left center;
}

/* (the loading screen's CSS is inline in <head>, see functions.php) */

/* =========================================================== updated design (Home) */

/* Rope and climb rails (inserted by the script, desktop only): the design's .rope-host,
   .rope-rail and .climb-rail with the figures as masks over currentColor, so the ink can flip
   between cream and dark as they cross the blue, the clouds and the footer. */
.wpj-rope-host {
	position: relative;
	flex: 0 0 auto;
	align-self: stretch;
	height: 0;
	z-index: 8;
	pointer-events: none;
}

.wpj-rope-rail {
	position: absolute;
	left: clamp(16px, 3.4cqw, 76px);
	top: 0;
	height: 0;
	width: clamp(64px, 7cqw, 128px);
	pointer-events: none;
	color: rgba(244, 241, 234, 0.78);
	transition: color 0.45s ease;
}

.wpj-rope-rail.wpj-rope-ink {
	color: rgba(20, 18, 15, 0.72);
}

.wpj-rope-line {
	position: absolute;
	left: 50%;
	top: 0;
	width: 2px;
	height: 0;
	margin-left: -1px;
	background-color: currentColor;
	opacity: 0.42;
}

.wpj-rope-figure {
	position: absolute;
	left: -19%;
	top: 0;
	display: flex;
	width: 138%;
	transform: translateY(0);
	transform-origin: 50% 8%;
	opacity: 1;
	will-change: transform, opacity;
}

.wpj-rope-ico {
	display: block;
	width: 100%;
	aspect-ratio: 430 / 492;
	background-color: currentColor;
	-webkit-mask: url("canyoneer.png") no-repeat center / 100% 100%;
	mask: url("canyoneer.png") no-repeat center / 100% 100%;
}

.wpj-climb-rail {
	position: absolute;
	right: 0;
	top: 0;
	height: 0;
	width: clamp(70px, 7.4cqw, 138px);
	pointer-events: none;
	color: rgba(244, 241, 234, 0.95);
	transition: color 0.45s ease;
}

.wpj-climb-rail.wpj-climb-ink {
	color: rgba(20, 18, 15, 0.78);
}

.wpj-climb-ico {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	aspect-ratio: 380 / 747;
	opacity: 0;
	will-change: transform, opacity;
}

.wpj-climb-f {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: currentColor;
	opacity: 0;
}

.wpj-climb-f1 {
	-webkit-mask: url("climber-a.png") no-repeat center / 100% 100%;
	mask: url("climber-a.png") no-repeat center / 100% 100%;
}

.wpj-climb-f2 {
	-webkit-mask: url("climber-b.png") no-repeat center / 100% 100%;
	mask: url("climber-b.png") no-repeat center / 100% 100%;
}

.wpj-climb-f3 {
	-webkit-mask: url("climber-c.png") no-repeat center / 100% 100%;
	mask: url("climber-c.png") no-repeat center / 100% 100%;
}

@media (max-width: 1024px) {
	.wpj-rope-host {
		display: none;
	}
}



/* On phones WordPress's admin bar scrolls away with the page instead of staying fixed, so
   a bar pinned 46px down would leave a gap once the visitor scrolls; visitors never see an
   admin bar, the site owner does. */
@media (max-width: 600px) {
	body .wpj-site-header {
		top: 0; /* outranks the admin-bar offset set in the header section below */
	}
}

/* The carousel window on tablets: the side frames reach 3px past the content column, so
   the window stretches to the screen edges and shows them whole. The ring itself does not
   move - the cards stay centred where the design puts them. */
@media (min-width: 768px) and (max-width: 1024px) {
	html.wpj-fx .wpj-carou-view {
		margin-left: calc(0px - var(--wpj-pad-page-t, 32px));
		margin-right: calc(0px - var(--wpj-pad-page-t, 32px));
		width: auto;
	}
}



/* The activity label in the hero sits above the title behind a short sun rule, and the
   caption under the title hangs off a thin sun line, like a caption in a magazine. Both
   lines are drawn here; face, size, colour and spacing stay in the global classes. */
.wpj-hero-copy .wpj-hero-kicker {
	white-space: nowrap;
}

.wpj-hero-copy .wpj-hero-kicker::before {
	content: "";
	flex: 0 0 auto;
	width: clamp(28px, 4cqw, 64px);
	height: clamp(2px, 0.22cqw, 4px);
	background: var(--wpj-sun, #FFCC00);
}

.wpj-hero-copy .wpj-hero-lead {
	border-left: clamp(2px, 0.22cqw, 4px) solid var(--wpj-sun, #FFCC00);
}

/* The caption under the title has to hold on any frame of the clips: a close shadow
   under the letters only, nothing drawn behind the block. */
.wpj-hero-copy .wpj-hero-lead {
	text-shadow: 0 1px 2px rgba(20, 18, 15, 0.7), 0 0 18px rgba(20, 18, 15, 0.55);
}



/* The crater photo closing the blue section: it fades in from the top over the gradient and
   is cut at the bottom by the drawn wave, both straight from the design file. Elementor has
   no mask control, and the wave is a shape, not a photo, so both live here. */
.wpj-tint-foot {
	-webkit-mask-image: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,0.18) 9%,rgba(0,0,0,0.55) 18%,rgba(0,0,0,0.85) 27%,rgba(0,0,0,1) 38%,rgba(0,0,0,1) 100%);
	mask-image: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,0.18) 9%,rgba(0,0,0,0.55) 18%,rgba(0,0,0,0.85) 27%,rgba(0,0,0,1) 38%,rgba(0,0,0,1) 100%);
}

.wpj-tint-foot::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: clamp(48px, 5.6cqw, 120px);
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%201600%20160'%20preserveAspectRatio%3D'none'%3E%3Cpath%20d%3D'M%200%2071%20C%2033.4%2071%2C%2033.4%2072.7%2C%2066.7%2072.7%20C%20100.0%2072.7%2C%20100.0%2072.8%2C%20133.3%2072.8%20C%20166.7%2072.8%2C%20166.7%2071.5%2C%20200%2071.5%20C%20233.3%2071.5%2C%20233.3%2069.6%2C%20266.7%2069.6%20C%20300.0%2069.6%2C%20300.0%2067.5%2C%20333.3%2067.5%20C%20366.6%2067.5%2C%20366.6%2065.7%2C%20400%2065.7%20C%20433.4%2065.7%2C%20433.4%2064.4%2C%20466.7%2064.4%20C%20500.0%2064.4%2C%20500.0%2063.7%2C%20533.3%2063.7%20C%20566.6%2063.7%2C%20566.6%2063.1%2C%20600%2063.1%20C%20633.4%2063.1%2C%20633.4%2062.4%2C%20666.7%2062.4%20C%20700.0%2062.4%2C%20700.0%2061.1%2C%20733.3%2061.1%20C%20766.6%2061.1%2C%20766.6%2058.8%2C%20800%2058.8%20C%20833.4%2058.8%2C%20833.4%2055.5%2C%20866.7%2055.5%20C%20900.0%2055.5%2C%20900.0%2051.3%2C%20933.3%2051.3%20C%20966.6%2051.3%2C%20966.6%2046.8%2C%201000%2046.8%20C%201033.3%2046.8%2C%201033.3%2042.7%2C%201066.7%2042.7%20C%201100.0%2042.7%2C%201100.0%2039.6%2C%201133.3%2039.6%20C%201166.7%2039.6%2C%201166.7%2038.2%2C%201200%2038.2%20C%201233.3%2038.2%2C%201233.3%2038.9%2C%201266.7%2038.9%20C%201300.0%2038.9%2C%201300.0%2041.9%2C%201333.3%2041.9%20C%201366.7%2041.9%2C%201366.7%2046.7%2C%201400%2046.7%20C%201433.3%2046.7%2C%201433.3%2052.7%2C%201466.7%2052.7%20C%201500.0%2052.7%2C%201500.0%2059.2%2C%201533.3%2059.2%20C%201566.7%2059.2%2C%201566.7%2065.3%2C%201600%2065.3%20L%201600%20160%20L%200%20160%20Z'%20fill%3D'%23F7F8F7'%2F%3E%3C%2Fsvg%3E");
	background-size: 100% 100%;
	background-repeat: no-repeat;
	pointer-events: none;
}

/* The purpose strip is torn out of the page with the same two drawn ridges as the design;
   the outlines ship with this theme so they never go through the media library. */
.wpj-purpose::before,
.wpj-purpose::after {
	content: "";
	align-self: stretch;
	height: 9cqw;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	pointer-events: none;
}

.wpj-purpose::before {
	background-image: url("ridge-top.svg");
	margin-top: -9cqw;
}

.wpj-purpose::after {
	background-image: url("ridge-bottom.svg");
	margin-bottom: -8px;
}

/* Doodles and the island outline over the blue section (inserted by the script).
   The peaks hang off the first letter of ADVENTURE and the firs off its last one: wpj.js
   measures those letters into --wpj-a-* / --wpj-e-* and the letter height into --wpj-dt-h,
   and every offset and size below is a share of that height, so the drawings keep the same
   place on the word whatever the screen. The island outline hangs below the last letter,
   with the wave under it. Below 1200px there is no room: they go. */
.wpj-doodles {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	z-index: 8;
	pointer-events: none;
	color: rgba(244, 241, 234, 0.5);
}

.wpj-dood {
	position: absolute;
	display: block;
	height: auto;
}

/* below the bottom-left corner of the A: the ridge lies under the word, its right end
   just past the letter's left edge */
.wpj-dood-peaks {
	width: calc(var(--wpj-dt-h, 200px) * 0.75);
	left: calc(var(--wpj-a-left, 0px) - var(--wpj-dt-h, 200px) * 0.71);
	top: calc(var(--wpj-a-bottom, 0px) + var(--wpj-dt-h, 200px) * 0.06);
}

/* beside the top-right corner of the last E: the trees stand just right of the letter,
   their base a little below its top edge */
.wpj-dood-firs {
	width: calc(var(--wpj-dt-h, 200px) * 0.4);
	left: calc(var(--wpj-e-right, 0px) + var(--wpj-dt-h, 200px) * 0.08);
	top: calc(var(--wpj-e-top, 0px) + var(--wpj-dt-h, 200px) * 0.11);
	transform: translateY(-100%);
}

/* the island outline hangs below the last E, the wave under the outline; the design's 1440
   frame has the outline 2.05 letter-heights wide, 0.95 left of the E's right edge and 0.33
   below its bottom, and those shares hold at every width */
.wpj-map-group {
	position: absolute;
	left: calc(var(--wpj-e-right, 0px) - var(--wpj-dt-h, 200px) * 0.95);
	top: calc(var(--wpj-e-bottom, 0px) + var(--wpj-dt-h, 200px) * 0.33);
	width: calc(var(--wpj-dt-h, 200px) * 2.05);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	z-index: 0;
	pointer-events: none;
	color: rgba(244, 241, 234, 0.5);
}

.wpj-dt-map {
	display: block;
	width: 100%;
	height: auto;
	fill: rgba(244, 241, 234, 0.1);
	stroke: rgba(244, 241, 234, 0.3);
	stroke-width: 3.4;
	stroke-linejoin: round;
}

/* the wave sits under the outline, on its right half */
.wpj-map-group .wpj-dood-wave {
	position: static;
	width: 31%;
	margin: 6% 0 0 50%;
}

/* no room beside the text: the drawings leave rather than crowd it */
.wpj-decor-off .wpj-doodles,
.wpj-decor-off .wpj-map-group {
	display: none;
}

@media (max-width: 1199px) {
	.wpj-doodles,
	.wpj-map-group {
		display: none;
	}
}

/* The drawn icon in the first two "why us" cards (inserted by the script). */
.wpj-pcard-ico svg {
	display: block;
	max-width: 100%;
	max-height: 100%;
	height: auto;
}

/* The activity card copy always shows in full. The card is a fixed size, so when a name or
   a translated text needs more room the script lowers --wpj-fit and the copy scales with it. */
html body .wpj-page .wpj-carou-copy .wpj-carou-text {
	flex: 0 1 auto;
	min-height: 0;
	overflow: hidden;
	font-size: calc(clamp(13px, 0.91vw, 25px) * var(--wpj-fit, 1));
}

html body .wpj-page .wpj-carou-copy .wpj-carou-name {
	font-size: calc(clamp(21px, 2.09vw, 58px) * var(--wpj-fit, 1));
}

html body .wpj-page .wpj-carou-copy .wpj-btn-scroll {
	flex: 0 0 auto;
}

/* The Polish big word has ten letters to the English nine, so on tablet and phone, where the
   word runs edge to edge, its letters are a touch smaller and it keeps the same margins. */
@media (max-width: 1024px) {
	html[lang^="pl"] body .wpj-page .wpj-dt-line .wpj-dt-ch {
		font-size: 19cqw;
	}
}

@media (max-width: 767px) {
	html[lang^="pl"] body .wpj-page .wpj-dt-line .wpj-dt-ch {
		font-size: 18cqw;
	}
}

/* The "Book now" pair on the activity cards, as in the design: on hover the label swells a
   touch and the arrow in the round chip turns right round. */
.wpj-btn-scroll .wpj-btn-pill,
.wpj-btn-scroll .wpj-btn-chip {
	transition: transform 0.42s cubic-bezier(0.3, 0.86, 0.28, 1);
	transform-origin: 50% 50%;
	will-change: transform;
}

.wpj-btn-scroll:hover .wpj-btn-pill,
.wpj-btn-scroll:focus-visible .wpj-btn-pill {
	transform: scale(1.05);
}

.wpj-btn-scroll:hover .wpj-btn-chip,
.wpj-btn-scroll:focus-visible .wpj-btn-chip {
	transform: rotate(180deg);
}

@media (prefers-reduced-motion: reduce) {
	.wpj-btn-scroll .wpj-btn-pill,
	.wpj-btn-scroll .wpj-btn-chip {
		transition: none;
	}
}

/* =========================================================== services page */

/* the short sun rule in front of a label, the sun line beside the hero caption */
.wpj-svc-kicker::before,
.wpj-svc-kicker-dark::before {
	content: "";
	flex: 0 0 auto;
	width: clamp(28px, 4cqw, 56px);
	height: 3px;
	background: currentColor;
}

.wpj-svc-hero .wpj-svc-kicker {
	text-shadow: 0 1px 2px rgba(20, 18, 15, 0.9), 0 0 16px rgba(20, 18, 15, 0.65);
}

.wpj-svc-hero .wpj-svc-kicker::before {
	box-shadow: 0 1px 3px rgba(20, 18, 15, 0.7);
}

.wpj-svc-hero .wpj-svc-lead {
	border-left: 3px solid var(--wpj-sun, #FFCC00);
	text-shadow: 0 1px 2px rgba(20, 18, 15, 0.7);
}

/* the white card of four promises that hangs off the foot of the hero photo; each promise
   has a drawn icon (a mask, so it takes the ocean colour) */
.wpj-svc-trust-item + .wpj-svc-trust-item {
	border-left: 1px solid rgba(20, 18, 15, 0.14);
}

/* Elementor uses a flexbox's ::before as an absolute background layer: put it back in the row */
body .wpj-page .wpj-svc-trust-item::before {
	content: "";
	position: relative;
	inset: auto;
	display: block;
	flex: 0 0 38px;
	width: 38px;
	height: 38px;
	opacity: 1;
	background: var(--wpj-ocean, #0768A0);
	-webkit-mask: var(--wpj-ico) center / contain no-repeat;
	mask: var(--wpj-ico) center / contain no-repeat;
}

.wpj-svc-trust-item:nth-child(1) { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M20 4l13 5v9c0 9-6 15-13 18-7-3-13-9-13-18V9z%22/%3E%3Cpath d=%22M14 20l4.5 4.5L27 16%22/%3E%3C/svg%3E"); }
.wpj-svc-trust-item:nth-child(2) { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M8 22a12 12 0 0124 0v4H8z%22/%3E%3Cpath d=%22M6 26h28M20 10V6%22/%3E%3C/svg%3E"); }
.wpj-svc-trust-item:nth-child(3) { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M6 8h20v15H15l-6 5v-5H6z%22/%3E%3Cpath d=%22M30 15h4v14h-3v4l-5-4h-8%22/%3E%3C/svg%3E"); }
.wpj-svc-trust-item:nth-child(4) { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2220%22 cy=%2221%22 r=%2213%22/%3E%3Cpath d=%22M20 13v8l5 4M15 4h10%22/%3E%3C/svg%3E"); }

@media (max-width: 767px) {
	.wpj-svc-trust-item + .wpj-svc-trust-item {
		border-left: 0;
		border-top: 1px solid rgba(20, 18, 15, 0.14);
	}
}

/* Tablets: the four promises and the four booking steps would wrap three and one; two by two
   reads better. The promises then need their dividers redrawn for two rows. */
@media (min-width: 600px) and (max-width: 1024px) {
	body .wpj-page .wpj-svc-trust,
	body .wpj-page .wpj-svc-steps {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body .wpj-page .wpj-svc-trust .wpj-svc-trust-item:nth-child(2) {
		border-top: 0;
		border-left: 1px solid rgba(20, 18, 15, 0.14);
	}

	body .wpj-page .wpj-svc-trust .wpj-svc-trust-item:nth-child(3) {
		border-left: 0;
		border-top: 1px solid rgba(20, 18, 15, 0.14);
	}

	body .wpj-page .wpj-svc-trust .wpj-svc-trust-item:nth-child(4) {
		border-left: 1px solid rgba(20, 18, 15, 0.14);
		border-top: 1px solid rgba(20, 18, 15, 0.14);
	}
}

/* the catalogue is a grid that fills itself: Elementor's flex row is the fallback */
.wpj-svc-grid {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 270px), 1fr));
}

.wpj-svc-grid .wpj-svc-card {
	aspect-ratio: 3 / 4.2;
	min-height: 0;
	isolation: isolate;
}

.wpj-svc-card[hidden],
.wpj-svc-filter[hidden] {
	display: none !important;
}

.wpj-svc-card .wpj-svc-card-img,
.wpj-svc-card .wpj-svc-card-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease;
}

.wpj-svc-card:hover .wpj-svc-card-img img {
	transform: scale(1.05);
}

.wpj-svc-card::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 30%;
	z-index: 1;
	background: linear-gradient(180deg, rgba(23, 27, 26, 0.55), rgba(23, 27, 26, 0));
	pointer-events: none;
}

/* the row of category and level spans the card between its 16px gutters */
body .wpj-page .wpj-svc-card-top {
	left: 16px;
	right: 16px;
	width: auto;
}

.wpj-svc-card-top p {
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
}

/* The name is sized off its own card, so a long single word (BARRANQUISMO) always fits the
   narrowest card; the level label never breaks, the category line gives way instead. */
.wpj-svc-grid .wpj-svc-card {
	container-type: inline-size;
}

body .wpj-page .wpj-svc-card .wpj-svc-name {
	font-size: min(46px, 14.4cqw);
}

.wpj-svc-card-top .wpj-svc-level {
	flex: 0 0 auto;
	white-space: nowrap;
}

/* Spanish and Polish capitals carry accents above the letter (A with acute, N with acute):
   the poster's tight leading would push them into the line above, so those languages get
   room for them. English keeps the tight setting. */
html:not([lang^="en"]) body .wpj-page .wpj-svc-name {
	line-height: 1.1;
}

.wpj-svc-card .wpj-svc-ex {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}

.wpj-svc-foot {
	border-top: 1px solid rgba(244, 241, 234, 0.16);
}

/* level gauge: three rising bars, the lit ones are the level (drawn by the script) */
.wpj-svc-level {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 5px;
}

.wpj-svc-gauge {
	display: flex;
	flex-direction: column-reverse;
	align-items: flex-end;
	gap: 3px;
}

.wpj-svc-gauge i {
	display: block;
	height: 6px;
	border-radius: 2px;
	background: rgba(244, 241, 234, 0.35);
}

.wpj-svc-gauge i:nth-child(1) { width: 16px; }
.wpj-svc-gauge i:nth-child(2) { width: 26px; }
.wpj-svc-gauge i:nth-child(3) { width: 36px; }
.wpj-svc-gauge i.is-on { background: var(--wpj-sun, #FFCC00); }

.wpj-svc-legend-item {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.wpj-svc-legend-item .wpj-svc-gauge {
	flex-direction: row;
	align-items: flex-end;
	gap: 2px;
}

.wpj-svc-legend-item .wpj-svc-gauge i {
	width: 5px;
	background: rgba(20, 18, 15, 0.2);
}

.wpj-svc-legend-item .wpj-svc-gauge i:nth-child(1) { height: 6px; }
.wpj-svc-legend-item .wpj-svc-gauge i:nth-child(2) { height: 10px; }
.wpj-svc-legend-item .wpj-svc-gauge i:nth-child(3) { height: 14px; }
.wpj-svc-legend-item .wpj-svc-gauge i.is-on { background: var(--wpj-ocean, #0768A0); }

.wpj-svc-filter {
	cursor: pointer;
	user-select: none;
	-webkit-user-select: none;
	transition: background-color 0.2s, color 0.2s, border-color 0.2s;
}

.wpj-svc-filter small {
	margin-left: 6px;
	font-weight: 500;
	opacity: 0.65;
}

body .wpj-page .wpj-svc-filter[aria-pressed="true"] {
	background-color: var(--wpj-ink, #14120F);
	border-color: var(--wpj-ink, #14120F);
	color: var(--wpj-paper, #F4F1EA);
}

.wpj-svc-filter:focus-visible {
	outline: 3px solid var(--wpj-ocean-lt, #5FB4E6);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.wpj-svc-card .wpj-svc-card-img img { transition: none; }
}

/* =========================================================== about page (the letter) */

/* Snapshots lie a little askew beside the letter, each held by a strip of sun tape. Elementor
   uses a flexbox's ::before as a background layer, so the tape states its whole geometry. */
.wpj-abt-snap {
	transform: rotate(-3deg);
}

.wpj-abt-snap:nth-child(even) {
	transform: rotate(2.5deg);
}

.wpj-abt-snaps:last-child .wpj-abt-snap {
	transform: rotate(3deg);
}

.wpj-abt-snaps:last-child .wpj-abt-snap:nth-child(even) {
	transform: rotate(-2deg);
}

body .wpj-page .wpj-abt-snap::before {
	content: "";
	position: absolute;
	inset: -10px auto auto 50%;
	display: block;
	width: 80px;
	height: 22px;
	opacity: 1;
	transform: translateX(-50%) rotate(-3deg);
	background: rgba(255, 204, 0, 0.75);
	z-index: 2;
}

.wpj-abt-snap .wpj-abt-snap-img,
.wpj-abt-snap .wpj-abt-snap-img img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

/* the P.S. is separated from the letter by a dashed fold line */
.wpj-abt-ps {
	border-top: 1px dashed rgba(20, 18, 15, 0.3);
}

/* the ridges above the footer stand on the desk colour here */
html body:has(.wpj-abt-end) div.wpj-foot-ridge {
	background-color: #E9E4D8;
}

@media (max-width: 767px) {
	.wpj-abt-snap,
	.wpj-abt-snap:nth-child(even),
	.wpj-abt-snaps:last-child .wpj-abt-snap,
	.wpj-abt-snaps:last-child .wpj-abt-snap:nth-child(even) {
		transform: rotate(-1.5deg);
	}
}

/* =========================================================== activity page (layout 3E) */

/* the big values beside the title: two by two. Elementor gives every flexbox width:100%,
   which would push the values under the title, so both halves take their own width here. */
body .wpj-page .wpj-act-head > .wpj-act-head-main {
	width: auto;
	flex: 1 1 auto;
}

body .wpj-page .wpj-act-head > .wpj-act-vals {
	display: grid;
	grid-template-columns: repeat(2, auto);
	gap: 14px 36px;
	width: auto;
	flex: 0 0 auto;
}

@media (max-width: 767px) {
	body .wpj-page .wpj-act-head > .wpj-act-vals {
		width: 100%;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 14px 20px;
	}
}

html:not([lang^="en"]) body .wpj-page .wpj-act-title {
	line-height: 1.04;
}

/* three zones: the photo and the booking rail stay while the field guide scrolls */
@media (min-width: 1025px) {
	.wpj-act-rail {
		display: grid !important;
		grid-template-columns: minmax(0, 3.2fr) minmax(0, 5fr) minmax(340px, 3fr);
		align-items: start;
	}

	.wpj-act-rail > .wpj-act-pic,
	.wpj-act-rail > .wpj-act-side {
		position: sticky;
		top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--wpj-head-h, 84px));
	}

	/* the photo is a framed picture, not a bleed: it keeps the page gutter on its left and
	   the same air above and below as the text beside it */
	body .wpj-page .wpj-act-rail > .wpj-act-pic {
		position: sticky;   /* Elementor's own rule for the box says relative */
		top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--wpj-head-h, 84px) + 24px);
		margin: clamp(24px, 3.6cqw, 56px) 0 24px 64px;
		width: auto;
		border-radius: 20px;
	}

	/* no scrollbar of its own: when the column is taller than the screen, wpj.js moves its
	   sticky top so it scrolls with the page and stops at the foot (or the top) of the screen */
	.wpj-act-rail > .wpj-act-side {
		padding-bottom: 16px;
	}
}

/* tablet and phone: the picture sits inside the page gutters with rounded corners */
@media (max-width: 1024px) {
	body .wpj-page .wpj-act-rail > .wpj-act-pic {
		margin: 0 32px;
		width: auto;
		border-radius: 18px;
	}
}

@media (max-width: 767px) {
	body .wpj-page .wpj-act-rail > .wpj-act-pic {
		margin: 0 20px;
		width: auto;
		border-radius: 16px;
	}
}

/* The frame takes the shape of the photo, so the picture is shown whole at any screen size
   (portrait, square or tall phone shots alike). Only a photo taller than the screen is
   trimmed, to keep the frame in view while the text scrolls. */
body .wpj-page .wpj-act-rail > .wpj-act-pic {
	height: auto;
	min-height: 0;
	max-height: none;
	padding: 0;
	align-self: start;
}

body .wpj-page .wpj-act-pic .wpj-act-photo {
	position: relative;
	inset: auto;
	display: block;
	width: 100%;
	height: auto;
}

body .wpj-page .wpj-act-pic img.wpj-act-photo,
body .wpj-page .wpj-act-pic .wpj-act-photo img {
	display: block;
	width: 100%;
	height: auto;
	max-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px) - var(--wpj-head-h, 84px) - 48px);
	object-fit: cover;
}


@media (max-width: 1024px) {
	body .wpj-page .wpj-act-pic img.wpj-act-photo,
body .wpj-page .wpj-act-pic .wpj-act-photo img {
		max-height: none;
	}
}

body .wpj-page .wpj-act-pic::before {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 22%;
	z-index: 1;
	opacity: 1;
	background: linear-gradient(180deg, rgba(23, 27, 26, 0), rgba(23, 27, 26, 0.55));
	pointer-events: none;
}

/* photo slideshow: the extra photos wait hidden (also without the script), the script shows
   one at a time; the frame always takes the shape of the photo on show */
.wpj-act-pic .wpj-act-thumbs {
	display: none !important;
}

.wpj-gal-slide[hidden] {
	display: none !important;
}

.wpj-gal-slide:not([hidden]) {
	animation: wpjGalIn 0.6s ease both;
}

@keyframes wpjGalIn {
	from { opacity: 0; }
	to { opacity: 1; }
}

/* arrows on the two sides of the photo, half way up; the counter sits at the foot */
.wpj-gal-nav {
	position: absolute;
	inset: 0;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 12px;
	pointer-events: none;
}

.wpj-gal-nav .wpj-gal-count {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 14px;
}

.wpj-gal-nav button {
	pointer-events: auto;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0 0 3px;
	border: 1.5px solid rgba(244, 241, 234, 0.55);
	border-radius: 50%;
	background: rgba(23, 27, 26, 0.55);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	color: #F4F1EA;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
	transition: background-color 0.2s, color 0.2s, border-color 0.2s;
}

.wpj-gal-nav button:hover,
.wpj-gal-nav button:focus-visible {
	background: var(--wpj-sun, #FFCC00);
	border-color: var(--wpj-sun, #FFCC00);
	color: var(--wpj-ink, #14120F);
	outline: none;
}

.wpj-gal-count {
	min-width: 3.6em;
	text-align: center;
	font-family: var(--wpj-ff-body, Karla), sans-serif;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.14em;
	color: #F4F1EA;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7);
	font-variant-numeric: tabular-nums;
}

@media (prefers-reduced-motion: reduce) {
	.wpj-gal-slide:not([hidden]) { animation: none; }
}

/* level: three peaks, as many filled as the level (drawn by the script) */
.wpj-act-peaks {
	flex: 0 0 auto;
	width: 120px;
	height: 54px;
}

.wpj-act-peaks polygon {
	fill: none;
	stroke: rgba(244, 241, 234, 0.45);
	stroke-width: 2;
	stroke-linejoin: round;
}

.wpj-act-peaks polygon.is-on {
	fill: var(--wpj-sun, #FFCC00);
	stroke: var(--wpj-sun, #FFCC00);
}

.wpj-act-blk {
	border-top: 1px solid rgba(244, 241, 234, 0.16);
}

/* the plan of the day: no rail, just a sun dot in front of every step */
body .wpj-page .wpj-act-tl {
	border-left: 0;
	margin-left: 0;
	padding-left: 0;
	gap: 6px;
}

body .wpj-page .wpj-act-tl-item::before {
	content: "";
	position: absolute;
	inset: 8px auto auto 0;
	display: block;
	width: 12px;
	height: 12px;
	opacity: 1;
	border-radius: 50%;
	background: var(--wpj-sun, #FFCC00);
	border: 0;
}

.wpj-act-li {
	border-bottom: 1px solid rgba(244, 241, 234, 0.16);
}

.wpj-act-li::before {
	content: "\2713";
	position: absolute;
	left: 0;
	color: var(--wpj-sun, #FFCC00);
	font-weight: 700;
}

.wpj-act-col + .wpj-act-col .wpj-act-li::before {
	content: "\2192";
}

/* questions fold (the script adds the behaviour; without it they all stay open) */
.wpj-act-faq-q[role="button"] {
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	gap: 16px;
}

.wpj-act-faq-q[role="button"]::after {
	content: "+";
	font-size: 22px;
	line-height: 1;
	color: var(--wpj-sun, #FFCC00);
}

.wpj-act-faq-q[aria-expanded="true"]::after {
	content: "\2212";
}

.wpj-act-faq-a[hidden] {
	display: none !important;
}

/* ---- the booking ticket, three steps on paper ---- */
.wpj-act-data {
	display: none;
}

.wpj-tk-on > .wpj-tk-src {
	display: none !important;
}

.wpj-tk {
	display: flex;
	flex-direction: column;
	color: var(--wpj-ink, #14120F);
	font-family: var(--wpj-ff-body, Karla), "Helvetica Neue", sans-serif;
}

.wpj-tk-top {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
	padding-bottom: 6px;
}

.wpj-tk-st {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 14px 0;
	border-top: 1px dashed rgba(20, 18, 15, 0.28);
}

.wpj-tk-st.is-wait {
	opacity: 0.45;
}

.wpj-tk-h {
	margin: 0;
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: var(--wpj-ff-hand, Caveat), "Segoe Script", cursive;
	font-weight: 700;
	font-size: 28px;
	line-height: 1;
	color: var(--wpj-ocean, #0768A0);
}

.wpj-tk-h i {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border: 2px solid var(--wpj-ink, #14120F);
	border-radius: 50%;
	font-style: normal;
	font-family: var(--wpj-ff-display, Anton), Impact, sans-serif;
	font-weight: 400;
	font-size: 16px;
	color: var(--wpj-ink, #14120F);
}

.wpj-tk-st.is-done .wpj-tk-h {
	color: var(--wpj-ink-2, #4A4F4C);
}

.wpj-tk-st.is-done .wpj-tk-h i {
	background: var(--wpj-sun, #FFCC00);
	border-color: var(--wpj-sun, #FFCC00);
}

.wpj-tk-val {
	margin: 0;
	display: flex;
	justify-content: space-between;
	gap: 8px;
	font-weight: 700;
	font-size: 15px;
}

.wpj-tk button {
	font: inherit;
	cursor: pointer;
	color: var(--wpj-ink, #14120F);
}

.wpj-tk-val button {
	border: 0;
	padding: 0;
	background: none;
	color: var(--wpj-ocean, #0768A0);
	font-weight: 700;
	font-size: 13px;
	text-decoration: underline;
}

.wpj-cal {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 10px;
	border: 1px solid rgba(20, 18, 15, 0.14);
	border-radius: 12px;
	background: #fff;
}

.wpj-cal-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 6px;
}

.wpj-cal-top b {
	font-family: var(--wpj-ff-head, Archivo), sans-serif;
	font-size: 15px;
	text-transform: capitalize;
}

.wpj-cal-top button,
.wpj-tk-ppl button {
	width: 32px;
	height: 32px;
	padding: 0;
	border: 1.5px solid rgba(20, 18, 15, 0.14);
	border-radius: 50%;
	background: #fff;
	font-size: 17px;
	line-height: 1;
}

.wpj-cal-top button:disabled {
	opacity: 0.3;
	cursor: default;
}

.wpj-cal-grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 2px;
	font-variant-numeric: tabular-nums;
}

.wpj-cal-grid span {
	padding: 2px 0;
	text-align: center;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wpj-ink-2, #4A4F4C);
}

.wpj-cal-grid button {
	aspect-ratio: 1 / 1;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	font-size: 13px;
	font-weight: 600;
}

.wpj-cal-grid button:hover:not(:disabled) {
	background: #E9E4D8;
}

.wpj-cal-grid button:disabled {
	color: rgba(20, 18, 15, 0.25);
	cursor: default;
	text-decoration: line-through;
}

.wpj-cal-grid button[aria-pressed="true"] {
	background: var(--wpj-ink, #14120F);
	color: var(--wpj-sun, #FFCC00);
}

.wpj-cal-note {
	margin: 0;
	font-size: 11.5px;
	color: var(--wpj-ink-2, #4A4F4C);
}

.wpj-tk-ppl {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 8px 10px;
	border: 1px solid rgba(20, 18, 15, 0.14);
	border-radius: 12px;
	background: #fff;
}

.wpj-tk-ppl span {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.wpj-tk-ppl div {
	display: flex;
	align-items: center;
	gap: 10px;
}

.wpj-tk-ppl b {
	min-width: 1.2em;
	text-align: center;
	font-family: var(--wpj-ff-head, Archivo), sans-serif;
	font-size: 18px;
}

/* options (a level, a kind of dive): one row each, the picked one in ink and sun like the day */
.wpj-tk-opts {
	display: grid;
	gap: 6px;
}

.wpj-tk-opts > span {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.wpj-tk-opts button {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	padding: 10px 12px;
	border: 1.5px solid rgba(20, 18, 15, 0.14);
	border-radius: 12px;
	background: #fff;
	color: var(--wpj-ink, #14120F);
	text-align: left;
	font-size: 14px;
	line-height: 1.3;
}

.wpj-tk-opts button:hover {
	border-color: rgba(20, 18, 15, 0.4);
}

.wpj-tk-opts button b {
	font-weight: 600;
}

.wpj-tk-opts button i {
	flex: none;
	font-style: normal;
	font-weight: 700;
	font-family: var(--wpj-ff-head, Archivo), sans-serif;
}

.wpj-tk-opts button[aria-checked="true"] {
	border-color: var(--wpj-ink, #14120F);
	background: var(--wpj-ink, #14120F);
	color: #fff;
}

.wpj-tk-opts button[aria-checked="true"] i {
	color: var(--wpj-sun, #FFCC00);
}

.wpj-tk .wpj-tk-next,
.wpj-tk-send {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 24px;
	border: 0;
	border-radius: 999px;
	font-weight: 700;
	font-size: 14.5px;
	text-decoration: none;
}

.wpj-tk .wpj-tk-next {
	background: var(--wpj-ink, #14120F);
	color: var(--wpj-paper, #F7F8F7);
}

.wpj-tk-send,
.wpj-tk-send:hover,
.wpj-tk-send:focus {
	background: #1FA855;
	color: #fff;
}

.wpj-tk-msg {
	padding: 10px 12px;
	border-radius: 10px;
	background: #F4F1EA;
	font-size: 12.5px;
	line-height: 1.45;
	white-space: pre-line;
}

.wpj-tk-msg i {
	display: block;
	margin-bottom: 4px;
	font-style: normal;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	opacity: 0.65;
}

.wpj-tk small {
	font-size: 12.5px;
	line-height: 1.4;
	color: var(--wpj-ink-2, #4A4F4C);
}

/* the price bar at the foot of the screen, phone and tablet only */
.wpj-tk-bar {
	display: none;
}

@media (max-width: 1024px) {
	.wpj-tk-bar {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 40;
		display: flex;
		align-items: center;
		gap: 14px;
		/* room on the right for the site's back-to-top button */
		padding: 10px 76px calc(10px + env(safe-area-inset-bottom, 0px)) 16px;
		background: var(--wpj-basalt, #171B1A);
		border-top: 3px solid var(--wpj-sun, #FFCC00);
		color: var(--wpj-on-dark, #F4F1EA);
		font-family: var(--wpj-ff-head, Archivo), sans-serif;
		font-weight: 700;
		font-size: 15px;
		transition: transform 0.3s ease;
	}

	/* "from, per person" small above the price, so the price never breaks */
	.wpj-tk-bar-price {
		display: flex;
		flex-direction: column;
		min-width: 0;
		line-height: 1.1;
	}

	.wpj-tk-bar-price small {
		font-family: var(--wpj-ff-body, Karla), sans-serif;
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.12em;
		text-transform: uppercase;
		color: var(--wpj-on-dark-2, #B9C0BC);
		white-space: nowrap;
	}

	.wpj-tk-bar-price b {
		font-size: 21px;
		white-space: nowrap;
	}

	.wpj-tk-bar.is-away {
		transform: translateY(110%);
	}

	.wpj-tk-bar button {
		flex: 0 0 auto;
		padding: 11px 20px;
		border: 0;
		border-radius: 999px;
		background: var(--wpj-sun, #FFCC00);
		color: var(--wpj-ink, #14120F);
		font: inherit;
		cursor: pointer;
	}

	/* the scroll to the ticket lands under the sticky header, not behind it */
	.wpj-act-ticket {
		scroll-margin-top: calc(var(--wpj-head-h, 84px) + 16px);
	}
}

.wpj-tk button:focus-visible,
.wpj-tk-send:focus-visible,
.wpj-act-faq-q:focus-visible {
	outline: 3px solid var(--wpj-ocean-lt, #5FB4E6);
	outline-offset: 2px;
}

/* =========================================================== contact page (the postcard) */

/* the dashed line down the middle of the postcard, the stamp in its corner, ruled lines
   under the handwritten address */
body .wpj-page .wpj-ct-left {
	border-right: 2px dashed rgba(20, 18, 15, 0.32);
	padding-right: clamp(20px, 3cqw, 44px);
}

body .wpj-page .wpj-ct-right > .wpj-ct-stamp,
body .wpj-page .wpj-ct-right > img.wpj-ct-stamp {
	align-self: flex-end;
	width: 96px;
	height: 112px;
	padding: 6px;
	background: #fff;
	border: 2px dashed rgba(20, 18, 15, 0.4);
	transform: rotate(4deg);
	object-fit: cover;
}

/* buttons keep their own width inside the paper pages (Elementor stretches them) */
body .wpj-page .wpj-ct-left .wpj-abt-btn-wa,
body .wpj-page .wpj-abt-btns > * {
	align-self: flex-start;
	width: auto;
}

.wpj-ct-line {
	border-bottom: 1.5px solid rgba(20, 18, 15, 0.35);
	text-decoration: none;
}

a.wpj-ct-line:hover .wpj-ct-line-v {
	color: var(--wpj-ocean, #0768A0);
}

@media (max-width: 1024px) {
	body .wpj-page .wpj-ct-left {
		border-right: 0;
		padding-right: 0;
		border-bottom: 2px dashed rgba(20, 18, 15, 0.32);
		padding-bottom: 24px;
	}
}

/* the form under the postcard: same desk, paper fields */
.wpj-ct-form {
	background: #E9E4D8;
	padding: 0 clamp(20px, 4.4vw, 64px) clamp(44px, 6vw, 96px);
	color: var(--wpj-ink, #14120F);
	font-family: var(--wpj-ff-body, Karla), "Helvetica Neue", sans-serif;
}

.wpj-ct-form-in {
	max-width: 1080px;
	margin: 0 auto;
}

.wpj-ct-form-h {
	margin: 0 0 16px;
	font-family: var(--wpj-ff-hand, Caveat), "Segoe Script", cursive;
	font-weight: 700;
	font-size: clamp(34px, 3.6vw, 48px);
	line-height: 1;
	color: var(--wpj-ocean, #0768A0);
}

.wpj-ct-form .srfm-form-container,
.wpj-ct-form .srfm-form {
	background: transparent !important;
	padding: 0 !important;
	max-width: none !important;
}

.wpj-ct-form .srfm-block-label {
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wpj-ink-2, #4A4F4C) !important;
}

.wpj-ct-form input.srfm-input-common,
.wpj-ct-form textarea.srfm-input-common,
.wpj-ct-form .srfm-input-content input,
.wpj-ct-form .srfm-input-content textarea {
	background: #FFFDF7 !important;
	border: 1.5px solid rgba(20, 18, 15, 0.3) !important;
	border-radius: 4px !important;
	font-size: 16px !important;
	color: var(--wpj-ink, #14120F) !important;
	box-shadow: none !important;
}

.wpj-ct-form .srfm-submit-button,
.wpj-ct-form button.srfm-button {
	background: var(--wpj-ink, #14120F) !important;
	color: var(--wpj-paper, #F7F8F7) !important;
	border: 0 !important;
	border-radius: 999px !important;
	padding: 12px 24px !important;
	font-weight: 700 !important;
	font-size: 14.5px !important;
}

html body:has(.wpj-ct-form) div.wpj-foot-ridge,
html body:has(.wpj-ct-desk) div.wpj-foot-ridge {
	background-color: #E9E4D8;
}

/* =========================================================== information pages (the checklist sheet) */

/* every point has a drawn icon in a slightly tilted frame; the icon is a mask, picked by the
   point's marker class (wpj-ico-<name>), so it takes the ocean colour */
.wpj-inf-item {
	border-top: 1px dashed rgba(20, 18, 15, 0.28);
}

body .wpj-page .wpj-inf-item::before,
body .wpj-page .wpj-inf-item::after {
	content: "";
	position: absolute;
	inset: 20px auto auto 0;
	display: block;
	width: 42px;
	height: 42px;
	opacity: 1;
}

body .wpj-page .wpj-inf-item::before {
	border: 2px solid var(--wpj-ink, #14120F);
	border-radius: 9px;
	background: #fff;
	transform: rotate(-4deg);
}

body .wpj-page .wpj-inf-item::after {
	background: var(--wpj-ocean, #0768A0);
	-webkit-mask: var(--wpj-ico) center / 26px 26px no-repeat;
	mask: var(--wpj-ico) center / 26px 26px no-repeat;
}

body .wpj-page .wpj-inf-item:nth-of-type(even)::before {
	transform: rotate(3deg);
}

.wpj-ico-calendar { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%226%22 y=%229%22 width=%2228%22 height=%2225%22 rx=%223%22/%3E%3Cpath d=%22M6 17h28M13 5v8M27 5v8M14 25l4 4 8-8%22/%3E%3C/svg%3E"); }
.wpj-ico-wallet { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M6 12h25a3 3 0 013 3v16a3 3 0 01-3 3H9a3 3 0 01-3-3z%22/%3E%3Cpath d=%22M6 12l20-6v6M27 23h7%22/%3E%3C/svg%3E"); }
.wpj-ico-cloud { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 28a7 7 0 010-14 9 9 0 0117-2 7 7 0 011 16z%22/%3E%3Cpath d=%22M14 33l-2 3M21 33l-2 3M28 33l-2 3%22/%3E%3C/svg%3E"); }
.wpj-ico-undo { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 10l-7 7 7 7%22/%3E%3Cpath d=%22M5 17h18a10 10 0 010 20h-6%22/%3E%3C/svg%3E"); }
.wpj-ico-pulse { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 21h8l4-11 7 22 4-11h11%22/%3E%3C/svg%3E"); }
.wpj-ico-family { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2213%22 cy=%229%22 r=%224%22/%3E%3Ccircle cx=%2228%22 cy=%2213%22 r=%223%22/%3E%3Cpath d=%22M5 35V23a8 8 0 0116 0v12M22 35v-9a6 6 0 0112 0v9%22/%3E%3C/svg%3E"); }
.wpj-ico-backpack { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M11 14a9 9 0 0118 0v19a2 2 0 01-2 2H13a2 2 0 01-2-2z%22/%3E%3Cpath d=%22M15 8V6a5 5 0 0110 0v2M11 25h18M16 25v4M6 20v10M34 20v10%22/%3E%3C/svg%3E"); }
.wpj-ico-pin { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M20 37s12-11 12-21a12 12 0 00-24 0c0 10 12 21 12 21z%22/%3E%3Ccircle cx=%2220%22 cy=%2216%22 r=%224.5%22/%3E%3C/svg%3E"); }
.wpj-ico-badge { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2220%22 cy=%2215%22 r=%2210%22/%3E%3Cpath d=%22M15.5 15l3 3 6-6M13 23l-3 13 10-5 10 5-3-13%22/%3E%3C/svg%3E"); }
.wpj-ico-guide { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2220%22 cy=%2210%22 r=%225%22/%3E%3Cpath d=%22M8 36c1-10 6-15 12-15s11 5 12 15M20 21v9M15 30h10%22/%3E%3C/svg%3E"); }
.wpj-ico-shield { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M20 4l13 5v9c0 9-6 15-13 18-7-3-13-9-13-18V9z%22/%3E%3Cpath d=%22M14 20l4.5 4.5L27 16%22/%3E%3C/svg%3E"); }
.wpj-ico-helmet { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M6 26a14 14 0 0128 0v4H6z%22/%3E%3Cpath d=%22M4 30h32M20 12V7M13 14v9M27 14v9%22/%3E%3C/svg%3E"); }
.wpj-ico-speech { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M5 8h24v17H17l-7 6v-6H5z%22/%3E%3Cpath d=%22M33 15h2v15h-3v5l-6-5h-7M11 14h12M11 19h8%22/%3E%3C/svg%3E"); }
.wpj-ico-wind { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 15h20a5 5 0 10-5-5M4 23h27a5 5 0 11-5 5M4 31h12%22/%3E%3C/svg%3E"); }
.wpj-ico-hand { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M13 22V9a2.5 2.5 0 015 0v10M18 17V6a2.5 2.5 0 015 0v12M23 18V9a2.5 2.5 0 015 0v14M28 20v-4a2.5 2.5 0 015 0v9c0 7-5 11-11 11s-9-3-12-8l-4-7a2.6 2.6 0 014-3l3 4%22/%3E%3C/svg%3E"); }
.wpj-ico-lock { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%228%22 y=%2218%22 width=%2224%22 height=%2217%22 rx=%223%22/%3E%3Cpath d=%22M13 18v-5a7 7 0 0114 0v5M20 25v4%22/%3E%3C/svg%3E"); }
.wpj-ico-cookie { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M20 5a15 15 0 1015 15 6 6 0 01-7-7 6 6 0 01-8-8z%22/%3E%3Cpath d=%22M14 17v.5M21 22v.5M15 27v.5M26 27v.5%22/%3E%3C/svg%3E"); }
.wpj-ico-doc { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M10 4h14l7 7v25H10z%22/%3E%3Cpath d=%22M24 4v7h7M15 19h11M15 25h11M15 31h7%22/%3E%3C/svg%3E"); }
.wpj-ico-mail { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%225%22 y=%229%22 width=%2230%22 height=%2222%22 rx=%223%22/%3E%3Cpath d=%22M6 11l14 11 14-11%22/%3E%3C/svg%3E"); }
.wpj-ico-scale { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M20 6v28M12 34h16M8 12h24M8 12L4 23a5 5 0 008 0zM32 12l-4 11a5 5 0 008 0z%22/%3E%3C/svg%3E"); }
.wpj-ico-clock { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2220%22 cy=%2220%22 r=%2214%22/%3E%3Cpath d=%22M20 11v9l6 4%22/%3E%3C/svg%3E"); }
.wpj-ico-share { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2210%22 cy=%2220%22 r=%224%22/%3E%3Ccircle cx=%2229%22 cy=%229%22 r=%224%22/%3E%3Ccircle cx=%2229%22 cy=%2231%22 r=%224%22/%3E%3Cpath d=%22M13.5 18l12-7M13.5 22l12 7%22/%3E%3C/svg%3E"); }
.wpj-ico-sliders { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M6 12h14M28 12h6M6 28h6M20 28h14%22/%3E%3Ccircle cx=%2224%22 cy=%2212%22 r=%224%22/%3E%3Ccircle cx=%2216%22 cy=%2228%22 r=%224%22/%3E%3C/svg%3E"); }
.wpj-ico-chart { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M6 34h28M11 34V22M20 34V10M29 34V17%22/%3E%3C/svg%3E"); }
.wpj-ico-ban { --wpj-ico: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2220%22 cy=%2220%22 r=%2214%22/%3E%3Cpath d=%22M10 10l20 20%22/%3E%3C/svg%3E"); }

/* the handwritten index beside the sheet (links are added by the script) */
@media (min-width: 1025px) {
	body .wpj-page .wpj-inf-index {
		position: sticky;
		top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--wpj-head-h, 84px) + 24px);
	}
}

.wpj-inf-item .wpj-inf-item-p + .wpj-inf-item-p {
	margin-top: 6px;
}

.wpj-inf-index a {
	display: block;
	padding: 6px 0;
	border-bottom: 1px dashed rgba(20, 18, 15, 0.25);
	font-family: var(--wpj-ff-hand, Caveat), "Segoe Script", cursive;
	font-weight: 700;
	font-size: 24px;
	line-height: 1.15;
	color: var(--wpj-ink, #14120F);
	text-decoration: none;
}

.wpj-inf-index a:hover,
.wpj-inf-index a:focus-visible {
	color: var(--wpj-ocean, #0768A0);
}

.wpj-inf-item {
	scroll-margin-top: calc(var(--wpj-head-h, 84px) + 24px);
}

body .wpj-page .wpj-inf-sheet > .wpj-abt-btn-wa {
	align-self: flex-start;
	width: auto;
}

@media (max-width: 1024px) {
	body .wpj-page .wpj-inf-index {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 0 18px;
	}

	.wpj-inf-index .wpj-inf-index-h {
		flex-basis: 100%;
	}

	.wpj-inf-index a {
		border-bottom: 0;
		font-size: 21px;
	}
}

html body:has(.wpj-inf-desk) div.wpj-foot-ridge {
	background-color: #E9E4D8;
}

/* =========================================================== journal (blog, the logbook) */

/* Plain WordPress templates (home.php, single-post.php), so the values are written out here
   instead of coming from the Elementor variables. */
body.wpj-blog-view #content > .ast-container {
	display: block;
	max-width: none;
	padding: 0;
}

.wpj-blog {
	--b-desk: #E9E4D8;
	--b-sheet: #FFFDF7;
	--b-ink: #14120F;
	--b-ink-2: #4A4F4C;
	--b-ocean: #0768A0;
	--b-sun: #FFCC00;
	--b-head: "Archivo", "Helvetica Neue", Arial, sans-serif;
	--b-body: "Karla", "Helvetica Neue", Arial, sans-serif;
	--b-hand: "Caveat", "Segoe Script", cursive;
	--b-display: "Anton", "Arial Narrow", Impact, sans-serif;
	--b-pad: clamp(16px, 4.4vw, 64px);
	display: block;
	padding: clamp(36px, 5.4vw, 88px) var(--b-pad) clamp(44px, 6vw, 96px);
	background: var(--b-desk);
	color: var(--b-ink);
	font-family: var(--b-body);
	font-size: 17px;
	line-height: 1.6;
}

.wpj-blog *,
.wpj-blog *::before,
.wpj-blog *::after {
	box-sizing: border-box;
}

html body.wpj-blog-view div.wpj-foot-ridge {
	background-color: #E9E4D8;
}

/* ---- the list */
.wpj-blog-top {
	display: flex;
	flex-direction: column;
	gap: 14px;
	max-width: 1040px;
	margin: 0 auto clamp(28px, 4vw, 52px);
}

body .wpj-blog .wpj-blog-kicker {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0;
	color: var(--b-ocean);
	font-weight: 700;
	font-size: clamp(12px, 1.1vw, 15px);
	letter-spacing: 0.26em;
	text-transform: uppercase;
}

.wpj-blog-kicker::before {
	content: "";
	flex: none;
	width: clamp(28px, 4vw, 56px);
	height: 3px;
	background: currentColor;
}

body .wpj-blog .wpj-blog-h {
	margin: 0;
	font-family: var(--b-hand);
	font-weight: 700;
	font-size: clamp(52px, 7vw, 104px);
	line-height: 0.95;
	color: var(--b-ocean);
	text-wrap: balance;
}

body .wpj-blog .wpj-blog-lead {
	max-width: 32em;
	margin: 0;
	font-family: var(--b-head);
	font-weight: 700;
	font-size: clamp(18px, 1.9vw, 24px);
	line-height: 1.35;
}

.wpj-blog-log {
	display: flex;
	flex-direction: column;
	gap: 26px;
	max-width: 1040px;
	margin: 0 auto;
}

.wpj-blog-entry {
	position: relative;
	display: grid;
	grid-template-columns: 92px minmax(0, 1fr) minmax(0, 320px);
	gap: clamp(16px, 2.6vw, 36px);
	align-items: center;
	padding: clamp(20px, 2.6vw, 34px);
	background: var(--b-sheet);
	box-shadow: 0 20px 40px -26px rgba(20, 18, 15, 0.45);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.wpj-blog-entry-plain {
	grid-template-columns: 92px minmax(0, 1fr);
}

.wpj-blog-entry:hover,
.wpj-blog-entry:focus-within {
	transform: translateY(-3px);
	box-shadow: 0 26px 46px -24px rgba(20, 18, 15, 0.5);
}

.wpj-blog-stamp {
	align-self: start;
	display: block;
	padding: 8px 4px;
	border: 2px solid var(--b-ocean);
	border-radius: 8px;
	color: var(--b-ocean);
	font-family: var(--b-display);
	line-height: 1;
	text-align: center;
	text-transform: uppercase;
	transform: rotate(-4deg);
}

.wpj-blog-entry:nth-child(even) .wpj-blog-stamp {
	transform: rotate(3deg);
}

.wpj-blog-stamp b {
	display: block;
	font-weight: 400;
	font-size: 40px;
}

.wpj-blog-stamp span {
	font-size: 15px;
	letter-spacing: 0.1em;
}

.wpj-blog-stamp small {
	display: block;
	margin-top: 4px;
	font-family: var(--b-body);
	font-weight: 700;
	font-size: 11px;
	letter-spacing: 0.12em;
}

.wpj-blog-min {
	font-family: var(--b-hand);
	font-weight: 700;
	font-size: 26px;
	line-height: 1;
	color: var(--b-ocean);
}

body .wpj-blog .wpj-blog-entry .wpj-blog-title {
	margin: 2px 0 8px;
	font-family: var(--b-head);
	font-weight: 800;
	font-size: clamp(22px, 2.5vw, 32px);
	line-height: 1.12;
	letter-spacing: -0.015em;
	color: var(--b-ink);
	text-wrap: balance;
}

body .wpj-blog .wpj-blog-title a {
	color: inherit;
	text-decoration: none;
}

/* the whole sheet is the link */
.wpj-blog-entry .wpj-blog-title a::after {
	content: "";
	position: absolute;
	inset: 0;
}

body .wpj-blog .wpj-blog-ex {
	margin: 0;
	color: var(--b-ink-2);
	font-size: 17px;
}

.wpj-blog-more {
	display: inline-block;
	margin-top: 10px;
	font-weight: 700;
	color: var(--b-ocean);
}

.wpj-blog-snap {
	position: relative;
	margin: 0;
	padding: 8px 8px 10px;
	background: #fff;
	box-shadow: 0 10px 22px -12px rgba(20, 18, 15, 0.5);
	transform: rotate(2.2deg);
}

.wpj-blog-entry:nth-child(even) .wpj-blog-snap {
	transform: rotate(-2deg);
}

.wpj-blog-snap::before {
	content: "";
	position: absolute;
	left: 50%;
	top: -12px;
	width: 92px;
	height: 26px;
	margin-left: -46px;
	background: rgba(255, 204, 0, 0.75);
	transform: rotate(-3deg);
}

.wpj-blog-snap img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.wpj-blog-pager {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 8px 24px;
	max-width: 1040px;
	margin: 30px auto 0;
}

body .wpj-blog .wpj-blog-pager a {
	font-family: var(--b-hand);
	font-weight: 700;
	font-size: 30px;
	line-height: 1.1;
	color: var(--b-ocean);
	text-decoration: none;
}

body .wpj-blog .wpj-blog-empty {
	max-width: 1040px;
	margin: 0 auto;
	font-family: var(--b-hand);
	font-weight: 700;
	font-size: 34px;
	color: var(--b-ink-2);
}

/* ---- one post */
/* Astra resets the margins of a post's article: the sheet is centred against that */
html body .wpj-blog article.wpj-blog-sheet {
	margin: 0 auto;
}

html body .wpj-blog article.wpj-blog-entry {
	margin: 0;
}

.wpj-blog-sheet {
	display: flex;
	flex-direction: column;
	gap: 22px;
	max-width: 820px;
	margin: 0 auto;
	padding: clamp(24px, 4.6vw, 68px);
	background: var(--b-sheet);
	box-shadow: 0 24px 50px -24px rgba(20, 18, 15, 0.4);
}

/* the photo is shown whole, in its own proportions */
.wpj-blog-snap-big {
	align-self: center;
	max-width: 100%;
	transform: rotate(-1deg);
}

.wpj-blog-snap-big img {
	width: auto;
	max-width: 100%;
	max-height: 80vh;
	aspect-ratio: auto;
	object-fit: contain;
}

body .wpj-blog .wpj-blog-when {
	margin: 0;
	font-family: var(--b-hand);
	font-weight: 700;
	font-size: 28px;
	line-height: 1;
	color: var(--b-ocean);
}

body .wpj-blog .wpj-blog-sheet > .wpj-blog-title {
	margin: 0;
	font-family: var(--b-head);
	font-weight: 800;
	font-size: clamp(30px, 4vw, 50px);
	line-height: 1.06;
	letter-spacing: -0.02em;
	color: var(--b-ink);
	text-wrap: balance;
}

/* whatever comes out of the WordPress editor */
.wpj-post-body {
	font-size: 18px;
	line-height: 1.75;
	overflow-wrap: break-word;
}

body .wpj-blog .wpj-post-body > * {
	margin: 0 0 20px;
}

body .wpj-blog .wpj-post-body > *:last-child {
	margin-bottom: 0;
}

body .wpj-blog .wpj-post-body h2,
body .wpj-blog .wpj-post-body h3,
body .wpj-blog .wpj-post-body h4 {
	margin: 34px 0 12px;
	font-family: var(--b-head);
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.015em;
	color: var(--b-ink);
	text-wrap: balance;
}

body .wpj-blog .wpj-post-body h2 {
	font-size: clamp(24px, 2.6vw, 32px);
}

body .wpj-blog .wpj-post-body h3 {
	font-size: clamp(20px, 2.1vw, 25px);
}

body .wpj-blog .wpj-post-body h4 {
	font-size: 19px;
}

body .wpj-blog .wpj-post-body a {
	color: var(--b-ocean);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
}

body .wpj-blog .wpj-post-body ul,
body .wpj-blog .wpj-post-body ol {
	padding-left: 26px;
}

body .wpj-blog .wpj-post-body li {
	margin-bottom: 8px;
}

body .wpj-blog .wpj-post-body ul > li::marker {
	color: var(--b-ocean);
}

body .wpj-blog .wpj-post-body blockquote {
	padding: 4px 0 4px 8px;
	border: 0;
	background: none;
	font-family: var(--b-hand);
	font-weight: 700;
	font-style: normal;
	font-size: clamp(28px, 3vw, 38px);
	line-height: 1.1;
	color: var(--b-ocean);
}

body .wpj-blog .wpj-post-body blockquote p {
	margin: 0;
}

body .wpj-blog .wpj-post-body blockquote cite {
	display: block;
	margin-top: 8px;
	font-family: var(--b-body);
	font-weight: 600;
	font-style: normal;
	font-size: 15px;
	color: var(--b-ink-2);
}

.wpj-post-body img {
	max-width: 100%;
	height: auto;
	border-radius: 10px;
}

.wpj-post-body figure {
	max-width: 100%;
}

.wpj-post-body figcaption {
	padding-top: 8px;
	font-size: 14px;
	color: var(--b-ink-2);
	text-align: left;
}

.wpj-post-body iframe,
.wpj-post-body video {
	max-width: 100%;
}

.wpj-post-body .wp-block-embed__wrapper iframe {
	width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
}

.wpj-post-body hr {
	border: 0;
	border-top: 1px dashed rgba(20, 18, 15, 0.3);
}

.wpj-post-body table {
	display: block;
	max-width: 100%;
	overflow-x: auto;
	border-collapse: collapse;
	font-size: 16px;
}

.wpj-post-body th,
.wpj-post-body td {
	padding: 8px 12px;
	border: 1px solid rgba(20, 18, 15, 0.18);
	text-align: left;
}

.wpj-blog-ps {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px 24px;
	padding-top: 22px;
	border-top: 1px dashed rgba(20, 18, 15, 0.3);
}

body .wpj-blog .wpj-blog-ps p {
	flex: 1 1 300px;
	margin: 0;
	font-size: 17px;
}

.wpj-blog-ps-h {
	display: block;
	font-family: var(--b-hand);
	font-weight: 700;
	font-size: 34px;
	line-height: 1;
	color: var(--b-ocean);
}

body .wpj-blog .wpj-blog-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 24px;
	border-radius: 999px;
	background: var(--b-sun);
	color: var(--b-ink);
	font-weight: 700;
	font-size: 15px;
	text-decoration: none;
	white-space: nowrap;
	transition: transform 0.2s ease;
}

body .wpj-blog .wpj-blog-btn:hover,
body .wpj-blog .wpj-blog-btn:focus-visible {
	transform: scale(1.05);
}

.wpj-blog-slips {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 16px;
	max-width: 820px;
	margin: 26px auto 0;
}

body .wpj-blog .wpj-blog-slips a {
	display: block;
	padding: 16px 20px;
	background: var(--b-sheet);
	box-shadow: 0 12px 26px -18px rgba(20, 18, 15, 0.5);
	color: var(--b-ink);
	text-decoration: none;
}

.wpj-blog-slips span {
	display: block;
	font-family: var(--b-hand);
	font-weight: 700;
	font-size: 22px;
	color: var(--b-ocean);
}

.wpj-blog-slips b {
	font-family: var(--b-head);
	font-size: 18px;
	line-height: 1.2;
}

.wpj-blog a:focus-visible {
	outline: 3px solid #5FB4E6;
	outline-offset: 2px;
}

@media (max-width: 900px) {
	.wpj-blog-entry,
	.wpj-blog-entry-plain {
		grid-template-columns: 70px minmax(0, 1fr);
	}

	.wpj-blog-entry .wpj-blog-snap {
		grid-column: 1 / -1;
		order: -1;
		justify-self: center;
		width: 100%;
		max-width: 420px;
	}

	.wpj-blog-stamp b {
		font-size: 30px;
	}

	.wpj-post-body {
		font-size: 17px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wpj-blog-entry,
	.wpj-blog-btn {
		transition: none;
	}
}

/* =========================================================== site header (every page) */

/* The design's .site-header, rendered by the child theme in place of Astra's header.
   Colours and fonts come from the Elementor variables, with the design's own values as
   fallbacks for pages where Elementor's kit stylesheet is not loaded (shop, checkout). */
.wpj-site-header {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 60;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 18px 64px;
	background: var(--wpj-basalt, #171B1A);
	overflow-x: clip; /* the parked panel waits off to the right */
	font-family: var(--wpj-ff-body, Karla), "Helvetica Neue", sans-serif;
	box-sizing: border-box;
}

.wpj-site-header *,
.wpj-site-header *::before,
.wpj-site-header *::after {
	box-sizing: border-box;
}

.wpj-site-header .wpj-brand {
	display: flex;
	align-items: center;
	gap: 12px;
}

/* the logo is the button: it pulses, and on hover grows and gets a blue ring */
.wpj-site-header .wpj-mark-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: transparent;
	cursor: pointer;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.wpj-site-header .wpj-mark-btn:hover,
.wpj-site-header .wpj-mark-btn:focus-visible {
	transform: scale(1.3);
	box-shadow: 0 0 0 4px var(--wpj-ember, #0768A0), 0 0 32px var(--wpj-ring, rgba(7, 104, 160, 0.36));
	outline: none;
}

.wpj-site-header .wpj-brand-mark {
	display: block;
	width: 46px;
	height: 46px;
	max-width: none;
	border-radius: 999px;
	object-fit: cover;
}

@keyframes wpjMarkPulse {
	0%, 66%, 100% { transform: scale(1); }
	78% { transform: scale(1.2); }
	88% { transform: scale(1.06); }
}

.wpj-site-header .wpj-mark-pulse {
	animation: wpjMarkPulse 2.2s ease-in-out infinite;
}

.wpj-site-header .wpj-mark-btn:hover .wpj-mark-pulse,
.wpj-site-header .wpj-mark-btn:focus-visible .wpj-mark-pulse {
	animation: none;
}

.wpj-site-header .wpj-brand-text {
	display: flex;
	flex-direction: column;
	text-decoration: none;
}

.wpj-site-header .wpj-brand-name {
	font-family: var(--wpj-ff-head, Archivo), "Helvetica Neue", sans-serif;
	font-weight: 700;
	font-size: 21px;
	line-height: 1.16;
	letter-spacing: -0.015em;
	color: var(--wpj-on-dark, #F4F1EA);
	white-space: nowrap;
}

.wpj-site-header .wpj-brand-sub {
	font-size: 12px;
	line-height: 1.4;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wpj-on-dark-2, #B9C0BC);
}

/* "Menu" pill (.button-primary) */
.wpj-site-header .wpj-header-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 12px 24px;
	font-family: var(--wpj-ff-body, Karla), "Helvetica Neue", sans-serif;
	font-weight: 600;
	font-size: 14px;
	line-height: 1.2;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	white-space: nowrap;
	text-decoration: none;
	color: var(--wpj-paper, #F7F8F7);
	background: var(--wpj-ember, #0768A0);
	border: 2px solid var(--wpj-ember, #0768A0);
	border-radius: 3px;
}

.wpj-site-header .wpj-header-cta:hover,
.wpj-site-header .wpj-header-cta:focus-visible {
	color: var(--wpj-paper, #F7F8F7);
	background: var(--wpj-deep, #054A73);
	border-color: var(--wpj-deep, #054A73);
}

/* the slide-out panel (.nav-drawer) */
.wpj-site-header .wpj-drawer {
	position: absolute;
	top: 100%;
	right: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 12px;
	width: 420px;
	max-width: 100%;
	min-height: 560px;
	max-height: calc(100dvh - 82px - var(--wp-admin--admin-bar--height, 0px));
	overflow-y: auto;
	padding: 24px 32px 48px;
	background: var(--wpj-paper, #F7F8F7);
	border-left: 1px solid var(--wpj-line, #D8DAD6);
	border-bottom: 1px solid var(--wpj-line, #D8DAD6);
	transform: translateX(110%);
	visibility: hidden;
	transition: transform 0.4s ease, visibility 0s linear 0.4s;
}

/* :target is only the no-script fallback; with the script the panel follows .is-open alone */
.wpj-site-header .wpj-drawer.is-open,
html:not(.wpj-js) .wpj-site-header .wpj-drawer:target {
	transform: translateX(0);
	visibility: visible;
	transition: transform 0.4s ease, visibility 0s;
}

.wpj-site-header .wpj-drawer-close {
	display: flex;
	align-items: center;
	align-self: flex-end;
	min-height: 48px;
	padding: 0 8px;
	font-size: 33px;
	line-height: 1.04;
	text-decoration: none;
	color: var(--wpj-ink, #14120F);
	background: transparent;
	border: 0;
	cursor: pointer;
}

.wpj-site-header .wpj-drawer-close:hover,
.wpj-site-header .wpj-drawer-close:focus-visible {
	color: var(--wpj-ember, #0768A0);
}

.wpj-site-header .wpj-drawer-nav,
.wpj-site-header .wpj-drawer-sub {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	margin: 0;
	padding: 0;
	list-style: none;
}

.wpj-site-header .wpj-drawer-nav {
	gap: 4px;
	padding-top: 24px;
}

.wpj-site-header .wpj-drawer-nav a {
	display: block;
	padding: 4px 12px;
	font-family: var(--wpj-ff-head, Archivo), "Helvetica Neue", sans-serif;
	font-weight: 700;
	font-size: 46px;
	line-height: 1.04;
	letter-spacing: -0.015em;
	text-transform: lowercase;
	text-align: right;
	text-decoration: none;
	color: var(--wpj-ink, #14120F);
	background: transparent;
	border-radius: 3px;
}

.wpj-site-header .wpj-drawer-nav a:hover,
.wpj-site-header .wpj-drawer-nav a:focus-visible {
	color: var(--wpj-paper, #F7F8F7);
	background: var(--wpj-ember, #0768A0);
}

.wpj-site-header .wpj-drawer-sub {
	gap: 8px;
	padding-top: 24px;
}

.wpj-site-header .wpj-drawer-sub a {
	font-size: 17px;
	line-height: 1.4;
	text-align: right;
	text-decoration: none;
	color: var(--wpj-ink-2, #4A443B);
}

.wpj-site-header .wpj-drawer-sub a:hover,
.wpj-site-header .wpj-drawer-sub a:focus-visible {
	color: var(--wpj-ember, #0768A0);
}

/* "Book now" pill (.drawer-cta) */
.wpj-site-header .wpj-drawer-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	margin-top: 32px;
	padding: 12px 32px;
	font-family: var(--wpj-ff-head, Archivo), "Helvetica Neue", sans-serif;
	font-weight: 700;
	font-size: 21px;
	line-height: 1.2;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--wpj-paper, #F7F8F7);
	background: var(--wpj-ember, #0768A0);
	border: 0;
	border-radius: 999px;
}

.wpj-site-header .wpj-drawer-cta:hover,
.wpj-site-header .wpj-drawer-cta:focus-visible {
	color: var(--wpj-paper, #F7F8F7);
	background: var(--wpj-deep, #054A73);
}

.wpj-site-header .wpj-drawer-foot {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 4px;
	padding-top: 32px;
}

.wpj-site-header .wpj-drawer-title {
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wpj-ink-2, #4A443B);
}

.wpj-site-header .wpj-drawer-note {
	font-size: 14px;
	text-decoration: none;
	color: var(--wpj-ink-2, #4A443B);
}

.wpj-site-header .wpj-drawer-note:hover,
.wpj-site-header .wpj-drawer-note:focus-visible {
	color: var(--wpj-ember, #0768A0);
}

/* right-hand group of the bar: language switcher + "Menu" pill */
.wpj-site-header .wpj-header-actions {
	display: flex;
	align-items: center;
	gap: 12px;
}

/* language switcher: flag + code of the current language, the others unfold below */
.wpj-site-header .wpj-lang {
	position: relative;
}

.wpj-site-header .wpj-lang-current {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 48px;
	padding: 0 14px;
	list-style: none;
	font-family: var(--wpj-ff-body, Karla), "Helvetica Neue", sans-serif;
	font-weight: 600;
	font-size: 14px;
	line-height: 1;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wpj-on-dark, #F4F1EA);
	background: transparent;
	border: 1px solid var(--wpj-line-dark, #2C3331);
	border-radius: 3px;
	cursor: pointer;
	user-select: none;
	-webkit-user-select: none;
	transition: border-color 0.2s ease, background-color 0.2s ease;
}

.wpj-site-header .wpj-lang-current::-webkit-details-marker {
	display: none;
}

.wpj-site-header .wpj-lang-current::marker {
	content: "";
}

.wpj-site-header .wpj-lang-current:hover,
.wpj-site-header .wpj-lang-current:focus-visible,
.wpj-site-header .wpj-lang[open] > .wpj-lang-current {
	border-color: var(--wpj-on-dark-2, #B9C0BC);
	background: var(--wpj-line-dark, #2C3331);
	outline: none;
}

.wpj-site-header .wpj-lang-flag {
	display: block;
	flex: none;
	width: 18px;
	height: 12px;
	max-width: none;
	object-fit: cover;
	border-radius: 2px;
	box-shadow: 0 0 0 1px rgba(244, 241, 234, 0.18);
}

/* caret drawn with borders, turns over when open */
.wpj-site-header .wpj-lang-caret {
	display: block;
	width: 7px;
	height: 7px;
	margin-left: 2px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-2px) rotate(45deg);
	transition: transform 0.2s ease;
}

.wpj-site-header .wpj-lang[open] .wpj-lang-caret {
	transform: translateY(2px) rotate(-135deg);
}

.wpj-site-header .wpj-lang-list {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	z-index: 2;
	min-width: 100%;
	margin: 0;
	padding: 6px;
	list-style: none;
	background: var(--wpj-basalt, #171B1A);
	border: 1px solid var(--wpj-line-dark, #2C3331);
	border-radius: 3px;
	box-shadow: 0 18px 40px -20px rgba(0, 0, 0, 0.6);
}

.wpj-site-header .wpj-lang-list li {
	margin: 0;
}

.wpj-site-header .wpj-lang-option {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 12px;
	font-family: var(--wpj-ff-body, Karla), "Helvetica Neue", sans-serif;
	font-weight: 600;
	font-size: 14px;
	line-height: 1;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	color: var(--wpj-on-dark, #F4F1EA);
	border-radius: 2px;
}

.wpj-site-header .wpj-lang-option:hover,
.wpj-site-header .wpj-lang-option:focus-visible {
	color: var(--wpj-paper, #F7F8F7);
	background: var(--wpj-ember, #0768A0);
	outline: none;
}

/* the brand gives way before the buttons ever leave the bar */
.wpj-site-header .wpj-brand {
	flex: 1 1 auto;
	min-width: 0;
}

.wpj-site-header .wpj-brand-text {
	min-width: 0;
}

.wpj-site-header .wpj-brand-name {
	overflow: hidden;
	text-overflow: ellipsis;
}

.wpj-site-header .wpj-header-actions {
	flex: none;
}

@media (max-width: 767px) {
	.wpj-site-header .wpj-header-actions {
		gap: 8px;
	}

	.wpj-site-header .wpj-lang-current {
		gap: 6px;
		padding: 0 10px;
	}
}

/* phones: one compact row — logo, name, switcher, Menu */
@media (max-width: 480px) {
	.wpj-site-header {
		gap: 8px;
		padding-left: 16px;
		padding-right: 16px;
	}

	.wpj-site-header .wpj-brand {
		gap: 8px;
	}

	.wpj-site-header .wpj-brand-name {
		font-size: 16px;
		letter-spacing: -0.02em;
	}

	.wpj-site-header .wpj-brand-sub {
		display: none;
	}

	.wpj-site-header .wpj-lang-current {
		gap: 5px;
		padding: 0 8px;
	}

	.wpj-site-header .wpj-header-cta {
		padding: 12px 14px;
		letter-spacing: 0.08em;
	}
}

/* the narrowest phones keep the logo only: a clipped name reads worse than none
   (Home is the first link in the panel) */
@media (max-width: 359px) {
	.wpj-site-header .wpj-brand-text {
		display: none;
	}
}

@media (max-width: 1024px) {
	.wpj-site-header {
		padding: 18px 32px;
	}

	.wpj-site-header .wpj-drawer {
		width: 360px;
		min-height: 500px;
	}

	.wpj-site-header .wpj-drawer-nav a {
		font-size: 38px;
	}
}

@media (max-width: 767px) {
	.wpj-site-header {
		padding: 18px 20px;
	}

	.wpj-site-header .wpj-brand-mark {
		width: 38px;
		height: 38px;
	}

	.wpj-site-header .wpj-brand-name {
		font-size: 19px;
	}

	.wpj-site-header .wpj-drawer {
		width: 300px;
		min-height: 440px;
	}

	.wpj-site-header .wpj-drawer-nav a {
		font-size: 32px;
	}
}

/* phones again: the 767px block above comes later in this file and would undo the compact row
   (the name then no longer fits next to the switcher and Menu on a 360px screen) */
@media (max-width: 480px) {
	.wpj-site-header {
		padding-left: 16px;
		padding-right: 16px;
	}

	.wpj-site-header .wpj-brand-mark {
		width: 34px;
		height: 34px;
	}

	.wpj-site-header .wpj-brand-name {
		font-size: 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wpj-site-header .wpj-mark-pulse {
		animation: none;
	}

	.wpj-site-header .wpj-drawer,
	.wpj-site-header .wpj-drawer.is-open {
		transition: none;
	}
}

/* =========================================================== reduced motion */

@media (prefers-reduced-motion: reduce) {
	.wpj-fx .wpj-hero-kicker,
	.wpj-fx .wpj-hero-title,
	.wpj-fx .wpj-hero-lead,
	.wpj-fx .wpj-hero-inner > .wpj-btn-row,
	.wpj-cue-bar,
	.wpj-dt-cue-track::after {
		animation: none;
	}

	.wpj-fx .wpj-reveal-line,
	.wpj-flip-mask .wpj-flip-line,
	.wpj-flip-ch {
		transform: none;
		transition: none;
	}
}

/* =========================================================== site footer (every page) */

/* The design's .site-footer, rendered by the child theme in place of Astra's. Same rule as
   the header: colours and fonts come from the Elementor variables, with the design's values
   as fallbacks for pages where the Elementor kit stylesheet is not loaded. */
/* The drawn ridges the footer rises out of, on every page that does not end in Home's
   purpose strip. Same drawing, same height; on the design pages it stands on the page's
   paper colour, elsewhere on whatever the page ends with. */
.wpj-foot-ridge {
	position: relative;
	height: 9vw;
	margin-bottom: -8px;
	background: url("ridge-bottom.svg") center bottom / 100% 100% no-repeat;
	pointer-events: none;
}

body:has(.wpj-page) .wpj-foot-ridge {
	background-color: var(--wpj-paper, #F7F8F7);
}

.wpj-site-footer {
	display: flex;
	flex-direction: column;
	padding: 64px 64px 32px;
	background: var(--wpj-basalt, #171B1A);
	color: var(--wpj-on-dark-2, #B9C0BC);
	font-family: var(--wpj-ff-body, Karla), "Helvetica Neue", sans-serif;
	box-sizing: border-box;
}

.wpj-site-footer *,
.wpj-site-footer *::before,
.wpj-site-footer *::after {
	box-sizing: border-box;
}

.wpj-foot-cards {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	align-items: stretch;
	width: 100%;
	max-width: 1440px;
	margin: 0 auto;
}

.wpj-foot-card {
	display: flex;
	flex-direction: column;
	gap: 16px;
	flex: 1 1 270px;
	min-width: 0;
	padding: 32px;
	border: 1px solid rgba(244, 241, 234, 0.13);
	border-radius: var(--wpj-r-l, 18px);
	background-color: rgba(244, 241, 234, 0.055);
}

.wpj-foot-card-h {
	margin: 0;
	padding-bottom: 16px;
	border-bottom: 1px solid rgba(244, 241, 234, 0.16);
	font-family: var(--wpj-ff-head, Archivo), "Helvetica Neue", sans-serif;
	font-weight: 700;
	font-size: var(--wpj-fs-h2, 33px);
	line-height: var(--wpj-lh-tight, 1.04);
	letter-spacing: var(--wpj-ls-head, -0.015em);
	color: var(--wpj-on-dark, #F4F1EA);
}

.wpj-foot-list .wpj-foot-list-menu {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.wpj-foot-list-menu li {
	margin: 0;
	list-style: none;
}

/* each link grows a little from its left edge on hover, as in the design */
.wpj-foot-list-menu a {
	display: flex;
	align-items: center;
	min-height: 48px;
	font-size: var(--wpj-fs-lead, 20px);
	line-height: 1.2;
	color: var(--wpj-on-dark-2, #B9C0BC);
	text-decoration: none;
	transform-origin: 0% 50%;
	transition: transform 0.34s cubic-bezier(0.2, 0.9, 0.26, 1), color 0.24s ease;
}

.wpj-foot-list-menu a:hover,
.wpj-foot-list-menu a:focus-visible {
	color: var(--wpj-sun, #FFCC00);
	transform: scale(1.14);
}

.wpj-foot-strong {
	margin: 0;
	font-family: var(--wpj-ff-head, Archivo), "Helvetica Neue", sans-serif;
	font-weight: 700;
	font-size: var(--wpj-fs-lead, 20px);
	line-height: var(--wpj-lh-head, 1.16);
	color: var(--wpj-on-dark, #F4F1EA);
	text-wrap: pretty;
}

.wpj-foot-body {
	margin: 0;
	font-size: var(--wpj-fs-sm, 14px);
	line-height: var(--wpj-lh-body, 1.62);
	color: var(--wpj-on-dark-2, #B9C0BC);
	text-wrap: pretty;
}

.wpj-foot-note {
	margin: 0;
	font-size: var(--wpj-fs-xs, 12px);
	line-height: var(--wpj-lh-body, 1.62);
	color: var(--wpj-on-dark-2, #B9C0BC);
}

.wpj-foot-contact {
	color: inherit;
	text-decoration: none;
}

.wpj-foot-contact:hover,
.wpj-foot-contact:focus-visible {
	color: var(--wpj-sun, #FFCC00);
}

/* pushes the link to the bottom, so all three cards line up */
.wpj-foot-fill {
	flex: 1 1 auto;
}

.wpj-foot-underline {
	display: inline-flex;
	align-items: center;
	align-self: flex-start;
	flex: 0 0 auto;
	gap: 12px;
	padding: 0 0 8px;
	border-bottom: 2px solid rgba(244, 241, 234, 0.28);
	font-family: var(--wpj-ff-head, Archivo), "Helvetica Neue", sans-serif;
	font-weight: 700;
	font-size: var(--wpj-fs-lead, 20px);
	letter-spacing: var(--wpj-ls-head, -0.015em);
	color: var(--wpj-on-dark, #F4F1EA);
	text-decoration: none;
	transition: color 0.24s ease, border-color 0.24s ease;
}

.wpj-foot-underline:hover,
.wpj-foot-underline:focus-visible {
	color: var(--wpj-sun, #FFCC00);
	border-bottom-color: var(--wpj-sun, #FFCC00);
}

.wpj-foot-underline-ico {
	display: block;
	width: 24px;
	height: 24px;
	flex: 0 0 auto;
	transition: transform 0.34s cubic-bezier(0.2, 0.9, 0.26, 1);
}

.wpj-foot-underline:hover .wpj-foot-underline-ico,
.wpj-foot-underline:focus-visible .wpj-foot-underline-ico {
	transform: translateX(6px);
}

.wpj-foot-row {
	display: flex;
	align-items: center;
	gap: 12px;
}

.wpj-foot-ico {
	display: block;
	width: 24px;
	height: 24px;
	flex: 0 0 auto;
	color: var(--wpj-sun, #FFCC00);
}

.wpj-foot-label {
	font-weight: 700;
	font-size: var(--wpj-fs-sm, 14px);
	letter-spacing: var(--wpj-ls-kicker, 0.14em);
	text-transform: uppercase;
	color: var(--wpj-sun, #FFCC00);
}

.wpj-foot-socials {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding-top: 48px;
}

.wpj-foot-soc-pill {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	padding: 12px 24px;
	border: 1px solid rgba(244, 241, 234, 0.14);
	border-radius: 999px;
	background-color: rgba(244, 241, 234, 0.08);
	font-size: var(--wpj-fs-sm, 14px);
	line-height: 1;
	color: var(--wpj-on-dark, #F4F1EA);
	text-decoration: none;
	transition: background-color 0.24s ease, color 0.24s ease, border-color 0.24s ease;
}

.wpj-foot-soc-pill:hover,
.wpj-foot-soc-pill:focus-visible {
	background-color: var(--wpj-sun, #FFCC00);
	border-color: var(--wpj-sun, #FFCC00);
	color: var(--wpj-ink, #14120F);
}

.wpj-foot-fine {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 24px;
	padding-top: 32px;
	font-size: var(--wpj-fs-xs, 12px);
	color: var(--wpj-on-dark-2, #B9C0BC);
}

@media (max-width: 1024px) {
	.wpj-site-footer {
		padding: 64px 32px 32px;
	}

	.wpj-foot-card-h {
		font-size: var(--wpj-fs-h2-t, 28px);
	}

	.wpj-foot-list-menu a,
	.wpj-foot-strong,
	.wpj-foot-underline {
		font-size: var(--wpj-fs-lead-t, 18px);
	}
}

@media (max-width: 767px) {
	.wpj-site-footer {
		padding: 44px 20px 32px;
	}

	.wpj-foot-card {
		flex: 1 1 100%;
		padding: 24px;
	}

	.wpj-foot-card-h {
		font-size: var(--wpj-fs-h2-m, 25px);
	}

	.wpj-foot-list-menu a,
	.wpj-foot-strong,
	.wpj-foot-underline {
		font-size: var(--wpj-fs-lead-m, 17px);
	}
}