:root {
  color-scheme: light;
  --color-primary: #b84b08;
  --color-primary-hover: #963c05;
  --color-primary-soft: #fff0e0;
  --color-accent: #173a6b;
  --color-accent-soft: #e8eef6;
  --color-background: #fdf6ee;
  --color-surface: #ffffff;
  --color-text: #2a2d33;
  --color-muted-text: #6b7280;
  --color-border: #ead9c2;
  --color-focus: #d9680e;
  --font-body: ui-sans-serif, system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-display: ui-sans-serif, system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  --radius-sm: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --space-unit: 0.25rem;
  --content-width: 68rem;
  --shadow-card: 0 1px 3px rgba(42, 45, 51, 0.06), 0 6px 18px rgba(42, 45, 51, 0.05);
}

* {
  box-sizing: border-box;
}

html {
  background: var(--color-background);
  color: var(--color-text);
  font-family: var(--font-body);
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-height: 100dvh;
  line-height: 1.7;
}

button,
input,
select,
textarea {
  font: inherit;
}

:focus-visible {
  outline: 3px solid var(--color-focus);
  outline-offset: 3px;
}

.skip-link {
  left: 1rem;
  position: fixed;
  top: 1rem;
  transform: translateY(-200%);
  z-index: 100;
  background: var(--color-primary);
  color: #fff;
  padding: 0.5rem 0.9rem;
  border-radius: var(--radius-sm);
  text-decoration: none;
}

.skip-link:focus {
  transform: translateY(0);
}

a {
  color: var(--color-accent);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  line-height: 1.25;
  color: var(--color-text);
  margin: 0 0 0.75rem;
}

p {
  margin: 0 0 1rem;
}

img {
  max-width: 100%;
  display: block;
}

.container {
  width: min(var(--content-width), calc(100% - 2.5rem));
  margin-inline: auto;
}

/* ---------- Header / Navigation ---------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--color-border);
}

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 4.5rem;
}

.brand {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-weight: 700;
  font-size: 1.15rem;
  color: var(--color-primary);
}

.brand img {
  width: 2.2rem;
  height: 2.2rem;
  object-fit: contain;
}

.main-nav {
  display: flex;
  align-items: center;
  gap: 1.4rem;
}

.main-nav a {
  color: var(--color-text);
  font-weight: 500;
  padding: 0.4rem 0;
  white-space: nowrap;
}

.main-nav a:hover {
  color: var(--color-primary);
  text-decoration: none;
}

.main-nav a[aria-current="page"] {
  color: var(--color-primary);
  border-bottom: 2px solid var(--color-primary);
}


.nav-toggle {
  display: none;
  background: none;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 0.4rem 0.6rem;
  cursor: pointer;
  font-size: 1.2rem;
  line-height: 1;
  color: var(--color-text);
}

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  border-radius: var(--radius-md);
  padding: 0.7rem 1.4rem;
  font-weight: 600;
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.18s, border-color 0.18s;
  white-space: nowrap;
}

.btn-primary {
  background: var(--color-primary);
  color: #fff;
}

.btn-primary:hover {
  background: var(--color-primary-hover);
  color: #fff;
  text-decoration: none;
}

.btn-outline {
  background: transparent;
  color: var(--color-accent);
  border-color: var(--color-accent);
}

.btn-outline:hover {
  background: var(--color-accent-soft);
  text-decoration: none;
}

.btn-accent {
  background: var(--color-accent);
  color: #fff;
}

.btn-accent:hover {
  background: #122f58;
  color: #fff;
  text-decoration: none;
}

/* ---------- Hero ---------- */
.hero {
  background: linear-gradient(135deg, #fff3e3 0%, #ffe0c0 55%, #f7c98f 100%);
  color: var(--color-text);
}

.hero-inner {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  align-items: center;
  gap: 2.5rem;
  padding: 4.5rem 0 3.5rem;
}

.hero h1 {
  font-size: clamp(1.9rem, 4vw, 2.9rem);
  color: var(--color-accent);
  margin-bottom: 1rem;
}

.hero .hero-sub {
  font-size: 1.1rem;
  color: #4a4236;
  max-width: 30rem;
}

.hero .hero-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin-top: 1.6rem;
}

.hero-card {
  background: var(--color-surface);
  border-radius: var(--radius-lg);
  padding: 1rem;
  box-shadow: var(--shadow-card);
}

.hero-card img {
  border-radius: calc(var(--radius-lg) - 0.4rem);
  width: 100%;
  height: auto;
}

/* ---------- Sections ---------- */
.section {
  padding: 3.5rem 0;
}

.section-head {
  text-align: center;
  max-width: 42rem;
  margin: 0 auto 2.5rem;
}

.section-head .eyebrow {
  color: var(--color-primary);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 0.85rem;
}

.section-head h2 {
  font-size: clamp(1.5rem, 3vw, 2rem);
  color: var(--color-accent);
}

.section-alt {
  background: var(--color-surface);
}

/* ---------- Cards / grids ---------- */
.feature-grid,
.product-grid,
.value-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

.card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 1.6rem;
  box-shadow: var(--shadow-card);
}

.card .card-icon {
  font-size: 1.9rem;
  margin-bottom: 0.8rem;
}

.card h3 {
  font-size: 1.15rem;
  margin-bottom: 0.5rem;
}

.card p {
  color: var(--color-muted-text);
  font-size: 0.95rem;
  margin-bottom: 0;
}

.product-card .cat-tag {
  display: inline-block;
  background: var(--color-primary-soft);
  color: var(--color-primary-hover);
  font-weight: 600;
  font-size: 0.8rem;
  border-radius: 999px;
  padding: 0.2rem 0.7rem;
  margin-bottom: 0.8rem;
}

/* Placeholder visual block for products */
.placeholder-visual {
  height: 8.5rem;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, var(--color-primary-soft), #ffe9d1);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.4rem;
  color: var(--color-primary);
  margin-bottom: 1rem;
}

/* ---------- Stats ---------- */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  text-align: center;
}

.stat .stat-num {
  font-size: 2.1rem;
  font-weight: 800;
  color: var(--color-primary);
  font-family: var(--font-display);
}

.stat .stat-label {
  color: var(--color-muted-text);
}

/* ---------- Steps / timeline ---------- */
.steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.4rem;
  counter-reset: step;
}

.step {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 1.4rem;
  position: relative;
}

.step .step-num {
  display: inline-flex;
  width: 2.2rem;
  height: 2.2rem;
  align-items: center;
  justify-content: center;
  background: var(--color-primary);
  color: #fff;
  border-radius: 50%;
  font-weight: 700;
  margin-bottom: 0.8rem;
}

.timeline {
  list-style: none;
  padding: 0;
  margin: 0;
  border-left: 3px solid var(--color-primary);
}

.timeline li {
  position: relative;
  padding: 0 0 1.6rem 1.6rem;
}

.timeline li::before {
  content: "";
  position: absolute;
  left: -0.53rem;
  top: 0.4rem;
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  background: var(--color-primary);
  border: 2px solid #fff;
}

.timeline .tl-year {
  font-weight: 800;
  color: var(--color-primary);
}

/* ---------- Store / news list ---------- */
.store-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.4rem;
}

.news-list {
  display: grid;
  gap: 1.2rem;
}

.news-item {
  display: grid;
  grid-template-columns: 7rem 1fr;
  gap: 1.2rem;
  align-items: start;
}

.news-item .news-date {
  color: var(--color-primary);
  font-weight: 700;
}

/* ---------- About inline (首页品牌简介) ---------- */
.about-inline {
  display: grid;
  grid-template-columns: 10rem 1fr;
  gap: 2rem;
  align-items: center;
  max-width: 52rem;
  margin-inline: auto;
}

.about-logo {
  display: flex;
  justify-content: center;
}

.about-logo img {
  width: 9rem;
  height: auto;
}

.about-note {
  color: var(--color-muted-text);
  font-size: 0.9rem;
}

.news-compact .news-date {
  color: var(--color-primary);
  font-weight: 700;
  margin-bottom: 0.4rem;
}

/* ---------- Footer ---------- */
.site-footer {
  background: var(--color-accent);
  color: #dbe6f3;
  padding: 3rem 0 1.4rem;
  margin-top: 2rem;
}

.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1.4fr;
  gap: 2rem;
}

.site-footer h4 {
  color: #fff;
  margin-bottom: 1rem;
  font-size: 1.05rem;
}

.footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 0.5rem;
}

.footer-links a {
  color: #dbe6f3;
}

.footer-links a:hover {
  color: #fff;
}

.site-footer .footer-note {
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  margin-top: 2rem;
  padding-top: 1.2rem;
  font-size: 0.85rem;
  text-align: center;
  color: #b9c7d9;
}

/* ---------- Contact page layout ---------- */
.contact-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
  align-items: start;
}

/* ---------- Responsive ---------- */
@media (max-width: 1200px) {
  .nav-toggle {
    display: inline-block;
  }

  .main-nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--color-surface);
    border-bottom: 1px solid var(--color-border);
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    display: none;
    padding: 0.6rem 1rem 1rem;
  }

  .main-nav.open {
    display: flex;
  }

  .main-nav a {
    padding: 0.8rem 0;
    border-bottom: 1px solid var(--color-border);
  }

  .main-nav a[aria-current="page"] {
    border-bottom: 2px solid var(--color-primary);
  }

  .hero-inner,
  .contact-layout,
  .about-inline {
    grid-template-columns: 1fr;
  }

  .feature-grid,
  .product-grid,
  .value-grid,
  .stats-grid,
  .steps,
  .store-grid {
    grid-template-columns: 1fr;
  }

  .section {
    padding: 2.5rem 0;
  }

  .footer-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 560px) {
  .footer-grid {
    grid-template-columns: 1fr;
  }


}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}
/* Real content and imagery */
html{scroll-padding-top:100px}.brand img{width:94px;height:66px}.main-nav{gap:1.15rem}.hero-card{padding:0;overflow:hidden}.hero-card img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}.page-hero{padding:3rem 0;text-align:center}.page-hero h1{font-size:2.3rem}.page-hero .hero-sub{margin:0 auto;max-width:42rem}.company-layout{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:center}.store-photo{margin:0;background:white;border-radius:1rem;overflow:hidden}.store-photo img{width:100%;aspect-ratio:4/3;object-fit:cover}.store-photo figcaption{font-size:.875rem;padding:.7rem 1rem;color:#6b7280}.photo-gallery{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.card-label{display:block;color:var(--color-primary);font-size:.9rem;margin-bottom:1rem;font-weight:600}.brand-partners{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;max-width:42rem;margin:auto}.brand-partners>div{background:white;border:1px solid var(--color-border);border-radius:1rem;padding:2rem;text-align:center}.brand-partners strong{display:block;font-size:1.8rem;color:var(--color-accent)}.brand-partners span{display:block;letter-spacing:.15em;font-size:.875rem;color:var(--color-muted-text)}.center-note{text-align:center;margin:1.5rem auto 0;max-width:46rem}.verified-stats{grid-template-columns:repeat(3,1fr)}.empty-news{max-width:45rem;text-align:center;margin:auto;padding:3rem 2rem}.footer-links a{overflow-wrap:anywhere}.store-grid .card p{overflow-wrap:anywhere}.about-logo img{width:9rem}.hero h1{overflow-wrap:anywhere}@media(max-width:1200px){.company-layout,.photo-gallery{grid-template-columns:1fr}.company-layout{gap:1.5rem}.verified-stats{grid-template-columns:repeat(3,1fr)}.brand img{width:90px;height:63px}}@media(max-width:560px){.brand-partners,.verified-stats{grid-template-columns:1fr}.page-hero{padding:2.2rem 0}.page-hero h1{font-size:1.9rem}.hero-inner{padding-top:2.7rem;padding-bottom:2.7rem}.empty-news{padding:2rem 1.3rem}}

/* Large navigation at top; compact navigation after scrolling. */
.header-slot{height:104px}.site-header{position:fixed;top:0;left:0;width:100%;background:#f0ece7;border-bottom:1px solid #e5dfd7;transition:background .24s,box-shadow .24s}.site-header .header-inner{width:min(92rem,calc(100% - 4rem));min-height:104px;gap:2rem;transition:min-height .24s,width .24s}.brand{flex-shrink:0;white-space:nowrap}.brand-expanded{display:flex;align-items:center;gap:.7rem}.brand-expanded img{width:84px;height:48px;object-fit:contain;mix-blend-mode:multiply}.brand-expanded>span{font-size:1.85rem;font-weight:700;letter-spacing:.03em;color:#515151}.brand .brand-full{display:none;width:80px;height:58px;object-fit:contain}.site-header .main-nav{gap:1.6rem;margin-left:auto}.site-header .main-nav a{font-size:1.05rem;font-weight:400;transition:font-size .24s,padding .24s}.site-search{position:relative;display:flex;align-items:center;width:210px;flex-shrink:0;background:white;border-radius:25px;height:36px}.search-symbol{font-size:24px;line-height:1;margin-left:12px;color:#777}.site-search input{width:100%;min-width:0;border:0;background:none;border-radius:25px;font-size:13px;padding:7px 10px;color:#333}.site-search input:focus-visible{outline-offset:3px}.search-results{position:absolute;top:calc(100% + 12px);right:0;width:290px;padding:8px;background:#fff;border:1px solid var(--color-border);box-shadow:0 8px 24px #0002;border-radius:8px}.search-results a{display:block;padding:10px 12px;font-size:14px;border-radius:4px}.search-results a:hover{background:var(--color-primary-soft);text-decoration:none}.search-results p{font-size:14px;margin:8px;color:var(--color-muted-text)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.site-header.is-compact{background:#fff;border-bottom-color:var(--color-border);box-shadow:0 2px 12px #00000008}.site-header.is-compact .header-inner{width:min(68rem,calc(100% - 2.5rem));min-height:68px;gap:1.4rem}.site-header.is-compact .brand-expanded{display:none}.site-header.is-compact .brand-full{display:block}.site-header.is-compact .site-search{display:none}.site-header.is-compact .main-nav{gap:1.15rem}.site-header.is-compact .main-nav a{font-size:.95rem}
@media(max-width:1450px) and (min-width:1201px){.site-header .header-inner{gap:1.2rem}.brand-expanded>span{font-size:1.5rem}.brand-expanded img{width:68px;height:40px}.site-header .main-nav{gap:1.1rem}.site-header .main-nav a{font-size:.95rem}.site-search{width:170px}}
@media(max-width:1200px){.header-slot{height:84px}.site-header .header-inner{width:calc(100% - 2.5rem);min-height:84px;gap:1rem}.brand-expanded img{width:65px;height:36px}.brand-expanded>span{font-size:1.35rem}.site-header .nav-toggle{margin-left:auto;order:3;min-width:44px;min-height:44px}.site-header .site-search{width:190px;order:2}.site-header .main-nav{margin-left:0;padding:.6rem 1.25rem 1rem}.site-header .main-nav a{font-size:1rem}.site-header.is-compact .header-inner{min-height:64px}.site-header.is-compact .main-nav a{font-size:1rem}.site-header.is-compact .brand-full{width:72px;height:54px}.search-results{max-width:calc(100vw - 2.5rem)}}
@media(max-width:600px){.site-header .site-search{display:none}.site-header .header-inner{width:calc(100% - 2rem)}.brand-expanded>span{font-size:1.25rem}.brand-expanded img{width:58px;height:34px}}

/* Approved product banner, preserve the complete artwork on every viewport. */
.product-hero{background:#fff;padding:0}.product-hero-inner{width:min(92rem,calc(100% - 4rem));margin:0 auto}.product-hero img{display:block;width:100%;height:auto;object-fit:contain}@media(max-width:600px){.product-hero-inner{width:100%}}

/* Updated store photography */
.about-inline > .store-photo{margin:0;min-width:0;}
.about-inline > .store-photo img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;}
.service-photo-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;min-width:0;}
.service-photo-pair .store-photo{margin:0;min-width:0;}
.service-photo-pair .store-photo img{width:100%;height:auto;aspect-ratio:3/4;object-fit:contain;background:#fff;}
@media(max-width:600px){.service-photo-pair{gap:.75rem;}}

.store-photo img{height:auto;}
.about-inline{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);max-width:none;}
@media(max-width:800px){.about-inline{grid-template-columns:1fr;}}

/* Larger homepage banner and denser About layout. */
.product-hero-inner{width:100%;max-width:none;}
.about-page .container{width:min(92rem,calc(100% - 4rem));}
.about-page .eyebrow{display:block;font-size:.875rem;font-weight:700;letter-spacing:.09em;color:var(--color-primary);margin-bottom:.6rem;}
.about-page h2{font-size:2rem;line-height:1.25;margin:0 0 1rem;color:var(--color-accent);}
.about-intro{padding:2.5rem 0;background:#fff;}
.about-intro-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:3rem;align-items:center;}
.about-intro-copy h1{font-size:clamp(2rem,3.1vw,3.5rem);line-height:1.35;letter-spacing:.01em;color:var(--color-accent);margin:.7rem 0 1.4rem;}
.about-intro-lead{font-size:1.5rem;font-weight:700;margin:0 0 .4rem;}
.about-intro-facts{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.5rem;}
.about-intro-facts span{background:var(--color-primary-soft);padding:.45rem .8rem;font-size:.95rem;color:var(--color-primary);}
.about-main-photo{border-radius:.5rem;}
.about-main-photo img{display:block;aspect-ratio:16/10;object-fit:cover;}
.about-overview{padding:2.75rem 0;background:#fff6ee;border-top:1px solid #f4e4d5;border-bottom:1px solid #f4e4d5;}
.about-overview-grid{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:3rem;align-items:start;}
.about-overview-text{font-size:1.0625rem;line-height:1.95;margin:0;}
.about-overview-note{font-size:1.0625rem;max-width:22rem;}
.about-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:2rem;padding-top:1.7rem;border-top:1px solid #ecd8c5;}
.about-facts article{padding:0 1.7rem;border-right:1px solid #ecd8c5;}
.about-facts article:first-child{padding-left:0;}.about-facts article:last-child{border:0;}
.about-facts strong{display:block;color:var(--color-primary);font-size:3.25rem;line-height:1.1;}
.about-facts strong span{font-size:1.2rem;margin-left:.35rem;}.about-facts strong.about-facts-words{font-size:2.2rem;line-height:1.63;}
.about-facts h3{font-size:1rem;font-weight:500;margin:.7rem 0 0;}
.about-details{padding:3rem 0;background:#fff;}
.about-details-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:3rem;align-items:center;}
.about-detail-copy article+article{margin-top:1.6rem;padding-top:1.6rem;border-top:1px solid var(--color-border);}
.about-partner-names{display:flex;gap:2.5rem;margin-top:1.1rem;}.about-partner-names span{font-size:1.4rem;font-weight:700;color:var(--color-accent);}.about-partner-names small{display:block;font-size:.8rem;letter-spacing:.1em;font-weight:400;margin-top:.2rem;}
.about-belief{font-size:1.3rem;color:var(--color-accent);}
@media(max-width:900px){.about-intro-grid,.about-overview-grid,.about-details-grid{grid-template-columns:1fr;gap:1.5rem;}.about-intro-copy h1 br{display:none;}.about-main-photo img{aspect-ratio:16/9;}.about-facts strong{font-size:2.6rem;}.about-facts strong.about-facts-words{font-size:1.8rem;}}
@media(max-width:600px){.about-page .container{width:calc(100% - 2rem);}.about-intro,.about-overview,.about-details{padding:1.8rem 0;}.about-facts{grid-template-columns:1fr;gap:1rem;}.about-facts article,.about-facts article:first-child{padding:0 0 1rem;border-right:0;border-bottom:1px solid #ecd8c5;}.about-facts article:last-child{padding-bottom:0;}.about-facts h3{margin:.4rem 0 0;}.about-page h2{font-size:1.65rem;}}

/* Full-row store photograph with brand information below. */
.about-details-grid{grid-template-columns:1fr;gap:2.5rem;}
.about-details-grid>.store-photo{width:100%;border-radius:.5rem;}
.about-details-grid>.store-photo img{display:block;aspect-ratio:auto;height:auto;object-fit:contain;}
.about-detail-copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4rem;align-items:start;padding:.5rem 0 1rem;}
.about-detail-copy article+article{margin:0;padding:0 0 0 3rem;border-top:0;border-left:1px solid var(--color-border);}
.about-partner-logos{display:flex;align-items:center;flex-wrap:wrap;gap:3rem;margin-top:1.5rem;}
.about-partner-logos figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:.75rem;}
.about-partner-logos img{display:block;width:auto;height:96px;max-width:200px;object-fit:contain;}
.about-partner-logos figcaption{font-size:1rem;color:var(--color-accent);}
@media(max-width:700px){.about-details-grid{gap:1.5rem;}.about-detail-copy{grid-template-columns:1fr;gap:1.75rem;}.about-detail-copy article+article{padding:1.5rem 0 0;border-left:0;border-top:1px solid var(--color-border);}.about-partner-logos{gap:2rem;}.about-partner-logos img{height:72px;max-width:160px;}}

.about-partner-logos figure:nth-child(2) img{height:140px;max-width:180px;}
@media(max-width:700px){.about-partner-logos figure:nth-child(2) img{height:110px;max-width:150px;}}

/* Light branded footer with the supplied, unmodified WeChat code. */
.site-footer{background:#f0ece7;color:#505050;padding:2.75rem 0 1.25rem;}
.site-footer>.container{width:min(92rem,calc(100% - 4rem));}
.site-footer h4{color:#323232;}.site-footer a{color:#505050;}.site-footer a:hover{color:var(--color-primary);}
.footer-brand-row{display:flex;justify-content:space-between;align-items:center;gap:3rem;padding-bottom:2rem;margin-bottom:2rem;border-bottom:1px solid #d9d1c8;}
.footer-brand{display:inline-flex;align-items:center;gap:1rem;text-decoration:none;}.footer-brand:hover{text-decoration:none;}
.footer-brand img{display:block;width:108px;height:auto;object-fit:contain;mix-blend-mode:multiply;}
.footer-brand span{font-size:clamp(2rem,3vw,3.25rem);font-weight:700;letter-spacing:.04em;color:#515151;}
.footer-brand-block p{margin:.5rem 0 0;}.footer-brand-block .footer-slogan{font-size:1.2rem;margin-top:1.25rem;}
.footer-miniprogram{margin:0;flex-shrink:0;text-align:center;}.footer-miniprogram h4{font-size:1rem;margin:0 0 .75rem;}
.footer-miniprogram a{display:block;width:160px;height:160px;background:white;}
.footer-miniprogram img{display:block;width:160px;height:160px;object-fit:contain;}
.footer-miniprogram figcaption{font-size:.875rem;margin-top:.65rem;}
.site-footer .footer-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem;}.site-footer .footer-note{color:#6c6862;border-top-color:#d9d1c8;}
@media(max-width:700px){.site-footer>.container{width:calc(100% - 2rem);}.footer-brand-row{align-items:flex-start;gap:1.75rem;flex-direction:column;}.footer-brand img{width:70px;}.footer-brand{gap:.65rem;}.footer-brand span{font-size:1.8rem;}.site-footer .footer-grid{grid-template-columns:1fr 1fr;}.footer-miniprogram{text-align:left;}.footer-miniprogram figcaption{text-align:center;}}
@media(max-width:400px){.site-footer .footer-grid{grid-template-columns:1fr;}}

/* Homepage company overview: full-row photo, copy below. */
.home-about>.container{width:min(92rem,calc(100% - 4rem));}
.home-about .about-inline{grid-template-columns:1fr;gap:1.75rem;}
.home-about .about-inline>.store-photo{width:100%;}
.home-about .about-inline>.store-photo img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain;}
.home-about .about-inline>div{width:100%;max-width:none;}
.home-about .about-inline>div p{font-size:1.0625rem;line-height:1.95;margin:0 0 1.25rem;}
@media(max-width:600px){.home-about>.container{width:calc(100% - 2rem);}.home-about .about-inline{gap:1.25rem;}}

/* Product catalogue supplied by the company. */
.catalog-section>.container,.catalog-brands>.container{width:min(92rem,calc(100% - 4rem));}
.catalog-filters{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;margin-bottom:1.5rem;}
.catalog-filters button{font:inherit;padding:.65rem 1.1rem;border:1px solid var(--color-border);border-radius:30px;background:#fff;color:var(--color-accent);cursor:pointer;}
.catalog-filters button[aria-pressed="true"]{background:var(--color-primary);border-color:var(--color-primary);color:#fff;}
.catalog-filters button span{font-size:.875rem;margin-left:.3rem;}.catalog-count{color:var(--color-muted-text);font-size:.95rem;margin-bottom:1rem;}
.catalog-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;}
.catalog-card{padding:1.5rem;background:#fff;border:1px solid var(--color-border);border-radius:.75rem;display:flex;flex-direction:column;min-width:0;}
.catalog-card[hidden]{display:none;}.catalog-category{font-size:.875rem;color:var(--color-primary);margin-bottom:.75rem;}
.catalog-card h3{font-size:1.0625rem;line-height:1.55;margin:0 0 .9rem;overflow-wrap:anywhere;}.catalog-options{font-size:.875rem;color:var(--color-muted-text);line-height:1.65;}

.catalog-note{font-size:.95rem;color:var(--color-muted-text);margin:1.5rem 0 1rem;}
.catalog-brands>.container>.about-partner-logos{justify-content:center;margin:1.5rem 0;}.catalog-brands>.container>p{text-align:center;}
.catalog-brand-list{margin-top:1.5rem;}.catalog-brand-list h3{font-size:1.0625rem;margin-bottom:.5rem;}.catalog-brand-list p{font-size:.95rem;}
.brand-name-list{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:.75rem;}.brand-name-list span{padding:.45rem .85rem;background:#fff;border:1px solid var(--color-border);border-radius:.3rem;color:var(--color-accent);font-size:.95rem;}
@media(max-width:1100px){.catalog-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:750px){.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.catalog-section>.container,.catalog-brands>.container{width:calc(100% - 2rem);}}
@media(max-width:450px){.catalog-grid{grid-template-columns:1fr;}.catalog-filters{justify-content:flex-start;}.catalog-card{padding:1.25rem;}}

/* Complete product-brand directory; supplied logos keep their original colors. */
.partner-brand-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1rem;margin-top:2rem;}
.partner-brand-card{margin:0;min-width:0;background:#fff;border:1px solid #e9e1d9;border-radius:12px;padding:1rem .8rem;min-height:140px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;}
.brand-visual{width:100%;height:80px;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.brand-visual img{display:block;width:auto;height:auto;max-width:100%;max-height:76px;object-fit:contain;}
.partner-brand-card figcaption{font-size:.95rem;color:var(--color-accent);text-align:center;line-height:1.5;overflow-wrap:anywhere;}
.brand-card-square .brand-visual img{width:230px;height:230px;max-width:none;max-height:none;flex-shrink:0;}
.brand-card-name{background:#fffdf9;}
.brand-card-name figcaption{font-weight:600;font-size:1.08rem;}
.about-detail-copy .about-all-brands{grid-column:1/-1;}
.about-detail-copy .about-all-brands+article{grid-column:1/-1;border-left:0;border-top:1px solid var(--color-border);padding:2rem 0 0;}
@media(max-width:1100px){.partner-brand-grid{grid-template-columns:repeat(4,minmax(0,1fr));}}
@media(max-width:700px){.partner-brand-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;}.partner-brand-card{min-height:124px;padding:.8rem .5rem;}.brand-visual{height:70px;}.brand-visual img{max-height:64px;}.brand-card-square .brand-visual img{width:190px;height:190px;max-height:none;}.partner-brand-card figcaption{font-size:.85rem;}}
@media(max-width:430px){.partner-brand-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.brand-card-name figcaption{font-size:1rem;}}

.brand-visual img[src$="essilor-logo.svg"]{height:126px;max-height:none;}

/* Real product photography with intrinsic aspect ratio preserved. */
.catalog-card{overflow:hidden;}
.catalog-product-photo{margin:-1.5rem -1.5rem 1.1rem;position:relative;background:#fff;border-bottom:1px solid var(--color-border);}
.catalog-product-photo img{display:block;width:100%;height:230px;object-fit:contain;padding:.8rem;background:#fff;}
.catalog-product-photo figcaption{font-size:.875rem;line-height:1.5;padding:.35rem .75rem;color:var(--color-muted-text);background:#faf8f5;border-top:1px solid #f2eee9;}
.catalog-image-note{font-size:.95rem;line-height:1.7;color:var(--color-muted-text);margin:1.5rem 0 .5rem;}
@media(max-width:1100px){.catalog-product-photo img{height:210px;}}
@media(max-width:750px){.catalog-product-photo img{height:190px;}}
@media(max-width:450px){.catalog-product-photo{margin:-1.25rem -1.25rem 1rem;}.catalog-product-photo img{height:230px;}}
/* Module entrances follow scroll progress without moving the layout. */
@keyframes page-entry {
  from { opacity: 0; transform: translate(var(--entry-x, 0px), var(--entry-y, 32px)); }
  to { opacity: 1; transform: translate(0, 0); }
}
.entry-wait { opacity: 0; }
.page-entry {
  animation: page-entry 900ms cubic-bezier(.22, 1, .36, 1) var(--entry-delay, 0ms) both;
}
.product-hero-inner.page-entry { animation-duration: 1100ms; }
@media (max-width: 700px) {
  .page-entry { --entry-y: 20px; --entry-x: 0px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .entry-wait, .page-entry { animation: none !important; opacity: 1; transform: none; }
}
@media print {
  .entry-wait, .page-entry { animation: none !important; opacity: 1; transform: none; }
}

/* Corporate UI study: spacious white pages, ruled headings and flat imagery. */
:root {
  --color-background: #fff;
  --color-text: #414141;
  --color-muted-text: #737373;
  --color-accent: #42434b;
  --color-accent-soft: #f4f3f0;
  --color-border: #e6e3df;
  --content-width: 75rem;
  --radius-sm: 2px;
  --radius-md: 2px;
  --radius-lg: 2px;
  --shadow-card: none;
}
body { background: #fff; }
h1, h2, h3, h4 { font-weight: 500; }
.container, .about-page .container, .home-about>.container,
.catalog-section>.container, .catalog-brands>.container, .site-footer>.container {
  width: min(75rem, calc(100% - 4rem));
}
.site-header { background: #f0ede7; border-bottom: 0; }
.site-header .header-inner { width: min(75rem, calc(100% - 4rem)); gap: 1.5rem; }
.brand-expanded>span { font-size: 1.7rem; letter-spacing: 0; }
.brand-expanded img { width: 70px; height: 42px; }
.site-header .main-nav { gap: 1.4rem; }
.site-header .main-nav a { color: #353535; font-size: 1rem; }
.site-header .main-nav a:hover, .site-header .main-nav a[aria-current="page"] { color: var(--color-primary); }
.site-header.is-compact .header-inner { width: min(75rem, calc(100% - 4rem)); }
.section { padding: 4.5rem 0; }
.section-alt { background: #f8f7f4; }
.section-head { max-width: none; margin: 0 auto 3rem; position: relative; }
.section-head .eyebrow { display: block; color: #96928b; font-size: .75rem; font-weight: 400; letter-spacing: .15em; margin-bottom: .7rem; }
.section-head h2 { display: flex; align-items: center; justify-content: center; gap: 2.5rem; font-size: clamp(1.4rem, 2.4vw, 1.9rem); color: #565656; margin-bottom: 1rem; }
.section-head h2::before, .section-head h2::after { content: ''; height: 1px; background: #dad7d2; flex: 1; }
.section-head::after { content: ''; display: block; width: 46px; height: 22px; margin: 0 auto; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 22'%3E%3Cg fill='none' stroke='%23d49554' stroke-width='1.7'%3E%3Ccircle cx='13' cy='12' r='7'/%3E%3Ccircle cx='33' cy='12' r='7'/%3E%3Cpath d='M20 11q3-4 6 0M2 9l4 1m34 0 4-1'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat; }
.hero.page-hero { background: #faf9f7; padding: 4rem 0 3.5rem; border-bottom: 1px solid #eeebe6; }
.page-hero h1 { font-size: clamp(1.9rem, 3vw, 2.6rem); color: #424242; letter-spacing: .06em; }
.page-hero h1::after { content: ''; display: block; height: 2px; width: 36px; background: var(--color-primary); margin: 1.3rem auto; }
.hero .hero-sub { font-size: 1rem; color: #777; line-height: 1.9; }
.btn { border-radius: 999px; padding: .75rem 1.8rem; font-size: .95rem; min-height: 44px; }
.btn-outline { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.btn-outline:hover { background: var(--color-primary-hover); color: #fff; border-color: var(--color-primary-hover); }
.card, .step { border-radius: 0; box-shadow: none; border: 0; background: transparent; }
.card h3 { font-size: 1.15rem; font-weight: 500; }
.card p { line-height: 1.9; }
.store-photo, .about-main-photo, .about-details-grid>.store-photo { border-radius: 0; }
.store-photo figcaption { background: #f1efea; color: #535353; text-align: center; padding: .85rem 1rem; }
.home-about .about-inline>div { text-align: center; max-width: 65rem; margin-inline: auto; }
.home-about .about-inline>div p { color: #585858; line-height: 2.1; }
.stats-grid { gap: 0; }
.stat { padding: 1rem 2rem; border-right: 1px solid #ddd8d0; }
.stat:last-child { border-right: 0; }
.stat .stat-num { font-size: 2.8rem; font-weight: 500; }
.stat .stat-label { margin-top: .4rem; }
.product-grid { gap: 2rem; }
.product-grid>.card { padding: 0 0 1.25rem; border-bottom: 1px solid var(--color-border); }
.home-product-photo { display: block; background: #faf9f7; margin-bottom: 1.25rem; position: relative; overflow: hidden; }
.home-product-photo img { width: 100%; height: 250px; object-fit: contain; padding: 1.25rem; background: #fff; transition: transform .5s; }
.home-product-photo:hover img { transform: scale(1.035); }
.home-product-photo span { position: absolute; bottom: .5rem; right: .6rem; font-size: .72rem; color: #888; }
.product-grid .card-label { margin-bottom: .4rem; font-size: .8rem; }
.product-grid .card>p { margin-bottom: 1rem; }
.product-grid .card>a:not(.home-product-photo) { display: inline-block; margin-top: 1rem; color: var(--color-primary); font-size: .9rem; }
.store-grid { gap: 3rem; }
.store-grid>.card { padding: 2rem 0; border-top: 2px solid var(--color-primary); }
.store-grid>.card h3 { font-size: 1.35rem; margin-bottom: 1.2rem; }
.store-grid>.card p { margin-bottom: .75rem; }
.store-grid>.card .btn { margin-top: .75rem; }
.about-intro { padding: 3.5rem 0; }
.about-intro-copy h1 { color: #414141; font-weight: 500; font-size: clamp(2rem, 3.2vw, 3rem); }
.about-intro-lead { font-weight: 500; }
.about-intro-facts span { background: transparent; padding: .25rem .7rem .25rem 0; border-right: 1px solid #ddd; border-radius: 0; }
.about-intro-facts span:last-child { border-right: 0; }
.about-overview { padding: 3.5rem 0; background: #f8f7f4; border-color: #e6e3df; }
.about-page h2 { color: #505050; font-size: 1.8rem; font-weight: 500; }
.about-page .eyebrow { color: #a18568; font-size: .75rem; font-weight: 400; letter-spacing: .15em; }
.about-facts article { border-color: #ddd8d0; }
.about-facts strong { font-weight: 500; }
.about-details { padding: 3.5rem 0; }
.partner-brand-grid { gap: 0; border-left: 1px solid var(--color-border); border-top: 1px solid var(--color-border); }
.partner-brand-card { border-radius: 0; border: 0; border-right: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); min-height: 150px; }
.brand-card-name { background: #faf9f7; }
.partner-brand-card figcaption { color: #525252; }
.catalog-filters { gap: 0; margin-bottom: 2.2rem; border-bottom: 1px solid #ddd8d0; }
.catalog-filters button { border: 0; border-bottom: 2px solid transparent; border-radius: 0; padding: .8rem 1.4rem; color: #555; background: transparent; }
.catalog-filters button[aria-pressed="true"] { background: transparent; border-bottom-color: var(--color-primary); color: var(--color-primary); }
.catalog-filters button:hover { background: #f8f7f4; }
.catalog-grid { gap: 2rem 1.5rem; }
.catalog-card { border-radius: 0; border: 1px solid #e9e6e2; box-shadow: none; }
.catalog-product-photo { border-bottom-color: #eeece8; }
.catalog-product-photo figcaption { background: #f7f6f3; font-size: .75rem; }
.catalog-category { color: #9b5926; }
.step { border-top: 1px solid #d9d4cc; padding: 1.5rem 0; }
.step .step-num { background: transparent; color: var(--color-primary); border-radius: 0; font-size: 2.5rem; width: auto; height: auto; font-weight: 400; }
.photo-gallery { gap: 2rem; }
.empty-news { background: #f8f7f4; border: 0; }
.site-footer { margin-top: 0; background: #efede8; padding-top: 3.5rem; }
.footer-brand span { font-size: 2.4rem; letter-spacing: 0; }
.footer-brand img { width: 88px; }
.footer-brand-row { border-color: #d6d1c8; }
.footer-brand-block .footer-slogan { font-size: 1rem; color: #777; }
.site-footer h4 { font-weight: 500; font-size: 1rem; }
.footer-links { font-size: .9rem; }
.back-to-top { position: fixed; bottom: 2rem; right: 1.5rem; width: 48px; height: 48px; display: grid; place-items: center; border: 0; border-radius: 50%; color: white; background: #aa784c; cursor: pointer; z-index: 45; box-shadow: 0 3px 10px #0001; }
.back-to-top[hidden] { display: none; }
.back-to-top:hover { background: var(--color-primary); }
@media (max-width:1200px) {
  .site-header .header-inner, .site-header.is-compact .header-inner { width: calc(100% - 2.5rem); }
  .site-header .main-nav { gap: 0; }
  .site-header .main-nav a { padding: .8rem 0; }
  .brand-expanded>span { font-size: 1.35rem; }
}
@media (max-width:900px) {
  .product-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .store-grid { gap: 1.5rem; }
  .home-product-photo img { height: 220px; }
}
@media (max-width:700px) {
  .container, .about-page .container, .home-about>.container, .catalog-section>.container, .catalog-brands>.container, .site-footer>.container { width: calc(100% - 2rem); }
  .section { padding: 2.75rem 0; }
  .section-head { margin-bottom: 2rem; }
  .section-head h2 { gap: .8rem; }
  .hero.page-hero { padding: 2.5rem 0; }
  .about-intro, .about-overview, .about-details { padding: 2.5rem 0; }
  .store-grid { grid-template-columns: 1fr; gap: 1rem; }
  .store-grid>.card { padding: 1.5rem 0; }
  .footer-brand span { font-size: 1.8rem; }
  .back-to-top { right: .75rem; bottom: 1rem; width: 44px; height: 44px; }
  .partner-brand-card { min-height: 125px; }
}
@media (max-width:560px) {
  .product-grid { grid-template-columns: 1fr; }
  .stat { border-right: 0; border-bottom: 1px solid #ddd8d0; padding: 1.25rem 0; }
  .stat:last-child { border-bottom: 0; }
  .photo-gallery { gap: 1.25rem; }
}
@media (prefers-reduced-motion:reduce) { .home-product-photo img { transition: none; } }
@media print { .back-to-top { display: none; } }

/* Approved header scale and homepage brand copy. */
@media (min-width:1201px) {
  .site-header .header-inner { width: min(96rem, calc(100% - 4rem)); gap: 2rem; }
  .site-header .brand-expanded { --brand-size: clamp(2.25rem, 3vw, 4rem); gap: 1rem; }
  .site-header .brand-expanded>span { font-size: var(--brand-size); line-height: 1.2; }
  .site-header .brand-expanded img { width: calc(var(--brand-size) * 2.7); height: calc(var(--brand-size) * 1.4); }
  .site-header.is-compact .header-inner { width: min(75rem, calc(100% - 4rem)); }
}
.product-hero-inner { position: relative; }
.hero-brand-message {
  position: absolute;
  left: 1.3%;
  bottom: 1.5%;
  width: 23%;
  margin: 0;
  color: #413b35;
  font-size: clamp(.75rem, 1vw, 1.3rem);
  line-height: 1.6;
  font-weight: 500;
  letter-spacing: .025em;
  text-shadow: 0 1px 3px #ffffffd9;
}
.hero-brand-message span { display: block; }
.brand-values .stat { display: flex; align-items: center; justify-content: center; padding: 2rem 1rem; min-width: 0; }
.brand-values .brand-value { margin: 0; color: var(--color-primary); font-size: clamp(1.25rem, 2.1vw, 2rem); line-height: 1.6; font-weight: 500; letter-spacing: .05em; }
@media (max-width:900px) {
  .hero-brand-message { position: static; width: 100%; padding: 1.25rem 1.5rem; font-size: 1rem; line-height: 1.9; text-align: center; background: #faf7f2; text-shadow: none; }
  .hero-brand-message span { display: inline; }
}
@media (max-width:560px) {
  .brand-values .stat { padding: 1.4rem .5rem; }
  .brand-values .brand-value { font-size: 1.5rem; }
  .hero-brand-message { padding: 1.2rem 1rem; font-size: .95rem; text-align: left; }
}

/* Transparent, original code artwork in a shared footer scan area. */
.footer-social-codes { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.5rem; flex-shrink: 0; }
.footer-code { margin: 0; width: 160px; text-align: center; }
.footer-code h4 { margin: 0 0 .8rem; font-size: .95rem; }
.footer-code a { display: block; width: 160px; height: 160px; background: transparent; }
.footer-code img { display: block; width: 160px; height: 160px; object-fit: contain; }
.footer-code figcaption { margin-top: .75rem; font-size: .75rem; line-height: 1.6; color: #696661; overflow-wrap: anywhere; }
@media (max-width:1000px) {
  .footer-brand-row { flex-direction: column; align-items: flex-start; gap: 2rem; }
  .footer-social-codes { align-self: stretch; justify-content: start; grid-template-columns: repeat(3,160px); }
}
@media (max-width:600px) {
  .footer-social-codes { grid-template-columns: repeat(3,minmax(0,1fr)); gap: .6rem; }
  .footer-code { width: 100%; min-width: 0; }
  .footer-code a, .footer-code img { width: 100%; height: auto; aspect-ratio: 1; }
  .footer-code h4 { font-size: .85rem; }
  .footer-code figcaption { font-size: .7rem; }
}