/* Landingpage /heizoel-additiv/ (Meta „css: heizoel“). Schrift-Rollen wie base.css:
   h1 step-4, h2 step-3, h3 step-1, Fließtext step-0, Quellenzeile step--1. */
.hz-def { max-width: 62ch; }
.hz-actions { display: flex; flex-wrap: wrap; gap: var(--space-xs); }
.hz-grid { display: grid; gap: var(--space-m); grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: start; }
.hz-steps { list-style: none; padding: 0; margin: 0; counter-reset: hz; display: grid; gap: var(--space-s); }
.hz-steps li { counter-increment: hz; display: grid; grid-template-columns: 2.6rem 1fr; column-gap: var(--space-s); align-items: start; }
.hz-steps li::before { content: counter(hz); grid-column: 1; grid-row: 1 / span 2; width: 2.6rem; height: 2.6rem; border-radius: 50%; display: grid; place-items: center;
  background: var(--color-primary); color: var(--color-on-primary); font-weight: 700; font-size: var(--step-0); }
.hz-steps li > h3, .hz-steps li > p { grid-column: 2; }
.hz-steps h3 { margin-bottom: .15rem; }
.hz-steps p { max-width: none; }
.hz-aside ul { padding-left: 1.2rem; display: grid; gap: .5rem; }
.wirk-quelle { margin-top: auto; padding-top: var(--space-2xs); font-size: var(--step--1); color: var(--color-muted); }
.wirk-quelle a { color: var(--color-primary-text); font-weight: 600; }
.hz-buy { display: grid; grid-template-columns: minmax(0, 16rem) 1fr; gap: var(--space-l); align-items: center;
  background: #fff; border: 1px solid var(--color-line); border-radius: var(--radius-lg); padding: var(--space-l); }
.hz-buy__media img { width: 100%; height: auto; border-radius: var(--radius); background: #fff; object-fit: contain; }
.hz-buy__price strong { font-size: var(--step-2); }
.hz-buy__price span { color: var(--color-muted); font-size: var(--step--1); }
.hz-faq { display: grid; gap: var(--space-m); }
.hz-faq article { background: #fff; border: 1px solid var(--color-line); border-radius: var(--radius); padding: var(--space-m) var(--space-l); }
.hz-faq h3 { margin-bottom: var(--space-2xs); }
.hz-faq p { max-width: none; }
.hz-faq a, .hz-more a { color: var(--color-primary-text); font-weight: 600; }
.hz-more { font-size: var(--step--1); color: var(--color-muted); }
@media (max-width: 52rem) {
  .hz-grid { grid-template-columns: 1fr; }
  .hz-buy { grid-template-columns: 1fr; padding: var(--space-m); }
  .hz-buy__media { max-width: 12rem; }
  .hz-faq article { padding: var(--space-m); }
}