:root {
  --xb-section-gap: clamp(64px, 8vw, 112px);
  --xb-content-max: 1180px;
  --xb-copy-max: 680px;
  --xb-card-gap: 20px;
  --xb-hero-min-height: auto;
}

body.xb-density-compact section { padding-block: calc(var(--xb-section-gap) * .72); }
body.xb-density-comfortable section { padding-block: var(--xb-section-gap); }
body.xb-hero-centered .hero { text-align: center; }
body.xb-hero-centered .hero-sub,
body.xb-hero-centered .hero-actions { margin-inline: auto; }
body.xb-hero-left .hero { text-align: left; }
body.xb-trust-condensed .testimonial-track > :nth-child(n+4) { display: none; }
body.xb-cta-emphasis .btn-primary,
body.xb-cta-emphasis [data-payment="stripe"] { box-shadow: 0 8px 24px rgb(30 25 16 / 14%); }

@media (max-width: 480px) {
  :root { --xb-section-gap: 52px; --xb-card-gap: 14px; }
  body.xb-density-compact section { padding-block: 38px; }
}

@media (max-width: 640px) {
  html, body { max-width: 100%; overflow-x: clip; }
  .hero { overflow: hidden; }
  .hero-sub { max-width: 100%; padding-inline: 18px; }
  .hero-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: min(100% - 40px, 340px) !important;
    margin-inline: auto !important;
  }
  .hero-actions > a,
  .hero-actions > button { width: 100% !important; min-width: 0 !important; box-sizing: border-box; }
  .hero-trust { flex-wrap: wrap !important; justify-content: center !important; padding-inline: 18px; }
}
