:root { --ink:#24172d; --muted:#594d65; --paper:#eadfeb; --surface:#f8f3fa; --line:#cbbbd5; --accent:#8c5ca8; --accent-dark:#613b79; --green:#38214c; --sky:#b9d4e2; --max-width:1180px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; padding-bottom:8.5rem; padding-top:2.1rem; color:var(--ink); background:linear-gradient(135deg,#d9e7eb 0%,var(--paper) 43%,#b58ab8 100%); background-attachment:fixed; font-family:Georgia,'Times New Roman',serif; line-height:1.6; }
a { color:inherit; }
a:focus-visible,button:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
.top-ticker { align-items:center; background:linear-gradient(90deg,#2b1b3b,var(--green),#5b3d72); color:#fff; display:flex; height:2.1rem; inset:0 0 auto; overflow:hidden; padding:0 4vw; position:fixed; z-index:20; }
.ticker-text { min-width:100%; overflow:hidden; text-align:center; text-overflow:ellipsis; white-space:nowrap; }
.ticker-text.is-scrolling { animation:ticker-scroll 12s linear infinite; display:inline-block; min-width:max-content; padding-left:100%; text-align:left; text-overflow:clip; }
@keyframes ticker-scroll { from { transform:translateX(0); } to { transform:translateX(-100%); } }
.site-header { align-items:center; background:var(--surface); border-bottom:1px solid var(--line); display:flex; justify-content:space-between; padding:1rem 5vw; position:relative; z-index:2; }
.brand { align-items:center; color:var(--green); display:flex; font-size:1.25rem; font-weight:bold; gap:.65rem; text-decoration:none; }
.brand img { height:2.4rem; width:auto; }
.hero { background:var(--surface); color:#fff; display:block; min-height:0; overflow:hidden; position:relative; width:100%; }
.hero picture,.hero picture img { display:block; height:auto; position:relative; width:100%; }
.hero img { object-fit:contain; }
.visually-hidden { height:1px; margin:-1px; overflow:hidden; position:absolute; width:1px; clip:rect(0 0 0 0); }
.hero-content { align-self:end; max-width:42rem; padding:3.5rem 7vw; position:relative; z-index:1; }
.eyebrow { color:var(--accent); font-size:.8rem; font-weight:bold; letter-spacing:.12em; margin:0 0 .55rem; text-transform:uppercase; }
.hero .eyebrow { color:var(--sky); }
h1,h2,h3 { line-height:1.1; margin:0; }
h1 { font-size:clamp(2.4rem,10vw,5.5rem); max-width:11ch; }
.hero-content>p:not(.eyebrow) { font-size:1.1rem; max-width:32rem; }
.button { background:var(--accent); color:#fff; display:inline-block; font-weight:bold; padding:.7rem 1rem; text-decoration:none; }
.button:hover { background:#a875bf; }
.section { margin:0 auto; max-width:var(--max-width); padding:5rem 5vw; }
.banner-stack { display:grid; gap:1rem; margin:0 auto; max-width:var(--max-width); padding:1rem 5vw 0; }
.banner-link { display:block; }
.banner-link img { display:block; width:100%; height:auto; }
.imprint-link { font-size:1rem; margin:1.5rem 5vw 2rem; text-align:right; }
.imprint-link a { color:var(--green); font-weight:bold; text-decoration:underline; text-underline-offset:.15em; }
.data-page { max-width:none; padding:0; width:100%; }
.data-page .data-visual { display:block; height:auto; width:100%; }
.data-home-link { margin:0; padding:1.5rem 5vw 2rem; text-align:center; }
.settings-page { max-width:64rem; padding:2rem 5vw 5rem; }
.settings-page h1 { color:var(--green); font-size:clamp(2rem,7vw,3.2rem); margin-bottom:1.5rem; }
.settings-page p { color:var(--muted); font-size:1.05rem; margin:0 0 1rem; }
.settings-page a { color:var(--accent-dark); }
.settings-page hr { border:0; border-top:1px solid var(--line); margin:1.5rem 0; }
.team-page { max-width:var(--max-width); }
.team-page h1 { color:var(--green); font-size:clamp(2rem,7vw,3.2rem); margin-bottom:2rem; }
.team-grid { display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr)); }
.team-card { aspect-ratio:1; background:var(--surface); border-top:4px solid var(--accent); display:grid; grid-template-rows:9fr 7fr; overflow:hidden; }
.team-card img { display:block; height:100%; object-fit:cover; width:100%; }
.team-card-body { display:flex; flex-direction:column; justify-content:center; padding:1rem 1.15rem; }
.team-card h2 { color:var(--green); font-size:clamp(1.25rem,2.5vw,1.7rem); margin:0 0 .35rem; }
.team-card p { color:var(--muted); font-size:.95rem; line-height:1.4; margin:0; }
.station-page { align-items:center; display:grid; gap:2rem; grid-template-columns:1fr; min-height:32rem; }
.station-logo { background:rgba(248,243,250,.72); border:1px solid var(--line); max-height:14rem; max-width:100%; object-fit:contain; padding:1rem; }
.station-page h1 { color:var(--green); max-width:none; }
.station-page p { color:var(--muted); font-size:1.1rem; max-width:42rem; }
.section-heading { margin-bottom:2rem; max-width:42rem; }
h2 { color:var(--green); font-size:clamp(2rem,6vw,3.4rem); }
.feature-grid { display:grid; gap:1rem; }
.feature { background:var(--surface); border-top:4px solid var(--accent); padding:1.5rem; }
.feature-number { color:var(--accent-dark); display:block; font-size:.85rem; font-weight:bold; margin-bottom:2rem; }
.feature h3 { color:var(--green); font-size:1.5rem; }
.feature p { color:var(--muted); margin-bottom:0; }
.feature-link { display:block; position:relative; text-decoration:none; }
.feature-link:hover { border-top-color:#a875bf; }
.feature-arrow { color:var(--accent-dark); display:block; font-size:1.6rem; margin-top:1rem; }
.gallery-section { max-width:none; }
.gallery { display:grid; gap:1rem; grid-template-columns:repeat(2,1fr); }
figure { margin:0; }
figure img { aspect-ratio:1/1; display:block; object-fit:cover; width:100%; }
figcaption { background:var(--surface); color:var(--green); font-size:.9rem; padding:.6rem .7rem; }
.site-footer { background:linear-gradient(90deg,#2b1b3b,var(--green),#5b3d72); bottom:0; color:#f8f3fa; display:grid; gap:.55rem; left:0; padding:.65rem 4vw; position:fixed; right:0; z-index:10; }
.player { align-items:center; display:flex; gap:.65rem; min-width:0; }
.player-button,.stream-option { background:var(--accent); border:0; color:#fff; cursor:pointer; font:inherit; font-weight:bold; }
.player-button { align-items:center; background:var(--accent); border:0; color:#fff; cursor:pointer; display:grid; font-size:1.35rem; font-weight:bold; justify-items:center; line-height:1; min-width:3rem; padding:.6rem .7rem; }
.player-button.is-loading { animation:player-pulse 1s ease-in-out infinite; cursor:wait; opacity:.82; }
.player-button:hover { background:#a875bf; }
.player-info { min-width:0; }
@keyframes player-pulse { 0% { transform:scale(.9); opacity:.5; } 50% { transform:scale(1.08); opacity:1; } 100% { transform:scale(.9); opacity:.5; } }
.player strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.vu-meter { display:grid; gap:.2rem; margin-top:.25rem; width:min(14rem,55vw); }
.vu-channel { align-items:center; display:flex; gap:.35rem; }
.vu-label { color:var(--sky); font-size:.65rem; font-weight:bold; width:.7rem; }
.vu-track { background:rgba(255,255,255,.25); display:block; height:.35rem; overflow:hidden; width:100%; }
.vu-track span { background:var(--sky); display:block; height:100%; transition:width .08s linear; width:2%; }
.vu-channel:last-child .vu-track span { background:#b58ab8; }
.stream-options { display:grid; gap:0; grid-template-columns:repeat(7,minmax(0,1fr)); margin:0 -4vw -.65rem; width:calc(100% + 8vw); }
.stream-option { aspect-ratio:1; background:transparent; border:1px solid rgba(255,255,255,.5); display:grid; min-width:0; overflow:hidden; padding:0; place-items:center; position:relative; }
.stream-option img { background:rgba(248,243,250,.88); display:block; height:100%; max-width:100%; object-fit:contain; padding:.15rem; width:100%; }
.stream-option:not(.is-selected) img { filter:brightness(.58) saturate(.7); opacity:.78; }
.stream-option:not(.is-selected):hover img { filter:none; opacity:1; }
.stream-option.is-selected,.stream-option:hover { background:#a875bf; border-color:#a875bf; }
.qr-option { align-content:center; line-height:1; }
.qr-option-image { aspect-ratio:1; background:#fff !important; filter:none !important; height:100% !important; max-width:100% !important; opacity:1 !important; padding:0 !important; width:100% !important; }
.qr-overlay[hidden] { display:none; }
.qr-overlay { align-items:center; background:rgba(25,14,34,.78); display:flex; inset:0; justify-content:center; padding:1rem; position:fixed; z-index:30; }
.qr-overlay-panel { background:var(--surface); color:var(--green); max-width:min(28rem,100%); padding:2.5rem 1.5rem 1.5rem; position:relative; text-align:center; width:100%; }
.qr-overlay-panel h2 { font-size:clamp(1.5rem,5vw,2.4rem); margin:0 0 1rem; }
.qr-overlay-close { background:transparent; border:0; color:var(--green); cursor:pointer; font-size:2rem; line-height:1; padding:.25rem .5rem; position:absolute; right:.5rem; top:.5rem; }
.qr-overlay-image { background:#fff; display:block; height:auto; margin:0 auto; max-width:100%; padding:.5rem; width:min(22rem,100%); }
.qr-overlay-caption { color:var(--muted); margin:1rem 0 0; }
.qr-overlay-open { overflow:hidden; } .hero-content{padding:5rem 8vw;} .feature-grid{grid-template-columns:repeat(3,1fr);} .gallery{grid-template-columns:repeat(3,1fr);} .site-footer{align-items:center;grid-template-columns:1.2fr 1fr;} .stream-options{grid-column:2;grid-row:1;} }
@media (min-width:800px) { .station-page { grid-template-columns:minmax(12rem,22rem) 1fr; } }
@media (min-width:1024px) { .site-header{padding-left:max(5vw,calc((100vw - var(--max-width))/2));padding-right:max(5vw,calc((100vw - var(--max-width))/2));} .hero-content{padding-left:max(7vw,calc((100vw - var(--max-width))/2));} .section{padding-bottom:7rem;padding-top:7rem;} .gallery{grid-template-columns:repeat(6,1fr);} .gallery figure:nth-child(2n){transform:translateY(2rem);} .site-footer{padding-left:max(5vw,calc((100vw - var(--max-width))/2));padding-right:max(5vw,calc((100vw - var(--max-width))/2));} }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto;} .ticker-text.is-scrolling{animation:none;min-width:100%;overflow:hidden;text-overflow:ellipsis;} }
@media (max-width:599px) {
	.hero { border:0; }
	.banner-stack { margin:0; max-width:none; padding:0; width:100vw; }
	.banner-link { width:100vw; margin-left:calc(50% - 50vw); }
	.banner-link img { display:block; width:100%; height:auto; }
	.data-page { padding:0; }
	.data-page .data-visual { margin-left:calc(50% - 50vw); width:100vw; }
	.site-footer { display:flex; flex-direction:column; align-items:stretch; gap:.5rem; padding:.55rem 0; }
	.player { width:100%; padding:0 4vw; }
	.player-info { flex:1; min-width:0; }
	.vu-meter { width:100%; max-width:none; }
	.stream-options { grid-template-columns:repeat(7,minmax(0,1fr)); margin:0; width:100%; }
	.stream-option { aspect-ratio:1 / 1; min-height:3rem; }
}