/* =============================================================================
   CLIENT — Emerald Peak Performance
   Homepage, header and footer from the client design (built by client/build-homepage.php).
   Only what Elementor can't express natively: fluid type sizes (design clamp() values),
   gradients, pseudo elements, image fit, the slider controls position.
   Every rule is scoped to a CSS ID set in Elementor; colors come from Global Colors.
   Breakpoints: Elementor tablet ≤1024 / mobile ≤767, plus the design's own 1000 / 800 px.
   ============================================================================= */

/* ---- Shared ----------------------------------------------------------------- */

:is(#epp-hero, #epp-service-strip, #goals, #treatments, #how-it-works, #about, #epp-closing, #faq, #site-footer) .elementor-widget-text-editor p {
	margin: 0;
}

:is(#epp-hero, #epp-closing) > .e-con-inner {
	position: static;
}

/* ---- Extra brand colors ------------------------------------------------------
   Elementor data only references the core tokens; these apply the brand's extra
   Global Colors (Site Settings → Global Colors) where the design uses them. */

#epp-hero {
	background-color: var(--e-global-color-hero-bg);
}

:is(#epp-hero, #epp-closing) .epp-btn-forest .elementor-button,
:is(#epp-hero, #epp-closing) .epp-btn-forest .elementor-button:hover,
:is(#epp-hero, #epp-closing) .epp-btn-forest .elementor-button:focus-visible {
	color: var(--e-global-color-gold-pale);
}

#epp-hero .epp-btn-outline .elementor-button {
	border-color: var(--e-global-color-border-strong);
}

#site-header,
#epp-service-strip {
	border-color: var(--e-global-color-line-light);
}

#site-header-cta .elementor-button {
	border-color: var(--e-global-color-gold-grad-b);
	background: linear-gradient(120deg, var(--e-global-color-gold-grad-a), var(--e-global-color-gold-grad-b));
}

#site-header-cta .elementor-button:hover,
#site-header-cta .elementor-button:focus-visible {
	border-color: var(--e-global-color-gold-btn-hover);
	background: var(--e-global-color-gold-btn-hover);
}

#epp-service-strip .elementor-icon-list-text,
#epp-closing-copy .elementor-widget-text-editor:not(#epp-campaign-footer) {
	color: var(--e-global-color-text-strong);
}

#categories .epp-goal {
	border-color: var(--e-global-color-border-warm);
}

#epp-process-heading p.elementor-heading-title,
#epp-steps .epp-step__number .elementor-heading-title {
	color: var(--e-global-color-gold-light);
}

#epp-process-heading .elementor-widget-text-editor,
#epp-steps .elementor-widget-text-editor,
#epp-process-note .elementor-widget-text-editor {
	color: var(--e-global-color-on-dark-muted);
}

#epp-process-note {
	border-color: var(--e-global-color-line-on-dark);
}

#epp-veteran-badge {
	border-color: var(--e-global-color-gold-line);
}

#site-footer {
	background-color: var(--e-global-color-deep);
}

#epp-footer-topline,
#epp-footer-statement {
	border-color: var(--e-global-color-line-on-dark);
}

#epp-footer-topline .elementor-widget-text-editor,
#epp-footer-identity .elementor-widget-text-editor {
	color: var(--e-global-color-on-dark-muted);
}

#epp-footer-grid .epp-footer-menu .elementor-item {
	color: var(--e-global-color-on-dark-muted);
}

#epp-footer-grid .epp-footer-menu .elementor-item:hover {
	color: var(--e-global-color-on-dark);
}

#epp-footer-identity .epp-btn-gold .elementor-button {
	border-color: var(--e-global-color-gold-btn-hover);
	background-color: var(--e-global-color-gold-btn);
}

#epp-footer-identity .epp-btn-gold .elementor-button:hover,
#epp-footer-identity .epp-btn-gold .elementor-button:focus-visible {
	background-color: var(--e-global-color-gold-btn-hover);
}

#epp-footer-statement .elementor-heading-title {
	color: var(--e-global-color-statement);
}

#epp-fineprint .elementor-widget-text-editor {
	color: var(--e-global-color-on-dark-soft);
}

/* Section titles follow the design's fluid h2 (Global Font presets only carry
   desktop / mobile sizes; their tablet size is the average of the two). */
:is(#goals, #treatments, #about, #faq) h2.elementor-heading-title {
	font-size: clamp(34px, 3.3vw, 48px);
}

@media (max-width: 767px) {
	:is(#goals, #treatments, #about, #faq) h2.elementor-heading-title {
		font-size: 33px;
	}
}

/* Tablet: the design keeps its desktop sizes down to 1000px. */
@media (max-width: 1024px) and (min-width: 768px) {
	:is(#epp-hero-lead, #epp-about-copy .elementor-widget-text-editor) {
		font-size: 19px;
	}

	#categories .epp-goal--feature h3.elementor-heading-title {
		font-size: 25px;
	}

	#categories .epp-goal--small h3.elementor-heading-title {
		font-size: 23px;
	}
}

@media (max-width: 1000px) and (min-width: 768px) {
	#epp-hero-lead {
		font-size: 17px;
	}
}

/* Buttons on phones: 14px / 20px padding, 50px tall (design). */
@media (max-width: 767px) {
	:is(#epp-closing-copy, #epp-footer-identity) .elementor-button {
		padding: 14px 20px;
	}
}

/* ---- Header ----------------------------------------------------------------- */

#site-header-logo img {
	object-position: left center;
}

#site-header-nav .elementor-nav-menu--main .elementor-item:hover {
	text-decoration: underline;
	text-underline-offset: 6px;
}

#site-header-actions {
	--width: auto;
	width: auto;
}

#site-header-cta .elementor-button {
	min-height: 48px;
}

@media (max-width: 1000px) {
	#site-header-cta {
		display: none;
	}
}

@media (max-width: 767px) {
	#site-header-nav .elementor-menu-toggle {
		width: auto;
		height: auto;
		padding: 8px 12px;
		border: 1px solid var(--e-global-color-border-strong);
		border-radius: 6px;
		background: transparent;
	}

	#site-header-nav .elementor-menu-toggle svg,
	#site-header-nav .elementor-menu-toggle i {
		display: none;
	}

	#site-header-nav .elementor-menu-toggle::before {
		content: "Menu";
		font-family: var(--e-global-typography-text-font-family), sans-serif;
		font-size: 17px;
		line-height: 1.6;
		color: var(--e-global-color-heading);
	}

	#site-header-nav .elementor-nav-menu--dropdown {
		border-bottom: 1px solid var(--e-global-color-line-light);
	}
}

/* ---- Hero ------------------------------------------------------------------- */

#epp-hero-art {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	z-index: 0;
}

#epp-hero-art .elementor-widget-container,
#epp-hero-art img {
	width: 100%;
	height: 100%;
}

#epp-hero-art img {
	object-fit: cover;
	object-position: center;
}

#epp-hero-art::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg,
		var(--e-global-color-hero-bg) 0%,
		color-mix(in srgb, var(--e-global-color-hero-bg) 96%, transparent) 28%,
		color-mix(in srgb, var(--e-global-color-hero-bg) 0%, transparent) 58%);
	pointer-events: none;
}

#epp-hero-title .elementor-heading-title {
	font-size: clamp(64px, 6.2vw, 92px);
}

#epp-hero-title span {
	color: var(--e-global-color-accent);
}

#epp-hero-lead {
	max-width: 470px;
}

#epp-hero-note {
	max-width: 430px;
	font-size: 12px;
}

#epp-hero-label {
	position: absolute;
	left: 58%;
	right: 8%;
	bottom: 22px;
	z-index: 3;
	margin: 0;
	text-align: center;
}

#epp-hero-label .elementor-heading-title {
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.17em;
}

@media (max-width: 1000px) and (min-width: 768px) {
	#epp-hero-title .elementor-heading-title {
		font-size: clamp(52px, 6.8vw, 68px);
	}

	#epp-hero-lead {
		max-width: 350px;
	}
}

@media (max-width: 767px) {
	#epp-hero-title .elementor-heading-title {
		font-size: clamp(48px, 13.8vw, 68px);
	}

	#epp-hero-lead {
		max-width: none;
	}

	#epp-hero-note {
		font-size: 11px;
	}

	#epp-hero-actions {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 10px;
	}

	#epp-hero-actions .elementor-button {
		width: 100%;
		padding: 14px 10px;
	}

	#epp-hero-art {
		position: relative;
		inset: auto;
		order: 2;
		width: calc(100% + 36px);
		max-width: none;
		height: 360px;
		margin: 18px -18px 0;
	}

	#epp-hero-art img {
		object-position: 100% center;
	}

	#epp-hero-art::after {
		background: linear-gradient(180deg, var(--e-global-color-hero-bg), color-mix(in srgb, var(--e-global-color-hero-bg) 0%, transparent) 25%);
	}

	#epp-hero-label {
		left: 0;
		right: 0;
		bottom: 14px;
	}
}

/* ---- Service strip ---------------------------------------------------------- */

#epp-service-strip .elementor-icon-list-icon svg {
	margin: 0;
	fill: none;
	stroke: currentColor;
	color: var(--e-global-color-heading);
}

@media (max-width: 1000px) {
	#epp-service-strip .elementor-icon-list-text {
		font-size: 12px;
	}
}

/* ---- Goals ------------------------------------------------------------------ */

/* The design's `.section-heading p` rule also reaches the eyebrow on phones. */
@media (max-width: 767px) {
	:is(#goals, #epp-treatments-heading) .epp-heading-eyebrow {
		margin-top: 18px;
	}

	:is(#goals, #epp-treatments-heading) .epp-heading-eyebrow .elementor-heading-title {
		font-size: 16px;
	}
}

#goals .elementor-widget-text-editor {
	max-width: 100%;
}

#categories .epp-goal {
	transition: box-shadow 0.2s;
}

#categories .epp-goal:hover {
	box-shadow: 0 8px 24px color-mix(in srgb, var(--e-global-color-heading) 7%, transparent);
}

#categories .epp-goal--feature .epp-goal__photo {
	position: absolute;
	inset: 0;
	margin: 0;
	z-index: 0;
}

#categories .epp-goal--feature .epp-goal__photo .elementor-widget-container,
#categories .epp-goal--feature .epp-goal__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#categories .epp-goal--feature .epp-goal__photo::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg,
		color-mix(in srgb, var(--e-global-color-deep) 0%, transparent) 20%,
		color-mix(in srgb, var(--e-global-color-deep) 54%, transparent) 55%,
		color-mix(in srgb, var(--e-global-color-deep) 95%, transparent) 100%);
}

#epp-goal-1 .epp-goal__photo img {
	object-position: center 20%;
}

:is(#epp-goal-3, #epp-goal-4, #epp-goal-5) .epp-goal__photo img {
	object-position: center top;
}

#categories .epp-goal--feature .elementor-widget-text-editor {
	max-width: 440px;
}

#categories .epp-arrow {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border: 1px solid var(--e-global-color-gold-line);
	border-radius: 50%;
	color: var(--e-global-color-accent);
	font-size: 24px;
	line-height: 1;
}

#categories .epp-arrow--light {
	border-color: var(--e-global-color-gold-line-soft);
	color: var(--e-global-color-gold-light);
}

#categories .epp-goal--feature .epp-arrow-wrap {
	margin-top: 24px;
}

#categories .epp-goal--small .epp-arrow-wrap {
	margin-top: auto;
}

@media (max-width: 1000px) {
	#categories {
		--gap: 18px;
		--row-gap: 18px;
		--column-gap: 18px;
	}

	#categories .epp-goal--small .epp-goal__copy {
		--padding-top: 20px;
		--padding-right: 20px;
		--padding-bottom: 20px;
		--padding-left: 20px;
	}

	#categories .epp-goal--small h3.elementor-heading-title {
		font-size: 20px;
	}

	#categories .epp-goal--small .epp-goal__photo img {
		height: 180px;
	}
}

@media (max-width: 800px) and (min-width: 768px) {
	#categories {
		--e-con-grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	#categories .epp-goal--feature {
		grid-column: span 1;
	}
}

@media (max-width: 767px) {
	#categories {
		--gap: 20px;
		--row-gap: 20px;
		--column-gap: 20px;
	}

	#categories .epp-goal--small .epp-goal__copy {
		--padding-top: 24px;
		--padding-right: 24px;
		--padding-bottom: 24px;
		--padding-left: 24px;
	}

	#categories .epp-goal--small h3.elementor-heading-title {
		font-size: 24px;
	}

	#categories .epp-goal--small .epp-goal__photo img {
		height: 245px;
	}

	#categories .epp-goal--small .elementor-widget-text-editor:not(.epp-arrow-wrap) {
		font-size: 15px;
	}

	#categories .epp-goal--small .epp-arrow-wrap {
		margin-top: 0;
	}
}

/* ---- Treatments (product slider) -------------------------------------------- */

/* nova-products-slider.js sets the gap and visible count inline (and steps by
   card width + that gap), so only the card width is adapted to the design here. */
#epp-product-slider .nova-products--slider {
	position: relative;
}

#epp-product-slider .nova-products__viewport {
	padding: 4px 0 10px;
}

#epp-product-slider .nova-products__card {
	border: 0;
	border-radius: 8px;
	overflow: hidden;
	background: var(--e-global-color-card);
	box-shadow: none;
	transform: none;
}

#epp-product-slider .nova-products__img-wrap {
	aspect-ratio: 1 / 1.06;
	padding: 0;
	border-radius: 0;
	background: var(--e-global-color-media);
}

#epp-product-slider .nova-products__img-wrap .nova-products__img {
	width: 100%;
	height: 100%;
	padding: 18px;
	object-fit: contain;
	transform: none;
}

#epp-product-slider .nova-products__body {
	padding: 25px 22px 22px;
	gap: 0;
	background: var(--e-global-color-card);
}

#epp-product-slider .nova-products__text-group {
	gap: 0;
}

#epp-product-slider .nova-products__card .nova-products__title {
	margin: 0;
	font-size: 22px;
	font-weight: 450;
	line-height: 1.15;
	letter-spacing: -0.025em;
}

#epp-product-slider .nova-products__title a {
	color: var(--e-global-color-heading);
}

#epp-product-slider .nova-products__price {
	margin: 15px 0 22px;
	font-size: 17px;
	font-weight: 500;
	color: var(--e-global-color-heading);
	font-variant-numeric: tabular-nums;
}

#epp-product-slider a.nova-products__btn {
	width: 100%;
	min-height: 52px;
	margin: 0;
	padding: 15px 26px;
	border: 1px solid var(--e-global-color-primary);
	border-radius: 4px;
	background: var(--e-global-color-primary);
	color: var(--e-global-color-on-dark);
	font-size: 15px;
	font-weight: 550;
	line-height: 1.35;
	letter-spacing: 0.015em;
	text-transform: none;
}

#epp-product-slider a.nova-products__btn:hover,
#epp-product-slider a.nova-products__btn:focus-visible {
	border-color: var(--e-global-color-primary-hover);
	background: var(--e-global-color-primary-hover);
	color: var(--e-global-color-on-dark);
}

/* Slider controls sit at the right end of the section heading, as in the design. */
#epp-product-slider .nova-products__nav {
	position: absolute;
	top: -86px;
	right: 0;
	margin: 0;
}

#epp-product-slider .nova-products__controls {
	gap: 10px;
}

#epp-product-slider button.nova-products__arrow {
	width: 46px;
	height: 46px;
	border: 1px solid var(--e-global-color-border-strong);
	color: var(--e-global-color-primary);
}

#epp-product-slider button.nova-products__arrow:hover:not(:disabled) {
	background: color-mix(in srgb, var(--e-global-color-primary) 6%, transparent);
	color: var(--e-global-color-primary);
}

#epp-product-slider button.nova-products__arrow:disabled {
	opacity: 0.3;
	cursor: default;
}

#epp-product-slider .nova-products__arrow svg rect {
	fill: transparent;
}

#epp-product-slider .nova-products__arrow svg path {
	fill: currentColor;
}

#epp-pricing-note {
	font-size: 12px;
}

@media (max-width: 1024px) and (min-width: 1001px) {
	#epp-product-slider .nova-products__slide {
		flex-basis: calc((100% - 3 * var(--nova-products-gap)) / 4);
	}
}

@media (max-width: 1000px) and (min-width: 768px) {
	#epp-product-slider .nova-products__slide {
		flex-basis: calc((100% - var(--nova-products-gap)) / 2);
	}
}

@media (max-width: 767px) {
	#epp-treatments-heading {
		padding-right: 85px;
	}

	#epp-product-slider .nova-products__slide {
		flex-basis: 84%;
	}

	#epp-product-slider .nova-products__img-wrap .nova-products__img {
		padding: 22px;
	}

	#epp-product-slider .nova-products__body {
		padding: 22px;
	}

	#epp-product-slider .nova-products__nav {
		top: -64px;
	}

	#epp-product-slider .nova-products__controls {
		gap: 6px;
	}

	#epp-product-slider button.nova-products__arrow {
		width: 36px;
		height: 36px;
	}
}

/* ---- How it works ----------------------------------------------------------- */

#epp-process-heading p.elementor-heading-title {
	font-size: 10px;
	letter-spacing: 0.2em;
}

#epp-process-heading h2.elementor-heading-title {
	font-size: clamp(34px, 3.6vw, 50px);
	line-height: 1.12;
	letter-spacing: -0.045em;
}

#epp-process-heading .elementor-widget-text-editor {
	font-size: 16px;
	line-height: 1.65;
}

#epp-steps .epp-step__art {
	margin-bottom: 30px;
}

#epp-steps .epp-step__art img {
	width: 250px;
	height: 250px;
	border-radius: 50%;
	object-fit: cover;
	outline: 1px solid var(--e-global-color-gold-line);
	outline-offset: 10px;
}

#epp-steps .e-con:nth-child(2) .epp-step__art img {
	object-position: center 10%;
}

#epp-steps .epp-step__number {
	margin-bottom: 14px;
}

#epp-steps .epp-step__number .elementor-heading-title {
	font-size: 14px;
	line-height: 1;
	font-weight: 600;
	letter-spacing: 0.09em;
}

#epp-process-note .elementor-widget-text-editor {
	font-size: 11px;
	line-height: 1.6;
}

@media (max-width: 900px) and (min-width: 768px) {
	#epp-steps {
		--gap: 24px;
		--row-gap: 24px;
		--column-gap: 24px;
	}

	#epp-steps .epp-step__art img {
		width: 180px;
		height: 180px;
	}

	#epp-steps h3.elementor-heading-title {
		font-size: 21px;
	}
}

@media (max-width: 767px) {
	#epp-process-heading h2 br {
		display: none;
	}

	#epp-steps .epp-step__art {
		margin-bottom: 28px;
	}

	#epp-steps .epp-step__art img {
		width: 230px;
		height: 230px;
	}

	#epp-process-note .elementor-widget-text-editor {
		font-size: 12px;
	}
}

/* ---- About ------------------------------------------------------------------ */

#epp-about-img img {
	width: 100%;
	aspect-ratio: 1.04;
	object-fit: cover;
	border-radius: 14px;
}

#epp-veteran-badge {
	--width: auto;
	width: auto;
}

#epp-veteran-badge .epp-badge-star {
	font-size: 18px;
	line-height: 1.6;
}

#epp-veteran-badge .epp-badge-text {
	font-size: 13px;
	font-weight: 550;
}

#epp-about-link {
	margin-top: 24px;
}

#epp-about-link .elementor-button {
	min-height: 0;
	padding: 0 0 7px;
	border: 0;
	border-bottom: 1px solid currentColor;
	border-radius: 0;
	background: none;
	color: var(--e-global-color-heading);
	font-weight: 400;
	line-height: 1.6;
	letter-spacing: 0;
	text-decoration: none;
}

@media (max-width: 767px) {
	#epp-about-img img {
		aspect-ratio: 1.2;
	}
}

/* ---- Closing CTA ------------------------------------------------------------ */

#epp-closing-art {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	z-index: 0;
}

#epp-closing-art .elementor-widget-container,
#epp-closing-art img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

#epp-closing-art::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg,
		var(--e-global-color-hero-bg) 0%,
		color-mix(in srgb, var(--e-global-color-hero-bg) 95%, transparent) 28%,
		color-mix(in srgb, var(--e-global-color-hero-bg) 71%, transparent) 43%,
		color-mix(in srgb, var(--e-global-color-hero-bg) 0%, transparent) 65%);
	pointer-events: none;
}

#epp-closing-copy h2.elementor-heading-title {
	font-size: clamp(40px, 3.7vw, 56px);
	line-height: 1.1;
	letter-spacing: -0.04em;
}

#epp-closing-copy .elementor-widget-text-editor:not(#epp-campaign-footer) {
	max-width: 370px;
	font-size: 16px;
}

#epp-campaign-footer {
	font-size: 10px;
	font-weight: 400;
	letter-spacing: 0.08em;
}

#epp-campaign-footer p {
	display: flex;
	align-items: center;
	gap: 12px;
}

#epp-campaign-footer p::before {
	content: "";
	width: 26px;
	height: 1px;
	background: var(--e-global-color-gold-line-soft);
}

@media (max-width: 1000px) {
	#epp-closing-copy {
		--width: 47%;
	}

	#epp-closing-copy h2.elementor-heading-title {
		font-size: 42px;
	}

	#epp-closing-art img {
		object-position: 56% center;
	}

	#epp-closing-art::after {
		background: linear-gradient(90deg,
			var(--e-global-color-hero-bg),
			color-mix(in srgb, var(--e-global-color-hero-bg) 87%, transparent) 40%,
			color-mix(in srgb, var(--e-global-color-hero-bg) 0%, transparent) 78%);
	}
}

@media (max-width: 767px) {
	#epp-closing-copy {
		--width: 100%;
		background: var(--e-global-color-hero-bg);
	}

	#epp-closing-copy h2.elementor-heading-title {
		max-width: 370px;
		font-size: 39px;
	}

	#epp-closing-copy .elementor-button {
		min-width: 190px;
	}

	#epp-closing-art {
		position: relative;
		inset: auto;
		height: auto;
		aspect-ratio: 1.35;
	}

	#epp-closing-art img {
		object-position: center;
	}

	#epp-closing-art::after {
		display: none;
	}
}

/* ---- FAQ -------------------------------------------------------------------- */
/* The homepage FAQ (#faq) and the shared FAQ block on product pages (#faq-block) look the same
   (Gate 1 QA, 19 Oct: the product page FAQ had a pill eyebrow, 23px questions and no lines). */

@media (max-width: 767px) {
	#epp-faq-intro {
		font-size: 17px;
	}
}

#faq-block {
	--padding-top: 100px;
	--padding-bottom: 100px;
	--padding-left: 48px;
	--padding-right: 48px;
}

#faq-block > .e-con-inner {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
	gap: 80px;
	align-items: start;
	max-width: 1280px;
}

#faq-block > .e-con-inner > * {
	width: auto;
	min-width: 0;
}

/* Eyebrow: plain text like "Before you begin", not a bordered pill. */
#faq-block .e-paragraph-base {
	display: block;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	font-size: 11px;
	font-weight: 500;
	line-height: 1.6;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--e-global-color-heading);
}

#faq-block > .e-con-inner > .e-con .elementor-widget-text-editor {
	max-width: 280px;
	font-size: 17px;
	line-height: 1.6;
	color: var(--e-global-color-text);
}

@media (max-width: 767px) {
	#faq-block {
		--padding-top: 60px;
		--padding-bottom: 60px;
		--padding-left: 20px;
		--padding-right: 20px;
	}

	#faq-block > .e-con-inner {
		grid-template-columns: minmax(0, 1fr);
		gap: 30px;
	}

	#faq-block > .e-con-inner > .e-con .elementor-widget-text-editor {
		max-width: none;
	}
}

#faq-block-list {
	--n-accordion-item-title-space-between: 0px;
}

/* Lines between the questions. The item itself has no padding or border: Elementor slides an item
   between "question height" and "question + answer height", so anything of its own made the slide stop
   short and jump at the end (QA: "FAQ accordion behaviour is buggy"). The lines sit in a 1px margin. */
:is(#epp-faq-list, #faq-block-list) .e-n-accordion-item {
	margin-top: 1px;
	box-shadow: 0 -1px 0 var(--e-global-color-border);
}

:is(#epp-faq-list, #faq-block-list) .e-n-accordion-item:last-child {
	margin-bottom: 1px;
	box-shadow: 0 -1px 0 var(--e-global-color-border), 0 1px 0 var(--e-global-color-border);
}

:is(#epp-faq-list, #faq-block-list) .e-n-accordion-item-title {
	gap: 15px;
	padding: 22px 0;
	border: 0;
	background: none;
}

:is(#epp-faq-list, #faq-block-list) .e-n-accordion-item-title-text {
	margin: 0;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.6;
	letter-spacing: 0;
	color: var(--e-global-color-heading);
}

:is(#epp-faq-list, #faq-block-list) .e-n-accordion-item-title-icon {
	display: none;
}

:is(#epp-faq-list, #faq-block-list) .e-n-accordion-item-title::after {
	content: "+";
	font-size: 23px;
	line-height: 1;
	color: var(--e-global-color-heading);
}

/* Open, and as soon as a closing slide starts: Elementor flips aria-expanded when the slide starts and
   removes [open] only when it ends (an inline overflow marks a slide in progress). */
:is(#epp-faq-list, #faq-block-list) .e-n-accordion-item[open]:not([style*="overflow"]) > .e-n-accordion-item-title::after,
:is(#epp-faq-list, #faq-block-list) .e-n-accordion-item[open] > .e-n-accordion-item-title[aria-expanded="true"]::after {
	content: "\2212";
}

/* 16px between question and answer, 22px under the answer: the question keeps its 22px and the answer
   sits 6px into it. */
:is(#epp-faq-list, #faq-block-list) .e-n-accordion-item > .e-con {
	position: relative;
	top: -6px;
	padding: 0 0 16px;
	border: 0;
}

:is(#epp-faq-list, #faq-block-list) .e-n-accordion-item .elementor-widget-text-editor {
	max-width: 580px;
	font-size: 16px;
	line-height: 1.6;
	color: var(--e-global-color-text);
}

/* ---- Footer ----------------------------------------------------------------- */

#epp-footer-topline .elementor-widget-text-editor {
	font-size: 10px;
}

#epp-back-to-top {
	font-size: 12px;
	line-height: 1.6;
}

#epp-back-to-top .elementor-button {
	line-height: 1.6;
	min-height: 0;
	padding: 0;
	border: 0;
	background: none;
	color: var(--e-global-color-on-dark-muted);
	font-size: 12px;
	font-weight: 400;
	letter-spacing: 0;
}

#epp-back-to-top .elementor-button:hover {
	color: var(--e-global-color-on-dark);
}

#epp-footer-identity .elementor-widget-text-editor {
	line-height: 1.7;
}

#epp-footer-grid .epp-footer-col {
	padding-top: 20px;
}

#epp-footer-grid .epp-footer-col__title {
	margin-bottom: 24px;
}

#epp-footer-grid .epp-footer-col__title .elementor-heading-title {
	font-size: 13px;
	line-height: 1.15;
	font-weight: 550;
}

#epp-footer-grid .epp-footer-menu .elementor-item {
	display: flex;
	align-items: center;
	min-height: 38px;
	padding: 0;
	font-size: 13px;
}

#epp-footer-grid .epp-footer-menu .elementor-item:hover {
	text-decoration: underline;
	text-underline-offset: 5px;
}

#epp-footer-statement .elementor-heading-title {
	font-size: clamp(24px, 4.4vw, 64px);
	font-weight: 350;
	line-height: 1;
	letter-spacing: -0.035em;
	text-transform: uppercase;
}

#epp-fineprint .elementor-widget-text-editor {
	font-size: 11px;
	line-height: 1.7;
}

@media (max-width: 1000px) {
	#epp-footer-grid {
		--e-con-grid-template-columns: 1.4fr 1fr 1fr 1fr;
		--gap: 25px;
		--row-gap: 25px;
		--column-gap: 25px;
	}

	#epp-footer-grid .epp-footer-menu .elementor-item {
		font-size: 12px;
	}
}

@media (max-width: 767px) {
	#epp-footer-topline .elementor-widget-text-editor {
		max-width: 210px;
		font-size: 9px;
	}

	#epp-footer-grid {
		--e-con-grid-template-columns: repeat(2, minmax(0, 1fr));
		--row-gap: 36px;
		--column-gap: 22px;
	}

	#epp-footer-identity {
		grid-column: 1 / -1;
	}

	#epp-footer-grid .epp-footer-col {
		padding-top: 0;
	}

	#epp-footer-grid .epp-footer-col__title {
		margin-bottom: 16px;
	}

	#epp-footer-grid .epp-footer-menu .elementor-item {
		min-height: 40px;
		font-size: 13px;
	}

	#epp-footer-statement .elementor-heading-title {
		font-size: 25px;
	}

	#epp-fineprint .elementor-widget-text-editor {
		font-size: 10px;
	}
}

/* ---- Contact page: info rows (saved section "Contact Static Block") ---------- */

#epp-contact-info .e-div-block:has(> .elementor-widget-icon) {
	align-items: center;
	gap: 16px;
}

#epp-contact-info .elementor-widget-icon .elementor-icon-wrapper {
	display: flex;
	line-height: 0;
}

/* Label + value together match the 44px icon box. */
#epp-contact-info .epp-contact-label {
	margin-bottom: 4px;
}

#epp-contact-info .epp-contact-label .elementor-heading-title {
	line-height: 1.4;
}

#epp-contact-info .epp-contact-value .elementor-heading-title {
	font-size: 16px;
	line-height: 1.4;
}

@media (max-width: 767px) {
	#epp-contact-info {
		--gap: 0px;
		--row-gap: 0px;
	}

	#epp-contact-info > :first-child {
		margin-bottom: 24px;
	}
}

/* Gate 1 QA: tap targets at least 44px on phones. Both are text links in the design: the box grows to 44px
   and negative margins keep everything where it was. */
@media (max-width: 767px) {
	#epp-back-to-top .elementor-button {
		min-height: 44px;
		margin-block: -12px;
	}

	/* Its underline is a bottom border right under the text: the box grows upwards only. */
	#epp-about-link .elementor-button {
		padding-top: 12px;
		margin-top: -12px;
	}
}
