
  :root{
    --graphite-900:#14181C;
    --graphite-700:#20262B;
    --paper:#EFEEE9;
    --copper:#B5652D;
    --copper-light:#D98A52;
    --steel:#435B6B;
    --ink:#1B1F23;
    --muted:#6B6B63;
    --line:#D8D5CC;
    --line-dark:#3A4046;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  html, body{
    font-family:'IBM Plex Sans', sans-serif;
    color:var(--ink);
    background:var(--paper) !important;
    line-height:1.6;
  }
  .display{font-family:'Archivo Expanded', sans-serif;}
  .mono{font-family:'IBM Plex Mono', monospace;}
  a{color:inherit; text-decoration:none;}
  .wrap{max-width:1280px; margin:0 auto; padding:0 32px;}
  img,svg{display:block;}

  /* ---------- top utility bar ---------- */
  .topbar{background:var(--graphite-900); border-bottom:1px solid var(--line-dark);}
  .topbar-inner{
    display:flex; justify-content:space-between; align-items:center;
    padding:9px 32px; max-width:1280px; margin:0 auto;
    font-size:13px; color:#C9CDD1;
  }
  .topbar-contact{display:flex; align-items:center; gap:14px;}
  .topbar-contact a{display:flex; align-items:center; gap:6px; color:#C9CDD1;}
  .topbar-contact a:hover{color:#fff;}
  .topbar-divider{color:#4A5157;}
  .topbar-social{display:flex; gap:8px;}
  .social-btn{
    width:26px; height:26px; border-radius:50%;
    background:rgba(255,255,255,0.08);
    display:flex; align-items:center; justify-content:center;
    color:#C9CDD1;
  }
  .social-btn:hover{background:var(--copper); color:#fff;}

  /* ---------- header ---------- */
  header{
    background:#fff;
    border-bottom:1px solid var(--line);
  }
  .site-head{position:sticky; top:0; z-index:20;}
  .nav{
    display:flex; align-items:center; justify-content:space-between;
    padding:18px 32px; max-width:1280px; margin:0 auto;
  }
  .logo{
    font-family:'Archivo Expanded', sans-serif;
    font-weight:700; font-size:17px; letter-spacing:0.3px;
    color:var(--ink); white-space:nowrap;
  }
  .logo span{color:var(--copper);}
  .nav-links{display:flex; align-items:center; gap:26px; font-size:14px; color:var(--ink);}
  .nav-links a:hover{color:var(--copper);}
  .nav-dropdown{position:relative; display:inline-flex;}
  .nav-dropdown > a{display:flex; align-items:center; gap:4px;}
  .dropdown-menu{
    position:absolute; top:100%; left:0; margin-top:16px;
    background:#fff; border:1px solid var(--line); border-radius:8px;
    min-width:230px; padding:8px 0;
    box-shadow:0 16px 28px rgba(20,24,28,0.10);
    opacity:0; visibility:hidden; transform:translateY(6px);
    transition:opacity .15s ease, transform .15s ease, visibility .15s ease;
  }
  .nav-dropdown:hover .dropdown-menu{opacity:1; visibility:visible; transform:translateY(0);}
  .dropdown-menu a{display:block; padding:9px 18px; font-size:13.5px; color:var(--ink); white-space:nowrap;}
  .dropdown-menu a:hover{background:var(--paper); color:var(--copper);}
  .header-actions{display:flex; align-items:center; gap:16px;}
  .nav-cta{
    background:var(--graphite-900);
    color:#fff;
    padding:11px 22px;
    border-radius:999px;
    font-size:14px;
    font-weight:500;
  }
  .nav-cta:hover{background:#2A3036;}
  .lang-select{position:relative;}
  .lang-toggle{
    display:flex; align-items:center; gap:6px;
    font-size:13.5px; color:var(--ink);
    padding:8px 10px; border:1px solid var(--line); border-radius:6px;
    background:#fff; cursor:pointer; font-family:inherit;
  }
  .lang-toggle:hover{border-color:var(--copper);}
  .lang-menu{
    position:absolute; top:100%; right:0; margin-top:8px;
    background:#fff; border:1px solid var(--line); border-radius:8px;
    min-width:150px; padding:6px 0;
    box-shadow:0 16px 28px rgba(20,24,28,0.10);
    opacity:0; visibility:hidden; transform:translateY(6px);
    transition:opacity .15s ease, transform .15s ease, visibility .15s ease;
    z-index:30;
  }
  .lang-menu.open{opacity:1; visibility:visible; transform:translateY(0);}
  .lang-option{
    display:block; width:100%; text-align:left;
    padding:9px 16px; font-size:13.5px; color:var(--ink);
    background:none; border:none; cursor:pointer; font-family:inherit;
  }
  .lang-option:hover{background:var(--paper); color:var(--copper);}
  .lang-option.active{color:var(--copper); font-weight:600;}

  /* ---------- hero banner (rotating) ---------- */
  .hero-banner{position:relative; height:560px; overflow:hidden; background:var(--graphite-900);}
  .banner-slide{
    position:absolute; inset:0;
    opacity:0; visibility:hidden;
    transition:opacity .7s ease;
    display:flex; align-items:flex-end;
  }
  .banner-slide.active{opacity:1; visibility:visible; z-index:1;}
  .banner-photo{
    position:absolute; inset:0;
    background-color:var(--graphite-900);
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
  }
  .banner-overlay{
    position:absolute; inset:0;
    background:linear-gradient(0deg, rgba(15,18,21,0.78) 0%, rgba(15,18,21,0.25) 50%, rgba(15,18,21,0.05) 100%);
  }
  .banner-content{position:relative; z-index:2; padding-bottom:76px; max-width:620px;}
  .banner-content h1{color:#fff; font-size:38px; line-height:1.24; font-weight:700;}
  .btn-learn-more{
    display:inline-flex; align-items:center; gap:10px;
    margin-top:28px; padding:13px 26px; border-radius:999px;
    border:1px solid rgba(255,255,255,0.55); color:#fff;
    font-size:14.5px; font-weight:500;
  }
  .btn-learn-more:hover{background:rgba(255,255,255,0.12);}
  .banner-dots{
    position:absolute; left:50%; bottom:26px; transform:translateX(-50%);
    z-index:3; display:flex; gap:8px;
  }
  .banner-dots .dot{background:rgba(255,255,255,0.4);}
  .banner-dots .dot.active{background:#fff;}

  /* ---------- feature strip ---------- */
  .feature-strip{padding:56px 0 0;}
  .feature-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
  .feature-card{
    background:#fff; border:1px solid var(--line); border-radius:8px;
    padding:26px 24px; box-shadow:0 14px 28px rgba(20,24,28,0.05);
  }
  .feature-card h3{font-size:16px; font-weight:600; margin-bottom:10px;}
  .feature-card p{font-size:13.5px; color:var(--muted); line-height:1.6;}

  .btn-primary{
    background:var(--copper);
    color:#fff;
    padding:13px 24px;
    font-size:14.5px;
    font-weight:500;
    border:1px solid var(--copper);
  }
  .btn-primary:hover{background:var(--copper-light); border-color:var(--copper-light);}
  .btn-secondary{
    border:1px solid #4A5157;
    color:#E6E8EA;
    padding:13px 24px;
    font-size:14.5px;
    font-weight:500;
  }
  .btn-secondary:hover{border-color:#fff;}

  /* ---------- section heading ---------- */
  .section{padding:88px 0;}
  .section-head{
    display:flex; justify-content:space-between; align-items:flex-end;
    margin-bottom:44px; gap:24px; flex-wrap:wrap;
  }
  .section-head h2{
    font-size:32px; font-weight:600;
  }
  .section-head p{color:var(--muted); max-width:420px; font-size:15px;}

  /* ---------- product directory ---------- */
  .directory{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:1px;
    background:var(--line);
    border:1px solid var(--line);
  }
  .tile{
    background:var(--paper);
    padding:30px 26px;
    position:relative;
  }
  .tile::before, .tile::after{
    content:""; position:absolute; width:14px; height:14px;
    border-color:var(--copper); border-style:solid; opacity:0;
    transition:opacity .18s ease;
  }
  .tile::before{top:10px; left:10px; border-width:1.5px 0 0 1.5px;}
  .tile::after{bottom:10px; right:10px; border-width:0 1.5px 1.5px 0;}
  .tile:hover::before, .tile:hover::after{opacity:1;}
  .tile .icon{width:34px; height:34px; color:var(--steel); margin-bottom:20px;}
  .tile-photo{
    aspect-ratio:4/3;
    margin-bottom:16px;
    background:
      repeating-linear-gradient(45deg, var(--line) 0 1px, transparent 1px 11px),
      #E7E4DC;
    border:1px solid var(--line);
    display:flex; align-items:center; justify-content:center;
    text-align:center; padding:10px;
    color:var(--muted); font-size:12px; line-height:1.3;
  }

  /* ---------- product category (reference-style) ---------- */
  .category-head{text-align:center; margin-bottom:48px;}
  .kicker{
    font-size:12px; letter-spacing:1.5px; text-transform:uppercase;
    color:var(--muted); font-weight:500;
  }
  .category-head .squiggle{margin:10px auto 16px;}
  .category-head h2{font-size:28px; font-weight:600;}
  .category-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:32px 28px;
  }
  .category-photo{
    aspect-ratio:1/1;
    border-radius:14px;
    background:
      repeating-linear-gradient(45deg, var(--line) 0 1px, transparent 1px 11px),
      #E7E4DC;
    background-size:cover; background-position:center;
    border:1px solid var(--line);
    display:flex; align-items:center; justify-content:center;
    text-align:center; padding:12px;
    color:var(--muted); font-size:12.5px; line-height:1.3;
    position:relative; overflow:hidden;
  }
  .category-overlay{
    position:absolute; inset:0;
    background:rgba(20,24,28,0.86);
    color:#fff;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    text-align:center; padding:22px;
    opacity:0; visibility:hidden;
    transition:opacity .25s ease, visibility .25s ease;
  }
  .category-item:hover .category-overlay{opacity:1; visibility:visible;}
  .category-overlay h3{font-family:'Archivo Expanded', sans-serif; font-size:16px; font-weight:600; margin-bottom:10px;}
  .category-overlay p{font-size:12.5px; color:#C9CDD1; line-height:1.55; margin-bottom:16px;}
  .cat-learn-more{
    border:1px solid rgba(255,255,255,0.55); color:#fff;
    padding:8px 18px; border-radius:999px; font-size:12.5px; font-weight:500;
  }
  .cat-learn-more:hover{background:rgba(255,255,255,0.15);}
  .category-caption{
    margin-top:14px; text-align:center;
    font-size:15px; font-weight:600; color:var(--ink);
  }
  .tile h3{font-size:17px; font-weight:600; margin-bottom:10px;}
  .tile ul{list-style:none; font-size:13.5px; color:var(--muted);}
  .tile li{padding:3px 0; border-top:1px solid var(--line);}
  .tile li:first-child{border-top:none;}
  .directory.serve-grid{grid-template-columns:repeat(4,1fr);}

  /* ---------- custom options ---------- */
  .options-grid{
    display:grid; grid-template-columns:1fr 1fr; gap:1px;
    background:var(--line); border:1px solid var(--line);
  }
  .option-card{background:#fff; padding:32px 30px;}
  .option-card h3{font-size:17px; font-weight:600; margin-bottom:10px;}
  .option-card p{font-size:14px; color:var(--muted);}

  /* ---------- factory showroom ---------- */
  .showroom-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
  .show-item{position:relative; border-radius:8px; overflow:hidden;}
  .show-photo{
    aspect-ratio:1/1;
    background:repeating-linear-gradient(45deg, var(--line) 0 1px, transparent 1px 11px), #E7E4DC;
  }
  .show-tag{
    position:absolute; left:0; right:0; bottom:0;
    background:rgba(20,24,28,0.72); color:#fff;
    font-size:12.5px; text-align:center; padding:8px 6px;
  }

  /* ---------- projects ---------- */
  .project-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
  .project-photo{
    aspect-ratio:4/3; border-radius:8px;
    background:repeating-linear-gradient(45deg, var(--line) 0 1px, transparent 1px 11px), #E7E4DC;
    margin-bottom:16px;
  }
  .project-card h3{font-size:16px; font-weight:600; line-height:1.35; margin-bottom:8px;}
  .project-card p{font-size:13.5px; color:var(--muted); margin-bottom:12px;}
  .read-more{font-size:13.5px; font-weight:500; color:var(--copper);}

  /* ---------- reviews ---------- */
  .reviews-grid{display:grid; grid-template-columns:0.85fr 1.15fr; gap:56px; align-items:center;}
  .review-photo-wrap{
    position:relative; aspect-ratio:4/3.3; border-radius:14px; overflow:hidden;
    border:1px solid var(--line);
  }
  .review-photo-slide{
    position:absolute; inset:0;
    background-color:#E7E4DC;
    background-size:cover; background-position:center; background-repeat:no-repeat;
    opacity:0; transition:opacity .3s ease;
  }
  .review-photo-slide.active{opacity:1;}
  .review-copy .squiggle{margin:10px 0 16px;}
  .review-copy h2{font-size:28px; font-weight:600;}
  .review-slide{display:none;}
  .review-slide.active{display:block;}
  .quote{font-size:15px; color:var(--ink); max-width:440px; line-height:1.6; min-height:76px; margin-top:22px;}
  .reviewer{font-weight:600; margin-top:18px; font-size:14.5px;}
  .review-dots{display:flex; gap:8px; margin-top:26px;}
  .dot{width:8px; height:8px; border-radius:4px; background:var(--line); border:none; padding:0; cursor:pointer; transition:width .2s ease, background .2s ease;}
  .dot.active{width:22px; background:var(--copper);}

  /* ---------- news ---------- */
  .news-grid{display:grid; grid-template-columns:0.8fr 1fr; gap:24px; align-items:stretch;}
  .news-intro{display:flex; flex-direction:column; justify-content:center;}
  .news-intro .squiggle{margin:10px 0 16px;}
  .news-intro h2{font-size:26px; font-weight:600;}
  .news-intro p{font-size:14px; color:var(--muted); margin-top:12px;}
  .news-actions{display:flex; align-items:center; gap:14px; margin-top:22px;}
  .btn-dark{background:var(--graphite-900); color:#fff; border-color:var(--graphite-900); margin-top:0;}
  .news-arrows{display:flex; gap:8px;}
  .arrow-btn{
    width:38px; height:38px; border-radius:50%; border:1px solid var(--line);
    background:#fff; color:var(--ink); display:flex; align-items:center; justify-content:center;
    cursor:pointer;
  }
  .arrow-btn:hover{border-color:var(--copper); color:var(--copper);}
  .news-track-wrap{overflow:hidden;}
  .news-track{display:flex; gap:20px; transition:transform .4s ease;}
  .news-card{position:relative; border-radius:10px; overflow:hidden; min-height:280px; flex:0 0 auto;}
  .news-photo{position:absolute; inset:0; background:repeating-linear-gradient(45deg, #3A4046 0 1px, transparent 1px 11px), var(--graphite-900);}
  .news-title{
    position:absolute; left:18px; right:18px; bottom:18px;
    color:#fff; font-size:16px; font-weight:600; line-height:1.35;
  }

  .region-row{display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); border-top:none; margin-top:1px;}
  .region{padding:20px 22px 18px; border-right:1px solid var(--line);}
  .region:last-child{border-right:none;}
  .region .code{color:var(--copper); font-size:13px; margin-bottom:6px;}
  .region .desc{font-size:13px; color:var(--muted);}

  .video-frame{
    position:relative;
    aspect-ratio:16/10;
    background:var(--graphite-900);
    background-image:
      repeating-linear-gradient(45deg, rgba(255,255,255,0.035) 0 1px, transparent 1px 11px);
    border:1px solid var(--line-dark);
    display:flex; align-items:center; justify-content:center;
  }
  .video-play{
    width:56px; height:56px; border-radius:50%;
    background:var(--copper);
    display:flex; align-items:center; justify-content:center;
    cursor:pointer;
  }
  .video-caption{
    position:absolute; bottom:14px; left:16px;
    color:#C9CDD1; font-size:13px;
  }

  /* ---------- brand intro (text left, video right) ---------- */
  .brand-intro{padding:76px 0;}
  .brand-intro-grid{
    display:grid; grid-template-columns:1fr 460px; gap:56px; align-items:center;
  }
  .brand-intro-copy h2{font-size:28px; font-weight:600; line-height:1.3; max-width:520px;}
  .brand-intro-copy p{margin-top:16px; color:var(--muted); font-size:15px; line-height:1.7; max-width:520px;}
  .brand-intro-cta{display:flex; align-items:center; gap:24px; margin-top:28px;}
  .brand-intro .video-frame{border-radius:10px; overflow:hidden; aspect-ratio:16/9;}

  /* ---------- about (reference-style intro) ---------- */
  .about{padding:88px 0 64px;}
  .about-grid{
    display:grid;
    grid-template-columns:420px 1fr;
    gap:56px;
    align-items:start;
  }
  .about .video-frame{border-radius:10px; overflow:hidden; aspect-ratio:16/9;}
  .yt-embed{position:absolute; inset:0; width:100%; height:100%; border:0;}
  .about-copy h2{
    font-size:28px; font-weight:600; line-height:1.28; max-width:520px;
  }
  .about-copy > p{
    margin-top:18px; color:var(--muted); font-size:15px; max-width:560px;
  }
  .checklist{
    list-style:none;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px 28px;
    margin-top:28px;
    max-width:560px;
  }
  .checklist li{display:flex; align-items:flex-start; gap:10px; font-size:14.5px; color:var(--ink);}
  .checklist .check{
    width:18px; height:18px; min-width:18px; border-radius:50%;
    background:var(--paper); border:1px solid var(--copper);
    color:var(--copper); font-size:11px; font-weight:600;
    display:flex; align-items:center; justify-content:center;
    margin-top:1px;
  }
  .about-cta{
    display:flex; align-items:center; gap:24px;
    margin-top:32px; padding-top:24px; border-top:1px solid var(--line);
    max-width:560px;
  }
  .btn-pill{border-radius:999px; padding:14px 30px;}
  .email-block{display:flex; align-items:center; gap:12px;}
  .email-icon{
    width:38px; height:38px; border-radius:50%; background:var(--paper);
    border:1px solid var(--line);
    display:flex; align-items:center; justify-content:center;
    color:var(--steel);
  }
  .email-label{font-size:12px; color:var(--muted);}
  .email-address{font-size:14.5px; color:var(--ink); margin-top:1px;}

  .about-stats{
    display:grid; grid-template-columns:repeat(4,1fr);
    margin-top:64px; padding-top:44px; border-top:1px solid var(--line);
    text-align:center;
  }
  .astat{color:var(--steel);}
  .astat .anum{
    font-family:'Archivo Expanded', sans-serif; font-weight:700;
    font-size:26px; color:var(--ink); margin-top:14px;
  }
  .astat .alabel{font-size:13.5px; color:var(--muted); margin-top:4px;}

  /* ---------- certifications ---------- */
  .certs{background:var(--paper); color:var(--ink);}
  .certs .wrap{padding:64px 32px;}
  .certs-head{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:36px; flex-wrap:wrap; gap:16px;}
  .certs-head h2{font-size:26px; font-weight:600;}
  .certs-head p{color:var(--muted); font-size:14.5px; max-width:420px;}
  .cert-row{display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line);}
  .cert{
    padding:26px 20px 22px;
    border-right:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .cert:last-child{border-right:none;}
  .cert-doc{
    aspect-ratio:3/4;
    border-radius:4px;
    background:
      repeating-linear-gradient(45deg, var(--line) 0 1px, transparent 1px 9px),
      #E7E4DC;
    border:1px solid var(--line);
    margin-bottom:18px;
  }
  .cert .code{font-family:'IBM Plex Mono',monospace; color:var(--copper); font-size:14px; margin-bottom:8px;}
  .cert .desc{font-size:13.5px; color:var(--muted);}

  /* ---------- CTA / contact ---------- */
  .cta{padding:90px 0;}
  .cta-grid{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start;}
  .cta-copy h2{font-size:32px; font-weight:600; max-width:380px; line-height:1.2;}
  .cta-copy p{color:var(--muted); margin-top:18px; max-width:380px; font-size:15px;}
  .cta-copy .contact-line{margin-top:28px; font-size:14.5px;}
  .cta-copy .contact-line .mono{color:var(--copper); display:block; font-size:15px; margin-top:2px;}

  form{border:1px solid var(--line); background:#fff;}
  .field{border-bottom:1px solid var(--line); padding:16px 20px;}
  .field:last-of-type{border-bottom:none;}
  .field label{display:block; font-size:12.5px; color:var(--muted); margin-bottom:5px;}
  .field input, .field textarea{
    width:100%; border:none; outline:none; font-family:inherit; font-size:15px;
    background:transparent; color:var(--ink); resize:none;
  }
  .field textarea{height:70px;}
  .form-submit{padding:18px 20px;}
  .form-submit button{
    width:100%; background:var(--copper); color:#fff; border:none;
    padding:14px; font-size:14.5px; font-weight:500; cursor:pointer; font-family:inherit;
  }
  .form-submit button:hover{background:var(--copper-light);}

  /* ---------- footer ---------- */
  .site-footer{background:var(--graphite-900); color:#B9C0C5; border-top:1px solid var(--line-dark);}
  .footer-main{display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:48px; padding:64px 32px 48px;}
  .footer-brand .logo{margin-bottom:16px; color:#fff;}
  .footer-legal{color:#fff; font-weight:600; font-size:14.5px; margin-bottom:12px;}
  .footer-desc{font-size:13.5px; line-height:1.7; color:#9AA1A6; max-width:320px;}
  .footer-heading{
    color:#fff; font-size:16px; font-weight:600; margin-bottom:20px;
    position:relative; padding-bottom:14px;
  }
  .footer-heading::after{content:""; position:absolute; left:0; bottom:0; width:22px; height:2px; background:var(--copper);}
  .footer-links-grid{display:grid; grid-template-columns:1fr 1fr; gap:0 16px;}
  .footer-links-grid ul{list-style:none;}
  .footer-links-grid li{margin-bottom:12px;}
  .footer-links-grid a{font-size:13.5px; color:#B9C0C5; display:flex; align-items:center; gap:5px;}
  .footer-links-grid a::before{content:"›"; color:var(--copper);}
  .footer-links-grid a:hover{color:#fff;}
  .footer-contact-item{display:flex; align-items:flex-start; gap:12px; margin-bottom:18px; font-size:13.5px; color:#B9C0C5;}
  .footer-icon{
    width:28px; height:28px; min-width:28px; border-radius:50%;
    background:rgba(255,255,255,0.08);
    display:flex; align-items:center; justify-content:center;
    color:var(--copper-light);
  }
  .footer-line{margin-top:14px; font-size:13.5px; color:#B9C0C5;}
  .footer-line strong{color:#fff; font-weight:600;}
  .footer-bottom{border-top:1px solid var(--line-dark);}
  .footer-bottom-inner{
    display:flex; justify-content:space-between; align-items:center;
    padding:22px 32px; flex-wrap:wrap; gap:12px;
  }
  .footer-bottom .fine{font-size:13px; color:#8B9298;}
  .footer-legal-links{display:flex; gap:22px; font-size:13px; color:#9AA1A6;}
  .footer-legal-links a:hover{color:#fff;}

/* =========================================================
   2026-10-14 修改文档新增样式
   ========================================================= */

/* ---------- topbar slogan ---------- */
.topbar-slogan{
  font-size:12.5px; color:#9AA1A6; letter-spacing:0.4px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* ---------- Products 大菜单（mega menu） ---------- */
.dropdown-menu.mega-menu{
  left:50%; transform:translate(-50%, 6px);
  min-width:0; width:1080px;
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:26px 32px; padding:28px 32px 24px;
}
.nav-dropdown:hover .dropdown-menu.mega-menu{transform:translate(-50%, 0);}
.mega-menu .mega-col ul{list-style:none;}
.mega-head{
  display:flex !important; align-items:center; gap:10px;
  padding:0 0 10px !important; margin-bottom:10px;
  border-bottom:1px solid var(--line);
  font-family:'Archivo Expanded', sans-serif;
  font-size:14px !important; font-weight:600; color:var(--steel) !important;
  white-space:nowrap !important;
}
.mega-head img{width:38px; height:38px; object-fit:contain; border-radius:6px; background:#fff; border:1px solid var(--line); flex:0 0 auto;}
.mega-head:hover{color:var(--copper) !important; background:none !important;}
.mega-menu .mega-col ul a{
  display:block !important; padding:4px 0 !important;
  font-size:13px !important; color:var(--ink) !important; white-space:nowrap !important;
}
.mega-menu .mega-col ul a:hover{color:var(--copper) !important; background:none !important;}

/* ---------- 特色卡片小图标 ---------- */
.feature-card .feature-icon{
  width:44px; height:44px; border-radius:10px;
  background:var(--paper); border:1px solid var(--line);
  color:var(--copper);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:16px;
}

/* ---------- 定制服务卡片配图 ---------- */
.option-card .option-photo{
  aspect-ratio:16/9; border-radius:8px; overflow:hidden;
  border:1px solid var(--line); margin-bottom:18px; background:#fff;
}
.option-card .option-photo img{width:100%; height:100%; object-fit:cover; display:block;}

/* ---------- 标题红色强调 + 描述行 ---------- */
.category-head h2 em, .faq .category-head h2 em{color:var(--copper); font-style:normal;}
.category-head .head-desc{
  color:var(--muted); font-size:15px; max-width:640px;
  margin:12px auto 0; text-align:center; line-height:1.6;
}

/* ---------- Product List ---------- */
.pl-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:28px 24px;}
.pl-card{
  display:block; background:#fff; border:1px solid var(--line); border-radius:10px;
  padding:20px 20px 22px; box-shadow:0 14px 28px rgba(20,24,28,0.05);
  transition:transform .18s ease, box-shadow .18s ease;
}
.pl-card:hover{transform:translateY(-3px); box-shadow:0 18px 34px rgba(20,24,28,0.10);}
.pl-card .pl-photo{
  aspect-ratio:1/1; border-radius:8px; overflow:hidden;
  border:1px solid var(--line); background:#fff; margin-bottom:16px;
}
.pl-card .pl-photo img{width:100%; height:100%; object-fit:contain; display:block; padding:8px;}
.pl-card h3{font-size:15.5px; font-weight:600; margin-bottom:8px; color:var(--ink);}
.pl-card p{font-size:13px; color:var(--muted); line-height:1.55;}

/* ---------- Featured Products 轮播 ---------- */
.featured{background:var(--paper);}
.fp-viewport{overflow:hidden;}
.fp-track{display:flex; gap:20px; transition:transform .4s ease;}
.fp-card{
  flex:0 0 calc(25% - 15px);
  background:#fff; border:1px solid var(--line); border-radius:10px;
  padding:18px 18px 20px; box-shadow:0 14px 28px rgba(20,24,28,0.05);
}
.fp-card .fp-photo{
  aspect-ratio:1/1; border-radius:8px; overflow:hidden;
  border:1px solid var(--line); background:#fff; margin-bottom:14px;
}
.fp-card .fp-photo img{width:100%; height:100%; object-fit:contain; display:block; padding:6px;}
.fp-card h3{font-size:14.5px; font-weight:600; line-height:1.35; margin-bottom:8px;}
.fp-card p{font-size:12.5px; color:var(--muted); line-height:1.55;}
.fp-arrows{display:flex; justify-content:center; gap:10px; margin-top:28px;}

/* ---------- FAQ ---------- */
.faq-list{max-width:820px; margin:0 auto;}
.faq-item{
  background:#fff; border:1px solid var(--line); border-radius:10px;
  margin-bottom:14px; box-shadow:0 10px 24px rgba(20,24,28,0.05); overflow:hidden;
}
.faq-q{
  width:100%; display:flex; align-items:center; gap:16px;
  padding:18px 22px; background:none; border:none; cursor:pointer;
  font-family:inherit; text-align:left;
}
.faq-num{font-family:'IBM Plex Mono', monospace; color:var(--copper); font-size:13px; font-weight:600;}
.faq-title{flex:1; font-size:15px; font-weight:600; color:var(--ink);}
.faq-toggle{
  width:26px; height:26px; min-width:26px; border-radius:50%;
  border:1px solid var(--line); color:var(--ink);
  display:flex; align-items:center; justify-content:center;
  transition:transform .2s ease, background .2s ease, color .2s ease;
}
.faq-item.open .faq-toggle{transform:rotate(45deg); background:var(--copper); border-color:var(--copper); color:#fff;}
.faq-a{max-height:0; overflow:hidden; transition:max-height .3s ease;}
.faq-a p{
  padding:0 22px 20px 61px; font-size:14px; color:var(--muted); line-height:1.7;
}
.faq-item.open .faq-a{max-height:260px;}

/* ---------- Send Us a Message 表单区 ---------- */
.contact-section{background:var(--paper);}
.contact-grid{display:grid; grid-template-columns:1.15fr 1fr; gap:40px; align-items:stretch;}
.contact-card{
  background:#fff; border:1px solid var(--line); border-radius:14px;
  padding:34px 32px; box-shadow:0 14px 28px rgba(20,24,28,0.05);
}
.contact-card h2{font-size:26px; font-weight:600;}
.contact-note{font-size:12.5px; color:var(--muted); margin:6px 0 22px;}
.contact-form-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.cfield input, .cfield textarea{
  width:100%; border:1px solid var(--line); border-radius:999px;
  padding:13px 20px; font-family:inherit; font-size:14px;
  background:var(--paper); color:var(--ink); outline:none; resize:vertical;
}
.cfield textarea{border-radius:18px; min-height:96px;}
.cfield input:focus, .cfield textarea:focus{border-color:var(--copper); background:#fff;}
.cfield-full{grid-column:1 / -1;}
.contact-submit{
  margin-top:20px; background:var(--graphite-900); color:#fff;
  border:none; border-radius:999px; padding:14px 34px;
  font-size:14.5px; font-weight:500; cursor:pointer; font-family:inherit;
}
.contact-submit:hover{background:#2A3036;}
.form-feedback{margin-top:14px; font-size:13.5px; min-height:20px;}
.form-feedback.ok{color:#2E7D4F;}
.form-feedback.err{color:#C0392B;}
.contact-panel{position:relative; border-radius:14px; overflow:hidden; border:1px solid var(--line);}
.contact-panel > img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.contact-panel-card{
  position:absolute; left:22px; right:22px; bottom:22px;
  background:rgba(255,255,255,0.94); border-radius:10px;
  padding:18px 20px; box-shadow:0 12px 26px rgba(20,24,28,0.18);
}
.contact-panel-card .logo{font-size:16px;}
.contact-panel-legal{font-size:13px; font-weight:600; color:var(--ink); margin:6px 0 10px;}
.contact-panel-line{font-size:12.5px; color:var(--muted); line-height:1.7;}

/* ---------- 右侧悬浮联系条 ---------- */
.float-toolbar{
  position:fixed; right:0; top:50%; transform:translateY(-50%);
  z-index:90; display:flex; flex-direction:column;
  background:#fff; border:1px solid var(--line); border-right:none;
  border-radius:10px 0 0 10px; overflow:hidden;
  box-shadow:0 10px 26px rgba(20,24,28,0.14);
}
.ft-item{
  display:flex; flex-direction:column; align-items:center; gap:3px;
  padding:11px 10px 9px; min-width:62px;
  font-size:10.5px; color:var(--ink);
  border-bottom:1px solid var(--line);
  transition:background .15s ease, color .15s ease;
}
.ft-item:last-child{border-bottom:none;}
.ft-item:hover{background:var(--paper); color:var(--copper);}
.ft-whatsapp{color:#22B45E;}
.ft-whatsapp:hover{color:#22B45E; background:#F0FAF4;}

/* =========================================================
   2026-10-14 第二轮修改（覆盖上述同名规则，级联生效）
   ========================================================= */

/* ---------- 1. 下拉菜单：延时消失 + 悬停桥 + 与主体同宽居中 ---------- */
.nav-dropdown::after{
  content:""; position:absolute; top:100%; left:0; right:0; height:16px;
}
.dropdown-menu{
  transition:opacity .2s ease .05s, transform .2s ease .05s, visibility 0s linear .35s;
}
.nav-dropdown:hover .dropdown-menu{
  transition:opacity .15s ease, transform .15s ease, visibility 0s;
}
.dropdown-menu.mega-menu{width:1280px; max-width:calc(100vw - 24px);}

/* ---------- 2. banner 文字垂直居中、左对齐 ---------- */
.banner-slide{align-items:center;}
.banner-content{padding-bottom:0;}

/* ---------- 3. about 左栏：视频下方放 4 条清单 ---------- */
.about-left .checklist{margin-top:26px; grid-template-columns:1fr; max-width:none;}

/* ---------- 5. 定制服务卡片：图片铺满卡顶 ---------- */
.option-card{padding:0;}
.option-card .option-photo{aspect-ratio:16/9; border:none; border-radius:0; margin:0;}
.option-card h3{margin:24px 28px 0;}
.option-card p{margin:10px 28px 30px;}

/* ---------- 6. Product List 图片去边框 ---------- */
.pl-card .pl-photo{border:none;}

/* ---------- 7. 展厅改 img 标签结构：图 + 标题 + 两行描述 ---------- */
.showroom-grid{gap:20px;}
.show-item{background:#fff; border:1px solid var(--line); border-radius:10px; overflow:hidden;}
.show-item img{width:100%; aspect-ratio:4/3; object-fit:cover; display:block;}
.show-body{padding:14px 18px 16px;}
.show-body h3{font-size:14.5px; font-weight:600; margin-bottom:5px; color:var(--ink);}
.show-body p{font-size:12.5px; color:var(--muted); line-height:1.55;}

/* ---------- 8. Latest News：一行 4 个（图 + 日期 + 标题） ---------- */
.news-4-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
.news-4-card{
  display:block; background:#fff; border:1px solid var(--line); border-radius:10px;
  overflow:hidden; box-shadow:0 14px 28px rgba(20,24,28,0.05);
  transition:transform .18s ease, box-shadow .18s ease;
}
.news-4-card:hover{transform:translateY(-3px); box-shadow:0 18px 34px rgba(20,24,28,0.10);}
.news-4-card img{width:100%; aspect-ratio:16/10; object-fit:cover; display:block;}
.news-4-body{padding:14px 16px 16px;}
.news-4-date{font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--copper); margin-bottom:6px;}
.news-4-title{font-size:14px; font-weight:600; line-height:1.4; color:var(--ink);}

/* ---------- 9. Send Us a Message：去外边框、小圆弧、输入框无边框用阴影 ---------- */
.contact-card{border:none; border-radius:5px; box-shadow:0 14px 28px rgba(20,24,28,0.07);}
.cfield input, .cfield textarea{
  border:none; border-radius:5px; background:#F4F2EC;
  box-shadow:0 2px 8px rgba(20,24,28,0.06);
}
.cfield input:focus, .cfield textarea:focus{
  border:none; background:#fff;
  box-shadow:0 2px 12px rgba(181,101,45,0.20);
}
.contact-panel{aspect-ratio:4/3;}
.contact-submit{border-radius:5px;}

/* ---------- 10. Footer 信息架构 ---------- */
.footer-contact-desc{font-size:13.5px; line-height:1.7; color:#9AA1A6; max-width:320px; margin-bottom:16px;}
.footer-contact-block{font-size:13.5px; color:#B9C0C5; line-height:1.8;}
.footer-contact-block strong{color:#fff; font-weight:600;}

/* =========================================================
   2026-10-14 第三轮修改
   ========================================================= */

/* ---------- 1. Featured Products 图片去边框 ---------- */
.fp-card .fp-photo{border:none;}

/* ---------- 2. about 左栏清单一行 2 个 + 栏宽比例调整 ---------- */
.about-grid{grid-template-columns:460px 1fr;}
.about-left .checklist{grid-template-columns:1fr 1fr; gap:14px 20px;}

/* ---------- 3. 服务区域 + 证书名 加大加粗 ---------- */
.region .code{font-size:15px; font-weight:700; color:var(--ink); margin-bottom:8px;}
.cert .code{font-size:17px; font-weight:600;}

/* ---------- 4. Latest News 作者名 + 查看全部按钮 ---------- */
.news-4-author{font-size:12px; color:var(--muted); margin-top:6px;}
.news-all-btn{display:flex; justify-content:center; margin-top:36px;}
.news-all-btn .btn-view-all{
  display:inline-flex; align-items:center; gap:10px;
  background:var(--graphite-900); color:#fff;
  padding:13px 30px; border-radius:999px;
  font-size:14px; font-weight:500;
}
.news-all-btn .btn-view-all:hover{background:#2A3036;}

/* ---------- 5. 询盘表单去 border ---------- */
#rfqForm{border:none; background:none;}

/* ---------- 第三轮修正：区域名保持铜橙不改色 / banner 文字明确左对齐 ---------- */
.region .code{color:var(--copper);}
.banner-content h1{text-align:left;}
.banner-content{margin-left:0;}
.email-address a, .contact-panel-line a{color:inherit;}
.email-address a:hover, .contact-panel-line a:hover{color:var(--copper);}
.footer-contact-block a{color:inherit;}
.footer-contact-block a:hover{color:#fff;}

/* ---------- banner 文字：主体框架(1280px)内左对齐，非整屏居中 ---------- */
.banner-content.wrap{max-width:1280px; margin:0 auto;}
.banner-content.wrap h1{max-width:620px;}

/* ---------- banner 结构：外层框架容器 + 内容框内左对齐 ---------- */
.banner-slide{justify-content:flex-start;}
.banner-inner{width:100%;}
.banner-inner.wrap{margin:0 auto;}
.banner-content{max-width:620px;}

/* =========================================================
   2026-10-19 修改：banner 815px + 定制版块4列SVG图标 + 统一kicker标题
   ========================================================= */

/* ---------- 1. banner 高度 815px ---------- */
.hero-banner{height:815px;}

/* ---------- 2. Wide Custom Options：一行4个，SVG图标 ---------- */
.options-grid{
  grid-template-columns:repeat(4,1fr); gap:22px;
  background:none; border:none;
}
.option-card{
  border:1px solid var(--line); border-radius:10px;
  box-shadow:0 14px 28px rgba(20,24,28,0.05);
  padding:26px 24px;
}
.option-card h3{margin:0 0 10px; font-size:16px;}
.option-card p{margin:0; font-size:13.5px;}
.option-card .option-icon{
  width:48px; height:48px; border-radius:10px;
  background:var(--paper); border:1px solid var(--line);
  color:var(--copper);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:18px;
}

/* ---------- 3/4. about 区 kicker 左对齐 ---------- */
.about-copy .kicker{margin-bottom:2px;}
.about-copy .squiggle{margin:10px 0 18px;}

/* ---------- 2026-10-19 证书区去线框 ---------- */
.cert-row{border-top:none; gap:24px;}
.cert{border-right:none; border-bottom:none; padding:0;}
.cert-doc{border:none; box-shadow:0 10px 24px rgba(20,24,28,0.08);}

/* ---------- 2026-10-19 头部+banner 总高一屏：banner = 视口高 - 头部(约111px)，上限815 ---------- */
.hero-banner{height:calc(100vh - 111px); max-height:815px; min-height:480px;}

/* ---------- 修正：按头部实测高度126px扣减 ---------- */
.hero-banner{height:calc(100vh - 127px);}

/* ---------- 2026-10-19 底部四栏：新增Contact Us + Information单列 ---------- */
.footer-main{grid-template-columns:1.2fr 1fr 0.75fr 1.05fr;}
.footer-links-single{list-style:none;}
.footer-links-single li{margin-bottom:12px;}
.footer-links-single a{font-size:13.5px; color:#B9C0C5; display:flex; align-items:center; gap:5px;}
.footer-links-single a::before{content:"›"; color:var(--copper);}
.footer-links-single a:hover{color:#fff;}

/* ---------- 2026-10-19 图片Logo ---------- */
.logo img{display:block; height:32px; width:auto;}
.site-footer .logo img{background:#fff; border-radius:6px; padding:6px 10px; height:36px;}
.contact-panel-card .logo img{height:26px;}

/* ---------- 2026-10-19 PNG版Logo放大 ---------- */
.logo img{height:46px;}
.site-footer .logo img{background:none; border-radius:0; padding:0; height:44px;}
.contact-panel-card .logo img{height:30px;}

/* ---------- 2026-10-19 Footer Contact Us 地址/电话/邮箱加小图标 ---------- */
.footer-contact-block{font-size:13.5px; color:#B9C0C5; line-height:1.6;}
.footer-contact-block .fc-row{display:flex; gap:10px; align-items:flex-start; margin-bottom:12px;}
.footer-contact-block .fc-row:last-child{margin-bottom:0;}
.footer-contact-block .fc-icon{flex:0 0 auto; width:16px; height:16px; color:var(--copper); margin-top:3px;}
.footer-contact-block .fc-text{display:block; color:#B9C0C5;}
.footer-contact-block .fc-text strong{display:block; color:#fff; font-weight:600; line-height:1.4;}
.footer-contact-block .fc-text span{display:block; line-height:1.6;}
.footer-contact-block a.fc-text{color:#B9C0C5;}
.footer-contact-block a.fc-text:hover{color:#fff;}

/* ===== Guili1 深邃海军蓝 Corporate Navy Depth ===== */
:root{
  --graphite-900:#0C2440;
  --graphite-700:#16395E;
  --paper:#F5F7FA;
  --copper:#1560B8;
  --copper-light:#3E86D8;
  --steel:#4A6178;
  --ink:#1E2831;
  --muted:#5A6B7A;
  --line:#D8DFE8;
  --line-dark:#1E3A5C;
}
/* 深色板块：工厂介绍 + About（大文字板块整体深蓝底白字） */
.about, .brand-intro{background:var(--graphite-900) !important;}
.about .kicker, .brand-intro .kicker{color:var(--copper-light) !important;}
.about h2.display, .brand-intro h2.display{color:#FFFFFF !important;}
.about p, .brand-intro p{color:#C7D4E4 !important;}
.about .checklist li{color:#C7D4E4 !important;}
.about .checklist strong{color:#FFFFFF !important;}
.about .checklist .check{color:var(--copper-light) !important;}
.about .email-label{color:#8FA8C2 !important;}
.about .email-address a, .brand-intro .email-address a{color:#E7EFF8 !important;}
.about .squiggle path, .brand-intro .squiggle path{stroke:var(--copper-light) !important;}

/* ===== 板块间距收紧 ===== */
.section{padding:56px 0;}
.about{padding:56px 0 44px;}
.brand-intro{padding:52px 0;}
.cta{padding:60px 0;}
.feature-strip{padding-top:40px;}

/* ===== 按钮统一主色 ===== */
.btn-dark{background:var(--copper) !important; border-color:var(--copper) !important;}
.btn-dark:hover{background:var(--copper-light) !important; border-color:var(--copper-light) !important;}
.news-all-btn .btn-view-all{background:var(--copper);}
.news-all-btn .btn-view-all:hover{background:var(--copper-light);}

/* ===== 按钮回归深色中性（撤销统一主色，主色只留悬停） ===== */
.btn-primary{background:var(--graphite-900) !important; border-color:var(--graphite-900) !important; color:#fff;}
.btn-primary:hover{background:var(--copper) !important; border-color:var(--copper) !important;}
.btn-dark{background:var(--graphite-900) !important; border-color:var(--graphite-900) !important;}
.btn-dark:hover{background:var(--copper) !important; border-color:var(--copper) !important;}
.news-all-btn .btn-view-all{background:var(--graphite-900) !important;}
.news-all-btn .btn-view-all:hover{background:var(--copper) !important;}

/* 深色板块内的 Get a Quote 反白 */
.about .btn-primary, .brand-intro .btn-primary{background:#FFFFFF !important; border-color:#FFFFFF !important; color:var(--ink) !important;}
.about .btn-primary:hover, .brand-intro .btn-primary:hover{background:var(--copper) !important; border-color:var(--copper) !important; color:#fff !important;}

/* ===== 按钮全部跟随主色（默认主色，悬停亮一档，含导航按钮） ===== */
.nav-cta{background:var(--copper) !important;}
.nav-cta:hover{background:var(--copper-light) !important;}
.btn-primary,
.about .btn-primary, .brand-intro .btn-primary{
  background:var(--copper) !important; border-color:var(--copper) !important; color:#fff !important;
}
.btn-primary:hover,
.about .btn-primary:hover, .brand-intro .btn-primary:hover{
  background:var(--copper-light) !important; border-color:var(--copper-light) !important;
}
.btn-dark{background:var(--copper) !important; border-color:var(--copper) !important;}
.btn-dark:hover{background:var(--copper-light) !important; border-color:var(--copper-light) !important;}
.news-all-btn .btn-view-all{background:var(--copper) !important;}
.news-all-btn .btn-view-all:hover{background:var(--copper-light) !important;}
.btn-learn-more{background:var(--copper) !important; border-color:var(--copper) !important; color:#fff !important;}
.btn-learn-more:hover{background:var(--copper-light) !important; border-color:var(--copper-light) !important;}

/* ===== 数字卡板块与下方深色板块之间补下边距 ===== */
.feature-strip{padding-bottom:56px;}

/* ===== Send Us a Message 提交按钮跟随主色 ===== */
.contact-submit{background:var(--copper) !important;}
.contact-submit:hover{background:var(--copper-light) !important;}

/* ===== 背景底色跟随主题（淡蓝雾 #E9F1F9） ===== */
:root{--paper:#E9F1F9;}

/* ============================================================
   客户选定版修正（2026-10-20）
   ============================================================ */

/* ---------- 1. Products 下拉菜单锚定到主体容器居中 ---------- */
.nav{position:relative;}
.nav-dropdown:has(.mega-menu){position:static;}
.dropdown-menu.mega-menu{left:50%; transform:translate(-50%,6px); width:1280px; max-width:calc(100vw - 24px);}
.nav-dropdown:hover .dropdown-menu.mega-menu{transform:translate(-50%,0);}

/* ---------- 2. 联系板块信息卡移到图片左上区域 ---------- */
.contact-panel-card{top:26px; left:24px; right:auto; bottom:auto; max-width:min(74%, 320px);}

/* ---------- 3. Projects 右下角 View More ---------- */
.projects-more{display:flex; justify-content:flex-end; margin-top:26px;}
.view-more-link{
  display:inline-flex; align-items:center; gap:8px;
  color:var(--copper); font-size:14.5px; font-weight:600;
  border-bottom:1px solid transparent; padding-bottom:2px;
  transition:gap .2s ease, border-color .2s ease;
}
.view-more-link svg{transition:transform .2s ease;}
.view-more-link:hover{border-color:var(--copper); gap:12px;}
.view-more-link:hover svg{transform:translateX(3px);}

/* ---------- 信息卡位置微调：更贴近截图红框区域 ---------- */
.contact-panel-card{top:64px; left:48px;}

/* ---------- 下拉菜单居中：改用专用类（兼容所有浏览器，不依赖:has） ---------- */
.nav-dropdown-mega{position:static;}
.dropdown-menu.mega-menu{left:50% !important; right:auto !important; transform:translate(-50%,6px) !important;}
.nav-dropdown-mega:hover .dropdown-menu.mega-menu{transform:translate(-50%,0) !important;}

/* ---------- 信息卡改到图片左下角（截图红框位置） ---------- */
.contact-panel-card{top:auto; left:24px; bottom:24px; right:auto; max-width:min(70%, 320px);}

/* ---------- 修复：Products 悬停桥变全宽误触问题 ---------- */
.nav-dropdown-mega::after{display:none !important;}
.dropdown-menu.mega-menu{margin-top:0 !important;}

/* ---------- 下拉菜单层级提升：显示在页面最前 ---------- */
header{position:relative; z-index:100;}
.dropdown-menu{z-index:120 !important;}
