/* AISEO Site homepage blue identity, September 2026 */

.home-v3 {
  --home-ink: #0a1a33;
  --home-muted: #50627c;
  --home-paper: #eef5ff;
  --home-line: #cbd9ef;
  --home-blue: #165dff;
  --home-amber: #f4bd3f;
  --home-green: #087267;
  --home-navy: #071b3b;
  --home-navy-deep: #04142e;
  --home-blue-light: #9cc5ff;
}

.home-v3 .nav {
  background: rgba(4, 20, 46, .48);
  border-bottom-color: rgba(156, 197, 255, .24);
}

.home-v3 .nav.is-scrolled {
  background: rgba(4, 20, 46, .98);
  border-color: rgba(156, 197, 255, .18);
}

.home-v3 .nav__brand img,
.home-v3 .footer__logo img {
  border-radius: 7px;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .14);
}

.home-hero { background: var(--home-navy); }
.home-hero__media::after { background: rgba(4, 20, 46, .67); }
.home-kicker::before { background: var(--home-blue-light); }
.home-hero h1 span { color: #b7d2ff; }
.home-v3 .home-button--ghost { background: rgba(4, 20, 46, .28); }
.home-band { background: var(--home-paper); }
.home-band a:hover,
.home-layer:hover { background: #f7faff; }
.home-section--ink { background: var(--home-navy); }
.home-section--ink .home-overline { color: var(--home-blue-light); }

.home-scenario picture,
.home-loop__scene picture {
  position: relative;
  overflow: hidden;
  background: #102d58;
}

.home-scenario picture::after,
.home-loop__scene picture::after {
  position: absolute;
  inset: 0;
  background: rgba(12, 74, 158, .09);
  content: "";
  pointer-events: none;
}

.home-scenario { border-radius: 4px; }

.home-loop__scene {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, .75fr);
  margin: 0 0 34px;
  border-block: 1px solid rgba(156, 197, 255, .24);
}

.home-loop__scene picture,
.home-loop__scene img {
  display: block;
  width: 100%;
  height: 100%;
}

.home-loop__scene img {
  min-height: 310px;
  object-fit: cover;
}

.home-loop__scene figcaption {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 34px;
  border-left: 1px solid rgba(156, 197, 255, .24);
}

.home-loop__scene strong {
  margin-bottom: 12px;
  color: #fff;
  font-size: 21px;
  line-height: 1.35;
}

.home-loop__scene span {
  color: rgba(255, 255, 255, .68);
  font-size: 14px;
  line-height: 1.65;
}

.home-loop,
.home-loop__step,
.home-engagement__steps,
.home-engagement__step,
.home-engagement__note { border-color: rgba(156, 197, 255, .22); }

.home-loop__num,
.home-engagement__step strong { color: var(--home-blue-light); }

.home-final {
  background: var(--home-blue);
  color: #fff;
}

.home-final h2 { color: #fff; }
.home-final p { color: #fff; }

.home-final .home-button--dark {
  background: var(--home-amber);
  color: var(--home-navy-deep);
}

.home-final .home-button--dark:hover {
  background: #ffd267;
  color: var(--home-navy-deep);
}

.home-v3 .footer,
.home-v3 .mdrawer { background: var(--home-navy-deep); }
.home-v3 .footer__top { border-color: rgba(156, 197, 255, .18); }

.home-v3 .footer__col a:hover,
.home-v3 .footer__contact:hover,
.home-v3 .mdrawer__menu a:hover { color: var(--home-blue-light); }

@media (max-width: 900px) {
  .home-hero__media::after { background: rgba(4, 20, 46, .73); }
  .home-loop__scene { grid-template-columns: minmax(0, 1fr); }
  .home-loop__scene figcaption {
    border-top: 1px solid rgba(156, 197, 255, .24);
    border-left: 0;
  }
}

@media (max-width: 640px) {
  .home-loop__scene img {
    min-height: 220px;
    aspect-ratio: 4 / 3;
  }
  .home-loop__scene figcaption { padding: 24px 0; }
}