/*
 * Desktop-only refinement for the public SPARO marketing pages.
 * Keep all compact/tablet compositions (900px and below) exactly as authored.
 */
@media (min-width: 901px) {
  /* Shared navigation: reclaim a small amount of space at the viewport edges. */
  #sparo-site-header {
    padding-right: 30px;
    padding-left: 30px;
  }

  #sparo-site-header .sparo-header-inner {
    max-width: 1160px;
  }

  #sparo-site-header .solutions-nav-popover {
    padding-right: max(30px, calc((100vw - 1160px) / 2));
    padding-left: max(30px, calc((100vw - 1160px) / 2));
  }

  /* Older home/about header markup shares the same centered navigation. */
  body .header-content {
    max-width: 1160px;
  }

  body > header {
    padding-right: 30px;
    padding-left: 30px;
  }

  /* Home: slightly widen the centered copy rails, without widening paragraph measure. */
  body .hero-content {
    max-width: 1220px;
    padding-right: 32px;
    padding-left: 32px;
  }

  body .section-container {
    max-width: 1240px;
  }

  /* Homepage audience band uses an inline horizontal inset in its markup. */
  body #audience-section {
    padding-right: clamp(20px, 3.6vw, 54px) !important;
    padding-left: clamp(20px, 3.6vw, 54px) !important;
  }

  body .footer-content {
    max-width: 1460px;
  }

  body > footer {
    padding-right: 24px;
    padding-left: 24px;
  }

  /* Club page: modestly wider content rails and a tighter desktop hero inset. */
  body:has(.product-showcase) .hero-content {
    max-width: 1480px;
    padding-right: clamp(28px, 3.1vw, 64px);
    padding-left: clamp(28px, 3.1vw, 64px);
  }

  body:has(.product-showcase) .section,
  body:has(.product-showcase) .product-showcase-inner {
    max-width: 1290px;
  }

  body:has(.product-showcase) .product-showcase-body {
    max-width: 1180px;
  }

  body:has(.product-showcase) .section,
  body:has(.product-showcase) .product-showcase {
    padding-right: 24px;
    padding-left: 24px;
  }

  /* High-performance content rails; intentionally leave its closing CTA untouched. */
  body:has(.pilot-framework) .hero-content {
    max-width: 1290px;
    padding-right: 24px;
    padding-left: 24px;
  }

  body:has(.pilot-framework) .framework-copy,
  body:has(.pilot-framework) .roles,
  body:has(.pilot-framework) .pilot-framework,
  body:has(.pilot-framework) .feedback-strip {
    padding-right: 24px;
    padding-left: 24px;
  }

  body:has(.pilot-framework) .section,
  body:has(.pilot-framework) .framework-copy,
  body:has(.pilot-framework) .role-grid,
  body:has(.pilot-framework) .pilot-framework-inner,
  body:has(.pilot-framework) .feedback-grid {
    max-width: 1290px;
  }

  /* About: expand the intro rail slightly while retaining its asymmetric collage layout. */
  body .page-wrapper {
    max-width: 1140px;
    padding-right: 28px;
    padding-left: 28px;
  }

  body .community-mosaic {
    width: min(1080px, calc(100% - 48px));
  }

  /* Small reading/form rails also gain a little width, without becoming full-width. */
  body:has(#sparo-site-header[data-page-path="/faq"]) .container {
    max-width: 900px;
  }

  body:has(#sparo-site-header[data-page-path="/privacy"]) .container,
  body:has(#sparo-site-header[data-page-path="/terms"]) .container {
    max-width: 840px;
  }

  body .contact-card {
    max-width: 520px;
  }
}