/* Verkäuferwissen im vorhandenen Detmolder Editorial-Design. */
.sg-main { overflow: visible; }
.sg-main a:focus-visible, .sg-header a:focus-visible, .sg-footer a:focus-visible {
  outline: 3px solid #20231f;
  outline-offset: 5px;
}
.sg-breadcrumb { display: block; max-width: 1080px; margin: 28px auto 0; padding: 0 28px; text-align: left; font: 14px/1.6 var(--sans); }
.sg-breadcrumb a { display: inline; }
.sg-intro { max-width: 1080px; margin: auto; padding: 44px 28px 38px; }
.sg-intro h1 { max-width: 22ch; font-size: clamp(2.25rem, 4.8vw, 4.4rem); line-height: 1.08; letter-spacing: -.025em; text-wrap: balance; }
.sg-meta { display: flex; gap: 8px 20px; flex-wrap: wrap; color: #51554d; font: 13px/1.6 var(--sans); }
.sg-intro .lead { max-width: 800px; }
.sg-early { max-width: 780px; font-size: 17px; }
.sg-cover { max-width: 1024px; margin: 0 auto; position: relative; }
.sg-cover img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.sg-image-label { position: absolute; left: 16px; bottom: 16px; color: #fff; background: #20231f; padding: 7px 11px; font: 700 12px/1.5 var(--sans); }
.sg-reading { max-width: 856px; margin: auto; padding: 42px 28px 72px; }
.sg-toc { display: block; background: var(--card); border: 1px solid var(--line); padding: 26px; margin-bottom: 52px; font: 15px/1.55 var(--sans); text-align: left; }
.sg-toc h2 { font: 700 20px/1.3 var(--sans); margin: 0 0 14px; letter-spacing: 0; }
.sg-toc ol { margin: 0; padding-left: 22px; }
.sg-toc li + li { margin-top: 10px; }
.sg-toc a { display: inline; }
.sg-prose { font-size: 19px; line-height: 1.75; }
.sg-prose section { scroll-margin-top: 24px; margin-top: 54px; }
.sg-prose section:first-child { margin-top: 0; }
.sg-prose h2 { font-size: clamp(1.7rem, 3.4vw, 2.35rem); line-height: 1.2; text-wrap: balance; }
.sg-prose h3 { margin-top: 30px; }
.sg-prose p { margin: 0 0 22px; }
.sg-table-wrap { max-width: 100%; overflow-x: auto; margin: 30px 0; }
.sg-table-wrap:focus-visible { outline: 3px solid #20231f; outline-offset: 4px; }
.sg-prose table { border-collapse: collapse; width: 100%; background: var(--card); font: 16px/1.6 var(--sans); }
.sg-prose caption { text-align: left; padding-bottom: 12px; color: #51554d; font-size: 14px; }
.sg-prose th, .sg-prose td { padding: 14px 16px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.sg-prose thead { background: #e5e2d5; }
.sg-prose tbody th { font-weight: 400; width: 70%; }
.sg-prose td { white-space: nowrap; }
.sg-prose tbody tr:last-child { font-weight: 700; }
.sg-prose tbody tr:last-child th { font-weight: 700; }
.sg-end { padding: 34px; margin-top: 52px; border-top: 5px solid var(--moss); background: var(--card); }
.sg-end h2 { font-size: 32px; line-height: 1.15; }
.sg-end p { margin: 16px 0; }
.sg-end small { display: block; margin-top: 18px; font: 14px/1.6 var(--sans); }
@media (max-width: 760px) {
  .sg-breadcrumb { padding-inline: 20px; margin-top: 20px; }
  .sg-intro { padding: 28px 20px; }
  .sg-intro h1 { font-size: 36px; }
  .sg-cover { margin-inline: 20px; }
  .sg-image-label { left: 10px; bottom: 10px; padding: 5px 8px; font-size: 11px; }
  .sg-reading { padding: 30px 20px 52px; }
  .sg-toc { padding: 22px; margin-bottom: 40px; }
  .sg-prose { font-size: 18px; }
  .sg-prose section { margin-top: 42px; }
  .sg-prose th, .sg-prose td { padding: 12px 9px; font-size: 14px; }
  .sg-end { padding: 24px; }
  .sg-end h2 { font-size: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}