.ccu-payment .payment-hero-mark {width:150px;height:150px;flex-shrink:0;display:flex;flex-direction:column;justify-content:center;align-items:center;border:1px solid #ddc99f;border-radius:50%;background:#ffffff80}
.payment-hero-mark > i {font-size:38px;color:#a37d3b;margin-bottom:18px}
.ccu-payment .payment-hero-mark span {font-size:9px;color:#18344b;font-weight:700;letter-spacing:1px;text-align:center;line-height:1.9}
.payment-layout {display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:28px;align-items:start}
.payment-guide {border:1px solid #dfe7ee;border-radius:12px;padding:34px;background:#f8fafc}
.ccu-payment .payment-guide h2 {font-size:28px}
.ccu-payment .payment-guide-intro {margin:15px 0 26px;font-size:12px}
.ccu-payment .payment-steps {counter-reset:payment-step;list-style:none;margin:0;padding:0}
.payment-steps li {display:flex;gap:18px;border-top:1px solid #dfe7ee;padding:24px 0;counter-increment:payment-step}
.payment-steps li:last-child {padding-bottom:0}
.payment-steps li::before {content:counter(payment-step,decimal-leading-zero);display:grid;place-items:center;flex-shrink:0;width:34px;height:34px;border-radius:50%;background:#f6f0e4;color:#a37d3b;font-size:11px;font-weight:700}
.ccu-payment .payment-steps h3 {font-size:16px;margin:3px 0 10px}
.ccu-payment .payment-steps p {font-size:12px;margin:0 0 15px}
.ccu-payment .payment-steps a {display:inline-flex;gap:15px;align-items:center;color:#18344b;font-size:11px;font-weight:700}
.payment-steps a i {color:#a37d3b}
.payment-support-note {display:flex;gap:12px;border-top:1px solid #ffffff25;margin-top:25px;padding-top:22px}
.payment-support-note > i {color:#edc47e;font-size:17px;margin-top:4px}
.ccu-payment .payment-support-note p {color:#c3d3e0;font-size:11px;margin:0}
.payment-resources-heading {margin-top:45px}
.ccu-payment .payment-resources-heading h2 {font-size:28px}
.payment-resources {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:26px}
.payment-resources > a {display:flex;flex-direction:column;border:1px solid #dfe7ee;border-radius:10px;padding:27px;background:#fff}
.payment-resources > a:hover {border-color:#c9a66b}
.ccu-payment .payment-resources h3 {font-size:19px}
.ccu-payment .payment-resources p {font-size:12px;margin:13px 0 22px}
.payment-resources > a > span:last-child {display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;color:#18344b;font-size:11px;font-weight:700}
.payment-resources > a > span:last-child i {color:#a37d3b}
@media(max-width:991px){.payment-layout {gap:22px}.payment-guide {padding:26px}.payment-resources {gap:16px}.payment-resources > a {padding:22px}}
@media(max-width:600px){.payment-layout,.payment-resources {grid-template-columns:1fr}.payment-hero-mark {display:none!important}.payment-guide {padding:25px}.ccu-payment .payment-guide h2,.ccu-payment .payment-resources-heading h2 {font-size:24px}.payment-steps li {gap:12px}.payment-resources-heading {margin-top:35px}}