/*
 * Kreptech responsive adjustments — stage 1.
 * Desktop and small-laptop widths only: 1024–1304 px.
 * Mobile layout is intentionally not changed at this stage.
 */

@media (min-width: 1024px) and (max-width: 1304px) {
    html,
    body,
    .wrapp,
    .bottom {
        min-width: 0;
        max-width: 100%;
    }

    body {
        overflow-x: hidden;
    }

    img,
    iframe,
    embed,
    object,
    video {
        max-width: 100%;
    }

    /* Common fixed-width containers */
    .bread,
    .mainarea,
    .categ_slider,
    .moduletable.catalog,
    .bottomstuff .head_descr,
    .bottomstuff .wrap-spisok,
    .view-featured .footer-top .footer_top_wrap,
    .footer-bottom .menu_bot,
    .copyright > div {
        width: calc(100% - 32px);
        max-width: 1200px;
        margin-left: auto;
        margin-right: auto;
    }

    .cont_header h3,
    .bottomstuff .custom.contacts .cont_header h3 {
        width: calc(100% - 32px);
        max-width: 1180px;
        padding-left: 40px;
        padding-right: 16px;
        box-sizing: border-box;
    }

    /* Header */
    .top .supwrap {
        width: 100%;
        max-width: none;
        padding: 0 16px;
        box-sizing: border-box;
    }

    .top .logo {
        width: 100%;
        max-width: 1180px;
        margin: 0 auto;
        position: relative;
    }

    .top .top-logo img {
        width: clamp(220px, 23vw, 300px);
        height: auto;
    }

    .top .top_menu {
        margin-left: clamp(10px, 2vw, 30px);
        white-space: nowrap;
    }

    .top .top_menu li {
        width: clamp(108px, 11vw, 151px);
    }

    .top .top_menu li:last-child {
        width: 150px;
        margin-left: clamp(10px, 1.5vw, 20px);
    }

    .top .custom.hot_line {
        padding-right: 0;
        margin-right: 8px;
        font-size: 13px;
        line-height: 17px;
        white-space: nowrap;
    }

    .top .mod-languages {
        position: relative;
        width: 58px;
        height: 92px;
    }

    .top .mod-languages .mfs-container {
        top: 38px;
        right: 0;
        left: auto;
    }

    /* Breadcrumbs and page content */
    .bread .breadcrumb {
        margin-left: 20px;
        margin-right: 20px;
    }

    .mainarea > .supwrap {
        width: 100%;
        max-width: none;
    }

    .mainarea .main-content {
        display: block;
        width: 100%;
        max-width: 100%;
        margin: 0 0 50px;
        box-sizing: border-box;
    }

    .mainarea .sidebar {
        width: 230px;
        margin-left: 0;
    }

    .mainarea .sidebar + .main-content {
        float: left;
        width: calc(100% - 250px);
        margin-left: 20px;
    }

    .mainarea .sidebar .zoo-category-list li a {
        width: 230px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .mainarea .sidebar .zoo-category-list li a.current {
        background-position: calc(100% - 12px) center;
    }

    .contentarea {
        max-width: 100%;
        overflow-x: auto;
        overflow-y: visible;
    }

    .contentarea img {
        height: auto;
    }

    .contentarea table {
        max-width: 100%;
    }

    /* Product category and product card */
    .product-items {
        width: 100%;
        max-width: 685px;
    }

    .product-items .zoo-gallery {
        width: 100%;
    }

    .product-news .uk-grid {
        width: 100%;
    }

    .product-news .uk-width-medium-1-3 {
        width: calc((100% - 40px) / 3);
        margin-right: 20px;
        box-sizing: border-box;
    }

    .product-news .uk-width-medium-1-3 img {
        max-width: 100%;
        height: auto;
    }

    .product-news h1 {
        width: auto;
        max-width: 500px;
    }

    /* Home catalogue */
    .categ_slider .categories,
    .moduletable.catalog .menu {
        width: 100%;
        max-width: 1120px;
    }

    .moduletable.catalog .menu {
        display: flex;
        flex-wrap: wrap;
        gap: 0 25px;
        justify-content: flex-start;
    }

    .moduletable.catalog .menu li {
        float: none;
        width: calc((100% - 75px) / 4);
        margin: 0 0 60px;
    }

    .moduletable.catalog .menu li a {
        width: 100%;
    }

    /* Contacts and city selector */
    .bottomstuff .moduletable.maps,
    .bottomstuff .general_map,
    .bottomstuff .tab-content,
    .bottomstuff .tab-content .tab-pane {
        max-width: 100%;
    }

    .bottomstuff .spisok .title {
        max-width: 321px;
    }

    .bottomstuff .spisok .inner .street,
    .bottomstuff .spisok .inner .tel,
    .bottomstuff .spisok .inner .director {
        padding-left: 60px;
        padding-right: 45px;
        overflow-wrap: anywhere;
    }

    .bottomstuff .custom.contacts form.formResponsive {
        width: min(700px, calc(100% - 32px));
    }

    .bottomstuff .custom.contacts form.formResponsive .rsform-block-text textarea {
        width: 100%;
    }

    body.consult .mainarea .main-content,
    body.consult #yoo-zoo {
        width: 100%;
        max-width: 1100px;
    }

    /* Footer */
    .footer-bottom .menu_bot {
        padding: 0 8px;
        box-sizing: border-box;
    }

    .footer-bottom .menu {
        margin-left: clamp(16px, 4vw, 60px);
        white-space: nowrap;
    }

    .footer-bottom .menu li {
        width: clamp(120px, 11vw, 151px);
    }

    .copyright > div {
        padding: 0 16px;
        box-sizing: border-box;
        font-size: 13px;
        white-space: nowrap;
    }
}

@media (min-width: 1024px) and (max-width: 1100px) {
    .moduletable.catalog .menu {
        gap: 0 25px;
    }

    .moduletable.catalog .menu li {
        width: calc((100% - 50px) / 3);
    }

    .footer-bottom .menu {
        margin-left: 16px;
    }

    .footer-bottom .menu li {
        width: 120px;
    }
}