* {
    box-sizing: border-box
}


html {
    scroll-behavior: smooth
}

body {
    margin: 0;
    color: #1c1c1c;
    font-family: Arial, "Helvetica Neue", sans-serif
}

a {
    text-decoration: none;
    color: inherit;
    cursor: pointer
}

img {
    display: block
}

button,
input,
textarea {
    font: inherit
}

:root {
    --content: 1600px
}
.topbar {
    height: 81px;
    position: absolute;
    z-index: 20;
    top: 36px;
    left: 3%;
    right: 3%;
    background: #fff;
    border-radius: 5px;
    display: flex;
    align-items: center;
    padding: 0 36px;
    box-shadow: 0 2px 10px #0001
}

.topbar>a img {
    width: 142px;
    height: 53px;
    object-fit: contain
}

.topbar nav {
    display: flex;
    gap: 30px;
    margin-left: auto
}

.topbar nav a {
    font-size: 14px;
    padding: 32px 0
}

.topbar nav a:first-child {
    color: #e47719
}

.tools {
    margin-left: 30px;
    display: flex;
    align-items: center;
    gap: 18px;
    font-size: 16px
}

.tools button {
    border: 0;
    background: none;
    font-size: 20px
}

.hamb {
    display: none
}

.hero {
    height: 715px;
    position: relative;
    overflow: hidden;
    background: #0a1930
}

.hero-slide {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: .7s
}

.hero-slide.is-on {
    opacity: 1
}

.hero-copy {
    position: absolute;
    left: 7.5%;
    top: 49%;
    transform: translateY(-50%);
    color: white;
    max-width: 700px
}

.hero-copy h2 {
    font-size: 54px;
    line-height: 1.08;
    margin: 0 0 18px
}

.hero-copy p {
    font-size: 22px;
    margin: 0 0 28px
}

.hero-copy a,
.sol-copy a,
.why-left>a,
.more {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    width: 154px;
    padding-bottom: 10px;
    border-bottom: 1px solid currentColor;
    font-size: 14px
}

.hero-dots {
    position: absolute;
    z-index: 4;
    bottom: 25px;
    left: 50%;
    display: flex;
    gap: 12px
}

.hero-dots button {
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 9px;
    background: #fff8
}

.hero-dots .on {
    width: 25px;
    background: #fff
}

main {
    padding-top: 81px
}

.catalog {
    height: 716px;
    padding: 0 3%;
    max-width: 1440px;
    margin: auto
}

.heading,
.sol-title {
    height: 150px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.heading>div,
.sol-title>div {
    display: flex;
    align-items: center;
    gap: 17px
}

.heading i,
.sol-title i {
    width: 7px;
    height: 7px;
    background: #ee7619;
    border-radius: 50%
}

.heading h2,
.sol-title h2 {
    font-size: 36px;
    margin: 0;
    font-weight: 500
}

.heading>p,
.sol-title>p {
    font-size: 16px;
    color: #777
}

.cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px
}

.cards article {
    position: relative
}

.pic {
    height: 327px;
    background: #f3f5f6;
    position: relative;
    overflow: hidden;
    display: grid;
    place-items: center
}

.pic>img:not(.water) {
    width: 78%;
    height: 88%;
    object-fit: contain;
    position: relative;
    z-index: 2
}

.pic .water {
    position: absolute;
    width: 105%;
    left: -2%;
    top: 25%;
    opacity: .23
}

.cards h3 {
    font-size: 22px;
    font-weight: 500;
    margin: 24px 0 16px
}

.cards a {
    font-size: 16px;
    color: #666
}

.cards a b,
.sol-copy a b,
.why-left>a b,
.more b {
    color: #f07818
}

.solutions {
    height: 948px;
    position: relative;
    color: white;
    overflow: hidden
}

.sol-title {
    height: 142px;
    padding: 0 3%;
    color: #222;
    background: white
}

.sol-bg {
    position: absolute;
    top: 142px;
    bottom: 0;
    width: 100%;
    background: url('../images/guanyu-substation-project.webp') center/cover no-repeat
}

.sol-bg:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, #101a26dc, #101a2630)
}

.sol-copy {
    position: absolute;
    left: 3%;
    top: 235px;
    width: 620px
}

.sol-copy h3 {
    font-size: 38px;
    line-height: 1.2;
    margin: 0 0 25px
}

.sol-copy p {
    font-size: 18px;
    line-height: 1.8;
    color: #ffffffd0
}

.sol-copy a {
    margin-top: 20px
}

.sol-tabs {
    position: absolute;
    left: 3%;
    right: 3%;
    bottom: 55px;
    height: 112px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid #ffffff55
}

.sol-tabs div {
    display: flex;
    align-items: center;
    gap: 24px;
    border-right: 1px solid #ffffff55;
    padding: 20px
}

.sol-tabs img {
    width: 68px;
    max-height: 61px;
    object-fit: contain
}

.sol-tabs span {
    font-size: 17px
}

.why {
    height: 818px;
    padding: 90px 3% 70px;
    display: grid;
    grid-template-columns: 38% 62%;
    position: relative;
    overflow: hidden
}

.why .heading {
    height: auto
}

.why-left>p {
    color: #777;
    font-size: 14px;
    line-height: 1.9;
    margin: 35px 0 25px
}

.stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-top: 55px;
    gap: 30px
}

.stats strong {
    font-size: 40px;
    font-weight: 500;
    display: block
}

.stats strong sup {
    color: #f07818;
    font-size: 22px
}

.stats span {
    font-size: 16px;
    color: #777
}

.map {
    position: relative
}

.map>img:first-child {
    position: absolute;
    width: 835px;
    height: 497px;
    object-fit: contain;
    top: 67px;
    left: 10px
}

.case {
    position: absolute;
    width: 175px;
    height: 105px;
    object-fit: cover;
    box-shadow: 0 5px 20px #0004
}

.c1 {
    top: 7px;
    right: 114px
}

.c2 {
    top: 75px;
    left: 82px
}

.c3 {
    top: 176px;
    right: -2px
}

.news {
    height: 928px;
    background: #f5f5f5;
    padding: 0 3%
}

.news-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 45px
}

.feature {
    position: relative
}

.feature>img {
    width: 100%;
    height: 422px;
    object-fit: cover
}

.date {
    display: flex;
    align-items: end;
    gap: 10px;
    color: #e97818;
    margin-top: 22px
}

.date b {
    font-size: 34px
}

.date span {
    font-size: 16px
}

.feature h3 {
    font-size: 19px;
    line-height: 1.4;
    margin: 10px 0
}

.feature p,
.news-list p {
    font-size: 16px;
    line-height: 1.6;
    color: #777
}

.news-list article {
    display: grid;
    grid-template-columns: 209px 1fr;
    gap: 24px;
    height: 204px;
    padding-bottom: 28px;
    margin-bottom: 0;
    border-bottom: 1px solid #ddd
}

.news-list img {
    width: 209px;
    height: 176px;
    object-fit: cover
}

.news-list h3 {
    font-size: 17px;
    line-height: 1.35;
    margin: 0 0 12px
}

.news-list p {
    margin: 0
}

.news-list time {
    display: block;
    color: #999;
    font-size: 12px;
    margin-top: 12px
}

.more {
    margin-top: 20px
}

footer {
    height: 630px;
    background: #14202d;
    color: #fff
}

.footnav {
    height: 110px;
    border-bottom: 1px solid #ffffff20;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 70px
}

.footnav a {
    font-size: 18px
}

.footmain {
    height: 455px;
    padding: 28px 3%;
    display: grid;
    grid-template-columns: 1.25fr 1fr .7fr 1.15fr;
    gap: 50px
}

.footmain h3 {
    font-size: 18px;
    font-weight: 500;
    margin: 0 0 24px
}

.footmain>div {
    display: flex;
    flex-direction: column;
    gap: 17px
}

.footmain a,
.footmain p {
    font-size: 16px;
    line-height: 1.65;
    color: #b7c0ca
}

.contact img {
    width: 172px;
    height: 65px;
    object-fit: contain;
    margin-bottom: 10px
}

.footmain form {
    display: flex;
    flex-direction: column
}

.footmain input,
.footmain textarea {
    background: transparent;
    border: 0;
    border-bottom: 1px solid #ffffff35;
    padding: 13px 4px;
    color: white;
    outline: 0
}

.footmain textarea {
    height: 80px
}

.footmain button {
    height: 44px;
    margin-top: 22px;
    background: #ef7918;
    color: white;
    border: 0;
    border-radius: 20px;
}

.copyright {
    height: 60px;
    border-top: 1px solid #ffffff20;
    padding: 22px 3%;
    font-size: 14px;
    color: #758190
}

aside {
    position: fixed;
    z-index: 30;
    right: 0;
    bottom: 100px;
    background: #fff;
    box-shadow: 0 2px 10px #0002;
    display: flex;
    flex-direction: column
}

aside a {
    width: 43px;
    height: 43px;
    display: grid;
    place-items: center;
    border-bottom: 1px solid #eee;
    color: #ef7918
}

.reveal {
    opacity: 0;
    transform: translateY(20px)
}

@media(max-width:800px) {
    .topbar {
        top: 10px;
        left: 10px;
        right: 10px;
        height: 65px;
        padding: 0 18px
    }

    .topbar nav {
        display: none
    }

    .tools {
        margin-left: auto
    }

    .hamb {
        display: block
    }

    .hero {
        height: 620px
    }

    .hero-copy {
        left: 25px;
        right: 25px
    }

    .hero-copy h2 {
        font-size: 40px
    }

    .catalog,
    .solutions,
    .why,
    .news,
    footer {
        height: auto
    }

    .catalog {
        padding: 50px 20px
    }

    .heading,
    .sol-title {
        height: auto;
        margin-bottom: 35px;
        align-items: flex-start;
        gap: 15px
    }

    .cards {
        grid-template-columns: 1fr
    }

    .solutions {
        padding-top: 50px;
        background: white
    }

    .sol-title {
        padding: 0 20px
    }

    .sol-bg {
        position: relative;
        top: auto;
        height: 700px
    }

    .sol-copy {
        top: 220px;
        left: 30px;
        width: auto;
        right: 30px
    }

    .sol-tabs {
        grid-template-columns: 1fr;
        bottom: 20px;
        height: auto
    }

    .why {
        padding: 70px 20px;
        grid-template-columns: 1fr
    }

    .map {
        height: 500px
    }

    .map>img:first-child {
        width: 100%;
        left: 0
    }

    .case {
        display: none
    }

    .news {
        padding: 50px 20px
    }

    .news-grid {
        grid-template-columns: 1fr
    }

    .footnav {
        gap: 15px;
        flex-wrap: wrap
    }

    .footmain {
        height: auto;
        grid-template-columns: 1fr;
        padding: 45px 20px
    }

    .copyright {
        height: auto
    }
}

.catalog {
    margin-bottom: 81px
}

.solutions {
    margin-bottom: 80px
}

.why {
    margin-bottom: 72px
}

@media(max-width:800px) {

    .catalog,
    .solutions,
    .why {
        margin-bottom: 0
    }
}

/* precision alignment pass */
.hero-copy {
    left: 43px;
    right: 43px;
    top: 129px;
    transform: none;
    max-width: none
}

.hero-copy h2 {
    font-size: 24px;
    line-height: 42px;
    font-weight: 550;
    margin: 0;
    color: #222
}

.hero-copy p {
    font-size: 22px;
    line-height: 33px;
    margin: 18px 0;
    color: #fff
}

.hero-copy a {
    color: #222
}

.catalog {
    position: relative
}

.catalog>.heading,
.sol-title {
    height: 142px;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    text-align: center
}

.catalog>.heading>div,
.sol-title>div {
    height: 60px;
    justify-content: center
}

.catalog>.heading h2,
.sol-title h2,
.news>.heading h2,
.why .heading h2 {
    font-size: 40px;
    font-weight: 550;
}

.catalog>.heading>p,
.sol-title>p {
    margin: 7px 0 0
}

.cards {
    padding-top: 29px
}

.cards article {
    display: flex;
    flex-direction: column
}

.cards h3 {
    order: 1;
    height: 33px;
    line-height: 33px;
    margin: 0 29px;
    font-size: 22px;
    font-weight: 550;
    padding-left: 29px
}

.cards .pic {
    order: 2;
    margin-top: 54px
}

.cards article>a {
    order: 3;
    margin: 24px 29px 0;
    padding-left: 29px
}

.sol-title {
    height: 142px;
    padding-top: 0
}

.sol-copy {
    left: 88px;
    top: 257px;
    width: 676px
}

.sol-copy h3 {
    font-size: 22px;
    line-height: 33px;
    font-weight: 550;
    margin-bottom: 20px
}

.sol-copy p {
    font-size: 14px;
    line-height: 24px;
    width: 650px
}

.why {
    padding-top: 0
}

.why-left {
    padding-top: 0
}

.why .heading {
    height: 60px;
    transform: translateY(-20px)
}

.why .heading>div {
    gap: 17px
}

.why-left>p {
    margin-top: 41px
}

.stats strong {
    font-size: 24px;
    line-height: 75px
}

.stats {
    margin-top: 45px;
    gap: 33px
}

.stats div {
    height: 150px
}

.news {
    position: relative
}

.news>.heading {
    flex-direction: column;
    justify-content: flex-start;
    text-align: center;
    padding-top: 0
}

.news>.heading>div {
    height: 60px;
    transform: translateY(-21px)
}

.news>.heading>p {
    margin: -13px 0 0
}

.news-grid {
    margin-top: 0
}

.feature h3 {
    font-size: 18px;
    font-weight: 550;
    line-height: 27px
}

.news-list h3 {
    font-size: 18px;
    font-weight: 400;
    line-height: 27px
}

.motion {
    opacity: 0;
    transform: translate3d(0, 54px, 0);
    transition: opacity 1.15s cubic-bezier(.2, .7, .2, 1), transform 1.15s cubic-bezier(.2, .7, .2, 1);
    will-change: opacity, transform
}

.motion.from-left {
    transform: translate3d(-55px, 0, 0)
}

.motion.from-right {
    transform: translate3d(55px, 0, 0)
}

.motion.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0)
}

.cards article:nth-child(2),
.sol-tabs>div:nth-child(2),
.stats>div:nth-child(2) {
    transition-delay: .12s
}

.cards article:nth-child(3),
.sol-tabs>div:nth-child(3),
.stats>div:nth-child(3) {
    transition-delay: .24s
}

.stats>div:nth-child(4) {
    transition-delay: .34s
}

@media(max-width:800px) {
    .hero-copy {
        left: 25px;
        right: 25px;
        top: 190px
    }

    .hero-copy h2 {
        font-size: 36px;
        line-height: 1.2;
        color: #fff
    }

    .catalog>.heading,
    .sol-title {
        align-items: flex-start;
        text-align: left
    }

    .cards h3 {
        padding-left: 0;
        margin-left: 0
    }

    .why .heading,
    .news>.heading>div {
        transform: none
    }

    .news>.heading {
        align-items: flex-start;
        text-align: left
    }

    .motion {
        transform: translate3d(0, 35px, 0)
    }
}

/* final measured alignment */
.catalog>.heading>div,
.sol-title>div,
.news>.heading>div {
    position: relative;
    gap: 0
}

.catalog>.heading i,
.sol-title i,
.news>.heading i {
    position: absolute;
    left: -24px
}

.why .heading>div {
    gap: 0
}

.why .heading i {
    display: none
}

.why .heading h2 {
    transform: translateX(-24px)
}

.cards {
    grid-template-columns: repeat(3, 376px);
    gap: 84px;
    padding-left: 29px;
    padding-right: 29px
}

.pic>img:not(.water) {
    width: 87%;
    height: 100%
}

.news-grid {
    grid-template-columns: 668px 1fr;
    gap: 59px
}

.why .heading h2 {
    transform: none
}

.cards h3 {
    margin: 0 0 29px;
    padding-left: 0;
    width: 376px
}

.cards article>a {
    margin-left: 0;
    padding-left: 0
}

.topbar {
    width: min(calc(100% - 48px), var(--content));
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    padding: 0 34px
}

.topbar>a {
    flex: 0 0 190px
}

.topbar .main-nav {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: stretch;
    gap: 8px;
    height: 100%;
    margin: 0
}

.main-nav .nav-item {
    height: 100%;
    position: relative;
    display: flex;
    align-items: center
}

.main-nav .nav-item>a {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 100%;
    padding: 0 18px;
    font-size: 16px;
    font-weight: 500;
    white-space: nowrap;
    position: relative
}

.main-nav .nav-item>a:after {
    content: "";
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 0;
    height: 3px;
    background: #ed7618;
    transform: scaleX(0);
    transition: transform .28s
}

.main-nav .nav-item:hover>a {
    color: #e67318
}

.main-nav .nav-item:hover>a:after {
    transform: scaleX(1)
}

.main-nav .nav-item>a span {
    font-size: 11px;
    color: #999;
    transition: transform .25s
}

.main-nav .nav-item:hover>a span {
    transform: rotate(180deg)
}

.dropdown {
    position: absolute;
    left: 50%;
    top: calc(100% - 1px);
    min-width: 240px;
    padding: 12px 0;
    background: #fff;
    border-top: 3px solid #ed7618;
    box-shadow: 0 14px 35px rgba(18, 32, 49, .16);
    opacity: 0;
    visibility: hidden;
    transform: translate(-50%, 14px);
    transition: opacity .25s, transform .25s, visibility .25s
}

.nav-item:hover .dropdown {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0)
}

.dropdown a {
    display: block;
    padding: 12px 20px;
    font-size: 13px;
    line-height: 1.35;
    color: #555;
    white-space: nowrap;
    transition: .2s
}

.dropdown a:hover {
    color: #ed7618;
    background: #f7f8f9;
    padding-left: 25px
}

.tools {
    margin-left: auto
}

.catalog,
.why,
.news {
    width: min(100%, var(--content));
    max-width: var(--content);
    padding-left: 40px;
    padding-right: 40px
}

.sol-title,
.sol-copy,
.sol-tabs {
    --side: max(40px, calc((100vw - var(--content))/2 + 40px))
}

.sol-title {
    padding-left: var(--side);
    padding-right: var(--side)
}

.sol-copy {
    left: var(--side)
}

.sol-tabs {
    left: var(--side);
    right: var(--side)
}

.hero,
.solutions,
.sol-bg,
footer {
    width: 100%
}

.catalog>.heading.motion {
    transition-duration: 1.25s
}

.cards article.motion {
    transition-duration: 1.15s
}

.cards article:nth-child(1) {
    transition-delay: .08s
}

.cards article:nth-child(2) {
    transition-delay: .2s
}

.cards article:nth-child(3) {
    transition-delay: .32s
}

.cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(30px, 4vw, 84px);
    padding-left: 29px;
    padding-right: 29px
}

.cards h3,
.cards .pic {
    width: 100%
}

.news-grid {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
    gap: 58px;
    align-items: start
}

.feature>img {
    width: 100%;
    height: 422px
}

.news-list {
    display: flex;
    flex-direction: column
}

.news-list article {
    grid-template-columns: 220px minmax(0, 1fr);
    height: 204px;
    gap: 26px;
    align-items: start
}

.news-list img {
    width: 220px;
    height: 176px
}

.news-list article>div {
    height: 176px;
    display: flex;
    flex-direction: column
}

.news-list h3 {
    margin: 0 0 10px
}

.news-list p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.news-list time {
    margin-top: auto
}

.more {
    align-self: flex-start
}

@media(min-width:1681px) {

    .catalog,
    .why,
    .news {
        padding-left: 0;
        padding-right: 0
    }

    .feature>img {
        height: 460px
    }

    .news-list article {
        grid-template-columns: 245px 1fr
    }

    .news-list img {
        width: 245px
    }
}

@media(max-width:1180px) {
    .topbar .main-nav {
        gap: 0
    }

    .main-nav .nav-item>a {
        font-size: 14px;
        padding: 0 10px
    }

    .topbar>a {
        flex-basis: 165px
    }

    .catalog,
    .why,
    .news {
        padding-left: 30px;
        padding-right: 30px
    }
}

@media(max-width:800px) {
    .topbar {
        width: calc(100% - 20px);
        left: 50%;
        right: auto
    }

    .topbar .main-nav {
        position: fixed;
        left: 10px;
        right: 10px;
        top: 75px;
        height: auto;
        transform: none;
        display: none;
        background: #fff;
        box-shadow: 0 14px 30px #0002;
        align-items: stretch
    }

    .topbar .main-nav.open {
        display: flex;
        flex-direction: column
    }

    .main-nav .nav-item {
        height: auto;
        display: block
    }

    .main-nav .nav-item>a {
        height: 48px;
        padding: 0 20px
    }

    .dropdown {
        position: static;
        display: none;
        transform: none;
        opacity: 1;
        visibility: visible;
        box-shadow: none;
        border-top: 0;
        background: #f5f6f7;
        padding: 4px 0
    }

    .nav-item:hover .dropdown {
        display: block;
        transform: none
    }

    .dropdown a {
        padding-left: 35px
    }

    .catalog,
    .why,
    .news {
        padding-left: 20px;
        padding-right: 20px
    }

    .news-grid {
        grid-template-columns: 1fr
    }

    .news-list article {
        grid-template-columns: 160px 1fr
    }

    .news-list img {
        width: 160px
    }

    .sol-title {
        padding-left: 20px;
        padding-right: 20px
    }

    .sol-copy {
        left: 30px
    }

    .sol-tabs {
        left: 20px;
        right: 20px
    }
}

.content-1600 {
    width: min(calc(100% - 80px), 1200px);
    margin-left: auto;
    margin-right: auto
}

.topbar.content-1600 {
    left: 50%;
    right: auto;
    margin: 0;
    transform: translateX(-50%)
}

.catalog.content-1600,
.why.content-1600,
.news.content-1600 {
    padding-left: 0;
    padding-right: 0
}

.sol-title.content-1600 {
    padding-left: 0;
    padding-right: 0
}

.solutions {
    width: 100%;
    max-width: none
}

.sol-copy {
    left: max(40px, calc((100vw - 1600px)/2))
}

.sol-tabs {
    left: max(40px, calc((100vw - 1600px)/2));
    right: max(40px, calc((100vw - 1600px)/2))
}

footer {
    padding-left: 0;
    padding-right: 0
}

.footnav.content-1600,
.footmain.content-1600,
.copyright.content-1600 {
    padding-left: 0;
    padding-right: 0
}

.hero {
    cursor: grab;
    touch-action: pan-y;
    user-select: none
}

.hero.dragging {
    cursor: grabbing
}

.hero-slide {
    opacity: 1;
    transform: translate3d(100%, 0, 0);
    transition: transform .82s cubic-bezier(.22, .75, .2, 1);
    will-change: transform
}

.hero-slide.is-on {
    transform: translate3d(0, 0, 0);
    z-index: 2
}

.hero-slide.is-left {
    transform: translate3d(-100%, 0, 0);
    z-index: 1
}

.hero-slide.is-right {
    transform: translate3d(100%, 0, 0);
    z-index: 1
}

.hero.dragging .hero-slide {
    transition: none
}

.hero-copy {
    z-index: 3
}

.hero-arrow {
    position: absolute;
    z-index: 8;
    top: 50%;
    width: 50px;
    height: 70px;
    margin-top: -35px;
    border: 1px solid rgba(255, 255, 255, .45);
    background: rgba(9, 23, 39, .18);
    color: #fff;
    font-size: 42px;
    font-weight: 200;
    line-height: 1;
    opacity: 0;
    transition: opacity .25s, background .25s;
    cursor: pointer
}

.hero:hover .hero-arrow {
    opacity: 1
}

.hero-arrow:hover {
    background: rgba(238, 118, 25, .9)
}

.hero-prev {
    left: 24px
}

.hero-next {
    right: 24px
}

.hero-dots {
    z-index: 8
}

.hero-slide .hero-copy {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
    transition: opacity .65s .35s, transform .65s .35s
}

.hero-slide.is-on .hero-copy {
    opacity: 1;
    transform: translate3d(0, 0, 0)
}

@media(max-width:1680px) {
    .content-1600 {
        width: calc(100% - 80px)
    }
}

@media(max-width:800px) {
    .content-1600 {
        width: calc(100% - 40px)
    }

    .topbar.content-1600 {
        width: calc(100% - 20px)
    }

    .sol-copy {
        left: 30px
    }

    .sol-tabs {
        left: 20px;
        right: 20px
    }

    .hero-arrow {
        width: 38px;
        height: 56px;
        margin-top: -28px;
        font-size: 34px;
        opacity: .8
    }

    .hero-prev {
        left: 8px
    }

    .hero-next {
        right: 8px
    }

    .footmain.content-1600 {
        padding-top: 45px;
        padding-bottom: 45px
    }
}

/* banner + navigation visual refinement */
.topbar.content-1600 {
    height: 90px;
    top: 40px;
    border-radius: 48px;
    padding-left: 42px;
    padding-right: 42px
}

.topbar>a img {
    width: 150px;
    height: auto
}

.topbar .main-nav {
    gap: 14px
}

.main-nav .nav-item>a {
    font-size: 18px;
    line-height: 24px;
    font-weight: 500;
    color: #333;
    letter-spacing: 0;
    word-spacing: 0;
    padding-left: 21px;
    padding-right: 21px
}

.main-nav .nav-item>a:after {
    left: 21px;
    right: 21px
}

.main-nav .nav-item>a span {
    font-size: 16px;
    line-height: 1;
    color: #777
}

.tools {
    color: #333;
    font-size: 18px
}

.tools button {
    color: #333
}

.dropdown {
    min-width: 265px;
    padding: 10px 0;
    border-top-width: 2px
}

.dropdown a {
    padding: 12px 22px;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    letter-spacing: 0;
    word-spacing: 0;
    white-space: normal
}

.dropdown a:hover {
    padding-left: 27px
}

.hero-copy.content-1600 {
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}

.hero-copy h2 {
    font-size: 50px;
    line-height: 1.18;
    font-weight: 550;
    letter-spacing: 0
}

.hero-copy p {
    font-size: 22px;
    line-height: 1.5
}

.hero-copy a {
    font-size: 16px
}

.hero-arrow {
    top: 52%
}

@media(max-width:1680px) {

    .topbar.content-1600,
    .hero-copy.content-1600 {
        width: calc(100% - 80px)
    }

    .topbar .main-nav {
        gap: 4px
    }

    .main-nav .nav-item>a {
        font-size: 16px;
        padding-left: 14px;
        padding-right: 14px
    }

    .main-nav .nav-item>a:after {
        left: 14px;
        right: 14px
    }
}

@media(max-width:1180px) {
    .topbar.content-1600 {
        height: 78px;
        top: 24px;
        border-radius: 40px;
        padding-left: 26px;
        padding-right: 26px
    }

    .topbar>a img {
        width: 135px
    }

    .hero-copy h2 {
        font-size: 42px
    }
}

@media(max-width:800px) {
    .topbar.content-1600 {
        top: 10px;
        height: 65px;
        border-radius: 34px
    }

    .hero-copy.content-1600 {
        width: calc(100% - 50px);
        left: 0;
        right: 0
    }

    .hero-copy h2 {
        font-size: 34px;
        color: #fff
    }

    .main-nav .nav-item>a {
        font-size: 16px
    }

    .dropdown a {
        font-size: 14px;
        line-height: 20px
    }
}

.topbar .main-nav>.nav-item:first-child>a {
    color: #333
}

.topbar .main-nav>.nav-item:first-child:hover>a {
    color: #e67318
}

.topbar .dropdown a,
.topbar .dropdown a:first-child {
    color: #555
}

.topbar .dropdown a:hover,
.topbar .dropdown a:first-child:hover {
    color: #ed7618
}

/* 950px hero, clean dropdown arrows, unified nav color, refined news */
.hero {
    height: 950px;
    min-height: 950px
}

.hero-slide {
    height: 950px;
    background-size: cover;
    background-position: center
}

.main-nav .nav-item>a,
.topbar .main-nav>.nav-item:first-child>a,
.main-nav .nav-item:hover>a,
.topbar .main-nav>.nav-item:first-child:hover>a {
    color: #333
}

.main-nav .nav-item>a span {
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-left: 3px;
    font-size: 0;
    line-height: 0;
    border-right: 1.5px solid #333;
    border-bottom: 1.5px solid #333;
    transform: translateY(-2px) rotate(45deg);
    transform-origin: center;
    transition: transform .25s
}

.main-nav .nav-item:hover>a span {
    transform: translateY(2px) rotate(225deg)
}

.topbar .dropdown {
    min-width: 285px;
    padding: 12px 0
}

.topbar .dropdown a,
.topbar .dropdown a:first-child,
.topbar .dropdown a:hover,
.topbar .dropdown a:first-child:hover {
    padding: 13px 24px;
    color: #333;
    font-size: 14px;
    line-height: 21px;
    font-weight: 400;
    letter-spacing: 0;
    word-spacing: 0
}

.topbar .dropdown a:hover,
.topbar .dropdown a:first-child:hover {
    padding-left: 24px;
    background: #f3f5f7
}

.news {
    height: 928px;
    background: #f4f5f6;
    padding-top: 0
}

.news-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 24px;
    align-items: stretch
}

.feature {
    height: 628px;
    padding: 16px;
    background: #fff;
    box-shadow: 0 8px 28px rgba(23, 39, 58, .06)
}

.feature>img {
    width: 100%;
    height: 382px;
    object-fit: cover
}

.feature .date {
    height: 42px;
    margin-top: 14px;
    align-items: center
}

.feature .date b {
    font-size: 30px
}

.feature h3 {
    font-size: 18px;
    line-height: 27px;
    margin: 4px 0 10px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.feature p {
    font-size: 13px;
    line-height: 20px;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.news-list {
    height: 628px;
    gap: 12px
}

.news-list article {
    height: 190px;
    min-height: 190px;
    padding: 14px;
    margin: 0;
    border: 0;
    background: #fff;
    box-shadow: 0 8px 24px rgba(23, 39, 58, .05);
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 22px;
    align-items: center
}

.news-list img {
    width: 210px;
    height: 162px;
    object-fit: contain;
    background: #f7f8f9
}

.news-list article>div {
    height: 162px
}

.news-list h3 {
    font-size: 17px;
    line-height: 24px;
    margin: 0 0 8px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.news-list p {
    font-size: 16px;
    line-height: 18px;
    -webkit-line-clamp: 2
}

.news-list time {
    font-size: 12px;
    color: #8b929a
}

.news-list .more {
    height: 22px;
    margin: 0;
    padding: 0 2px 5px;
    width: 150px;
    font-size: 13px;
    box-shadow: none;
    background: transparent
}

@media(max-width:800px) {

    .hero,
    .hero-slide {
        height: 720px;
        min-height: 720px
    }

    .news {
        height: auto;
        padding-bottom: 70px
    }

    .news-grid {
        grid-template-columns: 1fr
    }

    .feature {
        height: auto
    }

    .feature>img {
        height: 300px
    }

    .news-list {
        height: auto
    }

    .news-list article {
        grid-template-columns: 140px 1fr;
        height: 178px;
        min-height: 178px
    }

    .news-list img {
        width: 140px;
        height: 150px
    }

    .news-list article>div {
        height: 150px
    }
}

.topbar .main-nav>.nav-item>a,
.topbar .main-nav>.nav-item:hover>a,
.topbar .main-nav>.nav-item>a:first-child {
    color: #333
}

/* news layout matched to supplied reference */
.news {
    height: 950px;
    background: #eef8f6;
    position: relative
}

.news>.heading h2 {
    position: relative
}

.news>.heading h2:after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 3px;
    width: 108px;
    height: 5px;
    background: #24ad4a;
    transform: translateX(-50%);
    z-index: -1
}

.news>.heading>p {
    font-size: 17px;
    color: #626b69
}

.news-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, .965fr);
    gap: 44px
}

.feature {
    height: 648px;
    padding: 0;
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
    box-shadow: none;
    position: relative
}

.feature>img {
    height: 468px;
    width: 100%;
    object-fit: cover
}

.feature .date {
    position: absolute;
    left: 20px;
    top: 350px;
    width: 92px;
    height: 90px;
    margin: 0;
    padding: 10px 8px;
    background: #25ae49;
    color: #fff;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px
}

.feature .date b {
    font-size: 34px;
    line-height: 38px;
    font-weight: 500
}

.feature .date span {
    font-size: 13px;
    color: #fff
}

.feature h3 {
    margin: 25px 20px 10px;
    color: #168b35;
    font-size: 18px;
    line-height: 26px;
    font-weight: 600;
    -webkit-line-clamp: 1
}

.feature p {
    margin: 0 20px;
    font-size: 14px;
    line-height: 22px;
    color: #596461;
    -webkit-line-clamp: 3
}

.news-list {
    height: 648px;
    gap: 32px
}

.news-list article {
    height: 194px;
    min-height: 194px;
    padding: 20px;
    border-radius: 14px;
    background: #fff;
    box-shadow: none;
    grid-template-columns: minmax(0, 1fr) 210px;
    gap: 25px;
    align-items: center
}

.news-list article>img {
    order: 2;
    width: 210px;
    height: 154px;
    object-fit: contain;
    background: #fff
}

.news-list article>div {
    order: 1;
    height: 154px
}

.news-list h3 {
    font-size: 18px;
    line-height: 28px;
    font-weight: 500;
    color: #18201e;
    margin: 0 0 8px;
    -webkit-line-clamp: 2
}

.news-list p {
    font-size: 13px;
    line-height: 20px;
    color: #596461;
    -webkit-line-clamp: 2
}

.news-list time {
    font-size: 12px;
    color: #4f5b58
}

.news-list .more {
    position: absolute;
    left: 50%;
    bottom: 22px;
    width: 172px;
    height: 52px;
    margin: 0;
    padding: 0 22px;
    border: 0;
    border-radius: 28px;
    background: linear-gradient(90deg, #20ae42, #32b5ae);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transform: translateX(-50%);
    font-size: 18px
}

.news-list .more b {
    color: #fff;
    font-size: 18px
}

@media(max-width:1180px) {
    .news-grid {
        gap: 24px
    }

    .news-list article {
        grid-template-columns: minmax(0, 1fr) 170px
    }

    .news-list article>img {
        width: 170px
    }
}

@media(max-width:800px) {
    .news {
        height: auto;
        padding-bottom: 100px
    }

    .news-grid {
        grid-template-columns: 1fr
    }

    .feature {
        height: auto;
        padding-bottom: 22px
    }

    .feature>img {
        height: 320px
    }

    .feature .date {
        top: 230px
    }

    .news-list {
        height: auto;
        gap: 16px
    }

    .news-list article {
        grid-template-columns: minmax(0, 1fr) 120px;
        height: 180px;
        min-height: 180px;
        padding: 14px
    }

    .news-list article>img {
        width: 120px;
        height: 140px
    }

    .news-list article>div {
        height: 140px
    }

    .news-list .more {
        bottom: 24px
    }
}

/* product series matched to supplied reference */
.catalog {
    height: 800px;
    background: #fff
}

.catalog>.heading h2 {
    position: relative
}

.catalog>.heading h2:after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 4px;
    width: 100%;
    height: 5px;
    background: linear-gradient(90deg, #1eaf48, #32b5ad);
    transform: translateX(-50%);
    z-index: -1
}

.catalog>.heading>p {
    font-size: 17px;
    color: #606966;
    margin-top: 12px
}

.cards {
    height: 650px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;
    padding: 0
}

.cards article {
    height: 650px;
    padding: 35px 32px 28px;
    background: #f4f5f5;
    border-radius: 22px;
    overflow: hidden;
    display: flex;
    flex-direction: column
}

.cards h3 {
    order: 1;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    font-size: 23px;
    line-height: 32px;
    font-weight: 600;
    color: #17201e
}

.cards .pic {
    order: 2;
    width: 100%;
    height: 440px;
    margin: 15px 0 0;
    background: transparent;
    overflow: visible
}

.cards .pic .water {
    display: none
}

.cards .pic>img:not(.water) {
    width: 88%;
    height: 100%;
    margin: auto;
    object-fit: contain;
    transition: transform .45s ease
}

.cards article:hover .pic>img:not(.water) {
    transform: translateY(-5px) scale(1.025)
}

.cards article>a {
    order: 3;
    width: 172px;
    height: 52px;
    min-height: 52px;
    margin: auto 0 0 auto;
    padding: 0 22px;
    border: 1px solid #222;
    border-radius: 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #111;
    background: #fff;
    font-size: 18px;
    line-height: 1;
    transition: background .25s, color .25s, border-color .25s
}

.cards article>a b {
    font-size: 18px;
    color: #111;
    transition: transform .25s
}

.cards article>a:hover {
    background: #25ac48;
    border-color: #25ac48;
    color: #fff
}

.cards article>a:hover b {
    color: #fff;
    transform: translateX(4px)
}

@media(max-width:1180px) {
    .cards {
        gap: 20px
    }

    .cards article {
        padding: 28px 24px
    }

    .cards h3 {
        font-size: 20px
    }
}

@media(max-width:800px) {
    .catalog {
        height: auto;
        padding-top: 65px;
        padding-bottom: 70px
    }

    .catalog>.heading {
        height: auto;
        margin-bottom: 45px;
        align-items: center;
        text-align: center
    }

    .cards {
        height: auto;
        grid-template-columns: 1fr;
        gap: 24px
    }

    .cards article {
        height: 580px
    }

    .cards .pic {
        height: 380px
    }
}

/* product image spacing, larger clean map, news hover, footer logo alignment */
.cards .pic {
    height: 420px;
    margin-top: 24px;
    display: flex;
    align-items: center;
    justify-content: center
}

.cards .pic>img:not(.water) {
    width: auto;
    height: auto;
    max-width: 90%;
    max-height: 380px;
    margin: auto;
    object-fit: contain
}

.cards article>a {
    margin-top: auto
}

.map {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible
}

.map>img:first-child {
    width: 100%;
    height: auto;
    max-width: none;
    top: 28px;
    left: -4%;
    object-fit: contain
}

.map .case {
    display: none
}

.news>.heading>div {
    transform: translateY(15px)
}

.news>.heading>p {
    margin: 20px 0 0
}

.feature>img,
.news-list article>img {
    transition: transform .55s cubic-bezier(.2, .7, .2, 1)
}

.feature:hover>img {
    transform: scale(1.045)
}

.news-list article {
    overflow: hidden
}

.news-list article:hover>img {
    transform: scale(1.08)
}

.footnav {
    position: relative;
    justify-content: center
}

.footer-nav-logo {
    position: absolute;
    left: 0;
    width: 172px;
    height: 65px;
    object-fit: contain
}

.footmain .contact>img {
    display: none
}

.footmain {
    padding-top: 42px
}

@media(max-width:800px) {
    .cards .pic {
        height: 360px
    }

    .cards .pic>img:not(.water) {
        max-height: 325px
    }

    .map>img:first-child {
        width: 100%;
        left: -6%;
        top: 15px
    }

    .news>.heading>div {
        transform: none
    }

    .news>.heading>p {
        margin-top: 12px
    }

    .footer-nav-logo {
        position: static;
        width: 145px;
        height: 55px;
        margin-right: 20px
    }

    .footnav {
        justify-content: flex-start;
        gap: 14px;
        padding-left: 0
    }
}

/* language selector, expandable search and centered hero copy */
.tools {
    gap: 20px
}

.language-picker {
    height: 100%;
    position: relative;
    display: flex;
    align-items: center
}

.language-toggle {
    height: 48px;
    padding: 0 10px;
    border: 0;
    background: transparent;
    color: #333;
    font-size: 18px;
    display: flex;
    align-items: center;
    gap: 9px;
    cursor: pointer
}

.language-toggle>span {
    width: 7px;
    height: 7px;
    border-right: 1.5px solid #333;
    border-bottom: 1.5px solid #333;
    transform: translateY(-2px) rotate(45deg);
    transition: transform .25s
}

.language-picker.open .language-toggle>span {
    transform: translateY(2px) rotate(225deg)
}

.language-menu {
    position: absolute;
    z-index: 30;
    right: 0;
    top: calc(100% - 8px);
    width: 170px;
    padding: 9px 0;
    background: #fff;
    border-top: 2px solid #ed7618;
    box-shadow: 0 14px 35px rgba(18, 32, 49, .16);
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: .25s
}

.language-picker.open .language-menu {
    opacity: 1;
    visibility: visible;
    transform: none
}

.language-menu button {
    width: 100%;
    padding: 11px 20px;
    border: 0;
    background: #fff;
    color: #333;
    text-align: left;
    font-size: 14px;
    line-height: 20px;
    cursor: pointer
}

.language-menu button:hover {
    background: #f3f5f7
}

.search-toggle {
    position: relative;
    width: 50px;
    height: 50px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer
}

.search-toggle>span {
    position: absolute;
    left: 14px;
    top: 12px;
    width: 21px;
    height: 21px;
    border: 2px solid #333;
    border-radius: 50%
}

.search-toggle>span:after {
    content: "";
    position: absolute;
    width: 10px;
    height: 2px;
    background: #333;
    right: -7px;
    bottom: -4px;
    transform: rotate(45deg);
    transform-origin: left center
}

.search-panel {
    position: absolute;
    z-index: 18;
    left: 0;
    top: 100%;
    width: 100%;
    padding: 18px 0;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 15px 28px rgba(15, 31, 47, .12);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-12px);
    transition: .3s
}

.search-panel.open {
    opacity: 1;
    visibility: visible;
    transform: none
}

.search-form {
    height: 58px;
    display: flex;
    margin: auto
}

.search-form input {
    flex: 1;
    height: 58px;
    padding: 0 22px;
    border: 1px solid #d9dddf;
    border-right: 0;
    background: #fff;
    color: #333;
    font-size: 16px;
    outline: none
}

.search-form input:focus {
    border-color: #24aa49
}

.search-form>button[type=submit] {
    width: 130px;
    border: 0;
    background: #24aa49;
    color: #fff;
    font-size: 18px;
    cursor: pointer
}

.search-close {
    width: 58px;
    border: 0;
    background: #eef1f2;
    color: #333;
    font-size: 28px;
    cursor: pointer
}

.hero-copy.content-1600 {
    top: 215px;
    text-align: center
}

.hero-copy h2 {
    color: #fff;
    text-align: center
}

.hero-copy p {
    color: #fff;
    text-align: center
}

.hero-copy a {
    color: #fff;
    margin-left: auto;
    margin-right: auto;
    border-color: #fff
}

.hero-slide .hero-copy {
    display: flex;
    flex-direction: column;
    align-items: center
}

@media(max-width:800px) {
    .language-picker {
        display: none
    }

    .search-toggle {
        width: 42px;
        height: 42px
    }

    .search-toggle>span {
        left: 11px;
        top: 9px
    }

    .search-panel {
        top: 75px
    }

    .search-form.content-1600 {
        width: calc(100% - 30px)
    }

    .search-form>button[type=submit] {
        width: 82px
    }

    .hero-copy.content-1600 {
        top: 175px
    }
}

/* typography scale refinement */
.language-toggle {
    font-size: 18px
}

.search-toggle {
    width: 44px;
    height: 44px
}

.search-toggle>span {
    left: 12px;
    top: 11px;
    width: 16px;
    height: 16px;
    border-width: 2px
}

.search-toggle>span:after {
    width: 9px;
    right: -7px;
    bottom: -4px
}

.topbar .main-nav>.nav-item:hover>a,
.topbar .main-nav>.nav-item:first-child:hover>a {
    color: #e67318
}

.topbar .dropdown a,
.topbar .dropdown a:first-child,
.topbar .dropdown a:hover,
.topbar .dropdown a:first-child:hover {
    font-size: 18px;
    line-height: 26px;
    padding-top: 13px;
    padding-bottom: 13px
}

.topbar .dropdown a:hover,
.topbar .dropdown a:first-child:hover {
    color: #e67318
}

.language-menu {
    width: 190px
}

.language-menu button {
    font-size: 18px;
    line-height: 26px
}

.sol-copy p,
.why-left>p,
.feature p {
    font-size: 16px;
    line-height: 25px
}

@media(max-width:800px) {

    .language-toggle,
    .language-menu button,
    .topbar .dropdown a {
        font-size: 16px
    }

    .search-toggle {
        width: 40px;
        height: 40px
    }

    .search-toggle>span {
        left: 10px;
        top: 9px;
        width: 16px;
        height: 16px
    }
}

.tools .language-toggle {
    font-size: 18px
}

/* compact search, swapped utility order, clean headings, fullscreen mobile menu */
.heading i,
.sol-title i {
    display: none
}

.search-panel {
    left: auto;
    right: 88px;
    top: 76px;
    width: 400px;
    padding: 14px 18px 18px;
    border-radius: 0 0 18px 18px;
    background: #fff;
    box-shadow: 0 14px 28px rgba(15, 31, 47, .16)
}

.search-form.content-1600 {
    width: 100%;
    height: 42px;
    margin: 0
}

.search-form input {
    height: 42px;
    padding: 0 13px;
    border: 1px solid #28ad4b;
    font-size: 15px
}

.search-form>button[type=submit] {
    width: 78px;
    height: 42px;
    font-size: 0;
    position: relative
}

.search-form>button[type=submit]:before {
    content: "";
    position: absolute;
    left: 28px;
    top: 10px;
    width: 15px;
    height: 15px;
    border: 2px solid #fff;
    border-radius: 50%
}

.search-form>button[type=submit]:after {
    content: "";
    position: absolute;
    left: 44px;
    top: 27px;
    width: 8px;
    height: 2px;
    background: #fff;
    transform: rotate(45deg)
}

.search-close {
    display: none
}

@media(max-width:800px) {
    .topbar.menu-open {
        position: fixed;
        inset: 0;
        width: 100%;
        height: 100vh;
        max-width: none;
        margin: 0;
        transform: none;
        border-radius: 0;
        background: #fff;
        padding: 20px;
        display: block;
        overflow-y: auto
    }

    .topbar.menu-open>a {
        position: absolute;
        left: 20px;
        top: 18px
    }

    .topbar.menu-open .tools {
        position: absolute;
        right: 18px;
        top: 17px
    }

    .topbar.menu-open .search-toggle {
        display: none
    }

    .topbar.menu-open .hamb {
        position: relative;
        width: 42px;
        height: 42px;
        font-size: 0
    }

    .topbar.menu-open .hamb:before,
    .topbar.menu-open .hamb:after {
        content: "";
        position: absolute;
        left: 9px;
        top: 20px;
        width: 25px;
        height: 2px;
        background: #333
    }

    .topbar.menu-open .hamb:before {
        transform: rotate(45deg)
    }

    .topbar.menu-open .hamb:after {
        transform: rotate(-45deg)
    }

    .topbar .main-nav.open {
        position: relative;
        left: auto;
        right: auto;
        top: 90px;
        width: 100%;
        height: auto;
        min-height: calc(100vh - 120px);
        display: flex;
        flex-direction: column;
        box-shadow: none;
        background: #fff;
        padding: 25px 0;
        transform: none
    }

    .topbar .main-nav.open .nav-item>a {
        height: 58px;
        padding: 0 10px;
        border-bottom: 1px solid #eceeef;
        font-size: 20px
    }

    .topbar .main-nav.open .dropdown {
        border-radius: 0;
        box-shadow: none
    }

    .search-panel {
        position: fixed;
        left: 15px;
        right: 15px;
        top: 75px;
        width: auto;
        border-radius: 0 0 14px 14px
    }

    .search-form.content-1600 {
        width: 100%
    }
}

/* clean solid-color Why Choose composition */
:root {
    --solid-green: #0b4f8a
}

.why {
    height: 820px;
    background: #fff;
    grid-template-columns: 40% 60%;
    gap: 0;
    padding-top: 70px;
    padding-bottom: 65px
}

.why-left {
    position: relative;
    z-index: 2;
    padding-right: 45px
}

.why .heading {
    transform: none;
    height: 60px
}

.why .heading h2 {
    font-size: 40px
}

.why-left>p {
    max-width: 610px;
    margin: 18px 0 42px;
    font-size: 16px;
    line-height: 27px;
    color: #505b59
}

.why-left>a {
    width: 172px;
    height: 54px;
    padding: 0 22px;
    border: 1px solid #222;
    border-radius: 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
    color: #111
}

.why-left>a b {
    color: #111
}

.stats {
    width: 560px;
    margin-top: 66px;
    grid-template-columns: 1fr 1fr;
    gap: 58px 45px
}

.stats div {
    height: auto
}

.stats strong {
    font-size: 56px;
    line-height: 1;
    font-weight: 600;
    color: var(--solid-green)
}

.stats strong sup {
    font-size: 22px;
    color: #333
}

.stats span {
    margin-top: 22px;
    display: block;
    font-size: 16px;
    color: #151b1a
}

.map {
    height: 650px;
    position: relative;
    overflow: visible;
    align-self: center
}

.map>img:first-child {
    position: absolute;
    width: 100%;
    height: auto;
    max-width: none;
    left: -6%;
    top: 3%;
    object-fit: contain
}

.map-pin {
    position: absolute;
    z-index: 3;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--solid-green);
    color: #fff;
    font-size: 23px;
    line-height: 1;
    font-weight: 300;
    box-shadow: 0 0 0 4px rgba(39, 180, 135, .12)
}

.pin-eu {
    left: 21%;
    top: 31%
}

.pin-na {
    right: 17%;
    top: 20%
}

.pin-sa {
    right: 2%;
    top: 57%
}

.catalog>.heading h2:after,
.news>.heading h2:after {
    background: var(--solid-green)
}

.news-list .more {
    background: var(--solid-green)
}

@media(max-width:900px) {
    .why {
        height: auto;
        grid-template-columns: 1fr;
        padding-top: 70px
    }

    .why-left {
        padding-right: 0
    }

    .stats {
        width: 100%
    }

    .map {
        height: 520px;
        margin-top: 35px
    }

    .map>img:first-child {
        width: 110%;
        left: -5%
    }
}

@media(max-width:560px) {
    .stats {
        grid-template-columns: 1fr 1fr;
        gap: 40px 20px
    }

    .stats strong {
        font-size: 43px
    }

    .stats span {
        font-size: 14px
    }

    .map {
        height: 350px
    }

    .map-pin {
        width: 23px;
        height: 23px;
        font-size: 18px
    }
}

/* revert Why Choose redesign; retain only stronger stats */
.why {
    height: 818px;
    grid-template-columns: 45% 55%;
    gap: 0;
    padding-top: 0;
    padding-bottom: 0;
    background: #fff
}

.why-left {
    padding-right: 60px
}

.why .heading {
    height: 60px;
    transform: none
}

.why-left>p {
    max-width: none;
    margin: 35px 0 25px;
    font-size: 16px;
    line-height: 1.9;
    color: #777
}

.why-left>a {
    width: 154px;
    height: auto;
    padding: 0 0 10px;
    border: 0;
    border-bottom: 1px solid currentColor;
    border-radius: 0;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    color: #222;
    background: transparent
}

.why-left>a b {
    color: #f07818
}

.stats {
    width: auto;
    margin-top: 45px;
    grid-template-columns: 1fr 1fr;
    gap: 33px
}

.stats div {
    height: 150px
}

.stats strong {
    font-size: 52px;
    line-height: 75px;
    font-weight: 600;
    color: #0b4f8a
}

.stats strong sup {
    font-size: 22px;
    color: #0b4f8a
}

.stats span {
    margin-top: 0;
    font-size: 15px;
    color: #555
}

.map {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible
}

.map>img:first-child {
    position: static;
    width: 100%;
    height: auto;
    max-width: 100%;
    object-fit: contain
}

.map-pin {
    display: none
}

@media(max-width:900px) {
    .why {
        height: auto;
        grid-template-columns: 1fr;
        padding-top: 65px;
        padding-bottom: 65px
    }

    .why-left {
        padding-right: 0
    }

    .stats {
        width: 100%
    }

    .map {
        height: auto;
        margin-top: 35px
    }

    .map>img:first-child {
        position: static;
        width: 100%;
        max-width: 100%
    }
}

@media(max-width:800px) {
    .topbar.content-1600 {
        left: 0;
        right: 0;
        top: 0;
        width: 100%;
        height: 70px;
        margin: 0;
        transform: none;
        border-radius: 0;
        padding: 0 18px
    }

    .topbar.menu-open {
        position: fixed;
        inset: 0;
        width: 100%;
        height: 100dvh;
        min-height: 100vh;
        max-width: none;
        margin: 0;
        padding: 18px;
        border-radius: 0;
        transform: none;
        background: #fff;
        overflow-y: auto;
        z-index: 100
    }

    .topbar.menu-open .main-nav.open {
        position: absolute;
        left: 0;
        right: 0;
        top: 78px;
        width: 100%;
        min-height: calc(100dvh - 78px);
        margin: 0;
        padding: 15px 20px 35px;
        background: #fff;
        box-shadow: none;
        border-radius: 0
    }

    .topbar.menu-open .main-nav.open .nav-item {
        width: 100%
    }

    .topbar.menu-open .main-nav.open .nav-item>a {
        width: 100%
    }

    .topbar.menu-open>a {
        left: 18px;
        top: 8px
    }

    .topbar.menu-open .tools {
        right: 14px;
        top: 9px
    }
}

/* comprehensive mobile width and navigation correction */
@media(max-width:800px) {

    html,
    body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden
    }

    .content-1600 {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0
    }

    .topbar.content-1600,
    .topbar.menu-open {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        inset: auto 0 auto 0;
        width: 100%;
        height: 70px;
        min-height: 70px;
        max-width: none;
        margin: 0;
        padding: 0 18px;
        transform: none;
        border-radius: 0;
        background: #fff;
        overflow: visible;
        display: flex;
        align-items: center;
        z-index: 100
    }

    .topbar>a,
    .topbar.menu-open>a {
        position: static;
        left: auto;
        top: auto;
        display: flex;
        align-items: center;
        flex: 0 0 auto
    }

    .topbar>a img {
        width: 132px;
        height: 50px;
        object-fit: contain
    }

    .topbar .tools,
    .topbar.menu-open .tools {
        position: static;
        right: auto;
        top: auto;
        margin-left: auto;
        display: flex;
        align-items: center;
        height: 70px
    }

    .topbar .hamb,
    .topbar.menu-open .hamb {
        display: block;
        position: relative;
        width: 42px;
        height: 42px;
        padding: 0;
        color: #333
    }

    .topbar.menu-open .hamb {
        font-size: 0
    }

    .topbar .main-nav,
    .topbar .main-nav.open,
    .topbar.menu-open .main-nav.open {
        position: fixed;
        z-index: 99;
        left: 0;
        right: 0;
        top: 70px;
        width: 100%;
        max-width: 100%;
        height: calc(100dvh - 70px);
        min-height: calc(100vh - 70px);
        margin: 0;
        padding: 16px 20px 35px;
        transform: none;
        border-radius: 0;
        background: #fff;
        box-shadow: none;
        overflow-y: auto;
        align-items: stretch
    }

    .topbar .main-nav {
        display: none
    }

    .topbar .main-nav.open {
        display: flex;
        flex-direction: column
    }

    .topbar .main-nav.open .nav-item,
    .topbar .main-nav.open .nav-item>a {
        width: 100%;
        max-width: 100%
    }

    .topbar .main-nav.open .nav-item>a {
        height: 58px;
        padding: 0 4px;
        border-bottom: 1px solid #eceeef;
        font-size: 19px
    }

    .topbar .main-nav.open .dropdown {
        position: static;
        width: 100%;
        min-width: 0;
        margin: 0;
        transform: none;
        border: 0;
        box-shadow: none;
        border-radius: 0;
        background: #f6f7f8
    }

    .topbar .main-nav.open .dropdown a {
        width: 100%;
        padding: 12px 18px;
        font-size: 16px
    }

    .search-panel {
        position: fixed;
        z-index: 102;
        left: 10px;
        right: 10px;
        top: 70px;
        width: auto;
        max-width: calc(100% - 20px);
        border-radius: 0;
        padding: 12px
    }

    .search-form.content-1600 {
        width: 100%;
        max-width: 100%;
        height: 42px
    }

    .hero,
    .hero-slide {
        width: 100%;
        height: auto;
        min-height: 0;
        aspect-ratio: 1440/715
    }

    .hero-slide {
        background-size: 100% 100%;
        background-repeat: no-repeat
    }

    .hero-copy.content-1600 {
        top: 82px;
        left: 0;
        right: 0;
        width: 100%;
        max-width: 100%;
        padding: 0 38px
    }

    .hero-copy h2 {
        font-size: 20px;
        line-height: 1.2
    }

    .hero-copy p {
        font-size: 13px;
        line-height: 1.35;
        margin: 8px 0
    }

    .hero-copy a {
        width: 112px;
        padding-bottom: 5px;
        font-size: 12px
    }

    .hero-dots {
        bottom: 8px
    }

    .hero-arrow {
        display: none
    }

    main {
        width: 100%;
        max-width: 100%;
        padding-top: 45px
    }

    .catalog.content-1600,
    .why.content-1600,
    .news.content-1600 {
        width: 100%;
        max-width: 100%;
        padding-left: 20px;
        padding-right: 20px
    }

    .catalog {
        overflow: hidden
    }

    .cards,
    .cards article,
    .cards .pic {
        width: 100%;
        max-width: 100%
    }

    .solutions {
        width: 100%;
        max-width: 100%;
        overflow: hidden
    }

    .sol-title.content-1600 {
        width: 100%;
        padding-left: 20px;
        padding-right: 20px
    }

    .sol-copy {
        left: 20px;
        right: 20px;
        width: auto;
        max-width: calc(100% - 40px)
    }

    .sol-copy p {
        width: 100%;
        max-width: 100%
    }

    .sol-tabs {
        left: 20px;
        right: 20px;
        width: auto
    }

    .why {
        overflow: hidden
    }

    .why-left {
        width: 100%;
        max-width: 100%;
        padding-right: 0
    }

    .why-left>p {
        width: 100%;
        max-width: 100%;
        overflow-wrap: anywhere
    }

    .stats {
        width: 100%;
        max-width: 100%
    }

    .map {
        width: 100%;
        max-width: 100%;
        height: auto;
        min-height: 280px;
        overflow: hidden
    }

    .map>img:first-child {
        position: static;
        width: 100%;
        height: auto;
        max-width: 100%;
        margin: auto
    }

    .news {
        overflow: hidden
    }

    .news-grid,
    .feature,
    .news-list,
    .news-list article {
        width: 100%;
        max-width: 100%
    }

    .news-list article {
        grid-template-columns: minmax(0, 1fr) 110px;
        gap: 12px
    }

    .news-list article>img {
        width: 110px;
        max-width: 110px
    }

    .footnav.content-1600,
    .footmain.content-1600,
    .copyright.content-1600 {
        width: 100%;
        max-width: 100%;
        padding-left: 20px;
        padding-right: 20px
    }

    footer {
        width: 100%;
        max-width: 100%;
        overflow: hidden
    }

    .footer-nav-logo {
        max-width: 130px
    }
}

/* mobile hero height, right-aligned menu arrows, tighter desktop map section */
@media(min-width:901px) {
    .why {
        height: 700px
    }

    .map {
        height: 700px
    }

    .why-left>p {
        margin-top: 22px;
        margin-bottom: 20px
    }

    .stats {
        margin-top: 32px;
        gap: 20px 33px
    }

    .stats div {
        height: 130px
    }
}

@media(max-width:800px) {

    .hero,
    .hero-slide {
        height: 230px;
        min-height: 230px;
        aspect-ratio: auto
    }

    .hero-slide {
        background-size: cover;
        background-position: center
    }

    .hero-copy.content-1600 {
        top: 88px
    }

    .topbar .main-nav.open .has-menu>a {
        display: flex;
        justify-content: flex-start
    }

    .topbar .main-nav.open .has-menu>a span {
        margin-left: auto;
        margin-right: 6px;
        flex: 0 0 7px
    }
}

/* taller filled mobile hero and click-controlled submenus */
@media(max-width:800px) {

    .hero,
    .hero-slide {
        height: 320px;
        min-height: 320px;
        aspect-ratio: auto
    }

    .hero-slide {
        background-size: cover !important;
        background-position: center center;
        background-repeat: no-repeat
    }

    .hero-copy.content-1600 {
        top: 115px
    }

    .topbar .main-nav.open .nav-item .dropdown,
    .topbar .main-nav.open .nav-item:hover .dropdown {
        display: none;
        opacity: 0;
        visibility: hidden;
        transform: none
    }

    .topbar .main-nav.open .nav-item.submenu-open .dropdown {
        display: block;
        opacity: 1;
        visibility: visible
    }

    .topbar .main-nav.open .nav-item.submenu-open>a span {
        transform: translateY(2px) rotate(225deg)
    }
}

/* tighter mobile hero-to-content gap and clickable language icon */
@media(max-width:800px) {
    main {
        padding-top: 8px
    }

    .catalog {
        padding-top: 28px
    }

    .language-picker {
        display: flex;
        width: 42px;
        height: 42px
    }

    .tools .language-toggle {
        position: relative;
        width: 42px;
        height: 42px;
        padding: 0;
        font-size: 0
    }

    .language-toggle:before {
        content: "";
        position: absolute;
        left: 11px;
        top: 10px;
        width: 18px;
        height: 18px;
        border: 1.8px solid #333;
        border-radius: 50%
    }

    .language-toggle:after {
        content: "";
        position: absolute;
        left: 19px;
        top: 10px;
        width: 4px;
        height: 18px;
        border-left: 1.4px solid #333;
        border-right: 1.4px solid #333;
        border-radius: 50%
    }

    .language-toggle>span {
        position: absolute;
        left: 11px;
        top: 19px;
        width: 18px;
        height: 1px;
        border: 0;
        border-top: 1.4px solid #333;
        transform: none
    }

    .language-picker.open .language-toggle>span {
        transform: none
    }

    .language-menu {
        position: fixed;
        z-index: 103;
        right: 54px;
        top: 70px;
        width: 190px;
        padding: 8px 0;
        border-radius: 0 0 12px 12px
    }

    .topbar.menu-open .language-picker {
        display: none
    }

    .topbar .tools,
    .topbar.menu-open .tools {
        gap: 6px
    }
}

/* floating contact toolbar */
@media(min-width:801px) {
    aside a {
        width: 56px;
        height: 56px;
        font-size: 22px
    }

    aside {
        bottom: 110px;
        border-radius: 10px 0 0 10px;
        overflow: hidden;
        box-shadow: 0 6px 22px rgba(17, 31, 48, .16)
    }
}

@media(max-width:800px) {
    aside {
        display: none !important
    }
}


.news.content-1600 {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0
}

.news>.heading,
.news>.news-grid {
    margin-left: auto;
    margin-right: auto
}

@media(max-width:800px) {
    .news.content-1600 {
        width: 100%;
        max-width: 100%;
        padding-left: 0;
        padding-right: 0
    }

    .news>.heading,
    .news>.news-grid {
        width: calc(100% - 40px);
        max-width: none;
        margin-left: auto;
        margin-right: auto
    }
}

/* Shared content width: Our Solution + News */
.sol-title.content-1600,
.sol-copy.content-1600,
.sol-tabs.content-1600,
.news>.heading.content-1600,
.news>.news-grid.content-1600 {
    width: min(calc(100% - 80px), var(--content));
    max-width: var(--content);
    margin-left: auto;
    margin-right: auto
}

.sol-copy.content-1600,
.sol-tabs.content-1600 {
    left: 0;
    right: 0
}

.sol-copy.content-1600>h3,
.sol-copy.content-1600>p,
.sol-copy.content-1600>a {
    max-width: 676px
}

.news {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0
}

.news>.heading.content-1600,
.news>.news-grid.content-1600 {
    padding-left: 0;
    padding-right: 0
}

@media(max-width:800px) {

    .sol-title.content-1600,
    .sol-copy.content-1600,
    .sol-tabs.content-1600,
    .news>.heading.content-1600,
    .news>.news-grid.content-1600 {
        width: calc(100% - 40px);
        max-width: none;
        margin-left: auto;
        margin-right: auto
    }

    .sol-copy.content-1600,
    .sol-tabs.content-1600 {
        left: 0;
        right: 0
    }

    .sol-copy.content-1600>h3,
    .sol-copy.content-1600>p,
    .sol-copy.content-1600>a {
        max-width: 100%
    }
}


.content-1600 {
    width: min(calc(100% - 80px), var(--content));
    max-width: var(--content);
    margin-left: auto;
    margin-right: auto
}

.topbar.content-1600,
.hero-copy.content-1600,
.catalog.content-1600,
.sol-title.content-1600,
.sol-copy.content-1600,
.sol-tabs.content-1600,
.why.content-1600,
.news>.heading.content-1600,
.news>.news-grid.content-1600,
.footnav.content-1600,
.footmain.content-1600,
.copyright.content-1600 {
    max-width: var(--content)
}

@media(max-width:800px) {
    .content-1600 {
        width: calc(100% - 40px);
        max-width: none
    }

    .topbar.content-1600 {
        width: 100%;
        max-width: 100%
    }

    .hero-copy.content-1600 {
        width: 100%;
        max-width: 100%
    }
}/* Standalone top-level pages */
.subpage{background:#fff}.subpage .topbar{position:absolute}.subpage-main{padding-top:150px;min-height:760px}.subpage-products .catalog{margin-bottom:0}.subpage-solutions .solutions{margin-bottom:0}.subpage-news .news{margin-bottom:0}@media(max-width:800px){.subpage-main{padding-top:70px}.subpage .topbar{position:absolute}}
/* About and contact pages — clean rewritten layouts */
.inner-main{padding-top:0}.inner-hero{height:470px;background-position:center;background-size:cover;color:#fff;display:flex;align-items:center;text-align:center;position:relative}.inner-hero:before{content:"";position:absolute;inset:0;background:rgba(5,22,36,.3)}.inner-hero .content-1600{position:relative;z-index:1}.inner-hero h1{font-size:52px;margin:70px 0 12px;font-weight:550}.inner-hero p{font-size:15px}.inner-heading{text-align:center;margin-bottom:38px}.inner-heading h2{font-size:40px;line-height:1.25;margin:0 0 10px;font-weight:550}.inner-heading p{margin:0;color:#777;font-size:16px}.about-intro{padding-top:85px;padding-bottom:90px}.about-lead{max-width:1080px;margin:0 auto 42px;text-align:center;color:#666;font-size:16px;line-height:1.9}.about-cover{height:540px;position:relative;overflow:hidden}.about-cover img{width:100%;height:100%;object-fit:cover}.about-cover button{position:absolute;left:50%;top:50%;width:76px;height:76px;transform:translate(-50%,-50%);border:1px solid #fff;border-radius:50%;background:#05a;color:#fff;font-size:25px;cursor:pointer}.about-numbers{display:grid;grid-template-columns:repeat(3,1fr);padding-top:55px;text-align:center}.about-numbers strong{display:block;color:#0b4f8a;font-size:48px}.about-numbers sup{font-size:22px}.about-numbers span{display:block;margin-top:10px;color:#555}.factory-section,.brands-section,.message-section{background:#f4f7f6;padding:85px 0}.factory-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.factory-grid figure{margin:0;background:#fff;overflow:hidden}.factory-grid img{width:100%;height:330px;object-fit:cover;transition:transform .55s}.factory-grid figure:hover img{transform:scale(1.045)}.factory-grid figcaption{padding:18px 20px;font-size:16px}.honor-section{padding-top:85px;padding-bottom:95px}.honor-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:45px;align-items:center}.honor-grid img{width:100%;height:420px;object-fit:contain}.brands-image{width:100%;max-height:530px;object-fit:contain;background:#fff}.cooperation{margin-top:45px;display:grid;grid-template-columns:1.25fr .75fr;gap:60px;align-items:start}.cooperation h3{font-size:20px;line-height:1.7;margin:0;font-weight:500}.cooperation p{font-size:15px;line-height:1.8;color:#666;margin:0}.cooperation a{grid-column:2;display:inline-flex;width:150px;padding-bottom:10px;border-bottom:1px solid #222}.contact-info{padding-top:85px;padding-bottom:95px}.contact-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.contact-cards article{min-height:250px;padding:36px 28px;background:#f5f7f7;text-align:center;border-radius:12px}.contact-cards img{width:60px;height:60px;object-fit:contain;margin:0 auto 22px}.contact-cards h3{font-size:19px;margin:0 0 12px}.contact-cards a,.contact-cards p{font-size:15px;line-height:1.7;color:#666}.message-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:90px;align-items:start}.inner-heading.left{text-align:left}.message-layout>div>p{font-size:16px;line-height:1.8;color:#66706e}.message-form{display:grid;grid-template-columns:1fr 1fr;gap:24px}.message-form label{font-size:13px;color:#555}.message-form input,.message-form textarea{display:block;width:100%;margin-top:8px;padding:14px 12px;border:1px solid #d6dcda;background:#fff;outline:none}.message-form input:focus,.message-form textarea:focus{border-color:#0b4f8a}.message-form .full{grid-column:1/-1}.message-form button{width:160px;height:48px;border:0;background:#0b4f8a;color:#fff;cursor:pointer}.contact-map{height:560px}.contact-map iframe{width:100%;height:100%;border:0}@media(max-width:800px){.inner-hero{height:280px}.inner-hero h1{font-size:36px;margin-top:45px}.about-intro,.contact-info{padding:60px 20px}.factory-section,.brands-section,.message-section{padding:60px 20px}.honor-section{padding:60px 20px}.about-cover{height:280px}.about-numbers,.factory-grid,.honor-grid,.contact-cards{grid-template-columns:1fr}.about-numbers{gap:30px}.factory-grid img{height:260px}.honor-grid img{height:330px}.cooperation,.message-layout{grid-template-columns:1fr;gap:30px}.cooperation a{grid-column:auto}.contact-cards article{min-height:220px}.message-form{grid-template-columns:1fr}.message-form .full{grid-column:auto}.contact-map{height:400px}}

/* Inner pages: one banner, product center and contact page */
.subpage .inner-main,.subpage .subpage-main{padding-top:0}.subpage .inner-hero{margin-top:0}
.product-center{padding-top:82px;padding-bottom:105px}.product-center-layout{display:grid;grid-template-columns:310px minmax(0,1fr);gap:44px;align-items:start}.product-categories{position:sticky;top:24px;background:#f5f7f6;border-top:4px solid #0b4f8a;padding:0 24px 24px}.product-categories>h3{margin:0 -24px 8px;padding:25px 24px 21px;background:#082b4a;color:#fff;font-size:22px;font-weight:550}.product-categories button{display:flex;align-items:center;justify-content:space-between;gap:18px;width:100%;padding:19px 4px;border:0;border-bottom:1px solid #dce2e0;background:transparent;color:#333;text-align:left;font:inherit;font-size:16px;line-height:1.45;cursor:pointer;transition:color .25s,padding .25s}.product-categories button span{flex:0 0 auto;color:#0b4f8a}.product-categories button:hover,.product-categories button.active{color:#0b4f8a;padding-left:10px}.product-categories>a{display:flex;flex-direction:column;gap:9px;margin-top:24px;padding:22px;background:#0b4f8a;color:#fff;font-size:15px}.product-categories>a b{font-size:17px;font-weight:500}.product-list-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}.product-list-grid article{min-width:0;border:1px solid #e4e8e7;background:#fff;padding:0 22px 25px;transition:transform .35s,box-shadow .35s,border-color .35s}.product-list-grid article:hover{transform:translateY(-7px);border-color:transparent;box-shadow:0 16px 40px rgba(17,45,37,.12)}.product-list-grid article[hidden]{display:none}.product-list-grid article>div{height:310px;margin:0 -22px 22px;background:#f5f6f6;display:flex;align-items:center;justify-content:center;overflow:hidden}.product-list-grid img{display:block;width:86%;height:86%;object-fit:contain;transition:transform .45s}.product-list-grid article:hover img{transform:scale(1.055)}.product-list-grid small{display:block;color:#0b4f8a;font-size:14px;line-height:1.45;margin-bottom:8px}.product-list-grid h3{min-height:52px;margin:0 0 20px;color:#222;font-size:19px;line-height:1.45;font-weight:550}.product-list-grid article>a{display:inline-flex;padding-bottom:7px;border-bottom:1px solid #333;color:#333;font-size:16px}
.contact-info{padding-top:76px;padding-bottom:86px}.contact-cards{gap:0;border-top:1px solid #e2e7e5;border-bottom:1px solid #e2e7e5}.contact-cards article{position:relative;min-height:235px;padding:36px 28px 30px;background:#fff;border-radius:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}.contact-cards article+article:before{content:"";position:absolute;left:0;top:34px;bottom:34px;width:1px;background:#e2e7e5}.contact-cards img{width:54px;height:54px;margin-bottom:17px}.contact-cards h3{font-size:20px;margin-bottom:10px;font-weight:550}.contact-cards a,.contact-cards p{font-size:16px;line-height:1.65;color:#666;margin:0}.message-section{background:#f7f8f8;padding:78px 0 88px}.message-layout{grid-template-columns:420px minmax(0,1fr);gap:90px}.message-layout>div{padding-top:10px}.message-layout .inner-heading{margin-bottom:24px}.message-form{gap:22px 25px;background:#fff;padding:38px 42px;box-shadow:0 12px 35px rgba(28,55,48,.06)}.message-form label{font-size:15px;color:#444}.message-form input,.message-form textarea{font-size:16px;border:0;border-bottom:1px solid #cfd7d4;padding:12px 2px;background:transparent}.message-form button{font-size:16px;transition:background .25s}.message-form button:hover{background:#083d6b}.contact-map{height:570px}
@media(max-width:1200px){.product-list-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.message-layout{grid-template-columns:340px minmax(0,1fr);gap:45px}}
@media(max-width:800px){.product-center{padding:55px 0 70px}.product-center-layout{grid-template-columns:1fr;gap:28px}.product-categories{position:static;padding-bottom:18px}.product-categories>h3{font-size:20px}.product-categories button{font-size:16px;padding-top:15px;padding-bottom:15px}.product-list-grid{grid-template-columns:1fr;gap:22px}.product-list-grid article>div{height:280px}.contact-info{padding:55px 0 65px}.contact-cards{grid-template-columns:1fr}.contact-cards article{min-height:auto;padding:28px 20px}.contact-cards article+article:before{left:20px;right:20px;top:0;bottom:auto;width:auto;height:1px}.message-section{padding:58px 0 65px}.message-layout{grid-template-columns:1fr;gap:25px}.message-form{padding:27px 20px;grid-template-columns:1fr}.contact-map{height:400px}}

/* Solutions inner page */
.solution-intro{padding-top:82px;padding-bottom:65px}.solution-lead{max-width:980px;margin:0 auto;color:#606866;text-align:center;font-size:16px;line-height:1.9}.solution-list{padding-bottom:105px}.solution-detail{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(380px,.92fr);min-height:500px;margin-bottom:42px;background:#f5f7f6;overflow:hidden}.solution-detail.reverse{grid-template-columns:minmax(380px,.92fr) minmax(0,1.08fr)}.solution-detail.reverse .solution-image{order:2}.solution-detail.reverse .solution-detail-copy{order:1}.solution-image{overflow:hidden}.solution-image img{display:block;width:100%;height:100%;min-height:500px;object-fit:cover;transition:transform .7s}.solution-detail:hover .solution-image img{transform:scale(1.045)}.solution-detail-copy{display:flex;flex-direction:column;justify-content:center;padding:58px 62px}.solution-detail-copy>span,.solution-cta span{color:#0b4f8a;font-size:14px;letter-spacing:1.5px}.solution-detail-copy h2{font-size:32px;line-height:1.3;margin:13px 0 20px;font-weight:550}.solution-detail-copy p{color:#68706e;font-size:16px;line-height:1.8;margin:0}.solution-detail-copy ul{margin:21px 0 26px;padding:0;list-style:none}.solution-detail-copy li{position:relative;padding:7px 0 7px 22px;color:#414846;font-size:16px}.solution-detail-copy li:before{content:"";position:absolute;left:0;top:15px;width:8px;height:8px;border-radius:50%;background:#0b4f8a}.solution-detail-copy a{align-self:flex-start;padding-bottom:8px;border-bottom:1px solid #222;color:#222;font-size:16px}.solution-cta{background:#071f36;color:#fff;padding:58px 0}.solution-cta>.content-1600{display:flex;align-items:center;justify-content:space-between;gap:40px}.solution-cta h2{margin:10px 0 0;font-size:32px;font-weight:500}.solution-cta a{flex:0 0 auto;padding:15px 24px;border:1px solid rgba(255,255,255,.65);color:#fff;font-size:16px;transition:background .25s,color .25s}.solution-cta a:hover{background:#fff;color:#071f36}
/* News inner page */
.news-center{padding-top:82px;padding-bottom:105px}.news-featured{display:grid;grid-template-columns:1.12fr .88fr;min-height:470px;background:#f4f7f6;margin-bottom:75px;overflow:hidden}.news-featured-image{overflow:hidden}.news-featured-image img{display:block;width:100%;height:100%;min-height:470px;object-fit:cover;transition:transform .65s}.news-featured:hover img,.news-card:hover img{transform:scale(1.055)}.news-featured-copy{display:flex;flex-direction:column;justify-content:center;padding:52px 58px}.news-featured-copy time,.news-card time{color:#777;font-size:14px}.news-featured-copy>span,.news-card div>span{color:#0b4f8a;font-size:13px;letter-spacing:1.2px;margin-top:14px}.news-featured-copy h2{font-size:30px;line-height:1.38;margin:13px 0 18px;font-weight:550}.news-featured-copy p{font-size:16px;line-height:1.8;color:#68706e;margin:0 0 24px}.news-featured-copy>a,.news-card div>a{align-self:flex-start;color:#222;font-size:16px;padding-bottom:7px;border-bottom:1px solid #222}.news-toolbar{display:flex;align-items:center;justify-content:space-between;gap:30px;padding-bottom:23px;border-bottom:1px solid #dce2e0;margin-bottom:34px}.news-toolbar h2{font-size:30px;margin:0;font-weight:550}.news-toolbar>div{display:flex;gap:8px}.news-toolbar button{border:1px solid #dce2e0;background:#fff;padding:9px 18px;font-size:15px;color:#555;cursor:pointer}.news-toolbar button.active,.news-toolbar button:hover{border-color:#0b4f8a;background:#0b4f8a;color:#fff}.news-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}.news-card{border:1px solid #e1e6e4;background:#fff;overflow:hidden;transition:transform .35s,box-shadow .35s}.news-card:hover{transform:translateY(-7px);box-shadow:0 16px 38px rgba(17,45,37,.1)}.news-card-image{display:block;height:265px;background:#f4f6f5;overflow:hidden}.news-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .55s}.news-card>div{display:flex;flex-direction:column;align-items:flex-start;padding:26px 27px 28px}.news-card h3{min-height:84px;font-size:20px;line-height:1.45;margin:11px 0 13px;font-weight:550}.news-card p{min-height:78px;color:#6b7371;font-size:16px;line-height:1.65;margin:0 0 22px}.news-pagination{display:flex;justify-content:center;gap:9px;margin-top:52px}.news-pagination button{width:42px;height:42px;border:1px solid #d8dedc;background:#fff;color:#333;cursor:pointer}.news-pagination button.active,.news-pagination button:hover{background:#0b4f8a;border-color:#0b4f8a;color:#fff}
/* Unified scroll reveal for all inner pages */
.reveal-item,.inner-main .motion{opacity:0;transform:translateY(42px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.65,.3,1)}.reveal-item.is-visible,.inner-main .motion.is-visible{opacity:1;transform:none}.factory-grid .motion:nth-child(2),.honor-grid .motion:nth-child(2),.contact-cards .motion:nth-child(2),.product-list-grid .motion:nth-child(2),.news-card-grid .motion:nth-child(2){transition-delay:.09s}.factory-grid .motion:nth-child(3),.honor-grid .motion:nth-child(3),.contact-cards .motion:nth-child(3),.product-list-grid .motion:nth-child(3),.news-card-grid .motion:nth-child(3){transition-delay:.18s}
@media(max-width:1000px){.solution-detail,.solution-detail.reverse{grid-template-columns:1fr}.solution-detail.reverse .solution-image,.solution-detail.reverse .solution-detail-copy{order:initial}.solution-image img{min-height:390px}.solution-detail-copy{padding:42px}.news-featured{grid-template-columns:1fr}.news-featured-image img{height:400px;min-height:0}.news-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.solution-intro,.news-center{padding-top:55px}.solution-intro{padding-bottom:42px}.solution-list{padding-bottom:65px}.solution-detail{min-height:0;margin-bottom:24px}.solution-image img{height:260px;min-height:0}.solution-detail-copy{padding:30px 24px 34px}.solution-detail-copy h2{font-size:25px}.solution-cta{padding:42px 0}.solution-cta>.content-1600{align-items:flex-start;flex-direction:column}.solution-cta h2{font-size:25px}.news-featured{min-height:0;margin-bottom:55px}.news-featured-image img{height:270px}.news-featured-copy{padding:30px 24px 35px}.news-featured-copy h2{font-size:24px}.news-toolbar{align-items:flex-start;flex-direction:column}.news-toolbar>div{width:100%;overflow-x:auto}.news-toolbar button{flex:0 0 auto}.news-card-grid{grid-template-columns:1fr}.news-card-image{height:245px}.news-card h3,.news-card p{min-height:0}.reveal-item,.inner-main .motion{transform:translateY(28px)}}
@media(prefers-reduced-motion:reduce){.reveal-item,.inner-main .motion{opacity:1;transform:none;transition:none}}

/* About counters and responsive carousels */
.about-numbers .count-up{display:inline}.about-carousel{position:relative;padding:0 56px}.carousel-viewport{overflow:hidden}.carousel-track{display:flex;gap:24px;transition:transform .65s cubic-bezier(.2,.7,.3,1);will-change:transform}.carousel-track>figure{flex:0 0 calc((100% - 48px)/3);margin:0;background:#fff;overflow:hidden}.factory-carousel .carousel-track img{display:block;width:100%;height:330px;object-fit:cover;transition:transform .5s}.factory-carousel figure:hover img{transform:scale(1.045)}.factory-carousel figcaption{padding:18px 20px;font-size:16px}.honor-carousel .carousel-track>figure{height:420px;display:flex;align-items:center;justify-content:center}.honor-carousel img{width:100%;height:100%;object-fit:contain}.carousel-arrow{position:absolute;z-index:2;top:50%;width:42px;height:42px;margin-top:-21px;border:1px solid #cdd6d3;border-radius:50%;background:#fff;color:#183c5b;font-size:29px;line-height:1;cursor:pointer;box-shadow:0 5px 18px rgba(20,48,40,.1);transition:background .25s,color .25s}.carousel-arrow:hover{background:#0b4f8a;border-color:#0b4f8a;color:#fff}.carousel-arrow.prev{left:0}.carousel-arrow.next{right:0}
/* More compact solution imagery */
.solution-detail{min-height:410px}.solution-image img{height:410px;min-height:410px}.solution-detail-copy{padding-top:40px;padding-bottom:40px}
/* Detail templates */
.product-detail{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(400px,.95fr);gap:72px;padding-top:85px;padding-bottom:70px}.product-main-image{height:610px;background:#f4f6f5;display:flex;align-items:center;justify-content:center;overflow:hidden}.product-main-image img{width:90%;height:90%;object-fit:contain;transition:opacity .25s}.product-thumbnails{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:15px}.product-thumbnails button{height:112px;border:1px solid #dde3e1;background:#f7f8f8;padding:8px;cursor:pointer}.product-thumbnails button.active{border:2px solid #0b4f8a}.product-thumbnails img{width:100%;height:100%;object-fit:contain}.product-summary{padding-top:25px}.detail-category{color:#0b4f8a;font-size:14px;letter-spacing:1.3px}.product-summary h1{font-size:39px;line-height:1.25;margin:14px 0 10px;font-weight:550}.product-model{color:#8a908e!important;border-bottom:1px solid #e1e6e4;padding-bottom:22px}.product-summary>p{font-size:16px;line-height:1.8;color:#626a68}.product-summary dl{margin:30px 0}.product-summary dl>div{display:grid;grid-template-columns:140px 1fr;padding:14px 0;border-bottom:1px solid #e2e7e5}.product-summary dt{color:#777}.product-summary dd{margin:0;font-weight:500}.detail-enquiry{display:inline-flex;background:#0b4f8a;color:#fff;padding:15px 25px}.detail-tabs{display:flex;border-bottom:1px solid #dbe2df;position:sticky;top:0;z-index:5;background:#fff}.detail-tabs a{padding:20px 28px;color:#555;font-size:16px}.detail-tabs a.active,.detail-tabs a:hover{color:#0b4f8a;border-bottom:2px solid #0b4f8a}.detail-content{padding-top:70px;padding-bottom:105px}.detail-content article{margin-bottom:72px}.detail-content h2{font-size:32px;margin:0 0 22px;font-weight:550}.detail-content>article>p{max-width:1100px;color:#626a68;font-size:16px;line-height:1.85}.detail-content>article>img{display:block;width:100%;max-height:590px;object-fit:cover;margin-top:35px}.feature-points{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.feature-points>div{padding:34px;background:#f5f7f6}.feature-points b{color:#0b4f8a;font-size:30px}.feature-points h3{font-size:20px}.feature-points p{font-size:16px;line-height:1.7;color:#68706e}.spec-table{border-top:1px solid #dce2e0}.spec-table>div{display:grid;grid-template-columns:1fr 1fr;padding:18px 22px;border-bottom:1px solid #dce2e0}.spec-table>div:nth-child(odd){background:#f6f8f7}.spec-table span{color:#68706e}.spec-table b{font-weight:500}
.news-article{max-width:1240px!important;padding-top:82px;padding-bottom:105px}.article-header{text-align:center;max-width:1000px;margin:0 auto 45px}.article-header>span{color:#0b4f8a;font-size:14px;letter-spacing:1.3px}.article-header h1{font-size:42px;line-height:1.3;margin:14px 0 20px;font-weight:550}.article-header>div{display:flex;justify-content:center;align-items:center;gap:14px;color:#7a817f}.article-header i{width:4px;height:4px;border-radius:50%;background:#0b4f8a}.article-cover{margin:0 0 55px;height:620px;overflow:hidden}.article-cover img{width:100%;height:100%;object-fit:cover}.article-layout{display:grid;grid-template-columns:80px minmax(0,820px);justify-content:center;gap:45px}.article-share{display:flex;flex-direction:column;align-items:center;gap:12px}.article-share>span{writing-mode:vertical-rl;font-size:12px;letter-spacing:2px;margin-bottom:8px}.article-share a{width:38px;height:38px;border:1px solid #dce2e0;border-radius:50%;display:grid;place-items:center;color:#333}.article-body p{font-size:17px;line-height:1.9;color:#5e6765}.article-lead{font-size:21px!important;color:#183c5b!important}.article-body section{margin:48px 0}.article-body h2{font-size:30px;margin:0 0 18px}.article-body figure{margin:45px 0}.article-body figure img{width:100%;max-height:520px;object-fit:cover}.article-body figcaption{color:#888;font-size:14px;margin-top:10px}.article-body blockquote{margin:30px 0;padding:25px 30px;border-left:4px solid #0b4f8a;background:#f4f7f6;font-size:19px;line-height:1.7}.article-nav{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #dce2e0;padding-top:30px;margin-top:60px}.article-nav a{color:#333}
/* FAQ */
.faq-intro{padding-top:82px;padding-bottom:48px}.faq-layout{display:grid;grid-template-columns:360px minmax(0,1fr);gap:70px;align-items:start;padding-bottom:105px}.faq-aside{position:sticky;top:30px;padding:38px;background:#071f36;color:#fff}.faq-aside>span{color:#2f7fbd;font-size:13px;letter-spacing:1.3px}.faq-aside h2{font-size:29px;line-height:1.35;margin:14px 0 18px}.faq-aside p{font-size:16px;line-height:1.75;color:#c9d1cf}.faq-aside a{display:inline-flex;margin-top:18px;padding-bottom:8px;border-bottom:1px solid #fff;color:#fff}.faq-item{border-bottom:1px solid #dce2e0}.faq-item>button{display:flex;align-items:center;justify-content:space-between;gap:25px;width:100%;padding:25px 0;border:0;background:none;text-align:left;color:#252c2a;font-size:19px;font-weight:500;cursor:pointer}.faq-item i{position:relative;flex:0 0 22px;width:22px;height:22px}.faq-item i:before,.faq-item i:after{content:"";position:absolute;left:2px;top:10px;width:18px;height:2px;background:#0b4f8a}.faq-item i:after{transform:rotate(90deg);transition:transform .25s}.faq-item.open i:after{transform:rotate(0)}.faq-answer{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s}.faq-answer>p{overflow:hidden;margin:0;color:#68706e;font-size:16px;line-height:1.8}.faq-item.open .faq-answer{grid-template-rows:1fr}.faq-item.open .faq-answer>p{padding-bottom:26px}
@media(max-width:1100px){.carousel-track>figure{flex-basis:calc((100% - 24px)/2)}.product-detail{grid-template-columns:1fr;gap:35px}.product-main-image{height:520px}.faq-layout{grid-template-columns:300px 1fr;gap:35px}}
@media(max-width:800px){.about-carousel{padding:0 42px}.carousel-track>figure{flex-basis:100%}.factory-carousel .carousel-track img{height:250px}.honor-carousel .carousel-track>figure{height:330px}.carousel-arrow{width:36px;height:36px;margin-top:-18px}.solution-detail{min-height:0}.solution-image img{height:230px;min-height:0}.product-detail{padding-top:55px;padding-bottom:55px}.product-main-image{height:330px}.product-thumbnails{gap:7px}.product-thumbnails button{height:75px}.product-summary h1{font-size:29px}.product-summary dl>div{grid-template-columns:110px 1fr}.detail-tabs{overflow-x:auto}.detail-tabs a{flex:0 0 auto;padding:16px 18px}.detail-content{padding-top:50px;padding-bottom:70px}.feature-points{grid-template-columns:1fr}.spec-table>div{grid-template-columns:1fr;gap:7px}.news-article{padding-top:55px;padding-bottom:70px}.article-header h1{font-size:29px}.article-cover{height:300px;margin-bottom:40px}.article-layout{grid-template-columns:1fr;gap:25px}.article-share{flex-direction:row}.article-share>span{writing-mode:initial;margin:0 10px 0 0}.article-body p{font-size:16px}.article-lead{font-size:18px!important}.article-nav{flex-direction:column}.faq-intro{padding-top:55px;padding-bottom:35px}.faq-layout{grid-template-columns:1fr;gap:30px;padding-bottom:70px}.faq-aside{position:static}.faq-item>button{font-size:17px;padding:21px 0}}

/* Certificate carousel: five compact items per desktop view */
.honor-carousel{padding-left:48px;padding-right:48px}.honor-carousel .carousel-track{gap:16px}.honor-carousel .carousel-track>figure{flex-basis:calc((100% - 64px)/5);height:310px;padding:8px}.honor-carousel img{max-width:100%;max-height:100%}
/* News detail article typography correction */
.news-article{max-width:1320px!important}.article-header{max-width:1080px;margin-bottom:48px}.article-header h1{max-width:1050px;margin-left:auto;margin-right:auto}.article-layout{display:block;max-width:980px;margin:0 auto}.article-share{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;gap:10px;margin:0 0 34px;padding-bottom:22px;border-bottom:1px solid #e0e5e3}.article-share>span{writing-mode:initial;margin:0 12px 0 0;font-size:12px;line-height:1;letter-spacing:1.8px}.article-body{width:100%}.article-body>p,.article-body>section,.article-body>figure{max-width:900px;margin-left:auto;margin-right:auto}.article-body p{margin-top:0;margin-bottom:22px;font-size:17px;line-height:1.9;letter-spacing:.05px;color:#525c59}.article-body .article-lead{margin-bottom:42px;font-size:21px!important;line-height:1.8;font-weight:400;color:#183c5b!important}.article-body section{margin-top:52px;margin-bottom:52px}.article-body h2{margin:0 0 22px;font-size:31px;line-height:1.35;font-weight:550;color:#202725}.article-body figure{margin-top:48px;margin-bottom:50px}.article-body figure img{display:block;width:100%;height:auto;max-height:540px;object-fit:cover}.article-body figcaption{margin-top:12px;text-align:center;font-size:14px;line-height:1.6;color:#858d8a}.article-body blockquote{margin:32px 0 0;padding:24px 30px;background:#f3f7f5;border-left:4px solid #0b4f8a;font-size:19px;line-height:1.75;color:#234a69}.article-nav{max-width:900px;margin:65px auto 0;padding-top:28px;align-items:center}.article-nav a{font-size:15px;line-height:1.5}
@media(max-width:1400px) and (min-width:1101px){.honor-carousel .carousel-track>figure{flex-basis:calc((100% - 32px)/3)}}
@media(max-width:1100px) and (min-width:801px){.honor-carousel .carousel-track>figure{flex-basis:calc((100% - 16px)/2)}}
@media(max-width:800px){.honor-carousel{padding-left:40px;padding-right:40px}.honor-carousel .carousel-track>figure{flex-basis:100%;height:300px;padding:5px}.article-header{margin-bottom:32px}.article-header>div{flex-wrap:wrap}.article-layout{max-width:100%}.article-share{margin-bottom:28px}.article-body>p,.article-body>section,.article-body>figure{max-width:100%}.article-body p{font-size:16px;line-height:1.82;margin-bottom:18px}.article-body .article-lead{font-size:18px!important;line-height:1.75;margin-bottom:34px}.article-body section{margin-top:40px;margin-bottom:40px}.article-body h2{font-size:25px;margin-bottom:17px}.article-body blockquote{padding:20px;font-size:17px}.article-nav{align-items:flex-start;margin-top:48px}}

/* Six certificates per view and refined cooperation copy */
.honor-carousel .carousel-track>figure{flex-basis:calc((100% - 80px)/6);height:285px;padding:6px}.cooperation{margin-top:38px;display:grid;grid-template-columns:minmax(300px,.78fr) minmax(0,1.22fr);gap:75px;padding:48px 52px;background:#fff;align-items:start}.cooperation-title>span{display:block;margin-bottom:13px;color:#0b4f8a;font-size:13px;letter-spacing:1.6px}.cooperation-title h3{margin:0;max-width:460px;font-size:29px;line-height:1.4;font-weight:550;color:#222}.cooperation-copy{padding-left:54px;border-left:1px solid #dce3e0}.cooperation-copy p{margin:0 0 17px;color:#626b68;font-size:16px;line-height:1.8}.cooperation-copy a{display:inline-flex;width:auto;margin-top:9px;padding:13px 23px;border:1px solid #183c5b;color:#183c5b;font-size:16px;transition:background .25s,color .25s}.cooperation-copy a:hover{background:#0b4f8a;border-color:#0b4f8a;color:#fff}
@media(max-width:1400px) and (min-width:1101px){.honor-carousel .carousel-track>figure{flex-basis:calc((100% - 32px)/3)}}
@media(max-width:900px){.cooperation{grid-template-columns:1fr;gap:28px;padding:34px 28px}.cooperation-copy{padding-left:0;padding-top:27px;border-left:0;border-top:1px solid #dce3e0}.cooperation-title h3{font-size:25px}}
@media(max-width:800px){.honor-carousel .carousel-track>figure{flex-basis:100%;height:290px}.cooperation{margin-top:28px;padding:28px 22px}.cooperation-title h3{font-size:23px}.cooperation-copy p{font-size:16px;line-height:1.75}}

/* Fully clickable product/news cards and corrected custom-solution panel */
.product-categories .category-contact{display:flex;flex-direction:column;align-items:flex-start;gap:11px;margin-top:24px;padding:24px 22px;background:#0b4f8a;color:#fff;line-height:1.45;transition:background .25s,transform .25s}.product-categories .category-contact:hover{background:#083d6b;transform:translateY(-2px)}.product-categories .category-contact>span{font-size:16px;color:rgba(255,255,255,.88)}.product-categories .category-contact>b{display:flex;align-items:center;justify-content:space-between;width:100%;font-size:19px;font-weight:550}.product-categories .category-contact i{font-style:normal;font-size:21px}.product-list-grid article,.news-card{position:relative}.card-hit{position:absolute!important;z-index:4;inset:0;display:block!important;border:0!important;padding:0!important}.product-list-grid article>a:not(.card-hit),.news-card a:not(.card-hit){position:relative;z-index:2;pointer-events:none}.product-list-grid article:focus-within,.news-card:focus-within{outline:2px solid #0b4f8a;outline-offset:3px}

/* Prevent legacy floating-aside rules from affecting product categories */
.product-center-layout>.product-categories{bottom:auto!important;border-radius:0!important;overflow:visible!important;box-shadow:none!important}.product-center-layout>.product-categories .category-contact{width:100%!important;height:auto!important;min-height:118px!important;font-size:16px!important;box-sizing:border-box!important;border-radius:0!important;overflow:visible!important}.product-center-layout>.product-categories .category-contact>span,.product-center-layout>.product-categories .category-contact>b{width:100%;white-space:normal;overflow:visible}.product-center-layout>.product-categories .category-contact>b{min-height:28px}
@media(max-width:800px){.product-center-layout>.product-categories .category-contact{min-height:105px!important}}



/* Guanyu Electrical deep-blue brand refinements */
:root{--brand:#0b4f8a;--brand-dark:#071f36;--brand-light:#eaf2f8}.heading i,.sol-title i{background:#0b4f8a!important}.hero:after{background:linear-gradient(90deg,rgba(3,20,36,.42),rgba(5,33,58,.12),rgba(3,20,36,.32))}.cards article:hover,.product-list-grid article:hover,.news-card:hover{box-shadow:0 18px 42px rgba(6,45,78,.14)}.cards .pic,.product-list-grid article>div{background:#f0f4f7}.solution-cta,.faq-aside{background:#071f36}.contact-cards img{filter:hue-rotate(85deg) saturate(.7)}

/* Code-native contact symbols replace legacy image icons */
.contact-cards article:after{order:-1;display:grid;place-items:center;width:54px;height:54px;margin:0 auto 17px;border-radius:50%;background:#eaf2f8;color:#0b4f8a;font-size:23px;font-weight:600}.contact-cards article:nth-child(1):after{content:"☎"}.contact-cards article:nth-child(2):after{content:"◉"}.contact-cards article:nth-child(3):after{content:"@"}.contact-cards article:nth-child(4):after{content:"⌖"}

/* Brighter banner presentation */
.hero:after{background:linear-gradient(90deg,rgba(4,24,42,.16),rgba(5,33,58,.04),rgba(4,24,42,.12))!important}.inner-hero:before{background:rgba(5,28,48,.13)!important}.hero-slide{filter:brightness(1.08) saturate(1.02)}.hero-copy{filter:none}

/* Keep bright banners while preserving headline contrast */
.hero-copy{padding-top:34px;padding-bottom:34px;background:linear-gradient(90deg,transparent 0%,rgba(3,28,51,.18) 12%,rgba(3,28,51,.52) 34%,rgba(3,28,51,.52) 66%,rgba(3,28,51,.18) 88%,transparent 100%)}.hero-copy h2,.hero-copy p{color:#fff!important;text-shadow:0 2px 5px rgba(0,15,30,.8),0 0 18px rgba(0,20,40,.42)}.hero-copy h2{font-weight:650}.inner-hero h1,.inner-hero p{color:#fff!important;text-shadow:0 2px 6px rgba(0,15,30,.85),0 0 18px rgba(0,20,40,.45)}
@media(max-width:800px){.hero-copy{padding-top:20px;padding-bottom:20px;background:linear-gradient(90deg,rgba(3,28,51,.18),rgba(3,28,51,.58),rgba(3,28,51,.18))}.hero-copy h2,.hero-copy p{text-shadow:0 2px 4px rgba(0,12,24,.9)}}

/* Real factory, product and customer photography */
.about-cover img,.factory-carousel img,.customer-visit-grid img{object-position:center}.customer-visits-section{padding:85px 0 95px;background:#fff}.customer-visit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.customer-visit-grid figure{margin:0;background:#f3f6f8;overflow:hidden}.customer-visit-grid img{display:block;width:100%;height:460px;object-fit:cover;transition:transform .55s}.customer-visit-grid figure:hover img{transform:scale(1.035)}.customer-visit-grid figcaption{padding:18px 22px;color:#1b3851;font-size:16px}.why .map img{width:100%;height:100%;object-fit:cover}.product-list-grid img[src$=".jpg"],.cards img[src$=".jpg"]{width:100%;height:100%;object-fit:contain}
@media(max-width:800px){.customer-visits-section{padding:58px 0 65px}.customer-visit-grid{grid-template-columns:1fr;gap:20px}.customer-visit-grid img{height:280px}}

/* Homepage news — Guanyu deep-blue visual system */
#news{background:#eef3f7;color:#182d40}
#news>.heading h2{color:#071f36}
#news>.heading h2:after{background:#0b4f8a}
#news>.heading>p{color:#637381}
#news .feature{background:#fff;border:1px solid #dce6ed;box-shadow:0 14px 38px rgba(7,31,54,.08)}
#news .feature h3{color:#0b4f8a}
#news .feature p{color:#596a77}
#news .feature .date{background:#0b4f8a;color:#fff}
#news .feature .date b,#news .feature .date span{color:#fff}
#news .news-list article{background:#fff;border:1px solid #dce6ed;box-shadow:0 8px 24px rgba(7,31,54,.055);transition:transform .35s,border-color .35s,box-shadow .35s}
#news .news-list article:hover{transform:translateY(-4px);border-color:#b9ccda;box-shadow:0 15px 34px rgba(7,31,54,.11)}
#news .news-list h3{color:#132c41}
#news .news-list p{color:#63727e}
#news .news-list time{color:#0b4f8a;font-weight:500}
#news .news-list .more{background:#0b4f8a;color:#fff;border-color:#0b4f8a}
#news .news-list .more:hover{background:#071f36;border-color:#071f36}
#news .news-list .more b{color:inherit}
@media(max-width:800px){#news{background:#eef3f7}#news .feature,#news .news-list article{box-shadow:0 8px 22px rgba(7,31,54,.07)}}

/* Guanyu folder-driven gallery carousels */
.home-honor-section{padding:85px 0 95px;background:#fff}
.home-honor-section .inner-heading{margin-bottom:38px}
.customer-carousel .carousel-track>figure{flex-basis:calc((100% - 48px)/3);background:#f3f6f8}
.customer-carousel .carousel-track img{display:block;width:100%;height:360px;object-fit:cover;transition:transform .5s}
.customer-carousel .carousel-track figure:hover img{transform:scale(1.045)}
.customer-carousel figcaption{padding:17px 20px;color:#183c5b;font-size:16px}
.factory-carousel .carousel-track>figure{background:#fff}
@media(max-width:1400px) and (min-width:1101px){.customer-carousel .carousel-track>figure{flex-basis:calc((100% - 24px)/2)}}
@media(max-width:1100px) and (min-width:801px){.customer-carousel .carousel-track>figure{flex-basis:calc((100% - 24px)/2)}}
@media(max-width:800px){.home-honor-section{padding:58px 0 65px}.customer-carousel .carousel-track>figure{flex-basis:100%}.customer-carousel .carousel-track img{height:280px}}