/* Ark-Software-Markenschema (Tiefblau). Wird NACH styles.css geladen und
   ueberschreibt nur die Farb-Tokens — in allen vier Selektor-Varianten, die
   styles.css kennt. Papier/Tinte bleiben hell/dunkel-neutral, --accent (Bernstein)
   bleibt als gemeinsame Klammer aller Ark-Marken unveraendert. */
:root{
  --paper:#F5F8FA;
  --ink:#16222D;
  --muted:#5C6C7A;
  --line:#DFE6EC;
  --hairline:#E9EEF3;
  --forest:#1D3B57;
  --forest-deep:#142B41;
  --forest-ink:#EDF2F7;
  --leaf:#3F7CAC;
  --leaf-soft:#E3EDF4;
  --sketch:#D3DCE5;
  --sil-1:#E2EAF1;--sil-2:#C9D8E4;--sil-3:#A9C0D3;--sil-4:#8BA9C2;--sil-line:#7796B3;
  --shadow:0 1px 1px rgba(22,34,45,.03),0 18px 44px -24px rgba(22,34,45,.18);
}
@media (prefers-color-scheme: dark){
  :root{
    --paper:#0E141A;--card:#151E26;--ink:#EBF1F6;--muted:#93A4B4;--line:#25313D;--hairline:#1E2933;
    --forest:#14293D;--forest-deep:#0F2030;--forest-ink:#EDF2F7;
    --leaf:#5D9BC4;--leaf-soft:#1A2B3A;--sketch:#233040;
    --sil-1:#15202B;--sil-2:#1B2938;--sil-3:#243748;--sil-4:#2E455C;--sil-line:#3C587A;
    --shadow:0 1px 1px rgba(0,0,0,.25),0 18px 44px -24px rgba(0,0,0,.55);
  }
}
:root[data-theme="light"]{
  --paper:#F5F8FA;--card:#FFFFFF;--ink:#16222D;--muted:#5C6C7A;--line:#DFE6EC;--hairline:#E9EEF3;
  --forest:#1D3B57;--forest-deep:#142B41;--forest-ink:#EDF2F7;
  --leaf:#3F7CAC;--leaf-soft:#E3EDF4;--sketch:#D3DCE5;
  --sil-1:#E2EAF1;--sil-2:#C9D8E4;--sil-3:#A9C0D3;--sil-4:#8BA9C2;--sil-line:#7796B3;
  --shadow:0 1px 1px rgba(22,34,45,.03),0 18px 44px -24px rgba(22,34,45,.18);
}
:root[data-theme="dark"]{
  --paper:#0E141A;--card:#151E26;--ink:#EBF1F6;--muted:#93A4B4;--line:#25313D;--hairline:#1E2933;
  --forest:#14293D;--forest-deep:#0F2030;--forest-ink:#EDF2F7;
  --leaf:#5D9BC4;--leaf-soft:#1A2B3A;--sketch:#233040;
  --sil-1:#15202B;--sil-2:#1B2938;--sil-3:#243748;--sil-4:#2E455C;--sil-line:#3C587A;
  --shadow:0 1px 1px rgba(0,0,0,.25),0 18px 44px -24px rgba(0,0,0,.55);
}

/* ---------- Wortmarke (Platzhalter, bis es ein echtes Ark-Software-Logo gibt) ----------
   Das Icon: drei gestapelte Ebenen, die nach oben zum "A" konvergieren —
   Kommune, Land, Bund auf einer Plattform. Bernstein-Kachel wie bei Ark Climate. */
.wordmark{color:var(--ink);font-size:20px;gap:10px}
svg.logo-mark{width:26px;height:26px;flex:none;display:block;border-radius:8px}

/* ---------- Verwaltungs-Panorama (Hero) ---------- */
#govScene{width:100%;height:100%;display:block}
#govScene .gov-label{
  font-family:'InstrumentSans',system-ui,sans-serif;font-size:11px;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;
}
.dataflow{
  stroke:var(--accent);stroke-width:1.6;fill:none;stroke-linecap:round;
  stroke-dasharray:2 7;animation:ark-flow 3.2s linear infinite;opacity:.8;
}
@keyframes ark-flow{to{stroke-dashoffset:-90}}
.gov-win{animation:ark-win 5s ease-in-out infinite}
@keyframes ark-win{0%,100%{opacity:.35}50%{opacity:1}}

/* ---------- Produkt-Konstellation ---------- */
.prod-wrap{position:relative;padding-top:86px}
#prodLinks{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
#prodLinks path{stroke:var(--accent);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-dasharray:2 7;opacity:.7;animation:ark-flow 3.2s linear infinite}
.prod-hub{
  position:absolute;top:0;left:50%;transform:translateX(-50%);z-index:1;
  display:inline-flex;align-items:center;gap:9px;
  font-family:'Bricolage',sans-serif;font-weight:800;font-size:17px;letter-spacing:-.02em;
  background:var(--card);border:1px solid var(--hairline);border-radius:999px;
  padding:10px 22px;box-shadow:var(--shadow);white-space:nowrap;
}
.prod-hub .logo-mark{width:20px;height:20px;border-radius:6px}
.prod-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:840px){
  .prod-grid{grid-template-columns:1fr}
  .prod-wrap{padding-top:0}
  .prod-hub{display:none}
  #prodLinks{display:none}
}
.prod-card{
  display:flex;flex-direction:column;gap:12px;text-decoration:none;
  background:var(--card);border:1px solid var(--hairline);border-radius:var(--radius);
  padding:30px 28px;box-shadow:var(--shadow);
  transition:transform .2s ease,box-shadow .2s ease;
}
a.prod-card:hover{transform:translateY(-3px)}
.prod-card h3{font-size:21px}
.prod-card p{font-size:14.5px;color:var(--muted);flex:1}
.prod-card.soon{border-style:dashed;background:color-mix(in srgb,var(--card) 55%,var(--paper))}
.prod-dot{width:14px;height:14px;border-radius:50%;display:block}
.prod-dot.climate{background:#35906B}
.prod-dot.planning{background:#3F7CAC}
.prod-dot.soon-dot{position:relative;background:var(--accent)}
.prod-dot.soon-dot i{
  position:absolute;inset:-5px;border-radius:50%;border:1.5px solid var(--accent);
  opacity:.5;animation:ark-pulse 2.2s ease-out infinite;display:block;
}
@keyframes ark-pulse{0%{transform:scale(.6);opacity:.7}100%{transform:scale(1.5);opacity:0}}
.prod-link{font-size:14px;font-weight:700;color:var(--leaf)}
.prod-card.soon .prod-link{color:var(--muted)}

/* ---------- Credentials ---------- */
.cred-sec{padding-bottom:calc(var(--sec) * .6)}
.cred-sec .partner-ticker{margin-top:56px}