.pricing-page { max-width:1180px; padding-bottom:96px; }
.pricing-hero { max-width:760px; margin:72px auto 58px; text-align:center; }
.pricing-hero .pricing-kicker { display:inline-flex; padding:8px 14px; border-radius:999px; color:var(--blue-60); background:var(--blue-10); font-size:13px; font-weight:700; }
.pricing-hero h1 { margin:20px 0 16px; font-size:clamp(42px,6vw,68px); line-height:1.05; }
.pricing-hero .lede { max-width:660px; margin:0 auto; font-size:18px; }
.pricing-hero .updated { margin:14px auto 0; }

.pricing-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; align-items:stretch; }
.pricing-card { min-height:410px; display:flex; flex-direction:column; padding:32px; border:1px solid var(--border); border-radius:28px; background:#fff; box-shadow:0 8px 28px rgba(11,17,48,.05); }
.pricing-card.featured { position:relative; border:2px solid var(--blue-50); box-shadow:0 22px 56px rgba(80,144,255,.14); }
.pricing-tag { position:absolute; top:-14px; left:28px; padding:6px 13px; border-radius:999px; color:#fff; background:var(--blue-50); font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.pricing-card h2 { margin:0 0 12px; font-size:22px; }
.pricing-amount { display:flex; align-items:baseline; flex-wrap:wrap; gap:5px; min-height:50px; color:var(--blue-70); font-family:var(--font-display); font-size:36px; font-weight:800; letter-spacing:-.03em; }
.pricing-amount small { color:var(--text-3); font-family:var(--font); font-size:13px; font-weight:600; letter-spacing:0; }
.pricing-summary { min-height:42px; margin:4px 0 22px !important; color:var(--text-3) !important; font-size:13.5px !important; }
.pricing-list { min-height:130px; margin:0 0 24px !important; padding:0 !important; list-style:none; gap:12px !important; }
.pricing-list li { position:relative; padding-left:24px; font-size:14px; }
.pricing-list li::before { content:"✓"; position:absolute; left:0; top:0; color:var(--green-deep); font-weight:800; }
.pricing-card .btn { width:100%; margin-top:auto; justify-content:center; }
.pricing-page .btn-primary,
.pricing-page .btn-primary:hover { color:#fff; }

.pricing-calc { margin:32px 0 0; padding:36px; border:1px solid rgba(80,144,255,.18); border-radius:30px; background:#fff; box-shadow:0 24px 64px rgba(40,72,120,.09); }
.pricing-calc-head { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; margin-bottom:28px; }
.pricing-calc-head h2 { margin:0 0 5px; font-size:24px; }
.pricing-calc-head p { margin:0; }
.pricing-calc-badge { flex-shrink:0; padding:8px 13px; border-radius:999px; color:var(--blue-60); background:var(--blue-10); font-size:12px; font-weight:700; }
.pricing-calc-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr); gap:42px; }
.pricing-controls { padding:12px 0; }
.pricing-controls label { display:flex; justify-content:space-between; align-items:baseline; margin:0 0 8px; color:var(--text-2); font-size:13px; font-weight:700; }
.pricing-controls label + input + label { margin-top:32px; }
.pricing-controls output { color:var(--blue-90); font-family:var(--font-display); font-size:22px; font-weight:800; }
.pricing-controls input[type=range] { width:100%; height:6px; accent-color:var(--blue-50); }
.pricing-result { min-height:250px; display:flex; flex-direction:column; align-items:flex-start; padding:28px; border-radius:24px; background:var(--blue-10); }
.pricing-result-label { color:var(--blue-60); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.pricing-result > strong { margin-top:8px; color:var(--blue-90); font-size:19px; }
.pricing-result-price { display:flex; align-items:baseline; gap:6px; margin:8px 0 16px; }
.pricing-result-price output { color:var(--blue-60); font-family:var(--font-display); font-size:46px; font-weight:800; letter-spacing:-.04em; }
.pricing-result-price small { color:var(--text-3); font-size:13px; font-weight:600; }
.pricing-result-meta { display:flex; flex-direction:column; gap:5px; margin-bottom:22px; color:var(--text-2); font-size:13px; }
.pricing-result .btn { width:100%; margin-top:auto; justify-content:center; }
.pricing-calc-note { max-width:none !important; margin:20px 0 0 !important; color:var(--text-3) !important; font-size:12.5px !important; }

.pricing-details { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-top:72px; }
.pricing-detail { padding:28px; border:1px solid var(--border); border-radius:24px; background:var(--surface-2); }
.pricing-detail h2 { margin:0 0 10px; font-size:19px; }
.pricing-detail p { margin:0; font-size:14px; }
.pricing-tw { display:flex; justify-content:space-between; align-items:center; gap:28px; margin-top:24px; padding:26px 28px; border-radius:24px; background:var(--blue-90); }
.pricing-tw h2 { margin:0 0 5px; color:#fff; }
.pricing-tw p { max-width:720px; margin:0; color:#c9d7ed; }
.pricing-tw .btn { flex-shrink:0; background:#fff; color:var(--blue-70); }
.pricing-tw .pricing-tw-rule { margin-top:10px; font-size:13px; color:#9fb3d1; }
.pricing-tw .pricing-tw-rule a { color:#fff; }
.pricing-sandbox { margin-top:24px; padding:28px; border:1px solid var(--border); border-radius:24px; background:#fff; }
.pricing-sandbox h2 { margin:0 0 12px; font-size:19px; }
.pricing-sandbox ul { margin:0; padding-left:20px; }
.pricing-sandbox li { margin:0 0 8px; font-size:14px; }
.pricing-faq { max-width:760px; margin:72px auto 0; }
.pricing-faq h2 { margin:0 0 8px; font-size:24px; }
.pricing-faq h3 { margin:24px 0 6px; font-size:16px; }
.pricing-faq p { margin:0; font-size:14.5px; }

@media (max-width:900px) {
  .pricing-grid,.pricing-details { grid-template-columns:1fr; }
  .pricing-card { min-height:auto; }
  .pricing-summary,.pricing-list { min-height:auto; }
  .pricing-calc-grid { grid-template-columns:1fr; }
  .pricing-tw { align-items:flex-start; flex-direction:column; }
}
@media (max-width:640px) {
  .pricing-hero { margin:48px auto 42px; text-align:left; }
  .pricing-hero h1 { font-size:42px; }
  .pricing-card,.pricing-calc { padding:24px 20px; border-radius:24px; }
  .pricing-calc-head { flex-direction:column; gap:12px; }
  .pricing-result { min-height:225px; padding:22px; }
  .pricing-result-price output { font-size:40px; }
}