/* ============================================================
   M7 - INAUGURAÇÃO DA UNIVERSIDADE (Cancela Kids 2)
   ============================================================ */

.m7k2-wrap {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

/* Base da cancela vista de cima */
.m7k2-base {
  position: absolute;
  top: 24%;     /* ← AJUSTE: posição no tapete (metade) */
  left: 23.1%;    /* ← AJUSTE: posição no tapete */
  width: 5.5%;
  height: 6.0%;
  background: #333;
  border-radius: 15%;
  border: 0.2vw solid #111;
  pointer-events: none;
  z-index: 10;
}

/* Engate no centro da base */
.m7k2-eixo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 45%;
  height: 45%;
  background: #ff5500;
  border-radius: 50%;
  z-index: 12;
}

/* A Haste da cancela (Abaixada/fechada por padrão) */
/* Cópia com o eixo à DIREITA, ela se estende para a ESQUERDA */
.m7k2-haste {
  position: absolute;
  top: 50%;
  right: 50%;      /* A haste começa no eixo da base e vai para a esquerda */
  width: 480%;    /* Comprimento da cancela relativo a base */
  height: 45%;      /* Espessura */
  background: repeating-linear-gradient(
    -45deg,
    #ffcc00,
    #ffcc00 0.8vw,
    #111111 0.8vw,
    #111111 1.6vw
  );
  transform-origin: 100% 50%; /* Gira a partir da ponta DIREITA (pivô) */
  transform: translateY(-50%) rotate(0deg); /* 0deg = Deitada na horizontal */
  transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1); 
  border-radius: 50% 0 0 50%; 
  border: 0.1vw solid rgba(0,0,0,0.8);
  box-shadow: 0.4vw 0.8vw 1vw rgba(0,0,0,0.5);
  z-index: 11;
}

/* Classe de acionamento (quando aberta) gira pra cima no sentido horário */
.m7k2-haste.aberta {
  transform: translateY(-50%) rotate(90deg); /* Ponta esquerda levanta para cima/direita */
  box-shadow: -0.8vw -0.4vw 1vw rgba(0,0,0,0.5); 
}

/* Botão interativo */
#m7k2-btn-levantar {
  position: absolute;
  top: 31%;     /* ← AJUSTE: botão perto da cancela */
  left: 15%;    /* ← AJUSTE: alinhado à base */
  transform: translateX(-50%);
  background-color: var(--tbr-azul, #022d62);
  color: #fff !important;
  border: 2px solid rgba(255,255,255,0.2);
  padding: 8px 16px;
  border-radius: 12px;
  font-weight: 700;
  font-size: 0.9vw;
  cursor: pointer;
  pointer-events: auto;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  font-family: 'Archivo', 'Montserrat', sans-serif;
  box-shadow: 0 4px 12px rgba(2, 45, 98, 0.3);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  white-space: nowrap;
  z-index: 15;
}

#m7k2-btn-levantar:hover {
  background-color: var(--tbr-verde, #00b144);
  transform: translateX(-50%) translateY(-3px) scale(1.05);
  box-shadow: 0 8px 20px rgba(0, 177, 68, 0.4);
  border-color: rgba(255,255,255,0.4);
}

#m7k2-btn-levantar:active {
  transform: translateX(-50%) translateY(-1px) scale(0.98);
}

/* Quando levantada: botão fica verde */
#m7k2-btn-levantar.m7-btn-on {
  background-color: var(--tbr-verde, #00b144);
  box-shadow: 0 0 15px rgba(0, 177, 68, 0.5);
}
