*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:"Inter","Segoe UI",Arial,sans-serif;
  background:linear-gradient(180deg,#071034 0%, #0b1630 60%);
  color:#fff;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

.site-header{
  padding:18px 12px;
  background:linear-gradient(90deg,#071034,#0b203f);
  box-shadow:0 8px 40px rgba(0,0,0,0.45)
}

.logo-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  max-width:1100px;
  margin:0 auto;
  padding:4px 12px
}

.accor-logo{
  height:56px;
  object-fit:contain;
  filter:drop-shadow(0 6px 14px rgba(0,0,0,0.5));
}

.brand-logos{
  display:flex;
  gap:18px;
  align-items:center;
}

.hotel-logo{
  height:44px;
  object-fit:contain;
  transform:translateY(1px);
}

.card{
  max-width:760px;
  margin:28px auto;
  background:linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.02));
  border-radius:12px;
  padding:26px;
  box-shadow:0 10px 40px rgba(3,6,12,0.6);
  border:1px solid rgba(255,255,255,0.04)
}

.login-card{
  max-width:420px;
  margin:36px auto;
  text-align:left
}

h1{
  margin-bottom:18px;
  color:#f6e4b6;
  font-weight:700;
  text-align:center;
  font-size:1.5rem
}

h3{
  margin:16px 0 10px;
  color:#f6e4b6;
}

.label{
  display:block;
  margin:8px 0 6px;
  color:#e9e2c7;
  font-weight:600
}

.hint{
  margin-top:12px;
  color:#f7f1d0;
  font-size:13px;
  opacity:0.95
}

input{
  width:100%;
  padding:12px 14px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,0.06);
  background:rgba(255,255,255,0.02);
  color:#fff;
  margin-bottom:12px;
  font-size:15px
}

.actions{
  display:flex;
  gap:12px;
  margin-top:8px
}

button{
  flex:1;
  padding:12px 14px;
  border-radius:8px;
  border:none;
  cursor:pointer;
  font-weight:700;
  color:#071034;
  background:linear-gradient(180deg,#f0c86a,#d4a73e);
  box-shadow:0 8px 20px rgba(212,167,62,0.18)
}

button.ghost{
  background:transparent;
  color:#fff;
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:none
}

button:hover{
  transform:translateY(-2px)
}

.resultado{
  margin-top:14px;
  color:#fff
}

.linha{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  padding:8px 10px;
  border-radius:6px
}

.destaque{
  background:rgba(255,255,255,0.02);
  border-left:4px solid #d4a73e
}

.valor{
  font-weight:700;
  color:#fff
}

.msg{
  text-align:center;
  margin-top:12px;
  font-weight:700
}

.msg-error{
  color:#ff9b9b
}

.msg-ok{
  color:#bff0c6;
  margin-top:12px;
  font-weight:700;
}

.erro{
  color:#ff9b9b
}

hr{
  border:none;
  border-top:1px solid rgba(255,255,255,0.08);
  margin:14px 0;
}

.site-footer{
  text-align:center;
  padding:14px;
  color:#cfc7b1;
  font-size:13px;
  opacity:0.9;
  margin-top:18px
}

@media (max-width:720px){
  .logo-row{flex-direction:column;gap:8px}
  .card{margin:18px}
  .accor-logo{height:46px}
  .hotel-logo{height:36px}
}