/*
 * Exercise Innovation — elementor.css (2.0)
 *
 * The theme's design on Elementor markup. Loaded after Elementor's frontend CSS and the theme's
 * base.css + components.css, on the front end whenever Elementor content is printed and in Elementor's
 * editor preview (inc/elementor.php). Verified against Elementor 4.3.5 (free). Order on every such
 * page: Elementor's post CSS → frontend.css → elementor-base.css (Elementor's link resets answered) →
 * base.css → components.css → the kit → this file; in the editor the per-element CSS comes last.
 *
 * Converted documents (ei-core Elementor_Converter, docs/ELEMENTOR-V2.md §4) keep the block classes:
 * containers carry the section vocabulary in their CSS classes (`is-style-ei-*`, `alignfull`,
 * `ei-cards` …), widgets in `_css_classes` (heading, image, divider) or inside their own HTML (Text
 * Editor: `<p class="ei-eyebrow">`, `<ul class="wp-block-list is-style-ei-checks">`, tables, quotes).
 * The rules below give those classes the look components.css gives them on block markup.
 *
 * Elementor's DOM (with or without the "Optimized Markup" experiment):
 *   container  div.e-con.e-con-boxed > div.e-con-inner > children   |   div.e-con.e-con-full > children
 *   widget     div.elementor-widget.elementor-widget-{name} > [div.elementor-widget-container >] content
 * "Children of container X" is written `:is(X, X > .e-con-inner) > …`; "a widget whose content is E"
 * `.elementor-widget:has(> E, > :is(.elementor-widget-container, .elementor-text-editor) > E)`.
 *
 * Geometry goes through Elementor's own container variables (--padding-*, --row-gap, --column-gap,
 * --width, --content-width, --margin-*, --min-height, --border-radius …), not through the properties
 * they feed. Panel values are per-element CSS, `.elementor-{post} .elementor-element.elementor-
 * element-{id}` = (0,3,0), printed before this file on the front end and after it in the editor: rules
 * for a single container's geometry stay below (0,3,0), so the panel wins in both places; rules that
 * must win (section rhythm computed from the neighbours, stacking on narrow screens, the cover-card
 * scrims, the class-is-the-design exceptions: rule divider, row-card grid rows, widths the theme caps
 * on widgets) stay above it. Nothing sits at exactly (0,3,0) on a container variable the panel sets.
 *
 * The editor's markup: the document's containers sit in `.elementor-section-wrap`, Text Editor content
 * in `.elementor-text-editor`, and each element starts with an overlay (containers also with shape-
 * divider holders) and ends with resize handles. Hence `:is([data-elementor-id], .elementor-section-
 * wrap) > …`, `:is(.elementor-widget-container, .elementor-text-editor) > …`, and "first / last / only
 * element of a container" written `.elementor-element:where(:nth-child(1 of .elementor-element))`
 * (same weight as `:first-child`, which the editor's extra nodes would defeat).
 *
 * Vertical rhythm: WordPress's flow layout puts a 1.5rem block gap between blocks and lets the
 * margins of some blocks (eyebrow, tables, quotes …) collapse with it. Flex containers do not collapse
 * margins, so the content's own outer margins are reset and the difference is carried by the widget
 * wrapper (margin-top: calc(target - gap)).
 *
 * Contents
 *   1. Tokens and resets of Elementor's global rules (links, images, figures, headings, text)
 *   2. Document and top-level containers (content width, gutters, rhythm between sections)
 *   3. Flow rhythm inside containers
 *   4. Sections: section, panel, gradient, dark, grey
 *   5. Cards: card, card-blue, note, row, option, stagger, numbered, row grid
 *   6. Columns: split, cards, approach, pillars, option split, head split, contact, actions
 *   7. Images: rounded, fill, portrait, tall, logo badge
 *   8. Cover cards: photo, track, teal, dark banner
 *   9. Headings and text: divider, display, measure, eyebrow, lists, quotes, tables, callouts
 *  10. Elementor's own widgets: button (= .ei-btn), divider (= rule), spacer
 *  11. EI widgets in containers (full-width sections, heroes, CTA, author box, forms, programs,
 *      template sections, article bodies)
 *  12. Responsive: Elementor stacks rows below 768px, the theme below 782px
 *  13. Editor preview
 */

/* -------------------------------------------------------------------------
 * 1. Tokens and resets
 * ---------------------------------------------------------------------- */

:root {
	/* WordPress block gap (theme.json styles.spacing.blockGap): the space between blocks. */
	--ei-flow-gap: 1.5rem;
}

/* Elementor's defaults (10px container padding, 20px gaps, kit content width) give way to the theme's
   layout: containers start without padding, with the block gap between their children, and boxed
   content is as wide as the theme's container. */
.elementor .e-con {
	--padding-top: 0px;
	--padding-right: 0px;
	--padding-bottom: 0px;
	--padding-left: 0px;
	--row-gap: var(--ei-flow-gap);
	--column-gap: var(--ei-flow-gap);
	--container-max-width: var(--ei-container);
}

/* Elementor's link reset (`.elementor a { text-decoration: none; box-shadow: none }`): answered in
   elementor-base.css, which prints before base.css so that the components' own link rules keep winning. */

/* Elementor: `.elementor img { height: auto; max-width: 100%; border-radius: 0; … }` beats the
   theme's single-class image rules (cover images, round photos). */
.elementor :is(.ei-page-hero__bg, .ei-hero__poster) {
	max-width: none;
	height: 100%;
}

.elementor :is(.ei-step__bg, .ei-phase__bg, .ei-cta__bg, .ei-video__poster, .ei-program-card__media img, .ei-article-card__media img, .ei-program-who__media img, .ei-query-card__media img) {
	height: 100%;
}

.elementor .ei-program-intro__image,
.elementor .ei-author__photo img,
.elementor .ei-program-who__media img {
	border-radius: var(--ei-radius-card);
}

.elementor .ei-author--compact .ei-author__photo img {
	border-radius: 50%;
}

.elementor .ei-testimonial__photo {
	height: 64px;
	border-radius: 50%;
}

/* Elementor: figures in widgets lose their margins (`.elementor .elementor-widget:not(…) figure`). */
.elementor .elementor-widget.elementor-widget figure.ei-author__photo {
	margin: 0 auto;
}

.elementor .elementor-widget.elementor-widget figure.ei-video {
	margin-block: clamp(24px, 4vw, 40px);
}

/* Elementor: `.elementor-heading-title { line-height: 1 }` — the theme's heading scale (theme.json). */
.elementor-widget-heading .elementor-heading-title:is(h2) {
	line-height: 1.05;
}

.elementor-widget-heading .elementor-heading-title:is(h3) {
	line-height: 1.1;
}

.elementor-widget-heading .elementor-heading-title:is(h4) {
	line-height: 1.2;
}

.elementor-widget-heading .elementor-heading-title:is(h5, h6) {
	line-height: 1.3;
}

/* Text Editor content: like blocks in a flow layout, no outer margins (the container's gap spaces the
   widgets); several paragraphs typed into one widget get the block gap between them. */
:is(.elementor-widget-text-editor:where(:not(.elementor-element-edit-mode)), .elementor-widget-text-editor > :is(.elementor-widget-container, .elementor-text-editor)) > :first-child {
	margin-block-start: 0;
}

:is(.elementor-widget-text-editor:where(:not(.elementor-element-edit-mode)), .elementor-widget-text-editor > :is(.elementor-widget-container, .elementor-text-editor)) > :last-child {
	margin-block-end: 0;
}

:is(.elementor-widget-text-editor:where(:not(.elementor-element-edit-mode)), .elementor-widget-text-editor > :is(.elementor-widget-container, .elementor-text-editor)) > * + * {
	margin-block-start: var(--ei-flow-gap);
}

:is(.elementor-widget-text-editor:where(:not(.elementor-element-edit-mode)), .elementor-widget-text-editor > :is(.elementor-widget-container, .elementor-text-editor)) > p + :is(ul, ol) {
	margin-block-start: .75rem;
}

/* Block HTML nested in a Text Editor keeps the flow layout WordPress gives quotes and details when it
   renders them (`is-layout-flow`): no outer margins on the first / last child, the block gap between. */
.elementor-widget-text-editor :is(blockquote.wp-block-quote, .wp-block-pullquote blockquote, details.wp-block-details) > :first-child {
	margin-block-start: 0;
}

.elementor-widget-text-editor :is(blockquote.wp-block-quote, .wp-block-pullquote blockquote, details.wp-block-details) > :last-child {
	margin-block-end: 0;
}

.elementor-widget-text-editor :is(blockquote.wp-block-quote, .wp-block-pullquote blockquote, details.wp-block-details) > * + * {
	margin-block-start: var(--ei-flow-gap);
}

/* EI widgets: the block's root sits in the widget like a block in a flow layout — no outer margins
   of its own (the container's gap spaces the widgets; blocks that keep margins in the block layout
   get them back below, §11). */
:is(.elementor-widget, .elementor-widget > :is(.elementor-widget-container, .elementor-text-editor)) > :is(p, ul, ol, figure, blockquote, aside, nav, details, hr),
:is(.elementor-widget[class*="elementor-widget-ei-"], .elementor-widget[class*="elementor-widget-ei-"] > :is(.elementor-widget-container, .elementor-text-editor)) > * {
	margin-block: 0;
}

/* Elementor caps every widget at its container's width with doubled-class selectors (0,4,0):
   widgets the theme narrows further are written `.elementor.elementor .e-con …` below. */

/* Images in the Image widget fill their box like core/image (start-aligned, no inline gap). */
.elementor-widget-image {
	text-align: start;
}

.elementor-widget-image img {
	display: block;
}

/* Image captions like core/image captions (theme.json caption element: heading colour, small size;
   core's .5em above). The container's gap replaces the 1em below, which collapsed with the block gap. */
.elementor-widget-image .widget-image-caption {
	margin-block: .5em 0;
	color: var(--wp--preset--color--heading);
	font-size: var(--wp--preset--font-size--small);
}

/* -------------------------------------------------------------------------
 * 2. Document and top-level containers
 * ---------------------------------------------------------------------- */

/* The document keeps its first and last containers' margins inside (the block layout's post content
   did not let a closing CTA's section gap merge with the footer's offset either). */
.ei-main > [data-elementor-id] {
	display: flow-root;
}

/* … except on a program, whose block template put the sections straight into <main>: there the closing
   CTA's section gap merged with the footer's offset. */
.ei-main--program > [data-elementor-id] {
	display: block;
}

/* Boxed top-level containers = blocks in the constrained page content: the theme container (1180px)
   inside the root gutters (theme.json root padding; section styles set their own, §4). A program's
   Overview container holds the program's own content the same way (the block template rendered it in
   a constrained post content). */
.e-con.ei-program-overview {
	--row-gap: 0px;
}

:where([data-elementor-id], .elementor-section-wrap, .e-con.ei-program-overview) > .e-con.e-con-boxed {
	--padding-left: var(--wp--style--root--padding-left, var(--ei-gutter));
	--padding-right: var(--wp--style--root--padding-right, var(--ei-gutter));
}

/* Block gap between top-level blocks of the page content … */
:is([data-elementor-id], .elementor-section-wrap, .e-con.ei-program-overview) > .e-con + .e-con {
	--margin-top: var(--ei-flow-gap);
}

/* … except sections, which set their own rhythm (padding), and the first block after a hero. */
:is([data-elementor-id], .elementor-section-wrap, .e-con.ei-program-overview) > .e-con + .e-con.alignfull:is(.is-style-ei-section, .is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark, .is-style-ei-grey),
:is([data-elementor-id], .elementor-section-wrap) > .e-con:has(> .elementor-widget-ei-theme-page-hero, > .elementor-widget-ei-hero) + .e-con,
:is([data-elementor-id], .elementor-section-wrap) > .e-con + .e-con:is(.e-con-full, .ei-program-overview, .ei-program-disclaimer, .ei-tpl-section) {
	--margin-top: 0px;
}

/* … and section-level EI blocks, which have no block gap above them in the block layout either
   (credibility strip, author box, program cards, testimonials, articles, pricing, program sections;
   CTA and lead-magnet banners bring their own section gap, §11). */
:is([data-elementor-id], .elementor-section-wrap) > .e-con + .e-con:has(> .elementor-widget:is(.elementor-widget-ei-credibility-strip, .elementor-widget-ei-author-box, .elementor-widget-ei-program-cards, .elementor-widget-ei-testimonials, .elementor-widget-ei-latest-articles, .elementor-widget-ei-related-articles, .elementor-widget-ei-pricing-table, .elementor-widget-ei-program-section).elementor-element:where(:nth-child(1 of .elementor-element)), > .e-con-inner > .elementor-widget:is(.elementor-widget-ei-credibility-strip, .elementor-widget-ei-author-box, .elementor-widget-ei-program-cards, .elementor-widget-ei-testimonials, .elementor-widget-ei-latest-articles, .elementor-widget-ei-related-articles, .elementor-widget-ei-pricing-table, .elementor-widget-ei-program-section).elementor-element:where(:nth-child(1 of .elementor-element))) {
	--margin-top: 0px;
}

/* A banded section right under a hero, or two banded sections that touch: 20px apart. */
:is([data-elementor-id], .elementor-section-wrap) > .e-con:has(> .elementor-widget-ei-theme-page-hero, > .elementor-widget-ei-hero) + .e-con.alignfull:is(.is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark, .is-style-ei-grey),
:is([data-elementor-id], .elementor-section-wrap, .e-con.ei-program-overview) > .e-con.alignfull:is(.is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark, .is-style-ei-grey) + .e-con.alignfull:is(.is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark, .is-style-ei-grey) {
	--margin-top: var(--ei-gap);
}

/* Campaign landing under the solid minimal header (base.css): the first card / section keeps some air
   below the bar. */
.ei-header-solid .ei-main--campaign > [data-elementor-id] > .e-con:first-child:not(.alignfull),
.ei-header-solid .ei-main--campaign > [data-elementor-id] > .elementor-section-wrap > .e-con:first-child:not(.alignfull) {
	--margin-top: calc(var(--ei-section-y) / 2);
}

.ei-header-solid .ei-main--campaign > [data-elementor-id] > .e-con.alignfull:first-child,
.ei-header-solid .ei-main--campaign > [data-elementor-id] > .elementor-section-wrap > .e-con.alignfull:first-child {
	--margin-top: var(--ei-inset);
}

/* Overlay header: the first hero starts under the header bar (base.css pulls <main> up). */
.ei-header-overlay #main > [data-elementor-id] > .e-con:first-child :is(.ei-page-hero, .ei-hero),
.ei-header-overlay #main > [data-elementor-id] > .elementor-section-wrap > .e-con:first-child :is(.ei-page-hero, .ei-hero) {
	margin-top: var(--ei-inset);
}

/* Text straight in a page's content (simple pages turned into Elementor pages): the converter marks the
   boxed container of each run of text blocks `ei-page-content`, the class of the block layout's post
   content (base.css). Text, headings, lists, quotes, tables, details and rules keep the reading measure
   (800px) centred in the content width; images, buttons and wide / full-aligned widgets keep the
   content width. A width set in Elementor's panel still wins (these rules stay below (0,3,0)). */
:where(.e-con.ei-page-content, .e-con.ei-page-content > .e-con-inner) > :is(.elementor-widget-text-editor, .elementor-widget-heading, .elementor-widget-divider):not(.alignwide, .alignfull) {
	width: min(100%, var(--ei-measure));
	margin-inline: auto;
}

/* A quote fills the column (the constrained layout's auto margins replaced the browser's 40px there). */
:where(.e-con.ei-page-content, .e-con.ei-page-content > .e-con-inner) > .elementor-widget-text-editor > blockquote,
:where(.e-con.ei-page-content, .e-con.ei-page-content > .e-con-inner) > .elementor-widget-text-editor > :where(.elementor-widget-container, .elementor-text-editor) > blockquote {
	margin-inline: 0;
}

/* The content's first block starts a section gap below the hero (or the top of the page) when it is text
   or an image, as in the block layout … */
.e-con.ei-page-content:where(:is([data-elementor-id], .elementor-section-wrap) > .e-con:has(> .elementor-widget-ei-theme-page-hero, > .elementor-widget-ei-hero) + *, :is([data-elementor-id], .elementor-section-wrap) > :nth-child(1 of .elementor-element)):where(:has(> :nth-child(1 of .elementor-element):is(.elementor-widget-text-editor, .elementor-widget-heading, .elementor-widget-image):not(.alignfull), > .e-con-inner > :nth-child(1 of .elementor-element):is(.elementor-widget-text-editor, .elementor-widget-heading, .elementor-widget-image):not(.alignfull))) {
	--padding-top: var(--ei-section-y);
}

/* … and its last block ends a section gap above what follows the content (the footer, or the sections
   the page template adds: forms, review links). */
.e-con.ei-page-content:where(:is([data-elementor-id], .elementor-section-wrap) > :nth-last-child(1 of .elementor-element), :is([data-elementor-id], .elementor-section-wrap) > :has(+ .e-con.ei-tpl-section)):where(:has(> :nth-last-child(1 of .elementor-element):is(.elementor-widget-text-editor, .elementor-widget-heading, .elementor-widget-image):not(.alignfull), > .e-con-inner > :nth-last-child(1 of .elementor-element):is(.elementor-widget-text-editor, .elementor-widget-heading, .elementor-widget-image):not(.alignfull))) {
	--padding-bottom: var(--ei-section-y);
}

/* -------------------------------------------------------------------------
 * 3. Flow rhythm inside containers
 *
 * `var(--row-gap)` in a margin is the parent's gap only on widgets (they inherit it); a container
 * resolves it to its own inner gap. Margins on containers therefore subtract the parent's known gap
 * (`--ei-flow-gap`, the default of every container, unless the rule says otherwise).
 * ---------------------------------------------------------------------- */

/* Eyebrow → heading: in a section the heading's .5rem collapses with the eyebrow's .75rem bottom
   margin (elsewhere the block gap is larger than both). */
:is(.e-con:is(.is-style-ei-section, .is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark, .is-style-ei-grey), .e-con:is(.is-style-ei-section, .is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark, .is-style-ei-grey) > .e-con-inner) > .elementor-widget-text-editor:has(> .ei-eyebrow:only-child, > :is(.elementor-widget-container, .elementor-text-editor) > .ei-eyebrow:only-child) + .elementor-widget-heading {
	margin-block-start: calc(.75rem - var(--row-gap));
}

/* A list introduced by the paragraph before it sits .75rem below it (not in the cards whose own
   spacing wins in the block layout: rows, photo, track and banner covers, author box). */
:is(.e-con:not(.is-style-ei-row, .is-style-ei-photo-card, .is-style-ei-track-card, .is-style-ei-dark-photo, .ei-author-after), .e-con:not(.is-style-ei-row, .is-style-ei-photo-card, .is-style-ei-track-card, .is-style-ei-dark-photo, .ei-author-after) > .e-con-inner) > .elementor-widget-text-editor:has(> p:last-child, > :is(.elementor-widget-container, .elementor-text-editor) > p:last-child) + .elementor-widget-text-editor:has(> :is(ul, ol):first-child, > :is(.elementor-widget-container, .elementor-text-editor) > :is(ul, ol):first-child) {
	margin-block-start: calc(.75rem - var(--row-gap));
}

/* Branded tables: 20–28px around them. In the block layout their top margin replaces the block gap
   and their bottom margin collapses with the next block's (the gap): top = margin − gap, bottom =
   max(0, margin − gap). */
:is(.e-con, .e-con-inner) > .elementor-widget-text-editor:has(> .wp-block-table:is(.is-style-ei-table, .is-style-ei-table-dark), > :is(.elementor-widget-container, .elementor-text-editor) > .wp-block-table:is(.is-style-ei-table, .is-style-ei-table-dark)) {
	margin-block: calc(clamp(20px, 3vw, 28px) - var(--row-gap)) max(0px, clamp(20px, 3vw, 28px) - var(--row-gap));
}

:is(.e-con, .e-con-inner) > .elementor-widget-text-editor:has(> .wp-block-table:is(.is-style-ei-table, .is-style-ei-table-dark), > :is(.elementor-widget-container, .elementor-text-editor) > .wp-block-table:is(.is-style-ei-table, .is-style-ei-table-dark)).elementor-element:where(:nth-child(1 of .elementor-element)) {
	margin-block-start: clamp(20px, 3vw, 28px);
}

:is(.e-con, .e-con-inner) > .elementor-widget-text-editor:has(> .wp-block-table:is(.is-style-ei-table, .is-style-ei-table-dark), > :is(.elementor-widget-container, .elementor-text-editor) > .wp-block-table:is(.is-style-ei-table, .is-style-ei-table-dark)).elementor-element:where(:nth-last-child(1 of .elementor-element)) {
	margin-block-end: clamp(20px, 3vw, 28px);
}

/* Blocks whose own margin replaces the block gap in the block layout: video 24–40px around it,
   contact pills 20px above. */
:is(.e-con, .e-con-inner) > .elementor-widget-ei-video {
	margin-block: max(0px, clamp(24px, 4vw, 40px) - var(--row-gap));
}

:is(.e-con, .e-con-inner) > .elementor-widget:has(> .ei-contact-pill, > :is(.elementor-widget-container, .elementor-text-editor) > .ei-contact-pill).elementor-element:where(:not(:nth-child(1 of .elementor-element))) {
	margin-block-start: calc(20px - var(--row-gap));
}

:is(.e-con, .e-con-inner) > .elementor-widget:has(> .ei-contact-pill, > :is(.elementor-widget-container, .elementor-text-editor) > .ei-contact-pill).elementor-element:where(:nth-child(1 of .elementor-element)) {
	margin-block-start: 20px;
}

/* Pull quote: 2.5rem above. */
:is(.e-con, .e-con-inner) > .elementor-widget-text-editor:has(> .is-style-ei-pull, > :is(.elementor-widget-container, .elementor-text-editor) > .is-style-ei-pull) {
	margin-block-start: calc(2.5rem - var(--row-gap));
}

/* Divider title: 1.75rem to the paragraph below. */
:is(.e-con, .e-con-inner) > .elementor-widget-heading.is-style-ei-divider + .elementor-widget-text-editor {
	margin-block-start: calc(1.75rem - var(--row-gap));
}

/* Thin rule (separator → divider widget): 1.25rem above and below (same collapse as tables). */
:is(.e-con, .e-con-inner) > .elementor-widget-divider.is-style-ei-rule {
	margin-block: calc(1.25rem - var(--row-gap)) max(0px, 1.25rem - var(--row-gap));
}

/* Wide alignment inside boxed content (alignwide group in a constrained section): as wide as the
   theme's wide size (1400px), never wider than the section's content box (container query units). */
.e-con:has(> .e-con-inner > .e-con.alignwide) {
	container-type: inline-size;
}

.e-con > .e-con-inner > .e-con.alignwide {
	--width: min(var(--ei-wide), 100cqi);
	--margin-left: calc((100% - min(var(--ei-wide), 100cqi)) / 2);
	--margin-right: calc((100% - min(var(--ei-wide), 100cqi)) / 2);
	max-width: none;
}

/* -------------------------------------------------------------------------
 * 4. Sections
 * ---------------------------------------------------------------------- */

.e-con:is(.is-style-ei-section, .is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark, .is-style-ei-grey) {
	--padding-top: var(--ei-section-y);
	--padding-bottom: var(--ei-section-y);
}

.e-con.alignfull:where(.is-style-ei-section, .is-style-ei-grey) {
	--padding-left: var(--wp--style--root--padding-left, var(--ei-gutter));
	--padding-right: var(--wp--style--root--padding-right, var(--ei-gutter));
}

/* Rounded panels: the background is a pseudo-element inset from the viewport edge (as on blocks). */
.e-con:is(.is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark) {
	isolation: isolate;
}

.elementor .e-con:is(.is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark)::before {
	content: "";
	position: absolute;
	inset: 0;
	top: 0;
	left: 0;
	width: auto;
	height: auto;
	z-index: -1;
	opacity: 1;
	border-radius: var(--ei-radius-panel);
	pointer-events: none;
}

.e-con.alignfull:where(.is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark) {
	--padding-left: calc(var(--ei-inset) + var(--ei-gutter));
	--padding-right: calc(var(--ei-inset) + var(--ei-gutter));
}

.elementor .e-con.alignfull:is(.is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark)::before {
	inset: 0 var(--ei-inset);
}

.e-con:where(:not(.alignfull)):is(.is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark) {
	--padding-left: clamp(20px, 4vw, 48px);
	--padding-right: clamp(20px, 4vw, 48px);
}

.elementor .e-con.e-con.is-style-ei-panel::before {
	background: var(--ei-panel);
}

.elementor .e-con.e-con.is-style-ei-gradient::before {
	background: var(--ei-gradient-soft);
}

.e-con.is-style-ei-dark {
	color: var(--ei-white);
}

.elementor .e-con.e-con.is-style-ei-dark::before {
	background: var(--ei-dark-section);
}

.elementor .e-con.alignfull.is-style-ei-dark:not(.ei-dark--rounded)::before {
	border-radius: 15px;
}

@media (min-width: 782px) {
	.elementor .e-con.alignfull.is-style-ei-dark:not(.ei-dark--rounded)::before {
		border-radius: 0;
	}
}

.e-con.is-style-ei-dark:where(.ei-dark--rounded) {
	--padding-top: clamp(var(--ei-section-y), 13.2vw, 190px);
	--padding-bottom: clamp(var(--ei-section-y), 13.2vw, 190px);
}

.elementor .e-con.is-style-ei-dark.ei-dark--deep::before {
	background: var(--ei-dark-deep);
}

/* Headings: white — components.css (next to the block rule, so that its later light-card and EI block
   rules keep winning). */

/* Centred heads on panel + dark sections (explicit alignment classes still win). */
:where(.e-con:is(.is-style-ei-panel, .is-style-ei-dark), .e-con:is(.is-style-ei-panel, .is-style-ei-dark) > .e-con-inner) > :where(.elementor-widget-heading, .elementor-widget-text-editor:has(> p, > :is(.elementor-widget-container, .elementor-text-editor) > p)) {
	text-align: center;
}

:is(.e-con.is-style-ei-dark, .e-con.is-style-ei-dark > .e-con-inner) > .elementor-widget-text-editor > p:not(.ei-eyebrow),
:is(.e-con.is-style-ei-dark, .e-con.is-style-ei-dark > .e-con-inner) > .elementor-widget-text-editor > :is(.elementor-widget-container, .elementor-text-editor) > p:not(.ei-eyebrow) {
	max-width: 1120px;
	margin-inline: auto;
}

.e-con.is-style-ei-grey {
	background-color: var(--ei-grey);
}

/* Phones: a section head with a long centred intro reads left-aligned. */
@media (max-width: 599px) {
	:is(.e-con:is(.is-style-ei-section, .is-style-ei-grey, .is-style-ei-gradient, .is-style-ei-panel), .e-con:is(.is-style-ei-section, .is-style-ei-grey, .is-style-ei-gradient, .is-style-ei-panel) > .e-con-inner):has(> .elementor-widget-text-editor > .ei-measure.has-text-align-center, > .elementor-widget-text-editor > :is(.elementor-widget-container, .elementor-text-editor) > .ei-measure.has-text-align-center) > :is(.elementor-widget-heading.has-text-align-center, .elementor-widget-text-editor) :is(.has-text-align-center, .elementor-heading-title),
	:is(.e-con.is-style-ei-panel, .e-con.is-style-ei-panel > .e-con-inner):has(> .elementor-widget-text-editor > .ei-measure, > .elementor-widget-text-editor > :is(.elementor-widget-container, .elementor-text-editor) > .ei-measure) > :is(.elementor-widget-heading, .elementor-widget-text-editor) {
		text-align: start;
	}
}

/* Text links on tinted surfaces use the darker text blue (components.css, same specificity as a). */
:where(.e-con.is-style-ei-panel, .e-con.is-style-ei-gradient, .e-con.is-style-ei-grey) a:where(:not(.wp-element-button, .ei-btn, .elementor-button, .has-dark-bg a, .e-con:is(.is-style-ei-photo-card, .is-style-ei-track-card, .is-style-ei-teal-card, .is-style-ei-dark-photo) a)) {
	color: var(--ei-blue-dark);
}

/* Two unbanded sections in a row (plain sections, program cards, testimonials, articles): the first
   one's bottom padding already separates them — the second starts with half the section gap. */
:is([data-elementor-id], .elementor-section-wrap, .e-con.ei-program-overview) > :is(.e-con.alignfull.is-style-ei-section, .e-con:has(> .elementor-widget:is(.elementor-widget-ei-program-cards, .elementor-widget-ei-testimonials, .elementor-widget-ei-latest-articles, .elementor-widget-ei-related-articles).elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)), > .e-con-inner > .elementor-widget:is(.elementor-widget-ei-program-cards, .elementor-widget-ei-testimonials, .elementor-widget-ei-latest-articles, .elementor-widget-ei-related-articles).elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)))) + .e-con.alignfull.is-style-ei-section {
	--padding-top: calc(var(--ei-section-y) * .5);
}

:is([data-elementor-id], .elementor-section-wrap, .e-con.ei-program-overview) > :is(.e-con.alignfull.is-style-ei-section, .e-con:has(> .elementor-widget:is(.elementor-widget-ei-program-cards, .elementor-widget-ei-testimonials, .elementor-widget-ei-latest-articles, .elementor-widget-ei-related-articles).elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)), > .e-con-inner > .elementor-widget:is(.elementor-widget-ei-program-cards, .elementor-widget-ei-testimonials, .elementor-widget-ei-latest-articles, .elementor-widget-ei-related-articles).elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)))) + .e-con :is(.elementor-widget-ei-program-cards, .elementor-widget-ei-testimonials, .elementor-widget-ei-latest-articles, .elementor-widget-ei-related-articles).elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)) :is(.ei-program-cards, .ei-testimonials, .ei-articles) {
	padding-top: calc(var(--ei-section-y) * .5);
}

/* Head spacing inside sections: eyebrow → heading .75rem (above, §3); heading → columns, groups and
   tables 28–40px; intro paragraph → columns and tables 28–40px. Rows converted from core/columns are
   told apart from groups by their classes (the theme's column styles, the columns' own alignment
   classes). */
:is(.e-con:is(.is-style-ei-section, .is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark, .is-style-ei-grey), .e-con:is(.is-style-ei-section, .is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark, .is-style-ei-grey) > .e-con-inner) > .elementor-widget-heading + .e-con,
:is(.e-con:is(.is-style-ei-section, .is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark, .is-style-ei-grey), .e-con:is(.is-style-ei-section, .is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark, .is-style-ei-grey) > .e-con-inner) > .elementor-widget-text-editor:has(> p:last-child, > :is(.elementor-widget-container, .elementor-text-editor) > p:last-child) + .e-con:is(.ei-columns, .is-style-ei-split, .ei-cards, .ei-approach, .ei-pillars, .ei-option-split, .ei-head-split, .ei-contact, .ei-pricing-split, [class*="are-vertically-aligned-"], .is-not-stacked-on-mobile) {
	margin-block-start: calc(clamp(28px, 4vw, 40px) - var(--ei-flow-gap));
}

:is(.e-con:is(.is-style-ei-section, .is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark, .is-style-ei-grey), .e-con:is(.is-style-ei-section, .is-style-ei-panel, .is-style-ei-gradient, .is-style-ei-dark, .is-style-ei-grey) > .e-con-inner) > :is(.elementor-widget-heading, .elementor-widget-text-editor:has(> p:last-child, > :is(.elementor-widget-container, .elementor-text-editor) > p:last-child)) + .elementor-widget-text-editor:has(> .wp-block-table, > :is(.elementor-widget-container, .elementor-text-editor) > .wp-block-table) {
	margin-block-start: max(0px, clamp(28px, 4vw, 40px) - var(--row-gap));
}

/* -------------------------------------------------------------------------
 * 5. Cards
 * ---------------------------------------------------------------------- */

.e-con.is-style-ei-card {
	--padding-top: clamp(20px, 3vw, 30px);
	--padding-right: clamp(20px, 3vw, 30px);
	--padding-bottom: clamp(20px, 3vw, 30px);
	--padding-left: clamp(20px, 3vw, 30px);
	--border-radius: var(--ei-radius-card);
	background-color: var(--ei-white);
	border: .8px solid var(--ei-border-soft);
	color: var(--ei-text);
}

.e-con.is-style-ei-card-blue {
	--padding-top: clamp(24px, 3vw, 30px);
	--padding-right: clamp(24px, 3vw, 30px);
	--padding-bottom: clamp(24px, 3vw, 30px);
	--padding-left: clamp(24px, 3vw, 30px);
	--border-radius: var(--ei-radius-card);
	background-color: var(--ei-blue);
	color: var(--ei-white);
}

.e-con.is-style-ei-card-blue :where(h1, h2, h3, h4, h5, h6) {
	color: var(--ei-white);
}

:where(.e-con.is-style-ei-card-blue, .e-con.is-style-ei-card-blue > .e-con-inner) > .elementor-widget-heading h3.elementor-heading-title {
	font-size: var(--ei-fs-h3-lg);
	line-height: 1;
}

.e-con.is-style-ei-note {
	--padding-top: 20px;
	--padding-right: 20px;
	--padding-bottom: 20px;
	--padding-left: 20px;
	--border-radius: var(--ei-radius-card);
	background-color: var(--ei-white);
	border: .8px solid var(--ei-border-soft);
	color: var(--ei-text);
}

:is(.e-con.is-style-ei-note, .e-con.is-style-ei-note > .e-con-inner) > .elementor-widget-heading.elementor-element:where(:nth-child(1 of .elementor-element)) .elementor-heading-title {
	font-size: 1.25rem;
	font-weight: 500;
	letter-spacing: 0;
	line-height: 1.3;
	color: var(--ei-heading);
}

:is(.e-con.is-style-ei-note, .e-con.is-style-ei-note > .e-con-inner) > .elementor-widget-heading.elementor-element:where(:nth-child(1 of .elementor-element)) + .elementor-widget {
	margin-block-start: calc(.15rem - var(--row-gap));
}

:is(.e-con.is-style-ei-note, .e-con.is-style-ei-note > .e-con-inner) > .elementor-widget-heading.elementor-element:where(:nth-child(1 of .elementor-element)) + .e-con {
	margin-block-start: calc(.15rem - var(--ei-flow-gap));
}

.e-con.is-style-ei-row {
	--padding-top: 19px;
	--padding-right: 19px;
	--padding-bottom: 19px;
	--padding-left: 19px;
	--border-radius: var(--ei-radius-row);
	--row-gap: .25rem;
	background-color: var(--ei-white);
	color: var(--ei-text);
}

.e-con.is-style-ei-row strong {
	color: var(--ei-text);
	font-weight: 700;
}

/* Light cards inside dark surfaces keep dark text and red eyebrows: components.css (its rules name the
   style classes only, so they match containers too). */

/* Option / pillar cards on dark sections. */
.e-con:is(.is-style-ei-option, .is-style-ei-option-dark) {
	--padding-top: clamp(22px, 3vw, 31px);
	--padding-right: clamp(22px, 3vw, 31px);
	--padding-bottom: clamp(22px, 3vw, 31px);
	--padding-left: clamp(22px, 3vw, 31px);
	--border-radius: var(--ei-radius-option);
	border: 1.6px solid var(--ei-white);
	box-shadow: var(--ei-shadow-option);
	text-align: start;
}

.e-con.is-style-ei-option {
	background-color: rgba(255, 255, 255, .89);
	color: var(--ei-text);
}

.e-con.is-style-ei-option :where(h1, h2, h3, h4, h5, h6) {
	color: var(--ei-heading);
}

.e-con.is-style-ei-option a:where(:not(.ei-btn, .elementor-button)) {
	color: var(--ei-blue-dark);
}

.e-con.is-style-ei-option-dark {
	background-color: var(--ei-dark);
	color: var(--ei-white);
}

.e-con.is-style-ei-option-dark :where(h1, h2, h3, h4, h5, h6) {
	color: var(--ei-white);
}

:is(.e-con:is(.is-style-ei-option, .is-style-ei-option-dark), .e-con:is(.is-style-ei-option, .is-style-ei-option-dark) > .e-con-inner) > .elementor-widget-heading .elementor-heading-title {
	font-size: var(--ei-fs-h3-lg);
	line-height: 1.15;
}

:is(.e-con:is(.is-style-ei-option, .is-style-ei-option-dark), .e-con:is(.is-style-ei-option, .is-style-ei-option-dark) > .e-con-inner) > .elementor-widget-text-editor:has(> .ei-eyebrow:only-child, > :is(.elementor-widget-container, .elementor-text-editor) > .ei-eyebrow:only-child) + .elementor-widget-heading {
	margin-block-start: calc(.75rem - var(--row-gap));
}

.e-con.is-style-ei-option .ei-eyebrow {
	color: var(--ei-blue-dark);
}

.e-con.is-style-ei-option-dark .ei-eyebrow {
	color: var(--ei-white);
}

:is(.e-con.ei-pillars, .e-con.ei-pillars > .e-con-inner) .e-con.is-style-ei-option > .elementor-widget-heading .elementor-heading-title,
:is(.e-con.ei-pillars, .e-con.ei-pillars > .e-con-inner) .e-con.is-style-ei-option > .e-con-inner > .elementor-widget-heading .elementor-heading-title {
	font-size: 1.5625rem;
}

/* Staggered cards: each as wide as its content on ≥ 1024px. */
.e-con.is-style-ei-stagger {
	--row-gap: var(--ei-gap);
}

@media (min-width: 1024px) {
	:is(.e-con.is-style-ei-stagger, .e-con.is-style-ei-stagger > .e-con-inner) > .elementor-element {
		--width: fit-content;
		width: fit-content;
		max-width: 100%;
	}
}

/* Numbered cards (Maslow, Wheel of Success). */
.e-con.is-style-ei-numbered {
	--row-gap: var(--ei-gap);
	counter-reset: ei-num;
}

:is(.e-con.is-style-ei-numbered, .e-con.is-style-ei-numbered > .e-con-inner) > .elementor-element {
	position: relative;
	counter-increment: ei-num;
}

:is(.e-con.is-style-ei-numbered, .e-con.is-style-ei-numbered > .e-con-inner) > .e-con.is-style-ei-row {
	--padding-left: 43px;
}

.elementor :is(.e-con.is-style-ei-numbered, .e-con.is-style-ei-numbered > .e-con-inner) > .elementor-element::before {
	content: counter(ei-num);
	position: absolute;
	top: 23px;
	left: 19px;
	display: grid;
	place-items: center;
	width: 15px;
	height: 15px;
	opacity: 1;
	border-radius: 3px;
	background: var(--ei-text);
	color: var(--ei-white);
	font-family: var(--ei-font-body);
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
}

/* Grids of row cards: the column gap is the block's own (the converter's grid gaps); rows sit closer
   together — the theme sets the row gap itself, as components.css does over the block's blockGap. */
.elementor .e-con.ei-row-grid {
	row-gap: var(--ei-gap);
}

:is(.e-con, .e-con-inner) > .e-con.ei-row-grid {
	margin-block-start: calc(clamp(28px, 4vw, 48px) - var(--ei-flow-gap));
}

.ei-card--fill {
	height: 100%;
}

/* -------------------------------------------------------------------------
 * 6. Columns
 * ---------------------------------------------------------------------- */

/* Split: two equal columns (gap 24–50px, 20px from 1024px), rows 32px apart when stacked. */
.e-con.is-style-ei-split {
	--column-gap: clamp(24px, 4vw, 50px);
	--row-gap: 32px;
}

@media (min-width: 1024px) {
	.e-con.is-style-ei-split {
		--column-gap: 20px;
	}
}

@media (max-width: 781px) {
	.e-con.e-con.is-style-ei-split.ei-split--media-first {
		--flex-direction: column-reverse;
		--flex-wrap: nowrap;
	}
}

/* Equal-height card rows. */
.e-con:is(.ei-cards, .ei-approach, .ei-pillars) {
	--column-gap: 25px;
	--row-gap: 25px;
	--align-items: stretch;
}

:is(.e-con:is(.ei-cards, .ei-approach, .ei-pillars), .e-con:is(.ei-cards, .ei-approach, .ei-pillars) > .e-con-inner) > .e-con > .elementor-element.elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)) {
	flex: 1 1 auto;
}

.e-con.ei-pillars {
	--column-gap: 21px;
	--margin-left: auto;
	--margin-right: auto;
	max-width: 1100px;
}

/* Pillar cards: "Pillar N" heading, bold name 1rem below, text .5rem below that. */
:is(.e-con.ei-pillars .e-con.is-style-ei-option, .e-con.ei-pillars .e-con.is-style-ei-option > .e-con-inner) > .elementor-widget-heading + .elementor-widget-text-editor {
	margin-block-start: calc(1rem - var(--row-gap));
}

:is(.e-con.ei-pillars .e-con.is-style-ei-option, .e-con.ei-pillars .e-con.is-style-ei-option > .e-con-inner) > .elementor-widget-text-editor + .elementor-widget-text-editor {
	margin-block-start: calc(.5rem - var(--row-gap));
}

:is(.e-con, .e-con-inner) > .e-con.ei-cards + .e-con.ei-cards {
	margin-block-start: calc(25px - var(--ei-flow-gap));
}

.e-con.ei-card-stack {
	--row-gap: 25px;
}

.e-con.ei-option-split {
	--column-gap: 30px;
	--row-gap: 25px;
	--margin-left: auto;
	--margin-right: auto;
	max-width: 1100px;
}

.e-con.ei-head-split {
	--row-gap: 1.25rem;
}

:is(.e-con, .e-con-inner) > .e-con.ei-head-split + .elementor-widget {
	margin-block-start: calc(clamp(28px, 4vw, 40px) - var(--row-gap));
}

:is(.e-con, .e-con-inner) > .e-con.ei-head-split + .e-con {
	margin-block-start: calc(clamp(28px, 4vw, 40px) - var(--ei-flow-gap));
}

.e-con.ei-contact {
	--column-gap: 25px;
	--row-gap: 25px;
	--align-items: stretch;
}

:is(.e-con.ei-contact, .e-con.ei-contact > .e-con-inner) > .e-con > .elementor-element {
	flex: 1 1 auto;
}

.e-con.ei-contact .e-con.is-style-ei-card-blue .ei-eyebrow {
	color: var(--ei-white);
}

:is(.e-con.ei-contact .e-con.is-style-ei-card-blue, .e-con.ei-contact .e-con.is-style-ei-card-blue > .e-con-inner) > .elementor-widget-heading {
	margin-block-start: calc(.75rem - var(--row-gap));
}

/* Button rows (core/group .ei-actions → flex row container). base.css's bare `.ei-actions` rule
   (gap, wrap, alignment) reaches the container too: the container reads them from its variables again,
   so values set in the panel apply. */
.e-con.ei-actions {
	--column-gap: 12px;
	--row-gap: 12px;
	--align-items: center;
	--flex-wrap: wrap;
}

.e-con-full.ei-actions {
	flex-wrap: var(--flex-wrap);
	align-items: var(--align-items);
	gap: var(--row-gap) var(--column-gap);
}

/* ei/button inside a button row: an inline flex item (its <a> is the block root). */
.e-con.ei-actions .elementor-widget-ei-button .wp-block-ei-button {
	display: inline-flex;
}

/* A full-width ei/button (`ei-btn--block`) fills its row, as the block does. */
:where(.e-con, .e-con-inner) > .elementor-widget-ei-button:has(.ei-btn--block) {
	width: 100%;
}

@media (max-width: 479px) {
	.elementor .e-con.e-con.ei-actions {
		--flex-direction: column;
		--align-items: stretch;
	}

	:is(.e-con.ei-actions, .e-con.ei-actions > .e-con-inner) > .elementor-element {
		width: 100%;
	}

	.e-con.ei-actions :is(.elementor-widget-ei-button .wp-block-ei-button, .ei-btn, .elementor-button) {
		width: 100%;
	}
}

/* -------------------------------------------------------------------------
 * 7. Images
 * ---------------------------------------------------------------------- */

.elementor-widget-image:is(.is-style-ei-rounded, .is-style-ei-rounded-lg) img {
	width: 100%;
	height: auto;
	object-fit: cover;
	border-radius: var(--ei-radius-card);
}

.elementor-widget-image.is-style-ei-rounded-lg img {
	border-radius: var(--ei-radius-panel);
}

/* … and the widget is as wide as its column. A row measures its columns before laying them out; with the
   widget sized by its content, a photo still loading (lazy) counted as 0px there — the column collapsed
   and the text beside or below it jumped when the photo arrived (CLS 0.16 on the audience pages). (0,2,0):
   a width set in the panel still wins, and so do the theme's own widths (logo badge, portrait …). */
:where(.e-con:is(.ei-columns, .is-style-ei-split, .ei-cards, .ei-approach, .ei-pillars, .ei-option-split, .ei-head-split, .ei-contact, .ei-pricing-split, [class*="are-vertically-aligned-"]), .e-con:is(.ei-columns, .is-style-ei-split, .ei-cards, .ei-approach, .ei-pillars, .ei-option-split, .ei-head-split, .ei-contact, .ei-pricing-split, [class*="are-vertically-aligned-"]) > .e-con-inner) > .e-con :where(.elementor-widget-image):is(.is-style-ei-rounded, .is-style-ei-rounded-lg) {
	width: 100%;
}

/* The split frame (4:3 on phones, 26:25 from 782px) applies unless the block had its own aspect ratio
   (the converter marks those images with `ei-img-ratio`; the Image widget already has that shape). */
.e-con.is-style-ei-split .elementor-widget-image.is-style-ei-rounded:not(.ei-img-ratio) img {
	aspect-ratio: 4 / 3;
}

@media (min-width: 782px) {
	.e-con.is-style-ei-split .elementor-widget-image.is-style-ei-rounded:not(.ei-img-ratio) img {
		aspect-ratio: 26 / 25;
	}

	.e-con.is-style-ei-split .elementor-widget-image.is-style-ei-rounded.ei-img-tall:not(.ei-img-ratio) img {
		aspect-ratio: 4 / 5;
	}

	/* Fill: the photo takes the height of the text column beside it. */
	.e-con.is-style-ei-split .elementor-widget-image.ei-img-fill {
		position: relative;
		height: 100%;
		min-height: 420px;
		flex: 1 1 auto;
	}

	.e-con.is-style-ei-split .elementor-widget-image.ei-img-fill:not(.ei-img-ratio) img {
		position: absolute;
		inset: 0;
		height: 100%;
		aspect-ratio: auto;
	}

	/* Intro split: the photo runs the full height of the text column. */
	.e-con.is-style-ei-split.ei-split--intro > .e-con:has(> .elementor-widget-image.elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element))) {
		--align-self: stretch;
	}

	.e-con.is-style-ei-split.ei-split--intro > .e-con > .elementor-widget-image.elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)) {
		position: relative;
		flex: 1 1 auto;
		width: 100%;
		min-height: 420px;
	}

	.e-con.is-style-ei-split.ei-split--intro > .e-con > .elementor-widget-image.elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)):not(.ei-img-ratio) img {
		position: absolute;
		inset: 0;
		height: 100%;
		aspect-ratio: auto;
	}
}

@media (min-width: 1024px) {
	.e-con.is-style-ei-split > .e-con > .e-con.is-style-ei-teal-card.elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)),
	.e-con.is-style-ei-split.ei-split--intro > .e-con > .elementor-widget-image.elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)) {
		width: 100%;
		max-width: 520px;
		margin-inline: auto;
	}

	.e-con.is-style-ei-split.ei-split--intro > .e-con > .elementor-widget-image.elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)) {
		min-height: 500px;
	}
}

.elementor.elementor .e-con .elementor-widget-image.ei-img-portrait {
	width: 100%;
	max-width: 520px;
	margin-inline: auto;
}

.e-con.is-style-ei-split .elementor-widget-image.ei-img-portrait:not(.ei-img-ratio) img {
	aspect-ratio: 520 / 565;
	object-position: 50% 20%;
}

@media (min-width: 1024px) {
	.e-con.is-style-ei-split > .e-con:has(> .elementor-widget-image.ei-img-portrait.elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element))) {
		--align-self: stretch;
	}

	.e-con.is-style-ei-split > .e-con > .elementor-widget-image.ei-img-portrait.elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)) {
		position: relative;
		flex: 1 1 auto;
		width: 100%;
		min-height: 565px;
	}

	.e-con.is-style-ei-split > .e-con > .elementor-widget-image.ei-img-portrait.elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)):not(.ei-img-ratio) img {
		position: absolute;
		inset: 0;
		height: 100%;
		aspect-ratio: auto;
	}
}

/* Logo badge overlapping the image above and the blue card below. */
.elementor-widget-image.ei-logo-badge {
	position: relative;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 110px;
	height: 110px;
	padding: 20px;
	margin: -55px auto !important;
	background: var(--ei-white);
	border-radius: 50%;
}

.elementor-widget-image.ei-logo-badge img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

:is(.e-con, .e-con-inner) > .elementor-widget-image.ei-logo-badge + .e-con.is-style-ei-card-blue {
	--padding-top: 70px;
	--padding-right: 25px;
	--padding-bottom: 25px;
	--padding-left: 25px;
	margin-block-start: calc(0px - var(--ei-flow-gap));
}

:is(.e-con, .e-con-inner) > .elementor-widget-image + .elementor-widget-image.ei-logo-badge {
	margin-block-start: calc(-55px - var(--row-gap)) !important;
}

:is(.elementor-widget-image.ei-logo-badge + .e-con.is-style-ei-card-blue, .elementor-widget-image.ei-logo-badge + .e-con.is-style-ei-card-blue > .e-con-inner) > .elementor-widget-text-editor:has(> p, > :is(.elementor-widget-container, .elementor-text-editor) > p) {
	width: 100%;
	max-width: 410px;
	margin-inline: auto;
}

/* -------------------------------------------------------------------------
 * 8. Cover cards (core/cover → container with an Elementor background image + overlay)
 * ---------------------------------------------------------------------- */

.e-con:is(.is-style-ei-photo-card, .is-style-ei-track-card, .is-style-ei-teal-card, .is-style-ei-dark-photo) {
	--overflow: hidden;
	color: var(--ei-white);
}

.e-con:is(.is-style-ei-photo-card, .is-style-ei-track-card, .is-style-ei-dark-photo):not([style*="background-image"]) {
	background-color: var(--ei-heading);
}

.e-con:is(.is-style-ei-photo-card, .is-style-ei-track-card, .is-style-ei-teal-card, .is-style-ei-dark-photo) :where(h1, h2, h3, h4, h5, h6, p, li, .ei-eyebrow) {
	color: var(--ei-white);
}

.e-con:is(.is-style-ei-photo-card, .is-style-ei-track-card, .is-style-ei-teal-card, .is-style-ei-dark-photo) > .e-con-inner {
	position: relative;
	z-index: 1;
}

/* The overlay is drawn by the theme (scrims for contrast, R13), not by Elementor's overlay colour —
   (0,4,1): above the container's own overlay rule (`.elementor-{post} .elementor-element.elementor-
   element-{id}::before`, (0,3,1)), which prints before this file on the front end but after it in the
   editor preview. */
.elementor .e-con.e-con:is(.is-style-ei-photo-card, .is-style-ei-track-card, .is-style-ei-teal-card, .is-style-ei-dark-photo)::before {
	content: "";
	display: block;
	position: absolute;
	inset: 0;
	top: 0;
	left: 0;
	width: auto;
	height: auto;
	z-index: 0;
	opacity: 1;
	background-color: transparent;
	border-radius: inherit;
	pointer-events: none;
}

/* Photo card: grey overlay .55 + bottom scrim, content bottom-aligned. */
.e-con.is-style-ei-photo-card {
	--min-height: 360px;
	--padding-top: 20px;
	--padding-right: 20px;
	--padding-bottom: 20px;
	--padding-left: 20px;
	--border-radius: var(--ei-radius-card);
	--row-gap: .5rem;
	--justify-content: flex-end;
}

.e-con-boxed.is-style-ei-photo-card > .e-con-inner {
	justify-content: flex-end;
}

.elementor .e-con.is-style-ei-photo-card::before {
	background-image: linear-gradient(to top, rgba(0, 0, 0, .66) 0%, rgba(0, 0, 0, .4) 50%, rgba(0, 0, 0, 0) 85%), linear-gradient(var(--ei-overlay), var(--ei-overlay));
}

.e-con.is-style-ei-photo-card h3 {
	font-size: var(--ei-fs-h3);
	line-height: 1.15;
}

:is(.e-con.is-style-ei-photo-card, .e-con.is-style-ei-photo-card > .e-con-inner) > .elementor-widget-heading:has(h3) + .elementor-widget {
	margin-block-start: calc(.75rem - var(--row-gap));
}

:is(.e-con.is-style-ei-photo-card, .e-con.is-style-ei-photo-card > .e-con-inner) > .elementor-widget-heading:has(h3) + .e-con {
	margin-block-start: .25rem;
}

@media (min-width: 782px) {
	.e-con.is-style-ei-photo-card {
		--min-height: 450px;
	}
}

@media (max-width: 781px) {
	.elementor .e-con.is-style-ei-photo-card::before {
		background-image: linear-gradient(to top, rgba(0, 0, 0, .7) 0%, rgba(0, 0, 0, .5) 60%, rgba(0, 0, 0, .12) 100%), linear-gradient(var(--ei-overlay), var(--ei-overlay));
	}
}

/* Track card: overlay .80, content top-left, padding follows the card width (container query units
   resolve against the card only from inside it, hence on the inner box). */
.e-con.is-style-ei-track-card {
	container-type: inline-size;
	--min-height: 304px;
	--border-radius: var(--ei-radius-track);
	--row-gap: 1rem;
}

.e-con.is-style-ei-track-card > .e-con-inner {
	padding: clamp(28px, 9cqi, 60px) clamp(20px, 7cqi, 50px);
}

.e-con-full.is-style-ei-track-card {
	--padding-top: clamp(28px, 4vw, 60px);
	--padding-bottom: clamp(28px, 4vw, 60px);
	--padding-left: clamp(20px, 3vw, 50px);
	--padding-right: clamp(20px, 3vw, 50px);
}

.elementor .e-con.is-style-ei-track-card::before {
	background-image: linear-gradient(var(--ei-overlay-track), var(--ei-overlay-track));
}

.e-con.is-style-ei-track-card .elementor-heading-title {
	font-size: var(--ei-fs-h3-lg);
	line-height: 1;
}

:is(.e-con.is-style-ei-track-card, .e-con.is-style-ei-track-card > .e-con-inner) > .elementor-widget-text-editor:has(> .ei-eyebrow:only-child, > :is(.elementor-widget-container, .elementor-text-editor) > .ei-eyebrow:only-child) + .elementor-widget-heading {
	margin-block-start: calc(.75rem - var(--row-gap));
}

.e-con.is-style-ei-track-card ul {
	padding-inline-start: 1.25rem;
}

.e-con.is-style-ei-track-card li + li {
	margin-top: .15rem;
}

/* Teal skill-set card. */
.e-con.is-style-ei-teal-card {
	--min-height: 560px;
	--padding-top: 24px;
	--padding-right: 24px;
	--padding-bottom: 24px;
	--padding-left: 24px;
	--border-radius: var(--ei-radius-card);
	--justify-content: flex-end;
}

.e-con-boxed.is-style-ei-teal-card > .e-con-inner {
	justify-content: flex-end;
}

.elementor .e-con.is-style-ei-teal-card::before {
	background-image: linear-gradient(to top, var(--ei-teal) 70%, rgba(72, 127, 134, .5) 86%, rgba(72, 127, 134, .15) 100%);
}

.e-con.is-style-ei-teal-card p {
	font-weight: 700;
}

.e-con.is-style-ei-teal-card ul {
	padding-inline-start: 1.25rem;
}

/* (same structure as the paragraph → list rule in §3, so it wins over it) */
:is(.e-con.is-style-ei-teal-card, .e-con.is-style-ei-teal-card > .e-con-inner) > .elementor-widget-text-editor:has(> p:last-child, > :is(.elementor-widget-container, .elementor-text-editor) > p:last-child) + .elementor-widget-text-editor:has(> :is(ul, ol):first-child, > :is(.elementor-widget-container, .elementor-text-editor) > :is(ul, ol):first-child),
:is(.e-con.is-style-ei-teal-card, .e-con.is-style-ei-teal-card > .e-con-inner) > .elementor-widget-text-editor:has(> ul, > :is(.elementor-widget-container, .elementor-text-editor) > ul) {
	margin-block-start: calc(.5rem - var(--row-gap));
}

@media (min-width: 782px) {
	.e-con.is-style-ei-teal-card {
		--min-height: 600px;
		--padding-top: 66px;
		--padding-right: 32px;
		--padding-bottom: 32px;
		--padding-left: 38%;
		--justify-content: flex-start;
	}

	.e-con-boxed.is-style-ei-teal-card > .e-con-inner {
		justify-content: flex-start;
	}

	.elementor .e-con.is-style-ei-teal-card::before {
		background-image: linear-gradient(251deg, var(--ei-teal) 64%, rgba(72, 127, 134, 0) 100%);
	}
}

@media (min-width: 1024px) {
	.e-con.is-style-ei-teal-card {
		--min-height: 602px;
		--padding-left: 198px;
	}
}

/* Dark banner (statement / CTA look). */
.e-con.is-style-ei-dark-photo {
	--padding-top: clamp(40px, 6vw, 60px);
	--padding-bottom: clamp(40px, 6vw, 60px);
	--padding-left: clamp(20px, 3vw, 30px);
	--padding-right: clamp(20px, 3vw, 30px);
	--border-radius: var(--ei-radius-card);
	--row-gap: 1.25rem;
	--content-width: 730px;
}

.e-con.is-style-ei-dark-photo > .e-con-inner {
	margin-inline: 0 auto;
}

.elementor .e-con.is-style-ei-dark-photo::before {
	background-image: linear-gradient(rgba(0, 0, 0, .78), rgba(0, 0, 0, .78));
}

:is(.e-con.is-style-ei-dark-photo, .e-con.is-style-ei-dark-photo > .e-con-inner) > .elementor-widget-divider {
	margin-block: calc(1.75rem - var(--row-gap)) max(0px, 1.75rem - var(--row-gap));
}

@media (min-width: 782px) {
	.elementor .e-con.is-style-ei-dark-photo::before {
		background-image: linear-gradient(90deg, rgba(0, 0, 0, .89) 20%, rgba(0, 0, 0, .74) 800px, rgba(0, 0, 0, 0) 100%);
	}

	.e-con.is-style-ei-dark-photo .elementor-widget-heading.is-style-ei-display:not(.has-text-align-left):not(.has-text-align-center) {
		text-align: end;
	}
}

.e-con.is-style-ei-dark-photo .ei-eyebrow {
	font-family: var(--ei-font-heading);
	font-size: 1.375rem;
	font-weight: 600;
	letter-spacing: -0.03em;
}

/* -------------------------------------------------------------------------
 * 9. Headings and text
 * ---------------------------------------------------------------------- */

/* Divider title: centred text with rules either side. */
.elementor-widget-heading.is-style-ei-divider .elementor-heading-title {
	display: flex;
	align-items: center;
	gap: clamp(12px, 2vw, 16px);
	font-family: var(--ei-font-body);
	font-size: 1.375rem;
	font-weight: 600;
	letter-spacing: 0;
	line-height: 1.25;
	text-align: center;
	color: var(--ei-heading);
}

.elementor-widget-heading.is-style-ei-divider .elementor-heading-title::before,
.elementor-widget-heading.is-style-ei-divider .elementor-heading-title::after {
	content: "";
	flex: 1 1 0;
	min-width: 24px;
	height: 1px;
	background: var(--ei-border-soft);
}

@media (max-width: 599px) {
	.elementor-widget-heading.is-style-ei-divider .elementor-heading-title {
		display: block;
	}

	.elementor-widget-heading.is-style-ei-divider .elementor-heading-title::before,
	.elementor-widget-heading.is-style-ei-divider .elementor-heading-title::after {
		display: none;
	}
}

/* Display heading (CTA banners). */
.elementor-widget-heading.is-style-ei-display .elementor-heading-title {
	font-family: var(--ei-font-body);
	font-size: var(--ei-fs-cta);
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.3;
	text-transform: uppercase;
}

@media (min-width: 1024px) {
	.elementor-widget-heading.is-style-ei-display .elementor-heading-title {
		line-height: 1.5;
	}
}

/* 760px centred measure on headings (the class is on the widget). */
.elementor.elementor .e-con .elementor-widget.ei-measure {
	width: 100%;
	max-width: 760px;
	margin-inline: auto;
}

/* Lists, quotes, separators inside the text widgets keep their block classes (components.css);
   only rules that depend on the block's parent need repeating. */
:is(.e-con.is-style-ei-card-blue, .e-con.is-style-ei-dark, .e-con.is-style-ei-option-dark, .e-con:is(.is-style-ei-photo-card, .is-style-ei-track-card, .is-style-ei-teal-card, .is-style-ei-dark-photo)) ul.wp-block-list.is-style-ei-checks > li::before {
	background-color: var(--ei-white);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231D789D' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}

:is(.e-con.is-style-ei-card-blue, .e-con:is(.is-style-ei-photo-card, .is-style-ei-track-card, .is-style-ei-teal-card, .is-style-ei-dark-photo)) ul.wp-block-list.is-style-ei-checks-lined > li::before {
	background: var(--ei-white);
}

.e-con.is-style-ei-card-blue ul.wp-block-list.is-style-ei-checks a {
	color: var(--ei-white);
	text-decoration: none;
}

.e-con.is-style-ei-card-blue ul.wp-block-list.is-style-ei-checks a:is(:hover, :focus-visible) {
	text-decoration: underline;
}

/* Mental "Our approach": the button rows .75rem under the lists in the blue card; components.css's
   1.25rem bottom margin for them reaches the containers too, and only shows under the last one (the
   block gap is larger elsewhere). */
.e-con.ei-approach .e-con.is-style-ei-card-blue .e-con.ei-actions.elementor-element:where(:not(:nth-last-child(1 of .elementor-element))) {
	margin-block-end: var(--margin-block-end);
}

:is(.e-con.ei-approach .e-con.is-style-ei-card-blue, .e-con.ei-approach .e-con.is-style-ei-card-blue > .e-con-inner) > .elementor-widget-text-editor:has(> ul, > :is(.elementor-widget-container, .elementor-text-editor) > ul) + .e-con.ei-actions {
	margin-block-start: calc(.75rem - var(--ei-flow-gap));
}

/* Mental "Our approach": large card titles. */
.e-con.ei-approach .elementor-heading-title {
	font-size: var(--ei-fs-h2);
	line-height: 1.05;
}

/* Policy pages. */
.e-con.ei-legal .elementor-widget-heading + .elementor-widget {
	margin-block-start: calc(.75rem - var(--row-gap));
}

.e-con.ei-legal .elementor-widget-heading + .e-con {
	margin-block-start: calc(.75rem - var(--ei-flow-gap));
}

:is(.e-con.ei-legal, .e-con.ei-legal > .e-con-inner) > .elementor-widget-heading:has(h2, h3).elementor-element:where(:not(:nth-child(1 of .elementor-element))) {
	margin-block-start: calc(2.25rem - var(--row-gap));
}

:is(.e-con.ei-legal, .e-con.ei-legal > .e-con-inner) > .elementor-widget-heading:has(h3).elementor-element:where(:not(:nth-child(1 of .elementor-element))) {
	margin-block-start: calc(1.75rem - var(--row-gap));
}

.e-con.ei-legal h2.elementor-heading-title {
	font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.25rem);
}

.e-con.ei-legal h3.elementor-heading-title {
	font-size: clamp(1.25rem, 1.1rem + .5vw, 1.5rem);
}

/* A table's bottom margin merged with the larger top margin of the heading after it (block margins
   collapse; flex items' add up). */
:is(.e-con.ei-legal, .e-con.ei-legal > .e-con-inner) > .elementor-widget-text-editor:has(> .wp-block-table, > :is(.elementor-widget-container, .elementor-text-editor) > .wp-block-table):has(+ .elementor-widget-heading) {
	margin-block-end: 0;
}

/* The company address block 1rem under the text before it. */
:is(.e-con.ei-legal, .e-con.ei-legal > .e-con-inner) > .elementor-widget-text-editor:has(> .ei-legal__contact:first-child, > :is(.elementor-widget-container, .elementor-text-editor) > .ei-legal__contact:first-child).elementor-element:where(:not(:nth-child(1 of .elementor-element))) {
	margin-block-start: calc(1rem - var(--row-gap));
}

/* -------------------------------------------------------------------------
 * 10. Elementor's own widgets
 * ---------------------------------------------------------------------- */

/* Button widget = core/button (it replaces it in converted documents): the theme.json button element —
   red-dark pill; white with heading-coloured text on hover; the blue focus ring. */
.elementor-widget-button .elementor-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 47px;
	padding: 15px 30px;
	border-radius: var(--ei-radius-pill);
	background-color: var(--ei-red-dark);
	color: var(--ei-white);
	font-family: var(--ei-font-body);
	font-size: var(--ei-fs-body);
	font-weight: 500;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;
	transition: none;
}

.elementor-widget-button .elementor-button:hover {
	background-color: var(--ei-white);
	color: var(--ei-heading);
}

/* theme.json `:focus` ring at no weight: base.css's `:focus-visible` ring (white on dark surfaces)
   still wins for keyboard focus, as on core/button. */
:where(.elementor-widget-button .elementor-button:focus) {
	outline: 3px solid var(--ei-blue-brand);
	outline-offset: 3px;
}

/* Divider widget = thin rule (core/separator.is-style-ei-rule). The style class is the design, so it
   wins over the widget's defaults that Elementor writes into the page CSS (colour #000, 15px gap):
   doubled `.elementor` (0,4,0)/(0,5,0) over the per-element selectors (0,3,0)/(0,4,0). */
.elementor.elementor .elementor-widget-divider.is-style-ei-rule {
	--divider-border-style: solid;
	--divider-border-width: 1px;
	--divider-color: var(--ei-blue-tint);
}

.elementor.elementor .elementor-widget-divider.is-style-ei-rule .elementor-divider {
	padding-block: 0;
}

.elementor.elementor .elementor-widget-divider.is-style-ei-rule .elementor-divider-separator {
	width: 100%;
}

.elementor.elementor :is(.has-dark-bg, .e-con:is(.is-style-ei-photo-card, .is-style-ei-track-card, .is-style-ei-teal-card, .is-style-ei-dark-photo), .e-con.is-style-ei-card-blue) .elementor-widget-divider.is-style-ei-rule {
	--divider-color: rgba(255, 255, 255, .55);
}

.elementor.elementor .e-con.is-style-ei-card .elementor-widget-divider.is-style-ei-rule {
	--divider-color: rgba(78, 77, 77, .15);
}

/* Divider widget converted from a default core/separator (the converter keeps its
   `has-alpha-channel-opacity`): the separator's look — a 2px rule in the separator colour (theme.json
   core/separator), no gap of its own (the container's gap spaces it, as the block gap did). */
.elementor.elementor .elementor-widget-divider.has-alpha-channel-opacity:not(.is-style-ei-rule) {
	--divider-border-style: solid;
	--divider-border-width: 2px;
	--divider-color: rgba(32, 130, 171, .43);
}

.elementor.elementor .elementor-widget-divider.has-alpha-channel-opacity:not(.is-style-ei-rule) .elementor-divider {
	padding-block: 0;
}

/* -------------------------------------------------------------------------
 * 11. EI widgets in containers
 * ---------------------------------------------------------------------- */

/* An EI section (program sections, pricing, FAQ, testimonials …) spans its container even when the
   container centres its children; buttons, social links and one-line blocks keep their own width. */
:is(.e-con, .e-con > .e-con-inner) > .elementor-widget[class*="elementor-widget-ei-"]:not(.elementor-widget-ei-button, .elementor-widget-ei-theme-social-links, .elementor-widget-ei-business-info) {
	width: 100%;
}

/* Section blocks at the top of the page content: as in the block layout (components.css), the
   program cards, testimonials, articles, credibility strip and plain FAQ use the container width;
   the card FAQ 900px with the section gap around it; CTA and lead-magnet banners the container
   width with the section gap around them. */
:is([data-elementor-id], .elementor-section-wrap) > .e-con.e-con-full > .elementor-widget:is(.elementor-widget-ei-program-cards, .elementor-widget-ei-testimonials, .elementor-widget-ei-latest-articles, .elementor-widget-ei-related-articles, .elementor-widget-ei-credibility-strip) :is(.ei-program-cards, .ei-testimonials, .ei-articles, .ei-credibility, .ei-faq--plain),
:is([data-elementor-id], .elementor-section-wrap) > .e-con.e-con-full > .elementor-widget:is(.elementor-widget-ei-cta-banner, .elementor-widget-ei-lead-magnet) :is(.ei-cta, .ei-lead) {
	width: min(100% - 2 * var(--ei-gutter), var(--ei-container));
	margin-inline: auto;
}

:is([data-elementor-id], .elementor-section-wrap) > .e-con.e-con-full > .elementor-widget-ei-faq .ei-faq--card {
	width: min(100% - 2 * var(--ei-gutter), 900px);
	margin-inline: auto;
}

/* Blocks with the section gap above and below (CTA and lead-magnet banners, the card FAQ at the top
   level): the gap goes on their top-level container, whose margins collapse with its neighbours' in
   the document flow — as the blocks' own margins did in the block layout. */
:is([data-elementor-id], .elementor-section-wrap) > .e-con:has(> :is(.elementor-widget-ei-cta-banner, .elementor-widget-ei-lead-magnet).elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)), > .e-con-inner > :is(.elementor-widget-ei-cta-banner, .elementor-widget-ei-lead-magnet).elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element))),
:is([data-elementor-id], .elementor-section-wrap) > .e-con.e-con-full:has(> .elementor-widget-ei-faq.elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)) .ei-faq--card) {
	--margin-top: var(--ei-section-y);
	--margin-bottom: var(--ei-section-y);
}

/* After an unbanded section the section's own bottom padding is the gap above a CTA banner (a lead
   magnet banner keeps its own). */
:is([data-elementor-id], .elementor-section-wrap) > :is(.e-con.alignfull.is-style-ei-section, .e-con:has(.ei-program-cards, .ei-testimonials, .ei-articles)) + .e-con:has(> .elementor-widget-ei-cta-banner.elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element)), > .e-con-inner > .elementor-widget-ei-cta-banner.elementor-element:where(:nth-child(1 of .elementor-element):nth-last-child(1 of .elementor-element))) {
	--margin-top: 0px;
}

/* Author box + the text that continues its right column (About). */
:is([data-elementor-id], .elementor-section-wrap) > .e-con:has(.ei-author--full) + .e-con.ei-author-after {
	--margin-top: 1.75rem;
	--row-gap: 1.5rem;
}

.e-con.ei-author-after {
	--padding-bottom: var(--ei-section-y);
}

:is([data-elementor-id], .elementor-section-wrap) > .e-con:has(.ei-author--full):has(+ .e-con.ei-author-after) .ei-author--full {
	padding-bottom: 0;
}

@media (min-width: 1024px) {
	.e-con.ei-author-after > .e-con-inner,
	.e-con-full.ei-author-after {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		column-gap: 50px;
		align-content: start;
	}

	:is(.e-con.ei-author-after > .e-con-inner, .e-con-full.ei-author-after) > .elementor-element {
		grid-column: 2;
	}
}

/* EI block modifier classes live on the widget wrapper (Elementor's CSS classes): the descendant
   rules of components.css apply as they are; compound ones are repeated here. */
@media (min-width: 782px) {
	.elementor-widget.ei-page-hero--tall .ei-page-hero {
		justify-content: center;
		min-height: 450px;
		padding-bottom: 40px;
	}
}

/* `ei-collapse-empty` wrappers (block layouts drop them when their blocks print nothing): hidden when
   none of their widgets printed anything (inc/elementor.php takes most of them out of the page; this
   covers the rest). Never in the editor, where they must stay droppable. */
body:not(.elementor-editor-active) .e-con.ei-collapse-empty:not(:has(.elementor-widget > *)) {
	display: none;
}

/* Program page rhythm (Single Program sequence, one container per section): an unbanded program
   section after another starts with half the section gap; so does an Overview that starts with a
   plain section right after the intro, and the section after an Overview ending with one. */
:is([data-elementor-id], .elementor-section-wrap) > .e-con:has(:is(.ei-program-who, .ei-program-how, .ei-program-phases)) + .e-con :is(.ei-program-who, .ei-program-how, .ei-program-phases),
:is([data-elementor-id], .elementor-section-wrap) > .e-con.ei-program-overview:has(> .e-con.alignfull.is-style-ei-section.elementor-element:where(:nth-last-child(1 of .elementor-element))) + .e-con :is(.ei-program-who, .ei-program-how, .ei-program-phases) {
	padding-top: calc(var(--ei-section-y) * .5);
}

:is([data-elementor-id], .elementor-section-wrap) > .e-con:has(.ei-program-intro) + .e-con.ei-program-overview > .e-con.alignfull.is-style-ei-section.elementor-element:where(:nth-child(1 of .elementor-element)) {
	--padding-top: calc(var(--ei-section-y) * .5);
}

/* The disclaimer right after a white program section moves up to 28px below its content. */
:is([data-elementor-id], .elementor-section-wrap) > .e-con:has(:is(.ei-program-intro, .ei-program-who, .ei-program-how, .ei-program-phases)) + .e-con.ei-program-disclaimer {
	--margin-top: calc(28px - var(--ei-section-y));
	--padding-top: 0px;
}

/* Pricing panel 20px below a banded section. */
:is([data-elementor-id], .elementor-section-wrap) > .e-con:is(:has(:is(.ei-program-includes, .ei-program-mental)), .is-style-ei-gradient, .is-style-ei-panel) + .e-con .ei-pricing--panel {
	margin-top: var(--ei-gap);
}

/* Form bands (Coach Inquiry, Review): the form 800px wide, centred (components.css on the block). */
:is(.e-con.ei-form-band, .e-con.ei-form-band > .e-con-inner) > .elementor-widget-ei-form .ei-form-wrap {
	max-width: 800px;
	margin-inline: auto;
}

/* Template sections (forms, review links, share button). base.css / components.css space these
   sections (and the program disclaimer) with bare class rules, which reach the containers' outer box
   too: the containers take that spacing through Elementor's variables instead. */
.e-con-boxed:is(.ei-tpl-section, .ei-program-disclaimer) {
	padding-block: 0;
}

.e-con-full:is(.ei-tpl-section, .ei-program-disclaimer) {
	padding-block: var(--padding-block-start) var(--padding-block-end);
}

.e-con.ei-program-disclaimer {
	margin-block: var(--margin-block-start) var(--margin-block-end);
}

.e-con.ei-tpl-section {
	--padding-top: var(--ei-section-y);
	--padding-bottom: var(--ei-section-y);
}

/* … the review link and share button sit right under the page content (as after the block layout's
   post content), template sections under each other. */
:is([data-elementor-id], .elementor-section-wrap) > .e-con + .e-con.ei-tpl-section:is(.ei-tpl-review, .ei-tpl-share),
:is([data-elementor-id], .elementor-section-wrap) > .e-con.ei-tpl-section + .e-con.ei-tpl-section {
	--padding-top: 0px;
}

.e-con.ei-tpl-form {
	--content-width: 760px;
}

/* Program disclaimer between the phases / mental sections and the includes panel (centred from 782px). */
.e-con.ei-program-disclaimer {
	--padding-top: calc(var(--ei-section-y) * .5);
	--padding-bottom: calc(var(--ei-section-y) * .5);
}

@media (min-width: 782px) {
	.e-con.ei-program-disclaimer .elementor-widget-ei-disclaimer .ei-disclaimer {
		text-align: center;
	}
}

/* Articles (single.php prints the header; the document is the body): the reading column and type
   scale of the block layout's post content (base.css .ei-article__content) — 760px boxed content,
   1.125rem / 1.65 text, the article heading scale. Related articles keep the container width they
   have below the article in the block layout. */
.ei-article--elementor .ei-article__body {
	display: flow-root; /* like the post content: the last section's margin stays inside */
	margin-top: var(--ei-flow-gap);
	padding-block: clamp(28px, 4vw, 44px) 0;
	font-size: 1.125rem;
	line-height: 1.65;
}

.ei-article__body :is([data-elementor-id], .elementor-section-wrap) > .e-con {
	--container-max-width: 760px;
}

.ei-article__body :is([data-elementor-id], .elementor-section-wrap) > .e-con:has(> .elementor-widget-ei-related-articles, > .e-con-inner > .elementor-widget-ei-related-articles) {
	--container-max-width: var(--ei-container);
	font-size: var(--wp--preset--font-size--base);
	line-height: 1.5;
}

.ei-article__body .elementor-widget-heading h2.elementor-heading-title {
	font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.25rem);
	line-height: 1.1;
}

.ei-article__body .elementor-widget-heading h3.elementor-heading-title {
	font-size: clamp(1.25rem, 1.1rem + .5vw, 1.5rem);
	line-height: 1.2;
}

/* Headings 1.6em below the text above (their margin replaces the block gap; the .5em below merges
   with it). */
:is(.ei-article__body .e-con, .ei-article__body .e-con-inner) > .elementor-widget-heading:has(h2.elementor-heading-title).elementor-element:where(:not(:nth-child(1 of .elementor-element))) {
	margin-block-start: calc(1.6 * clamp(1.75rem, 1.4rem + 1.2vw, 2.25rem) - var(--row-gap));
}

:is(.ei-article__body .e-con, .ei-article__body .e-con-inner) > .elementor-widget-heading:has(h3.elementor-heading-title).elementor-element:where(:not(:nth-child(1 of .elementor-element))) {
	margin-block-start: calc(1.6 * clamp(1.25rem, 1.1rem + .5vw, 1.5rem) - var(--row-gap));
}

/* An article converted from blocks keeps the block layout's author box below its document
   (single.php): the block gap between them, as in the article's flow layout. */
.ei-article--elementor > .ei-article__footer {
	margin-top: var(--ei-flow-gap);
}

/* The author box stands outside the reading column's type scale, as below the article in the block
   layout (related articles: above). */
.ei-article__body .elementor-widget-ei-author-box {
	font-size: var(--wp--preset--font-size--base);
	line-height: 1.5;
}

/* The compact author box keeps the distance the article footer gives it in the block layout (over the
   "no gap above section-level EI blocks" rule of §2). */
.ei-article--elementor .ei-article__body :is([data-elementor-id], .elementor-section-wrap) > .e-con + .e-con:has(> .elementor-widget-ei-author-box, > .e-con-inner > .elementor-widget-ei-author-box) {
	--margin-top: clamp(28px, 4vw, 44px);
}

/* -------------------------------------------------------------------------
 * 12. Responsive: rows stack below 782px like core/columns (Elementor stacks below 768px). Rows
 * converted from core/columns are known by their classes: the theme's column styles, the columns'
 * alignment classes, or `ei-columns` (a marker the converter can add to any core/columns row).
 * ---------------------------------------------------------------------- */

@media (max-width: 781px) {
	.elementor .e-con.e-flex:is(.ei-columns, .is-style-ei-split, .ei-cards, .ei-approach, .ei-pillars, .ei-option-split, .ei-head-split, .ei-contact, .ei-pricing-split, [class*="are-vertically-aligned-"]):not(.is-not-stacked-on-mobile) {
		--flex-wrap: wrap;
	}

	.elementor :is(.e-con.e-flex:is(.ei-columns, .is-style-ei-split, .ei-cards, .ei-approach, .ei-pillars, .ei-option-split, .ei-head-split, .ei-contact, .ei-pricing-split, [class*="are-vertically-aligned-"]):not(.is-not-stacked-on-mobile), .e-con.e-flex:is(.ei-columns, .is-style-ei-split, .ei-cards, .ei-approach, .ei-pillars, .ei-option-split, .ei-head-split, .ei-contact, .ei-pricing-split, [class*="are-vertically-aligned-"]):not(.is-not-stacked-on-mobile) > .e-con-inner) > .e-con.e-con {
		--width: 100%;
	}
}

/* -------------------------------------------------------------------------
 * 13. Editor preview
 * ---------------------------------------------------------------------- */

/* The editor's markup (rules above already account for it): the document's containers sit in
   `.elementor-section-wrap`, Text Editor content in `.elementor-text-editor`, and every element starts
   with an overlay (plus shape dividers in containers) and ends with resize handles — hence the
   `:nth-child(1 of .elementor-element)` forms (wrapped in `:where()`, so they weigh what `:first-child`
   did) instead of `:first-child` / `:last-child` / `:only-child` among a container's elements. */

/* WordPress's toolbar is hidden in the preview, but its height variable stays set (46px on narrow
   screens): the sticky header would sit that far down the canvas. */
.elementor-editor-active {
	--wp-admin--admin-bar--height: 0px;
}

/* Elementor's empty-container placeholder keeps a visible drop area inside the theme's zero padding. */
.elementor-editor-active .e-con:has(> .elementor-empty-view, > .e-con-inner > .elementor-empty-view) {
	--min-height: 100px;
}

/* An Image widget that is still waiting for its custom-size file when the editor first renders it keeps
   Elementor's "empty widget" look (grey box + icon under the photo) after the photo has arrived. */
.elementor-widget-image.elementor-widget-empty:has(img[src]:not([src=""])) {
	background-color: transparent;
}

.elementor-widget-image.elementor-widget-empty:has(img[src]:not([src=""])) .elementor-widget-empty-icon {
	display: none;
}
