header .nav-row { border-bottom: 0; }

/* A light editorial rhythm: white for equipment and projects, a quiet
   neutral for the company and contact form, navy for the demo lab. */
main > .hero { background: linear-gradient(112deg, #fff 48%, #fafbfc 100%); }
.hero-visual img { filter: none; }
.hero-visual::before { border-color: #e1e3e9; }
.hero-visual::after { width: 29px; height: 29px; }
.hero-visual img, #catalogue .equipment:first-child img {
  mask: url("studio-edge.svg") center / contain no-repeat;
}
#catalogue, #projects, #materials { background-color: #fff; }
#catalogue .equipment {
  background-color: #fafbfc;
  border: 1px solid #89909e;
  transition: border-color 170ms ease, background-color 170ms ease;
}
#catalogue .equipment img { mix-blend-mode: multiply; }
#catalogue .equipment:nth-child(2) img, #catalogue .equipment:nth-child(3) img {
  filter: contrast(1.025);
}
#catalogue .equipment:hover, #catalogue .equipment:focus-visible {
  background-color: #f4f5f8;
  border-color: #525874;
}
#expertise {
  background-color: #f5f6f8;
  border-block-color: #aab0be;
}
#expertise .capability, #expertise .company-news, #expertise .company-news-list li {
  border-color: #c5cad4;
}
#projects .project-photo, #projects .project-photo .photo-tag,
#demo .demo-photo-frame { background: transparent; }
#projects .project-photo {
  flex-direction: column; gap: 12px; padding: 12px 16px;
}
#projects .project-photo img { min-height: 0; flex: 0 1 auto; }
#projects .project-photo .photo-tag {
  position: static; flex: none; padding: 0; width: 100%;
  text-align: center; color: #505569;
}
#contact { background-color: #f6f7f8; border-top-color: #c1c6d1; }
.hero-actions a.btn:focus-visible, .product-caption a:focus-visible {
  outline: 3px solid var(--navy); outline-offset: 4px;
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  #catalogue .equipment, .hero-actions a.btn, .product-caption a {
    transition: transform 180ms ease-out, border-color 180ms ease-out, background-color 180ms ease-out;
  }
  #catalogue .equipment:hover { transform: scale(1.015); z-index: 1; }
  .hero-actions a.btn:hover, .product-caption a:hover { transform: scale(1.025); }
}
@media (prefers-reduced-motion:reduce) {
  #catalogue .equipment, .hero-actions a.btn, .product-caption a { transition: none; transform: none; }
}

/* Shareable comparison of the company section against the demo-lab section. */
.company-dark #expertise {
  background: #323263;
  color: #fff;
}
.company-dark #expertise :is(h2,h3,.link,.company-news-title,.company-news-all,.company-news-arrow) {
  color: #fff;
}
.company-dark #expertise :is(.intro-text,.capability p,.eyebrow,time) {
  color: #d9dbea;
}
.company-dark #expertise .capability > span { color: #ff9da3; }
.company-dark #expertise :is(.capability,.company-news,.company-news-list li) {
  border-color: #626388;
}
.company-dark #expertise .company-news-link:hover { background: rgb(255 255 255 / 8%); }
.company-dark #expertise :is(.link,.company-news-all):is(:hover,:focus-visible),
.company-dark #expertise .company-news-link:is(:hover,:focus-visible) :is(.company-news-title,.company-news-arrow) {
  color: #ffb2b7;
}
.company-dark #expertise a:focus-visible { outline-color: #fff; }

#company-news-title {
  position: relative;
  padding-inline-start: 1.25em;
  font-size: clamp(21px, 2vw, 28px);
  line-height: 1.2;
  letter-spacing: -.025em;
}
#company-news-title::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: .56em;
  width: .85em;
  height: 3px;
  background: var(--red);
}
