:root {
      --primary: #448bfe;
      --secondary: #FF6584;
      --bg: #f0f9ff;
      --text: #232323;
      --card-bg:#ffffff;
      --shadow: rgba(0,0,0,0.1);
    }
    * { box-sizing: border-box; margin:0; padding:0; font-family:'Poppins',sans-serif; }
    body { background: var(--bg); display:flex; align-items:center; justify-content:center; height:110vh; }
    .wrapper {
      width: 100%; max-width: 400px; padding: 20px;
      display: flex; flex-direction: column; align-items: center;
      gap: 15px;
    }
    .logo-container {
      width: 120px; height: 120px;
      border-radius: 50%;
      overflow: hidden;
      background: var(--card-bg);
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 4px 8px var(--shadow);
      margin-bottom: 20px;
      margin-top: 10px;
    }
    .logo-container img {
      width: 90%; height: 90%;
      object-fit: cover;
      border-radius: 50%;
    }
    .container {
      width: 100%;
      display: flex;
      flex-direction: column;
      gap: 15px;
    }
    .btn {
      padding: 15px;
      text-align:center;
      font-size:1.1rem;
      border:none;
      border-radius:10px;
      box-shadow: 0 4px 8px var(--shadow);
      background: var(--primary);
      color:white;
      cursor:pointer;
      transition: transform .1s;
    }
    .btn:hover { transform: translateY(-2px); }
    .btn.whatsapp { background: #25D366; }
    .btn.whatsapp1 { background: #2553d3; }
    /* Overlay Card */
    .overlay {
      position: fixed; top:0; left:0; width:100%; height:100%;
      background: rgba(0,0,0,0.5); display:none;
      align-items:center; justify-content:center; padding:20px;
    }
    .card {
      background: var(--card-bg); border-radius:12px;
      padding:25px; max-width: 390px; width:100%;
      box-shadow: 0 6px 12px var(--shadow);
      position: relative;
      animation: fadeIn .3s ease-out;
    }
    .card  { margin-bottom:10px; color: var(--primary); }
    .card p, .card .faq-content p ul, li { color: var(--text); line-height:1.4; }
    .card .faq-content {
      max-height: 60vh; overflow-y: auto; margin-top: 10px;
    }
   
    .close-btn {
      position:absolute; top:10px; right:10px;
      background:none; border:none; font-size:1.2rem;
      cursor:pointer;
    }

  .protocol-image {
    max-height: 60vh;        /* até 60% da altura da viewport */
    overflow-y: auto;        /* rolagem vertical se ultrapassar */
  }

  .protocol-image img {
    width: 100%;             /* largura total do container */
    height: auto;            /* mantém proporção */
    display: block;
    border-radius: 8px;
    margin-bottom: 12px;
  }

  .protocol-image p {
    margin: 0;
    color: var(--text);
    line-height: 1.4;
  }

 

.footer {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  padding: 10px 0;
  font-size: 0.9rem;
  color: #666;
  background: transparent; /* ou outra cor se preferir */
 
}

.footer a {
  color: inherit;       /* mesmo tom do texto */
  text-decoration: none;
}

.footer a:hover {
  text-decoration: underline;
}
   
    @keyframes fadeIn { from {opacity:0; transform:scale(0.9);} to {opacity:1; transform:scale(1);} }