/* ==========================================================================
   Glunz Vermietung & Verpachtung – Stylesheet
   Konzept: Eine durchgehende nachtblaue Ebene (Farbwelt Glunz Technik).
   Schwarze Kopfleiste mit oranger Laserlinie, Fotos klar und randlos mit sauberer
   Kante, Inhalte ohne eigene Kästen direkt auf dem Grund, gegliedert durch
   Abstände und feine Linien.
   ========================================================================== */

/* Schrift Inter, auf dem eigenen Server abgelegt (keine Verbindung zu Google) */
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 300; font-display: swap;
  src: url("../fonts/inter-latin-300-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/inter-latin-400-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("../fonts/inter-latin-500-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("../fonts/inter-latin-600-normal.woff2") format("woff2");
}

:root {
  /* Nachtblau */
  --nacht-glanz: #234f75;   /* blauer Lichtstreifen */
  --nacht-tief: #04141a;   /* Werte aus dem Glunz-Technik-Auftritt */
  --nacht-mitte: #15252d;
  --nacht-hell: #384b55;
  /* Laserlinie */
  --laser: #ff7840;          /* Laser in Glunz-Orange */
  --laser-glow: rgba(255, 120, 64, .75);
  --laser-schein: rgba(255, 120, 64, .32);
  /* einheitliche Laserlinie: durchgehend, ohne Auslaufen, mit gleichem Leuchten */
  --laser-leuchten: 0 0 6px 1px var(--laser-glow), 0 0 16px 2px var(--laser-schein);
  --nacht-streifen: linear-gradient(180deg, var(--nacht-glanz) 0, rgba(35, 79, 117, 0) 36px);

  /* Schrift auf dunklem Grund */
  --tinte: #f1f4f5;         /* Überschriften */
  --text: #c3cdd2;          /* Fließtext, leichtes Grau */
  --text-hell: #8ea2ac;     /* Labels, Bildunterschriften */
  --linie: rgba(195, 205, 210, 0.24);
  --flaeche: rgba(255, 255, 255, 0.04);

  /* Kopfleiste */
  --leiste: #000;
  --leiste-text: #e9eef0;
  --leiste-linie: rgba(255, 255, 255, .12);

  --akzent: #d4552c;        /* Glunz-Orange, sparsam */
  --akzent-hell: #ec8a62;

  /* Schrift */
  --font: "Inter", "Helvetica Neue", Arial, sans-serif;

  /* Maße */
  --max: 1100px;
  --gutter: max(20px, env(safe-area-inset-left, 0px));
  --gutter-r: max(20px, env(safe-area-inset-right, 0px));
  --header-h: 104px;   /* wie Glunz Technik */

  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; background: var(--nacht-tief); }

body {
  margin: 0;
  min-height: 100vh;
  font-family: var(--font);
  font-weight: 300;
  font-size: 1.0625rem;
  line-height: 1.75;
  color: var(--text);
  /* Verlauf läuft mit der Seite: oben dunkler, nach unten heller */
  background: linear-gradient(180deg, var(--nacht-tief) 0%, var(--nacht-tief) 15%, var(--nacht-mitte) 50%, var(--nacht-hell) 100%);
  display: flex;
  flex-direction: column;
}

img { max-width: 100%; height: auto; display: block; }

a { color: var(--tinte); text-decoration-color: var(--akzent); text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { color: var(--akzent-hell); }
:focus-visible { outline: 2px solid var(--akzent-hell); outline-offset: 3px; }

h1, h2, h3 {
  font-family: var(--font);
  color: var(--tinte);
  text-wrap: balance;
  margin: 0;
}
h1 { font-size: clamp(2.1rem, 1.4rem + 2.6vw, 3.4rem); font-weight: 600; letter-spacing: -0.025em; line-height: 1.1; }
h2 { font-size: clamp(1.5rem, 1.25rem + 1vw, 2rem); font-weight: 400; letter-spacing: -0.015em; line-height: 1.2; }
h3 { font-size: 1.15rem; font-weight: 500; letter-spacing: -0.01em; line-height: 1.3; }
p { margin: 0; }
strong { font-weight: 500; color: var(--tinte); }

.eyebrow {
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--text-hell);
}

.skip-link {
  position: absolute; left: -999px; top: 8px;
  background: #fff; color: var(--leiste-text); padding: 8px 14px; z-index: 100;
}
.skip-link:focus { left: 16px; }

/* Gemeinsame Innenbreite für Kopf, Inhalt und Fuß */
.inner, .sheet {
  width: 100%;
  max-width: calc(var(--max) + 2 * 20px);
  margin-left: auto; margin-right: auto;
  padding-left: var(--gutter);
  padding-right: var(--gutter-r);
}

/* ---------- Kopfleiste ---------- */

body::before {
  content: ""; position: fixed; inset: 0 0 auto;
  height: env(safe-area-inset-top, 0px); z-index: 60; background: var(--leiste);
}

.site-header {
  position: sticky;
  top: env(safe-area-inset-top, 0px);
  z-index: 50;
  background: var(--leiste);
}
/* Laserlinie unter der Kopfleiste: scharfer Kern, darunter ein Lichtschein, der nach unten ausläuft */
.site-header::after {
  content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 2px;
  pointer-events: none;
  background: var(--laser);
  box-shadow: var(--laser-leuchten);
}
.site-header::before {
  content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 56px;
  pointer-events: none;
  background: linear-gradient(180deg, var(--laser-schein) 0, rgba(255, 120, 64, .08) 22px, rgba(255, 120, 64, 0) 56px);
}
.site-header .inner {
  /* Kopfleiste über die volle Breite: Logo links am Rand, Menü rechts am Rand (wie Glunz Technik) */
  max-width: none;
  padding-left: max(24px, 2.5vw, env(safe-area-inset-left, 0px));
  padding-right: max(24px, 2.5vw, env(safe-area-inset-right, 0px));
  height: var(--header-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.logo img { height: 41px; width: auto; }

.nav-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; gap: clamp(14px, 1.8vw, 28px);
}
.nav-list a {
  font-size: 0.76rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--leiste-text);
  padding-block: 6px;
  border-bottom: 1px solid transparent;
  transition: color .2s, border-color .2s;
  white-space: nowrap;
}
.nav-list a:hover { color: var(--laser); }
.nav-list a[aria-current="page"] { color: var(--laser); border-bottom-color: var(--laser); }

.nav-toggle {
  display: none;
  background: none; border: 0; padding: 10px; margin-right: -10px; cursor: pointer;
  color: var(--leiste-text);
  font: 500 0.76rem/1 var(--font); letter-spacing: .14em; text-transform: uppercase;
  align-items: center; gap: 10px;
}
.nav-toggle .bars { width: 22px; height: 12px; position: relative; }
.nav-toggle .bars::before, .nav-toggle .bars::after {
  content: ""; position: absolute; left: 0; right: 0; height: 1.5px; background: currentColor;
  transition: transform .25s, top .25s;
}
.nav-toggle .bars::before { top: 1px; }
.nav-toggle .bars::after { top: 9px; }
.nav-open .nav-toggle .bars::before { top: 5px; transform: rotate(45deg); }
.nav-open .nav-toggle .bars::after { top: 5px; transform: rotate(-45deg); }

@media (max-width: 1060px) {
  :root { --header-h: 72px; }
  .logo img { height: 34px; }
  .nav-toggle { display: inline-flex; }
  .site-nav {
    position: absolute; left: 0; right: 0; top: 100%;
    background: var(--leiste);
    border-top: 1px solid var(--leiste-linie);
    border-bottom: 2px solid var(--laser);
    z-index: 2;
    display: none;
  }
  .nav-open .site-nav { display: block; }
  .nav-list {
    flex-direction: column; gap: 0;
    padding: 8px var(--gutter-r) 18px var(--gutter);
  }
  .nav-list a {
    display: block; padding-block: 14px; font-size: 0.86rem;
    border-bottom: 1px solid var(--leiste-linie);
  }
  .nav-list li:last-child a { border-bottom-color: transparent; }
  .nav-list a[aria-current="page"] { border-bottom-color: var(--leiste-linie); }
}

/* ---------- Bildkopf: klares Foto mit sauberer Kante, Titel darunter ---------- */

.buehne { display: grid; }
.buehne > img {
  width: 100%;
  height: clamp(190px, 24vw, 320px);
  object-fit: cover;
}
.buehne--start > img { height: clamp(200px, 26vw, 360px); }
.buehne .inner {
  display: grid; gap: 14px;
  padding-top: clamp(32px, 4.5vw, 56px);
}
.buehne .eyebrow { color: #9fb7c7; }
.buehne h1 { color: #fff; max-width: 20ch; }
.buehne p { color: var(--text); max-width: 64ch; }

/* ---------- Startseite: Titel und Einleitung ---------- */

.start-video .inner {
  display: grid; gap: clamp(20px, 2.5vw, 32px);
  padding-top: clamp(36px, 5vw, 64px);
}
.start-text { display: grid; gap: 14px; }
.start-text .eyebrow { color: #9fb7c7; }
.start-text h1 { color: #fff; font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.4rem); }
/* Foto des Firmengebäudes, eingefasst mit feinem Rahmen und Laserkante unten */
.start-foto { margin: 0; position: relative; border: 1px solid var(--linie); max-width: var(--start-breite); }
.start-foto img { display: block; width: 100%; height: auto; }
.start-foto::after {
  content: ""; position: absolute; left: -1px; right: -1px; bottom: -1px; height: 2px;
  background: var(--laser); box-shadow: var(--laser-leuchten);
}
.start-text p { max-width: 64ch; }

/* ---------- Kartenbanner (Objektgalerie) ---------- */

.karten-banner {
  position: relative; overflow: hidden;
  height: clamp(220px, 22vw, 400px);
  background: var(--nacht-tief);
}
.karten-banner svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }

/* ---------- Schriftkopf der Unterseiten (ohne Bild) ---------- */

.titelkopf .inner {
  display: grid; gap: 14px;
  padding-top: clamp(56px, 7vw, 96px);
}
.titelkopf .eyebrow { color: #9fb7c7; }
.titelkopf h1 { color: #fff; }
/* Laserlinie unter dem Titel */
.titelkopf .inner::after {
  content: ""; height: 2px; margin-top: 18px;
  background: var(--laser); box-shadow: var(--laser-leuchten);
}

/* ---------- Inhalt ---------- */

main { flex: 1 0 auto; }

.sheet {
  display: grid;
  gap: clamp(48px, 6vw, 80px);
  padding-block: clamp(32px, 5vw, 64px) 0;
}
/* Abschnitte nur durch Abstand und feine Linie getrennt */
/* Laserlinie als Trenner zwischen Abschnitten */
.sheet > .trenner, .kontaktband { position: relative; }
.sheet > .trenner::before, .kontaktband::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px;
  background: var(--laser); box-shadow: var(--laser-leuchten);
}
.sheet > .trenner { padding-top: clamp(48px, 6vw, 80px); }

.section { display: grid; gap: 22px; align-content: start; }
.section-head { display: grid; gap: 10px; align-content: start; }
.section-head h2::after {
  content: ""; display: block; width: 48px; height: 2px; margin-top: 18px; background: var(--laser);
  box-shadow: var(--laser-leuchten);
}

.prose { max-width: 64ch; display: grid; gap: 1.1em; align-content: start; }

.two-col {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: clamp(32px, 6vw, 80px);
  align-items: start;
}
@media (max-width: 860px) { .two-col { grid-template-columns: 1fr; } }

.figure { display: grid; gap: 10px; margin: 0; }
.figure img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.figure figcaption { font-size: .85rem; color: var(--text-hell); }
/* Startseite: Titel, Foto, Texte und Projekt teilen eine gemeinsame Spaltenbreite,
   damit alles links und rechts bündig mit dem Foto abschließt */
:root { --start-breite: 760px; }
.start-spalte > * { max-width: var(--start-breite); }
/* Startseite: die schmale Spalte steht mittig auf der Seite */
.start-spalte > *, .start-video .inner > * { width: 100%; margin-left: auto; margin-right: auto; }
.start-video .start-text { max-width: var(--start-breite); }
.start-spalte .prose { max-width: none; }

/* Aktuelles Projekt: kleine Kachel unter der Einleitung, Bild links, Text rechts */
.projekt-klein {
  margin: 0 auto; display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 24px; align-items: center;
}
.projekt-klein img { width: 100%; height: auto; }
.projekt-klein figcaption { display: grid; gap: 6px; font-size: .95rem; color: var(--text); }
.projekt-klein figcaption strong { font-size: 1.1rem; font-weight: 500; color: var(--tinte); }
@media (max-width: 700px) { .projekt-klein { grid-template-columns: 1fr; gap: 14px; } }

/* Person (Geschäftsführung): Porträt links, Text rechts */
.person {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 28px clamp(32px, 6vw, 80px); align-items: center;
}
.person img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; }
@media (max-width: 860px) {
  .person { grid-template-columns: 1fr; }
  .person img { max-width: 420px; }
}

/* Zeilenraster für zwei Spalten: Kategorie/Überschrift und Inhalt stehen in beiden
   Spalten jeweils auf derselben Höhe */
.zeilen { grid-template-rows: auto auto; row-gap: 28px; }
.zeilen > .section { grid-row: 1 / span 2; grid-template-rows: subgrid; gap: 28px; }
.zeilen > .figure { grid-row: 2; }
.inhalt { display: grid; gap: 22px; align-content: start; }
.inhalt .bild { width: 100%; height: auto; }
/* etwas kleinere Überschriften, damit beide Spalten einzeilig und bündig bleiben */
.zeilen h2 { font-size: clamp(1.4rem, 1.2rem + .6vw, 1.6rem); }
@media (max-width: 860px) {
  .zeilen { grid-template-rows: none; row-gap: clamp(48px, 6vw, 80px); }
  .zeilen > .section, .zeilen > .figure { grid-row: auto; grid-template-rows: none; }
}

/* Grundsätze */
.facts {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
}
.facts li { padding: 0 28px 0 0; display: grid; gap: 6px; align-content: start; }
.facts li + li { padding-left: 28px; border-left: 1px solid var(--linie); }
.facts .wert {
  font-weight: 300; letter-spacing: -0.02em;
  font-size: clamp(1.9rem, 1.5rem + 1.2vw, 2.6rem); color: var(--tinte); line-height: 1.1;
}
.facts .label { font-size: .95rem; }
@media (max-width: 760px) {
  .facts { grid-template-columns: 1fr; }
  .facts li, .facts li + li { padding: 18px 0; border-left: 0; border-bottom: 1px solid var(--linie); }
  .facts li:first-child { padding-top: 0; }
  .facts li:last-child { border-bottom: 0; padding-bottom: 0; }
}

/* Objektarten */
.kategorien {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  column-gap: 40px;
  border-top: 1px solid var(--linie);
}
.kategorie {
  padding: 28px 0;
  border-bottom: 1px solid var(--linie);
  display: grid; gap: 14px; align-content: start;
}
.kategorie ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.kategorie li { padding-left: 18px; position: relative; }
.kategorie li::before {
  content: ""; position: absolute; left: 0; top: .85em; width: 8px; height: 1px; background: var(--akzent);
}

.standorte { display: flex; flex-wrap: wrap; gap: 10px; }
.standorte span {
  font-size: .74rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase;
  padding: 6px 14px; border: 1px solid var(--linie); color: var(--tinte);
}

.weiter {
  font-size: .76rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase;
  text-decoration: none; color: var(--tinte);
  display: inline-flex; align-items: center; gap: 12px;
  border-bottom: 1px solid var(--akzent); padding-bottom: 4px; justify-self: start;
}
.weiter::after { content: "→"; transition: transform .2s; }
.weiter:hover::after { transform: translateX(4px); }

/* Kontaktband: eine Zeile unter feiner Linie, die Fußzeile schließt mit ihrer Linie ab */
.kontaktband {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px 32px; align-items: center;
  padding-block: clamp(28px, 4vw, 40px);
}
.kontaktband h2 { font-size: clamp(1.3rem, 1.15rem + .7vw, 1.7rem); }
.kontaktband p { margin-top: 6px; }
.kontaktband .tel {
  font-weight: 500; letter-spacing: -0.01em; font-size: clamp(1.4rem, 1.2rem + 1vw, 2rem);
  color: #fff; text-decoration: none; white-space: nowrap;
}
.kontaktband .tel:hover { color: var(--akzent-hell); }
@media (max-width: 680px) { .kontaktband { grid-template-columns: 1fr; } }

/* Kontaktdaten */
.kontakt-daten { display: grid; gap: 28px; }
.kontakt-daten address { font-style: normal; }
.dl { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px 24px; margin: 0; }
.dl dt { color: var(--text-hell); font-size: .9rem; padding-top: .15em; }
.dl dd { margin: 0; color: var(--tinte); overflow-wrap: anywhere; }
.dl a { text-decoration: none; border-bottom: 1px solid var(--linie); }
.dl a:hover { border-bottom-color: var(--akzent); }

/* Link zu Google Maps unter der Adresse, im Laser-Orange */
.adresse { display: grid; gap: 10px; justify-items: start; }
.maps-link {
  display: inline-flex; align-items: center; gap: 8px;
  color: var(--laser); text-decoration: none; font-weight: 500;
  text-shadow: 0 0 10px var(--laser-schein);
}
.maps-link::after { content: "↗"; }
.maps-link:hover { color: #fff; text-shadow: 0 0 12px var(--laser-glow); }

/* Galerie */
.filter { display: flex; flex-wrap: wrap; gap: 8px; }
.filter button {
  font: 500 .74rem/1.2 var(--font); letter-spacing: .12em; text-transform: uppercase;
  background: transparent; color: var(--text); border: 1px solid var(--linie);
  padding: 9px 14px; cursor: pointer; transition: border-color .2s, color .2s, background .2s;
}
.filter button:hover { border-color: var(--text-hell); color: var(--tinte); }
.filter button[aria-pressed="true"] { background: var(--tinte); border-color: var(--tinte); color: var(--nacht-tief); }

.galerie {
  display: grid; gap: 28px 18px;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr));
}
@media (max-width: 560px) {
  .galerie { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 10px; }
  .filter button { font-size: .7rem; padding: 8px 10px; }
}
.galerie .kachel {
  all: unset; cursor: zoom-in; display: grid; gap: 10px; align-content: start; min-width: 0;
}
.galerie .kachel:focus-visible { outline: 2px solid var(--akzent-hell); outline-offset: 3px; }
.galerie .kachel[hidden] { display: none; }
.galerie img {
  width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: var(--nacht-mitte);
  transition: filter .3s;
}
.galerie .kachel:hover img { filter: brightness(1.06); }
.galerie .titel {
  display: grid; gap: 2px; font-size: .98rem; font-weight: 400; color: var(--tinte); line-height: 1.3;
}
.galerie .titel small { font-size: .76rem; color: var(--text-hell); letter-spacing: .02em; }

.platzhalter {
  aspect-ratio: 4 / 3; display: grid; place-items: center; text-align: center;
  border: 1px dashed var(--linie); color: var(--text-hell); font-size: .85rem; padding: 16px;
  background: var(--flaeche);
}

.lightbox {
  position: fixed; inset: 0; z-index: 200;
  background: rgba(2, 10, 13, .95);
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 8px;
  padding: max(56px, env(safe-area-inset-top, 0px)) max(8px, env(safe-area-inset-right, 0px)) max(24px, env(safe-area-inset-bottom, 0px)) max(8px, env(safe-area-inset-left, 0px));
}
.lightbox[hidden] { display: none; }
.lightbox figure { margin: 0; display: grid; gap: 12px; justify-items: center; grid-column: 2; grid-row: 1; min-width: 0; }
.lightbox img { max-height: 80vh; max-width: 100%; width: auto; }
.lightbox figcaption { color: #dfe4e6; text-align: center; font-size: 1rem; }
.lightbox .zurueck { grid-column: 1; grid-row: 1; }
.lightbox .vor { grid-column: 3; grid-row: 1; }
.lightbox .blaettern {
  background: none; border: 0; color: #fff; cursor: pointer;
  font-size: 2.6rem; line-height: 1; width: 48px; height: 72px; opacity: .7; transition: opacity .2s;
}
.lightbox .blaettern:hover { opacity: 1; }
@media (max-width: 600px) {
  .lightbox { grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; }
  .lightbox figure { grid-column: 1 / -1; }
  .lightbox .zurueck, .lightbox .vor { grid-row: 2; justify-self: center; }
  .lightbox .zurueck { grid-column: 1; }
  .lightbox .vor { grid-column: 2; }
}
.lightbox .schliessen {
  position: absolute; top: max(12px, env(safe-area-inset-top, 0px)); right: max(12px, env(safe-area-inset-right, 0px));
  background: none; border: 1px solid rgba(255,255,255,.4); color: #fff; cursor: pointer;
  font: 500 .74rem/1 var(--font); letter-spacing: .14em; text-transform: uppercase;
  padding: 11px 14px;
}

/* Freie Objekte */
.objekt-karte {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  border: 1px solid var(--linie); background: var(--flaeche);
}
.section > .objekt-karte + .objekt-karte { margin-top: 2px; }
/* Bild vollständig zeigen (nicht beschnitten) */
/* Formatfüllend, oben (Himmel) beschneiden, Container und Boden bleiben vollständig sichtbar */
.objekt-bild.objekt-bild--ganz img { object-fit: cover; object-position: 50% 100%; }

.objekt-karte .platzhalter { aspect-ratio: auto; min-height: 220px; border: 0; }
.objekt-karte .info { padding: 20px 24px; display: grid; gap: 8px; align-content: center; }
.objekt-karte .info p { font-size: .95rem; line-height: 1.55; }
.objekt-karte .dl { gap: 2px 20px; font-size: .95rem; line-height: 1.5; }
.objekt-karte .weiter { margin-top: 6px; }
.badge {
  justify-self: start; font-size: .7rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase;
  color: var(--akzent-hell); border: 1px solid currentColor; padding: 3px 10px;
}
.objekt-bild { position: relative; min-height: 200px; }
.objekt-bild img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 85% 50%; }
.badge { color: #6fcf8f; }
@media (max-width: 860px) {
  .objekt-karte { grid-template-columns: 1fr; }
  .objekt-bild { min-height: 0; }
  .objekt-bild img { position: static; height: auto; }
}

/* Hinweis für Platzhalter-Inhalte */
.hinweis {
  border-left: 2px solid var(--akzent);
  padding: 12px 18px; background: var(--flaeche); color: var(--tinte); font-size: .95rem;
}

/* Linkliste */
.linkliste { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--linie); }
.linkliste li { border-bottom: 1px solid var(--linie); }
.linkliste a {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: center;
  padding: 22px 0; text-decoration: none;
}
.linkliste .name { font-size: 1.15rem; font-weight: 400; color: var(--tinte); }
.linkliste .beschreibung { display: block; font-size: .95rem; color: var(--text); }
.linkliste a::after { content: "↗"; color: var(--akzent-hell); }
.linkliste a:hover .name { color: var(--akzent-hell); }

/* Partner-Links mit Logo */
.partner { list-style: none; margin: 0; padding: 0; display: grid; gap: 24px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 760px) { .partner { grid-template-columns: 1fr; } }
.partner a, .partner-karte {
  display: grid; grid-template-rows: auto 1fr; height: 100%; text-decoration: none;
  border: 1px solid var(--linie); background: var(--flaeche);
  transition: border-color .2s;
}
.partner a:hover { border-color: var(--laser); }
.partner-logo.partner-logo--dunkel { background: #000; }
.partner-logo { background: #fff; display: grid; place-items: center; height: 170px; padding: 28px 36px; }
.partner-logo img { width: auto; height: auto; max-width: 100%; max-height: 92px; object-fit: contain; }
.partner-text { display: grid; gap: 4px; align-content: start; padding: 22px 24px 24px; }
.partner .name { font-size: 1.15rem; font-weight: 500; color: var(--tinte); }
.partner .beschreibung { font-size: .95rem; color: var(--text); }
.partner .adresse-web { margin-top: 8px; color: var(--laser); font-weight: 500; font-size: .95rem; }
.partner .adresse-web::after { content: " ↗"; }
.partner a:hover .adresse-web { color: #fff; }

/* Rechtstexte */
.recht { max-width: 72ch; display: grid; gap: 1em; }
.recht { gap: 6px; }
.recht h2 { font-size: 1.3rem; margin-bottom: 10px; }
.recht h3 { font-size: 1rem; font-weight: 500; margin-top: 18px; }
.recht .fehlt { color: var(--laser); }
.datenschutz { gap: 10px; }
.datenschutz .dokumenttitel { font-size: 1.6rem; margin-bottom: 8px; }
.datenschutz h2:not(.dokumenttitel) { font-size: 1.3rem; margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--linie); }
.datenschutz h3 { margin-top: 16px; }
.datenschutz h4 { font-size: .95rem; font-weight: 500; color: var(--tinte); margin: 10px 0 0; }
.adressblock { padding-left: 16px; border-left: 2px solid var(--laser); color: var(--tinte); }

/* ---------- Fuß ---------- */

/* Fußleiste: schwarz über die volle Breite wie die Kopfleiste, oben die orange Laserkante */
.site-footer {
  position: relative;
  color: #9aa9b1;
  font-size: .95rem;
  margin-top: clamp(56px, 7vw, 96px);
  background: var(--leiste);
}
.site-footer::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px;
  background: var(--laser);
  box-shadow: var(--laser-leuchten);
}
.site-footer .inner {
  padding-bottom: 24px;
  display: grid; gap: 40px;
}
.footer-grid {
  padding-top: 56px;
  display: grid; gap: 32px;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr);
}
@media (max-width: 760px) { .footer-grid { grid-template-columns: 1fr; } }
/* Logo senkrecht mittig zu den Spalten Kontakt und Rechtliches */
.footer-logo { align-self: center; }
@media (max-width: 760px) { .footer-logo { align-self: start; } }
.site-footer img { height: 41px; width: auto; }
.site-footer h2 {
  font-size: .72rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: #fff; margin-bottom: 14px;
}
.site-footer a { color: #dfe4e6; text-decoration: none; }
.site-footer a:hover { color: var(--akzent-hell); }
.site-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.site-footer address { font-style: normal; }
.footer-unten {
  border-top: 1px solid var(--linie); padding-top: 20px;
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; font-size: .85rem;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
}