@media (max-width: 1199px) {
    header {
        max-width: 100%;
        border-radius: 0;
        left: 0;
        right: 0;
    }
    
    header.scrolled {
        top: 0;
    }
    
    /* 导航右侧四个入口（搜索 / 语言 / 用户 / 购物车）在窄屏容易挤成一排，
       先收紧间距；语言胶囊本身的高度由 style.css 的 .nav-lang 规则控制。 */
    .nav-right {
        gap: 14px;
    }
    
    .nav-links {
        gap: 20px;
    }
    
    .hero-product-card-wrapper {
        margin-top: 40px;
    }
    
    .hero-product-card {
        justify-content: center;
    }
    
    .pd-content {
        flex-direction: column;
    }
    
    .pd-card {
        clip-path: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 40px !important;
        min-height: auto;
    }
    
    .pd-card-partners::before,
    .pd-card-distributors::before {
        display: none;
    }
    
    .pd-header {
        position: static !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
    }
    
    .product-content {
        grid-template-columns: 1fr;
    }
    
    .product-left img {
        height: 250px;
    }
    
    .app-industry-nav {
        height: auto;
        padding: 20px;
        flex-wrap: wrap;
    }
    
    .app-nav-label {
        writing-mode: horizontal-tb;
        transform: none;
        height: auto;
        padding: 10px 20px;
        border-radius: 6px;
        width: 100%;
        margin-bottom: 15px;
    }
    
    .app-nav-label span {
        font-size: 20px;
    }
    
    .industry-items {
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
    }
    
    .industry-icon {
        width: 50px;
        height: 50px;
    }
    
    .industry-icon i {
        font-size: 20px;
    }
    
    .app-industry-nav .industry-item span {
        font-size: 11px;
    }
    
    .partners-grid {
        grid-template-columns: repeat(4, 1fr);
    }
    
    .news-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .footer-nav {
        grid-template-columns: 1fr 1fr 1fr;
        gap: 30px;
    }
    
    .nav-column:last-child {
        grid-column: span 3;
    }
}

@media (max-width: 991px) {
    header {
        border-radius: 0;
        max-width: 100%;
        left: 0;
        right: 0;
    }
    
    header.scrolled {
        top: 0;
    }
    
    nav {
        padding: 15px 20px;
    }
    
    .nav-links {
        display: none;
    }
    
    /* 语言切换器在移动端仍留在 .nav-right（不参与折叠），
       插件原生控件带国旗，窄屏下不隐藏，避免访客找不到语言入口。

       这里只收内边距，不重设 width/height：导航里那颗球是裸图标，
       尺寸由 style.css 里 .trp-current-language-item__wrapper 的 padding 决定（触发器本身是 width:auto）。
       上一版在这里写了固定 30×26，会和 width:auto 打架、把球压变形。

       另外选择器要排掉触发器（写成 .trp-switcher-dropdown-list .trp-language-item）：
       本文件在 style.css 之后加载，同特异度下会覆盖掉触发器那条 padding:0。 */
    /* 同样要多插一层 .trp-shortcode-switcher 把特异度抬到 (0,4,0)：
       插件的 trp-language-switcher-v2.css 在本文件之后加载，同特异度会被它盖掉。
       展开态的首行胶囊由 style.css 的 (0,5,0) 归零，不受这里影响。 */
    .nav-lang .trp-shortcode-switcher .trp-current-language-item__wrapper:not(.trp-hide-arrow) {
        padding: 5px 8px;
    }
    /* 面板里的行（含展开态的「当前语言」首行）在窄屏统一收到 9px 14px，
       两行必须同高，否则首行会比其它行高一截。 */
    .nav-lang .trp-switcher-dropdown-list .trp-language-item,
    .nav-lang .trp-shortcode-overlay.is-open .trp-language-item__current {
        padding: 9px 14px;
    }
    
    .burger-menu {
        display: block;
    }
    
    .hero {
        padding: 60px 20px;
    }
    
    .hero-content {
        width: 100%;
    }
    
    .hero-content h1 {
        font-size: 36px;
    }
    
    .hero-content p {
        font-size: 16px;
    }
    
    .product-section {
        padding: 40px 0;
    }
    
    .product-section h2 {
        font-size: 28px;
    }
    
    .product-tabs .tab {
        padding: 8px 18px;
        font-size: 13px;
    }
    
    .bluetooth-header span {
        font-size: 24px;
    }
    
    .bluetooth-header i {
        font-size: 28px;
    }
    
    .app-main-container {
        flex-direction: column;
    }
    
    .app-vertical-nav {
        width: 100%;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-around;
        padding: 10px;
        gap: 5px;
    }
    
    .app-vertical-nav .nav-item {
        flex: 0 0 calc(33.33% - 10px);
        min-height: auto;
        padding: 12px;
        justify-content: center;
        text-align: center;
        gap: 8px;
    }
    
    .app-vertical-nav .nav-item i {
        width: 40px;
        height: 40px;
        font-size: 20px;
    }
    
    .app-main {
        flex-direction: column;
        padding: 15px;
    }
    
    .app-content-right {
        order: -1;
    }
    
    .app-header h3 {
        font-size: 24px;
    }
    
    .app-image-container img {
        height: 280px;
    }
    
    .module-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .partners-section, .distributors-section {
        padding: 40px 0;
    }
    
    .partners-section h2, .distributors-section h2 {
        font-size: 24px;
    }
    
    .news-section {
        padding: 40px 0;
    }
    
    .news-section h2 {
        font-size: 24px;
    }
    
    .news-main {
        flex-direction: column;
        max-height: none;
    }
    
    .news-main-left img {
        height: 280px;
    }
    
    .news-main-right {
        flex: 1;
    }
    
    .news-main-btn {
        margin-top: 15px;
        margin-left: 0;
    }
    
    .news-content h3 {
        font-size: 20px;
    }
    
    footer {
        padding: 40px 20px 20px;
    }
}

@media (max-width: 767px) {
    .hero-content h1 {
        font-size: 28px;
    }
    
    .hero-content p {
        font-size: 14px;
    }
    
    .hero-product-card {
        flex-direction: column;
        text-align: center;
        padding: 35px 25px 25px;
    }
    
    .product-badge {
        left: 50%;
        transform: translateX(-50%);
        top: -12px;
    }
    
    .hero-product-card img {
        margin: 15px 0;
    }
    
    .product-tabs {
        gap: 10px;
    }
    
    .product-tabs .tab {
        padding: 8px 15px;
        font-size: 12px;
    }
    
    .product-left img {
        height: 200px;
    }
    
    .product-card img {
        height: 150px;
    }
    
    .app-industry-nav {
        padding: 15px;
    }
    
    .industry-icon {
        width: 44px;
        height: 44px;
    }
    
    .industry-icon i {
        font-size: 18px;
    }
    
    .app-industry-nav .industry-item span {
        font-size: 10px;
    }
    
    .app-header p {
        font-size: 14px;
    }
    
    .app-image-container img {
        height: 220px;
    }
    
    .partners-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
    
    .partner-logo {
        height: 50px;
    }
    
    .news-grid {
        grid-template-columns: 1fr;
    }
    
    .news-card img {
        height: 180px;
    }
    
    .footer-nav {
        grid-template-columns: 1fr 1fr;
    }
    
    .nav-column:last-child {
        grid-column: span 2;
    }
    
    .footer-bottom {
        flex-direction: column;
        gap: 15px;
        text-align: center;
    }
    
    .footer-links {
        order: -1;
    }
}

@media (max-width: 480px) {
    .hero {
        padding: 40px 15px;
    }
    
    .hero-content h1 {
        font-size: 24px;
    }
    
    .brand-badge {
        flex-wrap: wrap;
        gap: 10px;
    }
    
    .product-section h2 {
        font-size: 24px;
    }
    
    .product-tabs {
        flex-direction: column;
        align-items: center;
    }
    
    .product-tabs .tab {
        width: 100%;
        max-width: 200px;
        text-align: center;
    }
    
    .bluetooth-header span {
        font-size: 20px;
    }
    
    .bluetooth-header i {
        font-size: 24px;
    }
    
    .app-vertical-nav .nav-item {
        flex: 0 0 calc(50% - 10px);
        padding: 10px;
    }
    
    .app-vertical-nav .nav-item i {
        width: 36px;
        height: 36px;
        font-size: 18px;
    }
    
    .module-grid {
        grid-template-columns: 1fr;
    }
    
    .partners-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .news-main img {
        height: 200px;
    }
    
    .footer-nav {
        grid-template-columns: 1fr;
    }
    
    .nav-column:last-child {
        grid-column: span 1;
    }
    
    .footer-brand-row {
        flex-direction: column;
        gap: 15px;
        align-items: flex-start;
    }
    
    .footer-right {
        flex-direction: column;
        gap: 5px;
    }
    
    .footer-right span {
        font-size: 12px;
    }
}

@media (max-width: 991px) {
    .products-page {
        padding: 20px 0;
    }
    
    .products-header h1 {
        font-size: 24px;
    }
    
    .products-tab {
        padding: 8px 15px;
        font-size: 12px;
    }
    
    /* 窄屏不再砍列。桌面端早就有 .products-table-wrapper{overflow-x:auto} +
       .products-table{min-width:1000px}，本来就能横向滑；以前这里用 nth-child 把第 5 列之后
       display:none，等于把参数在手机上删掉——“筛选结果只剩一张图”就是这么来的（叠加了
       module-cell 里的名称 span 在模板里被注释掉这一点）。
       现在 10 列全留，靠横向滑动看全。 */
    .products-table-wrapper {
        -webkit-overflow-scrolling: touch;
    }

    /* 把横向滚动条显式画出来，给用户“这里还能滑”的提示（iOS 自己会隐藏，不影响滑动） */
    .products-table-wrapper::-webkit-scrollbar {
        height: 6px;
    }

    .products-table-wrapper::-webkit-scrollbar-track {
        background: #f2f4f7;
    }

    .products-table-wrapper::-webkit-scrollbar-thumb {
        background: #c6cfd9;
        border-radius: 3px;
    }

    .products-headers, .product-row {
        gap: 10px;
    }
    /* 这里不要再写 grid-template-columns：一写就把桌面端那份 10 列宽比覆盖了，
       列会挤在屏幕宽度里而不是撑到 min-width，滑动也就没意义了。 */
    
    .pagination a, .pagination span {
        width: 32px;
        height: 32px;
        font-size: 12px;
    }
}

@media (max-width: 767px) {
    .products-tab {
        padding: 7px 12px;
        font-size: 11px;
    }
    
    .filters-row {
        gap: 10px;
    }
    
    .filter-select-wrapper select {
        padding: 8px 30px 8px 12px;
        font-size: 12px;
    }
    
    /* 同上：这一档以前只留 2 列（图 + Model No.），第 3 列起全 display:none。 */
    .products-headers, .product-row {
        gap: 8px;
    }
    
    .product-cell.module-cell img {
        width: 40px;
        height: 40px;
    }
}

@media (max-width: 480px) {
    .products-tab {
        width: 100%;
        justify-content: center;
    }
    
    .search-bar input {
        padding: 12px 40px 12px 15px;
        font-size: 14px;
    }
    
    .products-info {
        overflow-x: auto;
    }
    
    /* 以前这一档把第 2 列起全藏了，表头只剩一个 “Module”、行里只剩一张图（用户截图就是这个宽度）。
       现在维持 10 列 + 横向滑动，不再 display:none 任何列。 */
    .products-headers, .product-row {
        gap: 6px;
        padding-left: 12px;
        padding-right: 12px;
    }

    .product-cell.module-cell {
        flex-direction: column;
        text-align: center;
        justify-content: center;
    }
    
    .pagination {
        flex-wrap: wrap;
        gap: 3px;
    }
    
    .pagination a, .pagination span {
        width: 28px;
        height: 28px;
        font-size: 11px;
    }
    
    .float-icons {
        right: 10px;
        gap: 8px;
    }
    
    .float-icon {
        width: 40px;
        height: 40px;
        font-size: 16px;
    }
    
    .ble-contact-section::before {
        width: 400px;
        height: 400px;
        right: -200px;
    }
}

@media (max-width: 1199px) {
    .ble-hero {
        height: 500px;
    }
    
    .ble-hero-left h1 {
        font-size: 32px;
    }
    
    .ble-hero-left h2 {
        font-size: 28px;
    }
    
    .ble-hero-stats {
        gap: 12px;
        flex-wrap: wrap;
    }
    
    .stat-card {
        padding: 12px 18px;
        min-width: 140px;
    }
    
    .stat-number {
        font-size: 16px;
    }
    
    .stat-label {
        font-size: 11px;
    }
    
    .series-features-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .applications-top {
        flex-direction: column;
        gap: 30px;
    }
    
    .applications-left h2,
    .applications-left h3,
    .applications-left h4 {
        font-size: 28px;
    }
    
    .applications-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 15px;
    }
    
    .application-card {
        flex: none;
    }
    
    .services-row {
        gap: 15px;
    }
    
    .service-item {
        max-width: 100px;
    }
    
    .get-to-know-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
}

@media (max-width: 991px) {
    .ble-hero {
        height: 450px;
    }
    
    .ble-hero-left h1 {
        font-size: 28px;
    }
    
    .ble-hero-left h2 {
        font-size: 24px;
    }
    
    .ble-hero-left p {
        font-size: 14px;
    }
    
    .ble-hero-stats {
        flex-wrap: wrap;
        gap: 10px;
    }
    
    .stat-card {
        padding: 10px 15px;
        min-width: 120px;
    }
    
    .stat-number {
        font-size: 15px;
    }
    
    .stat-label {
        font-size: 10px;
    }
    
    .ble-contact-section::before {
        width: 300px;
        height: 300px;
        right: -150px;
    }
    
    .chipset-header {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .chipset-tabs {
        width: 100%;
    }
    
    .video-card {
        flex-direction: column;
    }
    
    .video-thumbnail img {
        height: 200px;
    }
    
    .form-row {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .ble-hero {
        height: 400px;
    }
    
    .ble-hero-left h1 {
        font-size: 24px;
    }
    
    .ble-hero-left h2 {
        font-size: 20px;
    }
    
    .ble-hero-left p {
        font-size: 13px;
    }
    
    .ble-hero-stats {
        flex-direction: column;
        gap: 10px;
    }
    
    .series-features-grid {
        grid-template-columns: 1fr;
    }
    
    .applications-left h2,
    .applications-left h3,
    .applications-left h4 {
        font-size: 22px;
    }
    
    .applications-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }
    
    .application-card {
        flex: none;
        border: none;
        margin-bottom: 0;
    }
    
    .services-row {
        justify-content: center;
        gap: 10px;
    }
    
    .service-item {
        max-width: 80px;
    }
    
    .get-to-know-grid {
        grid-template-columns: 1fr;
    }
    
    .form-row {
        grid-template-columns: 1fr;
    }
    
    .faq-question span {
        font-size: 13px;
    }
    
    .footer-brand-row {
        flex-direction: column;
        gap: 15px;
        align-items: flex-start;
    }
    
    .footer-right {
        flex-direction: column;
        gap: 5px;
    }
    
    .footer-right span {
        font-size: 12px;
    }
    
    .ble-contact-section::before {
        width: 200px;
        height: 200px;
        right: -100px;
    }
}

@media (max-width: 480px) {
    .ble-hero {
        padding: 40px 15px;
    }
    
    .ble-hero-left h1 {
        font-size: 20px;
    }
    
    .ble-hero-image-wrapper img {
        height: 180px;
    }
    
    .ble-hero-buttons {
        flex-direction: column;
    }
    
    .ble-hero-product-card {
        flex-direction: column;
        text-align: center;
    }
    
    .series-tab {
        padding: 8px 15px;
        font-size: 12px;
    }
    
    .applications-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .application-card {
        flex: none;
    }
    
    .services-row {
        gap: 10px;
    }
    
    .service-item {
        max-width: 80px;
    }
    
    .ble-faq-section h2,
    .ble-video-section h2,
    .ble-get-to-know-section h2,
    .ble-contact-section h2,
    .ble-series-section h2 {
        font-size: 22px;
    }
}

/* ===== Product Detail Page ===== */
@media(max-width:992px){
    .pd-hero-grid{grid-template-columns:1fr;gap:40px}
    .pd-hero-left{height:auto}
    .pd-features{flex:none}
    .pd-features li{flex:none}
    .pd-hero-actions{margin-top:30px}
    .pd-devkits-inner{grid-template-columns:1fr}
    /* 单列后产品图占满宽度，固定高度相应抬一点；缩略图已改为自动轮播，不再需要尺寸适配 */
    .pd-product-img{height:320px}
    .pd-gallery-thumb{width:58px;height:48px}
    .pd-drawings-grid{grid-template-columns:1fr 1fr}
    .pd-know-grid{grid-template-columns:1fr 1fr}
    .pd-related-head,.pd-related-row{font-size:11px;padding:10px 5px}
    .pd-related-head{grid-template-columns:1fr 1fr 0.5fr 0.5fr 0.8fr 0.5fr 0.8fr 0.8fr 0.6fr 0.5fr 0.8fr}
    .pd-related-row{grid-template-columns:1fr 1fr 0.5fr 0.5fr 0.8fr 0.5fr 0.8fr 0.8fr 0.6fr 0.5fr 0.8fr}
}

@media(max-width:768px){
    .pd-top-bar{flex-direction:column;align-items:flex-start}
    .pd-hero{padding:20px 0 40px}
    .pd-hero-title{font-size:26px}
    .pd-product-img{height:270px}
    /* 窄屏下箭头与圆点相应缩小，少占图的可视空间 */
    .pd-gallery-nav{width:28px;height:28px;font-size:12px}
    .pd-gallery-prev{left:6px}
    .pd-gallery-next{right:6px}
    .pd-gallery-dots{bottom:7px}
    .pd-gallery-thumbs{gap:8px}
    .pd-gallery-thumb{width:52px;height:44px}
    .pd-devkits-grid{grid-template-columns:1fr}
    .pd-tab-nav{overflow-x:auto;white-space:nowrap;width:100%}
    .pd-devkit-card{flex-direction:column;text-align:center}
    .pd-devkit-img{width:100%;height:120px}
    .pd-section-banner{padding:15px 20px;margin:30px 0 20px}
    .pd-section-banner h2{font-size:22px}
    .pd-section-title{font-size:22px;margin:30px 0 20px}
    .pd-specs-row{grid-template-columns:1fr 1fr!important}
    .pd-specs-table-3col .pd-specs-row{grid-template-columns:1fr 1fr!important}
    .pd-specs-table-3col .pd-specs-row .pd-specs-cell:nth-child(3){grid-column:span 2}
    .pd-specs-cell{padding:12px 15px;font-size:13px;white-space:normal!important;word-break:break-word}
    .pd-downloads{padding:12px 15px}
    .pd-download-name{font-size:12px}
    .pd-drawings-grid{grid-template-columns:1fr}
    .pd-know-grid{grid-template-columns:1fr}
    .pd-related-head{display:none}
    .pd-related-row{grid-template-columns:1fr 1fr 1fr 1fr!important;padding:10px}
    .pd-faq-q{font-size:14px;padding:15px 8px}
    /* 列数、列宽比例与 min-width 现在都由 PHP 按系列下发（--cs-cols / --cs-minw）。
       这里不能再写 grid-template-columns / min-width：封面表的列数已经跟着系列变了（mmWave
       只有 8 列），写死一份 10 列的比例就必然错位；而上一轮就是因为表头写了 800、
       数据体写了 700，两块独立 grid 各排各的列。窄屏只收紧 padding。 */
    .chipset-table-header{padding:10px 12px}
    .chipset-tr{padding:12px}
    .pd-compare{padding:36px 0}
    .pd-compare-table{min-width:520px;font-size:12px}
    .pd-compare-table th,.pd-compare-table td{padding:10px 8px}
    .pd-compare-param{min-width:120px;position:static}
}

@media(max-width:480px){
    .pd-compare-table{min-width:440px;font-size:11px}
}

@media(max-width:991px){
    .news-layout{grid-template-columns:1fr}
    .news-sidebar{position:static}
    .news-detail-layout{grid-template-columns:1fr}
    .contact-layout{grid-template-columns:1fr}
    .contact-cards{grid-template-columns:repeat(2,1fr)}
    .about-grid{grid-template-columns:1fr;gap:40px}
    .about-stats{grid-template-columns:repeat(2,1fr)}
    .mission-grid{grid-template-columns:1fr}
    .team-grid{grid-template-columns:repeat(2,1fr)}
    .timeline-item:nth-child(odd),
    .timeline-item:nth-child(even){flex-direction:row}
    .timeline::before{left:35px}
    .timeline-year{left:35px;transform:translateX(-50%)}
    .timeline-content{max-width:calc(100% - 80px);margin-left:70px!important;margin-right:0!important}
    .about-hero{padding:60px 0 50px}
    .about-hero h1{font-size:32px}
    .about-section{padding:60px 0}
    .about-text h2{font-size:26px}
    .cta-inner{padding:40px 30px}
    .cta-inner h2{font-size:24px}
    .cta-buttons{flex-direction:column;align-items:center}
    .cta-buttons a{width:100%;max-width:240px;text-align:center}
}

@media(max-width:767px){
    .news-grid{grid-template-columns:1fr}
    .news-featured{grid-template-columns:1fr}
    .news-featured-img{aspect-ratio:16/9}
    .news-article{padding:24px}
    .news-article h1{font-size:22px}
    .news-article-meta{flex-wrap:wrap;gap:10px}
    .contact-cards{grid-template-columns:1fr}
    .contact-info{padding:24px}
    .contact-form-wrap{padding:24px}
    .contact-form .form-row{grid-template-columns:1fr}
    .apps-grid{grid-template-columns:1fr}
    .section-center h2{font-size:26px}
    .team-grid{grid-template-columns:1fr}
    .timeline{padding:10px 0}
    .timeline-content{padding:18px 20px}
    .timeline-content h4{font-size:15px}
    .timeline-content p{font-size:13px}
    .about-stats{grid-template-columns:repeat(2,1fr);gap:16px}
    .stat-num{font-size:26px}
    .page-banner{padding:50px 0 40px}
    .page-banner h1{font-size:28px}
    .page-banner p{font-size:14px}
    .cta-inner{padding:30px 20px}
    .cta-inner h2{font-size:22px}
    .cta-inner p{font-size:14px}
}