/* /pro: what Pro gives and the buy button. */
.pro-page { max-width: 1080px; margin: 0 auto; padding: clamp(28px, 6vw, 72px) 16px 64px; }
.pro-hero { text-align: center; }
.pro-kicker { margin: 0 0 12px; color: #8fd0ff; font-weight: 800; letter-spacing: .02em; }
.pro-hero h1 { margin: 0 auto; max-width: 16ch; font-size: clamp(2.2rem, 6vw, 4rem); line-height: 1.02; letter-spacing: -.04em; }
.pro-lead { max-width: 44ch; margin: 18px auto 28px; color: #c4d6ea; font-size: clamp(1rem, 1.6vw, 1.2rem); line-height: 1.5; }
.pro-buy { display: grid; justify-items: center; gap: 10px; }
.pro-buy form { margin: 0; }
.pro-cta { min-height: 54px; padding-inline: 34px; font-size: 1.05rem; font-weight: 800; }
.pro-price { margin: 0; color: #c4d6ea; font-weight: 700; }
.pro-state { margin: 0; color: #c4d6ea; }
.pro-benefits { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; margin: clamp(36px, 6vw, 64px) 0 0; padding: 0; list-style: none; }
.pro-benefits li { padding: 22px; border: 1px solid #ffffff14; border-radius: 18px; background: linear-gradient(160deg, #12233a, #0b1524); }
.pro-benefits__icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: #2f8cff22; color: #9fd4ff; font-size: 1.2rem; }
.pro-benefits h2 { margin: 14px 0 6px; font-size: 1.05rem; }
.pro-benefits p { margin: 0; color: #b6c6d8; font-size: .92rem; line-height: 1.5; }
.pro-faq { max-width: 720px; margin: 56px auto 0; }
.pro-faq h2 { font-size: 1.3rem; }
.pro-faq dt { margin-top: 18px; font-weight: 700; }
.pro-faq dd { margin: 6px 0 0; color: #b6c6d8; line-height: 1.55; }