.elementor-3822 .elementor-element.elementor-element-0b5e93a{--display:flex;}.elementor-3822 .elementor-element.elementor-element-bc03434{--display:flex;}.elementor-3822 .elementor-element.elementor-element-600f99e > .elementor-widget-container{margin:47px 0px 0px 0px;}.elementor-3822 .elementor-element.elementor-element-600f99e.elementor-element{--align-self:center;}.elementor-3822 .elementor-element.elementor-element-3901e87{--display:flex;--padding-top:20px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3822 .elementor-element.elementor-element-60ce66e.elementor-element{--align-self:center;}.elementor-3822 .elementor-element.elementor-element-1ee93e3{--display:flex;}@media(max-width:767px){.elementor-3822 .elementor-element.elementor-element-600f99e{width:100%;max-width:100%;}}/* Start custom CSS for html, class: .elementor-element-600f99e */body {
    background-color: #F2EFED; /* Fundo roxo escuro */
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.digit-separator {
    display: flex;
    align-items: flex-end;
    font-size: 2.3rem;
    font-weight: bold;
    color: #91c7e6;
    margin: 0 3px 12px 3px;
    pointer-events: none;
    user-select: none;
    opacity: 0.7;
}

.flip-counter {
    display: flex;
    gap: 12px;
    font-family: 'Arial Black', sans-serif;
}

.flip-digit {
    position: relative;
    width: 70px;
    height: 100px;
    font-size: 4rem;
    font-weight: bold;
    background: linear-gradient(180deg, #222 0%, #444 100%);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    box-shadow: 0 4px 24px rgba(0,0,0,0.18);
    overflow: hidden;
    perspective: 400px;
    transition: background 0.3s;
}

.flip-digit.flip {
    animation: flipAnim 0.9s cubic-bezier(.52,-0.02,.62,1.07) forwards;
}

@keyframes flipAnim {
    0% { transform: rotateX(0); background: #222;}
    40% { transform: rotateX(70deg); background: #fff; color: #333;}
    50% { transform: rotateX(90deg); background: #fff; color: #333;}
    60% { transform: rotateX(70deg); background: #fff; color: #333;}
    100% { transform: rotateX(0); background: #222;}
}

.counter-wrapper {
    display: flex;
    align-items: center;
    gap: 20px; /* espaço entre ícone e contador */
}

.counter-icon {
    height: 100px;         /* ou ajuste conforme estética desejada */
    width: 100px;          /* mantém aspecto quadrado */
    object-fit: contain;
    border-radius: 12px;  /* arredonda igual dígito */
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    padding: 9px;
    /* opcional: leve brilho quando hover */
    transition: box-shadow 0.2s;
}

.counter-icon:hover {
    box-shadow: 0 0 24px 6px #7a2cff44, 0 0 10px 3px #0fe7fc44;
}

/* Estilos para telas de tablet (largura menor que 960px) */
@media (max-width: 960px) {
  .flip-digit {
    width: 55px;
    height: 70px;
    font-size: 3rem;
    border-radius: 10px;
  }
  .counter-icon {
    width: 70px;
    height: 70px;
    padding: 6px;
  }
  .flip-counter {
    gap: 8px;
  }
}

/* Estilos para telas de celular (largura menor que 640px) */
@media (max-width: 640px) {
  body {
    height: auto;
    padding: 10px;
  }
  .flip-digit {
    width: 36px;
    height: 46px;
    font-size: 1.7rem;
    border-radius: 6px;
  }
  .counter-icon {
    width: 40px;
    height: 40px;
    padding: 2px;
  }
  .flip-counter {
    gap: 1px;
  }
  .counter-wrapper {
    gap: 1px;
  }
  .digit-separator {
    margin: 0 0.5px 2px 0.5px;
    font-size: 1.3rem;
  }
}/* End custom CSS */