/* ── Initial states: set before JS runs to prevent flash ─────────────── */
nav {
  opacity: 0;
}

.js-hero-title,
.js-hero-subtitle,
.js-hero-cta {
  opacity: 0;
  will-change: opacity, transform;
}

/* ── Scroll-reveal default hidden state ──────────────────────────────── */
[data-reveal] {
  opacity: 0;
  will-change: opacity, transform;
}

/* ── Section divider: draw from left ─────────────────────────────────── */
.js-divider {
  transform-origin: left center;
  transform: scaleX(0);
}

/* ── Quote stagger child items ────────────────────────────────────────── */
.js-quote-item {
  opacity: 0;
  will-change: opacity, transform;
}

/* ── Feature image hover zoom ─────────────────────────────────────────── */
.feature-image-wrap img {
  transition: transform 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  will-change: transform;
}

.feature-image-wrap:hover img {
  transform: scale(1.06);
}

/* ── Nav link mask reveal animation ───────────────────────────────────── */
.nav-link {
  position: relative;
  display: inline-block;
  overflow: hidden;
  color: var(--color-on-surface-variant);
  text-decoration: none;
  padding-bottom: 2px;
}

.nav-link span {
  display: inline-block;
  transition: transform 0.4s cubic-bezier(0.77, 0, 0.175, 1);
}

.nav-link span::after {
  content: attr(data-text);
  position: absolute;
  left: 0;
  top: 100%;
  color: var(--color-primary-container);
  font-weight: 700;
}

.nav-link:hover span,
.nav-link:focus-visible span {
  transform: translateY(-100%);
}

.nav-link::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1.5px;
  background: var(--color-primary-container);
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 0.4s cubic-bezier(0.77, 0, 0.175, 1);
}

.nav-link:hover::after,
.nav-link:focus-visible::after {
  transform: scaleX(1);
  transform-origin: left center;
}

/* Active nav link */
.nav-link.active {
  color: var(--color-primary-container);
  font-weight: 700;
}

.nav-link.active::after {
  transform: scaleX(1);
}
