*{
      box-sizing: border-box;
    }

    body{
      margin: 0;
      min-height: 100vh;
      font-family: 'Montserrat', sans-serif;
      background: url('backgroud.png') no-repeat center center fixed;
      background-size: cover;
      display: flex;
      justify-content: center;
      align-items: center;
      color: #fff;
    }

    .container{
      width: 100%;
      padding: 20px;
      display: flex;
      justify-content: center;
    }

    .card{
      background: rgba(0,0,0,0.65);
      backdrop-filter: blur(8px);
      border-radius: 16px;
      padding: 40px 30px;
      width: 100%;
      max-width: 480px;
      text-align: center;
    }

    .logo img{
      width: 160px;
      height: auto;
      user-select: none;
    }

    .logo p{
      margin-top: 10px;
      font-size: 16px;
      opacity: 0.9;
    }

    .links{
      margin-top: 30px;
      display: flex;
      flex-direction: column;
      gap: 14px;
    }

    .botao{
      height: 60px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #ffffff;
      color: #203e77;
      text-decoration: none;
      font-size: 18px;
      font-weight: 600;
      border-radius: 10px;
      transition: transform .2s ease, box-shadow .2s ease, color .2s ease;
    }

    .botao:hover{
      transform: translateY(-3px);
      box-shadow: 0 10px 20px rgba(0,0,0,.35);
      color: #5d87b2;
    }
	
	.instagram{
  color: #ffffff;
  text-decoration: none;
  font-weight: 500;
  transition: opacity .2s ease, color .2s ease;
	}

	.instagram:hover{
  opacity: 0.8;
  color: #cbd9ff;
	}


    @media (max-width: 768px){
      .botao{
        height: 80px;
        font-size: 22px;
      }
    }
	
/* ============================= */
/* BANNER FLUTUANTE MINECRAFT */
/* ============================= */

.mc-floating{
  position: fixed;
  right: 20px;
  bottom: 20px;

  padding: 12px;
  border-radius: 14px;

  background: rgba(0,0,0,0.55);
  backdrop-filter: blur(8px);

  z-index: 999;
  box-shadow: 0 10px 30px rgba(0,0,0,.45);
  
  cursor: pointer;
  
}

/* IMAGEM DO WIDGET */
.mc-floating img{
  display: block;
  max-width: 300px;
  height: auto;
  cursor: pointer;
}

/* MOBILE */
@media (max-width: 768px){
  .mc-floating{
    right: 12px;
    bottom: 12px;
    padding: 8px;
  }

  .mc-floating img{
    max-width: 220px;
  }
}

.mc-floating.copied::after{
  content: "Endereço copiado!";
  position: absolute;
  bottom: 100%;
  right: 0;
  margin-bottom: 8px;
  background: #2ecc71;
  color: #000;
  font-size: 12px;
  padding: 4px 8px;
  border-radius: 6px;
}