.banner h1 {
    font-size: 3rem;
}

@media (max-width: 1599px) {
    .banner h1 {
        font-size: 2.25rem;
    }

    .banner p {
        font-size: 1.25rem;
    }
}

@media (max-width: 1199px) {
    .banner h1 {
        font-size: 2rem;
    }

    .banner p {
        font-size: 1rem;
    }
}

@media (max-width: 767px) {
    .banner h1 {
        font-size: 1.5rem;
    }
}

@media (max-width: 1399px) {
    main {
        margin-top: 70px;
    }

    header {
        height: 70px;
        padding: 0 16px;
    }

    .burger-btn {
        display: flex;
    }

    .header-nav {
        width: 100%;
        position: fixed;
        left: 0;
        top: 70px;
        flex-direction: column;
        gap: 24px;
        align-items: center;
        padding-bottom: 24px;
        opacity: 0;
        visibility: hidden;
        transform: translateY(-20px);
        transition: all .3s ease;
    }

    .header-nav.visible {
        opacity: 1;
        transform: translateY(0);
        visibility: visible;
    }

    .nav-list {
        flex-direction: column;
        gap: 24px;
    }
}
