:root {
  --home-ink: #07111f;
  --home-navy: #0b1727;
  --home-soft: #eef2f5;
  --home-paper: #f8f9fa;
  --home-muted: #667386;
  --home-line: rgba(7,17,31,.14);
  --home-white-line: rgba(255,255,255,.18);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  color: var(--home-ink);
  background: white;
}

.homeWrap {
  width: min(1180px, calc(100% - 56px));
  margin: 0 auto;
}


/* NAV */
.homeNav {
  position: absolute;
  z-index: 20;
  top: 0;
  left: 0;
  right: 0;
  color: white;
  border-bottom: 1px solid rgba(255,255,255,.18);
}

.navInner {
  height: 86px;
  display: flex;
  align-items: center;
  gap: 28px;
}

.homeBrand {
  min-width: 230px;
  display: flex;
  flex-direction: column;
  color: white;
  text-decoration: none;
}

.homeBrand span {
  font-size: 15px;
  font-weight: 800;
}

.homeBrand small {
  margin-top: 2px;
  font-size: 11px;
  opacity: .62;
}

.homeLinks {
  flex: 1;
  display: flex;
  justify-content: center;
  gap: 24px;
}

.homeLinks a,
.navContact {
  color: white;
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
}

.navContact {
  padding: 11px 18px;
  border: 1px solid rgba(255,255,255,.48);
}


/* HERO */
.homeHero {
  min-height: 810px;
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
  color: white;
}

.heroImage,
.heroOverlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.heroImage {
  object-fit: cover;
}

.heroOverlay {
  background:
    linear-gradient(90deg,
      rgba(3,10,18,.94) 0%,
      rgba(3,10,18,.78) 45%,
      rgba(3,10,18,.28) 75%,
      rgba(3,10,18,.48) 100%);
}

.heroContent {
  position: relative;
  z-index: 2;
  padding-top: 90px;
}

.heroEyebrow,
.homeKicker {
  font-size: 11px;
  line-height: 1;
  letter-spacing: .17em;
  font-weight: 800;
}

.heroEyebrow {
  opacity: .65;
  margin-bottom: 28px;
}

.heroContent h1 {
  margin: 0;
  max-width: 950px;
  font-size: clamp(64px, 7.5vw, 112px);
  line-height: .9;
  letter-spacing: -.06em;
}

.heroContent > p {
  max-width: 650px;
  margin: 34px 0 0;
  color: rgba(255,255,255,.75);
  font-size: 18px;
  line-height: 1.65;
}

.heroActions {
  margin-top: 38px;
  display: flex;
  gap: 28px;
  align-items: center;
}


/* GENERAL */
.homeSection {
  padding: 105px 0;
}

.homeKicker {
  margin-bottom: 18px;
  color: #697689;
}

.sectionIntro {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 70px;
  align-items: end;
  margin-bottom: 54px;
}

.sectionIntro h2,
.whyHeading h2,
.showroomText h2,
.projectCta h2 {
  margin: 0;
  font-size: clamp(44px, 5vw, 76px);
  line-height: .96;
  letter-spacing: -.05em;
}

.sectionIntro > p,
.showroomText > p,
.ctaRight > p {
  margin: 0;
  color: var(--home-muted);
  font-size: 16px;
  line-height: 1.7;
}

.homeBtn {
  display: inline-block;
  padding: 14px 20px;
  text-decoration: none;
  font-size: 13px;
  font-weight: 800;
}

.homeBtn.light {
  background: white;
  color: var(--home-ink);
}

.darkBtn {
  background: var(--home-ink);
  color: white;
}

.textLink {
  color: var(--home-ink);
  text-decoration: none;
  font-size: 13px;
  font-weight: 800;
}

.lightText {
  color: white;
}

.sectionLink {
  margin-top: 28px;
}


/* CORE BUSINESS */
.businessGrid {
  min-height: 650px;
  display: grid;
  grid-template-columns: 1.35fr .65fr;
  grid-template-rows: 1fr 1fr;
  gap: 18px;
}

.businessCard {
  position: relative;
  display: block;
  overflow: hidden;
  text-decoration: none;
}

.businessLarge {
  grid-row: 1 / 3;
  color: white;
}

.businessLarge img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.businessShade {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(3,10,18,.9), rgba(3,10,18,.08) 70%);
}

.businessDark {
  background: var(--home-ink);
  color: white;
}

.businessSoft {
  background: #dfe8ef;
  color: var(--home-ink);
}

.businessCopy {
  position: absolute;
  left: 34px;
  right: 34px;
  bottom: 34px;
}

.businessCopy > span {
  display: block;
  margin-bottom: 16px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .15em;
  opacity: .58;
}

.businessCopy h3 {
  margin: 0;
  max-width: 620px;
  font-size: clamp(32px, 3.6vw, 54px);
  line-height: .98;
  letter-spacing: -.04em;
}

.businessCopy p {
  max-width: 570px;
  margin: 18px 0 24px;
  line-height: 1.6;
  opacity: .76;
}

.businessCopy b {
  font-size: 13px;
}


/* INDUSTRIAL CHAIN */
.chainSection {
  background: var(--home-paper);
}

.chainRail {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border-top: 1px solid var(--home-line);
  border-bottom: 1px solid var(--home-line);
}

.chainStage {
  min-height: 290px;
  padding: 26px 24px 28px 0;
  border-right: 1px solid var(--home-line);
}

.chainStage:last-child {
  border-right: 0;
}

.chainStage span {
  display: block;
  margin-bottom: 52px;
  color: #8b96a6;
  font-size: 10px;
}

.chainStage small {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .13em;
}

.chainStage h3 {
  margin: 10px 0 14px;
  font-size: 22px;
  line-height: 1.05;
}

.chainStage p {
  margin: 0;
  color: var(--home-muted);
  font-size: 14px;
  line-height: 1.55;
}


/* PROCESS */
.processGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.processCard {
  min-height: 260px;
  padding: 28px 32px 34px 0;
  border-top: 1px solid var(--home-line);
}

.processCard:nth-child(1),
.processCard:nth-child(2),
.processCard:nth-child(4),
.processCard:nth-child(5) {
  border-right: 1px solid var(--home-line);
}

.processCard:nth-child(2),
.processCard:nth-child(3),
.processCard:nth-child(5),
.processCard:nth-child(6) {
  padding-left: 32px;
}

.processCard span {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  color: #7a8798;
}

.processCard h3 {
  margin: 34px 0 12px;
  font-size: 25px;
  line-height: 1.05;
}

.processCard p {
  margin: 0;
  color: var(--home-muted);
  line-height: 1.6;
}


/* APPLICATIONS */
.appGridV2 {
  display: grid;
  grid-template-columns: 1.35fr .65fr;
  grid-template-rows: 330px 330px;
  gap: 18px;
}

.appTile {
  position: relative;
  overflow: hidden;
  display: block;
  color: white;
  text-decoration: none;
}

.appLarge {
  grid-row: 1 / 3;
}

.appWide {
  grid-column: 2;
}

.appTile img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}

.appTile:hover img {
  transform: scale(1.035);
}

.appShade {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(3,10,18,.9), rgba(3,10,18,.06) 68%);
}

.appCopy {
  position: absolute;
  z-index: 2;
  left: 28px;
  right: 28px;
  bottom: 26px;
}

.appCopy span {
  display: block;
  margin-bottom: 12px;
  font-size: 10px;
  font-weight: 800;
  opacity: .6;
}

.appCopy h3 {
  margin: 0;
  font-size: 30px;
  line-height: 1;
}

.appCopy p {
  max-width: 440px;
  margin: 10px 0 0;
  color: rgba(255,255,255,.74);
  line-height: 1.5;
}


/* ECOSYSTEM */
.ecosystemSection {
  background: var(--home-soft);
}

.techRail {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  border-top: 1px solid var(--home-line);
  border-bottom: 1px solid var(--home-line);
}

.techRail > div {
  padding: 26px 18px 28px 0;
}

.techRail span,
.techRail b {
  display: block;
}

.techRail span {
  margin-bottom: 28px;
  color: #8490a0;
  font-size: 10px;
}

.techRail b {
  font-size: 19px;
}


/* WHY OMNI */
.whySection {
  padding: 110px 0;
  background: var(--home-ink);
  color: white;
}

.lightKicker {
  color: rgba(255,255,255,.48);
}

.whyHeading {
  max-width: 820px;
  margin-bottom: 60px;
}

.whyGrid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border-top: 1px solid var(--home-white-line);
}

.whyItem {
  min-height: 270px;
  padding: 26px 20px 20px 0;
  border-right: 1px solid var(--home-white-line);
}

.whyItem:last-child {
  border-right: 0;
}

.whyItem span {
  display: block;
  margin-bottom: 55px;
  color: rgba(255,255,255,.36);
  font-size: 10px;
}

.whyItem h3 {
  margin: 0 0 14px;
  font-size: 21px;
}

.whyItem p {
  margin: 0;
  color: rgba(255,255,255,.62);
  font-size: 14px;
  line-height: 1.55;
}


/* SHOWROOM */
.showroomLayout {
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  gap: 70px;
  align-items: center;
}

.showroomText p {
  margin: 28px 0 30px;
}

.showroomImages {
  position: relative;
  min-height: 620px;
}

.showroomMain {
  float: right;
  width: 82%;
  height: 570px;
  object-fit: cover;
}

.showroomSmall {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 48%;
  height: 250px;
  object-fit: cover;
  border: 12px solid white;
}


/* CTA */
.projectCta {
  padding: 105px 0;
  background: #e6edf2;
}

.projectCtaInner {
  display: grid;
  grid-template-columns: 1fr .65fr;
  gap: 90px;
  align-items: end;
}

.ctaRight {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.ctaRight p {
  margin-bottom: 28px;
}


/* FOOTER */
.homeFooter {
  padding: 30px 0;
  background: var(--home-ink);
  color: rgba(255,255,255,.56);
  font-size: 12px;
}

.footerInner {
  display: flex;
  justify-content: space-between;
  gap: 30px;
}


/* TABLET */
@media (max-width: 980px) {

  .homeLinks {
    display: none;
  }

  .sectionIntro,
  .showroomLayout,
  .projectCtaInner {
    grid-template-columns: 1fr;
  }

  .businessGrid {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    min-height: 0;
  }

  .businessLarge {
    grid-row: auto;
    min-height: 580px;
  }

  .businessDark,
  .businessSoft {
    min-height: 360px;
  }

  .chainRail {
    grid-template-columns: 1fr 1fr;
  }

  .chainStage {
    border-bottom: 1px solid var(--home-line);
  }

  .processGrid {
    grid-template-columns: 1fr 1fr;
  }

  .processCard {
    padding-left: 0 !important;
    padding-right: 24px;
    border-right: 0 !important;
  }

  .techRail {
    grid-template-columns: repeat(3, 1fr);
  }

  .whyGrid {
    grid-template-columns: 1fr 1fr;
  }

  .whyItem {
    border-bottom: 1px solid var(--home-white-line);
  }
}


/* MOBILE */
@media (max-width: 760px) {

  .homeWrap {
    width: min(100% - 34px, 1180px);
  }

  .navInner {
    height: 74px;
  }

  .homeBrand {
    min-width: 0;
    flex: 1;
  }

  .navContact {
    padding: 9px 12px;
  }

  .homeHero {
    min-height: 740px;
  }

  .heroContent h1 {
    font-size: 56px;
  }

  .heroContent > p {
    font-size: 16px;
  }

  .homeSection,
  .whySection {
    padding: 72px 0;
  }

  .sectionIntro {
    gap: 24px;
    margin-bottom: 38px;
  }

  .sectionIntro h2,
  .whyHeading h2,
  .showroomText h2,
  .projectCta h2 {
    font-size: 45px;
  }

  .businessLarge {
    min-height: 510px;
  }

  .businessDark,
  .businessSoft {
    min-height: 340px;
  }

  .businessCopy {
    left: 24px;
    right: 24px;
    bottom: 24px;
  }

  .chainRail,
  .processGrid,
  .techRail,
  .whyGrid {
    grid-template-columns: 1fr;
  }

  .chainStage,
  .processCard,
  .whyItem {
    min-height: auto;
    border-right: 0;
    padding: 28px 0;
  }

  .chainStage span,
  .whyItem span {
    margin-bottom: 22px;
  }

  .appGridV2 {
    grid-template-columns: 1fr;
    grid-template-rows: none;
  }

  .appLarge,
  .appWide {
    grid-row: auto;
    grid-column: auto;
  }

  .appTile {
    min-height: 350px;
  }

  .showroomImages {
    min-height: 470px;
  }

  .showroomMain {
    width: 90%;
    height: 430px;
  }

  .showroomSmall {
    height: 180px;
  }

  .projectCtaInner {
    gap: 36px;
  }

  .footerInner {
    flex-direction: column;
  }
}


/* OMNI premium visual pass */

/* HERO MOVEMENT */

.heroImage {
  animation: heroCinematic 18s ease-in-out infinite alternate;
  transform-origin: center center;
}

@keyframes heroCinematic {
  0% {
    transform: scale(1.02) translate3d(0, 0, 0);
  }

  100% {
    transform: scale(1.09) translate3d(-1.2%, -.5%, 0);
  }
}

.heroEyebrow {
  opacity: 0;
  animation: heroFadeUp .7s ease forwards .15s;
}

.heroContent h1 {
  opacity: 0;
  transform: translateY(30px);
  animation: heroFadeUp .85s ease forwards .35s;
}

.heroContent > p {
  opacity: 0;
  transform: translateY(24px);
  animation: heroFadeUp .75s ease forwards .65s;
}

.heroActions {
  opacity: 0;
  transform: translateY(20px);
  animation: heroFadeUp .7s ease forwards .9s;
}

@keyframes heroFadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}


/* SCROLL REVEAL */

.reveal {
  opacity: 0;
  transform: translateY(38px);
  transition:
    opacity .85s cubic-bezier(.2,.8,.2,1),
    transform .85s cubic-bezier(.2,.8,.2,1);
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}


/* LESS BOXY / MORE EDITORIAL */

.businessGrid {
  gap: 12px;
}

.businessCard {
  border: 0;
}

.businessImageCard {
  color: white;
}

.businessImageCard img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.businessCapacity img {
  filter: brightness(.68) saturate(.75);
}

.chainRail {
  border-bottom: 0;
}

.chainStage {
  border-right: 0;
  padding-right: 32px;
}

.chainStage + .chainStage {
  padding-left: 28px;
  border-left: 1px solid var(--home-line);
}

.processGrid {
  gap: 0;
}

.processCard {
  border-right: 0 !important;
  border-bottom: 1px solid var(--home-line);
}

.processCard:nth-child(4),
.processCard:nth-child(5),
.processCard:nth-child(6) {
  border-bottom: 0;
}


/* APPLICATIONS */

.appGridV2 {
  gap: 12px;
}

.appTile {
  min-height: 330px;
}

.appCopy {
  transition: transform .3s ease;
}

.appTile:hover .appCopy {
  transform: translateY(-5px);
}

.appTile:hover img {
  transform: scale(1.055);
}


/* TECH RAIL */

.techRail {
  border-bottom: 0;
}

.techRail > div {
  transition:
    transform .25s ease,
    opacity .25s ease;
}

.techRail > div:hover {
  transform: translateY(-5px);
}


/* ASIA SECTION */

.asiaSection {
  position: relative;
  min-height: 620px;
  overflow: hidden;
  color: white;
  display: flex;
  align-items: center;
}

.asiaImage,
.asiaOverlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.asiaImage {
  object-fit: cover;
}

.asiaOverlay {
  background:
    linear-gradient(
      90deg,
      rgba(4,13,24,.92) 0%,
      rgba(4,13,24,.68) 48%,
      rgba(4,13,24,.18) 100%
    );
}

.asiaContent {
  position: relative;
  z-index: 2;
}

.asiaContent h2 {
  margin: 0;
  max-width: 850px;
  font-size: clamp(52px, 6vw, 88px);
  line-height: .92;
  letter-spacing: -.055em;
}

.asiaContent p {
  max-width: 590px;
  margin-top: 28px;
  color: rgba(255,255,255,.7);
  font-size: 17px;
  line-height: 1.65;
}


/* SHOWROOM */

.showroomMain,
.showroomSmall {
  transition: transform .45s ease;
}

.showroomImages:hover .showroomMain {
  transform: scale(1.015);
}

.showroomImages:hover .showroomSmall {
  transform: translateY(-8px);
}


/* LARGE SECTION RHYTHM */

.coreBusinessSection {
  padding-top: 130px;
  padding-bottom: 130px;
}

.applicationsSection {
  padding-top: 125px;
  padding-bottom: 125px;
}

.ecosystemSection {
  padding-top: 115px;
  padding-bottom: 115px;
}


/* MOTION ACCESSIBILITY */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }
}


/* MOBILE */

@media (max-width: 760px) {

  .asiaSection {
    min-height: 520px;
  }

  .asiaContent h2 {
    font-size: 48px;
  }

  .chainStage + .chainStage {
    padding-left: 0;
    border-left: 0;
  }

  .processCard {
    border-bottom: 1px solid var(--home-line) !important;
  }
}


/* HERO ANIMATION UPGRADE */

.homeHero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  min-height: 860px;
  background: #06111f;
}

.heroImage {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  animation: heroZoomMove 18s ease-in-out infinite alternate;
  filter: brightness(0.56) contrast(1.05) saturate(0.92);
  transform-origin: center center;
}

.homeHero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(
      90deg,
      rgba(4, 11, 22, 0.82) 0%,
      rgba(4, 11, 22, 0.62) 36%,
      rgba(4, 11, 22, 0.24) 70%,
      rgba(4, 11, 22, 0.12) 100%
    );
}

.homeHero::after {
  content: "";
  position: absolute;
  inset: -8%;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(circle at 20% 30%, rgba(33, 112, 255, 0.18), transparent 28%),
    radial-gradient(circle at 78% 18%, rgba(255, 255, 255, 0.10), transparent 26%),
    radial-gradient(circle at 65% 75%, rgba(33, 112, 255, 0.08), transparent 22%);
  animation: heroGlowDrift 12s ease-in-out infinite alternate;
}

.heroContent,
.heroCopy,
.heroText,
.heroMain,
.heroInner,
.homeHero h1,
.homeHero p {
  position: relative;
  z-index: 2;
}

@keyframes heroZoomMove {
  0% {
    transform: scale(1) translate3d(0, 0, 0);
  }
  100% {
    transform: scale(1.08) translate3d(-1.5%, -1%, 0);
  }
}

@keyframes heroGlowDrift {
  0% {
    transform: translate3d(0, 0, 0);
    opacity: 0.72;
  }
  100% {
    transform: translate3d(1.5%, -1.5%, 0);
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .heroImage,
  .homeHero::after {
    animation: none;
  }
}

@media (max-width: 1024px) {
  .homeHero {
    min-height: 760px;
  }
}

@media (max-width: 760px) {
  .homeHero {
    min-height: 680px;
  }

  .homeHero::before {
    background:
      linear-gradient(
        180deg,
        rgba(4, 11, 22, 0.78) 0%,
        rgba(4, 11, 22, 0.58) 45%,
        rgba(4, 11, 22, 0.38) 100%
      );
  }

  .heroImage {
    animation: heroZoomMoveMobile 16s ease-in-out infinite alternate;
  }

  @keyframes heroZoomMoveMobile {
    0% {
      transform: scale(1) translate3d(0, 0, 0);
    }
    100% {
      transform: scale(1.05) translate3d(-1%, 0, 0);
    }
  }
}


/* OMNI HERO MOTION TEST V2 */

/*
   Deliberately obvious for testing:
   zoom + horizontal camera movement.
   Once confirmed working, we will slow it down.
*/

.homeHero .heroImage {
  animation: omniHeroPanV2 7s ease-in-out infinite alternate !important;
  transform-origin: center center !important;
  will-change: transform;
}

@keyframes omniHeroPanV2 {
  0% {
    transform: scale(1.00) translate3d(0, 0, 0);
  }

  100% {
    transform: scale(1.16) translate3d(-4%, -2%, 0);
  }
}

/* also make the atmospheric layer visibly move */
.homeHero::after {
  animation: omniHeroLightV2 6s ease-in-out infinite alternate !important;
  will-change: transform, opacity;
}

@keyframes omniHeroLightV2 {
  0% {
    transform: translate3d(-3%, 0, 0);
    opacity: .40;
  }

  100% {
    transform: translate3d(4%, -2%, 0);
    opacity: 1;
  }
}

/*
   Override the old reduced-motion rule temporarily
   so we can confirm whether Safari animation works.
*/
.homeHero .heroImage {
  animation-play-state: running !important;
}



/* OMNI CINEMATIC HERO SLIDESHOW V1 */

.homeHero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background: #06101c;
}

/* Entire slideshow behind the content */
.heroSlides {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

.heroSlide {
  position: absolute;
  inset: -2%;
  width: 104%;
  height: 104%;
  object-fit: cover;

  opacity: 0;

  filter:
    brightness(.52)
    contrast(1.08)
    saturate(.88);

  will-change: transform, opacity;

  animation:
    omniHeroFade 14s linear infinite,
    omniHeroMotion 14s ease-in-out infinite;
}


/* ============================================================
   Each image enters at a different point of the 24s cycle
   ============================================================ */

.heroSlide1 {
  animation-delay: 0s, 0s;
}

.heroSlide2 {
  animation-delay: 3.5s, 3.5s;
}

.heroSlide3 {
  animation-delay: 7s, 7s;
}

.heroSlide4 {
  animation-delay: 10.5s, 10.5s;
}


/* ============================================================
   Crossfade:
   0–4%       fade in
   4–21%      visible
   21–25%     fade out
   rest        invisible
   ============================================================ */

@keyframes omniHeroFade {

  0% {
    opacity: 0;
  }

  4% {
    opacity: 1;
  }

  21% {
    opacity: 1;
  }

  25% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}


/* Each slide continuously moves while visible */
@keyframes omniHeroMotion {

  0% {
    transform:
      scale(1.02)
      translate3d(0, 0, 0);
  }

  25% {
    transform:
      scale(1.12)
      translate3d(-2.2%, -1%, 0);
  }

  100% {
    transform:
      scale(1.12)
      translate3d(-2.2%, -1%, 0);
  }
}


/* ============================================================
   Premium dark gradient
   ============================================================ */

.homeHero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;

  background:
    linear-gradient(
      90deg,
      rgba(2, 9, 19, .94) 0%,
      rgba(2, 9, 19, .78) 36%,
      rgba(2, 9, 19, .34) 67%,
      rgba(2, 9, 19, .18) 100%
    ),
    linear-gradient(
      0deg,
      rgba(2, 9, 19, .28),
      transparent 45%
    );
}


/* ============================================================
   Moving blue atmospheric glow
   ============================================================ */

.homeHero::after {
  content: "";
  position: absolute;
  inset: -12%;
  z-index: 1;
  pointer-events: none;

  background:
    radial-gradient(
      circle at 14% 45%,
      rgba(21, 92, 255, .22),
      transparent 27%
    ),
    radial-gradient(
      circle at 76% 18%,
      rgba(127, 190, 255, .12),
      transparent 25%
    );

  animation: omniHeroAtmosphere 10s ease-in-out infinite alternate;
}

@keyframes omniHeroAtmosphere {

  from {
    transform: translate3d(-2%, 1%, 0);
    opacity: .6;
  }

  to {
    transform: translate3d(3%, -2%, 0);
    opacity: 1;
  }
}


/* Keep nav + hero copy above images */
.homeNav {
  z-index: 20;
}

.heroContent {
  position: relative;
  z-index: 3;
}


/* ============================================================
   Give copy a subtle entrance
   ============================================================ */

.heroEyebrow {
  animation: omniHeroCopyIn .7s ease both .15s;
}

.heroContent h1 {
  animation: omniHeroCopyIn .85s ease both .30s;
}

.heroContent > p {
  animation: omniHeroCopyIn .8s ease both .50s;
}

.heroActions {
  animation: omniHeroCopyIn .8s ease both .68s;
}

@keyframes omniHeroCopyIn {

  from {
    opacity: 0;
    transform: translateY(26px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}


/* ============================================================
   Very subtle scan/light line
   ============================================================ */

.heroSlides::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;

  width: 22%;
  left: -30%;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.035),
      transparent
    );

  transform: skewX(-12deg);

  animation: omniHeroSweep 9s ease-in-out infinite;
}

@keyframes omniHeroSweep {

  0%,
  35% {
    left: -30%;
    opacity: 0;
  }

  48% {
    opacity: 1;
  }

  72% {
    left: 115%;
    opacity: 0;
  }

  100% {
    left: 115%;
    opacity: 0;
  }
}


/* ============================================================
   Mobile
   ============================================================ */

@media (max-width: 760px) {

  .heroSlide {
    inset: 0;
    width: 100%;
    height: 100%;
  }

  .homeHero::before {
    background:
      linear-gradient(
        180deg,
        rgba(2,9,19,.60) 0%,
        rgba(2,9,19,.68) 42%,
        rgba(2,9,19,.90) 100%
      );
  }
}


/* accessibility */
@media (prefers-reduced-motion: reduce) {

  .heroSlide {
    animation: none !important;
    opacity: 0;
  }

  .heroSlide1 {
    opacity: 1;
  }

  .homeHero::after,
  .heroSlides::after {
    animation: none !important;
  }
}


/* OMNI HERO LIGHTER + FAST V3 */

/* Faster 4-slide cycle: 2.5s per image / 10s total */
.heroSlide {
  animation:
    omniHeroFadeFast 10s linear infinite,
    omniHeroMotionFast 10s ease-in-out infinite !important;

  /* Preserve more of the original image */
  filter:
    brightness(.82)
    contrast(1.03)
    saturate(.96) !important;
}

.heroSlide1 {
  animation-delay: 0s, 0s !important;
}

.heroSlide2 {
  animation-delay: 2.5s, 2.5s !important;
}

.heroSlide3 {
  animation-delay: 5s, 5s !important;
}

.heroSlide4 {
  animation-delay: 7.5s, 7.5s !important;
}


/* Shorter crossfade for faster rhythm */
@keyframes omniHeroFadeFast {
  0% {
    opacity: 0;
  }

  5% {
    opacity: 1;
  }

  20% {
    opacity: 1;
  }

  25% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}


/* Smaller camera movement because slides change faster */
@keyframes omniHeroMotionFast {
  0% {
    transform:
      scale(1.01)
      translate3d(0, 0, 0);
  }

  25% {
    transform:
      scale(1.07)
      translate3d(-1.4%, -.6%, 0);
  }

  100% {
    transform:
      scale(1.07)
      translate3d(-1.4%, -.6%, 0);
  }
}


/* Replace heavy black overlay with a lighter navy gradient */
.homeHero::before {
  background:
    linear-gradient(
      90deg,
      rgba(4, 16, 34, .72) 0%,
      rgba(4, 16, 34, .52) 32%,
      rgba(4, 16, 34, .18) 65%,
      rgba(4, 16, 34, .04) 100%
    ),
    linear-gradient(
      0deg,
      rgba(4, 16, 34, .12),
      transparent 45%
    ) !important;
}


/* Make atmospheric glow subtler */
.homeHero::after {
  background:
    radial-gradient(
      circle at 12% 42%,
      rgba(25, 103, 255, .13),
      transparent 30%
    ),
    radial-gradient(
      circle at 78% 16%,
      rgba(140, 200, 255, .07),
      transparent 25%
    ) !important;

  opacity: .65;
}


/* Slight text shadow instead of darkening the whole image */
.heroContent h1,
.heroContent p,
.heroEyebrow {
  text-shadow:
    0 2px 16px rgba(0,0,0,.32);
}



/* OMNI HERO COMPOSITION V4 */

/* -------------------------
   NAV: separate dark band
   ------------------------- */

.homeNav {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;

  background: #061321 !important;
  color: white;

  border-bottom: 1px solid rgba(255,255,255,.08) !important;
}

.navInner {
  height: 78px !important;
}

.homeBrand,
.homeBrand span,
.homeLinks a,
.navContact {
  color: #fff !important;
}

.navContact {
  border-color: rgba(255,255,255,.28) !important;
}


/* -------------------------
   HERO: shorter + centered
   ------------------------- */

.homeHero {
  min-height: 500px !important;
  height: 500px !important;

  display: flex !important;
  align-items: center !important;

  background: #0b1826 !important;
}

.heroContent {
  padding-top: 0 !important;
  padding-bottom: 0 !important;

  text-align: center !important;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.heroEyebrow {
  margin-bottom: 24px !important;

  font-size: 11px !important;
  letter-spacing: .22em !important;

  color: #56d5f3 !important;
  opacity: 1 !important;
}

.heroContent h1 {
  max-width: 960px !important;

  margin: 0 auto !important;

  font-size: clamp(48px, 5.2vw, 76px) !important;
  line-height: 1.06 !important;

  letter-spacing: -.035em !important;

  text-align: center !important;

  color: white !important;

  text-shadow:
    0 2px 18px rgba(0,0,0,.24) !important;
}

.heroContent > p {
  max-width: 720px !important;

  margin: 24px auto 0 !important;

  font-size: 16px !important;
  line-height: 1.65 !important;

  text-align: center !important;

  color: rgba(255,255,255,.82) !important;

  text-shadow:
    0 2px 16px rgba(0,0,0,.20) !important;
}


/* -------------------------
   HERO IMAGES: brighter
   ------------------------- */

.heroSlide {
  filter:
    brightness(.90)
    contrast(1.02)
    saturate(.96) !important;
}


/* -------------------------
   HERO OVERLAY: much lighter
   ------------------------- */

.homeHero::before {
  background:
    linear-gradient(
      90deg,
      rgba(4, 15, 28, .30) 0%,
      rgba(4, 15, 28, .18) 28%,
      rgba(4, 15, 28, .15) 50%,
      rgba(4, 15, 28, .18) 72%,
      rgba(4, 15, 28, .30) 100%
    ),
    linear-gradient(
      0deg,
      rgba(4,15,28,.22),
      rgba(4,15,28,.05) 45%
    ) !important;
}

.homeHero::after {
  opacity: .18 !important;
}


/* -------------------------
   SLIDESHOW SPEED:
   2.25 sec each = 9 sec loop
   ------------------------- */

.heroSlide {
  animation:
    omniHeroFadeV4 9s linear infinite,
    omniHeroMotionV4 9s ease-in-out infinite !important;
}

.heroSlide1 {
  animation-delay: 0s, 0s !important;
}

.heroSlide2 {
  animation-delay: 2.25s, 2.25s !important;
}

.heroSlide3 {
  animation-delay: 4.5s, 4.5s !important;
}

.heroSlide4 {
  animation-delay: 6.75s, 6.75s !important;
}

@keyframes omniHeroFadeV4 {

  0% {
    opacity: 0;
  }

  4% {
    opacity: 1;
  }

  21% {
    opacity: 1;
  }

  25% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@keyframes omniHeroMotionV4 {

  0% {
    transform:
      scale(1.00)
      translate3d(0, 0, 0);
  }

  25% {
    transform:
      scale(1.035)
      translate3d(-.5%, -.3%, 0);
  }

  100% {
    transform:
      scale(1.035)
      translate3d(-.5%, -.3%, 0);
  }
}


/* -------------------------
   CORE BUSINESS:
   dark continuation after hero
   ------------------------- */

.coreBusinessDark {
  background:
    linear-gradient(
      115deg,
      #061321 0%,
      #09213a 58%,
      #061321 100%
    ) !important;

  color: white !important;

  padding-top: 90px !important;
}

.coreBusinessDark .homeKicker {
  color: #35d8ff !important;
}

.coreBusinessDark .sectionIntro h2 {
  color: white !important;
}

.coreBusinessDark .sectionIntro > p {
  color: rgba(255,255,255,.62) !important;
}


/* keep cards visually distinct */
.coreBusinessDark .businessCard {
  box-shadow: none !important;
}


/* -------------------------
   DESKTOP TRANSITION
   ------------------------- */

.coreBusinessDark {
  border-top: 1px solid rgba(255,255,255,.04);
}


/* -------------------------
   MOBILE
   ------------------------- */

@media (max-width: 760px) {

  .homeHero {
    min-height: 520px !important;
    height: 520px !important;
  }

  .heroContent h1 {
    font-size: 46px !important;
  }

  .heroContent > p {
    font-size: 15px !important;
  }

  .navInner {
    height: 72px !important;
  }
}


/* OMNI BRIGHT HERO FIX V5 */

/* NAV can remain dark, like the reference site */
.homeNav {
  background: #061321 !important;
}


/* HERO — preserve the actual photography */
.homeHero {
  background: #eef3f6 !important;
}


/* DO NOT darken the source images */
.heroSlide {
  filter:
    brightness(1.02)
    contrast(1.02)
    saturate(1.00) !important;
}


/*
   Only a very light neutral veil.
   No black left-side gradient.
*/
.homeHero::before {
  background:
    linear-gradient(
      0deg,
      rgba(20, 35, 50, .10),
      rgba(20, 35, 50, .10)
    ) !important;
}


/* remove blue/dark atmospheric fog */
.homeHero::after {
  opacity: 0 !important;
  background: none !important;
}


/* text readability comes from shadow, not black overlay */
.heroContent h1 {
  color: #fff !important;
  text-shadow:
    0 2px 8px rgba(0,0,0,.38),
    0 8px 30px rgba(0,0,0,.22) !important;
}

.heroEyebrow {
  color: #67e0f4 !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.32);
}

.heroContent > p {
  color: rgba(255,255,255,.94) !important;
  text-shadow:
    0 2px 7px rgba(0,0,0,.45),
    0 5px 20px rgba(0,0,0,.18) !important;
}


/* Core Business returns to clean light editorial layout */
.coreBusinessSection {
  background: #fff !important;
  color: #07111f !important;
  padding-top: 95px !important;
}

.coreBusinessSection .homeKicker {
  color: #1683ff !important;
}

.coreBusinessSection .sectionIntro h2 {
  color: #07111f !important;
}

.coreBusinessSection .sectionIntro > p {
  color: #667386 !important;
}


/* Keep slideshow fast */
.heroSlide {
  animation:
    omniHeroFadeV5 9s linear infinite,
    omniHeroMotionV5 9s ease-in-out infinite !important;
}

.heroSlide1 {
  animation-delay: 0s, 0s !important;
}

.heroSlide2 {
  animation-delay: 2.25s, 2.25s !important;
}

.heroSlide3 {
  animation-delay: 4.5s, 4.5s !important;
}

.heroSlide4 {
  animation-delay: 6.75s, 6.75s !important;
}

@keyframes omniHeroFadeV5 {
  0%   { opacity: 0; }
  4%   { opacity: 1; }
  21%  { opacity: 1; }
  25%  { opacity: 0; }
  100% { opacity: 0; }
}

@keyframes omniHeroMotionV5 {
  0% {
    transform: scale(1) translate3d(0,0,0);
  }

  25% {
    transform: scale(1.025) translate3d(-.3%,-.2%,0);
  }

  100% {
    transform: scale(1.025) translate3d(-.3%,-.2%,0);
  }
}



/* OMNI HERO BRIGHT FINAL V6 */

/* Make images much brighter */
.heroSlide {
  filter:
    brightness(1.18)
    contrast(.96)
    saturate(1.02) !important;
}

/* Remove almost all dark overlay */
.homeHero::before {
  background:
    linear-gradient(
      90deg,
      rgba(4, 16, 30, .10) 0%,
      rgba(4, 16, 30, .04) 45%,
      rgba(255,255,255,.02) 100%
    ) !important;
}

/* remove atmosphere completely */
.homeHero::after {
  display: none !important;
}

/* readable text without dimming the photo */
.heroContent h1 {
  color: #fff !important;
  text-shadow:
    0 3px 14px rgba(0,0,0,.55),
    0 10px 34px rgba(0,0,0,.28) !important;
}

.heroEyebrow {
  color: #5ee6ff !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.45) !important;
}

.heroContent > p {
  color: #fff !important;
  text-shadow:
    0 2px 10px rgba(0,0,0,.58),
    0 6px 22px rgba(0,0,0,.26) !important;
}

/* slightly lighter nav too, but still separate */
.homeNav {
  background: #0a1a29 !important;
}