/* Polished, customer-facing home and pricing screens. */
.top-nav-pricing {
  min-height: 42px;
  padding: 0 13px;
  border: 1px solid transparent;
  border-radius: 11px;
  background: transparent;
  color: #c2d1ca;
  font-size: 14px;
  font-weight: 700;
}
.top-nav-pricing:hover,
.top-nav-pricing.active {
  border-color: #315241;
  background: #17271f;
  color: #a8f1d0;
}
.side-brand small { font-size: 12px !important; }

.home-pricing-preview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin: 22px 0 30px;
  padding: 24px 27px;
  border: 1px solid #31513f;
  border-radius: 20px;
  background: radial-gradient(ellipse at 100% 0, #1d4432 0, transparent 48%), #141b17;
}
.home-pricing-copy { max-width: 680px; }
.home-pricing-copy h2 {
  margin: 7px 0 6px;
  color: #f1f7f4;
  font: 800 clamp(21px, 2vw, 27px)/1.2 "Manrope", sans-serif;
  letter-spacing: -.6px;
}
.home-pricing-copy p { margin: 0; color: #acbbb3; font-size: 14px; line-height: 1.5; }
.home-price-points { display: flex; flex-wrap: wrap; gap: 9px 22px; margin-top: 15px; color: #c2d1ca; font-size: 13px; }
.home-price-points b { color: #a5f0cf; }
.home-pricing-preview > .btn { flex: 0 0 auto; }

.pricing-page { max-width: 1420px; }
.pricing-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 240px;
  align-items: center;
  gap: 32px;
  min-height: 270px;
  overflow: hidden;
  padding: 36px 42px;
  border: 1px solid #2b4035;
  border-radius: 26px;
  background: radial-gradient(ellipse at 82% 45%, #1c4835 0, transparent 38%), linear-gradient(120deg, #171e1a, #101512 75%);
}
.pricing-hero h1 {
  max-width: 720px;
  margin: 11px 0 12px;
  color: #f1f7f4;
  font: 800 clamp(34px, 4.5vw, 52px)/1.08 "Manrope", sans-serif;
  letter-spacing: -1.8px;
}
.pricing-hero p { max-width: 660px; margin: 0; color: #b2c0b9; font-size: 16px; line-height: 1.6; }
.pricing-minimum-banner {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 22px;
  padding: 12px 15px;
  border: 1px solid #356249;
  border-radius: 14px;
  background: #15271e;
}
.pricing-minimum-banner > span:first-child { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #1d4b36; color: #a4f3ce; font-size: 16px; font-weight: 900; }
.pricing-minimum-banner strong, .pricing-minimum-banner small { display: block; }
.pricing-minimum-banner strong { color: #e6f8ee; font-size: 14px; }
.pricing-minimum-banner small { margin-top: 3px; color: #afc0b6; font-size: 12px; }
.pricing-hero-art { position: relative; display: grid; place-items: center; width: 205px; height: 205px; justify-self: center; border: 1px solid #3b7052; border-radius: 50%; background: radial-gradient(circle, #1d4934, #142019 68%); box-shadow: 0 0 0 18px #1b382922, 0 0 0 36px #1b382916; }
.pricing-hero-art > span { color: #a5f0cf; font: 800 93px/1 "Manrope", sans-serif; letter-spacing: -7px; }
.pricing-hero-art i { position: absolute; top: 30px; right: 25px; color: #d1f7ab; font-size: 20px; font-style: normal; }
.pricing-hero-art b { position: absolute; right: -12px; bottom: 5px; padding: 10px 13px; border: 1px solid #3e5946; border-radius: 12px; background: #18231c; color: #d9e8df; font-size: 13px; line-height: 1.15; transform: rotate(5deg); }

.pricing-offer-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; margin: 20px 0; }
.pricing-offer { position: relative; min-width: 0; padding: 22px; border: 1px solid #2b3932; border-radius: 19px; background: linear-gradient(150deg, #171e1b, #121715); }
.pricing-offer-featured { border-color: #39714f; background: radial-gradient(ellipse at 100% 0, #1c3b2c, transparent 60%), linear-gradient(150deg, #172019, #121715); }
.pricing-offer-icon { display: grid; place-items: center; width: 37px; height: 37px; margin-bottom: 17px; border: 1px solid #365444; border-radius: 12px; background: #17291f; color: #a4f0ce; font-size: 12px; font-weight: 900; }
.pricing-offer-label { display: block; color: #90b7a2; font-size: 12px; font-weight: 800; letter-spacing: 1px; }
.pricing-offer h3 { min-height: 50px; margin: 7px 0 5px; color: #f0f6f2; font: 800 18px/1.35 "Manrope", sans-serif; }
.pricing-offer > strong { display: block; color: #a6f1cf; font: 800 26px/1.25 "Manrope", sans-serif; letter-spacing: -.6px; }
.pricing-offer > strong small { color: #aab9b1; font: 600 13px "DM Sans", sans-serif; letter-spacing: 0; }
.pricing-offer p { min-height: 61px; margin: 10px 0 16px; color: #aab9b1; font-size: 13px; line-height: 1.55; }
.pricing-example { display: block; padding-top: 13px; border-top: 1px solid #2d3b33; color: #bdcbc3; font-size: 13px; }
.pricing-example b { color: #eff8f2; font-size: 16px; }

.pricing-volume { margin: 20px 0; padding: 26px; border: 1px solid #355440; border-radius: 22px; background: linear-gradient(145deg, #151d19, #111614); }
.pricing-volume-heading h2 { margin: 6px 0; color: #f1f7f4; font: 800 clamp(23px, 3vw, 31px)/1.2 "Manrope", sans-serif; letter-spacing: -.7px; }
.pricing-volume-heading p { margin: 0; color: #aab9b1; font-size: 14px; line-height: 1.55; }
.pricing-volume-heading p b { color: #b9f4cf; }
.pricing-volume-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 19px; }
.pricing-volume-card { min-width: 0; overflow: hidden; border: 1px solid #dce7df; border-radius: 17px; background: #fff; color: #17352d; }
.pricing-volume-card > header { display: flex; flex-direction: column; gap: 4px; min-height: 72px; padding: 15px 16px 12px; border-bottom: 1px solid #e1ebe3; background: #f5faf6; }
.pricing-volume-card > header span { color: #17352d; font: 800 17px/1.25 "Manrope", sans-serif; }
.pricing-volume-card > header small { color: #526b62; font-size: 12px; }
.pricing-volume-best { border-color: #25a968; box-shadow: 0 0 0 2px #25a96820; }
.pricing-volume-best > header { background: #eaf8ee; }
.pricing-volume-option { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 75px; padding: 12px 14px; border-top: 1px solid #e9efea; }
.pricing-volume-option:first-child { border-top: 0; }
.pricing-volume-option > span { display: grid; gap: 3px; min-width: 0; }
.pricing-volume-option b { color: #17352d; font-size: 14px; }
.pricing-volume-option > span small { color: #526b62; font-size: 12px; line-height: 1.35; }
.pricing-volume-option > strong { flex: 0 0 auto; color: #075e54; font: 800 20px/1 "Manrope", sans-serif; text-align: right; white-space: nowrap; }
.pricing-volume-option > strong small { display: block; margin-top: 4px; color: #526b62; font: 700 11px "DM Sans", sans-serif; }
.pricing-volume-full { background: #f0faf3; }
.pricing-volume-full b { color: #075e54; }
.pricing-volume-best .pricing-volume-full { background: #e3f5e8; }
.pricing-volume-example { margin: 15px 0 0; padding: 12px 14px; border-radius: 12px; background: #eaf5ed; color: #36574b; font-size: 13px; line-height: 1.5; }
.pricing-volume-example b { color: #075e54; }
.pricing-volume-rates { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 14px; margin-top: 14px; padding: 16px; border: 1px solid #cfe5d5; border-radius: 14px; background: #f1f8f2; color: #36574b; font-size: 14px; }
.pricing-volume-rates > b, .pricing-volume-rates > small { grid-column: 1 / -1; }
.pricing-volume-rates > b { color: #17352d; }
.pricing-volume-rates strong { color: #075e54; }
.pricing-volume-rates > small { color: #526b62; font-size: 12px; }

.pricing-thresholds {
  margin: 20px 0 0;
  padding: 28px;
  border: 1px solid #355440;
  border-radius: 22px;
  background: linear-gradient(145deg, #151d19, #111614);
}
.pricing-threshold-head { max-width: 780px; }
.pricing-threshold-head h2 { margin: 7px 0 7px; color: #f1f7f4; font: 800 clamp(22px, 3vw, 30px)/1.2 "Manrope", sans-serif; letter-spacing: -.7px; }
.pricing-threshold-head p { margin: 0; color: #aab9b1; font-size: 14px; line-height: 1.6; }
.pricing-threshold-head p b { color: #dff5e7; }
.pricing-threshold-table { margin-top: 20px; overflow-x: auto; border: 1px solid #314238; border-radius: 15px; }
.pricing-threshold-row { display: grid; grid-template-columns: 1.45fr repeat(3, minmax(132px, 1fr)); min-width: 675px; border-top: 1px solid #2d3b33; }
.pricing-threshold-row:first-child { border-top: 0; }
.pricing-threshold-row > * { display: flex; align-items: center; min-height: 62px; padding: 13px 15px; border-left: 1px solid #2d3b33; color: #dce8e0; font-size: 14px; }
.pricing-threshold-row > :first-child { border-left: 0; }
.pricing-threshold-row strong { color: #eff8f2; font: 800 14px/1.3 "Manrope", sans-serif; }
.pricing-threshold-row strong small { display: block; margin-top: 3px; color: #9eb1a7; font: 600 12px/1.3 "DM Sans", sans-serif; }
.pricing-threshold-labels { background: #101713; }
.pricing-threshold-labels > * { min-height: 46px; color: #9eb1a7; font-size: 12px; font-weight: 800; letter-spacing: .35px; }
.pricing-threshold-full { background: radial-gradient(ellipse at 0 50%, #1b3728 0, transparent 70%), #16201a; }
.pricing-threshold-full > :first-child { color: #a6f1cf; }
.threshold-save { color: #b9f4cf !important; font-weight: 800; background: linear-gradient(90deg, #173326, #14231b); }

.pricing-calculator {
  max-width: 100%;
  margin: 22px 0 0;
  padding: 28px;
  border: 1px solid #355440;
  border-radius: 22px;
  background: radial-gradient(ellipse at 100% 0, #1c3b2c 0, transparent 44%), linear-gradient(145deg, #151d19, #111614);
}
.calculator-intro h2 { margin: 6px 0; color: #f1f7f4; font: 800 clamp(23px, 3vw, 30px)/1.2 "Manrope", sans-serif; letter-spacing: -.7px; }
.calculator-intro p { margin: 0; color: #aab9b1; font-size: 14px; }
.pricing-calculator .simulator-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 17px; margin-top: 17px; }
.pricing-calculator .field { display: grid; gap: 8px; margin: 8px 0; color: #dce8e0; font-size: 14px; font-weight: 700; }
.pricing-calculator .input, .pricing-calculator .select { min-height: 48px; font-size: 15px; }
.pricing-calculator .simulator-check { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; min-height: 62px; margin-top: 5px; padding: 13px 15px; border: 1px solid #34463a; border-radius: 13px; background: #111915; color: #e3eee7; cursor: pointer; }
.pricing-calculator .simulator-check input { width: 19px; height: 19px; accent-color: #16c79a; }
.pricing-calculator .simulator-check b, .pricing-calculator .simulator-check small { display: block; font-size: 13px; }
.pricing-calculator .simulator-check small { margin-top: 3px; color: #aab9b1; }
.simulator-help { margin: 11px 0 0; color: #aab9b1; font-size: 12px; line-height: 1.5; }
.simulator-total { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 18px; padding: 16px 18px; border: 1px solid #345341; border-radius: 15px; background: #101713; }
.simulator-total > div > span { color: #d7e6dc; font-size: 14px; font-weight: 800; }
.simulator-total > div > p { margin: 5px 0 0; color: #a3b4aa; font-size: 12px; line-height: 1.45; }
.simulator-total > strong { color: #a6f1cf; font: 800 32px/1 "Manrope", sans-serif; white-space: nowrap; }
.pricing-footnote { margin: 12px 0 15px; color: #a0afa6; font-size: 12px; line-height: 1.5; }
.pricing-calculator > .btn { min-width: 220px; }
.simulator-details.is-invalid { color: #ffb6a8 !important; }
.pricing-calculator .input[aria-invalid="true"] { border-color: #cf7566 !important; box-shadow: 0 0 0 2px #cf756633; }

.pricing-answers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; margin-top: 20px; }
.pricing-answers article { display: flex; align-items: flex-start; gap: 12px; padding: 17px; border: 1px solid #2a3630; border-radius: 16px; background: #131916; }
.pricing-answers article > span { display: grid; place-items: center; flex: 0 0 30px; height: 30px; border-radius: 10px; background: #1a3024; color: #a2edc9; font-size: 12px; font-weight: 900; }
.pricing-answers h3 { margin: 2px 0 5px; color: #edf5f0; font-size: 14px; }
.pricing-answers p { margin: 0; color: #a7b6ae; font-size: 12px; line-height: 1.5; }
.pricing-back-link { margin: 17px 0 0; }

@media (max-width: 1080px) {
  .pricing-offer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pricing-volume { padding: 22px; }
  .pricing-volume-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pricing-volume-card > header { min-height: 0; }
}
@media (max-width: 900px) {
  .pricing-hero { grid-template-columns: minmax(0, 1fr) 175px; padding: 29px; }
  .pricing-hero-art { width: 155px; height: 155px; }
  .pricing-hero-art > span { font-size: 70px; }
  .pricing-offer-grid { gap: 10px; }
  .pricing-offer { padding: 17px; }
  .pricing-offer > strong { font-size: 23px; }
  .pricing-thresholds { padding: 24px; }
  .pricing-volume { padding: 20px 16px; border-radius: 18px; }
  .pricing-volume-grid { grid-template-columns: 1fr; }
  .pricing-volume-heading h2 { font-size: 24px; }
  .pricing-volume-option { min-height: 68px; padding: 10px 12px; }
  .pricing-volume-rates { grid-template-columns: 1fr; }
  .pricing-answers { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .topbar { gap: 8px; }
  .topbar .brand { gap: 7px; font-size: 15px; }
  .topbar .brand-mark { width: 32px; height: 32px; }
  .top-right { gap: 5px; }
  .top-nav-pricing { min-height: 38px; padding: 0 7px; font-size: 12px; }
  .top-right .btn-small { padding: 7px 8px; font-size: 12px; }
  .top-right .credit-pill { display: none; }
  .home-pricing-preview { align-items: flex-start; flex-direction: column; gap: 15px; padding: 19px; }
  .home-pricing-preview > .btn { width: 100%; }
  .home-price-points { display: grid; gap: 7px; font-size: 12px; }
  .pricing-hero { display: block; min-height: unset; padding: 23px 20px; border-radius: 20px; }
  .pricing-hero h1 { max-width: 520px; font-size: 34px; letter-spacing: -1.2px; }
  .pricing-hero p { font-size: 14px; }
  .pricing-hero-art { display: none; }
  .pricing-minimum-banner { margin-top: 17px; }
  .pricing-offer-grid { grid-template-columns: 1fr; gap: 10px; }
  .pricing-offer { display: grid; grid-template-columns: 42px minmax(0, 1fr); column-gap: 11px; align-items: center; padding: 16px; }
  .pricing-offer-icon { grid-row: 1 / span 3; margin: 0; }
  .pricing-offer-label { font-size: 12px; }
  .pricing-offer h3 { min-height: 0; margin: 3px 0; font-size: 16px; }
  .pricing-offer > strong { grid-column: 2; font-size: 22px; }
  .pricing-offer p, .pricing-example { grid-column: 1 / -1; min-height: 0; }
  .pricing-offer p { margin: 12px 0 9px; }
  .pricing-example { padding-top: 10px; }
  .pricing-thresholds { margin-top: 14px; padding: 20px 17px; border-radius: 18px; }
  .pricing-threshold-head h2 { font-size: 23px; }
  .pricing-threshold-head p { font-size: 13px; }
  .pricing-threshold-table { margin-top: 16px; margin-right: -1px; }
  .pricing-threshold-row { min-width: 635px; grid-template-columns: 1.42fr repeat(3, minmax(122px, 1fr)); }
  .pricing-threshold-row > * { min-height: 58px; padding: 11px 12px; font-size: 13px; }
  .pricing-threshold-labels > * { min-height: 44px; font-size: 12px; }
  .pricing-calculator { padding: 20px 17px; border-radius: 18px; }
  .pricing-calculator .simulator-grid { grid-template-columns: 1fr; gap: 2px; }
  .pricing-calculator .simulator-check { grid-column: auto; }
  .simulator-total { align-items: flex-start; flex-direction: column; gap: 9px; }
  .simulator-total > strong { font-size: 30px; }
  .pricing-calculator > .btn { width: 100%; }
  .pricing-answers { gap: 9px; }
}
.pricing-next-tier { margin: 12px 0 0; padding: 14px 16px; border: 1px solid #c7e6d2; border-radius: 14px; background: #eff9f2; color: #244f40; font-size: 14px; line-height: 1.55; }
.pricing-next-tier b { color: #075e54; }
.simulator-value { margin: 10px 0 0; color: #36574b; font-size: 14px; line-height: 1.5; }
.estimate-price .estimate-money { color: #45675a; font-weight: 700; }
.estimate-price > .pricing-next-tier { grid-column: 1 / -1; margin: 4px 0 0; font-size: 12px; }
