.payment-page { overflow: clip; }
.payment-hero { padding: 4.25rem 0 3.2rem; }
.payment-hero-inner { position: relative; z-index: 1; max-width: 820px; margin: 0 auto; text-align: center; }
.payment-hero h1 { max-width: 100%; margin: .65rem 0 1rem; color: #172033; font: 700 clamp(2.6rem, 5.5vw, 4.4rem)/1.05 'Poppins', sans-serif; letter-spacing: -.055em; }
.payment-hero h1 span { display: inline-block; }
.payment-hero h1 span,
.payment-section-heading h2 span,
.payment-security-card h2 span,
.bank-transfer-heading h2 span { background: linear-gradient(100deg,#087cf4,#7613d4); background-clip: text; -webkit-background-clip: text; color: transparent; }
.payment-hero .hero-description { max-width: 650px; margin: 0 auto; color: #657087; line-height: 1.7; }
.payment-hero-pills { display: flex; justify-content: center; flex-wrap: wrap; gap: .65rem; margin-top: 1.35rem; }
.payment-hero-pills > span { display: inline-flex; align-items: center; gap: .5rem; padding: .58rem .9rem; border: 1px solid #e4e8f4; border-radius: 999px; background: rgba(255,255,255,.82); color: #46536a; font-size: .83rem; font-weight: 650; }
.payment-hero-pills i { color: #5b43d1; font-style: normal; }
.payment-card-section,
.payment-steps-section,
.payment-refund-section,
.bank-transfer-section { padding: 4.2rem 0; }
.payment-card-section { background: #fff; }
.payment-section-heading { max-width: 760px; margin: 0 auto 1.7rem; text-align: center; }
.payment-section-heading h2,
.payment-security-card h2,
.payment-refund-card h2,
.bank-transfer-heading h2 { margin: .5rem 0 .7rem; color: #172033; font: 700 clamp(1.75rem,3.3vw,2.55rem)/1.18 'Poppins',sans-serif; letter-spacing: -.04em; }
.payment-section-heading > p { margin: 0; color: var(--color-text-muted); line-height: 1.65; }
.payment-provider-card { display: grid; grid-template-columns: minmax(0,1fr) minmax(190px,.42fr); align-items: center; gap: 2rem; padding: clamp(1.4rem,3vw,2.2rem); border: 1px solid #e5e9f4; border-radius: 1.25rem; background: radial-gradient(ellipse at 90% 5%,rgba(115,37,217,.09),transparent 40%),linear-gradient(115deg,#f5f9ff,#fbf8ff); box-shadow: 0 14px 42px rgba(50,60,120,.07); }
.payment-provider-label { color: #5d48d5; font-size: .67rem; font-weight: 800; letter-spacing: .12em; }
.payment-provider-copy h3 { margin: .5rem 0 .65rem; color: #172033; font: 700 1.3rem/1.3 'Poppins',sans-serif; }
.payment-provider-copy p { max-width: 720px; margin: 0; color: #657087; font-size: .93rem; line-height: 1.75; }
.payment-provider-logo { display: grid; min-height: 120px; place-items: center; padding: 1.4rem; border: 1px solid rgba(228,232,244,.8); border-radius: 1rem; background: #fff; }
.payment-provider-logo img { display: block; width: min(100%,210px); height: auto; }
.payment-card-logos { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; margin-top: 1rem; padding: 1.2rem 1.5rem; border: 1px solid #e7eaf3; border-radius: 1rem; background: #fff; }
.payment-card-logos p { margin: .45rem 0 0; color: #26344c; font-weight: 700; }
.payment-card-logos > img { display: block; width: min(54%,480px); max-height: 55px; object-fit: contain; object-position: right center; }
.payment-steps-section { background: #f7f8fc; }
.payment-steps-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1rem; }
.payment-step { min-height: 190px; padding: 1.35rem; border: 1px solid #e7eaf3; border-radius: 1rem; background: #fff; box-shadow: 0 10px 28px rgba(35,45,82,.045); }
.payment-step > span { display: grid; width: 2.45rem; height: 2.45rem; place-items: center; border-radius: .8rem; background: linear-gradient(135deg,#e9f4ff,#f1eaff); color: #5b43d1; font: 700 .85rem 'Poppins',sans-serif; }
.payment-step h3 { margin: 1rem 0 .5rem; color: #172033; font: 700 1rem/1.35 'Poppins',sans-serif; }
.payment-step p { margin: 0; color: var(--color-text-muted); font-size: .87rem; line-height: 1.65; }
.payment-security-section { padding: 3rem 0 1.2rem; background: #fff; }
.payment-security-card { display: grid; grid-template-columns: auto 1fr; align-items: start; gap: 1.2rem; max-width: 980px; margin: 0 auto; padding: clamp(1.4rem,3vw,2rem); border: 1px solid #dfe9fa; border-radius: 1.15rem; background: linear-gradient(115deg,#f3f9ff,#faf7ff); }
.payment-security-icon { display: grid; width: 3.1rem; height: 3.1rem; place-items: center; border-radius: 1rem; background: linear-gradient(135deg,#087cf4,#7613d4); box-shadow: 0 8px 20px rgba(81,68,213,.2); }
.payment-security-icon svg { width: 1.55rem; fill: none; stroke: #fff; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.payment-security-card h2 { margin: .4rem 0 .55rem; font-size: clamp(1.4rem,2.7vw,2rem); }
.payment-security-card p { margin: 0; color: #657087; line-height: 1.75; }
.payment-refund-section { padding-top: 2.5rem; }
.payment-refund-card { display: grid; grid-template-columns: auto 1fr; align-items: start; gap: 1.2rem; max-width: 980px; margin: 0 auto; padding: clamp(1.4rem,3vw,2rem); border: 1px solid #e7eaf3; border-radius: 1.15rem; background: #fff; box-shadow: 0 12px 34px rgba(35,45,82,.05); }
.payment-refund-mark { display: grid; width: 3.1rem; height: 3.1rem; place-items: center; border-radius: 1rem; background: linear-gradient(135deg,#e9f4ff,#f1eaff); color: #5b43d1; font-size: 1.55rem; }
.payment-refund-card h2 { margin: .35rem 0 .65rem; font-size: clamp(1.4rem,2.7vw,2rem); }
.payment-refund-card p { margin: .5rem 0; color: #657087; line-height: 1.7; }
.payment-refund-card .payment-refund-time { color: #45536b; font-weight: 650; }
.payment-refund-card a,
.bank-transfer-requisites { display: inline-flex; align-items: center; gap: .35rem; margin-top: .45rem; color: #5541d7; font-weight: 700; text-decoration: none; }
.payment-refund-card a span,
.bank-transfer-requisites span { transition: transform .2s ease; }
.payment-refund-card a:hover span,
.bank-transfer-requisites:hover span { transform: translateX(4px); }
.bank-transfer-section { padding-top: 0; background: #fff; }
.bank-transfer-layout { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1fr); align-items: center; gap: clamp(2rem,6vw,5rem); padding: clamp(1.5rem,4vw,3rem); border: 1px solid #e5e9f4; border-radius: 1.25rem; background: radial-gradient(ellipse at 92% 8%,rgba(115,37,217,.08),transparent 40%),linear-gradient(115deg,#f5f9ff,#fbf8ff); }
.bank-transfer-heading .hosting-kicker { color: #5d48d5; font-size: .68rem; font-weight: 800; letter-spacing: .12em; }
.bank-transfer-heading h2 { margin-top: .7rem; }
.bank-transfer-heading > p { margin: 0 0 1.25rem; color: #657087; line-height: 1.7; }
.bank-transfer-details { padding: 1.45rem; border: 1px solid #e7eaf3; border-radius: 1rem; background: #fff; }
.bank-transfer-icon { display: grid; width: 2.7rem; height: 2.7rem; place-items: center; margin-bottom: .8rem; border-radius: .85rem; background: linear-gradient(135deg,#e9f4ff,#f1eaff); color: #5b43d1; font-weight: 800; }
.bank-transfer-details h3 { margin: 0 0 .55rem; color: #172033; font: 700 1.05rem/1.35 'Poppins',sans-serif; }
.bank-transfer-details > p { margin: 0; color: var(--color-text-muted); font-size: .9rem; line-height: 1.7; }
.bank-refund-warning { margin-top: 1rem; padding: .9rem 1rem; border: 1px solid #f2dfcc; border-radius: .8rem; background: #fff9f2; color: #805020; font-size: .85rem; line-height: 1.6; }
.payment-faq { padding-top: 4rem; padding-bottom: 4.5rem; }
.payment-faq .faq-list { max-width: 850px; }
.payment-help-section { padding-top: 3.8rem; padding-bottom: 4.5rem; }
.payment-help-section .hosting-final-cta-inner { max-width: 100%; }
@media(max-width: 1000px) {
 .payment-steps-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media(max-width: 760px) {
 .payment-hero { padding: 3.5rem 0 2.7rem; }
 .payment-card-section,.payment-steps-section,.payment-refund-section,.bank-transfer-section { padding: 3.3rem 0; }
 .payment-provider-card { grid-template-columns: 1fr; gap: 1.2rem; }
 .payment-provider-logo { min-height: 90px; }
 .payment-card-logos { align-items: flex-start; flex-direction: column; }
 .payment-card-logos > img { width: 100%; max-height: 48px; object-position: left center; }
 .bank-transfer-layout { grid-template-columns: 1fr; gap: 1.5rem; }
 .payment-security-section { padding-top: 2.4rem; }
 .payment-refund-section { padding-top: 1.8rem; }
 .payment-faq { padding: 3.3rem 0; }
 .payment-help-section { padding: 3.3rem 0 3.5rem; }
}
@media(max-width: 560px) {
 .payment-hero { padding: 3rem 0 2.3rem; }
 .payment-hero h1 { font-size: clamp(2.25rem,12vw,3.2rem); }
 .payment-hero-pills { gap: .45rem; }
 .payment-hero-pills > span { padding: .5rem .7rem; font-size: .76rem; }
 .payment-steps-grid { grid-template-columns: 1fr; }
 .payment-step { min-height: 0; }
 .payment-security-card,.payment-refund-card { grid-template-columns: 1fr; gap: .85rem; }
 .bank-transfer-layout { padding: 1.2rem; }
 .bank-transfer-heading .btn { width: 100%; justify-content: center; }
 .payment-help-section .hosting-final-cta-inner { align-items: flex-start; flex-direction: column; }
 .payment-help-section .hero-actions { width: 100%; }
 .payment-help-section .hero-actions .btn { width: 100%; justify-content: center; }
}
@media(prefers-reduced-motion:reduce) {
 .payment-refund-card a span,.bank-transfer-requisites span { transition: none; }
}