/* =====================================================================
   formatplus informiert: Übersicht, Beitrag und Abschnitt auf der Startseite
   (Website-Stratege, 25.10.2026; Entwurf A, Daniel: „Wunderbar“). Ruhiger Stil wie main.ap,
   Karten weiß mit feiner Linie, Lesetext linksbündig. Bilder erzeugt werkzeuge/informiert/bauen.mjs.
   ===================================================================== */
.inf-raster{display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.inf-start{margin-top:8px}
.inf-karte{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;color:var(--ink);text-decoration:none;text-align:left;transition:transform .1s ease-out,box-shadow .2s}
.inf-karte:hover{box-shadow:0 18px 40px -26px rgba(20,23,29,.45)}
.inf-karte:active{transform:scale(.985)}
.inf-karte[hidden]{display:none}
.inf-karte img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;background:#fbf3e8}
.inf-karte-text{display:flex;flex-direction:column;gap:6px;padding:16px 18px 20px;min-width:0}
.inf-karte-text small{font-size:.8rem;color:var(--muted)}
.inf-karte-text b{font-family:var(--font-head);font-weight:800;font-size:1.12rem;line-height:1.2;letter-spacing:-.01em}
.inf-anr{font-size:.92rem;color:var(--muted);line-height:1.45}
.inf-tag{font-weight:600}
.inf-tag.heute{display:inline-block;background:var(--accent);color:var(--btn-ink,#1c1106);border-radius:999px;padding:1px 8px}
.inf-alle{margin-top:22px;text-align:center}
.inf-filter{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.inf-filter button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 14px;font:inherit;font-weight:600;font-size:.9rem;color:var(--ink);cursor:pointer;transition:transform .1s ease-out}
.inf-filter button:active{transform:scale(.97)}
.inf-filter button[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}

/* Beitrag */
.inf-artikel .wrap{max-width:760px;padding-block:clamp(28px,6vw,64px) clamp(40px,7vw,80px);text-align:left}
.inf-zurueck{color:var(--link);font-weight:600;text-decoration:none}
.inf-meta{margin-top:16px;font-size:.88rem;color:var(--muted)}
.inf-artikel h1{font-family:var(--font-head);font-weight:800;font-size:clamp(1.9rem,6vw,2.9rem);line-height:1.08;letter-spacing:-.025em;margin-top:8px;text-wrap:balance;text-align:left}
.inf-lead{font-size:1.15rem;color:var(--muted);margin-top:14px;line-height:1.5}
.inf-bild{display:block;width:100%;height:auto;border-radius:20px;margin:26px 0 8px;border:1px solid var(--line)}
.inf-text{font-size:1.06rem;line-height:1.65}
.inf-text h2{font-family:var(--font-head);font-weight:800;font-size:1.3rem;letter-spacing:-.01em;margin:26px 0 8px;text-align:left}
.inf-text p{margin:0}
.inf-text ul{margin:0;padding-left:1.2em;display:flex;flex-direction:column;gap:6px}
.inf-quelle{margin-top:30px;padding-top:16px;border-top:1px solid var(--line);font-size:.86rem;color:var(--muted)}
.inf-blaettern{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin-top:28px}
.inf-blaettern a{border:1px solid var(--line);border-radius:14px;padding:12px 14px;text-decoration:none;color:var(--ink);font-weight:600;font-size:.92rem;min-width:0;background:#fff}
.inf-blaettern a small{display:block;font-weight:400;color:var(--muted);font-size:.78rem}
.inf-blaettern .neuer{text-align:right;grid-column:2}
@media (max-width:420px){.inf-blaettern{grid-template-columns:minmax(0,1fr)}.inf-blaettern .neuer{grid-column:1;text-align:left}}
.inf-leer{font-size:1.1rem;color:var(--muted);text-align:center;padding-block:20px}