/* Desktop composition layer. The shared brand system stays in style.css. */
@media (min-width: 901px) {
  :root {
    --desktop-gutter: clamp(28px, 4vw, 64px);
  }

  .header-inner {
    min-height: 78px;
  }

  .hero-content {
    min-height: 670px;
    grid-template-columns: minmax(0, 0.94fr) minmax(520px, 1.06fr);
    gap: clamp(58px, 6vw, 96px);
  }

  .hero h1 {
    max-width: 690px;
    font-size: clamp(58px, 5vw, 76px);
    line-height: 1.08;
  }

  .hero-media-stage {
    aspect-ratio: 16 / 11;
  }

  .page-hero-inner,
  .business-hero-inner {
    min-height: 620px;
  }

  .page-hero-copy,
  .business-hero-inner > div:first-child {
    min-width: 0;
  }

  .page-hero-copy h1,
  .business-hero h1,
  .contact-page-hero h1 {
    text-wrap: balance;
  }

  .page-hero-about .page-hero-inner {
    grid-template-columns: minmax(0, 1.3fr) minmax(300px, 0.7fr);
    gap: 72px;
  }

  .page-hero-about .page-hero-copy h1 {
    max-width: 760px;
    font-size: clamp(54px, 4.6vw, 66px);
  }

  .contact-page-hero .container {
    max-width: 1100px;
  }

  .capability-directory-stage,
  .product-explorer-stage,
  .spotlight-detail-panel,
  .scene-stage {
    box-shadow: 0 34px 80px rgba(7, 29, 52, 0.15);
  }

  .product-catalog-grid > a,
  .service-ecosystem-grid > a {
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
  }

  .product-catalog-grid > a:hover,
  .service-ecosystem-grid > a:hover {
    border-color: rgba(30, 99, 255, 0.26);
  }
}