.pricing-page { background: #fff; }
.pricing-checkout { background: #fff; color: #102a43; }
.pricing-stage { padding: 3.5rem 0 5rem; }
.pricing-stage .container { max-width: 1180px; }

.pricing-progress { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); margin: 0 auto 4rem; }
.pricing-progress-line { position: absolute; z-index: 0; top: 19px; left: 9%; right: 9%; height: 1px; background: #9db6d4; }
.pricing-step { position: relative; z-index: 1; display: grid; justify-items: center; gap: .55rem; text-align: center; }
.pricing-step span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: #fff; color: #0b4f9c; border: 3px solid #b9d2ef; font-weight: 900; }
.pricing-step.current span { background: #0b63b6; border-color: #0b63b6; color: #fff; }
.pricing-step strong { font-size: .95rem; color: #174a7e; }

.pricing-intro { max-width: 780px; margin: 0 auto 2.8rem; text-align: center; }
.pricing-kicker { margin: 0 0 .45rem; color: #0b63b6; text-transform: uppercase; letter-spacing: .14em; font-size: .78rem; font-weight: 900; }
.pricing-intro h1 { margin: 0; color: #073b72; font-size: clamp(2.25rem, 5vw, 4rem); }
.pricing-intro > p:last-child { color: #526d82; font-size: 1.05rem; }

.pricing-benefits { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem 3rem; margin: 0 auto 3.5rem; padding: 2.2rem 2rem; border: 1px solid #c5dcef; border-radius: 26px; background: linear-gradient(135deg,#eef7ff,#f6f1ff); box-shadow: 0 14px 38px rgba(15,74,126,.09); }
.pricing-benefits > div { display: grid; justify-items: center; gap: .8rem; text-align: center; }
.pricing-benefits span { width: 74px; height: 74px; display: grid; place-items: center; border-radius: 50%; background: #e8f2fc; color: #0b63b6; font-size: 2rem; font-weight: 900; }
.pricing-benefits strong { max-width: 270px; color: #174a7e; line-height: 1.35; }

.pricing-form { display: grid; gap: 1.5rem; }
.pricing-section { padding: 2rem; border: 1px solid #c9dced; border-radius: 24px; background: #f7fbff; box-shadow: 0 12px 34px rgba(15,74,126,.08); }
.pricing-section h2 { margin: 0; color: #073b72; font-size: clamp(1.4rem, 2.5vw, 2rem); }
.pricing-section p { margin: .4rem 0 0; color: #60788c; }
.pricing-section-heading { margin-bottom: 1.6rem; text-align: center; }
.country-section { display: grid; grid-template-columns: 1fr minmax(280px, .7fr); align-items: center; gap: 2rem; }
.country-section label { color: #123f6d; }
.country-section select { margin-top: .35rem; border-color: #555; background: #fff; color: #111; }
.country-section .field-note { font-size: .8rem; }

.model-section { padding-top: 2.4rem; }
.model-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; align-items: stretch; padding-top: 1.3rem; }
.model-card { position: relative; display: block; margin: 0; cursor: pointer; }
.model-card > input { position: absolute; opacity: 0; pointer-events: none; }
.model-card-inner { height: 100%; display: flex; flex-direction: column; overflow: hidden; border: 2px solid #0a4d8f; border-radius: 22px; background: linear-gradient(160deg,#0b63b6,#073b72); color: #fff; transition: transform .2s, border-color .2s, box-shadow .2s; }
.model-card:hover .model-card-inner { transform: translateY(-4px); border-color: #20b86a; }
.model-card.selected .model-card-inner { border-color: #20b86a; box-shadow: 0 0 0 3px rgba(32,184,106,.2), 0 18px 46px rgba(7,59,114,.24); }
.model-card.best-value .model-card-inner { border-color: #20b86a; }
.best-value-badge { position: absolute; z-index: 2; top: -20px; left: 50%; transform: translateX(-50%); min-width: 150px; padding: .55rem 1.4rem; border-radius: 999px; background: #20b86a; color: #fff; text-align: center; text-transform: uppercase; letter-spacing: .08em; font-size: .78rem; font-weight: 950; box-shadow: 0 8px 20px rgba(7,59,114,.22); }
.model-card img { width: 100%; height: 190px; object-fit: cover; border-bottom: 1px solid #e2e2e2; }
.model-copy { display: flex; flex: 1; flex-direction: column; padding: 1.35rem 1.3rem 1.2rem; }
.model-name { color: #fff; font-size: 1.55rem; text-align: center; }
.model-price { display: block; margin: .45rem 0; color: #fff; font-size: 2.15rem; font-weight: 950; text-align: center; }
.model-price small { color: #cfe8ff; font-size: .72rem; letter-spacing: .08em; }
.model-subtitle { margin-bottom: 1rem; color: #d9ecff; text-align: center; font-size: .88rem; }
.feature-list { display: grid; gap: .68rem; text-align: left; }
.feature-list > span { position: relative; padding-left: 1.65rem; color: #fff; font-size: .9rem; line-height: 1.35; }
.feature-list > span::before { content: "✓"; position: absolute; left: 0; top: -.05rem; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; background: #139c50; color: #fff; font-size: .72rem; font-weight: 950; }
.select-model { display: block; margin: 0 1.3rem 1.3rem; padding: .8rem 1rem; border: 2px solid #fff; border-radius: 999px; color: #fff; text-align: center; font-weight: 900; }
.model-card.selected .select-model { border-color: #20b86a; background: #20b86a; color: #fff; }

.addon-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .9rem; }
.addon-grid label { display: flex; align-items: flex-start; gap: .8rem; margin: 0; padding: 1.15rem; border: 2px solid transparent; border-radius: 16px; cursor: pointer; box-shadow: 0 7px 20px rgba(15,74,126,.07); transition: transform .18s,border-color .18s,box-shadow .18s; }
.addon-grid label:nth-child(1) { background: #e9f5ff; }
.addon-grid label:nth-child(2) { background: #eef9ec; }
.addon-grid label:nth-child(3) { background: #fff4df; }
.addon-grid label:nth-child(4) { background: #f5edff; }
.addon-grid label:hover { transform: translateY(-2px); box-shadow: 0 11px 26px rgba(15,74,126,.12); }
.addon-grid label:has(input:checked) { border-color: #0b63b6; box-shadow: 0 0 0 3px rgba(11,99,182,.12); }
.addon-grid input { width: 20px; height: 20px; flex: 0 0 auto; margin: .1rem 0 0; accent-color: #f2c316; }
.addon-grid strong, .addon-grid small { display: block; color: #123f6d; }
.addon-grid small { margin-top: .25rem; color: #526d82; font-size: .8rem; }

.coupon-section { display: grid; grid-template-columns: 1fr minmax(330px,.8fr); align-items: center; gap: 2rem; }
.coupon-entry label { color: #123f6d; }
.coupon-entry > div { display: grid; grid-template-columns: 1fr auto; gap: .65rem; margin-top: .35rem; }
.coupon-entry input { margin: 0; text-transform: uppercase; }
.coupon-entry button { padding: .75rem 1.1rem; border: 0; border-radius: 10px; background: #0b63b6; color: #fff; font-weight: 900; cursor: pointer; }
.coupon-entry button:hover { background: #084f91; }
.coupon-entry button:disabled { opacity: .65; cursor: wait; }
.coupon-message { min-height: 1.25rem; font-size: .83rem; font-weight: 800; }
.coupon-message.success { color: #08783d; }
.coupon-message.error { color: #a52a23; }

.pricing-notice { padding: 1.15rem 1.3rem; border-left: 5px solid #0b63b6; border-radius: 10px; background: #eaf4ff; color: #173f67; font-size: .88rem; }
.pricing-total-bar { display: grid; grid-template-columns: 1fr auto minmax(230px, auto); align-items: center; gap: 2rem; padding: 1.4rem 1.6rem; border: 1px solid #b9d2ea; border-radius: 20px; background: #fff; color: #102a43; box-shadow: 0 12px 34px rgba(15,74,126,.1); }
.pricing-total-bar span, .pricing-total-bar strong, .pricing-total-bar small { display: block; }
.pricing-total-bar > div > span { color: #656565; font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 800; }
.pricing-total-bar > div > strong { margin: .15rem 0; font-size: 1.2rem; }
.pricing-total-bar small { color: #666; }
.pricing-total { text-align: right; }
.pricing-total strong { font-size: 1.65rem !important; }
.checkout-action { min-height: 54px; padding: .9rem 1.6rem; border: 0; border-radius: 999px; background: #0b63b6; color: #fff; font-weight: 950; cursor: pointer; box-shadow: 0 9px 24px rgba(11,99,182,.24); }
.checkout-action:hover { background: #084f91; transform: translateY(-1px); }

@media (max-width: 900px) {
  .model-grid { grid-template-columns: 1fr; gap: 2rem; max-width: 580px; margin: auto; }
  .model-card img { height: 230px; }
  .pricing-benefits { grid-template-columns: repeat(2, 1fr); }
  .country-section { grid-template-columns: 1fr; }
  .coupon-section { grid-template-columns: 1fr; }
  .pricing-total-bar { grid-template-columns: 1fr 1fr; }
  .checkout-action { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  .pricing-stage { padding: 2.5rem 0 4rem; }
  .pricing-progress { margin-bottom: 3rem; }
  .pricing-step strong { font-size: .72rem; }
  .pricing-benefits { gap: 1.5rem 1rem; }
  .pricing-benefits { padding: 1.5rem 1rem; border-radius: 20px; }
  .pricing-benefits span { width: 58px; height: 58px; font-size: 1.5rem; }
  .pricing-benefits strong { font-size: .82rem; }
  .pricing-section { padding: 1.25rem; }
  .addon-grid { grid-template-columns: 1fr; }
  .coupon-entry > div { grid-template-columns: 1fr; }
  .pricing-total-bar { grid-template-columns: 1fr; gap: 1rem; }
  .pricing-total { text-align: left; }
}