.header-inst {
    /* background: linear-gradient(30deg, var(--primary), var(--tertiary)); */
    background: #010E2E;

    .content .texts {
        .top {
            .tags .tag {
                font-size: 13px;
                color: var(--white);
                background-color: #2b7fff;
                padding: .2rem .5rem;
                border-radius: 8px;
            }

            .heading {
                h1 {line-height: 48px;}

                .paragraphs p {color: var(--clr-light-paragraph);}
            }
        }

        .bottom {
            .buttons a {
                font-size: 15px;
                font-weight: 500;
                padding: .6rem 1.2rem;
                border-radius: 8px;
                border: 2px solid var(--white);

                &.solid {background-color: var(--white);}
                &.borded {color: var(--white);}
            }

            .points {
                gap: .8rem 1.2rem;

                .point {
                    font-size: 13px;
                    color: var(--white);
                    display: flex;
                    align-items: center;
                    gap: .4rem;

                    svg {
                        width: 16px;
                        height: 16px;
                        fill: var(--white);
                    }
                }
            }
        }
    }
}

@media (max-width: 1024px) {
    .header-inst .content {
        flex-direction: column;
        gap: 2rem;
        
        .part {width: 100%;}

        .texts {
            &, .top, .top .heading, .bottom {
                align-items: center;
            }

            .top {
                .tags {justify-content: center;}

                .heading {
                    h1, .paragraphs p {text-align: center;}
                }
            }

            .bottom {
                .buttons, .points {justify-content: center;}
            }
        }
    }
}

@media (max-width: 600px) {
    .header-inst .content .texts .bottom {
        &, .buttons, .buttons a{width: 100%;}

        .buttons {
            flex-direction: column;
            gap: .5rem;

            a {text-align: center;}
        }
    }
}