:root{
    --bg:#ffffff; --bg2:#f2f6f3; --panel:#ffffff;
    --green:#0ea968; --green-d:#0b7a4b; --lime:#0ea968;
    --text:#152019; --muted:#5f6f65; --line:rgba(20,40,30,.12);
    --font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased}
  img{max-width:100%;display:block}
  a{color:inherit;text-decoration:none}
  .wrap{max-width:1240px;margin:0 auto;padding:0 24px}

  /* ── top bar ── */
  .topbar{background:#eef3f0;font-size:12.5px;color:var(--muted);border-bottom:1px solid var(--line)}
  .topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:36px}
  .topbar b{color:var(--green-d);font-weight:600}

  /* ── nav ── */
  .nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
  .nav .wrap{display:flex;align-items:center;height:72px;gap:32px}
  .nav .logo img{height:40px}
  .nav .links{display:flex;gap:26px;margin-left:auto;font-size:15px;color:#33403a}
  .nav .links a:hover{color:var(--green-d)}
  .btn{display:inline-flex;align-items:center;gap:8px;padding:12px 26px;border-radius:999px;font-weight:700;font-size:15px;transition:.2s;white-space:nowrap}
  .btn-solid{background:var(--green);color:#fff}
  .btn-solid:hover{background:#0cbd74;transform:translateY(-1px)}
  .btn-ghost{border:1.5px solid rgba(20,40,30,.3);color:var(--text)}
  .btn-ghost:hover{border-color:var(--green);color:var(--green-d)}
  .btn-ghost-light{border:1.5px solid rgba(255,255,255,.4);color:#fff}
  .btn-ghost-light:hover{border-color:#fff;color:#fff}
  .nav .cta{display:flex;gap:12px}

  /* ── hero ── */
  .hero{position:relative;height:min(92vh,780px);min-height:560px;overflow:hidden;background:#000}
  .slide{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease}
  .slide.active{opacity:1}
  .slide .bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.06)}
  .slide.active .bg{animation:kenburns 8s ease forwards}
  @keyframes kenburns{from{transform:scale(1.12)}to{transform:scale(1.02)}}
  .slide .vbg{position:absolute;inset:0;overflow:hidden;background:#000 url('assets/hero-factory.jpg') center/cover}
  .slide .vbg iframe{position:absolute;top:50%;left:50%;width:100vw;height:56.25vw;min-height:100%;min-width:177.78vh;transform:translate(-50%,-50%);pointer-events:none;border:0}
  .slide .shade{position:absolute;inset:0;background:linear-gradient(100deg,rgba(4,8,6,.88) 0%,rgba(4,8,6,.55) 45%,rgba(4,8,6,.15) 75%)}
  .slide .shade2{position:absolute;inset:0;background:linear-gradient(0deg,rgba(4,8,6,.7),transparent 40%)}
  .hero-copy{position:absolute;inset:0;display:flex;align-items:center;z-index:2}
  .eyebrow{display:inline-block;font-size:13px;letter-spacing:.22em;font-weight:700;color:#35c37e;margin-bottom:18px}
  .hero h1{font-size:clamp(40px,5.6vw,76px);line-height:1.04;font-weight:900;letter-spacing:-.01em;max-width:12em;color:#fff}
  .hero h1 .hl{color:#35c37e}
  .hero p.lead{margin:20px 0 32px;font-size:clamp(16px,1.6vw,19px);color:#d9e4dd;max-width:34em}
  .hero .cta{display:flex;gap:14px;flex-wrap:wrap}
  .dots{position:absolute;bottom:34px;left:0;right:0;z-index:3}
  .dots .wrap{display:flex;gap:10px;padding-left:210px}
  .dot{width:34px;height:4px;border-radius:4px;background:rgba(255,255,255,.28);cursor:pointer;transition:.3s;border:0;padding:0}
  .dot.active{background:var(--green);width:52px}
  .hero-num{position:absolute;right:48px;bottom:24px;z-index:3;font-size:13px;letter-spacing:.2em;color:rgba(255,255,255,.55)}

  /* ── stats ── */
  .stats{background:var(--bg2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .stats .wrap{display:grid;grid-template-columns:repeat(4,1fr);padding:34px 24px;gap:24px}
  .stat{border-left:1px solid var(--line);padding-left:22px}
  .stat:first-child{border-left:0;padding-left:0}
  .stat .n{font-size:30px;font-weight:900;color:var(--text)}
  .stat .n em{font-style:normal;color:var(--green-d)}
  .stat .l{font-size:13.5px;color:var(--muted);margin-top:4px}

  /* ── sections ── */
  section.block{padding:96px 0}
  .kicker{font-size:13px;letter-spacing:.22em;font-weight:700;color:var(--green-d);margin-bottom:14px}
  h2.sec{font-size:clamp(30px,3.6vw,48px);font-weight:900;line-height:1.12;letter-spacing:-.01em;margin-bottom:16px}
  .sec-sub{color:var(--muted);font-size:17px;max-width:44em;margin-bottom:48px}

  /* ── products ── */
  .pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
  .pcard{position:relative;border-radius:16px;overflow:hidden;background:var(--panel);border:1px solid var(--line);box-shadow:0 6px 24px rgba(20,40,30,.06);transition:.25s}
  .pcard:hover{transform:translateY(-6px);border-color:rgba(14,169,104,.55);box-shadow:0 14px 34px rgba(20,40,30,.1)}
  .pcard .ph{aspect-ratio:4/3;overflow:hidden}
  .pcard .ph img{width:100%;height:100%;object-fit:cover;transition:.5s}
  .pcard:hover .ph img{transform:scale(1.07)}
  .pcard .pb{padding:18px 20px 20px}
  .pcard .pb h3{font-size:17px;font-weight:800;margin-bottom:6px}
  .pcard .pb p{font-size:13.5px;color:var(--muted)}
  .pcard .go{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;font-size:18px;color:#fff;opacity:0;transition:.25s}
  .pcard:hover .go{opacity:1}

  /* ── factory ── */
  .factory{background:var(--bg2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .frow{display:grid;grid-template-columns:1.05fr 1fr;gap:64px;align-items:center}
  .fimg{border-radius:20px;overflow:hidden;border:1px solid var(--line);position:relative}
  .fimg img{width:100%}
  .play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
  .play span{width:84px;height:84px;border-radius:50%;background:var(--green);display:flex;align-items:center;justify-content:center;font-size:30px;color:#04120a;box-shadow:0 12px 40px rgba(29,180,105,.45);transition:.25s}
  .play:hover span{transform:scale(1.08)}
  .flist{list-style:none;margin:28px 0 36px;display:grid;gap:16px}
  .flist li{display:flex;gap:14px;align-items:flex-start;font-size:15.5px;color:#33403a}
  .flist .tick{flex:0 0 26px;height:26px;border-radius:50%;background:rgba(14,169,104,.14);color:var(--green-d);display:flex;align-items:center;justify-content:center;font-weight:900}

  /* ── process ── */
  .steps{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:8px}
  .step{padding:28px 20px;border-left:1px solid var(--line);position:relative}
  .step:first-child{border-left:0}
  .step .no{font-size:13px;font-weight:800;color:var(--green);letter-spacing:.15em;margin-bottom:10px}
  .step h3{font-size:17px;font-weight:800;margin-bottom:8px}
  .step p{font-size:13.5px;color:var(--muted)}

  /* ── CTA band ── */
  .ctaband{background:linear-gradient(120deg,#0a6b3c,#10a35e 70%);border-top:1px solid var(--line);padding:88px 0;text-align:center}
  .ctaband h2{font-size:clamp(30px,4vw,52px);font-weight:900;margin-bottom:14px;color:#fff}
  .ctaband h2 .hl{color:#eafff3}
  .ctaband p{color:rgba(255,255,255,.88);font-size:17px;margin-bottom:34px}
  .ctaband .cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
  .ctaband .btn-solid{background:#fff;color:#0a6b3c}
  .ctaband .btn-solid:hover{background:#eafff3}

  footer{background:#0b0e0d;border-top:1px solid var(--line);padding:40px 0;color:#93a39a;font-size:13.5px}
  footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

  .draft-tag{position:fixed;bottom:18px;left:18px;z-index:99;background:#f5b301;color:#201500;font-size:12px;font-weight:800;padding:8px 14px;border-radius:8px;letter-spacing:.08em}

  @media(max-width:960px){
    .nav .links{display:none}
    .pgrid{grid-template-columns:repeat(2,1fr)}
    .frow{grid-template-columns:1fr;gap:36px}
    .steps{grid-template-columns:1fr 1fr}
    .step{border-left:0;border-top:1px solid var(--line)}
    .stats .wrap{grid-template-columns:1fr 1fr}
    .stat{border-left:0;padding-left:0}
    .dots .wrap{padding-left:24px}
    .draft-tag{font-size:10px;padding:6px 10px}
  }

/* ---- site footer with nav + inquiry form ---- */
.sitefoot{background:#0b0e0d;color:#c6d2cb;margin-top:0}
.fgrid{display:grid;grid-template-columns:1.15fr .85fr .85fr 1.05fr 1.35fr;gap:48px;padding:72px 0 56px}
.fbrand img{height:44px;margin-bottom:18px}
.fbrand p{font-size:14px;color:#93a39a;line-height:1.7;margin-bottom:18px;max-width:24em}
.fcerts{display:flex;gap:8px;flex-wrap:wrap}
.fcerts span{font-size:11.5px;font-weight:700;letter-spacing:.06em;border:1px solid #2a352f;border-radius:999px;padding:6px 13px;color:#9fe0bd}
.sitefoot h4{color:#fff;font-size:13px;letter-spacing:.14em;font-weight:800;margin-bottom:20px}
.flinklist{list-style:none;display:grid;gap:12px}
.flinklist a{color:#aebbb4;font-size:14.5px}
.flinklist a:hover{color:#35c37e}
.ffrm{display:grid;gap:12px}
.ffrm input,.ffrm textarea{background:#141a17;border:1px solid #263029;border-radius:10px;color:#eef4f0;font-size:14px;padding:12px 15px;width:100%;font-family:inherit}
.ffrm input::placeholder,.ffrm textarea::placeholder{color:#6f7f76}
.ffrm input:focus,.ffrm textarea:focus{outline:none;border-color:var(--green)}
.ffrm textarea{resize:vertical;min-height:84px}
.ffrm button{background:var(--green);color:#fff;border:0;border-radius:10px;font-weight:800;font-size:14.5px;padding:13px;cursor:pointer;letter-spacing:.03em}
.ffrm button:hover{background:var(--green-d)}
.fnote{font-size:12.5px;color:#7e8d85}
.fbottom{border-top:1px solid #1c241f;padding:22px 0}
.fbottom .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px;color:#7e8d85}
@media(max-width:960px){.fgrid{grid-template-columns:1fr 1fr;gap:36px}.fgrid .fform{grid-column:1/-1}}

/* ---- site footer with nav + inquiry form ---- */
.sitefoot{background:#0b0e0d;color:#c6d2cb}
.fgrid{display:grid;grid-template-columns:1.15fr .85fr .85fr 1.05fr 1.35fr;gap:48px;padding:72px 0 56px}
.fbrand img{height:44px;margin-bottom:18px}
.fbrand p{font-size:14px;color:#93a39a;line-height:1.7;margin-bottom:18px;max-width:24em}
.fcerts{display:flex;gap:8px;flex-wrap:wrap}
.fcerts span{font-size:11.5px;font-weight:700;letter-spacing:.06em;border:1px solid #2a352f;border-radius:999px;padding:6px 13px;color:#9fe0bd}
.sitefoot h4{color:#fff;font-size:13px;letter-spacing:.14em;font-weight:800;margin-bottom:20px}
.flinklist{list-style:none;display:grid;gap:12px}
.flinklist a{color:#aebbb4;font-size:14.5px}
.flinklist a:hover{color:#35c37e}
.ffrm{display:grid;gap:12px}
.ffrm input,.ffrm textarea{background:#141a17;border:1px solid #263029;border-radius:10px;color:#eef4f0;font-size:14px;padding:12px 15px;width:100%;font-family:inherit}
.ffrm input::placeholder,.ffrm textarea::placeholder{color:#6f7f76}
.ffrm input:focus,.ffrm textarea:focus{outline:none;border-color:var(--green)}
.ffrm textarea{resize:vertical;min-height:84px}
.ffrm button{background:var(--green);color:#fff;border:0;border-radius:10px;font-weight:800;font-size:14.5px;padding:13px;cursor:pointer;letter-spacing:.03em}
.ffrm button:hover{background:var(--green-d)}
.fnote{font-size:12.5px;color:#7e8d85}
.fbottom{border-top:1px solid #1c241f;padding:22px 0}
.fbottom .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px;color:#7e8d85}
@media(max-width:960px){.fgrid{grid-template-columns:1fr 1fr;gap:36px}.fform{grid-column:1/-1}}
  @media(max-width:640px){.topbar .wrap{flex-wrap:wrap;height:auto;padding:8px 0;gap:2px 14px;font-size:11.5px}}

/* product photo gallery with thumbnails */
.gallery .galmain{aspect-ratio:1/1;object-fit:cover;display:block}
.gthumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:12px;background:#fff;border-top:1px solid var(--line)}
.gthumbs img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:10px;cursor:pointer;border:2px solid transparent;opacity:.65;transition:.2s}
.gthumbs img.on{border-color:var(--green);opacity:1}

.fsocial{display:flex;gap:10px;margin-top:18px}
.fsocial a{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);transition:.2s}
.fsocial a:hover{background:var(--green);border-color:var(--green);transform:translateY(-2px)}
.fsocial svg{width:17px;height:17px;fill:#fff}