/* =========================================================
   [JAC] Central – Astro-Bereich (zusätzliches Stylesheet)
   Nutzt die Farben/Variablen aus style.css. Nur auf astro/index.html.
   Keine externen Ressourcen.
   ========================================================= */

/* ---------- Hero & Unternavigation ---------- */
.astro-hero.compact { min-height: auto; padding: clamp(48px, 8vw, 96px) 0 clamp(28px, 4vw, 48px); }
.astro-hero.compact h1 { font-size: clamp(52px, 10vw, 120px); }
.chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.chip { font-family: var(--f-mono); font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; padding: 10px 14px; border: 1px solid rgba(141,155,255,.3); background: rgba(16,21,42,.6); color: #cfd5f5; transition: border-color .2s, color .2s; }
.chip:hover { border-color: var(--sky); color: #fff; }
.subnav { position: sticky; top: 0; z-index: 20; background: rgba(12,12,14,.88); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); }
.subnav .wrap { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 0; }
.subnav a { flex: none; font-family: var(--f-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--dim); padding: 8px 12px; border: 1px solid transparent; }
.subnav a:hover, .subnav a.on { color: var(--text); border-color: var(--line-strong); }

/* ---------- Abschnitts-Köpfe ---------- */
.a-sec { padding: clamp(48px, 8vw, 96px) 0; scroll-margin-top: 52px; }
.a-sec + .a-sec { padding-top: 0; }
.a-head { max-width: 70ch; margin-bottom: clamp(24px, 4vw, 40px); }
.a-head h2 { margin-bottom: 14px; }
.a-head p { color: #cfc9be; margin: 0 0 10px; }
.kicker { font-family: var(--f-mono); font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--sky); margin-bottom: 10px; display: block; }

/* ---------- Platzhalter für eigene Bilder ---------- */
.ph { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; text-align: center; min-height: 180px; padding: 18px; border: 1px dashed rgba(141,155,255,.45); background:
  repeating-linear-gradient(45deg, rgba(141,155,255,.05) 0 10px, transparent 10px 20px), rgba(16,21,42,.5); color: #aab2d6; font-size: 14px; }
.ph svg { width: 34px; height: 34px; stroke: var(--sky); fill: none; stroke-width: 1.5; opacity: .9; }
.ph b { font-family: var(--f-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--accent-2); }
.ph.wide { min-height: 260px; }
.ph.tall { min-height: 320px; }

/* ---------- Balkon-Abschnitt ---------- */
.balkon { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: clamp(18px, 3vw, 36px); align-items: start; }
.panel { border: 1px solid var(--line-strong); background: var(--panel); }
.panel .pad { padding: clamp(16px, 2.4vw, 26px); }
.panel .cap { padding: 12px 16px; border-top: 1px solid var(--line); font-size: 14px; color: var(--dim); }
.panel svg.fig, .panel canvas.fig { display: block; width: 100%; height: auto; }
.facts-a { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); margin-top: 16px; }
.facts-a div { background: var(--panel); padding: 14px 16px; }
.facts-a b { display: block; font-family: var(--f-display); font-size: 30px; line-height: 1; color: var(--text); }
.facts-a span { font-size: 13px; color: var(--dim); }
@media (max-width: 900px) { .balkon { grid-template-columns: 1fr; } }

/* ---------- Zeitleiste "Mein Weg" ---------- */
.tl { position: relative; margin: 0; padding: 0 0 0 28px; list-style: none; }
.tl::before { content: ""; position: absolute; left: 7px; top: 6px; bottom: 6px; width: 2px; background: linear-gradient(var(--sky), var(--accent)); opacity: .6; }
.tl > li { position: relative; margin-bottom: clamp(22px, 3.4vw, 40px); }
.tl > li::before { content: ""; position: absolute; left: -28px; top: 6px; width: 16px; height: 16px; border-radius: 50%; background: var(--bg); border: 2px solid var(--accent); box-shadow: 0 0 0 4px rgba(226,98,15,.15); }
.tl .when { font-family: var(--f-mono); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--accent-2); }
.tl h3 { margin: 4px 0 8px; }
.tl .row { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.tl p { margin: 0 0 8px; color: #d6d0c5; max-width: 62ch; }
.tl .tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.tl .tags span { font-family: var(--f-mono); font-size: 11px; padding: 4px 8px; border: 1px solid var(--line-strong); color: var(--dim); }
.tl .ph { min-height: 130px; }
@media (max-width: 760px) { .tl .row { grid-template-columns: 1fr; } }

/* ---------- Zuletzt fotografiert ---------- */
.targets { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 16px; }
.target { position: relative; border: 1px solid var(--line-strong); background: var(--panel); overflow: hidden; display: flex; flex-direction: column; transition: border-color .25s, transform .25s; }
.target:hover { border-color: var(--sky); transform: translateY(-3px); }
.target .img { position: relative; aspect-ratio: 5 / 3; overflow: hidden; background: #05060f; }
.target .img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.2s ease; }
.target .img img.crop { position: absolute; width: var(--w); height: auto; max-width: none; left: var(--l); top: var(--t); }
.target:hover .img img.crop { transform: scale(1.04); transform-origin: 50% 50%; }
.target .img .ph { position: absolute; inset: 0; min-height: 0; }
.target .stamp { position: absolute; left: 10px; top: 10px; font-family: var(--f-mono); font-size: 11px; letter-spacing: .12em; padding: 4px 8px; background: rgba(12,12,14,.8); border: 1px solid var(--line-strong); color: var(--accent-2); }
.target .body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.target h3 { font-size: 26px; }
.target .cat { font-family: var(--f-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--sky); }
.target dl { margin: 6px 0 0; display: grid; grid-template-columns: auto 1fr; gap: 3px 10px; font-size: 13px; color: var(--dim); }
.target dt { color: var(--faint); }
.target dd { margin: 0; color: #cfc9be; }
.target .note { font-size: 12px; color: var(--faint); margin-top: auto; padding-top: 6px; }
.upnext { margin-top: 16px; padding: 14px 18px; border: 1px dashed var(--line-strong); color: var(--dim); font-size: 14px; }
.upnext b { font-family: var(--f-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--accent-2); margin-right: 8px; }

/* ---------- Lern-Bausteine (interaktiv) ---------- */
.lab { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr)); gap: 18px; }
.mod { border: 1px solid var(--line-strong); background: var(--panel); display: flex; flex-direction: column; }
.mod header { padding: 16px 18px 6px; }
.mod header h3 { font-size: 28px; }
.mod header p { margin: 6px 0 0; color: #cfc9be; font-size: 15px; }
.mod .stage { padding: 10px 18px; }
.mod .stage canvas, .mod .stage svg { display: block; width: 100%; height: auto; background: #07080f; border: 1px solid var(--line); }
.mod .ctl { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; padding: 10px 18px 16px; font-size: 14px; color: var(--dim); }
.mod .out { margin: 0 18px 16px; padding: 10px 12px; font-family: var(--f-mono); font-size: 13px; background: #0e0f16; border: 1px solid var(--line); color: #dfe3ff; min-height: 44px; }
.mod .out.warn { border-color: var(--bad); color: #ffb4ad; }
.mod .out.good { border-color: rgba(79,195,109,.5); color: #b6f1c7; }
.mod .src { padding: 0 18px 14px; font-size: 12px; color: var(--faint); margin-top: auto; }
.tgl { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; user-select: none; }
.tgl input { width: 18px; height: 18px; accent-color: var(--accent); }
.mod select, .mod input[type=number] { background: var(--panel-2); color: var(--text); border: 1px solid var(--line-strong); padding: 7px 9px; font: inherit; }
.mod input[type=range] { accent-color: var(--accent); min-width: 150px; flex: 1 1 150px; }
.mod button.b { background: transparent; color: var(--text); border: 1px solid var(--line-strong); padding: 8px 14px; font-family: var(--f-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; }
.mod button.b:hover { border-color: var(--text); }

/* ---------- Top-5 ---------- */
.top5 { counter-reset: t; display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.top5 li { counter-increment: t; display: grid; grid-template-columns: 56px 1fr; gap: 14px; padding: 16px 18px; border: 1px solid var(--line-strong); background: var(--panel); }
.top5 li::before { content: counter(t); font-family: var(--f-display); font-size: 54px; line-height: .9; color: var(--accent); }
.top5 b { font-family: var(--f-display); font-size: 24px; text-transform: uppercase; display: block; line-height: 1.05; }
.top5 span.t { color: #cfc9be; font-size: 15px; }

/* ---------- Video-Verweis & Galerie ---------- */
.videos { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 16px; }
.vlink { display: flex; gap: 14px; align-items: center; padding: 18px; border: 1px solid var(--line-strong); background: var(--panel); transition: border-color .2s; }
.vlink:hover { border-color: var(--accent); }
.vlink .play { flex: none; width: 54px; height: 54px; border-radius: 50%; border: 2px solid var(--accent); display: grid; place-items: center; }
.vlink .play::after { content: ""; border-left: 16px solid var(--accent); border-top: 10px solid transparent; border-bottom: 10px solid transparent; margin-left: 4px; }
.vlink b { display: block; font-family: var(--f-display); font-size: 24px; text-transform: uppercase; }
.vlink span.s { color: var(--dim); font-size: 14px; }
.gal { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 12px; }
.gal .ph { min-height: 170px; }
.hint { margin-top: 14px; font-size: 13px; color: var(--faint); }

/* ---------- Bewegung reduzieren ---------- */
@media (prefers-reduced-motion: reduce) {
  .target, .target .img img { transition: none; }
  .astro-svg-anim * { animation: none !important; }
}
.sky-rot { transform-origin: 50% 50%; animation: skyrot 90s linear infinite; }
@keyframes skyrot { to { transform: rotate(360deg); } }
.sweep { animation: sweep 14s ease-in-out infinite alternate; }
@keyframes sweep { from { transform: translateX(-4px); } to { transform: translateX(4px); } }

/* ================= Unterseiten-Aufbau (Version 2) ================= */
.pagehead { padding-bottom: 8px; }
.pagehead h1.ph1 { font-size: clamp(44px, 8vw, 92px); margin-bottom: 14px; text-shadow: 0 0 60px rgba(141,155,255,.3); }
.subnav a.on { color: var(--text); border-color: var(--sky); }
.mod[hidden] { display: none; }
.lab { grid-template-columns: minmax(0, 860px); }
.labtabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.labtabs .chip { cursor: pointer; background: rgba(16,21,42,.6); }
.labtabs .chip[aria-pressed="true"] { border-color: var(--accent); color: #fff; background: rgba(226,98,15,.18); }

/* Übersicht: Kacheln */
.hub { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 14px; }
.hubtile { display: flex; flex-direction: column; gap: 8px; padding: 22px; border: 1px solid var(--line-strong); background: linear-gradient(160deg, rgba(20,26,56,.7), var(--panel)); transition: border-color .25s, transform .25s; }
.hubtile:hover { border-color: var(--sky); transform: translateY(-3px); }
.hubtile .n { font-family: var(--f-mono); font-size: 12px; letter-spacing: .2em; color: var(--accent-2); }
.hubtile h3 { font-size: clamp(28px, 3vw, 36px); }
.hubtile p { margin: 0; color: #cfc9be; font-size: 15px; flex: 1; }
.hubtile .go { font-family: var(--f-mono); font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--sky); margin-top: 6px; }
.hubtile .go .arr { display: inline-block; transition: transform .25s; }
.hubtile:hover .go .arr { transform: translateX(5px); }

/* Mein Weg: Geschichten statt Zeitleiste */
.stories { display: grid; gap: clamp(28px, 5vw, 56px); }
.story { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(18px, 3vw, 40px); align-items: center; }
.story.flip .txt { order: 2; }
.story h3 { margin-bottom: 12px; }
.story p { margin: 0 0 12px; color: #d6d0c5; max-width: 62ch; }
.story .ph { min-height: 220px; }
@media (max-width: 800px) { .story { grid-template-columns: 1fr; } .story.flip .txt { order: 0; } }

/* Ausrüstung */
.gear { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 14px; }
.gear-card { border: 1px solid var(--line-strong); background: var(--panel); padding: 18px 20px; }
.gear-card h3 { font-size: 26px; margin-bottom: 10px; color: var(--accent-2); }
.gear-card ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.gear-card li { padding-left: 16px; position: relative; color: #d6d0c5; font-size: 15px; }
.gear-card li::before { content: ""; position: absolute; left: 0; top: .6em; width: 6px; height: 6px; background: var(--accent); }

/* Zuletzt fotografiert: komplette Livestream-Bilder */
.shots { display: grid; gap: clamp(26px, 4vw, 44px); max-width: 1100px; }
.shot { border: 1px solid var(--line-strong); background: var(--panel); }
.shot .shotimg { display: block; background: #000; line-height: 0; }
.shot .shotimg img { width: 100%; height: auto; display: block; }
.shot .cap { padding: 16px 20px 20px; }
.shot h3 { margin-bottom: 4px; }
.shot .date { margin: 0 0 8px; font-family: var(--f-mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--accent-2); }
.shot .n { margin: 0; color: var(--dim); font-size: 14px; }

/* Balkon: Lichtfänger mit Hochformat-Platzhalter */
.lichtfaenger { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 22px; align-items: center; }
.ph.portrait { min-height: 0; aspect-ratio: 3 / 4; }
@media (max-width: 700px) { .lichtfaenger { grid-template-columns: 1fr; } .ph.portrait { max-width: 240px; } }
.hubtile, .hubtile:hover, .chip, .subnav a { text-decoration: none; }
.subnav .wrap { scrollbar-width: none; }

/* ================= Slider (Startseite Astro) ================= */
.slider { position: relative; }
.slider .track { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding: 4px 2px 10px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.slider .track::-webkit-scrollbar { display: none; }
.slider .slide { flex: 0 0 min(86%, 760px); scroll-snap-align: start; border: 1px solid var(--line-strong); background: var(--panel); transition: opacity .4s, border-color .25s; opacity: .55; }
.slider .slide.cur { opacity: 1; border-color: rgba(141,155,255,.5); }
.slider .slide .shotimg { display: block; background: #000; line-height: 0; }
.slider .slide .shotimg img { width: 100%; height: auto; display: block; }
.slider .slide .cap { padding: 12px 16px 16px; }
.slider .slide h3 { font-size: 26px; margin-bottom: 4px; }
.slider .slide .date { margin: 0; font-family: var(--f-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--accent-2); }
.slider .wegslide { flex-basis: min(80%, 360px); }
.slider .wegcard { display: block; height: 100%; text-decoration: none; }
.slider .wegcard .ph { min-height: 170px; border-width: 0 0 1px; }
.slider .wegcard p { margin: 4px 0 0; color: #cfc9be; font-size: 14px; }
.slider .wegcard:hover h3 { color: var(--accent-2); }
.sl-ctl { display: flex; align-items: center; gap: 12px; margin-top: 14px; flex-wrap: wrap; }
.sl-ctl button { width: 42px; height: 42px; border: 1px solid var(--line-strong); background: var(--panel); color: var(--text); font-size: 18px; cursor: pointer; }
.sl-ctl button:hover { border-color: var(--text); }
.sl-ctl .dots { display: flex; gap: 6px; flex: 1; justify-content: center; flex-wrap: wrap; }
.sl-ctl .dots i { width: 8px; height: 8px; border-radius: 50%; background: var(--line-strong); cursor: pointer; transition: background .2s, transform .2s; }
.sl-ctl .dots i.on { background: var(--accent); transform: scale(1.3); }
@media (max-width: 600px) { .slider .slide { flex-basis: 92%; } .sl-ctl .dots { order: 5; flex-basis: 100%; } }
@media (prefers-reduced-motion: reduce) { .slider .track { scroll-behavior: auto; } }

/* Pixel-Baustein: getrennte Auswahl links/rechts */
.sidectl { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); gap: 12px; padding: 4px 18px 8px; }
.sidectl fieldset { border: 1px solid var(--line); margin: 0; padding: 8px 12px 12px; display: grid; gap: 8px; min-width: 0; }
.sidectl legend { font-family: var(--f-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--accent-2); padding: 0 6px; }
.sidectl label { display: grid; gap: 4px; font-size: 13px; color: var(--dim); }
.sidectl select, .sidectl input[type=number] { width: 100%; min-width: 0; }
.sidectl .custom { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.sidectl .custom[hidden] { display: none; }
@media (max-width: 560px) { .sidectl { grid-template-columns: 1fr; } }

/* ================= Erfahrungsbericht (Magazin-Layout) ================= */
.mag { padding-bottom: 60px; }
.mag-head { padding: clamp(40px, 7vw, 90px) 0 10px; max-width: 900px; }
.mag-head .dach { font-family: var(--f-mono); font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--accent-2); margin: 0 0 14px; }
.mag-head h1 { font-size: clamp(48px, 9vw, 112px); line-height: .9; margin-bottom: 22px; text-shadow: 0 0 60px rgba(141,155,255,.25); }
.mag-head .vorspann { font-size: clamp(19px, 2vw, 24px); line-height: 1.45; color: #dcd6ca; max-width: 38em; margin: 0 0 12px; }
.mag-head .byline { font-family: var(--f-mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--dim); margin: 18px 0 0; padding-top: 14px; border-top: 1px solid var(--line-strong); }
.mag-body { max-width: 760px; margin-left: max(var(--gutter), calc((100% - var(--wrap)) / 2)); }
@media (max-width: 900px) { .mag-body { margin-inline: auto; } }
.mag-body p { font-size: 18px; line-height: 1.7; color: #d9d3c7; margin: 0 0 1.15em; }
.mag-body p.lead-in::first-letter { font-family: var(--f-display); font-weight: 800; font-size: 4.6em; line-height: .8; float: left; padding: .06em .12em 0 0; color: var(--accent); }
.mag-body h2 { font-size: clamp(30px, 4vw, 44px); margin: 1.6em 0 .5em; }
.mag-body .pull { margin: 1.6em 0; padding: .2em 0 .2em 1.1em; border-left: 4px solid var(--accent); font-family: var(--f-display); font-weight: 700; text-transform: none; font-size: clamp(26px, 3.4vw, 38px); line-height: 1.12; color: var(--text); }
.mag-body figure { margin: 1.8em 0; }
.mag-body figure.fig-wide { margin-inline: min(0px, -4vw); }
.mag-body figcaption { margin-top: 8px; font-size: 13px; color: var(--dim); }
.mag-body figure .ph { min-height: 240px; }
.mag-body figure .ph.wide { min-height: 340px; }
.mag-body a.inl { color: var(--accent-2); text-decoration: underline; text-underline-offset: 3px; }

/* ================= Slider: Pfeile an den Seiten ================= */
.slider .sl-arrow { position: absolute; top: calc(50% - 60px); z-index: 3; width: 52px; height: 52px; border-radius: 50%; border: 1px solid rgba(255,255,255,.3); background: rgba(12,12,14,.72); backdrop-filter: blur(4px); color: #fff; font-size: 30px; line-height: 1; cursor: pointer; display: grid; place-items: center; padding: 0 0 4px; transition: transform .2s, background .2s, border-color .2s; }
.slider .sl-prev { left: 10px; }
.slider .sl-next { right: 10px; }
.slider .sl-arrow:hover { background: var(--accent); border-color: var(--accent); }
.slider .sl-prev:hover { transform: translateX(-4px) scale(1.06); }
.slider .sl-next:hover { transform: translateX(4px) scale(1.06); }
.slider .sl-arrow:active { transform: scale(.92); }
.slider .sl-ctl { justify-content: space-between; }
.slider .sl-ctl .dots { flex: 1; justify-content: flex-start; }
.slider .slide .shotimg img { cursor: default; }
.slider.big .slide { flex-basis: 100%; opacity: 1; }
.slider.big .slide .shotimg img { cursor: zoom-in; }
.slider.big .slide h3 { font-size: 32px; }
.slider.big .slide .fs { margin: 8px 0 4px; font-family: var(--f-mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--sky); }
.slider.big .slide .n { margin: 0; color: var(--dim); font-size: 14px; }
.slider.big { max-width: 1200px; }
@keyframes slidein { from { transform: translateX(14px); opacity: .6; } to { transform: none; opacity: 1; } }
.slider .slide.cur { animation: slidein .5s ease; }
@media (prefers-reduced-motion: reduce) { .slider .slide.cur { animation: none; } .slider .sl-arrow, .slider .sl-arrow:hover { transition: none; transform: none; } }
@media (max-width: 600px) { .slider .sl-arrow { width: 44px; height: 44px; font-size: 26px; } }

/* Vollbild-Ansicht (Lightbox) */
.lightbox { position: fixed; inset: 0; z-index: 100; background: rgba(0,0,0,.94); display: grid; place-items: center; padding: 16px; cursor: zoom-out; }
.lightbox img { max-width: 100%; max-height: 100%; object-fit: contain; }
.lightbox .x { position: absolute; top: 12px; right: 16px; font-family: var(--f-mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: #fff; border: 1px solid rgba(255,255,255,.4); padding: 8px 12px; background: rgba(0,0,0,.5); }

/* Erfahrungsbericht-Teaser auf der Startseite */
.report { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); border: 1px solid var(--line-strong); background: var(--panel); text-decoration: none; transition: border-color .25s; }
.report:hover { border-color: var(--accent); }
.report .ph { min-height: 260px; border-width: 0 1px 0 0; }
.report .rt { padding: clamp(20px, 3.5vw, 44px); display: flex; flex-direction: column; justify-content: center; gap: 10px; }
.report h2 { margin: 0; font-size: clamp(34px, 4.4vw, 56px); }
.report p { margin: 0; color: #d6d0c5; max-width: 46ch; }
.report .go { font-family: var(--f-mono); font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--accent-2); margin-top: 8px; }
.report:hover .go .arr { display: inline-block; transform: translateX(5px); }
@media (max-width: 760px) { .report { grid-template-columns: 1fr; } .report .ph { border-width: 0 0 1px; min-height: 180px; } }

/* Galerie-Vorschau */
.gsearch input { width: 100%; max-width: 520px; padding: 12px 14px; background: var(--panel-2); border: 1px solid var(--line-strong); color: var(--dim); font: inherit; margin-bottom: 16px; }

/* ---------- Astro-Leiste: Hauptpunkte + "Mehr" ---------- */
.subnav .more { flex: none; cursor: pointer; background: none; font-family: var(--f-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--dim); padding: 8px 12px; border: 1px solid var(--line); }
.subnav .more:hover, .subnav.open .more { color: var(--text); border-color: var(--line-strong); }
.subnav .more .car { display: inline-block; transition: transform .2s; }
.subnav.open .more .car { transform: rotate(180deg); }
.subnav .xtra { display: none; flex-basis: 100%; flex-wrap: wrap; gap: 6px; padding-top: 6px; border-top: 1px solid var(--line); }
.subnav.open .xtra { display: flex; }

/* ---------- Pixel statt Glas: Dual-Rig-Knopf ---------- */
.mod .ctl.rigbar { gap: 12px; padding-bottom: 6px; }
.mod button.rig { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 3px; cursor: pointer; text-align: left; color: #fff; background: linear-gradient(135deg, #e2620f, #e8a54c); border: 0; padding: 12px 22px; box-shadow: 0 6px 28px rgba(226,98,15,.35); transition: transform .15s, box-shadow .15s; }
.mod button.rig:hover { transform: translateY(-1px); box-shadow: 0 8px 34px rgba(226,98,15,.5); }
.mod button.rig .rt1 { font-family: var(--f-display); font-size: 24px; letter-spacing: .04em; text-transform: uppercase; line-height: 1; }
.mod button.rig .rt2 { font-family: var(--f-mono); font-size: 11px; letter-spacing: .08em; opacity: .92; }