/*
Theme Name: Sheer Sound Studios
Theme URI: https://sheersoundstudios.com/
Author: TrustEdge.gt Design Studio
Author URI: https://trustedge.gt/design-studio.html
Description: A locked WordPress theme adaptation of the approved Sheer Sound Studios design system.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: Proprietary client deliverable
Text Domain: sheer-sound-studios
*/

/*
  Sheer Sound Studios design system.
  Manual editing notes:
  - Keep the approved composition overrides intact unless the design is formally reopened.
  - Prefer editing copy, image paths, and inventory text in HTML before changing layout CSS.
  - Preserve true black space, signal blue accents, thin measurement lines, and live-scope motion.
  - Future WordPress/template work should map each data-lock section to a reusable block.
*/

:root {
  color-scheme: dark;
  --black: #020304;
  --panel: #07090b;
  --panel-2: #0d1116;
  --line: rgba(70, 154, 220, .24);
  --line-strong: rgba(5, 136, 232, .78);
  --blue: #0588e8;
  --blue-deep: #0064a8;
  --text: #f5f8ff;
  --muted: #a9b2be;
  --dim: #69727f;
  --amber: #c89145;
  --max: 1320px;
  --gutter: clamp(20px, 4vw, 64px);
  --radius: 6px;
  --font: "Inter", Arial, sans-serif;
  --display: "Space Grotesk", "Inter", Arial, sans-serif;
  --hero-display: "Barlow Condensed", "Space Grotesk", "Inter", Arial, sans-serif;
  --mono: "JetBrains Mono", Consolas, monospace;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: auto;
  scroll-padding-top: 104px;
  background: var(--black);
  overflow-x: clip;
}

body {
  margin: 0;
  min-width: 320px;
  overflow-x: clip;
  background:
    radial-gradient(circle at 68% 12%, rgba(5, 136, 232, .12), transparent 27rem),
    radial-gradient(circle at 30% 70%, rgba(200, 145, 65, .05), transparent 24rem),
    linear-gradient(180deg, #000 0%, #030405 52%, #000 100%);
  color: var(--text);
  font-family: var(--font);
  line-height: 1.55;
  letter-spacing: 0;
}

.ambient-field {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .32;
  transform: rotate(90deg) scale(1.32);
  transform-origin: center;
  background-image:
    radial-gradient(circle, rgba(236, 177, 90, .55) 0 1px, transparent 1.6px),
    radial-gradient(circle, rgba(5, 136, 232, .46) 0 1px, transparent 1.7px),
    radial-gradient(circle, rgba(255, 255, 255, .25) 0 1px, transparent 1.4px);
  background-size: 180px 180px, 260px 260px, 330px 330px;
  background-position: 16px 80px, 110px 40px, 220px 160px;
  mask-image: radial-gradient(ellipse at 58% 48%, #000 0%, transparent 68%);
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  background-image:
    linear-gradient(rgba(5, 136, 232, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(5, 136, 232, .045) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: linear-gradient(90deg, transparent, #000 13%, #000 87%, transparent);
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(circle at center, transparent 0%, rgba(0, 0, 0, .28) 62%, rgba(0, 0, 0, .76) 100%);
}

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

a {
  color: inherit;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: calc(var(--max) + var(--gutter) * 2);
  margin: 0 auto;
  padding: 20px var(--gutter);
  background: linear-gradient(180deg, rgba(2, 3, 4, .95), rgba(2, 3, 4, .72));
  border-bottom: 1px solid rgba(5, 136, 232, .12);
  backdrop-filter: blur(18px);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}

.brand img,
.note-panel > img {
  display: block;
  flex: 0 0 auto;
  height: auto;
  background: transparent;
  box-shadow: 0 0 22px rgba(5, 136, 232, .34);
}

.note-panel > img {
  width: 74px;
}

.brand strong {
  display: block;
  color: var(--text);
  font-family: var(--display);
  font-size: 1rem;
  font-weight: 800;
  line-height: 1;
  text-transform: uppercase;
}

.brand em {
  display: block;
  margin-top: 4px;
  color: var(--blue);
  font-size: .92rem;
  font-style: italic;
  line-height: 1;
}

.site-nav {
  display: flex;
  align-items: center;
  gap: clamp(16px, 2.2vw, 34px);
}

.site-nav a {
  color: #e9eef7;
  font-family: var(--display);
  font-size: .78rem;
  font-weight: 800;
  text-decoration: none;
  text-transform: uppercase;
}

.site-nav a:hover,
.site-nav a:focus-visible {
  color: var(--blue);
}

.nav-toggle {
  display: none;
}

main {
  max-width: calc(var(--max) + var(--gutter) * 2);
  margin: 0 auto;
  padding: 0 var(--gutter) 56px;
}

.section-grid {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.45fr);
  gap: clamp(28px, 5vw, 76px);
  align-items: center;
  padding: clamp(54px, 8vw, 96px) 0;
  border-bottom: 1px solid rgba(120, 164, 200, .16);
}

.hero {
  position: relative;
  min-height: calc(100vh - 98px);
  padding-top: 42px;
  border-bottom-color: rgba(5, 136, 232, .2);
}

.proof::after,
.equipment::after {
  content: "";
  position: absolute;
  left: var(--gutter);
  right: var(--gutter);
  bottom: 18px;
  height: 48px;
  pointer-events: none;
  opacity: .28;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 90' preserveAspectRatio='none'%3E%3Cpath d='M0 48 C90 48 116 46 164 48 C220 51 248 58 302 49 C352 40 382 39 438 48 C494 57 530 58 590 48 C650 38 688 39 750 48 C812 57 850 57 914 48 C980 39 1020 42 1080 48 C1124 52 1160 50 1200 48' fill='none' stroke='%230588e8' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent);
  mix-blend-mode: screen;
  filter: drop-shadow(0 0 10px rgba(5, 136, 232, .36)) blur(.1px);
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  z-index: 0;
  width: min(56%, 720px);
  pointer-events: none;
  opacity: .34;
  background-image:
    linear-gradient(rgba(5, 136, 232, .12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(5, 136, 232, .11) 1px, transparent 1px),
    linear-gradient(90deg, transparent 0 48%, rgba(5, 136, 232, .26) 48% 48.2%, transparent 48.2%),
    linear-gradient(180deg, transparent 0 48%, rgba(5, 136, 232, .2) 48% 48.2%, transparent 48.2%);
  background-size: 44px 44px, 44px 44px, 100% 100%, 100% 100%;
  mask-image:
    linear-gradient(90deg, #000 0%, rgba(0, 0, 0, .82) 48%, transparent 100%),
    linear-gradient(180deg, #000 0%, rgba(0, 0, 0, .76) 58%, transparent 100%);
  mask-composite: intersect;
}

.proof,
.equipment,
.closing-cta {
  position: relative;
}

.hero-copy {
  position: relative;
  z-index: 2;
}

.hero-copy::before {
  content: "+12\A +6\A 0\A -6\A -12\A -18\A -24\A -30\A -36\A -42\A -48\A -54\A -60\A dBFS";
  position: absolute;
  left: clamp(-58px, -4vw, -34px);
  top: 8px;
  white-space: pre;
  color: var(--blue);
  font-family: var(--mono);
  font-size: .72rem;
  font-weight: 700;
  line-height: 2.22;
  opacity: .36;
  text-shadow: 0 0 12px rgba(5, 136, 232, .36);
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1 {
  margin-bottom: 16px;
  color: var(--text);
  font-family: var(--hero-display);
  font-size: clamp(4.5rem, 10vw, 9.2rem);
  font-weight: 800;
  letter-spacing: 0;
  line-height: .72;
  text-shadow: 0 0 34px rgba(255, 255, 255, .2);
  text-transform: uppercase;
}

h2 {
  margin-bottom: 18px;
  color: var(--text);
  font-family: var(--display);
  font-size: clamp(2.15rem, 4.4vw, 4.4rem);
  font-weight: 850;
  letter-spacing: 0;
  line-height: .96;
}

h2 span,
.tagline {
  color: var(--blue);
  font-style: italic;
  font-weight: 500;
}

h3 {
  margin-bottom: 8px;
  font-family: var(--display);
  font-size: 1.12rem;
  line-height: 1.12;
}

.tagline {
  margin-bottom: 18px;
  font-size: clamp(1.65rem, 3.2vw, 3.2rem);
  line-height: 1.05;
}

.locale {
  display: inline-flex;
  margin: 0 0 2px;
  color: rgba(169, 178, 190, .84);
  font-family: var(--mono);
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.lede,
.section-copy p,
.submission-panel p,
.closing-cta p {
  color: var(--muted);
  font-size: clamp(1rem, 1.4vw, 1.2rem);
  max-width: 46rem;
}

.hero-actions,
.cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 28px;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 24px;
  border: 1px solid var(--line-strong);
  border-radius: 0;
  color: var(--text);
  font-family: var(--display);
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: 0;
  text-decoration: none;
  text-transform: uppercase;
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
  cursor: pointer;
}

button.button {
  appearance: none;
  border-radius: 0;
}

.button:hover,
.button:focus-visible {
  transform: translateY(-1px);
}

.button.primary {
  background: linear-gradient(180deg, #169bf4, #0064a8);
  border-color: #169bf4;
  box-shadow: 0 0 34px rgba(5, 136, 232, .28);
}

.button.ghost,
.button.outline {
  background: rgba(2, 3, 4, .46);
}

.button.outline {
  margin-top: 10px;
}

.text-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--blue);
  font-family: var(--mono);
  font-size: .82rem;
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
}

.text-link::after {
  content: "";
  width: 26px;
  height: 1px;
  background: currentColor;
}

.signal-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  max-width: 520px;
  margin: 38px 0 0;
  border: 1px solid rgba(5, 136, 232, .22);
  background: rgba(5, 136, 232, .18);
}

.hero-service-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  max-width: 520px;
  margin-top: 22px;
  border: 1px solid rgba(5, 136, 232, .28);
  background: rgba(5, 136, 232, .18);
}

.hero-service-row span {
  display: grid;
  gap: 7px;
  justify-items: start;
  min-width: 0;
  padding: 14px 16px 13px;
  color: var(--text);
  background: rgba(2, 3, 4, .8);
  font-family: var(--display);
  font-size: .86rem;
  font-weight: 800;
}

.hero-service-row svg {
  width: 58px;
  height: 28px;
  fill: none;
  stroke: var(--blue);
  stroke-width: 2.2;
  stroke-linecap: square;
  stroke-linejoin: miter;
  filter: drop-shadow(0 0 12px rgba(5, 136, 232, .55));
}

.signal-stats div {
  min-width: 0;
  padding: 16px 14px;
  background: rgba(2, 3, 4, .8);
}

.signal-stats dt {
  color: var(--text);
  font-family: var(--mono);
  font-size: clamp(1.2rem, 2vw, 1.65rem);
  font-weight: 700;
}

.signal-stats dd {
  margin: 2px 0 0;
  color: var(--dim);
  font-size: .82rem;
}

.hero-stage {
  position: relative;
  min-height: 630px;
  overflow: hidden;
  background: #000;
  isolation: isolate;
}

.hero-stage.photo-grade {
  --photo-brightness: 1.04;
  --photo-contrast: 1.06;
  --photo-saturation: 1.02;
  --photo-sepia: 0;
}

.hero-stage::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    linear-gradient(90deg, #000 0%, rgba(0, 0, 0, .64) 14%, rgba(0, 0, 0, .12) 40%, transparent 70%),
    linear-gradient(180deg, rgba(0, 0, 0, .02), rgba(0, 0, 0, .54) 96%);
}

.photo-grade {
  --photo-brightness: .72;
  --photo-contrast: 1.16;
  --photo-saturation: .84;
  --photo-sepia: .05;
  position: relative;
  background: #000;
  isolation: isolate;
}

.photo-grade > img {
  filter:
    brightness(var(--photo-brightness))
    contrast(var(--photo-contrast))
    saturate(var(--photo-saturation))
    sepia(var(--photo-sepia));
}

.photo-grade::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 48%, transparent 0%, rgba(0, 0, 0, .22) 48%, rgba(0, 0, 0, .72) 100%),
    linear-gradient(90deg, rgba(0, 0, 0, .5), transparent 35%, rgba(0, 0, 0, .2)),
    linear-gradient(180deg, rgba(5, 136, 232, .07), rgba(0, 0, 0, .14));
}

.hero-stage.photo-grade::after {
  z-index: 3;
  background:
    linear-gradient(90deg, #000 0%, rgba(0, 0, 0, .7) 14%, rgba(0, 0, 0, .12) 40%, transparent 74%),
    linear-gradient(180deg, rgba(0, 0, 0, .02), rgba(0, 0, 0, .48) 96%),
    radial-gradient(circle at 64% 48%, transparent 0%, rgba(0, 0, 0, .18) 58%, rgba(0, 0, 0, .56) 100%);
}

.hero-stage img {
  width: 100%;
  height: 100%;
  min-height: 630px;
  object-fit: cover;
  opacity: .98;
}

.scope-line {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 54%;
  z-index: 4;
  height: 94px;
  color: var(--blue);
  opacity: .44;
  transform: translateY(50%);
}

.scope-line::before {
  content: "";
  position: absolute;
  left: 45%;
  top: -120px;
  bottom: -120px;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(5, 136, 232, .42), transparent);
}

.scope-line::after {
  content: none;
}

.scope-line svg {
  width: 100%;
  height: 100%;
  filter: drop-shadow(0 0 10px rgba(5, 136, 232, .48));
}

.scope-line path {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.4;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.proof {
  grid-template-columns: minmax(260px, .62fr) minmax(0, 1.7fr);
}

.spotify-lower-third {
  display: grid;
  grid-template-columns: minmax(270px, .64fr) minmax(0, 1.36fr);
  gap: clamp(22px, 4vw, 44px);
  align-items: center;
  margin: -22px 0 18px;
  padding: 24px;
  border: 1px solid rgba(5, 136, 232, .24);
  background:
    linear-gradient(90deg, rgba(5, 136, 232, .08), rgba(0, 0, 0, .2)),
    rgba(4, 7, 10, .82);
  box-shadow: 0 28px 90px rgba(0, 0, 0, .48);
}

.spotify-lower-third h2 {
  margin-bottom: 10px;
  font-size: clamp(1.55rem, 2.5vw, 2.7rem);
}

.spotify-lower-third p {
  margin: 0;
  color: var(--muted);
}

.spotify-embeds {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.spotify-embeds iframe {
  display: block;
  width: 100%;
  height: 152px;
  border: 0;
  border-radius: 0;
  filter: saturate(.85) brightness(.92);
  background: #000;
}

.release-rail {
  display: grid;
  grid-template-columns: repeat(4, minmax(170px, 1fr));
  gap: 18px;
}

.release {
  min-height: 318px;
  padding: 0 0 16px;
  background: linear-gradient(180deg, rgba(13, 17, 22, .9), rgba(3, 4, 5, .9));
  border: 1px solid rgba(120, 164, 200, .16);
  box-shadow: 0 22px 60px rgba(0, 0, 0, .42);
}

.release h3,
.release p,
.release strong {
  margin-left: 16px;
  margin-right: 16px;
}

.release p {
  color: var(--muted);
  font-size: .92rem;
}

.release strong {
  display: inline-block;
  color: var(--blue);
  font-family: var(--mono);
  font-size: .72rem;
  text-transform: uppercase;
}

.release.pending strong {
  color: var(--amber);
}

.cover {
  position: relative;
  display: block;
  aspect-ratio: 1;
  margin-bottom: 18px;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(5, 136, 232, .28), rgba(0, 0, 0, .2)),
    #111;
}

.cover::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, .06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
  background-size: 20px 20px;
}

.cover::after {
  content: "";
  position: absolute;
  left: -5%;
  right: -5%;
  top: 46%;
  height: 58px;
  border-top: 2px solid currentColor;
  color: var(--blue);
  transform: skewY(-10deg);
  box-shadow: 0 0 24px currentColor;
}

.cover-a {
  background-color: #381111;
}

.cover-b {
  background-color: #112333;
}

.cover-c {
  background-color: #25292d;
}

.cover-d {
  background-color: #2f2a1d;
}

.submission-panel {
  position: relative;
  display: grid;
  grid-template-columns: minmax(260px, .7fr) minmax(0, 1.3fr);
  gap: 34px;
  margin: 18px 0;
  padding: clamp(28px, 5vw, 46px);
  overflow: hidden;
  border: 1px solid rgba(5, 136, 232, .35);
  background:
    linear-gradient(180deg, rgba(5, 136, 232, .08), rgba(0, 0, 0, 0)),
    rgba(5, 8, 12, .8);
}

.submission-panel::before,
.closing-cta::before {
  content: "";
  position: absolute;
  inset: auto 0 20px;
  height: 48px;
  opacity: .22;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 80' preserveAspectRatio='none'%3E%3Cpath d='M0 42 C80 42 116 38 164 42 C222 48 256 50 312 42 C370 34 404 36 462 42 C522 49 562 49 626 42 C690 35 732 35 792 42 C836 47 870 44 900 42' fill='none' stroke='%230588e8' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
  filter: drop-shadow(0 0 10px rgba(5, 136, 232, .34));
  mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent);
}

.closing-cta::before {
  content: none;
}

.proof-needs {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  padding: 0;
  list-style: none;
  background: rgba(120, 164, 200, .16);
}

.proof-needs li {
  min-width: 0;
  padding: 24px 22px;
  background: rgba(2, 3, 4, .7);
  text-align: center;
}

.proof-needs svg,
.service-list svg {
  width: 54px;
  height: 54px;
  margin: 0 auto 16px;
  fill: none;
  stroke: var(--blue);
  stroke-width: 2.4;
  stroke-linecap: square;
  stroke-linejoin: miter;
  filter: drop-shadow(0 0 14px rgba(5, 136, 232, .36));
}

.proof-needs strong,
.proof-needs span {
  display: block;
}

.proof-needs strong {
  font-size: clamp(1rem, 1.7vw, 1.35rem);
  line-height: 1.1;
}

.proof-needs span {
  margin-top: 12px;
  color: var(--muted);
  font-size: .92rem;
}

.blue-list {
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
  color: var(--muted);
}

.blue-list li {
  position: relative;
  margin: 9px 0;
  padding-left: 20px;
}

.blue-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .72em;
  width: 5px;
  height: 5px;
  background: var(--blue);
  box-shadow: 0 0 10px var(--blue);
}

.media-card {
  overflow: hidden;
  background: #000;
  border: 1px solid rgba(120, 164, 200, .15);
}

.media-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .92;
}

.media-card.wide {
  min-height: 360px;
}

.services.section-grid {
  grid-template-columns: minmax(240px, .56fr) minmax(0, .9fr) minmax(320px, .74fr);
}

.services .section-copy {
  align-self: start;
}

.services .media-card.wide {
  align-self: stretch;
}

.services .media-card.wide img {
  min-height: 420px;
}

.service-list {
  display: grid;
  gap: 1px;
  align-self: stretch;
  background: rgba(5, 136, 232, .18);
  border: 1px solid rgba(5, 136, 232, .24);
}

.service-list article {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 17px;
  align-items: center;
  min-width: 0;
  padding: 22px;
  background: linear-gradient(90deg, rgba(5, 136, 232, .08), rgba(2, 3, 4, .82));
}

.service-list svg {
  grid-row: 1 / span 2;
  margin: 0;
}

.service-list h3 {
  grid-column: 2;
  margin-bottom: 6px;
  font-size: clamp(1.18rem, 1.7vw, 1.55rem);
}

.service-list p {
  grid-column: 2;
  margin: 0;
  color: var(--muted);
}

.facility {
  grid-template-columns: minmax(260px, .62fr) minmax(0, 1fr) minmax(230px, .42fr);
}

.facility-image {
  min-height: 390px;
}

.note-panel {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 260px;
  padding: 24px;
  border: 1px solid rgba(5, 136, 232, .2);
  background: linear-gradient(180deg, rgba(5, 136, 232, .11), rgba(3, 4, 5, .72));
}

.note-panel p {
  margin: 20px 0 0;
  color: var(--muted);
  font-size: .96rem;
}

.equipment {
  padding: clamp(54px, 8vw, 88px) 0;
  border-bottom: 1px solid rgba(120, 164, 200, .16);
}

.equipment-hero {
  min-height: 300px;
  margin-bottom: 18px;
  overflow: hidden;
  border: 1px solid rgba(120, 164, 200, .15);
}

.equipment-hero img {
  width: 100%;
  height: 340px;
  object-fit: cover;
}

.section-title-row {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 24px;
}

.section-title-row h2 {
  margin-bottom: 0;
}

.title-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 18px;
}

.section-title-row span {
  color: var(--blue);
  font-family: var(--mono);
  font-size: .82rem;
  font-weight: 700;
  text-transform: uppercase;
}

.equipment-showcase {
  display: grid;
  grid-template-columns: minmax(0, 1.32fr) minmax(300px, .68fr);
  gap: 1px;
  margin-bottom: 18px;
  border: 1px solid rgba(120, 164, 200, .16);
  background: rgba(120, 164, 200, .16);
}

.equipment-hero {
  margin: 0;
  min-height: 430px;
  overflow: hidden;
}

.equipment-hero img {
  width: 100%;
  height: 100%;
  min-height: 430px;
  object-fit: cover;
  object-position: center;
}

.equipment-hero figcaption {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 16px;
  z-index: 5;
  color: rgba(245, 248, 255, .68);
  font-family: var(--mono);
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
}

.reel-focus {
  --photo-brightness: .78;
  --photo-contrast: 1.13;
  --photo-saturation: .92;
  --photo-sepia: .03;
}

.reel-focus::after {
  background:
    radial-gradient(circle at 34% 58%, transparent 0%, rgba(0, 0, 0, .12) 36%, rgba(0, 0, 0, .58) 100%),
    linear-gradient(90deg, rgba(0, 0, 0, .18), transparent 42%, rgba(0, 0, 0, .34)),
    linear-gradient(180deg, rgba(5, 136, 232, .04), rgba(0, 0, 0, .22));
}

.equipment-feature {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: clamp(24px, 4vw, 42px);
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(5, 136, 232, .055), transparent 58%),
    rgba(2, 3, 4, .9);
}

.equipment-feature::before {
  content: "";
  position: absolute;
  inset: auto -22% 22px -22%;
  height: 76px;
  opacity: .28;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 100' preserveAspectRatio='none'%3E%3Cpath d='M0 54 C70 54 96 50 136 54 C184 59 210 62 258 54 C306 46 336 47 386 54 C442 62 478 62 536 54 C596 45 632 46 692 54 C748 62 786 60 842 54 C866 52 884 52 900 54' fill='none' stroke='%230588e8' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  filter: drop-shadow(0 0 12px rgba(5, 136, 232, .34)) blur(.15px);
  mask-image: linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent);
}

.equipment-feature h3 {
  position: relative;
  z-index: 2;
  margin-bottom: 14px;
  font-size: clamp(1.8rem, 3vw, 3.1rem);
  line-height: .95;
}

.equipment-feature p {
  position: relative;
  z-index: 2;
  color: var(--muted);
  font-size: 1rem;
}

.capacity-strip {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: 22px;
  border: 1px solid rgba(5, 136, 232, .22);
  background: transparent;
  overflow: hidden;
}

.capacity-strip::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .12;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 90' preserveAspectRatio='none'%3E%3Cpath d='M0 48 C52 48 70 44 98 48 C132 53 154 55 188 48 C222 41 246 42 282 48 C320 55 346 54 384 48 C426 41 456 42 496 48 C536 54 568 50 600 48' fill='none' stroke='%230588e8' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E") center / 120% 100% no-repeat;
}

.capacity-strip span {
  position: relative;
  z-index: 1;
  min-width: 0;
  padding: 13px 12px;
  background: rgba(2, 3, 4, .52);
  color: var(--dim);
  font-size: .78rem;
  line-height: 1.2;
}

.capacity-strip strong {
  display: block;
  color: var(--text);
  font-family: var(--mono);
  font-size: 1.02rem;
  line-height: 1.08;
  white-space: nowrap;
}

.capacity-strip small {
  display: block;
  margin-top: 4px;
  color: var(--dim);
  font-size: .76rem;
  line-height: 1.15;
}

.equipment-grid {
  display: grid;
  grid-template-columns: 1fr;
  background: transparent;
  border-top: 1px solid rgba(120, 164, 200, .18);
  border-bottom: 1px solid rgba(120, 164, 200, .18);
}

.equipment-grid article {
  display: grid;
  grid-template-columns: 72px minmax(180px, .32fr) minmax(0, 1fr);
  gap: clamp(18px, 3vw, 34px);
  align-items: start;
  min-width: 0;
  padding: 22px 0;
  background: transparent;
  border-top: 1px solid rgba(120, 164, 200, .14);
}

.equipment-grid article:first-child {
  border-top: 0;
}

.meter {
  display: block;
  width: 100%;
  height: 48px;
  margin: 0;
  opacity: .34;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 420 60' preserveAspectRatio='none'%3E%3Cpath d='M0 34 C34 34 46 31 68 34 C96 38 116 39 144 34 C176 29 198 29 230 34 C266 40 292 38 326 34 C360 30 390 32 420 34' fill='none' stroke='%230588e8' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
  filter: drop-shadow(0 0 8px rgba(5, 136, 232, .2));
}

.equipment-grid h3 {
  margin: 0;
  color: var(--text);
  font-family: var(--display);
  font-size: clamp(1.05rem, 1.45vw, 1.32rem);
  font-weight: 850;
  line-height: 1.05;
  text-transform: uppercase;
}

.equipment-grid p {
  margin: 0;
  color: var(--muted);
  font-size: clamp(.94rem, 1.15vw, 1.06rem);
  line-height: 1.45;
}

.closing-cta {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) auto;
  gap: 28px;
  align-items: center;
  margin: 36px 0 0;
  padding: clamp(30px, 5vw, 48px);
  overflow: hidden;
  border: 1px solid rgba(5, 136, 232, .2);
  background:
    linear-gradient(90deg, rgba(5, 136, 232, .12), rgba(0, 0, 0, .24)),
    rgba(7, 9, 11, .9);
}

.closing-cta h2,
.closing-cta p,
.cta-actions {
  position: relative;
  z-index: 2;
}

.closing-cta h2 {
  margin-bottom: 12px;
  max-width: 820px;
}

.site-footer {
  display: grid;
  grid-template-columns: minmax(260px, 1.2fr) repeat(3, minmax(150px, .45fr));
  gap: 28px;
  max-width: calc(var(--max) + var(--gutter) * 2);
  margin: 0 auto;
  padding: 42px var(--gutter) 52px;
  color: var(--dim);
}

.site-footer > div {
  display: grid;
  gap: 7px;
  align-content: start;
}

.footer-brand-block {
  justify-items: start;
}

.site-footer .design-credit {
  justify-self: start;
  margin-top: 20px;
  margin-left: 64px;
  color: rgba(169, 178, 190, .68);
  font-family: var(--mono);
  font-size: .72rem;
  text-decoration: none;
}

.site-footer strong {
  color: var(--text);
  font-family: var(--mono);
  font-size: .72rem;
  text-transform: uppercase;
}

.site-footer a:not(.brand) {
  color: var(--muted);
  font-size: .88rem;
  text-decoration: none;
}

.site-footer span {
  color: var(--muted);
  font-size: .88rem;
}

@media (max-width: 1080px) {
  .section-grid,
  .services.section-grid,
  .proof,
  .facility,
  .equipment-showcase,
  .spotify-lower-third,
  .submission-panel,
  .closing-cta {
    grid-template-columns: 1fr;
  }

  .hero {
    min-height: auto;
  }

  .hero-stage,
  .hero-stage img {
    min-height: 460px;
  }

  .release-rail,
  .equipment-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .proof-needs,
  .spotify-embeds {
    grid-template-columns: 1fr;
  }

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

@media (max-width: 760px) {
  .site-header {
    padding-top: 14px;
    padding-bottom: 14px;
  }

  .brand strong {
    font-size: .86rem;
  }

  .brand em {
    font-size: .8rem;
  }

  .brand img {
    width: 44px;
    height: auto;
  }

  .nav-toggle {
    display: inline-grid;
    place-content: center;
    gap: 7px;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(5, 136, 232, .32);
    background: rgba(2, 3, 4, .6);
    color: var(--text);
  }

  .nav-toggle span {
    display: block;
    width: 18px;
    height: 2px;
    background: var(--text);
  }

  .site-nav {
    position: absolute;
    left: var(--gutter);
    right: var(--gutter);
    top: calc(100% + 8px);
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 12px;
    border: 1px solid rgba(5, 136, 232, .24);
    background: rgba(2, 3, 4, .96);
  }

  .site-nav.is-open {
    display: flex;
  }

  .site-nav a {
    padding: 12px;
  }

  .hero {
    padding-top: 38px;
  }

  .hero-stage,
  .hero-stage img {
    min-height: 340px;
  }

  .hero::before {
    width: 100%;
    opacity: .18;
  }

  .hero-copy::before {
    content: none;
  }

  .scope-line {
    bottom: 48%;
    opacity: .36;
  }

  .scope-line::before {
    left: 50%;
  }

  .signal-stats,
  .hero-service-row,
  .release-rail {
    grid-template-columns: 1fr;
  }

  .equipment-grid article {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 22px 0 24px;
  }

  .meter {
    width: 100%;
    height: 30px;
  }

  .service-list article {
    grid-template-columns: 64px minmax(0, 1fr);
  }

  .section-title-row {
    align-items: start;
    flex-direction: column;
  }

  .title-links {
    justify-content: flex-start;
  }

  .equipment-hero,
  .equipment-hero img {
    min-height: 320px;
  }

  .capacity-strip {
    grid-template-columns: 1fr;
  }

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

/* Approved composition lock: full-width oscilloscope room system. */
:root {
  --edge: clamp(24px, 3.2vw, 50px);
}

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

main {
  max-width: none;
  padding: 0;
}

.site-header {
  max-width: none;
  min-height: 80px;
  padding: 16px var(--edge) 14px;
  background: rgba(0, 0, 0, .94);
  border-bottom: 1px solid rgba(120, 164, 200, .12);
  box-shadow: none;
}

.site-header .brand {
  gap: 18px;
}

.site-header .brand img {
  width: 50px;
}

.brand strong {
  font-family: var(--font);
  font-size: clamp(1.18rem, 1.55vw, 1.55rem);
  font-weight: 400;
  line-height: 1.05;
  text-transform: none;
}

.brand em {
  margin-top: 1px;
  color: var(--blue);
  font-size: clamp(.94rem, 1vw, 1.05rem);
  font-style: normal;
  line-height: 1.05;
}

.site-nav {
  gap: clamp(20px, 2.2vw, 32px);
}

.site-nav a {
  color: #f2f5fa;
  font-family: var(--display);
  font-size: .7rem;
  font-weight: 800;
}

.site-nav a:first-child {
  color: var(--blue);
}

.site-nav .header-book {
  min-width: 166px;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 8px;
  padding: 0 24px;
  border: 1px solid rgba(5, 136, 232, .7);
  color: var(--blue);
  font-family: var(--mono);
  font-size: .82rem;
  letter-spacing: 0;
}

.hero.section-grid {
  display: grid;
  grid-template-columns: minmax(430px, 47.8%) minmax(0, 52.2%);
  gap: 0;
  align-items: stretch;
  height: clamp(360px, 24.2vw, 500px);
  min-height: 0;
  padding: 0;
  border-bottom: 1px solid rgba(120, 164, 200, .12);
  overflow: hidden;
}

.hero::before {
  inset: 0 auto 0 0;
  width: 51%;
  opacity: .28;
  background-size: 46px 46px, 46px 46px, 100% 100%, 100% 100%;
  mask-image: linear-gradient(90deg, #000 0%, rgba(0, 0, 0, .9) 62%, transparent 100%);
}

.hero::after {
  content: none;
}

.hero-copy {
  z-index: 5;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 22px clamp(36px, 4vw, 70px) 22px calc(var(--edge) + 114px);
}

.hero-copy::before {
  left: var(--edge);
  top: 30px;
  font-size: .7rem;
  line-height: 2.18;
  opacity: .7;
}

.hero-copy h1 {
  margin-bottom: 12px;
  font-size: clamp(4.8rem, 6.45vw, 7.35rem);
  line-height: .77;
  text-shadow: 0 0 18px rgba(255, 255, 255, .18);
}

.hero-copy .tagline {
  margin-bottom: 16px;
  font-size: clamp(1.38rem, 1.85vw, 1.9rem);
  font-style: normal;
}

.hero-copy .lede,
.hero-copy .locale,
.hero-copy .hero-actions,
.hero-copy .signal-stats {
  display: none;
}

.hero-service-row {
  display: flex;
  max-width: 650px;
  margin-top: 0;
  border: 0;
  background: transparent;
}

.hero-service-row span {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-height: 42px;
  padding: 0 clamp(20px, 2vw, 34px);
  background: transparent;
  border-right: 1px solid rgba(120, 164, 200, .28);
  color: #f4f7fb;
  font-family: var(--display);
  font-size: .92rem;
  font-weight: 800;
  text-transform: uppercase;
}

.hero-service-row span:first-child {
  padding-left: 0;
}

.hero-service-row span:last-child {
  border-right: 0;
}

.hero-service-row svg {
  width: 42px;
  height: 24px;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.hero-stage {
  min-height: 0;
  height: 100%;
  border: 0;
}

.hero-stage img {
  height: 100%;
  min-height: 0;
  object-position: center;
}

.hero-stage.photo-grade::after {
  background:
    linear-gradient(90deg, rgba(0, 0, 0, .72) 0%, rgba(0, 0, 0, .22) 18%, transparent 52%),
    linear-gradient(180deg, rgba(0, 0, 0, .02), rgba(0, 0, 0, .18) 100%),
    radial-gradient(circle at 66% 48%, transparent 0%, rgba(0, 0, 0, .08) 62%, rgba(0, 0, 0, .34) 100%);
}

.hero-stage::before {
  z-index: 2;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, .62) 0%, rgba(0, 0, 0, .22) 18%, transparent 46%),
    linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .16) 100%);
}

.hero-stage .scope-line {
  display: none;
}

.hero-scope {
  position: absolute;
  left: calc(var(--edge) + 102px);
  right: 0;
  top: 44%;
  z-index: 4;
  width: auto;
  height: 112px;
  min-height: 0;
  pointer-events: none;
  opacity: .98;
  filter: drop-shadow(0 0 18px rgba(5, 136, 232, .38));
  mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 84%, transparent 100%);
}

.direction-band {
  display: grid;
  align-items: stretch;
  max-width: none;
  min-height: 145px;
  padding: 0 var(--edge);
  background: rgba(0, 0, 0, .96);
  border-bottom: 1px solid rgba(120, 164, 200, .13);
}

.room-strip {
  grid-template-columns: 210px repeat(3, minmax(220px, 1fr)) minmax(320px, .95fr);
}

.services-strip {
  grid-template-columns: 210px repeat(3, minmax(255px, 1fr));
}

.projects-strip {
  position: relative;
  grid-template-columns: 210px minmax(280px, 340px) minmax(0, 1fr);
  height: auto;
  min-height: 188px;
  overflow: hidden;
}

.work-strip {
  grid-template-columns: 210px minmax(360px, 1fr) minmax(170px, auto) minmax(260px, .42fr);
  min-height: 88px;
}

.band-label,
.signal-item,
.scope-panel,
.project-intro,
.project-cells,
.work-copy,
.work-strip address {
  min-width: 0;
}

.band-label {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-right: 30px;
  border-right: 1px solid rgba(120, 164, 200, .22);
}

.band-label h2 {
  margin: 0 0 12px;
  color: var(--blue);
  font-family: var(--display);
  font-size: clamp(1.18rem, 1.4vw, 1.45rem);
  font-weight: 800;
  line-height: 1.05;
  text-transform: uppercase;
}

.band-label p {
  margin: 0;
  color: #d3d8df;
  font-size: .92rem;
  line-height: 1.45;
}

.signal-item {
  display: grid;
  grid-template-columns: 66px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  padding: 0 clamp(22px, 2.6vw, 34px);
  border-right: 1px solid rgba(120, 164, 200, .22);
}

.signal-item h3,
.project-intro h3,
.work-copy h3 {
  margin: 0 0 7px;
  color: #f3f6fb;
  font-family: var(--display);
  font-size: clamp(1rem, 1.15vw, 1.18rem);
  font-weight: 850;
  line-height: 1.1;
  text-transform: uppercase;
}

.project-intro h3,
.work-copy h3 {
  text-transform: none;
}

.signal-item p,
.project-intro p,
.work-copy p {
  margin: 0;
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.45;
}

.signal-icon svg {
  width: 58px;
  height: 58px;
  fill: none;
  stroke: #c4cbd4;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 10px rgba(5, 136, 232, .24));
}

.services-strip .signal-icon svg,
.waveform-icon svg {
  stroke: var(--blue);
}

.scope-panel {
  position: relative;
  display: grid;
  align-items: center;
  padding-left: clamp(22px, 2.6vw, 34px);
  overflow: hidden;
  background-image:
    linear-gradient(rgba(5, 136, 232, .12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(5, 136, 232, .12) 1px, transparent 1px);
  background-size: 30px 30px;
  mask-image: linear-gradient(90deg, #000 0%, #000 86%, transparent 100%);
}

.scope-panel svg {
  width: 100%;
  height: 104px;
}

.scope-panel path {
  fill: none;
  stroke: var(--blue);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 8px rgba(5, 136, 232, .52));
}

.project-intro {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 28px;
  border-right: 1px solid rgba(120, 164, 200, .22);
}

.project-intro .button {
  align-self: start;
  min-height: 34px;
  margin-top: 12px;
  padding: 0 24px;
  color: var(--blue);
  background: transparent;
  font-size: .72rem;
}

.project-cells {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  align-self: end;
  align-items: start;
  margin-right: 122px;
  padding: 56px 0 18px;
}

.project-cells article {
  min-width: 0;
  padding: 0 20px;
  border-right: 1px solid rgba(120, 164, 200, .24);
}

.project-cells article:last-child {
  border-right: 0;
}

.project-cells strong,
.project-cells span,
.project-cells em {
  display: block;
}

.project-cells strong {
  color: #cfd5dd;
  font-family: var(--mono);
  font-size: .72rem;
  font-weight: 700;
  line-height: 1.16;
  text-transform: uppercase;
}

.project-cells span,
.project-cells em {
  margin-top: 3px;
  color: var(--dim);
  font-size: .76rem;
  font-style: normal;
  line-height: 1.25;
}

.projects-watermark {
  position: absolute;
  right: var(--edge);
  top: -32px;
  z-index: 1;
  width: 250px;
  height: 250px;
  opacity: .24;
  object-fit: contain;
  filter: saturate(1.2) drop-shadow(0 0 20px rgba(5, 136, 232, .3));
}

.work-copy {
  display: grid;
  grid-template-columns: 66px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  padding: 0 30px;
  border-right: 1px solid rgba(120, 164, 200, .22);
}

.work-strip .button {
  align-self: center;
  min-height: 44px;
  margin: 0 28px;
  white-space: nowrap;
}

.work-strip address {
  display: grid;
  align-content: center;
  gap: 6px;
  margin: 0;
  padding-left: 28px;
  border-left: 1px solid rgba(120, 164, 200, .22);
  color: var(--muted);
  font-style: normal;
  font-size: .88rem;
}

.work-strip address a {
  color: #e9eef7;
  text-decoration: none;
}

.spotify-lower-third,
.facility.section-grid,
.equipment,
.closing-cta {
  max-width: calc(var(--max) + var(--edge) * 2);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--edge);
  padding-right: var(--edge);
}

.spotify-lower-third {
  margin-top: 52px;
  margin-bottom: 16px;
}

.secondary-cta {
  display: none;
}

.site-footer {
  max-width: none;
  padding-left: var(--edge);
  padding-right: var(--edge);
}

@media (max-width: 1180px) {
  .site-nav {
    gap: 16px;
  }

  .site-nav .header-book {
    min-width: 136px;
    padding: 0 16px;
  }

  .room-strip,
  .services-strip,
  .projects-strip,
  .work-strip {
    grid-template-columns: 1fr;
    height: auto;
    min-height: 0;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .band-label,
  .signal-item,
  .project-intro,
  .work-copy,
  .work-strip address {
    border-right: 0;
    border-left: 0;
    padding: 16px 0;
  }

  .signal-item,
  .work-copy {
    border-top: 1px solid rgba(120, 164, 200, .15);
  }

  .scope-panel {
    min-height: 118px;
    padding: 0;
    border-top: 1px solid rgba(120, 164, 200, .15);
  }

  .project-intro {
    border-top: 1px solid rgba(120, 164, 200, .15);
  }

  .project-cells {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-right: 0;
    padding-top: 62px;
  }

  .projects-watermark {
    right: 0;
    top: auto;
    bottom: -38px;
    width: 190px;
    height: 190px;
    opacity: .16;
  }

  .work-strip .button {
    justify-self: start;
    margin: 8px 0 12px;
  }
}

@media (max-width: 760px) {
  html {
    scroll-padding-top: 86px;
  }

  .site-header {
    min-height: 74px;
  }

  .site-nav .header-book {
    width: 100%;
    justify-content: flex-start;
    margin-left: 0;
  }

  .hero.section-grid {
    grid-template-columns: 1fr;
    height: auto;
    min-height: 0;
    padding: 34px var(--edge) 0;
  }

  .hero::before {
    width: 100%;
    opacity: .22;
  }

  .hero::after {
    left: var(--edge);
    right: var(--edge);
    top: 282px;
    opacity: .42;
  }

  .hero-copy {
    min-height: 300px;
    padding: 0 0 28px 52px;
  }

  .hero-copy::before {
    content: "+12\A +6\A 0\A -6\A -12\A -18\A -24\A -30\A -36\A -42";
    left: 0;
    top: 6px;
    font-size: .66rem;
    line-height: 2.05;
  }

  .hero-copy h1 {
    font-size: clamp(4.1rem, 18vw, 5.2rem);
  }

  .hero-copy .tagline {
    font-size: 1.6rem;
  }

  .hero-service-row {
    flex-wrap: wrap;
    gap: 0;
  }

  .hero-service-row span {
    width: 33.333%;
    min-height: 58px;
    padding: 0 10px;
    gap: 8px;
    font-size: .78rem;
  }

  .hero-service-row svg {
    width: 32px;
  }

  .hero-stage {
    height: 285px;
    margin: 0 calc(-1 * var(--edge));
  }

  .direction-band {
    padding-left: var(--edge);
    padding-right: var(--edge);
  }

  .band-label h2 {
    font-size: 1.2rem;
  }

  .signal-item,
  .work-copy {
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 14px;
  }

  .signal-icon svg {
    width: 46px;
    height: 46px;
  }

  .project-cells {
    grid-template-columns: 1fr;
  }

  .project-cells article {
    padding: 14px 0;
    border-right: 0;
    border-top: 1px solid rgba(120, 164, 200, .15);
  }

  .work-strip address {
    padding-left: 0;
  }
}

/* Locked composition overrides: these rules preserve the approved oscilloscope-band layout across later content edits. */
.hero-copy::before {
  left: calc(var(--edge) + 2px);
  top: 22px;
  font-size: .66rem;
  line-height: 1.96;
}

.room-strip {
  min-height: 132px;
}

.services-strip {
  min-height: 118px;
}

.room-strip .signal-item {
  grid-template-columns: minmax(0, 1fr);
  padding: 0 clamp(18px, 2.1vw, 28px);
}

.room-strip .signal-icon {
  display: none;
}

.services-strip .signal-item {
  padding-top: 0;
  padding-bottom: 0;
}

.signal-item h3,
.project-intro h3,
.work-copy h3 {
  margin-bottom: 5px;
}

.signal-item p,
.project-intro p,
.work-copy p {
  font-size: .86rem;
  line-height: 1.38;
}

.room-strip .signal-item:nth-of-type(3),
.services-strip .signal-item:last-child {
  border-right: 0;
}

.scope-panel {
  min-height: 118px;
  padding: 0;
  background:
    radial-gradient(ellipse at 42% 52%, rgba(5, 136, 232, .08), transparent 54%),
    linear-gradient(90deg, rgba(5, 136, 232, .035), transparent 52%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 10%, #000 92%, transparent 100%);
}

.scope-panel svg {
  display: none;
}

.live-scope-canvas {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 92px;
}

.hero-scope.live-scope-canvas {
  width: calc(100% - (var(--edge) + 102px));
  height: 112px;
  min-height: 0;
}

.projects-strip {
  height: auto;
  min-height: 178px;
}

.project-intro {
  padding: 0 24px;
}

.project-intro p {
  max-width: 310px;
}

.project-intro .button {
  min-height: 31px;
  margin-top: 9px;
  padding: 0 22px;
}

.project-cells {
  align-self: stretch;
  align-items: center;
  padding: 38px 0 16px;
  margin-right: 106px;
}

.project-cells article {
  padding: 0 16px;
}

.project-cells strong {
  font-size: .7rem;
}

.project-cells span,
.project-cells em {
  font-size: .74rem;
}

.projects-watermark {
  right: 38px;
  top: -12px;
  width: 206px;
  height: 206px;
  opacity: .19;
}

.work-strip {
  min-height: 82px;
}

.work-strip .button {
  min-height: 40px;
}

.work-strip address {
  border-left: 0;
  padding-left: 10px;
}

.equipment::after {
  content: none;
}

.signal-runway {
  position: relative;
  max-width: calc(var(--max) + var(--edge) * 2);
  height: clamp(130px, 14vw, 200px);
  margin: 0 auto;
  overflow: hidden;
  border-top: 1px solid rgba(120, 164, 200, .12);
  border-bottom: 1px solid rgba(120, 164, 200, .12);
  background:
    radial-gradient(ellipse at 64% 50%, rgba(5, 136, 232, .1), transparent 52%),
    linear-gradient(180deg, rgba(0, 0, 0, .98), rgba(2, 4, 6, .9));
  isolation: isolate;
}

.signal-runway .live-scope-canvas {
  position: absolute;
  inset: 0;
  z-index: 2;
  opacity: .92;
}

.signal-runway::before,
.signal-runway::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: .22;
  background-image:
    radial-gradient(circle, rgba(214, 147, 70, .58) 0 1px, transparent 1.8px),
    radial-gradient(circle, rgba(5, 136, 232, .42) 0 1px, transparent 1.7px),
    radial-gradient(circle, rgba(255, 255, 255, .22) 0 1px, transparent 1.5px);
  background-size: 170px 110px, 230px 140px, 310px 180px;
  background-position: 22px 36px, 120px 72px, 260px 28px;
  animation: ember-drift 24s linear infinite;
  mask-image: linear-gradient(90deg, transparent 0%, #000 14%, #000 78%, transparent 100%);
}

.signal-runway::after {
  opacity: .14;
  animation-duration: 38s;
  animation-direction: reverse;
  transform: translateX(90px);
}

.spotify-embeds {
  overflow: hidden;
}

.spotify-embeds iframe {
  width: calc(100% + 16px);
  height: 183px;
  margin: -8px -8px -31px;
  clip-path: inset(9px 8px 35px);
  background: #000;
}

.intake-main {
  max-width: calc(var(--max) + var(--edge) * 2);
  padding: 0 var(--edge) 70px;
}

.intake-hero {
  position: relative;
  max-width: 980px;
  padding: clamp(64px, 9vw, 110px) 0 clamp(36px, 6vw, 68px);
}

.eyebrow {
  margin: 0 0 12px;
  color: var(--blue);
  font-family: var(--mono);
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.intake-hero h1 {
  margin-bottom: 22px;
  font-family: var(--hero-display);
  font-size: clamp(4.4rem, 9vw, 8.2rem);
  line-height: .82;
  text-transform: uppercase;
}

.intake-hero p:not(.eyebrow) {
  max-width: 780px;
  color: var(--muted);
  font-size: clamp(1.05rem, 1.5vw, 1.28rem);
}

.client-form {
  display: grid;
  gap: 26px;
}

.form-section {
  display: grid;
  grid-template-columns: minmax(240px, .55fr) minmax(0, 1fr);
  gap: clamp(28px, 5vw, 72px);
  padding: clamp(26px, 4vw, 46px);
  border: 1px solid rgba(5, 136, 232, .2);
  background:
    linear-gradient(90deg, rgba(5, 136, 232, .06), rgba(0, 0, 0, .2)),
    rgba(3, 5, 7, .84);
}

.form-section h2 {
  margin-bottom: 12px;
  font-size: clamp(2rem, 4vw, 4rem);
  line-height: .9;
}

.form-section-copy p:not(.eyebrow) {
  color: var(--muted);
}

.form-fields {
  display: grid;
  gap: 13px;
  min-width: 0;
}

.form-honeypot {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.form-fields label,
.form-fields legend {
  color: #e9eef7;
  font-family: var(--mono);
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.form-fields input[type="text"],
.form-fields textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid rgba(120, 164, 200, .22);
  border-radius: 0;
  background: rgba(0, 0, 0, .5);
  color: var(--text);
  font: inherit;
  line-height: 1.45;
}

.form-fields input[type="text"] {
  min-height: 44px;
  padding: 0 13px;
}

.form-fields textarea {
  padding: 12px 13px;
  resize: vertical;
}

.form-fields fieldset {
  display: grid;
  gap: 9px;
  margin: 8px 0 0;
  padding: 16px;
  border: 1px solid rgba(5, 136, 232, .18);
}

.check-row {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  color: var(--muted);
  font-family: var(--font);
  font-size: .95rem;
  font-weight: 500;
  text-transform: none;
}

.check-row input {
  margin-top: 3px;
  accent-color: var(--blue);
}

.check-row span {
  color: var(--muted);
}

.form-submit-row {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
  justify-content: flex-end;
  padding: 10px 0 0;
}

.form-submit-row p {
  flex: 1 1 320px;
  margin: 0;
  color: var(--dim);
  font-size: .92rem;
}

.wp-content-main {
  min-height: 62vh;
}

.wp-content-panel {
  align-items: start;
}

.entry-content {
  color: var(--muted);
  font-size: 1rem;
}

.entry-content > * {
  max-width: 760px;
}

.entry-content a {
  color: var(--blue);
}

.entry-content img,
.entry-content figure {
  max-width: 100%;
  height: auto;
}

.entry-content ul,
.entry-content ol {
  padding-left: 1.3rem;
}

.entry-content blockquote {
  margin: 1.4rem 0;
  padding-left: 1rem;
  border-left: 2px solid var(--blue);
  color: #dce6f4;
}

.gear-card-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: var(--gutter);
  background:
    radial-gradient(ellipse at 52% 48%, rgba(5, 136, 232, .14), transparent 46%),
    rgba(0, 0, 0, .74);
  opacity: 0;
  pointer-events: none;
  backdrop-filter: blur(3px);
  transition: opacity .22s ease;
}

.gear-card-backdrop[hidden] {
  display: none;
}

.gear-card-backdrop.is-visible {
  opacity: 1;
  pointer-events: auto;
}

.gear-info-card {
  position: relative;
  width: min(720px, 100%);
  overflow: hidden;
  padding: clamp(28px, 5vw, 52px);
  border: 1px solid rgba(5, 136, 232, .56);
  background:
    linear-gradient(rgba(5, 136, 232, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(5, 136, 232, .07) 1px, transparent 1px),
    radial-gradient(ellipse at 24% 16%, rgba(5, 136, 232, .2), transparent 38%),
    linear-gradient(180deg, rgba(5, 8, 12, .97), rgba(0, 0, 0, .98));
  background-size: 34px 34px, 34px 34px, auto, auto;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, .02) inset,
    0 0 58px rgba(5, 136, 232, .22),
    0 34px 120px rgba(0, 0, 0, .72);
  transform: translateY(14px) scale(.985);
  filter: blur(5px);
  transition: transform .24s ease, filter .24s ease;
}

.gear-card-backdrop.is-visible .gear-info-card {
  transform: translateY(0) scale(1);
  filter: blur(0);
}

.gear-info-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .34;
  background:
    linear-gradient(90deg, transparent, rgba(5, 136, 232, .38), transparent),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 120' preserveAspectRatio='none'%3E%3Cpath d='M0 62 C58 62 86 58 128 62 C170 66 196 66 232 62 C272 58 302 51 346 62 C390 73 426 70 468 62 C512 54 548 56 588 62 C632 69 662 68 706 62 C748 56 778 60 800 62' fill='none' stroke='%230588e8' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 120% 100%, 100% 46%;
  background-position: -140% 0, center 72%;
  animation: gear-card-scan 3.8s ease-out .08s 1 both;
  mix-blend-mode: screen;
}

.gear-info-card::after {
  content: "";
  position: absolute;
  inset: 14px;
  pointer-events: none;
  border: 1px solid rgba(5, 136, 232, .2);
}

.gear-info-card h2 {
  position: relative;
  z-index: 2;
  max-width: 9em;
  margin-bottom: 16px;
  font-size: clamp(2.3rem, 5vw, 5.3rem);
}

.gear-info-card p:not(.eyebrow) {
  position: relative;
  z-index: 2;
  max-width: 54rem;
  color: var(--muted);
  font-size: clamp(1rem, 1.4vw, 1.18rem);
}

.gear-info-card .text-link {
  position: relative;
  z-index: 2;
  margin-top: 18px;
}

.gear-card-close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 4;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(5, 136, 232, .48);
  border-radius: 0;
  background: rgba(0, 0, 0, .66);
  color: var(--blue);
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
}

.gear-card-meter {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
  max-width: 420px;
  height: 48px;
  margin: 28px 0 0;
}

.gear-card-meter span {
  display: block;
  background:
    repeating-linear-gradient(90deg, rgba(5, 136, 232, .72) 0 2px, transparent 2px 12px),
    linear-gradient(90deg, rgba(5, 136, 232, .12), rgba(200, 145, 65, .18), transparent);
  opacity: .62;
  transform-origin: left center;
  animation: gear-meter-breathe 2.8s ease-in-out infinite;
}

.gear-card-meter span:nth-child(2) {
  animation-delay: .22s;
}

.gear-card-meter span:nth-child(3) {
  animation-delay: .44s;
}

.gear-card-meter span:nth-child(4) {
  animation-delay: .66s;
}

@keyframes ember-drift {
  from {
    background-position: 220px 36px, 310px 72px, 460px 28px;
  }
  to {
    background-position: -160px 36px, -70px 72px, 80px 28px;
  }
}

@keyframes gear-card-scan {
  from {
    background-position: -140% 0, center 72%;
  }
  to {
    background-position: 160% 0, center 72%;
  }
}

@keyframes gear-meter-breathe {
  0%,
  100% {
    transform: scaleX(.72);
    opacity: .36;
  }
  50% {
    transform: scaleX(1);
    opacity: .78;
  }
}

@media (max-width: 1180px) {
  .room-strip,
  .services-strip,
  .projects-strip,
  .work-strip {
    height: auto;
  }

  .project-cells {
    padding-top: 62px;
    margin-right: 0;
  }

  .projects-watermark {
    width: 170px;
    height: 170px;
  }
}

@media (max-width: 760px) {
  .hero-copy::before {
    left: 0;
    top: 12px;
    font-size: .62rem;
    line-height: 1.82;
  }

  .hero::after {
    inset: 0;
    opacity: .18;
  }

  .hero-scope {
    left: var(--edge);
    right: var(--edge);
    top: 94px;
    height: 116px;
    opacity: .68;
    mask-image: linear-gradient(90deg, transparent 0%, #000 14%, #000 86%, transparent 100%);
  }

  .hero-scope.live-scope-canvas {
    width: calc(100% - (var(--edge) * 2));
    height: 116px;
    min-height: 0;
  }

  .scope-panel {
    min-height: 104px;
  }

  .project-cells {
    padding-top: 58px;
  }

  .intake-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .form-section {
    grid-template-columns: 1fr;
    padding: 24px;
  }

  .intake-hero h1 {
    font-size: clamp(3.6rem, 18vw, 5.8rem);
  }

  .form-submit-row {
    justify-content: flex-start;
  }

  .gear-info-card {
    padding: 28px;
  }

  .site-footer .design-credit {
    margin-left: 56px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    scroll-behavior: auto !important;
    transition: none !important;
  }

  .gear-info-card {
    filter: none;
    transform: none;
  }
}