/* Chaé 2026 — brand styles.
   Tokens match the live chaeorganics.com brand: Comfortaa (headings), Roboto (body), teal #006263,
   white panels with a 28px radius. Buttons: the one main action on a screen is solid teal with a small (2px) hard
   offset edge in deep teal that presses flat on hover — the live brand's press, quieter (owner's pick 2026-10-14:
   no grey edge, no gradient); other buttons are a quiet teal outline, minor ones a text link (.chae-btn--text).
   Chaé Blue (#008EAF, from the brand guide) is the supporting color: labels, savings badges, icons, checkmarks,
   accent bars and tinted backgrounds. Teal stays the color of everything you can click. */

/* Until Comfortaa and Roboto arrive from Google Fonts, text shows in Arial sized to match them (widths measured over
   sample text, ascent/descent from the fonts), so the swap doesn't resize it: nothing moves, and the headline counts as
   painted when it first shows (Comfortaa is ~15% wider than Arial or Trebuchet MS, so the home headline used to be
   repainted larger, late). Separate faces for bold, as Arial Bold is wider than the web fonts' bold. */
@font-face { font-family: "Comfortaa Fallback"; src: local("Arial"), local("ArialMT"), local("Arimo"); font-weight: 100 500; size-adjust: 114.88%; ascent-override: 76.6%; descent-override: 20.02%; line-gap-override: 0%; }
@font-face { font-family: "Comfortaa Fallback"; src: local("Arial Bold"), local("Arial-BoldMT"), local("Arimo Bold"); font-weight: 600 900; size-adjust: 107.58%; ascent-override: 81.8%; descent-override: 21.38%; line-gap-override: 0%; }
@font-face { font-family: "Roboto Fallback"; src: local("Arial"), local("ArialMT"), local("Arimo"); font-weight: 100 500; size-adjust: 98.93%; ascent-override: 94.01%; descent-override: 24.26%; line-gap-override: 0%; }
@font-face { font-family: "Roboto Fallback"; src: local("Arial Bold"), local("Arial-BoldMT"), local("Arimo Bold"); font-weight: 600 900; size-adjust: 93.89%; ascent-override: 99.05%; descent-override: 25.56%; line-gap-override: 0%; }
:root {
	--teal: #006263;
	--teal-press: #00393a;
	--teal-bar: #2c6c6b;
	--teal-08: rgba(0, 98, 99, 0.08);
	--blue: #008eaf; /* Chaé Blue */
	--blue-deep: #00708a; /* a deeper tone of Chaé Blue for small text and badges (readable contrast on white) */
	--blue-08: rgba(0, 142, 175, 0.1);
	--grey: #767676; /* Chaé grey ("Clear Highlight" in the brand guide) */
	--btn-edge: var(--teal-press); /* the 3px edge under main-action buttons, straight down like a key (2026-10-15; was 2px down-right, "looks off") */
	--btn-fill: var(--teal); /* main-action buttons: solid teal (a teal→blue gradient was tried 2026-10-14: too busy) */
	--ink: #1e1e1e;
	--text: #333333;
	--muted: #4d5a5c;
	--muted-2: #5d6764;
	--line: #e3e9e7;
	--line-2: #d5dedc;
	--tint: #f4f8f8;
	--edge: max(24px, calc((100% - 1200px) / 2)); /* full-width sections' padding to line up with .chae-wrap's content (a padding % is of the parent's width) */
	--bg: #f2f3f3;
	--panel-border: rgba(0, 98, 99, 0.11);
	--panel-bg: linear-gradient(135deg, rgba(255, 255, 255, 0.97) 0%, rgba(244, 250, 249, 0.97) 100%);
	--shadow: 0 18px 44px rgba(26, 36, 33, 0.06);
	--shadow-sm: 0 6px 18px rgba(26, 36, 33, 0.04);
	--head: Comfortaa, "Comfortaa Fallback", "Trebuchet MS", sans-serif;
	--body: Roboto, "Roboto Fallback", "Helvetica Neue", Helvetica, Arial, sans-serif;
	--r-panel: 28px;
	--r-card: 20px;
	--r-btn: 10px;
}

/* ---------- base ---------- */
body.chae {
	margin: 0;
	background: #fff; /* an open white page (2026-10-14; was grey with teal glows) */
	color: var(--text);
	font-family: var(--body);
	font-size: 16px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}
.chae *, .chae *::before, .chae *::after { box-sizing: border-box; }
.chae img { max-width: 100%; height: auto; }
.chae a { color: var(--teal); text-decoration: none; }
.chae a:hover { color: #004a4b; }
.chae h1, .chae h2, .chae h3, .chae h4 { font-family: var(--head); font-weight: 500; color: var(--ink); line-height: 1.2; }
.chae :focus-visible { outline: 3px solid rgba(0, 98, 99, 0.45); outline-offset: 2px; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.chae-skip { position: absolute; left: 12px; top: -60px; z-index: 1000; padding: 10px 16px; background: #fff; border-radius: 8px; font-weight: 700; }
.chae-skip:focus { top: 12px; }

.chae-wrap { width: 100%; max-width: 1248px; margin: 0 auto; padding: 0 24px; }
.chae-center { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 16px 28px; text-align: center; }
.chae-main { padding-bottom: 8px; }

/* WooCommerce's image lightbox markup stays hidden until its own stylesheet (loaded in the background) has arrived. */
.pswp:not(.pswp--open) { display: none; }
/* ---------- shared pieces ---------- */
/* .chae-panel marks a page section. Sections sit open on the white page, with no box, border or shadow (2026-10-14:
   the quieter look, "do all of it"); a few keep a tinted box of their own (search and tracking heroes, etc.). */
.chae-section { padding: 64px 0; display: flex; flex-direction: column; gap: 40px; }

.chae-eyebrow { font-size: 12px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--blue-deep); }
.chae-eyebrow--light { color: #bfe3e2; }
.chae-pill { align-self: flex-start; display: inline-block; padding: 7px 14px; border-radius: 999px; background: var(--blue-08); color: var(--blue-deep); font-size: 13px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; line-height: 1.3; }
.chae-pill--white { background: rgba(255, 255, 255, 0.8); }

.chae-head { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.chae-head__title { margin: 0; font-size: 40px; }
.chae-head__text { margin: 0; max-width: 560px; color: var(--muted); }
.chae-head__bar { width: 56px; height: 3px; margin-top: 4px; border-radius: 2px; background: linear-gradient(90deg, var(--teal), var(--blue)); }

/* Secondary (the default): teal outline, no shadow, no movement. */
.chae-btn, body.chae .chae-btn,
.chae .woocommerce a.button, .chae .woocommerce button.button, .chae .woocommerce input.button,
.chae .woocommerce #respond input#submit, body.chae a.button, body.chae button.button {
	display: inline-flex !important; align-items: center; justify-content: center; gap: 8px;
	min-height: 46px; padding: 0 24px !important; line-height: 1.2 !important; border: 1.5px solid var(--teal); border-radius: var(--r-btn);
	background: #fff; color: var(--teal); box-shadow: none;
	font-family: var(--body); font-size: 15px; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none;
	cursor: pointer; transition: background-color 0.15s ease, transform 0.12s ease, box-shadow 0.12s ease;
}
.chae-btn:hover,
.chae .woocommerce a.button:hover, .chae .woocommerce button.button:hover, .chae .woocommerce input.button:hover,
.chae .woocommerce #respond input#submit:hover, .chae a.button:hover, .chae button.button:hover {
	transform: none; box-shadow: none; border-color: var(--teal); background: var(--teal); color: #fff;
}
/* It fills teal, like the product cards' buttons do. body.chae .chae-btn above outranked .chae-btn:hover, so the plain
   outline buttons never changed at all (2026-10-15, user: "these buttons need a hover effect"); :where() keeps this at
   the base rule's weight, so the variants' own hovers (white buttons on teal bands) still win. */
body.chae .chae-btn:where(:not(.chae-btn--fill, .chae-btn--text)):hover { border-color: var(--teal); background: var(--teal); color: #fff; }
/* Primary: teal fill with a dark-teal edge underneath; it presses down on hover. The press is !important like the rest:
   `.chae a.button:hover` above (transform: none) outranks these, so a link-style button lost its edge on hover without
   moving down (2026-10-19, user: the home sale card's "Add to cart" hover "is wrong"). Disabled buttons don't press. */
.chae-btn--fill,
.chae .woocommerce button.button.alt, .chae .woocommerce a.button.alt, .chae .woocommerce input.button.alt,
.chae .single_add_to_cart_button, .chae .checkout-button, .chae #place_order {
	border-color: transparent !important; background: var(--btn-fill) border-box !important; color: #fff !important; box-shadow: 0 3px 0 var(--btn-edge) !important;
}
.chae-btn--fill:not(:disabled, .disabled):hover,
.chae .woocommerce button.button.alt:not(:disabled, .disabled):hover, .chae .woocommerce a.button.alt:not(.disabled):hover,
.chae .single_add_to_cart_button:not(:disabled, .disabled):hover, .chae .checkout-button:not(.disabled):hover, .chae #place_order:not(:disabled, .disabled):hover {
	transform: translate(0, 3px) !important; box-shadow: 0 0 0 var(--btn-edge) !important; background: var(--btn-fill) border-box !important; color: #fff !important;
}
.chae-btn--fill:not(:disabled, .disabled):active, .chae .single_add_to_cart_button:not(:disabled, .disabled):active, .chae .checkout-button:not(.disabled):active, .chae #place_order:not(:disabled, .disabled):active {
	transform: translate(0, 3px) !important; box-shadow: 0 0 0 var(--btn-edge) !important;
}
/* Text link, for minor actions next to a primary button. */
body.chae .chae-btn--text { min-height: 0; padding: 4px 0 !important; border: 0; border-radius: 0; background: none; color: var(--teal); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 5px; }
/* The arrow sits just outside the link, out of the flow, so the underline stops at the words (2026-10-16, user: "i dont
   like how these arrows are underlined too"; as a flex item it took the underline whatever its own text-decoration). */
body.chae .chae-btn--text { position: relative; margin-right: 1.35em; }
body.chae .chae-btn--text::after { content: "\2192"; position: absolute; top: 50%; left: calc(100% + 0.35em); transform: translateY(-50%); transition: transform 0.15s ease; }
body.chae .chae-btn--text:hover { background: none; color: var(--teal-press); }
body.chae .chae-btn--text:hover::after { transform: translate(3px, -50%); }
/* Unavailable (e.g. no option chosen yet). */
.chae .button.disabled, .chae .button:disabled, .chae .chae-btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none !important; box-shadow: none !important; }
.chae .button.loading { opacity: 0.7; }
.chae .added_to_cart { display: block; margin-top: 10px; font-size: 14px; font-weight: 700; }
.chae-link { font-weight: 700; text-decoration: underline !important; text-underline-offset: 4px; }
/* Its arrow, the same as the text links' (was typed into each link's words, underline and all): an inline block, which a
   link's underline doesn't reach. */
.chae-link::after { content: "\2192"; display: inline-block; margin-left: 0.35em; transition: transform 0.15s ease; }
.chae-link:hover::after { transform: translateX(3px); }

.chae-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; }
.chae-actions--center { justify-content: center; }
.chae-checks { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; font-weight: 700; color: var(--ink); }
.chae-checks li { display: flex; align-items: flex-start; gap: 12px; }
.chae-checks .chae-icon { flex-shrink: 0; color: var(--blue); stroke-width: 2.6; margin-top: 2px; }
.chae-stars { display: inline-flex; gap: 2px; color: var(--teal); }
.chae-round { width: 46px; height: 46px; flex-shrink: 0; border-radius: 50%; background: var(--blue-08); color: var(--blue-deep); display: inline-flex; align-items: center; justify-content: center; }

.chae-divider { display: flex; align-items: center; gap: 20px; max-width: 880px; margin: 0 auto; padding: 18px 24px; }
.chae-divider__line { flex: 1; height: 1px; background: linear-gradient(90deg, rgba(0, 98, 99, 0) 0%, rgba(0, 98, 99, 0.35) 100%); }
.chae-divider__line:last-child { background: linear-gradient(90deg, rgba(0, 98, 99, 0.35) 0%, rgba(0, 98, 99, 0) 100%); }
.chae-divider__badge { width: 60px; height: 60px; border-radius: 50%; background: #fff; box-shadow: 0 6px 16px rgba(26, 36, 33, 0.1); color: var(--teal); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.chae-divider__badge img { width: 46px; }

.chae-tile { transition: transform 0.2s ease, box-shadow 0.2s ease; }
.chae-tile:hover { transform: translateY(-3px); box-shadow: 0 16px 34px rgba(26, 36, 33, 0.1); }

/* ---------- top bar / header / nav ---------- */
.chae-topbar { background: var(--teal-bar); color: #fff; font-size: 13px; font-weight: 500; }
.chae-topbar__inner { min-height: 40px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.chae-topbar__note { display: flex; align-items: center; gap: 10px; }
.chae-topbar__nav { display: flex; align-items: center; gap: 26px; }
.chae-topbar__menu { margin: 0; padding: 0; list-style: none; display: flex; gap: 26px; }
.chae-topbar a { color: #fff; }
.chae-topbar a:hover { color: #d7ecec; }
.chae-topbar__account { display: flex; align-items: center; gap: 8px; padding-left: 26px; border-left: 1px solid rgba(255, 255, 255, 0.35); }
.chae-topbar__offers { position: relative; flex: 1; min-width: 0; height: 40px; margin: 0; padding: 0; list-style: none; } /* one offer at a time (assets/js/chae.js) */
.chae-topbar__offer { position: absolute; inset: 0; display: flex; align-items: center; gap: 10px; min-width: 0; opacity: 0; transform: translateY(8px); transition: opacity 0.45s ease, transform 0.45s ease; pointer-events: none; }
.chae-topbar__offer.is-on { opacity: 1; transform: none; pointer-events: auto; }
.chae-topbar__offer span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.chae-topbar__offer .chae-icon { flex: none; }

.chae-header { background: #fff; }
.chae-header__inner { min-height: 84px; display: grid; grid-template-columns: 220px minmax(0, 1fr) 220px; align-items: center; gap: 32px; }
.chae-logo img, .chae-header .custom-logo { display: block; width: auto; height: 52px; }
.chae-header__search { justify-self: center; width: 100%; max-width: 520px; }
.chae-search { height: 46px; padding: 0 18px 0 6px; border-radius: 999px; background: #f3f4f4; border: 1px solid #e2e6e5; display: flex; align-items: center; gap: 12px; }
.chae-search__icon { width: 34px; height: 34px; flex-shrink: 0; border-radius: 50%; background: var(--teal); color: #fff; display: flex; align-items: center; justify-content: center; }
.chae-search input[type="search"] { flex: 1; min-width: 0; height: 40px; border: 0; background: transparent; font: inherit; font-size: 15px; color: var(--ink); outline: none; }
.chae-search.is-suggesting { border-color: var(--teal); background: #fff; box-shadow: 0 0 0 3px var(--teal-08); }

/* live search suggestions (assets/js/search.js) */
.chae-search, .chae-ing-search { position: relative; }
.chae-suggest { position: absolute; z-index: 60; top: calc(100% + 10px); left: 50%; transform: translateX(-50%); width: min(640px, calc(100vw - 32px)); max-height: min(72vh, 640px); overflow-y: auto; overscroll-behavior: contain; padding: 14px; border: 1px solid var(--panel-border); border-radius: 22px; background: #fff; box-shadow: 0 28px 60px rgba(26, 36, 33, 0.18); text-align: left; }
.chae-suggest[hidden] { display: none; }
.chae-ing-search .chae-suggest { left: 0; transform: none; width: 100%; min-width: min(420px, calc(100vw - 32px)); }
.chae-suggest__group + .chae-suggest__group, .chae-suggest__empty + .chae-suggest__group { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.chae-suggest__label { margin: 0 6px 8px; color: var(--muted-2); font-size: 11.5px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.chae-suggest__chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 6px; }
.chae .chae-suggest__chip { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 0 14px; border: 1px solid rgba(0, 98, 99, 0.18); border-radius: 999px; background: var(--tint); color: var(--ink); font-size: 14px; font-weight: 500; }
.chae-suggest__chip span { color: var(--muted-2); font-size: 12.5px; }
.chae .chae-suggest__product { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 8px; border-radius: 14px; color: var(--ink); }
.chae-suggest__product img { width: 52px; height: 52px; object-fit: cover; border-radius: 10px; background: var(--tint); }
.chae-suggest__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.chae-suggest__name { font-size: 15px; font-weight: 600; line-height: 1.3; }
.chae-suggest mark { background: none; color: var(--teal); font-weight: 800; }
.chae-suggest__sub { overflow: hidden; color: var(--muted-2); font-size: 13px; white-space: nowrap; text-overflow: ellipsis; }
.chae-suggest__price { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; font-size: 14.5px; font-weight: 700; white-space: nowrap; }
.chae-suggest__price del { color: var(--muted-2); font-size: 12.5px; font-weight: 400; }
.chae-suggest__price ins { text-decoration: none; }
.chae-suggest__off { padding: 1px 8px; border-radius: 999px; background: var(--blue-deep); color: #fff; font-size: 11.5px; }
.chae-suggest__stock { color: #b3261e; font-size: 12px; font-weight: 600; }
.chae .chae-suggest__post { display: block; padding: 8px 10px; border-radius: 12px; color: var(--ink); font-size: 14.5px; }
.chae .chae-suggest__all { display: block; margin-top: 12px; padding: 12px; border-radius: 14px; background: var(--teal); color: #fff; font-weight: 700; text-align: center; }
.chae-suggest__empty { padding: 8px 6px 4px; }
.chae-suggest__empty p { margin: 0 0 8px; color: var(--muted); }
.chae-suggest__empty strong { color: var(--ink); }
.chae-suggest__empty .chae-suggest__chips { padding: 0; }
.chae .chae-suggest [role="option"]:hover, .chae .chae-suggest [role="option"].is-active { background: var(--teal-08); color: var(--ink); }
.chae .chae-suggest .chae-suggest__all:hover, .chae .chae-suggest .chae-suggest__all.is-active { background: var(--teal-press); color: #fff; }
.chae .chae-suggest .chae-suggest__chip:hover, .chae .chae-suggest .chae-suggest__chip.is-active { border-color: var(--teal); }
.chae-header__actions { justify-self: end; display: flex; align-items: center; gap: 18px; }
.chae-cart { display: flex; align-items: center; gap: 12px; color: var(--ink) !important; font-size: 15px; font-weight: 500; }
.chae-cart__icon { position: relative; display: flex; }
.chae-cart__count { position: absolute; top: -6px; right: -8px; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 10px; background: var(--teal); color: #fff; font-size: 11px; font-weight: 700; line-height: 19px; text-align: center; }
.chae-menu-toggle { display: none; width: 44px; height: 44px; border: 0; border-radius: 10px; background: var(--tint); color: var(--ink); align-items: center; justify-content: center; }
.chae-menu-toggle__close, .chae-nav__label, .chae-nav__more { display: none; } /* phones only */

.chae-nav { position: relative; z-index: 40; background: #fff; border-top: 1px solid #eef0ef; border-bottom: 1px solid #e6e9e8; box-shadow: 0 6px 16px rgba(26, 36, 33, 0.04); }
.chae-nav__list { margin: 0 auto; padding: 0; list-style: none; display: flex; justify-content: center; }
.chae-nav__item { display: flex; align-items: stretch; border-left: 1px solid #eceeed; }
.chae-nav__item:last-child { border-right: 1px solid #eceeed; }
.chae-nav__link { display: flex; align-items: center; min-height: 50px; padding: 0 20px; color: #111; font-size: 15px; font-weight: 500; white-space: nowrap; }
.chae-nav__item.is-current .chae-nav__link, .chae-nav__item.is-sale .chae-nav__link { color: var(--teal); font-weight: 700; }
.chae-nav__item:hover .chae-nav__link { color: var(--teal); }
.chae-nav__item.is-current, .chae-nav__item:hover { box-shadow: inset 0 -3px 0 var(--teal); }


/* ---------- home ---------- */
.chae-hero-wrap { padding-top: 36px; }
.chae-hero { display: grid; grid-template-columns: minmax(0, 1fr) 560px; gap: 48px; align-items: center; padding: 48px 48px 48px 64px; }
.chae-hero__text { display: flex; flex-direction: column; gap: 22px; }
.chae-hero__title { margin: 0; font-size: 52px; line-height: 1.1; letter-spacing: -0.01em; }
.chae-hero__title span { color: var(--teal); background: linear-gradient(90deg, var(--teal), var(--blue)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.chae-hero__lead { margin: 0; max-width: 520px; font-size: 17.5px; line-height: 1.65; }
.chae-hero__proof { margin: 0; display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--muted-2); }
.chae-hero__proof strong { color: var(--ink); }
.chae-hero__media { position: relative; height: 504px; border-radius: 22px; overflow: hidden; background: #e9f2f2; }
.chae-hero__media > img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; display: block; }
.chae-feature { position: absolute; left: 20px; bottom: 20px; right: 20px; max-width: 380px; padding: 12px 16px 12px 12px; border-radius: 16px; background: #fff; border: 1px solid rgba(0, 98, 99, 0.12); box-shadow: 0 12px 28px rgba(26, 36, 33, 0.12); display: flex; align-items: center; gap: 12px; color: var(--ink) !important; }
.chae-feature__thumb { width: 52px; height: 52px; flex-shrink: 0; border-radius: 12px; overflow: hidden; background: #eef6f6; }
.chae-feature__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.chae-feature__text { display: flex; flex-direction: column; gap: 2px; }
.chae-feature__label { font-size: 11px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--blue-deep); }
.chae-feature__name { font-family: var(--head); font-size: 15px; font-weight: 700; }
.chae-feature__price { font-size: 13px; font-weight: 700; color: var(--teal); }
.chae-feature__price del { color: var(--muted-2); font-weight: 400; }
/* home hero (front-page.php): full width and tall — a title whose last word cycles, a big photo collage running off
   the right edge with slowly drifting photos, and a moving strip of reasons to trust us along the bottom */
.chae-hx { position: relative; overflow: hidden; background: #fff; }
.chae-hx__inner { display: grid; grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr); align-items: center; gap: 56px; padding: 44px 0 44px max(24px, calc((100% - 1200px) / 2)); }
.chae-hx__text { display: flex; flex-direction: column; align-items: flex-start; gap: 26px; }
.chae .chae-hx__title { margin: 0; color: var(--ink); font-size: clamp(44px, 5.2vw, 76px); line-height: 1.04; letter-spacing: -0.015em; }
.chae-rotate { display: inline-grid; }
.chae-rotate__word { grid-area: 1 / 1; padding-bottom: 0.06em; background: linear-gradient(90deg, var(--teal), var(--blue)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; opacity: 0; transform: translateY(0.35em); animation: chae-rotate 12.5s infinite; animation-delay: calc(var(--i) * 2.5s); }
@keyframes chae-rotate { 0% { opacity: 0; transform: translateY(0.35em); } 3%, 17% { opacity: 1; transform: none; } 20%, 100% { opacity: 0; transform: translateY(-0.35em); } }
.chae-hx__lead { max-width: 500px; margin: 0; color: var(--text); font-size: 19px; line-height: 1.6; }
.chae-hx__without { display: flex; align-items: flex-start; gap: 9px; max-width: 500px; margin: -10px 0 0; /* reads with the lead above it (the column's gap is 24px) */ color: var(--text); font-size: 15px; line-height: 1.5; }
.chae-hx__without .chae-icon { flex: none; margin-top: 2px; color: var(--teal); }
.chae-hx__without strong { color: var(--ink); }
body.chae .chae-btn--lg { min-height: 58px; padding: 0 32px !important; font-size: 17px; }
.chae .chae-hero__seals { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: var(--muted); font-size: 13.5px; }
.chae-hero__seals img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; box-shadow: 0 4px 10px rgba(26, 36, 33, 0.12); }
.chae-hero__seals span { margin-left: 6px; }
.chae .chae-hero__seals:hover span { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
.chae-collage { position: relative; display: grid; grid-template-columns: 1.25fr 1fr 1fr; grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 14px; height: clamp(540px, calc(100vh - 250px), 690px); }
.chae-collage__tile { position: relative; display: block; overflow: hidden; border-radius: 24px; background: #e8eeed; animation: chae-tile-in 0.8s cubic-bezier(0.2, 0.7, 0.2, 1) both; animation-delay: calc(var(--n) * 90ms + 80ms); }
.chae-collage__tile--big { grid-row: span 2; }
.chae-collage a:nth-of-type(3), .chae-collage a:nth-of-type(5) { border-top-right-radius: 0; border-bottom-right-radius: 0; } /* run off the right edge */
.chae-collage__tile img { display: block; width: 100%; height: 100%; object-fit: cover; animation: chae-drift 22s ease-in-out infinite alternate; animation-delay: calc(var(--n) * -5s); }
@keyframes chae-tile-in { from { opacity: 0; transform: translateY(22px) scale(0.98); } to { opacity: 1; transform: none; } }
@keyframes chae-drift { from { transform: scale(1.03); } to { transform: scale(1.12) translate(-1.5%, -1.5%); } }
.chae-collage__label { position: absolute; bottom: 14px; left: 14px; display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 999px; background: rgba(255, 255, 255, 0.95); color: var(--teal); font-size: 15px; font-weight: 700; box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12); transition: background 0.2s ease, color 0.2s ease; }
.chae-collage__label .chae-icon { stroke-width: 2.6; }
.chae-collage__tile:hover .chae-collage__label { background: var(--teal); color: #fff; }
.chae-collage__tile--big .chae-collage__label { right: 14px; left: auto; }
.chae-collage__badge { position: absolute; top: 28px; left: -30px; z-index: 2; display: flex; align-items: center; gap: 12px; padding: 12px 18px 12px 12px; border-radius: 18px; background: #fff; box-shadow: 0 18px 40px rgba(26, 36, 33, 0.16); color: var(--muted); font-size: 13px; pointer-events: none; animation: chae-float 6s ease-in-out infinite; }
.chae-collage__badge img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.chae-collage__badge strong { display: block; color: var(--ink); font-family: var(--head); font-size: 16px; font-weight: 600; }
.chae-collage__rating { position: absolute; bottom: 36px; left: -30px; z-index: 2; padding: 14px 20px; border-radius: 18px; background: var(--teal); box-shadow: 0 18px 40px rgba(26, 36, 33, 0.2); color: #fff; font-size: 13px; text-align: center; pointer-events: none; animation: chae-float 7s ease-in-out infinite; animation-delay: -3s; }
.chae-collage__rating strong { display: block; font-family: var(--head); font-size: 28px; font-weight: 600; line-height: 1.1; }
@keyframes chae-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
.chae-ticker { overflow: hidden; background: var(--teal); color: #fff; }
.chae-ticker__track { display: flex; width: max-content; animation: chae-ticker 42s linear infinite; }
.chae-ticker:hover .chae-ticker__track { animation-play-state: paused; }
.chae-ticker__list { display: flex; flex-shrink: 0; gap: 48px; margin: 0; padding: 15px 48px 15px 0; list-style: none; }
.chae-ticker__list li { display: inline-flex; align-items: center; gap: 14px; font-size: 15px; font-weight: 700; white-space: nowrap; }
.chae-ticker__list li::before { content: "✦"; color: #8fdcec; }
@keyframes chae-ticker { to { transform: translateX(-50%); } }
@media (max-width: 1180px) {
	.chae-hx__inner { gap: 40px; }
	.chae-collage { gap: 12px; }
}
@media (max-width: 960px) {
	.chae-hx__inner { grid-template-columns: minmax(0, 1fr); gap: 36px; padding: 40px 24px 32px; }
	.chae-collage { grid-template-columns: 1.2fr 1fr 1fr; height: 460px; }
	.chae-collage a:nth-of-type(n) { border-radius: 22px; }
	.chae-collage__badge { top: -16px; left: 12px; }
	.chae-collage__rating { bottom: auto; top: -16px; left: auto; right: 12px; }
}
@media (max-width: 560px) {
	.chae-hx__inner { padding: 28px 16px 24px; gap: 30px; }
	.chae .chae-hx__title { font-size: 42px; }
	.chae-hx__lead { font-size: 17px; }
	.chae-collage { grid-template-columns: 1fr 1fr; grid-template-rows: 250px 150px 150px; height: auto; gap: 10px; }
	.chae-collage__tile--big { grid-column: span 2; grid-row: auto; }
	.chae-collage__label { bottom: 10px; left: 10px; padding: 6px 12px; font-size: 13.5px; }
	.chae-collage__badge { top: -14px; left: 8px; padding: 6px; border-radius: 50%; }
	.chae-collage__badge img { width: 42px; height: 42px; }
	.chae-collage__badge > span { display: none; } /* just the seal: the row of seals above says it in words */
	.chae-collage__rating { top: -14px; right: 8px; padding: 8px 14px; }
	.chae-collage__rating strong { font-size: 20px; }
	.chae-ticker__list li { font-size: 13.5px; }
}
@media (prefers-reduced-motion: reduce) {
	.chae-rotate__word, .chae-collage__tile, .chae-collage__tile img, .chae-collage__badge, .chae-collage__rating, .chae-ticker__track { animation: none; }
	.chae-rotate__word:first-child { opacity: 1; transform: none; }
}

.chae-strip { margin-top: 24px; padding: 18px 24px; border-radius: 22px; background: #fff; border: 1px solid var(--panel-border); box-shadow: 0 12px 30px rgba(26, 36, 33, 0.05); }

/* the home page's sale as a photo feature (front-page.php): the scene photo, then the offer, name, line, price */
.chae-spot { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 64px; align-items: center; padding: 32px 0 24px; }
.chae-spot__img { display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 20px; background: var(--tint); }
.chae .chae-spot__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.chae-spot__text { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; max-width: 460px; }
.chae .chae-spot__title { margin: 0; color: var(--ink); font-family: var(--head); font-size: 40px; font-weight: 500; line-height: 1.15; }
.chae-spot__line { margin: 0; color: var(--muted); font-size: 17px; line-height: 1.6; }
.chae-spot__price { display: flex; align-items: baseline; gap: 10px; margin: 0; color: var(--ink); font-size: 22px; }
.chae-spot__price s { color: var(--muted-2); font-size: 16px; }
.chae-spot__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 6px; }
@media (max-width: 782px) {
	.chae-spot { grid-template-columns: minmax(0, 1fr); gap: 24px; padding: 8px 0; }
	.chae .chae-spot__title { font-size: 30px; }
}


.chae-diff { display: grid; grid-template-columns: 400px minmax(0, 1fr); gap: 28px; }
.chae-diff__photo { position: relative; margin: 0; min-height: 408px; border-radius: 20px; overflow: hidden; }
.chae-diff__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.chae-diff__photo figcaption { position: absolute; left: 16px; right: 16px; bottom: 16px; padding: 12px 16px; border-radius: 14px; background: rgba(255, 255, 255, 0.94); display: flex; flex-direction: column; gap: 2px; font-size: 14px; color: var(--ink); }
.chae-diff__photo figcaption strong { font-size: 11px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--blue-deep); }
.chae-diff__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
/* The factory loop in that photo's place (front-page.php, [data-chae-loop] in chae.js), with a pause/play button. */
.chae-loop video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; background: #e8ebea; }
.chae-loop__toggle { position: absolute; top: 14px; right: 14px; z-index: 2; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.94); color: var(--teal); box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18); cursor: pointer; }
.chae-loop__toggle > span { display: flex; }
.chae-loop__play, .chae-loop.is-paused .chae-loop__pause { display: none !important; }
.chae-loop.is-paused .chae-loop__play { display: flex !important; }
.chae-diff__card { padding: 20px 22px; border-radius: 16px; background: #fff; border: 1px solid var(--line); display: flex; align-items: flex-start; gap: 16px; font-size: 14px; line-height: 1.55; color: var(--muted); }
.chae-diff__card > img { width: 50px; flex-shrink: 0; }
.chae-diff__card strong { display: block; margin-bottom: 4px; font-family: var(--head); font-size: 18px; font-weight: 600; color: var(--ink); }

.chae-ing-search label { display: block; margin-bottom: 8px; font-size: 13px; font-weight: 700; color: var(--ink); }
.chae-ing-search__row { display: flex; gap: 10px; }
.chae-ing-search input[type="search"] { flex: 1; min-width: 0; height: 46px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--line-2); background: #f6f8f8; font: inherit; font-size: 15px; }
.chae-lookups { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13.5px; }
.chae-lookups span { width: 100%; font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted-2); }
.chae-lookups a { padding: 6px 12px; border-radius: 999px; background: var(--teal-08); font-weight: 700; }

.chae-reviews { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.chae-review { margin: 0; padding: 26px 30px; border-radius: 18px; background: #fff; border: 1px solid var(--line); display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; }
.chae-review blockquote { margin: 0; font-size: 15.5px; line-height: 1.65; }
.chae-review figcaption { margin-top: auto; font-weight: 700; color: var(--ink); }
.chae-reviews__foot { font-size: 15px; color: var(--muted); }
.chae-reviews__foot strong { color: var(--ink); }

/* ---------- product grid + cards (home, shop, related) ---------- */
.chae ul.products { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 24px; margin: 0 !important; padding: 0 !important; list-style: none; }
.chae ul.products.columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.chae ul.products::before, .chae ul.products::after { display: none !important; }
/* No frame round a card: the photo, then the words, on the white page (2026-10-14). */
.chae ul.products li.product.chae-card { display: flex; flex-direction: column; width: auto !important; float: none !important; margin: 0 !important; padding: 0 !important; overflow: hidden; text-align: left; }
/* photo on a white panel with a hairline edge (product photos have white backgrounds); a second photo fades in on
   hover. No blend modes: Chrome sometimes skipped painting blended photos. */
.chae-card__media { position: relative; display: block; aspect-ratio: 1; overflow: hidden; border-radius: 20px; background: #fff; box-shadow: inset 0 0 0 1px #e8eeed; }
.chae .chae-card__media img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; margin: 0 !important; padding: 8%; object-fit: contain; transition: transform 0.5s ease, opacity 0.45s ease; }
.chae .chae-card__media .chae-card__alt { opacity: 0; }
@media (hover: hover) {
	.chae-card:hover .chae-card__media.has-alt img:first-child { opacity: 0; }
	.chae-card:hover .chae-card__media.has-alt .chae-card__alt { opacity: 1; transform: scale(1.03); }
	.chae-card:hover .chae-card__media:not(.has-alt) img:first-child { transform: scale(1.06); }
}
/* No hover on touch screens, so the second photo is never shown: hidden, a lazy image isn't downloaded at all. */
@media (hover: none) {
	.chae .chae-card__media .chae-card__alt { display: none; }
}
.chae span.chae-badge.onsale, .chae .chae-badge { position: absolute; top: 14px; left: 14px; right: auto; min-width: 0; min-height: 0; margin: 0; padding: 5px 10px; border-radius: 999px; background: var(--blue-deep); color: #fff; font-size: 12px; font-weight: 700; line-height: 1.3; }
.chae-card__badges { position: absolute; top: 10px; left: 10px; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.chae .chae-card__badges span.chae-badge, .chae .chae-card__badges span.chae-badge.onsale { position: static; inset: auto; display: inline-flex; align-items: center; gap: 4px; min-width: 0; min-height: 0; margin: 0; padding: 5px 10px; border-radius: 999px; font-size: 11.5px; line-height: 1.3; letter-spacing: 0.02em; }
.chae .chae-card__badges span.chae-badge--best { background: #fff; box-shadow: 0 4px 12px rgba(26, 36, 33, 0.12); color: var(--teal); }
.chae-badge--best .chae-icon { color: var(--blue); }
#favorites .chae-badge--best, .term-top-seller .chae-badge--best { display: none !important; } /* every card there is one */
.chae .chae-card__badges span.chae-badge--rank { background: var(--teal); color: #fff; font-size: 12.5px; letter-spacing: 0.01em; }

/* Best sellers page (woocommerce/taxonomy-product_cat-top-seller.php): short header, ranked grid, then browsing. */
.chae-bsh { display: flex; flex-direction: column; align-items: flex-start; padding: 48px var(--edge); background: var(--tint); } /* full width on the tint, like the category headers (2026-10-15) */
.chae .chae-bsh__title { margin: 6px 0 10px; font-size: 52px; line-height: 1.05; }
.chae-bsh.has-media { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; min-height: clamp(380px, 26vw, 520px); padding: 0 0 0 var(--edge); }
.chae-bsh__body { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.chae-bsh.has-media .chae-bsh__body { padding: 48px 64px 48px 0; }
.chae-bsh__media { position: relative; } /* the photo fills the half without setting its height */
.chae .chae-bsh__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.chae .chae-bsh__img--wide { object-position: 50% 30%; } /* like .chae-banner__img--wide */
@media (max-width: 782px) { .chae-bsh.has-media { grid-template-columns: minmax(0, 1fr); min-height: 0; } .chae-bsh__media { display: none; } }
.chae-bsh__text { max-width: 58ch; margin: 0 0 16px; color: var(--text); font-size: 17px; line-height: 1.5; }
.chae-bsh__proof { display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 0; padding: 0; list-style: none; color: var(--ink); font-size: 14px; font-weight: 600; }
.chae-bsh__proof li { display: inline-flex; align-items: center; gap: 7px; }
.chae-bsh__proof .chae-icon { color: var(--teal); }
.chae-bsh__rating .chae-stars, .chae-bsh__rating svg { color: var(--teal); }
.chae-bs { margin-top: 18px; padding: 32px 0 40px; }
.chae-bs-browse { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; margin-top: 18px; padding: 28px 0; }
.chae-bs-browse .chae-catpills { align-self: stretch; } /* left at its content width, the pill row made phone pages 900px wide */
.chae .chae-bs-browse__title { margin: 0; font-size: 22px; }
@media (max-width: 560px) {
	.chae-bsh, .chae-bsh.has-media .chae-bsh__body { padding: 24px 16px 26px; }
	.chae-bsh.has-media { padding: 0; }
	.chae .chae-bsh__title { margin: 6px 0 6px; font-size: 34px; }
	.chae-bsh__text { margin-bottom: 12px; font-size: 15px; }
	.chae-bsh__proof { gap: 6px 16px; font-size: 13px; }
	.chae-bs, .chae-bs-browse { margin-top: 12px; }
	.chae-bs { padding: 16px 0 20px; }
	.chae-bs-browse { padding: 20px 0; }
	.chae .chae-bs-browse__title { font-size: 19px; }
}

/* Creator partners' stills (chae_creator_strip() in inc/product-page.php): the product page's "See it in action" panel
   and the Best sellers row after the first four products. 4:5 portraits; on phones a sideways swipe row. */
.chae-creators { display: flex; flex-direction: column; gap: 20px; }
.chae-creators.chae-panel { padding: 40px 0 44px; }
.chae-creators--tint { padding: 28px 30px 30px; border-radius: 22px; background: linear-gradient(165deg, #eef7f9 0%, #dcedf1 100%); }
.chae-creators__head { display: flex; flex-direction: column; gap: 6px; }
.chae .chae-creators__title { margin: 0; font-size: 28px; }
.chae-creators__list { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 360px); gap: 16px; margin: 0; padding: 0; list-style: none; } /* at most 360px each, so two photos don't fill a whole page width */
.chae-creators__list::before, .chae-creators__list::after { display: none !important; content: none !important; } /* WooCommerce's clearfix pseudo-elements would take two of the grid's columns inside ul.products */
.chae-creators__item { margin: 0; }
.chae-creators__fig, .chae-creators__link { position: relative; display: block; margin: 0; overflow: hidden; border-radius: 18px; background: var(--tint); aspect-ratio: 4 / 5; }
.chae-creators__fig img, .chae-creators__link img { display: block; width: 100%; height: 100%; object-fit: cover; }
.chae-creators__link img { transition: transform 0.4s ease; }
.chae-creators__link:hover img { transform: scale(1.03); }
.chae-creators__label { position: absolute; left: 10px; right: 10px; bottom: 10px; display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 10px; padding: 10px 14px; border-radius: 14px; background: rgba(255, 255, 255, 0.94); color: var(--ink); box-shadow: 0 6px 18px rgba(26, 36, 33, 0.12); }
.chae-creators__name { font-size: 14px; font-weight: 700; line-height: 1.3; }
.chae-creators__go { color: var(--teal); font-size: 13px; font-weight: 700; white-space: nowrap; }
.chae ul.products > li.chae-bs-creators { grid-column: 1 / -1; margin: 6px 0; list-style: none; }
/* Creator videos and the About tour (chae_creator_video_item(), page-about-us.php; [data-chae-play] in chae.js): a 4:5
   poster with a play button and the length; once tapped a creator clip turns 9:16 so the whole frame plays, with controls. */
.chae-creators__list { align-items: start; } /* a playing card grows taller; the rest keep their size */
.chae-creators--home .chae-creators__list { grid-auto-columns: minmax(0, 1fr); }
.chae-cvid { position: relative; overflow: hidden; aspect-ratio: 4 / 5; border-radius: 18px; background: #111; }
.chae-creators.is-single { display: grid; grid-template-columns: minmax(0, 440px) minmax(0, 300px); justify-content: start; align-items: center; gap: 24px 64px; } /* the video right beside the words (on the open white page a 1fr text column left it stranded at the far edge) */
.chae-creators.is-single .chae-creators__list { grid-auto-columns: minmax(0, 1fr); }
.chae-creators__note { max-width: 46ch; margin: 6px 0 0; color: var(--muted); font-size: 16px; line-height: 1.6; }
@media (max-width: 782px) { .chae-creators.is-single { grid-template-columns: minmax(0, 1fr); } }
.chae-cvid__video { display: block; width: 100%; height: 100%; object-fit: cover; background: #111; }
.chae-cvid.is-playing { aspect-ratio: 9 / 16; }
.chae-cvid.chae-cvid--tour.is-playing { aspect-ratio: 4 / 5; }
.chae-cvid.is-playing .chae-cvid__video { object-fit: contain; }
.chae-cvid.is-playing .chae-cvid__play, .chae-cvid.is-playing .chae-cvid__time { display: none; }
.chae-cvid .chae-cvid__play { width: 60px; height: 60px; margin: -30px 0 0 -30px; }
.chae-cvid__time { position: absolute; right: 10px; bottom: 10px; padding: 3px 9px; border-radius: 999px; background: rgba(17, 17, 17, 0.72); color: #fff; font-size: 12px; font-weight: 700; line-height: 1.5; pointer-events: none; }
.chae .chae-cvid__shop { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 10px; margin-top: 10px; color: var(--ink); font-size: 14px; font-weight: 700; line-height: 1.3; text-decoration: none; }
.chae-cvid__go { color: var(--teal); font-size: 13px; white-space: nowrap; }
.chae .chae-cvid__shop:hover .chae-cvid__go { text-decoration: underline; }
@media (max-width: 960px) {
	.chae-creators.chae-panel { padding: 28px 0 30px; }
}
@media (max-width: 560px) {
	.chae-creators.chae-panel { padding: 22px 0 24px; }
	.chae-creators--tint { padding: 20px 16px 22px; }
	.chae .chae-creators__title { font-size: 22px; }
	.chae-creators__list { position: relative; display: flex; gap: 12px; margin: 0 -16px; padding: 0 16px 6px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 16px; scrollbar-width: none; } /* relative: keeps the photos' positioned labels inside the row */
	.chae-creators__list::-webkit-scrollbar { display: none; }
	.chae-creators__item { flex: 0 0 72%; scroll-snap-align: start; }
	.chae-creators--tint .chae-creators__item { flex-basis: 62%; }
}
@media (prefers-reduced-motion: reduce) {
	.chae-creators__link img { transition: none; }
}
.chae-card__body { display: flex; flex-direction: column; gap: 4px; padding: 16px 2px 0; }
.chae-card__meta { color: var(--blue-deep); font-size: 11.5px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.chae-card__title { display: -webkit-box; min-height: 2.6em; margin: 0 !important; padding: 0 !important; overflow: hidden; font-family: var(--head) !important; font-size: 16.5px !important; font-weight: 600 !important; line-height: 1.3 !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.chae-card__title a { color: var(--ink) !important; }
.chae-card:hover .chae-card__title a { color: var(--teal) !important; }
.chae-card__rating { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12.5px; }
.chae-card__rating span { white-space: nowrap; }
.chae-card__price { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-top: 4px; }
.chae-card__tag { display: block; min-height: 1.35em; margin-top: 2px; overflow: hidden; color: var(--muted); font-size: 13px; line-height: 1.35; white-space: nowrap; text-overflow: ellipsis; }
.chae-card__rating { min-height: 19px; }
.chae-card__off { padding: 2px 8px; border-radius: 999px; background: #e3f1f5; color: var(--blue-deep); font-size: 12px; font-weight: 700; line-height: 1.4; white-space: nowrap; }
.chae-card__sub-short { display: none; }
@media (max-width: 560px) {
	.chae-card__sub-long { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } /* screen readers still hear the full line */
	.chae-card__sub-short { display: inline; }
}
.chae .chae-card__price .price { color: var(--ink) !important; font-size: 18px; font-weight: 700; line-height: 1.35; }
.chae .chae-card__price .price del { margin-right: 6px; color: var(--muted-2); font-size: 14px; font-weight: 400; opacity: 1; }
.chae .chae-card__price .price ins { color: var(--blue-deep); text-decoration: none; }
.chae-card__sub { display: inline-flex; align-items: center; gap: 6px; color: var(--blue-deep); font-size: 12.5px; font-weight: 600; line-height: 1.35; }
.chae-card__sub .chae-icon { flex-shrink: 0; }
.chae-feature__price, .chae .summary .price { color: var(--teal) !important; font-weight: 700; font-size: 14.5px; line-height: 1.45; }
.chae .summary .price del { color: var(--muted-2); font-weight: 400; opacity: 1; }
.chae .summary .price ins { text-decoration: none; font-weight: 700; }
.chae-card__actions { margin-top: auto; padding: 14px 0 0; }
.chae-card__actions .button { margin: 0 !important; }
body.chae .chae-card__actions .button { display: flex !important; width: 100%; min-height: 44px; justify-content: center; }
body.chae .chae-card:hover .chae-card__actions .button { border-color: var(--teal) !important; background: var(--teal) !important; color: #fff !important; }
@media (max-width: 560px) {
	.chae-card__media { border-radius: 16px; }
	.chae-card__rating { gap: 5px; }
	.chae-card__rcount::before { content: "("; content: "(" / ""; }
	.chae-card__rcount::after { content: ")"; content: ")" / ""; }
	.chae-card__rword { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } /* "(21)" on phones; screen readers still hear "21 reviews" */
	.chae-card__rating--kit .chae-card__rcount::before, .chae-card__rating--kit .chae-card__rcount::after { content: none; }
	.chae-card__rating--kit .chae-card__rword { position: static; width: auto; height: auto; overflow: visible; clip: auto; } /* a kit's count is the items' reviews: keep the words on phones too */
	.chae-card__rating--kit { flex-wrap: wrap; row-gap: 2px; } /* "57 item reviews" drops under the stars rather than being cut off */
	/* "1,500+ sold" ran off a 173px card ("1,500+ sc", 2026-10-17 sweep): its own line under the stars, no dot */
	.chae-card__rating:has(.chae-sold) { flex-wrap: wrap; row-gap: 2px; }
	.chae-card__rating .chae-sold { flex-basis: 100%; }
	.chae .chae-card__rating > * + .chae-sold::before { content: none; } /* .chae: the base rule comes later */
	.chae-card__price { display: grid; justify-items: start; } /* "25% Off" under the price on every card: beside it on short prices, under it on long ones, rows looked mixed (2026-10-17 sweep) */
	.chae .chae-card__badges span.chae-badge, .chae .chae-card__badges span.chae-badge.onsale { padding: 4px 8px; font-size: 10.5px; }
	.chae-card__body { padding: 10px 0 0; }
	.chae-card__title { font-size: 14.5px !important; }
	.chae .chae-card__price .price { font-size: 16px; }
	.chae-card__sub { font-size: 11.5px; }
	body.chae .chae-card__actions .button { min-height: 40px; padding: 0 10px !important; font-size: 13.5px; }
}

/* ---------- shop / category ---------- */
.chae-crumbs-row { padding-top: 18px; padding-bottom: 18px; }
.chae-crumbs ol { margin: 0; padding: 0; list-style: none; display: inline-flex; flex-wrap: wrap; font-size: 13px; }
.chae-crumbs li { display: flex; }
.chae-crumbs li + li::before { content: "/"; padding: 4px 10px; color: var(--line-2); }
.chae-crumbs li a, .chae-crumbs li:last-child { padding: 4px 0; color: var(--text); }
.chae-crumbs li:last-child { color: var(--muted); }

.chae-banner { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: clamp(380px, 26vw, 520px); padding-left: var(--edge); background: var(--tint); } /* full width, like the home page hero (2026-10-15) */
.chae-banner--text { grid-template-columns: minmax(0, 1fr); min-height: 0; }
.chae-banner--search { min-height: 0; }
.chae-banner--search .chae-banner__title { font-size: clamp(30px, 4vw, 46px); overflow-wrap: anywhere; }
.chae-noresults { display: flex; flex-direction: column; gap: 18px; }
.chae-noresults > p { margin: 0; color: var(--muted); }
.chae-noresults strong { color: var(--ink); }
.chae-noresults__title { margin: 12px 0 0; font-size: 24px; }
.chae-banner__text { min-width: 0; padding: 48px 64px 48px 0; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 14px; }
.chae-banner--text { padding-right: var(--edge); }
.chae-banner--text .chae-banner__text { padding-right: 0; }
.chae-banner__text > .chae-eyebrow + * { margin-top: -4px; }
.chae-banner__title { margin: 0; font-size: 52px; line-height: 1.05; }
.chae-banner__tagline { margin: 0; font-family: var(--head); font-size: 20px; font-weight: 500; color: var(--teal); }
.chae-banner__desc { max-width: 540px; margin: 0; color: var(--muted); font-size: 16.5px; line-height: 1.6; }
.chae-banner__media { position: relative; }
.chae .chae-banner__img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; } /* .chae: outranks WooCommerce's and the theme's img { height: auto } */
.chae .chae-banner__img--wide { object-position: 50% 30%; } /* a 3:2 photo in a wider box: what's cropped comes mostly off the bottom, never the products' caps; the band grows with the screen (min-height above) so a wide screen doesn't crop it to a strip */
.chae .chae-banner__img--fit { padding: 28px; object-fit: contain; filter: drop-shadow(0 18px 24px rgba(0, 60, 70, 0.16)); } /* a cut-out (the Shop page's bottle group): whole, never cropped */

.chae-shop { margin-top: 24px; padding: 40px 0 48px; display: flex; flex-direction: column; gap: 28px; }
.chae-catpills { display: flex; flex-wrap: wrap; gap: 10px; }
.chae-catpills a { display: inline-flex; align-items: center; min-height: 42px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--line-2); background: #fff; color: var(--ink); font-size: 14px; font-weight: 700; }
.chae-catpills a[aria-current="page"] { background: var(--teal); border-color: var(--teal); color: #fff; }
.chae-shop__layout { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 36px; align-items: start; }
.chae-filters { padding: 22px; border-radius: 20px; background: var(--tint); border: 1px solid rgba(0, 98, 99, 0.1); }
.chae-filters__title { margin: 0 0 6px; font-size: 20px; font-weight: 600; }
.chae-filter { padding: 16px 0; border-top: 1px solid #dde6e4; }
.chae-filter__title { margin: 0 0 12px; font-family: var(--body) !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: 0.1em; text-transform: uppercase; color: var(--teal) !important; }
.chae-filter ul { margin: 0; padding: 0; list-style: none; }
.chae-filter li { padding: 4px 0; font-size: 14.5px; }
.chae .widget_price_filter .ui-slider .ui-slider-range, .chae .widget_price_filter .ui-slider .ui-slider-handle { background-color: var(--teal); }
.chae .widget_price_filter .price_slider_wrapper .ui-widget-content { background-color: #cfdcda; }
.chae .widget_price_filter .price_slider_amount { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; font-size: 13.5px; }
.chae .widget_price_filter .price_slider_amount .button { min-height: 38px; padding: 0 14px; font-size: 13.5px; float: none; }
.chae-shop__main { min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.chae-shop__main.is-loading { opacity: 0.45; pointer-events: none; transition: opacity 0.15s; }

/* shop filters (inc/filters.php, assets/js/filters.js) */
/* The filter panel stays beside the products (2026-10-16, user: "the filter column should scroll with"): sticky, no
   scrollbar of its own (that cut its last row in half, 2026-10-13); a panel taller than the window moves with the
   scroll instead (assets/js/filters.js sets its top). Desktop only: phones have the drawer. */
@media (min-width: 961px) {
	.chae-filters { position: sticky; top: 24px; }
}
.chae-filters::-webkit-scrollbar { width: 6px; }
.chae-filters::-webkit-scrollbar-thumb { border-radius: 3px; background: rgba(0, 98, 99, 0.22); }
.chae-filters__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 2px; }
.chae-filters__head .chae-filters__title { margin: 0; }
.chae-filters__clear { font-size: 13.5px; font-weight: 700; }
.chae-filters__close, .chae-filters__foot { display: none; }
.chae-facet { min-width: 0; margin: 0; padding: 16px 0 12px; border: 0; border-top: 1px solid #dde6e4; }
.chae-facet:first-child { margin-top: 12px; }
.chae-facet__title { float: left; width: 100%; margin: 0 0 8px; padding: 0; font-family: var(--head); font-size: 16px; font-weight: 700; color: var(--ink); } /* Floated: keeps the legend off the divider line. */
.chae-facet__options { clear: both; }
.chae-facet__options { display: flex; flex-direction: column; gap: 2px; }
.chae-facet__opt { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; align-items: center; gap: 10px; margin: 0 -8px; padding: 6px 8px; border-radius: 10px; color: var(--text); font-size: 14.5px; line-height: 1.3; cursor: pointer; }
.chae-facet__opt:hover { background: rgba(0, 98, 99, 0.07); }
.chae-facet__opt input { width: 18px; height: 18px; margin: 0; accent-color: var(--teal); cursor: pointer; }
.chae-facet__opt input:checked ~ .chae-facet__label { color: var(--ink); font-weight: 700; }
.chae-facet__opt input:focus-visible { outline: 3px solid rgba(0, 98, 99, 0.45); outline-offset: 2px; }
.chae-facet__count { min-width: 26px; padding: 1px 7px; border-radius: 999px; background: #fff; color: var(--muted-2); font-size: 12px; font-weight: 700; text-align: center; }
.chae-facet__opt.is-extra { display: none; }
.chae-facet.is-expanded .chae-facet__opt.is-extra { display: grid; }
.chae-facet__more { margin-top: 6px; padding: 0; border: 0; background: none; color: var(--teal); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.chae-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.chae .chae-chip { display: inline-flex; align-items: center; gap: 8px; min-height: 34px; padding: 0 12px 0 14px; border-radius: 999px; background: var(--teal); color: #fff; font-size: 14px; font-weight: 600; }
.chae .chae-chip:hover { background: var(--teal-press); color: #fff; }
.chae-chips__clear { margin-left: 4px; font-size: 14px; font-weight: 700; }
.chae-filter-toggle { display: none; }
.chae-shop__bar { display: flex; align-items: center; gap: 12px; }
.chae-shop__bar .chae-toolbar { flex: 1; min-width: 0; }
.chae-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.chae-toolbar .woocommerce-notices-wrapper { flex-basis: 100%; }
.chae-toolbar .woocommerce-notices-wrapper:empty { display: none; }
.chae .woocommerce-result-count { margin: 0 !important; float: none !important; font-size: 14.5px; color: var(--muted); }
.chae .woocommerce-ordering { margin: 0 !important; float: none !important; }
.chae .woocommerce-ordering select { height: 42px; padding: 0 36px 0 14px; border-radius: 999px; border: 1px solid var(--line-2); background-color: #fff; font: inherit; font-size: 14.5px; color: var(--ink); }
.chae .woocommerce-pagination { margin-top: 16px; text-align: center; }
.chae .woocommerce-pagination ul.page-numbers { display: inline-flex; gap: 10px; border: 0 !important; margin: 0; }
.chae .woocommerce-pagination ul.page-numbers li { border: 0 !important; }
.chae .woocommerce-pagination .page-numbers a, .chae .woocommerce-pagination .page-numbers span { min-width: 44px; height: 44px; padding: 0 12px !important; border-radius: 999px; border: 1px solid var(--line-2); background: #fff; color: var(--ink); font-weight: 700; display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
.chae .woocommerce-pagination .page-numbers span.current { background: var(--teal); border-color: var(--teal); color: #fff; }

/* ---------- product page ---------- */
.chae-notices:empty { display: none; }
.chae-buy { display: grid; grid-template-columns: minmax(0, 560px) minmax(0, 1fr); gap: 48px; align-items: start; padding: 8px 0 48px; }
.chae-buy__gallery { position: sticky; top: 24px; min-width: 0; } /* Photos stay in view beside a long buy box. */
.chae-buy__gallery .woocommerce-product-gallery { width: 100% !important; float: none !important; margin: 0 !important; }
.chae-buy__gallery .woocommerce-product-gallery__wrapper { border-radius: 22px; overflow: hidden; border: 1px solid rgba(0, 98, 99, 0.08); background: #fff; }
.chae-buy__gallery .flex-control-thumbs { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin: 14px 0 0 !important; padding: 0; }
.chae-buy__gallery .flex-control-thumbs li { width: auto !important; float: none !important; margin: 0 !important; }
.chae-buy__gallery .flex-control-thumbs img { width: 100%; height: auto; border-radius: 12px; border: 2px solid #dbe5e3; opacity: 1 !important; aspect-ratio: 1; object-fit: cover; background: #fff; } /* width: one thumbnail at its own width made MOISTURE TheraP's row 205px tall on phones */
.chae-buy__gallery .flex-control-thumbs img.flex-active { border-color: var(--teal); }
.chae-buy__gallery .flex-control-thumbs li { aspect-ratio: 1; overflow: hidden; } /* square even when a picture can't load (a blocked YouTube thumbnail's alt text stretched the row) */
.chae-buy__gallery .flex-control-thumbs:has(li:nth-child(7)) { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - 50px) / 6); overflow-x: auto; padding-bottom: 6px !important; scrollbar-width: thin; }
.chae-buy__gallery .woocommerce-product-gallery__trigger { top: 16px !important; right: auto !important; left: 16px; background: #fff !important; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); }
/* Until WooCommerce's slider starts (no .flex-viewport yet), lay the gallery out as it will be: the first photo, and
   one row of thumbnail space (WooCommerce's own CSS shows the other photos as quarter-width tiles, so everything below
   jumped up when the slider built its row — layout shift 0.28 on phones). */
.chae-buy__gallery .woocommerce-product-gallery:not(:has(.flex-viewport)) .woocommerce-product-gallery__image:nth-child(n+2) { display: none !important; }
.chae-buy__gallery .woocommerce-product-gallery:not(:has(.flex-viewport)):has(.woocommerce-product-gallery__image:nth-child(2))::after { content: ""; display: block; margin-top: 14px; padding-top: calc((100% - 50px) / 6); }
.chae-buy__gallery .woocommerce-product-gallery:not(:has(.flex-viewport)):has(.woocommerce-product-gallery__image:nth-child(7))::after { padding-bottom: 6px; }
/* While the slider sets itself up, its frame holds every photo stacked for a moment (4,000px+ tall on phones), which
   threw the page down and back: keep the frame square (the photos are) until the slider gives it its own height. */
.chae-buy__gallery .flex-viewport { aspect-ratio: 1; width: 100%; max-width: 100%; } /* the slider sets its height from the first photo: with a portrait main photo (Lavender 800×889) the 1:1 ratio widened it to 622px and the next slide showed over the buy box */
/* With the layout the same before and after the slider starts, the gallery needn't wait for it: WooCommerce hides it
   (inline opacity 0) until then, which held the page's largest paint — the product photo — until its scripts ran. */
.chae-buy__gallery .woocommerce-product-gallery { opacity: 1 !important; }
.chae-buy__gallery .onsale { top: 16px !important; left: 64px !important; }
.chae-buy__seal { position: absolute; top: 14px; right: 14px; z-index: 5; width: 66px; height: 66px; border-radius: 50%; background: #fff; box-shadow: 0 6px 14px rgba(0, 60, 70, 0.12); display: flex; align-items: center; justify-content: center; overflow: hidden; pointer-events: none; }
.chae-buy__seal img { width: 52px; }
/* The seal on its own (2026-10-16, user: "not sure if the toxic free badge needs a white circle behind it"): no extra
   white disc behind the mark. */
.chae .chae-buy__seal { width: auto; height: auto; border-radius: 0; background: none; box-shadow: none; }
.chae .chae-buy__seal img { width: 58px; } /* the mark is its own white-and-green disc; no shadow (it outlined the file's faint edge as a box) */
@media (max-width: 782px) {
	.chae .chae-buy__seal img { width: 50px; }
}
/* the YouTube slide (chae-site snippets/store/product-youtube-video.php): square like the photos, the player — or
   FlyingPress's click-to-load poster in its place — filling it, so the frame doesn't change height on that slide */
.chae-buy__gallery .woocommerce-product-gallery__image--video { aspect-ratio: 1; background: #000; }
.chae-buy__gallery .woocommerce-product-gallery__image--video .my-product-youtube-wrap { width: 100%; max-width: none !important; height: 100% !important; margin: 0 !important; padding-bottom: 0 !important; border-radius: 0 !important; }
.chae-buy__gallery .woocommerce-product-gallery__image--video .flying-press-youtube { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: block; }
.chae-buy__gallery .woocommerce-product-gallery__image--video .flying-press-youtube img { width: 100%; height: 100%; object-fit: cover; }
/* Phones (2026-10-15): a shorter photo with the next one peeking in at the right edge, dots in place of the
   thumbnails, so the name, rating and price come up with the photo; the sticky bar shows the price and the button
   from the start (assets/js/product.js). (Desktop keeps one big photo: two side by side made both too small.)
   WooCommerce's slider still runs it: its frame (.flex-viewport) is the screen less 102px and shows past its edge
   (inline overflow hidden, overruled); the gallery runs past the panel's 20px and the page's 16px to the screen edge
   and 6px left of the column, and clips the rest. Each photo is clipped 6px in on each side — the 12px gap. The photos
   stay in a row, each one frame wide, from the first paint on (the slider stacks them for 100ms while it sets up, and
   the next photo's jump into place counted as a layout shift): in the frame, 100cqw is its width, what the slider then
   sets inline; !important beats WooCommerce's 25% for every photo after the first. */
@media (max-width: 782px) {
	.chae-buy { row-gap: 16px; }
	.chae-buy__gallery .woocommerce-product-gallery { width: auto !important; margin: 0 -36px 0 -6px !important; overflow: hidden; container-type: inline-size; }
	.chae-buy__gallery .woocommerce-product-gallery__wrapper { display: flex; overflow: visible; border: 0; border-radius: 0; background: none; }
	.chae-buy__gallery .flex-viewport { width: calc(100vw - 102px) !important; max-width: none; min-height: 0; overflow: visible !important; container-type: inline-size; } /* min-height: a box that shows its overflow grows to fit it otherwise */
	.chae-buy__gallery .woocommerce-product-gallery__image { position: relative; flex: 0 0 auto; width: calc(100vw - 102px) !important; clip-path: inset(0 6px round 18px); }
	.chae-buy__gallery .flex-viewport .woocommerce-product-gallery__image { width: 100cqw !important; }
	.chae-buy__gallery .woocommerce-product-gallery__image::after { content: ""; position: absolute; top: 0; right: 6px; bottom: 0; left: 6px; border: 1px solid rgba(0, 98, 99, 0.08); border-radius: 18px; pointer-events: none; }
	.chae-buy__gallery .woocommerce-product-gallery__image a { display: block; }
	.chae-buy__gallery .woocommerce-product-gallery__image img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; background: #fff; }
	.chae-buy__gallery .woocommerce-product-gallery:not(:has(.flex-viewport)) .woocommerce-product-gallery__image:nth-child(2) { display: block !important; } /* the peek, before the slider starts */
	.chae-buy__gallery .woocommerce-product-gallery:not(:has(.flex-viewport)) .woocommerce-product-gallery__image:only-child { width: calc(100vw - 60px) !important; }
	.chae-buy__gallery .woocommerce-product-gallery:not(:has(.flex-viewport)):has(.woocommerce-product-gallery__image:nth-child(2))::after,
	.chae-buy__gallery .woocommerce-product-gallery:not(:has(.flex-viewport)):has(.woocommerce-product-gallery__image:nth-child(7))::after { height: 22px; margin: 10px 0 0; padding: 0; }
	.chae-buy__seal { top: 10px; right: 52px; width: 56px; height: 56px; }
	.chae-buy__seal img { width: 44px; }
	.chae-buy__gallery .woocommerce-product-gallery:has(.woocommerce-product-gallery__image:only-child) + .chae-buy__seal { right: 10px; }
	/* thumbnails → dots: each thumbnail, invisible, stays the tap target over its dot */
	.chae-buy__gallery .flex-control-thumbs, .chae-buy__gallery .flex-control-thumbs:has(li:nth-child(7)) { display: flex !important; justify-content: center; gap: 0; margin: 10px 36px 0 6px !important; padding: 0 !important; overflow: visible; } /* centred under the column, not the bleed */
	.chae-buy__gallery .flex-control-thumbs li { position: relative; flex: 0 0 22px; width: 22px !important; height: 22px; aspect-ratio: auto; overflow: hidden; } /* hidden: a thumbnail that fails to load (a blocked YouTube one) can't spread its tap area over the page */
	.chae-buy__gallery .flex-control-thumbs li::before { content: ""; position: absolute; top: 7px; left: 7px; width: 8px; height: 8px; border-radius: 50%; background: #c3d1cf; transition: background-color 0.2s, transform 0.2s; pointer-events: none; }
	.chae-buy__gallery .flex-control-thumbs li:has(img.flex-active)::before { background: var(--teal); transform: scale(1.25); }
	.chae-buy__gallery .flex-control-thumbs img { position: absolute; top: 0; left: 0; width: 22px; height: 22px !important; border: 0; opacity: 0 !important; }
}

.chae-buy__summary { width: auto !important; float: none !important; margin: 0 !important; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.chae .chae-buy__summary .product_title { margin: 0; font-size: 36px; line-height: 1.2; }
.chae .chae-buy__summary .woocommerce-product-rating { margin: 0 !important; display: flex; align-items: center; gap: 10px; font-size: 14px; }
.chae .chae-buy__summary .star-rating { color: var(--teal); margin: 0 !important; float: none !important; }
.chae .chae-buy__summary .price { margin: 0; font-size: 26px !important; }
.chae .chae-buy__summary .woocommerce-product-details__short-description ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.chae .chae-buy__summary .woocommerce-product-details__short-description li { position: relative; padding-left: 30px; color: var(--ink); }
.chae .chae-buy__summary .woocommerce-product-details__short-description li::before { content: ""; position: absolute; left: 0; top: 3px; width: 18px; height: 18px; background: var(--blue); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; }
.chae .chae-buy__summary .woocommerce-product-details__short-description p { margin: 0 0 8px; }
.chae .chae-buy__summary form.cart { margin: 4px 0 0 !important; padding: 18px 20px; border-radius: 18px; background: var(--tint); border: 1px solid rgba(0, 98, 99, 0.1); display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.chae .chae-buy__summary form.cart::before, .chae .chae-buy__summary form.cart::after { display: none !important; }
.chae .chae-buy__summary form.cart > * { margin: 0 !important; }
.chae .chae-buy__summary form.cart .variations, .chae .chae-buy__summary form.cart .single_variation_wrap,
.chae .chae-buy__summary form.cart .wcsatt-options-wrapper, .chae .chae-buy__summary form.cart .wcsatt-options-product-wrapper { flex-basis: 100%; }
.chae .chae-buy__summary .quantity .qty { width: 72px; height: 50px; border-radius: 10px; border: 1.5px solid #c9d6d3; background: #fff; font: inherit; font-size: 16px; font-weight: 700; text-align: center; }
.chae .chae-buy__summary .single_add_to_cart_button { flex: 1; min-height: 50px; font-size: 16px; float: none !important; }
.chae .chae-buy__summary .product_meta { font-size: 13px; color: var(--muted-2); display: flex; flex-direction: column; gap: 2px; }
.chae-trust { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 13.5px; color: var(--muted); }
.chae-trust li { display: flex; align-items: center; gap: 6px; }
.chae-trust :is(.chae-icon, .chae-line-icon) { flex-shrink: 0; color: var(--teal); }
.chae-art-icon { display: block; flex-shrink: 0; object-fit: contain; }

.chae-details { padding: 48px; }
.chae .woocommerce-tabs { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 0 48px; align-items: start; margin: 0 !important; padding: 0 !important; } /* No row gap: the tab list spans many rows. */
.chae .woocommerce-tabs ul.tabs { grid-column: 1; grid-row: 1 / span 30; margin: 0 !important; padding: 0 !important; display: flex; flex-direction: column; gap: 8px; border: 0 !important; overflow: visible !important; }
.chae .woocommerce-tabs ul.tabs::before, .chae .woocommerce-tabs ul.tabs li::before, .chae .woocommerce-tabs ul.tabs li::after { display: none !important; }
.chae .woocommerce-tabs ul.tabs li { margin: 0 !important; padding: 0 !important; border: 1px solid rgba(0, 98, 99, 0.1) !important; border-radius: 12px !important; background: var(--tint) !important; }
.chae .woocommerce-tabs ul.tabs li a { display: flex !important; align-items: center; justify-content: space-between; min-height: 52px; padding: 0 18px !important; color: var(--ink) !important; font-size: 15px; font-weight: 700 !important; }
.chae .woocommerce-tabs ul.tabs li a::after { content: "›"; font-size: 20px; line-height: 1; }
.chae .woocommerce-tabs ul.tabs li.active { background: var(--teal) !important; border-color: var(--teal) !important; }
.chae .woocommerce-tabs ul.tabs li.active a { color: #fff !important; }
.chae .woocommerce-tabs .panel { grid-column: 2; grid-row: 1; min-width: 0; margin: 0 !important; }
.chae .woocommerce-tabs .panel > h2:first-child { margin-top: 0; font-size: 30px; }
.chae .woocommerce-tabs .panel ul { padding-left: 1.2em; }
.chae .woocommerce-tabs .panel li { margin-bottom: 6px; }
.chae #reviews .commentlist { margin: 0; padding: 0; list-style: none; }
.chae #reviews .star-rating { color: var(--teal); }
/* Review list: Customer Reviews' list inside "Read all N reviews" (#reviews.cr-reviews-ajax-reviews). Same look for the
   Store reviews list (.cr-all-reviews-shortcode). CusRev's product-page rules start with #reviews, so these match that. Stars: solid teal on light grey everywhere CusRev draws them. */
.chae .crstar-rating-svg .cr-rating-icon-base .cr-rating-icon-bg { fill: #d5e0dd; stroke: none; }
.chae .crstar-rating-svg .cr-rating-icon-frnt .cr-rating-icon { fill: var(--teal); }
.chae .cr-histogramTable .ivole-histogramRow .cr-histogram-rating-icon { fill: var(--teal); }
.chae .ivole-meter { height: 8px; border: 0; border-radius: 4px; background: #dbe5e3; box-shadow: none; }
.chae .ivole-meter .ivole-meter-bar { border-radius: 4px; background: var(--teal); box-shadow: none; }
.chae .ivole-meter .ivole-meter-bar::before { display: none; }
/* summary: the score and "Write a review" beside the star bars */
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-summaryBox-wrap { display: grid; grid-template-columns: 220px minmax(0, 1fr); align-items: center; gap: 12px 40px; margin: 0 0 18px; padding: 24px 30px; border: 1px solid var(--panel-border); border-radius: 20px; background: var(--panel-bg); }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-summaryBox-wrap .cr-overall-rating-wrap { width: auto; flex: none; flex-direction: column; flex-wrap: nowrap; align-items: flex-start; justify-content: flex-start; gap: 2px; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-summaryBox-wrap .cr-average-rating { color: var(--teal); font-family: var(--head); font-size: 50px; font-weight: 700; line-height: 1; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-summaryBox-wrap .cr-average-rating-stars .crstar-rating-svg { margin: 8px 0 2px; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-summaryBox-wrap .cr-total-rating-count { color: var(--muted); font-size: 14px; line-height: 1.5; }
.chae :is(#reviews.cr-reviews-ajax-reviews, .cr-all-reviews-shortcode) :is(.cr-ajax-reviews-add-review, .cr-all-reviews-add-review) { display: inline-flex; white-space: nowrap; align-items: center; min-height: 46px; margin: 14px 0 0; padding: 0 22px; border: 0; border-radius: var(--r-btn); background: var(--btn-fill); box-shadow: 0 3px 0 var(--btn-edge); color: #fff; font: 700 15px var(--body); transition: transform 0.12s ease, box-shadow 0.12s ease; }
.chae :is(#reviews.cr-reviews-ajax-reviews, .cr-all-reviews-shortcode) :is(.cr-ajax-reviews-add-review, .cr-all-reviews-add-review):hover { background: var(--btn-fill); box-shadow: 0 0 0 var(--btn-edge); transform: translate(0, 3px); }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-summaryBox-wrap .ivole-summaryBox { width: auto; flex: none; margin: 0; padding: 0; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-summaryBox-wrap .cr-histogramTable { width: 100%; max-width: none; margin: 0; }
.chae .cr-histogramTable .ivole-histogramRow .ivole-histogramCell1, .chae .cr-histogramTable .ivole-histogramRow .ivole-histogramCell3 { color: var(--muted); font-size: 13.5px; }
.chae .cr-histogramTable .ivole-histogramRow:hover .ivole-meter-bar { background: var(--teal-press); }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-summaryBox-wrap .cr-count-filtered-reviews { grid-column: 1 / -1; padding: 0; color: var(--muted); font-size: 14px; }
/* search + count/sort row */
.chae :is(#reviews.cr-reviews-ajax-reviews, .cr-all-reviews-shortcode) .cr-ajax-search { margin: 0 0 14px; }
.chae :is(#reviews.cr-reviews-ajax-reviews, .cr-all-reviews-shortcode) input.cr-input-text[type="text"] { height: 48px; padding: 0 40px 0 44px; border: 1.5px solid var(--line-2); border-radius: 999px; background: #fff; box-shadow: none; color: var(--ink); font: 15px var(--body); }
.chae :is(#reviews.cr-reviews-ajax-reviews, .cr-all-reviews-shortcode) input.cr-input-text[type="text"]:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(0, 98, 99, 0.14); }
.chae :is(#reviews.cr-reviews-ajax-reviews, .cr-all-reviews-shortcode) .cr-ajax-search .cr-ajax-search-icon { left: 16px; fill: var(--teal); }
.chae :is(#reviews.cr-reviews-ajax-reviews, .cr-all-reviews-shortcode) .cr-clear-input svg { fill: var(--muted); }
.chae :is(#reviews.cr-reviews-ajax-reviews, .cr-all-reviews-shortcode) .cr-count-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 14px; padding: 0 4px; background: none; }
.chae :is(#reviews.cr-reviews-ajax-reviews, .cr-all-reviews-shortcode) .cr-count-row-count { color: var(--muted); font-size: 14px; }
.chae :is(#reviews.cr-reviews-ajax-reviews, .cr-all-reviews-shortcode) .cr-ajax-reviews-sort-div .cr-ajax-reviews-sort { min-height: 40px; padding: 0 34px 0 14px; border: 1.5px solid var(--line-2); border-radius: var(--r-btn); background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23006263' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 12px center; appearance: none; -webkit-appearance: none; color: var(--ink); font: 600 14px var(--body); cursor: pointer; }
.chae :is(#reviews.cr-reviews-ajax-reviews, .cr-all-reviews-shortcode) .cr-ajax-reviews-sort-div svg { display: none; }
/* each review */
.chae :is(#reviews, .cr-all-reviews-shortcode) .commentlist > li { margin: 0 0 12px; padding: 0; border: 0; }
.chae :is(#reviews #comments.cr-reviews-ajax-comments, .cr-all-reviews-shortcode) .commentlist .comment_container { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 16px; padding: 20px 24px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.chae :is(#reviews #comments.cr-reviews-ajax-comments, .cr-all-reviews-shortcode) .commentlist .comment_container .cr-comment-text { margin: 0; padding: 0; border: 0; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .comment_container img.avatar { position: static; width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.chae-avatar { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: #e3efee; color: var(--teal); font-family: var(--head); font-size: 15px; font-weight: 700; letter-spacing: 0.02em; }
.chae-avatar--1 { background: #e1eff4; color: var(--blue-deep); }
.chae-avatar--2 { background: #eceff0; color: var(--muted); }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-meta-author-featured-date { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 12px; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-meta-author-title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .woocommerce-review__author { color: var(--ink); font-size: 16px; font-weight: 700; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .woocommerce-review__verified { display: inline-flex; align-items: center; gap: 4px; color: var(--teal); font-size: 13px; font-style: normal; font-weight: 600; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .woocommerce-review__verified::before { content: ""; width: 14px; height: 14px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .woocommerce-review__published-date { color: var(--muted); font-size: 13.5px; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .comment_container .crstar-rating-svg { margin: 8px 0 4px; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .comment_container .description { color: var(--text); font-size: 15.5px; line-height: 1.65; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .comment_container .description p { margin: 6px 0 0; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .commentlist ul.children { margin: 10px 0 0 60px; padding: 0; list-style: none; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .commentlist ul.children .comment_container { background: var(--tint); }
.chae :is(#reviews, .cr-all-reviews-shortcode) .comment_container :is(.cr-comment-images, .cr-comment-videos) img { border-radius: 12px; }
.chae :is(#reviews.cr-reviews-ajax-reviews, .cr-all-reviews-shortcode) :is(.cr-show-more-reviews-prd, .cr-show-more-button) { display: flex; align-items: center; min-height: 46px; margin: 20px auto 0; padding: 0 24px; border: 1.5px solid var(--teal); border-radius: var(--r-btn); background: #fff; color: var(--teal); font: 700 15px var(--body); }
.chae :is(#reviews.cr-reviews-ajax-reviews, .cr-all-reviews-shortcode) :is(.cr-show-more-reviews-prd, .cr-show-more-button):hover { border-color: var(--teal); background: var(--teal-08); color: var(--teal); }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-search-no-reviews { color: var(--muted); text-align: center; }
.chae :is(#reviews.cr-reviews-ajax-reviews, .cr-all-reviews-shortcode) .cr-ajax-reviews-cus-images-div { margin: 0 0 18px; }
.chae :is(#reviews.cr-reviews-ajax-reviews, .cr-all-reviews-shortcode) .cr-ajax-reviews-cus-images-div .cr-ajax-reviews-cus-images-title { margin: 0 0 10px; color: var(--ink); font-family: var(--head); font-size: 18px; font-weight: 600; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-comment-image-top { margin: 0 8px 0 0; overflow: hidden; border-radius: 14px; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-comment-image-top img, .chae :is(#reviews, .cr-all-reviews-shortcode) .cr-comment-image-top-item { display: block; width: 108px; height: 108px; border-radius: 14px; object-fit: cover; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-comment-image-top { position: relative; display: inline-block; vertical-align: top; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-comment-image-top video.cr-comment-image-top-item { background: #102322; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-comment-image-top img.cr-comment-videoicon { position: absolute; top: 50%; left: 50%; width: 38px; height: 38px; margin: 0; border-radius: 50%; transform: translate(-50%, -50%); object-fit: contain; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-review-tags-filter { margin: 0 0 12px; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-review-tags-filter > * { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border: 1.5px solid var(--line-2); border-radius: 999px; background: #fff; color: var(--ink); font-size: 14px; font-weight: 600; cursor: pointer; }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-review-tags-filter > :is(:hover, .cr-tag-selected, .cr-tags-filter-selected) { border-color: var(--teal); color: var(--teal); }
.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-review-tags-filter svg { fill: currentColor; }
/* Store reviews: the summary has its own "Add a review" column; each review names the product */
.chae .cr-all-reviews-shortcode:not(#_) .cr-summaryBox-wrap { grid-template-columns: 200px minmax(0, 1fr) auto; }
.chae .cr-all-reviews-shortcode:not(#_) .cr-summaryBox-wrap :is(.cr-summary-separator, .cr-summary-separator-side) { display: none; }
.chae .cr-all-reviews-shortcode:not(#_) .cr-add-review-wrap { width: auto; margin: 0; padding: 0; }
.chae .cr-all-reviews-shortcode:not(#_) .cr-all-reviews-add-review { margin: 0; }
.chae .cr-all-reviews-shortcode:not(#_) .cr-ajax-search { display: flex; gap: 10px; margin: 0 0 14px; }
.chae .cr-all-reviews-shortcode:not(#_) .cr-ajax-search > div { position: relative; flex-grow: 1; }
.chae .cr-all-reviews-shortcode:not(#_) .cr-ajax-search .cr-button-search { flex-shrink: 0; min-height: 48px; margin: 0; padding: 0 22px; border: 1.5px solid var(--teal); border-radius: 999px; background: #fff; color: var(--teal); font: 700 15px var(--body); }
.chae .cr-all-reviews-shortcode:not(#_) .cr-ajax-search .cr-button-search:hover { background: var(--teal-08); }
.chae .cr-all-reviews-shortcode:not(#_) .cr-rating-product-name { display: flex; align-items: center; gap: 10px; margin: 10px 0 0; }
.chae .cr-all-reviews-shortcode:not(#_) .cr-rating-product-name img { width: 36px; height: 36px; margin: 0; padding: 2px; border: 1px solid var(--line); border-radius: 10px; background: #fff; object-fit: contain; }
.chae .cr-all-reviews-shortcode:not(#_) .cr-comment-productname-a { color: var(--teal); font-size: 14px; font-weight: 700; }
@media (max-width: 782px) {
	.chae :is(#reviews, .cr-all-reviews-shortcode) .cr-summaryBox-wrap, .chae .cr-all-reviews-shortcode:not(#_) .cr-summaryBox-wrap { grid-template-columns: minmax(0, 1fr); gap: 18px; padding: 20px; }
	.chae :is(#reviews #comments.cr-reviews-ajax-comments, .cr-all-reviews-shortcode) .commentlist .comment_container { grid-template-columns: 38px minmax(0, 1fr); gap: 12px; padding: 16px; }
	.chae-avatar, .chae :is(#reviews, .cr-all-reviews-shortcode) .comment_container img.avatar { width: 38px; height: 38px; font-size: 13.5px; }
	.chae :is(#reviews, .cr-all-reviews-shortcode) .commentlist ul.children { margin-left: 24px; }
}
.chae #review_form_wrapper { margin-top: 24px; padding: 24px; border-radius: 16px; background: var(--tint); }
.chae #review_form_wrapper:has(.chae-rform) { padding: 0; border-radius: 0; background: none; } /* the review form is its own card */

.chae-more > section, .chae-more .related, .chae-more .upsells { display: flex; flex-direction: column; gap: 28px; }
.chae-more h2 { margin: 0; text-align: center; font-size: 40px; }
.chae-more h2::after { content: ""; display: block; width: 56px; height: 3px; margin: 16px auto 0; border-radius: 2px; background: linear-gradient(90deg, var(--teal), var(--blue)); }

/* ---------- product page: buy box extras (inc/product-page.php) ---------- */
.chae-pricerow { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.chae .chae-buy__summary .chae-pricerow .price { margin: 0; }
.chae-size { padding: 4px 12px; border-radius: 999px; background: var(--teal-08); color: var(--ink); font-size: 13.5px; font-weight: 700; }
.chae-savechip { padding: 4px 12px; border-radius: 999px; background: var(--blue-deep); color: #fff; font-size: 13.5px; font-weight: 700; }
.chae .chae-buy__summary .chae-pricerow .price del { color: var(--muted-2); font-size: 22px; font-weight: 500; opacity: 1; } /* WooCommerce's 0.7 left the old price at 3:1 contrast */
.chae .woosb-products .woosb-product .woosb-price del { color: var(--muted-2); opacity: 1; } /* the bundle plugin's 0.5 on item prices: 3.2:1 */
.chae .chae-buy__summary .woocommerce-variation-description { margin: 0 0 12px; color: var(--muted); font-size: 14.5px; }
.chae .chae-buy__summary .woocommerce-variation-description p { margin: 0; }
.chae-lead { margin: 0; color: var(--ink); font-size: 15.5px; line-height: 1.55; }
.chae .chae-buy__summary form.cart { padding: 0; border: 0; background: none; }
.chae-buy__summary.has-points form.cart > .wc-points-rewards-product-message, .chae-buy__summary.has-points form.cart > .wc-points-rewards-product-message + br { display: none; }
.chae-plans { min-width: 0; margin: 0; padding: 0; border: 0; }
.chae-plans__legend { margin: 0 0 10px; padding: 0; color: var(--muted); font-size: 13px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae .chae-plans .wcsatt-options-prompt-radios { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 12px; margin: 0; padding: 0; list-style: none; }
.chae .chae-plans .wcsatt-options-prompt-radio { margin: 0; padding: 0; }
.chae .chae-plan { position: relative; box-sizing: border-box; display: grid; grid-template-columns: 18px minmax(0, 1fr); align-items: center; gap: 4px 10px; height: 100%; margin: 0; padding: 16px 16px 14px; border: 2px solid var(--line-2); border-radius: 16px; background: #f7faf9; cursor: pointer; transition: border-color 0.15s, background 0.15s; }
.chae .chae-plan:hover { border-color: rgba(0, 98, 99, 0.45); }
.chae .chae-plan:has(input:checked) { border-color: var(--teal); background: #fff; }
.chae .chae-plan input { grid-column: 1; grid-row: 1; width: 18px; height: 18px; margin: 0; accent-color: var(--teal); }
.chae-plan__name { grid-column: 2; grid-row: 1; color: var(--ink); font-size: 15px; font-weight: 700; }
.chae-plan__price { grid-column: 2; color: var(--ink); font-size: 22px; font-weight: 700; }
.chae-plan--sub .chae-plan__price { color: var(--teal); }
.chae-plan__price del { margin-left: 6px; color: var(--muted-2); font-size: 14px; font-weight: 400; }
.chae-plan__note { grid-column: 2; color: var(--muted); font-size: 13px; line-height: 1.4; }
/* Subscriptions' ".wcsatt-options-product-prompt-radio label > span { padding-left: 0.2em }" outranked the badge (2px
   left, 10px right: the text sat off-centre) and nudged the card's text; these win it back. */
.chae .chae-plans .chae-plan > span:not(.chae-plan__badge) { padding-left: 0; }
.chae .chae-plans .chae-plan__badge { position: absolute; top: -11px; right: 14px; padding: 3px 10px; border-radius: 999px; background: var(--blue-deep); color: #fff; font-size: 12px; font-weight: 800; }
.chae .chae-buy__summary .wcsatt-options-product-wrapper { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 12px; }
.chae .chae-buy__summary .wcsatt-options-product-wrapper select { height: 40px; padding: 0 14px; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; font: inherit; font-size: 14px; }
.chae-perks { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 0; padding: 0; list-style: none; color: var(--ink); font-size: 14px; }
.chae-perks li { display: flex; align-items: center; gap: 8px; }
.chae-perks svg { flex-shrink: 0; color: var(--teal); }
.chae .chae-setcard { display: grid; grid-template-columns: 88px minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 14px; border: 1px solid rgba(0, 98, 99, 0.16); border-radius: 18px; background: #eaf4f4; color: var(--ink); }
.chae .chae-setcard:hover { border-color: var(--teal); color: var(--ink); }
.chae-setcard__img { display: block; width: 88px; height: 72px; object-fit: cover; border-radius: 12px; background: #fff; }
.chae-setcard__text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.chae-setcard__eyebrow { color: var(--blue-deep); font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae-setcard__name { font-family: var(--head); font-size: 16px; font-weight: 700; }
.chae-setcard__line { color: var(--muted); font-size: 13.5px; }
.chae-setcard__line strong { color: var(--ink); }
.chae-setcard__go { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: var(--teal); color: #fff; }

/* rating row: stars, "22 reviews" and "1 answered question" stay whole on one line each */
.chae .chae-buy__summary .woocommerce-product-rating { flex-wrap: wrap; gap: 4px 12px; }
.chae .chae-buy__summary .woocommerce-product-rating a { white-space: nowrap; font-weight: 600; }
.chae .chae-buy__summary .woocommerce-product-rating::before, .chae .chae-buy__summary .woocommerce-product-rating::after { display: none; } /* WooCommerce's clearfix: in a flex row they add gaps */
.chae .chae-buy__summary .chae-sold { color: var(--muted); white-space: nowrap; } /* "3,800+ sold" (chae_pdp_sold_html) */
.chae .chae-buy__summary .woocommerce-product-rating > * + .chae-sold::before { content: ""; display: inline-block; width: 4px; height: 4px; margin: 0 12px 0 0; border-radius: 50%; background: var(--line-2); vertical-align: middle; } /* the same dot as the Q&A link's separator */
.chae .chae-buy__summary .cr-qna-separator { margin: 0 !important; }
.chae .chae-buy__summary .cr-qna-separator { width: 4px; height: 4px; overflow: hidden; border-radius: 50%; background: var(--line-2); color: transparent; }
.chae .chae-buy__summary .chae-pricerow .price { font-size: 30px !important; }

/* key ingredients (inc/product-page.php) */
.chae-keychips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.chae-keychips__label { margin-right: 4px; color: var(--muted); font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae .chae-keychips a { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px 6px 10px; border-radius: 999px; background: var(--blue-08); color: var(--blue-deep); font-size: 13.5px; font-weight: 700; transition: background 0.15s, color 0.15s; }
.chae .chae-keychips a:hover { background: var(--blue-deep); color: #fff; }

/* options (Size, Count) as buttons; WooCommerce's dropdown stays, hidden (assets/js/product.js) */
.chae .chae-buy__summary table.variations { width: 100%; margin: 0; border: 0; border-collapse: collapse; }
.chae .chae-buy__summary table.variations :is(tbody, tr, th, td) { display: block; width: auto; padding: 0; border: 0; background: none; text-align: left; line-height: 1.4; }
.chae .chae-buy__summary table.variations tr + tr { margin-top: 16px; }
.chae .chae-buy__summary form.variations_form { row-gap: 20px; }
.chae .chae-buy__summary table.variations th.label { margin-bottom: 10px; }
.chae .chae-buy__summary table.variations th.label label { margin: 0; color: var(--muted); font-size: 13px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae-swatches ~ select, .chae-swatches ~ .reset_variations { display: none !important; }
.chae-swatches { display: flex; flex-wrap: wrap; gap: 10px; }
.chae .chae-swatch { display: inline-flex; flex-direction: row; flex-wrap: wrap; align-items: baseline; align-content: center; justify-content: center; gap: 2px 8px; min-width: 0; min-height: 44px; margin: 0; padding: 9px 14px; border: 2px solid var(--line-2); border-radius: 14px; background: #f7faf9; color: var(--ink); font: inherit; font-size: 15px; font-weight: 700; line-height: 1.25; text-align: center; cursor: pointer; transition: border-color 0.15s, background 0.15s, box-shadow 0.15s; }
.chae .chae-swatch:hover { border-color: rgba(0, 98, 99, 0.45); }
.chae .chae-swatch:focus-visible { outline: 3px solid rgba(0, 142, 175, 0.4); outline-offset: 2px; }
.chae .chae-swatch[aria-pressed="true"] { border-color: var(--teal); background: #fff; box-shadow: inset 0 0 0 1px var(--teal); }
.chae-swatch__price { color: var(--muted); font-size: 13px; font-weight: 500; }
.chae-swatch[aria-pressed="true"] .chae-swatch__price { color: var(--teal); font-weight: 700; }
.chae .chae-swatch.is-unavailable { border-style: dashed; background: #f4f6f5; color: #636d6b; text-decoration: line-through; } /* readable (5:1), not faded: opacity took it to 2.75:1 */
.chae .chae-swatch.is-unavailable .chae-swatch__price { color: #636d6b; }
/* Amounts only (gift card $10–$100): one even row of compact buttons, so $100 doesn't drop to a row of its own. */
.chae-swatches:has(.chae-swatch[data-is-price]) { display: grid; grid-template-columns: repeat(auto-fit, minmax(52px, 1fr)); gap: 8px; }
.chae .chae-swatch[data-is-price] { min-width: 0; padding: 8px 4px; align-items: center; text-align: center; }
/* WooCommerce Gift Cards' "Send as gift?": a teal option row like the rest of the buy box, not a bare browser checkbox. */
.chae .wc_gc_send_as_gift_wrapper { margin: 0 0 4px; }
.chae .wc_gc_send_as_gift_wrapper label { display: inline-flex; align-items: center; gap: 10px; padding: 11px 16px; border: 1.5px solid var(--line-2); border-radius: 12px; background: #f7faf9; color: var(--ink); font-size: 15px; font-weight: 700; cursor: pointer; }
.chae .wc_gc_send_as_gift_wrapper label:has(input:checked) { border-color: var(--teal); background: #fff; }
.chae .wc_gc_send_as_gift_wrapper input[type="checkbox"] { width: 20px; height: 20px; margin: 0; accent-color: var(--teal); }
/* The chosen option's price moves up beside the title (product.js); the plan cards and stock notes stay here. */
.chae .chae-buy__summary .woocommerce-variation-price > :is(.price, .wc-points-rewards-product-message, br) { display: none; }
.chae .chae-buy__summary .single_variation:not(:empty) { margin-bottom: 14px; }
.chae .chae-buy__summary .woocommerce-variation-add-to-cart { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.chae .chae-buy__summary .woocommerce-variation-add-to-cart > :is(.clear, .gift-certificates) { display: none; }
.chae .chae-buy__summary .quantity:not(:has(input:not([type="hidden"]))) { display: none !important; } /* sold one at a time: no box, no gap (WooCommerce sets it inline) */
/* "This is a gift" (Subscriptions' gifting, shown with Subscribe & Save) on its own line, so it doesn't squeeze the
   quantity and Add to cart into a 99px button on phones (2026-10-14 phone run-through); simple products too. */
.chae .chae-buy__summary :is(.woocommerce-variation-add-to-cart, form.cart) > .wcsg_add_recipient_fields_container { flex-basis: 100%; }
.chae-buy__summary.has-points .variations_button > p.points { display: none; }
.chae .chae-buy__summary .first-payment-date:has(small:empty) { display: none; }

/* stock notes that still show: low stock, backorder, out of stock ("In stock" is in the perks row) */
/* body.chae.woocommerce: WooCommerce's "div.product .stock" (an olive #958e09, 3.4:1 on white, under the WCAG 4.5:1)
   outranked the plain .chae selector, so the amber here never showed (2026-10-14 sitewide check). */
.chae.woocommerce .chae-buy__summary .stock { display: inline-flex; align-items: center; gap: 8px; margin: 0; color: #8a5a00; font-size: 14px; font-weight: 700; }
.chae .chae-buy__summary .stock::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.chae .chae-buy__summary .stock.out-of-stock { color: #b3261e; }
.chae-perks__dot { display: inline-block; vertical-align: 1px; width: 10px; height: 10px; margin: 0 8px 0 3px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 4px rgba(0, 98, 99, 0.14); }
.chae-perks li strong { font-weight: 700; }
/* Subscribe & Save "How often" buttons (assets/js/product.js) in place of the plugin's "Deliver" dropdown */
.chae-freq { margin: 4px 0 0; }
.chae-freq__title { margin: 0 0 8px; color: var(--ink); font-size: 14px; font-weight: 700; }
.chae-freq__opts { display: flex; flex-wrap: wrap; gap: 8px; }
.chae .chae-freq__opt { display: inline-flex; align-items: center; min-height: 42px; margin: 0; padding: 0 16px; border: 1.5px solid var(--line-2); border-radius: 999px; background: #fff; color: var(--ink); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; box-shadow: none; }
.chae .chae-freq__opt[aria-pressed="true"] { border-color: var(--teal); background: var(--tint); color: var(--teal); box-shadow: inset 0 0 0 1px var(--teal); }
.chae .chae-freq__opt:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }
.chae-freq__hint { margin: 8px 0 0; color: var(--muted); font-size: 13px; }
.chae-trust { display: grid; grid-template-columns: repeat(3, auto); justify-content: start; gap: 8px 24px; padding-top: 14px; border-top: 1px solid var(--line); }

/* a set's contents (WPC bundles' list under the button) */
.chae-setitems__title { margin: 0 0 4px; color: var(--muted); font-size: 13px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae .chae-buy__summary .woosb-wrap { padding: 14px 18px 8px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.chae .chae-buy__summary .woosb-wrap .woosb-products { margin: 0; border: 0; }
.chae .chae-buy__summary .woosb-products .woosb-product { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.chae .chae-buy__summary .woosb-products .woosb-product:last-child { border-bottom: 0; }
.chae .chae-buy__summary .woosb-products .woosb-product > div { padding: 0; }
.chae .chae-buy__summary .woosb-products .woosb-product .woosb-thumb { width: 56px; }
.chae .chae-buy__summary .woosb-products .woosb-product .woosb-thumb img { width: 56px; height: 56px; object-fit: contain; border-radius: 12px; background: var(--tint); }
.chae .chae-buy__summary .woosb-products .woosb-product .woosb-name { color: var(--muted); font-size: 14.5px; line-height: 1.4; }
.chae .chae-buy__summary .woosb-products .woosb-product .woosb-name a { color: var(--ink); font-weight: 700; }
.chae .chae-from { font-size: max(12px, 0.62em); font-weight: 600; color: var(--muted); } /* never below 12px: on cards it came out ~7px (2026-10-17 sweep) */

/* ---------- a pick-your-own set: the Essential Oil Trio (inc/pick-set.php, assets/js/pick-set.js) ----------
   The name and offer, ready-made trios, scent filters and the grid, and a tray of slots: sticky beside the choices,
   or under them on phones, where the sticky bar shows the picks until then. Each oil's tile and slot carry its label color as --oil-soft (a light
   tint): the bottle photos are on white, multiplied onto it. States are classes the speed plugin's trimmed first-load
   CSS keeps (.is-active, .is-done, .is-error; tools/launch/flyingpress.php). */
.chae-pick { padding-top: 8px; padding-bottom: 32px; }
.chae-pick [hidden] { display: none !important; }
.chae-pick__layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; grid-template-areas: "head tray" "main tray" "tips tray"; gap: 32px 48px; align-items: start; }
.chae-pick__head { grid-area: head; display: flex; align-items: center; gap: 24px; min-width: 0; }
.chae-pick__hero { flex: none; width: 150px; height: 150px; border-radius: 22px; background: var(--tint); object-fit: cover; }
.chae-pick__intro { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; }
.chae .chae-pick__title { margin: 0; font-size: 38px; line-height: 1.15; }
.chae-pick__offer { margin: 0; max-width: 560px; color: var(--text); font-size: 15.5px; line-height: 1.5; }
.chae-pick__offer strong { display: block; margin-bottom: 2px; color: var(--teal); font-family: var(--head); font-size: 20px; font-weight: 700; }
.chae .chae-pick .woocommerce-product-rating { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0; font-size: 14px; }

.chae-pick__tray { grid-area: tray; position: sticky; top: 24px; display: flex; flex-direction: column; gap: 14px; min-width: 0; padding: 22px 22px 20px; border: 1px solid var(--panel-border); border-radius: 24px; background: #fff; box-shadow: var(--shadow); transition: box-shadow 0.2s; }
.chae-pick__tray.is-error { box-shadow: 0 0 0 3px rgba(0, 98, 99, 0.35), var(--shadow); }
.chae-pick__trayhead { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.chae .chae-pick__traytitle { margin: 0; font-size: 22px; }
.chae-pick__status { color: var(--muted); font-size: 14px; font-weight: 700; white-space: nowrap; }
.chae-pick__status:focus { outline: none; }
.chae-pick.is-done .chae-pick__status { color: var(--teal); }
.chae-pick__slots { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.chae-pick__slot { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; }
.chae-pick__slotart { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; aspect-ratio: 1; border: 2px dashed var(--line-2); border-radius: 18px; background: var(--tint); }
.chae-pick__slot.is-active .chae-pick__slotart { border: 2px solid transparent; background: var(--oil-soft, var(--tint)); }
.chae-pick__slotnum { color: var(--muted-2); font-family: var(--head); font-size: 22px; font-weight: 700; }
.chae-pick__slot.is-active .chae-pick__slotnum { display: none; }
.chae-pick__slotimg { position: absolute; top: 8%; left: 8%; width: 84%; height: 84%; object-fit: contain; mix-blend-mode: multiply; }
.chae-pick__slotname { min-height: 1.35em; color: var(--ink); font-size: 13.5px; font-weight: 700; line-height: 1.35; text-align: center; overflow-wrap: anywhere; }
.chae .chae-pick__slotx { position: absolute; top: -9px; right: -9px; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0; border: 1px solid var(--line-2); border-radius: 50%; background: #fff; color: var(--ink); box-shadow: var(--shadow-sm); cursor: pointer; }
.chae .chae-pick__slotx:hover { border-color: var(--teal); color: var(--teal); }
.chae-pick__slot.is-new .chae-pick__slotart { animation: chae-pick-pop 0.35s ease-out; }
@keyframes chae-pick-pop { 0% { transform: scale(0.82); } 60% { transform: scale(1.06); } 100% { transform: none; } }
.chae-pick__sum { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding-top: 14px; border-top: 1px solid var(--line); }
.chae-pick__total { margin: 0; color: var(--ink); font-size: 26px; font-weight: 700; line-height: 1.2; }
.chae-pick__total del { margin-left: 2px; color: var(--muted-2); font-size: 17px; font-weight: 500; }
.chae .chae-pick__tray form.cart { display: flex; margin: 0 !important; padding: 0; border: 0; background: none; } /* WooCommerce's 2em under the form */
.chae .chae-pick__tray form.cart::before, .chae .chae-pick__tray form.cart::after { display: none; }
.chae .chae-pick__tray form.cart .quantity, .chae-pick__tray .gift-certificates, .chae-pick__tray .woosb-wrap, .chae-pick__tray .first-payment-date { display: none !important; } /* one set at a time; the plugin's list stays in the page for its script */
.chae .chae-pick__tray .single_add_to_cart_button { flex: 1; min-height: 52px; margin: 0; font-size: 16px; float: none; }
/* Not ready yet ("Pick 2 more"): quiet teal on pale, still readable, and it takes taps — the bundle plugin's own
   not-ready style (.woosb-disabled: half opacity, ignores taps, all !important) is overruled; here a tap says what's
   missing (pick-set.js). */
.chae .chae-pick:not(.is-done) .chae-pick__tray .single_add_to_cart_button { border-color: transparent !important; background: #e3efef !important; box-shadow: none !important; color: var(--teal) !important; opacity: 1 !important; cursor: pointer !important; transform: none !important; pointer-events: auto !important; }
.chae-pick__tray .chae-perks { flex-direction: column; gap: 8px; font-size: 14px; }
.chae-pick__tray .chae-trust { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 8px; padding-top: 12px; font-size: 12.5px; } /* one line, each item whole ("Secure / checkout" and "Made in / USA" broke in two, 2026-10-15) */
.chae-pick__tray .chae-trust li { white-space: nowrap; }
.chae-pick__tray .chae-formnotice { margin: 0; }
.chae .chae-pick__toast { position: fixed; z-index: 60; left: 50%; bottom: 24px; max-width: calc(100% - 32px); margin: 0; padding: 12px 18px; border-radius: 14px; background: var(--ink); box-shadow: 0 12px 30px rgba(0, 0, 0, 0.2); color: #fff; font-size: 14.5px; font-weight: 700; line-height: 1.4; text-align: center; transform: translateX(-50%); }

.chae-pick__main { grid-area: main; display: flex; flex-direction: column; gap: 40px; min-width: 0; }
.chae .chae-pick__h { margin: 0 0 14px; font-size: 22px; }
.chae-pick__startrow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.chae .chae-pick__starter { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; min-width: 0; margin: 0; padding: 14px 14px 12px; border: 1.5px solid var(--line-2); border-radius: 18px; background: #fff; color: var(--ink); font: inherit; text-align: left; cursor: pointer; transition: border-color 0.15s, box-shadow 0.15s; }
.chae .chae-pick__starter:hover { border-color: var(--teal); box-shadow: var(--shadow-sm); }
.chae .chae-pick__starter.is-active { border-color: var(--teal); box-shadow: inset 0 0 0 1px var(--teal); }
.chae-pick__startimgs { display: flex; margin-bottom: 8px; }
.chae-pick__startimgs > span { display: flex; width: 46px; height: 46px; margin-right: -10px; overflow: hidden; border: 2px solid #fff; border-radius: 50%; background: var(--oil-soft, var(--tint)); }
.chae-pick__startimgs img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.chae-pick__startname { font-family: var(--head); font-size: 16px; font-weight: 700; line-height: 1.25; }
.chae-pick__startoils { color: var(--ink); font-size: 13.5px; font-weight: 600; line-height: 1.35; }
.chae-pick__startline { color: var(--muted); font-size: 13px; line-height: 1.35; }
.chae-pick__startprice { margin-top: auto; padding-top: 8px; font-size: 15px; }
.chae-pick__startprice del { color: var(--muted-2); font-size: 13px; }
.chae-pick__startgo { color: var(--teal); font-size: 14px; font-weight: 700; }
.chae-pick__starter.is-active .chae-pick__startgo::before { content: "\2713\00a0"; }

.chae-pick__browsehead { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px; margin-bottom: 18px; }
.chae-pick__browsehead .chae-pick__h { margin: 0; }
.chae-pick__filters { display: flex; flex-wrap: wrap; gap: 8px; }
.chae .chae-pick__filter { display: inline-flex; align-items: center; gap: 6px; min-height: 38px; margin: 0; padding: 0 14px; border: 1px solid rgba(0, 98, 99, 0.18); border-radius: 999px; background: #fff; color: var(--ink); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.chae .chae-pick__filter span { color: var(--muted-2); font-size: 12.5px; font-weight: 600; }
.chae .chae-pick__filter:hover { border-color: var(--teal); color: var(--teal); }
.chae .chae-pick__filter.is-active { border-color: var(--teal); background: var(--teal); color: #fff; }
.chae .chae-pick__filter.is-active span { color: rgba(255, 255, 255, 0.85); }
.chae-pick__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)); gap: 22px 14px; margin: 0; padding: 0; list-style: none; }
.chae-pick__oil { position: relative; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.chae-pick__photo { position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 1; margin-bottom: 8px; border: 2px solid transparent; border-radius: 18px; background: var(--oil-soft, var(--tint)); cursor: pointer; transition: border-color 0.15s; }
.chae-pick__photo img { width: 80%; height: 80%; object-fit: contain; mix-blend-mode: multiply; transition: transform 0.2s ease; }
.chae-pick__oil:not(.is-out):hover .chae-pick__photo img { transform: translateY(-3px); }
.chae-pick__oil.is-active .chae-pick__photo { border-color: var(--teal); }
.chae-pick__badge { position: absolute; top: 8px; left: 8px; display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; border-radius: 999px; background: #fff; box-shadow: 0 3px 8px rgba(26, 36, 33, 0.1); color: var(--teal); font-size: 11.5px; font-weight: 700; line-height: 1.3; }
.chae-pick__badge .chae-icon { color: var(--blue); }
.chae-pick__count { position: absolute; top: 8px; right: 8px; display: flex; align-items: center; justify-content: center; min-width: 28px; height: 28px; padding: 0 7px; border-radius: 999px; background: var(--teal); color: #fff; font-size: 13.5px; font-weight: 800; }
.chae .chae-pick__name { margin: 0; font-family: var(--head); font-size: 16px; font-weight: 700; line-height: 1.25; }
.chae .chae-pick__name a { color: var(--ink); }
.chae .chae-pick__name a:hover { color: var(--teal); }
.chae-pick__line { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.35; }
.chae-pick__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 6px; margin: 3px 0 0; color: var(--ink); font-size: 15px; line-height: 1.3; }
.chae-pick__price del { color: var(--muted-2); font-size: 13px; }
.chae-pick__size { position: absolute; left: 8px; bottom: 8px; padding: 2px 8px; border-radius: 999px; background: rgba(255, 255, 255, 0.92); color: var(--ink); font-size: 11.5px; font-weight: 700; line-height: 1.4; }
.chae-pick__warn { margin: 1px 0 0; color: #8a4b00; font-size: 12px; font-weight: 700; line-height: 1.35; }
.chae-pick__ctl { margin-top: auto; padding-top: 8px; }
.chae .chae-pick__add { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; min-height: 40px; margin: 0; padding: 0 10px; border: 1.5px solid var(--teal); border-radius: 999px; background: #fff; color: var(--teal); font: inherit; font-size: 14.5px; font-weight: 700; cursor: pointer; transition: background-color 0.15s, color 0.15s; }
.chae .chae-pick__add:hover { background: var(--teal); color: #fff; }
.chae .chae-pick.is-done .chae-pick__add { border-color: var(--line-2); color: var(--muted-2); }
.chae .chae-pick.is-done .chae-pick__add:hover { background: #fff; color: var(--muted-2); }
.chae-pick__step { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 40px; border-radius: 999px; background: var(--teal); color: #fff; }
.chae-pick__step.is-error { animation: chae-pick-nudge 0.4s ease-out; }
@keyframes chae-pick-nudge { 0%, 100% { transform: none; } 30% { transform: scale(1.06); } }
.chae .chae-pick__step button { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin: 0; padding: 0; border: 0; border-radius: 50%; background: none; color: #fff; font: inherit; font-size: 20px; font-weight: 700; line-height: 1; cursor: pointer; }
.chae .chae-pick__step button:hover { background: rgba(255, 255, 255, 0.16); }
.chae .chae-pick__step button[aria-disabled="true"] { opacity: 0.45; cursor: default; }
.chae .chae-pick__step button[aria-disabled="true"]:hover { background: none; }
.chae-pick__n { font-size: 15px; font-weight: 800; }
.chae-pick__oil.is-out .chae-pick__photo { cursor: default; filter: grayscale(1); opacity: 0.6; }
.chae-pick__soldout { display: flex; align-items: center; justify-content: center; min-height: 40px; border-radius: 999px; background: var(--tint); color: var(--muted); font-size: 14px; font-weight: 700; }

.chae-pick__tips { grid-area: tips; min-width: 0; }
.chae-pick__tips .chae-pick__h { margin-bottom: 14px; }
.chae-pick__tips ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.chae-pick__tips li { display: flex; gap: 12px; padding: 16px 18px; border-radius: 18px; background: var(--tint); color: var(--text); font-size: 14px; line-height: 1.5; }
.chae-pick__tips li > svg { flex: none; margin-top: 2px; color: var(--teal); }
.chae-pick__tips strong { display: block; margin-bottom: 2px; color: var(--ink); font-size: 15px; }

/* the sticky bar's slots, in place of the product photo */
.chae-pick__minislots { display: flex; gap: 6px; }
.chae-pick__mini { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1.5px dashed var(--line-2); border-radius: 12px; background: var(--tint); }
.chae-pick__mini.is-active { border: 1.5px solid transparent; background: var(--oil-soft, var(--tint)); }
.chae-pick__mini img { width: 34px; height: 34px; object-fit: contain; mix-blend-mode: multiply; }

@media (prefers-reduced-motion: reduce) {
	.chae-pick__slot.is-new .chae-pick__slotart, .chae-pick__step.is-error { animation: none; }
	.chae-pick__photo img, .chae-pick__tray { transition: none; }
}
@media (max-width: 1100px) {
	.chae-pick__layout { grid-template-columns: minmax(0, 1fr) 320px; gap: 28px 32px; }
	.chae-pick__tray .chae-trust :is(.chae-icon, .chae-line-icon) { display: none; } /* the narrower tray: the words alone fit one line */
	.chae-pick__startrow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.chae-pick__tips ul { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 782px) {
	.chae-pick { padding-top: 0; }
	.chae-pick__layout { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "main" "tray" "tips"; gap: 28px; }
	.chae-pick__head { align-items: flex-start; gap: 16px; }
	.chae-pick__hero { width: 96px; height: 96px; border-radius: 16px; }
	.chae .chae-pick__title { font-size: 28px; }
	.chae-pick__offer { font-size: 14.5px; }
	.chae-pick__offer strong { font-size: 17px; }
	.chae-pick__tray { position: static; gap: 12px; padding: 18px 16px 16px; border-radius: 20px; }
	.chae-pick__slots { gap: 10px; }
	.chae-pick__tray .chae-trust { display: none; } /* the perks say it; the tray stays short above the oils */
	.chae-pick__main { gap: 32px; }
	.chae .chae-pick__h { font-size: 20px; }
	.chae-pick__startrow { display: flex; margin: 0 -16px; padding: 2px 16px 8px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
	.chae .chae-pick__starter { flex: 0 0 216px; scroll-snap-align: start; }
	.chae-pick__filters { flex-wrap: nowrap; margin: 0 -16px; padding: 0 16px 4px; overflow-x: auto; scrollbar-width: none; }
	.chae .chae-pick__filter { flex: none; }
	.chae .chae-pick__toast { bottom: calc(86px + env(safe-area-inset-bottom)); }
	.chae-pick__minislots { gap: 4px; }
	.chae-pick__mini { width: 36px; height: 36px; border-radius: 10px; }
	.chae-pick__mini img { width: 30px; height: 30px; }
}
@media (max-width: 560px) {
	.chae-pick__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 8px; }
	.chae-pick__photo { margin-bottom: 6px; border-radius: 14px; }
	.chae-pick__badge { top: 5px; left: 5px; padding: 2px 6px; font-size: 10.5px; }
	.chae-pick__badge .chae-icon { display: none; }
	.chae-pick__count { top: 5px; right: 5px; min-width: 24px; height: 24px; padding: 0 5px; font-size: 12.5px; }
	.chae .chae-pick__name { font-size: 14px; }
	.chae-pick__line { font-size: 12px; }
	.chae-pick__price { font-size: 13.5px; }
	.chae-pick__price del { font-size: 11.5px; }
	.chae-pick__size { left: 5px; bottom: 5px; padding: 1px 6px; font-size: 10.5px; }
	.chae-pick__warn { font-size: 11px; }
	.chae .chae-pick__add { min-height: 38px; font-size: 13.5px; }
	.chae-pick__step { min-height: 38px; }
	.chae .chae-pick__step button { width: 36px; height: 38px; }
}
.chae .chae-buy__summary .woosb-products .woosb-product .woosb-name a:hover { color: var(--teal); }
.chae .chae-buy__summary .woosb-availability:not(:has(*)) { display: none; }
/* An item's low-stock note repeated the bundle's own line under the price ("Only 50 left in stock" twice, 2026-10-17
   sweep); out of stock still shows on the item. */
.chae .chae-buy__summary .woosb-availability:not(:has(.out-of-stock)) { display: none; }
.chae .chae-buy__summary .woosb-products .woosb-product .woosb-price { width: auto; color: var(--ink); font-size: 15px; font-weight: 700; white-space: nowrap; }

/* photos: more than six thumbnails scroll in one row instead of wrapping */

@media (max-width: 560px) {
	/* plan cards as full-width rows: name and note left, price right */
	.chae .chae-plans .wcsatt-options-prompt-radios { grid-template-columns: minmax(0, 1fr); gap: 14px; }
	.chae .chae-plan { grid-template-columns: 18px minmax(0, 1fr) auto; padding: 14px 16px; }
	.chae-plan__price { grid-column: 3; grid-row: 1 / span 2; justify-self: end; text-align: right; }
	.chae-plan__price del { display: block; margin: 0; }
	.chae-trust { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 10px; font-size: 12.5px; }
	.chae-trust li { flex-direction: column; align-items: flex-start; gap: 4px; }
	/* Equal buttons, two or three to a row: five flavors on one row cut their names off ("Gorill Vanill"). */
	.chae .chae-swatches:not(:has(.chae-swatch[data-is-price])) { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 100px), 1fr)); gap: 8px; }
	.chae .chae-swatch { min-width: 0; }
	.chae .chae-buy__summary .woocommerce-product-rating { gap: 4px 14px; }
	.chae .chae-buy__summary .woocommerce-product-rating .star-rating { font-size: 12.5px; }
	.chae .chae-buy__summary .cr-qna-separator, .chae .chae-buy__summary .woocommerce-product-rating > * + .chae-sold::before { display: none; }
}

/* ---------- product page: sticky bar, section links, sections ---------- */
.chae-pbar { position: fixed; z-index: 45; top: 0; left: 0; right: 0; padding: 10px 0; border-bottom: 1px solid var(--line); background: #fff; box-shadow: 0 10px 26px rgba(26, 36, 33, 0.1); transform: translateY(-110%); transition: transform 0.22s ease; } /* solid: at 0.97 the price and tagline behind it ghosted through (2026-10-17 sweep) */
.chae-pbar.is-visible { transform: none; }
body.admin-bar .chae-pbar { top: var(--wp-admin--admin-bar--height, 32px); }
.chae-pbar__inner { display: flex; align-items: center; gap: 24px; }
.chae-pbar__nav { display: flex; gap: 24px; min-width: 0; overflow: hidden; }
.chae .chae-pbar__nav a.is-clipped { visibility: hidden; } /* A link that doesn't fit whole is hidden, never cut mid-word (assets/js/product.js). */
.chae .chae-pbar__nav a { padding: 12px 0; color: var(--ink); font-size: 14.5px; font-weight: 700; white-space: nowrap; box-shadow: inset 0 -3px 0 transparent; }
.chae .chae-pbar__nav a.is-active, .chae .chae-pbar__nav a:hover { color: var(--teal); box-shadow: inset 0 -3px 0 var(--teal); }
.chae-pbar__buy { display: flex; align-items: center; gap: 12px; flex-shrink: 0; margin-left: auto; }
.chae-pbar__img { width: 44px; height: 44px; object-fit: contain; border-radius: 10px; background: var(--tint); }
.chae-pbar__text { display: flex; flex-direction: column; line-height: 1.3; }
.chae-pbar__name { display: none; } /* On the product's own page the name is redundant; the room goes to the section links. */
.chae-pbar__price { color: var(--ink); font-size: 15px; font-weight: 700; white-space: nowrap; }
body.chae .chae-pbar__add { min-height: 44px; padding: 0 20px !important; }
.chae-secchips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.chae .chae-secchips a { padding: 9px 16px; border: 1px solid rgba(0, 98, 99, 0.18); border-radius: 999px; background: #fff; color: var(--ink); font-size: 14.5px; font-weight: 700; }
.chae .chae-secchips a:hover { border-color: var(--teal); color: var(--teal); }
.chae-secs { display: flex; flex-direction: column; gap: 28px; margin-top: 24px; }
.chae-sec { scroll-margin-top: 96px; }
/* Product page sections sit open on the white page, lined up with its edges; the tinted ones (Goes well with, How to
   use) stay rounded tinted cards (2026-10-14, the open look). */
.chae-sec__panel { padding: 44px 0 48px; }
.chae-sec--tint .chae-sec__panel { padding: 44px 48px 48px; border-radius: var(--r-panel); background: var(--tint); }
.chae-sec__head { display: flex; flex-direction: column; gap: 6px; margin-bottom: 24px; }
.chae .chae-sec__title { margin: 0; font-size: 34px; }
.chae-muted { margin: 0; color: var(--muted); font-size: 14.5px; }
.chae-richtext { color: var(--text); font-size: 16px; line-height: 1.75; }
.chae-richtext > :first-child { margin-top: 0; }
.chae-richtext > :last-child { margin-bottom: 0; }
.chae .chae-richtext h2, .chae .chae-richtext h3 { margin: 24px 0 12px; font-size: 22px; }
.chae-richtext ul, .chae-richtext ol { padding-left: 1.2em; }
.chae-richtext li { margin-bottom: 6px; }
.chae-richtext img { border-radius: 12px; }

/* reviews */
.chae-reviews-top { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 28px; align-items: start; } /* the cards keep their own height (even with each other), not the summary's: a short review beside the star bars was a tall, mostly empty card */
.chae-reviews-top:not(:has(.chae-rsum)) { grid-template-columns: minmax(0, 1fr); }
.chae-rsum { display: flex; flex-direction: column; gap: 10px; padding: 22px; border: 1px solid rgba(0, 98, 99, 0.1); border-radius: 18px; background: var(--tint); }
.chae-rsum__avg { color: var(--teal); font-family: var(--head); font-size: 52px; font-weight: 700; line-height: 1; }
.chae-rsum__n { color: var(--muted); font-size: 14px; }
.chae-rsum__bar { display: grid; grid-template-columns: 48px minmax(0, 1fr) 24px; align-items: center; gap: 10px; color: var(--muted); font-size: 13px; }
.chae-rsum__bar > span:last-child { text-align: right; }
.chae-rsum__track { display: flex; height: 8px; overflow: hidden; border-radius: 4px; background: #dbe5e3; }
.chae-rsum__track span { background: var(--teal); }
/* Product ratings (chae_pdp_stars): stars past the rating are grey. The home page's plain five stars stay teal. */
.chae-stars__s { color: #c9d6d3; }
.chae-stars__s.is-on { color: var(--teal); }
.chae-stars svg { display: block; }
.chae-rcards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; } /* two cards share the row rather than leave a third of it empty */
.chae-rcard { display: flex; flex-direction: column; gap: 12px; padding: 22px; border: 1px solid var(--line); border-radius: 18px; }
.chae-rcard__text { flex-grow: 1; margin: 0; color: var(--ink); font-size: 15px; line-height: 1.6; }
.chae-rcard__by { margin: 0; color: var(--muted); font-size: 13.5px; }
.chae-rcard__by strong { color: var(--ink); }
/* A bundle's items' ratings (chae_pdp_render_kit_reviews()): each item linked with its own score; review cards say which product. */
.chae-kitrev__items { display: flex; flex-direction: column; gap: 8px; margin: 6px 0 0; padding: 12px 0 0; border-top: 1px solid rgba(0, 98, 99, 0.12); list-style: none; font-size: 13.5px; }
.chae-kitrev__items li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 2px 10px; }
.chae .chae-kitrev__items a { color: var(--ink); font-weight: 700; text-decoration: none; }
.chae .chae-kitrev__items a:hover { color: var(--teal); text-decoration: underline; }
.chae-kitrev__score { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); white-space: nowrap; }
.chae-rcard__about { margin: 0; color: var(--muted); font-size: 13px; }
.chae .chae-rcard__about a { color: var(--teal); font-weight: 700; }
.chae-kitrev__first { margin: 16px 0 0; }
/* a long list of rated items (the oil trio's), under the cards (inc/product-page.php chae_pdp_render_kit_reviews()) */
.chae-kitrev__all { margin-top: 22px; }
.chae .chae-kitrev__alltitle { margin: 0 0 10px; color: var(--muted); font-family: var(--body); font-size: 12.5px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae-kitrev__chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.chae-kitrev__chips li { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-size: 13.5px; line-height: 1.4; }
.chae .chae-kitrev__chips a { color: var(--ink); font-weight: 700; }
.chae .chae-kitrev__chips a:hover { color: var(--teal); }
.chae-kitrev__chips .chae-kitrev__score { gap: 4px; }
.chae-kitrev__chips .chae-icon { color: var(--teal); }
.chae-rcard__ok { display: inline-flex; align-items: center; gap: 4px; color: var(--teal); }
.chae-allreviews { margin-top: 24px; }
.chae-allreviews > summary { list-style: none; }
.chae-allreviews > summary::-webkit-details-marker { display: none; }
.chae-allreviews[open] > summary { margin-bottom: 20px; }
.chae-allreviews[data-wordless] > summary { display: none; } /* ratings with no words: the details only hold the form */
.chae-allreviews__body .woocommerce-Reviews-title { display: none; } /* The section already says Reviews. */
/* Review form: Customer Reviews' "Add a review" form, product pages + Store reviews (customer-reviews-woocommerce/cr-review-form.php).
   CusRev's own rules are scoped to .cr-ajax-reviews-review-form / .cr-all-reviews-shortcode; ours go through .chae .chae-rform. */
.chae .chae-rform { margin: 0; overflow: hidden; border: 1px solid var(--panel-border); border-radius: 24px; background: #fff; box-shadow: var(--shadow-sm); }
.chae .chae-rform .chae-rform__nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: auto; margin: 0; padding: 20px 24px 20px 30px; border: 0; border-bottom: 1px solid var(--line); }
.chae .chae-rform .cr-nav-left svg { display: none; }
.chae .chae-rform .chae-rform__title { margin: 0; font-size: 26px; }
.chae .chae-rform .cr-nav-right { flex-shrink: 0; width: 42px; height: 42px; border-radius: 50%; background: var(--tint); color: var(--teal); transition: background 0.15s; }
.chae .chae-rform .cr-nav-right:hover { background: var(--teal-08); }
.chae .chae-rform .cr-nav-right svg { display: block; width: 100%; height: 100%; margin: 0; padding: 7px; box-sizing: border-box; cursor: pointer; } /* CusRev closes the form on a click on this svg, so it fills the circle */
.chae-rform__body { display: grid; grid-template-columns: 290px minmax(0, 1fr); }
.chae-rform__side { display: flex; flex-direction: column; gap: 24px; padding: 30px 28px; border-right: 1px solid var(--line); background: var(--panel-bg); }
.chae .chae-rform .cr-review-form-item { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; max-width: none; margin: 0; padding: 0; border: 0; }
.chae .chae-rform .cr-review-form-item img { width: 112px; height: 112px; margin: 0; padding: 8px; border: 1px solid var(--line); border-radius: 18px; background: #fff; object-fit: contain; }
.chae .chae-rform .cr-review-form-item p { margin: 0; }
.chae .chae-rform .cr-review-form-item small { display: block; margin-bottom: 4px; color: var(--blue-deep); font-size: 12.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.chae .chae-rform .cr-review-form-item span { display: block; color: var(--ink); font-family: var(--head); font-size: 19px; font-weight: 600; line-height: 1.3; }
.chae-rform__tips-title { margin: 0 0 10px; color: var(--ink); font-size: 15px; font-weight: 700; }
.chae-rform__tips ul { display: flex; flex-direction: column; gap: 9px; margin: 0; padding: 0; list-style: none; }
.chae-rform__tips li { display: flex; gap: 9px; color: var(--muted); font-size: 14.5px; line-height: 1.45; }
.chae-rform__tips li svg { flex-shrink: 0; margin-top: 2px; color: var(--blue); }
.chae-rform__reward { display: flex; gap: 10px; margin: 0; padding: 12px 14px; border-radius: 14px; background: var(--blue-08); color: var(--ink); font-size: 14.5px; font-weight: 600; line-height: 1.45; }
.chae-rform__reward svg { flex-shrink: 0; color: var(--blue-deep); }
.chae-rform__fields { display: flex; flex-direction: column; gap: 22px; min-width: 0; padding: 30px 32px 32px; }
.chae .chae-rform .chae-rform__fields > *, .chae .chae-rform .cr-review-form-rating, .chae .chae-rform .cr-onsite-questions { max-width: none; margin: 0; padding: 0; }
/* labels above the fields (CusRev floats them on the border) */
.chae .chae-rform :is(.cr-review-form-lbl, .cr-onsite-question label, .cr-review-form-rating-label) { position: static; display: block; width: auto; height: auto; margin: 0 0 8px; padding: 0; background: none; color: var(--ink); font-family: var(--body); font-size: 15px; font-weight: 700; line-height: 1.3; }
.chae .chae-rform .cr-review-form-rating-label .required, .chae .chae-rform .cr-onsite-question .required { color: var(--blue-deep); }
.chae .chae-rform .cr-onsite-question { margin: 0; }
.chae .chae-rform :is(.cr-review-form-txt, .cr-review-form-comment-txt, .cr-onsite-question-inp) { display: block; width: 100%; min-height: 50px; margin: 0; padding: 12px 16px; border: 1.5px solid var(--line-2); border-radius: 12px; background: #fff; box-shadow: none; color: var(--ink); font-family: var(--body); font-size: 16px; line-height: 1.5; transition: border-color 0.15s, box-shadow 0.15s; }
.chae .chae-rform .cr-review-form-comment-txt { min-height: 140px; resize: vertical; }
.chae .chae-rform :is(.cr-review-form-txt, .cr-review-form-comment-txt, .cr-onsite-question-inp)::placeholder { color: #8a9594; }
.chae .chae-rform :is(.cr-review-form-txt, .cr-review-form-comment-txt, .cr-onsite-question-inp):focus { border-color: var(--teal); outline: none; box-shadow: 0 0 0 3px rgba(0, 98, 99, 0.14); }
.chae .chae-rform .cr-review-form-error :is(.cr-review-form-txt, .cr-review-form-comment-txt) { border: 1.5px solid #b3261e; }
.chae .chae-rform .cr-review-form-field-error { margin: 6px 0 0; color: #b3261e; font-size: 13.5px; font-weight: 600; }
.chae .chae-rform .cr-review-form-ne { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.chae .chae-rform .cr-review-form-ne > div { width: auto; }
.chae-rform__hint { margin: 6px 0 0; color: var(--muted); font-size: 13px; }
/* stars */
.chae .chae-rform .cr-review-form-rating .cr-review-form-rating-cont { display: flex; align-items: center; gap: 4px; width: fit-content; height: auto; padding: 0; border-radius: 12px; }
.chae .chae-rform .cr-review-form-rating .cr-review-form-rating-cont .cr-review-form-rating-inner { height: auto; padding: 0; line-height: 0; }
.chae .chae-rform .cr-review-form-rating .cr-review-form-rating-cont .cr-review-form-rating-inner svg { width: 38px; height: 35px; }
.chae .chae-rform .cr-rating-deact path { fill: #d5e0dd; }
.chae .chae-rform .cr-rating-act path { fill: var(--teal); }
.chae .chae-rform .cr-review-form-rating .cr-review-form-rating-cont .cr-review-form-rating-nbr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.chae-rform__word { margin-left: 10px; color: var(--muted); font-size: 15px; font-weight: 600; line-height: 1; }
.chae-rform__word.is-set { color: var(--teal); }
.chae .chae-rform .cr-review-form-rating.cr-review-form-error .cr-review-form-rating-cont { padding: 6px 10px; background: #fbeceb; }
/* photos */
.chae .chae-rform .cr-form-item-media-none { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border: 2px dashed rgba(0, 98, 99, 0.3); border-radius: 16px; background: #f5faf9; cursor: pointer; transition: border-color 0.15s, background 0.15s; }
.chae .chae-rform .cr-form-item-media-none:hover, .chae .chae-rform .cr-form-item-media-none:focus-visible { border-color: var(--teal); background: #fff; outline: none; }
.chae .chae-rform .chae-rform__camera { display: flex; flex-shrink: 0; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 50%; background: #fff; box-shadow: var(--shadow-sm); color: var(--teal); }
.chae .chae-rform .cr-form-item-media-none > span { margin: 0; }
.chae-rform__media-text { color: var(--muted); font-size: 13.5px; line-height: 1.45; }
.chae-rform__media-text strong { display: block; margin-bottom: 2px; color: var(--teal); font-size: 15.5px; }
.chae .chae-rform .cr-form-item-media-preview .cr-upload-images-containers { border-radius: 12px; overflow: hidden; }
.chae .chae-rform .cr-form-item-media-preview .cr-form-item-media-add { border: 2px dashed rgba(0, 98, 99, 0.3); border-radius: 12px; color: var(--teal); }
/* agreement + buttons */
.chae .chae-rform .cr-review-form-terms label { display: flex; align-items: flex-start; gap: 10px; color: var(--text); font-size: 14.5px; line-height: 1.5; cursor: pointer; }
.chae .chae-rform .cr-review-form-terms .cr-review-form-checkbox { flex-shrink: 0; width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--teal); }
.chae .chae-rform .cr-review-form-terms span { color: var(--text); line-height: 1.5; }
.chae .chae-rform .cr-review-form-terms a { text-decoration: underline; text-underline-offset: 3px; }
.chae .chae-rform .cr-review-form-buttons { display: flex; flex-wrap: wrap; gap: 12px; padding-top: 4px; }
.chae .chae-rform .cr-review-form-buttons .cr-review-form-submit { display: inline-flex; align-items: center; justify-content: center; width: auto; min-width: 200px; min-height: 52px; margin: 0; padding: 0 28px; border: 0 !important; border-radius: var(--r-btn) !important; background: var(--btn-fill) !important; box-shadow: 0 3px 0 var(--btn-edge); color: #fff !important; font: 700 16px var(--body); transition: transform 0.12s ease, box-shadow 0.12s ease; }
.chae .chae-rform .cr-review-form-buttons .cr-review-form-submit:hover { transform: translate(0, 3px); box-shadow: 0 0 0 var(--btn-edge); }
.chae .chae-rform .cr-review-form-buttons .cr-review-form-cancel { display: inline-flex; align-items: center; justify-content: center; width: auto; min-height: 52px; margin: 0; padding: 0 24px; border: 1.5px solid var(--line-2) !important; border-radius: var(--r-btn) !important; background: #fff !important; color: var(--muted) !important; font: 700 16px var(--body); }
.chae .chae-rform .cr-review-form-buttons .cr-review-form-cancel:hover { border-color: var(--teal) !important; color: var(--teal) !important; }
/* after posting, and "sign in first" */
.chae .chae-rform.cr-review-form-res .chae-rform__side { display: none; }
.chae .chae-rform.cr-review-form-res .chae-rform__body { grid-template-columns: minmax(0, 1fr); }
.chae .chae-rform :is(.cr-review-form-result, .cr-review-form-not-logged-in) { gap: 16px; max-width: 520px; margin: 0 auto; padding: 44px 24px; text-align: center; }
.chae .chae-rform :is(.cr-review-form-result, .cr-review-form-not-logged-in) span { padding: 0; color: var(--ink); font-size: 17px; line-height: 1.55; }
.chae .chae-rform :is(.cr-review-form-result, .cr-review-form-not-logged-in) .cr-review-form-continue { display: inline-flex; align-items: center; height: auto; min-height: 48px; padding: 0 24px; border: 0; border-radius: var(--r-btn); background: var(--btn-fill); box-shadow: 0 3px 0 var(--btn-edge); color: #fff; font: 700 15.5px var(--body); text-decoration: none; }
/* sign-in box (chae_cr_signin()), Q&A's ask form (.chae-rform--qna) and inline answer form (.chae-rform--answer) */
.chae-rform { scroll-margin-top: 100px; }
.chae .chae-rform .chae-rform__signin { display: flex; flex-direction: column; align-items: center; gap: 8px; max-width: 520px; margin: 0 auto; padding: 40px 24px 44px; text-align: center; }
.chae .chae-rform .chae-rform__signin span { padding: 0; color: var(--ink); font-family: var(--head); font-size: 22px; font-weight: 600; line-height: 1.3; }
.chae .chae-rform .chae-rform__signin p { margin: 0; color: var(--muted); font-size: 15px; }
.chae-rform__signin-btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 14px; }
.chae-rform__aside-note { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.chae .chae-rform__aside-note a { font-weight: 700; }
.chae .chae-qa .chae-rform--qna { margin-bottom: 8px; }
.chae .chae-qa .cr-qna-block .chae-rform--answer { margin: 18px 0 8px; padding: 0; border: 1px solid var(--panel-border); border-radius: 20px; background: #fff; }
.chae .chae-rform--answer .chae-rform__title { font-size: 20px; }
.chae-qa__helpful { margin-right: 10px; color: var(--muted); font-size: 13.5px; } /* 4px ran it into the thumb (2026-10-17 sweep) */
/* The forms lay out by their own width (they sit full width, in a half column beside "How to use", or on a phone):
   two columns from 760px, one column below, and stacked fields below 540px. */
.chae-rform { container: rform / inline-size; }
@container rform (max-width: 759px) {
	.chae-rform__body { grid-template-columns: minmax(0, 1fr); }
	.chae-rform__side { gap: 0; padding: 16px 22px; border-right: 0; border-bottom: 1px solid var(--line); }
	.chae .chae-rform .cr-review-form-item { flex-direction: row; align-items: center; }
	.chae .chae-rform .cr-review-form-item img { width: 64px; height: 64px; padding: 4px; border-radius: 12px; }
	.chae .chae-rform .cr-review-form-item span { font-size: 17px; }
	.chae-rform__tips, .chae-rform__reward { display: none; } /* the photo box and the email hint repeat these */
	.chae-rform__aside-note { margin-top: 10px; font-size: 13.5px; }
	.chae-rform__fields { gap: 20px; padding: 24px 22px 26px; }
}
@container rform (max-width: 539px) {
	.chae .chae-rform .chae-rform__nav { padding: 16px 16px 16px 20px; }
	.chae .chae-rform .chae-rform__title { font-size: 22px; }
	.chae-rform__side { padding: 14px 18px; }
	.chae-rform__fields { gap: 18px; padding: 20px 18px 22px; }
	.chae .chae-rform .chae-rform__signin { padding: 30px 18px 32px; }
	.chae .chae-rform .cr-review-form-ne { grid-template-columns: minmax(0, 1fr); }
	.chae .chae-rform .cr-review-form-buttons > :is(.cr-review-form-submit, .cr-review-form-cancel) { flex: 1 1 auto; min-width: 0; padding: 0 16px; }
	.chae .chae-rform .cr-review-form-rating .cr-review-form-rating-cont { flex-wrap: wrap; }
	.chae-rform__word { flex-basis: 100%; margin: 8px 0 0; }
}
/* customer photos (inc/product-page.php chae_pdp_render_review_media) */
.chae-rphotos { margin-top: 26px; }
.chae .chae-rphotos__title { margin: 0 0 12px; font-size: 18px; font-weight: 600; }
.chae .chae-rphotos__title span { color: var(--muted); font-family: var(--body); font-size: 15px; font-weight: 500; }
.chae-rphotos__row { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 6px; scrollbar-width: thin; }
.chae .chae-rphotos__item { position: relative; flex: 0 0 auto; width: 108px; height: 108px; margin: 0; padding: 0; overflow: hidden; border: 0; border-radius: 14px; background: var(--tint); cursor: zoom-in; transition: transform 0.15s ease; }
.chae .chae-rphotos__item:hover { transform: translateY(-2px); }
.chae .chae-rphotos__item:focus-visible { outline: 3px solid rgba(0, 142, 175, 0.45); outline-offset: 2px; }
.chae-rphotos__item img { display: block; width: 100%; height: 100%; object-fit: cover; }
.chae .chae-rphotos__item.is-video { background: linear-gradient(150deg, var(--teal) 0%, var(--blue-deep) 100%); cursor: pointer; }
.chae-rphotos__play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; }
.chae-rphotos__invite { display: flex; align-items: center; gap: 10px; margin: 22px 0 0; padding: 12px 16px; border-radius: 14px; background: var(--tint); color: var(--ink); font-size: 14.5px; line-height: 1.5; }
.chae-rphotos__invite svg { flex-shrink: 0; color: var(--teal); }
.chae .chae-rphotos__invite a { font-weight: 700; }
.chae-rphotos__add { margin: 10px 0 0; color: var(--muted); font-size: 14px; }
.chae .chae-rphotos__add a { font-weight: 700; }
.chae-rphoto { width: min(900px, calc(100% - 32px)); max-height: calc(100% - 48px); margin: auto; padding: 0; overflow: hidden; border: 0; border-radius: 22px; background: #fff; box-shadow: 0 30px 80px rgba(0, 30, 30, 0.35); }
.chae-rphoto[open] { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
.chae-rphoto::backdrop { background: rgba(8, 28, 28, 0.62); }
.chae-rphoto__media { display: flex; align-items: center; justify-content: center; min-height: 340px; background: #102322; }
.chae-rphoto__media img, .chae-rphoto__media video { display: block; max-width: 100%; max-height: 78vh; object-fit: contain; }
.chae-rphoto__review { display: flex; flex-direction: column; justify-content: center; gap: 10px; padding: 32px 28px; overflow: auto; }
.chae-rphoto__stars { margin: 0; color: var(--teal); font-size: 18px; letter-spacing: 2px; }
.chae-rphoto__text { margin: 0; color: var(--ink); font-size: 16px; line-height: 1.6; }
.chae-rphoto__by { margin: 0; color: var(--muted); font-size: 14px; font-weight: 700; }
.chae .chae-rphoto__close { position: absolute; z-index: 2; top: 12px; right: 12px; display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.94); color: var(--ink); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18); cursor: pointer; }
@media (max-width: 782px) {
	.chae-rphoto[open] { grid-template-columns: minmax(0, 1fr); }
	.chae-rphoto__media { min-height: 240px; }
	.chae-rphoto__review { padding: 18px 18px 22px; }
	.chae .chae-rphotos__item { width: 92px; height: 92px; }
}

/* overview */
.chae-overview.has-facts { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 48px; align-items: start; }
.chae-overview__body ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 24px; padding: 0; list-style: none; }
.chae-overview__body ul li { position: relative; margin: 0; padding-left: 28px; color: var(--ink); font-size: 15px; line-height: 1.5; }
.chae-overview__body ul li p { margin: 0; }
.chae-overview__body ul li::before { content: ""; position: absolute; left: 0; top: 2px; width: 18px; height: 18px; background: var(--blue); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; }
.chae-facts { display: flex; flex-direction: column; gap: 18px; margin: 0; padding: 24px; border-radius: 20px; background: var(--tint); }
.chae-facts div { display: flex; flex-direction: column; gap: 4px; }
.chae-facts dt { color: var(--blue-deep); font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae-facts dd { margin: 0; color: var(--ink); font-size: 15px; line-height: 1.55; }
.chae-facts dd ul { display: flex; flex-direction: column; gap: 6px; margin: 2px 0 0; padding: 0; list-style: none; }
.chae-facts dd li { position: relative; padding-left: 16px; }
.chae-facts dd li::before { content: ""; position: absolute; left: 2px; top: 0.6em; width: 6px; height: 6px; border-radius: 50%; background: var(--teal, #008e8e); }

/* ingredients */
.chae-ingredients-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 32px; align-items: start; }
.chae-keycards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.chae-keycard { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 22px 22px 20px 74px; border: 1px solid rgba(0, 98, 99, 0.1); border-radius: 18px; background: var(--tint); }
.chae-keycard__n { position: absolute; top: 20px; left: 22px; display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: var(--blue-deep); color: #fff; font-family: var(--head); font-weight: 700; }
.chae .chae-keycard__name { margin: 0; font-size: 18px; font-weight: 600; }
.chae-keycard__text { margin: 0; color: var(--muted); font-size: 14.5px; line-height: 1.55; }
.chae .chae-keycard__link { font-size: 14px; font-weight: 700; }
.chae-fold { margin-top: 16px; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.chae-fold > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; color: var(--ink); font-weight: 700; list-style: none; cursor: pointer; }
.chae-fold > summary::-webkit-details-marker { display: none; }
.chae-fold > summary::after { content: "+"; color: var(--teal); font-size: 22px; line-height: 1; }
.chae-fold[open] > summary::after { content: "–"; }
.chae-fold > div { padding: 0 20px 18px; }
.chae-folds { display: flex; flex-direction: column; gap: 10px; }
.chae-folds .chae-fold { margin-top: 0; }
.chae-ingredients-side { position: sticky; top: 104px; display: flex; flex-direction: column; gap: 16px; } /* stays beside the cards as they scroll */
.chae-keycards > .chae-keycard:last-child:nth-child(odd) { grid-column: 1 / -1; } /* no lone card in the last row */
.chae-madewithout { padding: 20px 22px; border: 1px solid rgba(0, 98, 99, 0.1); border-radius: 20px; background: var(--tint); color: var(--ink); }
.chae-madewithout__title { display: block; margin-bottom: 12px; color: var(--blue-deep); font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae-madewithout ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; margin: 0; padding: 0; list-style: none; font-size: 14.5px; font-weight: 500; }
.chae-madewithout li::before { content: "×"; margin-right: 8px; color: var(--teal); font-weight: 700; }
.chae-fulllist { padding: 20px 22px; border: 1px solid var(--line); border-radius: 18px; }
.chae .chae-fulllist__title { margin: 0 0 10px; font-size: 18px; font-weight: 600; }
.chae-fulllist__body { position: relative; max-height: 260px; overflow: hidden; font-size: 14px; line-height: 1.6; }
.chae-fulllist__body::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 60px; background: linear-gradient(rgba(255, 255, 255, 0), #fff); }
.chae-fulllist.is-open .chae-fulllist__body { max-height: none; }
.chae-fulllist.is-open .chae-fulllist__body::after, .chae-fulllist.is-short .chae-fulllist__body::after, .chae-fulllist.is-short .chae-fulllist__toggle { display: none; }
.chae-fulllist__toggle { margin-top: 10px; padding: 0; border: 0; background: none; color: var(--teal); font: inherit; font-weight: 700; cursor: pointer; }

/* how to use + Q&A */
.chae-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.chae-duo.is-single { grid-template-columns: minmax(0, 1fr); }
.chae-duo .chae-sec__panel { height: 100%; box-sizing: border-box; padding: 40px 0; }
.chae .chae-duo .chae-sec__title { font-size: 34px; }
.chae-qa .cr-qna-block > h2 { display: none; }
.chae-sec--how .chae-sec__panel { display: flex; flex-direction: column; padding: 40px 44px; border-radius: var(--r-panel); background: var(--tint); }
.chae-sec--how .chae-sec__head { flex-direction: row; align-items: center; gap: 14px; }
.chae-howto__icon { display: flex; flex-shrink: 0; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; background: var(--blue-deep); color: #fff; }
.chae-sec--how .chae-sec__body { display: flex; flex: 1; flex-direction: column; gap: 22px; }
.chae-howto { font-size: 16.5px; }
.chae-howto ol { margin: 0 0 16px; padding: 0; list-style: none; counter-reset: chae-step; }
.chae-howto ol > li { position: relative; margin-bottom: 10px; padding-left: 38px; counter-increment: chae-step; }
.chae-howto ol > li::before { content: counter(chae-step); position: absolute; left: 0; top: 0; display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: var(--blue-deep); color: #fff; font-size: 13px; font-weight: 800; line-height: 1; }
.chae-howto ol + p { margin-top: 18px; }
.chae-howto__photo { position: relative; flex: 1; min-height: 200px; max-height: 440px; margin: 0; overflow: hidden; border-radius: 18px; background: var(--tint); }
.chae-howto__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Q&A (Customer Reviews' block) in the site's look */
.chae .chae-qa .cr-qna-block .cr-qna-search-block { gap: 10px; margin-bottom: 24px; }
.chae .chae-qa .cr-qna-block .cr-input-text { height: 48px; padding-left: 42px; border: 1.5px solid var(--line-2); border-radius: 999px; color: var(--ink); font-size: 15px; }
.chae .chae-qa .cr-qna-block .cr-input-text:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(0, 98, 99, 0.14); }
.chae .chae-qa .cr-qna-block .cr-qna-search-block .cr-qna-search-icon { left: 15px; fill: var(--teal); }
.chae .chae-qa .cr-qna-block .cr-qna-search-block .cr-qna-ask-button { flex-shrink: 0; min-height: 48px; margin: 0; padding: 0 20px; border: 1.5px solid var(--teal); border-radius: var(--r-btn); background: #fff; color: var(--teal); font: inherit; font-size: 15px; font-weight: 700; white-space: nowrap; }
.chae .chae-qa .cr-qna-block .cr-qna-search-block .cr-qna-ask-button:hover { background: var(--teal); color: #fff; }
.chae .chae-qa .cr-qna-list-q-cont + .cr-qna-list-q-cont { margin-top: 22px; }
.chae .chae-qa .cr-qna-block .cr-qna-list-block .cr-qna-list-q-cont :is(.cr-qna-list-q-q-l, .cr-qna-list-q-a-l, .cr-qna-list-q-b-l) { min-width: 44px; }
.chae .chae-qa .cr-qna-list-q-icon :is(circle, path) { stroke: var(--teal); }
.chae .chae-qa .cr-qna-list-q-a-l .cr-qna-list-q-icon path { fill: var(--teal); stroke: none; }
.chae .chae-qa .cr-qna-block .cr-qna-list-block .cr-qna-list-q-cont .cr-qna-list-q-q .cr-qna-list-q-q-r .cr-qna-list-question { color: var(--ink); font-family: var(--head); font-size: 18px; font-weight: 700; line-height: 1.4; white-space: pre-line; }
.chae .chae-qa .cr-qna-block .cr-qna-list-block .cr-qna-list-q-cont :is(.cr-qna-list-q-q-r, .cr-qna-list-q-a-r) .cr-qna-list-q-author { margin-top: 6px; color: var(--muted); font-size: 13.5px; font-style: normal; line-height: 1.4; }
.chae .chae-qa .cr-qna-block .cr-qna-list-block .cr-qna-list-q-cont .cr-qna-list-q-author .cr-qna-list-q-author-b { color: var(--ink); font-weight: 700; }
.chae .chae-qa .cr-qna-block .cr-qna-list-block .cr-qna-list-q-cont .cr-qna-list-q-a .cr-qna-list-q-a-r .cr-qna-list-answer { padding: 14px 18px; border-left: 3px solid var(--teal); border-radius: 0 14px 14px 0; background: var(--tint); }
.chae .chae-qa .cr-qna-block .cr-qna-list-block .cr-qna-list-q-cont .cr-qna-list-q-a .cr-qna-list-q-a-r .cr-qna-list-answer-s { color: var(--text); font-size: 15.5px; line-height: 1.6; }
.chae .chae-qa .cr-qna-block .cr-qna-list-block .cr-qna-list-q-cont .cr-qna-list-q-author-verified { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; color: var(--teal); font-size: 13px; font-weight: 700; }
.chae .chae-qa .cr-qna-list-q-author-verified svg { width: 14px; height: 14px; }
.chae .chae-qa .cr-qna-list-q-author-verified svg :is(path, circle) { stroke: currentColor; }
.chae .chae-qa .cr-qna-block .cr-qna-list-block .cr-qna-list-q-cont .cr-qna-list-q-b .cr-qna-list-q-b-r { align-items: center; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.chae .chae-qa .cr-qna-block .cr-qna-list-block .cr-qna-list-q-cont .cr-qna-ans-button { height: 40px; padding: 0 16px; border: 1.5px solid var(--line-2); border-radius: 999px; background: #fff; color: var(--teal); font: inherit; font-size: 14px; font-weight: 700; }
.chae .chae-qa .cr-qna-block .cr-qna-list-block .cr-qna-list-q-cont .cr-qna-ans-button:hover { border-color: var(--teal); }
.chae .chae-qa .cr-voting-cont-uni span.cr-voting-upvote svg .cr-voting-svg-ext { fill: var(--teal); }
.chae .chae-qa .cr-voting-cont-uni span.cr-voting-downvote svg .cr-voting-svg-ext { fill: var(--grey); }
.chae .chae-qa .cr-voting-cont-uni span.cr-voting-upvote-count { color: var(--teal); }
.chae .chae-qa .cr-voting-cont-uni span.cr-voting-downvote-count { color: var(--grey); }
.chae .chae-qa .cr-qna-block .cr-show-more-que { min-height: 44px; padding: 0 20px; border: 1.5px solid var(--teal); border-radius: var(--r-btn); background: #fff; color: var(--teal); font: inherit; font-weight: 700; }

/* More details with one part (often Weight + Dimensions): shown as spec tiles */
.chae-sec--more .chae-sec__panel { padding-bottom: 40px; }
/* Certifications: each seal with its name and what it means (replaces an old tab's table of two logos, 2026-10-15). */
.chae-seals { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; margin: 0 0 12px; padding: 0; list-style: none; }
.chae-seal { display: flex; align-items: center; gap: 18px; padding: 18px 22px; border: 1px solid rgba(0, 98, 99, 0.08); border-radius: 16px; background: var(--tint); }
.chae-seal img { flex-shrink: 0; width: 72px; height: auto; }
.chae-seal span { display: flex; flex-direction: column; gap: 3px; color: var(--muted); font-size: 14.5px; line-height: 1.5; }
.chae-seal strong { color: var(--ink); font-family: var(--head); font-size: 18px; font-weight: 600; }
.chae .chae-more-one table.shop_attributes { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; margin: 0; border: 0; }
.chae .chae-more-one table.shop_attributes tbody { display: contents; }
.chae .chae-more-one table.shop_attributes tr { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; border: 1px solid rgba(0, 98, 99, 0.08); border-radius: 16px; background: var(--tint); }
.chae .chae-more-one table.shop_attributes tr :is(th, td) { width: auto; padding: 0; border: 0; background: none !important; line-height: 1.45; text-align: left; }
.chae .chae-more-one table.shop_attributes tr th { color: var(--blue-deep); font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae .chae-more-one table.shop_attributes tr td { color: var(--ink); font-size: 15.5px; font-style: normal; }
.chae .chae-more-one table.shop_attributes td p { margin: 0; padding: 0; }

/* goes well with */
.chae-pairs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; align-items: start; }
.chae-pairs.is-single { grid-template-columns: minmax(0, 1fr); }
.chae .chae-pairs__title { margin: 0 0 6px; font-size: 22px; }
.chae-fbt { display: flex; flex-direction: column; gap: 18px; }
.chae-fbt__row { display: flex; align-items: center; gap: 10px; }
.chae-fbt__plus { color: var(--muted-2); font-size: 24px; font-weight: 700; }
.chae .chae-fbt__item { display: flex; flex-direction: column; align-items: center; gap: 8px; width: 150px; padding: 12px; border: 2px solid var(--teal); border-radius: 18px; background: #fff; color: var(--ink); text-align: center; transition: opacity 0.15s, border-color 0.15s; }
.chae .chae-fbt__item.is-off { border-color: var(--line-2); opacity: 0.45; }
.chae-fbt__item img { width: 104px; height: 104px; object-fit: contain; }
.chae-fbt__name { min-height: 36px; font-size: 13.5px; font-weight: 700; line-height: 1.35; }
.chae-fbt__price { color: var(--teal); font-size: 14px; font-weight: 700; }
.chae-fbt__picks { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; border: 0; }
.chae-fbt__picks label { display: flex; align-items: center; gap: 10px; color: var(--ink); font-size: 14.5px; cursor: pointer; }
.chae-fbt__picks input { width: 18px; height: 18px; margin: 0; accent-color: var(--teal); }
.chae-fbt__total { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; }
.chae-fbt__total > span { display: flex; flex-direction: column; }
.chae-fbt__total [data-fbt-total] { color: var(--ink); font-size: 24px; }
.chae-setlist { display: flex; flex-direction: column; gap: 14px; }
.chae-setlist__items { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.chae-setlist__items li { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; gap: 4px 14px; padding: 10px 14px 10px 10px; border: 1.5px solid var(--line); border-radius: 16px; background: #fff; }
.chae-setlist__items li.is-here { border-color: var(--teal); background: #eaf4f4; }
.chae-setlist__items img { width: 56px; height: 56px; object-fit: contain; border-radius: 12px; background: #fff; }
.chae-setlist__items .added_to_cart { grid-column: 2 / -1; margin: 0; }
.chae-setlist__text { display: flex; flex-direction: column; gap: 2px; color: var(--muted); font-size: 13.5px; }
.chae .chae-setlist__text a { color: var(--ink); font-size: 15px; font-weight: 700; }
.chae-setlist__here { padding: 5px 12px; border-radius: 999px; background: var(--teal); color: #fff; font-size: 12.5px; font-weight: 700; white-space: nowrap; }
body.chae .chae-setlist__items .chae-btn { min-height: 40px; padding: 0 16px !important; font-size: 14px; }
.chae .chae-setlist__cta { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; border-radius: 16px; background: var(--teal); color: #fff; }
.chae .chae-setlist__cta:hover { color: #fff; }
.chae-setlist__cta > span:first-child { display: flex; flex-direction: column; gap: 2px; font-size: 15px; }
.chae-setlist__cta > span:first-child span { color: #cfe8e8; font-size: 13.5px; }
body.chae .chae-setlist__cta .chae-btn { flex-shrink: 0; border-color: #fff; background: #fff; color: var(--teal); box-shadow: 0 3px 0 var(--btn-edge); }
body.chae .chae-setlist__cta .chae-btn:hover { transform: translate(0, 3px); box-shadow: 0 0 0 var(--btn-edge); background: #fff; }

/* ---------- express payment buttons (PayPal Payments: PayPal, Apple Pay, Google Pay) ----------
   Drawn by PayPal into its own containers: under Checkout in the cart summary and the side cart, at the top of
   and in the payment step of checkout, and under Add to cart where those locations are switched on in PayPal's
   settings. The buttons' look (colour, label, shape) is set there; this only fits them to the theme. */
.chae .ppc-button-wrapper, .chae .ppcp-button-apm { width: 100%; margin-top: 10px; }
.chae .ppc-button-wrapper:empty, .chae .ppcp-button-apm:empty { display: none; }
.chae .ppcp-button-apm { min-height: 45px; }
.chae apple-pay-button { --apple-pay-button-width: 100%; --apple-pay-button-height: 48px; --apple-pay-button-border-radius: 10px; display: block; }
.chae-sidecart__express:empty { display: none; }
.chae-sidecart__express { display: flex; flex-direction: column; }
.chae .cart_totals .ppc-button-wrapper, .chae .cart_totals .ppcp-button-apm { margin-top: 12px; }

/* ---------- routine finder (page-routine-finder.php, assets/js/routine.js) ---------- */
.chae-rf { padding: 48px; }
.chae-rf__intro { max-width: 720px; margin: 0 auto 32px; text-align: center; }
.chae .chae-rf__title { margin: 10px 0 12px; font-size: 42px; line-height: 1.15; }
.chae-rf__lead { margin: 0; color: var(--muted); font-size: 17px; line-height: 1.6; }
.chae-rf__quiz { max-width: 760px; margin: 0 auto; }
.chae-rf.is-done .chae-rf__quiz { display: none; }
.chae-rf.is-done .chae-rf__intro { margin-bottom: 0; }
.chae-rf__progress { height: 6px; overflow: hidden; border-radius: 3px; background: var(--teal-08); }
.chae-rf__progress span { display: block; width: 20%; height: 100%; border-radius: 3px; background: linear-gradient(90deg, var(--teal), var(--blue)); transition: width 0.3s ease; }
.chae-rf__count { margin: 12px 0 18px; color: var(--muted); font-size: 12.5px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae-rf__q { min-width: 0; margin: 0; padding: 0; border: 0; }
.chae .chae-rf__qtitle { margin: 0 0 18px; padding: 0; color: var(--ink); font-family: var(--head); font-size: 28px; font-weight: 600; line-height: 1.3; }
.chae-rf__hint { margin: -8px 0 16px; color: var(--muted); }
.chae-rf__options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.chae-rf__opt { position: relative; display: flex; flex-direction: column; gap: 3px; margin: 0; padding: 18px 20px 18px 56px; border: 2px solid var(--line-2); border-radius: 16px; background: #f7faf9; cursor: pointer; transition: border-color 0.15s, background 0.15s, box-shadow 0.15s; }
.chae-rf__opt:hover { border-color: rgba(0, 98, 99, 0.45); }
.chae-rf__opt input { position: absolute; top: 20px; left: 20px; width: 20px; height: 20px; margin: 0; accent-color: var(--teal); }
.chae-rf__opt:has(input:checked) { border-color: var(--teal); background: #fff; box-shadow: inset 0 0 0 1px var(--teal); }
.chae-rf__opt:has(input:focus-visible) { outline: 3px solid rgba(0, 142, 175, 0.4); outline-offset: 2px; }
.chae-rf__optmain { color: var(--ink); font-size: 16.5px; font-weight: 700; line-height: 1.35; }
.chae-rf__optsub { color: var(--muted); font-size: 14px; }
.chae-rf__nav { display: flex; align-items: center; gap: 12px; margin-top: 26px; }
.chae-rf__nav .chae-rf__next { margin-left: auto; }
body.chae .chae-rf__next:disabled { opacity: 0.4; cursor: not-allowed; transform: none; box-shadow: none !important; }
.chae .chae-rf__back { padding: 8px 0; border: 0; background: none; color: var(--teal); font: inherit; font-weight: 700; cursor: pointer; }
.chae .chae-rf__back:hover { color: var(--teal-press); text-decoration: underline; }
.chae-rf__noscript { margin: 0; padding: 18px; border-radius: 16px; background: var(--tint); }

.chae-rf-result { margin-top: 28px; scroll-margin-top: 24px; }
.chae-rf-result:focus { outline: none; }
.chae-rf-result__panel { padding: 44px 48px 48px; }
.chae-rf-result__head { display: flex; flex-direction: column; gap: 8px; margin-bottom: 28px; }
.chae .chae-rf-result__title { margin: 0; font-size: 36px; line-height: 1.2; }
.chae .chae-rf-result__title span { color: var(--muted); font-size: 0.72em; }
.chae-rf-result__lead { margin: 0; color: var(--muted); font-size: 16px; }
.chae .chae-rf-result__retake { align-self: flex-start; }
.chae-rf-steps { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; list-style: none; }
.chae-rf-step { display: grid; grid-template-columns: 40px 112px minmax(0, 1fr) auto; align-items: center; gap: 18px; padding: 16px 22px 16px 18px; border: 1px solid var(--line); border-radius: 20px; background: #fff; }
.chae-rf-step__n { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: var(--teal); color: #fff; font-family: var(--head); font-size: 17px; font-weight: 700; }
.chae-rf-step__img img { display: block; width: 112px; height: 112px; border-radius: 14px; background: var(--tint); object-fit: contain; }
.chae-rf-step__body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.chae-rf-step__when { color: var(--blue-deep); font-size: 12.5px; letter-spacing: 0.03em; }
.chae-rf-step__when strong { font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae .chae-rf-step__name { color: var(--ink); font-family: var(--head); font-size: 19px; font-weight: 700; line-height: 1.3; }
.chae .chae-rf-step__name:hover { color: var(--teal); }
.chae-rf-step__rating { color: var(--teal); font-size: 13.5px; font-weight: 700; }
.chae-rf-step__rating span:last-child { color: var(--muted); font-weight: 500; }
.chae-rf-step__why { margin: 2px 0 0; color: var(--text); font-size: 15px; line-height: 1.55; }
/* oil finder: what each oil matched, and the top pick */
.chae-rf-step__chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 0; }
.chae-rf-step__chips span { padding: 3px 10px; border-radius: 999px; background: var(--teal-08); color: var(--teal); font-size: 12.5px; font-weight: 700; }
.chae-rf-step.is-top { border-color: rgba(0, 98, 99, 0.35); box-shadow: 0 0 0 3px rgba(0, 98, 99, 0.08); }
.chae-rf-result__note { max-width: 640px; margin: 8px 0 0; padding: 10px 14px; border-radius: 12px; background: var(--blue-08); color: var(--ink); font-size: 14.5px; line-height: 1.5; }
.chae .chae-rf-result__note a { font-weight: 700; }
.chae .chae-rf-step__price { color: var(--ink); font-size: 18px; font-weight: 700; white-space: nowrap; }
.chae .chae-rf-step__price ins { text-decoration: none; }
.chae .chae-rf-step__price del { margin-right: 6px; color: var(--muted-2); font-size: 0.8em; font-weight: 500; }
/* Each product's own "Add to cart" (a one-product form.chae-addmany), under its price; "Add all" stays below the list. */
.chae-rf-step__buy { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.chae-rf-step__add { margin: 0; }
body.chae .chae-rf-step__addbtn { min-height: 40px; padding: 0 16px !important; font-size: 14px; white-space: nowrap; }
.chae-rf-step__buy .chae-formnotice { max-width: 240px; margin: 0; font-size: 13.5px; }
.chae-rf-buy { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin: 24px 0 0; padding: 22px 24px; border: 1px solid rgba(0, 98, 99, 0.12); border-radius: 20px; background: linear-gradient(165deg, #eaf5f5 0%, #fff 70%); }
.chae-rf-buy__total { display: flex; flex-direction: column; gap: 2px; }
.chae-rf-buy__total span { color: var(--muted); font-size: 13px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae-rf-buy__total strong { color: var(--ink); font-size: 28px; }
.chae-rf-buy .chae-btn { margin-left: auto; }
.chae-rf-buy__note { flex-basis: 100%; margin: 0; color: var(--muted); font-size: 14px; }
.chae .chae-rf-set { display: flex; align-items: center; gap: 16px; margin-top: 16px; padding: 18px 22px; border: 1px solid rgba(0, 98, 99, 0.16); border-radius: 18px; background: #eaf4f4; color: var(--ink); }
.chae .chae-rf-set:hover { border-color: var(--teal); color: var(--ink); }
.chae-rf-set__text { display: flex; flex: 1; flex-direction: column; gap: 3px; min-width: 0; }
.chae-rf-set__text strong { font-family: var(--head); font-size: 17px; }
.chae-rf-set__text > span:last-child { color: var(--muted); font-size: 14.5px; }
.chae-rf-set__go { display: flex; flex-shrink: 0; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: var(--teal); color: #fff; font-weight: 700; }
.chae-rf-notes { margin-top: 22px; color: var(--muted); font-size: 14px; line-height: 1.6; }
.chae-rf-notes p { margin: 0 0 8px; }
/* "Not sure where to start? Find your routine →" (home hero, Skincare banner) */
.chae .chae-quizlink { display: inline-flex; align-items: center; gap: 10px; padding: 10px 18px 10px 14px; border: 1px solid rgba(0, 98, 99, 0.18); border-radius: 999px; background: #fff; color: var(--ink); font-size: 14.5px; line-height: 1.35; }
.chae .chae-quizlink strong { color: var(--teal); }
.chae .chae-quizlink svg { flex-shrink: 0; color: var(--teal); }
.chae .chae-quizlink:hover { border-color: var(--teal); color: var(--ink); }
.chae .chae-banner__quiz { margin: 4px 0 0; color: var(--muted); font-size: 15px; }
.chae-banner__proof { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 2px 0 0; color: var(--muted); font-size: 14px; } /* the rating, then two facts (2026-10-16: was four generic claims in capitals) */
.chae .chae-banner__proof a { display: inline-flex; align-items: center; gap: 6px; color: var(--ink); font-weight: 700; text-decoration: none; }
.chae .chae-banner__proof a:hover span { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
.chae-banner__dot { color: var(--muted-2); }
@media (max-width: 782px) {
	.chae-rf { padding: 28px 18px; }
	.chae .chae-rf__title { font-size: 30px; }
	.chae-rf__lead { font-size: 15.5px; }
	.chae .chae-rf__qtitle { font-size: 22px; }
	.chae-rf__options { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.chae-rf__opt { padding: 15px 16px 15px 50px; }
	.chae-rf__opt input { top: 17px; left: 17px; }
	.chae-rf-result__panel { padding: 24px 16px 28px; }
	.chae .chae-rf-result__title { font-size: 26px; }
	.chae-rf-step { position: relative; grid-template-columns: 76px minmax(0, 1fr); gap: 6px 14px; padding: 14px; }
	.chae-rf-step__n { position: absolute; z-index: 1; top: 8px; left: 8px; width: 26px; height: 26px; font-size: 13px; box-shadow: 0 0 0 2px #fff; }
	.chae-rf-step__img { grid-row: 1 / span 2; align-self: start; }
	.chae-rf-step__img img { width: 76px; height: 76px; }
	.chae-rf-step__buy { grid-column: 2; flex-flow: row wrap; align-items: center; justify-content: space-between; }
	.chae .chae-rf-step__price { font-size: 16px; }
	.chae-rf-step__buy .chae-formnotice { flex-basis: 100%; order: 3; max-width: none; }
	.chae .chae-rf-step__name { font-size: 17px; }
	.chae-rf-buy { padding: 18px 16px; }
	.chae-rf-buy .chae-btn { width: 100%; margin-left: 0; }
	.chae .chae-quizlink { font-size: 13.5px; }
}

/* ---------- pages, posts, notices, forms ---------- */
.chae-page { padding-top: 36px; }
.chae-prose { padding: 48px 0; }
.chae-page__title { margin: 0 0 20px; font-size: 40px; }
.chae-prose__hero { border-radius: 18px; margin-bottom: 24px; }
.chae-meta { color: var(--muted-2); font-size: 13px; }
.chae-posts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.chae-posts .chae-post { border-radius: 18px; background: #fff; border: 1px solid var(--line); overflow: hidden; display: flex; flex-direction: column; color: var(--text) !important; } /* index.php's cards only — journal articles use .chae-post for their own kit */
.chae-post__img img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; }
.chae-post__body { padding: 18px 20px 22px; display: flex; flex-direction: column; gap: 6px; }
.chae-post__body strong { font-family: var(--head); font-size: 18px; font-weight: 600; color: var(--ink); }

.chae .woocommerce-message, .chae .woocommerce-info, .chae .woocommerce-error { border-top: 0; border-left: 4px solid var(--teal); border-radius: 14px; background: #fff; box-shadow: var(--shadow-sm); }
.chae .woocommerce-error { border-left-color: #b3261e; }
.chae .woocommerce-message::before, .chae .woocommerce-info::before { color: var(--teal); }
/* notice icons: line icons like the rest of the site, instead of WooCommerce's icon font */
.chae {
	--chae-icon-info: 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' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5.5M12 7.6v.1'/%3E%3C/svg%3E");
	--chae-icon-ok: 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' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12.3l2.7 2.7L16.2 9.5'/%3E%3C/svg%3E");
	--chae-icon-alert: 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' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.5V13M12 16.4v.1'/%3E%3C/svg%3E");
	--chae-icon-star: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.8l2.8 5.9 6.4.8-4.7 4.4 1.2 6.4L12 17.2l-5.7 3.1 1.2-6.4-4.7-4.4 6.4-.8z'/%3E%3C/svg%3E");
}
.chae .woocommerce-info::before, .chae .woocommerce-message::before, .chae .woocommerce-error::before { content: ""; width: 18px; height: 18px; background: currentColor; font-family: inherit; -webkit-mask: var(--chae-notice-icon) center / contain no-repeat; mask: var(--chae-notice-icon) center / contain no-repeat; }
.chae .woocommerce-info::before { --chae-notice-icon: var(--chae-icon-info); }
.chae .woocommerce-message::before { --chae-notice-icon: var(--chae-icon-ok); }
.chae .woocommerce-error::before { --chae-notice-icon: var(--chae-icon-alert); color: #b3261e; }
.chae input.input-text, .chae textarea, .chae select { border: 1px solid var(--line-2); border-radius: 10px; padding: 10px 12px; font: inherit; }

/* ---------- block content (pages and posts, incl. those converted from Beaver Builder) ---------- */
.chae-full { padding-bottom: 24px; overflow-x: clip; }
.chae-full > * { max-width: min(1100px, calc(100% - 48px)); margin: 0 auto; }
.chae-full > .alignwide { max-width: min(1248px, calc(100% - 48px)); }
.chae-full > .alignfull { max-width: none; }
.chae-bb-row { padding-top: 20px; padding-bottom: 20px; }
.chae-bb-row.has-background { padding-left: 24px; padding-right: 24px; }
.chae-full .wp-block-columns, .chae-prose .wp-block-columns { gap: 24px 40px; margin-bottom: 24px; }
.chae-full :where(h1) { font-size: clamp(32px, 4vw, 48px); }
.chae-full :where(h2), .chae-prose :where(h2) { font-size: clamp(26px, 3vw, 36px); }
.chae-full :where(h3), .chae-prose :where(h3) { font-size: 22px; }
.chae-full :where(.wp-block-image img), .chae-prose :where(.wp-block-image img) { height: auto; }
.chae .wp-block-separator { border: 0; border-top: 1px solid var(--line); opacity: 1; }
.chae .wp-block-details { margin: 0 0 10px; padding: 14px 18px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.chae .wp-block-details summary { cursor: pointer; font-weight: 700; color: var(--ink); }
.chae .wp-block-details[open] summary { margin-bottom: 10px; }
.chae .wp-block-buttons { gap: 18px; }
.chae .wp-block-button__link {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 24px;
	border: 1.5px solid var(--teal); border-radius: var(--r-btn); background: #fff; color: var(--teal); box-shadow: none;
	font-family: var(--body); font-size: 15px; font-weight: 700; line-height: 1.2; text-decoration: none;
	transition: background-color 0.15s ease, transform 0.12s ease, box-shadow 0.12s ease;
}
.chae .wp-block-button__link:hover { background: #e9f3f3; color: var(--teal-press); }
.chae .wp-block-button__link.has-teal-background-color, .chae .wp-block-button.is-style-fill .wp-block-button__link { background: var(--btn-fill); color: #fff; box-shadow: 0 3px 0 var(--btn-edge); }
.chae .wp-block-button__link.has-teal-background-color:hover, .chae .wp-block-button.is-style-fill .wp-block-button__link:hover { transform: translate(0, 3px); box-shadow: 0 0 0 var(--btn-edge); background: var(--btn-fill); color: #fff; }
.has-teal-color { color: var(--teal) !important; }
.has-teal-background-color { background-color: var(--teal) !important; }
.has-teal-dark-color { color: var(--teal-press) !important; }
.has-teal-dark-background-color { background-color: var(--teal-press) !important; }
.has-tint-background-color { background-color: var(--tint) !important; }
.has-ink-color { color: var(--ink) !important; }
.has-text-color.has-white-color, .has-white-color { color: #fff !important; }
.has-white-background-color { background-color: #fff !important; }
/* Shown-on settings carried over from Beaver Builder (its breakpoints: 768 / 992). */
@media (max-width: 768px) { .chae-hide-mobile { display: none !important; } }
@media (min-width: 769px) and (max-width: 992px) { .chae-hide-medium { display: none !important; } }
@media (min-width: 993px) { .chae-hide-desktop { display: none !important; } }

/* ---------- cart, checkout, account (theme layout, no checkout plugin) ---------- */
.chae-store .chae-page__title { margin: 0 0 24px; }
.chae-store { --wc-form-border-color: var(--line-2); --wc-form-border-radius: 10px; --wc-form-border-width: 1px; --wc-form-color-background: #fff; }
.chae-store .woocommerce-notices-wrapper:empty { display: none; }
.chae-store .woocommerce-message, .chae-store .woocommerce-info, .chae-store .woocommerce-error { margin: 0 0 14px; }
.chae-store form .form-row { margin: 0 0 14px; padding: 0; }
.chae-store form .form-row label { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 500; line-height: 1.4; color: var(--ink); }
.chae-store form .form-row label.checkbox, .chae-store form .form-row label.woocommerce-form__label-for-checkbox { display: inline-flex; align-items: center; gap: 8px; font-weight: 400; }
.chae-store form .form-row .required { color: #b3261e; text-decoration: none; }
.chae-store input.input-text, .chae-store textarea, .chae-store select, .chae-store form .form-row .input-text, .chae-store form .form-row select { width: 100%; min-height: 48px; padding: 12px 14px; border: 1px solid var(--line-2); border-radius: 10px; background: #fff; font: inherit; font-size: 15px; color: var(--ink); box-shadow: none; }
.chae-store textarea { min-height: 96px; }
.chae-store .select2-container .select2-selection--single { height: 48px; border: 1px solid var(--line-2); border-radius: 10px; background: #fff; }
.chae-store .select2-container .select2-selection--single .select2-selection__rendered { padding: 0 38px 0 14px; line-height: 46px; font-size: 15px; color: var(--ink); }
.chae-store .select2-container .select2-selection--single .select2-selection__arrow { height: 46px; right: 8px; }
.chae-store input.input-text:focus, .chae-store textarea:focus, .chae-store select:focus, .chae-store .select2-container--focus .select2-selection, .chae-store .select2-container--open .select2-selection { border-color: var(--teal); outline: 0; box-shadow: 0 0 0 3px var(--teal-08); }
.chae-store h2, .chae-store h3 { font-size: 24px; }
.chae-store .chae-box { padding: 32px; background: #fff; border: 1px solid var(--panel-border); border-radius: var(--r-panel); box-shadow: var(--shadow); }

/* checkout (inc/checkout.php, woocommerce/checkout/*.php): details + payment left, sticky summary right */
.chae .chae-co { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 420px); gap: 28px; align-items: start; }
.chae-co__main { grid-column: 1; grid-row: 1; display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.chae-co__side { grid-column: 2; grid-row: 1; position: sticky; top: 24px; min-width: 0; padding: 26px 26px 22px; border: 1px solid var(--panel-border); border-radius: var(--r-panel); background: #fff; box-shadow: var(--shadow); }
body.admin-bar .chae-co__side { top: calc(24px + var(--wp-admin--admin-bar--height, 32px)); }
.chae-co__toggle { display: none; }
.chae .chae-co__side-title, .chae .chae-sum__title { margin: 0 0 12px; font-size: 21px; }
.chae-co__panel { padding: 30px 32px; border: 1px solid var(--panel-border); border-radius: var(--r-panel); background: #fff; box-shadow: var(--shadow); }
.chae-store #customer_details .col-1, .chae-store #customer_details .col-2 { float: none; width: 100%; max-width: none; }
.chae-co__sec + .chae-co__sec { margin-top: 26px; padding-top: 26px; border-top: 1px solid var(--line); }
.chae-co__title-row { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; }
.chae .chae-co__title { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; font-size: 21px; }
.chae-co__n { display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: var(--teal); color: #fff; font-family: var(--body); font-size: 14px; font-weight: 700; }
.chae .chae-co__signin { color: var(--teal); font-size: 14.5px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.chae-store .chae-co .form-row .description { display: block; margin-top: 4px; padding: 0; background: none; color: var(--muted-2); font-size: 13px; }
.chae-store .chae-co .form-row .description::before { display: none; }
.chae-store #customer_details .col-2 { margin-top: 20px; }
.chae-store #ship-to-different-address { margin: 0 0 12px; font-family: var(--body); font-size: 16px; }
.chae-store #ship-to-different-address label { display: inline-flex; align-items: center; gap: 10px; font-weight: 500; cursor: pointer; }
.chae-store .woocommerce-additional-fields { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--line); }
.chae-store .woocommerce-account-fields { margin-top: 8px; }
.chae-co .form-row.is-tucked { margin-bottom: 8px; }
.chae-co .form-row.is-tucked > :not(.chae-co__add) { display: none !important; }
.chae-co .form-row.is-waiting { display: none !important; }
.chae-co__add { padding: 2px 0; border: 0; background: none; color: var(--teal); font: inherit; font-size: 14.5px; font-weight: 700; cursor: pointer; }
.chae-co__add:hover { text-decoration: underline; text-underline-offset: 3px; }
/* summary */
.chae-store .chae-sum { width: 100%; margin: 0 0 16px; border: 0 !important; border-collapse: collapse; border-radius: 0; font-size: 15px; }
.chae-store .chae-sum th, .chae-store .chae-sum td { padding: 12px 0 !important; border: 0 !important; border-top: 1px solid var(--line) !important; background: transparent !important; vertical-align: middle; }
.chae-store .chae-sum thead td, .chae-store .chae-sum tbody tr:first-child th, .chae-store .chae-sum tbody tr:first-child td { border-top: 0 !important; }
.chae-store .chae-sum th:last-child, .chae-store .chae-sum td:last-child { text-align: right; }
.chae-store .chae-sum .product-name { padding-right: 14px !important; }
.chae-store .chae-sum .product-total { white-space: nowrap; font-weight: 700; color: var(--ink); }
.chae-store .chae-sum .product-total del { display: block; color: var(--muted-2); font-size: 13px; font-weight: 400; }
.chae-store .chae-sum .order-total th, .chae-store .chae-sum .order-total td { padding-top: 16px !important; font-size: 20px; font-weight: 700; color: var(--ink); }
.chae-sum__shiprow td { padding: 0 0 12px !important; }
.chae-sum__shiprow .chae-sidecart__ship { margin: 0; }
.chae-co__item { display: flex; align-items: center; gap: 12px; }
.chae-co__thumb { position: relative; flex-shrink: 0; width: 56px; height: 56px; border: 1px solid var(--line); border-radius: 12px; background: var(--tint); }
.chae-co__thumb img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 11px; }
.chae-co__qty { position: absolute; top: -7px; right: -7px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px; background: var(--muted); color: #fff; font-size: 11.5px; font-weight: 700; line-height: 20px; text-align: center; }
.chae-co__info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.chae-co__name { color: var(--ink); font-size: 14.5px; font-weight: 500; line-height: 1.35; }
.chae-co__info .product-quantity { display: none; }
.chae-co__inside { color: var(--muted); font-size: 12.5px; line-height: 1.4; }
.chae-co__info .variation { display: block; margin: 2px 0 0; color: var(--muted); font-size: 12.5px; line-height: 1.4; }
.chae-co__info .variation dt { display: inline; font-weight: 500; }
.chae-co__info .variation dd { display: inline; margin: 0; }
.chae-co__info .variation dd p { display: inline; margin: 0; }
.chae-store .chae-sum td.chae-sum__ship { text-align: left !important; }
.chae-sum__ship-title { display: block; margin: 0 0 10px; color: var(--ink); font-weight: 700; }
.chae-store .chae-sum ul#shipping_method { margin: 0; padding: 0; list-style: none; text-align: left; }
.chae-store .chae-sum ul#shipping_method li { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; padding: 10px 12px; border: 1px solid var(--line-2); border-radius: 12px; line-height: 1.35; }
.chae-store .chae-sum ul#shipping_method li:last-child { margin-bottom: 0; }
.chae-store .chae-sum ul#shipping_method li:has(input:checked), .chae-store .chae-sum ul#shipping_method li:only-child { border-color: var(--teal); background: var(--tint); }
.chae-store .chae-sum ul#shipping_method li label { display: flex; flex: 1; justify-content: space-between; gap: 12px; margin: 0; font-weight: 500; cursor: pointer; }
.chae-store .chae-sum ul#shipping_method input { flex-shrink: 0; margin: 0; accent-color: var(--teal); }
.chae-ship__cost { color: var(--ink); font-weight: 700; white-space: nowrap; }
.chae-free { color: var(--teal); font-weight: 700; }
.chae .woocommerce-remove-coupon { margin-left: 6px; color: var(--muted); font-size: 13px; font-weight: 500; text-decoration: underline; }
.chae-coupon { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; padding-top: 16px; border-top: 1px solid var(--line); }
.chae .chae-coupon .input-text { min-height: 46px; margin: 0; }
body.chae .chae-coupon .chae-btn { min-height: 46px; padding: 0 18px !important; }
.chae-coupon__msg { grid-column: 1 / -1; font-size: 14px; }
.chae-coupon__msg:empty { display: none; }
.chae-coupon__msg .woocommerce-error, .chae-coupon__msg .woocommerce-message, .chae-coupon__msg .woocommerce-info { margin: 0 !important; padding: 10px 12px !important; border-radius: 10px; font-size: 14px; }
.chae-coupon__msg .woocommerce-error::before, .chae-coupon__msg .woocommerce-message::before { display: none; }
/* points to use / earn (Points & Rewards), under the discount code */
.chae-points { display: grid; gap: 12px; margin-top: 14px; }
.chae .chae-points .woocommerce-info, .chae .chae-points .woocommerce-message, .chae .chae-points .woocommerce-error { position: relative; margin: 0 !important; padding: 12px 14px 12px 42px !important; border: 0; border-radius: 12px; background: var(--blue-08); box-shadow: none; color: var(--text); font-size: 14px; line-height: 1.45; }
.chae .chae-points .woocommerce-info::before { --chae-notice-icon: var(--chae-icon-star); top: 13px; left: 14px; color: var(--blue-deep); }
.chae .chae-points .woocommerce-message::before, .chae .chae-points .woocommerce-error::before { top: 13px; left: 14px; }
.chae-points .wc_points_rewards_apply_discount { display: flex !important; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-top: 10px; }
.chae .chae-points .wc_points_rewards_apply_discount .button { min-height: 40px; padding: 0 16px !important; font-size: 14px; }
.chae-points__field { display: inline-flex; align-items: center; gap: 8px; margin: 0; color: var(--muted); font-size: 14px; }
.chae .chae-points__field input { width: 84px; min-height: 40px; margin: 0; padding: 0 10px; border: 1px solid var(--line-2); border-radius: 10px; background: #fff; font: inherit; color: var(--ink); }
.chae .chae-points .wc_points_rewards_earn_points .woocommerce-info { padding: 0 0 0 24px !important; background: none; color: var(--muted); font-size: 13.5px; }
.chae .chae-points .wc_points_rewards_earn_points .woocommerce-info::before { top: 1px; left: 0; width: 16px; height: 16px; }
/* payment */
.chae-co__pay #payment { background: none; border-radius: 0; }
.chae-co__pay #payment ul.payment_methods { margin: 0 0 16px; padding: 0; border: 0; }
.chae-co__pay #payment ul.payment_methods li { margin: 0 0 10px; padding: 14px 16px; border: 1px solid var(--line-2); border-radius: 14px; line-height: 1.5; list-style: none; }
.chae-co__pay #payment ul.payment_methods li:has(input:checked) { border-color: var(--teal); background: var(--tint); }
.chae-co__pay #payment ul.payment_methods li > label { font-weight: 700; color: var(--ink); cursor: pointer; }
.chae-co__pay #payment div.payment_box { margin: 12px 0 2px; padding: 12px 14px; border-radius: 12px; background: #fff; color: var(--text); font-size: 14px; }
.chae-co__pay #payment div.payment_box::before { display: none; }
.chae-co__pay #payment div.form-row.place-order { display: block; margin: 0; padding: 0; }
.chae-co__pay .add_gift_card_form { margin: 0 0 16px; }
.chae-assure { clear: both; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; margin: 14px 0 0; padding: 0; color: var(--muted); font-size: 13px; list-style: none; }
.chae-assure li { display: inline-flex; align-items: center; gap: 6px; }
.chae-assure .chae-icon { color: var(--blue-deep); }
/* Subscribe & Save terms right above "Place order" (inc/checkout.php). */
.chae-renewal-note { margin: 0 0 14px; padding: 12px 14px; border-radius: 12px; background: var(--tint); color: var(--text); font-size: 14px; line-height: 1.55; }
.chae-renewal-note strong { color: var(--ink); }
/* the notices above the form (points to earn / use) */
.chae-store--checkout .woocommerce > .woocommerce-info, .chae-store--checkout .woocommerce-notices-wrapper .woocommerce-info, .chae-store--checkout .woocommerce > .wc_points_rewards_earn_points .woocommerce-info { margin: 0 0 12px !important; padding: 12px 16px 12px 44px !important; font-size: 14.5px; }
.chae-store .add_gift_card_form { margin: 0 0 20px; }
.chae-store .add_gift_card_form h4 { margin: 0 0 10px; font-family: var(--head); font-size: 16px; font-weight: 600; color: var(--ink); }
.chae-store #wc_gc_cart_redeem_form { display: flex; flex-wrap: wrap; gap: 10px; }
.chae-store #wc_gc_cart_redeem_form .wc_gc_add_gift_card_form__notices { flex: 1 1 100%; }
.chae-store #wc_gc_cart_redeem_form .wc_gc_add_gift_card_form__notices:empty { display: none; } /* an empty box still took a gap, indenting the field */
.chae-store #wc_gc_cart_redeem_form .wc_gc_add_gift_card_form__notices > * { margin: 0 !important; }
.chae-store #wc_gc_cart_redeem_form .input-text { flex: 1 1 0; width: auto !important; min-width: 0; margin: 0 !important; }
.chae-store #wc_gc_cart_redeem_form .button { flex: 0 0 auto; width: auto !important; min-height: 48px; margin: 0 !important; }
.chae-store .woocommerce-terms-and-conditions-wrapper { font-size: 13.5px; color: var(--muted); }
body.chae .chae-store #place_order, body.chae .chae-co__pay #payment #place_order { float: none; width: calc(100% - 3px); min-height: 56px; justify-content: center; font-size: 16.5px; } /* WooCommerce floats it right with two ids */

/* cart (inc/cart.php, woocommerce/cart/*.php): items left, sticky summary right */
.chae-store--cart .woocommerce { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 400px); gap: 20px 28px; align-items: start; }
.chae-store--cart .woocommerce > * { grid-column: 1 / -1; min-width: 0; }
.chae-store--cart .woocommerce > .woocommerce-cart-form { grid-column: 1; }
.chae-store--cart .woocommerce > .cart-collaterals { grid-column: 2; position: sticky; top: 24px; }
body.admin-bar .chae-store--cart .woocommerce > .cart-collaterals { top: calc(24px + var(--wp-admin--admin-bar--height, 32px)); }
.chae-cartpage { padding: 22px 28px 24px; border: 1px solid var(--panel-border); border-radius: var(--r-panel); background: #fff; box-shadow: var(--shadow); }
.chae-cartpage__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.chae .chae-cartpage__title { margin: 0; font-size: 21px; }
.chae .chae-cartpage__continue { color: var(--teal); font-size: 14.5px; font-weight: 700; }
.chae .chae-cartpage__continue:hover { text-decoration: underline; text-underline-offset: 3px; }
.chae-cartpage__items { margin: 0; padding: 0; list-style: none; }
.chae-cartpage__item { display: grid; grid-template-columns: 88px minmax(0, 1fr) auto minmax(84px, auto); grid-template-rows: auto 1fr; grid-template-areas: "thumb info qty price" "thumb info qty remove"; gap: 4px 20px; align-items: start; margin: 0; padding: 20px 0; border-bottom: 1px solid var(--line); }
.chae-cartpage__item.is-child { grid-template-columns: 56px minmax(0, 1fr) auto minmax(84px, auto); padding: 12px 0 12px 32px; }
.chae-cartpage__thumb { grid-area: thumb; display: block; width: 100%; aspect-ratio: 1; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: var(--tint); }
.chae .chae-cartpage__thumb img { display: block; width: 100%; height: 100%; max-width: none; object-fit: contain; }
.chae-cartpage__info { grid-area: info; min-width: 0; }
.chae .chae-cartpage__name { margin: 0; color: var(--ink); font-size: 16px; font-weight: 700; line-height: 1.35; }
.chae .chae-cartpage__name a { color: var(--ink); }
.chae .chae-cartpage__name a:hover { color: var(--teal); }
.chae-cartpage__name small { display: block; margin-top: 2px; color: var(--muted); font-size: 13px; font-weight: 500; }
.chae .chae-cartpage__inside, .chae .chae-cartpage__each { margin: 4px 0 0; color: var(--muted); font-size: 13.5px; line-height: 1.45; }
.chae-cartpage__meta .variation { display: block; margin: 4px 0 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.chae-cartpage__meta .variation dt { display: inline; font-weight: 500; }
.chae-cartpage__meta .variation dd { display: inline; margin: 0; }
.chae-cartpage__meta .variation dd p { display: inline; margin: 0; }
.chae-cartpage__info .backorder_notification { margin: 4px 0 0; color: var(--blue-deep); font-size: 13px; }
.chae-cartpage__plan { margin-top: 10px; }
.chae-cartpage__plan ul.wcsatt-options { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.chae-cartpage__plan ul.wcsatt-options li { margin: 0; padding: 0; list-style: none; }
.chae-cartpage__plan ul.wcsatt-options label { display: inline-flex; align-items: center; gap: 7px; margin: 0; padding: 6px 12px 6px 9px; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; color: var(--text); font-size: 13px; font-weight: 500; line-height: 1.3; cursor: pointer; }
.chae-cartpage__plan ul.wcsatt-options label:hover { border-color: var(--teal); }
.chae-cartpage__plan ul.wcsatt-options li:has(input:checked) label { border-color: var(--teal); background: var(--tint); color: var(--ink); }
.chae-cartpage__plan ul.wcsatt-options input { margin: 0; accent-color: var(--teal); }
.chae-cartpage__plan ul.wcsatt-options .amount { font-weight: 700; }
.chae-plan__once { font-weight: 600; }
.chae-cartpage__qty { grid-area: qty; }
.chae-cartpage .chae-qty .quantity { display: flex; }
.chae .chae-cartpage .chae-qty input.qty { width: 40px; height: 36px; min-height: 0; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; color: var(--ink); font: inherit; font-size: 15px; font-weight: 700; text-align: center; -moz-appearance: textfield; appearance: textfield; }
.chae-cartpage .chae-qty input.qty::-webkit-outer-spin-button, .chae-cartpage .chae-qty input.qty::-webkit-inner-spin-button { margin: 0; -webkit-appearance: none; }
.chae-cartpage__qty.is-fixed { display: flex; align-items: center; gap: 6px; min-height: 38px; color: var(--muted); font-size: 14px; }
.chae-cartpage__qty.is-fixed .quantity { display: inline; }
.chae-cartpage__price { grid-area: price; padding-top: 8px; color: var(--ink); font-weight: 700; text-align: right; white-space: nowrap; }
.chae-cartpage__price del { display: block; color: var(--muted-2); font-size: 13px; font-weight: 400; }
.chae-cartpage__remove { grid-area: remove; text-align: right; }
.chae .chae-cartpage__remove a.remove { display: inline-block; width: auto; height: auto; margin: -10px 0; padding: 10px 0; border: 0; border-radius: 0; background: none !important; color: var(--muted) !important; font-size: 13.5px; font-weight: 500; line-height: 1.4; text-decoration: underline; text-underline-offset: 3px; } /* the padding makes a 40px-tall tap area without moving anything (it was 16px) */
.chae .chae-cartpage__remove a.remove:hover { color: #b3261e !important; }
.chae-cartpage__actions { display: flex; justify-content: flex-end; gap: 10px; }
.chae .chae-cartpage__update { margin-top: 14px; }
.chae .woocommerce .chae-cartpage__update:disabled { display: none !important; } /* quantities and plans save by themselves */
.chae-cartpage__more { margin-top: 24px; }
.chae .chae-cartpage__more-title { margin: 0 0 12px; font-size: 17px; }
.chae-cartpage__sugs { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.chae-cartpage__sug { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; gap: 14px; align-items: center; margin: 0; padding: 10px 14px 10px 10px; border: 1px solid var(--line); border-radius: 16px; }
.chae-cartpage__sug-thumb { display: block; width: 56px; height: 56px; overflow: hidden; border-radius: 10px; background: var(--tint); }
.chae .chae-cartpage__sug-thumb img { display: block; width: 100%; height: 100%; object-fit: contain; }
.chae-cartpage__sug-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.chae .chae-cartpage__sug-name { display: -webkit-box; overflow: hidden; color: var(--ink); font-size: 14.5px; font-weight: 600; line-height: 1.3; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.chae .chae-cartpage__sug-name:hover { color: var(--teal); }
.chae-cartpage__sug-price { color: var(--muted); font-size: 13.5px; }
.chae-cartpage__sug-price del { color: var(--muted-2); }
.chae-cartpage__sug-price ins { color: var(--ink); font-weight: 600; text-decoration: none; }
body.chae .chae-cartpage__sug-add { min-height: 38px; padding: 0 18px !important; font-size: 14px; }
/* cart summary */
.chae-store--cart .cart-collaterals .cart_totals { float: none; width: 100%; padding: 26px 26px 22px; border: 1px solid var(--panel-border); border-radius: var(--r-panel); background: #fff; box-shadow: var(--shadow); }
.chae-store--cart .cart_totals .chae-sidecart__ship { margin: 0 0 4px; }
.chae-store--cart .cart_totals .chae-sum { margin-bottom: 16px; }
.chae-sum .woocommerce-shipping-destination { margin: 10px 0 0; color: var(--muted); font-size: 13.5px; line-height: 1.45; }
.chae-sum .woocommerce-shipping-destination strong { color: var(--text); font-weight: 600; }
.chae-sum .woocommerce-shipping-calculator { margin: 2px 0 0; }
.chae .chae-sum .shipping-calculator-button { color: var(--teal); font-size: 13.5px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.chae .chae-sum .shipping-calculator-button::after { display: none; }
.chae-sum .shipping-calculator-form { margin-top: 10px; padding: 0; }
.chae-sum .shipping-calculator-form .form-row { margin: 0 0 8px; padding: 0; }
.chae-sum .shipping-calculator-form .button { width: 100%; }
.chae-store .wc-proceed-to-checkout { margin-top: 16px; padding: 0; }
.chae-store--cart .wc-proceed-to-checkout .add_gift_card_form { margin: 0 0 16px; }
body.chae .chae-store .wc-proceed-to-checkout a.checkout-button { display: flex !important; align-items: center; justify-content: center; gap: 10px; width: calc(100% - 3px); min-height: 56px; margin: 0; font-size: 16.5px; }
/* Cart & checkout pass (2026-09-27): shorter summaries, codes folded, a compact Subscribe & Save choice. */
/* Subscribe & Save on a cart line: one-time | subscribe, then "Deliver every" (cart-item-subscription-options.php) */
.chae-lineplan__opts { display: flex; flex-wrap: wrap; gap: 8px; }
.chae-lineplan__opt { display: grid; grid-template-columns: auto auto; grid-template-areas: "radio name" "radio price"; align-items: center; justify-content: start; column-gap: 9px; margin: 0; padding: 8px 16px 8px 12px; border: 1px solid var(--line-2); border-radius: 12px; background: #fff; line-height: 1.3; cursor: pointer; }
.chae-lineplan__opt:hover { border-color: var(--teal); }
.chae-lineplan__opt:has(input:checked) { border-color: var(--teal); background: var(--tint); }
.chae .chae-lineplan__opt input { grid-area: radio; margin: 0; accent-color: var(--teal); }
.chae-lineplan__name { grid-area: name; color: var(--ink); font-size: 13.5px; font-weight: 700; }
.chae-lineplan__opt--sub .chae-lineplan__name { color: var(--teal); }
.chae-lineplan__price { grid-area: price; color: var(--muted); font-size: 13px; }
.chae-lineplan__price del { margin-right: 4px; color: var(--muted-2); }
.chae-lineplan__price ins { text-decoration: none; }
.chae-lineplan__price .amount { color: var(--text); font-weight: 600; }
.chae .chae-lineplan__freq { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 8px 0 0; color: var(--muted); font-size: 13.5px; }
.chae-lineplan__freq select { width: auto; min-height: 0; height: 36px; padding: 0 32px 0 12px; border: 1px solid var(--line-2); border-radius: 10px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23006263' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 11px center; color: var(--ink); font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; -webkit-appearance: none; appearance: none; }
.chae-lineplan__freq select:hover, .chae-lineplan__freq select:focus { border-color: var(--teal); }
/* a bundle's contents, folded (chae_bundle_list) */
.chae-inside { margin: 4px 0 0; color: var(--muted); font-size: 13.5px; line-height: 1.45; }
.chae-inside summary { display: inline-flex; align-items: center; gap: 6px; color: var(--teal); font-weight: 600; list-style: none; cursor: pointer; }
.chae-inside summary::-webkit-details-marker { display: none; }
.chae-inside summary::after { content: ""; width: 6px; height: 6px; margin-top: -3px; border-right: 1.8px solid; border-bottom: 1.8px solid; transform: rotate(45deg); transition: transform 0.2s ease; }
.chae-inside[open] summary::after { margin-top: 2px; transform: rotate(-135deg); }
.chae-inside ul { margin: 6px 0 0; padding: 0 0 0 18px; }
.chae-inside li { margin: 2px 0 0; }
.chae-co__info .chae-inside { margin-top: 2px; font-size: 12.5px; }
/* a discount code in the totals: the code as a tag */
.chae-sum__code { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; background: var(--tint); color: var(--ink); font-size: 12.5px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; white-space: nowrap; }
.chae-sum__code .chae-icon { flex-shrink: 0; color: var(--teal); }
.chae-store .chae-sum .cart-discount td { white-space: nowrap; }
/* an applied gift card (woocommerce/cart/cart-gift-cards.php): Remove like a discount code's; the pre-card total quiet */
.chae .chae-sum .wc_gc_remove_gift_card { margin-left: 6px; color: var(--muted); font-size: 13px; font-weight: 500; text-decoration: underline; }
.chae-store .chae-sum .chae-sum__before th, .chae-store .chae-sum .chae-sum__before td { color: var(--muted); font-size: 14px; font-weight: 500; }
/* "Discount code" and "Gift card", folded (chae_codes_box) */
.chae-codes { border-top: 1px solid var(--line); }
.chae-codes__item { border-bottom: 1px solid var(--line); }
.chae-codes__item > summary { display: flex; align-items: center; gap: 10px; padding: 13px 2px; color: var(--ink); font-size: 14.5px; font-weight: 600; list-style: none; cursor: pointer; }
.chae-codes__item > summary::-webkit-details-marker { display: none; }
.chae-codes__item > summary .chae-icon { flex-shrink: 0; color: var(--teal); }
.chae-codes__item > summary::after { content: "+"; margin-left: auto; color: var(--teal); font-size: 20px; font-weight: 400; line-height: 1; }
.chae-codes__item[open] > summary::after { content: "\2013"; }
.chae-codes__item > summary:hover { color: var(--teal); }
.chae-codes .chae-coupon { margin: 0 0 14px; padding-top: 0; border-top: 0; }
.chae-store .chae-codes .add_gift_card_form { margin: 0 0 14px; }
.chae-store .chae-codes .add_gift_card_form h4 { display: none; } /* the line above says "Gift card" */
.chae-store--cart .cart_totals .chae-codes + .chae-points { margin-top: 16px; }
.chae-co__pay .chae-codes { margin: 0 0 18px; }
.chae-co__pay .chae-points { margin: 0 0 18px; }
/* free shipping reached: one line, no full meter (the side cart keeps its meter) */
.cart_totals .chae-sidecart__ship.is-free, .chae-sum .chae-sidecart__ship.is-free { padding: 10px 14px; }
.cart_totals .chae-sidecart__ship.is-free p, .chae-sum .chae-sidecart__ship.is-free p { margin: 0; }
.cart_totals .chae-sidecart__ship.is-free .chae-sidecart__meter, .chae-sum .chae-sidecart__ship.is-free .chae-sidecart__meter { display: none; }
/* one shipping choice: a plain row ("Shipping … Free shipping") instead of a lone selected box. The title floats
   beside the list; the cell stays a table cell (display: flex took it out of the table and it shrank to one column). */
.chae-sum__ship:has(#shipping_method > li:only-child) .chae-sum__ship-title { float: left; margin: 0 12px 0 0; }
.chae-store .chae-sum td.chae-sum__ship:has(#shipping_method > li:only-child) #shipping_method { overflow: hidden; }
.chae-store .chae-sum ul#shipping_method > li:only-child { padding: 0; border: 0; background: none; }
.chae-store .chae-sum .chae-ship__cost:empty { display: none; }
.chae-store--cart .cart_totals .chae-points--earn { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.chae-store .chae-sum ul#shipping_method > li:only-child label { justify-content: flex-end; font-weight: 700; color: var(--ink); cursor: default; }
.chae-store .chae-sum ul#shipping_method > li:only-child .chae-ship__name:has(+ .chae-ship__cost:not(:empty)) { font-weight: 500; color: var(--muted); }
.chae-sum__ship:has(#shipping_method > li:only-child) .woocommerce-shipping-destination, .chae-sum__ship:has(#shipping_method > li:only-child) .woocommerce-shipping-calculator { clear: both; }
/* "Place order · $110.89" (inc/checkout.php puts the total on the button) */
body.chae #place_order[data-chae-total]::after { content: attr(data-chae-total); margin-left: 12px; padding-left: 12px; border-left: 1px solid rgba(255, 255, 255, 0.45); }
/* plain dropdowns on checkout ("How did you hear about us?") had no arrow: the browser's is off and select2 only
   draws its own for country/state */
.chae-store .chae-co .form-row select:not(.select2-hidden-accessible) { padding-right: 42px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23006263' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 16px center; cursor: pointer; -webkit-appearance: none; appearance: none; }
.chae-store .chae-co__side .chae-sum { margin-bottom: 0; }
/* Smart Coupons' message holder, empty, took a row above the form (the form sat lower than the summary) */
.chae-co__main > .wc_coupon_message_wrap:not(:has(*)) { display: none; }
/* empty cart */
.chae-cart-empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 48px 24px; border: 1px solid var(--panel-border); border-radius: var(--r-panel); background: #fff; box-shadow: var(--shadow); text-align: center; }
.chae-cart-empty .woocommerce-notices-wrapper { width: 100%; text-align: left; }
.chae-cart-empty__icon { display: inline-flex; align-items: center; justify-content: center; width: 64px; height: 64px; margin-bottom: 6px; border-radius: 50%; background: var(--tint); color: var(--teal); }
.chae .chae-cart-empty__title { margin: 0; font-size: 26px; }
.chae .chae-cart-empty .chae-muted { margin: 0; }
.chae-cart-empty .return-to-shop { margin: 14px 0 0; }
.chae-cart-empty__picks { margin-top: 36px; }
.chae .chae-cart-empty__picks-title { margin: 0 0 18px; font-size: 24px; }
/* phones: a Checkout bar until the summary's button is on screen (cart.js) */
.chae-cart-bar { display: none; }

/* ---------- About & Contact (page-about-us.php, page-contact.php; copy in inc/config.php) ---------- */
.chae-hero.chae-about-hero { grid-template-columns: minmax(0, 1fr) 300px; gap: 56px; }
.chae-video { position: relative; aspect-ratio: 9 / 16; margin: 0; overflow: hidden; border-radius: 22px; background: #111; box-shadow: var(--shadow); }
.chae-video img, .chae-video iframe { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; object-fit: cover; }
.chae-video__play { position: absolute; top: 50%; left: 50%; z-index: 2; display: flex; align-items: center; justify-content: center; width: 76px; height: 76px; margin: -38px 0 0 -38px; padding: 0 0 0 4px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.94); color: var(--teal); box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25); cursor: pointer; transition: transform 0.2s ease; }
.chae-video__play:hover { transform: scale(1.06); }
.chae-video__label { position: absolute; top: 14px; left: 14px; z-index: 1; padding: 7px 12px; border-radius: 999px; background: rgba(255, 255, 255, 0.92); color: var(--blue-deep); font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; pointer-events: none; }
.chae-founder { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 48px; align-items: start; }
.chae-founder__photo { margin: 0; }
.chae-founder__photo img { display: block; width: 100%; aspect-ratio: 4 / 5; border-radius: 22px; background: #e8ebea; object-fit: cover; object-position: 50% 30%; }
.chae-founder__photo figcaption { margin-top: 14px; color: var(--muted); font-size: 13px; text-align: center; }
.chae-founder__photo figcaption strong { display: block; font-family: var(--head); font-size: 18px; font-weight: 600; color: var(--ink); }
.chae-founder__text { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.chae-founder__text > p { margin: 0; font-size: 16.5px; line-height: 1.7; }
.chae .chae-founder__title { margin: 0; font-size: 40px; }
.chae-founder__quote { margin: 6px 0; padding: 20px 24px; border-left: 4px solid var(--blue); border-radius: 0 16px 16px 0; background: var(--blue-08); }
.chae-founder__quote p { margin: 0; color: var(--ink); font-family: var(--head); font-size: 19px; line-height: 1.5; }
.chae-founder__quote cite { display: block; margin-top: 10px; color: var(--blue-deep); font-size: 12px; font-style: normal; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.chae-began { padding-top: 36px; border-top: 1px solid var(--line); }
.chae .chae-began__title { margin: 0 0 26px; font-size: 24px; text-align: center; }
.chae-began__steps { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 0; list-style: none; counter-reset: chae-step; }
.chae-began__steps::before { content: ""; position: absolute; top: 17px; right: 12.5%; left: 12.5%; height: 2px; background: linear-gradient(90deg, var(--teal), var(--blue)); opacity: 0.3; }
.chae-began__step { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; counter-increment: chae-step; }
.chae-began__step::before { content: counter(chae-step); display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 6px var(--panel-bg); color: #fff; font-size: 15px; font-weight: 700; }
.chae-began__step strong { color: var(--ink); font-family: var(--head); font-size: 17px; font-weight: 600; }
.chae-began__step p { margin: 0; color: var(--muted); font-size: 14.5px; line-height: 1.6; }
.chae-made__photo { margin: 0; overflow: hidden; aspect-ratio: 1128 / 337; border-radius: 22px; background: #eef1f0; }
.chae-made__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.chae-made { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 40px; align-items: center; }
.chae-made__text { margin: 0; font-size: 17px; line-height: 1.7; }
.chae-made.chae-made--tour { grid-template-columns: minmax(0, 1fr) 300px; align-items: start; }
.chae-made__body { display: flex; flex-direction: column; gap: 24px; }
.chae-made__tour { margin: 0; }
.chae-made__tour figcaption { margin-top: 10px; color: var(--muted); font-size: 13px; line-height: 1.5; text-align: center; }
@media (max-width: 960px) {
	.chae-made.chae-made--tour { grid-template-columns: minmax(0, 1fr); }
	.chae-made__tour { width: min(100%, 340px); margin: 0 auto; }
}
.chae-certs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin: 0; padding: 0; list-style: none; }
.chae-cert { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 26px 20px; border: 1px solid var(--line); border-radius: 18px; background: #fff; text-align: center; }
.chae-cert img { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; box-shadow: 0 6px 16px rgba(26, 36, 33, 0.12); }
.chae .chae-cert__title { margin: 6px 0 0; font-size: 18px; }
.chae-cert p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.chae-cta-strip { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 20px; padding: 22px 28px; }
.chae-cta-strip__text { flex: 1 1 280px; margin: 0; color: var(--muted); }
.chae-cta-strip__text strong { display: block; color: var(--ink); font-family: var(--head); font-size: 20px; font-weight: 600; }
.chae-contact { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 24px; align-items: start; }
.chae-contact__info { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; padding: 44px 44px 36px; }
.chae .chae-contact__title { margin: 0; font-size: 46px; line-height: 1.1; }
.chae-contact__lead { margin: 0; font-size: 17px; line-height: 1.65; }
.chae-contact__ways { display: flex; flex-direction: column; gap: 20px; width: 100%; margin: 6px 0 0; padding: 24px 0 0; border-top: 1px solid var(--line); list-style: none; }
.chae-contact__ways li { display: flex; align-items: flex-start; gap: 16px; }
.chae-contact__way { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.chae-contact__label { color: var(--blue-deep); font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.chae .chae-contact__way a { color: var(--teal); font-size: 18px; font-weight: 700; overflow-wrap: anywhere; } /* teal: it can be tapped (call / email) */
.chae .chae-contact__way a:hover { color: var(--teal); }
.chae-contact__way small { color: var(--muted); font-size: 14px; }
.chae-contact__way address { color: var(--text); font-style: normal; line-height: 1.55; }
.chae .chae-contact__way a.chae-contact__map { color: var(--teal); font-size: 14px; text-decoration: underline; text-underline-offset: 3px; }
.chae-contact__social { display: flex; flex-direction: column; gap: 10px; width: 100%; padding-top: 20px; border-top: 1px solid var(--line); }
.chae-contact__social ul { display: flex; gap: 10px; margin: 0; padding: 0; list-style: none; }
.chae .chae-contact__social a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1.5px solid var(--line-2); border-radius: 50%; color: var(--teal); transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease; }
.chae .chae-contact__social a:hover { border-color: var(--teal); background: var(--teal); color: #fff; }
.chae-contact__form { padding: 40px 40px 36px; }
.chae .chae-contact__form-title { margin: 0; font-size: 28px; }
.chae-contact__form-text { margin: 6px 0 20px; color: var(--muted); }
.chae-contact__form .gform_wrapper { margin: 0 !important; }
.chae-contact__form .gform-theme--framework { --gf-form-gap-y: 22px; --gf-label-space-primary: 6px; }
.chae-contact__form .gform_wrapper .gform_footer { margin: 24px 0 0 !important; padding: 0 !important; }
.chae-contact__form .gform_confirmation_message { padding: 18px 20px; border-radius: 14px; background: var(--blue-08); color: var(--ink); font-size: 16px; font-weight: 500; }
.chae-help { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.chae .chae-help__tile { display: flex; align-items: center; gap: 14px; padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: #fff; color: var(--text); }
.chae-help__text { display: flex; flex: 1; flex-direction: column; gap: 2px; min-width: 0; color: var(--muted); font-size: 13.5px; line-height: 1.45; }
.chae-help__text strong { color: var(--ink); font-family: var(--head); font-size: 16.5px; font-weight: 600; }
.chae-help__arrow { flex-shrink: 0; color: var(--teal); }
/* Photo credits (page-photo-credits.php) */
.chae-credits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 0; padding: 0; list-style: none; }
.chae-credit { overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.chae-credit__img { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: #e8eeed; }
.chae-credit__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.chae-credit__text { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 14px 16px 16px; color: var(--text); font-size: 14.5px; }
.chae .chae-credit__text a, .chae .chae-credits__note a { color: var(--teal); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.chae-credit__text small { color: var(--muted-2); font-size: 13px; }
.chae-credits__note { margin: 0; color: var(--muted); font-size: 14px; text-align: center; }
@media (max-width: 782px) { .chae-credits { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } }
@media (max-width: 480px) { .chae-credits { grid-template-columns: minmax(0, 1fr); } }
/* Why ToxicFree® (page-why-toxic-free.php) */
.chae-hero.chae-tf-hero { grid-template-columns: minmax(0, 1fr) 380px; }
.chae-tf-seal { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; min-height: 420px; margin: 0; padding: 32px; border-radius: 22px; background: radial-gradient(circle at 50% 38%, #fff 0, #fff 28%, var(--blue-08) 72%); text-align: center; }
.chae-tf-seal img { width: 220px; height: 220px; border-radius: 50%; object-fit: cover; box-shadow: 0 18px 40px rgba(26, 36, 33, 0.16); }
.chae-tf-seal figcaption { color: var(--muted); font-size: 14px; }
.chae-tf-seal figcaption strong { display: block; color: var(--ink); font-family: var(--head); font-size: 20px; font-weight: 600; }
.chae-claims { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.chae-claim { padding: 24px 24px 22px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.chae-claim__label { display: block; margin-bottom: 8px; color: var(--ink); font-family: var(--head); font-size: 22px; font-weight: 600; }
.chae-claim p { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.6; }
.chae-tf-standard { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 2fr); gap: 28px; align-items: center; padding: 28px 32px; border-radius: 20px; background: var(--blue-08); }
.chae-tf-standard__head { display: flex; align-items: center; gap: 18px; }
.chae-tf-standard__head img { flex-shrink: 0; width: 76px; height: 76px; border-radius: 50%; object-fit: cover; box-shadow: 0 8px 20px rgba(26, 36, 33, 0.14); }
.chae .chae-tf-standard__title { margin: 6px 0 0; font-size: 22px; line-height: 1.25; }
.chae-tf-standard__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 0; padding: 0; list-style: none; }
.chae-tf-standard__list li { display: flex; align-items: flex-start; gap: 12px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.chae-tf-standard__list .chae-round { background: #fff; }
.chae-tf-standard__list strong { display: block; color: var(--ink); font-family: var(--head); font-size: 17px; font-weight: 600; }
.chae-screened { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.chae-screened__item { display: flex; align-items: flex-start; gap: 12px; padding: 16px 18px; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.chae-screened__mark { display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; width: 26px; height: 26px; margin-top: 1px; border-radius: 50%; background: #fbeceb; color: #b3261e; }
.chae-screened__mark .chae-icon { stroke-width: 2.6; }
.chae-screened__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; color: var(--muted); font-size: 13.5px; line-height: 1.45; }
.chae-screened__text strong { color: var(--ink); font-size: 15.5px; }
.chae .chae-screened__text a { align-self: flex-start; margin-top: 4px; color: var(--teal); font-size: 13px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.chae-help--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* FAQ (page-support.php) */
.chae-faq-hero { display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 48px 40px 36px; text-align: center; }
.chae-faq-hero .chae-pill { align-self: center; }
.chae .chae-faq-hero__title { margin: 0; font-size: 46px; line-height: 1.1; }
.chae-faq-hero__lead { max-width: 560px; margin: 0; color: var(--muted); font-size: 17px; }
.chae-faq-search { position: relative; width: min(100%, 560px); margin-top: 6px; }
.chae-faq-search .chae-icon { position: absolute; top: 50%; left: 18px; color: var(--teal); transform: translateY(-50%); pointer-events: none; }
.chae .chae-faq-search input { width: 100%; min-height: 56px; margin: 0; padding: 0 20px 0 50px; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; box-shadow: var(--shadow-sm); font: inherit; font-size: 16px; }
.chae .chae-faq-search input:focus { border-color: var(--teal); outline: none; box-shadow: 0 0 0 4px var(--teal-08); }
.chae-faq-hero__status { min-height: 20px; margin: 0; color: var(--muted-2); font-size: 14px; }
.chae-faq { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 24px; align-items: start; margin-top: 24px; }
.chae-faq [hidden] { display: none !important; }
.chae-faq__nav { position: sticky; top: 24px; padding: 10px; border: 1px solid var(--panel-border); border-radius: 22px; background: #fff; box-shadow: var(--shadow-sm); }
body.admin-bar .chae-faq__nav { top: calc(24px + var(--wp-admin--admin-bar--height, 32px)); }
.chae-faq__nav ul { display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 0; list-style: none; }
.chae .chae-faq__nav a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; color: var(--text); font-size: 15px; font-weight: 500; }
.chae .chae-faq__nav a:hover { background: var(--tint); color: var(--teal); }
.chae-faq__nav a .chae-icon { flex-shrink: 0; color: var(--blue-deep); }
.chae-faq__nav a span { flex: 1; }
.chae-faq__nav small { color: var(--muted-2); font-size: 12.5px; }
.chae-faq__topics { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.chae-faq__topic { padding: 28px 32px 18px; scroll-margin-top: 24px; }
.chae .chae-faq__title { display: flex; align-items: center; gap: 14px; margin: 0 0 8px; font-size: 26px; }
.chae-faq__item { border-bottom: 1px solid var(--line); scroll-margin-top: 24px; }
.chae-faq__item:last-child { border-bottom: 0; }
.chae-faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 0; color: var(--ink); font-size: 16.5px; font-weight: 600; line-height: 1.45; cursor: pointer; list-style: none; }
.chae-faq__item summary::-webkit-details-marker { display: none; }
.chae-faq__item summary:hover { color: var(--teal); }
.chae-faq__chevron { flex-shrink: 0; color: var(--teal); transform: rotate(90deg); transition: transform 0.2s ease; }
.chae-faq__item[open] .chae-faq__chevron { transform: rotate(-90deg); }
.chae-faq__answer p { max-width: 720px; margin: 0; padding: 0 0 18px; color: var(--text); font-size: 15.5px; line-height: 1.7; }
.chae .chae-faq__answer a { color: var(--teal); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.chae-faq__empty { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding: 24px 28px; }
.chae-faq__empty p { margin: 0; }
@media (max-width: 1180px) {
	.chae-hero.chae-about-hero { grid-template-columns: minmax(0, 1fr) 270px; gap: 40px; }
	.chae-founder { grid-template-columns: 300px minmax(0, 1fr); gap: 36px; }
	.chae-certs, .chae-help { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.chae-hero.chae-tf-hero { grid-template-columns: minmax(0, 1fr) 320px; }
	.chae-tf-standard { grid-template-columns: minmax(0, 1fr); }
	.chae-screened { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.chae-help--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
	.chae-hero.chae-about-hero { grid-template-columns: minmax(0, 1fr); }
	.chae-video { width: min(100%, 300px); margin: 0 auto; }
	.chae-founder { grid-template-columns: minmax(0, 1fr); }
	.chae-founder__photo { width: min(100%, 360px); }
	.chae-began__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 28px; }
	.chae-began__steps::before { display: none; }
	.chae-made { grid-template-columns: minmax(0, 1fr); gap: 24px; }
	.chae-contact { grid-template-columns: minmax(0, 1fr); }
	.chae-hero.chae-tf-hero { grid-template-columns: minmax(0, 1fr); }
	.chae-tf-seal { min-height: 0; }
	.chae-claims, .chae-help--3 { grid-template-columns: minmax(0, 1fr); }
	.chae-faq { grid-template-columns: minmax(0, 1fr); }
	.chae-faq__nav { position: static; margin: 0 -16px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
	.chae-faq__nav ul { flex-direction: row; gap: 8px; padding: 2px 16px 6px; overflow-x: auto; scrollbar-width: none; }
	.chae .chae-faq__nav a { border: 1px solid var(--line-2); border-radius: 999px; background: #fff; font-size: 14px; white-space: nowrap; }
}
@media (max-width: 560px) {
	.chae .chae-founder__title { font-size: 30px; }
	.chae-founder__quote p { font-size: 17px; }
	.chae-began__steps, .chae-certs, .chae-help { grid-template-columns: minmax(0, 1fr); }
	.chae-began__step { align-items: flex-start; padding-left: 52px; text-align: left; }
	.chae-began__step::before { position: absolute; top: 0; left: 0; }
	.chae-made__photo { aspect-ratio: 16 / 9; }
	.chae-contact__info, .chae-contact__form { padding: 26px 20px; }
	.chae .chae-contact__title { font-size: 34px; }
	.chae .chae-contact__way a { font-size: 16px; }
	.chae-cta-strip { padding: 20px; }
	.chae-tf-standard__list, .chae-screened { grid-template-columns: minmax(0, 1fr); }
	.chae-tf-standard { padding: 22px 20px; }
	.chae .chae-faq-hero__title { font-size: 32px; }
	.chae-faq-hero { padding: 32px 20px 24px; }
	.chae-faq__topic { padding: 22px 20px 10px; }
	.chae .chae-faq__title { font-size: 22px; }
}

/* ---------- signed-in account area (inc/account-area.php, woocommerce/myaccount/*.php) ---------- */
.chae-acc { display: flex; flex-direction: column; gap: 24px; }
.chae-acc__head { display: flex; flex-direction: column; gap: 6px; }
.chae .chae-acc__title { margin: 0; font-size: clamp(30px, 3.6vw, 40px); }
.chae-acc__sub { margin: 0; color: var(--muted); font-size: 16px; }
.chae .chae-acc__back:hover { color: var(--teal); }
.chae-acc__grid { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 24px 28px; align-items: start; }
.chae-acc__nav { position: sticky; top: 24px; float: none !important; width: auto !important; padding: 10px; border: 1px solid var(--panel-border); border-radius: 22px; background: #fff; box-shadow: var(--shadow-sm); }
body.admin-bar .chae-acc__nav { top: calc(24px + var(--wp-admin--admin-bar--height, 32px)); }
.chae-acc__nav ul { display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 0; list-style: none; }
.chae .chae-acc__nav a { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 0 14px; border-radius: 12px; color: var(--ink); font-size: 15px; font-weight: 500; }
.chae .chae-acc__nav a .chae-icon { flex-shrink: 0; color: var(--muted); }
.chae .chae-acc__nav a:hover { background: var(--tint); color: var(--teal); }
.chae .chae-acc__nav li.is-active a { background: var(--teal-08); color: var(--teal); font-weight: 700; }
.chae .chae-acc__nav a:hover .chae-icon, .chae .chae-acc__nav li.is-active a .chae-icon { color: var(--teal); }
.chae-acc__nav .woocommerce-MyAccount-navigation-link--customer-logout { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--line); }
.chae-acc__content { min-width: 0; float: none !important; width: auto !important; padding: 32px; border: 1px solid var(--panel-border); border-radius: var(--r-panel); background: #fff; box-shadow: var(--shadow); }
.chae-acc__content > :first-child { margin-top: 0; }
.chae-acc__content h2, .chae-acc__content h3 { font-size: 21px; }
.chae-acc__content mark { background: none; color: var(--ink); font-weight: 700; }
/* overview */
.chae-acc-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; }
.chae .chae-acc-tile { display: flex; flex-direction: column; gap: 4px; padding: 18px 18px 16px; border: 1px solid var(--line); border-radius: 18px; background: var(--tint); color: var(--text); transition: border-color 0.15s ease, transform 0.15s ease; }
.chae .chae-acc-tile:hover { border-color: var(--teal); color: var(--text); transform: translateY(-2px); }
.chae-acc-tile--invite { background: linear-gradient(135deg, #eef7fa 0%, #e3f1ef 100%) !important; }
.chae-acc-tile__icon { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin-bottom: 6px; border-radius: 50%; background: #fff; color: var(--blue-deep); }
.chae-acc-tile__label { color: var(--blue-deep); font-size: 12px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.chae-acc-tile__value { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; color: var(--ink); font-family: var(--head); font-size: 20px; font-weight: 700; line-height: 1.3; }
.chae-acc-tile__text { color: var(--muted); font-size: 14px; line-height: 1.45; }
.chae-acc-tile__go { margin-top: auto; padding-top: 10px; color: var(--teal); font-size: 14px; font-weight: 700; }
.chae-acc-sec { margin-top: 36px; }
/* "Buy it again": compact product cards */
.chae-acc-sec ul.products { gap: 14px; }
.chae-acc-sec .chae-card__media { aspect-ratio: auto; height: 130px; }
.chae-acc-sec .chae-card__media img { padding: 8px; }
.chae-acc-sec .chae-card__badges, .chae-acc-sec .chae-card__rating, .chae-acc-sec .chae-card__meta, .chae-acc-sec .chae-card__sub { display: none !important; }
.chae .chae-acc-sec .chae-card__title { min-height: 0 !important; font-size: 14.5px !important; }
.chae .chae-acc-sec ul.products li.product.chae-card { padding-bottom: 16px !important; }
body.chae .chae-acc-sec .chae-card__actions .button { min-height: 38px; padding: 0 16px !important; font-size: 14px; }
.chae-acc-sec__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.chae .chae-acc-sec__title { margin: 0; font-size: 22px; }
.chae-acc-help { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin: 36px 0 0; padding: 14px 18px; border-radius: 14px; background: var(--tint); color: var(--muted); font-size: 14.5px; }
.chae-acc-help .chae-icon { color: var(--blue-deep); }
.chae .chae-acc-help a { color: var(--teal); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.chae-acc-empty { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 32px 0; text-align: center; }
.chae-acc-empty p { margin: 0; color: var(--muted); }
/* order cards */
.chae-status { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px; background: #eef1f0; color: var(--muted); font-family: var(--body); font-size: 12px; font-weight: 700; line-height: 1.4; white-space: nowrap; }
.chae-status--completed { background: var(--teal-08); color: var(--teal); }
.chae-status--processing { background: var(--blue-08); color: var(--blue-deep); }
.chae-status--on-hold, .chae-status--pending { background: #fdf3e2; color: #845600; }
.chae-status--cancelled, .chae-status--failed, .chae-status--refunded { background: #f1f1f1; color: #666; }
.chae-orders { display: flex; flex-direction: column; gap: 12px; }
.chae-order { padding: 16px 18px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.chae-order__top { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.chae .chae-order__num { color: var(--ink); font-weight: 700; }
.chae .chae-order__num:hover { color: var(--teal); }
.chae-order__date { color: var(--muted); font-size: 14px; }
.chae-order__total { margin-left: auto; color: var(--ink); font-size: 16px; }
.chae-order__body { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; padding-top: 12px; }
.chae-order__thumbs { display: flex; }
.chae-order__thumb { display: flex; align-items: center; justify-content: center; width: 54px; height: 54px; margin-left: -12px; overflow: hidden; border: 2px solid #fff; border-radius: 12px; background: var(--tint); color: var(--muted); font-size: 13px; font-weight: 700; }
.chae-order__thumb:first-child { margin-left: 0; }
.chae-order__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.chae-order__items { margin: 0; color: var(--ink); font-size: 15px; font-weight: 500; line-height: 1.35; }
.chae-order__items span { color: var(--muted); font-weight: 400; }
.chae-order__items small { display: block; margin-top: 2px; color: var(--muted-2); font-size: 13px; font-weight: 400; }
.chae-order__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px 14px; }
body.chae .chae-order__btn { min-height: 38px; padding: 0 16px !important; font-size: 14px; }
.chae .chae-order__act { font-size: 14px; }
/* tracking (inc/account-area.php): "Shipped Sep 24 via USPS" on the card, Track package, and a card per package on the order page */
.chae-order__items .chae-order__ship { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; padding: 3px 10px 3px 8px; border-radius: 999px; background: var(--teal-08); color: var(--teal); font-size: 13px; font-weight: 700; }
.chae-track-btn { gap: 8px; }
.chae-track-btn svg { flex-shrink: 0; }
.chae-tracking { display: flex; flex-direction: column; gap: 12px; margin: 4px 0 28px; scroll-margin-top: 24px; }
.chae-tracking__pkg { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 18px 20px; border: 1px solid rgba(0, 98, 99, 0.14); border-radius: 18px; background: linear-gradient(165deg, #eaf5f5 0%, #fff 70%); }
.chae-tracking__icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; background: var(--teal); color: #fff; }
.chae-tracking__text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.chae-tracking__label { color: var(--blue-deep); font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae-tracking__text strong { color: var(--ink); font-size: 16px; }
.chae-tracking__num { color: var(--muted); font-size: 14px; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
body.chae .chae-tracking .chae-btn { min-height: 46px; padding: 0 20px !important; white-space: nowrap; }
.chae .woocommerce-OrderUpdate-description a { font-weight: 700; overflow-wrap: anywhere; }
@media (max-width: 560px) {
	.chae-tracking__pkg { grid-template-columns: auto minmax(0, 1fr); padding: 16px; }
	.chae-tracking__pkg .chae-btn { grid-column: 1 / -1; width: 100%; }
}
/* the other sections: WooCommerce's and plugins' own content, in the site's style */
.chae .chae-acc__content table, .chae .chae-acc__content table.shop_table { width: 100%; margin: 0 0 20px; border: 0; border-radius: 0; border-collapse: collapse; font-size: 15px; }
.chae .chae-acc__content table :is(th, td), .chae .chae-acc__content table.shop_table :is(th, td) { padding: 12px 10px; border: 0; border-top: 1px solid var(--line); background: none; text-align: left; vertical-align: middle; }
.chae .chae-acc__content table thead th { border-top: 0; color: var(--muted); font-size: 12px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.chae .chae-acc__content table tfoot :is(th, td) { font-weight: 700; }
.chae-acc__content .woocommerce-Addresses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.chae-acc__content .woocommerce-Addresses::before, .chae-acc__content .woocommerce-Addresses::after { display: none; }
.chae-acc__content .woocommerce-Address { float: none !important; width: auto !important; padding: 20px; border: 1px solid var(--line); border-radius: 18px; background: var(--tint); }
.chae-acc__content .woocommerce-Address-title { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 12px; margin-bottom: 10px; }
.chae-acc__content .woocommerce-Address-title h2 { margin: 0; font-size: 18px; }
.chae .chae-acc__content .woocommerce-Address-title a { color: var(--teal); font-size: 14px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.chae-acc__content address { color: var(--text); font-style: normal; line-height: 1.6; }
.chae-acc__content .form-row { display: flex; flex-direction: column; gap: 6px; margin: 0 0 14px; padding: 0; }
.chae-acc__content .form-row label { color: var(--ink); font-size: 14px; font-weight: 700; }
.chae .chae-acc__content :is(.input-text, select, textarea) { width: 100%; min-height: 46px; padding: 10px 14px; border: 1px solid var(--line-2); border-radius: 10px; background: #fff; color: var(--ink); font: inherit; font-size: 16px; }
.chae .chae-acc__content :is(.input-text, select, textarea):focus { border-color: var(--teal); outline: none; box-shadow: 0 0 0 3px var(--teal-08); }
.chae-acc__content fieldset { margin: 20px 0; padding: 18px 20px 6px; border: 1px solid var(--line); border-radius: 16px; }
.chae-acc__content legend { padding: 0 6px; color: var(--ink); font-family: var(--head); font-weight: 700; }
.chae-acc__content .woocommerce-pagination { display: flex; gap: 10px; }
/* ---------- account pass 2 (2026-09-27): order page, subscriptions, points, gift cards, coupons, forms ---------- */
.chae-acc-muted { margin: 0; color: var(--muted); }
.chae-status--active { background: var(--teal-08); color: var(--teal); }
.chae-status--pending-cancel { background: #fdf3e2; color: #845600; }
.chae-status--expired { background: #f1f1f1; color: #666; }
/* order page: the summary header (chae_account_order_summary) */
.chae-ohead { display: grid; gap: 16px; margin: 0 0 26px; padding: 20px 22px; border: 1px solid var(--line); border-radius: 18px; background: var(--tint); }
.chae-ohead__status { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.chae-ohead__status p { margin: 0; color: var(--ink); font-size: 15.5px; font-weight: 500; }
.chae-ohead__facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 12px 20px; margin: 0; }
.chae-ohead__facts div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.chae-ohead__facts dt { color: var(--muted); font-size: 12px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.chae-ohead__facts dd { margin: 0; color: var(--ink); font-size: 15.5px; font-weight: 600; overflow-wrap: anywhere; }
.chae-ohead__actions { display: flex; flex-wrap: wrap; gap: 10px; }
body.chae .chae-ohead__actions .chae-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 20px !important; }
/* order and subscription updates as a timeline */
.chae-acc__content .woocommerce-OrderUpdates { margin: 0 0 28px; padding: 0; list-style: none; }
.chae-acc__content .woocommerce-OrderUpdate { position: relative; margin: 0; padding: 0 0 16px 26px; }
.chae-acc__content .woocommerce-OrderUpdate::before { content: ""; position: absolute; top: 6px; left: 4px; width: 10px; height: 10px; border-radius: 50%; background: var(--teal); }
.chae-acc__content .woocommerce-OrderUpdate:not(:last-child)::after { content: ""; position: absolute; top: 20px; bottom: 2px; left: 8px; width: 2px; background: var(--line); }
.chae-acc__content .woocommerce-OrderUpdate-inner, .chae-acc__content .woocommerce-OrderUpdate-text { margin: 0; padding: 0; border: 0; }
.chae .chae-acc__content .woocommerce-OrderUpdate-meta { margin: 0 0 2px; color: var(--muted); font-size: 13px; }
.chae-acc__content .woocommerce-OrderUpdate-description p { margin: 0; color: var(--ink); }
/* order details: items with photos (woocommerce/order/order-details(-item).php) */
.chae .chae-odetails { margin-bottom: 26px; }
.chae table.shop_table.chae-odetails { border: 0; border-radius: 0; } /* WooCommerce's outline; the rows have their own lines */
.chae .chae-odetails tbody td { padding: 14px 0 !important; }
.chae .chae-odetails tbody tr:first-child td { border-top: 0; }
.chae-oitem { display: flex; align-items: center; gap: 14px; }
.chae-oitem__thumb { flex-shrink: 0; width: 60px; height: 60px; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--tint); }
.chae .chae-oitem__thumb img { display: block; width: 100%; height: 100%; object-fit: contain; }
.chae-oitem__info { display: flex; flex-direction: column; gap: 2px; min-width: 0; color: var(--ink); font-weight: 600; line-height: 1.35; }
.chae .chae-oitem__info > a { color: var(--ink); }
.chae .chae-oitem__info > a:hover { color: var(--teal); }
.chae-oitem__info .product-quantity { color: var(--muted); font-size: 13.5px; font-weight: 500; }
.chae-oitem__info .wc-item-meta { margin: 2px 0 0; padding: 0; color: var(--muted); font-size: 13px; font-weight: 400; list-style: none; }
.chae-oitem__info .wc-item-meta li { margin: 0; }
.chae-oitem__info .wc-item-meta p { display: inline; margin: 0; }
.chae .chae-odetails tr.chae-bundled td { padding: 0 0 10px !important; border-top: 0; }
.chae .chae-odetails tr.chae-bundled .chae-oitem { padding-left: 74px; gap: 10px; }
.chae .chae-odetails tr.chae-bundled .chae-oitem__thumb { width: 36px; height: 36px; border-radius: 8px; }
.chae .chae-odetails tr.chae-bundled .chae-oitem__info { flex-direction: row; flex-wrap: wrap; gap: 0 6px; color: var(--muted); font-size: 14px; font-weight: 500; }
.chae .chae-odetails tr.chae-bundled .chae-oitem__info > a { color: var(--muted); }
.chae table.shop_table.chae-odetails td.product-total { color: var(--ink); font-weight: 700; text-align: right; white-space: nowrap; }
.chae table.shop_table.chae-odetails tfoot :is(th, td) { padding: 10px 0 !important; font-weight: 500; }
.chae table.shop_table.chae-odetails tfoot th { color: var(--muted); }
.chae table.shop_table.chae-odetails tfoot td { color: var(--ink); text-align: right; }
.chae .chae-odetails tfoot tr:first-child :is(th, td) { border-top: 2px solid var(--line); }
/* addresses under an order or subscription (order-details-customer.php, also on the thank-you page) */
.chae .woocommerce-customer-details .woocommerce-columns--addresses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.chae .woocommerce-customer-details .woocommerce-columns--addresses::before, .chae .woocommerce-customer-details .woocommerce-columns--addresses::after { display: none; }
.chae .woocommerce-customer-details .woocommerce-column { float: none; width: auto; max-width: none; margin: 0; }
.chae .woocommerce-customer-details .woocommerce-column__title { margin: 0 0 8px; font-size: 18px; }
.chae .woocommerce-customer-details address { height: calc(100% - 38px); margin: 0; padding: 16px 18px; border: 1px solid var(--line); border-radius: 16px; background: var(--tint); color: var(--text); font-style: normal; line-height: 1.6; }
.chae .woocommerce-customer-details address p { margin: 8px 0 0; }
/* subscription page: the summary above Subscriptions' details (inc/account-area.php) */
.chae-sub { display: grid; gap: 14px; margin: 0 0 18px; padding: 20px 22px; border: 1px solid var(--line); border-radius: 18px; background: var(--tint); }
.chae-sub__top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.chae-sub__headline { color: var(--ink); font-family: var(--head); font-size: 20px; font-weight: 600; }
.chae-sub__body { display: flex; align-items: center; gap: 14px; }
.chae-sub__items { margin: 0; color: var(--ink); font-size: 15px; font-weight: 600; line-height: 1.4; }
.chae-sub__items small { display: block; margin-top: 2px; color: var(--muted); font-size: 14px; font-weight: 500; }
.chae .chae-acc__content table.subscription_details tr:first-child { display: none; } /* Status: in the summary */
.chae .chae-acc__content table.subscription_details tr:nth-child(2) td { border-top: 0; }
.chae .chae-acc__content table.subscription_details td:first-child { width: 40%; color: var(--muted); }
.chae .chae-acc__content table.subscription_details td:last-child { color: var(--ink); font-weight: 600; }
.chae .chae-acc__content table.subscription_details td .button { margin: 0 8px 8px 0; }
.chae-sub__manage { display: grid; gap: 12px; margin: -4px 0 18px; padding: 16px 18px; border: 1px solid var(--line); border-radius: 14px; background: #fff; } /* "Change your schedule" (chae-site inc/subscribe-save.php) */
.chae-sub__manage-title { margin: 0; color: var(--ink); font-family: var(--head); font-size: 17px; font-weight: 700; }
.chae-sub__moves { display: flex; flex-wrap: wrap; gap: 8px; }
.chae-sub__moves .chae-btn { flex: 1 1 150px; min-height: 44px; }
.chae-sub__freq { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; padding-top: 12px; border-top: 1px solid var(--line); }
.chae-sub__freq label { flex: 0 0 100%; color: var(--ink); font-weight: 700; }
.chae-sub__freq select { flex: 1 1 150px; min-height: 44px; }
.chae-sub__freq .chae-btn { min-height: 44px; }
.chae .chae-order__sub .chae-icon { margin-right: 4px; vertical-align: -2px; }
.chae .chae-acc__content table.subscription_details td .button.cancel { border-color: var(--line-2); color: var(--muted); }
/* Its own hover: the rule above outranks the buttons' teal fill on text colour only, so hovering gave grey text on
   teal (2026-10-19, user). Quiet, like the review form's Cancel: teal outline and text on white. */
.chae .chae-acc__content table.subscription_details td .button.cancel:hover { border-color: var(--teal); background: #fff; color: var(--teal); }
/* a balance (points, gift cards) */
.chae-balance { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px 18px; padding: 22px 24px; border: 1px solid rgba(0, 98, 99, 0.16); border-radius: 18px; background: linear-gradient(135deg, #eef7fa 0%, #e3f1ef 100%); }
.chae .chae-balance .chae-acc-tile__icon { width: 50px; height: 50px; margin: 0; }
.chae-balance__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.chae-balance__label { color: var(--blue-deep); font-size: 12px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.chae .chae-balance__value { color: var(--ink); font-family: var(--head); font-size: 30px; font-weight: 600; line-height: 1.15; }
.chae-balance__note { color: var(--muted); font-size: 14.5px; }
.chae-howpts { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.chae-howpts li { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 16px 18px; border: 1px solid var(--line); border-radius: 16px; color: var(--muted); font-size: 14.5px; line-height: 1.45; }
.chae-howpts strong { color: var(--ink); font-size: 15.5px; }
.chae-howpts__icon { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: var(--teal-08); color: var(--teal); }
.chae-history { margin: 0 0 18px; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.chae-history__row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 4px 18px; margin: 0; padding: 13px 2px; border-bottom: 1px solid var(--line); }
.chae-history__what { min-width: 0; color: var(--ink); font-size: 15px; }
.chae-history__what small { display: block; margin-top: 4px; color: var(--muted); font-size: 13px; }
.chae-history__when { color: var(--muted); font-size: 13.5px; white-space: nowrap; }
.chae-history__amt { min-width: 54px; padding: 3px 10px; border-radius: 999px; background: #eef1f0; color: var(--muted); font-size: 13.5px; font-weight: 700; text-align: center; white-space: nowrap; }
.chae-history__amt.is-plus { background: var(--teal-08); color: var(--teal); }
.chae-history--cards .chae-history__row { grid-template-columns: minmax(0, 1fr) auto; }
.chae .chae-balance .woocommerce-MyAccount-Giftcards-balance-amount { margin: 0; padding: 0; font-size: 30px; line-height: 1.15; }
.chae-acc__content .chae-acc-sec > .chae-acc-sec__title { margin: 0 0 14px; }
.chae-gcadd { margin: 22px 0 0; }
.chae-gcadd__label { display: block; margin: 0 0 8px; color: var(--ink); font-size: 15px; font-weight: 700; }
.chae-acc__content .chae-gcadd .woocommerce-MyAccount-Giftcards-form { display: flex; gap: 10px; margin: 0; }
.chae-acc__content .chae-gcadd .input-text { flex: 1 1 auto; width: auto !important; min-width: 0; margin: 0 !important; }
body.chae .chae-gcadd .chae-btn { flex: 0 0 auto; width: auto !important; min-height: 46px; margin: 0 !important; white-space: nowrap; }
/* coupons (Smart Coupons): its ticket colors in the brand's, here and in the cart's available coupons */
body.chae { --sc-color1: #003f40; --sc-color2: #ffffff; --sc-color3: var(--teal); } /* 1: border, code, badge; 2: text on 3 */
.chae-acc__content:has(#coupons_list) > h2 { display: none; } /* repeats the page title */
.chae-acc__content:has(#coupons_list) > p { color: var(--muted); font-size: 14.5px; }
.chae-acc__content #coupons_list h4 { margin: 20px 0 10px; font-family: var(--head); font-size: 17px; font-weight: 600; color: var(--ink); }
/* account details and address forms */
.chae .chae-acc__content input[type="checkbox"], .chae .chae-acc__content input[type="radio"] { width: 18px; height: 18px; margin: 0 8px 0 0; accent-color: var(--teal); vertical-align: -3px; }
.chae-acc__content fieldset { margin: 24px 0; padding: 20px 22px 8px; border: 1px solid var(--line); border-radius: 16px; background: var(--tint); }
.chae .chae-acc__content legend { float: left; width: 100%; margin: 0 0 14px; padding: 0; font-size: 18px; }
.chae-acc__content legend + * { clear: both; }
.chae .chae-acc__content #account_display_name_description em { color: var(--muted); font-size: 13px; font-style: normal; }
.chae .chae-acc__content :is(#update_all_subscriptions_billing_contact_field, #update_all_subscriptions_addresses_field) .optional { display: none; } /* a checkbox is optional anyway */
/* Account details → Sign-in security: links to the Passkeys and Two-step sign-in pages */
.chae-acc-security__list { margin: 0 0 10px; padding: 0; list-style: none; }
.chae-acc-security__list li + li { border-top: 1px solid var(--line); }
.chae .chae-acc-security__list a { display: flex; align-items: center; gap: 12px; padding: 12px 0; color: var(--ink); text-decoration: none; }
.chae-acc-security__list a > svg:first-child { flex: 0 0 auto; color: var(--teal); }
.chae-acc-security__list a > svg:last-child { flex: 0 0 auto; margin-left: auto; color: var(--muted-2); }
.chae-acc-security__list strong { display: block; font-size: 15px; font-weight: 600; }
.chae-acc-security__list small { display: block; margin-top: 1px; color: var(--muted); font-size: 13.5px; }
.chae .chae-acc-security__list a:hover strong { color: var(--teal); }
/* Orders → WooCommerce's "confirm your email" prompt, moved under the list: a quiet tip */
.chae-acc-verify { margin-top: 18px; }
.chae-acc-verify:empty { display: none; }
.chae .chae-acc-verify .woocommerce-info { margin: 0; border-left: 0; background: var(--tint); box-shadow: none; color: var(--muted-2); font-size: 14px; }
.chae .chae-acc__content :is(button[name="save_account_details"], button[name="save_address"]) { border-color: transparent !important; background: var(--btn-fill) border-box !important; color: #fff !important; box-shadow: 0 3px 0 var(--btn-edge) !important; }
.chae .chae-acc__content :is(button[name="save_account_details"], button[name="save_address"]):hover { transform: translate(0, 3px); box-shadow: 0 0 0 var(--btn-edge) !important; }
.chae .chae-acc__content .woocommerce-Addresses .woocommerce-Address-title::before, .chae .chae-acc__content .woocommerce-Addresses .woocommerce-Address-title::after { display: none; } /* WooCommerce's clearfix took space in the flex row */
/* Wordfence passkeys / two-step sign-in panels */
.chae .chae-acc__content .wfls-block { overflow: hidden; border: 1px solid var(--line) !important; border-radius: 16px; box-shadow: none !important; }
.chae .chae-acc__content .wfls-block-header { background: var(--tint); }
.chae .chae-acc__content .wfls-passkey-information { border-radius: 16px; }
@media (max-width: 560px) {
	.chae-ohead, .chae-sub { padding: 16px; }
	.chae-ohead__facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.chae-ohead__actions .chae-btn { flex: 1 1 auto; justify-content: center; }
	.chae .woocommerce-customer-details .woocommerce-columns--addresses { grid-template-columns: minmax(0, 1fr); }
	.chae .chae-odetails tr.chae-bundled .chae-oitem { padding-left: 36px; }
	.chae .woocommerce-customer-details address { height: auto; }
	.chae-balance { grid-template-columns: auto minmax(0, 1fr); padding: 18px; }
	.chae-balance .chae-btn { grid-column: 1 / -1; justify-content: center; }
	.chae .chae-balance__value { font-size: 26px; }
	.chae-history__row { grid-template-columns: minmax(0, 1fr) auto; }
	.chae-history__when { grid-row: 2; grid-column: 1; }
	.chae-history__amt { grid-row: 1 / span 2; grid-column: 2; }
	.chae .chae-acc__content table.subscription_details td:first-child { width: 45%; }
}

/* ---------- focused checkout header and footer (header.php / footer.php, chae_focus_checkout()) ---------- */
.chae-header--focus { border-bottom: 1px solid var(--line); background: #fff; }
.chae-header__focus { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; min-height: 80px; }
.chae-header__focus .chae-logo img { display: block; width: auto; height: 46px; }
.chae-header__secure { display: inline-flex; align-items: center; gap: 8px; padding-left: 24px; border-left: 1px solid var(--line); color: var(--muted); font-size: 15px; font-weight: 500; }
.chae-header__secure .chae-icon { color: var(--teal); }
.chae .chae-header__back { margin-left: auto; color: var(--teal); font-size: 15px; font-weight: 700; white-space: nowrap; }
.chae-header__back-short { display: none; }
.chae-footer--focus { margin-top: 48px; padding: 22px 0; border-top: 1px solid var(--line); background: #fff; color: var(--muted); font-size: 13.5px; }
.chae-footer__focus { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 24px; }
.chae-footer__focus nav { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.chae .chae-footer__focus a { color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.chae .chae-footer__focus a:hover { color: var(--teal); }
@media (max-width: 560px) {
	.chae-header__focus { min-height: 64px; gap: 8px 14px; }
	.chae-header__focus .chae-logo img { height: 38px; }
	.chae-header__secure { padding-left: 14px; font-size: 14px; }
	.chae .chae-header__back { font-size: 14px; }
	.chae-header__back-long { display: none; }
	.chae-header__back-short { display: inline; }
}

/* ---------- footer ---------- */
.chae-footer { margin-top: 64px; background: #fff; border-top: 1px solid var(--line); }
.chae-footer__grid { padding-top: 56px; padding-bottom: 36px; display: grid; grid-template-columns: 1.4fr 1.5fr 1fr 1fr; gap: 48px; }
/* Shop's 11 links in two columns (2026-10-16, user: "the link list looks really tall"): one column ran twice as long as
   Support. CSS columns balance themselves, so a link added to the menu just lands in one of the two. */
.chae-footer__grid > nav.chae-footer__col:first-of-type .chae-footer__menu { display: block; columns: 2; column-gap: 24px; }
.chae-footer__grid > nav.chae-footer__col:first-of-type .chae-footer__menu li { margin: 0 0 10px; break-inside: avoid; }
.chae-footer__brand img { height: 50px; width: auto; }
.chae-footer__brand p { margin: 16px 0 0; max-width: 340px; font-size: 15px; color: var(--muted); }
.chae-footer__contact { margin: 14px 0 0; padding: 0; list-style: none; font-size: 15px; line-height: 1.8; }
.chae .chae-footer__contact a { display: inline-flex; align-items: center; gap: 8px; color: var(--ink); font-weight: 500; }
.chae-footer__contact svg { flex-shrink: 0; color: var(--teal); }
.chae .chae-footer__contact a:hover { color: var(--teal); }
.chae-footer__title { margin: 0 0 12px; font-size: 17px !important; font-weight: 700 !important; }
.chae-footer__menu { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; font-size: 15px; }
.chae-footer__menu a { color: var(--text); }
.chae-footer__menu a:hover { color: var(--teal); }
.chae-footer__trust { padding-top: 24px; padding-bottom: 28px; border-top: 1px solid #e6e9e8; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.chae-footer__trust > div { display: flex; gap: 14px; }
.chae-footer__trust img { display: block; width: 30px; height: auto; }
.chae-footer__trust p { margin: 0; font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.chae-footer__trust strong { display: block; font-size: 12.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink); }
.chae-footer__icon { display: flex; flex-shrink: 0; align-items: center; justify-content: center; width: 46px; height: 46px; border: 1px solid var(--line); border-radius: 50%; background: #fff; color: var(--blue-deep); }
.chae-footer__bar { background: var(--teal-bar); color: #fff; font-size: 13.5px; }
.chae .chae-footer__bar a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.chae-footer__bar-inner { min-height: 56px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px; padding-top: 12px; padding-bottom: 12px; }

/* ---------- responsive ---------- */
/* ---------- blog list (inc/blog.php: Blog page, topic pages) ---------- */
.chae-blog { display: flex; flex-direction: column; gap: 28px; padding: 8px 0 24px; }
.chae-blog__head { display: flex; flex-direction: column; align-items: center; gap: 12px; max-width: 720px; margin: 28px auto 4px; text-align: center; }
.chae .chae-blog__title { margin: 0; font-size: clamp(32px, 4vw, 44px); }
.chae-blog__text { margin: 0; color: var(--muted); font-size: 17px; }
.chae-blog__tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 14px 24px; } /* centered: the search sat alone at the left under the pills */
.chae-blog__cats { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
/* The Journal page's content block carries the old site's whitish photo backdrop (bg-1.webp), which ended in a seam above
   the newsletter: the page's own background runs through instead (2026-10-13 audit). */
.chae .wp-block-group.alignfull:has(.chae-blog) { background: none !important; }
.chae .chae-blog__cats a { padding: 8px 14px; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; color: var(--ink); font-size: 14px; font-weight: 500; white-space: nowrap; }
.chae .chae-blog__cats a:hover { border-color: var(--teal); color: var(--teal); }
.chae .chae-blog__cats a[aria-current] { border-color: var(--teal); background: var(--teal); color: #fff; }
.chae-blog__search { position: relative; display: flex; align-items: center; flex: 0 1 300px; }
.chae-blog__search .chae-icon { position: absolute; left: 15px; color: var(--muted); pointer-events: none; }
.chae .chae-blog__search input { width: 100%; height: 44px; margin: 0; padding: 0 16px 0 42px; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; color: var(--ink); font: inherit; font-size: 15px; }
.chae .chae-blog__search input:focus { border-color: var(--teal); outline: none; box-shadow: 0 0 0 3px var(--teal-08); }
.chae-blog__found { margin: 0; color: var(--muted); }
.chae .chae-blog__found a { margin-left: 10px; color: var(--teal); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.chae-blog__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.chae-blog__empty { padding: 40px 0; text-align: center; }
.chae-article { position: relative; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-card); background: #fff; box-shadow: var(--shadow-sm); transition: transform 0.2s ease, box-shadow 0.2s ease; }
.chae-article:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.chae-article__img { aspect-ratio: 16 / 10; overflow: hidden; background: var(--tint); }
.chae-article__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.chae-article__placeholder { display: flex; align-items: center; justify-content: center; height: 100%; }
.chae-article__placeholder img { width: 141px; height: auto; object-fit: contain; opacity: 0.8; }
.chae-article__body { display: flex; flex: 1; flex-direction: column; gap: 8px; padding: 20px 22px 22px; }
.chae-article__cat { color: var(--blue-deep); font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae .chae-article__title { margin: 0; font-size: 19px; line-height: 1.3; }
.chae .chae-article__title a { color: var(--ink); }
.chae-article__title a::after { content: ""; position: absolute; inset: 0; } /* the whole card is the link */
.chae .chae-article:hover .chae-article__title a { color: var(--teal); }
.chae-article__sum { display: -webkit-box; margin: 0; overflow: hidden; color: var(--muted); font-size: 15px; line-height: 1.55; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.chae-article__meta { margin: auto 0 0; padding-top: 6px; color: var(--muted-2); font-size: 13px; }
.chae-article--featured { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
.chae-article--featured .chae-article__img { min-height: 340px; aspect-ratio: auto; }
.chae-article--featured .chae-article__body { justify-content: center; gap: 12px; padding: 40px 44px; }
.chae .chae-article--featured .chae-article__title { font-size: clamp(24px, 2.6vw, 32px); line-height: 1.2; }
.chae-article--featured .chae-article__sum { font-size: 16.5px; -webkit-line-clamp: 4; }
.chae-article--featured .chae-article__meta { margin-top: 4px; }
.chae-pager { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.chae .chae-pager .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; padding: 0 14px; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; color: var(--ink); font-size: 14.5px; font-weight: 700; }
.chae .chae-pager a.page-numbers:hover { border-color: var(--teal); color: var(--teal); }
.chae .chae-pager .page-numbers.current { border-color: var(--teal); background: var(--teal); color: #fff; }
.chae .chae-pager .page-numbers.dots { border: 0; background: none; }

/* ---------- blog article (single.php) ---------- */
.chae-story__crumbs { margin-top: 18px; }
.chae-story__crumbs li:last-child { padding: 0; }
.chae .chae-story__crumbs li:last-child a { padding: 4px 0; color: var(--muted); } /* was #fff from a dark header: the category was invisible, "Home / Blog /" (2026-10-17 sweep) */
.chae-story__head { display: flex; flex-direction: column; align-items: center; gap: 16px; max-width: 820px; margin: 36px auto 32px; text-align: center; }
.chae .chae-story__cat { align-self: center; }
.chae .chae-story__title { margin: 0; font-size: clamp(30px, 4.2vw, 48px); line-height: 1.15; }
.chae-story__meta { margin: 0; color: var(--muted-2); font-size: 14.5px; }
.chae-story__hero { max-width: 1100px; margin: 0 auto 32px; }
.chae-story__hero img { display: block; width: 100%; height: auto; max-height: 580px; object-fit: cover; border-radius: 24px; }
.chae-story__panel { max-width: 1100px; margin: 0 auto; padding: 56px 40px; border: 1px solid var(--panel-border); border-radius: var(--r-panel); background: #fff; box-shadow: var(--shadow); }
.chae-story__content { color: var(--text); font-size: 18px; line-height: 1.75; }
.chae-story__content > * { max-width: 720px; margin-left: auto; margin-right: auto; }
.chae-story__content > :is(.alignwide, .wp-block-columns, .wp-block-embed, .wp-block-woocommerce-handpicked-products, .chae-bb-row:has(.wp-block-columns)) { max-width: 960px; } /* side-by-side layouts get more room; text stays at reading width */
.chae-story__content > .alignfull { max-width: none; margin-left: -40px; margin-right: -40px; }
.chae-story__content > :first-child { margin-top: 0; }
.chae-story__content :where(p, ul, ol, blockquote, figure, table, .wp-block-buttons) { margin-top: 0; margin-bottom: 1.25em; }
.chae-story__content :where(h2) { margin-top: 1.8em; margin-bottom: 0.6em; font-size: clamp(24px, 2.6vw, 30px); line-height: 1.25; }
.chae-story__content :where(h3) { margin-top: 1.5em; margin-bottom: 0.5em; font-size: 21px; line-height: 1.3; }
.chae-story__content :where(h4) { margin-top: 1.4em; margin-bottom: 0.4em; font-size: 18px; }
.chae-story__content strong { color: var(--ink); }
.chae-story__content :where(p, li, td, th, figcaption, blockquote) a:not([class]) { color: var(--teal); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.chae-story__content :where(ul, ol) { padding-left: 1.3em; }
.chae-story__content li { margin-bottom: 0.4em; }
.chae-story__content li::marker { color: var(--blue); }
.chae-story__content img { max-width: 100%; height: auto; border-radius: 16px; }
.chae-story__content figcaption { margin-top: 8px; color: var(--muted-2); font-size: 14px; text-align: center; }
.chae-story__content :where(blockquote.wp-block-quote, blockquote:not([class])) { padding: 4px 0 4px 24px; border-left: 3px solid var(--blue); color: var(--ink); font-size: 20px; font-style: italic; }
.chae-story__content .wp-block-pullquote { padding: 32px; border: 0; border-radius: 20px; background: var(--tint); color: var(--ink); font-family: var(--head); font-size: 22px; text-align: center; }
.chae-story__content :where(hr, .wp-block-separator) { width: 120px; max-width: 120px; height: 3px; margin-top: 2.5em; margin-bottom: 2.5em; border: 0; border-radius: 2px; background: linear-gradient(90deg, var(--teal), var(--blue)); opacity: 1; }
.chae-story__content table { width: 100%; border-collapse: collapse; font-size: 16px; }
.chae-story__content :where(th, td) { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; }
.chae-story__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; max-width: 720px; margin: 40px auto 0; padding-top: 24px; border-top: 1px solid var(--line); }
.chae-share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.chae-share__label { margin-right: 4px; color: var(--muted); font-size: 14px; font-weight: 700; }
.chae .chae-share__btn { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 12px; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; color: var(--ink); font: inherit; font-size: 13.5px; font-weight: 500; cursor: pointer; }
.chae .chae-share__btn:hover { border-color: var(--teal); color: var(--teal); }
.chae-share__btn .chae-icon { color: var(--blue-deep); }
.chae-story__shop { margin-top: 40px; }
.chae-story__more { margin: 48px 0 8px; }
.chae .chae-story__more-title { margin: 0 0 22px; font-size: 28px; text-align: center; }
/* blog pass 2 (2026-09-27): the list keeps the site's width; long articles get contents and a progress bar */
.chae-blog { width: 100%; max-width: 1200px; margin-left: auto; margin-right: auto; } /* the Blog page uses the Full width template */
.chae-progress { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; height: 3px; pointer-events: none; }
body.admin-bar .chae-progress { top: var(--wp-admin--admin-bar--height, 32px); }
.chae-progress span { display: block; height: 100%; background: linear-gradient(90deg, var(--teal), var(--blue)); transform: scaleX(0); transform-origin: 0 50%; }
.chae-toc { max-width: 720px; margin: 0 auto 40px; padding: 18px 22px; border: 1px solid var(--line); border-radius: 18px; background: var(--tint); }
.chae-toc summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--ink); font-family: var(--head); font-size: 18px; font-weight: 600; list-style: none; cursor: pointer; }
.chae-toc summary::-webkit-details-marker { display: none; }
.chae-toc summary::after { content: ""; flex-shrink: 0; width: 8px; height: 8px; margin: -4px 4px 0 0; border-right: 2px solid var(--teal); border-bottom: 2px solid var(--teal); transform: rotate(45deg); transition: transform 0.2s ease; }
.chae-toc details[open] summary::after { margin-top: 4px; transform: rotate(-135deg); }
.chae-toc ol { margin: 14px 0 0; padding-left: 1.5em; columns: 2; column-gap: 36px; font-size: 15.5px; line-height: 1.45; }
.chae-toc li { margin: 0 0 8px; break-inside: avoid; }
.chae-toc li::marker { color: var(--blue); font-weight: 700; }
.chae .chae-toc a { color: var(--teal); }
.chae .chae-toc a:hover { text-decoration: underline; text-underline-offset: 3px; }
.chae-story__content h2[id] { scroll-margin-top: 24px; }
body.admin-bar .chae-story__content h2[id] { scroll-margin-top: calc(24px + var(--wp-admin--admin-bar--height, 32px)); }
@media (max-width: 782px) {
	.chae-blog__tools { flex-wrap: nowrap; } /* a wrapping column sized itself to the one-row topic list, 1,200px wide */
	.chae-blog__cats { -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
	.chae-blog__cats::-webkit-scrollbar { display: none; }
	.chae-toc { margin-bottom: 28px; padding: 14px 16px; }
	.chae-toc ol { columns: 1; }
}
@media (max-width: 560px) {
	.chae-story__head { align-items: flex-start; margin: 22px 0 24px; text-align: left; } /* long titles read better left-aligned on phones */
	.chae .chae-story__cat { align-self: flex-start; }
	.chae .chae-story__title { font-size: 30px; }
}

/* ---------- Gravity Forms anywhere (contact, surveys, giveaways): submit is a primary button ---------- */
body.chae .gform_wrapper :is(.gform_button, .gform_next_button) { min-height: 48px; padding: 0 26px !important; border: 0 !important; border-radius: var(--r-btn) !important; background: var(--btn-fill) !important; box-shadow: 0 3px 0 var(--btn-edge) !important; color: #fff !important; font-family: var(--body) !important; font-size: 15px !important; font-weight: 700 !important; cursor: pointer; transition: transform 0.12s ease, box-shadow 0.12s ease; }
body.chae .gform_wrapper :is(.gform_button, .gform_next_button):hover { transform: translate(0, 3px); box-shadow: 0 0 0 var(--btn-edge) !important; }

/* ---------- converted pages: the PDF stand-in (inc/legacy-shortcodes.php), and page designs with their own styles ---------- */
.chae-pdf { display: flex; flex-direction: column; gap: 16px; }
.chae-pdf__view { display: block; width: 100%; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.chae-pdf__actions { margin: 0; text-align: center; }
@media (hover: none) { .chae-pdf__view { display: none; } } /* phones and tablets: the button opens the PDF */
/* These page designs named fonts the site never loads (Karla, Cormorant, Inter, BonVivant), so visitors got their
   device's fallback fonts and Georgia; use the brand's instead. */
.chae .chae-legal { --sans: var(--body); --display: var(--head); }
.chae .chae-faq-wrap, .chae .chae-faq-wrap :is(button, input) { font-family: var(--body); }
.chae .chae-faq-card h2, .chae .chae-faq-support-cta h2 { font-family: var(--head); font-weight: 600; }
.chae .tf-routine-page { --tf-title-font: var(--head); font-family: var(--body); }
.chae .tf-routine-page :is(.tf-benefit h3, .tf-four-step-card h3, .tf-four-step-card h4, .tf-detail-card h3, .tf-review-card blockquote), .chae #routine-bundle .tf-gift-pop-title { font-family: var(--body); }
.chae .tf-routine-page :is(.tf-product-number, .tf-hero-copy h1 sup) { font-family: var(--head); }

/* ---------- newsletter band (inc/newsletter.php) ---------- */
.chae-news { margin-top: 64px; padding: 56px 0; border-top: 1px solid var(--panel-border); background: linear-gradient(135deg, #e5f2f6 0%, #e2f0ee 100%); }
.chae-news + .chae-footer { margin-top: 0; }
.chae-news__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 480px); align-items: center; gap: 32px 64px; }
.chae-news__text { display: flex; flex-direction: column; gap: 10px; }
.chae .chae-news__title { margin: 0; font-size: clamp(28px, 3.2vw, 38px); }
.chae-news__text p { max-width: 460px; margin: 0; color: var(--muted); font-size: 17px; }
.chae-news__form { padding: 24px 26px; border-radius: 22px; background: #fff; box-shadow: var(--shadow); }
.chae-news .gform_wrapper { margin: 0 !important; }
.chae-news .gform-theme--framework { --gf-form-gap-y: 14px; --gf-label-space-primary: 6px; }
.chae-news .gform_wrapper .gform_footer { margin: 14px 0 0 !important; padding: 0 !important; }
body.chae .chae-news .gform_wrapper .gform_button { width: calc(100% - 3px) !important; }
.chae-news .gform_confirmation_message { color: var(--ink); font-size: 16px; font-weight: 500; }

/* ---------- sign in / create account / reset password (inc/account.php, assets/js/account.js) ---------- */
.chae-acct { display: flex; align-items: center; gap: 8px; color: var(--ink) !important; font-size: 15px; font-weight: 500; white-space: nowrap; }
.chae-acct:hover { color: var(--teal) !important; }
.chae-authwin { position: fixed; inset: 0; z-index: 510; display: flex; align-items: center; justify-content: center; padding: 24px 16px; }
.chae-authwin[hidden] { display: none; }
.chae-authwin__backdrop { position: absolute; inset: 0; background: rgba(17, 30, 28, 0.45); opacity: 0; transition: opacity 0.22s ease; }
.chae-authwin__panel { position: relative; width: min(460px, 100%); max-height: calc(100dvh - 48px); overflow-y: auto; overscroll-behavior: contain; padding: 36px 32px 30px; border-radius: 26px; background: #fff; box-shadow: 0 30px 70px rgba(17, 30, 28, 0.25); outline: none; opacity: 0; transform: translateY(10px) scale(0.98); transition: opacity 0.22s ease, transform 0.22s ease; }
.chae-authwin.is-open .chae-authwin__backdrop { opacity: 1; }
.chae-authwin.is-open .chae-authwin__panel { opacity: 1; transform: none; }
.chae-authwin__close { position: absolute; top: 14px; right: 14px; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 10px; background: var(--tint); color: var(--ink); cursor: pointer; }
.chae-authwin__close:hover { background: var(--teal-08); color: var(--teal); }
.chae-authpage { max-width: 480px; margin: 8px auto 32px; padding: 40px 36px 34px; border: 1px solid var(--panel-border); border-radius: var(--r-panel); background: #fff; box-shadow: var(--shadow); }
.chae-store--my-account:has(.chae-authpage) > .chae-page__title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.chae-auth { display: flex; flex-direction: column; gap: 18px; }
.chae-auth__head { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.chae-auth__logo { width: 113px; height: auto; margin-bottom: 6px; }
.chae .chae-auth__title { margin: 0; color: var(--ink); font-family: var(--head); font-size: 26px; font-weight: 700; line-height: 1.2; }
.chae-auth__sub { max-width: 360px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.5; }
.chae-auth__tabs { display: grid; grid-template-columns: 1fr 1fr; padding: 4px; border: 1px solid var(--line); border-radius: 999px; background: var(--tint); }
.chae-auth__tabs[hidden] { display: none; }
.chae-auth__tabs [role="tab"] { height: 40px; padding: 0 12px; border: 0; border-radius: 999px; background: none; color: var(--muted); font: inherit; font-size: 14.5px; font-weight: 700; cursor: pointer; }
.chae-auth__tabs [aria-selected="true"] { background: #fff; color: var(--teal); box-shadow: 0 2px 8px rgba(26, 36, 33, 0.1); }
.chae-auth__errors { padding: 12px 14px; border: 1px solid #f1cfc9; border-radius: 12px; background: #fdf1ef; color: #8a2a1c; font-size: 14px; line-height: 1.45; }
.chae-auth__errors:empty { display: none; }
.chae-auth__errors p { margin: 0; }
.chae-auth__errors a { color: inherit; font-weight: 700; text-decoration: underline; }
.chae-auth__view[hidden] { display: none; }
.chae .chae-auth form.chae-auth__form { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; border: 0; border-radius: 0; } /* beats WooCommerce's boxed .woocommerce form.login */
.chae-field { display: flex; flex-direction: column; gap: 6px; margin: 0; }
.chae-field label { color: var(--ink); font-size: 14px; font-weight: 700; }
.chae .chae-auth .input-text, .chae .chae-authpage .input-text, .chae .chae-verify .input-text { width: 100%; height: 48px; margin: 0; padding: 0 14px; border: 1px solid var(--line-2); border-radius: 10px; background: #fff; box-shadow: none; color: var(--ink); font: inherit; font-size: 16px; }
.chae .chae-auth .input-text:focus, .chae .chae-verify .input-text:focus { border-color: var(--teal); outline: none; box-shadow: 0 0 0 3px var(--teal-08); }
.chae-field__pass { position: relative; display: block; }
.chae-field__pass .show-password-input { display: none !important; } /* WooCommerce's own eye button, on top of ours */
.chae .chae-field__pass .input-text { padding-right: 50px; }
.chae-field__pass input::-ms-reveal, .chae-field__pass input::-ms-clear { display: none; } /* the browser's own eye (Edge, some Chromium builds); ours replaces it */
.chae-field__eye { position: absolute; top: 50%; right: 4px; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 8px; background: none; color: var(--muted); cursor: pointer; transform: translateY(-50%); }
.chae-field__eye:hover { color: var(--teal); }
.chae-field__eye .chae-eye-hide, .chae-field__eye[aria-pressed="true"] .chae-eye-show { display: none; }
.chae-field__eye[aria-pressed="true"] .chae-eye-hide { display: block; }
.chae-auth__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; font-size: 14px; }
.chae-auth__check { display: inline-flex; align-items: center; gap: 8px; color: var(--text); cursor: pointer; }
.chae-auth__check input { width: 17px; height: 17px; margin: 0; accent-color: var(--teal); }
.chae .chae-auth__link { color: var(--teal); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
body.chae .chae-auth__submit { width: calc(100% - 3px); min-height: 50px; margin-top: 4px; }
.chae-auth__note { margin: 0; color: var(--muted); font-size: 14px; }
.chae-auth__back { margin: 0; font-size: 14px; text-align: center; }
.chae-auth__perks { display: flex; flex-direction: column; gap: 8px; margin: 0 0 16px; padding: 14px 16px; border-radius: 14px; background: var(--tint); color: var(--ink); font-size: 14.5px; list-style: none; }
.chae-auth__perks li { display: flex; align-items: flex-start; gap: 8px; }
.chae-auth__perks .chae-icon { flex-shrink: 0; margin-top: 3px; color: var(--blue); stroke-width: 2.6; }
.chae-auth .woocommerce-privacy-policy-text p { margin: 0; color: var(--muted-2); font-size: 12.5px; line-height: 1.5; }
.chae-auth__sent, .chae-auth__done { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 4px 0; text-align: center; }
.chae-auth__sent[hidden], .chae-auth__done[hidden] { display: none; }
.chae-auth__sent-icon { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 50%; background: var(--blue-08); color: var(--blue-deep); }
.chae-auth.is-done > :not([data-auth-done]) { display: none; }
/* Social Login for WooCommerce's buttons, under each form */
.chae-auth .xoo-sl-container { margin: 6px 0 0; }
.chae-auth .xoo-sl-loginvia { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; color: var(--muted-2); font-size: 13px; font-weight: 500; text-align: center; }
.chae-auth .xoo-sl-loginvia span:empty { flex: 1; height: 1px; background: var(--line); } /* the plugin's own divider lines */
.chae-auth .xoo-sl-loginvia span:not(:empty) { text-transform: lowercase; }
.chae-auth .xoo-sl-loginvia span:not(:empty)::first-letter { text-transform: uppercase; } /* "Or continue with" */
.chae-auth .xoo-sl-btns-container { display: flex; flex-direction: column; align-items: center; gap: 10px; }
@media (max-width: 560px) {
	.chae-authwin { align-items: flex-end; padding: 0; }
	.chae-authwin__panel { width: 100%; max-height: 94dvh; padding: 30px 20px calc(24px + env(safe-area-inset-bottom)); border-radius: 24px 24px 0 0; transform: translateY(24px); }
	.chae-authpage { padding: 30px 20px 26px; border-radius: 22px; }
	.chae-acct__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } /* hidden from view only: it's the link's name for screen readers */
}
@media (prefers-reduced-motion: reduce) {
	.chae-authwin__panel, .chae-authwin__backdrop { transition: none; }
}

/* ---------- side cart (inc/side-cart.php, assets/js/side-cart.js) ---------- */
html.chae-no-scroll { overflow: hidden; }
.chae-sidecart { position: fixed; inset: 0; z-index: 500; }
.chae-sidecart[hidden] { display: none; }
.chae-sidecart__backdrop { position: absolute; inset: 0; background: rgba(17, 30, 28, 0.42); opacity: 0; transition: opacity 0.25s ease; }
.chae-sidecart__panel { position: absolute; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; width: min(440px, calc(100vw - 24px)); border-radius: 22px 0 0 22px; background: #fff; box-shadow: -18px 0 50px rgba(26, 36, 33, 0.18); outline: none; transform: translateX(104%); transition: transform 0.3s cubic-bezier(0.22, 0.8, 0.3, 1); }
body.admin-bar .chae-sidecart__panel { top: var(--wp-admin--admin-bar--height, 32px); }
.chae-sidecart.is-open .chae-sidecart__backdrop { opacity: 1; }
.chae-sidecart.is-open .chae-sidecart__panel { transform: none; }
.chae-sidecart__head { display: flex; align-items: center; gap: 12px; padding: 20px 22px 16px; border-bottom: 1px solid var(--line); }
.chae-sidecart__title { margin: 0; color: var(--ink); font-family: var(--head); font-size: 22px; font-weight: 700; }
.chae-sidecart__count { color: var(--muted); font-family: var(--body); font-size: 16px; font-weight: 500; }
.chae-sidecart__close { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin-left: auto; padding: 0; border: 0; border-radius: 10px; background: var(--tint); color: var(--ink); cursor: pointer; }
.chae-sidecart__close:hover { background: var(--teal-08); color: var(--teal); }
.chae-sidecart__errors, .chae-formnotice { padding: 12px 14px; border: 1px solid #f1cfc9; border-radius: 12px; background: #fdf1ef; color: #8a2a1c; font-size: 14px; line-height: 1.45; }
.chae-sidecart__errors { margin: 14px 22px 0; }
.chae-sidecart__errors:empty, .chae-formnotice[hidden] { display: none; }
.chae-sidecart__errors p, .chae-formnotice p { margin: 0; }
.chae-sidecart__errors p + p, .chae-formnotice p + p { margin-top: 6px; }
.chae-formnotice { margin: 0 0 16px; }
body.chae .chae-formnotice a.button { display: inline !important; min-height: 0; margin: 0 8px 0 0; padding: 0 !important; border: 0; background: none !important; box-shadow: none !important; color: inherit !important; font-size: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; transform: none; }
.chae-sidecart__errors a.wc-forward { display: none !important; } /* "View cart" inside the cart itself */
.chae-sidecart__body, .chae-sidecart__content { display: flex; flex: 1; flex-direction: column; min-height: 0; }
.chae-sidecart__undo { display: flex; align-items: center; gap: 10px; margin: 14px 22px 0; padding: 10px 14px; border-radius: 12px; background: var(--tint); color: var(--ink); font-size: 14px; }
.chae-sidecart__undo button { margin-left: auto; padding: 0; border: 0; background: none; color: var(--teal); font: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.chae-sidecart__ship { margin: 14px 22px 0; padding: 12px 14px; border-radius: 14px; background: var(--tint); color: var(--ink); font-size: 14px; }
.chae-sidecart__ship p { display: flex; flex-wrap: wrap; align-items: center; gap: 0 6px; margin: 0 0 8px; }
.chae-sidecart__ship strong { color: var(--teal); }
.chae-sidecart__ship .chae-icon { color: var(--teal); }
.chae-sidecart__meter { display: block; height: 6px; overflow: hidden; border-radius: 3px; background: #dbe5e3; }
.chae-sidecart__meter span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--teal), var(--blue)); transition: width 0.4s ease; }
/* shipping + free-gift progress in one card (inc/side-cart.php chae_cart_progress): one line, one meter, a marker per goal */
.chae-rewards p .chae-icon { flex: none; }
.chae-rewards__dot { color: var(--muted); }
.chae-rewards__track { position: relative; margin: 0 10px; }
.chae-rewards__track .chae-sidecart__meter { margin: 7px 0; }
.chae-rewards__mark { position: absolute; top: 50%; display: grid; place-items: center; width: 20px; height: 20px; border: 2px solid #dbe5e3; border-radius: 50%; background: #fff; color: #8a9a97; transform: translate(-50%, -50%); }
.chae-rewards__mark .chae-icon { width: 11px; height: 11px; color: inherit; }
.chae-rewards__mark.is-reached { border-color: var(--teal); background: var(--teal); color: #fff; }
.cart_totals .chae-rewards.is-free .chae-rewards__track, .chae-sum .chae-rewards.is-free .chae-rewards__track { display: none; }
.chae-sidecart__items { flex: 1; min-height: 0; margin: 0; padding: 4px 22px; overflow-y: auto; overscroll-behavior: contain; list-style: none; }
.chae-sidecart__item { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--line); transition: opacity 0.2s ease; }
.chae-sidecart__item:last-child { border-bottom: 0; }
.chae-sidecart__item.is-busy { opacity: 0.5; pointer-events: none; }
.chae-sidecart__item.is-child { grid-template-columns: 48px minmax(0, 1fr); gap: 12px; margin-top: -8px; padding: 0 0 12px 22px; border-bottom: 0; }
.chae-sidecart__thumb { display: block; width: 100%; aspect-ratio: 1; overflow: hidden; border-radius: 14px; background: var(--tint); }
.chae-sidecart__item.is-child .chae-sidecart__thumb { border-radius: 10px; }
.chae-sidecart__thumb img { display: block; width: 100%; height: 100%; object-fit: contain; }
.chae-sidecart__info { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.chae-sidecart__name { margin: 0; color: var(--ink); font-size: 15px; font-weight: 700; line-height: 1.35; }
.chae-sidecart__item.is-child .chae-sidecart__name { font-size: 13.5px; font-weight: 500; }
.chae .chae-sidecart__name a { color: var(--ink); }
.chae .chae-sidecart__name a:hover { color: var(--teal); }
.chae-sidecart__new { display: inline-flex; align-items: center; gap: 3px; margin-left: 6px; padding: 1px 8px; border-radius: 999px; background: var(--blue-08); color: var(--blue-deep); font-size: 12px; font-weight: 700; vertical-align: 1px; white-space: nowrap; }
.chae-sidecart__plan { display: inline-flex; align-items: center; gap: 5px; margin: 0; color: var(--blue-deep); font-size: 13px; font-weight: 700; }
.chae-sidecart__meta { color: var(--muted); font-size: 13px; line-height: 1.45; }
.chae-sidecart__inside { margin: 0; padding: 0; color: var(--muted); font-size: 13px; line-height: 1.4; list-style: none; }
.chae-sidecart__inside li { position: relative; padding-left: 12px; }
.chae-sidecart__inside li::before { content: ""; position: absolute; top: 0.6em; left: 0; width: 4px; height: 4px; border-radius: 50%; background: var(--teal); }
.chae-sidecart__meta dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 6px; margin: 0; }
.chae-sidecart__meta dt { font-weight: 500; }
.chae-sidecart__meta dd, .chae-sidecart__meta dd p { margin: 0; }
.chae-sidecart__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.chae-sidecart__price { color: var(--ink); font-size: 15px; font-weight: 700; text-align: right; }
.chae-sidecart__price del { color: var(--muted); font-weight: 400; }
.chae-sidecart__free { color: var(--teal); text-transform: uppercase; letter-spacing: 0.04em; font-size: 13px; }
.chae-sidecart__price small { display: block; color: var(--muted); font-size: 12.5px; font-weight: 500; }
.chae-sidecart__qtytext { color: var(--muted); font-size: 14px; }
.chae-qty { display: inline-flex; align-items: center; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; }
.chae-qty__btn { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--ink); cursor: pointer; }
.chae-qty__btn:hover:not(:disabled) { background: var(--teal-08); color: var(--teal); }
.chae-qty__btn:disabled { opacity: 0.35; cursor: default; }
.chae .chae-qty__input { width: 34px; height: 34px; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; color: var(--ink); font: inherit; font-size: 15px; font-weight: 700; text-align: center; -moz-appearance: textfield; appearance: textfield; }
.chae-qty__input::-webkit-outer-spin-button, .chae-qty__input::-webkit-inner-spin-button { margin: 0; -webkit-appearance: none; }
.chae-sidecart__remove { align-self: flex-start; margin: -10px 0; padding: 10px 0; border: 0; background: none; color: var(--muted); font: inherit; font-size: 13px; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; } /* a 40px-tall tap area, same look */
.chae-sidecart__remove:hover { color: var(--ink); }
/* the items and "Saved for later" scroll together above the checkout foot (inc/side-cart.php chae_sidecart_saved) */
.chae-sidecart__scroll { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.chae-sidecart__scroll .chae-sidecart__items { flex: none; min-height: auto; overflow: visible; }
.chae-sidecart__scroll--empty { flex: 0 1 auto; }
.chae-sidecart__scroll--empty:empty { display: none; }
.chae-sidecart__acts { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.chae-saved { margin: 4px 0 0; padding: 4px 22px 18px; border-top: 1px solid var(--line); }
.chae-saved__title { margin: 14px 0 6px; color: var(--ink); font-size: 15px; font-weight: 700; }
.chae-saved__items { margin: 0; padding: 0; list-style: none; }
.chae-saved__item { display: flex; gap: 12px; padding: 10px 0; }
.chae-saved__item + .chae-saved__item { border-top: 1px solid var(--line); }
.chae-saved__item.is-busy { opacity: 0.5; }
.chae-saved__thumb { flex: none; width: 56px; height: 56px; overflow: hidden; border-radius: 10px; background: var(--tint); }
.chae-saved__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.chae-saved__info { display: grid; gap: 2px; min-width: 0; }
.chae-saved__name { color: var(--ink); font-size: 14px; font-weight: 600; line-height: 1.3; text-decoration: none; }
.chae-saved__meta { color: var(--muted); font-size: 13px; }
/* "Goes well with your order" under the side cart's items (inc/side-cart.php chae_sidecart_suggestions) */
.chae-sug { margin: 4px 0 0; padding: 4px 22px 16px; border-top: 1px solid var(--line); }
.chae-sug__title { margin: 14px 0 6px; color: var(--ink); font-size: 15px; font-weight: 700; }
.chae-sug__items { margin: 0; padding: 0; list-style: none; }
.chae-sug__item { display: flex; align-items: center; gap: 12px; padding: 10px 0; }
.chae-sug__item + .chae-sug__item { border-top: 1px solid var(--line); }
.chae-sug__thumb { flex: none; width: 56px; height: 56px; overflow: hidden; border-radius: 10px; background: var(--tint); }
.chae-sug__thumb img { display: block; width: 100%; height: 100%; object-fit: contain; }
.chae-sug__info { display: grid; flex: 1; gap: 2px; min-width: 0; }
.chae .chae-sug__name { overflow: hidden; color: var(--ink); font-size: 14px; font-weight: 600; line-height: 1.3; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.chae .chae-sug__name:hover { color: var(--teal); }
.chae-sug__price { color: var(--ink); font-size: 13.5px; font-weight: 600; }
.chae-sug__price del { color: var(--muted); font-weight: 400; }
.chae-sug__price ins { text-decoration: none; }
.chae-sug__tag { display: inline-flex; align-items: center; gap: 4px; color: var(--teal); font-size: 12.5px; font-weight: 700; }
.chae .chae-sug__add { flex: none; display: inline-flex; align-items: center; justify-content: center; min-width: 72px; min-height: 36px; padding: 0 14px; border: 1.5px solid var(--teal); border-radius: 999px; background: #fff; color: var(--teal); font-size: 13.5px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.chae .chae-sug__add:hover { background: var(--teal); color: #fff; }
.chae .chae-sug__add.is-loading { opacity: 0.6; pointer-events: none; }
/* Small add-ons that close the gap to free shipping, under the progress card (chae_cart_topup()) */
.chae-topup { margin: 10px 22px 0; }
.cart_totals .chae-topup, .chae-sum .chae-topup { margin: 10px 0 4px; }
.chae-topup__lead { margin: 0 0 8px; color: var(--muted); font-size: 12.5px; font-weight: 600; }
.chae-topup__items { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.chae-topup__item { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; padding: 10px 6px; border: 1px solid var(--line); border-radius: 12px; background: #fff; text-align: center; }
.chae-topup__item.is-enough { border-color: rgba(0, 98, 99, 0.35); }
.chae-topup__thumb { width: 48px; height: 48px; overflow: hidden; border-radius: 8px; background: var(--tint); }
.chae-topup__thumb img { display: block; width: 100%; height: 100%; object-fit: contain; }
.chae .chae-topup__name { display: -webkit-box; min-height: 2.6em; overflow: hidden; color: var(--ink); font-size: 12.5px; font-weight: 600; line-height: 1.3; text-decoration: none; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.chae .chae-topup__name:hover { color: var(--teal); }
.chae-topup__price { color: var(--ink); font-size: 12.5px; }
.chae .chae-topup__add { display: inline-flex; align-items: center; justify-content: center; min-height: 32px; margin-top: 2px; padding: 0 12px; border: 1.5px solid var(--teal); border-radius: 999px; background: #fff; color: var(--teal); font-size: 12.5px; font-weight: 700; text-decoration: none; }
.chae .chae-topup__add:hover { background: var(--teal); color: #fff; }
.chae .chae-topup__add.is-loading { opacity: 0.6; pointer-events: none; }
.chae-saved__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin-top: 6px; }
.chae-saved__move { padding: 6px 14px; border: 1.5px solid var(--teal); border-radius: 999px; background: #fff; color: var(--teal); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.chae-saved__move:hover { background: var(--tint); }
.chae-saved__out { color: var(--muted); font-size: 13px; }
/* Recently viewed at the foot of a product page (inc/product-page.php): the product sections' gap above it, and a
   short row (2-3 cards) centred rather than left in a 4-column grid */
.chae-recent { margin-top: 28px; }
@media (min-width: 1181px) {
	.chae .chae-recent ul.products.columns-4 { grid-template-columns: repeat(auto-fit, minmax(0, calc((100% - 72px) / 4))); justify-content: center; } /* 72px: three of the grid's 24px gaps (60px left room for only 3 cards) */
}
.chae-sidecart__foot { padding: 16px 22px calc(18px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: #fff; box-shadow: 0 -10px 24px rgba(26, 36, 33, 0.05); }
.chae-sidecart__totals { margin: 0 0 2px; }
.chae-sidecart__totals div { display: flex; justify-content: space-between; gap: 12px; }
.chae-sidecart__totals dt, .chae-sidecart__totals dd { margin: 0; }
.chae-sidecart__totals div:not(.chae-sidecart__subtotal) { color: var(--teal); font-size: 14.5px; font-weight: 700; }
.chae-sidecart__subtotal { color: var(--ink); font-size: 17px; font-weight: 700; }
.chae-sidecart__note { margin: 0 0 14px; color: var(--muted); font-size: 13px; }
body.chae .chae-sidecart__checkout { width: calc(100% - 3px); }
.chae .chae-sidecart__viewcart { display: block; margin-top: 14px; color: var(--ink); font-size: 14.5px; font-weight: 700; text-align: center; text-decoration: underline; text-underline-offset: 4px; }
.chae-sidecart__empty { display: flex; flex: 1; flex-direction: column; align-items: center; justify-content: center; padding: 40px 28px; text-align: center; }
.chae-sidecart__empty-icon { display: flex; align-items: center; justify-content: center; width: 72px; height: 72px; margin-bottom: 14px; border-radius: 50%; background: var(--tint); color: var(--teal); }
.chae-sidecart__empty-title { margin: 0 0 4px; color: var(--ink); font-family: var(--head); font-size: 20px; font-weight: 700; }
.chae-sidecart__empty .chae-muted { margin: 0 0 20px; }
body.chae .is-loading { opacity: 0.75; pointer-events: none; }
@media (prefers-reduced-motion: reduce) {
	.chae-sidecart__panel, .chae-sidecart__backdrop, .chae-sidecart__meter span { transition: none; }
}

@media (max-width: 1180px) {
	.chae-overview.has-facts, .chae-ingredients-grid { grid-template-columns: minmax(0, 1fr) 300px; gap: 32px; }
	.chae-rcards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.chae-rcards .chae-rcard:nth-child(3) { display: none; }
	.chae-pairs { grid-template-columns: minmax(0, 1fr); }
	.chae-nav__link { padding: 0 14px; font-size: 14.5px; }
	.chae-hero { grid-template-columns: 1fr 1fr; padding: 40px; }
	.chae-hero__media { height: 440px; }
	.chae-diff { grid-template-columns: minmax(0, 1fr); } /* a plain 1fr grew to the two cards' unwrapped width (433px) and made phone pages 470px wide */
	.chae-diff__photo { min-height: 320px; }
	.chae-buy { grid-template-columns: 1fr 1fr; padding: 8px 0 40px; }
	.chae ul.products.columns-4 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.chae-banner { grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr); }
}
@media (max-width: 960px) {
	.chae-blog__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.chae-article--featured { grid-template-columns: 1fr; }
	.chae-article--featured .chae-article__img { min-height: 0; aspect-ratio: 16 / 9; }
	.chae-article--featured .chae-article__body { padding: 26px 26px 28px; }
	.chae-news__inner { grid-template-columns: 1fr; }
	.chae-reviews-top, .chae-overview.has-facts, .chae-ingredients-grid, .chae-duo { grid-template-columns: minmax(0, 1fr); }
	.chae-rcards { grid-template-columns: minmax(0, 1fr); }
	.chae-rcards .chae-rcard:nth-child(3) { display: flex; }
	.chae-keycards { grid-template-columns: minmax(0, 1fr); }
	.chae-fbt__row { flex-wrap: wrap; }
	.chae .chae-fbt__item { width: 128px; }
	.chae-header__inner { grid-template-columns: auto 1fr auto; gap: 16px; }
	.chae-hero { grid-template-columns: 1fr; }
	.chae-hero__title { font-size: 42px; }
	.chae-reviews { grid-template-columns: 1fr; }
	.chae-shop__layout { grid-template-columns: 1fr; }
	.chae-filter-toggle { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 16px; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; color: var(--ink); font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; }
	.chae-filter-toggle__n { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; border-radius: 999px; background: var(--teal); color: #fff; font-size: 12px; }
	.chae-filters { position: fixed; z-index: 100; top: 0; bottom: 0; left: 0; display: flex; flex-direction: column; width: min(380px, 88vw); max-height: none; padding: 0; overflow: hidden; border: 0; border-radius: 0 22px 22px 0; background: #fff; transform: translateX(-105%); transition: transform 0.25s ease; }
	body.admin-bar .chae-filters { top: var(--wp-admin--admin-bar--height, 46px); }
	.chae-filters.is-open { transform: none; box-shadow: 0 0 0 100vmax rgba(17, 30, 28, 0.4); }
	.chae-filters__head { padding: 16px 20px; border-bottom: 1px solid var(--line); }
	.chae-filters__close { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin-left: auto; border: 0; border-radius: 10px; background: var(--tint); color: var(--ink); font-size: 26px; line-height: 1; cursor: pointer; }
	.chae-filterform { flex: 1; overflow-y: auto; padding: 0 20px 12px; }
	.chae-facet:first-child { margin-top: 0; border-top: 0; }
	.chae-filters__foot { display: block; padding: 14px 20px; border-top: 1px solid var(--line); }
	body.chae .chae-filters__done { width: calc(100% - 3px); }
	html.chae-no-scroll { overflow: hidden; }
	.chae ul.products, .chae ul.products.columns-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.chae-buy { grid-template-columns: 1fr; }
	.chae-buy__gallery { position: relative; top: auto; }
	.chae .woocommerce-tabs { grid-template-columns: 1fr; gap: 24px; }
	.chae .woocommerce-tabs ul.tabs { grid-row: auto; flex-direction: row; flex-wrap: wrap; }
	.chae .woocommerce-tabs .panel { grid-column: 1; grid-row: auto; }
	.chae-banner { grid-template-columns: minmax(0, 1fr); min-height: 0; padding: 0; } /* stacked: the photo band runs edge to edge */
	.chae-banner__text { padding: 32px 24px; }
	.chae-banner__media { order: -1; height: 200px; } /* the photo becomes a band above the text */
	.chae-footer__grid { grid-template-columns: 1fr 1fr; }
	.chae-footer__trust { grid-template-columns: 1fr; }
	.chae-posts { grid-template-columns: 1fr 1fr; }
	.chae-store--cart .woocommerce { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
	.chae-store--cart .woocommerce > .woocommerce-cart-form, .chae-store--cart .woocommerce > .cart-collaterals { grid-column: 1; grid-row: auto; }
	.chae-store--cart .woocommerce > .cart-collaterals { position: static; }
}
@media (max-width: 782px) {
	.chae .chae-co { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	.chae-co__main, .chae-co__side { grid-column: 1; }
	.chae-co__side { grid-row: 1; position: static; padding: 0; overflow: hidden; }
	.chae-co__main { grid-row: 2; }
	.chae-co__toggle { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 56px; padding: 0 18px; border: 0; background: none; color: var(--teal); font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; }
	.chae-co__toggle strong { margin-left: auto; color: var(--ink); font-size: 17px; }
	.chae-co__summary { display: none; padding: 4px 18px 18px; border-top: 1px solid var(--line); }
	.chae-co__side.is-open .chae-co__summary { display: block; }
	.chae-co__side-title { display: none; }
	.chae-co__panel { padding: 22px 18px; border-radius: 22px; }
	.chae-acc__grid { grid-template-columns: minmax(0, 1fr); gap: 16px; } /* minmax: the swipeable menu row mustn't widen the page */
	.chae-acc__nav { position: static; min-width: 0; margin: 0 -16px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
	.chae-acc__nav ul { flex-direction: row; gap: 8px; padding: 2px 16px 6px; overflow-x: auto; scrollbar-width: none; }
	.chae .chae-acc__nav a { min-height: 40px; padding: 0 14px; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; font-size: 14px; white-space: nowrap; }
	.chae .chae-acc__nav a .chae-icon { width: 16px; height: 16px; }
	.chae .chae-acc__nav li.is-active a { border-color: var(--teal); background: var(--teal); color: #fff; }
	.chae .chae-acc__nav li.is-active a .chae-icon { color: #fff; }
	.chae-acc__nav .woocommerce-MyAccount-navigation-link--customer-logout { margin: 0; padding: 0; border: 0; }
	.chae-acc__content { padding: 20px 16px; border-radius: 22px; }
	.chae-acc__content .woocommerce-Addresses { grid-template-columns: 1fr; }
	.chae-order__body { grid-template-columns: auto minmax(0, 1fr); }
	.chae-order__actions { grid-column: 1 / -1; justify-content: stretch; }
	.chae-order__actions .chae-order__btn { flex: 1; }
	.chae-blog__tools { flex-direction: column; align-items: stretch; }
	.chae-blog__cats { flex-wrap: nowrap; margin: 0 -16px; padding: 0 16px 4px; overflow-x: auto; scrollbar-width: none; }
	.chae-blog__search { flex-basis: auto; }
	.chae-story__panel { padding: 28px 20px; border-radius: 22px; }
	.chae-story__content { font-size: 17px; }
	.chae-story__content > .alignfull { margin-left: -16px; margin-right: -16px; } /* to the screen edge: the phone gutter is 16px */
	.chae-story__hero img { border-radius: 18px; }
	.chae-news { margin-top: 40px; padding: 40px 0; }
	.chae-news__form { padding: 20px; }
	.chae .chae-plans .wcsatt-options-prompt-radios { gap: 14px 10px; }
	.chae .chae-plan { padding: 14px 12px 12px; }
	.chae-plan__price { font-size: 19px; }
	.chae .chae-setcard { grid-template-columns: 64px minmax(0, 1fr); }
	.chae-setcard__img { width: 64px; height: 56px; }
	.chae-setcard__go { display: none; }
	.chae-pbar { top: auto; bottom: 0; padding: 10px 0 calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); border-bottom: 0; box-shadow: 0 -10px 24px rgba(26, 36, 33, 0.08); transform: translateY(110%); }
	body.admin-bar .chae-pbar { top: auto; }
	.chae-pbar__nav { display: none; }
	.chae-pbar__buy { width: 100%; margin-left: 0; }
	.chae-pbar__text { flex: 1; min-width: 0; }
	.chae-pbar__price { color: var(--ink); font-size: 16px; font-weight: 700; }
	.chae-secchips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
	.chae .chae-secchips a { flex-shrink: 0; }
	.chae-secs { gap: 12px; margin-top: 16px; }
	.chae-sec__panel, .chae-duo .chae-sec__panel { padding: 22px 0; }
	.chae-sec--tint .chae-sec__panel, .chae-sec--how .chae-sec__panel { padding: 22px 18px; }
	.chae-sec.is-collapsible .chae-sec__panel { padding: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: none; } /* open rows with a hairline between them, flush with the page (no tinted ones) */
	.chae-sec.is-collapsible .chae-sec__head { flex-direction: column; align-items: stretch; margin: 0; } /* How to use's head is a row: as a column its toggle reaches the edge too */
	.chae-duo { gap: 12px; } /* How to use and Questions & answers: rows spaced like the rest (.chae-secs) */
	.chae-sec.is-collapsible .chae-sec__head .chae-eyebrow { display: none; }
	.chae-sec.is-collapsible .chae-howto__icon { display: none; }
	.chae-howto__photo { flex: none; height: 220px; min-height: 0; }
	.chae .chae-sec__title, .chae .chae-duo .chae-sec__title { font-size: 28px; }
	.chae .chae-sec.is-collapsible .chae-sec__title { font-size: 19px; }
	.chae-sec__toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 58px; padding: 0; border: 0; background: none; color: var(--ink); font: inherit; font-weight: 700; text-align: left; cursor: pointer; }
	.chae-sec__toggle svg { flex-shrink: 0; color: var(--teal); transform: rotate(90deg); transition: transform 0.2s; }
	.chae-sec__toggle[aria-expanded="true"] svg { transform: rotate(-90deg); }
	.chae-sec--how .chae-sec__toggle { flex: 1; } /* its head is a row (drop icon + title): the button took only the title's width, leaving the chevron mid-row */
	.chae-sec.is-collapsible .chae-sec__body { padding: 0 0 20px; }
	.chae-sec.is-collapsed .chae-sec__body { display: none; }
	.chae-rsum__avg { font-size: 40px; }
	.chae-overview__body ul { grid-template-columns: minmax(0, 1fr); }
	.chae-keycard { padding: 18px 18px 16px 64px; }
	.chae-keycard__n { left: 16px; top: 16px; width: 34px; height: 34px; }
	.chae-wrap { padding: 0 16px; }
	/* header on phones: the free-shipping line, logo + three round buttons (account, cart, menu), search. The menu
	   opens as a panel under the header (chae.js sets its top). .chae-wrap's phone padding reset needs the extra
	   .chae-header for the header's own padding. */
	.chae-topbar__inner { justify-content: center; min-height: 34px; }
	.chae-topbar__note { gap: 8px; font-size: 12.5px; }
	.chae-topbar__nav { display: none; } /* its links are in the menu; account is a header button */
	.chae .chae-header .chae-header__inner { grid-template-columns: minmax(0, 1fr) auto; gap: 12px; min-height: 0; padding-top: 12px; padding-bottom: 12px; }
	.chae-logo img, .chae-header .custom-logo { height: 42px; }
	.chae-header__search { grid-column: 1 / -1; grid-row: 2; max-width: none; }
	.chae-header__actions { gap: 8px; }
	.chae .chae-header__actions .chae-acct, .chae .chae-header__actions .chae-cart, .chae-menu-toggle { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: var(--tint); color: var(--ink) !important; }
	.chae-header__actions .chae-icon { width: 22px; height: 22px; }
	.chae-cart__total { display: none; }
	.chae-acct__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
	.chae-cart__count { top: -8px; right: -10px; box-shadow: 0 0 0 2px #fff; }
	.chae .chae-menu-toggle.is-open { background: var(--teal); color: #fff !important; }
	.chae-menu-toggle.is-open .chae-menu-toggle__open { display: none; }
	.chae-menu-toggle.is-open .chae-menu-toggle__close { display: block; }
	html.chae-menu-open { overflow: hidden; }
	.chae-nav { display: none; }
	.chae-nav.is-open { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 95; display: block; overflow-y: auto; overscroll-behavior: contain; padding: 18px 16px calc(28px + env(safe-area-inset-bottom)); border: 0; background: var(--bg); box-shadow: inset 0 1px 0 var(--line); }
	.chae-nav__label { display: block; margin: 0 4px 8px; color: var(--blue-deep); font-size: 12.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
	.chae-nav__list { flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
	.chae-nav__item, .chae-nav__item:last-child { border: 0; }
	.chae-nav__item + .chae-nav__item { border-top: 1px solid var(--line); }
	.chae-nav__item:hover, .chae-nav__item.is-current { box-shadow: none; }
	.chae-nav__item.is-current .chae-nav__link { background: var(--teal-08); }
	.chae-nav__link { flex: 1; justify-content: space-between; min-height: 54px; padding: 0 18px; font-size: 16px; font-weight: 600; }
	.chae-nav__link::after { content: ""; width: 16px; height: 16px; background: currentColor; opacity: 0.45; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; }
	.chae-nav__more { display: block; margin-top: 22px; }
	.chae-nav__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
	.chae .chae-nav__links a { display: flex; align-items: center; min-height: 48px; padding: 0 16px; border: 1px solid var(--line); border-radius: 14px; background: #fff; color: var(--ink); font-size: 15px; font-weight: 500; }
	.chae .chae-nav__links a:hover { border-color: var(--teal); color: var(--teal); }
	.chae-section, .chae-prose { padding: 32px 0; }
	.chae-head__title { font-size: 30px; }
	.chae-hero { padding: 24px 20px; gap: 28px; }
	.chae-hero__title { font-size: 34px; }
	.chae-hero__media { height: 360px; }
	.chae-diff__grid { grid-template-columns: 1fr; }
	.chae-banner__text { padding: 20px 16px 22px; gap: 8px; }
	.chae-banner__title { font-size: 38px; }
	.chae-banner__desc { font-size: 15px; }
	.chae-banner .chae-banner__media, .chae-banner__proof { display: none; } /* a short header, so the first products are on the first screen (2026-10-15) */
	.chae-banner__desc { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
	.chae-banner__desc.is-open { display: block; overflow: visible; -webkit-line-clamp: none; }
	.chae .chae-banner__more { align-self: flex-start; margin: -4px 0 0; padding: 4px 0; border: 0; background: none; color: var(--teal); font: inherit; font-size: 14.5px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; } /* chae.js: shown only when the two lines cut it */
	.chae-banner__tagline + .chae-banner__desc { display: none; } /* the tagline says it on a phone; the photo of the first products matters more */
	.woocommerce-result-count { display: none; }
	.chae-catpills { flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px; padding: 0 16px 4px; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
	.chae-catpills::-webkit-scrollbar { display: none; }
	.chae-catpills a { flex-shrink: 0; }
	.chae-shop__bar .chae-toolbar { justify-content: flex-end; }
	.chae-shop { margin-top: 0; padding: 16px 0 24px; gap: 14px; }
	.chae-buy, .chae-details { padding: 20px; }
	.chae .chae-buy__summary .product_title { font-size: 28px; }
	/* footer on phones: brand across the top, Shop across in two columns, Company | Support side by side. The
	   .chae-wrap phone rule resets all padding, so the vertical padding here needs the extra .chae-footer. */
	.chae-footer .chae-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 20px; padding-top: 40px; padding-bottom: 28px; }
	.chae-footer__brand, .chae-footer__grid > nav.chae-footer__col:first-of-type { grid-column: 1 / -1; } /* Shop across, in its two columns; Company | Support side by side */
	.chae-footer__grid > nav.chae-footer__col:first-of-type .chae-footer__menu { column-gap: 20px; }
	.chae-footer__grid > nav.chae-footer__col:first-of-type .chae-footer__menu li { margin: 0; }
	.chae-footer__brand p { max-width: none; font-size: 14.5px; }
	.chae-footer__contact { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; line-height: 1.3; }
	.chae .chae-footer__contact a { min-height: 42px; padding: 0 16px; border: 1.5px solid var(--line-2); border-radius: 999px; font-size: 14px; }
	.chae-footer__title { margin-bottom: 4px; font-size: 16px !important; }
	.chae-footer__menu { gap: 0; }
	.chae-footer__menu a { display: block; padding: 8px 0; }
	.chae-footer .chae-footer__trust { gap: 18px; padding-top: 24px; padding-bottom: 30px; }
	.chae-footer__trust > div { align-items: center; }
	.chae-footer .chae-footer__bar-inner { flex-direction: column; justify-content: center; gap: 4px; padding-top: 16px; padding-bottom: 18px; text-align: center; }
	.chae-footer__sep { display: none; }
	.chae-footer__credits { display: block; margin-top: 4px; white-space: nowrap; }
	.chae-posts { grid-template-columns: 1fr; }
	.chae-cartpage { padding: 16px 16px 18px; border-radius: 22px; }
	.chae-store--cart .cart-collaterals .cart_totals { padding: 22px 18px; border-radius: 22px; }
	.chae-cartpage__item { grid-template-columns: 72px minmax(0, 1fr) auto; grid-template-rows: none; grid-template-areas: "thumb info info" "thumb qty price" "thumb remove remove"; gap: 10px 14px; padding: 16px 0; }
	.chae-cartpage__item.is-child { grid-template-columns: 52px minmax(0, 1fr) auto; padding-left: 20px; }
	.chae-cartpage__price { align-self: center; padding-top: 0; }
	.chae-cartpage__remove { text-align: left; }
	.chae-cart-bar { position: fixed; right: 0; bottom: 0; left: 0; z-index: 40; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: #fff; box-shadow: 0 -8px 24px rgba(20, 40, 40, 0.08); visibility: hidden; transform: translateY(110%); transition: transform 0.25s ease, visibility 0.25s; }
	.chae-cart-bar.is-shown { visibility: visible; transform: none; }
	.chae-cart-bar__total > span { display: block; color: var(--muted); font-size: 12.5px; }
	.chae-cart-bar__total strong { color: var(--ink); font-size: 18px; }
	body.chae .chae-cart-bar .chae-btn { min-height: 48px; padding: 0 22px !important; }
}
@media (max-width: 480px) {
	.chae-blog__grid { grid-template-columns: 1fr; }
	.chae ul.products, .chae ul.products.columns-4 { gap: 28px 12px; } /* two cards a row on phones, like most shops */
}
@media (prefers-reduced-motion: reduce) {
	.chae-btn, .chae-tile { transition: none; }
}

/* ---------- home page pass (2026-09-27): routine band, live review summary, journal; phones
   get swipe rows for favorites, reviews and articles (every item kept) ---------- */
.chae-quizband { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) auto; align-items: center; gap: 28px 40px; margin-top: 24px; padding: 38px 44px; border-radius: var(--r-panel); background: radial-gradient(circle at 88% 12%, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0) 42%), linear-gradient(120deg, var(--blue-deep) 0%, var(--teal) 100%); color: #fff; box-shadow: var(--shadow); }
.chae .chae-quizband .chae-eyebrow { color: #bfe6ee; }
.chae .chae-quizband__title { margin: 8px 0 10px; color: #fff; font-size: 36px; line-height: 1.15; }
.chae-quizband p { margin: 0; color: #d9eef2; font-size: 16px; line-height: 1.6; }
.chae-quizband__steps { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none; }
.chae-quizband__steps li { display: flex; align-items: center; gap: 12px; margin: 0; color: #fff; font-size: 15.5px; font-weight: 600; }
.chae-quizband__steps span { display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; width: 32px; height: 32px; border: 1px solid rgba(255, 255, 255, 0.35); border-radius: 50%; background: rgba(255, 255, 255, 0.14); font-weight: 800; }
.chae-quizband__go { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.chae-quizband__go small { color: #d9eef2; font-size: 13px; }
body.chae .chae-quizband .chae-btn--fill { border-color: #fff !important; background: #fff !important; color: var(--teal) !important; white-space: nowrap; } /* the main button, white on the teal band */
.chae-home-reviews .chae-rsum { justify-content: center; }
.chae-home-reviews .chae-rsum__bar { grid-template-columns: 48px minmax(0, 1fr) 30px; }
body.chae .chae-home-reviews .chae-rsum .chae-btn { align-self: flex-start; margin-top: 8px; }
.chae-home-reviews .chae-reviews { gap: 16px; }
.chae-home-reviews .chae-review { padding: 24px 22px; }
@media (max-width: 960px) {
	.chae-quizband { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 32px; }
	.chae-quizband__go { grid-column: 1 / -1; flex-direction: row; justify-content: flex-start; gap: 16px; }
	.chae-home-reviews .chae-reviews { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
	.chae-quizband { grid-template-columns: minmax(0, 1fr); gap: 22px; padding: 28px 22px; }
	.chae .chae-quizband__title { font-size: 28px; }
	.chae-quizband__go { flex-direction: column; align-items: stretch; text-align: center; }
	.chae #favorites ul.products, .chae #bundles ul.products, .chae-home-reviews .chae-reviews { position: relative; display: flex !important; gap: 12px; margin: 0 -16px !important; padding: 0 16px 6px !important; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 16px; scrollbar-width: none; } /* relative: the cards' positioned parts must belong to the row, or they escape it and widen the page. -16px = the phone gutter, now that sections are unboxed (it was -20px, the old box padding: 4px of sideways scroll) */
	.chae #favorites ul.products::-webkit-scrollbar, .chae #bundles ul.products::-webkit-scrollbar, .chae-home-reviews .chae-reviews::-webkit-scrollbar { display: none; }
	.chae #favorites ul.products li.product, .chae #bundles ul.products li.product { flex: 0 0 64%; scroll-snap-align: start; }
	.chae-home-reviews .chae-review { flex: 0 0 84%; scroll-snap-align: start; }
	.chae-diff__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.chae-diff__card { flex-direction: column; gap: 8px; padding: 14px; font-size: 13px; }
	.chae-diff__card strong { font-size: 15.5px; }
}

/* ---------- About page pass (2026-09-27): full-width hero with the team photo and Linda's video, the numbers ---------- */
.chae-ahx { position: relative; overflow: hidden; border-bottom: 1px solid var(--line); background: radial-gradient(circle at 8% 12%, rgba(0, 142, 175, 0.12), rgba(0, 142, 175, 0) 40%), radial-gradient(circle at 40% 100%, rgba(0, 98, 99, 0.08), rgba(0, 98, 99, 0) 45%), linear-gradient(180deg, #fff 0%, #f5f9f9 100%); }
.chae-ahx__inner { display: grid; grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); align-items: center; gap: 56px; max-width: 1248px; margin: 0 auto; padding: 56px 24px; }
.chae-ahx__text { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.chae .chae-ahx__title { margin: 0; color: var(--ink); font-size: clamp(44px, 5.2vw, 72px); line-height: 1.04; letter-spacing: -0.015em; }
.chae-ahx__title span { color: var(--teal); background: linear-gradient(90deg, var(--teal), var(--blue)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.chae-ahx__lead { max-width: 540px; margin: 0; color: var(--text); font-size: 18px; line-height: 1.65; }
.chae-ahx__checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 24px; }
.chae-ahx__media { position: relative; min-height: 540px; }
.chae-ahx__photo { position: absolute; top: 0; right: 0; bottom: 60px; left: 116px; margin: 0; overflow: hidden; border-radius: 28px; background: #e8ebea; box-shadow: var(--shadow); }
.chae-ahx__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.chae .chae-ahx__video { position: absolute; bottom: 0; left: 0; z-index: 2; width: 172px; border: 6px solid #fff; box-shadow: 0 24px 50px rgba(26, 36, 33, 0.25); } /* smaller and further left: at 220px it hid several faces in the team photo (2026-10-13 audit) */
.chae-ahx__video .chae-video__label { padding: 6px 10px; font-size: 11px; white-space: nowrap; }
.chae .chae-ahx__badge { top: 24px; left: 44px; }
.chae-ahx__pin { position: absolute; right: 22px; bottom: 84px; z-index: 2; display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 999px; background: var(--teal); box-shadow: 0 14px 30px rgba(0, 60, 60, 0.25); color: #fff; font-size: 14px; font-weight: 700; }
.chae-ahx__pin .chae-icon { color: #bfe6ee; }
.chae-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 28px 0 0; padding: 26px 12px; border: 1px solid var(--panel-border); border-radius: var(--r-panel); background: #fff; box-shadow: var(--shadow); list-style: none; }
.chae-stats li { display: flex; flex-direction: column; align-items: center; gap: 4px; margin: 0; padding: 4px 16px; border-left: 1px solid var(--line); text-align: center; }
.chae-stats li:first-child { border-left: 0; }
.chae-stats strong { color: var(--teal); font-family: var(--head); font-size: 44px; font-weight: 600; line-height: 1.1; }
.chae-stats span { color: var(--muted); font-size: 14.5px; line-height: 1.4; }
@media (max-width: 960px) {
	.chae-ahx__inner { grid-template-columns: minmax(0, 1fr); gap: 40px; padding: 40px 24px; }
	.chae-ahx__media { min-height: 480px; }
	.chae-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 20px; }
	.chae-stats li:nth-child(3) { border-left: 0; }
}
@media (max-width: 560px) {
	.chae-ahx__inner { gap: 30px; padding: 28px 16px 32px; }
	.chae .chae-ahx__title { font-size: 42px; }
	.chae-ahx__lead { font-size: 16.5px; }
	.chae-ahx__checks { grid-template-columns: minmax(0, 1fr); }
	.chae-ahx__media { min-height: 400px; }
	.chae-ahx__photo { bottom: 96px; left: 56px; border-radius: 22px; }
	.chae .chae-ahx__video { width: 150px; border-width: 4px; border-radius: 18px; }
	.chae-ahx__video .chae-video__label { top: 8px; left: 8px; padding: 5px 9px; font-size: 10px; white-space: nowrap; }
	.chae-ahx__video .chae-video__play { width: 54px; height: 54px; margin: -27px 0 0 -27px; }
	.chae-ahx__video .chae-video__play .chae-icon { width: 22px; height: 22px; }
	.chae .chae-ahx__badge { top: 12px; left: 12px; padding: 8px 12px 8px 8px; font-size: 11.5px; }
	.chae .chae-ahx__badge img { width: 34px; height: 34px; }
	.chae .chae-ahx__badge strong { font-size: 13.5px; }
	.chae-ahx__pin { right: 10px; bottom: 110px; padding: 8px 12px; font-size: 12.5px; }
	.chae-stats { margin-top: 20px; padding: 18px 6px; }
	.chae-stats li { padding: 4px 8px; }
	.chae-stats strong { font-size: 34px; }
	.chae-stats span { font-size: 13px; }
	.chae-certs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.chae-cert { padding: 18px 12px; }
	.chae-cert img { width: 72px; height: 72px; }
	.chae-cert p { font-size: 13px; }
}

/* ---------- Contact page pass (2026-09-27): call + email, then the form (first on phones), place + social below ---------- */
.chae-contact { grid-template-areas: "info form" "place form"; }
.chae-contact__info { grid-area: info; }
.chae-contact__form { grid-area: form; }
.chae-contact__place { grid-area: place; display: flex; flex-direction: column; gap: 20px; padding: 28px 44px; }
.chae-contact__way-row { display: flex; align-items: flex-start; gap: 16px; }
.chae-contact__place .chae-contact__social { padding-top: 18px; }
.chae-contact__way small + small { margin-top: 0; }
.chae-open { display: inline-flex; align-items: center; gap: 8px; margin-top: 6px; color: var(--muted); font-size: 13.5px; font-weight: 600; }
.chae-open[hidden] { display: none; }
.chae-open::before { content: ""; flex-shrink: 0; width: 8px; height: 8px; border-radius: 50%; background: #9aa5a3; }
.chae-open.is-open { color: var(--teal); }
.chae-open.is-open::before { background: #1f9d6b; box-shadow: 0 0 0 3px rgba(31, 157, 107, 0.18); }
.chae-contact__form .gform_wrapper .gfield--type-radio .gfield_radio { display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px 24px; }
.chae-contact__form input[type="radio"], .chae-contact__form input[type="checkbox"] { accent-color: var(--teal); }
body.chae .chae-contact__form .gform_wrapper .gform_button { width: calc(100% - 3px) !important; min-height: 52px; font-size: 16px; }
.chae-contact__faq { padding-top: 6px; }
.chae .chae-contact__faq-title { margin: 0 0 4px; font-size: 20px; }
.chae-contact__faq .chae-btn--text { margin-top: 14px; }
@media (max-width: 960px) {
	.chae-contact { grid-template-areas: "info" "form" "place"; }
}
@media (max-width: 560px) {
	.chae-contact__place { padding: 22px 20px; }
	.chae .chae-contact__faq-title { font-size: 18px; }
}

/* ---------- FAQ page pass (2026-09-27): popular questions, the topic on screen, sticky topic chips on phones ---------- */
.chae-faq-popular { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin-top: -4px; font-size: 14px; }
.chae-faq-popular span { color: var(--muted-2); font-weight: 600; }
.chae .chae-faq-popular a { padding: 6px 12px; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; color: var(--ink); font-weight: 600; }
.chae .chae-faq-popular a:hover { border-color: var(--teal); color: var(--teal); }
.chae .chae-faq__nav a.is-current { background: var(--teal-08); color: var(--teal); font-weight: 700; }
.chae .chae-faq__nav a.is-current .chae-icon { color: var(--teal); }
@media (max-width: 960px) {
	.chae-faq__nav { position: sticky; top: 0; z-index: 5; padding: 8px 0 !important; background: rgba(242, 242, 242, 0.94) !important; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
	.chae .chae-faq__nav a.is-current { border-color: var(--teal); background: var(--teal); color: #fff; }
	.chae .chae-faq__nav a.is-current .chae-icon, .chae .chae-faq__nav a.is-current small { color: #fff; }
	.chae-faq__topic, .chae-faq__item { scroll-margin-top: 76px; } /* clear of the sticky topic row */
}
@media (max-width: 600px) {
	body.admin-bar .chae-faq__nav { top: 0; } /* WordPress's admin bar scrolls away on phones */
}
@media (max-width: 560px) {
	.chae-faq-popular { justify-content: flex-start; }
}

/* ---------- Why ToxicFree® page pass (2026-09-27): full-width hero (the About hero's layout) with the seal and
   some of the chemicals it screens out floating around it; chemical cards two a row on phones ---------- */
.chae-tfx { position: relative; display: flex; align-items: center; justify-content: center; min-height: 520px; }
.chae-tfx::before { content: ""; position: absolute; inset: 6% 10%; border-radius: 50%; background: radial-gradient(circle, rgba(0, 142, 175, 0.16) 0%, rgba(0, 98, 99, 0.08) 45%, rgba(0, 98, 99, 0) 70%); }
.chae-tfx__seal { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 18px; margin: 0; text-align: center; }
.chae-tfx__seal img { width: 280px; height: 280px; border: 8px solid #fff; border-radius: 50%; object-fit: cover; box-shadow: 0 30px 60px rgba(0, 60, 60, 0.22); }
.chae-tfx__seal figcaption { color: var(--muted); font-size: 14px; }
.chae-tfx__seal figcaption strong { display: block; color: var(--ink); font-family: var(--head); font-size: 22px; font-weight: 600; }
.chae-tfx__chips { position: absolute; inset: 0; z-index: 2; margin: 0; padding: 0; list-style: none; pointer-events: none; }
.chae-tfx__chips li { position: absolute; display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px 9px 10px; border-radius: 999px; background: #fff; box-shadow: 0 14px 30px rgba(26, 36, 33, 0.14); color: var(--ink); font-size: 14px; font-weight: 700; white-space: nowrap; animation: chae-float 7s ease-in-out infinite; animation-delay: calc(var(--i) * -1.1s); }
.chae-tfx__chips .chae-screened__mark { width: 22px; height: 22px; margin: 0; }
/* An even ring around the seal, inside the column (two chips ran past the page edge, 2026-10-13 audit). */
.chae-tfx__chips li:nth-child(1) { top: 9%; left: 6%; }
.chae-tfx__chips li:nth-child(2) { top: 9%; right: 6%; }
.chae-tfx__chips li:nth-child(3) { top: 44%; left: 0; }
.chae-tfx__chips li:nth-child(4) { top: 44%; right: 0; }
.chae-tfx__chips li:nth-child(5) { bottom: 13%; left: 6%; }
.chae-tfx__chips li:nth-child(6) { bottom: 13%; right: 6%; }
@media (prefers-reduced-motion: reduce) {
	.chae-tfx__chips li { animation: none; }
}
@media (max-width: 960px) {
	.chae-tfx { min-height: 460px; }
}
@media (max-width: 560px) {
	.chae-tfx { flex-direction: column; gap: 18px; min-height: 0; padding: 8px 0 4px; } /* phones: the chemicals sit in a row under the seal rather than over it */
	.chae-tfx__seal img { width: 190px; height: 190px; border-width: 6px; }
	.chae-tfx__seal figcaption strong { font-size: 18px; }
	.chae-tfx__chips { position: static; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
	.chae .chae-tfx__chips li { position: static; gap: 6px; padding: 6px 10px 6px 7px; font-size: 12.5px; animation: none; }
	.chae-tfx__chips .chae-screened__mark { width: 18px; height: 18px; }
	.chae-screened { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.chae-screened__item { flex-direction: column; gap: 8px; padding: 14px 12px; }
	.chae-screened__text strong { font-size: 14.5px; }
	.chae-claim { padding: 18px 18px 16px; }
}

/* ---------- Shipping & Returns (page-shipping-returns.php, 2026-09-27) ---------- */
.chae-sr-hero { display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 48px 40px 40px; text-align: center; }
.chae-sr-hero .chae-pill { align-self: center; }
.chae .chae-sr-hero__title { margin: 0; font-size: clamp(38px, 4.4vw, 54px); line-height: 1.08; }
.chae-sr-hero__lead { max-width: 560px; margin: 0; color: var(--muted); font-size: 17px; text-wrap: balance; }
.chae-sr-facts { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; width: 100%; margin: 14px 0 4px; padding: 0; list-style: none; }
.chae-sr-facts li { margin: 0; }
.chae .chae-sr-facts a { display: flex; flex-direction: column; align-items: center; gap: 6px; height: 100%; padding: 18px 12px 16px; border: 1px solid var(--line); border-radius: 18px; background: #fff; color: var(--muted); font-size: 13.5px; line-height: 1.4; transition: border-color 0.2s ease, transform 0.2s ease; }
.chae .chae-sr-facts a:hover { border-color: var(--teal); transform: translateY(-2px); }
.chae-sr-facts strong { color: var(--ink); font-family: var(--head); font-size: 17px; font-weight: 600; }
.chae-sr-facts span:last-child { text-wrap: balance; }
.chae-sr-facts .chae-round { margin-bottom: 4px; }
.chae-sr-hero__actions { justify-content: center; }
.chae-sr-faq { max-width: 820px; width: 100%; margin: 0 auto; }
.chae-sr-sec .chae-faq__item { scroll-margin-top: 24px; }
.chae-sr-policy { scroll-margin-top: 16px; }
/* A policy in a panel (.chae-policy: Shipping & Returns' returns section, Terms, Privacy — page-legal.php), its own
   header styled as a section head. */
.chae .chae-policy .cl-hero { padding: 56px 24px 32px; background: transparent; }
.chae .chae-policy .cl-eyebrow { margin: 0 0 12px; color: var(--blue-deep); font-size: 12px; letter-spacing: 0.16em; }
.chae .chae-policy .cl-title { margin: 0 0 14px; font-size: 40px; font-weight: 500; line-height: 1.15; letter-spacing: 0; }
.chae .chae-policy .cl-sprig { width: 56px; max-width: none; height: 3px; margin: 0 auto 16px; border-radius: 2px; background: linear-gradient(90deg, var(--teal), var(--blue)); }
.chae .chae-policy .cl-sprig > * { display: none; }
.chae .chae-policy .cl-shell { max-width: none; padding: 44px 64px 56px; }
.chae .chae-policy .cl-end { margin-top: 40px; }
.chae .chae-policy .cl-contact { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); } /* room for the email address on one line */
/* Long email addresses in any policy wrap instead of widening the page on phones. */
.chae .chae-legal a { overflow-wrap: anywhere; }
/* The policy's own design (a self-contained block, .chae-legal) in the brand's colors instead of cream, sand and
   clay — its text is untouched; the same block on Terms and Privacy follows. */
.chae .chae-legal { --cream: transparent; --paper: #ffffff; --sand: #eef4f5; --sand-2: #d5dedc; --ink: #1e1e1e; --ink-2: #333333; --ink-3: #5d6764; --pine: #006263; --pine-2: #008eaf; --sage: #2b7f8c; --sage-tint: #e6f4f7; --clay: #00708a; --clay-tint: #e6f4f7; --rule: #e3e9e7; }
/* …and in the brand's shapes (2026-10-13 audit: square boxes, pale grey contents, text and boxes at different widths). */
.chae .chae-legal .cl-summary { border: 1px solid rgba(0, 98, 99, 0.14); border-top: 3px solid var(--blue); border-radius: 18px; }
.chae .chae-legal .cl-summary h2, .chae .chae-legal .cl-note .cl-k, .chae .chae-legal .cl-contact h3 { color: var(--blue-deep); letter-spacing: 0.14em; font-size: 11.5px; }
.chae .chae-legal .cl-note { max-width: none; border: 1px solid rgba(0, 98, 99, 0.14); border-left: 4px solid var(--teal); border-radius: 14px; }
.chae .chae-legal .cl-tw { border-radius: 14px; }
.chae .chae-legal .cl-contact { border: 1px solid rgba(0, 98, 99, 0.14); border-radius: 18px; background: var(--tint); }
.chae .chae-legal .cl-body p, .chae .chae-legal .cl-body ul, .chae .chae-legal .cl-body ol.cl-steps { max-width: none; } /* one width with the tables and boxes */
.chae .chae-legal .cl-nav a { color: var(--teal); font-size: 13.5px; border-radius: 8px; }
.chae .chae-legal .cl-nav a::before { color: var(--muted-2); font-size: 10.5px; }
.chae .chae-legal .cl-nav a.is-current { background: var(--teal-08); font-weight: 700; }
.chae .chae-legal .cl-nav a.is-current::before { color: var(--teal); }
@media (max-width: 560px) {
	/* Tables become stacked rows: label in bold, value under it — no sideways scroll with half the words hidden. */
	.chae .chae-legal .cl-tw { overflow: visible; border: 0; background: none; }
	.chae .chae-legal table { min-width: 0; }
	.chae .chae-legal thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.chae .chae-legal tr { display: block; margin: 0 0 10px; padding: 12px 14px; border: 1px solid rgba(0, 98, 99, 0.14); border-radius: 12px; background: #fff; }
	.chae .chae-legal td { display: block; padding: 0; border: 0; }
	.chae .chae-legal td:first-child { color: var(--ink); font-weight: 700; }
}
@media (max-width: 960px) {
	.chae-sr-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.chae .chae-policy .cl-shell { padding: 32px 28px 44px; }
}
@media (max-width: 560px) {
	.chae-sr-hero { padding: 30px 18px 26px; }
	.chae-sr-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
	.chae-sr-facts li:last-child { grid-column: 1 / -1; }
	.chae .chae-sr-facts a { padding: 14px 10px 12px; font-size: 12.5px; }
	.chae-sr-facts strong { font-size: 15.5px; }
	.chae-sr-hero__actions { flex-direction: column; align-items: stretch; width: 100%; }
	.chae .chae-policy .cl-hero { padding: 34px 18px 22px; }
	.chae .chae-policy .cl-title { font-size: 30px; }
	.chae .chae-policy .cl-shell { padding: 24px 16px 32px; }
}

/* ---------- Track your order (page-track-order.php, 2026-09-27) ---------- */
.chae-trk-hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); align-items: center; gap: 48px; padding: 52px 56px; }
.chae-trk-hero__intro { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; min-width: 0; }
.chae .chae-trk-hero__title { margin: 0; font-size: clamp(38px, 4.4vw, 54px); line-height: 1.08; }
.chae-trk-hero__lead { max-width: 480px; margin: 0; color: var(--muted); font-size: 17px; }
.chae-trk-tips { display: flex; flex-direction: column; gap: 14px; margin: 8px 0 0; padding: 20px 0 0; border-top: 1px solid var(--line); list-style: none; }
.chae-trk-tips li { display: flex; align-items: center; gap: 14px; margin: 0; color: var(--text); font-size: 15px; line-height: 1.45; }
.chae-trk-tips .chae-round { width: 40px; height: 40px; }
.chae .chae-trk-tips a { color: var(--teal); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.chae-trk-form { display: flex; flex-direction: column; gap: 16px; min-width: 0; padding: 30px; border: 1px solid var(--line); border-radius: 22px; background: #fff; box-shadow: 0 18px 40px rgba(26, 36, 33, 0.07); }
.chae .chae-trk-form__title { margin: 0; font-size: 24px; }
.chae .chae-trk-form .input-text { width: 100%; height: 50px; margin: 0; padding: 0 14px; border: 1px solid var(--line-2); border-radius: 10px; background: #fff; color: var(--ink); font-size: 16px; }
.chae .chae-trk-form .input-text:focus { border-color: var(--teal); outline: none; box-shadow: 0 0 0 3px var(--teal-08); }
body.chae .chae-trk-form__submit { display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: calc(100% - 3px); min-height: 52px; margin-top: 4px; }
.chae-trk-form__note { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 0; color: var(--muted); font-size: 13.5px; }
.chae-trk-form__note .chae-icon { color: var(--blue-deep); }
.chae-trk-form__error { margin: 0; padding: 12px 14px; border: 1px solid #f1cfc9; border-radius: 12px; background: #fdf1ef; color: #8a2a1c; font-size: 14.5px; line-height: 1.45; scroll-margin-top: 120px; }
.chae .chae-trk-form > a { color: var(--teal); font-weight: 700; }
.chae-trk-sec { margin-top: 28px; }
.chae-trk-result-wrap { scroll-margin-top: 16px; }
.chae-trk-result { display: flex; flex-direction: column; gap: 26px; padding: 44px 56px; }
.chae-trk-result__head { display: flex; flex-direction: column; gap: 8px; }
.chae-trk-result__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0; }
.chae .chae-trk-result__title { margin: 0; font-size: 40px; line-height: 1.12; }
.chae-trk-result__note { margin: 0; color: var(--text); font-size: 17px; }
.chae-trk-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.chae-trk-step { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; margin: 0; padding: 0 8px; text-align: center; }
.chae-trk-step + .chae-trk-step::before { content: ""; position: absolute; top: 22px; right: 50%; width: 100%; height: 3px; border-radius: 2px; background: var(--line-2); }
.chae-trk-step.is-done::before, .chae-trk-step.is-now::before { background: var(--teal); }
.chae-trk-step__dot { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; border: 2px solid var(--line-2); border-radius: 50%; background: #fff; color: var(--muted); }
.chae-trk-step.is-done .chae-trk-step__dot { border-color: var(--teal); background: var(--teal); color: #fff; }
.chae-trk-step.is-now .chae-trk-step__dot { border-color: var(--teal); background: #fff; color: var(--teal); box-shadow: 0 0 0 5px var(--teal-08); }
.chae-trk-step strong { color: var(--ink); font-family: var(--head); font-size: 16px; font-weight: 600; }
.chae-trk-step small { color: var(--muted); font-size: 13.5px; }
.chae-trk-result .chae-tracking { margin: 0; }
.chae-trk-facts { padding: 20px 22px; border-radius: 18px; background: var(--tint); }
.chae .chae-trk-result__sub { margin: 0 0 -10px; font-size: 20px; }
.chae-trk-items { display: flex; flex-direction: column; margin: 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.chae-trk-item { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; gap: 14px; margin: 0; padding: 12px 0; border-bottom: 1px solid var(--line); }
.chae-trk-item__thumb { width: 56px; height: 56px; overflow: hidden; border-radius: 12px; background: var(--tint); }
.chae-trk-item__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.chae-trk-item__name { color: var(--ink); font-weight: 600; line-height: 1.4; }
.chae-trk-item__name small { color: var(--muted); font-size: 13.5px; font-weight: 500; white-space: nowrap; }
.chae-trk-item__total { color: var(--ink); font-weight: 700; white-space: nowrap; }
.chae-trk-item:has(+ .is-bundled) { border-bottom: 0; }
.chae-trk-item.is-bundled { grid-template-columns: minmax(0, 1fr); margin-top: -6px; padding: 0 0 10px 70px; border-bottom: 0; }
.chae-trk-item.is-bundled .chae-trk-item__name { color: var(--muted); font-size: 14px; font-weight: 500; }
.chae-trk-item.is-bundled:has(+ .chae-trk-item:not(.is-bundled)), .chae-trk-item.is-bundled:last-child { border-bottom: 1px solid var(--line); }
.chae-trk-result__more { margin: 0; }
.chae-trk-result .chae-acc-help { margin: 0; }
.chae-trk-orders { display: flex; flex-direction: column; gap: 12px; width: 100%; max-width: 900px; margin: 0 auto; }
.chae-trk-orders__all { margin: -16px 0 0; text-align: center; }
.chae-trk-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.chae-trk-guide, .chae-trk-help { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; padding: 40px 44px; }
.chae .chae-trk-grid__title { margin: 0; font-size: 30px; }
.chae-trk-guide__list { display: flex; flex-direction: column; gap: 18px; width: 100%; margin: 0; padding: 0; list-style: none; }
.chae-trk-guide__list li { display: flex; align-items: flex-start; gap: 16px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.5; }
.chae-trk-guide__list strong { display: block; margin-bottom: 2px; color: var(--ink); font-family: var(--head); font-size: 17px; font-weight: 600; }
.chae-trk-help__text { margin: 0; color: var(--muted); }
.chae-trk-help .chae-contact__ways { margin: 0; }
.chae-trk-guide > .chae-btn--text, .chae-trk-help > .chae-btn--text { margin-top: auto; }
.chae-trk-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 28px; margin: -12px 0 0; }
@media (max-width: 960px) {
	/* Stacked, the form comes right after the heading and the tips follow it. */
	.chae-trk-hero { display: flex; flex-direction: column; align-items: stretch; gap: 16px; padding: 40px 32px; }
	.chae-trk-hero__intro { display: contents; }
	.chae-trk-hero .chae-pill { align-self: flex-start; }
	.chae-trk-form { order: 1; margin-top: 8px; }
	.chae-trk-tips { order: 2; margin-top: 12px; }
	.chae-trk-result { padding: 36px 32px; }
	.chae-trk-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
	.chae-trk-hero { padding: 28px 18px 22px; }
	.chae-trk-form { padding: 20px 16px; border-radius: 18px; }
	.chae-trk-sec { margin-top: 20px; }
	.chae-trk-result { gap: 22px; padding: 26px 18px; }
	.chae .chae-trk-result__title { font-size: 30px; }
	.chae-trk-step { padding: 0 2px; }
	.chae-trk-step__dot { width: 40px; height: 40px; }
	.chae-trk-step + .chae-trk-step::before { top: 19px; }
	.chae-trk-step strong { font-size: 14px; }
	.chae-trk-step small { font-size: 12.5px; }
	.chae-trk-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 16px; }
	.chae-trk-item { grid-template-columns: 48px minmax(0, 1fr) auto; gap: 12px; }
	.chae-trk-item__thumb { width: 48px; height: 48px; }
	.chae-trk-item.is-bundled { padding-left: 60px; }
	.chae-trk-guide, .chae-trk-help { padding: 28px 18px; }
	.chae .chae-trk-grid__title { font-size: 24px; }
}

/* ---------- Order confirmation (woocommerce/checkout/thankyou.php, 2026-09-27) ---------- */
.chae-ty { display: flex; flex-direction: column; gap: 24px; max-width: 980px; margin: 0 auto; }
.chae-ty__hero { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 52px 48px 40px; text-align: center; }
.chae-ty__badge { display: flex; align-items: center; justify-content: center; width: 78px; height: 78px; margin-bottom: 4px; border-radius: 50%; background: var(--teal); color: #fff; box-shadow: 0 0 0 10px var(--teal-08); }
/* The email check before an order's page (woocommerce/checkout/form-verify-email.php). */
.chae p.woocommerce-thankyou-order-received:has(+ .chae-verify) { display: none; } /* WooCommerce's plain line above it; the heading says it */
.chae-ty.chae-verify { max-width: 640px; width: 100%; }
.chae-verify__form { display: flex; flex-direction: column; gap: 14px; width: 100%; max-width: 420px; margin: 10px 0 0; text-align: left; }
body.chae .chae-verify__form .chae-btn { width: calc(100% - 3px); min-height: 50px; }
.chae-verify__alt { margin: 2px 0 0; color: var(--muted); font-size: 14px; text-align: center; }
.chae-ty__hero.is-failed .chae-ty__badge { background: #b3261e; box-shadow: 0 0 0 10px rgba(179, 38, 30, 0.1); }
.chae-ty__hero .chae-pill { align-self: center; }
.chae .chae-ty__title { margin: 0; font-size: clamp(36px, 4.6vw, 56px); line-height: 1.08; overflow-wrap: anywhere; }
.chae-ty__lead { max-width: 620px; margin: 0; color: var(--text); font-size: 17px; line-height: 1.55; text-wrap: balance; }
.chae-ty__lead strong { color: var(--ink); overflow-wrap: anywhere; }
.chae .chae-ty__lead.woocommerce-notice { padding: 0; border: 0; background: none; color: var(--text); }
.chae-ty__facts { width: 100%; max-width: 780px; margin: 10px 0 0; padding: 18px 22px; border-radius: 18px; background: var(--tint); text-align: left; }
.chae-ty__notes { display: flex; flex-direction: column; gap: 8px; width: 100%; max-width: 780px; text-align: left; }
.chae-ty__notes p { margin: 0; padding: 12px 16px; border-radius: 14px; background: var(--teal-08); color: var(--ink); font-size: 15px; line-height: 1.5; }
.chae .chae-ty__notes a { color: var(--teal); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.chae-ty__actions { justify-content: center; margin-top: 8px; }
body.chae .chae-ty__actions .chae-btn { display: inline-flex; align-items: center; gap: 9px; }
.chae .chae-ty__h2 { margin: 0; font-size: 26px; line-height: 1.2; }
.chae-ty__next { display: flex; flex-direction: column; gap: 24px; padding: 36px 40px; }
.chae-ty__next-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; }
.chae-ty__eta { display: flex; align-items: center; gap: 12px; margin: 0; padding: 8px 18px 8px 8px; border: 1px solid var(--line); border-radius: 999px; background: #fff; }
.chae-ty__eta .chae-round { width: 40px; height: 40px; }
.chae-ty__eta small { display: block; color: var(--muted); font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.chae-ty__eta strong { display: block; color: var(--ink); font-size: 16.5px; }
.chae-ty__steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 0; list-style: none; }
.chae-ty__steps li { display: flex; align-items: flex-start; gap: 14px; margin: 0; color: var(--muted); font-size: 14.5px; line-height: 1.5; }
.chae-ty__steps strong { display: block; margin-bottom: 2px; color: var(--ink); font-family: var(--head); font-size: 17px; font-weight: 600; }
.chae-ty__step-dot { display: flex; flex-shrink: 0; align-items: center; justify-content: center; width: 44px; height: 44px; border: 2px solid var(--line-2); border-radius: 50%; background: #fff; color: var(--blue-deep); }
.chae-ty__steps li.is-done .chae-ty__step-dot { border-color: var(--teal); background: var(--teal); color: #fff; }
.chae-ty__small { margin: -8px 0 0; color: var(--muted); font-size: 13.5px; }
.chae-ty__join { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 20px; padding: 28px 32px; }
.chae-ty__join .chae-round { width: 52px; height: 52px; }
.chae-ty__join-text { display: flex; flex-direction: column; gap: 4px; }
.chae-ty__join-text p { margin: 0; color: var(--muted); }
.chae-ty__details { padding: 36px 40px; }
.chae-ty__details .woocommerce-order-details__title { margin-top: 0; }
.chae .chae-ty__details > :last-child, .chae .chae-ty__details .woocommerce-customer-details, .chae .chae-ty__details .woocommerce-customer-details .addresses { margin-bottom: 0; }
.chae-ty > .chae-acc-help { margin: 0; }
@media (max-width: 760px) {
	.chae-ty__hero { padding: 36px 18px 28px; }
	.chae .chae-ty__title { font-size: 34px; }
	.chae-ty__lead { font-size: 16px; }
	.chae-ty__badge { width: 64px; height: 64px; }
	.chae-ty__facts { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 16px; }
	.chae-ty__actions { flex-direction: column; align-items: stretch; width: 100%; }
	body.chae .chae-ty__actions .chae-btn { justify-content: center; }
	.chae-ty__next { padding: 26px 18px; }
	.chae-ty__steps { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	.chae-ty__join { display: flex; flex-direction: column; align-items: stretch; gap: 14px; padding: 22px 18px; }
	.chae-ty__join .chae-round { width: 46px; height: 46px; }
	body.chae .chae-ty__join .chae-btn { justify-content: center; width: calc(100% - 3px); }
	.chae-ty__details { padding: 22px 16px; }
}

/* ---------- Terms and Privacy (page-legal.php, 2026-09-27): the policy panel as the page, then the other policies ---------- */
.chae .chae-policy--page .cl-title { font-size: clamp(38px, 4.4vw, 54px); line-height: 1.08; }
.chae-policy-more { margin-top: 24px; }
.chae-policy-more__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.chae-policy-more__list li { margin: 0; }
.chae .chae-policy-more__card { display: flex; align-items: center; gap: 14px; height: 100%; padding: 20px 22px; border: 1px solid var(--line); border-radius: 20px; background: #fff; color: var(--muted); transition: border-color 0.2s ease, transform 0.2s ease; } /* its own edge: .chae-panel lost its box in the 10-14 quieter look and these links read as plain text (2026-10-17 sweep) */
.chae .chae-policy-more__card:hover { border-color: var(--teal); transform: translateY(-2px); }
.chae-policy-more__card > span:last-child { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.chae-policy-more__card strong { color: var(--ink); font-family: var(--head); font-size: 17px; font-weight: 600; }
.chae-policy-more__card small { font-size: 13.5px; overflow-wrap: anywhere; }
@media (max-width: 760px) {
	.chae-policy-more__list { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.chae .chae-policy--page .cl-title { font-size: 34px; }
}

/* ---------- Not found (404.php) and help for searches with no products (2026-09-27) ---------- */
.chae-404 { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 40px 48px 44px; text-align: center; }
.chae-404__num { margin: 0 0 -6px; background: linear-gradient(135deg, var(--teal) 0%, var(--blue) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; font-family: var(--head); font-size: clamp(96px, 15vw, 176px); font-weight: 700; line-height: 0.95; letter-spacing: -0.04em; }
.chae-404 .chae-pill { align-self: center; }
.chae .chae-404__title { margin: 0; font-size: clamp(32px, 4vw, 48px); line-height: 1.1; }
.chae-404__lead { max-width: 560px; margin: 0; color: var(--muted); font-size: 17px; text-wrap: balance; }
.chae-404__search { display: flex; align-items: center; gap: 10px; width: 100%; max-width: 620px; margin-top: 10px; padding: 6px 6px 6px 18px; border: 1px solid var(--line-2); border-radius: 16px; background: #fff; box-shadow: 0 12px 30px rgba(26, 36, 33, 0.07); }
.chae-404__search:focus-within { border-color: var(--teal); box-shadow: 0 0 0 3px var(--teal-08); }
.chae-404__search > .chae-icon { flex-shrink: 0; color: var(--muted); }
.chae .chae-404__search input[type="search"] { flex: 1; min-width: 0; height: 46px; margin: 0; padding: 0; border: 0; outline: none; background: none; box-shadow: none; color: var(--ink); font: inherit; font-size: 16px; }
body.chae .chae-404__search .chae-btn { flex-shrink: 0; min-height: 46px; padding: 0 24px !important; }
.chae-404__lookups { justify-content: center; max-width: 620px; }
.chae-404-sec { margin-top: 28px; }
.chae-404__help { width: 100%; max-width: 900px; margin: 0 auto; }
/* One to three guesses sit centered at the usual card width rather than in the left of a four-card row. */
@media (min-width: 961px) {
	.chae .chae-404-sec ul.products.columns-4:not(:has(> li:nth-child(4))) { grid-template-columns: repeat(auto-fit, minmax(0, 258px)); justify-content: center; }
}
.chae-404__cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.chae-404__cards li { margin: 0; }
.chae-helplist { display: flex; flex-direction: column; gap: 12px; }
.chae-helplist__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.chae-helplist__list li { margin: 0; }
.chae .chae-helplist__list a { display: flex; align-items: center; gap: 12px; height: 100%; padding: 12px 14px; border: 1px solid var(--line); border-radius: 16px; background: #fff; color: var(--ink); transition: border-color 0.2s ease; }
.chae .chae-helplist__list a:hover { border-color: var(--teal); }
.chae-helplist__list .chae-round { width: 38px; height: 38px; }
.chae-helplist__list small { display: block; color: var(--blue-deep); font-size: 11.5px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.chae-helplist__list strong { display: block; font-weight: 600; line-height: 1.35; }
/* A search with no products has nothing to filter: no Filter box, the message takes the width. */
.chae-shop__layout.is-empty { grid-template-columns: minmax(0, 1fr); }
.chae-shop__layout.is-empty .chae-filters, .chae-shop__layout.is-empty .chae-filter-toggle { display: none; }
@media (max-width: 960px) {
	.chae-404__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
	.chae-404 { padding: 28px 18px 30px; }
	.chae-404__search { flex-wrap: wrap; padding: 8px; }
	.chae-404__search > .chae-icon { display: none; }
	.chae .chae-404__search input[type="search"] { flex-basis: 100%; padding: 0 10px; border: 1px solid var(--line); border-radius: 10px; }
	body.chae .chae-404__search .chae-btn { width: calc(100% - 3px); justify-content: center; }
	.chae-404__cards { grid-template-columns: minmax(0, 1fr); gap: 10px; }
}

/* ---------- A Letter from Linda Chaé (page-letter.php, 2026-09-27) ---------- */
.chae-letter { display: grid; grid-template-columns: 280px minmax(0, 1fr); align-items: start; gap: 56px; padding: 56px 64px; }
.chae-letter--plain { display: block; }
.chae-letter__side { position: sticky; top: 24px; display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.chae-letter__portrait { width: 100%; margin: 0; overflow: hidden; border-radius: 24px; background: var(--tint); box-shadow: 0 18px 40px rgba(26, 36, 33, 0.1); aspect-ratio: 1; }
.chae-letter__portrait img { display: block; width: 100%; height: 100%; object-fit: cover; }
.chae-letter__who { margin: 0; }
.chae-letter__who strong { display: block; color: var(--ink); font-family: var(--head); font-size: 22px; font-weight: 600; }
.chae-letter__who span { color: var(--muted); font-size: 14.5px; }
.chae-letter__motto { width: 100%; margin: 4px 0 0; padding: 16px 18px; border-radius: 18px; background: var(--teal); color: #fff; font-family: var(--head); font-size: 22px; line-height: 1.25; }
.chae-letter__motto small { display: block; margin-bottom: 4px; color: #bfe3e2; font-family: var(--body); font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.chae-letter__body { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; min-width: 0; max-width: 700px; }
.chae .chae-letter__title { margin: 0 0 6px; font-size: clamp(36px, 4.2vw, 52px); line-height: 1.1; }
.chae-letter__text p { margin: 0 0 18px; color: var(--text); font-size: 17px; line-height: 1.75; }
.chae-letter__text p:first-child { color: var(--ink); font-size: 21px; line-height: 1.6; }
.chae-letter__text p:last-child { margin-bottom: 0; }
.chae-letter__sign { margin: 8px 0 0; }
.chae-letter__sign img { display: block; width: 240px; max-width: 100%; height: auto; mix-blend-mode: multiply; } /* the scan's white paper disappears on the panel */
@media (max-width: 960px) {
	.chae-letter { grid-template-columns: minmax(0, 1fr); gap: 28px; padding: 40px 32px; }
	.chae-letter__side { position: static; display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: center; gap: 10px 16px; width: 100%; }
	.chae-letter__portrait { grid-row: span 1; border-radius: 50%; box-shadow: none; }
	.chae-letter__motto { display: none; } /* stacked, the byline is enough above the title; the promise is in the letter */
}
@media (max-width: 560px) {
	.chae-letter { padding: 28px 18px; }
	.chae .chae-letter__title { font-size: 32px; }
	.chae-letter__text p { font-size: 16px; }
	.chae-letter__text p:first-child { font-size: 18px; }
}

/* ---------- Old pages brought in (2026-09-27): Rewards, Newsletter, giveaway, Store reviews, documents, Sitemap ---------- */
/* The newsletter form outside the band (chae_newsletter_form()): the band's form styling. */
.chae-newsform .gform_wrapper { margin: 0 !important; }
.chae-newsform .gform-theme--framework { --gf-form-gap-y: 14px; --gf-label-space-primary: 6px; }
.chae-newsform .gform_wrapper .gform_footer { margin: 14px 0 0 !important; padding: 0 !important; }
body.chae .chae-newsform .gform_wrapper .gform_button { width: calc(100% - 3px) !important; }
.chae-newsform .gform_confirmation_message { color: var(--ink); font-size: 16px; font-weight: 500; }

/* Rewards (page-rewards.php) */
.chae-rw-hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); align-items: center; gap: 48px; padding: 52px 56px; }
.chae-rw-hero__intro { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.chae .chae-rw-hero__title { margin: 0; font-size: clamp(38px, 4.4vw, 54px); line-height: 1.08; }
.chae-rw-hero__big { margin: 0; color: var(--ink); font-size: 20px; }
.chae-rw-hero__big strong { display: block; background: linear-gradient(135deg, var(--teal), var(--blue)); -webkit-background-clip: text; background-clip: text; color: transparent; font-family: var(--head); font-size: clamp(64px, 8vw, 96px); font-weight: 700; line-height: 1; }
.chae-rw-hero__lead { max-width: 480px; margin: 0; color: var(--muted); font-size: 17px; }
body.chae .chae-rw-hero__actions .chae-btn { display: inline-flex; align-items: center; gap: 9px; }
.chae-rw-card { display: flex; flex-direction: column; gap: 10px; padding: 30px; border-radius: 24px; background: var(--teal); color: #fff; box-shadow: 0 20px 44px rgba(0, 98, 99, 0.22); }
.chae-rw-card__label { color: #bfe3e2; font-size: 12.5px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.chae-rw-card__num { font-family: var(--head); font-size: 64px; font-weight: 700; line-height: 1; }
.chae-rw-card__note { color: #e3f2f1; font-size: 16px; }
.chae-rw-card__math { display: flex; flex-direction: column; gap: 12px; margin: 8px 0 0; padding: 18px 0 0; border-top: 1px solid rgba(255, 255, 255, 0.2); list-style: none; }
.chae-rw-card__math li { display: flex; align-items: center; gap: 14px; margin: 0; font-family: var(--head); font-size: 19px; }
.chae-rw-card__math .chae-round { width: 42px; height: 42px; background: rgba(255, 255, 255, 0.14); color: #fff; }
.chae-rw-sec { margin-top: 28px; }
.chae-rw-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin: 0; padding: 0; list-style: none; }
.chae-rw-steps li { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; margin: 0; padding: 26px; border: 1px solid var(--line); border-radius: 20px; background: #fff; }
.chae .chae-rw-steps h3 { margin: 4px 0 0; font-size: 22px; }
.chae-rw-steps p { margin: 0; color: var(--muted); line-height: 1.55; }

/* Newsletter (page-newsletter.php) */
.chae-nl { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); align-items: center; gap: 48px; padding: 52px 56px; }
.chae-nl__intro { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.chae .chae-nl__title { margin: 0; font-size: clamp(38px, 4.4vw, 54px); line-height: 1.08; }
.chae-nl__lead { max-width: 500px; margin: 0; color: var(--muted); font-size: 17px; }
.chae-nl__perks { display: flex; flex-direction: column; gap: 14px; margin: 8px 0 0; padding: 20px 0 0; border-top: 1px solid var(--line); list-style: none; }
.chae-nl__perks li { display: flex; align-items: flex-start; gap: 14px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.45; }
.chae-nl__perks strong { display: block; color: var(--ink); font-size: 16px; }
.chae-nl__form, .chae-give__form { display: flex; flex-direction: column; gap: 12px; padding: 28px; border: 1px solid var(--line); border-radius: 22px; background: #fff; box-shadow: 0 18px 40px rgba(26, 36, 33, 0.07); }
.chae .chae-nl__form-title, .chae .chae-give__form-title { margin: 0; font-size: 24px; }
.chae-nl__small, .chae-give__small { display: flex; align-items: center; gap: 7px; margin: 0; color: var(--muted); font-size: 13.5px; }
.chae .chae-nl__small a { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
.chae-give__small { display: block; }

/* Giveaway (page-giveaway.php) */
.chae-give--ended { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 44px; padding: 44px 48px; }
.chae-give__photo { margin: 0; overflow: hidden; border-radius: 22px; }
.chae-give__photo img { display: block; width: 100%; height: auto; }
.chae-give__text { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.chae .chae-give__title { margin: 0; font-size: clamp(34px, 3.8vw, 48px); line-height: 1.1; }
.chae-give__lead { margin: 0; color: var(--text); font-size: 17px; }
.chae-give__form { width: 100%; margin-top: 6px; }
.chae-give-sec { margin-top: 0; }
.chae-give.chae-prose { padding: 44px 0; }

/* Store reviews (page-reviews.php) */
.chae-rv-hero { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 44px 48px 40px; text-align: center; }
/* Store reviews: the plugin's trust badge repeated the summary below it in its own colors and system font, and shrank to
   unreadable on phones (2026-10-13 audit): the page keeps one summary, the theme-styled one. */
.chae-rv .cr-trustbadgef { display: none !important; }
.chae-rv-hero .chae-pill { align-self: center; }
.chae .chae-rv-hero__title { margin: 0; font-size: clamp(38px, 4.4vw, 54px); line-height: 1.08; }
.chae-rv-hero__lead { max-width: 560px; margin: 0; color: var(--muted); font-size: 17px; }
.chae-rv-sec { margin-top: 24px; }
.chae-rv { padding: 40px 48px; }
.chae-rv .cr-trustbadgef, .chae-rv .cr-badge { margin-inline: auto; }

/* Document (page-document.php) */
.chae-doc { display: flex; flex-direction: column; gap: 28px; padding: 44px 48px; }
.chae-doc__head { display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; }
.chae-doc__head .chae-pill { align-self: center; }
.chae .chae-doc__title { margin: 0; font-size: clamp(36px, 4.2vw, 52px); line-height: 1.1; }
.chae-doc__lead { max-width: 600px; margin: 0; color: var(--muted); font-size: 17px; }
.chae-doc__body > .chae-bb-row { max-width: 820px; margin: 0 auto; }
.chae-doc-sec { margin-top: 28px; }

/* Sitemap (page-sitemap.php) */
.chae-smap { display: flex; flex-direction: column; gap: 36px; padding: 48px 56px; }
.chae-smap__head { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.chae .chae-smap__title { margin: 0; font-size: clamp(36px, 4.2vw, 52px); line-height: 1.1; }
.chae-smap__lead { margin: 0; color: var(--muted); font-size: 17px; }
.chae-smap__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; padding: 28px 0 0; border-top: 1px solid var(--line); }
.chae .chae-smap h2 { margin: 0 0 12px; font-size: 20px; }
.chae-smap ul { margin: 0; padding: 0; list-style: none; }
.chae-smap li { margin: 0 0 8px; color: var(--muted); font-size: 15px; line-height: 1.4; break-inside: avoid; }
.chae .chae-smap li a { color: var(--ink); }
.chae .chae-smap li a:hover { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
.chae-smap li small { color: var(--muted-2, var(--muted)); font-size: 12.5px; }
.chae-smap__long { padding: 28px 0 0; border-top: 1px solid var(--line); }
.chae-smap__cols { columns: 3 240px; column-gap: 28px; }
.chae-smap__cols--posts { columns: 2 320px; }

@media (max-width: 960px) {
	.chae-rw-hero, .chae-nl, .chae-give--ended { grid-template-columns: minmax(0, 1fr); gap: 28px; padding: 40px 32px; }
	.chae-rw-steps { grid-template-columns: minmax(0, 1fr); gap: 12px; }
	.chae-smap__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
	.chae-rw-hero, .chae-nl, .chae-give--ended, .chae-rv-hero, .chae-doc, .chae-smap { padding: 28px 18px; }
	.chae-rw-card, .chae-nl__form, .chae-give__form { padding: 22px 18px; }
	.chae-rw-card__num { font-size: 52px; }
	.chae-rv { padding: 20px 12px; }
	.chae-rw-steps li { padding: 20px; }
	.chae-smap__grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
	body.chae .chae-rw-hero__actions { flex-direction: column; align-items: stretch; width: 100%; }
	body.chae .chae-rw-hero__actions .chae-btn { justify-content: center; }
}

/* ---------- Tables saved by WP Table Builder, rebuilt ([wptb], inc/legacy-shortcodes.php) ---------- */
.chae-table { max-width: 100%; margin: 24px 0; overflow-x: auto; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.chae-table table { width: 100%; margin: 0; border-collapse: collapse; font-size: 15px; }
.chae-table th, .chae-table td { padding: 12px 16px; border: 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.chae-table th { background: var(--tint); color: var(--ink); font-weight: 700; }
.chae-table tbody tr:last-child td { border-bottom: 0; }
.chae-table .is-num { text-align: right; white-space: nowrap; }

/* ---------- Journal posts: media pasted in from the old site stays inside the column (sweep, 2026-09-27) ---------- */
/* Captions with a fixed width (style="width: 2560px"), 560px video embeds and long links widened phones' pages. */
.chae .chae-story__content :is(figure, .wp-caption, img, video, iframe, embed, object) { max-width: 100% !important; }
.chae .chae-story__content img { height: auto; }
.chae .chae-story__content :is(iframe[src*="youtube"], iframe[src*="youtu.be"], iframe[src*="vimeo"]) { width: 100%; height: auto; aspect-ratio: 16 / 9; }
.chae .chae-story__content a { overflow-wrap: anywhere; }

/* ---------- Journal article pass (single.php, 2026-09-27) ---------- */
.chae .chae-story__title { font-size: clamp(32px, 4.4vw, 52px); line-height: 1.12; }
.chae-story__dek { max-width: 680px; margin: 0; color: var(--text); font-size: 20px; line-height: 1.55; text-wrap: balance; }
.chae-story__meta { display: inline-flex; align-items: center; gap: 8px; }
.chae-story__meta .chae-icon { color: var(--blue-deep); }
/* The photo's space is reserved (width/height), so a tint fills it while it loads instead of a blank block. */
.chae-story__hero img, .chae-story__content img { background: linear-gradient(135deg, #e6f2f3 0%, #eef6f2 100%); }
/* Long articles: "In this article" in a column beside the text that follows it down the page. */
@media (min-width: 1200px) {
	.chae-story__panel.has-toc { display: grid; grid-template-columns: 230px minmax(0, 1fr); align-items: start; gap: 40px; padding-left: 40px; }
	.chae-story__rail { position: sticky; top: 24px; }
	body.admin-bar .chae-story__rail { top: calc(24px + var(--wp-admin--admin-bar--height, 32px)); }
	.chae-story__rail .chae-toc { margin: 0; padding: 18px 18px 14px; }
	.chae-story__rail .chae-toc summary { font-size: 16px; cursor: default; pointer-events: none; }
	.chae-story__rail .chae-toc summary::after { display: none; }
	.chae-story__rail .chae-toc ol { max-height: calc(100vh - 170px); margin-top: 12px; padding-left: 0; overflow-y: auto; columns: 1; font-size: 14px; list-style: none; counter-reset: toc; }
	.chae-story__rail .chae-toc li { margin: 0 0 2px; counter-increment: toc; }
	.chae .chae-story__rail .chae-toc a { display: grid; grid-template-columns: 22px minmax(0, 1fr); padding: 6px 8px 6px 6px; border-radius: 10px; color: var(--muted); line-height: 1.4; }
	.chae .chae-story__rail .chae-toc a::before { content: counter(toc) "."; color: var(--blue); font-weight: 700; }
	.chae .chae-story__rail .chae-toc a:hover { color: var(--teal); text-decoration: none; background: rgba(255, 255, 255, 0.7); }
	.chae .chae-story__rail .chae-toc a.is-current { background: #fff; color: var(--teal); font-weight: 700; box-shadow: 0 2px 8px rgba(26, 36, 33, 0.08); }
	.chae-story__panel.has-toc .chae-story__content > * { margin-left: 0; }
	.chae-story__panel.has-toc :is(.chae-story__about, .chae-story__foot) { margin-left: 0; }
}
.chae .chae-toc a.is-current { font-weight: 700; }
/* About Chaé Organics, after the article. */
.chae-story__about { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 4px 18px; max-width: 720px; margin: 44px auto 0; padding: 20px 22px; border-radius: 18px; background: var(--tint); }
.chae-story__about img { grid-row: span 2; width: 56px; height: auto; }
.chae-story__about p { margin: 0; color: var(--text); font-size: 15px; line-height: 1.55; }
.chae-story__about strong { color: var(--ink); }
.chae-story__about-links { display: flex; flex-wrap: wrap; gap: 4px 18px; }
.chae .chae-story__about-links a { color: var(--teal); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.chae-story__about + .chae-story__foot { margin-top: 24px; }

/* The article kit (.chae-post with its own <style>, the newest posts): the brand's colors and shapes. */
.chae .chae-story__content .chae-post { --chae-accent: var(--teal); --chae-accent-ink: var(--teal-press); --chae-sage: var(--blue-deep); --chae-rule: var(--line); --chae-soft: var(--tint); --chae-muted: var(--muted); }
.chae .chae-story__content .chae-post figure img { border-radius: 16px; }
.chae .chae-story__content .chae-post .tldr { margin: 0 0 36px; padding: 24px 28px; border: 1px solid rgba(0, 98, 99, 0.12); border-left: 0; border-radius: 20px; background: linear-gradient(160deg, #eaf5f5 0%, #f4f8f8 70%); }
.chae .chae-story__content .chae-post .tldr__label { margin: 0 0 12px; color: var(--blue-deep); font-family: var(--body); font-size: 12.5px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.chae .chae-story__content .chae-post .tldr ul { margin-bottom: 0; }
.chae .chae-story__content .chae-post .aside { margin: 32px 0; padding: 22px 24px; border: 1px solid var(--line); border-left: 4px solid var(--blue); border-radius: 18px; background: #fff; box-shadow: var(--shadow-sm); }
.chae .chae-story__content .chae-post .aside :last-child { margin-bottom: 0; }
.chae .chae-story__content .chae-post .ingredient { padding: 0 3px; border-radius: 5px; background: var(--tint); color: var(--ink); font-family: var(--body); font-size: 0.94em; font-weight: 500; -webkit-box-decoration-break: clone; box-decoration-break: clone; } /* lighter: a paragraph of them read as noise */
.chae .chae-story__content .chae-post .tablewrap { margin: 24px 0 32px; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.chae .chae-story__content .chae-post .tablewrap table { margin: 0; }
.chae .chae-story__content .chae-post th { background: var(--tint); color: var(--ink); font-weight: 700; }
.chae .chae-story__content .chae-post :is(th, td) { padding: 12px 16px; }
.chae .chae-story__content .chae-post tbody tr:last-child td { border-bottom: 0; }
.chae .chae-story__content .chae-post .spotlight { margin-top: 56px; padding: 30px 28px; border: 1px solid rgba(0, 98, 99, 0.12); border-radius: 24px; background: linear-gradient(160deg, #eaf5f5 0%, #fff 60%); }
.chae .chae-story__content .chae-post .spotlight > h2 { margin-top: 0; }
.chae .chae-story__content .chae-post .card { padding: 16px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.chae .chae-story__content .chae-post .card img { border-radius: 14px; }
.chae .chae-story__content .chae-post .card h3 { font-size: 18px; line-height: 1.3; }
.chae .chae-story__content .chae-post .card .price { color: var(--muted); font-size: 13.5px; }
.chae .chae-story__content .chae-post .card a.btn { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border: 1px solid transparent; border-radius: 10px; background: var(--btn-fill) border-box; box-shadow: 0 3px 0 var(--btn-edge); color: #fff; font-size: 14px; font-weight: 700; text-decoration: none; transition: transform 0.12s ease, box-shadow 0.12s ease; }
.chae .chae-story__content .chae-post .card a.btn:hover { background: var(--btn-fill) border-box; box-shadow: 0 0 0 var(--btn-edge); transform: translate(0, 3px); }
.chae .chae-story__content .chae-post .faq { margin-top: 48px; }
.chae .chae-story__content .chae-post .faq .chae-faq__item summary { font-size: 17px; }
.chae .chae-story__content .chae-post .faq .chae-faq__answer > * { max-width: none; margin: 0; padding: 0 0 18px; font-size: 16.5px; }
.chae .chae-story__content .chae-post .sources { margin-top: 44px; padding-top: 22px; border-top: 1px solid var(--line); color: var(--muted); font-size: 14px; line-height: 1.6; }
.chae .chae-story__content .chae-post .sources h2 { margin-top: 0; font-size: 18px; }
.chae .chae-story__content .chae-post .sources li { margin-bottom: 6px; }
@media (max-width: 782px) {
	.chae-story__dek { font-size: 17.5px; }
	.chae .chae-story__content .chae-post .tldr, .chae .chae-story__content .chae-post .spotlight { padding: 20px 18px; }
	.chae .chae-story__content .chae-post .card { flex-direction: column; }
	.chae .chae-story__content .chae-post .card img { flex-basis: auto; width: 96px; height: 96px; }
	.chae-story__about { grid-template-columns: minmax(0, 1fr); text-align: left; }
	.chae-story__about img { grid-row: auto; width: 44px; }
}
/* The kit's product cards: two across only when there's room (not beside "In this article"). */
/* one card a row: photo beside the text reads better than two cramped cards */

/* The article kit's layout (every journal post, tools/journal): the rules posts used to carry in their own <style>. */
.chae .chae-story__content .chae-post figure { margin: 36px 0; }
.chae .chae-story__content .chae-post figure img { display: block; width: 100%; height: auto; }
.chae .chae-story__content .chae-post figure.product img { aspect-ratio: 1; object-fit: contain; background: #fff; }
.chae .chae-story__content .chae-post figure.video iframe { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; border-radius: 16px; }
.chae .chae-story__content .chae-post .chae-credit::before { content: "Photo: "; color: var(--blue-deep); font-weight: 600; }
.chae .chae-story__content .chae-post .aside h3 { margin-top: 0; }
.chae .chae-story__content .chae-post .tablewrap { overflow-x: auto; }
.chae .chae-story__content .chae-post .tablewrap table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: 15px; }
.chae .chae-story__content .chae-post .tablewrap :is(th, td) { border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.chae .chae-story__content .chae-post .products { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; margin-top: 22px; }
.chae .chae-story__content .chae-post .card { display: flex; align-items: flex-start; gap: 16px; }
.chae .chae-story__content .chae-post .card > div { flex: 1 1 auto; min-width: 0; }
.chae .chae-story__content .chae-post .card > p { display: contents; }
.chae .chae-story__content .chae-post .card img { flex: 0 0 112px; width: 112px; height: 112px; object-fit: contain; border: 1px solid var(--line); background: #fff; }
.chae .chae-story__content .chae-post .card h3 { margin: 0 0 4px; }
.chae .chae-story__content .chae-post .card p { margin: 0 0 8px; font-size: 15px; line-height: 1.55; }
.chae .chae-story__content .chae-post .card .price { margin-bottom: 10px; }
.chae .chae-story__content .chae-post .card .price del { color: var(--muted); }
.chae .chae-story__content .chae-post .card .price ins { text-decoration: none; }
.chae .chae-story__content .chae-post .card .price .amount { color: var(--ink); font-weight: 700; }
/* one card a row: photo beside the text reads better than two cramped cards */
/* Kit images at their own size (no upscaling a small logo to the column); product shots and logos smaller, centered. */
.chae .chae-story__content .chae-post figure img { width: auto; max-width: 100%; margin-inline: auto; }
.chae .chae-story__content .chae-post figure.product { width: min(360px, 100%); margin-inline: auto; } /* width: the sweep's max-width: 100% !important on figures wins over a max-width */
.chae .chae-story__content .chae-post figure.product img { width: 100%; border: 1px solid var(--line); border-radius: 18px; }
.chae .chae-story__content .chae-post figure.logo { width: min(200px, 100%); margin-inline: auto; }
.chae .chae-story__content .chae-post figure.logo img { width: 100%; border-radius: 0; background: none; }
/* Photos: never taller than a screen (portrait Unsplash files were 1,050px tall in a 720px column, mostly blur). */
.chae .chae-story__content .chae-post figure:not(.product):not(.logo):not(.video) img { width: 100%; max-height: min(480px, 70vh); object-fit: cover; }
/* Tables on phones: each row a small card with its column names, not a sideways scroll hiding a column. */
@media (max-width: 560px) {
	.chae .chae-story__content .chae-post .tablewrap { overflow: visible; border: 0; background: none; }
	.chae .chae-story__content .chae-post .tablewrap table { min-width: 0; }
	.chae .chae-story__content .chae-post .tablewrap thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.chae .chae-story__content .chae-post .tablewrap tr { display: block; margin: 0 0 12px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
	.chae .chae-story__content .chae-post .tablewrap td { display: block; padding: 2px 0 8px; border: 0; }
	.chae .chae-story__content .chae-post .tablewrap td:last-child { padding-bottom: 0; }
	.chae .chae-story__content .chae-post .tablewrap td[data-label]::before { content: attr(data-label); display: block; margin-bottom: 2px; color: var(--blue-deep); font-size: 11.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
	.chae .chae-story__content .chae-post .tablewrap td:first-child { color: var(--ink); font-weight: 700; }
}

/* ---------- Article tools (chae_post_tools(), 2026-09-27): Listen · Print / PDF · Cite · Reading · Glossary ---------- */
.chae-tools { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 4px; }
.chae .chae-tools__btn { display: inline-flex; align-items: center; gap: 8px; height: 42px; margin: 0; padding: 0 16px; border: 1px solid var(--line-2); border-radius: 12px; background: #fff; color: var(--ink); font: inherit; font-size: 14.5px; font-weight: 700; letter-spacing: 0.01em; cursor: pointer; transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease; }
.chae .chae-tools__btn:hover { border-color: var(--teal); color: var(--teal); }
.chae .chae-tools__btn .chae-icon { flex-shrink: 0; color: var(--teal); }
.chae .chae-tools__btn[aria-pressed="true"] { border-color: var(--teal); background: var(--teal); color: #fff; }
.chae .chae-tools__btn[aria-pressed="true"] .chae-icon { color: #fff; }
.chae .chae-tools__stop { width: 42px; padding: 0; justify-content: center; }
.chae .chae-tools__btn[hidden], .chae-tools__icon[hidden] { display: none; }
.chae-tools__icon { display: inline-flex; }
.chae .chae-story .is-speaking { border-radius: 6px; background: rgba(0, 142, 175, 0.1); box-shadow: 0 0 0 6px rgba(0, 142, 175, 0.1); }
/* Dialogs */
.chae-dialog { width: min(560px, calc(100vw - 32px)); max-height: min(82vh, 720px); margin: auto; padding: 22px 24px 24px; overflow: auto; border: 0; border-radius: 22px; background: #fff; color: var(--text); box-shadow: 0 30px 80px rgba(26, 36, 33, 0.28); }
.chae-dialog::backdrop { background: rgba(20, 30, 28, 0.45); }
.chae-dialog__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.chae .chae-dialog__title { margin: 0; font-size: 22px; line-height: 1.25; }
.chae .chae-dialog__close { display: flex; flex-shrink: 0; align-items: center; justify-content: center; width: 38px; height: 38px; padding: 0; border: 0; border-radius: 10px; background: var(--tint); color: var(--ink); cursor: pointer; }
.chae .chae-dialog__close:hover { color: var(--teal); }
.chae-dialog__lead { margin: 0 0 12px; color: var(--muted); font-size: 14.5px; }
.chae-dialog__foot { margin: 14px 0 0; text-align: right; }
body.chae .chae-dialog__foot .chae-btn--text::after { content: none; }
body.chae .chae-dialog__foot .chae-btn--text { margin-right: 0; }
.chae-glossary__none { margin: 14px 0 4px; color: var(--muted); font-size: 14.5px; text-align: center; }
.chae-glossary__none[hidden] { display: none; }
/* Cite */
.chae-cite { padding: 14px 0; border-top: 1px solid var(--line); }
.chae-cite__style { display: block; margin-bottom: 6px; color: var(--blue-deep); font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.chae-cite__text { margin: 0 0 10px; color: var(--ink); font-size: 15px; line-height: 1.6; overflow-wrap: anywhere; }
body.chae .chae-cite__copy { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 0 14px !important; font-size: 14px; }
/* Reading */
.chae-seg { margin: 0 0 18px; padding: 0; border: 0; }
.chae-seg legend { margin-bottom: 8px; padding: 0; color: var(--ink); font-size: 14.5px; font-weight: 700; }
.chae-seg label { position: relative; display: inline-block; margin: 0 6px 6px 0; }
.chae-seg input { position: absolute; opacity: 0; }
.chae-seg span { display: inline-flex; align-items: center; height: 40px; padding: 0 14px; border: 1px solid var(--line-2); border-radius: 10px; color: var(--ink); font-weight: 600; cursor: pointer; }
.chae-seg input:checked + span { border-color: var(--teal); background: var(--teal); color: #fff; }
.chae-seg input:focus-visible + span { outline: 2px solid var(--blue); outline-offset: 2px; }
.chae-seg .chae-seg__s { font-size: 13px; } .chae-seg .chae-seg__m { font-size: 14.5px; } .chae-seg .chae-seg__l { font-size: 16.5px; } .chae-seg .chae-seg__xl { font-size: 18.5px; }
.chae-switch { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border-radius: 14px; background: var(--tint); color: var(--muted); font-size: 14.5px; line-height: 1.5; cursor: pointer; }
.chae-switch input { flex-shrink: 0; width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--teal); }
.chae-switch strong { display: block; color: var(--ink); font-size: 15.5px; }
/* Glossary */
.chae .chae-glossary__find { width: 100%; height: 44px; margin: 0 0 8px; }
.chae-glossary { margin: 0; }
.chae-glossary > div { padding: 12px 0; border-top: 1px solid var(--line); }
.chae-glossary > div[hidden] { display: none; }
.chae-glossary dt { color: var(--ink); font-family: var(--head); font-size: 16.5px; font-weight: 600; }
.chae-glossary dd { margin: 4px 0 0; color: var(--text); font-size: 15px; line-height: 1.55; }
/* Reading settings on the article */
.chae-story[data-read-size="s"] .chae-story__content { font-size: 16px; }
.chae-story[data-read-size="l"] .chae-story__content { font-size: 20.5px; }
.chae-story[data-read-size="xl"] .chae-story__content { font-size: 23px; }
.chae-story[data-read-spacing="relaxed"] .chae-story__content { line-height: 2; letter-spacing: 0.01em; }
.chae-story[data-read-spacing="relaxed"] .chae-story__content :where(p, li) { margin-bottom: 1.5em; }
body.chae-focus :is(.chae-story__rail, .chae-story__crumbs, .chae-story__about, .chae-story__foot, .chae-story__shop, .chae-story__more, .chae-news, .chae-story .spotlight) { display: none !important; }
body.chae-focus .chae-story__panel.has-toc { display: block; }
body.chae-focus .chae-story__panel.has-toc .chae-story__content > * { margin-left: auto; }
@media (max-width: 782px) {
	.chae-tools { justify-content: flex-start; gap: 6px; }
	.chae .chae-tools__btn { height: 38px; padding: 0 12px; font-size: 13.5px; }
	.chae .chae-tools__stop { width: 38px; }
	.chae-story[data-read-size="s"] .chae-story__content { font-size: 15.5px; }
	.chae-story[data-read-size="l"] .chae-story__content { font-size: 19px; }
	.chae-story[data-read-size="xl"] .chae-story__content { font-size: 21px; }
	.chae-dialog { padding: 18px 18px 20px; border-radius: 18px; }
}

/* Print / PDF: just the article — title, date, photo, text, FAQ answers open (chae.js), where it came from. */
@media print {
	@page { margin: 16mm 14mm; }
	body.chae { background: #fff !important; }
	.chae :is(#wpadminbar, .chae-topbar, .chae-header, .chae-nav, .chae-footer, .chae-news, .chae-progress, .chae-story__crumbs, .chae-story__rail, .chae-tools, .chae-story__foot, .chae-story__shop, .chae-story__more, .chae-sidecart, .chae-dialog, .chae-faq__chevron, .chae-skip) { display: none !important; }
	.chae-main, .chae-wrap { max-width: none !important; margin: 0 !important; padding: 0 !important; }
	.chae-story__head { align-items: flex-start; max-width: none; margin: 0 0 6mm; text-align: left; }
	.chae .chae-story__title { font-size: 24pt; }
	.chae-story__dek { font-size: 13pt; }
	.chae-story__hero { margin: 0 0 6mm; }
	.chae-story__hero img { max-height: 80mm; border-radius: 0; }
	.chae-story__panel, .chae-story__panel.has-toc { display: block !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; }
	.chae-story__content { color: #111; font-size: 11pt; line-height: 1.55; }
	.chae-story__content > *, .chae-story__about { max-width: none !important; margin-left: 0 !important; }
	.chae-story__content :is(h2, h3) { break-after: avoid; }
	.chae-story__content :is(figure, table, .tldr, .aside, .card, .chae-faq__item) { break-inside: avoid; }
	.chae-story__content a { color: #111; }
	.chae .chae-story__content .chae-post .card a.btn { display: none; }
	.chae .chae-story__content .chae-post .products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3mm; margin-top: 4mm; }
	.chae .chae-story__content .chae-post .card { flex-direction: row; gap: 3mm; padding: 3mm; border-radius: 3mm; }
	.chae .chae-story__content .chae-post .card img { flex: 0 0 18mm; width: 18mm; height: 18mm; }
	.chae .chae-story__content .chae-post .card h3 { margin: 0 0 1mm; font-size: 10.5pt; }
	.chae .chae-story__content .chae-post .card :is(p, .price) { margin: 0 0 1mm; font-size: 9pt; line-height: 1.35; }
	.chae-story::after { content: "From the Chaé Organics journal — " attr(data-print-url); display: block; margin-top: 10mm; color: #555; font-size: 9pt; }
}

/* ---------- Ingredient look-up (inc/ingredients.php, assets/js/ingredients.js, page-ingredients.php; data from the
   chae-ingredients plugin, whose own stylesheet is dropped) ---------- */
/* product page: the label, each ingredient a button */
.chae-inglist__items { margin: 0 0 8px; line-height: 1.85; }
.chae .chae-inglist__variant { margin: 14px 0 2px; font-family: var(--body); font-size: 15px; font-weight: 700; }
.chae-inglist__variant:first-child { margin-top: 0; }
.chae-inglist__section { margin: 10px 0 0; color: var(--muted); font-size: 12.5px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.chae-inglist__note { color: var(--muted); font-size: 0.92em; }
.chae-inglist__foot { margin: 6px 0 0; color: var(--muted); font-size: 13px; }
.chae .chae-ingr { display: inline; margin: 0; padding: 2px 0; border: 0; background: none; color: var(--teal); font: inherit; font-weight: 600; text-align: left; text-decoration: underline dotted; text-decoration-thickness: 1.5px; text-underline-offset: 3px; cursor: pointer; }
.chae .chae-ingr:hover { color: var(--ink); text-decoration-style: solid; }
.chae .chae-ingr:focus-visible { border-radius: 4px; outline: 2px solid var(--teal); outline-offset: 2px; }
.chae-fulllist__tip { margin: 10px 0 0; color: var(--muted); font-size: 13.5px; line-height: 1.5; }
.chae .chae-fulllist__tip a { font-weight: 700; }
.chae .chae-keycard__ask { display: inline-flex; align-items: center; margin: 12px 12px 0 0; padding: 6px 14px; border: 1px solid rgba(0, 98, 99, 0.25); border-radius: 999px; background: #fff; color: var(--teal); font-size: 13.5px; font-weight: 700; text-decoration: none; }
.chae .chae-keycard__ask:hover { border-color: var(--teal); background: var(--teal-08); color: var(--teal); }
/* the panel */
.chae-ingdlg { width: min(560px, calc(100vw - 32px)); max-height: min(86vh, 760px); padding: 0; border: 0; border-radius: 24px; background: #fff; color: var(--ink); box-shadow: 0 24px 60px rgba(26, 36, 33, 0.25); }
.chae-ingdlg::backdrop { background: rgba(20, 30, 28, 0.45); }
.chae-ingdlg__panel { position: relative; max-height: inherit; padding: 28px 28px 26px; overflow: auto; }
.chae .chae-ingdlg__close { position: absolute; top: 14px; right: 14px; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; background: var(--tint); color: var(--ink); cursor: pointer; }
.chae .chae-ingdlg__close:hover { background: var(--teal-08); color: var(--teal); }
.chae .chae-ingdlg__name { margin: 4px 52px 10px 0; font-size: 26px; line-height: 1.2; }
.chae-ingdlg__what { margin: 0 0 16px; font-size: 16px; line-height: 1.6; }
.chae-ingdlg__facts { display: grid; gap: 12px; margin: 0; }
.chae-ingdlg__row { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.chae-ingdlg__row dt { color: var(--muted); font-size: 12.5px; font-weight: 800; letter-spacing: 0.06em; line-height: 1.8; text-transform: uppercase; }
.chae-ingdlg__row dd { margin: 0; font-size: 15px; line-height: 1.55; overflow-wrap: anywhere; }
.chae-ingdlg__rating, .chae .chae-ing-badge { display: inline-block; padding: 3px 10px; border-radius: 999px; background: var(--tint); color: var(--ink); font-size: 12.5px; font-weight: 700; line-height: 1.5; white-space: nowrap; }
.chae-ingdlg__rating.is-green-light, .chae .chae-ing-badge.is-green-light { background: #e6f3ec; color: #1f6b3a; }
.chae-ingdlg__rating.is-reality-check, .chae .chae-ing-badge.is-reality-check { background: #fdf1dc; color: #7a4d00; }
.chae-ingdlg__rating.is-red-light, .chae .chae-ing-badge.is-red-light { background: #fbe6e4; color: #9b1f18; }
.chae-ingdlg__links { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 22px; }
.chae .chae-ingdlg__lib { font-weight: 700; }
@media (max-width: 600px) {
	.chae-ingdlg { width: 100%; max-width: 100%; max-height: 88vh; margin: auto 0 0; border-radius: 22px 22px 0 0; }
	.chae-ingdlg__panel { padding: 24px 20px calc(22px + env(safe-area-inset-bottom)); }
	.chae-ingdlg__row { grid-template-columns: minmax(0, 1fr); gap: 2px; }
	.chae .chae-ingdlg__name { font-size: 23px; }
}
/* the library page: the plugin's directory in the theme's look */
.chae-inglib .chae-ing-dir { margin-top: 26px; }
.chae-ing-dir__form { padding: 20px; border: 1px solid var(--line); border-radius: 20px; background: var(--tint); }
.chae-ing-dir__search label { display: block; margin-bottom: 8px; font-weight: 700; }
.chae .chae-ing-dir__search input { width: 100%; min-height: 54px; padding: 12px 16px; border: 1px solid #cfdad7; border-radius: 14px; background: #fff; font-size: 17px; }
.chae .chae-ing-dir__search input:focus { border-color: var(--teal); outline: 2px solid var(--teal); outline-offset: 0; }
.chae-ing-dir__filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 14px; margin-top: 14px; }
.chae-ing-dir__filters label { display: flex; flex: 1 1 170px; flex-direction: column; gap: 5px; min-width: 150px; color: var(--muted); font-size: 12.5px; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; }
.chae .chae-ing-dir__filters select { min-height: 44px; padding: 8px 12px; border: 1px solid #cfdad7; border-radius: 12px; background-color: #fff; color: var(--ink); font-size: 15px; font-weight: 500; letter-spacing: 0; text-transform: none; }
.chae .chae-ing-dir__submit { min-height: 44px; padding: 0 22px; border: 0; border-radius: var(--r-btn); background: var(--teal); color: #fff; font-weight: 700; cursor: pointer; }
.chae-ing-dir.is-live .chae-ing-dir__submit { display: none; }
.chae-ing-dir__letters { display: flex; gap: 4px; margin: 18px 0 14px; } /* one row: X Y Z sat alone on a second (2026-10-13 audit) */
.chae .chae-ing-dir__letters a { display: inline-flex; flex: 1 0 auto; align-items: center; justify-content: center; min-width: 30px; height: 36px; padding: 0 6px; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--teal); font-weight: 700; text-decoration: none; }
@media (max-width: 960px) { .chae-ing-dir__letters { overflow-x: auto; scrollbar-width: none; } .chae-ing-dir__letters::-webkit-scrollbar { display: none; } .chae .chae-ing-dir__letters a { flex: 0 0 auto; min-width: 38px; } }
/* 2026-10-17 sweep: on an iPad the row stopped at "Q" with nothing to say it scrolls. Tablets: two even rows of 14
   (All, #, A–Z); phones keep the swipe row, fading at the edge so it reads as one. Filters two to a row on tablets
   ("Used in Chaé produ…" was cut off four across). */
@media (min-width: 561px) and (max-width: 960px) {
	.chae-ing-dir__letters { display: grid; grid-template-columns: repeat(14, minmax(0, 1fr)); overflow: visible; }
	.chae .chae-ing-dir__letters a { min-width: 0; }
}
@media (max-width: 560px) {
	.chae-ing-dir__letters { -webkit-mask-image: linear-gradient(to right, #000 82%, transparent); mask-image: linear-gradient(to right, #000 82%, transparent); }
}
@media (min-width: 561px) and (max-width: 1100px) {
	.chae-ing-dir__filters label { flex-basis: calc(50% - 7px); }
}
/* Page numbers (plugin 0.2.2): "← Previous 1 … 4 5 6 … 675 Next →", centered like the Journal's. */
.chae .chae-ing-dir__pages { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin-top: 22px; }
.chae .chae-ing-dir__pages a[rel] { margin: 0; }
.chae-ing-dir__nums { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.chae .chae-ing-dir__page { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 12px; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; color: var(--teal); font-weight: 700; text-decoration: none; }
.chae .chae-ing-dir__page:hover { border-color: var(--teal); }
.chae .chae-ing-dir__page.is-current { border-color: var(--teal); background: var(--teal); color: #fff; }
.chae-ing-dir__gap { color: var(--muted); }
.chae .chae-ing-dir__letters a:hover { border-color: var(--teal); }
.chae .chae-ing-dir__letters a[aria-current="true"] { border-color: var(--teal); background: var(--teal); color: #fff; }
.chae-ing-dir__count { margin: 0 0 10px; color: var(--muted); font-size: 14px; }
.chae-ing-dir__results { transition: opacity 0.15s; }
.chae-ing-dir__results.is-loading { opacity: 0.5; }
.chae-ing-dir__list { margin: 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.chae-ing-result { margin: 0; padding: 14px 4px; border-bottom: 1px solid var(--line); }
.chae-ing-result__name { min-width: 0; color: var(--ink); font-size: 17px; font-weight: 700; overflow-wrap: anywhere; } /* long INCI names ("Candida Bombicola/(Irvingia…") wrap beside the + */
.chae .chae-ing-result.has-page .chae-ing-result__name { color: var(--teal); }
.chae-ing-result__summary { margin: 6px 0 0; color: var(--muted); font-size: 15px; }
.chae-ing-result summary { display: grid; grid-template-columns: 24px minmax(0, 1fr); align-items: center; gap: 6px 10px; cursor: pointer; list-style: none; }
.chae-ing-result summary .chae-ing-badges { grid-column: 2; }
.chae-ing-result summary::-webkit-details-marker { display: none; }
.chae-ing-result summary::before { content: "+"; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--tint); color: var(--teal); font-weight: 800; }
.chae-ing-result details[open] summary::before { content: "–"; }
.chae-ing-badges { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.chae .chae-ing-badge.is-chae { background: #e3f1f5; color: var(--blue-deep); } /* a label, not a button: it was filled teal on every row */
.chae .chae-ing-badge.is-flag { background: #f1f3f2; color: var(--ink); }
.chae-ing-facts { display: grid; grid-template-columns: minmax(130px, max-content) minmax(0, 1fr); gap: 8px 18px; margin: 12px 0 4px 34px; font-size: 14.5px; }
.chae-ing-facts dt { color: var(--muted); font-weight: 700; }
.chae-ing-facts dd { margin: 0; overflow-wrap: anywhere; }
.chae-ing-facts__desc { margin: 8px 0 0 34px; color: var(--muted); font-size: 14px; }
.chae-ing-facts__what { margin: 12px 0 0 34px; font-size: 15.5px; line-height: 1.55; }
.chae-ing-dir__pages { display: flex; justify-content: space-between; gap: 12px; margin-top: 16px; }
.chae .chae-ing-dir__pages a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border: 1.5px solid var(--teal); border-radius: var(--r-btn); color: var(--teal); font-weight: 700; text-decoration: none; }
.chae-ing-dir__credit { margin: 22px 0 0; color: var(--muted); font-size: 13px; }
@media (max-width: 600px) {
	.chae-ing-dir__form { padding: 16px; }
	.chae-ing-facts { grid-template-columns: minmax(0, 1fr); gap: 2px; margin-left: 0; }
	.chae-ing-facts dd { margin-bottom: 8px; }
	.chae-ing-facts__desc, .chae-ing-facts__what { margin-left: 0; }
}

/* ---------------------------------------------------------------------------
 * "Email me my results" under a finder's result (assets/js/finder-email.js) and saved results in My Account
 * ------------------------------------------------------------------------ */
.chae-fe { display: grid; gap: 10px; margin: 16px 0 0; padding: 18px 20px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.chae-fe__title { margin: 0; color: var(--ink); font-family: var(--head); font-size: 18px; font-weight: 700; }
.chae-fe__text { margin: -4px 0 0; color: var(--muted); font-size: 14px; }
.chae-fe__row { display: flex; flex-wrap: wrap; gap: 8px; }
.chae-fe__row input[type="email"] { flex: 1 1 220px; min-height: 46px; }
.chae-fe__row .chae-btn { min-height: 46px; }
.chae-fe__opt { display: flex; align-items: flex-start; gap: 8px; color: var(--ink); font-size: 14px; line-height: 1.4; }
.chae-fe__opt input { flex: none; margin-top: 2px; }
.chae-fe__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.chae-fe__msg { margin: 0; font-size: 14px; font-weight: 600; }
.chae-fe__msg:empty { display: none; }
.chae-fe__msg.is-ok { color: var(--teal); }
.chae-fe__msg.is-error { color: #b3261e; }
.chae-saved-results { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.chae-saved-results a { display: grid; gap: 2px; padding: 14px 18px; border: 1px solid var(--line); border-radius: 14px; background: #fff; color: var(--ink); text-decoration: none; }
.chae-saved-results a:hover { border-color: var(--teal); }
.chae-saved-results strong { font-weight: 700; }
.chae-saved-results span { color: var(--ink); font-size: 14px; }
.chae-saved-results small { color: var(--muted); font-size: 13px; }

/* ---------------------------------------------------------------------------
 * Header pass (2026-09-28): the category bar as clean links — a teal underline for hover and the current category,
 * Sales as a Chaé Blue pill, "Find your routine" as a teal outline pill (inc/nav.php) — instead of bordered boxes.
 * Phones keep their menu panel (the rules below are for 783px and up).
 * ------------------------------------------------------------------------ */
@media (min-width: 783px) {
	.chae-nav__list { align-items: center; gap: 2px; min-height: 54px; }
	.chae-nav__item, .chae-nav__item:last-child { border: 0; }
	.chae-nav__item.is-current, .chae-nav__item:hover { box-shadow: none; }
	.chae-nav__link { position: relative; min-height: 54px; padding: 0 16px; color: var(--ink); font-weight: 600; }
	.chae-nav__link::after { content: ""; position: absolute; right: 16px; bottom: 0; left: 16px; height: 3px; border-radius: 3px 3px 0 0; background: var(--teal); transform: scaleX(0); transition: transform 0.2s ease; }
	.chae-nav__item:hover .chae-nav__link::after, .chae-nav__item.is-current .chae-nav__link::after { transform: scaleX(1); }
	.chae-nav__item.is-current .chae-nav__link { color: var(--teal); }
	.chae-nav__item.is-sale .chae-nav__link { min-height: 34px; margin: 0 6px; padding: 0 14px; border-radius: 999px; background: rgba(0, 142, 175, 0.1); color: var(--blue-deep); font-weight: 700; }
	.chae-nav__item.is-sale:hover .chae-nav__link { background: rgba(0, 142, 175, 0.18); }
	.chae-nav__item.is-finder { margin-left: 14px; }
	.chae-nav__item.is-finder .chae-nav__link { gap: 7px; min-height: 36px; padding: 0 16px; border: 1.5px solid var(--teal); border-radius: 999px; color: var(--teal); font-weight: 700; }
	.chae-nav__item.is-finder:hover .chae-nav__link { background: var(--teal-08); }
	.chae-nav__item.is-sale .chae-nav__link::after, .chae-nav__item.is-finder .chae-nav__link::after { display: none; }
	@media (prefers-reduced-motion: reduce) { .chae-nav__link::after { transition: none; } }
}
@media (min-width: 783px) and (max-width: 1180px) {
	.chae-nav__link { padding: 0 12px; }
	.chae-nav__link::after { right: 12px; left: 12px; }
	.chae-nav__item.is-finder { display: none; } /* not enough room beside eight categories; the homepage links it */
}
/* Nine items since Best sellers joined the bar (2026-10-16): narrow tablets tighten up so Sales isn't cut off. */
@media (min-width: 783px) and (max-width: 960px) {
	.chae-nav__link { padding: 0 8px; font-size: 13.5px; }
	.chae-nav__link::after { right: 8px; left: 8px; }
	.chae-nav__item.is-sale .chae-nav__link { margin: 0 2px; padding: 0 11px; }
}
@media (max-width: 782px) {
	.chae-topbar__offers { height: 34px; }
	.chae-topbar__offer { justify-content: center; gap: 8px; font-size: 12.5px; }
	.chae-nav__item.is-finder .chae-nav__link { color: var(--teal); font-weight: 700; }
	.chae-nav__item.is-finder .chae-nav__link .chae-icon { display: none; }
}
@media (prefers-reduced-motion: reduce) { .chae-topbar__offer { transition: none; } }

/* ---------- 2026-10-13 visual audit, batch 4 ---------- */
/* Notices take focus when they appear (for screen readers); the focus ring drew a second outline around the box. */
.chae :is(.woocommerce-message, .woocommerce-info, .woocommerce-error)[tabindex="-1"]:focus { outline: none; } /* tabindex -1: only the page focuses them, never the keyboard */
/* "Added to your cart" seen on the cart or checkout (the notice is written where the item was added): no "View cart". */
body.woocommerce-cart.chae .woocommerce-message a.wc-forward, body.woocommerce-checkout.chae .woocommerce-message a.wc-forward { display: none !important; } /* outranks .chae .woocommerce a.button */
.chae-sum__later { color: var(--muted); font-size: 14px; font-weight: 500; }
/* Quizzes (routine, oil, body, home finders): answers read as choices, not greyed-out; the Next button waits as an outline
   instead of a faded fill that looked broken; a lone last answer spans the row; less space above, so Next shows sooner. */
.chae-rf { padding: 38px 48px; }
.chae-rf__intro { margin-bottom: 22px; }
.chae .chae-rf__title { font-size: 38px; }
.chae-rf__opt { border-color: rgba(0, 98, 99, 0.22) !important; background: #fff !important; }
.chae-rf__opt:hover { border-color: rgba(0, 98, 99, 0.5) !important; }
.chae-rf__opt:has(input:checked) { border-color: var(--teal) !important; background: #eef7f8 !important; }
.chae-rf__options > .chae-rf__opt:last-child:nth-child(odd) { grid-column: 1 / -1; }
body.chae .chae-rf__next:disabled { opacity: 1; border: 1.5px solid rgba(0, 98, 99, 0.3) !important; background: #fff !important; color: rgba(0, 98, 99, 0.6) !important; }
@media (max-width: 560px) {
	.chae-rf { padding: 24px 18px; }
	.chae-rf__nav .chae-rf__next { flex: 1; justify-content: center; }
}
/* Headings: no single word left alone on the last line. */
.chae :is(h1, h2, h3, .chae-head__title, .chae-sec__title, .chae-card__title, .chae-banner__title) { text-wrap: balance; }
/* Newsletter: the email field the same 48px as every other field on the site (it was 38px). */
.chae-news .gform_wrapper input[type="email"] { min-height: 48px !important; border-radius: 12px !important; font-size: 16px !important; }


/* ---------- home page rhythm (2026-10-14, user after a home page review: "make it all happen") ----------
   The sections no longer all open the same way: most heads are left-aligned with their "see all" link on the right
   (chae_section_head( …, array( 'align' => 'left', 'link' => … ) )), the round dividers between sections are gone, the
   two teal bands run edge to edge, and the spacing is tighter (the page went from 11 desktop screens towards 9). */
.chae-head--left { flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 12px 32px; text-align: left; }
.chae-head--left .chae-head__main { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; min-width: 0; }
.chae-head--left .chae-head__title { font-size: 34px; }
.chae-head--left .chae-head__text { max-width: 640px; }
body.chae .chae-head--left .chae-head__link { flex-shrink: 0; margin-bottom: 4px; white-space: nowrap; }
body.home .chae-main > section + section { margin-top: 28px; }
body.home .chae-main > .chae-band { --band-pad: 44px; margin: 48px 0; }
body.home .chae-section { padding: 48px 0; gap: 30px; }
/* Best sellers on the home page: the product in a scene, filling the tile; the packshot fades in on hover. */
.chae .chae-card__media.is-scene .chae-card__scene { padding: 0; object-fit: cover; }
@media (max-width: 960px) {
	body.home .chae-main > .chae-band { --band-pad: 32px; margin: 36px 0; }
	body.home .chae-section { padding: 40px 0; }
}
@media (max-width: 782px) {
	body.home .chae-section { padding: 36px 0; }
	.chae-head--left { flex-direction: column; align-items: flex-start; gap: 8px; }
	.chae-head--left .chae-head__title { font-size: 28px; }
}
@media (max-width: 560px) {
	body.home .chae-main > section + section { margin-top: 20px; }
	body.home .chae-main > .chae-band { --band-pad: 22px; margin: 28px 0; }
	body.home .chae-section { padding: 28px 0; gap: 22px; }
}

/* ---------- product cards, pass 3 (2026-10-14, user: "are the cards perfect?" → "do all seven, make it quieter") ----------
   Photos (chae_card_img_attr() in inc/woocommerce.php): scenes and styled shots fill the tile (.is-bleed); packshots on
   white are scaled around the product itself (.is-fit, --z/--dx/--dy from the measured product box), so a small tube
   and a wide jar read at the same size. Subscribe & Save is a quiet grey line; long names get a third line on phones. */
.chae .chae-card__media img.is-bleed { padding: 0; object-fit: cover; }
.chae .chae-card__media img.is-fit { padding: 0; transform: scale(var(--z)) translate(var(--dx), var(--dy)); }
@media (hover: hover) {
	.chae-card:hover .chae-card__media:not(.has-alt) img.is-fit:first-child { transform: scale(calc(var(--z) * 1.06)) translate(var(--dx), var(--dy)); }
	.chae-card:hover .chae-card__media.has-alt img.is-fit.chae-card__alt { transform: scale(calc(var(--z) * 1.03)) translate(var(--dx), var(--dy)); }
}
.chae .chae-acc-sec .chae-card__media img.is-fit { padding: 8px; transform: none; }
.chae-card__sub { color: var(--muted-2); font-weight: 400; }
.chae-card__sub .chae-icon { color: var(--teal); opacity: 0.7; }
@media (max-width: 560px) {
	.chae-card__title { -webkit-line-clamp: 3; }
}

/* ---------- product page pass (2026-10-14, user: "do all six" minus the stock wording) ---------- */
/* Title: the short name big, the rest of the name as a quiet line (inc/product-page.php). */
.chae .chae-buy__summary .product_title .chae-title__sub { display: block; margin-top: 10px; color: var(--muted); font-family: var(--body); font-size: 17px; font-weight: 400; letter-spacing: 0; line-height: 1.4; }
/* Key ingredients now sit under the button and perks. */
.chae .chae-buy__summary .chae-keychips { margin-top: 18px; }
/* A set's items: the scent or size under the short name. */
.chae .woosb-name .chae-setitem__var { display: block; margin-top: 2px; color: var(--muted); font-size: 13px; font-weight: 400; line-height: 1.35; }
/* No questions yet: one slim row (title · line · Ask a question) instead of a panel with an empty search box. */
@media (min-width: 783px) {
	.chae .chae-sec--qa-empty .chae-sec__panel { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 28px; padding: 24px 0; }
	.chae .chae-sec--qa-empty .chae-sec__head { margin: 0; }
	.chae .chae-sec--qa-empty .chae-sec__title { font-size: 24px; }
	.chae .chae-sec--qa-empty .chae-sec__body { flex: 1 1 380px; }
	.chae .chae-sec--qa-empty .cr-qna-block { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px 20px; }
	.chae .chae-sec--qa-empty .cr-qna-list-block { order: 1; margin: 0; padding: 0; }
	.chae .chae-sec--qa-empty .cr-qna-list-empty { margin: 0; padding: 0; color: var(--muted); font-size: 15px; text-align: right; }
	.chae .chae-sec--qa-empty .cr-qna-search-block { order: 2; margin: 0; }
	.chae .chae-sec--qa-empty .cr-ajax-qna-search { display: none; }
	.chae .chae-sec--qa-empty .cr-qna-new-q-form { order: 3; flex-basis: 100%; }
}
/* "You may also like" / "Recently viewed": left-aligned like the other section heads, no bar. */
.chae-more h2 { text-align: left; font-size: 34px; }
.chae-more h2::after { content: none; }
@media (max-width: 782px) {
	.chae-more h2 { font-size: 28px; }
	.chae .chae-buy__summary .product_title .chae-title__sub { font-size: 15.5px; margin-top: 6px; }
}
/* Phones: a set item's price goes under its name, so the name gets the row's width (it wrapped to four lines). */
@media (max-width: 560px) {
	.chae .chae-buy__summary .woosb-products .woosb-product { grid-template-columns: 48px minmax(0, 1fr); row-gap: 4px; align-items: start; }
	.chae .chae-buy__summary .woosb-products .woosb-product .woosb-thumb { grid-row: span 2; width: 48px; }
	.chae .chae-buy__summary .woosb-products .woosb-product .woosb-thumb img { width: 48px; height: 48px; }
	.chae .chae-buy__summary .woosb-products .woosb-product .woosb-price { grid-column: 2; text-align: left; }
}
/* Laptops: a tighter buy box, so "Add to cart" sits on the first screen for products with a size or scent to pick
   too (the option row and the purchase cards were the tallest parts). */
@media (min-width: 961px) {
	.chae-crumbs-row { padding-top: 14px; padding-bottom: 14px; }
	.chae-buy { padding-top: 8px; }
	.chae-buy__summary { gap: 10px; }
	.chae .chae-buy__summary .product_title { font-size: 34px; }
	.chae .chae-buy__summary .product_title .chae-title__sub { margin-top: 6px; }
	/* labels in one column, so two options' buttons start at the same place (Fragrance and Size didn't line up) */
	.chae .chae-buy__summary table.variations tbody { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 16px 18px; }
	.chae .chae-buy__summary table.variations tr { display: contents; }
	.chae .chae-buy__summary table.variations tr + tr { margin-top: 0; }
	.chae .chae-buy__summary table.variations th.label { min-width: 64px; margin: 0; }
	.chae .chae-buy__summary table.variations td.value { min-width: 0; }
	.chae .chae-swatch { min-height: 44px; padding: 5px 14px; }
	.chae .chae-plan { padding: 12px 14px; }
	.chae-plan__price { font-size: 20px; }
	.chae-plans__legend { margin-bottom: 8px; }
}

/* ---------- cart & checkout pass (2026-10-14) ---------- */
/* Line names: the short name, then the scent or size on a quiet line (chae_item_name_html() in inc/cart.php). */
.chae .chae-item__var { display: block; margin-top: 2px; color: var(--muted); font-size: 13px; font-weight: 400; line-height: 1.35; }
.chae tr.recurring-totals th { text-align: left; color: var(--blue-deep); font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
/* Finder results: the short name, the scent or size under it (assets/js/routine.js and the other finders). */
.chae-rf-step__var { display: block; margin-top: 2px; color: var(--muted); font-size: 13.5px; line-height: 1.35; }

/* ---------- the bold look (chae_pdp_bold() in config.php; 2026-10-15, user: the product pages are "dull/boring";
   kept: lifestyle band, benefit tiles, ingredient photo cards — the teal stage was removed) ---------- */
/* The lifestyle band: the promise in big type, and a scene photo shown whole (they're square) at full size, running to
   the screen's right edge. */
.chae-promise { display: grid; grid-template-columns: minmax(0, 1fr) min(46vw, 680px); align-items: center; margin: 56px 0 8px; padding-left: max(24px, calc((100% - 1200px) / 2)); background: #eef6f6; }
.chae-promise__main { display: flex; flex-direction: column; justify-content: center; gap: 30px; padding: 52px 64px 52px 0; }
.chae-promise__text { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; }
.chae .chae-promise__title { margin: 0; color: var(--ink); font-size: clamp(40px, 4.2vw, 64px); line-height: 1.08; }
.chae-promise__line { margin: 0; max-width: 540px; color: var(--text); font-size: 18px; line-height: 1.6; }
body.chae .chae-promise__add { min-height: 52px; margin-top: 6px; padding: 0 28px !important; font-size: 16px; }
.chae-promise__photo { position: relative; align-self: stretch; min-height: min(46vw, 680px); margin: 0; overflow: hidden; } /* square, or as tall as the column beside it (cropped to fill) */
.chae-promise__photo img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.chae-promise--text { grid-template-columns: minmax(0, 1fr); padding-right: max(24px, calc((100% - 1200px) / 2)); } /* no scene photo of its own (2026-10-15) */
.chae-promise--text .chae-promise__main { width: 100%; max-width: 1080px; margin: 0 auto; padding-right: 0; }
.chae-promise--text .chae-promise__text { align-items: center; max-width: 820px; margin: 0 auto; text-align: center; } /* centered: a banner, not half a band */

/* The benefit tiles: the short description's bold leads, big, on a teal band (phones; desktop: inside the band, below). */
.chae-promise .chae-promise__benefits { margin-bottom: 0; }
.chae-benefits { margin-bottom: 8px; padding: 56px 0 60px; background: radial-gradient(circle at 88% 12%, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0) 42%), linear-gradient(120deg, var(--blue-deep) 0%, var(--teal) 100%); color: #fff; }
.chae-benefits__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 40px; margin-top: 0; margin-bottom: 0; list-style: none; }
.chae-benefits__list--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.chae-benefits__list--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.chae-benefits__list li { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.chae-benefits__icon { display: flex; align-items: center; justify-content: center; width: 104px; height: 104px; border-radius: 22px; background: #fff; color: var(--teal); box-shadow: 0 10px 24px rgba(0, 30, 32, 0.2); } /* a white card like the homepage category drawings (2026-10-15) */
.chae-benefits__icon .chae-art-icon { width: 88px; height: 88px; }
.chae .chae-benefits__title { margin: 8px 0 0; color: #fff; font-size: 30px; line-height: 1.15; }
.chae-benefits__text { margin: 0; max-width: 340px; color: #d9eef2; font-size: 16.5px; line-height: 1.55; }

/* Desktop: the benefits inside the lifestyle band, under the promise (2026-10-15: the teal strip on its own looked
 * "cheap and boring" there). A drawing on a white card beside each line; in a text-only band, a centered row. */
@media (min-width: 783px) {
	.chae-promise .chae-promise__benefits { margin: 0; padding: 0; background: none; color: var(--text); }
	.chae-promise .chae-benefits__list { grid-template-columns: minmax(0, 1fr); gap: 10px; max-width: 560px; margin: 0; padding: 0; }
	.chae-promise .chae-benefits__list li { display: grid; grid-template-columns: 68px minmax(0, 1fr); column-gap: 18px; row-gap: 2px; align-content: center; padding-top: 10px; border-top: 1px solid rgba(0, 98, 99, 0.12); }
	.chae-promise .chae-benefits__icon { grid-row: span 2; align-self: center; width: 68px; height: 68px; border-radius: 15px; box-shadow: 0 6px 18px rgba(0, 60, 62, 0.1); }
	.chae-promise .chae-benefits__icon .chae-art-icon { width: 58px; height: 58px; }
	.chae .chae-promise .chae-benefits__title { align-self: end; margin: 0; color: var(--ink); font-size: 21px; }
	.chae-promise .chae-benefits__text { align-self: start; max-width: none; color: var(--muted); font-size: 15.5px; line-height: 1.5; }
	.chae .chae-promise .chae-benefits__title:last-child { grid-row: span 2; align-self: center; } /* a benefit with no line under it */
	.chae-promise--text .chae-benefits__list { grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 32px; max-width: none; }
	.chae-promise--text .chae-benefits__list li { display: flex; flex-direction: column; align-items: center; gap: 8px; padding-top: 0; border-top: 0; text-align: center; }
	.chae-promise--text .chae-benefits__icon { width: 96px; height: 96px; border-radius: 20px; }
	.chae-promise--text .chae-benefits__icon .chae-art-icon { width: 82px; height: 82px; }
	.chae .chae-promise--text .chae-benefits__title { align-self: center; margin-top: 8px; }
	.chae-promise--text .chae-benefits__text { align-self: center; max-width: 300px; }
}

/* Key ingredients with a photo (chae_ingredient_photos()): the photo across the top of the card. */
.chae .chae-keycard--photo { gap: 8px; padding: 0 0 20px; overflow: hidden; background: #fff; }
.chae-keycard__photo { display: block; aspect-ratio: 16 / 9; margin-bottom: 8px; background: var(--tint); }
.chae-keycard__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* the key ingredients without a photo, as a short list under the photo cards */
.chae-keycards > .chae-keymore:nth-child(odd) { grid-column: 1 / -1; }
.chae-keymore { padding: 18px 22px 8px; border: 1px solid rgba(0, 98, 99, 0.1); border-radius: 18px; background: var(--tint); }
.chae .chae-keymore__title { margin: 0 0 4px; color: var(--blue-deep); font-family: var(--body); font-size: 12.5px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae-keymore ul { margin: 0; padding: 0; list-style: none; }
.chae-keymore li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; padding: 12px 0 14px; border-top: 1px solid rgba(0, 98, 99, 0.1); }
.chae-keymore li:first-child { border-top: 0; }
.chae-keymore__name { color: var(--ink); font-family: var(--head); font-size: 17px; font-weight: 600; }
.chae-keymore__text { flex-basis: 100%; color: var(--muted); font-size: 14.5px; line-height: 1.55; }
.chae .chae-keymore .chae-keycard__ask { margin: 4px 12px 0 0; }
.chae .chae-keycard--photo > :not(.chae-keycard__photo) { margin-left: 22px; margin-right: 22px; }

@media (max-width: 1100px) {
	.chae-benefits__list--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 782px) {
	.chae-promise { grid-template-columns: minmax(0, 1fr); margin-top: 36px; padding-left: 0; }
	.chae-promise__photo { order: -1; }
	.chae-promise__main { display: contents; }
	.chae-promise__photo { min-height: 0; aspect-ratio: 1; }
	.chae-promise__text, .chae-promise--text .chae-promise__text { gap: 14px; padding: 26px 16px 32px; }
	.chae-promise--text { padding-right: 0; }
	.chae .chae-promise__title { font-size: 34px; }
	.chae-promise__line { font-size: 16px; }
	.chae-benefits { padding: 40px 0 44px; }
	.chae-benefits__list, .chae-benefits__list--2, .chae-benefits__list--4 { grid-template-columns: minmax(0, 1fr); gap: 26px; }
	.chae-benefits__list li { display: grid; grid-template-columns: 76px minmax(0, 1fr); column-gap: 16px; row-gap: 2px; align-items: start; }
	.chae-benefits__icon { grid-row: span 2; width: 76px; height: 76px; border-radius: 16px; }
	.chae-benefits__icon .chae-art-icon { width: 64px; height: 64px; }
	.chae .chae-benefits__title { margin: 2px 0 0; font-size: 23px; }
	.chae-benefits__text { font-size: 15.5px; }
}

/* No icons in cards (2026-10-15): a figure where there's a real number (Idea A), a small index on steps, otherwise
 * just the words (Idea C). */
.chae-stat { display: flex; flex-direction: column; gap: 6px; color: var(--teal); font-family: var(--head); font-size: 38px; font-weight: 700; line-height: 1; letter-spacing: -0.02em; white-space: nowrap; }
.chae-stat small { color: var(--blue-deep); font-family: var(--body); font-size: 11.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.chae-idx { color: var(--blue-deep); font-size: 12.5px; font-weight: 700; letter-spacing: 0.12em; }
/* homepage: the figure (or seal) on top, then the words */
.chae-diff__card { flex-direction: column; gap: 12px; }
.chae-diff__card > img { width: 54px; }
/* Shipping & Returns: four facts, each led by its figure */
.chae-sr-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.chae .chae-sr-facts a { align-items: flex-start; gap: 4px; padding: 22px 22px 20px; text-align: left; }
.chae-sr-facts .chae-stat { margin-bottom: 8px; font-size: 32px; }
/* Why ToxicFree's standard: a teal rule beside each, instead of an icon */
.chae-tf-standard__list li { display: block; padding-left: 14px; border-left: 2px solid var(--teal); }
/* steps: the index above each */
.chae-rw-steps .chae-idx { display: block; margin-bottom: 4px; }
.chae-trk-guide__list li { align-items: baseline; }
/* the thank-you page's account box lost its first (icon) column */
.chae-ty__join { grid-template-columns: minmax(0, 1fr) auto; }
.chae-ty__eta { padding-left: 18px; }
/* a divider with nothing in the middle is one line */
.chae-divider.is-plain .chae-divider__line { background: linear-gradient(90deg, rgba(0, 98, 99, 0) 0%, rgba(0, 98, 99, 0.3) 50%, rgba(0, 98, 99, 0) 100%); }
@media (max-width: 782px) {
	.chae-sr-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.chae-sr-facts li:last-child { grid-column: auto; }
	.chae-sr-facts .chae-stat { font-size: 26px; }
	.chae .chae-sr-facts a { padding: 16px 14px 14px; }
	.chae-stat { font-size: 30px; }
	.chae-ty__join { grid-template-columns: minmax(0, 1fr); }
}

/* ===========================================================================
 * Home page redesign (2026-10-15): photo hero with the sale as an ad, photo categories, a shop-first best-sellers
 * grid, Linda's promise and the team, sets, and the reviews in teal. Full-width bands instead of boxes.
 * ======================================================================== */
.chae-hz { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: 560px; padding-left: var(--edge); background: var(--tint); } /* 600 → 500 ("could be tighter") → 560 ("too tight"), 2026-10-15 */
.chae-hz__text { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 18px; padding: 48px 52px 48px 0; }
.chae-hz__text { container-type: inline-size; }
/* Bold and big, so it outranks every section head (2026-10-15, "should hit harder"), and sized to its column so each
   line ("None of the toxins.", the longer, is 9.2 font-sizes wide) stays whole at any screen width. */
.chae .chae-hz__title { margin: 0; font-size: clamp(34px, 10.6cqi, 64px); font-weight: 700; letter-spacing: -0.03em; line-height: 1.04; }
.chae-hz__title em { font-style: normal; color: var(--teal); }
.chae-hz__lead { margin: 0; max-width: 470px; color: var(--muted); font-size: 17px; line-height: 1.55; }
.chae-hz .chae-actions { align-items: center; gap: 22px; }
.chae-hz__proof { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); font-size: 14.5px; text-decoration: none; }
.chae-hz__ad { position: relative; z-index: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 28px; overflow: hidden; background: #e6eeec; }
.chae-hz__ad::before { content: ""; position: absolute; inset: -60px; z-index: -1; background: var(--chae-ad-bg) center / cover no-repeat; filter: blur(34px) saturate(1.15); opacity: 0.6; }
.chae-hz__frame { position: relative; flex-shrink: 0; overflow: hidden; border-radius: 20px; box-shadow: 0 16px 36px rgba(0, 40, 42, 0.2); }
.chae-hz__photo, .chae-hz__photo img { display: block; }
.chae-hz__photo img { width: 380px; max-width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; }
.chae-hz__tag { align-self: flex-start; margin-bottom: 6px; padding: 5px 12px; border-radius: 999px; background: #b42318; color: #fff; font-size: 12px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; } /* in the card, above the name: on the photo it covered the product */
.chae-hz__card { position: relative; width: min(100%, 580px); display: flex; align-items: center; gap: 24px; padding: 20px 22px; border-radius: 18px; background: rgba(255, 255, 255, 0.96); box-shadow: 0 16px 36px rgba(0, 0, 0, 0.16); }
.chae-hz__info { display: flex; flex: 1; flex-direction: column; gap: 4px; min-width: 0; color: var(--muted); font-size: 14px; }
.chae .chae-hz__name { color: var(--ink); font-family: var(--head); font-size: 22px; font-weight: 600; text-decoration: none; }
.chae-hz__rating { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.chae-hz__buy { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.chae-hz__price { display: flex; align-items: baseline; gap: 8px; }
.chae-hz__price s { color: #5f6d6b; font-size: 16px; }
.chae-hz__price strong { color: var(--teal); font-size: 26px; font-weight: 800; }
body.chae .chae-hz__buy .button { min-height: 50px; padding: 0 26px !important; font-size: 16px; white-space: nowrap; }
.chae-hz__ad.is-photo { padding: 0; }
.chae-hz__ad.is-photo::before { content: none; }
.chae-hz__ad.is-photo .chae-hz__photo { position: absolute; inset: 0; }
.chae-hz__ad.is-photo .chae-hz__photo img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; object-position: 50% 30%; }

.chae-cats { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; margin-top: 6px; }
.chae-cats__tile { position: relative; display: block; height: 470px; overflow: hidden; background: #dfe6e5; color: #fff; text-decoration: none; }
.chae-cats__tile img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
.chae-cats__tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 30, 32, 0) 52%, rgba(0, 30, 32, 0.6) 100%); }
.chae-cats__tile:hover img { transform: scale(1.04); }
/* A tile photo with its products small in the middle (config 'fit', front-page.php): sized by the tile's WIDTH (--fit x
   the tile), so the product row spans most of the tile at every width, and never narrower than covers the tile's height
   (2:3 photo: 2/3 of the height). Centered both ways. */
.chae-cats__tile.is-fit { container-type: size; }
.chae .chae-cats__tile.is-fit img { position: absolute; top: 50%; left: 50%; width: max(calc(var(--fit) * 100cqw), 66.67cqh); max-width: none; height: auto; transform: translate(-50%, -50%); }
.chae-cats__tile.is-fit:hover img { transform: translate(-50%, -50%) scale(1.04); }
.chae-cats__label { position: absolute; right: 14px; bottom: 18px; left: 18px; z-index: 2; color: #fff; font-family: var(--head); font-size: 22px; font-weight: 500; line-height: 1.15; }
.chae-cats__label small { display: block; margin-top: 4px; font-family: var(--body); font-size: 13px; font-weight: 500; opacity: 0.92; }

.chae-hshop { padding: 64px 0 70px; background: #fff; }
.chae-hshop .chae-head { margin-bottom: 18px; }
.chae-pills { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 28px; padding: 0; list-style: none; }
.chae .chae-pills a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 18px; border: 1.5px solid var(--line); border-radius: 999px; color: var(--ink); font-size: 14.5px; font-weight: 600; text-decoration: none; }
.chae .chae-pills a:hover { border-color: var(--teal); color: var(--teal); }
.chae .chae-pills a.is-on { border-color: var(--teal); background: var(--teal); color: #fff; } /* teal like every other chosen pill (was black) */




.chae-voices { padding: 80px 0; background: var(--teal); color: #d9eef2; }
.chae .chae-voices__title { margin: 8px 0 34px; color: #fff; font-size: clamp(32px, 3vw, 42px); }
.chae-voices__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.chae-voices__item { margin: 0; padding: 0 36px; border-left: 1px solid rgba(255, 255, 255, 0.22); }
.chae-voices__item:first-child { padding-left: 0; border-left: 0; }
.chae-voices__item .chae-stars { color: #9fdcd6; }
.chae-voices__item blockquote { margin: 14px 0 16px; color: #fff; font-family: var(--head); font-size: 20px; line-height: 1.5; }
.chae-voices__item figcaption { color: #fff; font-weight: 700; }
body.chae .chae-voices__more { margin-top: 0; border-color: #fff !important; background: #fff !important; color: var(--teal) !important; }

/* (Product cards keep the outline button, filling teal on hover: a solid one on every card looked "weird", 2026-10-15.) */

@media (max-width: 1100px) {
	.chae-cats__tile { height: 380px; }
	.chae-cats__label { font-size: 18px; }
	.chae-hz__card { flex-direction: column; align-items: stretch; gap: 14px; }
	.chae-hz__buy { flex-direction: row; align-items: center; justify-content: space-between; }
}
@media (max-width: 782px) {
	.chae-hz { grid-template-columns: minmax(0, 1fr); min-height: 0; padding-left: 0; }
	.chae-hz__text { gap: 16px; padding: 30px 16px 28px; }
	.chae-hz__lead { font-size: 16px; }
	.chae-hz__ad { padding: 16px 16px 20px; }
	.chae-hz__frame { width: 100%; }
	.chae-hz__photo img { width: 100%; }
	.chae-hz__card { width: 100%; padding: 16px; }
	.chae-hz__ad.is-photo .chae-hz__photo { position: static; aspect-ratio: 1; }
	.chae .chae-hz__name { font-size: 19px; }
	.chae-cats { display: flex; gap: 8px; margin-top: 8px; padding: 0 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
	.chae-cats::-webkit-scrollbar { display: none; }
	.chae-cats__tile { flex: 0 0 62vw; height: 330px; border-radius: 16px; scroll-snap-align: start; }
	.chae-hshop { padding: 40px 0 44px; }
	.chae-pills { flex-wrap: nowrap; margin-right: -16px; padding-right: 16px; overflow-x: auto; scrollbar-width: none; }
	.chae-pills::-webkit-scrollbar { display: none; }
	.chae .chae-pills a { white-space: nowrap; }
	.chae-voices { padding: 48px 0; }
	.chae-voices__list { grid-template-columns: minmax(0, 1fr); gap: 26px; }
	.chae-voices__item { padding: 22px 0 0; border-top: 1px solid rgba(255, 255, 255, 0.22); border-left: 0; }
	.chae-voices__item:first-child { padding-top: 0; border-top: 0; }
	.chae-voices__item blockquote { font-size: 18px; }
}

/* ===========================================================================
 * Product page redesign (2026-10-15): bigger gallery with two more photos, a calmer buy box (category label, tagline
 * in teal, stacked purchase options, plain perks, real seals), "Why it works", editorial reviews, a creator's routine,
 * numbered how-to steps, the team band and "You may also like".
 * ======================================================================== */
.chae-buy { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 56px; }
.chae-galmore { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.chae .chae-galmore__item { display: block; padding: 0; overflow: hidden; border: 0; border-radius: 20px; background: var(--tint); cursor: zoom-in; }
.chae-galmore__item img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; transition: transform 0.4s ease; }
.chae-galmore__item:hover img { transform: scale(1.03); }
.chae .chae-galmore__item { position: relative; }
.chae-galmore__more { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; background: rgba(0, 40, 42, 0.55); color: #fff; font-size: 15px; font-weight: 600; transition: background 0.2s ease; }
.chae-galmore__more strong { font-family: var(--head); font-size: 36px; font-weight: 600; line-height: 1; }
.chae-galmore__item.has-more:hover .chae-galmore__more { background: rgba(0, 40, 42, 0.68); }
@media (min-width: 783px) {
	.chae-buy__gallery:has(.chae-galmore) .flex-control-thumbs { display: none !important; }
}
.chae-buy__eyebrow { display: block; margin-bottom: -6px; }
.chae .chae-buy__summary .chae-lead { color: var(--teal); font-family: var(--head); font-size: 20px; font-weight: 500; line-height: 1.35; }
/* purchase options: stacked rows in one group */
.chae .chae-plans .wcsatt-options-prompt-radios { grid-template-columns: minmax(0, 1fr); gap: 0; overflow: hidden; border: 1.5px solid var(--line); border-radius: 16px; }
.chae .chae-plans .wcsatt-options-prompt-radio + .wcsatt-options-prompt-radio { border-top: 1.5px solid var(--line); }
.chae .chae-plans .chae-plan { grid-template-columns: 18px auto minmax(0, 1fr) auto; height: auto; padding: 12px 16px; border: 0 !important; border-radius: 0; box-shadow: none !important; }
/* one line each (2026-10-16, "Add to cart on the first screen"): the name, the Save pill beside it, the price at the end;
   "Buy it once" / "Save $1.94 on every delivery" only said the obvious (the note stays when it explains a sale price) */
.chae .chae-plans .chae-plan__name { grid-column: 2; grid-row: 1; }
.chae .chae-plans .chae-plan__badge { position: static; grid-column: 3; grid-row: 1; justify-self: start; }
.chae .chae-plans .chae-plan__price { grid-column: 4; grid-row: 1; justify-self: end; font-size: 19px; }
.chae .chae-plans .chae-plan__note { display: none; grid-column: 2 / -1; grid-row: 2; }
.chae .chae-plans .chae-plan--sub:not(:has(.chae-plan__badge)) .chae-plan__note { display: block; }
.chae-plans__legend { margin-bottom: 8px; }
/* perks as plain lines */
.chae-perks .chae-line-icon, .chae-perks > li > svg { display: none; }
.chae .chae-buy__summary .chae-perks { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 10px 28px; padding: 16px 18px; border-radius: 16px; background: var(--tint); font-size: 14px; line-height: 1.4; } /* one small tinted box, two to a row (2026-10-16; was five ruled lines) */
.chae .chae-buy__summary .chae-perks li { display: block; min-width: 0; }
.chae .chae-buy__summary .chae-perks li > span { display: inline; }
.chae .chae-buy__summary .chae-perks li strong { color: var(--teal); }
.chae .chae-buy__summary .chae-perks .chae-perks__dot { display: inline-block; margin: 0 8px 0 3px; vertical-align: 1px; }
.chae .chae-buy__summary .chae-perks [hidden] { display: none; }
@media (max-width: 600px) {
	.chae .chae-buy__summary .chae-perks { grid-template-columns: minmax(0, 1fr); gap: 8px; } /* phones: one line each */
}
.chae .chae-buy__summary .chae-perks [data-chae-instock][hidden] + .chae-perks__arrive .chae-perks__sep { display: none; } /* low stock: just "Arrives …" */
/* the seals line */
.chae .chae-trust.chae-trust--seals { display: flex; align-items: center; gap: 12px; padding-top: 4px; border-top: 0; color: var(--muted); font-size: 13px; line-height: 1.5; } /* one short line under the perks box (2026-10-16: no seal images) */
.chae-trust--seals img { flex-shrink: 0; width: 42px; height: auto; }
.chae-pick__tray .chae-trust--seals img { width: 32px; }
/* the set offer, flatter */
.chae .chae-buy__summary .chae-setcard { border: 0; background: var(--tint); }

/* Why it works */
.chae-why { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 56px; padding-top: 56px; padding-bottom: 56px; } /* in the column (2026-10-16: no full-width splits) */
.chae-why__photo { margin: 0; overflow: hidden; border-radius: var(--pdp-r, 20px); }
.chae .chae-why__photo img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; object-position: 50% 30%; }
.chae-why__text { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 16px; }
.chae .chae-why__title { margin: 0; font-size: 34px; line-height: 1.18; }
.chae-why__line { margin: 0; max-width: 560px; color: var(--muted); font-size: 17px; line-height: 1.6; }
.chae-why__list { width: 100%; max-width: 580px; margin: 8px 0 0; padding: 0; list-style: none; }
.chae-why__list li { display: grid; grid-template-columns: 60px minmax(0, 1fr); padding: 16px 0; border-top: 1px solid #cfe2e1; }
.chae-why__n { grid-row: span 2; color: var(--teal); font-family: var(--head); font-size: 24px; font-weight: 700; }
.chae-why__list strong { color: var(--ink); font-family: var(--head); font-size: 20px; font-weight: 500; line-height: 1.3; }
.chae-why__list li > span:last-child:not(.chae-why__n) { color: var(--muted); font-size: 15px; }
body.chae .chae-why__add { margin-top: 6px; }
.chae-why--text { grid-template-columns: minmax(0, 1fr); }
.chae-why--text .chae-why__text { align-items: center; max-width: 900px; margin: 0 auto; padding: 56px 24px; text-align: center; }
.chae-why--text .chae-why__list { text-align: left; }
.chae-why--right .chae-why__photo { order: 2; } /* "What's inside" (2026-10-16): the photo on the other side from "Why it works" above it */
.chae-pinside { padding-top: 24px; } /* not .chae-inside: that's the cart's "What's inside" dropdown */
.chae .chae-pinside__ask { display: inline; margin: 0 0 0 4px; padding: 0; border: 0; background: none; color: var(--teal); font: inherit; font-weight: 700; white-space: nowrap; cursor: pointer; }
.chae .chae-pinside__ask:hover { color: var(--teal-dark, #004f50); text-decoration: underline; text-underline-offset: 3px; }
.chae-pinside__all { margin-top: 2px; }
.chae-pinside__without { margin: 2px 0 0; color: var(--muted); font-size: 15px; }
.chae-pinside__without strong { color: var(--ink); font-weight: 700; }
/* The full ingredient list (on a product with "What's inside", 2026-10-16): the list is the section, no title box */
.chae-ingredients-grid--list .chae-fulllist { padding: 22px 24px; border-radius: 20px; }
.chae-ingredients-grid--list .chae-fulllist__body { max-height: 180px; font-size: 15px; line-height: 1.7; }

/* reviews (2026-10-16, user: "could be better"): one row with the score, the five bars and Write a review (the photo
   reward under it), then the quotes as tinted cards side by side, long ones cut to six lines with "Read more"
   (assets/js/product.js). The score column used to stop halfway down beside a long list of big quotes. */
.chae-product .chae-reviews-top { display: flex; flex-direction: column; align-items: stretch; gap: 28px; }
.chae-product .chae-rsum { display: flex; flex-flow: row wrap; align-items: center; gap: 20px 56px; padding: 0; border: 0; background: none; box-shadow: none; }
.chae-rsum__score { display: grid; grid-template-columns: auto auto; align-items: center; gap: 4px 18px; }
.chae .chae-product .chae-rsum__avg { grid-row: 1 / span 2; color: var(--teal); font-size: 76px; line-height: 1; letter-spacing: -0.03em; }
.chae-rsum__score .chae-stars { align-self: end; }
.chae-rsum__score .chae-rsum__n { align-self: start; max-width: 230px; }
.chae-rsum__bars { display: flex; flex: 0 1 340px; flex-direction: column; gap: 6px; }
.chae-rsum__cta { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; margin-left: auto; }
.chae-rsum__note { max-width: 330px; margin: 0; color: var(--muted); font-size: 13.5px; line-height: 1.45; text-align: right; }
.chae-product .chae-kitrev__items { flex: 0 1 380px; margin: 0; padding: 0; border: 0; }
.chae .chae-product .chae-rcards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.chae .chae-product .chae-rcards .chae-rcard { display: flex; gap: 12px; padding: 24px; border: 0; background: var(--tint); box-shadow: none; }
.chae .chae-product .chae-rcard__text { display: -webkit-box; flex-grow: 0; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 6; color: var(--ink); font-family: var(--head); font-size: 17px; line-height: 1.6; }
.chae .chae-product .chae-rcard.is-open .chae-rcard__text { display: block; -webkit-line-clamp: unset; }
.chae .chae-rcard__more { align-self: flex-start; min-height: 0; margin: -4px 0 0; padding: 2px 0; border: 0; background: none; color: var(--teal); font: 700 14px/1.4 var(--body); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.chae .chae-rcard__more[hidden] { display: none; }
.chae-product .chae-rcards:focus-visible { outline: 3px solid rgba(0, 142, 175, 0.45); outline-offset: 2px; }
.chae-product .chae-rcard__by { margin-top: auto; padding-top: 4px; }

/* a creator's routine */
.chae-routine { display: grid; grid-template-columns: 400px minmax(0, 1fr); gap: 64px; align-items: center; padding-top: 40px; padding-bottom: 40px; }
.chae .chae-routine__video { display: block; margin: 0; padding: 0; list-style: none; }
.chae .chae-routine__video .chae-creators__item { width: 100%; max-width: none; }
.chae-routine__text { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.chae .chae-routine__title { margin: 0; font-size: 34px; }
.chae-routine__about { margin: 0; color: var(--muted); font-size: 16.5px; }
.chae-routine__list { width: 100%; margin: 10px 0 8px; padding: 0; list-style: none; }
.chae-routine__item { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto auto; align-items: center; gap: 18px; padding: 14px 0; border-top: 1px solid var(--line); }
.chae-routine__img { display: block; width: 72px; height: 72px; border-radius: 12px; background: var(--tint); }
.chae-routine__img img { display: block; width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.chae-routine__name { display: flex; flex-direction: column; gap: 2px; }
.chae .chae-routine__name a { color: var(--ink); font-family: var(--head); font-size: 17px; font-weight: 600; text-decoration: none; }
.chae-routine__name small { color: var(--teal); font-size: 12.5px; font-weight: 700; }
.chae-routine__price { color: var(--ink); font-weight: 700; }
body.chae .chae-routine__add .button { min-height: 40px; padding: 0 18px !important; font-size: 14px; }

/* how to use: numbered steps on the page */
.chae-sec--how .chae-sec__panel { padding: 44px 0 48px; border-radius: 0; background: none; }
.chae-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; margin: 6px 0 0; padding: 0; list-style: none; }
.chae-steps--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.chae-steps--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.chae-steps--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 28px; }
.chae-steps li { padding-top: 18px; border-top: 2px solid var(--teal); }
.chae-steps__n { display: block; margin-bottom: 8px; color: var(--teal); font-family: var(--head); font-size: 28px; font-weight: 700; }
.chae-steps p { margin: 0; color: var(--text); font-size: 16px; line-height: 1.6; }

/* the team: a story section on the tint, the photo filling the right half */
.chae-pmade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 56px; padding-top: 56px; padding-bottom: 56px; color: var(--text); } /* in the column (2026-10-16: no full-width splits) */
.chae-pmade__text { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 20px; }
.chae-pmade__text > p { max-width: 520px; margin: 0; color: var(--muted); font-size: 16.5px; line-height: 1.65; }
.chae .chae-pmade__title { margin: -10px 0 0; color: var(--ink); font-size: 34px; line-height: 1.18; } /* the label sits close to its title */
.chae .chae-pmade__photo { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; object-position: 50% 30%; border-radius: var(--pdp-r, 20px); }

/* you may also like */
.chae-also { padding-top: 40px; padding-bottom: 20px; }
.chae-also .chae-head { margin-bottom: 22px; }

@media (max-width: 1100px) {
	.chae-buy { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; }
	.chae-routine { grid-template-columns: 320px minmax(0, 1fr); gap: 40px; }
	.chae-steps--4, .chae-steps--5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 782px) {
	.chae-buy { grid-template-columns: minmax(0, 1fr); }
	.chae-galmore { display: none; }
	.chae .chae-buy__summary .chae-lead { font-size: 18px; }
	.chae-why, .chae-pmade { grid-template-columns: minmax(0, 1fr); gap: 20px; padding-top: 32px; padding-bottom: 32px; }
	.chae-why__text, .chae-pmade__text { gap: 16px; }
	.chae .chae-why__title, .chae .chae-routine__title, .chae .chae-pmade__title { font-size: 28px; }
	.chae-why__list strong { font-size: 18px; }
	.chae .chae-pmade__photo { order: -1; } /* photo first, as in the other story sections */
	.chae-why--right .chae-why__photo { order: 0; }
	.chae-pinside { padding-top: 8px; }
	.chae-product .chae-reviews-top { gap: 24px; }
	.chae-product .chae-rsum { flex-direction: column; align-items: stretch; gap: 18px; }
	.chae .chae-product .chae-rsum__avg { font-size: 64px; }
	.chae-rsum__bars, .chae-product .chae-kitrev__items { flex: 0 0 auto; }
	.chae-rsum__cta { align-items: stretch; margin-left: 0; }
	.chae-rsum__cta .chae-btn { justify-content: center; }
	.chae-rsum__note { max-width: none; text-align: center; }
	/* the cards swipe sideways, as on the home page */
	.chae .chae-product .chae-rcards { display: flex; margin: 0 -16px; padding: 0 16px 6px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 16px; scrollbar-width: none; }
	.chae-product .chae-rcards::-webkit-scrollbar { display: none; }
	.chae .chae-product .chae-rcards .chae-rcard { flex: 0 0 min(84%, 340px); scroll-snap-align: start; }
	.chae .chae-product .chae-rcard__text { font-size: 16px; }
	.chae-routine { grid-template-columns: minmax(0, 1fr); gap: 22px; padding-top: 20px; padding-bottom: 20px; }
	.chae .chae-routine__video .chae-creators__item { max-width: 320px; }
	.chae-routine__item { grid-template-columns: 56px minmax(0, 1fr) auto; gap: 12px; }
	.chae-routine__img { width: 56px; height: 56px; }
	.chae-routine__price { display: none; }
	.chae-steps, .chae-steps--2, .chae-steps--4, .chae-steps--5 { grid-template-columns: minmax(0, 1fr); gap: 18px; }
}

/* The photo viewer (2026-10-15; replaced WooCommerce's black PhotoSwipe): light, on brand, with the product beside it. */
html.chae-viewer-open { overflow: hidden; }
.chae-viewer { position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 0; border: 0; background: #eef3f2; color: var(--ink); }
.chae-viewer[open] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; animation: chae-viewer-in 0.22s ease; }
.chae-viewer::backdrop { background: rgba(0, 40, 42, 0.35); }
@keyframes chae-viewer-in { from { opacity: 0; transform: scale(0.985); } to { opacity: 1; transform: none; } }
.chae-viewer__top { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 28px; }
.chae-viewer__title { display: flex; align-items: baseline; gap: 14px; min-width: 0; margin: 0; }
.chae-viewer__title strong { overflow: hidden; color: var(--ink); font-family: var(--head); font-size: 20px; font-weight: 600; white-space: nowrap; text-overflow: ellipsis; }
.chae-viewer__title span { flex-shrink: 0; color: var(--muted); font-size: 14px; }
.chae .chae-viewer__close { display: flex; flex-shrink: 0; align-items: center; justify-content: center; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 50%; background: #fff; color: var(--teal); box-shadow: 0 6px 18px rgba(0, 50, 52, 0.14); cursor: pointer; }
.chae .chae-viewer__close:hover { background: var(--teal); color: #fff; }
.chae-viewer__main { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 24px; min-height: 0; padding: 0 28px; }
.chae-viewer__stage { position: relative; min-height: 0; overflow: hidden; border-radius: 24px; background: #fff; box-shadow: 0 10px 30px rgba(0, 50, 52, 0.08); }
.chae-viewer__track { display: flex; height: 100%; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior: contain; }
.chae-viewer__track::-webkit-scrollbar { display: none; }
.chae-viewer__track.is-zoomed { overflow: hidden; }
.chae-viewer__slide { display: flex; flex: 0 0 100%; align-items: center; justify-content: center; margin: 0; padding: 28px; overflow: hidden; scroll-snap-align: center; }
.chae-viewer__slide img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 14px; transition: transform 0.25s ease; }
@media (hover: hover) and (pointer: fine) {
	.chae-viewer__slide img { cursor: zoom-in; }
	.chae-viewer__slide.is-zoomed img { transform: scale(2.2); cursor: zoom-out; }
}
.chae .chae-viewer__nav { position: absolute; top: 50%; display: flex; align-items: center; justify-content: center; width: 54px; height: 54px; padding: 0; border: 0; border-radius: 50%; background: #fff; color: var(--teal); box-shadow: 0 8px 22px rgba(0, 50, 52, 0.16); transform: translateY(-50%); cursor: pointer; transition: opacity 0.2s ease, background 0.2s ease; }
.chae .chae-viewer__nav:hover:not(:disabled) { background: var(--teal); color: #fff; }
.chae .chae-viewer__nav:disabled { opacity: 0; pointer-events: none; }
.chae-viewer__nav.is-prev { left: 18px; }
.chae-viewer__nav.is-prev svg { transform: rotate(180deg); }
.chae-viewer__nav.is-next { right: 18px; }
.chae-viewer__side { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 12px; padding: 32px; border-radius: 24px; background: #fff; box-shadow: 0 10px 30px rgba(0, 50, 52, 0.08); }
.chae-viewer__name { margin: 0; color: var(--ink); font-family: var(--head); font-size: 26px; font-weight: 500; line-height: 1.2; }
.chae-viewer__rating { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; color: var(--muted); font-size: 14px; }
.chae-viewer__rating > * + .chae-sold::before { content: "·"; margin-right: 8px; }
.chae .chae-viewer__price { margin: 4px 0; color: var(--ink); font-size: 26px; font-weight: 800; }
.chae .chae-viewer__price del { margin-right: 6px; color: #5f6d6b; font-size: 17px; font-weight: 400; }
.chae .chae-viewer__price ins { text-decoration: none; }
body.chae .chae-viewer__add { width: 100%; min-height: 54px; justify-content: center; font-size: 16px; }
.chae-viewer__seals { display: flex; align-items: center; gap: 8px; margin: 8px 0 0; color: var(--muted); font-size: 12.5px; line-height: 1.4; }
.chae-viewer__seals img { flex-shrink: 0; width: 34px; height: auto; }
.chae-viewer__thumbs { display: flex; justify-content: center; gap: 10px; padding: 16px 28px 22px; overflow-x: auto; scrollbar-width: none; }
.chae-viewer__thumbs::-webkit-scrollbar { display: none; }
.chae .chae-viewer__thumb { flex: 0 0 auto; width: 68px; height: 68px; padding: 0; overflow: hidden; border: 2px solid transparent; border-radius: 14px; background: #fff; opacity: 0.7; cursor: pointer; transition: opacity 0.2s ease, border-color 0.2s ease; }
.chae .chae-viewer__thumb:hover { opacity: 1; }
.chae .chae-viewer__thumb.is-on { border-color: var(--teal); opacity: 1; }
.chae-viewer__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.chae-viewer.is-single .chae-viewer__nav, .chae-viewer.is-single .chae-viewer__thumbs { display: none; }
@media (prefers-reduced-motion: reduce) {
	.chae-viewer[open] { animation: none; }
	.chae-viewer__slide img { transition: none; }
}
@media (max-width: 960px) {
	.chae-viewer__main { grid-template-columns: minmax(0, 1fr) 280px; gap: 16px; padding: 0 16px; }
	.chae-viewer__side { padding: 24px; }
	.chae-viewer__name { font-size: 22px; }
}
@media (max-width: 782px) {
	.chae-viewer { background: #fff; grid-template-rows: auto minmax(0, 1fr) auto auto; }
	.chae-viewer__top { padding: 10px 12px 6px 16px; }
	.chae-viewer__title { flex-direction: column; gap: 0; }
	.chae-viewer__title strong { font-size: 16px; }
	.chae-viewer__title span { font-size: 12.5px; }
	.chae .chae-viewer__close { width: 44px; height: 44px; box-shadow: none; background: #f1f5f4; }
	.chae-viewer__main { display: contents; }
	.chae-viewer__stage { grid-row: 2; border-radius: 0; box-shadow: none; }
	.chae-viewer__slide { padding: 8px 0; }
	.chae-viewer__slide img { border-radius: 0; }
	.chae-viewer__nav { display: none !important; }
	.chae-viewer__thumbs { grid-row: 3; justify-content: flex-start; gap: 8px; padding: 10px 16px; }
	.chae .chae-viewer__thumb { width: 54px; height: 54px; border-radius: 12px; }
	.chae-viewer__side { grid-row: 4; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2px 14px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); border-radius: 0; box-shadow: none; }
	.chae-viewer__side .chae-eyebrow, .chae-viewer__seals, .chae-viewer__name { display: none; }
	.chae-viewer__rating { grid-column: 1 / -1; gap: 6px; margin-bottom: 6px; font-size: 13px; } /* stars, reviews and sold stay: proof beside the button */
	.chae .chae-viewer__price { display: none; } /* the button says the price */
	body.chae .chae-viewer__add { grid-column: 1 / -1; width: 100%; min-height: 50px; }
}
.chae .chae-perks li[hidden] { display: none; }

/* Home page reviews (2026-10-15, "boring" → shoppable cards): the lead quote by the head, then real reviews with their
   product, price and Add to cart in a sideways row. */
.chae-voices__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); align-items: end; gap: 48px; margin-bottom: 34px; }
.chae .chae-voices__head .chae-voices__title { margin: 8px 0 0; }
.chae-voices__lead { margin: 0; padding-left: 24px; border-left: 3px solid #9fdcd6; }
.chae-voices__lead blockquote { margin: 0 0 8px; color: #fff; font-family: var(--head); font-size: 19px; line-height: 1.5; }
.chae-voices__lead figcaption { color: #bfe3e2; font-size: 14px; font-weight: 700; }
.chae-vrow { position: relative; }
.chae-vrow__list { position: relative; display: flex; gap: 24px; margin: 0; padding: 0 0 6px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; list-style: none; }
.chae-vrow__list::-webkit-scrollbar { display: none; }
.chae .chae-vrow__list { content-visibility: visible !important; } /* FlyingPress's lazy render (an inline content-visibility: auto) hid its overflow from the arrows */
.chae-vcard { display: flex; flex: 0 0 calc((100% - 48px) / 3); flex-direction: column; overflow: hidden; border-radius: 20px; background: #fff; color: var(--text); scroll-snap-align: start; } /* three at a time (2026-10-15, user: "maybe 3 cards here"; was four) */
.chae-vcard__body { display: flex; flex: 1; flex-direction: column; gap: 14px; padding: 26px 26px 0; }
.chae-vcard__body blockquote { display: -webkit-box; margin: 0; overflow: hidden; color: var(--ink); font-family: var(--head); font-size: 19px; line-height: 1.5; -webkit-line-clamp: 7; -webkit-box-orient: vertical; } /* the words are the card now */
.chae-vcard__by { margin: auto 0 0; padding-top: 4px; color: var(--muted); font-size: 13px; }
.chae-vcard__by strong { color: var(--ink); }
.chae-vcard__shop { display: grid; grid-template-columns: 56px minmax(0, 1fr); align-content: start; align-items: center; gap: 2px 14px; min-height: 150px; margin-top: 18px; padding: 16px 20px; border-top: 1px solid var(--line); } /* one height on every card (a price range takes two lines), so the rows line up */
.chae-vcard__thumb { grid-row: 1 / span 2; display: block; width: 56px; height: 56px; overflow: hidden; border-radius: 12px; background: var(--tint); }
.chae .chae-vcard__thumb img { display: block; width: 100%; height: 100%; object-fit: contain; }
.chae .chae-vcard__name { color: var(--ink); font-size: 14.5px; font-weight: 700; line-height: 1.3; text-decoration: none; }
.chae .chae-vcard__price { grid-column: 2; color: var(--muted); font-size: 14px; }
.chae .chae-vcard__price del { margin-right: 4px; }
.chae .chae-vcard__price ins { color: var(--teal); font-weight: 700; text-decoration: none; }
body.chae .chae-vcard__shop .button { grid-column: 1 / -1; grid-row: auto; width: 100%; min-height: 40px; margin-top: 10px; padding: 0 16px !important; font-size: 14px; } /* its own line at every width: beside the name it covered it on tablets and broke the price on desktop (2026-10-17 sweep) */
@media (min-width: 783px) and (max-width: 1180px) {
	.chae-vcard { flex-basis: calc((100% - 24px) / 2); } /* two at a time: three left 240px cards on an iPad */
}
.chae-vrow__foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 32px; }
.chae-vrow__arrows { display: flex; gap: 10px; }
.chae .chae-vrow__nav { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; padding: 0; border: 1.5px solid rgba(255, 255, 255, 0.5); border-radius: 50%; background: none; color: #fff; cursor: pointer; transition: background 0.15s ease, color 0.15s ease, opacity 0.15s ease; } /* under the cards, not on them (2026-10-15) */
.chae .chae-vrow__nav:disabled { opacity: 0.35; cursor: default; }
.chae-vrow__nav.is-prev svg { transform: rotate(180deg); }
@media (max-width: 782px) {
	.chae-voices__head { grid-template-columns: minmax(0, 1fr); gap: 18px; margin-bottom: 22px; }
	.chae-voices__lead blockquote { font-size: 17px; }
	.chae-vrow__list { margin-right: -16px; padding-right: 16px; }
	.chae-vcard { flex-basis: 78%; }
	.chae .chae-vrow__arrows { display: none; } /* swipe on phones; the next card peeks in */
	.chae-vcard__body { gap: 12px; padding: 22px 20px 0; }
	.chae-vcard__body blockquote { font-size: 17px; }
	.chae-vcard__shop { grid-template-columns: 48px minmax(0, 1fr); padding: 14px 16px 16px; }
	.chae-vcard__thumb { width: 48px; height: 48px; }
}
/* "2,600+ sold" (chae_pdp_sold_html) on product cards, the home sale ad and the review cards (2026-10-15) */
.chae-card__rating .chae-sold, .chae-hz__rating .chae-sold, .chae-vcard__price .chae-sold { color: var(--muted); white-space: nowrap; }
.chae-card__rating > * + .chae-sold::before, .chae-hz__rating > * + .chae-sold::before, .chae-vcard__price > * + .chae-sold::before { content: "·"; margin: 0 6px; }
.chae-card__rating--sold { font-size: 13px; }
.chae-vcard__price .chae-sold { font-size: 13px; }
/* Home page rhythm (2026-10-15 review): full-width bands meet edge to edge (28px white strips between them looked like
   seams); the boxed sections keep their gap. */
body.home .chae-main > :is(.chae-hshop, .chae-voices) { margin-top: 0; }
body.home .chae-main > :is(.chae-hshop, .chae-voices) + section { margin-top: 0; }
.chae-hshop { padding-bottom: 40px; }

/* One rhythm for every home page section (2026-10-15, user: "section sizes are all over the place"; the white space
   between sections measured 48–207px): no margins between them, and the same padding inside each, 64px (40px on
   phones). Bands with a background carry it inside their color. */
body.home { --home-pad: 64px; }
body.home .chae-main > section, body.home .chae-main > .chae-band, body.home .chae-main > section + section { margin-top: 0; margin-bottom: 0; }
body.home .chae-section { padding: var(--home-pad) 0; }
body.home .chae-hshop { padding: var(--home-pad) 0; }
body.home .chae-creators--home { padding-top: var(--home-pad); padding-bottom: var(--home-pad); }
body.home .chae-quizband { padding-top: var(--home-pad); padding-bottom: var(--home-pad); }
body.home .chae-voices { padding: var(--home-pad) 0; }
@media (max-width: 782px) {
	body.home { --home-pad: 40px; }
}

/* Hover states (2026-10-15 sweep of every link and button, user: "the hover effect on this link is bad"). White links on
   the teal bands turned dark teal (.chae a:hover) and all but vanished: they stay white and underline instead. */
.chae .chae-footer__bar a:hover { color: #cfe8e8; text-decoration-thickness: 2px; }
/* White buttons on teal: a light tint and the press. */
body.chae .chae-voices__more:hover { background: #e3f1f1 !important; }
body.chae .chae-setlist__cta:hover .chae-btn { transform: translate(0, 3px); box-shadow: 0 0 0 var(--btn-edge); } /* the whole bar is the link */
/* Product names that are links. */
.chae .chae-setlist__text a:hover, .chae .chae-routine__name a:hover { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
.chae .chae-rcard__about a:hover, .chae .chae-screened__text a:hover, .chae .chae-faq__answer a:hover, .chae .chae-contact__way a.chae-contact__map:hover { color: var(--teal-press); text-decoration-thickness: 2px; }
.chae .chae-rcard__about a:hover { text-decoration: underline; text-underline-offset: 3px; }
.chae .chae-fulllist__toggle:hover { color: var(--teal-press); text-decoration: underline; text-underline-offset: 3px; }
/* The bundle card in the buy box (borderless there, so its border hover never showed). */
.chae .chae-buy__summary .chae-setcard:hover { background: #e1eeee; }
.chae-setcard__go { transition: transform 0.15s ease; }
.chae-setcard:hover .chae-setcard__go { transform: translateX(3px); }
/* Round arrow and pause buttons. */
.chae .chae-vrow__nav:hover:not(:disabled) { border-color: #fff; background: #fff; color: var(--teal); }
.chae .chae-loop__toggle:hover { background: #fff; color: var(--teal-press); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.26); }
.chae .chae-contact__way a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* The journal (2026-10-16, user: "this all falls flat too" → "three photo cards"): unboxed like the product cards, a 3:2
   photo, then the category, title and date; a swipe row on phones. */
.chae .chae-home-journal { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.chae .chae-home-journal .chae-article { overflow: visible; border: 0; border-radius: 0; background: none; box-shadow: none; }
.chae .chae-home-journal .chae-article:hover { transform: none; box-shadow: none; }
.chae .chae-home-journal .chae-article__img { aspect-ratio: 3 / 2; border-radius: var(--home-r, 20px); }
.chae .chae-home-journal .chae-article__img img { transition: transform 0.4s ease; }
.chae .chae-home-journal .chae-article:hover .chae-article__img img { transform: scale(1.04); }
.chae .chae-home-journal .chae-article__body { gap: 6px; padding: 16px 0 0; }
.chae .chae-home-journal .chae-article__title { font-size: 20px; line-height: 1.3; }
.chae .chae-home-journal .chae-article__meta { margin-top: 2px; padding-top: 0; }
@media (max-width: 960px) {
	.chae .chae-home-journal { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } /* the 2-column blog grid would leave one card alone */
}
@media (max-width: 782px) {
	.chae .chae-home-journal { display: flex; gap: 12px; margin-right: -16px; padding-right: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
	.chae .chae-home-journal::-webkit-scrollbar { display: none; }
	.chae .chae-home-journal .chae-article { flex: 0 0 78%; scroll-snap-align: start; }
	.chae .chae-home-journal .chae-article__title { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
	.chae .chae-home-journal .chae-article__img img { transition: none; }
}

/* ---------- Home page system (2026-10-15, user: "the homepage is like 8 designs in 1"; picked "two section types").
   Every section below the hero (best sellers, concerns, bundles, creators, Linda and her team, the difference,
   journal): white, in the column, the left head. The reviews are the one teal band. (Linda's section was the last
   full-width photo split until 2026-10-16.) One title size (34px, 28px on
   phones) and one corner (20px, 16px on phones) everywhere. ---------- */
body.home { --home-title: 34px; --home-r: 20px; }
body.home .chae-head--left .chae-head__title,
body.home .chae-voices__title { font-size: var(--home-title); font-weight: 500; line-height: 1.18; }
/* One corner. */
body.home :is(.chae-card__media, .chae-concern, .chae-creators__fig, .chae-creators__link, .chae-hz__frame, .chae-hz__card, .chae-vcard) { border-radius: var(--home-r); }
@media (max-width: 782px) {
	body.home { --home-title: 28px; --home-r: 16px; }
}

/* Linda and her team (2026-10-16, user: the old full-width split "throws the groove off" → "like the sections around
   it"): the left head, then her portrait and the team photo as one row (1 : 2, the team photo sets the height), each with
   a caption chip, and the Shop button. */
.chae-hfounder__photos { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 24px; }
.chae-hfounder__photo { position: relative; margin: 0; overflow: hidden; border-radius: var(--home-r, 20px); background: #e6ecea; }
.chae-hfounder__photo--team { aspect-ratio: 16 / 9; }
.chae .chae-hfounder__photo img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 28%; } /* her head and shoulders, not a face close-up */
.chae .chae-hfounder__photo--team img { object-position: 50% 35%; }
.chae-hfounder__chip { position: absolute; bottom: 14px; left: 14px; max-width: calc(100% - 28px); padding: 9px 14px; border-radius: 12px; background: #fff; color: var(--muted); font-size: 13.5px; line-height: 1.4; box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12); }
.chae-hfounder__chip strong { color: var(--ink); }
.chae-hfounder__actions { margin-top: 28px; }
@media (max-width: 782px) {
	.chae-hfounder__photos { grid-template-columns: minmax(0, 1fr); gap: 12px; }
	.chae-hfounder__photo:first-child { aspect-ratio: 5 / 6; }
	.chae-hfounder__chip { bottom: 10px; left: 10px; max-width: calc(100% - 20px); font-size: 12.5px; }
	.chae-hfounder__actions { margin-top: 20px; }
}

/* Shop by concern (2026-10-15): six even photo tiles (3 × 2, 2 × 3 on phones) of our own product scenes, the same
   text and arrow on each, then the routine finder as a slim tinted bar. */
.chae-concerns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.chae .chae-concern { position: relative; isolation: isolate; display: flex; align-items: flex-end; aspect-ratio: 3 / 2; overflow: hidden; border-radius: var(--home-r, 20px); background: #dfe7e6; color: #fff; text-decoration: none; }
.chae .chae-concern img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1); }
.chae-concern::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0, 30, 30, 0) 40%, rgba(0, 30, 30, 0.72) 100%); }
.chae .chae-concern:hover { color: #fff; }
.chae-concern:hover img { transform: scale(1.05); }
.chae-concern__text { display: flex; flex-direction: column; gap: 4px; padding: 20px 72px 20px 22px; text-shadow: 0 1px 12px rgba(0, 0, 0, 0.25); }
.chae-concern__name { font-family: var(--head); font-size: 24px; font-weight: 600; line-height: 1.15; }
.chae-concern__line { color: rgba(255, 255, 255, 0.92); font-size: 14px; line-height: 1.4; }
.chae-concern__go { position: absolute; right: 20px; bottom: 22px; display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1.5px solid rgba(255, 255, 255, 0.7); border-radius: 50%; transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease; }
.chae-concern:hover .chae-concern__go { border-color: #fff; background: #fff; color: var(--teal); transform: translateX(3px); }
.chae-finderbar { display: flex; align-items: center; justify-content: space-between; gap: 16px 32px; margin-top: -10px; padding: 22px 28px; border-radius: var(--home-r, 20px); background: var(--tint); }
.chae-finderbar p { margin: 0; color: var(--muted); font-size: 16px; line-height: 1.5; }
.chae-finderbar strong { color: var(--ink); font-family: var(--head); font-size: 19px; font-weight: 600; }
body.chae .chae-finderbar .chae-btn { flex-shrink: 0; }
@media (max-width: 782px) {
	.chae-concerns { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.chae .chae-concern { aspect-ratio: 4 / 5; }
	.chae-concern__text { padding: 14px 14px 16px; }
	.chae-concern__name { font-size: 18px; }
	.chae-concern__line { font-size: 12.5px; }
	.chae-concern__go { display: none; }
	.chae-finderbar { flex-direction: column; align-items: stretch; padding: 20px; }
	.chae-finderbar strong { display: block; margin-bottom: 4px; }
	body.chae .chae-finderbar .chae-btn { justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
	.chae .chae-concern img, .chae-concern__go { transition: none; }
}

/* Why Chaé (2026-10-16, user: "this all falls flat too" → "a real bottle, front and back"): the front of one bottle and
   its back label side by side (white studio shots, multiplied onto the tint so they read as two tiles), the ingredient
   look-up beside them, then the certifications and four figures in one row. */
.chae-flip { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 56px; }
.chae-flip__pics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.chae-flip__pic { margin: 0; }
.chae-flip__frame { display: block; overflow: hidden; aspect-ratio: 4 / 5; border-radius: var(--home-r, 20px); background: var(--tint); }
.chae .chae-flip__frame img { display: block; width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; }
.chae-flip__cap { margin-top: 12px; color: var(--muted); font-size: 14px; line-height: 1.4; } /* under the photo: over it, it hid the front's label */
.chae-flip__cap strong { color: var(--ink); }
.chae .chae-flip__cap a { color: var(--teal); font-weight: 700; }
.chae .chae-flip__cap a:hover { color: var(--teal-press); text-decoration: underline; text-underline-offset: 3px; }
.chae-flip__look { display: flex; flex-direction: column; gap: 18px; }
.chae .chae-flip__title { margin: 0; font-size: 28px; line-height: 1.2; }
.chae-flip__look > p { max-width: 480px; margin: -4px 0 4px; color: var(--muted); font-size: 16.5px; line-height: 1.65; }
.chae .chae-flip__all { align-self: flex-start; margin-top: 2px; }
/* Ingredient cards (2026-10-16): six well-known ingredients from our labels, each opening the ingredient panel
   (assets/js/ingredients.js) — the Foundation's rating, what it is, how many of our products use it. */
.chae-ingcards { margin-top: 44px; }
.chae-ingcards__label { margin: 0 0 14px; color: var(--muted-2); font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae-ingcards__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.chae-ingcard { position: relative; display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 20px 22px; border: 1px solid transparent; border-radius: var(--home-r, 20px); background: var(--tint); transition: border-color 0.15s ease, background-color 0.15s ease; }
.chae-ingcard:hover { border-color: rgba(0, 142, 142, 0.35); background: #eaf3f3; }
/* The card opens the ingredient's panel (the button stretches over it); its "In N of our products" link sits on top and
   opens the shop with that ingredient's filter. */
.chae .chae-ingcard__open { display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: 8px; margin: 0; padding: 0; border: 0; background: none; color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.chae-ingcard__open::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.chae .chae-ingcard__open:focus-visible { outline: 0; }
.chae-ingcard:has(.chae-ingcard__open:focus-visible) { outline: 2px solid var(--teal); outline-offset: 3px; }
.chae-ingcard__top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.chae-ingcard__name { color: var(--ink); font-family: var(--head); font-size: 19px; font-weight: 600; line-height: 1.2; }
.chae-ingcard__what { display: -webkit-box; overflow: hidden; color: var(--muted); font-size: 14.5px; line-height: 1.55; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.chae .chae-ingcard__count { position: relative; z-index: 1; align-self: flex-start; margin-top: auto; padding-top: 2px; color: var(--teal); font-size: 13.5px; }
.chae-ingcard:hover .chae-ingcard__name { color: var(--teal); }
/* The look-up's suggestions (assets/js/ingredients.js): the site search's panel, one row per ingredient. */
.chae .chae-inglook__opt { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 10px 12px; border-radius: 12px; color: var(--ink); cursor: pointer; }
.chae-inglook__name { flex: 1 1 200px; font-size: 15px; font-weight: 600; line-height: 1.3; }
.chae-inglook__count { color: var(--muted-2); font-size: 13px; white-space: nowrap; }
.chae-inglook__none { margin: 4px 6px 0; color: var(--muted); }
@media (max-width: 1100px) {
	.chae-flip { gap: 40px; }
}
@media (max-width: 960px) {
	.chae-flip { grid-template-columns: minmax(0, 1fr); gap: 28px; }
	.chae-ingcards__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 782px) {
	.chae-flip__pics { gap: 10px; }
	.chae-flip__cap { margin-top: 8px; font-size: 13px; }
	.chae-ingcards { margin-top: 32px; }
	.chae-ingcards__list { display: flex; gap: 12px; margin-right: -16px; padding-right: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; } /* a swipe row, like the journal */
	.chae-ingcards__list::-webkit-scrollbar { display: none; }
	.chae-ingcards__list li { flex: 0 0 78%; scroll-snap-align: start; }
	.chae-ingcard { padding: 18px; }
	.chae .chae-flip__title { font-size: 24px; }
	.chae-flip__look > p { font-size: 16px; }
}

/* ---------- Product page system (2026-10-15, user: "do the same pass on the coq10 product page"). Like the home
   page: content sections white in the column; two story sections ("Why it works" and the team) on the tint with a
   photo half; no teal blocks; one title size (34px, 28px on phones, sub-heads 22px); one corner for photos, cards
   and panels (20px, 16px on phones), 16px for small rows and controls; one tint. ---------- */
body.single-product { --pdp-r: 20px; }
body.single-product :is(.chae-buy__gallery .woocommerce-product-gallery__wrapper, .chae-buy__summary form.cart, .chae-buy__summary .woosb-wrap, .chae-setcard, .chae-rsum, .chae-rcard, .chae-cvid, .chae-creators__fig, .chae-creators__link, .chae-keycard, .chae-keymore, .chae-fulllist, .chae-howto__photo, .chae-fbt__item, .chae-card__media, .chae-sec--tint .chae-sec__panel, .chae-sec--how .chae-sec__panel, .chae-pick__hero, .chae-pick__tips li, .chae-allreviews .comment_container) { border-radius: var(--pdp-r); }
@media (max-width: 782px) {
	body.single-product { --pdp-r: 16px; }
}
/* More details inside the overview (2026-10-15): seals and any other old tabs under the text and facts. */
.chae-overview__more { margin-top: 28px; }
/* The overview (2026-10-16, user: "lots of empty space here"): the description across the top, its facts (How it feels,
   Scent, Great for, Size) as a row of small cards under it, in place of a tall panel beside a short paragraph. */
.chae .chae-overview, .chae .chae-overview.has-facts { display: flex; flex-direction: column; align-items: stretch; gap: 28px; } /* stretch: the old grid's align-items: start shrank the cards' row */
.chae-overview__body { max-width: 860px; }
.chae .chae-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; padding: 0; border-radius: 0; background: none; }
.chae .chae-facts > div { gap: 6px; padding: 20px 22px; border-radius: 16px; background: var(--tint); }
/* How to use, the overview's last card (2026-10-16): steps side by side, how often as a note */
.chae-howcard { padding: 24px 26px 22px; border-radius: 20px; background: var(--tint); scroll-margin-top: 140px; }
.chae .chae-howcard__title { margin: 0 0 16px; color: var(--blue-deep); font-family: inherit; font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae-howcard__steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px 28px; margin: 0; padding: 0; list-style: none; }
.chae-howcard__steps li { display: grid; grid-template-columns: 36px minmax(0, 1fr); align-items: start; gap: 12px; }
.chae-howcard__n { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: var(--teal); color: #fff; font-family: var(--head); font-size: 17px; font-weight: 700; }
.chae .chae-howcard__steps p { margin: 6px 0 0; color: var(--ink); font-size: 15.5px; line-height: 1.5; }
.chae .chae-howcard__note { margin: 16px 0 0; padding-top: 14px; border-top: 1px solid rgba(0, 98, 99, 0.12); color: var(--muted); font-size: 14.5px; }
.chae-howcard .chae-howto { font-size: 15.5px; }
.chae .chae-howcard__one { margin: 0; color: var(--ink); font-size: 16px; line-height: 1.55; }
@media (max-width: 782px) {
	.chae .chae-facts { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.chae-howcard { padding: 18px 18px 16px; }
	.chae-howcard__steps { grid-template-columns: minmax(0, 1fr); gap: 12px; }
	.chae .chae-facts > div { padding: 16px 18px; }
}
.chae-overview__more .chae-seals { margin-top: 0; }

/* The end of a category's page (2026-10-16, user picked "finish the page"): its bundles, then its quiz or the contact
   page, so the page ends on a next step rather than a lone card. */
.chae-catend { padding-top: 8px; padding-bottom: 72px; } /* top and bottom only: the column's sides come from .chae-wrap */
.chae-catend__sets { padding-top: 48px; border-top: 1px solid var(--line); }
.chae-catend__sets .chae-head { margin-bottom: 20px; }
.chae .chae-catend__bar { margin-top: 0; }
.chae-catend__sets + .chae-catend__bar { margin-top: 48px; }
@media (max-width: 782px) {
	.chae .chae-catend { padding-bottom: 48px; }
	.chae-catend__sets { padding-top: 32px; }
	.chae-catend__sets + .chae-catend__bar { margin-top: 32px; }
}

/* The ToxicFree® seal where an icon goes (chae_icon( 'toxicfree' )): its own proportions, no icon stroke. */
.chae .chae-icon--tf { flex: none; object-fit: contain; vertical-align: middle; } /* sized inline by chae_icon() */

/* The proof row under "What makes Chaé different?" (2026-10-16, user: "kinda good but still not 100%"): six cells of one
   shape — a seal or a figure on top, a short label under it — in equal columns with a line between each; it was two
   layouts in one row (seals centered beside their text, figures on top of theirs) that didn't line up. */
.chae-proofrow { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); row-gap: 24px; margin: 48px 0 0; padding: 28px 0 0; border-top: 1px solid var(--line); list-style: none; }
.chae-proofrow__cell { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0 20px; border-left: 1px solid var(--line); }
.chae-proofrow__cell:first-child { padding-left: 0; border-left: 0; }
.chae-proofrow__cell:last-child { padding-right: 0; }
.chae-proofrow__top { display: flex; align-items: center; height: 40px; }
.chae .chae-proofrow__top img { width: auto; height: 40px; }
.chae-proofrow__num { color: var(--teal); font-family: var(--head); font-size: 30px; font-weight: 700; letter-spacing: -0.02em; line-height: 1; white-space: nowrap; }
.chae-proofrow__label { color: var(--muted); font-size: 13.5px; line-height: 1.45; }
.chae-proofrow__label strong { display: block; color: var(--ink); font-weight: 700; }
@media (max-width: 1100px) {
	.chae-proofrow { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.chae-proofrow__cell { padding-right: 20px; }
	.chae-proofrow__cell:nth-child(3n+1) { padding-left: 0; border-left: 0; }
}
@media (max-width: 782px) {
	.chae-proofrow { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 36px; padding-top: 24px; row-gap: 22px; }
	.chae-proofrow__cell, .chae-proofrow__cell:nth-child(3n+1) { padding: 0 0 0 16px; border-left: 1px solid var(--line); }
	.chae-proofrow__cell:nth-child(odd) { padding-left: 0; border-left: 0; }
	.chae-proofrow__top { height: 34px; }
	.chae .chae-proofrow__top img { height: 34px; }
	.chae-proofrow__num { font-size: 26px; }
}

/* Buy box, shorter (2026-10-16, user picked "Add to cart on the first screen"): the purchase-option heading only for
   screen readers (the two options say it), the tagline a size smaller, and an option's label over its buttons when there
   are three or more, so five flavors wrap two or three to a row instead of one per line beside the label, and three
   fragrances sit in one row (beside the label they wrapped, and the label floated between the rows). */
.chae .chae-buy__summary .chae-plans__legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.chae .chae-buy__summary .chae-lead { font-size: 18px; line-height: 1.4; }
.chae .chae-buy__summary table.variations tr:has(.chae-swatch:nth-of-type(3)) { display: block; grid-column: 1 / -1; }
.chae .chae-buy__summary table.variations tr:has(.chae-swatch:nth-of-type(3)) th.label { margin-bottom: 8px; }
.chae .chae-buy__summary .chae-swatch { font-size: 14.5px; }

/* Quick add (2026-10-16; inc/quick-add.php, assets/js/quick-add.js): a product with options is added from its card.
   Desktop: the choices open over the card's photo. Phones: a sheet from the bottom of the screen. The option buttons
   are the product page's (.chae-swatch), a size smaller on the card. */
.chae ul.products li.product.chae-card { position: relative; }
.chae-quick { display: flex; flex-direction: column; gap: 10px; padding: 14px; background: #fff; color: var(--ink); text-align: left; }
.chae-quick:focus { outline: none; }
.chae-quick.is-card { position: absolute; z-index: 6; right: 10px; left: 10px; border-radius: 16px; box-shadow: 0 12px 32px rgba(26, 36, 33, 0.18); opacity: 0; transform: translateY(8px); transition: opacity 0.18s ease, transform 0.18s ease; }
.chae-quick.is-card.is-open { opacity: 1; transform: none; }
.chae-quick__head { display: flex; align-items: center; gap: 12px; }
.chae-quick__img { flex-shrink: 0; width: 56px; height: 56px; border-radius: 12px; background: var(--tint); object-fit: cover; }
.chae-quick__who { display: flex; flex: 1; flex-direction: column; min-width: 0; }
.chae-quick__name { font-family: var(--head); font-size: 15px; font-weight: 600; line-height: 1.3; }
.chae-quick__price { color: var(--muted); font-size: 13.5px; }
.chae .chae-quick__close { display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; width: 32px; height: 32px; margin: 0; padding: 0; border: 0; border-radius: 50%; background: var(--tint); color: var(--ink); cursor: pointer; }
.chae .chae-quick__close:hover { background: #e6efee; }
.chae-quick.is-card .chae-quick__img, .chae-quick.is-card .chae-quick__who { display: none; } /* the card itself shows the photo, name and price */
.chae-quick.is-card .chae-quick__head { position: absolute; top: 8px; right: 8px; }
.chae-quick.is-card .chae-quick__group:first-of-type .chae-quick__label { padding-right: 40px; }
.chae .chae-quick__label { margin: 0 0 6px; color: var(--muted); font-family: var(--body); font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.chae .chae-quick .chae-quick__opts { display: flex; flex-wrap: wrap; gap: 6px; }
.chae .chae-quick .chae-swatch { min-height: 36px; padding: 5px 11px; border-radius: 12px; font-size: 13.5px; }
.chae .chae-quick .chae-swatch:disabled { cursor: not-allowed; }
.chae .chae-quick__add { width: 100%; margin-top: 2px; }
.chae .chae-quick__details { align-self: center; color: var(--teal); font-size: 13.5px; font-weight: 700; }
.chae-qsheet { position: fixed; inset: 0; z-index: 520; }
.chae-qsheet__shade { position: absolute; inset: 0; background: rgba(17, 30, 28, 0.45); opacity: 0; transition: opacity 0.2s ease; }
.chae-qsheet .chae-quick { position: absolute; right: 0; bottom: 0; left: 0; max-height: 85vh; overflow: auto; gap: 14px; padding: 18px 16px calc(20px + env(safe-area-inset-bottom)); border-radius: 22px 22px 0 0; transform: translateY(100%); transition: transform 0.25s ease; }
.chae-qsheet.is-open .chae-qsheet__shade { opacity: 1; }
.chae-qsheet.is-open .chae-quick { transform: none; }
.chae .chae-qsheet .chae-quick .chae-swatch { min-height: 44px; padding: 8px 14px; font-size: 14.5px; }
html.chae-qsheet-lock { overflow: hidden; }
/* desktop, a button that isn't on a product card (the home page's review cards): a centered window */
.chae-qsheet.is-center .chae-quick { top: 50%; right: auto; bottom: auto; left: 50%; width: min(420px, calc(100vw - 32px)); padding: 20px; border-radius: 20px; box-shadow: 0 24px 60px rgba(17, 30, 28, 0.25); opacity: 0; transform: translate(-50%, -46%); transition: opacity 0.18s ease, transform 0.18s ease; }
.chae-qsheet.is-center.is-open .chae-quick { opacity: 1; transform: translate(-50%, -50%); }
@media (prefers-reduced-motion: reduce) {
	.chae-quick.is-card, .chae-qsheet__shade, .chae-qsheet .chae-quick { transition: none; }
}

/* Tablet pass (2026-10-17 sweep, iPad upright = 820px): the product page's two 366px columns squeezed the buy box,
   and three review cards a row left 245px cards with dates on their own line. */
@media (min-width: 783px) and (max-width: 1100px) {
	.chae .chae-buy__summary .chae-perks { grid-template-columns: minmax(0, 1fr); } /* "Free / shipping / over $50" on three lines two to a row */
	.chae .chae-product .chae-rcards { display: flex; margin: 0 -24px; padding: 0 24px 6px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 24px; scrollbar-width: none; }
	.chae .chae-product .chae-rcards .chae-rcard { flex: 0 0 min(46%, 360px); scroll-snap-align: start; }
}
@media (max-width: 1100px) {
	/* The Save pill under "Subscribe & Save": between the name and the price it broke in two, or ran into the price */
	.chae .chae-plans .chae-plan__badge { grid-column: 2 / 4; grid-row: 2; margin-top: 4px; }
	/* "· 2,600+ sold" dropped to its own line led by the dot: a gap instead, as on phones */
	.chae .chae-buy__summary .woocommerce-product-rating { gap: 4px 14px; }
	.chae .chae-buy__summary .cr-qna-separator, .chae .chae-buy__summary .woocommerce-product-rating > * + .chae-sold::before { display: none; }
}
/* About on an iPad: the founder photo stacked at half width with a blank half beside it (2026-10-17 sweep). Side by
   side down to 783px; stacked below that, centered. */
@media (min-width: 783px) and (max-width: 960px) {
	.chae-founder { grid-template-columns: 260px minmax(0, 1fr); gap: 32px; }
	.chae-founder__photo { width: auto; }
}
@media (max-width: 782px) {
	.chae-founder__photo { margin: 0 auto; }
}
/* Phone pass (2026-10-17 sweep) */
.chae-banner__quiz .chae-link { white-space: nowrap; } /* its "→" wrapped onto a line alone */
.chae .chae-plans .chae-plan__badge { white-space: nowrap; } /* "Save 15%" broke onto two lines */
@media (max-width: 782px) {
	.chae-pick__startrow { scroll-padding: 0 16px; } /* the first ready-made trio snapped against the screen edge */
	.chae-catpills { padding-right: 56px; } /* the last chip (Sales) can scroll clear of the edge fade */
}
@media (max-width: 560px) {
	.chae-ing-dir__filters label { flex-basis: calc(50% - 7px); min-width: 0; } /* four filters two a row: they filled the first screen */
	/* The article on the page itself, not a card inside the 16px gutter: the text was 315px wide, 255px in its boxes */
	.chae-story__panel { padding: 8px 0 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
	.chae .chae-story__content .chae-post :is(.tldr, .aside, .spotlight) { padding-right: 18px; padding-left: 18px; }
}

/* From the Journal on product pages; product names linked inside articles (inc/internal-links.php, 2026-10-19). */
.chae-pdp-journal { padding-top: 20px; padding-bottom: 40px; }
.chae-pdp-journal .chae-head { margin-bottom: 22px; }
.chae-story__content a.chae-inlink { font-weight: 600; }