/* Serviços */
.grid_servicos {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
    margin-bottom: 80px;
}

.card_servico{
    box-shadow: 0 0 8px 4px rgba(0,0,0,.22);
    background:#FFD015;
    display:grid;
    grid-template-rows: 1fr;      /* garante 1 linha */
    align-items: stretch;
  }

  /* ímpares: imagem esquerda (360) + conteúdo */
  .card_servico:nth-child(odd){
    grid-template-columns: 360px auto;
  }

  /* pares: conteúdo + imagem direita (360) */
  .card_servico:nth-child(even){
    grid-template-columns: auto 360px;
  }

  /* TRAVA os dois na mesma linha */
  .card_servico .img_servico,
  .card_servico .content_servico{
    grid-row: 1;
  }

  /* colunas padrão (ímpares) */
  .card_servico .img_servico{ grid-column: 1; }
  .card_servico .content_servico{ grid-column: 2; }

  /* pares invertidos */
  .card_servico:nth-child(even) .img_servico{ grid-column: 2; }
  .card_servico:nth-child(even) .content_servico{ grid-column: 1; }

  /* (opcional, mas recomendado) faz a imagem preencher certinho o bloco */
  .img_servico img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  .content_servico{
    padding: 20px;
    display:flex;
    justify-content:center;
    align-items:center;
    text-transform:uppercase;
  }

.content_servico h3 {
    color: #2F48E3;
    font: 700 1.5rem/1.25 'Poppins', sans-serif;
    text-align: center;
}

.content_servico p {
    color: #2E2E2E;
    font: 400 1.125rem/1.25 'Montserrat', sans-serif;
    text-align: center;
}

.descricao_servico {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

/* Funcionamento */
.funcionamento {
    background: #3242A8;
    padding-bottom: 80px;
    isolation: isolate;
    position: relative;
}



.funcionamento::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("../img/hatch.webp");
    background-repeat: repeat;
    background-size: 1024px auto;
    opacity: .08;
    z-index: 0;
    pointer-events: none;
}

.title_2 .title_2_content h2 {
    color: #FFD015;
    text-align: center;
    margin: 0;
}

.grid_funcionamento {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
    margin-bottom: 60px;
}

.card_funcionamento {
    display: grid;
    grid-template-columns: 104px auto;
    align-items: center;
    justify-self: center;
    gap: 20px;
    width: 500px;
}

.order_funcionamento {
    color: #FFD015;
    font: 700 2.5rem/1.25 'Poppins', sans-serif;
    font-style: normal;
    display: flex;
    height: 104px;
    width: 104px;
    justify-content: center;
    align-items: center;
    border: 2px solid #FFD015;
    border-radius: 50%;
}

.content_funcionamento {
    color: #fff;
    font: 400 1.25rem/1.25 'Montserrat', sans-serif;
    text-align: center;
}

/* Benefícios */
.beneficios {
    position: relative;
    padding-bottom: 80px;
    overflow: hidden;
}
.beneficios__bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}
.beneficios .container {
    position: relative;
    z-index: 1;
}

.grid_beneficios {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
    margin-bottom: 48px;
}

.card_beneficio {
    background: #2F48E3;
    padding: 12px 12px 20px 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.img_beneficio {
    width: 100%;
    background: #FFD015;
    display: grid;
    place-items: center;
    justify-content: center;
    align-items: center;
}

.img_beneficio img {
    width: 128px;
    height: 128px;
    object-fit: contain;
}

.nome_beneficio {
    color: #FFD015;
    font: 600 1.25rem/1.25 'Montserrat', sans-serif;
    text-align: center;
    margin-top: 32px;
    margin-bottom: 20px;
    text-wrap: balance;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
}

/* Depoimentos */
.depoimentos {
    margin-bottom: 80px;
}

/* Contato */
.contato {
    background: #FFD015;
    padding-bottom: 80px;
}

.form_contato {
    max-width: 600px;
    margin: 0 auto;
}

.form {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.form_group {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.form_group label {
    color: #2E2E2E;
    font: 700 1.125rem/1.25 'Roboto', sans-serif;
    text-align: left;
}

.form_group input,
.form_group textarea {
    padding: 12px;
    border: 1px solid #2E2E2E;
    border-radius: 8px;
    font: 400 1.125rem/1.25 'Montserrat', sans-serif;
    color: #2E2E2E;
}

.div_btt {
    display: flex;
    gap: 16px;
    justify-content: center;
}

.div_btt i {
    font-size: 1.5rem;
}

@media (max-width: 1200px) {}

@media (max-width: 800px) {

    .title_1,
    .title_2 {
        margin-top: 40px;
        margin-bottom: 40px;
    }

    .title_1 h2,
    .title_2 h2 {
        font-size: 2rem;
    }

    .tag_title span,
    .tag_title_2 span {
        font-size: 1rem;
        padding: 8px 16px;
    }

    .grid_beneficios {
        grid-template-columns: 1fr 1fr;
    }

    .grid_servicos {
        grid-template-columns: 1fr;
    }
      /* ímpares: imagem esquerda (360) + conteúdo */
    .card_servico:nth-child(odd){
        grid-template-columns: 280px auto;
    }

    /* pares: conteúdo + imagem direita (360) */
    .card_servico:nth-child(even){
        grid-template-columns: auto 280px;
    }
}

@media (max-width: 500px) {
    .banner {
        position: relative;
        isolation: isolate;
    }

    .banner::before {
        content: "";
        position: absolute;
        inset: 0;
        background: rgba(0, 0, 0, 0.2);
        z-index: 0;
        pointer-events: none;
    }

    .content_banner h2 {
        font-size: 2.5rem;
        color: #FFD015;

    }

    .content_banner p {
        font-size: 1.25rem;
        color: #ccc;
        font-weight: 400;

    }

    .grid_banner {
        align-items: center;
    }

    .content_banner {
        text-align: center;
        background: rgba(0, 0, 0, 0.42);
        padding: 40px;
    }

    .grid_banner,
    .content_banner {
        position: relative;
        z-index: 1;
    }

    .botao,
    .btt_t2 {
        padding: 10px 20px;
    }

    .grid_servicos {
        grid-template-columns: 1fr;
        justify-items: center;
    }

    .card_servico {
        max-width: 360px;
    }

    .card_funcionamento {
        max-width: 380px;
        width: 100%;
    }

    .title_1 h2,
    .title_2 h2 {
        font-size: 1.5rem;
    }

    .grid_beneficios {
        grid-template-columns: 1fr;
    }

          /* ímpares: imagem esquerda (360) + conteúdo */
          .card_servico:nth-child(odd){
            grid-template-columns: 150px auto;
        }

        /* pares: conteúdo + imagem direita (360) */
        .card_servico:nth-child(even){
            grid-template-columns: auto 150px;
        }

    .content_funcionamento {
        font-size: 1.125rem;
    }

    .order_funcionamento {
        font-size: 1.75rem;
    }

    .content_servico {
        grid-template-rows: 60px auto;
    }

    .content_servico h3 {
        font-size: 1rem;
    }

    .nome_beneficio {
        font-size: 1.125rem;
    }

    .depoimentos {
        margin-bottom: 40px;
    }
}