/**
 * Lead generation: funnel, popup widget and campaign landing page
 *
 * Plain CSS on purpose: the theme's style.css is compiled from res/sass but no
 * build tooling ships with the repo, so this module stays standalone.
 * Colours/typography mirror res/sass/base/_variables.scss.
 */

:root {
	--dw-coral: #FF616A;
	--dw-coral-soft: #FFF1F2;
	--dw-charcoal: #39464E;
	--dw-charcoal-muted: #6E8492;
	--dw-charcoal-faint: #A8B5BC;
	--dw-clay: #F9F7F5;
	/* TUI Sky Blue tints. 20% is the same value as $footer-bg, so the closing
	   CTA starts on the footer's own surface and deepens from there. 60% is
	   derived from the palette's 20% and 40% tints (base #6ECDF5). */
	--dw-sky-20: #E2F5FD;
	--dw-sky-40: #C6EAFB;
	--dw-sky-60: #A8E1F9;
	--dw-line: rgba(57, 70, 78, 0.14);
	--dw-shadow-soft: 0 10px 30px rgba(57, 70, 78, 0.10);
	--dw-shadow-softer: 0 6px 16px rgba(57, 70, 78, 0.08);
	--dw-shadow-lift: 0 30px 70px rgba(57, 70, 78, 0.28);
	--dw-radius: 18px;
	--dw-radius-lg: 28px;
}

[hidden] {
	display: none !important;
}


/* ---------------------------------------------------------------
 * Funnel
 * --------------------------------------------------------------- */

.dw-funnel {
	font-family: 'Ambit', sans-serif;
	color: var(--dw-charcoal);
	text-align: left;
}

.dw-funnel__progress {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 22px;
}

.dw-funnel__progress-track {
	flex: 1 1 auto;
	height: 4px;
	border-radius: 999px;
	background-color: var(--dw-clay);
	overflow: hidden;
}

.dw-funnel__progress-bar {
	display: block;
	height: 100%;
	border-radius: 999px;
	background-color: var(--dw-coral);
	transition: width 0.45s ease;
}

.dw-funnel__progress-label {
	flex: 0 0 auto;
	font-size: 11px;
	line-height: 1;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	font-weight: 700;
	color: var(--dw-charcoal-faint);
	white-space: nowrap;
}

.dw-step {
	display: none;
}

.dw-step.is-active {
	display: block;
	animation: dw-step-in 0.45s ease both;
}

@keyframes dw-step-in {
	from { opacity: 0; transform: translateY(12px); }
	to   { opacity: 1; transform: none; }
}

.dw-step__question {
	margin: 0 0 6px;
	font-size: 22px;
	line-height: 1.25;
	font-weight: 700;
	color: var(--dw-charcoal);
}

.dw-step__hint {
	margin: 0 0 20px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--dw-charcoal-muted);
}

/* Choices */
.dw-step__choices {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(146px, 1fr));
	gap: 12px;
}

.dw-choice {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 116px;
	padding: 18px 12px;
	border: 1px solid var(--dw-line);
	border-radius: var(--dw-radius);
	background-color: #fff;
	color: var(--dw-charcoal);
	font-family: 'Ambit', sans-serif;
	cursor: pointer;
	text-align: center;
	transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease, background-color 0.3s ease;
}

.dw-choice__icon {
	display: block;
	width: 34px;
	height: 34px;
}

.dw-choice__icon svg {
	width: 100%;
	height: 100%;
}

.dw-choice__icon svg * {
	stroke: var(--dw-coral);
}

.dw-choice__label {
	font-size: 14px;
	line-height: 1.3;
	font-weight: 600;
}

.dw-choice:hover,
.dw-choice:focus-visible {
	border-color: var(--dw-coral);
	box-shadow: var(--dw-shadow-softer);
	transform: translateY(-2px);
	outline: none;
}

.dw-choice.is-selected {
	border-color: var(--dw-coral);
	background-color: var(--dw-coral-soft);
	box-shadow: var(--dw-shadow-softer);
}

/* Step navigation */
.dw-step__nav {
	display: flex;
	align-items: center;
	gap: 18px;
	margin-top: 18px;
}

.dw-step__back,
.dw-step__skip {
	padding: 0;
	border: none;
	background: none;
	font-family: 'Ambit', sans-serif;
	font-size: 13px;
	font-weight: 600;
	color: var(--dw-charcoal-muted);
	cursor: pointer;
	transition: color 0.3s ease;
}

.dw-step__back:hover,
.dw-step__skip:hover {
	color: var(--dw-coral);
}

.dw-step__skip {
	margin-left: auto;
	text-decoration: underline;
}

/* Selection summary on the contact step */
.dw-step__summary {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-bottom: 20px;
}

.dw-step__summary:empty {
	display: none;
}

.dw-step__summary-title {
	font-size: 11px;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	font-weight: 700;
	color: var(--dw-charcoal-faint);
	width: 100%;
}

.dw-chip {
	display: inline-block;
	padding: 6px 12px;
	border-radius: 999px;
	background-color: var(--dw-clay);
	font-size: 12px;
	font-weight: 600;
	color: var(--dw-charcoal);
}

/* Fields */
.dw-field {
	margin-bottom: 14px;
}

.dw-field label {
	display: block;
	margin-bottom: 6px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.4px;
	color: var(--dw-charcoal-muted);
}

.dw-field input,
.dw-field textarea {
	width: 100%;
	padding: 12px 16px;
	border: 1px solid var(--dw-line);
	border-radius: 10px;
	background-color: #fff;
	font-family: 'Ambit', sans-serif;
	font-size: 15px;
	font-weight: 600;
	color: var(--dw-charcoal);
	transition: border-color 0.3s ease, box-shadow 0.3s ease;
	-webkit-appearance: none;
}

.dw-field textarea {
	resize: vertical;
	min-height: 84px;
}

.dw-field input:focus,
.dw-field textarea:focus {
	outline: none;
	border-color: var(--dw-coral);
	box-shadow: 0 0 0 3px rgba(255, 97, 106, 0.16);
}

.dw-field.has-error input,
.dw-field.has-error textarea {
	border-color: #E0313B;
}

.dw-field__error {
	display: block;
	margin-top: 5px;
	font-size: 12px;
	line-height: 1.4;
	color: #E0313B;
}

.dw-field__error:empty {
	display: none;
}

/* Consent */
.dw-consent {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 4px 0 20px;
	font-size: 12px;
	line-height: 1.6;
	color: var(--dw-charcoal-muted);
	cursor: pointer;
}

/* Custom box: the theme sets a global input { -webkit-appearance: none },
   which would render the native checkbox invisible. */
.dw-consent input {
	flex: 0 0 auto;
	position: relative;
	width: 18px;
	height: 18px;
	margin: 2px 0 0;
	border: 1px solid var(--dw-charcoal-faint);
	border-radius: 5px;
	background-color: #fff;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
	transition: background-color 0.2s ease, border-color 0.2s ease;
}

.dw-consent input:checked {
	border-color: var(--dw-coral);
	background-color: var(--dw-coral);
}

.dw-consent input:checked:after {
	content: '';
	position: absolute;
	left: 5px;
	top: 2px;
	width: 5px;
	height: 9px;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	transform: rotate(40deg);
}

.dw-consent input:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px rgba(255, 97, 106, 0.22);
}

.dw-consent.has-error input {
	border-color: #E0313B;
}

.dw-consent > span:first-of-type {
	flex: 1 1 200px;
}

.dw-consent a {
	color: var(--dw-coral);
	text-decoration: underline;
}

.dw-consent .dw-field__error {
	flex: 1 1 100%;
}

.dw-consent.has-error > span:first-of-type {
	color: #E0313B;
}

/* Honeypot */
.dw-funnel__trap {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Submit */
.dw-funnel__submit {
	width: 100%;
	padding: 16px 26px;
	font-size: 15px;
}

.dw-funnel__submit[disabled] {
	opacity: 0.65;
	cursor: default;
}

.dw-funnel__note {
	margin: 12px 0 0;
	font-size: 12px;
	line-height: 1.5;
	text-align: center;
	color: var(--dw-charcoal-faint);
}

.dw-funnel__formerror {
	margin: 10px 0 0;
	font-size: 13px;
	line-height: 1.5;
	text-align: center;
	color: #E0313B;
}

.dw-funnel__formerror:empty {
	display: none;
}

/* Success */
.dw-funnel__success {
	text-align: center;
	padding: 10px 0;
	animation: dw-step-in 0.5s ease both;
}

.dw-funnel__success-icon {
	display: inline-block;
	width: 56px;
	height: 56px;
	margin-bottom: 18px;
}

.dw-funnel__success-icon svg {
	width: 100%;
	height: 100%;
}

.dw-funnel__success-icon svg * {
	stroke: var(--dw-coral);
}

.dw-funnel__success-headline {
	margin: 0 0 10px;
	font-size: 26px;
	line-height: 1.2;
	font-weight: 700;
	color: var(--dw-coral);
}

.dw-funnel__success-text {
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--dw-charcoal-muted);
}


/* ---------------------------------------------------------------
 * Popup widget
 * --------------------------------------------------------------- */

body.dw-lead-open {
	overflow: hidden;
}

.dw-lead-popup {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 30px;
}

.dw-lead-popup__backdrop {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(57, 70, 78, 0.72);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	opacity: 0;
	transition: opacity 0.35s ease;
	cursor: pointer;
}

.dw-lead-popup__dialog {
	position: relative;
	display: flex;
	width: 100%;
	max-width: 940px;
	max-height: calc(100vh - 60px);
	border-radius: var(--dw-radius-lg);
	background-color: #fff;
	box-shadow: var(--dw-shadow-lift);
	overflow: hidden;
	opacity: 0;
	transform: translateY(28px) scale(0.97);
	transition: opacity 0.4s ease, transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1);
}

body.dw-lead-visible .dw-lead-popup__backdrop {
	opacity: 1;
}

body.dw-lead-visible .dw-lead-popup__dialog {
	opacity: 1;
	transform: none;
}

/* Pitch column */
.dw-lead-popup__aside {
	flex: 0 0 42%;
	position: relative;
	padding: 44px 36px;
	background-color: var(--dw-charcoal);
	background-image: radial-gradient(circle at 8% 6%, rgba(255, 97, 106, 0.4) 0%, rgba(255, 97, 106, 0) 62%);
	color: #fff;
	overflow-y: auto;
}

.dw-lead-popup__eyebrow {
	display: inline-block;
	margin-bottom: 16px;
	padding: 6px 12px;
	border-radius: 999px;
	background-color: rgba(255, 255, 255, 0.14);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1.4px;
	text-transform: uppercase;
}

.dw-lead-popup__headline {
	margin: 0 0 14px;
	font-size: 30px;
	line-height: 1.14;
	letter-spacing: -0.3px;
	font-weight: 700;
	color: #fff;
}

.dw-lead-popup__text {
	margin: 0 0 22px;
	font-size: 15px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.82);
}

.dw-lead-popup__usps {
	margin: 0 0 22px;
	padding: 0;
	list-style: none;
}

.dw-lead-popup__usps li {
	position: relative;
	margin-bottom: 10px;
	padding-left: 26px;
	font-size: 14px;
	line-height: 1.45;
	font-weight: 600;
}

.dw-lead-popup__usps li:before {
	content: '';
	position: absolute;
	left: 0;
	top: 5px;
	width: 14px;
	height: 8px;
	border-left: 2px solid var(--dw-coral);
	border-bottom: 2px solid var(--dw-coral);
	transform: rotate(-45deg);
}

.dw-lead-popup__incentive {
	margin: 0;
	padding-top: 18px;
	border-top: 1px solid rgba(255, 255, 255, 0.18);
	font-size: 13px;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.7);
}

/* Funnel column */
.dw-lead-popup__main {
	flex: 1 1 auto;
	padding: 44px 40px;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

/* Keep the step counter clear of the close button */
.dw-lead-popup__main .dw-funnel__progress {
	padding-right: 46px;
}

/* Close */
.dw-lead-popup__close {
	position: absolute;
	right: 18px;
	top: 18px;
	width: 42px;
	height: 42px;
	padding: 0;
	border: none;
	border-radius: 50%;
	background-color: var(--dw-coral);
	box-shadow: var(--dw-shadow-softer);
	cursor: pointer;
	z-index: 2;
	transition: background-color 0.3s ease, transform 0.3s ease;
}

.dw-lead-popup__close:before,
.dw-lead-popup__close:after {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	width: 18px;
	height: 2px;
	margin-left: -9px;
	margin-top: -1px;
	background-color: #fff;
	transform: rotate(45deg);
}

.dw-lead-popup__close:after {
	transform: rotate(-45deg);
}

.dw-lead-popup__close:hover {
	background-color: var(--dw-charcoal);
	transform: rotate(90deg);
}

/* Launcher */
.dw-lead-launcher {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 99990;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 22px 14px 18px;
	border: none;
	border-radius: 999px;
	background-color: var(--dw-coral);
	color: #fff;
	font-family: 'Ambit', sans-serif;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
	box-shadow: var(--dw-shadow-soft);
	transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease, opacity 0.3s ease;
}

.dw-lead-launcher__icon {
	display: block;
	width: 22px;
	height: 22px;
}

.dw-lead-launcher__icon svg {
	width: 100%;
	height: 100%;
}

.dw-lead-launcher__icon svg * {
	stroke: #fff;
}

.dw-lead-launcher:hover {
	background-color: var(--dw-charcoal);
	transform: translateY(-2px);
	box-shadow: var(--dw-shadow-lift);
}

body.dw-lead-open .dw-lead-launcher {
	opacity: 0;
	pointer-events: none;
}


/* ---------------------------------------------------------------
 * Landing page: hero
 * --------------------------------------------------------------- */

.dw-lp-hero {
	position: relative;
	overflow: hidden;
	background-color: var(--dw-charcoal);
}

.dw-lp-hero__bg,
.dw-lp-hero__scrim {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.dw-lp-hero__bg {
	background-position: center;
	background-size: cover;
}

/* Light parallax feel without the JS plugin (skipped on touch: it janks) */
@media screen and (min-width: 1025px) and (hover: hover) {
	.dw-lp-hero__bg {
		background-attachment: fixed;
	}
}

.dw-lp-hero__scrim {
	background-image: linear-gradient(105deg, rgba(57, 70, 78, 0.92) 0%, rgba(57, 70, 78, 0.7) 45%, rgba(57, 70, 78, 0.3) 100%);
}

.dw-lp-hero__inner {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: 1.05fr 0.95fr;
	gap: 70px;
	align-items: center;
	width: 1340px;
	max-width: 100%;
	margin: 0 auto;
	/* Top padding clears the theme's fixed logo and menu icon (top: 170px + 59px) */
	padding: 250px 20px 280px;
}

.dw-lp-hero__eyebrow {
	display: inline-block;
	margin-bottom: 18px;
	padding: 7px 14px;
	border-radius: 999px;
	background-color: rgba(255, 255, 255, 0.14);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: #fff;
}

.dw-lp-hero__headline {
	margin: 0 0 20px;
	font-size: 58px;
	line-height: 1.06;
	letter-spacing: -0.5px;
	font-weight: 700;
	color: #fff;
}

.dw-lp-hero__subline {
	margin: 0 0 28px;
	max-width: 645px;
	font-size: 20px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.88);
}

.dw-lp-hero__trust {
	margin: 0 0 32px;
	padding: 0;
	list-style: none;
}

.dw-lp-hero__trust li {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin-bottom: 12px;
	font-size: 15px;
	line-height: 1.5;
	font-weight: 600;
	color: #fff;
}

.dw-lp-hero__trust-icon {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	margin-top: 3px;
}

.dw-lp-hero__trust-icon svg {
	width: 100%;
	height: 100%;
}

.dw-lp-hero__trust-icon svg * {
	stroke: var(--dw-coral);
}

.dw-lp-hero__cta {
	padding: 17px 34px;
	font-size: 15px;
}

/* Stars + rating */
.dw-stars {
	display: inline-flex;
	align-items: center;
	gap: 3px;
}

.dw-star {
	display: block;
	width: 17px;
	height: 17px;
}

.dw-star svg {
	width: 100%;
	height: 100%;
}

.dw-star.is-full svg * {
	fill: var(--dw-coral);
	stroke: var(--dw-coral);
}

.dw-star.is-empty svg * {
	fill: none;
	stroke: var(--dw-charcoal-faint);
}

.dw-rating {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px 12px;
	font-size: 14px;
	line-height: 1.4;
}

.dw-rating__value {
	font-weight: 700;
}

.dw-rating__meta a {
	color: inherit;
	text-decoration: underline;
}

.dw-rating--hero {
	margin: 0 0 26px;
	color: #fff;
}

.dw-rating--hero .dw-rating__meta,
.dw-rating--hero .dw-rating__place {
	color: rgba(255, 255, 255, 0.8);
}

/* Divider between the review count and the shop location */
.dw-rating--hero .dw-rating__place {
	position: relative;
	padding-left: 13px;
}

.dw-rating--hero .dw-rating__place:before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	width: 4px;
	height: 4px;
	margin-top: -2px;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.45);
}

/* Funnel card */
.dw-lp-hero__card {
	scroll-margin-top: 30px;
}

.dw-lp-card {
	position: relative;
	padding: 38px 34px 32px;
	border-radius: var(--dw-radius-lg);
	background-color: #fff;
	box-shadow: var(--dw-shadow-lift);
}

.dw-lp-card__badge {
	position: absolute;
	left: 34px;
	top: -14px;
	padding: 8px 16px;
	border-radius: 999px;
	background-color: var(--dw-coral);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	box-shadow: var(--dw-shadow-softer);
}

.dw-lp-card__title {
	margin: 0 0 20px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	color: var(--dw-charcoal-faint);
}

/* Brand curve at the bottom of the hero */
.dw-lp-hero__mask {
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 100%;
	/* flatter than the theme default (14.6354%), the svg carries
	   preserveAspectRatio="none" and squashes with the box */
	padding-top: 11.5%;
	/* above the following section, which sits at z-index 5 */
	z-index: 6;
}

/* The wave is the transition into the section below, so it has to be that
   section's colour instead of white. Class selectors from the svg's own
   <style> block are beaten by these two-class selectors. */
.dw-lp-hero__mask .mask-header-cls-3 {
	fill: var(--dw-clay);
}

.dw-lp-hero__mask .mask-header-cls-1 {
	fill: #EFEBE7;
}

.dw-lp-hero__mask .mask-header-cls-2 {
	fill: #E4DFDA;
}

.dw-lp-hero__mask > svg {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	/* height:100% is what makes the flatter box work. Without it the svg keeps
	   its own 14.6% aspect ratio, hangs out of the shorter box, and the excess
	   gets clipped by the hero's overflow:hidden while the next section paints
	   over it. preserveAspectRatio="none" lets it squash cleanly. */
	height: 100%;
}

.dw-lp-hero__mask:after {
	content: '';
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 100%;
	height: 2px;
	background-color: var(--dw-clay);
}


/* ---------------------------------------------------------------
 * Landing page: sections
 * --------------------------------------------------------------- */

.dw-lp-section .content-wrapper {
	background-color: #fff;
	/* room to breathe: the sections sat too tight against each other */
	padding-top: 72px;
	padding-bottom: 104px;
}

.dw-lp-section .content {
	width: 1240px;
	max-width: 100%;
	margin: 0 auto;
	padding: 30px 20px 0;
	text-align: center;
}

.dw-lp-section__title {
	margin: 0 0 40px;
	font-size: 40px;
	line-height: 1.1;
	letter-spacing: -0.3px;
	font-weight: 700;
	color: var(--dw-coral);
}

/* Benefits */
.dw-lp-benefits__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
}

.dw-lp-benefit__icon {
	width: 96px;
	height: 96px;
	margin: 0 auto 24px;
	padding: 20px;
	border-radius: 50%;
	background-color: #fff;
	box-shadow: var(--dw-shadow-softer);
}

.dw-lp-benefit__icon svg {
	width: 100%;
	height: 100%;
}

.dw-lp-benefit__icon svg * {
	stroke: var(--dw-coral);
}

.dw-lp-benefit__title {
	margin: 0 0 14px;
	font-size: 18px;
	line-height: 1.3;
	text-transform: uppercase;
	font-weight: 700;
	color: var(--dw-charcoal);
}

.dw-lp-benefit__text {
	max-width: 360px;
	margin: 0 auto;
	font-size: 15px;
	line-height: 1.6;
	color: var(--dw-charcoal-muted);
}

/* How it works */
.dw-lp-steps .content-wrapper {
	background-color: var(--dw-clay);
}

.dw-lp-steps__list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
	margin: 0 0 44px;
	padding: 0;
	list-style: none;
	counter-reset: none;
}

.dw-lp-step__number {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	margin: 0 auto 20px;
	border-radius: 50%;
	background-color: var(--dw-coral);
	color: #fff;
	font-size: 20px;
	font-weight: 700;
	box-shadow: var(--dw-shadow-softer);
}

.dw-lp-step__title {
	margin: 0 0 12px;
	font-size: 18px;
	line-height: 1.3;
	text-transform: uppercase;
	font-weight: 700;
	color: var(--dw-charcoal);
}

.dw-lp-step__text {
	max-width: 320px;
	margin: 0 auto;
	font-size: 15px;
	line-height: 1.6;
	color: var(--dw-charcoal-muted);
}

/* FAQ */
.dw-lp-faq__list {
	max-width: 820px;
	margin: 0 auto;
	text-align: left;
}

.dw-lp-faq__item {
	margin-bottom: 12px;
	border-radius: var(--dw-radius);
	background-color: var(--dw-clay);
	overflow: hidden;
}

.dw-lp-faq__question {
	position: relative;
	padding: 20px 62px 20px 24px;
	font-size: 16px;
	line-height: 1.4;
	font-weight: 700;
	color: var(--dw-charcoal);
	cursor: pointer;
	list-style: none;
	transition: color 0.3s ease;
}

.dw-lp-faq__question::-webkit-details-marker {
	display: none;
}

.dw-lp-faq__question:hover {
	color: var(--dw-coral);
}

.dw-lp-faq__question:after {
	content: '';
	position: absolute;
	right: 24px;
	top: 50%;
	width: 14px;
	height: 14px;
	margin-top: -7px;
	background-image: linear-gradient(var(--dw-coral), var(--dw-coral)), linear-gradient(var(--dw-coral), var(--dw-coral));
	background-size: 14px 2px, 2px 14px;
	background-position: center, center;
	background-repeat: no-repeat;
	transition: background-size 0.3s ease;
}

/* Plus turns into a minus when the answer is open */
.dw-lp-faq__item[open] .dw-lp-faq__question:after {
	background-size: 14px 2px, 2px 0;
}

.dw-lp-faq__answer {
	padding: 0 24px 22px;
	font-size: 15px;
	line-height: 1.7;
	color: var(--dw-charcoal-muted);
}

.dw-lp-faq__answer p {
	margin: 0 0 12px;
}

.dw-lp-faq__answer p:last-child {
	margin-bottom: 0;
}

/* Section intro (under a section title) */
.dw-lp-section__intro {
	max-width: 620px;
	margin: -22px auto 40px;
	font-size: 17px;
	line-height: 1.6;
	color: var(--dw-charcoal-muted);
}

/* ---------------------------------------------------------------
 * USP: same conditions + a real person
 * --------------------------------------------------------------- */

.dw-lp-usp .content-wrapper {
	background-color: var(--dw-clay);
}

.dw-lp-usp__grid {
	display: grid;
	grid-template-columns: 1.2fr 0.8fr;
	gap: 60px;
	align-items: center;
	text-align: left;
}

.dw-lp-usp__eyebrow {
	display: inline-block;
	margin-bottom: 14px;
	padding: 7px 14px;
	border-radius: 999px;
	background-color: #fff;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: var(--dw-coral);
}

.dw-lp-usp__headline {
	margin: 0 0 16px;
	font-size: 38px;
	line-height: 1.12;
	letter-spacing: -0.3px;
	font-weight: 700;
	color: var(--dw-charcoal);
}

.dw-lp-usp__text {
	margin: 0 0 30px;
	font-size: 18px;
	line-height: 1.6;
	color: var(--dw-charcoal-muted);
}

.dw-lp-usp__points {
	margin: 0 0 34px;
	padding: 0;
	list-style: none;
}

.dw-lp-usp__point {
	display: flex;
	align-items: flex-start;
	gap: 18px;
	padding: 20px 0;
	border-top: 1px solid var(--dw-line);
	font-size: 15px;
	line-height: 1.6;
	color: var(--dw-charcoal-muted);
}

.dw-lp-usp__point:last-child {
	border-bottom: 1px solid var(--dw-line);
}

.dw-lp-usp__point-icon {
	flex: 0 0 auto;
	width: 34px;
	height: 34px;
}

.dw-lp-usp__point-icon svg {
	width: 100%;
	height: 100%;
}

.dw-lp-usp__point-icon svg * {
	stroke: var(--dw-coral);
}

.dw-lp-usp__point-body strong {
	display: block;
	margin-bottom: 3px;
	font-size: 16px;
	font-weight: 700;
	color: var(--dw-charcoal);
}

/* Clean circle instead of the old wavy shapes */
.dw-lp-circle {
	width: 100%;
	max-width: 420px;
	margin: 0 auto;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	background-position: center;
	background-size: cover;
	box-shadow: var(--dw-shadow-soft);
}

/* Fallback for browsers without aspect-ratio */
@supports not (aspect-ratio: 1 / 1) {
	.dw-lp-circle {
		height: 0;
		padding-bottom: 100%;
	}
}

/* ---------------------------------------------------------------
 * Image band
 * --------------------------------------------------------------- */

.dw-lp-band {
	position: relative;
	height: 380px;
	overflow: hidden;
	/* The edges are the hero's wave now (.dw-lp-band__mask), not a corner radius.
	   Each wave paints in the colour of the section it runs into, so the band
	   declares its two neighbours here and the modifiers below correct the
	   exceptions. Default either side is the standard white section. */
	--dw-band-edge-top: #fff;
	--dw-band-edge-bottom: #fff;
	/* The band is the timeline for the drift below: progress runs from the moment
	   it enters the viewport to the moment it leaves. */
	view-timeline-name: --dw-band;
	view-timeline-axis: block;
}

/* Band 2 runs into the team block, which is clay rather than white. */
.dw-lp-band--2 {
	--dw-band-edge-bottom: var(--dw-clay);
}

/* The waves reach into the band and carry the transition themselves, so the
   band butts up against its neighbours instead of tucking under them. */
.dw-lp-band + .section,
.section + .dw-lp-band {
	margin-top: 0;
}

/* ---- the hero transition, reused on both band edges ---- */

.dw-lp-band__mask {
	position: absolute;
	left: 0;
	width: 100%;
	/* The hero spends 11.5% of the viewport on this arc. A band is a fixed height
	   and carries two of them, so the box is much shallower here: the svg is
	   preserveAspectRatio="none", so squashing the box flattens the bend. Kept
	   low deliberately — above roughly 40px the two arcs start reading as a lens
	   rather than a soft edge. The bottom edge overrides this with a bit more. */
	height: clamp(16px, 1.9vw, 28px);
	z-index: 1;
}

.dw-lp-band__mask > svg {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	/* Same trick as the hero: preserveAspectRatio="none" plus height:100% lets
	   the wave squash into the flatter box instead of overflowing and clipping. */
	height: 100%;
}

.dw-lp-band__mask--bottom {
	bottom: -1px;
	/* deeper than the top: the band settles into the section below rather than
	   sitting symmetrically between the two, which is what made it read as a lens */
	height: clamp(22px, 2.6vw, 38px);
}

/* The same wave mirrored, so the band opens the way the hero closes. */
.dw-lp-band__mask--top {
	top: -1px;
	transform: scaleY(-1);
}

/* The front path takes the neighbouring section's colour; the two backing waves
   keep the hero's tints. Two-class selectors beat the svg's own <style> block. */
.dw-lp-band__mask--top .mask-header-cls-3 {
	fill: var(--dw-band-edge-top);
}

.dw-lp-band__mask--bottom .mask-header-cls-3 {
	fill: var(--dw-band-edge-bottom);
}

.dw-lp-band__mask .mask-header-cls-1 {
	fill: #EFEBE7;
}

.dw-lp-band__mask .mask-header-cls-2 {
	fill: #E4DFDA;
}

/* Seals the hairline the browser leaves between wave and section on some
   zoom levels, exactly as .dw-lp-hero__mask:after does. */
.dw-lp-band__mask:after {
	content: '';
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 100%;
	height: 2px;
}

.dw-lp-band__mask--top:after {
	background-color: var(--dw-band-edge-top);
}

.dw-lp-band__mask--bottom:after {
	background-color: var(--dw-band-edge-bottom);
}

.dw-lp-band__image {
	position: absolute;
	left: 0;
	/* Overscanned: taller than the band and lifted, so the drift below always has
	   frame to spare and never exposes an edge. 20% of 180% is 36% of the band,
	   against 40% of slack at each end. Raising the drift means raising this too.
	   The source photos are 1920x1250 or taller, so cover still crops vertically
	   at this height and loses nothing off the sides. */
	top: -40%;
	width: 100%;
	height: 180%;
	/* the two urls are set inline per band; the media query below picks the
	   smaller file rather than making phones download the 2560px one */
	background-image: var(--dw-band-img);
	background-position: center;
	background-size: cover;
}

/* The photo drifts against the scroll while the band crosses the viewport. Driven
   by the band's view timeline, so it runs on the compositor with no scroll
   handler at all. Browsers without scroll-driven animations get the static image
   and a small rAF fallback in leadgen.js. */
/* Swap 'linear both' for 'linear both reverse' on the rule below to make the photo
   lead the scroll instead of lagging it. */
@keyframes dw-band-drift {
	from {
		transform: translate3d(0, -20%, 0);
	}
	to {
		transform: translate3d(0, 20%, 0);
	}
}

@media (prefers-reduced-motion: no-preference) {
	@supports (animation-timeline: view()) {
		.dw-lp-band__image {
			animation: dw-band-drift linear both;
			animation-timeline: --dw-band;
			animation-range: cover 0% cover 100%;
		}
	}
}

.dw-lp-band__inner {
	position: relative;
	/* above both waves, which sit at z-index 1 */
	z-index: 2;
	display: flex;
	align-items: flex-end;
	width: 1240px;
	max-width: 100%;
	height: 100%;
	margin: 0 auto;
	/* the bottom wave is up to 38px tall and the claim has to clear it */
	padding: 0 20px 56px;
}

.dw-lp-band__claim {
	max-width: 620px;
	margin: 0;
	padding: 18px 24px;
	/* was 0.72 and hard to read over a busy photo */
	background-color: rgba(57, 70, 78, 0.88);
	backdrop-filter: blur(2px);
	font-size: 22px;
	line-height: 1.35;
	font-weight: 700;
	color: #fff;
}

/* ---------------------------------------------------------------
 * Inspiration carousel
 * --------------------------------------------------------------- */

.dw-lp-inspiration__slider {
	position: relative;
	text-align: left;
}

.dw-lp-teaser {
	display: block;
	width: 100%;
	padding: 0;
	border: none;
	border-radius: var(--dw-radius);
	background-color: #fff;
	box-shadow: var(--dw-shadow-softer);
	overflow: hidden;
	cursor: pointer;
	text-align: left;
	font-family: 'Ambit', sans-serif;
	transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.dw-lp-teaser:hover {
	transform: translateY(-3px);
	box-shadow: var(--dw-shadow-soft);
}

.dw-lp-teaser__image {
	display: block;
	height: 210px;
	background-position: center;
	background-size: cover;
	transition: transform 0.6s ease;
}

.dw-lp-teaser:hover .dw-lp-teaser__image {
	transform: scale(1.04);
}

/* Slide without a photo yet: a quiet placeholder instead of a wrong image */
.dw-lp-teaser__image--pending {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--dw-clay);
	box-shadow: inset 0 -1px 0 var(--dw-line);
}

.dw-lp-teaser__pending {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--dw-charcoal-faint);
}

.dw-lp-teaser__pending .icon,
.dw-lp-teaser__pending svg {
	width: 22px;
	height: 22px;
	display: block;
	fill: var(--dw-charcoal-faint);
}

.dw-lp-teaser:hover .dw-lp-teaser__image--pending {
	transform: none;
}

.dw-lp-teaser__body {
	display: block;
	padding: 22px 24px 24px;
}

.dw-lp-teaser__title {
	display: block;
	margin-bottom: 8px;
	font-size: 19px;
	line-height: 1.25;
	font-weight: 700;
	color: var(--dw-charcoal);
}

.dw-lp-teaser__text {
	display: block;
	margin-bottom: 16px;
	font-size: 15px;
	line-height: 1.55;
	color: var(--dw-charcoal-muted);
}

.dw-lp-teaser__more {
	display: inline-block;
	font-size: 14px;
	font-weight: 700;
	color: var(--dw-coral);
}

.dw-lp-teaser__more:after {
	content: '';
	display: inline-block;
	width: 7px;
	height: 7px;
	margin-left: 8px;
	border-top: 2px solid var(--dw-coral);
	border-right: 2px solid var(--dw-coral);
	transform: rotate(45deg) translateY(-1px);
	transition: margin-left 0.3s ease;
}

.dw-lp-teaser:hover .dw-lp-teaser__more:after {
	margin-left: 12px;
}

.dw-lp-inspiration__nav {
	display: flex;
	justify-content: center;
	gap: 14px;
	margin-top: 30px;
}

.dw-lp-inspiration__arrow {
	position: relative;
	width: 48px;
	height: 48px;
	padding: 0;
	border: 1px solid var(--dw-line);
	border-radius: 50%;
	background-color: #fff;
	cursor: pointer;
	transition: background-color 0.3s ease, border-color 0.3s ease;
}

.dw-lp-inspiration__arrow:before {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	width: 9px;
	height: 9px;
	margin: -5px 0 0 -6px;
	border-top: 2px solid var(--dw-coral);
	border-right: 2px solid var(--dw-coral);
	transform: rotate(45deg);
	transition: border-color 0.3s ease;
}

.dw-lp-inspiration__arrow--prev:before {
	margin-left: -3px;
	transform: rotate(-135deg);
}

.dw-lp-inspiration__arrow:hover {
	background-color: var(--dw-coral);
	border-color: var(--dw-coral);
}

.dw-lp-inspiration__arrow:hover:before {
	border-color: #fff;
}

.dw-lp-inspiration__arrow.swiper-button-disabled {
	opacity: 0.35;
	cursor: default;
}

/* ---------------------------------------------------------------
 * Team
 * --------------------------------------------------------------- */

.dw-lp-team .content-wrapper {
	background-color: var(--dw-clay);
}

.dw-lp-team__grid {
	display: grid;
	/* auto-fit instead of a fixed three, so three or four people both sit in
	   one row without an orphan */
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 40px;
	max-width: 1040px;
	margin: 0 auto 44px;
}

.dw-lp-member__photo {
	width: 190px;
	max-width: 100%;
	margin: 0 auto 20px;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	background-color: #fff;
	background-position: center top;
	background-size: cover;
	box-shadow: var(--dw-shadow-softer);
}

@supports not (aspect-ratio: 1 / 1) {
	.dw-lp-member__photo {
		height: 190px;
	}
}

/* Initials while the real portraits are pending */
.dw-lp-member__photo--empty {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	color: var(--dw-coral);
	font-size: 44px;
	font-weight: 700;
	letter-spacing: 1px;
}

.dw-lp-member__name {
	margin: 0 0 4px;
	font-size: 19px;
	line-height: 1.2;
	font-weight: 700;
	color: var(--dw-charcoal);
}

.dw-lp-member__role {
	margin: 0;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	color: var(--dw-charcoal-faint);
}

/* Opening hours inside the location card */
.dw-lp-location__hours-label {
	display: block;
	margin-bottom: 6px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	color: var(--dw-charcoal-faint);
}

.dw-lp-hours {
	display: block;
	max-width: 280px;
}

.dw-lp-hours__row {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 3px 0;
	font-size: 15px;
}

.dw-lp-hours__day {
	color: var(--dw-charcoal-muted);
}

.dw-lp-hours__time {
	font-weight: 700;
}

/* Topic chip inside the funnel */
.dw-funnel__topic {
	margin: 0 0 16px;
	padding: 10px 14px;
	border-radius: 10px;
	background-color: var(--dw-coral-soft);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--dw-coral);
}

/* Location */
.dw-lp-location__grid {
	display: grid;
	/* No max-width: this fills the section container like .dw-lp-usp__grid and
	   .dw-lp-benefits__grid do, so the section lines up with the rest of the page.
	   The card is pinned to a comfortable reading width and every pixel the
	   container gains beyond that goes to the map. */
	grid-template-columns: minmax(320px, 460px) 1fr;
	gap: 30px;
	margin: 0 auto;
	text-align: left;
}

.dw-lp-location__card {
	padding: 38px 34px;
	border-radius: var(--dw-radius-lg);
	background-color: var(--dw-clay);
}

.dw-lp-location__name {
	margin: 0 0 4px;
	font-size: 20px;
	line-height: 1.25;
	font-weight: 700;
	color: var(--dw-charcoal);
}

.dw-lp-location__type {
	margin: 0 0 24px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	color: var(--dw-charcoal-faint);
}

.dw-lp-location__list {
	margin: 0 0 28px;
	padding: 0;
	list-style: none;
}

.dw-lp-location__list li {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	margin-bottom: 14px;
	font-size: 16px;
	line-height: 1.5;
	color: var(--dw-charcoal);
}

.dw-lp-location__list li:last-child {
	margin-bottom: 0;
}

.dw-lp-location__list a {
	color: var(--dw-charcoal);
	font-weight: 700;
}

.dw-lp-location__list a:hover {
	color: var(--dw-coral);
}

.dw-lp-location__icon {
	flex: 0 0 auto;
	width: 20px;
	height: 20px;
	margin-top: 2px;
}

.dw-lp-location__icon svg {
	width: 100%;
	height: 100%;
}

.dw-lp-location__icon svg * {
	stroke: var(--dw-coral);
}

.dw-lp-location__actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 20px;
}

.dw-lp-location__link {
	font-size: 14px;
	font-weight: 600;
	color: var(--dw-charcoal-muted);
	text-decoration: underline;
}

.dw-lp-location__link:hover {
	color: var(--dw-coral);
}

/* Rating panel */








/* Closing CTA */
.dw-lp-cta__box {
	padding: 60px 50px;
	border-radius: var(--dw-radius-lg);
	background-color: var(--dw-sky-20);
	/* Diagonal wash across the two Sky Blue tints: it keeps the footer's colour
	   at the top left and deepens towards the bottom right. */
	background-image: linear-gradient(135deg, var(--dw-sky-20) 0%, var(--dw-sky-60) 100%);
	box-shadow: var(--dw-shadow-soft);
}

.dw-lp-cta__title {
	margin: 0 0 14px;
	font-size: 36px;
	line-height: 1.12;
	font-weight: 700;
	color: var(--dw-charcoal);
}

.dw-lp-cta__text {
	max-width: 560px;
	margin: 0 auto 30px;
	font-size: 17px;
	line-height: 1.6;
	color: var(--dw-charcoal);
}

.dw-lp-cta__actions {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 24px;
}

.dw-lp-cta__phone {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 16px;
	font-weight: 700;
	color: var(--dw-charcoal);
}

.dw-lp-cta__phone:hover {
	color: var(--dw-coral);
}

.dw-lp-cta__phone-icon {
	display: block;
	width: 18px;
	height: 18px;
}

.dw-lp-cta__phone-icon svg {
	width: 100%;
	height: 100%;
}

/* This SVG is fill-based and ships black — follow the link colour instead */
.dw-lp-cta__phone-icon svg * {
	fill: currentColor;
}

/* Sticky mobile CTA */
.dw-lp-sticky {
	display: none;
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	z-index: 99980;
	padding: 14px 20px;
	background-color: var(--dw-coral);
	color: #fff;
	text-align: center;
	box-shadow: 0 -8px 24px rgba(57, 70, 78, 0.18);
	transition: transform 0.35s ease;
}

.dw-lp-sticky:hover {
	color: #fff;
}

.dw-lp-sticky.is-hidden {
	transform: translateY(110%);
}

.dw-lp-sticky__label {
	display: block;
	font-size: 15px;
	font-weight: 700;
}

.dw-lp-sticky__hint {
	display: block;
	font-size: 11px;
	letter-spacing: 0.6px;
	text-transform: uppercase;
	opacity: 0.85;
}

/* Scroll reveal (hooks into the theme's .animation/.animated pair) */
.dw-reveal {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.8s ease, transform 0.8s ease;
}

.dw-reveal.animated {
	opacity: 1;
	transform: none;
}


/* ---------------------------------------------------------------
 * Responsive
 * --------------------------------------------------------------- */

@media screen and (max-width: 1440px) {
	.dw-lp-hero__inner {
		width: 100%;
		padding-left: 60px;
		padding-right: 60px;
	}

	.dw-lp-hero__headline {
		font-size: 48px;
	}

	.dw-lp-section .content,
	.dw-lp-band__inner {
		padding-left: 40px;
		padding-right: 40px;
	}
}

@media screen and (max-width: 1024px) {
	.dw-lead-popup {
		padding: 20px;
	}

	.dw-lead-popup__dialog {
		flex-direction: column;
		max-width: 560px;
	}

	.dw-lead-popup__aside {
		flex: 0 0 auto;
		padding: 34px 30px 28px;
	}

	.dw-lead-popup__headline {
		font-size: 24px;
	}

	.dw-lead-popup__usps,
	.dw-lead-popup__incentive {
		display: none;
	}

	.dw-lead-popup__main {
		padding: 30px;
	}

	.dw-lp-hero__inner {
		grid-template-columns: 1fr;
		gap: 44px;
		padding-bottom: 220px;
	}

	.dw-lp-hero__headline {
		font-size: 42px;
	}

	.dw-lp-hero__subline {
		font-size: 18px;
	}

	.dw-lp-section__title {
		font-size: 30px;
	}

	.dw-lp-benefits__grid,
	.dw-lp-steps__list {
		grid-template-columns: 1fr;
		gap: 44px;
	}

	.dw-lp-location__grid {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.dw-lp-usp__grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.dw-lp-usp__headline {
		font-size: 30px;
	}

	.dw-lp-circle {
		max-width: 340px;
	}

	.dw-lp-band {
		height: 300px;
	}

	/* the bottom wave is ~27px here, so the claim needs less clearance than on desktop */
	.dw-lp-band__inner {
		padding-bottom: 46px;
	}

	.dw-lp-team__grid {
		gap: 24px;
	}

	.dw-lp-member__photo {
		width: 150px;
	}

	@supports not (aspect-ratio: 1 / 1) {
		.dw-lp-member__photo {
			height: 150px;
		}
	}

}

@media screen and (max-width: 767px) {
	.dw-lead-popup {
		padding: 0;
		align-items: flex-end;
	}

	.dw-lead-popup__dialog {
		max-width: 100%;
		max-height: 94vh;
		border-radius: var(--dw-radius-lg) var(--dw-radius-lg) 0 0;
		transform: translateY(100%);
	}

	.dw-lead-popup__aside {
		padding: 30px 24px 24px;
	}

	.dw-lead-popup__headline {
		font-size: 22px;
		max-width: 82%;
	}

	.dw-lead-popup__text {
		margin-bottom: 0;
		font-size: 14px;
	}

	.dw-lead-popup__main {
		padding: 24px;
	}

	.dw-lead-popup__close {
		right: 14px;
		top: 14px;
		width: 36px;
		height: 36px;
	}

	.dw-lead-launcher {
		right: 14px;
		bottom: 14px;
		padding: 12px 18px 12px 14px;
		font-size: 13px;
	}

	.dw-step__question {
		font-size: 19px;
	}

	.dw-step__choices {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}

	.dw-choice {
		min-height: 100px;
		padding: 14px 8px;
	}

	.dw-lp-hero__inner {
		/* Phone: menu icon sits at top 100px and is 38px tall */
		padding: 165px 24px 200px;
	}

	.dw-lp-hero__headline {
		font-size: 34px;
	}

	.dw-lp-hero__cta {
		display: none;
	}

	.dw-lp-card {
		padding: 32px 22px 26px;
	}

	.dw-lp-section .content {
		padding-left: 24px;
		padding-right: 24px;
	}

	/* the section padding from the desktop rule is too generous on a phone */
	.dw-lp-section .content-wrapper {
		padding-top: 48px;
		padding-bottom: 64px;
	}

	/* a full width circle ate a whole screen */
	.dw-lp-circle {
		max-width: 260px;
	}

	.dw-lp-usp__grid {
		gap: 34px;
	}

	/* these photos need a bit of height to read */
	.dw-lp-band {
		height: 320px;
	}

	.dw-lp-band__claim {
		font-size: 17px;
		padding: 14px 18px;
	}

	/* arrows under the slides, centred, instead of floating at the edge */
	.dw-lp-inspiration__nav {
		margin-top: 18px;
	}

	.dw-lp-section__title {
		font-size: 26px;
	}

	.dw-rating--hero {
		font-size: 13px;
		gap: 4px 10px;
	}

	/* The location wraps to its own line, so drop the inline separator dot */
	.dw-rating--hero .dw-rating__place {
		flex: 1 1 100%;
		padding-left: 0;
	}

	.dw-rating--hero .dw-rating__place:before {
		display: none;
	}

	.dw-lp-location__card {
		padding: 28px 22px;
	}

	.dw-lp-location__list li {
		font-size: 15px;
	}

	.dw-lp-cta__box {
		padding: 40px 24px;
	}

	.dw-lp-cta__title {
		font-size: 26px;
	}

	.dw-lp-section__intro {
		margin-bottom: 30px;
		font-size: 16px;
	}

	.dw-lp-usp__headline {
		font-size: 26px;
	}

	.dw-lp-usp__text {
		font-size: 16px;
	}

	.dw-lp-band {
		height: 240px;
	}

	/* the bottom wave bottoms out at 22px on a phone */
	.dw-lp-band__inner {
		padding-bottom: 40px;
	}

	.dw-lp-band__claim {
		padding: 14px 18px;
		font-size: 17px;
	}

	/* Two per row keeps the faces recognisable on a phone */
	.dw-lp-team__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 28px 18px;
	}

	.dw-lp-member__photo {
		width: 130px;
	}

	@supports not (aspect-ratio: 1 / 1) {
		.dw-lp-member__photo {
			height: 130px;
		}
	}

	.dw-lp-teaser__image {
		height: 170px;
	}

	.dw-lp-sticky {
		display: block;
	}

	/* The landing page's own sticky bar owns the bottom edge on phones —
	   two fixed CTAs stacked on top of each other is one too many. */
	.page-template-template-leadgen .dw-lead-launcher {
		display: none;
	}

	/* Keep the sticky bar clear of the footer's top button */
	.page-template-template-leadgen #footer {
		padding-bottom: 70px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.dw-reveal,
	.dw-choice,
	.dw-lead-popup__dialog,
	.dw-lead-popup__backdrop,
	.dw-lp-sticky {
		transition-duration: 0.01ms;
	}

	.dw-step.is-active,
	.dw-funnel__success {
		animation: none;
	}

	.dw-reveal {
		opacity: 1;
		transform: none;
	}
}


/* ---------------------------------------------------------------
 * Location: the map
 * --------------------------------------------------------------- */

.dw-lp-map {
	position: relative;
	/* Stretches to the height of the details card beside it; the min-height is what
	   carries it once the grid collapses to a single column. */
	height: auto;
	min-height: 380px;
	margin: 0;
	max-width: none;
	overflow: hidden;
	border-radius: var(--dw-radius-lg);
	background-color: #E7E4E1;
	box-shadow: var(--dw-shadow-softer);
}

.dw-lp-map__canvas {
	position: absolute;
	left: 50%;
	top: 50%;
	/* the point is centred by the negative margins printed inline */
	filter: grayscale(1) contrast(1.05) brightness(1.03);
}

.dw-lp-map__canvas img {
	position: absolute;
	display: block;
	max-width: none;
}

/* faint brand wash over the grey, so the map belongs to the page */
.dw-lp-map__wash {
	position: absolute;
	inset: 0;
	background-color: var(--dw-coral);
	opacity: 0.07;
	pointer-events: none;
}

.dw-lp-map__marker {
	position: absolute;
	left: 50%;
	top: 50%;
	display: flex;
	align-items: center;
	gap: 14px;
	transform: translate(-16px, -50%);
}

.dw-lp-map__pin {
	position: relative;
	display: block;
	width: 32px;
	height: 32px;
	flex: 0 0 auto;
	border-radius: 50% 50% 50% 0;
	background-color: var(--dw-coral);
	transform: rotate(-45deg);
	box-shadow: 0 6px 16px rgba(57, 70, 78, 0.35);
	transition: transform 0.3s ease;
}

.dw-lp-map__pin:hover,
.dw-lp-map__pin:focus-visible {
	transform: rotate(-45deg) scale(1.12);
}

.dw-lp-map__pin-dot {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 11px;
	height: 11px;
	margin: -5.5px 0 0 -5.5px;
	border-radius: 50%;
	background-color: #fff;
}

.dw-lp-map__card {
	background-color: #fff;
	border-radius: var(--dw-radius);
	padding: 14px 18px 16px;
	box-shadow: var(--dw-shadow-soft);
	text-align: left;
	max-width: 260px;
}

.dw-lp-map__name {
	margin: 0 0 2px;
	font-family: 'Ambit', sans-serif;
	font-size: 15px;
	font-weight: 700;
	color: var(--dw-charcoal);
	line-height: 1.3;
}

.dw-lp-map__address {
	margin: 0 0 8px;
	font-size: 13px;
	line-height: 1.45;
	color: var(--dw-charcoal-muted);
}

.dw-lp-map__route {
	font-size: 13px;
	font-weight: 700;
	color: var(--dw-coral);
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}

/* bottom left, not right: the fixed launcher sits in the right corner and the
   OSM tile policy asks for attribution that stays visible */
.dw-lp-map__credit {
	position: absolute;
	left: 10px;
	bottom: 8px;
	margin: 0;
	font-size: 10px;
	line-height: 1.4;
	color: var(--dw-charcoal);
	background-color: rgba(255, 255, 255, 0.78);
	padding: 2px 7px;
	border-radius: 4px;
}

.dw-lp-map__credit a {
	color: inherit;
	text-decoration: none;
}

@media (max-width: 700px) {
	.dw-lp-map {
		min-height: 280px;
		border-radius: var(--dw-radius);
	}

	.dw-lp-map__marker {
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
		transform: translate(-16px, -100%);
	}

	.dw-lp-map__card {
		max-width: 220px;
	}
}


/* ---------------------------------------------------------------
 * Opening state: hero line and launcher
 * --------------------------------------------------------------- */

.dw-lp-openstate {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 4px 11px;
	border-radius: 999px;
	background-color: rgba(255, 255, 255, 0.16);
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	white-space: nowrap;
}

.dw-lp-openstate:before {
	content: '';
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background-color: currentColor;
	opacity: 0.55;
}

.dw-lp-openstate--open:before {
	opacity: 1;
	box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.25);
}

/* the launcher carries a second line once the hours are known */
.dw-lead-launcher__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	line-height: 1.25;
	text-align: left;
}

.dw-lead-launcher__note {
	font-size: 11.5px;
	font-weight: 400;
	opacity: 0.85;
}

/* open: invite people in rather than sell the form, so it steps out of the
   coral action colour and into the calm charcoal */
a.dw-lead-launcher--open {
	background-color: var(--dw-charcoal);
	text-decoration: none;
}

a.dw-lead-launcher--open:hover,
a.dw-lead-launcher--open:focus-visible {
	background-color: #2C373D;
}

/* out of the way while the footer is on screen */
.dw-lead-launcher.is-hidden {
	opacity: 0;
	visibility: hidden;
	transform: translateY(12px);
	pointer-events: none;
}

/* one highlighted word in a headline, in the brand accent */
.dw-hl {
	color: var(--dw-coral);
}


/* ---------------------------------------------------------------
 * Inspiration detail popup
 * --------------------------------------------------------------- */

.dw-insp-modal {
	position: fixed;
	inset: 0;
	z-index: 99995;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
}

.dw-insp-modal[hidden] {
	display: none;
}

.dw-insp-modal__backdrop {
	position: absolute;
	inset: 0;
	background-color: rgba(57, 70, 78, 0.55);
	backdrop-filter: blur(2px);
}

.dw-insp-modal__dialog {
	position: relative;
	width: 620px;
	max-width: 100%;
	max-height: 90vh;
	overflow-y: auto;
	background-color: #fff;
	border-radius: var(--dw-radius-lg);
	box-shadow: var(--dw-shadow-lift);
}

.dw-insp-modal__media {
	height: 220px;
	background-position: center;
	background-size: cover;
	border-radius: var(--dw-radius-lg) var(--dw-radius-lg) 0 0;
}

.dw-insp-modal__media[hidden] {
	display: none;
}

.dw-insp-modal__body {
	padding: 30px 36px 34px;
	text-align: left;
}

.dw-insp-modal__title {
	margin: 0 0 12px;
	font-family: 'Ambit', sans-serif;
	font-size: 26px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--dw-charcoal);
}

.dw-insp-modal__text {
	margin: 0 0 26px;
	font-size: 17px;
	line-height: 1.65;
	color: var(--dw-charcoal-muted);
}

.dw-insp-modal__actions {
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
}

.dw-insp-modal__back {
	border: none;
	background: none;
	padding: 0;
	font-size: 15px;
	color: var(--dw-charcoal-muted);
	text-decoration: underline;
	cursor: pointer;
}

.dw-insp-modal__back:hover {
	color: var(--dw-charcoal);
}

.dw-insp-modal__close {
	position: absolute;
	right: 14px;
	top: 14px;
	width: 38px;
	height: 38px;
	border: none;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.9);
	box-shadow: var(--dw-shadow-softer);
	cursor: pointer;
	z-index: 1;
}

.dw-insp-modal__close:before,
.dw-insp-modal__close:after {
	content: '';
	position: absolute;
	left: 11px;
	top: 18px;
	width: 16px;
	height: 2px;
	background-color: var(--dw-charcoal);
}

.dw-insp-modal__close:before {
	transform: rotate(45deg);
}

.dw-insp-modal__close:after {
	transform: rotate(-45deg);
}

@media (max-width: 700px) {
	.dw-insp-modal {
		padding: 0;
		align-items: flex-end;
	}

	.dw-insp-modal__dialog {
		max-height: 92vh;
		border-radius: var(--dw-radius-lg) var(--dw-radius-lg) 0 0;
	}

	.dw-insp-modal__media {
		height: 170px;
	}

	.dw-insp-modal__body {
		padding: 24px 22px 28px;
	}

	.dw-insp-modal__title {
		font-size: 22px;
	}

	.dw-insp-modal__text {
		font-size: 16px;
	}
}

@media (max-width: 800px) {
	.dw-lp-band__image {
		background-image: var(--dw-band-img-sm);
	}
}