/* ══ CHEF-SCHICHT · F170 · 05.09.2026 ══════════════════════════════
   Drei Wege · Renderings groß · Feinschliff. Liegt über allem. */

/* ── 1 · DREI WEGE ─────────────────────────────────────────────── */
.wege{background:var(--sand);padding:78px 0 84px;border-bottom:1px solid var(--line)}
.wege-head{max-width:620px;margin-bottom:44px}
.wege-head h2{font-family:Fraunces,Georgia,serif;font-size:clamp(1.9rem,3.4vw,2.75rem);font-weight:500;
  line-height:1.14;letter-spacing:-.02em;margin-bottom:14px}
.wege-head em{font-style:normal;color:var(--leaf-deep)}
.wege-head p{font-size:1.03rem;line-height:1.75;color:#556264;max-width:52ch}
.wege-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;
  border-top:1px solid #d6cdba;border-left:1px solid #d6cdba}
.weg{display:flex;flex-direction:column;padding:32px 30px 30px;background:#fdfbf6;
  border-bottom:1px solid #d6cdba;border-right:1px solid #d6cdba;transition:background .25s ease}
.weg:hover{background:#fff}
.weg .seehof-icon{width:30px;height:30px;color:var(--leaf-deep);margin-bottom:20px}
.weg-kicker{font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;font-weight:600;
  color:#7d8a76;margin-bottom:9px}
.weg h3{font-family:Fraunces,Georgia,serif;font-size:1.55rem;font-weight:500;line-height:1.2;
  letter-spacing:-.015em;margin-bottom:13px;color:var(--ink)}
.weg p{font-size:.96rem;line-height:1.72;color:#5a6668;margin-bottom:22px}
.weg-link{margin-top:auto;display:inline-flex;align-items:center;gap:7px;font-size:.9rem;
  font-weight:600;color:var(--sky-deep);border-bottom:1px solid rgba(28,63,77,.3);
  padding-bottom:2px;align-self:flex-start;transition:border-color .2s,color .2s}
.weg-link:hover{color:var(--leaf-deep);border-color:var(--leaf-deep)}
.weg-2 .seehof-icon{color:#a56a2e}
.weg-3 .seehof-icon{color:#5b7b8c}

/* ── 2 · DIE VISION IN BILDERN (vollflächig) ───────────────────── */
.kino{background:#0d1f18;color:#f2efe6;padding:92px 0 96px;overflow:hidden}
.kino-head{max-width:760px;margin-bottom:52px}
.kino .eyebrow{color:#9dba90}
.kino-head h2{font-family:Fraunces,Georgia,serif;font-size:clamp(2.2rem,4.2vw,3.5rem);font-weight:500;
  line-height:1.1;letter-spacing:-.025em;color:#fff;margin-bottom:18px}
.kino-head em{font-style:normal;color:#a8c99a}
.kino-head p{font-size:1.06rem;line-height:1.8;color:#c2ccbf;max-width:60ch}
.kino-band{margin:0 0 18px;padding:0 clamp(14px,3.4vw,46px)}
.kino-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,2.2vw,26px);
  padding:0 clamp(14px,3.4vw,46px);margin-bottom:18px}
.kino figure{margin:0;min-width:0}
.kino .concept-open{background:#152b22;border-radius:4px;width:100%;display:block;
  border:0;padding:0;cursor:zoom-in;overflow:hidden;position:relative}
.kino .concept-open img{display:block;width:100%;height:100%;object-fit:cover;
  transition:transform .7s cubic-bezier(.2,.7,.3,1)}
.kino .concept-open:hover img{transform:scale(1.035)}
.kino-band .concept-open img{aspect-ratio:21/9;object-position:50% 46%}
.kino-grid .concept-open img{aspect-ratio:4/3}
.kino .image-zoom{background:rgba(8,20,15,.82);border-color:rgba(255,255,255,.28)}
.kino figcaption{display:flex;align-items:baseline;gap:14px;margin-top:13px;
  font-size:.92rem;line-height:1.6;color:#b7c4b3}
.kino figcaption b{font-family:Fraunces,Georgia,serif;font-weight:500;font-size:1.06rem;
  color:#f1eee3;flex-shrink:0}
.kino-fuss{padding:26px clamp(14px,3.4vw,46px) 0;font-size:.85rem;line-height:1.75;
  color:#8fa08c;max-width:96ch}
.kino-fuss a{color:#cfe0c4;border-bottom:1px solid rgba(207,224,196,.4)}
.kino-fuss a:hover{color:#fff;border-color:#fff}

/* ── 3 · VISION-KAPITEL: Bilder größer ─────────────────────────── */
@media(min-width:1101px){
  .vision-chapter-grid{grid-template-columns:.92fr 1.3fr;gap:64px}
}

/* ── 4 · PROJEKTPARTNER-BLOCK offen & einladend ────────────────── */
.project-details>.project-summary{padding-block:46px}
.project-details[open]>.project-summary .plus{transform:rotate(45deg)}
.project-summary .plus{transition:transform .3s ease;display:inline-block}

@media(max-width:1000px){
  .wege-grid{grid-template-columns:1fr}
  .kino-grid{grid-template-columns:1fr}
  .kino-band .concept-open img{aspect-ratio:16/10}
}
@media(max-width:760px){
  .wege{padding:56px 0 60px}
  .wege-head{margin-bottom:30px}
  .weg{padding:26px 22px 24px}
  .kino{padding:62px 0 66px}
  .kino-head{margin-bottom:32px}
  .kino-head p{font-size:1rem}
  .kino figcaption{display:block}
  .kino figcaption b{display:block;margin-bottom:3px}
  .kino-band .concept-open img{aspect-ratio:4/3}
}
@media(prefers-reduced-motion:reduce){
  .kino .concept-open img{transition:none}
  .kino .concept-open:hover img{transform:none}
  .project-summary .plus{transition:none}
}

/* ══ RUNDE 2 · 06.09.2026 ══════════════════════════════════════════ */

/* ── GESCHICHTE ────────────────────────────────────────────────── */
.gesch{background:var(--cream);padding:92px 0;border-top:1px solid var(--line)}
.gesch-kopf{display:grid;grid-template-columns:1.02fr 1.1fr;gap:64px;align-items:center;margin-bottom:60px}
.gesch h2{font-family:Fraunces,Georgia,serif;font-size:clamp(2.1rem,4vw,3.2rem);font-weight:500;
  line-height:1.12;letter-spacing:-.025em;margin-bottom:22px}
.gesch em{font-style:normal;color:var(--leaf-deep)}
.gesch p{font-size:1.04rem;line-height:1.82;color:#4d5b5c;margin-bottom:18px}
.gesch-bild{margin:0}
.gesch-bild img{width:100%;height:auto;display:block;border-radius:4px;aspect-ratio:4/3;object-fit:cover}
.gesch-bild figcaption{margin-top:11px;font-size:.82rem;color:#6b7770;line-height:1.6}

.zeit{list-style:none;margin:0 0 56px;padding:0;display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid #d6cdba;border-left:1px solid #d6cdba}
.zeit li{padding:24px 22px 22px;border-bottom:1px solid #d6cdba;border-right:1px solid #d6cdba;background:#fdfbf6}
.zeit .jahr{font-family:Fraunces,Georgia,serif;font-size:1.5rem;font-weight:600;color:var(--sky-deep);
  line-height:1;margin-bottom:10px;font-variant-numeric:tabular-nums}
.zeit .was{font-size:.92rem;line-height:1.65;color:#54625f}
.zeit li.jetzt{background:var(--sky-deep)}
.zeit li.jetzt .jahr{color:#f6b968}
.zeit li.jetzt .was{color:#d3e0e2}

.gesch-drei{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.gesch-drei figure{margin:0}
.gesch-drei img{width:100%;height:auto;display:block;border-radius:4px;aspect-ratio:4/3;object-fit:cover}
.gesch-drei figcaption{margin-top:10px;font-size:.85rem;line-height:1.6;color:#5e6b66}
.gesch-drei b{display:block;font-family:Fraunces,Georgia,serif;font-weight:500;font-size:1.02rem;color:var(--ink)}

.denkmal-band{margin-top:56px;background:#eee9dc;border-radius:6px;padding:34px 38px;
  display:grid;grid-template-columns:auto 1fr;gap:34px;align-items:start}
.denkmal-band .nr{font-family:Fraunces,Georgia,serif;font-size:2.1rem;font-weight:600;color:var(--sky-deep);
  line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}
.denkmal-band .nr small{display:block;font-family:Inter,sans-serif;font-size:.68rem;font-weight:600;
  letter-spacing:.11em;text-transform:uppercase;color:#7d8a76;margin-top:8px}
.denkmal-liste{list-style:none;margin:14px 0 0;padding:0;display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 26px}
.denkmal-liste li{font-size:.9rem;color:#4e5b58;padding-left:16px;position:relative;line-height:1.6}
.denkmal-liste li::before{content:'';position:absolute;left:0;top:9px;width:5px;height:5px;
  border-radius:50%;background:#8fa07f}
.denkmal-band>div>p{font-size:1rem;line-height:1.75;color:#4a5754;margin:0}

/* ── WASSERTURM ────────────────────────────────────────────────── */
.turm{background:#12271f;color:#eef1e8;padding:92px 0 96px}
.turm .eyebrow{color:#9dba90}
.turm-grid{display:grid;grid-template-columns:.78fr 1.05fr;gap:60px;align-items:center}
.turm h2{font-family:Fraunces,Georgia,serif;font-size:clamp(2.1rem,4vw,3.3rem);font-weight:500;
  line-height:1.1;letter-spacing:-.025em;color:#fff;margin-bottom:22px}
.turm em{font-style:normal;color:#a8c99a}
.turm p{font-size:1.05rem;line-height:1.82;color:#c5cfc0;margin-bottom:18px}
.turm-haupt{margin:0}
.turm-haupt img{width:100%;height:auto;display:block;border-radius:4px}
.turm-daten{list-style:none;margin:28px 0 0;padding:0;border-top:1px solid #3d5647}
.turm-daten li{display:flex;gap:18px;padding:12px 0;border-bottom:1px solid #2c4034;font-size:.94rem}
.turm-daten b{flex:0 0 132px;color:#9dba90;font-weight:600}
.turm-daten span{color:#c9d3c4}
.turm-streifen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:52px}
.turm-streifen figure{margin:0}
.turm-streifen img{width:100%;height:auto;display:block;border-radius:4px;aspect-ratio:3/4;object-fit:cover}
.turm-streifen figcaption{margin-top:10px;font-size:.85rem;color:#9aa896;line-height:1.55}

/* ── DREI NATURPROJEKTE ────────────────────────────────────────── */
.natur3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:52px 0 0;
  border-top:1px solid #c9d2bd;border-left:1px solid #c9d2bd}
.np{padding:30px 28px;border-bottom:1px solid #c9d2bd;border-right:1px solid #c9d2bd;background:#f7f5ec}
.np .num{font-family:Fraunces,Georgia,serif;font-size:1.1rem;color:#7e936d;margin-bottom:12px;font-weight:600}
.np h4{font-family:Fraunces,Georgia,serif;font-size:1.4rem;font-weight:500;line-height:1.22;
  margin-bottom:12px;color:var(--ink)}
.np p{font-size:.94rem;line-height:1.7;color:#55635e;margin:0 0 14px}
.np .wann{font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:#7d8a76}
.np-fuss{margin-top:26px;font-size:.9rem;line-height:1.75;color:#5c6a63;max-width:78ch}

/* ── ERTRAGSFELDER ─────────────────────────────────────────────── */
.felder{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:34px;
  border-top:1px solid var(--line);border-left:1px solid var(--line)}
.feld{padding:24px 22px;border-bottom:1px solid var(--line);border-right:1px solid var(--line)}
.feld .wann{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;
  color:#a56a2e;margin-bottom:9px}
.feld h4{font-family:Fraunces,Georgia,serif;font-size:1.16rem;font-weight:500;margin-bottom:9px;color:var(--ink)}
.feld p{font-size:.88rem;line-height:1.62;color:#5a6668;margin:0}

/* ── § 54 HINWEIS ──────────────────────────────────────────────── */
.hinweis54{margin:0 0 30px;padding:22px 26px;background:#eef2e8;border-left:3px solid var(--leaf-deep);
  border-radius:0 5px 5px 0}
.hinweis54 strong{display:block;font-family:Fraunces,Georgia,serif;font-size:1.16rem;font-weight:500;
  color:var(--ink);margin-bottom:8px}
.hinweis54 p{font-size:.93rem;line-height:1.72;color:#4f5d59;margin:0}

@media(max-width:1000px){
  .gesch-kopf,.turm-grid{grid-template-columns:1fr;gap:32px}
  .zeit{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gesch-drei,.turm-streifen,.natur3{grid-template-columns:1fr}
  .felder{grid-template-columns:repeat(2,minmax(0,1fr))}
  .denkmal-band{grid-template-columns:1fr;gap:20px;padding:26px 24px}
  .denkmal-liste{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .gesch,.turm{padding:58px 0 62px}
  .zeit{grid-template-columns:1fr}
  .denkmal-liste{grid-template-columns:1fr}
  .felder{grid-template-columns:1fr}
  .turm-daten b{flex-basis:110px}
  .np{padding:24px 22px}
}
.turm-haupt img{aspect-ratio:3/4;object-fit:cover}

/* Wert-und-Preis-Hinweis statt Preis-Chronologie */
.quelle-hinweis{background:#eee9dc;border-radius:6px;padding:32px 36px;margin:34px 0 0}
.quelle-hinweis h3{font-family:Fraunces,Georgia,serif;font-size:1.5rem;font-weight:500;
  margin-bottom:14px;color:var(--ink)}
.quelle-hinweis p{font-size:1rem;line-height:1.78;color:#4a5754;margin-bottom:14px;max-width:78ch}
.quelle-hinweis .qh-liste{font-size:.93rem;color:#5b6763}
.quelle-hinweis .text-link{font-size:.93rem}
/* Kontraste auf WCAG AA gebracht */
.weg-kicker{color:#5c6a5a}
.np .wann,.feld .wann{color:#5c6a5a}
.np .num{color:#5c7350}
.feld .wann{color:#8a5323}

/* Status-Zeile im Hero — was gilt, bevor man weiterliest */
.hero-status{display:flex;flex-wrap:wrap;gap:9px;margin:0 0 14px}
.hero-status span{font-size:.78rem;letter-spacing:.05em;font-weight:600;color:#f3ddc0;
  background:rgba(9,26,34,.55);border:1px solid rgba(246,185,104,.42);
  padding:6px 13px;border-radius:999px;backdrop-filter:blur(3px)}
@media(max-width:760px){.hero-status span{font-size:.72rem;padding:5px 11px}}
