/**
 * SFX Core - normal page/post/shortcode styles.
 * Checkout, loader, and thank-you screens have their own scoped stylesheets.
 */

body {
  font-family: Inter, Arial, sans-serif;
  color: #1e1d24;
  background: #fff;
}

.sfx-content {
  width: min(900px, calc(100% - 40px));
  margin: 44px auto;
  line-height: 1.7;
}

.sfx-content .entry-header {
  margin-bottom: 24px;
}

.sfx-content .entry-title {
  margin: 0 0 8px;
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.12;
  font-weight: 800;
  letter-spacing: 0;
}

.sfx-content .entry-meta {
  margin: 8px 0 0;
  font-size: 13px;
  color: #6f6b7a;
}

.sfx-content .entry-content {
  font-size: 16px;
}

.sfx-content .entry-content > *:first-child {
  margin-top: 0;
}

.sfx-content .entry-content > *:last-child {
  margin-bottom: 0;
}

.sfx-content h2,
.sfx-content h3,
.sfx-content h4 {
  margin: 1.6em 0 .55em;
  line-height: 1.2;
  letter-spacing: 0;
}

.sfx-content p,
.sfx-content ul,
.sfx-content ol {
  margin: 0 0 1.1em;
}

.sfx-content a {
  color: #d94bdd;
  font-weight: 600;
}

.sfx-content img,
.sfx-content iframe,
.sfx-content video {
  max-width: 100%;
  height: auto;
}

.sfx-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
  font-size: 14px;
}

.sfx-content th,
.sfx-content td {
  padding: 12px;
  border: 1px solid #ececf1;
  text-align: left;
}

.sfx-content th {
  background: #f8f8fb;
  font-weight: 700;
}

.entry-content .sfx-trust-badges,
.entry-content .sfx-faq,
.entry-content .sfx-support-box,
.entry-content .sfx-payment-methods,
.entry-content .sfx-risk-note,
.entry-content .sfx-live-count,
.entry-content .sfx-recent-orders,
.entry-content .sfx-checkout-link {
  margin: 18px 0;
}

.entry-content .sfx-faq,
.entry-content .sfx-support-box,
.entry-content .sfx-recent-orders {
  border: 1px solid #ececf1;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(28, 27, 36, .04);
}

.entry-content .sfx-checkout-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 18px;
  border-radius: 8px;
  background: #d94bdd;
  color: #fff;
  text-decoration: none;
  font-weight: 800;
}

@media (max-width: 640px) {
  .sfx-content {
    width: min(100% - 28px, 900px);
    margin: 28px auto;
  }

  .sfx-content .entry-content {
    font-size: 15px;
  }
}
