﻿/**
 * Hatoum button system — use on links/buttons in Divi (Button module CSS class field).
 * Classes: hatoum-btn-primary | hatoum-btn-whatsapp | hatoum-btn-outline-light |
 *          hatoum-btn-outline-on-dark | hatoum-btn-secondary | hatoum-btn-ghost |
 *          hatoum-btn-sm | hatoum-btn-lg
 */:root {
	--hatoum-header-sticky-offset: 0px;
	--hatoum-content-width: 90%;

	/* Hatoum button system â€” tokens drive every variant */
	--hatoum-btn-primary-bg: var(--wp--preset--color--primary, #0066df);
	--hatoum-btn-primary-bg-hover: #0052b8;
	--hatoum-btn-primary-fg: #ffffff;
	--hatoum-btn-primary-ring: rgba(0, 102, 223, 0.35);
	--hatoum-btn-whatsapp-bg: #25d366;
	--hatoum-btn-whatsapp-bg-hover: #1da851;
	--hatoum-btn-whatsapp-fg: #ffffff;
	--hatoum-btn-whatsapp-ring: rgba(37, 211, 102, 0.38);
	--hatoum-btn-radius: 5px;
	--hatoum-btn-font-size: 16px;
	--hatoum-btn-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--hatoum-btn-sheen: linear-gradient(
		115deg,
		transparent 0%,
		rgba(255, 255, 255, 0.22) 45%,
		rgba(255, 255, 255, 0.22) 55%,
		transparent 100%
	);
}

/* Primary header is Osmo-style mega nav (mega-nav.css). Legacy bar styles removed. */

/* --- Hatoum button system ------------------------------------------------ */
/*
 * Drop `.hatoum-btn-primary` on the inner control (`<a>`, `<button>`, or
 * `.wp-block-button__link`). WordPress â€œAdditional CSS classâ€ applies to the outer
 * `.wp-block-button` â€” that is not `:has(.hatoum-btn-primary)` (class is on self, not a
 * descendant), so we exclude `.wp-block-button` from the bare selector and forward styles
 * to the inner link when the class sits on the wrapper only (editor + pre-filter markup).
 * Add `.hatoum-btn-arrow`, `.hatoum-btn-sm` / `.hatoum-btn-lg`, `.hatoum-btn-secondary` /
 * `.hatoum-btn-outline-light` / `.hatoum-btn-ghost` on the same inner control as documented in this file.
 */
.hatoum-btn-primary:not(.wp-block-button),
a.hatoum-btn-primary,
button.hatoum-btn-primary,
.wp-block-button .hatoum-btn-primary,
.wp-block-button__link.hatoum-btn-primary,
.wp-block-button.hatoum-btn-primary:not(:has(.hatoum-btn-primary)) > :is(a, button).wp-block-button__link {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.65em;
	isolation: isolate;
	box-sizing: border-box;
	margin: 0;
	color: var(--hatoum-btn-primary-fg);
	background-color: var(--hatoum-btn-primary-bg);
	background-image: var(--hatoum-btn-sheen);
	background-repeat: no-repeat;
	background-size: 55% 100%;
	background-position: -70% 0;
	border: 2px solid transparent;
	border-radius: 5px;
	font-family: inherit;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.15;
	letter-spacing: 0.08em;
	text-transform: capitalize;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	overflow: hidden;
	-webkit-appearance: none;
	appearance: none;
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.18) inset,
		0 8px 22px -10px var(--hatoum-btn-primary-ring),
		0 2px 6px -2px rgba(0, 11, 29, 0.18);
	transition:
		background-color 0.2s ease,
		background-position 0.7s var(--hatoum-btn-ease),
		box-shadow 0.3s var(--hatoum-btn-ease),
		color 0.2s ease;
}

/* Block â€œsmall/mediumâ€ font presets on the link can override size â€” keep CTA on token */
.wp-block-button__link.hatoum-btn-primary.has-small-font-size,
.wp-block-button__link.hatoum-btn-primary.has-medium-font-size,
.wp-block-button__link.hatoum-btn-outline-light.has-small-font-size,
.wp-block-button__link.hatoum-btn-outline-light.has-medium-font-size {
	font-size: var(--hatoum-btn-font-size, 1rem) !important;
}

/*
 * Core Button + Hatoum: WP routes block spacing to `.wp-block-button` (wrapper) and
 * theme/utility styles stay on `.wp-block-button__link`, so padding + fill can stack and
 * read as a â€œbutton inside a buttonâ€. Strip wrapper chrome; one painted surface on the link.
 */
.wp-block-button:has(.hatoum-btn-primary),
.wp-block-button:has(.hatoum-btn-outline-light),
.wp-block-button:has(.hatoum-btn-outline-on-dark),
.wp-block-button.hatoum-btn-primary,
.wp-block-button.hatoum-btn-outline-light,
.wp-block-button.hatoum-btn-outline-on-dark,
.wp-block-button.hatoum-hero-cta {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: fit-content !important;
	max-width: 100% !important;
	flex: 0 1 auto !important;
	flex-basis: auto !important;
	min-width: 0 !important;
	align-self: center !important;
	margin: 0 !important;
	padding: 0 !important;
	padding-block: 0 !important;
	padding-inline: 0 !important;
	padding-top: 0 !important;
	padding-right: 0 !important;
	padding-bottom: 0 !important;
	padding-left: 0 !important;
	min-height: 0 !important;
	background: transparent !important;
	background-color: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	outline: none !important;
}

/* Wrapper must never paint or move on hover â€” only the link does (avoids double-tone / halo). */
.wp-block-button:has(.hatoum-btn-primary):hover,
.wp-block-button:has(.hatoum-btn-primary):focus-within,
.wp-block-button:has(.hatoum-btn-outline-light):hover,
.wp-block-button:has(.hatoum-btn-outline-light):focus-within,
.wp-block-button:has(.hatoum-btn-outline-on-dark):hover,
.wp-block-button:has(.hatoum-btn-outline-on-dark):focus-within,
.wp-block-button.hatoum-btn-primary:hover,
.wp-block-button.hatoum-btn-primary:focus-within,
.wp-block-button.hatoum-btn-outline-light:hover,
.wp-block-button.hatoum-btn-outline-light:focus-within,
.wp-block-button.hatoum-btn-outline-on-dark:hover,
.wp-block-button.hatoum-btn-outline-on-dark:focus-within,
.wp-block-button.hatoum-hero-cta:hover,
.wp-block-button.hatoum-hero-cta:focus-within {
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
	transform: none !important;
	filter: none !important;
	opacity: 1 !important;
	border: 0 !important;
	padding: 0 !important;
}

.wp-block-button:has(.hatoum-btn-primary) .wp-block-button__link.hatoum-btn-primary,
.wp-block-button:has(.hatoum-btn-outline-light) .wp-block-button__link.hatoum-btn-outline-light,
.wp-block-button:has(.hatoum-btn-outline-on-dark) .wp-block-button__link.hatoum-btn-outline-on-dark,
.wp-block-button.hatoum-hero-cta .wp-block-button__link.hatoum-btn-primary,
.wp-block-button.hatoum-btn-primary:not(:has(.hatoum-btn-primary)) > :is(a, button).wp-block-button__link,
.wp-block-button.hatoum-btn-outline-light:not(:has(.hatoum-btn-outline-light)) > :is(a, button).wp-block-button__link,
.wp-block-button.hatoum-btn-outline-on-dark:not(:has(.hatoum-btn-outline-on-dark)) > :is(a, button).wp-block-button__link {
	height: auto !important;
	min-height: 0 !important;
	width: auto !important;
	max-width: none !important;
}

.wp-block-button__link.hatoum-btn-primary.wp-element-button,
.wp-block-button__link.hatoum-btn-primary.has-background,
.wp-block-button.hatoum-btn-primary:not(:has(.hatoum-btn-primary)) > .wp-block-button__link.wp-element-button,
.wp-block-button.hatoum-btn-primary:not(:has(.hatoum-btn-primary)) > .wp-block-button__link.has-background {
	padding: 1.05em 2.1em !important;
}

.hatoum-btn-primary:hover,
.hatoum-btn-primary:focus-visible {
	color: var(--hatoum-btn-primary-fg);
	background-color: var(--hatoum-btn-primary-bg-hover);
	background-image: var(--hatoum-btn-sheen);
	background-position: 170% 0;
	border: 2px solid transparent;
	opacity: 1;
	transform: none;
	text-decoration: none;
	filter: none;
}

/* Wrapper-only hatoum (editor): same hover as nav / inner-class CTA */
.wp-block-button.hatoum-btn-primary:not(:has(.hatoum-btn-primary)):hover > :is(a, button).wp-block-button__link,
.wp-block-button.hatoum-btn-primary:not(:has(.hatoum-btn-primary)):focus-within > :is(a, button).wp-block-button__link {
	color: var(--hatoum-btn-primary-fg);
	background-color: var(--hatoum-btn-primary-bg-hover);
	background-image: var(--hatoum-btn-sheen);
	background-position: 170% 0;
	opacity: 1;
	transform: none;
	text-decoration: none;
	filter: none;
}

/* Global styles / palette utilities can set their own :hover fill on the link â€” keep one surface. */
/* WhatsApp — same system as primary (green); use Divi Button icon for WhatsApp logo */
.hatoum-btn-whatsapp:not(.wp-block-button),
a.hatoum-btn-whatsapp,
button.hatoum-btn-whatsapp,
.wp-block-button .hatoum-btn-whatsapp,
.wp-block-button__link.hatoum-btn-whatsapp,
.wp-block-button.hatoum-btn-whatsapp:not(:has(.hatoum-btn-whatsapp)) > :is(a, button).wp-block-button__link {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.65em;
	isolation: isolate;
	box-sizing: border-box;
	margin: 0;
	color: var(--hatoum-btn-whatsapp-fg);
	background-color: var(--hatoum-btn-whatsapp-bg);
	background-image: var(--hatoum-btn-sheen);
	background-repeat: no-repeat;
	background-size: 55% 100%;
	background-position: -70% 0;
	border: 2px solid transparent;
	border-radius: var(--hatoum-btn-radius);
	font-family: inherit;
	font-size: var(--hatoum-btn-font-size);
	font-weight: 300;
	line-height: 1.15;
	letter-spacing: 0.08em;
	text-transform: capitalize;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	overflow: hidden;
	-webkit-appearance: none;
	appearance: none;
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.18) inset,
		0 8px 22px -10px var(--hatoum-btn-whatsapp-ring),
		0 2px 6px -2px rgba(0, 40, 20, 0.18);
	transition:
		background-color 0.2s ease,
		background-position 0.7s var(--hatoum-btn-ease),
		box-shadow 0.3s var(--hatoum-btn-ease),
		color 0.2s ease;
}

.hatoum-btn-whatsapp:hover,
.hatoum-btn-whatsapp:focus-visible {
	color: var(--hatoum-btn-whatsapp-fg);
	background-color: var(--hatoum-btn-whatsapp-bg-hover);
	background-image: var(--hatoum-btn-sheen);
	background-position: 170% 0;
	border: 2px solid transparent;
	opacity: 1;
	transform: none;
	text-decoration: none;
	filter: none;
}

.wp-block-button.hatoum-btn-whatsapp:not(:has(.hatoum-btn-whatsapp)):hover > :is(a, button).wp-block-button__link,
.wp-block-button.hatoum-btn-whatsapp:not(:has(.hatoum-btn-whatsapp)):focus-within > :is(a, button).wp-block-button__link {
	color: var(--hatoum-btn-whatsapp-fg);
	background-color: var(--hatoum-btn-whatsapp-bg-hover);
	background-image: var(--hatoum-btn-sheen);
	background-position: 170% 0;
}

.wp-block-button:has(.hatoum-btn-whatsapp),
.wp-block-button.hatoum-btn-whatsapp {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: fit-content !important;
	max-width: 100% !important;
	flex: 0 1 auto !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}

.wp-block-button__link.hatoum-btn-whatsapp.wp-element-button,
.wp-block-button__link.hatoum-btn-whatsapp.has-background,
.wp-block-button.hatoum-btn-whatsapp:not(:has(.hatoum-btn-whatsapp)) > .wp-block-button__link.wp-element-button {
	padding: 1.05em 2.1em !important;
}

.wp-block-button__link.hatoum-btn-primary.has-background:hover,
.wp-block-button__link.hatoum-btn-primary.has-background:focus-visible,
.wp-block-button__link.hatoum-btn-primary.has-primary-background-color:hover,
.wp-block-button__link.hatoum-btn-primary.has-primary-background-color:focus-visible,
.wp-block-button.hatoum-btn-primary:not(:has(.hatoum-btn-primary)) > .wp-block-button__link.has-background:hover,
.wp-block-button.hatoum-btn-primary:not(:has(.hatoum-btn-primary)) > .wp-block-button__link.has-background:focus-visible,
.wp-block-button.hatoum-btn-primary:not(:has(.hatoum-btn-primary)) > .wp-block-button__link.has-primary-background-color:hover,
.wp-block-button.hatoum-btn-primary:not(:has(.hatoum-btn-primary)) > .wp-block-button__link.has-primary-background-color:focus-visible {
	background-color: var(--hatoum-btn-primary-bg-hover) !important;
	background-image: var(--hatoum-btn-sheen) !important;
	background-position: 170% 0 !important;
	color: var(--hatoum-btn-primary-fg) !important;
	opacity: 1 !important;
	filter: none !important;
	transform: none !important;
	text-decoration: none !important;
}

.hatoum-btn-primary:focus-visible,
.wp-block-button.hatoum-btn-primary:not(:has(.hatoum-btn-primary)):focus-within > :is(a, button).wp-block-button__link:focus-visible {
	outline: 2px solid var(--hatoum-btn-primary-bg);
	outline-offset: 3px;
}

.hatoum-btn-primary:active,
.wp-block-button.hatoum-btn-primary:not(:has(.hatoum-btn-primary)) > :is(a, button).wp-block-button__link:active {
	transform: none;
	transition-duration: 0.08s;
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.12) inset,
		0 4px 12px -6px var(--hatoum-btn-primary-ring);
}

.hatoum-btn-primary[disabled],
.hatoum-btn-primary[aria-disabled="true"] {
	opacity: 0.55;
	cursor: not-allowed;
	transform: none;
	box-shadow: none;
}

/* Optional arrows off by default — add `.hatoum-btn-show-arrow` to re-enable. */
.hatoum-btn__arrow,
.hatoum-btn-primary[data-arrow]::after {
	display: none !important;
	content: none !important;
}

.hatoum-btn-show-arrow .hatoum-btn__arrow,
.hatoum-btn-primary.hatoum-btn-show-arrow[data-arrow]::after {
	display: inline-block !important;
	content: "→" !important;
	font-size: 1.1em;
	line-height: 1;
	margin-left: 0.55em;
	transition: transform 0.3s var(--hatoum-btn-ease);
}

.hatoum-btn-show-arrow .hatoum-btn__arrow {
	margin-left: 0;
}

.hatoum-btn-primary.hatoum-btn-show-arrow:hover .hatoum-btn__arrow,
.hatoum-btn-primary.hatoum-btn-show-arrow:focus-visible .hatoum-btn__arrow,
.hatoum-btn-primary.hatoum-btn-show-arrow[data-arrow]:hover::after,
.hatoum-btn-primary.hatoum-btn-show-arrow[data-arrow]:focus-visible::after {
	transform: translateX(0.25em);
}

/* Outline on light â€” white fill, royal blue border; same footprint as .hatoum-btn-primary */
.hatoum-btn-outline-light,
a.hatoum-btn-outline-light,
button.hatoum-btn-outline-light,
.wp-block-button .hatoum-btn-outline-light,
.wp-block-button__link.hatoum-btn-outline-light {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.65em;
	isolation: isolate;
	box-sizing: border-box;
	margin: 0;
	padding: 1.05em 2.1em !important;
	color: var(--hatoum-btn-primary-bg);
	background: #ffffff;
	border: 2px solid var(--hatoum-btn-primary-bg);
	border-radius: var(--hatoum-btn-radius);
	font-family: inherit;
	font-size: var(--hatoum-btn-font-size, 1rem);
	font-weight: 300;
	line-height: 1.15;
	letter-spacing: 0.08em;
	text-transform: capitalize;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	overflow: hidden;
	-webkit-appearance: none;
	appearance: none;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.85) inset;
	transition:
		transform 0.3s var(--hatoum-btn-ease),
		color 0.2s ease,
		background-color 0.2s ease,
		border-color 0.2s ease,
		box-shadow 0.3s var(--hatoum-btn-ease);
}

.hatoum-btn-outline-light:hover,
.hatoum-btn-outline-light:focus-visible {
	color: var(--hatoum-btn-primary-bg-hover);
	background: rgba(0, 102, 223, 0.09);
	border-color: var(--hatoum-btn-primary-bg-hover);
	transform: none;
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.7) inset,
		0 14px 28px -12px var(--hatoum-btn-primary-ring);
	text-decoration: none;
}

.hatoum-btn-outline-light:focus-visible {
	outline: 2px solid var(--hatoum-btn-primary-bg);
	outline-offset: 3px;
}

.hatoum-btn-outline-light:active {
	transform: none;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.85) inset;
	transition-duration: 0.08s;
}

/* Outline on dark â€” transparent fill, white border + label (CTA â€œOur machinesâ€) */
.hatoum-btn-outline-on-dark,
a.hatoum-btn-outline-on-dark,
button.hatoum-btn-outline-on-dark,
.wp-block-button .hatoum-btn-outline-on-dark,
.wp-block-button__link.hatoum-btn-outline-on-dark {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.65em;
	box-sizing: border-box;
	margin: 0;
	padding: 1.05em 2.1em !important;
	color: #ffffff;
	background: transparent;
	border: 2px solid #ffffff;
	border-radius: var(--hatoum-btn-radius);
	font-family: inherit;
	font-size: var(--hatoum-btn-font-size, 1rem);
	font-weight: 300;
	line-height: 1.15;
	letter-spacing: 0.08em;
	text-transform: capitalize;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	box-shadow: none;
	transition:
		transform 0.3s var(--hatoum-btn-ease),
		color 0.2s ease,
		background-color 0.2s ease,
		border-color 0.2s ease;
}

/* Secondary â€” outline / ghost on light, fills on hover */
.hatoum-btn-secondary,
a.hatoum-btn-secondary,
button.hatoum-btn-secondary,
.wp-block-button .hatoum-btn-secondary,
.wp-block-button__link.hatoum-btn-secondary {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.65em;
	box-sizing: border-box;
	padding: calc(1.05em - 1px) calc(2.1em - 1px);
	margin: 0;
	color: var(--hatoum-btn-primary-bg);
	background: transparent;
	border: 1px solid currentColor;
	border-radius: var(--hatoum-btn-radius);
	font-family: inherit;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.15;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	overflow: hidden;
	-webkit-appearance: none;
	appearance: none;
	transition:
		transform 0.3s var(--hatoum-btn-ease),
		color 0.2s ease,
		background-color 0.2s ease,
		border-color 0.2s ease,
		box-shadow 0.3s var(--hatoum-btn-ease);
}

.hatoum-btn-secondary:hover,
.hatoum-btn-secondary:focus-visible {
	color: var(--hatoum-btn-primary-fg);
	background: var(--hatoum-btn-primary-bg);
	border-color: var(--hatoum-btn-primary-bg);
	transform: none;
	text-decoration: none;
}

.hatoum-btn-secondary:focus-visible {
	outline: 2px solid var(--hatoum-btn-primary-bg);
	outline-offset: 3px;
}

.hatoum-btn-secondary:active {
	transform: none;
	transition-duration: 0.08s;
}

/* On-dark variant â€” for use over the hero scrim / dark sections */
.hatoum-btn-secondary.is-on-dark {
	color: #ffffff;
	border-color: rgba(255, 255, 255, 0.55);
}

.hatoum-btn-secondary.is-on-dark:hover,
.hatoum-btn-secondary.is-on-dark:focus-visible {
	color: var(--hatoum-btn-primary-bg);
	background: #ffffff;
	border-color: #ffffff;
}

/* Ghost â€” minimal text-only button with an underline reveal */
.hatoum-btn-ghost {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	padding: 0.65em 0.35em;
	color: var(--hatoum-btn-primary-bg);
	background: transparent;
	border: 0;
	font-family: inherit;
	font-size: 0.95rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: color 0.2s ease;
}

.hatoum-btn-ghost::after {
	content: "";
	position: absolute;
	left: 0.25em;
	right: 0.25em;
	bottom: 0.35em;
	height: 1px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.3s var(--hatoum-btn-ease);
}

.hatoum-btn-ghost:hover::after,
.hatoum-btn-ghost:focus-visible::after {
	transform: scaleX(1);
}

/* Sizes */
.hatoum-btn-sm {
	font-size: 0.8rem;
	padding: 0.75em 1.45em;
}

.hatoum-btn-lg {
	font-size: 1.125rem;
	padding: 1.25em 2.6em;
}

@media (prefers-reduced-motion: reduce) {
	.hatoum-btn-primary,
	.hatoum-btn-primary[data-arrow]::after,
	.hatoum-btn-primary .hatoum-btn__arrow,
	.wp-block-button.hatoum-btn-primary:not(:has(.hatoum-btn-primary)) > :is(a, button).wp-block-button__link,
	a.et_pb_button.hatoum-btn-primary,
	.hatoum-btn-secondary,
	.hatoum-btn-outline-light,
	.hatoum-btn-ghost,
	.hatoum-btn-ghost::after {
		transition: none;
	}

	.hatoum-btn-primary:hover,
	.hatoum-btn-primary:focus-visible,
	.wp-block-button.hatoum-btn-primary:not(:has(.hatoum-btn-primary)):hover > :is(a, button).wp-block-button__link,
	.wp-block-button.hatoum-btn-primary:not(:has(.hatoum-btn-primary)):focus-within > :is(a, button).wp-block-button__link,
	.hatoum-btn-secondary:hover,
	.hatoum-btn-secondary:focus-visible,
	.hatoum-btn-outline-light:hover,
	.hatoum-btn-outline-light:focus-visible {
		transform: none;
	}
}

/* Dark sections: outline-on-dark + legacy outline-light on dark CTA */
.hatoum-cta-section.has-base-alt-background-color .hatoum-btn-outline-light,
.hatoum-cta-section.hatoum-cta-section--dark .hatoum-btn-outline-light,
.hatoum-cta-section.hatoum-cta-section--dark .hatoum-btn-outline-on-dark,
.hatoum-btn-outline-on-dark {
	background: transparent !important;
	color: #ffffff !important;
	border: 2px solid #ffffff !important;
	box-shadow: none !important;
}

.hatoum-cta-section.has-base-alt-background-color .hatoum-btn-outline-light:hover,
.hatoum-cta-section.has-base-alt-background-color .hatoum-btn-outline-light:focus-visible,
.hatoum-cta-section.hatoum-cta-section--dark .hatoum-btn-outline-light:hover,
.hatoum-cta-section.hatoum-cta-section--dark .hatoum-btn-outline-light:focus-visible,
.hatoum-cta-section.hatoum-cta-section--dark .hatoum-btn-outline-on-dark:hover,
.hatoum-cta-section.hatoum-cta-section--dark .hatoum-btn-outline-on-dark:focus-visible,
.hatoum-btn-outline-on-dark:hover,
.hatoum-btn-outline-on-dark:focus-visible {
	color: #ffffff !important;
	background: rgba(255, 255, 255, 0.1) !important;
	border-color: #ffffff !important;
}
/* --- Divi Button module (class on .et_pb_button) ------------------------- */

/* Divi “button icon” uses ::after — hide so Hatoum sheen + label stay clean */
a.et_pb_button[class*="hatoum-btn"]:not(.hatoum-btn-whatsapp)::after,
.et_pb_button[class*="hatoum-btn"]:not(.hatoum-btn-whatsapp)::after {
	display: none !important;
	content: none !important;
	opacity: 0 !important;
	width: 0 !important;
	height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}

a.et_pb_button[class*="hatoum-btn"]:not(.hatoum-btn-whatsapp) .et-pb-icon {
	display: none !important;
}

/*
 * Divi Button icon — WhatsApp only.
 * On this site Divi renders the picker glyph on ::before (FontAwesome + data-icon), not ::after.
 * Do not hide ::before here — that was blocking the icon.
 */
body #page-container .et_pb_section a.et_pb_button.hatoum-btn-whatsapp[data-icon]:not([data-icon=""])::before,
body #page-container .et_pb_section .et_pb_button.hatoum-btn-whatsapp[data-icon]:not([data-icon=""])::before,
a.et_pb_button.hatoum-btn-whatsapp[data-icon]:not([data-icon=""])::before,
.et_pb_button.hatoum-btn-whatsapp[data-icon]:not([data-icon=""])::before {
	content: attr(data-icon) !important;
	font-family: FontAwesome, "Font Awesome 5 Free", "Font Awesome 6 Free", ETmodules !important;
	font-weight: 400 !important;
	font-size: 1.25em !important;
	line-height: 1 !important;
	speak: never;
	display: inline-block !important;
	opacity: 1 !important;
	visibility: visible !important;
	color: inherit !important;
	position: relative !important;
	top: auto !important;
	right: auto !important;
	left: auto !important;
	bottom: auto !important;
	width: auto !important;
	height: auto !important;
	margin: 0 0.45em 0 0 !important;
	margin-left: 0 !important;
	padding: 0 !important;
	transform: none !important;
	vertical-align: middle;
	order: -1;
}

body #page-container .et_pb_section a.et_pb_button.hatoum-btn-whatsapp:hover::before,
body #page-container .et_pb_section a.et_pb_button.hatoum-btn-whatsapp:focus::before,
a.et_pb_button.hatoum-btn-whatsapp:hover::before,
a.et_pb_button.hatoum-btn-whatsapp:focus::before {
	opacity: 1 !important;
	margin: 0 0.45em 0 0 !important;
	margin-left: 0 !important;
}

/* Divi module CSS hides ::after for this button — keep it off */
body #page-container .et_pb_section a.et_pb_button.hatoum-btn-whatsapp::after,
body #page-container .et_pb_section .et_pb_button.hatoum-btn-whatsapp::after,
a.et_pb_button.hatoum-btn-whatsapp::after,
.et_pb_button.hatoum-btn-whatsapp::after {
	display: none !important;
	content: none !important;
	opacity: 0 !important;
	width: 0 !important;
	height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}

a.et_pb_button.hatoum-btn-whatsapp .et-pb-icon,
.et_pb_button.hatoum-btn-whatsapp .et-pb-icon {
	display: inline-block !important;
	font-family: FontAwesome, ETmodules !important;
	font-size: 1.25em !important;
	line-height: 1 !important;
	opacity: 1 !important;
	margin: 0 0.45em 0 0 !important;
}

a.et_pb_button.hatoum-btn-whatsapp,
.et_pb_button.hatoum-btn-whatsapp {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-direction: row !important;
	gap: 0.45em !important;
	padding: 1.05em 2.1em !important;
	position: relative !important;
	overflow: hidden !important;
	isolation: isolate !important;
}

/* Beat Divi inline .et_pb_button_N padding-left/right asymmetry (icon offset) */
body #page-container .et_pb_section a.et_pb_button.hatoum-btn-whatsapp,
body #page-container .et_pb_section .et_pb_button.hatoum-btn-whatsapp,
body #page-container a.et_pb_button.hatoum-btn-whatsapp,
body.et_pb_button_helper_class #page-container a.et_pb_button.hatoum-btn-whatsapp {
	padding: 1.05em 2.1em !important;
	padding-top: 1.05em !important;
	padding-bottom: 1.05em !important;
	padding-left: 2.1em !important;
	padding-right: 2.1em !important;
}

body #page-container a.et_pb_button.hatoum-btn-whatsapp,
body.et_pb_button_helper_class #page-container a.et_pb_button.hatoum-btn-whatsapp {
	background-color: var(--hatoum-btn-whatsapp-bg) !important;
	background-image: var(--hatoum-btn-sheen) !important;
	background-repeat: no-repeat !important;
	background-size: 55% 100% !important;
	background-position: -70% 0 !important;
	color: var(--hatoum-btn-whatsapp-fg) !important;
	border: 2px solid transparent !important;
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.18) inset,
		0 8px 22px -10px var(--hatoum-btn-whatsapp-ring),
		0 2px 6px -2px rgba(0, 40, 20, 0.18) !important;
	transition:
		background-position 0.7s var(--hatoum-btn-ease),
		background-color 0.2s ease !important;
}

body #page-container .et_pb_section a.et_pb_button.hatoum-btn-whatsapp:hover,
body #page-container .et_pb_section a.et_pb_button.hatoum-btn-whatsapp:focus,
body #page-container a.et_pb_button.hatoum-btn-whatsapp:hover,
body #page-container a.et_pb_button.hatoum-btn-whatsapp:focus,
body.et_pb_button_helper_class #page-container a.et_pb_button.hatoum-btn-whatsapp:hover,
body.et_pb_button_helper_class #page-container a.et_pb_button.hatoum-btn-whatsapp:focus {
	background-color: var(--hatoum-btn-whatsapp-bg-hover) !important;
	background-image: var(--hatoum-btn-sheen) !important;
	background-position: 170% 0 !important;
	color: var(--hatoum-btn-whatsapp-fg) !important;
	border: 2px solid transparent !important;
	transform: none !important;
	opacity: 1 !important;
	padding: 1.05em 2.1em !important;
	padding-left: 2.1em !important;
	padding-right: 2.1em !important;
}

a.et_pb_button.hatoum-btn-primary,
.et_pb_button.hatoum-btn-primary {
	padding: 1.05em 2.1em !important;
	position: relative !important;
	overflow: hidden !important;
	isolation: isolate !important;
}

/* Divi overwrites ::before/background — sheen is background-position on the link */
a.et_pb_button.hatoum-btn-primary::before {
	display: none !important;
	content: none !important;
}

body #page-container a.et_pb_button.hatoum-btn-primary,
body.et_pb_button_helper_class #page-container a.et_pb_button.hatoum-btn-primary {
	background-color: var(--hatoum-btn-primary-bg) !important;
	background-image: var(--hatoum-btn-sheen) !important;
	background-repeat: no-repeat !important;
	background-size: 55% 100% !important;
	background-position: -70% 0 !important;
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.18) inset,
		0 8px 22px -10px var(--hatoum-btn-primary-ring),
		0 2px 6px -2px rgba(0, 11, 29, 0.18) !important;
	transition:
		background-position 0.7s var(--hatoum-btn-ease),
		background-color 0.2s ease !important;
}

body #page-container a.et_pb_button.hatoum-btn-primary:hover,
body #page-container a.et_pb_button.hatoum-btn-primary:focus,
body.et_pb_button_helper_class #page-container a.et_pb_button.hatoum-btn-primary:hover,
body.et_pb_button_helper_class #page-container a.et_pb_button.hatoum-btn-primary:focus {
	background-color: var(--hatoum-btn-primary-bg-hover) !important;
	background-image: var(--hatoum-btn-sheen) !important;
	background-position: 170% 0 !important;
}

a.et_pb_button.hatoum-btn-outline-light,
a.et_pb_button.hatoum-btn-outline-on-dark,
a.et_pb_button.hatoum-btn-secondary {
	padding: 1.05em 2.1em !important;
}

a.et_pb_button.hatoum-btn-primary,
.et_pb_button.hatoum-btn-primary,
a.et_pb_button.hatoum-btn-whatsapp,
.et_pb_button.hatoum-btn-whatsapp,
a.et_pb_button.hatoum-btn-outline-light,
a.et_pb_button.hatoum-btn-outline-on-dark,
a.et_pb_button.hatoum-btn-secondary,
a.et_pb_button.hatoum-btn-ghost {
	font-family: inherit !important;
	text-decoration: none !important;
}

/* Divi defaults use !important — Hatoum classes must win */
body.et_pb_button_helper_class a.et_pb_button.hatoum-btn-outline-light,
body.et_pb_button_helper_class a.et_pb_button.hatoum-btn-outline-on-dark,
body.et_pb_button_helper_class a.et_pb_button.hatoum-btn-secondary,
a.et_pb_button.hatoum-btn-outline-light,
a.et_pb_button.hatoum-btn-outline-on-dark,
a.et_pb_button.hatoum-btn-secondary {
	border-width: 2px !important;
	box-sizing: border-box !important;
}

body.et_pb_button_helper_class a.et_pb_button.hatoum-btn-primary,
body #page-container a.et_pb_button.hatoum-btn-primary,
a.et_pb_button.hatoum-btn-primary,
body.et_pb_button_helper_class a.et_pb_button.hatoum-btn-whatsapp,
body #page-container a.et_pb_button.hatoum-btn-whatsapp,
a.et_pb_button.hatoum-btn-whatsapp {
	box-sizing: border-box !important;
	border: 2px solid transparent !important;
	outline: none !important;
}

body.et_pb_button_helper_class a.et_pb_button.hatoum-btn-primary,
body #page-container a.et_pb_button.hatoum-btn-primary,
a.et_pb_button.hatoum-btn-primary {
	color: var(--hatoum-btn-primary-fg) !important;
}

body.et_pb_button_helper_class a.et_pb_button.hatoum-btn-whatsapp,
body #page-container a.et_pb_button.hatoum-btn-whatsapp,
a.et_pb_button.hatoum-btn-whatsapp {
	color: var(--hatoum-btn-whatsapp-fg) !important;
}

body #page-container a.et_pb_button.hatoum-btn-primary:hover,
body #page-container a.et_pb_button.hatoum-btn-primary:focus,
body.et_pb_button_helper_class #page-container a.et_pb_button.hatoum-btn-primary:hover,
body.et_pb_button_helper_class #page-container a.et_pb_button.hatoum-btn-primary:focus {
	color: var(--hatoum-btn-primary-fg) !important;
	border: 2px solid transparent !important;
	border-width: 2px !important;
	outline: none !important;
	opacity: 1 !important;
	transform: none !important;
	scale: none !important;
	padding: 1.05em 2.1em !important;
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.18) inset,
		0 8px 22px -10px var(--hatoum-btn-primary-ring),
		0 2px 6px -2px rgba(0, 11, 29, 0.18) !important;
}

/* Divi hover often scales, padding, or border — lock footprint for all Hatoum button classes */
body #page-container a.et_pb_button[class*="hatoum-btn"],
body.et_pb_button_helper_class #page-container a.et_pb_button[class*="hatoum-btn"] {
	box-sizing: border-box !important;
}

body #page-container a.et_pb_button[class*="hatoum-btn"]:hover,
body #page-container a.et_pb_button[class*="hatoum-btn"]:focus,
body.et_pb_button_helper_class #page-container a.et_pb_button[class*="hatoum-btn"]:hover,
body.et_pb_button_helper_class #page-container a.et_pb_button[class*="hatoum-btn"]:focus {
	transform: none !important;
	scale: none !important;
	letter-spacing: 0.08em !important;
	outline: none !important;
}

body #page-container a.et_pb_button.hatoum-btn-primary:hover,
body #page-container a.et_pb_button.hatoum-btn-primary:focus,
body.et_pb_button_helper_class #page-container a.et_pb_button.hatoum-btn-primary:hover,
body.et_pb_button_helper_class #page-container a.et_pb_button.hatoum-btn-primary:focus {
	border: 2px solid transparent !important;
}

a.et_pb_button.hatoum-btn-outline-light {
	background-color: #ffffff !important;
	color: var(--hatoum-btn-primary-bg) !important;
	border-color: var(--hatoum-btn-primary-bg) !important;
}

a.et_pb_button.hatoum-btn-outline-on-dark {
	background-color: transparent !important;
	color: #ffffff !important;
	border-color: #ffffff !important;
}

a.et_pb_button.hatoum-btn-outline-on-dark:hover,
a.et_pb_button.hatoum-btn-outline-on-dark:focus {
	background-color: rgba(255, 255, 255, 0.1) !important;
	color: #ffffff !important;
	border-color: #ffffff !important;
	opacity: 1 !important;
}
