/* Appatco marketing landing tweaks on top of Tabler marketing CSS */
.appatco-marketing-nav {
  backdrop-filter: blur(10px);
  background: color-mix(in srgb, var(--tblr-bg-surface, #fff) 86%, transparent);
  z-index: 1030;
}

.hero-brand {
  font-size: clamp(2.5rem, 6vw, 4rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.05;
  color: var(--tblr-body-color);
  margin-bottom: 0.75rem;
}

.hero-brand .brand-mark {
  vertical-align: -0.12em;
  margin-inline-end: 0.35rem;
}

.landing-browser-preview {
  background: var(--tblr-bg-surface);
  border: 1px solid var(--tblr-border-color);
  border-radius: var(--tblr-border-radius-lg, 0.75rem);
  overflow: hidden;
  box-shadow: 0 1rem 2.5rem rgba(15, 23, 42, 0.08);
}

.landing-browser-preview .browser-header {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--tblr-border-color);
  background: var(--tblr-bg-surface-secondary, #f8fafc);
}

.landing-browser-body {
  padding: 1.5rem;
  min-height: 220px;
}

.landing-mock-card {
  border: 1px solid var(--tblr-border-color);
  border-radius: var(--tblr-border-radius, 0.5rem);
  padding: 1rem;
  background: var(--tblr-bg-surface);
}

.landing-mock-bar {
  height: 0.55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--tblr-primary) 22%, transparent);
  margin-bottom: 0.55rem;
}

.landing-mock-bar.w-75 { width: 75%; }
.landing-mock-bar.w-50 { width: 50%; }
.landing-mock-bar.w-33 { width: 33%; }

.pricing-card.featured {
  border-color: var(--tblr-primary);
  box-shadow: 0 0.75rem 1.75rem rgba(var(--tblr-primary-rgb, 6, 111, 209), 0.12);
}

/* Tabler badge defaults to secondary (gray) text; force white on primary pricing label */
.pricing-card .pricing-label .badge.bg-primary {
  --tblr-badge-color: #fff;
  color: #fff;
}

.pricing-trial-note {
  font-size: 0.875rem;
  line-height: 1.25rem;
  margin-top: -0.25rem;
  min-height: 1.25rem;
}

/* Keep Starter/Business price rows aligned with Growth (which has no trial note) */
.pricing-card:not(:has(.pricing-trial-note)) .pricing-price {
  margin-bottom: calc(0.75rem + 1.25rem);
}

.section-anchor {
  scroll-margin-top: 5.5rem;
}

@media (max-width: 991.98px) {
  .appatco-marketing-nav .navbar-nav {
    padding-bottom: 1rem;
  }
}