/* ============================================================
   FIDES Gamma GmbH — Darstellung.
   Die Formatierung liegt ueberwiegend als style-Attribut am Element,
   so wie im Entwurf angelegt. Hier steht nur, was sich dort nicht
   unterbringen laesst: Grundregeln, Bewegungen, Zustaende beim
   Ueberfahren, Bildplaetze.
   ============================================================ */
@import url("schriften.css");

html, body { margin: 0px; padding: 0px; background: rgb(246, 243, 236); }
* { box-sizing: border-box; }
a { color: inherit; text-decoration: none; }
a:hover { color: rgb(138, 109, 47); }
[data-dark] a:hover { color: rgb(201, 168, 106); }
a { transition: color 0.18s, background-color 0.18s, border-color 0.18s; }
::selection { background: rgb(201, 168, 106); color: rgb(14, 24, 48); }
@supports (animation-timeline: view()) {
  /* TF 06.08.2026: Scroll-Reveal deaktiviert (Vorgabe: keine Animationen) */ [data-screen-label] > div { animation: none; }
  [data-screen-label] > div[data-dark] { animation: auto ease 0s 1 normal none running none; }
  @keyframes fgReveal { 
  0% { opacity: 0.12; transform: translateY(32px); }
  100% { opacity: 1; transform: none; }
}
}
p { margin: 0px; }
h1, h2, h3, h4 { margin: 0px; font-weight: 400; }
ul { margin: 0px; padding: 0px; list-style: none; }
@keyframes fgUp { 
  0% { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: none; }
}
@keyframes fgSpin { 
  100% { transform: rotate(360deg); }
}
@keyframes fgGrow { 
  0% { transform: scaleX(0); }
  100% { transform: scaleX(1); }
}
input, textarea, select, button { font-family: "EB Garamond", Garamond, serif; }
input:focus, textarea:focus, select:focus { outline: none; border-color: rgb(201, 168, 106); }
input { font-family: "EB Garamond", Garamond, serif; }
input:focus { outline: none; border-color: rgb(201, 168, 106); }

/* --- Zustaende beim Ueberfahren (aus dem Entwurf uebernommen) --- */
.fgh0:hover{background: rgb(220, 189, 128) !important;}
.fgh1:hover{background: rgba(233, 228, 216, 0.1) !important;}
.fgh2:hover{background: rgb(255, 253, 247) !important;}
.fgh3:hover{background: rgba(201, 168, 106, 0.12) !important;}
.fgh4:hover{border-bottom: 1px solid rgb(201, 168, 106) !important;}
.fgh5:hover{background: rgb(220, 189, 128) !important; gap: 22px !important;}
.fgh6:hover{background: rgb(238, 233, 221) !important;}
.fgh7:hover{background: rgb(29, 47, 87) !important;}
.fgh8:hover{background: rgb(243, 239, 228) !important;}
.fgh9:hover{border-color: rgb(201, 168, 106) !important;}
.fgh10:hover{color: rgb(138, 109, 47) !important;}

/* --- Bildplaetze: stehen, bis echte Aufnahmen vorliegen ---
   Masse, Schrift und Tonwerte entsprechen dem Platzhalter des Entwurfs. */
.fg-bildplatz{display:block;position:relative;width:100%;height:100%;aspect-ratio:3/2;
  font:13px/1.3 system-ui,-apple-system,sans-serif}
.fg-bildplatz-rahmen{position:absolute;inset:0;overflow:hidden;background:rgba(127,127,127,.08);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  text-align:center;padding:12px;box-sizing:border-box}
.fg-bildplatz-text{font-weight:500;font-size:13px;line-height:1.3;letter-spacing:.01em;opacity:.75}

/* --- Aufklappmenue der Kopfleiste --- */
.fg-panel{display:none}
.fg-panel[data-offen="1"]{display:grid}

/* --- Cookie-Hinweis: das Skript gibt ihn frei --- */
.fg-cookie{display:none}
.fg-cookie[data-offen="1"]{display:flex}

/* --- Falle fuer Maschinen im Kontaktformular ---
   Verbirgt das Feld allein optisch. Wer es ausfuellt, ist keine Person.
   Diese Regel traegt Sicherheitslogik: faellt sie weg, wird das Feld
   sichtbar, Menschen fuellen es aus und ihre Nachricht wird verworfen. */
.hp-feld{position:absolute;left:-9999px;top:auto}

/* ===== TF 06.08.2026: Zentrierte Inhaltsspalte (max 1320px) =====
   Hintergruende bleiben randlos; der Inhalt jeder Sektion wird per padding-inline
   auf eine mittige Spalte begrenzt. Auf Viewports <= ~1370px wirkt weiterhin das
   bisherige Mindest-Padding. Kopfleiste + Leistungen-Panel bekommen dieselbe Spalte. */
:where([data-screen-label] > div:not(:first-child):not(.fg-vollbreit)) {
  padding-left: max(24px, calc((100vw - 1320px) / 2)) !important;
  padding-right: max(24px, calc((100vw - 1320px) / 2)) !important;
}
[data-kopfleiste] > div,
[data-kopfleiste] .fg-panel {
  padding-left: max(24px, calc((100vw - 1320px) / 2)) !important;
  padding-right: max(24px, calc((100vw - 1320px) / 2)) !important;
}

/* TF 06.08.2026: Mobile-Fixes — dekorative Absolut-Rahmen duerfen nicht scrollen,
   Cookie-Banner bricht auf schmalen Screens um */
:where([data-screen-label] > div:not(:first-child)) { overflow-x: clip; }
@media (max-width: 700px) {
  .fg-cookie { flex-wrap: wrap !important; padding: 18px 20px !important; gap: 14px !important; left: 12px !important; right: 12px !important; bottom: 12px !important; }
}