:root {

    --Brand: #E4FAC5;
    --HeaderFont: "Playfair Display";
    --textFont: "Figtree";
    --Text-Headers: #3D3C70;
    --Text-paragraphs: #8786A3;
    --Grey-background: #F4F7FC;
}



@media (max-width: 768px) {

    #kurajusz-header.front-page,
    #kurajusz-header {
        margin-bottom: 0;
        height: 66px;
        border-bottom: 1px solid var(--Grey-background, #F4F7FC);

    }

    #kurajusz-header.scrolled {
        height: 66px;
    }

    .site-logo .custom-logo-link img {
        max-width: 100px;
        width: 100%;
    }

    #kurajusz-header::before {
        content: none;
    }

    #kurajusz-header .container {
        padding: 16px 24px;
    }

    .right-header-menu {
        align-items: center;
        gap: 32px;
    }

    #mobile-menu-toggle {
        padding: 0;
        background-color: transparent;
        border: 0;
    }



    .qr-modal canvas {
        width: 60vw;
    }

    .hamburger-menu {
        display: flex !important;
    }

    .left-header-menu {
        display: none;
    }

    #menu-right-header-menu {
        display: none !important;
    }

    .waters-info-wrapper {
        align-items: center;
        flex-direction: column !important;
    }

    .baner-wrapper {
        flex-direction: column;
    }

    footer .footer-menus {
        flex-direction: column;
    }

    .swiper-solid-container {
        width: 100%;
        left: 0;
        height: auto;
    }

    .site-logo {
        justify-content: flex-start;
        align-items: center;
    }

    #main-banner .swiper-thumbs .swiper-wrapper {
        display: none;
    }

    .footer-menus-wrapper {
        flex-direction: column;
    }


    #hidden-header .header-wrapper h2 {
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

    #main-banner {
        padding: 0;
    }

    .slide-content h1 {
        font-size: 64px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
    }

    .slide-content p {
        font-size: 20px;
        font-style: normal;
        font-weight: 300;
        line-height: normal;
    }

    .swiper-main {
        height: 360px;
    }

    .swiper-button-next,
    .swiper-button-prev {
        display: none !important;
    }

    .swiper-pagination-bullets {
        display: block;
        position: absolute;
        bottom: 54px !important;
        z-index: 20;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .main-banner-wrapper .swiper-pagination-bullets .swiper-pagination-bullet {
        height: 4px;
        width: 4px;
    }

    .swiper-pagination-bullets .swiper-pagination-bullet {
        background: var(--Grey-background);
        opacity: 1;
        width: 12px;
        height: 12px;
    }

    .swiper-pagination-bullets .swiper-pagination-bullet-active {
        background: var(--Brand);

    }

    #after-baner .image-wrapper img.tree {
        margin-bottom: 28px;
    }

    #after-baner .header-wrapper {
        gap: 8px;
    }

    #after-baner .header-wrapper h2 {
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: 45px;
        /* 140.625% */
    }

    .container {
        padding-left: 24px;
        padding-right: 24px;
    }

    section {
        padding: 0;
    }

    #lottie-divider {
        margin: 53px 24px;
    }


    #hidden-header {
        padding: 57px 24px 95px 24px;
        margin-bottom: 39px;
    }

    #hidden-header::after {
        content: none;
    }

    #water-info {
        background: #fff;
        margin-top: 53px;
    }

    .advantages-header {
        gap: 8px;
        margin-bottom: 30px;
    }

    .advantages-header h2 {
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: 36px;
        /* 112.5% */
    }

    .advantages-wrapper {
        flex-direction: column;
    }

    .advantages-lottie-col {
        display: none;
    }

    .sticky-advantages-image img {
        width: 55vw;
        height: 330px;
    }


    .advantages-desc-col {
        max-width: unset;
    }

    .digit {
        font-size: 240px;
        font-style: normal;
        font-weight: 500;
        line-height: 200px;
        /* 83.333% */
        letter-spacing: -24px;
        min-width: unset;
    }

    #digit-1 {
        min-width: unset;
    }

    .sticky-advantages-image {
        height: 300px;
    }

    .advantages-desc {
        background: #fff;
    }

    .advantages-row {
        min-height: 400px;
        padding-top: 15px;
    }

    #swipe-mobile {
        display: block;
    }

    .more-scroll {
        display: none;
    }

    .desc-header {
        flex-direction: column;
    }

    #sticky-number {
        bottom: 0;
        right: 24px;
    }

    .advantages-desc .desc-header h3 {
        font-size: 24px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        text-align: center;
    }

    .desc-paragraph {
        text-align: center;
    }

    .type-of-water {
        margin: 0;
        display: grid !important;
        grid-template-columns: repeat(2, 1fr);
        max-width: unset;
    }

    .water-short-info {
        max-width: unset;
        width: 100%;
        align-items: center;
        text-align: center;
    }

    .baner-wrapper .baner-image {
        position: static;
    }

    .baner-wrapper .baner {
        flex-direction: column-reverse;
        align-items: center;
        text-align: center;
        padding: 24px;
        gap: 8px;
    }

    .baner.baner-2 .baner-icon,
    .baner.baner-3 .baner-icon {
        position: static;
    }

    .baner-wrapper .baner-3 h2 {
        max-width: unset;
    }

    .swiper-solid-container {
        background: url(../img/knockout_new_mobile.png);
        background-repeat: no-repeat;
        background-size: cover;
        width: calc(100vw - 48px);
        background-position: center;
        height: 460px;
        left: 24px;
        justify-content: flex-end;
        align-items: center;
        border-radius: 8px;
        top: unset;
        bottom: 85px;
    }

    footer .footer-menus {
        display: none;
        opacity: 0;
    }

    .mobile-footer-wrapper {
        display: flex;
        flex-direction: column;
    }

    #kuracjusz-footer {
        padding-bottom: 36px;
    }

    #pre-footer-slider .thumbnails-container {
        position: static;
    }

    .swiper-solid-container .container-button {
        width: 100%;
    }

    #pre-footer-slider .container-paragpraph {
        margin: 0;
    }

    .container-button a {
        width: 100%;
        height: 56px;
    }

    #pre-footer-slider .swiper-pre-footer {
        height: 711px;
    }

    .swiper-pre-footer .swiper-slide {
        border-radius: 0;
    }

    #kuracjusz-footer .footer-lotties {
        margin-bottom: 36px;
    }

    footer .footer-phone a,
    footer .footer-mail a {
        text-align: center;
        justify-content: center;
    }

    footer .footer-phone a {
        margin-bottom: 16px;
    }

    footer .footer-mail a {
        margin-bottom: 36px;
    }

    footer .footer-wrapper {
        flex-direction: column-reverse;
        gap: 42px;
    }

    .footer-right {
        display: none;
    }

    .products-filters {
        display: none;
    }

    /* Pokazujemy mobilny dropdown */
    .products-filters-mobile {
        display: block;
        margin-bottom: 20px;
    }

    .products-filters-mobile label {
        display: block;
        font-weight: bold;
        margin-bottom: 5px;
    }

    .dropdown {
        position: relative;
        border-radius: 8px;
        border: 1px solid var(--Text-captions, #C1C0D6);
        background: var(--White, #FFF);
        padding: 16px;
        cursor: pointer;
        user-select: none;
        display: flex;
        gap: 8px;
        align-items: center;
        justify-content: space-between;
        font-size: 13px;
        font-style: normal;
        font-weight: 400;
        line-height: 16px;
        color: var(--Text-paragraphs);
    }

    .dropdown .selected {
        display: block;
    }

    .dropdown-options {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: #fff;
        border: 1px solid #ccc;
        z-index: 10;
        list-style: none;
        margin: 0;
        padding: 0;

    }

    .dropdown-options li {
        padding: 10px;
        cursor: pointer;
    }

    .dropdown-options li:hover,
    .dropdown-options li.active {
        background: #f1f1f1;
    }

    #products-container .products-wrapper {
        flex-direction: column;
        padding-bottom: 110px;
    }

    #products-container #products-list {
        grid-template-columns: 1fr;
    }

    #products-header .container {
        padding: 46px 24px;
    }

    #breadcrumbs .container {
        padding: 12px 24px;
        border-bottom: 1px solid var(--Grey-background, #F4F7FC);
    }

    #product-image-wrapper {
        position: static;
    }

    #product-image-wrapper {
        display: none;
    }

    #single-product {
        position: static;
        padding-top: 46px;
        background-position-x: center;
        background-position-y: 127px;
    }

    #single-product .container {
        flex-direction: column;
        padding-left: 24px;
        padding-right: 24px;
    }

    #single-product-ions .container {
        flex-direction: column;
        padding: 51px 24px 88px 24px;
        align-items: center;
    }

    #related-products .container {
        display: flex;
        flex-direction: column;
        padding: 53px 24px 81px 24px;
        gap: 53px;
        position: relative;
    }

    .mobile-single-img {
        display: flex;
        /* background: url('../img/single_water_img_background.png') no-repeat; */
        background-position: center;
        background-size: contain;
        align-items: center;
        justify-content: center;
        width: 100%;
        margin-bottom: 20px;
    }

    .mobile-single-img img {
        max-height: 345px;
        width: auto;
    }

    #single-product .description-wrapper .taxonomy-water {
        margin-bottom: 8px;
    }

    #single-product .single-product-header {
        max-width: unset;
    }

    .description-wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #single-product .description-wrapper h2 {
        text-align: center;
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

    #single-product .description-wrapper p {
        text-align: center;
    }

    #single-product .details {
        margin-top: 70px;
        max-width: unset;
    }

    .details .buy-button {
        width: 100%;
        height: 56px;
    }

    .ions-header {
        margin-bottom: 40px;
        gap: 24px;
    }

    #single-product-ions .anions {
        margin-top: 53px;
    }

    #related-products .swiper-buttons {
        display: none;
    }

    #related-products .related-left h2 {
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

    #related-products .related-left {
        gap: 18px;
        text-align: center;
    }

    .single-product-pagination {
        position: absolute;
        bottom: 40px !important;
    }

    #lottie-divider.single-product {
        margin: 0 24px;
    }

    #baner-calculator {
        flex-direction: column-reverse;
        align-items: center;
        text-align: center;
        padding: 24px;
        padding-bottom: 59px;
        border-radius: 8px;
    }

    .baner-wrapper .baner-image img {
        height: 115px;
    }


    #historia-header img {
        max-width: 240px;
    }

    #baner-calculator .baner-desc,
    #baner-dist .baner-desc,
    .baner-desc {
        gap: 16px;
    }

    #baner-section .baner-wrapper .baner {
        padding: 24px 24px 40px 24px;
    }

    #baner-dist {
        padding: 24px;
        padding-bottom: 40px;
        flex-direction: column-reverse;
        align-items: center;
        text-align: center;
        gap: 8px;
        border-radius: 8px;
        position: relative;
    }

    #baner-dist .baner-icon {
        position: absolute;
        top: 23px;
        right: 16px;
    }

    #baner-calculator .baner-desc h2,
    #baner-dist .baner-desc h2 {
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

    #baner-section {
        padding-top: 40px;
        padding-bottom: 40px;
    }


    #firma-cards.zarabiaj .container {
        grid-template-columns: repeat(1, 1fr);
    }

    #dist-form .container {
        flex-direction: column;
    }

    #dist-form .section-header h2 {
        font-size: 32px;
        line-height: normal;
        text-align: center;
    }

    #dist-form .section-header .header-image {
        display: none;
    }

    #kontakt-form .form-wrapper {
        flex-direction: column;
        gap: 40px;
        padding-top: 54px;
    }

    #kontakt-form {
        padding-bottom: 53px;
    }

    .kontakt-numbers-wrapper .infolinia .col-content,
    .kontakt-numbers-wrapper .sprzedaz .col-content,
    .kontakt-numbers-wrapper .handlowy .col-content,
	.kontakt-numbers-wrapper .logistyka .col-content,
    .kontakt-numbers-wrapper .marketing .col-content {
        align-items: center;
    }

    .form-wrapper .text-col .kontakt-numbers-wrapper {
        align-items: center;
        text-align: center;
    }

    #kontakt-form .lottie-wave-single {
        margin-top: 0;
        margin-bottom: 0;
    }

    #kontakt-form .kontakt-header {
        text-align: center;
        align-items: center;
        gap: 8px;
    }

    #kontakt-form .container {
        padding-top: 46px;
    }

    #kontakt-form .kontakt-form {
        gap: 54px;
    }

    #kontakt-form .kontakt-header h2 {
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

    #kontakt-form .kontakt-form h4 {
        text-align: center;
    }

    .kontakt-form .wpcf7-form .form-row.half {
        flex-direction: column;
    }

    .wpcf7-form .half-width {
        width: 100%;
    }

    .wpcf7-form .wpcf7-submit {
        width: 100%;
        height: 56px;
    }

    .map-info-box {
        width: auto;
        height: auto;
        gap: 16px;
        margin: 0;
        align-items: center;
        text-align: center;
        padding: 40px 24px;
        margin: 0 24px;
        box-sizing: border-box;
    }

    .map-info-box .box-icon {
        position: static;
    }

    .map-info-box h4 {
        display: none;
    }

    .map-info-box .box-button {
        position: static;
        height: 56px;
        width: 100%;
    }

    .map-info-box h2 {
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: 56px;
        /* 175% */
    }

    #kontakt-map .container {
        flex-direction: column;
        padding: 0;
        padding-bottom: 18px;
    }

    .map-wrapper {
        position: static;
        margin-top: -100px;
    }

    /* BLOG */

    #posts #posts-container {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    #single-post-header .container {
        gap: 8px;
        padding-top: 46px;
        padding-bottom: 32px;
    }



    #blog-header .blog-category-wrapper {
        display: none;
    }

    #blog-header .container {
        padding: 46px 24px 26px 24px;
        text-align: center;
        gap: 8px;
    }

    .blog-category-mobile {
        display: flex;
        flex-direction: column;
        gap: 8px;
        width: 100%;
        text-align: left;
        margin-top: 38px;

    }

    .blog-category-mobile label {
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        font-family: var(--textFont);
        color: var(--Text-Headers);
    }

    #blog-header .lottie-wave-single {
        margin: 0;
    }

    #blog-header h1 {
        font-size: 32px;
        line-height: normal;

    }

    #posts .container {
        padding: 24px;
    }

    #pagination {
        display: none;
    }



    #pagination-mobile {
        margin-top: 53px;
    }

    .main-button.load-more {
        display: flex;
        color: var(--Brand, #FEFAB5);
        font-family: Figtree;
        font-size: 14px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        align-items: center;
        height: 56px;
        justify-content: center;
    }

    #related-posts {
        position: relative;
    }

    #related-posts .container {
        flex-direction: column;
        gap: 34px;
    }

    #post-image .image {
        height: 210px;
    }

    #single-post-header h1 {
        font-size: 32px;
        font-weight: 700;
        margin: 0 8px;
        line-height: normal;
    }

    #single-post-header {
        background-position-x: center;
        background-size: contain;
    }

    #post-content {
        padding: 32px 0 73px 0;
    }

    .wp-block-media-text>.wp-block-media-text__content {
        padding: 32px 0 0 0;
    }

    #post-content h1,
    #post-content h2,
    #post-content h3,
    #post-content h4,
    #post-content h5,
    #post-content h6 {
        margin: 32px 0;
    }

    #related-posts .container .navigation-wrapper {
        align-items: center;
        text-align: center;
        gap: 18px;
    }

    #related-posts .container .navigation-wrapper h2 {
        font-size: 32px;
        line-height: normal;
    }

    #related-posts .buttons-wrapper {
        display: none;
    }


    /* CENTRUM PRASOWE */
    #download-files {
        padding: 24px 0 47px 0;
    }

    #download-files .downloads-wrapper {
        grid-template-columns: 1fr;
    }

    #press-download-header .taxonomy-container {
        flex-direction: column;
        display: none;
    }

    #press-header .header-wrapper h1 {
        font-size: 32px;
        line-height: normal;
    }

    #press-header .container {
        gap: 8px;
    }

    #press-header .header-wrapper {
        gap: 8px;
    }

    #press-header .contact-wrapper {
        margin-top: 54px;
        gap: 12px;
    }

    #press-header .contact-wrapper .adress {
        margin-top: 24px;
    }

    .download-header {
        padding: 46px 0 24px 0;
    }

    .download-header h2 {
        font-size: 32px;
        line-height: normal;
    }

    .download-category-mobile {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-top: 34px;
    }

    .download-category-mobile label {
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        color: var(--Text-Headers);
    }


    /* HISTORIA */

    #history .row-container {
        flex-direction: column;
    }

    .col-history .marker-wrapper {
        display: none;
    }

    #history .row-container .col-divider {
        width: 100%;
    }

    #history .row-container .col-divider.desktop {
        display: none;




    }

    #history .row-container .col-divider.mobile {
        display: flex;
    }

    #history .row-container.odd {
        flex-direction: column-reverse;
    }

    #history .row-container .col-divider.mobile {
        padding: 50px 0;
    }

    .mobile-first-divider {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #historia-bottle .container img {
        max-height: 303px;
    }

    #historia-bottle {
        background: linear-gradient(to top,
                /* Kierunek gradientu */
                #F4F7FC 0%,
                /* Dolny kolor */
                #F4F7FC 120px,
                /* Przejście zaczyna się 150px od dołu */
                #fff 120px,
                /* Zmiana na biały w ciągu 1px */
                #fff 100%
                /* Kolor u góry */
            );
    }

    #historia-bottle:after {
        bottom: 88px;
    }

    #historia-header h1 {
        font-size: 32px;
        line-height: normal;
    }

    #step-1 .content-wrapper {
        flex-direction: column;
        gap: 8px;
    }

    #step-1 .static-header {
        display: none;
    }

    .header-wrapper-mobile h4 {
        font-size: 15px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        letter-spacing: 6px;
        font-family: var(--textFont);
        color: #55548D;
    }

    .calculator h1 {
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        text-align: center;
    }

    #step-1 .content-col {
        gap: 8px;
        align-items: center;
    }

    #calculator-wrapper {
        margin-bottom: -32px;
    }

    #calculator-wrapper .start {
        margin-top: 40px;
    }

    #step-1 {

        padding-bottom: 97px;
    }

    #calculator-wrapper .lottie-wave {
        margin: 0;
        display: block;
    }

    #calculator-wrapper .header-wrapper {
        position: static;
        transform: none;
    }

    #step-2 .content-wrapper .text-col {
        flex-direction: column;
        align-items: center;
        gap: 8px;
    }

    #step-2 .content-wrapper {
        align-items: center;
        flex-direction: column;
        padding: 0;
    }

    #step-progress .container {
        flex-direction: column;

    }

    #step-2 .sex {
        width: 100%;
        height: auto;
        aspect-ratio: 1;
    }

    #step-2 .content-col {
        width: 100%;
    }

    #step-2 {
        padding: 60px 0 42px 0;
    }

    #step-progress .container {
        padding: 21px 24px 43px 21px;
        gap: 21px;
    }

    #step-2 .static-header,
    #step-3 .static-header,
    #step-4 .static-header,
    #step-5 .static-header {
        text-align: center;
        margin-bottom: 8px;
    }

    .content-wrapper .step-number {
        margin: 0;
    }

    #step-2 .content-wrapper .step-text {
        align-items: center;
        gap: 8px;
        margin-bottom: 38px;
    }

    #step-progress .step-name {
        display: none;
    }

    .step-buttons .main-button {
        width: 100%;
        height: 56px;
        flex: 1;
    }

    #step-progress .step-buttons {
        width: 100%;
    }

    #step-3 .container,
    #step-4 .container {
        padding: 47px 24px 34px 24px;
    }

    #step-3 .text-col,
    #step-4 .text-col {
        flex-direction: column;
        align-items: center;
    }

    #step-3 .content-wrapper,
    #step-4 .content-wrapper {
        flex-direction: column;
        gap: 38px;
    }

    #step-3 .age-wrapper,
    #step-4 .weight-wrapper {
        height: 170px;
        width: 100%;
    }

    #step-3 .content-col,
    #step-4 .content-col {
        width: 100%;
    }

    #step-3 .text-col,
    #step-4 .text-col {
        gap: 8px;
        text-align: center;
    }

    #step-3 .step-text,
    #step-4 .step-text {
        text-align: center;
        align-items: center;
        gap: 8px;
    }

    #ageOutput,
    #weightOutput {
        font-size: 64px;
        font-weight: 500;
        line-height: normal;
    }

    .step-buttons .step-back {
        width: 100%;
        height: 56px;
        flex: 1;
        border-radius: 8px;
        background: var(--Grey-background, #F3F6FC);
    }

    #step-5 .container {
        padding: 60px 24px;
    }

    .activity-wrapper {
        grid-template-columns: 1fr;
    }

    #step-5 .step-text {
        align-items: center;
    }

    #calculator-wrapper .header-wrapper.summary {
        margin-top: 42px;
        gap: 8px;
    }

    .reasult-container svg.background-1 {
        position: absolute;
        top: 0;
        left: 58%;
        height: 90px;
        overflow: hidden;
    }

    .reasult-container svg.background-2 path,
    .reasult-container svg.background-1 path {
        stroke-dasharray: 1 25;
        stroke-width: 8px;

    }

    .reasult-container .reasult {
        width: 100%;
    }

    .reasult-container svg.background-2 {

        bottom: 28px;
        left: 10%;
        height: 90px;
    }

    .reasult-container {
        padding-bottom: 158px;
    }

    .sugested-minerals .ions-details,
    .sugested-minerals .ions-details {
        grid-template-columns: repeat(2, 1fr);
    }

    .sugested-water .waters-wrapper {
        /* display: flex;
        width: auto;
        max-width: unset; */
    }

    .sugested-water .swiper-calc {
        width: 100%;
        max-width: 100vw;
        padding-bottom: 50px;

    }

    .minerals-header {
        margin-top: 0;
    }

    .sugested-water {}

    .swiper-calc-pagination {
        display: flex;
        bottom: 10px !important;

    }

    .swiper-calc-pagination .swiper-pagination-bullet {
        background: #fff;
    }

    .swiper-calc-pagination .swiper-pagination-bullet-active {
        background: var(--Brand) !important;
    }

    .minerals-header svg {
        height: 90px;
    }

    .minerals-header svg path {
        stroke-dasharray: 1 25;
        stroke-width: 8px;
    }

    #water-info.desktop {
        display: none;
    }

    #water-info.mobile {
        display: block;
    }

    #products-header .products-header-wrapper h2 {
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

    #main-nagrody .nagrody-wrapper {
        grid-template-columns: 1fr;
        gap: 42px;
    }

    #main-nagrody .single-nagroda {
        flex-direction: column;
    }

    .single-nagroda .content-nagroda {
        align-items: center;
    }

    .content-nagroda .nagroda-title h2 {
        text-align: center;
    }

    .content-nagroda .nagroda-desc p {
        text-align: center;
    }

    #rest-nagrody .rest-wrapper {
        grid-template-columns: 1fr;
    }

    #nagrody-heading .container {
        padding-top: 60px;
        gap: 24px;
    }

    #main-nagrody .container {
        padding-top: 30px;
        padding-bottom: 89px;
    }

    #nagrody-heading .container h1 {
        font-size: 32px;
        line-height: normal;
    }

    #rest-nagrody .container h2 {
        font-size: 32px;
        line-height: normal;
        text-align: center;
    }

    #rest-nagrody .container {
        padding-top: 48px;
        padding-bottom: 144px;
    }

    #oferta-details .right-col-mobile {
        display: flex;
        gap: 8px;
        margin-bottom: 46px;
    }

    #oferta-details .right-col {
        display: none;

    }

    #oferta-header .container h1 {
        font-size: 32px;
        line-height: normal;
        margin: 0;
    }

    #oferta-header .container h4 {
        margin: 0;
    }

    #oferta-header .container {
        gap: 8px;
        padding-top: 46px;
        padding-bottom: 57px;
    }

    #oferta-header .container p {
        margin-top: 12px;
    }

    #oferta-details .container {
        flex-direction: column-reverse;
        padding-bottom: 75px;
        padding-top: 27px;
    }

    /* targetujemy <p id="breadcrumbs"> wewnątrz sekcji #breadcrumbs */
    #breadcrumbs .container>p#breadcrumbs {
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        /* płynne przewijanie na iOS */
        scrollbar-width: none;
        /* Firefox */
    }

    #breadcrumbs .container>p#breadcrumbs::-webkit-scrollbar {
        display: none;
        /* Webkit */
    }

    .sugested-water .waters-wrapper {
        display: flex;
    }

    #buy-modal {
        width: 100%;
        box-shadow: none;
    }

    #dist .order-wrapper {
        flex-direction: column;
    }

    #dist .list-header {
        display: none;
    }

    #dist .order-wrapper .products-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 31px;
    }

    #dist .products-filters {
        width: 100%;
        flex-direction: column;
        gap: 8px;
        align-items: flex-start;
    }

    #dist .order-wrapper .col .products-list {
        display: flex;
        flex-direction: column;
        gap: 24px;
    }

    #dist .col.products-col .single-item {
        display: flex;
        gap: 8px;
        padding: 24px 16px;
        border-radius: 8px;
        border: 1px solid var(--Text-captions, #C1C0D6);
        background: var(--White, #FFF);
        justify-content: flex-start;



    }

    #firma-header .container {
        padding: 60px 24px 75px 24px;
        gap: 24px;
    }

    #firma-header .container h1 {
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

    #firma-header .lottie-wave {
        margin: 0;
    }

    #firma-header .container p {
        margin-top: 18px;
    }

    #firma-cards .container {
        flex-direction: column;
        gap: 24px;
    }

    #firma-cards .container .firma-card {
        max-width: unset;
    }



    #firma-image::before,
    #firma-image::after {
        content: none;
    }

    #firma-line .container {
        flex-direction: column;
        padding-top: 124px;
        padding-bottom: 80px;
    }

    #firma-banners .container {
        flex-direction: column;
        padding-top: 30px;
        padding-bottom: 58px;
    }

    #firma-banners .container .baner.dist-baner .baner-image,
    #firma-banners .container .baner .baner-image {
        position: static;
    }

    #firma-banners .container .baner.dist-baner .baner-image img {
        max-height: 143px;
        height: 100%;
        width: auto;
    }

    #firma-banners .container .baner .baner-image img {
        max-height: 110px;
        height: 100%;
        width: auto;
    }

    #firma-banners .container .baner .left-col h3 {
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

    #firma-banners .container .baner {
        display: flex;
        align-items: center;
        flex-direction: column-reverse;
        gap: 8px;
        padding: 24px 24px 40px 24px;
        text-align: center;
    }

    #firma-image.parallax {
        min-height: 400px;
        height: 100%;
        border-radius: 8px;
        margin: 24px;
    }

    #firma-line .container .image-col {
        display: none;
    }

    .line-icons-wrapper .line-icon {
        flex-direction: column;
        gap: 16px;
        align-items: center;
    }

    #firma-line .container .col-text-col .line-icons-wrapper {
        flex-direction: column;
        gap: 40px;
        align-items: center;
        margin-top: 0;

    }

    #lottie-divider.firma-divider {
        margin: 0;
    }

    #firma-line .container .col-text-col {
        gap: 64px;
        text-align: center;
    }

    #firma-line .container .col-text-col h2 {
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        text-align: center;
    }

    #firma-line .container .col-text-col .text-image-col {
        display: flex;
        flex-direction: column;
        gap: 24px;
    }

    #firma-line .container .col-text-col .text-image-col img {
        height: 277px;
        width: auto;
        object-fit: cover;
        border-radius: 8px;
    }

    .line-icons-wrapper .line-icon .icon-heading {
        max-width: unset;
    }

    #firma-line {
        background: linear-gradient(to bottom,
                #F3F6FC 50%,
                #fff 50%);
    }


    #dist .js-order-panel .modal-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid var(--Grey-background, #F3F6FC);
    }

    #dist .js-order-panel .submit-button.js-open-order-modal {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        padding: 24px;
        background: var(--White, #FFF);
        box-shadow: 0px -4px 4px 0px rgba(61, 60, 112, 0.06);
        display: none;

    }

    #dist .js-order-panel.show .submit-button.js-open-order-modal {
        display: block;
    }

    #dist .col.order {
        position: fixed;
        right: -100%;
    }

    #close-summary-modal {
        display: flex;
    }

    #dist .js-order-panel {

        top: 0;
        transition: right 0.3s ease-in-out, opacity 0.3s ease-in-out;
        background: var(--White, #FFF) !important;
        height: 100%;
        width: 100%;
        z-index: 1010;
        border-radius: 0 !important;
    }



    #dist .js-order-panel.show {
        right: 0;
    }

    #dist .summary-mobile {
        position: sticky;
        bottom: 0;
        left: 0;
        width: 100%;
        padding: 24px;
        display: flex;
        flex-direction: column;
        gap: 18px;
        background: var(--White, #FFF);
        box-shadow: 0px -4px 4px 0px rgba(61, 60, 112, 0.06);
    }

    #dist .summary-mobile .summary-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    #dist .summary-mobile .summary-header h3 {
        color: var(--Text-Headers, #3D3C70);
        font-family: var(--textFont);
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

    #dist .summary-mobile .summary-btn {
        color: var(--Brand);
        font-size: 14px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

    #dist .summary-mobile .summary-header .summary-counter {
        display: flex;
        height: 24px;
        padding: 0 12px;
        justify-content: center;
        align-items: center;
        gap: 8px;
        border-radius: 13px;
        background: var(--Grey-background, #F3F6FC);
        color: var(--Text-paragraphs, #8786A3);
        text-align: center;
        font-family: var(--textFont);
        font-size: 11px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
    }

    #dist .col.products-col .single-item .details-wrapper {
        display: flex;
        flex-direction: column;
        gap: 24px;
        align-items: flex-start;
    }

    #dist .col.products-col .single-item .product-type.gazowana {
        order: 1;
    }

    #dist .col.products-col .single-item .product-name {
        order: 2;
    }

    #dist .col.products-col .single-item .pallets {
        order: 3;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    #dist .single-item .product-image img {
        max-width: 70px;

    }

    #dist .product-input {
        order: 4;
        align-items: center;


    }

    #dist .mobile-label {
        color: var(--Text-Headers, #3D3C70);
        font-family: var(--textFont);
        font-size: 13px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        display: block;
    }

    #dist .product-input .mobile-label {
        margin-right: 16px;
    }


    #dist .col.order {
        max-width: unset;
    }

    .order-modal.js-order-modal {
        right: -150%;
    }

    #dist .container {
        padding-bottom: 30px;
    }

    #dist .header-wrapper {
        gap: 24px;
    }

    #dist .header-wrapper h1 {
        font-size: 32px;
        line-height: normal;
    }

    .order-modal.js-order-modal {
        width: 100%;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        /* dla płynnego scrolla na iOS */

    }

    .order-modal.js-order-modal .modal-header .modal-title {
        display: flex;
        flex-direction: row-reverse;
        gap: 21px;
        align-items: center;
    }

    .order-modal.js-order-modal .modal-header .modal-title #modal-back {
        display: flex;
        opacity: 1;
        height: 100%;
    }

    .js-order-form .form-row.cp-address {
        flex-direction: column;

    }

    .js-order-form .form-row.cp-address .street,
    .js-order-form .form-row.cp-address .house,
    .js-order-form .form-row.cp-address .flat {
        width: 100%;
        flex: 1;
    }

    #post-content .product-sidebar {
        display: none;
    }

    #praca-oferty .oferty-container {
        grid-template-columns: 1fr;
        padding-bottom: 44px;
    }

    #praca-oferty .oferty-header {
        flex-direction: column;
        gap: 26px;
    }

    #praca-oferty .oferty-header .filters-wrapper {
        flex-direction: column;
        gap: 16px;
        width: 100%;
    }

    #praca-oferty .oferty-header .filters-wrapper .single-filter {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        width: 100%;
    }

    #praca-oferty .oferty-header .filters-wrapper .single-filter .dropdown {
        width: 100%;
    }

    #praca-oferty .oferty-header .filters-wrapper .single-filter label {
        font-size: 13px;
        line-height: normal;
    }

    #praca-oferty .oferty-header h2 {
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

    #praca-search .search-wrapper {
        padding: 0;
        border: none;
    }

    #praca-search .search-input {
        flex-direction: column;
        gap: 8px;
    }

    #oferty-search-button {
        width: 100%;
    }

    #oferty-search-input {
        display: flex;
        height: 48px;
        padding: 0px 16px;
        justify-content: center;
        align-items: center;
        gap: 8px;
        align-self: stretch;
        border-radius: 8px;
        border: 1px solid var(--Text-captions, #C1C0D6);
        background: var(--White, #FFF);
    }

    #praca-hero .header-wrapper h1 {
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

    #praca-hero .header-wrapper {
        padding-bottom: 53px;
        padding-top: 46px;
        gap: 8px;
    }

    #cv-banner .container .apply .btn-col {
        max-width: none;
        width: 100%;
    }

    #cv-banner .container {
        padding: 65px 24px 24px 24px;
    }

    #cv-banner .container .apply {
        flex-direction: column;
        gap: 24px;
        align-items: center;
        padding: 24px;
        height: auto;
        text-align: center;
    }

    #praca-oferty {
        padding-top: 24px;
    }

    #praca-oferty:after {
        content: none;
    }

    .oferty-container .oferta-card {
        width: 100%;
    }

    #praca-oferty #loading {
        top: 290px;
    }

    #step-1 .image-col {
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #step-1 .image-col img {
        max-height: 220px;
        height: 100%;
        width: auto;
    }

    #step-1 .image-col .image-icon {
        display: none;
    }

    #main-footer .pre-footer .notch img {
        width: 230px;
        height: 47px;
    }

    .advantages-desc-col {
        margin: 0;
    }

    #products-header .products-header-wrapper h5 {
        margin-bottom: 8px;
    }

    #products-header .products-header-wrapper h2 {
        margin-bottom: 8px;
    }

    #document-hero .container h1 {
        font-size: 32px;
        line-height: normal;
    }

    #document-hero .container {
        padding: 60px 24px;
    }

    #content-page p {
        word-break: break-word;
        overflow-wrap: break-word;
        white-space: normal;
    }

}

@media (min-width: 769px) and (max-width: 1024px) {

    #water-info.desktop {
        display: none;

    }

    #water-info.mobile {
        display: block;
    }

    .water-mobile-wrapper {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 80px;
    }

    #menu-left-menu-desktop {
        display: none;
    }

    #menu-right-header-menu {
        display: none;
    }

    #products-container #products-list {
        grid-template-columns: repeat(2, 1fr);
    }

    .products-filters-mobile {
        display: block;
    }

    .products-filters {
        display: none;
    }

    #products-container .products-wrapper {
        flex-direction: column;
    }



    .footer-menus-wrapper {
        display: none;
    }

    footer .footer-wrapper {
        flex-direction: column;
    }

    #menu-footer-mobile {
        display: flex;
    }

    .mobile-footer-wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    footer .footer-menus {
        display: none;
    }

    .site-logo {
        align-items: center;
        justify-content: flex-start;
    }

    #kurajusz-header .container {
        padding: 24px;

    }

    #kurajusz-header .left-header-menu {
        display: none;
    }

    .hamburger-menu {
        display: flex;
    }

    #main-banner .swiper-thumbs .swiper-wrapper {
        justify-content: center;
        padding: 0;
    }

    .container {
        padding-left: 24px;
        padding-right: 24px;
    }

    .mobile-single-img {
        display: flex;
    }

    #product-image-wrapper {
        display: none;
    }

    #single-product {
        position: static;
    }

    #single-product .container {
        flex-direction: column;
        gap: 24px;
    }

    #single-product .single-product-header {
        max-width: 100%;
    }

    #single-product .description-wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #single-product .details {
        max-width: 100%;
    }

    #single-product .details .where-to-buy {
        display: flex;
        justify-content: center;
    }

    #single-product .details h4 {
        text-align: center;
    }

    #single-product {
        padding-top: 40px;
    }

    .mobile-single-img img {
        max-height: 550px;
        width: auto;
    }


    #related-products .container {
        display: flex;
        flex-direction: column;
    }

    #related-products .swiper-buttons {
        position: absolute;
        top: 0;
        right: 24px;
    }

    #related-products .related-left {
        position: relative;
        margin-bottom: 24px;
        padding: 0 24px;
    }

    #related-products .related-products-list {
        padding: 0 24px 40px 24px;
        position: relative;
    }

    #rest-nagrody .rest-wrapper {
        grid-template-columns: repeat(2, 1fr);
    }

    #main-nagrody .nagrody-wrapper {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .advantages-wrapper {
        flex-direction: column;
        gap: 20px;
        align-items: center;
    }

    .baner-wrapper {
        flex-direction: column;
    }

    #breadcrumbs .container {
        padding-left: 24px;
        padding-right: 24px;
    }

    #download-files .downloads-wrapper {
        grid-template-columns: repeat(3, 1fr);
    }

    #press-download-header .taxonomy-container {
        width: 100%;
        flex-wrap: wrap;
        border-radius: 0;
        bottom: -70px;
    }

    .site-logo .custom-logo-link img {
        width: 160px;
    }

    footer .footer-phone a,
    footer .footer-mail a {
        margin-bottom: 12px;
    }

    footer .footer-mail a {
        margin-bottom: 52px;
    }

    #history .row-container .col-divider.desktop {
        display: none;
    }

    #history .row-container .col-divider.mobile {
        display: flex;
    }

    #history .row-container.odd {
        flex-direction: column-reverse;
    }

    #history .row-container {
        flex-direction: column;
    }

    .col-history .marker-wrapper {
        display: none;
    }

    .mobile-first-divider {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #history .row-container .col-divider.mobile {
        display: flex;
        padding: 55px 0;
        width: 100%;
    }

    #step-1 .image-col {
        flex: 2;
    }

    #step-1 .image-col img {
        max-height: 400px;
        height: 100%;
        width: auto;
    }

    #step-1 .content-col {

        flex: 3;
    }

    #step-1 .image-col .image-icon img {
        width: 80px;
        height: 80px;
        flex-shrink: 0;
    }

    #step-1 .image-col .image-icon {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #step-2 .content-wrapper .text-col {
        flex-direction: column;
    }

    #step-progress .container {
        padding: 50px 24px;
    }

    #step-3 .text-col,
    #step-4 .text-col {
        flex-direction: column;
    }

    #step-3 .content-wrapper,
    #step-4 .content-wrapper {
        padding: 0 24px;
    }

    #step-3 .age-wrapper,
    #step-4 .weight-wrapper {
        width: 400px;
    }

    .activity-wrapper {
        padding: 0 24px;
        grid-template-columns: repeat(3, 1fr);
    }

    .sugested-water .swiper-calc {
        width: 100%;

    }

    #posts #posts-container {
        padding: 0 24px;
        grid-template-columns: repeat(2, 1fr);
    }

    #related-posts .container {
        flex-direction: column;
        gap: 40px;
        align-items: center;
    }

    #related-posts .container .navigation-wrapper {
        text-align: center;
        align-items: center;
    }

    #post-content .container {
        flex-direction: column;
    }

    #post-content .products-wrapper {
        flex-direction: row;
    }

    #post-content .product-card {
        width: 100%;
        flex-shrink: unset;
    }

    #post-content .sidebar-header h3 {
        text-align: center;
    }

    #products-header .products-header-wrapper {
        padding: 0 40px;
    }

    #single-product-ions .container {
        flex-direction: column;
        gap: 40px;
        align-items: center;
        padding: 80px 40px;
    }

    #single-product-ions .cations,
    #single-product-ions .anions {
        max-width: unset;
    }

    #single-product-ions .ions-details {
        grid-template-columns: repeat(4, 1fr);
    }

    .zarabiaj-card {
        align-items: center;
        justify-content: center;
    }

    .digit {
        font-size: 340px;
    }

    .sticky-advantages-image {
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .sticky-advantages-image {
        width: 440px;
        height: 100%;
    }

    #swipe-mobile {
        display: block;
        opacity: 1;
    }

    .advantages-desc-col {
        margin: 0;
        width: 100%;
    }

    .swiper-solid-container {
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }

    #firma-cards.zarabiaj .container {

        grid-template-columns: repeat(2, 1fr);
    }

    #praca-oferty .oferty-container {

        grid-template-columns: repeat(3, 1fr);
    }

    .oferty-container .oferta-card {
        width: 100%;
    }

    #cv-banner .container {
        padding: 40px 24px;
    }

    #oferta-details .container {
        flex-direction: column;
        gap: 40px;
    }

    #oferta-details .left-col {
        max-width: unset;
    }

    #kurajusz-header::before {
        content: none;
    }

    #kurajusz-header {
        height: 90px;
    }

    #mobile-menu-modal {
        top: 90px;
    }

    .advantages-desc {
        align-items: center;
        text-align: center;
    }
}


@media (min-width: 1025px) and (max-width: 1340px) {
    .container {
        padding-left: 24px;
        padding-right: 24px;
    }

    #breadcrumbs .container {
        padding-left: 24px;
        padding-right: 24px;
    }

    .swiper-solid-container {
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }

    .baner-wrapper .baner-image img {
        display: none;
    }

    .baner-wrapper .baner {
        padding: 50px 24px;
    }

    .site-logo {
        justify-content: center;
        align-items: center;
    }

    #kurajusz-header.front-page {
        height: 90px;
    }

    #kurajusz-header .site-logo img {
        width: 160px;
    }

    #kurajusz-header::before {
        content: none;
    }

    .footer-menus-wrapper {
        gap: 100px;
    }

    #products-container #products-list {
        grid-template-columns: repeat(2, 1fr);
    }

    #single-product-ions .cations,
    #single-product-ions .anions,
    #single-product .details,
    #single-product .single-product-header {
        z-index: 30;
    }

    #related-products .container,
    .container {
        padding-left: 24px;
        padding-right: 24px;
    }

    #praca-oferty .oferty-container {
        grid-template-columns: repeat(3, 1fr);
    }

    .oferty-container .oferta-card {
        width: 100%;
    }

    #posts #posts-container {
        grid-template-columns: repeat(2, 1fr);
        padding: 0 24px;
    }

    #post-content .container {
        flex-direction: column;
    }

    #post-content .products-wrapper {
        flex-direction: row;
    }

    #post-content .products-wrapper {
        gap: 0;
    }

    #firma-banners .container .baner .baner-image {
        right: 30px;
    }

    #firma-banners .container .baner .baner-image img {
        width: 150px;
    }

    #firma-banners .container .baner.dist-baner .baner-image {
        top: 70px;
        right: 25px;
    }
}