/* A quiet, geographic motion study for Who we are. */
.about-horizon {
  --horizon-ink: #06121c;
  --horizon-white: #eef5fc;
  position: relative;
  margin-top: 70px;
  background: var(--horizon-ink);
  color: var(--horizon-white);
  isolation: isolate;
}
.about-horizon[data-state="ready"],
.about-horizon.is-enhanced {
  height: 235svh;
  min-height: 1580px;
}
.horizon-stage {
  position: sticky;
  top: 0;
  height: 100svh;
  min-height: 640px;
  overflow: hidden;
  background: radial-gradient(ellipse at 54% 42%, #112c3a 0%, #091c29 38%, #06121c 76%);
}
#masiv-about-horizon,
.horizon-fallback,
.horizon-vignette {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.horizon-fallback { object-fit: cover; opacity: 1; }
#masiv-about-horizon { z-index: 1; }
.about-horizon[data-state="ready"] .horizon-fallback,
.about-horizon.is-ready .horizon-fallback { opacity: 0; }
.horizon-vignette {
  z-index: 2;
  background: linear-gradient(180deg, #06121c 0%, #06121c 17%, #06121c00 33%),
              linear-gradient(0deg, #06121cd9 0%, #06121c00 35%);
}
.horizon-message {
  position: absolute;
  left: var(--gutter);
  right: var(--gutter);
  z-index: 4;
  pointer-events: none;
  will-change: opacity;
}
.horizon-message--near { bottom: 128px; }
.horizon-message--far { top: clamp(130px, 15svh, 190px); opacity: 0; }
.horizon-message h2 {
  font-size: clamp(56px, 6.5vw, 96px);
  line-height: 1.02;
  letter-spacing: -.055em;
  color: var(--horizon-white);
  max-width: 1000px;
}
.horizon-message p {
  color: #b7c8d5;
  font-size: clamp(17px, 1.4vw, 21px);
  line-height: 1.6;
  margin-top: 22px;
}
.horizon-state-labels { position: absolute; inset: 0; pointer-events: none; z-index: 3; opacity: 0; }
.horizon-state-labels span {
  position: absolute;
  transform: translate(-50%, -50%);
  color: #afc4d3;
  font-size: clamp(16px, 1.3vw, 20px);
  letter-spacing: -.02em;
  line-height: 1.25;
  white-space: nowrap;
  text-shadow: 0 1px 5px #06121c, 0 0 18px #06121c;
}
.horizon-state-labels [data-state-label="texas"] { font-size: clamp(19px, 1.7vw, 25px); }
.horizon-place {
  position: absolute;
  left: var(--horizon-x, 64%);
  top: var(--horizon-y, 53%);
  width: 0;
  height: 0;
  z-index: 5;
  pointer-events: none;
  opacity: 0;
}
.horizon-place-dot {
  position: absolute;
  left: -3px;
  top: -3px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #f5fcff;
  box-shadow: 0 0 0 6px #c5e9ff17, 0 0 23px #bbdfff70;
}
.horizon-place-label {
  position: absolute;
  left: 18px;
  top: 8px;
  color: #f3f9fe;
  font-size: 18px;
  letter-spacing: -.02em;
  white-space: nowrap;
  line-height: 1.4;
  text-shadow: 0 1px 5px #06121c, 0 0 18px #06121c;
}
.horizon-footer {
  position: absolute;
  left: var(--gutter);
  right: var(--gutter);
  bottom: 30px;
  display: flex;
  align-items: center;
  gap: 26px;
  z-index: 6;
  padding-right: 200px;
}
.horizon-scroll { display: inline-flex; align-items: center; gap: 22px; font-size: 15px; color: #b8cbd8; visibility: hidden; }
.about-horizon[data-state="ready"] .horizon-scroll { visibility: visible; }
.horizon-scroll > span { font-size: 22px; line-height: 1; }
.horizon-pause {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 44px;
  padding: 8px 16px;
  border: 1px solid #b2d4eb42;
  border-radius: 30px;
  background: #12304166;
  color: #d9e9f3;
  font-size: 14px;
  backdrop-filter: blur(12px);
  transition: border-color .2s, background .2s;
}
.horizon-pause:hover { border-color: #b2d4eb99; background: #25465588; }
.horizon-skip { display: inline-flex; align-items: center; gap: 18px; font-size: 15px; color: #e2edf5; margin-left: auto; min-height: 44px; }
.horizon-skip:hover { color: white; text-decoration: underline; text-underline-offset: 5px; }
.horizon-progress { position: absolute; left: 0; right: 0; bottom: 0; z-index: 6; height: 1px; background: #b9d8ed12; }
.horizon-progress > span { display: block; height: 100%; width: 0; background: #c3deef8c; }
.horizon-description { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.about-horizon :focus-visible { outline-color: #d2ecff; }
.about-horizon-active .site-header:not(.menu-open) {
  background: #06121ce3;
  color: #edf5fc;
  box-shadow: 0 1px 0 #d5e8f016;
  backdrop-filter: blur(24px);
}
.about-horizon-active .site-header:not(.menu-open) .brand-mark { background: #b7d2fa; }
.about-horizon-active .site-header:not(.menu-open) .nav-cta { border-color: #bcd5e147; background: #b5d6ee0a; }
.about-horizon-active .site-header:not(.menu-open) .nav-cta:hover { background: #d2e7f71a; }
.about-horizon-active .site-header:not(.menu-open) .mobile-toggle span { background: #edf5fc; }
.about-horizon-active #masiv-version-switcher { bottom: 20px; }
#about-team { scroll-margin-top: 80px; }
@media (max-width: 1000px) {
  .horizon-footer { padding-right: 170px; gap: 18px; }
  .horizon-scroll { font-size: 14px; gap: 12px; }
  .horizon-state-labels [data-state-label="mississippi"],
  .horizon-state-labels [data-state-label="alabama"] { display: none; }
}
@media (max-width: 640px) {
  .about-horizon { margin-top: 50px; }
  .about-horizon[data-state="ready"], .about-horizon.is-enhanced { height: 225svh; min-height: 1400px; }
  .horizon-stage { min-height: 700px; }
  .horizon-message--near { bottom: 184px; }
  .horizon-message--far { top: 126px; }
  .horizon-message h2 { font-size: clamp(48px, 13vw, 67px); max-width: 520px; }
  .horizon-message p { font-size: 16px; margin-top: 18px; }
  .horizon-state-labels span { font-size: 15px; }
  .horizon-state-labels [data-state-label="louisiana"] { display: none; }
  .horizon-state-labels [data-state-label="texas"] { font-size: 19px; }
  .horizon-place-label { left: 0; top: 16px; transform: translateX(-50%); font-size: 16px; }
  .horizon-footer { bottom: 78px; padding-right: 0; flex-wrap: nowrap; gap: 12px; }
  .horizon-scroll { position: absolute; bottom: 67px; font-size: 14px; }
  .horizon-pause { min-height: 44px; padding-inline: 10px; gap: 6px; flex-shrink: 0; }
  .horizon-skip { font-size: 14px; gap: 8px; flex-shrink: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .about-horizon[data-state="ready"], .about-horizon.is-enhanced { height: auto; min-height: 0; }
  .horizon-stage { position: relative; }
  .horizon-pause, .horizon-scroll, .horizon-progress { display: none; }
  .horizon-message--near { opacity: 1 !important; }
  .horizon-message--far { display: none; }
}
@media (max-height: 600px) {
  .about-horizon[data-state="ready"], .about-horizon.is-enhanced { min-height: 0; height: 210svh; }
  .horizon-stage { min-height: 0; height: 100svh; }
  .horizon-message--near { bottom: 90px; }
  .horizon-message--far { top: 105px; }
  .horizon-message h2 { font-size: 42px; }
  .horizon-message p, .horizon-scroll { display: none; }
  .horizon-footer { bottom: 16px; }
}
@media (max-height: 600px) and (max-width: 640px) {
  .horizon-message--near { bottom: 135px; }
  .horizon-message h2 { font-size: 40px; }
  .horizon-footer { bottom: 70px; }
}
@media (max-height: 600px) and (prefers-reduced-motion: reduce) {
  .about-horizon[data-state="ready"], .about-horizon.is-enhanced { height: auto; }
}
