@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");
#diretrizes {
    padding: 20px;
    div {
        .titulo {
            display: block;
            font-size: 3rem;
            font-family: "Inter", sans-serif;
            text-transform: uppercase;
            color: #0081c7;
            text-align: center;
            margin-top: 10px;
            font-weight: 400;

            &::before {
                content: "";
                display: inline-block;
                width: 2px;
                height: 112px;
                background: #0081c7;
                top: -112px;
                left: 50%;
                transform: translateX(-50%);
            }
        }
        .backgrond {
            background: linear-gradient(to bottom right, #f1f6fc, #c9e2ff);
            border-radius: 41px;
            margin-bottom: 40px;
            max-width: 70ch;
            text-align: center;
            margin-inline: auto;
            padding: 40px;
        }
        .valores {
            margin-top: 40px;
            display: flex;
            align-items: center;
            justify-content: center;

            .bola {
                padding: 0px;
                place-content: center;
                background: #0081c7;
                border-radius: 100%;
                height: 300px;
                width: 300px;
                text-align: center;
                list-style: none;
                color: #f1f6fc;
            }
            .bola2 {
                padding: 0px;
                place-content: center;
                border-radius: 100%;
                height: 300px;
                width: 300px;
                text-align: center;
                transform: translateX(-30px);
                border: 3px solid #0193e2;
                list-style: none;
                background: linear-gradient(to bottom right, #f1f6fc, #c9e2ff);
            }
        }
    }
}