/* =========================================
   main.css
   Modules (TOC):
   1) Fonts & Base
   2) Layout Utilities (grid, center, marginAuto)
   3) Header (PC nav, dropdown, scroll behavior)
   4) Effects & Animations (scroll-down).adv-card p
   5) Tabs (p-tabs, home-tabs overrides)
   6) Common Components (cards, tables, breadcrumb)
   7) Pages:
      - Home (hero, products, packaging, reliability, about)
      - About (overview)
      - News
      - Products
      - Certificates
      - Services (support, diagram, kinds)
      - Reliability (sic, military)
      - Contact (footer, contact, map)
   8) Media Queries
   ========================================= */

.pc-box {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    z-index: 1000;
}

/* 字体引入 */
@font-face {
    font-family: 'D-DIN';
    src: url('../fonts/D-DIN.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'D-DIN';
    src: url('../fonts/D-DIN-Italic.otf') format('opentype');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'D-DIN';
    src: url('../fonts/D-DIN-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'D-DIN Condensed';
    src: url('../fonts/D-DINCondensed.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'D-DIN Condensed';
    src: url('../fonts/D-DINCondensed-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'D-DIN Exp';
    src: url('../fonts/D-DINExp.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'D-DIN Exp';
    src: url('../fonts/D-DINExp-Italic.otf') format('opentype');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'D-DIN Exp';
    src: url('../fonts/D-DINExp-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PingFang SC';
    src: url('../fonts/PingFangSC.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* 1) Fonts & Base */
body {
    font-family: 'PingFang SC', 'Microsoft YaHei', 'D-DIN', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
}

/* Force unified font stack across the app */
#app,
#app * {
    font-family: 'PingFang SC', 'Microsoft YaHei', 'D-DIN', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif !important;
}

/* 默认隐藏移动头部，防止影响 PC；在 mobile.css 中再按需显示 */
.mobile-box { display: none; }

/* 全局布局：使页脚贴底 */
html,
body {
    height: 100%;
}

#app {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.footer {
    margin-top: auto;
}

/* 顶部导航（PC） */
.pc-box .marginAuto {
    height: 76px;
    display: flex;
    align-items: center;
}

.pc-box .logo img {
    height: 34px;
}

.pc-box .nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.pc-box .nav li {
    margin-left: 36px;
    position: relative;
}

.pc-box .nav a {
    color: #ffffff;
    font-size: 15px;
    padding: 10px 2px 15px;
    display: inline-block;
    position: relative;
    letter-spacing: .04em;
    transition: color .2s;
}

.pc-box .nav a:after {
    content: "";
    position: absolute;
    left: 50%;
    width: 24px;
    margin-left: -12px;
    bottom: 0;
    height: 2px;
    background: transparent;
    transition: all .2s;
    border-radius: 2px;
}

.pc-box .nav a:hover {
    color: #3D91FF;
}

.pc-box .nav a:hover:after,
.pc-box .nav .active>a:after {
    background: #3D91FF;
}

.pc-box .nav li.active a {
    color: #3D91FF;
}

.pc-box {
    background: transparent;
    transition: background .2s, box-shadow .2s;
}

.pc-box.scrollClass {
    background: #ffffff;
    box-shadow: 0 6px 24px rgba(0, 0, 0, .06);
}

.pc-box.scrollClass .nav a {
    color: #1b2a41;
}

.pc-box.scrollClass .nav a:hover {
    color: #203786;
}

.pc-box.scrollClass .nav a:hover:after,
.pc-box.scrollClass .nav li.active>a:after {
    background: #203786;
}

.pc-box.scrollClass .nav>li.active a {
    color: #203786;
}

.pc-box.scrollClass .logo img {
    filter: none;
}

/* Dropdown (multi-level) */
.pc-box .nav li .sub {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    min-width: 200px;
    text-align: center;
    padding: 8px 0;
    z-index: 1001;
    background: transparent;
    border: none;
    box-shadow: none;
}

.pc-box .nav li:hover>.sub {
    display: block;
}

.pc-box .nav li .sub a {
    display: block;
    padding: 10px 16px;
    color: rgba(255, 255, 255, .85);
    font-size: 14px;
    white-space: nowrap;
    text-decoration: none;
}

.pc-box .nav li .sub a:hover {
    color: #ffffff;
}

/* Scrolled header: solid dropdown */
.pc-box.scrollClass .nav li .sub {
    background: #ffffff;
    border: 1px solid #e9eef6;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .12);
}

.pc-box.scrollClass .nav li .sub a {
    color: #1b2a41;
    text-decoration: none;
}

.pc-box.scrollClass .nav li .sub a:hover {
    background: #f5f8ff;
    color: #203786;
}

/* Scroll-down flicker + float animation */
@keyframes flickerFloat {
    0% {
        opacity: .35;
        transform: translateY(0);
    }

    50% {
        opacity: 1;
        transform: translateY(6px);
    }

    100% {
        opacity: .35;
        transform: translateY(0);
    }
}

.scroll-down {
    cursor: pointer;
}

.scroll-down img {
    animation: flickerFloat 1.6s ease-in-out infinite;
    opacity: 1;
}

/* hover scale for scroll-down */
.scroll-down img {
    transition: transform .2s ease;
}

.scroll-down:hover img {
    transform: scale(1.1);
}

@media only screen and (max-width: 2600px) and (min-width:1024px) {
    .pc-box {
        display: block;
    }
}

/* 通用布局样式 */
.grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

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

.marginAuto {
    width: 1440px;
    margin: 0 auto;
}

.center {
    text-align: center;
}

@media only screen and (max-width: 1024px) and (min-width:0px) {
    .marginAuto {
        width: auto;
        padding: 0 16px;
    }

    .grid-2,
    .grid-3 {
        grid-template-columns: 1fr;
    }
}

/* 通用内页 */
.p-banner {
    height: 642px;
    background-position: center;
    background-size: cover;
    display: flex;
    align-items: center;
    color: #fff;
}

.p-banner .p-title {
    font-size: 40px;
    font-weight: 400;
    font-family: 'Arial';
}

.p-banner .p-desc {
    font-size: 48px;
    font-weight: 900;
    margin-bottom: 10px;
    font-family: 'D-DIN', 'D-DIN Exp', 'D-DIN Condensed', sans-serif;
    color: #fff;
}

.p-tabs {
    background: #fff;
}

.p-tabs ul {
    list-style: none;
    margin: 0;
    padding: 0;
    border-bottom: 1px solid #ccc;
}

.p-tabs li {
    padding: 18px 26px;
    color: #666;
    height: 127px;
}

.p-tabs li.active {
    border-bottom: 2px solid #1b3a8a;
}

.p-tabs li.active a {
    color: #1b3a8a;
}


/* 面包屑 */
.breadcrumb {
    font-size: 14px;
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 57px;
}

.breadcrumb a {
    color: #8FA2B2;
    text-decoration: none;
}

.breadcrumb a:hover {
    color: #748297;
}

.breadcrumb .sep {
    color: #9aa6b2;
}

.breadcrumb .current {
    color: #12181D;
    font-weight: 600;
}

/* 规格表 */

.spec-title {
    font-size: 20px;
    margin: 6px 0 14px;
    color: #041C2C;
}

.table-scroll {
    overflow: auto;
    border-radius: 8px;
}

.spec-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    min-width: 960px;
    font-size: 14px;
}

.spec-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #082B63;
    color: #fff;
    font-weight: 500;
    text-align: left;
    padding: 17px 16px;
    font-size: 12px;
}

.spec-table thead th:first-child {
    border-top-left-radius: 8px;
    text-align: center;
}

.spec-table thead th:last-child {
    border-top-right-radius: 8px;
}

.spec-table tbody td {
    background: #fff;
    padding: 17px 16px;
    border-top: 1px solid #e6ecf6;
    color: #1b2a41;
}

.spec-table tbody td:first-child {
    text-align: center;
    color: #6b7380;
}

.spec-table tbody tr:nth-child(even) td {
    background: #fbfdff;
}

.spec-table tbody tr:hover td {
    background: #f5f8ff;
}

/* 关于我们 - 新闻列表 */
.news-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 22px;
}

.news-item {
    display: flex;
    border-radius: 6px;
    overflow: hidden;
}

.news-item img {
    width: 240px;
    height: 150px;
    object-fit: cover;
    display: block;
}

.news-item .txt {
    padding: 12px 10px;
}

.news-item h3 {
    font-size: 18px;
    margin: 4px 0 10px;
}
.news-item h3 a{
    color: #041C2C;
    text-decoration: none;
}

/* 证书宫格 */
.grid-3 img {
    width: 100%;
    display: block;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .05);
    border-radius: 6px;
}

/* 产品中心 */
.product-card {
    display: flex;
    position: relative;
    align-items: center;
    gap: 12px;
    background: #fff;
    padding: 12px 48px 12px 24px;
    border-radius: 8px;
    text-decoration: none;
    color: #203786;
    border: 1px solid #f1f1f1;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .06);
}

.product-card img {
    width: 187px;
    height: 187px;
    object-fit: contain;
    margin-right: 24px
}

.product-card span {
    font-size: 26px;
    font-family: 'PingFang SC';
}

.product-card .arrow {
    width: 24px;
    height: 24px;
    object-fit: contain;
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
}

/* 服务与能力卡片 */
.card {
    background: #fff;
    padding: 22px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .06);
}

/* 页脚基础 */
.footer {
    background: #2f3742;
    color: #fff;
    padding: 40px 0;
}

.footer .foot-cols {
    gap: 40px;
    padding-right: 40px;
}

.footer a {
    color: #fff;
    text-decoration: none;
}

.footer .copyright {
    text-align: center;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.37);
    margin-top: 44px;
    padding-top: 44px;
    border-top: 1px solid #cccccc;
}

.footer .logo {
    width: 277px;
}

.footer .logo img {
    width: 100%;
}

.footer .company-name {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 8px;
}

.footer .company-en {
    font-size: 12px;
    color: #c9d1da;
    margin-bottom: 8px;
}

.footer .aux-info {
    font-size: 14px;
    font-family: Inter, Inter-400;
    text-align: center;
    width: 277px;
    font-weight: 400;
    color: #fff;
    margin-top: 20px
}

.footer .aux-info span {
    color: rgba(255, 255, 255, 0.5);
}

.footer .tit {
    font-size: 16px;
    line-height: 16px;
    font-family: 'D-DIN', 'D-DIN Exp', 'D-DIN Condensed', sans-serif;
    font-weight: 600;
    margin-bottom: 45px;
    color: #fff;
}

.footer ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer ul li {
    margin-bottom: 10px
}

.footer ul li a {
    color: #999999;
    font-size: 14px;
    line-height: 16px;
    font-family: 'D-DIN', 'D-DIN Exp', 'D-DIN Condensed', sans-serif;
}

.footer ul li a:hover {
    color: #fff;
}

@media only screen and (max-width: 1024px) and (min-width:0px) {


    .pc-box {
        display: none;
    }
}

/* 关于我们 */
/* Banner text */
.p-banner .sw-text {
    color: #fff;
    text-align: left;
    max-width: 900px;
}

.p-banner .sw-text .kicker {
    font-size: 16px;
    letter-spacing: .1em;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    opacity: .9;
}

.p-banner .sw-text .title {
    font-size: 40px;
    font-weight: 400;
    color: #ffffff;
    line-height: 72px;
}

.p-banner .sw-text .desc {
    font-size: 28px;
    font-weight: 400;
    text-align: left;
    color: #ffffff;
    line-height: 40px;
    opacity: .9;
}

.p-banner .scroll-down {
    display: inline-block;
    margin-top: 18px;
}

.p-banner .scroll-down img {
    width: 22px;
    height: 22px;
    opacity: .85;
}

@media only screen and (max-width: 1024px) and (min-width:0px) {
    .p-banner {
        height: 280px;
    }

    .p-banner .sw-text .title {
        font-size: 28px;
        line-height: 42px;
    }

    .p-banner .sw-text .desc {
        font-size: 16px;
        line-height: 24px;
    }
}

/* 关于我们tabs */
.about-tabs {
    background: transparent;
}

.home-tabs ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
}

.home-tabs ul li {
    flex: 1;
    position: relative;
    color: #666;
    padding: 0 !important;
}

.home-tabs ul li a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: inherit;
    text-decoration: none;
    font-size: 18px;
    font-weight: 400;
    height: 127px;
}

.home-tabs ul li+li:before {
    content: "";
    position: absolute;
    left: -1px;
    top: 50%;
    width: 1px;
    height: 18px;
    background: #e6ecf6;
    transform: translateY(-50%);
}

.home-tabs ul li img {
    width: 18px;
    height: 18px;
    display: block;
}

.home-tabs ul li:hover {
    color: #1b3a8a;
}

/* About Overview layout */
.about-ov-wrap {
    background: url('../images/Frame 55.png') center/cover no-repeat;
    padding-top: 0;
    padding-bottom: 0;
}

.about-overview {
    padding: 80px 0 100px;
}

.about-overview .ov-head {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 100px;
    align-items: start;
    margin-bottom: 24px;
}

.about-overview .ov-title {
    font-size: 48px;
    font-weight: 800;
    color: #041C2C;
    font-family: 'PingFang SC';
}

.about-overview .ov-sub {
    font-size: 24px;
    color: #041C2C;
    margin-top: 6px;
    text-transform: uppercase;
    font-family: 'PingFang SC';
}

.about-overview .ov-text {
    color: #041C2C;
    line-height: 1.9;
    font-family: 'PingFang SC';
}

.about-overview .ov-body {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 30px;
    align-items: start;
    justify-content: space-between;
}

.about-overview .ov-stats {
    display: flex;
    flex-direction: column;
    gap: 70px;
    padding-top: 60px;
}

.about-overview .stat {}

.about-overview .stat .num {
    font-size: 64px;
    line-height: 64px;
    color: #203786;
    font-family: 'D-DIN', 'D-DIN Exp', 'D-DIN Condensed', sans-serif;
    font-weight: 900;
}

.about-overview .stat .label {
    margin-top: 24px;
    color: #203786;
    font-size: 14px;
    font-family: 'PingFang SC';
}

.about-overview .ov-image {
    text-align: right;
}

.about-overview .ov-image img {
    width: 1131px;
    display: block;
    margin-left: auto;
}

@media only screen and (max-width: 1024px) and (min-width:0px) {
    .about-overview .ov-head {
        grid-template-columns: 1fr;
    }

    .about-overview .ov-body {
        grid-template-columns: 1fr;
    }

    .about-overview .ov-stats {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 20px 30px;
    }

    .about-overview .stat {
        border-left: none;
        border-top: 2px solid #e6ecf6;
        padding: 12px 0 0;
    }
}

/* 公司新闻 */

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

.news-item {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 24px;
    align-items: start;
}

.news-item:last-child {
    border-bottom: none;
}

.news-item img {
    width: 320px;
    height: 240px;
    object-fit: cover;
    border-radius: 8px;
    display: block;
}

.news-item .txt h3 {
    font-size: 32px;
    font-family: PingFang SC;
    font-weight: 500;
    margin-bottom: 12px;
}

.news-item .txt p.meta {
    font-size: 16px;
    color: #666666;
    margin: 0 0 16px;
}

.news-item .txt p.excerpt {
    font-size: 16px;
    color: #666666;
    line-height: 26px;
    margin: 0;
}

@media only screen and (max-width: 1024px) and (min-width:0px) {
    .news-head {
        grid-template-columns: 1fr;
    }

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

    .news-item img {
        width: 100%;
        height: 200px;
    }
}

/* 产品中心 */
.products-wrap {
    padding: 80px 0;
}

.product-card {
    transition: transform .22s ease, box-shadow .22s ease;
}

.product-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 26px rgba(0, 0, 0, .12);
}

.product-card>img:first-child {
    transition: transform .35s ease;
}

.product-card:hover>img:first-child {
    transform: scale(1.04);
}

.product-card .arrow {
    transition: transform .2s ease;
}

.product-card:hover .arrow {
    transform: translateX(4px);
}

/* 资质证书 */
.cert-wrap {
    padding: 80px 0 309px;
}

.cert-head {
    text-align: center;
    margin-bottom: 28px;
}

.cert-head .title {
    font-size: 48px;
    font-family: PingFang SC;
    line-height: 58px;
    color: #041C2C;
    font-weight: 400;
}

.cert-head .sub {
    font-size: 24px;
    color: #041C2C;
    font-family: 'PingFang SC';
    line-height: 58px;
}

.cert-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 28px;
}

.cert-card {
    background: rgba(255, 255, 255, .85);
    border-radius: 10px;
    padding: 18px;
    box-shadow: 0 8px 24px rgba(20, 33, 61, .06);
    display: flex;
    align-items: center;
    justify-content: center;
}

.cert-card img {
    width: 100%;
    height: 280px;
    object-fit: contain;
    display: block;
}

@media only screen and (max-width: 1024px) and (min-width:0px) {
    .cert-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .cert-card img {
        height: 220px;
    }
}

/* 封测技术服务 - 支持模块 */
.support-wrap {
    padding: 60px 0 80px;
}

.support-head {
    text-align: center;
    margin-bottom: 28px;
}

.support-head .title {
    font-size: 48px;
    font-family: PingFang SC;
    line-height: 58px;
    color: #041C2C;
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: center;
}

.support-head .title img {
    width: 40px;
    height: 40px;
    object-fit: contain;
    display: block;
    margin-right: 12px;
}

.support-head .title span {
    font-size: 48px;
    color: #041C2C;
    font-family: 'PingFang SC';
    font-weight: 600;
    line-height: 58px;
}

.support-head .title img:last-child {
    margin-left: 12px;
}

.support-head .sub {
    font-size: 24px;
    color: #041C2C;
    font-family: 'PingFang SC';
    line-height: 58px;
}

.support-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
}

.support-card {
    display: grid;
    grid-template-columns: 162px 1fr;
    gap: 24px;
    align-items: center;
    background: linear-gradient(180deg, #f5f9fe 0%, rgba(231, 240, 255, 0.00) 100%);
    border-radius: 12px;
    padding: 32px;
}

.support-card .icon {
    width: 162px;
    height: 162px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.support-card .icon img {
    width: 162px;
    height: 162px;
    object-fit: contain;
    display: block;
}

.support-card .txt h3 {
    font-size: 32px;
    color: #041C2C;
    margin: 0 0 8px;
    font-family: 'PingFang SC';
    font-weight: 500;
    margin-bottom: 8px;
}

.support-card .txt p {
    margin: 0;
    color: #333333;
    line-height: 26px;
    font-family: 'PingFang SC';
    font-size: 16px;
}

@media only screen and (min-width: 1025px) {
    .support-grid {
        grid-template-columns: 1fr 1fr;
    }
}

/* 支持示意图 */
.support-diagram-wrap {
    background: url('../images/Group 162.png') center/cover no-repeat;
    padding: 80px 0 220px;
}

.support-diagram {
    position: relative;
    height: 560px;
    margin-top: 40px;
}

.support-diagram .center-graphic {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 1341px;
    height: auto;
    display: block;
}

.support-diagram .sd-item {
    position: absolute;
    width: 300px;
    color: #041C2C;
}

.support-diagram .sd-item h4 {
    margin: 0 0 8px;
    font-size: 32px;
    font-weight: 500;
    font-family: 'PingFang SC';
    color: #1D2129;
}

.support-diagram .sd-item p {
    margin: 0;
    line-height: 24px;
    font-family: 'PingFang SC';
    color: #333333;
    font-size: 16px
}

.support-diagram .sd-item.tl {
    left: 210px;
    top: -48px;
    text-align: center;
}

.support-diagram .sd-item.tr {
    right: 160px;
    top: -40px;
    text-align: center;
}

.support-diagram .sd-item.bl {
    left: 20px;
    bottom: -40px;
    text-align: center;
}

.support-diagram .sd-item.br {
    right: 10px;
    bottom: -40px;
    text-align: center;
}

.support-diagram .sd-item.bc {
    left: 50%;
    transform: translateX(-50%);
    bottom: -125px;
    text-align: center;
    width: 420px;
}

/* 封装品种 - 宫格 */
.kinds-wrap {
    padding: 100px 0 100px;
    background: url('../images/Group 238.png') center/cover no-repeat;
}

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

.kind-card {
    background: #ffffff;
    padding: 36px 24px;
    border-radius: 16px;
    box-shadow: 0px 12px 40px 0px rgba(57, 74, 107, 0.05);
    text-align: center;
}

.kind-card .pic {
    width: 160px;
    height: 160px;
    margin: 0 auto 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.kind-card .pic img {
    object-fit: contain;
    display: block;
}

.kind-card .name {
    font-size: 22px;
    color: #333333;
    font-family: 'PingFang SC';
    text-align: center;
}

@media only screen and (max-width: 1024px) and (min-width:0px) {
    .kinds-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* 可靠性 - SiC认证 内容块 */
.sic-wrap {
    padding: 80px 0 80px;
    position: relative;
}

.sic-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: start;
}

.sic-img img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 12px;
    box-shadow: 0 12px 40px rgba(57, 74, 107, 0.10);
}

.sic-list h3 {
    font-size: 20px;
    color: #333333;
    margin: 0 0 16px;
    font-family: 'PingFang SC';
}

.sic-list ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.sic-list li {
    position: relative;
    padding-left: 20px;
    color: #1D2129;
    line-height: 32px;
    font-size: 16px;
    font-family: 'PingFang SC';
    margin-bottom: 20px;
}

.sic-list li .dot {
    width: 14px;
    height: 14px;
    vertical-align: middle;
    display: inline-block;
}

.sic-bg-lt {
    position: absolute;
    left: 0;
    top: 0;
    width: 418px;
    height: 416px;
}

.sic-bg-rb {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 302px;
    height: 313px;
}

@media only screen and (max-width: 1024px) and (min-width:0px) {
    .sic-grid {
        grid-template-columns: 1fr;
    }
}

/* 可靠性 - 顶部引言与按钮 */
.sic-intro {
    text-align: center;
    padding: 30px 0 10px;
}

.sic-intro p {
    max-width: 880px;
    margin: 0 auto 18px;
    color: #333333;
    line-height: 32px;
    font-family: 'PingFang SC';
    font-size: 16px;
}

.btn-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 22px;
    background: #203786;
    color: #fff;
    border-radius: 26px;
    text-decoration: none;
    box-shadow: 0 8px 20px rgba(32, 55, 134, .18);
}

.btn-cta:hover {
    background: #1b3a8a;
}

.btn-cta img {
    width: 24px;
    height: 24px;
    object-fit: contain;
    display: inline-block;
    margin-left: 12px;
}

/* 可靠性-军工认证 三项围绕示意图 */
.military-wrap {
    padding: 80px 0 160px;
}

.rel-diagram {
    position: relative;
    max-width: 1400px;
    margin: 60px auto 0;
}

.rel-diagram .center-bg {
    width: 1296px;
    height: 626px;
    background: url('../images/Group 249.png') center/contain no-repeat;
    margin: 0 auto;
}

.rel-diagram .rd-item {
    position: absolute;
    width: 164px;
    color: #041C2C;
    text-align: center;
}

.rel-diagram .rd-item h4 {
    margin: 0 0 8px;
    font-size: 20px;
    font-weight: 600;
    color: #000000;
    font-family: 'PingFang SC';
}

.rel-diagram .rd-item p {
    margin: 0;
    line-height: 26px;
    color: #666;
    font-size: 16px;
    font-family: 'PingFang SC';
}

/* positions */
.rel-diagram .rd-left {
    left: 140px;
    top: 240px;
}

.rel-diagram .rd-left h4,
.rel-diagram .rd-left p {
    text-align: left;
}

.rel-diagram .rd-right {
    right: 140px;
    top: 240px;
    text-align: center;
}

.rel-diagram .rd-bottom {
    left: 50%;
    transform: translateX(-50%);
    bottom: -50px;
    text-align: center;
}

@media only screen and (max-width: 1024px) and (min-width:0px) {
    .rel-diagram {
        padding: 20px 0 0;
    }

    .rel-diagram .center-bg {
        height: 300px;
    }

    .rel-diagram .rd-item {
        position: static;
        width: auto;
        text-align: center;
        margin: 12px 0;
    }
}

.rel-diagram .rd-item-top {
    position: absolute;
    top: 40px;
    left: 50%;
    transform: translateX(-50%);
    width: 935px;
    text-align: center;
}

.rel-diagram .rd-item-top p {
    color: #000000;
    line-height: 32px;
    font-family: 'PingFang SC';
    font-size: 16px;
}

/* 服务优势 cards */
.adv-wrap {
    padding: 20px 0 0;
}

.adv-head {
    text-align: center;
    margin: 80px 0 40px;
}

.adv-head .title {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 28px;
    color: #041C2C;
}

.adv-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
    max-width: 1440px;
    margin: 0 auto;
}

.adv-card {
    border-radius: 12px;
    background: linear-gradient(180deg, #f5f9fe 0%, rgba(231, 240, 255, 0.00) 100%);
    padding: 22px 22px 26px;
    display: flex;
    align-items: center;
}

.adv-card .icon {
    width: 162px;
    height: 162px;
    margin-right: 32px;
}

.adv-card .txt {
    flex: 1;
}

.adv-card h4 {
    margin: 0 0 10px;
    font-size: 32px;
    line-height: 40px;
    color: #1D2129;
    font-weight: 600;
    font-family: 'PingFang SC';
}

.adv-card p {
    margin: 0;
    color: #333333;
    line-height: 28px;
    font-size: 16px;
    font-family: 'PingFang SC';
}

@media only screen and (max-width: 1024px) and (min-width:0px) {
    .adv-grid {
        grid-template-columns: 1fr;
    }
}

/* 咨询页 中心示意图左右清单 */
.diag-section {
    display: grid;
    grid-template-columns: 260px 1fr 260px;
    align-items: center;
    gap: 20px;
    max-width: 1400px;
    margin: 0 auto;
}

.diag-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.diag-list li {
    display: flex;
    align-items: center;
    gap: 15px;
    color: #1D2129;
    font-size: 16px;
    font-family: 'PingFang SC';
}

.diag-section .rel-diagram {
    margin: 0 auto;
}

.diag-list li img {
    width: 65px;
    height: 65px;
}

@media only screen and (max-width: 1024px) and (min-width:0px) {
    .diag-section {
        grid-template-columns: 1fr;
    }

    .diag-list li img {
        width: 26px;
        height: 26px;
    }
}

/* 联系我们底部 */
.contact-wrap {
    background: url('../images/Group 245.png') center/cover no-repeat;
    padding: 80px 0 120px;
    position: relative;
}

.contact-inner {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 40px;
    align-items: center;
    max-width: 1440px;
    margin: 0 auto;
}

.contact-title {
    font-size: 40px;
    line-height: 48px;
    color: #041C2C;
    text-align: left;
    margin: 0 0 30px;
    font-family: 'PingFang SC';
}

.contact-list {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.contact-card {
    background: #fff;
    cursor: pointer;
    border-radius: 12px;
    box-shadow: 0px 12px 40px 0px rgba(57, 74, 107, 0.05), 0px 12px 40px 0px rgba(57, 74, 107, 0.05);
    padding: 24px;
    display: flex;
    align-items: center;
    gap: 12px;
    width: 678px;
}

.contact-card img.icon {
    width: 28px;
    height: 28px;
}

.contact-card .label {
    color: #154985;
    font-size: 16px;
    line-height: 22px;
    font-family: 'PingFang SC';
}

.contact-card .value {
    color: #333333;
    font-size: 18px;
    line-height: 28px;
    font-family: 'PingFang SC';
}

.qr-box {
    text-align: center;
    
    cursor: pointer;
    
}
.qr-box img {
    width: 260px;
    height: 260px;
}
.qr-box .tip {
    margin-bottom: 12px;
    color: #1D2129;
    font-size: 16px;
    line-height: 22px;
    font-family: 'PingFang SC';
}

@media only screen and (max-width: 1024px) and (min-width:0px) {
    .contact-inner {
        grid-template-columns: 1fr;
    }

    .contact-card {
        width: auto;
    }
}

/* 联系我们 - 地图 */
.contact-map {
    padding: 0 0;
}

.contact-map .map-inner {
    width: 100%;
    margin: 0 auto;
}

.map-embed {
    height: 420px;
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 12px 40px rgba(57, 74, 107, 0.08);
}

.map-embed iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.map-embed .map-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.map-embed .pin {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -100%);
    width: 46px;
    height: auto;
    pointer-events: none;
}

.map-embed .pin-label {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(8px, -120%);
    background: #fff;
    color: #1D2129;
    font-size: 14px;
    padding: 6px 10px;
    border-radius: 6px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, .08);
    white-space: nowrap;
}

@media only screen and (max-width: 1024px) and (min-width:0px) {
    .contact-map .map-inner {
        width: auto;
        padding: 0 16px;
    }
}

/* 首页 */
/* Hero section */
.home-hero .sw-text {
    color: #fff;
    text-align: left;
    max-width: 900px;
}

.home-hero .sw-text .kicker {
    font-size: 16px;
    letter-spacing: .1em;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    opacity: .9;
}

.home-hero .sw-text .kicker .dot {
    width: 10px;
    height: 10px;
    border: 2px solid #2ac3ff;
    border-radius: 50%;
    display: inline-block;
    margin-right: 10px;
}

.home-hero .sw-text .title {
    font-size: 40px;
    font-weight: 400;
    color: #ffffff;
    line-height: 72px;
    font-family: 'PingFang SC';
}

.home-hero .sw-text .desc {
    font-size: 28px;
    font-weight: 400;
    text-align: left;
    color: #ffffff;
    line-height: 28px;
    letter-spacing: 0.2px;
    font-family: 'PingFang SC';
}

.home-hero .sw-text .link {
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .6);
    padding: 10px 22px;
    border-radius: 2px;
}

.home-hero .swiper-slide {
    min-height: 680px;
    background-position: center;
    background-size: cover;
    position: relative;
    overflow: hidden;
}

/* Ensure container has height so Swiper can render */
.home-hero {
    height: 906px;
    width: 100%;
    overflow: hidden;
}

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

/* Text animation */
.home-hero .swiper-slide .sw-text {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity .4s ease, transform .4s ease;
}

.home-hero .swiper-slide-active .sw-text {
    opacity: 1;
    transform: translateY(0);
}

.home-hero .swiper-slide > .marginAuto {
    position: relative;
    z-index: 1;
}

.home-hero .swiper-slide > .marginAuto .sw-text {
    opacity: 0;
    transform: translateY(50px);
    transition: all 0.8s ease 0.3s;
}

.home-hero .swiper-slide:first-child {
    transform: translateX(0);
}

.home-hero .swiper-slide:first-child .sw-text {
    opacity: 1;
    transform: translateY(0);
}

.home-hero .scroll-down {
    display: inline-block;
    margin-top: 18px;
}

.home-hero .scroll-down img {
    width: 28px;
    height: 28px;
    opacity: .9;
}

.home-hero .button-prev,
.home-hero .button-next {
    position: absolute;
    z-index: 11;
    top: 50%;
    width: 56px;
    height: 56px;
    margin-top: -28px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.home-hero .button-next {
    right: 40px;
}

.home-hero .button-prev {
    left: 40px;
}

.home-hero .button-prev img,
.home-hero .button-next img {
    width: 56px;
    height: 56px;
    display: block;
    transition: transform .2s ease;
}

.home-hero .button-prev:hover img,
.home-hero .button-next:hover img {
    transform: scale(1.06);
}

/* 首页 tabs，覆盖 p-tabs 规则以适配首页结构（li 直接可点击） */
.home-tabs {
    background: #fff;
}

.home-tabs ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
}

.home-tabs ul li {
    flex: 1;
    padding: 16px 0;
    cursor: pointer;
    color: #666;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    position: relative;

    transition: color .2s ease, background-color .2s ease;
}

.home-tabs ul li.active {
    color: #1b3a8a;
    border-bottom: 2px solid #1b3a8a;
}

.home-tabs ul li:hover {
    color: #1b3a8a;
    background: #f3f7ff;
}

.home-tabs ul li + li:before {
    content: "";
    position: absolute;
    left: -1px;
    top: 50%;
    width: 1px;
    height: 18px;
    background: #e6ecf6;
    transform: translateY(-50%);
}

.home-tabs ul li img {
    width: 26px;
    height: 26px;
    display: block;
}

/* 产品与方案（右侧轮播与卡片） */
.home-products .card.blue {
    background: #0f4fb9;
    color: #fff;
    padding: 40px 42px;
    border-radius: 6px;
    position: relative;
    overflow: hidden;
}

.home-products .card-title {
    font-size: 28px;
    font-weight: 800;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.home-products .card-title .title-icon {
    width: 22px;
    height: 22px;
}

.home-products .list {
    padding-left: 18px;
}

.home-products .list li {
    line-height: 2;
}

.home-products .hp-right img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    border-radius: 0;
}

.home-products .hp-figure {
    position: relative;
    height: 100%;
}

.home-products .hp-figure img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    border-radius: 0;
}

.hp-panel {
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    display: grid;
    grid-template-columns: 678px 762px;
    gap: 0;
    align-items: stretch;
    overflow: hidden;
    height: 491px;
    min-height: 491px;
}

.home-products .hp-left .hp-figure img {
    width: 100%;
    height: 491px;
    object-fit: cover;
    display: block;
}

.hp-panel > .hp-left,
.hp-panel > .hp-right,
.hp-panel .hp-figure {
    margin: 0;
}

.home-products .hp-right,
.home-products .hp-left {
    height: 100%;
}

.hp-swiper,
.hp-swiper .swiper-wrapper,
.hp-swiper .swiper-slide {
    height: 100%;
}

.list-bullet li {
    position: relative;
    padding-left: 18px;
}

.list-bullet li:before {
    content: "◆";
    position: absolute;
    left: 0;
    color: #9cc3ff;
    font-size: 12px;
    line-height: 1;
    top: 8px;
}

.hp-swiper {
    position: relative;
}

.hp-prev,
.hp-next {
    position: absolute;
    top: 50%;
    width: 48px;
    height: 48px;
    margin-top: -24px;
    z-index: 3;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 32px;
}

.hp-prev {
    left: 12px;
    background-image: url('../images/Group 2.png');
}

.hp-next {
    right: 12px;
    background-image: url('../images/Group 3.png');
}

/* 封装技术服务 球形示意 */
.home-packaging {
    padding: 80px 0;
    background: #f9fbff url('../images/image 16.png') center/cover no-repeat;
    position: relative;
    height: 861px;
}

.home-packaging .p-title {
    font-size: 26px;
    font-weight: 800;
    margin-bottom: 22px;
    position: relative;
    padding-bottom: 8px;
}

.home-packaging .p-title:after {
    content: "";
    width: 64px;
    height: 3px;
    background: #1b3a8a;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    border-radius: 2px;
}

.home-packaging .p-sub {
    color: #8aa0c6;
    margin: 10px 0 30px;
}

.pkg-wrap {
    position: relative;
    margin: 0 auto;
}

/* Hide simplified package list on desktop; shown in mobile.css */
.pkg-list { display: none; }

.pkg-globe {
    width: 526px;
    height: 545px;
    position: relative;
    margin: 0 auto;
}

.pkg-globe img {
    width: 100%;
    height: 100%;
    display: block;
}

.pkg-label {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #4570c7;
    font-weight: 600;
}

.pkg-label img {
    width: 24px;
    height: 24px;
}

.pkg-label .pkg-line {
    position: absolute;
    z-index: 1;
    width: 151px;
}

.pkg-label.tl {
    left: -380px;
    top: 41px;
    padding-right: 181px;
}

.pkg-label.tl .pkg-line {
    right: 0;
    top: 22px;
}

.pkg-label.tr {
    right: -360px;
    top: 41px;
    padding-left: 181px;
}

.pkg-label.tr .pkg-line {
    left: 0;
    top: 50%;
}

.pkg-label.bl {
    left: -320px;
    bottom: 116px;
    padding-right: 181px;
}

.pkg-label.bl .pkg-line {
    right: 0;
    bottom: 0;
}

.pkg-label.br {
    right: -300px;
    bottom: 116px;
    padding-left: 181px;
}

.pkg-label.br .pkg-line {
    left: 0;
    bottom: 0;
}

.home-packaging .globe img {
    width: 100%;
    opacity: .9;
}

.home-packaging .icons span {
    margin: 0 18px;
    color: #3b5db7;
}

/* 可靠性三块区 */
.home-reliability {
    background-image: url('../images/Group 5.png');
    background-size: 100% 833px;
    background-position: top;
    background-repeat: no-repeat;
    padding-bottom: 0 0 204px;
    height: 1037px;
    overflow: hidden;
}

.rel-head .rel-title {
    font-size: 40px;
    font-family: 'PingFang SC';
    font-weight: 600;
    text-align: center;
    color: #ffffff;
    line-height: 48px;
    margin-top: 80px;
}

.rel-head .rel-sub {
    font-size: 24px;
    font-family: 'D-DIN', 'D-DIN Exp', 'D-DIN Condensed', sans-serif;
    font-weight: 500;
    text-align: center;
    color: #ffffff;
    line-height: 48px;
    margin-top: 10px;
}

.rel-grid {
    margin-top: 60px;
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 28px;
    width: 100%;
    z-index: 11;
}

.rel-card {
    position: relative;
    display: block;
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
    overflow: hidden;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    z-index: 12;
    transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
    will-change: transform;
}

.rel-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 26px rgba(0,0,0,.18);
}

.rel-card .rel-content > img {
    transition: transform .3s ease;
}

.rel-card:hover .rel-content > img {
    transform: scale(1.05);
}

.rel-card .rel-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 725px;
    width: 100%;
    padding: 24px;
}

.rel-card.rel-left {
    background-image: url('../images/Group 246.png');
}

.rel-card.rel-right {
    background-image: url('../images/Group 248.png');
}

.rel-card.rel-mid {
    background-image: url('../images/Group 247.png');
    background-color: #f0f8fe;
}

.rel-card .rel-name {
    font-weight: 700;
    font-size: 36px;
    line-height: 48px;
    font-family: 'PingFang SC';
    color: #fff;
    margin-bottom: 24px;
}

.rel-card .rel-desc {
    font-size: 16px;
    font-weight: 400;
    color: #fff;
    line-height: 48px;
    font-family: 'PingFang SC';
}

.rel-mid .rel-name,
.rel-mid .rel-desc {
    color: #1b3a8a;
}

.rel-mid .rel-content > img {
    margin: 26px;
}

.rel-card .rel-content > img,
.rel-card .rel-bg {
    width: 46px;
    height: 46px;
}

.rel-card .rel-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: contrast(1.05);
}

/* 关于我们 */
.home-about {
    padding: 74px 0 60px;
    background: #f9fbff url('../images/Group 6.png') center/cover no-repeat;
    position: relative;
    height: 548px;
}

.home-about .p-title {
    font-size: 40px;
    line-height: 48px;
    font-weight: 600;
    margin-bottom: 12px;
    position: relative;
    padding-bottom: 8px;
    color: #1B1B1C;
    font-family: 'PingFang SC';
}

.home-about .company-name,
.home-about .slogan {
    font-size: 24px;
    line-height: 48px;
    font-weight: 600;
    margin-bottom: 8px;
    color: #1B1B1C;
    font-family: 'D-DIN', 'D-DIN Exp', 'D-DIN Condensed',sans-serif;
}

.home-about p {
    font-size: 18px;
    line-height: 40px;
    font-weight: 400;
    color: #666666;
    font-family: 'D-DIN', 'D-DIN Exp', 'D-DIN Condensed',sans-serif;
}

.home-about .link {
    display: inline-block;
    margin-top: 60px;
}

.home-about .link img {
    width: 24px;
    height: 24px;
    transition: transform .2s ease;
}

.home-about .link:hover img {
    transform: translateX(4px);
}

.home-about .img {
    text-align: right;
}

.home-about .img img {
    width: 616px;
    height: 414px;
    transition: transform .35s ease;
}
/* 公司新闻 */
.news-item { transition: transform .22s ease, box-shadow .22s ease; }
.news-item:hover { transform: translateY(-4px); box-shadow: 0 10px 26px rgba(0,0,0,.12); }
.news-item img { transition: transform .35s ease; }
.news-item:hover img { transform: scale(1.04); }
.news-item .txt h3 { transition: color .2s ease; }
/* 资质证书 */
.cert-card { transition: transform .22s ease, box-shadow .22s ease; }
.cert-card:hover { transform: translateY(-4px); box-shadow: 0 10px 26px rgba(0,0,0,.12); }
.cert-card img { transition: transform .35s ease; }
.cert-card:hover img { transform: scale(1.03); }
/* 封测技术服务 */
.diag-list li { transition: transform .2s ease; }
.diag-list li:hover { transform: translateX(4px); }
.adv-card { transition: transform .22s ease, box-shadow .22s ease; }
.adv-card:hover { transform: translateY(-4px); box-shadow: 0 10px 26px rgba(0,0,0,.12); }
/* sic认证 */
.sic-img img { transition: transform .35s ease; }
.sic-img:hover img { transform: scale(1.04); }
.sic-list li { transition: transform .2s ease; }
.sic-list li:hover { transform: translateX(4px); }
.btn-cta { transition: transform .2s ease, box-shadow .2s ease; }
.btn-cta img { transition: transform .2s ease; }
.btn-cta:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(0,0,0,.12); }
.btn-cta:hover img { transform: translateX(4px); }
/* 封装技术服务 */
.support-card { transition: transform .22s ease, box-shadow .22s ease; }
.support-card:hover { transform: translateY(-4px); box-shadow: 0 10px 26px rgba(0,0,0,.12); }
.support-card .icon img { transition: transform .35s ease; }
.support-card:hover .icon img { transform: scale(1.06); }
.support-card .txt h3 { transition: color .2s ease; }
.support-card:hover .txt h3 { color: #1b3a8a; }
/* 封装品种 */

.kind-card { transition: transform .22s ease, box-shadow .22s ease; cursor: pointer; }
.kind-card:hover { transform: translateY(-4px); box-shadow: 0 10px 26px rgba(0,0,0,.12); }
.kind-card .pic img { transition: transform .35s ease; }
.kind-card:hover .pic img { transform: scale(1.05); }
.kind-card .name { transition: color .2s ease; }
.kind-card:hover .name { color: #1b3a8a; }

@media only screen and (max-width: 1024px) and (min-width:0px) {
    .marginAuto {
        width: auto;
        padding: 0 16px;
    }

    .grid-2,
    .grid-3 {
        grid-template-columns: 1fr;
    }
}