/* 基础样式 */
*{box-sizing:border-box;margin:0;padding:0}
html,body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;color:#333;background:#fafbfc}

/* 顶部导航 */
.header{background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.05);position:sticky;top:0;z-index:100}
.header-container{max-width:980px;margin:0 auto;padding:0 20px;display:flex;align-items:center;justify-content:space-between;height:70px}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;color:#333;font-weight:600;font-size:16px}
.logo img{width:40px;height:40px}
.nav{display:flex;gap:30px}
.nav a{text-decoration:none;color:#666;font-size:14px;transition:color .3s}
.nav a:hover{color:#2563eb}

/* 主内容 */
.main{max-width:980px;margin:0 auto;padding:40px 20px}

/* 各板块顶部间距（防止被导航遮挡） */
.notice-section{margin-bottom:50px;scroll-margin-top:90px}
.products-section{scroll-margin-top:90px}
.steps-section{scroll-margin-top:90px}
.faq-section{scroll-margin-top:90px}

/* 公告块 */
.notice-section{margin-bottom:50px}
.notice-box{background:#fef3c7;border-left:4px solid #f59e0b;padding:16px;border-radius:8px;display:flex;gap:12px}
.notice-icon{font-weight:bold;color:#d97706;font-size:18px;flex-shrink:0}
.notice-box p{color:#78350f;font-size:14px;line-height:1.5}

/* 产品网格 */
.products-section{margin-bottom:60px}
.section-header{margin-bottom:30px}
.section-header h2{font-size:28px;font-weight:700;color:#111}

/* 产品列表 */
.products-list{display:flex;flex-direction:column;gap:40px}
.product-group{display:flex;flex-direction:column;gap:12px}
.group-title{font-size:18px;font-weight:700;color:#111;padding:16px 0;border-bottom:2px solid #f0f0f0}

/* 产品表格 */
.product-table{border:1px solid #e5e7eb;border-radius:8px;overflow:hidden}
.table-header{display:grid;grid-template-columns:1fr 260px;background:#f9fafb;padding:16px;font-weight:600;font-size:14px;color:#666;border-bottom:1px solid #e5e7eb;gap:16px}
.table-row{display:grid;grid-template-columns:1fr 260px;align-items:center;padding:16px;border-bottom:1px solid #f0f0f0;gap:16px;transition:background .2s}
.table-row:hover{background:#fafbfc}
.table-row:last-child{border-bottom:none}

.col-product{display:flex;align-items:center;gap:12px}
.product-thumb{width:48px;height:48px;border-radius:6px;object-fit:cover;flex-shrink:0}
.product-info h4{font-size:14px;font-weight:500;color:#333;line-height:1.4;word-break:break-word}
.product-link{color:inherit;text-decoration:none}
.product-link:hover{text-decoration:underline}
.col-meta{display:flex;align-items:center;justify-content:flex-end;gap:16px;font-size:14px}
.meta-price{font-weight:700;color:#2563eb;font-size:16px}
.meta-stock{color:#666}

.btn-buy{background:#fbbf24;border:none;padding:8px 16px;border-radius:4px;font-size:13px;font-weight:600;cursor:pointer;color:#111;transition:background .3s;white-space:nowrap}
.btn-buy:hover{background:#f59e0b}
.btn-buy:active{transform:scale(.98)}

/* 购买步骤 */
.steps-section{margin-bottom:60px;background:#f0f9ff;padding:40px 20px;border-radius:12px}
.steps-container{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:30px}
.step{text-align:center}
.step-number{display:inline-block;width:50px;height:50px;background:#2563eb;color:#fff;font-size:20px;font-weight:700;border-radius:50%;line-height:50px;margin-bottom:12px}
.step h4{font-size:16px;margin-bottom:8px;color:#1e40af}
.step p{font-size:13px;color:#666;line-height:1.6}

/* 关于售后 */
.aftercare-section{margin-bottom:60px;scroll-margin-top:90px}
.aftercare-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:30px}
.aftercare-item{background:#fff;padding:24px;border-radius:12px;text-align:center;border:1px solid #e5e7eb;transition:box-shadow .3s,transform .3s}
.aftercare-item:hover{box-shadow:0 8px 16px rgba(0,0,0,.1);transform:translateY(-2px)}
.aftercare-icon{font-size:40px;margin-bottom:12px;display:block}
.aftercare-item h4{font-size:16px;font-weight:600;margin-bottom:8px;color:#111}
.aftercare-item p{font-size:13px;color:#666;line-height:1.6}

/* 常见问题 */
.faq-section{margin-bottom:40px}
.faq-list{margin-top:24px}
.faq-item{margin-bottom:12px}
.faq-item summary{background:#fff;padding:16px;border-radius:8px;cursor:pointer;font-weight:500;font-size:14px;transition:background .3s;border:1px solid #e5e7eb}
.faq-item summary:hover{background:#f9fafb}
.faq-item[open] summary{background:#f0f9ff;border-color:#93c5fd}
.faq-answer{padding:16px;background:#f9fafb;border-bottom-left-radius:8px;border-bottom-right-radius:8px;font-size:13px;line-height:1.6;color:#555}

/* 底部 */
.footer{background:#1f2937;color:#d1d5db;padding:30px 20px;text-align:center}
.footer-content p{font-size:13px;line-height:1.6}
.footer a{color:#93c5fd;text-decoration:none}
.footer a:hover{text-decoration:underline}

/* 模态框 */
.modal{position:fixed;inset:0;display:none;z-index:1000}
.modal[aria-hidden="false"]{display:block}
.modal-overlay{position:absolute;inset:0;background:rgba(0,0,0,.5)}
.modal-dialog{position:relative;background:#fff;margin:auto;max-width:500px;width:90%;border-radius:12px;box-shadow:0 20px 25px rgba(0,0,0,.15);top:50%;transform:translateY(-50%);padding:32px;z-index:10}
.modal-close{position:absolute;top:12px;right:12px;background:none;border:none;font-size:24px;cursor:pointer;color:#999}
.modal-close:hover{color:#333}
.modal-dialog h3{font-size:20px;margin-bottom:12px}
.modal-dialog p{color:#666;font-size:14px;margin-bottom:20px;line-height:1.6}
.btn-contact{display:inline-block;background:#2563eb;color:#fff;padding:12px 24px;border-radius:6px;text-decoration:none;font-size:14px;font-weight:600;transition:background .3s}
.btn-contact:hover{background:#1d4ed8}

/* 响应式 */
@media (max-width:640px){
  .header-container{height:60px}
  .nav{gap:16px;font-size:13px}
  .main{padding:24px 16px}
  .table-header{display:none}
  .table-row{display:flex;flex-direction:column;gap:0;padding:0;border-bottom:none;margin-bottom:16px;background:#fff;border-radius:12px;border:1px solid #e5e7eb;overflow:hidden}
  .col-product{
    flex-direction:row;
    align-items:center;
    padding:12px;
    gap:10px;
    border-bottom:1px solid #f0f0f0;
  }
  .product-thumb{
    width:56px;
    height:56px;
    border-radius:6px;
    object-fit:cover;
    flex-shrink:0;
  }
  .product-info{
    flex:1;
    min-width:0;
  }
  .product-info h4{font-size:13px}
  .col-meta{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    padding:10px 12px;
    gap:8px;
    flex-wrap:nowrap;
    width:100%;
  }
  .meta-price{font-size:15px}
  .meta-stock{font-size:13px}
  .col-meta .btn-buy{margin-left:auto}
  .btn-buy{padding:8px 14px;font-size:12px}
  .group-title{font-size:16px;padding:12px 0}
  .aftercare-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .aftercare-item{padding:16px}
  .aftercare-icon{font-size:32px;margin-bottom:8px}
  .aftercare-item h4{font-size:14px}
  .aftercare-item p{font-size:12px}
  .steps-container{grid-template-columns:repeat(2,1fr);gap:16px}
  .step-number{width:40px;height:40px;font-size:18px;line-height:40px;margin-bottom:8px}
  .step h4{font-size:13px}
  .step p{font-size:12px}
  .section-header h2{font-size:20px}
  .modal-dialog{width:95%}
}

/* 焦点状态 */
a:focus,button:focus{outline:2px solid #2563eb;outline-offset:2px}
