/* ==========================================================================
   Edgewise — theme.css
   Minimal, spacious base. Clinical density is opt-in, via .clin-* components
   used on product pages and the science page.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Tokens
   -------------------------------------------------------------------------- */

:root {
	/* Sampled from the Dream Collection cartons. Brand mint is the carton
	   colour and carries fills, bands and the mark; it fails text contrast on
	   white (2.1:1), so deep teal handles every link, small label and
	   interactive state (5.9:1). Never set type in mint on white. */
	--paper: #ffffff;
	--shell: #f1f4f3;
	--ground: #f5f7f6;
	--ink: #16181a;
	--muted: #5e6664;
	--faint: #8c9491;
	--hairline: #e4e8e7;
	--mint: #6ec1ab;
	--deep: #1f6a57;
	--herb: #1f6a57;
	--herb-dim: #6ec1ab;
	--gold: #c9a227;
	--yolk: #c9a227;
	--alert: #a03a2c;
	--alert-bg: #fcf4f2;
	--white: #fff;

	/* The cartons set product names in a geometric sans and the collection
	   name in a serif. The site follows that hierarchy. */
	--ff-display: "Futura", "Avenir Next", "Century Gothic", "Questrial", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
	--ff-serif: Georgia, "Iowan Old Style", "Times New Roman", serif;
	--ff-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--ff-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

	--s1: 0.5rem;
	--s2: 1rem;
	--s3: 1.5rem;
	--s4: 2.5rem;
	--s5: 4rem;
	--s6: 6rem;
	--s7: 9rem;

	--wrap: 76rem;
	--wrap-narrow: 44rem;
	--gutter: 1.5rem;

	--ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--dur: 320ms;
}

@media (min-width: 48em) {
	:root {
		--gutter: 2.5rem;
	}
}

/* --------------------------------------------------------------------------
   2. Reset & base
   -------------------------------------------------------------------------- */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

body {
	margin: 0;
	background: var(--paper);
	color: var(--ink);
	font-family: var(--ff-body);
	font-size: 1rem;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

img,
svg,
video {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: inherit;
	text-decoration: none;
}

.prose a,
.postcard__excerpt a {
	text-decoration: underline;
	text-underline-offset: 0.18em;
	text-decoration-thickness: 1px;
	text-decoration-color: var(--hairline);
	transition: text-decoration-color var(--dur) var(--ease);
}

.prose a:hover {
	text-decoration-color: var(--herb);
}

h1,
h2,
h3,
h4 {
	font-family: var(--ff-display);
	font-weight: 500;
	line-height: 1.16;
	letter-spacing: 0.005em;
	margin: 0 0 var(--s2);
}

/* The collection signature — "Dream Collection" — is set in the serif, the
   way it is on the carton. Used as an eyebrow above product and section
   titles, never as a heading in its own right. */
.signature {
	display: block;
	font-family: var(--ff-serif);
	font-size: 1.0625rem;
	font-weight: 400;
	letter-spacing: 0.01em;
	color: var(--deep);
	margin-bottom: 0.35rem;
}

.signature__sub {
	display: block;
	font-family: var(--ff-body);
	font-size: 0.6875rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--muted);
}

h1 {
	font-size: clamp(2rem, 1.4rem + 2.6vw, 3.25rem);
	letter-spacing: -0.015em;
}

h2 {
	font-size: clamp(1.5rem, 1.2rem + 1.3vw, 2.125rem);
}

h3 {
	font-size: 1.3125rem;
}

h4 {
	font-size: 1.0625rem;
}

p {
	margin: 0 0 var(--s2);
}

ul,
ol {
	margin: 0 0 var(--s2);
	padding-left: 1.25em;
}

hr {
	border: 0;
	border-top: 1px solid var(--hairline);
	margin: var(--s5) 0;
}

blockquote {
	margin: var(--s4) 0;
	padding-left: var(--s3);
	border-left: 2px solid var(--herb);
	font-family: var(--ff-display);
	font-size: 1.25rem;
	line-height: 1.45;
	color: var(--herb);
}

:focus-visible {
	outline: 2px solid var(--herb);
	outline-offset: 3px;
}

::selection {
	background: var(--herb);
	color: var(--paper);
}

/* --------------------------------------------------------------------------
   3. Utilities
   -------------------------------------------------------------------------- */

.wrap {
	width: 100%;
	max-width: var(--wrap);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.wrap--narrow {
	max-width: var(--wrap-narrow);
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 999;
	background: var(--ink);
	color: var(--paper);
	padding: 0.75rem 1.25rem;
	font-size: 0.875rem;
}

.skip-link:focus {
	left: 0;
}

.eyebrow {
	display: block;
	font-size: 0.6875rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: 0.75rem;
	font-weight: 500;
}

.empty {
	color: var(--muted);
	padding: var(--s5) 0;
	text-align: center;
}

/* Buttons ---------------------------------------------------------------- */

.btn,
.button,
button.button,
input[type="submit"],
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	background: var(--ink);
	color: var(--paper);
	border: 1px solid var(--ink);
	border-radius: 0;
	padding: 0.95rem 1.9rem;
	font-family: var(--ff-body);
	font-size: 0.8125rem;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	font-weight: 500;
	line-height: 1;
	cursor: pointer;
	transition: background var(--dur) var(--ease), color var(--dur) var(--ease), border-color var(--dur) var(--ease);
	text-decoration: none;
}

.btn:hover,
.button:hover,
button.button:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover {
	background: var(--herb);
	border-color: var(--herb);
	color: var(--paper);
}

.btn--ghost,
.button.alt--ghost {
	background: transparent;
	color: var(--ink);
	border-color: var(--ink);
}

.btn--ghost:hover {
	background: var(--ink);
	color: var(--paper);
}

.btn--wide {
	width: 100%;
}

.btn:disabled,
.button:disabled,
.button.disabled {
	opacity: 0.4;
	cursor: not-allowed;
}

/* Forms ------------------------------------------------------------------ */

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="date"],
select,
textarea {
	width: 100%;
	background: var(--white);
	border: 1px solid var(--hairline);
	border-radius: 0;
	padding: 0.85rem 1rem;
	font-family: var(--ff-body);
	font-size: 0.9375rem;
	color: var(--ink);
	transition: border-color var(--dur) var(--ease);
}

input:focus,
select:focus,
textarea:focus {
	border-color: var(--herb);
	outline: none;
}

label {
	display: block;
	font-size: 0.8125rem;
	letter-spacing: 0.04em;
	color: var(--muted);
	margin-bottom: 0.4rem;
}

.searchform {
	display: flex;
	gap: 0;
	max-width: 28rem;
	margin: var(--s3) 0;
}

.searchform__field {
	flex: 1;
	border-right: 0;
}

.searchform__submit {
	background: var(--ink);
	color: var(--paper);
	border: 1px solid var(--ink);
	padding-inline: 1.1rem;
	cursor: pointer;
}

/* --------------------------------------------------------------------------
   4. Header
   -------------------------------------------------------------------------- */

.announce {
	background: var(--herb);
	color: var(--paper);
	font-size: 0.8125rem;
	letter-spacing: 0.04em;
	text-align: center;
}

.announce__inner {
	padding: 0.7rem var(--gutter);
}

.announce a {
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

.siteheader {
	position: sticky;
	top: 0;
	z-index: 100;
	background: color-mix(in srgb, var(--paper) 88%, transparent);
	backdrop-filter: saturate(160%) blur(12px);
	border-bottom: 1px solid var(--hairline);
}

@supports not (backdrop-filter: blur(1px)) {
	.siteheader {
		background: var(--paper);
	}
}

.siteheader__inner {
	max-width: var(--wrap);
	margin-inline: auto;
	padding: 1.1rem var(--gutter);
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: var(--s2);
}

.siteheader__brand {
	justify-self: center;
}

.brand {
	margin: 0;
	font-family: var(--ff-display);
	font-size: 1.375rem;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	font-weight: 400;
	white-space: nowrap;
}

.custom-logo {
	max-height: 48px;
	width: auto;
}

.siteheader__actions {
	display: flex;
	align-items: center;
	gap: 0.35rem;
	justify-self: end;
}

.iconbtn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	color: var(--ink);
	transition: color var(--dur) var(--ease);
}

.iconbtn:hover {
	color: var(--herb);
}

.cartcount {
	position: absolute;
	top: 3px;
	right: 1px;
	min-width: 17px;
	height: 17px;
	padding: 0 4px;
	border-radius: 999px;
	background: var(--herb);
	color: var(--paper);
	font-size: 0.625rem;
	font-weight: 600;
	line-height: 17px;
	text-align: center;
}

.cartcount:empty,
.cartcount[data-cart-count="0"] {
	display: none;
}

/* Nav -------------------------------------------------------------------- */

.navtoggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background: none;
	border: 0;
	padding: 0;
	color: var(--ink);
	cursor: pointer;
}

.navtoggle__close {
	display: none;
}

.navtoggle[aria-expanded="true"] .navtoggle__open {
	display: none;
}

.navtoggle[aria-expanded="true"] .navtoggle__close {
	display: inline-flex;
}

.sitenav__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sitenav__list a {
	font-size: 0.8125rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--ink);
	transition: color var(--dur) var(--ease);
}

.sitenav__list a:hover {
	color: var(--herb);
}

@media (max-width: 63.99em) {
	.sitenav {
		position: fixed;
		inset: 0;
		background: var(--paper);
		padding: 6rem var(--gutter) var(--s4);
		transform: translateX(-100%);
		transition: transform var(--dur) var(--ease);
		overflow-y: auto;
		z-index: 90;
		visibility: hidden;
	}

	.nav-open .sitenav {
		transform: none;
		visibility: visible;
	}

	.sitenav__list li {
		border-bottom: 1px solid var(--hairline);
	}

	.sitenav__list a {
		display: block;
		padding: 1.1rem 0;
		font-size: 1rem;
	}

	.nav-open {
		overflow: hidden;
	}
}

@media (min-width: 64em) {
	.navtoggle {
		display: none;
	}

	.siteheader__inner {
		grid-template-columns: 1fr auto 1fr;
	}

	.siteheader__brand {
		order: 2;
	}

	.sitenav {
		order: 1;
		justify-self: start;
	}

	.siteheader__actions {
		order: 3;
	}

	.sitenav__list {
		display: flex;
		gap: 1.75rem;
		align-items: center;
	}
}

/* --------------------------------------------------------------------------
   5. Page furniture
   -------------------------------------------------------------------------- */

.site-main {
	min-height: 50vh;
}

.pagehead {
	padding: var(--s6) 0 var(--s4);
}

.pagehead__inner {
	max-width: var(--wrap);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.pagehead--center .pagehead__inner {
	max-width: 46rem;
	text-align: center;
}

.pagehead__title {
	margin-bottom: var(--s2);
}

.pagehead__intro {
	color: var(--muted);
	font-size: 1.0625rem;
	max-width: 38rem;
	margin-inline: auto;
}

.pagehead__meta {
	color: var(--faint);
	font-size: 0.8125rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	margin: 0;
}

.pagehero {
	margin: 0 0 var(--s5);
	max-width: var(--wrap);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.pagehero img {
	width: 100%;
	object-fit: cover;
	aspect-ratio: 16 / 7;
}

.prose {
	padding-bottom: var(--s6);
	font-size: 1.0625rem;
}

.prose h2 {
	margin-top: var(--s5);
}

.prose h3 {
	margin-top: var(--s4);
}

.prose img {
	margin-block: var(--s3);
}

.prose > *:first-child {
	margin-top: 0;
}

.notfound {
	padding-block: var(--s6);
	text-align: center;
}

.notfound__text {
	color: var(--muted);
	max-width: 32rem;
	margin-inline: auto;
}

.notfound .searchform {
	margin-inline: auto;
}

/* Journal grid ----------------------------------------------------------- */

.postgrid {
	display: grid;
	gap: var(--s4);
	grid-template-columns: 1fr;
	padding-bottom: var(--s6);
}

@media (min-width: 40em) {
	.postgrid {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--s4) var(--s3);
	}
}

@media (min-width: 64em) {
	.postgrid {
		grid-template-columns: repeat(3, 1fr);
	}
}

.postcard__media img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	margin-bottom: var(--s2);
	transition: opacity var(--dur) var(--ease);
}

.postcard__media:hover img {
	opacity: 0.85;
}

.postcard__title {
	font-size: 1.25rem;
	margin-bottom: 0.5rem;
}

.postcard__excerpt {
	color: var(--muted);
	font-size: 0.9375rem;
	margin-bottom: 0.5rem;
}

.postcard__date {
	font-size: 0.75rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--faint);
}

.postnav {
	display: flex;
	justify-content: space-between;
	gap: var(--s3);
	padding-block: var(--s4);
	border-top: 1px solid var(--hairline);
	font-size: 0.875rem;
}

/* Pagination ------------------------------------------------------------- */

.pagination {
	display: flex;
	justify-content: center;
	padding-bottom: var(--s6);
}

.pagination .nav-links {
	display: flex;
	gap: 0.4rem;
	align-items: center;
}

.pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	border: 1px solid var(--hairline);
	font-size: 0.875rem;
	transition: border-color var(--dur) var(--ease), background var(--dur) var(--ease);
}

.pagination .page-numbers:hover {
	border-color: var(--ink);
}

.pagination .page-numbers.current {
	background: var(--ink);
	border-color: var(--ink);
	color: var(--paper);
}

/* --------------------------------------------------------------------------
   6. Clinical components (product pages, science page)
   -------------------------------------------------------------------------- */

.clin-section {
	border-top: 1px solid var(--hairline);
	padding-block: var(--s4);
}

.clin-section__title {
	font-family: var(--ff-body);
	font-size: 0.75rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--muted);
	font-weight: 600;
	margin-bottom: var(--s3);
}

/* Data rows -------------------------------------------------------------- */

.datalist {
	margin: 0;
}

.datarow {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.15rem;
	padding: 0.85rem 0;
	border-bottom: 1px solid var(--hairline);
}

@media (min-width: 30em) {
	.datarow {
		grid-template-columns: 11rem 1fr;
		gap: var(--s2);
		align-items: baseline;
	}
}

.datarow:last-child {
	border-bottom: 0;
}

.datarow__label {
	font-size: 0.8125rem;
	letter-spacing: 0.04em;
	color: var(--muted);
	margin: 0;
}

.datarow__value {
	margin: 0;
	font-size: 0.9375rem;
}

/* Actives table ---------------------------------------------------------- */

.actives {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.9375rem;
}

.actives th,
.actives td {
	text-align: left;
	padding: 0.8rem 0.75rem 0.8rem 0;
	border-bottom: 1px solid var(--hairline);
	vertical-align: top;
}

.actives th {
	font-family: var(--ff-body);
	font-weight: 600;
	font-size: 0.6875rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--muted);
}

.actives .pct {
	font-family: var(--ff-mono);
	font-size: 0.875rem;
	white-space: nowrap;
	color: var(--herb);
	font-variant-numeric: tabular-nums;
}

.actives__role {
	color: var(--muted);
	font-size: 0.875rem;
}

/* Evidence card ---------------------------------------------------------- */

.evidence {
	display: grid;
	gap: var(--s3);
	grid-template-columns: 1fr;
}

@media (min-width: 44em) {
	.evidence {
		grid-template-columns: repeat(3, 1fr);
	}
}

.evidence__stat {
	background: var(--shell);
	padding: var(--s3);
}

.evidence__figure {
	font-family: var(--ff-display);
	font-size: 2.5rem;
	line-height: 1;
	color: var(--herb);
	display: block;
	margin-bottom: 0.5rem;
	font-variant-numeric: tabular-nums;
}

.evidence__caption {
	font-size: 0.875rem;
	color: var(--muted);
	margin: 0;
}

.evidence__method {
	font-size: 0.75rem;
	color: var(--faint);
	margin-top: 0.75rem;
	line-height: 1.5;
}

.citations {
	list-style: none;
	padding: 0;
	margin: var(--s3) 0 0;
	counter-reset: cite;
}

.citations li {
	counter-increment: cite;
	font-size: 0.8125rem;
	color: var(--muted);
	line-height: 1.55;
	padding-left: 1.75rem;
	position: relative;
	margin-bottom: 0.6rem;
}

.citations li::before {
	content: counter(cite) ".";
	position: absolute;
	left: 0;
	font-family: var(--ff-mono);
	color: var(--faint);
}

.footnote {
	font-size: 0.75rem;
	color: var(--faint);
	line-height: 1.55;
	margin-top: var(--s3);
}

/* Allergen panel --------------------------------------------------------- */

.allergen {
	display: flex;
	gap: 0.85rem;
	align-items: flex-start;
	background: var(--alert-bg);
	border-left: 3px solid var(--alert);
	padding: var(--s2) var(--s3);
	margin-block: var(--s3);
}

.allergen__icon {
	color: var(--alert);
	flex-shrink: 0;
	margin-top: 0.15rem;
}

.allergen__title {
	font-family: var(--ff-body);
	font-size: 0.75rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--alert);
	margin: 0 0 0.35rem;
}

.allergen__body {
	font-size: 0.875rem;
	line-height: 1.6;
	margin: 0;
	color: var(--ink);
}

.allergen--compact {
	padding: 0.6rem 0.9rem;
	margin-block: 0.75rem;
	font-size: 0.8125rem;
}

.allergen--inline {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	background: none;
	border: 0;
	padding: 0;
	margin: 0.4rem 0 0;
	color: var(--alert);
	font-size: 0.75rem;
	letter-spacing: 0.03em;
}

/* Provenance ------------------------------------------------------------- */

.provenance {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s2) var(--s3);
	padding: var(--s2) 0;
	font-size: 0.8125rem;
	color: var(--muted);
}

.provenance__item {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
}

.provenance__item svg {
	color: var(--herb);
}

/* Accordion -------------------------------------------------------------- */

.acc__item {
	border-bottom: 1px solid var(--hairline);
}

.acc__trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--s2);
	width: 100%;
	background: none;
	border: 0;
	padding: 1.15rem 0;
	font-family: var(--ff-body);
	font-size: 0.9375rem;
	color: var(--ink);
	text-align: left;
	cursor: pointer;
}

.acc__trigger .icon {
	flex-shrink: 0;
	color: var(--muted);
	transition: transform var(--dur) var(--ease);
}

.acc__trigger[aria-expanded="true"] .icon {
	transform: rotate(45deg);
}

.acc__panel {
	padding-bottom: var(--s3);
	font-size: 0.9375rem;
	color: var(--muted);
}

.acc__panel[hidden] {
	display: none;
}

/* --------------------------------------------------------------------------
   7. Footer
   -------------------------------------------------------------------------- */

.sitefooter {
	border-top: 1px solid var(--hairline);
	margin-top: var(--s6);
	padding-inline: var(--gutter);
}

.sitefooter__signup {
	border-bottom: 1px solid var(--hairline);
	padding-block: var(--s4);
}

.sitefooter__signup-inner {
	max-width: 34rem;
	margin-inline: auto;
	text-align: center;
}

.sitefooter__cols {
	max-width: var(--wrap);
	margin-inline: auto;
	padding-block: var(--s5);
	display: grid;
	gap: var(--s4);
	grid-template-columns: 1fr;
}

@media (min-width: 48em) {
	.sitefooter__cols {
		grid-template-columns: 1.4fr repeat(3, 1fr);
		gap: var(--s3);
	}
}

.sitefooter__origin {
	color: var(--muted);
	font-size: 0.875rem;
	margin-top: var(--s2);
	max-width: 22rem;
}

.sitefooter__coltitle {
	font-family: var(--ff-body);
	font-size: 0.6875rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--muted);
	font-weight: 600;
	margin-bottom: var(--s2);
}

.sitefooter__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sitefooter__list li {
	margin-bottom: 0.55rem;
}

.sitefooter__list a {
	font-size: 0.875rem;
	color: var(--muted);
	transition: color var(--dur) var(--ease);
}

.sitefooter__list a:hover {
	color: var(--ink);
}

.sitefooter__allergen {
	max-width: var(--wrap);
	margin-inline: auto;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: var(--s2) 0;
	border-top: 1px solid var(--hairline);
	color: var(--alert);
	font-size: 0.8125rem;
}

.sitefooter__base {
	max-width: var(--wrap);
	margin-inline: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: var(--s2);
	padding-block: var(--s3);
	border-top: 1px solid var(--hairline);
}

.sitefooter__copy {
	margin: 0;
	font-size: 0.8125rem;
	color: var(--muted);
}

.sitefooter__legal {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: var(--s2);
	margin: 0;
	padding: 0;
}

.sitefooter__legal a {
	font-size: 0.8125rem;
	color: var(--muted);
}

.sitefooter__legal a:hover {
	color: var(--ink);
}

.sitefooter__disclaimer {
	max-width: var(--wrap);
	margin-inline: auto;
	font-size: 0.6875rem;
	line-height: 1.6;
	color: var(--faint);
	padding-bottom: var(--s4);
	margin-bottom: 0;
}

/* --------------------------------------------------------------------------
   8. WooCommerce — shop archive
   -------------------------------------------------------------------------- */

.wc-wrap {
	padding-bottom: var(--s6);
}

.woocommerce-notices-wrapper:not(:empty) {
	margin-bottom: var(--s3);
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	list-style: none;
	background: var(--shell);
	border-left: 3px solid var(--herb);
	padding: var(--s2) var(--s3);
	margin: 0 0 var(--s3);
	font-size: 0.9375rem;
}

.woocommerce-error {
	background: var(--alert-bg);
	border-left-color: var(--alert);
}

.woocommerce-message .button,
.woocommerce-info .button {
	float: right;
	padding: 0.55rem 1.1rem;
	font-size: 0.6875rem;
}

/* Result count + ordering */

.woocommerce-result-count,
.woocommerce-ordering {
	display: inline-block;
	font-size: 0.8125rem;
	color: var(--muted);
	margin-bottom: var(--s3);
}

.woocommerce-ordering {
	float: right;
}

.woocommerce-ordering select {
	width: auto;
	padding: 0.5rem 2rem 0.5rem 0.75rem;
	font-size: 0.8125rem;
	background: transparent;
	border-color: var(--hairline);
}

/* Product grid */

ul.products {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--s4) var(--s3);
	grid-template-columns: repeat(2, 1fr);
	clear: both;
}

@media (min-width: 64em) {
	ul.products.columns-3 {
		grid-template-columns: repeat(3, 1fr);
	}
	ul.products.columns-4 {
		grid-template-columns: repeat(4, 1fr);
	}
}

ul.products li.product {
	position: relative;
	display: flex;
	flex-direction: column;
	text-align: left;
}

ul.products li.product a img {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	background: var(--shell);
	margin-bottom: var(--s2);
	transition: opacity var(--dur) var(--ease);
}

ul.products li.product:hover a img {
	opacity: 0.88;
}

ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--ff-display);
	font-size: 1.0625rem;
	line-height: 1.3;
	margin: 0 0 0.3rem;
	padding: 0;
}

.pcard__benefit {
	font-size: 0.8125rem;
	color: var(--muted);
	margin: 0 0 0.5rem;
	line-height: 1.5;
}

ul.products li.product .price {
	font-size: 0.9375rem;
	color: var(--ink);
	margin: 0 0 0.4rem;
	font-variant-numeric: tabular-nums;
}

ul.products li.product .price del {
	color: var(--faint);
	margin-right: 0.4rem;
}

ul.products li.product .price ins {
	text-decoration: none;
	color: var(--alert);
}

ul.products li.product .button {
	margin-top: auto;
	align-self: flex-start;
	padding: 0.7rem 1.35rem;
	font-size: 0.6875rem;
	background: transparent;
	color: var(--ink);
	border-color: var(--ink);
}

ul.products li.product .button:hover {
	background: var(--ink);
	color: var(--paper);
}

.onsale {
	position: absolute;
	top: 0.75rem;
	left: 0.75rem;
	z-index: 2;
	background: var(--ink);
	color: var(--paper);
	font-size: 0.625rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	padding: 0.35rem 0.65rem;
}

/* --------------------------------------------------------------------------
   9. WooCommerce — single product
   -------------------------------------------------------------------------- */

.single-product div.product {
	display: grid;
	gap: var(--s4);
	grid-template-columns: 1fr;
	padding-top: var(--s4);
}

@media (min-width: 56em) {
	.single-product div.product {
		grid-template-columns: 1.15fr 1fr;
		gap: var(--s5);
		align-items: start;
	}

	.single-product div.product .woocommerce-product-gallery {
		position: sticky;
		top: 6rem;
	}
}

.woocommerce-product-gallery {
	margin: 0;
}

.woocommerce-product-gallery__image img {
	width: 100%;
	background: var(--shell);
}

.flex-control-thumbs {
	list-style: none;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0.5rem;
	margin: 0.5rem 0 0;
	padding: 0;
}

.flex-control-thumbs img {
	cursor: pointer;
	opacity: 0.55;
	transition: opacity var(--dur) var(--ease);
}

.flex-control-thumbs img.flex-active,
.flex-control-thumbs img:hover {
	opacity: 1;
}

.summary.entry-summary {
	max-width: 32rem;
}

.product_title {
	font-size: clamp(1.75rem, 1.3rem + 1.8vw, 2.5rem);
	margin-bottom: var(--s2);
}

.summary .price {
	font-size: 1.25rem;
	font-family: var(--ff-body);
	color: var(--ink);
	margin-bottom: var(--s2);
	font-variant-numeric: tabular-nums;
}

.summary .price del {
	color: var(--faint);
	margin-right: 0.5rem;
}

.summary .price ins {
	text-decoration: none;
	color: var(--alert);
}

.woocommerce-product-details__short-description {
	color: var(--muted);
	font-size: 1rem;
	line-height: 1.7;
	margin-bottom: var(--s3);
}

/* Buy box */

form.cart {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s2);
	align-items: stretch;
	margin-block: var(--s3);
}

.quantity {
	display: inline-flex;
	align-items: stretch;
	border: 1px solid var(--hairline);
	background: var(--white);
}

.quantity input.qty {
	width: 3.25rem;
	border: 0;
	text-align: center;
	padding: 0.75rem 0.25rem;
	font-variant-numeric: tabular-nums;
	-moz-appearance: textfield;
}

.quantity input.qty::-webkit-outer-spin-button,
.quantity input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.qtybtn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	background: none;
	border: 0;
	color: var(--muted);
	cursor: pointer;
	transition: color var(--dur) var(--ease);
}

.qtybtn:hover {
	color: var(--ink);
}

.single_add_to_cart_button {
	flex: 1;
	min-width: 12rem;
}

.stock.in-stock {
	font-size: 0.8125rem;
	color: var(--herb);
}

.stock.out-of-stock {
	font-size: 0.8125rem;
	color: var(--alert);
}

.product_meta {
	font-size: 0.8125rem;
	color: var(--muted);
	padding-top: var(--s2);
	border-top: 1px solid var(--hairline);
	margin-top: var(--s3);
}

.product_meta > span {
	display: block;
	margin-bottom: 0.35rem;
}

/* Variations */

.variations {
	width: 100%;
	margin-bottom: var(--s2);
}

.variations th,
.variations td {
	text-align: left;
	padding: 0.35rem 0;
	vertical-align: middle;
}

.variations label {
	margin: 0;
}

.reset_variations {
	font-size: 0.75rem;
	color: var(--muted);
	text-decoration: underline;
}

/* Clinical block below the fold */

.clinical {
	padding-top: var(--s5);
	grid-column: 1 / -1;
}

.clinical .prose {
	padding-bottom: 0;
	font-size: 1rem;
}

/* Related products */

.related.products,
.upsells.products {
	grid-column: 1 / -1;
	padding-top: var(--s5);
	border-top: 1px solid var(--hairline);
	margin-top: var(--s5);
}

.related.products > h2,
.upsells.products > h2 {
	font-family: var(--ff-body);
	font-size: 0.75rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--muted);
	font-weight: 600;
	margin-bottom: var(--s3);
}

/* Reviews */

#reviews {
	grid-column: 1 / -1;
	padding-top: var(--s5);
}

.woocommerce-Reviews-title {
	font-family: var(--ff-body);
	font-size: 0.75rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--muted);
	font-weight: 600;
}

.commentlist {
	list-style: none;
	padding: 0;
	margin: 0 0 var(--s4);
}

.commentlist li {
	border-bottom: 1px solid var(--hairline);
	padding-block: var(--s3);
}

.commentlist .avatar {
	display: none;
}

.woocommerce-review__author {
	font-weight: 600;
	font-size: 0.9375rem;
}

.woocommerce-review__published-date {
	color: var(--faint);
	font-size: 0.8125rem;
}

.star-rating {
	font-size: 0.8125rem;
	color: var(--yolk);
}

/* --------------------------------------------------------------------------
   10. WooCommerce — cart, checkout, account
   -------------------------------------------------------------------------- */

.woocommerce-cart-form table.shop_table,
.woocommerce table.shop_table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: var(--s3);
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
	text-align: left;
	padding: var(--s2) 0.75rem var(--s2) 0;
	border-bottom: 1px solid var(--hairline);
	vertical-align: middle;
	font-size: 0.9375rem;
}

.woocommerce table.shop_table th {
	font-family: var(--ff-body);
	font-size: 0.6875rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--muted);
	font-weight: 600;
}

.woocommerce table.shop_table .product-thumbnail img {
	width: 72px;
	height: 90px;
	object-fit: cover;
	background: var(--shell);
}

.product-remove a.remove {
	color: var(--faint);
	font-size: 1.25rem;
	line-height: 1;
}

.product-remove a.remove:hover {
	color: var(--alert);
}

.cart_totals,
.cross-sells {
	margin-top: var(--s4);
}

.cart_totals h2,
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
#order_review_heading {
	font-family: var(--ff-body);
	font-size: 0.75rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--muted);
	font-weight: 600;
	margin-bottom: var(--s2);
}

.cart-collaterals {
	max-width: 26rem;
	margin-left: auto;
}

.wc-proceed-to-checkout {
	margin-top: var(--s2);
}

.wc-proceed-to-checkout .button {
	width: 100%;
}

.checkout.woocommerce-checkout {
	display: grid;
	gap: var(--s4);
	grid-template-columns: 1fr;
	align-items: start;
}

@media (min-width: 56em) {
	.checkout.woocommerce-checkout {
		grid-template-columns: 1.25fr 1fr;
		gap: var(--s5);
	}

	#order_review_heading,
	#order_review {
		grid-column: 2;
	}

	#customer_details {
		grid-column: 1;
		grid-row: 1 / span 2;
	}
}

.form-row {
	margin-bottom: var(--s2);
}

.woocommerce-input-wrapper {
	display: block;
}

#payment {
	background: var(--shell);
	padding: var(--s3);
	margin-top: var(--s2);
}

#payment ul.payment_methods {
	list-style: none;
	margin: 0 0 var(--s2);
	padding: 0;
}

#payment ul.payment_methods li {
	border-bottom: 1px solid var(--hairline);
	padding-block: 0.85rem;
}

#payment ul.payment_methods li:last-child {
	border-bottom: 0;
}

#payment label {
	display: inline;
	color: var(--ink);
	font-size: 0.9375rem;
}

.payment_box {
	font-size: 0.8125rem;
	color: var(--muted);
	padding-top: 0.6rem;
}

#place_order {
	width: 100%;
	margin-top: var(--s2);
}

.woocommerce-terms-and-conditions-wrapper {
	font-size: 0.8125rem;
	color: var(--muted);
	margin-block: var(--s2);
}

/* Account */

.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0 0 var(--s3);
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: var(--s2);
	border-bottom: 1px solid var(--hairline);
	padding-bottom: var(--s2);
}

.woocommerce-MyAccount-navigation a {
	font-size: 0.8125rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--muted);
}

.woocommerce-MyAccount-navigation li.is-active a {
	color: var(--ink);
}

/* Breadcrumb */

.woocommerce-breadcrumb {
	font-size: 0.75rem;
	color: var(--faint);
	letter-spacing: 0.04em;
	margin-bottom: var(--s3);
}

/* Sticky add-to-cart bar */

[data-sticky-atc] {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 80;
	background: var(--paper);
	border-top: 1px solid var(--hairline);
	padding: 0.75rem var(--gutter);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--s2);
	transform: translateY(110%);
	transition: transform var(--dur) var(--ease);
}

[data-sticky-atc].is-visible {
	transform: none;
}

@media (min-width: 56em) {
	[data-sticky-atc] {
		display: none;
	}
}

/* Reference panel note — sets expectations before the citation list */
.refs__note {
	font-size: 0.8125rem;
	line-height: 1.6;
	color: var(--muted);
	background: var(--shell);
	border-left: 2px solid var(--mint);
	padding: 0.85rem 1rem;
	margin: 0 0 var(--s2);
}

.citations li strong {
	color: var(--deep);
	font-weight: 600;
}

/* --------------------------------------------------------------------------
   11. WooCommerce specificity overrides

   Everything above is written at the lowest specificity that does the job.
   WooCommerce's own stylesheets qualify nearly every rule with a leading
   `.woocommerce` class, so despite loading first they still win on specificity
   — that is what puts float widths back on the product grid and repaints the
   add-to-cart button purple. These rules match Woo's specificity so the design
   holds. Grouped here rather than scattered above so it stays obvious that
   they exist only to outrank the plugin.

   Note the compound `.edgewise.woocommerce` with no space: WordPress puts
   both classes on the SAME <body> element, so a descendant combinator
   between them matches nothing.
   -------------------------------------------------------------------------- */

.edgewise.woocommerce ul.products {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--s4) var(--s3);
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 64em) {
	.edgewise.woocommerce ul.products.columns-3 {
		grid-template-columns: repeat(3, 1fr);
	}
	.edgewise.woocommerce ul.products.columns-4 {
		grid-template-columns: repeat(4, 1fr);
	}
}

.edgewise.woocommerce ul.products li.product,
.edgewise.woocommerce-page ul.products li.product {
	width: auto;
	float: none;
	clear: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	text-align: left;
}

.edgewise.woocommerce ul.products li.product a img {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: contain;
	background: var(--ground);
	margin: 0 0 var(--s2);
	box-shadow: none;
}

.edgewise.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--ff-display);
	font-size: 1.0625rem;
	font-weight: 500;
	line-height: 1.3;
	margin: 0 0 0.3rem;
	padding: 0;
}

.edgewise.woocommerce ul.products li.product .price,
.edgewise.woocommerce div.product p.price,
.edgewise.woocommerce div.product span.price {
	color: var(--ink);
	font-size: 0.9375rem;
	font-weight: 400;
	font-variant-numeric: tabular-nums;
	margin: 0 0 0.4rem;
}

.edgewise.woocommerce div.product p.price {
	font-size: 1.25rem;
	margin-bottom: var(--s2);
}

.edgewise.woocommerce ul.products li.product .price del,
.edgewise.woocommerce div.product p.price del {
	color: var(--faint);
	opacity: 1;
}

.edgewise.woocommerce ul.products li.product .price ins,
.edgewise.woocommerce div.product p.price ins {
	background: none;
	text-decoration: none;
	color: var(--alert);
	font-weight: 400;
}

/* Single product: two columns, no floats. */

.edgewise.woocommerce div.product {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--s4);
	padding-top: var(--s4);
}

@media (min-width: 56em) {
	.edgewise.woocommerce div.product {
		grid-template-columns: 1.15fr 1fr;
		gap: var(--s5);
		align-items: start;
	}
}

.edgewise.woocommerce div.product div.images,
.edgewise.woocommerce div.product div.summary,
.edgewise.woocommerce div.product .woocommerce-product-gallery {
	width: auto;
	float: none;
	margin: 0;
}

@media (min-width: 56em) {
	.edgewise.woocommerce div.product .woocommerce-product-gallery {
		position: sticky;
		top: 6rem;
	}
}

.edgewise.woocommerce div.product .woocommerce-tabs,
.edgewise.woocommerce div.product #reviews,
.edgewise.woocommerce div.product .clinical,
.edgewise.woocommerce div.product .related,
.edgewise.woocommerce div.product .upsells {
	grid-column: 1 / -1;
	width: auto;
	float: none;
}

.edgewise.woocommerce div.product .product_title {
	font-size: clamp(1.75rem, 1.3rem + 1.8vw, 2.5rem);
	font-weight: 500;
}

/* Buttons — Woo qualifies these six ways, so match it. */

.edgewise.woocommerce #respond input#submit,
.edgewise.woocommerce a.button,
.edgewise.woocommerce button.button,
.edgewise.woocommerce input.button,
.edgewise.woocommerce #respond input#submit.alt,
.edgewise.woocommerce a.button.alt,
.edgewise.woocommerce button.button.alt,
.edgewise.woocommerce input.button.alt {
	background: var(--ink);
	color: var(--paper);
	border: 1px solid var(--ink);
	border-radius: 0;
	padding: 0.95rem 1.9rem;
	font-family: var(--ff-body);
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	line-height: 1;
	text-shadow: none;
}

.edgewise.woocommerce #respond input#submit:hover,
.edgewise.woocommerce a.button:hover,
.edgewise.woocommerce button.button:hover,
.edgewise.woocommerce input.button:hover,
.edgewise.woocommerce #respond input#submit.alt:hover,
.edgewise.woocommerce a.button.alt:hover,
.edgewise.woocommerce button.button.alt:hover,
.edgewise.woocommerce input.button.alt:hover {
	background: var(--deep);
	border-color: var(--deep);
	color: var(--paper);
}

/* Loop button reads as secondary — the card's job is to get you to the page. */

.edgewise.woocommerce ul.products li.product .button {
	margin-top: auto;
	align-self: flex-start;
	background: transparent;
	color: var(--ink);
	border-color: var(--ink);
	padding: 0.7rem 1.35rem;
	font-size: 0.6875rem;
}

.edgewise.woocommerce ul.products li.product .button:hover {
	background: var(--ink);
	color: var(--paper);
}

.edgewise.woocommerce span.onsale {
	background: var(--ink);
	color: var(--paper);
	border-radius: 0;
	font-size: 0.625rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	font-weight: 500;
	min-height: 0;
	min-width: 0;
	line-height: 1;
	padding: 0.4rem 0.7rem;
	top: 0.75rem;
	left: 0.75rem;
	margin: 0;
}

.edgewise.woocommerce div.product form.cart div.quantity {
	float: none;
	margin: 0;
}

.edgewise.woocommerce .quantity input.qty {
	width: 3.25rem;
	border: 0;
	background: transparent;
}

.edgewise.woocommerce div.product form.cart .button {
	float: none;
	flex: 1;
	min-width: 12rem;
}

.edgewise.woocommerce div.product .woocommerce-tabs ul.tabs {
	padding: 0;
	margin: 0 0 var(--s3);
}

.edgewise.woocommerce div.product .woocommerce-tabs ul.tabs::before {
	border-bottom-color: var(--hairline);
}

.edgewise.woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: transparent;
	border: 0;
	border-radius: 0;
	padding: 0 1.25rem 0 0;
	margin: 0;
}

.edgewise.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.edgewise.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
	display: none;
}

.edgewise.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	font-family: var(--ff-body);
	font-size: 0.75rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--muted);
	padding: 0.6rem 0;
}

.edgewise.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--ink);
	box-shadow: inset 0 -2px 0 var(--deep);
}

.edgewise.woocommerce .related > h2,
.edgewise.woocommerce .upsells > h2,
.edgewise.woocommerce #reviews h2 {
	font-family: var(--ff-body);
	font-size: 0.75rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--muted);
	font-weight: 600;
}

.edgewise.woocommerce .woocommerce-message,
.edgewise.woocommerce .woocommerce-info {
	border-top-color: var(--deep);
	background: var(--shell);
}

.edgewise.woocommerce .woocommerce-message::before,
.edgewise.woocommerce .woocommerce-info::before {
	color: var(--deep);
}

.edgewise.woocommerce .woocommerce-error {
	border-top-color: var(--alert);
	background: var(--alert-bg);
}

.edgewise.woocommerce .star-rating span::before,
.edgewise.woocommerce p.stars a::before {
	color: var(--gold);
}

.edgewise.woocommerce table.shop_table {
	border: 0;
	border-radius: 0;
}

.edgewise.woocommerce table.shop_table th,
.edgewise.woocommerce table.shop_table td {
	border-top: 0;
	border-bottom: 1px solid var(--hairline);
}

/*
 * Woo's clearfix pseudo-elements become grid items.
 *
 * `.woocommerce ul.products::before/::after { content: " "; display: table; }`
 * is a float-era clearfix. Harmless in a float layout; in a grid container each
 * one is generated content that takes a cell, which is why the first product
 * used to sit in column two with an empty box beside it.
 */
.edgewise.woocommerce ul.products::before,
.edgewise.woocommerce ul.products::after,
.edgewise.woocommerce-page ul.products::before,
.edgewise.woocommerce-page ul.products::after {
	content: none;
	display: none;
}

/* Same story on the single-product wrapper, which is also a grid now. */
.edgewise.woocommerce div.product::before,
.edgewise.woocommerce div.product::after {
	content: none;
	display: none;
}

/*
 * Gallery overflow on narrow screens.
 *
 * WooCommerce's FlexSlider lays the gallery out as a wide track and slides it
 * with a transform, so on a phone the track runs past the viewport and the
 * whole page picks up a horizontal scrollbar. Clipping it at the gallery is
 * enough; the slider still works because it moves the track inside this box.
 */
.edgewise.woocommerce div.product > * {
	/* Grid tracks sized with 1fr take their minimum from the item's min-content
	   width. FlexSlider stamps an inline pixel width on each slide, so without
	   this the gallery's min-content pushes the whole column wider than the
	   phone and the page scrolls sideways. */
	min-width: 0;
}

.edgewise.woocommerce div.product .woocommerce-product-gallery,
.edgewise.woocommerce div.product .flex-viewport {
	max-width: 100%;
	min-width: 0;
	overflow: hidden;
}

/* One slide is shown at a time, so a slide is always exactly the viewport
   width. Overriding FlexSlider's measured inline value needs !important —
   there is no other way to beat a style attribute. */
.edgewise.woocommerce div.product .woocommerce-product-gallery__image {
	width: 100% !important;
	float: none !important;
	margin-right: 0 !important;
}

.edgewise.woocommerce div.product .woocommerce-product-gallery__wrapper {
	max-width: 100%;
	margin: 0;
	padding: 0;
}

/* Wide content scrolls inside its own box; the page never scrolls sideways. */
.tablescroll {
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.clinical {
	min-width: 0;
	max-width: 100%;
}

/* Woo's zoom clones the full-resolution image into the gallery at natural
   size. It is positioned, but it still needs a clipping ancestor or it widens
   the document on small screens. */
.edgewise.woocommerce div.product .woocommerce-product-gallery__image,
.edgewise.woocommerce div.product .woocommerce-product-gallery__image > a {
	overflow: hidden;
	display: block;
	max-width: 100%;
}

/* Gallery thumbnails. FlexSlider renders these as a plain <ol> with inline
   sizing; without an explicit grid they collapse to thumbnail-of-a-thumbnail
   size and collide with whatever follows the gallery. */
.edgewise.woocommerce div.product .flex-control-thumbs {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0.5rem;
	list-style: none;
	margin: 0.5rem 0 0;
	padding: 0;
	float: none;
	overflow: visible;
}

.edgewise.woocommerce div.product .flex-control-thumbs li {
	width: auto;
	float: none;
	margin: 0;
	list-style: none;
}

.edgewise.woocommerce div.product .flex-control-thumbs img {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	opacity: 0.5;
	cursor: pointer;
	transition: opacity var(--dur) var(--ease);
}

.edgewise.woocommerce div.product .flex-control-thumbs img.flex-active,
.edgewise.woocommerce div.product .flex-control-thumbs img:hover {
	opacity: 1;
}

/* Keep the clinical column optically centred under the two-column buy box. */
.edgewise.woocommerce div.product .clinical {
	margin-inline: auto;
}