@font-face {
  font-family: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("/theme-assets/fonts/plus-jakarta-sans-variable.ttf") format("truetype");
}

#pricing {
  padding: 80px 24px;
  /* The public header already sets the document scroll padding. */
  scroll-margin-top: 8px;
  font-family: "Plus Jakarta Sans", sans-serif;
  color: #111827;
  line-height: 1.5;
}
#pricing .pricing__inner { max-width: 960px; margin: 0 auto; text-align: center; }
#pricing .pricing__heading { margin: 0 auto 32px; }
#pricing .pricing__eyebrow { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 24px; padding: 6px 14px; border: 1px solid #fed7aa; border-radius: 999px; background: #ffedd5b3; color: #9a3412; font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
#pricing .pricing__eyebrow::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #ea580c; animation: comparison-pulse 2s ease-in-out infinite; }
#pricing h2 { margin: 0; color: #0f172a; font: 800 44px/1.18 "Plus Jakarta Sans", sans-serif; letter-spacing: -0.025em; text-wrap: balance; }
#pricing h2 span { color: #ff4d12; }
#pricing .pricing__heading p { margin: 8px 0 0; color: #4b5563; font-size: 17px; }
#pricing .pricing__cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; max-width: 850px; margin: 0 auto 12px; text-align: left; }
#pricing .pricing__card { min-width: 0; display: flex; flex-direction: column; justify-content: space-between; padding: 28px; border: 1px solid #e9ecef; border-radius: 16px; background: #fff; box-shadow: 0 10px 25px -4px rgb(0 0 0 / 4%), 0 4px 10px -2px rgb(0 0 0 / 2%); }
#pricing .pricing__card--featured { border: 2px solid #ff4d12; padding: 27px; box-shadow: 0 14px 35px -4px rgb(255 77 18 / 8%), 0 6px 14px -3px rgb(0 0 0 / 3%); }
#pricing .pricing__badges { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; font-size: 10.5px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; }
#pricing .pricing__best { border-radius: 999px; padding: 2px 12px; color: #c83803; background: #fff1eb; }
#pricing .pricing__saving { border-radius: 999px; padding: 4px 14px; color: #fff; background: #ff4d12; font-size: 11px; box-shadow: 0 1px 2px rgb(0 0 0 / 5%); }
#pricing h3 { margin: 0 0 8px; color: #111827; font-size: 17px; font-weight: 700; line-height: 1.5; }
#pricing .pricing__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; margin: 0 0 4px; }
#pricing .pricing__price strong { color: #0b1320; font-size: 44px; font-weight: 800; letter-spacing: -0.025em; line-height: 1.5; }
#pricing .pricing__price span { color: #6b7280; font-size: 18px; }
#pricing .pricing__billing { margin: 0 0 14px; color: #5a6578; font-size: 13.5px; font-weight: 500; }
#pricing .pricing__cpm { display: inline-block; margin: 0 0 28px; border: 1px solid #fed7c5; border-radius: 999px; padding: 4px 16px; color: #c83803; background: #fff4ee; font-size: 13px; font-weight: 700; }
#pricing .pricing-cta { display: block; margin: 0; min-height: 52px; border: 1px solid #d5dae1; border-radius: 12px; padding: 14px 24px; color: #d43b00; background: #fff; font-size: 15px; font-weight: 700; text-align: center; text-decoration: none; transition: background-color 150ms ease; }
#pricing .pricing-cta:hover { background: #f8fafc; }
#pricing .pricing__card--featured .pricing-cta { border-color: #ff4d12; background: #ff4d12; color: #fff; box-shadow: 0 1px 2px rgb(0 0 0 / 5%); }
#pricing .pricing__card--featured .pricing-cta:hover { background: #e0410c; border-color: #e0410c; }
#pricing :is(a, button):focus-visible { outline: 3px solid #9e2c00; outline-offset: 4px; }
#pricing .pricing__disclaimer { max-width: 672px; margin: 0 auto 20px; color: #6b7280; font-size: 11.5px; letter-spacing: -0.025em; }
#pricing .pricing__features { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(2, auto); grid-auto-flow: column; row-gap: 10px; max-width: 850px; margin: 0 auto 28px; border: 1px solid #e7ebf0; border-radius: 12px; padding: 14px 24px; background: rgb(255 255 255 / 80%); box-shadow: 0 2px 8px rgb(0 0 0 / 2%); list-style: none; text-align: left; }
#pricing .pricing__features li { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 0 20px; border-left: 1px solid #f1f5f9; color: #374151; font-size: 12.5px; font-weight: 600; }
#pricing .pricing__features li:nth-child(-n+2) { padding-left: 0; border: 0; }
#pricing .pricing__features li:nth-last-child(-n+2) { padding-right: 0; }
#pricing .pricing__check { display: flex; flex: 0 0 18px; align-items: center; justify-content: center; height: 18px; border-radius: 50%; background: #ff4d12; color: #fff; }
#pricing .pricing__check svg { width: 12px; height: 12px; }
.social-platforms { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 0; max-width: 850px; margin: 0 auto 18px; padding: 0; list-style: none; font-family: "Plus Jakarta Sans", sans-serif; line-height: 1.5; }
.social-platforms li { display: flex; align-items: center; gap: 6px; padding: 4px 12px; color: #374151; font-size: 12px; font-weight: 600; }
.social-platforms svg { flex: 0 0 16px; width: 16px; height: 16px; color: #000; }
#pricing .pricing__demo { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; margin: 0 0 22px; border: 0; border-radius: 8px; padding: 6px; background: transparent; color: #111827; cursor: pointer; font: 700 14.5px/1.5 "Plus Jakarta Sans", sans-serif; }
#pricing .pricing__demo:hover { color: #c83803; }
#pricing .pricing__play { display: flex; flex: 0 0 28px; align-items: center; justify-content: center; width: 28px; height: 28px; border: 2px solid #ff4d12; border-radius: 50%; padding-left: 2px; }
#pricing .pricing__play svg { width: 14px; height: 14px; fill: #ff4d12; }
#pricing .pricing__arrow { margin-left: 4px; color: #ff4d12; font-weight: 800; }
#pricing .pricing__refund { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0 0 4px; color: #2a3342; font-size: 13px; font-weight: 500; }
#pricing .pricing__refund svg { flex: 0 0 16px; width: 16px; height: 16px; color: #ff4d12; }
#pricing .pricing__renewal { margin: 0; color: #6b7280; font-size: 11.5px; }
@media (max-width: 767px) {
  #pricing { padding: 64px 16px; }
  #pricing h2 { font-size: 30px; }
  #pricing .pricing__heading p { font-size: 16px; }
  #pricing .pricing__cards { grid-template-columns: minmax(0, 1fr); }
  #pricing .pricing__features { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; grid-auto-flow: row; padding: 18px 20px; }
  #pricing .pricing__features li { padding: 0; border: 0; }
  #pricing .pricing__features li:nth-child(2n+3) { border-top: 1px solid #f1f5f9; padding-top: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  #pricing .pricing__eyebrow::before { animation: none; }
  #pricing .pricing-cta { transition: none; }
}