/* a.html hero, scoped for the official homepage */
:root {
  --a-navy: #002165;
  --a-green: #2bb34b;
  --a-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --a-en: Montserrat, Inter, system-ui, sans-serif;
}
.a-hero {
  position: relative;
  min-height: 100vh;
  min-height: 100svh;
  background: #0a0a0a;
  color: #fff;
  overflow: hidden;
}
.a-hero,
.a-hero h1,
.a-hero h2,
.a-hero p,
.a-slide h1,
.a-slide p { color: #fff !important; }
.a-hero-layers { position: absolute; inset: 0; }
.a-hero-layer {
  position: absolute; inset: 0; background: #111 center/cover no-repeat;
  opacity: 0; transform: scale(1.03);
  transition: opacity .9s var(--a-ease), transform 5s linear;
}
.a-hero-layer.is-active { opacity: 1; transform: scale(1.08); }
.a-hero-layer video {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  pointer-events: none;
}
.a-hero-layer.is-active video { transform: none; }
.a-hero-layers::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.25) 45%, rgba(0,0,0,.1) 100%),
    linear-gradient(0deg, rgba(0,0,0,.35) 0%, transparent 45%);
}
.a-wm {
  position: absolute; left: 50%; bottom: 4%; transform: translateX(-50%);
  z-index: 2; font-family: var(--a-en); font-weight: 700;
  font-size: clamp(3rem, 14vw, 17rem); line-height: 1;
  letter-spacing: -0.02em; color: rgba(255,255,255,.18);
  white-space: nowrap; pointer-events: none; user-select: none;
  opacity: 0; transition: opacity .8s ease;
}
.a-wm.is-active { opacity: 1; }
.a-hero-inner {
  position: relative; z-index: 3;
  min-height: 100vh;
  min-height: 100svh;
  display: flex; align-items: center;
  padding: 120px clamp(20px, 6vw, 120px) 80px;
}
.a-slide {
  position: absolute; left: clamp(20px, 6vw, 120px); right: 20px;
  top: 50%; transform: translateY(calc(-50% + 16px));
  max-width: 640px; opacity: 0; pointer-events: none;
  transition: opacity .85s var(--a-ease), transform .85s var(--a-ease);
}
.a-slide.is-active { opacity: 1; transform: translateY(-50%); pointer-events: auto; }
.a-slide h1 {
  margin: 0 0 16px; font-size: clamp(2rem, 4.5vw, 4.375rem);
  font-weight: 700; line-height: 1.2; letter-spacing: -0.03em; word-break: keep-all;
  color: #fff !important;
}
.a-slide p {
  margin: 0 0 24px; font-size: clamp(1rem, 1.4vw, 1.375rem);
  font-weight: 500; line-height: 1.6; opacity: .95;
  color: #fff !important;
}
.a-dots {
  position: absolute; z-index: 4;
  left: clamp(20px, 6vw, 120px);
  top: calc(50% + 7.5rem);
  display: flex; gap: 4px; align-items: center;
}
.a-dots button {
  border: 0; padding: 0; cursor: pointer; border-radius: 999px;
  width: 6px; height: 6px; background: #38393e;
  transition: width .25s ease, background .25s ease;
}
.a-dots button.is-active { width: 26px; background: var(--a-green); }
.a-hero[hidden] {
  display: none !important;
  min-height: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
}
@media (prefers-reduced-motion: reduce) {
  .a-hero-layer, .a-slide, .a-wm { transition: none !important; transform: none !important; }
}