/* Avora IA · login v3 (2026-10-12). Base clara, esmeralda/teal + acento coral. Sin dependencias. */
:root{--em:#10B981;--te:#0EA5A4;--te2:#0F766E;--co:#F97316;--co2:#EA580C;--ink:#0F172A;--sl:#334155;--mu:#64748B;--ln:#E2E8F0;--bg:#F6FBF9}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:"Nunito","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg)}
body.av3-login{min-height:100vh;min-height:100dvh;overflow-x:hidden}
/* fondo con degradado en movimiento */
.av3-bg{position:fixed;inset:0;z-index:0;overflow:hidden;background:linear-gradient(120deg,#ECFDF5 0%,#F0FDFA 35%,#FFF7ED 70%,#ECFEFF 100%);background-size:300% 300%;animation:av3g 18s ease-in-out infinite}
.av3-bg i{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55;animation:av3f 16s ease-in-out infinite}
.av3-bg .b1{width:520px;height:520px;left:-120px;top:-140px;background:#A7F3D0}
.av3-bg .b2{width:420px;height:420px;right:-120px;top:20%;background:#99F6E4;animation-delay:-5s}
.av3-bg .b3{width:380px;height:380px;left:35%;bottom:-180px;background:#FED7AA;opacity:.45;animation-delay:-9s}
@keyframes av3g{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes av3f{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(40px,30px) scale(1.08)}}
.av3{position:relative;z-index:1;display:grid;grid-template-columns:1.15fr .85fr;min-height:100vh;min-height:100dvh}
/* héroe */
.av3-hero{position:relative;padding:44px 56px 0;display:flex;flex-direction:column;overflow:hidden}
.av3-hero-top{display:flex;align-items:center;gap:12px}
.av3-hero-logo{width:46px;height:46px;border-radius:14px;box-shadow:0 10px 24px -12px rgba(14,165,164,.6)}
.av3-hero-name{font-size:22px;font-weight:800;letter-spacing:-.02em;color:var(--te2)}
.av3-hero-name b{font-size:12px;vertical-align:middle;margin-left:4px;padding:3px 8px;border-radius:999px;background:#FFEDD5;color:var(--co2);letter-spacing:.08em}
.av3-claim{max-width:560px;margin:44px 0 18px;font-size:clamp(28px,3.2vw,44px);line-height:1.12;font-weight:800;letter-spacing:-.03em;color:var(--ink)}
.av3-claim span{background:linear-gradient(90deg,var(--te),var(--em),var(--co));background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:av3t 6s ease-in-out infinite}
@keyframes av3t{0%,100%{background-position:0 0}50%{background-position:100% 0}}
.av3-points{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;color:var(--sl);font-size:15px;font-weight:600}
.av3-points li{display:flex;align-items:center;gap:10px;opacity:0;transform:translateY(8px);animation:av3in .6s ease forwards}
.av3-points li:nth-child(2){animation-delay:.15s}.av3-points li:nth-child(3){animation-delay:.3s}
.av3-points i{width:22px;height:22px;border-radius:8px;background:linear-gradient(135deg,var(--em),var(--te));position:relative;flex:0 0 22px}
.av3-points i:after{content:"";position:absolute;left:7px;top:4px;width:6px;height:10px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
@keyframes av3in{to{opacity:1;transform:none}}
.av3-city{position:relative;margin-top:auto;height:min(46vh,360px)}
.av3-sky{position:absolute;left:0;right:0;bottom:0;width:100%;height:100%}
.av3-sky .sun{animation:av3sun 9s ease-in-out infinite;transform-origin:470px 70px}
@keyframes av3sun{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}
.av3-sky .cloud{animation:av3cl 24s linear infinite;opacity:.95}
.av3-sky .c2{animation-duration:32s;animation-delay:-12s}
@keyframes av3cl{from{transform:translateX(-160px)}to{transform:translateX(620px)}}
.av3-sky .far,.av3-sky .mid,.av3-sky .house,.av3-sky .tree{transform-box:fill-box;transform-origin:bottom;animation:av3up .9s cubic-bezier(.2,.8,.2,1) both}
.av3-sky .mid{animation-delay:.12s}.av3-sky .h1{animation-delay:.3s}.av3-sky .h2{animation-delay:.42s}.av3-sky .tree{animation-delay:.5s}
@keyframes av3up{from{transform:scaleY(.2);opacity:0}to{transform:none;opacity:1}}
.av3-sky .win rect{animation:av3w 3.6s ease-in-out infinite}
.av3-sky .win .w2{animation-delay:-1.2s;fill:#FFEDD5}.av3-sky .win .w3{animation-delay:-2.4s}
@keyframes av3w{0%,100%{opacity:.95}50%{opacity:.45}}
.av3-sky .tree circle{transform-box:fill-box;transform-origin:center bottom;animation:av3tr 4s ease-in-out infinite}
@keyframes av3tr{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}
/* tarjetas flotantes */
.av3-fc{position:absolute;display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:16px;background:rgba(255,255,255,.92);border:1px solid #D1FAE5;box-shadow:0 18px 40px -22px rgba(15,118,110,.55);backdrop-filter:blur(6px);font-size:13px;animation:av3fl 6s ease-in-out infinite}
.av3-fc b{display:block;color:var(--ink);font-weight:800}.av3-fc small{color:var(--mu);font-weight:600}
.av3-fc .ic{width:34px;height:34px;border-radius:11px;flex:0 0 34px;background:#ECFDF5 center/18px no-repeat}
.av3-fc .home{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230EA5A4' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-7 9 7v9a1 1 0 0 1-1 1h-5v-6h-6v6H4a1 1 0 0 1-1-1z'/%3E%3C/svg%3E")}
.av3-fc .cal{background-color:#FFF7ED;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F97316' stroke-width='2.4' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='3'/%3E%3Cpath d='M8 3v4M16 3v4M3 10h18'/%3E%3C/svg%3E")}
.av3-fc .key{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2310B981' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='8' cy='15' r='4'/%3E%3Cpath d='M11 12l9-9M17 6l3 3'/%3E%3C/svg%3E")}
.av3-fc .sc{font-style:normal;font-weight:800;font-size:12px;color:#fff;background:linear-gradient(135deg,var(--co),#FB923C);padding:4px 8px;border-radius:999px}
.fc1{left:6%;top:4%}.fc2{right:8%;top:22%;animation-delay:-2s}.fc3{left:30%;top:34%;animation-delay:-4s}
@keyframes av3fl{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
/* panel de acceso */
.av3-panel{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:32px 28px 20px}
.av3-card{width:100%;max-width:420px;background:rgba(255,255,255,.94);border:1px solid #E6F4EF;border-radius:28px;padding:34px 32px 24px;box-shadow:0 30px 70px -40px rgba(15,118,110,.55),0 2px 6px rgba(15,23,42,.04);animation:av3in .6s ease both}
.av3-brand{text-align:center;margin-bottom:22px}
.av3-logo{width:76px;height:76px;border-radius:22px;box-shadow:0 16px 34px -18px rgba(14,165,164,.75);animation:av3lg 5s ease-in-out infinite}
@keyframes av3lg{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.av3-wm{margin:12px 0 2px;font-size:30px;font-weight:900;letter-spacing:-.03em;background:linear-gradient(90deg,var(--te2),var(--em));-webkit-background-clip:text;background-clip:text;color:transparent}
.av3-wm span{margin-left:6px;font-size:13px;vertical-align:middle;padding:3px 8px;border-radius:999px;background:#FFEDD5;color:var(--co2);-webkit-text-fill-color:var(--co2);letter-spacing:.08em}
.av3-brand p{margin:0;color:var(--mu);font-weight:600;font-size:14px}
#tabAsesores,#tabSupervisores{position:absolute;opacity:0;pointer-events:none}
.av3-tabs{position:relative;display:grid;grid-template-columns:1fr 1fr;background:#F1F5F9;border-radius:14px;padding:4px;margin-bottom:18px}
.av3-tabs .tab{position:relative;z-index:1;text-align:center;padding:10px 0;font-weight:800;font-size:14px;color:var(--mu);cursor:pointer;transition:color .2s;user-select:none}
.av3-tab-pill{position:absolute;z-index:0;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:11px;background:#fff;box-shadow:0 6px 14px -8px rgba(15,23,42,.35);transition:transform .35s cubic-bezier(.3,.9,.3,1)}
#tabAsesores:checked ~ .av3-tabs .tab-asesores,#tabSupervisores:checked ~ .av3-tabs .tab-supervisores{color:var(--te2)}
#tabSupervisores:checked ~ .av3-tabs .av3-tab-pill{transform:translateX(100%)}
#formSupervisores{display:none}
#tabSupervisores:checked ~ .forms-wrap #formAsesores{display:none}
#tabSupervisores:checked ~ .forms-wrap #formSupervisores{display:block;animation:av3in .35s ease both}
#tabAsesores:checked ~ .forms-wrap #formAsesores{animation:av3in .35s ease both}
.forms-wrap form{display:flex;flex-direction:column;gap:12px}
.forms-wrap input[type=text],.forms-wrap input[type=password]{width:100%;height:50px;border:1.5px solid var(--ln);border-radius:14px;padding:0 16px 0 46px;font-family:inherit;font-weight:600;font-size:15px;color:var(--ink);background:#F8FAFC no-repeat 16px center/18px;transition:border-color .2s,box-shadow .2s,background-color .2s}
.forms-wrap input.UsuarioCampo,.forms-wrap input.UsuarioCampo2{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3C/svg%3E")}
.forms-wrap input.ContrasenaCampo,.forms-wrap input.ContrasenaCampo2,.forms-wrap input.CodigoCampo{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2.2' stroke-linecap='round'%3E%3Crect x='4' y='10' width='16' height='11' rx='3'/%3E%3Cpath d='M8 10V7a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E")}
.forms-wrap input:focus{outline:0;border-color:var(--te);background-color:#fff;box-shadow:0 0 0 4px rgba(14,165,164,.14)}
.forms-wrap button{height:50px;border:0;border-radius:14px;font-family:inherit;font-weight:800;font-size:15px;color:#fff;cursor:pointer;background:linear-gradient(135deg,var(--co),#FB923C);box-shadow:0 14px 26px -14px rgba(249,115,22,.85);transition:transform .15s,box-shadow .2s,filter .2s}
.forms-wrap button:hover{transform:translateY(-1px);filter:saturate(1.1);box-shadow:0 18px 30px -14px rgba(249,115,22,.9)}
.forms-wrap button:active{transform:translateY(0)}
#botonesIngreso button,#formAsesores button[onclick^="start"]{background:#fff;color:var(--te2);border:1.5px solid #99F6E4;box-shadow:none;height:44px;font-size:13px}
#botonesIngreso{display:flex;flex-direction:column;gap:8px}
.forms-wrap .hidden{display:none!important}
.forms-wrap video{display:none;width:100%;border-radius:14px}
.alert{padding:12px 14px;border-radius:12px;background:#FEF2F2;color:#B91C1C;border:1px solid #FECACA;font-size:13px;font-weight:600}
.av3-secure{display:flex;align-items:center;justify-content:center;gap:8px;margin:18px 0 0;color:var(--mu);font-size:12px;font-weight:600}
.av3-secure span{width:8px;height:8px;border-radius:50%;background:var(--em);box-shadow:0 0 0 0 rgba(16,185,129,.6);animation:av3p 2s infinite}
@keyframes av3p{70%{box-shadow:0 0 0 8px rgba(16,185,129,0)}100%{box-shadow:0 0 0 0 rgba(16,185,129,0)}}
.av3-foot{width:100%;max-width:420px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:18px;color:var(--mu);font-size:12px;font-weight:600}
.av3-foot span{display:inline-flex;align-items:center;gap:6px}.av3-foot img{width:18px;height:18px;border-radius:6px}
body.av-sup .av3-logo{box-shadow:0 16px 34px -18px rgba(249,115,22,.7)}
/* responsive */
@media (max-width:1100px){.av3{grid-template-columns:1fr 1fr}.av3-hero{padding:36px 32px 0}.fc3{display:none}}
@media (max-width:860px){
  .av3{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  .av3-hero{padding:18px 18px 0;min-height:0}
  .av3-hero-top,.av3-claim,.av3-points{display:none}
  .av3-city{height:150px;margin-top:0}
  .av3-fc{font-size:11px;padding:7px 10px;border-radius:12px}.av3-fc .ic{width:26px;height:26px;flex-basis:26px;background-size:14px}
  .fc1{left:2%;top:0}.fc2{right:2%;top:34%}
  .av3-panel{justify-content:flex-start;padding:0 14px 16px;margin-top:-26px}
  .av3-card{padding:24px 20px 18px;border-radius:24px}
  .av3-logo{width:62px;height:62px;border-radius:18px}.av3-wm{font-size:26px}
  .av3-foot{justify-content:center;text-align:center}
}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.av3-points li{opacity:1;transform:none}}
