:root {
  --rk-red: #ef101b;
  --rk-red-strong: #d90815;
  --rk-red-dark: #a90d16;
  --rk-coral: #ff6f75;
  --rk-gold: #fdba21;
  --rk-pink: #ffd9dc;
  --rk-pink-soft: #fff2f3;
  --rk-pink-faint: #fff8f8;
  --rk-ink: #181315;
  --rk-text: #2c2527;
  --rk-muted: #786d70;
  --rk-line: rgba(31, 21, 24, 0.10);
  --rk-white: #ffffff;
  --rk-shadow-soft: 0 24px 70px rgba(112, 22, 29, 0.12);
  --rk-shadow-card: 0 18px 48px rgba(62, 23, 28, 0.10);
  --rk-wrap: 1200px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: #fff; }
body {
  margin: 0;
  min-width: 320px;
  padding-bottom: 118px !important;
  color: var(--rk-ink);
  background: #fff;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, Helvetica, sans-serif;
  line-height: 1.6;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
body::before {
  content: "";
  position: fixed;
  inset: 0 0 auto;
  z-index: 1000001;
  height: 2px;
  background: linear-gradient(90deg, #171315 0 41%, var(--rk-gold) 41% 46%, #171315 46% 100%);
  pointer-events: none;
}
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button, input, textarea, select { font: inherit; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 {
  color: var(--rk-ink);
  font-weight: 900;
  line-height: 1.03;
  letter-spacing: -0.045em;
  text-wrap: balance;
}
h1 { margin-bottom: 23px; font-size: clamp(3.35rem, 6.1vw, 5.7rem); letter-spacing: -0.058em; }
h2 { margin-bottom: 22px; font-size: clamp(2.25rem, 4.2vw, 3.55rem); }
h3 { margin-bottom: 11px; font-size: 1.45rem; }
p { color: var(--rk-text); }
.wrap { width: min(calc(100% - 48px), var(--rk-wrap)); margin-inline: auto; }
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.skip-link {
  position: fixed; top: 12px; left: 12px; z-index: 1000002;
  padding: 10px 14px; border-radius: 10px; color: #fff; background: var(--rk-ink);
  font-weight: 900; transform: translateY(-180%); transition: transform 180ms ease;
}
.skip-link:focus { transform: translateY(0); }
:focus-visible { outline: 3px solid rgba(239,16,27,.34); outline-offset: 4px; }

/* =========================================================
   HEADER – wie die echte Radio-Köllefornia-Startseite
   ========================================================= */
.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  border-bottom: 1px solid rgba(31, 21, 24, 0.055);
  background: rgba(255,255,255,.96);
  box-shadow: 0 8px 28px rgba(60,20,24,.035);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.header-inner {
  min-height: 88px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}
.brand { display: inline-flex; align-items: center; text-decoration: none; flex: 0 0 auto; }
.site-logo { width: 270px; height: auto; max-height: 78px; object-fit: contain; object-position: left center; }
.top-nav { display: flex; align-items: center; gap: 28px; }
.top-nav a {
  position: relative; color: #51484b; font-size: 16px; font-weight: 500; text-decoration: none;
  transition: color 180ms ease;
}
.top-nav a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -11px; height: 2px;
  border-radius: 999px; background: var(--rk-red); transform: scaleX(0); transform-origin: left;
  transition: transform 180ms ease;
}
.top-nav a:hover { color: var(--rk-red-strong); }
.top-nav a:hover::after, .top-nav a:focus-visible::after { transform: scaleX(1); }

/* =========================================================
   HERO – echte Homepage-Sprache: Skyline, Ringe, Herzen
   ========================================================= */
.hero {
  position: relative;
  min-height: 700px;
  display: flex;
  align-items: center;
  overflow: hidden;
  isolation: isolate;
  background: linear-gradient(180deg, #ffffff 0%, #fffafa 28%, #ffecee 68%, #ffd3d6 100%);
}
.hero::before {
  content: ""; position: absolute; z-index: 0; width: 720px; height: 720px;
  top: -370px; right: -160px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,111,117,.30), rgba(255,111,117,.06) 48%, transparent 70%);
  filter: blur(6px); pointer-events: none;
}
.hero-glow { position: absolute; z-index: 0; border-radius: 50%; pointer-events: none; }
.hero-glow-one {
  width: 330px; height: 330px; top: 49%; left: 65%; border: 2px solid rgba(239,16,27,.06);
  box-shadow: 0 0 0 90px rgba(239,16,27,.032), 0 0 0 180px rgba(239,16,27,.021);
  transform: translate(-50%,-50%);
}
.hero-glow-two {
  width: 680px; height: 420px; left: -180px; bottom: -180px;
  background: radial-gradient(circle, rgba(239,16,27,.28), rgba(239,16,27,.06) 52%, transparent 72%);
  filter: blur(8px);
}
.rk-home-silhouette { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.rk-home-silhouette::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.70) 0%, rgba(255,255,255,.27) 35%, rgba(255,255,255,0) 65%);
}
.rk-home-silhouette img {
  position: absolute; inset: 0; width: 100%; height: 100%; max-width: none;
  object-fit: cover; object-position: center bottom; opacity: .58; mix-blend-mode: multiply;
  filter: saturate(.95) contrast(.98); user-select: none;
}
.rk-heart-layer { position: absolute; inset: 0; z-index: 1; overflow: hidden; pointer-events: none; }
.rk-floating-heart {
  --rk-heart-size: 24px; position: absolute; left: var(--rk-x); bottom: -70px;
  width: var(--rk-heart-size); height: var(--rk-heart-size); opacity: 0;
  animation: rkHeartFloat var(--rk-duration) linear infinite; animation-delay: var(--rk-delay);
}
.rk-floating-heart::before {
  content: "♥"; display: block; color: rgba(239,16,27,var(--rk-opacity));
  font: 900 var(--rk-heart-size)/1 Arial,sans-serif; filter: blur(var(--rk-blur));
  text-shadow: 0 0 22px rgba(239,16,27,.10);
}
.rk-heart-1 { --rk-x:7%; --rk-heart-size:24px; --rk-duration:20s; --rk-delay:-7s; --rk-opacity:.16; --rk-blur:.5px; }
.rk-heart-2 { --rk-x:18%; --rk-heart-size:42px; --rk-duration:25s; --rk-delay:-16s; --rk-opacity:.13; --rk-blur:1.2px; }
.rk-heart-3 { --rk-x:44%; --rk-heart-size:18px; --rk-duration:18s; --rk-delay:-4s; --rk-opacity:.14; --rk-blur:0; }
.rk-heart-4 { --rk-x:69%; --rk-heart-size:30px; --rk-duration:24s; --rk-delay:-12s; --rk-opacity:.12; --rk-blur:1px; }
.rk-heart-5 { --rk-x:85%; --rk-heart-size:50px; --rk-duration:28s; --rk-delay:-19s; --rk-opacity:.10; --rk-blur:1.5px; }
.rk-heart-6 { --rk-x:94%; --rk-heart-size:20px; --rk-duration:19s; --rk-delay:-9s; --rk-opacity:.15; --rk-blur:.6px; }
.rk-spark {
  position: absolute; left: var(--rk-x); bottom: -20px; width: 5px; height: 5px;
  border-radius: 50%; background: rgba(239,16,27,.26); box-shadow: 0 0 18px rgba(239,16,27,.18);
  opacity: 0; animation: rkSparkFloat var(--rk-duration) linear infinite; animation-delay: var(--rk-delay);
}
.rk-spark-1 { --rk-x:12%; --rk-duration:13s; --rk-delay:-3s; }
.rk-spark-2 { --rk-x:37%; --rk-duration:16s; --rk-delay:-10s; }
.rk-spark-3 { --rk-x:66%; --rk-duration:15s; --rk-delay:-5s; }
.rk-spark-4 { --rk-x:91%; --rk-duration:18s; --rk-delay:-13s; }
@keyframes rkHeartFloat {
  0% { transform: translate3d(0,0,0) rotate(-10deg) scale(.78); opacity: 0; }
  12% { opacity: 1; }
  50% { transform: translate3d(24px,-350px,0) rotate(8deg) scale(1); opacity: .8; }
  100% { transform: translate3d(-18px,-790px,0) rotate(18deg) scale(1.10); opacity: 0; }
}
@keyframes rkSparkFloat {
  0% { transform: translate3d(0,0,0) scale(.7); opacity: 0; }
  16% { opacity: .65; }
  100% { transform: translate3d(14px,-730px,0) scale(1.15); opacity: 0; }
}
.hero-grid {
  position: relative; z-index: 2; width: min(1280px, calc(100% - 48px)); margin: 0 auto;
  padding: 76px 0 144px; display: grid;
  grid-template-columns: minmax(0,1.08fr) minmax(420px,.92fr); gap: clamp(42px,5vw,70px); align-items: center;
}
.hero-copy { max-width: 690px; }
.eyebrow, .section-kicker {
  color: var(--rk-red-strong); font-size: 12px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase;
}
.eyebrow {
  width: fit-content; margin-bottom: 24px; padding: 10px 15px; border: 1px solid rgba(239,16,27,.18);
  border-radius: 999px; background: rgba(255,255,255,.76); box-shadow: 0 10px 28px rgba(123,25,31,.08);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
}
.hero h1 { max-width: 690px; margin-bottom: 22px; }
.hero-title-red { color: var(--rk-red); }
.hero-title-black { color: var(--rk-ink); }
.hero-lead { max-width: 690px; margin-bottom: 26px; color: var(--rk-text); font-size: clamp(17px,1.25vw,19px); line-height: 1.62; }
.hero-actions, .button-row, .final-actions { display: flex; flex-wrap: wrap; gap: 13px; align-items: center; }
.button {
  min-height: 56px; border: 0; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center;
  gap: 10px; padding: 15px 23px; font-weight: 900; text-decoration: none; cursor: pointer;
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease, border-color 180ms ease;
}
.button-primary { color:#fff; background: linear-gradient(135deg,var(--rk-red),var(--rk-red-strong)); box-shadow:0 16px 34px rgba(217,8,21,.24); }
.button-primary:hover { transform:translateY(-2px); background:linear-gradient(135deg,#ff2934,var(--rk-red-strong)); box-shadow:0 20px 40px rgba(217,8,21,.30); }
.button-ghost { color:var(--rk-ink); border:1px solid rgba(24,19,21,.14); background:rgba(255,255,255,.80); box-shadow:0 12px 28px rgba(85,23,29,.07); backdrop-filter:blur(10px); }
.button-ghost:hover { transform:translateY(-2px); border-color:rgba(239,16,27,.28); background:#fff; }
.feature-strip { list-style:none; display:flex; flex-wrap:wrap; gap:11px 21px; margin:22px 0 0; padding:0; color:var(--rk-muted); font-size:13px; }
.feature-strip li { display:inline-flex; align-items:center; gap:7px; }
.feature-strip li span { color:rgba(239,16,27,.48); font-size:8px; }

/* Hero on-air card */
.hero-visual { position:relative; min-width:0; }
.hero-visual::before {
  content:""; position:absolute; z-index:-1; width:360px; height:360px; top:-70px; right:-75px; border-radius:50%;
  background:radial-gradient(circle,rgba(239,16,27,.18),transparent 68%); filter:blur(4px);
}
.rk-hero-card {
  position:relative; overflow:hidden; padding:27px; border:1px solid rgba(255,255,255,.11); border-radius:30px; color:#fff;
  background:radial-gradient(circle at 92% 8%,rgba(239,16,27,.23),transparent 34%), linear-gradient(145deg,rgba(30,24,26,.98),rgba(15,12,13,.98));
  box-shadow:0 34px 80px rgba(54,16,20,.24);
}
.rk-hero-card::after {
  content:""; position:absolute; right:-54px; bottom:-84px; width:210px; height:210px; border:1px solid rgba(255,255,255,.055);
  border-radius:50%; box-shadow:0 0 0 34px rgba(255,255,255,.025),0 0 0 68px rgba(255,255,255,.018); pointer-events:none;
}
.rk-hero-card-topline { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:24px; }
.rk-hero-card-label { display:inline-flex; align-items:center; gap:10px; color:rgba(255,255,255,.86); font-size:12px; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }
.rk-live-dot { width:8px; height:8px; flex:0 0 8px; border-radius:50%; background:var(--rk-red); box-shadow:0 0 0 6px rgba(239,16,27,.10); animation:rkLivePulse 1.7s ease-in-out infinite; }
@keyframes rkLivePulse { 0%,100%{transform:scale(1);opacity:1} 50%{transform:scale(.78);opacity:.48} }
.rk-hero-card-status { padding:7px 10px; border:1px solid rgba(255,255,255,.10); border-radius:999px; color:#ffb5ba; background:rgba(239,16,27,.11); font-size:11px; font-weight:900; letter-spacing:.10em; text-transform:uppercase; }
.rk-hero-now { position:relative; z-index:1; display:flex; gap:20px; align-items:center; min-width:0; }
.rk-hero-cover-wrap { position:relative; width:96px; height:96px; flex:0 0 96px; }
.rk-hero-cover-wrap::after { content:""; position:absolute; inset:-6px; z-index:-1; border-radius:27px; background:linear-gradient(135deg,rgba(239,16,27,.72),rgba(255,111,117,.10)); filter:blur(8px); opacity:.65; }
#rk-hero-cover { width:96px; height:96px; min-width:96px; min-height:96px; border-radius:22px; object-fit:cover; background:#2b2023; }
.rk-hero-now-text { min-width:0; flex:1; }
.rk-hero-now-small { margin-bottom:5px; color:#ff8b92; font-size:13px; font-weight:900; }
.rk-hero-now-title { display:-webkit-box; overflow:hidden; color:#fff; font-size:clamp(20px,1.7vw,25px); font-weight:900; line-height:1.14; letter-spacing:-.025em; overflow-wrap:anywhere; -webkit-box-orient:vertical; -webkit-line-clamp:3; }
.rk-hero-player-row { position:relative; z-index:1; display:flex; align-items:center; gap:18px; margin-top:28px; padding-top:24px; border-top:1px solid rgba(255,255,255,.08); }
.rk-hero-big-play { position:relative; width:82px; height:82px; flex:0 0 82px; border:0; border-radius:50%; background:linear-gradient(135deg,var(--rk-red),var(--rk-red-strong)); box-shadow:0 18px 42px rgba(217,8,21,.34); cursor:pointer; transition:transform 180ms ease,box-shadow 180ms ease; }
.rk-hero-big-play:hover { transform:scale(1.045); box-shadow:0 22px 48px rgba(217,8,21,.42); }
.rk-hero-big-play span { position:absolute; top:25px; left:34px; width:0; height:0; border-top:16px solid transparent; border-bottom:16px solid transparent; border-left:24px solid #fff; }
.rk-hero-big-play.is-playing span { display:none; }
.rk-hero-big-play.is-playing::before,.rk-hero-big-play.is-playing::after { content:""; position:absolute; top:25px; width:9px; height:32px; border-radius:3px; background:#fff; }
.rk-hero-big-play.is-playing::before { left:29px; } .rk-hero-big-play.is-playing::after { left:45px; }
.rk-hero-player-copy { display:flex; min-width:0; flex-direction:column; gap:4px; }
.rk-hero-player-copy strong { color:#fff; font-size:16px; font-weight:900; }
.rk-hero-player-copy span { color:rgba(255,255,255,.58); font-size:13px; line-height:1.4; }

/* =========================================================
   PLAYER-BEREICH AUF DER LANDINGPAGE
   ========================================================= */
.player-section { position:relative; z-index:4; background:#fff; padding:0 0 94px; }
.player-card {
  display:grid; grid-template-columns:minmax(0,1fr) minmax(390px,.9fr); gap:34px; align-items:center;
  margin-top:-42px; padding:34px; border:1px solid rgba(239,16,27,.10); border-radius:30px;
  background:rgba(255,255,255,.95); box-shadow:0 28px 70px rgba(78,20,26,.13); backdrop-filter:blur(14px);
}
.player-copy h2 { margin:8px 0 12px; font-size:clamp(2rem,3.3vw,3rem); }
.player-copy p:last-child { margin-bottom:0; }
.player-controls {
  position:relative; overflow:hidden; padding:25px; border-radius:24px; color:#fff;
  background:radial-gradient(circle at 90% 10%,rgba(239,16,27,.26),transparent 34%), linear-gradient(145deg,#251d20,#100d0e);
  box-shadow:0 18px 44px rgba(47,17,20,.20);
}
.player-status { display:flex; align-items:center; gap:10px; margin-bottom:20px; color:rgba(255,255,255,.82); font-size:14px; font-weight:800; }
.status-dot { width:8px; height:8px; border-radius:50%; background:var(--rk-red); box-shadow:0 0 0 6px rgba(239,16,27,.12); }
.player-controls.is-playing .status-dot { animation:rkLivePulse 1.7s ease-in-out infinite; }
.player-controls .button-ghost { color:#fff; border-color:rgba(255,255,255,.15); background:rgba(255,255,255,.08); box-shadow:none; }
.player-controls .button-ghost:disabled { opacity:.42; cursor:not-allowed; transform:none; }
.player-controls .button-primary:disabled { opacity:.55; cursor:not-allowed; transform:none; }
.player-note { margin:18px 0 0; color:rgba(255,255,255,.52); font-size:12px; }

/* =========================================================
   GEMEINSAME SEKTIONEN – Weiß/Rosa statt "alte Webradio-Seite"
   ========================================================= */
.content-section, .program-section, .final-cta { position:relative; overflow:hidden; }
.content-section { padding:96px 0; background:#fff; }
.content-section.section-dark { color:var(--rk-ink); background:linear-gradient(180deg,#fff7f7 0%,#fff 100%); }
.content-section.section-dark h2, .content-section.section-dark h3, .content-section.section-dark p { color:inherit; }
.content-section.section-dark .section-kicker { color:var(--rk-red-strong); }
.two-column { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:72px; align-items:center; }
.two-column.align-start { align-items:start; }
.section-kicker { display:block; margin-bottom:12px; }
.prose p { margin-bottom:16px; font-size:17px; line-height:1.7; }
.prose p:last-child { margin-bottom:0; }
.section-intro { max-width:930px; margin-bottom:40px; font-size:18px; line-height:1.7; }
.cards { display:grid; gap:20px; }
.music-cards { grid-template-columns:repeat(4,minmax(0,1fr)); }
.card {
  position:relative; min-height:250px; overflow:hidden; padding:28px; border:1px solid rgba(239,16,27,.09); border-radius:25px;
  background:linear-gradient(155deg,#fff 0%,#fff7f7 100%); box-shadow:var(--rk-shadow-card);
  transition:transform 180ms ease,box-shadow 180ms ease,border-color 180ms ease;
}
.card:nth-child(2) { background:linear-gradient(155deg,#fff5f6 0%,#ffe4e6 100%); }
.card:nth-child(4) { color:#fff; border-color:rgba(255,255,255,.08); background:radial-gradient(circle at 84% 12%,rgba(239,16,27,.26),transparent 35%),linear-gradient(145deg,#251d20,#100d0e); }
.card:nth-child(4) h3,.card:nth-child(4) p { color:#fff; }
.card:hover { transform:translateY(-5px); border-color:rgba(239,16,27,.18); box-shadow:0 24px 58px rgba(77,23,28,.14); }
.card-number { display:inline-grid; place-items:center; width:46px; height:46px; margin-bottom:34px; border-radius:15px; color:var(--rk-red); background:rgba(239,16,27,.08); font-size:13px; font-weight:900; }
.card:nth-child(4) .card-number { color:#fff; background:rgba(239,16,27,.24); }
.card p { margin:0; color:inherit; opacity:.78; font-size:15px; line-height:1.58; }
.check-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.check-grid > div { min-height:160px; padding:24px; border:1px solid rgba(239,16,27,.09); border-radius:22px; background:linear-gradient(155deg,#fff,#fff7f7); box-shadow:0 15px 38px rgba(64,22,27,.07); }
.check-grid > div:nth-child(2), .check-grid > div:nth-child(5) { background:#fff0f2; }
.check-grid strong { display:block; margin-bottom:7px; font-size:18px; font-weight:900; }
.check-grid span { display:block; color:var(--rk-muted); font-size:14px; line-height:1.55; }

/* Program */
.program-section { padding:0 0 96px; background:#fff; }
.program-card {
  position:relative; display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:50px; align-items:center;
  overflow:hidden; padding:46px; border-radius:30px; color:#fff;
  background:radial-gradient(circle at 88% 8%,rgba(239,16,27,.26),transparent 30%),linear-gradient(145deg,#282023 0%,#0f0c0d 100%);
  box-shadow:var(--rk-shadow-soft);
}
.program-card::before { content:"♥"; position:absolute; top:-64px; right:18px; color:rgba(239,16,27,.11); font:900 230px/1 Arial,sans-serif; transform:rotate(10deg); }
.program-card > * { position:relative; z-index:1; }
.program-card h2,.program-card p { color:#fff; }
.program-card .section-kicker { color:#ff9ca2; }
.program-time { margin:0; color:rgba(255,255,255,.70)!important; font-weight:800; }
.program-copy p { margin-bottom:18px; color:rgba(255,255,255,.82)!important; font-size:17px; line-height:1.65; }
.text-link { color:var(--rk-red-strong); font-weight:900; text-decoration:none; }
.program-card .text-link { color:#fff; }
.text-link:hover { text-decoration:underline; text-underline-offset:5px; }

/* Local */
.local-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,.8fr); gap:48px; align-items:center; }
.local-copy p { font-size:17px; line-height:1.68; }
.city-panel {
  position:relative; min-height:360px; overflow:hidden; border-radius:30px; display:flex; flex-direction:column; justify-content:flex-end;
  padding:34px; color:#fff; background:radial-gradient(circle at 80% 15%,rgba(239,16,27,.28),transparent 31%),linear-gradient(145deg,#282023,#100d0e);
  box-shadow:var(--rk-shadow-soft);
}
.city-panel::before { content:"♥"; position:absolute; right:-14px; top:-40px; color:rgba(239,16,27,.13); font:900 190px/1 Arial,sans-serif; transform:rotate(8deg); }
.city-word { position:relative; z-index:2; margin-bottom:24px; color:#fff; font-size:clamp(54px,7vw,92px); font-weight:900; letter-spacing:-.07em; line-height:.9; }
.skyline { position:relative; z-index:2; height:100px; display:flex; align-items:flex-end; gap:8px; opacity:.9; }
.tower { display:block; width:12%; background:linear-gradient(180deg,#ff6f75,#ef101b); border-radius:3px 3px 0 0; }
.tower.small { height:36px; } .tower.low { height:28px; } .tower.medium { height:55px; }
.cathedral { position:relative; width:18%; height:84px; background:linear-gradient(180deg,#ff6f75,#ef101b); }
.cathedral::before { content:""; position:absolute; left:0; right:0; top:-34px; margin:auto; width:0; height:0; border-left:20px solid transparent; border-right:20px solid transparent; border-bottom:35px solid #ff6f75; }

/* Empfang */
.receive-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-top:38px; }
.receive-item {
  min-height:185px; padding:26px; border:1px solid rgba(36,23,27,.09); border-radius:24px; display:flex; flex-direction:column; justify-content:flex-end;
  background:rgba(255,255,255,.88); box-shadow:0 15px 38px rgba(64,22,27,.07);
}
.receive-item:nth-child(2), .receive-item:nth-child(5) { background:#fff0f2; }
.receive-item strong { margin-bottom:8px; color:var(--rk-ink); font-size:22px; font-weight:900; }
.receive-item span { color:var(--rk-muted); font-size:14px; line-height:1.55; }
.receive-dab { color:#fff; background:radial-gradient(circle at 82% 18%,rgba(239,16,27,.25),transparent 29%),linear-gradient(145deg,#282023,#100d0e)!important; }
.receive-dab strong,.receive-dab span { color:#fff; }
.receive-dab span { opacity:.72; }

/* Final CTA */
.final-cta { color:#fff; text-align:left; background:radial-gradient(circle at 75% 15%,rgba(255,255,255,.16),transparent 27%),linear-gradient(135deg,#ff4d57 0%,var(--rk-red) 43%,var(--rk-red-dark) 100%); }
.final-cta::before { content:""; position:absolute; width:420px; height:420px; top:50%; right:8%; border:1px solid rgba(255,255,255,.12); border-radius:50%; transform:translateY(-50%); box-shadow:0 0 0 70px rgba(255,255,255,.055),0 0 0 140px rgba(255,255,255,.032),0 0 0 210px rgba(255,255,255,.018); }
.final-cta-inner { position:relative; z-index:1; display:flex; justify-content:space-between; gap:48px; align-items:center; padding:88px 0; }
.final-cta h2,.final-cta p { color:#fff; }
.final-cta .section-kicker { color:rgba(255,255,255,.76); }
.final-cta h2 { margin-bottom:13px; font-size:clamp(42px,5vw,70px); }
.final-cta p { margin:0; color:rgba(255,255,255,.88); font-size:18px; }
.final-actions { flex-direction:column; align-items:flex-start; flex:0 0 auto; }
.final-cta .button-primary { color:var(--rk-red-strong); background:#fff; box-shadow:0 18px 38px rgba(84,0,7,.20); }
.final-cta .button-primary:hover { color:var(--rk-red-strong); background:#fff4f5; }
.final-cta .text-link { color:#fff; }

/* Footer */
.site-footer { padding:38px 0 42px; border-top:1px solid rgba(31,21,24,.08); background:#fff; }
.footer-inner { display:grid; grid-template-columns:auto 1fr; gap:18px 40px; align-items:center; }
.footer-inner > div:first-child { display:flex; flex-direction:column; }
.footer-inner strong { font-weight:900; }
.footer-inner span { color:var(--rk-red-strong); font-size:13px; font-weight:800; }
.footer-links { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:18px; }
.footer-links a { color:var(--rk-text); font-size:14px; font-weight:800; text-decoration:none; }
.footer-inner p { grid-column:1/-1; margin:5px 0 0; color:var(--rk-muted); font-size:12px; }

/* =========================================================
   STICKY PLAYER – Code/Stil der echten Homepage
   ========================================================= */
#rk-player-wrap {
  position: fixed !important; left:0 !important; right:0 !important; bottom:18px !important; top:auto !important;
  z-index:999999 !important; display:flex !important; justify-content:center !important; pointer-events:none !important;
  padding:0 18px !important; width:100% !important; max-width:100% !important; box-sizing:border-box !important;
  transform:none !important; -webkit-transform:none !important; contain:none !important;
}
#rk-player {
  width:min(860px,100%) !important; max-width:100% !important; min-height:78px !important;
  background:rgba(17,17,17,.96); color:#fff; border-radius:22px; box-shadow:0 18px 46px rgba(0,0,0,.34);
  display:flex; align-items:center; justify-content:space-between; gap:18px; padding:14px 18px; pointer-events:auto;
  border:1px solid rgba(255,255,255,.10); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  box-sizing:border-box !important; opacity:1 !important; visibility:visible !important;
}
.rk-player-left { display:flex; align-items:center; gap:14px; min-width:0; flex:1; }
#rk-cover { width:62px; height:62px; min-width:62px; min-height:62px; flex:0 0 62px; border-radius:16px; object-fit:cover; background:#d71920; }
.rk-player-meta { min-width:0; overflow:hidden; }
.rk-player-label { color:#fdba21; font-size:12px; font-weight:900; text-transform:uppercase; letter-spacing:.12em; margin-bottom:3px; }
#rk-nowplaying { font-size:17px; font-weight:900; line-height:1.2; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rk-player-show { flex:0 0 auto; max-width:210px; padding:8px 16px; border-left:1px solid rgba(255,255,255,.12); }
.rk-player-show[hidden] { display:none; }
.rk-player-show-label { display:inline-flex; align-items:center; gap:7px; color:#fdba21; font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.12em; margin-bottom:3px; }
.rk-player-show-dot { width:7px; height:7px; border-radius:50%; background:#fdba21; animation:rkShowPulse 1.6s ease-in-out infinite; }
@keyframes rkShowPulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.45;transform:scale(.8)} }
.rk-player-show-name { color:#fff; font-size:15px; font-weight:900; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rk-player-show-host { color:rgba(255,255,255,.65); font-size:12px; font-weight:700; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rk-player-controls { display:flex; align-items:center; gap:14px; flex:0 0 auto; }
.rk-volume-control { display:flex; align-items:center; gap:10px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.10); border-radius:16px; padding:10px 12px; min-width:156px; }
.rk-volume-icon { color:#fdba21; font-size:11px; font-weight:950; text-transform:uppercase; letter-spacing:.10em; line-height:1; }
#rk-volume-slider { width:96px; height:5px; appearance:none; -webkit-appearance:none; background:rgba(255,255,255,.20); border-radius:999px; outline:none; cursor:pointer; }
#rk-volume-slider::-webkit-slider-runnable-track { height:5px; background:linear-gradient(90deg,#d71920,#fdba21); border-radius:999px; }
#rk-volume-slider::-webkit-slider-thumb { appearance:none; -webkit-appearance:none; width:15px; height:15px; margin-top:-5px; border-radius:50%; background:#fff; border:3px solid #d71920; box-shadow:0 4px 12px rgba(0,0,0,.35); }
#rk-volume-slider::-moz-range-track { height:5px; background:linear-gradient(90deg,#d71920,#fdba21); border-radius:999px; }
#rk-volume-slider::-moz-range-thumb { width:15px; height:15px; border-radius:50%; background:#fff; border:3px solid #d71920; box-shadow:0 4px 12px rgba(0,0,0,.35); }
#rk-play-button { width:68px; height:68px; border-radius:50%; border:none; background:#d71920; cursor:pointer; position:relative; box-shadow:0 12px 30px rgba(215,25,32,.42); transition:transform .18s ease,background .18s ease; flex:0 0 68px; }
#rk-play-button:hover { background:#9f1118; transform:scale(1.05); }
#rk-play-button span { position:absolute; left:28px; top:22px; width:0; height:0; border-top:12px solid transparent; border-bottom:12px solid transparent; border-left:19px solid #fff; }
#rk-play-button.is-playing span { display:none; }
#rk-play-button.is-playing::before,#rk-play-button.is-playing::after { content:""; position:absolute; top:21px; width:8px; height:27px; background:#fff; border-radius:3px; }
#rk-play-button.is-playing::before { left:25px; } #rk-play-button.is-playing::after { left:38px; }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1120px) {
  .hero-grid { grid-template-columns:1fr; gap:42px; padding-top:70px; padding-bottom:122px; }
  .hero-copy { max-width:780px; }
  .hero-visual { width:min(650px,100%); }
  .hero-glow-one { left:76%; }
  .music-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:900px) {
  .top-nav { gap:18px; }
  .site-logo { width:230px; }
  .player-card, .two-column, .program-card, .local-grid { grid-template-columns:1fr; }
  .two-column { gap:32px; }
  .program-card { gap:26px; }
  .receive-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .rk-player-show { display:none !important; }
}
@media (max-width:768px) {
  body { padding-bottom:106px !important; }
  .header-inner { min-height:74px; }
  .site-logo { width:190px; }
  .top-nav { gap:13px; }
  .top-nav a { font-size:13px; }
  .hero { min-height:auto; }
  .hero-grid { padding-top:58px; padding-bottom:102px; }
  .rk-home-silhouette img { object-position:62% bottom; opacity:.47; }
  .hero h1 { font-size:clamp(3.1rem,13vw,4.8rem); }
  .player-section { padding-bottom:72px; }
  .player-card { margin-top:-34px; padding:24px; border-radius:25px; }
  .content-section { padding:72px 0; }
  .check-grid, .music-cards, .receive-grid { grid-template-columns:1fr; }
  .program-section { padding-bottom:72px; }
  .program-card { padding:30px; border-radius:25px; }
  .final-cta-inner { flex-direction:column; align-items:flex-start; padding:72px 0; }
  .footer-inner { grid-template-columns:1fr; }
  .footer-links { justify-content:flex-start; }
  .footer-inner p { grid-column:auto; }
  #rk-player-wrap { bottom:14px !important; padding:0 12px !important; }
  #rk-player { min-height:78px !important; border-radius:22px; padding:11px 12px; gap:12px; }
  #rk-cover { width:54px; height:54px; min-width:54px; min-height:54px; flex:0 0 54px; border-radius:14px; }
  .rk-player-label { font-size:10px; }
  #rk-nowplaying { font-size:14px; max-width:190px; }
  .rk-volume-control { display:none !important; }
  #rk-play-button { width:58px; height:58px; flex:0 0 58px; }
  #rk-play-button span { left:24px; top:19px; border-top-width:10px; border-bottom-width:10px; border-left-width:16px; }
  #rk-play-button.is-playing::before,#rk-play-button.is-playing::after { top:18px; width:7px; height:23px; }
  #rk-play-button.is-playing::before { left:22px; } #rk-play-button.is-playing::after { left:34px; }
}
@media (max-width:620px) {
  .wrap, .hero-grid { width:min(100% - 34px,1200px); }
  .header-inner { min-height:68px; }
  .site-logo { width:165px; }
  .top-nav a:first-child { display:none; }
  .top-nav { gap:12px; }
  .hero-actions { flex-direction:column; align-items:stretch; }
  .hero-actions .button { width:100%; }
  .feature-strip { gap:9px 13px; }
  .rk-hero-card { padding:21px; border-radius:24px; }
  .rk-hero-now { align-items:flex-start; gap:15px; }
  .rk-hero-cover-wrap,#rk-hero-cover { width:78px; height:78px; min-width:78px; min-height:78px; }
  .rk-hero-cover-wrap { flex-basis:78px; }
  #rk-hero-cover { border-radius:17px; }
  .rk-hero-now-title { font-size:18px; -webkit-line-clamp:4; }
  .rk-hero-player-row { gap:14px; margin-top:22px; padding-top:20px; }
  .rk-hero-big-play { width:68px; height:68px; flex-basis:68px; }
  .rk-hero-big-play span { top:21px; left:28px; border-top-width:13px; border-bottom-width:13px; border-left-width:20px; }
  .rk-hero-big-play.is-playing::before,.rk-hero-big-play.is-playing::after { top:21px; width:8px; height:27px; }
  .rk-hero-big-play.is-playing::before { left:24px; } .rk-hero-big-play.is-playing::after { left:38px; }
  .city-panel { min-height:290px; }
}
@media (max-width:420px) {
  .site-logo { width:150px; }
  .top-nav a { font-size:12px; }
  #rk-nowplaying { max-width:155px; }
  .rk-hero-card-status { display:none; }
}
@media (max-width:360px) {
  #rk-nowplaying { max-width:130px; }
  #rk-player { padding:10px; }
  .rk-player-left { gap:10px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .rk-floating-heart,.rk-spark,.rk-live-dot,.rk-player-show-dot { animation:none !important; }
  .rk-floating-heart,.rk-spark { display:none; }
  *, *::before, *::after { transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; }
}

/* =========================================================
   NOW PLAYING IM LIVE-BEREICH
   ========================================================= */
.player-nowplaying {
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:20px;
  padding-bottom:20px;
  border-bottom:1px solid rgba(255,255,255,.10);
  min-width:0;
}
#rk-live-cover {
  width:70px;
  height:70px;
  min-width:70px;
  border-radius:17px;
  object-fit:cover;
  background:#2b2023;
  box-shadow:0 12px 28px rgba(0,0,0,.24);
}
.player-nowplaying-copy { min-width:0; display:flex; flex-direction:column; gap:4px; }
.player-nowplaying-copy span {
  color:#FDBA21;
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.player-nowplaying-copy strong {
  display:-webkit-box;
  overflow:hidden;
  color:#fff;
  font-size:18px;
  line-height:1.24;
  font-weight:900;
  letter-spacing:-.02em;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}

/* =========================================================
   DAB+ – bewusst stark, aber eindeutig noch IN PLANUNG
   ========================================================= */
.receive-dab {
  position:relative;
  isolation:isolate;
  min-height:225px;
  overflow:hidden;
  padding:28px;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(circle at 82% 18%,rgba(239,16,27,.58),transparent 31%),
    linear-gradient(145deg,#2a1d21 0%,#170f12 54%,#0d0a0b 100%) !important;
  box-shadow:0 24px 54px rgba(39,10,15,.24);
}
.receive-dab::before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:5px;
  background:linear-gradient(180deg,#ff626a,#ef101b,#a90d16);
}
.receive-dab::after {
  content:"DAB+";
  position:absolute;
  right:-12px;
  bottom:-20px;
  z-index:-1;
  color:rgba(255,255,255,.035);
  font-size:92px;
  line-height:1;
  font-weight:950;
  letter-spacing:-.08em;
}
.receive-dab .dab-status {
  position:relative;
  z-index:2;
  align-self:flex-start;
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:20px;
  padding:8px 12px;
  border:1px solid rgba(253,186,33,.30);
  border-radius:999px;
  color:#FDBA21;
  background:rgba(253,186,33,.09);
  font-size:11px;
  line-height:1;
  font-weight:950;
  letter-spacing:.12em;
  text-transform:uppercase;
  box-shadow:0 10px 30px rgba(0,0,0,.12);
}
.dab-status-dot {
  width:8px;
  height:8px;
  border-radius:50%;
  background:#FDBA21;
  box-shadow:0 0 0 5px rgba(253,186,33,.11);
  animation:rkDabPulse 1.8s ease-in-out infinite;
}
.receive-dab strong {
  position:relative;
  z-index:2;
  margin-bottom:10px;
  color:#fff;
  font-size:38px;
  line-height:1;
  letter-spacing:-.04em;
}
.receive-dab > span:not(.dab-status-dot) {
  position:relative;
  z-index:2;
  max-width:88%;
  color:rgba(255,255,255,.82);
  opacity:1;
}
.dab-rings {
  position:absolute;
  top:18px;
  right:12px;
  width:145px;
  height:145px;
  z-index:0;
  pointer-events:none;
  opacity:.48;
}
.dab-rings i {
  position:absolute;
  top:50%;
  left:50%;
  border:1px solid rgba(255,255,255,.16);
  border-radius:50%;
  transform:translate(-50%,-50%);
}
.dab-rings i:nth-child(1) { width:52px; height:52px; }
.dab-rings i:nth-child(2) { width:94px; height:94px; }
.dab-rings i:nth-child(3) { width:136px; height:136px; }
@keyframes rkDabPulse {
  0%,100% { opacity:1; transform:scale(1); }
  50% { opacity:.48; transform:scale(.78); }
}

/* =========================================================
   FOOTER + COOKIE-EINSTELLUNGEN
   ========================================================= */
.footer-cookie-link {
  appearance:none;
  padding:0;
  border:0;
  color:var(--rk-text);
  background:transparent;
  font:inherit;
  font-size:14px;
  font-weight:800;
  cursor:pointer;
}
.footer-links a:hover,
.footer-cookie-link:hover {
  color:var(--rk-red-strong);
  text-decoration:underline;
  text-underline-offset:4px;
}

.rk-cookie-banner[hidden] { display:none !important; }
.rk-cookie-banner {
  position:fixed;
  inset:0;
  z-index:1000001;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:24px;
  background:rgba(15,10,12,.36);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}
.rk-cookie-card {
  width:min(920px,100%);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:28px;
  align-items:center;
  padding:26px 28px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:26px;
  color:#fff;
  background:
    radial-gradient(circle at 88% 5%,rgba(239,16,27,.28),transparent 30%),
    rgba(18,14,15,.98);
  box-shadow:0 28px 80px rgba(0,0,0,.36);
}
.rk-cookie-copy { min-width:0; }
.rk-cookie-kicker {
  display:block;
  margin-bottom:7px;
  color:#FDBA21;
  font-size:11px;
  font-weight:950;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.rk-cookie-copy > strong {
  display:block;
  margin-bottom:8px;
  color:#fff;
  font-size:23px;
  line-height:1.1;
  font-weight:950;
}
.rk-cookie-copy p {
  max-width:620px;
  margin:0;
  color:rgba(255,255,255,.75);
  font-size:14px;
  line-height:1.55;
}
.rk-cookie-copy a { color:#fff; font-weight:850; text-underline-offset:3px; }
.rk-cookie-actions { display:flex; gap:10px; align-items:center; }
.rk-cookie-button {
  min-height:48px;
  padding:0 18px;
  border-radius:999px;
  font-size:13px;
  font-weight:900;
  cursor:pointer;
  transition:transform 160ms ease,background 160ms ease,border-color 160ms ease;
}
.rk-cookie-button:hover { transform:translateY(-2px); }
.rk-cookie-necessary {
  border:1px solid rgba(255,255,255,.16);
  color:#fff;
  background:rgba(255,255,255,.08);
}
.rk-cookie-accept {
  border:1px solid var(--rk-red);
  color:#fff;
  background:linear-gradient(135deg,var(--rk-red),var(--rk-red-strong));
  box-shadow:0 12px 30px rgba(217,8,21,.28);
}

@media (max-width:760px) {
  .player-nowplaying { align-items:flex-start; }
  #rk-live-cover { width:60px; height:60px; min-width:60px; border-radius:15px; }
  .player-nowplaying-copy strong { font-size:16px; }
  .receive-dab > span:not(.dab-status-dot) { max-width:100%; }
  .dab-rings { right:-28px; opacity:.34; }
  .rk-cookie-banner { padding:12px; }
  .rk-cookie-card { grid-template-columns:1fr; gap:20px; padding:22px; border-radius:22px; }
  .rk-cookie-actions { display:grid; grid-template-columns:1fr; }
  .rk-cookie-button { width:100%; }
}

@media (prefers-reduced-motion:reduce) {
  .dab-status-dot { animation:none !important; }
}