/* Pricing page uses the shared Home typography, header, and footer. */
.pricing-page {
  --pricing-ink: #14213d;
  --pricing-muted: #586782;
  --pricing-blue: #4568ec;
  --pricing-deep: #0c1734;
  --pricing-line: #e0e7f2;
  overflow: clip;
}
.pricing-page .section-inner { padding-block: clamp(72px, 8vw, 112px); }
.pricing-page .pricing-kicker,
.pricing-page .pricing-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 18px;
  color: #4765dc;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: .17em;
  text-transform: uppercase;
}
.pricing-page .pricing-kicker::before,
.pricing-page .pricing-eyebrow::before { content: ""; width: 18px; height: 2px; background: currentColor; }
.pricing-page .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 21px;
  border: 1px solid transparent;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  transition: transform .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.pricing-page .btn:hover { transform: translateY(-2px); }
.pricing-page .btn.primary { color: #fff; background: var(--pricing-blue); box-shadow: 0 12px 25px rgba(69, 104, 236, .22); }
.pricing-page .btn.primary:hover { color: #fff; background: #3653d4; }
.pricing-page .btn.secondary { color: var(--pricing-ink); background: #fff; border-color: #dbe3f1; }
.pricing-page .btn.secondary:hover { color: #3653d4; border-color: #9dafee; }
.pricing-page .pricing-section-heading { max-width: 760px; margin-bottom: 38px; }
.pricing-page .pricing-section-heading h2 { margin-bottom: 18px; }
.pricing-page .pricing-section-heading > p:not(.pricing-kicker) { max-width: 700px; margin: 0; color: var(--pricing-muted); font-size: 16px; line-height: 1.85; }

/* The hero shows the plan path beside the main offer. */
.pricing-page .pricing-hero {
  position: relative;
  isolation: isolate;
  color: #fff;
  background: radial-gradient(ellipse at 85% 14%, #263d8b 0%, transparent 38%),
              radial-gradient(ellipse at 2% 90%, #173373 0%, transparent 42%),
              var(--pricing-deep);
}
.pricing-page .pricing-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .23;
  background-image: linear-gradient(rgba(214, 225, 255, .08) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(214, 225, 255, .08) 1px, transparent 1px);
  background-size: 70px 70px;
  mask-image: linear-gradient(90deg, transparent, #000);
}
.pricing-page .pricing-hero .section-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(42px, 6vw, 82px);
  padding-block: clamp(82px, 9vw, 130px);
}
.pricing-page .pricing-hero-copy,
.pricing-page .pricing-hero-visual { min-width: 0; }
.pricing-page .pricing-hero .pricing-eyebrow { color: #aebfff; }
.pricing-page .pricing-hero h1 { max-width: 680px; margin-bottom: 23px; color: #fff; }
.pricing-page .pricing-hero-lead { max-width: 610px; margin-bottom: 27px; color: #c7d3ea; font-size: 17px; line-height: 1.85; }
.pricing-page .pricing-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; }
.pricing-page .pricing-hero .btn.secondary { color: #f4f6ff; background: rgba(255, 255, 255, .08); border-color: rgba(218, 228, 255, .32); }
.pricing-page .pricing-hero .btn.secondary:hover { color: #fff; background: rgba(255, 255, 255, .15); }
.pricing-page .pricing-hero-note { max-width: 610px; margin: 0; color: #aebfdf; font-size: 14px; line-height: 1.8; }
.pricing-page .pricing-hero-note strong { color: #fff; }
.pricing-page .pricing-hero-highlights { display: flex; gap: 0; margin-top: 32px; padding-top: 23px; border-top: 1px solid rgba(214, 225, 255, .19); }
.pricing-page .pricing-hero-highlights > span { display: grid; gap: 2px; flex: 1; min-width: 0; padding-right: 14px; margin-right: 14px; border-right: 1px solid rgba(214, 225, 255, .19); }
.pricing-page .pricing-hero-highlights > span:last-child { border: 0; margin: 0; padding: 0; }
.pricing-page .pricing-hero-highlights strong { color: #fff; font: 800 20px/1.2 Inter, "Poppins", sans-serif; letter-spacing: -.04em; }
.pricing-page .pricing-hero-highlights small { color: #aebcda; font-size: 12px; line-height: 1.5; }
.pricing-page .pricing-hero-visual { position: relative; }
.pricing-page .pricing-hero-visual::before { content: ""; position: absolute; z-index: -1; inset: 10% -7%; border-radius: 50%; background: #6f85ff; filter: blur(75px); opacity: .26; }
.pricing-page .pricing-path-card { overflow: hidden; border: 1px solid rgba(219, 228, 255, .35); border-radius: 20px; background: #fff; box-shadow: 0 28px 72px rgba(3, 10, 39, .3), 0 0 0 8px rgba(255, 255, 255, .045); }
.pricing-page .pricing-window-bar { display: flex; align-items: center; gap: 12px; min-height: 49px; padding: 9px 19px; border-bottom: 1px solid #e6ebf4; color: #6e7b91; font-size: 12px; font-weight: 700; }
.pricing-page .pricing-window-dots { display: inline-flex; gap: 5px; }
.pricing-page .pricing-window-dots i { width: 7px; height: 7px; border-radius: 50%; background: #d3dceb; }
.pricing-page .pricing-window-dots i:first-child { background: #86d4b7; }
.pricing-page .pricing-window-badge { margin-left: auto; padding: 4px 8px; border-radius: 6px; color: #4560c5; background: #edf1ff; font-size: 12px; }
.pricing-page .pricing-path-body { padding: clamp(23px, 3vw, 34px); }
.pricing-page .pricing-mini-label { margin: 0 0 8px; color: #4867db; font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.pricing-page .pricing-path-body h2 { max-width: 410px; margin: 0 0 25px; color: #1a2c50; font-size: 1.2rem; line-height: 1.35; font-weight: 750; }
.pricing-page .pricing-path-step { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 16px; border: 1px solid #e5eaf3; border-radius: 12px; background: #f9fbff; }
.pricing-page .pricing-path-step-free { border-color: #cdd9ff; background: #eff3ff; }
.pricing-page .pricing-path-number { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; color: #4262d4; background: #e4ebff; font-size: 12px; font-weight: 800; }
.pricing-page .pricing-path-step div { display: grid; gap: 3px; }
.pricing-page .pricing-path-step strong { color: #24375e; font-size: 14px; line-height: 1.5; }
.pricing-page .pricing-path-step small { color: #75849e; font-size: 12px; line-height: 1.5; }
.pricing-page .pricing-path-step b { color: #223967; font-size: 16px; white-space: nowrap; }
.pricing-page .pricing-path-line { width: 1px; height: 15px; margin-left: 31px; background: #d8e0ef; }
.pricing-page .pricing-path-footer { display: flex; align-items: center; gap: 9px; margin-top: 22px; color: #6f7e96; font-size: 12px; }
.pricing-page .pricing-status-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: #55c89e; box-shadow: 0 0 0 4px #e1f7ee; }

/* Brief assurances form a quiet divider before the plan cards. */
.pricing-page .pricing-proof-strip { background: #edf2fc; border-bottom: 1px solid #e1e8f5; }
.pricing-page .pricing-proof-strip .section-inner { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); padding-block: 25px; }
.pricing-page .pricing-proof-strip span { display: grid; gap: 2px; justify-content: center; padding: 8px 16px; text-align: center; }
.pricing-page .pricing-proof-strip span + span { border-left: 1px solid #d6e0f0; }
.pricing-page .pricing-proof-strip b { color: #263b6d; font-size: 13px; }
.pricing-page .pricing-proof-strip small { color: #71819c; font-size: 12px; line-height: 1.5; }

/* Three tiers, with the free starting point emphasized. */
.pricing-page .pricing-plans { background: #f7f9fd; }
.pricing-page .pricing-plans .section-inner { padding-bottom: clamp(85px, 9vw, 120px); }
.pricing-page .pricing-plan-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; align-items: stretch; }
.pricing-page .pricing-plan-card { display: flex; flex-direction: column; min-width: 0; padding: clamp(22px, 2.5vw, 31px); border: 1px solid #dce4f0; border-radius: 18px; background: #fff; box-shadow: 0 14px 36px rgba(22, 40, 85, .05); }
.pricing-page .pricing-plan-card-free { position: relative; border-color: #7190f5; box-shadow: 0 22px 48px rgba(69, 104, 236, .14); transform: translateY(-8px); }
.pricing-page .pricing-plan-card-free::before { content: ""; position: absolute; top: 0; right: 20px; left: 20px; height: 3px; border-radius: 0 0 4px 4px; background: linear-gradient(90deg, #4568ec, #91a7ff); }
.pricing-page .pricing-plan-card-top { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between; min-height: 27px; margin-bottom: 22px; }
.pricing-page .pricing-plan-badge { color: #4564d0; font-size: 12px; font-weight: 800; line-height: 1.5; }
.pricing-page .pricing-recommended { padding: 5px 9px; border-radius: 100px; color: #4160cc; background: #edf1ff; font-size: 12px; font-weight: 800; line-height: 1.4; }
.pricing-page .pricing-plan-card h3 { margin: 0 0 8px; color: #1b2e53; }
.pricing-page .pricing-plan-best-for { min-height: 78px; margin: 0 0 20px; color: #63728a; font-size: 15px; line-height: 1.8; }
.pricing-page .pricing-amount { display: flex; align-items: baseline; gap: 4px; margin: 0 0 22px; padding-bottom: 20px; border-bottom: 1px solid #e7ecf4; color: #1e3157; }
.pricing-page .pricing-amount > span { font-size: 20px; font-weight: 800; }
.pricing-page .pricing-amount strong { font: 800 3.6rem/1 Inter, "Poppins", sans-serif; letter-spacing: -.07em; }
.pricing-page .pricing-amount small { margin-left: 5px; color: #73829a; font-size: 13px; }
.pricing-page .pricing-plan-description { margin: 0 0 18px; color: #5f6e86; font-size: 15px; line-height: 1.8; }
.pricing-page .pricing-feature-list { display: grid; gap: 11px; margin: 0 0 22px; padding: 0; list-style: none; }
.pricing-page .pricing-feature-list li { position: relative; padding-left: 25px; color: #3c4e6f; font-size: 14px; line-height: 1.65; }
.pricing-page .pricing-feature-list li::before { content: "✓"; position: absolute; left: 0; color: #4f72d9; font-weight: 800; }
.pricing-page .pricing-plan-note { margin: auto 0 20px; padding-top: 17px; border-top: 1px solid #e7ecf4; color: #6d7b93; font-size: 13px; line-height: 1.7; }
.pricing-page .pricing-plan-note strong { color: #31486f; }
.pricing-page .pricing-plan-card .btn { width: 100%; }

/* The comparison is a readable table with its own scroll container. */
.pricing-page .pricing-comparison { background: #fff; }
.pricing-page .pricing-section-heading-left { max-width: 820px; }
.pricing-page .pricing-table-wrap { overflow-x: auto; border: 1px solid #dce4f0; border-radius: 17px; box-shadow: 0 14px 36px rgba(22, 40, 85, .045); }
.pricing-page .pricing-table { width: 100%; min-width: 690px; border-collapse: collapse; text-align: left; }
.pricing-page .pricing-table caption { padding: 0; height: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.pricing-page .pricing-table thead { background: #122652; }
.pricing-page .pricing-table th,
.pricing-page .pricing-table td { padding: 17px 20px; border-bottom: 1px solid #e7ecf4; font-size: 14px; line-height: 1.55; }
.pricing-page .pricing-table thead th { color: #fff; font-size: 13px; font-weight: 800; }
.pricing-page .pricing-table tbody th { width: 34%; color: #26395d; font-weight: 700; }
.pricing-page .pricing-table tbody td { color: #5a6a84; }
.pricing-page .pricing-table tbody tr:nth-child(even) { background: #f8faff; }
.pricing-page .pricing-table tbody tr:last-child th,
.pricing-page .pricing-table tbody tr:last-child td { border-bottom: 0; }
.pricing-page .pricing-table thead th:nth-child(2) { background: #3b58c2; }
.pricing-page .pricing-table tbody td:nth-child(2) { color: #3453b8; background: rgba(233, 239, 255, .48); font-weight: 700; }
.pricing-page .pricing-table-note { max-width: 800px; margin: 19px 0 0; color: #66758e; font-size: 14px; line-height: 1.8; }

/* A horizontal decision path follows the detailed table. */
.pricing-page .pricing-fit { color: #fff; background: radial-gradient(ellipse at 100% 0, #233d88, transparent 42%), #101e3d; }
.pricing-page .pricing-fit .pricing-kicker { color: #b7c6ff; }
.pricing-page .pricing-fit h2 { color: #fff; }
.pricing-page .pricing-fit .pricing-section-heading > p:not(.pricing-kicker) { color: #b8c7e1; }
.pricing-page .pricing-fit-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(22px, 3vw, 42px); }
.pricing-page .pricing-fit-grid article { position: relative; padding: 28px 0 0; border-top: 2px solid rgba(211, 224, 255, .24); }
.pricing-page .pricing-fit-grid article::before { content: ""; position: absolute; top: -6px; left: 0; width: 10px; height: 10px; border-radius: 50%; background: #90a7ff; box-shadow: 0 0 0 5px rgba(125, 150, 245, .16); }
.pricing-page .pricing-fit-number { display: block; margin-bottom: 18px; color: #9aaff5; font-size: 12px; font-weight: 800; letter-spacing: .12em; }
.pricing-page .pricing-fit-grid h3 { margin-bottom: 12px; color: #fff; }
.pricing-page .pricing-fit-grid p { min-height: 110px; margin-bottom: 14px; color: #b8c7e1; font-size: 15px; line-height: 1.8; }
.pricing-page .pricing-fit-grid a { color: #c7d3ff; font-size: 14px; font-weight: 800; text-decoration: none; }
.pricing-page .pricing-fit-grid a:hover { color: #fff; }

/* Product foundation uses an editorial split and a focused inset panel. */
.pricing-page .pricing-foundation { background: #edf2fc; }
.pricing-page .pricing-foundation-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); align-items: center; gap: clamp(40px, 7vw, 95px); }
.pricing-page .pricing-foundation-grid > div:first-child > p:not(.pricing-kicker) { max-width: 650px; color: #5a6a83; font-size: 16px; line-height: 1.85; }
.pricing-page .pricing-foundation-grid h2 { margin-bottom: 23px; }
.pricing-page .pricing-foundation-grid a { color: #3658d0; font-weight: 700; }
.pricing-page .pricing-foundation-card { padding: clamp(28px, 4vw, 45px); border: 1px solid #d6e0f3; border-radius: 19px; background: #fff; box-shadow: 0 19px 45px rgba(27, 47, 96, .08); }
.pricing-page .pricing-foundation-icon { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 25px; border-radius: 12px; color: #4a69d9; background: #edf1ff; font-size: 24px; font-weight: 700; }
.pricing-page .pricing-foundation-card h3 { margin-bottom: 18px; }
.pricing-page .pricing-foundation-card ul { display: grid; gap: 13px; margin: 0; padding: 0; list-style: none; }
.pricing-page .pricing-foundation-card li { position: relative; padding-left: 27px; color: #586b86; font-size: 15px; line-height: 1.7; }
.pricing-page .pricing-foundation-card li::before { content: "✓"; position: absolute; left: 0; color: #5874df; font-weight: 800; }

/* FAQs stay in a single reading column beside the section heading. */
.pricing-page .pricing-faq { background: #fff; }
.pricing-page .pricing-faq .section-inner { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); align-items: start; gap: clamp(42px, 7vw, 100px); }
.pricing-page .pricing-faq .pricing-section-heading { position: sticky; top: 115px; margin: 0; }
.pricing-page .pricing-faq-grid { border-top: 1px solid #dce4f0; }
.pricing-page .pricing-faq details { border-bottom: 1px solid #dce4f0; }
.pricing-page .pricing-faq summary { position: relative; padding: 22px 34px 22px 0; color: #1c3056; font-size: 1.2rem; font-weight: 750; line-height: 1.35; cursor: pointer; list-style: none; }
.pricing-page .pricing-faq summary::-webkit-details-marker { display: none; }
.pricing-page .pricing-faq summary::after { content: "+"; position: absolute; right: 3px; top: 17px; color: #5472da; font-size: 24px; font-weight: 400; }
.pricing-page .pricing-faq details[open] summary::after { content: "−"; }
.pricing-page .pricing-faq details p { margin: 0 0 23px; color: #5d6d86; font-size: 15px; line-height: 1.85; }

/* Terms are presented as short numbered policy notes. */
.pricing-page .pricing-terms { background: #f4f7fc; border-top: 1px solid #e7edf7; }
.pricing-page .pricing-terms-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; counter-reset: term; }
.pricing-page .pricing-terms-grid article { padding: 28px; border: 1px solid #dfe7f3; border-radius: 15px; background: #fff; counter-increment: term; }
.pricing-page .pricing-terms-grid article::before { content: counter(term, decimal-leading-zero); display: block; margin-bottom: 20px; color: #667ee4; font-size: 12px; font-weight: 800; letter-spacing: .12em; }
.pricing-page .pricing-terms-grid h3 { margin-bottom: 10px; }
.pricing-page .pricing-terms-grid p { margin: 0; color: #5f6f87; font-size: 15px; line-height: 1.8; }

/* Full-width finish with a centered offer. */
.pricing-page .pricing-final-cta { position: relative; overflow: hidden; color: #fff; background: radial-gradient(ellipse at 50% -40%, #738aff 0%, transparent 66%), linear-gradient(125deg, #253f98, #1a2c6a); }
.pricing-page .pricing-final-cta::before { content: ""; position: absolute; inset: 0; opacity: .12; background-image: radial-gradient(#fff 1px, transparent 1px); background-size: 20px 20px; }
.pricing-page .pricing-final-cta .section-inner { position: relative; text-align: center; }
.pricing-page .pricing-final-cta .pricing-kicker { color: #d6e0ff; }
.pricing-page .pricing-final-cta h2 { max-width: 840px; margin: 0 auto 18px; color: #fff; }
.pricing-page .pricing-final-cta p:not(.pricing-kicker) { max-width: 700px; margin: 0 auto; color: #dce5ff; font-size: 17px; line-height: 1.85; }
.pricing-page .pricing-final-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 30px; }
.pricing-page .pricing-final-cta .btn.primary { color: #213b8a; background: #fff; box-shadow: 0 14px 30px rgba(8, 19, 57, .2); }
.pricing-page .pricing-final-cta .btn.primary:hover { color: #172e75; background: #eef2ff; }
.pricing-page .pricing-final-cta .btn.secondary { color: #fff; background: rgba(255, 255, 255, .09); border-color: rgba(233, 240, 255, .46); }
.pricing-page .pricing-final-cta .btn.secondary:hover { color: #fff; background: rgba(255, 255, 255, .18); }

.custom-footer .footer-link-group a[aria-current="page"] { color: #fff; font-weight: 800; }

@media (max-width: 1000px) {
  .pricing-page .pricing-hero .section-inner,
  .pricing-page .pricing-foundation-grid,
  .pricing-page .pricing-faq .section-inner { grid-template-columns: 1fr; }
  .pricing-page .pricing-hero-visual { max-width: 690px; }
  .pricing-page .pricing-faq .section-inner { gap: 34px; }
  .pricing-page .pricing-faq .pricing-section-heading { position: static; }
}
@media (max-width: 800px) {
  .pricing-page .pricing-plan-grid { grid-template-columns: 1fr; }
  .pricing-page .pricing-plan-card-free { transform: none; }
  .pricing-page .pricing-plan-best-for { min-height: 0; }
  .pricing-page .pricing-fit-grid,
  .pricing-page .pricing-terms-grid { grid-template-columns: 1fr; }
  .pricing-page .pricing-fit-grid p { min-height: 0; }
}
@media (max-width: 650px) {
  .pricing-page .section-inner { padding-block: 65px; }
  .pricing-page .pricing-proof-strip .section-inner { grid-template-columns: repeat(2, minmax(0, 1fr)); padding-block: 14px; }
  .pricing-page .pricing-proof-strip span:nth-child(3) { border-left: 0; }
  .pricing-page .pricing-proof-strip span:nth-child(n + 3) { border-top: 1px solid #d6e0f0; }
  .pricing-page .pricing-hero-highlights { margin-top: 27px; }
  .pricing-page .pricing-hero-highlights strong { font-size: 16px; }
}
@media (max-width: 560px) {
  .pricing-page .pricing-hero .section-inner { gap: 46px; }
  .pricing-page .pricing-hero-lead,
  .pricing-page .pricing-final-cta p:not(.pricing-kicker) { font-size: 16px; }
  .pricing-page .pricing-hero-actions,
  .pricing-page .pricing-final-actions { flex-direction: column; align-items: stretch; }
  .pricing-page .pricing-hero-actions .btn,
  .pricing-page .pricing-final-actions .btn { width: 100%; }
  .pricing-page .pricing-path-step { grid-template-columns: 28px minmax(0, 1fr); }
  .pricing-page .pricing-path-step b { grid-column: 2; }
  .pricing-page .pricing-path-line { margin-left: 29px; }
  .pricing-page .pricing-proof-strip span { padding-inline: 7px; }
}