@font-face {
    font-family: 'BlenderPro';
    src: url('../fonts/BlenderPro-Bold.woff2') format('woff2'),
         url('../fonts/BlenderPro-Bold.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}


body{
    font-family: 'BlenderPro', sans-serif !important;
    min-width: 360px !important;
}


:root{
    --cor-darkblue: rgba(1, 11, 21, 0.93);
    --cor-branca: #FFFFFF;
}

a{text-decoration: none !important;}


/* --- HEADER --- */

header {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1000;
  background-color: rgba(27, 27, 28, 0.8); 
  backdrop-filter: blur(5px); 
  transition: top 0.4s ease;
}

header#mainHeader {
  position: fixed;
  top: 0;
  width: 100%;
  height: 100px;
  background-color: rgba(1, 11, 21, 0.85);
  z-index: 1000;
  transition: top 0.4s ease, opacity 0.4s ease;
  backdrop-filter: blur(8px); /* opcional: efeito de vidro */
  align-content: center;
}

header.hide-header {
  top: -100px;
  opacity: 0;
  pointer-events: none;
}

.nav-desktop .nav-link {
  color: white;
  padding: 0 15px;
  transition: color 0.3s;
  font-size: 25px;
}

.nav-desktop .nav-link:hover {
  color: #ccc;
}

#mobileMenu {
  background-color: rgba(27, 27, 28, 0.95);
}

#mobileMenu .nav-link {
  color: white;
  padding: 10px;
  display: block;
}

.dropdown-menu {
  background-color: rgba(27, 27, 28, 0.8) !important;
  border: none;
  box-shadow: none;
}

.dropdown-menu .dropdown-item {
  color: white;
}

.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus {
  background-color: rgba(255, 255, 255, 0.2);
  color: white;
}

.navbar .dropdown-menu .dropdown-item:active,
.navbar .dropdown-menu .dropdown-item:focus,
.navbar .nav-link:focus,
.navbar .nav-link:active {
  color: white !important;
  background-color: rgba(255, 255, 255, 0.2) !important; /* ou transparente */
  outline: none;
  box-shadow: none;
}

.navbar .nav-link.dropdown-toggle:focus,
.navbar .nav-link.dropdown-toggle:active {
  color: white !important;
  background-color: transparent !important;
}

.nav-link {
    color: white !important;
}

.nav-item.dropdown:hover > .nav-link,
.nav-item.dropdown:focus > .nav-link,
.nav-item.dropdown.show > .nav-link {
    color: white !important;
}



.carousel-inner img{
    object-fit: cover;
    height: 650px;
}

@media (max-width: 1200px) {
    .carousel {
        height: 600px;
    }
    .carousel-inner img {
        height: 600px;
    }
    .overlay-banner{
        height: 600px !important;
    }
}

@media (max-width: 992px) {
    .carousel {
        height: 550px;
    }
    .carousel-inner img{
        height: 550px;
    }
    .overlay-banner{
        height: 550px !important;
    }
}

@media (max-width: 768px) {
    .carousel {
        height: 450px;
    }
    .carousel-inner img {
        height: 450px;
    }
    .overlay-banner{
        height: 450px !important;
    }
}

@media (max-width: 576px) {
    .carousel {
        height: 400px;
    }
    .carousel-inner img {
        height: 400px;
    }
    .carousel-indicators {
        bottom: 90px !important; 
    }
    .overlay-banner{
        height: 300px !important;
    }
    header#mainHeader{
        height: 60px;
    }
    .logo img{
        height: 55px !important;
    }
}

@media (min-width: 576px){
    #carouselExampleIndicators{
        position: relative;
        z-index: 20;
        margin-bottom: 52px;
    }    
}

@media (max-width: 575px){
    #carouselExampleIndicators{
        position: relative;
        z-index: 20;
    }
    
}

.carousel-indicators button{
    width: 58px !important;
    height: 8px !important;
    background-color: var(--cor-branca);
    opacity: 1 !important;

}

.carousel-indicators button.active{
    background-color: rgb(55, 206, 221);
}

.carousel-indicators_mobile button{
    border: none;
    background-color: var(--cor-branca);
    opacity: 1 !important;
}

.carousel-indicators_mobile button.active{
    background-color: rgb(55, 206, 221);
}

#carousel_mobile img{
    object-fit: cover;
    width: 360px;
    height: 300px;
}

#carousel_mobile button{
    width: 25px !important;
    height: 4px !important;
}

#carousel_mobile .carousel-indicators [data-bs-target]{margin-left: 0px;}

.img_cabecalho img{
    object-fit: cover;
    height: 590px;
    margin-bottom: 52px;
    width: 100%;
}

@media (max-width: 1200px) {
    .img_cabecalho img{
        object-fit: cover;
        height: 590px;
        margin-bottom: 52px;
    }
}

@media (max-width: 992px) {
    .img_cabecalho img{
        object-fit: cover;
        height: 490px;
        margin-bottom: 52px;
    }
}

@media (max-width: 768px) {
    .img_cabecalho img{
        object-fit: cover;
        height: 390px;
        margin-bottom: 52px;
    }
}

@media (max-width: 576px) {
    .img_cabecalho img{
        object-fit: cover;
        height: 340px;
        margin-bottom: 52px;
    }
}

/* Overlay por cima do carrossel/imagem */
.overlay-banner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 650px; /* ajusta conforme necessário */
    background: rgba(27, 27, 28, 0.5); /* azul escuro com transparência */
    z-index: 30 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none; /* garante que os cliques passam para baixo */
}

.overlay-content {
    color: white;
    text-align: center;
    padding: 2rem;
    pointer-events: auto;
}

.titulo-banner {
    font-size: 3rem;
    font-family: 'Bebas Neue', sans-serif;
    margin: 0;
}

.subtitulo-banner {
    font-size: 1.2rem;
}


@media (max-width: 576px) {
    .titulo-banner{
        font-size: 1.5rem;
    }
    .subtitulo-banner{
        font-size: 0.8rem;
    }
}

.btn-experimentar {
    background-color: rgb(55, 206, 221);
    color: white;
    font-size: 20px !important;
    letter-spacing: 2px;
    padding: 0.8rem 1.5rem;
    text-decoration: none;
    font-weight: bold;
    display: inline-block;
    margin-top: 1rem;
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* sombra normal */
}

.btn-experimentar:hover {
    background-color: rgb(55, 206, 221); 
    color: white;
    text-decoration: none;
    transform: translateY(-4px); /* faz parecer que sobe */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3); /* sombra mais forte por baixo */
}

.btn-experimentar:visited {
    color: white;
    background-color: rgb(55, 206, 221);
    text-decoration: none;
}

@media (max-width: 700px) {
    .btn-experimentar {
        font-size: 13px !important;
        letter-spacing: 2px;
        padding: 0.5rem 1rem;
    }
}

.header-links{
    background-color: rgb(1, 11, 21) !important; 
}

@media (min-width: 701px) {
    .header-links img{
        padding-left: 80px !important;
    }
    .main_links{
        margin-top: 130px !important;
        border: 2px solid rgb(55, 206, 221);
        box-shadow: 0 0 5px rgb(55, 206, 221),
                    0 0 10px rgb(55, 206, 221),
                    0 0 20px rgb(55, 206, 221),
                    0 0 40px rgb(55, 206, 221);
    }
}

@media (max-width: 700px) {
    .header-links img{
        height: 55px !important;
        padding-left: 30px !important;
    }
    .main_links{
        margin-top: 80px !important;
        border: 2px solid rgb(55, 206, 221);
        box-shadow: 0 0 5px rgb(55, 206, 221),
                    0 0 10px rgb(55, 206, 221),
                    0 0 20px rgb(55, 206, 221),
                    0 0 40px rgb(55, 206, 221);

    }
}


/* --- MAIN --- */

.conteudo_simples{
    margin: auto;
    background-color: var(--cor-branca); 
}

.index_view{ margin-top: -50px !important;}

.linha_laranja{
    width: 350px;
    height: 3px;
    border-radius: 100%;
    background-color: rgb(55, 206, 221);
}

.linha_laranja_mobile{
    width: 200px;
    height: 3px;
    border-radius: 100%;
    background-color: rgb(55, 206, 221);
}

.bem_vindo_links{
    margin-top: 46px !important;
    margin-bottom: 40px;
    text-align: center;
    color: var(--cor-darkblue);
    font-weight: 400;
    font-size: 45px;
    line-height: 58px !important;
}

.bem_vindo{
    text-align: center;
    color: var(--cor-darkblue);
    font-size: 38px;
    font-weight: 300;
    margin-bottom: 60px;
}

.bem_vindo_mobile_links{
    margin-top: 30px !important;
    margin-bottom: 30px;
    text-align: center;
    color: var(--cor-darkblue);
    font-weight: 400;
    font-size: 35px;
    line-height: 30px !important;
}

.bem_vindo_mobile{
    text-align: center;
    color: var(--cor-darkblue);
    font-size: 35px !important;
    font-weight: 300;
    margin-bottom: 50px;
}


.imagem-com-sobreposicao {
  float: left;
  margin-right: 2rem;
  margin-bottom: 1rem;
  position: relative;
}

.imagem-sobreposta {
  float: left;
  width: 250px;
  height: auto;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.4);
  transform: translate(-10px, 40px);
  z-index: 2;
}

.imagem-fundo {
  float: left;
  width: 250px;
  height: auto;
  filter: brightness(0.95);
  opacity: 0.9;
  margin-left: -200px; /* sobrepõe à esquerda */
  margin-top: 20px;
  z-index: 1;
}

.imagem-sobreposta_mobile {
  float: left;
  width: 120px;
  height: auto;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.4);
  transform: translate(0px, 20px);
  z-index: 2;
}

.imagem-fundo_mobile {
  float: left;
  width: 120px;
  height: auto;
  filter: brightness(0.95);
  opacity: 0.9;
  margin-left: -100px; /* sobrepõe à esquerda */
  margin-top: 20px;
  z-index: 1;
}

.textos_main {
    font-size: 18px;
    line-height: 1.5;
    color: var(--cor-darkblue);
    font-weight: 400;

}

@media (min-width: 991px){
    .textos_main{
        height: 500px;
    }
}

.textos{
    font-weight: 400;
    margin-top: 64px !important;
    margin-bottom: 55px;
    color: var(--cor-darkblue);
    font-size: 16px;
}


.textos_main_mobile{
    color: var(--cor-darkblue);
    font-size: 13px;
    font-weight: 400;
}

.textos_mobile{
    font-weight: 400;
    margin-bottom: 34px;
    color: var(--cor-darkblue);
    font-size: 13px;
}


.parcerias-section {
  background-color: #f9f9f9; /* cor suave para destacar a seção */
}

.parceiros-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 2rem;
  align-items: center;
  justify-items: center;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1rem;
}

.parceiro-logo{
  width: 150px !important;
  height: 100px !important;
  object-fit: cover;
  transition: transform 0.3s ease, filter 0.3s ease;
  filter: grayscale(100%);
  cursor: pointer;
}

.parceiro-logo:hover {
  filter: none;
  transform: scale(1.1);
}



.conteudo_simples img{
    margin-bottom: 21px;
    margin-top: -20px;
}

.textos_contactos {
    background-color: var(--cor-darkblue);
    padding-left: 50px;
    padding-right: 50px;
}

@media (min-width: 992px){
    .textos_contactos{
        width: 400px !important;
    }
}

.textos_contactos p {
    color: lightgray;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 25px;
}

@media (max-width: 991.98px) {
    .textos_contactos p {
        font-size: 18px;
    }
}


.contactos_editavel{
    font-weight: 500;
    font-size: 25px;
    margin-top: -15px !important;
}

.textos_contactos_mobile {
    background-color: var(--cor-darkblue);
    padding-left: 15px;
    padding-right: 15px;
    max-width: 100%;
    word-wrap: break-word; /* evita overflow com textos longos */
}

.textos_contactos_mobile p {
    color: lightgray;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 17px;
    word-wrap: break-word; /* reforça para textos dentro dos <p> */
}

.contactos_editavel_mobile{
    font-weight: 500;
    font-size: 17px;
    margin-top: -10px;
    margin-bottom: 21px;
}

.contactos_azul{
    border-bottom: 2px solid rgb(55, 206, 221);
    height: 30px;
}

.contactos_azul_mobile{
    border-bottom: 2px solid rgb(55, 206, 221);
    height: 20px;
    display: inline-block;
}

#contactos_form input{
    width: 100%;
    height: 35px;
    border: 1px solid var(--cor-darkblue) !important;
    border-radius: 10px;
    padding-left: 10px;
}

#contactos_form_mobile input{
    width: 100%;
    height: 27px;
    border: 1px solid var(--cor-darkblue) !important;
    border-radius: 10px;
    padding-left: 10px;
}

#contactos_form input:nth-child(odd){
    margin-bottom: 23px;
}

#contactos_form_mobile input:nth-child(odd){
    margin-bottom: 23px;
}

input::placeholder{
    color: var(--cor-darkblue);
}

textarea{
    width: 100%;
    height: 172px;
    border: 1px solid var(--cor-darkblue) !important;
    border-radius: 10px;
    padding-left: 10px;
    resize: none !important;
}

@media (max-width: 768px){
    textarea{
        height: 115px;
    }    
}

textarea::placeholder{
    color: var(--cor-darkblue);
}

#contactos_form label{
    color: var(--cor-darkblue);
    text-transform: uppercase;
    font-weight: 500;
    font-size: 25px;
}

#contactos_form_mobile label{
    color: var(--cor-darkblue);
    text-transform: uppercase;
    font-weight: 500;
    font-size: 17px;
}

.preenchimento_obrig{
    font-size: 13px;
    color: var(--cor-darkblue);
    font-weight: 400;
    margin-top: 10px;
}

.preenchimento_obrig_mobile{
    font-size: 10px;
    color: var(--cor-darkblue);
    font-weight: 400;
}

.logo_infante {
    margin-bottom: 0;
    font-size: 45px !important;
}

.logo_fitness {
    background-color: rgb(55, 206, 221);
    color: var(--cor-darkblue) !important;
    height: 25px;
    line-height: 25px;
    text-align: center;
    margin-top: -10px;
    text-transform: none !important;
}

.logo_infante_mobile {
    margin-bottom: 0;
    font-size: 35px !important;
}

.logo_fitness_mobile {
    background-color: rgb(55, 206, 221);
    color: var(--cor-darkblue) !important;
    height: 20px;
    line-height: 20px;
    text-align: center;
    margin-top: -10px;
    text-transform: none !important;
}

.mapa{
    margin-top: 80px !important;
    margin-bottom: -100px !important;
}

.mapa_mobile{
    margin-top: 50px !important;
    margin-bottom: -60px !important;
}

@media (max-width: 991px) and (min-width: 576px) {
    .mapa {
        margin-bottom: -55px !important; 
    }
}

.destaques{
    margin: auto;
    background-color: var(--cor-branca); 
}


.titulo_destaques{
    color: var(--cor-darkblue);
    font-size: 38px;
    font-weight: 400;
    margin-bottom: 20px !important;
}

.titulo_destaques_mobile{
    color: var(--cor-darkblue);
    font-size: 35px;
    font-weight: 400;
    margin-bottom: 30px !important;
}


@media (max-width: 992px){
    .card{
        margin-bottom: 37px;
    }

    .coaches{
        width: 210px !important;
        height: 210px !important;
        border-radius: 100% !important;

    }

    .card-body{
        color: var(--cor-darkblue);
        height: 176px;
        padding: 21px;    
    }

    .card-title{
        font-size: 20px;
        line-height: 17px;
        height: 34px;
    }

    .card-subtitle{
        margin-top: -15px !important;
    }


    .card-text{
        font-size: 13px !important;
        font-weight: 400; 
        height: 100px;   
    }
}

@media (min-width: 993px){
    .card{
        margin-top: 40px;  
    }

    .coaches{
        width: 250px !important;
        height: 250px;
        border-radius: 100% !important;
    }

    .card-body{
        color: var(--cor-darkblue);
    }

    .card-title{
        font-size: 25px;
    }

    .card-subtitle{
        margin-top: -15px !important;
    }

    .card-text{
        margin-top: 0px !important;
        font-size: 17px !important;
        font-weight: 400;
        height: auto !important;
    } 

    #coaches_destaques .card-text{
        margin-top: 0px !important;
        font-size: 17px !important;
        font-weight: 400;
        width: 100% !important;
    }

    #coaches_destaques .card-body{
        width: 100% !important;
    }

}

#coaches_destaques .card{
    margin: auto;
    margin-bottom: 37px;
}

@media (min-width: 992px){
    #people_home{margin-bottom: 150px !important;}
}


@media (min-width: 993px) and (max-width: 1399px){
    #coaches_destaques .card-text{
        margin-top: 0px !important;
        font-size: 17px !important;
        font-weight: 400;
        width: 100% !important;
    }

    #coaches_destaques .card-body{
        width: 100% !important;
    } 
}

.card-body a{text-transform: uppercase;}

@media (min-width: 993px){
    .card_coaches{
        height: 550px !important;
    }
    
    .card_coaches .text_coaches{
        padding-top: 16px !important;
        height: 244px;
    }
}

@media (max-width: 992px){
    .card_coaches{
        height: 460px !important;
    }    

    .card_coaches .text_coaches{
        margin-top: 28px !important;
        height: 192px;
    }

}

@media (min-width: 993px){

    .nutri_img{
        width: 250px !important;
        height: 250px;
        border-radius: 100% !important;
    }

    .card_nutris{
        height: 550px !important;
    }

}

@media (max-width: 992px){

    .nutri_img{
        width: 210px !important;
        height: 210px !important;
        border-radius: 100% !important;

    }

    .card_nutris{
        height: 460px !important;
    }
}

.img_horarios{
    width: 100% !important;
    height: 500px !important;
}

.texto_horarios{
    background-color: var(--cor-darkblue);
    color: lightgray;
    height: 60px;
    align-content: center;
    font-size: 26px;
}

.texto_horarios_mobile{
    background-color: var(--cor-darkblue);
    color: lightgray;
    height: 30px;
    align-content: center;
    font-size: 15px;
}

.img_horarios_mobile{
    width: 100% !important;
    height: 300px !important;
}

.card_precos {
    border: none !important;
    background: transparent;
    box-shadow: none;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card_precos:hover {
    transform: translateY(-5px); 
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3); 
}

.precos_img {
    width: 100%;
    height: 500px;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    object-fit: cover;
}

.card-body-precos {
    margin-top: 10px;
    background-color: var(--cor-darkblue);
    color: lightgray;
    height: 25px;
}

.text_precos {
    font-size: 1rem;
    letter-spacing: 0.5px;
}

@media (max-width: 768px){
    .precos_img {
    width: 280px !important;
    height: 350px;
}

}

#experimentar{
    margin-top: 100px;
}

.img-inscricao{
    width: 250px;
    height: 500px;
}

@media (min-width: 992px) {
  .contorno-texto h2 {
    font-size: 3rem; /* título maior */
  }

  .contorno-texto .list-unstyled.small-text li {
    font-size: 1.25rem; /* itens da lista maiores */
  }

  .contorno-texto .btn {
    font-size: 1.25rem;   /* botão maior */
    padding: 0.75rem 2rem; /* aumentar padding para ficar mais grande */
  }
}

.contorno-texto {
  border: 2px solid rgb(55, 206, 221); 
  padding: 20px;
  border-radius: 10px; 
  box-shadow: 0 4px 8px rgba(55, 206, 221, 0.3); 
}


.hyrox-frame {
    position: relative;
    padding: 5px;
}

.hyrox-frame::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border: 5px solid rgb(55, 206, 221); 
    border-radius: 0px;
    transform: translate(30px, -15px); 
    z-index: 0;
}

.hyrox-card {
    position: relative;
    background-color: var(--cor-darkblue);
    color: white;
    border-radius: 0px;
    z-index: 1;
    padding: 2rem;
    transition: all 0.3s ease;
}

.hyrox-title {
    font-size: 2rem;
    font-weight: bold;
    color: rgb(55, 206, 221);
    margin: 0;
}

.hyrox-text {
    font-size: 1rem;
    color: #f1f1f1;
}

.hyrox-spacer {
    height: 20px;
}

.hyrox-card {
    min-height: 250px !important; 
}


@media (max-width: 767.98px) {

    .hyrox-card {
        padding: 1.2rem;
    }

    .hyrox-title {
        font-size: 1.6rem;
    }

    .hyrox-text {
        font-size: 0.95rem;
    }

    .hyrox-frame::before {
        transform: translate(15px, -10px);
    }

    .hyrox-spacer {
        height: 12px;
    }

    .hyrox-frame{
        margin-left: 20px;
        margin-right: 20px;
    }
}

#servicos_home .card_servicos {
    background-color: transparent !important;  
    box-shadow: none !important;               
    border: none !important;                    
    box-sizing: content-box;                    
}

#servicos_home .card-img-top {
    width: 180px;
    height: 180px;
    object-fit: cover;
    border-radius: 50%;
    border: 10px solid rgb(55, 206, 221);
    box-shadow: 0 4px 15px rgba(55, 206, 221, 0.6);
    margin: 0 auto;
    display: block;
}


#servicos_home .card-title {
    color: var(--cor-darkblue);
    font-weight: 600;
    margin-top: 0.8rem;
    font-size: 1.2rem;
}

#servicos_home .card-text p {
    color: #555;
    font-size: 0.95rem;
    margin-bottom: 0.4rem;
}

#servicos_home .card-body {
    padding: 0.75rem 0;                         
}

#servicos_home .card-text.text_servicos {
    max-width: 280px;  /* ou outro valor que aches adequado */
    margin: 0 auto;    /* centraliza o texto dentro do card */
    text-align: center; /* mantém o texto centrado */
}



/* --- FOOTER --- */

#area_contactos{
    margin-top: 112px !important;
    width: 100%;
    background-color: var(--cor-darkblue);
    color: lightgray;
}

#area_contactos_mobile{
    margin-top: 72px !important;
    width: 100%;
    background-color: var(--cor-darkblue);
    color: lightgray;
}


#area_contactos .contactos{
    margin-top: -10px;
    font-size: 30px;
    font-weight: 300;
}


#morada_footer{
    padding: 0px 30px !important;
}


#area_contactos img{
    width: 60px;
    height: 60px ;
    margin-bottom: 20px;
}

#area_contactos_mobile img{
    width: 35px;
    height: 35px ;
}

.contactos img{
    margin-bottom: 19px;
    margin-top: 30px;
}

.conteudo {
    color: lightgray;
}

.copyright{
    margin: 10px 0px 0px 30px !important;
    padding-bottom: 10px;
}

.copyright a{
    color: lightgray;
    font-size: 12px;
    font-weight: 300;
}

.copyright_mobile a{
    color: lightgray;
    font-size: 11px;
    font-weight: 300;
}

.linha_footer {
  height: 1px;
  background-color:rgb(55, 206, 221); 
  border: none;  
}

.email_footer{
    color: lightgray;
}

.reclamacoes a{
    color: lightgray;
    font-size: 14px;
}

@media (max-width: 650px) {
  #area_contactos_mobile .contactos {
    flex-direction: column !important; 
  }
  
  #area_contactos_mobile .copyright_mobile {
    flex-direction: column !important; 
    text-align: center; 
  }

  #area_contactos_mobile .copyright_mobile .reclamacoes {
    justify-content: center !important; 
  }

  #area_contactos_mobile .contactos > div {
    margin-top: 0px;
    margin-bottom: 0px;
  }

  .contactos img{
    margin-bottom: 5px;
    margin-top: 10px;
  }
}

.instagram{color: lightgray;}

.ctc-analytics {
  background-color: #25D366;
  padding: 14px;
  border-radius: 50%;
  box-shadow: 0px 0px 11px rgba(0,0,0,.5);
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 9999;
  cursor: pointer;
  transition: transform 0.2s ease;
}

.ctc-analytics:hover {
  transform: scale(1.1);
}

.enviar_mobile{
    height: 40px !important;
}

.spotify-float{
  position: fixed !important;
  right: 20px !important;
  bottom: 100px !important; /* aumenta a distância do fundo */
  z-index: 99999 !important;
  width: 68px !important;
  height: 68px !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  box-shadow: 0 6px 18px rgba(0,0,0,0.25);
  z-index: 9999;
  transition: transform .18s ease, box-shadow .18s ease;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  background: transparent; /* já vem do SVG */
}

/* Hover / focus */
.spotify-float:hover,
.spotify-float:focus{
  transform: translateY(-4px) scale(1.03);
  box-shadow: 0 10px 22px rgba(0,0,0,0.30);
  outline: none;
}

/* Opção: efeito "pulse" discreto */
.spotify-float.pulse::after{
  content: "";
  position: absolute;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  left: 0;
  top: 0;
  box-shadow: 0 0 0 rgba(29,185,84,0.35);
  animation: pulse 2.6s infinite;
  pointer-events: none;
}
@keyframes pulse{
  0%   { transform: scale(1); opacity: 1; }
  70%  { transform: scale(1.8); opacity: 0; }
  100% { transform: scale(1.8); opacity: 0; }
}

/* Responsividade: esconder em ecrãs muito pequenos (opcional) */
@media (max-width: 360px){
  .spotify-float { right: 12px; bottom: 12px; width:48px; height:48px; }
  .spotify-float svg { width:24px; height:24px; }
}

.spotify-float svg {
  display: block;
  width: 40px;
  height: 40px;
}

.spotify-float img {
  width: 100%;       /* ocupa 60% do botão */
  height: auto;     /* mantém proporção */
  display: block;   /* remove espaço extra */
  border-radius: 100%;
}