@charset "utf-8";

:root {
    --zk-blue: #0058a8;
    --zk-blue-deep: #073b6f;
    --zk-yellow: #f5b700;
    --zk-green: #76b82a;
    --zk-graphite: #151b22;
    --zk-ink: #202832;
    --zk-muted: #64717f;
    --zk-line: #dce2e8;
    --zk-surface: #f4f6f8;
    --zk-white: #ffffff;
}

html {
    scroll-behavior: smooth;
}

body {
    color: var(--zk-ink);
    background: var(--zk-white);
    font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
    letter-spacing: 0;
    -webkit-font-smoothing: antialiased;
}

body,
button,
input,
textarea,
select {
    letter-spacing: 0;
}

img {
    max-width: 100%;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
    outline: 3px solid rgba(245, 183, 0, 0.8);
    outline-offset: 3px;
}

.con1400 {
    width: min(1400px, calc(100% - 64px));
}

/* Header */
.top {
    height: 88px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(10, 20, 31, 0.52);
    backdrop-filter: blur(12px);
    transition: background-color 0.25s ease, box-shadow 0.25s ease;
}

.top.fixednav {
    background: rgba(16, 24, 33, 0.97);
    box-shadow: 0 8px 24px rgba(5, 14, 23, 0.18);
}

.head,
.head_r,
.top_lang {
    height: 88px;
}

.logo {
    width: 226px;
    height: 88px;
}

.logo a {
    justify-content: flex-start;
}

.logo a img {
    max-width: 210px;
    max-height: 64px;
}

.head_r {
    width: auto;
    gap: 26px;
}

.nav > ul > li > a {
    padding: 0 14px;
    color: rgba(255, 255, 255, 0.92);
    font-size: 15px;
    line-height: 88px;
    transition: color 0.2s ease;
}

.nav > ul > li.active > a,
.nav > ul > li:hover > a {
    color: var(--zk-yellow);
}

.ernav {
    top: 88px;
    background: rgba(9, 35, 61, 0.97);
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.ernavitem {
    height: 310px;
}

.ernav_l h3 {
    font-size: 34px;
}

.ernav_l ul {
    margin-top: 32px;
}

.ernav_l ul li a {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 3px;
}

.top_lang {
    height: 88px;
}

.langitem {
    top: 88px;
    border-radius: 3px;
}

.searchform {
    height: 88px;
}

.searchform input,
.searchform button {
    height: 48px;
}

/* Hero */
.banner > .bannerswiper,
.bannerswiper .swiper-wrapper,
.bannerswiper .swiper-slide {
    height: min(720px, calc(100vh - 90px));
    min-height: 620px;
}

.bannerswiper {
    background: var(--zk-graphite);
}

.bannerswiper .swiper-slide {
    overflow: hidden;
}

.banner_img,
.bannerswiper video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.banner_scrim {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: rgba(5, 15, 26, 0.58);
}

.banner_desc {
    z-index: 2;
    align-items: stretch;
    text-align: left;
}

.banner_desc_inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding-top: 58px;
}

.hero_eyebrow,
.idx_eyebrow {
    color: var(--zk-yellow);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.6;
    text-transform: uppercase;
}

.banner_desc h1,
.banner_desc h2 {
    width: min(940px, 82%);
    margin-top: 18px;
    color: var(--zk-white);
    font-size: 48px;
    font-weight: 700;
    line-height: 1.22;
}

.banner_desc .hero_summary {
    width: min(700px, 72%);
    padding-top: 24px;
    color: rgba(255, 255, 255, 0.86);
    font-size: 18px;
    line-height: 1.9;
}

.hero_actions {
    display: flex;
    gap: 12px;
    margin-top: 32px;
}

.hero_btn {
    min-width: 132px;
    height: 46px;
    padding: 0 24px;
    border: 1px solid rgba(255, 255, 255, 0.58);
    border-radius: 3px;
    color: var(--zk-white);
    font-size: 15px;
    line-height: 44px;
    text-align: center;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.hero_btn_primary {
    border-color: var(--zk-blue);
    background: var(--zk-blue);
}

.hero_btn:hover {
    border-color: var(--zk-yellow);
    background: var(--zk-yellow);
    color: var(--zk-graphite);
}

.hero_capabilities {
    display: flex;
    width: min(780px, 78%);
    margin-top: 38px;
    border-top: 1px solid rgba(255, 255, 255, 0.24);
    border-bottom: 1px solid rgba(255, 255, 255, 0.24);
}

.hero_capabilities a {
    width: 33.333%;
    padding: 17px 18px 18px 0;
    color: var(--zk-white);
}

.hero_capabilities a + a {
    padding-left: 22px;
    border-left: 1px solid rgba(255, 255, 255, 0.24);
}

.hero_capabilities strong,
.hero_capabilities span {
    display: block;
}

.hero_capabilities strong {
    color: var(--zk-white);
    font-size: 16px;
}

.hero_capabilities span {
    margin-top: 5px;
    color: rgba(255, 255, 255, 0.68);
    font-size: 13px;
}

.banner_pag {
    bottom: 22px !important;
    z-index: 4;
}

.banner_pag .swiper-pagination-bullet {
    width: 32px;
    height: 3px;
}

/* Homepage sections */
.idx_item {
    padding-top: 84px;
}

.idx_titles {
    max-width: 820px;
    margin: 0 auto;
    padding-bottom: 48px;
    text-align: left;
}

.idx_titles h2,
.idx_titles h3,
.idx_ftitles h3 {
    margin-top: 7px;
    color: var(--zk-ink);
    font-size: 38px;
    font-weight: 700;
    line-height: 1.35;
}

.idx_titles_lead {
    margin-top: 14px;
    color: var(--zk-muted);
    font-size: 16px;
    line-height: 1.8;
}

.home_products {
    padding-bottom: 86px;
    background: var(--zk-surface);
}

.home_products .idx_titles {
    margin-left: 0;
}

.idx_pros ul {
    margin: 0 -10px;
}

.idx_pros ul li {
    height: 344px;
    padding: 10px;
}

.idx_pros ul li a {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--zk-line);
    border-radius: 4px;
    background: var(--zk-white);
    box-shadow: 0 8px 22px rgba(24, 37, 50, 0.05);
}

.idx_pros ul li a img {
    height: 270px;
    padding: 12px;
    object-fit: contain;
    background: #ffffff;
}

.idx_pros_desc {
    position: static;
    height: 74px;
    flex: 0 0 74px;
    padding: 14px 16px;
    border-top: 1px solid var(--zk-line);
    background: var(--zk-white);
    text-align: left;
    justify-content: flex-start;
}

.idx_pros_desc h3 {
    color: var(--zk-ink);
    font-size: 17px;
    line-height: 1.45;
}

.idx_pros ul li:hover a {
    border-color: rgba(0, 88, 168, 0.55);
    box-shadow: 0 14px 34px rgba(24, 37, 50, 0.11);
    transform: translateY(-3px);
}

.idx_pros ul li:hover a img {
    transform: none;
}

.idx_pros ul li:hover .idx_pros_desc {
    height: 74px;
    background: var(--zk-white);
}

.idxpros_more,
.idxnews_link {
    width: 190px;
    height: 48px;
    margin-top: 42px;
}

.idxpros_more a,
.idxnews_link a {
    width: 190px;
    height: 48px;
    border: 1px solid var(--zk-blue);
    border-radius: 3px;
    background: transparent;
    color: var(--zk-blue);
    line-height: 46px;
}

.idxpros_more a:hover,
.idxnews_link a:hover {
    background: var(--zk-blue);
    color: var(--zk-white);
}

.idx_about {
    padding-bottom: 88px;
    background-color: var(--zk-graphite);
    background-image: none;
}

.idx_about .idx_titles {
    margin-left: 0;
}

.idx_about .idx_titles h2,
.idx_about .idx_about_l h3 {
    color: var(--zk-white);
}

.idx_about_l p {
    margin: 26px 0 30px;
    color: rgba(255, 255, 255, 0.72);
    line-height: 1.9;
}

.idx_about_l a {
    width: 132px;
    height: 42px;
    border-color: rgba(255, 255, 255, 0.45);
    border-radius: 3px;
    color: var(--zk-white);
    line-height: 40px;
}

.idx_about_num {
    margin-top: 54px;
    padding-top: 30px;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.idx_about_num .numCount ul li .numCX,
.idx_about_num .numCount ul li .unitC {
    color: var(--zk-yellow);
}

.idx_about_num .numCount ul li .indc {
    color: rgba(255, 255, 255, 0.68);
}

.idx_about_r {
    padding-top: 0;
}

.idx_about_r img {
    aspect-ratio: 4 / 3;
    border-radius: 4px;
    object-fit: cover;
}

.idx_hzitem {
    padding-bottom: 86px;
}

.idx_hzitem .idx_titles,
.idx_news .idx_titles,
.idx_kehu .idx_titles {
    margin-left: 0;
}

.idxhz_swiper ul li a {
    height: 310px;
    border-radius: 4px;
    background: var(--zk-graphite);
}

.idxhz_swiper ul li a::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(10, 18, 26, 0.35);
}

.idxhz_title {
    z-index: 2;
    bottom: 0;
    padding: 24px;
    text-align: left;
}

.idxhz_title h3 {
    font-size: 18px;
    line-height: 1.55;
}

.idx_hezuo .swiper-button-next,
.idx_hezuo .swiper-button-prev {
    width: 42px;
    height: 42px;
    border-radius: 4px;
    background: var(--zk-white);
}

.idx_news {
    padding-bottom: 86px;
    background: var(--zk-surface);
}

.idxnews_item {
    overflow: hidden;
    border: 1px solid var(--zk-line);
    border-radius: 4px;
    background: var(--zk-white);
}

.idxnews_img {
    height: 220px;
}

.idxnews_desc {
    min-height: 300px;
    padding: 30px 26px;
}

.idxnews_desc h4 {
    color: var(--zk-blue);
}

.idxnews_desc h3 {
    margin: 14px 0;
    color: var(--zk-ink);
}

.idxnews_desc button {
    margin-top: 38px;
    color: var(--zk-blue);
}

.idxnews_link a {
    margin-top: 0;
}

.idx_kehu {
    padding-bottom: 100px;
}

.idxkehu_item {
    height: 220px;
}

.idxkh_simg {
    padding: 14px;
    border: 1px solid transparent;
}

.idxkh_simg:hover {
    border-color: var(--zk-line);
    border-radius: 4px;
}

.idx_footmess {
    padding: 76px 0;
    background: var(--zk-blue-deep);
}

.idx_ftitles h3 {
    color: var(--zk-white);
}

.idx_ftitles p {
    margin: 20px 0 42px;
    color: rgba(255, 255, 255, 0.66);
}

.idx_fform {
    gap: 10px;
}

.idx_fform input,
.idx_fform input.idx_fform3,
.idx_fform button {
    height: 52px;
    border-radius: 3px;
}

.idx_fform input {
    background: rgba(255, 255, 255, 0.06);
}

.idx_fform button {
    background: var(--zk-yellow);
    color: var(--zk-graphite);
    font-weight: 700;
}

/* Inner pages */
.neibanner {
    height: 330px;
    background: var(--zk-graphite);
}

.neibanner::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(8, 19, 31, 0.5);
}

.neibannerdesc {
    z-index: 2;
    padding: 88px 32px 0;
    text-align: center;
}

.neibannerdesc h1,
.neibannerdesc h2 {
    max-width: 1100px;
    color: var(--zk-white);
    font-size: 40px;
    font-weight: 700;
    line-height: 1.35;
}

.neinav {
    background: var(--zk-white);
    border-bottom-color: var(--zk-line);
}

.neinav_item ul li a {
    border-bottom-color: transparent;
}

.neinav_item ul li.active a,
.neinav_item ul li:hover a {
    border-color: var(--zk-yellow);
    color: var(--zk-blue);
}

.prolistpage,
.newslistp,
.caselist_page,
.resppage,
.contact_bot,
.newsdetail {
    color: var(--zk-ink);
}

.prolist_item_text,
.caselist_lidesc,
.newslistp_botdes {
    background: var(--zk-white);
}

.prolist_list ul li a,
.caselist_item ul li a,
.newslistp_bot ul li a {
    display: block;
    overflow: hidden;
    border: 1px solid var(--zk-line);
    border-radius: 4px;
    background: var(--zk-white);
}

.prolist_item_img img,
.caselist_liimg img,
.newslistp_botimg img,
.newsde_rimg img {
    object-fit: cover;
}

.procontent_1,
.newsdetail,
.contact_bot {
    background: var(--zk-white);
}

.procont_ltop h1,
.procont_ltop h2,
.newsde_l > h1,
.newsde_l > h2 {
    color: var(--zk-ink);
}

.procontent_zx a,
.caselist_lidesc button,
.contact_br button {
    border-radius: 3px;
    background: var(--zk-blue);
}

.prodecon_item,
.contact_br input,
.contact_br textarea {
    border-color: var(--zk-line);
}

.foot,
.footcopy {
    background: var(--zk-graphite) !important;
}

.foot {
    padding: 68px 0 76px;
}

.foottop {
    border-bottom-color: rgba(255, 255, 255, 0.14);
}

.footmid_l dl dd a,
.footmid_rdesc p,
.footc_l span,
.footc_l span a,
.footc_r p {
    color: rgba(255, 255, 255, 0.62);
}

.xuanfu ul li {
    border-radius: 4px;
    background: var(--zk-blue);
}

@media (max-width: 1199px) {
    .con1400 {
        width: min(calc(100% - 48px), 1120px);
    }

    .head_r {
        gap: 12px;
    }

    .nav > ul > li > a {
        padding: 0 8px;
        font-size: 14px;
    }

    .banner_desc h1,
    .banner_desc h2 {
        font-size: 44px;
    }

    .idx_about_r {
        padding-top: 60px;
    }
}

@media (max-width: 767px) {
    .con1400 {
        width: calc(100% - 32px);
    }

    .waptop_item {
        height: 58px;
        background: rgba(13, 26, 40, 0.97);
        border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    }

    .waptop_l a,
    .waptop_item .waptopitem {
        height: 58px;
    }

    .waptop_l {
        width: 46%;
    }

    .waptop_l img {
        max-height: 42px;
    }

    .waptop_lang p {
        font-size: 14px;
    }

    .banner > .bannerswiper,
    .bannerswiper .swiper-wrapper,
    .bannerswiper .swiper-slide {
        height: 610px;
        min-height: 610px;
    }

    .banner_img,
    .bannerswiper video {
        object-position: 58% center;
    }

    .banner_scrim {
        background: rgba(5, 15, 26, 0.68);
    }

    .banner_desc_inner {
        padding-top: 46px;
        justify-content: center;
    }

    .hero_eyebrow {
        max-width: 96%;
        font-size: 11px;
    }

    .banner_desc h1,
    .banner_desc h2 {
        width: 100%;
        margin-top: 14px;
        font-size: 34px;
        line-height: 1.28;
    }

    .banner_desc .hero_summary {
        width: 100%;
        padding-top: 18px;
        font-size: 15px;
        line-height: 1.75;
    }

    .hero_actions {
        margin-top: 24px;
    }

    .hero_btn {
        min-width: 116px;
        height: 42px;
        padding: 0 18px;
        line-height: 40px;
    }

    .hero_capabilities {
        width: 100%;
        margin-top: 28px;
    }

    .hero_capabilities a {
        padding: 14px 8px 14px 0;
    }

    .hero_capabilities a + a {
        padding-left: 10px;
    }

    .hero_capabilities strong {
        font-size: 13px;
    }

    .hero_capabilities span {
        font-size: 11px;
        line-height: 1.45;
    }

    .banner_pag {
        bottom: 14px !important;
    }

    .idx_item {
        padding-top: 58px;
    }

    .idx_titles {
        padding-bottom: 32px;
    }

    .idx_titles h2,
    .idx_titles h3,
    .idx_ftitles h3 {
        font-size: 28px;
    }

    .idx_titles_lead {
        font-size: 14px;
    }

    .home_products,
    .idx_about,
    .idx_hzitem,
    .idx_news {
        padding-bottom: 58px;
    }

    .idx_pros ul {
        margin: 0;
    }

    .idx_pros ul li {
        height: 336px;
        padding: 8px 0;
    }

    .idx_pros ul li a img {
        height: 264px;
    }

    .idx_about_r {
        padding-top: 28px;
    }

    .idx_about_num {
        margin-top: 40px;
    }

    .idxnews_desc {
        min-height: auto;
    }

    .idxkehu_item {
        height: 200px;
    }

    .idx_footmess {
        padding: 54px 0;
    }

    .idx_fform {
        gap: 0;
    }

    .idx_fform input,
    .idx_fform input.idx_fform3,
    .idx_fform button {
        margin-bottom: 12px;
    }

    .neibanner {
        height: 230px;
    }

    .neibannerdesc {
        padding: 58px 18px 0;
    }

    .neibannerdesc h1,
    .neibannerdesc h2 {
        font-size: 28px;
    }

    .foot {
        padding: 46px 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}