/* Entrada do Wqualis: cópia fiel de mockup/v4/entrada.html (aprovada em 28/10/2026). */
/* Entrada do Wqualis · estudo v4 (28/10/2026): cópia do desenho da entrada da equipe da
   W Store (W_STORE/site, rota #entrar), com o logo e os tokens do Wqualis. */
:root{
  --ent-fundo:radial-gradient(120% 80% at 50% 0%,#FFFFFF 0%,#F7F7F7 55%,#E4F0FA 100%);
  --ent-luz-1:rgba(51,204,255,.42);
  --ent-luz-2:rgba(5,58,153,.16);
  --ent-cartao:rgba(255,255,255,.72);
  --ent-cartao-borda:rgba(203,213,228,.9);
  --ent-sombra:0 40px 80px -40px rgba(20,27,58,.38);
  --ent-bt-bg:#1E2A57;
  --ent-bt-txt:#FFFFFF;
  --ent-bt-hover:#26346A;
  --ent-pe:#56627A;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ent-fundo:radial-gradient(120% 80% at 50% 0%,#1E2A57 0%,#141B3A 55%,#0B1230 100%);
    --ent-luz-1:rgba(51,204,255,.30);
    --ent-luz-2:rgba(5,160,221,.18);
    --ent-cartao:rgba(30,42,87,.62);
    --ent-cartao-borda:rgba(255,255,255,.14);
    --ent-sombra:0 40px 80px -40px rgba(0,0,0,.7);
    --ent-bt-bg:#33CCFF;
    --ent-bt-txt:#1E2A57;
    --ent-bt-hover:#EEFBFF;
    --ent-pe:#EEFBFF;
  }
}
:root[data-theme="dark"]{
  --ent-fundo:radial-gradient(120% 80% at 50% 0%,#1E2A57 0%,#141B3A 55%,#0B1230 100%);
  --ent-luz-1:rgba(51,204,255,.30);
  --ent-luz-2:rgba(5,160,221,.18);
  --ent-cartao:rgba(30,42,87,.62);
  --ent-cartao-borda:rgba(255,255,255,.14);
  --ent-sombra:0 40px 80px -40px rgba(0,0,0,.7);
  --ent-bt-bg:#33CCFF;
  --ent-bt-txt:#1E2A57;
  --ent-bt-hover:#EEFBFF;
  --ent-pe:#EEFBFF;
}

body{margin:0;background:var(--ground)}
.entrada{
  position:relative;min-height:100vh;min-height:100dvh;overflow:hidden;
  display:grid;place-items:center;
  padding-block:48px;
  padding-left:max(16px,env(safe-area-inset-left,0px));
  padding-right:max(16px,env(safe-area-inset-right,0px));
  background:var(--ent-fundo);color:var(--titulo);
}
/* luz que segue o mouse; no celular passeia sozinha */
.luz{
  position:absolute;inset:-20%;pointer-events:none;filter:blur(40px);
  background:
    radial-gradient(34% 40% at var(--mx,62%) var(--my,36%), var(--ent-luz-1), transparent 70%),
    radial-gradient(30% 36% at calc(100% - var(--mx,62%)) calc(100% - var(--my,36%)), var(--ent-luz-2), transparent 70%);
}
.cartao{
  position:relative;z-index:1;width:min(440px,100%);
  display:flex;flex-direction:column;align-items:center;gap:28px;text-align:center;
  padding:44px 36px;border-radius:28px;
  background:var(--ent-cartao);border:1px solid var(--ent-cartao-borda);box-shadow:var(--ent-sombra);
  -webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);
}
/* nova assinatura: o ícone gira uma vez e dá o check; QUALIS em Arkitech; slogan */
@font-face{font-family:"Arkitech";src:url("fonts/arkitech-medium.ttf") format("truetype");font-weight:500;font-display:swap}
:root{--ent-arco-1:#053a99;--ent-arco-2:#05A0DD;--ent-grad:linear-gradient(92deg,#1E2A57 0%,#053a99 45%,#05A0DD 100%)}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){--ent-arco-1:#FFFFFF;--ent-arco-2:#EEFBFF;--ent-grad:linear-gradient(92deg,#FFFFFF 0%,#33CCFF 60%,#05A0DD 100%)} }
:root[data-theme="dark"]{--ent-arco-1:#FFFFFF;--ent-arco-2:#EEFBFF;--ent-grad:linear-gradient(92deg,#FFFFFF 0%,#33CCFF 60%,#05A0DD 100%)}
.assinatura{display:flex;flex-direction:column;align-items:center;gap:10px}
.ass__icone{display:block;width:96px;height:auto;overflow:visible;filter:drop-shadow(0 10px 22px rgba(5,58,153,.22));animation:sobe .6s var(--ease-out) both}
.ent-s1{stop-color:var(--ent-arco-1)} .ent-s2{stop-color:var(--ent-arco-2)}
.ent-arco,.ent-seta,.ent-check{fill:none;stroke-width:56;stroke-linecap:round;stroke-linejoin:round}
.ent-arco,.ent-seta{stroke:url(#ent-arco)}
.ent-giro{transform-box:view-box;transform-origin:600px 630px;animation:entGira 1.5s .15s cubic-bezier(.2,.75,.2,1) both}
.ent-arco{stroke-dasharray:1620;stroke-dashoffset:1620;animation:entTraco 1.5s .15s cubic-bezier(.2,.75,.2,1) forwards}
.ent-seta{opacity:0;animation:entAparece .25s 1.45s ease-out forwards}
.ent-check{stroke:var(--limao);stroke-dasharray:340;stroke-dashoffset:340;animation:entTraco .55s 1.6s cubic-bezier(.3,.7,.2,1) forwards}
.ass__qualis{margin:6px 0 0;font:500 52px/1 "Arkitech",var(--fonte);letter-spacing:.02em;background:var(--ent-grad);-webkit-background-clip:text;background-clip:text;color:transparent;animation:sobe .8s .35s var(--ease-out) both}
.ass__slogan{margin:0;font-size:16px;line-height:1.45;color:var(--ink-2);text-wrap:balance;animation:sobe .8s .5s var(--ease-out) both}
@keyframes entGira{from{transform:rotate(-300deg)}to{transform:rotate(0)}}
@keyframes entTraco{to{stroke-dashoffset:0}}
@keyframes entAparece{to{opacity:1}}
.ms{
  position:relative;overflow:hidden;
  display:flex;align-items:center;justify-content:center;gap:14px;
  width:100%;min-height:58px;border:0;border-radius:14px;cursor:pointer;
  background:var(--ent-bt-bg);color:var(--ent-bt-txt);font:600 16px var(--fonte);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 10px 24px -12px rgba(30,42,87,.7);
  animation:sobe .8s .7s var(--ease-out) both;
  transition:background-color .25s,transform .12s;
}
.ms::before{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.22),transparent);animation:reflexo 3.2s 2s ease-in-out infinite}
.ms:active{transform:scale(.98)}
@media (hover:hover) and (pointer:fine){ .ms:hover{background:var(--ent-bt-hover)} }
.ms:focus-visible{outline:3px solid var(--foco);outline-offset:3px}
.ms-logo{display:grid;grid-template-columns:repeat(2,10px);gap:2px}
.ms-logo i{width:10px;height:10px}
.pe{margin:0;font-size:13px;line-height:1.6;color:var(--ent-pe);animation:sobe .8s .9s var(--ease-out) both}
.pe a{color:var(--azul);font-weight:600}
.operacao{
  display:flex;align-items:center;justify-content:center;gap:8px;
  min-height:44px;padding:0 18px;border-radius:999px;
  border:1px solid var(--ent-cartao-borda);background:transparent;color:var(--titulo);
  font:600 14px var(--fonte);text-decoration:none;cursor:pointer;
  animation:sobe .8s 1s var(--ease-out) both;
}
@media (hover:hover) and (pointer:fine){ .operacao:hover{border-color:var(--azul-med)} }
.operacao:focus-visible{outline:3px solid var(--foco);outline-offset:3px}
.nota-estudo{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:2;font-size:12px;color:var(--ent-pe);white-space:nowrap}
@keyframes sobe{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes reflexo{0%{left:-60%}55%,100%{left:130%}}
@media (prefers-reduced-motion: reduce){ .ass__icone,.ass__qualis,.ass__slogan,.ent-giro,.ent-arco,.ent-seta,.ent-check,.ms,.pe,.operacao{animation:none;stroke-dashoffset:0;opacity:1;transform:none} .ms::before{display:none} }
@media (max-width:420px){ .cartao{padding:36px 22px;gap:24px} .ass__qualis{font-size:44px} }
.aviso-ent{margin:0;padding:10px 14px;border-radius:12px;background:var(--crit-bg);color:var(--crit-txt);font-size:14px;font-weight:600}
.ent-email{font-weight:700;color:var(--titulo);word-break:break-all}
a.ms{text-decoration:none}