@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Quicksand&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat+Alternates&display=swap');
@font-face{font-family:Verdana;src:url('../../font/VERDANAB.TTF');}
@font-face{font-family:Gothic;src:url('../../font/GOTHIC.TTF');}

.FontGhotic{font-family:'Gothic',sans-serif!important;}
.FontVerdana{font-family:'Verdana',sans-serif!important;}
.FontMontSerrat{font-family:'Montserrat',sans-serif!important;}
.FontQuicksand{font-family:'Quicksand',sans-serif!important;}

/*
  A função clamp() recebe três valores:

  clamp(valor-mínimo, valor-fluido, valor-máximo)

  Exemplo:

  font-size: clamp(1rem, 2vw + 0.5rem, 2rem);

  ➡️ Isso significa:

  Nunca menor que 1rem,

  Aumenta de forma fluida com a largura da tela (2vw + 0.5rem),

  E nunca passa de 2rem.

   ============================
   HIERARQUIA DE TÍTULOS
   ============================ 

  h1 – título principal 

  h1 {
    font-size: clamp(2rem, 4vw + 1rem, 3.5rem);
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 0.5em;
  }

  h2 – subtítulo ou seção principal

  h2 {
    font-size: clamp(1.5rem, 2.5vw + 0.5rem, 2.5rem);
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 0.5em;
  }

  h3 – subtítulo menor 

  h3 {
    font-size: clamp(1.25rem, 1.8vw + 0.4rem, 1.75rem);
    font-weight: 500;
    line-height: 1.4;
    margin-bottom: 0.5em;
  }

  ============================
   TEXTOS
  ============================

  Parágrafos
  p {
    font-size: clamp(1rem, 1vw + 0.3rem, 1.125rem);
    line-height: 1.7;
    margin-bottom: 1em;
    color: #444;
  }

  Span com mesmo padrão do p

  span {
    font-size: clamp(1rem, 1vw + 0.3rem, 1.125rem);
    line-height: 1.7;
    color: inherit;
  }

  ============================
   AJUSTES OPCIONAIS DE LEITURA
  ============================

  Aumenta ligeiramente a fonte e espaçamento em telas grandes

  @media (min-width: 1200px) {
    body {
      line-height: 1.75;
    }

    p, span {
      max-width: 70ch; Limita o comprimento para leitura confortável 
    }
  }
*/

.TextShadow{color: #96989A;}

.BoxShadow{box-shadow: 0 5px 5px 5px #888888;}

header .navbar-dark{background-color: #111111!important;}
header div .nav-item .nav-link{color: #F5F5F5!important;}
header div .nav-item .nav-link:hover{color: #FFFFFF!important;}
.dropdown-item:active{background-color: #6C757D!important;}

/*Cor referente a logo*/
.text-logo{color:#00AFEF!important;}
.bkg-logo{background-color:#00AFEF!important;}
.btn-logo{background-color:#00AFEF!important;border-color:#00AFEF!important;color:#ffffff!important;}
.btn-outline-logo{color:#00AFEF!important;border-color:#00AFEF!important;}
.btn-outline-logo:hover{background-color:#00AFEF!important;color:#ffffff!important;}
.border-logo{border-color:#00AFEF!important}
/*Fim*/

footer{background-color: #000000}
/* First Mobile*/


#btnLogin{max-width: 150px;}

section{padding-top: 50px;padding-bottom: 40px;}

footer{padding-top: 30px;}
footer h2{color:#00AFEF;font-size:12pt;margin-top:20px;}
footer i{color:red!important;}
footer p{font-size: 10pt;margin-bottom: 0px;}
footer .fab{font-size:20px!important;color: #FFFFFF!important}
footer #cnpj{margin-top: 40px;}
footer #cnpj p{font-size: 8pt;color: white;}

body{
  font-family: sans-serif;
}

.btnFloat{
  position: fixed;
  bottom:10px;
  right:10px;
  z-index: 9999; /* Corrigido: Valor alto para garantir que fique sobre todos os elementos */
}

.btnFloat button{
  cursor: pointer;
  width: 48px;
  height: 48px;
  border-radius: 30px;
  background-color: #00AFEF;
  border: none;
  box-shadow: 0 1px 5px rgba(0,0,0,.4);
  font-size: 24px;
  color: white;
    
  -webkit-transition: .2s ease-out;
  -moz-transition: .2s ease-out;
  transition: .2s ease-out;
}

.btnFloat button:focus{
  outline: none;
}

.btnFloat button.main{
  position: absolute;
  width: 60px;
  height: 60px;
  border-radius: 30px;
  background-color: #00AFEF;
  right: 0;
  bottom: 0;
  z-index: 20;
}

/*.btnFloat button.main:before{
  content: '⏚';
}*/

.btnFloat ul{
  position:absolute;
  bottom: 0;
  right: 0;
  padding:0;
  padding-right:5px;
  margin:0;
  list-style:none;
  z-index:10;
  
  -webkit-transition: .2s ease-out;
  -moz-transition: .2s ease-out;
  transition: .2s ease-out;
}

.btnFloat ul li{
  display: flex;
  justify-content: flex-start;
  position: relative;
  margin-bottom: -10%;
  opacity: 0;
  
  -webkit-transition: .3s ease-out;
  -moz-transition: .3s ease-out;
  transition: .3s ease-out;
}

.btnFloat ul li label{
  margin-right:10px;
  white-space: nowrap;
  display: block;
  margin-top: 10px;
  padding: 5px 8px;
  background-color: white;
  box-shadow: 0 1px 3px rgba(0,0,0,.2);
  border-radius:3px;
  height: 18px;
  font-size: 16px;
  pointer-events: none;
  opacity:0;
  
  -webkit-transition: .2s ease-out;
  -moz-transition: .2s ease-out;
  transition: .2s ease-out;
}

.btnFloat.show button.main,
.btnFloat.show button.main{
  outline: none;
  background-color: #00AFEF;
  box-shadow: 0 3px 8px rgba(0,0,0,.5);
 }
 
/*.btnFloat.show button.main:before,
.btnFloat.show button.main:before{
  content: '↑';
}*/

.btnFloat.show button.main + ul,
.btnFloat.show button.main + ul{
  bottom: 70px;
}

.btnFloat.show button.main + ul li,
.btnFloat.show button.main + ul li{
  margin-bottom: 10px;
  opacity: 1;
}

.btnFloat.show button.main + ul li:hover label,
.btnFloat.show button.main + ul li:hover label{
  opacity: 1;
}
/**/

@media only screen and (min-width: 380px){
	footer #cnpj p{font-size: 9pt;}
}
@media only screen and (min-width: 530px){
	footer #cnpj p{font-size: 10pt;}
}
@media only screen and (min-width: 768px) and (max-width: 992px) {
	header a{font-size: 8pt!important;}
}
@media only screen and (min-width: 768px){
	.dropdown-item:hover{color: #FFFFFF!important;background-color: #6C757D!important;}
	section{padding-top: 100px;padding-bottom: 90px;}
	footer a:hover{text-decoration: unset;}
	footer{padding-top: 60px;}
	footer h2{font-size: 14pt;}
	footer p{font-size: 12pt;}
	footer #cnpj p{font-size: 11pt;}
}