<style>

        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }



  /* 
      TIPOS COM MOVIMENTO MOUSE:
         caixasitens          COM    caixacard          - PADRÃO, FUNDO CINZA, BORDA AZUL
         caixasitenstransp    COM    caixacardtransp    - SEM BORDA, SEM SOMBRA
         caixasitensclean     COM    caixacardclean     - SEM BORDA, COM SOMBRA
         caixasitensazul      COM    caixacardazul      - FUNDO AZUL, TEXTO BRANCO
         caixasitenscinza     COM    caixacardcinza     - FUNDO CINZA

      TIPOS SEM MOVIMENTO MOUSE:
         caixasitensfixa          COM    caixacardfixa          - PADRÃO FUNDO CINZA, BORDA AZUL
         caixasitenstranspfixa    COM    caixacardtranspfixa    - SEM BORDA, SEM SOMBRA
         caixasitenscleanfixa     COM    caixacardcleanfixa     - SEM BORDA, COM SOMBRA
         caixasitensazulfixa      COM    caixacardazulfixa      - FUNDO AZUL, TEXTO BRANCO
         caixasitenscinzafixa     COM    caixacardcinzafixa     - FUNDO CINZA, SEM BORDA

  */








        /* Container que organiza as caixas */
        .caixasitens {
            display: flex;
            flex-wrap: wrap; /* Faz as caixas irem para a linha debaixo em telas pequenas */
            gap: 10px;
            width: 100%;
            justify-content: center;
        }

        /* Estilo base da Caixa (Card) */
        .caixacard {
            background-color: #F9F9F9;
            border: 1px solid #0069B4;
            border-radius: 15px;
            box-shadow: 0 10px 10px rgba(0,0,0,0.07);
            width: 100%;
            max-width: 210px;
            padding: 5px;
            padding-top: 20px;
            text-align: center;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        /* Efeito moderno ao passar o mouse */
        .caixacard:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 30px rgba(0,0,0,0.3);
        }

        /* Título da caixa */
        .caixacard h2 {
            font-size: 1.2rem;
            font-weight: bold;
            margin-bottom: 15px;
            margin-top: 15px;
        }

        /* Texto da caixa */
        .caixacard p {
            font-size: 0.95rem;
            line-height: 1.6;
        }

        /* Adaptação para celular */
        @media (max-width: 768px) {
            .caixasitens {
                gap: 15px;
            }
            .caixacard {
                max-width: 100%; /* Caixa ocupa toda a largura da tela do celular */
            }
        }










   
        /* Container que organiza as caixas TRANSPARENTES */
        .caixasitenstransp {
            display: flex;
            flex-wrap: wrap; /* Faz as caixas irem para a linha debaixo em telas pequenas */
            gap: 1px;
            width: 100%;
            justify-content: center;
        }

        /* Estilo base da Caixa (Card) TRANSPARENTES */
        .caixacardtransp {
            background-color: #FFFFFF;
            border: 0px solid #FFFFFF;
            border-radius: 15px;
            width: 100%;
            max-width: 210px;
            padding: 1px;
            padding-top: 10px;
            text-align: center;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        /* Efeito moderno ao passar o mouse TRANSPARENTES */
        .caixacardtransp:hover {
            transform: translateY(-10px);
        }

        /* Título da caixa TRANSPARENTES */
        .caixacardtransp h2 {
            font-size: 1.2rem;
            font-weight: bold;
            margin-bottom: 15px;
            margin-top: 15px;
        }

        /* Texto da caixa TRANSPARENTES */
        .caixacardtransp p {
            font-size: 0.95rem;
            line-height: 1.6;
        }

        /* Adaptação para celular TRANSPARENTES */
        @media (max-width: 768px) {
            .caixasitenstransp {
                gap: 1px;
            }
            .caixacardtransp {
                max-width: 100%; /* Caixa ocupa toda a largura da tela do celular */
            }
        }













   
        /* Container que organiza as caixas CLEAN */
        .caixasitensclean {
            display: flex;
            flex-wrap: wrap; /* Faz as caixas irem para a linha debaixo em telas pequenas */
            gap: 10px;
            width: 100%;
            justify-content: center;
        }

        /* Estilo base da Caixa (Card) CLEAN */
        .caixacardclean {
            background-color: #FFFFFF;
            border: 0px solid #FFFFFF;
            border-radius: 15px;
            box-shadow: 0 10px 10px rgba(0,0,0,0.07);
            width: 100%;
            max-width: 210px;
            padding: 5px;
            padding-top: 20px;
            text-align: center;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        /* Efeito moderno ao passar o mouse CLEAN */
        .caixacardclean:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 30px rgba(0,0,0,0.3);
        }

        /* Título da caixa CLEAN */
        .caixacardclean h2 {
            font-size: 1.2rem;
            font-weight: bold;
            margin-bottom: 15px;
            margin-top: 15px;
        }

        /* Texto da caixa CLEAN */
        .caixacardclean p {
            font-size: 0.95rem;
            line-height: 1.6;
        }

        /* Adaptação para celular CLEAN */
        @media (max-width: 768px) {
            .caixasitensclean {
                gap: 15px;
            }
            .caixacardclean {
                max-width: 100%; /* Caixa ocupa toda a largura da tela do celular */
            }
        }














        /* Container que organiza as caixas AZUL */
        .caixasitensazul {
            display: flex;
            flex-wrap: wrap; /* Faz as caixas irem para a linha debaixo em telas pequenas */
            gap: 10px;
            width: 100%;
            justify-content: center;
        }

        /* Estilo base da Caixa (Card) AZUL */
        .caixacardazul {
            background-color: #0069B4;
            border: 0px solid #0069B4;
            border-radius: 15px;
            box-shadow: 0 10px 10px rgba(0,0,0,0.07);
            width: 100%;
            max-width: 210px;
            padding: 5px;
            padding-top: 20px;
            text-align: center;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        /* Efeito moderno ao passar o mouse AZUL */
        .caixacardazul:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 30px rgba(0,0,0,0.3);
        }

        /* Título da caixa AZUL */
        .caixacardazul h2 {
            font-size: 1.2rem;
            font-weight: bold;
            color: #FFFFFF;
            margin-bottom: 15px;
            margin-top: 15px;
        }

        /* Texto da caixa AZUL */
        .caixacardazul p {
            font-size: 0.95rem;
            color: #FFFFFF;
            line-height: 1.6;
        }

        /* Adaptação para celular AZUL */
        @media (max-width: 768px) {
            .caixasitensazul {
                gap: 15px;
            }
            .caixacardazul {
                max-width: 100%; /* Caixa ocupa toda a largura da tela do celular */
            }
        }








        /* Container que organiza as caixas CINZA */
        .caixasitenscinza {
            display: flex;
            flex-wrap: wrap; /* Faz as caixas irem para a linha debaixo em telas pequenas */
            gap: 10px;
            width: 100%;
            justify-content: center;
        }

        /* Estilo base da Caixa (Card) CINZA */
        .caixacardcinza {
            background-color: #F9F9F9;
            border: 0px solid #0069B4;
            border-radius: 15px;
            box-shadow: 0 10px 10px rgba(0,0,0,0.07);
            width: 100%;
            max-width: 210px;
            padding: 5px;
            padding-top: 20px;
            text-align: center;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        /* Efeito moderno ao passar o mouse CINZA */
        .caixacardcinza:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 30px rgba(0,0,0,0.3);
        }

        /* Título da caixa CINZA */
        .caixacardcinza h2 {
            font-size: 1.2rem;
            font-weight: bold;
            margin-bottom: 15px;
            margin-top: 15px;
        }

        /* Texto da caixa CINZA */
        .caixacardcinza p {
            font-size: 0.95rem;
            line-height: 1.6;
        }

        /* Adaptação para celular CINZA */
        @media (max-width: 768px) {
            .caixasitenscinza {
                gap: 15px;
            }
            .caixacardcinza {
                max-width: 100%; /* Caixa ocupa toda a largura da tela do celular */
            }
        }












        /* Container que organiza as caixas FIXAS */
        .caixasitensfixa {
            display: flex;
            flex-wrap: wrap; /* Faz as caixas irem para a linha debaixo em telas pequenas */
            gap: 10px;
            width: 100%;
            justify-content: center;
        }

        /* Estilo base da Caixa (Card) FIXA */
        .caixacardfixa {
            background-color: #F9F9F9;
            border: 1px solid #0069B4;
            border-radius: 15px;
            box-shadow: 0 10px 10px rgba(0,0,0,0.07);
            width: 100%;
            max-width: 210px;
            padding: 5px;
            padding-top: 20px;
            text-align: center;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }


        /* Título da caixa FIXA */
        .caixacardfixa h2 {
            font-size: 1.2rem;
            font-weight: bold;
            margin-bottom: 15px;
            margin-top: 15px;
        }

        /* Texto da caixa FIXA */
        .caixacardfixa p {
            font-size: 0.95rem;
            line-height: 1.6;
        }

        /* Adaptação para celular FIXA */
        @media (max-width: 768px) {
            .caixasitensfixa {
                gap: 15px;
            }
            .caixacardfixa {
                max-width: 100%; /* Caixa ocupa toda a largura da tela do celular */
            }
        }










   
        /* Container que organiza as caixas TRANSPARENTES FIXA */
        .caixasitenstranspfixa {
            display: flex;
            flex-wrap: wrap; /* Faz as caixas irem para a linha debaixo em telas pequenas */
            gap: 1px;
            width: 100%;
            justify-content: center;
        }

        /* Estilo base da Caixa (Card) TRANSPARENTES FIXA */
        .caixacardtranspfixa {
            background-color: #FFFFFF;
            border: 0px solid #FFFFFF;
            border-radius: 15px;
            width: 100%;
            max-width: 210px;
            padding: 1px;
            padding-top: 10px;
            text-align: center;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }


        /* Título da caixa TRANSPARENTES FIXA */
        .caixacardtranspfixa h2 {
            font-size: 1.2rem;
            font-weight: bold;
            margin-bottom: 15px;
            margin-top: 15px;
        }

        /* Texto da caixa TRANSPARENTES FIXA */
        .caixacardtranspfixa p {
            font-size: 0.95rem;
            line-height: 1.6;
        }

        /* Adaptação para celular TRANSPARENTES FIXA */
        @media (max-width: 768px) {
            .caixasitenstranspfixa {
                gap: 1px;
            }
            .caixacardtranspfixa {
                max-width: 100%; /* Caixa ocupa toda a largura da tela do celular */
            }
        }













   
        /* Container que organiza as caixas CLEAN FIXA */
        .caixasitenscleanfixa {
            display: flex;
            flex-wrap: wrap; /* Faz as caixas irem para a linha debaixo em telas pequenas */
            gap: 10px;
            width: 100%;
            justify-content: center;
        }

        /* Estilo base da Caixa (Card) CLEAN FIXA */
        .caixacardcleanfixa {
            background-color: #FFFFFF;
            border: 0px solid #FFFFFF;
            border-radius: 15px;
            box-shadow: 0 10px 10px rgba(0,0,0,0.07);
            width: 100%;
            max-width: 210px;
            padding: 5px;
            padding-top: 20px;
            text-align: center;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }


        /* Título da caixa CLEAN FIXA */
        .caixacardcleanfixa h2 {
            font-size: 1.2rem;
            font-weight: bold;
            margin-bottom: 15px;
            margin-top: 15px;
        }

        /* Texto da caixa CLEAN FIXA */
        .caixacardcleanfixa p {
            font-size: 0.95rem;
            line-height: 1.6;
        }

        /* Adaptação para celular CLEAN FIXA */
        @media (max-width: 768px) {
            .caixasitenscleanfixa {
                gap: 15px;
            }
            .caixacardcleanfixa {
                max-width: 100%; /* Caixa ocupa toda a largura da tela do celular */
            }
        }














        /* Container que organiza as caixas AZUL FIXA */
        .caixasitensazulfixa {
            display: flex;
            flex-wrap: wrap; /* Faz as caixas irem para a linha debaixo em telas pequenas */
            gap: 10px;
            width: 100%;
            justify-content: center;
        }

        /* Estilo base da Caixa (Card) AZUL FIXA */
        .caixacardazulfixa {
            background-color: #0069B4;
            border: 0px solid #0069B4;
            border-radius: 15px;
            box-shadow: 0 10px 10px rgba(0,0,0,0.07);
            width: 100%;
            max-width: 210px;
            padding: 5px;
            padding-top: 20px;
            text-align: center;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }


        /* Título da caixa AZUL FIXA */
        .caixacardazulfixa h2 {
            font-size: 1.2rem;
            font-weight: bold;
            color: #FFFFFF;
            margin-bottom: 15px;
            margin-top: 15px;
        }

        /* Texto da caixa AZUL FIXA */
        .caixacardazulfixa p {
            font-size: 0.95rem;
            color: #FFFFFF;
            line-height: 1.6;
        }

        /* Adaptação para celular AZUL FIXA */
        @media (max-width: 768px) {
            .caixasitensazulfixa {
                gap: 15px;
            }
            .caixacardazulfixa {
                max-width: 100%; /* Caixa ocupa toda a largura da tela do celular */
            }
        }








        /* Container que organiza as caixas CINZA FIXA */
        .caixasitenscinzafixa {
            display: flex;
            flex-wrap: wrap; /* Faz as caixas irem para a linha debaixo em telas pequenas */
            gap: 10px;
            width: 100%;
            justify-content: center;
        }

        /* Estilo base da Caixa (Card) CINZA FIXA */
        .caixacardcinzafixa {
            background-color: #F9F9F9;
            border: 0px solid #0069B4;
            border-radius: 15px;
            box-shadow: 0 10px 10px rgba(0,0,0,0.07);
            width: 100%;
            max-width: 210px;
            padding: 5px;
            padding-top: 20px;
            text-align: center;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }


        /* Título da caixa CINZA FIXA */
        .caixacardcinzafixa h2 {
            font-size: 1.2rem;
            font-weight: bold;
            margin-bottom: 15px;
            margin-top: 15px;
        }

        /* Texto da caixa CINZA FIXA */
        .caixacardcinzafixa p {
            font-size: 0.95rem;
            line-height: 1.6;
        }

        /* Adaptação para celular CINZA FIXA */
        @media (max-width: 768px) {
            .caixasitenscinzafixa {
                gap: 15px;
            }
            .caixacardcinzafixo {
                max-width: 100%; /* Caixa ocupa toda a largura da tela do celular */
            }
        }












</style>