.elementor-1259 .elementor-element.elementor-element-020fe19{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1259 .elementor-element.elementor-element-d0ecfc9{width:var( --container-widget-width, 100% );max-width:100%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;--container-widget-width:100%;--container-widget-flex-grow:0;}.elementor-1259 .elementor-element.elementor-element-f494ad5{width:var( --container-widget-width, 100% );max-width:100%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;--container-widget-width:100%;--container-widget-flex-grow:0;}.elementor-1259 .elementor-element.elementor-element-ef090f9{--display:flex;--min-height:1px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}:root{--page-title-display:none;}@media(max-width:1024px) and (min-width:768px){.elementor-1259 .elementor-element.elementor-element-ef090f9{--content-width:100%;}}/* Start custom CSS for container, class: .elementor-element-ef090f9 */.elementor-1259 .elementor-element.elementor-element-ef090f9 {
    background: linear-gradient(to right, #DFA34B, #B37F34, #8C6428, #DFA34B, #B37F34);
    background-size: 1000% 1000%;
    animation: moverBackground 20s linear infinite;
}

@keyframes moverBackground {
    0% { background-position: 0% 50%; }
    100% { background-position: 100% 50%; }
  }/* End custom CSS */
/* Start custom CSS *//* Container principal - Garante que o radar tenha seu próprio espaço */
.radar-container-custom {
  position: relative;
  width: 100%;
  max-width: 900px; /* Use um max-width fixo em pixels para desktop */
  aspect-ratio: 1 / 1;
  margin: 0 auto;
  overflow: hidden; /* Garante que nada transborde */
}

/* Círculos de pulso */
.radar-container-custom .circle {
  position: absolute;
  top: 50%;
  left: 50%;
  border: 2px solid #00ffcc55; /* Use px para borda para consistência */
  border-radius: 50%;
  transform: translate(-50%, -50%);
  animation: pulse 2s infinite ease-out;
}

.radar-container-custom .circle:nth-child(1) {
  width: 30%;
  height: 30%;
  animation-delay: 0s;
}
.radar-container-custom .circle:nth-child(2) {
  width: 55%;
  height: 55%;
  animation-delay: 0.5s;
}
.radar-container-custom .circle:nth-child(3) {
  width: 80%;
  height: 80%;
  animation-delay: 1s;
}

@keyframes pulse {
  0% {
    opacity: 0.5;
    transform: translate(-50%, -50%) scale(1);
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.4);
  }
}

/* Destaque do cone */
.radar-container-custom .circle-highlight {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  transform: translate(-50%, -50%) rotate(0deg);
  pointer-events: none;
  background: conic-gradient(
    rgba(8, 142, 53, 0.3) 0deg 51.43deg,
    transparent 51.43deg 360deg
  );
  border-radius: 50%;
  animation: rotateHighlight 8s linear infinite;
  z-index: 1;
}

@keyframes rotateHighlight {
  from {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}

/* Imagem central */
.radar-container-custom .center-image {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 30%;
  height: auto;
  transform: translate(-50%, -50%);
  z-index: 2;
  object-fit: contain;
}

/* Caixas de texto */
.radar-container-custom .text-box {
  position: absolute;
  top: 50%;
  left: 50%;
  background-color: #c28b3c;
  color: #000000;
  padding: 0.5em 1em;
  border: 1px solid #c28b3c;
  border-radius: 5px;
  font-family: "Poppins", sans-serif;
  font-size: 2.8vw; /* Ajuste para ser mais responsivo */
  max-width: 40%;
  text-align: center;
  transition: background-color 0.3s, transform 0.3s;
  line-height: 1.2; /* Melhora a legibilidade com <br> */
}

/* Media query para desktop - Tamanho de fonte fixo e max-width */
@media (min-width: 768px) {
  .radar-container-custom .text-box {
    font-size: 16px; /* Tamanho fixo em px para desktop */
  }
  .radar-container-custom .radar-container {
    max-width: 800px; /* Reduz um pouco o max-width para melhor encaixe */
  }
}

/* Classe para o highlight do texto */
.radar-container-custom .text-box.highlight {
  background-color: #ffe600; /* Cor de destaque ao passar o "radar" */
  color: #333;
  font-weight: bold;
}/* End custom CSS */