/*!
 * ANTELYX design system (child theme of Astra)
 *
 * Contents
 *  1. Fonts (self-hosted, OFL)
 *  2. Tokens (colour, type, space, radius, shadow)
 *  3. Base typography
 *  4. Focus, accessibility, motion
 *  5. Buttons (primary / secondary / utility)
 *  6. Forms
 *  7. Layout helpers
 *  8. Image ratios and placeholders
 *  9. Cards, tags, statistics
 * 10. Species components (rendered by the ANTELYX Core shortcodes)
 * 11. Astra chrome (announcement bar, header, footer)
 * 12. WooCommerce
 *
 * Colour values below are fallbacks. The editable source is Elementor >
 * Site Settings > Global Colors, whose variables (--e-global-color-ad...) are
 * read first. Change brand colours there; update the same hex values in
 * Appearance > Customize > Global > Colors so Astra chrome and WooCommerce match.
 */

/* ---------------------------------------------------------------------------
 * 1. Fonts
 * ------------------------------------------------------------------------- */
@font-face {
	font-family: "Manrope";
	src: url("../fonts/manrope/Manrope-VariableFont_wght.woff2") format("woff2");
	font-weight: 200 800;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Literata";
	src: url("../fonts/literata/Literata72pt-Regular.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Literata";
	src: url("../fonts/literata/Literata72pt-SemiBold.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Literata";
	src: url("../fonts/literata/Literata72pt-RegularItalic.woff2") format("woff2");
	font-weight: 400;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: "Literata";
	src: url("../fonts/literata/Literata72pt-SemiBoldItalic.woff2") format("woff2");
	font-weight: 600;
	font-style: italic;
	font-display: swap;
}

/* ---------------------------------------------------------------------------
 * 2. Tokens
 * ------------------------------------------------------------------------- */
:root {
	/* Colour fallbacks (used before/without Elementor's Kit stylesheet). */
	--ad-forest-deep: #0f2d24;
	--ad-forest: #1d4634;
	--ad-forest-light: #2e6b50;
	--ad-ink: #1a1a1a;
	--ad-ink-muted: #4a5550;
	--ad-amber: #d4af37;
	--ad-copper: #93531d;
	--ad-gold: #d4af37;
	--ad-bone: #faf9f6;
	--ad-sand: #ece9df;
	--ad-line: #d9d6ca;
	--ad-white: #ffffff;
	--ad-field-border: #7b837d;
	--ad-danger: #a72a1f;
	--ad-focus: #2e6b50;

	/* Type */
	--ad-font-display: "Literata", Georgia, "Times New Roman", serif;
	--ad-font-body: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--ad-fs-h1: clamp(2.125rem, 1.55rem + 2.4vw, 3.5rem);
	--ad-fs-h2: clamp(1.75rem, 1.4rem + 1.4vw, 2.5rem);
	--ad-fs-h3: clamp(1.375rem, 1.2rem + 0.7vw, 1.75rem);
	--ad-fs-h4: 1.25rem;
	--ad-fs-body: 1.0625rem;
	--ad-fs-small: 0.875rem;
	--ad-fs-label: 0.75rem;

	/* Space (4px base) */
	--ad-space-1: 0.25rem;
	--ad-space-2: 0.5rem;
	--ad-space-3: 0.75rem;
	--ad-space-4: 1rem;
	--ad-space-5: 1.5rem;
	--ad-space-6: 2rem;
	--ad-space-7: 3rem;
	--ad-space-8: 4rem;
	--ad-space-9: 6rem;
	--ad-section-y: 6rem;

	/* Shape: buttons/inputs 8px, cards and images 14px, tags pill */
	--ad-radius-sm: 8px;
	--ad-radius-md: 14px;
	--ad-radius-pill: 999px;

	/* Forest-tinted shadow, used for hover lift only */
	--ad-shadow-lift: 0 14px 32px -14px rgb(15 45 36 / 0.32);
}

/* Elementor defines its Global Colour variables on the Kit element (body), not
 * on :root, so the live tokens are re-declared on body. Elementor system colours:
 * primary = Forest, secondary = Forest Deep, text = Ink, accent = Amber; the rest
 * are custom Global Colours (ad...). Change brand colours in Elementor and every
 * rule below follows. */
body {
	--ad-forest-deep: var(--e-global-color-secondary, #0f2d24);
	--ad-forest: var(--e-global-color-primary, #1d4634);
	--ad-forest-light: var(--e-global-color-adforestlight, #2e6b50);
	--ad-ink: var(--e-global-color-text, #1a1a1a);
	--ad-ink-muted: var(--e-global-color-adinkmuted, #4a5550);
	--ad-amber: var(--e-global-color-accent, #d4af37);
	--ad-copper: var(--e-global-color-adcopper, #93531d);
	--ad-gold: var(--e-global-color-adgold, #d4af37);
	--ad-bone: var(--e-global-color-adbone, #faf9f6);
	--ad-sand: var(--e-global-color-adsand, #ece9df);
	--ad-line: var(--e-global-color-adline, #d9d6ca);
	--ad-white: var(--e-global-color-adwhite, #ffffff);
	--ad-focus: var(--ad-forest-light);
}

@media (max-width: 1439px) {
	:root { --ad-section-y: 5rem; }
}
@media (max-width: 1023px) {
	:root { --ad-section-y: 4rem; }
}
@media (max-width: 767px) {
	:root {
		--ad-section-y: 3rem;
		--ad-fs-body: 1rem;
	}
}

/* ---------------------------------------------------------------------------
 * 3. Base typography
 * ------------------------------------------------------------------------- */
body,
button,
input,
select,
textarea,
.ast-button,
.ast-custom-button {
	font-family: var(--ad-font-body);
}
body {
	color: var(--ad-ink);
	font-size: var(--ad-fs-body);
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
h1,
h2,
h3,
.entry-content h1,
.entry-content h2,
.entry-content h3 {
	font-family: var(--ad-font-display);
	font-weight: 600;
	color: var(--ad-forest-deep);
	letter-spacing: -0.012em;
}
h4,
h5,
h6,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
	font-family: var(--ad-font-body);
	font-weight: 700;
	color: var(--ad-forest-deep);
	line-height: 1.3;
}
h1, .entry-content h1 { font-size: var(--ad-fs-h1); line-height: 1.08; }
h2, .entry-content h2 { font-size: var(--ad-fs-h2); line-height: 1.12; }
h3, .entry-content h3 { font-size: var(--ad-fs-h3); line-height: 1.2; }
h4, .entry-content h4 { font-size: var(--ad-fs-h4); }
small, .ad-small { font-size: var(--ad-fs-small); line-height: 1.5; }

/* Body links are underlined so they never rely on colour alone. */
.entry-content a:not(.button):not(.elementor-button):not(.wp-block-button__link),
.elementor-widget-text-editor a {
	text-decoration: underline;
	text-underline-offset: 0.2em;
	text-decoration-thickness: 1px;
}

/* Scientific names: italic serif, never bold-italic by accident */
.ad-sci,
.ad-sci .elementor-heading-title,
.ad-sci p,
i.ad-sci {
	font-family: var(--ad-font-display);
	font-style: italic;
	font-weight: 400;
	letter-spacing: 0;
}

/* Small uppercase label (use sparingly, at most one per three sections) */
.ad-eyebrow,
.ad-eyebrow .elementor-heading-title {
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-label);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	line-height: 1.3;
	color: var(--ad-copper);
}
/* On dark grounds the label uses a lighter amber tint so small text keeps
 * 4.5:1 even on the mid-green Forest (plain amber is 4.05:1 there). */
.ad-dark .ad-eyebrow,
.ad-dark .ad-eyebrow .elementor-heading-title {
	color: color-mix(in srgb, var(--ad-amber) 75%, #ffffff);
}

/* Lead paragraph: measured, comfortable */
.ad-lead,
.ad-lead p {
	font-size: 1.1875rem;
	line-height: 1.6;
	max-width: 62ch;
}
/* The Elementor Kit adds paragraph spacing; the last paragraph in a widget
 * must not, or stacked widgets get a double gap. */
.elementor-widget-text-editor p:last-child,
.elementor-widget-shortcode p:last-child,
.ad-lead p {
	margin-block-end: 0;
}

/* Prices */
.ad-price,
.woocommerce .price,
.woocommerce div.product p.price {
	font-family: var(--ad-font-body);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	color: var(--ad-ink);
}

/* ---------------------------------------------------------------------------
 * 4. Focus, accessibility, motion
 * ------------------------------------------------------------------------- */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--ad-focus);
	outline-offset: 2px;
}
.ad-dark {
	--ad-focus: var(--ad-amber);
}
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* ---------------------------------------------------------------------------
 * 5. Buttons
 *    Elementor Kit default  = Primary CTA (amber).
 *    .ad-btn--secondary     = outline on light, .ad-btn--secondary-light on dark.
 *    .ad-btn--utility       = forest fill (Add to Cart, Buy Now, Contact Us).
 *    Add the class to the Elementor Button widget: Advanced > CSS Classes.
 * ------------------------------------------------------------------------- */
.elementor-widget-button .elementor-button,
.wp-block-button__link,
.ast-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-page a.button,
.woocommerce-page button.button,
input[type="submit"],
button[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0.8rem 1.6rem;
	border: 2px solid transparent;
	border-radius: var(--ad-radius-sm);
	font-family: var(--ad-font-body);
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.01em;
	text-align: center;
	text-decoration: none;
	text-transform: none;
	box-shadow: none;
	cursor: pointer;
	transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease, transform 0.16s ease;
}
.elementor-widget-button .elementor-button:active,
.woocommerce a.button:active,
.woocommerce button.button:active {
	transform: translateY(1px);
}

/* Primary CTA */
.elementor-widget-button .elementor-button,
.elementor-widget-button.ad-btn--primary .elementor-button {
	background-color: var(--ad-amber);
	border-color: var(--ad-amber);
	color: var(--ad-ink);
}
.elementor-widget-button .elementor-button:hover,
.elementor-widget-button .elementor-button:focus,
.elementor-widget-button.ad-btn--primary .elementor-button:hover,
.elementor-widget-button.ad-btn--primary .elementor-button:focus {
	background-color: color-mix(in srgb, var(--ad-amber) 80%, #ffffff);
	border-color: color-mix(in srgb, var(--ad-amber) 80%, #ffffff);
	color: var(--ad-ink);
}

/* Secondary (outline) */
.elementor-widget-button.ad-btn--secondary .elementor-button {
	background-color: transparent;
	border-color: var(--ad-forest);
	color: var(--ad-forest);
}
.elementor-widget-button.ad-btn--secondary .elementor-button:hover,
.elementor-widget-button.ad-btn--secondary .elementor-button:focus {
	background-color: var(--ad-forest);
	border-color: var(--ad-forest);
	color: var(--ad-white);
}
.elementor-widget-button.ad-btn--secondary-light .elementor-button {
	background-color: transparent;
	border-color: var(--ad-bone);
	color: var(--ad-bone);
}
.elementor-widget-button.ad-btn--secondary-light .elementor-button:hover,
.elementor-widget-button.ad-btn--secondary-light .elementor-button:focus {
	background-color: var(--ad-bone);
	border-color: var(--ad-bone);
	color: var(--ad-forest-deep);
}

/* Utility (forest fill): also used for WooCommerce and Astra buttons */
.elementor-widget-button.ad-btn--utility .elementor-button,
.ast-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-page a.button,
.woocommerce-page button.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
input[type="submit"],
button[type="submit"] {
	background-color: var(--ad-forest);
	border-color: var(--ad-forest);
	color: var(--ad-white);
}
.elementor-widget-button.ad-btn--utility .elementor-button:hover,
.elementor-widget-button.ad-btn--utility .elementor-button:focus,
.ast-button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce-page a.button:hover,
.woocommerce-page button.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
input[type="submit"]:hover,
button[type="submit"]:hover {
	background-color: var(--ad-forest-light);
	border-color: var(--ad-forest-light);
	color: var(--ad-white);
}
.woocommerce a.button.disabled,
.woocommerce button.button:disabled,
.woocommerce button.button.disabled,
button[disabled],
input[disabled] {
	opacity: 0.55;
	cursor: not-allowed;
}

/* Full-width on phones when a button sits alone in a column */
@media (max-width: 767px) {
	.elementor-widget-button .elementor-button { min-height: 52px; }
	.ad-btn--block-mobile .elementor-button { width: 100%; }
}

/* ---------------------------------------------------------------------------
 * 6. Forms
 * ------------------------------------------------------------------------- */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="number"],
input[type="password"],
input[type="search"],
select,
textarea {
	min-height: 48px;
	padding: 0.65rem 0.9rem;
	border: 1px solid var(--ad-field-border);
	border-radius: var(--ad-radius-sm);
	background-color: var(--ad-white);
	color: var(--ad-ink);
	font-size: 1rem;
}
textarea { min-height: 8rem; }
input:focus,
select:focus,
textarea:focus {
	border-color: var(--ad-forest-light);
	box-shadow: none;
}
::placeholder { color: var(--ad-ink-muted); opacity: 1; }
label { font-weight: 600; }

/* ---------------------------------------------------------------------------
 * 7. Layout helpers
 * ------------------------------------------------------------------------- */
.ad-dark { color: var(--ad-bone); }
.ad-dark a:not(.elementor-button):not(.button) { color: var(--ad-amber); }
.ad-measure { max-width: 62ch; }

/* ---------------------------------------------------------------------------
 * 8. Image ratios and placeholders
 *    Put ad-ratio-* on an Elementor Image or Image Box widget
 *    (Advanced > CSS Classes). Any photo the owner uploads is cropped to the
 *    ratio, so replacing a placeholder never breaks the layout.
 * ------------------------------------------------------------------------- */
.ad-ratio-16x9 img,
.ad-ratio-4x3 img,
.ad-ratio-1x1 img,
.ad-ratio-wide img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
	border-radius: var(--ad-radius-md);
}
.ad-ratio-16x9 img { aspect-ratio: 16 / 9; }
.ad-ratio-4x3 img { aspect-ratio: 4 / 3; }
.ad-ratio-1x1 img { aspect-ratio: 1 / 1; }
.ad-ratio-wide img { aspect-ratio: 3 / 1; }
@media (max-width: 767px) {
	.ad-ratio-wide img { aspect-ratio: 16 / 9; }
}
/* Images inside a card: the card clips the corners, so square the image */
.ad-card .ad-ratio-16x9 img,
.ad-card .ad-ratio-4x3 img,
.ad-card .ad-ratio-1x1 img {
	border-radius: 0;
}
.ad-ratio-16x9 .elementor-image-box-img,
.ad-ratio-4x3 .elementor-image-box-img,
.ad-ratio-1x1 .elementor-image-box-img {
	width: 100%;
	margin-inline: 0;
}

/* ---------------------------------------------------------------------------
 * 9. Cards, tags, statistics
 * ------------------------------------------------------------------------- */
.ad-card {
	background-color: var(--ad-white);
	border: 1px solid var(--ad-line);
	border-radius: var(--ad-radius-md);
	overflow: hidden;
	transition: box-shadow 0.2s ease, border-color 0.2s ease;
}
.ad-card--link:hover,
.ad-card--link:focus-within {
	border-color: color-mix(in srgb, var(--ad-forest) 40%, var(--ad-line));
	box-shadow: var(--ad-shadow-lift);
}
.ad-card--tint {
	background-color: var(--ad-bone);
}

/* Tags: an Elementor Icon List with class ad-tags, set to Inline */
.ad-tags .elementor-icon-list-items {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ad-tags .elementor-icon-list-item {
	margin: 0;
	padding: 0.2rem 0.75rem;
	border: 1px solid var(--ad-line);
	border-radius: var(--ad-radius-pill);
	background-color: var(--ad-bone);
	color: var(--ad-forest);
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.5;
}
.ad-tags .elementor-icon-list-item .elementor-icon-list-icon { display: none; }
.ad-tags .elementor-icon-list-item .elementor-icon-list-text { padding: 0; color: inherit; }

/* Statistic (Elementor Counter widget) */
.ad-stat .elementor-counter-number-wrapper {
	font-family: var(--ad-font-display);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var(--ad-forest-deep);
}
.ad-dark .ad-stat .elementor-counter-number-wrapper { color: var(--ad-amber); }
.ad-stat .elementor-counter-title {
	font-size: var(--ad-fs-small);
	font-weight: 600;
	color: var(--ad-ink-muted);
}
.ad-dark .ad-stat .elementor-counter-title { color: var(--ad-bone); }

/* FAQ / accordion (Elementor Nested Accordion). Elementor exposes its look as
 * CSS variables, so the design system only sets those. Widget-level settings in
 * the Elementor panel still override them. */
.elementor-widget-n-accordion {
	--n-accordion-border-width: 1px;
	--n-accordion-border-style: solid;
	--n-accordion-border-color: var(--ad-line);
	--n-accordion-border-radius: var(--ad-radius-sm);
	--n-accordion-padding: 18px 22px;
	--n-accordion-item-title-space-between: 12px;
	--n-accordion-item-title-distance-from-content: 0px;
	--n-accordion-title-normal-color: var(--ad-forest-deep);
	--n-accordion-title-hover-color: var(--ad-forest-light);
	--n-accordion-title-active-color: var(--ad-forest-deep);
	--n-accordion-icon-normal-color: var(--ad-forest);
	--n-accordion-icon-hover-color: var(--ad-forest-light);
	--n-accordion-icon-active-color: var(--ad-forest);
	--n-accordion-icon-size: 14px;
	--n-accordion-title-font-size: 1.0625rem;
}
.elementor-widget-n-accordion .e-n-accordion-item-title-text {
	font-family: var(--ad-font-body);
	font-weight: 700;
	line-height: 1.35;
}

/* Newsletter (visual only until a mailing provider is connected) */
.ad-newsletter-form {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	max-width: 32rem;
}
.ad-newsletter-form input[type="email"] {
	flex: 1 1 14rem;
	width: auto;
	min-width: 0;
}
.ad-newsletter-form button { flex: 0 0 auto; }

/* Compact guide cards share the height of the featured card beside them */
.elementor .e-con.ad-guide-stack { flex: 1 1 auto; }
.elementor .e-con.ad-guide-mini { flex: 1 1 0; }

/* ---------------------------------------------------------------------------
 * 10. Species components (markup from the ANTELYX Core shortcodes)
 * ------------------------------------------------------------------------- */
.ad-species-header__title { margin: 0 0 var(--ad-space-1); }
.ad-species-header__common {
	margin: 0 0 var(--ad-space-4);
	font-size: 1.25rem;
	font-weight: 600;
	color: var(--ad-ink-muted);
}
.ad-tag-list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ad-tag {
	display: inline-flex;
	gap: 0.4rem;
	padding: 0.2rem 0.75rem;
	border: 1px solid var(--ad-line);
	border-radius: var(--ad-radius-pill);
	background-color: var(--ad-bone);
	color: var(--ad-forest);
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.5;
}
.ad-tag__label { color: var(--ad-ink-muted); font-weight: 500; }

.ad-facts {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
	margin: 0;
	border: 1px solid var(--ad-line);
	border-radius: var(--ad-radius-md);
	background-color: var(--ad-white);
	overflow: hidden;
}
/* Each cell draws its own top and left hairline; the container clips the rest,
 * so a short last row never shows a filled empty cell. */
.ad-facts__item {
	margin: 0;
	padding: 1rem 1.25rem;
	background-color: var(--ad-white);
	box-shadow: -1px -1px 0 0 var(--ad-line);
}
.ad-facts dt {
	margin: 0 0 0.25rem;
	font-size: var(--ad-fs-label);
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--ad-copper);
}
.ad-facts dd {
	margin: 0;
	font-weight: 600;
	color: var(--ad-ink);
}
.ad-facts .ad-facts__pending { color: var(--ad-ink-muted); font-weight: 500; }
@media (max-width: 1279px) {
	.ad-facts { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 1023px) {
	.ad-facts { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 599px) {
	.ad-facts { grid-template-columns: 1fr; }
}
.ad-empty { color: var(--ad-ink-muted); margin: 0; }

/* ---------------------------------------------------------------------------
 * 11. Astra chrome
 * ------------------------------------------------------------------------- */
/* Announcement bar (Astra header builder, above row) */
.ast-above-header-bar {
	background-color: var(--ad-forest-deep);
	color: var(--ad-bone);
	border-bottom: 0;
}
.ast-above-header-bar .ast-builder-html-element,
.ast-above-header-bar .ast-builder-html-element p,
.ast-above-header-bar a {
	color: var(--ad-bone);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	margin: 0;
}
.ast-above-header-bar a { text-decoration: underline; text-underline-offset: 0.2em; }
.ast-above-header-bar { --ad-focus: var(--ad-amber); }

/* Main header */
.main-header-bar {
	border-bottom: 1px solid var(--ad-line);
}
.site-title,
.site-title a {
	font-family: var(--ad-font-body);
	font-size: 1.125rem;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ad-forest-deep);
}
.main-header-menu > .menu-item > .menu-link {
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--ad-ink);
}
.main-header-menu > .menu-item:hover > .menu-link,
.main-header-menu > .menu-item.focus > .menu-link,
.main-header-menu > .current-menu-item > .menu-link,
.main-header-menu > .current-menu-ancestor > .menu-link {
	color: var(--ad-forest-light);
}
.ast-desktop .main-header-menu .sub-menu {
	padding: 0.5rem;
	border: 1px solid var(--ad-line);
	border-radius: var(--ad-radius-md);
	box-shadow: var(--ad-shadow-lift);
}
.ast-desktop .main-header-menu .sub-menu .menu-link {
	padding: 0.55rem 0.9rem;
	border-radius: var(--ad-radius-sm);
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--ad-ink);
}
.ast-desktop .main-header-menu .sub-menu .menu-item:hover > .menu-link,
.ast-desktop .main-header-menu .sub-menu .menu-item:focus-within > .menu-link {
	background-color: var(--ad-bone);
	color: var(--ad-forest);
}

/* Header icons: search, account and cart at one size */
.ast-header-search .ast-icon svg,
.ast-header-account-wrap .ast-header-account-type-icon svg,
.ast-header-woo-cart .ast-icon svg,
.ast-site-header-cart .ast-icon svg {
	width: 22px;
	height: 22px;
}

/* Footer: the footer is an Elementor template rendered inside Astra's footer
 * builder, so remove Astra's own padding and let the template control spacing. */
.site-footer,
.site-primary-footer-wrap,
.ast-builder-grid-row-container-inner,
.site-primary-footer-wrap .ast-builder-grid-row,
.site-primary-footer-wrap .ast-builder-layout-element {
	padding: 0;
}
.site-footer .ast-builder-html-element { width: 100%; }
.site-footer .ast-builder-grid-row { grid-template-columns: 1fr; }
.site-footer .ast-container,
.site-footer .ast-builder-grid-row-container-inner,
.site-footer .site-footer-section,
.site-footer .footer-widget-area,
.site-footer .ast-header-html { max-width: none; padding-inline: 0; margin-inline: 0; }

/* ---------------------------------------------------------------------------
 * 12. WooCommerce
 * ------------------------------------------------------------------------- */
.woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img {
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: var(--ad-radius-md);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	margin: 0.25rem 0;
	font-family: var(--ad-font-body);
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.35;
	color: var(--ad-ink);
}
.woocommerce ul.products li.product .price {
	font-size: 1.0625rem;
	color: var(--ad-ink);
}
.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale {
	min-height: 0;
	min-width: 0;
	padding: 0.25rem 0.7rem;
	border-radius: var(--ad-radius-pill);
	background-color: var(--ad-amber);
	color: var(--ad-ink);
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1.4;
}
.woocommerce div.product .product_title {
	font-family: var(--ad-font-display);
	font-weight: 600;
	color: var(--ad-forest-deep);
}
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	font-size: 1.5rem;
	color: var(--ad-ink);
}
.woocommerce div.product .woocommerce-product-gallery__image img {
	border-radius: var(--ad-radius-md);
}
.woocommerce .quantity .qty {
	min-height: 48px;
	width: 5rem;
	border: 1px solid var(--ad-field-border);
	border-radius: var(--ad-radius-sm);
	text-align: center;
}
/* Stock status: text colour never carries the meaning alone (the words do). */
.woocommerce div.product p.stock,
.woocommerce div.product .stock,
.woocommerce .stock.in-stock {
	color: var(--ad-forest);
	font-weight: 600;
}
.woocommerce div.product p.stock.out-of-stock,
.woocommerce .stock.out-of-stock {
	color: var(--ad-danger);
}
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	border-top-width: 3px;
	border-radius: var(--ad-radius-sm);
	background-color: var(--ad-bone);
	color: var(--ad-ink);
}
.woocommerce-message { border-top-color: var(--ad-forest-light); }
.woocommerce-info { border-top-color: var(--ad-forest-light); }
.woocommerce-error { border-top-color: var(--ad-danger); }
.woocommerce table.shop_table {
	border: 1px solid var(--ad-line);
	border-radius: var(--ad-radius-md);
	border-collapse: separate;
	overflow: hidden;
}
.woocommerce-breadcrumb,
.ast-breadcrumbs-wrapper {
	font-size: var(--ad-fs-small);
	color: var(--ad-ink-muted);
}