/**
 * Bento grid, section label rules, refinements (#subnav removed from chrome)
 */

html {
  scroll-padding-top: calc(var(--nav-h) + 0.75rem);
}

/* Duplicate of `.nav--desktop` links — hidden (jump links remain in header, drawer, footer). */
#subnav {
  display: none !important;
}

/* ---------- Bento capability grid ---------- */
.features--bento {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: minmax(200px, auto) minmax(180px, auto) minmax(180px, auto);
  gap: var(--space-md);
  align-items: stretch;
}

.features--bento .feature-card-wrap:nth-child(1) {
  grid-column: 1 / 3;
  grid-row: 1 / 3;
}

.features--bento .feature-card-wrap:nth-child(2) {
  grid-column: 3;
  grid-row: 1;
}

.features--bento .feature-card-wrap:nth-child(3) {
  grid-column: 3;
  grid-row: 2;
}

.features--bento .feature-card-wrap:nth-child(4) {
  grid-column: 1;
  grid-row: 3;
}

.features--bento .feature-card-wrap:nth-child(5) {
  grid-column: 2;
  grid-row: 3;
}

.features--bento .feature-card-wrap:nth-child(6) {
  grid-column: 3;
  grid-row: 3;
}

.features--bento .feature-card-wrap:nth-child(1) .feature-card {
  min-height: 100%;
}

.features--bento .feature-card-wrap:nth-child(1) .feature-card__inner {
  padding: clamp(1.5rem, 4vw, 2.25rem);
}

.features--bento .feature-card-wrap:nth-child(1) h3 {
  font-size: clamp(1.35rem, 2.5vw, 1.65rem);
}

@media (max-width: 960px) {
  .features--bento {
    grid-template-columns: 1fr;
    grid-template-rows: none;
  }

  .features--bento .feature-card-wrap:nth-child(n) {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
  }

  .features--bento .feature-card {
    min-height: 15rem;
  }
}

/* ---------- Section label animated rule ---------- */
.section__label {
  position: relative;
}

.section__label::after {
  content: "";
  display: block;
  width: 3.25rem;
  height: 3px;
  margin-top: 0.65rem;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--accent), var(--accent-3));
  transform: scaleX(0);
  transform-origin: 0 50%;
  transition: transform 0.85s var(--ease-out-expo);
}

.section__label.is-inview::after {
  transform: scaleX(1);
}

@media (prefers-reduced-motion: reduce) {
  .section__label::after {
    transform: scaleX(1);
    transition: none;
  }
}

.hero__copy[data-hero-parallax] {
  will-change: transform;
}