/* ===== ZUND 朝安科技 官網改版 - 全域樣式 ===== */
:root{
  --navy:#0b2d52;
  --navy-dark:#081f3a;
  --steel:#3a6ea5;
  --accent:#e2621d;
  --accent-dark:#c94f10;
  --ink:#1b2733;
  --gray-700:#48586b;
  --gray-400:#8b98a8;
  --line:#e2e7ee;
  --bg:#ffffff;
  --bg-soft:#f4f7fa;
  --bg-panel:#eef2f6;
  --radius:6px;
  --maxw:1120px;
  --shadow:0 12px 32px rgba(11,45,82,.10);
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:"Noto Sans TC","Barlow",-apple-system,"PingFang TC","Microsoft JhengHei",sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  text-wrap:pretty;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
a:hover{color:var(--accent);}
ul{list-style:none;}
section{position:relative;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px;}

.eyebrow{
  display:inline-block;
  font-family:"Barlow Condensed","Noto Sans TC",sans-serif;
  font-weight:600;
  letter-spacing:.22em;
  font-size:14px;
  color:var(--accent);
  text-transform:uppercase;
  margin-bottom:14px;
}
h1,h2,h3,h4{
  font-family:"Barlow Condensed","Noto Sans TC",sans-serif;
  font-weight:700;
  color:var(--navy);
  letter-spacing:.01em;
}
.section-title{
  font-size:clamp(30px,3.4vw,46px);
  line-height:1.25;
  margin-bottom:18px;
}
.section-lead{
  color:var(--gray-700);
  font-size:17px;
  max-width:760px;
}
.section-head{margin-bottom:56px;}
.section-head.center{text-align:center;margin-left:auto;margin-right:auto;}
.section-head.center .section-lead{margin-left:auto;margin-right:auto;}

.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:16px 34px;
  border-radius:2px;
  font-family:"Barlow Condensed",sans-serif;
  font-weight:600;
  font-size:19px;
  letter-spacing:.03em;
  border:2px solid transparent;
  cursor:pointer;
  transition:all .2s ease;
}
.btn-primary{background:var(--accent);color:#fff;}
.btn-primary:hover{background:var(--accent-dark);color:#fff;}
.btn-outline{border-color:rgba(255,255,255,.75);color:#fff;background:transparent;}
.btn-outline:hover{background:rgba(255,255,255,.12);color:#fff;}
.btn-outline-navy{border-color:var(--navy);color:var(--navy);background:transparent;}
.btn-outline-navy:hover{background:var(--navy);color:#fff;}

/* ---------- Header ---------- */
#site-header{
  position:relative;z-index:200;
  background:#ffffff;
  box-shadow:0 2px 14px rgba(11,45,82,.08);
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 32px;max-width:var(--maxw);margin:0 auto;
}
.logo img{height:46px;width:auto;}
.main-nav ul{display:flex;gap:38px;align-items:center;}
.main-nav a{
  color:var(--navy);font-family:"Barlow Condensed",sans-serif;
  font-size:18px;letter-spacing:.03em;font-weight:500;
  padding:6px 2px;border-bottom:2px solid transparent;
}
.main-nav a:hover{color:var(--navy);border-bottom-color:var(--accent);}
.nav-cta{
  background:var(--accent);color:#fff !important;padding:12px 24px;
  border-radius:2px;font-weight:600;
}
.nav-cta:hover{background:var(--accent-dark);}

/* Hamburger toggle */
.nav-toggle{
  display:none;width:44px;height:44px;border:none;background:transparent;
  cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:6px;
  z-index:210;
}
.nav-toggle span{
  display:block;width:26px;height:2px;background:var(--navy);border-radius:2px;
  transition:transform .25s ease,opacity .25s ease;
}
.nav-toggle.active span:nth-child(1){transform:translateY(8px) rotate(45deg);}
.nav-toggle.active span:nth-child(2){opacity:0;}
.nav-toggle.active span:nth-child(3){transform:translateY(-8px) rotate(-45deg);}

/* Mobile nav panel */
@media (max-width:1080px){
  .nav-toggle{display:flex;}
  .main-nav{
    display:block;position:fixed;top:0;right:0;height:100vh;width:min(78vw,320px);
    background:var(--navy-dark);padding:100px 34px 40px;
    transform:translateX(100%);transition:transform .3s ease;
    box-shadow:-10px 0 30px rgba(0,0,0,.3);
  }
  .main-nav.open{transform:translateX(0);}
  .main-nav ul{flex-direction:column;align-items:flex-start;gap:24px;}
  .main-nav a{font-size:20px;}
  .nav-cta{width:100%;text-align:center;}
  .nav-scrim{
    display:none;position:fixed;inset:0;background:rgba(8,31,58,.5);z-index:150;
  }
  .nav-scrim.open{display:block;}
}

/* ---------- Hero ---------- */
#hero{
  position:relative;height:676px;min-height:676px;
  display:flex;align-items:center;
  overflow:hidden;background:var(--navy-dark);
}
.hero-video-wrap{
  position:absolute;inset:0;z-index:0;overflow:hidden;
  /* 影片被瀏覽器擋下自動播放時的備援底圖 */
  background:var(--navy-dark) url("images/zund-g3-authorized.webp") center/cover no-repeat;
}
.hero-video-wrap iframe{
  position:absolute;top:50%;left:50%;
  width:177.8vh;height:56.3vw;
  min-width:100%;min-height:100%;
  transform:translate(-50%,-50%);
  pointer-events:none;
}
.hero-scrim{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(100deg,rgba(8,31,58,.88) 0%,rgba(8,31,58,.72) 42%,rgba(8,31,58,.42) 100%);
}
.hero-content{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;padding:0 32px;color:#fff;text-align:center;}
.hero-tag{
  font-family:"Barlow Condensed",sans-serif;letter-spacing:.28em;text-transform:uppercase;
  font-size:15px;color:#ffb385;margin-bottom:22px;font-weight:600;
}
.hero-title{
  font-size:clamp(22px,3vw,38px);line-height:1.3;color:#fff;margin-bottom:20px;max-width:none;
}
.hero-sub{font-size:20px;color:#dbe4ef;max-width:620px;margin:0 auto 14px;}
.hero-sub strong{color:#fff;}
.hero-actions{display:flex;gap:18px;margin-top:38px;flex-wrap:wrap;justify-content:center;}
.hero-scroll{
  position:absolute;bottom:34px;left:50%;transform:translateX(-50%);
  z-index:2;color:#cfd9e6;font-size:13px;letter-spacing:.2em;text-transform:uppercase;
  display:flex;flex-direction:column;align-items:center;gap:8px;
}
.hero-scroll .line{width:1px;height:34px;background:linear-gradient(#fff0,#fff);animation:scrolldrop 1.8s infinite;}
@keyframes scrolldrop{0%{opacity:0;transform:scaleY(.4);}50%{opacity:1;}100%{opacity:0;transform:scaleY(1);}}

/* ---------- Trust bar ---------- */
#trustbar{background:var(--navy);color:#fff;padding:20px 0;}
.trust-inner{
  display:flex;align-items:center;justify-content:center;gap:14px;
  text-align:center;font-size:16px;color:#c9d6e6;flex-wrap:wrap;
}
.trust-inner b{color:#fff;font-weight:700;}

/* ---------- Intro / About ---------- */
#intro{padding:110px 0 100px;background:var(--bg);}
.intro-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:flex-start;}
.intro-copy p{color:var(--gray-700);font-size:16.5px;margin-bottom:16px;}
.feature-list{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:8px;}
.feature-item{
  background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--radius);
  padding:26px 24px;
}
.feature-item .num{
  display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:50%;background:var(--navy);color:#fff;
  font-family:"Barlow Condensed",sans-serif;font-size:18px;font-weight:700;margin-bottom:14px;
}
.feature-item h4{font-size:19px;color:var(--navy);margin-bottom:6px;}
.feature-item p{color:var(--gray-700);font-size:14.5px;}

/* ---------- Models ---------- */
#models{padding:110px 0;background:var(--bg-soft);}
.model-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;}
.model-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;
  transition:transform .25s ease, box-shadow .25s ease;
}
.model-card:hover{transform:translateY(-6px);box-shadow:0 20px 44px rgba(11,45,82,.16);}
.model-media{aspect-ratio:4/3;overflow:hidden;background:var(--bg-panel);}
.model-media img{width:100%;height:100%;object-fit:cover;}
.model-body{padding:28px 26px 30px;flex:1;display:flex;flex-direction:column;}
.model-body h3{font-size:26px;color:var(--navy);margin-bottom:14px;}
.model-spec{font-size:14px;color:var(--gray-700);margin-bottom:10px;}
.model-spec b{color:var(--ink);font-weight:600;}
.model-tools{font-size:13.5px;color:var(--gray-400);margin-top:auto;padding-top:14px;border-top:1px dashed var(--line);line-height:1.7;}

/* ---------- Applications ---------- */
#applications{padding:110px 0;background:var(--bg);}
.app-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;}
.app-card{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:3/4;}
.app-card img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.app-card:hover img{transform:scale(1.08);}
.app-overlay{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,31,58,0) 40%,rgba(8,31,58,.92) 100%);
  display:flex;flex-direction:column;justify-content:flex-end;padding:24px 20px;color:#fff;
}
.app-overlay h4{color:#fff;font-size:22px;margin-bottom:8px;}
.app-overlay p{font-size:13.5px;color:#dbe4ef;}

/* ---------- Videos ---------- */
#videos{padding:110px 0;background:var(--navy-dark);color:#fff;}
#videos .section-title{color:#fff;}
#videos .section-lead{color:#b9c6d8;}
.video-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-bottom:44px;}
.video-card{border-radius:var(--radius);overflow:hidden;background:#0f2c4d;border:1px solid rgba(255,255,255,.08);}
.video-frame{aspect-ratio:16/9;background:#000;}
.video-frame iframe{width:100%;height:100%;border:0;}
.video-caption{padding:18px 20px;font-size:16px;font-weight:500;color:#e6ecf3;}
.videos-more{text-align:center;}

/* ---------- Authority / Distributor ---------- */
#authority{padding:110px 0;background:var(--bg-soft);}
.authority-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:flex-start;}
.authority-media{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);position:sticky;top:110px;}
.authority-copy h3{font-size:22px;color:var(--navy);margin:30px 0 10px;}
.authority-copy h3:first-child{margin-top:0;}
.authority-copy p{color:var(--gray-700);font-size:15.5px;margin-bottom:6px;}

/* ---------- Stats ---------- */
#stats{background:var(--navy);padding:70px 0;color:#fff;}
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;text-align:center;}
.stat-item img{height:56px;width:auto;margin:0 auto 18px;filter:brightness(0) invert(1);opacity:.9;}
.stat-num{font-family:"Barlow Condensed",sans-serif;font-size:52px;font-weight:700;color:var(--accent);line-height:1;}
.stat-label{color:#c9d6e6;font-size:16px;margin-top:10px;letter-spacing:.03em;}

/* ---------- Contact CTA ---------- */
#contact{padding:110px 0;background:var(--bg);}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:stretch;}
.contact-info{
  background:var(--navy);color:#fff;border-radius:var(--radius);padding:48px 44px;
  display:flex;flex-direction:column;justify-content:center;
}
.contact-info h3{color:#fff;font-size:30px;margin-bottom:10px;}
.contact-info .sub{color:#c9d6e6;margin-bottom:30px;font-size:15.5px;}
.contact-rows{display:grid;gap:18px;margin-bottom:34px;}
.contact-row{display:flex;gap:16px;align-items:flex-start;font-size:15.5px;color:#e6ecf3;}
.contact-row .label{color:#8fa5c0;min-width:88px;font-weight:600;letter-spacing:.02em;}
.contact-info .btn{align-self:flex-start;}
.map-frame{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);min-height:400px;}
.map-frame iframe{width:100%;height:100%;border:0;min-height:400px;}

/* ---------- Footer ---------- */
#site-footer{background:var(--navy-dark);color:#c9d6e6;padding:60px 0 26px;}
.footer-top{
  display:flex;justify-content:space-between;align-items:flex-start;gap:40px;
  padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,.12);flex-wrap:wrap;
}
.footer-brand img{height:44px;width:auto;filter:brightness(0) invert(1);margin-bottom:16px;}
.footer-brand p{max-width:460px;font-size:14.5px;color:#9fb0c4;}
.footer-nav{display:flex;gap:56px;flex-wrap:wrap;}
.footer-nav h5{color:#fff;font-family:"Barlow Condensed",sans-serif;font-size:16px;letter-spacing:.05em;margin-bottom:16px;}
.footer-nav ul{display:grid;gap:10px;}
.footer-nav a{font-size:14.5px;color:#9fb0c4;}
.footer-bottom{
  display:flex;justify-content:space-between;padding-top:24px;font-size:13px;color:#7d90a8;flex-wrap:wrap;gap:8px;
}

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .intro-grid,.authority-grid,.contact-grid{grid-template-columns:1fr;}
  .authority-media{position:static;}
  .model-cards{grid-template-columns:repeat(2,1fr);}
  .app-grid{grid-template-columns:repeat(2,1fr);}
  .video-grid{grid-template-columns:1fr 1fr;}
  .stats-grid{grid-template-columns:1fr;}
}
@media (max-width:680px){
  .feature-list{grid-template-columns:1fr;}
  .model-cards{grid-template-columns:1fr;}
  .app-grid{grid-template-columns:1fr;}
  .video-grid{grid-template-columns:1fr;}
  .footer-top{flex-direction:column;}
  .hero-actions{flex-direction:column;align-items:flex-start;}
}