/* How PEMF Works. Scoped page system; global tokens remain untouched. */
.bp-how-main {
	--how-cream: #f2e7d4;
	--how-ivory: #f6f2ea;
	--how-espresso: #33251e;
	--how-deep: #221711;
	--how-bronze: #b18b63;
	--how-bronze-text: #76502f;
	--how-bronze-light: #d8b78f;
	--how-body: #49382d;
	--how-muted: #746257;
	--how-line: rgba(51, 37, 30, 0.16);
	margin-block-start: 0;
	padding-top: var(--bp-header-height);
	color: var(--how-espresso);
	background: var(--how-ivory);
	font-family: "Hanken Grotesk", system-ui, sans-serif;
}
.bp-how-main > *, .bp-how-main + * { margin-block: 0; }
.bp-how-main :focus-visible { outline: 3px solid var(--how-bronze-text); outline-offset: 4px; }
.bp-how-shell { width: min(100%, 1320px); margin-inline: auto; }
.bp-how-section { padding: clamp(76px, 9vw, 132px) clamp(20px, 4vw, 64px); }
.bp-how-main h1, .bp-how-main h2, .bp-how-main h3, .bp-how-main p { margin-top: 0; }
.bp-how-main h1, .bp-how-main h2 { margin-bottom: 0; font-family: "Bodoni Moda", Georgia, serif; font-weight: 500; letter-spacing: -0.035em; text-wrap: balance; }
.bp-how-main h1 { font-size: clamp(42px, 5vw, 72px); line-height: .98; }
.bp-how-main h2 { font-size: clamp(32px, 3.6vw, 52px); line-height: 1.03; }
.bp-how-main h3 { margin-bottom: 0; font: 500 clamp(21px, 2vw, 28px)/1.15 "Bodoni Moda", Georgia, serif; }
.bp-how-main p { margin-bottom: 0; }
.bp-how-label { display: flex; align-items: center; gap: 13px; margin: 0; color: var(--how-bronze-text); font: 500 11px/1.4 "IBM Plex Mono", monospace; letter-spacing: .15em; text-transform: uppercase; }
.bp-how-label i { width: 42px; height: 1px; flex: none; background: var(--how-bronze); }
.bp-how-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 480px); gap: 24px clamp(40px, 7vw, 110px); align-items: end; }
.bp-how-head .bp-how-label { grid-column: 1 / -1; }
.bp-how-head__copy, .bp-how-head__intro { color: var(--how-body); font-size: 16px; line-height: 1.75; }
.bp-how-head__copy { display: grid; gap: 18px; }
.bp-how-head--dark .bp-how-label { color: var(--how-bronze-light); }
.bp-how-head--dark .bp-how-head__intro { color: rgba(246,242,234,.72); }
.bp-how-head--dark .bp-how-head__copy { color: rgba(246,242,234,.82); }
.bp-how-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 30px; }
.bp-how-button { min-height: 50px; display: inline-flex; align-items: center; gap: 14px; padding: 0 25px; color: var(--how-ivory); background: var(--how-espresso); font-weight: 600; font-size: 14px; text-decoration: none; transition: background-color 220ms ease; }
.bp-how-button:hover { color: var(--how-ivory); background: var(--how-bronze-text); }
.bp-how-button--light { color: var(--how-espresso); background: var(--how-cream); }
.bp-how-button--light:hover { color: var(--how-espresso); background: var(--how-ivory); }
.bp-how-text-link { min-height: 40px; display: inline-flex; align-items: center; gap: 10px; color: var(--how-espresso); border-bottom: 1px solid var(--how-bronze); font-weight: 600; font-size: 14px; text-decoration: none; }
.bp-how-text-link:hover { color: var(--how-bronze-text); }
.bp-how-text-link--light { color: var(--how-ivory); }
.bp-how-text-link--light:hover { color: var(--how-bronze-light); }

/* Hero */
.bp-how-hero { padding: clamp(56px, 7vw, 106px) clamp(20px, 4vw, 64px) clamp(80px, 9vw, 132px); overflow: hidden; background: var(--how-cream); }
.bp-how-hero__inner { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(380px, .92fr); gap: clamp(44px, 7vw, 116px); align-items: center; }
.bp-how-hero__copy { display: grid; gap: 25px; }
.bp-how-hero__lead { max-width: 680px; color: var(--how-bronze-text); font: italic 500 clamp(25px, 3vw, 42px)/1.12 "Bodoni Moda", Georgia, serif; }
.bp-how-hero__copy > p:last-of-type { max-width: 660px; color: var(--how-body); font-size: 17px; line-height: 1.72; }
.bp-how-hero__visual { display: grid; gap: 18px; margin: 0; }
.bp-how-orbit { position: relative; aspect-ratio: 1; display: grid; place-items: center; max-width: 520px; width: 100%; margin-left: auto; border: 1px solid var(--how-line); background: radial-gradient(circle, rgba(177,139,99,.14), transparent 56%); }
.bp-how-orbit::before, .bp-how-orbit::after, .bp-how-orbit > span:not(.bp-how-orbit__core) { content: ""; position: absolute; inset: 12%; border: 1px solid rgba(51,37,30,.22); border-radius: 50%; }
.bp-how-orbit::after { inset: 24%; }
.bp-how-orbit > span:nth-of-type(2) { inset: 35%; }
.bp-how-orbit > span:nth-of-type(3) { inset: 7% 28%; }
.bp-how-orbit > span:nth-of-type(4) { inset: 28% 7%; }
.bp-how-orbit__core { z-index: 2; display: grid; place-items: center; width: 118px; aspect-ratio: 1; border-radius: 50%; color: var(--how-cream); background: var(--how-espresso); font: 500 13px/1 "IBM Plex Mono", monospace; letter-spacing: .18em; }
.bp-how-orbit b { position: absolute; color: var(--how-bronze-text); font: 500 10px/1 "IBM Plex Mono", monospace; letter-spacing: .16em; }
.bp-how-orbit b:nth-of-type(1) { top: 8%; left: 10%; }
.bp-how-orbit b:nth-of-type(2) { top: 48%; right: 5%; }
.bp-how-orbit b:nth-of-type(3) { bottom: 8%; left: 18%; }
.bp-how-hero__visual figcaption, .bp-how-process__figure figcaption { color: var(--how-muted); font: 500 11px/1.55 "IBM Plex Mono", monospace; }

/* Fundamentals */
.bp-how-fundamentals { scroll-margin-top: var(--bp-header-height); background: var(--how-ivory); }
.bp-how-acronym { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: clamp(50px, 7vw, 90px); border-top: 1px solid var(--how-line); border-left: 1px solid var(--how-line); }
.bp-how-acronym article { min-width: 0; padding: clamp(24px, 3vw, 38px); border-right: 1px solid var(--how-line); border-bottom: 1px solid var(--how-line); }
.bp-how-acronym article > span { color: var(--how-bronze-text); font: 500 clamp(48px, 6vw, 82px)/1 "Bodoni Moda", Georgia, serif; }
.bp-how-acronym h3 { margin-top: 22px; }
.bp-how-acronym p { margin-top: 14px; color: var(--how-muted); font-size: 14px; line-height: 1.65; }

/* Process */
.bp-how-process { color: var(--how-ivory); background: var(--how-deep); }
.bp-how-process__figure { margin: clamp(52px, 7vw, 88px) 0 0; }
.bp-how-process__figure svg { display: block; width: 100%; height: auto; color: var(--how-cream); background-image: linear-gradient(rgba(246,242,234,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(246,242,234,.055) 1px, transparent 1px); background-size: 32px 32px; border: 1px solid rgba(246,242,234,.14); }
.bp-how-diagram__flow path { fill: none; stroke: var(--how-bronze-light); stroke-width: 2; marker-end: url(#bp-how-arrow); }
#bp-how-arrow path { fill: var(--how-bronze-light); }
.bp-how-diagram__node rect { fill: rgba(246,242,234,.04); stroke: rgba(246,242,234,.48); }
.bp-how-diagram__node text, .bp-how-diagram__field text { fill: var(--how-cream); text-anchor: middle; font: 500 12px "IBM Plex Mono", monospace; letter-spacing: 2px; }
.bp-how-diagram__node path { fill: none; stroke: var(--how-bronze-light); stroke-width: 2; }
.bp-how-diagram__signal, .bp-how-diagram__coil { stroke-linecap: round; stroke-linejoin: round; }
.bp-how-diagram__field ellipse { fill: none; stroke: rgba(216,183,143,.66); stroke-width: 1.5; }
.bp-how-process__figure figcaption { margin-top: 15px; color: rgba(246,242,234,.62); }
.bp-how-process__steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 0; margin: 48px 0 0; list-style: none; border-top: 1px solid rgba(246,242,234,.16); }
.bp-how-process__steps li { padding: 28px 24px 0 0; }
.bp-how-process__steps li + li { padding-left: 24px; border-left: 1px solid rgba(246,242,234,.16); }
.bp-how-process__steps span { color: var(--how-bronze-light); font: 500 10px/1 "IBM Plex Mono", monospace; }
.bp-how-process__steps h3 { margin-top: 15px; font-size: 22px; }
.bp-how-process__steps p { margin-top: 13px; color: rgba(246,242,234,.7); font-size: 14px; line-height: 1.65; }

/* Settings and hardware */
.bp-how-settings { background: var(--how-cream); }
.bp-how-glossary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: clamp(52px, 7vw, 88px); }
.bp-how-glossary article { padding: 0 clamp(20px, 2.5vw, 34px) 0 0; }
.bp-how-glossary article + article { padding-left: clamp(20px, 2.5vw, 34px); border-left: 1px solid var(--how-line); }
.bp-how-glossary article > span { display: grid; place-items: center; width: 58px; height: 58px; color: var(--how-cream); background: var(--how-espresso); font: 500 13px/1 "IBM Plex Mono", monospace; }
.bp-how-glossary h3 { margin-top: 24px; }
.bp-how-glossary p { margin-top: 14px; color: var(--how-muted); font-size: 14px; line-height: 1.7; }
.bp-how-note { max-width: 780px; margin: 56px 0 0; padding: 20px 24px; border-left: 3px solid var(--how-bronze); color: var(--how-body); background: rgba(246,242,234,.58); line-height: 1.65; }
.bp-how-hardware { background: var(--how-ivory); }
.bp-how-categories { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin-top: clamp(52px, 7vw, 88px); padding: 1px; background: var(--how-line); }
.bp-how-categories a { min-height: 330px; display: flex; flex-direction: column; padding: clamp(28px, 3vw, 42px); color: var(--how-espresso); background: var(--how-cream); text-decoration: none; transition: background-color 220ms ease; }
.bp-how-categories a:hover { background: #eadbc7; }
.bp-how-categories span { color: var(--how-bronze-text); font: 500 10px/1.4 "IBM Plex Mono", monospace; letter-spacing: .12em; text-transform: uppercase; }
.bp-how-categories h3 { margin-top: 36px; font-size: clamp(28px, 3vw, 40px); }
.bp-how-categories p { margin-top: 16px; color: var(--how-muted); line-height: 1.65; }
.bp-how-categories b { margin-top: auto; padding-top: 26px; font-size: 13px; border-bottom: 1px solid var(--how-bronze); align-self: flex-start; }

/* Equine context */
.bp-how-equine { color: var(--how-cream); background: var(--how-espresso); }
.bp-how-equine .bp-how-label { color: var(--how-bronze-light); }
.bp-how-equine__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(360px, .7fr); gap: clamp(50px, 9vw, 150px); }
.bp-how-equine h2 { margin-top: 24px; }
.bp-how-equine__lead { margin-top: 28px; max-width: 620px; color: var(--how-bronze-light); font: italic 500 22px/1.4 "Bodoni Moda", Georgia, serif; }
.bp-how-equine__content { padding-top: 38px; border-top: 1px solid rgba(246,242,234,.2); }
.bp-how-equine__content p { color: rgba(246,242,234,.78); line-height: 1.75; }
.bp-how-equine__content p + p { margin-top: 20px; }
.bp-how-equine__content ul { display: grid; gap: 12px; padding: 28px 0 0; margin: 28px 0 0; border-top: 1px solid rgba(246,242,234,.16); list-style: none; }
.bp-how-equine__content li::before { content: "—"; margin-right: 12px; color: var(--how-bronze-light); }

/* Evidence */
.bp-how-evidence { color: var(--how-ivory); background: var(--how-deep); }
.bp-how-evidence__levels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin-top: clamp(52px, 7vw, 88px); background: rgba(246,242,234,.16); }
.bp-how-evidence__levels article { padding: clamp(28px, 3.5vw, 48px); background: var(--how-deep); }
.bp-how-evidence__levels span { color: var(--how-bronze-light); font: 500 10px/1 "IBM Plex Mono", monospace; }
.bp-how-evidence__levels h3 { margin-top: 28px; }
.bp-how-evidence__levels p { margin-top: 16px; color: rgba(246,242,234,.7); font-size: 15px; line-height: 1.7; }
.bp-how-evidence__lower { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(42px, 8vw, 120px); margin-top: 70px; }
.bp-how-evidence__lower ul { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 28px; padding: 24px 0 0; margin: 20px 0 0; border-top: 1px solid rgba(246,242,234,.16); list-style: none; }
.bp-how-evidence__lower li { color: rgba(246,242,234,.74); font-size: 14px; }
.bp-how-evidence__lower li::before { content: "□"; margin-right: 10px; color: var(--how-bronze-light); }
.bp-how-evidence aside { padding: 30px; border: 1px solid rgba(246,242,234,.18); }
.bp-how-evidence aside p { margin-top: 14px; color: rgba(246,242,234,.65); line-height: 1.65; }
.bp-how-evidence aside ol { display: grid; gap: 16px; padding-left: 20px; margin: 24px 0 0; }
.bp-how-evidence aside a { color: var(--how-cream); text-decoration-color: var(--how-bronze-light); text-underline-offset: 3px; }
.bp-how-evidence aside a:hover { color: var(--how-bronze-light); }
.bp-how-evidence__context { max-width: 900px; margin-top: 64px; padding-top: 34px; border-top: 1px solid rgba(246,242,234,.16); }
.bp-how-evidence__context p { margin-top: 16px; color: rgba(246,242,234,.7); line-height: 1.75; }

/* Safety and buying */
.bp-how-safety { background: var(--how-cream); }
.bp-how-safety__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(380px, .75fr); gap: clamp(44px, 8vw, 120px); }
.bp-how-safety__grid .bp-how-head { grid-template-columns: 1fr; align-content: start; }
.bp-how-safety__grid ol, .bp-how-buying__body ol { padding: 0; margin: 0; list-style: none; border-top: 1px solid var(--how-line); }
.bp-how-safety__grid li, .bp-how-buying__body li { display: grid; grid-template-columns: 42px 1fr; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--how-line); line-height: 1.5; }
.bp-how-safety__grid li span, .bp-how-buying__body li span { color: var(--how-bronze-text); font: 500 10px/1.5 "IBM Plex Mono", monospace; }
.bp-how-disclaimer { width: min(calc(100% - 40px), 1320px); margin: clamp(54px, 7vw, 88px) auto 0; padding: 25px 28px; color: var(--how-cream); background: var(--how-espresso); line-height: 1.65; }
.bp-how-buying { background: var(--how-ivory); }
.bp-how-buying__body { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: clamp(44px, 8vw, 120px); margin-top: clamp(50px, 7vw, 84px); }
.bp-how-buying__body ol { display: grid; grid-template-columns: 1fr 1fr; column-gap: 34px; }
.bp-how-buying__links { display: flex; flex-direction: column; align-items: stretch; }
.bp-how-buying__links a { min-height: 58px; display: flex; align-items: center; justify-content: space-between; padding: 0 18px; color: var(--how-espresso); border-bottom: 1px solid var(--how-line); font-weight: 600; text-decoration: none; }
.bp-how-buying__links a:first-child { border-top: 1px solid var(--how-line); }
.bp-how-buying__links a:hover { color: var(--how-bronze-text); background: var(--how-cream); }

/* FAQ and CTA */
.bp-how-faq { background: var(--how-cream); }
.bp-how-faq .bp-how-head { grid-template-columns: 1fr; }
.bp-how-faq__list { margin-top: clamp(46px, 6vw, 76px); border-top: 1px solid var(--how-line); }
.bp-how-faq details { border-bottom: 1px solid var(--how-line); }
.bp-how-faq summary { min-height: 82px; display: grid; grid-template-columns: 50px 1fr 28px; gap: 18px; align-items: center; cursor: pointer; list-style: none; }
.bp-how-faq summary::-webkit-details-marker { display: none; }
.bp-how-faq summary > span { color: var(--how-bronze-text); font: 500 10px/1 "IBM Plex Mono", monospace; }
.bp-how-faq summary strong { font: 500 clamp(20px, 2.2vw, 28px)/1.2 "Bodoni Moda", Georgia, serif; }
.bp-how-faq summary i { position: relative; width: 18px; height: 18px; }
.bp-how-faq summary i::before, .bp-how-faq summary i::after { content: ""; position: absolute; top: 8px; left: 1px; width: 16px; height: 1px; background: var(--how-bronze-text); }
.bp-how-faq summary i::after { transform: rotate(90deg); transition: transform 180ms ease; }
.bp-how-faq details[open] summary i::after { transform: rotate(0); }
.bp-how-faq details > p { max-width: 780px; padding: 0 28px 28px 68px; color: var(--how-body); line-height: 1.75; }
.bp-how-cta { color: var(--how-ivory); background: var(--how-espresso); }
.bp-how-cta .bp-how-shell { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 50px; align-items: end; }
.bp-how-cta .bp-how-label { color: var(--how-bronze-light); }
.bp-how-cta h2 { margin-top: 24px; }
.bp-how-cta h2 em { display: block; color: var(--how-bronze-light); font-weight: 500; }
.bp-how-cta p { max-width: 720px; margin-top: 24px; color: rgba(246,242,234,.72); line-height: 1.7; }

@media (max-width: 1024px) {
	.bp-how-head, .bp-how-hero__inner, .bp-how-equine__grid, .bp-how-safety__grid { grid-template-columns: 1fr; }
	.bp-how-head__copy, .bp-how-head__intro { max-width: 680px; }
	.bp-how-hero__visual { width: min(100%, 560px); }
	.bp-how-orbit { margin-left: 0; }
	.bp-how-acronym, .bp-how-glossary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bp-how-glossary article { padding: 28px; border-bottom: 1px solid var(--how-line); }
	.bp-how-glossary article:nth-child(odd) { padding-left: 0; border-left: 0; }
	.bp-how-process__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bp-how-process__steps li:nth-child(3) { padding-left: 0; border-left: 0; }
	.bp-how-process__steps li:nth-child(n+3) { margin-top: 30px; padding-top: 28px; border-top: 1px solid rgba(246,242,234,.16); }
	.bp-how-categories { grid-template-columns: 1fr; }
	.bp-how-categories a { min-height: 260px; }
	.bp-how-equine__content { max-width: 760px; }
	.bp-how-evidence__lower { grid-template-columns: 1fr; }
	.bp-how-cta .bp-how-shell { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
	.bp-how-section { padding: 70px 20px; }
	.bp-how-main h1 { font-size: clamp(40px, 13vw, 56px); }
	.bp-how-main h2 { font-size: clamp(32px, 10vw, 44px); }
	.bp-how-hero { padding: 50px 20px 76px; }
	.bp-how-hero__inner { gap: 50px; }
	.bp-how-hero__visual { max-width: 420px; }
	.bp-how-acronym, .bp-how-glossary, .bp-how-process__steps, .bp-how-evidence__levels, .bp-how-evidence__lower ul, .bp-how-buying__body, .bp-how-buying__body ol { grid-template-columns: 1fr; }
	.bp-how-acronym article { min-height: 230px; }
	.bp-how-glossary article, .bp-how-glossary article:nth-child(odd) { padding: 28px 0; border-left: 0; border-bottom: 1px solid var(--how-line); }
	.bp-how-process__figure { overflow-x: auto; padding-bottom: 10px; }
	.bp-how-process__figure svg { width: 760px; max-width: none; }
	.bp-how-process__steps li, .bp-how-process__steps li + li, .bp-how-process__steps li:nth-child(3) { margin-top: 0; padding: 24px 0; border-top: 0; border-left: 0; border-bottom: 1px solid rgba(246,242,234,.16); }
	.bp-how-evidence__lower ul { gap: 14px; }
	.bp-how-safety__grid ol { margin-top: 8px; }
	.bp-how-buying__links { margin-top: 8px; }
	.bp-how-faq summary { grid-template-columns: 34px 1fr 24px; min-height: 92px; gap: 12px; }
	.bp-how-faq details > p { padding: 0 24px 28px 46px; }
	.bp-how-actions { align-items: stretch; flex-direction: column; }
	.bp-how-button { justify-content: space-between; }
	.bp-how-text-link { align-self: flex-start; }
}

@media (max-width: 420px) {
	.bp-how-orbit__core { width: 92px; }
	.bp-how-categories a { min-height: 300px; }
	.bp-how-evidence aside { padding: 24px 20px; }
	.bp-how-disclaimer { width: calc(100% - 40px); padding: 22px; }
}

@media (prefers-reduced-motion: reduce) {
	.bp-how-main *, .bp-how-main *::before, .bp-how-main *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}
