/* =========================================================
   V33 — FINAL UI SYSTEM LOCK
   Scope: global header + the two approved button styles +
   About mission/video mosaic alignment + loader media crop.
   No other section layout is changed here.
========================================================= */
:root {
  --fp-shell:1290px;
  --fp-blue:#0077ff;
  --fp-blue-bright:#138cff;
  --fp-text:#ffffff;
  --fp-muted:#94a1b7;
}
html,body {
  max-width:100%;
  overflow-x:hidden!important
}
/* ---------------------------------------------------------
   1. ONE HEADER SYSTEM ACROSS THE WHOLE WEBSITE
--------------------------------------------------------- */
.v6-header {
  position:absolute!important;
  top:0!important;
  left:0!important;
  right:0!important;
  z-index:100!important;
  height:86px!important;
  display:flex!important;
  align-items:center!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.v6-header .v6-nav {
  width:min(var(--fp-shell),calc(100% - 40px))!important;
  height:86px!important;
  margin-inline:auto!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:180px minmax(0,1fr) 180px!important;
  align-items:center!important;
  gap:20px!important;
  position:relative!important;
}
.v6-header .v6-logo {
  justify-self:start!important;
  display:block!important;
  line-height:0!important;
}
.v6-header .v6-logo img {
  width:156px!important;
  max-width:156px!important;
  height:auto!important;
  display:block!important;
}
.v6-header .v6-links {
  justify-self:center!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:40px!important;
  color:#8f9bb0!important;
  font-size:13px!important;
  line-height:1!important;
}
.v6-header .v6-links>a, .v6-header .v6-links>.nav-item>.mega-trigger {
  position:relative!important;
  padding:35px 0!important;
  color:#8f9bb0!important;
  font-weight:400!important;
  transition:color .22s ease!important;
  white-space:nowrap!important;
}
.v6-header .v6-links a::after {
  display:none!important;
  content:none!important
}
.v6-header .v6-links>a:hover, .v6-header .v6-links>a:focus-visible, .v6-header .v6-links>.nav-item>.mega-trigger:hover, .v6-header .v6-links>.nav-item>.mega-trigger:focus-visible, .v6-header .v6-links a[aria-current="page"] {
  color:#fff!important;
}
.v6-header .v6-phone {
  justify-self:end!important;
  width:148px!important;
  min-width:148px!important;
  height:42px!important;
  min-height:42px!important;
  padding:0 16px!important;
  white-space:nowrap!important;
}
.site-menu-toggle {
  justify-self:end!important
}
/* ---------------------------------------------------------
   2. THE ONLY TWO BUTTON DESIGNS / ANIMATIONS ALLOWED
   JS adds fp-ui-btn + fp-ui-primary/fp-ui-secondary to every
   actual CTA button. The Home "New" badge is excluded.
--------------------------------------------------------- */
.fp-ui-btn {
  --btn-border:#126fca;
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:42px!important;
  padding:0 22px!important;
  border:1px solid var(--btn-border)!important;
  border-radius:7px!important;
  color:#fff!important;
  font-family:"Rethink Sans",sans-serif!important;
  font-size:13px!important;
  font-weight:500!important;
  line-height:1!important;
  text-decoration:none!important;
  transform:translateZ(0)!important;
  transition:     color .22s ease,     border-color .22s ease,     background .28s ease,     box-shadow .28s ease,     transform .22s ease!important;
}
.fp-ui-btn::before {
  content:""!important;
  position:absolute!important;
  z-index:-1!important;
  top:-30%!important;
  bottom:-30%!important;
  left:-52%!important;
  width:34%!important;
  pointer-events:none!important;
  opacity:0!important;
  background:linear-gradient(90deg,transparent,rgba(119,207,255,.08),rgba(255,255,255,.36),rgba(119,207,255,.08),transparent)!important;
  transform:skewX(-20deg)!important;
  transition:left .52s cubic-bezier(.2,.72,.2,1),opacity .18s ease!important;
}
.fp-ui-btn:hover::before, .fp-ui-btn:focus-visible::before {
  left:118%!important;
  opacity:1!important
}
.fp-ui-btn:hover,.fp-ui-btn:focus-visible {
  transform:translateY(-1px)!important
}
.fp-ui-primary {
  background:linear-gradient(180deg,#075bad 0%,#04366a 100%)!important;
  border-color:#0a76dd!important;
  box-shadow:inset 0 0 18px rgba(0,119,255,.14),0 0 0 rgba(0,119,255,0)!important;
}
.fp-ui-primary:hover,.fp-ui-primary:focus-visible {
  background:radial-gradient(circle at 50% 45%,#0c86ed 0%,#075eb6 48%,#043a73 100%)!important;
  border-color:#2195ff!important;
  box-shadow:inset 0 0 22px rgba(41,163,255,.28),0 7px 24px rgba(0,119,255,.28),0 0 18px rgba(0,119,255,.16)!important;
}
.fp-ui-secondary {
  background:rgba(3,15,31,.55)!important;
  border-color:#27496c!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.01)!important;
}
.fp-ui-secondary:hover,.fp-ui-secondary:focus-visible {
  background:rgba(4,32,62,.78)!important;
  border-color:#147fdc!important;
  box-shadow:inset 0 0 20px rgba(0,119,255,.10),0 7px 20px rgba(0,119,255,.14)!important;
}
/* neutralize older per-button transforms/gradients when the approved class exists */
.fp-ui-btn:hover,.fp-ui-btn:focus-visible {
  color:#fff!important
}
.fp-ui-btn span {
  position:relative!important;
  z-index:2!important
}
/* ---------------------------------------------------------
   3. ABOUT — TRUE PAGE-CENTERED CROSS MOSAIC
   Root cause fixed: mosaic lives inside a 980px story-wrap, so
   it must be centered to the viewport/container, not left-anchored.
--------------------------------------------------------- */
.about-page .about-story .story-wrap {
  overflow:visible!important
}
.about-page .about-ai-mosaic.v29-cross-mosaic {
  position:relative!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:min(var(--fp-shell),calc(100vw - 40px))!important;
  max-width:var(--fp-shell)!important;
  margin:58px 0 0!important;
  display:grid!important;
  grid-template-columns:310px minmax(0,670px) 310px!important;
  grid-template-rows:250px 414px 250px!important;
  grid-template-areas:     ". top ."     "left video right"     ". bottom ."!important;
  gap:0!important;
  align-items:center!important;
  justify-items:center!important;
  overflow:visible!important;
}
.about-page .v29-top-card {
  grid-area:top!important
}
.about-page .v29-left-card {
  grid-area:left!important
}
.about-page .v29-video-wrap {
  grid-area:video!important
}
.about-page .v29-right-card {
  grid-area:right!important
}
.about-page .v29-bottom-card {
  grid-area:bottom!important
}
/* all four cards are deliberately identical */
.about-page .v29-card {
  width:310px!important;
  min-width:310px!important;
  max-width:310px!important;
  height:250px!important;
  min-height:250px!important;
  max-height:250px!important;
  margin:0!important;
  padding:25px 24px 23px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 52px!important;
  grid-template-rows:auto auto 1fr!important;
  grid-template-areas:     "kicker icon"     "title icon"     "copy copy"!important;
  column-gap:16px!important;
  row-gap:7px!important;
  align-content:start!important;
  align-items:start!important;
  border:1px solid #0877d8!important;
  border-radius:18px!important;
  background:linear-gradient(145deg,#082d57 0%,#061f3e 55%,#031426 100%)!important;
  box-shadow:0 14px 38px rgba(0,55,115,.12)!important;
  overflow:hidden!important;
}
.about-page .v29-card .v25-mv-copy {
  display:contents!important
}
.about-page .v29-card .v25-mv-kicker {
  grid-area:kicker!important;
  align-self:start!important;
  margin:2px 0 0!important;
  color:#78bdff!important;
  font-size:11px!important;
  font-weight:700!important;
  line-height:1.2!important;
  letter-spacing:.085em!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
}
.about-page .v29-card h3 {
  grid-area:title!important;
  margin:4px 0 0!important;
  color:#fff!important;
  font-size:19px!important;
  font-weight:600!important;
  line-height:1.18!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.about-page .v29-card p {
  grid-area:copy!important;
  align-self:start!important;
  width:100%!important;
  margin:10px 0 0!important;
  color:#a7b7cb!important;
  font-size:13px!important;
  line-height:1.58!important;
}
.about-page .v29-card .v25-mv-icon {
  grid-area:icon!important;
  justify-self:end!important;
  align-self:start!important;
  width:52px!important;
  height:52px!important;
  margin:0!important;
  border-radius:11px!important;
}
.about-page .v29-card .v25-mv-icon svg {
  width:24px!important;
  height:24px!important
}
/* Keep the supplied video at its original 736x414 visual size and center it. */
.about-page .v29-video-wrap, .about-page .v25-video-wrap {
  width:736px!important;
  min-width:736px!important;
  max-width:736px!important;
  height:414px!important;
  min-height:414px!important;
  max-height:414px!important;
  margin:0!important;
  justify-self:center!important;
  align-self:center!important;
  position:relative!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.about-page .v29-about-video, .about-page .v25-about-video, .about-page .about-ai-video {
  width:736px!important;
  min-width:736px!important;
  max-width:736px!important;
  height:414px!important;
  min-height:414px!important;
  max-height:414px!important;
  margin:0 auto!important;
  display:block!important;
  object-fit:contain!important;
  object-position:50% 50%!important;
  background:transparent!important;
  mix-blend-mode:screen!important;
}
.about-page .v25-video-toggle {
  display:none!important
}
/* ---------------------------------------------------------
   4. LOADER — REMOVE THE CIRCULAR MEDIA BACKGROUND/CROP
   Keep the supplied animation itself; only the circular crop/glow
   container is removed and edges are blended rectangularly.
--------------------------------------------------------- */
.fp-exact-preloader {
  background:#020914!important;
}
.fp-exact-loader-media {
  width:min(360px,72vw)!important;
  aspect-ratio:1!important;
  overflow:visible!important;
  border-radius:0!important;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 14%,#000 86%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 14%,#000 86%,transparent 100%)!important;
  mask-image:linear-gradient(to right,transparent 0,#000 14%,#000 86%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 14%,#000 86%,transparent 100%)!important;
  -webkit-mask-composite:source-in!important;
  mask-composite:intersect!important;
  filter:none!important;
  background:transparent!important;
}
.fp-exact-loader-video {
  border-radius:0!important;
  mix-blend-mode:screen!important;
  background:transparent!important;
}
/* ---------------------------------------------------------
   RESPONSIVE
--------------------------------------------------------- */
@media(max-width:1180px) {
  .v6-header .v6-nav {
    grid-template-columns:165px minmax(0,1fr) 165px!important
  }
  .v6-header .v6-links {
    gap:25px!important
  }
  .about-page .about-ai-mosaic.v29-cross-mosaic {
    width:min(960px,calc(100vw - 36px))!important;
    grid-template-columns:260px minmax(0,440px) 260px!important;
    grid-template-rows:235px 340px 235px!important;
  }
  .about-page .v29-card {
    width:260px!important;
    min-width:260px!important;
    max-width:260px!important;
    height:235px!important;
    min-height:235px!important;
    max-height:235px!important;
    padding:22px 20px!important
  }
  .about-page .v29-card h3 {
    font-size:17px!important
  }
  .about-page .v29-card p {
    font-size:12px!important
  }
  .about-page .v29-video-wrap,.about-page .v25-video-wrap,   .about-page .v29-about-video,.about-page .v25-about-video,.about-page .about-ai-video {
    width:604px!important;
    min-width:604px!important;
    max-width:604px!important;
    height:340px!important;
    min-height:340px!important;
    max-height:340px!important;
  }
}
@media(max-width:1024px) {
  .v6-header {
    height:72px!important
  }
  .v6-header .v6-nav {
    height:72px!important;
    grid-template-columns:1fr auto!important;
    width:min(100% - 28px,var(--fp-shell))!important
  }
  .v6-header .v6-links,.v6-header .v6-phone {
    display:none!important
  }
  .v6-header .v6-logo img {
    width:145px!important;
    max-width:145px!important
  }
  .site-menu-toggle {
    display:block!important
  }
  .about-page .about-ai-mosaic.v29-cross-mosaic {
    left:50%!important;
    transform:translateX(-50%)!important;
    width:min(760px,calc(100vw - 32px))!important;
    grid-template-columns:1fr 1fr!important;
    grid-template-rows:auto auto auto auto!important;
    grid-template-areas:"top top" "video video" "left right" "bottom bottom"!important;
    gap:16px!important;
  }
  .about-page .v29-card {
    width:100%!important;
    min-width:0!important;
    max-width:360px!important;
    height:240px!important;
    min-height:240px!important;
    max-height:240px!important
  }
  .about-page .v29-video-wrap,.about-page .v25-video-wrap,   .about-page .v29-about-video,.about-page .v25-about-video,.about-page .about-ai-video {
    width:min(736px,100%)!important;
    min-width:0!important;
    max-width:736px!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:736/414!important;
  }
}
@media(max-width:680px) {
  .about-page .about-ai-mosaic.v29-cross-mosaic {
    width:calc(100vw - 28px)!important;
    grid-template-columns:1fr!important;
    grid-template-areas:"top" "video" "left" "right" "bottom"!important;
  }
  .about-page .v29-card {
    max-width:none!important;
    height:auto!important;
    min-height:230px!important;
    max-height:none!important
  }
  .about-page .v29-card h3 {
    font-size:18px!important;
    white-space:normal!important
  }
  .fp-exact-loader-media {
    width:min(300px,78vw)!important
  }
}
@media(prefers-reduced-motion:reduce) {
  .fp-ui-btn::before {
    display:none!important
  }
}
