/* Homepage hero: quiet landscape over the shared ivory page. */
.company-home { --paper: #f8f6ef; background: var(--paper); }
.company-home .site-header, .company-home .site-footer { background: var(--paper); }
.company-home .company-landing-hero {
  position: relative;
  isolation: isolate;
  background: var(--paper);
  min-height: clamp(540px, 43vw, 680px);
  padding: 54px 0 80px;
  display: flex;
  align-items: center;
  text-align: left;
  overflow: hidden;
}
.company-hero-copy { position: relative; z-index: 1; width: 54%; }
.company-landing-hero .company-hero-copy h1 {
  color: var(--forest);
  font-family: var(--sans);
  font-size: clamp(3.8rem, 6.5vw, 6.5rem);
  font-weight: 600;
  letter-spacing: -.065em;
  line-height: 1.02;
}
.company-hero-copy > p { margin: 28px 0 32px; color: var(--moss); font-size: clamp(1.1rem, 1.7vw, 1.4rem); }
.company-hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 22px 28px; }
.company-hero-about { font-size: .88rem; text-decoration: underline; text-underline-offset: 6px; }
.company-hero-about:hover { color: var(--moss); }
.company-hero-art { position: absolute; z-index: -1; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; mix-blend-mode: multiply; opacity: .72;
  /* Landscape fades into the same ivory as the surrounding sections. */
  -webkit-mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent), linear-gradient(to bottom, transparent, #000 5%, #000 82%, transparent);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent), linear-gradient(to bottom, transparent, #000 5%, #000 82%, transparent);
  mask-composite: intersect;
}
.company-home .company-product { border: 0; border-radius: 0; background: transparent; padding-inline: 0; }
.company-home .site-footer { border-top: 0; }
.company-home .company-products { border-top: 0; background: var(--paper); padding-top: 32px; scroll-margin-top: 110px; }
@media (max-width: 700px) {
  .company-home .company-landing-hero { display: flex; min-height: 430px; padding: 38px 0 64px; }
  .company-hero-copy { width: 100%; }
  .company-landing-hero .company-hero-copy h1 { font-size: clamp(3.2rem, 10vw, 4.8rem); max-width: 500px; }
  .company-hero-copy h1 br:last-of-type { display: none; }
  .company-hero-copy > p { margin-block: 22px 26px; }
  .company-hero-art { position: absolute; inset: 0; width: 100%; max-width: 100%; margin: 0; height: 100%; object-fit: cover; object-position: 65% center; opacity: .25; }
  .company-hero-actions { gap: 20px; }
}
