:root {
      --blue: #0a3d91;
      --navy: #082f72;
      --pink: #e5187e;
      --green: #79c143;
      --yellow: #ffd51f;
      --ink: #101827;
      --paper: #f6f3ed;
    }

    html {
      scroll-padding-top: 92px;
    }

    body {
      font-family: "Barlow", ui-sans-serif, system-ui, sans-serif;
    }

    .font-display {
      font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
    }

    .noise {
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.16'/%3E%3C/svg%3E");
      mix-blend-mode: soft-light;
    }

    .track-grid {
      background-image:
        linear-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .07) 1px, transparent 1px);
      background-size: 56px 56px;
    }

    .hero-mask {
      background:
        linear-gradient(90deg, rgba(6, 28, 74, .97) 0%, rgba(6, 28, 74, .83) 40%, rgba(6, 28, 74, .38) 66%, rgba(6, 28, 74, .17) 100%),
        linear-gradient(0deg, rgba(6, 28, 74, .55) 0%, transparent 50%);
    }

    .clip-slant {
      clip-path: polygon(0 0, 100% 0, 93% 100%, 0 100%);
    }

    .clip-arrow {
      clip-path: polygon(0 0, 84% 0, 100% 50%, 84% 100%, 0 100%, 10% 50%);
    }

    .outline-text {
      color: transparent;
      -webkit-text-stroke: 1px rgba(255, 255, 255, .35);
      text-stroke: 1px rgba(255, 255, 255, .35);
    }

    .vertical-writing {
      writing-mode: vertical-rl;
      transform: rotate(180deg);
    }

    .marquee-track {
      animation: marquee 28s linear infinite;
      width: max-content;
    }

    @keyframes marquee {
      from {
        transform: translateX(0);
      }

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

    .reveal-ready [data-reveal] {
      opacity: 0;
      transform: translateY(24px);
      transition: opacity .65s ease, transform .65s cubic-bezier(.2, .75, .2, 1);
    }

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

    .schedule-panel[hidden] {
      display: none;
    }

    .faq-panel[hidden] {
      display: none;
    }

    .focus-ring:focus-visible,
    a:focus-visible,
    button:focus-visible {
      outline: 3px solid var(--yellow);
      outline-offset: 3px;
    }

    @media (prefers-reduced-motion: reduce) {

      *,
      *::before,
      *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
      }

      .reveal-ready [data-reveal] {
        opacity: 1;
        transform: none;
      }
    }
