/* Meraki Websites - Cinematic 3D scroll hero styles */
#meraki-cinematic{position:relative;min-height:100vh;width:100%;overflow:hidden;background:linear-gradient(135deg,#0a0a23 0%,#1a1148 45%,#2b1a6b 100%);display:grid;place-items:center;padding:0!important;}
#meraki-cinematic .mx-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;border:0;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;white-space:nowrap;}
#meraki-cinematic .mx-canvas{position:absolute;inset:0;z-index:1;}
#meraki-cinematic .mx-canvas canvas{display:block;width:100%!important;height:100%!important;}
#meraki-cinematic::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,#0a0a23 0%,rgba(10,10,35,0.94) 30%,rgba(10,10,35,0.55) 52%,rgba(10,10,35,0) 72%);}
#meraki-cinematic::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(120% 120% at 18% 50%,rgba(10,10,35,0) 38%,rgba(10,10,35,0.35) 100%);}
.mx-overlay{position:relative;z-index:3;display:grid;place-items:center start;width:100%;max-width:1180px;margin:0 auto;min-height:100vh;padding:0 24px;text-align:left;color:#fff;font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;}
.mx-scene{grid-area:1/1;width:min(560px,92vw);}
.mx-badge{display:inline-flex;align-items:center;gap:9px;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.2);color:rgba(255,255,255,0.9);padding:8px 16px;border-radius:999px;font-size:0.85rem;font-weight:600;margin-bottom:22px;backdrop-filter:blur(8px);}
.mx-badge i{width:8px;height:8px;border-radius:50%;background:#6df0a8;box-shadow:0 0 10px #6df0a8;}
.mx-h{font-size:clamp(2.1rem,5vw,3.6rem);font-weight:800;line-height:1.08;letter-spacing:-0.02em;margin:0 0 20px;color:#fff;}
.mx-h span{color:#1ba9d1;}
.mx-sub{font-size:clamp(1rem,1.4vw,1.18rem);color:rgba(255,255,255,0.86);max-width:520px;margin:0 0 30px;line-height:1.6;}
.mx-cta{display:flex;gap:14px;justify-content:flex-start;flex-wrap:wrap;}
.mx-btn{display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:1rem;padding:15px 32px;border-radius:999px;text-decoration:none;transition:transform .3s ease,box-shadow .3s ease,background .3s ease;border:1px solid transparent;}
.mx-btn-primary{background-image:linear-gradient(120deg,#3b5bff 0%,#a855f7 100%);color:#fff;box-shadow:0 10px 26px rgba(124,58,237,0.45);}
.mx-btn-primary:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(124,58,237,0.6);}
.mx-btn-ghost{background:rgba(255,255,255,0.08);color:#fff;border-color:rgba(255,255,255,0.28);backdrop-filter:blur(8px);}
.mx-btn-ghost:hover{background:rgba(255,255,255,0.18);transform:translateY(-3px);}
.mx-scroll-hint{position:absolute;bottom:26px;left:24px;z-index:3;color:rgba(255,255,255,0.6);font-size:0.8rem;letter-spacing:0.14em;text-transform:uppercase;display:flex;align-items:center;gap:10px;}
.mx-scroll-hint span{width:22px;height:34px;border:2px solid rgba(255,255,255,0.4);border-radius:12px;position:relative;}
.mx-scroll-hint span::before{content:"";position:absolute;top:6px;left:50%;width:3px;height:6px;margin-left:-1.5px;background:rgba(255,255,255,0.7);border-radius:2px;animation:mxWheel 1.6s ease-in-out infinite;}
@keyframes mxWheel{0%{opacity:0;transform:translateY(0);}40%{opacity:1;}100%{opacity:0;transform:translateY(10px);}}
#meraki-cinematic.mx-static .mx-scene2,#meraki-cinematic.mx-static .mx-scroll-hint{display:none;}
#meraki-cinematic.mx-static .mx-scene1{position:relative;}
@media(max-width:880px){#meraki-cinematic::before{background:linear-gradient(180deg,rgba(10,10,35,0.82) 0%,rgba(10,10,35,0.66) 60%,rgba(10,10,35,0.5) 100%);}.mx-scene{width:min(620px,92vw);}}
@media(max-width:640px){.mx-scroll-hint{display:none;}.mx-h{font-size:clamp(1.9rem,8vw,2.6rem);}}
@media(prefers-reduced-motion:reduce){.mx-scroll-hint span::before{animation:none;}}