@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Raleway:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
:root{
    --azul: #063e74;
    --branco: #FFF;
    --cinza-escuro:#333;
}

*{box-sizing: border-box;}
a{color: inherit;text-decoration: none;}
body{margin:0px;padding:0px;font-family:"Roboto", sans-serif;font-size: 18px;}
img{max-width:100%;margin-bottom:-3px;}
.roboto{font-family:"Roboto",sans-serif;font-optical-sizing:auto;}
.montserrat{font-family:"Montserrat", sans-serif;font-style: normal;}
header{background-color:#FFF;padding: 15px 10px;text-align: center;}
.main-img-wrp{display:flex;padding:0px 60px;align-items:center;height:500px;justify-content: space-between;gap:20px;background-color:#063e74;}
.main-img-label{padding: 20px 0px;color: #FFF;margin-left: 40px;}
.main-img{margin-right: -60px;background-image:url('/franquias/images/franquia-baressp.jpg');background-size: cover;background-repeat:no-repeat;height:inherit;width: 600px;max-width: 100%;}
.txt-center{text-align: center;}
.main-img-label h1{font-size: 50px;font-family:"Montserrat", sans-serif; font-weight: 900;margin: 0px 0px 10px;}
.main-img-label p{margin: 0px;font-size: 20px;}
.wd-1200{margin: auto;width: 1200px;max-width: 100%;}
.bloco1{padding: 20px 15px;display: flex;justify-content:center;gap: 40px;align-items: center;}
.bloco1 div:nth-child(1){width: 700px;}
.bloco1 div:nth-child(2){width: 300px;}
.bloco2{padding: 20px 15px;display: flex;justify-content:center;gap: 40px;align-items: center;}
.bloco2 div:nth-child(1){width: 300px;}
.bloco2 div:nth-child(2){width: 700px;}
.bloco3{padding: 20px 15px;display: flex;justify-content:center;gap: 40px;align-items: center;}
.bloco3 div:nth-child(1){width: 600px;}
.bloco3 div:nth-child(2){width: 400px;}
.portifolio-box-wrp{list-style: none;margin: 0px;padding: 0px;display: flex;gap: 15px; justify-content: center;}
.portifolio-box{padding: 10px 6px;border-radius: 10px; border: solid 1px #CCC;width: 300px;}
.portifolio-box-img{text-align: center;}
.portifolio-box h3{text-align: center;font-size: 20px;color: var(--azul);font-family:"Montserrat", sans-serif;}
.portifolio-box p{margin: 8px 0px 2px;}
.missao-box-wrp{list-style:none;margin:0px;padding:0px; display: flex;justify-content: center; gap: 25px;}
.missao-box-wrp li{width: 300px; border-radius: 10px;border: solid 1px #CCC;padding: 12px 10px;}
.missao-box-wrp h3{color: var(--azul);text-align: center;}
.checker-list-none{list-style: none;margin: 0px;padding: 0px;}
.checker-list-none li{margin-bottom: 15px;}

/*passos*/
.container-passos {
      display: flex;
      flex-wrap: wrap;
      gap: 20px;
      justify-content: center;
    }

    .box-passos {
      background: #fff;
      padding: 20px;
      border: 1px solid #ddd;
      flex: 1 1 calc(25% - 20px); /* 4 colunas no desktop */
      box-shadow: 0 0 5px rgba(0,0,0,0.1);
      position: relative;
    }

    /* Efeito cantos recortados */
    .box-passos::before, .box-passos::after {
      content: "";
      position: absolute;
      width: 20px;
      height: 20px;
      border: 2px solid #555;
    }

    .box-passos::before {
      top: -10px; left: -10px;
      border-right: none;
      border-bottom: none;
    }

    .box-passos::after {
      bottom: -10px; right: -10px;
      border-left: none;
      border-top: none;
    }

    .numero {
      font-size: 24px;
      font-weight: bold;
      margin-bottom: 10px;
    }

    .titulo-passo {
      font-size: 16px;
      font-weight: bold;
      margin-bottom: 10px;
      font-family:"Montserrat", sans-serif;
      font-weight: 800;
    }

    .texto-passos {
      font-size: 14px;
      line-height: 1.4;
    }
/*fim passos*/

/*timeline*/
.timeline { position: relative;   display: flex;justify-content: space-between; gap: 40px;  margin: 0 auto;      max-width: 1200px; }
    .timeline::before {
        content: '';
        position: absolute;
        top: 50%;
        left: 0;
        width: 100%;
        height: 4px;
        background: #ccc;
        transform: translateY(-50%);
        z-index: 0;
    }
    .timeline-item { position: relative; width: 180px; text-align: center; }
    .circle{ position: relative; z-index: 1; width: 70px; height: 70px; margin: 0 auto;  border-radius: 50%;
        color: #fff; font-weight: bold;   font-size: 18px;  display: flex;   justify-content: center;
        align-items: center;   box-shadow: 0 0 10px rgba(0,0,0,0.2);}
    .content{
        background: #fff;padding:15px;border-radius:10px; box-shadow:0 2px 8px rgba(0,0,0,0.15);
        font-size:14px; line-height:1.4em;  position:absolute;  width:220px;   left:50%;transform:translateX(-50%);
        color: #333;
    }
    .main-timeline{background-color:#063e74;padding:25px 0px 200px;}
    /* Alternância cima e baixo */
    .timeline-item:nth-child(odd) .content{bottom:100px;}
    .timeline-item:nth-child(even) .content{top:100px;}

    /* Cores dos círculos */
    .timeline-item:nth-child(1) .circle {background: #5bc0de; }
    .timeline-item:nth-child(2) .circle {background: #f0ad4e; }
    .timeline-item:nth-child(3) .circle {background: #5cb85c; }
    .timeline-item:nth-child(4) .circle {background: #337ab7; }
    .timeline-item:nth-child(5) .circle {background: #d9534f; }
    .timeline-item:nth-child(6) .circle {background: #007bff; }
    .title-timeline{margin-bottom:180px;}
    /*fim timeline*/
    
    .numeros-box-wrp{list-style: none;margin: 0px;padding: 0px; display: flex;flex-wrap: wrap;justify-content: center;gap: 50px;}
    .numeros-box-wrp li{width:250px;text-align: center;}
    .numeros-box-wrp li img{width:180px;}
    .numeros-box2-wrp{width:1200px;max-width:90%;margin:0px auto;display:flex;justify-content:center;list-style: none;padding: 0px;flex-wrap: wrap;}
    .numeros-box2-wrp li{padding:35px 15px;width: 240px;color: #FFF;border: solid 1px #666;}
    .numeros-box2-wrp h3{font-size:40px;font-weight: 900;font-family:"Montserrat", sans-serif;text-align: center;margin: 0px 0px 12px;}
    .numeros-box2-wrp p{font-size:14px;text-align: center;margin: 5px 0px;}
    .numeros-box2-wrp li:nth-child(odd){background-color:#333;}
    .numeros-box2-wrp li:nth-child(even){background-color:#a90000;}

footer{width: 100%;background-color: #333;}
.footer-base{display: flex;justify-content: space-between;width: 1100px;color: #FFF;max-width: 95%;padding: 25px 0px;margin: 20px auto 0px;}
.footer-logo{width: 220px;}
.footer-logo img{filter: brightness(100);}
.footer-items{width:500px;font-size: 14px;max-width: 99%;}
.footer-elm-item{display: flex;flex-wrap: wrap;gap:5px 20px;}
.footer-elm-item  div{padding: 0px 0px 8px;}
.footer-base h4{font-size: 22px;font-weight: 800;font-family: "Raleway", serif;margin: 0px 0px 12px;}
.footer-redes{text-align: center;}
.footer-redes img{margin: 0px 8px;}
.footer-parceiros{padding: 18px;border-top: solid 1px #FFF;text-align: center;display: flex;flex-wrap: wrap;gap: 5px 12px;justify-content: center;}
.footer-parceiros img{width: 120px;}
.footer-end{background-color: var(--azul);color: #FFF;font-size: 12px;text-align: center;padding: 5px 12px;}

.contato-list-wrp{list-style: none;margin: 0px;padding:0px; display: flex; justify-content: center;align-items: center;gap: 20px;}
.contato-list-wrp li{overflow: hidden;width:90px;height: 90px;overflow: hidden;background-color: #FFF;cursor: pointer;border-radius: 99%;padding: 10px;display: flex;justify-content: center;align-items: center;text-align: center;}
.contato-list-wrp img{width: 80%;}

@media(max-width: 600px){
    .numeros-box2-wrp li{width: 45%;}
    .numeros-box2-wrp h3{font-size: 30px;}
    .bloco1,.bloco2,.bloco3,.portifolio-box-wrp,.missao-box-wrp{flex-direction: column;}
    .bloco1 div:nth-child(1),.bloco1 div:nth-child(2){width: 99%;}
    .bloco2 div:nth-child(1),.bloco2 div:nth-child(2){width: 99%;}
    .bloco3 div:nth-child(1),.bloco3 div:nth-child(2){width: 99%;}
    .portifolio-box-wrp{align-items: center;}
    .portifolio-box{width:90%;}
    .missao-box-wrp{align-items:center;}
    .missao-box-wrp li{width:90%;}
 
    .main-img-wrp{flex-direction: column; padding:40px 0px 0px;}
    .main-img-label{padding: 0px 12px;color: #FFF;margin-left: 0px;text-align: center;}
    .main-img{margin-right: 0px;}
    .main-timeline{background-color:#063e74;padding:25px 0px 15px;}
    .title-timeline{margin-bottom:25px;}
     .timeline{
        flex-direction:column;
        align-items:center;
        padding-bottom:80px;
        background-image:url('/franquias/images/bg-strike.jpg');
        background-repeat:repeat-y;
        background-position:center center;
        background-size:5px;
    }
    .timeline::before{display:none;}
    .timeline-item{width:100%;max-width:350px;margin-bottom:0px;
        text-align:center;position:relative;
    }

    .circle {
        margin: 0 auto -9px auto; /* ano centralizado em cima */
    }

    .content {
        position: relative !important; /* remove absolute */
        width: auto !important;
        left: auto !important;
        transform: none !important;
        top: auto !important;
        bottom: auto !important;
        margin: 0 auto;
    }

    .footer-base{flex-direction: column;}

.footer-logo{width: 100%;text-align: center;}
.footer-logo img{width:160px;height:auto;}
.footer-redes{padding-top: 25px;}
.footer-parceiros{gap:2px 5px}
.footer-parceiros img{width:100px;}
.container-passos{flex-direction: column; align-items: center;}
.box-passos {width: 90%;}
    
}