/* ==========================================================================
   Serenity — WordPress + Elementor glue
   1. Global colours + fonts  → Elementor > Site Settings > Global Colors / Global Fonts
   2. Elementor wrappers      → let the design sections run full width
   3. Editor helpers
   4. Plain pages (no Elementor)
   ========================================================================== */

/* ---------- 1. Globals ----------
   Every colour/font in site.css reads these variables, so changing a Global Colour
   or Global Font in Elementor updates the whole site. Fallbacks = original design. */
:root {
	--font-sans: "Inter", "Inter Fallback";
}
body {
	--green: var(--e-global-color-primary, #00b202);
	--green-lit: var(--e-global-color-primary, #00b202);
	--green-grad: var(--e-global-color-primary, #00b202);
	--forest: var(--e-global-color-secondary, #133a24);
	--ink: var(--e-global-color-text, #1b1c1e);
	--mx-panel: var(--e-global-color-accent, #2f7a45);
	--paper: var(--e-global-color-sspaper, #eef4ec);
	--mx-tint: var(--e-global-color-sspaper, #eef4ec);
	--mx-ink: var(--e-global-color-ssheading, #15402a);
	--mx-text: var(--e-global-color-ssbody, #5a6560);
	--muted: var(--e-global-color-ssmuted, #5f6064);
	--green-deep: var(--e-global-color-ssdeep, #007f0a);
	--sage: var(--e-global-color-sssage, #e6f4e4);
	--sage-2: var(--e-global-color-sssage2, #d8ecd5);
	--night: var(--e-global-color-ssnight, #07160e);
	--white: var(--e-global-color-sswhite, #ffffff);
	--ink-on-dark: var(--e-global-color-ssondark, #f4f2ee);

	--font: var(--e-global-typography-text-font-family, "Inter"), "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	background: var(--paper);
	font-family: var(--font);
}

/* Headings font family + weight (Global Font: "Headings") */
.t-h1, .t-h2, .t-h3, .mx-title, .hero__title, .mx-about2__statement, .principle__title,
.timeline__content h3, .mx-glass-card h3, .outcome h3, .mx-values__statement, .footer__cols h3 {
	font-family: var(--e-global-typography-primary-font-family, "Inter"), "Inter", sans-serif;
}
.t-h2, .mx-title {
	font-size: var(--e-global-typography-primary-font-size, clamp(2.1rem, 3.8vw, 3.4rem));
	font-weight: var(--e-global-typography-primary-font-weight, 500);
	line-height: var(--e-global-typography-primary-line-height, 1.08);
	letter-spacing: var(--e-global-typography-primary-letter-spacing, -.035em);
}
.principle__title {
	font-size: var(--e-global-typography-secondary-font-size, clamp(1.3rem, 1.9vw, 1.75rem));
	font-weight: var(--e-global-typography-secondary-font-weight, 480);
}
.hero .hero__title {
	font-size: var(--e-global-typography-sshero-font-size, clamp(2.1rem, 3vw, 3rem));
	font-weight: var(--e-global-typography-sshero-font-weight, 500);
	line-height: var(--e-global-typography-sshero-line-height, 1.08);
	letter-spacing: var(--e-global-typography-sshero-letter-spacing, -.035em);
}
.t-lead {
	font-family: var(--e-global-typography-sslead-font-family, inherit);
	font-size: var(--e-global-typography-sslead-font-size, clamp(1.1rem, 1.7vw, 1.55rem));
	line-height: var(--e-global-typography-sslead-line-height, 1.4);
}
.mx-about2__statement {
	font-size: var(--e-global-typography-ssstatement-font-size, clamp(1.55rem, 2.35vw, 2.25rem));
	font-weight: var(--e-global-typography-ssstatement-font-weight, 450);
}
.timeline__content h3 {
	font-size: var(--e-global-typography-sscard-font-size, clamp(1.35rem, 2vw, 1.7rem));
	font-weight: var(--e-global-typography-sscard-font-weight, 480);
}
.t-eyebrow, .mx-eyebrow {
	font-size: var(--e-global-typography-sseyebrow-font-size, .74rem);
	font-weight: var(--e-global-typography-sseyebrow-font-weight, 500);
	letter-spacing: var(--e-global-typography-sseyebrow-letter-spacing, .06em);
}
.principle__body, .mx-sub, .timeline__content p, .outcome p, .mx-glass-card p {
	font-size: var(--e-global-typography-sssmall-font-size, .98rem);
}
.nav__link { font-size: var(--e-global-typography-ssnav-font-size, .86rem); font-weight: var(--e-global-typography-ssnav-font-weight, 500); }
.cta { font-family: var(--e-global-typography-accent-font-family, inherit); font-weight: var(--e-global-typography-accent-font-weight, 600); }
.cta:not(.cta--sm):not(.cta--lg) { font-size: var(--e-global-typography-accent-font-size, .86rem); }

/* ---------- 2. Elementor wrappers ---------- */
.elementor-widget[class*="elementor-widget-ss-"] { width: 100%; max-width: 100%; }
.e-con:has(> .elementor-widget[class*="elementor-widget-ss-"]),
.e-con:has(> .e-con-inner > .elementor-widget[class*="elementor-widget-ss-"]) {
	--padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px;
	--gap: 0px; --row-gap: 0px; --column-gap: 0px;
	--container-max-width: 100%;
	--content-width: 100%;
}
.elementor-widget[class*="elementor-widget-ss-"] a:not(.cta) { box-shadow: none; }
/* The header/footer layouts render inside an .elementor wrapper — keep them invisible to layout */
.elementor:has(> .e-con .site-header) { position: static; }

/* ---------- 3. Editor ---------- */
.ss-editing [data-reveal] { opacity: 1 !important; transform: none !important; }
.ss-editing .intro-bloom { display: none !important; }
.ss-editing .lotus-progress { display: none; }
.ss-layout-canvas { min-height: 100vh; }
.ss-layout-preview--header { min-height: 340px; background: linear-gradient(135deg, #133a24, #2f7a45); }
.ss-layout-preview--header .site-header { position: absolute; }

/* ---------- 4. Plain pages ---------- */
.ss-page { padding-top: clamp(8rem, 14vw, 10rem); min-height: 60vh; }
.ss-prose { max-width: 820px; }
.ss-prose__body { margin-top: 1.6rem; color: var(--mx-text); line-height: 1.7; font-size: 1.02rem; }
.ss-prose__body > * + * { margin-top: 1rem; }
.ss-prose__body h2, .ss-prose__body h3 { color: var(--mx-ink); margin-top: 2rem; letter-spacing: -.02em; }
.ss-prose__body a { color: var(--green-deep); text-decoration: underline; }
.ss-prose__body ul { list-style: disc; padding-left: 1.3rem; }
.ss-prose__body ol { list-style: decimal; padding-left: 1.3rem; }
.ss-list-item + .ss-list-item { margin-top: 2rem; }
.ss-list-item h2 { font-size: 1.4rem; color: var(--mx-ink); }
.carousel--static .carousel__track { animation: none; flex-wrap: wrap; }
@media (max-width: 640px) {
	.hero .hero__title { font-size: var(--e-global-typography-sshero-font-size, clamp(2.1rem, 9.5vw, 2.6rem)); }
}
/* WordPress admin bar (logged-in users only) */
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }
@media (max-width: 600px) { .admin-bar .site-header { top: 0; } }
html:has(body.ss-editing), body.ss-editing { overflow-x: clip; }