/* ==========================================================================
   EVOPURE CHROME — global header, mega menus, mobile drawer, side cart, footer
   Loaded site-wide by wp-content/mu-plugins/evopure-chrome.php (after blog.css).
   Where content is edited (menus, announcement, quiz, trust points, icons): see the header of evopure-chrome.php.

   ┌──────────────────────────  EDIT HERE — colours & tokens  ──────────────────────────┐
   Each token reads an Elementor Global Colour (Site Settings → Global Colours) with the
   hex as fallback. To override one just for the chrome, replace the whole value with a hex,
   e.g.  --evo-band-sleep: #E3ECE6;   Everything below cascades from these.               */
body {
	/* pillar tones — the label band under each mega-menu card */
	--evo-band-sleep:   var(--e-global-color-sleepwash,   #E3ECE6);
	--evo-band-flow:    var(--e-global-color-flowwash,    #D0E3D4);
	--evo-band-relief:  var(--e-global-color-reliefwash,  #F7E4DD);
	--evo-band-organic: var(--e-global-color-organicwash, #EEE8E0);
	/* …and the deeper tone each band moves to on hover */
	--evo-band-sleep-on:   var(--e-global-color-sleeplight,   #B8DCD9);
	--evo-band-flow-on:    var(--e-global-color-flowlight,    #78BF9E);
	--evo-band-relief-on:  var(--e-global-color-relieflight,  #FAC1BD);
	--evo-band-organic-on: var(--e-global-color-organiclight, #DACDC6);
	/* surfaces */
	--evo-header-surface: var(--e-global-color-white, #FFFFFF);      /* main bar — pure white */
	--evo-mega-rail:      color-mix(in srgb, var(--e-global-color-band, #F6F3EB) 45%, var(--e-global-color-sand, #ECE5D8));   /* mega menu: the left rail — a notch darker than Page, so the hovered white entry + panel read as a clear lift */
	--evo-mega-surface:   var(--e-global-color-white, #FFFFFF);       /* …and the card side is white. The hovered rail entry fills to this colour and runs into it as ONE surface */
	--evo-evolabs:        var(--e-global-color-evolabs, #213165);    /* Evolabs sub-brand world */
	--evo-offer:          var(--e-global-color-promotiffany, #EE6C4D); /* THE offer / money accent — ONE token: "Subscribe & save" pill, cart count bubble, any offer element.
	                                                                    Coral placeholder. Change it in Site Settings → Global Colours → "Offer accent" (or replace this whole value with a hex). */
	--evo-money:          var(--evo-offer);                            /* (older name, same token) */
	/* Evolabs flavour washes — soft tints behind each flavour's pack shot (homepage Evolabs block). Tunable here, never in section code */
	--evo-flav-orange:  #F8DDC2;
	--evo-flav-mint:    #D3EADF;
	--evo-flav-cherry:  #F2D0D4;
	--evo-flav-natural: #E4E0CF;
	/* the signature move: ONE radius, top-right corner only */
	--evo-nav-sans: "neue-haas-grotesk-text", var(--e-global-typography-subheadcaps-font-family), "Helvetica Neue", Arial, sans-serif;      /* sentence-case navigation labels (mega rail, mobile drawer). Caps labels keep the Display cut */
	--evo-radius-sig: 8px;
	--evo-radius-card: clamp(20px, 1.9vw, 28px);       /* the same top-right corner at CARD scale: big surfaces (product cards, science cards) where 8px stops reading. Buttons + small tiles stay on --evo-radius-sig */
	--evo-radius-sweep: clamp(32px, 5vw, 80px);        /* the same soft corner, scaled to a section: the goal selector that slides over the homepage hero (tunable) */
	--evo-card-scale: 1.018;                           /* THE card hover: one shadowless expand, site-wide */
	/* brand colour aliases — section code uses these, never raw hex */
	--evo-navy:      var(--e-global-color-navy, #1D293B);
	--evo-navy-deep: var(--e-global-color-navydeep, #141D2B);
	--evo-navy-soft: var(--e-global-color-navysoft, #2C3B52);
	--evo-charcoal:  var(--e-global-color-charcoal, #2B2B2B);
	--evo-slate:     var(--e-global-color-slate, #596C74);
	--evo-white:     var(--e-global-color-white, #FFFFFF);
	--evo-page:      var(--e-global-color-page, #FAF9F6);
	--evo-wash:      var(--e-global-color-wash, #E7EAEB);
	/* motion — the fixed vocabulary: 250ms hovers, 400ms section transitions, one ease, 60ms stagger */
	--evo-t-hover: 250ms;
	--evo-t-section: 400ms;
	--evo-ease: cubic-bezier(.22, .61, .36, 1);
	--evo-stagger: 60ms;
	/* the brand wave band: 72px desktop / 48px mobile (mobile value is set in the BRAND WAVE section below) — tunable */
	--evo-wave-h: 72px;
	/* hairlines (declared on body because Elementor defines Global Colours on the body kit class) */
	--evo-line: color-mix(in srgb, var(--e-global-color-navy) 12%, transparent);        /* on light */
	--evo-line-inv: color-mix(in srgb, var(--e-global-color-page) 12%, transparent);    /* on navy */
}
/* TYPE SYSTEM — three fonts, three jobs (locked site-wide):
   1. New Spirit (serif italic, navy, title case) ......... lead section headings + primary product / card titles.
                                                             Global Fonts: Display / H1 / H2 / H3 / Blog Card Heading.
   2. Neue Haas Grotesk (CAPS, tracked) ................... functional headings, eyebrows, labels, buttons, nav, and the descriptor line
                                                             under a title. Global Fonts: "Subheading Caps" (labels — every caps rule in
                                                             this CSS reads its family + weight from it), "Functional Heading" (caps section
                                                             headings, e.g. YOUR HEALTH, YOUR TERMS), Eyebrow, Caption, UI / Button.
   3. DM Sans (charcoal) .................................. body, sub-lines, prices, everything else. Global Fonts: Body / Lead / Price.
   Headings navy; subheadings + body charcoal. Change a font once in Site Settings → Global Fonts and it moves everywhere. */
body { --evo-caps-w: var(--e-global-typography-subheadcaps-font-weight, 600); }
body[class*="elementor-kit-"] { color: var(--evo-charcoal); }
body[class*="elementor-kit-"] h1, body[class*="elementor-kit-"] h2, body[class*="elementor-kit-"] h3,
body[class*="elementor-kit-"] h4, body[class*="elementor-kit-"] h5, body[class*="elementor-kit-"] h6 { color: var(--evo-navy); }
[data-pillar="sleep"]   { --evo-band: var(--evo-band-sleep); }
[data-pillar="flow"]    { --evo-band: var(--evo-band-flow); }
[data-pillar="relief"]  { --evo-band: var(--evo-band-relief); }
[data-pillar="organic"] { --evo-band: var(--evo-band-organic); }
.evo-pillar-sleep   { --evo-band: var(--evo-band-sleep);   --evo-band-on: var(--evo-band-sleep-on); }
.evo-pillar-flow    { --evo-band: var(--evo-band-flow);    --evo-band-on: var(--evo-band-flow-on); }
.evo-pillar-relief  { --evo-band: var(--evo-band-relief);  --evo-band-on: var(--evo-band-relief-on); }
.evo-pillar-organic { --evo-band: var(--evo-band-organic); --evo-band-on: var(--evo-band-organic-on); }
/* └────────────────────────────────────────────────────────────────────────────────────┘ */

/* ==========================================================================
   HEADER  (Theme Builder → "Evopure — Header")   Mobile-first: base rules = ≤1024px; desktop layer starts at 1025px.
   Rules: white bar · square everywhere · NO shadows, at rest or on hover · Tiffany only on the cart count ·
   the signature top-right corner (--evo-radius-sig) marks cards, the quiz pill hover/tap and the newsletter button hover.
   ========================================================================== */
:root {
	--evo-announce-h: 34px;           /* bar 1 */
	--evo-bar-h: 60px;                /* bar 2 at the top of the page */
	--evo-bar-h-condensed: 60px;      /* bar 2 once scrolled */
	--evo-gutter: 20px;
	--evo-chrome-max: 1320px;
	--evo-header-h: 94px;             /* visible header height; kept live by chrome.js */
}
@media (min-width: 1025px) {
	:root { --evo-announce-h: 40px; --evo-bar-h: 76px; --evo-bar-h-condensed: 64px; --evo-gutter: 32px; --evo-header-h: 116px; }
}
:root { --evo-ico-bag: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.75 8.25h12.5l1 12H4.75l1-12z'/%3E%3Cpath d='M8.75 8.25V7a3.25 3.25 0 016.5 0v1.25'/%3E%3C/svg%3E"); }

/* --- Sticky shell. The wrapper keeps a constant height in the page flow, so hiding the
       announcement / condensing the bar never moves the content underneath (no layout shift). */
.elementor-location-header {
	position: sticky; top: 0; z-index: 100;
	height: calc(var(--evo-announce-h) + var(--evo-bar-h));
	pointer-events: none;
	transition: top .25s ease;
}
.admin-bar .elementor-location-header { top: var(--wp-admin--admin-bar--height, 32px); }
.elementor-location-header.is-condensed { top: calc(-1 * var(--evo-announce-h)); }
.admin-bar .elementor-location-header.is-condensed { top: calc(var(--wp-admin--admin-bar--height, 32px) - var(--evo-announce-h)); }
@media (max-width: 600px) { .admin-bar .elementor-location-header, .admin-bar .elementor-location-header.is-condensed { top: 0; } .admin-bar .elementor-location-header.is-condensed { top: calc(-1 * var(--evo-announce-h)); } }
.evo-header { pointer-events: none; background: transparent; }
.elementor-editor-active .evo-header, .elementor-editor-active .elementor-location-header { pointer-events: auto; }   /* keep every handle clickable in the Elementor editor */
.evo-header > .evo-announce, .evo-header > .evo-bar { pointer-events: auto; }
.evo-header .e-con, .evo-header .elementor-widget { min-width: 0; }
.evo-header .elementor-widget { margin: 0 !important; }

/* --- Bar 1: announcement */
.evo-header .evo-announce { height: var(--evo-announce-h); min-height: 0; padding: 0 var(--evo-gutter); overflow: hidden; }
.evo-announce .evo-announce-w { width: 100%; }
.evo-announce__list { display: grid; align-items: center; justify-items: center; height: var(--evo-announce-h); }
.evo-announce__msg {
	grid-area: 1 / 1; margin: 0; white-space: nowrap;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif;
	font-weight: var(--e-global-typography-subheadcaps-font-weight, 700);
	letter-spacing: var(--e-global-typography-subheadcaps-letter-spacing, .16em);
	text-transform: uppercase; font-size: 11px; line-height: 1;
	color: var(--e-global-color-page);
	opacity: 0; visibility: hidden; transition: opacity .45s ease, visibility 0s linear .45s;
}
.evo-announce__msg.is-active { opacity: 1; visibility: visible; transition: opacity .45s ease, visibility 0s; }
@media (max-width: 380px) { .evo-announce__msg { font-size: 10px; letter-spacing: .12em; } }

/* --- Bar 2: main nav.  burger | wordmark | actions  (desktop: wordmark | nav | actions) */
.evo-header .evo-bar {
	display: grid !important; grid-template-columns: 1fr auto 1fr; align-items: center; column-gap: 12px;
	height: var(--evo-bar-h); min-height: 0;
	padding: 0 max(var(--evo-gutter), calc((100% - var(--evo-chrome-max)) / 2)) !important;
	border-bottom: 1px solid var(--evo-line);
	transition: height .25s ease;
}
.elementor-location-header.is-condensed .evo-bar { height: var(--evo-bar-h-condensed); }
.evo-bar > .elementor-element { width: auto; max-width: 100%; }
.evo-bar > .evo-burger-w { justify-self: start; margin-left: -10px !important; }
.evo-bar > .evo-actions { justify-self: end; width: auto !important; margin-right: -10px; }

/* icon buttons — 44px tap targets, 1.5px stroke navy */
.evo-header .evo-burger, .evo-header .evo-hicon, .evo-search .evo-search__close, .evo-drawer .evo-drawer__close {
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; padding: 0; margin: 0;
	background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
	color: var(--e-global-color-navy) !important; cursor: pointer; text-decoration: none;
	-webkit-tap-highlight-color: transparent; transition: opacity .2s ease;
}
.evo-header .evo-burger:hover, .evo-header .evo-hicon:hover, .evo-search .evo-search__close:hover { opacity: .6; }
.evo-header .evo-burger:focus-visible, .evo-header .evo-hicon:focus-visible, .evo-search__close:focus-visible, .evo-drawer__close:focus-visible,
.evo-drawer a:focus-visible, .evo-drawer button:focus-visible { outline: 1.5px solid var(--e-global-color-navy); outline-offset: -4px; }
.evo-ico { display: block; width: 24px; height: 24px; }
.evo-hicons { display: flex; align-items: center; }
.evo-header .evo-account-link { display: none; }                     /* mobile: account lives in the drawer */

/* logo — always an image (Image widget "Logo"), never live text. Clearspace = generous side padding. */
.evo-header .evo-logo { line-height: 0; padding: 0 12px; }
.evo-header .evo-logo a { display: block; line-height: 0; }
.evo-header .evo-logo img { display: block; height: 38px; width: auto; max-width: none; border-radius: 0; transition: height .25s ease; }
@media (min-width: 1025px) {
	.evo-header .evo-logo { padding: 0 24px 0 0; }
	.evo-header .evo-logo img { height: 48px; }
	.is-condensed .evo-header .evo-logo img { height: 42px; }
}

/* cart — Elementor menu-cart widget; Tiffany count is the only "money" colour in the chrome */
.evo-header .evo-cart .elementor-menu-cart__toggle .elementor-button {
	display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0 !important;
	background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
	color: var(--e-global-color-navy) !important;
}
.evo-header .evo-cart .elementor-menu-cart__toggle .elementor-button-text { display: none; }
.evo-header .evo-cart .elementor-menu-cart__toggle .elementor-button-icon { position: relative; display: block; width: 24px; height: 24px; font-size: 0; color: var(--e-global-color-navy); }
.evo-header .evo-cart .elementor-menu-cart__toggle .elementor-button-icon > svg, .evo-header .evo-cart .elementor-menu-cart__toggle .elementor-button-icon > i { display: none !important; }
.evo-header .evo-cart .elementor-menu-cart__toggle .elementor-button-icon::before {      /* bag from the evopure 1.5px-stroke set */
	content: ""; position: absolute; inset: 0; background: currentColor;
	-webkit-mask: var(--evo-ico-bag) center / 24px 24px no-repeat; mask: var(--evo-ico-bag) center / 24px 24px no-repeat;
}
.evo-header .evo-cart .elementor-button-icon-qty[data-counter] {
	top: -7px; right: -9px; inset-inline-end: -9px; min-width: 18px; height: 18px; line-height: 18px; padding: 0 4px; border-radius: 9px;
	background: var(--evo-offer) !important; color: var(--e-global-color-navy) !important;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-style: normal; font-size: 10px; letter-spacing: 0; text-align: center;
}
.evo-header .evo-cart .elementor-button-icon-qty[data-counter="0"] { display: none !important; }

/* --- Side cart (opens from the bag icon). Square, flat, brand type — the widget's own defaults are overridden here. */
.evo-header .evo-cart .elementor-menu-cart__container { background: color-mix(in srgb, var(--e-global-color-navydeep) 55%, transparent); }
.evo-header .evo-cart .elementor-menu-cart__main {
	width: min(420px, 100vw); max-width: 100vw; padding: 20px 24px 24px; box-shadow: none !important; border-radius: 0;
	background: var(--e-global-color-white); color: var(--e-global-color-charcoal);
	font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-style: normal;
}
.evo-header .evo-cart .elementor-menu-cart__close-button, .evo-header .evo-cart .elementor-menu-cart__close-button-custom { width: 24px; height: 24px; margin: 2px 0 18px auto; color: var(--e-global-color-navy); }
.evo-header .evo-cart .elementor-menu-cart__close-button::before, .evo-header .evo-cart .elementor-menu-cart__close-button::after { height: 1.5px; background: var(--e-global-color-navy); border-radius: 0; }
.evo-header .evo-cart .elementor-menu-cart__products { border-top: 1px solid var(--evo-line); }
.evo-header .evo-cart .elementor-menu-cart__product { padding: 16px 0; border-bottom: 1px solid var(--evo-line) !important; grid-template-columns: 72px auto; column-gap: 16px; }
.evo-header .evo-cart .elementor-menu-cart__product-image img { border-radius: 0; background: var(--e-global-color-wash); }
.evo-header .evo-cart .elementor-menu-cart__product-name, .evo-header .evo-cart .elementor-menu-cart__product-name a {
	font-family: var(--e-global-typography-body-font-family), sans-serif !important; font-weight: 300 !important; font-style: normal !important;
	font-size: 16px !important; line-height: 1.35 !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--e-global-color-charcoal) !important; text-decoration: none;
}
.evo-header .evo-cart .elementor-menu-cart__product-price, .evo-header .evo-cart .elementor-menu-cart__product-price *,
.evo-header .evo-cart .elementor-menu-cart__product .variation, .evo-header .evo-cart .elementor-menu-cart__product .variation * {
	font-family: var(--e-global-typography-body-font-family), sans-serif !important; font-weight: 300 !important; font-style: normal !important;
	font-size: 14px !important; line-height: 1.4 !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--e-global-color-slate) !important;
}
.evo-header .evo-cart .elementor-menu-cart__product-remove { border-radius: 0; border: 0; color: var(--e-global-color-slate); }
.evo-header .evo-cart .elementor-menu-cart__product-remove::before, .evo-header .evo-cart .elementor-menu-cart__product-remove::after { background: var(--e-global-color-slate); height: 1.5px; }
.evo-header .evo-cart .elementor-menu-cart__subtotal, .evo-header .evo-cart .elementor-menu-cart__subtotal * {
	font-family: var(--e-global-typography-body-font-family), sans-serif !important; font-style: normal !important; font-size: 16px !important; letter-spacing: 0 !important;
	text-transform: none !important; color: var(--e-global-color-charcoal) !important;
}
.evo-header .evo-cart .elementor-menu-cart__subtotal { display: flex; justify-content: space-between; align-items: baseline; padding: 18px 0; border: 0 !important; font-weight: 300 !important; text-align: left; }
.evo-header .evo-cart .elementor-menu-cart__subtotal strong {
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w) !important; font-size: 12px !important; letter-spacing: .16em !important; text-transform: uppercase !important;
}
.evo-header .evo-cart .elementor-menu-cart__footer-buttons { display: grid; grid-template-columns: 1fr; gap: 10px; }
.evo-header .evo-cart .elementor-menu-cart__footer-buttons .elementor-button {
	display: flex; align-items: center; justify-content: center; height: var(--evo-cta-h, 48px); padding: 0 20px !important; border-radius: 0 !important; box-shadow: none !important;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w) !important; font-style: normal !important;
	font-size: 12px !important; letter-spacing: .16em !important; text-transform: uppercase !important; line-height: 1 !important;
	transition: background-color .25s ease, color .25s ease;
}
.evo-header .evo-cart .elementor-menu-cart__footer-buttons .elementor-button--checkout { order: -1; background: var(--e-global-color-navy) !important; color: var(--e-global-color-page) !important; border: 1px solid var(--e-global-color-navy) !important; }
.evo-header .evo-cart .elementor-menu-cart__footer-buttons .elementor-button--checkout:hover { border-radius: 0 var(--evo-radius-sig) 0 0 !important; }
.evo-header .evo-cart .elementor-menu-cart__footer-buttons .elementor-button--view-cart { background: transparent !important; color: var(--e-global-color-navy) !important; border: 1px solid var(--e-global-color-navy) !important; }
.evo-header .evo-cart .elementor-menu-cart__footer-buttons .elementor-button--view-cart:hover { border-radius: 0 var(--evo-radius-sig) 0 0 !important; }
.evo-header .evo-cart .woocommerce-mini-cart__empty-message { font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-size: 16px; color: var(--e-global-color-charcoal); padding: 24px 0; text-align: left; }

/* desktop-only pieces are hidden by Elementor's responsive switch (mega menu, quiz pill) */

/* --- Search overlay.  Mobile: covers the bar.  Desktop: opens beneath the nav. */
.evo-bar > .evo-search-w { position: absolute !important; inset: 0; width: auto; pointer-events: none; z-index: 5; }
.evo-search {
	position: absolute; left: 0; right: 0; top: 0; pointer-events: auto;
	background: var(--e-global-color-white);
	opacity: 0; transition: opacity .2s ease;
}
.evo-search.is-open { opacity: 1; }
.evo-search[hidden] { display: none; }
.evo-search__form {
	display: flex; align-items: center; gap: 4px; margin: 0;
	height: var(--evo-bar-h); padding: 0 calc(var(--evo-gutter) - 10px);
	border-bottom: 1px solid var(--evo-line);
	transition: height .25s ease;
}
.is-condensed .evo-search__form { height: var(--evo-bar-h-condensed); }
.evo-search__lead { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; color: var(--e-global-color-navy); flex: none; }
.evo-search .evo-search__input {
	flex: 1 1 auto; min-width: 0; height: 44px; padding: 0 4px !important; margin: 0;
	background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; outline: 0 !important;
	font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-size: 17px; line-height: 1.2;
	color: var(--e-global-color-charcoal); -webkit-appearance: none; appearance: none;
}
.evo-search__input::placeholder { color: var(--e-global-color-slate); opacity: 1; }
.evo-search__input::-webkit-search-cancel-button { display: none; }
.evo-search__results { max-height: calc(100vh - var(--evo-header-h) - 24px); max-height: calc(100dvh - var(--evo-header-h) - 24px); overflow-y: auto; overscroll-behavior: contain; }
.evo-search__results:empty { display: none; }
.evo-search__results { padding: 8px var(--evo-gutter) 20px; border-bottom: 1px solid var(--evo-line); }
.evo-search__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; }
.evo-search__item { display: flex; align-items: center; gap: 14px; padding: 10px 0; text-decoration: none; border-bottom: 1px solid var(--evo-line); }
.evo-search__list li:last-child .evo-search__item { border-bottom: 0; }
.evo-search__thumb { flex: none; width: 56px; height: 56px; background: var(--e-global-color-wash); overflow: hidden; }
.evo-search__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
.evo-search__text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.evo-search__title { font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-size: 16px; line-height: 1.3; color: var(--e-global-color-charcoal); }
.evo-search__item:hover .evo-search__title { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.evo-search__price, .evo-search__empty { font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-size: 14px; color: var(--e-global-color-slate); margin: 0; }
.evo-search__empty { padding: 14px 0 4px; }
.evo-search__all {
	display: inline-block; margin-top: 14px; color: var(--e-global-color-navy); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 12px; letter-spacing: .16em; text-transform: uppercase;
}

/* --- Mobile menu (printed in wp_footer by evopure-chrome.php, built from the "Evopure — Main menu"). FULL SCREEN.
       A category opens a 2-up grid of the same image cards as desktop; LEARN keeps plain links. */
.evo-drawer-backdrop { position: fixed; inset: 0; z-index: 1000; background: var(--e-global-color-white); opacity: 0; transition: opacity .3s ease; }
.evo-drawer {
	position: fixed; inset: 0; z-index: 1001; width: 100%; display: flex; flex-direction: column;
	background: var(--e-global-color-white); color: var(--e-global-color-charcoal);
	transform: translateX(-102%); transition: transform .3s ease; box-shadow: none;
}
.evo-drawer[hidden], .evo-drawer-backdrop[hidden] { display: none; }
.evo-drawer-open .evo-drawer { transform: none; }
.evo-drawer-open .evo-drawer-backdrop { opacity: 1; }
html.evo-drawer-open, html.evo-drawer-open body { overflow: hidden; }
.evo-drawer__top { flex: none; display: flex; align-items: center; gap: 8px; padding: 12px 8px 12px 16px; border-bottom: 1px solid var(--evo-line); }
.evo-drawer .evo-drawer__quiz {
	flex: 1 1 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px;
	height: var(--evo-cta-h, 48px); padding: 0 18px; border-radius: 0; border: 1px solid var(--e-global-color-navy);
	background: var(--e-global-color-navy); color: var(--e-global-color-white) !important; text-decoration: none;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 12px; letter-spacing: .16em; text-transform: uppercase;
	transition: border-radius var(--evo-t-hover) var(--evo-ease), background-color var(--evo-t-hover) var(--evo-ease), color var(--evo-t-hover) var(--evo-ease); -webkit-tap-highlight-color: transparent;
}
/* no hover on touch → the button interaction fires on tap */
.evo-drawer .evo-drawer__quiz:active, .evo-drawer .evo-drawer__quiz:focus-visible { border-radius: 0 var(--evo-radius-sig) 0 0; background: transparent; color: var(--e-global-color-navy) !important; outline: 0; }
.evo-drawer__quiz .evo-ico { width: 20px; height: 20px; }
.evo-drawer .evo-drawer__close { flex: none; position: static; margin: 0; color: var(--e-global-color-navy) !important; }
.evo-drawer__nav { flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.evo-drawer .evo-dacc, .evo-drawer .evo-drow { border-bottom: 1px solid var(--evo-line); }
.evo-drawer .evo-dacc__head, .evo-drawer .evo-drow {
	display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 60px; padding: 0 20px; margin: 0;
	background: transparent !important; border-radius: 0 !important; box-shadow: none !important; cursor: pointer; text-align: left; text-decoration: none;
	color: var(--e-global-color-navy) !important;
	font-family: var(--evo-nav-sans); font-weight: 500; font-size: 17.5px; letter-spacing: .005em; text-transform: none; line-height: 1.2;      /* same as the desktop rail: Neue Haas, sentence case */
	-webkit-tap-highlight-color: transparent;
}
.evo-drawer .evo-dacc__head { border: 0 !important; }
.evo-dacc__mark { position: relative; flex: none; width: 14px; height: 14px; }
.evo-dacc__mark::before, .evo-dacc__mark::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1.5px; margin-top: -.75px; background: var(--e-global-color-navy); transition: transform .25s ease; }
.evo-dacc__mark::after { transform: rotate(90deg); }
.evo-dacc.is-open .evo-dacc__mark::after { transform: rotate(0deg); }
.evo-dacc__cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 2px 20px 6px; }      /* the 2×2 */
.evo-dacc__cards .evo-mcard__label { font-size: 18px; left: 12px; top: 11px; right: 12px; }
.evo-dacc__cards .evo-mcard .evo-mcard__go { right: 10px; bottom: 10px; width: 30px; height: 30px; }
.evo-dacc__cards .evo-mcard__soon { left: 12px; bottom: 14px; font-size: 9.5px; }
.evo-dworld { display: block; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 0 var(--evo-radius-sig) 0 0; background: var(--evo-evolabs); line-height: 0; -webkit-tap-highlight-color: transparent; }      /* the "evolabs by evopure" tile takes the spare slot */
.evo-dworld .evo-dworld__logo { display: block; width: 100%; height: 100% !important; max-width: none; object-fit: cover; border-radius: 0; }
.evo-dacc__body ul { list-style: none; margin: 0; padding: 0 20px 12px; }
.evo-dacc__body li a {
	display: flex; align-items: center; min-height: 46px; text-decoration: none; color: var(--e-global-color-charcoal);
	font-family: var(--evo-nav-sans); font-weight: 400; font-size: 16.5px; letter-spacing: .005em; line-height: 1.3;
}
.evo-dacc__body .evo-dall {
	display: flex; align-items: center; justify-content: space-between; min-height: 48px; margin: 4px 20px 14px; text-decoration: none; color: var(--e-global-color-navy);
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 12px; letter-spacing: .16em; text-transform: uppercase;
}
/* foot: one calm account row + one quiet trust line */
.evo-drawer__foot { flex: none; padding: 0 20px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--evo-line); background: var(--e-global-color-white); }
.evo-drawer .evo-drawer__account {      /* the account entry is OUR pill: a squared navy button that carries the signature top-right corner at rest, with the button's own type + height */
	display: flex; align-items: center; gap: 12px; height: var(--evo-cta-h, 48px); margin: 14px 0 10px; padding: 0 18px; border: 1px solid var(--e-global-color-navy); border-radius: 0 calc(var(--evo-radius-sig) * 2) 0 0; text-decoration: none;
	background: var(--e-global-color-navy); color: var(--e-global-color-white) !important; -webkit-tap-highlight-color: transparent; transition: background-color var(--evo-t-hover) var(--evo-ease), color var(--evo-t-hover) var(--evo-ease);
}
.evo-drawer .evo-drawer__account:active, .evo-drawer .evo-drawer__account:focus-visible { background: transparent; color: var(--e-global-color-navy) !important; outline: 0; }      /* no hover on touch → the button interaction fires on tap */
.evo-drawer__account .evo-ico { flex: none; width: 20px; height: 20px; color: inherit; }
.evo-drawer__account-text { font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; line-height: 1; }
.evo-drawer__account-hint { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; font-family: var(--evo-nav-sans); font-weight: 400; font-size: 13.5px; letter-spacing: .005em; line-height: 1; color: inherit; opacity: .8; }
.evo-drawer__account-hint::after { content: ""; flex: none; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--evo-ico-arrow) center / 16px 16px no-repeat; mask: var(--evo-ico-arrow) center / 16px 16px no-repeat; }
.evo-drawer__trust { margin: 0; padding-top: 2px; text-align: center; font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-size: 12px; letter-spacing: .02em; color: var(--e-global-color-slate); }

/* desktop nav + mega panels never render ≤1024px */
.evo-header .evo-nav-w { display: none; }

/* ------------------------------------------------------------------ DESKTOP ≥1025px */
@media (min-width: 1025px) {
	.evo-header .evo-burger-w { display: none !important; }
	.evo-drawer, .evo-drawer-backdrop { display: none !important; }
	.evo-bar > .evo-actions { margin-right: -8px; }
	.evo-header .evo-burger, .evo-header .evo-hicon, .evo-header .evo-cart .elementor-menu-cart__toggle .elementor-button { width: 40px; height: 40px; }
	.evo-header .evo-account-link { display: inline-flex; }
	.evo-bar > .evo-logo { justify-self: start; }

	/* nav — DM Sans 700 caps, deliberately tight; no underline; open state = the chevron only */
	.evo-header .evo-nav-w { display: block; position: static !important; justify-self: center; }
	.evo-nav__list { display: flex; align-items: stretch; list-style: none; margin: 0; padding: 0; }
	.evo-nav__item { display: flex; }
	.evo-nav .evo-nav__link {
		display: flex; align-items: center; gap: 6px; height: var(--evo-bar-h); padding: 0 13px; white-space: nowrap; text-decoration: none !important;
		font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; line-height: 1;
		color: var(--e-global-color-navy); transition: opacity .2s ease, height .25s ease; outline-offset: -6px;
	}
	.is-condensed .evo-nav .evo-nav__link { height: var(--evo-bar-h-condensed); }
	.evo-nav__list:hover .evo-nav__link, .evo-mega-open .evo-nav__link { opacity: .5; }
	.evo-nav__list .evo-nav__item:hover .evo-nav__link, .evo-nav__item.is-open .evo-nav__link, .evo-nav .evo-nav__link:focus-visible { opacity: 1; }
	.evo-nav__link .evo-ico--chevron { width: 13px; height: 13px; margin-top: -1px; transition: transform .3s ease; }
	.evo-nav__item.is-open .evo-ico--chevron { transform: rotate(180deg); }

	/* quiz pill — the primary button (class evo-cta), just shorter in the bar. Symmetric padding: the label sits dead-centre at rest and
	   never moves; the hover arrow appears inside the right padding. */
	.evo-header .evo-quiz { margin-right: 10px !important; }
	.evo-header .evo-quiz .elementor-button { min-height: 0; height: var(--evo-control-h, 44px); padding: 0 36px !important; transition: border-radius var(--evo-t-hover) var(--evo-ease), background-color var(--evo-t-hover) var(--evo-ease), border-color var(--evo-t-hover) var(--evo-ease), color var(--evo-t-hover) var(--evo-ease), height .25s ease; }
	.evo-header .evo-quiz .elementor-button::after { right: 12px; width: 16px; height: 16px; margin-top: -8px; -webkit-mask-size: 16px 16px; mask-size: 16px 16px; }
	.is-condensed .evo-header .evo-quiz .elementor-button { height: 40px; }

	/* ---- mega panel: white, minimal framing; left rail + right image-card view */
	.evo-mega {
		position: absolute; left: 0; right: 0; top: 100%; overflow: hidden;
		background: var(--evo-mega-rail); border-top: 0; border-bottom: 1px solid var(--evo-line); box-shadow: none;      /* the rail colour fills the panel; the card side paints white over its half */
		opacity: 0; transition: opacity .22s ease;
	}
	.evo-mega.is-open { opacity: 1; }
	.evo-mega[hidden] { display: none; }
	.evo-mega__inner {
		display: grid; grid-template-columns: 250px minmax(0, 1fr); min-height: 0;      /* height follows the rail / cards — no dead space under short card rows */
		padding: 0 max(var(--evo-gutter), calc((100% - var(--evo-chrome-max)) / 2));
	}
	/* RAIL — connected-surface hover (flat: no shadows, no accent lines). The rail is off-white and bleeds to the left screen edge; the
	   ACTIVE entry fills to the card side's colour (white · Evolabs blue for Evolabs) and meets it with no gap or line, so entry + panel
	   read as one continuous surface. SHOP and LEARN share every rule here. */
	.evo-rail { display: flex; flex-direction: column; padding: 24px 0 32px; }
	.evo-rail__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0; }
	.evo-rail .evo-rail__link {
		position: relative; display: block; padding: 15px 24px 15px 0; text-decoration: none !important;
		font-family: var(--evo-nav-sans); font-weight: 500; font-size: 16.5px; line-height: 1.2; letter-spacing: .005em; text-transform: none;      /* crisp navigation: Neue Haas (the Text cut, drawn for this size), sentence case. New Spirit is kept for the card titles */
		color: var(--e-global-color-charcoal); background: transparent; transition: background-color .2s ease, color .2s ease;
	}
	.evo-rail__link::before { content: ""; position: absolute; top: 0; bottom: 0; right: 100%; width: 50vw; background: inherit; }      /* the fill runs on to the screen's left edge */
	.evo-rail .evo-rail__link.is-active { background: var(--evo-mega-surface); color: var(--e-global-color-navy); }      /* same weight: the fill marks the choice, the label never jiggles */
	.evo-mega[data-world="evolabs"] .evo-rail .evo-rail__link.is-active { background: var(--evo-evolabs); color: var(--e-global-color-page); }
	.evo-rail .evo-rail__link:focus-visible { outline: 1.5px solid var(--e-global-color-navy); outline-offset: -3px; }
	/* pinned links under the rail (Bestsellers, Shop All): aligned to the rail text, set apart by a hairline */
	.evo-rail__pins { margin-top: auto; padding-top: 28px; display: flex; flex-direction: column; gap: 0; }      /* set apart by space, not a rule */
	.evo-rail .evo-rail__pin {
		display: flex; align-items: center; justify-content: flex-start; gap: 10px; padding: 9px 0; text-decoration: none !important; color: var(--e-global-color-navy);
		font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; line-height: 1;
	}
	.evo-rail__pin .evo-ico { flex: none; transition: transform .25s ease; }
	.evo-rail__pin:hover .evo-ico, .evo-rail__pin:focus-visible .evo-ico { transform: translateX(5px); }

	.evo-mega__views { position: relative; padding: 36px 0 36px 40px; background: var(--evo-mega-surface); transition: background-color .2s ease; }      /* cards anchor to the top of the panel, level with the first rail entry */
	.evo-mega__views { display: flex; flex-direction: column; }
	.evo-mview.is-active { flex: 1 1 auto; display: flex; flex-direction: column; animation: evo-mview-in .3s ease both; }
	/* the range one-liner under the cards (menu item → "Evopure slogan"): New Spirit, light italic, on the panel's bottom line */
	.evo-mview__slogan {
		margin: auto 0 0; padding-top: 22px; font-family: var(--e-global-typography-h3-font-family), serif; font-weight: 300; font-style: italic;
		font-size: clamp(24px, 2vw, 30px); letter-spacing: -.005em; line-height: 1.15; color: var(--evo-navy);
	}
	@keyframes evo-mview-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
	.evo-mview__grid { display: grid; grid-template-columns: repeat(var(--evo-cols, 4), minmax(0, 1fr)); gap: 20px; align-items: start; }      /* one grid, one gutter, every card the same size */
	.evo-mview__heading {
		margin: 0 0 18px; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--e-global-color-navy);
	}

	/* (the card itself = the MENU CARD block near the end of this file — shared with the mobile drawer) */

	/* range-intro card — fills spare grid slots so no panel ends in blank space (text = the rail item's Description).
	   It stretches to exactly the cards' height, so cards and intro share one top line and one baseline. */
	.evo-mintro {
		align-self: stretch; display: flex; flex-direction: column; justify-content: flex-start; gap: 10px; padding: 22px 24px 20px; overflow: hidden; text-decoration: none !important;
		background: var(--evo-mega-rail); border: 0; border-radius: 0 var(--evo-radius-sig) 0 0;      /* a tone, never an outline */
	}
	.evo-mintro__eyebrow { font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--e-global-color-slate); }
	.evo-mintro__title { font-family: var(--e-global-typography-h3-font-family), serif; font-weight: 700; font-style: italic; font-size: 27px; letter-spacing: -.005em; line-height: 1.1; color: var(--e-global-color-navy); }
	.evo-mintro__text { font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-size: 15px; line-height: 1.5; color: var(--e-global-color-charcoal); max-width: 46ch; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
	.evo-mintro__cta {
		display: inline-flex; align-items: center; gap: 10px; margin-top: auto; padding-top: 6px; color: var(--e-global-color-navy);
		font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 12px; letter-spacing: .16em; text-transform: uppercase;
	}
	.evo-mintro__cta .evo-ico { transition: transform .25s ease; }
	.evo-mintro:hover .evo-mintro__cta .evo-ico { transform: translateX(5px); }

	/* Evolabs = its own world: the right side turns Evolabs blue (bleeds to the screen edge). Logo block on the left, three cards on
	   one grid. Here the card is STACKED — product image on top, title + arrow on a bar beneath — so a title never sits over a product. */
	.evo-mega[data-world="evolabs"] .evo-mega__views { background: var(--evo-evolabs); }
	.evo-mega__views::after { content: ""; position: absolute; top: 0; bottom: 0; left: 100%; width: 50vw; background: inherit; }
	.evo-mview--world.is-active { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); grid-template-rows: minmax(0, 1fr); gap: 20px; align-items: stretch; }
	.evo-mview--world .evo-mview__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: minmax(0, 1fr); align-items: stretch; }      /* no slogan here: the cards grow to fill the whole panel */
	.evo-mworld { display: flex; flex-direction: column; justify-content: space-between; text-decoration: none !important; color: var(--e-global-color-page); }
	.evo-mworld .evo-mworld__logo { display: block; width: 100%; max-width: 200px; height: auto; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 0; margin: -18px 0 0 -14px; }      /* the logo tile has its own margin baked in — pull it onto the grid line */
	.evo-mworld__name { font-family: var(--e-global-typography-h3-font-family), serif; font-weight: 700; font-style: italic; font-size: 34px; }
	.evo-mworld__cta {
		display: inline-flex; align-items: center; gap: 10px; min-height: 58px;
		font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--e-global-color-page);
	}
	.evo-mworld__cta .evo-ico { transition: transform .25s ease; }
	.evo-mworld:hover .evo-mworld__cta .evo-ico { transform: translateX(4px); }
	.evo-mview--world .evo-mcard { display: flex; flex-direction: column; background: transparent; border-radius: 0; overflow: visible; }
	.evo-mview--world .evo-mcard__media { position: relative; flex: 1 1 auto; aspect-ratio: auto; min-height: 184px; border-radius: 0 var(--evo-radius-sig) 0 0; background: var(--e-global-color-white); }
	.evo-mview--world .evo-mcard .evo-mcard__img { position: absolute; inset: 0; }
	.evo-mview--world .evo-mcard__foot { position: static; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 58px; padding: 0 12px 0 14px; background: color-mix(in srgb, var(--e-global-color-white) 10%, transparent); }
	.evo-mview--world .evo-mcard__label { position: static; color: var(--evo-page); font-size: 19px; }
	.evo-mview--world .evo-mcard .evo-mcard__go { position: static; border-color: var(--evo-page); color: var(--evo-page); }

	/* LEARN — brand links on the left, the 3 latest Journal posts on the right: fixed 3:2, cover, signature corner */
	.evo-mega--posts .evo-mview__grid { gap: 28px; }
	.evo-acard { display: flex; flex-direction: column; text-decoration: none !important; }
	.evo-acard__media { display: block; aspect-ratio: 3 / 2; overflow: hidden; border-radius: 0 var(--evo-radius-sig) 0 0; background: var(--e-global-color-wash); }
	.evo-acard .evo-acard__img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: var(--evo-focal, 50% 50%); border-radius: 0; }
	.evo-acard__eyebrow {
		margin-top: 14px; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--e-global-color-slate);
	}
	.evo-acard__title {
		margin-top: 6px; font-family: var(--e-global-typography-h3-font-family), serif; font-weight: 700; font-style: italic; font-size: 19px; letter-spacing: -.005em; line-height: 1.25; color: var(--e-global-color-navy);
		display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
	}

	/* search: opens beneath the nav */
	.evo-search { top: 100%; border-bottom: 0; }
	.evo-search__form { height: 72px; padding: 0 max(calc(var(--evo-gutter) - 10px), calc((100% - var(--evo-chrome-max)) / 2 - 10px)); }
	.is-condensed .evo-search__form { height: 64px; }
	.evo-search .evo-search__input { font-size: 20px; }
	.evo-search__results { padding: 12px max(var(--evo-gutter), calc((100% - var(--evo-chrome-max)) / 2)) 28px; }
	.evo-search__list { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 32px; }
	.evo-search__list li:nth-last-child(-n+3) .evo-search__item { border-bottom: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.elementor-location-header, .evo-header .evo-bar, .evo-drawer, .evo-drawer-backdrop, .evo-announce__msg, .evo-mega, .evo-mcard, .evo-acard, .evo-mintro, .evo-mview.is-active { transition: none !important; animation: none !important; }
}

/* ==========================================================================
   FOOTER  (global — Theme Builder → "Evopure — Footer")   navy · off-white · hairlines · no shadows
   Mobile-first; link columns are accordions ≤1024px (chrome.js), open columns ≥1025px.
   ========================================================================== */
.evo-footer { color: var(--e-global-color-page); --evo-fmeta: color-mix(in srgb, var(--e-global-color-page) 62%, var(--e-global-color-navy)); }
.evo-footer .elementor-widget { margin: 0 !important; }
.evo-footer a { color: inherit; }

/* newsletter band */
.evo-footer .evo-fnews__title .elementor-heading-title {      /* a functional heading → Neue Haas caps (type system, job 2) */
	font-family: var(--e-global-typography-funchead-font-family, var(--e-global-typography-subheadcaps-font-family)), sans-serif !important; font-weight: var(--e-global-typography-funchead-font-weight, 600) !important; font-style: normal !important; text-transform: uppercase !important;
	font-size: clamp(22px, 2.1vw, 30px) !important; letter-spacing: .06em !important; line-height: 1.18 !important; margin: 0; color: var(--e-global-color-white);
}
.evo-footer .evo-fnews__sub, .evo-footer .evo-fnews__sub p { margin: 0; font-size: 16px; line-height: 1.5; color: var(--e-global-color-page); opacity: .82; }
.evo-footer .evo-newsletter .elementor-form-fields-wrapper { margin: 0 !important; width: 100%; gap: 10px 0; }
.evo-footer .evo-newsletter .elementor-field-group { margin: 0 !important; padding: 0 !important; }
.evo-footer .evo-newsletter .elementor-field-textual {
	height: 48px; min-height: 48px; padding: 0 16px; background: transparent !important; box-shadow: none !important;
	border: 1px solid color-mix(in srgb, var(--e-global-color-page) 45%, transparent) !important; border-radius: 0 !important;
	color: var(--e-global-color-white) !important;
	font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-size: 16px;
}
.evo-footer .evo-newsletter .elementor-field-textual::placeholder { color: var(--e-global-color-page); opacity: .65; }
.evo-footer .evo-newsletter .elementor-field-textual:focus { border-color: var(--e-global-color-white) !important; outline: 0; }
.evo-footer .evo-newsletter .elementor-button {      /* the primary button interaction, on-navy colours (off-white at rest → off-white outline on hover) */
	position: relative; box-sizing: border-box; width: 100%; height: 48px; min-height: 48px; padding: 0 40px !important; border-radius: 0 !important; box-shadow: none !important; transform: none !important;
	background: var(--e-global-color-page) !important; color: var(--e-global-color-navy) !important; border: 1px solid var(--e-global-color-page) !important;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; line-height: 1;
	transition: border-radius var(--evo-t-hover) var(--evo-ease), background-color var(--evo-t-hover) var(--evo-ease), color var(--evo-t-hover) var(--evo-ease);
}
.evo-footer .evo-newsletter .elementor-button::after {
	content: ""; position: absolute; right: 13px; top: 50%; width: 16px; height: 16px; margin-top: -8px; background: currentColor;
	-webkit-mask: var(--evo-ico-arrow) center / 16px 16px no-repeat; mask: var(--evo-ico-arrow) center / 16px 16px no-repeat;
	opacity: 0; transform: translateX(-8px); transition: opacity var(--evo-t-hover) var(--evo-ease), transform var(--evo-t-hover) var(--evo-ease);
}
.evo-footer .evo-newsletter .elementor-button:hover, .evo-footer .evo-newsletter .elementor-button:focus-visible {      /* solo button → corner + arrow + invert */
	border-radius: 0 var(--evo-radius-sig) 0 0 !important; background: transparent !important; border-color: var(--e-global-color-page) !important; color: var(--e-global-color-page) !important;
}
.evo-footer .evo-newsletter .elementor-button:hover::after, .evo-footer .evo-newsletter .elementor-button:focus-visible::after { opacity: 1; transform: none; }
.evo-footer .evo-newsletter .elementor-message { margin-top: 12px; font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-size: 14px; color: var(--e-global-color-page); }

/* review stars — static score until LipScore is connected */
.evo-footer .evo-stars { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin-top: 8px; text-decoration: none !important; color: var(--e-global-color-white); }
.evo-stars__row { position: relative; display: inline-block; line-height: 0; white-space: nowrap; }
.evo-stars__base, .evo-stars__fill { display: inline-flex; gap: 3px; }
.evo-stars__base { color: color-mix(in srgb, var(--e-global-color-page) 28%, transparent); }
.evo-stars__fill { position: absolute; left: 0; top: 0; overflow: hidden; color: var(--e-global-color-page); }
.evo-stars__base svg, .evo-stars__fill svg { flex: none; display: block; width: 18px; height: 18px; }
.evo-stars__text { font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--e-global-color-white); }
.evo-stars__count { font-weight: 500; color: var(--evo-fmeta); }

/* link columns → accordions (mobile) */
.evo-footer .evo-flinks { border-top: 1px solid var(--evo-line-inv); }
.evo-footer .evo-fcol { border-bottom: 1px solid var(--evo-line-inv); }
.evo-footer .evo-fcol__title .elementor-heading-title {
	display: flex; align-items: center; justify-content: space-between; min-height: 58px; margin: 0; cursor: pointer;
	font-size: 13px !important; color: var(--e-global-color-white) !important; -webkit-tap-highlight-color: transparent;
}
.evo-footer .evo-fcol__title .elementor-heading-title::after {
	content: ""; flex: none; width: 14px; height: 14px;
	background: linear-gradient(var(--e-global-color-page), var(--e-global-color-page)) center / 100% 1.5px no-repeat, linear-gradient(var(--e-global-color-page), var(--e-global-color-page)) center / 1.5px 100% no-repeat;
	transition: background-size .25s ease;
}
.evo-footer .evo-fcol.is-open .evo-fcol__title .elementor-heading-title::after { background-size: 100% 1.5px, 1.5px 0; }
.evo-footer .evo-fcol__title .elementor-heading-title:focus-visible { outline: 1.5px solid var(--e-global-color-page); outline-offset: 2px; }
.evo-footer .evo-fcol .evo-fcol__list { display: none; padding-bottom: 14px; }
.evo-footer .evo-fcol.is-open .evo-fcol__list { display: block; }
.evo-footer .evo-footer-links .elementor-icon-list-item { padding: 0 !important; margin: 0 !important; }
.evo-footer .evo-footer-links .elementor-icon-list-item::after { display: none !important; }
.evo-footer .evo-footer-links .elementor-icon-list-item > a { display: flex; align-items: center; min-height: 44px; text-decoration: none !important; }
.evo-footer .evo-footer-links .elementor-icon-list-text {
	padding: 0 !important; font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 400; font-size: 16px; line-height: 1.5; letter-spacing: .005em;
	color: var(--e-global-color-page); text-decoration: none !important; transition: color .2s ease, font-weight .2s ease;
}
.evo-footer .evo-footer-links a:hover .elementor-icon-list-text, .evo-footer .evo-footer-links a:focus-visible .elementor-icon-list-text { color: var(--e-global-color-white); font-weight: 500; }

/* brand block */
.evo-footer .evo-fbrand { align-items: center; text-align: center; padding-top: 28px !important; }
.evo-footer .evo-logo--footer { line-height: 0; }
.evo-footer .evo-logo--footer img { display: block; height: 52px; width: auto; max-width: none; border-radius: 0; }
.evo-footer .evo-logo--reversed img { filter: brightness(0) invert(1); }      /* navy artwork → white. Remove this class once a white logo file is used. */
.evo-footer .evo-fbrand__line, .evo-footer .evo-fbrand__line p { margin: 0; font-size: 16px; line-height: 1.55; color: var(--e-global-color-page); max-width: 30ch; }
.evo-footer .evo-social .elementor-social-icon {
	background: color-mix(in srgb, var(--e-global-color-page) 9%, transparent) !important; border: 0; border-radius: 0 !important; box-shadow: none; transition: background-color var(--evo-t-hover) var(--evo-ease), border-radius var(--evo-t-hover) var(--evo-ease);
}
.evo-footer .evo-social .elementor-social-icon i { color: var(--e-global-color-page); }
.evo-footer .evo-social .elementor-social-icon svg { fill: var(--e-global-color-page); }
.evo-footer .evo-social .elementor-social-icon:hover, .evo-footer .evo-social .elementor-social-icon:focus-visible { background: color-mix(in srgb, var(--e-global-color-page) 20%, transparent) !important; border-radius: 0 var(--evo-radius-sig) 0 0 !important; }      /* the signature corner on hover */

/* trust row — 2×2 on mobile */
.evo-footer .evo-ftrust-band { border-top: 1px solid var(--evo-line-inv); border-bottom: 1px solid var(--evo-line-inv); }
.evo-footer .evo-ftrust-w { width: 100%; }
.evo-ftrust { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 18px 12px; }
.evo-ftrust__item {
	display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; color: var(--e-global-color-page);
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; line-height: 1.3;
}
.evo-ftrust__item .evo-ico { width: 26px; height: 26px; }

/* bottom bar */
.evo-footer .evo-fbottom > .e-con-inner { justify-content: center; text-align: center; }
.evo-footer .evo-fbottom > .e-con-inner > .elementor-element { width: 100%; }
.evo-footer .evo-pay { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.evo-footer .evo-pay li { line-height: 0; }
.evo-footer .evo-pay img { display: block; width: 46px; height: 29px; border-radius: 3px; }      /* the card artwork's own corner, not chrome */
.evo-review-badge--slot { display: inline-block; padding: 8px 12px; border: 1px dashed var(--evo-line-inv); font-family: var(--e-global-typography-body-font-family), sans-serif; font-size: 12px; color: var(--evo-fmeta); }
.evo-footer .evo-review-badge-w:not(:has(.evo-review-badge)) { display: none; }
.evo-footer .evo-legal { justify-content: center; gap: 8px 20px; }
.evo-footer .evo-legal > .elementor-element { width: auto; }
.evo-footer .evo-copyright, .evo-footer .evo-copyright p, .evo-footer .evo-legal-links .elementor-icon-list-text {
	margin: 0; font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-size: 13px; letter-spacing: .01em; color: var(--evo-fmeta);
}
.evo-footer .evo-legal-links .elementor-icon-list-items { justify-content: center !important; }
.evo-footer .evo-legal-links .elementor-icon-list-item::after { display: none !important; }
.evo-footer .evo-legal-links a:hover .elementor-icon-list-text { color: var(--e-global-color-white); }

@media (min-width: 1025px) {
	.evo-footer .evo-fnews { border-bottom: 0; }
	.evo-footer .evo-newsletter .elementor-form-fields-wrapper { gap: 0; flex-wrap: nowrap; }
	.evo-footer .evo-newsletter .elementor-field-type-email { flex: 1 1 auto; width: auto; max-width: none; min-width: 0; }
	.evo-footer .evo-newsletter .elementor-field-type-submit { flex: 0 0 204px; width: 204px; max-width: 204px; }      /* fixed — never reflows on hover; wide enough for the label + arrow */
	.evo-footer .evo-newsletter .elementor-field-textual { border-right: 0 !important; }
	.evo-footer .evo-fcol { border-bottom: 0; }
	.evo-footer .evo-fcol__title .elementor-heading-title { min-height: 0; margin: 0 0 14px; cursor: default; font-size: 12px !important; }
	.evo-footer .evo-fcol__title .elementor-heading-title::after { display: none; }
	.evo-footer .evo-fcol .evo-fcol__list { display: block; padding: 0; }
	.evo-footer .evo-footer-links .elementor-icon-list-item > a { min-height: 34px; }
	.evo-footer .evo-fbrand { align-items: flex-start; text-align: left; padding-top: 0 !important; padding-left: 48px !important; border-left: 1px solid var(--evo-line-inv); }
	.evo-ftrust { grid-template-columns: repeat(4, 1fr); gap: 16px; }
	.evo-ftrust__item { flex-direction: row; justify-content: center; gap: 12px; font-size: 12px; text-align: left; }
	.evo-footer .evo-fbottom > .e-con-inner { justify-content: space-between; text-align: left; }
	.evo-footer .evo-fbottom > .e-con-inner > .elementor-element { width: auto; }
	.evo-footer .evo-fbottom > .e-con-inner > .evo-legal { width: 100%; }
	.evo-footer .evo-pay, .evo-footer .evo-legal { justify-content: flex-start; }
	.evo-footer .evo-legal-links .elementor-icon-list-items { justify-content: flex-start !important; }
}

/* ==========================================================================
   BRAND WAVE  —  [evo_wave fill="navy" bg="white"]   (shortcode in evopure-chrome.php)
   ONE canonical wave — Haseeb's exact path, viewBox 0 0 3000 125 (path never changes; only the fill). 72px desktop / 48px mobile. Use only at real colour changes;
   never stacked, never stretched. --flip = the wavy edge hangs down (a dark section's exit edge).
   ========================================================================== */
/* The path is mirror-symmetric about x=1500. We show a window centred there, cut exactly at crest lines, so the pattern is
   symmetric left-to-right with a clean half-crest at each edge and nothing clipped mid-curve.
   desktop: 600→2400 (3 full peaks + 2 halves) = 166.667% wide, shifted left by 600/3000 of its own width (= 33.333% of the band)
   phones : 900→2100 (2 crests, centre peak)   = 250% wide, shifted left by 900/3000 of its own width (= 75% of the band)      */
body { --evo-wave-w: 166.667%; --evo-wave-x: -33.333%; }
@media (max-width: 767px) { body { --evo-wave-h: 48px; --evo-wave-w: 250%; --evo-wave-x: -75%; } }
.evo-wave-clip { display: block; overflow: hidden; line-height: 0; }      /* its background (set by the shortcode) is bg colour on the wavy side and FILL colour behind the solid side, so a sub-pixel gap at either edge can never show a line */
.evo-wave-clip--flip { transform: scaleY(-1); }
.evo-wave { display: block; width: var(--evo-wave-w); max-width: none; height: calc(var(--evo-wave-h) + 1px); margin-bottom: -1px; margin: 0 0 0 var(--evo-wave-x); pointer-events: none; shape-rendering: geometricPrecision; }      /* pure vector — no filters */
/* dropped between two sections: zero-height seams (the 1px overlap hides sub-pixel gaps between bands) */
.evo-wave-band { padding: 0 !important; margin-block: -1px !important; line-height: 0; position: relative; z-index: 1; }
/* the band overlaps both neighbours by 1px and must paint ABOVE them: otherwise the following section covers the last pixel of an inverted
   wave and slices its crest tips flat (the "cutoff line", most visible on phones where the crests are widest) */
.e-con.evo-wave-band, .evo-hero ~ .e-con.evo-wave-band { z-index: 3; }
/* the navy wave above the footer (printed by evopure-chrome.php on every page; chrome.js sets --evo-footwave-bg to the tone of the last section) */
.evo-footwave { display: block; background: var(--evo-footwave-bg, transparent); margin-block: 0 -1px !important; }
.evo-no-footwave .evo-footwave { display: none; }
.evo-wave-band .elementor-widget, .evo-wave-band .elementor-shortcode { margin: 0 !important; line-height: 0; }

/* ==========================================================================
   THE PRIMARY BUTTON  —  add the CSS class  evo-cta  to any Elementor Button (hero, quiz pill, quiz band, footer newsletter…)
   The rule is CONTEXT-AWARE:
     · A SOLO button (header quiz pill, quiz band, newsletter) and a CARD button (Choose options):
         hover = top-right corner rounds + arrow slides in + the fill INVERTS to a 1px outline.
     · A PAIR — two evo-cta buttons placed side by side in the same container (hero: Shop all + Take the quiz; the side-cart pair):
         hover = corner + arrow ONLY. The fill never changes, so the two can never converge. Detected automatically (sibling widgets);
         nothing to set in Elementor.
   The label never moves (the arrow's space is reserved inside the right padding).
   evo-cta--ghost = the outline secondary.   evo-cta--onnavy = off-white fill for a navy surface.   .evo-btn = the same for a plain <button>/<a>.
   ========================================================================== */
.evo-cta .elementor-button, .evo-btn {
	position: relative; display: inline-flex; align-items: center; justify-content: center; min-height: var(--evo-cta-h, 48px); padding: 0 46px !important;      /* symmetric: the label stays optically centred; the arrow lives inside the right padding */
	background: var(--evo-navy) !important; color: var(--evo-white) !important; border: 1px solid var(--evo-navy) !important; border-radius: 0 !important; box-shadow: none !important;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w) !important; font-size: 12px !important; letter-spacing: .16em !important; text-transform: uppercase !important; line-height: 1 !important;
	transition: border-radius var(--evo-t-hover) var(--evo-ease), background-color var(--evo-t-hover) var(--evo-ease), border-color var(--evo-t-hover) var(--evo-ease), color var(--evo-t-hover) var(--evo-ease);
}
.evo-cta .elementor-button::after, .evo-btn::after {
	content: ""; position: absolute; right: 16px; top: 50%; width: 18px; height: 18px; margin-top: -9px; background: currentColor;
	-webkit-mask: var(--evo-ico-arrow) center / 18px 18px no-repeat; mask: var(--evo-ico-arrow) center / 18px 18px no-repeat;
	opacity: 0; transform: translateX(-8px); transition: opacity var(--evo-t-hover) var(--evo-ease), transform var(--evo-t-hover) var(--evo-ease);
}
/* SOLO + CARD buttons: corner + arrow + invert */
.evo-cta .elementor-button:hover, .evo-cta .elementor-button:focus-visible, .evo-cta .elementor-button:active, .evo-btn:hover, .evo-btn:focus-visible, .evo-btn:active {
	border-radius: 0 var(--evo-radius-sig) 0 0 !important; background: transparent !important; border-color: var(--evo-navy) !important; color: var(--evo-navy) !important;
}
.evo-cta .elementor-button:hover::after, .evo-cta .elementor-button:focus-visible::after, .evo-cta .elementor-button:active::after, .evo-btn:hover::after, .evo-btn:focus-visible::after, .evo-btn:active::after { opacity: 1; transform: none; }
/* secondary (ghost): outline at rest, fills on hover */
.evo-cta--ghost .elementor-button { background: transparent !important; color: var(--evo-navy) !important; }
.evo-cta--ghost .elementor-button:hover, .evo-cta--ghost .elementor-button:focus-visible, .evo-cta--ghost .elementor-button:active { background: var(--evo-navy) !important; color: var(--evo-white) !important; }
/* on a navy surface: off-white at rest, inverts to an off-white outline */
.evo-cta--onnavy .elementor-button { background: var(--evo-page) !important; color: var(--evo-navy) !important; border-color: var(--evo-page) !important; }
.evo-cta--onnavy .elementor-button:hover, .evo-cta--onnavy .elementor-button:focus-visible, .evo-cta--onnavy .elementor-button:active { background: transparent !important; color: var(--evo-page) !important; border-color: var(--evo-page) !important; }
.evo-btn--onnavy { background: var(--evo-page) !important; color: var(--evo-navy) !important; border-color: var(--evo-page) !important; }
.evo-btn--onnavy:hover, .evo-btn--onnavy:focus-visible, .evo-btn--onnavy:active { background: transparent !important; color: var(--evo-page) !important; border-color: var(--evo-page) !important; }
/* A PAIR (sibling evo-cta widgets): the fill is pinned to its rest state — corner + arrow only */
.evo-cta:has(+ .evo-cta) .elementor-button:is(:hover, :focus-visible, :active), .evo-cta + .evo-cta .elementor-button:is(:hover, :focus-visible, :active) { background: var(--evo-navy) !important; color: var(--evo-white) !important; border-color: var(--evo-navy) !important; }
.evo-cta--ghost:has(+ .evo-cta) .elementor-button:is(:hover, :focus-visible, :active), .evo-cta + .evo-cta--ghost .elementor-button:is(:hover, :focus-visible, :active) { background: transparent !important; color: var(--evo-navy) !important; }
.evo-cta--onnavy:has(+ .evo-cta) .elementor-button:is(:hover, :focus-visible, :active), .evo-cta + .evo-cta--onnavy .elementor-button:is(:hover, :focus-visible, :active) { background: var(--evo-page) !important; color: var(--evo-navy) !important; border-color: var(--evo-page) !important; }
/* TEXT LINK  —  CSS class  evo-link  on an Elementor Button: a caps text link with a hairline underline; the arrow nudges on hover. */
.evo-link .elementor-button {
	position: relative; display: inline-flex; align-items: center; gap: 10px; padding: 0 0 5px !important; min-height: 0; background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
	color: var(--evo-navy) !important; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w) !important; font-size: 12px !important; letter-spacing: .16em !important; text-transform: uppercase !important; line-height: 1.2 !important;
}
.evo-link .elementor-button::after { content: ""; position: absolute; left: 100%; top: 50%; margin: -10px 0 0 10px; width: 16px; height: 16px;      /* hangs outside the label, so the label itself is what gets centred */
	 background: currentColor; -webkit-mask: var(--evo-ico-arrow) center / 16px 16px no-repeat; mask: var(--evo-ico-arrow) center / 16px 16px no-repeat; transition: transform var(--evo-t-hover) var(--evo-ease); }
.evo-link .elementor-button:hover::after, .evo-link .elementor-button:focus-visible::after { transform: translateX(5px); }
:root { --evo-ico-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 12h15'/%3E%3Cpath d='M13.5 6.5L19.5 12l-6 6'/%3E%3C/svg%3E"); }   /* THE arrow (buttons + cards). Replace this one data-URI (and evo_chrome_icon('arrow') in evopure-chrome.php) with Haseeb's SVG when it lands. */
@media (prefers-reduced-motion: reduce) { .evo-cta .elementor-button, .evo-cta .elementor-button::after { transition: none !important; } }

/* ==========================================================================
   PRODUCT CARD + CAROUSEL  —  [evo_bestsellers]  (evopure-bestsellers.php — "WHERE TO EDIT" lives at the top of that file)
   The card is a COOL GREY (Global Colour "Cool Wash" #E7EAEB) self-contained surface with NO outline or shadow: it separates from the warm
   neutral page by tone, and product shots on the same grey (or transparent PNGs) melt into it as one surface. Everything inside is centred
   on the button's axis.
   Signature top-right corner at rest · uniform heights · no shadow · CARD HOVER (which also drives the button + the second image).
   The rail bleeds to both screen edges: the first card lines up with the page content, and ~4 cards + a slice of the next
   show at rest so it is obvious there is more. Tunables: --evo-best-per (cards in view, the fraction = the peek), --evo-best-gap.
   ========================================================================== */
.evo-best {
	--evo-best-gap: 20px; --evo-best-per: 4.4;
	--evo-best-bleed: max(var(--evo-gutter), calc((100vw - var(--evo-chrome-max)) / 2));      /* page edge → content edge */
	position: relative; width: 100%;
}
.evo-best__rail {
	display: flex; gap: var(--evo-best-gap); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; outline: 0;
	width: calc(100% + 2 * var(--evo-best-bleed)); margin: -12px calc(-1 * var(--evo-best-bleed)) 0; padding: 12px var(--evo-best-bleed) 14px; scroll-padding-inline: var(--evo-best-bleed);      /* the padding is the room the hover-scale needs — nothing is clipped, not even the first card */
}
.evo-best__rail::-webkit-scrollbar { display: none; }
.evo-bestsellers { overflow-x: clip; }
.evo-pcard {
	flex: 0 0 calc((100% - 4 * var(--evo-best-gap)) / var(--evo-best-per)); min-width: 0; scroll-snap-align: start; display: flex; flex-direction: column;      /* % = the page content width: 4 cards + the peek fit it exactly, and the rail runs on to the screen edge */
	background: var(--evo-wash); border: 0; border-radius: 0 var(--evo-radius-card) 0 0; overflow: hidden; -webkit-tap-highlight-color: transparent;      /* card-scale corner so it reads on a big surface */
	transition: transform var(--evo-t-hover) var(--evo-ease);
}
.evo-pcard__media { position: relative; display: block; aspect-ratio: 1 / 1; overflow: hidden; background: var(--evo-wash); line-height: 0; }      /* the product shot and the card are one surface */
.evo-pcard .evo-pcard__img { display: block; width: 100%; height: 100% !important; max-width: none; object-fit: cover; border-radius: 0; }
.evo-pcard .evo-pcard__img--hover { position: absolute; inset: 0; opacity: 0; transition: opacity var(--evo-t-section) var(--evo-ease); }      /* the product's second image (first gallery image) */
.evo-pcard__tag {
	position: absolute; left: 12px; top: 12px; z-index: 1; padding: 7px 10px 6px; background: var(--evo-navy); color: var(--evo-white); line-height: 1;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 10px; letter-spacing: .14em; text-transform: uppercase;
}
.evo-pcard__body { display: flex; flex-direction: column; align-items: center; flex: 1 1 auto; padding: 14px 16px 18px; text-align: center; }
.evo-pcard__rating { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 16px; margin-bottom: 10px; color: var(--evo-navy); }
.evo-pcard__stars { position: relative; display: inline-block; line-height: 0; white-space: nowrap; }
.evo-pcard__stars-base, .evo-pcard__stars-fill { display: inline-flex; gap: 2px; }
.evo-pcard__stars-base { color: color-mix(in srgb, var(--evo-navy) 20%, transparent); }
.evo-pcard__stars-fill { position: absolute; left: 0; top: 0; overflow: hidden; color: var(--evo-navy); }
.evo-pcard__stars svg { flex: none; display: block; width: 14px; height: 14px; }
.evo-pcard__count { font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 500; font-size: 13px; color: var(--evo-charcoal); }
.evo-pcard__count span { font-weight: 400; color: var(--evo-slate); }
.evo-pcard__rating--slot { font-size: 12px; color: var(--evo-slate); letter-spacing: .08em; opacity: .7; } .evo-pcard__rating--slot span { letter-spacing: 0; font-family: var(--e-global-typography-body-font-family), sans-serif; }
/* hierarchy, top → bottom, all CENTRED on the button's axis:  name (New Spirit) › descriptor (caps) › option pills › price + offer › button */
.evo-pcard .evo-pcard__title { margin: 0; font-size: inherit; line-height: 1; }
.evo-pcard__title a { display: block; color: inherit !important; text-decoration: none !important; }
.evo-pcard__name { display: block; font-family: var(--e-global-typography-h3-font-family), serif; font-weight: 700; font-style: italic; font-size: clamp(19px, 1.5vw, 22px); letter-spacing: -.005em; line-height: 1.12; text-transform: none; color: var(--evo-navy); }
.evo-pcard__desc { display: block; margin-top: 7px; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-style: normal; font-size: 10.5px; letter-spacing: .14em; line-height: 1.45; text-transform: uppercase; color: var(--evo-charcoal); }
/* option pills — information only: no pointer, no hover, not focusable */
.evo-pcard__pills { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 14px 0 0; padding: 0; }
.evo-pcard__pills li {
	margin: 0; padding: 6px 9px 5px; background: var(--evo-white); color: var(--evo-navy); line-height: 1; white-space: nowrap; cursor: default;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 10px; letter-spacing: .1em; text-transform: uppercase;
}
/* price leads; under it the ONE coral offer element carries the offer AND the subscribe from-price, in white */
.evo-pcard__prices { margin-top: auto; display: flex; flex-direction: column; align-items: center; gap: 9px; padding-top: 18px; width: 100%; }
.evo-pcard__price { display: flex; align-items: baseline; justify-content: center; gap: 6px; margin: 0; font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 400; font-size: 14px; line-height: 1.1; color: var(--evo-charcoal); white-space: nowrap; }
.evo-pcard__price strong { font-weight: 600; font-size: 20px; letter-spacing: -.01em; color: var(--evo-navy); }
.evo-pcard__offer {
	display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 3px 7px; box-sizing: border-box; width: 100%; margin: 0; padding: 9px 10px 8px; background: var(--evo-offer); color: var(--evo-white); line-height: 1.15;      /* full width = the button beneath it */
	border-radius: 0; transition: border-radius var(--evo-t-hover) var(--evo-ease);
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: 700; font-size: 10px; letter-spacing: .09em; text-transform: uppercase;
}
.evo-pcard__offer span, .evo-pcard__offer b { white-space: nowrap; font-weight: 700; }
.evo-pcard__offer b::before { content: "·"; margin-right: 7px; opacity: .7; }
.evo-btn { cursor: pointer; text-decoration: none !important; -webkit-appearance: none; appearance: none; }
.evo-pcard .evo-pcard__cta { width: 100%; margin-top: 6px; }
/* carousel arrows — the shared arrow-in-circle */
.evo-best__nav { position: absolute; right: 0; top: -64px; display: flex; gap: 8px; }
.evo-best .evo-best__btn {
	display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border-radius: 50% !important; cursor: pointer;
	background: transparent !important; border: 1.5px solid var(--evo-navy) !important; color: var(--evo-navy) !important; box-shadow: none !important;
	transition: background-color var(--evo-t-hover) var(--evo-ease), color var(--evo-t-hover) var(--evo-ease), opacity var(--evo-t-hover) var(--evo-ease);
}
.evo-best__btn--prev .evo-ico { transform: scaleX(-1); }
.evo-best .evo-best__btn:hover:not(:disabled), .evo-best .evo-best__btn:focus-visible { background: var(--evo-navy) !important; color: var(--evo-white) !important; outline: 0; }
.evo-best .evo-best__btn:disabled { opacity: .28; cursor: default; }
@media (min-width: 768px) and (max-width: 1024px) { .evo-best { --evo-best-bleed: 24px; } }      /* = the section's tablet side padding */
@media (max-width: 1024px) { .evo-best { --evo-best-per: 2.4; } .evo-pcard { flex-basis: calc((100% - 2 * var(--evo-best-gap)) / var(--evo-best-per)); } }
@media (max-width: 767px) {
	.evo-best { --evo-best-gap: 12px; }
	.evo-pcard { flex-basis: 78%; }      /* one-and-a-bit cards */
	.evo-best__nav { display: none; }
}

/* ==========================================================================
   MENU CARD  —  the image card used in the desktop mega menu AND the mobile menu grid
   A full-bleed square image with the signature top-right corner; title top-left in New Spirit (navy — images are lit to carry it),
   arrow-in-circle bottom-right. No label bar, no pillar colour. Hover/tap = CARD HOVER below.
   ========================================================================== */
.evo-mcard { position: relative; display: block; overflow: hidden; border-radius: 0 var(--evo-radius-sig) 0 0; text-decoration: none !important; background: var(--e-global-color-wash); }
.evo-mcard__media { display: block; aspect-ratio: 1 / 1; overflow: hidden; background: var(--e-global-color-wash); }
.evo-mcard .evo-mcard__img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 50% 50%; border-radius: 0; }
.evo-mcard__foot { position: absolute; inset: 0; display: block; padding: 0; background: transparent; }
.evo-mcard__label {
	position: absolute; left: 16px; top: 14px; right: 16px; margin: 0;
	font-family: var(--e-global-typography-h3-font-family), serif; font-weight: 700; font-style: italic; font-size: clamp(19px, 1.5vw, 23px); letter-spacing: -.005em; text-transform: none; line-height: 1.1;
	color: var(--evo-navy);
}
.evo-mcard .evo-mcard__go { position: absolute; right: 12px; bottom: 12px; }
/* a range with no image yet: a deliberate quiet tile */
.evo-mcard--empty .evo-mcard__media { background: var(--e-global-color-sand, #ECE5D8); }
.evo-mcard__media { position: relative; }
.evo-mcard__soon { position: absolute; left: 16px; bottom: 18px; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--evo-slate); }

/* ==========================================================================
   CARD HOVER  —  the ONE card interaction for page cards (goal cards, product cards, ingredient cards)
   Shadowless: the card eases out by --evo-card-scale and its arrow-in-circle fills navy. 250ms, one ease. Nothing else moves.
   Touch: :active gives the same state. Change it here and every card changes.
   MEGA-MENU cards (image cards, article cards) never scale or fill: nothing at rest; on hover / focus the hovered card gets a clean 1px
   outline (navy · off-white on the Evolabs panel) so it reads as selected. The outline follows the card's own signature corner.
   ========================================================================== */
.evo-goal { transition: transform var(--evo-t-hover) var(--evo-ease); transform-origin: 50% 50%; box-shadow: none !important; -webkit-tap-highlight-color: transparent; }
.evo-mcard, .evo-acard, .evo-mintro { box-shadow: none !important; -webkit-tap-highlight-color: transparent; }
/* the hover outline sits on whichever element carries the rounded corner, so it can never be clipped at the curve:
   the card itself (standard cards) · the image tile (Evolabs stacked cards, article cards) */
.evo-mcard::after, .evo-mview--world .evo-mcard__media::after, .evo-acard__media::after { content: ""; position: absolute; inset: 0; z-index: 2; border: 1px solid var(--evo-navy); border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity var(--evo-t-hover) var(--evo-ease); }
.evo-acard__media { position: relative; }
.evo-mview--world .evo-mcard::after { display: none; }
.evo-mview--world .evo-mcard__media::after { border-color: var(--evo-page); }
@media (hover: hover) { .evo-mcard:hover::after, .evo-mview--world .evo-mcard:hover .evo-mcard__media::after, .evo-acard:hover .evo-acard__media::after { opacity: 1; } }
.evo-mcard:focus-visible::after, .evo-mview--world .evo-mcard:focus-visible .evo-mcard__media::after, .evo-acard:focus-visible .evo-acard__media::after { opacity: 1; }
.evo-pcard { transform-origin: 50% 50%; box-shadow: none !important; }
/* product card: hovering ANYWHERE on the card puts its button into the button's own hover state and swaps in the second image */
@media (hover: hover) {
	.evo-pcard:hover .evo-pcard__cta { border-radius: 0 var(--evo-radius-sig) 0 0 !important; background: transparent !important; border-color: var(--evo-navy) !important; color: var(--evo-navy) !important; }
	.evo-pcard:hover .evo-pcard__offer { border-radius: 0 var(--evo-radius-sig) 0 0; }      /* pill + button round together: one unit */
	.evo-pcard:hover .evo-pcard__cta::after { opacity: 1; transform: none; }
	.evo-pcard.has-hover-img:hover .evo-pcard__img--hover { opacity: 1; }
}
.evo-pcard.has-hover-img:focus-within .evo-pcard__img--hover { opacity: 1; }
@media (hover: hover) {
	.evo-goal:hover, .evo-pcard:hover { transform: scale(var(--evo-card-scale)); z-index: 1; }
	.evo-goal:hover .elementor-image-box-content::before { background: var(--evo-navy); border-color: var(--evo-navy); color: var(--evo-white); }
	.evo-goal:hover .elementor-image-box-content::after { background: var(--evo-white); }
}
.evo-goal:focus-within, .evo-goal:active { transform: scale(var(--evo-card-scale)); z-index: 1; outline: 0; }
.evo-mcard:focus-visible, .evo-acard:focus-visible { outline: 0; } .evo-mintro:focus-visible { outline: 1.5px solid var(--evo-navy); outline-offset: 3px; }
.evo-pcard:focus-within { transform: scale(var(--evo-card-scale)); z-index: 1; }
.evo-pcard:focus-within .evo-pcard__offer { border-radius: 0 var(--evo-radius-sig) 0 0; }
.evo-goal:focus-within .elementor-image-box-content::before, .evo-goal:active .elementor-image-box-content::before { background: var(--evo-navy); border-color: var(--evo-navy); color: var(--evo-white); }
.evo-goal:focus-within .elementor-image-box-content::after, .evo-goal:active .elementor-image-box-content::after { background: var(--evo-white); }
/* the arrow-in-circle, shared */
.evo-mcard__go {
	flex: none; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%;
	border: 1.5px solid var(--evo-navy); color: var(--evo-navy); transition: background-color var(--evo-t-hover) var(--evo-ease), color var(--evo-t-hover) var(--evo-ease), border-color var(--evo-t-hover) var(--evo-ease);
}
.evo-mcard__go .evo-ico { width: 18px; height: 18px; stroke-width: 2.25; }
/* …the same circle + 16px arrow for Image Box cards, which have no spare element (drawn on the label row) */
.evo-goal .elementor-image-box-content::before {
	content: ""; position: absolute; right: 12px; bottom: 12px; width: 34px; height: 34px; box-sizing: border-box; border-radius: 50%; border: 1.5px solid var(--evo-navy);
	transition: background-color var(--evo-t-hover) var(--evo-ease), border-color var(--evo-t-hover) var(--evo-ease);
}
.evo-goal .elementor-image-box-content::after {
	content: ""; position: absolute; right: 20px; bottom: 20px; width: 18px; height: 18px; background: var(--evo-navy);
	-webkit-mask: var(--evo-ico-arrow) center / 18px 18px no-repeat; mask: var(--evo-ico-arrow) center / 18px 18px no-repeat;
	transition: background-color var(--evo-t-hover) var(--evo-ease);
}
@media (prefers-reduced-motion: reduce) { .evo-mcard, .evo-acard, .evo-mintro, .evo-goal, .evo-pcard, .evo-pcard .evo-pcard__img--hover { transition: none !important; } }

/* ==========================================================================
   FORMS  (CSS class evo-form on an Elementor Pro Form): site-wide since 2026-09-22 (was home.css). Used by the lab-report request on the homepage
   and the suggestions form on the What's next page.
   ========================================================================== */
.evo-form .elementor-form-fields-wrapper { row-gap: 0; }
.evo-form .elementor-field-group { margin-bottom: 16px !important; }
.evo-form .elementor-field-group > label, .evo-form .elementor-field-label { margin: 0 0 8px !important; padding: 0 !important; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w) !important; font-size: 10.5px !important; letter-spacing: .16em !important; text-transform: uppercase !important; line-height: 1.3 !important; color: var(--evo-navy) !important; }
.evo-form .elementor-mark-required .elementor-field-label::after { color: var(--evo-slate) !important; }
.evo-form .elementor-field-textual, .evo-form select { min-height: 50px; padding: 0 16px !important; background-color: var(--evo-wash) !important; border: 1px solid transparent !important; border-radius: 0 !important; box-shadow: none !important; color: var(--evo-charcoal) !important; font-family: var(--e-global-typography-body-font-family), sans-serif !important; font-weight: 300 !important; font-size: 16px !important; transition: border-color var(--evo-t-hover) var(--evo-ease), background-color var(--evo-t-hover) var(--evo-ease); }
.evo-form .elementor-field-textual:focus, .evo-form select:focus { border-color: var(--evo-navy) !important; background-color: var(--evo-white) !important; outline: 0; }
.evo-form .elementor-select-wrapper { position: relative; }
.evo-form .elementor-select-wrapper select { appearance: none; -webkit-appearance: none; padding-right: 44px !important; cursor: pointer; }
.evo-form .elementor-select-wrapper .select-caret-down-wrapper, .evo-form .elementor-select-wrapper::before { display: none !important; }
.evo-form .elementor-select-wrapper::after { content: ""; position: absolute; right: 18px; top: 50%; width: 8px; height: 8px; margin-top: -7px; border-right: 1.5px solid var(--evo-navy); border-bottom: 1.5px solid var(--evo-navy); transform: rotate(45deg); pointer-events: none; }
.evo-form .e-form__buttons { margin-top: 6px; }
.evo-form .elementor-button { position: relative; width: 100%; min-height: 50px; padding: 0 46px !important; background: var(--evo-navy) !important; color: var(--evo-white) !important; border: 1px solid var(--evo-navy) !important; border-radius: 0 !important; box-shadow: none !important;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w) !important; font-size: 12px !important; letter-spacing: .16em !important; text-transform: uppercase !important; line-height: 1 !important;
	transition: border-radius var(--evo-t-hover) var(--evo-ease), background-color var(--evo-t-hover) var(--evo-ease), color var(--evo-t-hover) var(--evo-ease); }
.evo-form .elementor-button::after { content: ""; position: absolute; right: 18px; top: 50%; width: 18px; height: 18px; margin-top: -9px; background: currentColor; -webkit-mask: var(--evo-ico-arrow) center / 18px 18px no-repeat; mask: var(--evo-ico-arrow) center / 18px 18px no-repeat; opacity: 0; transform: translateX(-6px); transition: opacity var(--evo-t-hover) var(--evo-ease), transform var(--evo-t-hover) var(--evo-ease); }
.evo-form .elementor-button:hover, .evo-form .elementor-button:focus-visible { border-radius: 0 var(--evo-radius-sig) 0 0 !important; background: transparent !important; color: var(--evo-navy) !important; }
.evo-form .elementor-button:hover::after, .evo-form .elementor-button:focus-visible::after { opacity: 1; transform: none; }
.evo-form .elementor-message { position: relative; margin: 14px 0 0 !important; padding: 14px 16px 14px 44px; background: var(--evo-wash); font-family: var(--e-global-typography-body-font-family), sans-serif !important; font-size: 15px !important; line-height: 1.45; color: var(--evo-navy) !important; }
.evo-form .elementor-message::before { content: "" !important; position: absolute; left: 16px; top: 15px; width: 18px; height: 18px; border-radius: 50%; background: var(--evo-navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 8.3l2.3 2.3 4.7-4.9'/%3E%3C/svg%3E") center / 12px 12px no-repeat; }
.evo-form .elementor-message.elementor-message-danger::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M8 4.2v4.6M8 11.4v.2'/%3E%3C/svg%3E"); }

/* ==========================================================================
   COOKIE BANNER  (Cookie Notice plugin, CSS class evo-cookie; words + buttons in WP admin → Settings → Cookie Notice)
   A small card pinned bottom-left: navy, the signature corner, one line of copy, "Accept all" (off-white fill) and "Essential only" (outline),
   the Privacy policy as a text link. Nothing else on the page is covered. The plugin's inline colours are overridden here.
   ========================================================================== */
#cookie-notice { left: 24px !important; right: auto !important; bottom: 24px !important; width: min(440px, calc(100vw - 48px)) !important; min-width: 0 !important; padding: 0 !important; background: var(--evo-navy) !important; color: var(--evo-page) !important; border-radius: 0 var(--evo-radius-card) 0 0; box-shadow: none; font-family: var(--e-global-typography-body-font-family), sans-serif; }
#cookie-notice .cookie-notice-container { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding: 24px 26px 24px; text-align: left; }
#cookie-notice .cn-text-container { margin: 0; font-size: 14.5px; line-height: 1.55; color: var(--evo-page) !important; }
#cookie-notice .cn-buttons-container { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin: 0; }
#cookie-notice .cn-button { position: relative; display: inline-flex; align-items: center; justify-content: center; min-height: 42px; margin: 0; padding: 0 20px !important; border: 1px solid var(--evo-page) !important; border-radius: 0 !important; background: var(--evo-page) !important; color: var(--evo-navy) !important; box-shadow: none !important; text-decoration: none !important; cursor: pointer;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w) !important; font-size: 11.5px !important; letter-spacing: .16em !important; text-transform: uppercase !important; line-height: 1 !important;
	transition: border-radius var(--evo-t-hover) var(--evo-ease), background-color var(--evo-t-hover) var(--evo-ease), color var(--evo-t-hover) var(--evo-ease); }
#cookie-notice .cn-button:hover, #cookie-notice .cn-button:focus-visible { border-radius: 0 var(--evo-radius-sig) 0 0 !important; background: transparent !important; color: var(--evo-page) !important; outline: 0; }
#cookie-notice #cn-refuse-cookie { background: transparent !important; color: var(--evo-page) !important; }
#cookie-notice #cn-refuse-cookie:hover, #cookie-notice #cn-refuse-cookie:focus-visible { background: var(--evo-page) !important; color: var(--evo-navy) !important; }
#cookie-notice .cn-more-info { min-height: 0; padding: 0 0 3px !important; border: 0 !important; background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat !important; color: var(--evo-page) !important; opacity: .82; }
#cookie-notice .cn-more-info:hover, #cookie-notice .cn-more-info:focus-visible { border-radius: 0 !important; opacity: 1; }
#cookie-notice .cn-close-icon { display: none; }
@media (max-width: 767px) { #cookie-notice { left: 12px !important; bottom: 12px !important; width: calc(100vw - 24px) !important; border-radius: 0 var(--evo-radius-sig) 0 0; } #cookie-notice .cookie-notice-container { padding: 18px 18px 18px; gap: 14px; } #cookie-notice .cn-button { min-height: 40px; padding: 0 16px !important; } }

/* ==========================================================================
   MODAL  (CSS class evo-modal + a CSS ID on an Elementor container; any link to #that-id opens it). Site-wide since 2026-09-22 (was home.css):
   the lab-report request form lives on the homepage AND the Lab Reports page. chrome.js modal() runs it.
   Closed = hidden. chrome.js moves it to <body> when opened so it sits above the header; in the editor it is laid out in place so the form can be edited.
   ========================================================================== */
.evo-modal { display: none !important; }
.evo-modal.is-open { display: flex !important; position: fixed !important; inset: 0; z-index: 2000; margin: 0 !important; padding: 24px !important; max-width: none !important; width: auto !important; align-items: center; justify-content: center; background: color-mix(in srgb, var(--evo-navy-deep) 55%, transparent); overflow-y: auto; }
.evo-modal__panel { position: relative; width: min(560px, 100%) !important; max-height: calc(100dvh - 48px); overflow-y: auto; background: var(--evo-white); border-radius: 0 var(--evo-radius-card) 0 0; box-shadow: none; }
/* on-brand build: a NAVY head (caps eyebrow · New Spirit title · one line on where the request goes) over a white body (the form + a quiet note) */
.evo-modal__head { background-color: var(--evo-navy); color: var(--evo-page); align-items: flex-start; text-align: left; }
.evo-modal__eyebrow .elementor-heading-title { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: 10.5px !important; letter-spacing: .16em !important; line-height: 1 !important; }
.evo-modal__eyebrow .elementor-heading-title::before { content: ""; flex: none; width: 15px; height: 15px; border-radius: 50%; background: var(--evo-page) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%231D293B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 8.3l2.3 2.3 4.7-4.9'/%3E%3C/svg%3E") center / 11px 11px no-repeat; }
.evo-modal__title .elementor-heading-title { margin: 0; font-size: clamp(26px, 2.4vw, 34px) !important; line-height: 1.1 !important; }
.evo-modal__intro, .evo-modal__intro p { margin: 0; max-width: 34em; font-size: 15.5px !important; line-height: 1.5 !important; }
.evo-modal__note, .evo-modal__note p { margin: 0; font-family: var(--e-global-typography-body-font-family), sans-serif; font-size: 13px !important; line-height: 1.5 !important; color: var(--evo-slate); }
.evo-modal__close { position: absolute; right: 20px; top: 20px; z-index: 2; width: 40px; height: 40px; border-radius: 50% !important; padding: 0; display: inline-flex; align-items: center; justify-content: center; background: transparent !important; border: 0 !important; box-shadow: none !important; color: var(--evo-navy) !important; cursor: pointer; }
.evo-modal__panel:has(> .evo-modal__head) .evo-modal__close, .evo-modal__panel:has(.evo-modal__head) > .evo-modal__close { color: var(--evo-page) !important; }
.evo-modal__close { box-shadow: inset 0 0 0 1.5px currentColor !important; transition: background-color var(--evo-t-hover) var(--evo-ease), color var(--evo-t-hover) var(--evo-ease); }      /* the ring: it no longer sits in the panel's rounded corner, where the curve clipped it */
.evo-modal__close svg { width: 18px; height: 18px; }
.evo-modal__close:is(:hover, :focus-visible) { background: var(--evo-page) !important; color: var(--evo-navy) !important; outline: 0; }
.evo-modal__panel:not(:has(.evo-modal__head)) .evo-modal__close:is(:hover, :focus-visible) { background: var(--evo-navy) !important; color: var(--evo-white) !important; }
.evo-modal .elementor-widget { margin: 0 !important; }
/* the panel is always one column (head over body): on phones Elementor's row default put the navy head in a thin strip beside the form */
.evo-modal__panel { display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; padding: 0 !important; --padding-top: 0px !important; --padding-right: 0px !important; --padding-bottom: 0px !important; --padding-left: 0px !important; gap: 0 !important; }
.evo-modal__panel > .e-con, .evo-modal__panel > .e-con-inner > .e-con, .evo-modal__head, .evo-modal__body { width: 100% !important; max-width: none !important; flex: none !important; }
@media (max-width: 767px) { .evo-modal.is-open { padding: 12px !important; } .evo-modal__close { right: 14px; top: 14px; } }
.elementor-editor-active .evo-modal { display: flex !important; position: relative !important; background: var(--evo-page); padding: 24px !important; }
html.evo-modal-open, html.evo-modal-open body { overflow: hidden; }
@media (prefers-reduced-motion: no-preference) { .evo-modal.is-open .evo-modal__panel { animation: evo-fade-up var(--evo-t-section) var(--evo-ease) both; } .evo-modal.is-open { animation: evo-fade-in var(--evo-t-hover) var(--evo-ease) both; } }
/* FORM (.evo-form): the rules moved to chrome.css on 2026-09-22 so forms on other pages (What's next suggestions) share them. */
@media (max-width: 767px) { .evo-modal.is-open { padding: 12px !important; align-items: flex-end; } .evo-modal__panel { max-height: calc(100dvh - 24px); } }

/* ==========================================================================
   HOMEPAGE COMPONENTS, shared (moved unchanged from home.css on 2026-09-23 so other pages can use them):
   goal cards (.evo-goal / .evo-goals), quiz band (.evo-quizband), trust band (.evo-usp). Edit them here.
   ========================================================================== */
/* ---------------------------------------------------------------- GOAL SELECTOR */
.evo-goals .elementor-widget { margin: 0 !important; }
.evo-goals__headwrap { align-items: center; text-align: center; }      /* full-width blocks centre-align */
.evo-goals__head .elementor-heading-title { margin: 0; font-size: clamp(30px, 2.9vw, 44px) !important; line-height: 1.12 !important; text-wrap: balance; text-align: center; }
.evo-goals__sub, .evo-goals__sub p { margin: 0 auto; max-width: 34em; text-align: center; text-wrap: pretty; }
/* section intros use the Global Font "Lead" (DM Sans 400 18px, .01em) — the hook for the accent font: change it once in Site Settings → Global Fonts */
.evo-goals__grid { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; width: 100%; }
.evo-goals__grid > .elementor-widget { width: auto !important; max-width: none; min-width: 0; }

/* the card (one Image Box widget): a full-bleed 4:3 image with the signature corner. Title overlaid top-left in New Spirit (typed in the
   widget's Title field), arrow-in-circle bottom-right. No label bar, no pillar colour — the image carries the colour.
   Hover = the site-wide CARD HOVER (chrome.css) — identical to the mega-menu cards. */
.evo-goal { position: relative; border-radius: 0 var(--evo-radius-sig) 0 0; overflow: hidden; background: var(--evo-wash); }
.evo-goal .elementor-image-box-wrapper { display: block; height: 100%; text-align: left; }
.evo-goal .elementor-image-box-img { display: block; width: 100% !important; margin: 0 !important; aspect-ratio: 4 / 3; overflow: hidden; background: var(--evo-wash); }
.evo-goal .elementor-image-box-img a { display: block; width: 100%; height: 100%; }
.evo-goal .elementor-image-box-img img { display: block; width: 100% !important; height: 100% !important; max-width: none; object-fit: cover; object-position: 50% 50%; border-radius: 0 !important; }
.evo-goal .elementor-image-box-content { position: absolute; inset: 0; padding: 0; width: 100%; background: transparent; }
.evo-goal .elementor-image-box-title {
	position: absolute; left: 18px; top: 16px; right: 18px; margin: 0 !important; text-align: left;
	font-family: var(--e-global-typography-h3-font-family), serif !important; font-weight: 700 !important; font-style: italic !important;
	font-size: clamp(22px, 1.9vw, 28px) !important; letter-spacing: -.005em !important; text-transform: none !important; line-height: 1.1 !important; color: var(--evo-navy);      /* navy only — images are lit to carry it */
}
.evo-goal .elementor-image-box-title a { color: inherit !important; text-decoration: none !important; }
.evo-goal .elementor-image-box-title a::after { content: ""; position: absolute; inset: -400px 0 -400px 0; z-index: 2; }      /* the whole card is one link */
.evo-goal .elementor-image-box-description { display: none; }
.evo-goal .elementor-image-box-title a:focus-visible { outline: 0; }
.evo-goal:has(a:focus-visible) { outline: 1.5px solid var(--evo-navy); outline-offset: 3px; }

/* ---------------------------------------------------------------- QUIZ BAND — a present, calm band under the goal cards (full-width → centred) */
.evo-quizband .elementor-widget { margin: 0 !important; }
.evo-quizband > .e-con-inner { flex-direction: column; align-items: center; text-align: center; }
.evo-quizband__copy { align-items: center; text-align: center; }
.evo-quizband__head .elementor-heading-title { margin: 0; text-wrap: balance; text-align: center; }      /* type = Global Font "Functional Heading" (Neue Haas caps), set on the widget */
.evo-quizband__sub, .evo-quizband__sub p { margin: 0 auto; max-width: 36em; text-align: center; }
.evo-quizband__sub, .evo-quizband__sub p { font-weight: 300 !important; }      /* light DM Sans, like the product page body (review 2026-09-23) */
.evo-quizband__sub strong { font-weight: 500; color: inherit; }
.evo-quizband__cta { flex: none; }

@media (max-width: 1024px) { .evo-goals__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) {
	.evo-goals__grid {
		display: flex !important; flex-wrap: nowrap !important; gap: 12px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
		width: calc(100% + 2 * var(--evo-gutter)) !important; max-width: none !important; margin-inline: calc(-1 * var(--evo-gutter)) !important; padding: 4px var(--evo-gutter) 6px !important; scroll-padding-inline: var(--evo-gutter); scrollbar-width: none;
	}
	.evo-goals__grid::-webkit-scrollbar { display: none; }
	.evo-goals__grid > .elementor-widget { flex: 0 0 78% !important; width: 78% !important; scroll-snap-align: start; }
	.evo-quizband__cta, .evo-quizband__cta .elementor-button-wrapper, .evo-quizband__cta .elementor-button { width: 100%; }
}

/* ---------------------------------------------------------------- USP BAND — "YOUR HEALTH, YOUR TERMS" (calm reassurance; full-width → centred)
   Heading = Global Font "Functional Heading" (Neue Haas caps), set on the widget. Each USP is one Image Box: swap its icon in
   Content → Image (SVG or PNG, any size — it is fitted into the icon circle), text in Content → Title / Description.
   Desktop: four generous columns divided by tone-on-tone rules, icon in a soft disc. Phones: the slow sideways marquee. */
.evo-usp .elementor-widget { margin: 0 !important; }
.evo-usp__head .elementor-heading-title { margin: 0; text-align: center; text-wrap: balance; }
.evo-usp__grid { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; width: 100%; }
.evo-usp__grid > .elementor-widget { width: auto !important; max-width: none; min-width: 0; }
.evo-usp__item .elementor-image-box-wrapper { display: flex; flex-direction: column !important; align-items: center; gap: 22px; text-align: center !important; }
.evo-usp__item .elementor-image-box-content, .evo-usp__item .elementor-image-box-title, .evo-usp__item .elementor-image-box-description { width: 100%; text-align: center !important; text-wrap: balance; }      /* centred at every line count, whatever a single widget is set to */
.evo-usp__item .elementor-image-box-img { display: flex; align-items: center; justify-content: center; width: 88px !important; height: 88px; margin: 0 !important; line-height: 0; border-radius: 50%; background: var(--evo-white); }
.evo-usp__item .elementor-image-box-img img { width: 40px !important; height: 40px !important; object-fit: contain; border-radius: 0 !important; }
.evo-usp__item .elementor-image-box-title { margin: 0 !important; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w) !important; font-style: normal !important; font-size: 13px !important; letter-spacing: .14em !important; text-transform: uppercase !important; line-height: 1.45 !important; color: var(--evo-navy); }
.evo-usp__item .elementor-image-box-description { margin: 8px auto 0 !important; max-width: 24ch; font-family: var(--e-global-typography-body-font-family), sans-serif !important; font-weight: 400 !important; font-size: 15px !important; line-height: 1.5 !important; color: var(--evo-charcoal); }      /* one size for all four, whatever a single widget is set to */
/* desktop: COMPACT + ALWAYS CENTRED — icon disc on top, caps title and description centred beneath it. Because every line is centred on
   the item's own axis, a label or description that wraps to 2 or 3 lines stays centred; rows align at the top so the four discs share a line. */
@media (min-width: 1025px) {
	.evo-usp__grid { gap: 0 28px; align-items: start; }
	.evo-usp__grid > .elementor-widget { padding: 0; }
	.evo-usp__item .elementor-image-box-wrapper { gap: 14px; }
	.evo-usp__item .elementor-image-box-img { width: 56px !important; height: 56px; background: var(--evo-usp-disc, var(--e-global-color-band)); }
	.evo-usp__item .elementor-image-box-img img { width: 30px !important; height: 30px !important; }
	.evo-usp__item .elementor-image-box-title { font-size: 12px !important; }
	.evo-usp__item .elementor-image-box-description { margin: 5px auto 0 !important; max-width: 27ch; font-size: 14px !important; line-height: 1.4 !important; }
}
@media (max-width: 1024px) { .evo-usp__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 16px; } }
/* phones, motion allowed: one slow sideways marquee (home.js clones the four items once); otherwise the 2×2 grid stays */
@media (max-width: 767px) {
	.evo-usp__item .elementor-image-box-img { width: 68px !important; height: 68px; } .evo-usp__item .elementor-image-box-img img { width: 32px !important; height: 32px !important; }
	.evo-usp__item .elementor-image-box-wrapper { gap: 16px; } .evo-usp__item .elementor-image-box-title { font-size: 12px !important; } .evo-usp__item .elementor-image-box-description { font-size: 14px !important; }
	.evo-usp__grid.is-marquee { display: flex !important; flex-wrap: nowrap; gap: 0; width: max-content !important; max-width: none !important; animation: evo-marquee 28s linear infinite; }
	.evo-usp__grid.is-marquee > .elementor-widget { flex: 0 0 60vw; width: 60vw !important; padding: 0 14px; }
	.evo-usp__track { overflow: hidden; width: calc(100% + 2 * var(--evo-gutter)); margin-inline: calc(-1 * var(--evo-gutter)); -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
}
@keyframes evo-marquee { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-50%, 0, 0); } }
@media (prefers-reduced-motion: reduce) { .evo-usp__grid.is-marquee { animation: none; } }

/* ==========================================================================
   SELECTOR (.evo-var / .evo-var__btn): the PDP strength selector, shared (moved from pdp.css on 2026-09-23). Rest: square, navy outline, clear ·
   hover: the corner + the pillar colour (--evo-pillar-dark / --evo-pillar-on) · selected (.is-active): the corner + solid navy. Used by the PDP buy box,
   the collection page toggle, strength buttons and goal chips. Token fallbacks keep it working outside the PDP.
   ========================================================================== */
.evo-pdp-add-to-cart .evo-var, .evo-var { display: flex; flex-wrap: wrap; gap: 8px; }
.evo-pdp-add-to-cart .evo-var__btn, .evo-var__btn {
	height: var(--evo-control-h, 44px); min-width: 0; padding: 0 18px; border: var(--evo-pdp-outline, 1px) solid var(--e-global-color-navy); border-radius: 0; box-shadow: none !important; cursor: pointer;
	font-family: var(--evo-pdp-caps, var(--e-global-typography-subheadcaps-font-family)) !important; font-weight: var(--evo-caps-w, 600) !important; font-size: 12px !important; letter-spacing: .1em !important; text-transform: uppercase !important; line-height: 1 !important; margin: 0 !important;
	transition: background-color var(--evo-t-hover, 250ms) var(--evo-pdp-ease, var(--evo-ease)), border-color var(--evo-t-hover, 250ms) var(--evo-pdp-ease, var(--evo-ease)), color var(--evo-t-hover, 250ms) var(--evo-pdp-ease, var(--evo-ease)), border-radius var(--evo-t-hover, 250ms) var(--evo-pdp-ease, var(--evo-ease)) !important;      /* !important: the Elementor widget stamps `transition: all .2s` on every .cart button */
}
/* rest: square, navy outline, clear · hover: the corner + the product's pillar colour · selected: the corner + solid navy. No other states. */
.evo-pdp-add-to-cart .evo-var__btn:not(.is-active), .evo-var__btn:not(.is-active) { background: transparent !important; color: var(--e-global-color-navy) !important; border-color: var(--e-global-color-navy) !important; }
@media (hover: hover) {
	.evo-pdp-add-to-cart .evo-var__btn:not(.is-active):hover, .evo-var__btn:not(.is-active):not(:disabled):hover { border-radius: 0 var(--evo-active-radius, var(--evo-radius-sig, 8px)) 0 0; color: var(--evo-pillar-on) !important; border-color: var(--evo-pillar-dark) !important; background: var(--evo-pillar-dark) !important; }
}
.evo-pdp-add-to-cart .evo-var__btn.is-active, .evo-var__btn.is-active { border-radius: 0 var(--evo-active-radius, var(--evo-radius-sig, 8px)) 0 0; background: var(--e-global-color-navy) !important; border-color: var(--e-global-color-navy) !important; color: var(--e-global-color-white) !important; }
.evo-pdp-add-to-cart .evo-var__btn:focus-visible, .evo-var__btn:focus-visible { outline: var(--evo-pdp-ring, 1.5px) solid var(--e-global-color-navy); outline-offset: 3px; }

/* ==========================================================================
   SITE-WIDE CONSISTENCY (2026-09-24, Haseeb + Martin page-by-page review). These rules are the brand guideline in code; see docs/brand/BRAND_GUIDELINES.md.
   ========================================================================== */
/* 1. BODY COPY = DM Sans LIGHT 300 everywhere (the product page's short-description weight). Emphasis is 500, never 700. Per-widget Elementor typography
      settings stamped 400/500 on many pages; this root rule wins over them. Headings, caps labels, prices and buttons keep their own weights. */
body :is(.elementor-widget-text-editor, .elementor-image-box-description, .evo-standfirst, .evo-section-text, .evo-article-body, .evo-faq__inner, .evo-hubcard__text, .evo-quiz__text, .evo-quiz__note, .evo-quiz__opt-sub)
	:is(p, li, dd, td, figcaption, blockquote):not(.wp-block-pullquote *, .evo-pullquote, .evo-pullquote *, .evo-blog-products *, .evo-blog-quiz *),
body :is(.elementor-widget-text-editor, .elementor-image-box-description, .evo-quiz__text, .evo-quiz__note, .evo-quiz__opt-sub):not(.evo-caps) { font-weight: 300 !important; }
body :is(.elementor-widget-text-editor, .evo-article-body, .evo-faq__inner, .evo-standfirst) :is(strong, b):not(.wp-block-pullquote *) { font-weight: 500 !important; }
/* form fields: typed values and placeholders are body copy too (not the browser's system font) */
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]), textarea, select { font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; }
input::placeholder, textarea::placeholder { font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; color: color-mix(in srgb, var(--evo-slate) 75%, transparent); opacity: 1; }
textarea { resize: none; }

/* 2. MESSAGES (success / info / error) — one component everywhere: WooCommerce notices, block notices, Elementor form messages, WPGens messages.
      Warm panel, signature corner, a small round mark, DM Sans 300; an action inside is a caps text link, never a second button. */
:is(.woocommerce-message, .woocommerce-info, .woocommerce-error, .wc-block-components-notice-banner, .wpgens-loyalty-notice, .woocommerce-notice):not(.evo-quiet) {
	position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin: 0 0 22px !important; padding: 16px 20px 16px 56px !important;
	background: var(--evo-page) !important; color: var(--evo-charcoal) !important; border: 0 !important; border-radius: 0 var(--evo-radius-sig) 0 0 !important; box-shadow: none !important; outline: 0;
	font-family: var(--e-global-typography-body-font-family), sans-serif !important; font-weight: 300 !important; font-size: 15px !important; line-height: 1.5 !important; list-style: none !important; }
:is(.woocommerce-message, .woocommerce-info, .woocommerce-error, .wc-block-components-notice-banner, .wpgens-loyalty-notice)::before {
	content: "" !important; position: absolute !important; left: 20px; top: 50%; width: 22px; height: 22px; margin: -11px 0 0 !important; border-radius: 50%; background: var(--evo-navy) center / 12px 12px no-repeat;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E") !important; font-family: none !important; color: transparent !important; }
.woocommerce-info::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M8 7v5M8 4.2v.1'/%3E%3C/svg%3E") !important; }
:is(.woocommerce-error, .wc-block-components-notice-banner.is-error)::before { background-color: var(--evo-offer) !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M8 4v5M8 11.8v.1'/%3E%3C/svg%3E") !important; }
.woocommerce-error { flex-direction: column; align-items: flex-start; }
.woocommerce-error li { margin: 0 !important; padding: 0 !important; list-style: none !important; }
:is(.woocommerce-message, .woocommerce-info, .woocommerce-error) a:not(.button) { color: var(--evo-navy) !important; text-decoration: underline; text-underline-offset: 3px; font-weight: 400; }
:is(.woocommerce-message, .woocommerce-info, .woocommerce-error) .button, :is(.woocommerce-message, .woocommerce-info) a.button, .woocommerce-message .wc-forward {
	order: 2; float: none !important; margin: 0 0 0 auto !important; padding: 0 0 3px !important; min-height: 0 !important; background: transparent !important; color: var(--evo-navy) !important; border: 0 !important; border-radius: 0 !important; box-shadow: inset 0 -1px 0 currentColor !important;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w) !important; font-size: 11px !important; letter-spacing: .16em !important; text-transform: uppercase !important; line-height: 1.3 !important; }
:is(.woocommerce-message, .woocommerce-info, .woocommerce-error) .button::after { display: none !important; }
:is(.woocommerce-message, .woocommerce-info, .woocommerce-error) .button:hover { opacity: .6; background: transparent !important; color: var(--evo-navy) !important; }
.woocommerce-notices-wrapper:empty { display: none; }
.elementor-message { position: relative; margin: 14px 0 0 !important; padding: 14px 16px 14px 48px !important; background: var(--evo-page) !important; border-radius: 0 var(--evo-radius-sig) 0 0; color: var(--evo-charcoal) !important; font-family: var(--e-global-typography-body-font-family), sans-serif !important; font-weight: 300 !important; font-size: 15px !important; line-height: 1.5 !important; }
.elementor-message::before { content: "" !important; position: absolute; left: 16px; top: 15px; width: 20px; height: 20px; border-radius: 50%; background: var(--evo-navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E") center / 11px no-repeat; font-family: none !important; }
.elementor-message.elementor-message-danger::before { background-color: var(--evo-offer); }
@media (max-width: 767px) { :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) { padding: 14px 16px 14px 50px !important; font-size: 14.5px !important; } :is(.woocommerce-message, .woocommerce-info, .woocommerce-error)::before { left: 16px; } :is(.woocommerce-message, .woocommerce-info) .button { margin-left: 0 !important; } }

/* 3. LINKS ON NAVY keep their colour on hover (the theme reset paints a:hover #336, invisible on navy) */
:is(.evo-footer, .evo-tone-navy, .evo-page-quote, .evo-stat-band, .evo-rw__dash, .evo-rw__refer, .evo-rw__chip, .evo-lp__card--navy, .evo-lp__guest, .evo-announce, .evo-help__hero, .evo-navy) a:is(:hover, :focus, :active):not(.evo-btn):not(.elementor-button) { color: inherit; }
/* the theme reset turns every link hover a generic dark blue: our links keep their colour and step back in opacity instead */
a:is(:hover, :active):where(:not([class*="elementor"]):not(.evo-btn)) { color: inherit; }

/* 4. FOCUS: a ring only for keyboard users (a mouse click never leaves an outline box on a tab, link or button) */
:focus:not(:focus-visible) { outline: none !important; box-shadow: none; }
:focus-visible { outline: 1.5px solid var(--evo-navy); outline-offset: 3px; }
:is(.evo-footer, .evo-tone-navy, .evo-rw__dash, .evo-rw__refer, .evo-lp__card--navy, .evo-lp__guest) :focus-visible { outline-color: var(--evo-page); }

/* 5. THE FOOTER WAVE: one centred crest with the curve rising at both edges, at every width (Haseeb's Shopify geometry). The SVG is 250% wide and
      shifted 50% so the visible window is path units 600–1800 (crest, trough, CREST at the centre, trough, crest). The viewBox is padded (php) so the
      top of a crest is never shaved off, and the wave overlaps the footer by 2px so no hairline shows between them. */
body { --evo-wave-w: 250%; --evo-wave-x: -50%; }
@media (max-width: 767px) { body { --evo-wave-w: 250%; --evo-wave-x: -50%; } }
.evo-footwave { margin-block: 0 -2px !important; position: relative; z-index: 2; }
.evo-footwave .evo-wave { height: calc(var(--evo-wave-h) + 2px); margin-bottom: 0; }
.evo-footwave + *, .evo-footwave ~ .elementor-location-footer, .evo-footwave ~ footer { position: relative; z-index: 1; }

/* 6. THE PILL — the one coral fill for money: subscribe-and-save switches, points earned, flash offers. 4px corners (the PDP's offer pill), white Neue Haas caps.
      A clickable pill turns navy on hover. Never a coral underlined text link. */
.evo-pill { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 7px 11px 6px; border: 0 !important; border-radius: 4px !important; background: var(--evo-offer) !important; color: var(--evo-white) !important; box-shadow: none !important; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w) !important; font-size: 10.5px !important; letter-spacing: .12em !important; text-transform: uppercase !important; line-height: 1.2 !important; text-decoration: none !important; min-height: 0 !important; }
button.evo-pill, a.evo-pill { cursor: pointer; transition: background-color var(--evo-t-hover) var(--evo-ease); }
button.evo-pill:is(:hover, :focus-visible, :active), a.evo-pill:is(:hover, :focus-visible, :active) { background: var(--evo-navy) !important; color: var(--evo-white) !important; outline: 0; }
.evo-pill--navy { background: var(--evo-navy) !important; }

/* 7. THE ARROW CIRCLE — every "go" affordance on a card or row (homepage goal cards, Learn hub, help centre): a 1.5px navy ring with the arrow; it fills navy
      on hover of the card/row it sits in. Never a bare floating arrow. */
.evo-arrowcircle { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 40px; height: 40px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--evo-navy); color: var(--evo-navy); font-style: normal; transition: background-color var(--evo-t-hover) var(--evo-ease), color var(--evo-t-hover) var(--evo-ease); }
.evo-arrowcircle svg { width: 16px; height: 16px; transition: transform var(--evo-t-hover) var(--evo-ease); }
:is(a, button):is(:hover, :focus-visible) .evo-arrowcircle, .evo-arrowcircle:is(:hover, :focus-visible) { background: var(--evo-navy); color: var(--evo-white); }
:is(a, button):is(:hover, :focus-visible) .evo-arrowcircle svg { transform: translateX(2px); }