/* ============================================================
   FRANKFURT 2042 — Startseite v2 "REGEN"
   Scope: ausschließlich .v2-* / .v2-Wrapper auf der Home-Seite.
   Farben kommen aus dem bestehenden Theme-System
   (includes/theme-inline.php): --theme-bg / --theme-text /
   --theme-accent / --theme-panel. Kein Eingriff in site.css.
   ============================================================ */

/* Self-hosted Fonts (DSGVO: kein Google-CDN) */
@font-face{
  font-family:'Archivo';
  font-style:normal;
  font-weight:400 900;
  font-stretch:62% 125%;
  font-display:swap;
  src:url('/assets/fonts/archivo-var.woff2') format('woff2');
}
@font-face{
  font-family:'IBM Plex Mono';
  font-style:normal;font-weight:400;font-display:swap;
  src:url('/assets/fonts/plexmono-400.woff2') format('woff2');
}
@font-face{
  font-family:'IBM Plex Mono';
  font-style:normal;font-weight:500;font-display:swap;
  src:url('/assets/fonts/plexmono-500.woff2') format('woff2');
}

.v2{
  --v2-ink: var(--theme-bg, #120c08);
  --v2-paper: var(--theme-text, #f0e8dc);
  --v2-signal: var(--theme-accent, #ff6600);
  --v2-panel: var(--theme-panel, #1a120c);
  --v2-dim: color-mix(in srgb, var(--theme-text, #f0e8dc) 55%, var(--theme-bg, #120c08));
  --v2-line: color-mix(in srgb, var(--theme-accent, #ff6600) 22%, transparent);
  --v2-nato: #e8b45a;
  --fd: 'Archivo', system-ui, sans-serif;
  --fm: 'IBM Plex Mono', ui-monospace, monospace;
}

/* ---------- Regen (2 Ebenen), Nebel — nur Home ---------- */
.v2-rain{position:fixed;inset:-5%;pointer-events:none;z-index:-1}
.v2-rain i{position:absolute;inset:0;background-repeat:repeat;display:block}
.v2-rain .r1{opacity:.10;
  background-image:linear-gradient(103deg, transparent 0 46%, rgba(200,215,240,.9) 46.5% 47%, transparent 47.5%);
  background-size:31px 90px;animation:v2rain1 .55s linear infinite}
.v2-rain .r2{opacity:.07;
  background-image:linear-gradient(101deg, transparent 0 46%, rgba(170,190,220,.8) 46.5% 47.2%, transparent 48%);
  background-size:53px 160px;animation:v2rain2 .9s linear infinite}
@keyframes v2rain1{to{background-position:-14px 90px}}
@keyframes v2rain2{to{background-position:-20px 160px}}

/* ---------- HERO ---------- */
.v2-hero{min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;
  position:relative;isolation:isolate;padding-top:70px;overflow:hidden;margin-top:-70px}
/* Kontrast-Gradient über der bestehenden Body-Slideshow */
.v2-hero::before{content:"";position:absolute;inset:0;z-index:-2;
  background:
    linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.12) 34%, rgba(0,0,0,.18) 60%, var(--v2-ink) 100%),
    linear-gradient(90deg, rgba(0,0,0,.5) 0%, transparent 55%)}
/* atmender Akzent-Stadtschein */
.v2-hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(1100px 480px at 62% 78%, color-mix(in srgb, var(--v2-signal) 12%, transparent), transparent 65%);
  animation:v2breath 9s ease-in-out infinite}
@keyframes v2breath{50%{opacity:.55}}

.v2-fog{position:absolute;left:-15%;right:-15%;height:32%;bottom:-4%;z-index:-1;pointer-events:none;
  background:radial-gradient(55% 90% at 50% 60%, rgba(140,150,180,.10), transparent 70%);
  filter:blur(30px);animation:v2fog 44s ease-in-out infinite alternate}
.v2-fog.f2{bottom:8%;height:22%;opacity:.7;
  background:radial-gradient(55% 90% at 50% 60%, color-mix(in srgb, var(--v2-signal) 8%, transparent), transparent 70%);
  animation-duration:58s;animation-direction:alternate-reverse}
@keyframes v2fog{from{transform:translateX(-4%)}to{transform:translateX(4%)}}

/* Gewitter */
.v2-flash{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;
  background:radial-gradient(55% 46% at var(--fx,68%) 6%,
    rgba(215,228,255,.95), rgba(150,180,255,.28) 42%, transparent 72%)}
.v2-flash.go{animation:v2flash 1.1s ease-out}
@keyframes v2flash{0%{opacity:0}6%{opacity:.95}12%{opacity:.12}20%{opacity:.75}
  30%{opacity:.18}38%{opacity:.4}100%{opacity:0}}

.v2-wrap{width:min(1180px, calc(100vw - 44px));margin:0 auto;position:relative}

.v2 .v2-m, .v2 .v2-m span{font-family:var(--fm) !important;font-size:12px;letter-spacing:.08em;
  color:color-mix(in srgb, var(--v2-paper) 72%, var(--v2-ink)) !important;text-transform:uppercase;
  text-shadow:0 1px 12px rgba(0,0,0,.9)}
.v2 .v2-m b{color:var(--v2-signal) !important;font-weight:500}
.v2-meta{display:flex;gap:22px;flex-wrap:wrap;margin-bottom:26px;align-items:center}
.v2-rec{display:inline-flex;align-items:center;gap:7px}
.v2-rec i{width:8px;height:8px;border-radius:50%;background:var(--v2-signal);
  box-shadow:0 0 10px color-mix(in srgb, var(--v2-signal) 55%, transparent);
  animation:v2blink 2s steps(2) infinite}
@keyframes v2blink{50%{opacity:.35}}

.v2 h1.v2-title{font-family:var(--fd);font-weight:900;font-variation-settings:"wdth" 68;
  text-transform:uppercase;font-size:clamp(40px,7.4vw,104px);line-height:.95;
  letter-spacing:.005em;max-width:13ch;margin:0;
  color:var(--v2-paper) !important;
  text-shadow:0 3px 40px rgba(0,0,0,.85)}
.v2-track{position:relative;display:inline-block;color:var(--v2-signal) !important}
.v2-track i{position:absolute;width:14px;height:14px;border:1.5px solid var(--v2-signal);opacity:.85}
.v2-track i:nth-child(1){top:-8px;left:-11px;border-right:0;border-bottom:0}
.v2-track i:nth-child(2){top:-8px;right:-11px;border-left:0;border-bottom:0}
.v2-track i:nth-child(3){bottom:-3px;left:-11px;border-right:0;border-top:0}
.v2-track i:nth-child(4){bottom:-3px;right:-11px;border-left:0;border-top:0}
.v2-track::after{content:"ERFASST · 04:12:31";position:absolute;top:-26px;right:-8px;
  font-family:var(--fm);font-size:10px;letter-spacing:.2em;font-weight:400;
  color:var(--v2-signal);opacity:.8}

.v2 p.v2-sub{margin:28px 0 0;max-width:52ch;font-size:18px;line-height:1.7;
  color:color-mix(in srgb, var(--v2-paper) 78%, #888) !important;
  text-shadow:0 2px 24px rgba(0,0,0,.9)}
.v2 p.v2-sub b{color:var(--v2-paper) !important;font-weight:600}
.v2 .v2-f2042{display:inline-block;font-family:var(--fd);font-weight:900;
  font-variation-settings:"wdth" 74;text-transform:uppercase;letter-spacing:.04em;
  font-size:21px;color:var(--v2-paper) !important;margin-right:6px;
  border-bottom:2px solid var(--v2-signal);padding-bottom:1px}

.v2 p.v2-question{margin:22px 0 0;max-width:56ch;font-family:var(--fd);
  font-weight:600;font-variation-settings:"wdth" 84;font-size:17px;line-height:1.55;
  color:color-mix(in srgb, var(--v2-paper) 88%, #999) !important;
  border-left:3px solid var(--v2-nato);padding-left:14px;
  text-shadow:0 2px 20px rgba(0,0,0,.9)}

.v2-cta{display:flex;gap:14px;margin-top:36px;flex-wrap:wrap}
.v2 .v2-btn{font-family:var(--fm) !important;font-size:13px;letter-spacing:.16em;
  text-transform:uppercase;padding:16px 30px;display:inline-flex;align-items:center;gap:10px;
  cursor:pointer;line-height:1.5;text-decoration:none;
  transition:filter .2s, border-color .2s}
.v2 .v2-btn:hover{filter:brightness(1.15)}
/* Ghost-Variante muss die Theme-!important-Regeln gezielt übersteuern */
.v2 .v2-btn--ghost{background:rgba(0,0,0,.4) !important;color:var(--v2-signal) !important;
  border:1px solid var(--v2-line) !important;backdrop-filter:blur(4px)}
.v2 .v2-btn--ghost:hover{border-color:var(--v2-signal) !important}

/* Nato-Funkspruch */
.v2-nato-box{position:absolute;right:26px;bottom:126px;z-index:5;max-width:420px;
  background:rgba(0,0,0,.72) !important;backdrop-filter:blur(6px);
  border:1px solid rgba(232,180,90,.3);border-left:3px solid var(--v2-nato);
  padding:13px 18px;font-family:var(--fm);font-size:13px;line-height:1.65;
  opacity:0;transform:translateY(8px);transition:opacity .6s,transform .6s}
.v2-nato-box.on{opacity:1;transform:none}
.v2 .v2-nato-box, .v2 .v2-nato-box span{color:var(--v2-nato) !important}
.v2-nato-box .who{font-size:10px;letter-spacing:.2em;opacity:.55;display:block;margin-bottom:6px}
.v2-nato-box .cur{display:inline-block;width:7px;height:13px;background:var(--v2-nato);
  vertical-align:-2px;animation:v2blink 1.1s steps(2) infinite}

/* Systemlog-Leiste */
.v2-ticker{margin-top:56px;border-top:1px solid var(--v2-line);border-bottom:1px solid var(--v2-line);
  overflow:hidden;white-space:nowrap;background:rgba(0,0,0,.66);backdrop-filter:blur(4px)}
.v2-ticker-track{display:inline-block;padding:11px 0;animation:v2tick 46s linear infinite}
.v2 .v2-ticker span{font-family:var(--fm) !important;font-size:11.5px;letter-spacing:.1em;
  color:var(--v2-dim) !important;margin-right:60px}
.v2 .v2-ticker span b{color:var(--v2-signal) !important;font-weight:500}
@keyframes v2tick{to{transform:translateX(-50%)}}

/* ---------- SEKTIONEN ---------- */
.v2-section{padding:110px 0;position:relative;background:transparent}
.v2-sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;
  margin-bottom:54px;flex-wrap:wrap}
.v2 h2.v2-h2{font-family:var(--fd);font-weight:900;font-variation-settings:"wdth" 70;
  text-transform:uppercase;font-size:clamp(26px,3.8vw,44px);line-height:1.02;
  letter-spacing:.01em;margin:0;color:var(--v2-paper) !important;
  text-shadow:0 2px 26px rgba(0,0,0,.95), 0 1px 4px rgba(0,0,0,.8)}

/* Akten */
.v2-files{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--v2-line);border:1px solid var(--v2-line)}
.v2 .v2-file{background:var(--v2-panel) !important;padding:32px 30px 36px;position:relative;
  transition:filter .25s;display:block;text-decoration:none}
.v2 .v2-file:hover{filter:brightness(1.12)}
.v2 .v2-file .fno{font-family:var(--fm);font-size:11px;letter-spacing:.16em;
  color:var(--v2-dim) !important;display:flex;justify-content:space-between;margin-bottom:24px}
.v2 .v2-file .fno em{font-style:normal;color:var(--v2-signal) !important}
.v2 .v2-file h3{font-family:var(--fd);font-weight:900;font-variation-settings:"wdth" 74;
  text-transform:uppercase;font-size:25px;line-height:1.05;margin:0 0 14px;
  color:var(--v2-paper) !important}
.v2 .v2-file p{color:color-mix(in srgb, var(--v2-paper) 72%, var(--v2-ink)) !important;
  font-size:15.5px;line-height:1.7;margin:0}
.v2 .v2-file .quote{margin-top:22px;padding-top:18px;border-top:1px dashed var(--v2-line);
  font-size:15px;font-style:italic;line-height:1.65;
  color:color-mix(in srgb, var(--v2-paper) 85%, #888) !important}
.v2 .v2-file--nato{border-top:2px solid var(--v2-nato)}
.v2 .v2-file--nato .fno em{color:var(--v2-nato) !important}
html .v2 .v2-redact, html .v2 .v2-redact *{
  background:#0b0908 !important;color:transparent !important;
  text-shadow:none !important;border-radius:1px;
  padding:0 4px;cursor:help;transition:background .3s,color .3s;
  box-decoration-break:clone;-webkit-box-decoration-break:clone}
html .v2 .v2-file:hover .v2-redact{
  background:transparent !important;color:var(--v2-nato) !important}
.v2 .v2-redact-hint{font-family:var(--fm);font-size:10.5px;letter-spacing:.14em;
  color:var(--v2-dim) !important;text-transform:uppercase;display:block;margin-top:28px}
.v2 .v2-file:hover .v2-redact-hint{visibility:hidden}

/* Zitat-Band (nutzt vorhandenes Slideshow-Artwork) */
.v2-band{position:relative;isolation:isolate;padding:170px 0;
  background-image:var(--v2-band-img, none);
  background-size:cover;background-position:center 38%;background-attachment:fixed}
.v2-band::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg, rgba(0,0,0,.68) 0%, rgba(0,0,0,.38) 22%, rgba(0,0,0,.46) 74%, rgba(0,0,0,.68) 100%)}
.v2 .v2-band blockquote{max-width:34ch;font-family:var(--fd);font-weight:700;
  font-variation-settings:"wdth" 78;font-size:clamp(24px,3.4vw,40px);line-height:1.25;
  margin:0;color:var(--v2-paper) !important;text-shadow:0 3px 34px rgba(0,0,0,.9)}
.v2 .v2-band blockquote b{color:var(--v2-signal) !important}
.v2 .v2-band cite{display:block;margin-top:22px;font-family:var(--fm);font-style:normal;
  font-size:12px;letter-spacing:.2em;color:var(--v2-dim) !important;text-transform:uppercase}

/* Reader-Terminal */
.v2-term{border:1px solid var(--v2-line);display:grid;grid-template-columns:1.1fr .9fr;
  position:relative;overflow:hidden}
.v2 .v2-term{background:var(--v2-panel) !important}
.v2-term::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--v2-signal)}
.v2-term-left{padding:48px 50px;border-right:1px solid var(--v2-line)}
.v2 .v2-term-left p{color:var(--v2-dim) !important;max-width:46ch;line-height:1.7}
.v2-term-right{position:relative;min-height:340px;
  background-image:var(--v2-term-img, none);background-size:cover;background-position:center}
.v2-term-right::before{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg, var(--v2-panel) 0%, transparent 45%, rgba(0,0,0,.35) 100%)}
.v2 .v2-term-log{position:absolute;left:26px;bottom:22px;right:26px;
  font-family:var(--fm);font-size:12.5px;line-height:1.95;
  text-shadow:0 1px 8px rgba(0,0,0,.9)}
.v2 .v2-term-log div{color:color-mix(in srgb, var(--v2-paper) 70%, #888) !important}
.v2 .v2-term-log .warn{color:var(--v2-signal) !important}
.v2 .v2-term-log .nato{color:var(--v2-nato) !important}

/* ---------- LOGIN-GATE (Reader-Zugang) ---------- */
.v2-gate{position:fixed;inset:0;z-index:150;display:none;align-items:center;justify-content:center;
  background:rgba(0,0,0,.88);backdrop-filter:blur(8px);padding:24px;overflow-y:auto}
.v2-gate.open{display:flex}
.v2 .v2-gate-box{width:min(560px,94vw);position:relative;background:var(--v2-panel) !important;
  border:1px solid var(--v2-line);border-top:2px solid var(--v2-signal);
  box-shadow:0 30px 80px rgba(0,0,0,.6);padding:34px 38px 30px}
.v2 .v2-gate-close{position:absolute;top:12px;right:16px;
  background:none !important;border:none !important;cursor:pointer;
  color:var(--v2-dim) !important;font-family:var(--fm);font-size:15px;box-shadow:none !important}
.v2 .v2-gate-close:hover{color:var(--v2-signal) !important}
.v2 .v2-gate-eyebrow{font-family:var(--fm);font-size:11px;letter-spacing:.24em;
  color:var(--v2-dim) !important;text-transform:uppercase;margin-bottom:8px}
.v2 .v2-gate-title{font-family:var(--fd);font-weight:900;font-variation-settings:"wdth" 72;
  font-size:26px;letter-spacing:.02em;text-transform:uppercase;
  color:var(--v2-paper) !important;margin:0 0 4px}
.v2 .v2-gate-note{font-size:14.5px;color:var(--v2-dim) !important;margin:0 0 26px;line-height:1.6}
.v2-ig{margin-bottom:16px}
.v2 .v2-ig label{display:block;font-family:var(--fm);font-size:11px;letter-spacing:.2em;
  color:var(--v2-dim) !important;margin-bottom:7px;text-transform:uppercase}
.v2 .v2-ig label em{font-style:normal;letter-spacing:.08em;text-transform:none;opacity:.7}
.v2 .v2-ig input{width:100%;background:rgba(0,0,0,.5) !important;
  border:1px solid var(--v2-line) !important;color:var(--v2-paper) !important;
  font-family:var(--fm);font-size:15px;letter-spacing:.06em;padding:13px 15px;
  transition:border-color .2s;box-sizing:border-box}
.v2 .v2-ig input:focus{outline:none;border-color:var(--v2-signal) !important}
.v2-bio{position:relative;height:40px;border:1px dashed var(--v2-line);
  margin:4px 0 20px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.v2-bio .bio-line{position:absolute;top:0;bottom:0;width:34%;
  background:linear-gradient(90deg,transparent, color-mix(in srgb, var(--v2-signal) 16%, transparent), transparent);
  animation:v2bio 2.4s ease-in-out infinite}
@keyframes v2bio{0%{left:-34%}100%{left:100%}}
.v2 .v2-bio span{font-family:var(--fm) !important;font-size:11px;letter-spacing:.22em;
  color:var(--v2-dim) !important}
.v2 .v2-gate-btn{width:100%;cursor:pointer;font-family:var(--fm) !important;font-weight:500;
  font-size:13px;letter-spacing:.14em;line-height:1.5;padding:15px 18px;
  text-transform:uppercase;transition:filter .2s;border:none}
.v2 .v2-gate-btn:hover{filter:brightness(1.15)}
.v2 .v2-gate-btn:disabled{opacity:.55;cursor:wait}
.v2 .v2-gate-hint{margin-top:10px;text-align:center;font-family:var(--fm);font-size:11px;
  letter-spacing:.1em;color:var(--v2-dim) !important}
.v2 .v2-gate-status{margin-top:20px;font-family:var(--fm);font-size:12px;line-height:2;
  letter-spacing:.08em}
.v2 .v2-gate-status div, .v2 .v2-gate-status span{color:var(--v2-dim) !important}
.v2 .v2-gate-status .bad{color:var(--v2-signal) !important}
.v2 .v2-gate-status .blink{animation:v2blink 1.2s steps(2) infinite}
.v2 .v2-gate-nato{margin-top:14px;border-left:3px solid var(--v2-nato);
  background:rgba(232,180,90,.05) !important;padding:12px 16px;display:none;
  font-family:var(--fm);font-size:13px;line-height:1.9}
.v2 .v2-gate-nato, .v2 .v2-gate-nato div{color:var(--v2-nato) !important}
.v2 .v2-gate-nato.on{display:block}
.v2 .v2-gate-foot{margin-top:22px;font-family:var(--fm);font-size:10px;letter-spacing:.14em;
  text-align:center;color:var(--v2-dim) !important;text-transform:uppercase}
.v2 .v2-gate-foot b{color:var(--v2-signal) !important}
.v2-gate-box.glitching{animation:v2glitch .4s steps(2) 2}
@keyframes v2glitch{25%{transform:translate(-5px,2px)}50%{transform:translate(4px,-2px)}75%{transform:translate(-2px,1px)}}

/* Scroll-Reveal */
.v2-rv{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.v2-rv.on{opacity:1;transform:none}

/* Responsive */
@media (max-width:920px){
  .v2-files{grid-template-columns:1fr}
  .v2-term{grid-template-columns:1fr}
  .v2-term-left{border-right:0;border-bottom:1px solid var(--v2-line)}
  .v2-term-right{min-height:300px}
  .v2-nato-box{position:static;margin:34px 0 0;max-width:100%}
  .v2-band{background-attachment:scroll}
  .v2 .v2-gate-box{padding:28px 22px}
}
@media (prefers-reduced-motion:reduce){
  .v2 *,.v2 *::before,.v2 *::after,.v2-rain i{animation:none !important;transition:none !important}
  .v2-rv,.v2-nato-box{opacity:1;transform:none}
}
