/*
  Fleet AI public-site sharp pass.
  Purpose: retire the older bubbly landingV2 look without breaking existing pages.
*/
:root,
:root[data-theme="light-blue"] {
  --fa-bg: #f5f7fa;
  --fa-panel: #ffffff;
  --fa-panel-2: #eef3f8;
  --fa-ink: #071426;
  --fa-muted: #56677d;
  --fa-blue: #174ea6;
  --fa-blue-dark: #0f3b7c;
  --fa-green: #158f5d;
  --fa-amber: #d97706;
  --fa-line: rgba(7, 20, 38, .09);
  --fa-shadow: 0 16px 38px rgba(15, 34, 58, .095);
  --fa-shadow-soft: 0 8px 24px rgba(15, 34, 58, .065);
  --radius: 8px;
  --radius-sm: 5px;
}

html[data-theme],
body.landingV2,
body.contentV2,
body.authV2 {
  background:
    linear-gradient(180deg, #fbfcfe 0%, var(--fa-bg) 54%, #fff 100%) !important;
  color: var(--fa-ink) !important;
}

.container {
  width: min(1180px, calc(100% - 40px)) !important;
}

.siteHeader {
  background: rgba(255, 255, 255, .94) !important;
  backdrop-filter: blur(20px);
  border: 0 !important;
  box-shadow: inset 0 -1px 0 rgba(7, 20, 38, .055) !important;
}

body.landingV2 .siteHeader,
body.contentV2 .siteHeader,
body.authV2 .siteHeader,
body.landingV2 .siteHeader.accessHeader,
body.employeeAccess .siteHeader {
  background: rgba(251, 252, 254, .92) !important;
  color: var(--fa-ink) !important;
  border: 0 !important;
  box-shadow: inset 0 -1px 0 rgba(7, 20, 38, .055) !important;
}

.siteHeader__row {
  min-height: 68px !important;
  align-items: center !important;
}

.wordmark {
  gap: 10px !important;
  color: var(--fa-ink) !important;
  font-weight: 850 !important;
  letter-spacing: -.02em !important;
}

.wordmark__mark {
  width: 31px !important;
  height: 31px !important;
}

.siteNav {
  gap: 4px !important;
  align-items: center !important;
}

.siteNav a {
  border: 0 !important;
  border-radius: 5px !important;
  padding: 9px 10px !important;
  color: var(--fa-muted) !important;
  font-size: 13px !important;
  font-weight: 760 !important;
}

.siteNav a:hover,
.siteNav a.is-active {
  background: rgba(24, 93, 220, .075) !important;
  color: var(--fa-ink) !important;
}

body.landingV2 .siteNav a,
body.contentV2 .siteNav a,
body.authV2 .siteNav a {
  border: 0 !important;
  border-radius: 5px !important;
  color: var(--fa-muted) !important;
  box-shadow: none !important;
}

body.landingV2 .siteNav a:hover,
body.landingV2 .siteNav a.is-active,
body.contentV2 .siteNav a:hover,
body.contentV2 .siteNav a.is-active,
body.authV2 .siteNav a:hover,
body.authV2 .siteNav a.is-active {
  background: rgba(24, 93, 220, .075) !important;
  color: var(--fa-ink) !important;
  box-shadow: none !important;
}

.btn,
.siteSignIn,
.navToggle {
  border: 0 !important;
  border-radius: 7px !important;
  box-shadow: none !important;
  font-weight: 780 !important;
  letter-spacing: -.01em !important;
}

.btn.primary {
  background: var(--fa-blue) !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(23, 78, 166, .18) !important;
}

.btn.primary:hover {
  background: var(--fa-blue-dark) !important;
}

.btn.secondary,
.btn.ghost,
.siteSignIn {
  background: transparent !important;
  color: var(--fa-muted) !important;
}

.btn.secondary:hover,
.btn.ghost:hover,
.siteSignIn:hover {
  background: rgba(7, 20, 38, .055) !important;
  color: var(--fa-ink) !important;
}

.announceBar {
  background: #071426 !important;
  color: #dbe7f7 !important;
  border: 0 !important;
}

.announcePill,
.badge,
.pill,
.label,
.planTag,
.state,
.accessStatus {
  border: 0 !important;
  border-radius: 4px !important;
  background: rgba(24, 93, 220, .09) !important;
  color: var(--fa-blue) !important;
  box-shadow: none !important;
}

.announcePill {
  background: rgba(255, 255, 255, .08) !important;
  color: #fff !important;
}

.hero,
.section {
  padding-top: clamp(58px, 6vw, 92px) !important;
  padding-bottom: clamp(58px, 6vw, 92px) !important;
}

.hero--spicy,
.section--tint {
  background: transparent !important;
}

body.landingV2 .section,
body.contentV2 .section,
body.authV2 .section {
  background: transparent !important;
  color: var(--fa-ink) !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.landingV2 .section:nth-of-type(even),
body.contentV2 .section:nth-of-type(even) {
  background: linear-gradient(180deg, rgba(238, 243, 248, .58), rgba(255, 255, 255, .85)) !important;
}

.heroGrid,
.twoColumnStory,
.formShell,
.loginSplit {
  align-items: center !important;
  gap: clamp(30px, 5vw, 64px) !important;
}

.hero h1,
.sectionHeader h2,
.ctaBand h3,
.accessCopy h1 {
  color: var(--fa-ink) !important;
  letter-spacing: -.045em !important;
  line-height: 1.02 !important;
}

.hero h1 {
  max-width: 820px !important;
  font-size: clamp(38px, 5vw, 64px) !important;
}

.hero p,
.sectionHeader p,
.narrativeText,
.accessCopy p {
  color: #35485e !important;
  font-size: 17px !important;
  line-height: 1.65 !important;
}

.commandShell,
.commandShell__card,
.valueCard,
.stackCard,
.planCard,
.card,
.formCard,
.accessCard,
.sideInfo .card,
.ctaBand,
.panelCard,
.loginPanel {
  border: 0 !important;
  border-radius: 8px !important;
  background: var(--fa-panel) !important;
  box-shadow: var(--fa-shadow-soft) !important;
}

body.landingV2 .commandShell,
body.landingV2 .commandShell__card,
body.landingV2 .valueCard,
body.landingV2 .stackCard,
body.landingV2 .planCard,
body.landingV2 .card,
body.landingV2 .formCard,
body.landingV2 .accessCard,
body.landingV2 .ctaBand,
body.landingV2 .loopStep,
body.landingV2 .panelCard,
body.contentV2 .commandShell,
body.contentV2 .commandShell__card,
body.contentV2 .valueCard,
body.contentV2 .stackCard,
body.contentV2 .planCard,
body.contentV2 .card,
body.contentV2 .formCard,
body.contentV2 .accessCard,
body.contentV2 .ctaBand,
body.contentV2 .loopStep,
body.contentV2 .panelCard,
body.authV2 .accessCard,
body.authV2 .card {
  border: 0 !important;
  border-radius: 8px !important;
  background: var(--fa-panel) !important;
  color: var(--fa-ink) !important;
  box-shadow: var(--fa-shadow-soft) !important;
}

.commandShell {
  padding: 18px !important;
  box-shadow: var(--fa-shadow) !important;
}

.commandShell *,
.valueCard *,
.stackCard *,
.planCard *,
.card *,
.formCard *,
.accessCard *,
.ctaBand *,
.loopStep *,
.panelCard * {
  color: inherit;
}

.commandShell,
.commandShell__card,
.valueCard,
.stackCard,
.planCard,
.card,
.formCard,
.accessCard,
.ctaBand,
.loopStep,
.panelCard {
  color: var(--fa-ink) !important;
}

.commandShell p,
.commandShell span,
.valueCard p,
.stackCard p,
.planCard p,
.card p,
.loopStep p,
.panelMeta,
.card__meta,
.miniStat span,
.shellLabel {
  color: var(--fa-muted) !important;
}

.commandShell h3,
.valueCard h3,
.stackCard h3,
.planCard h3,
.card h3,
.loopStep h3 {
  color: var(--fa-ink) !important;
}

body.landingV2 .ctaBand,
body.contentV2 .ctaBand,
body.landingV2 .ctaBand--executive,
body.contentV2 .ctaBand--executive {
  background: #fff !important;
  color: var(--fa-ink) !important;
}

body.landingV2 .ctaBand h3,
body.landingV2 .ctaBand p,
body.landingV2 .ctaBand div,
body.contentV2 .ctaBand h3,
body.contentV2 .ctaBand p,
body.contentV2 .ctaBand div {
  color: var(--fa-ink) !important;
}

body.landingV2 .ctaBand p,
body.contentV2 .ctaBand p {
  color: var(--fa-muted) !important;
}

.commandShell__top,
.commandShell__footer,
.cardHead,
.footerGrid {
  border: 0 !important;
  box-shadow: inset 0 -1px 0 var(--fa-line) !important;
}

.commandShell__card--alert,
.card--soft,
.planCard.highlight {
  background: linear-gradient(135deg, rgba(24, 93, 220, .08), #fff 42%) !important;
}

.valueGrid,
.planGrid,
.footerGrid {
  gap: 18px !important;
}

body.landingV2 .operatingLoop,
body.contentV2 .operatingLoop {
  gap: 14px !important;
}

body.landingV2 .loopStep,
body.contentV2 .loopStep {
  border: 0 !important;
  box-shadow: var(--fa-shadow-soft) !important;
}

body.landingV2 .operatingLoop,
body.contentV2 .operatingLoop,
body.landingV2 .operatingLoop--two,
body.contentV2 .operatingLoop--two {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.landingV2 .btn.secondary,
body.contentV2 .btn.secondary,
body.authV2 .btn.secondary,
body.landingV2 .ctaBand .btn.secondary,
body.contentV2 .ctaBand .btn.secondary {
  background: rgba(7, 20, 38, .055) !important;
  color: var(--fa-ink) !important;
}

body.landingV2 .btn.secondary:hover,
body.contentV2 .btn.secondary:hover,
body.authV2 .btn.secondary:hover {
  background: rgba(24, 93, 220, .095) !important;
  color: var(--fa-blue) !important;
}

.valueCard__number,
.loopStep__index {
  border-radius: 6px !important;
  background: #eef5ff !important;
  color: var(--fa-blue) !important;
}

.featureList li,
.featureList--strong li {
  color: #34465d !important;
}

.dot {
  background: var(--fa-green) !important;
  box-shadow: none !important;
}

input,
select,
textarea,
.form-input,
.form-select {
  border: 0 !important;
  border-radius: 7px !important;
  background: rgba(7, 20, 38, .055) !important;
  color: var(--fa-ink) !important;
  box-shadow: none !important;
}

input:focus,
select:focus,
textarea:focus,
.form-input:focus,
.form-select:focus {
  outline: 0 !important;
  box-shadow: 0 0 0 2px rgba(24, 93, 220, .32) !important;
}

.footer {
  background: #fff !important;
  color: var(--fa-muted) !important;
  border: 0 !important;
}

.footer a {
  color: var(--fa-muted) !important;
}

.footer a:hover {
  color: var(--fa-ink) !important;
}

@media (max-width: 860px) {
  .siteNav {
    border: 0 !important;
    border-radius: 10px !important;
    box-shadow: var(--fa-shadow) !important;
  }

  .hero h1 {
    font-size: clamp(38px, 12vw, 58px) !important;
  }
}