/* MapRaiders subpage, calm version of the homepage stage (Fassung 3). Same tokens as mobile/src/theme/brand.ts.
   Source: seo-strategy/vorlagen/unterseite_v3.css, written to /design/v3-unterseite.css by build_hubs_v3.mjs. */
@font-face{font-family:"Cinzel";src:url(/assets/schriften/cinzel-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Cinzel";src:url(/assets/schriften/cinzel-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url(/assets/schriften/source-sans-3-400-latin.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-024F,U+2000-206F,U+20A0-20CF,U+2100-214F,U+2190-21FF,U+2212}
@font-face{font-family:"Source Sans 3";src:url(/assets/schriften/source-sans-3-400-cyrillic.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0400-052F}
@font-face{font-family:"Source Sans 3";src:url(/assets/schriften/source-sans-3-400.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0250-03FF,U+1E00-1FFF,U+2070-209F,U+2150-218F,U+2200-2211,U+2213-22FF,U+25A0-25FF,U+2713-2714}
@font-face{font-family:"Source Sans 3";src:url(/assets/schriften/source-sans-3-600-latin.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+0000-024F,U+2000-206F,U+20A0-20CF,U+2100-214F,U+2190-21FF,U+2212}
@font-face{font-family:"Source Sans 3";src:url(/assets/schriften/source-sans-3-600-cyrillic.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+0400-052F}
@font-face{font-family:"Source Sans 3";src:url(/assets/schriften/source-sans-3-600.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+0250-03FF,U+1E00-1FFF,U+2070-209F,U+2150-218F,U+2200-2211,U+2213-22FF,U+25A0-25FF,U+2713-2714}
:root{
  --ink:#17130f;--parchment:#ead9b5;--paper:#f0e3c6;--gold:#b89452;--gold-deep:#705327;--gold-light:#d9bd83;--seal:#a8322b;
  --display:"Barlow Condensed",Barlow,system-ui,sans-serif;--body:Barlow,system-ui,sans-serif;--lh:1.65;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:rgba(255,255,255,0.65);color:#141213;font:400 18px/var(--lh) var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:#e0400f}
a:focus-visible,button:focus-visible{outline:2px solid rgba(242,70,27,0.45);outline-offset:3px}
h1,h2,h3{font-family:var(--display);font-weight:700;letter-spacing:.04em;line-height:1.25;margin:0}
.skip{position:absolute;left:8px;top:8px;transform:translateY(-300%);background:#ff8452;color:#141213;padding:10px 16px;z-index:50}
.skip:focus{transform:none}

/* stage: night chart, fixed, only the background drifts a little */
.stage{position:fixed;inset:0;height:100vh;height:100lvh;z-index:0;overflow:hidden;background:rgba(255,255,255,0.65);pointer-events:none}
.stage img{position:absolute;left:-2%;top:0;width:104%;height:180vh;max-width:none;object-fit:cover;object-position:center top;will-change:transform}
.stage::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 110% 85% at 50% 40%,rgba(255,255,255,0.4) 20%,rgba(255,255,255,0.61) 100%)}
.bar,main,footer{position:relative;z-index:1}

/* header bar, same as the homepage */
.bar{position:sticky;top:0;z-index:20;padding:8px 0;background:rgba(255,255,255,0.61);border-bottom:1px solid rgba(20,18,19,0.14);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.bar .wrap{width:min(1180px,100% - 40px);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font:700 1.05rem/1 var(--display);letter-spacing:.22em;color:#141213}
.brand img{width:98px;height:31px}
.nav{display:flex;gap:4px}
.nav a{font:400 .74rem/1 var(--display);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:#141213;padding:11px 14px;transition:transform .12s}
.nav a:hover{background:rgba(242,70,27,0.18);color:#141213}
.nav a:active{transform:translateY(2px) scale(.97)}
.nav a[aria-current=page]{color:#e0400f;box-shadow:inset 0 -1px 0 rgba(242,70,27,0.38)}
.nav a.cta{background:#ff8452;color:#141213;font-weight:700}
.burger{display:none;width:44px;height:44px;border:1px solid rgba(20,18,19,0.14);background:none;color:#141213;font-size:1.3rem;cursor:pointer}
.burger:active{transform:translateY(2px) scale(.96)}

/* plate */
main{padding:56px 0 12vh}
.crumb{width:min(860px,100% - 40px);margin:0 auto 18px;font:400 .74rem/1.4 var(--display);letter-spacing:.16em;text-transform:uppercase;color:#3a3536}
.crumb a{color:inherit;text-decoration:none}.crumb a:hover{color:#e0400f}
.plate{width:min(860px,100% - 28px);margin:0 auto;padding:64px clamp(22px,6vw,76px) 60px;background:rgba(255,255,255,0.62);border:1px solid rgba(20,18,19,0.14);
  box-shadow:0 0 0 4px rgba(40,22,12,0.26),0 0 0 5px rgba(242,70,27,0.38),0 50px 90px -30px rgba(40,22,12,0.24)}
.kicker{font:400 .78rem/1 var(--display);letter-spacing:.3em;text-transform:uppercase;color:#e0400f;text-align:center}
.kicker::before,.kicker::after{content:"✦";margin-inline:.8em;color:#5d5557;font-size:.8em}
.plate h1{font-size:clamp(1.7rem,3.4vw,2.6rem);text-align:center;margin:18px 0 18px}
.lede{font-size:1.12rem;color:#141213;text-align:center;max-width:60ch;margin:0 auto 30px}
.plate h2{font-size:clamp(1.2rem,2vw,1.5rem);margin:46px 0 12px;padding-top:26px;border-top:1px solid rgba(20,18,19,0.09);color:#141213}
.plate p{margin:0 0 16px;color:#141213}
.plate ul{margin:0 0 16px;padding-left:1.2em;color:#141213}.plate li{margin-bottom:8px}
.tag{display:inline-block;font:400 .7rem/1 var(--display);letter-spacing:.16em;text-transform:uppercase;border:1px solid rgba(242,70,27,0.45);padding:5px 8px;color:#e0400f;margin:0 8px 0 0;vertical-align:middle}
.cta-row{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin:30px 0 6px}
.plate .orte{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:18px 0 20px;padding:0;list-style:none}
.orte li{border:1px solid rgba(20,18,19,0.14);background:rgba(255,255,255,0.52);padding:20px;margin:0}
.orte b{display:block;font:700 1.05rem/1.2 var(--display);letter-spacing:.08em;color:#141213;margin-bottom:6px}
.orte span{color:#141213;font-size:.96rem}
.plate .weiter{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:14px 0 0;padding:0;list-style:none}
.weiter a{display:block;padding:14px 16px;border:1px solid rgba(20,18,19,0.14);text-decoration:none;color:#141213;font:700 .8rem/1.3 var(--display);letter-spacing:.14em;text-transform:uppercase;transition:transform .22s cubic-bezier(.3,1.6,.5,1),background-color .2s}
.weiter a:hover{background:rgba(242,70,27,0.14)}
.weiter a:active{transform:scale(.95);transition-duration:.06s}

/* showpieces (schaustuecke.mjs): real app screenshots only */
figure{margin:0}
figcaption{font-size:.98rem;line-height:1.5;color:#141213;margin-top:12px}
figcaption b{display:block;font:700 .86rem/1.3 var(--display);letter-spacing:.12em;text-transform:uppercase;color:#141213;margin-bottom:2px}
.plate .app-bilder{display:grid;gap:34px;margin:8px calc(-1*clamp(0px,4vw,44px)) 38px;padding:0;list-style:none;counter-reset:schritt}
.app-bilder li{margin:0;counter-increment:schritt;position:relative}
.app-bilder li::before{content:counter(schritt);position:absolute;left:-10px;top:-10px;z-index:1;width:38px;height:38px;display:grid;place-items:center;background:#ff8452;color:#141213;font:700 1.05rem/1 var(--display);border:1px solid rgba(20,18,19,0.14);box-shadow:0 4px 10px rgba(40,22,12,0.2)}
.app-bilder img{width:100%;border:1px solid rgba(242,70,27,0.45);box-shadow:0 0 0 3px rgba(40,22,12,0.26),0 0 0 4px rgba(40,22,12,0.26),0 30px 50px -22px rgba(40,22,12,0.26)}

/* buttons pressed exactly like the app's BrandButton */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:6px 26px;cursor:pointer;
  font:700 .92rem/1.2 var(--display);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;text-align:center;
  border:12px solid transparent;border-image:url(/assets/buehne/mapraiders-knopf-hell.webp) 44 fill / 12px stretch;color:#141213;
  filter:drop-shadow(0 6px 8px rgba(40,22,12,0.19));transition:transform .18s cubic-bezier(.3,1.6,.5,1),filter .18s ease;-webkit-tap-highlight-color:transparent}
.btn.dark{border-image-source:url(/assets/buehne/mapraiders-knopf-dunkel.webp);color:#141213}
.btn:hover{filter:drop-shadow(0 9px 12px rgba(40,22,12,0.2)) brightness(1.07)}
.btn:active{transform:translateY(2px) scale(.988);filter:drop-shadow(0 1px 1px rgba(40,22,12,0.18)) brightness(.9) saturate(.85);transition-duration:.05s}

footer{background:rgba(255,255,255,0.65);color:#5d5557;padding:44px 0 50px;font-size:.92rem}
footer .wrap{width:min(1040px,100% - 56px);margin-inline:auto;display:flex;flex-wrap:wrap;gap:18px 40px;justify-content:space-between}
footer nav{display:flex;flex-wrap:wrap;gap:6px 22px}
footer a{color:#141213;text-decoration:none}footer a:hover{color:#e0400f}

@media (max-width:760px){
  body{font-size:17px}
  .nav{display:none}.burger{display:block}
  .bar.open .nav{display:grid;position:absolute;left:0;right:0;top:100%;background:rgba(255,255,255,0.64);border-bottom:1px solid rgba(20,18,19,0.14);padding:8px 20px 16px}
  .bar.open .nav a{padding:15px 4px;border-bottom:1px solid rgba(20,18,19,0.07);font-size:.85rem}
  main{padding-top:30px}.plate{padding-top:44px}
  .stage img{height:140vh}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* sign-in button next to the language switch (René 24.09.2026), same look as .sw summary */
.anmelden{flex:none;display:flex;align-items:center;gap:7px;height:40px;padding:0 12px;margin-left:auto;border:1px solid rgba(20,18,19,0.14);color:#141213;font:400 .74rem/1 var(--display);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;background:rgba(255,255,255,0.59);white-space:nowrap}
.anmelden:hover{background:rgba(242,70,27,0.18);color:#141213}
.anmelden:focus-visible{outline:2px solid rgba(242,70,27,0.45);outline-offset:2px}
.anmelden svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5}
.nav+.anmelden{margin-left:0}
.anmelden+.sw{margin-left:0}
@media (max-width:1100px){.nav+.anmelden{margin-left:auto}}
@media (max-width:560px){.anmelden{padding:0 11px}.anmelden span{display:none}}

/* ============ GLASS (René 28.09.2026), restyle preview _ablage/2026-09-27/restyle ============ */
@font-face{font-family:"Anton";src:url(/assets/schriften/anton-400-latin-ext.woff2) format("woff2");font-weight:400;font-display:swap;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:"Anton";src:url(/assets/schriften/anton-400-latin.woff2) format("woff2");font-weight:400;font-display:swap;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";src:url(/assets/schriften/barlow-400-latin-ext.woff2) format("woff2");font-weight:400;font-display:swap;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";src:url(/assets/schriften/barlow-400-latin.woff2) format("woff2");font-weight:400;font-display:swap;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";src:url(/assets/schriften/barlow-500-latin-ext.woff2) format("woff2");font-weight:500;font-display:swap;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";src:url(/assets/schriften/barlow-500-latin.woff2) format("woff2");font-weight:500;font-display:swap;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";src:url(/assets/schriften/barlow-600-latin-ext.woff2) format("woff2");font-weight:600;font-display:swap;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";src:url(/assets/schriften/barlow-600-latin.woff2) format("woff2");font-weight:600;font-display:swap;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";src:url(/assets/schriften/barlow-700-latin-ext.woff2) format("woff2");font-weight:700;font-display:swap;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";src:url(/assets/schriften/barlow-700-latin.woff2) format("woff2");font-weight:700;font-display:swap;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";src:url(/assets/schriften/barlow-condensed-500-latin-ext.woff2) format("woff2");font-weight:500;font-display:swap;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";src:url(/assets/schriften/barlow-condensed-500-latin.woff2) format("woff2");font-weight:500;font-display:swap;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";src:url(/assets/schriften/barlow-condensed-600-latin-ext.woff2) format("woff2");font-weight:600;font-display:swap;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";src:url(/assets/schriften/barlow-condensed-600-latin.woff2) format("woff2");font-weight:600;font-display:swap;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";src:url(/assets/schriften/barlow-condensed-700-latin-ext.woff2) format("woff2");font-weight:700;font-display:swap;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";src:url(/assets/schriften/barlow-condensed-700-latin.woff2) format("woff2");font-weight:700;font-display:swap;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}

:root{--o1:#ff7440;--o2:#f2461b;--o3:#cf2d0b;--tinte:#141213;--tinte2:#3a3536;--tinte3:#6b6365;--papier:#ece8e4;
  --anton:Anton,Impact,"Barlow Condensed",sans-serif;--cond:"Barlow Condensed",Barlow,system-ui,sans-serif;
  --glas:linear-gradient(160deg,rgba(255,255,255,.64),rgba(255,255,255,.38));
  --glas-rand:inset 0 0 0 1.5px rgba(255,255,255,.92),0 0 5px rgba(255,255,255,.7),0 0 18px rgba(255,255,255,.35),inset 0 0 18px rgba(255,255,255,.4),0 24px 40px -22px rgba(18,22,32,.45);
  --orange:radial-gradient(80% 60% at 50% 110%,rgba(255,190,120,.55),rgba(255,160,100,0) 70%),linear-gradient(180deg,rgba(255,132,84,.97) 0%,rgba(245,82,31,.95) 55%,rgba(228,62,14,.97) 100%);
  --orange-schatten:inset 0 1px 0 rgba(255,236,222,.9),inset 0 -1px 0 rgba(255,210,170,.6),inset 0 12px 16px -12px rgba(255,230,210,.75),inset 0 -12px 16px -12px rgba(110,20,0,.35),0 0 16px -2px rgba(255,90,40,.5),0 6px 12px -5px rgba(110,25,0,.45);
  --milch:linear-gradient(180deg,rgba(255,255,255,.76) 0%,rgba(255,255,255,.46) 55%,rgba(255,255,255,.56) 100%);
  --milch-schatten:inset 0 0 0 1.5px rgba(255,255,255,.95),inset 0 -10px 14px -10px rgba(0,0,0,.14),0 1px 1px rgba(8,10,14,.18),0 6px 12px -6px rgba(8,10,14,.35)}

html:root{--display:"Barlow Condensed",Barlow,"Segoe UI",system-ui,sans-serif;--body:Barlow,"Segoe UI",system-ui,sans-serif}
body{background:var(--papier);color:var(--tinte)}
.stage{background:var(--papier) url(/assets/hintergrund/mapraiders-tcg-hintergrund-stadt-panorama.webp) center bottom/cover no-repeat}
.stage img,.stage picture{display:none!important}
.stage::after{background:linear-gradient(180deg,rgba(236,232,228,.25),rgba(236,232,228,.55))}
a{color:var(--o3)}
a:focus-visible,button:focus-visible{outline:2px solid var(--o2)}
/* header */
.bar{background:rgba(236,232,228,.8);border-bottom:1px solid rgba(255,255,255,.85);box-shadow:0 10px 30px -18px rgba(20,16,16,.45)}
.brand img{content:url(/assets/marke/mapraiders-tcg-marke-pinsel-schwarz.webp);width:auto;height:36px}
.nav{background:rgba(255,255,255,.52);border-radius:999px;padding:5px;box-shadow:var(--milch-schatten)}
.nav a{font:600 .92rem/1 var(--display);letter-spacing:.04em;text-transform:uppercase;color:var(--tinte);border-radius:999px}
.nav a:hover{background:rgba(255,255,255,.75);color:var(--tinte)}
.nav a[aria-current=page]{color:var(--o3);box-shadow:inset 0 -2px 0 var(--o2)}
.nav a.cta{background:var(--orange);color:#fff;box-shadow:var(--orange-schatten);text-shadow:0 1px 2px rgba(120,20,0,.4)}
.burger{border:0;border-radius:12px;background:var(--milch);box-shadow:var(--milch-schatten);color:var(--tinte)}
.anmelden{border:0!important;border-radius:999px!important;background:var(--milch)!important;box-shadow:var(--milch-schatten)!important;color:var(--tinte)!important;font-family:var(--display)!important;font-weight:600!important}
.sw summary{border:0;border-radius:999px;background:var(--milch);box-shadow:var(--milch-schatten);color:var(--tinte)}
.sw ul{background:rgba(255,255,255,.95);border:0;border-radius:16px;box-shadow:var(--glas-rand)}
.sw a{color:var(--tinte)}
.crumb{color:var(--tinte3);font-family:var(--display);font-weight:600}
.crumb a:hover{color:var(--o3)}
@media (max-width:760px){.bar.open .nav{background:rgba(245,242,239,.97);border-radius:0 0 20px 20px;box-shadow:0 20px 30px -20px rgba(20,16,16,.4)}.bar.open .nav a{border-radius:0}}
/* the plate: frosted glass */
.plate{background:var(--glas);-webkit-backdrop-filter:blur(16px) saturate(125%);backdrop-filter:blur(16px) saturate(125%);border:0;border-radius:30px;box-shadow:var(--glas-rand);color:var(--tinte)}
.plate h1{font:400 clamp(2.2rem,4.4vw,3.8rem)/1.06 var(--anton);text-transform:uppercase;letter-spacing:.005em;color:var(--tinte)}
.plate h2{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.02em;color:var(--tinte)}
.plate h3{font-family:var(--display);font-weight:700;color:var(--tinte)}
.plate img{border:0!important;border-radius:14px}
.btn{border:0;border-image:none;border-radius:999px;min-height:52px;padding:8px 26px;font:600 1rem/1.2 var(--display);letter-spacing:.05em;text-transform:uppercase;color:#fff;
  background:var(--orange);box-shadow:var(--orange-schatten);filter:none;text-shadow:0 1px 2px rgba(120,20,0,.4);text-decoration:none}
.btn.dark{background:var(--milch);color:var(--tinte);box-shadow:var(--milch-schatten);text-shadow:none}
.btn:hover{filter:none;transform:translateY(-2px)}
.btn:active{filter:none}
footer{background:rgba(20,16,16,.92);color:#cfc6c2}
footer a{color:#fff}footer a:hover{color:#ff9a6e}

/* push buttons (René 26.10.2026): a raised cap that sinks into its socket when pressed, in our orange, milk and smoke;
   the haptic tick on press comes from sprache.js */
:root{--k-hoch:0 .05em .05em -.01em rgba(5,5,5,.55),0 .01em .01em -.01em rgba(5,5,5,.4),.15em .3em .25em -.05em rgba(5,5,5,.28),
    inset 0 0 0 0 rgba(20,18,19,0),inset 0 0 0 0 rgba(5,5,5,0),inset -.05em -.05em .05em 0 rgba(5,5,5,.25),inset 0 0 0 0 rgba(5,5,5,0),
    inset 0 0 .05em .2em rgba(255,255,255,.22),inset .025em .05em .1em 0 rgba(255,255,255,.95),inset .12em .12em .12em rgba(255,255,255,.25),inset -.075em -.25em .25em .1em rgba(5,5,5,.22);
  --k-tief:0 0 0 0 rgba(5,5,5,0),0 0 0 0 rgba(5,5,5,0),0 0 0 0 rgba(5,5,5,0),
    inset 0 0 0 1.5px rgba(20,18,19,.5),inset .1em .15em .05em 0 rgba(5,5,5,.6),inset -.025em -.03em .05em .025em rgba(5,5,5,.4),inset .25em .25em .2em 0 rgba(5,5,5,.4),
    inset 0 0 .05em .5em rgba(255,255,255,.12),inset 0 0 0 0 rgba(255,255,255,0),inset .12em .12em .12em rgba(255,255,255,.2),inset -.075em -.12em .2em .1em rgba(5,5,5,.22);
  --k-orange:linear-gradient(135deg,#ff9466,#e0400f);--k-milch:linear-gradient(135deg,#fff,#d3ccc6);--k-rauch:linear-gradient(135deg,#4d4545,#171414);}
.btn{--kappe:var(--k-orange);background:var(--kappe);box-shadow:var(--k-hoch);transition:transform .25s ease,box-shadow .3s ease}
.btn.dark{--kappe:var(--k-milch);box-shadow:var(--k-hoch)}
.anmelden{background:var(--k-milch)!important;box-shadow:var(--k-hoch)!important;transition:transform .25s ease,box-shadow .3s ease}
@media (hover:hover){.btn:hover,.anmelden:hover{transform:translate(var(--mx,0px),var(--my,0px));box-shadow:var(--k-tief)!important}}
.btn:active,.btn.is-down,.anmelden:active{transform:translate(var(--mx,0px),var(--my,0px)) scale(.975);box-shadow:var(--k-tief)!important}
/* the header too (René 26.10.2026, "auch die"): menu links, Beta, music, language and burger are push keys */
.nav a,.sw summary,.burger{background:var(--k-milch);box-shadow:var(--k-hoch);transition:transform .25s ease,box-shadow .3s ease}
.nav a.cta{background:var(--k-orange);box-shadow:var(--k-hoch)}
@media (min-width:761px){.nav a+a{margin-inline-start:3px}}
.mr-musik[data-ort=kopf]{background:var(--k-milch)!important;box-shadow:var(--k-hoch)!important;transition:transform .25s ease,box-shadow .3s ease}
.nav a:not(.cta):hover,.sw summary:hover{background:var(--k-milch)}
.sw[open] summary{background:var(--k-milch);box-shadow:var(--k-tief)}
@media (hover:hover){.nav a:hover,.sw summary:hover,.burger:hover,.mr-musik[data-ort=kopf]:hover{box-shadow:var(--k-tief)!important}}
.nav a:active,.sw summary:active,.burger:active,.mr-musik[data-ort=kopf]:active{transform:scale(.975);box-shadow:var(--k-tief)!important}
/* the header key of the page you are on stays pressed, and a tapped key stays down until the next page is there (René 26.10.2026) */
.nav a[aria-current=page],.nav a.gedrueckt{transform:none;box-shadow:var(--k-tief)!important}
