/* ========== 全局排版（移动端优先） ========== */
html,body{margin:0;padding:0;}
body{font-size:16px; line-height:1.6; color:#111; background:#fff;}
img{max-width:100%; height:auto; display:block;margin: 0 auto;}
video{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
.container{width:100%; max-width:1200px; margin:0 auto;}
.section{padding:24px 0;}

/* 流式标题（手机到桌面自适应） */
h1{font-size:clamp(22px, 6vw, 36px); margin:0 0 12px;}
h2{font-size:clamp(18px, 4.5vw, 28px); margin:0 0 10px;}
h3{font-size:clamp(16px, 4vw, 22px); margin:0 0 8px;}
p{margin:10px 0}

/* 避免 CLS：给横幅/图块预留比例 */
.ratio{position:relative; width:100%;}
.ratio::before{content:""; display:block; padding-top:56.25%;} /* 16:9 */
.ratio > *{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}

/* ========== 顶部导航（可嵌入现有导航容器） ========== */
.navbar{position:sticky; top:0; z-index:999; background:#fff; border-bottom:1px solid #eee;}
.navbar .row{display:flex; align-items:center; justify-content:space-between; height:56px; padding:0 16px;}
.navbar .brand{display:flex; align-items:center; gap:10px;}
.navbar .brand img{height:28px; width:auto;}
.navbar .menu{display:none; flex-direction:column; gap:14px; padding:12px 16px 16px;}
.navbar .menu a{padding:10px 0; font-weight:500}
.navbar .btn{width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center; border:0px solid #eee; border-radius:0px; background:#fff}

/* 展开状态 */
.nav-open .menu{display:flex}

/* >=768px 视为平板/桌面：恢复横向菜单 */
@media (min-width:768px){
  .navbar .btn{display:none}
  .navbar .menu{display:flex; flex-direction:row; gap:24px; padding:0}
  .navbar .menu a{padding:0}
}
/* —— Banner 基础 —— */
.banner{
  width:100%;
  max-width:1200px;           /* 你原来页面的栅格宽度 */
  aspect-ratio: 4 / 1;        /* PC 近似 1200×300 的观感 */
  position:relative;
  overflow:hidden;
  background:#000;            /* 图未加载时的底色 */
}

/* 半透明黑遮罩
.banner::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.5);
  z-index:1;
  pointer-events:none;        
} */

/* 背景图像层 */
.banner .banner-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;     /* 需要偏移焦点时可改如 'center 40%' */
  z-index:0;
}

/* 标题：水平 + 垂直居中 */
.banner .banner-title{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  margin:0;
  color:#fff;
  text-align:center;
  line-height:1.2;
  z-index:2;
  /* 响应式字号：24px–40px 之间按视口缩放 */
  font-size: clamp(24px, 4vw, 40px);
  /* 提升可读性（可按需调弱） */
  text-shadow: 0 2px 8px rgba(0,0,0,.4);
  /* 长标题的折行优化 */
  max-width: min(90%, 900px);
  overflow-wrap: anywhere;
}

/* —— 移动端优化 —— */
@media (max-width: 768px){
  .banner{
    /* 手机更“高”一点：最小 220px，按视口放大，上限 420px */
    aspect-ratio: auto;                   /* 取消固定比例，用 min-height 控 */
    min-height: clamp(220px, 45vw, 420px);
  }
  .banner .banner-title{
    /* 加一些“安全区”留白，避免遮到导航或圆角屏 */
    padding-inline: 16px;
    /* 字号上限降低，避免过大 */
    font-size: clamp(22px, 6vw, 32px);
  }
}

/* —— 超小屏或刘海屏安全区 —— */
@supports (padding: max(0px)) {
  .banner .banner-title{
    padding-left: max(16px, env(safe-area-inset-left));
    padding-right:max(16px, env(safe-area-inset-right));
  }
}

/* —— 可选的小增强 —— */
/* 如果将来做淡入动画，尊重“减少动效”偏好 */
@media (prefers-reduced-motion: no-preference){
  .banner .banner-img{ transform: scale(1.02); transition: transform 800ms ease; }
  .banner:hover .banner-img{ transform: scale(1.06); }
}

/* ========== 首页 Hero ========== */
.hero{background:#f7f7f7;}
.hero .title{max-width:22ch}
.hero .subtitle{color:#333}

/* Logo 墙网格化 */
.trusted-by { padding-left:16px; padding-right:16px; }
/*.trusted-by .trusted-logo { width:auto; height:auto; display:initial; line-height:initial; }*/ /* 先取消固定尺寸 */
.trusted-by .trusted-logo {height: 50px;/* 父容器需有高度 */  display: flex;  align-items: center;/* 垂直居中 */  justify-content: center; }
.trusted-by .trusted-logo img {max-width:100%; max-height:100%;}
.trusted-by .logos { display:grid; grid-template-columns:repeat(auto-fit,minmax(108px,1fr)); gap:0px; margin-top:12px; }
/*.trusted-by .logos img { width:100%; height:70px; object-fit:contain; background:#fff; border:0px solid #eee; border-radius:0px; padding:0px; }*/
@media (min-width:1024px){ .trusted-by .logos img{ height:84px; } }


/* ========== 卡片与网格（伙伴Logo/产品缩略图/证书等都可用） ========== */
.grid{  display:grid;  grid-template-columns:repeat(auto-fit, minmax(140px,1fr));  gap:0px;}
.card{background:#fff; border:0px solid #eee; border-radius:0px; padding:10px}
.card img{width:100%; height:84px; object-fit:contain}
.card--badge img{height:56px}

/* 产品列表卡片 */
.product-card{display:flex; flex-direction:column; gap:8px}
.product-card .thumb{border-radius:12px; overflow:hidden}
.product-card .name{font-weight:600}
.product-card .meta{font-size:14px; color:#666}

/* ========== 页脚优化（折叠） ========== */
.footer{background:#0f1114; color:#cfd3da}
.footer .container{padding:24px 16px}
.footer .cols{display:grid; grid-template-columns:1fr; gap:8px}
.footer details{background:#13161a; border:1px solid #222; border-radius:10px; padding:10px}
.footer summary{font-weight:600; cursor:pointer}
.footer a{color:#e6eaef}

@media (min-width:1024px){
  .footer .cols{grid-template-columns:repeat(4,1fr); gap:20px}
  .footer details{background:transparent; border:none; padding:0}
}

/* ========== 图文页（关于我们/公司） ========== */
.article img{border-radius:10px}
.article p{margin:12px 0}
.article .toc{margin:6px 0 16px}
.article .toc details{border:1px dashed #ddd; border-radius:0px; padding:8px}
.article .toc a{margin-right:8px}



.banner { width:100%; max-width:1200px; }
.banner .title { bottom:auto; top:50%; transform:translate(-50%,-50%); }
  header .inner .btn {width:40px;height:40px;border:0px solid #eee;border-radius:0px;background:#fff;display:none;}


/* company 页响应式布局 */
@media (max-width: 768px){
  header .inner { padding: 0 16px; }
  header .inner .btn { display:inline-flex; align-items:center; justify-content:center; }
  header nav { display:none; position:absolute; top:54px; left:0; right:0; background:#fff; border-top:0px solid #eee; }
  .nav-open header nav { display:block; }
  header nav a { display:block; padding:12px 16px; border-bottom:1px solid #f2f2f2; }
  .enterprise-container { display:block; padding:24px 16px; }
  .sidebar { width:auto; float:none; margin-bottom:12px; }
  .content { padding-left:0;margin-bottom:0;  }
  .side-image { float:none; width:100%; height:auto; margin:8px 0 16px; }
  .side-image img { position:static; transform:none; width:100%; height:auto; object-fit:cover; border-radius:0px; }
  .timeline::before{ left:12px; top:0; height:100%; }
  .timeline li{ padding:16px 0 16px 28px; }
  .timeline li::before{ left:12px; top:24px; }
  .timeline-content{ width:100%; float:none; text-align:left !important; margin:0 !important; display:block; }
}

/* 覆盖旧的固定宽度布局，改为流式容器 */
.container, .footer-container, header .inner { width:100%; max-width:1200px; margin:0 auto; /*padding:0px;*/ }

/* Banner/产品区等，不要写死 1200px 高宽 */
.banner, .product-section, .detail-container, #product-detail-container { width:100%; max-width:1200px; }

.trusted-by .logos{display: grid;grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));gap: 1px;margin-top: 20px;}
.trusted-by .trusted-logo{width: auto;height: auto;display: initial;line-height: initial;}
.trusted-by .logos img {width: 100%;height: 70px;object-fit: contain;background: #fff;border: 0px solid #eee;padding: 0px;}


/* Footer 列表在手机上单列 */
@media (max-width:768px){
  footer {padding: 30px 0;margin-top: 30px;}
  .navbar {height: 56px;}
  footer .logo-svg {display: none;}
  .footer-container { display:block;padding:0 20px; }
  .footer-right { align-items:center; margin-top:20px;padding: 0px; }
}

@media (max-width:768px){
  .logo-svg {height: 28px;}
  .award-category .card,
  .social-media .card { width:calc(50% - 10px); height:auto; }
  .social-media { flex-wrap:wrap; }
  .case {margin-top: 30px;}
  .company-info {font-size: 14px;text-align: center;margin: auto;}
  .trusted-by .logos {gap: 0;margin: 0;padding: 0px;margin-top: 20px;
    /*这段限定高度，超出后隐藏，点击可展开 max-height: 300px;overflow: hidden*/;}
    .trusted-logo {margin-top: -20px;}
}

  .intro-video,.trusted-by {padding: 0 20px;}
  .trusted-by,.about  {margin-top:40px;}
