/* ============================================================
   page.css — 内页模块样式（about.html 引入）
   ============================================================ */
/* ============================================================
   About Us 内页公司介绍模块（电脑端 ≥1025px，about.html）
   ============================================================ */
@media (min-width:1025px){
  .single-main .company-about-wrap{
    display:flex;flex-wrap:nowrap;align-items:stretch;gap:40px;
  }
  .single-main .company-about-wrap .about-img{
    flex:0 0 calc(48% - 20px);width:calc(48% - 20px);padding:0;
  }
  .single-main .company-about-wrap .about-page-carousel{
    height:100%;
  }
  .single-main .company-about-wrap .about-img img{
    width:100%;height:auto;object-fit:contain;display:block;background:#FFF;
  }
  .single-main .company-about-wrap .about-info{
    flex:0 1 calc(52% - 20px);width:calc(52% - 20px);padding:0;min-width:0;
  }
  .single-main .about-info .home-title{
    color:#102A43;font-size:32px;line-height:1.25;margin:0 0 14px;text-transform:none;
  }
  .single-main .about-info .foot-name{
    color:#102A43;font-size:18px;font-weight:600;line-height:1.5;margin:0 0 16px;
  }
  .single-main .about-info .about-content{margin:0;}
  .single-main .about-info .about-content p{
    color:#3D5166;font-size:16px;line-height:1.75;margin:0 0 18px;
  }
  .single-main .about-info .about-content p:last-child{margin-bottom:0;}
  .single-main .abtn-row{display:flex;gap:16px;margin-top:24px;flex-wrap:wrap;}
  .single-main .abtn-row .abtn-primary,
  .single-main .abtn-row .abtn-ghost{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    height:44px;padding:0 22px;border-radius:4px;box-sizing:border-box;
    font:700 14px/1.2 Arial,sans-serif;text-decoration:none;white-space:nowrap;
    transition:background .2s ease,color .2s ease,border-color .2s ease;
  }
  .single-main .abtn-row .abtn-primary{background:#1261A6;color:#FFF;border:1px solid #1261A6;}
  .single-main .abtn-row .abtn-primary:hover{background:#0B4C87;border-color:#0B4C87;}
  .single-main .abtn-row .abtn-ghost{background:transparent;color:#1261A6;border:1px solid #1261A6;}
  .single-main .abtn-row .abtn-ghost:hover{background:#1261A6;color:#FFF;}
}

/* ============================================================
   About 内页左侧图片轮播（电脑端 ≥1025px；手机/平板显示原单图）
   复用 lazyload.js 的 aboutCarousel()（5s 自动/淡入淡出/圆点/箭头/暂停）
   ============================================================ */
.about-page-carousel{display:none;}
@media (min-width:1025px){
.single-main .company-about-wrap .about-page-single{display:none!important;}
.about-page-carousel{display:block;position:relative;background:#FFF;border:1px solid #E8EAED;border-radius:8px;overflow:hidden;}
.about-page-carousel .ac-slides{position:relative;flex:1 1 auto;min-height:0;}
.about-page-carousel .ac-slide{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:contain;padding:0;box-sizing:border-box;
  opacity:0;transition:opacity .4s ease;
}
.about-page-carousel .ac-slide.active{opacity:1;}
.about-page-carousel .ac-btn{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:32px;height:32px;border-radius:50%;border:1px solid #E2E5E9;
  background:rgba(255,255,255,.92);color:#1261A6;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 8px rgba(16,42,67,.12);
  opacity:0;transition:opacity .2s ease,background .2s ease;
}
.about-page-carousel:hover .ac-btn,
.about-page-carousel:focus-within .ac-btn{opacity:1;}
.about-page-carousel .ac-btn svg{width:16px;height:16px;}
.about-page-carousel .ac-btn:hover{background:#F0F5FA;}
.about-page-carousel .ac-prev{left:8px;}
.about-page-carousel .ac-next{right:8px;}
.about-page-carousel .ac-dots{
  position:absolute;left:0;right:0;bottom:10px;z-index:3;
  display:flex;justify-content:center;gap:6px;
}
.about-page-carousel .ac-dot{
  width:8px;height:8px;border-radius:50%;border:none;padding:0;
  background:#C9D3DC;cursor:pointer;transition:background .2s ease,transform .2s ease;
}
.about-page-carousel .ac-dot.active{background:#1261A6;transform:scale(1.15);}
.about-page-carousel .ac-toggle{
  position:absolute;top:10px;right:10px;z-index:3;
  width:30px;height:30px;border-radius:50%;border:1px solid #E2E5E9;
  background:rgba(255,255,255,.92);color:#102A43;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 8px rgba(16,42,67,.12);
  opacity:0;transition:opacity .2s ease;
}
.about-page-carousel:hover .ac-toggle,
.about-page-carousel:focus-within .ac-toggle{opacity:1;}
.about-page-carousel .ac-toggle svg{width:14px;height:14px;}
@media (prefers-reduced-motion:reduce){
  .about-page-carousel .ac-slide{transition:none;}
}
}

/* ============================================================
   About 内页 How to Order 模块（电脑端 ≥1025px，独立样式）
   选择器带 .op-grid li 前缀以覆盖 list.css 旧规则
   ============================================================ */
@media (min-width:1025px){
  .order-process{padding-bottom:8px;}
  .order-process .home-des{
    color:#1261A6;font:700 12px/1.2 Arial,sans-serif;letter-spacing:2px;
    margin:0 0 10px;text-transform:uppercase;
  }
  .order-process .home-title{
    color:#102A43;font:700 28px/1.25 Arial,sans-serif;margin:0 0 26px;text-transform:none;
  }
  .order-process .op-grid{
    display:grid;grid-template-columns:repeat(4,1fr);gap:24px;
    list-style:none;margin:0;padding:0;align-items:stretch;
  }
  .order-process .op-grid li.op-card{
    width:auto;background:#FFF;border:1px solid #E2E5E9;border-radius:8px;
    padding:28px 24px;box-sizing:border-box;margin-bottom:0;
    box-shadow:none;position:relative;
    display:flex;flex-direction:column;
    transition:border-color .2s ease,box-shadow .2s ease;
  }
  .order-process .op-grid li.op-card::before{display:none;}
  .order-process .op-grid li.op-card:hover{
    border-color:#1261A6;box-shadow:0 4px 12px rgba(18,97,166,.10);
  }
  .order-process .op-head{
    display:flex;align-items:flex-start;justify-content:space-between;
    margin-bottom:16px;
  }
  .order-process .op-num{
    color:#C9D3DC;font:700 20px/1 Arial,sans-serif;letter-spacing:1px;
  }
  .order-process .op-grid li.op-card .icon{width:40px;height:40px;margin:0;}
  .order-process .op-grid li.op-card .icon svg{width:40px;height:40px;display:block;}
  .order-process .op-grid li.op-card .title{
    color:#102A43;font:700 17px/1.35 Arial,sans-serif;margin:0 0 10px;padding:0;
  }
  .order-process .op-grid li.op-card .text{
    color:#475569;font:400 16px/1.7 Arial,sans-serif;margin:0;padding:0;
  }
  .order-process .op-grid li.op-card:hover .title{color:#102A43;}
}

/* ============================================================
   About Us 手机端排版（仅 ≤768px 生效；平板 769-1024 与电脑不变）
   - 上下排列：标题 → 图片 → 介绍文字（display:contents 重排，不改 HTML）
   - 左右留白 16px；正文 15.5px / 行高 1.6；段落间距收紧
   - 流程模块（How to Order）改竖排卡片，编号/标题/说明对齐
   - 启用现有图库：主图 + 缩略图（切换仍走原 aboutCarousel 逻辑）
   ============================================================ */
@media (max-width:767px), ((max-width:1024px) and (max-height:500px)){
  /* 留白 16-20px（仅本页作用域） */
  .single-main .l-wrap{padding-left:16px;padding-right:16px;}

  /* 一、公司介绍：标题 → 图片 → 文字 上下排列 */
  .single-main .company-about-wrap{
    display:flex;flex-direction:column;align-items:stretch;
    flex-wrap:nowrap;padding-bottom:0;
  }
  .single-main .company-about-wrap .about-info{display:contents;}
  .single-main .company-about-wrap .about-img{
    order:4;width:100%;padding:0;margin:14px 0 16px;
  }
  .single-main .about-info .home-des{order:1;display:none;}
  .single-main .about-info .home-title{
    order:2;color:#102A43;font:700 22px/1.3 Arial,sans-serif;
    margin:0 0 6px;text-transform:none;
  }
  .single-main .about-info .foot-name{
    order:3;color:#3D5166;font:600 15px/1.5 Arial,sans-serif;margin:0;
  }
  .single-main .about-info .about-content{order:5;margin:0;}
  .single-main .about-info .about-content p{
    color:#3D5166;font-size:15.5px;line-height:1.6;margin:0 0 12px;
  }
  .single-main .about-info .about-content p:last-child{margin-bottom:0;}
  .single-main .abtn-row{order:6;display:flex;flex-wrap:nowrap;gap:12px;margin-top:20px;}
  .single-main .abtn-row .abtn-primary,
  .single-main .abtn-row .abtn-ghost{
    flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:center;
    height:44px;padding:0 8px;border-radius:6px;box-sizing:border-box;
    font:700 13px/1.2 Arial,sans-serif;text-decoration:none;white-space:nowrap;
  }
  .single-main .abtn-row .abtn-primary{background:#1261A6;color:#FFF;border:1px solid #1261A6;}
  .single-main .abtn-row .abtn-ghost{background:transparent;color:#1261A6;border:1px solid #1261A6;}

  /* 图片：宽度 100%、水平居中、按比例完整显示（contain 不裁切不变形） */
  .single-main .company-about-wrap .about-img img{
    width:100%;height:auto;object-fit:contain;display:block;margin:0 auto;
    background:#FFF;
  }

  /* 三、启用现有图库：主图 + 缩略图，切换沿用原轮播 JS */
  .single-main .company-about-wrap .about-page-single{display:none!important;}
  .single-main .company-about-wrap .about-page-carousel{
    display:flex;flex-direction:column;width:100%;height:auto;
    background:#FFF;border:1px solid #E8EAED;border-radius:8px;overflow:hidden;
  }
  .single-main .company-about-wrap .about-page-carousel .ac-slides{
    position:relative;flex:1 1 auto;width:100%;aspect-ratio:4/3;min-height:0;
  }
  .single-main .company-about-wrap .about-page-carousel .ac-slide{
    position:absolute;top:0;left:0;width:100%;height:100%;
    object-fit:contain;padding:0;box-sizing:border-box;
    opacity:0;transition:opacity .4s ease;
  }
  .single-main .company-about-wrap .about-page-carousel .ac-slide.active{opacity:1;}
  .single-main .company-about-wrap .about-page-carousel .ac-btn{display:none;}
  .single-main .company-about-wrap .about-page-carousel .ac-dots{
    position:static;display:flex;justify-content:center;gap:6px;padding:10px 0 8px;
  }
  .single-main .company-about-wrap .about-page-carousel .ac-dot{
    width:8px;height:8px;border-radius:50%;border:none;padding:0;
    background:#C9D3DC;cursor:pointer;
  }
  .single-main .company-about-wrap .about-page-carousel .ac-dot.active{
    background:#1261A6;transform:scale(1.15);
  }
  .single-main .company-about-wrap .about-page-carousel .ac-toggle{
    position:absolute;top:8px;right:8px;z-index:3;opacity:1;
    width:30px;height:30px;border-radius:50%;border:1px solid #E2E5E9;
    background:rgba(255,255,255,.92);color:#102A43;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 2px 8px rgba(16,42,67,.12);
  }
  .single-main .company-about-wrap .about-page-carousel .ac-toggle svg{width:14px;height:14px;}

  /* 缩略图条（手机端显示；基础规则默认隐藏，电脑/平板不受影响） */
  .single-main .company-about-wrap .about-page-carousel .ac-thumbs{
    display:flex;gap:8px;padding:0 10px 10px;overflow-x:auto;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  .single-main .company-about-wrap .about-page-carousel .ac-thumbs::-webkit-scrollbar{display:none;}
  .single-main .company-about-wrap .about-page-carousel .ac-thumb{
    flex:0 0 56px;width:56px;height:56px;border-radius:6px;padding:0;
    border:2px solid transparent;background:#F2F4F7;overflow:hidden;cursor:pointer;
    box-sizing:border-box;transition:border-color .2s ease;
  }
  .single-main .company-about-wrap .about-page-carousel .ac-thumb img{
    width:100%;height:100%;object-fit:cover;display:block;
  }
  .single-main .company-about-wrap .about-page-carousel .ac-thumb.active{border-color:#1261A6;}

  /* 二、流程模块（How to Order）竖排：编号/图标/标题/说明对齐 */
  .order-process{padding-bottom:0;}
  .order-process .home-des{
    color:#1261A6;font:700 11px/1.2 Arial,sans-serif;letter-spacing:2px;
    margin:0 0 8px;text-transform:uppercase;
  }
  .order-process .home-title{
    color:#102A43;font:700 22px/1.3 Arial,sans-serif;margin:0 0 20px;text-transform:none;
  }
  .order-process .op-grid{
    display:grid;grid-template-columns:repeat(2,1fr);gap:12px;
    align-items:start;margin:0;list-style:none;
  }
  .order-process .op-grid li.op-card{
    width:auto;margin:0;padding:16px 14px;box-sizing:border-box;
    background:#FFF;border:1px solid #E2E5E9;border-radius:8px;
    box-shadow:none;position:relative;display:block;
  }
  .order-process .op-grid li.op-card::before{display:none;}
  .order-process .op-head{
    display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;
  }
  .order-process .op-num{
    color:#C9D3DC;font:700 14px/1 Arial,sans-serif;letter-spacing:1px;
  }
  .order-process .op-grid li.op-card .icon{width:32px;height:32px;margin:0;}
  .order-process .op-grid li.op-card .icon svg{width:32px;height:32px;display:block;}
  .order-process .op-grid li.op-card .title{
    color:#102A43;font:700 15px/1.4 Arial,sans-serif;margin:0 0 6px;padding:0;
  }
  .order-process .op-grid li.op-card .text{
    color:#475569;font:400 13.5px/1.6 Arial,sans-serif;margin:0;padding:0;
  }
}

/* 缩略图条默认隐藏（桌面/平板无缩略图；仅上面 ≤768 块内显示） */
.about-page-carousel .ac-thumbs{display:none;}
