
:root {
  --blue: #0583c7;
  --blue-bright: #14a7ef;
  --ink: #070a0c;
  --charcoal: #10151a;
  --slate: #59616a;
  --mist: #eef2f4;
  --white: #ffffff;
  --max: 1220px;
  --radius: 3px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, Arial, Helvetica, sans-serif;
  color: var(--ink);
  background: var(--white);
  line-height: 1.6;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; left:1rem; top:-5rem; z-index:999; background:#fff; padding:.75rem 1rem; }
.skip-link:focus { top:1rem; }

.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 50;
  transition: background .25s, box-shadow .25s;
}
.site-header.scrolled { background: rgba(4,7,9,.94); backdrop-filter: blur(14px); box-shadow: 0 1px 0 rgba(255,255,255,.08); }
.nav-shell {
  width: min(var(--max), calc(100% - 3rem));
  height: 92px;
  margin: auto;
  display:flex; align-items:center; justify-content:space-between;
}
.brand img { width: 250px; max-height: 62px; object-fit: contain; object-position:left center; }
.site-nav { display:flex; align-items:center; gap:2rem; color:#fff; font-size:.9rem; font-weight:700; letter-spacing:.04em; }
.site-nav a { text-decoration:none; }
.site-nav a:not(.nav-cta):hover { color:var(--blue-bright); }
.nav-cta { border:1px solid rgba(255,255,255,.55); padding:.72rem 1rem; }
.nav-cta:hover { background:#fff; color:#000; }
.menu-button { display:none; background:none; border:0; padding:.5rem; }
.menu-button span:not(.sr-only) { display:block; width:25px; height:2px; margin:5px; background:#fff; }

.hero {
  position:relative;
  min-height: 790px;
  height: 100svh;
  display:flex;
  align-items:center;
  color:#fff;
  overflow:hidden;
}
.hero-media {
  position:absolute; inset:0;
  background-image:url("assets/shadowfax-audio-image-8.webp");
  background-position:center 35%;
  background-size:cover;
  transform:scale(1.02);
}
.hero-overlay {
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(1,5,8,.9) 0%, rgba(1,5,8,.57) 54%, rgba(1,5,8,.15) 100%),
    linear-gradient(0deg, rgba(1,5,8,.58), transparent 45%);
}
.hero-content {
  width:min(var(--max), calc(100% - 3rem));
  margin:80px auto 0;
  position:relative;
}
.eyebrow {
  margin:0 0 1rem;
  color:#8bd5ff;
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.19em;
  font-weight:800;
}
.eyebrow.dark { color:#087eb9; }
.hero h1, .section h2, .equipment-copy h2, .cta-copy h2 {
  font-family: Arial, Helvetica, sans-serif;
  letter-spacing:-.045em;
  line-height:.98;
  margin:0;
}
.hero h1 { font-size:clamp(3.4rem, 7.4vw, 7.4rem); max-width:980px; }
.hero h1 span { color:transparent; -webkit-text-stroke: 1px rgba(255,255,255,.8); }
.hero-copy { max-width:680px; margin:2rem 0 0; font-size:clamp(1rem, 1.5vw, 1.25rem); color:#d9e1e7; }
.hero-actions { display:flex; gap:1rem; margin-top:2.2rem; flex-wrap:wrap; }
.button {
  display:inline-flex; justify-content:center; align-items:center;
  min-height:50px; padding:.8rem 1.35rem;
  text-decoration:none; text-transform:uppercase;
  letter-spacing:.1em; font-size:.76rem; font-weight:800;
  border:1px solid transparent; cursor:pointer;
}
.button.primary { background:var(--blue); color:#fff; }
.button.primary:hover { background:#0799e6; }
.button.secondary { border-color:rgba(255,255,255,.65); color:#fff; }
.button.secondary:hover { background:#fff; color:#000; }
.service-area { margin-top:3rem; font-size:.76rem; text-transform:uppercase; letter-spacing:.16em; color:#b7c4cc; }
.scroll-cue { position:absolute; bottom:1.8rem; left:50%; text-decoration:none; color:#fff; font-size:1.6rem; animation:bob 1.8s infinite; }
@keyframes bob { 50% { transform:translateY(7px); } }

.section { padding:110px max(1.5rem, calc((100% - var(--max)) / 2)); }
.section-heading h2, .about-copy h2 { font-size:clamp(2.4rem, 4.6vw, 4.8rem); }
.section-heading.split { display:grid; grid-template-columns:1.35fr .85fr; gap:5rem; align-items:end; }
.section-heading.split > div:last-child, .section-heading.split > p { font-size:1.05rem; color:#4d565d; }
.text-link { display:inline-block; margin-top:1rem; font-weight:800; text-decoration:none; color:#087eb9; }
.text-link span { margin-left:.4rem; }
.section-heading.centered { text-align:center; max-width:850px; margin:0 auto 3.5rem; }
.section-heading.centered > p:last-child { max-width:680px; margin:1.4rem auto 0; color:#5c646a; }

.services { background:var(--mist); }
.service-grid { max-width:var(--max); margin:auto; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid #cbd3d8; border-bottom:1px solid #cbd3d8; }
.service-card { padding:2.5rem 1.8rem 2.8rem; border-right:1px solid #cbd3d8; transition:background .2s, transform .2s; }
.service-card:first-child { border-left:1px solid #cbd3d8; }
.service-card:hover { background:#fff; transform:translateY(-5px); }
.service-number { color:#0782c1; font-size:.72rem; letter-spacing:.15em; font-weight:800; }
.service-card h3 { font-size:1.4rem; line-height:1.15; margin:2.5rem 0 1rem; }
.service-card p { color:#5a6268; font-size:.94rem; }

.dark-section { background:#070a0c; color:#fff; }
.section-heading.light > p, .section-heading.light > div:last-child { color:#b6c0c7; }
.about { max-width:none; display:grid; grid-template-columns:1fr 1fr; gap:clamp(3rem,7vw,8rem); align-items:center; }
.about-image img { width:100%; min-height:650px; object-fit:cover; }
.about-copy { padding-right:max(1.5rem, calc((100vw - var(--max)) / 2)); }
.about-copy > p:not(.eyebrow) { color:#535c62; font-size:1.03rem; }
.about-points { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:2.5rem; padding-top:2rem; border-top:1px solid #cfd5d8; }
.about-points strong, .about-points span { display:block; }
.about-points strong { font-size:1.15rem; }
.about-points span { color:#687076; font-size:.8rem; line-height:1.35; margin-top:.3rem; }

.equipment-banner { position:relative; min-height:560px; display:flex; align-items:center; color:#fff; overflow:hidden; }
.equipment-banner::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(4,8,11,.92), rgba(4,8,11,.48) 65%, rgba(4,8,11,.1)); }
.equipment-banner > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.equipment-copy { position:relative; z-index:2; width:min(var(--max), calc(100% - 3rem)); margin:auto; }
.equipment-copy h2 { font-size:clamp(2.7rem,5vw,5rem); max-width:760px; }
.equipment-copy p:last-child { max-width:620px; color:#d5dde2; font-size:1.05rem; }

.logo-cloud { max-width:var(--max); margin:auto; display:grid; grid-template-columns:repeat(6,1fr); gap:1.1rem; align-items:stretch; }
.logo-cloud div { min-height:140px; padding:1.5rem; border:1px solid #e0e5e8; display:flex; align-items:center; justify-content:center; background:#fff; }
.logo-cloud img { max-height:80px; max-width:150px; object-fit:contain; filter:grayscale(1); opacity:.76; transition:.2s; }
.logo-cloud div:hover img { filter:none; opacity:1; }
.client-note { text-align:center; color:#778087; font-size:.75rem; margin-top:1.5rem; }

.cta-section { background:#0b1115; color:#fff; padding:100px max(1.5rem, calc((100% - var(--max)) / 2)); display:grid; grid-template-columns:.85fr 1.15fr; gap:7rem; }
.cta-copy h2 { font-size:clamp(3rem,5vw,5rem); }
.cta-copy > p:not(.eyebrow) { color:#aebac2; max-width:520px; }
.contact-direct { margin-top:2rem; display:flex; flex-direction:column; gap:.4rem; }
.contact-direct a { color:#fff; font-size:1.05rem; text-decoration:none; font-weight:700; }
.quote-form { background:#fff; color:#10151a; padding:2rem; }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.quote-form label { display:block; font-size:.76rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; margin-bottom:1rem; }
.quote-form input, .quote-form textarea { width:100%; border:0; border-bottom:1px solid #bfc7cc; font:inherit; padding:.75rem 0; outline:none; background:#fff; border-radius:0; }
.quote-form input:focus, .quote-form textarea:focus { border-bottom-color:var(--blue); }
.quote-form textarea { resize:vertical; }
.form-note { color:#6e777d; font-size:.72rem; margin-bottom:0; }

.site-footer { background:#030506; color:#dce3e8; padding:65px max(1.5rem, calc((100% - var(--max)) / 2)) 25px; display:grid; grid-template-columns:1.4fr .65fr .8fr; gap:4rem; }
.footer-brand img { width:260px; }
.footer-brand p { color:#89959c; max-width:400px; font-size:.9rem; }
.footer-links, .footer-location { display:flex; flex-direction:column; gap:.55rem; }
.footer-links a { text-decoration:none; }
.footer-location span { color:#89959c; font-size:.88rem; }
.footer-bottom { grid-column:1/-1; border-top:1px solid #252b2f; padding-top:1.3rem; display:flex; justify-content:space-between; color:#68737a; font-size:.74rem; }

@media (max-width: 950px) {
  .nav-shell { height:76px; }
  .brand img { width:205px; }
  .menu-button { display:block; }
  .site-nav { position:absolute; left:0; right:0; top:76px; background:#070a0c; display:none; padding:1.5rem; flex-direction:column; align-items:stretch; gap:1rem; }
  .site-nav.open { display:flex; }
  .nav-cta { text-align:center; }
  .section-heading.split { grid-template-columns:1fr; gap:2rem; }
  .service-grid { grid-template-columns:1fr 1fr; }
  .service-card:nth-child(3) { border-left:1px solid #cbd3d8; }
  .about { grid-template-columns:1fr; }
  .about-copy { padding:0 1.5rem 1rem; }
  .about-image img { min-height:500px; }
  .logo-cloud { grid-template-columns:repeat(3,1fr); }
  .cta-section { grid-template-columns:1fr; gap:3rem; }
}
@media (max-width: 600px) {
  .nav-shell, .hero-content, .equipment-copy { width:calc(100% - 2rem); }
  .hero { min-height:700px; }
  .hero h1 { font-size:3.4rem; }
  .hero-actions .button { width:100%; }
  .section { padding:78px 1rem; }
  .section-heading h2, .about-copy h2 { font-size:2.75rem; }
  .service-grid { grid-template-columns:1fr; }
  .service-card, .service-card:nth-child(3) { border-left:1px solid #cbd3d8; }
.about-image img { min-height:420px; }
  .about-points { grid-template-columns:1fr; }
  .logo-cloud { grid-template-columns:1fr 1fr; }
  .logo-cloud div { min-height:120px; }
  .cta-section { padding:78px 1rem; }
  .field-row { grid-template-columns:1fr; gap:0; }
  .quote-form { padding:1.3rem; }
  .site-footer { grid-template-columns:1fr; gap:2rem; }
  .footer-bottom { flex-direction:column; gap:.5rem; }
}

.honeypot {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  margin: -1px !important;
  padding: 0 !important;
  border: 0 !important;
}


.about {
  background:#fff;
}
.about-heading {
  max-width:var(--max);
  margin:0 auto 3.5rem;
  display:grid;
  grid-template-columns:.7fr 1.3fr;
  gap:3rem;
  align-items:end;
}
.about-heading h2 {
  font-size:clamp(2.8rem,5vw,5.2rem);
  margin:0;
  line-height:.98;
  letter-spacing:-.045em;
}
.about-layout {
  max-width:var(--max);
  margin:0 auto;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:clamp(2.5rem,5vw,5rem);
  align-items:stretch;
}
.about-image-wrap {
  min-height:520px;
  overflow:hidden;
  background:#0c1115;
}
.about-image-wrap img {
  width:100%;
  height:100%;
  min-height:520px;
  object-fit:cover;
  object-position:center;
}
.about-copy {
  display:flex;
  flex-direction:column;
  justify-content:center;
  max-width:none;
  padding:0;
}
.about-copy > p {
  margin:0 0 1.2rem;
  color:#535c62;
  font-size:1.04rem;
}
.about-expect {
  margin-top:1rem;
  padding-top:1.7rem;
  border-top:1px solid #d9dfe3;
}
.about-expect h3 {
  margin:0 0 1rem;
  font-size:1.25rem;
}
.about-expect ul {
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.9rem 1.4rem;
}
.about-expect li {
  position:relative;
  padding-left:1.35rem;
  color:#4e575d;
  font-size:.9rem;
  line-height:1.45;
}
.about-expect li::before {
  content:"";
  position:absolute;
  left:0;
  top:.48rem;
  width:7px;
  height:7px;
  background:var(--blue);
}
.about-quote {
  max-width:var(--max);
  margin:3.5rem auto 0;
  padding:2rem 0 0;
  border-top:1px solid #d9dfe3;
  font-size:clamp(1.5rem,2.6vw,2.4rem);
  line-height:1.22;
  letter-spacing:-.025em;
  font-weight:700;
  color:#10151a;
}
@media (max-width: 950px) {
  .about-heading {
    grid-template-columns:1fr;
    gap:1rem;
  }
  .about-layout {
    grid-template-columns:1fr;
  }
  .about-image-wrap,
  .about-image-wrap img {
    min-height:460px;
  }
}
@media (max-width: 600px) {
  .about-heading {
    margin-bottom:2rem;
  }
  .about-heading h2 {
    font-size:2.8rem;
  }
  .about-image-wrap,
  .about-image-wrap img {
    min-height:340px;
  }
  .about-expect ul {
    grid-template-columns:1fr;
  }
  .about-quote {
    margin-top:2.5rem;
    font-size:1.55rem;
  }
}


/* About section v1.7 — centered, symmetrical composition */
.about.section {
  display:block;
  padding:110px max(1.5rem, calc((100% - var(--max)) / 2));
  background:#fff;
}
.about-inner {
  max-width:var(--max);
  margin:0 auto;
}
.about-heading.centered {
  display:block;
  max-width:900px;
  margin:0 auto 3.25rem;
  text-align:center;
}
.about-heading.centered h2 {
  margin:0;
  font-size:clamp(2.8rem,5vw,5rem);
  line-height:.98;
  letter-spacing:-.045em;
}
.about-photo {
  width:100%;
  height:clamp(360px,46vw,560px);
  overflow:hidden;
  background:#0c1115;
}
.about-photo img {
  width:100%;
  height:100%;
  min-height:0;
  object-fit:cover;
  object-position:center 42%;
}
.about-content-grid {
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:clamp(2.5rem,5vw,5rem);
  align-items:start;
  margin-top:3rem;
}
.about-story p {
  margin:0 0 1.15rem;
  color:#535c62;
  font-size:1.04rem;
  line-height:1.72;
}
.about-expect {
  margin:0;
  padding:0 0 0 2.5rem;
  border-top:0;
  border-left:1px solid #d9dfe3;
}
.about-expect h3 {
  margin:0 0 1.1rem;
  font-size:1.25rem;
}
.about-expect ul {
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  grid-template-columns:1fr;
  gap:.9rem;
}
.about-expect li {
  position:relative;
  padding-left:1.35rem;
  color:#4e575d;
  font-size:.93rem;
  line-height:1.5;
}
.about-expect li::before {
  content:"";
  position:absolute;
  left:0;
  top:.52rem;
  width:7px;
  height:7px;
  background:var(--blue);
}
.about-quote {
  max-width:950px;
  margin:3.5rem auto 0;
  padding:2.25rem 0 0;
  border-top:1px solid #d9dfe3;
  text-align:center;
  font-size:clamp(1.45rem,2.4vw,2.25rem);
  line-height:1.28;
  letter-spacing:-.02em;
  font-weight:700;
  color:#10151a;
}
@media (max-width: 800px) {
  .about.section {
    padding:82px 1rem;
  }
  .about-heading.centered {
    margin-bottom:2rem;
  }
  .about-content-grid {
    grid-template-columns:1fr;
    gap:2rem;
    margin-top:2rem;
  }
  .about-expect {
    padding:2rem 0 0;
    border-left:0;
    border-top:1px solid #d9dfe3;
  }
  .about-photo {
    height:360px;
  }
}
@media (max-width: 520px) {
  .about-heading.centered h2 {
    font-size:2.75rem;
  }
  .about-photo {
    height:290px;
  }
  .about-quote {
    margin-top:2.5rem;
    font-size:1.5rem;
  }
}


.reviews-link {
  display:inline-flex;
  align-items:center;
  gap:.7rem;
  margin-top:1.5rem;
  padding:.8rem 1.1rem;
  border:1px solid #cfd7dc;
  background:#fff;
  color:#10151a;
  text-decoration:none;
  font-size:.84rem;
  font-weight:800;
  letter-spacing:.02em;
  transition:transform .2s, border-color .2s, box-shadow .2s;
}
.reviews-link:hover {
  transform:translateY(-2px);
  border-color:var(--blue);
  box-shadow:0 8px 24px rgba(0,0,0,.08);
}
.review-stars {
  color:#f4b400;
  letter-spacing:.08em;
  font-size:1rem;
}


.projects { background:#f4f6f7; }
.project-grid {
  max-width:var(--max);
  margin:4rem auto 0;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:1rem;
}
.project-card {
  min-height:340px;
  background:#0b0f12;
}
.project-card-large { grid-row:span 2; min-height:700px; }
.project-card-wide { grid-column:1 / -1; min-height:420px; }
.project-card a {
  position:relative;
  display:block;
  width:100%;
  height:100%;
  min-height:inherit;
  overflow:hidden;
  color:#fff;
  text-decoration:none;
}
.project-card img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .5s ease;
}
.project-card a::after {
  content:"";
  position:absolute;
  inset:30% 0 0;
  background:linear-gradient(transparent,rgba(0,0,0,.9));
}
.project-card:hover img { transform:scale(1.035); }
.project-card-copy {
  position:absolute;
  left:1.6rem;
  right:1.6rem;
  bottom:1.5rem;
  z-index:2;
}
.project-card-copy span {
  display:block;
  color:#8ed8ff;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:.68rem;
  font-weight:800;
}
.project-card-copy h3 {
  margin:.35rem 0 .45rem;
  font-size:clamp(1.5rem,2.5vw,2.5rem);
  line-height:1.05;
}
.project-card-copy p {
  max-width:620px;
  margin:0 0 .65rem;
  color:#d7e0e5;
}
.project-card-copy strong {
  font-size:.76rem;
  text-transform:uppercase;
  letter-spacing:.12em;
}
.project-page {
  background:#fff;
}
.project-hero {
  min-height:620px;
  position:relative;
  display:flex;
  align-items:flex-end;
  color:#fff;
  overflow:hidden;
}
.project-hero img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
.project-hero::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(0deg,rgba(0,0,0,.86),rgba(0,0,0,.12) 65%);
}
.project-hero-content {
  position:relative;
  z-index:2;
  width:min(var(--max),calc(100% - 3rem));
  margin:0 auto 4rem;
}
.project-hero h1 {
  margin:.3rem 0 0;
  font-size:clamp(3rem,7vw,6rem);
  line-height:.95;
  letter-spacing:-.045em;
}
.project-body {
  max-width:920px;
  margin:0 auto;
  padding:90px 1.5rem;
}
.project-body h2 {
  font-size:clamp(2.2rem,4vw,3.6rem);
  line-height:1;
  margin:0 0 1.5rem;
}
.project-body p {
  color:#50595f;
  font-size:1.06rem;
}
.project-facts {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;
  margin:2.5rem 0;
}
.project-facts div {
  border-top:1px solid #d7dde1;
  padding-top:1rem;
}
.project-facts strong,.project-facts span { display:block; }
.project-facts span { color:#697178; font-size:.85rem; margin-top:.25rem; }
.project-back {
  display:inline-block;
  margin-top:2rem;
  color:#087eb9;
  font-weight:800;
  text-decoration:none;
}
@media (max-width:800px){
  .project-grid { grid-template-columns:1fr; }
  .project-card-large,.project-card-wide { grid-row:auto; grid-column:auto; min-height:420px; }
  .project-facts { grid-template-columns:1fr; }
}


/* Molly Tuttle featured production crop:
   keep more of the flown sound system visible in the homepage card. */
.molly-tuttle-feature-image {
  object-position: center 18% !important;
}

/* On narrower screens, preserve the upper portion of the image as well. */
@media (max-width: 800px) {
  .molly-tuttle-feature-image {
    object-position: center 14% !important;
  }
}


.molly-tuttle-project-hero-image {
  object-position: center 16% !important;
}
