/* Waresite™ — Hero Eyes (ORIGINAL behavior, isolated, no shadow) */

.box .eye{
  position: relative;
  width: 74px;
  height: 74px;
  display: block;
  background: var(--tp-common-yellow-green, #d7ff3a);
  margin: 0 5px;
  border-radius: 50%;
  box-shadow: none !important;
  filter: none !important;
}

@media only screen and (min-width:1200px) and (max-width:1399px){
  .box .eye{ width:64px; height:64px; }
}
@media only screen and (min-width:992px) and (max-width:1199px),
       only screen and (min-width:768px) and (max-width:991px),
       (max-width:767px){
  .box .eye{ width:54px; height:54px; }
}

/* Pupila/íris (o ponto que "gira" pelo rotate do .eye) */
.box .eye:before,
.box .eye::before{
  content:"";
  position:absolute;
  top:50%;
  left:22px;
  width:30px;
  height:30px;
  border-radius:50%;
  background:#17312f;
  transform:translate(-50%,-50%);
  box-shadow:none !important;
  filter:none !important;
}

@media only screen and (min-width:1200px) and (max-width:1399px),
       only screen and (min-width:992px) and (max-width:1199px),
       only screen and (min-width:768px) and (max-width:991px),
       (max-width:767px){
  .box .eye:before,
  .box .eye::before{ width:25px; height:25px; }
}

/* Mata QUALQUER bolinha extra que esteja vindo de ::after (é isso que costuma sobrar como "dot") */
.box .eye:after,
.box .eye::after{
  content:none !important;
  display:none !important;
  width:0 !important;
  height:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}