.payments-page{
  background:
    radial-gradient(circle at 12% 8%, rgba(112,219,228,.18), transparent 28rem),
    linear-gradient(180deg,#f6fafb 0%,#eef6f7 100%);
  color:#10232d;
}

.payment-report{
  width:min(1220px,calc(100% - 48px));
  margin:auto;
  min-height:calc(100vh - 86px);
  padding:96px 0;
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  gap:64px;
  align-items:center;
}

.payment-intro{
  max-width:560px;
}

.payment-report h1{
  margin:18px 0 22px;
  font-size:clamp(42px,5vw,72px);
  line-height:1.02;
  letter-spacing:-.06em;
  color:#10232d;
}

.payment-report p{
  color:#385564;
  font-size:17px;
  line-height:1.72;
}

.payment-report strong{
  color:#10232d;
}

.payment-note{
  margin-top:22px;
  padding:16px 18px;
  border-left:3px solid #ef5533;
  background:#fff;
  border-radius:0 14px 14px 0;
  box-shadow:0 14px 36px rgba(16,35,45,.08);
}

.pay-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  background:rgba(255,255,255,.92);
  border:1px solid #cfe0e6;
  border-radius:22px;
  padding:32px;
  box-shadow:0 30px 90px rgba(16,35,45,.14);
  backdrop-filter:blur(14px);
}

.pay-form label{
  display:grid;
  gap:8px;
  font-weight:800;
  font-size:13px;
  color:#10232d;
}

.pay-form input,
.pay-form select,
.pay-form textarea{
  width:100%;
  box-sizing:border-box;
  border:1px solid #b9cbd3;
  border-radius:10px;
  padding:14px 15px;
  font:15px Manrope,Arial,sans-serif;
  color:#10232d;
  background:#fbfdfd;
}

.pay-form input::placeholder,
.pay-form textarea::placeholder{
  color:#7b909a;
}

.pay-form input:focus,
.pay-form select:focus,
.pay-form textarea:focus{
  outline:3px solid rgba(112,219,228,.34);
  border-color:#1499a8;
}

.pay-full{
  grid-column:1/-1;
}

.pay-form button{
  width:max-content;
  box-shadow:0 16px 34px rgba(239,85,51,.22);
}

.pay-form small{
  align-self:center;
  color:#506876;
  font-size:12px;
  line-height:1.55;
}

@media(max-width:900px){
  .payment-report{
    grid-template-columns:1fr;
    gap:34px;
    padding:70px 0;
  }
  .payment-intro{
    max-width:760px;
  }
}

@media(max-width:560px){
  .payment-report{
    width:calc(100% - 30px);
    padding:54px 0;
  }
  .pay-form{
    grid-template-columns:1fr;
    padding:22px;
    border-radius:18px;
  }
  .pay-form button{
    width:100%;
  }
}
