:root {
  --bg: #f4f0e8;
  --paper: #fbf8f2;
  --white: #ffffff;
  --ink: #161513;
  --muted: #6e6860;
  --line: rgba(22, 21, 19, 0.1);
  --navy: #0c1424;
  --navy-2: #162033;
  --accent: #111111;
  --heart: #c11f2a;
  --max: 1180px;
  --wide: 1286px;
  --serif: "Cormorant Garamond", "Noto Serif SC", "Songti SC", serif;
  --display: "Playfair Display", "Cormorant Garamond", serif;
  --sans: "DM Sans", "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", sans-serif;
}

.theme-cn {
  --bg: #f7f3ec;
  --paper: #fcfaf6;
  --accent: #111111;
}

.theme-en {
  --bg: #f3efe6;
  --paper: #faf7f1;
  --accent: #0c1424;
}

*,
*::before,
*::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: 88px;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.65;
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }

.wrap { width: min(var(--max), calc(100% - 48px)); margin: 0 auto; }
.wrap-wide { width: min(var(--wide), calc(100% - 48px)); margin: 0 auto; }

.site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 40;
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: background 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.site-header.is-solid,
.site-header.is-open {
  background: rgba(244, 240, 232, 0.96);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--line);
}

body:not(.has-hero-overlay) {
  padding-top: 78px;
}

.header-row {
  min-height: 78px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 20px;
}

.logo {
  font-family: var(--sans);
  font-weight: 700;
  letter-spacing: 0.08em;
  font-size: 18px;
}

.nav {
  display: flex;
  justify-content: center;
  gap: 22px;
  flex-wrap: wrap;
}

.nav a {
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--muted);
}

.theme-cn .nav a {
  font-size: 14px;
  letter-spacing: 0.08em;
  text-transform: none;
  white-space: nowrap;
}

.nav a:hover,
.nav a.is-active {
  color: var(--ink);
  box-shadow: inset 0 -1px 0 currentColor;
}

.header-tools {
  display: flex;
  align-items: center;
  gap: 14px;
}

.lang-switch {
  font-size: 12px;
  letter-spacing: 0.12em;
  color: var(--muted);
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 20px;
  border: 1px solid var(--accent);
  background: var(--accent);
  color: var(--white);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
}

.theme-cn .btn { text-transform: none; letter-spacing: 0.04em; font-size: 14px; }

.btn.ghost {
  background: transparent;
  color: var(--ink);
}

.btn.light {
  background: transparent;
  color: var(--white);
  border-color: rgba(255, 255, 255, 0.55);
}

.btn:hover { opacity: 0.88; }

.kicker {
  margin: 0 0 14px;
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 600;
}

h1, h2, h3, .serif {
  font-family: var(--serif);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -0.02em;
  margin: 0;
  color: var(--ink);
}

h1 { font-size: clamp(40px, 6.4vw, 76px); }
h2 { font-size: clamp(30px, 4.2vw, 52px); }
h3 { font-size: clamp(22px, 2.4vw, 30px); }

.lead, .muted { color: var(--muted); }
.lead { font-size: 17px; max-width: 38em; }

.hero {
  min-height: clamp(520px, 50vw, 740px);
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: end;
  background: var(--paper) center/cover no-repeat;
  position: relative;
}

.hero-copy {
  padding: 120px 8% 76px;
  max-width: 640px;
  position: relative;
  z-index: 1;
}

.hero-copy .hero-actions { margin-top: 32px; }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }

.hero-watermark {
  position: absolute;
  right: 6%;
  bottom: 18%;
  font-family: "Cormorant Garamond", serif;
  font-size: clamp(96px, 16vw, 220px);
  line-height: 0.8;
  letter-spacing: -0.04em;
  color: rgba(22, 21, 19, 0.08);
  pointer-events: none;
  z-index: 0;
}

.hero-side-label {
  position: absolute;
  right: 28px;
  top: 50%;
  transform: translateY(-50%) rotate(90deg);
  transform-origin: center;
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(22, 21, 19, 0.42);
  pointer-events: none;
}

.scroll-cue {
  position: absolute;
  left: 8%;
  bottom: 28px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(22, 21, 19, 0.48);
}

.scroll-cue::before {
  content: "";
  width: 1px;
  height: 28px;
  background: currentColor;
}

.form-tile {
  display: grid;
  gap: 12px;
  padding: 22px 18px;
  background: #fff;
  text-decoration: none;
}

.form-tile .icon-svg { width: 36px; height: 36px; }
.form-tile h3 { font-size: 22px; }
.form-tile .link-arrow { font-size: 12px; }

.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  letter-spacing: 0.08em;
  font-weight: 600;
}

.section { padding: 96px 0; }
.section.paper { background: var(--paper); }
.section.dark {
  background: var(--navy);
  color: rgba(255, 255, 255, 0.82);
}
.section.dark h1,
.section.dark h2,
.section.dark h3 { color: var(--white); }
.section.dark .kicker,
.section.dark .muted,
.section.dark p { color: rgba(255, 255, 255, 0.72); }
.section.dark .icon-svg { color: rgba(255, 255, 255, 0.88); }
.section.dark .icon-card p { color: rgba(255, 255, 255, 0.68); }

.photo {
  min-height: 420px;
  background: #ddd center/cover no-repeat;
}

.photo.tall { min-height: 560px; }
.photo.full { min-height: 72vh; }

.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: center;
}

.split.top { align-items: start; }
.split.reverse > :first-child { order: 2; }

.cols-3, .cols-4, .cols-5, .cols-6 { display: grid; gap: 28px; }
.cols-3 { grid-template-columns: repeat(3, 1fr); }
.cols-4 { grid-template-columns: repeat(4, 1fr); }
.cols-5 { grid-template-columns: repeat(5, 1fr); }
.cols-6 { grid-template-columns: repeat(6, 1fr); }

.num {
  font-family: var(--serif);
  font-size: 18px;
  letter-spacing: 0.12em;
  margin-bottom: 10px;
  color: var(--muted);
}

.rule {
  width: 28px;
  height: 1px;
  background: currentColor;
  opacity: 0.35;
  margin: 10px 0 16px;
}

.product-block {
  display: grid;
  gap: 16px;
}

.product-block img,
.card-media {
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  background: #e8e2d6;
}

.card-media.wide { aspect-ratio: 16/10; }

.tag {
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
}

.soon {
  display: inline-block;
  margin-top: 8px;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--heart);
}

.icon-row {
  display: grid;
  gap: 18px;
}

.icon-item h3 { margin: 8px 0 8px; font-size: 20px; }

.quote-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 20px; }
.quote-card {
  background: var(--paper);
  padding: 28px;
  border: 1px solid var(--line);
}
.quote-card p { margin: 0 0 12px; }
.quote-main { font-family: var(--serif); font-size: 32px; line-height: 1.25; }

.qr-band {
  display: grid;
  grid-template-columns: 1.25fr auto 1fr;
  gap: 0;
  align-items: center;
  background: transparent;
  padding: 38px 0;
  border: 0;
}
.qr-band > * { padding: 8px 40px; }
.qr-band > :first-child { padding-left: 0; }
.qr-band h2 {
  font-size: clamp(22px, 2.3vw, 30px);
  line-height: 1.3;
  white-space: nowrap;
}
.qr-band > :first-child .muted { margin: 12px 0 0; font-size: 14px; }
.qr-center {
  text-align: center;
  border-left: 1px solid rgba(22, 21, 19, 0.2);
  border-right: 1px solid rgba(22, 21, 19, 0.2);
}
.qr-band img { width: 132px; height: 132px; object-fit: cover; }

.page-hero {
  padding: 88px 0 40px;
}
.page-hero.with-photo {
  min-height: 100vh;
  min-height: 100svh;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: end;
  background: var(--paper) right center / cover no-repeat;
}
.page-hero.with-photo .hero-copy { padding: 120px 8% 64px; }

.steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

.table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.table th, .table td {
  text-align: left;
  padding: 16px 12px;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.table th {
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 600;
}

.faq-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 48px;
  align-items: start;
}
.faq-nav a {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
  letter-spacing: 0.06em;
}
.faq-nav a.is-active { font-weight: 700; }
.faq-cta {
  margin-top: 28px;
  padding: 22px;
  background: var(--paper);
  border: 1px solid var(--line);
}

details {
  border-bottom: 1px solid var(--line);
  padding: 16px 0;
}
details summary {
  cursor: pointer;
  font-weight: 600;
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: 16px;
}
details summary::-webkit-details-marker { display: none; }
details > summary::after { content: "+"; color: var(--muted); }
details[open] > summary::after { content: "–"; }
details p { color: var(--muted); margin: 12px 0 0; }

.form-grid { display: grid; grid-template-columns: 0.85fr 1.4fr; gap: 40px; }
form { display: grid; gap: 14px; }
label { font-size: 13px; display: grid; gap: 6px; }
input, select, textarea {
  width: 100%;
  border: 1px solid var(--line);
  background: var(--white);
  padding: 12px 14px;
}
textarea { min-height: 140px; resize: vertical; }
.chips {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.chip {
  position: relative;
  border: 1px solid var(--line);
  padding: 22px 12px 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 96px;
  background: var(--white);
  cursor: pointer;
  font-size: 13px;
  letter-spacing: 0.01em;
  text-align: center;
}
.chip input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.chip-icon {
  width: 28px;
  height: 28px;
  color: var(--ink);
}
.chip-icon svg {
  width: 100%;
  height: 100%;
  display: block;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.chip:hover,
.chip:has(:checked) {
  border-color: var(--ink);
}
.chip:has(:checked) {
  background: var(--paper);
  box-shadow: inset 0 0 0 1px var(--ink);
}
.chip:has(:checked) .chip-icon {
  color: var(--navy);
}
.check-list {
  display: grid;
  gap: 8px;
  background: var(--white);
  border: 1px solid var(--line);
  padding: 14px 16px;
}
.check-list label {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
}
.check-list input { width: 16px; height: 16px; accent-color: var(--navy); }
.form-note { margin: 0; font-size: 13px; color: var(--muted); }
.char-count { font-size: 12px; color: var(--muted); text-align: right; }
.form-status {
  padding: 16px;
  border: 1px solid var(--line);
  background: var(--paper);
}
.form-status.is-ok { border-color: #1f7a4d; }
.form-status.is-error { border-color: var(--heart); color: var(--heart); }
.next-card {
  background: var(--paper);
  border: 1px solid var(--line);
  padding: 20px;
  display: grid;
  gap: 8px;
}
.btn:disabled { opacity: 0.55; cursor: wait; }

.cta-dark {
  background: var(--navy);
  color: var(--white);
  padding: 72px 0;
}
.cta-dark h2 { color: var(--white); }
.cta-dark p { color: rgba(255,255,255,.72); }
.cta-dark .btn.ghost { color: var(--white); border-color: rgba(255, 255, 255, 0.55); }
.cta-dark .link-arrow { color: var(--white); }
.btn.light-solid { background: var(--white); color: var(--navy); border-color: var(--white); }

.site-footer {
  background: var(--navy);
  color: rgba(255, 255, 255, 0.72);
  padding: 56px 0 24px;
}
.site-footer a { color: var(--white); }
.footer-grid {
  display: grid;
  grid-template-columns: 1.5fr repeat(4, 1fr);
  gap: 28px;
}
.brand-word {
  font-size: 22px;
  color: var(--white);
  letter-spacing: 0.08em;
  font-weight: 700;
}
.footer-links { display: grid; gap: 8px; font-size: 14px; }
.tiny { font-size: 12px; opacity: 0.7; margin-top: 36px; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.tiny span:last-child { display: inline-flex; gap: 14px; }
.footer-head {
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255,255,255,.5);
  margin: 0 0 12px;
}

.menu-btn {
  display: grid;
  place-items: center;
  background: none;
  border: 0;
  padding: 8px 0;
  width: 29px;
  cursor: pointer;
}

/* Three-line icon, matching the design's 29px width and 7px line spacing. */
.menu-bars,
.menu-bars::before,
.menu-bars::after {
  display: block;
  width: 29px;
  height: 1.5px;
  background: currentColor;
  border-radius: 2px;
}
.menu-bars { position: relative; }
.menu-bars::before,
.menu-bars::after {
  content: "";
  position: absolute;
  left: 0;
}
.menu-bars::before { top: -7px; }
.menu-bars::after { top: 7px; }

/* Full link drawer behind the hamburger — serves desktop and mobile alike */
.nav-drawer {
  display: none;
  background: rgba(247, 243, 236, 0.97);
  backdrop-filter: blur(16px);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.nav-drawer.is-open { display: block; }
.nav-drawer-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 30px;
  padding: 18px 0 20px;
}
.nav-drawer-inner a {
  font-size: 14px;
  color: var(--muted);
  letter-spacing: 0.04em;
}
.nav-drawer-inner a:hover,
.nav-drawer-inner a.is-active { color: var(--ink); }
.nav-drawer-inner .lang-switch {
  margin-left: auto;
  letter-spacing: 0.12em;
}

@media (max-width: 1100px) {
  .header-row { grid-template-columns: 1fr auto; }
  .nav { display: none; }
  .nav.open {
    display: flex;
    position: absolute;
    left: 0;
    right: 0;
    top: 78px;
    background: #f7f3ec;
    color: var(--ink);
    padding: 16px 24px 24px;
    flex-direction: column;
    align-items: flex-start;
    border-bottom: 1px solid var(--line);
    box-shadow: 0 18px 40px rgba(22, 21, 19, 0.08);
  }
  .theme-cn .nav.open { top: 56px; }
  .nav.open a { color: var(--ink); }
  .menu-btn { display: block; }
}

/* English home hero alignment from the 2026-09-03 reference board. */
.en-home-hero {
  min-height: clamp(680px, 63.5vw, 915px);
  background-position: center center;
}
.en-home-hero .hero-copy {
  padding-top: clamp(128px, 11vw, 176px);
  padding-bottom: clamp(82px, 8vw, 116px);
}
.en-home-hero h1 { max-width: 8.2em; }
.en-home-hero .lead { max-width: 21em; line-height: 1.55; }
.en-home-hero .hero-actions { margin-top: 28px; }
@media (max-width: 900px) {
  .en-home-hero { min-height: 92svh; background-position: 68% center; }
  .en-home-hero .hero-copy { padding-top: 108px; padding-bottom: 52px; }
  .en-home-hero h1 { max-width: 9em; }
}

/* —— Enrichment for design-pack fidelity —— */
.breadcrumb {
  margin: 0 0 18px;
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--muted);
}
.breadcrumb a:hover { color: var(--ink); }

.product-stage {
  position: relative;
  display: grid;
  gap: 16px;
  padding: 8px 0 0;
}
.product-stage .ghost-vol {
  position: absolute;
  top: 6%;
  left: 4%;
  transform: none;
  z-index: 0;
  font-family: var(--serif);
  font-size: clamp(42px, 5.6vw, 72px);
  letter-spacing: 0.02em;
  color: rgba(22, 21, 19, 0.1);
  white-space: nowrap;
  pointer-events: none;
  line-height: 0.88;
}
.product-stage img {
  position: relative;
  z-index: 1;
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  background: #e8e2d6;
}
.product-stage .num { position: relative; z-index: 1; }

.icon-card {
  display: grid;
  gap: 12px;
  justify-items: start;
}
.icon-svg {
  display: inline-block;
  vertical-align: middle;
  width: 36px;
  height: 36px;
  color: var(--ink);
}
.icon-svg svg {
  display: block;
  width: 100%;
  height: 100%;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.icon-card h3 { font-size: 18px; }
.icon-card p { margin: 0; font-size: 14px; color: var(--muted); }

.lifestyle-band {
  min-height: clamp(320px, 24vw, 400px);
  display: grid;
  align-items: center;
  background: var(--paper) center/cover no-repeat;
  padding: 52px 0;
}
.lifestyle-band .wrap { max-width: 620px; margin-left: max(24px, calc((100% - var(--max)) / 2)); }
.lifestyle-band h2 {
  color: var(--ink);
  line-height: 1.28;
  font-size: clamp(24px, 2.9vw, 40px);
}
.lifestyle-band p { color: var(--muted); }
.lifestyle-band .rule { width: 34px; margin: 20px 0 18px; opacity: 0.55; }
.lifestyle-band > .wrap > p { margin: 0 0 18px; font-size: 14.5px; line-height: 1.9; }
.lifestyle-band > .wrap > p:last-child { margin: 0; }

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 28px;
}
.gallery-grid img,
.gallery-grid .photo {
  min-height: 0;
  aspect-ratio: 4/5;
  width: 100%;
  object-fit: cover;
  background: #e8e2d6;
}

.feature-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 28px;
}
.feature-card {
  display: grid;
  gap: 12px;
}
.feature-card .photo,
.feature-card img {
  min-height: 0;
  aspect-ratio: 5/4;
  object-fit: cover;
  background: #e8e2d6;
}
.feature-card h3 { font-size: 20px; }
.feature-card p { margin: 0; color: var(--muted); font-size: 14px; }

.qr-circle {
  width: 148px;
  height: 148px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid var(--line);
  background: #fff;
}
.qr-band {
  align-items: center;
}
.qr-band .qr-note {
  margin: 8px 0 0;
  font-size: 13px;
  color: var(--muted);
}

.process-strip {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  margin-top: 28px;
}
.process-strip .photo {
  min-height: 0;
  aspect-ratio: 1;
}
.process-strip article { display: grid; gap: 10px; }

.quote-mark {
  font-family: var(--serif);
  font-size: 64px;
  line-height: 0.8;
  color: rgba(22, 21, 19, 0.18);
  margin-bottom: 8px;
}

.theme-cn .site-footer {
  background: #f7f3ec;
  color: var(--muted);
  border-top: 1px solid var(--line);
}
.theme-cn .site-footer a,
.theme-cn .brand-word { color: var(--ink); }
.theme-cn .footer-head { color: rgba(22, 21, 19, 0.45); }
.theme-cn .tiny { color: var(--muted); }
.theme-cn .header-cta {
  border-radius: 999px;
  padding: 0 22px;
}

.specs-note {
  margin-top: 12px;
  font-size: 13px;
  color: var(--muted);
}

.modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(12, 20, 36, 0.55);
}
.modal.is-open { display: flex; }
.modal-card {
  width: min(420px, 100%);
  background: var(--paper);
  padding: 32px 28px;
  text-align: center;
  display: grid;
  gap: 14px;
  justify-items: center;
}
.modal-card img {
  width: 180px;
  height: 180px;
  border-radius: 50%;
  object-fit: cover;
}
.modal-close {
  border: 0;
  background: none;
  font-size: 13px;
  letter-spacing: 0.08em;
  cursor: pointer;
  color: var(--muted);
  margin-top: 8px;
}

.legal-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.legal-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  gap: 12px;
  padding: 28px 26px 24px;
  min-height: 268px;
  background: #fff;
  border: 1px solid rgba(22, 21, 19, 0.08);
  color: inherit;
  text-decoration: none;
  transition: border-color 0.2s ease;
}
.legal-card:hover { border-color: rgba(22, 21, 19, 0.28); }
.legal-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  margin-bottom: 4px;
}
.legal-card .num {
  margin: 0;
  font-size: 36px;
  letter-spacing: 0.02em;
  line-height: 1;
  color: rgba(22, 21, 19, 0.22);
}
.legal-card .icon-svg {
  width: 26px;
  height: 26px;
  margin: 4px 0 0;
  color: var(--ink);
}
.legal-card h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
}
.legal-card .muted { margin: 0; }
.legal-card .link-arrow {
  margin-top: auto;
  padding-top: 18px;
  font-size: 14px;
  font-weight: 700;
}
.legal-card details {
  width: 100%;
  margin-top: auto;
  border: 0;
  padding: 0;
}
.legal-card summary.link-arrow {
  display: inline-block;
  margin-top: 0;
  padding-top: 18px;
  cursor: pointer;
  list-style: none;
  justify-content: flex-start;
}
.legal-card summary.link-arrow::-webkit-details-marker { display: none; }
.legal-card details > summary::after,
.legal-card details[open] > summary::after { content: none; }
.legal-card details[open] summary.link-arrow { margin-bottom: 10px; }
.legal-card details p { margin: 0 0 10px; }
.legal-card .legal-more {
  font-size: 13px;
  line-height: 1.7;
  color: var(--muted);
}
.legal-card .legal-more p,
.legal-card .legal-more ul { margin: 0 0 10px; }
.legal-card .legal-more p:last-child,
.legal-card .legal-more ul:last-child { margin-bottom: 0; }
.privacy-hero { position: relative; }
.privacy-hero .privacy-side {
  position: absolute;
  right: 7%;
  bottom: 12%;
  top: auto;
  margin: 0;
  writing-mode: horizontal-tb;
  text-align: right;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(26, 40, 52, 0.62);
  font-size: 12px;
  line-height: 1.75;
  pointer-events: none;
}
.privacy-foot {
  margin: 48px 0 0;
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--muted);
  line-height: 1.8;
}
.terms-hero { position: relative; }
.terms-hero .legal-hero-still { background-position: 68% 40%; }
.terms-hero .legal-side,
.terms-close .legal-side {
  position: absolute;
  right: 5%;
  top: 38%;
  margin: 0;
  writing-mode: vertical-rl;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.88);
  font-size: 12px;
  pointer-events: none;
}
.terms-close { position: relative; }
.terms-stack { display: grid; }
.terms-row {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) 240px;
  gap: 40px;
  align-items: start;
  padding: 56px 0;
  border-top: 1px solid var(--line);
}
.terms-index { display: grid; gap: 12px; justify-items: start; }
.terms-index .icon-svg { width: 26px; height: 26px; }
.terms-index .num { font-size: 40px; line-height: 1; }
.terms-row h2 { margin: 0 0 16px; }
.legal-body ul {
  margin: 0 0 14px;
  padding-left: 1.15em;
  color: var(--muted);
}
.legal-body li { margin: 0 0 8px; }
.legal-body .legal-sub {
  margin: 18px 0 8px;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink);
  font-weight: 600;
}
.terms-note { padding-top: 8px; }
.terms-note h2 { margin: 0 0 12px; }
.terms-note h3 { margin: 22px 0 8px; font-size: 18px; }
.terms-callout {
  padding: 18px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  min-height: 140px;
  display: grid;
  align-content: center;
  gap: 8px;
}
.terms-callout p { margin: 0; }
.terms-callout .photo {
  min-height: 220px;
  position: relative;
  display: grid;
  align-items: end;
}
.terms-callout .photo p {
  margin: 0;
  padding: 16px;
  color: #fff;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: 11px;
  line-height: 1.7;
  text-shadow: 0 1px 10px rgba(12, 20, 36, 0.4);
}
.privacy-contact {
  display: grid;
  grid-template-columns: 1.15fr 0.75fr 0.95fr;
  gap: 36px;
  align-items: stretch;
}
.privacy-contact > div:nth-child(2) {
  border-left: 1px solid var(--line);
  padding-left: 36px;
}
.privacy-lines { display: grid; gap: 14px; margin-top: 28px; }
.privacy-lines p {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 10px;
  align-items: start;
  margin: 0;
}
.privacy-lines .icon-svg { width: 20px; height: 20px; }
.privacy-leaf {
  position: relative;
  min-height: 420px;
  display: grid;
  align-items: end;
}
.privacy-leaf p {
  margin: 0;
  padding: 24px;
  color: #fff;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-size: 12px;
  line-height: 1.8;
  text-shadow: 0 1px 10px rgba(12, 20, 36, 0.35);
}
.privacy-leaf span { letter-spacing: 0.08em; text-transform: none; }
.privacy-close {
  min-height: 72vh;
  display: grid;
  align-items: center;
  background: var(--paper) center/cover no-repeat;
  padding: 80px 0;
}
.privacy-close .wrap { max-width: 560px; }
.privacy-close.privacy-banner {
  min-height: 78vh;
  align-items: start;
  padding: 108px 0 88px;
  background-color: transparent;
  background-position: 70% 42%;
  background-size: cover;
}
.privacy-close.privacy-banner .wrap { max-width: 640px; }
.privacy-close.privacy-banner .kicker {
  margin: 0;
  color: #243240;
  letter-spacing: 0.2em;
  font-size: 12px;
  font-weight: 600;
}
.privacy-close.privacy-banner h2 {
  margin: 18px 0 0;
  font-size: clamp(34px, 4.4vw, 54px);
  line-height: 1.32;
  letter-spacing: 0;
  color: #1a2834;
  font-weight: 600;
  max-width: 12em;
}
.privacy-close.privacy-banner .rule {
  width: 56px;
  height: 1px;
  margin: 28px 0 24px;
  background: #1a2834;
  opacity: 1;
}
.privacy-sign {
  margin: 0;
  font-family: var(--sans);
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: #1a2834;
}
.privacy-sign sub {
  font-size: 0.62em;
  letter-spacing: 0;
}
.privacy-sign-tag {
  margin: 8px 0 0;
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: #31404c;
}
.privacy-close.terms-close.terms-banner {
  min-height: 0;
  aspect-ratio: 3 / 1;
  align-items: start;
  padding: 64px 0 48px;
  background-color: transparent;
  background-position: center center;
  background-size: cover;
}
.privacy-close.terms-close.terms-banner .wrap { max-width: 640px; }
.privacy-close.terms-close.terms-banner h2 {
  margin: 0;
  font-size: clamp(26px, 3.4vw, 44px);
  line-height: 1.32;
  letter-spacing: 0;
  color: #1a2834;
  font-weight: 600;
}
.privacy-close.terms-close.terms-banner .rule {
  width: 56px;
  height: 1px;
  margin: 24px 0 22px;
  background: #1a2834;
  opacity: 1;
}
.terms-close.terms-banner .legal-side {
  writing-mode: horizontal-tb;
  text-align: right;
  color: #5d6872;
  letter-spacing: 0.28em;
  font-size: 12px;
  line-height: 1.9;
  font-weight: 500;
  right: 6.5%;
  top: auto;
  bottom: 20%;
}
.legal-stack { display: grid; gap: 48px; max-width: 46em; }
.legal-chapter .legal-body p { margin: 0 0 14px; color: var(--muted); }
.legal-appendix-link {
  margin: 28px auto 0;
}
.section.legal-detail {
  padding: 0;
  background: var(--paper);
}
.legal-detail-bar {
  display: none;
  margin: 0 auto 20px;
}
.legal-detail .legal-chapter { display: none; }
.legal-detail .legal-chapter:target,
#policy-body:target .legal-chapter {
  display: block;
  padding-bottom: 28px;
  border-bottom: 1px solid var(--line);
}
#policy-body:target .legal-chapter:last-child { border-bottom: 0; padding-bottom: 0; }
.legal-detail:has(:target),
#policy-body:target {
  padding: 12px 0 64px;
}
.legal-detail:has(:target) .legal-detail-bar,
#policy-body:target .legal-detail-bar { display: block; }
.legal-detail .legal-stack {
  gap: 32px;
  max-width: 42em;
}
.legal-detail .legal-chapter h2 {
  font-size: clamp(22px, 2.2vw, 28px);
  margin: 0 0 12px;
}
.legal-contact p { max-width: 36em; }
.social-row {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin: 14px 0 0;
  font-size: 13px;
  letter-spacing: 0.08em;
  color: var(--muted);
}
.social-row a:hover { color: var(--ink); }
.quotes-band {
  display: grid;
  align-items: center;
  background-size: cover;
  background-position: center;
  padding: 54px 0 58px;
}
.page-hero.with-photo { min-height: 100vh; min-height: 100svh; }
.hero.full-bleed,
.page-hero.with-photo.full-bleed {
  min-height: clamp(520px, 50vw, 740px);
  background-position: center center;
}

.full-story {
  min-height: clamp(320px, 27vw, 420px);
  display: grid;
  align-items: center;
  justify-items: start;
  background: var(--paper) center/cover no-repeat;
  padding: 56px 0;
}
.full-story .wrap {
  margin-left: 8%;
  max-width: 520px;
  text-align: left;
}
.full-story h2 { line-height: 1.3; font-size: clamp(24px, 2.7vw, 38px); }
.full-story .muted { margin: 18px 0 0; font-size: 14.5px; line-height: 1.85; }
.full-story .tag { margin: 22px 0 0; line-height: 1.85; }

.collection-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 24px;
  margin-bottom: 28px;
}
.collection-head.design-slim {
  margin-bottom: 8px;
}
.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;
}
.collection-stage {
  display: grid;
  grid-template-columns: 1fr 0.92fr 1.08fr 0.96fr;
  gap: 8px 28px;
  align-items: start;
  padding: 8px 0 80px;
}
/* —— Home water collection collage —— */
.collection-band {
  background: #eae1d9;
  padding: 56px 0 0;
  overflow: hidden;
}
.collection-band .collection-head { margin-bottom: 4px; }
.collection-band h2 { font-size: clamp(26px, 2.7vw, 38px); }
.collection-band .lead { margin: 14px 0 0; font-size: 14.5px; }
.collection-head .link-arrow {
  padding-bottom: 6px;
  box-shadow: inset 0 -1px 0 currentColor;
  white-space: nowrap;
}

.pw-stage {
  display: grid;
  grid-template-columns: 1fr 0.95fr 1.07fr;
  align-items: end;
  gap: 0;
}
.pw-col { display: grid; gap: 0; }
.pw-item {
  position: relative;
  margin: 0;
}
/* Photos are tone-matched to the band, so fading their borders makes the
   four separate shots read as a single continuous scene. */
.pw-item img {
  width: 100%;
  height: auto;
  display: block;
  background: transparent;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
}
/* Any photo whose top edge lands inside the band must dissolve upward too. */
.pw-col-a .pw-item img,
.pw-col-c .pw-item img,
.pw-col-b .pw-item + .pw-item img {
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%),
                      linear-gradient(transparent 0, #000 15%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%),
              linear-gradient(transparent 0, #000 15%);
  mask-composite: intersect;
}
.pw-col-b .pw-item + .pw-item { margin-top: -9%; }

.pw-label {
  position: absolute;
  z-index: 2;
  display: grid;
  justify-items: start;
  gap: 6px;
  line-height: 1.35;
}
.pw-num {
  font-family: "Noto Serif SC", "Songti SC", Georgia, serif;
  font-variant-numeric: lining-nums;
  font-feature-settings: "lnum" 1;
  font-size: clamp(17px, 1.4vw, 21px);
  color: rgba(22, 21, 19, 0.42);
  letter-spacing: 0.06em;
  line-height: 1;
}
.pw-name {
  font-size: clamp(15px, 1.25vw, 19px);
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--ink);
}
.pw-name sub { font-size: 0.68em; }
.pw-vol { font-size: 13px; color: var(--muted); }
.pw-soon {
  font-size: 12px;
  line-height: 1.7;
  color: var(--muted);
}
.pw-soon em {
  font-style: normal;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 11px;
}
.pw-link {
  margin-top: 6px;
  font-size: 12.5px;
  letter-spacing: 0.06em;
  color: var(--ink);
  display: inline-flex;
  gap: 7px;
}
.pw-link:hover { box-shadow: inset 0 -1px 0 currentColor; }

/* label placement mirrors the design collage */
.pw-label-a { left: 2%;  top: 40%; }
.pw-label-b { left: 1%;  top: 6%; }
.pw-label-c { left: 1%;  top: 34%; }
.pw-label-d { left: 0;   top: 3%; }

/* Slot 04 keeps its volume figure as live text, so the photo can be framed
   with enough margin for the edge mask to clear the carton. */
.pw-col-c {
  align-self: stretch;
  position: relative;
}
.pw-col-c .pw-item {
  height: 100%;
  display: grid;
  align-content: end;
}
.pw-mark {
  position: absolute;
  right: 4%;
  top: 1%;
  z-index: 1;
  font-family: "Noto Serif SC", "Songti SC", Georgia, serif;
  font-variant-numeric: lining-nums;
  font-feature-settings: "lnum" 1;
  font-weight: 500;
  font-size: clamp(44px, 5.2vw, 78px);
  line-height: 0.9;
  letter-spacing: 0.01em;
  color: rgba(22, 21, 19, 0.13);
  pointer-events: none;
  user-select: none;
}
.pw-mark em {
  font-style: normal;
  font-size: 0.34em;
  letter-spacing: 0.06em;
  vertical-align: 0.35em;
  margin-left: 0.12em;
}
.collection-stage .product-stage:nth-child(1) { margin-top: 92px; }
.collection-stage .product-stage:nth-child(2) { margin-top: 0; }
.collection-stage .product-stage:nth-child(3) { margin-top: 108px; }
.collection-stage .product-stage:nth-child(4) { margin-top: 36px; }
.collection-stage.design-match .product-stage { margin-top: 0; }
.product-stage.overlay {
  padding: 0;
  overflow: visible;
  min-height: 0;
  gap: 10px;
}
.product-stage.overlay img {
  background: transparent;
  object-fit: contain;
  aspect-ratio: 3/4;
}
.product-stage.overlay .num {
  position: relative;
  top: auto;
  left: auto;
  z-index: 2;
  font-size: 13px;
  letter-spacing: 0.08em;
  color: var(--muted);
}
.product-stage.overlay .stage-copy {
  position: relative;
  left: auto;
  right: auto;
  bottom: auto;
  z-index: 2;
  padding: 0;
  background: none;
  text-shadow: none;
}
.product-stage.overlay .stage-copy h3 {
  margin: 0 0 4px;
  font-size: clamp(20px, 1.8vw, 28px);
}
.product-stage.overlay .stage-copy .vol {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 14px;
}
.product-stage.overlay .ghost-vol { display: block; }
.qr-photo-band {
  background-size: cover;
  background-position: center;
}
.wish-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  margin-top: 36px;
  text-align: center;
}
.wish-card img {
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  background: #ece7de;
}
.capacity-band {
  background-size: cover;
  background-position: center;
  padding: 80px 0;
}
.usage-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin: 20px 0 16px;
}
.usage-row .icon-card { gap: 6px; }
.usage-row .icon-card h3 { font-size: 13px; font-weight: 500; }
.usage-row .icon-card p { display: none; }
.theme-cn .hero.full-bleed { background-position: 72% center; }
.icon-even { justify-items: center; text-align: center; }
.icon-even .icon-card {
  justify-items: center;
  width: 100%;
  border-right: 1px solid var(--line);
  padding: 0 12px;
}
.icon-even .icon-card:last-child { border-right: 0; }
.icon-even .icon-card p { line-height: 1.7; }
.theme-cn .split > div > .num {
  font-size: clamp(42px, 5.2vw, 76px);
  letter-spacing: 0.02em;
  color: rgba(22, 21, 19, 0.2);
  margin-bottom: 6px;
}
.social-row svg {
  width: 22px;
  height: 22px;
  fill: currentColor;
  stroke: none;
  display: block;
}
.social-row a,
.social-row span {
  display: inline-flex;
  color: var(--ink);
}

.quote-grid.offset { align-items: start; }
.quote-card.feature {
  background: transparent;
  border: 0;
  padding: 8px 8px 0 0;
}
.quote-stack { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; align-items: start; }
.quote-stack .quote-card { background: rgba(252, 250, 246, 0.86); }
.quote-stack .quote-card:nth-child(1) { margin-top: 52px; }
.quote-stack .quote-card:nth-child(2) { margin-top: 0; }
.quote-stack .quote-card:nth-child(3) { margin-top: 84px; }
.quote-stack .quote-card:nth-child(4) { margin-top: 28px; }

.qr-photo-band {
  background-size: cover;
  background-position: center;
  padding: 0;
}
.qr-center .qr-note { margin-top: 10px; }
.qr-side p { margin: 0 0 8px; }
.qr-side p:first-child { font-size: 15px; font-weight: 500; }
.qr-side .muted { font-size: 13.5px; }
.qr-side p:last-child { margin: 16px 0 0; }
.qr-circle { width: 128px; height: 128px; }

.products-photo-band {
  position: relative;
  padding: 88px 0 72px;
  background: var(--paper) center/cover no-repeat;
  overflow: hidden;
}
.products-watermark {
  position: absolute;
  inset: 8% 0 auto;
  margin: 0;
  text-align: center;
  font-family: var(--serif);
  font-size: clamp(96px, 18vw, 240px);
  letter-spacing: 0.12em;
  color: rgba(22, 21, 19, 0.12);
  pointer-events: none;
}
.product-mosaic {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
  align-items: end;
}
.mosaic-card {
  display: grid;
  gap: 12px;
}
.mosaic-card img {
  width: 100%;
  aspect-ratio: 3/4;
  object-fit: contain;
  background: transparent;
}
.mosaic-copy h3 { margin: 0; font-size: 22px; }
.quality-band {
  background-size: cover;
  background-position: center;
  padding: 88px 0;
}
.quality-mark { position: relative; overflow: visible; }
.quality-mark .hero-watermark {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  right: 5%;
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
  line-height: 0.82;
  font-size: clamp(88px, 12vw, 168px);
}
.quality-mark .hero-watermark span { display: block; }
.quality-mark .hero-side-label { top: 38%; }

.product-showcase {
  display: grid;
  grid-template-columns: 1.35fr 0.65fr;
  gap: 10px;
  min-height: 520px;
}
.product-showcase > .photo { min-height: 520px; }
.showcase-stack { display: grid; gap: 10px; }
.showcase-stack .photo { min-height: 0; }

.form-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.form-tile.has-photo {
  padding: 0;
  overflow: hidden;
  background: #fff;
}
.form-tile.has-photo .photo {
  min-height: 0;
  aspect-ratio: 16/10;
}
.form-tile.has-photo .num,
.form-tile.has-photo h3 { padding: 14px 16px 0; }
.form-tile.has-photo p { padding: 0 16px 18px; }

.day-strip {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  margin-top: 36px;
}
.day-card .photo { min-height: 0; aspect-ratio: 3/4; }
.day-time {
  margin: 12px 0 0;
  font-family: var(--serif);
  letter-spacing: 0.08em;
}
.space-stack { display: grid; gap: 0; margin-top: 48px; }
.space-row {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  align-items: stretch;
}
.space-row.reverse { grid-template-columns: 1.15fr 1fr; }
.space-row.reverse .space-copy { order: 2; }
.space-copy {
  display: grid;
  align-content: center;
  padding: 48px 8% 48px 0;
}
.space-row.reverse .space-copy { padding: 48px 0 48px 8%; }
.space-photo,
.photo.tall.space-photo {
  min-height: 0;
  aspect-ratio: 3 / 2;
  mask-image: linear-gradient(90deg, transparent, #000 18%, #000);
}
.space-row.reverse .space-photo {
  mask-image: linear-gradient(270deg, transparent, #000 18%, #000);
}
.place-band {
  min-height: 78vh;
  display: grid;
  align-items: center;
  background: var(--navy) center/cover no-repeat;
  padding: 80px 0;
}
.page-hero.brand-hero {
  grid-template-columns: 1fr;
  align-items: center;
  background-position: 88% center;
}
.page-hero.brand-hero .hero-copy {
  max-width: 720px;
  padding: 96px 8% 88px;
}
.page-hero.brand-hero h1 {
  font-size: clamp(36px, 4.6vw, 58px);
  line-height: 1.22;
  max-width: none;
}
.nowrap { white-space: nowrap; }
.page-hero.brand-hero .lead {
  margin-top: 28px;
  font-size: 20px;
  color: var(--ink);
  max-width: none;
}
.brand-verse {
  margin: 22px 0 0;
  font-size: 16px;
  line-height: 1.95;
  color: var(--muted);
  max-width: 22em;
}
.brand-fade {
  min-height: 82vh;
  display: grid;
  align-items: center;
  background: var(--paper) center / cover no-repeat;
  padding: 88px 0;
}
.brand-fade .wrap {
  max-width: 560px;
  margin-left: auto;
  margin-right: 8%;
}
.brand-fade.left .wrap {
  margin-left: 8%;
  margin-right: auto;
}
.brand-mission {
  display: grid;
  grid-template-columns: 0.92fr 1.18fr;
  min-height: 82vh;
  background: var(--paper);
}
.mission-copy {
  display: grid;
  align-content: center;
  padding: 80px 8% 80px 10%;
}
.mission-photo {
  min-height: 82vh;
  background: #ece7de right center / cover no-repeat;
}
.mission-steps {
  list-style: none;
  margin: 48px 0 0;
  padding: 0;
  display: grid;
  gap: 12px;
  font-family: var(--serif);
  font-size: clamp(22px, 2.2vw, 32px);
  line-height: 1.2;
}
.mission-steps li:nth-child(2) { margin-left: 8%; }
.mission-steps li:nth-child(3) { margin-left: 16%; }
.mission-steps li:nth-child(4) { margin-left: 24%; }
.brand-further .wrap {
  max-width: 520px;
  margin-left: 8%;
  color: #fff;
}
.brand-further h2,
.brand-further p { color: #fff; }
.brand-quote {
  min-height: 78vh;
  display: grid;
  align-items: center;
  background: var(--navy) center / cover no-repeat;
  padding: 88px 0;
  color: #fff;
}
.brand-quote-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 48px;
  align-items: end;
}
.brand-quote h2 { color: #fff; }
.brand-quote p {
  color: rgba(255,255,255,.84);
  margin: 0;
  max-width: 28em;
}
.brand-future {
  min-height: 78vh;
  display: grid;
  align-items: end;
  background: var(--paper) center / cover no-repeat;
  padding: 88px 0 64px;
}
.future-icons {
  display: grid;
  grid-template-columns: repeat(4, max-content);
  gap: 28px 48px;
  margin-top: 40px;
}
.future-icons .icon-card { padding: 0; background: none; }
.future-icons .icon-card p { display: none; }
.future-icons .icon-card h3 { font-size: 15px; }
.find-way { background-size: cover; background-position: bottom center; }

@media (max-width: 900px) {
  .hero,
  .split,
  .page-hero.with-photo,
  .legal-grid,
  .privacy-contact,
  .terms-row,
  .cols-3, .cols-4, .cols-5, .cols-6,
  .quote-grid, .qr-band, .steps, .faq-layout, .form-grid, .footer-grid,
  .gallery-grid, .feature-grid, .process-strip,
  .collection-stage, .product-mosaic, .day-strip, .quote-stack,
  .space-row, .space-row.reverse, .wish-grid {
    grid-template-columns: 1fr;
  }
  .privacy-contact > div:nth-child(2) {
    border-left: none;
    padding-left: 0;
  }
  .collection-stage .product-stage:nth-child(n) { margin-top: 0; transform: none; }
  .collection-stage.design-match {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .space-row.reverse .space-copy { order: 0; padding: 24px 0; }
  .space-photo,
  .space-row.reverse .space-photo,
  .theme-cn.page-ways .space-photo,
  .theme-cn.page-ways .photo.tall.space-photo {
    mask-image: none;
    min-height: 220px;
    width: 100%;
    max-width: 100%;
    aspect-ratio: auto;
    height: 240px;
  }
  .products-watermark { font-size: 72px; }
  .hero.full-bleed,
  .page-hero.with-photo.full-bleed,
  .full-story,
  .brand-fade { min-height: 70svh; }
  .hero,
  .page-hero.with-photo { min-height: 70svh; }
  .full-story .wrap { margin-left: 24px; margin-right: 24px; }
  .qr-band > * { padding: 16px 0; }
  .qr-center { border-left: 0; border-right: 0; border-top: 1px solid rgba(22,21,19,.16); border-bottom: 1px solid rgba(22,21,19,.16); padding: 24px 0; }
  .form-2col,
  .product-showcase { grid-template-columns: 1fr; }
  .icon-even .icon-card {
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding: 18px 0;
  }
  .icon-even .icon-card:last-child { border-bottom: 0; }
  .quote-stack .quote-card:nth-child(n) { margin-top: 0; }
  .brand-fade .wrap,
  .brand-fade.left .wrap {
    margin-left: 24px;
    margin-right: 24px;
  }
  .brand-mission,
  .brand-quote-grid,
  .future-icons {
    grid-template-columns: 1fr;
  }
  .mission-photo { min-height: 42vh; }
  .mission-copy { padding: 48px 24px; }
  .mission-steps li:nth-child(n) { margin-left: 0; }
  .brand-further .wrap { margin-left: 24px; }
  .privacy-hero .privacy-side,
  .terms-hero .legal-side { display: none; }
  .privacy-close { min-height: 52vh; }
  .privacy-close.privacy-banner {
    min-height: 58vh;
    padding: 56px 0 48px;
    background-position: 78% 40%;
  }
  .privacy-close.terms-close.terms-banner {
    aspect-ratio: auto;
    min-height: 56vh;
    padding: 48px 0 40px;
    background-size: cover;
    background-position: 18% 50%;
  }
  .terms-close.terms-banner .legal-side { display: none; }
  .privacy-close.terms-close.terms-banner h2 { font-size: 22px; }
  .privacy-close.privacy-banner h2 { font-size: 30px; }
  .hero-copy,
  .page-hero.with-photo .hero-copy { padding: 108px 6% 36px; }
  .hero-watermark { font-size: 88px; right: 8%; bottom: 8%; }
  .hero-side-label, .scroll-cue { display: none; }
  .photo, .photo.tall, .photo.full { min-height: 280px; }
  .section { padding: 64px 0; }
  .section.legal-detail { padding: 0; }
  .legal-detail:has(:target),
  #policy-body:target { padding: 12px 0 48px; }
  .split.reverse > :first-child { order: 0; }
  .theme-en .header-cta { display: none; }
  .theme-cn .header-cta { min-height: 36px; padding: 0 14px; font-size: 13px; }
  .lifestyle-band .wrap { margin-left: 24px; margin-right: 24px; }
  .gallery-grid { grid-template-columns: 1fr 1fr; }
  .feature-grid { grid-template-columns: 1fr; }
  .usage-row { grid-template-columns: 1fr 1fr; }
  .pdp-steps { grid-template-columns: 1fr 1fr; }
}

.pdp-slice {
  padding: 0;
  margin: 0;
  background: #f7f3ec;
}
.pdp-slice .pdp-long,
.pdp-long {
  width: 100%;
  height: auto;
  display: block;
  background: #f3efe6;
}
.pdp-video {
  width: 100%;
  margin-top: 24px;
  background: #111;
  aspect-ratio: 16/9;
}
.pdp-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 16px;
  margin-top: 28px;
}
.pdp-step img {
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  background: #ece7de;
}
.pdp-step h3 { font-size: 16px; margin: 8px 0 0; }

/* ==========================================================================
   Homepage design pack — 参考图1 (CN home)
   ========================================================================== */

/* Four brand pillars: icon at left, copy at right, no dividers */
.feature-band { padding: 36px 0 32px; }
.feature-row {
  display: grid;
  grid-template-columns: repeat(4, auto);
  justify-content: space-between;
  gap: 26px 40px;
}
.feature-row .icon-card {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: start;
  column-gap: 15px;
  row-gap: 0;
  border: 0;
  padding: 0;
  width: auto;
  text-align: left;
  justify-items: start;
}
.feature-row .icon-svg {
  grid-row: span 2;
  width: 30px;
  height: 30px;
  margin-top: 3px;
  color: rgba(22, 21, 19, 0.7);
}
.feature-row .icon-card h3 {
  font-family: var(--sans);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.3;
  margin: 0 0 5px;
}
.feature-row .icon-card p {
  font-size: 12.5px;
  line-height: 1.75;
  margin: 0;
}

/* Testimonials: one feature quote plus a 2x2 card grid */
.quotes-inner { width: min(1240px, calc(100% - 48px)); margin: 0 auto; }
.quotes-title {
  text-align: center;
  font-size: clamp(19px, 1.9vw, 26px);
  margin: 0 0 28px;
}
.quotes-title sub { font-size: 0.66em; }
.quotes-layout {
  display: grid;
  grid-template-columns: 0.9fr 1.4fr;
  gap: 30px 60px;
  align-items: center;
  padding-left: 5%;
}
.quote-feature {
  margin: 0;
  position: relative;
  padding-left: 44px;
}
.quote-feature::before {
  content: "\201C";
  position: absolute;
  left: 0;
  top: 2px;
  font-family: var(--serif);
  font-size: 56px;
  line-height: 1;
  color: rgba(22, 21, 19, 0.24);
}
.quote-feature-text {
  margin: 0;
  font-family: var(--serif);
  font-weight: 600;
  font-size: clamp(20px, 2.1vw, 29px);
  line-height: 1.5;
}
.quote-feature footer {
  margin: 12px 0 0 2px;
  font-size: 13px;
  color: var(--muted);
}
.quote-feature footer::after {
  content: "\201D";
  font-family: var(--serif);
  font-size: 42px;
  line-height: 0;
  color: rgba(22, 21, 19, 0.24);
  margin-left: 16px;
  vertical-align: -14px;
}
.quote-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 18px;
}
.quote-mini {
  position: relative;
  margin: 0;
  background: rgba(255, 255, 255, 0.44);
  padding: 15px 28px 17px 30px;
}
.quote-mini::before {
  content: "\201C";
  position: absolute;
  left: 9px;
  top: 7px;
  font-family: var(--serif);
  font-size: 25px;
  line-height: 1;
  color: rgba(22, 21, 19, 0.3);
}
.quote-mini::after {
  content: "\201D";
  position: absolute;
  right: 9px;
  bottom: 0;
  font-family: var(--serif);
  font-size: 25px;
  line-height: 1;
  color: rgba(22, 21, 19, 0.3);
}
.quote-mini p { margin: 0; font-size: 13px; line-height: 1.85; }
.quote-mini footer {
  margin: 5px 0 0;
  text-align: right;
  font-size: 12px;
  color: var(--muted);
}

/* Footer: darker headings, contact list with icons, solid social pills */
.theme-cn .footer-head {
  color: var(--ink);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: none;
  margin: 0 0 14px;
}
.footer-contact {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 11px;
}
.footer-contact li {
  display: grid;
  grid-template-columns: 17px 1fr;
  gap: 11px;
  align-items: center;
  font-size: 13.5px;
}
.footer-contact .icon-svg {
  width: 16px;
  height: 16px;
  color: var(--muted);
}
.theme-cn .social-row { gap: 10px; }
.theme-cn .social-row a,
.theme-cn .social-row span {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--ink);
  color: #fff;
  align-items: center;
  justify-content: center;
}
.theme-cn .social-row svg { width: 15px; height: 15px; }

@media (max-width: 1100px) {
  .pw-stage { grid-template-columns: 1fr 1.15fr; }
  .pw-col-c { grid-column: span 2; max-width: 60%; }
  .quotes-layout { grid-template-columns: 1fr; padding-left: 0; }
}

@media (max-width: 900px) {
  .collection-band { padding: 56px 0 0; }
  .pw-stage { grid-template-columns: 1fr; gap: 18px; }
  .pw-col-c { grid-column: auto; max-width: none; }
  .pw-col-b .pw-item + .pw-item { margin-top: 0; }
  .pw-item img {
    -webkit-mask-image: none;
    mask-image: none;
  }
  .pw-label {
    position: static;
    padding: 14px 0 4px;
  }
  .feature-row { grid-template-columns: 1fr 1fr; }
  .quote-cards { grid-template-columns: 1fr; }
  .qr-band h2 { white-space: normal; }
  .qr-band > :first-child { padding-left: 0; }
}

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

/* Hero: fit the still by height so the whole bottle reads, and let the
   photo's own wall tone extend to the left behind the headline. */
.theme-cn .hero.full-bleed {
  background-color: #ede5da;
  background-size: 100% 100%, auto 100%;
  background-position: left center, right center;
  background-repeat: no-repeat, no-repeat;
}
.theme-cn .hero.full-bleed .hero-copy { padding-bottom: 84px; }

@media (max-width: 900px) {
  .theme-cn .hero.full-bleed {
    background-size: 100% 100%, cover;
    background-position: left center, 72% center;
  }
}

/* Align hero copy to the 1180px content container, as in the design, and
   match the design's hero height. */
.theme-cn .hero.full-bleed {
  min-height: 767px;
  min-height: min(767px, 100svh);
}
.theme-cn .hero.full-bleed .hero-copy {
  padding-left: max(24px, calc(50vw - var(--max) / 2));
  padding-right: 24px;
  max-width: none;
}
.hero-copy .rule-short {
  display: block;
  width: 60px;
  height: 1px;
  margin: 26px 0 22px;
  background: rgba(31, 29, 26, 0.35);
}

@media (max-width: 900px) {
  .theme-cn .hero.full-bleed .hero-copy { padding-left: 6%; padding-right: 6%; }
}

/* CN hero type scale and vertical rhythm, measured off 参考图1 at 1440px. */
.theme-cn .hero.full-bleed .hero-copy { padding-bottom: 98px; }
.theme-cn .hero.full-bleed .kicker { margin-bottom: 16px; }
.theme-cn .hero.full-bleed h1 {
  font-size: clamp(38px, 4.65vw, 67px);
  line-height: 1.343;
  letter-spacing: -0.01em;
}
.theme-cn .hero.full-bleed .rule-short { margin: 26px 0 25px; }
.theme-cn .hero.full-bleed .lead {
  font-size: clamp(16px, 1.32vw, 19px);
  line-height: 2.16;
  margin: 0;
}
.theme-cn .hero.full-bleed .hero-actions { margin-top: 58px; }
.header-tools { gap: 26px; }
@media (max-width: 1100px) {
  .header-tools { gap: 10px; }
  .theme-cn .header-cta {
    white-space: nowrap;
    flex-shrink: 0;
    padding: 0 12px;
    font-size: 12px;
  }
  .lang-pair { gap: 6px; margin-right: 0; flex-shrink: 0; }
}
.theme-cn .hero.full-bleed .rule-short { background: rgba(31, 29, 26, 0.55); }
.theme-cn .hero.full-bleed .lead { font-size: clamp(16px, 1.43vw, 20.5px); }
.theme-cn .hero.full-bleed .hero-actions { gap: 56px; }
.theme-cn .hero.full-bleed .hero-actions .btn {
  min-height: 47px;
  padding: 0 38px;
  font-size: 15px;
  letter-spacing: 0.02em;
}
.theme-cn .hero.full-bleed .hero-actions .link-arrow {
  font-size: 15.5px;
  letter-spacing: 0.02em;
  font-weight: 500;
}

/* Final hero box model, solved so each ink band lands on the reference's
   absolute y position at 1440px wide. */
.theme-cn .hero.full-bleed .hero-copy { padding-bottom: 97px; }
.theme-cn .hero.full-bleed .kicker { margin-bottom: 17px; }
.theme-cn .hero.full-bleed .rule-short { margin: 24px 0 25px; }
.theme-cn .hero.full-bleed .lead { line-height: 2; }
.theme-cn .hero.full-bleed .hero-actions .btn { padding: 0 41.5px; }

/* full-story: solved to the reference's 310px band and inner ink positions. */
.theme-cn .full-story {
  min-height: 310px;
  padding: 0;
  align-items: start;
}
.theme-cn .full-story .wrap {
  margin: 30px 0 0;
  margin-left: max(24px, calc((100% - var(--max)) / 2));
  max-width: 560px;
}
.theme-cn .full-story h2 {
  font-size: clamp(24px, 2.64vw, 38px);
  line-height: 1.32;
}
.theme-cn .full-story .muted {
  margin: 12px 0 0;
  font-size: clamp(15px, 1.22vw, 17.5px);
  line-height: 1.714;
}
.theme-cn .full-story .tag {
  margin: 16px 0 0;
  font-size: clamp(13px, 1.06vw, 15.3px);
  line-height: 1.57;
}
.theme-cn .full-story h2 { font-size: clamp(24px, 2.57vw, 37px); line-height: 1.35; }
.theme-cn .full-story .tag { font-size: clamp(12px, 0.93vw, 13.4px); line-height: 1.79; }

/* Collection: head sits in the 1180 container (the collage stays full-bleed),
   and the band starts 30px higher to match the reference. */
.theme-cn .collection-band { padding-top: 26px; }
.theme-cn .collection-band .collection-head {
  width: min(var(--max), calc(100% - 48px));
  margin-left: auto;
  margin-right: auto;
}
.theme-cn .collection-band .kicker { font-size: 11.6px; }
.theme-cn .collection-band h2 { font-size: clamp(26px, 2.73vw, 39.3px); }
.theme-cn .collection-band .lead { margin-top: 6px; font-size: 14.7px; }
.theme-cn .collection-band .collection-head { align-items: start; }
.theme-cn .collection-band .collection-head > p {
  margin: 29px 0 0;
  flex: none;
}
.theme-cn .collection-band .collection-head .link-arrow { font-size: 16.5px; }

/* Collection: three editorial columns. 01 | 02-over-03 | 04.
   Products stay in their columns so photos and labels never pile up. */
@media (min-width: 901px) {
  .theme-cn .collection-band {
    position: relative;
    overflow: hidden;
    padding-bottom: 8px;
  }
  .theme-cn .collection-band .wrap-wide {
    width: min(1340px, calc(100% - 40px));
  }
  .theme-cn .collection-band .collection-head { position: relative; z-index: 3; }
  .theme-cn .pw-stage {
    position: relative;
    display: grid;
    grid-template-columns: 1.12fr 1fr 1.08fr;
    align-items: end;
    gap: 0 18px;
    z-index: 1;
    padding: 4px 0 28px;
    min-height: 0;
  }
  .theme-cn .pw-col {
    display: grid;
    align-content: end;
    position: relative;
    z-index: 1;
  }
  .theme-cn .pw-item {
    position: relative;
    margin: 0;
    height: auto;
    display: block;
  }
  .theme-cn .pw-item img {
    width: 78%;
    margin-left: 22%;
    height: auto;
    display: block;
    -webkit-mask-image: none;
    mask-image: none;
  }

  /* 01 sits a little lower; 02 stays high; 03 tucks under 02's stone;
     04 lifts off the baseline like the reference. */
  .theme-cn .pw-col-a { padding-top: 36px; }
  .theme-cn .pw-col-b .pw-item:first-child { z-index: 2; }
  .theme-cn .pw-col-b .pw-item + .pw-item {
    margin-top: -3%;
    z-index: 1;
  }
  .theme-cn .pw-col-b .pw-item:first-child img { width: 90%; margin-left: 10%; }
  .theme-cn .pw-col-b .pw-item:last-child img { width: 78%; margin-left: 22%; }
  .theme-cn .pw-col-c {
    align-content: center;
    padding-bottom: 6%;
  }
  .theme-cn .pw-col-c .pw-item img { width: 80%; margin-left: 18%; }

  .theme-cn .pw-label {
    position: absolute;
    left: 0;
    width: 26%;
    z-index: 4;
    gap: 10px;
    line-height: 1.15;
    pointer-events: none;
  }
  .theme-cn .pw-label .pw-link { pointer-events: auto; }
  .theme-cn .pw-num {
    font-size: clamp(22px, 2vw, 30px);
    color: rgba(22, 21, 19, 0.34);
    letter-spacing: 0.04em;
  }
  .theme-cn .pw-name {
    font-size: clamp(16px, 1.35vw, 20px);
    font-weight: 600;
  }
  .theme-cn .pw-vol { font-size: 13.5px; }
  .theme-cn .pw-soon { font-size: 12.5px; line-height: 1.65; }
  .theme-cn .pw-soon em { font-size: 11px; letter-spacing: 0.16em; }
  .theme-cn .pw-link { margin-top: 12px; font-size: 13.2px; }

  .theme-cn .pw-label-a { top: 38%; width: 24%; }
  .theme-cn .pw-label-b { top: 10%; width: 30%; }
  .theme-cn .pw-label-c { top: 28%; width: 26%; }
  .theme-cn .pw-label-d { top: 8%; width: 24%; }

  .theme-cn .pw-mark {
    z-index: 0;
    font-weight: 500;
    color: rgba(22, 21, 19, 0.12);
  }
  .theme-cn .pw-mark-500 {
    left: 1.5%;
    top: 16%;
    right: auto;
    font-size: clamp(56px, 6.4vw, 96px);
  }
  .theme-cn .pw-mark-189 {
    left: 44%;
    top: 60%;
    right: auto;
    font-size: clamp(48px, 5.4vw, 82px);
  }
  .theme-cn .pw-mark-10 {
    right: 2%;
    top: 10%;
    left: auto;
    font-size: clamp(52px, 6vw, 90px);
  }
}

/* Keep the 3-column rhythm on mid desktops; the shared 2-col rule
   at 1100px is what used to squash 04 under the others. */
@media (min-width: 901px) and (max-width: 1100px) {
  .theme-cn .pw-stage { grid-template-columns: 1.12fr 1fr 1.08fr; }
  .theme-cn .pw-col-c { grid-column: auto; max-width: none; }
}

/* Four brand pillars, measured off the reference: 1020px centred row,
   40px icons, 36px icon-to-copy gap. */
.theme-cn .feature-band { padding: 14px 0 35px; }
.theme-cn .feature-row {
  width: min(1020px, calc(100% - 48px));
  margin: 0 auto;
}
.theme-cn .feature-row .icon-svg { width: 40px; height: 40px; margin-top: 0; }
.theme-cn .feature-row .icon-card { column-gap: 36px; }
.theme-cn .feature-row .icon-card h3 { font-size: 16.6px; margin: 0 0 6px; }
.theme-cn .feature-row .icon-card p { font-size: 14.4px; line-height: 1.75; }

/* Lifestyle band: 279px tall with the reference's inner rhythm. */
.theme-cn .lifestyle-band {
  min-height: 279px;
  padding: 22px 0 0;
  align-items: start;
}
.theme-cn .lifestyle-band h2 {
  font-size: clamp(24px, 2.8vw, 40.3px);
  line-height: 1.19;
}
.theme-cn .lifestyle-band > .wrap > p {
  margin: 21px 0 0;
  font-size: clamp(14px, 1.06vw, 15.3px);
  line-height: 1.9;
}
.theme-cn .lifestyle-band > .wrap > p:last-child { margin-top: 26px; }
.theme-cn .lifestyle-band .link-arrow { font-size: 15.7px; }

/* Quotes band: 319px tall, feature quote and 2x2 cards placed to the
   reference's x/y positions. */
.theme-cn .quotes-band {
  min-height: 319px;
  padding: 22px 0 0;
  align-items: start;
}
.theme-cn .quotes-title {
  font-size: clamp(19px, 1.58vw, 22.7px);
  margin: 0 0 32px;
}
.theme-cn .quotes-layout {
  padding-left: calc(5% + 43px);
  align-items: start;
  gap: 30px 60px;
}
.theme-cn .quote-feature { padding-left: 116px; }
.theme-cn .quote-feature::before { left: 53px; font-size: 64px; }
.theme-cn .quote-feature-text {
  font-size: clamp(20px, 2.38vw, 34.3px);
  line-height: 1.6;
}
.theme-cn .quote-feature footer { margin-top: 18px; font-size: 13.5px; }
.theme-cn .quote-cards { gap: 13px 18px; }
.theme-cn .quote-mini { padding: 14px 28px 12px 30px; }
.theme-cn .quote-mini p { font-size: 16.4px; line-height: 1.71; }
.theme-cn .quote-mini footer { margin-top: 8px; font-size: 13px; }
.theme-cn .quotes-title { font-size: clamp(19px, 1.69vw, 24.3px); margin-bottom: 17px; }
.theme-cn .quote-feature { margin-top: 21px; }
.theme-cn .quote-feature-text {
  font-size: clamp(20px, 2.7vw, 38.9px);
  line-height: 1.414;
}
.theme-cn .quote-cards { column-gap: 34px; }

/* Purchase band: 978px centred row, button beside the mini-program copy. */
.theme-cn .qr-band {
  width: min(978px, calc(100% - 48px));
  padding: 20px 0;
  grid-template-columns: 1fr auto 1.22fr;
}
.theme-cn .qr-band h2 { font-size: clamp(22px, 1.9vw, 27.3px); }
.theme-cn .qr-band > :first-child .muted {
  margin: 12px 0 0;
  font-size: clamp(14px, 1.19vw, 17.1px);
}
.theme-cn .qr-band img,
.theme-cn .qr-circle { width: 116px; height: 116px; }
.theme-cn .qr-side {
  display: flex;
  align-items: center;
  gap: 105px;
}
.theme-cn .qr-side p { margin: 0; }
.theme-cn .qr-side-copy p:first-child { font-size: 17.5px; font-weight: 500; }
.theme-cn .qr-side-copy .muted { margin-top: 10px; font-size: 17px; }
.theme-cn .qr-side-cta { margin: 0; flex: none; }
.theme-cn .qr-side-cta .btn {
  min-height: 38px;
  padding: 0 24px;
  font-size: 13.5px;
}

/* Footer: 1180 container with the reference's column widths and rhythm. */
.theme-cn .site-footer { padding: 28px 0 22px; }
.theme-cn .site-footer .footer-grid {
  width: min(var(--max), calc(100% - 48px));
  grid-template-columns: 313fr 230fr 191fr 203fr 244fr;
  gap: 24px;
}
.theme-cn .site-footer .footer-links { gap: 4.4px; font-size: 12px; }
.theme-cn .site-footer .footer-head { font-size: 11px; margin: 0 0 10px; }
.theme-cn .site-footer .tiny { margin-top: 30px; font-size: 11.5px; }
.theme-cn .site-footer .brand-word { font-size: 20px; }
.theme-cn .site-footer .tiny {
  width: min(var(--max), calc(100% - 48px));
  margin: 16px auto 0;
}

/* ——— Mobile: undo the desktop-only collage/grid geometry above ——— */
@media (max-width: 900px) {
  /* Hero: keep the bottle clear of the headline and darken the copy side. */
  .theme-cn .hero.full-bleed {
    min-height: 88svh;
    background-image: linear-gradient(rgba(237, 229, 218, 0.1), rgba(237, 229, 218, 0.86) 62%, #ede5da),
      var(--hero-photo, none);
    background-size: 100% 100%, 168% auto;
    background-position: left center, 62% top;
  }
  .theme-cn .hero.full-bleed .hero-copy {
    padding-bottom: 44px;
    padding-left: 6%;
    padding-right: 6%;
  }
  .theme-cn .hero.full-bleed h1 { font-size: clamp(32px, 9.6vw, 46px); }
  .theme-cn .hero.full-bleed .lead { font-size: 16px; line-height: 1.9; }
  .theme-cn .hero.full-bleed .hero-actions { margin-top: 26px; gap: 20px; }

  .theme-cn .full-story { min-height: 0; padding: 34px 0 30px; }
  .theme-cn .full-story .wrap { margin: 0 24px; max-width: none; }

  /* Collection head stacks; products stack one-by-one with live labels. */
  .theme-cn .collection-band {
    padding-top: 34px;
    overflow: visible;
  }
  .theme-cn .collection-band .wrap-wide {
    width: min(var(--wide), calc(100% - 48px));
    height: auto;
  }
  .theme-cn .pw-stage {
    position: static;
    display: grid;
    height: auto;
    padding: 0 0 20px;
    gap: 28px;
  }
  .theme-cn .pw-col { display: grid; padding: 0; gap: 22px; }
  .theme-cn .pw-col-b .pw-item + .pw-item { margin-top: 0; }
  .theme-cn .pw-col-c { align-content: start; }
  .theme-cn .pw-item {
    position: relative;
    left: auto;
    top: auto;
    width: auto;
    height: auto;
  }
  .theme-cn .pw-item img,
  .theme-cn .pw-col-b .pw-item:first-child img,
  .theme-cn .pw-col-b .pw-item:last-child img,
  .theme-cn .pw-col-c .pw-item img {
    width: 100%;
    margin-left: 0;
  }
  .theme-cn .pw-label {
    position: static;
    left: auto;
    top: auto;
    width: auto;
    padding: 14px 0 4px;
    pointer-events: auto;
  }
  .theme-cn .pw-mark { display: none; }
  .theme-cn .collection-band .collection-head {
    display: block;
    width: auto;
    margin: 0 24px 8px;
  }
  .theme-cn .collection-band .collection-head > p { margin: 14px 0 0; }
  .theme-cn .collection-band .kicker { font-size: 11px; }

  /* Four pillars stack two-up. */
  .theme-cn .feature-band { padding: 24px 0 26px; }
  .theme-cn .feature-row { width: auto; margin: 0 24px; }
  .theme-cn .feature-row .icon-card { column-gap: 16px; }
  .theme-cn .feature-row .icon-svg { width: 30px; height: 30px; }

  /* Lifestyle: photo on top, copy on a solid panel so it stays readable. */
  .theme-cn .lifestyle-band {
    min-height: 0;
    padding: 0;
    background-position: center top;
    background-size: 148% auto;
    background-repeat: no-repeat;
  }
  .theme-cn .lifestyle-band .wrap {
    margin: 0;
    max-width: none;
    padding: 54svh 24px 34px;
    background: linear-gradient(rgba(247, 243, 236, 0), rgba(247, 243, 236, 0.92) 46%, #f7f3ec);
  }
  .theme-cn .lifestyle-band h2 { font-size: clamp(24px, 7.4vw, 34px); }

  /* Quotes: single column, no desktop indents. */
  .theme-cn .quotes-band { min-height: 0; padding: 30px 0 34px; }
  .theme-cn .quotes-layout {
    grid-template-columns: 1fr;
    padding-left: 0;
    gap: 24px;
  }
  .theme-cn .quotes-inner { width: calc(100% - 48px); }
  .theme-cn .quote-feature { margin-top: 0; padding-left: 40px; }
  .theme-cn .quote-feature::before { left: 0; font-size: 48px; }
  .theme-cn .quote-feature-text { font-size: clamp(22px, 6.6vw, 30px); }
  .theme-cn .quote-cards { grid-template-columns: 1fr; gap: 12px; }
  .theme-cn .quote-mini p { font-size: 15px; }

  /* Purchase band stacks: copy, code, then the button. */
  .theme-cn .qr-band {
    width: auto;
    margin: 0 24px;
    grid-template-columns: 1fr;
    padding: 30px 0;
    gap: 22px;
    text-align: center;
    justify-items: center;
  }
  .theme-cn .qr-band > * { padding: 0; }
  .theme-cn .qr-band h2 { white-space: normal; font-size: clamp(22px, 6.4vw, 27px); }
  .theme-cn .qr-center { border: 0; }
  .theme-cn .qr-side {
    display: grid;
    justify-items: center;
    gap: 18px;
  }
  .theme-cn .qr-side-copy { text-align: center; }

  /* Footer stacks; contact and links keep full-width rows. */
  .theme-cn .site-footer { padding: 34px 0 24px; }
  .theme-cn .site-footer .footer-grid {
    width: auto;
    margin: 0 24px;
    grid-template-columns: 1fr 1fr;
    gap: 26px 20px;
  }
  .theme-cn .site-footer .footer-grid > :first-child { grid-column: 1 / -1; }
  .theme-cn .site-footer .footer-links { font-size: 13.5px; gap: 7px; }
  .theme-cn .site-footer .footer-head { font-size: 11.5px; }
  .theme-cn .site-footer .tiny { width: auto; margin: 26px 24px 0; }
}

@media (max-width: 560px) {
  .theme-cn .feature-row { grid-template-columns: 1fr; gap: 18px; }
  .theme-cn .site-footer .footer-grid { grid-template-columns: 1fr; }
}

/* Hero photo comes in via --hero-photo so the scrim can differ per breakpoint. */
.theme-cn .hero.full-bleed {
  background-image: linear-gradient(90deg, rgba(237, 229, 218, 0.55), rgba(237, 229, 218, 0.05) 46%, rgba(237, 229, 218, 0)),
    var(--hero-photo, none);
  background-color: #ede5da;
  background-size: 100% 100%, auto 100%;
  background-position: left center, right center;
  background-repeat: no-repeat, no-repeat;
}

@media (max-width: 900px) {
  .theme-cn .hero.full-bleed {
    background-image: linear-gradient(rgba(237, 229, 218, 0.06), rgba(237, 229, 218, 0.84) 58%, #ede5da),
      var(--hero-photo, none);
    background-size: 100% 100%, 168% auto;
    background-position: left center, 62% top;
  }
}

@media (max-width: 900px) {
  /* Photo fills the top of the hero; the scrim only solidifies behind the copy. */
  .theme-cn .hero.full-bleed {
    min-height: 92svh;
    background-image: linear-gradient(rgba(237, 229, 218, 0) 0%, rgba(237, 229, 218, 0) 38%, rgba(237, 229, 218, 0.92) 56%, #ede5da 66%),
      var(--hero-photo, none);
    background-size: 100% 100%, cover;
    background-position: left top, 70% top;
  }
  .theme-cn .hero.full-bleed .hero-copy { padding-bottom: 52px; }
}

/* Hero scrim lives on a pseudo-element so the photo URL can stay inline
   (a relative url() inside a custom property resolves against the CSS file). */
.theme-cn .hero.full-bleed {
  background-color: #ede5da;
  background-size: auto 100%;
  background-position: right center;
  background-repeat: no-repeat;
  min-height: min(767px, 100svh);
}
.theme-cn .hero.full-bleed::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(237, 229, 218, 0.55), rgba(237, 229, 218, 0.05) 46%, rgba(237, 229, 218, 0));
  pointer-events: none;
}

@media (max-width: 900px) {
  .theme-cn .hero.full-bleed {
    min-height: 92svh;
    background-size: cover;
    background-position: 70% top;
  }
  .theme-cn .hero.full-bleed::before {
    background: linear-gradient(rgba(237, 229, 218, 0) 0%, rgba(237, 229, 218, 0) 36%, rgba(237, 229, 218, 0.9) 56%, #ede5da 68%);
  }
}

@media (max-width: 900px) {
  /* Mobile hero reads as photo on top, copy on the flat tone below. */
  .theme-cn .hero.full-bleed {
    background-size: auto 48%;
    background-position: 62% top;
  }
  .theme-cn .hero.full-bleed::before {
    background: linear-gradient(rgba(237, 229, 218, 0) 0%, rgba(237, 229, 218, 0) 33%, #ede5da 47%);
  }
}

/* English homepage: landscape hero, visible desktop nav, cream quality band. */
@media (min-width: 1101px) {
  .theme-en .menu-btn,
  .theme-cn .menu-btn { display: none; }
}
.theme-en .hero.full-bleed {
  min-height: min(920px, 100svh);
  align-items: center;
  grid-template-columns: 1fr;
  background-size: cover;
  background-position: 78% center;
  background-repeat: no-repeat;
}
.theme-en .hero-copy {
  padding: 168px 0 110px max(40px, calc((100% - var(--max)) / 2));
  max-width: 620px;
}
.theme-en .hero.full-bleed h1 {
  font-size: clamp(40px, 5.1vw, 64px);
  line-height: 1.06;
  letter-spacing: 0.01em;
  color: #0c1424;
}
.theme-en .hero.full-bleed .lead {
  margin-top: 18px;
  font-size: 16px;
  color: #2a3340;
  max-width: 28em;
}
.theme-en .scroll-cue {
  left: max(40px, calc((100% - var(--max)) / 2));
  bottom: 36px;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}
.theme-en .scroll-cue::before { order: 2; height: 36px; }
.theme-en .quality-mark {
  padding: 84px 0 72px;
  background: #f4f1eb;
  min-height: 420px;
  overflow: hidden;
  display: block;
}
.theme-en .quality-mark .wrap.cols-3 {
  width: min(1000px, calc(100% - 168px));
  margin-left: max(48px, calc((100% - var(--max)) / 2));
  margin-right: auto;
  gap: 0;
  position: relative;
  z-index: 1;
}
.theme-en .quality-mark .cols-3 article {
  position: relative;
  padding: 0 40px 0 0;
  border-right: 0;
}
.theme-en .quality-mark .cols-3 article + article {
  padding-left: 8px;
}
.theme-en .quality-mark .cols-3 article + article::before {
  display: none;
}
.theme-en .quality-mark .cols-3 article:last-child { padding-right: 0; }
.theme-en .quality-mark .hero-watermark {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  font-size: clamp(78px, 8vw, 118px);
  line-height: 0.78;
  letter-spacing: 0;
  right: 6.5%;
  top: 36px;
  bottom: 28px;
  height: auto;
  transform: none;
  color: rgba(38, 34, 30, 0.12);
  font-weight: 500;
  z-index: 0;
  overflow: visible;
}
.theme-en .quality-mark .hero-watermark span:nth-child(2) {
  font-size: 0.58em;
  align-self: flex-end;
  margin: -0.08em 0.18em -0.02em 0;
  line-height: 0.78;
}
.theme-en .quality-mark .hero-side-label {
  top: 50%;
  right: 18px;
  transform: translateY(-50%) rotate(-90deg);
  font-size: 9px;
  letter-spacing: 0.32em;
  color: rgba(22, 21, 19, 0.38);
  font-weight: 500;
}
.theme-en .section.dark.en-connect {
  min-height: 972px;
  padding: 176px 0 176px;
  display: block;
}
.theme-en .en-connect-copy { margin-left: 50%; max-width: 34em; }
.theme-en .en-connect-copy h2 {
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 500;
  font-size: clamp(38px, 4vw, 56px);
  line-height: 1.1;
}
.theme-en .en-connect-copy .rule {
  width: 34px;
  height: 1px;
  background: #fff;
  opacity: 0.88;
  margin: 36px 0 40px;
}
.theme-en .en-connect-copy .lead {
  color: rgba(255, 255, 255, 0.92);
  margin-top: 0;
  font-size: 15px;
  line-height: 2.15;
  max-width: 36em;
}
.theme-en .quality-mark h3.caps {
  font-size: clamp(20px, 1.7vw, 24px);
  letter-spacing: 0.16em;
  font-weight: 500;
  color: #1a1916;
  line-height: 1;
  margin: 0 0 16px;
}
.theme-en .quality-mark .num {
  font-family: var(--sans);
  font-size: 11px;
  letter-spacing: 0.2em;
  color: rgba(22, 21, 19, 0.42);
  margin-bottom: 0;
  font-weight: 500;
}
.theme-en .quality-mark .rule {
  display: block;
  width: 16px;
  height: 1px;
  background: #1a1a1a;
  opacity: 0.4;
  margin: 8px 0 22px;
}
.theme-en .quality-mark p.muted {
  font-size: 13px;
  line-height: 1.7;
  color: #6a655e;
  max-width: 18em;
  margin: 0;
}
.theme-en .en-connect-icons { margin-top: 110px; padding-top: 0; gap: 0; }
.theme-en .en-connect-icons .icon-card {
  text-align: center;
  justify-items: center;
  position: relative;
  padding: 8px 22px 10px;
  border-right: 0;
  gap: 0;
}
.theme-en .en-connect-icons .icon-card + .icon-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10%;
  bottom: 6%;
  width: 1px;
  background: rgba(255, 255, 255, 0.22);
}
.theme-en .en-connect-icons .icon-card .icon-svg {
  width: 48px;
  height: 48px;
  padding: 0;
  border: 0;
  border-radius: 0;
  margin: 0 auto 46px;
  color: #fff;
}
.theme-en .en-connect-icons .icon-card h3 {
  font-family: var(--sans);
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  color: #fff;
  margin: 0 0 26px;
}
.theme-en .en-connect-icons .icon-card p {
  font-size: 13px;
  line-height: 1.7;
  max-width: 16em;
  margin: 0 auto;
  color: rgba(255, 255, 255, 0.84);
}

@media (max-width: 900px) {
  .theme-en .hero.full-bleed { min-height: 88svh; background-position: 78% center; }
  .theme-en .hero-copy {
    padding: 120px 24px 64px;
    max-width: none;
    background: linear-gradient(transparent, rgba(243, 239, 230, 0.88) 36%, #f3efe6);
  }
  .theme-en .quality-mark {
    min-height: 0;
    padding: 64px 0 56px;
    display: block;
  }
  .theme-en .quality-mark .wrap.cols-3 {
    width: calc(100% - 48px);
    margin-left: 24px;
    margin-right: 24px;
    gap: 36px;
  }
  .theme-en .quality-mark .cols-3 article {
    padding: 0 0 8px;
    border-right: 0;
  }
  .theme-en .quality-mark .cols-3 article + article {
    padding-left: 0;
  }
  .theme-en .quality-mark .cols-3 article + article::before { display: none; }
  .theme-en .quality-mark .hero-watermark {
    font-size: 88px;
    right: 6%;
    top: auto;
    bottom: 4%;
    flex-direction: row;
    letter-spacing: -0.04em;
  }
  .theme-en .quality-mark .hero-watermark span:nth-child(2) { font-size: 0.7em; }
  .theme-en .section.dark.en-connect { min-height: 0; padding: 72px 0 56px; }
  .theme-en .en-connect-copy { margin-left: 0; max-width: none; }
  .theme-en .en-connect-icons { margin-top: 48px; }
  .theme-en .en-connect-icons .icon-card { border-right: 0; padding: 16px 0; }
  .theme-en .en-connect-icons .icon-card + .icon-card::before { display: none; }
  .theme-en .en-markets { padding: 56px 0 0; }
  .theme-en .en-two-head { gap: 28px; margin-bottom: 36px; }
  .theme-en .en-two-head .en-two-copy { padding-top: 0; }
  .theme-en .market-grid { grid-template-columns: 1fr 1fr; }
  .theme-en .en-trio { grid-template-columns: 1fr; min-height: 0; }
  .theme-en .en-trio-cta { min-height: 460px; padding: 56px 24px; background-size: cover; background-position: 88% 50%; }
  .theme-en .en-duo { grid-template-columns: 1fr; }
  .theme-en .en-duo-quality { padding-top: 40px; }
  .theme-en .en-duo-photo { height: 220px; min-height: 220px; }
  .theme-en .en-duo-river { min-height: 320px; }
  .theme-en .en-news-row { grid-template-columns: 1fr; }
}

.theme-en .lang-pill {
  font-size: 12px;
  letter-spacing: 0.16em;
  color: var(--muted);
}
.theme-en .en-only {
  min-height: 520px;
  display: grid;
  align-items: center;
  background-size: cover;
  background-position: center right;
  color: #fff;
  padding: 72px 0;
}
.theme-en .en-only h2,
.theme-en .en-only .num,
.theme-en .en-only .lead,
.theme-en .en-only .soon,
.theme-en .en-only .link-arrow { color: #fff; }
.theme-en .en-only .lead { max-width: 22em; }
.theme-en .en-only .soon {
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-size: 12px;
  opacity: 0.7;
}
.theme-en .market-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-items: stretch;
  margin-top: 0;
  gap: 0;
}
.theme-en .market-tile {
  position: relative;
  display: block;
  min-height: 0;
  aspect-ratio: 4 / 5;
  padding: 0;
  color: #fff;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 13px;
}
.theme-en .market-tile + .market-tile {
  box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.22);
}
.theme-en .market-tile .icon-svg {
  width: 26px;
  height: 26px;
  color: #fff;
}
.theme-en .en-trio {
  display: grid;
  grid-template-columns: 0.40fr 0.60fr;
  min-height: 700px;
}
.theme-en .en-trio-navy {
  background: var(--navy);
  color: rgba(255, 255, 255, 0.82);
  padding: 72px 48px 64px max(40px, calc((100vw - var(--wide)) / 2));
  display: grid;
  align-content: center;
  gap: 36px;
}
.theme-en .en-trio-navy h2,
.theme-en .en-trio-navy h3 { color: #fff; }
.theme-en .en-trio-navy .cols-3 { gap: 18px; }
.theme-en .en-trio-navy p { margin: 8px 0 0; font-size: 14px; }
.theme-en .en-trio-navy .link-arrow {
  color: #fff;
  box-shadow: inset 0 -1px 0 currentColor;
}
.theme-en .en-trio-cta {
  background-color: #f4f1eb;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 86% 46%;
  padding: 64px 46% 56px 56px;
  display: grid;
  align-content: center;
  justify-items: start;
  gap: 20px;
  min-height: 700px;
}
.theme-en .en-trio .photo { min-height: 100%; }
.theme-en .en-news { padding: 72px 0 80px; background: #f3efe8; }
.theme-en .en-news-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: center;
}
.theme-en .en-news-form {
  display: flex;
  gap: 10px;
}
.theme-en .en-news-form input {
  flex: 1;
  min-height: 44px;
  border: 0;
  background: #ece6db;
  padding: 0 16px;
}
.theme-en .social-row {
  display: flex;
  gap: 10px;
  margin-top: 18px;
}
.theme-en .social-row span,
.theme-en .social-row a {
  width: 28px;
  height: 28px;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
}
.theme-en .social-row svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.4; }
.theme-en .footer-grid { grid-template-columns: 1.5fr repeat(5, 1fr); }
.theme-en .site-footer .tiny {
  margin-top: 40px;
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}
@media (max-width: 900px) {
  .theme-en { overflow-x: clip; }
  .theme-en .footer-grid { grid-template-columns: 1fr 1fr; gap: 28px 20px; }
  .theme-en .en-trio-cta { padding: 56px 24px; min-height: 420px; }
  .theme-en .en-duo-half { padding: 40px 24px; }
}

/* ============================================================
   v81 — design-pack alignment (EN inner pages, CN products/about)
   ============================================================ */

/* --- EN typography: inner pages use uppercase serif headings --- */
.theme-en.en-caps h1:not(.no-caps),
.theme-en.en-caps h2:not(.no-caps) {
  text-transform: uppercase;
  letter-spacing: 0.04em;
  line-height: 1.12;
}
/* low specificity on purpose: per-section "… h2" rules below must be able to override */
.en-caps h2 { font-size: clamp(26px, 3vw, 40px); }
.en-caps .page-hero h1 { font-size: clamp(38px, 4.6vw, 62px); line-height: 1.05; }
.theme-en .caps { text-transform: uppercase; letter-spacing: 0.04em; }
.theme-en .kicker { font-size: 11px; letter-spacing: 0.2em; }
.theme-en .link-arrow { font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; }
.theme-en .tag { font-size: 11px; }
.tag.strong, .strong { color: var(--ink); font-weight: 700; }
.center-head { text-align: center; }
h2.center { text-align: center; }
.rule.center { margin-left: auto; margin-right: auto; }
.stack-actions { display: grid; gap: 12px; justify-items: start; }
.stack-actions .btn { justify-content: space-between; min-width: 240px; }
.btn.btn-wide { width: 100%; min-height: 56px; font-size: 14px; letter-spacing: 0.14em; }
.theme-en .btn.btn-wide { background: #111; border-color: #111; }
.hero-dark .kicker, .hero-dark h1, .hero-dark .lead { color: #fff; }
.hero-dark .lead { color: rgba(255, 255, 255, 0.82); }
.hero-dark .rule { background: #fff; }
.theme-en .lang-pill { display: inline-flex; gap: 4px; align-items: center; }
.footer-tag { font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; }

/* --- Split hero: copy on the cream panel, one photo to the right --- */
.page-hero.with-photo.split-photo {
  grid-template-columns: 0.42fr 0.58fr;
  align-items: stretch;
  min-height: 100dvh;
  padding: 0;
  background: var(--bg);
  position: relative;
}
.page-hero.split-photo .hero-copy {
  align-self: center;
  max-width: none;
  background: var(--bg);
  padding: 72px 8% 72px max(40px, calc((100vw - var(--wide)) / 2));
}
.page-hero.split-photo .hero-copy .lead { margin-top: 0; }
.page-hero.split-photo .hero-photo {
  position: relative;
  min-height: 100%;
  background-color: #ddd;
  background-position: 64% center;
  background-size: cover;
  background-repeat: no-repeat;
}
.page-hero.split-photo .hero-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, var(--bg) 0%, color-mix(in srgb, var(--bg) 58%, transparent) 14%, transparent 34%);
  pointer-events: none;
}
.page-hero.split-photo.photo-left {
  grid-template-columns: 0.58fr 0.42fr;
}
.page-hero.split-photo.photo-left .hero-copy {
  padding: 72px max(40px, calc((100vw - var(--wide)) / 2)) 72px 8%;
}
.page-hero.split-photo.photo-left .hero-photo::after {
  background: linear-gradient(270deg, var(--bg) 0%, color-mix(in srgb, var(--bg) 58%, transparent) 14%, transparent 34%);
}
.page-hero.split-photo.hero-rock .hero-photo {
  background-position: right center;
}
.theme-en .page-hero.split-photo .hero-photo {
  background-position: 68% center;
}
.theme-en .edge-card[id] { scroll-margin-top: 96px; }
.page-hero.split-photo .hero-side-label { right: 18px; top: 58%; }
.theme-en .page-hero .rule { margin: 22px 0 22px; }

/* --- EN homepage --- */
.en-connect-icons { margin-top: 48px; gap: 0; }
.section.dark .icon-even .icon-card { border-color: rgba(255, 255, 255, 0.18); }
.en-collage {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: minmax(400px, auto);
  background: var(--bg);
}
.en-collage-intro {
  padding: 72px 12% 64px max(40px, calc((100vw - var(--wide)) / 2));
  align-self: center;
}
.en-collage-intro h2 { font-size: clamp(30px, 3.4vw, 46px); }
.en-collage-intro .muted { max-width: 30em; line-height: 1.8; }
.en-collage-tile {
  position: relative;
  display: grid;
  align-items: center;
  background: #ccc center / cover no-repeat;
  color: #fff;
  min-height: 400px;
}
.en-collage-tile::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(8, 12, 20, 0.55), rgba(8, 12, 20, 0.05) 55%);
}
.tile-bib::before, .tile-glass::before { background: linear-gradient(270deg, rgba(8, 12, 20, 0.6), rgba(8, 12, 20, 0.05) 55%); }
.tile-only { grid-column: 1 / -1; min-height: 440px; }
.en-collage-copy {
  position: relative;
  padding: 40px 44px;
  max-width: 320px;
}
.en-collage-copy.right, .tile-bib .en-collage-copy { margin-left: auto; }
.en-collage-copy .num { color: rgba(255, 255, 255, 0.8); font-size: 22px; }
.en-collage-copy h3 {
  color: #fff;
  font-family: var(--sans);
  font-size: 16px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 700;
  line-height: 1.4;
}
.en-collage-copy h3 small { display: block; font-size: 11px; font-weight: 500; letter-spacing: 0.16em; }
.en-collage-copy p { margin: 16px 0 0; font-size: 13.5px; line-height: 1.75; color: rgba(255, 255, 255, 0.86); }
.en-collage-copy .soon { color: rgba(255, 255, 255, 0.8); }
.theme-en .en-collage {
  grid-template-rows: minmax(540px, 48vw) minmax(540px, 46vw) minmax(420px, 34vw);
  grid-auto-rows: unset;
  background: #f3efe6;
}
.theme-en .tile-bib {
  background-position: 42% 62%;
}
.theme-en .tile-march {
  background-position: 72% 42%;
}
.theme-en .tile-glass {
  background-position: 48% 40%;
}
.theme-en .tile-only {
  background-color: #000;
  background-size: cover;
  background-position: 72% center;
}
.theme-en .en-collage-intro {
  padding: 80px 11% 72px max(48px, calc((100vw - var(--wide)) / 2));
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-self: stretch;
}
.theme-en .en-collage-intro h2 {
  font-size: clamp(36px, 4vw, 52px);
  line-height: 1.12;
  color: #161513;
}
.theme-en .en-collage-intro .rule {
  width: 36px;
  margin: 22px 0 26px;
  opacity: 0.55;
}
.theme-en .en-collage-intro .muted {
  font-size: 15px;
  line-height: 1.85;
  max-width: 28em;
  color: #4a453e;
}
.theme-en .en-collage-tile {
  min-height: 0;
  align-items: start;
}
.theme-en .en-collage-tile::before { background: none; }
.theme-en .tile-bib::before { background: none; }
.theme-en .tile-glass::before {
  background: linear-gradient(270deg, rgba(8, 12, 20, 0.42), rgba(8, 12, 20, 0.04) 58%);
}
.theme-en .tile-only {
  min-height: 0;
}
.theme-en .tile-only::before {
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.42), transparent 48%);
}
.theme-en .en-collage-copy {
  padding: 48px 44px 0;
  max-width: 268px;
}
.theme-en .en-collage-copy .num {
  font-size: 54px;
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1;
  margin-bottom: 10px;
  color: rgba(22, 21, 19, 0.22);
}
.theme-en .en-collage-copy h3 {
  color: #1a1a1a;
  font-size: 14px;
  letter-spacing: 0.14em;
}
.theme-en .en-collage-copy h3 small {
  margin-top: 4px;
  color: #1a1a1a;
  font-weight: 600;
}
.theme-en .en-collage-copy .rule {
  width: 28px;
  height: 1px;
  background: #1a1a1a;
  opacity: 0.45;
  margin: 16px 0 16px;
}
.theme-en .en-collage-copy p {
  margin: 0;
  font-size: 14px;
  line-height: 1.7;
  color: #3f3a34;
}
.theme-en .tile-glass .en-collage-copy .num,
.theme-en .tile-only .en-collage-copy .num { color: rgba(255, 255, 255, 0.5); }
.theme-en .tile-glass .en-collage-copy h3,
.theme-en .tile-glass .en-collage-copy h3 small,
.theme-en .tile-only .en-collage-copy h3,
.theme-en .tile-only .en-collage-copy h3 small { color: #fff; }
.theme-en .tile-glass .en-collage-copy .rule,
.theme-en .tile-only .en-collage-copy .rule { background: #fff; opacity: 0.7; }
.theme-en .tile-glass .en-collage-copy p,
.theme-en .tile-only .en-collage-copy p,
.theme-en .tile-only .en-collage-copy .soon { color: rgba(255, 255, 255, 0.88); }
.theme-en .tile-only .en-collage-copy {
  padding-top: 56px;
  max-width: 280px;
}
.theme-en .tile-only .soon {
  margin-top: 22px;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 700;
}
.en-two-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
  margin-bottom: 48px;
}
.en-two-head h2 { font-size: clamp(30px, 3.4vw, 46px); }
.en-two-head .muted { max-width: 30em; }
.theme-en .en-markets { padding: 50px 0 0; background: #e6e1df; }
.theme-en .en-two-head {
  grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
  gap: 80px;
  margin-bottom: 34px;
  align-items: start;
}
.theme-en .en-two-head .kicker {
  margin: 0 0 27px;
  line-height: 1;
  color: #1a1916;
  letter-spacing: 0.14em;
}
.theme-en .en-two-head h2 {
  font-size: clamp(32px, 3.6vw, 52px);
  line-height: 1;
  color: #0c1424;
}
.theme-en .en-two-head .rule {
  width: 49px;
  height: 1px;
  margin: 9px 0 0;
  opacity: 0.85;
  background: #1a1916;
}
.theme-en .en-two-head .en-two-copy { padding-top: 19px; }
.theme-en .en-two-head .en-two-copy p { margin: 0; }
.theme-en .en-two-head .muted {
  max-width: 24em;
  font-size: 15px;
  line-height: 1.7;
  color: #2a2926;
}
.theme-en .en-two-head .link-arrow {
  margin-top: 24px;
  display: inline-block;
  padding-bottom: 14px;
  box-shadow: none;
  border-bottom: 1px solid currentColor;
  color: #1a1916;
  letter-spacing: 0.14em;
}
.theme-en .market-grid { margin-top: 0; }
.en-supply-band {
  display: grid;
  grid-template-columns: 0.32fr 0.68fr;
  min-height: 0;
  background: #f7f4ee;
}
.en-supply-copy {
  padding: 88px 8% 72px max(40px, calc((100vw - var(--wide)) / 2));
  align-self: center;
}
.en-supply-copy h2 { font-size: clamp(30px, 3.4vw, 46px); }
.theme-en .en-supply-copy h2 {
  font-size: clamp(36px, 3.8vw, 52px);
  line-height: 1.12;
  color: #161513;
}
.en-supply-copy h2 em { font-style: italic; }
.en-supply-copy .muted { max-width: 22em; margin: 24px 0; }
.theme-en .en-supply-copy .muted {
  margin: 28px 0 32px;
  line-height: 1.8;
}
.theme-en .en-supply-copy .link-arrow {
  box-shadow: inset 0 -1px 0 currentColor;
}
.en-supply-photo { min-height: 100%; background-position: center 40%; }
.theme-en .en-supply-photo {
  min-height: 0;
  height: auto;
  aspect-ratio: 3 / 2;
  background-position: center center;
  background-size: cover;
}
.theme-en .en-trio-navy { gap: 40px; }
.theme-en .en-trio-navy .kicker { color: rgba(255, 255, 255, 0.6); }
.theme-en .en-trio-navy h2 { font-size: clamp(32px, 3vw, 44px); line-height: 1.12; }
.theme-en .en-trio-navy .muted { color: rgba(255, 255, 255, 0.72); margin: 14px 0 0; max-width: 26em; }
.theme-en .en-trio-items { grid-template-columns: repeat(3, 1fr); gap: 28px; }
.theme-en .en-trio-items article { padding: 0; border-left: 0; }
.theme-en .en-trio-items article:first-child { padding-left: 0; border-left: 0; }
.theme-en .en-trio-items .icon-svg { width: 26px; height: 26px; color: #fff; margin-bottom: 14px; }
.theme-en .en-trio-items h3 { font-family: var(--sans); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 700; line-height: 1.35; }
.theme-en .en-trio-items p { font-size: 13px; line-height: 1.55; max-width: 16em; }
.theme-en .en-trio-cta h2 {
  font-size: clamp(30px, 2.8vw, 40px);
  max-width: 8.5em;
  color: var(--ink);
  line-height: 1.12;
}
.theme-en .en-trio-cta .muted { margin: 0; max-width: 18em; color: #4a453e; }
.theme-en .en-trio-cta .btn {
  min-height: 46px;
  padding: 0 28px;
  background: var(--navy);
  border-color: var(--navy);
}
.en-duo { display: grid; grid-template-columns: 1fr 1fr; }
.theme-en .en-duo {
  grid-template-columns: 1.42fr 0.76fr 0.62fr;
  min-height: 0;
  align-items: stretch;
  background: #f7f4ee;
}
@media (max-width: 900px) {
  .theme-en .en-duo,
  .theme-en .en-duo-top,
  .theme-en .en-trio { grid-template-columns: 1fr; }
}
.en-duo-half { padding: 72px 40px 64px; }
.en-duo-quality { background: #f3efe6; padding-left: max(40px, calc((100vw - var(--wide)) / 2)); }
.theme-en .en-duo-quality,
.theme-en .en-duo-sus { background: #f7f4ee; }
.en-duo-sus { background: #ece6db; padding-right: max(40px, calc((100vw - var(--wide)) / 2)); }
.theme-en .en-duo-quality {
  padding: 0 8px 36px max(40px, calc((100vw - var(--wide)) / 2));
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 22px;
}
.theme-en .en-duo-sus {
  padding: 56px 28px 36px 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 28px;
}
.en-duo-top { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: center; }
.theme-en .en-duo-top {
  grid-template-columns: minmax(168px, 0.34fr) minmax(0, 1fr);
  gap: 28px;
  align-items: center;
}
.theme-en .en-duo-quality-copy { padding-top: 0; }
.theme-en .en-duo-quality-copy .rule {
  width: 28px;
  height: 1px;
  background: #1a1a1a;
  opacity: 0.35;
  margin: 18px 0 16px;
}
.en-duo-top h2 { font-size: clamp(26px, 2.6vw, 36px); }
.theme-en .en-duo-quality .en-duo-top h2,
.theme-en .en-duo-sus h2 { font-size: clamp(28px, 2.5vw, 36px); line-height: 1.15; }
.en-duo-top .muted { font-size: 14px; }
.theme-en .en-duo-quality .en-duo-top .muted { max-width: 18em; margin-top: 0; line-height: 1.7; }
.theme-en .en-duo-sus .muted { max-width: 26em; margin: 16px 0 0; font-size: 14px; line-height: 1.75; }
.en-duo-photo { min-height: 220px; background-position: 70% center; }
.theme-en .en-duo-photo {
  min-height: 0;
  height: 280px;
  aspect-ratio: auto;
  margin-top: 0;
  background-position: 62% 42%;
  background-size: cover;
}
.theme-en .en-duo-river {
  min-height: 100%;
  background-size: cover;
  background-position: 50% 24%;
}
.en-duo-icons { display: grid; gap: 0; margin-top: 40px; }
.en-duo-icons.five { grid-template-columns: repeat(5, 1fr); }
.en-duo-icons.three { grid-template-columns: repeat(3, 1fr); }
.en-duo-icons article { padding: 0 12px; border-left: 1px solid var(--line); }
.en-duo-icons article:first-child { padding-left: 0; border-left: 0; }
.theme-en .en-duo-icons { margin-top: 0; gap: 0 6px; }
.theme-en .en-duo-icons article { padding: 0 8px 0 0; border-left: 0; }
.en-duo-icons .icon-svg { width: 26px; height: 26px; margin-bottom: 10px; }
.theme-en .en-duo-icons .icon-svg { width: 22px; height: 22px; margin-bottom: 12px; }
.en-duo-icons .num { font-size: 13px; margin-bottom: 4px; }
.theme-en .en-duo-icons .num { font-size: 11px; letter-spacing: 0.1em; color: #6b665e; }
.en-duo-icons h3 { font-family: var(--sans); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; }
.theme-en .en-duo-icons h3 { font-size: 10.5px; margin: 0; }
.en-duo-icons p { margin: 6px 0 0; font-size: 12px; color: var(--muted); line-height: 1.6; }
.theme-en .en-duo-icons p { font-size: 12px; line-height: 1.45; max-width: 10.5em; }
.theme-en .en-news { padding: 72px 0 80px; background: #f3efe8; }
.theme-en .en-news h2 { font-size: clamp(24px, 2.4vw, 34px); max-width: 16em; line-height: 1.25; }
.theme-en .en-news .form-note { margin-top: 10px; font-size: 11px; color: var(--muted); }
.theme-en .en-news-form input {
  background: #fff;
  border: 0;
  min-height: 48px;
}
.theme-en .en-news-form .btn {
  min-height: 48px;
  background: var(--navy);
  border-color: var(--navy);
}

/* --- EN products --- */
.prod-rows { background: #f2f0e9; }
.prod-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(0, 2.1fr) minmax(210px, 0.92fr);
  min-height: 540px;
  background: #f2f0e9;
}
.prod-row.photo-first { grid-template-columns: minmax(0, 2.1fr) minmax(220px, 1fr) minmax(210px, 0.92fr); }
.prod-row.photo-first .prod-row-photo { order: -1; }
.prod-row.wide,
.prod-row.overlay { grid-template-columns: minmax(240px, 1fr) minmax(0, 3.05fr); }
.prod-row-media {
  position: relative;
  min-height: 540px;
}
.prod-row.overlay .prod-row-photo {
  position: absolute;
  inset: 0;
  min-height: 100%;
}
.prod-row.overlay .prod-row-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 58%, rgba(10, 12, 20, 0.42));
  pointer-events: none;
}
.prod-row.overlay .prod-thumbs {
  position: absolute;
  right: max(20px, calc((100vw - var(--wide)) / 2));
  top: 0;
  bottom: 0;
  transform: none;
  padding: 0;
  z-index: 2;
  height: auto;
}
.prod-row.black { background: #0b0b0c; color: rgba(255, 255, 255, 0.82); }
.prod-row.navy { background: #0a0c14; color: rgba(255, 255, 255, 0.82); }
.prod-row.black h2, .prod-row.navy h2,
.prod-row.black .num, .prod-row.navy .num,
.prod-row.black .tag, .prod-row.navy .tag,
.prod-row.black .link-arrow, .prod-row.navy .link-arrow,
.prod-row.black .soon, .prod-row.navy .soon { color: #fff; }
.prod-row.black .muted, .prod-row.navy .muted { color: rgba(255, 255, 255, 0.72); }
.prod-row-copy {
  padding: 64px 32px 64px max(28px, calc((100vw - var(--wide)) / 2 + 4px));
  align-self: center;
}
.prod-row.photo-first .prod-row-copy {
  padding-left: 40px;
  padding-right: 24px;
}
.prod-row-copy .num {
  font-size: 22px;
  letter-spacing: 0.06em;
  margin-bottom: 16px;
  color: inherit;
  opacity: 0.55;
}
.prod-row.navy .prod-row-copy .num,
.prod-row.black .prod-row-copy .num { opacity: 0.7; }
.prod-row-copy h2 {
  font-size: clamp(22px, 1.7vw, 26px);
  letter-spacing: 0.08em;
  line-height: 1.15;
}
.prod-row-copy .tag {
  margin: 10px 0 0;
  letter-spacing: 0.18em;
  font-size: 10.5px;
}
.prod-row-copy .rule {
  width: 36px;
  margin: 18px 0 16px;
  opacity: 0.28;
}
.prod-row.navy .prod-row-copy .rule,
.prod-row.black .prod-row-copy .rule { background: #fff; }
.prod-row-copy .muted {
  font-family: var(--serif);
  font-size: 16px;
  line-height: 1.55;
  max-width: 16em;
  color: var(--ink);
}
.prod-row.navy .prod-row-copy .muted,
.prod-row.black .prod-row-copy .muted { color: rgba(255, 255, 255, 0.78); }
.prod-row-copy .link-arrow {
  margin-top: 28px;
  text-decoration: underline;
  text-underline-offset: 5px;
  text-decoration-thickness: 1px;
}
.prod-row-copy .soon {
  margin-top: 28px;
  color: inherit;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-decoration: none;
}
.prod-row-photo {
  min-height: 100%;
  height: 100%;
  align-self: stretch;
  background-size: cover;
  background-position: center 58%;
  background-repeat: no-repeat;
  background-color: #efeae3;
}
.prod-row.overlay .prod-row-photo,
.prod-row.wide .prod-row-photo,
.prod-row.navy .prod-row-photo {
  background-size: cover;
}
.prod-thumbs {
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  gap: 0;
  padding: 0 max(28px, calc((100vw - var(--wide)) / 2)) 0 0;
  margin: 0;
  align-self: stretch;
  height: 100%;
  min-height: 100%;
}
.prod-thumb {
  flex: 1 1 0;
  display: grid;
  grid-template-columns: minmax(120px, 1fr) minmax(88px, 1fr);
  gap: 14px;
  align-items: center;
  margin: 0;
  min-height: 0;
}
.prod-thumbs .photo {
  width: 100%;
  height: 100%;
  min-height: 0;
  aspect-ratio: auto;
  background-size: cover;
  background-position: center;
}
.prod-thumbs .tag {
  margin: 0;
  font-size: 10px;
  letter-spacing: 0.16em;
  line-height: 1.45;
  color: var(--ink);
}
.prod-row.black .prod-thumbs .tag,
.prod-row.navy .prod-thumbs .tag { color: rgba(255, 255, 255, 0.88); }
.spec-band { padding: 88px 0; background: #ebe7e0; }
.spec-grid { display: grid; grid-template-columns: 1.1fr repeat(4, 1fr); gap: 0; }
.spec-head h2 {
  font-size: 22px;
  height: 72px;
  white-space: nowrap;
  letter-spacing: 0.08em;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 12px;
}
.spec-head h2::after {
  content: "";
  width: 36px;
  height: 1px;
  background: currentColor;
  opacity: 0.28;
}
.spec-head .tag, .spec-col p { margin: 0; line-height: 20px; padding: 10px 0; min-height: 40px; font-size: 13px; }
.spec-head .tag { color: var(--ink); font-weight: 700; letter-spacing: 0.14em; }
.spec-col { text-align: center; padding: 0 16px; border-left: 1px solid rgba(22, 21, 19, 0.12); }
.spec-col h3 { font-family: var(--sans); font-size: 13px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; height: 40px; display: flex; align-items: flex-end; justify-content: center; }
.spec-col .tag { height: 32px; margin: 0; padding: 6px 0 0; font-size: 10px; }
.spec-col p { color: var(--muted); }
.find-form {
  display: grid;
  grid-template-columns: 0.24fr repeat(4, 1fr);
  min-height: 300px;
  background: #f4f1ea;
}
.find-form-head {
  padding: 48px 28px 48px max(32px, calc((100vw - var(--wide)) / 2));
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}
.find-form-head h2 { font-size: clamp(22px, 2vw, 28px); }
.find-form-head h2::after {
  content: "";
  display: block;
  width: 36px;
  height: 1px;
  background: currentColor;
  opacity: 0.28;
  margin-top: 14px;
}
.find-form .form-tile {
  position: relative;
  padding: 36px 28px 32px;
  min-height: 300px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  color: var(--ink);
  border-left: 1px solid rgba(22, 21, 19, 0.08);
  text-decoration: none;
}
.find-form .form-tile.tone-cream { background: #ebe6dc; }
.find-form .form-tile.has-photo {
  background: #ddd center / cover no-repeat;
}
.find-form .form-tile.has-photo::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(244, 241, 234, 0.62), rgba(244, 241, 234, 0.84));
}
.find-form .form-tile.tone-cool::before {
  background: linear-gradient(180deg, rgba(214, 224, 230, 0.58), rgba(228, 234, 236, 0.82));
}
.find-form .form-tile.tone-warm::before {
  background: linear-gradient(180deg, rgba(236, 228, 214, 0.5), rgba(243, 236, 224, 0.78));
}
.find-form .form-tile > * { position: relative; }
.find-form .form-tile .icon-svg { width: 40px; height: 40px; margin-bottom: 6px; }
.find-form .form-tile h3 { font-family: var(--sans); font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700; }
.find-form .form-tile .muted { font-size: 13px; margin: 0; }
.find-form .form-tile .link-arrow { font-size: 10px; margin-top: auto; letter-spacing: 0.14em; }
.cta-row {
  padding: 64px 0;
  background: #0a0c14;
}
.cta-row-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr auto auto;
  gap: 40px;
  align-items: center;
}
.cta-row-grid h2 { font-size: clamp(24px, 2.4vw, 34px); }
.cta-row-grid p { margin: 0; }
.cta-row-grid .link-arrow { border-left: 1px solid rgba(255, 255, 255, 0.3); padding-left: 32px; }
.cta-dark.cta-row .btn.light-solid {
  background: #f2f0e9;
  color: #0a0c14;
  border-color: #f2f0e9;
  min-height: 48px;
  padding: 0 22px;
}

/* --- Solutions --- */
.intro-split { grid-template-columns: 0.42fr 0.58fr; gap: 64px; }
.intro-split .photo { min-height: 360px; }
.intro-split h2 { font-size: clamp(26px, 2.6vw, 36px); line-height: 1.2; }
.ghost-band { padding: 72px 0 80px; background: transparent; }
.ghost-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.ghost-col { position: relative; padding: 110px 24px 0 24px; border-left: 1px solid var(--line); }
.ghost-col:first-child { padding-left: 0; border-left: 0; }
.ghost-col .ghost-num {
  position: absolute;
  top: -12px;
  left: 20px;
  font-family: var(--serif);
  font-size: 112px;
  line-height: 1;
  color: rgba(22, 21, 19, 0.07);
  pointer-events: none;
}
.ghost-col:first-child .ghost-num { left: 0; }
.icon-tag { display: flex; align-items: center; gap: 8px; color: var(--ink); font-weight: 700; margin: 0 0 10px; }
.icon-tag .icon-svg { width: 24px; height: 24px; }
.ghost-col h3 { font-size: 22px; margin: 0 0 12px; }
.ghost-col .muted { font-size: 13.5px; line-height: 1.75; margin: 0; }
.edge-band .center-head { margin-bottom: 36px; }
.edge-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.edge-card .photo { min-height: 0; aspect-ratio: 4 / 3.2; }
.edge-copy { padding: 24px 22px 28px; border-left: 1px solid var(--line); }
.edge-card:first-child .edge-copy { border-left: 0; }
.edge-copy .num { font-size: 13px; margin-bottom: 6px; }
.edge-copy h3 { font-size: 20px; text-transform: uppercase; letter-spacing: 0.04em; }
.edge-copy .sub { font-family: var(--serif); font-size: 17px; margin: 6px 0 12px; color: var(--ink); }
.edge-copy .muted { font-size: 13.5px; line-height: 1.75; }
.ways-band { padding: 64px 0; }
.ways-grid { display: grid; grid-template-columns: 1.1fr repeat(4, 1fr); gap: 0; align-items: center; }
.ways-head { padding-right: 32px; }
.ways-head h2 { font-size: clamp(26px, 2.6vw, 36px); }
.ways-grid article { padding: 8px 20px; border-left: 1px solid rgba(255, 255, 255, 0.18); text-align: center; }
.ways-grid .icon-svg { width: 38px; height: 38px; color: #fff; margin: 0 auto 14px; }
.ways-grid h3 { font-family: var(--sans); font-size: 11.5px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; color: #fff; }
.ways-grid p { font-size: 13px; margin: 8px 0 0; color: rgba(255, 255, 255, 0.72); }
.brand-band {
  display: grid;
  grid-template-columns: 0.3fr 0.7fr;
  min-height: 460px;
  background: var(--paper);
}
.brand-band-copy { padding: 64px 6% 64px max(40px, calc((100vw - var(--wide)) / 2)); align-self: center; }
.brand-band-copy h2 { font-size: clamp(26px, 2.6vw, 36px); }
.brand-band-copy .tag { color: var(--ink); font-weight: 700; margin: 18px 0 14px; }
.brand-band-copy .muted { font-size: 13.5px; line-height: 1.8; }
.brand-band-photo { min-height: 100%; }
.flow-band { padding: 72px 0; }
.flow-grid { display: grid; grid-template-columns: 0.26fr 1fr; gap: 48px; align-items: center; }
.flow-head h2 { font-size: clamp(26px, 2.6vw, 36px); }
.flow { display: flex; align-items: flex-start; gap: 12px; }
.flow-step { flex: 1; display: grid; gap: 4px; justify-items: start; }
.flow-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 1px solid rgba(22, 21, 19, 0.3);
  display: grid;
  place-items: center;
  margin-bottom: 10px;
}
.flow-icon .icon-svg { width: 24px; height: 24px; }
.flow.plain .flow-icon { width: auto; height: auto; border: 0; border-radius: 0; margin-bottom: 6px; }
.flow.plain .flow-icon .icon-svg { width: 30px; height: 30px; }
.flow-step .num { font-size: 13px; margin: 0; }
.flow.no-num .num { display: none; }
.flow-step h3 { font-family: var(--sans); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; }
.flow-step p { margin: 6px 0 0; font-size: 13px; color: var(--muted); line-height: 1.7; }
.flow-arrow { flex: 0 0 auto; margin-top: 20px; color: var(--muted); font-size: 22px; line-height: 1; }
.flow-dark .flow-icon { border-color: rgba(255, 255, 255, 0.4); }
.flow-dark .flow-icon .icon-svg, .flow-dark h3 { color: #fff; }
.flow-dark p { color: rgba(255, 255, 255, 0.72); }
.flow-dark .flow-arrow { color: rgba(255, 255, 255, 0.5); }
.flow-foot { margin: 22px 0 0; font-size: 13px; color: var(--muted); }
.cta-dark.cta-row .btn.light-solid { color: var(--navy); }

/* --- Global supply --- */
.plants-band { padding: 80px 0; }
.plants-grid { display: grid; grid-template-columns: 1.1fr repeat(5, 1fr); gap: 0 14px; align-items: start; }
.plants-head { padding-right: 24px; }
.plants-head .kicker { margin-bottom: 4px; }
.plants-head h2 { font-size: clamp(26px, 2.6vw, 36px); }
.plants-head .muted { font-size: 13.5px; line-height: 1.8; }
.plant .photo { min-height: 0; aspect-ratio: 3 / 4; }
.plant h3 {
  font-family: var(--sans);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 700;
  margin: 16px 0 8px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
.plant .muted { font-size: 12.5px; line-height: 1.7; margin: 0; }
.standard-band { padding: 64px 0; }
.standard-grid { display: grid; grid-template-columns: 0.28fr 1fr; gap: 48px; align-items: center; }
.standard-head h2 { font-size: clamp(26px, 2.6vw, 36px); }
.standard-head .muted { font-size: 13.5px; line-height: 1.8; }
.bases { padding: 72px 0; }
.bases-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.base-top { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: stretch; }
.base-copy h2 { font-size: 30px; }
.base-copy .tag.strong { margin: 6px 0 16px; letter-spacing: 0.14em; }
.base-copy .muted { font-size: 13.5px; line-height: 1.8; }
.base-photo { min-height: 320px; }
.base-links { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.badge-gold { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: #a67c2e; font-weight: 700; }
.mini-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 28px; }
.mini-stats .icon-svg { width: 26px; height: 26px; }
.mini-stats h4 { margin: 10px 0 4px; font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700; }
.mini-stats p { margin: 0; font-size: 11.5px; color: var(--muted); line-height: 1.6; }
.map-band {
  display: grid;
  grid-template-columns: 0.3fr 0.7fr;
  align-items: center;
  background: #0b1424;
  color: #fff;
  padding: 56px 0 56px max(40px, calc((100vw - var(--wide)) / 2));
}
.map-copy { padding-right: 40px; }
.map-copy h2 { color: #fff; font-size: clamp(26px, 2.6vw, 36px); }
.map-copy p { color: rgba(255, 255, 255, 0.72); max-width: 24em; font-size: 13.5px; line-height: 1.8; }
.map-img { width: 100%; height: auto; display: block; }
.models-band { padding: 72px 0; }
.models-grid { display: grid; grid-template-columns: 1.1fr repeat(3, 1fr); gap: 0; align-items: center; }
.models-head { padding-right: 32px; }
.models-head h2 { font-size: clamp(26px, 2.6vw, 36px); }
.model { padding: 8px 24px; border-left: 1px solid var(--line); text-align: center; }
.model h3 { font-family: var(--sans); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; }
.model-chain { display: flex; justify-content: center; align-items: center; gap: 10px; margin: 20px 0 16px; }
.model-chain .icon-svg { width: 30px; height: 30px; }
.model-chain .flow-arrow { margin: 0; font-size: 18px; }
.model .muted { font-size: 13px; margin: 0; line-height: 1.7; }
.pillars-band { padding: 64px 0; background-size: cover; background-position: center; color: #fff; }
.pillars-grid { display: grid; grid-template-columns: 1.1fr repeat(4, 1fr); gap: 0; align-items: center; }
.pillars-head { padding-right: 32px; }
.pillars-head h2 { color: #fff; font-size: clamp(26px, 2.6vw, 36px); }
.pillars-head p { color: rgba(255, 255, 255, 0.78); max-width: 22em; font-size: 13.5px; line-height: 1.8; }
.pillars-grid article { padding: 8px 24px; border-left: 1px solid rgba(255, 255, 255, 0.28); }
.big-num { font-family: var(--serif); font-size: 52px; line-height: 1; color: #fff; }
.pillars-grid h3 { font-family: var(--sans); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; color: #fff; margin-top: 14px; }
.pillars-grid p { font-size: 13px; color: rgba(255, 255, 255, 0.72); margin: 8px 0 0; line-height: 1.7; }
.supplying-band { padding: 80px 0; }
.supplying-grid { display: grid; grid-template-columns: 1.1fr repeat(4, 1fr); gap: 0 16px; align-items: start; }
.supplying-head { padding-right: 24px; }
.supplying-head h2 { font-size: clamp(26px, 2.6vw, 36px); }
.supplying-head .muted { font-size: 13.5px; line-height: 1.8; }
.partner-card .photo { min-height: 0; aspect-ratio: 4 / 3; }
.partner-card h3 { font-family: var(--sans); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; margin: 18px 0 8px; }
.partner-card .muted { font-size: 13px; margin: 0 0 10px; line-height: 1.7; }

/* --- Partners --- */
.criteria { margin-top: 48px; gap: 0; justify-items: stretch; text-align: left; }
.criteria article { padding: 0 24px; border-right: 1px solid var(--line); }
.criteria article:first-child { padding-left: 0; }
.criteria article:last-child { border-right: 0; }
.criteria article .icon-svg { width: 30px; height: 30px; margin-bottom: 18px; }
.criteria article h3 { text-transform: uppercase; letter-spacing: 0.06em; font-size: 20px; line-height: 1.2; font-weight: 400; }
.criteria article p { font-size: 13.5px; line-height: 1.75; margin-top: 12px; }
.partner-models .supplying-head h2 { font-size: clamp(22px, 1.9vw, 26px); line-height: 1.3; }
.split-band { display: grid; grid-template-columns: 0.58fr 0.42fr; min-height: 420px; background: var(--bg); }
.split-band.reverse { grid-template-columns: 0.42fr 0.58fr; }
.split-band-copy { padding: 64px clamp(24px, 5vw, 72px); align-self: center; }
.split-band-copy h2 { font-size: clamp(26px, 2.6vw, 36px); }
.split-band-copy .muted { font-size: 14px; line-height: 1.8; }
.split-band-photo { min-height: 100%; }
.partner-models { background: var(--paper); }
.cta-photo { padding: 0; background-size: cover; background-position: left center; }
.cta-photo-grid {
  display: grid;
  grid-template-columns: 0.36fr 0.34fr 0.3fr;
  gap: 32px;
  align-items: center;
  padding: 80px 0 80px 30%;
}
.cta-photo h2 { font-size: clamp(28px, 3vw, 40px); }
.cta-photo .rule { background: #fff; }
.cta-photo p { margin: 0; line-height: 1.8; }

/* --- Sustainability --- */
.theme-en .page-hero.with-photo.split-photo.sus-hero {
  min-height: 540px;
}
.theme-en .page-hero.split-photo.sus-hero .hero-photo {
  background-position: 42% 46%;
  background-size: cover;
}
.theme-en .sus-feature {
  min-height: 280px;
}
.theme-en .sus-feature .split-band-photo {
  background-position: 28% 48%;
  background-size: cover;
}
.questions-band { padding: 80px 0; }
.questions-grid { display: grid; grid-template-columns: 0.3fr 0.4fr 0.3fr; gap: 0 40px; align-items: start; }
.questions-head h2 { font-size: clamp(26px, 2.6vw, 36px); }
.questions-head .muted { font-size: 13.5px; line-height: 1.9; }
.big-q { font-family: var(--serif); font-size: 170px; line-height: 1; color: rgba(22, 21, 19, 0.08); margin-top: 24px; }
.q-list { list-style: none; margin: 0; padding: 0; }
.q-list li { display: grid; grid-template-columns: 64px 1fr; gap: 12px; padding: 24px 0; border-bottom: 1px solid var(--line); align-items: start; }
.q-list li:first-child { padding-top: 8px; }
.q-num { font-family: var(--serif); font-size: 34px; line-height: 1; }
.q-list h3 { font-size: 18px; text-transform: uppercase; letter-spacing: 0.04em; line-height: 1.3; }
.q-photos { display: grid; gap: 8px; }
.q-photos .photo { min-height: 0; aspect-ratio: 2.35 / 1; }
.theme-en .q-photos .photo:nth-child(1) { background-position: 20% 55%; }
.theme-en .q-photos .photo:nth-child(2) { background-position: center 18%; }
.theme-en .q-photos .photo:nth-child(3) { background-position: center 35%; }
.theme-en .q-photos .photo:nth-child(4) { background-position: center 40%; }
.materials-band {
  display: grid;
  grid-template-columns: 0.3fr 0.7fr;
  align-items: center;
  background: var(--bg);
  padding: 0 0 0 max(40px, calc((100vw - var(--wide)) / 2));
}
.materials-copy { padding: 48px 40px 48px 0; align-self: center; }
.materials-copy h2 { font-size: clamp(26px, 2.6vw, 36px); }
.materials-copy .muted { font-size: 13.5px; line-height: 1.8; }
.materials-grid {
  display: block;
  min-height: 0;
  aspect-ratio: 2578 / 747;
  background: #ece7de center / 100% 100% no-repeat;
}
.stone-band {
  display: grid;
  grid-template-columns: 0.38fr 0.62fr;
  min-height: 440px;
  background: var(--bg);
  padding: 0;
  align-items: stretch;
}
.stone-copy {
  padding: 72px 40px 72px max(40px, calc((100vw - var(--wide)) / 2));
  align-self: center;
}
.stone-band h2 { font-size: clamp(26px, 2.6vw, 36px); }
.stone-band .muted { line-height: 1.95; max-width: 26em; }
.stone-photo { min-height: 100%; background-position: 32% 58%; background-size: cover; }
.progress-band { padding: 72px 0; }
.progress-grid { display: grid; grid-template-columns: 0.3fr 0.7fr; gap: 48px; align-items: center; }
.progress-grid h2 { font-size: clamp(26px, 2.6vw, 36px); }
.progress-grid .muted { font-size: 13.5px; line-height: 1.9; }
.timeline {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  align-items: start;
  position: relative;
  padding-top: 8px;
}
.timeline::before { content: ""; position: absolute; left: 12%; right: 12%; top: 47px; height: 1px; background: rgba(22, 21, 19, 0.28); }
.timeline article { text-align: center; position: relative; }
.timeline h3 { font-family: var(--sans); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; margin-bottom: 18px; }
.tl-dot { display: block; width: 14px; height: 14px; border-radius: 50%; border: 1px solid rgba(22, 21, 19, 0.55); background: var(--paper); margin: 0 auto 18px; position: relative; }
.timeline p { font-size: 13px; color: var(--muted); margin: 0; line-height: 1.7; }
.tl-arrow { align-self: end; padding-bottom: 6px; color: rgba(22, 21, 19, 0.34); font-size: 15px; line-height: 1; }
.theme-en .ahead-band { min-height: 520px; background: #f3efe8; }
.theme-en .ahead-band .split-band-photo {
  background-color: #f3efe8;
  background-size: cover;
  background-position: 52% 18%;
  background-repeat: no-repeat;
}
.beyond-band { display: grid; grid-template-columns: 0.34fr 0.66fr; min-height: 420px; background: var(--paper); }
.beyond-copy { padding: 64px clamp(24px, 5vw, 72px) 64px max(40px, calc((100vw - var(--wide)) / 2)); align-self: center; }
.beyond-copy h2 { font-size: clamp(26px, 2.6vw, 36px); }
.beyond-copy .muted { font-size: 13.5px; line-height: 1.8; }
.beyond-photo { min-height: 100%; clip-path: none; background-position: 58% 42%; }
.cta-light { padding: 72px 0; background: var(--bg); }
.cta-light-grid { display: grid; grid-template-columns: 1fr auto auto; gap: 48px; align-items: center; }
.cta-light-grid h2 { font-size: clamp(28px, 3vw, 40px); }
.cta-light-grid p { margin: 0; padding-left: 32px; border-left: 1px solid rgba(22, 21, 19, 0.25); line-height: 1.9; font-size: 14px; }
.cta-photo-light { padding: 0; background-size: cover; background-position: left center; min-height: 320px; display: grid; align-items: center; }
.cta-photo-light-grid { display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: center; padding: 64px 0 64px 42%; }
.cta-photo-light h2 { font-size: clamp(26px, 2.6vw, 36px); }
.cta-photo-light .muted { line-height: 1.8; font-size: 14px; }

/* --- FAQ --- */
.faq-body { display: grid; grid-template-columns: 0.3fr 0.7fr; background: var(--bg); }
.faq-side { background: #ece7de; padding: 56px 40px 64px max(24px, calc((100vw - var(--wide)) / 2)); }
.faq-main { background: var(--bg); padding: 48px max(24px, calc((100vw - var(--wide)) / 2)) 64px 48px; }
.faq-nav a {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 12px;
  align-items: start;
  padding: 22px 0 22px 16px;
  border-bottom: 1px solid var(--line);
  border-left: 3px solid transparent;
  font-size: 13px;
  letter-spacing: 0;
}
.faq-nav a.is-active { border-left-color: #a67c2e; font-weight: 400; }
.faq-nav-num { font-family: var(--serif); font-size: 30px; line-height: 1; }
.faq-nav-name { display: block; font-family: var(--serif); font-size: 19px; text-transform: uppercase; letter-spacing: 0.03em; line-height: 1.2; }
.faq-nav-count { display: block; margin-top: 8px; font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.faq-cta { margin-top: 40px; padding: 28px 24px; background: #f3efe6; border: 0; }
.faq-cta .icon-svg { width: 30px; height: 30px; margin-bottom: 12px; }
.faq-cta .rule { margin: 12px 0 14px; }
.faq-cta .muted { font-size: 13px; line-height: 1.7; }
.faq-cta .stack-actions { margin-top: 18px; }
.faq-cta .stack-actions .btn { width: 100%; min-width: 0; }
details.faq-cat { border-bottom: 1px solid var(--line); padding: 0; }
details.faq-cat > summary {
  display: grid;
  grid-template-columns: 56px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 26px 0;
  font-weight: 400;
}
details.faq-cat > summary::after { content: "+"; font-size: 22px; color: var(--ink); }
details.faq-cat[open] > summary::after { content: "–"; }
.faq-cat-num { font-family: var(--serif); font-size: 30px; line-height: 1; }
.faq-cat-name { font-family: var(--serif); font-size: 20px; text-transform: uppercase; letter-spacing: 0.04em; }
.faq-cat-body { padding: 0 0 24px; }
details.faq-q { border-top: 1px solid var(--line); border-bottom: 0; padding: 18px 0; }
details.faq-q summary { font-weight: 600; font-size: 14px; }
.faq-a p { color: var(--ink); font-size: 14px; line-height: 1.8; margin: 12px 0 0; }
.faq-a .link-arrow { margin-top: 4px; }

/* --- Request a quote --- */
.quote-body {
  display: grid;
  grid-template-columns: 0.3fr 0.7fr;
  background-color: var(--bg);
}
.quote-side { background: #ece7de; padding: 64px 40px 64px max(24px, calc((100vw - var(--wide)) / 2)); }
.quote-side h2 { font-size: clamp(26px, 2.6vw, 34px); }
.quote-side .muted { font-size: 13.5px; line-height: 1.8; }
.quote-side .quote-card {
  margin-top: 56px;
  text-align: center;
  background: #f3efe6;
  border: 0;
  padding: 40px 28px;
}
.quote-card .icon-svg { width: 28px; height: 28px; margin: 0 auto 14px; }
.quote-card .quote-main { font-size: 24px; text-transform: uppercase; letter-spacing: 0.03em; line-height: 1.3; }
.quote-card .muted { font-size: 12.5px; line-height: 1.8; margin: 14px 0 0; }
.quote-main-col { padding: 56px max(24px, calc((100vw - var(--wide)) / 2)) 72px 48px; }
.quote-form { display: grid; gap: 32px; }
.quote-form fieldset { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: 14px; }
.quote-form legend { font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 700; margin-bottom: 14px; padding: 0; }
.quote-form legend small { text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--muted); font-size: 12px; }
.quote-form label { font-size: 12.5px; }
.form-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 24px; }
.form-row-split { border-top: 1px solid var(--line); padding-top: 28px; }
.form-row-split > fieldset:last-child { border-left: 1px solid var(--line); padding-left: 24px; }
.check-list.plain { border: 0; background: transparent; padding: 0; gap: 12px; }
.check-list.plain label { font-size: 12.5px; letter-spacing: 0.06em; text-transform: uppercase; }
.quote-form .chips { grid-template-columns: repeat(4, 1fr); }
.quote-form .chip {
  flex-direction: row;
  justify-content: flex-start;
  min-height: 60px;
  padding: 12px 16px;
  text-align: left;
  gap: 12px;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 600;
  background: transparent;
}
.quote-form .chip-icon { width: 22px; height: 22px; flex: 0 0 auto; }
.upload-box {
  position: relative;
  display: grid;
  justify-items: center;
  text-align: center;
  gap: 8px;
  padding: 28px 20px;
  border: 1px dashed rgba(22, 21, 19, 0.35);
  cursor: pointer;
  font-size: 12px;
  color: var(--muted);
}
.upload-box input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.upload-box .icon-svg { width: 30px; height: 30px; }
.upload-box small { font-size: 11px; }
.upload-names { font-size: 12px; color: var(--ink); }
.form-row-upload { align-items: start; }
.quote-form .next-card { background: #ece7de; border: 0; padding: 24px; }
.next-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.next-steps > div { border-left: 1px solid var(--line); padding-left: 14px; }
.next-steps > div:first-child { border-left: 0; padding-left: 0; }
.next-steps .num { font-size: 22px; margin: 0; display: block; }
.next-steps h4 { margin: 4px 0 6px; font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700; }
.next-steps p { margin: 0; font-size: 11.5px; color: var(--muted); line-height: 1.6; }

/* --- CN about --- */
.theme-cn .page-hero.split-photo .hero-copy h1 { font-size: clamp(40px, 5vw, 64px); }
.about-sub { font-family: var(--serif); font-size: clamp(20px, 2vw, 28px); margin: 10px 0 0; color: var(--ink); }
.verse { line-height: 2.1; font-size: 14.5px; color: var(--ink); margin: 0 0 18px; }
.sign { font-weight: 700; letter-spacing: 0.12em; margin-top: 28px; }
.about-row { display: grid; grid-template-columns: 0.42fr 0.58fr; min-height: 0; background: var(--bg); }
.about-row.paper { background: var(--paper); }
.about-row.reverse .about-copy { order: 2; padding: 72px max(24px, calc((100vw - var(--wide)) / 2)) 72px 6%; }
.about-copy { padding: 72px 6% 72px max(24px, calc((100vw - var(--wide)) / 2)); align-self: center; }
.about-copy h2 { font-size: clamp(26px, 2.6vw, 36px); }
.about-copy .rule { margin: 16px 0 22px; }
.about-photo { min-height: 100%; background: #ddd center / cover no-repeat; position: relative; }
.overlay-quote { display: grid; align-items: center; justify-items: center; }
.overlay-quote p { margin: 0; color: #fff; font-family: var(--serif); font-size: clamp(22px, 2.2vw, 30px); line-height: 1.7; text-shadow: 0 2px 18px rgba(0, 0, 0, 0.45); }
.overlay-quote.right { justify-items: end; padding-right: 8%; }
.caption-photo .tag { position: absolute; right: 16px; bottom: 12px; color: #fff; font-size: 11px; text-shadow: 0 1px 8px rgba(0, 0, 0, 0.6); margin: 0; }
.icon-mini { margin-top: 28px; gap: 0; }
.icon-mini .icon-card { padding: 0 10px; }
.icon-mini .icon-card:first-child { padding-left: 0; }
.icon-mini .icon-card h3 { font-size: 15px; }
.icon-mini .icon-card p { font-size: 12.5px; line-height: 1.6; }
.icon-mini .icon-svg { width: 32px; height: 32px; }
.about-process-grid { display: grid; gap: 36px; }
.about-process .about-copy { padding: 0; max-width: 36em; }
.about-process .process-strip { margin-top: 0; }
.proc-title { margin: 12px 0 4px; font-weight: 600; font-size: 14px; }
.proc-title .num { display: inline; margin-right: 6px; font-size: 14px; }
.about-process .process-strip .muted { font-size: 12.5px; margin: 0; line-height: 1.6; }
.about-contact .rule { margin: 14px 0 0; }
.about-contact-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 32px; margin-top: 40px; align-items: center; }
.contact-lines { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
.contact-lines li { display: grid; grid-template-columns: 22px auto 1fr; gap: 12px; align-items: start; font-size: 14px; }
.contact-lines .icon-svg { width: 20px; height: 20px; }
.contact-lines .k { color: var(--muted); }
.qr-block { display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: center; border-left: 1px solid var(--line); padding-left: 32px; }
.qr-block p { margin: 0 0 6px; }
.qr-square { width: 120px; height: 120px; object-fit: cover; }
.qr-block .qr-circle { width: 120px; height: 120px; }

/* --- CN products --- */
.cn-prod-hero .hero-side-label.vertical {
  writing-mode: vertical-rl;
  transform: none;
  right: 36px;
  top: 40%;
  letter-spacing: 0.3em;
  line-height: 2.2;
  text-align: left;
}
.cn-collage { padding: 40px 0 72px; background-size: cover; background-position: center; }
.cn-collage-grid {
  width: min(var(--wide), calc(100% - 48px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 14px;
}
.cn-tile {
  position: relative;
  display: grid;
  grid-template-columns: 0.42fr 0.58fr;
  min-height: 400px;
  color: var(--ink);
  background: rgba(247, 243, 236, 0.9);
  overflow: hidden;
}
.cn-tile.t2 { grid-template-columns: 0.46fr 0.54fr; }
.cn-tile.t3 { grid-column: 1 / -1; grid-template-columns: 0.34fr 0.66fr; min-height: 520px; }
.cn-tile.t4 { grid-template-columns: 0.56fr 0.44fr; }
.cn-tile.t4 .cn-tile-photo { order: -1; }
.cn-tile-photo { background: #ddd center / cover no-repeat; min-height: 100%; }
.cn-tile.t1 .cn-tile-photo { background-position: 70% center; clip-path: polygon(0 0, 100% 0, 100% 100%, 6% 100%); }
.cn-tile.t2 .cn-tile-photo { background-position: 80% center; clip-path: polygon(6% 0, 100% 0, 100% 100%, 0 100%); }
.cn-tile.t3 .cn-tile-photo { background-position: center 40%; clip-path: polygon(0 0, 100% 0, 100% 100%, 5% 100%); }
.cn-tile.t4 .cn-tile-photo { background-position: 40% center; clip-path: polygon(0 0, 100% 0, 94% 100%, 0 100%); }
.cn-tile-copy {
  position: relative;
  display: grid;
  align-content: center;
  padding: 40px 12px 40px 24px;
}
.cn-tile.t4 .cn-tile-copy { padding-left: 32px; }
.cn-tile-text { position: relative; padding-left: 96px; }
.cn-tile.t3 .cn-tile-text { padding-left: 112px; }
.cn-tile .ghost-num {
  position: absolute;
  left: 8px;
  top: 50%;
  transform: translateY(-56%);
  font-family: var(--serif);
  font-size: 128px;
  line-height: 1;
  letter-spacing: -0.04em;
  color: rgba(22, 21, 19, 0.14);
  pointer-events: none;
}
.cn-tile.t3 .ghost-num { font-size: 168px; }
.cn-tile-copy h3 { font-size: 26px; }
.cn-tile.t3 .cn-tile-copy h3 { font-size: 30px; }
.cn-tile-copy .vol { margin: 6px 0 14px; font-size: 14px; color: var(--muted); letter-spacing: 0.06em; }
.cn-tile-copy .slogan { margin: 0 0 18px; font-size: 14.5px; }
.cn-tile-copy .link-arrow { font-size: 12px; }
.choose-band { background-size: cover; background-position: center; }
.choose-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-top: 44px; }
.choose-card { padding: 0 24px; border-left: 1px solid var(--line); }
.choose-card:first-child { padding-left: 0; border-left: 0; }
.choose-q { display: flex; align-items: center; gap: 10px; font-weight: 600; margin: 0 0 18px; }
.choose-q .icon-svg { width: 30px; height: 30px; }
.choose-body { display: grid; grid-template-columns: 1fr 96px; gap: 12px; align-items: center; }
.choose-body .tag { margin: 0; }
.choose-body h3 { font-size: 20px; margin: 4px 0; }
.choose-body .muted { margin: 0; font-size: 13px; }
.choose-thumb { width: 96px; height: 120px; object-fit: contain; }
.quality-icons { margin-top: 44px; }
.cn-qr-photo {
  min-height: 340px;
  display: grid;
  align-items: center;
  background-size: cover;
  background-position: center right;
  padding: 56px 0;
}
.cn-qr-photo-grid { display: grid; grid-template-columns: auto auto; justify-content: start; gap: 64px; align-items: center; }
.cn-qr-photo h2 { font-size: clamp(26px, 2.6vw, 36px); margin-bottom: 18px; }
.cn-qr-photo .strong { margin: 0 0 4px; font-size: 18px; }
.cn-qr-photo .muted { margin: 0; }
.cn-qr-photo .qr-square { width: 128px; height: 128px; }
.place-band.light .kicker { color: var(--muted); }
.place-band.light h2 { color: var(--ink); }
.theme-cn .page-hero.brand-hero { min-height: 100vh; min-height: 100svh; }

/* --- Responsive (v81) --- */
@media (max-width: 1100px) {
  .en-duo-icons.five { grid-template-columns: repeat(3, 1fr); row-gap: 20px; }
  .spec-head h2 { font-size: 20px; }
}
@media (max-width: 900px) {
  .page-hero.with-photo.split-photo { grid-template-columns: 1fr; min-height: 0; }
  .page-hero.split-photo.photo-left .hero-copy { order: -1; }
  .page-hero.split-photo .hero-copy { padding: 108px 24px 32px; }
  .page-hero.split-photo .hero-photo { min-height: 280px; }
  .theme-en .page-hero.with-photo.split-photo.sus-hero { min-height: 0; }
  .theme-en .page-hero.split-photo.sus-hero .hero-photo {
    min-height: 0;
    aspect-ratio: 16 / 10;
  }
  .theme-en .sus-feature .split-band-photo {
    min-height: 0;
    aspect-ratio: 16 / 5;
  }
  .page-hero.split-photo .hero-side-label { display: none; }
  .en-collage, .en-two-head, .en-supply-band, .en-duo, .en-duo-top,
  .prod-row, .prod-row.photo-first, .prod-row.wide, .prod-row.overlay, .spec-grid, .find-form, .cta-row-grid,
  .intro-split, .ghost-grid, .edge-grid, .ways-grid, .brand-band, .flow-grid,
  .plants-grid, .standard-grid, .bases-grid, .base-top, .map-band, .models-grid, .pillars-grid, .supplying-grid,
  .split-band, .split-band.reverse, .cta-photo-grid, .questions-grid, .materials-band, .stone-band, .progress-grid, .beyond-band,
  .cta-light-grid, .cta-photo-light-grid, .faq-body, .quote-body, .form-row-2, .form-row-split, .next-steps,
  .about-row, .about-process-grid, .about-contact-grid, .cn-collage-grid, .cn-tile, .cn-tile.t3, .cn-tile.t4,
  .choose-grid, .cn-qr-photo-grid { grid-template-columns: 1fr; }
  .en-collage-intro, .en-supply-copy, .brand-band-copy, .beyond-copy, .map-band, .materials-band,
  .about-copy, .about-row.reverse .about-copy, .faq-side, .faq-main, .quote-side, .quote-main-col,
  .en-duo-quality, .en-duo-sus { padding-left: 24px; padding-right: 24px; }
  .en-collage-intro, .en-supply-copy, .brand-band-copy, .beyond-copy, .about-copy, .about-row.reverse .about-copy { padding-top: 48px; padding-bottom: 40px; }
  .en-collage { grid-auto-rows: auto; }
  .theme-en .en-collage { grid-template-rows: none; }
  .en-collage-tile, .tile-only { min-height: 320px; }
  .theme-en .en-collage-tile, .theme-en .tile-only { min-height: 360px; }
  .theme-en .tile-only {
    background-size: auto 92%;
    background-position: 80% 80%;
  }
  .en-collage-copy { padding: 28px 24px; }
  .theme-en .en-collage-copy { padding: 36px 24px; max-width: none; }
  .theme-en .en-collage-copy .num { font-size: 40px; }
  .en-supply-photo, .brand-band-photo, .beyond-photo, .split-band-photo, .stone-photo, .about-photo, .prod-row-photo, .base-photo { min-height: 280px; }
  .beyond-photo { clip-path: none; }
  .en-duo-half { padding-top: 48px; padding-bottom: 40px; }
  .en-duo-icons.five, .en-duo-icons.three { grid-template-columns: 1fr 1fr; row-gap: 20px; }
  .en-duo-icons article { border-left: 0; padding: 0; }
  .prod-row-copy,
  .prod-row.photo-first .prod-row-copy {
    padding: 40px 24px 28px;
    max-width: none;
  }
  .prod-row-photo,
  .prod-row-media { order: -1; min-height: 320px; }
  .prod-row.overlay .prod-row-photo { position: relative; min-height: 320px; }
  .prod-row.overlay .prod-thumbs {
    position: static;
    transform: none;
    padding: 8px 24px 36px;
  }
  .prod-thumbs { padding: 8px 24px 36px; }
  .prod-thumb { grid-template-columns: 72px 1fr; }
  .prod-thumbs .photo { width: 72px; height: 72px; min-height: 72px; }
  .spec-head h2 { height: auto; margin-bottom: 8px; }
  .spec-head .tag { display: none; }
  .spec-col { text-align: left; padding: 16px 0; border-left: 0; border-top: 1px solid var(--line); }
  .spec-col h3 { height: auto; justify-content: flex-start; }
  .spec-col .tag { height: auto; }
  .find-form-head { padding: 40px 24px 16px; }
  .find-form .form-tile,
  .find-form .form-tile.has-photo { min-height: 200px; border-left: 0; border-top: 1px solid rgba(22, 21, 19, 0.08); }
  .cta-row-grid .link-arrow { border-left: 0; padding-left: 0; }
  .ghost-col, .edge-copy, .ways-grid article, .model, .pillars-grid article, .choose-card, .criteria .icon-card, .qr-block,
  .form-row-split > fieldset:last-child, .next-steps > div { border-left: 0; padding-left: 0; }
  .ghost-col { padding: 80px 0 8px; }
  .ghost-col .ghost-num { left: 0; }
  .edge-copy { padding: 18px 0 28px; }
  .ways-grid article { text-align: left; padding: 16px 0; border-top: 1px solid rgba(255, 255, 255, 0.18); }
  .ways-grid .icon-svg { margin: 0 0 10px; }
  .flow { flex-wrap: wrap; gap: 24px; }
  .flow-step { flex: 1 1 40%; }
  .flow-arrow { display: none; }
  .mini-stats { grid-template-columns: 1fr 1fr; }
  .map-band { padding-top: 40px; padding-bottom: 32px; }
  .map-copy { padding-right: 0; margin-bottom: 24px; }
  .model { text-align: left; padding: 16px 0; border-top: 1px solid var(--line); }
  .model-chain { justify-content: flex-start; }
  .pillars-grid article { padding: 16px 0; border-top: 1px solid rgba(255, 255, 255, 0.28); }
  .cta-photo-grid { padding: 48px 24px; }
  .cta-photo { background-position: 30% center; }
  .big-q { font-size: 110px; }
  .q-photos { grid-template-columns: 1fr 1fr; }
  .materials-grid { grid-template-columns: 1fr 1fr; }
  .theme-en .materials-grid { grid-template-columns: repeat(4, 1fr); }
  .materials-copy { padding: 40px 24px 16px; margin-bottom: 0; }
  .stone-copy { padding: 48px 24px 24px; }
  .stone-photo { min-height: 280px; }
  .stone-band .muted { background: none; padding: 0; }
  .timeline { grid-template-columns: 1fr; }
  .timeline::before { display: none; }
  .tl-arrow { display: none; }
  .cta-light-grid p { border-left: 0; padding-left: 0; }
  .cta-photo-light-grid { padding: 40px 24px; }
  .cta-photo-light { background-position: 30% center; }
  .faq-side, .quote-side { padding-top: 40px; padding-bottom: 32px; }
  .faq-main, .quote-main-col { padding-top: 32px; padding-bottom: 48px; }
  .faq-nav a { padding: 16px 0 16px 12px; }
  .quote-form .chips { grid-template-columns: 1fr 1fr; }
  .about-row.reverse .about-copy { order: 0; }
  .icon-mini .icon-card { padding: 14px 0; }
  .overlay-quote p { font-size: 20px; padding: 24px; text-align: center; }
  .overlay-quote.right { justify-items: center; padding-right: 0; }
  .about-process .about-copy { padding: 0 0 8px; }
  .qr-block { padding-left: 0; border-top: 1px solid var(--line); padding-top: 16px; }
  .cn-tile-photo, .cn-tile.t4 .cn-tile-photo { order: -1; min-height: 220px; clip-path: none; }
  .cn-tile-copy, .cn-tile.t4 .cn-tile-copy { padding: 24px 20px 28px; }
  .cn-tile-text, .cn-tile.t3 .cn-tile-text { padding-left: 72px; }
  .cn-tile .ghost-num, .cn-tile.t3 .ghost-num { left: 12px; font-size: 72px; }
  .choose-card { padding: 16px 0; border-top: 1px solid var(--line); }
  .cn-qr-photo { background-position: 60% center; }
  .cn-prod-hero .hero-side-label.vertical { display: none; }
  .wish-grid { grid-template-columns: 1fr 1fr; }
  .stack-actions .btn { min-width: 0; width: 100%; }
}

/* CN long-scroll: cream still-life pages matching the 20260902 / 20260905 longs. */
.theme-cn .section { padding: 18px 0; }
.theme-cn .quality-band .icon-card p { font-size: 12px; line-height: 1.45; }
.theme-cn .quality-band { padding-top: 12px; padding-bottom: 16px; }
.theme-cn .about-copy { padding-top: 20px; padding-bottom: 20px; }
.theme-cn .verse { line-height: 1.7; margin: 0 0 10px; font-size: 13.5px; }
.theme-cn .about-photo { min-height: 200px; }
.theme-cn .icon-mini { margin-top: 14px; }
.theme-cn .icon-mini .icon-card p { font-size: 11.5px; }
.theme-cn .site-footer { padding: 16px 0 14px; }
.theme-cn .site-footer .footer-contact { gap: 6px; font-size: 12px; }
.theme-cn .site-header,
.theme-cn .site-header.is-solid,
.theme-cn .site-header.is-open {
  background: rgba(247, 243, 236, 0.96);
  border-bottom: 1px solid transparent;
  box-shadow: none;
}
.theme-cn .header-row { min-height: 56px; }
.theme-cn .header-cta { min-height: 36px; padding: 0 16px; font-size: 13px; }
.lang-pair { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; letter-spacing: 0.12em; margin-right: 8px; }
.lang-pair b { font-weight: 700; }
.lang-pair a { color: var(--muted); }

.footer-dark { background: #111; color: #f7f3ec; padding: 18px 0; }
.footer-dark a, .footer-dark .brand-word,
.theme-cn .footer-dark .brand-word,
.theme-cn .footer-dark a { color: #f7f3ec; }
.footer-line { background: var(--bg); padding: 22px 0; }
.footer-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  font-size: 12px;
}
.footer-dark .footer-bar { color: rgba(247, 243, 236, 0.78); }
.theme-cn .site-footer { padding: 28px 0 22px; }
.theme-cn .site-footer .footer-grid { gap: 18px; }
.theme-cn .site-footer .tiny { margin-top: 22px; font-size: 11.5px; }

.cn-hero, .cn-drop, .cn-life, .legal-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  background: var(--bg);
}
.cn-hero { min-height: 0; }
.cn-hero-copy, .cn-drop-copy, .cn-life-copy, .legal-hero-copy, .cn-prod-hero-copy {
  padding: 28px 6% 28px max(20px, calc((100vw - var(--wide)) / 2));
}
.cn-hero h1 { font-size: clamp(36px, 4.6vw, 64px); line-height: 1.12; }
.theme-cn .cn-hero .rule-short {
  display: block;
  width: 40px;
  height: 1px;
  margin: 18px 0 16px;
  background: rgba(31, 29, 26, 0.38);
}
.cn-hero .lead { font-size: clamp(16px, 1.4vw, 20px); line-height: 1.9; }
.cn-hero .hero-actions { margin-top: 36px; gap: 36px; }
.cn-hero-still, .cn-drop-art, .cn-life-still, .legal-hero-still,
.cn-prod-cap, .bridge-heart, .wide-mountain, .reverse-still, .cn-find-photo,
.story-hero-still, .story-photo {
  min-height: 200px;
  background: #f3eee6 center / cover no-repeat;
}
.cn-hero-still {
  min-height: 340px;
  background-size: contain;
  background-position: 78% center;
  background-repeat: no-repeat;
  background-color: #f7f3ec;
}
.cn-hero-still img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: right center;
}
.cn-drop { min-height: 0; background: var(--paper); }
.cn-drop h2 { font-size: clamp(24px, 2.6vw, 36px); }
.cn-stage-band { padding: 20px 0 10px; background: var(--bg); }
.cn-stage {
  position: relative;
  min-height: 0;
  display: grid;
  grid-template-columns: 1.12fr 1fr 1fr;
    grid-template-areas:
      "head s02 s04"
      "s01  s02 s04"
      "s01  s03 .";
  align-items: stretch;
  gap: 8px 12px;
  padding: 28px 5% 24px;
}
.cn-stage .collection-head { grid-area: head; }
.cn-stage .collection-all { grid-area: all; margin: 0; }
.cn-stage-rock,
.cn-stage-scene,
.cn-stage .pw-mark { display: none; }
.cn-stage-item { display: grid; align-items: end; gap: 10px; position: relative; z-index: 2; min-height: 0; }
.cn-stage-fig { margin: 0; min-width: 0; }
.cn-stage-item img { width: 100%; height: 100%; min-height: 180px; object-fit: contain; object-position: center bottom; }
.cn-stage-item.s01 { grid-area: s01; }
.cn-stage-item.s02 { grid-area: s02; }
.cn-stage-item.s03 { grid-area: s03; }
.cn-stage-item.s04 { grid-area: s04; }
.cn-stage .pw-num { font-family: var(--serif); font-size: 28px; margin: 0; }
.cn-stage h3 { font-size: 18px; margin: 2px 0; }
.cn-stage .pw-vol, .cn-stage .pw-link, .cn-stage .pw-soon { font-size: 13px; margin: 4px 0 0; }
.cn-icons { padding: 10px 0 36px; background: var(--paper); }
.cn-icons .feature-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.cn-icons .icon-card { padding: 0; }
.cn-life { min-height: 0; background: var(--bg); }
.cn-life h2 { font-size: clamp(24px, 2.6vw, 36px); }
.cn-quotes { position: relative; background: #f4f0ea; padding: 22px 6% 28px; overflow: hidden; }
.cn-quotes-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 55%;
  display: block;
  pointer-events: none;
  z-index: 0;
}
.cn-quotes .quotes-title,
.cn-quotes .quotes-layout { position: relative; z-index: 1; }
.cn-quotes .quotes-title { text-align: center; font-size: clamp(18px, 1.6vw, 24px); margin-bottom: 18px; font-weight: 500; }
.cn-quotes .quotes-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: center; max-width: var(--wide); margin: 0 auto; }
.cn-quotes .quote-feature { position: relative; padding-left: 0; }
.cn-quotes .quote-feature-text { font-size: clamp(22px, 2.4vw, 34px); padding-left: 0; }
.cn-buy {
  position: relative;
  overflow: hidden;
  background: #f4f2ef;
  padding: 28px 0 36px;
}
.cn-buy-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 58%;
  display: block;
  pointer-events: none;
  z-index: 0;
}
.cn-buy .qr-band { position: relative; z-index: 1; }
.theme-cn .qr-band { align-items: center; }

body.theme-cn:not(.has-hero-overlay) { padding-top: 56px; }

.cn-prod-mosaic {
  position: relative;
  background-color: #f4efe6;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding-top: 72px;
}
.cn-prod-mosaic .prod-ghost {
  position: absolute;
  top: 18px;
  left: 6%;
  margin: 0;
  font-family: var(--display);
  font-size: clamp(42px, 7vw, 92px);
  letter-spacing: 0.18em;
  color: rgba(22, 21, 19, 0.12);
  pointer-events: none;
  z-index: 0;
}
.cn-prod-mosaic .mosaic-band {
  position: relative;
  z-index: 1;
  background-color: transparent;
}
.cn-prod-hero { display: grid; grid-template-columns: 0.92fr 1.08fr; align-items: center; position: relative; background: var(--bg); min-height: 0; }
.cn-prod-hero h1 { font-size: clamp(32px, 4.8vw, 44px); line-height: 1.18; letter-spacing: -0.03em; margin: 0 0 14px; }
.cn-prod-hero .lead { font-size: clamp(13px, 1.45vw, 15px); line-height: 1.85; margin: 0 0 18px; }
.cn-prod-hero .hero-side-label.vertical { writing-mode: vertical-rl; position: absolute; right: 16px; top: 14%; letter-spacing: 0.32em; font-size: 10px; line-height: 1.7; color: var(--muted); }
.cn-prod-cap { min-height: 0; height: 100%; background-size: contain; background-position: 62% center; background-repeat: no-repeat; }
.cn-prod-bridge {
  display: grid;
  place-items: start center;
  background: var(--bg) center / cover no-repeat;
  min-height: 220px;
  padding: 40px 24px 28px;
  position: relative;
}
.cn-prod-watermark {
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(42px, 9vw, 92px);
  letter-spacing: 0.22em;
  font-weight: 500;
  color: rgba(28, 26, 22, 0.12);
  line-height: 1;
}
.cn-prod-pair, .cn-prod-reverse { display: grid; grid-template-columns: 1fr 1fr; background: var(--bg); align-items: center; min-height: 0; }
.cn-prod-wide { display: grid; grid-template-columns: 0.34fr 0.66fr; align-items: center; background: var(--bg); min-height: 0; position: relative; }
.cn-prod-copy { display: grid; gap: 6px; padding: 28px 7%; position: relative; color: inherit; }
.pp-card { display: grid; align-items: center; gap: 6px 10px; height: 100%; padding: 0 6%; color: inherit; text-decoration: none; }
.pp-01 { grid-template-columns: auto minmax(0, 1fr) auto; }
.pp-02 { grid-template-columns: minmax(0, 1fr) auto; }
.pp-03, .pp-04 { grid-template-columns: auto minmax(0, 1fr); padding: 0 4% 0 12%; }
.pp-meta { display: grid; gap: 2px; }
.pp-meta h3 { font-size: 16px; margin: 0; font-weight: 600; }
.pp-meta .vol, .pp-meta .slogan { margin: 0; font-size: 12.5px; }
.pp-meta .vol { color: var(--muted); }
.pp-meta .link-arrow { font-size: 12px; margin-top: 4px; }
.pp-card img { object-fit: contain; display: block; }
.pp-01 img { width: 72px; height: 122px; object-fit: contain; background: transparent; }
.pp-02 { align-items: end; padding-bottom: 6px; }
.pp-02 img { width: 168px; height: 132px; object-fit: contain; background: transparent; }
.pp-card .ghost-num, .wide-mountain .ghost-num {
  font-family: var(--serif); font-size: clamp(56px, 8vw, 88px); line-height: 0.85;
  color: rgba(22,21,19,.12); letter-spacing: -0.04em;
}
.wide-mountain .ghost-num.faint { position: absolute; right: 8%; top: 12%; color: rgba(255,255,255,.38); }
.cn-prod-wide .wide-barrel { width: auto; height: 78%; max-height: 230px; margin: 0 auto; object-fit: contain; }
.wide-mountain { min-height: 0; height: 100%; position: relative; background-size: cover; background-position: center; }
.reverse-still { min-height: 0; height: 100%; background-size: contain; background-position: center; }
a.wide-mountain,
a.reverse-still { display: block; color: inherit; }
.choose-band, .quality-band { background: var(--paper); }
.cn-find { display: grid; grid-template-columns: 0.42fr 0.58fr; align-items: center; background: var(--bg); min-height: 0; }
.cn-find-copy { display: flex; align-items: center; gap: 18px; padding: 0 8%; }
.cn-find-copy h2 { font-size: 18px; margin: 0 0 6px; }
.cn-find-copy .strong { margin: 0; font-size: 13px; }
.cn-find-copy .muted { margin: 4px 0 0; font-size: 12px; }
.cn-find .qr-square { width: 72px; height: 72px; margin: 0; flex: none; }
.cn-find-photo { min-height: 0; height: 100%; background-size: cover; background-position: center; }

.about-hero .about-copy { padding-top: 28px; }
.about-photo { min-height: 280px; }
.about-who-still {
  position: relative;
  min-height: 280px;
  align-self: stretch;
}
.about-who-still .about-photo {
  height: 100%;
  min-height: 280px;
}
.about-who-still::after { display: none; }
.about-who-quote {
  position: absolute;
  left: 8%;
  bottom: 14%;
  z-index: 1;
  margin: 0;
  max-width: 11em;
  color: #1c1a17;
  font-size: clamp(20px, 2.2vw, 30px);
  line-height: 1.4;
  font-weight: 500;
}
.about-why { display: flex; flex-direction: column; background: var(--paper); }
.about-why-head { text-align: center; padding: 36px 6% 0; flex: none; width: 100%; }
.about-why-head h2 { margin: 0 auto; font-size: clamp(22px, 2.6vw, 32px); text-align: center; }
.about-why > h2 { margin: 0; padding-top: 18px; font-size: clamp(20px, 2.4vw, 28px); }
.about-why-grid { display: grid; grid-template-columns: 0.42fr 0.58fr; align-items: stretch; flex: 1; }
.about-process-visual { display: grid; align-content: start; gap: 8px; padding: 12px 4% 12px 0; }
.process-photos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 18px; }
.process-photos .photo { min-height: 140px; border-radius: 8px; background-position: center 70%; }
.process-strip.five { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }

.story-hero { display: grid; grid-template-columns: 1fr 1fr; align-items: center; min-height: 0; background: var(--bg); }
.story-hero-copy, .story-copy { padding: 20px 6%; }
.story-hero h1, .story-copy h2 { font-size: clamp(28px, 3.4vw, 48px); letter-spacing: -0.03em; }
.story-cn { font-family: var(--serif); font-size: clamp(20px, 2vw, 28px); margin: 16px 0 18px; }
.story-num { font-family: var(--serif); font-size: 18px; letter-spacing: 0.12em; margin: 0 0 10px; color: var(--muted); }
.story-sub { font-family: var(--serif); font-size: clamp(20px, 2vw, 28px); margin: 0 0 18px; }
.story-split { display: grid; grid-template-columns: 1fr 1fr; align-items: center; background: var(--bg); }
.story-split.rtl .story-copy { order: 2; }
.story-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; padding: 40px 7%; background: var(--bg); align-items: start; }
.story-duo-col { min-width: 0; }
.story-duo-still {
  min-height: 150px;
  margin-top: 24px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.story-duo-still.plant { background-position: center; }
.story-07-still {
  min-height: 120px;
  margin-top: 20px;
  background: center / contain no-repeat;
}
.story-world { display: grid; grid-template-columns: 1fr 0.9fr 1fr; align-items: center; background: var(--bg); }
.story-world-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  padding: 8px 4% 56px;
  background: var(--bg);
}
.story-world-grid .photo {
  min-height: 0;
  aspect-ratio: 3 / 2;
  background-size: cover;
  background-position: center;
}
.story-close { text-align: center; padding: 48px 8% 56px; background: var(--bg); }
.story-close h2 { font-size: clamp(28px, 3.6vw, 52px); }
.story-close.has-still {
  position: relative;
  background-size: cover;
  background-position: center right;
  isolation: isolate;
}
.story-close.has-still::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(90deg, var(--bg) 0%, rgba(247, 243, 236, 0.9) 46%, rgba(247, 243, 236, 0.28) 100%);
}
.story-close.has-still > * { position: relative; z-index: 1; }

.legal-hero { min-height: 320px; }
.legal-hero h1 { font-size: clamp(36px, 4.6vw, 60px); }

@media (min-width: 901px) {
  .theme-cn .cn-hero,
  .theme-cn .cn-drop,
  .theme-cn .cn-life,
  .theme-cn .legal-hero,
  .theme-cn .cn-prod-pair,
  .theme-cn .cn-prod-reverse,
  .theme-cn .story-hero,
  .theme-cn .story-split,
  .theme-cn .story-duo,
  .theme-cn .about-row,
  .theme-cn .cn-quotes .quotes-layout { grid-template-columns: 1fr 1fr !important; }
  .theme-cn .cn-prod-bridge { grid-template-columns: none !important; }
  .theme-cn .cn-prod-wide { grid-template-columns: 0.34fr 0.66fr !important; }
  .theme-cn .cn-find { grid-template-columns: 0.42fr 0.58fr !important; }
  .theme-cn .story-world { grid-template-columns: 1fr 0.9fr 1fr !important; }
  .theme-cn .cn-icons .feature-row,
  .theme-cn .choose-grid,
  .theme-cn .cols-4,
  .theme-cn .icon-mini { grid-template-columns: repeat(4, 1fr) !important; }
  .theme-cn .process-photos { grid-template-columns: repeat(3, 1fr) !important; }
  .theme-cn .process-strip.five { grid-template-columns: repeat(5, 1fr) !important; }
  .theme-cn .about-contact-grid { grid-template-columns: 1.2fr 1fr 1fr !important; }
  .theme-cn .site-footer .footer-grid { grid-template-columns: 1.1fr 0.8fr 0.7fr 0.7fr 1fr !important; }
  .theme-cn .site-footer .footer-grid > :first-child { grid-column: auto !important; }
  .theme-cn .qr-band {
    grid-template-columns: 1.15fr auto 1fr !important;
    text-align: left !important;
    justify-items: stretch !important;
    width: min(var(--wide), calc(100% - 48px)) !important;
    margin: 0 auto !important;
    padding: 10px 0 !important;
    gap: 0 !important;
  }
  .theme-cn .qr-center { border: 0; border-left: 1px solid var(--line); border-right: 1px solid var(--line); }
  .theme-cn .qr-side { display: flex !important; justify-content: space-between; align-items: center; }
  .theme-cn .qr-side-copy { text-align: left !important; }
  .theme-cn .quote-cards { grid-template-columns: 1fr 1fr !important; }
  .theme-cn .cols-5,
  .theme-cn .quality-icons { grid-template-columns: repeat(5, 1fr) !important; }
  .theme-cn .icon-even .icon-card { border-bottom: 0 !important; padding: 0 8px !important; }
  .theme-cn .legal-grid { grid-template-columns: repeat(3, 1fr) !important; }
  .theme-cn .terms-row { grid-template-columns: auto 1fr 0.7fr !important; }
  .theme-cn .cn-stage {
    grid-template-columns: 1.12fr 1fr 1fr !important;
    grid-template-areas:
      "head s02 s04"
      "s01  s02 s04"
      "s01  s03 ." !important;
  }
  .theme-cn .about-copy,
  .theme-cn .about-row.reverse .about-copy { padding-top: 20px; padding-bottom: 20px; }
  .theme-cn .about-why-grid { grid-template-columns: 0.42fr 0.58fr !important; }
  .theme-cn .about-process { grid-template-columns: 0.42fr 0.58fr !important; }
  .theme-cn .cn-prod-hero { grid-template-columns: 0.92fr 1.08fr !important; }
}
@media (min-width: 641px) {
  .page-products .cn-prod-hero,
  .page-products .cn-prod-bridge,
  .page-products .cn-prod-pair,
  .page-products .cn-prod-wide,
  .page-products .cn-prod-reverse,
  .page-products .cn-find { height: auto; overflow: visible; }
  .page-products .cn-prod-hero { min-height: 360px; }
  .page-products .cn-prod-hero-copy { padding: 36px 6% 28px max(28px, calc((100vw - var(--wide)) / 2)); }
  .page-products .cn-prod-cap { min-height: 300px; background-size: cover; background-position: 72% 38%; }
  .page-products .cn-prod-bridge { min-height: 200px; background-size: cover; background-position: 88% center; }
  .page-products .cn-prod-pair { min-height: 260px; }
  .page-products .cn-prod-wide { min-height: 340px; }
  .page-products .wide-mountain { min-height: 280px; background-size: cover; background-position: center 62%; }
  .page-products .cn-prod-reverse { min-height: 260px; }
  .page-products .reverse-still { min-height: 240px; background-size: cover; background-position: center; }
  .page-products .cn-find { min-height: 200px; }
  .page-products .cn-find-photo { min-height: 180px; }
  .page-products .choose-band.section { padding: 40px 0 32px; }
  .page-products .choose-band h2 { font-size: 20px; margin: 0 0 8px; }
  .page-products .choose-band .rule { width: 28px; margin: 0 auto 18px; }
  .page-products .choose-grid { margin-top: 20px; }
  .page-products .choose-card { padding: 0 16px; }
  .page-products .choose-q { margin: 0 0 16px; font-size: 13px; font-weight: 600; }
  .page-products .choose-body { grid-template-columns: 1fr 80px; gap: 10px; }
  .page-products .choose-body h3 { font-size: 16px; margin: 2px 0; }
  .page-products .choose-body .muted { font-size: 12px; }
  .page-products .choose-thumb { width: 80px; height: 96px; object-fit: contain; }
  .page-products .quality-band.section {
    padding: 36px 0 32px;
    background-color: #f4f0ea;
    background-size: cover;
    background-position: center;
  }
  .page-products .quality-band h2 { font-size: 18px; margin: 0 0 8px; }
  .page-products .quality-band .rule { width: 28px; margin: 0 auto 18px; }
  .page-products .quality-icons { margin-top: 18px; }
  .page-products .quality-band .icon-card {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    gap: 8px;
    border: 0 !important;
    padding: 0 10px !important;
  }
  .page-products .quality-band .icon-svg { width: 26px; height: 26px; margin: 0; }
  .page-products .quality-band .icon-card h3 { font-size: 13px; margin: 0; font-weight: 600; }
  .page-products .quality-band .icon-card p { font-size: 11px; line-height: 1.45; }
  .page-products .footer-dark { padding: 12px 0; }
  .page-products .footer-dark .footer-bar { font-size: 11px; }
  .page-products .cn-prod-cap,
  .page-products .bridge-heart,
  .page-products .wide-mountain,
  .page-products .reverse-still,
  .page-products .cn-find-photo { min-height: 220px; }

  .page-about .about-row,
  .page-about .about-why,
  .page-about .about-contact { overflow: visible; }
  .page-about .about-hero,
  .page-about .about-who,
  .page-about .about-why,
  .page-about .about-source,
  .page-about .about-process,
  .page-about .about-idea,
  .page-about .about-team,
  .page-about .about-future,
  .page-about .about-contact.section { height: auto; }
  .page-about .about-hero { min-height: 284px; }
  .page-about .about-who { min-height: 220px; }
  .page-about .about-why { min-height: 240px; }
  .page-about .about-source { min-height: 240px; }
  .page-about .about-process { min-height: 220px; }
  .page-about .about-idea { min-height: 240px; }
  .page-about .about-team { min-height: 180px; }
  .page-about .about-future { min-height: 180px; }
  .page-about .about-contact.section { min-height: 220px; padding: 28px 0 24px; }
  .page-about .footer-line { padding: 14px 0; height: 63px; box-sizing: border-box; }
  .page-about .about-copy,
  .page-about .about-row.reverse .about-copy { padding: 16px 6% 16px 7%; }
  .page-about .about-copy h1 { font-size: 32px; margin: 0 0 4px; letter-spacing: -0.03em; }
  .page-about .about-sub { font-size: 18px; margin: 0; }
  .page-about .about-copy h2 { font-size: 20px; margin: 0; }
  .page-about .about-copy .rule { margin: 8px 0 10px; }
  .page-about .verse { font-size: 12px; line-height: 1.65; margin: 0 0 8px; }
  .page-about .sign { margin-top: 10px; font-size: 13px; }
  .page-about .about-photo { min-height: 220px; height: 100%; align-self: stretch; }
  .page-about .about-why-head { padding: 22px 6% 0; }
  .page-about .about-why-head h2,
  .page-about .about-why > h2 { font-size: 22px; padding-top: 0; text-align: center; }
  .page-about .about-why .rule.center { margin: 8px auto 14px; }
  .page-about .about-why-grid { height: auto; min-height: 200px; }
  .page-about .about-why .about-copy { padding: 8px 6% 8px 4%; }
  .page-about .icon-mini { margin-top: 8px; }
  .page-about .icon-mini .icon-card { gap: 2px; padding: 0 6px !important; }
  .page-about .icon-mini .icon-svg { width: 18px; height: 18px; }
  .page-about .icon-mini .icon-card h3 { font-size: 11px; margin: 0; }
  .page-about .icon-mini .icon-card p { font-size: 10px; line-height: 1.35; }
  .page-about .about-process .about-copy { align-self: start; padding-top: 22px; }
  .page-about .about-process-visual { padding: 22px 3% 16px 0; gap: 8px; height: auto; align-content: start; }
  .page-about .process-photos { margin-bottom: 0; gap: 8px; }
  .page-about .process-photos .photo { min-height: 120px; height: 120px; border-radius: 8px; }
  .page-about .process-strip { gap: 6px; margin-top: 0; }
  .page-about .proc-title { font-size: 11px; margin: 0 0 2px; }
  .page-about .about-process .process-strip .muted { font-size: 10px; line-height: 1.35; }
  .page-about .about-contact h2 { font-size: 18px; margin: 0; }
  .page-about .about-contact .rule { margin: 6px 0 0; }
  .page-about .about-contact-grid { margin-top: 10px; gap: 12px; align-items: start; }
  .page-about .contact-lines { gap: 5px; }
  .page-about .contact-lines li { font-size: 11px; gap: 8px; grid-template-columns: 16px auto 1fr; }
  .page-about .contact-lines .icon-svg { width: 14px; height: 14px; }
  .page-about .qr-square,
  .page-about .qr-block .qr-circle { width: 72px; height: 72px; }
  .page-about .qr-block { padding-left: 14px; gap: 10px; }
  .page-about .qr-block p { margin: 0 0 2px; font-size: 12px; }
  .page-about .caption-photo .tag { font-size: 10px; }

  .page-brand .story-hero,
  .page-brand .story-split,
  .page-brand .story-duo,
  .page-brand .story-world,
  .page-brand .story-close { height: auto; overflow: visible; }
  .page-brand .story-hero { min-height: 264px; }
  .page-brand .story-01,
  .page-brand .story-02,
  .page-brand .story-03 { min-height: 240px; }
  .page-brand .story-duo { min-height: 280px; padding: 22px 7%; gap: 24px; background-image: none; }
  .page-brand .story-duo-still,
  .page-brand .story-07-still { display: block; }
  .page-brand .story-duo-still {
    min-height: 140px;
    margin-top: 16px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
  }
  .page-brand .story-duo-still.plant { background-position: center; }
  .page-brand .story-07-still {
    min-height: 120px;
    margin-top: 16px;
    background: center / contain no-repeat;
  }
  .page-brand .story-world { min-height: 280px; }
  .page-brand .story-08 { min-height: 280px; }
  .page-brand .story-close { min-height: 183px; padding: 40px 8% 16px; }
  .page-brand .story-hero-copy,
  .page-brand .story-copy { padding: 16px 6%; }
  .page-brand .story-hero h1 { font-size: 20px; line-height: 1.2; margin: 0 0 8px; letter-spacing: -0.02em; }
  .page-brand .story-hero-copy { overflow: visible; max-width: 100%; }
  .page-brand .story-copy h2 { font-size: 17px; line-height: 1.2; margin: 0 0 6px; }
  .page-brand .story-cn { font-size: 16px; margin: 8px 0 10px; }
  .page-brand .story-num { font-size: 13px; margin: 0 0 6px; }
  .page-brand .story-sub { font-size: 14px; margin: 0 0 8px; }
  .page-brand .story-copy .muted,
  .page-brand .story-hero-copy .muted { font-size: 11.5px; line-height: 1.55; margin: 0 0 6px; }
  .page-brand .kicker { margin: 0 0 10px; font-size: 11px; }
  .page-brand .story-hero-still,
  .page-brand .story-photo { min-height: 200px; height: auto; }
  .page-brand .story-close h2 { font-size: 22px; margin: 0 0 8px; }
  .page-brand .story-close .story-cn { font-size: 16px; margin: 0 0 8px; }
  .page-brand .story-close .muted { font-size: 12px; line-height: 1.6; margin: 0 0 10px; }
  .page-brand .story-close .sign { margin-top: 8px; font-size: 12px; }

  /* Home long 参考图1.png is 864×1821. Lock bands so the cream scroll matches. */
  .page-home .cn-hero,
  .page-home .cn-drop,
  .page-home .cn-life,
  .page-home .cn-icons,
  .page-home .cn-quotes,
  .page-home .cn-buy,
  .page-home .site-footer { overflow: hidden; }
  .page-home .cn-stage-band { overflow: visible; }
  .page-home .cn-hero { height: calc(100dvh - 56px); min-height: 500px; max-height: 680px; }
  body.has-hero-overlay.page-home .cn-hero { height: 100dvh; max-height: none; }
  .theme-cn.page-home .cn-hero {
    height: 100dvh;
    max-height: none;
  }
  .page-home .cn-hero-copy { padding: 40px 6% 24px max(24px, calc((100vw - var(--wide)) / 2)); }
  .page-home .cn-hero .kicker { margin: 0 0 10px; font-size: 11px; }
  .page-home .cn-hero h1 { font-size: 36px; line-height: 1.14; margin: 0 0 10px; }
  .page-home .cn-hero .rule-short { margin: 16px 0 14px; }
  .page-home .cn-hero .lead { font-size: 15px; line-height: 1.7; margin: 0; }
  .page-home .cn-hero .hero-actions { margin-top: 28px; gap: 28px; }
  .page-home .cn-hero-still,
  .page-home .cn-drop-art,
  .page-home .cn-life-still {
    min-height: 0;
    height: 100%;
    background-size: cover;
    background-position: center;
  }
  .theme-cn.page-home .cn-hero-still {
    display: block;
    overflow: hidden;
    height: 100%;
    min-height: 0;
    box-sizing: border-box;
    padding: 0;
    background: #f7f3ec;
    background-image: none;
  }
  .theme-cn.page-home .cn-hero-still img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: cover;
    object-position: 92% 60%;
  }
  .theme-cn.page-home .cn-drop {
    height: 380px;
    background: #f7f3ec;
    align-items: stretch;
  }
  .theme-cn.page-home .cn-drop-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 16px 8% 28px max(32px, calc((100vw - var(--wide)) / 2));
  }
  .theme-cn.page-home .cn-drop h2 {
    font-size: 26px;
    line-height: 1.18;
    margin: 0 0 12px;
    font-weight: 600;
  }
  .theme-cn.page-home .cn-drop .muted {
    font-size: 13px;
    line-height: 1.7;
    margin: 0 0 12px;
    max-width: 22em;
  }
  .theme-cn.page-home .cn-drop .tag {
    font-size: 11px;
    line-height: 1.55;
    letter-spacing: 0.12em;
    margin: 0;
  }
  .theme-cn.page-home .cn-drop-art {
    position: relative;
    overflow: hidden;
    background: #f6f2ea;
  }
  .theme-cn.page-home .cn-drop-art img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 58%;
    display: block;
  }
  .theme-cn.page-home .cn-stage-band.section {
    position: relative;
    height: auto;
    padding: 0;
  }
  .theme-cn.page-home .cn-stage {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto !important;
    min-height: 0;
    aspect-ratio: auto;
    display: grid !important;
    grid-template-columns: 1.12fr 1fr 1fr !important;
    grid-template-rows: auto minmax(200px, 0.92fr) minmax(300px, 1.25fr);
    grid-template-areas:
      "head s02 s04"
      "s01  s02 s04"
      "s01  s03 ." !important;
    gap: 24px 36px;
    padding: 24px 4.5% 28px;
    background: var(--bg);
    overflow: visible;
  }
  .theme-cn.page-home .cn-stage .collection-head {
    grid-area: head;
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    z-index: 4;
    margin: 0;
    display: block;
    padding: 12px 8px 0 4px;
    background: transparent !important;
  }
  .theme-cn.page-home .cn-stage .collection-all {
    position: absolute;
    top: 20px;
    right: 4.5%;
    z-index: 5;
    margin: 0;
  }
  .theme-cn.page-home .cn-stage .kicker { font-size: 11px; margin: 0 0 4px; }
  .theme-cn.page-home .cn-stage h2 { font-size: 22px; margin: 0; }
  .theme-cn.page-home .cn-stage .lead { font-size: 12px; margin: 4px 0 0; line-height: 1.5; max-width: 14em; }
  .theme-cn.page-home .cn-stage .link-arrow { font-size: 13px; }
  .theme-cn.page-home .cn-stage-item {
    position: relative !important;
    display: block !important;
    left: auto;
    top: auto;
    right: auto;
    bottom: auto;
    width: auto;
    height: auto;
    min-height: 0;
    overflow: visible;
  }
  .theme-cn.page-home .cn-stage-scene,
  .theme-cn.page-home .cn-stage .pw-mark,
  .theme-cn.page-home .cn-stage-rock,
  .theme-cn.page-home .cn-stage::after { display: none !important; }
  .theme-cn.page-home .cn-stage-item img {
    display: block !important;
    width: 100%;
    height: 100%;
    min-height: 0;
    object-fit: contain;
    object-position: center bottom;
  }
  .theme-cn.page-home .cn-stage-item.s01 img { object-position: 58% 70%; }
  .theme-cn.page-home .cn-stage-item.s02 img { object-position: 52% 40%; }
  .theme-cn.page-home .cn-stage-item.s03 img { object-position: 48% 55%; }
  .theme-cn.page-home .cn-stage-item.s04 img { object-position: 58% 22%; }
  .theme-cn.page-home .cn-stage-meta {
    position: absolute;
    z-index: 3;
    background: transparent !important;
    box-shadow: none;
    width: auto;
    max-width: 42%;
  }
  .theme-cn.page-home .cn-stage-meta * { background: transparent !important; }
  .theme-cn.page-home .cn-stage .collection-head * { background: transparent !important; }
  .theme-cn.page-home .cn-stage-item.s01 .cn-stage-meta { left: 4%; top: 38%; }
  .theme-cn.page-home .cn-stage-item.s02 .cn-stage-meta { left: 4%; top: 6%; }
  .theme-cn.page-home .cn-stage-item.s03 .cn-stage-meta { left: 3%; top: 8%; }
  .theme-cn.page-home .cn-stage-item.s04 .cn-stage-meta { left: 2%; top: 8%; }
  .theme-cn.page-home .cn-stage-item.s01 h3,
  .theme-cn.page-home .cn-stage-item.s03 h3 { white-space: nowrap; }
  .theme-cn.page-home .cn-stage .pw-num {
    font-size: 20px;
    margin: 0;
    color: rgba(22, 21, 19, 0.38);
  }
  .theme-cn.page-home .cn-stage-meta h3 {
    font-size: 15px;
    margin: 0;
    line-height: 1.2;
    font-weight: 600;
    color: rgba(22, 21, 19, 0.78);
  }
  .theme-cn.page-home .cn-stage .pw-vol,
  .theme-cn.page-home .cn-stage .pw-link,
  .theme-cn.page-home .cn-stage .pw-soon,
  .theme-cn.page-home .cn-stage .pw-soon em {
    font-size: 12px;
    margin: 2px 0 0;
    color: rgba(22, 21, 19, 0.52);
  }
  .page-home .cn-icons.section { height: auto; padding: 22px 0 28px; }
  .page-home .cn-icons .feature-row { gap: 12px; }
  .page-home .cn-icons .icon-svg { width: 20px; height: 20px; margin-top: 0; }
  .page-home .cn-icons .icon-card { column-gap: 10px; }
  .page-home .cn-icons .icon-card h3 { font-size: 12px; margin: 0 0 2px; }
  .page-home .cn-icons .icon-card p { font-size: 11px; line-height: 1.4; }
  .theme-cn.page-home .cn-life {
    position: relative;
    display: block !important;
    grid-template-columns: none !important;
    height: 260px;
    overflow: hidden;
    background: #f3eee6;
  }
  .theme-cn.page-home .cn-life-photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 78% 62%;
    display: block;
  }
  .theme-cn.page-home .cn-life-copy {
    position: relative;
    z-index: 2;
    max-width: 46%;
    padding: 20px 4% 16px max(32px, calc((100vw - var(--wide)) / 2));
  }
  .theme-cn.page-home .cn-life h2 {
    font-size: 23px;
    line-height: 1.22;
    margin: 0 0 10px;
    font-weight: 600;
    white-space: normal;
  }
  .theme-cn.page-home .cn-life h2 br { display: block; }
  .theme-cn.page-home .cn-life p {
    font-size: 13px;
    line-height: 1.65;
    margin: 8px 0 0;
  }
  .theme-cn.page-home .cn-life .link-arrow { font-size: 13px; }
  .theme-cn.page-home .cn-quotes {
    position: relative;
    display: block !important;
    height: auto;
    min-height: 240px;
    padding: 28px 5% 36px;
    background: #f4f0ea;
    overflow: hidden;
  }
  .theme-cn.page-home .cn-quotes-photo {
    object-fit: cover;
    object-position: 48% 78%;
  }
  .theme-cn.page-home .cn-quotes .quotes-title {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    z-index: 1;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.02em;
    margin: 0 0 22px;
  }
  .theme-cn.page-home .cn-quotes .quotes-layout {
    position: relative;
    inset: auto;
    z-index: 1;
    display: grid !important;
    grid-template-columns: minmax(200px, 0.85fr) minmax(260px, 1.25fr) !important;
    gap: 20px 36px;
    align-items: center;
    padding: 0 2% 0 8% !important;
    margin: 0 auto;
    height: auto;
    max-width: var(--wide);
    width: 100%;
  }
  .theme-cn.page-home .cn-quotes .quote-feature {
    position: relative;
    left: auto;
    top: auto;
    width: auto;
    margin: 0 !important;
    padding-left: 36px !important;
  }
  .theme-cn.page-home .cn-quotes .quote-feature::before {
    left: 0;
    top: -6px;
    font-size: 36px;
    color: rgba(22, 21, 19, 0.28);
  }
  .theme-cn.page-home .cn-quotes .quote-feature-text {
    font-size: clamp(22px, 2.4vw, 30px);
    line-height: 1.3;
    padding-left: 0 !important;
    margin: 0;
    font-weight: 600;
  }
  .theme-cn.page-home .cn-quotes .quote-feature footer {
    font-size: 12px;
    margin-top: 14px;
    padding-left: 0 !important;
  }
  .theme-cn.page-home .cn-quotes .quote-feature footer::after {
    font-size: 28px;
    margin-left: 10px;
    vertical-align: -8px;
    color: rgba(22, 21, 19, 0.28);
  }
  .theme-cn.page-home .quote-cards {
    position: relative;
    left: auto;
    top: auto;
    width: auto;
    height: auto;
    display: grid;
    grid-template-columns: 1fr 1fr !important;
    margin: 0;
    gap: 18px 28px;
    align-content: start;
  }
  .theme-cn.page-home .quote-mini {
    background: transparent;
    padding: 4px 22px 12px 22px;
    min-width: 0;
  }
  .theme-cn.page-home .quote-mini p { font-size: 13px; line-height: 1.5; }
  .theme-cn.page-home .quote-mini footer {
    font-size: 11px;
    margin-top: 8px;
    padding-right: 18px;
    text-align: right;
  }
  .theme-cn.page-home .quote-mini::before {
    left: 0;
    top: -2px;
    font-size: 22px;
    color: rgba(22, 21, 19, 0.28);
  }
  .theme-cn.page-home .quote-mini::after {
    right: 0;
    bottom: 0;
    font-size: 22px;
    color: rgba(22, 21, 19, 0.28);
  }
  .page-home .cn-buy.section {
    height: auto;
    min-height: 220px;
    padding: 36px 0;
    background: #eef2f4;
  }
  .page-home .cn-buy-photo {
    object-fit: cover;
    object-position: 50% 72%;
    opacity: 0.92;
    filter: contrast(1.12) saturate(0.85);
  }
  .page-home .cn-buy .qr-center {
    border: 0 !important;
  }
  .page-home .qr-band {
    padding: 12px 0 !important;
    width: min(var(--wide), calc(100% - 40px)) !important;
  }
  .page-home .qr-band h2 { font-size: 18px; white-space: nowrap; }
  .page-home .qr-band > :first-child .muted { margin: 4px 0 0; font-size: 12px; }
  .page-home .qr-band > * { padding: 0 18px; }
  .page-home .qr-band img,
  .page-home .qr-circle {
    width: 84px;
    height: 84px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 8px #fff;
  }
  .page-home .qr-side { gap: 22px; justify-content: flex-start; }
  .page-home .qr-side-copy p:first-child { font-size: 14px; }
  .page-home .qr-side-copy .muted { margin-top: 4px; font-size: 12px; }
  .page-home .qr-side-cta .btn { min-height: 32px; padding: 0 16px; font-size: 13px; }
  .page-home .site-footer { height: auto; padding: 20px 0 14px; }
  .page-home .site-footer .footer-grid { gap: 10px; }
  .page-home .site-footer .footer-head { font-size: 11px; margin: 0 0 6px; }
  .page-home .site-footer .footer-links { gap: 3px; font-size: 11px; }
  .page-home .site-footer .brand-word { font-size: 16px; }
  .page-home .site-footer .tiny { margin-top: 10px; font-size: 11px; }
  .page-home .site-footer .footer-contact { gap: 3px; font-size: 11px; }
  .page-home .site-footer .social-row { margin-top: 8px; }
}
@media (min-width: 1101px) {
  .page-home .cn-hero { height: 100dvh; min-height: 620px; max-height: none; }
  .page-home .cn-hero h1 { font-size: clamp(40px, 4.2vw, 64px); }
  .page-home .cn-hero .lead { font-size: 18px; }
  .theme-cn.page-home .cn-drop { height: 460px; }
  .theme-cn.page-home .cn-drop h2 { font-size: 34px; }
  .theme-cn.page-home .cn-drop .muted { font-size: 15px; }
  .theme-cn.page-home .cn-drop .tag { font-size: 12px; }
  .theme-cn.page-home .cn-stage-band.section { padding: 0; }
  .theme-cn.page-home .cn-stage {
    height: auto !important;
    min-height: 620px;
    aspect-ratio: auto;
    padding: 32px 5% 40px;
  }
  .theme-cn.page-home .cn-stage h2 { font-size: 32px; }
  .theme-cn.page-home .cn-stage .lead { font-size: 14px; max-width: 15em; }
  .theme-cn.page-home .cn-stage .pw-num { font-size: 24px; color: rgba(22, 21, 19, 0.4); }
  .theme-cn.page-home .cn-stage-meta h3 { font-size: 17px; color: rgba(22, 21, 19, 0.82); }
  .theme-cn.page-home .cn-stage .pw-vol,
  .theme-cn.page-home .cn-stage .pw-link,
  .theme-cn.page-home .cn-stage .pw-soon,
  .theme-cn.page-home .cn-stage .pw-soon em { font-size: 13px; color: rgba(22, 21, 19, 0.55); }
  .theme-cn.page-home .cn-stage-item img { min-height: 0; }
  .page-home .cn-icons.section { height: auto; padding: 28px 0 36px; }
  .page-home .cn-icons .icon-svg { width: 28px; height: 28px; }
  .page-home .cn-icons .icon-card h3 { font-size: 15px; }
  .page-home .cn-icons .icon-card p { font-size: 13px; }
  .theme-cn.page-home .cn-life { height: 420px; }
  .theme-cn.page-home .cn-life-copy { max-width: 40%; }
  .theme-cn.page-home .cn-life h2 { font-size: 32px; white-space: normal; }
  .theme-cn.page-home .cn-life p { font-size: 16px; }
  .theme-cn.page-home .cn-quotes {
    height: auto;
    min-height: 300px;
    padding: 40px 6% 48px;
  }
  .theme-cn.page-home .cn-quotes-photo { object-position: 50% 74%; }
  .theme-cn.page-home .cn-quotes .quotes-title {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    font-size: 20px;
    margin: 0 0 28px;
    letter-spacing: 0.02em;
  }
  .theme-cn.page-home .cn-quotes .quotes-layout {
    position: relative;
    inset: auto;
    display: grid !important;
    grid-template-columns: minmax(260px, 0.8fr) minmax(380px, 1.2fr) !important;
    width: 100%;
    margin: 0 auto;
    padding: 0 2% 0 10% !important;
    max-width: var(--wide);
    height: auto;
    gap: 28px 56px;
  }
  .theme-cn.page-home .cn-quotes .quote-feature {
    position: relative;
    left: auto;
    top: auto;
    width: auto;
    padding-left: 48px !important;
  }
  .theme-cn.page-home .quote-cards {
    position: relative;
    left: auto;
    top: auto;
    width: auto;
    height: auto;
    gap: 22px 48px;
  }
  .theme-cn.page-home .cn-quotes .quote-feature-text { font-size: clamp(28px, 2.4vw, 34px); line-height: 1.28; }
  .theme-cn.page-home .cn-quotes .quote-feature::before { font-size: 48px; top: -10px; }
  .theme-cn.page-home .cn-quotes .quote-feature footer { font-size: 14px; margin-top: 18px; }
  .theme-cn.page-home .cn-quotes .quote-feature footer::after { font-size: 36px; }
  .theme-cn.page-home .quote-mini { padding: 6px 28px 16px 26px; }
  .theme-cn.page-home .quote-mini p { font-size: 16px; line-height: 1.55; }
  .theme-cn.page-home .quote-mini footer { font-size: 13px; margin-top: 10px; padding-right: 22px; }
  .theme-cn.page-home .quote-mini::before,
  .theme-cn.page-home .quote-mini::after { font-size: 26px; }
  .page-home .cn-buy.section {
    height: auto;
    min-height: 280px;
    padding: 48px 0;
    background: #eef2f4;
  }
  .page-home .cn-buy-photo { object-position: 50% 70%; }
  .page-home .cn-buy .qr-center { border: 0 !important; }
  .page-home .qr-band {
    width: min(1100px, calc(100% - 80px)) !important;
    grid-template-columns: 1.1fr auto 1.15fr !important;
  }
  .page-home .qr-side {
    justify-content: flex-start !important;
    gap: 48px;
  }
  .page-home .qr-band img,
  .page-home .qr-circle {
    width: 108px;
    height: 108px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 10px #fff;
  }
  .page-home .qr-band h2 { font-size: 24px; }
  .page-home .site-footer { height: auto; padding: 36px 0 24px; }
  .page-home .site-footer .footer-head { font-size: 13px; }
  .page-home .site-footer .footer-links { font-size: 13px; }
  .page-home .site-footer .footer-contact { font-size: 13px; }
  .page-products .cn-prod-hero { height: auto; min-height: 480px; }
  .page-products .cn-prod-cap { min-height: 420px; background-size: cover; background-position: 70% 36%; }
  .page-products .cn-prod-bridge { height: auto; min-height: 260px; background-size: cover; background-position: 86% center; }
  .page-products .cn-prod-pair { height: auto; min-height: 360px; }
  .page-products .cn-prod-wide { height: auto; min-height: 460px; }
  .page-products .wide-mountain { min-height: 460px; background-size: cover; background-position: center 58%; }
  .page-products .cn-prod-reverse { height: auto; min-height: 360px; }
  .page-products .reverse-still { min-height: 360px; background-size: cover; background-position: center; }
  .page-products .pp-meta h3 { font-size: 22px; }
  .page-products .pp-meta .vol,
  .page-products .pp-meta .slogan { font-size: 14px; }
  .page-products .pp-01 img { width: 300px; height: 440px; object-fit: contain; }
  .page-products .pp-02 img { width: 420px; height: 320px; object-fit: contain; }
  .page-products .choose-band.section { padding: 64px 0 48px; }
  .page-products .choose-band h2 { font-size: 28px; }
  .page-products .choose-q { font-size: 16px; margin-bottom: 22px; }
  .page-products .choose-body { grid-template-columns: 1fr 110px; }
  .page-products .choose-body h3 { font-size: 20px; }
  .page-products .choose-thumb { width: 110px; height: 132px; }
  .page-products .quality-band.section { padding: 56px 0 48px; }
  .page-products .quality-band h2 { font-size: 24px; }
  .page-products .quality-icons { margin-top: 28px; }
  .page-products .quality-band .icon-svg { width: 32px; height: 32px; }
  .page-products .quality-band .icon-card h3 { font-size: 16px; }
  .page-products .quality-band .icon-card p { font-size: 13px; line-height: 1.55; }
  .page-products .cn-find { height: auto; min-height: 280px; }
  .page-products .cn-find-copy { padding: 40px 8%; gap: 24px; }
  .page-products .cn-find-copy h2 { font-size: 28px; }
  .page-products .cn-find-copy .strong { font-size: 16px; }
  .page-products .cn-find .qr-square { width: 96px; height: 96px; flex: none; }
  .page-products .cn-find-photo { min-height: 280px; }

  .page-brand .story-hero,
  .page-brand .story-split,
  .page-brand .story-duo,
  .page-brand .story-world,
  .page-brand .story-close {
    height: auto;
    overflow: visible;
  }
  .page-brand .story-hero { min-height: 480px; }
  .page-brand .story-01,
  .page-brand .story-02,
  .page-brand .story-03 { min-height: 380px; }
  .page-brand .story-duo {
    min-height: 420px;
    padding: 56px 8% 40px;
    gap: 72px;
    align-items: start;
    background: var(--bg);
  }
  .page-brand .story-duo-still {
    display: block;
    min-height: 260px;
    margin-top: 28px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
  }
  .page-brand .story-duo-still.plant {
    min-height: 280px;
    background-position: center;
  }
  .page-brand .story-world { min-height: 420px; }
  .page-brand .story-08 { min-height: 440px; }
  .page-brand .story-close { min-height: 260px; padding: 80px 8% 72px; }
  .page-brand .story-hero-copy,
  .page-brand .story-copy { padding: 40px 8%; overflow: visible; }
  .page-brand .story-hero-still,
  .page-brand .story-photo {
    min-height: 380px;
    height: auto;
    background-size: cover;
    background-position: center;
  }
  .page-brand .story-world .story-photo { background-position: center 62%; }
  .page-brand .story-hero h1 {
    font-size: clamp(32px, 3.2vw, 42px);
    line-height: 1.15;
    margin: 0 0 16px;
  }
  .page-brand .story-copy h2 {
    font-size: clamp(22px, 2.2vw, 30px);
    line-height: 1.22;
    margin: 0 0 12px;
  }
  .page-brand .story-cn,
  .page-brand .story-sub { font-size: 22px; margin: 0 0 16px; }
  .page-brand .story-num { font-size: 15px; margin: 0 0 10px; }
  .page-brand .story-copy .muted,
  .page-brand .story-hero-copy .muted { font-size: 14.5px; line-height: 1.75; margin: 0 0 10px; }
  .page-brand .kicker { margin: 0 0 14px; font-size: 12px; }
  .page-brand .story-close h2 { font-size: clamp(28px, 3.4vw, 44px); margin: 0 0 14px; }
  .page-brand .story-close .story-cn { font-size: 22px; margin: 0 0 12px; }
  .page-brand .story-close .muted { font-size: 15px; line-height: 1.7; }
  .page-brand .story-close .sign { margin-top: 16px; font-size: 14px; }
  .page-brand .story-07-still {
    display: block;
    min-height: 190px;
    margin-top: 20px;
    background: center / contain no-repeat;
  }
  .page-brand .story-world .story-copy h2 { font-size: clamp(20px, 1.8vw, 26px); }

  .page-about .about-hero,
  .page-about .about-who,
  .page-about .about-why,
  .page-about .about-source,
  .page-about .about-process,
  .page-about .about-idea,
  .page-about .about-team,
  .page-about .about-future,
  .page-about .about-contact.section {
    height: auto;
    overflow: visible;
  }
  .page-about .about-hero { min-height: 480px; }
  .page-about .about-who { min-height: 360px; }
  .page-about .about-who-still,
  .page-about .about-who-still .about-photo { min-height: 360px; height: 100%; }
  .page-about .about-why { min-height: 420px; padding-bottom: 28px; }
  .page-about .about-source { min-height: 400px; }
  .page-about .about-process { min-height: 380px; }
  .page-about .about-idea { min-height: 400px; }
  .page-about .about-team { min-height: 300px; }
  .page-about .about-future { min-height: 300px; }
  .page-about .about-contact.section { min-height: 260px; padding: 48px 0 40px; }
  .page-about .footer-line { height: auto; padding: 18px 0; }
  .page-about .about-copy,
  .page-about .about-row.reverse .about-copy { padding: 40px 7%; }
  .page-about .about-photo {
    min-height: 320px;
    height: auto;
    background-size: cover;
    background-position: center;
  }
  .page-about .about-hero .about-photo {
    background-position: 78% 42%;
  }
  .page-about .about-copy h1 {
    font-size: clamp(36px, 4vw, 52px);
    margin: 0 0 8px;
    letter-spacing: -0.03em;
  }
  .page-about .about-sub { font-size: 24px; margin: 0; }
  .page-about .about-copy h2 { font-size: clamp(24px, 2.4vw, 32px); margin: 0; }
  .page-about .about-copy .rule { margin: 14px 0 18px; }
  .page-about .verse { font-size: 15px; line-height: 1.9; margin: 0 0 14px; }
  .page-about .sign { margin-top: 20px; font-size: 15px; }
  .page-about .about-why-head { padding: 48px 6% 0; }
  .page-about .about-why-head h2,
  .page-about .about-why > h2 { font-size: 32px; padding-top: 0; text-align: center; }
  .page-about .about-why .rule.center { margin: 10px auto 28px; }
  .page-about .about-why-grid { height: auto; min-height: 320px; }
  .page-about .about-contact-grid { align-items: start; }
  .page-about .about-why .about-copy { padding: 8px 7% 32px 5%; }
  .page-about .about-why .about-photo { min-height: 320px; }
  .page-about .icon-mini { margin-top: 24px; }
  .page-about .icon-mini .icon-card { gap: 8px; padding: 0 10px !important; }
  .page-about .icon-mini .icon-svg { width: 28px; height: 28px; }
  .page-about .icon-mini .icon-card h3 { font-size: 14px; margin: 0; }
  .page-about .icon-mini .icon-card p { font-size: 12.5px; line-height: 1.5; }
  .page-about .about-process .about-copy { align-self: start; padding-top: 40px; }
  .page-about .about-process-visual { padding: 40px 4% 28px 0; gap: 14px; height: auto; align-content: start; }
  .page-about .process-photos { margin-bottom: 8px; gap: 10px; }
  .page-about .process-photos .photo { min-height: 160px; height: 180px; border-radius: 8px; }
  .page-about .process-strip { gap: 12px; margin-top: 8px; }
  .page-about .proc-title { font-size: 14px; margin: 0 0 4px; }
  .page-about .about-process .process-strip .muted { font-size: 12.5px; line-height: 1.5; }
  .page-about .about-contact h2 { font-size: 28px; margin: 0; }
  .page-about .about-contact .rule { margin: 12px 0 0; }
  .page-about .about-contact-grid { margin-top: 28px; gap: 28px; }
  .page-about .contact-lines { gap: 14px; }
  .page-about .contact-lines li { font-size: 14px; gap: 10px; grid-template-columns: 22px auto 1fr; }
  .page-about .contact-lines .icon-svg { width: 18px; height: 18px; }
  .page-about .qr-square,
  .page-about .qr-block .qr-circle { width: 100px; height: 100px; }
  .page-about .qr-block { padding-left: 24px; gap: 16px; }
  .page-about .qr-block p { margin: 0 0 6px; font-size: 14px; }
  .page-about .caption-photo .tag { font-size: 12px; }
  .page-about .about-idea .about-photo { background-position: center 40%; }
}
@media (max-width: 640px) {
  .cn-hero, .cn-drop, .cn-life, .legal-hero, .cn-prod-hero, .cn-prod-bridge,
  .cn-prod-pair, .cn-prod-reverse, .cn-prod-wide, .cn-find, .story-hero,
  .story-split, .story-duo, .story-world, .cn-quotes .quotes-layout, .cn-stage,
  .process-photos, .process-strip.five, .cn-icons .feature-row, .about-why-grid { grid-template-columns: 1fr; grid-template-areas: none; }
  .cn-stage { min-height: 0; }
  .cn-stage-item.s02 { grid-template-columns: 1fr; }
  .footer-bar { flex-direction: column; align-items: flex-start; }
  .cn-prod-hero .hero-side-label.vertical { display: none; }
  .story-split.rtl .story-copy { order: 0; }
  .pp-01, .pp-02, .pp-03, .pp-04 { padding: 20px 7%; }
  .page-products .cn-prod-hero,
  .page-products .cn-prod-bridge,
  .page-products .cn-prod-pair,
  .page-products .cn-prod-wide,
  .page-products .cn-prod-reverse,
  .page-products .cn-find { height: auto; }
  .page-products .cn-prod-cap { min-height: 240px; }
  .page-products .cn-find-copy { padding: 28px 7%; }
  .page-products .cn-find-photo { min-height: 180px; }
  .page-about .about-hero,
  .page-about .about-who,
  .page-about .about-why,
  .page-about .about-source,
  .page-about .about-process,
  .page-about .about-idea,
  .page-about .about-team,
  .page-about .about-future,
  .page-about .about-contact.section { height: auto; overflow: visible; padding: 36px 0 28px; }
  .page-about .about-photo { min-height: 200px; }
  .page-about .about-why-head { padding: 8px 7% 0; }
  .page-about .about-why-head h2,
  .page-about .about-why > h2 { padding-top: 0; }
  .page-about .about-why .rule.center { margin: 8px auto 18px; }
  .page-about .about-why-grid { height: auto; }
  .page-about .process-photos .photo { min-height: 120px; height: 140px; }
  .page-about .about-process-visual { padding: 0 7% 28px; height: auto; }
  .page-about .about-contact-grid { margin-top: 22px; }
  .page-about .qr-square,
  .page-about .qr-block .qr-circle { width: 88px; height: 88px; }
  .page-brand .story-hero,
  .page-brand .story-split,
  .page-brand .story-duo,
  .page-brand .story-world,
  .page-brand .story-close { height: auto; overflow: visible; }
  .page-brand .story-hero-still,
  .page-brand .story-photo { min-height: 220px; }
  .page-brand .story-duo { padding: 36px 7% 28px; gap: 28px; }
  .page-brand .story-duo-still {
    display: block;
    min-height: 140px;
    margin-top: 20px;
    background: center / cover no-repeat;
  }
  .page-brand .story-07-still {
    display: block;
    min-height: 120px;
    margin-top: 16px;
  }
  .page-home .cn-hero,
  .page-home .cn-drop,
  .page-home .cn-life,
  .page-home .cn-stage-band.section,
  .page-home .cn-icons.section,
  .page-home .cn-quotes,
  .page-home .cn-buy.section {
    height: auto;
    min-height: 280px;
    overflow: hidden;
    padding: 28px 0 36px;
  }
  .page-home .site-footer { height: auto; overflow: visible; }
  .page-home .cn-hero-still,
  .page-home .cn-drop-art,
  .page-home .cn-life-still { min-height: 220px; }
  .page-home .cn-hero-still {
    min-height: 260px;
    height: 58svh;
    display: block;
    box-sizing: border-box;
    padding: 20px 16px 28px;
    background: #f7f3ec;
  }
  .page-home .cn-hero-still img {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: center bottom;
  }
  .page-home .cn-life {
    display: block !important;
    min-height: 280px;
    position: relative;
  }
  .page-home .cn-life-photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 78% 62%;
  }
  .page-home .cn-life-copy { max-width: 78%; padding: 28px 7%; }
  .page-home .cn-life h2 { white-space: normal; font-size: 26px; }
  .page-home .cn-quotes {
    position: relative;
    min-height: 520px;
    overflow: hidden;
    padding: 28px 7% 36px;
  }
  .page-home .cn-quotes .quotes-title {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
  }
  .page-home .cn-quotes .quotes-layout {
    position: relative;
    inset: auto;
    display: grid !important;
    grid-template-columns: 1fr !important;
    padding: 0 !important;
    height: auto;
    gap: 22px;
  }
  .page-home .cn-quotes .quote-feature {
    position: relative;
    left: auto;
    top: auto;
    width: auto;
    padding-left: 40px !important;
  }
  .page-home .quote-cards {
    position: relative;
    left: auto;
    top: auto;
    width: auto;
    height: auto;
    grid-template-columns: 1fr !important;
  }
  .page-home .cn-drop-art img {
    width: 100%;
    height: 200px;
    object-fit: contain;
    object-position: center 60%;
    display: block;
  }
  .page-home .cn-stage {
    position: relative;
    height: auto !important;
    min-height: 0;
    inset: auto;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-areas: none !important;
    gap: 22px;
    aspect-ratio: auto;
    background-image: none !important;
    padding: 12px 6% 28px;
  }
  .page-home .cn-stage .pw-mark,
  .page-home .cn-stage-rock,
  .page-home .cn-stage-scene { display: none !important; }
  .page-home .cn-stage::after { display: none; }
  .page-home .cn-stage .collection-head,
  .page-home .cn-stage .collection-all {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    display: block;
    margin: 0 0 8px;
  }
  .page-home .cn-stage .collection-all { margin: 0 0 16px; }
  .page-home .cn-stage-item,
  .page-home .cn-stage-item.s01,
  .page-home .cn-stage-item.s02,
  .page-home .cn-stage-item.s03,
  .page-home .cn-stage-item.s04 {
    position: relative;
    left: auto;
    top: auto;
    right: auto;
    bottom: auto;
    display: grid !important;
    grid-area: auto !important;
    grid-template-columns: minmax(0, 1fr) 168px;
    align-items: center;
    gap: 16px;
    margin: 0;
    width: auto;
    height: auto;
  }
  .page-home .cn-stage-item img,
  .page-home .cn-stage-meta {
    position: relative !important;
    left: auto;
    top: auto;
    right: auto;
    bottom: auto;
    width: auto;
    height: auto;
    z-index: auto;
  }
  .page-home .cn-stage-item img {
    display: block;
    width: 168px;
    max-width: 168px;
    height: 200px;
    max-height: 200px;
    object-fit: contain;
    object-position: center;
    justify-self: end;
  }
  .page-home .quote-plant { display: none; }
  .page-home .nav { display: none !important; }
  .page-home .menu-btn { display: block !important; }
}

@media (prefers-reduced-motion: no-preference) {
  .btn:active,
  .header-cta:active {
    transform: scale(0.98);
  }
}

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

@media (min-width: 1101px) {
  .page-brand .story-close.has-still {
    min-height: 360px;
    padding: 96px 8% 88px;
    background-position: 72% center;
  }
}

.theme-en .page-hero.with-photo.full-bleed.en-home-hero {
  min-height: 100dvh;
  grid-template-columns: 1fr;
  align-items: center;
  padding: 0;
  background-color: #d8e4ee;
  background-position: 78% center;
  background-size: cover;
  position: relative;
}
.theme-en .en-home-hero .hero-copy {
  max-width: 36em;
  padding: 120px 8% 88px max(40px, calc((100vw - var(--wide)) / 2));
}
.theme-en .en-home-hero .scroll-cue {
  left: max(40px, calc((100vw - var(--wide)) / 2));
}

/* EN split home hero: full bottle visible, cream copy column. */
.en-hero-split {
  display: grid;
  grid-template-columns: minmax(280px, 0.92fr) minmax(320px, 1.18fr);
  min-height: 100dvh;
  height: 100dvh;
  overflow: hidden;
  background: #f3efe6;
}
.en-hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 96px 8% 64px max(40px, calc((100% - var(--wide)) / 2));
  max-width: 640px;
}
.en-hero-copy h1 {
  font-size: clamp(40px, 5vw, 68px);
  line-height: 1.08;
  letter-spacing: -0.02em;
}
.en-hero-copy .lead {
  margin-top: 8px;
  max-width: 28em;
}
.en-hero-copy .hero-actions { margin-top: 36px; }
.en-hero-still {
  height: 100%;
  min-height: 0;
  box-sizing: border-box;
  padding: 0;
  background: none;
  overflow: hidden;
}
.en-hero-still img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: cover;
  object-position: 78% center;
}
.en-hero-copy {
  position: relative;
  padding-bottom: 96px;
}
.en-hero-copy .scroll-cue {
  position: absolute;
  left: max(40px, calc((100% - var(--wide)) / 2));
  bottom: 28px;
  color: rgba(22, 21, 19, 0.42);
}
@media (min-width: 901px) {
  .en-hero-split {
    min-height: 100dvh;
    height: 100dvh;
  }
}

/* Reference hero is the whole coastal photograph: bottle, rock and water in frame, type on the sky. */
.en-hero-bleed {
  display: block;
  position: relative;
  background: #c9d7e4;
}
.en-hero-bleed picture { display: contents; }
.en-hero-bleed-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 62% 48%;
  z-index: 0;
}
.en-hero-bleed .en-hero-copy {
  position: absolute;
  inset: 0;
  z-index: 1;
  height: auto;
  width: auto;
  max-width: none;
  box-sizing: border-box;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 112px 42% 96px max(40px, calc((100vw - var(--wide)) / 2));
  background: none;
}
.en-hero-bleed h1 {
  font-family: var(--display);
  text-transform: uppercase;
  font-weight: 500;
  font-size: clamp(42px, 4.8vw, 74px);
  line-height: 0.92;
  letter-spacing: -0.03em;
  color: #14181d;
  max-width: 10em;
}
.en-hero-bleed .lead {
  color: #243039;
  max-width: 16em;
}
.en-hero-bleed .hero-actions {
  flex-wrap: nowrap;
  gap: 28px;
  margin-top: 28px;
}
.en-hero-bleed .rule { background: #14181d; opacity: 0.7; }
.en-hero-bleed .scroll-cue {
  left: max(40px, calc((100vw - var(--wide)) / 2));
  bottom: 32px;
  color: rgba(20, 24, 29, 0.55);
}
.en-hero-bleed .link-arrow { color: #14181d; }
@media (min-width: 901px) {
  .en-hero-bleed { background: #d7e8f6; }
  .en-hero-bleed-photo {
    object-fit: cover;
    object-position: right center;
  }
}

.contact-listen { padding: 72px 0 88px; background: #f7f3ec; }
.contact-listen-grid {
  display: grid;
  grid-template-columns: minmax(240px, 0.9fr) minmax(320px, 1.2fr);
  gap: 56px 72px;
  align-items: start;
}
.contact-listen-side { display: grid; gap: 28px; }
.contact-listen-side article { padding-top: 20px; border-top: 1px solid var(--line); }
.contact-listen-form .quote-form { margin-top: 24px; }

.download-row {
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  gap: 24px;
  align-items: center;
  padding: 28px 0;
  border-bottom: 1px solid var(--line);
}
.download-icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid var(--line);
  display: grid;
  place-items: center;
}
.download-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.4;
}
.download-row .num { font-size: 20px; letter-spacing: 0.08em; opacity: 0.5; }
.download-copy h3 { font-size: 22px; }
.download-copy .tag { margin-top: 8px; }

.cookie-kinds {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px 28px;
  margin-top: 28px;
}
.cookie-kinds h3 { font-size: 16px; margin: 0 0 8px; }
.cookie-stack { display: grid; gap: 8px; }
.cookie-choice {
  display: grid;
  grid-template-columns: 1fr 0.9fr;
  gap: 0;
  align-items: stretch;
  border-top: 1px solid var(--line);
  padding: 0 !important;
}
.cookie-choice-copy { padding: 36px 8% 36px 0; }
.cookie-choice-copy p { color: var(--muted); max-width: 36em; }
.cookie-choice-copy .btn { margin-top: 18px; }
.cookie-choice-still {
  position: relative;
  min-height: 280px;
  background-size: cover;
  background-position: center;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 28px 32px;
  color: #f7f3ec;
}
.cookie-choice-still::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 42%, rgba(18, 22, 26, 0.58) 100%);
  pointer-events: none;
}
.cookie-choice-still .tag,
.cookie-choice-still p { position: relative; z-index: 1; }
.cookie-choice-still .tag { color: rgba(247, 243, 236, 0.72); }
.cookie-choice-still p:last-child { margin: 6px 0 0; font-size: 22px; line-height: 1.25; }
.cookie-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 48px;
}
.cookie-pair .legal-chapter { min-width: 0; }
.legal-en-page {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 48px 72px;
  max-width: var(--wide);
  margin: 0 auto;
  padding: 0 6%;
}
.legal-toc { position: sticky; top: 96px; align-self: start; }
.legal-toc .kicker { margin-bottom: 14px; }
.legal-toc nav { display: grid; }
.legal-toc a {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 10px;
  padding: 7px 0;
  font-size: 13px;
  line-height: 1.35;
  color: var(--muted);
  border-bottom: 1px solid transparent;
}
.legal-toc a:hover { color: var(--ink); }
.legal-toc a span { font-family: var(--serif); opacity: 0.55; }
.legal-chapters { min-width: 0; }
.legal-en .legal-chapter { padding: 28px 0; border-top: 1px solid var(--line); }
.legal-en .legal-chapter:first-child { border-top: 0; }
.legal-en .legal-body ul { padding-left: 1.2em; }
.legal-en .legal-body li { margin: 6px 0; }
.legal-ask { padding: 72px 0 88px; background: #f3efe6; }
.legal-ask-grid {
  display: grid;
  grid-template-columns: 1.3fr repeat(3, 1fr);
  gap: 32px;
  align-items: start;
}
.legal-ask-grid h2 { margin: 0 0 10px; font-size: clamp(28px, 3vw, 40px); }
.legal-ask-grid .tag { margin-bottom: 8px; }

.page-hero.split-photo { padding-top: 0; }

.oem-hero-note { margin-top: 28px; }
.oem-dir-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  margin-top: 36px;
}
.oem-dir .photo { min-height: 180px; margin-bottom: 16px; }
.oem-brief-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px 20px;
  margin-top: 40px;
}
.oem-brief-grid article:last-child { grid-column: auto; }
.oem-layers {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 28px;
}
.oem-layers ul { margin: 12px 0 0; padding-left: 1.1em; }
.oem-layers li { margin: 6px 0; font-size: 13px; color: var(--muted); }
.oem-before {
  display: grid;
  grid-template-columns: 0.95fr 1.05fr;
  background: var(--bg);
}
.oem-before-photo { min-height: 420px; }
.oem-before-copy { padding: 72px 8%; }
.oem-check { margin: 18px 0 0; padding-left: 1.1em; columns: 2; gap: 28px; }
.oem-check li { margin: 8px 0; font-size: 14px; color: var(--muted); }

.theme-en .questions-grid {
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0 48px;
  align-items: center;
}
.theme-en .progress-grid { grid-template-columns: 1fr 1fr; }
@media (max-width: 900px) {
  .theme-en .questions-grid,
  .theme-en .progress-grid { grid-template-columns: 1fr; }
  .theme-en .q-list h3 { overflow-wrap: anywhere; }
}
.theme-en .sus-feature .split-band-photo,
.theme-en .ahead-band .split-band-photo { position: relative; }
.theme-en .sus-feature .split-band-photo::after,
.theme-en .ahead-band .split-band-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, var(--bg) 0%, color-mix(in srgb, var(--bg) 35%, transparent) 22%, transparent 40%);
  pointer-events: none;
}

.theme-cn .ways-en,
.theme-cn .space-en,
.theme-cn .place-en,
.theme-cn .talk-en {
  font-family: var(--display);
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink);
}
.theme-cn.page-ways { overflow-x: clip; }
.theme-cn .cn-hero.ways-hero-split {
  min-height: 100dvh;
}
.theme-cn .ways-hero-split .cn-hero-copy {
  padding-top: 120px;
  padding-bottom: 72px;
}
.theme-cn .ways-hero-split .cn-hero-still {
  min-height: 100dvh;
  background-size: cover;
  background-position: 72% center;
}
.theme-cn .ways-hero-split .ways-en {
  font-size: clamp(28px, 3.8vw, 54px);
  line-height: 1.05;
}
.theme-cn .ways-en {
  margin: 0 0 10px;
  font-size: clamp(22px, 2.6vw, 36px);
  line-height: 1.2;
  overflow-wrap: normal;
}
.theme-cn .ways-day-head {
  max-width: none;
  padding: 8px 0 8px 8%;
}
.theme-cn .ways-day-head .ways-en {
  white-space: nowrap;
  overflow-wrap: normal;
  font-size: clamp(26px, 3.2vw, 42px);
}
.theme-cn .ways-day-head h2 { font-size: clamp(18px, 1.8vw, 26px); }
.theme-cn .day-card { text-align: center; }
.theme-cn .day-card .photo {
  aspect-ratio: 4 / 5;
  background-position: center 60%;
  background-size: cover;
}
.theme-cn .day-card h3,
.theme-cn .day-card .muted,
.theme-cn .day-card .day-time { text-align: center; }
.theme-cn .ways-space-head {
  text-align: left;
  padding-left: 4%;
  margin-bottom: 12px;
}
.theme-cn .ways-space-head h2 {
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 500;
}
.theme-cn.page-ways .space-row {
  background: var(--paper);
  grid-template-columns: 0.9fr 1.2fr;
}
.theme-cn.page-ways .space-row.reverse {
  grid-template-columns: 0.9fr 1.2fr;
}
.theme-cn.page-ways .space-photo,
.theme-cn.page-ways .photo.tall.space-photo {
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 100%);
}
.theme-cn.page-ways .space-row:first-child .space-copy { padding-left: 10%; }
.theme-cn.page-ways .space-copy h2 {
  font-size: clamp(22px, 2.2vw, 32px);
  font-weight: 500;
}
.theme-cn.page-ways .space-en {
  margin: 8px 0 6px;
  font-size: clamp(28px, 3.4vw, 48px);
  line-height: 1.05;
  overflow-wrap: normal;
}
.theme-cn.page-ways .space-photo,
.theme-cn.page-ways .photo.tall.space-photo,
.theme-cn.page-ways .space-row.reverse .space-photo {
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 100%);
}
.theme-cn .place-copy { text-align: center; }
.theme-cn .place-en {
  font-size: clamp(28px, 3.6vw, 52px);
  color: #3f3a34;
}
.theme-cn .place-band.light h2 {
  font-size: clamp(18px, 1.8vw, 26px);
  color: #5c564e;
}
.theme-cn .find-way .ways-en {
  font-size: clamp(28px, 3.4vw, 48px);
  color: #2f2b26;
}
.theme-cn .find-way h2 {
  font-size: clamp(18px, 1.8vw, 26px);
  font-weight: 500;
}
.theme-cn .find-way .icon-card h3 { font-family: var(--display); letter-spacing: 0.08em; }
.theme-cn .mosaic-band { background-color: #f4efe6; }
.theme-cn .choose-thumb {
  width: 112px;
  height: 132px;
  object-fit: contain;
  background: transparent;
}

.theme-cn .talk-en {
  margin: 22px 0 0;
  font-size: clamp(13px, 1.1vw, 16px);
  letter-spacing: 0.16em;
  color: var(--muted);
}
.theme-cn .cn-talk-hero .hero-side-label {
  writing-mode: vertical-rl;
  transform: none;
  top: 36%;
  right: 22px;
  letter-spacing: 0.36em;
  color: rgba(255, 255, 255, 0.8);
}
.theme-cn .talk-topics-head {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: end;
  margin-bottom: 36px;
}
.theme-cn .talk-topics-head .talk-en {
  margin: 0;
  text-align: right;
  font-size: 13px;
  line-height: 1.7;
}
.theme-cn .talk-topic-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}
.theme-cn .talk-topic { background: #fff; }
.theme-cn .talk-topic .photo { min-height: 0; aspect-ratio: 16 / 10; }
.theme-cn .talk-topic .num,
.theme-cn .talk-topic h3 { padding: 16px 16px 0; }
.theme-cn .talk-topic p { padding: 0 16px 18px; }
.theme-cn .talk-connect {
  display: grid;
  grid-template-columns: 0.92fr 1.08fr;
  min-height: 560px;
  background: var(--bg);
}
.theme-cn .talk-connect-copy {
  padding: 72px 8%;
  align-self: center;
}
.theme-cn .talk-lines {
  margin: 28px 0 0;
  display: grid;
  gap: 22px;
}
.theme-cn .talk-lines dt {
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--muted);
}
.theme-cn .talk-lines dd { margin: 4px 0 0; }
.theme-cn .talk-connect-copy .talk-en.foot { margin-top: 36px; }
.theme-cn .talk-china {
  position: relative;
  min-height: 560px;
  background: #1a2433 center 72% / cover no-repeat;
}
.theme-cn .talk-china::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(12, 20, 36, 0.22), rgba(12, 20, 36, 0.38));
}
.theme-cn .talk-china-copy {
  position: relative;
  z-index: 1;
  height: 100%;
  display: grid;
  align-content: center;
  padding: 64px 10%;
  color: #fff;
}
.theme-cn .talk-china-copy h2,
.theme-cn .talk-china-copy p { color: #fff; }
.theme-cn .talk-china-copy .talk-en { color: rgba(255, 255, 255, 0.72); }
.theme-cn .talk-form-grid {
  display: grid;
  grid-template-columns: 0.42fr 0.58fr;
  gap: 48px;
  align-items: start;
}
.theme-cn .talk-form-copy .talk-en { max-width: 18em; }
.theme-cn .talk-form-actions {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
  margin-top: 8px;
}
.theme-cn .talk-place {
  display: grid;
  grid-template-columns: 0.42fr 0.58fr;
  min-height: 520px;
  background: var(--bg);
}
.theme-cn .talk-place-copy {
  padding: 72px 10%;
  align-self: center;
}
.theme-cn .talk-place-photo {
  position: relative;
  min-height: 520px;
  background: #ddd center / cover no-repeat;
}
.theme-cn .talk-place-photo .talk-en {
  position: absolute;
  right: 28px;
  bottom: 28px;
  margin: 0;
  text-align: right;
  color: rgba(255, 255, 255, 0.86);
}
.theme-cn .talk-close {
  min-height: 420px;
  display: grid;
  align-items: center;
  background: #0c1424 center / cover no-repeat;
  color: #fff;
}
.theme-cn .talk-close-grid {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 32px;
  align-items: end;
}
.theme-cn .talk-close h2,
.theme-cn .talk-close .brand-word,
.theme-cn .talk-close .talk-en { color: #fff; }
.theme-cn .talk-close .talk-en.side {
  margin: 0;
  text-align: right;
  line-height: 1.8;
  font-size: 13px;
}

@media (max-width: 900px) {
  .en-hero-split,
  .contact-listen-grid,
  .cookie-kinds,
  .cookie-choice,
  .cookie-pair,
  .legal-en-page,
  .legal-ask-grid,
  .download-row,
  .oem-dir-grid,
  .oem-brief-grid,
  .oem-before,
  .oem-layers {
    grid-template-columns: 1fr;
  }
  .en-hero-split { min-height: 0; height: auto; }
  .en-hero-copy { padding: 88px 24px 72px; }
  .en-hero-copy .scroll-cue { left: 24px; }
  .en-hero-still { min-height: 58svh; height: 58svh; }
  .en-hero-still img { width: 100%; height: 100%; object-fit: cover; object-position: 78% center; }
  .en-hero-bleed { height: 100svh; min-height: 640px; background: #c9d7e4; }
  .en-hero-bleed-photo { object-fit: cover; object-position: 74% center; }
  .en-hero-bleed .en-hero-copy {
    right: 36%;
    justify-content: flex-start;
    padding: 104px 8px 72px 22px;
    background: linear-gradient(90deg, rgba(206, 224, 238, 0.78) 0%, rgba(206, 224, 238, 0.42) 72%, rgba(206, 224, 238, 0) 100%);
  }
  .en-hero-bleed .hero-actions { flex-wrap: wrap; gap: 16px; }
  .en-hero-bleed .lead { font-size: 14px; max-width: 16em; }
  .en-hero-bleed .scroll-cue { left: 22px; }
  .en-hero-bleed h1 { font-size: clamp(32px, 8.4vw, 40px); max-width: 6.6em; }
  .download-row { align-items: start; }
  .oem-check { columns: 1; }
  .oem-before-copy { padding: 48px 24px; }
  .page-hero.split-photo .hero-photo::after,
  .page-hero.split-photo.photo-left .hero-photo::after {
    background: linear-gradient(180deg, var(--bg) 0%, transparent 28%);
  }
  .legal-toc { position: static; }
  .cookie-choice-copy { padding: 28px 0; }
  .cookie-kinds { grid-template-columns: 1fr 1fr; }
  .theme-cn .talk-topics-head,
  .theme-cn .talk-topic-grid,
  .theme-cn .talk-connect,
  .theme-cn .talk-form-grid,
  .theme-cn .talk-place,
  .theme-cn .talk-close-grid {
    grid-template-columns: 1fr;
  }
  .theme-cn .talk-topics-head .talk-en { text-align: left; }
  .theme-cn .talk-connect-copy,
  .theme-cn .talk-place-copy { padding: 48px 24px; }
  .theme-cn .talk-china,
  .theme-cn .talk-place-photo { min-height: 320px; }
  .theme-cn.page-ways .space-row,
  .theme-cn.page-ways .space-row.reverse {
    grid-template-columns: 1fr;
    width: 100%;
    max-width: 100%;
  }
  .theme-cn.page-ways .space-row > * { min-width: 0; }
  .theme-cn.page-ways .space-row:first-child .space-copy { padding-left: 0; }
  .theme-cn .ways-day-head { padding-left: 0; }
  .theme-cn.page-ways .space-photo,
  .theme-cn.page-ways .photo.tall.space-photo {
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 100%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 100%);
    width: 100%;
    height: 240px;
    aspect-ratio: auto;
  }
  .story-world-grid { grid-template-columns: 1fr 1fr; padding: 8px 7% 40px; }
  .theme-cn .cn-hero.ways-hero-split { min-height: 0; }
  .theme-cn .ways-hero-split .cn-hero-copy { padding: 88px 24px 32px; }
  .theme-cn .ways-hero-split .cn-hero-still { min-height: 52svh; }
  .theme-cn .ways-en,
  .theme-cn .place-en,
  .theme-cn .ways-hero-split .ways-en { font-size: clamp(20px, 6.2vw, 26px); }
  .theme-cn.page-ways .space-en { font-size: clamp(24px, 8vw, 34px); }
}

/* Phone / large-phone: keep desktop mosaic and overlay geometry from
   collapsing into clipped watermarks and two-column squeeze. */
@media (max-width: 900px) {
  .theme-cn,
  .theme-en { overflow-x: clip; }

  .page-products .cn-prod-hero,
  .page-products .cn-prod-bridge,
  .page-products .cn-prod-pair,
  .page-products .cn-prod-wide,
  .page-products .cn-prod-reverse,
  .page-products .cn-find {
    display: grid;
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
    height: auto !important;
  }
  .cn-prod-mosaic { padding-top: 52px; overflow: hidden; }
  .cn-prod-mosaic .prod-ghost {
    font-size: clamp(28px, 9vw, 40px);
    top: 10px;
    left: 6%;
  }
  .pp-card {
    position: relative;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center;
    gap: 12px 18px;
    padding: 36px 7% 28px !important;
    min-height: 0 !important;
    height: auto !important;
    overflow: visible;
  }
  .pp-card .ghost-num {
    position: absolute;
    left: 6%;
    top: 10px;
    font-family: var(--sans);
    font-size: 13px !important;
    font-weight: 600;
    line-height: 1 !important;
    letter-spacing: 0.18em;
    color: rgba(22, 21, 19, 0.28);
    pointer-events: none;
  }
  .pp-card .pp-meta {
    position: relative;
    z-index: 1;
    min-width: 0;
    padding-top: 10px;
  }
  .pp-card img,
  .page-products .pp-01 img,
  .page-products .pp-02 img {
    position: relative;
    z-index: 1;
    width: 104px !important;
    max-width: 104px !important;
    height: auto !important;
    max-height: 168px !important;
    object-fit: contain;
    justify-self: end;
  }
  .pp-02 img,
  .page-products .pp-02 img {
    width: 132px !important;
    max-width: 132px !important;
    max-height: 112px !important;
  }
  .page-products .wide-mountain,
  .page-products .reverse-still,
  .page-products .cn-prod-cap,
  .page-products .cn-find-photo {
    min-height: 220px !important;
    height: 220px;
  }
  .page-products .choose-grid,
  .theme-cn .choose-grid,
  .theme-cn .quality-icons,
  .theme-cn .cols-4,
  .theme-cn .cols-5 {
    grid-template-columns: 1fr !important;
  }
  .page-products .choose-body {
    grid-template-columns: minmax(0, 1fr) 96px;
    align-items: center;
  }
  .page-products .choose-thumb {
    width: 96px;
    height: 112px;
    object-fit: contain;
  }

  .theme-cn.page-home .cn-stage,
  .page-home .cn-stage {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-areas: none !important;
    grid-template-rows: none !important;
    aspect-ratio: auto !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 12px 6% 28px !important;
    background-image: none !important;
  }
  .theme-cn.page-home .cn-stage .collection-head,
  .page-home .cn-stage .collection-head,
  .theme-cn.page-home .cn-stage .collection-all,
  .page-home .cn-stage .collection-all {
    position: static !important;
    display: block !important;
    margin: 0 0 20px !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
  }
  .theme-cn.page-home .cn-stage-item,
  .page-home .cn-stage-item,
  .page-home .cn-stage-item.s01,
  .page-home .cn-stage-item.s02,
  .page-home .cn-stage-item.s03,
  .page-home .cn-stage-item.s04 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 140px !important;
    grid-area: auto !important;
    position: relative !important;
    width: auto !important;
    height: auto !important;
    left: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    align-items: center;
    gap: 16px;
  }
  .theme-cn.page-home .cn-stage-item img,
  .page-home .cn-stage-item img {
    display: block !important;
    position: relative !important;
    width: 140px !important;
    max-width: 140px;
    height: 176px;
    max-height: 176px;
    object-fit: contain;
    justify-self: end;
  }
  .theme-cn.page-home .cn-stage-scene,
  .page-home .cn-stage-scene,
  .page-home .cn-stage .pw-mark,
  .page-home .cn-stage-rock { display: none !important; }
  .theme-cn.page-home .cn-stage-meta,
  .page-home .cn-stage-meta {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: auto !important;
  }

  .theme-cn.page-home .cn-life,
  .page-home .cn-life {
    display: block !important;
    grid-template-columns: none !important;
    height: auto !important;
    min-height: 280px;
    position: relative;
  }
  .theme-cn.page-home .cn-life-copy,
  .page-home .cn-life-copy {
    max-width: 82% !important;
    padding: 28px 7% !important;
  }

  .theme-cn.page-home .cn-quotes .quotes-layout,
  .page-home .cn-quotes .quotes-layout,
  .theme-cn .cn-quotes .quotes-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    padding: 0 !important;
    gap: 22px;
  }
  .theme-cn .qr-band,
  .page-home .qr-band {
    grid-template-columns: 1fr !important;
    width: auto !important;
    margin: 0 24px !important;
    text-align: center !important;
    justify-items: center !important;
    gap: 22px !important;
  }
  .theme-cn .site-footer .footer-grid {
    grid-template-columns: 1fr 1fr !important;
  }
  .theme-cn .site-footer .footer-grid > :first-child { grid-column: 1 / -1 !important; }

  .theme-en .materials-grid { grid-template-columns: 1fr 1fr; }
  .theme-en .footer-grid { grid-template-columns: 1fr 1fr !important; }
  .theme-en .en-duo,
  .theme-en .en-duo-top,
  .theme-en .en-trio { grid-template-columns: 1fr !important; }
}

@media (max-width: 560px) {
  .theme-cn .site-footer .footer-grid { grid-template-columns: 1fr !important; }
  .page-products .choose-body { grid-template-columns: minmax(0, 1fr) 80px; }
}

@media (max-width: 900px) {
  html body.theme-cn.page-home .cn-stage-band.section {
    overflow: visible !important;
    height: auto !important;
    padding: 8px 0 20px !important;
  }
  html body.theme-cn.page-home .cn-stage {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
    grid-template-rows: none !important;
    height: auto !important;
    min-height: 0 !important;
    gap: 28px !important;
    padding: 12px 6% 36px !important;
  }
  html body.theme-cn.page-home .cn-stage .collection-head,
  html body.theme-cn.page-home .cn-stage .collection-all {
    position: static !important;
    display: block !important;
    margin: 0 !important;
    width: auto !important;
    left: auto !important;
    top: auto !important;
    right: auto !important;
  }
  html body.theme-cn.page-home .cn-stage .pw-mark { display: none !important; }
  html body.theme-cn.page-home .cn-stage-item,
  html body.theme-cn.page-home .cn-stage-item.s01,
  html body.theme-cn.page-home .cn-stage-item.s02,
  html body.theme-cn.page-home .cn-stage-item.s03,
  html body.theme-cn.page-home .cn-stage-item.s04 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 46% !important;
    grid-area: auto !important;
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    align-items: center;
    gap: 16px;
    padding: 0 !important;
  }
  html body.theme-cn.page-home .cn-stage-meta {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    right: auto !important;
    width: auto !important;
    max-width: none !important;
  }
  html body.theme-cn.page-home .cn-stage-fig {
    margin: 0;
    width: 100%;
    height: 200px;
  }
  html body.theme-cn.page-home .cn-stage-item img {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    max-width: none !important;
    height: 200px !important;
    max-height: 220px !important;
    min-height: 0 !important;
    object-fit: contain !important;
    object-position: center !important;
  }
}

@media (min-width: 901px) {
  html body.theme-cn.page-home .cn-stage-band.section {
    overflow: visible !important;
    height: auto !important;
    padding: 0 !important;
  }
  html body.theme-cn.page-home .cn-stage {
    display: block !important;
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: 880px !important;
    min-height: 880px !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    grid-template-columns: none !important;
    grid-template-rows: none !important;
    grid-template-areas: none !important;
    gap: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: var(--bg) !important;
    background-image: none !important;
  }
  html body.theme-cn.page-home .cn-stage .collection-head {
    position: absolute !important;
    left: 5%;
    top: 40px;
    width: 22%;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 4;
    background: transparent !important;
  }
  html body.theme-cn.page-home .cn-stage .collection-all {
    position: absolute !important;
    top: 44px;
    right: 5%;
    margin: 0 !important;
    z-index: 6;
  }
  html body.theme-cn.page-home .cn-stage .kicker { font-size: 11px; margin: 0 0 8px; letter-spacing: 0.14em; }
  html body.theme-cn.page-home .cn-stage h2 { font-size: clamp(26px, 2.4vw, 34px); margin: 0; line-height: 1.25; }
  html body.theme-cn.page-home .cn-stage .lead { font-size: 13px; margin: 10px 0 0; line-height: 1.6; max-width: 16em; color: var(--muted); }
  html body.theme-cn.page-home .cn-stage .link-arrow { font-size: 13px; }
  html body.theme-cn.page-home .cn-stage-item,
  html body.theme-cn.page-home .cn-stage-item.s01,
  html body.theme-cn.page-home .cn-stage-item.s02,
  html body.theme-cn.page-home .cn-stage-item.s03,
  html body.theme-cn.page-home .cn-stage-item.s04 {
    display: grid !important;
    grid-template-columns: 84px minmax(0, 1fr) !important;
    grid-area: auto !important;
    position: absolute !important;
    align-items: center;
    gap: 4px 8px;
    margin: 0;
    padding: 0 !important;
    overflow: visible !important;
    min-height: 0 !important;
    height: auto !important;
    z-index: 2;
  }
  html body.theme-cn.page-home .cn-stage-item.s01 {
    left: 1%;
    top: 22%;
    width: 36%;
  }
  html body.theme-cn.page-home .cn-stage-item.s02 {
    left: 40%;
    top: 7%;
    width: 22%;
  }
  html body.theme-cn.page-home .cn-stage-item.s03 {
    left: 39%;
    top: auto;
    bottom: 1%;
    width: 24%;
  }
  html body.theme-cn.page-home .cn-stage-item.s04 {
    right: 2%;
    left: auto;
    top: 26%;
    width: 24%;
  }
  html body.theme-cn.page-home .cn-stage-meta {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    right: auto !important;
    width: auto !important;
    max-width: none !important;
    z-index: 3;
    background: transparent !important;
    padding-top: 8px;
  }
  html body.theme-cn.page-home .cn-stage .pw-num {
    font-size: 20px;
    margin: 0;
    color: rgba(22, 21, 19, 0.38);
  }
  html body.theme-cn.page-home .cn-stage-meta h3 {
    font-size: 16px;
    margin: 2px 0 0;
    line-height: 1.25;
    font-weight: 600;
    color: rgba(22, 21, 19, 0.84);
  }
  html body.theme-cn.page-home .cn-stage .pw-vol,
  html body.theme-cn.page-home .cn-stage .pw-link,
  html body.theme-cn.page-home .cn-stage .pw-soon,
  html body.theme-cn.page-home .cn-stage .pw-soon em {
    font-size: 12px;
    margin: 4px 0 0;
    color: rgba(22, 21, 19, 0.52);
  }
  html body.theme-cn.page-home .cn-stage-fig {
    margin: 0;
    width: 100%;
    height: auto;
    display: flex;
    align-items: flex-end;
    justify-content: center;
  }
  html body.theme-cn.page-home .cn-stage-item img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    object-fit: contain !important;
    object-position: center bottom !important;
  }
  html body.theme-cn.page-home .cn-stage-item.s01 img { max-height: 520px !important; }
  html body.theme-cn.page-home .cn-stage-item.s02 img { max-height: 250px !important; }
  html body.theme-cn.page-home .cn-stage-item.s03 img { max-height: 340px !important; }
  html body.theme-cn.page-home .cn-stage-item.s04 img { max-height: 300px !important; }
  html body.theme-cn.page-home .cn-stage .pw-mark {
    display: block !important;
    position: absolute;
    z-index: 0;
    margin: 0;
    font-family: var(--serif);
    color: rgba(22, 21, 19, 0.08);
    pointer-events: none;
    line-height: 0.85;
    font-weight: 500;
  }
  html body.theme-cn.page-home .cn-stage .pw-mark small {
    display: block;
    font-size: 0.22em;
    letter-spacing: 0.32em;
    margin-top: 0.2em;
    font-family: var(--sans);
    font-weight: 500;
  }
  /* 500 lives inside the March Heart still. Keep 18.9 and 10 in the open gaps. */
  html body.theme-cn.page-home .cn-stage .pw-mark-500 { display: none !important; }
  html body.theme-cn.page-home .cn-stage .pw-mark-189 {
    left: 36%;
    top: 42%;
    font-size: clamp(64px, 7vw, 108px);
    z-index: 0;
  }
  html body.theme-cn.page-home .cn-stage .pw-mark-10 {
    right: 18%;
    top: 8%;
    font-size: clamp(72px, 8vw, 120px);
    z-index: 0;
  }
}

@media (min-width: 1200px) {
  html body.theme-cn.page-home .cn-stage {
    height: 880px !important;
    min-height: 880px !important;
  }
}
