/* Shared guide presentation; article content and interactive tools keep their markup. */
.discovery-article .blog-article {
  --text: var(--ui-ink);
  --text-secondary: #48594e;
  --muted: var(--ui-muted);
  --line: var(--ui-line);
  --surface: var(--ui-card);
  --surface-raised: var(--ui-bg);
  --accent-ink: var(--ui-green);
  --accent-soft: var(--ui-soft);
  padding: 30px 0 64px;
  border: 0;
  font-size: 16px;
  line-height: 1.75;
}
:root[data-theme="dark"] .discovery-article .blog-article { --text-secondary: #c0cec4; }
.discovery-article .blog-article-header { max-width: 920px; margin: 0 auto 32px; }
.discovery-article .blog-breadcrumb { flex-wrap: wrap; gap: 8px; margin-bottom: 18px; font-size: 12px; font-weight: 550; line-height: 1.5; }
.discovery-article .blog-breadcrumb a { color: var(--ui-green); text-underline-offset: 3px; }
.discovery-article .blog-article-header h1 { max-width: 850px; font-size: 40px; font-weight: 650; line-height: 1.15; letter-spacing: -.045em; text-wrap: pretty; }
.discovery-article .blog-article-lede { max-width: 780px; margin: 16px 0 20px; color: var(--ui-muted); font-size: 17px; line-height: 1.7; }
.discovery-article .blog-article-meta { gap: 5px 18px; margin: 0; padding: 16px 0 0; border-top: 1px solid var(--ui-line); color: var(--ui-muted); font-size: 12px; font-weight: 450; line-height: 1.7; }
.discovery-article .blog-article-meta > span:first-child { flex-basis: 100%; color: var(--text-secondary); font-size: 13px; }
.discovery-article .blog-article-meta > [aria-hidden] { display: none; }
.discovery-article .blog-article-meta a { font-weight: 550; text-underline-offset: 3px; }
.discovery-article .guide-coffee-intro { margin: 18px 0 22px; }
.discovery-article .blog-cover { margin: 0; }
.discovery-article .blog-cover img { border-color: var(--ui-line); border-radius: 14px; box-shadow: none; }
.discovery-article .blog-cover figcaption { margin-top: 10px; color: var(--ui-muted); font-size: 12px; line-height: 1.6; }
.discovery-article .blog-article-body,
.discovery-article .seo-related-guides,
.discovery-article .seo-editorial-note { width: min(820px, 100%); margin-inline: auto; }
.discovery-article .blog-article-body a { text-underline-offset: 3px; }
.discovery-article .winner-summary { padding: 26px; border-color: var(--ui-line); border-radius: 14px; background: var(--ui-soft); }
.discovery-article .winner-summary h2 { color: var(--ui-ink); font-size: 26px; font-weight: 650; line-height: 1.25; letter-spacing: -.025em; }
.discovery-article .winner-kicker,
.discovery-article .session-length,
.discovery-article .calculator-kicker { font-size: 10px; font-weight: 650; letter-spacing: .09em; }
.discovery-article .winner-summary > p:not(.winner-kicker) { font-size: 15px; line-height: 1.75; }
.discovery-article .winner-summary dl div { border-color: var(--ui-line); border-radius: 10px; }
.discovery-article .article-contents { margin-top: 24px; padding: 22px 24px; border-color: var(--ui-line); border-radius: 14px; background: var(--ui-card); }
.discovery-article .article-contents h2 { margin-bottom: 12px; font-size: 18px; font-weight: 650; letter-spacing: -.02em; }
.discovery-article .article-contents ol { gap: 4px 28px; }
.discovery-article .article-contents li { padding-left: 3px; color: var(--ui-muted); font-size: 12px; }
.discovery-article .article-contents a { display: inline-block; padding: 8px 0; color: var(--ui-green); font-size: 14px; font-weight: 500; line-height: 1.5; }
.discovery-article .article-section { padding-top: 32px; scroll-margin-top: 20px; }
.discovery-article .article-section + .article-section { margin-top: 32px; border-color: var(--ui-line); }
.discovery-article .article-section > h2 { margin-bottom: 16px; font-size: 26px; font-weight: 650; line-height: 1.3; letter-spacing: -.03em; }
.discovery-article .article-section > h3 { margin: 28px 0 12px; font-size: 20px; font-weight: 600; line-height: 1.35; letter-spacing: -.02em; }
.discovery-article .session-grid article,
.discovery-article .category-winner-grid > div,
.discovery-article .budget-scenarios > div { border-color: var(--ui-line); border-radius: 12px; background: var(--ui-card); }
.discovery-article .session-grid article h3 { font-size: 19px; font-weight: 600; line-height: 1.35; letter-spacing: -.02em; }
.discovery-article .table-scroll { border-color: var(--ui-line); border-radius: 12px; background: var(--ui-card); scrollbar-width: thin; scrollbar-color: var(--ui-muted) var(--ui-bg); }
.discovery-article .table-scroll table { line-height: 1.55; }
.discovery-article .table-scroll thead th { padding-block: 14px; background: var(--ui-soft); font-weight: 600; }
.discovery-article .table-scroll tbody th { font-weight: 600; }
.discovery-article .table-scroll th,
.discovery-article .table-scroll td { border-color: var(--ui-line); }
.discovery-article .table-note { line-height: 1.7; }
.discovery-article .product-review { padding-top: 30px; }
.discovery-article .product-review + .product-review { margin-top: 30px; }
.discovery-article .product-review header h3 { font-size: 24px; font-weight: 650; line-height: 1.3; letter-spacing: -.025em; }
.discovery-article .product-front-link,
.discovery-article .retail-product-card,
.discovery-article .lab-candidate-grid article,
.discovery-article .lab-report-archive { border-color: var(--ui-line); border-radius: 12px; background: var(--ui-card); box-shadow: none; }
.discovery-article .product-front-link span,
.discovery-article .back-label-details summary,
.discovery-article .lab-report-archive > summary { font-weight: 550; }
.discovery-article .calorie-calculator,
.discovery-article .budget-calculator { border-color: var(--ui-line); border-radius: 14px; background: var(--ui-card); box-shadow: none; }
.discovery-article .calculator-heading h3,
.discovery-article .macro-editor-heading h3 { font-size: 23px; font-weight: 650; letter-spacing: -.025em; }
.discovery-article .calculator-results { background: var(--ui-bg); }
.discovery-article .calculator-field > span:first-child,
.discovery-article .calculator-field legend,
.discovery-article .budget-field { font-weight: 550; }
.discovery-article .calculator-unit-switch button,
.discovery-article .budget-presets button { font-weight: 550; }
.discovery-article .calculator-field input[type="number"],
.discovery-article .calculator-field select,
.discovery-article .calculator-choice-row label,
.discovery-article .budget-input { border-color: var(--ui-line); border-radius: 10px; }
.discovery-article .calculator-choice-row label { font-weight: 500; }
.discovery-article .calculator-choice-row label:has(input:checked) { border-color: var(--ui-green); }
.discovery-article .medical-disclaimer,
.discovery-article .article-newsletter { margin-top: 32px; border-radius: 14px; }
.discovery-article .medical-disclaimer h2,
.discovery-article .article-newsletter h2 { font-size: 22px; font-weight: 650; line-height: 1.3; letter-spacing: -.02em; }
.discovery-article .seo-related-guides { margin-block: 40px 24px; padding-top: 28px; border-top: 1px solid var(--ui-line); }
.discovery-article .seo-related-guides > h2,
.discovery-article .event-report-section h2 { margin: 0 0 16px; font-size: 21px; font-weight: 650; letter-spacing: -.03em; }
.discovery-article .seo-guide-grid article { padding: 18px; border-color: var(--ui-line); border-radius: 12px; background: var(--ui-card); }
.discovery-article .seo-guide-grid h3 { margin: 0 0 10px; font-size: 17px; font-weight: 600; line-height: 1.4; letter-spacing: -.02em; }
.discovery-article .seo-guide-grid p { margin: 0; color: var(--ui-muted); font-size: 13px; line-height: 1.7; }
.discovery-article .seo-editorial-note { font-size: 12px; line-height: 1.7; }
.discovery-article .event-report-section { margin-top: 28px; padding: 24px; border: 1px solid var(--ui-line); border-radius: 14px; background: var(--ui-card); }
.discovery-article .event-report-section p { color: var(--ui-muted); font-size: 14px; line-height: 1.7; }

@media (max-width: 620px) {
  .discovery-article .blog-article { padding: 24px 0 40px; font-size: 16px; }
  .discovery-article .blog-article-header { margin-bottom: 24px; }
  .discovery-article .blog-breadcrumb { margin-bottom: 14px; }
  .discovery-article .blog-article-header h1 { font-size: 32px; }
  .discovery-article .blog-article-lede { margin: 14px 0 18px; font-size: 16px; line-height: 1.65; }
  .discovery-article .blog-article-meta { gap: 4px 14px; }
  .discovery-article .blog-cover { margin-inline: 0; }
  .discovery-article .blog-cover img { border-radius: 12px; }
  .discovery-article .winner-summary,
  .discovery-article .article-contents,
  .discovery-article .event-report-section { padding: 20px; border-radius: 12px; }
  .discovery-article .winner-summary h2,
  .discovery-article .article-section > h2 { font-size: 23px; }
  .discovery-article .article-contents ol { grid-template-columns: 1fr; gap: 0; }
  .discovery-article .article-contents a { padding-block: 11px; }
  .discovery-article .article-section + .article-section { margin-top: 24px; }
  .discovery-article .table-scroll { margin-right: 0; }
  .discovery-article .seo-guide-grid { grid-template-columns: 1fr; gap: 12px; }
}
