/* Loaded after the Deon package so 1XA's responsive contract wins in export builds. */
:root {
  --xa-teal: #28f0d0;
  --xa-blue: #42a7f4;
  --xa-purple: #6f5cf6;
  --xa-gold: #f6b43b;
}

/* POS showcase final lock: keep the two-image Deon section from falling back to older two-column hero rules. */
.deon-home-pos .deon-home-pos-inner {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: clamp(30px, 4.2vw, 58px) !important;
  width: min(1380px, calc(100vw - clamp(36px, 6vw, 112px))) !important;
  max-width: none !important;
}

.deon-home-pos .deon-home-pos-intro {
  max-width: 980px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  text-align: center !important;
}

.deon-home-pos .deon-home-pos-visual {
  display: grid !important;
  max-width: 1280px !important;
  min-height: 0 !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

.deon-home-pos .deon-home-pos-frame {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: 1240px !important;
  aspect-ratio: 1672 / 941 !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

.deon-home-pos .deon-home-pos-frame > img,
.deon-home-pos .deon-home-pos-products img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
}

.deon-home-pos .deon-home-pos-products-story {
  display: grid !important;
  grid-template-columns: minmax(0, .58fr) minmax(360px, .42fr) !important;
  align-items: center !important;
  gap: clamp(28px, 4.5vw, 72px) !important;
  width: 100% !important;
  max-width: 1220px !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

.deon-home-pos .deon-home-pos-products {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

@media (min-width: 1680px) {
  .deon-home-pos .deon-home-pos-inner {
    grid-template-columns: 1fr !important;
    width: min(1380px, calc(100vw - 144px)) !important;
  }
}

@media (min-width: 981px) and (max-width: 1360px) {
  .deon-home-pos .deon-home-pos-inner {
    grid-template-columns: 1fr !important;
    width: min(1188px, calc(100vw - 48px)) !important;
  }
}

@media (max-width: 980px) {
  .deon-home-pos .deon-home-pos-inner {
    grid-template-columns: 1fr !important;
    width: min(760px, calc(100vw - 40px)) !important;
    max-width: calc(100vw - 40px) !important;
  }

  .deon-home-pos .deon-home-pos-products-story {
    grid-template-columns: 1fr !important;
    max-width: 760px !important;
  }
}

@media (max-width: 680px) {
  .deon-home-pos .deon-home-pos-inner {
    width: calc(100vw - 32px) !important;
    max-width: calc(100vw - 32px) !important;
  }

  .deon-home-pos .deon-home-pos-intro {
    text-align: left !important;
  }
}

html,
body {
  overflow-x: hidden;
}

body .qodef-content-grid,
body #qodef-page-wrapper.qodef-content-grid-1100 .qodef-content-grid {
  width: min(1440px, calc(100vw - clamp(36px, 6vw, 112px))) !important;
  max-width: none !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

.deon-strategy-hero-inner,
.deon-home-pos-inner {
  width: min(1440px, calc(100vw - clamp(36px, 6vw, 112px))) !important;
  max-width: none !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

.deon-partners-hero-panel article,
.deon-partner-profile-card,
.deon-resource-topic-panel,
.deon-resource-topic-panel span,
.deon-resource-grid article,
.deon-ai-search-faq-grid article,
.deon-solution-lane-grid article,
.deon-funnel-feature-stack article,
.deon-proof-strip-grid a,
.deon-feature-value article,
.deon-feature-value-grid section,
.deon-problem-grid article,
.deon-platform-stack article,
.deon-workflow-clean article,
.deon-platform-modules article,
.deon-workflow-steps article,
.deon-industry-proof-grid article,
.deon-investor-signal-panel article,
.deon-investor-market-grid article,
.deon-investor-thesis-grid article,
.deon-investor-proof-grid article,
.deon-benefit-grid article,
.deon-industry-grid article,
.qodef-blog-item {
  border-color: rgba(66, 167, 244, .17) !important;
  background:
    radial-gradient(circle at 10% 12%, rgba(40, 240, 208, .14), transparent 30%),
    radial-gradient(circle at 88% 16%, rgba(66, 167, 244, .13), transparent 34%),
    radial-gradient(circle at 84% 90%, rgba(246, 180, 59, .10), transparent 32%),
    linear-gradient(145deg, rgba(255, 255, 255, .97), rgba(248, 251, 255, .90) 54%, rgba(255, 255, 255, .95)) !important;
  box-shadow:
    0 24px 62px rgba(5, 15, 30, .075),
    inset 0 1px 0 rgba(255, 255, 255, .74) !important;
}

@media (min-width: 1201px) {
  body #qodef-page-mobile-header {
    display: none !important;
  }

  body #qodef-page-header {
    display: block !important;
    min-height: 90px;
    border-bottom: 1px solid rgba(7, 20, 41, .06);
    background: rgba(255, 255, 255, .985) !important;
    box-shadow: 0 18px 48px rgba(7, 20, 41, .06);
  }

  body #qodef-page-header-inner {
    width: min(1520px, calc(100vw - clamp(40px, 5vw, 96px))) !important;
    max-width: none !important;
    margin-right: auto !important;
    margin-left: auto !important;
    padding: 18px 0 !important;
  }

  body #qodef-page-header .qodef-header-inner {
    display: grid !important;
    grid-template-columns: minmax(150px, 188px) minmax(0, 1fr) max-content;
    align-items: center;
    gap: clamp(18px, 2vw, 36px);
    min-width: 0;
  }

  body #qodef-page-header .qodef-header-logo-link {
    display: inline-flex !important;
    align-items: center;
    justify-content: flex-start;
    width: clamp(150px, 10vw, 188px) !important;
    min-width: clamp(150px, 10vw, 188px) !important;
    max-width: 188px !important;
    height: auto !important;
    margin-right: 0 !important;
    overflow: visible !important;
  }

  body #qodef-page-header .qodef-header-logo-link img {
    display: block !important;
    width: clamp(150px, 10vw, 188px) !important;
    max-width: 188px !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain;
  }

  body #qodef-page-header .qodef-header-navigation {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: clamp(14px, 1.45vw, 26px);
    min-width: 0;
    overflow: visible;
    white-space: nowrap;
  }
}

@media (min-width: 1680px) {
  body .qodef-content-grid,
  body #qodef-page-wrapper.qodef-content-grid-1100 .qodef-content-grid,
  .deon-strategy-hero-inner,
  .deon-home-pos-inner {
    width: min(1540px, calc(100vw - 144px)) !important;
  }

  .deon-strategy-hero-inner {
    grid-template-columns: minmax(0, .82fr) minmax(560px, 1fr) !important;
    gap: clamp(76px, 6vw, 126px) !important;
  }

  .deon-home-pos-inner {
    grid-template-columns: minmax(0, .78fr) minmax(560px, 1fr) !important;
    gap: clamp(70px, 5.5vw, 118px) !important;
  }

  .deon-strategy-copy,
  .deon-strategy-copy h1 {
    max-width: 680px !important;
  }

  .deon-strategy-copy h1 {
    font-size: clamp(56px, 3.45vw, 72px) !important;
  }

  .deon-dashboard-figure {
    max-width: min(100%, 700px) !important;
  }
}

@media (min-width: 981px) and (max-width: 1360px) {
  body .qodef-content-grid,
  body #qodef-page-wrapper.qodef-content-grid-1100 .qodef-content-grid,
  .deon-strategy-hero-inner,
  .deon-home-pos-inner {
    width: min(1188px, calc(100vw - 48px)) !important;
  }

  .deon-strategy-hero-inner {
    grid-template-columns: minmax(0, .82fr) minmax(390px, .9fr) !important;
    gap: clamp(34px, 4vw, 66px) !important;
  }

  .deon-strategy-copy h1 {
    font-size: clamp(42px, 4.1vw, 56px) !important;
  }

  .deon-home-pos-inner {
    grid-template-columns: minmax(0, .84fr) minmax(420px, 1fr) !important;
    gap: clamp(34px, 4vw, 70px) !important;
  }
}

@media (max-width: 1200px) {
  body #qodef-page-header {
    display: none !important;
  }

  body #qodef-page-mobile-header {
    display: block !important;
    position: fixed !important;
    inset: 0 0 auto 0;
    z-index: 101;
    border-bottom: 1px solid rgba(7, 20, 41, .08);
    background: rgba(255, 255, 255, .985) !important;
    backdrop-filter: blur(18px);
    box-shadow: 0 18px 48px rgba(7, 20, 41, .06);
  }

  body #qodef-page-mobile-header-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    min-height: 72px !important;
    padding: 12px 16px !important;
  }

  body .qodef-mobile-header-logo-link {
    display: inline-flex !important;
    align-items: center;
    width: clamp(126px, 31vw, 156px) !important;
    min-width: clamp(126px, 31vw, 156px) !important;
    max-width: 156px !important;
    height: auto !important;
    overflow: visible !important;
  }

  body .qodef-mobile-header-logo-link img {
    display: block !important;
    width: clamp(126px, 31vw, 156px) !important;
    max-width: 156px !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
  }

  body .qodef-mobile-header-actions {
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
    margin-left: auto;
  }

  body .qodef-header-login-button-mobile {
    display: none !important;
  }
}

@media (max-width: 980px) {
  body .qodef-content-grid,
  body #qodef-page-wrapper.qodef-content-grid-1100 .qodef-content-grid,
  .deon-strategy-hero-inner,
  .deon-home-pos-inner,
  .deon-partners-hero .qodef-content-grid,
  .deon-partner-strip-inner,
  .deon-partner-profiles,
  .deon-integration-ecosystem .qodef-content-grid,
  .deon-investor-hero .qodef-content-grid,
  .deon-funnel-problem,
  .deon-funnel-workflow,
  .deon-funnel-cta {
    width: min(760px, calc(100vw - 40px)) !important;
    max-width: calc(100vw - 40px) !important;
    margin-right: auto !important;
    margin-left: auto !important;
  }

  .deon-strategy-hero {
    padding-top: clamp(112px, 15vw, 136px) !important;
    padding-bottom: clamp(54px, 7vw, 84px) !important;
  }

  .deon-strategy-copy,
  .deon-strategy-copy h1,
  .deon-strategy-copy > p:not(.deon-hero-kicker) {
    max-width: 100% !important;
  }

  .deon-strategy-copy h1 {
    font-size: clamp(38px, 7vw, 52px) !important;
    line-height: 1.08 !important;
  }

  .deon-strategy-copy > p:not(.deon-hero-kicker) {
    font-size: clamp(16px, 2.25vw, 19px) !important;
    line-height: 1.56 !important;
  }

  .deon-partners-hero .qodef-content-grid,
  .deon-partner-strip-inner,
  .deon-investor-hero .qodef-content-grid {
    grid-template-columns: 1fr !important;
    gap: clamp(28px, 5vw, 48px) !important;
    align-items: start !important;
  }

  .deon-partners-hero-panel,
  .deon-partner-profile-grid,
  .deon-integration-category-grid {
    width: 100% !important;
    max-width: none !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .deon-partners-page .deon-partners-hero-panel article,
  .deon-partners-page .deon-partner-strip-logos,
  .deon-partners-page .deon-partner-profile-card {
    width: 100% !important;
    max-width: none !important;
    justify-self: stretch !important;
  }

  .deon-partners-hero-panel strong {
    font-size: clamp(38px, 8vw, 54px) !important;
  }
}

@media (max-width: 680px) {
  body .qodef-content-grid,
  body #qodef-page-wrapper.qodef-content-grid-1100 .qodef-content-grid,
  .deon-strategy-hero-inner,
  .deon-home-pos-inner,
  .deon-partners-hero .qodef-content-grid,
  .deon-partner-strip-inner,
  .deon-partner-profiles,
  .deon-integration-ecosystem .qodef-content-grid,
  .deon-investor-hero .qodef-content-grid,
  .deon-funnel-problem,
  .deon-funnel-workflow,
  .deon-funnel-cta {
    width: calc(100vw - 32px) !important;
    max-width: calc(100vw - 32px) !important;
  }

  .deon-strategy-copy h1,
  .deon-home-pos-copy h2,
  .deon-partners-hero h1,
  .deon-investor-hero h1 {
    max-width: 100% !important;
    font-size: clamp(30px, 7.9vw, 36px) !important;
    line-height: 1.1 !important;
    overflow-wrap: anywhere !important;
    text-wrap: balance;
  }

  .deon-strategy-copy > p:not(.deon-hero-kicker),
  .deon-home-pos-copy > p:not(.deon-hero-kicker),
  .deon-partners-hero-copy > p:not(.deon-hero-kicker),
  .deon-investor-hero-copy > p:not(.deon-hero-kicker) {
    max-width: 100% !important;
    font-size: 16px !important;
    line-height: 1.58 !important;
  }

  .deon-problem-grid,
  .deon-workflow-clean,
  .deon-partners-hero-panel,
  .deon-partner-profile-grid,
  .deon-integration-category-grid,
  .deon-partner-strip-logos,
  .deon-investor-signal-panel,
  .deon-investor-market-grid,
  .deon-investor-thesis-grid,
  .deon-investor-proof-grid {
    grid-template-columns: 1fr !important;
  }

  .deon-partners-hero {
    padding-top: 112px !important;
    padding-bottom: 58px !important;
  }

  .deon-partners-hero-panel article,
  .deon-partner-profile-card,
  .deon-integration-category-grid span {
    max-width: none !important;
    min-height: auto !important;
  }

  .deon-partners-hero-panel article {
    padding: 24px !important;
  }

  .deon-partners-hero-panel strong {
    font-size: clamp(38px, 12vw, 54px) !important;
  }

  .deon-partners-page .deon-hero-actions,
  .deon-investors-page .deon-hero-actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
    width: 100% !important;
    margin-top: 24px !important;
  }

  .deon-partners-page .deon-hero-actions .deon-button,
  .deon-investors-page .deon-hero-actions .deon-button {
    width: 100% !important;
    min-height: 52px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 18px !important;
    font-size: 13px !important;
    text-align: center !important;
  }

  .deon-partner-strip-logos {
    width: 100% !important;
    max-width: none !important;
  }

  .deon-partners-hero-panel article span,
  .deon-partner-profile-card h3,
  .deon-partner-profile-card h4,
  .deon-integration-category-grid span {
    overflow-wrap: anywhere !important;
  }
}

@media (max-width: 440px) {
  body .qodef-header-login-button-mobile {
    display: none !important;
  }

  body .qodef-mobile-header-logo-link,
  body .qodef-mobile-header-logo-link img {
    width: 150px !important;
    max-width: 150px !important;
  }

  .deon-partners-hero h1,
  .deon-investor-hero h1 {
    font-size: clamp(29px, 7.5vw, 34px) !important;
  }

  .deon-partners-hero-copy > p:not(.deon-hero-kicker),
  .deon-investor-hero-copy > p:not(.deon-hero-kicker) {
    overflow-wrap: anywhere !important;
  }
}

/* POS showcase postscript lock. This must remain last because older responsive rules also menu-availability this section. */
.deon-home-pos .deon-home-pos-inner {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: clamp(30px, 4.2vw, 58px) !important;
  width: min(1380px, calc(100vw - clamp(36px, 6vw, 112px))) !important;
  max-width: none !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

.deon-home-pos .deon-home-pos-intro {
  max-width: 980px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  text-align: center !important;
}

.deon-home-pos .deon-home-pos-visual {
  display: grid !important;
  max-width: 1280px !important;
  min-height: 0 !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

.deon-home-pos .deon-home-pos-frame {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: 1240px !important;
  aspect-ratio: 1672 / 941 !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

.deon-home-pos .deon-home-pos-frame > img,
.deon-home-pos .deon-home-pos-products img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
}

.deon-home-pos .deon-home-pos-products-story {
  display: grid !important;
  grid-template-columns: minmax(0, .58fr) minmax(360px, .42fr) !important;
  align-items: center !important;
  gap: clamp(28px, 4.5vw, 72px) !important;
  width: 100% !important;
  max-width: 1220px !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

.deon-home-pos .deon-home-pos-products {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

@media (min-width: 1680px) {
  .deon-home-pos .deon-home-pos-inner {
    grid-template-columns: 1fr !important;
    width: min(1380px, calc(100vw - 144px)) !important;
  }
}

@media (min-width: 981px) and (max-width: 1360px) {
  .deon-home-pos .deon-home-pos-inner {
    grid-template-columns: 1fr !important;
    width: min(1188px, calc(100vw - 48px)) !important;
  }
}

@media (max-width: 980px) {
  .deon-home-pos .deon-home-pos-inner {
    grid-template-columns: 1fr !important;
    width: min(760px, calc(100vw - 40px)) !important;
    max-width: calc(100vw - 40px) !important;
  }

  .deon-home-pos .deon-home-pos-products-story {
    grid-template-columns: 1fr !important;
    max-width: 760px !important;
  }
}

@media (max-width: 680px) {
  .deon-home-pos .deon-home-pos-inner {
    width: calc(100vw - 32px) !important;
    max-width: calc(100vw - 32px) !important;
  }

  .deon-home-pos .deon-home-pos-intro {
    text-align: left !important;
  }
}
