@font-face{font-family:Roboto;font-style:normal;font-weight:400;font-display:swap;src:url('../assets/Roboto-400.ttf') format('truetype')}
@font-face{font-family:Roboto;font-style:normal;font-weight:500;font-display:swap;src:url('../assets/Roboto-500.ttf') format('truetype')}
@font-face{font-family:Roboto;font-style:normal;font-weight:700;font-display:swap;src:url('../assets/Roboto-700.ttf') format('truetype')}
@font-face{font-family:Roboto;font-style:normal;font-weight:900;font-display:swap;src:url('../assets/Roboto-900.ttf') format('truetype')}

:root{--red:#ff0017;--ink:#101216;--line:#d9dce0;--paper:#f3f4f4;--muted:#687079}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Roboto,Arial,sans-serif}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid #156bd5;outline-offset:5px}img{max-width:100%;display:block}h1,h2,h3,p{margin:0}h1,h2,h3{letter-spacing:-.045em}svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.preview-bar{text-align:center;padding:9px 16px;background:#ede7e6;font-size:10px;color:#603d40;letter-spacing:.12em}.preview-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--red);margin-right:7px}
.shop-header{background:#0d0f12;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:27px 5%;border-bottom:1px solid #292b30}.shop-header img{width:164px}.shop-header>span{font-size:10px;color:#aeb2b9;letter-spacing:.19em}
.shop-hierarchy{display:flex;align-items:center;gap:24px;background:#181b20;color:#c6cad1;padding:13px 5%;font-size:11px;border-bottom:1px solid #30343a}.shop-home-link{white-space:nowrap;color:#fff;display:inline-flex;align-items:center;gap:8px}.shop-home-link svg{width:16px;height:16px}.shop-branches{display:flex;gap:6px;min-width:0;overflow-x:auto;padding:2px 0}.shop-branches a{white-space:nowrap;padding:11px 14px;border:1px solid transparent;border-radius:3px;display:flex;align-items:center;gap:9px}.shop-branches a:hover{background:#252a32;color:white}.shop-branches a[aria-current="page"]{background:#2a2e35;border-color:#555b65;color:white}.shop-branches b{font-size:10px;font-weight:700;color:#ff6774}.shop-home-link[aria-current="page"]{text-decoration:underline;text-decoration-color:#ff0017;text-underline-offset:6px}
.hub-intro{background:#101216;color:white;padding:58px 5% 64px;position:relative;overflow:hidden}.hub-intro:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#101216 15%,rgba(16,18,22,.95) 45%,rgba(16,18,22,.60)),url(../assets/revision/hero-arena-panorama-katalog.webp) right 43%/auto 210% no-repeat;pointer-events:none}.hub-intro>*{position:relative;max-width:850px}.eyebrow{font-size:10px;letter-spacing:.17em;font-weight:700;color:#b8bec7;margin-bottom:18px}.eyebrow em{font-style:normal;color:#ff5365}h1{font-size:clamp(34px,4.6vw,64px);line-height:1.04;font-weight:900}.hub-intro p:last-child{font-size:15px;line-height:1.7;color:#b8bec7;max-width:620px;margin-top:23px}
.hub-main{padding:45px 5% 72px;max-width:1600px;margin:auto}.section-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;gap:18px}.section-label h2{font-size:23px}.section-label span{font-size:11px;color:var(--muted)}.branch-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.branch-card{background:#fff;border:1px solid var(--line);border-radius:5px;overflow:hidden;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}.branch-card:hover{transform:translateY(-4px);box-shadow:0 16px 36px #10121612}.branch-art{height:230px;background:#e2e3e5;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}.branch-number{position:absolute;left:18px;top:17px;z-index:1;font-size:10px;font-weight:700;color:#fff;background:#181b20;padding:7px 9px;border-radius:2px}.branch-art>svg{width:142px;height:142px;color:#434b56}.branch-art .accent{stroke:var(--red)}.branch-art:after{content:"";position:absolute;right:18px;bottom:18px;width:27px;height:2px;background:var(--red)}.branch-copy{padding:25px 25px 23px;display:flex;flex-direction:column;flex:1}.branch-status{font-size:10px;letter-spacing:.05em;color:#747b85;margin-bottom:13px}.branch-status.ready{color:#434a54}.branch-copy h3{font-size:27px;line-height:1.13;min-height:61px}.branch-copy>p{font-size:13px;line-height:1.75;color:var(--muted);margin:15px 0 19px}.branch-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:22px}.branch-tags span{font-size:9px;padding:6px 8px;background:#f3f4f5;border-radius:2px;color:#676f79}.branch-action{margin-top:auto;border-top:1px solid #e7e9ec;padding-top:18px;display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:700}.branch-action strong{font-size:21px;color:var(--red)}
.hub-note{margin-top:25px;font-size:12px;color:#78808a;line-height:1.7}.shop-footer{background:#101216;color:#a6adb7;padding:28px 5%;display:flex;justify-content:space-between;gap:20px;font-size:11px;line-height:1.65}.shop-footer a{color:white}
.empty-main{padding:50px 5% 75px;max-width:1280px;margin:auto}.breadcrumb{font-size:11px;color:#777f89;margin-bottom:26px}.breadcrumb a{text-decoration:underline;text-underline-offset:3px}.empty-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:30px}.empty-heading h1{font-size:clamp(34px,4vw,53px);max-width:800px}.empty-heading .eyebrow{color:#777f89}.empty-heading>span{white-space:nowrap;border:1px solid #d4d9de;background:white;border-radius:3px;padding:9px 13px;font-size:11px;color:#687079}.empty-panel{background:white;border:1px solid var(--line);border-radius:5px;min-height:370px;display:grid;grid-template-columns:200px 1fr;gap:40px;padding:55px;align-items:center}.empty-visual{width:180px;height:180px;background:#eff1f3;border-radius:50%;display:grid;place-items:center}.empty-visual svg{width:108px;height:108px;color:#49515d}.empty-visual .accent{stroke:var(--red)}.empty-panel h2{font-size:28px;line-height:1.15}.empty-panel p{margin-top:17px;font-size:14px;line-height:1.8;max-width:640px;color:#707884}.empty-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}.button{display:inline-flex;align-items:center;justify-content:center;gap:20px;padding:14px 18px;border:1px solid #dce0e4;font-size:12px;font-weight:700;border-radius:3px}.button.primary{background:#14171c;color:white;border-color:#14171c}.button:hover{border-color:#ee001b}.button span{color:#ff3348}.empty-count{font-size:11px;margin-top:20px;color:#858c95}
@media(min-width:1600px){.hub-intro{padding-left:calc((100vw - 1440px)/2)}}
@media(max-width:1050px){.branch-grid{gap:15px}.branch-copy{padding:21px 18px}.branch-copy h3{font-size:24px}.branch-art{height:205px}.shop-hierarchy{gap:15px}.shop-branches a{padding:10px;font-size:10px}.empty-panel{padding:35px;gap:25px}}
@media(max-width:760px){.shop-header{padding:22px 6%}.shop-header img{width:145px}.shop-header>span{font-size:8px}.shop-hierarchy{padding:12px 6%;display:block}.shop-home-link{margin:0 0 10px;font-size:11px}.shop-branches{margin-right:-6vw;padding-bottom:4px}.shop-branches a{padding:10px 11px;font-size:10px}.hub-intro{padding:38px 6% 43px}.hub-intro p:last-child{font-size:13px}.hub-main{padding:30px 6% 45px}.branch-grid{grid-template-columns:1fr;gap:20px}.branch-art{height:240px}.branch-copy{padding:23px}.branch-copy h3{min-height:0;font-size:27px}.branch-copy>p{max-width:500px}.section-label h2{font-size:20px}.section-label span{font-size:10px}.shop-footer{padding:25px 6%;flex-direction:column;gap:8px}.empty-main{padding:32px 6% 45px}.empty-heading{align-items:flex-start;flex-direction:column;gap:18px}.empty-panel{display:block;padding:28px}.empty-visual{width:110px;height:110px;margin-bottom:25px}.empty-visual svg{width:73px;height:73px}.empty-panel h2{font-size:25px}.empty-panel p{font-size:13px}.empty-actions{flex-direction:column}.empty-actions a{text-align:center}.hub-intro:before{background-size:auto,auto 160%}}
@media(prefers-reduced-motion:reduce){.branch-card{transition:none}.branch-card:hover{transform:none}}

/* Einheitliche Kategorieflächen mit einem zusammenhängenden Motiv */
.branch-art{height:auto;aspect-ratio:3/2;min-height:0}.merch-scene{display:block;padding:0;background:#101216}.merch-scene img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;transform:none;mix-blend-mode:normal}.merch-scene:after{display:none}.merch-scene .branch-number{background:rgba(16,18,22,.88);border:1px solid rgba(255,255,255,.22)}

/* Katalog-Button direkt im Stadionmotiv */
.merch-scene .scene-cta{position:absolute;right:clamp(12px,2vw,20px);bottom:clamp(12px,2vw,20px);z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:13px;min-height:44px;padding:12px 17px;background:#ef0019;color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:3px;font-size:12px;font-weight:700;line-height:1.2;white-space:nowrap;box-shadow:0 5px 22px rgba(0,0,0,.45);transition:background .18s,box-shadow .18s}.scene-cta svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.8;fill:none}.merch-card:hover .scene-cta,.merch-card:focus-visible .scene-cta{background:#cb0015;box-shadow:0 7px 26px rgba(0,0,0,.55)}@media(prefers-reduced-motion:reduce){.merch-scene .scene-cta{transition:none}}
