:root{--bg:#000;--linie:#262626;--text:#e6e6e6;--text-leise:#a3a3a3;--akzent:#f90;--schrift:Verdana,Geneva,Tahoma,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 16px 24px;background:var(--bg);color:var(--text);font:16px/1.75 var(--schrift)}
a{color:var(--akzent);text-decoration:none}
a:hover,a:focus-visible{text-decoration:underline}
:focus-visible{outline:2px solid var(--akzent);outline-offset:3px}

/* Foto als Hintergrund, abgedunkelt */
.hintergrund{position:fixed;inset:0;z-index:-1;width:100%;height:100%;object-fit:cover;opacity:.32}

.karte{width:100%;max-width:640px;padding:44px 40px 40px;background:rgba(0,0,0,.78);border:1px solid var(--linie);border-top:3px solid var(--akzent);text-align:center}
.karte p{margin:0 0 1.2em}

.marke{margin-bottom:36px}
.marke img{width:64px;height:64px;margin:0 auto 14px;border-radius:50%}
.marke .marke-titel{margin:0;font-size:24px;line-height:1.2;color:#fff}
.marke .marke-unter{margin:6px 0 0;font-size:11px;letter-spacing:.06em;color:var(--text-leise)}

.karte .kategorie{margin:0;font-size:11px;line-height:1;letter-spacing:.24em;text-transform:uppercase;color:var(--akzent)}
h1{margin:14px 0 22px;font:400 clamp(30px,6vw,44px)/1.15 var(--schrift);color:#fff;text-wrap:balance}
h1::after{content:"";display:block;width:44px;height:2px;margin:22px auto 0;background:var(--akzent)}
.karte .einstieg{font-size:19px;font-style:italic;line-height:1.6;color:#fff}

address{margin-top:30px;padding-top:26px;border-top:1px solid var(--linie);font-style:normal;line-height:1.8}
address strong{color:#fff}

.fuss{margin-top:28px;font-size:12px;letter-spacing:.06em;color:var(--text-leise)}

@media (max-width:560px){
  body{padding-top:24px}
  .karte{padding:32px 20px 28px}
  .marke .marke-titel{font-size:20px}
  .karte .einstieg{font-size:17px}
}