.text-center {
    text-align: center;
    }
    
    .wrapper-text-blue{
        display: flex; flex-direction: column; gap: 8px; margin-bottom: 6px; max-width: 50%;
    }
    
    .h2-blue-large{
        font-size: 40px; margin: 0; color: #024248; font-weight: 600; line-height: 110%;
    }

    body h2, h3, h4, h5, h6 {
        font-family: "Georama", serif;
        font-weight: 700;
        color: #024248;
        line-height: 110%;
        font-weight: 600;
    }

    .citizen-server-block h2, h3, h4, h5, h6 {
        font-family: "Georama", serif;
        font-weight: 700;
        color: white;
        line-height: 110%;
        font-weight: 600;
    }

    .citizen-server-block p {
        font-weight: 400;
        color: white;
        line-height: 150%;
        font-size: 23px;
    }

    p {
        font-weight: 400;
        color: #434A54;
        line-height: 150%;
        font-size: 16px;
    }

    .text-center p {
        color: white;
    }

    a {
        color: #007D7A;
    }
    
    
    .card-horizontal-reverse-container img.card {
        height: 100%;
    }
    
    .img-card {
        width: 100%;
        border-radius: 12px;
        background-image: url("../img/Image.png");
        overflow: hidden;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        min-height: 200px;
    }
    
    .wrapper-text-card{
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        gap: 8px;
        height: auto;
    }
    
    .h2-card {
        font-size: 18px;
        font-weight: 600;
        margin: 0;
        line-height: 120%;
    }
    
    .p-card{
        font-size: 16px;
        margin: 0;
        display: flex;
        flex-direction: column;
    }  
    
    .wrapper-button{
        display: flex;
        justify-content: right;
        gap: 8px;
    }
    
    .wrapper-button-left {
        display: flex;
        justify-content: left;
        gap: 8px;
        flex-direction: column;
    }
    
    .wrapper-button-right {
        display: flex;
        justify-content: right;
        gap: 8px;
    }
    
    .wrapper-button-center {
        display: flex;
        justify-content: center;
        gap: 8px;
    }
    .white{
        color: white;
    }

    .white p{
        color: white;
    }
    
    /*------- tipos de cards --------*/
    
    .card-primary {
        background-color: #ffff;
      display: flex;
        flex-direction: column;
      padding: 16px;
      border-radius: 20px;
      box-shadow: inset 0 0 0 1px #DEE3ED;
      gap: 16px;
      color: #434A54;
      height: 100%;
    }
    
    .card-secondary{
        background-color: #007D7A;
        color: white;
        border-radius: 20px;
        padding: 24px;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 16px;
        justify-content: space-between;
        height: auto;
    }
    
    .card-secondary .wrapper-text-card{
        align-items: center;
    }
    
    .card-terciary{
        background-color: #024248;
        border-radius: 20px;
        padding: 24px;
        display: flex;
        flex-direction: column;
        gap: 16px;
        color: white;
        justify-content: space-between;
    }

    .card-terciary p{
        color: white;
    }
    
    .hozintal {
        display: flex;
        gap: 16px;
        align-items: center;
    }
    
    .center{
        display: flex;
        justify-content: center;
        align-items: center;
        color: white;
        text-align: center;
    }
    
    
    /* ----------------- card bg imagem */
    
    .card-bgimage {
        background-image: url("../img/Image.png");
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        border-radius: 20px;
        width: 100%;
        height: 100%;
        padding: 16px;
        display: flex;
        align-items: end;
        overflow: hidden;
        display: flex;
        gap: 20px; /* espaçamento entre cards */
        align-items: stretch;
        position: relative;
    }
    
    .wrapper-text-card-bgimage{
        margin-top: 120px;
        background-color: white;
        padding: 16px;
        border-radius: 12px;
        height: auto;
        display: flex;
        justify-content: space-between;
        flex-direction: column;    
    }

    .wrapper-text-card_bg{
        display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 10px;
    align-items: flex-start;
    }
    
    
    /*------ tipos de cards ------*/
    .cards-gri-1 {
        display: grid;
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .cards-gri-2 {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
        align-items: stretch;
        justify-items: stretch;
    }
    
    .cards-gri-3 {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 16px;
    }
    
    .cards-gri-4 {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 16px;
    }
    
    
    /* Horizontal Card Layout */
    .card-horizontal-container {
        display: grid;
        grid-template-columns: 1fr 1fr;
        background-color: #ffff;
        padding: 16px;
        border-radius: 20px;
        box-shadow: inset 0 0 0 1px #DEE3ED;
        gap: 16px;
        color: #434A54;
        height: 100%;
    }
    
    /* Horizontal Card Reverse Layout - NOVO */
    .card-horizontal-reverse-container {
        display: grid;
        grid-template-columns: 70% 30%;
        padding: 16px;
        gap: 16px;
        color: #AFF0ED;
        height: 100%;
        position: relative;
        border-bottom: #006969 0.4px solid;
        padding-bottom: 20px;
        min-height: 300px;
    }

    .card-horizontal-reverse-container p{
        font-size: 18px;
        color: #F5F7FA;
    }

    .card-horizontal-reverse-container h2{
        font-size: 24px;
        color: #AFF0ED;
    }

    .card-horizontal-reverse-container::before {
        content: '';
        position: absolute;
        left: 0;
        top: 20%;
        height: 60%;
        width: 2px;
        background-color: #006969;
    }
    
    .card-horizontal-reverse-image-container {
        order: 2;
    }
    
    .wrapper-text-card-horizontal-reverse {
        display: grid;
        grid-template-columns: 1fr 1fr;
        order: 1;
        align-items: center;
    }

    .white {
        color: #D6F9F8;
    }
    
    .img-card-horizontal {
        width: 40%;
        background-size: cover;
        background-position: center;
        min-height: 250px;
    }
    
    .wrapper-text-card-horizontal {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    
    
    
    
    @media (max-width: 768px){
        .wrapper-text-blue{
            max-width: 85%;
        }
    
        .h2-blue-large{
            font-size: 32px; 
        }
    
        .cards-gri-2 {
            display: grid;
            grid-template-columns: 1fr;
            gap: 16px;
        }
        
        .cards-gri-3 {
            display: grid;
            grid-template-columns: 1fr;
            gap: 16px;
        }
        
        .cards-gri-4 {
            display: grid;
            grid-template-columns: 1fr;
            gap: 16px;
        }
    
        .card-horizontal-container {
            grid-template-columns: 1fr;
        }
        
        /* Media query para o novo card horizontal reverse */
        .card-horizontal-reverse-container {
            grid-template-columns: 1fr;
            grid-template-columns: 1fr;
            gap: 16px;
        }
        
        .card-horizontal-reverse-image-container {
            order: 1;
        }
        
        .wrapper-text-card-horizontal-reverse {
            order: 2;
            grid-template-columns: 1fr;
        }
        
        .img-card-horizontal {
            width: 100%;
            min-height: 200px;
        }
        
        .wrapper-text-card-horizontal {
            width: 100%;
        }
    }