/* Schriften – lokal eingebunden, keine Verbindung zu Google */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/inter-400.woff") format("woff"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/inter-500.woff") format("woff"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/inter-600.woff") format("woff"); }

/* Cormorant Garamond: Dateien in den Ordner /fonts legen (siehe LIESMICH.txt).
   Solange sie fehlen, wird automatisch eine Ersatzschrift verwendet. */
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/cormorant-400.woff2") format("woff2"); }
@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("../fonts/cormorant-400-italic.woff2") format("woff2"); }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("../fonts/cormorant-500.woff2") format("woff2"); }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("../fonts/cormorant-600.woff2") format("woff2"); }

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; background: #ffffff; color: #1c1c1a; font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif; }
img { max-width: 100%; }
a { color: #1c1c1a; }
a:hover { color: #4d5c4b; }
input, textarea, button { font: inherit; }
:focus-visible { outline: 2px solid #4d5c4b; outline-offset: 3px; }
[id] { scroll-margin-top: 24px; }

/* Bilder im Raster: leichter Hover-Effekt */
.lb-trigger { overflow: hidden; border-radius: 4px; }
.lb-trigger img { transition: transform .4s ease, opacity .3s ease; }
.lb-trigger:hover img { transform: scale(1.02); opacity: .94; }

/* Spamschutz-Feld: für Menschen unsichtbar */
.hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }

/* Großansicht der Bilder */
.lb { position: fixed; inset: 0; z-index: 1000; background: rgba(20, 20, 18, .96); display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 14px; padding: 64px 12px 20px; }
.lb[hidden] { display: none; }
.lb-stage { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; max-width: 1500px; flex: 1 1 auto; min-height: 0; }
.lb-img { max-width: 100%; max-height: calc(100vh - 150px); object-fit: contain; display: block; border-radius: 2px; flex: 0 1 auto; min-width: 0; }
.lb-btn { border: 0; border-radius: 999px; background: rgba(255, 255, 255, .12); color: #ffffff; width: 52px; height: 52px;
  font-size: 26px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.lb-btn:hover { background: rgba(255, 255, 255, .22); }
.lb-close { position: absolute; top: 14px; right: 14px; }
.lb-count { margin: 0; font-size: 13px; letter-spacing: 1px; color: #cfcdc6; }
@media (max-width: 640px) {
  .lb-stage .lb-btn { position: absolute; bottom: 14px; }
  .lb-prev { left: 14px; } .lb-next { right: 14px; }
  .lb-img { max-height: calc(100vh - 170px); }
}
body.lb-open { overflow: hidden; }