/* Shared white intro for both homepage designs. */
.mex-redesign #loader.mex-splash:not([hidden]) { background:#fff !important; color:#080e16; }
.mex-redesign .mex-splash-grid { background-image:linear-gradient(#080e1605 1px,transparent 1px),linear-gradient(90deg,#080e1605 1px,transparent 1px); opacity:.6; }
.mex-redesign .mex-splash-top,.mex-redesign .mex-splash-bottom { color:#52606f; }
.mex-redesign .mex-splash-top { border-color:#080e1618; }
.mex-redesign .mex-splash-kicker { color:#52606f; }
.mex-redesign .mex-splash-logo { width:min(600px,78vw); margin-bottom:40px; animation:mex-logo-arrive 1.5s cubic-bezier(.16,1,.3,1) both; }
.mex-redesign .mex-splash-center h2 { color:#080e16; font-size:clamp(32px,4.5vw,62px); }
.mex-redesign .mex-splash-center h2 em { color:#080e16; }
.mex-redesign .mex-splash-center p { color:#52606f; }
.mex-redesign .mex-splash-line { background:#080e1618; height:2px; }
.mex-redesign .mex-splash-line span { background:#080e16; }
.mex-redesign .mex-splash-bottom button { background:#080e16; border-color:#080e16; color:#fff; }
.mex-redesign .mex-splash-bottom button:hover { background:#1b2a3b; }
.mex-redesign .mex-splash-bottom button:focus-visible { outline:2px solid #080e16; outline-offset:4px; }
.mex-redesign .mex-splash-orbit>span { border-color:#080e160b; }
.mex-redesign .mex-splash-orbit>span:first-child:after { background:#080e16; box-shadow:0 0 25px #080e1618; }
@keyframes mex-logo-arrive { 0% { opacity:0; transform:translateY(18px) scale(.94); clip-path:inset(0 100% 0 0); } 65% { opacity:1; clip-path:inset(0); } 100% { opacity:1; transform:translateY(0) scale(1); clip-path:inset(0); } }
@media(max-width:767px) { .mex-redesign .mex-splash-logo { margin-bottom:32px; } }
@media(max-height:500px) { .mex-redesign .mex-splash-logo { width:min(360px,60vw); margin-bottom:20px; } }
@media(prefers-reduced-motion:reduce) { .mex-redesign .mex-splash-logo { animation:none; } }
.mex-redesign .mex-splash-center { padding:16px 0; }
.mex-redesign .mex-splash-logo { width:min(470px,72vw); margin-bottom:22px; }
.mex-redesign .mex-splash-kicker { margin-bottom:20px; }
.mex-redesign .mex-splash-center h2 { font-size:clamp(32px,4vw,54px); }
.mex-splash-connect { position:relative; display:block; width:min(440px,82vw); aspect-ratio:440/272; margin:12px auto 0; padding:0; border:0; background:transparent; color:#080e16; cursor:pointer; border-radius:18px; }
.mex-splash-connect:focus-visible { outline:2px solid #087db4; outline-offset:5px; }
.mex-splash-hub { position:absolute; width:39%; height:auto; left:54%; top:0; z-index:2; filter:drop-shadow(0 12px 10px #080e1620); transition:transform .3s; }
.mex-splash-connect:hover .mex-splash-hub { transform:translateY(-3px); }
.mex-splash-hub-shadow { position:absolute; top:57%; left:55%; width:38%; height:5%; background:#080e1618; filter:blur(8px); border-radius:50%; }
.mex-splash-cable { position:absolute; top:0; left:0; width:100%; height:auto; overflow:visible; }
.mex-cable-shadow { stroke:#080e1614; stroke-width:12px; transform:translateY(4px); }
.mex-cable-wire { stroke:#101d2c; stroke-width:7px; stroke-linecap:round; }
.mex-cable-energy { stroke:#38b9ff; stroke-width:3px; stroke-linecap:round; stroke-dasharray:8 92; opacity:0; filter:drop-shadow(0 0 4px #008ed9); }
.mex-cable-glow,.mex-cable-spark { opacity:0; }
.mex-cable-plug { transform:translateY(23px); }
.is-link-animating .mex-cable-plug { animation:mex-plug-connect 1.4s .3s both; }
.is-link-animating .mex-cable-energy { animation:mex-ethernet-pulse 1.35s 1s 2 both; }
.is-link-animating .mex-cable-glow { animation:mex-connect-glow 1.5s 1.5s both; }
.is-link-animating .mex-cable-spark { animation:mex-connect-spark .8s 1.6s both; }
.mex-splash-link-state { position:absolute; bottom:7%; left:0; display:flex; align-items:center; gap:8px; font:500 12px/1.4 Arial,sans-serif; }
.mex-splash-link-state>span:first-child { width:7px; height:7px; background:#9ba8b4; border-radius:50%; }
.is-link-connected .mex-splash-link-state>span:first-child { background:#087db4; box-shadow:0 0 0 4px #087db412; }
.mex-splash-replay { position:absolute; bottom:0; left:0; font:400 10px/1.4 Arial,sans-serif; color:#647180; }
.mex-redesign .mex-splash-center p { margin-top:10px; }
@keyframes mex-plug-connect { to { transform:translateY(0); } }
@keyframes mex-ethernet-pulse { 0% { stroke-dashoffset:20; opacity:0; } 15% { opacity:1; } 90% { opacity:1; } 100% { stroke-dashoffset:-100; opacity:0; } }
@keyframes mex-connect-glow { 0%,100% { opacity:0; } 35% { opacity:.6; filter:drop-shadow(0 0 12px #00aaff); } }
@keyframes mex-connect-spark { 0%,100% { opacity:0; } 30% { opacity:1; } }
@media(max-height:740px) { .mex-redesign #loader.mex-splash:not([hidden]) { padding:20px 5vw; }.mex-redesign .mex-splash-kicker { display:none; }.mex-redesign .mex-splash-logo { width:min(360px,65vw); margin-bottom:15px; }.mex-splash-connect { width:min(340px,75vw); }.mex-redesign .mex-splash-center h2 { font-size:36px; } }
@media(max-height:520px) { .mex-redesign .mex-splash-center { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:10px 30px; }.mex-redesign .mex-splash-logo { grid-column:1; margin:0; width:min(300px,38vw); }.mex-redesign .mex-splash-center h2 { grid-column:1; font-size:30px; }.mex-splash-connect { grid-column:2; grid-row:1/3; width:min(270px,38vw); margin:0; }.mex-redesign .mex-splash-center p { display:none; } }
@media(prefers-reduced-motion:reduce) { .mex-splash-connect * { animation:none!important; transition:none!important; }.mex-cable-plug { transform:none; } }
