/* Portfolio styles: footer console, signal visualizer and desktop fullscreen polish.
   Source: portfolio.html split for cacheability and ownership. */
    /* ============ FOOTER ============ */
    .footer {
      --footer-energy: 0;
      --footer-bass: 0;
      --footer-mid: 0;
      --footer-treble: 0;
      --footer-pad: clamp(18px, 2.4vw, 30px);
      position: relative;
      width: min(1240px, calc(100% - clamp(32px, 6vw, 80px)));
      min-height: clamp(430px, calc(100svh - 164px), 620px);
      margin: clamp(54px, 8vh, 96px) auto clamp(48px, 7vh, 84px);
      scroll-margin-top: calc(var(--floating-auth-header-offset) + 104px);
      scroll-snap-align: center;
      border: 1px solid rgba(245, 241, 236, .12);
      border-radius: 24px;
      padding: var(--footer-pad);
      display: grid;
      grid-template-columns: minmax(280px, .88fr) minmax(380px, 1.12fr);
      gap: clamp(20px, 3.5vw, 46px);
      align-items: stretch;
      overflow: hidden;
      isolation: isolate;
      font-family: var(--mono);
      font-size: 11px;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--ink-mute);
      background:
        radial-gradient(72% 150% at 18% 12%, rgba(255, 138, 61, calc(.1 + var(--footer-energy) * .12)), transparent 58%),
        radial-gradient(62% 110% at 88% 68%, rgba(255, 222, 178, calc(.035 + var(--footer-treble) * .08)), transparent 66%),
        linear-gradient(180deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .015)),
        rgba(7, 7, 9, .84);
      box-shadow:
        0 34px 110px rgba(0, 0, 0, .48),
        0 0 calc(22px + var(--footer-energy) * 34px) rgba(255, 138, 61, calc(.06 + var(--footer-energy) * .12)),
        inset 0 1px 0 rgba(255, 255, 255, .08),
        inset 0 0 0 1px rgba(255, 138, 61, .035);
      backdrop-filter: blur(22px) saturate(132%);
      -webkit-backdrop-filter: blur(22px) saturate(132%);
    }

    .footer::before,
    .footer::after {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
    }

    .footer::before {
      z-index: -2;
      background:
        linear-gradient(120deg, transparent 0 42%, rgba(255, 255, 255, calc(.025 + var(--footer-treble) * .04)) 42.5%, transparent 48%),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, .025) 0 1px, transparent 1px 46px),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, .018) 0 1px, transparent 1px 46px);
      mask-image: radial-gradient(circle at 50% 50%, #000, transparent 82%);
      -webkit-mask-image: radial-gradient(circle at 50% 50%, #000, transparent 82%);
      opacity: calc(.58 + var(--footer-energy) * .24);
    }

    .footer::after {
      z-index: -1;
      background:
        linear-gradient(90deg, rgba(0, 0, 0, .5), transparent 16%, transparent 84%, rgba(0, 0, 0, .5)),
        radial-gradient(circle at 50% 100%, transparent 0 38%, rgba(0, 0, 0, .44) 100%);
    }

    .footer__identity {
      position: relative;
      z-index: 2;
      min-width: 0;
      display: grid;
      align-content: center;
      gap: clamp(18px, 3vh, 28px);
    }

    .footer .brand {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      width: fit-content;
      color: var(--ink);
      font-weight: 900;
    }

    .footer .brand svg {
      width: 22px;
      height: 22px;
      filter: drop-shadow(0 0 14px rgba(255, 138, 61, .28));
    }

    .footer__headline {
      margin: 0;
      max-width: 11ch;
      color: var(--ink);
      font-family: var(--display);
      font-size: clamp(40px, 5.8vw, 84px);
      font-weight: 520;
      line-height: .92;
      letter-spacing: -.045em;
      text-transform: none;
    }

    .footer__headline em {
      color: var(--amber);
      font-style: normal;
    }

    .footer__eyebrow {
      width: fit-content;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: rgba(255, 181, 98, .78);
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .16em;
      text-transform: uppercase;
    }

    .footer__eyebrow::before {
      content: "";
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--amber);
      box-shadow: 0 0 16px rgba(255, 138, 61, .42);
    }

    .footer__copy {
      max-width: 560px;
      margin: -4px 0 0;
      color: rgba(245, 241, 236, .72);
      font-family: var(--display);
      font-size: clamp(16px, 1.35vw, 20px);
      font-weight: 430;
      line-height: 1.42;
      letter-spacing: 0;
      text-transform: none;
    }

    .footer__actions {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
    }

    .footer__action {
      min-height: 42px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 0 15px;
      border: 1px solid rgba(245, 241, 236, .13);
      border-radius: 999px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .018)),
        rgba(7, 7, 9, .42);
      color: rgba(245, 241, 236, .86);
      font-family: var(--display);
      font-size: 13px;
      font-weight: 720;
      letter-spacing: 0;
      text-decoration: none;
      text-transform: none;
      cursor: pointer;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
      transition: transform .22s ease, border-color .22s ease, background .22s ease, color .22s ease, box-shadow .22s ease;
    }

    .footer__action--primary {
      border-color: rgba(255, 181, 98, .7);
      background: linear-gradient(135deg, #ffb247 0%, #ff8a3d 55%, #f06f29 100%);
      color: #120900;
      box-shadow:
        0 18px 42px rgba(255, 138, 61, .22),
        inset 0 1px 0 rgba(255, 244, 225, .42);
    }

    .footer__action:hover,
    .footer__action:focus-visible {
      transform: translateY(-1px);
      border-color: rgba(255, 181, 98, .42);
      color: var(--ink);
      box-shadow:
        0 18px 38px rgba(0, 0, 0, .28),
        inset 0 1px 0 rgba(255, 255, 255, .08);
      outline: none;
    }

    .footer__action--primary:hover,
    .footer__action--primary:focus-visible {
      color: #070301;
      border-color: rgba(255, 228, 190, .95);
      box-shadow:
        0 22px 54px rgba(255, 138, 61, .3),
        inset 0 1px 0 rgba(255, 244, 225, .48);
    }

    .footer__meta {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
    }

    .footer__meta span {
      min-height: 28px;
      display: inline-flex;
      align-items: center;
      padding: 0 11px;
      border: 1px solid rgba(245, 241, 236, .1);
      border-radius: 999px;
      background: rgba(255, 255, 255, .035);
      color: rgba(245, 241, 236, .58);
      white-space: nowrap;
    }

    .footer__meta span:first-child {
      color: rgba(255, 181, 98, .78);
      border-color: rgba(255, 181, 98, .18);
    }

    .footer__viz {
      position: relative;
      z-index: 2;
      min-height: clamp(280px, 32vw, 410px);
      display: grid;
      grid-template-rows: auto minmax(150px, 1fr) auto;
      gap: clamp(14px, 2vw, 22px);
      padding: clamp(14px, 2vw, 20px);
      border: 1px solid rgba(245, 241, 236, .1);
      border-radius: 20px;
      overflow: hidden;
      background:
        radial-gradient(circle at 50% 52%, rgba(255, 138, 61, calc(.08 + var(--footer-bass) * .36)), transparent calc(38% + var(--footer-bass) * 8%)),
        linear-gradient(180deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .012)),
        rgba(3, 3, 5, .5);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .06),
        inset 0 0 0 1px rgba(0, 0, 0, .24),
        inset 0 0 calc(36px + var(--footer-bass) * 58px) rgba(255, 138, 61, calc(.02 + var(--footer-bass) * .08));
    }

    .footer__viz::before,
    .footer__viz::after {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
    }

    .footer__viz::before {
      z-index: 0;
      background:
        radial-gradient(ellipse at 50% 52%, rgba(255, 138, 61, calc(.06 + var(--footer-energy) * .16)), transparent 58%),
        linear-gradient(90deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px),
        linear-gradient(0deg, rgba(255, 255, 255, .024) 0 1px, transparent 1px);
      background-size: auto, 34px 34px, 34px 34px;
      mask-image: radial-gradient(circle at 50% 50%, #000, transparent 78%);
      -webkit-mask-image: radial-gradient(circle at 50% 50%, #000, transparent 78%);
      opacity: .72;
    }

    .footer__viz::after {
      z-index: 1;
      border-radius: inherit;
      background:
        linear-gradient(180deg, rgba(3, 3, 5, .42), transparent 24%, transparent 76%, rgba(3, 3, 5, .5)),
        linear-gradient(90deg, rgba(0, 0, 0, .42), transparent 18%, transparent 82%, rgba(0, 0, 0, .42));
      mix-blend-mode: multiply;
    }

    .footer__stage {
      position: relative;
      z-index: 3;
      min-height: 0;
      height: 100%;
      overflow: hidden;
      border: 1px solid rgba(245, 241, 236, .08);
      border-radius: 16px;
      background:
        radial-gradient(circle at 50% 52%, rgba(255, 138, 61, calc(.1 + var(--footer-bass) * .34)), transparent calc(38% + var(--footer-bass) * 12%)),
        radial-gradient(circle at 50% 52%, rgba(255, 226, 180, calc(.035 + var(--footer-treble) * .08)), transparent 68%),
        linear-gradient(180deg, rgba(255, 255, 255, .028), rgba(255, 255, 255, .008));
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .065),
        inset 0 -36px 70px rgba(0, 0, 0, calc(.3 + var(--footer-bass) * .16)),
        inset 0 0 calc(32px + var(--footer-bass) * 70px) rgba(255, 138, 61, calc(.03 + var(--footer-bass) * .1)),
        0 calc(18px + var(--footer-bass) * 18px) calc(42px + var(--footer-bass) * 34px) rgba(0, 0, 0, calc(.28 + var(--footer-bass) * .22));
    }

    .footer__stage::before,
    .footer__stage::after {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
    }

    .footer__stage::before {
      z-index: 0;
      background:
        radial-gradient(circle at 50% 52%, transparent 0 calc(20% + var(--footer-bass) * 4%), rgba(255, 181, 98, calc(.18 + var(--footer-bass) * .28)) calc(20.4% + var(--footer-bass) * 4%) calc(21.2% + var(--footer-bass) * 5%), transparent calc(21.8% + var(--footer-bass) * 5%) 35%, rgba(255, 226, 180, calc(.1 + var(--footer-bass) * .18)) 35.4% 36%, transparent 36.5% 50%, rgba(255, 138, 61, calc(.11 + var(--footer-bass) * .18)) 50.4% 51%, transparent 51.5%),
        conic-gradient(from calc(var(--footer-mid) * 24deg), transparent 0 22%, rgba(255, 181, 98, .12) 28%, transparent 34% 58%, rgba(255, 226, 180, .075) 64%, transparent 72% 100%);
      opacity: calc(.48 + var(--footer-treble) * .22 + var(--footer-bass) * .28);
      transform: scale(calc(.94 + var(--footer-bass) * .12)) rotate(calc(var(--footer-mid) * 4deg));
      mask-image: radial-gradient(circle at 50% 52%, #000 0 68%, transparent 80%);
      -webkit-mask-image: radial-gradient(circle at 50% 52%, #000 0 68%, transparent 80%);
      transition: opacity 120ms linear, transform 120ms linear;
    }

    .footer__stage::after {
      z-index: 4;
      background:
        linear-gradient(180deg, rgba(3, 3, 5, .2), transparent 30%, rgba(3, 3, 5, .46)),
        radial-gradient(ellipse at 50% 100%, transparent 42%, rgba(3, 3, 5, .5));
    }

    .footer__scope {
      position: absolute;
      inset: 50% auto auto 50%;
      z-index: 1;
      width: min(66%, 340px);
      aspect-ratio: 1;
      border: 1px solid rgba(255, 181, 98, calc(.18 + var(--footer-energy) * .14));
      border-radius: 50%;
      transform:
        translate(-50%, -50%) scale(calc(.72 + var(--footer-bass) * .42 + var(--footer-energy) * .06));
      box-shadow:
        0 0 0 calc(12px + var(--footer-bass) * 34px) rgba(255, 138, 61, calc(.014 + var(--footer-bass) * .022)),
        0 0 0 calc(44px + var(--footer-bass) * 62px + var(--footer-treble) * 22px) rgba(255, 226, 180, calc(.008 + var(--footer-bass) * .012)),
        0 0 calc(54px + var(--footer-bass) * 96px) rgba(255, 138, 61, calc(.16 + var(--footer-bass) * .22)),
        inset 0 0 calc(34px + var(--footer-bass) * 58px) rgba(255, 138, 61, calc(.07 + var(--footer-bass) * .12)),
        inset 0 0 0 calc(10px + var(--footer-bass) * 18px) rgba(0, 0, 0, calc(.1 + var(--footer-bass) * .22));
      transition: transform 54ms linear, box-shadow 54ms linear, border-color 54ms linear;
    }

    .footer__scope::before,
    .footer__scope::after {
      content: "";
      position: absolute;
      inset: 15%;
      border-radius: inherit;
      border: 1px solid rgba(255, 226, 180, calc(.1 + var(--footer-treble) * .08));
    }

    .footer__scope::before {
      transform: scale(calc(.92 + var(--footer-bass) * .18));
      box-shadow: inset 0 0 calc(18px + var(--footer-bass) * 34px) rgba(0, 0, 0, calc(.18 + var(--footer-bass) * .2));
      transition: transform 54ms linear, box-shadow 54ms linear;
    }

    .footer__scope::after {
      inset: 34%;
      background:
        radial-gradient(circle, rgba(255, 226, 180, calc(.2 + var(--footer-bass) * .38)), rgba(255, 138, 61, calc(.08 + var(--footer-bass) * .24)) 42%, rgba(0, 0, 0, calc(.05 + var(--footer-bass) * .16)) 63%, transparent 72%);
      border-color: rgba(255, 138, 61, calc(.22 + var(--footer-bass) * .28));
      box-shadow:
        0 0 calc(18px + var(--footer-bass) * 48px) rgba(255, 138, 61, calc(.22 + var(--footer-bass) * .28)),
        inset 0 0 calc(12px + var(--footer-bass) * 28px) rgba(0, 0, 0, calc(.18 + var(--footer-bass) * .22));
      transform: scale(calc(.82 + var(--footer-bass) * .34));
      transition: transform 54ms linear, box-shadow 54ms linear, border-color 54ms linear;
    }

    .footer__waveform {
      position: absolute;
      left: 9%;
      right: 9%;
      bottom: 15%;
      z-index: 3;
      height: clamp(30px, 5vw, 48px);
      display: flex;
      align-items: center;
      justify-content: center;
      gap: clamp(3px, .45vw, 6px);
      opacity: calc(.54 + var(--footer-energy) * .28);
      pointer-events: none;
    }

    .footer__waveform i {
      width: clamp(3px, .42vw, 5px);
      height: calc(16% + (var(--bar, .4) * 52%) + (var(--footer-bass) * 30%));
      border-radius: 999px;
      background:
        linear-gradient(180deg, rgba(255, 226, 180, .88), rgba(255, 138, 61, .66)),
        rgba(255, 138, 61, .42);
      box-shadow:
        0 0 calc(8px + var(--footer-bass) * 16px) rgba(255, 138, 61, calc(.18 + var(--footer-bass) * .2)),
        inset 0 1px 0 rgba(255, 255, 255, .24);
      transform: scaleY(calc(.72 + var(--footer-energy) * .26));
      transform-origin: center bottom;
      transition: height 90ms linear, transform 90ms linear, opacity 90ms linear;
    }

    .footer__signal-line {
      position: absolute;
      left: 8%;
      right: 8%;
      top: 14%;
      z-index: 2;
      height: 1px;
      background:
        linear-gradient(90deg, transparent, rgba(255, 181, 98, .18), rgba(255, 226, 180, calc(.38 + var(--footer-treble) * .28)), rgba(255, 181, 98, .18), transparent);
      box-shadow: 0 0 calc(10px + var(--footer-treble) * 28px) rgba(255, 138, 61, calc(.14 + var(--footer-treble) * .14));
      transform: scaleX(calc(.78 + var(--footer-mid) * .2));
      transform-origin: center;
      opacity: calc(.48 + var(--footer-treble) * .3);
      pointer-events: none;
    }

    .footer__signal-line::before,
    .footer__signal-line::after {
      content: "";
      position: absolute;
      top: 50%;
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: rgba(255, 181, 98, .72);
      box-shadow: 0 0 18px rgba(255, 138, 61, .34);
      transform: translateY(-50%);
    }

    .footer__signal-line::before {
      left: calc(20% + var(--footer-mid) * 18%);
    }

    .footer__signal-line::after {
      right: calc(20% + var(--footer-treble) * 18%);
    }

    .footer__readout {
      position: relative;
      z-index: 6;
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 12px;
      color: rgba(245, 241, 236, .56);
      font-size: 10px;
      line-height: 1.35;
      padding: 10px 12px;
      border: 1px solid rgba(245, 241, 236, .08);
      border-radius: 14px;
      background: rgba(3, 3, 5, .34);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
    }

    .footer__readout strong {
      display: block;
      margin-top: 4px;
      color: rgba(245, 241, 236, .9);
      font-family: var(--display);
      font-size: clamp(16px, 2vw, 24px);
      font-weight: 520;
      letter-spacing: 0;
      text-transform: none;
    }

    .footer__status {
      text-align: right;
    }

    .footer__status-pill {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 28px;
      padding: 0 10px;
      border: 1px solid rgba(255, 181, 98, .18);
      border-radius: 999px;
      background: rgba(255, 138, 61, .065);
      color: rgba(255, 214, 170, .86);
      font-size: 9px;
      letter-spacing: .12em;
      white-space: nowrap;
    }

    .footer__links {
      position: relative;
      z-index: 6;
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 8px;
      color: rgba(245, 241, 236, .48);
    }

    .footer__links span {
      min-width: 0;
      min-height: 48px;
      display: grid;
      align-content: center;
      gap: 3px;
      padding: 10px 12px;
      border: 1px solid rgba(245, 241, 236, .08);
      border-radius: 12px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .018)),
        rgba(3, 3, 5, .32);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
    }

    .footer__links strong {
      overflow: hidden;
      color: rgba(245, 241, 236, .88);
      font-family: var(--display);
      font-size: clamp(12px, 1.1vw, 14px);
      font-weight: 560;
      line-height: 1.1;
      letter-spacing: 0;
      text-overflow: ellipsis;
      white-space: normal;
    }

    .footer__links em {
      overflow: hidden;
      color: rgba(255, 181, 98, .72);
      font-style: normal;
      font-size: 9px;
      line-height: 1.2;
      letter-spacing: .13em;
      text-overflow: ellipsis;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .footer__readout span {
      min-width: 0;
    }

    @media(min-width:1100px) and (max-height:860px) {
      .footer {
        --footer-pad: clamp(16px, 2vw, 24px);
        grid-template-columns: minmax(260px, .86fr) minmax(420px, 1.14fr);
        gap: clamp(18px, 3vw, 36px);
        min-height: clamp(390px, calc(100svh - 140px), 540px);
        margin-top: clamp(42px, 6vh, 62px);
        margin-bottom: clamp(42px, 6vh, 62px);
      }

      .footer__headline {
        font-size: clamp(38px, 5vw, 72px);
      }

      .footer__viz {
        min-height: clamp(250px, 30vh, 330px);
        grid-template-rows: auto minmax(118px, 1fr) auto;
      }

      .footer__scope {
        width: min(56%, 250px);
      }
    }

    @media(max-width:720px) {
      .footer {
        width: min(100%, calc(100% - 24px));
        min-height: auto;
        margin-top: 42px;
        margin-bottom: 42px;
        border-radius: 18px;
        padding: 20px;
      }

      .footer__viz {
        min-height: 280px;
        grid-template-rows: auto minmax(118px, 1fr) auto;
      }

      .footer__actions {
        width: 100%;
      }

      .footer__action {
        flex: 1 1 160px;
      }

      .footer__readout {
        display: grid;
        justify-content: stretch;
        text-align: left;
      }

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

      .footer__status {
        text-align: left;
      }

      .footer__scope {
        width: min(70%, 260px);
      }
    }

    @media(max-width:520px) {
      .footer__headline {
        max-width: 11ch;
        font-size: clamp(38px, 16vw, 58px);
      }

      .footer__meta span {
        width: 100%;
      }

      .footer__readout strong {
        font-size: 17px;
      }

      .footer__stage {
        min-height: 150px;
      }

      .footer__action {
        width: 100%;
      }
    }

    /* Compact footer signal rail */
    .footer {
      --footer-pad: clamp(10px, 1.4vw, 14px);
      width: min(1240px, calc(100% - clamp(28px, 5vw, 72px)));
      min-height: auto;
      margin: clamp(44px, 7vh, 76px) auto clamp(42px, 7vh, 72px);
      padding: var(--footer-pad);
      display: block;
      border-radius: 999px;
      overflow: visible;
      font-size: 10px;
      letter-spacing: .12em;
      background:
        radial-gradient(38% 220% at 50% 50%, rgba(255, 138, 61, calc(.08 + var(--footer-energy) * .18)), transparent 66%),
        linear-gradient(180deg, rgba(22, 22, 28, .78), rgba(8, 8, 11, .8)),
        rgba(7, 7, 9, .78);
      box-shadow:
        0 22px 70px rgba(0, 0, 0, .38),
        0 0 calc(18px + var(--footer-energy) * 26px) rgba(255, 138, 61, calc(.04 + var(--footer-energy) * .09)),
        inset 0 1px 0 rgba(255, 255, 255, .07),
        inset 0 -1px 0 rgba(255, 255, 255, .025);
    }

    .footer::before {
      z-index: -1;
      border-radius: inherit;
      background:
        linear-gradient(90deg, transparent, rgba(255, 138, 61, calc(.08 + var(--footer-treble) * .08)), transparent),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, .024) 0 1px, transparent 1px 42px);
      mask-image: linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent);
      -webkit-mask-image: linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent);
      opacity: .78;
    }

    .footer::after {
      z-index: -1;
      border-radius: inherit;
      background:
        linear-gradient(90deg, rgba(0, 0, 0, .34), transparent 16%, transparent 84%, rgba(0, 0, 0, .34));
    }

    .hero-signal-footer__inner {
      position: relative;
      z-index: 2;
      min-height: clamp(62px, 7vh, 76px);
      display: grid;
      grid-template-columns: minmax(180px, .82fr) minmax(220px, 1.05fr) minmax(270px, 1.13fr) auto;
      align-items: center;
      gap: clamp(10px, 1.6vw, 18px);
      padding: 7px 9px 7px clamp(14px, 1.8vw, 22px);
      border: 1px solid rgba(245, 241, 236, .1);
      border-radius: inherit;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .018)),
        rgba(3, 3, 5, .28);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .06),
        inset 0 0 0 1px rgba(0, 0, 0, .18);
      overflow: hidden;
    }

    .hero-signal-footer__brand,
    .hero-signal-footer__meta,
    .hero-signal-footer__actions {
      position: relative;
      z-index: 3;
    }

    .hero-signal-footer__brand {
      min-width: 0;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      align-items: center;
      gap: 10px;
      color: var(--ink);
      font-family: var(--display);
      letter-spacing: 0;
      text-transform: none;
    }

    .hero-signal-footer__brand-mark {
      width: 34px;
      height: 34px;
      display: grid;
      place-items: center;
      border: 1px solid rgba(255, 138, 61, .22);
      border-radius: 50%;
      background:
        radial-gradient(circle at 50% 50%, rgba(255, 138, 61, calc(.18 + var(--footer-bass) * .18)), rgba(255, 138, 61, .055) 64%, transparent),
        rgba(255, 255, 255, .035);
      box-shadow:
        0 0 calc(14px + var(--footer-bass) * 28px) rgba(255, 138, 61, calc(.16 + var(--footer-bass) * .18)),
        inset 0 1px 0 rgba(255, 255, 255, .08);
    }

    .hero-signal-footer__brand-mark svg {
      width: 18px;
      height: 18px;
      color: rgba(255, 214, 170, .92);
    }

    .hero-signal-footer__brand strong,
    .hero-signal-footer__status strong {
      display: block;
      overflow: hidden;
      color: rgba(245, 241, 236, .92);
      font-size: 13px;
      font-weight: 760;
      line-height: 1.08;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .hero-signal-footer__brand span,
    .hero-signal-footer__status span {
      display: block;
      margin-top: 4px;
      overflow: hidden;
      color: rgba(245, 241, 236, .5);
      font-family: var(--mono);
      font-size: 9px;
      font-weight: 700;
      letter-spacing: .13em;
      line-height: 1.1;
      text-overflow: ellipsis;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .hero-signal-footer__visualizer {
      position: relative;
      z-index: 2;
      min-height: 38px;
      border-inline: 1px solid rgba(255, 255, 255, .055);
      overflow: hidden;
      isolation: isolate;
      mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
      -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
    }

    .hero-signal-footer__visualizer::before,
    .hero-signal-footer__visualizer::after {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
    }

    .hero-signal-footer__visualizer::before {
      background:
        radial-gradient(circle at calc(22% + var(--footer-mid) * 10%) 50%, rgba(255, 226, 180, calc(.32 + var(--footer-treble) * .26)) 0 2px, transparent 3px),
        radial-gradient(circle at calc(52% + var(--footer-bass) * 8%) 48%, rgba(255, 138, 61, calc(.42 + var(--footer-bass) * .28)) 0 2px, transparent 3.5px),
        radial-gradient(circle at calc(78% - var(--footer-treble) * 10%) 52%, rgba(255, 198, 122, calc(.26 + var(--footer-energy) * .24)) 0 1.5px, transparent 3px),
        linear-gradient(90deg, transparent, rgba(255, 138, 61, calc(.18 + var(--footer-energy) * .2)), rgba(255, 226, 180, calc(.22 + var(--footer-treble) * .22)), rgba(255, 138, 61, calc(.14 + var(--footer-energy) * .16)), transparent);
      background-size: 100% 100%;

      opacity: calc(.68 + var(--footer-energy) * .2);
      transform: translateX(calc((var(--footer-mid) - .5) * 12px));
      transition: opacity 140ms linear, transform 140ms linear;
    }

    .hero-signal-footer__visualizer::after {
      top: 50%;
      height: 1px;
      background:
        linear-gradient(90deg, transparent, rgba(255, 138, 61, .26), rgba(255, 226, 180, calc(.5 + var(--footer-treble) * .22)), rgba(255, 138, 61, .22), transparent);
      box-shadow: 0 0 calc(12px + var(--footer-bass) * 30px) rgba(255, 138, 61, calc(.2 + var(--footer-bass) * .2));
      transform: translateY(-50%) scaleX(calc(.78 + var(--footer-energy) * .18));
      transform-origin: center;
      opacity: calc(.56 + var(--footer-energy) * .26);
      transition: opacity 100ms linear, transform 100ms linear, box-shadow 100ms linear;
    }

    .hero-signal-footer__particles {
      position: absolute;
      inset: 0;
      z-index: 2;
      pointer-events: none;
      overflow: hidden;
    }

    .hero-signal-footer__particles i {
      position: absolute;
      left: -8%;
      top: var(--y);
      width: var(--s);
      height: var(--s);
      border-radius: 50%;
      background: rgba(255, 214, 170, .78);
      box-shadow: 0 0 14px rgba(255, 138, 61, .34);
      opacity: calc(.28 + var(--footer-energy) * .24);
      transform: translate3d(0, calc(var(--footer-bass) * -6px), 0);
      animation: footerParticleFlow calc(7.8s - (var(--footer-energy) * 3.7s) - (var(--footer-kick) * 2.8s)) linear infinite;
      animation-delay: var(--d, 0s);
      transition: opacity 140ms linear, transform 140ms linear;
    }

    .hero-signal-footer__particles i:nth-child(1) { --y: 32%; --s: 2px; --d: -.2s; --range: 108%; }
    .hero-signal-footer__particles i:nth-child(2) { --y: 48%; --s: 3px; --d: -1.1s; --range: 116%; }
    .hero-signal-footer__particles i:nth-child(3) { --y: 64%; --s: 2px; --d: -2s; --range: 112%; }
    .hero-signal-footer__particles i:nth-child(4) { --y: 39%; --s: 4px; --d: -2.8s; --range: 120%; }
    .hero-signal-footer__particles i:nth-child(5) { --y: 57%; --s: 2px; --d: -3.7s; --range: 110%; }
    .hero-signal-footer__particles i:nth-child(6) { --y: 28%; --s: 3px; --d: -4.5s; --range: 118%; }
    .hero-signal-footer__particles i:nth-child(7) { --y: 70%; --s: 2px; --d: -5.3s; --range: 114%; }
    .hero-signal-footer__particles i:nth-child(8) { --y: 44%; --s: 4px; --d: -6.1s; --range: 122%; }
    .hero-signal-footer__particles i:nth-child(9) { --y: 61%; --s: 2px; --d: -6.9s; --range: 109%; }
    .hero-signal-footer__particles i:nth-child(10) { --y: 35%; --s: 3px; --d: -7.6s; --range: 116%; }
    .hero-signal-footer__particles i:nth-child(11) { --y: 53%; --s: 2px; --d: -8.4s; --range: 113%; }
    .hero-signal-footer__particles i:nth-child(12) { --y: 75%; --s: 4px; --d: -9.2s; --range: 121%; }
    .hero-signal-footer__particles i:nth-child(13) { --y: 24%; --s: 2px; --d: -10s; --range: 111%; }

    @keyframes footerParticleFlow {
      0% {
        transform: translate3d(-10%, calc((var(--footer-bass) * -5px) + (var(--footer-kick) * -10px)), 0) scale(calc(.82 + var(--footer-treble) * .24 + var(--footer-kick) * .18));
      }

      50% {
        transform: translate3d(calc(var(--range, 114%) * .55), calc(((var(--footer-mid) - .5) * 18px) - (var(--footer-kick) * 18px)), 0) scale(calc(.92 + var(--footer-bass) * .36 + var(--footer-kick) * .28));
      }

      100% {
        transform: translate3d(var(--range, 114%), calc((var(--footer-bass) * -12px) + (var(--footer-kick) * -16px)), 0) scale(calc(.78 + var(--footer-treble) * .3 + var(--footer-kick) * .2));
      }
    }

    .hero-signal-footer__meta {
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 7px;
      overflow: hidden;
    }

    .hero-signal-footer__chip {
      min-width: 0;
      min-height: 30px;
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 0 10px;
      border: 1px solid rgba(245, 241, 236, .09);
      border-radius: 999px;
      background: rgba(255, 255, 255, .032);
      color: rgba(245, 241, 236, .68);
      font-family: var(--mono);
      font-size: 9px;
      font-weight: 760;
      letter-spacing: .1em;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .hero-signal-footer__chip::before {
      content: "";
      width: 5px;
      height: 5px;
      border-radius: 50%;
      background: rgba(255, 138, 61, .72);
      box-shadow: 0 0 12px rgba(255, 138, 61, .26);
    }

    .hero-signal-footer__actions {
      display: flex;
      align-items: center;
      gap: 8px;
      justify-content: flex-end;
    }

    .hero-signal-footer__cta {
      min-height: 38px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0 15px;
      border: 1px solid rgba(255, 181, 98, .64);
      border-radius: 999px;
      background: linear-gradient(135deg, #ffb247 0%, #ff8a3d 55%, #f06f29 100%);
      color: #120900;
      font-family: var(--display);
      font-size: 13px;
      font-weight: 820;
      letter-spacing: 0;
      text-decoration: none;
      text-transform: none;
      box-shadow:
        0 16px 34px rgba(255, 138, 61, .2),
        inset 0 1px 0 rgba(255, 244, 225, .42);
      transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
      white-space: nowrap;
    }

    .hero-signal-footer__ghost {
      min-height: 38px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0 12px;
      border: 1px solid rgba(245, 241, 236, .1);
      border-radius: 999px;
      background: rgba(255, 255, 255, .03);
      color: rgba(245, 241, 236, .72);
      font-family: var(--display);
      font-size: 13px;
      font-weight: 720;
      letter-spacing: 0;
      text-decoration: none;
      text-transform: none;
      cursor: pointer;
    }

    .hero-signal-footer__cta:hover,
    .hero-signal-footer__cta:focus-visible,
    .hero-signal-footer__ghost:hover,
    .hero-signal-footer__ghost:focus-visible {
      transform: translateY(-1px);
      outline: none;
      box-shadow:
        0 20px 46px rgba(255, 138, 61, .26),
        inset 0 1px 0 rgba(255, 244, 225, .46);
    }

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

      .hero-signal-footer__visualizer *,
      .hero-signal-footer__visualizer::before,
      .hero-signal-footer__visualizer::after {
        animation: none !important;
        transition: none !important;
      }
    }

    @media(max-width:980px) {
      .hero-signal-footer__inner {
        grid-template-columns: minmax(190px, 1fr) minmax(220px, 1fr);
        border-radius: 28px;
      }

      .footer {
        border-radius: 32px;
      }

      .hero-signal-footer__visualizer {
        order: 3;
        grid-column: 1 / -1;
      }

      .hero-signal-footer__meta {
        justify-content: flex-start;
      }

      .hero-signal-footer__actions {
        justify-content: flex-end;
      }
    }

    @media(max-width:640px) {
      .footer {
        width: min(100%, calc(100% - 24px));
        border-radius: 26px;
        padding: 8px;
      }

      .hero-signal-footer__inner {
        grid-template-columns: 1fr;
        gap: 10px;
        min-height: 0;
        padding: 13px;
        border-radius: 22px;
      }

      .hero-signal-footer__visualizer {
        min-height: 34px;
      }

      .hero-signal-footer__meta {
        flex-wrap: wrap;
      }

      .hero-signal-footer__chip {
        flex: 1 1 auto;
        justify-content: center;
      }

      .hero-signal-footer__actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
      }

      .hero-signal-footer__cta,
      .hero-signal-footer__ghost {
        width: 100%;
      }
    }

    /* Recovery: footer is a framed hero/content section; the signal bar is only the compact rail inside it. */
    .footer.hero-signal-footer {
      --footer-pad: clamp(22px, 3.4vw, 42px);
      width: min(1240px, calc(100% - clamp(32px, 6vw, 80px)));
      min-height: clamp(430px, calc(100svh - 164px), 620px);
      margin: clamp(200px, 80vh, 120px) auto clamp(180px, 70vh, 190px) !important;
      padding: var(--footer-pad);
      display: grid;
      grid-template-rows: minmax(0, 1fr) auto;
      align-items: stretch;
      gap: clamp(26px, 5vh, 54px);
      border-radius: 24px;
      overflow: hidden;
      background:
        radial-gradient(72% 150% at 18% 12%, rgba(255, 138, 61, calc(.08 + var(--footer-energy) * .08)), transparent 58%),
        radial-gradient(62% 110% at 88% 68%, rgba(255, 222, 178, calc(.025 + var(--footer-treble) * .045)), transparent 66%),
        linear-gradient(180deg, rgba(255, 255, 255, .052), rgba(255, 255, 255, .014)),
        rgba(7, 7, 9, .84);
      box-shadow:
        0 34px 110px rgba(0, 0, 0, .48),
        0 0 calc(16px + var(--footer-energy) * 18px) rgba(255, 138, 61, calc(.035 + var(--footer-energy) * .055)),
        inset 0 1px 0 rgba(255, 255, 255, .08),
        inset 0 0 0 1px rgba(255, 138, 61, .035);
    }

    .footer.hero-signal-footer::before {
      z-index: -2;
      border-radius: inherit;
      background:
        linear-gradient(120deg, transparent 0 42%, rgba(255, 255, 255, calc(.018 + var(--footer-treble) * .025)) 42.5%, transparent 48%),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, .02) 0 1px, transparent 1px 46px),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, .014) 0 1px, transparent 1px 46px);
      mask-image: radial-gradient(circle at 50% 50%, #000, transparent 82%);
      -webkit-mask-image: radial-gradient(circle at 50% 50%, #000, transparent 82%);
      opacity: .6;
    }

    .footer.hero-signal-footer::after {
      z-index: -1;
      border-radius: inherit;
      background:
        linear-gradient(90deg, rgba(0, 0, 0, .46), transparent 16%, transparent 84%, rgba(0, 0, 0, .46)),
        radial-gradient(circle at 50% 100%, transparent 0 38%, rgba(0, 0, 0, .42) 100%);
    }

    .footer.hero-signal-footer .footer__identity {
      display: grid;
      align-content: center;
      justify-items: start;
      max-width: 720px;
      gap: clamp(16px, 2.4vh, 24px);
    }

    .footer.hero-signal-footer .footer__headline {
      max-width: 10.5ch;
    }

    .footer.hero-signal-footer .hero-signal-footer__inner {
      width: min(100%, 1120px);
      min-height: clamp(64px, 8vh, 78px);
      margin-inline: auto;
      grid-template-columns: minmax(180px, .82fr) minmax(180px, 1fr) minmax(250px, 1.1fr) auto;
      border-radius: 24px;
    }

    .footer.hero-signal-footer .hero-signal-footer__visualizer {
      min-width: 180px;
      min-height: 32px;
      height: 32px;
      border-radius: 999px;
      background: rgba(255, 255, 255, .02);
    }

    @media(min-width:1100px) and (max-height:860px) {
      .footer.hero-signal-footer {
        min-height: clamp(390px, calc(100svh - 140px), 540px);
        gap: clamp(18px, 4vh, 34px);
      }
    }

    @media(max-width:980px) {
      .footer.hero-signal-footer {
        min-height: auto;
        border-radius: 22px;
      }

      .footer.hero-signal-footer .hero-signal-footer__inner {
        grid-template-columns: minmax(190px, 1fr) minmax(220px, 1fr);
        border-radius: 24px;
      }
    }

    @media(max-width:640px) {
      .footer.hero-signal-footer {
        width: min(100%, calc(100% - 24px));
        margin-top: 42px;
        margin-bottom: 42px;
        padding: 20px;
        border-radius: 18px;
      }

      .footer.hero-signal-footer .hero-signal-footer__inner {
        grid-template-columns: 1fr;
        min-height: 0;
        padding: 13px;
        border-radius: 18px;
      }
    }

    /* Footer console final pass */
    .footer.hero-signal-footer {
      --footer-pad: clamp(14px, 1.8vw, 22px);
      --footer-kick: 0;
      width: var(--shell);
      min-height: auto;
      margin: clamp(46px, 7vh, 78px) auto clamp(42px, 7vh, 74px);
      padding: var(--footer-pad);
      display: block;
      border-radius: clamp(22px, 2vw, 30px);
      overflow: hidden;
      scroll-snap-align: center;
      background:
        radial-gradient(52% 180% at 22% 8%, rgba(255, 138, 61, calc(.08 + var(--footer-energy) * .1)), transparent 64%),
        radial-gradient(42% 140% at 82% 76%, rgba(114, 226, 255, calc(.025 + var(--footer-treble) * .04)), transparent 68%),
        linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .018)),
        rgba(7, 7, 9, .82);
      box-shadow:
        0 26px 82px rgba(0, 0, 0, .46),
        0 0 calc(18px + var(--footer-energy) * 24px) rgba(255, 138, 61, calc(.035 + var(--footer-energy) * .065)),
        inset 0 1px 0 rgba(255, 255, 255, .08),
        inset 0 0 0 1px rgba(255, 138, 61, .035);
      backdrop-filter: blur(22px) saturate(132%);
      -webkit-backdrop-filter: blur(22px) saturate(132%);
    }

    .footer.hero-signal-footer::before {
      z-index: -2;
      border-radius: inherit;
      background:
        linear-gradient(120deg, transparent 0 42%, rgba(255, 255, 255, calc(.018 + var(--footer-treble) * .03)) 42.5%, transparent 48%),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, .018) 0 1px, transparent 1px 38px),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, .012) 0 1px, transparent 1px 38px);
      mask-image: radial-gradient(ellipse at 50% 50%, #000, transparent 86%);
      -webkit-mask-image: radial-gradient(ellipse at 50% 50%, #000, transparent 86%);
      opacity: .74;
    }

    .footer.hero-signal-footer::after {
      z-index: -1;
      border-radius: inherit;
      background:
        linear-gradient(90deg, rgba(0, 0, 0, .42), transparent 18%, transparent 82%, rgba(0, 0, 0, .42)),
        radial-gradient(circle at 50% 100%, transparent 0 44%, rgba(0, 0, 0, .32) 100%);
    }

    .footer-console {
      position: relative;
      z-index: 2;
      min-height: clamp(280px, 34vh, 360px);
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      gap: clamp(16px, 2.3vw, 24px);
      padding: clamp(16px, 2vw, 26px);
      border: 1px solid rgba(245, 241, 236, .105);
      border-radius: clamp(18px, 1.6vw, 24px);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, .048), rgba(255, 255, 255, .014)),
        rgba(3, 3, 5, .32);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .065),
        inset 0 0 0 1px rgba(0, 0, 0, .24);
      overflow: hidden;
    }

    .footer-console__top,
    .footer-console__bottom {
      min-width: 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: clamp(12px, 2vw, 22px);
    }

    .footer-console__bottom {
      justify-content: stretch;
    }

    .footer-console__bottom-ctas {
      width: 100%;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      align-items: stretch;
    }

    .footer-console__bottom-ctas .footer__action,
    .footer-console__bottom-ctas .hero-signal-footer__cta {
      width: 100%;
    }

    .footer-console__top {
      padding-bottom: clamp(10px, 1.3vw, 14px);
      border-bottom: 1px solid rgba(245, 241, 236, .075);
    }

    .footer-console__body {
      min-width: 0;
      display: grid;
      grid-template-columns: minmax(280px, .78fr) minmax(360px, 1.22fr);
      align-items: center;
      gap: clamp(20px, 4vw, 54px);
    }

    .footer.hero-signal-footer .footer__identity {
      display: grid;
      align-content: center;
      justify-items: start;
      max-width: 620px;
      gap: clamp(12px, 1.8vw, 18px);
    }

    .footer.hero-signal-footer .footer__eyebrow {
      color: rgba(255, 181, 98, .82);
    }

    .footer.hero-signal-footer .footer__headline {
      max-width: 12ch;
      font-size: clamp(34px, 4.35vw, 64px);
      line-height: .94;
    }

    .footer.hero-signal-footer .footer__copy {
      max-width: 54ch;
      font-size: clamp(15px, 1.18vw, 18px);
      line-height: 1.46;
    }

    .footer-console__actions,
    .footer-console__bottom-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 9px;
    }

    .footer-console__bottom-ctas {
      width: 100%;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }

    .footer.hero-signal-footer .footer__action,
    .footer.hero-signal-footer .hero-signal-footer__cta,
    .footer.hero-signal-footer .hero-signal-footer__ghost {
      min-height: 40px;
      border-radius: 999px;
      white-space: nowrap;
    }

    .footer-console__bottom-ctas .footer__action,
    .footer-console__bottom-ctas .hero-signal-footer__cta {
      width: 100%;
      min-height: 46px;
    }

    .footer.hero-signal-footer .hero-signal-footer__brand {
      min-width: 190px;
      max-width: 280px;
    }

    .footer.hero-signal-footer .hero-signal-footer__meta,
    .footer-console__links {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 8px;
      min-width: 0;
    }

    .footer.hero-signal-footer .hero-signal-footer__chip,
    .footer.hero-signal-footer .footer__meta span {
      min-height: 30px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0 11px;
      border: 1px solid rgba(245, 241, 236, .095);
      border-radius: 999px;
      background: rgba(255, 255, 255, .032);
      color: rgba(245, 241, 236, .66);
      font-family: var(--mono);
      font-size: 9px;
      font-weight: 760;
      letter-spacing: .095em;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .footer.hero-signal-footer .footer__meta span:first-child,
    .footer.hero-signal-footer .hero-signal-footer__chip:first-child {
      color: rgba(255, 181, 98, .78);
      border-color: rgba(255, 181, 98, .18);
    }

    .footer-console__visualizer.hero-signal-footer__inner {
      width: 100%;
      min-height: clamp(130px, 16vw, 184px);
      display: block;
      padding: clamp(10px, 1.4vw, 16px);
      border-radius: clamp(18px, 1.8vw, 26px);
      background:
        radial-gradient(70% 160% at 50% 50%, rgba(255, 138, 61, calc(.08 + var(--footer-bass) * .16)), transparent 68%),
        linear-gradient(180deg, rgba(255, 255, 255, .046), rgba(255, 255, 255, .012)),
        rgba(0, 0, 0, .22);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .06),
        inset 0 0 calc(36px + var(--footer-bass) * 62px + var(--footer-kick) * 86px) rgba(255, 138, 61, calc(.02 + var(--footer-bass) * .08 + var(--footer-kick) * .12)),
        0 0 calc(18px + var(--footer-kick) * 54px) rgba(255, 138, 61, calc(.04 + var(--footer-kick) * .16));
    }

    .footer.hero-signal-footer .hero-signal-footer__visualizer {
      position: relative;
      width: 100%;
      height: 100%;
      min-height: clamp(110px, 14vw, 152px);
      border: 1px solid rgba(245, 241, 236, .075);
      border-radius: clamp(16px, 1.5vw, 22px);
      background:
        radial-gradient(circle at 50% 50%, rgba(255, 138, 61, calc(.12 + var(--footer-bass) * .26 + var(--footer-kick) * .32)), transparent calc(32% + var(--footer-bass) * 9% + var(--footer-kick) * 8%)),
        linear-gradient(90deg, rgba(0, 0, 0, .3), transparent 22%, transparent 78%, rgba(0, 0, 0, .3)),
        rgba(3, 3, 5, .44);
      overflow: hidden;
      isolation: isolate;
      mask-image: none;
      -webkit-mask-image: none;
      transform: scale(calc(1 + var(--footer-kick) * .035));
      transition: transform 72ms linear, box-shadow 72ms linear, border-color 72ms linear;
      box-shadow:
        inset 0 0 calc(28px + var(--footer-bass) * 42px + var(--footer-kick) * 78px) rgba(255, 138, 61, calc(.035 + var(--footer-bass) * .08 + var(--footer-kick) * .16)),
        0 0 calc(16px + var(--footer-kick) * 64px) rgba(255, 138, 61, calc(.08 + var(--footer-kick) * .22));
    }

    .footer.hero-signal-footer .hero-signal-footer__visualizer::before,
    .footer.hero-signal-footer .hero-signal-footer__visualizer::after {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
    }

    .footer.hero-signal-footer .hero-signal-footer__visualizer::before {
      background:
        repeating-linear-gradient(90deg, rgba(255, 255, 255, .028) 0 1px, transparent 1px 32px),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, .018) 0 1px, transparent 1px 24px),
        linear-gradient(90deg, transparent, rgba(255, 138, 61, calc(.09 + var(--footer-energy) * .16)), rgba(255, 226, 180, calc(.12 + var(--footer-treble) * .18)), rgba(255, 138, 61, calc(.08 + var(--footer-energy) * .14)), transparent);
      opacity: calc(.54 + var(--footer-energy) * .24);
      mask-image: linear-gradient(90deg, transparent, #000 11%, #000 89%, transparent);
      -webkit-mask-image: linear-gradient(90deg, transparent, #000 11%, #000 89%, transparent);
    }

    .footer.hero-signal-footer .hero-signal-footer__visualizer::after {
      top: 50%;
      height: 2px;
      background: linear-gradient(90deg, transparent, rgba(255, 138, 61, .28), rgba(255, 230, 190, calc(.58 + var(--footer-treble) * .26)), rgba(255, 138, 61, .24), transparent);
      box-shadow: 0 0 calc(14px + var(--footer-bass) * 40px + var(--footer-kick) * 60px) rgba(255, 138, 61, calc(.22 + var(--footer-bass) * .16 + var(--footer-kick) * .28));
      transform: translateY(-50%) scaleX(calc(.7 + var(--footer-energy) * .2 + var(--footer-kick) * .22));
      transform-origin: center;
      opacity: calc(.58 + var(--footer-energy) * .22 + var(--footer-kick) * .16);
    }

    .hero-signal-footer__beam {
      position: absolute;
      inset: 18% 6%;
      z-index: 1;
      border-radius: 999px;
      background:
        radial-gradient(ellipse at calc(48% + var(--footer-mid) * 8%) 50%, rgba(255, 138, 61, calc(.16 + var(--footer-bass) * .18 + var(--footer-kick) * .34)), transparent 58%),
        linear-gradient(90deg, transparent, rgba(255, 138, 61, calc(.12 + var(--footer-energy) * .14 + var(--footer-kick) * .24)), transparent);
      filter: blur(calc(14px + var(--footer-kick) * 8px));
      opacity: calc(.5 + var(--footer-energy) * .2 + var(--footer-kick) * .18);
      pointer-events: none;
    }

    .hero-signal-footer__oscilloscope {
      position: absolute;
      inset: clamp(18px, 2.4vw, 28px) clamp(16px, 2vw, 26px);
      z-index: 3;
      width: calc(100% - clamp(32px, 4vw, 52px));
      height: calc(100% - clamp(36px, 4.8vw, 56px));
      pointer-events: none;
      overflow: visible;
      opacity: calc(.68 + var(--footer-energy) * .24);
      filter:
        drop-shadow(0 0 calc(7px + var(--footer-treble) * 14px) rgba(255, 226, 180, calc(.16 + var(--footer-treble) * .18)))
        drop-shadow(0 0 calc(14px + var(--footer-bass) * 24px) rgba(255, 138, 61, calc(.2 + var(--footer-bass) * .18)));
      mix-blend-mode: screen;
    }

    .hero-signal-footer__oscilloscope path {
      fill: none;
      vector-effect: non-scaling-stroke;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .hero-signal-footer__scope-glow {
      stroke: rgba(255, 138, 61, calc(.22 + var(--footer-bass) * .34 + var(--footer-kick) * .2));
      stroke-width: calc(5px + var(--footer-bass) * 4px + var(--footer-kick) * 3px);
      opacity: calc(.34 + var(--footer-energy) * .24);
      filter: blur(2.6px);
    }

    .hero-signal-footer__scope-trace {
      stroke: rgba(255, 235, 204, calc(.78 + var(--footer-treble) * .18));
      stroke-width: calc(1.35px + var(--footer-kick) * 1.1px);
    }

    .hero-signal-footer__scope-core {
      stroke: rgba(255, 138, 61, calc(.56 + var(--footer-energy) * .32));
      stroke-width: calc(.72px + var(--footer-treble) * .65px);
      opacity: calc(.54 + var(--footer-mid) * .2);
    }

    .footer.hero-signal-footer .hero-signal-footer__particles i {
      transform:
        translate3d(0, calc((var(--footer-bass) * -12px) + (var(--footer-kick) * -18px)), 0) scale(calc(.86 + var(--footer-treble) * .32 + var(--footer-kick) * .3));
      opacity: calc(.22 + var(--footer-energy) * .34 + var(--footer-kick) * .28);
      background:
        radial-gradient(circle, rgba(255, 238, 210, calc(.76 + var(--footer-treble) * .2)), rgba(255, 138, 61, calc(.52 + var(--footer-bass) * .22)) 54%, transparent 72%),
        rgba(255, 138, 61, .42);
      box-shadow:
        0 0 calc(8px + var(--footer-treble) * 14px + var(--footer-kick) * 16px) rgba(255, 226, 180, calc(.16 + var(--footer-treble) * .2 + var(--footer-kick) * .1)),
        0 0 calc(14px + var(--footer-bass) * 22px + var(--footer-kick) * 30px) rgba(255, 138, 61, calc(.18 + var(--footer-bass) * .22 + var(--footer-kick) * .22));
    }

    .footer.hero-signal-footer:hover {
      border-color: rgba(255, 181, 98, .2);
      box-shadow:
        0 30px 92px rgba(0, 0, 0, .5),
        0 0 calc(20px + var(--footer-energy) * 28px) rgba(255, 138, 61, calc(.055 + var(--footer-energy) * .075)),
        inset 0 1px 0 rgba(255, 255, 255, .09);
    }

    .footer.hero-signal-footer a:focus-visible,
    .footer.hero-signal-footer button:focus-visible {
      outline: 2px solid rgba(255, 181, 98, .9);
      outline-offset: 3px;
    }

    @media(max-width:980px) {
      .footer-console {
        min-height: auto;
      }

      .footer-console__top,
      .footer-console__bottom {
        align-items: flex-start;
        flex-direction: column;
      }

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

      .footer.hero-signal-footer .hero-signal-footer__brand {
        max-width: 100%;
      }
    }

    @media(max-width:640px) {
      .footer.hero-signal-footer {
        width: min(100%, calc(100% - 24px));
        margin-top: 42px;
        margin-bottom: 42px;
        padding: 10px;
        border-radius: 22px;
      }

      .footer-console {
        gap: 16px;
        padding: 16px;
        border-radius: 18px;
      }

      .footer.hero-signal-footer .footer__headline {
        max-width: 100%;
        font-size: clamp(30px, 10.8vw, 44px);
        line-height: 1.08;
        letter-spacing: 0;
        padding-bottom: .06em;
        overflow-wrap: break-word;
        text-wrap: balance;
      }

      .footer.hero-signal-footer .footer__copy {
        max-width: 100%;
        font-size: clamp(14px, 4.1vw, 16px);
        line-height: 1.5;
        overflow-wrap: break-word;
      }

      .footer.hero-signal-footer .footer__actions,
      .footer-console__bottom-actions {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .footer.hero-signal-footer .footer__action,
      .footer.hero-signal-footer .hero-signal-footer__cta,
      .footer.hero-signal-footer .hero-signal-footer__ghost {
        width: 100%;
      }

      .footer-console__visualizer.hero-signal-footer__inner {
        min-height: 104px;
      }

      .footer.hero-signal-footer .hero-signal-footer__visualizer {
        min-height: 86px;
      }

      .footer.hero-signal-footer .hero-signal-footer__chip,
      .footer.hero-signal-footer .footer__meta span {
        width: 100%;
      }

      .footer-console__bottom-ctas {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    /* reveal */
    .reveal {
      opacity: 0;
      transform: translateY(28px);
      transition: opacity .9s ease, transform .9s cubic-bezier(.2, .7, .2, 1)
    }

    .reveal.in {
      opacity: 1;
      transform: none
    }

    .reveal--late {
      transition-delay: .15s
    }

    .reveal--later {
      transition-delay: .3s
    }

    /* waveform */
    .wave {
      display: flex;
      align-items: center;
      gap: 3px;
      height: 36px;
      opacity: .62;
      transform: scaleY(.82);
      transform-origin: center
    }

    .wave i {
      display: block;
      width: 3px;
      background: rgba(255, 138, 61, .72);
      border-radius: 2px;
      animation: wv 2.4s ease-in-out infinite
    }

    .wave i:nth-child(1) {
      animation-delay: 0s
    }

    .wave i:nth-child(2) {
      animation-delay: .1s
    }

    .wave i:nth-child(3) {
      animation-delay: .2s
    }

    .wave i:nth-child(4) {
      animation-delay: .3s
    }

    .wave i:nth-child(5) {
      animation-delay: .4s
    }

    .wave i:nth-child(6) {
      animation-delay: .5s
    }

    .wave i:nth-child(7) {
      animation-delay: .15s
    }

    .wave i:nth-child(8) {
      animation-delay: .25s
    }

    .nav__menu-toggle {
      display: none;
    }

    .nav__mobile-controls {
      display: none;
    }

    @keyframes wv {

      0%,
      100% {
        height: 6px;
        opacity: .38
      }

      50% {
        height: 28px;
        opacity: .78
      }
    }

    .hero__headline--slightly-smaller {
      max-width: min(100%, 1500px);
      font-size: min(clamp(2rem, 3.55vw, 3.65rem), calc((100vw - (var(--section-pad-x) * 2)) / 39));
      line-height: 1.08;
      letter-spacing: -0.01em;
    }

    /* 1920x1080 fullscreen section pass */
    @media (min-width:1000px) and (min-height:720px) {
      :root {
        --screen-x: clamp(48px, 4vw, 76px);
        --screen-top: clamp(112px, 11vh, 134px);
        --screen-bottom: clamp(44px, 5vh, 66px);
        --screen-shell: min(1440px, 100%);
      }

      html {
        scroll-snap-type: y proximity;
        scroll-padding-top: 0;
      }

      .hero,
      .section,
      .footer {
        min-height: 100vh;
        min-height: 100svh;
        scroll-snap-align: start;
        scroll-snap-stop: always;
        overflow: hidden;
      }

      .hero {
        padding: var(--screen-top) var(--screen-x) var(--screen-bottom);
      }

      .hero__shell {
        width: min(100%, 1500px);
        max-width: calc(100vw - (var(--screen-x) * 2));
        max-height: calc(100svh - var(--screen-top) - var(--screen-bottom));
        gap: clamp(12px, 1.75vh, 20px);
      }

      .hero__headline--slightly-smaller {
        max-width: min(100%, 1500px);
        font-size: min(clamp(2rem, 3.35vw, 3.6rem), calc((100vw - (var(--screen-x) * 2)) / 39));
        line-height: 1.06;
        letter-spacing: 0;
      }

      .hero__value {
        font-size: clamp(22px, 2vw, 30px);
        line-height: 1.18;
      }

      .hero__statement {
        font-size: 16px;
        line-height: 1.48;
      }

      .hero__trust {
        width: min(860px, 100%);
        gap: 10px;
      }

      .hero__pill {
        min-height: 60px;
        padding: 13px 15px;
      }

      .hero__pill strong {
        font-size: 14px;
      }

      .hero__pill span {
        font-size: 12px;
        line-height: 1.35;
      }

      .marquee {
        height: 0;
        min-height: 0;
        padding: 0;
        border: 0;
        overflow: visible;
        transform: translateY(clamp(-96px, -9vh, -72px));
        scroll-snap-align: none;
      }

      .marquee__viewport {
        padding: 18px 0;
        border-top: 1px solid var(--line);
        border-bottom: 1px solid var(--line);
        background: rgba(7, 7, 8, .7);
      }

      .marquee__group {
        font-size: clamp(32px, 3.6vw, 48px);
      }

      .section {
        display: grid;
        align-content: center;
        padding: var(--screen-top) var(--screen-x) var(--screen-bottom);
      }

      .section>* {
        width: var(--screen-shell);
      }

      .section__head {
        grid-template-columns: 150px minmax(0, 1fr);
        gap: clamp(28px, 3vw, 50px);
        margin-bottom: clamp(20px, 3vh, 38px);
      }

      .section__title {
        font-size: clamp(34px, 4vw, 62px);
        line-height: 1.02;
        letter-spacing: 0;
      }

      .section__lede {
        margin-top: clamp(12px, 1.8vh, 20px);
        font-size: clamp(15px, 1vw, 17px);
        line-height: 1.45;
      }

      .about {
        grid-template-columns: minmax(0, 1fr) minmax(360px, .78fr);
        gap: clamp(36px, 4vw, 64px);
      }

      .about__text {
        gap: 18px;
      }

      .about__text p {
        font-size: clamp(18px, 1.22vw, 21px);
        line-height: 1.42;
        letter-spacing: 0;
      }

      .about__media {
        height: min(54vh, 560px);
        aspect-ratio: auto;
      }

      .sound__cell {
        min-height: clamp(190px, 21vh, 230px);
        padding: clamp(24px, 2.4vw, 36px);
        gap: 14px;
      }

      .sound__cell .label {
        font-size: clamp(24px, 2vw, 31px);
        letter-spacing: 0;
      }

      .sound__cell p {
        font-size: 14px;
        line-height: 1.48;
      }

      .genres {
        margin-top: clamp(18px, 2.6vh, 28px);
        gap: 7px;
      }

      .genres .tag {
        padding: 7px 12px;
        font-size: 10px;
      }

      .tl-row {
        grid-template-columns: 110px minmax(0, 1fr) 190px 44px;
        gap: 24px;
        padding: clamp(13px, 1.55vh, 17px) 0;
      }

      .tl-row .name {
        font-size: clamp(17px, 1.32vw, 24px);
        line-height: 1.16;
        letter-spacing: 0;
      }

      .tl-row .meta,
      .tl-row .yr {
        font-size: 10px;
      }

      #tickets {
        min-height: 100svh;
        padding-top: calc(var(--screen-top) - clamp(16px, 2.4vh, 30px));
        padding-bottom: clamp(34px, 4.2vh, 54px);
        align-content: center;
      }

      #tickets .section__head {
        grid-template-columns: 140px minmax(0, 1fr);
        margin-bottom: clamp(16px, 2.4vh, 26px);
      }

      #tickets .section__title {
        font-size: clamp(32px, 3.25vw, 54px);
        max-width: 20ch;
      }

      #tickets .section__lede {
        max-width: 62ch;
        margin-top: clamp(8px, 1.1vh, 14px);
        line-height: 1.4;
      }

      #tickets .ticket-system {
        width: min(1320px, 100%);
        grid-template-columns: minmax(400px, .86fr) minmax(500px, 1.14fr);
        border-radius: 20px;
      }

      #tickets .ticket-pass {
        min-height: clamp(390px, 49vh, 470px);
        padding: clamp(24px, 3.2vw, 44px);
      }

      #tickets .ticket-pass::before {
        width: min(68%, 460px);

      }

      #tickets .ticket-pass__content {
        width: clamp(350px, 27vw, 450px);
      }

      #tickets .ticket-card {
        min-height: clamp(124px, 15.2vh, 150px);
        padding: clamp(16px, 1.9vw, 24px);
        gap: clamp(8px, 1.1vh, 12px) 20px;
      }

      #tickets .ticket-card h3 {
        margin-top: 6px;
        font-size: clamp(20px, 1.55vw, 26px);
      }

      #tickets .ticket-card p {
        max-width: 54ch;
        font-size: 13px;
        line-height: 1.42;
      }

      #tickets .ticket-card__kind,
      #tickets .ticket-card__availability {
        font-size: 9px;
      }

      #tickets .ticket-card__price {
        font-size: clamp(17px, 1.25vw, 20px);
      }

      #tickets .ticket-card__actions .btn {
        min-height: 42px;
        min-width: 138px;
        padding: 0 18px;
      }

      #team .section__head {
        margin-bottom: 20px;
      }

      #team .team-grid {
        width: var(--screen-shell);
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      #team .member {
        min-height: clamp(220px, 24vh, 260px);
        display: grid;
        grid-template-columns: minmax(150px, .36fr) minmax(0, 1fr);
        grid-template-rows: auto auto minmax(0, 1fr) auto;
        gap: 10px 18px;
        padding: clamp(16px, 1.45vw, 22px);
      }

      #team .member__photo {
        grid-row: 1 / -1;
        height: 100%;
        min-height: 0;
        aspect-ratio: auto;
      }

      #team .member__role,
      #team .member__meta,
      #team .member__name,
      #team .member__bio,
      #team .member__skills {
        grid-column: 2;
      }

      #team .member__name {
        font-size: clamp(26px, 2.25vw, 38px);
        letter-spacing: 0;
      }

      #team .member__bio {
        font-size: 13px;
        line-height: 1.42;
      }

      #team .member__skills {
        gap: 5px;
        padding-top: 10px;
      }

      #team .member__skills span {
        padding: 4px 8px;
        font-size: 9px;
      }

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

      .service {
        min-height: clamp(188px, 21vh, 220px);
        padding: clamp(22px, 2vw, 28px);
        gap: 18px;
      }

      .service .icon {
        width: 46px;
        height: 46px;
      }

      .service .desc {
        font-size: 14px;
        line-height: 1.48;
      }

      #gallery .section__head {
        margin-bottom: clamp(22px, 3.2vh, 34px);
      }

      #gallery .section__title {
        font-size: clamp(42px, 5vw, 64px);
      }

      .gallery .g,
      .gallery .g--big,
      .gallery .g--w {
        width: 100%;
        height: 100%;
      }

      .gallery__track {
        grid-auto-columns: clamp(250px, 20vw, 350px);
        grid-template-rows: repeat(3, clamp(132px, 17vh, 190px));
      }

      .contact {
        grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr);
        gap: clamp(42px, 5vw, 76px);
        align-items: center;
      }

      .contact__big {
        font-size: clamp(42px, 5vw, 78px);
        line-height: 1.02;
        letter-spacing: 0;
      }

      .contact__list {
        gap: 10px;
      }

      .contact__list a,
      .contact__static {
        padding: 15px 0;
      }

      .footer {
        width: min(1320px, calc(100% - 40px));
        margin-top: clamp(18px, 3vh, 40px);
        margin-bottom: 28px;
        padding: clamp(20px, 2.4vw, 30px);
      }
    }

    @media (min-width:1200px) and (max-height:900px) {
      :root {
        --screen-top: clamp(92px, 10vh, 112px);
        --screen-bottom: clamp(28px, 3.6vh, 42px);
      }

      .hero__shell {
        gap: clamp(10px, 1.45vh, 16px);
      }

      .hero__bottom {
        gap: 10px;
      }

      .hero__statement {
        font-size: 15px;
        line-height: 1.42;
      }

      .hero__trust {
        margin-top: 0;
      }

      .hero__pill {
        min-height: 54px;
        padding: 10px 13px;
      }

      .section__head {
        margin-bottom: clamp(16px, 2.2vh, 28px);
      }

      .section__title {
        font-size: clamp(32px, 3.6vw, 56px);
      }

      .section__lede {
        margin-top: 10px;
        line-height: 1.38;
      }

      #tickets {
        padding-top: calc(var(--screen-top) - 18px);
        padding-bottom: 30px;
        align-content: center;
      }

      #tickets .section__head {
        margin-bottom: 14px;
      }

      #tickets .ticket-pass {
        min-height: clamp(350px, 47vh, 410px);
        padding: clamp(20px, 2.4vw, 34px);
      }

      #tickets .ticket-pass__content {
        width: clamp(330px, 25vw, 410px);
      }

      #tickets .ticket-card {
        min-height: clamp(112px, 14.2vh, 132px);
        padding: clamp(14px, 1.55vw, 20px);
        gap: 8px 18px;
      }

      #tickets .ticket-card p {
        line-height: 1.35;
      }
    }
