/* ============================================================================
   StarYou-Shell — die kanonische äussere Contentbreite (Thomas, 2026-08-24).

   ANLASS: Cockpit, Projekt-Dossier und Firmenseite hatten unterschiedliche linke
   und rechte Kanten (1080 / 1080-mit-840er-Lesespalte / 1180). Nebeneinander sah
   das weniger nach einem System aus als nach drei Seiten.

   ENTSCHEIDUNG: 1200 px Aussenbreite, Seitenabstand 32 / 24 / 16 px.
   Nicht 1280: das wäre fürs Cockpit angenehm, liesse Firmenseite und Dossier aber
   „leer verteilt" wirken. StarYou lebt von der kompakten, ruhigen Dichte.

   1200 px AUSSENBREITE HEISST NICHT, dass jeder Inhalt 1200 px breit läuft. Die
   Shell setzt die Kanten; was darin passiert, entscheidet die Fläche:
     Cockpit      nutzt die volle Breite (Titel, Meta, Handlung, Frist scannbar)
     Firmenseite  nutzt sie stark aus (Hauptinhalt + rechte Spalte)
     Dossier      linear, aber lange Fliesstexte innen auf ~800 px begrenzt
   Was NICHT mehr vorkommt: eigene 960/1080/1280-Container pro Seite.

   AUSNAHME: ein echtes Data-Grid (Superadmin-Tabellen) darf breiter sein — aber
   ausdrücklich und begründet, nicht aus Versehen.

   NICHT ANGEFASST: die Zielgruppen-Landingpages (/, /unternehmen, /experten,
   /beratungshaeuser). Die teilen sich landing.css mit der Firmenseite, sind aber
   redaktionelle Marketingflächen mit bewusst luftigerem Raster — sie standen nicht
   auf der Liste und werden nicht nebenbei mitgezogen.
   ========================================================================== */

:root {
  --shell-max: 1200px;
  --shell-pad: 32px;
}

/* Tablet und Telefon: der Abstand zur Kante wird kleiner, nicht der Inhalt. */
@media (max-width: 900px) {
  :root { --shell-pad: 24px; }
}
@media (max-width: 600px) {
  :root { --shell-pad: 16px; }
}

/* Die Shell selbst. `width` statt `max-width`, damit der Seitenabstand Teil der
   Rechnung ist und nicht als zusätzliches Innenpolster obendrauf kommt — sonst
   wäre die sichtbare Breite je nach Fläche wieder eine andere. */
.star-shell {
  width: min(var(--shell-max), calc(100vw - 2 * var(--shell-pad)));
  margin-inline: auto;
}

/* Lange Fliesstexte innerhalb der Shell. 1200 px Zeilenlänge liest sich nicht;
   ~800 px sind die Grenze, ab der das Auge die nächste Zeile noch findet. */
.star-prose {
  max-width: 800px;
}