* { box-sizing: border-box; }
body {
    margin: 0;
    padding: 32px 16px;
    background: #f4f6f9;
    color: #202938;
    font: 16px/1.5 Arial, sans-serif;
}
.card, .payment {
    width: 100%;
    max-width: 620px;
    margin: 0 auto;
    padding: 28px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(28, 39, 54, .09);
}
.payment { max-width: 980px; }
h1 { margin: 0 0 18px; font-size: 26px; }
.product-name { margin: 0 0 5px; font-size: 21px; font-weight: bold; }
.amount { margin-bottom: 24px; font-size: 18px; }
label { display: block; margin: 16px 0 6px; font-weight: bold; }
input {
    width: 100%;
    padding: 12px;
    border: 1px solid #ccd3dc;
    border-radius: 7px;
    font-size: 16px;
}
button, .button-link {
    display: inline-block;
    margin-top: 24px;
    padding: 12px 20px;
    border: 0;
    border-radius: 7px;
    background: #1769e0;
    color: #fff;
    font-size: 16px;
    text-decoration: none;
    cursor: pointer;
}
.alert { padding: 12px; border-radius: 7px; background: #fff0f0; color: #a21d1d; }
.result { text-align: center; }
.success { color: #087c45; font-weight: bold; }
.muted { color: #697386; font-size: 13px; }
#paytriframe { width: 100%; min-height: 600px; }