/* ============================================================
   LLM-HARDWARE-RECHNER — nur Seitenspezifisches
   ============================================================
   Die Seite lebt von den gemeinsamen .v4-page-Komponenten aus
   style-v4.css. Das Rechner-Widget selbst (alles ab
   [data-llm-rechner]) bleibt UNVERAENDERT und wird weiter von
   style.css gestylt — sein dunkles Navy ist zugleich das eine
   dunkle Band der Seite. Auch Nachschlage-Tabelle (.llm-tabelle),
   Glossar (.llm-glossar), Quellen (.llm-quellen), Stand-Zeile
   (.llm-stand) und Frage-Box (.llm-frage-box) behalten ihre
   Klassen aus style.css: an ihnen haengen dort Bildschirm- UND
   Druckregeln. Hier stehen nur: das zweispaltige Hero mit der
   Datenschutz-Grafik, Kontextabstaende — und die Druckregeln,
   die die Datenblatt-Druckfassung (style.css, @media print unter
   .seite-llm) fuer die neuen V4-Sektionen fortfuehren.
   ============================================================ */

/* ---- Hero: Text links, Betriebsgrenzen-Grafik rechts
        (gleiche Bauform wie llm-modell-v4.css) ---- */
.v4-llmrechner .v4-hero-raster {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 400px;
  gap: var(--v4-space-8);
  align-items: center;
}
.v4-llmrechner .v4-llm-hero-text {
  color: var(--v4-text-secondary);
  max-width: 62ch;
}
.v4-llmrechner .v4-llm-hero-grafik svg {
  max-width: 100%;
  height: auto;
  display: block;
}
@media (max-width: 900px) {
  .v4-llmrechner .v4-hero-raster { grid-template-columns: 1fr; }
  .v4-llmrechner .v4-hero h1 { font-size: clamp(34px, 5vw, 42px); }
  /* Wie auf der Altseite: unter 900 px faellt die Grafik weg,
     der Text traegt allein. */
  .v4-llmrechner .v4-llm-hero-grafik { display: none; }
}

/* ---- Rechner-Sektion: Einleitungstexte und Abstand zum Widget ---- */
.v4-llmrechner .v4-llm-intro {
  color: var(--v4-text-secondary);
  max-width: 68ch;
  margin-bottom: var(--v4-space-2);
}
.v4-llmrechner [data-llm-rechner] { margin-top: var(--v4-space-4); }

/* ---- Kartenraster «Warum lokal?» und «Ehrlich eingeordnet» ---- */
.v4-llmrechner .v4-llm-warum { margin-top: var(--v4-space-4); }
.v4-llmrechner .v4-llm-warum h3 { font-size: 17px; }
.v4-llmrechner .v4-llm-aktuell-raster { margin-top: var(--v4-space-4); }
.v4-llmrechner .v4-llm-aktuell-raster h3 { font-size: 17px; }
.v4-llmrechner .v4-llm-aktuell-raster p:last-child { margin-bottom: 0; }
.v4-llmrechner .v4-llm-einordnung { margin-top: var(--v4-space-4); }
.v4-llmrechner .v4-llm-einordnung p {
  color: var(--v4-text-secondary);
  margin-bottom: 0;
}

/* ---- Nachschlage-Tabelle: Abstaende um die style.css-Tabelle ---- */
.v4-llmrechner .vgl-table-wrap { margin-top: var(--v4-space-2); }
.v4-llmrechner .v4-llm-tabellen-hinweis {
  margin: var(--v4-space-3) 0 0;
}

/* ---- Glossar und Quellen: nur Kontextabstand,
        Gestaltung bleibt in style.css ---- */
.v4-llmrechner .llm-glossar { margin-top: var(--v4-space-2); }

/* ---- CTA: die Frage ist laenger als die 24ch-Vorgabe des
        Musters, sie darf breiter laufen ---- */
.v4-llmrechner .v4-cta h2 { max-width: 30ch; }

/* ============================================================
   DRUCK: die Datenblatt-Druckfassung fortfuehren
   ============================================================
   style.css versteckt unter .seite-llm die erklaerenden Sektionen
   ueber ihre alten Klassen (:has(.zg-grid), :has(.two-col),
   :has(.llm-weg), .hero-actions, .hero-graphic, .cta-section).
   Diese Klassen gibt es nach dem V4-Umbau nicht mehr — hier die
   gleichen Regeln fuer die neuen Traeger. FAQ-/Frage-Box-Sektion
   und Glossar-Sektion versteckt style.css weiterhin selbst
   (:has(.llm-frage-box) bzw. :has(.llm-glossar)), ebenso Rechner-
   Eingaben, Tabs und Druck-Knoepfe im unveraenderten Widget.
   ============================================================ */
@media print {
  .seite-llm .v4-hero .v4-aktionen,
  .seite-llm .v4-llm-hero-grafik,
  .seite-llm .v4-cta,
  .seite-llm section:has(.v4-llm-warum),
  .seite-llm section:has(.v4-llm-einordnung),
  .seite-llm section:has(.v4-llm-weg),
  .seite-llm section:has(.v4-linkliste) { display: none !important; }
}

/* Ueberblickstabelle: hoehere Mindestbreite, damit die Textspalten
   im Scroll-Rahmen nicht auf 5-6 Zeilen wickeln und die Zeilenhoehe
   ballonieren lassen (Abnahme-Befund 30.08.2026, mobil). */
.v4-llmrechner .vgl-table { min-width: 1060px; }
