/* BRAKE.FM — editorial desktop layout v426
   Loaded after the compiled application stylesheet.
   The accepted mobile layout through 820px remains unchanged. */

/* Hero image: static, crisp and crop-safe. */
.hero-visual > img {
  object-position: 50% 50%;
  filter: saturate(1.04) brightness(.84) contrast(1.07);
  transform: none;
  animation: none;
  will-change: auto;
}

.hero-visual-shade {
  background:
    linear-gradient(90deg, rgba(2, 6, 11, .88) 0%, rgba(2, 6, 11, .72) 25%, rgba(2, 6, 11, .32) 50%, rgba(2, 6, 11, .08) 78%, rgba(2, 6, 11, .18) 100%),
    linear-gradient(180deg, rgba(2, 6, 11, .03) 0%, rgba(2, 6, 11, .08) 55%, rgba(2, 6, 11, .78) 100%);
}

@media (max-width: 820px) {
  .hero-visual > img {
    object-position: 64% 50%;
  }

  .hero-visual-shade {
    background:
      linear-gradient(180deg, rgba(2, 6, 11, .14) 0%, rgba(2, 6, 11, .25) 38%, rgba(2, 6, 11, .93) 80%),
      linear-gradient(90deg, rgba(2, 6, 11, .48), rgba(2, 6, 11, .08));
  }
}

@media (min-width: 821px) {
  :root {
    --desktop-shell: min(calc(100vw - 64px), 1540px);
    --section-gap: clamp(38px, 3vw, 54px);
    --card-gap: clamp(18px, 1.45vw, 24px);
    --surface-radius: 16px;
    --card-radius: 11px;
  }

  .content-width,
  .navigation-inner,
  .hero-inner,
  .footer-inner {
    width: var(--desktop-shell);
    max-width: none;
    margin-inline: auto;
  }

  .hero {
    min-height: clamp(680px, 44vw, 820px);
  }

  .hero-inner {
    min-height: calc(clamp(680px, 44vw, 820px) - var(--nav-height));
  }

  .hero-copy {
    width: min(760px, 55vw);
  }

  /* The editorial area no longer overlaps or sticks to the hero. */
  .home-dashboard {
    width: var(--desktop-shell);
    margin-top: var(--section-gap);
    padding-bottom: 0;
  }

  .dashboard-top {
    display: grid;
    gap: var(--section-gap);
    align-items: start;
  }

  .dashboard-bottom {
    display: grid;
    gap: var(--section-gap);
    margin-top: var(--section-gap);
  }

  .panel,
  .research-panel,
  .police-section {
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .11);
    border-radius: var(--surface-radius);
    background: linear-gradient(180deg, rgba(8, 20, 31, .95), rgba(4, 11, 18, .98));
    box-shadow: 0 26px 70px rgba(0, 0, 0, .24);
  }

  .panel-heading,
  .section-heading {
    min-height: 60px;
    padding: 0 22px;
    border-bottom-color: rgba(255, 255, 255, .07);
    font-size: .72rem;
  }

  .panel-heading h2,
  .section-heading h2 {
    font-size: .78rem;
  }

  /* Audio: natural content height rather than a forced shared height. */
  .audio-card {
    width: 100%;
    min-height: 430px;
    height: auto;
    grid-template-columns: minmax(180px, 42%) minmax(0, 58%);
  }

  .audio-cover,
  .audio-cover img {
    width: 100%;
    height: 100%;
    min-height: 430px;
  }

  .audio-body {
    padding: clamp(24px, 2vw, 34px);
  }

  .audio-body h2 {
    font-size: clamp(2rem, 2vw, 2.65rem);
  }

  .audio-body p {
    max-width: 44rem;
    font-size: .86rem;
    line-height: 1.58;
  }

  /* Main news: three independent cards with internal space. */
  .news-strip {
    width: 100%;
    height: auto;
    min-height: 0;
    padding: var(--card-gap);
    gap: var(--card-gap);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    background: transparent;
  }

  .news-card {
    min-width: 0;
    height: auto;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: var(--card-radius);
    background: #07121b;
    box-shadow: 0 14px 34px rgba(0, 0, 0, .22);
  }

  .news-card > a,
  .news-card img {
    height: 100%;
  }

  .news-copy {
    left: 18px;
    right: 18px;
    bottom: 18px;
  }

  .news-copy h3 {
    margin-top: .48rem;
    font-size: clamp(1.08rem, 1.05vw, 1.48rem);
    line-height: 1.12;
  }

  .news-copy p {
    font-size: .74rem;
    line-height: 1.45;
  }

  /* Research: cards no longer touch and images keep a photographic ratio. */
  .research-cards {
    padding: var(--card-gap);
    gap: var(--card-gap);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    background: transparent;
  }

  .research-card {
    min-width: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: var(--card-radius);
    background: #07111a;
    box-shadow: 0 14px 34px rgba(0, 0, 0, .2);
  }

  .research-image {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
  }

  .research-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .research-card:nth-child(3) .research-image {
    background: #06101a;
  }

  .research-card:nth-child(3) .research-image img {
    object-fit: contain;
    object-position: center;
    transform: none;
  }

  .research-copy {
    min-height: 190px;
    padding: 22px 22px 24px;
  }

  .research-copy h3 {
    font-size: clamp(1.22rem, 1.22vw, 1.62rem);
    line-height: 1.15;
  }

  .research-copy p {
    font-size: .79rem;
    line-height: 1.52;
  }

  /* Police: vertical editorial cards instead of stretched horizontal bars. */
  .police-slider {
    padding: var(--card-gap);
    gap: var(--card-gap);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-flow: row;
    grid-auto-columns: auto;
    overflow: visible;
    scroll-snap-type: none;
  }

  .police-card {
    min-width: 0;
    border-radius: var(--card-radius);
  }

  .police-card:nth-child(n + 4) {
    display: none;
  }

  .police-card > a {
    display: flex;
    flex-direction: column;
    height: 100%;
  }

  .police-card__media {
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: 16 / 9;
  }

  .police-card__body {
    min-height: 205px;
    padding: 20px 21px 22px;
    gap: .72rem;
  }

  .police-card__body h3 {
    font-size: clamp(1.12rem, 1.12vw, 1.5rem);
    line-height: 1.17;
  }

  .police-card__body p {
    font-size: .78rem;
    line-height: 1.5;
  }

  .police-livebar {
    min-height: 54px;
    padding-inline: 20px;
  }

  /* Utility areas receive their own visual breathing room. */
  .contact-bar {
    margin-top: var(--section-gap);
    padding: 26px 28px;
    gap: 2rem;
    border-radius: var(--surface-radius);
    box-shadow: 0 24px 62px rgba(0, 0, 0, .22);
  }

  .contact-lead h2 {
    font-size: 1.3rem;
  }

  .contact-lead p {
    font-size: .78rem;
  }

  .contact-benefits b {
    font-size: .72rem;
  }

  .contact-benefits small {
    font-size: .61rem;
  }

  .install-strip {
    min-height: 84px;
    margin-top: 20px;
    padding: 17px 22px;
    border-radius: 12px;
  }

  .footer {
    margin-top: clamp(56px, 4vw, 76px);
  }
}

/* Medium desktop and tablets in landscape: one readable top column. */
@media (min-width: 821px) and (max-width: 1499px) {
  :root {
    --desktop-shell: calc(100vw - 40px);
    --section-gap: 34px;
    --card-gap: 18px;
  }

  .dashboard-top {
    grid-template-columns: minmax(0, 1fr);
  }

  .hero-copy {
    width: min(680px, 72vw);
  }

  .audio-card {
    grid-template-columns: minmax(230px, 37%) minmax(0, 63%);
  }

  .contact-bar {
    grid-template-columns: 1fr 1fr;
  }

  .whatsapp-button {
    grid-column: 1 / -1;
    justify-self: stretch;
    justify-content: center;
  }
}

/* Research cards need more room than a forced three-column grid at medium widths. */
@media (min-width: 821px) and (max-width: 1099px) {
  .research-cards {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (min-width: 1100px) and (max-width: 1499px) {
  .research-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .research-card:nth-child(3) {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(0, 1.28fr) minmax(320px, .72fr);
    grid-template-rows: auto;
  }

  .research-card:nth-child(3) .research-image {
    aspect-ratio: 16 / 9;
  }

  .research-card:nth-child(3) .research-copy {
    min-height: 0;
    justify-content: center;
  }
}

/* Wide desktop: balanced two-column opening, not full-screen stretched. */
@media (min-width: 1500px) {
  .dashboard-top {
    grid-template-columns: minmax(470px, 0.76fr) minmax(760px, 1.64fr);
    gap: 28px;
  }

  /* One lead story plus two compact stories. This avoids three narrow portrait cards. */
  .news-strip {
    height: 430px;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, .9fr);
    grid-template-rows: repeat(2, minmax(0, 1fr));
    align-items: stretch;
  }

  .news-card {
    height: auto;
    min-height: 0;
    aspect-ratio: auto;
  }

  .news-card:first-child {
    grid-row: 1 / -1;
  }

  .news-card:nth-child(2) .news-copy,
  .news-card:nth-child(3) .news-copy {
    left: 16px;
    right: 16px;
    bottom: 14px;
  }

  .news-card:nth-child(2) .news-copy h3,
  .news-card:nth-child(3) .news-copy h3 {
    font-size: clamp(1rem, .92vw, 1.24rem);
    line-height: 1.1;
  }

  .news-card:nth-child(2) .news-copy p,
  .news-card:nth-child(3) .news-copy p {
    display: none;
  }

  .news-card:first-child .news-copy h3 {
    font-size: clamp(1.45rem, 1.45vw, 2rem);
  }

  /* The graphic-heavy J. Müller card receives more width than the photo cards. */
  .research-cards {
    grid-template-columns: minmax(0, .92fr) minmax(0, .92fr) minmax(0, 1.24fr);
  }
}

@media (min-width: 1800px) {
  .audio-body {
    padding: 34px 36px 30px;
  }
}

@media (min-width: 821px) {
  .audio-body h2,
  .news-copy h3,
  .research-copy h3,
  .police-card__body h3 {
    hyphens: auto;
    overflow-wrap: break-word;
  }

  .audio-body h2 {
    text-wrap: balance;
  }
}

@media (min-width: 1500px) {
  .audio-card {
    grid-template-columns: minmax(170px, 36%) minmax(0, 64%);
  }

  .audio-body h2 {
    font-size: clamp(1.75rem, 1.65vw, 2.35rem);
    overflow-wrap: normal;
    word-break: normal;
  }
}

/* v414 — image-first cards and compact research copy
   Corrects the focal-point and whitespace problems marked in the review. */

@media (min-width: 821px) {
  /* News cards: imagery and text are separated. Text no longer covers the subject. */
  .news-card {
    aspect-ratio: auto;
    height: auto;
  }

  .news-card > a {
    position: relative;
    inset: auto;
    display: grid;
    grid-template-rows: minmax(190px, auto) auto;
    height: 100%;
    color: inherit;
    background: #07121b;
  }

  .news-card img {
    position: relative;
    grid-column: 1;
    grid-row: 1;
    width: 100%;
    height: auto;
    min-height: 190px;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    filter: saturate(.82) brightness(.78);
  }

  .news-card:hover img {
    transform: none;
    filter: saturate(.94) brightness(.82);
  }

  .news-shade {
    display: none;
  }

  .news-meta {
    grid-column: 1;
    grid-row: 1;
    z-index: 2;
  }

  .news-copy {
    position: static;
    grid-column: 1;
    grid-row: 2;
    padding: 18px 19px 20px;
    background: linear-gradient(180deg, #091722, #061019);
  }

  .news-copy h3 {
    margin-top: .5rem;
    margin-bottom: .45rem;
    font-size: clamp(1.08rem, 1.05vw, 1.46rem);
  }

  .news-copy p {
    display: -webkit-box;
    font-size: .76rem;
  }

  /* Individual focal points for the current photographs. */
  .news-card:first-child img {
    object-position: 50% 42%;
  }

  .news-card:nth-child(2) img {
    object-position: 59% 52%;
  }

  .news-card:nth-child(3) img {
    object-position: 48% 46%;
  }

  /* Research cards: CTA follows the description; no artificial empty trench. */
  .research-cards {
    align-items: start;
  }

  .research-card {
    align-self: start;
    grid-template-rows: auto auto;
  }

  .research-copy {
    min-height: 0;
    padding: 20px 20px 22px;
  }

  .research-copy b {
    margin-top: 16px;
    padding-top: 0;
  }

  /* The third source graphic repeats the complete headline and looks like an ad.
     Replace it visually with a calm editorial number panel. */
  .research-card:nth-child(3) .research-image {
    position: relative;
    overflow: hidden;
    background:
      radial-gradient(circle at 18% 78%, rgba(87, 195, 39, .14), transparent 34%),
      linear-gradient(145deg, #0a1b2a 0%, #07131f 54%, #06101a 100%);
  }

  .research-card:nth-child(3) .research-image img {
    display: none;
  }

  .research-card:nth-child(3) .research-image::before {
    content: "25";
    position: absolute;
    right: 8%;
    top: 50%;
    transform: translateY(-56%);
    color: rgba(255, 255, 255, .95);
    font-size: clamp(4.5rem, 6vw, 7.25rem);
    line-height: .8;
    font-weight: 950;
    letter-spacing: -.08em;
    text-shadow: 0 18px 38px rgba(0, 0, 0, .32);
  }

  .research-card:nth-child(3) .research-image::after {
    content: "BETTEN\A Vorschlag für Brake";
    white-space: pre;
    position: absolute;
    left: 8%;
    bottom: 15%;
    color: #dfffd0;
    font-size: .68rem;
    line-height: 1.65;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
  }
}

@media (min-width: 821px) and (max-width: 1099px) {
  .news-strip {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 1100px) and (max-width: 1499px) {
  .news-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
  }

  .news-card > a {
    grid-template-rows: minmax(210px, auto) auto;
  }
}

@media (min-width: 1500px) {
  /* Audio cover is no longer squeezed into a narrow portrait slot. */
  .audio-card {
    display: grid;
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .audio-cover,
  .audio-cover img {
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: 16 / 9;
  }

  .audio-cover img {
    object-fit: cover;
    object-position: 50% 56%;
  }

  .audio-body {
    padding: 26px 28px 28px;
  }

  /* Lead story with image above; compact stories with image beside text. */
  .news-strip {
    height: auto;
    min-height: 0;
    grid-template-columns: minmax(0, 1.25fr) minmax(340px, .92fr);
    grid-template-rows: repeat(2, minmax(0, 1fr));
  }

  .news-card:first-child {
    grid-row: 1 / -1;
  }

  .news-card:first-child > a {
    grid-template-rows: minmax(320px, 1fr) auto;
  }

  .news-card:first-child img {
    height: 100%;
  }

  .news-card:nth-child(2) > a,
  .news-card:nth-child(3) > a {
    grid-template-columns: minmax(150px, 43%) minmax(0, 57%);
    grid-template-rows: 1fr;
    min-height: 245px;
  }

  .news-card:nth-child(2) img,
  .news-card:nth-child(3) img {
    grid-column: 1;
    grid-row: 1;
    min-height: 245px;
    aspect-ratio: auto;
  }

  .news-card:nth-child(2) .news-shade,
  .news-card:nth-child(3) .news-shade {
    display: none;
  }

  .news-card:nth-child(2) .news-meta,
  .news-card:nth-child(3) .news-meta {
    left: 12px;
    right: auto;
    width: calc(43% - 24px);
  }

  .news-card:nth-child(2) .news-meta time,
  .news-card:nth-child(3) .news-meta time {
    display: none;
  }

  .news-card:nth-child(2) .news-copy,
  .news-card:nth-child(3) .news-copy {
    grid-column: 2;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 18px 20px;
  }

  .news-card:nth-child(2) .news-copy h3,
  .news-card:nth-child(3) .news-copy h3 {
    font-size: clamp(1.02rem, .93vw, 1.28rem);
    line-height: 1.14;
  }

  .news-card:nth-child(2) .news-copy p,
  .news-card:nth-child(3) .news-copy p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    font-size: .72rem;
  }

  /* Equal card widths again; the removed advertising graphic no longer needs priority. */
  .research-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* v415 — RADIO EDITORIAL DARK TEST
   A lighter, more open radio-led desktop direction.
   Existing content, order and mobile layout remain unchanged. */

@media (min-width: 821px) {
  :root {
    --desktop-shell: min(calc(100vw - 72px), 1440px);
    --section-gap: clamp(68px, 5vw, 92px);
    --card-gap: clamp(22px, 1.8vw, 30px);
    --radio-page: #171b1e;
    --radio-surface: #20262a;
    --radio-surface-2: #252c31;
    --radio-surface-3: #2a3237;
    --radio-line: rgba(255, 255, 255, .085);
    --radio-muted: #b9c2c7;
  }

  body {
    background: var(--radio-page);
    color: #f5f7f8;
  }

  .navigation {
    background: rgba(7, 11, 13, .9);
    border-bottom-color: rgba(255, 255, 255, .09);
    box-shadow: 0 8px 30px rgba(0, 0, 0, .16);
  }

  .navigation--scrolled {
    background: rgba(7, 11, 13, .97);
  }

  .home-dashboard {
    margin-top: 0;
    padding-top: clamp(72px, 5vw, 94px);
  }

  .dashboard-top,
  .dashboard-bottom {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--section-gap);
    margin-top: 0;
  }

  .dashboard-bottom {
    margin-top: var(--section-gap);
  }

  /* Main sections become open editorial groups rather than nested dashboards. */
  .panel,
  .research-panel {
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .panel-heading,
  .section-heading {
    min-height: 0;
    margin-bottom: 22px;
    padding: 0 2px 14px;
    border-bottom: 1px solid var(--radio-line);
    color: #dfffd0;
    font-size: .75rem;
  }

  .panel-heading h2,
  .section-heading h2 {
    font-size: .86rem;
    letter-spacing: .08em;
  }

  .panel-heading > a,
  .section-heading > a {
    font-size: .72rem;
  }

  /* Wide radio programme card. */
  .audio-card {
    min-height: 0;
    grid-template-columns: minmax(340px, 42%) minmax(0, 58%);
    overflow: hidden;
    border: 0;
    border-radius: 15px;
    background: var(--radio-surface-2);
    box-shadow: 0 22px 54px rgba(0, 0, 0, .18);
  }

  .audio-cover,
  .audio-cover img {
    min-height: 360px;
    height: 100%;
  }

  .audio-cover img {
    filter: saturate(.92) brightness(.9) contrast(1.03);
  }

  .audio-cover::after {
    background: linear-gradient(180deg, transparent 58%, rgba(10, 14, 16, .42));
  }

  .audio-body {
    justify-content: center;
    padding: clamp(34px, 3.4vw, 56px);
  }

  .audio-body h2 {
    max-width: 780px;
    margin-top: 1rem;
    font-size: clamp(2.25rem, 3vw, 3.45rem);
    line-height: 1.01;
  }

  .audio-body p {
    max-width: 700px;
    color: var(--radio-muted);
    font-size: .98rem;
    line-height: 1.66;
  }

  .audio-status {
    font-size: .66rem;
  }

  .waveform {
    max-width: 520px;
    margin-top: 1.3rem;
    border-bottom-color: rgba(255, 255, 255, .1);
  }

  .audio-pending,
  .audio-body .inline-link {
    font-size: .78rem;
  }

  /* News group: large lead plus two compact side stories. */
  .news-strip {
    height: auto;
    padding: 0;
    gap: var(--card-gap);
    grid-template-columns: minmax(0, 1.55fr) minmax(370px, .85fr);
    grid-template-rows: repeat(2, minmax(0, 1fr));
    background: transparent;
  }

  .news-card {
    border: 0;
    border-radius: 14px;
    background: var(--radio-surface-2);
    box-shadow: 0 18px 44px rgba(0, 0, 0, .15);
  }

  .news-card:first-child {
    grid-row: 1 / -1;
  }

  .news-card > a {
    background: var(--radio-surface-2);
  }

  .news-card:first-child > a {
    grid-template-rows: minmax(330px, auto) auto;
  }

  .news-card:first-child img {
    min-height: 330px;
  }

  .news-card:nth-child(2) > a,
  .news-card:nth-child(3) > a {
    grid-template-columns: 42% minmax(0, 58%);
    grid-template-rows: minmax(0, 1fr);
    min-height: 220px;
  }

  .news-card:nth-child(2) img,
  .news-card:nth-child(3) img {
    grid-column: 1;
    grid-row: 1;
    min-height: 220px;
    height: 100%;
    aspect-ratio: auto;
  }

  .news-card:nth-child(2) .news-meta,
  .news-card:nth-child(3) .news-meta {
    grid-column: 1;
    grid-row: 1;
  }

  .news-card:nth-child(2) .news-copy,
  .news-card:nth-child(3) .news-copy {
    grid-column: 2;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 22px 24px;
  }

  .news-card img {
    filter: saturate(.94) brightness(.91) contrast(1.02);
  }

  .news-card:hover img {
    filter: saturate(1) brightness(.95);
  }

  .news-copy {
    background: var(--radio-surface-2);
  }

  .news-copy h3 {
    font-size: clamp(1.3rem, 1.45vw, 1.82rem);
    line-height: 1.1;
  }

  .news-card:first-child .news-copy h3 {
    font-size: clamp(1.7rem, 2.1vw, 2.55rem);
  }

  .news-copy p {
    color: var(--radio-muted);
    font-size: .82rem;
    line-height: 1.54;
  }

  .news-card:nth-child(2) .news-copy p,
  .news-card:nth-child(3) .news-copy p {
    display: -webkit-box;
    -webkit-line-clamp: 3;
  }

  /* Research gets a lighter editorial band, but keeps the existing three stories. */
  .research-panel {
    padding: 30px;
    border-radius: 16px;
    background: var(--radio-surface);
  }

  .research-panel .panel-heading {
    margin-bottom: 26px;
  }

  .research-cards {
    padding: 0;
    gap: var(--card-gap);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    background: transparent;
  }

  .research-card {
    border: 0;
    border-radius: 13px;
    background: var(--radio-surface-3);
    box-shadow: 0 16px 38px rgba(0, 0, 0, .13);
  }

  .research-image img {
    filter: saturate(.94) brightness(.91) contrast(1.02);
  }

  .research-card:hover img {
    filter: saturate(1) brightness(.96);
  }

  .research-copy {
    padding: 22px 23px 24px;
  }

  .research-copy h3 {
    font-size: clamp(1.32rem, 1.45vw, 1.78rem);
  }

  .research-copy p {
    color: var(--radio-muted);
    font-size: .82rem;
    line-height: 1.56;
  }

  .research-copy b {
    margin-top: 18px;
    font-size: .73rem;
  }

  /* Police remains the deliberately darker news band. */
  .police-section {
    padding: 0 30px 30px;
    overflow: hidden;
    border: 0;
    border-radius: 16px;
    background: #101a22;
    box-shadow: 0 22px 52px rgba(0, 0, 0, .17);
  }

  .police-section .section-heading {
    margin-inline: -30px;
    margin-bottom: 26px;
    padding: 20px 30px 17px;
    background: rgba(44, 111, 169, .08);
  }

  .police-livebar {
    margin-inline: -30px;
    padding-inline: 30px;
    border-color: rgba(255, 255, 255, .08);
  }

  .police-slider {
    padding: 26px 0 0;
    gap: var(--card-gap);
  }

  .police-card {
    border-color: rgba(117, 177, 225, .13);
    background: #18252e;
    box-shadow: 0 15px 36px rgba(0, 0, 0, .17);
  }

  .police-card__media img {
    filter: saturate(.94) brightness(.9);
  }

  .police-card__body {
    background: #18252e;
  }

  .police-card__body p {
    color: #b7c4cc;
  }

  /* Utility areas become lighter and more radio-like. */
  .contact-bar {
    margin-top: var(--section-gap);
    padding: 30px 32px;
    border: 0;
    border-radius: 15px;
    background: linear-gradient(105deg, #273029 0%, #222b27 55%, #253426 100%);
    box-shadow: 0 18px 44px rgba(0, 0, 0, .13);
  }

  .contact-lead p,
  .contact-benefits small {
    color: #c0cac3;
  }

  .install-strip {
    min-height: 92px;
    margin-top: 26px;
    padding: 20px 24px;
    border: 0;
    border-radius: 13px;
    background: #20262a;
  }

  .footer {
    margin-top: clamp(72px, 6vw, 104px);
    border-top-color: rgba(255, 255, 255, .08);
    background: #0c1012;
  }
}

@media (min-width: 821px) and (max-width: 1199px) {
  :root {
    --desktop-shell: calc(100vw - 40px);
    --section-gap: 54px;
  }

  .audio-card {
    grid-template-columns: minmax(280px, 40%) minmax(0, 60%);
  }

  .news-strip {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
  }

  .news-card:first-child {
    grid-row: auto;
  }

  .news-card:nth-child(2) > a,
  .news-card:nth-child(3) > a {
    grid-template-columns: minmax(260px, 38%) minmax(0, 62%);
  }

  .research-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .research-card:nth-child(3) {
    grid-column: 1 / -1;
    grid-template-columns: minmax(0, 1fr) minmax(340px, .72fr);
  }
}

@media (min-width: 1200px) and (max-width: 1499px) {
  .audio-card {
    grid-template-columns: minmax(360px, 40%) minmax(0, 60%);
  }
}

@media (min-width: 1200px) and (max-width: 1499px) {
  .research-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .research-card:nth-child(3) {
    grid-column: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
  }

  .research-card:nth-child(3) .research-image {
    aspect-ratio: 16 / 9;
  }
}


/* v416 — FAMILY EDITORIAL / REFLAK
   BRAKE.FM remains the radio surface. REFLAK marks research and pressure.
   Green is reserved for audio, live and direct actions. */
@media (min-width: 821px) {
  :root {
    --family-navy: #071d31;
    --family-navy-2: #0d2b45;
    --family-paper: #eef2f3;
    --family-card: #ffffff;
    --family-cream: #f7f4ef;
    --family-ink: #0b1f31;
    --family-muted: #5f6e79;
    --family-line: #d8e0e4;
    --reflak-red: #d50000;
    --reflak-red-dark: #a90000;
  }

  body {
    background: var(--family-paper);
    color: var(--family-ink);
  }

  .navigation {
    background: rgba(4, 13, 22, .96);
    border-bottom-color: rgba(255, 255, 255, .10);
  }

  .navigation--scrolled {
    background: rgba(4, 13, 22, .985);
  }

  .hero-actions .button--primary {
    background: rgba(255, 255, 255, .94);
    border-color: rgba(255, 255, 255, .76);
    color: var(--family-navy);
    box-shadow: 0 14px 34px rgba(0, 0, 0, .18);
  }

  .hero-actions .button--secondary {
    background: linear-gradient(180deg, var(--green), var(--green-dark));
    border-color: transparent;
    color: #061006;
    box-shadow: 0 14px 34px rgba(89, 184, 31, .22);
  }

  .hero-actions .button--ghost {
    background: rgba(3, 8, 13, .54);
  }

  .brand-roles {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin-top: 1rem !important;
    color: rgba(255, 255, 255, .76) !important;
    font-size: .72rem !important;
    font-weight: 850;
    letter-spacing: .08em;
    line-height: 1.45 !important;
    text-transform: uppercase;
  }

  .brand-roles::before {
    content: "DREI STIMMEN";
    color: #caffae;
  }

  .home-dashboard {
    padding-top: clamp(76px, 5.2vw, 100px);
  }

  .panel-heading,
  .section-heading {
    color: var(--family-navy);
    border-bottom-color: var(--family-line);
  }

  .panel-heading h2,
  .section-heading h2 {
    color: var(--family-navy);
  }

  .panel-heading > a,
  .section-heading > a {
    color: var(--family-navy-2);
  }

  /* BRAKE.FM audio: dark programme surface, green only for listening/live. */
  .audio-card {
    border: 1px solid rgba(7, 29, 49, .12);
    background: linear-gradient(130deg, #071d31 0%, #0b263e 58%, #102f49 100%);
    box-shadow: 0 28px 68px rgba(7, 29, 49, .20);
  }

  .audio-body {
    color: #fff;
  }

  .audio-body h2 {
    color: #fff;
  }

  .audio-body p {
    color: #c7d1d8;
  }

  .audio-pending small {
    color: rgba(255, 255, 255, .52);
  }

  .audio-body .inline-link {
    color: #fff;
  }

  .audio-panel .panel-heading {
    position: relative;
  }

  .audio-panel .panel-heading::after {
    content: "BRAKE.FM · EINORDNUNG";
    margin-left: auto;
    color: #429b16;
    font-size: .64rem;
    font-weight: 950;
    letter-spacing: .11em;
  }

  .audio-panel .panel-heading > svg {
    display: none;
  }

  /* Meldungen: open, bright and factual. */
  .news-panel {
    color: var(--family-ink);
  }

  .news-card,
  .news-card > a,
  .news-copy {
    background: var(--family-card);
  }

  .news-card {
    border: 1px solid var(--family-line);
    box-shadow: 0 18px 46px rgba(7, 29, 49, .10);
  }

  .news-card img {
    filter: saturate(.96) brightness(.98) contrast(1.02);
  }

  .news-card:hover img {
    filter: saturate(1.03) brightness(1);
  }

  .news-copy h3 {
    color: var(--family-navy);
  }

  .news-copy p {
    color: var(--family-muted);
  }

  .news-copy small {
    color: #31516a;
  }

  .news-meta {
    color: rgba(255, 255, 255, .88);
  }

  .news-meta span {
    padding: .34rem .52rem;
    border-radius: 999px;
    background: rgba(7, 29, 49, .88);
    color: #fff;
    backdrop-filter: blur(8px);
  }

  /* REFLAK: a distinct research block, not another friendly radio card. */
  .research-panel {
    overflow: hidden;
    padding: 0;
    border: 1px solid #d7dcdf;
    border-radius: 18px;
    background: var(--family-cream);
    box-shadow: 0 28px 70px rgba(7, 29, 49, .11);
  }

  .research-panel .panel-heading {
    min-height: 78px;
    margin: 0;
    padding: 0 30px;
    border-bottom: 4px solid var(--reflak-red);
    background: #050505;
    color: #fff;
  }

  .research-panel .panel-heading h2 {
    color: #fff;
    font-size: .92rem;
    letter-spacing: .11em;
  }

  .research-panel .panel-heading h2::before {
    content: "RE";
    color: var(--reflak-red);
  }

  .research-panel .panel-heading > a {
    color: #fff;
  }

  .research-panel .panel-heading > a:hover {
    color: #ff4b4b;
  }

  .research-cards {
    padding: 30px;
    gap: 26px;
    background: transparent;
  }

  .research-card {
    border: 1px solid #d9dddf;
    border-radius: 12px;
    background: #fff;
    color: #090909;
    box-shadow: 0 13px 34px rgba(0, 0, 0, .07);
  }

  .research-card:hover {
    border-color: rgba(213, 0, 0, .44);
    box-shadow: 0 18px 46px rgba(0, 0, 0, .11);
  }

  .research-image img {
    filter: saturate(.92) brightness(.98) contrast(1.03);
  }

  .research-card:hover img {
    filter: saturate(1) brightness(1);
  }

  .research-copy {
    background: #fff;
  }

  .research-copy::before {
    content: "REFLAK · RECHERCHE";
    display: block;
    margin-bottom: .58rem;
    color: var(--reflak-red);
    font-size: .62rem;
    font-weight: 950;
    letter-spacing: .13em;
    text-transform: uppercase;
  }

  .research-copy > span {
    color: #5a6065;
  }

  .research-copy h3 {
    color: #080808;
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 800;
    letter-spacing: -.025em;
  }

  .research-copy p {
    color: #53606a;
  }

  .research-copy b {
    color: var(--reflak-red);
  }

  .research-copy b:hover {
    color: var(--reflak-red-dark);
  }

  .research-card:nth-child(3) .research-image {
    background:
      linear-gradient(90deg, rgba(213, 0, 0, .13), transparent 34%),
      linear-gradient(145deg, #050505 0%, #111 56%, #1b1b1b 100%);
  }

  .research-card:nth-child(3) .research-image::before {
    color: #fff;
    text-shadow: 0 18px 38px rgba(0, 0, 0, .4);
  }

  .research-card:nth-child(3) .research-image::after {
    color: #ff3b3b;
  }

  /* Blaulicht remains the dedicated dark live-news band. */
  .police-section {
    background: var(--family-navy);
    box-shadow: 0 28px 68px rgba(7, 29, 49, .19);
  }

  .police-section .section-heading {
    background: rgba(74, 147, 203, .10);
  }

  .police-section .section-heading h2,
  .police-section .section-heading > span {
    color: #fff;
  }

  /* Hinweise: family-light, direct action remains green. */
  .contact-bar {
    border: 1px solid var(--family-line);
    border-left: 5px solid var(--family-navy);
    background: #fff;
    color: var(--family-navy);
    box-shadow: 0 20px 52px rgba(7, 29, 49, .10);
  }

  .contact-lead p,
  .contact-benefits small {
    color: var(--family-muted);
  }

  .contact-benefits svg {
    color: var(--family-navy-2);
  }

  .whatsapp-orb,
  .whatsapp-button {
    background: linear-gradient(180deg, var(--green), var(--green-dark));
  }

  .install-strip {
    border: 1px solid var(--family-line);
    background: #fff;
    color: var(--family-navy);
    box-shadow: 0 16px 40px rgba(7, 29, 49, .07);
  }

  .install-strip svg {
    color: var(--family-navy-2);
  }

  .install-strip small,
  .install-strip p {
    color: var(--family-muted);
  }

  .footer {
    background: #04101b;
    border-top-color: rgba(255, 255, 255, .10);
  }
}

@media (min-width: 821px) and (max-width: 1199px) {
  .audio-panel .panel-heading::after {
    display: none;
  }

  .research-cards {
    padding: 24px;
  }
}

/* v416 visibility correction after the light body switch. */
@media (min-width: 821px) {
  .navigation .brand-copy strong,
  .footer .brand-copy strong,
  .hero h1 {
    color: #fff;
  }

  .navigation .brand-copy small,
  .footer .brand-copy small {
    color: rgba(255, 255, 255, .58);
  }
}

@media (min-width: 821px) {
  .research-panel .panel-heading h2::before {
    content: none;
  }
}

/* v417 — preserve the editorial 4:3 composition of the lead news image.
   The source image was designed in 4:3; forcing it into 16:9 clipped the visitor's head. */
@media (min-width: 1200px) {
  .news-card:first-child > a {
    grid-template-rows: auto auto;
  }

  .news-card:first-child img {
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    object-position: center center;
  }
}

/* v418 — DARK EDITORIAL RETURN
   Dark is the deliberate BRAKE.FM brand default. No duplicate light theme.
   Green remains reserved for audio/live actions; REFLAK keeps its red research accent. */
@media (min-width: 821px) {
  :root {
    color-scheme: dark;
    --dark-page: #151a1e;
    --dark-surface: #1c242a;
    --dark-surface-2: #222c33;
    --dark-surface-3: #27323a;
    --dark-ink: #f4f7f8;
    --dark-muted: #b8c3ca;
    --dark-line: rgba(255, 255, 255, .095);
  }

  body {
    background: var(--dark-page);
    color: var(--dark-ink);
  }

  .home-dashboard {
    background: transparent;
  }

  .panel-heading,
  .section-heading {
    color: var(--dark-ink);
    border-bottom-color: var(--dark-line);
  }

  .panel-heading h2,
  .section-heading h2 {
    color: var(--dark-ink);
  }

  .panel-heading > a,
  .section-heading > a {
    color: #77dd3a;
  }

  .panel-heading > a:hover,
  .section-heading > a:hover {
    color: #a4f274;
  }

  /* Current reports: dark editorial cards, with image and copy clearly separated. */
  .news-panel {
    color: var(--dark-ink);
  }

  .news-card,
  .news-card > a,
  .news-copy {
    background: var(--dark-surface-2);
  }

  .news-card {
    border: 1px solid var(--dark-line);
    box-shadow: 0 18px 46px rgba(0, 0, 0, .24);
  }

  .news-copy h3 {
    color: #fff;
  }

  .news-copy p {
    color: var(--dark-muted);
  }

  .news-copy small {
    color: #9eb2bf;
  }

  .news-meta span {
    background: rgba(5, 13, 19, .78);
    color: #fff;
  }

  /* REFLAK: dark pressure block, visually distinct through black/red/serif. */
  .research-panel {
    border: 1px solid rgba(255, 255, 255, .10);
    background: #171b1e;
    box-shadow: 0 28px 70px rgba(0, 0, 0, .25);
  }

  .research-panel .panel-heading {
    border-bottom: 4px solid var(--reflak-red);
    background: #050505;
    color: #fff;
  }

  .research-panel .panel-heading h2,
  .research-panel .panel-heading > a {
    color: #fff;
  }

  .research-cards {
    background: transparent;
  }

  .research-card {
    border: 1px solid rgba(255, 255, 255, .10);
    background: #22272b;
    color: #fff;
    box-shadow: 0 16px 40px rgba(0, 0, 0, .23);
  }

  .research-card:hover {
    border-color: rgba(213, 0, 0, .62);
    box-shadow: 0 22px 52px rgba(0, 0, 0, .30);
  }

  .research-copy {
    background: #22272b;
  }

  .research-copy::before {
    color: #ff4242;
  }

  .research-copy > span {
    color: #aeb8be;
  }

  .research-copy h3 {
    color: #fff;
  }

  .research-copy p {
    color: #bdc6cb;
  }

  .research-copy b {
    color: #ff4242;
  }

  .research-card:nth-child(3) .research-image {
    background:
      linear-gradient(90deg, rgba(213, 0, 0, .16), transparent 36%),
      linear-gradient(145deg, #030303 0%, #0d0d0d 58%, #181818 100%);
  }

  .police-section {
    border: 1px solid rgba(117, 177, 225, .12);
    background: #0b1c28;
    box-shadow: 0 28px 68px rgba(0, 0, 0, .25);
  }

  .contact-bar {
    border: 1px solid var(--dark-line);
    border-left: 5px solid #63ce24;
    background: linear-gradient(105deg, #263029 0%, #202824 58%, #243225 100%);
    color: #fff;
    box-shadow: 0 20px 52px rgba(0, 0, 0, .22);
  }

  .contact-lead p,
  .contact-benefits small {
    color: #c0cac4;
  }

  .contact-benefits svg {
    color: #75dc38;
  }

  .install-strip {
    border: 1px solid var(--dark-line);
    background: #20272b;
    color: #fff;
    box-shadow: 0 16px 40px rgba(0, 0, 0, .18);
  }

  .install-strip svg {
    color: #75dc38;
  }

  .install-strip small,
  .install-strip p {
    color: #b6c1c7;
  }

  .footer {
    background: #080c0f;
  }
}

/* v419 — CHARCOAL CARDS
   The dark BRAKE.FM identity remains. Standard content cards move from blue-tinted
   surfaces to neutral graphite/charcoal. Navy is reserved for section identity,
   green for audio/live actions, and red for REFLAK research. */
@media (min-width: 821px) {
  :root {
    --charcoal-page: #14191c;
    --charcoal-panel: #181d21;
    --charcoal-card: #1d2327;
    --charcoal-card-raised: #22282c;
    --charcoal-card-deep: #171c20;
    --charcoal-line: rgba(255, 255, 255, .10);
    --charcoal-line-soft: rgba(255, 255, 255, .075);
    --charcoal-text: #f4f6f7;
    --charcoal-muted: #bcc5ca;
    --charcoal-meta: #aab6bd;
    --section-navy: #0b2233;
  }

  body {
    background: var(--charcoal-page);
  }

  /* Audio: neutral programme card instead of a large blue slab. */
  .audio-card {
    border: 1px solid var(--charcoal-line);
    background: var(--charcoal-card);
    box-shadow: 0 28px 68px rgba(0, 0, 0, .27);
  }

  .audio-body {
    background:
      radial-gradient(circle at 92% 14%, rgba(99, 206, 36, .055), transparent 31%),
      linear-gradient(145deg, #20262a 0%, #1c2226 58%, #191f23 100%);
  }

  .audio-body p {
    color: var(--charcoal-muted);
  }

  .audio-pending small {
    color: var(--charcoal-meta);
  }

  .waveform {
    border-bottom-color: var(--charcoal-line-soft);
  }

  /* Current reports: neutral charcoal cards let photographs and copy carry contrast. */
  .news-card,
  .news-card > a,
  .news-copy {
    background: var(--charcoal-card);
  }

  .news-card {
    border-color: var(--charcoal-line);
    box-shadow: 0 18px 46px rgba(0, 0, 0, .26);
  }

  .news-copy {
    border-top: 1px solid var(--charcoal-line-soft);
  }

  .news-copy h3 {
    color: var(--charcoal-text);
  }

  .news-copy p {
    color: var(--charcoal-muted);
  }

  .news-copy small {
    color: var(--charcoal-meta);
  }

  /* REFLAK remains black/red, but its content cards are neutral rather than blue-gray. */
  .research-panel {
    background: #15191c;
  }

  .research-card,
  .research-copy {
    background: #202428;
  }

  .research-card {
    border-color: var(--charcoal-line);
  }

  .research-copy > span {
    color: var(--charcoal-meta);
  }

  .research-copy p {
    color: #c1c8cc;
  }

  /* Blaulicht keeps a navy thematic shell; the actual story cards are graphite. */
  .police-section {
    border-color: rgba(105, 168, 215, .16);
    background: var(--section-navy);
  }

  .police-section .section-heading {
    background: rgba(55, 126, 180, .09);
  }

  .police-card,
  .police-card > a,
  .police-card__body {
    background: var(--charcoal-card-raised);
  }

  .police-card {
    border-color: var(--charcoal-line);
    box-shadow: 0 16px 38px rgba(0, 0, 0, .25);
  }

  .police-card__body {
    border-top: 1px solid var(--charcoal-line-soft);
  }

  .police-card__body h3 {
    color: var(--charcoal-text);
  }

  .police-card__body p {
    color: var(--charcoal-muted);
  }

  .police-card__meta,
  .police-card__body small,
  .police-card time {
    color: var(--charcoal-meta);
  }

  /* Remaining utility surfaces use the same neutral scale. */
  .install-strip {
    background: var(--charcoal-card);
  }
}

/* v420 — REFLAKLIVE MATERIALITY
   BRAKE.FM adopts the neutral black/graphite materiality of the REFLAKlive
   publisher while keeping each brand function distinct:
   green = audio/live/direct action, red = REFLAK research, amber = warnings. */
@media (min-width: 821px) {
  :root {
    --publisher-bg: #090909;
    --publisher-panel: #111111;
    --publisher-card: #191919;
    --publisher-card-raised: #202020;
    --publisher-card-deep: #0d0d0d;
    --publisher-line: rgba(242, 237, 229, .17);
    --publisher-line-soft: rgba(242, 237, 229, .09);
    --publisher-text: #f2eee8;
    --publisher-muted: #b9b1a8;
    --publisher-meta: #918a82;
    --publisher-green: #63ce24;
    --publisher-green-bright: #7ae83e;
    --publisher-red: #b7202a;
    --publisher-red-bright: #df3340;
    --publisher-amber: #c78317;
  }

  body {
    background:
      radial-gradient(circle at 50% 0%, rgba(255,255,255,.025), transparent 32rem),
      var(--publisher-bg);
    color: var(--publisher-text);
  }

  .navigation,
  .navigation--scrolled {
    background: rgba(7, 7, 7, .975);
    border-bottom-color: var(--publisher-line-soft);
  }

  .home-dashboard {
    background: transparent;
  }

  .panel,
  .research-panel,
  .police-section {
    border-color: var(--publisher-line);
    background: var(--publisher-panel);
    box-shadow: 0 28px 72px rgba(0, 0, 0, .34);
  }

  .panel-heading,
  .section-heading {
    color: var(--publisher-text);
    border-bottom-color: var(--publisher-line-soft);
    background: rgba(255,255,255,.012);
  }

  .panel-heading h2,
  .section-heading h2 {
    color: var(--publisher-text);
  }

  .panel-heading > a,
  .section-heading > a {
    color: var(--publisher-green-bright);
  }

  .panel-heading > a:hover,
  .section-heading > a:hover {
    color: #a6f47d;
  }

  /* BRAKE.FM audio surface: neutral tool-like graphite, green only for audio. */
  .audio-card {
    border-color: var(--publisher-line);
    background: var(--publisher-card);
    box-shadow: 0 30px 74px rgba(0, 0, 0, .36);
  }

  .audio-body {
    background:
      radial-gradient(circle at 90% 13%, rgba(99, 206, 36, .075), transparent 28%),
      linear-gradient(145deg, #1b1b1b 0%, #151515 58%, #101010 100%);
    color: var(--publisher-text);
  }

  .audio-body h2,
  .audio-body .inline-link {
    color: var(--publisher-text);
  }

  .audio-body p {
    color: var(--publisher-muted);
  }

  .audio-status,
  .audio-panel .panel-heading::after {
    color: var(--publisher-green-bright);
  }

  .audio-pending small {
    color: var(--publisher-meta);
  }

  .waveform {
    border-bottom-color: var(--publisher-line-soft);
  }

  /* Factual reports: warm-neutral graphite rather than blue-charcoal. */
  .news-card,
  .news-card > a,
  .news-copy {
    background: var(--publisher-card);
  }

  .news-card {
    border-color: var(--publisher-line);
    box-shadow: 0 20px 50px rgba(0, 0, 0, .32);
  }

  .news-copy {
    border-top-color: var(--publisher-line-soft);
  }

  .news-copy h3 {
    color: var(--publisher-text);
  }

  .news-copy p {
    color: var(--publisher-muted);
  }

  .news-copy small {
    color: var(--publisher-meta);
  }

  .news-meta span {
    background: rgba(8, 8, 8, .82);
    border: 1px solid rgba(242, 237, 229, .14);
    color: var(--publisher-text);
  }

  /* REFLAK research: black pressure surface, restrained red provenance. */
  .research-panel {
    background: #0b0b0b;
    border-color: rgba(242, 237, 229, .16);
  }

  .research-panel .panel-heading {
    background: #050505;
    border-bottom-color: var(--publisher-red);
  }

  .research-panel .panel-heading > a {
    color: #f1ece5;
  }

  .research-panel .panel-heading > a:hover {
    color: var(--publisher-red-bright);
  }

  .research-card,
  .research-copy {
    background: #181818;
  }

  .research-card {
    border-color: rgba(242, 237, 229, .16);
    box-shadow: 0 18px 46px rgba(0, 0, 0, .36);
  }

  .research-card:hover {
    border-color: rgba(183, 32, 42, .78);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .44);
  }

  .research-copy::before,
  .research-copy b {
    color: var(--publisher-red-bright);
  }

  .research-copy > span {
    color: var(--publisher-meta);
  }

  .research-copy h3 {
    color: var(--publisher-text);
  }

  .research-copy p {
    color: var(--publisher-muted);
  }

  .research-card:nth-child(3) .research-image {
    background:
      radial-gradient(circle at 84% 20%, rgba(183, 32, 42, .12), transparent 34%),
      linear-gradient(145deg, #050505 0%, #0c0c0c 58%, #151515 100%);
  }

  /* Blaulicht: neutral shell and cards; cold blue remains only as a tiny status cue. */
  .police-section {
    background: #101010;
    border-color: var(--publisher-line);
  }

  .police-section .section-heading {
    background: #151515;
    border-bottom-color: var(--publisher-line-soft);
  }

  .police-card,
  .police-card > a,
  .police-card__body {
    background: var(--publisher-card-raised);
  }

  .police-card {
    border-color: var(--publisher-line);
    box-shadow: 0 18px 44px rgba(0, 0, 0, .34);
  }

  .police-card__body {
    border-top-color: var(--publisher-line-soft);
  }

  .police-card__body h3 {
    color: var(--publisher-text);
  }

  .police-card__body p {
    color: var(--publisher-muted);
  }

  .police-card__meta,
  .police-card__body small,
  .police-card time {
    color: var(--publisher-meta);
  }

  /* Direct contact remains BRAKE.FM green, but on the same neutral material. */
  .contact-bar {
    border-color: var(--publisher-line);
    border-left-color: var(--publisher-green);
    background:
      radial-gradient(circle at 15% 50%, rgba(99, 206, 36, .07), transparent 28%),
      linear-gradient(105deg, #181818 0%, #141414 62%, #101010 100%);
    color: var(--publisher-text);
  }

  .contact-lead p,
  .contact-benefits small {
    color: var(--publisher-muted);
  }

  .contact-benefits svg,
  .install-strip svg {
    color: var(--publisher-green-bright);
  }

  .install-strip {
    border-color: var(--publisher-line);
    background: #171717;
    color: var(--publisher-text);
  }

  .install-strip small,
  .install-strip p {
    color: var(--publisher-muted);
  }

  .footer {
    background: #050505;
    border-top-color: var(--publisher-line-soft);
  }
}

/* v425 — REFLAK card typography and vertical rhythm
   Prevent awkward German mid-word breaks, align descriptions/actions,
   and remove excess space below the research cards. */
@media (min-width: 821px) {
  .research-cards {
    align-items: stretch;
    padding: 24px 24px 16px;
    gap: 22px;
  }

  .research-card {
    min-height: 100%;
  }

  .research-copy {
    min-width: 0;
    min-height: 178px;
    padding: 18px 20px 18px;
  }

  .research-copy h3 {
    min-height: 2.08em;
    margin-top: .46rem;
    margin-bottom: .46rem;
    font-size: clamp(1.28rem, 1.34vw, 1.62rem);
    line-height: 1.04;
    letter-spacing: -.02em;
    text-wrap: balance;
    hyphens: none;
    -webkit-hyphens: none;
    word-break: normal;
    overflow-wrap: normal;
  }

  .research-copy p {
    min-height: 3em;
    font-size: .78rem;
    line-height: 1.5;
    text-wrap: pretty;
    hyphens: none;
    -webkit-hyphens: none;
    word-break: normal;
    overflow-wrap: normal;
  }

  .research-copy b {
    margin-top: 12px;
    padding-top: 0;
  }
}

@media (min-width: 821px) and (max-width: 1199px) {
  .research-cards {
    padding: 22px 22px 16px;
  }

  .research-copy h3 {
    min-height: 0;
  }

  .research-copy p {
    min-height: 0;
  }
}

/* v425 — editorial length normalization
   Research titles and teasers are deliberately written to comparable lengths.
   Existing grid rhythm keeps the three cards visually aligned. */


/* v426 — restore the BRAKE.FM equalizer animation independently of the compiled app CSS. */
.waveform i {
  transform: scaleY(.58);
  animation-name: brakefmWave !important;
  animation-duration: 1.35s !important;
  animation-timing-function: ease-in-out !important;
  animation-iteration-count: infinite !important;
  animation-direction: alternate !important;
  animation-play-state: running !important;
  will-change: transform, opacity;
}

@keyframes brakefmWave {
  0% { transform: scaleY(.38); opacity: .46; }
  45% { transform: scaleY(1); opacity: 1; }
  100% { transform: scaleY(.56); opacity: .72; }
}

/* Respect an explicitly enabled reduced-motion accessibility preference. */
@media (prefers-reduced-motion: reduce) {
  .waveform i {
    animation-name: none !important;
    transform: scaleY(.72);
    opacity: .74;
    will-change: auto;
  }
}