@media (max-width: 1280px) {
}

@media (min-width: 1201px) {
    .menu-toggle {
        display: none;
    }
    .header-wrap .menu > ul > li .sub-menu {
        display: block !important;
    }
    .header-wrap .menu > ul > li .sub-menu li a:hover {
        color: var(--color-primary);
    }
    .header-wrap .menu > ul > li:hover .nav-link-toggle,
    .header-wrap .menu > ul > li:hover > a {
        color: var(--color-primary);
    }
    .header-wrap .menu > ul > li:hover .nav-link-toggle svg {
        transform: rotate(180deg);
    }
}
@media (max-width: 1200px) {
    .header-wrap {
        --header-height: 80px;
        height: var(--header-height);
    }
    .header-wrap .container {
        height: 100%;
    }
    .header-menu {
        position: fixed;
        top: var(--header-height);
        right: -100%;
        height: calc(100dvh - var(--header-height));
        width: 100%;
        background: var(--color-iron-core);
        overflow: auto;
        transition: var(--transition);
    }
    .header-wrap.menu-show .header-menu {
        right: 0;
    }
    .header-wrap .menu > ul {
        flex-direction: column;
        gap: 0;
    }
    .header-wrap .menu > ul > li {
        padding: 0;
        flex-wrap: wrap;
        gap: 0;
        justify-content: space-between;
        border-bottom: 1px solid var(--color-gray-20);
    }
    .header-wrap .menu > ul > li > a {
        padding: var(--size-10) var(--size-20);
    }
    .header-wrap .menu > ul > li .nav-link-toggle {
        width: 44px;
        height: 44px;
        pointer-events: all;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(255, 255, 255, 0.1);
    }
    .header-wrap .menu > ul > li .nav-link-toggle svg {
        transition: var(--transition);
    }
    .header-wrap .menu > ul > li .nav-link-toggle.open svg {
        transform: rotate(180deg);
    }
    .header-wrap .menu > ul > li .sub-menu {
        position: relative;
        width: 100%;
        left: 0;
        transform: translate(0, 0);
        transition: none;
        opacity: 1;
        visibility: visible;
        background: rgba(255, 255, 255, 0.1);
        display: none;
        border: 0;
        border-radius: 0;
    }
    .header-wrap .menu > ul > li .sub-menu li a {
        padding: var(--size-10) var(--size-40);
        text-align: left;
    }
    .header-wrap .header-search {
        position: fixed;
        height: var(--header-height);
        padding: 0 var(--size-20);
    }
    .header-wrap .header-search .search-toggle {
        display: block;
    }
    .quick-links ul li a {
        min-width: 160px;
    }
    .arc-wrap {
        top: -110px;
    }
    .product-list-wrap {
        padding: 0;
    }
    .product-list {
        margin: 0 -12px;
    }
    .product-list .product-list-item {
        padding: 0 12px;
    }
}
@media (max-width: 1100px) {
    .our-platform-tab .services-tabs .tab-nav-item {
        padding: 12px 24px;
    }
}
@media (max-width: 1024px) {
    .banner-bg-img.cover-img {
        object-fit: cover;
    }
    .advantage-item:hover:before,
    .advantage-item:focus:before {
        left: -152px;
    }
    .advantage-item:hover .advantage-item-content,
    .advantage-item:focus .advantage-item-content {
        padding-left: 24px;
    }
    .advantage-list-wrap .cascade-lines {
        display: none;
    }
    .featured-solutions-section .title-wrap :is(h1, h2, h3, h4, h5, h6) {
        width: 45%;
    }
    .services-tabs {
        gap: var(--size-24);
    }
    .qhse-logo-shape {
        display: none;
    }
    .team-row-wrap .cascade-lines {
        display: none;
    }
    .team-bio-row {
        padding: 0 24px 24px;
    }
    .team-bio-photo {
        width: 300px;
    }
    .product-info-popup .team-bio-photo {
        width: 300px;
    }
    .wellhead-accordion-content {
        padding: 14px 24px 24px;
    }
}

@media (max-width: 991px) {
    .footer-wrap .footer-top .container {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }
    .footer-top-logo {
        text-align: center;
        border-bottom: 1px solid var(--color-gray-20);
        margin: 0 -16px;
        padding: 16px 0;
    }
    .footer-top-menu {
        justify-content: center;
    }
    .quick-links ul {
        border-left: 0;
    }
    .footer-bottom-row {
        flex-direction: column;
        align-items: center;
    }
    .footer-wrap .footer-bottom .container {
        gap: var(--size-10);
    }
    .copyright {
        text-align: center;
    }
    .arc-wrap {
        top: -90px;
    }
    .solutions-list .solutions-list-item,
    .solutions-list .solutions-list-item.is-half-width {
        width: 100%;
    }
    .is-half-width .solution-item .solution-item-shape {
        width: 88px;
        height: 185px;
    }
    .solution-item {
        min-height: 300px;
    }
    .testimonial-slider {
        --slide-size: 50%;
    }
    .technology-item .technology-item-shape {
        max-width: 290px;
    }
    .served-row {
        flex-direction: column;
        gap: var(--size-24);
    }
    .served-row .served-col-left {
        width: 100%;
        display: flex;
        flex-direction: column;
    }
    .served-row .title-wrap {
        max-width: 560px;
        order: 1;
    }
    .served-row .served-cta {
        padding-top: 0;
        padding-bottom: var(--size-40);
        order: 2;
    }
    .served-row .map-legend-wrap {
        order: 3;
    }
    .served-row .title-wrap {
        max-width: 560px;
    }
    .served-row .served-col-right img {
        width: 100%;
    }
    .about-intro-row {
        flex-direction: column;
        gap: var(--size-24);
    }
    .qhse-row {
        flex-direction: column;
        gap: var(--size-24);
    }
    .team-card-photo {
        height: auto;
        aspect-ratio: 1 / 1.1;
    }
    .contact-card {
        flex-direction: column;
        gap: var(--size-24);
    }
    .contact-info {
        width: 100%;
    }
    .contact-card-shape {
        display: none;
    }
    .wellhead-row .wellhead-col-right {
        width: 300px;
    }
    .career-item,
    .whr-item {
        flex-direction: column;
        align-items: stretch;
        gap: var(--size-16);
    }
    .career-item-content {
        flex-direction: column;
        gap: var(--size-16);
    }
    .career-item-meta {
        width: 100%;
    }
    .mission-vision-list.is-4-col .mission-vision-list-item {
        width: 50%;
    }
    .product-list .product-list-item {
        width: 50%;
    }
    .resouces-desc {
        padding: 22px 15px;
    }
    .our-platform-tab .innovation-info {
        gap: 30px;
        flex-direction: column-reverse;
    }
    .our-platform-tab .innovation-info .services-img {
        width: 100%;
    }
    .our-platform-tab .innovation-info .services-desc .desc-box {
        max-width: 100%;
    }

}

@media (max-width: 767px) {
    :root {
        --font-h1: 28px;
        --font-h1-small: 24px;
        --font-h2: 22px;
        --font-h3: 18px;
        --font-h4: 16px;
        --font-h5: 24px;
        --font-h6: 20px;
        --text-xl: 20px;
    }
    .is-pt-80 {
        padding-top: var(--size-48) !important;
    }
    .is-pb-64 {
        padding-bottom: var(--size-48) !important;
    }
    .header-wrap .container {
        gap: var(--size-8);
    }
    .footer-top-menu {
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
        padding-bottom: 16px;
    }
    .quick-links ul {
        flex-direction: column;
        align-items: stretch;
    }
    .quick-links ul li {
        border-right: 0;
        border-bottom: 1px solid var(--color-gray-20);
    }
    .quick-links ul li a {
        padding: 16px 0px;
    }
    .footer-bottom-row {
        align-items: flex-start;
    }
    .footer-contact-info ul {
        flex-direction: column;
        gap: var(--size-10);
    }
    .copyright {
        text-align: left;
    }
    .social-share {
        padding: 0;
    }
    .banner-section {
        padding-top: var(--size-48);
    }
    .arc-wrap {
        display: none;
    }
    .advantage-list .advantage-list-item {
        width: 100%;
    }
    .advantage-item:hover:before,
    .advantage-item:focus:before {
        left: -116px;
    }
    .advantage-item:hover .advantage-item-content,
    .advantage-item:focus .advantage-item-content {
        padding-left: 64px;
    }
    .advantage-section {
        padding: var(--size-32) 0;
    }
    .featured-solutions-section {
        padding-top: var(--size-32);
        padding-bottom: var(--size-32);
    }
    .featured-solutions-section .title-wrap {
        flex-direction: column;
        gap: 16px;
        padding-bottom: var(--size-32);
        text-align: center;
    }
    .featured-solutions-section .title-wrap :is(h1, h2, h3, h4, h5, h6) {
        width: 100%;
    }
    .solution-item {
        min-height: 400px;
    }
    .is-half-width .solution-item {
        min-height: 580px;
    }
    .is-half-width .solution-item .solution-item-img {
        max-width: 140px;
    }

    .services-section {
        padding: var(--size-48) 0;
    }
    .services-section-title-wrap {
        padding-bottom: var(--size-16);
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .services-section-title-wrap .services-section-title {
        font-size: var(--size-14);
    }
    .services-section .container > .title-wrap {
        grid-template-columns: 1fr;
        gap: var(--size-16);
    }
    .services-tabs {
        flex-direction: column;
        gap: var(--size-24);
        padding-top: var(--size-24);
    }
    .services-tabs .tab-nav-wrap {
        width: 100%;
    }
    .services-tabs .tab-nav {
        width: 100%;
        position: relative;
    }
    .services-tabs .services-tabs-toggle {
        display: flex;
    }
    .services-tabs .tab-nav-item:not(.active) {
        max-height: 0;
        overflow: hidden;
        padding-top: 0;
        padding-bottom: 0;
        border-bottom: 0;
    }
    .services-tabs .active .tab-nav-item:not(.active) {
        max-height: 51px;
        overflow: hidden;
        padding-top: var(--size-16);
        padding-bottom: var(--size-16);
        border-bottom: 1px solid rgba(108, 125, 146, 0.24);
    }
    .services-tabs .tab-nav-item.active {
        max-height: 51px;
    }
    .services-tabs .tab-nav-item {
        padding: var(--size-16) var(--size-12);
    }
    .services-tabs .tab-nav-item .btn-icon {
        display: none;
    }
    .services-tabs .tab-nav-cta {
        display: none;
    }
    .services-tabs .tab-nav-cta.is-mobile {
        display: block;
        text-align: center;
        padding-top: var(--size-24);
    }
    .services-tabs .tab-nav-wrap .title-wrap {
        padding-bottom: var(--size-24);
        text-align: center;
    }
    .testimonial-section {
        padding: var(--size-48) 0;
    }
    .testimonial-section .title-wrap {
        padding-bottom: var(--size-32);
    }
    .testimonial-slider {
        --slide-size: 100%;
    }
    .testimonial-item {
        padding: 24px;
    }
    .cta-section .cta-shape {
        display: none;
    }
    .cta-section-box .cta-img {
        width: 45%;
    }
    .technologies-section {
        padding: var(--size-48) 0;
    }
    .technologies-list .technologies-list-item {
        width: 100%;
    }
    .technologies-bg-img.cover-img {
        object-fit: cover;
    }
    .served-section {
        padding: var(--size-48) 0;
    }
    .served-row .served-col-left {
        text-align: center;
    }
    .map-legend-list {
        flex-direction: column;
        align-items: center;
    }
    .inner-banner-section {
        padding: 48px 0 56px;
        min-height: 280px;
    }
    .mission-vision-list .mission-vision-list-item {
        width: 100%;
    }
    .about-intro-section {
        padding: var(--size-48) 0;
    }
    .about-intro-img-wrap {
        aspect-ratio: 1 / 0.7;
    }
    .about-intro-img-wrap .about-intro-img {
        clip-path: polygon(0 0, calc(100% - 44px) 0, 100% 44px, 100% 100%, 0 100%);
    }
    .about-intro-img-wrap .about-intro-shape {
        max-width: 180px;
    }
    .qhse-section {
        padding: var(--size-48) 0;
    }
    .qhse-cards {
        grid-template-columns: 1fr;
        width: 100%;
    }
    .qhse-item p {
        max-width: 100%;
    }
    .qhse-item {
        min-height: auto;
    }
    .qhse-section .qhse-bg-img {
        height: 110%;
    }
    .team-section {
        padding: var(--size-48) 0;
    }
    .team-row {
        row-gap: 24px;
    }
    .team-card {
        width: 50%;
    }
    .team-card-info {
        padding-right: 8px;
    }
    .team-row-wrap + .team-row-wrap {
        margin-top: 24px;
    }
    .team-bio-row {
        flex-direction: column;
    }
    .team-bio-photo {
        width: 100%;
        max-width: 320px;
        margin: 0 auto;
        padding-top: 0;
    }
    .product-info-popup .team-bio-photo {
        width: 100%;
    }
    .privacy-content-wrap {
        padding: 24px;
    }
    .inner-banner-section .inner-banner-bg-img {
        top: -160px;
    }
    .contact-section {
        padding: var(--size-48) 0 var(--size-56);
    }
    .contact-card {
        padding: 0;
        gap: 0;
    }
    .contact-info {
        padding: var(--size-24);
    }
    .form-row {
        flex-direction: column;
        gap: var(--size-16);
    }
    .wellhead-systems-section {
        padding: var(--size-48) 0;
    }
    .wellhead-row {
        flex-direction: column;
        gap: var(--size-24);
    }
    .wellhead-row .wellhead-col-right {
        width: 100%;
        gap: var(--size-24);
    }
    .wellhead-accordion .accordion-header {
        padding-left: var(--size-16);
    }
    .wellhead-accordion-content {
        padding: 0 var(--size-16) var(--size-24);
    }
    .wellhead-content-block {
        gap: var(--size-24);
    }
    .wellhead-content-block-text {
        padding-top: var(--size-16);
    }
    .wellhead-row .wellhead-col-right .btn-group {
        flex-direction: column;
        gap: 10px;
    }
    .wellhead-row .wellhead-col-right .btn-group .btn {
        justify-content: space-between;
    }
    .wellhead-row-list .wellhead-row:nth-child(2n) {
        flex-direction: column;
    }
    .wellhead-key-features.is-list-two-column ul {
        grid-template-columns: 1fr;
    }
    .wellhead-accordion-content > .btn-group {
        padding-top: var(--size-24);
    }
    .patents-section {
        padding: var(--size-48) 0 var(--size-56);
    }
    .patent-item-row {
        grid-template-columns: 1fr;
        grid-template-areas: 'heading' 'desc' 'cta';
    }
    .patent-item-cta {
        padding-left: 0;
    }
    .patent-item-title,
    .whr-title {
        max-width: 100%;
    }
    .career-section {
        padding: var(--size-48) 0;
    }
    .mission-vision-list.is-4-col .mission-vision-list-item {
        width: 100%;
    }
    .mission-vision-list.is-3-col .mission-vision-list-item {
        width: 100%;
    }
    .product-section {
        padding: var(--size-48) 0;
    }
    .product-info-action {
        display: none;
    }
    .product-info-action.is-mobile {
        display: flex;
        flex-direction: column;
        padding: var(--size-24) 0;
    }
    .services-page-section {
        padding: var(--size-48) 0;
    }
    .patent-item.is-hover-button-show .patent-item-cta,
    .patent-item .patent-item-cta {
        opacity: 1;
        visibility: visible;
    }
    .resouces-list-item {
        width: 100%;
    }
    .resouces-nav ul li a {
        padding: 2px 13px;
    }
    .our-platform-tab .services-tabs .tab-nav-item {
        width: 100%;
    }
    .innovation-section .container > .title-wrap {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
    .our-platform-tab .innovation-info .services-desc ul {
        flex-direction: column;
        gap: 20px;
        display: flex;
    }
    .our-platform-tab .services-tabs .tab-nav-cta {
        display: block;
    }
}

@media (max-width: 500px) {
    .technology-item .technology-item-shape {
        max-width: 260px;
    }
    .technology-item .technology-item-img {
        max-width: 150px;
    }
    .technology-item:hover .technology-item-img {
        top: 30px;
    }
    .inner-banner-section {
        padding: 40px 0 40px;
    }
    .inner-banner-section .title-wrap {
        max-width: 320px;
    }
    .product-list .product-list-item {
        width: 100%;
    }
}