/* Variante A „Tiefe“ — dunkel, bildstark, sportlich. Tokens aus design/homepage/README.md */
html[data-theme="tiefe"]{
  --bg:#07141c; --surface:#0e2c3b; --surface-2:#0a1d27; --line:#1d3643;
  --text:#e8f1f4; --text-2:#9fb6bf; --text-3:#b8cad1;
  --accent:#3fc6dc; --on-accent:#07141c; --primary:#3fc6dc; --primary-soft:rgba(63,198,220,.14);
  --action:#3fc6dc; --on-action:#07141c; --card:#0e2c3b; --card-line:#1d3643; --img-fallback:#0e2c3b; --error:#ff8a80;
  --font-head:"Archivo",system-ui,sans-serif; --font-body:"Archivo",system-ui,sans-serif; --font-mono:"JetBrains Mono",monospace;
  --r-lg:16px; --r-md:12px; --r-sm:10px; --r-btn:999px; --r-input:10px;
  --pad-x:56px; --sec-gap:88px; --sec-gap-sm:56px;
  --head-pad:28px 56px; --head-pad-m:48px 20px 0; --nav-active-bg:transparent; --menu-btn-bg:rgba(255,255,255,.14); --menu-close-r:50%;
  --hero-overlay:linear-gradient(180deg,rgba(7,20,28,.6) 0%,rgba(7,20,28,.1) 35%,rgba(7,20,28,.94) 100%);
  --hero-title:#fff; --hero-text:#c6d6dc; --hero-card-bg:rgba(7,20,28,.72); --hero-card-line:rgba(63,198,220,.35); --hero-card-text:#e8f1f4; --hero-card-sub:#9fb6bf;
  --tile-gap:2px; --tile-r:0; --tile-h:340px; --tile-pad:28px;
  --stat-gap:0; --stat-bg:transparent; --stat-r:0; --stat-pad:0; --stat-value:var(--text); --stat-border:1px solid var(--line);
  --tn-gap:64px; --box-bg:transparent; --box-r:0; --box-pad:0; --date-bg:var(--surface); --date-text:var(--text); --weekly-bg:var(--surface); --weekly-text:var(--text);
  --spot-r:12px; --spot-bg:var(--surface-2); --spot-line:var(--line);
  --footer-margin:0; --footer-r:0; --footer-bg:var(--accent); --footer-text:#07141c; --footer-btn-bg:#07141c; --footer-btn-text:#e8f1f4;
  --step-pad:24px 0 0; --step-bg:transparent; --step-border:2px solid var(--accent);
  --levels-bg:transparent; --level-bg:var(--surface-2); --form-bg:var(--surface); --input-bg:var(--bg);
}
/* Kopfzeile liegt auf der Startseite über dem Hero */
html[data-theme="tiefe"] .site-header--home{position:absolute;left:0;right:0;top:0;background:transparent}
html[data-theme="tiefe"] .site-header{color:#fff}
html[data-theme="tiefe"] body[data-page="sub"] .site-header,html[data-theme="tiefe"] .site-header:not(.site-header--home){border-bottom:1px solid var(--line)}
html[data-theme="tiefe"] .brand__sub{color:#9fb6bf}
html[data-theme="tiefe"] .main-nav ul.level_1>li>a{padding:10px 18px}
/* Einstiege: Bild mit Verlauf, Text darüber */
html[data-theme="tiefe"] .tile{background:var(--surface-2)}
html[data-theme="tiefe"] .tile__img{position:absolute;inset:0}
html[data-theme="tiefe"] .tile__img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,20,28,0) 30%,rgba(7,20,28,.95) 100%)}
html[data-theme="tiefe"] .tile__body{position:relative;margin-top:auto;color:#fff}
html[data-theme="tiefe"] .tile__kicker{display:block}
html[data-theme="tiefe"] .tile__text{color:#b8cad1}
html[data-theme="tiefe"] .einstiege{padding-left:0;padding-right:0;padding-top:0}
html[data-theme="tiefe"] .einstiege__grid{max-width:none}
html[data-theme="tiefe"] .einstiege__title{display:none}
html[data-theme="tiefe"] .hero__btn2,html[data-theme="tiefe"] .chip--hero{display:none}
/* Sonstiges */
html[data-theme="tiefe"] .spot__nr::before{display:none}
html[data-theme="tiefe"] .levels{padding:0}
html[data-theme="tiefe"] .level{background:transparent;border-top:1px solid var(--line);border-radius:0;padding:16px 0}
html[data-theme="tiefe"] .levels__list{gap:0}
html[data-theme="tiefe"] .fact{background:var(--surface-2)}
html[data-theme="tiefe"] .fact__label{background:transparent;color:var(--accent);padding:0;letter-spacing:.14em;text-transform:uppercase;font-size:12px}
html[data-theme="tiefe"] .btn--primary{background:var(--accent);color:var(--on-accent)}
html[data-theme="tiefe"] .main-nav ul.level_2{background:var(--surface)}
html[data-theme="tiefe"] .mobile-bar .btn--outline{border-color:var(--accent);color:var(--accent)}
/* Lange Textseiten auf hellem Grund (Satzung etc.) */
html[data-theme="tiefe"] .page-content{background:#e8f1f4;color:#07141c}
html[data-theme="tiefe"] .page-content a{color:#0a6c8c}
