/* =========================================================
   AXIS COINS CHECKOUT
   ========================================================= */

.coins-page{
  margin:0;
  padding:0 0 70px;
  color:#fff;
  background:
    radial-gradient(circle at 50% 15%,rgba(34,181,255,.08),transparent 34%),
    linear-gradient(180deg,#06101a 0%,#03101a 48%,#02080e 100%);
}

.coins-hero{
  position:relative;
  min-height:410px;
  overflow:hidden;
  background:url("../img/axis-home-bg.png") center 43% / cover no-repeat;
}

.coins-hero::after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:250px;
  background:
    linear-gradient(180deg,rgba(6,16,26,0) 0%,rgba(6,16,26,.28) 30%,rgba(6,16,26,.72) 68%,#06101a 100%);
}

.coins-hero-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(1,8,15,.86) 0%,rgba(1,8,15,.60) 42%,rgba(1,8,15,.24) 72%,rgba(1,8,15,.52) 100%),
    linear-gradient(180deg,rgba(3,10,18,.12),rgba(6,16,26,.66));
}

.coins-hero-content{
  position:relative;
  z-index:2;
  width:min(1360px,calc(100% - 40px));
  margin:0 auto;
  padding-top:105px;
}

.coins-eyebrow{
  margin:0 0 9px;
  color:#39caff;
  font-size:13px;
  font-weight:950;
  letter-spacing:4px;
}

.coins-hero h1{
  margin:0;
  font-size:clamp(44px,5.4vw,78px);
  line-height:.98;
  font-weight:950;
  letter-spacing:2px;
  color:#f4f7fa;
  text-shadow:0 4px 14px rgba(0,0,0,.78);
}

.coins-subtitle{
  margin:15px 0 0;
  color:#2fc8ff;
  font-size:19px;
  font-weight:950;
  letter-spacing:2px;
}

.coins-intro{
  max-width:610px;
  margin:18px 0 0;
  color:#c9d4dd;
  font-size:15px;
  line-height:1.65;
}

.coins-wrap{
  position:relative;
  z-index:3;
  width:min(1360px,calc(100% - 40px));
  margin:-80px auto 0;
}

.coins-breadcrumb{
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:18px;
  color:#86a7ba;
  font-size:12px;
  font-weight:850;
  letter-spacing:.4px;
}

.coins-breadcrumb a{
  color:#42caff;
  text-decoration:none;
}

.coins-layout{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(360px,.75fr);
  gap:24px;
  align-items:start;
}

.benefits-panel,
.checkout-panel{
  background:
    radial-gradient(circle at 15% 10%,rgba(40,184,255,.06),transparent 34%),
    linear-gradient(180deg,rgba(4,15,26,.96),rgba(2,9,16,.985));
  border:1px solid rgba(41,187,255,.34);
  box-shadow:0 24px 44px rgba(0,0,0,.32),inset 0 0 35px rgba(35,172,235,.025);
}

.benefits-panel{
  padding:26px;
  clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 14px,100% calc(100% - 14px),calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px),0 14px);
}

.section-heading{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:14px;
  margin-bottom:20px;
}

.section-heading span{
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(48,193,255,.65));
}

.section-heading span:last-child{
  background:linear-gradient(90deg,rgba(48,193,255,.65),transparent);
}

.section-heading h2{
  margin:0;
  color:#f3f6f8;
  font-size:24px;
  font-weight:950;
  letter-spacing:1px;
}

.benefit-list{
  display:grid;
  gap:12px;
}

.benefit-row{
  min-height:116px;
  display:grid;
  grid-template-columns:118px 1fr;
  border:1px solid rgba(53,190,250,.26);
  background:rgba(3,12,21,.78);
}

.benefit-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  border-right:1px solid rgba(53,190,250,.20);
  background:radial-gradient(circle,rgba(34,177,255,.13),transparent 64%),rgba(5,18,30,.72);
}

.benefit-icon svg{
  width:62px;
  height:62px;
  fill:none;
  stroke:#46caff;
  stroke-width:2.4;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:drop-shadow(0 0 9px rgba(46,194,255,.32));
}

.coins-icon svg{
  stroke:#ffc248;
}

.benefit-copy{
  padding:18px 20px;
}

.benefit-copy h3{
  margin:0 0 7px;
  color:#37caff;
  font-size:18px;
  line-height:1.2;
  font-weight:950;
}

.benefit-copy p{
  margin:0;
  color:#bed0dc;
  font-size:13px;
  line-height:1.55;
}

.checkout-panel{
  position:sticky;
  top:110px;
  padding:26px;
  text-align:center;
  clip-path:polygon(16px 0,calc(100% - 16px) 0,100% 16px,100% calc(100% - 16px),calc(100% - 16px) 100%,16px 100%,0 calc(100% - 16px),0 16px);
}

.checkout-tier{
  color:#37caff;
  font-size:15px;
  font-weight:950;
  letter-spacing:1.2px;
}

.coins-emblem{
  width:132px;
  height:132px;
  margin:14px auto 4px;
  color:#e6f5ff;
  filter:drop-shadow(0 0 10px rgba(91,211,255,.38)) drop-shadow(0 0 20px rgba(75,124,255,.20));
}

.coins-emblem img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
}

.checkout-panel > h2{
  margin:0;
  color:#eaf7ff;
  font-size:32px;
  font-weight:950;
  letter-spacing:2px;
}

.checkout-price{
  margin-top:12px;
  padding:14px 0;
  border-top:1px solid rgba(63,188,242,.20);
  border-bottom:1px solid rgba(63,188,242,.20);
}

.checkout-price strong{
  display:block;
  font-size:42px;
  line-height:1;
  font-weight:950;
  color:#fff;
}

.checkout-price span{
  display:block;
  margin-top:6px;
  color:#95aabc;
  font-size:11px;
  font-weight:850;
}

.checkout-summary{
  margin-top:18px;
  padding:16px;
  text-align:left;
  border:1px solid rgba(61,186,242,.22);
  background:rgba(5,17,28,.74);
}

.checkout-summary > div{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:6px 0;
  color:#b8cbd8;
  font-size:12px;
}

.checkout-summary > div strong{
  color:#9eb6c5;
  white-space:nowrap;
  font-size:11px;
}

.checkout-summary .checkout-total{
  margin-top:10px;
  padding-top:13px;
  border-top:1px solid rgba(74,190,241,.28);
  font-size:15px;
  font-weight:950;
}

.checkout-summary .checkout-total span{
  color:#fff;
}

.checkout-summary .checkout-total strong{
  color:#37caff;
  font-size:15px;
}

.paypal-button{
  width:100%;
  margin-top:18px;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  display:block;
}

.paypal-button img{
  width:100%;
  height:auto;
  display:block;
  object-fit:contain;
  transition:transform .16s ease,filter .16s ease;
}

.paypal-button:hover img{
  transform:scale(1.015);
  filter:brightness(1.08);
}

.paypal-button:focus-visible{
  outline:2px solid #37caff;
  outline-offset:4px;
}

.secure-note{
  margin-top:15px;
  color:#879dac;
  font-size:11px;
  line-height:1.45;
}

.purchase-notes{
  margin-top:22px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border:1px solid rgba(44,191,255,.26);
  background:rgba(3,14,23,.82);
}

.purchase-notes > div{
  padding:19px 20px;
  border-right:1px solid rgba(44,191,255,.20);
}

.purchase-notes > div:last-child{
  border-right:0;
}

.purchase-notes strong{
  display:block;
  margin-bottom:5px;
  color:#38c9ff;
  font-size:12px;
  font-weight:950;
  letter-spacing:.7px;
}

.purchase-notes span{
  color:#9eb5c4;
  font-size:11px;
  line-height:1.45;
}


.paynow-purchase-legal{
  box-sizing:border-box;
  width:100%;
  margin-top:0;
  padding:18px 22px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  border:1px solid rgba(44,191,255,.30);
  border-top:0;
  background:linear-gradient(180deg,rgba(8,29,44,.72),rgba(3,17,28,.88));
  box-shadow:inset 0 1px 0 rgba(155,229,255,.05);
}

.paynow-shield{
  flex:0 0 44px;
  width:44px;
  height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.paynow-shield svg{
  width:40px;
  height:40px;
  fill:none;
  stroke:#42caff;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:drop-shadow(0 0 8px rgba(66,202,255,.40));
}

.paynow-copy{min-width:0;}

.paynow-mor{
  color:#d8e8f1;
  font-size:15px;
  line-height:1.45;
}

.paynow-links{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:5px 12px;
  margin-top:6px;
  font-size:15px;
  line-height:1.4;
}

.paynow-links a{
  color:#54d2ff;
  text-decoration:underline;
  text-underline-offset:2px;
}

.paynow-links a:hover{color:#9ae8ff;}
.paynow-links span{color:#55788c;}

.back-shop{
  display:block;
  width:max-content;
  margin:24px auto 0;
  color:#3fcaff;
  text-decoration:none;
  font-size:13px;
  font-weight:900;
  letter-spacing:.5px;
}

.back-shop:hover{
  color:#8ee5ff;
}

@media(max-width:1000px){
  .coins-layout{
    grid-template-columns:1fr;
  }

  .checkout-panel{
    position:relative;
    top:auto;
  }

  .purchase-notes{
    grid-template-columns:1fr 1fr;
  }

  .purchase-notes > div:nth-child(2){
    border-right:0;
  }

  .purchase-notes > div:nth-child(-n+2){
    border-bottom:1px solid rgba(44,191,255,.20);
  }
}

@media(max-width:700px){
  .paynow-purchase-legal{
    align-items:flex-start;
    justify-content:flex-start;
    gap:12px;
    padding:16px;
  }

  .paynow-shield{
    flex-basis:36px;
    width:36px;
    height:36px;
  }

  .paynow-shield svg{
    width:34px;
    height:34px;
  }

  .paynow-mor,
  .paynow-links{
    font-size:13px;
  }


  .coins-hero{
    min-height:360px;
  }

  .coins-hero-content{
    width:calc(100% - 24px);
    padding-top:85px;
  }

  .coins-wrap{
    width:calc(100% - 20px);
    margin-top:-58px;
  }

  .coins-hero h1{
    font-size:42px;
  }

  .coins-subtitle{
    font-size:14px;
  }

  .benefits-panel,
  .checkout-panel{
    padding:16px;
  }

  .benefit-row{
    grid-template-columns:82px 1fr;
  }

  .benefit-copy{
    padding:15px 14px;
  }

  .benefit-copy h3{
    font-size:15px;
  }

  .benefit-icon svg{
    width:48px;
    height:48px;
  }

  .purchase-notes{
    grid-template-columns:1fr;
  }

  .purchase-notes > div{
    border-right:0;
    border-bottom:1px solid rgba(44,191,255,.20);
  }

  .purchase-notes > div:last-child{
    border-bottom:0;
  }
}