/* B2radiovermarktung: approved index.html design, rebuilt without override chains.
   Sizes follow the reference. Accessible contrast, fluid text and navigation are intentional improvements. */
:root {
  color-scheme: light;
  --navy: #13263b;
  --ink: #1b2a3a;
  --muted: #637080;
  --gold: #8a602d;
  --gold-light: #c7a16c;
  --surface: #f6f7f7;
  --line: #e5e9ec;
  --signature: linear-gradient(90deg, #dd1d2b 0% 16.666%, #123b82 16.666% 33.333%, #cb0c82 33.333% 50%, #bea36d 50% 66.666%, #075586 66.666% 83.333%, #229688 83.333% 100%);
  font-family: Arial, Helvetica, sans-serif;
  color: var(--ink);
  background: #fff;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: 7rem;
}
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; }
img, svg { max-width: 100%; }
img { display: block; height: auto; }
a { color: inherit; text-decoration: none; text-underline-offset: 0.2em; }
a:hover { text-decoration: underline; }
button { font: inherit; color: inherit; cursor: pointer; }
button, a, summary { -webkit-tap-highlight-color: #c9a77855; touch-action: manipulation; }
p { line-height: 1.65; }
p, address, h1, h2, h3 { overflow-wrap: anywhere; }
h1, h2, h3 { font-weight: 700; }
:focus-visible { outline: 3px solid #076aa2; outline-offset: 5px; }
.hero :focus-visible, .media-panel :focus-visible, .site-footer :focus-visible { outline-color: #f7d5a1; }
[tabindex="-1"]:focus:not(:focus-visible) { outline: none; }
[hidden] { display: none; }
.container { width: 100%; max-width: 73.75rem; padding-inline: 1.75rem; margin-inline: auto; }
.section { padding-block: 5.1875rem; }
.section-tinted { background: var(--surface); }
.eyebrow { margin: 0; color: var(--gold); font-size: 0.6875rem; line-height: normal; font-weight: 700; letter-spacing: 0.1875rem; text-transform: uppercase; }
.eyebrow-six { font-size: 0.8125rem; line-height: 1.5; letter-spacing: 0.055em; }
.section-heading { display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; margin-bottom: 2rem; }
.section-heading h2 { font-size: clamp(1.8125rem, calc(3.2vw * var(--a11y-scale, 1)), 2.75rem); line-height: 1.13; letter-spacing: -0.075rem; margin: 0.625rem 0; }
#stations-title { margin-bottom: 0; }
.section-heading > p { color: var(--muted); max-width: 51.25rem; margin: 0; }
.signature { position: relative; }
.signature::after { content: ""; position: absolute; inset-inline: 0; bottom: 0; height: 9px; background: var(--signature); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.skip-link { position: fixed; left: 1rem; top: 1rem; transform: translateY(-200%); z-index: 100; padding: 0.75rem 1.25rem; background: var(--navy); color: #fff; border: 2px solid #fff; border-radius: 4px; font-weight: 700; }
.skip-link:focus { transform: translateY(0); }

/* One navigation tree. A usable, visible navigation remains when JavaScript is off.
   Under 75rem, collapse before the original tablet layout would overlap the hero. */
.site-header { border-bottom: 1px solid var(--line); background: #fff; position: relative; z-index: 20; }
.header-inner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1.125rem; min-height: 4.8125rem; padding-block: 1rem; }
.brand { display: flex; align-items: center; flex: 0 1 20.625rem; min-height: 2.75rem; min-width: 0; }
.brand img { width: 100%; }
.menu-toggle { display: none; align-items: center; justify-content: center; gap: 0.5rem; min-height: 2.75rem; padding: 0.625rem 0.8125rem; border: 1px solid #d8dfe7; border-radius: 0.375rem; background: #fff; font-size: 0.9375rem; line-height: 1.3; font-weight: 700; }
.menu-toggle svg { width: 0.875rem; height: 0.875rem; }
.menu-toggle:hover, .menu-toggle[aria-expanded="true"] { background: var(--surface); }
#site-nav { width: 100%; }
#site-nav ul { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; }
#site-nav a { display: flex; align-items: center; min-height: 2.75rem; font-size: 0.8125rem; font-weight: 700; }
:root:not([data-a11y-links]) #site-nav a:hover { color: var(--gold); text-decoration: none; }
.site-header.nav-enhanced { position: sticky; top: 0; }
.nav-enhanced .header-inner { flex-wrap: nowrap; }
.nav-enhanced .brand { max-width: calc(100% - 6.75rem); }
.nav-enhanced .menu-toggle { display: inline-flex; flex: 0 0 auto; }
.nav-enhanced #site-nav { position: absolute; inset-inline: 0; top: 100%; border-bottom: 1px solid var(--line); background: #fff; box-shadow: 0 16px 24px #13263b14; padding: 0.75rem 1.75rem 1rem; max-height: calc(100dvh - 5rem); overflow-y: auto; overscroll-behavior: contain; }
.nav-enhanced #site-nav ul { display: grid; gap: 0.125rem; }
.nav-enhanced #site-nav a { padding: 0.65rem 0.375rem; border-radius: 0.25rem; font-size: 1rem; }
.nav-enhanced .menu-toggle[aria-expanded="false"] ~ #site-nav { display: none; }

/* Original single-line desktop headline, uninterrupted navy field and one CTA. */
.hero { background: var(--navy); color: #fff; }
.hero-inner { display: flex; align-items: center; min-height: 28.4375rem; padding-block: 3rem; }
.hero-copy { width: 100%; min-width: 0; }
.hero-headline { margin: 0 0 1.75rem; font-size: clamp(2.875rem, calc(5.2vw * var(--a11y-scale, 1)), 4.75rem); font-weight: 800; letter-spacing: -0.16875rem; line-height: 1.06; }
.hero-headline em { color: #c9a778; font-style: normal; }
.hero-description { max-width: 49.375rem; color: #d3dce4; font-size: 1.0625rem; line-height: 1.65; margin: 1em 0; }
.hero-second-line { display: block; }
.button { display: inline-block; max-width: 100%; min-height: 3.125rem; padding: 1rem 1.4375rem; border-radius: 4px; font-size: 1rem; font-weight: 800; text-align: center; text-decoration: none; }
.button-light { background: #fff; color: var(--navy); }
.button-light:hover { background: #f0e5d5; text-decoration: none; }
.button-dark { background: var(--navy); color: #fff; }
.button-dark:hover { background: #24405e; }
.hero .button { margin-top: 1.25rem; }
.hero .button span[aria-hidden] { margin-left: 0.25rem; }
.about { background: #f6f8fa; color: #16253a; padding-block: clamp(3.5rem, 7vw, 6rem); }
.about-grid { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: clamp(1.875rem, 6vw, 5.5rem); align-items: start; }
.about h2 { margin: 1rem 0 1.5rem; font-size: clamp(1.8125rem, calc(3.2vw * var(--a11y-scale, 1)), 2.875rem); line-height: 1.12; letter-spacing: -0.035em; }
.prose { max-width: 66ch; }
.prose p { line-height: 1.8; margin: 0 0 1.1875rem; }
.prose p:last-child { margin-bottom: 0; }

/* Original portfolio art areas and small station labels; headings remain real text. */
.station-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.0625rem; }
.station { min-width: 0; border: 1px solid var(--line); border-radius: 7px; background: #fff; overflow: hidden; }
.station-logo { position: relative; display: grid; place-items: center; height: 10.875rem; padding: 1.875rem 2.625rem 0; border-bottom: 1px solid var(--line); }
.station-logo img { position: relative; top: -0.34375rem; object-fit: contain; max-width: 100%; width: 15.9375rem; height: 7.375rem; }
.station-red img { top: 0.0625rem; width: auto; height: 9.375rem; }
.station-blue img { width: 16.875rem; height: 8.5rem; }
.station-teal img { width: 16.875rem; height: 7.625rem; }
.station-label { position: absolute; top: 0.75rem; left: 0.875rem; margin: 0; padding: 0.25rem 0.4375rem; font-size: 0.75rem; line-height: 1.25; color: #172a43; background: #fff; }
.station-body { padding: 1.375rem; }
.station-body p { color: var(--muted); min-height: 4.125rem; }
.text-link { color: var(--navy); font-size: 1rem; font-weight: 800; }
/* Expand short link targets into existing whitespace, retaining reference baselines. */
.station-body .text-link, .person a { display: inline-block; padding-block: 0.25rem; margin-block: -0.25rem; min-height: 1.5rem; }

.offer-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.875rem; margin: 0; padding: 0; list-style: none; }
.offer { min-width: 0; padding: 1.625rem; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.offer-number { display: block; color: var(--gold); font-size: 0.75rem; font-weight: 700; }
.offer h3 { font-size: 1.1875rem; margin: 1.5rem 0 0.75rem; }
.offer p { color: var(--muted); }
.media-panel { display: flex; align-items: center; justify-content: space-between; gap: 1.875rem; background: var(--navy); color: #fff; border-radius: 7px; padding: 2.6875rem 2.6875rem calc(2.6875rem + 9px); overflow: hidden; }
.media-panel > div { min-width: 0; }
.media-panel .eyebrow { color: var(--gold-light); }
.media-panel h2 { font-size: 2rem; margin: 0.4375rem 0; }
.media-panel h2 + p { color: #cbd6e0; margin-bottom: 0; }
.media-panel .button { flex-shrink: 0; padding-inline: 1.375rem; }

.team-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.person { min-width: 0; padding: 1.4375rem; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.portrait { display: block; width: 5.9375rem; height: 5.9375rem; border-radius: 50%; object-fit: cover; object-position: center 30%; background: #f3f5f7; margin-bottom: 1.25rem; }
.portrait[src$="marie-poehlmann.webp"] { object-position: center 20%; }
.portrait[src$="sandra-kretzer.webp"] { object-position: center 25%; }
.vacancy-portrait { display: grid; place-items: center; }
.person h3 { font-size: 1.125rem; margin: 0 0 0.5rem; }
.person p { color: var(--muted); min-height: 2.4375rem; }
.person a { font-size: 1rem; font-weight: 700; overflow-wrap: anywhere; }

/* Native details: reference triangle, full-width touch and keyboard target. */
#faq-title { font-size: clamp(1.75rem, calc(3vw * var(--a11y-scale, 1)), 2.5rem); letter-spacing: -0.0625rem; margin: 0 0 1.5rem; }
.faq-item { border-bottom: 1px solid #d9e0e6; }
.faq-item summary { padding-block: 1.0625rem; font-weight: 700; cursor: pointer; }
.faq-item summary:hover { color: #155a83; }
.faq-item > div { padding-bottom: 1.0625rem; }
.faq-item p { color: var(--muted); max-width: 53.125rem; margin: 0 0 0.125rem; }

.contact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3.125rem; }
.contact-grid h2 { font-size: 2.5rem; letter-spacing: -0.0625rem; }
.contact-intro { color: var(--muted); }
.contact-second-line { display: block; }
.contact-panel { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding: 2.125rem; background: var(--surface); border-radius: 7px; line-height: 1.65; }
.contact-panel p { margin: 0; }
.contact-panel address { font-style: normal; }
.contact-link { display: block; margin-top: 1rem; overflow-wrap: anywhere; }
.contact-panel address + .contact-link { margin-top: 0.75rem; }
.site-footer { background: #101f2e; color: #d5dfe8; font-size: 0.75rem; padding-block: 1.125rem 1.8125rem; }
.footer-inner { display: flex; align-items: center; flex-wrap: wrap; gap: 0.75rem 1.75rem; }
.site-footer p { margin: 0; line-height: normal; }
.site-footer ul { display: flex; align-items: center; flex-wrap: wrap; gap: 1.375rem; list-style: none; margin: 0; padding: 0; }
.site-footer a { display: inline-block; padding-block: 0.3125rem; margin-block: -0.3125rem; min-height: 1.5rem; }
.site-footer [aria-current="page"] { text-decoration: underline; }

/* Legal documents keep the approved hero/card design with normal document scrolling. */
.legal-content { display: flow-root; background: #f3f6fa; }
.legal-container { max-width: 60rem; margin: 2.625rem auto 5rem; padding: 3rem clamp(1.5rem, 5vw, 4.125rem) 3.75rem; border: 1px solid #e2e8ef; border-radius: 1rem; background: #fff; box-shadow: 0 12px 40px #13263b0a; }
.legal-copy { color: #33465b; overflow-wrap: anywhere; }
.legal-copy h1 { color: var(--ink); font-size: clamp(1.875rem, calc(4vw * var(--a11y-scale, 1)), 2.6875rem); line-height: 1.18; letter-spacing: -0.035em; margin: 0 0 1.625rem; padding-bottom: 1.125rem; border-bottom: 1px solid #e2e8ef; }
.legal-copy h2 { color: var(--ink); font-size: clamp(1.1875rem, calc(2.2vw * var(--a11y-scale, 1)), 1.4375rem); line-height: 1.35; margin: 2.125rem 0 0.75rem; }
.legal-copy p { line-height: 1.75; margin: 0 0 1.0625rem; }
.legal-copy a { color: #185f9e; text-decoration: underline; }
.legal-copy ul { padding-inline-start: 1.5rem; line-height: 1.75; margin: 0 0 1.0625rem; }
.legal-copy li + li { margin-top: 0.5rem; }
.legal-copy code { overflow-wrap: anywhere; }
.legal-copy .editorial-note { background: #fff4df; border-left: 4px solid #95661c; padding: 1.25rem; color: #533d1a; margin-bottom: 2rem; }
.legal-bottom { position: relative; height: clamp(5.3125rem, 9vw, 7.8125rem); background: #15263d; }
.legal-bottom::after { content: ""; position: absolute; inset-inline: 0; bottom: 0; height: 6px; background: var(--signature); }
.error-page { min-height: 55vh; }
.error-page h1 { font-size: clamp(2.5rem, calc(6vw * var(--a11y-scale, 1)), 4.75rem); line-height: 1.1; }
.error-page p:not(.eyebrow) { max-width: 36rem; }

@media (min-width: 75rem) {
  .site-header:not(.nav-compact) .header-inner { min-height: 6.1875rem; padding-block: 0.75rem; }
  .site-header:not(.nav-compact) .brand { max-width: 21.5625rem; flex-basis: 21.5625rem; flex-shrink: 0; }
  .site-header:not(.nav-compact) .menu-toggle { display: none; }
  .site-header:not(.nav-compact) #site-nav, .site-header:not(.nav-compact) .menu-toggle[aria-expanded="false"] ~ #site-nav { display: block; position: static; width: auto; border: 0; box-shadow: none; padding: 0; max-height: none; overflow: visible; background: transparent; }
  .site-header:not(.nav-compact) #site-nav ul { display: flex; flex-wrap: wrap; align-items: center; gap: 0.875rem; }
  .site-header:not(.nav-compact) #site-nav a { padding: 0.5rem 0; font-size: 0.8125rem; white-space: nowrap; }
}
@media (min-width: 87.5rem) {
  .site-header:not(.nav-compact) .brand { max-width: 25.3125rem; flex-basis: 25.3125rem; }
}
@media (max-width: 65.625rem) {
  .hero-inner { min-height: 28.75rem; }
  .hero-headline { font-size: clamp(2.6875rem, calc(6.5vw * var(--a11y-scale, 1)), 4.375rem); }
  .hero-description { max-width: 32.5rem; }
  .about h2 { font-size: clamp(1.875rem, calc(3.4vw * var(--a11y-scale, 1)), 3.0625rem); }
  .hero-second-line { display: inline; }
}
@media (max-width: 53.125rem) {
  .station-grid, .offer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 47.5rem) {
  .about { padding-block: 3.4375rem; }
  .about-grid { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .prose p { line-height: 1.7; }
  .team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .media-panel { flex-wrap: wrap; }
}
@media (max-width: 40.625rem) {
  .signature::after { height: 7px; }
  .legal-container { width: calc(100% - 1.5rem); margin: 1rem auto 2.5rem; padding: 1.625rem 1.25rem 2.375rem; border-radius: 0.75rem; }
  .legal-copy { font-size: 0.9375rem; }
}
@media (max-width: 38.125rem) {
  .section { padding-block: 3.5rem; }
  .about { padding-block: 3.4375rem; }
  .hero-inner { min-height: 26.875rem; }
  .hero-headline { font-size: clamp(2.3125rem, calc(8vw * var(--a11y-scale, 1)), 3.375rem); letter-spacing: -0.10625rem; line-height: 1.08; }
  .station-grid, .offer-grid, .contact-grid { grid-template-columns: minmax(0, 1fr); }
  .station-logo { height: 10.625rem; }
  .media-panel { display: block; padding: 1.75rem 1.75rem calc(1.75rem + 7px); }
  .station-logo img { top: -0.21875rem; }
  .station-red img { top: 0.0625rem; }
  .media-panel .button { margin-top: 1.5625rem; }
  .person p { min-height: 0; }
  .site-footer { padding-block: 1rem 1.5625rem; }
  .footer-inner { gap: 0.5625rem 1.125rem; }
  .site-footer ul { gap: 1.25rem; }
}
@media (max-width: 30rem) {
  .team-grid { grid-template-columns: minmax(0, 1fr); }
  .eyebrow-six { font-size: 0.6875rem; letter-spacing: normal; }
  .station-label { top: 0.5625rem; left: 0.625rem; font-size: 0.6875rem; padding: 0.1875rem 0.375rem; }
}
@media (max-height: 31rem) and (max-width: 74.99rem) {
  .site-header.nav-enhanced { position: relative; }
}
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
  .button, .station { transition: background-color 160ms ease, box-shadow 160ms ease; }
  .station:hover { box-shadow: 0 8px 24px #13263b0d; }
}
@media (forced-colors: active) {
  .button, .menu-toggle, .station, .person, .offer, .contact-panel { border: 1px solid ButtonText; }
  .signature::after, .legal-bottom { display: none; }
  :focus-visible { outline-color: Highlight; }
}
@media print {
  .site-header, .site-footer, .skip-link, .hero .button, .legal-banner, .legal-bottom { display: none; }
  :root { color: #000; font-size: 10pt; }
  .container { width: 100%; max-width: none; }
  .section, .legal-container { padding-block: 1.5rem; }
  .hero, .media-panel, .section-tinted, .about, .legal-content { color: #000; background: #fff; }
  .hero-description, .hero-headline em, .media-panel h2 + p { color: #000; }
  .hero-inner { min-height: 0; }
  .legal-container { margin: 0; border: 0; box-shadow: none; }
  .signature::after { display: none; }
  .station, .person, .offer, .faq-item { break-inside: avoid; }
  a { text-decoration: underline; }
}