MiniMax MiniMax M3.1 Flash – Arts and Entertainment

via Minimax · Generated

  • AIMAC Debt 5.60
  • Cost $0.02
  • Total Violations 44
  • HTML Size 101 KB
  • Em Dashes 11

Screenshot

View MiniMax MiniMax M3.1 Flash Arts and Entertainment page View Live Page

Accessibility Issues Found

44 Serious

  • color-contrast serious 44 instances

    Elements must meet minimum color contrast ratio thresholds

    Example HTML <p>© <span id="currentYear">2026</span> Signal &amp; Stage. All rights reserved.</p>

Artifacts

View Generated HTML
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="description" content="Signal & Stage is an independent culture desk covering music, film, visual art, performance, and the people moving culture forward.">
  <meta name="theme-color" content="#171713">
  <title>Signal & Stage — Where Culture Moves Forward</title>

  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Montserrat:wght@400;500;600;700;800&display=swap" rel="stylesheet">

  <style>
    :root {
      --ink: #171713;
      --ink-soft: #2a2a24;
      --paper: #f3efe5;
      --paper-deep: #e8e2d4;
      --white: #fffef9;
      --acid: #d9ff57;
      --coral: #ff6747;
      --blue: #4d63ff;
      --muted: #6d6c64;
      --line: rgba(23, 23, 19, 0.17);
      --line-light: rgba(255, 255, 255, 0.18);
      --serif: "Lora", Georgia, serif;
      --sans: "Montserrat", Arial, sans-serif;
      --shadow: 0 24px 70px rgba(23, 23, 19, 0.13);
      --radius: 18px;
      --container: 1240px;
    }

    *,
    *::before,
    *::after {
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
      scroll-padding-top: 110px;
    }

    body {
      margin: 0;
      color: var(--ink);
      background: var(--paper);
      font-family: var(--sans);
      font-size: 16px;
      line-height: 1.7;
      -webkit-font-smoothing: antialiased;
      overflow-x: hidden;
    }

    body.nav-open {
      overflow: hidden;
    }

    img {
      display: block;
      max-width: 100%;
    }

    a {
      color: inherit;
      text-decoration: none;
    }

    button,
    input {
      font: inherit;
    }

    button,
    a {
      -webkit-tap-highlight-color: transparent;
    }

    button {
      color: inherit;
    }

    ::selection {
      color: var(--ink);
      background: var(--acid);
    }

    :focus-visible {
      outline: 3px solid var(--blue);
      outline-offset: 4px;
    }

    .skip-link {
      position: fixed;
      z-index: 999;
      top: 12px;
      left: 12px;
      padding: 12px 18px;
      color: var(--white);
      background: var(--ink);
      transform: translateY(-150%);
      transition: transform 0.2s ease;
    }

    .skip-link:focus {
      transform: translateY(0);
    }

    .container {
      width: min(calc(100% - 48px), var(--container));
      margin-inline: auto;
    }

    .section {
      padding: 112px 0;
    }

    .section--line {
      border-top: 1px solid var(--line);
    }

    .section--dark {
      color: var(--white);
      background: var(--ink);
    }

    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin: 0 0 20px;
      color: var(--muted);
      font-size: 0.72rem;
      font-weight: 800;
      letter-spacing: 0.16em;
      line-height: 1.2;
      text-transform: uppercase;
    }

    .eyebrow::before {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: var(--coral);
      content: "";
    }

    .section--dark .eyebrow {
      color: rgba(255, 255, 255, 0.6);
    }

    .eyebrow--acid::before {
      background: var(--acid);
    }

    .display {
      margin: 0;
      font-family: var(--serif);
      font-size: clamp(2.6rem, 5.2vw, 5rem);
      font-weight: 500;
      letter-spacing: -0.045em;
      line-height: 1.02;
    }

    .display em {
      font-weight: 400;
    }

    .section-intro {
      max-width: 680px;
      margin: 24px 0 0;
      color: var(--muted);
      font-size: 1.05rem;
    }

    .section--dark .section-intro {
      color: rgba(255, 255, 255, 0.64);
    }

    .section-heading {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(280px, 460px);
      gap: 60px;
      align-items: end;
      margin-bottom: 58px;
    }

    .section-heading__copy {
      max-width: 650px;
      margin: 20px 0 0;
      color: var(--muted);
      font-size: 1rem;
    }

    .section--dark .section-heading__copy {
      color: rgba(255, 255, 255, 0.64);
    }

    .button {
      display: inline-flex;
      min-height: 50px;
      align-items: center;
      justify-content: center;
      gap: 12px;
      padding: 13px 20px;
      border: 1px solid var(--ink);
      border-radius: 999px;
      color: var(--white);
      background: var(--ink);
      cursor: pointer;
      font-size: 0.76rem;
      font-weight: 800;
      letter-spacing: 0.08em;
      line-height: 1;
      text-transform: uppercase;
      transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
    }

    .button:hover {
      color: var(--ink);
      background: var(--acid);
      border-color: var(--acid);
      transform: translateY(-2px);
    }

    .button--light {
      color: var(--ink);
      background: var(--white);
      border-color: var(--white);
    }

    .button--light:hover {
      color: var(--ink);
      background: var(--acid);
      border-color: var(--acid);
    }

    .button--outline {
      color: var(--ink);
      background: transparent;
    }

    .button--outline:hover {
      color: var(--white);
      background: var(--ink);
      border-color: var(--ink);
    }

    .button--coral {
      color: var(--ink);
      background: var(--coral);
      border-color: var(--coral);
    }

    .button--coral:hover {
      color: var(--white);
      background: var(--ink);
      border-color: var(--ink);
    }

    .button--small {
      min-height: 42px;
      padding: 10px 16px;
      font-size: 0.68rem;
    }

    .arrow {
      display: inline-block;
      font-size: 1.1em;
      line-height: 1;
      transition: transform 0.2s ease;
    }

    .button:hover .arrow,
    .text-link:hover .arrow {
      transform: translate(3px, -3px);
    }

    .text-link {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      padding-bottom: 3px;
      border-bottom: 1px solid currentColor;
      font-size: 0.74rem;
      font-weight: 800;
      letter-spacing: 0.1em;
      text-transform: uppercase;
    }

    .topline {
      color: rgba(255, 255, 255, 0.74);
      background: var(--ink);
      font-size: 0.66rem;
      font-weight: 700;
      letter-spacing: 0.13em;
      text-transform: uppercase;
    }

    .topline__inner {
      display: flex;
      min-height: 36px;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
    }

    .topline__signal {
      display: inline-flex;
      align-items: center;
      gap: 9px;
    }

    .live-dot {
      position: relative;
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--acid);
    }

    .live-dot::after {
      position: absolute;
      inset: -4px;
      border: 1px solid var(--acid);
      border-radius: inherit;
      content: "";
      animation: pulse 1.8s infinite;
    }

    @keyframes pulse {
      0%, 100% { opacity: 0; transform: scale(0.7); }
      50% { opacity: 0.8; transform: scale(1.2); }
    }

    .topline a {
      color: var(--acid);
    }

    .site-header {
      position: sticky;
      z-index: 100;
      top: 0;
      border-bottom: 1px solid var(--line);
      background: rgba(243, 239, 229, 0.92);
      backdrop-filter: blur(18px);
      transition: box-shadow 0.25s ease;
    }

    .site-header.is-scrolled {
      box-shadow: 0 10px 35px rgba(23, 23, 19, 0.08);
    }

    .header__inner {
      display: grid;
      grid-template-columns: auto 1fr auto;
      min-height: 86px;
      align-items: center;
      gap: 36px;
    }

    .brand {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      flex-shrink: 0;
    }

    .brand__logo {
      width: 48px;
      height: 48px;
      border-radius: 10px;
      object-fit: cover;
    }

    .brand__name {
      display: block;
      font-size: 1rem;
      font-weight: 800;
      letter-spacing: -0.025em;
      line-height: 1.15;
    }

    .brand__tagline {
      display: block;
      margin-top: 3px;
      color: var(--muted);
      font-size: 0.59rem;
      font-weight: 700;
      letter-spacing: 0.11em;
      text-transform: uppercase;
    }

    .primary-nav ul {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: clamp(18px, 2.2vw, 34px);
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .primary-nav a {
      position: relative;
      padding: 31px 0 29px;
      font-size: 0.71rem;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    .primary-nav a::after {
      position: absolute;
      right: 0;
      bottom: 22px;
      left: 0;
      height: 2px;
      background: var(--coral);
      content: "";
      transform: scaleX(0);
      transform-origin: right;
      transition: transform 0.2s ease;
    }

    .primary-nav a:hover::after,
    .primary-nav a[aria-current="page"]::after {
      transform: scaleX(1);
      transform-origin: left;
    }

    .header__action {
      min-height: 42px;
      padding-inline: 16px;
    }

    .menu-toggle {
      display: none;
      width: 46px;
      height: 46px;
      padding: 0;
      border: 1px solid var(--line);
      border-radius: 50%;
      background: transparent;
      cursor: pointer;
    }

    .menu-toggle span {
      display: block;
      width: 19px;
      height: 1.5px;
      margin: 5px auto;
      background: var(--ink);
      transition: transform 0.2s ease, opacity 0.2s ease;
    }

    .menu-toggle[aria-expanded="true"] span:nth-child(1) {
      transform: translateY(6.5px) rotate(45deg);
    }

    .menu-toggle[aria-expanded="true"] span:nth-child(2) {
      opacity: 0;
    }

    .menu-toggle[aria-expanded="true"] span:nth-child(3) {
      transform: translateY(-6.5px) rotate(-45deg);
    }

    .hero {
      position: relative;
      overflow: hidden;
    }

    .hero__grid {
      display: grid;
      min-height: calc(100vh - 122px);
      grid-template-columns: minmax(0, 1.08fr) minmax(430px, 0.92fr);
      align-items: stretch;
    }

    .hero__content {
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 80px clamp(40px, 6vw, 90px) 72px 0;
    }

    .hero__issue {
      display: inline-flex;
      align-items: center;
      align-self: flex-start;
      gap: 12px;
      margin-bottom: 32px;
      padding: 8px 12px;
      border: 1px solid var(--line);
      border-radius: 999px;
      font-size: 0.67rem;
      font-weight: 800;
      letter-spacing: 0.1em;
      text-transform: uppercase;
    }

    .hero__issue span:first-child {
      padding: 4px 8px;
      border-radius: 999px;
      color: var(--ink);
      background: var(--acid);
      font-size: 0.59rem;
    }

    .hero h1 {
      max-width: 790px;
      margin: 0;
      font-family: var(--serif);
      font-size: clamp(4.2rem, 7.6vw, 8.2rem);
      font-weight: 500;
      letter-spacing: -0.065em;
      line-height: 0.88;
    }

    .hero h1 em {
      position: relative;
      z-index: 0;
      display: inline-block;
      font-weight: 400;
    }

    .hero h1 em::after {
      position: absolute;
      z-index: -1;
      right: -0.05em;
      bottom: 0.02em;
      left: -0.05em;
      height: 0.18em;
      background: var(--coral);
      content: "";
      transform: rotate(-1.5deg);
    }

    .hero__dek {
      max-width: 650px;
      margin: 36px 0 0;
      color: var(--ink-soft);
      font-size: clamp(1rem, 1.3vw, 1.18rem);
      line-height: 1.75;
    }

    .hero__actions {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-top: 36px;
    }

    .hero__signals {
      display: grid;
      max-width: 650px;
      grid-template-columns: repeat(3, 1fr);
      gap: 16px;
      margin-top: 54px;
      padding-top: 25px;
      border-top: 1px solid var(--line);
    }

    .signal strong {
      display: block;
      font-family: var(--serif);
      font-size: 1.7rem;
      font-weight: 500;
      line-height: 1;
    }

    .signal span {
      display: block;
      margin-top: 8px;
      color: var(--muted);
      font-size: 0.62rem;
      font-weight: 800;
      letter-spacing: 0.1em;
      text-transform: uppercase;
    }

    .hero__media {
      position: relative;
      min-height: 680px;
      margin: 0;
      overflow: hidden;
      background: #cbc5b7;
    }

    .hero__media::after {
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, transparent 50%, rgba(0, 0, 0, 0.58));
      content: "";
      pointer-events: none;
    }

    .hero__media > img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: saturate(0.78) contrast(1.04);
    }

    .hero__media-label {
      position: absolute;
      z-index: 2;
      right: 28px;
      bottom: 28px;
      left: 28px;
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 20px;
      color: var(--white);
    }

    .hero__media-label p {
      max-width: 320px;
      margin: 0;
      font-family: var(--serif);
      font-size: clamp(1.35rem, 2.2vw, 2rem);
      line-height: 1.15;
    }

    .hero__media-label small {
      display: block;
      margin-bottom: 7px;
      color: var(--acid);
      font-size: 0.62rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }

    .hero__badge {
      position: absolute;
      z-index: 3;
      top: 34px;
      left: -28px;
      display: grid;
      width: 132px;
      height: 132px;
      place-items: center;
      padding: 18px;
      border-radius: 50%;
      color: var(--ink);
      background: var(--acid);
      font-size: 0.64rem;
      font-weight: 800;
      letter-spacing: 0.11em;
      line-height: 1.5;
      text-align: center;
      text-transform: uppercase;
      transform: rotate(-8deg);
    }

    .ticker {
      overflow: hidden;
      border-top: 1px solid var(--ink);
      border-bottom: 1px solid var(--ink);
      color: var(--white);
      background: var(--ink);
    }

    .ticker__track {
      display: flex;
      width: max-content;
      align-items: center;
      animation: ticker 28s linear infinite;
    }

    .ticker span {
      display: inline-flex;
      align-items: center;
      gap: 32px;
      padding: 15px 18px;
      font-size: 0.68rem;
      font-weight: 800;
      letter-spacing: 0.15em;
      text-transform: uppercase;
    }

    .ticker span::after {
      color: var(--acid);
      content: "✦";
    }

    @keyframes ticker {
      to { transform: translateX(-50%); }
    }

    .briefing-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.45fr) minmax(330px, 0.72fr);
      gap: 28px;
    }

    .lead-story {
      display: grid;
      min-height: 630px;
      grid-template-rows: 1fr auto;
      overflow: hidden;
      border: 1px solid var(--line);
      background: var(--white);
    }

    .lead-story__image {
      position: relative;
      min-height: 390px;
      overflow: hidden;
    }

    .lead-story__image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.7s cubic-bezier(.2,.7,.2,1);
    }

    .lead-story:hover .lead-story__image img {
      transform: scale(1.025);
    }

    .story-tag {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: var(--coral);
      font-size: 0.65rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }

    .story-tag::before {
      width: 18px;
      height: 1px;
      background: currentColor;
      content: "";
    }

    .lead-story__content {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(250px, 0.7fr);
      gap: 35px;
      padding: 35px 38px 38px;
    }

    .lead-story h3 {
      margin: 12px 0 0;
      font-family: var(--serif);
      font-size: clamp(2rem, 3.5vw, 3.25rem);
      font-weight: 500;
      letter-spacing: -0.04em;
      line-height: 1.07;
    }

    .lead-story__copy p {
      margin: 0 0 14px;
      color: var(--muted);
      font-size: 0.9rem;
    }

    .story-meta {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px 14px;
      margin-top: 22px;
      color: var(--muted);
      font-size: 0.65rem;
      font-weight: 700;
      letter-spacing: 0.07em;
      text-transform: uppercase;
    }

    .story-meta span + span::before {
      margin-right: 14px;
      content: "•";
    }

    .side-stories {
      display: grid;
      grid-template-rows: 1fr 1fr;
      gap: 28px;
    }

    .side-story {
      display: grid;
      min-height: 300px;
      grid-template-columns: minmax(130px, 0.82fr) minmax(0, 1fr);
      overflow: hidden;
      border: 1px solid var(--line);
      background: var(--white);
    }

    .side-story img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: saturate(0.75);
    }

    .side-story__content {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      padding: 26px;
    }

    .side-story h3 {
      margin: 12px 0 12px;
      font-family: var(--serif);
      font-size: clamp(1.35rem, 2.1vw, 1.8rem);
      font-weight: 500;
      letter-spacing: -0.025em;
      line-height: 1.18;
    }

    .side-story p {
      margin: 0;
      color: var(--muted);
      font-size: 0.79rem;
    }

    .radar {
      display: grid;
      grid-template-columns: 0.55fr repeat(3, 1fr);
      gap: 0;
      margin-top: 28px;
      border-top: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
    }

    .radar__title,
    .radar__item {
      padding: 28px 24px;
    }

    .radar__title {
      padding-left: 0;
    }

    .radar__title span {
      display: block;
      margin-bottom: 8px;
      color: var(--coral);
      font-size: 0.64rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }

    .radar__title strong {
      font-family: var(--serif);
      font-size: 1.35rem;
      font-weight: 500;
      line-height: 1.2;
    }

    .radar__item {
      border-left: 1px solid var(--line);
    }

    .radar__item h4 {
      margin: 9px 0 10px;
      font-family: var(--serif);
      font-size: 1.15rem;
      font-weight: 500;
      line-height: 1.28;
    }

    .radar__item p {
      margin: 0;
      color: var(--muted);
      font-size: 0.76rem;
    }

    .schedule-section {
      background: var(--paper-deep);
    }

    .schedule-layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 310px;
      gap: 30px;
      align-items: start;
    }

    .calendar-panel {
      border: 1px solid var(--line);
      background: var(--white);
      box-shadow: 14px 14px 0 rgba(23, 23, 19, 0.06);
    }

    .calendar-toolbar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      padding: 22px 26px;
      border-bottom: 1px solid var(--line);
    }

    .calendar-toolbar strong {
      font-family: var(--serif);
      font-size: 1.2rem;
      font-weight: 500;
    }

    .calendar-toolbar span {
      color: var(--muted);
      font-size: 0.68rem;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    .day-filter {
      display: flex;
      gap: 7px;
      padding: 16px 20px;
      overflow-x: auto;
      border-bottom: 1px solid var(--line);
      scrollbar-width: thin;
    }

    .day-filter button {
      min-width: 82px;
      padding: 10px 13px;
      border: 1px solid var(--line);
      border-radius: 999px;
      background: transparent;
      cursor: pointer;
      font-size: 0.68rem;
      font-weight: 800;
      letter-spacing: 0.05em;
      text-transform: uppercase;
      transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease;
    }

    .day-filter button:hover {
      border-color: var(--ink);
    }

    .day-filter button[aria-pressed="true"] {
      color: var(--white);
      background: var(--ink);
      border-color: var(--ink);
    }

    .day-filter button span {
      display: block;
      margin-top: 2px;
      color: var(--muted);
      font-size: 0.58rem;
      font-weight: 600;
      letter-spacing: 0;
      text-transform: none;
    }

    .day-filter button[aria-pressed="true"] span {
      color: rgba(255, 255, 255, 0.65);
    }

    .event-list {
      padding: 0 24px;
    }

    .event-item {
      display: grid;
      grid-template-columns: 72px minmax(0, 1fr) auto;
      gap: 24px;
      align-items: center;
      padding: 25px 0;
      border-bottom: 1px solid var(--line);
    }

    .event-item[hidden] {
      display: none;
    }

    .event-item:last-child {
      border-bottom: 0;
    }

    .event-date {
      padding-right: 20px;
      border-right: 1px solid var(--line);
      text-align: center;
    }

    .event-date strong {
      display: block;
      font-family: var(--serif);
      font-size: 2rem;
      font-weight: 500;
      line-height: 1;
    }

    .event-date span {
      display: block;
      margin-top: 7px;
      color: var(--muted);
      font-size: 0.62rem;
      font-weight: 800;
      letter-spacing: 0.1em;
      text-transform: uppercase;
    }

    .event-info h3 {
      margin: 6px 0 8px;
      font-family: var(--serif);
      font-size: clamp(1.3rem, 2.1vw, 1.72rem);
      font-weight: 500;
      letter-spacing: -0.025em;
      line-height: 1.2;
    }

    .event-info p {
      margin: 0;
      color: var(--muted);
      font-size: 0.75rem;
    }

    .event-info .event-category {
      color: var(--coral);
      font-size: 0.61rem;
      font-weight: 800;
      letter-spacing: 0.11em;
      text-transform: uppercase;
    }

    .event-actions {
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      gap: 10px;
    }

    .event-price {
      color: var(--muted);
      font-size: 0.64rem;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    .schedule-aside {
      position: sticky;
      top: 112px;
    }

    .aside-card {
      margin-bottom: 18px;
      padding: 25px;
      border: 1px solid var(--line);
      background: var(--paper);
    }

    .aside-card--dark {
      color: var(--white);
      background: var(--ink);
    }

    .aside-card__label {
      display: block;
      margin-bottom: 15px;
      color: var(--coral);
      font-size: 0.62rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }

    .aside-card h3 {
      margin: 0 0 12px;
      font-family: var(--serif);
      font-size: 1.55rem;
      font-weight: 500;
      line-height: 1.2;
    }

    .aside-card p {
      margin: 0 0 18px;
      color: var(--muted);
      font-size: 0.78rem;
    }

    .aside-card--dark p {
      color: rgba(255, 255, 255, 0.62);
    }

    .venue-list {
      margin: 20px 0 0;
      padding: 0;
      list-style: none;
    }

    .venue-list li {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 11px 0;
      border-top: 1px solid var(--line);
      font-size: 0.72rem;
    }

    .venue-list span {
      color: var(--muted);
    }

    .gallery-grid {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      grid-auto-rows: 230px;
      gap: 16px;
    }

    .gallery-card {
      position: relative;
      display: block;
      width: 100%;
      height: 100%;
      padding: 0;
      overflow: hidden;
      border: 0;
      background: #2a2924;
      cursor: zoom-in;
      text-align: left;
    }

    .gallery-card:nth-child(1) {
      grid-column: span 7;
      grid-row: span 2;
    }

    .gallery-card:nth-child(2) {
      grid-column: span 5;
      grid-row: span 2;
    }

    .gallery-card:nth-child(3) {
      grid-column: span 4;
      grid-row: span 2;
    }

    .gallery-card:nth-child(4) {
      grid-column: span 8;
      grid-row: span 2;
    }

    .gallery-card img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: saturate(0.78) contrast(1.05);
      transition: transform 0.75s cubic-bezier(.2,.7,.2,1), filter 0.4s ease;
    }

    .gallery-card::after {
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, transparent 40%, rgba(0, 0, 0, 0.8));
      content: "";
      transition: background 0.3s ease;
    }

    .gallery-card:hover img {
      transform: scale(1.04);
      filter: saturate(1) contrast(1.02);
    }

    .gallery-card__caption {
      position: absolute;
      z-index: 2;
      right: 24px;
      bottom: 22px;
      left: 24px;
      color: var(--white);
    }

    .gallery-card__caption span {
      display: block;
      margin-bottom: 8px;
      color: var(--acid);
      font-size: 0.61rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }

    .gallery-card__caption strong {
      display: block;
      font-family: var(--serif);
      font-size: clamp(1.3rem, 2.4vw, 2rem);
      font-weight: 500;
      line-height: 1.15;
    }

    .gallery-card__caption small {
      display: block;
      margin-top: 7px;
      color: rgba(255, 255, 255, 0.65);
      font-size: 0.64rem;
    }

    .gallery-footer {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 30px;
      margin-top: 32px;
      padding-top: 25px;
      border-top: 1px solid var(--line-light);
    }

    .gallery-footer p {
      max-width: 660px;
      margin: 0;
      color: rgba(255, 255, 255, 0.58);
      font-size: 0.8rem;
    }

    .spotlight-grid {
      display: grid;
      grid-template-columns: minmax(380px, 0.9fr) minmax(0, 1.1fr);
      gap: clamp(45px, 7vw, 100px);
      align-items: center;
    }

    .spotlight-portrait {
      position: relative;
    }

    .spotlight-portrait::before {
      position: absolute;
      z-index: 0;
      top: -20px;
      right: -20px;
      width: 55%;
      height: 45%;
      background: var(--acid);
      content: "";
    }

    .spotlight-portrait::after {
      position: absolute;
      z-index: 0;
      bottom: -20px;
      left: -20px;
      width: 48%;
      height: 38%;
      border: 1px solid var(--ink);
      content: "";
    }

    .spotlight-portrait img {
      position: relative;
      z-index: 1;
      width: 100%;
      aspect-ratio: 4 / 5;
      object-fit: cover;
      filter: saturate(0.75) contrast(1.03);
    }

    .portrait-caption {
      position: absolute;
      z-index: 2;
      right: -28px;
      bottom: 28px;
      max-width: 250px;
      padding: 18px 20px;
      color: var(--white);
      background: var(--ink);
    }

    .portrait-caption span {
      display: block;
      color: var(--acid);
      font-size: 0.59rem;
      font-weight: 800;
      letter-spacing: 0.11em;
      text-transform: uppercase;
    }

    .portrait-caption strong {
      display: block;
      margin-top: 7px;
      font-family: var(--serif);
      font-size: 1.15rem;
      font-weight: 500;
      line-height: 1.25;
    }

    .spotlight-copy h2 {
      margin: 0;
      font-family: var(--serif);
      font-size: clamp(3rem, 5.5vw, 5.6rem);
      font-weight: 500;
      letter-spacing: -0.055em;
      line-height: 0.98;
    }

    .spotlight-role {
      display: flex;
      flex-wrap: wrap;
      gap: 8px 15px;
      margin: 23px 0 26px;
      color: var(--muted);
      font-size: 0.67rem;
      font-weight: 800;
      letter-spacing: 0.1em;
      text-transform: uppercase;
    }

    .spotlight-role span + span::before {
      margin-right: 15px;
      content: "•";
    }

    .spotlight-copy > p {
      color: var(--ink-soft);
      font-size: 0.95rem;
    }

    .artist-quote {
      margin: 30px 0;
      padding: 24px 0 24px 26px;
      border-left: 3px solid var(--coral);
      font-family: var(--serif);
      font-size: clamp(1.35rem, 2.3vw, 2rem);
      font-style: italic;
      line-height: 1.42;
    }

    .artist-quote footer {
      margin-top: 12px;
      color: var(--muted);
      font-family: var(--sans);
      font-size: 0.62rem;
      font-style: normal;
      font-weight: 800;
      letter-spacing: 0.1em;
      text-transform: uppercase;
    }

    .artist-stats {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
      margin: 30px 0;
    }

    .artist-stat {
      padding: 16px 0;
      border-top: 1px solid var(--line);
    }

    .artist-stat strong {
      display: block;
      font-family: var(--serif);
      font-size: 1.55rem;
      font-weight: 500;
      line-height: 1;
    }

    .artist-stat span {
      display: block;
      margin-top: 8px;
      color: var(--muted);
      font-size: 0.59rem;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    .process-section {
      position: relative;
      overflow: hidden;
      background: var(--coral);
    }

    .process-section::before {
      position: absolute;
      top: -180px;
      right: -120px;
      width: 480px;
      height: 480px;
      border: 1px solid rgba(23, 23, 19, 0.18);
      border-radius: 50%;
      content: "";
    }

    .process-section::after {
      position: absolute;
      right: 100px;
      bottom: -220px;
      width: 440px;
      height: 440px;
      border: 1px solid rgba(23, 23, 19, 0.15);
      border-radius: 50%;
      content: "";
    }

    .process-grid {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: minmax(320px, 0.78fr) minmax(0, 1.22fr);
      gap: clamp(50px, 8vw, 120px);
      align-items: start;
    }

    .process-visual {
      position: relative;
    }

    .process-visual img {
      width: 100%;
      aspect-ratio: 4 / 5;
      object-fit: cover;
      filter: grayscale(0.25) contrast(1.05);
    }

    .process-note {
      position: absolute;
      right: -28px;
      bottom: 30px;
      width: min(310px, 80%);
      padding: 23px;
      border: 1px solid var(--ink);
      background: var(--acid);
      box-shadow: 10px 10px 0 var(--ink);
    }

    .process-note span {
      font-size: 0.6rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }

    .process-note strong {
      display: block;
      margin: 10px 0 7px;
      font-family: var(--serif);
      font-size: 1.4rem;
      font-weight: 500;
      line-height: 1.25;
    }

    .process-note p {
      margin: 0;
      font-size: 0.72rem;
    }

    .process-copy .display {
      max-width: 720px;
    }

    .process-copy__intro {
      max-width: 680px;
      margin: 25px 0 35px;
      font-size: 0.96rem;
    }

    .process-steps {
      margin: 0;
      padding: 0;
      list-style: none;
      border-top: 1px solid rgba(23, 23, 19, 0.32);
    }

    .process-step {
      display: grid;
      grid-template-columns: 54px minmax(0, 1fr);
      gap: 20px;
      padding: 27px 0;
      border-bottom: 1px solid rgba(23, 23, 19, 0.32);
    }

    .process-step__number {
      padding-top: 3px;
      font-size: 0.7rem;
      font-weight: 800;
      letter-spacing: 0.1em;
    }

    .process-step h3 {
      margin: 0 0 9px;
      font-family: var(--serif);
      font-size: 1.55rem;
      font-weight: 500;
      line-height: 1.2;
    }

    .process-step p {
      margin: 0;
      font-size: 0.82rem;
      line-height: 1.7;
    }

    .process-cta {
      margin-top: 30px;
    }

    .news-layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 340px;
      gap: 70px;
      align-items: start;
    }

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

    .news-item {
      display: grid;
      grid-template-columns: 115px minmax(0, 1fr) auto;
      gap: 28px;
      align-items: start;
      padding: 32px 0;
      border-bottom: 1px solid var(--line);
    }

    .news-item__date {
      color: var(--muted);
      font-size: 0.65rem;
      font-weight: 800;
      letter-spacing: 0.09em;
      line-height: 1.6;
      text-transform: uppercase;
    }

    .news-item h3 {
      margin: 8px 0 11px;
      font-family: var(--serif);
      font-size: clamp(1.5rem, 2.6vw, 2.15rem);
      font-weight: 500;
      letter-spacing: -0.035em;
      line-height: 1.18;
    }

    .news-item p {
      max-width: 740px;
      margin: 0;
      color: var(--muted);
      font-size: 0.82rem;
    }

    .news-item__category {
      color: var(--blue);
      font-size: 0.62rem;
      font-weight: 800;
      letter-spacing: 0.11em;
      text-transform: uppercase;
    }

    .news-item__arrow {
      display: grid;
      width: 42px;
      height: 42px;
      place-items: center;
      border: 1px solid var(--line);
      border-radius: 50%;
      font-size: 1.2rem;
      transition: color 0.2s ease, background 0.2s ease, transform 0.2s ease;
    }

    .news-item:hover .news-item__arrow {
      color: var(--white);
      background: var(--ink);
      transform: translate(2px, -2px);
    }

    .newsletter-panel {
      position: sticky;
      top: 112px;
      padding: 34px;
      color: var(--white);
      background: var(--ink);
    }

    .newsletter-panel__mark {
      display: grid;
      width: 58px;
      height: 58px;
      place-items: center;
      margin-bottom: 26px;
      border-radius: 50%;
      color: var(--ink);
      background: var(--acid);
      font-family: var(--serif);
      font-size: 1.5rem;
    }

    .newsletter-panel h3 {
      margin: 0;
      font-family: var(--serif);
      font-size: 2rem;
      font-weight: 500;
      letter-spacing: -0.03em;
      line-height: 1.13;
    }

    .newsletter-panel > p {
      margin: 17px 0 24px;
      color: rgba(255, 255, 255, 0.62);
      font-size: 0.8rem;
    }

    .newsletter-form input {
      width: 100%;
      height: 50px;
      padding: 0 15px;
      border: 1px solid rgba(255, 255, 255, 0.26);
      border-radius: 0;
      color: var(--white);
      background: rgba(255, 255, 255, 0.07);
      outline: none;
    }

    .newsletter-form input::placeholder {
      color: rgba(255, 255, 255, 0.45);
    }

    .newsletter-form input:focus {
      border-color: var(--acid);
    }

    .newsletter-form .button {
      width: 100%;
      margin-top: 10px;
    }

    .form-message {
      min-height: 21px;
      margin: 12px 0 0;
      color: var(--acid);
      font-size: 0.7rem;
      font-weight: 700;
    }

    .newsletter-panel .fine-print {
      margin: 18px 0 0;
      color: rgba(255, 255, 255, 0.36);
      font-size: 0.6rem;
    }

    .voices-section {
      border-top: 1px solid var(--line);
      background: var(--paper-deep);
    }

    .voices-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
    }

    .voice-card {
      display: flex;
      min-height: 320px;
      flex-direction: column;
      justify-content: space-between;
      padding: 30px;
      border: 1px solid var(--line);
      background: var(--white);
    }

    .voice-card__mark {
      color: var(--coral);
      font-family: var(--serif);
      font-size: 4rem;
      line-height: 0.7;
    }

    .voice-card blockquote {
      margin: 28px 0;
      font-family: var(--serif);
      font-size: 1.35rem;
      letter-spacing: -0.02em;
      line-height: 1.45;
    }

    .voice-card__person {
      display: flex;
      align-items: center;
      gap: 12px;
      padding-top: 20px;
      border-top: 1px solid var(--line);
    }

    .voice-card__person img {
      width: 43px;
      height: 43px;
      border-radius: 50%;
      object-fit: cover;
    }

    .voice-card__person strong {
      display: block;
      font-size: 0.75rem;
    }

    .voice-card__person span {
      display: block;
      margin-top: 2px;
      color: var(--muted);
      font-size: 0.62rem;
    }

    .faq-layout {
      display: grid;
      grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.28fr);
      gap: clamp(50px, 8vw, 110px);
      align-items: start;
    }

    .faq-intro {
      position: sticky;
      top: 112px;
    }

    .faq-intro p {
      max-width: 420px;
      color: var(--muted);
      font-size: 0.88rem;
    }

    .faq-list {
      border-top: 1px solid var(--line);
    }

    .faq-item {
      border-bottom: 1px solid var(--line);
    }

    .faq-item summary {
      position: relative;
      padding: 27px 55px 27px 0;
      cursor: pointer;
      font-family: var(--serif);
      font-size: clamp(1.2rem, 2vw, 1.55rem);
      font-weight: 500;
      list-style: none;
    }

    .faq-item summary::-webkit-details-marker {
      display: none;
    }

    .faq-item summary::after {
      position: absolute;
      top: 50%;
      right: 4px;
      width: 30px;
      height: 30px;
      border: 1px solid var(--line);
      border-radius: 50%;
      content: "+";
      font-family: var(--sans);
      font-size: 1.1rem;
      font-weight: 400;
      line-height: 28px;
      text-align: center;
      transform: translateY(-50%);
    }

    .faq-item[open] summary::after {
      content: "−";
      color: var(--white);
      background: var(--ink);
    }

    .faq-item__answer {
      max-width: 700px;
      padding: 0 50px 28px 0;
      color: var(--muted);
      font-size: 0.84rem;
    }

    .faq-item__answer p {
      margin: 0 0 12px;
    }

    .site-footer {
      padding: 72px 0 28px;
      color: var(--white);
      background: var(--ink);
    }

    .footer-top {
      display: grid;
      grid-template-columns: 1.45fr 0.75fr 0.75fr 1fr;
      gap: 50px;
      padding-bottom: 60px;
    }

    .footer-brand .brand {
      color: var(--white);
    }

    .footer-brand .brand__tagline {
      color: rgba(255, 255, 255, 0.48);
    }

    .footer-brand > p {
      max-width: 390px;
      margin: 25px 0;
      color: rgba(255, 255, 255, 0.58);
      font-size: 0.82rem;
    }

    .social-links {
      display: flex;
      gap: 9px;
    }

    .social-links a {
      display: grid;
      width: 40px;
      height: 40px;
      place-items: center;
      border: 1px solid var(--line-light);
      border-radius: 50%;
      color: rgba(255, 255, 255, 0.76);
      font-size: 0.66rem;
      font-weight: 800;
      transition: color 0.2s ease, background 0.2s ease;
    }

    .social-links a:hover {
      color: var(--ink);
      background: var(--acid);
    }

    .footer-column h3 {
      margin: 0 0 20px;
      color: var(--acid);
      font-size: 0.64rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }

    .footer-column ul {
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .footer-column li + li {
      margin-top: 10px;
    }

    .footer-column a,
    .footer-column address {
      color: rgba(255, 255, 255, 0.65);
      font-size: 0.75rem;
      font-style: normal;
      line-height: 1.7;
      transition: color 0.2s ease;
    }

    .footer-column a:hover {
      color: var(--white);
    }

    .footer-bottom {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 30px;
      padding-top: 25px;
      border-top: 1px solid var(--line-light);
    }

    .footer-bottom p,
    .footer-legal a {
      margin: 0;
      color: rgba(255, 255, 255, 0.4);
      font-size: 0.61rem;
      font-weight: 700;
      letter-spacing: 0.06em;
      text-transform: uppercase;
    }

    .footer-legal {
      display: flex;
      gap: 22px;
    }

    .footer-legal a:hover {
      color: var(--white);
    }

    .ticket-dialog,
    .gallery-dialog {
      max-width: none;
      max-height: none;
      padding: 0;
      border: 0;
      background: transparent;
    }

    .ticket-dialog {
      width: min(calc(100% - 32px), 520px);
    }

    .ticket-dialog[open] {
      animation: dialogIn 0.25s ease both;
    }

    @keyframes dialogIn {
      from { opacity: 0; transform: translateY(18px) scale(0.98); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }

    .ticket-dialog::backdrop,
    .gallery-dialog::backdrop {
      background: rgba(12, 12, 10, 0.74);
      backdrop-filter: blur(5px);
    }

    .ticket-dialog__inner {
      position: relative;
      padding: 40px;
      background: var(--white);
      box-shadow: var(--shadow);
    }

    .dialog-close {
      position: absolute;
      z-index: 3;
      top: 16px;
      right: 16px;
      display: grid;
      width: 38px;
      height: 38px;
      place-items: center;
      padding: 0;
      border: 1px solid var(--line);
      border-radius: 50%;
      background: var(--white);
      cursor: pointer;
      font-size: 1.3rem;
      line-height: 1;
    }

    .ticket-dialog .eyebrow {
      margin-bottom: 13px;
    }

    .ticket-dialog h2 {
      margin: 0;
      padding-right: 30px;
      font-family: var(--serif);
      font-size: 2.25rem;
      font-weight: 500;
      letter-spacing: -0.04em;
      line-height: 1.12;
    }

    .ticket-dialog__meta {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
      margin: 24px 0;
      padding: 18px 0;
      border-top: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
    }

    .ticket-dialog__meta span {
      display: block;
      color: var(--muted);
      font-size: 0.59rem;
      font-weight: 800;
      letter-spacing: 0.1em;
      text-transform: uppercase;
    }

    .ticket-dialog__meta strong {
      display: block;
      margin-top: 4px;
      font-size: 0.8rem;
    }

    .ticket-dialog label {
      display: block;
      margin-bottom: 7px;
      font-size: 0.65rem;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    .ticket-dialog input {
      width: 100%;
      height: 52px;
      padding: 0 15px;
      border: 1px solid var(--line);
      border-radius: 0;
      background: var(--paper);
      outline: none;
    }

    .ticket-dialog input:focus {
      border-color: var(--ink);
    }

    .ticket-dialog .button {
      width: 100%;
      margin-top: 12px;
    }

    .ticket-dialog__fine {
      margin: 14px 0 0;
      color: var(--muted);
      font-size: 0.64rem;
      text-align: center;
    }

    .ticket-confirmation {
      display: none;
      margin-top: 20px;
      padding: 16px;
      border-left: 3px solid var(--acid);
      background: var(--ink);
      color: var(--white);
      font-size: 0.78rem;
    }

    .ticket-confirmation.is-visible {
      display: block;
    }

    .gallery-dialog {
      width: min(calc(100% - 32px), 1080px);
    }

    .gallery-dialog__inner {
      position: relative;
      color: var(--white);
      background: var(--ink);
      box-shadow: var(--shadow);
    }

    .gallery-dialog__image {
      width: 100%;
      max-height: 74vh;
      aspect-ratio: 16 / 9;
      object-fit: cover;
    }

    .gallery-dialog__bar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 25px;
      padding: 20px 24px;
    }

    .gallery-dialog__caption strong {
      display: block;
      font-family: var(--serif);
      font-size: 1.2rem;
      font-weight: 500;
    }

    .gallery-dialog__caption span {
      display: block;
      margin-top: 4px;
      color: rgba(255, 255, 255, 0.52);
      font-size: 0.65rem;
    }

    .gallery-dialog__controls {
      display: flex;
      gap: 8px;
    }

    .gallery-dialog__controls button {
      display: grid;
      width: 42px;
      height: 42px;
      place-items: center;
      padding: 0;
      border: 1px solid var(--line-light);
      border-radius: 50%;
      color: var(--white);
      background: transparent;
      cursor: pointer;
    }

    .gallery-dialog__controls button:hover {
      color: var(--ink);
      background: var(--acid);
    }

    .gallery-dialog .dialog-close {
      top: 16px;
      right: 16px;
      color: var(--white);
      background: var(--ink);
      border-color: rgba(255, 255, 255, 0.4);
    }

    .reveal {
      opacity: 0;
      transform: translateY(24px);
      transition: opacity 0.7s ease, transform 0.7s ease;
    }

    .reveal.is-visible {
      opacity: 1;
      transform: translateY(0);
    }

    @media (max-width: 1100px) {
      .primary-nav ul {
        gap: 18px;
      }

      .primary-nav a {
        font-size: 0.65rem;
      }

      .header__action {
        display: none;
      }

      .hero__grid {
        grid-template-columns: minmax(0, 1fr) minmax(380px, 0.8fr);
      }

      .hero h1 {
        font-size: clamp(4rem, 8vw, 6.4rem);
      }

      .radar {
        grid-template-columns: repeat(3, 1fr);
      }

      .radar__title {
        grid-column: 1 / -1;
        padding: 22px 0;
      }

      .radar__item:first-of-type {
        border-left: 0;
      }

      .footer-top {
        grid-template-columns: 1.4fr repeat(3, 1fr);
        gap: 30px;
      }
    }

    @media (max-width: 920px) {
      .section {
        padding: 86px 0;
      }

      .section-heading {
        grid-template-columns: 1fr;
        gap: 24px;
      }

      .primary-nav {
        position: fixed;
        z-index: 99;
        top: 122px;
        right: 0;
        bottom: 0;
        left: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 30px;
        visibility: hidden;
        background: var(--paper);
        opacity: 0;
        transform: translateY(-12px);
        transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
      }

      .primary-nav.is-open {
        visibility: visible;
        opacity: 1;
        transform: translateY(0);
      }

      .primary-nav ul {
        flex-direction: column;
        gap: 5px;
      }

      .primary-nav a {
        padding: 10px;
        font-family: var(--serif);
        font-size: 2.2rem;
        font-weight: 500;
        letter-spacing: -0.03em;
        text-transform: none;
      }

      .primary-nav a::after {
        display: none;
      }

      .menu-toggle {
        display: block;
        justify-self: end;
      }

      .header__inner {
        grid-template-columns: 1fr auto;
      }

      .hero__grid {
        min-height: auto;
        grid-template-columns: 1fr;
      }

      .hero__content {
        min-height: 690px;
        padding-right: 0;
      }

      .hero__media {
        min-height: 600px;
      }

      .briefing-grid {
        grid-template-columns: 1fr;
      }

      .side-stories {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto;
      }

      .side-story {
        grid-template-columns: 1fr;
      }

      .side-story img {
        height: 220px;
      }

      .schedule-layout,
      .news-layout {
        grid-template-columns: 1fr;
      }

      .schedule-aside,
      .newsletter-panel,
      .faq-intro {
        position: static;
      }

      .schedule-aside {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 18px;
      }

      .aside-card {
        margin-bottom: 0;
      }

      .spotlight-grid,
      .process-grid,
      .faq-layout {
        grid-template-columns: 1fr;
      }

      .spotlight-portrait {
        width: min(100%, 560px);
      }

      .process-visual {
        width: min(100%, 520px);
      }

      .voices-grid {
        grid-template-columns: 1fr;
      }

      .voice-card {
        min-height: 260px;
      }

      .footer-top {
        grid-template-columns: 1.5fr 1fr 1fr;
      }

      .footer-brand {
        grid-column: 1 / -1;
      }
    }

    @media (max-width: 680px) {
      .container {
        width: min(calc(100% - 30px), var(--container));
      }

      .topline__inner {
        justify-content: center;
      }

      .topline__edition,
      .topline a {
        display: none;
      }

      .site-header {
        top: 0;
      }

      .header__inner {
        min-height: 76px;
      }

      .brand__logo {
        width: 42px;
        height: 42px;
      }

      .brand__tagline {
        display: none;
      }

      .primary-nav {
        top: 112px;
      }

      .hero__content {
        min-height: 600px;
        padding: 64px 0 58px;
      }

      .hero h1 {
        font-size: clamp(3.55rem, 16vw, 5.2rem);
      }

      .hero__signals {
        gap: 8px;
      }

      .signal strong {
        font-size: 1.35rem;
      }

      .signal span {
        font-size: 0.53rem;
      }

      .hero__media {
        min-height: 500px;
      }

      .hero__badge {
        top: 24px;
        left: 18px;
        width: 105px;
        height: 105px;
        font-size: 0.56rem;
      }

      .lead-story__content {
        grid-template-columns: 1fr;
        padding: 27px 24px 30px;
      }

      .side-stories {
        grid-template-columns: 1fr;
      }

      .side-story {
        grid-template-columns: 40% 60%;
      }

      .side-story img {
        height: 100%;
      }

      .radar {
        grid-template-columns: 1fr;
      }

      .radar__item {
        padding-left: 0;
        border-left: 0;
        border-bottom: 1px solid var(--line);
      }

      .radar__item:last-child {
        border-bottom: 0;
      }

      .calendar-toolbar {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
      }

      .event-list {
        padding: 0 18px;
      }

      .event-item {
        grid-template-columns: 57px minmax(0, 1fr);
        gap: 16px;
      }

      .event-actions {
        grid-column: 2;
        align-items: flex-start;
        flex-direction: row;
      }

      .schedule-aside {
        grid-template-columns: 1fr;
      }

      .gallery-grid {
        grid-template-columns: 1fr;
        grid-auto-rows: 300px;
      }

      .gallery-card:nth-child(n) {
        grid-column: 1;
        grid-row: span 1;
      }

      .gallery-card:nth-child(2) {
        grid-row: span 1;
      }

      .gallery-footer {
        align-items: flex-start;
        flex-direction: column;
      }

      .spotlight-grid {
        gap: 55px;
      }

      .portrait-caption {
        right: -10px;
      }

      .artist-stats {
        gap: 8px;
      }

      .process-note {
        right: -6px;
      }

      .news-item {
        grid-template-columns: 1fr auto;
        gap: 14px;
      }

      .news-item__date {
        grid-column: 1 / -1;
      }

      .news-item__arrow {
        grid-column: 2;
        grid-row: 2;
      }

      .newsletter-panel {
        padding: 28px;
      }

      .gallery-dialog__bar {
        align-items: flex-start;
        flex-direction: column;
      }

      .footer-top {
        grid-template-columns: 1fr 1fr;
      }

      .footer-brand {
        grid-column: 1 / -1;
      }

      .footer-bottom {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
      }
    }

    @media (max-width: 440px) {
      .hero__actions,
      .hero__actions .button {
        width: 100%;
      }

      .hero__signals {
        grid-template-columns: 1fr 1fr;
      }

      .hero__signals .signal:last-child {
        display: none;
      }

      .side-story {
        grid-template-columns: 1fr;
      }

      .side-story img {
        height: 210px;
      }

      .event-item {
        grid-template-columns: 1fr;
      }

      .event-date {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 0 0 12px;
        border-right: 0;
        border-bottom: 1px solid var(--line);
        text-align: left;
      }

      .event-date strong {
        font-size: 1.5rem;
      }

      .event-date span {
        margin: 0;
      }

      .event-actions {
        grid-column: 1;
      }

      .artist-stats {
        grid-template-columns: 1fr;
      }

      .footer-top {
        grid-template-columns: 1fr;
      }

      .footer-brand {
        grid-column: 1;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      html {
        scroll-behavior: auto;
      }

      *,
      *::before,
      *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
      }

      .reveal {
        opacity: 1;
        transform: none;
      }
    }
  </style>
</head>

<body>
  <a class="skip-link" href="#main-content">Skip to main content</a>

  <div class="topline">
    <div class="container topline__inner">
      <span class="topline__signal">
        <span class="live-dot" aria-hidden="true"></span>
        Independent culture desk
      </span>
      <span class="topline__edition">Edition 04 / Summer 2025</span>
      <a href="#newsletter">Get the Friday Dispatch →</a>
    </div>
  </div>

  <header class="site-header" id="siteHeader">
    <div class="container header__inner">
      <a class="brand" href="#top" aria-label="Signal and Stage home">
        <img class="brand__logo" src="https://placehold.co/96x96/d9ff57/171713?text=S%2B&amp;font=montserrat" alt="Signal and Stage logo placeholder">
        <span>
          <span class="brand__name">Signal &amp; Stage</span>
          <span class="brand__tagline">Where culture moves forward</span>
        </span>
      </a>

      <nav class="primary-nav" id="primaryNav" aria-label="Primary navigation">
        <ul>
          <li><a href="#latest" aria-current="page">Latest</a></li>
          <li><a href="#galleries">Galleries</a></li>
          <li><a href="#tickets">Tickets</a></li>
          <li><a href="#news">News</a></li>
          <li><a href="#artists">Artists</a></li>
          <li><a href="#process">Process</a></li>
          <li><a href="#about">About</a></li>
        </ul>
      </nav>

      <a class="button button--small header__action" href="#newsletter">Join the list <span class="arrow" aria-hidden="true">↗</span></a>

      <button class="menu-toggle" id="menuToggle" type="button" aria-expanded="false" aria-controls="primaryNav" aria-label="Open navigation">
        <span></span>
        <span></span>
        <span></span>
      </button>
    </div>
  </header>

  <main id="main-content">
    <section class="hero" id="top">
      <div class="container hero__grid">
        <div class="hero__content">
          <div class="hero__issue">
            <span>New</span>
            The city as ensemble
          </div>

          <h1>Culture is a <em>team sport.</em></h1>

          <p class="hero__dek">
            Signal &amp; Stage is an independent editorial platform and city guide for artists, institutions, and audiences. We report on the installations, performances, and people moving culture forward—without the noise.
          </p>

          <div class="hero__actions">
            <a class="button" href="#latest">Explore the stories <span class="arrow" aria-hidden="true">↗</span></a>
            <a class="button button--outline" href="#tickets">Find an event <span class="arrow" aria-hidden="true">→</span></a>
          </div>

          <div class="hero__signals" aria-label="Signal and Stage at a glance">
            <div class="signal">
              <strong>120+</strong>
              <span>Artists tracked</span>
            </div>
            <div class="signal">
              <strong>38</strong>
              <span>Creative cities</span>
            </div>
            <div class="signal">
              <strong>4.9K</strong>
              <span>Culture readers</span>
            </div>
          </div>
        </div>

        <figure class="hero__media">
          <img src="https://picsum.photos/seed/signal-stage-hero/900/1100" alt="Artist working in a dramatic, light-filled creative studio" width="900" height="1100" fetchpriority="high">
          <div class="hero__badge">Independent voices, shared stages</div>
          <figcaption class="hero__media-label">
            <p><small>Cover story / Field Notes</small>Inside the artists turning an empty warehouse into a living stage</p>
            <span class="arrow" aria-hidden="true">↗</span>
          </figcaption>
        </figure>
      </div>
    </section>

    <div class="ticker" aria-hidden="true">
      <div class="ticker__track">
        <span>Film</span><span>Music</span><span>Theatre</span><span>Visual Art</span><span>Design</span><span>Dance</span><span>Publishing</span>
        <span>Film</span><span>Music</span><span>Theatre</span><span>Visual Art</span><span>Design</span><span>Dance</span><span>Publishing</span>
      </div>
    </div>

    <section class="section section--line" id="latest">
      <div class="container">
        <div class="section-heading reveal">
          <div>
            <p class="eyebrow">01 / The briefing</p>
            <h2 class="display">Worth your full <em>attention.</em></h2>
          </div>
          <p class="section-heading__copy">
            A considered edit of the week’s most consequential work, conversations, and ideas. No press-release filler—just the context you need to understand what is happening in the arts.
          </p>
        </div>

        <div class="briefing-grid">
          <article class="lead-story reveal">
            <a class="lead-story__image" href="#news" aria-label="Read Inside the 14-minute city">
              <img src="https://picsum.photos/seed/opera-city-stage/1200/760" alt="Performers crossing a large urban stage during a contemporary opera" width="1200" height="760">
            </a>
            <div class="lead-story__content">
              <div>
                <span class="story-tag">Performing arts</span>
                <h3><a href="#news">Inside the 14-minute city: a new opera changes the rhythm of downtown</a></h3>
                <div class="story-meta">
                  <span>By Lena Ortiz</span>
                  <span>8 min read</span>
                </div>
              </div>
              <div class="lead-story__copy">
                <p>
                  Composer Idris Vale’s site-specific work unfolds across three city blocks, asking pedestrians to become reluctant participants in the final act. Its premiere is less a traditional curtain-up than a negotiated civic ritual.
                </p>
                <a class="text-link" href="#news">Read the full story <span class="arrow" aria-hidden="true">↗</span></a>
              </div>
            </div>
          </article>

          <div class="side-stories">
            <article class="side-story reveal">
              <img src="https://picsum.photos/seed/independent-cinema/700/520" alt="A glowing cinema screen in a dark independent movie theater" width="700" height="520" loading="lazy">
              <div class="side-story__content">
                <span class="story-tag">Film</span>
                <h3><a href="#news">The small cinemas making midnight screenings matter again</a></h3>
                <p>
                  Community-run venues are pairing repertory programming with local DJ nights, building audiences one improbable double feature at a time.
                </p>
              </div>
            </article>

            <article class="side-story reveal">
              <img src="https://picsum.photos/seed/sound-art-room/700/520" alt="An immersive sound art installation with sculptural lighting" width="700" height="520" loading="lazy">
              <div class="side-story__content">
                <span class="story-tag">Sound art</span>
                <h3><a href="#galleries">Why listening rooms are becoming the new gallery</a></h3>
                <p>
                  Spatial composers are building intimate venues where architecture, acoustics, and technology make silence as visible as the performance itself.
                </p>
              </div>
            </article>
          </div>
        </div>

        <div class="radar reveal">
          <div class="radar__title">
            <span>Also on our radar</span>
            <strong>Three signals worth following.</strong>
          </div>
          <article class="radar__item">
            <span class="story-tag">Residencies</span>
            <h4>Five artists receive the new Civic Memory residency.</h4>
            <p>The year-long program pairs cultural research with public commissions in libraries, transit hubs, and civic archives.</p>
          </article>
          <article class="radar__item">
            <span class="story-tag">Publishing</span>
            <h4>A new imprint for books that could never sit still.</h4>
            <p>Field Notes Editions will publish hybrid works, artist interviews, and scores designed to be performed in the home.</p>
          </article>
          <article class="radar__item">
            <span class="story-tag">Design</span>
            <h4>The backstage is getting a serious sustainability rethink.</h4>
            <p>Touring ensembles are testing reusable scenic systems, shared freight schedules, and modular lighting inventories.</p>
          </article>
        </div>
      </div>
    </section>

    <section class="section schedule-section" id="tickets">
      <div class="container">
        <div class="section-heading reveal">
          <div>
            <p class="eyebrow">02 / Your week, considered</p>
            <h2 class="display">This week, <em>on stage.</em></h2>
          </div>
          <div>
            <p class="section-heading__copy">
              A handpicked calendar of performances, screenings, installations, and open studios. Filter by day, find your room, and reserve without losing the plot.
            </p>
            <a class="text-link" href="#tickets" style="margin-top:20px">Browse the full calendar <span class="arrow" aria-hidden="true">→</span></a>
          </div>
        </div>

        <div class="schedule-layout">
          <div class="calendar-panel reveal">
            <div class="calendar-toolbar">
              <strong>June 12–15, 2025</strong>
              <span id="eventCount">8 events showing</span>
            </div>

            <div class="day-filter" role="group" aria-label="Filter events by day">
              <button type="button" data-filter="all" aria-pressed="true">All dates <span>Curated</span></button>
              <button type="button" data-filter="thu" aria-pressed="false">Thu 12 <span>2 events</span></button>
              <button type="button" data-filter="fri" aria-pressed="false">Fri 13 <span>2 events</span></button>
              <button type="button" data-filter="sat" aria-pressed="false">Sat 14 <span>2 events</span></button>
              <button type="button" data-filter="sun" aria-pressed="false">Sun 15 <span>2 events</span></button>
            </div>

            <div class="event-list" id="eventList">
              <article class="event-item" data-day="thu">
                <div class="event-date"><strong>12</strong><span>Thu</span></div>
                <div class="event-info">
                  <span class="event-category">Music</span>
                  <h3>Low Light: an evening concert</h3>
                  <p>7:30 PM · The Lantern Room · Lower East Side</p>
                </div>
                <div class="event-actions">
                  <span class="event-price">From $28</span>
                  <button class="button button--small js-ticket" type="button" data-title="Low Light: an evening concert" data-date="Thursday, June 12" data-time="7:30 PM" data-venue="The Lantern Room" data-price="From $28">Tickets</button>
                </div>
              </article>

              <article class="event-item" data-day="thu">
                <div class="event-date"><strong>12</strong><span>Thu</span></div>
                <div class="event-info">
                  <span class="event-category">Installation</span>
                  <h3>Archive of Air</h3>
                  <p>6:00 PM · Northline Gallery · West Village</p>
                </div>
                <div class="event-actions">
                  <span class="event-price">Free entry</span>
                  <button class="button button--small js-ticket" type="button" data-title="Archive of Air" data-date="Thursday, June 12" data-time="6:00 PM" data-venue="Northline Gallery" data-price="Free entry">Reserve</button>
                </div>
              </article>

              <article class="event-item" data-day="fri">
                <div class="event-date"><strong>13</strong><span>Fri</span></div>
                <div class="event-info">
                  <span class="event-category">Film</span>
                  <h3>Afterimage — premiere screening</h3>
                  <p>8:00 PM · Meridian Theatre · Downtown</p>
                </div>
                <div class="event-actions">
                  <span class="event-price">$16</span>
                  <button class="button button--small js-ticket" type="button" data-title="Afterimage — premiere screening" data-date="Friday, June 13" data-time="8:00 PM" data-venue="Meridian Theatre" data-price="$16">Tickets</button>
                </div>
              </article>

              <article class="event-item" data-day="fri">
                <div class="event-date"><strong>13</strong><span>Fri</span></div>
                <div class="event-info">
                  <span class="event-category">Theatre</span>
                  <h3>Common Ground</h3>
                  <p>7:00 PM · Civic Arts Hall · Midtown</p>
                </div>
                <div class="event-actions">
                  <span class="event-price">From $22</span>
                  <button class="button button--small js-ticket" type="button" data-title="Common Ground" data-date="Friday, June 13" data-time="7:00 PM" data-venue="Civic Arts Hall" data-price="From $22">Tickets</button>
                </div>
              </article>

              <article class="event-item" data-day="sat">
                <div class="event-date"><strong>14</strong><span>Sat</span></div>
                <div class="event-info">
                  <span class="event-category">Live music</span>
                  <h3>Maya Okafor: Soft Signal</h3>
                  <p>8:00 PM · Hall C · Brooklyn Navy Yard</p>
                </div>
                <div class="event-actions">
                  <span class="event-price">$32</span>
                  <button class="button button--small js-ticket" type="button" data-title="Maya Okafor: Soft Signal" data-date="Saturday, June 14" data-time="8:00 PM" data-venue="Hall C" data-price="$32">Tickets</button>
                </div>
              </article>

              <article class="event-item" data-day="sat">
                <div class="event-date"><strong>14</strong><span>Sat</span></div>
                <div class="event-info">
                  <span class="event-category">Performance</span>
                  <h3>The Last Set</h3>
                  <p>3:00 PM · Pier 27 · Hudson River</p>
                </div>
                <div class="event-actions">
                  <span class="event-price">$12</span>
                  <button class="button button--small js-ticket" type="button" data-title="The Last Set" data-date="Saturday, June 14" data-time="3:00 PM" data-venue="Pier 27" data-price="$12">Tickets</button>
                </div>
              </article>

              <article class="event-item" data-day="sun">
                <div class="event-date"><strong>15</strong><span>Sun</span></div>
                <div class="event-info">
                  <span class="event-category">Open studios</span>
                  <h3>Eastside Open Studios</h3>
                  <p>11:00 AM · River Works · Long Island City</p>
                </div>
                <div class="event-actions">
                  <span class="event-price">Free entry</span>
                  <button class="button button--small js-ticket" type="button" data-title="Eastside Open Studios" data-date="Sunday, June 15" data-time="11:00 AM" data-venue="River Works" data-price="Free entry">Reserve</button>
                </div>
              </article>

              <article class="event-item" data-day="sun">
                <div class="event-date"><strong>15</strong><span>Sun</span></div>
                <div class="event-info">
                  <span class="event-category">Spoken word</span>
                  <h3>New Voices reading room</h3>
                  <p>4:00 PM · Forum Library · Harlem</p>
                </div>
                <div class="event-actions">
                  <span class="event-price">Pay what you can</span>
                  <button class="button button--small js-ticket" type="button" data-title="New Voices reading room" data-date="Sunday, June 15" data-time="4:00 PM" data-venue="Forum Library" data-price="Pay what you can">Reserve</button>
                </div>
              </article>
            </div>
          </div>

          <aside class="schedule-aside" aria-label="Event recommendations">
            <div class="aside-card aside-card--dark reveal">
              <span class="aside-card__label">Tonight’s pick</span>
              <h3>Low Light</h3>
              <p>
                A candlelit chamber set that moves from close harmony to live electronics without losing the intimacy of the room.
              </p>
              <button class="button button--light button--small js-ticket" type="button" data-title="Low Light: an evening concert" data-date="Thursday, June 12" data-time="7:30 PM" data-venue="The Lantern Room" data-price="From $28">Get tickets <span class="arrow" aria-hidden="true">↗</span></button>
            </div>

            <div class="aside-card reveal">
              <span class="aside-card__label">Venue spotlight</span>
              <h3>The Lantern Room</h3>
              <p>
                A 90-seat room beneath an old sign workshop, known for careful sound and unhurried programming.
              </p>
              <ul class="venue-list">
                <li>Seating <span>90</span></li>
                <li>Neighborhood <span>Lower East Side</span></li>
                <li>Best for <span>Listening</span></li>
              </ul>
            </div>
          </aside>
        </div>
      </div>
    </section>

    <section class="section section--dark" id="galleries">
      <div class="container">
        <div class="section-heading reveal">
          <div>
            <p class="eyebrow eyebrow--acid">03 / Visual archive</p>
            <h2 class="display">Frames worth <em>keeping.</em></h2>
          </div>
          <p class="section-heading__copy">
            Installations, performance stills, exhibitions, and visual notes from independent artists. Every image is selected by our editors and paired with the story behind the work.
          </p>
        </div>

        <div class="gallery-grid">
          <button class="gallery-card js-gallery" type="button" data-index="0" data-src="https://picsum.photos/seed/soft-signal-large/1600/1100" data-caption="Soft Signal — light study no. 7" data-credit="Maya Okafor / Installation, 2025">
            <img src="https://picsum.photos/seed/soft-signal/1200/900" alt="Immersive colored light installation in a dark gallery" width="1200" height="900" loading="lazy">
            <span class="gallery-card__caption">
              <span>Installation / 2025</span>
              <strong>Soft Signal — light study no. 7</strong>
              <small>Photograph by Nia Bell</small>
            </span>
          </button>

          <button class="gallery-card js-gallery" type="button" data-index="1" data-src="https://picsum.photos/seed/blue-hour-large/1200/1500" data-caption="Blue Hour, 19:42" data-credit="Caro Mensah / Photography, 2024">
            <img src="https://picsum.photos/seed/blue-hour/800/1000" alt="Moody blue hour portrait from a photography series" width="800" height="1000" loading="lazy">
            <span class="gallery-card__caption">
              <span>Photography / 2024</span>
              <strong>Blue Hour, 19:42</strong>
              <small>From the series “Night Bus”</small>
            </span>
          </button>

          <button class="gallery-card js-gallery" type="button" data-index="2" data-src="https://picsum.photos/seed/untitled-rehearsal-large/1200/1100" data-caption="Untitled (Rehearsal)" data-credit="Emil Varga / Performance, 2025">
            <img src="https://picsum.photos/seed/untitled-rehearsal/800/700" alt="Dancer in motion during a rehearsal for a contemporary performance" width="800" height="700" loading="lazy">
            <span class="gallery-card__caption">
              <span>Performance / 2025</span>
              <strong>Untitled (Rehearsal)</strong>
              <small>Emil Varga with Assembly 04</small>
            </span>
          </button>

          <button class="gallery-card js-gallery" type="button" data-index="3" data-src="https://picsum.photos/seed/residual-forms-large/1600/1000" data-caption="Residual Forms, detail" data-credit="Kinetic Assembly / Sculpture, 2025">
            <img src="https://picsum.photos/seed/residual-forms/1200/800" alt="Abstract sculptural forms in a contemporary gallery" width="1200" height="800" loading="lazy">
            <span class="gallery-card__caption">
              <span>Sculpture / 2025</span>
              <strong>Residual Forms, detail</strong>
              <small>Kinetic Assembly</small>
            </span>
          </button>
        </div>

        <div class="gallery-footer">
          <p>
            New visual stories are published every week, with captions, artist notes, and practical details for visiting the work.
          </p>
          <button class="button button--light js-open-gallery" type="button" data-index="0">View gallery <span class="arrow" aria-hidden="true">↗</span></button>
        </div>
      </div>
    </section>

    <section class="section" id="artists">
      <div class="container spotlight-grid">
        <div class="spotlight-portrait reveal">
          <img src="https://i.pravatar.cc/760?u=maya-okafor" alt="Portrait of multidisciplinary artist Maya Okafor" width="760" height="950" loading="lazy">
          <div class="portrait-caption">
            <span>Artist notebook / 04</span>
            <strong>“I want every room to feel briefly impossible.”</strong>
          </div>
        </div>

        <div class="spotlight-copy reveal">
          <p class="eyebrow">04 / Artist spotlight</p>
          <h2>Maya<br>Okafor</h2>
          <div class="spotlight-role">
            <span>Composer</span>
            <span>Sound artist</span>
            <span>Brooklyn, NY</span>
          </div>

          <p>
            Maya Okafor builds immersive works from field recordings, fractured chamber music, and the subtle electrical noise of shared spaces. Her current installation, <em>Soft Signal</em>, translates the hum of the city’s public infrastructure into a slowly changing composition.
          </p>
          <p>
            After a decade working across dance and opera, Okafor founded the collective listening practice Common Register. The ensemble now commissions composers, sound designers, and researchers to develop long-form work through an annual residency beside a working ferry terminal.
          </p>

          <blockquote class="artist-quote">
            “A composition can hold a city without trying to describe it. My job is to notice what is already there, then make the room listen differently.”
            <footer>— Maya Okafor</footer>
          </blockquote>

          <div class="artist-stats">
            <div class="artist-stat"><strong>14</strong><span>Works premiered</span></div>
            <div class="artist-stat"><strong>06</strong><span>Residencies</span></div>
            <div class="artist-stat"><strong>03</strong><span>Countries toured</span></div>
          </div>

          <div class="hero__actions">
            <a class="button" href="#process">Read the full conversation <span class="arrow" aria-hidden="true">↗</span></a>
            <a class="button button--outline" href="#newsletter">Follow Maya</a>
          </div>
        </div>
      </div>
    </section>

    <section class="section process-section" id="process">
      <div class="container process-grid">
        <div class="process-visual reveal">
          <img src="https://picsum.photos/seed/artist-studio-worktable/900/1120" alt="Artist materials, sketches, and recording equipment on a studio worktable" width="900" height="1120" loading="lazy">
          <div class="process-note">
            <span>Inside the residency</span>
            <strong>Common Register / Field Season 06</strong>
            <p>Applications for the next artist-led research cycle open this fall.</p>
          </div>
        </div>

        <div class="process-copy reveal">
          <p class="eyebrow">05 / The creative process</p>
          <h2 class="display">How an idea finds its <em>final form.</em></h2>
          <p class="process-copy__intro">
            Great work rarely arrives in a straight line. Artist Maya Okafor walks us through the listening, rehearsal, and restless revision behind <em>Soft Signal</em>—and why the installation is only finished when the public enters it.
          </p>

          <ol class="process-steps">
            <li class="process-step">
              <span class="process-step__number">01</span>
              <div>
                <h3>Listen for the fracture</h3>
                <p>
                  The first recordings are intentionally unfinished: ferry horns, ventilation systems, overheard fragments of speech. Okafor edits them for rhythm rather than fidelity, looking for the moment the city’s mechanical hum begins to sound musical—and the moment it refuses to.
                </p>
              </div>
            </li>

            <li class="process-step">
              <span class="process-step__number">02</span>
              <div>
                <h3>Build a shared language</h3>
                <p>
                  A six-person ensemble rehearses with movement, breath, and spatial cues rather than a fixed score. Each performer follows a set of sonic prompts, allowing the piece to adapt to the room and the number of people moving through it.
                </p>
              </div>
            </li>

            <li class="process-step">
              <span class="process-step__number">03</span>
              <div>
                <h3>Let the audience finish it</h3>
                <p>
                  The final installation shifts with each visitor’s motion. Sensors register changes in density and proximity, subtly altering the composition. The work is not played at an audience; it is completed in the act of attention.
                </p>
              </div>
            </li>
          </ol>

          <div class="process-cta">
            <a class="button button--coral" href="#newsletter">Join the artist waitlist <span class="arrow" aria-hidden="true">→</span></a>
          </div>
        </div>
      </div>
    </section>

    <section class="section" id="news">
      <div class="container">
        <div class="section-heading reveal">
          <div>
            <p class="eyebrow">06 / Field notes</p>
            <h2 class="display">Industry, reported with <em>context.</em></h2>
          </div>
          <p class="section-heading__copy">
            Funding shifts, touring models, institutional changes, and the practical decisions changing how creative work is made and sustained. Useful intelligence without the jargon.
          </p>
        </div>

        <div class="news-layout">
          <div class="news-list">
            <article class="news-item reveal">
              <div class="news-item__date">June 10<br>2025</div>
              <div>
                <span class="news-item__category">Institutional economics</span>
                <h3>Why regional venues are redesigning subscription models</h3>
                <p>
                  A growing group of mid-sized theatres is moving beyond the traditional season pass, testing flexible credits, community memberships, and pay-what-you-can tiers. The goal is not simply more revenue, but a more durable relationship with the people already living near the stage.
                </p>
              </div>
              <span class="news-item__arrow" aria-hidden="true">↗</span>
            </article>

            <article class="news-item reveal">
              <div class="news-item__date">June 07<br>2025</div>
              <div>
                <span class="news-item__category">Climate &amp; touring</span>
                <h3>The new climate brief for touring ensembles</h3>
                <p>
                  Independent groups are pooling freight data, sharing equipment inventories, and choosing shorter routing models to reduce the carbon cost of a national tour. The most effective proposals treat logistics as a creative constraint rather than an administrative afterthought.
                </p>
              </div>
              <span class="news-item__arrow" aria-hidden="true">↗</span>
            </article>

            <article class="news-item reveal">
              <div class="news-item__date">June 03<br>2025</div>
              <div>
                <span class="news-item__category">Creative labor</span>
                <h3>What a durable creative partnership looks like now</h3>
                <p>
                  More artists are negotiating transparent accounting, defined project windows, and ownership terms at the start of a collaboration. The result is not simply fairer paperwork; it is a better foundation for ambitious work that needs years rather than a single season.
                </p>
              </div>
              <span class="news-item__arrow" aria-hidden="true">↗</span>
            </article>

            <article class="news-item reveal">
              <div class="news-item__date">May 29<br>2025</div>
              <div>
                <span class="news-item__category">Technology</span>
                <h3>Can digital archives serve the room, not just the record?</h3>
                <p>
                  A new generation of performance databases is opening rehearsal notes, process footage, and oral histories to artists. Curators say the most interesting innovation is not better search, but a more reciprocal model of how cultural memory is shared.
                </p>
              </div>
              <span class="news-item__arrow" aria-hidden="true">↗</span>
            </article>
          </div>

          <aside class="newsletter-panel reveal" id="newsletter">
            <div class="newsletter-panel__mark" aria-hidden="true">S/S</div>
            <span class="aside-card__label">The Friday Dispatch</span>
            <h3>One email. The whole signal.</h3>
            <p>
              Our editors’ essential stories, five things worth seeing, and one useful idea for the week ahead. Sent every Friday, with no algorithmic filler.
            </p>
            <form class="newsletter-form" novalidate>
              <label for="newsletterEmail" class="sr-only" style="position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0">Email address</label>
              <input id="newsletterEmail" name="email" type="email" placeholder="you@example.com" autocomplete="email" required>
              <button class="button button--light" type="submit">Send me the dispatch <span class="arrow" aria-hidden="true">↗</span></button>
              <p class="form-message" role="status" aria-live="polite"></p>
            </form>
            <p class="fine-print">Free forever. No spam. Unsubscribe with one click.</p>
          </aside>
        </div>
      </div>
    </section>

    <section class="section voices-section">
      <div class="container">
        <div class="section-heading reveal">
          <div>
            <p class="eyebrow">07 / Backstage pass</p>
            <h2 class="display">From the people in the <em>room.</em></h2>
          </div>
          <p class="section-heading__copy">
            Artists, producers, archivists, and audience members share what deserves more attention—and what the cultural sector should stop overlooking.
          </p>
        </div>

        <div class="voices-grid">
          <article class="voice-card reveal">
            <div>
              <span class="voice-card__mark" aria-hidden="true">“</span>
              <blockquote>Signal &amp; Stage does the impossible: it makes the wider industry feel close enough to touch.</blockquote>
            </div>
            <div class="voice-card__person">
              <img src="https://i.pravatar.cc/100?u=leila-hassan" alt="Portrait of filmmaker Leila Hassan" width="100" height="100" loading="lazy">
              <div>
                <strong>Leila Hassan</strong>
                <span>Filmmaker, Cairo &amp; London</span>
              </div>
            </div>
          </article>

          <article class="voice-card reveal">
            <div>
              <span class="voice-card__mark" aria-hidden="true">“</span>
              <blockquote>The calendar helps me leave the house. The interviews are the reason I stay curious after I do.</blockquote>
            </div>
            <div class="voice-card__person">
              <img src="https://i.pravatar.cc/100?u=theo-bennett" alt="Portrait of theatre critic Theo Bennett" width="100" height="100" loading="lazy">
              <div>
                <strong>Theo Bennett</strong>
                <span>Critic &amp; subscriber, Manchester</span>
              </div>
            </div>
          </article>

          <article class="voice-card reveal">
            <div>
              <span class="voice-card__mark" aria-hidden="true">“</span>
              <blockquote>There is real generosity here: a platform that asks better questions and gives the answers room to breathe.</blockquote>
            </div>
            <div class="voice-card__person">
              <img src="https://i.pravatar.cc/100?u=ana-silva" alt="Portrait of curator Ana Silva" width="100" height="100" loading="lazy">
              <div>
                <strong>Ana Silva</strong>
                <span>Curator, São Paulo</span>
              </div>
            </div>
          </article>
        </div>
      </div>
    </section>

    <section class="section" id="faq">
      <div class="container faq-layout">
        <div class="faq-intro reveal">
          <p class="eyebrow">08 / Good to know</p>
          <h2 class="display">Better questions. Better nights out.</h2>
          <p>
            Need a recommendation, want to share a project, or have a question about our coverage? Start here, or write directly to the desk.
          </p>
          <a class="button button--outline" href="mailto:hello@signalandstage.co">Ask the desk <span class="arrow" aria-hidden="true">↗</span></a>
        </div>

        <div class="faq-list reveal">
          <details class="faq-item">
            <summary>What does Signal &amp; Stage cover?</summary>
            <div class="faq-item__answer">
              <p>
                We cover music, film, visual art, theatre, dance, publishing, and the spaces where those forms meet. Our reporting focuses on independent practice, cultural institutions, public art, and the people building more generous creative ecosystems.
              </p>
            </div>
          </details>

          <details class="faq-item">
            <summary>How are events selected for the calendar?</summary>
            <div class="faq-item__answer">
              <p>
                Editors look for work with a clear artistic point of view, a thoughtful production, and a genuine reason to leave the house. We prioritize independent venues, emerging ensembles, artist-led spaces, and programs that make cultural participation more accessible.
              </p>
            </div>
          </details>

          <details class="faq-item">
            <summary>Can artists, venues, or producers submit their work?</summary>
            <div class="faq-item__answer">
              <p>
                Yes. Send a concise description, relevant links, and information about dates, location, and ticketing to <a class="text-link" href="mailto:submissions@signalandstage.co">submissions@signalandstage.co</a>. We review new visual art, literature, and event listings every week.
              </p>
            </div>
          </details>

          <details class="faq-item">
            <summary>Can I contribute writing or photography?</summary>
            <div class="faq-item__answer">
              <p>
                We commission contributors with a distinct connection to the work they cover. Pitch a story, essay, photo essay, or visual diary with a short outline and two links to relevant samples. Paid assignments include a modest fee, agreed usage, and a byline.
              </p>
            </div>
          </details>

          <details class="faq-item">
            <summary>How can my organization partner with the desk?</summary>
            <div class="faq-item__answer">
              <p>
                We collaborate on editorial projects, live conversations, cultural guides, and audience programs. Partnership inquiries can be sent to <a class="text-link" href="mailto:partnerships@signalandstage.co">partnerships@signalandstage.co</a>.
              </p>
            </div>
          </details>
        </div>
      </div>
    </section>
  </main>

  <footer class="site-footer" id="about">
    <div class="container">
      <div class="footer-top">
        <div class="footer-brand">
          <a class="brand" href="#top" aria-label="Signal and Stage home">
            <img class="brand__logo" src="https://placehold.co/96x96/d9ff57/171713?text=S%2B&amp;font=montserrat" alt="Signal and Stage logo placeholder" loading="lazy">
            <span>
              <span class="brand__name">Signal &amp; Stage</span>
              <span class="brand__tagline">Where culture moves forward</span>
            </span>
          </a>
          <p>
            An independent culture desk for artists, institutions, and audiences who believe the arts deserve clear reporting, generous attention, and a place in the conversation.
          </p>
          <div class="social-links" aria-label="Social media links">
            <a href="https://www.instagram.com/" target="_blank" rel="noreferrer" aria-label="Signal and Stage on Instagram">IG</a>
            <a href="https://www.youtube.com/" target="_blank" rel="noreferrer" aria-label="Signal and Stage on YouTube">YT</a>
            <a href="https://www.linkedin.com/" target="_blank" rel="noreferrer" aria-label="Signal and Stage on LinkedIn">LI</a>
            <a href="https://www.tiktok.com/" target="_blank" rel="noreferrer" aria-label="Signal and Stage on TikTok">TT</a>
          </div>
        </div>

        <div class="footer-column">
          <h3>Explore</h3>
          <ul>
            <li><a href="#latest">Latest stories</a></li>
            <li><a href="#galleries">Galleries</a></li>
            <li><a href="#tickets">Tickets &amp; events</a></li>
            <li><a href="#news">News</a></li>
            <li><a href="#artists">Artist spotlight</a></li>
          </ul>
        </div>

        <div class="footer-column">
          <h3>Participate</h3>
          <ul>
            <li><a href="mailto:submissions@signalandstage.co">Submit your work</a></li>
            <li><a href="mailto:pitches@signalandstage.co">Pitch a story</a></li>
            <li><a href="mailto:partnerships@signalandstage.co">Partner with us</a></li>
            <li><a href="#newsletter">Join the newsletter</a></li>
            <li><a href="mailto:access@signalandstage.co">Accessibility</a></li>
          </ul>
        </div>

        <div class="footer-column">
          <h3>Contact</h3>
          <address>
            <a href="mailto:hello@signalandstage.co">hello@signalandstage.co</a><br>
            <a href="tel:+12125550142">+1 212 555 0142</a><br><br>
            48 Mercer Street, Studio 4<br>
            Brooklyn, NY 11222
          </address>
        </div>
      </div>

      <div class="footer-bottom">
        <p>© <span id="currentYear">2025</span> Signal &amp; Stage. All rights reserved.</p>
        <div class="footer-legal">
          <a href="#privacy">Privacy</a>
          <a href="#terms">Terms</a>
          <a href="#accessibility">Accessibility</a>
          <a href="#top">Back to top ↑</a>
        </div>
      </div>
    </div>
  </footer>

  <dialog class="ticket-dialog" id="ticketDialog" aria-labelledby="ticketDialogTitle">
    <div class="ticket-dialog__inner">
      <button class="dialog-close" id="ticketClose" type="button" aria-label="Close ticket reservation">×</button>
      <p class="eyebrow">Reserve a place</p>
      <h2 id="ticketDialogTitle">Event tickets</h2>
      <div class="ticket-dialog__meta">
        <div><span>When</span><strong id="ticketDate">Thursday, June 12</strong></div>
        <div><span>Time</span><strong id="ticketTime">7:30 PM</strong></div>
        <div><span>Where</span><strong id="ticketVenue">The Lantern Room</strong></div>
        <div><span>Price</span><strong id="ticketPrice">From $28</strong></div>
      </div>
      <form id="ticketForm" novalidate>
        <label for="ticketEmail">Email address</label>
        <input id="ticketEmail" name="email" type="email" placeholder="you@example.com" autocomplete="email" required>
        <button class="button" type="submit">Hold my place <span class="arrow" aria-hidden="true">→</span></button>
        <p class="ticket-dialog__fine">No payment is taken now. We’ll email the booking link and hold availability for 10 minutes.</p>
        <div class="ticket-confirmation" id="ticketConfirmation" role="status" aria-live="polite"></div>
      </form>
    </div>
  </dialog>

  <dialog class="gallery-dialog" id="galleryDialog" aria-label="Gallery image viewer">
    <div class="gallery-dialog__inner">
      <button class="dialog-close" id="galleryClose" type="button" aria-label="Close gallery viewer">×</button>
      <img class="gallery-dialog__image" id="galleryDialogImage" src="" alt="">
      <div class="gallery-dialog__bar">
        <div class="gallery-dialog__caption">
          <strong id="galleryDialogCaption"></strong>
          <span id="galleryDialogCredit"></span>
        </div>
        <div class="gallery-dialog__controls">
          <button id="galleryPrev" type="button" aria-label="Previous gallery image">←</button>
          <button id="galleryNext" type="button" aria-label="Next gallery image">→</button>
        </div>
      </div>
    </div>
  </dialog>

  <script>
    (() => {
      const header = document.getElementById('siteHeader');
      const menuToggle = document.getElementById('menuToggle');
      const primaryNav = document.getElementById('primaryNav');

      const updateHeader = () => {
        header.classList.toggle('is-scrolled', window.scrollY > 10);
      };

      updateHeader();
      window.addEventListener('scroll', updateHeader, { passive: true });

      const closeMenu = () => {
        primaryNav.classList.remove('is-open');
        menuToggle.setAttribute('aria-expanded', 'false');
        menuToggle.setAttribute('aria-label', 'Open navigation');
        document.body.classList.remove('nav-open');
      };

      menuToggle.addEventListener('click', () => {
        const isOpen = menuToggle.getAttribute('aria-expanded') === 'true';
        if (isOpen) {
          closeMenu();
        } else {
          primaryNav.classList.add('is-open');
          menuToggle.setAttribute('aria-expanded', 'true');
          menuToggle.setAttribute('aria-label', 'Close navigation');
          document.body.classList.add('nav-open');
        }
      });

      primaryNav.querySelectorAll('a').forEach(link => {
        link.addEventListener('click', closeMenu);
      });

      window.addEventListener('resize', () => {
        if (window.innerWidth > 920) closeMenu();
      });

      document.getElementById('currentYear').textContent = new Date().getFullYear();

      const filterButtons = document.querySelectorAll('[data-filter]');
      const eventItems = document.querySelectorAll('.event-item');
      const eventCount = document.getElementById('eventCount');

      filterButtons.forEach(button => {
        button.addEventListener('click', () => {
          const selectedDay = button.dataset.filter;

          filterButtons.forEach(item => {
            item.setAttribute('aria-pressed', String(item === button));
          });

          let visibleEvents = 0;

          eventItems.forEach(item => {
            const shouldShow = selectedDay === 'all' || item.dataset.day === selectedDay;
            item.hidden = !shouldShow;
            if (shouldShow) visibleEvents += 1;
          });

          eventCount.textContent = `${visibleEvents} event${visibleEvents === 1 ? '' : 's'} showing`;
        });
      });

      const ticketDialog = document.getElementById('ticketDialog');
      const ticketTitle = document.getElementById('ticketDialogTitle');
      const ticketDate = document.getElementById('ticketDate');
      const ticketTime = document.getElementById('ticketTime');
      const ticketVenue = document.getElementById('ticketVenue');
      const ticketPrice = document.getElementById('ticketPrice');
      const ticketForm = document.getElementById('ticketForm');
      const ticketConfirmation = document.getElementById('ticketConfirmation');
      const ticketEmail = document.getElementById('ticketEmail');

      document.querySelectorAll('.js-ticket').forEach(button => {
        button.addEventListener('click', () => {
          ticketTitle.textContent = button.dataset.title;
          ticketDate.textContent = button.dataset.date;
          ticketTime.textContent = button.dataset.time;
          ticketVenue.textContent = button.dataset.venue;
          ticketPrice.textContent = button.dataset.price;
          ticketConfirmation.classList.remove('is-visible');
          ticketConfirmation.textContent = '';
          ticketForm.reset();

          if (typeof ticketDialog.showModal === 'function') {
            ticketDialog.showModal();
          } else {
            ticketDialog.setAttribute('open', '');
          }
        });
      });

      document.getElementById('ticketClose').addEventListener('click', () => ticketDialog.close());

      ticketDialog.addEventListener('click', event => {
        if (event.target === ticketDialog) ticketDialog.close();
      });

      ticketForm.addEventListener('submit', event => {
        event.preventDefault();

        if (!ticketEmail.value || !ticketEmail.checkValidity()) {
          ticketEmail.focus();
          ticketConfirmation.textContent = 'Please enter a valid email address to continue.';
          ticketConfirmation.classList.add('is-visible');
          return;
        }

        ticketConfirmation.textContent = `Thanks. A booking link for “${ticketTitle.textContent}” is on its way to ${ticketEmail.value}. Your 10-minute hold has started.`;
        ticketConfirmation.classList.add('is-visible');
        ticketForm.querySelector('button').textContent = 'Place held ✓';
      });

      document.querySelectorAll('.newsletter-form').forEach(form => {
        form.addEventListener('submit', event => {
          event.preventDefault();
          const input = form.querySelector('input[type="email"]');
          const message = form.querySelector('.form-message');

          if (!input.value || !input.checkValidity()) {
            message.textContent = 'Please enter a valid email address.';
            message.style.color = '#ff9c87';
            input.focus();
            return;
          }

          message.textContent = 'You’re on the list. Watch your inbox on Friday.';
          message.style.color = '#d9ff57';
          form.reset();
        });
      });

      const galleryItems = Array.from(document.querySelectorAll('.js-gallery'));
      const galleryDialog = document.getElementById('galleryDialog');
      const galleryImage = document.getElementById('galleryDialogImage');
      const galleryCaption = document.getElementById('galleryDialogCaption');
      const galleryCredit = document.getElementById('galleryDialogCredit');
      let activeGalleryIndex = 0;

      const showGalleryItem = index => {
        activeGalleryIndex = (index + galleryItems.length) % galleryItems.length;
        const item = galleryItems[activeGalleryIndex];
        galleryImage.src = item.dataset.src;
        galleryImage.alt = item.dataset.caption;
        galleryCaption.textContent = item.dataset.caption;
        galleryCredit.textContent = item.dataset.credit;
      };

      const openGallery = index => {
        showGalleryItem(index);
        if (typeof galleryDialog.showModal === 'function') {
          galleryDialog.showModal();
        } else {
          galleryDialog.setAttribute('open', '');
        }
      };

      galleryItems.forEach(item => {
        item.addEventListener('click', () => openGallery(Number(item.dataset.index)));
      });

      document.querySelectorAll('.js-open-gallery').forEach(button => {
        button.addEventListener('click', () => openGallery(Number(button.dataset.index)));
      });

      document.getElementById('galleryClose').addEventListener('click', () => galleryDialog.close());
      document.getElementById('galleryPrev').addEventListener('click', () => showGalleryItem(activeGalleryIndex - 1));
      document.getElementById('galleryNext').addEventListener('click', () => showGalleryItem(activeGalleryIndex + 1));

      galleryDialog.addEventListener('click', event => {
        if (event.target === galleryDialog) galleryDialog.close();
      });

      document.addEventListener('keydown', event => {
        if (!galleryDialog.open) return;
        if (event.key === 'ArrowLeft') showGalleryItem(activeGalleryIndex - 1);
        if (event.key === 'ArrowRight') showGalleryItem(activeGalleryIndex + 1);
      });

      const revealElements = document.querySelectorAll('.reveal');

      if ('IntersectionObserver' in window) {
        const revealObserver = new IntersectionObserver(entries => {
          entries.forEach(entry => {
            if (entry.isIntersecting) {
              entry.target.classList.add('is-visible');
              revealObserver.unobserve(entry.target);
            }
          });
        }, {
          threshold: 0.12,
          rootMargin: "0px 0px -40px"
        });

        revealElements.forEach(element => revealObserver.observe(element));
      } else {
        revealElements.forEach(element => element.classList.add('is-visible'));
      }
    })();
  </script>
</body>
</html>
View Axe Report (JSON)
{
  "testEngine": {
    "name": "axe-core",
    "version": "4.10.2"
  },
  "testRunner": {
    "name": "axe"
  },
  "testEnvironment": {
    "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) HeadlessChrome/156.0.8078.4 Safari/537.36",
    "windowWidth": 1280,
    "windowHeight": 720,
    "orientationAngle": 0,
    "orientationType": "landscape-primary"
  },
  "timestamp": "2026-11-12T10:10:21.781Z",
  "url": "https://benchmark.aimac.invalid/be1e799a61af3bf778496bbf26f2358013cf03d95ce0d65a2723e3a1bd36c68b.html",
  "toolOptions": {
    "runOnly": {
      "type": "tag",
      "values": [
        "wcag2a",
        "wcag2aa",
        "wcag21a",
        "wcag21aa",
        "wcag22a",
        "wcag22aa"
      ]
    },
    "resultTypes": [
      "violations"
    ],
    "reporter": "v1"
  },
  "inapplicable": [
    {
      "id": "area-alt",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag244",
        "wcag412",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT6.a",
        "EN-301-549",
        "EN-9.2.4.4",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure <area> elements of image maps have alternative text",
      "help": "Active <area> elements must have alternative text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/area-alt?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-braille-equivalent",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure aria-braillelabel and aria-brailleroledescription have a non-braille equivalent",
      "help": "aria-braille attributes must have a non-braille equivalent",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-braille-equivalent?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-command-name",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "TTv5",
        "TT6.a",
        "EN-301-549",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure every ARIA button, link and menuitem has an accessible name",
      "help": "ARIA commands must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-command-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-input-field-name",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "TTv5",
        "TT5.c",
        "EN-301-549",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure every ARIA input field has an accessible name",
      "help": "ARIA input fields must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-input-field-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-meter-name",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag111",
        "EN-301-549",
        "EN-9.1.1.1"
      ],
      "description": "Ensure every ARIA meter node has an accessible name",
      "help": "ARIA meter nodes must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-meter-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-progressbar-name",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag111",
        "EN-301-549",
        "EN-9.1.1.1"
      ],
      "description": "Ensure every ARIA progressbar node has an accessible name",
      "help": "ARIA progressbar nodes must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-progressbar-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-required-children",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag131",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure elements with an ARIA role that require child roles contain them",
      "help": "Certain ARIA roles must contain particular children",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-required-children?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-required-parent",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag131",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure elements with an ARIA role that require parent roles are contained by them",
      "help": "Certain ARIA roles must be contained by particular parents",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-required-parent?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-toggle-field-name",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "TTv5",
        "TT5.c",
        "EN-301-549",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure every ARIA toggle field has an accessible name",
      "help": "ARIA toggle fields must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-toggle-field-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-tooltip-name",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure every ARIA tooltip node has an accessible name",
      "help": "ARIA tooltip nodes must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-tooltip-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "avoid-inline-spacing",
      "impact": null,
      "tags": [
        "cat.structure",
        "wcag21aa",
        "wcag1412",
        "EN-301-549",
        "EN-9.1.4.12",
        "ACT"
      ],
      "description": "Ensure that text spacing set through style attributes can be adjusted with custom stylesheets",
      "help": "Inline text spacing must be adjustable with custom stylesheets",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/avoid-inline-spacing?application=axeAPI",
      "nodes": []
    },
    {
      "id": "blink",
      "impact": null,
      "tags": [
        "cat.time-and-media",
        "wcag2a",
        "wcag222",
        "section508",
        "section508.22.j",
        "TTv5",
        "TT2.b",
        "EN-301-549",
        "EN-9.2.2.2"
      ],
      "description": "Ensure <blink> elements are not used",
      "help": "<blink> elements are deprecated and must not be used",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/blink?application=axeAPI",
      "nodes": []
    },
    {
      "id": "definition-list",
      "impact": null,
      "tags": [
        "cat.structure",
        "wcag2a",
        "wcag131",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure <dl> elements are structured correctly",
      "help": "<dl> elements must only directly contain properly-ordered <dt> and <dd> groups, <script>, <template> or <div> elements",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/definition-list?application=axeAPI",
      "nodes": []
    },
    {
      "id": "dlitem",
      "impact": null,
      "tags": [
        "cat.structure",
        "wcag2a",
        "wcag131",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure <dt> and <dd> elements are contained by a <dl>",
      "help": "<dt> and <dd> elements must be contained by a <dl>",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/dlitem?application=axeAPI",
      "nodes": []
    },
    {
      "id": "frame-focusable-content",
      "impact": null,
      "tags": [
        "cat.keyboard",
        "wcag2a",
        "wcag211",
        "TTv5",
        "TT4.a",
        "EN-301-549",
        "EN-9.2.1.1"
      ],
      "description": "Ensure <frame> and <iframe> elements with focusable content do not have tabindex=-1",
      "help": "Frames with focusable content must not have tabindex=-1",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/frame-focusable-content?application=axeAPI",
      "nodes": []
    },
    {
      "id": "frame-title-unique",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag412",
        "TTv5",
        "TT12.d",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure <iframe> and <frame> elements contain a unique title attribute",
      "help": "Frames must have a unique title attribute",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/frame-title-unique?application=axeAPI",
      "nodes": []
    },
    {
      "id": "frame-title",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag412",
        "section508",
        "section508.22.i",
        "TTv5",
        "TT12.d",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure <iframe> and <frame> elements have an accessible name",
      "help": "Frames must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/frame-title?application=axeAPI",
      "nodes": []
    },
    {
      "id": "html-xml-lang-mismatch",
      "impact": null,
      "tags": [
        "cat.language",
        "wcag2a",
        "wcag311",
        "EN-301-549",
        "EN-9.3.1.1",
        "ACT"
      ],
      "description": "Ensure that HTML elements with both valid lang and xml:lang attributes agree on the base language of the page",
      "help": "HTML elements with lang and xml:lang must have the same base language",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/html-xml-lang-mismatch?application=axeAPI",
      "nodes": []
    },
    {
      "id": "input-button-name",
      "impact": null,
      "tags": [
        "cat.name-role-value",
        "wcag2a",
        "wcag412",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT5.c",
        "EN-301-549",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure input buttons have discernible text",
      "help": "Input buttons must have discernible text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/input-button-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "input-image-alt",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag111",
        "wcag412",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT7.a",
        "EN-301-549",
        "EN-9.1.1.1",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure <input type=\"image\"> elements have alternative text",
      "help": "Image buttons must have alternative text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/input-image-alt?application=axeAPI",
      "nodes": []
    },
    {
      "id": "marquee",
      "impact": null,
      "tags": [
        "cat.parsing",
        "wcag2a",
        "wcag222",
        "TTv5",
        "TT2.b",
        "EN-301-549",
        "EN-9.2.2.2"
      ],
      "description": "Ensure <marquee> elements are not used",
      "help": "<marquee> elements are deprecated and must not be used",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/marquee?application=axeAPI",
      "nodes": []
    },
    {
      "id": "meta-refresh",
      "impact": null,
      "tags": [
        "cat.time-and-media",
        "wcag2a",
        "wcag221",
        "TTv5",
        "TT8.a",
        "EN-301-549",
        "EN-9.2.2.1"
      ],
      "description": "Ensure <meta http-equiv=\"refresh\"> is not used for delayed refresh",
      "help": "Delayed refresh under 20 hours must not be used",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/meta-refresh?application=axeAPI",
      "nodes": []
    },
    {
      "id": "object-alt",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag111",
        "section508",
        "section508.22.a",
        "EN-301-549",
        "EN-9.1.1.1"
      ],
      "description": "Ensure <object> elements have alternative text",
      "help": "<object> elements must have alternative text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/object-alt?application=axeAPI",
      "nodes": []
    },
    {
      "id": "role-img-alt",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag111",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT7.a",
        "EN-301-549",
        "EN-9.1.1.1",
        "ACT"
      ],
      "description": "Ensure [role=\"img\"] elements have alternative text",
      "help": "[role=\"img\"] elements must have an alternative text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/role-img-alt?application=axeAPI",
      "nodes": []
    },
    {
      "id": "scrollable-region-focusable",
      "impact": null,
      "tags": [
        "cat.keyboard",
        "wcag2a",
        "wcag211",
        "wcag213",
        "TTv5",
        "TT4.a",
        "EN-301-549",
        "EN-9.2.1.1",
        "EN-9.2.1.3"
      ],
      "description": "Ensure elements that have scrollable content are accessible by keyboard",
      "help": "Scrollable region must have keyboard access",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/scrollable-region-focusable?application=axeAPI",
      "nodes": []
    },
    {
      "id": "select-name",
      "impact": null,
      "tags": [
        "cat.forms",
        "wcag2a",
        "wcag412",
        "section508",
        "section508.22.n",
        "TTv5",
        "TT5.c",
        "EN-301-549",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure select element has an accessible name",
      "help": "Select element must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/select-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "server-side-image-map",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag211",
        "section508",
        "section508.22.f",
        "TTv5",
        "TT4.a",
        "EN-301-549",
        "EN-9.2.1.1"
      ],
      "description": "Ensure that server-side image maps are not used",
      "help": "Server-side image maps must not be used",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/server-side-image-map?application=axeAPI",
      "nodes": []
    },
    {
      "id": "svg-img-alt",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag111",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT7.a",
        "EN-301-549",
        "EN-9.1.1.1",
        "ACT"
      ],
      "description": "Ensure <svg> elements with an img, graphics-document or graphics-symbol role have an accessible text",
      "help": "<svg> elements with an img role must have an alternative text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/svg-img-alt?application=axeAPI",
      "nodes": []
    },
    {
      "id": "td-headers-attr",
      "impact": null,
      "tags": [
        "cat.tables",
        "wcag2a",
        "wcag131",
        "section508",
        "section508.22.g",
        "TTv5",
        "TT14.b",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure that each cell in a table that uses the headers attribute refers only to other cells in that table",
      "help": "Table cells that use the headers attribute must only refer to cells in the same table",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/td-headers-attr?application=axeAPI",
      "nodes": []
    },
    {
      "id": "th-has-data-cells",
      "impact": null,
      "tags": [
        "cat.tables",
        "wcag2a",
        "wcag131",
        "section508",
        "section508.22.g",
        "TTv5",
        "TT14.b",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure that <th> elements and elements with role=columnheader/rowheader have data cells they describe",
      "help": "Table headers in a data table must refer to data cells",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/th-has-data-cells?application=axeAPI",
      "nodes": []
    },
    {
      "id": "valid-lang",
      "impact": null,
      "tags": [
        "cat.language",
        "wcag2aa",
        "wcag312",
        "TTv5",
        "TT11.b",
        "EN-301-549",
        "EN-9.3.1.2",
        "ACT"
      ],
      "description": "Ensure lang attributes have valid values",
      "help": "lang attribute must have a valid value",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/valid-lang?application=axeAPI",
      "nodes": []
    },
    {
      "id": "video-caption",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag122",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT17.a",
        "EN-301-549",
        "EN-9.1.2.2"
      ],
      "description": "Ensure <video> elements have captions",
      "help": "<video> elements must have captions",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/video-caption?application=axeAPI",
      "nodes": []
    },
    {
      "id": "no-autoplay-audio",
      "impact": null,
      "tags": [
        "cat.time-and-media",
        "wcag2a",
        "wcag142",
        "TTv5",
        "TT2.a",
        "EN-301-549",
        "EN-9.1.4.2",
        "ACT"
      ],
      "description": "Ensure <video> or <audio> elements do not autoplay audio for more than 3 seconds without a control mechanism to stop or mute the audio",
      "help": "<video> or <audio> elements must not play automatically",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/no-autoplay-audio?application=axeAPI",
      "nodes": []
    }
  ],
  "passes": [
    {
      "id": "aria-allowed-attr",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure an element's role supports its ARIA attributes",
      "help": "Elements must only use supported ARIA attributes",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-allowed-attr?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [
            {
              "id": "aria-allowed-attr",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "ARIA attributes are used correctly for the defined role"
            }
          ],
          "none": [
            {
              "id": "aria-unsupported-attr",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "ARIA attribute is supported"
            }
          ],
          "impact": null,
          "html": "<a class=\"brand\" href=\"#top\" aria-label=\"Signal and Stage home\">",
          "target": [
            ".header__inner > .brand[aria-label=\"Signal and Stage home\"][href$=\"#top\"]"
          ]
        }
      ]
    },
    {
      "id": "aria-conditional-attr",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure ARIA attributes are used as described in the specification of the element's role",
      "help": "ARIA attributes must be used as specified for the element's role",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-conditional-attr?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [
            {
              "id": "aria-conditional-attr",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "ARIA attribute is allowed"
            }
          ],
          "none": [],
          "impact": null,
          "html": "<a class=\"brand\" href=\"#top\" aria-label=\"Signal and Stage home\">",
          "target": [
            ".header__inner > .brand[aria-label=\"Signal and Stage home\"][href$=\"#top\"]"
          ]
        }
      ]
    },
    {
      "id": "aria-deprecated-role",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure elements do not use deprecated roles",
      "help": "Deprecated ARIA roles must not be used",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-deprecated-role?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [],
          "none": [
            {
              "id": "deprecatedrole",
              "data": null,
              "relatedNodes": [],
              "impact": "minor",
              "message": "ARIA role is not deprecated"
            }
          ],
          "impact": null,
          "html": "<div class=\"day-filter\" role=\"group\" aria-label=\"Filter events by day\">",
          "target": [
            ".day-filter"
          ]
        }
      ]
    },
    {
      "id": "aria-hidden-body",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag131",
        "wcag412",
        "EN-301-549",
        "EN-9.1.3.1",
        "EN-9.4.1.2"
      ],
      "description": "Ensure aria-hidden=\"true\" is not present on the document body.",
      "help": "aria-hidden=\"true\" must not be present on the document body",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-hidden-body?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "aria-hidden-body",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "No aria-hidden attribute is present on document body"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<body>",
          "target": [
            "body"
          ]
        }
      ]
    },
    {
      "id": "aria-hidden-focus",
      "impact": null,
      "tags": [
        "cat.name-role-value",
        "wcag2a",
        "wcag412",
        "TTv5",
        "TT6.a",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure aria-hidden elements are not focusable nor contain focusable elements",
      "help": "ARIA hidden element must not be focusable or contain focusable elements",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-hidden-focus?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [
            {
              "id": "focusable-modal-open",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "No focusable elements while a modal is open"
            },
            {
              "id": "focusable-disabled",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "No focusable elements contained within element"
            },
            {
              "id": "focusable-not-tabbable",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "No focusable elements contained within element"
            }
          ],
          "none": [],
          "impact": null,
          "html": "<span class=\"live-dot\" aria-hidden=\"true\"></span>",
          "target": [
            ".live-dot"
          ]
        }
      ]
    },
    {
      "id": "aria-prohibited-attr",
      "impact": "serious",
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure ARIA attributes are not prohibited for an element's role",
      "help": "Elements must only use permitted ARIA attributes",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-prohibited-attr?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [],
          "none": [
            {
              "id": "aria-prohibited-attr",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "ARIA attribute is allowed"
            }
          ],
          "impact": null,
          "html": "<a class=\"brand\" href=\"#top\" aria-label=\"Signal and Stage home\">",
          "target": [
            ".header__inner > .brand[aria-label=\"Signal and Stage home\"][href$=\"#top\"]"
          ]
        }
      ]
    },
    {
      "id": "aria-required-attr",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure elements with ARIA roles have all required ARIA attributes",
      "help": "Required ARIA attributes must be provided",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-required-attr?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "aria-required-attr",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "All required ARIA attributes are present"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<div class=\"day-filter\" role=\"group\" aria-label=\"Filter events by day\">",
          "target": [
            ".day-filter"
          ]
        }
      ]
    },
    {
      "id": "aria-roles",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure all elements with a role attribute use a valid value",
      "help": "ARIA roles used must conform to valid values",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-roles?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [],
          "none": [
            {
              "id": "invalidrole",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "ARIA role is valid"
            },
            {
              "id": "abstractrole",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Abstract roles are not used"
            },
            {
              "id": "unsupportedrole",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "ARIA role is supported"
            }
          ],
          "impact": null,
          "html": "<div class=\"day-filter\" role=\"group\" aria-label=\"Filter events by day\">",
          "target": [
            ".day-filter"
          ]
        }
      ]
    },
    {
      "id": "aria-valid-attr-value",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure all ARIA attributes have valid values",
      "help": "ARIA attributes must conform to valid values",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-valid-attr-value?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [
            {
              "id": "aria-valid-attr-value",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "ARIA attribute values are valid"
            },
            {
              "id": "aria-errormessage",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "aria-errormessage exists and references elements visible to screen readers that use a supported aria-errormessage technique"
            },
            {
              "id": "aria-level",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "aria-level values are valid"
            }
          ],
          "none": [],
          "impact": null,
          "html": "<a class=\"brand\" href=\"#top\" aria-label=\"Signal and Stage home\">",
          "target": [
            ".header__inner > .brand[aria-label=\"Signal and Stage home\"][href$=\"#top\"]"
          ]
        }
      ]
    },
    {
      "id": "aria-valid-attr",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure attributes that begin with aria- are valid ARIA attributes",
      "help": "ARIA attributes must conform to valid names",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-valid-attr?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "aria-valid-attr",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "ARIA attribute name is valid"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<a class=\"brand\" href=\"#top\" aria-label=\"Signal and Stage home\">",
          "target": [
            ".header__inner > .brand[aria-label=\"Signal and Stage home\"][href$=\"#top\"]"
          ]
        }
      ]
    },
    {
      "id": "autocomplete-valid",
      "impact": null,
      "tags": [
        "cat.forms",
        "wcag21aa",
        "wcag135",
        "EN-301-549",
        "EN-9.1.3.5",
        "ACT"
      ],
      "description": "Ensure the autocomplete attribute is correct and suitable for the form field",
      "help": "autocomplete attribute must be used correctly",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/autocomplete-valid?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [
            {
              "id": "autocomplete-valid",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "the autocomplete attribute is correctly formatted"
            }
          ],
          "none": [],
          "impact": null,
          "html": "<input id=\"newsletterEmail\" name=\"email\" type=\"email\" placeholder=\"you@example.com\" autocomplete=\"email\" required=\"\">",
          "target": [
            "#newsletterEmail"
          ]
        }
      ]
    },
    {
      "id": "button-name",
      "impact": null,
      "tags": [
        "cat.name-role-value",
        "wcag2a",
        "wcag412",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT6.a",
        "EN-301-549",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure buttons have discernible text",
      "help": "Buttons must have discernible text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/button-name?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "button-has-visible-text",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element has inner text that is visible to screen readers"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<button type=\"button\" data-filter=\"all\" aria-pressed=\"true\">All dates <span>Curated</span></button>",
          "target": [
            "button[data-filter=\"all\"]"
          ]
        }
      ]
    },
    {
      "id": "bypass",
      "impact": null,
      "tags": [
        "cat.keyboard",
        "wcag2a",
        "wcag241",
        "section508",
        "section508.22.o",
        "TTv5",
        "TT9.a",
        "EN-301-549",
        "EN-9.2.4.1"
      ],
      "description": "Ensure each page has at least one mechanism for a user to bypass navigation and jump straight to the content",
      "help": "Page must have means to bypass repeated blocks",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/bypass?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "internal-link-present",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "Valid skip link found"
            },
            {
              "id": "header-present",
              "data": null,
              "relatedNodes": [
                {
                  "html": "<h1>Culture is a <em>team sport.</em></h1>",
                  "target": [
                    "h1"
                  ]
                },
                {
                  "html": "<h2 class=\"display\">Worth your full <em>attention.</em></h2>",
                  "target": [
                    "#latest > .container > .section-heading.reveal > div > .display"
                  ]
                },
                {
                  "html": "<h3><a href=\"#news\">Inside the 14-minute city: a new opera changes the rhythm of downtown</a></h3>",
                  "target": [
                    ".lead-story__content > div:nth-child(1) > h3"
                  ]
                },
                {
                  "html": "<h3><a href=\"#news\">The small cinemas making midnight screenings matter again</a></h3>",
                  "target": [
                    ".side-story:nth-child(1) > .side-story__content > h3"
                  ]
                },
                {
                  "html": "<h3><a href=\"#galleries\">Why listening rooms are becoming the new gallery</a></h3>",
                  "target": [
                    ".side-story:nth-child(2) > .side-story__content > h3"
                  ]
                },
                {
                  "html": "<h4>Five artists receive the new Civic Memory residency.</h4>",
                  "target": [
                    ".radar__item:nth-child(2) > h4"
                  ]
                },
                {
                  "html": "<h4>A new imprint for books that could never sit still.</h4>",
                  "target": [
                    ".radar__item:nth-child(3) > h4"
                  ]
                },
                {
                  "html": "<h4>The backstage is getting a serious sustainability rethink.</h4>",
                  "target": [
                    ".radar__item:nth-child(4) > h4"
                  ]
                },
                {
                  "html": "<h2 class=\"display\">This week, <em>on stage.</em></h2>",
                  "target": [
                    "#tickets > .container > .section-heading.reveal > div:nth-child(1) > .display"
                  ]
                },
                {
                  "html": "<h3>Low Light: an evening concert</h3>",
                  "target": [
                    ".event-item[data-day=\"thu\"]:nth-child(1) > .event-info > h3"
                  ]
                },
                {
                  "html": "<h3>Archive of Air</h3>",
                  "target": [
                    ".event-item[data-day=\"thu\"]:nth-child(2) > .event-info > h3"
                  ]
                },
                {
                  "html": "<h3>Afterimage \u2014 premiere screening</h3>",
                  "target": [
                    ".event-item[data-day=\"fri\"]:nth-child(3) > .event-info > h3"
                  ]
                },
                {
                  "html": "<h3>Common Ground</h3>",
                  "target": [
                    ".event-item[data-day=\"fri\"]:nth-child(4) > .event-info > h3"
                  ]
                },
                {
                  "html": "<h3>Maya Okafor: Soft Signal</h3>",
                  "target": [
                    ".event-item[data-day=\"sat\"]:nth-child(5) > .event-info > h3"
                  ]
                },
                {
                  "html": "<h3>The Last Set</h3>",
                  "target": [
                    ".event-item[data-day=\"sat\"]:nth-child(6) > .event-info > h3"
                  ]
                },
                {
                  "html": "<h3>Eastside Open Studios</h3>",
                  "target": [
                    ".event-item[data-day=\"sun\"]:nth-child(7) > .event-info > h3"
                  ]
                },
                {
                  "html": "<h3>New Voices reading room</h3>",
                  "target": [
                    ".event-item[data-day=\"sun\"]:nth-child(8) > .event-info > h3"
                  ]
                },
                {
                  "html": "<h3>Low Light</h3>",
                  "target": [
                    ".aside-card--dark > h3"
                  ]
                },
                {
                  "html": "<h3>The Lantern Room</h3>",
                  "target": [
                    ".aside-card.reveal:nth-child(2) > h3"
                  ]
                },
                {
                  "html": "<h2 class=\"display\">Frames worth <em>keeping.</em></h2>",
                  "target": [
                    "#galleries > .container > .section-heading.reveal > div > .display"
                  ]
                },
                {
                  "html": "<h2>Maya<br>Okafor</h2>",
                  "target": [
                    ".spotlight-copy > h2"
                  ]
                },
                {
                  "html": "<h2 class=\"display\">How an idea finds its <em>final form.</em></h2>",
                  "target": [
                    ".process-copy > .display"
                  ]
                },
                {
                  "html": "<h3>Listen for the fracture</h3>",
                  "target": [
                    ".process-step:nth-child(1) > div > h3"
                  ]
                },
                {
                  "html": "<h3>Build a shared language</h3>",
                  "target": [
                    ".process-step:nth-child(2) > div > h3"
                  ]
                },
                {
                  "html": "<h3>Let the audience finish it</h3>",
                  "target": [
                    ".process-step:nth-child(3) > div > h3"
                  ]
                },
                {
                  "html": "<h2 class=\"display\">Industry, reported with <em>context.</em></h2>",
                  "target": [
                    "#news > .container > .section-heading.reveal > div > .display"
                  ]
                },
                {
                  "html": "<h3>Why regional venues are redesigning subscription models</h3>",
                  "target": [
                    ".news-item:nth-child(1) > div:nth-child(2) > h3"
                  ]
                },
                {
                  "html": "<h3>The new climate brief for touring ensembles</h3>",
                  "target": [
                    ".news-item:nth-child(2) > div:nth-child(2) > h3"
                  ]
                },
                {
                  "html": "<h3>What a durable creative partnership looks like now</h3>",
                  "target": [
                    ".news-item:nth-child(3) > div:nth-child(2) > h3"
                  ]
                },
                {
                  "html": "<h3>Can digital archives serve the room, not just the record?</h3>",
                  "target": [
                    ".news-item:nth-child(4) > div:nth-child(2) > h3"
                  ]
                },
                {
                  "html": "<h3>One email. The whole signal.</h3>",
                  "target": [
                    "#newsletter > h3"
                  ]
                },
                {
                  "html": "<h2 class=\"display\">From the people in the <em>room.</em></h2>",
                  "target": [
                    ".voices-section > .container > .section-heading.reveal > div > .display"
                  ]
                },
                {
                  "html": "<h2 class=\"display\">Better questions. Better nights out.</h2>",
                  "target": [
                    ".faq-intro > .display"
                  ]
                },
                {
                  "html": "<h3>Explore</h3>",
                  "target": [
                    ".footer-column:nth-child(2) > h3"
                  ]
                },
                {
                  "html": "<h3>Participate</h3>",
                  "target": [
                    ".footer-column:nth-child(3) > h3"
                  ]
                },
                {
                  "html": "<h3>Contact</h3>",
                  "target": [
                    ".footer-column:nth-child(4) > h3"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Page has a heading"
            },
            {
              "id": "landmark",
              "data": null,
              "relatedNodes": [
                {
                  "html": "<main id=\"main-content\">",
                  "target": [
                    "#main-content"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Page has a landmark region"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<html lang=\"en\">",
          "target": [
            "html"
          ]
        }
      ]
    },
    {
      "id": "color-contrast",
      "impact": "serious",
      "tags": [
        "cat.color",
        "wcag2aa",
        "wcag143",
        "TTv5",
        "TT13.c",
        "EN-301-549",
        "EN-9.1.4.3",
        "ACT"
      ],
      "description": "Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds",
      "help": "Elements must meet minimum color contrast ratio thresholds",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/color-contrast?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#c3c3c2",
                "bgColor": "#171713",
                "contrastRatio": 10.18,
                "fontSize": "7.9pt (10.56px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [],
              "impact": "serious",
              "message": "Element has sufficient color contrast of 10.18"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<span class=\"topline__signal\">\n        <span class=\"live-dot\" aria-hidden=\"true\"></span>\n        Independent culture desk\n      </span>",
          "target": [
            ".topline__signal"
          ]
        }
      ]
    },
    {
      "id": "document-title",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag242",
        "TTv5",
        "TT12.a",
        "EN-301-549",
        "EN-9.2.4.2",
        "ACT"
      ],
      "description": "Ensure each HTML document contains a non-empty <title> element",
      "help": "Documents must have <title> element to aid in navigation",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/document-title?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "doc-has-title",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "Document has a non-empty <title> element"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<html lang=\"en\">",
          "target": [
            "html"
          ]
        }
      ]
    },
    {
      "id": "duplicate-id-aria",
      "impact": null,
      "tags": [
        "cat.parsing",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure every id attribute value used in ARIA and in labels is unique",
      "help": "IDs used in ARIA and labels must be unique",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/duplicate-id-aria?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "duplicate-id-aria",
              "data": "primaryNav",
              "relatedNodes": [],
              "impact": "critical",
              "message": "Document has no elements referenced with ARIA or labels that share the same id attribute"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<nav class=\"primary-nav\" id=\"primaryNav\" aria-label=\"Primary navigation\">",
          "target": [
            "#primaryNav"
          ]
        }
      ]
    },
    {
      "id": "form-field-multiple-labels",
      "impact": null,
      "tags": [
        "cat.forms",
        "wcag2a",
        "wcag332",
        "TTv5",
        "TT5.c",
        "EN-301-549",
        "EN-9.3.3.2"
      ],
      "description": "Ensure form field does not have multiple label elements",
      "help": "Form field must not have multiple label elements",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/form-field-multiple-labels?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [],
          "none": [
            {
              "id": "multiple-label",
              "data": null,
              "relatedNodes": [
                {
                  "html": "<label for=\"newsletterEmail\" class=\"sr-only\" style=\"position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0\">Email address</label>",
                  "target": [
                    ".sr-only"
                  ]
                }
              ],
              "impact": "moderate",
              "message": "Form field does not have multiple label elements"
            }
          ],
          "impact": null,
          "html": "<input id=\"newsletterEmail\" name=\"email\" type=\"email\" placeholder=\"you@example.com\" autocomplete=\"email\" required=\"\">",
          "target": [
            "#newsletterEmail"
          ]
        }
      ]
    },
    {
      "id": "html-has-lang",
      "impact": null,
      "tags": [
        "cat.language",
        "wcag2a",
        "wcag311",
        "TTv5",
        "TT11.a",
        "EN-301-549",
        "EN-9.3.1.1",
        "ACT"
      ],
      "description": "Ensure every HTML document has a lang attribute",
      "help": "<html> element must have a lang attribute",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/html-has-lang?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "has-lang",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "The <html> element has a lang attribute"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<html lang=\"en\">",
          "target": [
            "html"
          ]
        }
      ]
    },
    {
      "id": "html-lang-valid",
      "impact": null,
      "tags": [
        "cat.language",
        "wcag2a",
        "wcag311",
        "TTv5",
        "TT11.a",
        "EN-301-549",
        "EN-9.3.1.1",
        "ACT"
      ],
      "description": "Ensure the lang attribute of the <html> element has a valid value",
      "help": "<html> element must have a valid value for the lang attribute",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/html-lang-valid?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [],
          "none": [
            {
              "id": "valid-lang",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "Value of lang attribute is included in the list of valid languages"
            }
          ],
          "impact": null,
          "html": "<html lang=\"en\">",
          "target": [
            "html"
          ]
        }
      ]
    },
    {
      "id": "image-alt",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag111",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT7.a",
        "TT7.b",
        "EN-301-549",
        "EN-9.1.1.1",
        "ACT"
      ],
      "description": "Ensure <img> elements have alternative text or a role of none or presentation",
      "help": "Images must have alternative text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/image-alt?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "has-alt",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element has an alt attribute"
            }
          ],
          "all": [],
          "none": [
            {
              "id": "alt-space-value",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element has a valid alt attribute value"
            }
          ],
          "impact": null,
          "html": "<img class=\"brand__logo\" src=\"https://placehold.co/96x96/d9ff57/171713?text=S%2B&amp;font=montserrat\" alt=\"Signal and Stage logo placeholder\">",
          "target": [
            ".header__inner > .brand[aria-label=\"Signal and Stage home\"][href$=\"#top\"] > .brand__logo"
          ]
        }
      ]
    },
    {
      "id": "label",
      "impact": null,
      "tags": [
        "cat.forms",
        "wcag2a",
        "wcag412",
        "section508",
        "section508.22.n",
        "TTv5",
        "TT5.c",
        "EN-301-549",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure every form element has a label",
      "help": "Form elements must have labels",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/label?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "explicit-label",
              "data": null,
              "relatedNodes": [
                {
                  "html": "<label for=\"newsletterEmail\" class=\"sr-only\" style=\"position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0\">Email address</label>",
                  "target": [
                    ".sr-only"
                  ]
                }
              ],
              "impact": "critical",
              "message": "Element has an explicit <label>"
            },
            {
              "id": "non-empty-placeholder",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element has a placeholder attribute"
            }
          ],
          "all": [],
          "none": [
            {
              "id": "hidden-explicit-label",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Form element has a visible explicit <label>"
            }
          ],
          "impact": null,
          "html": "<input id=\"newsletterEmail\" name=\"email\" type=\"email\" placeholder=\"you@example.com\" autocomplete=\"email\" required=\"\">",
          "target": [
            "#newsletterEmail"
          ]
        }
      ]
    },
    {
      "id": "link-name",
      "impact": null,
      "tags": [
        "cat.name-role-value",
        "wcag2a",
        "wcag244",
        "wcag412",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT6.a",
        "EN-301-549",
        "EN-9.2.4.4",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure links have discernible text",
      "help": "Links must have discernible text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/link-name?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "has-visible-text",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "Element has text that is visible to screen readers"
            }
          ],
          "all": [],
          "none": [
            {
              "id": "focusable-no-name",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "Element is not in tab order or has accessible text"
            }
          ],
          "impact": null,
          "html": "<a class=\"skip-link\" href=\"#main-content\">Skip to main content</a>",
          "target": [
            ".skip-link"
          ]
        }
      ]
    },
    {
      "id": "list",
      "impact": null,
      "tags": [
        "cat.structure",
        "wcag2a",
        "wcag131",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure that lists are structured correctly",
      "help": "<ul> and <ol> must only directly contain <li>, <script> or <template> elements",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/list?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [],
          "none": [
            {
              "id": "only-listitems",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "List element only has direct children that are allowed inside <li> elements"
            }
          ],
          "impact": null,
          "html": "<ul>",
          "target": [
            "#primaryNav > ul"
          ]
        }
      ]
    },
    {
      "id": "listitem",
      "impact": null,
      "tags": [
        "cat.structure",
        "wcag2a",
        "wcag131",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure <li> elements are used semantically",
      "help": "<li> elements must be contained in a <ul> or <ol>",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/listitem?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "listitem",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "List item has a <ul>, <ol> or role=\"list\" parent element"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<li><a href=\"#latest\" aria-current=\"page\">Latest</a></li>",
          "target": [
            "#primaryNav > ul > li:nth-child(1)"
          ]
        }
      ]
    },
    {
      "id": "meta-viewport",
      "impact": null,
      "tags": [
        "cat.sensory-and-visual-cues",
        "wcag2aa",
        "wcag144",
        "EN-301-549",
        "EN-9.1.4.4",
        "ACT"
      ],
      "description": "Ensure <meta name=\"viewport\"> does not disable text scaling and zooming",
      "help": "Zooming and scaling must not be disabled",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/meta-viewport?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "meta-viewport",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "<meta> tag does not disable zooming on mobile devices"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">",
          "target": [
            "meta[name=\"viewport\"]"
          ]
        }
      ]
    },
    {
      "id": "nested-interactive",
      "impact": null,
      "tags": [
        "cat.keyboard",
        "wcag2a",
        "wcag412",
        "TTv5",
        "TT6.a",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure interactive controls are not nested as they are not always announced by screen readers or can cause focus problems for assistive technologies",
      "help": "Interactive controls must not be nested",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/nested-interactive?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "no-focusable-content",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "Element does not have focusable descendants"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<img class=\"brand__logo\" src=\"https://placehold.co/96x96/d9ff57/171713?text=S%2B&amp;font=montserrat\" alt=\"Signal and Stage logo placeholder\">",
          "target": [
            ".header__inner > .brand[aria-label=\"Signal and Stage home\"][href$=\"#top\"] > .brand__logo"
          ]
        }
      ]
    },
    {
      "id": "summary-name",
      "impact": null,
      "tags": [
        "cat.name-role-value",
        "wcag2a",
        "wcag412",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT6.a",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure summary elements have discernible text",
      "help": "Summary elements must have discernible text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/summary-name?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "has-visible-text",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "Element has text that is visible to screen readers"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<summary>What does Signal &amp; Stage cover?</summary>",
          "target": [
            "details:nth-child(1) > summary"
          ]
        }
      ]
    },
    {
      "id": "target-size",
      "impact": null,
      "tags": [
        "cat.sensory-and-visual-cues",
        "wcag22aa",
        "wcag258"
      ],
      "description": "Ensure touch targets have sufficient size and space",
      "help": "All touch targets must be 24px large, or leave sufficient space",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/target-size?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "target-size",
              "data": {
                "minSize": 24,
                "width": 203.8,
                "height": 51.2
              },
              "relatedNodes": [],
              "impact": "serious",
              "message": "Control has sufficient size (203.8px by 51.2px, should be at least 24px by 24px)"
            },
            {
              "id": "target-offset",
              "data": {
                "closestOffset": 24,
                "minOffset": 24
              },
              "relatedNodes": [],
              "impact": "serious",
              "message": "Target has sufficient space from its closest neighbors. Safe clickable space has a diameter of 24px which is at least 24px."
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<a class=\"skip-link\" href=\"#main-content\">Skip to main content</a>",
          "target": [
            ".skip-link"
          ]
        }
      ]
    }
  ],
  "incomplete": [
    {
      "id": "aria-prohibited-attr",
      "impact": "serious",
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure ARIA attributes are not prohibited for an element's role",
      "help": "Elements must only use permitted ARIA attributes",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-prohibited-attr?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [],
          "none": [
            {
              "id": "aria-prohibited-attr",
              "data": {
                "role": null,
                "nodeName": "div",
                "messageKey": "noRoleSingular",
                "prohibited": [
                  "aria-label"
                ]
              },
              "relatedNodes": [],
              "impact": "serious",
              "message": "aria-label attribute is not well supported on a div with no valid role attribute."
            }
          ],
          "impact": "serious",
          "html": "<div class=\"hero__signals\" aria-label=\"Signal and Stage at a glance\">",
          "target": [
            ".hero__signals"
          ],
          "failureSummary": "Fix all of the following:\n  aria-label attribute is not well supported on a div with no valid role attribute."
        }
      ]
    },
    {
      "id": "color-contrast",
      "impact": "serious",
      "tags": [
        "cat.color",
        "wcag2aa",
        "wcag143",
        "TTv5",
        "TT13.c",
        "EN-301-549",
        "EN-9.1.4.3",
        "ACT"
      ],
      "description": "Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds",
      "help": "Elements must meet minimum color contrast ratio thresholds",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/color-contrast?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "messageKey": "nonBmp"
              },
              "relatedNodes": [],
              "impact": "serious",
              "message": "Element content contains only non-text characters"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"arrow\" aria-hidden=\"true\">\u2192</span>",
          "target": [
            ".button--outline.button[href$=\"#tickets\"] > .arrow[aria-hidden=\"true\"]"
          ],
          "failureSummary": "Fix any of the following:\n  Element content contains only non-text characters"
        }
      ]
    },
    {
      "id": "link-in-text-block",
      "impact": "serious",
      "tags": [
        "cat.color",
        "wcag2a",
        "wcag141",
        "TTv5",
        "TT13.a",
        "EN-301-549",
        "EN-9.1.4.1"
      ],
      "description": "Ensure links are distinguished from surrounding text in a way that does not rely on color",
      "help": "Links must be distinguishable without relying on color",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/link-in-text-block?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "link-in-text-block",
              "data": {
                "messageKey": "bgOverlap"
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"footer-brand\">",
                  "target": [
                    ".footer-brand"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element's contrast ratio could not be determined because of element overlap"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<a class=\"brand\" href=\"#top\" aria-label=\"Signal and Stage home\">",
          "target": [
            ".footer-brand > .brand[aria-label=\"Signal and Stage home\"][href$=\"#top\"]"
          ],
          "failureSummary": "Fix any of the following:\n  Element's contrast ratio could not be determined because of element overlap"
        }
      ]
    }
  ],
  "violations": [
    {
      "id": "color-contrast",
      "impact": "serious",
      "tags": [
        "cat.color",
        "wcag2aa",
        "wcag143",
        "TTv5",
        "TT13.c",
        "EN-301-549",
        "EN-9.1.4.3",
        "ACT"
      ],
      "description": "Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds",
      "help": "Elements must meet minimum color contrast ratio thresholds",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/color-contrast?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#747471",
                "bgColor": "#171713",
                "contrastRatio": 3.83,
                "fontSize": "7.3pt (9.76px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<footer class=\"site-footer\" id=\"about\">",
                  "target": [
                    "#about"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.83 (foreground color: #747471, background color: #171713, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<p>\u00a9 <span id=\"currentYear\">2026</span> Signal &amp; Stage. All rights reserved.</p>",
          "target": [
            ".footer-bottom > p"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.83 (foreground color: #747471, background color: #171713, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#747471",
                "bgColor": "#171713",
                "contrastRatio": 3.83,
                "fontSize": "7.3pt (9.76px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<footer class=\"site-footer\" id=\"about\">",
                  "target": [
                    "#about"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.83 (foreground color: #747471, background color: #171713, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span id=\"currentYear\">2026</span>",
          "target": [
            "#currentYear"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.83 (foreground color: #747471, background color: #171713, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#747471",
                "bgColor": "#171713",
                "contrastRatio": 3.83,
                "fontSize": "7.3pt (9.76px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<footer class=\"site-footer\" id=\"about\">",
                  "target": [
                    "#about"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.83 (foreground color: #747471, background color: #171713, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<a href=\"#privacy\">Privacy</a>",
          "target": [
            "a[href$=\"#privacy\"]"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.83 (foreground color: #747471, background color: #171713, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#747471",
                "bgColor": "#171713",
                "contrastRatio": 3.83,
                "fontSize": "7.3pt (9.76px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<footer class=\"site-footer\" id=\"about\">",
                  "target": [
                    "#about"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.83 (foreground color: #747471, background color: #171713, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<a href=\"#terms\">Terms</a>",
          "target": [
            "a[href$=\"#terms\"]"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.83 (foreground color: #747471, background color: #171713, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#747471",
                "bgColor": "#171713",
                "contrastRatio": 3.83,
                "fontSize": "7.3pt (9.76px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<footer class=\"site-footer\" id=\"about\">",
                  "target": [
                    "#about"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.83 (foreground color: #747471, background color: #171713, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<a href=\"#accessibility\">Accessibility</a>",
          "target": [
            "a[href$=\"#accessibility\"]"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.83 (foreground color: #747471, background color: #171713, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#747471",
                "bgColor": "#171713",
                "contrastRatio": 3.83,
                "fontSize": "7.3pt (9.76px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<footer class=\"site-footer\" id=\"about\">",
                  "target": [
                    "#about"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.83 (foreground color: #747471, background color: #171713, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<a href=\"#top\">Back to top \u2191</a>",
          "target": [
            ".footer-legal > a[href$=\"#top\"]"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.83 (foreground color: #747471, background color: #171713, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#fffef9",
                "contrastRatio": 2.85,
                "fontSize": "7.8pt (10.4px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<article class=\"lead-story reveal is-visible\">",
                  "target": [
                    ".lead-story"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"story-tag\">Performing arts</span>",
          "target": [
            "div:nth-child(1) > .story-tag"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#fffef9",
                "contrastRatio": 2.85,
                "fontSize": "7.8pt (10.4px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<article class=\"side-story reveal is-visible\">",
                  "target": [
                    ".side-story.is-visible:nth-child(1)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"story-tag\">Film</span>",
          "target": [
            ".side-story.is-visible:nth-child(1) > .side-story__content > .story-tag"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#fffef9",
                "contrastRatio": 2.85,
                "fontSize": "7.8pt (10.4px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<article class=\"side-story reveal is-visible\">",
                  "target": [
                    ".side-story.is-visible:nth-child(2)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"story-tag\">Sound art</span>",
          "target": [
            ".side-story.is-visible:nth-child(2) > .side-story__content > .story-tag"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#f3efe5",
                "contrastRatio": 2.51,
                "fontSize": "7.7pt (10.24px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.51 (foreground color: #ff6747, background color: #f3efe5, font size: 7.7pt (10.24px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span>Also on our radar</span>",
          "target": [
            ".radar__title > span"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.51 (foreground color: #ff6747, background color: #f3efe5, font size: 7.7pt (10.24px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#f3efe5",
                "contrastRatio": 2.51,
                "fontSize": "7.8pt (10.4px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.51 (foreground color: #ff6747, background color: #f3efe5, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"story-tag\">Residencies</span>",
          "target": [
            ".radar__item:nth-child(2) > .story-tag"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.51 (foreground color: #ff6747, background color: #f3efe5, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#f3efe5",
                "contrastRatio": 2.51,
                "fontSize": "7.8pt (10.4px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.51 (foreground color: #ff6747, background color: #f3efe5, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"story-tag\">Publishing</span>",
          "target": [
            ".radar__item:nth-child(3) > .story-tag"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.51 (foreground color: #ff6747, background color: #f3efe5, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#f3efe5",
                "contrastRatio": 2.51,
                "fontSize": "7.8pt (10.4px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.51 (foreground color: #ff6747, background color: #f3efe5, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"story-tag\">Design</span>",
          "target": [
            ".radar__item:nth-child(4) > .story-tag"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.51 (foreground color: #ff6747, background color: #f3efe5, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#6d6c64",
                "bgColor": "#e8e2d4",
                "contrastRatio": 4.08,
                "fontSize": "8.6pt (11.52px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<section class=\"section schedule-section\" id=\"tickets\">",
                  "target": [
                    "#tickets"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.08 (foreground color: #6d6c64, background color: #e8e2d4, font size: 8.6pt (11.52px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<p class=\"eyebrow\">02 / Your week, considered</p>",
          "target": [
            "#tickets > .container > .section-heading.is-visible.reveal > div:nth-child(1) > .eyebrow"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.08 (foreground color: #6d6c64, background color: #e8e2d4, font size: 8.6pt (11.52px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#6d6c64",
                "bgColor": "#e8e2d4",
                "contrastRatio": 4.08,
                "fontSize": "12.0pt (16px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<section class=\"section schedule-section\" id=\"tickets\">",
                  "target": [
                    "#tickets"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.08 (foreground color: #6d6c64, background color: #e8e2d4, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<p class=\"section-heading__copy\">\n              A handpicked calendar of performances, screenings, installations, and open studios. Filter by day, find your room, and reserve without losing the plot.\n            </p>",
          "target": [
            "div:nth-child(2) > .section-heading__copy"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.08 (foreground color: #6d6c64, background color: #e8e2d4, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#fffef9",
                "contrastRatio": 2.85,
                "fontSize": "7.3pt (9.76px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"calendar-panel reveal is-visible\">",
                  "target": [
                    ".calendar-panel"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"event-category\">Music</span>",
          "target": [
            ".event-item[data-day=\"thu\"]:nth-child(1) > .event-info > .event-category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#fffef9",
                "contrastRatio": 2.85,
                "fontSize": "7.3pt (9.76px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"calendar-panel reveal is-visible\">",
                  "target": [
                    ".calendar-panel"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"event-category\">Installation</span>",
          "target": [
            ".event-item[data-day=\"thu\"]:nth-child(2) > .event-info > .event-category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#fffef9",
                "contrastRatio": 2.85,
                "fontSize": "7.3pt (9.76px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"calendar-panel reveal is-visible\">",
                  "target": [
                    ".calendar-panel"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"event-category\">Film</span>",
          "target": [
            ".event-item[data-day=\"fri\"]:nth-child(3) > .event-info > .event-category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#fffef9",
                "contrastRatio": 2.85,
                "fontSize": "7.3pt (9.76px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"calendar-panel reveal is-visible\">",
                  "target": [
                    ".calendar-panel"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"event-category\">Theatre</span>",
          "target": [
            ".event-item[data-day=\"fri\"]:nth-child(4) > .event-info > .event-category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#fffef9",
                "contrastRatio": 2.85,
                "fontSize": "7.3pt (9.76px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"calendar-panel reveal is-visible\">",
                  "target": [
                    ".calendar-panel"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"event-category\">Live music</span>",
          "target": [
            ".event-item[data-day=\"sat\"]:nth-child(5) > .event-info > .event-category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#fffef9",
                "contrastRatio": 2.85,
                "fontSize": "7.3pt (9.76px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"calendar-panel reveal is-visible\">",
                  "target": [
                    ".calendar-panel"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"event-category\">Performance</span>",
          "target": [
            ".event-item[data-day=\"sat\"]:nth-child(6) > .event-info > .event-category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#fffef9",
                "contrastRatio": 2.85,
                "fontSize": "7.3pt (9.76px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"calendar-panel reveal is-visible\">",
                  "target": [
                    ".calendar-panel"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"event-category\">Open studios</span>",
          "target": [
            ".event-item[data-day=\"sun\"]:nth-child(7) > .event-info > .event-category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#fffef9",
                "contrastRatio": 2.85,
                "fontSize": "7.3pt (9.76px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"calendar-panel reveal is-visible\">",
                  "target": [
                    ".calendar-panel"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"event-category\">Spoken word</span>",
          "target": [
            ".event-item[data-day=\"sun\"]:nth-child(8) > .event-info > .event-category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.3pt (9.76px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#f3efe5",
                "contrastRatio": 2.51,
                "fontSize": "7.4pt (9.92px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"aside-card reveal is-visible\">",
                  "target": [
                    ".aside-card.is-visible.reveal:nth-child(2)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.51 (foreground color: #ff6747, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"aside-card__label\">Venue spotlight</span>",
          "target": [
            ".aside-card.is-visible.reveal:nth-child(2) > .aside-card__label"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.51 (foreground color: #ff6747, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#6d6c64",
                "bgColor": "#f4e4d8",
                "contrastRatio": 4.25,
                "fontSize": "7.1pt (9.44px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<header class=\"site-header is-scrolled\" id=\"siteHeader\">",
                  "target": [
                    "#siteHeader"
                  ]
                },
                {
                  "html": "<section class=\"section process-section\" id=\"process\">",
                  "target": [
                    "#process"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.25 (foreground color: #6d6c64, background color: #f4e4d8, font size: 7.1pt (9.44px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"brand__tagline\">Where culture moves forward</span>",
          "target": [
            ".header__inner > .brand[aria-label=\"Signal and Stage home\"][href$=\"#top\"] > span > .brand__tagline"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.25 (foreground color: #6d6c64, background color: #f4e4d8, font size: 7.1pt (9.44px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#6d6c64",
                "bgColor": "#ff6747",
                "contrastRatio": 1.83,
                "fontSize": "8.6pt (11.52px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<section class=\"section process-section\" id=\"process\">",
                  "target": [
                    "#process"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 1.83 (foreground color: #6d6c64, background color: #ff6747, font size: 8.6pt (11.52px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<p class=\"eyebrow\">05 / The creative process</p>",
          "target": [
            ".process-copy > .eyebrow"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 1.83 (foreground color: #6d6c64, background color: #ff6747, font size: 8.6pt (11.52px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#4d63ff",
                "bgColor": "#f3efe5",
                "contrastRatio": 4.02,
                "fontSize": "7.4pt (9.92px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"news-item__category\">Institutional economics</span>",
          "target": [
            ".news-item.is-visible > div:nth-child(2) > .news-item__category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#6b6b68",
                "bgColor": "#171713",
                "contrastRatio": 3.36,
                "fontSize": "7.2pt (9.6px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<aside class=\"newsletter-panel reveal is-visible\" id=\"newsletter\">",
                  "target": [
                    "#newsletter"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.36 (foreground color: #6b6b68, background color: #171713, font size: 7.2pt (9.6px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<p class=\"fine-print\">Free forever. No spam. Unsubscribe with one click.</p>",
          "target": [
            ".fine-print"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.36 (foreground color: #6b6b68, background color: #171713, font size: 7.2pt (9.6px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#4d63ff",
                "bgColor": "#f3efe5",
                "contrastRatio": 4.02,
                "fontSize": "7.4pt (9.92px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"news-item__category\">Institutional economics</span>",
          "target": [
            ".news-item.is-visible:nth-child(1) > div:nth-child(2) > .news-item__category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#4d63ff",
                "bgColor": "#f3efe5",
                "contrastRatio": 4.02,
                "fontSize": "7.4pt (9.92px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"news-item__category\">Climate &amp; touring</span>",
          "target": [
            ".news-item.is-visible:nth-child(2) > div:nth-child(2) > .news-item__category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#4d63ff",
                "bgColor": "#f3efe5",
                "contrastRatio": 4.02,
                "fontSize": "7.4pt (9.92px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"news-item__category\">Creative labor</span>",
          "target": [
            ".news-item.is-visible:nth-child(3) > div:nth-child(2) > .news-item__category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#4d63ff",
                "bgColor": "#f3efe5",
                "contrastRatio": 4.02,
                "fontSize": "7.4pt (9.92px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"news-item__category\">Technology</span>",
          "target": [
            ".news-item.is-visible:nth-child(4) > div:nth-child(2) > .news-item__category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#fffef9",
                "contrastRatio": 2.85,
                "fontSize": "7.8pt (10.4px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<article class=\"side-story reveal is-visible\">",
                  "target": [
                    ".side-story:nth-child(1)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"story-tag\">Film</span>",
          "target": [
            ".side-story:nth-child(1) > .side-story__content > .story-tag"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#fffef9",
                "contrastRatio": 2.85,
                "fontSize": "7.8pt (10.4px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<article class=\"side-story reveal is-visible\">",
                  "target": [
                    ".side-story:nth-child(2)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"story-tag\">Sound art</span>",
          "target": [
            ".side-story:nth-child(2) > .side-story__content > .story-tag"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.85 (foreground color: #ff6747, background color: #fffef9, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#4d63ff",
                "bgColor": "#f3efe5",
                "contrastRatio": 4.02,
                "fontSize": "7.4pt (9.92px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"news-item__category\">Institutional economics</span>",
          "target": [
            ".news-item:nth-child(1) > div:nth-child(2) > .news-item__category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#4d63ff",
                "bgColor": "#f3efe5",
                "contrastRatio": 4.02,
                "fontSize": "7.4pt (9.92px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"news-item__category\">Climate &amp; touring</span>",
          "target": [
            ".news-item:nth-child(2) > div:nth-child(2) > .news-item__category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#4d63ff",
                "bgColor": "#f3efe5",
                "contrastRatio": 4.02,
                "fontSize": "7.4pt (9.92px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"news-item__category\">Creative labor</span>",
          "target": [
            ".news-item:nth-child(3) > div:nth-child(2) > .news-item__category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#4d63ff",
                "bgColor": "#f3efe5",
                "contrastRatio": 4.02,
                "fontSize": "7.4pt (9.92px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"news-item__category\">Technology</span>",
          "target": [
            ".news-item:nth-child(4) > div:nth-child(2) > .news-item__category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.02 (foreground color: #4d63ff, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#6d6c64",
                "bgColor": "#e8e2d4",
                "contrastRatio": 4.08,
                "fontSize": "8.6pt (11.52px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<section class=\"section voices-section\">",
                  "target": [
                    ".voices-section"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.08 (foreground color: #6d6c64, background color: #e8e2d4, font size: 8.6pt (11.52px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<p class=\"eyebrow\">07 / Backstage pass</p>",
          "target": [
            ".voices-section > .container > .section-heading.is-visible.reveal > div > .eyebrow"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.08 (foreground color: #6d6c64, background color: #e8e2d4, font size: 8.6pt (11.52px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#6d6c64",
                "bgColor": "#e8e2d4",
                "contrastRatio": 4.08,
                "fontSize": "12.0pt (16px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<section class=\"section voices-section\">",
                  "target": [
                    ".voices-section"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.08 (foreground color: #6d6c64, background color: #e8e2d4, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<p class=\"section-heading__copy\">\n            Artists, producers, archivists, and audience members share what deserves more attention\u2014and what the cultural sector should stop overlooking.\n          </p>",
          "target": [
            ".voices-section > .container > .section-heading.is-visible.reveal > .section-heading__copy"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.08 (foreground color: #6d6c64, background color: #e8e2d4, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#6d6c64",
                "bgColor": "#e8e2d4",
                "contrastRatio": 4.08,
                "fontSize": "8.6pt (11.52px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<section class=\"section schedule-section\" id=\"tickets\">",
                  "target": [
                    "#tickets"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.08 (foreground color: #6d6c64, background color: #e8e2d4, font size: 8.6pt (11.52px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<p class=\"eyebrow\">02 / Your week, considered</p>",
          "target": [
            "#tickets > .container > .section-heading.reveal.is-visible > div:nth-child(1) > .eyebrow"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.08 (foreground color: #6d6c64, background color: #e8e2d4, font size: 8.6pt (11.52px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ff6747",
                "bgColor": "#f3efe5",
                "contrastRatio": 2.51,
                "fontSize": "7.4pt (9.92px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"aside-card reveal is-visible\">",
                  "target": [
                    ".aside-card.reveal.is-visible:nth-child(2)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.51 (foreground color: #ff6747, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"aside-card__label\">Venue spotlight</span>",
          "target": [
            ".aside-card.reveal.is-visible:nth-child(2) > .aside-card__label"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.51 (foreground color: #ff6747, background color: #f3efe5, font size: 7.4pt (9.92px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#6d6c64",
                "bgColor": "#e8e2d4",
                "contrastRatio": 4.08,
                "fontSize": "8.6pt (11.52px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<section class=\"section voices-section\">",
                  "target": [
                    ".voices-section"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.08 (foreground color: #6d6c64, background color: #e8e2d4, font size: 8.6pt (11.52px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<p class=\"eyebrow\">07 / Backstage pass</p>",
          "target": [
            ".voices-section > .container > .section-heading.reveal.is-visible > div > .eyebrow"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.08 (foreground color: #6d6c64, background color: #e8e2d4, font size: 8.6pt (11.52px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#6d6c64",
                "bgColor": "#e8e2d4",
                "contrastRatio": 4.08,
                "fontSize": "12.0pt (16px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<section class=\"section voices-section\">",
                  "target": [
                    ".voices-section"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.08 (foreground color: #6d6c64, background color: #e8e2d4, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<p class=\"section-heading__copy\">\n            Artists, producers, archivists, and audience members share what deserves more attention\u2014and what the cultural sector should stop overlooking.\n          </p>",
          "target": [
            ".voices-section > .container > .section-heading.reveal.is-visible > .section-heading__copy"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.08 (foreground color: #6d6c64, background color: #e8e2d4, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1"
        }
      ]
    }
  ],
  "coverage": {
    "contract": "main-document-vertical-scroll",
    "complete": true,
    "positions": [
      {
        "y": 0,
        "height": 11692
      },
      {
        "y": 576,
        "height": 11692
      },
      {
        "y": 1152,
        "height": 11692
      },
      {
        "y": 1728,
        "height": 11692
      },
      {
        "y": 2304,
        "height": 11692
      },
      {
        "y": 2880,
        "height": 11692
      },
      {
        "y": 3456,
        "height": 11692
      },
      {
        "y": 4032,
        "height": 11692
      },
      {
        "y": 4608,
        "height": 11692
      },
      {
        "y": 5184,
        "height": 11692
      },
      {
        "y": 5760,
        "height": 11692
      },
      {
        "y": 6336,
        "height": 11692
      },
      {
        "y": 6912,
        "height": 11692
      },
      {
        "y": 7488,
        "height": 11692
      },
      {
        "y": 8064,
        "height": 11692
      },
      {
        "y": 8640,
        "height": 11692
      },
      {
        "y": 9216,
        "height": 11692
      },
      {
        "y": 9792,
        "height": 11692
      },
      {
        "y": 10368,
        "height": 11692
      },
      {
        "y": 10944,
        "height": 11692
      },
      {
        "y": 10972,
        "height": 11692
      }
    ],
    "scans": 22,
    "max_states": 512,
    "settle_ms": 5000,
    "page_timeout_seconds": 150,
    "layout_stability": "consecutive 100ms size samples within one CSS pixel",
    "animation_settling": "finite animations present when scroll resources are ready finish or are cancelled",
    "interactive_states": "not exercised",
    "horizontal_scroll": "not exercised"
  }
}
System Prompt
You are a lead web developer at a top digital agency, tasked with creating a one-page website for a new client based on the given specifications, delivered as an HTML file. First non-whitespace char '<', last non-whitespace char '>'. Use the following services to generate placeholder images where needed:
- placehold.co (text): https://placehold.co/[{w}x{h}|{size}][/{bg-color}/{text-color}]?text={text}&font=[lato|lora|montserrat|noto sans|open sans|oswald|playfair display|poppins|pt sans|raleway|roboto|source sans|source sans pro]
- picsum.photos (photos): https://picsum.photos/[{w}/{h}|{size}]?[grayscale][&blur={1-10}]
- pravatar.cc (avatars): https://i.pravatar.cc/{size}?u={identifier}
Choose sizes appropriate to layout.
User Prompt
Create a **complete, polished, production-quality** primary web page for a new client in the "Arts and Entertainment" sector.
Your goal is to generate the full HTML code for a page that is not just functional but also visually compelling, content-rich, and feels like a finished product ready for launch.

**Client & Category:**
- Industry: "Arts and Entertainment"
- Description: Music, movies, visual arts, performing arts, and entertainment industry news and resources.

**Your Creative Task:**
1.  **Invent:** Create a unique, professional-sounding site name and a strong tagline fitting the "Arts and Entertainment" category.
2.  **Define Page:** Determine the most effective primary page type (e.g., homepage, service landing page, category portal) to showcase this fictional entity.
3.  **Design:** Develop an opinionated, modern, and professional layout. Make distinct choices about structure and flow.

**Content & Structure Requirements (Deliver a COMPLETE page):**
-   **Overall:** The final page must feel substantial and complete, with realistic amounts of text (multiple paragraphs per section where appropriate, avoid single sentences), well-integrated placeholder images, and logical flow. It should look like a real website a business would proudly use.
-   **HEADER:** Include the invented site name, tagline, a logo placeholder image, and a primary navigation bar. Ensure the navigation has **at least 5-7 clearly defined, relevant links** including: "Galleries", "Tickets", "News".
-   **MAIN CONTENT:** Structure this area with **at least 3-4 distinct, well-developed sections**.
    -   Address key topics relevant to the "Arts and Entertainment" category. Consider themes similar to: "Creative Process", "Industry News", "Artist Spotlights".
    -   **Content Depth:** Populate each section with **substantial, realistic text** (multiple sentences/paragraphs). Use authentic industry language and terminology like: "installation", "residency", "ensemble".
    -   **Visuals:** Integrate relevant placeholder images logically within the content sections.
    -   **Calls to Action:** Include clear and contextually relevant CTAs. Use strong verbs similar to: "View Gallery", "Explore", "Join Waitlist".
-   **ENGAGEMENT (Recommended):** Strongly consider incorporating **one meaningful interactive element** that would genuinely benefit a user in the "Arts and Entertainment" sector. Ideas similar but not limited to: "event calendar".
-   **SIDEBAR (Optional):** If your design includes a sidebar, populate it with **useful, relevant content**. Ideas: "venue spotlights", "fan favorites", "upcoming premieres".
-   **FOOTER:** Include a professional footer with invented contact details, copyright (current year), social media links, and standard links (Privacy, Terms).
-   **MODERN WEB PATTERNS:** Include modern web patterns like testimonial cards, feature grids, or FAQ accordions where appropriate.