/*
 * Summer's End Angus: base layer.
 * Primitives every widget builds on. Class names here are the contract:
 * builders use them and never redefine them.
 */

/* ------------------------------------------------------------- resets */

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

body.se-site {
	margin: 0;
	background: var(--se-black);
	color: var(--se-text);
	font-family: var(--se-font-body);
	font-size: 1rem;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

body.se-site img,
body.se-site video,
body.se-site svg {
	max-width: 100%;
	display: block;
}

/*
 * Zero specificity through :where(), so the reset still beats the browser
 * default (author origin wins over the user agent whatever the score) while any
 * single class a widget writes, `.se-link`, `.se-onsite-links__item` and the
 * rest, wins over the reset instead of silently losing to it.
 */
:where(body.se-site a) {
	color: inherit;
	text-decoration: none;
}

body.se-site :focus-visible {
	outline: 2px solid var(--se-red-hot);
	outline-offset: 3px;
}

/* Elementor wraps everything: make its containers full bleed, no gutters. */
body.se-site .elementor-section,
body.se-site .elementor-container,
body.se-site .e-con,
body.se-site .e-con-inner,
body.se-site .elementor-widget-wrap {
	max-width: none;
	width: 100%;
}

body.se-site .e-con,
body.se-site .e-con-inner {
	--width: 100%;
	--content-width: 100%;
	--padding-block-start: 0;
	--padding-block-end: 0;
	--padding-inline-start: 0;
	--padding-inline-end: 0;
	--gap: 0px;
}

body.se-site .elementor-widget:not(:last-child) {
	margin-block-end: 0;
}

/*
 * The core plugin wraps each global part in a div. Without display:contents the
 * fixed header's containing block would be that box rather than the viewport.
 */
body.se-site .se-global-part,
body.se-site .se-global-part > .elementor {
	display: contents;
}

.se-skip {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 200;
	background: var(--se-red);
	color: #fff;
	padding: 0.75rem 1.25rem;
	font-family: var(--se-font-label);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.se-skip:focus {
	left: 0;
}

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

/* ------------------------------------------------------------ sections */

.se-section {
	position: relative;
	width: 100%;
	background: var(--se-black);
	color: var(--se-text);
}

.se-section--night { background: var(--se-night); }
.se-section--red { background: var(--se-red); }
.se-section--cocoa { background: var(--se-cocoa); }
.se-section--bone { background: var(--se-bone); color: var(--se-black); }

.se-pad {
	padding-inline: var(--se-pad);
}

/* --------------------------------------------------------------- type */

.se-d1, .se-d1b, .se-d2, .se-d3, .se-d3b, .se-d4, .se-d5,
.se-h1, .se-h2, .se-h3 {
	margin: 0;
	font-family: var(--se-font-display);
	font-weight: 900;
	font-style: normal;
	text-transform: uppercase;
	line-height: 0.88;
	letter-spacing: -0.01em;
	word-break: normal;
}

/* Sizes: vw factor = design px at 1920 divided by 19.2. */
.se-d1  { font-size: clamp(3.25rem,  19.11vw, 22.94rem); }  /* 367 at 1920 */
.se-d1b { font-size: clamp(2.875rem, 16.67vw, 20rem); }     /* 320 */
.se-d2  { font-size: clamp(2.75rem,  11.98vw, 14.375rem); } /* 230 */
.se-d3  { font-size: clamp(2.5rem,   11.09vw, 13.31rem); }  /* 213 */
.se-d3b { font-size: clamp(2.375rem, 10.42vw, 12.5rem); }   /* 200 */
.se-d4  { font-size: clamp(2.25rem,   8.33vw, 10rem); }     /* 160 */
.se-d5  { font-size: clamp(2rem,      6.77vw,  8.125rem); } /* 130 */

.se-h1 { font-size: clamp(2rem,     3.33vw,  4rem); line-height: 0.92; }     /* 64 */
.se-h2 { font-size: clamp(1.625rem, 2.29vw,  2.75rem); line-height: 0.92; }  /* 44 */
.se-h3 { font-size: clamp(1.375rem, 1.98vw,  2.375rem); line-height: 0.92; } /* 38 */

.se-d1, .se-d1b, .se-d2, .se-d3, .se-d3b { line-height: 0.86; }

.se-label {
	margin: 0;
	font-family: var(--se-font-label);
	font-weight: 600;
	font-size: clamp(0.8125rem, 0.94vw, 1.125rem);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	line-height: 1.2;
}

.se-mono,
.se-eyebrow {
	margin: 0;
	font-family: var(--se-font-mono);
	font-weight: 400;
	font-size: clamp(0.75rem, 0.73vw, 0.875rem);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	line-height: 1.4;
	color: var(--se-grey);
}

.se-body {
	margin: 0;
	font-family: var(--se-font-body);
	font-weight: 400;
	font-size: clamp(1rem, 1.25vw, 1.375rem);
	line-height: 1.55;
	color: var(--se-text-soft);
}

.se-lede {
	margin: 0;
	font-family: var(--se-font-body);
	font-weight: 400;
	font-size: clamp(1.125rem, 1.56vw, 1.625rem);
	line-height: 1.5;
	color: var(--se-text-mute);
}

.se-measure { max-width: 56rem; }
.se-measure-sm { max-width: 38rem; }

/* -------------------------------------------------------------- media */

/*
 * Elementor's frontend sheet ships `.elementor img { height: auto }` at (0,1,1),
 * which outranks a bare `.se-media` (0,1,0): the photo then renders at its own
 * intrinsic height and `object-fit` never applies, so the frame shows the top
 * edge of the picture only. The selector below is restated at (0,2,1) so the
 * fill always wins, wherever Elementor's sheet lands in the print order.
 */
.se-media,
body.se-site .se-media,
body.se-site .elementor .se-media {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: var(--se-focal, 50% 50%);
}

.se-media-wrap {
	position: relative;
	overflow: hidden;
	background: var(--se-cocoa);
}

.se-shade-top,
.se-shade-bottom {
	position: absolute;
	left: 0;
	right: 0;
	pointer-events: none;
}

.se-shade-top {
	top: 0;
	height: 30%;
	background: linear-gradient(to bottom, rgba(11, 10, 9, 0.8), rgba(11, 10, 9, 0));
}

.se-shade-bottom {
	bottom: 0;
	height: 42%;
	background: linear-gradient(to top, var(--se-black), rgba(11, 10, 9, 0));
}

/* ------------------------------------------------------------ buttons */

.se-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	padding: 1rem 1.875rem;
	border: 0;
	cursor: pointer;
	font-family: var(--se-font-display);
	font-weight: 700;
	font-size: clamp(1rem, 1.09vw, 1.3125rem);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	line-height: 1;
	background: var(--se-red);
	color: #fff;
	transition: background-color var(--se-dur) var(--se-ease), color var(--se-dur) var(--se-ease);
}

.se-btn__arrow {
	display: inline-block;
	font-family: var(--se-font-body);
	font-weight: 500;
	transition: transform var(--se-dur) var(--se-ease);
}

.se-btn:hover .se-btn__arrow,
.se-btn:focus-visible .se-btn__arrow {
	transform: translateX(4px);
}

.se-btn--red { background: var(--se-red); color: #fff; }
.se-btn--red:hover { background: var(--se-red-hot); }

.se-btn--black { background: var(--se-black); color: #fff; }
.se-btn--black:hover { background: var(--se-night); }

.se-btn--bone { background: var(--se-bone); color: var(--se-black); }
.se-btn--bone:hover { background: #fff; }

.se-btn--lg {
	padding: 1.3rem 2.44rem;
	font-size: clamp(1.125rem, 1.42vw, 1.7rem);
}

.se-btn--block {
	width: 100%;
}

.se-link {
	display: inline-flex;
	align-items: center;
	gap: 0.625rem;
	font-family: var(--se-font-display);
	font-weight: 700;
	font-size: clamp(1rem, 1.15vw, 1.375rem);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	line-height: 1;
	color: var(--se-text);
	transition: color var(--se-dur) var(--se-ease);
}

.se-link:hover { color: var(--se-red-hot); }

.se-link__arrow {
	font-family: var(--se-font-body);
	font-weight: 500;
	transition: transform var(--se-dur) var(--se-ease);
}

.se-link:hover .se-link__arrow,
.se-link:focus-visible .se-link__arrow {
	transform: translateX(4px);
}

.se-button-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: clamp(1.25rem, 2.08vw, 2.5rem);
}

/* ---------------------------------------------------------------- tab */

.se-tab {
	display: inline-flex;
	flex-direction: column;
	align-items: stretch;
	gap: 3px;
	padding: 3px;
	background: var(--se-tab-edge);
	border: 0;
	cursor: pointer;
	text-align: center;
	transition: background-color var(--se-dur) var(--se-ease);
}

.se-tab__row {
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--se-red);
	color: #fff;
	font-family: var(--se-font-display);
	font-weight: 700;
	text-transform: uppercase;
	line-height: 1.1;
	transition: background-color var(--se-dur) var(--se-ease);
}

.se-tab__top {
	padding: 0.3125rem 1.25rem;
	font-size: clamp(1.125rem, 1.46vw, 1.75rem);
	letter-spacing: 0.01em;
}

.se-tab__bottom {
	padding: 0.25rem 1.25rem;
	font-size: clamp(0.875rem, 0.99vw, 1.1875rem);
	letter-spacing: 0.02em;
}

/*
 * Figma pins both rows of the tab to 172px so the two lines read as one block
 * and a row of day filters lines up. `--fixed` is that width; `--sm` is the
 * quieter size the four column cards use.
 */
.se-tab--fixed .se-tab__row { min-width: 10.75rem; }

.se-tab--sm {
	gap: 2px;
	padding: 2px;
}

.se-tab--sm .se-tab__row { min-width: 5.375rem; }

.se-tab--sm .se-tab__top {
	padding: 0.15625rem 0.625rem;
	font-size: clamp(0.75rem, 0.73vw, 0.875rem);
}

.se-tab--sm .se-tab__bottom {
	padding: 0.125rem 0.625rem;
	font-size: clamp(0.5rem, 0.495vw, 0.59375rem);
}

.se-tab--inactive { background: var(--se-cocoa3); }
.se-tab--inactive .se-tab__row { background: var(--se-cocoa2); color: var(--se-text-soft); }
.se-tab--inactive:hover { background: var(--se-tab-edge); }
.se-tab--inactive:hover .se-tab__row { background: var(--se-red); color: #fff; }

/* -------------------------------------------------------------- index */

.se-index { position: relative; }

.se-index__row {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: baseline;
	gap: clamp(1rem, 2.08vw, 2.5rem);
	padding-block: clamp(0.75rem, 1.15vw, 1.375rem);
	color: var(--se-text);
	transition: color var(--se-dur) var(--se-ease);
}

.se-index__num {
	font-family: var(--se-font-mono);
	font-size: clamp(0.75rem, 0.73vw, 0.875rem);
	letter-spacing: 0.1em;
	color: var(--se-grey);
	transition: color var(--se-dur) var(--se-ease);
}

.se-index__name {
	font-family: var(--se-font-display);
	font-weight: 900;
	text-transform: uppercase;
	line-height: 0.92;
	letter-spacing: -0.01em;
	font-size: clamp(1.75rem, 3.65vw, 4.375rem);
}

.se-index__note {
	font-family: var(--se-font-body);
	font-size: clamp(0.875rem, 0.94vw, 1.125rem);
	color: var(--se-grey);
	text-align: right;
}

.se-index__row.is-active,
.se-index__row:hover,
.se-index__row:focus-visible {
	color: var(--se-red-hot);
}

/* QA-MOBILE: the numerals run 12 to 16px, under the large text threshold. */
.se-index__row.is-active .se-index__num { color: var(--se-red-text); }

.se-index__float {
	position: fixed;
	top: 0;
	left: 0;
	width: clamp(12rem, 18.75vw, 22.5rem);
	aspect-ratio: 4 / 3;
	pointer-events: none;
	opacity: 0;
	z-index: 40;
	overflow: hidden;
	will-change: transform;
}

.se-index__float img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity 260ms var(--se-ease);
}

.se-index__float img.is-on { opacity: 1; }

/* ---------------------------------------------------------- accordion */

.se-accordion__item + .se-accordion__item {
	margin-block-start: clamp(0.5rem, 0.83vw, 1rem);
}

.se-accordion__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1.5rem;
	width: 100%;
	padding: clamp(0.875rem, 1.25vw, 1.5rem) 0;
	background: none;
	border: 0;
	cursor: pointer;
	text-align: left;
	color: var(--se-text);
	font-family: var(--se-font-display);
	font-weight: 700;
	font-size: clamp(1.125rem, 1.56vw, 1.875rem);
	text-transform: uppercase;
	letter-spacing: 0.01em;
	line-height: 1.1;
	transition: color var(--se-dur) var(--se-ease);
}

.se-accordion__head:hover,
.se-accordion__item.is-open .se-accordion__head { color: var(--se-red-hot); }

.se-accordion__sign {
	flex: none;
	font-family: var(--se-font-mono);
	font-size: 1rem;
	transition: transform var(--se-dur) var(--se-ease);
}

.se-accordion__item.is-open .se-accordion__sign { transform: rotate(45deg); }

.se-accordion__panel {
	overflow: hidden;
	height: 0;
}

.se-accordion__inner {
	padding-block: 0 clamp(1rem, 1.56vw, 1.875rem);
	max-width: 52rem;
	font-family: var(--se-font-body);
	font-size: clamp(1rem, 1.15vw, 1.25rem);
	line-height: 1.6;
	color: var(--se-text-mute);
}

.se-accordion__inner p { margin: 0 0 1em; }
.se-accordion__inner p:last-child { margin-bottom: 0; }

html:not(.se-js) .se-accordion__panel,
.se-accordion__item.is-open .se-accordion__panel { height: auto; }

/* ------------------------------------------------------------- fields */

.se-field {
	display: block;
	margin-block-end: clamp(1rem, 1.46vw, 1.75rem);
}

.se-field__label {
	display: block;
	margin-block-end: 0.5rem;
	font-family: var(--se-font-mono);
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--se-grey);
	transition: color var(--se-dur) var(--se-ease);
}

.se-field input[type="text"],
.se-field input[type="email"],
.se-field input[type="tel"],
.se-field input[type="url"],
.se-field input[type="date"],
.se-field input[type="number"],
.se-field select,
.se-field textarea,
.se-field input[type="file"] {
	width: 100%;
	padding: clamp(0.75rem, 1.04vw, 1.25rem) clamp(0.875rem, 1.15vw, 1.375rem);
	background: var(--se-field);
	border: 0;
	border-radius: 0;
	color: var(--se-text);
	font-family: var(--se-font-body);
	font-size: clamp(0.9375rem, 1.04vw, 1.125rem);
	line-height: 1.4;
	transition: background-color var(--se-dur) var(--se-ease);
	appearance: none;
}

.se-field textarea { min-height: 9rem; resize: vertical; }

.se-field input:focus,
.se-field select:focus,
.se-field textarea:focus {
	background: var(--se-cocoa2);
	outline: 2px solid var(--se-red-hot);
	outline-offset: 2px;
}

.se-field:focus-within .se-field__label { color: var(--se-bone); }

.se-field--select { position: relative; }

.se-field--select::after {
	content: "";
	position: absolute;
	right: 1.25rem;
	bottom: 1.4rem;
	width: 0.5rem;
	height: 0.5rem;
	border-right: 2px solid var(--se-grey);
	border-bottom: 2px solid var(--se-grey);
	transform: rotate(45deg);
	pointer-events: none;
}

.se-check {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	font-family: var(--se-font-body);
	font-size: 1rem;
	color: var(--se-text-soft);
	cursor: pointer;
}

.se-check input[type="checkbox"],
.se-check input[type="radio"] {
	flex: none;
	width: 1.25rem;
	height: 1.25rem;
	margin: 0.15rem 0 0;
	background: var(--se-field);
	border: 0;
	appearance: none;
	cursor: pointer;
}

.se-check input:checked { background: var(--se-red); }

/* ------------------------------------------------------------- screen */

.se-screen {
	position: relative;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	border-radius: var(--se-screen-radius);
	background: var(--se-cocoa);
	isolation: isolate;
}

.se-screen--sm { border-radius: var(--se-screen-radius-sm); }

/* ----------------------------------------------------------- test card */

.se-testcard {
	position: relative;
	display: grid;
	grid-template-columns: repeat(8, 1fr);
	width: 100%;
	height: 100%;
	overflow: hidden;
	background: var(--se-black);
}

.se-testcard__bar:nth-child(1) { background: var(--se-bone); }
.se-testcard__bar:nth-child(2) { background: var(--se-peach); }
.se-testcard__bar:nth-child(3) { background: var(--se-copper); }
.se-testcard__bar:nth-child(4) { background: var(--se-red-hot); }
.se-testcard__bar:nth-child(5) { background: var(--se-red); }
.se-testcard__bar:nth-child(6) { background: var(--se-cocoa3); }
.se-testcard__bar:nth-child(7) { background: var(--se-cocoa2); }
.se-testcard__bar:nth-child(8) { background: var(--se-grey-dark); }

.se-testcard__scan {
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: 0.15;
	background-image: repeating-linear-gradient(
		to bottom,
		rgba(11, 10, 9, 0.85) 0,
		rgba(11, 10, 9, 0.85) 1px,
		rgba(11, 10, 9, 0) 1px,
		rgba(11, 10, 9, 0) 3px
	);
}

.se-testcard__plate {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	padding: 0.5rem 1rem;
	background: var(--se-black);
	color: var(--se-bone);
	font-family: var(--se-font-mono);
	font-size: clamp(0.6875rem, 0.73vw, 0.875rem);
	text-transform: uppercase;
	letter-spacing: 0.14em;
	white-space: nowrap;
}

/* ------------------------------------------------------------ marquee */

.se-marquee {
	position: relative;
	display: flex;
	width: 100%;
	overflow: hidden;
	background: var(--se-red);
	padding-block: clamp(0.9rem, 1.35vw, 1.62rem);
}

.se-marquee--black { background: var(--se-black); }
.se-marquee--night { background: var(--se-night); }
.se-marquee--bone { background: var(--se-bone); }
.se-marquee--bone .se-marquee__track { color: var(--se-black); }

.se-marquee__track {
	display: flex;
	flex: none;
	align-items: center;
	white-space: nowrap;
	color: var(--se-bone);
	font-family: var(--se-font-display);
	font-weight: 700;
	font-size: clamp(1.25rem, 1.77vw, 2.125rem);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	line-height: 1;
	will-change: transform;
	animation: se-marquee-run var(--se-marquee-dur, 40s) linear infinite;
}

.se-marquee__item {
	display: inline-flex;
	align-items: center;
	padding-inline: clamp(0.75rem, 1.15vw, 1.375rem);
}

.se-marquee__dot {
	display: inline-block;
	padding-inline: clamp(0.5rem, 0.78vw, 0.94rem);
	opacity: 0.7;
}

@keyframes se-marquee-run {
	from { transform: translate3d(0, 0, 0); }
	to   { transform: translate3d(-50%, 0, 0); }
}

.se-marquee.is-paused .se-marquee__track { animation-play-state: paused; }

/* --------------------------------------------------------- scroller */

.se-scroller {
	display: flex;
	gap: clamp(0.75rem, 1.25vw, 1.5rem);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.se-scroller::-webkit-scrollbar { display: none; }
.se-scroller > * { scroll-snap-align: start; flex: none; }
.se-scroller.is-dragging { scroll-snap-type: none; cursor: grabbing; }

/* ------------------------------------------------- reveal base states */

html.se-js:not(.se-editor) [data-se-reveal] { will-change: transform, opacity; }

html.se-js:not(.se-editor) [data-se-reveal="fade"]:not(.se-in) {
	opacity: 0;
	transform: translate3d(0, 24px, 0);
}

html.se-js:not(.se-editor) [data-se-reveal="clip"]:not(.se-in) {
	clip-path: inset(0 0 100% 0);
}

html.se-js:not(.se-editor) [data-se-reveal="stagger"]:not(.se-in) > * {
	opacity: 0;
	transform: translate3d(0, 24px, 0);
}

/* A line wrapper is block level everywhere, with JS off and in the editor too,
   so two sentences written as two lines never render on one line with nothing
   between them. Only the clip and the transform hint belong to the animation. */
.se-line-mask,
.se-line { display: block; }
html.se-js:not(.se-editor) .se-line-mask { overflow: hidden; }
html.se-js:not(.se-editor) .se-line { will-change: transform; }

@media (prefers-reduced-motion: reduce) {
	html.se-js [data-se-reveal],
	html.se-js [data-se-reveal] > *,
	html.se-js .se-line {
		opacity: 1 !important;
		transform: none !important;
		clip-path: none !important;
	}
	.se-marquee__track { animation: none; }
	/* Elementor sets `html { scroll-behavior: smooth }`: an anchor jump should
	   be instant for anyone who has asked for less movement. */
	html { scroll-behavior: auto !important; }
	*, *::before, *::after {
		transition-duration: 1ms !important;
		animation-duration: 1ms !important;
	}
}

/* --------------------------------------------------------- utilities */

.se-stack { display: flex; flex-direction: column; }
.se-row { display: flex; flex-wrap: wrap; }
.se-between { display: flex; justify-content: space-between; }
.se-hide-desktop { display: none; }

@media (max-width: 767px) {
	.se-hide-mobile { display: none !important; }
	.se-hide-desktop { display: revert; }
	.se-btn { width: 100%; }
	.se-button-row .se-btn { width: 100%; }
	.se-index__row { grid-template-columns: auto 1fr; }
	.se-index__note { grid-column: 1 / -1; text-align: left; }

	/*
	 * The Figma mobile homepage sets display type far larger relative to the
	 * screen than the desktop factors give: giant lines wrap and fill the
	 * width rather than sitting as one small line.
	 *
	 * The factors are capped so a ten character word still fits inside the
	 * 1.25rem side padding at 360. Barlow Condensed Black runs about 0.437em
	 * per capital, so the budget is (100vw - 2.5rem) / (chars * 0.437).
	 * Push a specific heading larger in your own widget CSS only when you know
	 * its longest word: anything wider is clipped, not scrolled, because the
	 * body hides horizontal overflow.
	 */
	.se-d1 { font-size: clamp(3rem, 22vw, 9rem); }
	.se-d1b { font-size: clamp(2.875rem, 21.5vw, 8.75rem); }
	.se-d2 { font-size: clamp(2.875rem, 21vw, 8.5rem); }
	/* QA-MOBILE lowered .se-d3 from 21vw. The budget above assumes 0.437em per
	   capital, but Barlow Condensed Black measures 0.505em on the widest run we
	   ship: "CAMPERVAN", the stay child page title, came out 373px wide inside a
	   350px box at 390 and lost its last letter to the body clip. 19vw leaves
	   9px of slack at 360 and 13px at 390 on that same word. */
	.se-d3 { font-size: clamp(2.75rem, 19vw, 8rem); }
	.se-d3b { font-size: clamp(2.625rem, 20vw, 7.5rem); }
	.se-d4 { font-size: clamp(2.375rem, 18vw, 6.5rem); }
	.se-d5 { font-size: clamp(2rem, 15vw, 5.5rem); }
	.se-h1 { font-size: clamp(1.875rem, 9.5vw, 3rem); }
	.se-h2 { font-size: clamp(1.625rem, 7.5vw, 2.5rem); }
	.se-h3 { font-size: clamp(1.375rem, 6vw, 2rem); }

	.se-index__name { font-size: clamp(1.75rem, 11vw, 3.5rem); }
}

/*
 * ---------------------------------------------------------------- touch
 *
 * QA-MOBILE. Every caps text link in the design is set on a single 16 to 20px
 * line, which is a beautiful 19px high target for a thumb. Under a coarse
 * pointer the box grows to 44px while the text itself stays exactly where the
 * frame puts it, because the link is centred inside the taller box. Nothing
 * here reaches a mouse: the query is hover:none and pointer:coarse, so desktop
 * and the Elementor editor are untouched.
 */
@media (hover: none) and (pointer: coarse) {
	.se-link,
	.se-faq-index__link,
	.se-legal__index-link,
	.se-gallery__filter,
	.se-footer__link,
	.se-onsite-links__item,
	.se-hero-film__sound,
	.sea-opt {
		display: inline-flex;
		align-items: center;
		min-height: 2.75rem;
	}

	/* Short words, "Stay", "FAQs", "All", give a 31px wide target however tall
	   the box is. The extra width is transparent and the text stays put. */
	.se-footer__link,
	.se-gallery__filter,
	.se-faq-index__link,
	.se-legal__index-link,
	.sea-opt {
		min-width: 2.75rem;
		justify-content: flex-start;
	}

	/* The Contact Form 7 submit renders at 43px from its own padding alone. */
	.se-btn,
	.se-form input[type="submit"],
	.wpcf7-submit {
		min-height: 2.75rem;
	}

	/* Stacked link lists lose their gap so the 44px rows meet edge to edge and
	   read as one deliberate column rather than widely spaced text. */
	.se-footer__list { gap: 0; }

	/* A row of chips that scrolls sideways: the taller box is the target, the
	   row keeps its height from the tallest chip. */
	.se-faq-index__list,
	.se-legal__index-list,
	.se-gallery__filters { align-items: center; }

	/* Checkboxes and radios in the forms are 20px squares. Grow the hit area
	   around the square with a pseudo element so the square itself, which is the
	   drawn control, keeps its size. */
	.se-form .se-checks .wpcf7-list-item label,
	.se-form .se-toggles .wpcf7-list-item label {
		position: relative;
		min-height: 2.75rem;
		display: flex;
		align-items: center;
	}

	.se-form .se-upload { min-height: 3.25rem; }
}