.audience-hero { color: #fff; background: linear-gradient(132deg,#17273c,#263e5b); border-bottom: 5px solid var(--monitor-gold); }
.audience-hero__inner { min-height: 330px; padding-top: 62px; padding-bottom: 58px; }
.audience-hero h1 { max-width: 900px; margin: 0; color: #fff; font-size: clamp(3.1rem,7.5vw,6.3rem); line-height: .9; letter-spacing: -.062em; }
.audience-hero .audience-intro { max-width: 680px; margin: 22px 0 0; color: #d5dee8; font-family: Arial,sans-serif; font-size: 1.08rem; }
.audience-hero .audience-source-lead { max-width: 760px; margin: 20px 0 0; color: #e4ebf2; font: .85rem/1.45 Arial,sans-serif; }
.audience-source-lead a { color: #f0d288; text-underline-offset: 2px; }
.audience-explorer { padding-top: 42px; padding-bottom: 90px; }
.audience-heading { margin-bottom: 22px; }
.audience-metric-switch { flex-wrap: wrap; overflow: visible; }
.audience-comparison-card { margin-top: 12px; }
.audience-comparison-card .bar-fill { background: var(--color); }
.audience-legend { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-bottom: 20px; color: #536174; font: 700 .74rem/1.2 Arial,sans-serif; }
.audience-legend span, .audience-map-legend span { display: inline-flex; align-items: center; gap: 5px; }
.audience-legend i, .audience-map-legend i { display: inline-block; flex: 0 0 11px; width: 11px; height: 11px; border-radius: 2px; }
.audience-row { display: grid; grid-template-columns: 140px minmax(0,1fr); align-items: center; gap: 14px; width: 100%; min-height: 63px; padding: 8px 6px; border: 0; border-top: 1px solid #e8edf1; background: #fff; color: var(--monitor-navy); text-align: left; cursor: pointer; }
.audience-row--spain { margin-bottom: 9px; border-bottom: 2px solid #dbe2e8; }
.audience-row[aria-pressed="true"] { background: #f4f7fa; }
.audience-row:hover, .audience-row:focus-visible { outline: 2px solid #bdcad6; outline-offset: -2px; }
.audience-row__name { display: flex; align-items: center; gap: 8px; font: 800 .82rem/1 Arial,sans-serif; }
.audience-row__name img { width: 36px; height: 30px; object-fit: contain; }
.audience-stack, .audience-map-detail__stack { display: flex; width: 100%; height: 34px; overflow: hidden; border-radius: 5px; background: #ecf0f3; }
.stack-segment { display: grid; place-items: center; min-width: 0; height: 100%; overflow: hidden; color: #fff; white-space: nowrap; font: 800 .68rem/1 Arial,sans-serif; text-shadow: 0 1px 2px #1b2b3f; }
.audience-detail { margin-top: 19px; padding: 14px 16px; border-radius: 9px; background: #f2f5f8; font: .78rem/1.35 Arial,sans-serif; }
.audience-detail > strong { display: block; margin-bottom: 8px; color: var(--monitor-navy); font-size: .87rem; }
.audience-detail > span { display: flex; flex-wrap: wrap; gap: 5px 17px; }
.audience-detail i { display: inline-flex; align-items: center; gap: 3px; color: #4a5b70; font-style: normal; }
.audience-detail i::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 3px; border-radius: 2px; background: var(--swatch); }
.audience-comparison-card .chart-footnote { margin-left: 0; }
.audience-map-section { margin-top: 62px; padding-top: 55px; border-top: 1px solid var(--monitor-line); }
.audience-map-controls { margin-bottom: 20px; }
.audience-map-controls .metric-switch { flex-wrap: wrap; }
.audience-map-controls #audience-map-filter button { display: inline-flex; align-items: center; gap: 5px; }
.map-channel-logo { width: 24px; height: 20px; object-fit: contain; vertical-align: middle; }
.map-category-swatch { display: inline-block; flex: 0 0 11px; width: 11px; height: 11px; border-radius: 2px; }
.audience-map-layout { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(250px,.8fr); gap: 26px; align-items: start; }
.audience-map { min-height: 350px; border: 1px solid var(--monitor-line); border-radius: 12px; background: #fbfcfd; }
.audience-map svg { display: block; width: 100%; height: auto; }
.audience-map-percent { fill: #162a42; stroke: #fff; stroke-width: 3.5px; paint-order: stroke fill; pointer-events: none; font: 800 14px/1 Arial,sans-serif; }
.audience-region { cursor: pointer; }
.audience-region path:first-child { stroke: #fff; stroke-width: 1.2; transition: filter .15s; }
.audience-region:hover path:first-child, .audience-region:focus-visible path:first-child { filter: brightness(.82); }
.audience-region.is-selected path:first-child { stroke: #15263e; stroke-width: 3; }
.audience-region:focus-visible { outline: none; }
.audience-map-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 7px 12px; margin-top: 13px; color: #59687a; font: 700 .68rem/1.2 Arial,sans-serif; }
.audience-map-small { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-top: 12px; color: #637285; font: .68rem/1.25 Arial,sans-serif; }
.audience-map-small > strong { margin-right: 2px; color: #42556d; }
.audience-map-small button { padding: 2px 4px; border: 0; border-radius: 3px; background: transparent; color: inherit; cursor: pointer; font: inherit; }
.audience-map-small button:hover, .audience-map-small button:focus-visible, .audience-map-small button[aria-pressed="true"] { background: #e9eff5; color: #20364f; }
.audience-gradient { width: 150px; height: 11px; border-radius: 4px; background: linear-gradient(90deg,#eff3f7,#1c4873); }
.audience-map-detail { min-height: 350px; padding: 22px; border: 1px solid var(--monitor-line); border-radius: 12px; background: #fff; color: #58697b; font: .82rem/1.4 Arial,sans-serif; }
.audience-map-detail h3 { margin: 0; color: var(--monitor-navy); font-size: 1.6rem; }
.audience-map-detail > p:not(.section-eyebrow) { margin: 10px 0 19px; }
.audience-map-detail__stack { height: 25px; margin: 16px 0; }
.audience-map-detail__list { display: grid; gap: 4px; }
.audience-map-detail__list > div { display: grid; grid-template-columns: 28px 1fr auto; align-items: center; gap: 8px; }
.audience-map-detail__list .map-channel-logo { width: 28px; height: 21px; }
.audience-map-detail__list .map-category-swatch { width: 11px; height: 11px; margin-left: 8px; }
.audience-map-detail__list strong { color: var(--monitor-navy); }
.audience-map-note { margin-top: 20px; color: #738091; font: .76rem/1.5 Arial,sans-serif; }
.audience-method { margin-top: 24px; border: 1px solid var(--monitor-line); border-radius: 10px; background: #fff; }
.audience-method summary { padding: 16px 18px; color: var(--monitor-navy); cursor: pointer; font: 800 .85rem/1 Arial,sans-serif; }
.audience-method div { padding: 0 18px 14px; color: var(--monitor-muted); font: .82rem/1.5 Arial,sans-serif; }
.audience-method p { margin: 0 0 10px; }
@media (max-width:680px) {
  .audience-hero__inner { min-height: 280px; padding-top: 42px; padding-bottom: 44px; }
  .audience-hero h1 { font-size: clamp(3rem,15vw,4.1rem); }
  .audience-explorer { width: min(100% - 24px,1180px); padding-top: 22px; }
  .audience-metric-switch { flex-wrap: nowrap; overflow-x: auto; }
  .audience-comparison-card { padding: 16px 12px; }
  .audience-row { grid-template-columns: 80px minmax(0,1fr); gap: 8px; min-height: 57px; }
  .audience-row__name { gap: 4px; font-size: .68rem; }
  .audience-row__name img { width: 27px; height: 24px; }
  .audience-map-percent { font-size: 18px; stroke-width: 4.5px; }
  .audience-stack { height: 30px; }
  .stack-segment { font-size: .55rem; }
  .audience-map-section { margin-top: 47px; padding-top: 44px; }
  .audience-map-controls .metric-switch { flex-wrap: nowrap; overflow-x: auto; }
  .audience-map-layout { grid-template-columns: 1fr; gap: 18px; }
  .audience-map { min-height: 0; }
  .audience-map-detail { min-height: 0; }
}