/*
 * Mud Master custom styles.
 * Этот файл загружается после стилей старого конструктора.
 * Меняйте его вместо минифицированных файлов в папке css.
 */

@media (min-width: 768px) {
    /* Более компактная шапка. */
    [id^="wb_header_"] {
        min-height: 110px !important;
    }

    [id^="wb_header_"] > .wb_content {
        min-height: 110px !important;
        height: 110px !important;
        justify-content: flex-end !important;
        align-items: center !important;
    }

    /* Контейнер логотипа. */
    #a1946f7ebb43003a9064a1cc648d62c0 {
        height: 110px !important;
    }

    /* Размер и положение логотипа. */
    #a1946f7ef00f0065ac03e84248a19367 {
        left: 30px !important;
        top: 10px !important;
        width: 90px !important;
    }

    /* Контейнер меню. */
    #a188dd97c2cc35b0f21197fc3e85e38d {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 60px 0 auto !important;
        flex: 0 0 auto !important;
    }

    /* Пункты меню располагаются в одну горизонтальную строку. */
    #a188dd97c2cc35b0f21197fc3e85e38d > ul.hmenu {
        display: flex !important;
        width: auto !important;
        max-width: none !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 4px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #a188dd97c2cc35b0f21197fc3e85e38d > ul.hmenu > li {
        display: block !important;
        float: none !important;
        width: auto !important;
        margin: 0 !important;
    }

    #a188dd97c2cc35b0f21197fc3e85e38d > ul.hmenu > li > a {
        display: block !important;
        width: auto !important;
        padding: 12px 16px !important;
        font-size: 14px !important;
        line-height: 16px !important;
        white-space: nowrap !important;
        text-align: center !important;
    }
}

/* v10 mobile header, page-flow and News hero corrections. */
@media (max-width: 600px) {
    #wb_root > .wb_sbg {
        position: fixed !important;
        inset: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        min-height: 0 !important;
        margin: 0 !important;
        pointer-events: none !important;
        z-index: -1 !important;
    }
    #wb_root {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        min-height: 100% !important;
        height: auto !important;
    }
    [id^="wb_header_"] {
        position: sticky !important;
        inset: 0 0 auto 0 !important;
        order: -1 !important;
        width: 100% !important;
        height: 76px !important;
        min-height: 76px !important;
        max-height: 76px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        z-index: 10000 !important;
        background: #080808 !important;
    }
    [id^="wb_header_"] > .wb_content {
        position: relative !important;
        inset: auto !important;
        display: grid !important;
        grid-template-columns: 68px minmax(0, 1fr) !important;
        align-items: center !important;
        gap: 4px !important;
        width: 100% !important;
        height: 76px !important;
        min-height: 76px !important;
        max-height: 76px !important;
        margin: 0 !important;
        padding: 4px 6px !important;
        overflow: hidden !important;
    }
    #a1946f7ebb43003a9064a1cc648d62c0,
    #a1946f7ebb43003a9064a1cc648d62c0 > .wb_content,
    #a1946f7ef00f0065ac03e84248a19367,
    #a1946f7ef00f0065ac03e84248a19367 .wb_picture_wrap,
    #a1946f7ef00f0065ac03e84248a19367 .wb-picture-wrapper,
    #a1946f7ef00f0065ac03e84248a19367 a {
        position: relative !important;
        inset: auto !important;
        display: block !important;
        width: 68px !important;
        height: 68px !important;
        min-width: 0 !important;
        min-height: 0 !important;
        max-width: 68px !important;
        max-height: 68px !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
        overflow: hidden !important;
    }
    #a1946f7ef00f0065ac03e84248a19367 img {
        position: absolute !important;
        inset: 0 !important;
        width: 68px !important;
        height: 68px !important;
        margin: 0 !important;
        object-fit: contain !important;
    }
    #a188dd97c2cc35b0f21197fc3e85e38d {
        position: relative !important;
        inset: auto !important;
        align-self: stretch !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 68px !important;
        min-height: 68px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
    }
    #a188dd97c2cc35b0f21197fc3e85e38d ul.hmenu {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: stretch !important;
        width: 100% !important;
        max-width: none !important;
        height: 68px !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 1px !important;
    }
    #a188dd97c2cc35b0f21197fc3e85e38d ul.hmenu > li {
        display: flex !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        width: auto !important;
        min-width: 0 !important;
        height: 68px !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    #a188dd97c2cc35b0f21197fc3e85e38d ul.hmenu > li > a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        height: 68px !important;
        min-height: 68px !important;
        margin: 0 !important;
        padding: 0 1px !important;
        font-size: clamp(7px, 2.15vw, 10px) !important;
        line-height: 1 !important;
        letter-spacing: -0.25px !important;
        text-align: center !important;
        white-space: nowrap !important;
        word-break: normal !important;
        overflow: hidden !important;
    }
    #wb_root > [id^="wb_main_"] {
        position: relative !important;
        inset: auto !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding-top: 0 !important;
    }
    #a1948e73e061001725c00e111f7b9952 {
        display: none !important;
        height: 0 !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    #a1948e843dfa004d036eb3fefe1ded5d,
    #a1948e843dfa004d036eb3fefe1ded5d > .wb_content {
        width: 100% !important;
        min-height: 260px !important;
        background-repeat: no-repeat !important;
        background-position: center center !important;
        background-size: cover !important;
        background-attachment: scroll !important;
    }
}

/* Mobile stabilization v9: compact fixed header, predictable document flow. */
@media (max-width: 600px) {
    html,
    body {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    *,
    *::before,
    *::after {
        box-sizing: border-box !important;
    }

    /* The old builder hides animated elements until they cross a desktop-sized
       trigger point. On phones this produced long blank areas and scroll jumps. */
    .wb-anim,
    .wb-anim-entry-on,
    [class*="wb-anim-"] {
        visibility: visible !important;
        opacity: 1 !important;
        animation: none !important;
        transition: none !important;
        transform: none !important;
    }

    .wb_content::before,
    .wb-layout-element::before,
    [class*="wb_main_"]::before {
        background-attachment: scroll !important;
    }

    /* Keep the logo and all five navigation links in one compact sticky header. */
    [id^="wb_header_"] {
        position: sticky !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 96px !important;
        min-height: 96px !important;
        margin: 0 !important;
        overflow: hidden !important;
        z-index: 9998 !important;
        background-color: #090909 !important;
    }

    [id^="wb_header_"] > .wb_content {
        position: relative !important;
        width: 100% !important;
        height: 96px !important;
        min-height: 96px !important;
        overflow: hidden !important;
    }

    #a188dd97c2cc35b0f21197fc3e85e38d {
        top: 54px !important;
        right: 4px !important;
        left: 76px !important;
        width: auto !important;
        height: 38px !important;
        min-height: 38px !important;
        padding: 0 !important;
    }

    #a188dd97c2cc35b0f21197fc3e85e38d ul,
    #a188dd97c2cc35b0f21197fc3e85e38d ul.hmenu {
        height: 38px !important;
        gap: 1px !important;
    }

    #a188dd97c2cc35b0f21197fc3e85e38d ul.hmenu > li {
        height: 38px !important;
        overflow: visible !important;
    }

    #a188dd97c2cc35b0f21197fc3e85e38d ul.hmenu > li > a {
        height: 36px !important;
        min-height: 36px !important;
        padding: 2px 0 !important;
        font-size: clamp(6px, 1.85vw, 9px) !important;
        line-height: 1 !important;
        letter-spacing: -0.2px !important;
        white-space: nowrap !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        text-overflow: clip !important;
    }

    /* PRODUCTS: five equal columns, icons aligned to one top edge, labels scaled
       instead of breaking individual words into vertical fragments. */
    #a1949206d7f600824202a27c7c05e7e0 {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 12px 4px 22px !important;
        overflow: visible !important;
    }

    #a1949206d7f600824202a27c7c05e7e0 > .wb_content {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: start !important;
        gap: 3px !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
    }

    #a1949206d7f600824202a27c7c05e7e0 > .wb_content > .wb-layout-element,
    #a1949206d7f600824202a27c7c05e7e0 > .wb_content > .wb-layout-element > .wb_content {
        position: relative !important;
        inset: auto !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100% !important;
        height: auto !important;
        min-width: 0 !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 7px !important;
        overflow: visible !important;
    }

    #a1949206d7f600824202a27c7c05e7e0 .wb_element_picture {
        position: relative !important;
        inset: auto !important;
        flex: 0 0 auto !important;
        width: clamp(50px, 15vw, 68px) !important;
        height: clamp(50px, 15vw, 68px) !important;
        min-height: 0 !important;
        margin: 0 auto !important;
    }

    #a1949206d7f600824202a27c7c05e7e0 .wb_element_picture img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        border-radius: 18% !important;
    }

    #a1949206d7f600824202a27c7c05e7e0 .wb_text_element {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 24px !important;
        margin: 0 !important;
        padding: 0 1px !important;
        overflow: visible !important;
    }

    #a1949206d7f600824202a27c7c05e7e0 .wb_text_element :is(h1, h2, h3, h4) {
        margin: 0 !important;
        font-size: clamp(5.4px, 1.65vw, 8px) !important;
        line-height: 1.12 !important;
        letter-spacing: -0.12px !important;
        text-align: center !important;
        white-space: normal !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
        text-wrap: balance !important;
    }

    /* Drilling Fluids / Additives: constrain every text block to the viewport. */
    #wb_main_a194a6deb07400fe63628b090024a2d4,
    #wb_main_a194a6deb07400fe63628b090024a2d4 > .wb_content {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

    #wb_main_a194a6deb07400fe63628b090024a2d4 .wb_text_element,
    #wb_main_a194a6deb07400fe63628b090024a2d4 .wb_text_element * {
        max-width: 100% !important;
    }

    #wb_main_a194a6deb07400fe63628b090024a2d4 .wb_text_element :is(h1, h2, h3, h4) {
        margin-right: 0 !important;
        margin-left: 0 !important;
        font-size: clamp(18px, 5.35vw, 23px) !important;
        line-height: 1.18 !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
        text-wrap: balance !important;
    }

    #wb_main_a194a6deb07400fe63628b090024a2d4 .wb_text_element :is(p, li) {
        font-size: clamp(14px, 4vw, 17px) !important;
        line-height: 1.45 !important;
        word-break: normal !important;
        overflow-wrap: break-word !important;
    }

    /* DRILL RIGS: exported desktop rows become visible stacked cards. */
    #wb_main_a194ad8480160077a98945fae325a3af,
    #wb_main_a194ad8480160077a98945fae325a3af > .wb_content {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

    #wb_main_a194ad8480160077a98945fae325a3af > .wb_content {
        display: flex !important;
        flex-direction: column !important;
    }

    #wb_main_a194ad8480160077a98945fae325a3af .wb-layout-horizontal > .wb_content {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        gap: 18px !important;
    }

    #wb_main_a194ad8480160077a98945fae325a3af .wb-layout-horizontal > .wb_content > .wb-layout-element,
    #wb_main_a194ad8480160077a98945fae325a3af .wb-layout-vertical > .wb_content > .wb_element {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
        overflow: visible !important;
    }

    #wb_main_a194ad8480160077a98945fae325a3af .wb_element_picture,
    #wb_main_a194ad8480160077a98945fae325a3af .wb_element_picture .wb_picture_wrap,
    #wb_main_a194ad8480160077a98945fae325a3af .wb_element_picture .wb-picture-wrapper {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 1px !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    #wb_main_a194ad8480160077a98945fae325a3af .wb_element_picture img {
        display: block !important;
        width: min(100%, 520px) !important;
        height: auto !important;
        max-height: none !important;
        margin: 0 auto !important;
        object-fit: contain !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    #wb_main_a194ad8480160077a98945fae325a3af .wb_text_element {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 14px !important;
        overflow: visible !important;
    }
}

/* v10 final priority: compact sticky mobile bar and removal of legacy gaps. */
@media (max-width: 600px) {
    #wb_root > .wb_sbg { position: fixed !important; inset: 0 !important; width: 100vw !important; height: 100vh !important; min-height: 0 !important; margin: 0 !important; pointer-events: none !important; z-index: -1 !important; }
    #wb_root { display: flex !important; flex-direction: column !important; width: 100% !important; height: auto !important; min-height: 100% !important; }
    [id^="wb_header_"] { position: sticky !important; inset: 0 0 auto 0 !important; order: -1 !important; width: 100% !important; height: 76px !important; min-height: 76px !important; max-height: 76px !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; z-index: 10000 !important; background: #080808 !important; }
    [id^="wb_header_"] > .wb_content { position: relative !important; inset: auto !important; display: grid !important; grid-template-columns: 68px minmax(0, 1fr) !important; align-items: center !important; gap: 4px !important; width: 100% !important; height: 76px !important; min-height: 76px !important; max-height: 76px !important; margin: 0 !important; padding: 4px 6px !important; overflow: hidden !important; }
    #a1946f7ebb43003a9064a1cc648d62c0,
    #a1946f7ebb43003a9064a1cc648d62c0 > .wb_content,
    #a1946f7ef00f0065ac03e84248a19367,
    #a1946f7ef00f0065ac03e84248a19367 .wb_picture_wrap,
    #a1946f7ef00f0065ac03e84248a19367 .wb-picture-wrapper,
    #a1946f7ef00f0065ac03e84248a19367 a { position: relative !important; inset: auto !important; display: block !important; width: 68px !important; height: 68px !important; min-width: 0 !important; min-height: 0 !important; max-width: 68px !important; max-height: 68px !important; margin: 0 !important; padding: 0 !important; transform: none !important; overflow: hidden !important; }
    #a1946f7ef00f0065ac03e84248a19367 img { position: absolute !important; inset: 0 !important; width: 68px !important; height: 68px !important; margin: 0 !important; object-fit: contain !important; }
    #a188dd97c2cc35b0f21197fc3e85e38d { position: relative !important; inset: auto !important; align-self: stretch !important; width: 100% !important; min-width: 0 !important; max-width: none !important; height: 68px !important; min-height: 68px !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; }
    #a188dd97c2cc35b0f21197fc3e85e38d ul.hmenu { display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)) !important; align-items: stretch !important; width: 100% !important; max-width: none !important; height: 68px !important; margin: 0 !important; padding: 0 !important; gap: 1px !important; }
    #a188dd97c2cc35b0f21197fc3e85e38d ul.hmenu > li { display: flex !important; align-items: stretch !important; justify-content: stretch !important; width: auto !important; min-width: 0 !important; height: 68px !important; margin: 0 !important; padding: 0 !important; }
    #a188dd97c2cc35b0f21197fc3e85e38d ul.hmenu > li > a { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; height: 68px !important; min-height: 68px !important; margin: 0 !important; padding: 0 1px !important; font-size: clamp(7px, 2.15vw, 10px) !important; line-height: 1 !important; letter-spacing: -0.25px !important; text-align: center !important; white-space: nowrap !important; word-break: normal !important; overflow: hidden !important; }
    #wb_root > [id^="wb_main_"] { position: relative !important; inset: auto !important; flex: 0 0 auto !important; width: 100% !important; height: auto !important; min-height: 0 !important; margin: 0 !important; padding-top: 0 !important; }
    #a1948e73e061001725c00e111f7b9952 { display: none !important; height: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; }
    #a1948e843dfa004d036eb3fefe1ded5d,
    #a1948e843dfa004d036eb3fefe1ded5d > .wb_content { width: 100% !important; min-height: 260px !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: cover !important; background-attachment: scroll !important; }
}

/* Новые разделы и многоуровневое выпадающее меню. */
.mudmaster-custom-menu{position:relative!important}.mudmaster-menu-level{display:none!important;position:absolute!important;z-index:9999!important;top:100%!important;left:0!important;min-width:220px!important;margin:0!important;padding:6px!important;background:#111!important;box-shadow:0 12px 30px #0008!important;list-style:none!important}.mudmaster-menu-level .mudmaster-menu-level{top:0!important;left:100%!important}.mudmaster-custom-menu:hover>.mudmaster-menu-level,.mudmaster-custom-menu:focus-within>.mudmaster-menu-level{display:block!important}.mudmaster-menu-level li{display:block!important;width:100%!important;position:relative!important}.mudmaster-menu-level a{display:block!important;padding:11px 15px!important;color:#fff!important;white-space:nowrap!important;text-decoration:none!important}.mudmaster-menu-level a:hover{background:#e3a11a!important;color:#111!important}.mudmaster-custom-menu.has-children>a:after{content:' ▾';font-size:.8em}.mudmaster-menu-level .has-children>a:after{content:' ›';float:right}
/*
 * Mobile layout (v7).
 * The original builder generated phone breakpoints, but several typography,
 * menu and media rules still inherited desktop values.  These overrides are
 * deliberately generic so they also cover translated and newly copied pages.
 */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

img,
video,
svg,
canvas {
    max-width: 100%;
}

.wb_text_element,
.wb_text_element * {
    overflow-wrap: anywhere;
    word-break: normal;
}

.wb_text_element table {
    display: block;
    width: 100% !important;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 767px) {
    html {
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }

    body,
    #wb_root,
    .root,
    [id^="wb_header_"],
    [id^="wb_main_"],
    [id^="wb_footer_"] {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    /* Compact two-level header: logo above a readable five-column menu. */
    [id^="wb_header_"] {
        min-height: 126px !important;
        height: 126px !important;
    }

    [id^="wb_header_"] > .wb_content {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 126px !important;
        min-height: 126px !important;
        padding: 0 !important;
    }

    #a1946f7ebb43003a9064a1cc648d62c0 {
        position: absolute !important;
        inset: 0 0 auto 0 !important;
        width: 100% !important;
        height: 72px !important;
        margin: 0 !important;
    }

    #a1946f7ef00f0065ac03e84248a19367 {
        position: absolute !important;
        left: 14px !important;
        top: 7px !important;
        width: 60px !important;
        height: 60px !important;
        margin: 0 !important;
    }

    #a1946f7ef00f0065ac03e84248a19367 img {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
    }

    #a188dd97c2cc35b0f21197fc3e85e38d {
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        top: 72px !important;
        width: 100% !important;
        height: 54px !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 5px !important;
        transform: none !important;
    }

    #a188dd97c2cc35b0f21197fc3e85e38d > ul.hmenu {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: stretch !important;
        width: 100% !important;
        height: 54px !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 2px !important;
    }

    #a188dd97c2cc35b0f21197fc3e85e38d > ul.hmenu > li {
        position: relative !important;
        display: flex !important;
        float: none !important;
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    #a188dd97c2cc35b0f21197fc3e85e38d > ul.hmenu > li > a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 44px !important;
        padding: 6px 2px !important;
        font-size: clamp(8px, 2.45vw, 11px) !important;
        line-height: 1.15 !important;
        text-align: center !important;
        white-space: normal !important;
    }

    /* Nested CMS menu remains hidden until its parent is tapped/focused. */
    .mudmaster-menu-level {
        display: none !important;
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        width: min(82vw, 280px) !important;
        min-width: 0 !important;
        max-height: 65vh !important;
        overflow-y: auto !important;
        padding: 5px !important;
        box-shadow: 0 12px 30px #000a !important;
    }

    .mudmaster-custom-menu:focus-within > .mudmaster-menu-level,
    .mudmaster-custom-menu:hover > .mudmaster-menu-level {
        display: block !important;
    }

    .mudmaster-menu-level .mudmaster-menu-level {
        position: static !important;
        width: 100% !important;
        padding-left: 12px !important;
        box-shadow: none !important;
    }

    .mudmaster-menu-level a {
        white-space: normal !important;
        line-height: 1.3 !important;
    }

    /* Prevent desktop flex widths and offsets from shrinking phone content. */
    [id^="wb_main_"] > .wb_content,
    [id^="wb_footer_"] > .wb_content,
    .wb-layout-horizontal,
    .wb-layout-vertical,
    .wb-layout-horizontal > .wb_content,
    .wb-layout-vertical > .wb_content {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .wb-layout-horizontal > .wb_content {
        flex-wrap: wrap !important;
    }

    .wb-layout-horizontal > .wb_content > .wb_element {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .wb_picture_wrap,
    .wb-picture-wrapper,
    .wb-picture-wrapper a {
        max-width: 100% !important;
    }

    .wb-picture-wrapper img,
    .wb_gallery img,
    .wb_text_element img {
        max-width: 100% !important;
        height: auto !important;
        object-fit: contain;
    }

    iframe,
    embed,
    object {
        max-width: 100% !important;
    }

    /* Readable phone typography. */
    .wb-stl-heading1 {
        font-size: clamp(24px, 8.2vw, 36px) !important;
        line-height: 1.08 !important;
    }

    .wb-stl-heading2 {
        font-size: clamp(25px, 7.3vw, 32px) !important;
        line-height: 1.15 !important;
    }

    .wb-stl-heading3 {
        font-size: clamp(22px, 6.2vw, 28px) !important;
        line-height: 1.18 !important;
    }

    .wb-stl-custom4 {
        font-size: clamp(16px, 4.8vw, 21px) !important;
        line-height: 1.2 !important;
        text-align: center !important;
    }

    .wb-stl-pagetitle,
    .wb-stl-subtitle {
        font-size: clamp(13px, 3.8vw, 16px) !important;
        line-height: 1.35 !important;
    }

    .wb_text_element p,
    .wb_text_element li {
        font-size: max(15px, 1em) !important;
        line-height: 1.55 !important;
    }

    .wb_button,
    .pb-button,
    button,
    input[type="submit"] {
        min-height: 44px;
        max-width: 100%;
        white-space: normal;
    }

    /* Footer becomes a compact readable stack. */
    [id^="wb_footer_"] > .wb_content {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    [id^="wb_footer_"] .wb_text_element {
        width: 100% !important;
        margin: 5px 0 !important;
        text-align: center !important;
    }

    /* Language selector stays reachable without covering page content. */
    .language-switcher,
    .language-switch,
    .lang-switcher,
    .lang-switch {
        right: max(8px, env(safe-area-inset-right)) !important;
        bottom: max(8px, env(safe-area-inset-bottom)) !important;
        max-width: calc(100vw - 16px) !important;
    }

    /* Pages created by the newer block editor. */
    .pb-header {
        box-sizing: border-box;
        height: auto !important;
        min-height: 76px;
        padding: 8px 14px !important;
        gap: 8px;
        flex-wrap: wrap;
    }

    .pb-header img {
        width: 56px !important;
        height: 56px !important;
    }

    .pb-header nav {
        display: flex;
        flex: 1 1 260px;
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 4px 10px !important;
        font-size: 12px !important;
    }

    .pb-header nav a {
        min-height: 36px;
        display: inline-flex;
        align-items: center;
    }

    .pb-block {
        padding: 36px 16px !important;
        background-attachment: scroll !important;
    }

    .pb-rich {
        font-size: 16px !important;
        line-height: 1.6 !important;
    }

    .pb-gallery,
    .pb-columns {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 16px !important;
    }

    .pb-gallery img {
        height: auto !important;
        aspect-ratio: 4 / 3;
        object-fit: cover !important;
    }

    .pb-popup {
        padding: 12px !important;
    }

    .pb-popup-card {
        padding: 34px 18px 22px !important;
        max-height: calc(100dvh - 24px) !important;
    }
}

@media (max-width: 420px) {
    #a188dd97c2cc35b0f21197fc3e85e38d > ul.hmenu > li > a {
        letter-spacing: -0.15px;
    }

    .wb-stl-heading1 {
        font-size: clamp(23px, 7.8vw, 32px) !important;
    }
}

@media (orientation: landscape) and (max-height: 520px) and (max-width: 900px) {
    .mudmaster-menu-level {
        max-height: 55vh !important;
    }

    .pb-popup-card {
        max-height: calc(100dvh - 16px) !important;
    }
}

/* Mud Master responsive hotfix v8.
   These rules only affect phones and deliberately target the legacy page IDs,
   so the desktop layout remains byte-for-byte unchanged. */
@media (max-width: 600px) {
    /* One compact header: logo above, all five links in one fixed row. */
    [id^="wb_header_"] {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        height: 118px !important;
        min-height: 118px !important;
        overflow: visible !important;
    }

    [id^="wb_header_"] > .wb_content {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        height: 118px !important;
        min-height: 118px !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    #a1946f7ebb43003a9064a1cc648d62c0 {
        position: absolute !important;
        top: 4px !important;
        left: 8px !important;
        width: 58px !important;
        height: 58px !important;
        min-height: 0 !important;
        margin: 0 !important;
        z-index: 4 !important;
    }

    #a1946f7ef00f0065ac03e84248a19367,
    #a1946f7ef00f0065ac03e84248a19367 .wb_picture_wrap,
    #a1946f7ef00f0065ac03e84248a19367 .wb-picture-wrapper {
        position: static !important;
        width: 58px !important;
        height: 58px !important;
        margin: 0 !important;
    }

    #a1946f7ef00f0065ac03e84248a19367 img {
        width: 58px !important;
        height: 58px !important;
        object-fit: contain !important;
    }

    #a188dd97c2cc35b0f21197fc3e85e38d {
        position: absolute !important;
        top: 66px !important;
        right: auto !important;
        bottom: auto !important;
        left: 0 !important;
        display: block !important;
        width: 100% !important;
        height: 48px !important;
        min-height: 48px !important;
        margin: 0 !important;
        padding: 0 4px !important;
        overflow: visible !important;
        transform: none !important;
        z-index: 20 !important;
    }

    #a188dd97c2cc35b0f21197fc3e85e38d ul,
    #a188dd97c2cc35b0f21197fc3e85e38d ul.hmenu {
        position: static !important;
        inset: auto !important;
        display: flex !important;
        flex-flow: row nowrap !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        width: 100% !important;
        height: 48px !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 2px !important;
        overflow: visible !important;
        transform: none !important;
    }

    #a188dd97c2cc35b0f21197fc3e85e38d ul.hmenu > li {
        position: static !important;
        inset: auto !important;
        display: flex !important;
        float: none !important;
        flex: 1 1 20% !important;
        width: 20% !important;
        min-width: 0 !important;
        height: 48px !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
    }

    #a188dd97c2cc35b0f21197fc3e85e38d ul.hmenu > li > a {
        position: static !important;
        inset: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        height: 44px !important;
        min-width: 0 !important;
        min-height: 44px !important;
        margin: 0 !important;
        padding: 4px 1px !important;
        overflow: hidden !important;
        font-size: clamp(8px, 2.35vw, 10px) !important;
        line-height: 1.1 !important;
        letter-spacing: -0.15px !important;
        text-align: center !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        transform: none !important;
    }

    /* Home: remove inherited 50px margins and desktop minimum heights. */
    #wb_main_a188dd97dcbc001a775b69ec231f1a93 > .wb_content {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
    }

    #wb_main_a188dd97dcbc001a775b69ec231f1a93 > .wb_content > .wb_element,
    #a19483a618c300a1624ea64ac2e01108,
    #a19483a618c300a1624ea64ac2e01108 > .wb_content,
    #a19483a6e81b001fe8c7ac3ffe1e628b,
    #a188dd97c2cc37bdddf82fdc994ed0bb,
    #a188dd97c2cc3b6f5d4643dbc5d8bebe,
    #a188dd97c2cc4b4aee9308f0f8a59a0f {
        min-height: 0 !important;
        max-height: none !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    #a19483a6e81b001fe8c7ac3ffe1e628b {
        margin: 0 !important;
    }

    #a188dd97c2cc37bdddf82fdc994ed0bb {
        height: auto !important;
        min-height: 320px !important;
        margin: 0 !important;
    }

    #a188dd97c2cc37bdddf82fdc994ed0bb > .wb_content {
        min-height: 320px !important;
        padding: 24px 14px !important;
    }

    #a188dd97c2cc577e821c6a5e76e4912c {
        height: 240px !important;
        min-height: 240px !important;
        margin: 0 !important;
    }

    #a188dd97c2cc577e821c6a5e76e4912c > .wb_content {
        min-height: 240px !important;
        padding: 20px 12px !important;
    }

    /* Drill Rods: the long introduction was exported as H3; render it as body copy. */
    #wb_main_a194ad41e07600e40ea77a6d4791fc4c #a194ad41e19507dd7a3e9cb562484cf9 {
        min-height: 0 !important;
        padding: 18px 14px !important;
    }

    #wb_main_a194ad41e07600e40ea77a6d4791fc4c #a194ad5f0a1d00dc70fe0f301da889dc {
        width: 100% !important;
        margin: 12px 0 0 !important;
    }

    #wb_main_a194ad41e07600e40ea77a6d4791fc4c #a194ad5f0a1d00dc70fe0f301da889dc .wb-stl-heading3 {
        font-size: 17px !important;
        line-height: 1.48 !important;
        letter-spacing: 0 !important;
        text-align: left !important;
        overflow-wrap: anywhere !important;
    }

    #wb_main_a194ad41e07600e40ea77a6d4791fc4c #a194b2ccb96100b36f34c28603436154 {
        width: min(78%, 300px) !important;
        height: auto !important;
        margin: 0 auto 12px !important;
    }

    /* Drilling Fluids: each product becomes an independent, naturally-sized card. */
    #wb_main_a194a6deb07400fe63628b090024a2d4 > .wb_content {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
    }

    #wb_main_a194a6deb07400fe63628b090024a2d4 :is(
        #a194a778a79c008dc2e33f95e20faa3c,
        #a194a8470345006b9d99ff9519a4ae01,
        #a194ac62935600c6cba558425e126b01,
        #a194ac69389600a0d21692cc5b408e61,
        #a194ac7b137e006bef0fc8125aa665ae,
        #a194ac7b139700b3fa92ee2a99cd838e,
        #a194ac86586200f9bfde0d5023c490bd,
        #a194ac86587c0034a4022238960139b7
    ) {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 26px 14px !important;
        overflow: visible !important;
        clear: both !important;
        transform: none !important;
    }

    #wb_main_a194a6deb07400fe63628b090024a2d4 :is(
        #a194a778a79c008dc2e33f95e20faa3c,
        #a194a8470345006b9d99ff9519a4ae01,
        #a194ac62935600c6cba558425e126b01,
        #a194ac69389600a0d21692cc5b408e61,
        #a194ac7b137e006bef0fc8125aa665ae,
        #a194ac7b139700b3fa92ee2a99cd838e,
        #a194ac86586200f9bfde0d5023c490bd,
        #a194ac86587c0034a4022238960139b7
    ) > .wb_content {
        position: relative !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        gap: 18px !important;
        overflow: visible !important;
    }

    #wb_main_a194a6deb07400fe63628b090024a2d4 :is(
        #a194a778a79c008dc2e33f95e20faa3c,
        #a194a8470345006b9d99ff9519a4ae01,
        #a194ac62935600c6cba558425e126b01,
        #a194ac69389600a0d21692cc5b408e61,
        #a194ac7b137e006bef0fc8125aa665ae,
        #a194ac7b139700b3fa92ee2a99cd838e,
        #a194ac86586200f9bfde0d5023c490bd,
        #a194ac86587c0034a4022238960139b7
    ) > .wb_content > .wb_element {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-width: 100% !important;
        max-height: none !important;
        margin: 0 !important;
        overflow: visible !important;
        transform: none !important;
    }

    #wb_main_a194a6deb07400fe63628b090024a2d4 .wb_gallery {
        width: min(100%, 360px) !important;
        height: 330px !important;
        min-height: 330px !important;
        margin: 0 auto !important;
        overflow: hidden !important;
    }

    #wb_main_a194a6deb07400fe63628b090024a2d4 .wb_gallery > .wb_content {
        height: 330px !important;
        min-height: 330px !important;
        overflow: hidden !important;
    }

    #wb_main_a194a6deb07400fe63628b090024a2d4 .wb_gallery img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        max-height: 330px !important;
        object-fit: contain !important;
    }

    #wb_main_a194a6deb07400fe63628b090024a2d4 .wb_text_element {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        overflow: visible !important;
    }

    #wb_main_a194a6deb07400fe63628b090024a2d4 .wb_text_element :is(p, li) {
        font-size: 16px !important;
        line-height: 1.5 !important;
        letter-spacing: 0 !important;
        overflow-wrap: anywhere !important;
    }

    #wb_main_a194a6deb07400fe63628b090024a2d4 .wb_text_element :is(h1, h2, h3, h4) {
        font-size: clamp(22px, 7vw, 30px) !important;
        line-height: 1.18 !important;
        overflow-wrap: anywhere !important;
    }
}

/* v9 final-priority mobile overrides (must remain at the end of this file). */
@media (max-width: 600px) {
    html, body { width: 100% !important; max-width: 100% !important; overflow-x: hidden !important; }
    *, *::before, *::after { box-sizing: border-box !important; }

    .wb-anim, .wb-anim-entry-on, [class*="wb-anim-"] {
        visibility: visible !important;
        opacity: 1 !important;
        animation: none !important;
        transition: none !important;
        transform: none !important;
    }
    .wb_content::before, .wb-layout-element::before, [id^="wb_main_"]::before {
        background-attachment: scroll !important;
    }

    [id^="wb_header_"] {
        position: sticky !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 96px !important;
        min-height: 96px !important;
        margin: 0 !important;
        overflow: hidden !important;
        z-index: 9998 !important;
        background-color: #090909 !important;
    }
    [id^="wb_header_"] > .wb_content {
        position: relative !important;
        height: 96px !important;
        min-height: 96px !important;
        overflow: hidden !important;
    }
    #a188dd97c2cc35b0f21197fc3e85e38d {
        top: 54px !important;
        right: 4px !important;
        left: 76px !important;
        width: auto !important;
        height: 38px !important;
        min-height: 38px !important;
        padding: 0 !important;
    }
    #a188dd97c2cc35b0f21197fc3e85e38d ul,
    #a188dd97c2cc35b0f21197fc3e85e38d ul.hmenu,
    #a188dd97c2cc35b0f21197fc3e85e38d ul.hmenu > li { height: 38px !important; }
    #a188dd97c2cc35b0f21197fc3e85e38d ul.hmenu > li > a {
        height: 36px !important;
        min-height: 36px !important;
        padding: 2px 0 !important;
        font-size: clamp(6px, 1.85vw, 9px) !important;
        line-height: 1 !important;
        letter-spacing: -0.2px !important;
        white-space: nowrap !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
    }

    #a1949206d7f600824202a27c7c05e7e0 {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 12px 4px 22px !important;
        overflow: visible !important;
    }
    #a1949206d7f600824202a27c7c05e7e0 > .wb_content {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: start !important;
        gap: 3px !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
    }
    #a1949206d7f600824202a27c7c05e7e0 > .wb_content > .wb-layout-element,
    #a1949206d7f600824202a27c7c05e7e0 > .wb_content > .wb-layout-element > .wb_content {
        position: relative !important;
        inset: auto !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100% !important;
        height: auto !important;
        min-width: 0 !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 7px !important;
        overflow: visible !important;
    }
    #a1949206d7f600824202a27c7c05e7e0 .wb_element_picture {
        position: relative !important;
        inset: auto !important;
        flex: 0 0 auto !important;
        width: clamp(50px, 15vw, 68px) !important;
        height: clamp(50px, 15vw, 68px) !important;
        min-height: 0 !important;
        margin: 0 auto !important;
    }
    #a1949206d7f600824202a27c7c05e7e0 .wb_element_picture img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        border-radius: 18% !important;
    }
    #a1949206d7f600824202a27c7c05e7e0 .wb_text_element {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 24px !important;
        margin: 0 !important;
        padding: 0 1px !important;
        overflow: visible !important;
    }
    #a1949206d7f600824202a27c7c05e7e0 .wb_text_element :is(h1,h2,h3,h4) {
        margin: 0 !important;
        font-size: clamp(5.4px, 1.65vw, 8px) !important;
        line-height: 1.12 !important;
        letter-spacing: -0.12px !important;
        text-align: center !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
        text-wrap: balance !important;
    }

    #wb_main_a194a6deb07400fe63628b090024a2d4,
    #wb_main_a194a6deb07400fe63628b090024a2d4 > .wb_content {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }
    #wb_main_a194a6deb07400fe63628b090024a2d4 .wb_text_element,
    #wb_main_a194a6deb07400fe63628b090024a2d4 .wb_text_element * { max-width: 100% !important; }
    #wb_main_a194a6deb07400fe63628b090024a2d4 .wb_text_element :is(h1,h2,h3,h4) {
        margin-right: 0 !important;
        margin-left: 0 !important;
        font-size: clamp(18px, 5.35vw, 23px) !important;
        line-height: 1.18 !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
        text-wrap: balance !important;
    }
    #wb_main_a194a6deb07400fe63628b090024a2d4 .wb_text_element :is(p,li) {
        font-size: clamp(14px, 4vw, 17px) !important;
        line-height: 1.45 !important;
        word-break: normal !important;
        overflow-wrap: break-word !important;
    }

    #wb_main_a194ad8480160077a98945fae325a3af,
    #wb_main_a194ad8480160077a98945fae325a3af > .wb_content {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }
    #wb_main_a194ad8480160077a98945fae325a3af > .wb_content,
    #wb_main_a194ad8480160077a98945fae325a3af .wb-layout-horizontal > .wb_content {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        gap: 18px !important;
    }
    #wb_main_a194ad8480160077a98945fae325a3af .wb-layout-horizontal > .wb_content > .wb-layout-element,
    #wb_main_a194ad8480160077a98945fae325a3af .wb-layout-vertical > .wb_content > .wb_element {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
        overflow: visible !important;
    }
    #wb_main_a194ad8480160077a98945fae325a3af .wb_element_picture,
    #wb_main_a194ad8480160077a98945fae325a3af .wb_element_picture .wb_picture_wrap,
    #wb_main_a194ad8480160077a98945fae325a3af .wb_element_picture .wb-picture-wrapper {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 1px !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    #wb_main_a194ad8480160077a98945fae325a3af .wb_element_picture img {
        display: block !important;
        width: min(100%, 520px) !important;
        height: auto !important;
        max-height: none !important;
        margin: 0 auto !important;
        object-fit: contain !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    #wb_main_a194ad8480160077a98945fae325a3af .wb_text_element {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 14px !important;
        overflow: visible !important;
    }
}
