/* ==========================================================================
   Login y acceso · estilo nutrición, elegante y cálido
   ========================================================================== */
body.login-page{background:#fbfaff;min-height:100vh}
.login-shell{display:grid;grid-template-columns:1.1fr 1fr;min-height:100vh}

/* Lado ilustrado */
.login-art{position:relative;overflow:hidden;color:#fff;padding:40px 52px;display:flex;flex-direction:column;
  background:
    radial-gradient(circle at 18% 22%,rgba(255,255,255,.14) 0,transparent 32%),
    radial-gradient(circle at 85% 80%,rgba(240,150,200,.35) 0,transparent 40%),
    linear-gradient(155deg,#7b68e6 0%,#5f4cc9 45%,#8a57c4 100%)}
.login-art::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:rgba(255,255,255,.06);right:-170px;top:-170px}
.login-art::after{content:"";position:absolute;width:300px;height:300px;border-radius:50%;background:rgba(255,255,255,.05);left:-110px;bottom:-90px}
.la-brand{display:flex;align-items:center;gap:12px;position:relative;z-index:2}
.la-brand b{display:block;font-size:1.1rem}
.la-brand small{display:block;font-size:.76rem;opacity:.8}
.la-logo{width:44px;height:44px;border-radius:14px;background:rgba(255,255,255,.18);display:grid;place-items:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);color:#fff;flex-shrink:0}

.la-scene{position:relative;flex:1;display:grid;place-items:center;min-height:340px;z-index:1}
.la-bowl{width:min(430px,88%);height:auto;animation:float 7s ease-in-out infinite}
.la-card{position:absolute;display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.95);color:#2a2450;border-radius:16px;padding:10px 14px;box-shadow:0 18px 40px rgba(30,15,90,.25);font-size:.8rem;line-height:1.25}
.la-card b{display:block;font-size:.84rem}
.la-card small{color:#8a87a6}
.la-card svg{color:#d9589f}
.la-card .dot{width:10px;height:10px;border-radius:50%}
.la-card .dot.g{background:#2fb57a;box-shadow:0 0 0 4px #e1f4e4}
.la-card.c1{left:4%;top:16%;animation:float 6s ease-in-out infinite .5s}
.la-card.c2{right:2%;top:42%;animation:float 6.5s ease-in-out infinite 1s}
.la-card.c3{left:10%;bottom:6%;animation:float 7s ease-in-out infinite 1.5s}
.la-card.c2 svg{color:#6b59d9}
.la-fruit{position:absolute;font-size:30px;filter:drop-shadow(0 8px 12px rgba(0,0,0,.18));animation:float 8s ease-in-out infinite}
.la-fruit.f1{right:14%;top:8%}
.la-fruit.f2{left:22%;top:4%;font-size:24px;animation-delay:1s}
.la-fruit.f3{right:8%;bottom:10%;font-size:34px;animation-delay:2s}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

.la-copy{position:relative;z-index:2;max-width:480px}
.la-copy h2{font-family:'Playfair Display',Georgia,serif;color:#fff;font-size:2.5rem;line-height:1.1;letter-spacing:0}
.la-copy p{opacity:.88;margin-top:12px;font-size:1rem;line-height:1.6}

/* Formulario */
.login-form{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:40px 24px 24px;position:relative;
  background:radial-gradient(circle at 100% 0,#f6e8f3 0,transparent 35%),radial-gradient(circle at 0 100%,#ece8fb 0,transparent 40%),#fbfaff}
.lf-box{width:100%;max-width:410px;background:#fff;border-radius:28px;padding:38px 36px;box-shadow:0 30px 70px rgba(60,40,140,.10),0 2px 6px rgba(60,40,140,.04)}
.lf-box h1{font-family:'Playfair Display',Georgia,serif;font-size:2.05rem;letter-spacing:0;line-height:1.15}
.lf-box h1 em{color:var(--primary);font-style:italic}
.lf-sub{color:var(--muted);margin:6px 0 24px}
.lf-field{position:relative}
.lf-field > svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none}
.lf-field .input{padding-left:42px;height:48px;border-radius:14px;background:#fbfaff}
.lf-field .input:focus{background:#fff}
.lf-eye{position:absolute;right:10px;top:50%;transform:translateY(-50%);border:0;background:none;color:var(--muted);cursor:pointer;padding:6px;border-radius:8px}
.lf-eye:hover{color:var(--primary);background:var(--primary-50)}
.lf-btn{height:50px;border-radius:14px;justify-content:center;font-size:.98rem;background:linear-gradient(90deg,#6b59d9,#8a57c4);box-shadow:0 12px 26px rgba(107,89,217,.35)}
.lf-btn:hover{background:linear-gradient(90deg,#5b4bc4,#7b48b5)}
.lf-divider{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.78rem;margin:22px 0 14px}
.lf-divider::before,.lf-divider::after{content:"";flex:1;height:1px;background:var(--border)}
.la-copy h2 em{font-style:italic;color:#f8d3ea}
.lf-divider svg{color:var(--primary)}
.lf-motto{text-align:center;font-family:'Playfair Display',Georgia,serif;font-size:1.08rem;color:var(--text-2);margin:0}
.lf-motto em{color:var(--primary);font-style:italic}
.lf-trust{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;color:var(--muted);font-size:.76rem}
.lf-trust span{display:inline-flex;align-items:center;gap:5px}
.lf-trust svg{color:var(--green)}
.lf-foot{margin-top:22px;color:var(--muted);font-size:.76rem}
.lf-mobile-brand{display:none;align-items:center;gap:10px;margin-bottom:22px;color:var(--text)}
.lf-mobile-brand .la-logo{background:var(--primary);width:38px;height:38px;border-radius:12px}

@media (max-width:980px){
  .login-shell{grid-template-columns:1fr}
  .login-art{display:none}
  .lf-mobile-brand{display:flex}
  .lf-box{padding:30px 24px}
}
@media (prefers-reduced-motion:reduce){.la-bowl,.la-card,.la-fruit{animation:none}}
.lf-register{width:100%;justify-content:center;margin-top:14px}
.lf-invited{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:14px;margin:0 0 16px;background:color-mix(in srgb,var(--c) 10%,#fff);border:1px solid color-mix(in srgb,var(--c) 30%,#fff);font-size:.9rem}