/* ═══ Schriften — liegen auf dem eigenen Server ═══════════════════
   Nicht von Google Fonts geladen: Das schickt die IP-Adresse jedes
   Besuchers an Google (LG München I, 20.01.2022, 3 O 17493/20 — danach
   Abmahnwelle in DE/AT). Lizenz aller drei: SIL Open Font License,
   Weitergabe und Einbettung erlaubt. Nur Latein + Latein-Erweitert. */
@font-face{font-family:'Archivo';font-style:normal;font-weight:400;font-display:swap;src:url(schriften/archivo-latin-ext-c628a829.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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;}
@font-face{font-family:'Archivo';font-style:normal;font-weight:400;font-display:swap;src:url(schriften/archivo-latin-0186fb75.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:'Archivo';font-style:normal;font-weight:500;font-display:swap;src:url(schriften/archivo-latin-ext-c628a829.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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;}
@font-face{font-family:'Archivo';font-style:normal;font-weight:500;font-display:swap;src:url(schriften/archivo-latin-0186fb75.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:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url(schriften/archivo-latin-ext-c628a829.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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;}
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url(schriften/archivo-latin-0186fb75.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:'Archivo';font-style:normal;font-weight:700;font-display:swap;src:url(schriften/archivo-latin-ext-c628a829.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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;}
@font-face{font-family:'Archivo';font-style:normal;font-weight:700;font-display:swap;src:url(schriften/archivo-latin-0186fb75.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:'Archivo';font-style:normal;font-weight:800;font-display:swap;src:url(schriften/archivo-latin-ext-c628a829.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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;}
@font-face{font-family:'Archivo';font-style:normal;font-weight:800;font-display:swap;src:url(schriften/archivo-latin-0186fb75.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:'Barlow Condensed';font-style:normal;font-weight:500;font-display:swap;src:url(schriften/barlow-condensed-latin-ext-5e89dd85.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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;}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:500;font-display:swap;src:url(schriften/barlow-condensed-latin-10c69b92.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:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(schriften/barlow-condensed-latin-ext-678e7347.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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;}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(schriften/barlow-condensed-latin-28c6fc47.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:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(schriften/barlow-condensed-latin-ext-03b2b528.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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;}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(schriften/barlow-condensed-latin-b3f56918.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:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(schriften/ibm-plex-mono-latin-ext-7963a16e.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(schriften/ibm-plex-mono-latin-bc87d8e0.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:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(schriften/ibm-plex-mono-latin-ext-25040cb4.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(schriften/ibm-plex-mono-latin-a80b2cab.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;}

/* ═══ Montagemeldung — gemeinsame Gestaltung ═══════════════════ */

:root{
  color-scheme: light;

  --board:      #0C1418;
  --board-2:    #14212A;
  --board-3:    #1B2C36;
  --board-line: #263C48;

  --brand:      #0B5B6B;
  --brand-lift: #0E7488;
  --brand-pale: #DDEAED;

  --paper:      #E4EAEC;
  --card:       #FFFFFF;
  --ink:        #0C1418;
  --ink-2:      #33454E;
  --muted:      #61757E;
  --rule:       #C6D2D6;

  --ok:   #1B8E4C;
  --ok-bg:#E3F3E9;
  --wait: #B37800;
  --miss: #C9361F;

  --f-display: 'Archivo', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --f-sign:    'Barlow Condensed', 'Archivo Narrow', -apple-system, sans-serif;
  --f-mono:    'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  --pad: clamp(20px, 5vw, 64px);
  --maxw: 1180px;
}

*{box-sizing:border-box}
/* hidden muss immer gewinnen — sonst überstimmt z. B. .local{display:flex}
   das Attribut und ein verstecktes Element erscheint doch. */
[hidden]{display:none !important}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--f-display); font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--brand-lift); outline-offset:3px; border-radius:2px}

.wrap{max-width:var(--maxw); margin:0 auto; padding-left:var(--pad); padding-right:var(--pad)}
.sign{font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.14em; font-weight:600; line-height:1}
.mono{font-family:var(--f-mono); font-variant-numeric:tabular-nums}

/* ─── Kopfzeile ──────────────────────────────────────────────── */
.top{position:sticky; top:0; z-index:60; background:var(--board); border-bottom:1px solid var(--board-line)}
.top-in{max-width:var(--maxw); margin:0 auto; padding:0 var(--pad); min-height:62px; display:flex; align-items:center; gap:24px}
.logo{display:flex; align-items:center; gap:10px; color:#fff; text-decoration:none}
.logo-mark{width:22px; height:22px; flex:none; border-radius:3px; background:var(--brand-lift); position:relative}
.logo-mark::after{
  content:""; position:absolute; inset:5px 5px auto 5px; height:2px;
  background:#fff; box-shadow:0 5px 0 #fff, 0 10px 0 rgba(255,255,255,.45);
}
.logo-text{font-size:19px; font-weight:700; letter-spacing:-.02em}
.top-nav{margin-left:auto; display:flex; align-items:center; gap:24px}
.top-nav a{
  color:#9FB3BC; text-decoration:none; font-size:13px;
  font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.12em; font-weight:600;
}
.top-nav a:hover{color:#fff}

/* Sprachwahl */
.lang{position:relative; display:flex; align-items:center}
.lang select{
  appearance:none; -webkit-appearance:none;
  background:var(--board-3); color:#D6E2E7; border:1px solid var(--board-line);
  border-radius:3px; cursor:pointer;
  font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.13em; font-weight:600;
  font-size:13px; padding:8px 26px 8px 11px; line-height:1;
}
.lang select:hover{border-color:#3A5665; color:#fff}
.lang::after{
  content:""; position:absolute; right:10px; top:50%; margin-top:-2px; pointer-events:none;
  border:4px solid transparent; border-top-color:#7D959F;
}
.lang option{background:#fff; color:#0C1418; font-family:var(--f-display); text-transform:none; letter-spacing:0}

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:var(--brand-lift); color:#fff; text-decoration:none;
  border:0; border-radius:3px; cursor:pointer;
  font-family:var(--f-display); font-weight:600; font-size:15px; white-space:nowrap;
  padding:12px 20px; transition:background .15s, transform .15s;
}
.btn:hover{background:#1290A9; transform:translateY(-1px)}
.btn-sm{padding:9px 16px; font-size:14px}
.btn-ghost{background:transparent; border:1px solid var(--board-line); color:#D6E2E7}
.btn-ghost:hover{background:var(--board-3); border-color:#3A5665}
.btn-dark{background:var(--board)}
.btn-dark:hover{background:var(--board-2)}

@media(max-width:1000px){ .top-nav a{display:none} }
@media(max-width:720px){
  .top-in{gap:10px; min-height:58px; padding-left:16px; padding-right:16px}
  .logo-text{font-size:17px}
  .btn-sm{padding:8px 12px; font-size:13.5px}
  .lang select{padding:7px 22px 7px 9px; font-size:12px; letter-spacing:.1em}
}
@media(max-width:400px){
  .top-in{gap:8px; padding-left:12px; padding-right:12px}
  .logo{gap:7px}
  .logo-text{font-size:15px}
  .logo-mark{width:19px; height:19px}
  .btn-sm{padding:8px 10px; font-size:12.5px}
  .lang select{padding:7px 20px 7px 8px}
  .lang::after{right:8px}
}
/* Sehr schmale Geräte (320 px und darunter): Der Schriftzug weicht, das
   Zeichen bleibt. Sonst schiebt es „Platz sichern" aus dem Bild. */
@media(max-width:350px){
  .logo-text{display:none}
}

/* ─── Hero ───────────────────────────────────────────────────── */
.hero{background:var(--board); color:#fff; position:relative; overflow:hidden; padding:clamp(48px,7vw,86px) 0 clamp(56px,7vw,92px)}
.hero::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(var(--board-line) 1px, transparent 1px);
  background-size:100% 46px; opacity:.4;
  mask-image:linear-gradient(180deg, #000 0%, transparent 62%);
  -webkit-mask-image:linear-gradient(180deg, #000 0%, transparent 62%);
}
.hero-in{position:relative; z-index:1}
.eyebrow{
  font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.2em;
  font-weight:600; font-size:14px; color:#6FB3C2;
  display:flex; align-items:center; gap:12px; margin:0 0 22px;
}
.eyebrow::before{content:""; width:34px; height:2px; background:var(--brand-lift); flex:none}
h1{
  font-size:clamp(40px,6.6vw,78px); line-height:.98; letter-spacing:-.035em;
  word-spacing:.07em; font-weight:800; margin:0 0 22px; max-width:15ch;
}
h1 .thin{font-weight:400; color:#8FA9B3; display:block}
.hero-sub{font-size:clamp(17px,2vw,20px); line-height:1.55; color:#C2D3DA; max-width:60ch; margin:0 0 30px}
.hero-sub b{color:#fff; font-weight:600}
.hero-cta{display:flex; flex-wrap:wrap; gap:12px; align-items:center}
.hero-note{margin:16px 0 0; font-size:14px; color:#7D959F; display:flex; flex-wrap:wrap; gap:8px 18px; align-items:center}
.hero-note .dot{width:5px; height:5px; border-radius:50%; background:#40616E; display:inline-block}

/* ─── Abfahrtstafel ──────────────────────────────────────────── */
.board{
  margin-top:clamp(40px,5vw,58px); background:var(--board-2); border:1px solid var(--board-line);
  border-radius:6px; overflow:hidden; box-shadow:0 30px 70px -30px rgba(0,0,0,.9);
}
.board-head{display:flex; align-items:center; gap:16px; flex-wrap:wrap; padding:14px 20px; background:var(--board-3); border-bottom:1px solid var(--board-line)}
.board-title{font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.18em; font-weight:700; font-size:15px; color:#fff}
.board-kw{font-family:var(--f-mono); font-size:12px; color:#7D959F; letter-spacing:.04em}
.board-status{margin-left:auto; display:flex; align-items:center; gap:9px; font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.14em; font-weight:600; font-size:13px; color:#F0C46A}
.board-status.clear{color:#5FD196}
.board-status .lamp{width:9px; height:9px; border-radius:50%; background:currentColor; box-shadow:0 0 12px currentColor}
.board-scroll{overflow-x:auto}
table.board-tbl{width:100%; border-collapse:collapse; min-width:740px}
.board-tbl th{
  text-align:left; padding:11px 20px; background:var(--board-2);
  font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.14em;
  font-weight:600; font-size:12px; color:#6D8792; border-bottom:1px solid var(--board-line);
}
.board-tbl td{padding:14px 20px; border-bottom:1px solid rgba(38,60,72,.6); vertical-align:middle}
.board-tbl tr:last-child td{border-bottom:0}
.b-name{font-weight:600; font-size:16px; color:#fff; white-space:nowrap}
.b-dest{display:flex; align-items:center; gap:10px; white-space:nowrap}
.cc{font-family:var(--f-sign); font-weight:700; font-size:13px; letter-spacing:.08em; background:var(--board-3); color:#8FCBD9; border:1px solid var(--board-line); padding:3px 7px; border-radius:2px}
.b-city{color:#C2D3DA; font-size:15px}
.b-time{font-family:var(--f-mono); font-size:14px; color:#9FB3BC; white-space:nowrap}
.chip{display:inline-flex; align-items:center; gap:7px; white-space:nowrap; font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.1em; font-weight:600; font-size:12px; padding:5px 9px; border-radius:2px; border:1px solid}
.chip .lamp{width:7px; height:7px; border-radius:50%; background:currentColor; flex:none}
.chip.ok{color:#5FD196; border-color:rgba(95,209,150,.35); background:rgba(95,209,150,.1)}
.chip.wait{color:#F0C46A; border-color:rgba(240,196,106,.35); background:rgba(240,196,106,.1)}
.chip.miss{color:#FF8A73; border-color:rgba(255,138,115,.4); background:rgba(255,138,115,.12)}
.chip.miss .lamp{animation:pulse 1.15s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}
.b-ref{font-family:var(--f-mono); font-size:11.5px; color:#5E7883; display:block; margin-top:5px; letter-spacing:.02em}
.board-foot{padding:11px 20px; background:var(--board-3); border-top:1px solid var(--board-line); font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.13em; font-size:12px; color:#6D8792; display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap}
.board-tbl tbody tr{opacity:0; transform:translateY(7px)}
.board-tbl tbody tr.in{opacity:1; transform:none; transition:opacity .45s ease, transform .45s ease}

/* ─── Abschnitte ─────────────────────────────────────────────── */
.sec{padding:clamp(56px,7vw,96px) 0}
.sec-alt{background:#DDE5E8}
.sec-head{max-width:52ch; margin:0 0 clamp(32px,4vw,52px)}
.sec-label{font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.2em; font-weight:600; font-size:13px; color:var(--brand); display:flex; align-items:center; gap:11px; margin:0 0 18px}
.sec-label::before{content:""; width:26px; height:2px; background:var(--brand); flex:none}
h2{font-size:clamp(28px,4vw,46px); line-height:1.06; letter-spacing:-.03em; word-spacing:.05em; font-weight:700; margin:0 0 16px}
.sec-head p{font-size:18px; color:var(--ink-2); margin:0; line-height:1.6}

/* ─── Strafrahmen ────────────────────────────────────────────── */
.pen{background:var(--card); border:1px solid var(--rule); border-radius:5px; overflow:hidden}
.pen-h{display:flex; align-items:center; gap:14px; flex-wrap:wrap; padding:13px 22px; border-bottom:1px solid var(--rule); background:#F2F5F6}
.pen-h .t{font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.17em; font-weight:700; font-size:13.5px}
.pen-h .n{margin-left:auto; font-family:var(--f-mono); font-size:12px; color:var(--muted)}
.pen-scroll{overflow-x:auto}
table.pen-tbl{width:100%; border-collapse:collapse; min-width:700px}
.pen-tbl th{text-align:left; padding:11px 22px; font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.14em; font-weight:600; font-size:11.5px; color:var(--muted); border-bottom:1px solid var(--rule)}
.pen-tbl td{padding:17px 22px; border-bottom:1px solid var(--rule); vertical-align:top}
.pen-tbl tr:last-child td{border-bottom:0}
.pen-l{display:flex; align-items:center; gap:10px; white-space:nowrap}
.pen-l b{font-size:16.5px; font-weight:600}
.pen-sys{font-family:var(--f-mono); font-size:14px; color:var(--brand); font-weight:500; white-space:nowrap}
.pen-when{font-size:15px; color:var(--ink-2)}
.pen-when small{display:block; font-size:13px; color:var(--muted); margin-top:3px}
.pen-cost{font-size:17px; font-weight:700; color:var(--miss); letter-spacing:-.01em}
.pen-cost small{display:block; font-weight:400; font-size:13px; color:var(--muted); margin-top:4px; letter-spacing:0}
.pen-foot{padding:15px 22px; background:#F2F5F6; border-top:1px solid var(--rule); font-size:14.5px; color:var(--ink-2); display:flex; gap:12px; align-items:baseline}
.pen-foot b{font-family:var(--f-mono); font-size:19px; color:var(--ink); font-weight:500}

/* ─── Produktansichten ───────────────────────────────────────── */
.view{margin-top:clamp(28px,4vw,44px)}
.view + .view{margin-top:clamp(44px,6vw,80px)}
.view-cap{display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; margin:0 0 16px}
.view-step{font-family:var(--f-mono); font-size:12px; color:#fff; background:var(--brand); padding:3px 8px; border-radius:2px; letter-spacing:.06em}
.view-cap h3{font-size:clamp(19px,2.2vw,24px); font-weight:700; letter-spacing:-.02em; margin:0}
.view-cap p{margin:0; font-size:16px; color:var(--muted); flex-basis:100%; max-width:62ch}
.app{background:var(--card); border:1px solid var(--rule); border-radius:7px; overflow:hidden; box-shadow:0 22px 50px -28px rgba(12,20,24,.4)}
.app-bar{display:flex; align-items:center; gap:10px; padding:10px 15px; background:#F2F5F6; border-bottom:1px solid var(--rule)}
.app-dots{display:flex; gap:6px}
.app-dots i{width:9px; height:9px; border-radius:50%; background:#CBD6DA; display:block}
.app-url{font-family:var(--f-mono); font-size:12px; color:var(--muted); background:var(--card); border:1px solid var(--rule); border-radius:3px; padding:4px 11px; flex:1; max-width:340px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.app-demo{margin-left:auto; font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.14em; font-weight:600; font-size:11px; color:var(--muted); border:1px solid var(--rule); border-radius:2px; padding:3px 8px; white-space:nowrap}
.app-body{display:grid; grid-template-columns:186px 1fr}
.app-body.full{grid-template-columns:1fr}
@media(max-width:800px){ .app-body{grid-template-columns:1fr} .app-rail{display:none} }
.app-rail{background:#F7F9FA; border-right:1px solid var(--rule); padding:16px 0}
.rail-grp{font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.16em; font-size:11px; font-weight:600; color:#94A6AD; padding:0 18px; margin:0 0 9px}
.rail-grp + .rail-grp{margin-top:22px}
.rail-item{display:flex; align-items:center; gap:10px; padding:8px 18px; font-size:14.5px; color:var(--ink-2); font-weight:500}
.rail-item.on{background:var(--brand-pale); color:var(--brand); font-weight:600; box-shadow:inset 3px 0 0 var(--brand)}
.rail-item .ic{width:15px; height:15px; flex:none; border-radius:2px; border:1.5px solid currentColor; opacity:.55}
.rail-item.on .ic{opacity:1}
.rail-item .cnt{margin-left:auto; font-family:var(--f-mono); font-size:11px; color:#fff; background:var(--miss); border-radius:9px; padding:1px 6px}
.app-main{padding:22px 24px 26px; min-width:0}
.app-h{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:0 0 20px}
.app-h h4{font-size:20px; font-weight:700; letter-spacing:-.02em; margin:0}
.app-h .sub{font-size:14px; color:var(--muted)}
.app-h .right{margin-left:auto; display:flex; gap:8px}
.pill{font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.12em; font-weight:600; font-size:11.5px; padding:5px 10px; border-radius:2px; border:1px solid var(--rule); color:var(--ink-2); background:var(--card); white-space:nowrap}
.pill.solid{background:var(--brand); border-color:var(--brand); color:#fff}
.split{display:grid; grid-template-columns:1fr 1fr; gap:24px}
@media(max-width:860px){ .split{grid-template-columns:1fr} }
.field{margin-bottom:17px}
.field.last{margin-bottom:0}
.field label{display:block; font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.14em; font-weight:600; font-size:11.5px; color:var(--muted); margin-bottom:7px}
.input{border:1px solid var(--rule); border-radius:3px; background:var(--card); padding:10px 12px; font-size:15.5px; color:var(--ink); min-height:42px; display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.input.focus{border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-pale)}
.input .cc{background:#EEF3F4; color:var(--brand); border-color:var(--rule)}
.tag{display:inline-flex; align-items:center; gap:6px; background:#EEF3F4; border:1px solid var(--rule); border-radius:2px; padding:3px 8px; font-size:14px}
.tag .x{color:#9AABB1; font-size:15px; line-height:1}
.caret{width:1.5px; height:18px; background:var(--brand); animation:blink 1.1s steps(1) infinite}
@keyframes blink{0%,49%{opacity:1}50%,100%{opacity:0}}
.dim{color:var(--muted); font-family:var(--f-display)}
.req{background:#F7F9FA; border:1px solid var(--rule); border-radius:5px; overflow:hidden; height:100%}
.req-h{padding:12px 16px; background:var(--board); color:#fff; font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.15em; font-weight:600; font-size:12px; display:flex; align-items:center; gap:10px}
.req-h .lamp{width:7px; height:7px; border-radius:50%; background:#5FD196; box-shadow:0 0 9px #5FD196; flex:none}
.req-row{display:flex; gap:12px; padding:14px 16px; border-bottom:1px solid var(--rule)}
.req-row:last-child{border-bottom:0}
.req-mark{width:19px; height:19px; flex:none; border-radius:50%; margin-top:2px; display:grid; place-items:center; font-size:11px; font-weight:700; color:#fff}
.req-mark.y{background:var(--ok)}
.req-mark.w{background:var(--wait)}
.req-mark.n{background:#B7C4C9}
.req-t{font-weight:600; font-size:15.5px; margin:0 0 3px; line-height:1.3}
.req-d{margin:0; font-size:13.5px; color:var(--muted); line-height:1.45}
.req-d .due{color:var(--miss); font-weight:600}
.req-row.off .req-t{color:#8B9BA1; font-weight:500}
.proof-grid{display:grid; grid-template-columns:1.25fr 1fr; gap:24px; align-items:start}
@media(max-width:860px){ .proof-grid{grid-template-columns:1fr} }
.receipt{background:var(--card); border:1px solid var(--rule); border-radius:0 0 5px 5px; position:relative; padding:26px 26px 24px; margin-top:9px}
.receipt::before{
  content:""; position:absolute; left:0; right:0; top:-9px; height:9px;
  background:radial-gradient(circle at 6px 9px, transparent 5px, var(--card) 5.5px) 0 0/12px 9px repeat-x;
  border-top:1px solid var(--rule); filter:drop-shadow(0 -1px 0 var(--rule));
}
.receipt-top{display:flex; align-items:flex-start; gap:14px; margin-bottom:18px}
.receipt-top h5{margin:0 0 4px; font-size:19px; font-weight:700; letter-spacing:-.02em}
.receipt-top .c{margin:0; font-size:14px; color:var(--muted)}
.stamp{margin-left:auto; flex:none; text-align:center; color:var(--ok); border:2px solid var(--ok); border-radius:3px; padding:7px 11px; font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.12em; font-weight:700; font-size:13px; transform:rotate(-3.5deg); opacity:.92}
.stamp small{display:block; font-family:var(--f-mono); font-size:10px; letter-spacing:0; font-weight:400; margin-top:3px}
.kv{display:grid; grid-template-columns:auto 1fr; gap:9px 20px; border-top:1px solid var(--rule); padding-top:16px; margin:0}
.kv dt{font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.13em; font-size:11.5px; font-weight:600; color:var(--muted); padding-top:3px}
.kv dd{margin:0; font-size:15px; font-family:var(--f-mono); color:var(--ink)}
.files{margin-top:20px; border-top:1px solid var(--rule); padding-top:16px; display:grid; gap:8px}
.file{display:flex; align-items:center; gap:11px; padding:9px 12px; border:1px solid var(--rule); border-radius:3px; font-size:14.5px; background:#FAFCFC}
.file .ft{font-family:var(--f-mono); font-size:10px; font-weight:500; color:#fff; background:var(--board); padding:2px 5px; border-radius:2px; letter-spacing:.04em}
.file .sz{margin-left:auto; font-family:var(--f-mono); font-size:12px; color:var(--muted)}
.phone-stage{background:#EEF3F4; padding-top:34px; padding-bottom:36px}
.phone{width:270px; margin:0 auto; background:var(--board); border-radius:30px; padding:11px; box-shadow:0 26px 54px -26px rgba(12,20,24,.75)}
.phone-scr{background:var(--card); border-radius:21px; overflow:hidden}
.ph-top{background:var(--board); color:#fff; padding:14px 16px 16px}
.ph-back{font-size:12px; color:#7D959F; margin:0 0 9px; font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.14em; font-weight:600}
.ph-top h6{margin:0 0 3px; font-size:19px; font-weight:700; letter-spacing:-.02em}
.ph-top .d{margin:0; font-size:13px; color:#9FB3BC; font-family:var(--f-mono)}
.ph-body{padding:14px 14px 16px}
.ph-doc{display:flex; align-items:center; gap:10px; padding:11px 0; border-bottom:1px solid var(--rule)}
.ph-doc:last-of-type{border-bottom:0}
.ph-doc .tick{width:18px; height:18px; flex:none; border-radius:50%; background:var(--ok); color:#fff; display:grid; place-items:center; font-size:10px; font-weight:700}
.ph-doc b{display:block; font-size:14.5px; font-weight:600}
.ph-doc span{display:block; font-size:12px; color:var(--muted); font-family:var(--f-mono)}
.ph-off{margin:12px 0 14px; display:flex; align-items:center; gap:7px; font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.12em; font-weight:600; font-size:11px; color:var(--ok); background:var(--ok-bg); border-radius:2px; padding:7px 9px}
.ph-btn{display:block; text-align:center; background:var(--brand); color:#fff; border-radius:4px; padding:13px; font-weight:600; font-size:15px}

/* ─── Länder ─────────────────────────────────────────────────── */
/* Genau vier Länder je Gruppe — feste Spalten, damit keine leeren Felder bleiben. */
.countries{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--rule); border:1px solid var(--rule); border-radius:5px; overflow:hidden}
@media(max-width:1000px){ .countries{grid-template-columns:repeat(2,1fr)} }
@media(max-width:600px){ .countries{grid-template-columns:1fr} }
.ctry{background:var(--card); padding:19px 20px}
.ctry-h{display:flex; align-items:center; gap:10px; margin-bottom:9px}
.ctry-cc{font-family:var(--f-sign); font-weight:700; font-size:13px; letter-spacing:.07em; background:var(--board); color:#fff; padding:3px 7px; border-radius:2px}
.ctry-h b{font-size:16px; font-weight:600}
.ctry-sys{font-family:var(--f-mono); font-size:13px; color:var(--brand); margin:0 0 5px; font-weight:500}
.ctry-note{margin:0; font-size:13.5px; color:var(--muted); line-height:1.45}
.ctry.base{background:var(--board); color:#fff}
.ctry.base .ctry-cc{background:var(--brand-lift)}
.ctry.base .ctry-sys{color:#7FD3E4}
.ctry.base .ctry-note{color:#9FB3BC}

/* Ländergruppen */
.grp-label{
  font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.17em;
  font-weight:600; font-size:13px; color:var(--ink-2); margin:0 0 12px;
  display:flex; align-items:center; gap:11px;
}
.grp-label::before{content:""; width:9px; height:9px; border-radius:50%; background:var(--ok); flex:none}
.grp-label.second{margin-top:34px}
.grp-label.second::before{background:#AFBEC4}
.countries.planned .ctry{background:#F0F4F5}
.countries.planned .ctry-cc{background:#7C8D95}
.countries.planned .ctry-h b{color:var(--ink-2)}
.countries.planned .ctry-sys{color:#6D8792}

/* Produktgrenzen */
.limits{
  background:var(--card); border:1px solid var(--rule); border-radius:5px;
  padding:6px 0; columns:2; column-gap:0; column-rule:1px solid var(--rule);
}
.limits p{
  margin:0; padding:15px 24px; font-size:15.5px; line-height:1.55; color:var(--ink-2);
  break-inside:avoid; display:flex; gap:12px;
}
.limits p::before{
  content:"—"; color:var(--miss); font-weight:700; flex:none;
}
@media(max-width:820px){ .limits{columns:1} }

/* ─── Ablauf ─────────────────────────────────────────────────── */
.steps{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:clamp(20px,3vw,34px); counter-reset:s}
.step{position:relative; padding-top:26px; margin-top:26px; border-top:2px solid var(--ink); counter-increment:s}
.step::before{content:counter(s,decimal-leading-zero); position:absolute; top:-2px; left:0; transform:translateY(-100%); padding-bottom:9px; font-family:var(--f-mono); font-size:12px; color:var(--brand); font-weight:500; letter-spacing:.08em}
.step h3{margin:0 0 9px; font-size:20px; font-weight:700; letter-spacing:-.02em}
.step p{margin:0; font-size:15.5px; color:var(--ink-2); line-height:1.55}

/* ─── Preise ─────────────────────────────────────────────────── */
.plans{display:grid; grid-template-columns:repeat(auto-fit,minmax(255px,1fr)); gap:1px; background:var(--rule); border:1px solid var(--rule); border-radius:5px; overflow:hidden}
.plan{background:var(--card); padding:28px 26px 30px; display:flex; flex-direction:column}
.plan-n{font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.17em; font-weight:600; font-size:13px; color:var(--brand); margin:0 0 14px}
.plan-p{font-size:42px; font-weight:800; letter-spacing:-.04em; line-height:1; margin:0 0 6px}
.plan-p .per{font-size:15px; font-weight:500; color:var(--muted); letter-spacing:0}
.plan-for{margin:0 0 20px; font-size:15px; color:var(--ink-2)}
.plan ul{list-style:none; margin:0 0 24px; padding:0; display:grid; gap:9px}
.plan li{display:flex; gap:9px; font-size:14.5px; color:var(--ink-2); line-height:1.45}
.plan li::before{content:"—"; color:var(--brand); flex:none; font-weight:600}
.plan .btn{margin-top:auto; width:100%}
.plan.mid{background:#F6F9FA}
.plan-tax{margin:16px 0 0; font-size:13.5px; color:var(--muted)}

/* ─── Vormerken ──────────────────────────────────────────────── */
.signup{background:var(--board); color:#fff; padding:clamp(56px,7vw,92px) 0}
.signup-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(30px,5vw,64px); align-items:start}
@media(max-width:860px){ .signup-grid{grid-template-columns:1fr} }
.signup h2{color:#fff}
.signup .sec-label{color:#6FB3C2}
.signup .sec-label::before{background:var(--brand-lift)}
.signup p.lead{font-size:18px; color:#C2D3DA; margin:0 0 26px; line-height:1.6}
/* Gründerpreis */
.founder{
  background:var(--board-2); border:1px solid #2F5460; border-left:3px solid var(--brand-lift);
  border-radius:4px; padding:20px 22px; margin:0 0 26px;
}
.founder-h{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:0 0 14px;
  font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.14em;
  font-weight:600; font-size:13px; color:#9FB3BC;}
.founder-tag{background:var(--brand-lift); color:#fff; padding:4px 9px; border-radius:2px; letter-spacing:.15em}
.founder ul{list-style:none; margin:0 0 14px; padding:0; display:grid; gap:10px}
.founder li{display:flex; gap:10px; font-size:15.5px; color:#C2D3DA; line-height:1.5}
.founder li::before{content:"✓"; color:#5FD196; font-weight:700; flex:none}
.founder li b{color:#fff; font-weight:600}
.founder-end{margin:0; padding-top:13px; border-top:1px solid var(--board-line);
  font-size:14px; color:#8FA9B3; line-height:1.5}

.what{list-style:none; margin:0; padding:0; display:grid; gap:13px}
.what li{display:flex; gap:12px; font-size:15.5px; color:#C2D3DA; line-height:1.5}
.what li b{color:#fff; font-weight:600}
.what .n{flex:none; width:22px; height:22px; border-radius:50%; border:1px solid var(--board-line); display:grid; place-items:center; font-family:var(--f-mono); font-size:11px; color:#7FD3E4; margin-top:1px}
.form-card{background:var(--board-2); border:1px solid var(--board-line); border-radius:6px; padding:clamp(22px,3vw,30px)}
.form-card h3{margin:0 0 6px; font-size:21px; font-weight:700; letter-spacing:-.02em}
.form-card .fl{margin:0 0 22px; font-size:14.5px; color:#9FB3BC}
.f-row{margin-bottom:15px}
.f-row label{display:block; font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.14em; font-weight:600; font-size:11.5px; color:#7D959F; margin-bottom:7px}
.f-row input, .f-row select{width:100%; background:var(--board); border:1px solid var(--board-line); border-radius:3px; color:#fff; font-family:var(--f-display); font-size:15.5px; padding:12px 13px}
.f-row input::placeholder{color:#546E79}
.f-row input:focus, .f-row select:focus{outline:none; border-color:var(--brand-lift); box-shadow:0 0 0 3px rgba(14,116,136,.3)}
.form-card .btn{width:100%; padding:14px; font-size:16px; margin-top:6px}
.f-fine{margin:14px 0 0; font-size:12.5px; color:#6D8792; line-height:1.5}
.f-ok{display:none; text-align:center; padding:22px 6px}
.f-ok.on{display:block}
.f-ok .tick{width:46px; height:46px; margin:0 auto 16px; border-radius:50%; background:var(--ok); color:#fff; display:grid; place-items:center; font-size:22px}
.f-ok h3{margin:0 0 8px}
.f-ok p{margin:0; font-size:15px; color:#9FB3BC; line-height:1.55}
.form-live.hide{display:none}

/* ─── FAQ ────────────────────────────────────────────────────── */
.faq{display:grid; gap:1px; background:var(--rule); border-top:1px solid var(--rule); border-bottom:1px solid var(--rule)}
.faq details{background:var(--paper)}
.faq summary{cursor:pointer; list-style:none; padding:20px 2px; font-size:17.5px; font-weight:600; display:flex; align-items:center; gap:16px; letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; margin-left:auto; color:var(--brand); font-size:22px; font-weight:400; line-height:1}
.faq details[open] summary::after{content:"–"}
.faq .a{padding:0 2px 22px; margin:0; max-width:74ch; color:var(--ink-2); font-size:16px; line-height:1.6}

/* ─── Fuß ────────────────────────────────────────────────────── */
.foot{background:var(--board); color:#7D959F; padding:44px 0 40px; font-size:13.5px}
.foot-top{display:flex; gap:24px; flex-wrap:wrap; align-items:center; padding-bottom:22px; border-bottom:1px solid var(--board-line)}
.foot-links{margin-left:auto; display:flex; gap:22px; flex-wrap:wrap}
.foot-links a{color:#9FB3BC; text-decoration:none; font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.13em; font-weight:600; font-size:13px}
.foot-links a:hover{color:#fff}
.foot-bot{display:flex; gap:20px; flex-wrap:wrap; align-items:flex-start; padding-top:20px; line-height:1.6}
.foot-bot .r{margin-left:auto; text-align:right}
.foot .logo-text{font-size:16px}
@media(max-width:700px){ .foot-links{margin-left:0} .foot-bot .r{margin-left:0; text-align:left} }

/* ─── Rechtsseiten ───────────────────────────────────────────── */
/* Nur oben und unten setzen — die Seitenränder kommen von .wrap und
   dürfen von der Kurzschreibweise nicht überschrieben werden. */
.doc{padding-top:clamp(44px,6vw,76px); padding-bottom:clamp(56px,7vw,88px); max-width:860px}
.doc h1{font-size:clamp(32px,4.6vw,52px); line-height:1.02; letter-spacing:-.03em; word-spacing:.05em; font-weight:800; margin:0 0 10px; max-width:none; color:var(--ink)}
.doc-meta{font-family:var(--f-mono); font-size:13px; color:var(--muted); margin:0 0 clamp(28px,4vw,42px)}
.doc-note{background:#FAEFD6; border:1px solid #E3C77E; border-radius:4px; padding:14px 18px; font-size:15px; color:#6B5216; margin:0 0 30px; line-height:1.55}
.doc section{background:var(--card); border:1px solid var(--rule); border-radius:5px; padding:24px 26px; margin-bottom:14px}
.doc section h2{font-size:19px; font-weight:700; letter-spacing:-.015em; margin:0 0 12px; line-height:1.3}
.doc section p{margin:0 0 11px; font-size:15.5px; color:var(--ink-2); line-height:1.62}
.doc section p:last-child{margin-bottom:0}
.doc section ul{margin:0 0 11px; padding-left:20px; font-size:15.5px; color:var(--ink-2); line-height:1.62}
.doc section li{margin-bottom:6px}
.doc section a{color:var(--brand); text-decoration:underline; text-underline-offset:2px}
.doc section strong{color:var(--ink); font-weight:600}
.doc-lead{background:#F2F5F6; border:1px solid var(--rule); border-radius:5px; padding:20px 26px; margin:0 0 22px; font-size:15.5px; color:var(--ink-2); line-height:1.62}
.doc-lead p{margin:0 0 9px}
.doc-lead p:last-child{margin-bottom:0}
.kontakt-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:14px; margin-bottom:14px}
.kontakt-grid section{margin-bottom:0}
.big-mail{font-size:clamp(20px,2.6vw,27px); font-weight:700; letter-spacing:-.02em; word-break:break-all}
.big-mail a{color:var(--brand); text-decoration:none}
.big-mail a:hover{text-decoration:underline}

/* ─── Danke-Seite ────────────────────────────────────────────── */
.danke{padding-top:clamp(50px,8vw,96px); padding-bottom:clamp(60px,8vw,110px); max-width:740px}
.danke-karte{background:var(--card); border:1px solid var(--rule); border-radius:6px; padding:clamp(28px,5vw,48px); text-align:center}
.danke-tick{width:56px; height:56px; margin:0 auto 22px; border-radius:50%; background:var(--ok); color:#fff; display:grid; place-items:center; font-size:27px; font-weight:700}
.danke h1{font-size:clamp(34px,5vw,54px); line-height:1; letter-spacing:-.035em; word-spacing:.05em; font-weight:800; margin:0 0 14px; max-width:none; color:var(--ink)}
.danke-lead{font-size:18px; color:var(--ink-2); line-height:1.55; margin:0 auto 28px; max-width:46ch}
.danke-next{list-style:none; counter-reset:d; margin:0 0 26px; padding:0; text-align:left; display:grid; gap:12px}
/* Kein Flex: sonst wird das fette <b> zu einer eigenen Spalte und der
   Satz bricht mitten in der Beschriftung um. */
.danke-next li{counter-increment:d; position:relative; font-size:15.5px; color:var(--ink-2); line-height:1.5;
  background:#F7F9FA; border:1px solid var(--rule); border-radius:4px; padding:13px 16px 13px 50px}
.danke-next li::before{content:counter(d); position:absolute; left:16px; top:13px;
  width:22px; height:22px; border-radius:50%;
  background:var(--brand); color:#fff; display:grid; place-items:center;
  font-family:var(--f-mono); font-size:11px}
.danke-next b{color:var(--ink); font-weight:600}
.danke-fuss{font-size:14px; color:var(--muted); margin:0 0 26px; line-height:1.55}
.danke-cta{display:flex; gap:10px; justify-content:center; flex-wrap:wrap}
.btn-hell{background:#EEF3F4; color:var(--brand); border:1px solid var(--rule)}
.btn-hell:hover{background:#E3EAEC}

/* ─── Lokale Vorschau ────────────────────────────────────────── */
.local{position:fixed; left:14px; bottom:14px; z-index:90; background:var(--board); color:#F0C46A; border:1px solid var(--board-line); border-radius:3px; padding:8px 12px; font-family:var(--f-sign); text-transform:uppercase; letter-spacing:.14em; font-weight:600; font-size:11px; display:flex; align-items:center; gap:8px; box-shadow:0 10px 24px -12px rgba(0,0,0,.6)}
.local .lamp{width:7px; height:7px; border-radius:50%; background:#F0C46A; flex:none}
.local button{background:none; border:0; color:#546E79; cursor:pointer; font:inherit; padding:0 0 0 4px}
.local button:hover{color:#fff}

/* ─── Einblenden ─────────────────────────────────────────────── */
.rev{opacity:0; transform:translateY(16px)}
.rev.in{opacity:1; transform:none; transition:opacity .6s ease, transform .6s ease}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none !important; transition:none !important}
  .rev,.board-tbl tbody tr{opacity:1 !important; transform:none !important}
}

/* Honigtopf gegen Bots — für Menschen unsichtbar, für Bots verlockend.
   Nicht display:none, das erkennen manche Bots. */
.honig{position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden}