/* ==========================================================================
   POWERMARSCH WÜRZBURG · Stil für alle Seiten
   Richtung: _design/RICHTUNG.md ("Wegzeichen am Main")
   Hell wie ein Maimorgen, Tinte für Text, Rot nur als Signal: Knopf, aktuelle
   Preisstufe, gelaufene Strecke, Wegzeichen. Zwei Schriften: Archivo (Display
   schmal und schwer, Text normal breit) und Martian Mono für Daten und Labels.
   ========================================================================== */

@font-face{
  font-family:"Archivo"; font-style:normal; font-weight:100 900; font-stretch:62% 125%; font-display:swap;
  src:url(fonts/archivo-var-latin.woff2) format("woff2-variations"), url(fonts/archivo-var-latin.woff2) format("woff2");
}
@font-face{
  font-family:"Martian Mono"; font-style:normal; font-weight:400; font-stretch:87.5%; font-display:swap;
  src:url(fonts/martianmono-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:"Martian Mono"; font-style:normal; font-weight:400; font-stretch:87.5%; font-display:swap;
  src:url(fonts/martianmono-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ---------- Tokens ---------- */
:root{
  /* Marke (live gemessen): Rot aus Logo und Knöpfen, Dunkelblaugrau der Wix-Texte */
  --red:#e21c21;
  --red-deep:#c0141a;          /* Hover, rote Schrift auf Papier (Kontrast 5,6:1) */
  --slate:#2a2f36;             /* Marke: Flächen Ticket-Abriss, Footer */
  /* abgeleitet, Werkzeug */
  --paper:#f3f1ec;
  --paper-2:#e9e6df;
  --card:#fbfaf7;
  --ink:#16181b;
  --mid:#5d6168;               /* 5,6:1 auf Papier */
  --line:#d5d1c8;
  --line-strong:#b9b4a9;
  --on-dark:#f3f1ec;
  --on-dark-mid:#aeb3ba;
  --line-dark:#434a53;

  --sans:"Archivo", "Helvetica Neue", Arial, sans-serif;
  --mono:"Martian Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --ease-out:cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out:cubic-bezier(0.77, 0, 0.175, 1);
  --t-press:160ms;
  --t-ui:220ms;
  --t-enter:760ms;

  --gutter:max(clamp(16px, 4vw, 64px), env(safe-area-inset-left, 0px), env(safe-area-inset-right, 0px));
  --col-gap:clamp(16px, 2vw, 32px);
  --maxw:1440px;
  --nav-h:72px;
  --section-y:clamp(88px, 12vh, 160px);
  color-scheme:light;
}
@media (max-width:767px){ :root{ --nav-h:64px; } }

/* ---------- Seitenwechsel ---------- */
@view-transition{ navigation:auto; }
::view-transition-old(root){ animation:vt-out 160ms var(--ease-out) both; }
::view-transition-new(root){ animation:vt-in 240ms var(--ease-out) both; }
@keyframes vt-out{ to{ opacity:0; } }
@keyframes vt-in{ from{ opacity:0; transform:translateY(6px); } }
@keyframes fade-in{ from{ opacity:0; } }

/* ---------- Basis ---------- */
*,*::before,*::after{ box-sizing:border-box; }
*{ margin:0; }
html{
  background:var(--paper);
  -webkit-text-size-adjust:100%; text-size-adjust:100%;
  -webkit-tap-highlight-color:transparent;
  overflow-x:clip;
  scroll-padding-top:calc(var(--nav-h) + 24px);
}
@media (prefers-reduced-motion: no-preference){ html{ scroll-behavior:smooth; } }
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.6;
  font-stretch:100%;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  hyphens:none; -webkit-hyphens:none;
  overflow-x:clip;
  overflow-wrap:break-word;
}
@media (max-width:767px){ body{ font-size:16px; } }
img, video, iframe, svg{ display:block; max-width:100%; }
img{ height:auto; }
a{ color:inherit; }
button{ font:inherit; color:inherit; cursor:pointer; background:none; border:0; padding:0; }
table{ border-collapse:collapse; }
address{ font-style:normal; }
::selection{ background:var(--red); color:#fff; }
:focus-visible{ outline:2px solid var(--red); outline-offset:3px; }
h1, h2, h3, h4{ font-weight:inherit; font-size:inherit; text-wrap:balance; }
p, li, dd{ text-wrap:pretty; }
.nums{ font-variant-numeric:tabular-nums; }
.nowrap{ white-space:nowrap; }

.skip-link{
  position:fixed; left:12px; top:12px; z-index:1000;
  background:var(--ink); color:var(--paper); padding:14px 18px;
  font-family:var(--mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase; text-decoration:none;
  transform:translateY(-160%); transition:transform var(--t-ui) var(--ease-out);
}
.skip-link:focus{ transform:none; }
.sr-only{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
[hidden]{ display:none !important; }

/* ---------- Raster ---------- */
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }
.grid{ display:grid; grid-template-columns:repeat(12, minmax(0, 1fr)); column-gap:var(--col-gap); }
.grid > *{ grid-column:1 / -1; }
.section{ padding-block:var(--section-y); }
.section--tight{ padding-block:clamp(48px, 7vh, 88px); }
.section--flush-top{ padding-top:0; }

/* ---------- Typo ---------- */
.label{
  font-family:var(--mono); font-size:11px; line-height:1.35; letter-spacing:.1em; text-transform:uppercase;
  font-weight:400; color:var(--mid);
}
@media (min-width:1024px){ .label{ font-size:12px; } }
.display-xl, .display-l, .display-m{
  overflow-wrap:normal;
  font-family:var(--sans); font-stretch:62%; font-weight:860; text-transform:uppercase;
  letter-spacing:-.004em; color:var(--ink);
}
.display-xl{ font-size:clamp(56px, 11.5vw, 176px); line-height:.86; }
.display-l{ font-size:clamp(40px, 6vw, 92px); line-height:.9; }
.display-m{ font-size:clamp(30px, 3.4vw, 48px); line-height:.95; }
.h3{ font-size:clamp(20px, 1.7vw, 24px); line-height:1.2; font-weight:650; font-stretch:92%; }
.statement{ font-size:clamp(24px, 2.6vw, 38px); line-height:1.2; font-weight:480; font-stretch:92%; letter-spacing:-.008em; }
.statement--s{ font-size:clamp(20px, 1.9vw, 27px); line-height:1.3; }
.prose p + p, .prose p + ul, .prose p + ol, .prose ul + p, .prose ol + p{ margin-top:14px; }
.prose{ max-width:64ch; }
.prose strong{ font-weight:650; }

.text-link{
  color:inherit; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px;
  text-decoration-color:color-mix(in srgb, currentColor 40%, transparent);
  transition:text-decoration-color var(--t-press) ease, color var(--t-press) ease;
}
@media (hover:hover) and (pointer:fine){ .text-link:hover{ text-decoration-color:var(--red); } }
.ext{ display:inline-block; margin-left:.3em; font-family:var(--sans); font-size:.9em; line-height:1; transition:transform var(--t-ui) var(--ease-out); }
@media (hover:hover) and (pointer:fine){ a:hover > .ext{ transform:translate(2px, -2px); } }
.text-btn{
  min-height:44px; padding:0 4px; font-family:var(--mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase;
  text-decoration:underline; text-underline-offset:4px; text-decoration-color:var(--line-strong);
}

/* ---------- Knöpfe ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.2em;
  min-height:52px; padding:0 22px;
  font-family:var(--mono); font-size:12px; letter-spacing:.09em; text-transform:uppercase; line-height:1.2;
  text-decoration:none; text-align:center;
  background:var(--red); color:#fff; border:1px solid var(--red);
  transition:background-color var(--t-press) ease, border-color var(--t-press) ease, color var(--t-press) ease, transform var(--t-press) var(--ease-out);
}
.btn:active{ transform:scale(.97); }
@media (hover:hover) and (pointer:fine){ .btn:hover{ background:var(--red-deep); border-color:var(--red-deep); } }
.btn--line{ background:transparent; color:var(--ink); border-color:var(--ink); }
@media (hover:hover) and (pointer:fine){ .btn--line:hover{ background:var(--ink); border-color:var(--ink); color:var(--paper); } }
.btn--glass{ background:rgba(22,24,27,.28); color:#fff; border-color:rgba(255,255,255,.7); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
@media (hover:hover) and (pointer:fine){ .btn--glass:hover{ background:#fff; color:var(--ink); border-color:#fff; } }
.btn--ink{ background:var(--red); border-color:var(--red); }
.btn--sm{ min-height:44px; padding:0 16px; }
.btn-row{ display:flex; flex-wrap:wrap; align-items:center; gap:12px 16px; }

/* ==========================================================================
   NAVIGATION
   ========================================================================== */
.site-nav{
  position:sticky; top:0; z-index:200;
  background:color-mix(in srgb, var(--paper) 92%, transparent);
  -webkit-backdrop-filter:saturate(1.2) blur(12px); backdrop-filter:saturate(1.2) blur(12px);
  border-bottom:1px solid var(--line);
  view-transition-name:site-nav;
}
::view-transition-group(site-nav){ animation:none; }
::view-transition-old(site-nav), ::view-transition-new(site-nav){ animation:none; }
.nav-inner{
  max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter);
  height:var(--nav-h); display:flex; align-items:center; gap:24px;
}
.nav-logo{ display:flex; align-items:center; gap:14px; text-decoration:none; margin-right:auto; min-height:44px; }
.nav-logo img{ width:auto; height:46px; }
.nav-name{ font-stretch:62%; font-weight:820; font-size:19px; letter-spacing:.01em; line-height:1; padding-top:2px; }
.nav-links{ display:flex; gap:4px; list-style:none; padding:0; }
.nav-links a{
  display:inline-flex; align-items:center; min-height:44px; padding:0 10px;
  font-family:var(--mono); font-size:11.5px; letter-spacing:.09em; text-transform:uppercase; text-decoration:none; color:var(--mid);
  transition:color var(--t-press) ease;
  position:relative;
}
.nav-links a[aria-current="page"]{ color:var(--ink); }
.nav-links a[aria-current="page"]::after{ content:""; position:absolute; left:10px; right:10px; bottom:9px; height:2px; background:var(--red); }
@media (hover:hover) and (pointer:fine){ .nav-links a:hover{ color:var(--ink); } }
.nav-cta[aria-current="page"]{ background:var(--ink); border-color:var(--ink); }
.nav-toggle{
  display:none; min-height:44px; min-width:44px; padding:0 4px;
  font-family:var(--mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase;
}
.nav-toggle-close{ display:none; }
.menu-open .nav-toggle-open{ display:none; }
.menu-open .nav-toggle-close{ display:inline; }
@media (max-width:1199px){ .nav-name{ display:none; } }
@media (max-width:1023px){
  .nav-main{ display:none; }
  .nav-toggle{ display:inline-flex; align-items:center; }
  .nav-inner{ gap:12px; }
}
@media (max-width:767px){
  .nav-logo img{ height:40px; }
  .site-nav .nav-cta{ display:none; }
}

.mobile-menu{
  position:fixed; inset:var(--nav-h) 0 0 0; z-index:190;
  background:var(--paper); padding:24px var(--gutter) max(24px, env(safe-area-inset-bottom));
  display:flex; flex-direction:column; justify-content:space-between; overflow:auto;
  opacity:0; visibility:hidden; transition:opacity var(--t-ui) var(--ease-out), visibility 0s linear var(--t-ui);
}
.menu-open .mobile-menu{ opacity:1; visibility:visible; transition:opacity var(--t-ui) var(--ease-out); }
.menu-open{ overflow:hidden; }
.mobile-menu ul{ list-style:none; padding:0; }
.mobile-menu li{ border-bottom:1px solid var(--line); opacity:0; transform:translateY(8px); transition:opacity 300ms var(--ease-out), transform 300ms var(--ease-out); transition-delay:calc(var(--i) * 40ms); }
.menu-open .mobile-menu li{ opacity:1; transform:none; }
.mobile-menu li a{
  display:flex; align-items:center; min-height:64px; text-decoration:none;
  font-stretch:62%; font-weight:860; text-transform:uppercase; font-size:clamp(34px, 9vw, 52px); line-height:1;
}
.mobile-menu li a[aria-current="page"]{ color:var(--red-deep); }
.menu-foot{ margin-top:32px; display:grid; gap:8px; font-size:15px; }
.menu-foot .label{ display:inline-block; min-width:80px; }
.menu-foot a{ text-decoration:underline; text-underline-offset:3px; }
@media (min-width:1024px){ .mobile-menu{ display:none; } }

/* ---------- Mobile Aktionsleiste ---------- */
.action-bar{ display:none; }
@media (max-width:767px){
  .action-bar{
    display:flex; align-items:center; justify-content:space-between; gap:12px;
    position:fixed; left:0; right:0; bottom:0; z-index:150;
    padding:10px var(--gutter) max(10px, env(safe-area-inset-bottom));
    background:var(--slate); color:var(--on-dark);
    transform:translateY(110%); transition:transform 320ms var(--ease-out);
  }
  .action-bar.is-shown{ transform:none; }
  .action-bar .label{ color:var(--on-dark); }
  .action-bar .bar-sep{ color:var(--on-dark-mid); padding-inline:4px; }
  .action-bar .btn{ min-height:46px; }
  .menu-open .action-bar, .cc-open .action-bar{ transform:translateY(110%); }
  body.has-bar .site-footer{ padding-bottom:calc(88px + env(safe-area-inset-bottom)); }
}

/* ==========================================================================
   AUFTRITTE (einmal, beim Sichtbarwerden)
   ========================================================================== */
.js [data-reveal]{
  opacity:0; transform:translateY(14px); filter:blur(4px);
  transition:opacity var(--t-enter) var(--ease-out), transform var(--t-enter) var(--ease-out), filter var(--t-enter) var(--ease-out);
  transition-delay:calc(var(--d, 0) * 60ms);
}
.js [data-reveal].is-in{ opacity:1; transform:none; filter:none; }
.js [data-rise]{ animation:rise var(--t-enter) var(--ease-out) both; animation-delay:calc(var(--i, 0) * 70ms + 60ms); }
.js .hero-title .line{ display:inline-block; animation:rise-line 900ms var(--ease-out) both; animation-delay:calc(var(--i, 0) * 90ms); }
@keyframes rise{ from{ opacity:0; transform:translateY(14px); filter:blur(6px); } }
@keyframes rise-line{ from{ opacity:0; transform:translateY(28%); filter:blur(8px); } }

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{ display:grid; grid-template-rows:1fr auto; min-height:calc(100svh - var(--nav-h)); }
.hero-stage{ position:relative; display:flex; align-items:flex-end; overflow:hidden; background:var(--slate); min-height:440px; }
.hero-media{ position:absolute; inset:0; }
.hero-img{ width:100%; height:100%; object-fit:cover; object-position:50% 58%; }
.hero-media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(16,18,21,.86) 0%, rgba(16,18,21,.5) 38%, rgba(16,18,21,0) 72%);
}
.hero-body{ position:relative; padding-block:clamp(32px, 7vh, 72px); color:#fff; }
.hero-kicker{ color:rgba(255,255,255,.82); margin-bottom:14px; }
.hero-title{ color:#fff; margin-left:-.03em; }
.hero-title .line{ padding-bottom:.02em; }
.hero-lede{ margin-top:18px; max-width:30ch; font-size:clamp(19px, 1.9vw, 26px); line-height:1.3; font-weight:480; font-stretch:92%; }
.hero-actions{ margin-top:28px; }

.facts{
  display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); column-gap:var(--col-gap);
  padding-block:22px 26px;
}
.fact{ padding-top:14px; border-top:2px solid var(--ink); display:grid; gap:8px; align-content:start; }
.fact dd{ display:grid; gap:4px; }
.fact-main{ font-stretch:70%; font-weight:780; text-transform:uppercase; font-size:clamp(22px, 2vw, 30px); line-height:1.02; }
.fact-sub{ font-size:14px; line-height:1.45; color:var(--mid); }
.countdown{ display:inline-block; margin-left:6px; padding:1px 6px; font-family:var(--mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--red-deep); border:1px solid currentColor; vertical-align:1px; }
@media (max-width:1023px){ .facts{ grid-template-columns:repeat(2, minmax(0, 1fr)); row-gap:20px; } }
@media (max-width:767px){
  .hero{ min-height:auto; }
  .hero-stage{ min-height:min(74svh, 620px); }
  .hero-actions .btn{ flex:1 1 100%; }
  .facts{ padding-block:18px 8px; }
  .fact-main{ font-size:22px; }
}
@media (max-width:399px){ .facts{ grid-template-columns:1fr; } }

/* ==========================================================================
   STRECKE (Signature: Marschband)
   ========================================================================== */
.section-head{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:clamp(32px, 5vh, 56px); }
.section-title{ margin-left:-.02em; }
.dist-switch{ display:grid; gap:8px; justify-items:start; }
.seg{ display:inline-flex; border:1px solid var(--ink); }
.seg button{
  min-height:48px; min-width:88px; padding:0 18px;
  font-family:var(--mono); font-size:13px; letter-spacing:.06em; text-transform:uppercase;
  transition:background-color var(--t-press) ease, color var(--t-press) ease, transform var(--t-press) var(--ease-out);
}
.seg button + button{ border-left:1px solid var(--ink); }
.seg button[aria-pressed="true"]{ background:var(--ink); color:var(--paper); }
.seg button:active{ transform:scale(.97); }
@media (hover:hover) and (pointer:fine){ .seg button[aria-pressed="false"]:hover{ background:var(--paper-2); } }

.band{ position:relative; --run:1; }
.band[data-km="25"]{ --run:.7143; }
.band-svg{ overflow:visible; }
.band-base{ stroke:var(--line-strong); stroke-width:2; vector-effect:non-scaling-stroke; }
.band-run{ stroke:var(--red); stroke-width:4; vector-effect:non-scaling-stroke; transform-box:fill-box; transition:transform 700ms var(--ease-in-out); }
.band-run--h{ transform-origin:0 50%; transform:scaleX(var(--run)); }
.band-run--v{ transform-origin:50% 0; transform:scaleY(var(--run)); }
.band-tick{ stroke:var(--mid); stroke-width:1; vector-effect:non-scaling-stroke; }
.band-tick--5{ stroke:var(--ink); }
.band-mark{ fill:var(--paper); stroke:var(--ink); stroke-width:2; vector-effect:non-scaling-stroke; transition:fill var(--t-ui) ease, stroke var(--t-ui) ease; }
.band-mark--start{ fill:var(--ink); }
.band[data-km="25"] .band-mark--z, .band[data-km="35"] .band-mark--h{ fill:var(--red); stroke:var(--red); }
.fp{ fill:var(--ink); transition:opacity 160ms linear; transition-delay:var(--delay, 0ms); }
.fp--back{ fill:var(--mid); }
.fp.is-off{ opacity:0; transition-delay:0ms; transition-duration:120ms; }
.band.is-reset .fp{ opacity:0; transition:none; }

.band-stops{ list-style:none; padding:0; position:relative; }
.band-stop{ position:absolute; display:grid; gap:2px; width:max-content; max-width:240px; transition:opacity var(--t-ui) ease; }
.band-km{ font-family:var(--mono); font-size:11px; letter-spacing:.06em; color:var(--mid); }
.band-name{ font-stretch:70%; font-weight:800; text-transform:uppercase; font-size:clamp(20px, 1.8vw, 26px); line-height:1.05; }
.band-note{ font-size:13px; line-height:1.35; color:var(--mid); }
.band[data-km="25"] .band-stop--h{ opacity:.4; }
.band[data-km="25"] .band-stop--z .band-km, .band[data-km="35"] .band-stop--h .band-km{ color:var(--red-deep); }

/* quer (ab 768 px) */
.band-view--h .band-svg{ width:100%; height:auto; }
.band-view--h .band-stops{ height:84px; margin-top:4px; }
.band-view--h .band-stop{ top:0; left:var(--at); transform:translateX(-50%); text-align:center; justify-items:center; }
.band-view--h .band-stop--start{ transform:translateX(-12px); text-align:left; justify-items:start; }
.band-view--h .band-stop--z, .band-view--h .band-stop--h{ transform:translateX(calc(-100% + 12px)); text-align:right; justify-items:end; max-width:210px; }
.band-view--v{ display:none; }

/* hochkant (Handy) */
@media (max-width:767px){
  .band-view--h{ display:none; }
  .band-view--v{ display:grid; grid-template-columns:92px 1fr; column-gap:8px; }
  .band-view--v .band-svg{ width:92px; height:auto; }
  .band-view--v .band-stops{ height:100%; }
  .band-view--v .band-stop{ left:0; top:var(--at); transform:translateY(-14px); max-width:100%; }
  .band-view--v .band-stop--h{ transform:translateY(calc(-100% + 22px)); }
  .section-head{ align-items:flex-start; }
}

.dists{ list-style:none; padding:0; margin-top:clamp(40px, 6vh, 72px); border-bottom:1px solid var(--line); }
.dist{
  display:grid; grid-template-columns:44px minmax(0, 1.1fr) minmax(0, 1.7fr) auto; column-gap:var(--col-gap); row-gap:12px;
  align-items:start; padding-block:28px; border-top:1px solid var(--line);
  transition:opacity var(--t-ui) ease;
}
.dist-n{
  width:36px; height:36px; display:grid; place-items:center;
  font-size:14px; color:var(--ink); border:1px solid var(--ink);
  transition:background-color var(--t-ui) ease, color var(--t-ui) ease, border-color var(--t-ui) ease;
}
.dist.is-active .dist-n{ background:var(--red); border-color:var(--red); color:#fff; }
.dist-km{ font-size:clamp(40px, 4.6vw, 68px); }
.dist-route{ margin-top:8px; font-weight:560; font-stretch:92%; }
.dist-text{ color:var(--ink); max-width:60ch; font-size:16px; }
.dist-text strong{ font-weight:650; }
.dist-side{ display:grid; justify-items:end; gap:12px; }
.dist-price{ display:grid; justify-items:end; gap:2px; }
.dist-price .nums{ font-stretch:70%; font-weight:800; font-size:32px; line-height:1; }
@media (max-width:1023px){
  .dist{ grid-template-columns:44px minmax(0, 1fr) auto; }
  .dist-text{ grid-column:2 / -1; }
  .dist-side{ grid-column:3; grid-row:1; }
}
@media (max-width:599px){
  .dist{ grid-template-columns:44px minmax(0, 1fr); }
  .dist-side{ grid-column:2; grid-row:auto; justify-items:start; grid-auto-flow:column; align-items:center; justify-content:start; gap:20px; }
  .dist-price{ justify-items:start; }
}

.docs{ list-style:none; padding:0; margin-top:28px; display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:var(--col-gap); }
.docs a{
  display:grid; grid-template-columns:auto 1fr auto; gap:12px; align-items:baseline;
  min-height:44px; padding:16px 0; border-top:1px solid var(--ink); text-decoration:none; font-size:15px; line-height:1.4;
}
.docs .label{ color:var(--red-deep); }
@media (hover:hover) and (pointer:fine){ .docs a:hover span:not(.label){ text-decoration:underline; text-underline-offset:3px; } }
@media (max-width:899px){ .docs{ grid-template-columns:1fr; gap:0; } }

/* ==========================================================================
   PREISE (Ticket)
   ========================================================================== */
.preise{ background:var(--paper-2); }
.preise-head{ grid-column:1 / -1; margin-bottom:clamp(32px, 5vh, 56px); }
.preise-main{ grid-column:1 / -1; display:grid; grid-template-columns:minmax(0, 1fr) minmax(260px, 380px); column-gap:clamp(24px, 4vw, 72px); align-items:start; }
.preise-main .ticket{ grid-row:1 / span 2; }
.preise-main .rules{ margin-top:0; }
@media (max-width:1023px){ .preise-main{ grid-template-columns:1fr; } .preise-main .ticket{ grid-row:auto; } .preise-main .rules{ margin-top:32px; } }
.ticket{ display:grid; grid-template-columns:minmax(0, 1fr) minmax(220px, 280px); background:var(--card); border:1px solid var(--line); }
.ticket-main{ padding:clamp(16px, 2.4vw, 32px); }
.ticket-table{ width:100%; }
.ticket-table th, .ticket-table td{ text-align:left; padding:14px 10px 14px 0; vertical-align:baseline; }
.ticket-table thead th{ padding-top:0; font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--mid); font-weight:400; border-bottom:1px solid var(--ink); }
.ticket-table td, .ticket-table thead th:not(:first-child){ text-align:right; white-space:nowrap; }
.ticket-table tbody tr + tr th, .ticket-table tbody tr + tr td{ border-top:1px solid var(--line); }
.ticket-table tbody th{ font-weight:500; font-size:16px; }
.ticket-table tbody td{ font-stretch:70%; font-weight:780; font-size:clamp(24px, 2.4vw, 34px); line-height:1; white-space:nowrap; }
.ticket-table tbody tr{ color:var(--mid); }
.ticket-table tbody tr.is-current{ color:var(--ink); }
.now-tag{ display:none; margin-right:10px; padding:2px 6px; background:var(--red); color:#fff; font-family:var(--mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; vertical-align:2px; }
.is-current .now-tag{ display:inline-block; }
.ticket-table tr.late th{ font-size:14px; color:var(--mid); font-weight:400; }
.ticket-table tr.late td{ font-size:20px; color:var(--ink); }
.ticket-next{ margin-top:14px; }
.ticket-stub{
  position:relative; background:var(--slate); color:var(--on-dark);
  padding:clamp(20px, 2.4vw, 32px); display:grid; align-content:space-between; gap:24px;
  border-left:1px dashed rgba(243,241,236,.35);
}
.ticket-stub .label{ color:var(--on-dark-mid); }
.stub-date{ display:grid; gap:6px; }
.stub-date .nums{ font-stretch:62%; font-weight:860; font-size:clamp(40px, 4vw, 56px); line-height:.9; }
.ticket-stub .btn{ width:100%; }
.ticket-label{ margin-bottom:16px; }
@media (max-width:767px){
  .ticket{ grid-template-columns:1fr; }
  .ticket-stub{ border-left:0; border-top:1px dashed rgba(243,241,236,.35); }
  .ticket-table tbody th{ font-size:14px; }
  .now-tag{ display:none !important; }
  .ticket-table tbody tr.is-current th::before{ content:""; display:inline-block; width:8px; height:8px; background:var(--red); margin-right:8px; vertical-align:1px; }
}

/* Wegzeichen: kleines rotes Quadrat als Aufzählung */
.rules, .checks{ list-style:none; padding:0; }
.rules{ margin-top:32px; display:grid; gap:10px; max-width:64ch; }
.rules li, .checks li{ position:relative; padding-left:22px; }
.rules li::before, .checks li::before{ content:""; position:absolute; left:0; top:.62em; width:8px; height:8px; background:var(--red); }
.donate{ margin-top:32px; padding-top:20px; border-top:1px solid var(--line-strong); display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:16px 32px; }
.donate p{ font-size:clamp(18px, 1.5vw, 21px); font-weight:520; font-stretch:92%; max-width:36ch; }

/* ==========================================================================
   ABLAUF
   ========================================================================== */
.ablauf-copy{ grid-column:1 / span 6; }
.ablauf-copy .statement{ margin-top:16px; }
.timeline{ grid-column:8 / -1; list-style:none; padding:0; align-self:end; border-top:2px solid var(--ink); }
.timeline li{ display:grid; grid-template-columns:minmax(120px, 38%) 1fr; gap:16px; padding-block:14px; border-bottom:1px solid var(--line); }
.tl-time{ font-family:var(--mono); font-size:13px; letter-spacing:.02em; padding-top:2px; }
.tl-what{ font-size:16px; line-height:1.45; }
.timeline li.is-key .tl-time{ color:var(--red-deep); }
.timeline li.is-key .tl-what{ font-weight:650; }
@media (max-width:1023px){ .ablauf-copy, .timeline{ grid-column:1 / -1; } .timeline{ margin-top:40px; } }

/* ==========================================================================
   GUT ZU WISSEN
   ========================================================================== */
.info{ border-top:1px solid var(--line); }
.info-side{ grid-column:1 / span 4; }
.info-main{ grid-column:6 / -1; }
.info-toc ol{ list-style:none; padding:0; margin-top:32px; border-top:1px solid var(--line); }
.info-toc a{ display:flex; gap:14px; align-items:baseline; min-height:44px; padding-block:10px; border-bottom:1px solid var(--line); text-decoration:none; font-weight:520; }
.info-toc .label{ color:var(--red-deep); }
@media (hover:hover) and (pointer:fine){ .info-toc a:hover{ color:var(--red-deep); } }
@media (min-width:1024px){ .info-side > *{ position:sticky; } .info-side{ align-self:start; position:sticky; top:calc(var(--nav-h) + 32px); } }
.info-block{ display:grid; grid-template-columns:48px 1fr; column-gap:16px; padding-block:28px 32px; border-top:1px solid var(--line); scroll-margin-top:calc(var(--nav-h) + 16px); }
.info-block:first-child{ border-top:0; padding-top:0; }
.info-block .h3{ grid-column:2; margin-bottom:12px; }
.info-block .prose{ grid-column:2; }
.info-n{ grid-row:1; padding-top:6px; color:var(--red-deep); }
.steps{ padding-left:1.4em; display:grid; gap:6px; }
.steps li::marker{ font-family:var(--mono); font-size:.8em; }
.checks{ display:grid; gap:6px; margin-top:12px; }
.info-contact{ margin-top:24px; padding:28px 0 0 64px; border-top:2px solid var(--ink); display:grid; gap:18px; }
@media (max-width:1023px){
  .info-side, .info-main{ grid-column:1 / -1; }
  .info-toc{ display:none; }
  .info-main{ margin-top:32px; }
}
@media (max-width:599px){ .info-block{ grid-template-columns:1fr; } .info-block .h3, .info-block .prose{ grid-column:1; } .info-n{ padding:0 0 6px; } .info-contact{ padding-left:0; } }

/* ==========================================================================
   RÜCKBLICK + FOTOSTREIFEN
   ========================================================================== */
.rueckblick{ background:var(--slate); color:var(--on-dark); }
.rueckblick .text-link{ color:var(--on-dark); }
.rb-title{ grid-column:1 / span 7; color:var(--on-dark); font-size:clamp(28px, 3.4vw, 50px); line-height:1.1; }
.rb-side{ grid-column:9 / -1; align-self:end; display:grid; gap:18px; justify-items:start; color:var(--on-dark-mid); }
.rueckblick .btn--line{ color:var(--on-dark); border-color:var(--on-dark); }
@media (hover:hover) and (pointer:fine){ .rueckblick .btn--line:hover{ background:var(--on-dark); color:var(--slate); } }
@media (max-width:1023px){ .rb-title, .rb-side{ grid-column:1 / -1; } .rb-side{ margin-top:28px; } }
/* Fotos 2025: bündiges Raster über die volle Inhaltsbreite, nichts läuft aus dem Raster */
.rb-fotos{
  display:grid; gap:clamp(8px, 1vw, 14px); margin-top:clamp(48px, 7vh, 80px);
  grid-template-columns:repeat(12, minmax(0, 1fr)); grid-auto-rows:clamp(150px, 16.5vw, 250px);
}
.rb-foto{ position:relative; overflow:hidden; background:#353b43; min-width:0; }
.rb-foto img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.rb-foto--a{ grid-column:1 / 7; grid-row:span 2; }
.rb-foto--b{ grid-column:7 / 13; }
.rb-foto--b img{ object-position:50% 62%; }
.rb-foto--c{ grid-column:7 / 10; }
.rb-foto--d{ grid-column:10 / 13; }
.rb-foto--e, .rb-foto--f, .rb-foto--g{ grid-column:span 4; grid-row:span 2; }
.rb-foto--c img{ object-position:50% 55%; }
@media (max-width:767px){
  .rb-fotos{ grid-template-columns:1fr 1fr; grid-auto-rows:auto; }
  .rb-foto{ grid-column:span 1; grid-row:auto; aspect-ratio:3 / 4; }
  .rb-foto--a, .rb-foto--e{ grid-column:1 / -1; aspect-ratio:4 / 5; }
  .rb-foto--b{ grid-column:1 / -1; aspect-ratio:4 / 3; }
}

/* ==========================================================================
   EINBETTUNGEN (Einwilligung zuerst)
   ========================================================================== */
.embed{ position:relative; }
.embed-slot:empty{ display:none; }
.embed.is-loaded .consent-ph{ display:none; }
.consent-ph{
  position:relative; isolation:isolate; display:grid; gap:10px; align-content:center; justify-items:start;
  min-height:300px; padding:clamp(24px, 4vw, 56px); background:var(--card); border:1px solid var(--line);
}
.consent-ph p:not(.label){ max-width:56ch; font-size:15px; color:var(--mid); }
.consent-ph .btn-row{ margin-top:10px; }
.consent-ph .text-link{ display:inline-flex; align-items:center; min-height:44px; font-size:15px; }
.consent-ph .coords{ color:var(--ink); }
.consent-ph-bg{ position:absolute; inset:0; z-index:-1; overflow:hidden; }
.consent-ph-bg img{ width:100%; height:100%; object-fit:cover; }
.consent-ph-bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(22,24,27,.92) 0%, rgba(22,24,27,.78) 50%, rgba(22,24,27,.45) 100%); }
@media (max-width:767px){ .consent-ph-bg::after{ background:rgba(22,24,27,.86); } }
.embed--video .consent-ph{ aspect-ratio:16 / 9; min-height:340px; border:0; color:var(--on-dark); background:var(--slate); }
.embed--video .consent-ph .label, .embed--video .consent-ph p:not(.label){ color:var(--on-dark-mid); }
.embed--video .consent-ph .btn--line{ color:var(--on-dark); border-color:var(--on-dark); }
@media (hover:hover) and (pointer:fine){ .embed--video .consent-ph .btn--line:hover{ background:var(--on-dark); color:var(--ink); } }
.embed--video .embed-slot iframe{ width:100%; aspect-ratio:16 / 9; border:0; }
.embed--map .consent-ph{ min-height:380px; border-inline:0; }
.embed--map .embed-slot iframe{ width:100%; height:min(60vh, 520px); border:0; }
.embed--rr .embed-slot{ min-height:200px; background:#fff; padding:clamp(8px, 2vw, 24px); border:1px solid var(--line); }
.rr-direct{ margin-top:14px; font-size:15px; }
.map-section{ border-top:1px solid var(--line); }
.movie .section-title{ margin-bottom:clamp(28px, 4vh, 48px); }

/* ---------- Sponsoren ---------- */
.sponsors{ padding-block:clamp(56px, 8vh, 96px); border-top:1px solid var(--line); }
.sponsors-wrap{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px 48px; }
.logo-row{ list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:24px; align-items:center; }
.logo{ display:grid; place-items:center; width:148px; height:148px; }
.logo img{ max-width:100%; max-height:100%; width:auto; height:auto; }
.logo--dark img{ width:148px; }
.logo--light{ background:#fff; border:1px solid var(--line); padding:14px; }
.logo--light img{ filter:grayscale(1); transition:filter 240ms ease; }
@media (hover:hover) and (pointer:fine){ .logo--light:hover img{ filter:none; } }
/* Partner ohne Sponsoring (Sanitätsdienst): Rolle als Label oben in der Kachel */
.logo--rolle{ position:relative; }
.logo-rolle{ position:absolute; top:10px; left:0; right:0; text-align:center; }
.logo--rolle img{ margin-top:14px; }

/* ==========================================================================
   UNTERSEITEN
   ========================================================================== */
.page-head{ padding-block:clamp(56px, 10vh, 120px) clamp(32px, 5vh, 56px); border-bottom:1px solid var(--line); }
.page-kicker{ margin-bottom:14px; }
.page-title{ font-size:clamp(52px, 9vw, 140px); line-height:.86; margin-left:-.03em; }
.page-lede{ margin-top:24px; font-size:clamp(17px, 1.4vw, 20px); }
.page-actions{ margin-top:28px; }
.anm-prices{ list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:8px 28px; }
.anm-prices .nums{ font-stretch:70%; font-weight:800; text-transform:uppercase; font-size:clamp(26px, 2.6vw, 36px); }
.anm-prices + p{ margin-top:10px; }
.widget-title{ margin-bottom:24px; }
.anchor-target{ scroll-margin-top:var(--nav-h); }

/* Mehr Events */
.events{ list-style:none; padding:0; border-bottom:1px solid var(--line); }
.event{ display:grid; grid-template-columns:44px 180px minmax(0, 1fr); column-gap:clamp(20px, 3vw, 48px); align-items:start; padding-block:36px; border-top:1px solid var(--line); }
.event:first-child{ border-top:0; }
.event-n{ padding-top:6px; color:var(--red-deep); }
.event-logo{ width:180px; aspect-ratio:1; display:grid; place-items:center; padding:18px; }
.event-logo--dark{ background:#000; }
.event-logo img{ max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; }
.event-copy{ display:grid; gap:16px; justify-items:start; }
.event-copy .prose{ font-size:16px; }
@media (max-width:767px){
  .event{ grid-template-columns:1fr; row-gap:16px; }
  .event-n{ padding:0; }
  .event-logo{ width:132px; }
}

/* Feedback */
.form-wrap{ grid-column:1 / span 7; }
.form-aside{ grid-column:9 / -1; display:grid; gap:8px; align-content:start; font-size:15px; }
.form-note{ margin-top:16px; color:var(--mid); }
@media (max-width:1023px){ .form-wrap, .form-aside{ grid-column:1 / -1; } .form-aside{ margin-top:40px; } }
.form{ display:grid; gap:22px; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
@media (max-width:599px){ .form-row{ grid-template-columns:1fr; } }
.field{ display:grid; gap:8px; border:0; padding:0; min-width:0; }
.field input, .field textarea{
  width:100%; min-height:52px; padding:12px 14px; font:inherit; font-size:16px; color:var(--ink);
  background:var(--card); border:1px solid var(--line-strong); border-radius:0;
  transition:border-color var(--t-press) ease, box-shadow var(--t-press) ease;
}
.field textarea{ resize:vertical; min-height:140px; }
.field input:focus, .field textarea:focus{ outline:none; border-color:var(--ink); box-shadow:0 0 0 1px var(--ink); }
.field input:focus-visible, .field textarea:focus-visible{ outline:2px solid var(--red); outline-offset:2px; }
.field.has-error input{ border-color:var(--red-deep); }
.field-error{ font-size:14px; color:var(--red-deep); }
.field-error .label{ color:var(--red-deep); margin-right:6px; }
.rating-row{ display:flex; align-items:center; gap:16px; }
.rating{ display:inline-flex; flex-direction:row-reverse; }
.rating input{ position:absolute; opacity:0; width:1px; height:1px; }
.rating label{ display:grid; place-items:center; width:44px; height:44px; font-size:26px; color:var(--line-strong); cursor:pointer; transition:color var(--t-press) ease, transform var(--t-press) var(--ease-out); }
.rating label:active{ transform:scale(.92); }
.rating input:checked ~ label{ color:var(--red); }
@media (hover:hover) and (pointer:fine){ .rating label:hover, .rating label:hover ~ label{ color:var(--red-deep); } }
.rating input:focus-visible + label{ outline:2px solid var(--red); outline-offset:-2px; }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.form-done{ padding:32px; background:var(--card); border:1px solid var(--line); }
.form-done:focus{ outline:none; }
.form .btn[disabled]{ opacity:.6; cursor:progress; }

/* Rechtstexte */
.legal{ max-width:72ch; font-size:16px; }
.legal h2{ font-stretch:70%; font-weight:800; text-transform:uppercase; font-size:clamp(26px, 2.4vw, 34px); line-height:1.05; margin:0 0 20px; }
.legal h3{ font-weight:650; font-size:20px; line-height:1.3; margin:40px 0 12px; scroll-margin-top:calc(var(--nav-h) + 16px); }
.legal h4{ font-weight:650; font-size:17px; margin:24px 0 8px; }
.legal p + p{ margin-top:12px; }
.legal ul, .legal ol{ padding-left:1.2em; margin:12px 0; display:grid; gap:6px; }
.legal a{ text-underline-offset:3px; overflow-wrap:anywhere; }
.sec-num{ font-family:var(--mono); font-size:.72em; letter-spacing:.04em; color:var(--red-deep); margin-right:6px; }
.imprint{ display:grid; gap:24px; }
.imprint strong{ display:block; font-family:var(--mono); font-weight:400; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--mid); margin-bottom:6px; }
.legal-grid .toc{ grid-column:1 / span 4; }
.legal-grid .legal{ grid-column:6 / -1; }
.toc{ align-self:start; }
@media (min-width:1024px){ .toc{ position:sticky; top:calc(var(--nav-h) + 24px); max-height:calc(100vh - var(--nav-h) - 48px); overflow:auto; } }
.toc summary{ min-height:44px; display:flex; align-items:center; cursor:pointer; }
.toc ol{ list-style:none; padding:0; display:grid; border-top:1px solid var(--line); }
.toc a{ display:block; padding:8px 0; font-size:14px; line-height:1.35; text-decoration:none; color:var(--mid); border-bottom:1px solid var(--line); }
.toc a.is-active{ color:var(--ink); }
.toc a.is-active .sec-num{ color:var(--red); }
@media (max-width:1023px){ .legal-grid .toc, .legal-grid .legal{ grid-column:1 / -1; } .toc{ margin-bottom:32px; } }

/* 404 */
.notfound{ padding-block:clamp(80px, 16vh, 200px); }
.notfound h1{ margin:14px 0 20px -.03em; }
.notfound .btn-row{ margin-top:32px; }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{ background:var(--slate); color:var(--on-dark); padding-top:clamp(64px, 9vh, 112px); padding-bottom:24px; }
.site-footer .label{ color:var(--on-dark-mid); margin-bottom:10px; }
.footer-grid{ display:grid; grid-template-columns:2fr 1fr 1fr; gap:40px var(--col-gap); }
.footer-addr{ font-stretch:66%; font-weight:820; text-transform:uppercase; font-size:clamp(28px, 3vw, 44px); line-height:1; }
.footer-mail{ font-size:17px; text-decoration:underline; text-underline-offset:4px; text-decoration-color:rgba(243,241,236,.35); }
@media (hover:hover) and (pointer:fine){ .footer-mail:hover{ text-decoration-color:var(--red); } }
.footer-social{ list-style:none; padding:0; display:grid; }
.footer-social a{ display:inline-flex; align-items:center; min-height:40px; text-decoration:none; }
@media (hover:hover) and (pointer:fine){ .footer-social a:hover{ color:#fff; text-decoration:underline; text-underline-offset:4px; } }
@media (max-width:767px){ .footer-grid{ grid-template-columns:1fr 1fr; } .footer-main{ grid-column:1 / -1; } }
.footer-bottom{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 32px;
  margin-top:clamp(56px, 8vh, 88px); padding-top:12px; border-top:1px solid var(--line-dark);
  color:var(--on-dark-mid);
}
.footer-legal{ display:flex; flex-wrap:wrap; gap:0 24px; list-style:none; padding:0; font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; }
.footer-legal a, .footer-legal button{
  display:inline-flex; align-items:center; min-height:44px;
  font:inherit; letter-spacing:inherit; text-transform:inherit; color:var(--on-dark-mid); text-decoration:none;
  transition:color var(--t-press) ease;
}
@media (hover:hover) and (pointer:fine){ .footer-legal a:hover, .footer-legal button:hover{ color:var(--on-dark); } }

/* ---------- Credit Odin Bayer (dezent, nimmt die Textfarbe des Footers an) ---------- */
.st-credit { margin: 0; font-size: 14px; letter-spacing: 0.01em; }
.st-credit a { display: inline-flex; align-items: center; gap: 6px; min-height: 24px; color: inherit; text-decoration: none; opacity: 0.6; transition: opacity 200ms ease; }
@media (hover: hover) and (pointer: fine) { .st-credit a:hover { opacity: 1; text-decoration: none; } }
.st-credit a:focus-visible { opacity: 1; }

/* ==========================================================================
   COOKIE-BANNER + PRIVATSPHÄRE-DIALOG (beide Knöpfe gleich gewichtet)
   ========================================================================== */
.cc-banner{
  position:fixed; z-index:300;
  left:max(12px, env(safe-area-inset-left, 0px)); bottom:max(12px, env(safe-area-inset-bottom, 0px));
  width:min(420px, calc(100vw - 24px));
  background:var(--card); color:var(--ink); border:1px solid var(--line-strong);
  box-shadow:0 12px 40px rgba(22,24,27,.14);
  padding:20px;
  transition:transform var(--t-ui) var(--ease-out), opacity var(--t-ui) var(--ease-out);
}
.cc-banner.is-entering{ transform:translateY(16px); opacity:0; }
.cc-banner.is-leaving{ transform:translateY(16px); opacity:0; transition-duration:180ms; }
.cc-banner:focus{ outline:none; }
.cc-banner h2{ color:var(--ink); margin-bottom:8px; }
.cc-banner p{ font-size:14px; line-height:1.5; color:var(--mid); }
.cc-actions{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:16px; }
.cc-actions .btn{ min-height:44px; padding:10px 12px; white-space:normal; line-height:1.3; }
.cc-link{ grid-column:1 / -1; justify-self:start; min-height:44px; padding:0 2px; font-size:14px; text-decoration:underline; text-underline-offset:3px; text-decoration-color:var(--line-strong); }

.cc-dialog{
  margin:auto; width:min(600px, calc(100vw - 24px)); max-height:min(88dvh, 820px);
  padding:0; border:1px solid var(--line-strong); background:var(--card); color:var(--ink); overflow:auto;
}
.cc-dialog::backdrop{ background:rgba(22,24,27,.55); }
.cc-dialog[open]{ animation:dlg-in var(--t-ui) var(--ease-out); }
@keyframes dlg-in{ from{ opacity:0; transform:translateY(8px) scale(.98); } }
.cc-head{ display:flex; justify-content:space-between; align-items:center; gap:16px; padding:12px 12px 8px 24px; }
.cc-body{ padding:0 24px; }
.cc-body > p{ font-size:15px; color:var(--mid); }
.cc-cats{ list-style:none; padding:0; margin:20px 0 8px; display:grid; }
.cc-cat{ padding:16px 0; border-top:1px solid var(--line); }
.cc-cat-head{ display:flex; justify-content:space-between; align-items:center; gap:16px; }
.cc-cat-head label, .cc-cat-name{ font-weight:650; font-size:17px; line-height:1.3; }
.cc-cat p{ margin-top:6px; font-size:14px; color:var(--mid); }
.switch{ position:relative; flex:none; width:48px; height:26px; }
.switch input{ position:absolute; inset:-9px -2px; width:calc(100% + 4px); height:calc(100% + 18px); margin:0; opacity:0; cursor:pointer; z-index:1; }
.switch span{ position:absolute; inset:0; border:1px solid var(--line-strong); background:var(--paper); transition:background-color var(--t-press) ease, border-color var(--t-press) ease; }
.switch span::after{ content:""; position:absolute; top:4px; left:4px; width:16px; height:16px; background:var(--mid); transition:transform var(--t-press) var(--ease-out), background-color var(--t-press) ease; }
.switch input:checked + span{ background:var(--ink); border-color:var(--ink); }
.switch input:checked + span::after{ transform:translateX(22px); background:var(--paper); }
.switch input:focus-visible + span{ outline:2px solid var(--red); outline-offset:3px; }
.cc-foot{ display:flex; flex-wrap:wrap; gap:8px; padding:16px 24px 24px; position:sticky; bottom:0; background:var(--card); border-top:1px solid var(--line); }
.cc-foot .btn{ flex:1 1 auto; min-height:44px; padding:0 14px; }

/* ==========================================================================
   Reduced Motion: Bewegung und Blur raus, Fades bleiben
   ========================================================================== */
@media (prefers-reduced-motion: reduce){
  .js [data-reveal]{ transform:none; filter:none; transition:opacity 200ms ease; transition-delay:0ms; }
  .js [data-rise], .js .hero-title .line{ animation:fade-in 200ms ease both; animation-delay:0ms; }
  .mobile-menu li, .menu-open .mobile-menu li{ transform:none; transition:opacity 200ms ease; transition-delay:0ms; }
  .action-bar, .action-bar.is-shown{ transition:opacity 200ms ease; }
  .band-run{ transition:none; }
  .fp{ transition:opacity 200ms ease; transition-delay:0ms !important; }
  .btn:active, .seg button:active, .rating label:active{ transform:none; }
  .cc-banner{ transition:opacity 200ms ease; } .cc-banner.is-entering, .cc-banner.is-leaving{ transform:none; }
  .cc-dialog[open]{ animation:fade-in 200ms ease; }
  ::view-transition-new(root){ animation:fade-in 200ms ease both; }
  ::view-transition-old(root){ animation:none; }
}
@media (max-width:767px) and (prefers-reduced-motion: reduce){
  .action-bar{ transform:none; opacity:0; pointer-events:none; }
  .action-bar.is-shown{ opacity:1; pointer-events:auto; }
  .menu-open .action-bar, .cc-open .action-bar{ transform:none; opacity:0; }
}
@media (prefers-reduced-transparency: reduce){
  .site-nav, .btn--glass{ -webkit-backdrop-filter:none; backdrop-filter:none; }
  .site-nav{ background:var(--paper); }
}