/* Approved pricing concept; scoped to preserve existing sections. */
.dd-pricing { padding: 68px 0 32px; color: #0b0c16; scroll-margin-top: 25px; }
.pricing-heading { text-align: center; }
.pricing-heading > p { margin: 0 0 24px; color: #7040ff; font-size: 14px; font-weight: 600; letter-spacing: 3px; }
.pricing-heading h2 { margin: 0 0 16px; font-size: clamp(32px,3.5vw,52px); line-height: 1.2; font-weight: 800; letter-spacing: -1.8px; }
.pricing-heading > div { font-size: 23px; line-height: 1.5; color: #64617b; }
.pricing-billing { display: flex; justify-content: center; align-items: center; gap: 20px; margin: 29px 0; }
.pricing-billing > span { color: #7444ff; font-size: 13px; }
.pricing-toggle { display: flex; padding: 3px; border: 1px solid #e6dff3; border-radius: 18px; background: #fff; box-shadow: 0 4px 16px #7140ff08; }
.pricing-toggle button { width: 120px; height: 39px; border: 0; border-radius: 14px; background: transparent; color: #77718d; font: inherit; font-size: 14px; cursor: pointer; transition: background .2s,color .2s; }
.pricing-toggle button[aria-pressed="true"] { background: linear-gradient(120deg,#8052ff,#6840ff); color: #fff; box-shadow: 0 3px 10px #7545ff20; }
.pricing-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; }
.pricing-card { position: relative; min-width: 0; padding: 30px 32px 20px; border: 1px solid #e7e2f0; border-radius: 19px; background: #fff; box-shadow: 0 12px 36px #5e38980a; transition: transform .2s,box-shadow .2s; }
.pricing-card:hover { transform: translateY(-4px); box-shadow: 0 18px 38px #5e389812; }
.pricing-pro { border-color: #8050ff; background: linear-gradient(145deg,#fbf9ff,#f3eeff); box-shadow: 0 10px 35px #7743ff0d; }
.pricing-card h3 { margin: 0 0 5px; font-size: 32px; font-weight: 800; line-height: 1.3; letter-spacing: -1px; }
.pricing-description { margin: 0; color: #77708e; font-size: 18px; line-height: 1.5; }
.pricing-price { display: flex; align-items: baseline; gap: 9px; margin-top: 21px; font-size: 54px; font-weight: 800; line-height: 1.15; letter-spacing: -2px; font-variant-numeric: tabular-nums; }
.pricing-price .pricing-period { font-size: 18px; font-weight: 500; letter-spacing: -.4px; }
.pricing-caption { margin: 6px 0 22px; color: #77708e; font-size: 18px; line-height: 1.5; }
.pricing-cta { display: flex; align-items: center; justify-content: center; min-height: 48px; border: 1.5px solid #8150ff; border-radius: 9px; color: #7040ff; font-size: 18px; font-weight: 600; transition: transform .2s,filter .2s,background .2s; }
.pricing-cta:hover { transform: translateY(-2px); background: #f8f5ff; }
.pricing-cta:active { transform: scale(.98); }
.pricing-pro .pricing-cta { background: linear-gradient(120deg,#8050ff,#6840ff); color: #fff; }
.pricing-pro .pricing-cta:hover { filter: brightness(1.08); }
.pricing-badge { position: absolute; top: 25px; right: 22px; padding: 7px 12px; border-radius: 25px; background: #e6d9ff; color: #6836ed; font-size: 12px; font-weight: 600; }
.pricing-card ul { list-style: none; margin: 20px 0 14px; padding: 13px 0 0; border-top: 1px solid #e6e1ed; }
.pricing-card li { display: flex; align-items: center; gap: 15px; min-height: 37px; color: #47405e; font-size: 16px; line-height: 1.5; }
.pricing-card li::before { content: '✓'; display: grid; place-items: center; flex: 0 0 28px; height: 28px; border-radius: 50%; background: #f1eaff; color: #7743ff; font-size: 17px; }
.pricing-card > small { display: block; text-align: center; font-size: 13px; color: #817892; }
.pricing-benefits { display: flex; align-items: center; justify-content: center; max-width: 1190px; margin: 28px auto 0; padding: 16px 20px; border: 1px solid #e4d8ff; border-radius: 18px; background: linear-gradient(100deg,#fbf9ff,#f6f2ff); }
.pricing-benefits > span { display: flex; justify-content: center; align-items: center; gap: 16px; flex: 1; color: #51466f; font-size: 14px; }
.pricing-benefits > span + span { border-left: 1px solid #ded1f6; }
.pricing-benefits i { color: #8050ff; font-size: 29px; font-style: normal; line-height: 1; }
.pricing-note { margin: 13px 0 0; text-align: center; color: #827893; font-size: 12px; line-height: 1.6; }
.dd-pricing :focus-visible { outline: 3px solid #b99aff; outline-offset: 4px; }
@media(max-width:1100px) { .pricing-card { padding: 26px 20px 20px; }.pricing-grid { gap: 18px; }.pricing-description,.pricing-caption { font-size: 15px; }.pricing-price { font-size: 46px; }.pricing-price .pricing-period { font-size: 15px; }.pricing-card li { font-size: 14px; gap: 9px; }.pricing-badge { top: 16px; right: 12px; font-size: 10px; }.pricing-benefits > span { font-size: 12px; gap: 9px; } }
@media(max-width:800px) { .pricing-grid { grid-template-columns: 1fr; max-width: 480px; margin: auto; gap: 22px; }.pricing-card { padding: 28px; }.pricing-description,.pricing-caption { font-size: 17px; }.pricing-card li { font-size: 16px; }.pricing-badge { top: 28px; right: 28px; font-size: 12px; }.pricing-benefits { flex-direction: column; gap: 17px; padding: 23px; }.pricing-benefits > span { font-size: 14px; }.pricing-benefits > span + span { border: 0; } }
@media(max-width:700px) { .dd-pricing { padding-top: 38px; }.pricing-heading h2 { font-size: 32px; letter-spacing: -1px; }.pricing-heading > div { font-size: 17px; }.pricing-billing { flex-direction: column; gap: 10px; margin: 25px 0; }.pricing-card { padding: 26px 22px 20px; }.pricing-price { font-size: 49px; }.pricing-heading > p { margin-bottom: 18px; } }
@media(prefers-reduced-motion:reduce) { .pricing-card,.pricing-cta,.pricing-toggle button { transition: none; } }
.pricing-benefits i svg { display: block; width: 29px; height: 29px; }
