/* Portal do webmail (webmail.ordane.com.br). Identidade do manual: preto, âmbar, ambiência, contraforma. */
@font-face{font-family:"Archivo";font-weight:100 900;font-display:swap;src:url(fontes/Archivo-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Archivo";font-weight:100 900;font-display:swap;src:url(fontes/Archivo-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C0,U+2C60-2C7F,U+A720-A7FF}
:root{--ambar:#F5A524;--ambar-claro:#FFD98A;--osso:#F5F3EF;--nevoa:#B8B4AE;--tinta:#111113;--preto:#000;--grafite:#1C1C1E;--grafite-alto:#2C2C2E;--filete:#3A3A3C;
  --erro:#FF8A80;--curva:cubic-bezier(.22,1,.36,1);color-scheme:dark}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--preto)}
body{margin:0;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;padding:32px 16px;
  background:var(--preto);color:var(--osso);font-family:"Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;font-size:16px;line-height:1.55;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
.ambiente{position:fixed;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,#2C2C2E 0%,#1C1C1E 55%,#000 100%)}
.padrao{position:absolute;inset:-10%;opacity:.05;background-size:120px 120px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 140'%3E%3Cpath fill='%23F5A524' d='M68 38 C70.7 28.8 75 20 91 20 A32 32 0 0 1 91 84 C75 84 70.7 75.2 68 66 A50 50 0 0 1 68 38 Z' transform='translate(-21 18)'/%3E%3C/svg%3E");
  animation:deriva 60s linear infinite}
.dagua{position:absolute;right:-18vmax;bottom:-22vmax;width:62vmax;height:62vmax;border-radius:50%;
  background:radial-gradient(circle at 50% 50%,transparent 0 44%,rgba(245,165,36,.07) 44.5% 69%,transparent 69.5%)}
@keyframes deriva{to{transform:translate(120px,120px)}}
.cartao{position:relative;z-index:1;width:100%;max-width:420px;padding:36px 32px 30px;border-radius:22px;background:rgba(28,28,30,.86);
  border:1px solid var(--filete);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);animation:surge .7s var(--curva) both}
@keyframes surge{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.marca{display:flex;align-items:center;gap:10px;margin:0 0 22px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:13px;color:var(--nevoa)}
.marca img{width:34px;height:34px}
h1{margin:0;font-size:34px;line-height:1.1;font-weight:700;letter-spacing:-.01em}
.sub{margin:8px 0 26px;color:var(--nevoa)}
label{display:block;font-size:14px;font-weight:600;margin-bottom:8px}
input[type=email]{width:100%;padding:14px 16px;border-radius:12px;border:1px solid var(--filete);background:var(--preto);color:var(--osso);font:inherit;font-size:16px;
  transition:border-color .2s var(--curva),box-shadow .2s var(--curva)}
input[type=email]::placeholder{color:#6E6A65}
input[type=email]:focus{outline:none;border-color:var(--ambar);box-shadow:0 0 0 3px rgba(245,165,36,.22)}
button,.botao{display:inline-flex;justify-content:center;align-items:center;width:100%;margin-top:18px;padding:14px 18px;border:0;border-radius:12px;cursor:pointer;
  background:var(--ambar);color:var(--tinta);font:inherit;font-weight:700;font-size:16px;text-decoration:none;transition:transform .2s var(--curva),background .2s}
button:hover,.botao:hover{background:var(--ambar-claro)}
button:active,.botao:active{transform:scale(.98)}
:focus-visible{outline:2px solid var(--ambar);outline-offset:3px}
.erro{margin:10px 0 0;color:var(--erro);font-size:14px}
.erro[hidden]{display:none}
.dica{margin:22px 0 0;color:var(--nevoa);font-size:14px}
.dica b{color:var(--osso)}
footer{position:relative;z-index:1;display:flex;align-items:center;gap:6px;color:var(--nevoa);font-size:13px}
footer b{color:var(--osso)}
.sem-js{position:relative;z-index:1;color:var(--nevoa)}
@media (prefers-reduced-motion:reduce){.padrao,.cartao{animation:none}}
@media (max-width:480px){.cartao{padding:28px 20px 24px}h1{font-size:28px}}
