body {
    font-family: 'Plus Jakarta Sans', sans-serif;
}

font-mono {
    font-family: 'JetBrains Mono', monospace;
}

/* Padrão de fundo em grade cibernética */
.bg-grid-pattern {
    background-size: 40px 40px;
    background-image:
        linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
}

/* Efeito Reveal nas seções ao rolar */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* Estilização do cursor do Typewriter */
.typed-cursor {
    color: #5CD21B;
    font-weight: 300;
}

html {
    overflow-x: hidden;
}

body {
    overflow-x: hidden;
}

.client-logo-card {

                position: relative;

                display: flex;
                align-items: center;
                justify-content: center;

                gap: 16px;

                height: 92px;

                min-width: 260px;

                padding: 0 38px;

                flex-shrink: 0;

                border: 1px solid rgba(255, 255, 255, .07);

                border-radius: 20px;

                background:
                    linear-gradient(145deg,
                        rgba(255, 255, 255, .045),
                        rgba(255, 255, 255, .012));

                box-shadow:
                    inset 0 1px 0 rgba(255, 255, 255, .025);

                transition:
                    transform .35s cubic-bezier(.2, .8, .2, 1),
                    border-color .35s ease,
                    background .35s ease,
                    box-shadow .35s ease;
            }


            /*
        LOGO GRANDE
        */

            .client-logo {

                width: 52px;
                height: 52px;

                min-width: 52px;

                object-fit: contain;

                filter:
                    grayscale(1) brightness(.8);

                opacity: .75;

                transition:
                    filter .35s ease,
                    opacity .35s ease,
                    transform .35s cubic-bezier(.2, .8, .2, 1);
            }


            /*
        NOME DA EMPRESA
        */

            .client-name {

                color: rgb(156 163 175);

                font-size: 17px;

                font-weight: 650;

                letter-spacing: -.025em;

                white-space: nowrap;

                transition:
                    color .35s ease;
            }


            /*
        HOVER
        */

            .client-logo-card:hover {

                transform: translateY(-5px) scale(1.015);

                border-color: rgba(255, 255, 255, .15);

                background:
                    linear-gradient(145deg,
                        rgba(255, 255, 255, .075),
                        rgba(255, 255, 255, .025));

                box-shadow:
                    0 18px 45px rgba(0, 0, 0, .28),
                    inset 0 1px 0 rgba(255, 255, 255, .05);
            }


            .client-logo-card:hover .client-logo {

                filter:
                    grayscale(0) brightness(1);

                opacity: 1;

                transform: scale(1.14);
            }


            .client-logo-card:hover .client-name {

                color: rgb(243 244 246);
            }


            /*
        TAMANHO ESPECIAL
        PARA LOGOS COM NOME GRANDE
        */

            .client-wide {
                min-width: 310px;
            }


            /*
        MOBILE
        */

            @media (max-width: 640px) {

                .client-logo-card {

                    height: 82px;

                    min-width: 220px;

                    padding: 0 28px;

                    gap: 14px;

                    border-radius: 18px;
                }

                .client-logo {

                    width: 46px;
                    height: 46px;

                    min-width: 46px;
                }

                .client-name {

                    font-size: 15px;
                }

                .client-wide {

                    min-width: 260px;
                }

            }