/* ==========================================================================
   Elementor adapter — maps the original AlphaLabs design CSS (home.css,
   pages.css) onto Elementor's container/widget markup. Loaded last.
   ========================================================================== */

/* Brand colours from the Customizer flow into the design tokens. */
.alpx-main .alpx-home {
	--home-teal: var(--alpx-teal, #148d93);
	--home-teal-dark: var(--alpx-teal-dark, #0a6670);
	--home-orange: var(--alpx-orange, #ef7d21);
	--home-ink: var(--alpx-ink, #082d38);
}

/* --- Widget wrappers: no default spacing, no positioning context ------- */
.alpx-main .elementor-widget:not(:last-child) { margin-block-end: 0; }
.alpx-main .elementor-widget-html,
.alpx-main .elementor-widget-text-editor,
.alpx-main .elementor-widget-heading,
.alpx-main .elementor-widget-button,
.alpx-main .elementor-widget-shortcode { position: static; }
.alpx-main .elementor-widget-image { text-align: initial; }
.alpx-main .elementor-widget-image img { display: block; width: 100%; height: auto; vertical-align: top; }
.alpx-main .elementor-widget-image .elementor-widget-container { line-height: 0; }

/* Elementor applies its own typography to headings/text when global fonts are
   on; the theme switches them off, but keep a safety net. */
.alpx-main .alpx-home .elementor-heading-title {
	font-family: inherit;
	margin: 0;
	padding: 0;
}
.alpx-main .alpx-home .elementor-widget-text-editor { color: inherit; font-family: inherit; }

/* Containers: let the design CSS win for grid/flex layouts. */
.alpx-main .e-con { --padding-block-start: 0; --padding-block-end: 0; --padding-inline-start: 0; --padding-inline-end: 0; }
.alpx-main .alpx-home-hero__grid,
.alpx-main .alpx-home-trust__grid,
.alpx-main .alpx-home-category-grid,
.alpx-main .alpx-home-confidence__grid,
.alpx-main .alpx-home-quality__grid,
.alpx-main .alpx-home-benefits__grid,
.alpx-main .alpx-home-faq__header,
.alpx-main .alpx-home-faq__body,
.alpx-main .alpx-home-final-cta__inner { display: grid; }
.alpx-main .alpx-home-shell { width: min(1320px, calc(100% - 48px)); margin-inline: auto; }
.alpx-main .alpx-home-trust__shell { width: min(1440px, calc(100% - 48px)); }
.alpx-main .alpx-home-categories__shell { width: min(1480px, calc(100% - 48px)); }

/* --- Hero ---------------------------------------------------------------- */
.alpx-main .alpx-home-hero { display: flex; }
.alpx-main .alpx-home-hero__background { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; margin: 0; }
.alpx-main .alpx-home-hero__background .elementor-widget-container { height: 100%; }
.alpx-main .alpx-home-hero__background img { width: 100%; height: 100%; object-fit: cover; object-position: center; pointer-events: none; user-select: none; }
.alpx-main .alpx-home-hero__visual { display: block; }
.alpx-main .alpx-home-hero__layer { position: absolute; width: auto; }
.alpx-main .alpx-home-hero__layer--spray { width: 31%; }
.alpx-main .alpx-home-hero__layer--main { width: 56%; }
.alpx-main .alpx-home-hero__layer--side { width: 35%; }
.alpx-main .alpx-home-hero h1 .alpx-home-hero__dot { display: inline; white-space: normal; }
.alpx-main .alpx-home-hero__copy .alpx-home-actions { margin-top: 31px; }
.alpx-main .alpx-home-hero .alpx-home-rating { margin: 31px 0 0; }

/* --- Buttons (Elementor button widget inside .alpx-home-button wrappers) --- */
.alpx-main .alpx-home-actions { display: flex; align-items: center; flex-wrap: wrap; }
.alpx-main .alpx-home-actions .elementor-widget-button { width: auto; }
.alpx-main .alpx-btn .elementor-button {
	min-height: 50px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 13px 23px;
	border: 1px solid transparent;
	border-radius: 999px;
	background: transparent;
	color: var(--home-ink);
	fill: currentColor;
	font-family: inherit;
	font-size: 14px;
	font-weight: 800;
	line-height: 1;
	text-decoration: none;
	transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}
.alpx-main .alpx-btn .elementor-button:hover { transform: translateY(-2px); }
.alpx-main .alpx-btn .elementor-button-content-wrapper { display: inline-flex; align-items: center; gap: 8px; }
.alpx-main .alpx-btn .elementor-button-text { display: inline-flex; align-items: center; gap: 10px; }
.alpx-main .alpx-btn .elementor-button-text span { font-size: 1.2em; line-height: 1; transition: transform .2s ease; }
.alpx-main .alpx-btn .elementor-button:hover .elementor-button-text span { transform: translateX(3px); }

.alpx-main .alpx-btn--primary .elementor-button {
	background: linear-gradient(135deg, #f58b28, #e96913);
	box-shadow: 0 12px 24px rgba(239, 125, 33, .24);
	color: #fff;
}
.alpx-main .alpx-btn--primary .elementor-button:hover { box-shadow: 0 16px 30px rgba(239, 125, 33, .3); color: #fff; }

.alpx-main .alpx-btn--secondary .elementor-button {
	border-color: #d7e3e1;
	background: rgba(255, 255, 255, .82);
	color: var(--home-ink);
}
.alpx-main .alpx-btn--secondary .elementor-button:hover { border-color: var(--home-teal); background: #fff; color: var(--home-teal-dark); }

.alpx-main .alpx-btn--dark .elementor-button {
	background: var(--home-deep);
	box-shadow: 0 13px 26px rgba(6, 38, 50, .2);
	color: #fff;
}
.alpx-main .alpx-btn--dark .elementor-button:hover { background: var(--home-teal-dark); color: #fff; }

/* Hero button variants */
.alpx-main .alpx-home-hero .alpx-btn--primary .elementor-button {
	min-height: 58px;
	gap: 12px;
	padding-inline: 30px;
	border-radius: 8px;
	font-size: 16px;
	box-shadow: 0 14px 28px rgba(239, 125, 33, .23);
}
.alpx-main .alpx-home-hero .alpx-btn--primary .elementor-button-text span { font-size: 22px; }
.alpx-main .alpx-home-hero .alpx-btn--secondary .elementor-button {
	min-height: 58px;
	padding-inline: 28px;
	border-radius: 8px;
	border-color: rgba(8, 78, 86, .18);
	background: rgba(255, 255, 255, .78);
	box-shadow: 0 12px 26px rgba(6, 45, 56, .06);
	font-size: 14px;
	backdrop-filter: blur(8px);
}
.alpx-main .alpx-home-hero .alpx-btn--secondary .elementor-button:hover { border-color: var(--home-teal); background: #fff; box-shadow: 0 14px 28px rgba(6, 45, 56, .1); color: var(--home-teal-dark); }

/* Quality section dark button */
.alpx-main .alpx-home-quality .alpx-btn--dark .elementor-button { gap: 10px; background: linear-gradient(135deg, #073945, #095565); }
.alpx-main .alpx-home-quality .alpx-btn--dark .elementor-button-text span { font-size: 17px; }

/* --- Trust rail ---------------------------------------------------------- */
.alpx-main .alpx-home-trust__item { display: flex; align-items: center; }
.alpx-main .alpx-home-trust__item > .e-con { flex: 1 1 auto; width: auto; min-width: 0; }
.alpx-main .alpx-home-trust__item .elementor-widget-html { width: auto; flex: 0 0 auto; }
.alpx-main .alpx-home-trust__item:nth-child(even) .alpx-home-trust__icon { border-color: rgba(239, 125, 33, .11); background: #fff1e5; box-shadow: 0 7px 18px rgba(239, 125, 33, .06); color: var(--home-orange); }

/* --- Categories ---------------------------------------------------------- */
.alpx-main .alpx-home-section-heading { display: flex; align-items: flex-end; justify-content: space-between; }
.alpx-main .alpx-home-section-heading > .e-con { width: auto; }
.alpx-main .alpx-home-category { display: block; min-height: 340px; }
.alpx-main .alpx-home-category__copy { display: flex; align-items: flex-start; justify-content: space-between; }
.alpx-main .alpx-home-category__copy .elementor-widget-heading { width: auto; flex: 1 1 auto; }
.alpx-main .alpx-home-category__copy .elementor-widget-html { width: auto; flex: 0 0 auto; }
.alpx-main .alpx-home-category__media { position: absolute; }
.alpx-main .alpx-home-category__media .elementor-widget-container,
.alpx-main .alpx-home-category__media img { height: 100%; }
.alpx-main .alpx-home-category-grid .alpx-home-category:nth-child(1) { --alpx-category-index: 0; }
.alpx-main .alpx-home-category-grid .alpx-home-category:nth-child(2) { --alpx-category-index: 1; }
.alpx-main .alpx-home-category-grid .alpx-home-category:nth-child(3) { --alpx-category-index: 2; }
.alpx-main .alpx-home-category-grid .alpx-home-category:nth-child(4) { --alpx-category-index: 3; }
.alpx-main .alpx-home-category-grid .alpx-home-category:nth-child(5) { --alpx-category-index: 4; }

/* --- Confidence ---------------------------------------------------------- */
.alpx-main .alpx-home-confidence__visual { display: flex; }
.alpx-main .alpx-home-confidence__panel { display: block; }
.alpx-main .alpx-home-confidence__sheet { position: absolute; display: block; }
.alpx-main .alpx-home-confidence__sheet .elementor-widget-image,
.alpx-main .alpx-home-confidence__sheet .elementor-widget-container { height: 100%; }
.alpx-main .alpx-home-confidence__vial-wrap { position: absolute; display: block; }
.alpx-main .alpx-home-confidence__supports { position: absolute; inset: 0; pointer-events: none; }
.alpx-main .alpx-home-confidence__support { pointer-events: auto; }
.alpx-main .alpx-home-confidence__copy h2 span { display: block; }

/* --- Quality ------------------------------------------------------------- */
.alpx-main .alpx-home-quality__visual { display: block; }
.alpx-main .alpx-home-quality__depth { position: absolute; }
.alpx-main .elementor-widget-html.alpx-home-quality__depth { position: absolute; width: auto; }
.alpx-main .elementor-widget-image.alpx-home-quality__depth { position: absolute; }
.alpx-main .alpx-home-quality__depth--stage { position: absolute; display: block; }
.alpx-main .alpx-home-quality__stage { display: block; }

/* --- Benefits ------------------------------------------------------------ */
.alpx-main .alpx-home-benefits__card { display: block; }

/* --- FAQ (Elementor nested accordion) ------------------------------------ */
.alpx-main .alpx-home-faq__header { display: grid; }
.alpx-main .alpx-home-faq__header > .e-con { width: auto; }
.alpx-main .alpx-home-faq__body { display: grid; }
.alpx-main .alpx-home-faq__image { display: flex; align-items: stretch; }
.alpx-main .alpx-home-faq__image .elementor-widget-image,
.alpx-main .alpx-home-faq__image .elementor-widget-container { height: 100%; }
.alpx-main .alpx-home-faq__image a.alpx-home-faq__cta {
	position: absolute;
	left: 16px;
	right: 16px;
	bottom: -16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 15px;
	padding: 18px 20px;
	border-radius: 20px;
	background: linear-gradient(135deg, #ec7f25, #cf6518);
	color: #fff;
	box-shadow: 0 18px 32px rgba(207, 101, 24, .28);
	font-size: 13px;
	line-height: 1.35;
	transition: transform .24s ease, box-shadow .24s ease, background .24s ease;
}
.alpx-main .alpx-home-faq__image a.alpx-home-faq__cta:hover { transform: translateY(-4px); background: linear-gradient(135deg, #0b5965, #094956); color: #fff; }
.alpx-main .alpx-home-faq__image a.alpx-home-faq__cta strong { display: block; font-size: 14px; }
.alpx-main .alpx-home-faq__image a.alpx-home-faq__cta span { flex: 0 0 auto; display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: rgba(255, 255, 255, .16); font-size: 17px; margin-left: auto; }

.alpx-main .alpx-home-faq__list.elementor-widget { min-height: 430px; padding: 12px; display: flex; flex-direction: column; justify-content: center; border: 1px solid rgba(12, 59, 68, .075); border-radius: 28px; background: linear-gradient(180deg, rgba(255,255,255,.86) 0%, rgba(252,254,254,.92) 100%); box-shadow: 0 18px 36px rgba(8, 43, 52, .065); backdrop-filter: blur(10px); }
.alpx-main .alpx-home-faq__list .e-n-accordion { display: flex; flex-direction: column; gap: 9px; }
.alpx-main .alpx-home-faq__list .e-n-accordion-item {
	position: relative;
	margin: 0;
	border: 1px solid rgba(14, 58, 68, .08);
	border-radius: 20px;
	background: rgba(255, 255, 255, .82);
	transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease, background .25s ease;
}
.alpx-main .alpx-home-faq__list .e-n-accordion-item:hover { transform: translateY(-2px); border-color: rgba(24, 116, 124, .12); box-shadow: 0 16px 28px rgba(8, 43, 52, .05); }
.alpx-main .alpx-home-faq__list .e-n-accordion-item[open] { border-color: rgba(24, 116, 124, .14); background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(248,252,252,.93) 100%); box-shadow: 0 18px 34px rgba(8, 43, 52, .07); }
.alpx-main .alpx-home-faq__list .e-n-accordion-item-title {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	padding: 20px 20px;
	border: 0;
	background: transparent;
	color: var(--home-ink);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.45;
	letter-spacing: -.012em;
	text-align: left;
	cursor: pointer;
	list-style: none;
}
.alpx-main .alpx-home-faq__list .e-n-accordion-item-title::-webkit-details-marker { display: none; }
.alpx-main .alpx-home-faq__list .e-n-accordion-item-title-header { max-width: 92%; }
.alpx-main .alpx-home-faq__list .e-n-accordion-item-title-text { margin: 0; font: inherit; color: inherit; }
.alpx-main .alpx-home-faq__list .e-n-accordion-item-title::after {
	content: "+";
	width: 34px;
	height: 34px;
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: linear-gradient(145deg, #edf8f7, #fbfdfc);
	color: var(--home-teal-dark);
	font-size: 19px;
	font-style: normal;
	font-weight: 600;
	box-shadow: inset 0 0 0 1px rgba(38, 133, 141, .10);
	transition: transform .22s ease, background .22s ease, color .22s ease, box-shadow .22s ease;
}
.alpx-main .alpx-home-faq__list .e-n-accordion-item[open] > .e-n-accordion-item-title::after { transform: rotate(45deg); background: linear-gradient(145deg, #ec7f25, #d76d1b); color: #fff; box-shadow: 0 10px 20px rgba(215, 109, 27, .22); }
.alpx-main .alpx-home-faq__list .e-n-accordion-item-title .e-n-accordion-item-title-icon { display: none; }
.alpx-main .alpx-home-faq__list .alpx-faq-answer { padding: 0 20px 20px; color: #536b6f; font-size: 14px; line-height: 1.76; }
.alpx-main .alpx-home-faq__list .alpx-faq-answer p { margin: 0 0 10px; }
.alpx-main .alpx-home-faq__list .alpx-faq-answer p:last-child { margin-bottom: 0; }
.alpx-main .alpx-home-faq__list .alpx-faq-answer strong { color: var(--home-ink); }

/* --- Final CTA ----------------------------------------------------------- */
.alpx-main .alpx-home-final-cta__footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 18px; }
.alpx-main .alpx-home-final-cta__footer > .e-con { width: auto; }
.alpx-main .alpx-home-final-cta__footer .elementor-widget-text-editor { width: auto; }
.alpx-main .alpx-home-final-cta__visual { display: block; }
.alpx-main .alpx-home-final-cta__stage { display: block; }
.alpx-main .alpx-home-final-cta__group img { width: 112%; max-width: 700px; }

/* --- Generic page sections (About, Contact, COA, legal) ------------------- */
.alpx-main .alpx-page-grid,
.alpx-main .alpx-grid-2,
.alpx-main .alpx-grid-3,
.alpx-main .alpx-grid-4 { display: grid; }

/* --- Responsive ---------------------------------------------------------- */
@media (max-width: 1024px) {
	.alpx-main .alpx-home-section-heading { align-items: flex-end; }
}
@media (max-width: 820px) {
	.alpx-main .alpx-home-hero__grid { display: grid; }
	.alpx-main .alpx-home-faq__body,
	.alpx-main .alpx-home-faq__header { grid-template-columns: 1fr; }
	.alpx-main .alpx-home-faq__list.elementor-widget { min-height: 0; }
}
@media (max-width: 600px) {
	.alpx-main .alpx-home-actions .elementor-widget-button { width: 100%; }
	.alpx-main .alpx-home-actions .elementor-button { width: 100%; }
}

/* Final CTA buttons stretch on small screens like the original. */
@media (max-width: 600px) {
	.alpx-main .alpx-home-actions--final .elementor-widget-button { flex: 1 1 auto; }
}

/* Hero buttons on small screens (mirrors the original breakpoints) */
@media (max-width: 600px) {
	.alpx-main .alpx-home-hero .alpx-home-actions { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: 9px; margin-top: 23px; }
	.alpx-main .alpx-home-actions .elementor-widget-button { width: 100%; }
	.alpx-main .alpx-home-hero .alpx-btn .elementor-button { width: 100%; min-width: 0; min-height: 50px; padding-inline: 14px; border-radius: 8px; font-size: 13px; }
	.alpx-main .alpx-home-hero .alpx-btn--primary .elementor-button-text span { font-size: 19px; }
}
@media (max-width: 390px) {
	.alpx-main .alpx-home-hero .alpx-btn .elementor-button { padding-inline: 10px; font-size: 11.5px; }
}