.depth-section{
  padding:100px var(--pad) 110px;
  border-bottom:1px solid var(--line)
}
.depth-heading{
  display:grid;
  grid-template-columns:1.25fr 1fr;
  gap:9vw;
  align-items:end;
  margin:40px 0 60px
}
.depth-heading h2,.faq h2{
  font-size:clamp(36px,4.8vw,74px);
  font-weight:500;
  line-height:1.25;
  letter-spacing:-.06em;
  margin:0
}
.depth-heading>p{
  font-size:14px;
  line-height:1.9;
  color:#62685f;
  margin:0;
  max-width:390px
}
.checkout-modes{
  background:#e7e9e0
}
.experience-layout{
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  gap:6vw;
  align-items:start
}
.experience-tab{
  display:flex;
  align-items:center;
  gap:17px;
  width:100%;
  border-top:1px solid var(--line);
  background:none;
  padding:24px 0;
  text-align:left;
  color:#757c70;
  font-size:16px
}
.experience-tab:last-of-type{
  border-bottom:1px solid var(--line)
}
.experience-tab span{
  font:10px monospace
}
.experience-tab b{
  font-size:20px;
  font-weight:400;
  margin-left:auto
}
.experience-tab.active{
  color:var(--blue)
}
.experience-description{
  font-size:13px;
  line-height:1.9;
  min-height:76px;
  color:#646b5f;
  margin:25px 0
}
.experience-frame{
  background:#f8f9f6;
  border:1px solid #bcc2b4;
  box-shadow:0 25px 60px #242c1712;
  overflow:hidden;
  transition:background .5s
}
.browser-rail{
  height:40px;
  display:flex;
  gap:5px;
  align-items:center;
  padding:0 15px;
  background:#dce0d5;
  border-bottom:1px solid #c7cdc0
}
.browser-rail i{
  width:5px;
  height:5px;
  background:#8e9784;
  border-radius:50%
}
.browser-rail span{
  margin-left:14px;
  font:10px monospace;
  color:#66705e
}
.experience-body{
  min-height:330px;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  padding:30px;
  gap:25px;
  transition:padding .5s
}
.store-order{
  color:#66705e;
  transition:opacity .5s,transform .5s
}
.store-order h3{
  font-size:24px;
  font-weight:500;
  color:var(--ink);
  margin:25px 0 10px
}
.store-order>span:not(.mono){
  font-size:11px
}
.store-order strong{
  display:block;
  font-size:27px;
  letter-spacing:-1px;
  color:var(--ink);
  margin:22px 0
}
.store-order small{
  font:11px monospace;
  letter-spacing:0
}
.store-order p{
  font-size:11px
}
.order-divider{
  height:1px;
  background:var(--line)
}
.mini-checkout{
  padding:25px 22px;
  background:white;
  border:1px solid #dce1d6;
  box-shadow:0 15px 35px #1c251411;
  transition:transform .6s,border-color .6s;
  min-width:0
}
.mini-checkout img{
  height:auto;
  max-width:100%;
  display:block;
  margin-bottom:25px
}
.mini-checkout>.screen-label{
  display:block;
  margin:15px 0
}
.mini-asset{
  display:flex;
  align-items:center;
  font-size:12px;
  gap:12px;
  padding:13px 0;
  border-top:1px solid #e8eae5
}
.mini-asset b{
  display:grid;
  place-items:center;
  width:23px;
  height:23px;
  background:#edf0ff;
  color:var(--blue);
  border-radius:50%
}
.mini-asset>span{
  margin-left:auto
}
.mode-badge{
  font-size:10px;
  color:#7e8875;
  line-height:1.8;
  margin-top:15px
}
.experience-foot{
  display:flex;
  align-items:center;
  justify-content:space-around;
  padding:17px;
  border-top:1px solid #dce1d6;
  font-size:10px;
  color:#7d8773
}
.experience-foot b{
  color:var(--blue)
}
.experience-frame[data-mode=hosted] .mini-checkout{
  transform:translateX(-18px)
}
.experience-frame[data-mode=embed] .mini-checkout{
  border-color:var(--blue);
  transform:translateX(0)
}
.experience-frame[data-mode=link] .experience-body{
  padding:30px 45px
}
.experience-frame[data-mode=link] .store-order{
  transform:translateY(-6px)
}
.experience-frame[data-mode=qr] .mini-checkout{
  transform:translateY(-8px);
  border-color:var(--blue)
}
.asset-explorer{
  background:#111319;
  color:var(--paper)
}
.asset-explorer .depth-heading>p{
  color:#979da8
}
.asset-explorer .section-top{
  color:#8b94a6
}
.asset-explorer-bar{
  display:flex;
  justify-content:space-between;
  gap:25px;
  border-bottom:1px solid #ffffff26;
  padding-bottom:22px
}
.asset-filters{
  display:flex;
  gap:10px
}
.asset-filters button{
  color:#9198a8;
  background:none;
  padding:12px 18px;
  border:1px solid #ffffff26;
  font-size:12px
}
.asset-filters button.active{
  color:white;
  background:#234cff;
  border-color:#234cff
}
.asset-search{
  display:flex;
  align-items:center;
  gap:15px;
  border-bottom:1px solid #ffffff40;
  font-size:11px;
  color:#8e97a8
}
.asset-search input{
  background:none;
  border:0;
  color:white;
  padding:12px 0;
  font:12px Arial;
  width:180px;
  outline-offset:6px
}
.asset-catalog{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  min-height:220px
}
.catalog-asset{
  padding:28px 15px 28px 0;
  border-bottom:1px solid #ffffff20;
  display:flex;
  align-items:center;
  gap:17px;
  animation:assetin .45s both
}
.catalog-asset b{
  font-size:25px;
  font-weight:500;
  width:54px;
  height:54px;
  border:1px solid #ffffff26;
  display:grid;
  place-items:center;
  color:#a5b8ff
}
.catalog-asset strong{
  font-size:17px;
  display:block;
  font-weight:500
}
.catalog-asset small{
  font:10px monospace;
  color:#8d96a7;
  display:block;
  margin-top:6px
}
.catalog-empty{
  grid-column:1/-1;
  padding:50px 0;
  color:#939caf;
  font-size:14px
}
.asset-settlement{
  display:flex;
  align-items:center;
  gap:25px;
  padding-top:45px
}
.asset-settlement>span:last-child{
  font-size:12px;
  color:#9aa2b4
}
.asset-settlement strong{
  font-size:28px;
  font-weight:500;
  white-space:nowrap
}
.asset-settlement strong span{
  color:#667082
}
.flow-wire{
  flex:1;
  max-width:300px;
  height:1px;
  background:#3a476b;
  position:relative;
  overflow:hidden
}
.flow-wire i{
  position:absolute;
  height:3px;
  width:30px;
  background:#6583ff;
  top:-1px;
  animation:flowAcross 3s linear infinite
}
.flow-wire i:nth-child(2){
  animation-delay:1s
}
.flow-wire i:nth-child(3){
  animation-delay:2s
}
@keyframes flowAcross{
  from{
    left:-30px
  }
  to{
    left:100%
  }
}
@keyframes assetin{
  from{
    opacity:0;
    transform:translateY(12px)
  }
  to{
    opacity:1;
    transform:translateY(0)
  }
}
.settlement-layout{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8vw
}
.settlement-switch{
  display:flex;
  gap:0;
  border-bottom:1px solid var(--line)
}
.settlement-switch button{
  background:none;
  padding:16px 12px;
  color:#7e8774;
  font-size:11px;
  border-bottom:2px solid transparent
}
.settlement-switch button.active{
  color:var(--blue);
  border-color:var(--blue)
}
.withdraw-quote{
  padding:30px 25px;
  background:#e7e9e0;
  margin-top:20px
}
.withdraw-quote>div:first-child>span{
  font-size:11px;
  color:#7a8272
}
.withdraw-quote strong{
  display:block;
  font-size:42px;
  font-weight:500;
  letter-spacing:-2px;
  margin:22px 0 32px
}
.withdraw-quote small{
  font:12px monospace;
  letter-spacing:0
}
.withdraw-line{
  display:flex;
  justify-content:space-between;
  padding:17px 0;
  border-top:1px solid #bbc3b1;
  font-size:12px
}
.withdraw-line b{
  font-weight:500
}
.withdraw-line.net{
  color:var(--blue)
}
.withdraw-quote>p{
  font-size:11px;
  line-height:1.8;
  color:#727e66;
  min-height:39px;
  margin-bottom:0
}
.gas-control:not([hidden]){
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:11px;
  color:#6a745e;
  margin-bottom:20px
}
.gas-control input{
  font:14px monospace;
  background:#f5f6ef;
  border:1px solid #adb99d;
  width:100px;
  padding:8px
}
.settlement-rules article{
  display:flex;
  gap:25px;
  padding:25px 0;
  border-top:1px solid var(--line)
}
.settlement-rules article>span{
  font:10px monospace;
  color:var(--blue);
  padding-top:5px
}
.settlement-rules h3{
  font-size:20px;
  font-weight:500;
  margin:0 0 13px
}
.settlement-rules p{
  font-size:13px;
  line-height:1.9;
  color:#727b68;
  margin:0
}
.plan-position{
  font-size:13px;
  color:#252c20;
  line-height:1.8;
  margin:0 0 16px
}
.price-col .text-link{
  margin-top:25px
}
.cost-calculator{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:6vw;
  border-top:1px solid var(--line);
  padding:45px 0;
  margin-top:30px
}
.cost-calculator h3{
  font-size:25px;
  font-weight:500;
  letter-spacing:-.03em;
  margin:17px 0 25px
}
.cost-calculator label{
  display:block;
  font-size:11px;
  color:#747d69;
  margin-bottom:10px
}
.cost-calculator input{
  width:100%;
  max-width:320px;
  border:0;
  border-bottom:1px solid #8c9880;
  background:none;
  padding:8px 0;
  font:32px monospace;
  color:var(--ink);
  border-radius:0
}
.cost-calculator p{
  font-size:11px;
  line-height:1.8;
  color:#7f8875
}
.volume-presets{
  display:flex;
  gap:7px;
  margin-top:18px
}
.volume-presets button{
  font-size:11px;
  background:none;
  border:1px solid #bbc4b1;
  padding:8px 12px;
  color:#727d65
}
.volume-presets button.active{
  color:var(--blue);
  border-color:var(--blue)
}
.cost-results{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  align-items:center;
  gap:10px
}
.cost-result{
  border:1px solid var(--line);
  padding:25px 15px;
  position:relative;
  min-width:0
}
.cost-result.lowest{
  border-color:var(--blue);
  background:#234cff08
}
.cost-result span{
  font:11px monospace
}
.cost-result strong{
  font-size:clamp(20px,2.7vw,38px);
  display:block;
  letter-spacing:-1px;
  margin:22px 0 10px;
  font-weight:500;
  overflow-wrap:anywhere
}
.cost-result small{
  font:10px monospace;
  color:#7b8770
}
.cost-result em{
  display:block;
  font-size:10px;
  color:var(--blue);
  font-style:normal;
  min-height:14px;
  margin-top:25px
}
.plan-comparison{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  scroll-margin-top:100px
}
.plan-comparison summary{
  display:flex;
  justify-content:space-between;
  padding:28px 0;
  font-size:20px;
  cursor:pointer;
  list-style:none
}
.plan-comparison summary::-webkit-details-marker,.faq summary::-webkit-details-marker{
  display:none
}
.details-action{
  font-size:12px;
  color:#758369;
  display:flex;
  align-items:center;
  gap:30px
}
.details-action b{
  font-size:24px;
  font-weight:400;
  transition:transform .3s
}
details[open] .details-action b{
  transform:rotate(45deg)
}
.compare-scroll{
  overflow:auto;
  max-height:650px
}
.compare-scroll table{
  border-collapse:collapse;
  width:100%;
  min-width:760px;
  table-layout:fixed;
  text-align:left;
  font-size:12px;
  line-height:1.8
}
.compare-scroll th,.compare-scroll td{
  padding:18px 20px 18px 0;
  border-bottom:1px solid var(--line);
  vertical-align:top
}
.compare-scroll th{
  font-weight:500
}
.compare-scroll th:first-child{
  width:28%
}
.compare-scroll thead{
  position:sticky;
  top:0;
  background:var(--paper);
  z-index:2;
  color:var(--blue)
}
.compare-scroll td{
  color:#69765f
}
.compare-note{
  font-size:11px;
  line-height:1.9;
  color:#77856b;
  padding:15px 0 25px
}
.enterprise-section{
  background:#dfe5d6
}
.enterprise-flow{
  display:grid;
  grid-template-columns:1fr 1fr 1.2fr;
  align-items:center;
  gap:5vw;
  padding:35px 0;
  border-top:1px solid var(--line)
}
.enterprise-hub{
  display:flex;
  flex-direction:column;
  gap:25px;
  align-items:flex-start
}
.enterprise-hub>span{
  font-size:12px;
  color:#657357
}
.enterprise-branches{
  display:flex;
  flex-direction:column;
  gap:12px;
  position:relative
}
.enterprise-branches button{
  display:flex;
  gap:22px;
  padding:19px;
  text-align:left;
  border:1px solid #a8b59a;
  background:none;
  color:#6c7d5d;
  font-size:13px
}
.enterprise-branches button span{
  font:10px monospace
}
.enterprise-branches button.active{
  border-color:var(--blue);
  color:var(--blue);
  background:#ffffff40
}
.enterprise-description h3{
  font-size:24px;
  font-weight:500;
  margin:0 0 20px
}
.enterprise-description p{
  font-size:13px;
  line-height:1.9;
  color:#647557;
  margin:0
}
.enterprise-description{
  animation:assetin .4s both
}
.faq-layout{
  display:grid;
  grid-template-columns:1fr 1.3fr;
  gap:8vw;
  margin-top:45px
}
.faq h2{
  font-size:clamp(32px,3.5vw,54px)
}
.faq-list details{
  border-top:1px solid var(--line)
}
.faq-list details:last-child{
  border-bottom:1px solid var(--line)
}
.faq summary{
  padding:25px 0;
  display:flex;
  justify-content:space-between;
  gap:25px;
  cursor:pointer;
  font-size:15px;
  line-height:1.8;
  list-style:none
}
.faq summary b{
  font-size:20px;
  font-weight:400;
  color:var(--blue);
  transition:transform .3s
}
.faq details[open] summary b{
  transform:rotate(45deg)
}
.faq details p{
  font-size:13px;
  line-height:2;
  color:#6e7d60;
  margin:0 35px 25px 0;
  animation:assetin .3s both
}
.merchant-detail{
  margin-top:25px;
  border-top:1px solid #ffffff25;
  font-size:10px
}
.merchant-detail-head,.merchant-detail-row{
  display:flex;
  justify-content:space-between;
  gap:15px;
  padding:12px 0;
  border-bottom:1px solid #ffffff15;
  line-height:1.8
}
.merchant-detail-head{
  color:#8996ae
}
.merchant-detail-row>span:last-child{
  color:#a3b5ff
}
.merchant-detail-row>span:first-child{
  color:#b4bbc8
}
.merchant-detail-meta{
  font:9px/1.8 monospace;
  color:#68758c;
  margin-top:15px
}
.footer-links{
  flex-wrap:wrap
}
@media(max-width:1050px){
  .experience-layout{
    grid-template-columns:.8fr 1.2fr;
    gap:4vw
  }
  .experience-body{
    padding:20px;
    gap:15px
  }
  .mini-checkout{
    padding:20px 15px
  }
  .cost-calculator{
    gap:3vw
  }
  .cost-result{
    padding:22px 10px
  }
  .asset-catalog{
    grid-template-columns:repeat(3,1fr)
  }
  .enterprise-flow{
    gap:3vw
  }
  .nav-status{
    display:none
  }
}
@media(max-width:720px){
  .depth-section{
    padding:70px var(--pad)
  }
  .depth-heading{
    grid-template-columns:1fr;
    gap:25px;
    margin:30px 0 40px
  }
  .depth-heading h2{
    font-size:9.4vw
  }
  .depth-heading>p{
    font-size:13px
  }
  .experience-layout,.settlement-layout,.cost-calculator,.faq-layout{
    grid-template-columns:1fr;
    gap:35px
  }
  .experience-tab{
    padding:19px 0
  }
  .experience-description{
    min-height:0
  }
  .experience-body{
    padding:20px 15px;
    min-height:320px;
    gap:12px
  }
  .mini-checkout{
    padding:20px 12px
  }
  .experience-frame[data-mode=hosted] .mini-checkout{
    transform:translateX(-5px)
  }
  .experience-frame[data-mode=link] .experience-body{
    padding:20px 15px
  }
  .store-order strong{
    font-size:23px
  }
  .asset-explorer-bar{
    flex-direction:column
  }
  .asset-filters button{
    padding:11px 14px
  }
  .asset-search input{
    width:100%
  }
  .asset-catalog{
    grid-template-columns:repeat(2,1fr)
  }
  .catalog-asset{
    gap:12px;
    padding:22px 10px 22px 0
  }
  .catalog-asset b{
    width:40px;
    height:40px;
    font-size:20px
  }
  .catalog-asset strong{
    font-size:15px
  }
  .catalog-asset small{
    font-size:9px
  }
  .asset-settlement{
    flex-wrap:wrap;
    gap:18px;
    padding-top:30px
  }
  .flow-wire{
    min-width:40px
  }
  .asset-settlement .mono{
    font-size:9px
  }
  .asset-settlement strong{
    font-size:22px
  }
  .asset-settlement>span:last-child{
    width:100%;
    font-size:11px
  }
  .settlement-switch button{
    padding:15px 10px;
    font-size:10px
  }
  .withdraw-quote strong{
    font-size:38px
  }
  .settlement-rules h3{
    font-size:18px
  }
  .cost-calculator{
    padding:30px 0
  }
  .cost-result strong{
    font-size:22px
  }
  .cost-result span{
    font-size:9px
  }
  .cost-result em{
    font-size:9px
  }
  .plan-comparison summary{
    font-size:18px
  }
  .compare-scroll table{
    font-size:11px;
    min-width:720px
  }
  .enterprise-flow{
    grid-template-columns:1fr;
    gap:30px
  }
  .enterprise-hub{
    flex-direction:row;
    align-items:center;
    justify-content:space-between
  }
  .enterprise-branches{
    flex-direction:row;
    gap:8px
  }
  .enterprise-branches button{
    flex:1;
    font-size:11px;
    padding:13px 9px;
    gap:10px;
    flex-direction:column
  }
  .enterprise-description{
    min-height:130px
  }
  .enterprise-description h3{
    font-size:21px
  }
  .faq-layout{
    margin-top:30px
  }
  .faq h2{
    font-size:9vw
  }
  .faq summary{
    font-size:14px
  }
  .merchant-detail{
    font-size:9px
  }
  .plan-features{
    line-height:2.1
  }
}
@media(prefers-reduced-motion:reduce){
  .flow-wire i{
    animation:none
  }
  .catalog-asset,.enterprise-description,.faq details p{
    animation:none
  }
  .experience-frame,.experience-body,.mini-checkout,.store-order{
    transition:none
  }
}
