.buy-page{
  background:#f6f1e8;
}

.buy-shell{
  min-height:calc(100vh - 150px);
  background:
    radial-gradient(circle at 78% 12%,rgba(190,79,72,.08),transparent 28rem),
    linear-gradient(180deg,#f8f4ec 0,#f3ede3 100%);
}

.buy-hero{
  border-bottom:1px solid #ded5c7;
  padding:54px 22px 42px;
}

.buy-hero-copy{
  width:min(1080px,100%);
  margin:0 auto;
}

.buy-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#bd5049;
  font-size:10px;
  font-weight:950;
  letter-spacing:.12em;
}

.buy-kicker:before{
  content:"";
  width:24px;
  height:2px;
  background:#bd5049;
}

.buy-hero h1{
  max-width:800px;
  margin:12px 0 12px;
  color:#17324d;
  font-family:Georgia,serif;
  font-size:clamp(34px,5vw,54px);
  line-height:1.05;
  letter-spacing:-.02em;
}

.buy-hero p{
  max-width:690px;
  margin:0;
  color:#667078;
  font-size:14px;
  line-height:1.7;
}

.buy-section{
  padding:38px 22px 72px;
}

.buy-grid{
  width:min(1080px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1.18fr) minmax(330px,.82fr);
  gap:20px;
  align-items:start;
}

.buy-card{
  background:#fff;
  border:1px solid #ddd4c6;
  border-radius:14px;
  box-shadow:0 16px 40px rgba(23,50,77,.07);
}

.buy-form-card{
  padding:30px;
}

.buy-card-head{
  display:flex;
  align-items:flex-start;
  gap:14px;
  margin-bottom:24px;
}

.buy-step{
  flex:0 0 34px;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#17324d;
  color:#fff;
  font-family:Georgia,serif;
  font-size:16px;
  font-weight:700;
}

.buy-card-head h2{
  margin:0 0 5px;
  color:#17324d;
  font-family:Georgia,serif;
  font-size:27px;
}

.buy-card-head p{
  margin:0;
  color:#71777b;
  font-size:11px;
  line-height:1.55;
}

.buy-alert{
  margin:0 0 22px;
  padding:14px 16px;
  border:1px solid #e6b3ae;
  border-left:4px solid #bd5049;
  border-radius:8px;
  background:#fff5f3;
  color:#713c38;
  font-size:12px;
  line-height:1.5;
}

.buy-alert ul{
  margin:8px 0 0 18px;
  padding:0;
}

.buy-form{
  display:grid;
  gap:16px;
}

.buy-field{
  display:grid;
  gap:7px;
}

.buy-field label{
  color:#17324d;
  font-size:11px;
  font-weight:900;
}

.buy-field input{
  width:100%;
  box-sizing:border-box;
  min-height:48px;
  border:1px solid #cbc4b8;
  border-radius:9px;
  background:#fffdf9;
  color:#172d40;
  padding:12px 13px;
  outline:none;
  font:600 14px/1.2 "Avenir Next","Segoe UI",Arial,sans-serif;
  transition:border-color .15s ease,box-shadow .15s ease,background .15s ease;
}

.buy-field input:hover{
  border-color:#aaa093;
}

.buy-field input:focus{
  border-color:#17324d;
  background:#fff;
  box-shadow:0 0 0 3px rgba(23,50,77,.1);
}

.buy-field-note{
  color:#89847d;
  font-size:9px;
}

.buy-terms{
  display:grid;
  grid-template-columns:20px 1fr;
  gap:10px;
  align-items:start;
  padding:14px 15px;
  border:1px solid #ded6ca;
  border-radius:9px;
  background:#faf7f1;
  color:#5f666b;
  font-size:10px;
  line-height:1.55;
  cursor:pointer;
}

.buy-terms input{
  width:17px;
  height:17px;
  margin:1px 0 0;
  accent-color:#bd5049;
  cursor:pointer;
}

.buy-terms:focus-within{
  border-color:#17324d;
  box-shadow:0 0 0 3px rgba(23,50,77,.08);
}

.buy-submit{
  width:100%;
  min-height:52px;
  margin-top:4px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  border:1px solid #bd5049;
  border-radius:9px;
  background:#bd5049;
  color:#fff;
  padding:13px 18px;
  cursor:pointer;
  font:950 13px/1.2 "Avenir Next","Segoe UI",Arial,sans-serif;
  box-shadow:0 5px 0 #934039;
}

.buy-security{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  color:#7b7d7c;
  font-size:9px;
  text-align:center;
}

.buy-existing{
  margin-top:24px;
  padding-top:20px;
  border-top:1px solid #ece6dc;
  display:grid;
  gap:4px;
}

.buy-existing strong{
  color:#17324d;
  font-size:11px;
}

.buy-existing span{
  color:#757b7f;
  font-size:10px;
  line-height:1.55;
}

.buy-summary-card{
  padding:28px;
  background:#17324d;
  border-color:#17324d;
  color:#fff;
  position:sticky;
  top:92px;
}

.buy-plan-label{
  color:#f0b1ad;
  font-size:9px;
  font-weight:950;
  letter-spacing:.12em;
}

.buy-price{
  display:flex;
  align-items:flex-end;
  gap:10px;
  margin:12px 0 10px;
}

.buy-price-main{
  font-family:Georgia,serif;
  font-size:46px;
  line-height:1;
}

.buy-price-note{
  margin-bottom:5px;
  color:#bdc8d1;
  font-size:10px;
  font-weight:800;
}

.buy-summary-intro{
  margin:0 0 20px;
  color:#d4dde4;
  font-size:11px;
  line-height:1.6;
}

.buy-benefits{
  list-style:none;
  margin:0;
  padding:0;
}

.buy-benefits li{
  display:flex;
  gap:9px;
  padding:9px 0;
  border-top:1px solid rgba(255,255,255,.12);
  color:#e2e8ec;
  font-size:10px;
  line-height:1.45;
}

.buy-benefits li span{
  color:#83c5a7;
  font-weight:950;
}

.buy-divider{
  height:1px;
  margin:22px 0;
  background:rgba(255,255,255,.14);
}

.buy-process{
  display:grid;
  gap:13px;
}

.buy-process > div{
  display:grid;
  grid-template-columns:28px 1fr;
  gap:10px;
  align-items:start;
}

.buy-process > div > span{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#fff;
  color:#17324d;
  font-family:Georgia,serif;
  font-size:12px;
  font-weight:700;
}

.buy-process p{
  display:grid;
  gap:3px;
  margin:0;
}

.buy-process strong{
  color:#fff;
  font-size:10px;
}

.buy-process small{
  color:#bdc8d1;
  font-size:9px;
  line-height:1.45;
}

.buy-fineprint{
  margin:23px 0 0;
  color:#9eabb5;
  font-size:8px;
  line-height:1.5;
}

@media (max-width:850px){
  .buy-grid{grid-template-columns:1fr;}
  .buy-summary-card{position:relative;top:auto;order:-1;}
}

@media (max-width:560px){
  .buy-hero{padding:38px 18px 30px;}
  .buy-section{padding:22px 14px 50px;}
  .buy-form-card,.buy-summary-card{padding:21px;border-radius:11px;}
  .buy-hero h1{font-size:34px;}
  .buy-price-main{font-size:40px;}
  .buy-card-head h2{font-size:23px;}
}
