/* top-up — merged from the static build's app.css, source order preserved. */

.topup-section { min-height: 767px; padding-top: 99px; border-block: 1px solid rgba(0,0,0,.1); background: #fff url("../../assets/img/work-background.png") center / cover; }
.topup-section .section-intro h2 { margin-top: 26px; font-size: 60px; line-height: 60px; }
.topup-section .section-intro > p:last-of-type:not(.eyebrow) { max-width: 514px; margin-top: 16px; font-size: 18px; line-height: 26px; }
.topup-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; margin-top: 72px; }
.topup-card { position: relative; min-height: 309px; padding: 11px 31px 32px; border: 1px solid rgba(0,0,0,.1); background-color: var(--paper); background-image: var(--noise); overflow: hidden; }
.topup-card::before, .topup-card::after { content: ""; position: absolute; background: var(--coral); }
.topup-card::before { top: -1px; right: 24px; width: 19px; height: 15px; }
.topup-card::after { top: 13px; right: 0; width: 24px; height: 32px; }
.topup-card > p { display: flex; align-items: baseline; gap: 6px; margin: 0; font-size: 16px; }
.topup-card > p strong { color: var(--coral); font-size: 60px; line-height: 82px; }
.topup-card > div { display: flex; align-items: baseline; gap: 6px; margin-top: 51px; padding-top: 7px; border-top: 1px solid rgba(0,0,0,.1); }
.topup-card b { font-size: 32px; }
.topup-card div span { color: rgba(0,0,0,.52); font-size: 14px; }
.topup-card .button { width: 100%; min-height: 50px; margin-top: 26px; }
