/* Four-service composition adapted from Coincore's feature section at 13.4s. */
#services{position:relative;isolation:isolate;padding-block:100px 110px}
#services:before{display:none}
#services .section-heading{display:flex;flex-direction:column;align-items:center;gap:0;text-align:center;margin:0 auto 36px;max-width:750px}
#services .eyebrow{display:inline-flex;align-items:center;gap:8px;border:1px solid #e9d06724;border-radius:24px;padding:6px 12px;background:#e9d06706;color:#d4c06c;font-size:11px;font-weight:650;letter-spacing:.9px;margin-bottom:21px}
#services .eyebrow:before{content:'';width:5px;height:5px;border-radius:50%;background:var(--yellow)}
#services h2{font-size:clamp(34px,3.55vw,49px);font-weight:700;line-height:1.16;letter-spacing:-1.9px}
#services .section-intro{width:100%;max-width:480px;font-size:16px;line-height:1.65;color:#aeb5a7;padding:0;margin:12px auto 0;text-align:center;text-wrap:balance}
#services .section-heading>.section-intro{margin-top:12px}
@media(max-width:600px){#services .services-intro-break{display:none}}
#services .services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:1fr 1fr;gap:18px;align-items:stretch}
#services .service-card{padding:0;min-height:0;position:relative;display:flex;flex-direction:column;overflow:hidden;border:1px solid #ffffff20;border-radius:22px;background:linear-gradient(145deg,#141611,#0d0f0d 62%);transition:border-color .25s,box-shadow .25s,transform .25s}
#services .service-card:before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 90% 50% at 50% 0,#e1c63809,transparent 80%)}
#services .service-card:hover,#services .service-card:focus-visible{border-color:#d9bf4966;box-shadow:0 12px 35px #0004,inset 0 1px 0 #fff1;transform:translateY(-4px)}
#services .service-currency{grid-column:1;grid-row:1/3}
#services .service-crypto{grid-column:2;grid-row:1}
#services .service-transfer{grid-column:2;grid-row:2}
#services .service-wallet{grid-column:3;grid-row:1/3}
#services .service-number{top:21px;right:23px;z-index:2;font-size:10px;letter-spacing:1px;color:#858b7a}
.service-art{width:100%;position:relative;overflow:hidden;pointer-events:none;flex-shrink:0;isolation:isolate}
.service-art:before{content:'';position:absolute;inset:0;background-image:radial-gradient(#b8bd9d24 .8px,transparent .9px);background-size:11px 11px;mask-image:linear-gradient(#0009,transparent 93%);opacity:.55;z-index:-1}
.service-art:after{content:'';position:absolute;left:10%;right:10%;top:25%;height:160px;border-radius:50%;background:radial-gradient(ellipse,#d6b92315,transparent 70%);filter:blur(18px);z-index:-1}
.service-art>svg{display:block;width:100%;height:100%;overflow:visible}
.service-art>img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .6s cubic-bezier(.22,1,.36,1)}
#services .service-card:hover .service-art>img,#services .service-card:focus-visible .service-art>img{transform:translateY(-5px)}
#services .service-currency .service-art,#services .service-wallet .service-art{height:auto;min-height:330px;flex:1;padding:32px 10px 0}
#services .service-currency .service-art,#services .service-wallet .service-art{display:grid;place-items:center}
#services .service-currency .service-art>img{width:72%;max-width:255px;height:auto;max-height:280px}
#services .service-wallet .service-art>img{width:76%;max-width:245px;height:auto;max-height:170px}
#services .service-currency .service-art{padding:24px 14px 0;background:radial-gradient(ellipse at 46% 45%,#f4ce2110,transparent 65%)}
#services .service-currency .service-art:before{opacity:.15}
#services .service-currency .service-art>img{filter:drop-shadow(0 15px 16px #0004)}
#services .service-wallet .service-art{padding:26px 16px 0;background:radial-gradient(ellipse at 28% 35%,#f4ce2116,transparent 52%),radial-gradient(ellipse at 77% 65%,#16bc8809,transparent 55%)}
#services .service-wallet .service-art:before{opacity:.2}
#services .service-wallet .service-art>img{filter:drop-shadow(0 16px 17px #0005)}
#services .service-crypto .service-art,#services .service-transfer .service-art{height:122px;padding:17px 22px 0}
#services .service-transfer .service-art{display:flex;align-items:center;justify-content:center}
#services .service-transfer .service-art>img{width:100%;max-width:300px;min-height:0;height:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 10px 12px #0005)}
.service-card-content{display:flex;flex-direction:column;align-items:flex-start;flex:1;width:100%;padding:20px 26px 24px;position:relative;z-index:1}
#services .service-currency .service-card-content,#services .service-wallet .service-card-content{padding-top:27px;flex:0}
#services .service-card h3{font-size:22px;line-height:1.3;letter-spacing:-.6px;font-weight:700;margin:0 0 12px}
#services .service-card p{font-size:14px;line-height:1.8;color:#b0b7a8;margin:0 0 23px;text-wrap:pretty}
#services .service-link{border-top:1px solid #ffffff0c;padding-top:15px;margin-top:auto;font-size:12px;font-weight:650;color:#d3d7c9;gap:12px;line-height:1.65}
#services .service-link .icon{width:17px;height:17px;color:#c0b76b;transition:transform .25s}
#services .service-card:hover .service-link .icon{transform:translate(2px,-2px)}
.service-coin-row{display:flex;align-items:center;justify-content:center;gap:16px;height:100%;position:relative}
.service-coin-row:before{content:'';height:1px;background:linear-gradient(90deg,transparent,#b5a04e55,transparent);position:absolute;left:3%;right:3%;top:50%;z-index:-1}
.service-coin-row .coin{width:44px;height:44px;border:1px solid #ffffff22;font-size:30px;box-shadow:0 0 0 7px #10130e,0 10px 25px #0005}
.service-coin-row .coin svg{width:29px;height:29px}
.service-coin-row .usdt{width:56px;height:56px;box-shadow:0 0 0 7px #10130e,0 0 30px #5eb29b15}
.service-coin-row .usdt svg{width:37px;height:37px}
#services .service-coin-row .coin{background:transparent;border:0;flex-shrink:0}
.service-coin-row .coin img{display:block;width:100%;height:100%;object-fit:contain}
@media(max-width:1100px){#services .services-grid{gap:15px}#services .service-card h3{font-size:19px}#services .service-card p{font-size:14px}.service-card-content{padding:18px 21px 23px}#services .service-currency .service-art,#services .service-wallet .service-art{height:310px}#services .service-crypto .service-art,#services .service-transfer .service-art{height:115px;padding-inline:17px}.service-coin-row{gap:12px}.service-coin-row .coin{width:36px;height:36px;font-size:26px}.service-coin-row .coin svg{width:25px;height:25px}.service-coin-row .usdt{width:46px;height:46px}}
@media(max-width:850px){#services{padding-block:80px}#services .services-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto;gap:18px}#services .service-card{grid-column:auto;grid-row:auto}#services .service-currency .service-art,#services .service-wallet .service-art,#services .service-crypto .service-art,#services .service-transfer .service-art{height:205px;padding:18px 22px 0}#services .service-card .service-card-content{padding:20px 24px 24px}#services .service-card h3{font-size:21px}#services .service-card p{font-size:15px}.service-coin-row{gap:18px}.service-coin-row .coin{width:42px;height:42px}.service-coin-row .usdt{width:54px;height:54px}#services .service-number{font-size:11px}}
@media(max-width:600px){#services{padding-block:65px}#services .section-heading{margin-bottom:30px}#services .eyebrow{font-size:9px;letter-spacing:.65px;padding:6px 10px;margin-bottom:18px}#services h2{font-size:34px;letter-spacing:-1.25px}#services .section-intro{font-size:15px;margin-top:17px}#services .services-grid{grid-template-columns:1fr;gap:16px;max-width:440px;margin:auto}#services .service-card{border-radius:19px}#services .service-card .service-art{height:190px;padding-top:12px}#services .service-card .service-card-content{padding:17px 24px 24px}#services .service-card h3{font-size:22px}#services .service-card p{font-size:15px;line-height:1.85}#services .service-link{font-size:13px}#services .service-card p{margin-bottom:21px}.service-coin-row{gap:22px}.service-coin-row .coin{width:43px;height:43px}.service-coin-row .usdt{width:56px;height:56px}}
@media(max-width:850px){#services .service-currency .service-art,#services .service-wallet .service-art{min-height:0;flex:none}}
@media(max-width:600px){#services .service-card.service-currency .service-art{height:190px}#services .service-currency .service-art>img{width:auto;max-width:70%;height:165px}#services .service-wallet .service-art>img{width:68%;max-width:215px}}
@media(prefers-reduced-motion:reduce){.service-art>img{transition:none}#services .service-card:hover,#services .service-card:focus-visible,#services .service-card:hover .service-art>img,#services .service-card:focus-visible .service-art>img{transform:none}}
#services .service-wallet .service-art{display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 44%,#c9c9b52b,transparent 72%)}
#services .service-wallet .service-art>img{width:94%;max-width:310px;height:auto;max-height:260px;object-fit:contain}
@media(max-width:850px){
  #services .service-wallet .service-art>img{width:100%;max-width:280px;height:100%;max-height:100%;min-height:0}
}
/* Mobile service cards form a swipeable row with the next card in view. */
@media(max-width:600px){
  #services .services-grid{display:flex;align-items:stretch;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;gap:14px;padding:6px 0 16px;scrollbar-width:thin;scrollbar-color:var(--yellow) #ffffff12}
  #services .service-card{flex:0 0 88%;min-width:0;scroll-snap-align:start;scroll-snap-stop:always;border:2px solid var(--yellow)}
  #services .service-card:hover,#services .service-card:focus-visible{border-color:var(--yellow)}
  #services .service-card .service-card-content{flex:1;padding-inline:20px}
  #services .service-card:hover,#services .service-card:focus-visible{transform:none}
  #services .service-coin-row{gap:clamp(10px,3vw,18px)}
  #services .service-coin-row .coin{width:clamp(32px,9vw,43px);height:clamp(32px,9vw,43px)}
  #services .service-coin-row .usdt{width:clamp(42px,12vw,56px);height:clamp(42px,12vw,56px)}
}
