/* ============================================================
   FORK & FIRE Catering — Wide-Viewport-Fixes (Override)
   Durchgerechnet fuer 1024 / 1280 / 1600 / 1920 / 2560 px.
   Laedt NACH base/catering/map/sub.css.
   ============================================================ */

/* ── A) Zeilenlaengen > 75ch begrenzen (alle Breiten) ─────
   Elemente ohne max-width laufen im 1560er Wrap auf 120–250ch. */
.packs__note{ max-width:70ch; }          /* war: volle Wrap-Breite (~250ch) */
.cform__hint{ max-width:60ch; }          /* war: Restbreite der Flexzeile (~120ch) */
.foot__fine{ max-width:75ch; }           /* war: 80ch */
/* Referenz-Band: Border bleibt voll, Text auf Lesemass gekuerzt.
   ponytail: reines max-width — Border endet mit dem Element; volle
   Haarlinie ueber die Breite braeuchte Markup-Aenderung. */
.crefs__line{ max-width:88ch; }

/* ── B) Kalkulator 1081–1440 px ───────────────────────────
   Rechenweg 1280: Content 1280−2·76.8(pad)=1126 px,
   linke Spalte (1126−30.7 gut)·7/12 ≈ 639 px,
   opts--3-Zelle ≈ (639−20)/3 ≈ 206 px; bei 1100 px nur ≈ 176 px.
   Zu eng fuer b + s + small — auf 2 Spalten ausweichen. */
@media (min-width:1081px) and (max-width:1440px){
  .opts--3{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* ── C) Karte ab 1600 px: 8/5 statt 7/5 ───────────────────
   Rechenweg 1600: Content 1600−2·96=1408 px, Stage 7/12 ≈ 796 px
   → Panel-Spalte ≈ 568 px, Panel-Text (map__lead 44ch ≈ 340 px)
   laesst rechts ~40 % leer. Ab --wrap-Kappung (≥1752 px) Stage
   (1560−44)·7/12 ≈ 884 px, Hoehe nur 497 px — Karte wirkt klein.
   8/4 gibt der Karte 1010 px (Hoehe 567 px) und strafft das Panel. */
@media (min-width:1600px){
  .map{ grid-template-columns:minmax(0,8fr) minmax(0,4fr); }
}

/* ── D) Sektionskoepfe ab 1920 px ─────────────────────────
   --t-h2 kappt bei 1516 px (57.6 px), csec__head bei 60ch (~600 px):
   im 1560er Wrap steht der Kopf verloren vor ~960 px Leerraum.
   Typo eine Stufe hoch, Lead darf minimal breiter laufen. */
@media (min-width:1920px){
  :root{
    --t-h2: 4rem;              /* 57.6 → 64 px */
    --t-h3: 1.7rem;            /* 24.8 → 27.2 px */
    --t-lead: 1.42rem;         /* 21.1 → 22.7 px */
  }
  .csec__head, .cmap__head{ max-width:min(62ch, 62%); }

  /* Marquee: Items kappen bei 1440 px (86.4 px) — auf Vollbreite
     1920+ wieder mitwachsen lassen. 4.5vw: 1920→86.4, 2560→115 px. */
  .mq__item{ font-size:clamp(5.4rem, 4.5vw, 7.2rem); }

  /* Bildbaender: 58vh kappt bei 580 px → auf 27-Zoll (2560×1440)
     ein 4.4:1-Schlitz. An Breite koppeln: 32vw → 1920: 614 px,
     2560: 800 px (Ratio ~3.2:1). */
  .brk{ height:clamp(580px, 32vw, 800px); }
  .brk img{ top:-12%; height:124%; }     /* Parallax-Reserve reicht auch hoeher */
}

/* ── E) Hero ab 2200 px (2560-Check) ──────────────────────
   .chero .display kappt bei 1643 px (121.6 px) — auf 2560 wirkt die
   Zeile im vollflaechigen Hero klein. 5.5vw: 2200→121, 2560→140.8 px.
   Sub-Hero analog. Hero-Hoehe kappt bei 880 px (61 % von 1440er
   Schirm) — moderat anheben. */
@media (min-width:2200px){
  .chero .display{ font-size:clamp(7.6rem, 5.5vw, 9.2rem); }
  .chero--sub .display{ font-size:clamp(6rem, 4.4vw, 7.4rem); }
  .chero{ min-height:clamp(880px, 66svh, 1040px); }
  .chero--sub:not(.chero--team){ min-height:clamp(620px, 50svh, 760px); }
}