@media screen and (max-width: 991px) {
    body {
        font-weight: 400;
        font-size: 14px;
        line-height: 162%;
    }
    .long-container { width: 100vw; }    
}
.navbar-toggler-icon {
    height: 2px; width: 29px;
    position: relative;
}
.navbar-toggler-icon::before {
    content: '';
    position: absolute;
    top: -7px; right: 0;
    height: 2px; width: 36px;
    background-color: var(--color-primary);
    
}
.navbar-toggler-icon::after {
    content: '';
    position: absolute;
    top: 7px; right: 0;
    height: 2px; width: 22px;
    background-color: var(--color-primary);
}
.offcanvas-header { padding: 24px 27px; }
.offcanvas-header .btn-close {opacity: 1;}
.offcanvas-body .nav { margin: 0 0 0 37.5px; }
.offcanvas-body .nav .nav-item {
    background-color: var(--color-primary);
    border-radius: 15px;
    max-width: 132px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.offcanvas-body .nav .nav-item a {
    font-family: 'Roboto', serif;
    font-size: 19px;
    font-weight: 500;
    color: var(--color-white);
    text-decoration: none;
    text-align: center;
}

@media screen and (max-width: 991px) {
    h1, h1.main-page-title { font-size: 30px; }
    h1 {font-family: 'Cormorant Garamond'; font-weight: 700;}
    h2 { font-size: 20px; }

    .hero-section {  height: 470px; }
    .hero-content { text-align: center;}
    .hero-content p { font-size: 33px; }
    .hero-content p:last-child { font-size: 40px; margin: 0;}
    .hero-content .btn {
        width: 200px; height: 53px;
    }
    .hero-content .btn { margin: auto ;}

    .btn {
        font-size: 14px; font-weight: 500;
    }

    .about-section img { height: 400px; }

    .slider-section .btn {
        width: 220px;
        height: 53px;
        margin-top: 30px;
    }
    .slider-section .carousel-control-prev { left: 18px; }
    .slider-section .carousel-control-next { right: 18px; }

    .video-section .icon {
        width: 35px; height: 35px;
    }
    .how-to-buy p { font-size: 18px; }

    .download-section p { line-height: 162%; }
    .download-section .btn { font-size: 14px; }

    .conctact-section img { width: 80px; height: 80px;}
    .conctact-section p { font-size: 16px;}

    .footer-img-section { height: 132px; }

    .footer { padding: 30px 0; }
    .footer .logo,
    .header .logo { width: 62px; height: 62px;}
    .footer .footer-nav {    
        width: max-content;
        margin: auto;
    }
    .footer .footer-nav li { margin: 0 0 10px 0; }
    .footer .menu-contact { width: max-content; align-items: flex-start;}
    .footer.footer-links a { font-size: 16px; }
    .footer .copyright { font-size: 12px; }

    .atrakcje-section .atrakcje-container {
        height: auto;
        padding: 15px;
        width: fit-content;
        margin: 0 auto;
    }
    .atrakcje-container.center-image { height: 320px; }
    .atrakcje-img {
        width: 277px;
        height: 176px;
        margin: 0 0 33px 0;
        float: left;
        aspect-ratio: 277 / 176;
        left: 50%;
        transform: translate(-50%, 13px);
    }
    .atrakcje-container.center-image picture {
        position: relative;
        float: left;
        display: flex;
        width: 100%;
        height: 100%;
        z-index: 100;
        align-items: center;
        justify-content: center;
    }
    .atrakcje-container.center-image .atrakcje-img {
        left: 0;
        top: 0;
        transform: translate(0, 0);
        margin: 0;
    }
    .atrakcje-container.center-image .atrakcje-content {
        float: none;
        top: 50%;
        left: 50%;
        width: 100%;
        transform: translate(-50%, -50%);
    }
    .atrakcje-content {
        top: 0;
        left: 50%;
        transform: translate(-50%, 0);
        max-width: 215px;
        padding: 23px 15px;
        height: 100%;
    }

    .atrakcje-content .title {
        font-size: 18px;
        text-align: center;
        margin: 0 0 14px 0;
        line-height: 100%;
    }
    .atrakcje-content .description { 
        font-size: 14px;
        text-align: center;
        line-height: 100%;
    }
    .action-block { margin-top: 30px; }
    .action-block .title { font-size: 20px; }
    .atrakcje-section .buttons {
        flex-direction: column;
        align-items: center;
        gap: 20px;
        margin-top: 30px;
    }
    .group-section .btn, .atrakcje-section .btn {
        width: 220px;
        height: 53px;
        font-size: 14px;
    }

    .calendar-section .buttons {
        flex-wrap: wrap;
        margin-bottom: 30px;
    }
    .calendar-section .buttons .btn {
        width: 161px;
        height: 45px;
    }

    .group-section img { min-height: 230px; object-fit: cover; border-radius: 20px; aspect-ratio: 307/230; }
    .group-section .buttons {
        margin-top: 30px;
        flex-direction: column;
        gap: 20px;
        align-items: center;
    }

    .form { padding: 20px 8px; }
    .form .form-title {
        font-size: 18px;
        line-height: 30px;
        margin: 0 auto 20px;
    }
    .form input, .form select { height: 50px; }
    .form input, .form select, .form textarea {
        font-size: 16px;
        padding: 15px 20px;
        margin-bottom: 15px;
    }
    .form .btn {
        padding: 15px 83px;
        font-size: 14px;
    }

    .contact-section .menu-contact li {
        font-size: 18px;
    }

    .gallery-section .img-fluid,
    .gallery-section video {
        max-height: fit-content;
    }
}



@media screen and (min-width: 1230px) {
    .pdf-section .pdf-inner {
        padding-left: 31px;
    }
    .pdf-section .title-stroke {
        margin-top: 125px;
        width: 70%;
        left: 166px;
        font-size: 25px;
    }
    .pdf-section .text-stroke {
        font-size: 20.5px;
        margin: 19px 0 0 10px;
    }
    .pdf-section p.text-stroke {
        font-size: 15.5px;
        line-height: 123%;
        margin: 19px 0 0 3px;
    }
}
@media screen and (max-width: 768px) {
    .pdf-section .pdf-inner {
        padding-left: 5.5vw;
    }
    .pdf-section .title-stroke {
        margin-top: 21.1vw;
        width: 60vw;
        left: 28.5vw;
        font-size: 4.2vw;
    }
    .pdf-section .text-stroke {
        font-size: 3.3vw;
        margin: 2.7vw 0 0 1.9vw;
    }
    .pdf-section p.text-stroke {
        font-size: 2.6vw;
        line-height: 120%;
        margin: 3.5vw 0 0 0.3vw;
    }
}
@media screen and (max-width: 500px) {
    .pdf-section .title-stroke {
        margin-top: 20.1vw;
    }
}