@media (max-width: 828px) {
    :root {
        --rpx-50: calc(0.86667vw / 7.5);
        --rpx-67: calc(1vw / 7.5);
        --rpx-75: calc(1.25vw / 7.5);
        --fpx-87: clamp(0.82px, calc(1.70vw / 7.5), 0.92px);
        --fpx-75: clamp(0.72px, calc(1.48vw / 7.5), 0.86px);
        --fpx-67: clamp(0.58px, calc(1.20vw / 7.5), 0.76px);
        --fpx-50: clamp(0.42px, calc(0.92vw / 7.5), 0.60px);
        --rpx: var(--rpx-67);
        --fpx: var(--fpx-87);
        --wrapper-width: calc(100vw - 40px);
        --wrapper-wide: calc(100vw - 40px);
        --header-height: calc(88 * var(--rpx));
        --content-width: calc(100vw - 40px);
    }

    .site-header.is-compact {
        height: var(--header-height);
    }

    .site-header.is-compact .site-logo img {
        width: calc(140 * var(--rpx));
        height: calc(52 * var(--rpx));
    }

    .site-header .wrapper-wide {
        display: flex;
        padding-top: 0;
        position: relative;
    }

    .site-logo {
        margin-right: auto;
        position: relative;
        z-index: 70;
    }

    .nav-right {
        margin-left: auto;
        position: relative;
        z-index: 70;
        gap: calc(8 * var(--rpx));
    }

    .site-header {
        z-index: 700;
        overflow: visible;
    }

    .site-header.is-search-open::after {
        display: none;
    }

    .nav-overlay,
    .top-nav {
        display: none !important;
    }

    .nav-expand {
        display: none;
    }

    .header-search-input {
        display: none !important;
        width: 0 !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    .header-search-submit {
        display: none !important;
    }

    .header-search-trigger {
        display: inline-flex;
    }

    .header-search {
        border: 0;
    }

    .header-search.is-open .header-search-input {
        width: 0 !important;
        max-width: 0;
        opacity: 0;
        pointer-events: none;
    }

    .site-header.is-search-open .top-nav {
        opacity: 1;
        visibility: visible;
        pointer-events: none;
        transform: none;
    }

    .btn-menu {
        display: inline-flex;
        z-index: 70;
        width: calc(48 * var(--rpx));
        height: calc(48 * var(--rpx));
    }

    .header-search-drop {
        display: none;
        position: absolute;
        left: 0;
        right: 0;
        top: 100%;
        z-index: 80;
        align-items: stretch;
        gap: 0;
        padding: calc(12 * var(--rpx)) calc(20 * var(--rpx)) calc(16 * var(--rpx));
        background: #fff;
        box-shadow: 0 calc(8 * var(--rpx)) calc(24 * var(--rpx)) rgba(0, 12, 36, 0.12);
        border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    }

    .site-header.is-search-open .header-search-drop {
        display: flex;
    }

    .header-search-drop-input {
        flex: 1;
        min-width: 0;
        height: calc(72 * var(--rpx));
        margin: 0;
        border: 1px solid rgba(17, 17, 17, 0.22);
        border-right: 0;
        border-radius: calc(16 * var(--rpx)) 0 0 calc(16 * var(--rpx));
        padding: 0 calc(20 * var(--rpx));
        font-size: calc(20 * var(--fpx));
        line-height: 1.4;
        color: var(--text);
        background: #fff;
        outline: none;
    }

    .header-search-drop:focus-within .header-search-drop-input {
        border-color: var(--brand);
        background: #fff;
    }

    .header-search-drop-submit {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: calc(72 * var(--rpx));
        min-width: calc(72 * var(--rpx));
        height: calc(72 * var(--rpx));
        border: 0;
        border-radius: 0 calc(16 * var(--rpx)) calc(16 * var(--rpx)) 0;
        padding: 0;
        background: var(--brand);
        color: #fff;
        cursor: pointer;
    }

    .header-search-drop-submit img {
        display: block;
        width: calc(28 * var(--rpx));
        height: calc(28 * var(--rpx));
    }

    .page-home .hero {
        --hero-scale: 1px;
        --hero-design-h: auto;
        --hero-indicators-space: 0px;
        height: calc(550 * var(--fpx));
        min-height: 0;
        padding-top: 0;
        aspect-ratio: auto;
        background: #edf2f8;
    }

    .page-home .hero-swiper {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
    }

    .page-home .hero-swiper,
    .page-home .hero-swiper .swiper-wrapper,
    .page-home .hero-swiper .swiper-slide {
        height: 100%;
    }

    .page-home .hero-bg {
        top: var(--header-height);
        bottom: auto;
        height: calc(260 * var(--fpx));
    }

    .page-home .hero-bg img {
        object-position: center 35%;
    }

    .page-home .hero-layout-layered .hero-bg img {
        object-position: center 12%;
    }

    .page-home .hero-fg {
        height: 100%;
        min-height: 0;
        transform: none;
        padding: calc(var(--header-height) + 24 * var(--rpx)) 0 calc(72 * var(--rpx));
        justify-content: flex-end;
    }

    .page-about .hero,
    .page-news .hero,
    .page-contact .hero {
        height: auto;
        min-height: calc(420 * var(--rpx));
    }

    .page-about .hero-fg,
    .page-news .hero-fg,
    .page-contact .hero-fg {
        height: auto;
        min-height: calc(420 * var(--rpx));
        transform: none;
        padding: calc(var(--header-height) + 32 * var(--rpx)) 0 calc(56 * var(--rpx));
        justify-content: flex-end;
    }

    .hero-card,
    .page-about .hero-card,
    .page-news .hero-card,
    .page-contact .hero-card {
        max-width: none;
        min-height: 0;
        padding: calc(24 * var(--rpx));
    }

    .page-home .hero-card {
        padding: calc(32 * var(--rpx));
    }

    .page-home .hero-card .title {
        font-size: calc(40 * var(--fpx-50));
    }

    .page-home .hero-card .desc {
        font-size: calc(15 * var(--fpx));
    }

    .hero-indicators-wrap {
        bottom: calc(16 * var(--rpx));
    }

    .hero-indicators-wrap::before {
        display: none;
    }

    .hero-indicators-wrap .wrapper {
        display: flex;
        justify-content: center;
        width: 58%;
        max-width: calc(240 * var(--rpx));
    }

    .hero-indicators {
        flex-wrap: nowrap;
        width: 100%;
        gap: calc(8 * var(--rpx));
    }

    .hero-indicator {
        flex: 1;
        width: auto;
        height: calc(4 * var(--rpx));
        padding: 0;
        border: 0;
        overflow: hidden;
        color: transparent;
        line-height: 0;
        background: transparent;
    }

    .hero-indicator .bar {
        height: 100%;
    }

    .hero-indicator:hover {
        color: transparent;
        background: transparent;
    }

    .hero-indicator:hover .bar {
        background: rgba(255, 255, 255, 0.7);
    }

    .hero-indicator.is-active:hover .bar {
        background: #fff;
    }

    .sec-products,
    .sec-solutions,
    .sec-about,
    .sec-news,
    .sec-cta {
        padding: calc(48 * var(--rpx)) 0;
    }

    .sec-cta {
        padding: calc(32 * var(--rpx)) 0;
    }

    .sec-head {
        margin-bottom: calc(24 * var(--rpx));
        gap: calc(12 * var(--rpx));
    }

    .product-prev,
    .product-next,
    .news-prev,
    .news-next {
        width: calc(44 * var(--rpx));
        height: calc(44 * var(--rpx));
    }

    .sec-products {
        overflow: hidden;
    }

    .product-swiper-wrap {
        overflow: visible;
    }

    .sec-products .product-swiper,
    .sec-products .product-swiper.swiper {
        overflow: visible !important;
    }

    .product-card,
    .footer-info {
        width: 100%;
    }

    .product-card {
        width: 70vw;
        max-width: none;
        height: auto;
        margin-right: calc(16 * var(--rpx));
        margin-bottom: 0;
    }

    .product-card .pic,
    .product-card .hover {
        height: auto;
        aspect-ratio: 377.5 / 225;
    }

    .sec-solutions .tabs {
        overflow: hidden;
        margin: 0 calc(-20px) calc(20 * var(--rpx));
        padding: 0 20px;
        width: calc(100% + 40px);
    }

    .sec-solutions .tabs .swiper-wrapper {
        flex-wrap: nowrap;
        gap: 0;
    }

    .sec-solutions .tab {
        flex-shrink: 0;
        height: auto;
        min-height: calc(44 * var(--rpx));
        padding: calc(8 * var(--rpx)) calc(14 * var(--rpx));
    }

    .sec-about .wrapper,
    .sec-cta .wrapper,
    .site-footer .part1 .wrapper,
    .site-footer .part2 .wrapper {
        display: block;
    }

    .sec-about .info {
        margin-bottom: calc(24 * var(--rpx));
    }

    .sec-about .desc,
    .sec-about .points {
        max-width: none;
    }

    .sec-about {
        overflow: hidden;
    }

    .about-news {
        overflow: visible;
        width: 100%;
    }

    .about-news.swiper {
        overflow: visible !important;
    }

    .about-news .swiper-wrapper {
        flex-wrap: nowrap;
        gap: 0;
    }

    .about-news .about-card,
    .about-news .swiper-slide {
        width: 70vw;
        max-width: none;
        height: auto;
        margin-right: calc(16 * var(--rpx));
        margin-bottom: 0;
    }

    .about-card .pic {
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .sec-solutions .panels {
        min-height: 0;
    }

    .sec-solutions .panel {
        min-height: 0;
        flex-direction: column;
        gap: 0;
    }

    .sec-solutions .panel.is-active {
        min-height: 0;
    }

    .sec-solutions .intro,
    .sec-solutions .news {
        width: 100%;
    }

    .sec-solutions .news .pic {
        height: auto;
        aspect-ratio: 2 / 1;
        background: #fff;
    }

    .sec-solutions .news .pic img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    .sec-solutions .news .news-title {
        margin-top: calc(8 * var(--fpx));
        line-height: 1.45;
    }

    .sec-solutions .intro {
        display: flex;
        flex-direction: column-reverse;
        min-height: 0;
        margin-bottom: calc(16 * var(--rpx));
    }

    .sec-solutions .intro .info {
        width: 100%;
        padding: calc(24 * var(--rpx));
    }

    .sec-solutions .intro .info::after {
        display: none;
    }

    .sec-solutions .intro .pic {
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 10;
    }

    .sec-solutions .intro .info .name {
        font-size: calc(24 * var(--fpx));
    }

    .sec-solutions .list {
        padding-left: 0;
        border-left: 0;
        display: flex;
        flex-wrap: wrap;
        list-style: disc;
        list-style-position: inside;
    }

    .sec-solutions .list li {
        width: 50%;
        box-sizing: border-box;
        padding: 0;
    }

    .sec-solutions .intro .info .btn-more {
        width: 100%;
        margin-top: calc(20 * var(--rpx));
    }

    .cta-follow {
        width: 100%;
        margin-top: calc(20 * var(--rpx));
    }

    .sec-news {
        overflow: hidden;
    }

    .news-swiper-outer {
        width: var(--wrapper-width);
        margin-left: auto;
        margin-right: auto;
    }

    .news-swiper-wrap {
        width: var(--wrapper-width);
        padding: 0;
        overflow: visible;
    }

    .sec-news .news-swiper .swiper-slide,
    .news-card {
        width: 75%;
        max-width: none;
        height: auto;
        margin-right: calc(12 * var(--rpx));
    }

    .news-card .pic {
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .sec-news .news-swiper .swiper-slide.featured,
    .news-card.featured {
        height: calc(565 * var(--rpx));
    }

    .news-card.featured .pic {
        position: relative;
        height: 100%;
        aspect-ratio: auto;
    }

    .site-float {
        top: auto;
        bottom: max(16px, env(safe-area-inset-bottom, 0px));
        right: calc(12 * var(--rpx));
        transform: none;
        gap: calc(8 * var(--rpx));
    }

    .site-float-item {
        width: max(44px, calc(52 * var(--rpx)));
        height: max(44px, calc(52 * var(--rpx)));
    }

    .site-float-item > img {
        width: max(22px, calc(28 * var(--rpx)));
        height: max(20px, calc(24 * var(--rpx)));
    }

    .site-float-top {
        position: static;
        top: auto;
        left: auto;
        width: max(44px, calc(52 * var(--rpx)));
        height: 0;
        max-height: 0;
        margin-top: calc(-8 * var(--rpx));
        overflow: hidden;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: height 0.32s cubic-bezier(0.22, 1, 0.36, 1),
            max-height 0.32s cubic-bezier(0.22, 1, 0.36, 1),
            margin-top 0.32s cubic-bezier(0.22, 1, 0.36, 1),
            opacity 0.24s ease,
            visibility 0.32s;
    }

    .site-float-top.is-visible {
        height: max(44px, calc(52 * var(--rpx)));
        max-height: max(44px, calc(52 * var(--rpx)));
        margin-top: 0;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    .site-float-item .float-bubble-inner {
        white-space: normal;
        max-width: calc(200 * var(--rpx));
    }

    .footer-nav {
        display: none;
    }

    .footer-divider {
        display: none;
    }

    .site-footer .part1 {
        padding: calc(40 * var(--rpx)) 0 calc(24 * var(--rpx));
    }

    .footer-info {
        padding: 0;
        border-left: 0;
        width: 100%;
        min-width: 0;
        margin-right: 0;
    }

    .footer-info .hotline {
        align-items: center;
    }

    .footer-info .tel-icon {
        width: calc(72 * var(--rpx));
        height: calc(72 * var(--rpx));
    }

    .footer-info .tel-icon img {
        width: calc(34 * var(--rpx));
        height: calc(34 * var(--rpx));
    }

    .footer-info .hotline-text {
        min-height: 0;
    }

    .footer-info .row-text {
        grid-template-columns: max-content 1fr;
        min-width: 0;
        flex: 1;
    }

    .footer-info .row-text .v {
        white-space: normal;
    }

    .site-footer .part2 .wrapper {
        align-items: flex-start;
        gap: calc(16 * var(--rpx));
    }

    .site-footer .copyright {
        max-width: none;
    }

    .site-footer .legal {
        display: flex;
        flex-wrap: wrap;
        margin-left: 0;
        white-space: normal;
    }

    .site-footer .follow {
        display: none;
    }

    .inner-nav-tabs,
    .page-news .inner-nav-tabs {
        gap: calc(28 * var(--rpx));
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .inner-nav-tabs::-webkit-scrollbar,
    .page-news .inner-nav-tabs::-webkit-scrollbar {
        display: none;
        height: 0;
    }

    .inner-nav-tabs a,
    .page-news .inner-nav-tabs a {
        flex-shrink: 0;
    }

    .inner-nav-tabs a.is-current::after,
    .page-news .inner-nav-tabs a.is-current::after {
        bottom: 0;
    }

    .page-crumb .crumb,
    .page-news .page-crumb .crumb,
    .page-contact .page-crumb .crumb {
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .about-sec {
        padding-top: calc(40 * var(--rpx));
    }

    .about-why {
        padding-bottom: calc(48 * var(--rpx));
    }

    .news-featured {
        position: relative;
        display: flex;
        flex-direction: column;
        height: auto;
    }

    .news-featured .pic {
        position: relative;
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
        flex-shrink: 0;
    }

    .news-featured .info {
        display: contents;
    }

    .news-featured .meta {
        position: absolute;
        left: calc(20 * var(--rpx));
        top: calc(20 * var(--rpx));
        z-index: 1;
    }

    .news-featured .news-title {
        margin: calc(30 * var(--rpx)) calc(28 * var(--rpx)) 0;
        font-size: calc(24 * var(--fpx-67));
        font-weight: 500;
        line-height: calc(34em / 24);
        color: #000;
        -webkit-line-clamp: 2;
    }

    .news-featured .news-desc {
        margin: calc(14 * var(--rpx)) calc(28 * var(--rpx)) 0;
        font-size: calc(16 * var(--fpx));
        font-weight: 300;
        line-height: calc(28em / 16);
        color: rgba(0, 0, 0, 0.6);
        text-align: start;
        -webkit-line-clamp: 2;
    }

    .news-featured .more {
        margin-top: calc(20 * var(--rpx));
        margin-bottom: calc(20 * var(--rpx));
        padding: 0 calc(28 * var(--rpx));
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        box-sizing: border-box;
    }

    .page-news .news-list {
        margin-top: calc(16 * var(--rpx));
    }

    .news-list {
        display: block;
        margin-top: calc(24 * var(--rpx));
    }

    .news-list li {
        margin-bottom: calc(16 * var(--rpx));
    }

    .news-item {
        height: auto;
    }

    .news-item .pic {
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .news-item .more {
        margin-top: calc(20 * var(--rpx));
        margin-bottom: calc(20 * var(--rpx));
    }

    .news-pager {
        flex-wrap: wrap;
        gap: calc(12 * var(--rpx));
    }

    .news-pager .pager-btn {
        width: auto;
        min-width: calc(88 * var(--rpx));
        padding: 0 calc(16 * var(--rpx));
    }

    .news-article > .crumb {
        position: static;
        right: auto;
        box-sizing: border-box;
        width: 100%;
        max-width: 100%;
        padding: calc(16 * var(--rpx)) var(--wrapper-margin) 0;
        justify-content: flex-start;
        flex-wrap: nowrap;
        overflow: hidden;
    }

    .news-article > .crumb a,
    .news-article > .crumb .sep {
        flex-shrink: 0;
    }

    .news-article > .crumb .is-current {
        min-width: 0;
        flex: 1 1 auto;
        max-width: none;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .news-article-title {
        line-height: 1.35;
    }

    .news-article-pic {
        width: 100%;
        height: auto;
        aspect-ratio: 800 / 450;
    }

    .news-article-pager {
        display: block;
    }

    .news-article-pager::before {
        display: none;
    }

    .news-article-pager .pager-prev,
    .news-article-pager .pager-next {
        width: 100%;
    }

    .pager-prev,
    .pager-next {
        padding-left: 0;
        padding-right: 0;
    }

    .pager-next {
        margin-top: calc(20 * var(--rpx));
        padding-top: calc(20 * var(--rpx));
        border-top: 1px solid rgba(0, 0, 0, 0.15);
    }

    .news-related-head {
        display: block;
    }

    .news-related-head .btn-more {
        margin-top: calc(16 * var(--rpx));
    }

    .news-related-title {
        line-height: 1.3;
    }

    .material-list,
    .why-list {
        display: grid;
        gap: calc(12 * var(--rpx));
    }

    .app-list {
        display: grid;
        gap: calc(20 * var(--rpx));
        grid-template-columns: 1fr 1fr 1fr;
    }

    .material-list {
        grid-template-columns: 1fr 1fr;
    }

    .why-list {
        grid-template-columns: 1fr;
    }

    .material-list li,
    .material-list li:last-child,
    .app-card,
    .why-card {
        width: 100%;
        height: auto;
    }

    .material-list li {
        min-height: calc(72 * var(--rpx));
        padding: calc(12 * var(--rpx));
    }

    .app-card {
        aspect-ratio: 1;
        min-height: 0;
    }

    .app-card .icon {
        inset: 0 0 calc(40 * var(--rpx));
        width: auto;
        height: auto;
    }

    .app-card .label {
        height: calc(40 * var(--rpx));
        padding: 0 calc(4 * var(--rpx));
        text-align: center;
    }

    .why-card {
        min-height: 0;
        padding: calc(24 * var(--rpx));
    }

    .contact-main {
        --contact-pad-top: calc(40 * var(--rpx));
        --contact-name-gap: calc(20 * var(--rpx));
        padding-bottom: calc(24 * var(--rpx));
        overflow: visible;
    }

    .contact-bg {
        width: 100%;
    }

    .page-contact .page-crumb {
        position: static;
        padding: calc(16 * var(--rpx)) 0 0;
    }

    .contact-row {
        flex-direction: column;
        gap: calc(24 * var(--rpx));
        padding: var(--contact-pad-top) 0 calc(40 * var(--rpx));
    }

    .contact-info {
        width: 100%;
        padding-bottom: calc(24 * var(--rpx));
    }

    .contact-form-panel {
        width: 100%;
    }

    .contact-title,
    .contact-name {
        line-height: 1.3;
    }

    .contact-figure {
        display: none;
    }

    .contact-follow {
        flex-wrap: wrap;
        gap: calc(12 * var(--rpx));
    }

    .contact-list li {
        align-items: flex-start;
    }

    .sol-hero {
        display: flex;
        flex-direction: column-reverse;
        width: 100%;
        max-width: none;
        min-height: 0;
        margin: 0;
    }

    .sol-hero-info {
        width: 100%;
        max-width: none;
        margin: 0;
        padding: calc(40 * var(--rpx)) var(--wrapper-margin) calc(32 * var(--rpx));
        box-sizing: border-box;
    }

    .sol-hero-info .icon {
        margin-bottom: calc(12 * var(--rpx));
    }

    .sol-hero-info h1,
    .sol-hero-info .lead {
        line-height: 1.35;
    }

    .sol-hero-figure {
        width: 100%;
        max-width: none;
        height: auto;
        min-height: 0;
        aspect-ratio: 780 / 425;
    }

    .sol-inner-nav {
        height: auto;
        top: var(--header-height);
        z-index: 20;
        overflow: hidden;
    }

    .sol-inner-nav-tabs {
        height: auto;
        width: 100%;
        max-width: none;
        margin: 0;
        gap: 0;
        padding-left: var(--wrapper-margin);
        padding-right: var(--wrapper-margin);
        box-sizing: border-box;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .sol-inner-nav-tabs::-webkit-scrollbar {
        display: none;
        height: 0;
    }

    .sol-inner-nav-tabs .swiper-wrapper {
        height: auto;
        gap: 1.75em;
    }

    .sol-inner-nav-tabs.swiper {
        overflow: hidden;
    }

    .sol-inner-nav-tabs.swiper .swiper-wrapper {
        gap: 0;
    }

    .sol-inner-nav-tabs a {
        flex-shrink: 0;
        width: auto;
        height: auto;
        padding: 0.9em 0;
        box-sizing: border-box;
    }

    .sol-inner-nav-tabs a.is-current::after {
        bottom: 0;
    }

    .prod-standard,
    .prod-notes,
    .tim-block,
    .tim-needs,
    .tim-formula,
    .tim-qa {
        padding: calc(32 * var(--rpx)) 0 calc(40 * var(--rpx));
    }

    .tim-needs {
        padding-bottom: calc(20 * var(--rpx));
    }

    .tim-formula {
        padding-top: calc(16 * var(--rpx));
    }

    .sol-intro,
    .sol-adv {
        width: 100%;
        max-width: none;
        margin-left: 0;
        margin-right: 0;
        padding: calc(32 * var(--rpx)) var(--wrapper-margin) calc(40 * var(--rpx));
        box-sizing: border-box;
    }

    .sol-apps {
        padding: 0;
    }

    .sol-apps h2 {
        width: 100%;
        max-width: none;
        margin: 0;
        padding: calc(32 * var(--rpx)) var(--wrapper-margin) 0;
        box-sizing: border-box;
    }

    .prod-series > h2 {
        width: 100%;
        padding: 0 var(--wrapper-margin);
        box-sizing: border-box;
    }

    .sol-app-list {
        display: flex;
        flex-direction: column;
        gap: calc(16 * var(--rpx));
    }

    .sol-app {
        padding: 0;
    }

    .sol-app-card {
        width: 100%;
        max-width: none;
        min-height: 0;
        flex-direction: column;
    }

    .prod-series-item {
        padding: 0;
    }

    .prod-series-item + .prod-series-item {
        margin-top: var(--wrapper-margin);
    }

    .prod-series-card {
        width: 100%;
        min-height: 0;
        flex-direction: column;
    }

    .prod-series-item:nth-child(even) .prod-series-card {
        flex-direction: column;
    }

    .sol-app .pic,
    .prod-series-card .pic {
        width: 100%;
        max-width: none;
        height: auto;
        aspect-ratio: 16 / 10;
        align-self: stretch;
    }

    .sol-app .pic img,
    .prod-series-card .pic img {
        position: absolute;
    }

    .sol-app .pic .caption {
        padding: calc(16 * var(--rpx)) var(--wrapper-margin) calc(12 * var(--rpx));
    }

    .sol-app-body {
        padding: calc(20 * var(--rpx)) var(--wrapper-margin);
        box-sizing: border-box;
    }

    .prod-series-card .body {
        padding: var(--wrapper-margin);
        box-sizing: border-box;
    }

    .sol-app-row {
        display: block;
        margin-top: calc(12 * var(--rpx));
    }

    .sol-app-spec {
        width: 100%;
        margin-top: calc(16 * var(--rpx));
        padding: 0;
        display: table;
        table-layout: fixed;
    }

    .sol-app-spec th {
        width: 58%;
        white-space: normal;
    }

    .sol-app-spec td {
        width: 42%;
    }

    .sol-adv-list {
        display: flex;
        flex-direction: column;
        gap: calc(12 * var(--rpx));
        margin-top: calc(24 * var(--rpx));
    }

    .sol-adv-list li {
        margin: 0;
        min-height: 0;
        padding: calc(24 * var(--rpx)) calc(20 * var(--rpx));
        box-sizing: border-box;
    }

    .prod-notes {
        display: block;
        width: var(--wrapper-width);
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
        box-sizing: border-box;
    }

    .prod-note + .prod-note {
        margin-top: calc(24 * var(--rpx));
    }

    .prod-spec-wrap,
    .tim-figure {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .tim-formula-row,
    .tim-formula-row:nth-child(even),
    .tim-formula-row.is-shadow {
        display: flex;
        flex-direction: column;
        gap: calc(20 * var(--rpx));
    }

    .tim-formula-row:nth-child(even) .pic {
        order: 0;
    }

    .tim-formula-row .pic,
    .tim-formula-row.is-shadow .pic {
        flex: none;
        max-width: 100%;
        width: 100%;
    }

    .tim-formula-row.is-shadow .info {
        margin: 0;
    }

    .site-header.is-open .lang-dropdown .dropdown-options {
        right: 0;
        left: auto;
        transform: none;
    }

    .search-page {
        padding-top: calc(var(--header-height) + 24 * var(--rpx));
    }

    .search-page-form {
        max-width: none;
    }

    .sec-error {
        padding: calc(48 * var(--rpx)) 0 calc(72 * var(--rpx));
    }

    .sec-error .error-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .sec-error .btn-home,
    .sec-error .btn-list {
        width: 100%;
    }

    html.low-gfx .about-card:hover,
    html.low-gfx .news-card:hover,
    html.low-gfx .news-item:hover,
    html.low-gfx .news-featured:hover,
    html.low-gfx .product-card:hover {
        transform: none;
        box-shadow: inherit;
    }
}

@keyframes zmt-fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}