/* Full-bleed stadium scene with the MobCash and 1xBet interface integrated on the phone. */
html,body{max-width:100%;overflow-x:clip}
.hero{isolation:isolate;background:#06131b}
.hero-visual{position:absolute;inset:0;height:auto;z-index:0;overflow:hidden;pointer-events:none}
.hero-picture{position:absolute;inset:0;display:block;overflow:hidden}
.hero-art{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;mix-blend-mode:normal;mask-image:none;-webkit-mask-image:none;animation:stadium-drift 24s ease-in-out infinite alternate;will-change:transform}
.hero-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,15,22,.14) 0%,rgba(5,15,22,.17) 37%,rgba(5,15,22,.76) 62%,rgba(5,15,22,.92) 100%),linear-gradient(0deg,rgba(4,14,20,.72),transparent 32%,rgba(4,14,20,.12) 72%,rgba(4,15,22,.22));pointer-events:none}
.hero-visual:before{content:"";position:absolute;z-index:1;inset:-40% auto auto -20%;width:72%;height:115%;background:linear-gradient(105deg,transparent 37%,rgba(147,255,228,.11) 50%,transparent 62%);filter:blur(15px);transform:rotate(-9deg);animation:stadium-beam 9s ease-in-out infinite alternate;pointer-events:none}
.hero-layout{position:static;z-index:auto;grid-template-columns:1fr;min-height:575px}
.hero-copy{width:min(100%,610px);margin-inline-start:0;margin-inline-end:auto;padding:0 16px 20px}
.hero-grid{z-index:1;opacity:.12;mask-image:linear-gradient(180deg,#000,transparent 96%)}
.hero-orb{z-index:1}
.card-rate{right:49%;top:16%}
.card-usdt{left:4%;bottom:12%}
.visual-label{right:18%;bottom:5%}
.hero-bottom{position:relative;z-index:2}
.brand-image{gap:0;width:48px;height:48px;justify-content:center;flex:none}
.brand-logo{display:block;width:48px;height:48px;object-fit:contain;filter:drop-shadow(0 5px 16px #26e0ad50)}
.mock-dashboard{position:relative;min-height:420px;display:flex;align-items:center;justify-content:center;gap:34px;overflow:hidden;background:radial-gradient(ellipse at 50% 25%,#16604b6b,transparent 42%),linear-gradient(145deg,#102932,#07151d 72%)}
.mock-dashboard:before,.mock-dashboard:after{content:"";position:absolute;border:1px solid #70efd426;border-radius:50%;aspect-ratio:1;pointer-events:none}
.mock-dashboard:before{width:270px;right:8%;top:-28%;animation:orbit-turn 34s linear infinite}
.mock-dashboard:after{width:190px;left:12%;bottom:-24%;border-color:#ffc76a2c;animation:orbit-turn 28s linear infinite reverse}
.dashboard-phone{position:relative;z-index:1;width:218px;min-height:366px;padding:19px 15px 16px;border:2px solid #76f4d766;border-radius:31px;background:linear-gradient(160deg,#102a33,#07151d);box-shadow:0 20px 64px #0008,0 0 48px #34d9b620;text-align:center;animation:phone-float 5.6s ease-in-out infinite}
.phone-notch{width:65px;height:7px;margin:0 auto 14px;border-radius:8px;background:#1d3a43}
.dash-title{display:block;color:#effff7;font-size:17px;line-height:1.35}.dash-subtitle{display:block;color:#8ca7a6;font-size:10px;margin:2px 0 14px}
.balance-tile{position:relative;padding:14px 12px;border:1px solid #4ee3c52b;border-radius:14px;background:linear-gradient(120deg,#123b39,#15483f)}
.balance-tile small,.history-title{display:block;color:#a9c7c0;font-size:9px;text-align:right}.balance-tile b{display:block;color:#edfff8;font:700 23px var(--latin);direction:ltr;text-align:right}.balance-tile span{position:absolute;left:12px;bottom:13px;color:#061d20;background:#6ae7bd;border-radius:50%;width:24px;height:24px;font-size:15px;line-height:24px}
.dash-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:12px 0 13px}.dash-actions>span{padding:8px 6px;border-radius:10px;background:#102c34;color:#62efd0;font-size:16px}.dash-actions>span+span{color:#ffd186}.dash-actions small{display:block;color:#d8e8e1;font-size:9px}
.history-title{margin-bottom:5px}.history-row{height:29px;display:flex;align-items:center;gap:8px;margin-top:5px;padding:0 9px;border-radius:8px;background:#102630}.history-row i{width:7px;height:7px;border-radius:50%;background:#55e8ca}.history-row:nth-of-type(2) i{background:#ffc76a}.history-row b,.history-row small{height:4px;border-radius:5px;background:#658580}.history-row b{width:49px}.history-row small{width:23px;margin-inline-start:auto;background:#194d43}
.dashboard-side{position:relative;z-index:1;display:grid;gap:7px;color:#dcfff3;text-align:right}.dashboard-side b{font:700 22px var(--latin)}.dashboard-side small{color:#8eaaa5;font-size:10px}.dashboard-side i{width:28px;height:2px;margin:8px 0;background:linear-gradient(90deg,transparent,#4be3c6)}.dash-orbit{position:absolute;inset:-20px -15px auto auto;width:110px;height:110px;border:1px solid #50e8ce35;border-radius:50%;animation:orbit-turn 16s linear infinite}
.dash-light{position:absolute;width:220px;height:220px;border-radius:50%;background:#36e2b422;filter:blur(55px);animation:halo-pulse 5s ease-in-out infinite}
.flow-visual{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;gap:8px;min-height:146px;padding:18px 12px;overflow:hidden;background:radial-gradient(ellipse at center,#15413788,transparent 62%),#091922}
.flow-visual:before{content:"";position:absolute;top:47px;right:12%;left:12%;height:2px;background:repeating-linear-gradient(90deg,#45e6c8 0 7px,transparent 7px 14px);animation:flow-travel 2.5s linear infinite}
.flow-visual-node{position:relative;z-index:1;display:grid;justify-items:center;gap:4px;text-align:center}
.flow-visual-node b{width:43px;height:43px;display:grid;place-items:center;border:1px solid #54e8ca55;border-radius:50%;background:#123c38;color:#70f2d3;font:700 11px var(--latin);box-shadow:0 0 20px #48e6cb20}
.flow-visual-node:nth-child(2) b{color:#ffd186;border-color:#ffd18655;background:#493b22}.flow-visual-node:nth-child(4) b{color:#ffd186;border-color:#ffd18655;background:#493b22}
.flow-visual-node strong{color:#eefcf6;font-size:10px;white-space:nowrap}.flow-visual-node small{color:#91aaa7;font-size:8px;line-height:1.4}
.process-graphic{border-radius:16px}
@keyframes stadium-drift{0%{transform:scale(1.015) translate3d(0,0,0)}100%{transform:scale(1.065) translate3d(-.5%,.4%,0)}}
@keyframes stadium-beam{0%{opacity:.2;transform:translateX(-12%) rotate(-9deg)}100%{opacity:.85;transform:translateX(35%) rotate(-9deg)}}
@keyframes phone-float{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-9px) rotate(1deg)}}
@keyframes flow-travel{to{background-position:28px 0}}
@media(max-width:900px){.hero-layout{min-height:550px}.hero-copy{width:min(100%,560px)}.card-rate{right:46%}.mock-dashboard{min-height:380px}}
@media(max-width:650px){
  .brand-image,.brand-logo{width:40px;height:40px}
  .hero{min-height:720px;padding:38px 0 22px;background:#06131b}
  .hero-layout{display:flex;flex-direction:column;align-items:stretch;min-height:640px}
  .hero-copy{width:100%;padding:0;margin:0;z-index:3}
  .hero-visual{position:absolute;inset:0;height:auto;margin:0;z-index:0}
  .hero-art{object-position:32% center;animation-duration:28s}
  .hero-visual:after{background:linear-gradient(180deg,rgba(5,15,22,.76) 0%,rgba(5,15,22,.62) 42%,rgba(5,15,22,.18) 78%,rgba(5,15,22,.7) 100%),linear-gradient(90deg,rgba(5,15,22,.14),rgba(5,15,22,.18))}
  .card-rate{top:auto;right:3%;bottom:16%;transform:scale(.78);transform-origin:bottom right}
  .card-usdt{left:2%;bottom:8%;transform:scale(.78);transform-origin:bottom left}
  .visual-label{right:27%;bottom:1%;font-size:8px}
  .hero-bottom{position:relative;z-index:3}
  .mock-dashboard{min-height:350px;gap:20px;padding:14px}
  .dashboard-phone{width:196px;min-height:342px;padding:16px 13px;border-radius:28px}
  .dashboard-side{gap:5px}.dashboard-side b{font-size:18px}.dashboard-side small{font-size:8px}
  .flow-visual{min-height:130px;gap:2px;padding-inline:5px}
  .flow-visual:before{right:10%;left:10%;top:43px}
  .flow-visual-node b{width:37px;height:37px;font-size:9px}
  .flow-visual-node strong{font-size:8px}.flow-visual-node small{font-size:7px}
}
@media(max-width:390px){.hero-actions{gap:11px}.hero-actions .button{padding-inline:13px}.hero-actions .text-link{font-size:10px}.hero-proof{gap:8px}.card-usdt{left:0}.card-rate{right:0}.flow-card{padding:14px}.flow-visual-node strong{font-size:7px}}
@media(prefers-reduced-motion:reduce){.hero-art,.hero-visual:before,.dashboard-phone,.dash-orbit,.dash-light,.mock-dashboard:before,.mock-dashboard:after,.flow-visual:before{animation:none!important}}
