:root {
  --ink: #17343d;
  --ink-soft: #294c57;
  --paper: #f7fbfc;
  --paper-bright: #fff;
  --blue: #79bdd2;
  --blue-deep: #2c7085;
  --gold: #b79d67;
  --mist: #eaf5f8;
  --mist-blue: #dceef3;
  --line-dark: rgba(23,52,61,.13);
  --line-light: rgba(23,52,61,.11);
  --serif: "Iowan Old Style", "Palatino Linotype", "Noto Serif CJK SC", "Songti SC", "Yu Mincho", "Hiragino Mincho ProN", serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans CJK SC", "PingFang SC", "Hiragino Sans", "Yu Gothic", "Microsoft YaHei", Arial, sans-serif;
}

html, body { background: #fff; }
body { font-family: var(--sans); font-size: 1rem; }
html[lang="zh-Hans"] h1,
html[lang="zh-Hans"] h2,
html[lang="zh-Hans"] h3,
html[lang="ja"] h1,
html[lang="ja"] h2,
html[lang="ja"] h3 { font-family: var(--sans); font-weight: 400; letter-spacing: -.025em; }
.eyebrow { font-size: .82rem; letter-spacing: .16em; }
.section-index { font-size: .82rem; }

.site-header,
.site-header.scrolled {
  color: var(--ink);
  background: rgba(255,255,255,.94);
  border-color: rgba(23,52,61,.1);
  backdrop-filter: blur(16px);
}

.hero {
  min-height: min(92svh,60rem);
  color: #fff;
  background: #12262c;
}
.hero-video { filter: none; }
.hero-scrim {
  background: linear-gradient(90deg,rgba(5,17,20,.48) 0%,rgba(5,17,20,.2) 47%,transparent 78%);
}
.hero-grain { opacity: .035; }
.hero-content { width: min(78rem,88vw); }
.hero h1 { max-width: 50rem; font-size: clamp(3.3rem,6.7vw,7rem); }
.hero-copy, .hero-footer { color: rgba(255,255,255,.82); }
.origin-content>p:not(.eyebrow), .origin-facts dd,
.origin-content small, .quality-copy p, .metric small, .research-visual span,
.quality-disclaimer p, .company-body>p, .company-details dd, .process-list p,
.contact-copy>p:not(.eyebrow), .form-note { color: rgba(23,52,61,.67); }
.hero-aside .vertical-rule { background: rgba(255,255,255,.48); }
.text-link { border-color: rgba(255,255,255,.48); }
.button-light { color: #fff; background: var(--blue-deep); }
.button-light:hover { color: var(--ink); background: var(--mist-blue); }

.intro, .products, .recognition, .factory-film { background: #fff; }
.origin, .quality, .company, .process, .contact {
  color: var(--ink);
  background: var(--mist);
}
.origin, .origin-media { min-height: 48rem; }
.origin-media::after { background: linear-gradient(90deg,transparent 70%,rgba(234,245,248,.3)); }
.origin-content { background: linear-gradient(145deg,#eaf5f8 0%,#f7fbfc 100%); }
.origin-facts, .metrics, .document-list, .quality-disclaimer p, .company-details,
.process-list, .process-list li, .contact, .site-footer { border-color: var(--line-dark); }
.section-index.light, .metric p, .company-details dt, .process-list li>span { color: var(--blue-deep); }

.factory-film {
  display: grid;
  grid-template-columns: minmax(18rem,.62fr) minmax(0,1.38fr);
  gap: 7vw;
  align-items: center;
}
.factory-film-copy h2 {
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(3rem,5vw,5.7rem);
  font-weight: 400;
  letter-spacing: -.045em;
  line-height: .98;
}
.factory-film-copy>p:not(.eyebrow) {
  max-width: 34rem;
  margin: 2rem 0 0;
  color: rgba(23,52,61,.68);
  font-size: 1.05rem;
}
.factory-film-media { margin: 0; }
.factory-film-media video {
  width: 100%;
  aspect-ratio: 8/5;
  object-fit: cover;
  background: var(--mist-blue);
  box-shadow: 0 1.8rem 4rem rgba(44,112,133,.12);
}
.factory-film-media figcaption {
  margin-top: .85rem;
  color: rgba(23,52,61,.5);
  font-size: .7rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.product-grid { background: rgba(44,112,133,.14); border-color: rgba(44,112,133,.14); }
.product-card, .product-card:nth-child(1), .product-card:nth-child(4) { background: #f6fafb; }
.product-card:nth-child(2), .product-card:nth-child(3) { background: #edf6f8; }
.metrics { background: rgba(255,255,255,.48); }
.metric { border-color: var(--line-dark); }
.evidence-grid { background: #f7fbfc; }
.research-visual::before { border-color: rgba(44,112,133,.28); }
.document-list a:hover { color: var(--blue-deep); }

.recognition {
  position: relative;
  background: linear-gradient(135deg,#fff 0%,#f3fafb 100%);
}
.recognition::before {
  content: "AWARD";
  position: absolute;
  top: 4.5rem;
  right: 5vw;
  color: rgba(44,112,133,.055);
  font-family: var(--serif);
  font-size: clamp(5rem,14vw,13rem);
  letter-spacing: .04em;
}
.award-figure {
  position: relative;
  padding: clamp(1.4rem,3vw,3rem);
  background: #fff;
  border: 1px solid rgba(183,157,103,.32);
  box-shadow: 0 1.4rem 4rem rgba(44,112,133,.1);
}
.award-figure img { box-shadow: none; }
.award-seal {
  position: absolute;
  z-index: 2;
  top: -1.3rem;
  right: 2rem;
  padding: .7rem 1rem;
  color: #fff;
  background: var(--gold);
  font-size: .67rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.awards-history { grid-column: 1 / -1; margin-top: 2rem; }
.awards-grid {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  border-top: 1px solid var(--line-dark);
  border-left: 1px solid var(--line-dark);
}
.awards-grid article {
  min-height: 16rem;
  padding: 2rem;
  background: rgba(255,255,255,.72);
  border-right: 1px solid var(--line-dark);
  border-bottom: 1px solid var(--line-dark);
}
.awards-grid time {
  display: block;
  margin-bottom: 2.6rem;
  color: var(--blue-deep);
  font-family: var(--serif);
  font-size: 1.8rem;
}
.awards-grid h3 {
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(1.35rem,1.8vw,1.8rem);
  font-weight: 400;
  line-height: 1.18;
}
.awards-grid p {
  margin: 1rem 0 0;
  color: rgba(23,52,61,.65);
  font-size: .92rem;
  line-height: 1.65;
}
.award-source { margin: 1rem 0 0; color: rgba(23,52,61,.5); font-size: .82rem; }

.award-gallery { grid-column: 1 / -1; margin-top: clamp(4rem,8vw,7rem); overflow: hidden; }
.award-gallery-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 1.5rem; }
.award-gallery-heading h3 { max-width: 16ch; margin: .7rem 0 0; font-family: var(--serif); font-size: clamp(2rem,4vw,4rem); font-weight: 400; line-height: 1.02; }
.award-gallery-heading>p { max-width: 30rem; margin: 0; color: rgba(23,52,61,.55); font-size: .8rem; letter-spacing: .05em; }
.award-gallery-track { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(18rem,34vw); gap: 1rem; padding: .5rem 0 1.5rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: rgba(44,112,133,.3) transparent; }
.award-gallery-card { display: flex; min-height: 31rem; padding: 0; overflow: hidden; flex-direction: column; color: var(--ink); background: rgba(255,255,255,.82); border: 1px solid var(--line-dark); cursor: zoom-in; scroll-snap-align: start; text-align: left; transition: transform .55s var(--ease),box-shadow .55s var(--ease); }
.award-gallery-card:hover { transform: translateY(-.45rem); box-shadow: 0 1.5rem 4rem rgba(44,112,133,.13); }
.award-gallery-image { display: grid; min-height: 24rem; flex: 1; place-items: center; overflow: hidden; background: linear-gradient(145deg,#fff,#eef7f8); }
.award-gallery-image img { width: 100%; height: 100%; object-fit: contain; transition: transform .8s var(--ease); }
.award-gallery-card.emblem .award-gallery-image img,.award-gallery-card.portrait .award-gallery-image img { width: 78%; height: 78%; }
.award-gallery-card:hover img { transform: scale(1.025); }
.award-gallery-meta { display: grid; grid-template-columns: 5rem 1fr; gap: 1rem; align-items: center; min-height: 6.5rem; padding: 1.25rem 1.4rem; border-top: 1px solid var(--line-dark); }
.award-gallery-meta b { color: var(--blue-deep); font-family: var(--serif); font-size: 1.05rem; font-weight: 400; }
.award-gallery-meta span { font-family: var(--serif); font-size: 1.1rem; line-height: 1.25; }
.award-gallery-source { margin: .8rem 0 0; color: rgba(23,52,61,.5); font-size: .78rem; }
.award-lightbox { width: min(94vw,70rem); max-height: 92vh; padding: 1rem; color: var(--ink); background: rgba(250,253,253,.98); border: 0; box-shadow: 0 2rem 7rem rgba(9,36,45,.35); }
.award-lightbox::backdrop { background: rgba(8,31,38,.78); backdrop-filter: blur(8px); }
.award-lightbox img { display: block; width: 100%; max-height: 76vh; object-fit: contain; }
.award-lightbox-footer { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.award-lightbox p { margin: .8rem 0 0 .35rem; font-family: var(--serif); }
.award-lightbox .text-link { white-space: nowrap; }
.award-lightbox-close { position: absolute; top: .8rem; right: .8rem; z-index: 2; width: 2.7rem; height: 2.7rem; color: var(--ink); background: rgba(255,255,255,.9); border: 1px solid var(--line-dark); border-radius: 50%; cursor: pointer; font-size: 1.5rem; }

.market-list span { border-color: rgba(44,112,133,.24); background: rgba(255,255,255,.46); }
.contact-watermark { color: rgba(44,112,133,.05); }
.contact-form label span { color: rgba(23,52,61,.62); }
.contact-form input, .contact-form textarea { color: var(--ink); border-color: rgba(23,52,61,.28); }
.site-footer { color: rgba(23,52,61,.56); background: #fff; }
.footer-brand, .site-footer a { color: var(--ink); }

/* Subtle motion and water-light details */
.scroll-progress {
  position: fixed;
  z-index: 180;
  top: 0;
  right: 0;
  left: 0;
  height: 3px;
  pointer-events: none;
}
.scroll-progress span {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg,#8ed5e7,#2c7085);
  transform: scaleX(0);
  transform-origin: left;
  will-change: transform;
}
.cursor-aura {
  position: fixed;
  z-index: 0;
  width: 26rem;
  height: 26rem;
  left: var(--pointer-x,50vw);
  top: var(--pointer-y,50vh);
  border-radius: 50%;
  background: radial-gradient(circle,rgba(121,189,210,.11),transparent 68%);
  transform: translate(-50%,-50%);
  pointer-events: none;
  transition: left .7s var(--ease),top .7s var(--ease);
}
main, .site-header, .site-footer { position: relative; z-index: 1; }

.hero::after {
  content: "";
  position: absolute;
  z-index: 1;
  right: -12vw;
  bottom: -34vw;
  width: 68vw;
  height: 68vw;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 43% 57% 58% 42%;
  box-shadow: 0 0 0 5vw rgba(255,255,255,.025),0 0 0 10vw rgba(255,255,255,.018);
  animation: water-orbit 18s linear infinite;
  pointer-events: none;
}
@keyframes water-orbit { to { transform: rotate(360deg); } }
.hero-video { animation: hero-breathe 16s ease-in-out infinite alternate; }
@keyframes hero-breathe { from { transform: scale(1); } to { transform: scale(1.035); } }

.water-signature {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  padding: 0 6vw;
  color: var(--ink);
  background: linear-gradient(90deg,#edf8fa,#fafdfe 50%,#edf8fa);
  border-top: 1px solid var(--line-dark);
  border-bottom: 1px solid var(--line-dark);
}
.water-signature>div {
  min-height: 12.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 2rem 3vw;
  border-right: 1px solid var(--line-dark);
}
.water-signature>div:first-child { border-left: 1px solid var(--line-dark); }
.water-signature strong {
  font-family: var(--serif);
  font-size: clamp(2.6rem,4.5vw,5rem);
  font-weight: 400;
  letter-spacing: -.05em;
  line-height: 1;
}
.water-signature strong small { margin-left: .35rem; font-size: .85rem; letter-spacing: .04em; }
.water-signature span {
  margin-top: 1rem;
  color: var(--blue-deep);
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.product-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(115deg,transparent 35%,rgba(255,255,255,.62) 48%,transparent 61%);
  transform: translateX(-120%);
  transition: transform 1.15s var(--ease);
  pointer-events: none;
}
.product-card:hover::after { transform: translateX(120%); }
.metric strong span { transition: color .35s, text-shadow .35s; }
.metric:hover strong span { color: var(--blue-deep); text-shadow: 0 .4rem 2rem rgba(44,112,133,.15); }
.document-list a i { transition: transform .35s var(--ease); }
.document-list a:hover i { transform: translate(.25rem,-.25rem); }
.award-figure { transition: transform .7s var(--ease),box-shadow .7s var(--ease); }
.award-figure:hover { transform: translateY(-.5rem) rotate(-.3deg); box-shadow: 0 2.2rem 5rem rgba(44,112,133,.16); }
.reveal:nth-child(2n) { transition-delay: .08s; }
.reveal:nth-child(3n) { transition-delay: .14s; }

@media (max-width: 1020px) {
  .factory-film { grid-template-columns: 1fr; }
  .awards-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .water-signature { grid-template-columns: repeat(2,1fr); }
  .water-signature>div:nth-child(2) { border-right: 0; }
  .water-signature>div:nth-child(-n+2) { border-bottom: 1px solid var(--line-dark); }
  .mobile-menu {
    color: var(--ink);
    background: rgba(255,255,255,.98);
    border-top: 1px solid var(--line-dark);
  }
  .mobile-menu a { border-color: var(--line-dark); }
}

@media (max-width: 720px) {
  .award-gallery-heading { align-items: start; flex-direction: column; }
  .award-gallery-track { grid-auto-columns: minmax(16rem,84vw); }
  .award-gallery-card { min-height: 27rem; }
  .award-gallery-image { min-height: 20rem; }
  .award-lightbox-footer { align-items: start; flex-direction: column; }
  .hero { min-height: 50rem; }
  .hero-scrim { background: linear-gradient(0deg,rgba(5,17,20,.58),rgba(5,17,20,.18) 72%,rgba(5,17,20,.08)); }
  .hero-content { margin-top: 7rem; }
  .hero h1 { font-size: clamp(2.8rem,12vw,4.35rem); line-height: 1.02; }
  .hero-copy { font-size: 1rem; line-height: 1.7; }
  .intro h2, .section-heading h2, .recognition h2, .company h2,
  .process h2, .contact h2, .quality h2, .factory-film-copy h2,
  .origin-content h2 { font-size: clamp(2.55rem,11vw,3.85rem); line-height: 1.06; }
  .section-pad { padding-right: 1.25rem; padding-left: 1.25rem; }
  .language-switcher button { font-size: .72rem; }
  .mobile-menu a { font-family: var(--sans); font-size: clamp(2rem,9vw,3.4rem); line-height: 1.12; }
  .product-info p, .product-info span, .document-list em,
  .origin-facts dd, .form-note { font-size: .82rem; }
  .factory-film-media video { aspect-ratio: 16/10; }
  .award-seal { right: 1rem; }
  .awards-grid { grid-template-columns: 1fr; }
  .awards-grid article { min-height: auto; padding: 1.5rem; }
  .awards-grid time { margin-bottom: 1.25rem; }
  .awards-grid h3 { font-size: 1.45rem; }
  .cursor-aura { display: none; }
  .water-signature { padding: 0 1.25rem; }
  .water-signature>div { min-height: 9.5rem; padding: 1.4rem 1rem; }
  .water-signature strong { font-size: clamp(2.1rem,10vw,3.25rem); }
  .water-signature span { font-size: .72rem; letter-spacing: .06em; }
}

@media (prefers-reduced-motion: reduce) {
  .factory-film-media video { display: block; }
  .hero-video, .hero::after { animation: none; }
  .cursor-aura { display: none; }
  .reveal { transition-delay: 0s !important; }
}
