@charset "UTF-8";

/* ===== FAQ页面手机端适配 (直接添加到此文件底部即可) ===== */
@media screen and (max-width: 768px) {
    /* 横幅区域调整 */
    .banner {
        height: 300px; /* 手机屏幕降低高度 */
    }
    
    .banner-content {
        padding: 0 15px;
    }
    
    .en-title {
        font-size: 18px;
    }
    
    .main-title {
        font-size: 48px; /* 大幅减小标题字号 */
        letter-spacing: 8px; /* 缩小字间距 */
        margin: 20px 0;
    }
    
    .product-subtitle {
        font-size: 16px;
    }
    
    .glow-line {
        width: 150px; /* 缩短装饰线条 */
    }
    
    /* FAQ问答卡片适配 */
    .qa-container {
        width: 100%; /* 改为100%宽度，自适应屏幕 */
        padding: 15px 15px 15px 60px; /* 调整内边距 */
        margin-top: 15px;
        box-sizing: border-box;
        min-height: auto;
    }
    
    /* 左侧问答案签调整 */
    .qa-tab {
        left: 10px;
        top: 15px;
        width: 35px;
        padding: 6px 0;
    }
    
    .qa-tab .char {
        font-size: 14px;
    }
    
    .qa-tab .number {
        font-size: 12px;
        margin: 0;
    }
    
    /* 问题文字 */
    .question {
        font-size: 16px; /* 缩小字号 */
        line-height: 1.4;
    }
    
    /* 答案文字 */
    .answer {
        font-size: 14px; /* 缩小字号 */
        line-height: 1.5;
        letter-spacing: 0.3px;
    }
    
    /* 分割线 */
    .divider {
        margin: 10px 0;
    }
    
    /* 重要提示和科研参考卡片 */
    .notice-card {
        width: 100%; /* 自适应宽度 */
        padding: 25px 15px; /* 缩小内边距 */
        margin-top: 15px;
        box-sizing: border-box;
    }
    
    .notice-card h2 {
        font-size: 20px; /* 缩小标题 */
        letter-spacing: 2px;
    }
    
    .sub-header {
        font-size: 12px;
        margin-bottom: 20px;
    }
    
    /* 红色列表 */
    .red-list li {
        font-size: 14px; /* 缩小文字 */
        margin-bottom: 8px;
        line-height: 1.4;
    }
    
    .red-list li span {
        margin-right: 5px;
    }
    
    /* 科研参考中文部分 */
    .chinese-ref {
        font-size: 14px;
        line-height: 1.5;
        margin-bottom: 20px;
    }
    
    /* 科研参考英文部分 */
    .english-ref {
        font-size: 9px; /* 保持较小但可读 */
    }
    
    .english-ref p {
        margin-bottom: 10px;
    }
    
    /* 居中对齐容器调整 */
    .center {
        padding: 0 10px;
        box-sizing: border-box;
    }
    
    .container {
        padding: 0 10px;
        width: 100%;
        box-sizing: border-box;
    }
    
    .row {
        margin: 0;
    }
}

/* ===== 超小屏手机 (max-width: 480px) 进一步优化 ===== */
@media screen and (max-width: 480px) {
    .main-title {
        font-size: 36px;
        letter-spacing: 5px;
        margin: 15px 0;
    }
    
    .en-title {
        font-size: 16px;
    }
    
    .product-subtitle {
        font-size: 14px;
    }
    
    .qa-container {
        padding: 12px 12px 12px 50px;
    }
    
    .qa-tab {
        left: 8px;
        top: 12px;
        width: 30px;
    }
    
    .qa-tab .char {
        font-size: 12px;
    }
    
    .qa-tab .number {
        font-size: 10px;
    }
    
    .question {
        font-size: 15px;
    }
    
    .answer {
        font-size: 13px;
    }
    
    .notice-card h2 {
        font-size: 18px;
    }
    
    .red-list li {
        font-size: 13px;
    }
    
    .chinese-ref {
        font-size: 13px;
    }
}

/* ===== 横屏优化 (当屏幕高度较小时) ===== */
@media screen and (max-height: 500px) and (orientation: landscape) {
    .banner {
        height: 200px;
    }
    
    .main-title {
        font-size: 30px;
        margin: 10px 0;
    }
    
    .banner-content {
        padding: 10px;
    }
}