:root{
      --bg: #e5f3f9;
      --card-bg: #ffffff;
      --primary: #0077cc;
      --text-main: #444;
      --muted: #777;
    }

    *{box-sizing:border-box;margin:0;padding:0;}

    body{
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
      background: var(--bg);
      min-height:100vh;
      display:flex;
      align-items:center;
      justify-content:center;
      opacity: 1 !important;
    }

    .login-wrapper{
      width:100%;
      display:flex;
      align-items:center;
      justify-content:center;
    }

    .stack{
      position:relative;
      width:340px;
      max-width:90%;
    }

    .paper{
      position:absolute;
      inset:0;
      background:var(--card-bg);
      border-radius:2px;
      box-shadow:0 8px 22px rgba(0,0,0,.15);
    }
    .paper.back1{ transform:rotate(-2deg) translateY(10px); opacity:.65; }
    .paper.back2{ transform:rotate(2deg) translateY(20px); opacity:.45; }

    .card{
      position:relative;
      background:var(--card-bg);
      border-radius:3px;
      padding:24px 26px 12px;
      text-align:center;
    }

    h1{
      font-size:20px;
      color:var(--text-main);
      margin-bottom:4px;
      font-weight:600;
    }

    .logo{ margin:8px 0 10px; }
    .logo img{ max-width:180px; height:auto; }

    form{ margin-top:6px; text-align:left; }

    .form-group{ margin-bottom:10px; }

    .form-actions{
      margin-top:2px;
      margin-bottom:8px;
    }

    input[type="text"],
    input[type="password"]{
      width:100%;
      padding:8px 10px;
      border:1px solid #ccc;
      border-radius:3px;
      font-size:14px;
      outline:none;
      transition:border-color .2s, box-shadow .2s;
    }
    input:focus{
      border-color:var(--primary);
      box-shadow:0 0 0 2px rgba(0,143,213,.15);
    }

    .btn-primary{
      display:inline-block;
      border:none;
      background:var(--primary);
      color:#fff;
      padding:8px 18px;
      border-radius:3px;
      font-size:14px;
      cursor:pointer;
      font-weight:600;
    }
    .btn-primary:hover{ background:#0073ad; }

    input, select, textarea{ font-size:16px !important; }

    .links-right{
      float:right;
      text-align:right;
      font-size:12px;
      margin-left:8px;
    }
    .links-right a{
      color:var(--primary);
      text-decoration:none;
    }
    .links-right a:hover{ text-decoration:underline; }

    .erro-box{
      background:#fff3cd;
      color:#664d03;
      border:1px solid #ffecb5;
      border-radius:4px;
      padding:8px 10px;
      font-size:12px;
      margin-bottom:10px;
      text-align:left;
    }

    .info-box{
      background:#e8f0fe;
      color:#1a73e8;
      border:1px solid #cfe1ff;
      border-radius:4px;
      padding:8px 10px;
      font-size:12px;
      margin-bottom:10px;
      text-align:left;
    }

    .footer-card{
      width:100%;
      margin-top:8px;
      padding-top:6px;
      border-top:1px solid #eee;
      font-size:12px;
      color:var(--muted);
      text-align:center;
    }

    .footer-card a{ color:var(--primary); text-decoration:none; }
    .footer-card a:hover{ text-decoration:underline; }

    .logos-parceiros{ margin-top:4px; }

    .logos-parceiros img{
      width:26px;
      height:26px;
      margin:0 4px;
      opacity:0.85;
      transition:0.2s ease;
      vertical-align:middle;
    }
    .logos-parceiros img:hover{ opacity:1; transform:scale(1.08); }

    /* Link Dar Sugestões */
.sugestoes-link a{
  color: #dc3545;              /* vermelho SiGI */
  text-decoration: none;       /* tira sublinhado */
  font-size: 13px;
  font-weight: 600;
}

.sugestoes-link a:hover{
  text-decoration: underline;  /* sublinha só ao passar o rato */
  opacity: 0.9;
}


    @media (max-width:480px){
      .card{padding:20px 16px 10px;}
      h1{font-size:18px;}
      .links-right{
        float:none;
        text-align:left;
        margin-top:8px;
        margin-left:0;
      }
      .form-actions{ text-align:left; }
    }


/* ===============================
   LOGIN CARD - NATAL
   =============================== */
.card{
  position:relative;
}

/* ESCONDIDO POR PADRÃO */
.card::before{
  content:"";
  display:none;

  position:absolute;
  top:-18px;
  right:-22px;

  width:46px;
  height:46px;

  background-size:contain;
  background-repeat:no-repeat;
  background-position:center;

  transform:rotate(15deg);
  pointer-events:none;

  filter: drop-shadow(0 4px 4px rgba(0,0,0,.25));
}

/* 🎅 NATAL */
.card.natal::before{
  display:block;
  background-image:url("../img/santa-hat.png");
}

/* 🎆 ANO NOVO */
.card.anonovo::before{
  display:block;
  background-image:url("../img/fireworks.png");
}
/* ===============================
   ANO NOVO - ANIMAÇÃO SUAVE
   =============================== */
.card.anonovo::before{
  animation: fogosPulse 3.5s ease-in-out infinite;
}

/* ANIMAÇÃO LEVE */
@keyframes fogosPulse{
  0%{
    transform: rotate(0deg) scale(1);
    opacity:0.9;
    filter: drop-shadow(0 4px 4px rgba(0,0,0,.25));
  }
  50%{
    transform: rotate(3deg) scale(1.08);
    opacity:1;
    filter: drop-shadow(0 6px 8px rgba(255,180,0,.45));
  }
  100%{
    transform: rotate(0deg) scale(1);
    opacity:0.9;
    filter: drop-shadow(0 4px 4px rgba(0,0,0,.25));
  }
}