/* Fondo de marca con movimiento decorativo ligero. */
body {min-height:100vh;min-height:100svh;height:auto;overflow-y:auto;display:flex;align-items:center;justify-content:center;background:#242b31;padding:24px 16px 88px;isolation:isolate;}
body::before {content:'';position:fixed;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(112deg,#ff941e 0%,#ed6c08 43%,#30373d 43.1%,#20272d 100%);}
.logistics-background {position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:-1;}
.silhouette {position:absolute;opacity:.22;height:auto;pointer-events:none;}
.plane-one {width:112px;left:-150px;top:13%;animation:fly-right 32s linear -8s infinite;}
.plane-two {width:86px;left:-150px;top:74%;opacity:.16;animation:fly-left 43s linear -20s infinite;}
.box-one {width:78px;left:13%;top:72%;animation:box-drift 12s ease-in-out -5s infinite alternate;}
.box-two {width:68px;right:12%;top:23%;opacity:.18;animation:box-drift 15s ease-in-out -11s infinite alternate;}
.box-three {width:46px;left:32%;top:8%;opacity:.16;animation:box-drift 17s ease-in-out -8s infinite alternate;}
@keyframes fly-right {from{transform:translateX(0) rotate(45deg);}to{transform:translateX(calc(100vw + 300px)) rotate(45deg);}}
@keyframes fly-left {from{transform:translateX(calc(100vw + 300px)) rotate(-135deg);}to{transform:translateX(0) rotate(-135deg);}}
@keyframes box-drift {from{transform:translateY(14px) rotate(-6deg);}to{transform:translateY(-18px) rotate(6deg);}}
.login-left {display:none;}
.login-right {display:contents;}
.social-icons {position:fixed;bottom:24px;}
.login-card-container {position:relative;top:auto;left:auto;transform:none;width:min(100%,390px);}
.login-card {width:100%;box-shadow:0 16px 50px rgba(0,0,0,.3);}
body:has(#register-view[style*="block"]) {padding:24px 0;background:#242b31;}
.login-card-container:has(#register-view[style*="block"]) {margin:0 auto;}
@media(max-width:600px) {
 .login-card {padding:28px 24px;}
 .form-control {font-size:16px;}
 .plane-one {width:76px;top:7%;animation-duration:28s;}
 .plane-two {width:64px;top:85%;animation-duration:35s;}
 .box-one {width:56px;left:6%;top:78%;}
 .box-two {width:42px;right:8%;top:16%;}
 .box-three {display:none;}
}
@media(prefers-reduced-motion:reduce) {
 .silhouette {animation:none!important;}
 .plane-one {left:6%;transform:rotate(45deg);}
 .plane-two {left:auto;right:8%;transform:rotate(-135deg);}
}

/* Cinco rutas independientes: horizontales y diagonales. */
.plane-three {width:78px;left:-150px;top:0;opacity:.17;animation:fly-diagonal-up 39s linear -17s infinite;}
.plane-four {width:96px;left:-150px;top:0;opacity:.19;animation:fly-diagonal-down 47s linear -9s infinite;}
.plane-five {width:66px;left:-150px;top:0;opacity:.15;animation:fly-diagonal-return 36s linear -27s infinite;}
@keyframes fly-diagonal-up {from{transform:translate(0,88vh) rotate(20deg);}to{transform:translate(calc(100vw + 300px),6vh) rotate(20deg);}}
@keyframes fly-diagonal-down {from{transform:translate(0,4vh) rotate(70deg);}to{transform:translate(calc(100vw + 300px),86vh) rotate(70deg);}}
@keyframes fly-diagonal-return {from{transform:translate(calc(100vw + 300px),78vh) rotate(-110deg);}to{transform:translate(0,12vh) rotate(-110deg);}}
@media(max-width:600px) {
 .plane-three {width:54px;animation-duration:34s;}
 .plane-four {width:62px;animation-duration:41s;}
 .plane-five {width:48px;animation-duration:38s;}
}
@media(prefers-reduced-motion:reduce) {
 .plane-three {left:4%;top:43%;transform:rotate(20deg);}
 .plane-four {left:auto;right:5%;top:48%;transform:rotate(70deg);}
 .plane-five {left:25%;top:89%;transform:rotate(-110deg);}
}

/* Vuelos más rápidos; las cajas conservan su flotación suave. */
.plane-one {animation-duration:14s;}
.plane-two {animation-duration:18s;}
.plane-three {animation-duration:16s;}
.plane-four {animation-duration:20s;}
.plane-five {animation-duration:15s;}