/* ==========================================================================
   EVOPURE BLOG  —  header, footer, blog index, single post, blog cards
   --------------------------------------------------------------------------
   Every colour and typeface resolves through an Elementor Global
   (Site Settings > Global Colors / Global Fonts). No literal hex values.
   Radius system: sharp, with the top-right corner rounded wherever a card
   or image tile appears (matches the product card).
   No resting shadows anywhere.
   ========================================================================== */

:root {
	--evo-control-h: 44px;          /* standard height of selectors, steppers and secondary buttons */
	--evo-cta-h: 48px;              /* primary CTA height */
	--evo-radius-card: 20px;          /* top-right corner of cards and image tiles */
	--evo-article-width: 680px;       /* reading column */
	--evo-breakout-width: 960px;      /* pull-quotes / wide images inside the article */
}

/* ---- Shared pieces ------------------------------------------------------ */
.evo-eyebrow {
	display: inline-block;
	font-family: var(--e-global-typography-eyebrow-font-family), sans-serif;
	font-weight: var(--e-global-typography-eyebrow-font-weight);
	font-size: var(--e-global-typography-eyebrow-font-size, 12px);
	letter-spacing: var(--e-global-typography-eyebrow-letter-spacing);
	text-transform: var(--e-global-typography-eyebrow-text-transform);
	line-height: var(--e-global-typography-eyebrow-line-height);
	color: var(--e-global-color-slate);
	text-decoration: none;
}
a.evo-eyebrow:hover { color: var(--e-global-color-navy); }

.evo-read-time,
.evo-meta {
	font-family: var(--e-global-typography-caption-font-family), sans-serif;
	font-weight: var(--e-global-typography-caption-font-weight);
	font-size: var(--e-global-typography-caption-font-size, 12px);
	letter-spacing: var(--e-global-typography-caption-letter-spacing);
	text-transform: var(--e-global-typography-caption-text-transform);
	color: var(--e-global-color-slate);
}

/* Post Info widget (author · date) — same caption voice, no icons */
.evo-meta-row .elementor-post-info,
.evo-meta-row .elementor-icon-list-items { display: flex; flex-wrap: wrap; align-items: center; gap: 0 18px; }
.evo-meta-row .elementor-icon-list-item,
.evo-meta-row .elementor-icon-list-text,
.evo-meta-row .elementor-post-info__item a {
	font-family: var(--e-global-typography-caption-font-family), sans-serif;
	font-weight: var(--e-global-typography-caption-font-weight);
	font-size: var(--e-global-typography-caption-font-size, 12px);
	letter-spacing: var(--e-global-typography-caption-letter-spacing);
	text-transform: var(--e-global-typography-caption-text-transform);
	color: var(--e-global-color-slate);
	text-decoration: none;
}
.evo-meta-row .elementor-post-info__item a:hover { color: var(--e-global-color-navy); }
.evo-meta-row .elementor-avatar { width: 28px; height: 28px; border-radius: 50%; margin-right: 8px; }
.evo-meta-row .elementor-post-info__item-prefix { margin-right: .35em; }
.evo-meta-row .elementor-icon-list-icon { display: none; }
/* Divider between items: a small dot instead of the widget's border */
.evo-meta-row .elementor-inline-items .elementor-icon-list-item:not(:last-child)::after {
	content: "\00B7"; margin: 0 0 0 18px; opacity: .55; border: 0; height: auto; width: auto; position: static;
}

/* Image tile — sharp with rounded top-right, image fills it */
.evo-post-media {
	display: block; position: relative; overflow: hidden;
	border-radius: 0 var(--evo-radius-card) 0 0;
	background: var(--e-global-color-wash);
	line-height: 0;
}
.evo-post-media .evo-post-img {
	display: block; width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 600ms var(--evo-ease, ease);
}
.evo-post-media .evo-post-img--placeholder { min-height: 100%; }
@media (hover: hover) {
	.e-loop-item:hover .evo-post-media .evo-post-img { transform: scale(1.03); }
}

/* ==========================================================================
   HEADER + FOOTER styling moved to  evopure-blog/chrome.css  (2026-09-17, v3)
   ========================================================================== */

/* ==========================================================================
   BLOG CARD  —  loop template "Evopure — Blog Card"
   Uniform height, image top, flat, no shadow, hover = image zoom + title tint.
   ========================================================================== */
.elementor-loop-container { grid-auto-rows: 1fr; }
.elementor-loop-container .e-loop-item { display: flex; flex-direction: column; }
.elementor-loop-container .e-loop-item > .elementor-element { flex: 1 1 auto; }

.evo-blog-card { height: 100%; overflow: hidden; }
.evo-blog-card, .evo-blog-card *, .evo-blog-card:hover, .evo-blog-card:hover * { box-shadow: none !important; }
.evo-blog-card .evo-post-media { aspect-ratio: 4 / 3; width: 100%; border-radius: 0; }
.evo-blog-card .evo-post-media .evo-post-img { aspect-ratio: 4 / 3; }
.evo-blog-card .evo-card-body { flex: 1 1 auto; display: flex; flex-direction: column; }
.evo-blog-card .evo-card-title h3, .evo-blog-card .evo-card-title h2 { margin: 0; }
.evo-blog-card .evo-card-title a { color: inherit; text-decoration: none; transition: color .25s ease; }
.evo-blog-card:hover .evo-card-title a { color: var(--e-global-color-slate); }
.evo-blog-card .evo-card-excerpt p { margin: 0; }
.evo-blog-card .evo-card-excerpt {
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.evo-blog-card .evo-card-footer { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.evo-blog-card .evo-read-more a,
.evo-blog-card .evo-read-more .elementor-button {
	background: transparent; padding: 0; border-radius: 0; box-shadow: none;
	font-family: var(--e-global-typography-uibutton-font-family), sans-serif;
	font-weight: var(--e-global-typography-uibutton-font-weight);
	font-size: calc(var(--e-global-typography-uibutton-font-size, 14px) * .85);
	letter-spacing: var(--e-global-typography-uibutton-letter-spacing);
	text-transform: var(--e-global-typography-uibutton-text-transform);
	color: var(--e-global-color-navy);
	border-bottom: 1px solid currentColor;
	transition: color .25s ease;
}
.evo-blog-card:hover .evo-read-more .elementor-button { color: var(--e-global-color-sky); }
.evo-blog-card .evo-read-more .elementor-button-icon { margin-left: .4em; }

/* Hover: the hovered card grows slightly, nothing else moves (product-card rule) */
/* no card expand on hover (with 297 cards it stuttered): only the image eases in */

/* ---- Hero card (loop template "Evopure — Blog Hero Card") ---------------- */
.evo-blog-hero { overflow: hidden; }
.evo-blog-hero .evo-post-media { aspect-ratio: 4 / 3; width: 100%; height: 100%; }
.evo-blog-hero .evo-post-media .evo-post-img { aspect-ratio: auto; }
.evo-blog-hero .evo-hero-title h2, .evo-blog-hero .evo-hero-title h1 { margin: 0; }
.evo-blog-hero .evo-hero-title a { color: inherit; text-decoration: none; }
.evo-blog-hero:hover .evo-hero-title a { color: var(--e-global-color-slate); }
.evo-blog-hero .evo-card-excerpt { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 767px) { .evo-blog-hero .evo-post-media { aspect-ratio: 4 / 3; height: auto; } }

/* ---- Menu "latest" card (loop template "Evopure — Blog Menu Link") ------- */
.evo-menu-card .evo-post-media { aspect-ratio: 16 / 10; }
.evo-menu-card .evo-menu-card-title h4 { margin: 0; }
.evo-menu-card .evo-menu-card-title a { color: inherit; text-decoration: none; }
.evo-menu-card:hover .evo-menu-card-title a { color: var(--e-global-color-slate); }

/* ==========================================================================
   BLOG INDEX  —  filter bar
   ========================================================================== */
.evo-filter-bar { border-top: 1px solid var(--e-global-color-wash); border-bottom: 1px solid var(--e-global-color-wash); }
/* Taxonomy Filter widget: pill-less text buttons, active = navy underline */
.evo-filter-bar .e-filter { gap: 4px 22px; }
.evo-filter-bar .e-filter-item {
	background: transparent; border: 0; border-radius: 0; padding: 6px 0; box-shadow: none;
	font-family: var(--e-global-typography-uibutton-font-family), sans-serif;
	font-weight: var(--e-global-typography-uibutton-font-weight);
	font-size: calc(var(--e-global-typography-uibutton-font-size, 14px) * .85);
	letter-spacing: var(--e-global-typography-uibutton-letter-spacing);
	text-transform: var(--e-global-typography-uibutton-text-transform);
	color: var(--e-global-color-slate);
	border-bottom: 2px solid transparent;
	transition: color .25s ease, border-color .25s ease;
}
.evo-filter-bar .e-filter-item:hover { color: var(--e-global-color-navy); }
.evo-filter-bar .e-filter-item.e-active { color: var(--e-global-color-navy); border-bottom-color: var(--e-global-color-navy); }

/* Hide the WordPress default category from the filter row */
.evo-filter-bar .e-filter-item[data-filter="uncategorized"] { display: none; }

/* Sort control ([evo_blog_sort]) */
.evo-sort { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 18px; }
.evo-sort-label,
.evo-sort-item {
	font-family: var(--e-global-typography-uibutton-font-family), sans-serif;
	font-weight: var(--e-global-typography-uibutton-font-weight);
	font-size: calc(var(--e-global-typography-uibutton-font-size, 14px) * .85);
	letter-spacing: var(--e-global-typography-uibutton-letter-spacing);
	text-transform: var(--e-global-typography-uibutton-text-transform);
	color: var(--e-global-color-slate);
	text-decoration: none; padding: 6px 0; border-bottom: 2px solid transparent;
	transition: color .25s ease, border-color .25s ease;
}
.evo-sort-label { opacity: .7; }
.evo-sort-item:hover { color: var(--e-global-color-navy); }
.evo-sort-item.is-active { color: var(--e-global-color-navy); border-bottom-color: var(--e-global-color-navy); }

/* Load more button under the grid: square, navy (product-card button) */
.evo-blog-grid .elementor-button-link,
.evo-blog-grid .e-load-more-spinner { color: var(--e-global-color-navy); }
.evo-blog-grid .e-loop__load-more .elementor-button {
	position: relative; display: inline-flex !important; align-items: center; justify-content: center; min-height: var(--evo-cta-h, 48px); padding: 0 46px !important; background: var(--e-global-color-navy) !important; color: var(--e-global-color-white) !important; border: 1px solid var(--e-global-color-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, 600) !important; font-size: 12px !important; letter-spacing: .16em !important; text-transform: uppercase !important; line-height: 1 !important;
	transition: border-radius var(--evo-t-hover, 250ms) var(--evo-ease, ease), background-color var(--evo-t-hover, 250ms) var(--evo-ease, ease), color var(--evo-t-hover, 250ms) var(--evo-ease, ease);
}
.evo-blog-grid .e-loop__load-more .elementor-button:hover, .evo-blog-grid .e-loop__load-more .elementor-button:focus-visible { border-radius: 0 var(--evo-radius-sig, 8px) 0 0 !important; background: transparent !important; color: var(--e-global-color-navy) !important; }      /* the solo-button interaction (chrome.css) */      /* a SOLO button → the full interaction (chrome.css): corner + invert to a navy outline */
.evo-blog-grid .e-load-more-message {
	font-family: var(--e-global-typography-caption-font-family), sans-serif;
	font-size: var(--e-global-typography-caption-font-size, 12px);
	letter-spacing: var(--e-global-typography-caption-letter-spacing);
	text-transform: var(--e-global-typography-caption-text-transform);
	color: var(--e-global-color-slate);
}

/* ==========================================================================
   THE JOURNAL + CARDS on the homepage system (2026-09-22)
   Functional lines = Neue Haas caps · titles = New Spirit · one blue (navy) · the site's buttons and text links · card-scale corner.
   ========================================================================== */
.evo-eyebrow, .evo-read-time, .evo-meta { font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w, 600) !important; font-size: 10.5px !important; letter-spacing: .16em !important; text-transform: uppercase !important; line-height: 1.4 !important; }
.evo-archive-head .elementor-widget { margin: 0 !important; width: 100%; text-align: center; }
.evo-archive-title .elementor-heading-title { margin: 0; font-size: clamp(34px, 3.6vw, 56px) !important; line-height: 1.06 !important; letter-spacing: -.01em; text-wrap: balance; }
.evo-archive-title em, .evo-archive-title .evo-accent { font-family: inherit !important; font-style: italic; font-weight: 300; }
.evo-archive-sub, .evo-archive-sub p { margin: 0 auto; max-width: 40em; text-align: center; }
/* topic chips under the intro: white pills with navy caps (the product-card pill), the count in slate; hover = the signature corner */
.evo-topics { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 10px; }
.evo-topic { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px; background: var(--e-global-color-white); color: var(--e-global-color-navy) !important; text-decoration: none !important; border: 1px solid transparent; border-radius: 0;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w, 600); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; line-height: 1; transition: border-radius var(--evo-t-hover, 250ms) var(--evo-ease, ease), border-color var(--evo-t-hover, 250ms) var(--evo-ease, ease); }
.evo-topic i { font-style: normal; font-weight: 400; letter-spacing: .04em; color: var(--e-global-color-slate); }
.evo-topic:hover, .evo-topic:focus-visible { border-color: var(--e-global-color-navy); border-radius: 0 var(--evo-radius-sig, 8px) 0 0; outline: 0; }
.evo-archive-trust .elementor-heading-title { margin: 8px 0 0; font-size: 10.5px !important; letter-spacing: .16em !important; line-height: 1.6 !important; }
.evo-archive-latest .elementor-heading-title { margin: 0; font-size: 11.5px !important; letter-spacing: .16em !important; }
@media (max-width: 767px) { .evo-topics { gap: 8px; } .evo-topic { min-height: 36px; padding: 0 12px; font-size: 10px; } }

/* SCROLL REVEAL on the blog pages (blog.js): same vocabulary as the homepage. Hidden only while html.evo-anim is set (JS running, motion allowed) */
@media (prefers-reduced-motion: no-preference) {
	html.evo-anim body:not(.elementor-editor-active) .evo-reveal:not(.is-done) > *, html.evo-anim body:not(.elementor-editor-active) .evo-reveal-self:not(.is-done) { opacity: 0; transform: translate3d(0, 16px, 0); transition: opacity 600ms var(--evo-ease, ease), transform 600ms var(--evo-ease, ease); transition-delay: calc(var(--evo-i, 0) * var(--evo-stagger, 60ms)); }
	html.evo-anim body:not(.elementor-editor-active) .evo-reveal.is-in:not(.is-done) > *, html.evo-anim body:not(.elementor-editor-active) .evo-reveal-self.is-in:not(.is-done) { opacity: 1; transform: none; }
}
/* cards: Cool Wash surface with the card-scale corner; the whole card answers to hover with the image, not a colour change */
.evo-blog-card, .evo-blog-hero { border-radius: 0 var(--evo-radius-card, 24px) 0 0; }
.evo-blog-card .evo-card-title .elementor-heading-title, .evo-blog-hero .evo-hero-title .elementor-heading-title { text-wrap: balance; }
.evo-blog-card:hover .evo-card-title a, .evo-blog-hero:hover .evo-hero-title a { color: var(--e-global-color-navy); }
.evo-blog-card .evo-card-excerpt, .evo-blog-card .evo-card-excerpt p { font-size: 15.5px !important; line-height: 1.55 !important; color: var(--e-global-color-charcoal) !important; }
.evo-blog-hero .evo-card-excerpt, .evo-blog-hero .evo-card-excerpt p { font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-size: 18px; line-height: 1.55; color: var(--e-global-color-charcoal) !important; }
.evo-blog-hero .evo-byline { margin-top: 2px; }
/* the hero card's photo fills the card's full height (no grey strip under it) */
@media (min-width: 768px) { .evo-blog-hero > .e-con:first-child { align-self: stretch; } .evo-blog-hero .evo-hero-media, .evo-blog-hero .evo-hero-media .elementor-widget-container, .evo-blog-hero .evo-hero-media .elementor-shortcode { height: 100%; } .evo-blog-hero .evo-post-media { aspect-ratio: auto; min-height: 100%; } .evo-blog-hero .evo-post-media .evo-post-img { position: absolute; inset: 0; } }
/* "Read more" = the site's caps text link with the hanging arrow (no box) */
.evo-blog-card .evo-read-more .elementor-button { position: relative; display: inline-flex; padding: 0 0 5px !important; min-height: 0; border: 0 !important; border-radius: 0 !important; background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat !important; color: var(--e-global-color-navy) !important;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w, 600) !important; font-size: 11.5px !important; letter-spacing: .16em !important; text-transform: uppercase !important; line-height: 1.2 !important; }
.evo-blog-card .evo-read-more .elementor-button-icon { display: none; }
.evo-blog-card .evo-read-more .elementor-button::after { content: ""; position: absolute; left: 100%; top: 50%; margin: -10px 0 0 8px; width: 16px; height: 16px; opacity: 1; transform: none; 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, 250ms) var(--evo-ease, ease); }
.evo-blog-card:hover .evo-read-more .elementor-button { color: var(--e-global-color-navy) !important; }
.evo-blog-card:hover .evo-read-more .elementor-button::after { transform: translateX(5px); }
.evo-blog-card .evo-card-footer { padding-right: 26px; }
/* filter + sort: caps, navy underline for the active one */
.evo-filter-bar { border-color: color-mix(in srgb, var(--e-global-color-navy) 10%, transparent) !important; }
.evo-blog-grid .e-load-more-anchor ~ .elementor-button-wrapper .elementor-button, .evo-blog-grid .elementor-button { border-radius: 0 !important; }

/* ==========================================================================
   SINGLE POST
   ========================================================================== */
/* Reading progress bar sits just under the sticky header */
.evo-progress.elementor-sticky--active { top: var(--evo-header-h) !important; z-index: 99; transition: top .25s ease; }
.admin-bar .evo-progress.elementor-sticky--active { top: calc(var(--evo-header-h) + var(--wp-admin--admin-bar--height, 32px)) !important; }
.evo-progress .elementor-scrolling-tracker-horizontal { background: transparent; border: 0; height: 3px; }
.evo-progress .elementor-scrolling-tracker-horizontal .current-progress { background: var(--e-global-color-navy) !important; border-radius: 0; }

/* Hero: words left, featured image right with the card-scale corner; on the Page tone. New Spirit is the H1; everything functional is Neue Haas */
.evo-post-hero .elementor-widget { margin: 0 !important; }
.evo-post-hero .evo-post-media.evo-hero-img { display: block; aspect-ratio: 5 / 4; height: auto; overflow: hidden; border-radius: 0 var(--evo-radius-sweep, 56px) 0 0; background: var(--e-global-color-wash); line-height: 0; }
.evo-post-hero .evo-hero-img .evo-post-img { display: block; width: 100%; height: 100% !important; aspect-ratio: auto; object-fit: cover; border-radius: 0; }
.evo-post-hero .evo-eyebrow { display: inline-block; padding: 7px 10px 6px; background: var(--e-global-color-navy); color: var(--e-global-color-white) !important; text-decoration: none; line-height: 1;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w, 600); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; }
.evo-post-hero .evo-post-title .elementor-heading-title { margin: 0; font-size: clamp(32px, 3.5vw, 54px) !important; line-height: 1.06 !important; letter-spacing: -.01em; text-wrap: balance; }
.evo-post-hero .evo-standfirst, .evo-post-hero .evo-standfirst p { margin: 0; max-width: 34em; font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-size: clamp(17px, 1.35vw, 19.5px); line-height: 1.55; color: var(--e-global-color-charcoal); text-wrap: pretty; }
.evo-byline { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 6px 0 0; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w, 600); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; line-height: 1.4; color: var(--e-global-color-slate); }
.evo-byline__by { color: var(--e-global-color-navy); }
.evo-byline__dot { opacity: .5; }
@media (max-width: 767px) { .evo-post-hero .evo-post-media.evo-hero-img { aspect-ratio: auto; height: auto; border-radius: 0 var(--evo-radius-card, 24px) 0 0; } .evo-post-hero .evo-hero-img .evo-post-img { height: auto !important; aspect-ratio: 4 / 3; }      /* the ratio sits on the image itself on phones: a ratio box inside an auto-height column collapses the column (the photo ran over the title) */ .evo-post-hero .evo-hero-media, .evo-post-hero .evo-hero-media .elementor-widget-container, .evo-post-hero .evo-hero-media .elementor-shortcode { height: auto !important; min-height: 0 !important; } }      /* the widget must grow with its image on phones (a fixed height let the photo overlap the title) */

/* ---- Reading column ------------------------------------------------------
   The body is never full width: the container is boxed to --evo-article-width. Since the 2026-09-22 clean-up the post HTML carries NO styling of its
   own (no <style>, no style=""), so everything an article can contain is styled here, on the homepage system:
   New Spirit = the article's section headings (h2) only · Neue Haas = every functional line (h3/h4, contents, FAQ questions, table heads, labels) ·
   DM Sans = the reading text. Tone-filled panels with the signature corner instead of outlined, rounded boxes. One blue: navy. */
.evo-article-col { max-width: var(--evo-article-width) !important; margin-left: auto !important; margin-right: auto !important; }
.evo-article-body { overflow: visible; --evo-art-line: color-mix(in srgb, var(--e-global-color-navy) 10%, transparent); --evo-art-sans: var(--evo-nav-sans, var(--e-global-typography-subheadcaps-font-family), sans-serif); }

.evo-article-body, .evo-article-body p:not(.evo-blog-products *):not(.evo-blog-quiz *), .evo-article-body li:not(.evo-blog-products *):not(.evo-blog-quiz *), .evo-article-body td, .evo-article-body dd {
	font-family: var(--e-global-typography-body-font-family), sans-serif !important; font-weight: 300 !important; font-size: 18px !important; line-height: 1.72 !important; color: var(--e-global-color-charcoal) !important;
}
.evo-article-body p:not(.evo-blog-products *):not(.evo-blog-quiz *) { margin: 0 0 1.3em; }
.evo-article-body > div > p:first-child { margin-top: 0; }
.evo-article-body ul:not(.evo-blog-products *):not(.evo-blog-quiz *), .evo-article-body ol { margin: 0 0 1.5em 1.2em; padding: 0; }
.evo-article-body li:not(.evo-blog-products *):not(.evo-blog-quiz *) { margin-bottom: .45em; }
.evo-article-body li:not(.evo-blog-products *):not(.evo-blog-quiz *)::marker { color: var(--e-global-color-navy); }
.evo-article-body a:not(.evo-blog-products *):not(.evo-blog-quiz *) { color: var(--e-global-color-navy) !important; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; transition: color var(--evo-t-hover, 250ms) var(--evo-ease, ease); }
.evo-article-body a:not(.evo-blog-products *):not(.evo-blog-quiz *):hover { color: var(--e-global-color-slate) !important; }
.evo-article-body strong:not(.evo-blog-products *):not(.evo-blog-quiz *), .evo-article-body b:not(.evo-blog-products *):not(.evo-blog-quiz *) { font-weight: 600 !important; color: var(--e-global-color-navy) !important; }
.evo-article-body section { margin: 0; padding: 0; }
.evo-article-body header { margin: 0; }

.evo-article-body h2:not(.evo-blog-products *):not(.evo-blog-quiz *), .evo-article-body h3:not(.evo-blog-products *):not(.evo-blog-quiz *), .evo-article-body h4:not(.evo-blog-products *):not(.evo-blog-quiz *), .evo-article-body h5 { color: var(--e-global-color-navy) !important; border: 0 !important; padding: 0 !important; scroll-margin-top: calc(var(--evo-header-h, 96px) + 24px); text-wrap: balance; }
.evo-article-body h2 {      /* the article's section headings: New Spirit */
	font-family: var(--e-global-typography-h2-font-family), serif !important; font-weight: var(--e-global-typography-h2-font-weight, 700) !important; font-style: var(--e-global-typography-h2-font-style, italic) !important;
	font-size: clamp(26px, 2.3vw, 34px) !important; line-height: 1.14 !important; letter-spacing: -.005em !important; margin: 2.1em 0 .6em !important;
}
.evo-article-body h3:not(.evo-blog-products *):not(.evo-blog-quiz *), .evo-article-body h4:not(.evo-blog-products *):not(.evo-blog-quiz *), .evo-article-body h5 { font-family: var(--evo-art-sans) !important; font-style: normal !important; font-weight: 600 !important; letter-spacing: .005em !important; line-height: 1.3 !important; text-transform: none !important; }
.evo-article-body h3:not(.evo-blog-products *):not(.evo-blog-quiz *) { font-size: 21px !important; margin: 1.8em 0 .5em !important; }
.evo-article-body h4, .evo-article-body h5 { font-size: 17.5px !important; margin: 1.6em 0 .4em !important; }

/* Inline images sit at column width, with the card-scale corner */
.evo-article-body img:not(.evo-blog-products *):not(.evo-blog-quiz *) { display: block; max-width: 100%; height: auto !important; width: 100%; border-radius: 0 var(--evo-radius-card, 24px) 0 0; margin: 2em 0; }
.evo-article-body figure { margin: 2em 0; }
.evo-article-body figure img { margin: 0; }
.evo-article-body figcaption { margin-top: .7em; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w, 600); font-size: 10.5px !important; letter-spacing: .14em; text-transform: uppercase; color: var(--e-global-color-slate) !important; }
/* video: the writer's wrapper (class evo-video) keeps 16:9 */
.evo-article-body .evo-video { position: relative; aspect-ratio: 16 / 9; margin: 2em 0; overflow: hidden; border-radius: 0 var(--evo-radius-card, 24px) 0 0; background: var(--e-global-color-wash); }
.evo-article-body .evo-video iframe, .evo-article-body iframe[src*="youtube"] { display: block; width: 100%; height: 100%; aspect-ratio: 16 / 9; border: 0; }

/* Pull-quotes — break wider than the column (Pullquote block, or <blockquote class="evo-pullquote">). A plain <blockquote> keeps a navy rule. */
.evo-article-body blockquote { margin: 2em 0; padding: 0 0 0 24px; border-left: 2px solid var(--e-global-color-navy); }
.evo-article-body blockquote p { font-size: 21px !important; line-height: 1.5 !important; color: var(--e-global-color-navy) !important; margin: 0 0 .5em; }
.evo-article-body .wp-block-pullquote, .evo-article-body blockquote.evo-pullquote, .evo-article-body .alignwide {
	width: min(var(--evo-breakout-width), 100vw - 48px); margin-left: calc(50% - min(var(--evo-breakout-width), 100vw - 48px) / 2); margin-right: 0;
}
.evo-article-body .wp-block-pullquote, .evo-article-body blockquote.evo-pullquote { border: 0; padding: 40px 0; text-align: center; box-shadow: inset 0 1px 0 var(--evo-art-line), inset 0 -1px 0 var(--evo-art-line); }
.evo-article-body .wp-block-pullquote blockquote { border: 0; padding: 0; margin: 0; }
.evo-article-body .wp-block-pullquote p, .evo-article-body blockquote.evo-pullquote p { font-family: var(--e-global-typography-h2-font-family), serif !important; font-style: italic; font-weight: 500 !important; font-size: clamp(24px, 2.4vw, 32px) !important; line-height: 1.26 !important; }
.evo-article-body .wp-block-pullquote cite, .evo-article-body blockquote cite { display: block; margin-top: .8em; font-style: normal; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w, 600); font-size: 10.5px !important; letter-spacing: .14em; text-transform: uppercase; color: var(--e-global-color-slate) !important; }
.evo-article-body .alignfull { width: 100vw; margin-left: calc(50% - 50vw); margin-right: 0; }

/* CONTENTS (<nav>, class toc on most): a Cool Wash panel with the card corner; caps label, quiet links, two columns when there is room */
.evo-article-body nav { margin: 2em 0 2.4em; padding: 26px 30px 24px; background: var(--e-global-color-wash); border: 0; border-radius: 0 var(--evo-radius-card, 24px) 0 0; }
.evo-article-body nav > :first-child:not(ul):not(ol), .evo-article-body nav > :first-child:not(ul):not(ol) * {
	margin: 0 0 14px !important; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-style: normal !important; font-weight: var(--evo-caps-w, 600) !important; font-size: 11.5px !important; letter-spacing: .16em !important; text-transform: uppercase !important; line-height: 1.4 !important; color: var(--e-global-color-navy) !important;
}
.evo-article-body nav ul, .evo-article-body nav ol { list-style: none; margin: 0 !important; padding: 0; columns: 2; column-gap: 36px; }
.evo-article-body nav li { margin: 0 0 9px; break-inside: avoid; font-family: var(--evo-art-sans) !important; font-size: 15.5px !important; line-height: 1.4 !important; }
.evo-article-body nav li ul, .evo-article-body nav li ol { columns: 1; margin: 8px 0 0 14px !important; }
.evo-article-body nav a { font-family: var(--evo-art-sans) !important; text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size var(--evo-t-hover, 250ms) var(--evo-ease, ease); }
.evo-article-body nav a:hover { color: var(--e-global-color-navy) !important; background-size: 100% 1px; }

/* FAQ (<details>): the site's accordion. Neue Haas question, hairline rules, a plus in a ring that turns into a close mark as the ring fills */
.evo-article-body details { margin: 0; padding: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: inset 0 -1px 0 var(--evo-art-line); }
.evo-article-body details:first-of-type { box-shadow: inset 0 -1px 0 var(--evo-art-line), inset 0 1px 0 var(--evo-art-line); }
.evo-article-body details + :not(details) { margin-top: 2em; }
.evo-article-body summary {
	position: relative; display: block; list-style: none; cursor: pointer; padding: 20px 52px 20px 2px; -webkit-tap-highlight-color: transparent;
	font-family: var(--evo-art-sans) !important; font-weight: 500 !important; font-size: clamp(17px, 1.3vw, 19px) !important; line-height: 1.35 !important; color: var(--e-global-color-navy) !important;
}
.evo-article-body summary::-webkit-details-marker { display: none; }
.evo-article-body summary * { font: inherit !important; color: inherit !important; margin: 0 !important; display: inline; }
.evo-article-body summary::before { content: ""; position: absolute; right: 2px; top: 50%; width: 30px; height: 30px; margin-top: -15px; box-sizing: border-box; border-radius: 50%; border: 1.5px solid var(--e-global-color-navy); transition: background-color var(--evo-t-hover, 250ms) var(--evo-ease, ease); }
.evo-article-body summary::after { content: ""; position: absolute; right: 11.5px; top: 50%; width: 11px; height: 11px; margin-top: -5.5px; transition: transform var(--evo-t-section, 400ms) var(--evo-ease, ease);
	background: linear-gradient(var(--e-global-color-navy), var(--e-global-color-navy)) center / 100% 1.5px no-repeat, linear-gradient(var(--e-global-color-navy), var(--e-global-color-navy)) center / 1.5px 100% no-repeat; }
.evo-article-body details[open] > summary::before, .evo-article-body summary:hover::before { background: var(--e-global-color-navy); }
.evo-article-body details[open] > summary::after, .evo-article-body summary:hover::after { background: linear-gradient(#fff, #fff) center / 100% 1.5px no-repeat, linear-gradient(#fff, #fff) center / 1.5px 100% no-repeat; }
.evo-article-body details[open] > summary::after { transform: rotate(45deg); }
.evo-article-body summary:focus-visible { outline: 1.5px solid var(--e-global-color-navy); outline-offset: -2px; }
.evo-article-body details > :not(summary) { margin: 0 0 12px; padding: 0 60px 0 2px; font-size: 16.5px !important; line-height: 1.62 !important; }
.evo-article-body details > :last-child:not(summary) { padding-bottom: 22px; margin-bottom: 0; }

/* TABLES: row rules, not a grid of boxes; caps heads on a Cool Wash band; they scroll sideways on a phone instead of squeezing */
.evo-article-body table { display: block; width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; border-collapse: collapse; border: 0; margin: 2em 0; }
.evo-article-body table tbody, .evo-article-body table thead { width: 100%; }
.evo-article-body tr, .evo-article-body table tbody > tr:nth-child(odd) > td, .evo-article-body table tbody > tr:nth-child(odd) > th, .evo-article-body table tbody tr:hover > td, .evo-article-body table tbody tr:hover > th { background: transparent !important; }      /* no zebra from the theme */
.evo-article-body th, .evo-article-body td { border: 0 !important; box-shadow: inset 0 -1px 0 var(--evo-art-line); padding: 13px 16px 13px 0 !important; text-align: left; vertical-align: top; font-size: 15.5px !important; line-height: 1.5 !important; min-width: 120px; }
.evo-article-body th { background: transparent !important; box-shadow: inset 0 -1.5px 0 var(--e-global-color-navy); font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w, 600) !important; font-size: 10.5px !important; letter-spacing: .14em; text-transform: uppercase; color: var(--e-global-color-navy) !important; white-space: nowrap; }
.evo-article-body td:first-child { font-weight: 500 !important; color: var(--e-global-color-navy) !important; }

/* CALL-OUTS (class evo-callout, set by the clean-up on the writer's highlighted boxes) + recipe cards: a tone panel with the card corner */
.evo-article-body .evo-callout, .evo-article-body .evo-recipe, .evo-article-body .callout, .evo-article-body .note, .evo-article-body .disclaimer { margin: 2em 0; padding: 24px 28px; background: var(--e-global-color-band); border: 0; border-radius: 0 var(--evo-radius-card, 24px) 0 0; }
.evo-article-body .evo-callout > :last-child, .evo-article-body .evo-recipe > :last-child { margin-bottom: 0; }
.evo-article-body .evo-callout > :first-child, .evo-article-body .evo-recipe > :first-child { margin-top: 0 !important; }

/* small functional links */
.evo-article-body a.evo-backtop { display: inline-flex; align-items: center; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w, 600); font-size: 10px !important; letter-spacing: .16em; text-transform: uppercase; text-decoration: none; color: var(--e-global-color-slate) !important; }
.evo-article-body a.evo-backtop:hover { color: var(--e-global-color-navy) !important; }
.evo-article-body p:has(> a.evo-backtop:only-child) { margin: .2em 0 0; text-align: right; line-height: 1 !important; }
.evo-article-body a.evo-blog-btn { display: inline-flex; align-items: center; gap: 10px; margin: .2em 0 1em; padding: 0 0 5px; text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat;
	font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w, 600) !important; font-size: 12px !important; letter-spacing: .16em; text-transform: uppercase; line-height: 1.2 !important; }
.evo-article-body a.evo-blog-btn * { font: inherit !important; color: inherit !important; }
.evo-article-body a.evo-blog-btn::after { content: ""; 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; transition: transform var(--evo-t-hover, 250ms) var(--evo-ease, ease); }
.evo-article-body a.evo-blog-btn:hover::after { transform: translateX(5px); }

/* PRODUCT CARDS IN AN ARTICLE  [evo_products]: the homepage product card, in a rail a little wider than the reading column */
.evo-blog-products { --evo-best-per: 3; --evo-best-bleed: 0px; --evo-best-gap: 16px; width: min(var(--evo-breakout-width), 100vw - 48px); margin: 2.6em 0 2.6em calc(50% - min(var(--evo-breakout-width), 100vw - 48px) / 2); }
.evo-blog-products__title { margin: 0 0 16px !important; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w, 600) !important; font-size: 12.5px !important; letter-spacing: .16em; text-transform: uppercase; line-height: 1.4 !important; color: var(--e-global-color-navy) !important; }
.evo-blog-products .evo-best__rail { width: 100%; margin: -12px 0 0; padding: 12px 0 14px; scroll-padding-inline: 0; }
.evo-blog-products .evo-pcard { flex-basis: calc((100% - 2 * var(--evo-best-gap)) / 3); }
.evo-blog-products .evo-pcard, .evo-blog-products .evo-pcard * { text-decoration: none; }
.evo-blog-products .evo-best__nav { top: -46px; }
.evo-blog-products__links { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 6px 0 0 !important; }
.evo-article-body a.evo-blog-products__more { display: inline-block; padding-bottom: 4px; text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat; font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif !important; font-weight: var(--evo-caps-w, 600); font-size: 11.5px !important; letter-spacing: .16em; text-transform: uppercase; line-height: 1.2 !important; }
@media (max-width: 1024px) { .evo-blog-products .evo-pcard { flex-basis: calc((100% - var(--evo-best-gap)) / 2.2); } }
@media (max-width: 767px) { .evo-blog-products { width: 100%; margin-left: 0; --evo-best-gap: 12px; } .evo-blog-products .evo-pcard { flex-basis: 74%; } .evo-blog-products .evo-best__nav { display: none; } }

/* QUIZ BOX  [evo_quiz_cta]: one navy panel with the card corner; the writer's own line + the site's button (off-white on navy) */
.evo-blog-quiz { display: flex; align-items: center; justify-content: space-between; gap: 20px 36px; margin: 2.4em 0; padding: 28px 32px; background: var(--e-global-color-navy); border-radius: 0 var(--evo-radius-card, 24px) 0 0; }
.evo-blog-quiz__copy { min-width: 0; }
.evo-article-body .evo-blog-quiz__title { margin: 0 !important; font-family: var(--evo-art-sans) !important; font-weight: 600 !important; font-size: 19px !important; line-height: 1.3 !important; color: var(--e-global-color-white) !important; text-wrap: balance; }
.evo-article-body .evo-blog-quiz__text { margin: 6px 0 0 !important; font-size: 15.5px !important; line-height: 1.5 !important; color: var(--e-global-color-page) !important; }
.evo-article-body a.evo-blog-quiz__btn { flex: none; text-decoration: none !important; color: var(--e-global-color-navy) !important; }
.evo-article-body a.evo-blog-quiz__btn:hover, .evo-article-body a.evo-blog-quiz__btn:focus-visible { color: var(--e-global-color-page) !important; }
@media (max-width: 767px) { .evo-blog-quiz { flex-direction: column; align-items: stretch; padding: 24px 22px; } .evo-blog-quiz__btn { width: 100%; } .evo-article-body nav ul, .evo-article-body nav ol { columns: 1; } .evo-article-body nav { padding: 22px 22px 20px; } .evo-article-body, .evo-article-body p, .evo-article-body li { font-size: 17px !important; } .evo-article-body details > :not(summary) { padding-right: 8px; } }

/* ---- Author panel ([evo_post_author]) ------------------------------------- */
.evo-authorbox { display: flex; align-items: flex-start; gap: 20px; margin-top: 8px; padding: 28px 30px; background: var(--e-global-color-wash); border-radius: 0 var(--evo-radius-card, 24px) 0 0; }
.evo-authorbox__mark { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 50%; background: var(--e-global-color-navy); color: var(--e-global-color-white);
	font-family: var(--e-global-typography-h3-font-family), serif; font-style: italic; font-weight: 700; font-size: 20px; line-height: 1; }
.evo-authorbox p { margin: 0; }
.evo-authorbox__label { font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w, 600); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--e-global-color-slate); }
.evo-authorbox__name { margin-top: 5px !important; font-family: var(--evo-nav-sans, sans-serif); font-weight: 600; font-size: 19px; line-height: 1.25; color: var(--e-global-color-navy); }
.evo-authorbox__role { margin-top: 2px !important; font-family: var(--evo-nav-sans, sans-serif); font-weight: 400; font-size: 14.5px; color: var(--e-global-color-slate); }
.evo-authorbox__bio { margin-top: 10px !important; font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-size: 15.5px; line-height: 1.55; color: var(--e-global-color-charcoal); }
@media (max-width: 767px) { .evo-authorbox { padding: 22px; gap: 16px; } .evo-authorbox__mark { width: 46px; height: 46px; font-size: 17px; } }

/* ---- Sections under the article: "Mentioned in this article" (product carousel) and "Related articles" (article rail) ----
   Same build as the homepage Bestsellers: centred New Spirit heading, the rail runs on to the screen edge, arrows top right. */
.evo-postsec { overflow-x: clip; }
.evo-postsec .elementor-widget { margin: 0 !important; }
.evo-postsec__head { align-items: center; text-align: center; }
.evo-postsec__eyebrow .elementor-heading-title { margin: 0; font-size: 11.5px !important; letter-spacing: .16em !important; line-height: 1.4 !important; }
.evo-postsec__title .elementor-heading-title { margin: 0; text-align: center; font-size: clamp(30px, 2.9vw, 44px) !important; line-height: 1.12 !important; }
.evo-postsec .evo-best__nav { top: -62px; }
.evo-postsec__rail, .evo-postsec__rail .elementor-widget-container, .evo-postsec__rail .elementor-shortcode { width: 100%; }
/* the article card (one link): image with the card corner, caps category, New Spirit title, caps read time. Hover = the image eases in, nothing jumps */
.evo-artrail { --evo-best-per: 3.3; }
.evo-artcard { flex: 0 0 calc((100% - 3 * var(--evo-best-gap)) / var(--evo-best-per)); min-width: 0; scroll-snap-align: start; display: flex; flex-direction: column; gap: 16px; text-decoration: none !important; -webkit-tap-highlight-color: transparent; }
.evo-artcard__media { display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 0 var(--evo-radius-card, 24px) 0 0; background: var(--e-global-color-wash); line-height: 0; }
.evo-artcard .evo-artcard__img { display: block; width: 100%; height: 100% !important; max-width: none; object-fit: cover; border-radius: 0; transition: transform 600ms var(--evo-ease, ease); }
.evo-artcard__body { display: flex; flex-direction: column; gap: 8px; }
.evo-artcard__eyebrow, .evo-artcard__meta { font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w, 600); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; line-height: 1.3; color: var(--e-global-color-slate); }
.evo-artcard__title { font-family: var(--e-global-typography-h3-font-family), serif; font-style: italic; font-weight: 700; font-size: clamp(19px, 1.5vw, 23px); line-height: 1.18; letter-spacing: -.005em; color: var(--e-global-color-navy); text-wrap: balance; }
@media (hover: hover) { .evo-artcard:hover .evo-artcard__img { transform: scale(1.05); } }
.evo-artcard:focus-visible { outline: 1.5px solid var(--e-global-color-navy); outline-offset: 4px; }
@media (max-width: 1024px) { .evo-artrail { --evo-best-per: 2.3; } .evo-artcard { flex-basis: calc((100% - 2 * var(--evo-best-gap)) / var(--evo-best-per)); } }
@media (max-width: 767px) { .evo-artcard { flex-basis: 76%; } .evo-postsec .evo-best__nav { display: none; } }

@media (prefers-reduced-motion: reduce) {
	.evo-post-media .evo-post-img,
	.evo-blog-grid .e-loop-item > .elementor-element,
	.evo-related-grid .e-loop-item > .elementor-element { transition: none; }
}

/* PAGE TEMPLATES: moved to pages.css (2026-09-22 uplift). The video rules below are shared by posts and pages. */

/* ==========================================================================
   VIDEO  —  Elementor Video widget on pages; Video / YouTube embed blocks in posts
   ========================================================================== */
.evo-video .elementor-wrapper,
.evo-video .elementor-video,
.evo-video iframe,
.evo-video video { border-radius: 0 var(--evo-radius-card) 0 0; overflow: hidden; }
.evo-video-caption p { margin: 10px 0 0; }

.evo-article-body video,
.evo-article-body .wp-block-video video { display: block; width: 100%; height: auto; margin: 0; border-radius: 0 var(--evo-radius-card) 0 0; }
.evo-article-body .wp-block-video,
.evo-article-body .wp-block-embed,
.evo-article-body .wp-video { margin: 2em 0; width: 100% !important; max-width: 100%; }
.evo-article-body .wp-block-embed__wrapper { position: relative; aspect-ratio: 16 / 9; border-radius: 0 var(--evo-radius-card) 0 0; overflow: hidden; }
.evo-article-body .wp-block-embed__wrapper iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.evo-article-body > iframe,
.evo-article-body p > iframe,
.evo-article-body iframe[src*="youtube"],
.evo-article-body iframe[src*="vimeo"] { display: block; width: 100%; max-width: 100%; aspect-ratio: 16 / 9; height: auto; border: 0; margin: 2em 0; border-radius: 0 var(--evo-radius-card) 0 0; }
.evo-article-body .wp-block-embed.alignwide .wp-block-embed__wrapper { border-radius: 0 var(--evo-radius-card) 0 0; }

/* ==========================================================================
   PDP LAYER 1 — two-column shell + sticky buy box (template "Evopure — Single Product (Oils)")
   The buy column uses native CSS position:sticky (smooth, no JS jitter). It pins below the
   sticky header while the taller gallery column scrolls, and releases automatically when the
   two-column row ends — the same pin/release feel as the Shopify theme. Off below 1025px.
   --evo-header-h is set from the real header height by pdp.js (fallback 76px).
   ========================================================================== */
:root { --evo-header-h: 76px; }
.evo-pdp-hero > .e-con-inner { align-items: flex-start; }
@media (min-width: 1025px) {
	.evo-pdp-buy {
		position: sticky;
		top: calc(var(--evo-header-h) + 24px);
		align-self: flex-start;
	}
	.evo-pdp-gallery { align-self: flex-start; }
}
.evo-pdp-note p { margin: 0 0 4px; }
.evo-pdp-gallery .woocommerce-product-gallery__image img { border-radius: 0 var(--evo-radius-card) 0 0; }
.evo-pdp-gallery .flex-control-thumbs li img { border-radius: 0; }

/* Buy-box styling lives in pdp.css (Layer 2+). */

/* Below-fold placeholders */
.evo-pdp-section { border-top: 1px solid var(--e-global-color-wash); }
.evo-pdp-section h2 { margin: 0; }

/* "In this guide" (blog.js builds it from an anchor-link contents list): vertical clickable pills. Each pill = the solo-button grammar at small scale:
   1px navy outline, hover fills navy with the signature corner; the section you are reading is marked with the same fill. DM Sans 300 titles. */
.evo-article-body .evo-guide { margin: 8px 0 2em; padding: 22px 22px 18px; background: var(--evo-page); border-radius: 0 var(--evo-radius-card) 0 0; }
.evo-article-body nav.evo-guide p.evo-guide__title { margin: 0 0 14px !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; text-transform: uppercase; color: var(--evo-navy) !important; line-height: 1.2 !important; }
.evo-article-body ol.evo-guide__list { list-style: none; display: grid; gap: 8px; margin: 0 !important; padding: 0 !important; }
.evo-article-body .evo-guide__list li { margin: 0 !important; padding: 0 !important; }
.evo-article-body .evo-guide__list li::before, .evo-article-body .evo-guide__list li::marker { content: none; }
.evo-article-body a.evo-guide__pill { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 12px 16px; background: var(--evo-white); border: 1px solid color-mix(in srgb, var(--evo-navy) 16%, transparent); color: var(--evo-navy) !important; text-decoration: none !important; font-family: var(--e-global-typography-body-font-family), sans-serif; font-weight: 300; font-size: 15.5px; line-height: 1.35; 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), border-radius var(--evo-t-hover) var(--evo-ease); }
.evo-guide__n { font-family: var(--e-global-typography-subheadcaps-font-family), sans-serif; font-weight: var(--evo-caps-w); font-size: 10.5px; letter-spacing: .12em; opacity: .55; }
.evo-guide__pill svg { opacity: .6; transition: transform var(--evo-t-hover) var(--evo-ease); }
.evo-article-body a.evo-guide__pill:is(:hover, :focus-visible, .is-on) { background: var(--evo-navy); border-color: var(--evo-navy); color: var(--evo-white) !important; border-radius: 0 var(--evo-radius-sig) 0 0; outline: 0; }
.evo-guide__pill:hover svg { transform: translateY(2px); opacity: 1; }
@media (max-width: 767px) { .evo-article-body .evo-guide { padding: 18px 16px 14px; } .evo-article-body a.evo-guide__pill { padding: 12px 14px; font-size: 15px; } }