.pricing-page {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 28px 88px;
}

.pricing-intro {
  max-width: 760px;
  padding: 76px 0 52px;
}

.pricing-intro h1 {
  margin: 0;
  color: #14382a;
  font-size: clamp(42px, 5vw, 62px);
  line-height: 1.22;
  letter-spacing: -.045em;
}

.pricing-intro > p:not(.eyebrow) {
  max-width: 630px;
  margin: 21px 0 0;
  color: #63746b;
  line-height: 1.8;
}

.pricing-intro a { color: #176140; text-underline-offset: 3px; }

.pricing {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
  align-items: center;
  gap: clamp(30px, 6vw, 80px);
  padding: 48px 0 72px;
  border-top: 1px solid #dce7dd;
  border-bottom: 1px solid #dce7dd;
}

.pricing-copy h2 {
  max-width: 600px;
  margin: 0 0 20px;
  color: #14382a;
  font-size: clamp(31px, 3.5vw, 44px);
  line-height: 1.27;
  letter-spacing: -.04em;
}

.pricing-copy > p:not(.eyebrow) {
  max-width: 570px;
  margin: 0 0 16px;
  color: #5e7065;
  line-height: 1.8;
}

.pricing-copy .pricing-scope { font-size: 13px; }

.pricing-card {
  padding: 30px;
  border: 1px solid #cfe2d3;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 16px 46px #123d2410;
}

.pricing-label { color: #346b49; font-size: 13px; font-weight: 700; }

.pricing-amount {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin: 11px 0 5px;
  color: #143f2a;
  font-variant-numeric: tabular-nums;
}

.pricing-amount span { font-size: 25px; }
.pricing-amount strong { font-size: 58px; line-height: 1; letter-spacing: -.06em; }

.pricing-card p {
  margin: 12px 0 20px;
  color: #5e7065;
  line-height: 1.7;
  font-size: 14px;
}

.pricing-card ol {
  display: grid;
  gap: 11px;
  margin: 0 0 23px;
  padding: 17px 0 0 21px;
  border-top: 1px solid #e2ebe3;
  color: #344e3c;
  line-height: 1.45;
  font-size: 14px;
}

.pricing-card .primary-action { width: 100%; }
.pricing-card small { display: block; margin-top: 12px; color: #6f8174; }

.pricing-contact {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: 58px 0 0;
  scroll-margin-top: 24px;
}

.pricing-contact h2 { margin: 0 0 13px; font-size: 27px; }
.pricing-contact p:not(.eyebrow) { max-width: 620px; color: #5e7065; line-height: 1.8; }
.pricing-contact a { color: #176140; text-underline-offset: 3px; }
.pricing-contact img { width: 180px; height: 180px; object-fit: contain; border-radius: 12px; }

@media (max-width: 760px) {
  .pricing-intro { padding: 55px 0 42px; }
  .pricing { grid-template-columns: 1fr; gap: 20px; }
  .topbar { flex-direction: column; align-items: stretch; gap: 12px; }
  .topbar nav { width: 100%; gap: 16px; flex-wrap: wrap; }
  .topbar nav > a[href="./#courses"],
  .topbar nav > a[href="./exams.html"],
  .topbar nav > a[href="./pricing.html"] { display: inline-block; }
  .pricing-contact { align-items: flex-start; }
}

@media (max-width: 560px) {
  .pricing-page { padding: 0 18px 58px; }
  .pricing-intro { padding: 46px 0 36px; }
  .pricing-intro h1 { font-size: 42px; }
  .pricing-card { padding: 24px; }
  .pricing-amount strong { font-size: 52px; }
  .pricing-contact { flex-direction: column; padding-top: 44px; }
  .topbar { padding: 14px 18px; gap: 10px; }
  .topbar .brand { font-size: 17px; gap: 8px; }
  .topbar .brand-mark { width: 34px; height: 34px; }
  .topbar nav { gap: 10px; }
  .topbar nav a { font-size: 13px; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }