/* Article frame and block kit. Values come from tokens.css; Divi wrappers are targeted by our own classes only. */

.hd-article { font-family: var(--hd-font-body); color: var(--hd-ink); }
.hd-article .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; }
.hd-article :focus-visible { outline: 3px solid var(--hd-primary); outline-offset: 2px; border-radius: 4px; }
@media (prefers-reduced-motion: no-preference) { html:has(body.hd-article) { scroll-behavior: smooth; } }

/* ---------- Frame layout ---------- */
.hd-article .et_pb_section.hd-article-head-section { padding: 40px 0 8px; background: var(--hd-white); }
.hd-article .et_pb_section.hd-article-body-section { padding: 32px 0 80px; background: var(--hd-white); }
.hd-article .et_pb_row.hd-article-head,
.hd-article .et_pb_row.hd-article-grid { width: calc(100% - 32px); max-width: var(--hd-content); padding: 0; margin: 0 auto; }
.hd-article .et_pb_column.hd-article-cols { display: grid; grid-template-columns: minmax(0, var(--hd-read)) var(--hd-aside); justify-content: space-between; column-gap: var(--hd-gap); align-items: start; width: 100%; }
.hd-article .hd-article-main { min-width: 0; display: flex; flex-direction: column; gap: 56px; }
.hd-article .hd-article-main > .et_pb_module { margin: 0; }
.hd-article .et_pb_code.hd-aside-module { position: sticky; top: var(--hd-sticky-top); margin: 0; }
.hd-aside { display: flex; flex-direction: column; gap: 16px; }
.hd-only-narrow { display: none; }

@media (max-width: 980px) {
	.hd-article .et_pb_column.hd-article-cols { display: block; }
	.hd-article .et_pb_code.hd-aside-module { display: none; }
	.hd-article .hd-article-main { gap: 40px; }
	.hd-article .hd-only-narrow { display: block; }
}
/* Newsletter: in the sidebar on tall desktops, at the end of the article everywhere else (never both). */
@media (min-width: 981px) and (min-height: 900px) { .hd-article .hd-nl-end { display: none; } }
@media (max-height: 899px) { .hd-aside .hd-newsletter, .hd-aside .hd-admin-hint { display: none; } }
@media (max-height: 799px) { .hd-aside .hd-product__img { display: none; } }

/* ---------- Article header ---------- */
.hd-crumbs, .hd-crumbs p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--hd-muted); }
.hd-crumbs a { color: var(--hd-muted); text-decoration: none; }
.hd-crumbs a:hover { color: var(--hd-primary); text-decoration: underline; }
.hd-cat { display: inline-block; margin-top: 20px; padding: 6px 14px; border-radius: var(--hd-radius-pill); background: color-mix(in srgb, var(--hd-primary) 10%, var(--hd-white)); color: var(--hd-primary); font: 600 13px/1.2 var(--hd-font-body); letter-spacing: 0.04em; text-transform: uppercase; text-decoration: none; }
.hd-cat:hover { background: color-mix(in srgb, var(--hd-primary) 16%, var(--hd-white)); }
.hd-article .hd-title h1 { margin: 16px 0 0; padding: 0; max-width: 900px; font-family: var(--hd-font-head); font-size: clamp(34px, 4.6vw, 54px); line-height: 1.1; font-weight: 750; letter-spacing: -0.02em; color: var(--hd-ink); }
.hd-promise { margin: 16px 0 0; max-width: var(--hd-read); font-size: clamp(18px, 1.6vw, 21px); line-height: 1.55; color: var(--hd-muted); }
.hd-meta-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; margin-top: 24px; padding-bottom: 24px; border-bottom: 1px solid var(--hd-line); }
.hd-byline { display: flex; align-items: center; gap: 12px; }
.hd-byline__photo { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.hd-byline__text { display: flex; flex-direction: column; gap: 2px; font-size: 15px; line-height: 1.4; }
.hd-byline__by a { color: var(--hd-ink); font-weight: 600; text-decoration: none; }
.hd-byline__by a:hover { color: var(--hd-primary); }
.hd-byline__role, .hd-byline__facts { color: var(--hd-muted); }
.hd-byline__facts { display: flex; flex-wrap: wrap; gap: 6px; }
.hd-share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.hd-share__label { margin-right: 4px; font-size: 14px; color: var(--hd-muted); }
.hd-share__link { display: inline-flex; align-items: center; min-height: 36px; padding: 8px 14px; border: 1px solid var(--hd-line); border-radius: var(--hd-radius-pill); background: var(--hd-white); color: var(--hd-ink); font: 500 14px/1 var(--hd-font-body); text-decoration: none; cursor: pointer; }
.hd-share__link:hover { border-color: var(--hd-primary); color: var(--hd-primary); }
.hd-hero-figure { margin: 32px 0 0; }
.hd-hero-figure img { display: block; width: 100%; height: auto; border: 1px solid var(--hd-line); border-radius: var(--hd-radius-card); }

/* ---------- Reading column ---------- */
.hd-article-main .et_pb_post_content { font-size: 18px; line-height: 1.7; color: var(--hd-ink); }
.hd-article-main .et_pb_post_content .et_pb_section { padding: 0; background: transparent; }
.hd-article-main .et_pb_post_content .et_pb_row { width: 100%; max-width: none; padding: 0; }
/* Divi spaces modules with the column gap and zeroes their margins (four-class selectors); kit elements space themselves with margins, kept with !important, so the article body has no gap. */
.hd-article-main .et_pb_post_content .et_pb_column { gap: 0; }
/* Plain paragraphs and list items follow the reading column; kit elements (stat values, kickers, callout titles) keep their own type. */
.hd-article-main .et_pb_post_content :is(p, li):not([class]) { font-size: inherit; line-height: inherit; color: inherit; }
.hd-article-main .et_pb_post_content p { padding-bottom: 0; margin: 0 0 1.1em; }
.hd-article-main .et_pb_post_content :is(ul, ol):not([class]) { margin: 0 0 1.2em; padding-left: 1.4em; }
.hd-article-main .et_pb_post_content li + li { margin-top: 0.35em; }
.hd-article-main :is(h2, h3, h4) { scroll-margin-top: calc(var(--hd-sticky-top) + 16px); font-family: var(--hd-font-head); color: var(--hd-ink); letter-spacing: -0.01em; padding: 0; }
.hd-article-main .et_pb_post_content h2 { margin: 56px 0 16px; font-size: clamp(26px, 2.6vw, 32px); line-height: 1.2; font-weight: 700; }
.hd-article-main .et_pb_post_content h3 { margin: 36px 0 12px; font-size: clamp(21px, 2vw, 24px); line-height: 1.3; font-weight: 700; }
.hd-article-main .et_pb_post_content h4 { margin: 28px 0 8px; font-size: 19px; line-height: 1.35; font-weight: 700; }
.hd-article-main .et_pb_post_content a:not(.hd-btn):not(.hd-product__pricing):not(.et_pb_button) { color: var(--hd-primary); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.hd-article-main .et_pb_post_content a:not(.hd-btn):hover { color: var(--hd-primary-hover); text-decoration-thickness: 2px; }
.hd-article-main .et_pb_post_content :is(img, video) { max-width: 100%; height: auto; }

/* ---------- Buttons ---------- */
.hd-article .hd-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 22px; border: 0; border-radius: var(--hd-radius-pill); font: 600 15px/1.2 var(--hd-font-body); text-decoration: none; cursor: pointer; transition: background-color 0.15s; }
.hd-article .hd-btn--primary { background: var(--hd-primary); color: var(--hd-white); }
.hd-article .hd-btn--primary:hover { background: var(--hd-primary-hover); color: var(--hd-white); }
.hd-article .hd-btn:disabled { opacity: 0.6; cursor: progress; }
/* A download button (Button module with the class hd-download) looks like the primary button. */
.hd-article .et_pb_button.hd-download, .hd-article .et_pb_button.hd-download:hover { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 22px !important; border: 0; border-radius: var(--hd-radius-pill); background: var(--hd-primary); color: var(--hd-white); font: 600 15px/1.2 var(--hd-font-body); text-decoration: none; }
.hd-article .et_pb_button.hd-download:hover { background: var(--hd-primary-hover); }
.hd-article .et_pb_button.hd-download::after { display: none; }

/* ---------- TOC ---------- */
.hd-toc { position: relative; font-size: 15px; line-height: 1.4; }
.hd-toc__box { border: 1px solid var(--hd-line); border-radius: var(--hd-radius-card); background: var(--hd-white); }
.hd-toc__summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 14px 18px; list-style: none; cursor: pointer; color: var(--hd-muted); font: 700 13px/1.2 var(--hd-font-body); letter-spacing: 0.06em; text-transform: uppercase; }
.hd-toc__summary::-webkit-details-marker { display: none; }
.hd-toc__chevron { width: 9px; height: 9px; margin-top: -4px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform 0.2s; }
.hd-toc__box[open] .hd-toc__chevron { margin-top: 4px; transform: rotate(-135deg); }
.hd-article .hd-toc__list { /* beats Divi's .et-l--body ol */ position: relative; max-height: 50vh; margin: 0; padding: 0 10px 12px; overflow-y: auto; overscroll-behavior: contain; list-style: none; }
.hd-toc__item { margin: 0; padding: 0; }
.hd-toc__link { display: block; padding: 7px 10px; border-left: 2px solid transparent; border-radius: 0 8px 8px 0; color: var(--hd-ink); text-decoration: none; }
.hd-toc__link:hover { background: var(--hd-soft); color: var(--hd-primary); }
.hd-toc__link[aria-current="location"] { border-left-color: var(--hd-primary); background: var(--hd-soft); color: var(--hd-primary); font-weight: 600; }
.hd-article .hd-toc__sub { display: none; margin: 0; padding: 0 0 4px 12px; list-style: none; }
.hd-toc__item.is-active > .hd-toc__sub, .hd-toc--inline .hd-toc__sub { display: block; }
.hd-toc__sub .hd-toc__link { padding: 5px 10px; font-size: 14px; color: var(--hd-muted); }
.hd-toc.is-compact .hd-toc__box[open] .hd-toc__list { position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 20; max-height: 60vh; padding-top: 10px; border: 1px solid var(--hd-line); border-radius: var(--hd-radius-card); background: var(--hd-white); box-shadow: 0 16px 40px rgba(14, 20, 48, 0.14); }
.hd-toc--inline .hd-toc__list { max-height: none; }

/* ---------- Product card ---------- */
.hd-product { padding: 20px; border: 1px solid var(--hd-line); border-radius: var(--hd-radius-card); background: var(--hd-soft); }
.hd-product__label { margin: 0 0 10px; color: var(--hd-muted); font: 600 12px/1 var(--hd-font-body); letter-spacing: 0.06em; text-transform: uppercase; }
.hd-product__img { display: block; width: 100%; height: auto; margin-bottom: 14px; border-radius: 12px; }
.hd-product__name { margin: 0; padding: 0; color: var(--hd-ink); font: 700 20px/1.25 var(--hd-font-head); }
.hd-badge { display: inline-block; margin-left: 6px; padding: 3px 8px; border-radius: var(--hd-radius-pill); background: var(--hd-yellow); color: var(--hd-ink); vertical-align: middle; font: 700 11px/1.2 var(--hd-font-body); letter-spacing: 0.04em; text-transform: uppercase; }
.hd-product__tagline { margin: 8px 0 0; padding: 0; color: var(--hd-muted); font-size: 15px; line-height: 1.5; }
.hd-article .hd-product__points { /* beats Divi's .et-l--body ul */ display: grid; gap: 6px; margin: 12px 0 0; padding: 0; list-style: none; font-size: 14px; line-height: 1.45; }
.hd-product__points li { position: relative; margin: 0; padding-left: 24px; }
.hd-product__points li::before { content: ""; position: absolute; top: 2px; left: 0; width: 16px; height: 16px; border-radius: 50%; background: var(--hd-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2 5 8.5l4.5-5' fill='none' stroke='%230E1430' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 10px no-repeat; }
.hd-product__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 16px; }
.hd-product__price { margin: 0; padding: 0; color: var(--hd-ink); font-size: 14px; font-weight: 600; }
.hd-product__pricing { color: var(--hd-primary); font-size: 14px; text-decoration: underline; text-underline-offset: 3px; }
.hd-product__note { margin: 10px 0 0; padding: 0; color: var(--hd-muted); font-size: 13px; }
.hd-product--cta { margin: 40px 0; padding: 28px; border-color: var(--hd-ink); background: var(--hd-ink); color: var(--hd-white); }
.hd-product--cta :is(.hd-product__name, .hd-product__price, .hd-product__points) { color: var(--hd-white); }
.hd-product--cta :is(.hd-product__label, .hd-product__tagline, .hd-product__note) { color: #C9CEE3; }
.hd-article-main .et_pb_post_content .hd-product--cta .hd-product__pricing { color: var(--hd-white); }

/* ---------- Newsletter ---------- */
.hd-newsletter { padding: 20px; border: 1px solid var(--hd-line); border-radius: var(--hd-radius-card); background: var(--hd-white); }
.hd-newsletter__title { margin: 0; padding: 0; font: 700 18px/1.3 var(--hd-font-head); color: var(--hd-ink); }
.hd-newsletter__text { margin: 6px 0 12px; padding: 0; color: var(--hd-muted); font-size: 14px; line-height: 1.5; }
.hd-newsletter__row { display: flex; flex-wrap: wrap; gap: 8px; }
.hd-newsletter input[type="email"] { flex: 1 1 180px; min-width: 0; min-height: 44px; padding: 10px 16px; border: 1px solid #8A90A8; border-radius: var(--hd-radius-pill); background: var(--hd-white); color: var(--hd-ink); font: 400 15px var(--hd-font-body); }
.hd-newsletter input[aria-invalid="true"] { border-color: var(--hd-error); }
.hd-newsletter--aside .hd-newsletter__row { flex-direction: column; }
/* In a column the input's 180px basis would become its height. */
.hd-newsletter--aside input[type="email"] { flex: 0 0 auto; }
.hd-newsletter__status { min-height: 1.4em; margin: 8px 0 0; padding: 0; font-size: 14px; }
.hd-newsletter__status.is-error { color: var(--hd-error); }
.hd-newsletter.is-done .hd-newsletter__row { display: none; }
.hd-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.hd-admin-hint { margin: 0; padding: 10px 12px; border: 1px dashed var(--hd-error); border-radius: 12px; color: var(--hd-error); font-size: 13px; }

/* ---------- Author box ---------- */
.hd-author { display: grid; grid-template-columns: 96px 1fr; gap: 20px; padding: 28px; border: 1px solid var(--hd-line); border-radius: var(--hd-radius-card); background: var(--hd-soft); }
.hd-author__photo { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; }
.hd-author__body p { margin: 0; padding: 0; }
.hd-author__eyebrow { color: var(--hd-muted); font: 600 12px/1 var(--hd-font-body); letter-spacing: 0.06em; text-transform: uppercase; }
.hd-author__name { margin-top: 6px !important; font: 700 22px/1.25 var(--hd-font-head); }
.hd-author__name a { color: var(--hd-ink); text-decoration: none; }
.hd-author__role { margin-top: 2px !important; color: var(--hd-muted); font-size: 15px; }
.hd-author__bio { margin-top: 12px !important; font-size: 16px; line-height: 1.65; }
.hd-article .hd-author__links { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 0; padding: 0; list-style: none; }
.hd-author__links a { display: inline-flex; min-height: 32px; align-items: center; padding: 4px 12px; border: 1px solid var(--hd-line); border-radius: var(--hd-radius-pill); background: var(--hd-white); color: var(--hd-ink); font-size: 14px; text-decoration: none; }
.hd-author__more { display: inline-block; margin-top: 14px; color: var(--hd-primary); font-weight: 600; text-decoration: none; }
.hd-author__more:hover { text-decoration: underline; }
@media (max-width: 600px) { .hd-author { grid-template-columns: 1fr; padding: 22px; } .hd-author__photo { width: 72px; height: 72px; } }

/* ---------- Related cards (also used by Plan 2's index) ---------- */
.hd-related__title { margin: 0 0 20px; padding: 0; color: var(--hd-ink); font: 700 clamp(24px, 2.4vw, 30px)/1.2 var(--hd-font-head); }
.hd-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); gap: 20px; }
.hd-card { margin: 0; }
.hd-card__link { display: flex; flex-direction: column; height: 100%; overflow: hidden; border: 1px solid var(--hd-line); border-radius: var(--hd-radius-card); background: var(--hd-white); color: var(--hd-ink); text-decoration: none; transition: box-shadow 0.2s, transform 0.2s; }
.hd-card__link:hover { box-shadow: 0 10px 30px rgba(14, 20, 48, 0.08); transform: translateY(-2px); }
.hd-card__media { display: block; aspect-ratio: 16 / 9; background: var(--hd-soft); }
.hd-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.hd-card__body { display: flex; flex: 1; flex-direction: column; gap: 8px; padding: 16px 18px 18px; }
.hd-card__cat { color: var(--hd-primary); font: 600 12px/1 var(--hd-font-body); letter-spacing: 0.06em; text-transform: uppercase; }
.hd-card__title { margin: 0; padding: 0; color: var(--hd-ink); font: 700 18px/1.3 var(--hd-font-head); }
.hd-card__summary { color: var(--hd-muted); font-size: 14px; line-height: 1.5; }
.hd-card__meta { margin-top: auto; color: var(--hd-muted); font-size: 13px; }

/* ---------- Block kit ---------- */
.hd-article .hd-takeaways { margin: 8px 0 32px !important; padding: 24px 28px; border-left: 4px solid var(--hd-primary); border-radius: 0 var(--hd-radius-card) var(--hd-radius-card) 0; background: var(--hd-soft); }
.hd-kicker { margin: 0 0 10px !important; color: var(--hd-primary); font: 700 13px/1.2 var(--hd-font-body); letter-spacing: 0.06em; text-transform: uppercase; }
.hd-article-main .et_pb_post_content .hd-takeaways ul { /* beats the reading column's list indent */ margin: 0; padding: 0; list-style: none; }
.hd-takeaways li { position: relative; padding-left: 28px; }
.hd-takeaways li::before { content: ""; position: absolute; top: 0.45em; left: 0; width: 16px; height: 16px; border-radius: 50%; background: var(--hd-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2 5 8.5l4.5-5' fill='none' stroke='%230E1430' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 10px no-repeat; }
.hd-article .hd-hook p:first-child { font-size: 21px; line-height: 1.6; }

.hd-article .hd-callout { margin: 32px 0 !important; padding: 18px 22px; border: 1px solid; border-radius: 14px; }
:is(.hd-callout, .hd-takeaways, .hd-step) :is(p, ul, ol):last-child { margin-bottom: 0 !important; }
.hd-callout__title { margin: 0 0 6px !important; font: 700 15px/1.3 var(--hd-font-body); }
.hd-article .hd-callout--tip { border-color: color-mix(in srgb, var(--hd-green) 70%, var(--hd-ink)); background: color-mix(in srgb, var(--hd-green) 16%, var(--hd-white)); }
.hd-article .hd-callout--warning { border-color: #C99A00; background: color-mix(in srgb, var(--hd-yellow) 20%, var(--hd-white)); }
.hd-article .hd-callout--note { border-color: var(--hd-line); background: var(--hd-soft); }
.hd-article .hd-callout--pro { border-color: var(--hd-primary); background: color-mix(in srgb, var(--hd-primary) 7%, var(--hd-white)); }

.hd-article .hd-steps { counter-reset: hd-step; margin: 32px 0 !important; }
.hd-article .hd-step { position: relative; counter-increment: hd-step; padding-left: 52px; }
.hd-article .hd-step::before { content: counter(hd-step); position: absolute; top: 0; left: 0; display: grid; width: 36px; height: 36px; place-items: center; border-radius: 50%; background: var(--hd-primary); color: var(--hd-white); font: 700 16px/1 var(--hd-font-body); }
.hd-step__title { margin: 4px 0 6px !important; font: 700 19px/1.35 var(--hd-font-head); }

.hd-article .hd-figure { margin: 32px 0 0 !important; }
.hd-article .hd-figure img { display: block; border: 1px solid var(--hd-line); border-radius: 14px; }
.hd-article .hd-figure-caption, .hd-article .hd-figure-caption p { margin: 8px 0 32px !important; color: var(--hd-muted); font-size: 14px; line-height: 1.5; }
.hd-article .hd-beforeafter { margin: 32px 0 !important; overflow: hidden; border-radius: 14px; }

.hd-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 32px 0; }
.hd-stat { padding: 18px; border: 1px solid var(--hd-line); border-radius: 14px; background: var(--hd-white); }
.hd-stat__value { margin: 0 !important; color: var(--hd-primary); font: 750 30px/1.1 var(--hd-font-head); }
.hd-stat__label { margin: 6px 0 0 !important; color: var(--hd-muted); font-size: 14px !important; line-height: 1.45 !important; }

.hd-chart { margin: 32px 0; padding: 20px; border: 1px solid var(--hd-line); border-radius: 14px; }
.hd-chart__title { margin-bottom: 12px; font: 700 17px/1.35 var(--hd-font-head); }
.hd-chart__table { width: 100%; border-collapse: collapse; font-size: 15px; }
.hd-chart__table th { width: 34%; padding: 6px 12px 6px 0; font-weight: 500; text-align: left; vertical-align: middle; }
.hd-chart__table td { display: flex; align-items: center; gap: 10px; padding: 6px 0; }
/* Scaled within the room left after the number, so flexbox never shrinks the longest bars to one length. */
.hd-chart__bar { display: block; flex: none; height: 14px; width: calc((100% - 5.5em) * var(--v, 0) / 100); min-width: 2px; border-radius: 0 7px 7px 0; background: var(--hd-primary); }
.hd-chart__num { font-variant-numeric: tabular-nums; font-weight: 600; }
.hd-chart__source { margin: 12px 0 0 !important; color: var(--hd-muted); font-size: 13px !important; }

.hd-compare { margin: 32px 0; overflow-x: auto; }
.hd-compare table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.5; }
.hd-compare :is(th, td) { padding: 12px 14px; border-bottom: 1px solid var(--hd-line); text-align: left; vertical-align: top; }
.hd-compare thead th { background: var(--hd-soft); font-weight: 700; }
.hd-compare caption { padding: 0 0 8px; font: 700 17px/1.35 var(--hd-font-head); text-align: left; }
.hd-compare__more summary { margin-top: 12px; color: var(--hd-primary); font-weight: 600; cursor: pointer; }
@media (max-width: 600px) {
	.hd-compare thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
	.hd-compare :is(table, tbody, tr, th, td) { display: block; width: 100%; }
	.hd-compare tr { margin-bottom: 12px; padding: 4px 14px; border: 1px solid var(--hd-line); border-radius: 14px; }
	.hd-compare tbody th { padding-left: 0; border-bottom: 1px solid var(--hd-line); font-size: 17px; }
	.hd-compare td { display: grid; grid-template-columns: 42% 1fr; gap: 8px; padding-left: 0; }
	.hd-compare td::before { content: attr(data-label); color: var(--hd-muted); font-weight: 600; }
	.hd-compare tr > :last-child { border-bottom: 0; }
}

.hd-code { position: relative; margin: 32px 0; }
.hd-code__label { margin: 0 0 6px !important; color: var(--hd-muted); font: 600 12px/1 var(--hd-font-body); letter-spacing: 0.06em; text-transform: uppercase; }
.hd-code pre { margin: 0; padding: 18px 20px; overflow-x: auto; border-radius: 14px; background: var(--hd-ink); color: #E8EBF7; font: 14px/1.6 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; tab-size: 2; }
.hd-code__copy { position: absolute; top: 26px; right: 10px; min-height: 32px; padding: 4px 12px; border: 1px solid rgba(255, 255, 255, 0.25); border-radius: var(--hd-radius-pill); background: rgba(255, 255, 255, 0.08); color: var(--hd-white); font: 500 13px/1 var(--hd-font-body); cursor: pointer; }
.hd-code__copy:hover { background: rgba(255, 255, 255, 0.18); }

.hd-article .et_pb_toggle.hd-faq { margin: 0; padding: 18px 0; border: 0; border-bottom: 1px solid var(--hd-line); background: transparent; }
.hd-article .et_pb_toggle.hd-faq .et_pb_toggle_title { /* an h3: no reading-column heading margins */ margin: 0; padding-right: 36px; color: var(--hd-ink); font: 700 18px/1.4 var(--hd-font-head); }
.hd-article .et_pb_toggle.hd-faq .et_pb_toggle_title::before { color: var(--hd-primary); }
.hd-article .et_pb_toggle.hd-faq .et_pb_toggle_content { padding-top: 10px; font-size: 17px; line-height: 1.65; }
.hd-article .hd-sources { color: var(--hd-muted); font-size: 15px; line-height: 1.6; }
.hd-article .hd-sources ol { padding-left: 1.4em; }

/* ---------- Reading helpers ---------- */
.hd-progress { position: fixed; top: 0; right: 0; left: 0; z-index: 100000; height: 3px; pointer-events: none; }
.hd-progress span { display: block; height: 100%; background: var(--hd-primary); transform: scaleX(0); transform-origin: 0 50%; }
.hd-backtop { position: fixed; right: 20px; bottom: 20px; z-index: 999; display: grid; width: 48px; height: 48px; place-items: center; border: 1px solid var(--hd-line); border-radius: 50%; background: var(--hd-white); box-shadow: 0 8px 24px rgba(14, 20, 48, 0.12); color: var(--hd-ink); font-size: 20px; cursor: pointer; }
.hd-backtop[hidden] { display: none; }
.hd-audit { position: fixed; bottom: 16px; left: 16px; z-index: 100001; max-width: 420px; padding: 10px 14px; border: 2px solid #C99A00; border-radius: 12px; background: #FFF8E1; color: var(--hd-ink); font: 14px/1.5 var(--hd-font-body); }
.hd-audit ul { margin: 8px 0 0; padding-left: 18px; }

@media (prefers-reduced-motion: reduce) {
	.hd-card__link, .hd-toc__chevron, .hd-article .hd-btn { transition: none; }
	.hd-card__link:hover { transform: none; }
}