/**
 * ============================================================
 * StudioLights.org · 移动端响应式样式
 * 适用于全部页面模板
 * 断点：768px（平板）、480px（手机）
 * 版本：1.0
 * ============================================================
 */


/* ============================================================
   1. 全局基础重置（移动端优先）
   ============================================================ */

/* 确保所有元素使用 border-box */
* {
    box-sizing: border-box;
}

/* 移动端基础字体设置 */
html {
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
}

body {
    font-size: 15px;
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* 容器内边距统一 */
.container {
    padding-left: 16px;
    padding-right: 16px;
}


/* ============================================================
   2. 通用组件移动端适配
   ============================================================ */

/* ----- 2.1 徽章/标签 ----- */
@media (max-width: 768px) {
    .badge-gold {
        font-size: 10px;
        padding: 2px 10px;
    }
}

/* ----- 2.2 区块标题 ----- */
@media (max-width: 768px) {
    .section-head {
        margin: 32px 0 16px;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
    .section-head h2 {
        font-size: 20px;
    }
    .section-head .more-link {
        font-size: 13px;
    }
}

/* ----- 2.3 评分卡片（通用） ----- */
@media (max-width: 768px) {
    .score-box {
        flex-direction: column;
        align-items: flex-start;
        padding: 14px 18px;
        gap: 8px;
    }
    .score-box .big-number {
        font-size: 34px;
    }
    .score-box .score-detail {
        font-size: 13px;
    }
}

/* ----- 2.4 按钮通用 ----- */
@media (max-width: 768px) {
    .btn-buy,
    .btn-submit,
    .btn-home,
    .btn-outline,
    .nav-cta {
        min-height: 44px;
        min-width: 44px;
        padding: 12px 20px;
        font-size: 14px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
}

/* ----- 2.5 表格通用（横向滚动） ----- */
@media (max-width: 768px) {
    .table-wrap,
    .data-table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        margin: 12px -8px 16px;
        padding: 0 8px;
        border-radius: 0;
    }
    .table-wrap table,
    .data-table-wrap table {
        min-width: 520px;
        font-size: 13px;
    }
    .table-wrap table th,
    .table-wrap table td,
    .data-table-wrap table th,
    .data-table-wrap table td {
        padding: 8px 12px;
        white-space: nowrap;
    }
}

/* ----- 2.6 分页 ----- */
@media (max-width: 768px) {
    .pagination {
        gap: 4px;
        flex-wrap: wrap;
    }
    .pagination a,
    .pagination span {
        min-width: 36px;
        padding: 6px 10px;
        font-size: 13px;
    }
}

/* ----- 2.7 面包屑导航 ----- */
@media (max-width: 768px) {
    .breadcrumb {
        font-size: 12px;
    }
    .breadcrumb .sep {
        margin: 0 4px;
    }
}


/* ============================================================
   3. 导航栏（移动端汉堡菜单）
   ============================================================ */

@media (max-width: 768px) {
    /* 显示汉堡图标 */
    .hamburger {
        display: block;
        font-size: 26px;
        color: var(--text-secondary);
        cursor: pointer;
        padding: 6px 4px;
        min-height: 44px;
        min-width: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: color 0.25s ease;
        background: none;
        border: none;
    }
    .hamburger:hover {
        color: #fff;
    }

    /* 隐藏桌面导航，改为移动端样式 */
    .nav-links {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: var(--bg-secondary);
        flex-direction: column;
        padding: 12px 20px 20px;
        border-bottom: 1px solid var(--border-subtle);
        gap: 4px;
        box-shadow: 0 12px 40px rgba(0,0,0,0.6);
        z-index: 99;
    }
    .nav-links.open {
        display: flex;
    }
    .nav-links a {
        padding: 12px 4px;
        font-size: 15px;
        border-bottom: 1px solid var(--border-subtle);
        display: block;
        color: var(--text-secondary);
    }
    .nav-links a:last-child {
        border-bottom: none;
    }
    .nav-links a:hover,
    .nav-links a.active {
        color: #fff;
    }
    .nav-links a.active::after {
        display: none;
    }
    .nav-links .nav-cta {
        margin-top: 8px;
        text-align: center;
        background: var(--accent-gold);
        color: #0c0c0c !important;
        border-radius: 100px;
        padding: 12px 20px;
    }
    .nav-links .nav-cta:hover {
        background: #f7c35c !important;
        color: #0c0c0c !important;
    }

    /* 头部内边距调整 */
    .header-inner {
        padding: 0 4px;
    }
    .site-header {
        padding: 12px 0;
    }
    .logo {
        font-size: 20px;
    }
    .logo i {
        font-size: 24px;
    }
}


/* ============================================================
   4. 首页 (Homepage)
   ============================================================ */

@media (max-width: 768px) {
    /* Hero 区域 */
    .hero {
        padding: 32px 0 24px;
    }
    .hero h1 {
        font-size: 26px;
        letter-spacing: -0.5px;
    }
    .hero p {
        font-size: 15px;
        padding: 0 4px;
    }

    /* 搜索框 */
    .hero-search {
        flex-direction: column;
        border-radius: 12px;
        max-width: 100%;
    }
    .hero-search input {
        padding: 16px 18px;
        font-size: 16px; /* 防止 iOS 自动缩放 */
        text-align: center;
        border-radius: 12px 12px 0 0;
        min-height: 48px;
    }
    .hero-search input::placeholder {
        font-size: 15px;
    }
    .hero-search button {
        padding: 14px;
        border-radius: 0 0 12px 12px;
        font-size: 15px;
        min-height: 48px;
    }

    /* Hero 下方状态标签 */
    .hero .badge-gold,
    .hero .flex-wrap span {
        font-size: 12px;
    }
    .hero .flex-wrap {
        gap: 6px;
        justify-content: center;
    }

    /* 评测卡片网格：改为 1 列 */
    .card-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .review-card .card-img {
        height: 160px;
        font-size: 40px;
    }
    .review-card .card-img .badge {
        font-size: 10px;
        padding: 3px 12px;
        top: 10px;
        left: 10px;
    }
    .review-card .card-body {
        padding: 14px 16px 16px;
    }
    .review-card .card-body .meta {
        font-size: 12px;
        gap: 8px;
        flex-wrap: wrap;
    }
    .review-card .card-body h3 {
        font-size: 16px;
    }
    .review-card .card-body .excerpt {
        font-size: 13px;
        -webkit-line-clamp: 3;
    }
    .review-card .card-footer {
        flex-wrap: wrap;
        gap: 6px;
    }
    .review-card .card-footer .rating {
        font-size: 14px;
    }
    .review-card .card-footer .price-tag {
        font-size: 13px;
    }

    /* 对比工具预览块（首页内嵌） */
    .compare-preview {
        padding: 16px;
        margin: 8px 0;
    }
    .compare-preview .compare-grid {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
    }
    .compare-preview .compare-item {
        padding: 12px 10px;
    }
    .compare-preview .compare-item .icon-box {
        font-size: 24px;
    }
    .compare-preview .compare-item h4 {
        font-size: 13px;
    }
    .compare-preview .compare-item .param-row {
        font-size: 12px;
        padding: 4px 0;
    }
    .compare-preview .compare-item .badge-gold {
        font-size: 9px;
        padding: 2px 10px;
    }
    .compare-preview .compare-item:last-child {
        display: none; /* 手机端隐藏“添加产品”空位，腾出空间 */
    }
    .compare-preview .btn-buy {
        padding: 10px 20px;
        font-size: 13px;
    }

    /* 知识库快捷入口 */
    .quick-grid {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }
    .quick-item {
        padding: 14px 12px;
    }
    .quick-item i {
        font-size: 22px;
    }
    .quick-item h4 {
        font-size: 13px;
    }
    .quick-item p {
        font-size: 12px;
    }
}

/* 首页 · 超小屏 (<=480px) */
@media (max-width: 480px) {
    .hero h1 {
        font-size: 22px;
    }
    .hero p {
        font-size: 14px;
    }
    .compare-preview .compare-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .compare-preview .compare-item:last-child {
        display: none;
    }
    .quick-grid {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }
}


/* ============================================================
   5. 灯光产品库 (Products Archive)
   ============================================================ */

@media (max-width: 768px) {
    /* 筛选栏：改为垂直堆叠 */
    .filter-bar {
        flex-direction: column;
        align-items: stretch;
        padding: 14px 16px;
        gap: 10px;
        border-radius: 10px;
    }
    .filter-bar .filter-group {
        width: 100%;
        justify-content: space-between;
        font-size: 13px;
        flex-wrap: wrap;
        gap: 6px;
    }
    .filter-bar select,
    .filter-bar input {
        flex: 1;
        min-width: 80px;
        padding: 10px 14px;
        font-size: 15px; /* 防止 iOS 缩放 */
        border-radius: 8px;
        min-height: 44px;
    }
    .filter-bar .btn-filter {
        width: 100%;
        padding: 12px;
        margin-top: 2px;
        border-radius: 8px;
        min-height: 44px;
        font-size: 14px;
    }
    .filter-bar .filter-right {
        font-size: 12px;
        text-align: center;
        width: 100%;
        padding-top: 4px;
        border-top: 1px solid var(--border-subtle);
    }

    /* 产品卡片网格：改为 2 列 */
    .product-grid {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
    }
    .product-card {
        padding: 12px 12px 14px;
        border-radius: 10px;
    }
    .product-card .product-icon {
        font-size: 24px;
        padding: 4px 0 2px;
    }
    .product-card h4 {
        font-size: 14px;
    }
    .product-card .product-brand {
        font-size: 12px;
    }
    .product-card .product-meta {
        font-size: 12px;
        grid-template-columns: 1fr 1fr;
        gap: 2px 12px;
        padding: 6px 0 2px;
    }
    .product-card .product-meta .label {
        font-size: 11px;
    }
    .product-card .product-meta .value {
        font-size: 12px;
    }
    .product-card .product-footer {
        flex-wrap: wrap;
        gap: 4px;
        padding-top: 6px;
        margin-top: 6px;
    }
    .product-card .product-footer .price {
        font-size: 14px;
    }
    .product-card .product-footer .rating-small {
        font-size: 13px;
    }
}

@media (max-width: 480px) {
    .product-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .product-card .product-meta {
        grid-template-columns: 1fr 1fr;
    }
}


/* ============================================================
   6. 评测详情页 (Single Review)
   ============================================================ */

@media (max-width: 768px) {
    .review-detail {
        margin: 16px 0 32px;
    }
    .review-detail .back-link {
        font-size: 13px;
        margin-bottom: 12px;
    }

    /* Hero 区域：改为纵向布局 */
    .detail-hero-full,
    .detail-hero {
        flex-direction: column;
        padding: 16px 18px;
        gap: 16px;
        border-radius: 10px;
    }
    .detail-hero-full .image-area,
    .detail-hero .image-area {
        min-height: 160px;
        font-size: 48px;
        width: 100%;
        border-radius: 8px;
    }
    .detail-hero-full .info-area h1,
    .detail-hero .info-area h1 {
        font-size: 22px;
    }
    .detail-hero-full .info-area .subtitle,
    .detail-hero .info-area .subtitle {
        font-size: 14px;
    }

    /* 评分卡片 */
    .score-box-full {
        flex-direction: column;
        align-items: flex-start;
        padding: 14px 18px;
        gap: 6px;
        border-radius: 8px;
    }
    .score-box-full .big-number {
        font-size: 34px;
    }
    .score-box-full .score-detail {
        font-size: 13px;
    }

    /* 参数网格 */
    .param-grid-full,
    .param-grid {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        margin: 12px 0;
    }
    .param-grid-full .param-cell,
    .param-grid .param-cell {
        font-size: 13px;
        padding: 8px 12px;
        border-radius: 6px;
    }

    /* 标签行 */
    .detail-hero-full .flex-wrap,
    .detail-hero .flex-wrap {
        gap: 6px;
    }
    .detail-hero-full .badge-gold,
    .detail-hero .badge-gold {
        font-size: 10px;
        padding: 2px 10px;
    }

    /* 实拍样张画廊 */
    .gallery-section {
        margin: 20px 0;
    }
    .gallery-section h3 {
        font-size: 18px;
    }
    .gallery-grid {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }
    .gallery-item .g-img {
        height: 120px;
        font-size: 28px;
    }
    .gallery-item .g-caption {
        font-size: 12px;
        padding: 8px 10px 10px;
    }

    /* 文章正文 */
    .article-body {
        padding: 16px 14px;
        border-radius: 10px;
    }
    .article-body .article-lead {
        font-size: 16px;
        padding-bottom: 14px;
        margin-bottom: 16px;
    }
    .article-body h3 {
        font-size: 18px;
        margin: 20px 0 8px;
    }
    .article-body p {
        font-size: 14px;
        line-height: 1.8;
        margin-bottom: 12px;
    }
    .article-body ul,
    .article-body ol {
        font-size: 14px;
        padding-left: 20px;
        margin-bottom: 12px;
    }

    /* 优缺点列表 */
    .pros-cons-full,
    .pros-cons-box {
        grid-template-columns: 1fr;
        gap: 12px;
        margin: 14px 0;
    }
    .pros-cons-full .pros,
    .pros-cons-full .cons,
    .pros-cons-box .pros,
    .pros-cons-box .cons {
        padding: 12px 16px;
        border-radius: 6px;
    }
    .pros-cons-full h4,
    .pros-cons-box h4 {
        font-size: 14px;
    }
    .pros-cons-full ul,
    .pros-cons-box ul {
        font-size: 13px;
    }

    /* 购买按钮 */
    .article-body .btn-buy {
        width: 100%;
        text-align: center;
        padding: 14px 20px;
        font-size: 15px;
        border-radius: 10px;
    }
    .article-body .flex-wrap {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }
    .article-body .flex-wrap .text-muted {
        font-size: 12px;
        text-align: center;
    }
    .article-body .pull-quote {
        font-size: 15px;
        padding: 10px 16px;
        margin: 14px 0;
    }
    .article-body .tip-box,
    .article-body .warning-box {
        padding: 12px 16px;
        border-radius: 6px;
        margin: 12px 0;
    }
    .article-body .tip-box p,
    .article-body .warning-box p {
        font-size: 13px;
    }
    .article-body .key-takeaways {
        padding: 14px 16px;
        border-radius: 8px;
        margin: 16px 0 12px;
    }
    .article-body .key-takeaways ul {
        font-size: 13px;
    }

    /* 相关文章 */
    .related-articles {
        margin-top: 20px;
        padding-top: 16px;
    }
    .related-articles h4 {
        font-size: 15px;
    }
    .related-articles .related-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .related-articles .related-item {
        padding: 10px 14px;
    }
    .related-articles .related-item h5 {
        font-size: 13px;
    }

    /* 文章头部 */
    .article-header h1 {
        font-size: 24px;
    }
    .article-header .article-meta {
        font-size: 13px;
        gap: 10px;
    }
    .article-header .back-link {
        font-size: 13px;
    }
}

/* 评测详情 · 超小屏 (<=480px) */
@media (max-width: 480px) {
    .param-grid-full,
    .param-grid {
        grid-template-columns: 1fr;
        gap: 6px;
    }
    .gallery-grid {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .detail-hero-full h1,
    .detail-hero h1 {
        font-size: 20px;
    }
    .article-body .btn-buy {
        font-size: 14px;
        padding: 12px 16px;
    }
}


/* ============================================================
   7. 对比工具 (独立页)
   ============================================================ */

@media (max-width: 768px) {
    .compare-full {
        padding: 12px 10px;
        border-radius: 10px;
    }

    /* 头部 */
    .compare-full .compare-header {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
        margin-bottom: 14px;
    }
    .compare-full .compare-header h2 {
        font-size: 20px;
        text-align: center;
    }
    .compare-full .compare-header .add-box {
        flex-direction: row;
        padding: 4px 4px 4px 14px;
        border-radius: 10px;
        width: 100%;
    }
    .compare-full .compare-header .add-box input {
        width: 100%;
        font-size: 15px;
        padding: 8px 4px;
        min-height: 40px;
    }
    .compare-full .compare-header .add-box button {
        padding: 8px 16px;
        font-size: 13px;
        border-radius: 8px;
        min-height: 40px;
        white-space: nowrap;
    }

    /* 对比表格：横向滚动 */
    .compare-full-grid {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        border-radius: 8px;
        margin: 0 -4px;
    }
    .compare-full-grid .cell {
        font-size: 13px;
        padding: 8px 10px;
        min-width: 80px;
    }
    .compare-full-grid .cell-product .pname {
        font-size: 13px;
    }
    .compare-full-grid .cell-product .pbrand {
        font-size: 11px;
    }
    .compare-full-grid .cell-header {
        font-size: 11px;
    }
    .compare-full-grid .cell-label {
        font-size: 12px;
        min-width: 70px;
    }

    /* 滚动提示 */
    .compare-full::after {
        content: '👆 左右滑动查看完整对比';
        display: block;
        text-align: center;
        font-size: 12px;
        color: var(--text-muted);
        padding: 8px 0 4px;
    }

    /* 底部按钮 */
    .compare-full .flex-wrap {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        margin-top: 16px;
    }
    .compare-full .flex-wrap .btn-buy {
        width: 100%;
        text-align: center;
        padding: 12px 20px;
        font-size: 14px;
        border-radius: 8px;
        justify-content: center;
    }
    .compare-full .flex-wrap .btn-buy:last-child {
        margin-top: 0;
    }

    /* 选购建议框 */
    .compare-full + .bg-card {
        padding: 14px 16px;
        margin-top: 14px;
        border-radius: 10px;
    }
    .compare-full + .bg-card p {
        font-size: 13px;
    }

    /* 对比工具预览块（首页内嵌）已有单独适配，见第 4 部分 */
}

/* 对比工具 · 超小屏 (<=480px) */
@media (max-width: 480px) {
    .compare-full .compare-header .add-box input {
        font-size: 14px;
    }
    .compare-full-grid .cell {
        font-size: 12px;
        padding: 6px 8px;
        min-width: 70px;
    }
    .compare-full-grid .cell-product .pname {
        font-size: 12px;
    }
    .compare-full-grid .cell-label {
        font-size: 11px;
        min-width: 60px;
    }
    .compare-full .flex-wrap .btn-buy {
        font-size: 13px;
        padding: 10px 16px;
    }
}


/* ============================================================
   8. 横向对比评测文章 (Comparison Article)
   ============================================================ */

@media (max-width: 768px) {
    .comparison-article .back-link {
        font-size: 13px;
        margin: 12px 0;
    }
    .comparison-header {
        padding: 16px 18px;
        border-radius: 10px;
        margin-bottom: 16px;
    }
    .comparison-header h1 {
        font-size: 22px;
    }
    .comparison-header .sub {
        font-size: 14px;
    }
    .comparison-header .comp-tags {
        gap: 6px;
        margin-top: 8px;
    }
    .comparison-header .comp-tags .badge-gold {
        font-size: 10px;
        padding: 2px 10px;
    }

    /* 对比表格：横向滚动 */
    .comparison-table-wrap {
        border-radius: 8px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        margin-bottom: 16px;
    }
    .comparison-table-wrap table {
        min-width: 520px;
        font-size: 13px;
    }
    .comparison-table-wrap th,
    .comparison-table-wrap td {
        padding: 8px 12px;
        white-space: nowrap;
        font-size: 12px;
    }
    .comparison-table-wrap .product-name-cell {
        font-size: 13px;
    }
    .comparison-table-wrap .product-name-cell .sub-brand {
        font-size: 11px;
    }
    .comparison-table-wrap th:first-child,
    .comparison-table-wrap td:first-child {
        min-width: 80px;
        font-size: 12px;
    }

    /* 结论区 */
    .comparison-verdict {
        padding: 16px 18px;
        border-radius: 10px;
    }
    .comparison-verdict h3 {
        font-size: 17px;
    }
    .comparison-verdict .verdict-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .comparison-verdict .verdict-item {
        padding: 12px 16px;
        border-radius: 6px;
    }
    .comparison-verdict .verdict-item h4 {
        font-size: 14px;
    }
    .comparison-verdict .verdict-item p {
        font-size: 13px;
    }
}


/* ============================================================
   9. 选购指南 (Buying Guide)
   ============================================================ */

@media (max-width: 768px) {
    /* 列表页 */
    .guide-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }
    .guide-card {
        padding: 16px 18px;
        border-radius: 10px;
    }
    .guide-card h4 {
        font-size: 16px;
    }
    .guide-card p {
        font-size: 13px;
    }
    .guide-card .g-meta {
        font-size: 12px;
        gap: 8px;
        flex-wrap: wrap;
    }
    .guide-card .g-tag {
        font-size: 10px;
    }

    /* 详情页 */
    .guide-detail {
        padding: 16px 14px;
        border-radius: 10px;
    }
    .guide-detail h1 {
        font-size: 22px;
    }
    .guide-detail .guide-sub {
        font-size: 14px;
    }
    .guide-detail .guide-toc {
        padding: 12px 16px;
        border-radius: 6px;
        margin: 12px 0 16px;
    }
    .guide-detail .guide-toc ul {
        font-size: 13px;
    }
    .guide-detail .guide-section h3 {
        font-size: 18px;
        margin: 16px 0 6px;
    }
    .guide-detail .guide-section p {
        font-size: 14px;
    }
    .guide-detail .guide-section .rec-card {
        padding: 12px 16px;
        border-radius: 6px;
        margin: 8px 0;
    }
    .guide-detail .guide-section .rec-card h4 {
        font-size: 15px;
    }
    .guide-detail .guide-section .rec-card p {
        font-size: 13px;
    }
}


/* ============================================================
   10. 知识库 (Knowledge Base)
   ============================================================ */

@media (max-width: 768px) {
    /* 列表页 */
    .knowledge-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }
    .knowledge-card {
        padding: 16px 18px;
        border-radius: 10px;
    }
    .knowledge-card .k-tag {
        font-size: 10px;
    }
    .knowledge-card h4 {
        font-size: 16px;
    }
    .knowledge-card p {
        font-size: 13px;
    }
    .knowledge-card .k-meta {
        font-size: 12px;
        gap: 8px;
        flex-wrap: wrap;
    }

    /* 深度文章（见第 6 部分，已覆盖） */
}


/* ============================================================
   11. 品牌专区 (Brand Page)
   ============================================================ */

@media (max-width: 768px) {
    /* 品牌汇总页 */
    .brand-grid {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
    }
    .brand-card {
        padding: 16px 12px;
        border-radius: 10px;
    }
    .brand-card .brand-icon {
        font-size: 32px;
    }
    .brand-card h4 {
        font-size: 16px;
    }
    .brand-card .brand-count {
        font-size: 13px;
    }
    .brand-card .brand-tags span {
        font-size: 10px;
        padding: 2px 10px;
    }

    /* 品牌单页 (Godox 示例) */
    .brand-hero {
        padding: 20px 18px;
        flex-direction: column;
        text-align: center;
        gap: 16px;
        border-radius: 10px;
        margin: 16px 0 20px;
    }
    .brand-hero .brand-icon-large {
        font-size: 40px;
        width: auto;
    }
    .brand-hero .brand-info h1 {
        font-size: 26px;
    }
    .brand-hero .brand-info .brand-tagline {
        font-size: 14px;
    }
    .brand-hero .brand-info .brand-stats {
        gap: 12px;
        font-size: 13px;
        justify-content: center;
    }
    .brand-hero .brand-info .brand-tags-wrap {
        justify-content: center;
    }

    .brand-product-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .brand-product-card {
        padding: 14px 16px;
        border-radius: 10px;
    }
    .brand-product-card .bp-icon {
        font-size: 22px;
    }
    .brand-product-card h4 {
        font-size: 15px;
    }
    .brand-product-card .bp-meta {
        font-size: 12px;
    }
    .brand-product-card .bp-params {
        font-size: 12px;
        grid-template-columns: 1fr 1fr;
        gap: 2px 12px;
        padding: 6px 0 2px;
    }
    .brand-product-card .bp-footer .price {
        font-size: 14px;
    }
    .brand-product-card .bp-footer .rating {
        font-size: 13px;
    }

    .brand-hero + .section-head {
        margin: 20px 0 14px;
    }
    .brand-hero + .section-head h2 {
        font-size: 20px;
    }
}

@media (max-width: 480px) {
    .brand-grid {
        grid-template-columns: 1fr;
    }
    .brand-product-card .bp-params {
        grid-template-columns: 1fr 1fr;
    }
}


/* ============================================================
   12. 灯光术语表 (Glossary)
   ============================================================ */

@media (max-width: 768px) {
    .glossary-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .glossary-item {
        padding: 14px 18px;
        border-radius: 10px;
    }
    .glossary-item .term {
        font-size: 16px;
    }
    .glossary-item .term-en {
        font-size: 12px;
        display: block;
        margin-left: 0;
    }
    .glossary-item .definition {
        font-size: 13px;
    }
    .glossary-item .see-also {
        font-size: 12px;
    }
}


/* ============================================================
   13. 关于我们 / 中立性承诺 (About)
   ============================================================ */

@media (max-width: 768px) {
    .about-hero {
        padding: 20px 18px;
        border-radius: 10px;
        margin: 16px 0;
    }
    .about-hero h1 {
        font-size: 26px;
    }
    .about-hero .lead {
        font-size: 16px;
    }

    .pledge-grid {
        grid-template-columns: 1fr;
        gap: 12px;
        margin: 16px 0;
    }
    .pledge-item {
        padding: 16px 18px;
        border-radius: 10px;
    }
    .pledge-item .icon-large {
        font-size: 22px;
    }
    .pledge-item h4 {
        font-size: 16px;
    }
    .pledge-item p {
        font-size: 13px;
    }

    .team-grid {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
        margin: 12px 0 4px;
    }
    .team-member {
        padding: 14px 12px;
        border-radius: 10px;
    }
    .team-member .avatar {
        width: 64px;
        height: 64px;
        font-size: 24px;
    }
    .team-member h4 {
        font-size: 14px;
    }
    .team-member .role {
        font-size: 12px;
    }
    .team-member .bio {
        font-size: 12px;
    }

    .contact-box {
        padding: 16px 18px;
        border-radius: 10px;
        margin: 16px 0 8px;
    }
    .contact-box .email {
        font-size: 15px;
        word-break: break-all;
    }
}

@media (max-width: 480px) {
    .team-grid {
        grid-template-columns: 1fr;
    }
}


/* ============================================================
   14. 联系我们 (Contact)
   ============================================================ */

@media (max-width: 768px) {
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .contact-form-wrap {
        padding: 18px 16px;
        border-radius: 10px;
    }
    .contact-form-wrap h3 {
        font-size: 18px;
        margin-bottom: 12px;
    }
    .contact-form-wrap .form-group {
        margin-bottom: 12px;
    }
    .contact-form-wrap .form-group label {
        font-size: 13px;
    }
    .contact-form-wrap .form-group input,
    .contact-form-wrap .form-group select,
    .contact-form-wrap .form-group textarea {
        padding: 10px 14px;
        font-size: 15px; /* 防止 iOS 缩放 */
        border-radius: 8px;
        min-height: 44px;
    }
    .contact-form-wrap .form-group textarea {
        min-height: 100px;
    }
    .contact-form-wrap .btn-submit {
        width: 100%;
        padding: 14px;
        font-size: 15px;
        border-radius: 10px;
        min-height: 48px;
    }

    .contact-info-wrap {
        gap: 12px;
    }
    .contact-info-wrap .ci-card {
        padding: 16px 18px;
        border-radius: 10px;
    }
    .contact-info-wrap .ci-card .ci-icon {
        font-size: 22px;
    }
    .contact-info-wrap .ci-card h4 {
        font-size: 15px;
    }
    .contact-info-wrap .ci-card p {
        font-size: 13px;
    }
    .contact-info-wrap .ci-card .ci-detail {
        font-size: 14px;
        word-break: break-all;
    }
}


/* ============================================================
   15. 搜索页 (Search)
   ============================================================ */

@media (max-width: 768px) {
    .search-page {
        padding: 24px 16px;
        border-radius: 10px;
        margin: 16px 0;
    }
    .search-page .search-icon-top {
        font-size: 36px;
        margin-bottom: 8px;
    }
    .search-page h1 {
        font-size: 24px;
    }
    .search-page .sub {
        font-size: 14px;
        margin-bottom: 16px;
    }

    .search-box-wrap {
        flex-direction: column;
        border-radius: 10px;
        max-width: 100%;
        margin: 0 auto 16px;
    }
    .search-box-wrap input {
        padding: 14px 16px;
        font-size: 16px; /* 防止 iOS 缩放 */
        text-align: center;
        border-radius: 10px 10px 0 0;
        min-height: 48px;
    }
    .search-box-wrap input::placeholder {
        font-size: 14px;
    }
    .search-box-wrap button {
        padding: 14px 16px;
        border-radius: 0 0 10px 10px;
        font-size: 14px;
        min-height: 48px;
        width: 100%;
    }

    .search-results .result-count {
        font-size: 13px;
        padding-bottom: 10px;
        margin-bottom: 12px;
    }
    .search-result-item {
        padding: 12px 14px;
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
        border-radius: 8px;
        margin-bottom: 8px;
    }
    .search-result-item .result-info h4 {
        font-size: 14px;
    }
    .search-result-item .result-info .excerpt {
        font-size: 12px;
        -webkit-line-clamp: 2;
    }
    .search-result-item .result-type {
        font-size: 11px;
        padding: 2px 12px;
        align-self: flex-start;
    }

    .no-results {
        padding: 24px 16px;
    }
    .no-results .empty-icon {
        font-size: 40px;
    }
    .no-results h3 {
        font-size: 18px;
    }
    .no-results p {
        font-size: 14px;
    }
}


/* ============================================================
   16. 404 错误页 (404)
   ============================================================ */

@media (max-width: 768px) {
    .error-404 {
        padding: 32px 16px;
        border-radius: 10px;
        margin: 16px 0 8px;
    }
    .error-404 .error-code {
        font-size: 52px;
        letter-spacing: -2px;
    }
    .error-404 .big-icon {
        font-size: 56px;
        margin-bottom: 12px;
    }
    .error-404 h1 {
        font-size: 22px;
    }
    .error-404 .sub-text {
        font-size: 15px;
        margin-bottom: 20px;
    }

    .error-404 .search-box-404 {
        flex-direction: column;
        border-radius: 10px;
        max-width: 100%;
        margin: 0 auto 16px;
    }
    .error-404 .search-box-404 input {
        padding: 14px 16px;
        font-size: 16px; /* 防止 iOS 缩放 */
        text-align: center;
        border-radius: 10px 10px 0 0;
        min-height: 48px;
    }
    .error-404 .search-box-404 input::placeholder {
        font-size: 14px;
    }
    .error-404 .search-box-404 button {
        padding: 14px 16px;
        border-radius: 0 0 10px 10px;
        font-size: 14px;
        min-height: 48px;
        width: 100%;
    }

    .error-404 .action-row {
        flex-direction: column;
        align-items: center;
        gap: 10px;
        margin-top: 4px;
    }
    .error-404 .action-row .btn-home,
    .error-404 .action-row .btn-outline {
        width: 100%;
        text-align: center;
        padding: 12px 20px;
        font-size: 14px;
        border-radius: 10px;
        min-height: 44px;
    }

    .error-404 .quick-links {
        gap: 12px 20px;
        padding-top: 16px;
        margin-top: 20px;
    }
    .error-404 .quick-links a {
        font-size: 13px;
    }
    .error-404 .quick-links a i {
        width: 16px;
    }
}


/* ============================================================
   17. 维护模式页 (Maintenance)
   ============================================================ */

@media (max-width: 768px) {
    .maintenance-wrapper {
        padding: 24px 16px;
        border-radius: 10px;
        margin: 16px 0;
    }
    .maintenance-wrapper .logo {
        font-size: 22px;
    }
    .maintenance-wrapper .logo i {
        font-size: 26px;
    }
    .maintenance-wrapper .maintenance-icon {
        font-size: 52px;
        margin-bottom: 12px;
    }
    .maintenance-wrapper h1 {
        font-size: 24px;
    }
    .maintenance-wrapper .sub-text {
        font-size: 15px;
        margin-bottom: 16px;
    }
    .maintenance-wrapper .eta {
        font-size: 13px;
    }

    .maintenance-wrapper .progress-section {
        padding: 14px 16px;
        border-radius: 8px;
        margin: 14px 0 16px;
    }
    .maintenance-wrapper .progress-section .progress-item {
        font-size: 13px;
        gap: 10px;
        flex-wrap: wrap;
        padding: 4px 0;
    }
    .maintenance-wrapper .progress-section .progress-item .status-time {
        width: 100%;
        padding-left: 34px;
        font-size: 12px;
    }
    .maintenance-wrapper .progress-section .progress-item .status-icon {
        width: 20px;
        font-size: 14px;
    }

    .maintenance-wrapper .notify-section .notify-box {
        flex-direction: column;
        border-radius: 10px;
        max-width: 100%;
    }
    .maintenance-wrapper .notify-section .notify-box input {
        padding: 14px 16px;
        font-size: 16px; /* 防止 iOS 缩放 */
        text-align: center;
        border-radius: 10px 10px 0 0;
        min-height: 48px;
    }
    .maintenance-wrapper .notify-section .notify-box input::placeholder {
        font-size: 14px;
    }
    .maintenance-wrapper .notify-section .notify-box button {
        padding: 14px 16px;
        border-radius: 0 0 10px 10px;
        font-size: 14px;
        min-height: 48px;
        width: 100%;
    }
    .maintenance-wrapper .notify-section .notify-hint {
        font-size: 11px;
    }

    .maintenance-wrapper .social-links {
        gap: 16px;
        padding-top: 16px;
        margin-top: 20px;
    }
    .maintenance-wrapper .social-links a {
        font-size: 20px;
    }
    .maintenance-wrapper .contact-line {
        font-size: 13px;
    }

    .footer-minimal {
        font-size: 12px;
        padding: 16px 0 20px;
    }
}

@media (max-width: 480px) {
    .maintenance-wrapper h1 {
        font-size: 20px;
    }
    .maintenance-wrapper .sub-text {
        font-size: 14px;
    }
    .maintenance-wrapper .progress-section .progress-item {
        font-size: 12px;
    }
}


/* ============================================================
   18. 隐私政策 / 使用条款 (Legal)
   ============================================================ */

@media (max-width: 768px) {
    .legal-page {
        padding: 20px 16px;
        border-radius: 10px;
        margin: 16px 0;
    }
    .legal-page h1 {
        font-size: 24px;
    }
    .legal-page h2 {
        font-size: 18px;
        margin: 20px 0 8px;
    }
    .legal-page p {
        font-size: 14px;
        margin-bottom: 10px;
    }
    .legal-page ul {
        font-size: 14px;
        padding-left: 20px;
        margin-bottom: 10px;
    }
    .legal-page .legal-date {
        font-size: 13px;
        margin-bottom: 16px;
    }
    .legal-page .highlight-box {
        padding: 12px 16px;
        border-radius: 6px;
        margin: 12px 0;
    }
    .legal-page .highlight-box p {
        font-size: 13px;
    }
    .legal-page hr {
        margin: 20px 0;
    }
}


/* ============================================================
   19. 作者归档页 (Author Archive)
   ============================================================ */

@media (max-width: 1024px) {
    .author-layout {
        grid-template-columns: 1fr;
    }
    .sidebar {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }
}

@media (max-width: 768px) {
    .author-header {
        padding: 20px 18px;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 16px;
        border-radius: 10px;
        margin: 16px 0 20px;
    }
    .author-header .avatar {
        width: 80px;
        height: 80px;
        font-size: 34px;
    }
    .author-header .author-info h1 {
        font-size: 24px;
        justify-content: center;
        gap: 8px;
    }
    .author-header .author-info h1 .badge {
        font-size: 12px;
        padding: 2px 12px;
    }
    .author-header .author-info .title {
        font-size: 14px;
    }
    .author-header .author-info .bio {
        font-size: 14px;
        max-width: 100%;
    }
    .author-header .author-info .stats {
        justify-content: center;
        gap: 16px;
        font-size: 13px;
    }
    .author-header .author-info .social-links {
        justify-content: center;
    }
    .author-header .author-info .social-links a {
        font-size: 16px;
    }

    .post-list .post-item {
        padding: 14px 16px;
        gap: 12px;
        border-radius: 10px;
    }
    .post-list .post-item .post-thumb {
        width: 60px;
        min-height: 60px;
        font-size: 20px;
        border-radius: 6px;
    }
    .post-list .post-item .post-content h3 {
        font-size: 15px;
    }
    .post-list .post-item .post-content .excerpt {
        font-size: 13px;
        -webkit-line-clamp: 2;
    }
    .post-list .post-item .post-meta {
        font-size: 12px;
        gap: 8px;
    }
    .post-list .post-item .post-footer {
        font-size: 12px;
        gap: 8px;
    }
    .post-list .post-item .post-footer .tag {
        font-size: 10px;
        padding: 2px 10px;
    }

    .sidebar {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .sidebar .widget {
        padding: 14px 16px;
        border-radius: 10px;
    }
    .sidebar .widget h4 {
        font-size: 14px;
        margin-bottom: 8px;
        padding-bottom: 6px;
    }
    .sidebar .widget ul li {
        font-size: 13px;
        padding: 3px 0;
    }
    .sidebar .widget .tag-cloud a {
        font-size: 11px;
        padding: 3px 12px;
    }
}

@media (max-width: 480px) {
    .author-header .avatar {
        width: 64px;
        height: 64px;
        font-size: 28px;
    }
    .post-list .post-item {
        flex-direction: column;
        align-items: stretch;
        padding: 12px 14px;
    }
    .post-list .post-item .post-thumb {
        width: 100%;
        min-height: 80px;
        font-size: 28px;
    }
}


/* ============================================================
   20. 分类/标签归档页 (Category/Tag Archive)
   ============================================================ */

@media (max-width: 1024px) {
    .archive-layout {
        grid-template-columns: 1fr;
    }
    .sidebar {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }
}

@media (max-width: 768px) {
    .archive-header {
        padding: 18px 18px;
        border-radius: 10px;
        margin: 16px 0 20px;
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    .archive-header .archive-info h1 {
        font-size: 22px;
        flex-wrap: wrap;
    }
    .archive-header .archive-info h1 .count {
        font-size: 14px;
        display: block;
        margin-top: 2px;
    }
    .archive-header .archive-info .description {
        font-size: 14px;
    }
    .archive-header .archive-tags {
        width: 100%;
        gap: 6px;
    }
    .archive-header .archive-tags .tag-item {
        font-size: 12px;
        padding: 4px 12px;
    }

    .post-grid .post-item {
        padding: 14px 16px;
        gap: 12px;
        border-radius: 10px;
    }
    .post-grid .post-item .post-thumb {
        width: 60px;
        min-height: 60px;
        font-size: 20px;
        border-radius: 6px;
    }
    .post-grid .post-item .post-content h3 {
        font-size: 15px;
    }
    .post-grid .post-item .post-content .excerpt {
        font-size: 13px;
        -webkit-line-clamp: 2;
    }
    .post-grid .post-item .post-meta {
        font-size: 12px;
        gap: 8px;
    }
    .post-grid .post-item .post-footer {
        font-size: 12px;
        gap: 8px;
    }
    .post-grid .post-item .post-footer .tag {
        font-size: 10px;
        padding: 2px 10px;
    }

    .sidebar {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .sidebar .widget {
        padding: 14px 16px;
        border-radius: 10px;
    }
    .sidebar .widget h4 {
        font-size: 14px;
        margin-bottom: 8px;
        padding-bottom: 6px;
    }
    .sidebar .widget ul li {
        font-size: 13px;
        padding: 3px 0;
    }
    .sidebar .widget .tag-cloud a {
        font-size: 11px;
        padding: 3px 12px;
    }
}

@media (max-width: 480px) {
    .archive-header .archive-info h1 {
        font-size: 20px;
    }
    .post-grid .post-item {
        flex-direction: column;
        align-items: stretch;
        padding: 12px 14px;
    }
    .post-grid .post-item .post-thumb {
        width: 100%;
        min-height: 80px;
        font-size: 28px;
    }
}


/* ============================================================
   21. 页脚 (Footer)
   ============================================================ */

@media (max-width: 768px) {
    .site-footer {
        padding: 28px 0 20px;
        margin-top: 32px;
    }
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 20px;
        padding: 0 16px;
    }
    .footer-grid .logo {
        font-size: 20px;
    }
    .footer-grid p {
        font-size: 13px;
        max-width: 100%;
    }
    .footer-grid h4 {
        font-size: 13px;
    }
    .footer-grid a {
        font-size: 13px;
    }
    .footer-grid > div:first-child p {
        max-width: 100%;
    }
    .footer-bottom {
        padding: 16px 16px 0;
        font-size: 12px;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 6px;
    }
}

@media (max-width: 480px) {
    .footer-grid {
        grid-template-columns: 1fr;
        gap: 16px;
        text-align: center;
    }
    .footer-grid > div:first-child .logo {
        justify-content: center;
    }
    .footer-grid > div:first-child .flex-wrap {
        justify-content: center;
    }
    .footer-bottom {
        font-size: 11px;
    }
}


/* ============================================================
   22. 通用辅助类
   ============================================================ */

/* 移动端显示/隐藏工具 */
@media (min-width: 769px) {
    .mobile-only {
        display: none !important;
    }
}
@media (max-width: 768px) {
    .desktop-only {
        display: none !important;
    }
}

/* 移动端文字大小调整 */
@media (max-width: 768px) {
    .text-sm-mobile {
        font-size: 13px !important;
    }
    .text-base-mobile {
        font-size: 15px !important;
    }
    .text-lg-mobile {
        font-size: 18px !important;
    }
    .text-xl-mobile {
        font-size: 22px !important;
    }
}

/* 移动端全宽按钮 */
@media (max-width: 768px) {
    .btn-full-mobile {
        width: 100% !important;
        text-align: center !important;
        justify-content: center !important;
    }
}

/* 移动端间距 */
@media (max-width: 768px) {
    .gap-2-mobile {
        gap: 8px !important;
    }
    .gap-4-mobile {
        gap: 16px !important;
    }
    .p-2-mobile {
        padding: 8px !important;
    }
    .p-4-mobile {
        padding: 16px !important;
    }
    .mt-2-mobile {
        margin-top: 8px !important;
    }
    .mt-4-mobile {
        margin-top: 16px !important;
    }
    .mb-2-mobile {
        margin-bottom: 8px !important;
    }
    .mb-4-mobile {
        margin-bottom: 16px !important;
    }
}