/* ──────────────────────────────────────────────────────────────
   HACCP-Vorlage, Musterauszug
   Kapitel beider Pakete nebeneinander, darunter Textstellen wie
   Seiten aus dem Dokument.
   ────────────────────────────────────────────────────────────── */

.m-hero{padding-top:clamp(2.2rem,5vw,4.5rem)}
.m-hero__in{max-width:44rem}
.m-kicker{font-size:.9375rem;font-weight:600;color:var(--green)}
.m-hero h1{margin-top:.6rem;font-size:clamp(2.3rem,5vw,3.9rem);line-height:1;letter-spacing:-.045em}
.m-hero p.m-lede{margin-top:1.2rem;font-size:clamp(1.0625rem,1.6vw,1.1875rem);line-height:1.55}
.m-hero .hero__actions{margin-top:1.6rem}

/* Kapitel */
.chapters{display:grid;grid-template-columns:minmax(0,1fr);gap:1.4rem}
@media(min-width:860px){.chapters{grid-template-columns:1fr 1fr;gap:2rem}}
.chapter{border-top:3px solid var(--ink);padding-top:1.1rem}
.chapter--d{border-top-color:var(--green)}
.chapter__kind{font-size:.9375rem;font-weight:600;color:var(--green)}
.chapter h3{margin-top:.25rem;font-size:1.75rem;letter-spacing:-.035em}
.chapter__files{margin-top:.2rem;font-size:.9375rem;color:var(--muted)}
.chapter ol{list-style:none;margin:1rem 0 0;padding:0;counter-reset:c;border-top:1px solid var(--line)}
.chapter li{counter-increment:c;display:grid;grid-template-columns:2rem minmax(0,1fr);padding:.6rem 0;border-bottom:1px solid var(--line);
  font-size:.9688rem;line-height:1.5;color:var(--ink)}
.chapter li::before{content:counter(c);font-weight:700;color:var(--green)}

/* Textstellen */
.pages{margin-top:var(--gap);background:var(--paper-2);padding-block:clamp(3rem,6vw,4.5rem)}
.pages .section__head{margin-bottom:clamp(1.6rem,3.5vw,2.6rem)}
.sheets{display:grid;grid-template-columns:minmax(0,1fr);gap:1.4rem}
@media(min-width:1000px){.sheets{grid-template-columns:repeat(3,1fr);gap:1.6rem}}
.sheet-p{background:#fff;border:1px solid #d3d8d2;padding:1.5rem 1.5rem 1.6rem;box-shadow:0 18px 36px -28px rgba(20,25,30,.35)}
.sheet-p__label{font-size:.8125rem;font-weight:600;color:var(--muted);padding-bottom:.6rem;border-bottom:1px solid var(--line)}
.sheet-p h3{margin-top:1rem;font-size:1.1875rem;letter-spacing:-.02em;line-height:1.3}
.sheet-p ul{list-style:none;margin:.7rem 0 0;padding:0}
.sheet-p li{position:relative;padding-left:1.1rem;margin-top:.4rem;font-size:.9063rem;line-height:1.5;color:var(--ink-2)}
.sheet-p li::before{content:"";position:absolute;left:0;top:.62em;width:5px;height:5px;background:var(--green)}
.sheet-p .note{margin-top:1rem;padding:.7rem .85rem;background:#f0f7f2;font-size:.875rem;line-height:1.5;color:var(--ink-2)}
.sheet-p .note p{margin:0}
.sheet-p .note__label{display:block;color:var(--ink);font-weight:700}
.fill{margin-top:1.6rem;display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem 1rem;color:var(--ink-2)}
.fill mark{background:#fff3a6;color:var(--ink);padding:.1rem .4rem;font-weight:600}

/* Abschluss */
.m-end{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.2rem 3rem;
  padding:clamp(1.4rem,3vw,2rem);border:2px solid var(--ink)}
.m-end h2{font-size:clamp(1.5rem,2.8vw,2rem);letter-spacing:-.03em;line-height:1.15}
.m-end p{margin-top:.4rem;color:var(--ink-2);max-width:34rem}
.m-end__actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.6rem}

@media(max-width:600px){
  .m-hero{padding-top:1.6rem}
  .m-hero h1{font-size:2.2rem}
  .sheet-p{padding:1.2rem 1.1rem 1.3rem}
  .m-end__actions{flex-direction:column;align-items:stretch;width:100%}
  .m-end__actions .btn{text-align:center}
  .m-end__actions .more{align-self:center}
}