/* ============================================================
   landing/business.html — page-specific styles (2026 redesign).
   Desktop layout references Figma node 3219:13815 at 1440.
   Adaptive refinement (1024 / 768 / 375) is a separate iteration.
   Tokens come from landing/styles/base.css.
   ============================================================ */

/* ======================= 1. Hero (page-specific) ======================= */
/* Hero structure lives in landing/styles/components/hero-2026.css; this
   block fills in business-specific values (BG image URLs + gradient blob). */
.page-business .hero-2026 {
  --hero-bg-image: url("/images/business/v2/hero-bg-375.svg");
  --hero-bg-image-sm: url("/images/business/v2/hero-bg-768.svg");
  --hero-bg-image-lg: url("/images/business/v2/hero-bg.svg");
}

/* Gradient blob slot — Figma 3219:15663:
   ellipse at (515, 131), size 1210×610 inside 1440×700 hero. */
.page-business .hero-2026-gradient {
  left: 35.76%;
  top: 18.71%;
  width: 84.03%;
  height: 87.14%;
  background: linear-gradient(304.64deg, #4091f5 34.4%, #54bea5 63.23%, #5fd47f 95.1%);
  opacity: 0.4;
  filter: blur(150px);
}

/* ======================= 2. Pricing wrapper ======================= */
/* Card markup is in /partials/shared/_pricing-2026.html and styles
   are global in landing/styles/components/pricing-2026.css (also used
   by /pricing, /integration). */
.pricing-2026 {
  margin: 72px 0;
}
@media (max-width: 575px) {
  .pricing-2026 {
    margin: 64px 0;
  }
}
@media (min-width: 768px) {
  .pricing-2026 {
    margin: 80px 0;
  }
}
@media (min-width: 1024px) {
  .pricing-2026 {
    margin: 80px 0;
  }
}
@media (max-width: 575px) {
  .promo-gradient-2026-title,
  .promo-quote-2026-title,
  .summary-checklist-2026-heading h2 {
    font-size: 28px;
    letter-spacing: -0.56px;
  }
}

/* ======================= Inter-section margin schedule =======================
   1024-1279: 80px on every section (incl. shared cta-form + download-cta)
   1280+: 120px. */
@media (min-width: 1024px) {
  .page-business .cta-form-section,
  .page-business .download-cta {
    margin: 80px 0;
  }
}
@media (min-width: 1280px) {
  .promo-gradient-2026,
  .promo-quote-2026,
  .summary-checklist-2026,
  .pricing-2026,
  .page-business .cta-form-section,
  .page-business .download-cta {
    margin: 120px 0;
  }
}

/* .text-underline-accent* lives in typo.css (shared across all pages). */