body{font-family:"DM Sans",sans-serif}.login-wrap,.reg-wrap{position:relative;overflow:hidden;background:radial-gradient(circle at 18% 18%,rgba(75,105,158,.42),transparent 32%),radial-gradient(circle at 82% 82%,rgba(240,90,40,.18),transparent 28%),#172645}.login-wrap:before{content:"";position:absolute;z-index:1;left:clamp(28px,6vw,100px);top:50%;width:min(43vw,590px);aspect-ratio:1672/941;transform:translateY(-50%);background:url('/assets/logos/Logoazulbranco.png') center/contain no-repeat}.login-wrap:after{display:none}.reg-wrap:before{content:"Tecnovia Academy";position:absolute;z-index:1;left:clamp(28px,8vw,130px);top:50%;transform:translateY(-50%);font:800 clamp(34px,4vw,62px)/1 Manrope,sans-serif;color:#fff;max-width:430px;letter-spacing:-2px}.reg-wrap:after{content:"Aprender. Evoluir. Construir.";position:absolute;z-index:1;left:clamp(28px,8vw,130px);top:calc(50% + 78px);font-size:15px;color:#b9c4d7;letter-spacing:.4px}.login-card,.reg-card{position:relative;z-index:2;margin-left:min(42vw,560px);border:1px solid rgba(255,255,255,.25);border-radius:18px!important;box-shadow:0 24px 70px rgba(0,0,0,.28)!important}.marca .nome{font-family:Manrope,sans-serif;letter-spacing:-.5px}.login-card .btn,.reg-card .btn{min-height:44px;border-radius:10px}.login-card input,.reg-card input,.reg-card select{border-radius:10px;min-height:43px}
html[lang="en"] .reg-wrap:after{content:"Learn. Grow. Build."}html[lang="fr"] .reg-wrap:after{content:"Apprendre. Évoluer. Construire."}
@media(max-width:900px){.login-wrap:before,.login-wrap:after,.reg-wrap:before,.reg-wrap:after{display:none}.login-card,.reg-card{margin-left:0}}
.auth-flags{position:fixed;z-index:20;right:clamp(16px,3vw,42px);top:clamp(16px,3vw,30px);display:flex;align-items:center;gap:7px;padding:5px 8px;border:1px solid rgba(255,255,255,.22);border-radius:9px;background:rgba(8,30,88,.36);backdrop-filter:blur(5px)}
.auth-flags a{display:grid;place-items:center;width:32px;height:28px;border-radius:6px;text-decoration:none;line-height:1;opacity:.68;transition:background .15s,opacity .15s,transform .15s}
.auth-flags img{display:block;width:24px;height:16px;object-fit:cover;border-radius:2px;box-shadow:0 0 0 1px rgba(255,255,255,.2)}
.auth-flags a:hover,.auth-flags a:focus-visible{background:rgba(255,255,255,.14);opacity:1;transform:translateY(-1px);outline:none}.auth-flags a:focus-visible{box-shadow:0 0 0 2px #fff}.auth-flags a[aria-current=true]{background:#fff;opacity:1;filter:none;box-shadow:0 2px 8px rgba(0,0,0,.16)}
.auth-flag-separator{color:rgba(255,255,255,.38);font-size:12px}
@media(max-width:520px){.auth-flags{right:12px;top:12px;gap:4px;padding:4px 6px}.auth-flags a{width:30px;height:26px}}
.login-card{height:438px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:flex-start}
.login-card .marca{flex:0 0 auto}.login-card>div:last-of-type{margin-top:auto!important;min-height:42px;display:flex;align-items:center;justify-content:center;line-height:1.35;white-space:nowrap;font-size:13px!important}
.login-card>div:last-of-type a{margin-left:4px}
@media(max-width:520px){.login-card{height:438px}.login-card>div:last-of-type{white-space:normal;text-align:center}}
.login-wrap:before{display:none}.login-hero-logo{position:absolute;z-index:1;left:clamp(28px,6vw,100px);top:50%;width:min(43vw,590px);height:auto;transform:translateY(-50%);display:block}
@media(min-width:1600px){.login-hero-logo{left:clamp(140px,calc(26vw - 274px),225px)}}
@media(max-width:900px){.login-hero-logo{display:none}}
.login-wrap{background:#002055}
body,.login-wrap,.login-wrap *,.reg-wrap,.reg-wrap *{font-family:"Gotham Pro",Arial,sans-serif!important}
.reg-wrap:before,.reg-wrap:after{display:none}.reg-wrap{background:#002055}.reg-card #ajudaEmail{height:42px}

/* Entrada e passagem entre Login <-> Registo.
   A transição entre documentos mantém cada página independente e funcional. */
@view-transition{navigation:auto}
.login-hero-logo{view-transition-name:academy-auth-logo;animation:auth-logo-in .78s cubic-bezier(.2,.75,.25,1) both}
.login-card,.reg-card{view-transition-name:academy-auth-card;animation:auth-card-in .7s cubic-bezier(.2,.75,.25,1) .08s both}
.auth-flags{view-transition-name:academy-auth-languages;animation:auth-flags-in .5s ease-out .28s both}
.login-card .barra-dec,.reg-card .barra-dec{transform-origin:center;animation:auth-line-in .55s cubic-bezier(.2,.8,.25,1) .48s both}
.login-card .campo,.login-card .btn,.login-card .erro-msg,.login-card>div:last-of-type,
.reg-card .erros,.reg-card form,.reg-card .liga-login{animation:auth-content-in .45s ease-out .3s both}

::view-transition-group(academy-auth-logo),
::view-transition-group(academy-auth-card),
::view-transition-group(academy-auth-languages){animation-duration:.62s;animation-timing-function:cubic-bezier(.2,.75,.25,1)}
::view-transition-old(academy-auth-card){animation:auth-page-old .34s ease-in both}
::view-transition-new(academy-auth-card){animation:auth-page-new .52s cubic-bezier(.2,.75,.25,1) .08s both}

@keyframes auth-logo-in{
  from{opacity:0;transform:translate(-42px,-50%) scale(.97)}
  to{opacity:1;transform:translate(0,-50%) scale(1)}
}
@keyframes auth-card-in{
  from{opacity:0;transform:translateX(44px) scale(.975)}
  to{opacity:1;transform:translateX(0) scale(1)}
}
@keyframes auth-flags-in{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}
@keyframes auth-line-in{from{opacity:0;transform:scaleX(0)}to{opacity:1;transform:scaleX(1)}}
@keyframes auth-content-in{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
@keyframes auth-page-old{to{opacity:0;transform:translateX(-26px) scale(.985)}}
@keyframes auth-page-new{from{opacity:0;transform:translateX(30px) scale(.985)}to{opacity:1;transform:none}}

@media(max-width:900px){
  .login-card,.reg-card{animation-name:auth-card-mobile-in}
  @keyframes auth-card-mobile-in{from{opacity:0;transform:translateY(28px) scale(.98)}to{opacity:1;transform:none}}
}
@media(min-width:901px) and (max-width:1500px){.reg-wrap .auth-flags{right:12px}}
@media(prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  .login-hero-logo,.login-card,.reg-card,.auth-flags,.login-card .barra-dec,.reg-card .barra-dec,
  .login-card .campo,.login-card .btn,.login-card .erro-msg,.login-card>div:last-of-type,
  .reg-card .erros,.reg-card form,.reg-card .liga-login{animation:none!important}
}
