/* Only the hero's geometry changes. Existing typography, copy and controls remain. */
.homepage .flow-hero {
  padding: 0;
  background: #fcfaf3;
}
.flow-stage {
  position: relative;
  min-height: calc(100svh - 88px);
  isolation: isolate;
  overflow: clip;
}
.flow-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 66% center;
  z-index: -2;
}
.flow-stage::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(
    90deg,
    rgb(255 255 255 / 30%) 0%,
    rgb(255 255 255 / 0%) 65%
  );
}
.homepage .flow-hero .ownership-hero-grid {
  position: relative;
  display: flex;
  align-items: center;
  min-height: inherit;
  gap: 0;
}
.homepage .flow-hero .ownership-hero-copy {
  width: min(610px, 52%);
  padding: 32px 0;
  flex: none;
  will-change: transform;
}
.homepage .flow-hero .local-hero-visual {
  display: none;
}
.flow-hero.is-centered .ownership-hero-copy {
  text-align: center;
}
.flow-hero.is-centered .hero-description {
  margin-left: auto;
  margin-right: auto;
}
.flow-hero.is-centered .actions,
.flow-hero.is-centered .hero-quality {
  justify-content: center;
}
.flow-hero.is-centered .hero-service-line {
  align-items: center;
}
@media (max-width: 800px) {
  .flow-stage {
    min-height: calc(100svh - 132px);
  }
  .homepage .flow-hero .ownership-hero-copy {
    width: calc(100% - 12px);
    max-width: 610px;
    padding: 24px 0;
  }
  .flow-video {
    object-position: 35% center;
  }
}
@media (prefers-reduced-motion: reduce) {
  .flow-hero .ownership-hero-copy {
    will-change: auto;
  }
}

@media (max-width: 800px) {
  .homepage .flow-hero .actions .button {
    width: 100%;
  }
}

/* Text contrast follows scroll progress while brand colours remain unchanged elsewhere. */
.homepage .flow-hero h1,
.homepage .flow-hero .hero-description,
.homepage .flow-hero .hero-quality li,
.homepage .flow-hero .hero-service-line,
.homepage .flow-hero .eyebrow,
.homepage .flow-hero .tamil-note {
  color: var(--flow-ink, #162f54);
}
.homepage .flow-hero h1 em,
.homepage .flow-hero .hero-quality svg {
  color: var(--flow-accent, #0037a6);
}
@media (prefers-reduced-motion: reduce) {
  html:has(.flow-hero) {
    scroll-behavior: auto !important;
  }
}

/* Reserve scroll space before deferred scripts load, preventing a pin-induced layout shift. */
@media (prefers-reduced-motion: no-preference) {
  html.flow-motion .flow-hero {
    padding-bottom: 1700px;
  }
}
@media (max-width: 800px) and (prefers-reduced-motion: no-preference) {
  html.flow-motion .flow-hero {
    padding-bottom: 900px;
  }
}
