/*
  DeskWolf Enterprise Pass
  Loads after page-level CSS to pull secondary pages into the new blue wolf-tech system.
*/

:root {
  --dw-page: #f5f8ff;
  --dw-paper: #ffffff;
  --dw-ink: #07111f;
  --dw-ink-2: #111d31;
  --dw-dark: #050812;
  --dw-dark-2: #07162c;
  --dw-muted: #5b677b;
  --dw-line: rgba(10, 28, 58, 0.12);
  --dw-line-dark: rgba(255, 255, 255, 0.13);
  --dw-blue: #075bff;
  --dw-blue-2: #42a8ff;
  --dw-blue-3: #9dd8ff;
  --dw-green: #12c98b;
  --dw-gold: #ffd166;
  --dw-radius: 8px;
  --dw-shadow: 0 24px 70px rgba(5, 16, 38, 0.14);
  --dw-shadow-dark: 0 28px 90px rgba(0, 0, 0, 0.34);
}

html,
body {
  background: var(--dw-page) !important;
}

body {
  color: var(--dw-ink) !important;
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
button,
input,
textarea,
select,
label,
li,
span,
small,
div {
  letter-spacing: 0 !important;
}

body:not(.nav-drawer-open) {
  overflow-x: clip;
}

.dw-container {
  max-width: 1180px !important;
  padding-left: 28px !important;
  padding-right: 28px !important;
}

/* Navigation */
.nav {
  position: fixed !important;
  top: 14px !important;
  left: 50% !important;
  z-index: 80 !important;
  width: min(1180px, calc(100% - 24px)) !important;
  max-width: none !important;
  min-height: 64px !important;
  transform: translateX(-50%) !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 10px 12px 10px 16px !important;
  border: 1px solid rgba(255, 255, 255, 0.13) !important;
  border-radius: var(--dw-radius) !important;
  background: rgba(5, 12, 26, 0.78) !important;
  color: #fff !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.26) !important;
  backdrop-filter: blur(24px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(160%) !important;
}

.nav__brand {
  gap: 10px !important;
  margin-right: 18px !important;
  padding-right: 18px !important;
  border-right: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 800 !important;
}

.nav__mark {
  width: 34px !important;
  height: 34px !important;
  border-radius: var(--dw-radius) !important;
  background:
    radial-gradient(circle at 32% 26%, rgba(117, 210, 255, 0.95), transparent 34%),
    linear-gradient(135deg, rgba(7, 91, 255, 0.95), rgba(8, 14, 30, 0.98)) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18), 0 0 26px rgba(7, 91, 255, 0.55) !important;
}

.nav__mark::after {
  inset: 6px !important;
  border-radius: 0 !important;
  background: url("/images/logo-white.svg") center / contain no-repeat !important;
}

.nav__link {
  padding: 10px 12px !important;
  border-radius: var(--dw-radius) !important;
  color: rgba(255, 255, 255, 0.72) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.nav__link:hover,
.nav__link.active {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

.nav__cta {
  min-height: 46px !important;
  margin-left: auto !important;
  padding: 0 18px !important;
  border-radius: var(--dw-radius) !important;
  color: #fff !important;
  background: linear-gradient(135deg, var(--dw-blue), #00a6ff) !important;
  box-shadow: 0 16px 38px rgba(7, 91, 255, 0.36) !important;
  font-weight: 800 !important;
}

.nav__toggle {
  color: #fff !important;
  border-radius: var(--dw-radius) !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

.nav-drawer {
  background:
    radial-gradient(circle at 75% 10%, rgba(7, 91, 255, 0.32), transparent 34%),
    rgba(4, 10, 21, 0.96) !important;
}

.nav-drawer__link,
.nav-drawer__cta,
.nav-drawer__close {
  border-radius: var(--dw-radius) !important;
}

.nav-drawer__cta {
  background: linear-gradient(135deg, var(--dw-blue), #00a6ff) !important;
}

/* Buttons */
.btn,
.dw-btn,
.phone-monument__cta-primary,
.hub__card-cta,
.niche__pill,
.niche__panel-cta,
.floating-call,
.form__submit,
.top__back,
.checkout-btn,
.skool__card a,
.final-cta a,
.page-hero a,
.demo-hero a {
  border-radius: var(--dw-radius) !important;
  font-weight: 800 !important;
}

.btn {
  min-height: 46px !important;
  padding: 0 18px !important;
}

.btn--primary,
.btn--accent,
.form__submit {
  color: #fff !important;
  background: linear-gradient(135deg, var(--dw-blue), #00a6ff) !important;
  box-shadow: 0 16px 38px rgba(7, 91, 255, 0.36) !important;
}

.btn--light {
  color: var(--dw-dark) !important;
  background: #fff !important;
  box-shadow: 0 18px 40px rgba(255, 255, 255, 0.16) !important;
}

.btn--ghost-dark {
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  background: rgba(255, 255, 255, 0.07) !important;
  box-shadow: none !important;
}

.btn--ghost {
  color: var(--dw-ink) !important;
  border: 1px solid var(--dw-line) !important;
  background: #fff !important;
}

/* Premium page heroes */
.page-hero,
.demo-hero {
  position: relative !important;
  padding: 134px 0 86px !important;
  overflow: hidden !important;
  isolation: isolate !important;
  color: #fff !important;
  background:
    linear-gradient(90deg, rgba(3, 7, 17, 0.98) 0%, rgba(4, 16, 39, 0.92) 44%, rgba(4, 12, 25, 0.82) 100%),
    url("/images/hero-reception.jpg") center / cover no-repeat !important;
}

.demo-hero {
  min-height: 0 !important;
}

.page-hero::before,
.demo-hero::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  background:
    linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px) !important;
  background-size: 72px 72px !important;
  mask-image: linear-gradient(90deg, #000 0%, #000 58%, transparent 100%) !important;
  -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 58%, transparent 100%) !important;
  pointer-events: none !important;
}

.page-hero::after,
.demo-hero::after {
  content: "" !important;
  position: absolute !important;
  inset: auto -12% -26% -12% !important;
  z-index: 0 !important;
  height: 48% !important;
  background: radial-gradient(ellipse at 50% 50%, rgba(7, 91, 255, 0.42), transparent 68%) !important;
  filter: blur(28px) !important;
  pointer-events: none !important;
}

.page-hero > *,
.demo-hero > * {
  position: relative !important;
  z-index: 1 !important;
}

.page-hero__content {
  max-width: 920px !important;
}

.page-hero h1,
.demo-hero h1,
.h-display,
.h-1,
.h-2,
.section__head h2,
.pricing__card h2,
.manifesto-lg h2,
.final-cta h2,
.price-reveal h2,
.summary h1 {
  font-weight: 800 !important;
  line-height: 1.02 !important;
}

.page-hero h1 {
  font-size: clamp(44px, 6.4vw, 84px) !important;
}

.demo-hero h1 {
  font-size: clamp(42px, 6.2vw, 80px) !important;
}

.page-hero p.lead,
.demo-hero__sub,
.body-lg,
.section__head p {
  color: rgba(255, 255, 255, 0.72) !important;
  font-size: clamp(17px, 1.35vw, 21px) !important;
  line-height: 1.58 !important;
}

.section__head .body-lg,
.pricing-main .body-lg,
.compare .body-lg,
.timeline .body-lg,
.beats .body-lg,
.integrations .body-lg,
.meet-vic .body-lg {
  color: var(--dw-muted) !important;
}

.page-hero__eyebrow,
.demo-hero__badge,
.pricing__card-tag,
.price-card__tag,
.eyebrow,
.eyebrow--blue,
.panel-kicker,
.summary__kicker {
  border-radius: var(--dw-radius) !important;
  color: var(--dw-blue-3) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}

.page-hero__eyebrow,
.demo-hero__badge {
  padding: 8px 12px !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  background: rgba(255, 255, 255, 0.07) !important;
}

.page-hero__eyebrow-dot {
  border-radius: var(--dw-radius) !important;
  color: #9fffd8 !important;
  background: rgba(18, 201, 139, 0.14) !important;
}

em.accent,
.page-hero em.accent,
.demo-hero h1 em,
.section__head h2 em,
.h-1 em,
.h-2 em {
  color: var(--dw-blue-3) !important;
  text-shadow: 0 0 44px rgba(7, 91, 255, 0.52) !important;
}

/* Section rhythm */
.timeline,
.beats,
.expect,
.callback,
.pricing-main,
.compare,
.skool,
.guarantee,
.scarcity,
.faq,
.demo,
.book,
.calc,
.story,
.values,
.team,
.integrations {
  background: var(--dw-page) !important;
  padding-top: 108px !important;
  padding-bottom: 108px !important;
}

.manifesto,
.manifesto-lg,
.price-reveal,
.final-cta,
.niche,
.hub,
.dodnt,
.belief--dark {
  color: #fff !important;
  background:
    radial-gradient(circle at 20% 16%, rgba(7, 91, 255, 0.33), transparent 30%),
    radial-gradient(circle at 82% 68%, rgba(18, 201, 139, 0.12), transparent 28%),
    linear-gradient(180deg, #061a38, #030712) !important;
}

.manifesto::before,
.manifesto-lg::before,
.price-reveal::before,
.final-cta::before,
.niche::before,
.hub::before,
.dodnt::before,
.belief--dark::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px) !important;
  background-size: 54px 54px !important;
  pointer-events: none !important;
  mask-image: radial-gradient(circle at 50% 30%, #000 0%, transparent 78%) !important;
  -webkit-mask-image: radial-gradient(circle at 50% 30%, #000 0%, transparent 78%) !important;
}

/* Cards and panels */
.video-card,
.pricing__card,
.pricing-copy,
.price-card,
.compare__table,
.manifesto-split__col,
.skool__card,
.timeline__num,
.timeline__card,
.beat-row,
.dodnt__col,
.hub__card,
.expect__step,
.niche__panel,
.callback__card,
.audio-player,
.belief__reveal,
.stack__item,
.stack__total,
.guarantee__card,
.int-card,
.int-callout,
.book__card,
.calc__card,
.calc__result,
.team__card,
.values__card,
.summary__card,
.form__card,
.card,
.next,
.ind-card,
.not-listed,
.pain__card,
.fit__item,
.stat-strip__grid {
  border-radius: var(--dw-radius) !important;
}

.timeline__card,
.beat-row,
.expect__step,
.callback__card,
.audio-player,
.stack__item,
.guarantee__card,
.int-card,
.book__card,
.calc__card,
.calc__result,
.team__card,
.values__card,
.summary__card,
.form__card,
.card,
.next,
.not-listed,
.fit__item {
  border-color: var(--dw-line) !important;
  box-shadow: var(--dw-shadow) !important;
}

.video-card,
.pricing__card,
.phone-monument,
.niche__panel,
.hub__card,
.dodnt__col,
.int-callout,
.manifesto-split__col,
.stack__total,
.price-reveal__inner,
.final-cta__inner,
.summary__card,
.ind-card,
.pain__card,
.stat-strip__grid {
  border-color: rgba(255, 255, 255, 0.13) !important;
  box-shadow: var(--dw-shadow-dark) !important;
}

.video-card__play,
.hub__ico,
.audio-player__avatar,
.audio-player__play,
.check,
.top__mark {
  border-radius: var(--dw-radius) !important;
  background:
    radial-gradient(circle at 32% 26%, rgba(117, 210, 255, 0.95), transparent 34%),
    linear-gradient(135deg, rgba(7, 91, 255, 0.95), rgba(8, 14, 30, 0.98)) !important;
}

.video-card__chip,
.video-card__duration,
.beat-row__tag,
.summary__trust-pill,
.form__lock,
.int-hero-pill,
.int-card__badge,
.dodnt__head-tag {
  border-radius: var(--dw-radius) !important;
}

/* Pricing page */
.pricing-main {
  margin-top: 0 !important;
}

.pricing__card {
  max-width: 980px !important;
  background:
    radial-gradient(circle at 80% 14%, rgba(7, 91, 255, 0.5), transparent 34%),
    linear-gradient(180deg, #071a38, #050812) !important;
}

.pricing__card::before {
  background: radial-gradient(circle, rgba(7, 91, 255, 0.48), transparent 65%) !important;
}

.pricing__card-tag {
  color: var(--dw-blue-3) !important;
  border-color: rgba(157, 216, 255, 0.26) !important;
  background: rgba(7, 91, 255, 0.18) !important;
}

.pricing__card-big,
.pricing__card-currency {
  color: #fff !important;
  text-shadow: 0 0 60px rgba(7, 91, 255, 0.42) !important;
}

.pricing__list li svg {
  color: var(--dw-blue-3) !important;
}

.compare__row > div:nth-child(3) {
  color: #d8f9ff !important;
  background: linear-gradient(180deg, rgba(7, 91, 255, 0.16), rgba(7, 91, 255, 0.08)) !important;
  box-shadow: inset 1px 0 0 rgba(157, 216, 255, 0.2), inset -1px 0 0 rgba(157, 216, 255, 0.2) !important;
}

.compare__row--head > div:nth-child(3) {
  background: linear-gradient(135deg, var(--dw-blue), #00a6ff) !important;
}

.compare__row--head > div:nth-child(3)::before {
  content: "Wolf pick" !important;
  color: var(--dw-blue-3) !important;
}

.compare__row > div:nth-child(3) b {
  color: #fff !important;
}

/* Demo page */
.phone-monument {
  border-color: rgba(157, 216, 255, 0.24) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(7, 91, 255, 0.28), transparent 48%),
    linear-gradient(180deg, rgba(9, 24, 52, 0.92), rgba(3, 8, 18, 0.95)) !important;
}

.phone-monument__number {
  color: #fff !important;
  font-weight: 800 !important;
}

.phone-monument__cta-primary,
.hub__card--primary .hub__card-cta,
.niche__panel-cta,
.floating-call {
  background: linear-gradient(135deg, var(--dw-blue), #00a6ff) !important;
  box-shadow: 0 16px 38px rgba(7, 91, 255, 0.36) !important;
}

.hub__card--primary {
  background: linear-gradient(160deg, rgba(7, 91, 255, 0.18), rgba(7, 91, 255, 0.06)) !important;
  border-color: rgba(157, 216, 255, 0.24) !important;
}

.niche__pill.active {
  background: var(--dw-blue) !important;
  border-color: var(--dw-blue) !important;
}

/* Industries */
.ind-grid,
.pain {
  background:
    radial-gradient(circle at 18% 10%, rgba(7, 91, 255, 0.24), transparent 30%),
    radial-gradient(circle at 86% 70%, rgba(18, 201, 139, 0.1), transparent 28%),
    linear-gradient(180deg, #061a38, #030712) !important;
}

.ind-card {
  min-height: 440px !important;
  border-color: rgba(157, 216, 255, 0.18) !important;
}

.ind-card__tint {
  background:
    linear-gradient(180deg, rgba(3, 7, 18, 0.06), rgba(3, 7, 18, 0.58) 44%, rgba(3, 7, 18, 0.98)),
    radial-gradient(circle at 30% 24%, rgba(7, 91, 255, 0.3), transparent 36%) !important;
}

.ind-card__title,
.ind-card__num {
  color: #fff !important;
}

.ind-card__stat,
.not-listed p {
  color: rgba(255, 255, 255, 0.72) !important;
}

.ind-card__cta {
  border-radius: var(--dw-radius) !important;
  background: rgba(7, 91, 255, 0.2) !important;
  border-color: rgba(157, 216, 255, 0.22) !important;
  color: #fff !important;
}

.not-listed,
.pain__card {
  background:
    radial-gradient(circle at 82% 0%, rgba(7, 91, 255, 0.22), transparent 34%),
    rgba(8, 18, 38, 0.82) !important;
}

.not-listed h3,
.pain__card h3 {
  color: #fff !important;
}

.scenario,
.fit {
  background:
    radial-gradient(circle at 18% 10%, rgba(7, 91, 255, 0.1), transparent 30%),
    var(--dw-page) !important;
}

.scenario__copy h2,
.fit .h-1,
.demo-cta h2 {
  color: var(--dw-ink) !important;
}

.scenario__copy p,
.fit .body-lg,
.demo-cta p,
.fit__item p {
  color: var(--dw-muted) !important;
}

.fit__item {
  background: #fff !important;
}

.stat-strip {
  background: var(--dw-dark) !important;
}

.stat-strip__grid {
  background:
    radial-gradient(circle at 80% 10%, rgba(7, 91, 255, 0.32), transparent 34%),
    rgba(7, 18, 39, 0.9) !important;
}

.demo-cta {
  color: #fff !important;
  background:
    radial-gradient(circle at 18% 20%, rgba(7, 91, 255, 0.26), transparent 30%),
    linear-gradient(180deg, #061a38, #030712) !important;
}

.demo-cta h2 {
  color: #fff !important;
}

.demo-cta p {
  color: rgba(255, 255, 255, 0.72) !important;
}

/* Forms and checkout */
.top {
  min-height: 72px !important;
  border-bottom-color: rgba(255, 255, 255, 0.1) !important;
  background: rgba(5, 12, 26, 0.9) !important;
}

.top__brand {
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 800 !important;
}

.top__mark::after {
  inset: 5px !important;
  background: url("/images/logo-white.svg") center / contain no-repeat !important;
}

.checkout-page {
  background: var(--dw-dark) !important;
  color: #fff !important;
}

.checkout-page .wrap {
  max-width: 1120px !important;
  background:
    radial-gradient(circle at 20% 0%, rgba(7, 91, 255, 0.28), transparent 34%),
    radial-gradient(circle at 85% 60%, rgba(18, 201, 139, 0.1), transparent 28%) !important;
}

.checkout-page .summary h1,
.checkout-page .summary__tier-name,
.checkout-page .summary__price,
.checkout-page .summary__flat strong {
  color: #fff !important;
}

.checkout-page .summary__sub,
.checkout-page .summary__list li,
.checkout-page .summary__flat,
.checkout-page .summary__tier-note {
  color: rgba(255, 255, 255, 0.72) !important;
}

.checkout-page .summary__card {
  background:
    radial-gradient(circle at 80% 14%, rgba(7, 91, 255, 0.34), transparent 38%),
    rgba(7, 18, 39, 0.9) !important;
  border-color: rgba(157, 216, 255, 0.22) !important;
  box-shadow: var(--dw-shadow-dark) !important;
}

.checkout-page .summary__card-head,
.checkout-page .summary__list {
  border-color: rgba(255, 255, 255, 0.12) !important;
}

.checkout-page .form__card,
.thanks-page .card {
  background: #fff !important;
  color: var(--dw-ink) !important;
}

.thanks-page {
  background:
    radial-gradient(circle at 20% 16%, rgba(7, 91, 255, 0.34), transparent 34%),
    var(--dw-dark) !important;
}

.thanks-page .card {
  max-width: 620px !important;
}

.thanks-page h1 {
  color: #071225 !important;
}

.thanks-page .sub,
.thanks-page .next ol,
.thanks-page .meta {
  color: rgba(7, 18, 37, 0.7) !important;
}

.thanks-page .next {
  background: linear-gradient(135deg, rgba(7, 91, 255, 0.1), rgba(117, 210, 255, 0.1)) !important;
  border-color: rgba(7, 91, 255, 0.18) !important;
}

.thanks-page .meta code {
  color: rgba(7, 18, 37, 0.58) !important;
}

/* Footer */
.foot {
  color: rgba(255, 255, 255, 0.62) !important;
  background:
    radial-gradient(circle at 18% 14%, rgba(7, 91, 255, 0.28), transparent 32%),
    #030712 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.foot__grid {
  gap: 28px !important;
  border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}

.foot__brand,
.foot__col h4 {
  color: #fff !important;
}

.foot__brand-mark {
  width: 30px !important;
  height: 30px !important;
  border-radius: var(--dw-radius) !important;
  background:
    radial-gradient(circle at 32% 26%, rgba(117, 210, 255, 0.95), transparent 34%),
    linear-gradient(135deg, rgba(7, 91, 255, 0.95), rgba(8, 14, 30, 0.98)) !important;
}

.foot__brand-mark::after {
  inset: 6px !important;
  border-radius: 0 !important;
  background: url("/images/logo-white.svg") center / contain no-repeat !important;
}

.foot__col a {
  color: rgba(255, 255, 255, 0.66) !important;
}

.foot__col a:hover {
  color: #fff !important;
}

@media (max-width: 980px) {
  .nav {
    justify-content: space-between !important;
  }

  .nav__link {
    display: none !important;
  }

  .nav__cta {
    margin-left: 0 !important;
  }

  .nav__toggle {
    display: inline-flex !important;
  }

  .page-hero,
  .demo-hero {
    padding: 112px 0 70px !important;
  }

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

  .timeline,
  .beats,
  .expect,
  .callback,
  .pricing-main,
  .compare,
  .skool,
  .guarantee,
  .scarcity,
  .faq,
  .demo,
  .book,
  .calc,
  .story,
  .values,
  .team,
  .integrations {
    padding-top: 78px !important;
    padding-bottom: 78px !important;
  }
}

@media (max-width: 620px) {
  .dw-container {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .nav {
    top: 10px !important;
    width: calc(100% - 20px) !important;
    min-height: 58px !important;
  }

  .nav__brand {
    margin-right: 0 !important;
    padding-right: 0 !important;
    border-right: 0 !important;
  }

  .nav__cta {
    display: none !important;
  }

  .page-hero__cta-row,
  .phone-monument__cta-row,
  .pricing__card-cta-row,
  .final-cta__inner .page-hero__cta-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .page-hero__cta-row .btn,
  .phone-monument__cta-row a,
  .pricing__card-cta-row a,
  .final-cta__inner a {
    width: 100% !important;
    justify-content: center !important;
  }

  .foot__grid {
    grid-template-columns: 1fr !important;
  }
}
