:root {
  color: #183d2a;
  background: #f5f6f2;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-synthesis: none;
  scroll-behavior: smooth;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.wrap { width: min(100% - 96px, 1280px); margin-inline: auto; }

.site-header {
  position: absolute;
  z-index: 2;
  inset: 0 0 auto;
  height: 84px;
  padding: 0 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,.35);
}
.wordmark { display: inline-flex; align-items: center; gap: 11px; white-space: nowrap; }
.wordmark-mark { display: grid; place-items: center; width: 34px; height: 34px; border: 1.5px solid currentColor; border-radius: 50%; font-family: serif; font-size: 19px; line-height: 1; }
.wordmark-name { font-size: 19px; font-weight: 700; }
.site-header nav { display: flex; align-items: center; gap: 38px; font-size: 14px; font-weight: 500; }
.site-header nav a { transition: opacity .2s ease; }
.site-header nav a:hover { opacity: .7; }
.site-header .nav-cta { padding: 11px 17px; border: 1px solid rgba(255,255,255,.8); }
.nav-cta span, .hero-link span, .text-link span { margin-left: 10px; }

.hero { position: relative; color: #fff; background: #183d2a; }
.hero-track { display: flex; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
.hero-track::-webkit-scrollbar { display: none; }
.hero-slide { position: relative; display: flex; flex: 0 0 100%; width: 100%; min-height: clamp(570px, 84svh, 790px); scroll-snap-align: start; background-position: center; background-size: cover; background-repeat: no-repeat; }
.hero-slide-agriculture { background-color: #527c39; background-image: url('https://media.cnyyz.cn/platform/official-site/2026/10/F1R-ZTQARZTXBM0N4.webp?imageMogr2/thumbnail/1600x/format/webp/quality/78'); background-position: center 52%; }
.hero-slide-technology { background-color: #4e6674; background-image: url('https://media.cnyyz.cn/platform/official-site/2026/10/F1R-A51D2M5VFCNH2.webp?imageMogr2/thumbnail/1600x/format/webp/quality/78'); }
.hero-slide-biology { background-color: #48546a; background-image: url('https://media.cnyyz.cn/platform/official-site/2026/10/F1R-8XJG7GZDXW0Y6.webp?imageMogr2/thumbnail/1600x/format/webp/quality/78'); }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,40,24,.72) 0%, rgba(10,40,24,.39) 52%, rgba(10,40,24,.06) 100%); }
.hero-slide-technology .hero-shade { background: linear-gradient(90deg, rgba(19,37,49,.82) 0%, rgba(19,37,49,.48) 48%, rgba(19,37,49,.05) 100%); }
.hero-slide-biology .hero-shade { background: linear-gradient(90deg, rgba(22,30,40,.83) 0%, rgba(22,30,40,.48) 48%, rgba(22,30,40,.08) 100%); }
.hero-content { position: relative; padding-top: 176px; padding-bottom: 105px; align-self: end; }
.eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .22em; margin: 0 0 22px; }
h1, h2, p { margin-top: 0; }
h1 { font-size: 84px; font-weight: 600; line-height: 1.15; margin-bottom: 15px; }
.hero-slide h2 { font-size: 84px; font-weight: 600; line-height: 1.15; margin-bottom: 15px; }
.hero-lead { font-size: 32px; font-weight: 500; margin-bottom: 20px; }
.hero-detail { font-size: 16px; line-height: 1.9; color: rgba(255,255,255,.9); margin-bottom: 34px; }
.hero-link { display: inline-flex; align-items: center; min-height: 48px; border-bottom: 1px solid #fff; font-size: 14px; font-weight: 600; }
.hero-controls { position: absolute; z-index: 1; right: 48px; bottom: 36px; display: flex; align-items: center; gap: 15px; }
.hero-arrow { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; color: #fff; background: transparent; border: 1px solid rgba(255,255,255,.8); border-radius: 50%; font: inherit; font-size: 18px; cursor: pointer; }
.hero-arrow:disabled { opacity: .35; cursor: default; }
.hero-dots { display: flex; align-items: center; gap: 8px; }
.hero-dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.48); cursor: pointer; }
.hero-dot.is-active { width: 19px; border-radius: 4px; background: #fff; }

.section-pad { padding-block: 116px; }
.section-label { display: flex; align-items: center; gap: 13px; color: #56834c; font-size: 13px; font-weight: 600; white-space: nowrap; }
.label-line { width: 32px; height: 1px; background: currentColor; flex: none; }
.intro { background: #f5f6f2; }
.intro-grid { display: grid; grid-template-columns: 34% 1fr; gap: 36px; }
.intro h2, .produce h2, .miniapp h2 { font-size: 50px; font-weight: 600; line-height: 1.35; margin-bottom: 27px; }
.intro p { max-width: 620px; color: #586a5a; font-size: 17px; line-height: 2; margin: 0; }

.produce { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); min-height: 580px; background: #e7ede3; }
.produce-image { min-height: 580px; background: #a1ae85 url('https://media.cnyyz.cn/platform/official-site/2026/10/F1R-2EA7WANHN2VSG.webp?imageMogr2/thumbnail/1080x/format/webp/quality/75') center / cover no-repeat; }
.produce-copy { align-self: center; padding: 70px clamp(45px, 8vw, 135px); }
.produce-copy .section-label { margin-bottom: 38px; }
.produce p { max-width: 400px; color: #586a5a; font-size: 16px; line-height: 1.9; margin-bottom: 32px; }
.text-link { border-bottom: 1px solid currentColor; padding-bottom: 8px; font-size: 14px; font-weight: 600; }

.miniapp { background: #fff; }
.miniapp-grid { display: grid; grid-template-columns: 1fr 330px; align-items: center; gap: 48px; }
.miniapp .section-label { margin-bottom: 35px; }
.miniapp p { color: #586a5a; font-size: 17px; line-height: 1.9; }
.qr-frame { justify-self: end; width: 290px; padding: 14px; background: #fff; border: 1px solid #e0e8dd; box-shadow: 0 18px 45px rgba(20,61,40,.08); }
.qr-frame img { width: 100%; height: auto; }

.site-footer { color: #d8e8da; background: #183d2a; }
.footer-main { min-height: 205px; padding-block: 47px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.footer-brand { color: #fff; font-size: 27px; font-weight: 600; }
.footer-main p { margin: 12px 0 0; font-size: 14px; }
.footer-main a { font-size: 14px; }
.footer-bottom { min-height: 70px; border-top: 1px solid rgba(255,255,255,.22); display: flex; align-items: center; gap: 28px; font-size: 12px; }
.filing-link { display: inline-flex; align-items: center; gap: 7px; }
.filing-icon { display: inline-grid; place-items: center; width: 16px; height: 18px; border: 1px solid currentColor; border-radius: 3px 3px 6px 6px; font-size: 10px; line-height: 1; }
a:focus-visible { outline: 2px solid #dbe894; outline-offset: 4px; }

@media (min-width: 701px) and (max-width: 1024px) {
  .wrap { width: min(100% - 64px, 900px); }
  .site-header { padding-inline: 32px; }
  .section-pad { padding-block: 90px; }
  h1, .hero-slide h2 { font-size: 64px; }
  .hero-lead { font-size: 28px; }
  .intro h2, .produce h2, .miniapp h2 { font-size: 42px; }
  .produce-copy { padding-inline: 46px; }
  .produce-image { min-height: 510px; }
  .miniapp-grid { grid-template-columns: minmax(0, 1fr) 260px; }
  .qr-frame { width: 250px; }
}

@media (max-width: 700px) {
  .wrap { width: min(100% - 40px, 560px); }
  .site-header { height: 68px; padding-inline: 20px; }
  .wordmark-mark { width: 30px; height: 30px; font-size: 17px; }
  .wordmark-name { font-size: 17px; }
  .site-header nav { gap: 0; }
  .site-header nav a:not(.nav-cta) { display: none; }
  .site-header .nav-cta { padding: 8px 10px; font-size: 12px; }
  .hero-slide { min-height: clamp(560px, 82svh, 720px); }
  .hero-slide-agriculture { background-image: url('https://media.cnyyz.cn/platform/official-site/2026/10/F1R-ZTQARZTXBM0N4.webp?imageMogr2/thumbnail/760x/format/webp/quality/75'); background-position: 62% center; }
  .hero-slide-technology { background-image: url('https://media.cnyyz.cn/platform/official-site/2026/10/F1R-A51D2M5VFCNH2.webp?imageMogr2/thumbnail/760x/format/webp/quality/75'); background-position: 60% center; }
  .hero-slide-biology { background-image: url('https://media.cnyyz.cn/platform/official-site/2026/10/F1R-8XJG7GZDXW0Y6.webp?imageMogr2/thumbnail/760x/format/webp/quality/75'); background-position: 56% center; }
  .hero-shade { background: linear-gradient(90deg, rgba(10,40,24,.7), rgba(10,40,24,.28)); }
  .hero-content { padding-top: 135px; padding-bottom: 100px; }
  .eyebrow { font-size: 10px; margin-bottom: 18px; }
  h1 { font-size: 55px; }
  .hero-slide h2 { font-size: 55px; }
  .hero-lead { font-size: 26px; }
  .hero-detail { font-size: 14px; }
  .hero-controls { right: 20px; bottom: 20px; }
  .section-pad { padding-block: 76px; }
  .intro-grid { grid-template-columns: 1fr; gap: 28px; }
  .intro h2, .produce h2, .miniapp h2 { font-size: 34px; }
  .intro p, .miniapp p { font-size: 15px; }
  .produce { grid-template-columns: 1fr; }
  .produce-image { min-height: 300px; }
  .produce-image { background-image: url('https://media.cnyyz.cn/platform/official-site/2026/10/F1R-2EA7WANHN2VSG.webp?imageMogr2/thumbnail/760x/format/webp/quality/75'); }
  .produce-copy { padding: 60px 20px 70px; width: min(100%, 600px); margin: auto; }
  .produce-copy .section-label { margin-bottom: 27px; }
  .miniapp-grid { grid-template-columns: 1fr; gap: 22px; }
  .miniapp .section-label { margin-bottom: 27px; }
  .qr-frame { justify-self: start; width: 230px; }
  .footer-main { min-height: 170px; }
  .footer-brand { font-size: 23px; }
  .footer-bottom { align-items: start; flex-wrap: wrap; gap: 12px 24px; padding-block: 22px; }
}

@media (max-width: 360px) {
  .wordmark { gap: 6px; }
  .wordmark-name { font-size: 15px; }
  .site-header .nav-cta { padding: 7px 8px; }
  .eyebrow { font-size: 9px; }
  h1, .hero-slide h2 { font-size: 48px; }
}

@media (orientation: landscape) and (max-height: 600px) {
  .site-header { height: 56px; }
  .hero-slide { min-height: 88svh; }
  .hero-content { padding-top: 76px; padding-bottom: 26px; }
  .eyebrow { margin-bottom: 7px; font-size: 10px; }
  h1, .hero-slide h2 { margin-bottom: 4px; font-size: 40px; }
  .hero-lead { margin-bottom: 5px; font-size: 18px; }
  .hero-detail { margin-bottom: 8px; font-size: 12px; line-height: 1.45; }
  .hero-link { min-height: 25px; font-size: 12px; }
  .hero-controls { bottom: 10px; }
}

@media (prefers-reduced-motion: reduce) { :root { scroll-behavior: auto; } }
