@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600&family=Italiana&display=swap');

:root {
  --ink: #121210;
  --paper: #f2f0e9;
  --cream: #d9d1bf;
  --gold: #b79a68;
  --line: rgba(18, 18, 16, .18);
  --display: "Italiana", Georgia, serif;
  --display-zh: "Songti SC", "Noto Serif CJK SC", "Source Han Serif SC", "STSong", "SimSun", serif;
  --sans-zh: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", Arial, sans-serif;
  --sans: "DM Sans", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: 16px; line-height: 1.6; }
html[lang="zh-CN"] body { font-family: var(--sans-zh); }
img { display: block; width: 100%; height: 100%; object-fit: cover; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
.sr-only, .skip-link { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link:focus { position: fixed; z-index: 100; top: 12px; left: 12px; width: auto; height: auto; padding: 10px 16px; clip: auto; background: white; }

.site-header { position: absolute; z-index: 10; top: 0; left: 0; right: 0; display: flex; align-items: center; justify-content: space-between; padding: 26px 4vw; color: white; border-bottom: 1px solid rgba(255,255,255,.2); }
body.admin-bar .site-header:not(.catalog-site-header) { top: 32px; }
.brand { display: flex; align-items: center; gap: 10px; letter-spacing: .18em; line-height: 1; }
.brand svg { width: 42px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.brand b, .brand small { display: block; }
.brand b { font-size: .86rem; font-weight: 500; }
.brand small { margin-top: 6px; font-size: .48rem; opacity: .68; letter-spacing: .35em; }
nav { display: flex; align-items: center; gap: 34px; font-size: .78rem; letter-spacing: .08em; }
nav a { opacity: .82; }
nav a:hover { opacity: 1; }
.language-link { padding: 4px 0; font-family: var(--sans); font-weight: 600; opacity: 1; }
.nav-cta { padding: 11px 18px; border: 1px solid rgba(255,255,255,.55); }
.menu-toggle { display: none; color: white; background: none; border: 0; }

.hero { position: relative; min-height: 820px; height: 100vh; max-height: 1050px; color: white; overflow: hidden; }
.hero-media { position: absolute; inset: 0; background: url("/wp-content/uploads/meiyun-assets/hero-custom-stair-light.jpg") center 48% / cover; transform: scale(1.02); }
.hero-video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; min-width: 100%; min-height: 100%; object-fit: cover; object-position: center; }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,8,7,.78) 0%, rgba(7,8,7,.38) 48%, rgba(7,8,7,.18)), linear-gradient(0deg, rgba(7,8,7,.62), transparent 48%); }
.hero-content { position: absolute; z-index: 2; left: 7vw; top: 48%; max-width: 780px; transform: translateY(-42%); }
.eyebrow { margin: 0 0 24px; font-size: .7rem; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; }
.hero h1, h2 { font-family: var(--display); font-weight: 400; line-height: .97; letter-spacing: -.02em; }
.hero h1 { margin: 0; font-size: clamp(4.2rem, 8.2vw, 8.5rem); }
.hero-copy { max-width: 590px; margin: 30px 0 0; color: rgba(255,255,255,.78); font-size: 1.05rem; font-weight: 300; }
.hero-actions { display: flex; align-items: center; gap: 34px; margin-top: 38px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 26px; border: 1px solid transparent; font-size: .75rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; transition: .25s ease; cursor: pointer; }
.button-light { background: white; color: var(--ink); }
.button-light:hover { background: var(--gold); color: white; }
.button-dark { background: var(--ink); color: white; }
.button-dark:hover { background: var(--gold); }
.text-link { padding-bottom: 5px; border-bottom: 1px solid rgba(255,255,255,.45); font-size: .82rem; letter-spacing: .06em; }
.text-link span, .arrow-link span { margin-left: 10px; }
.hero-proof { position: absolute; z-index: 2; right: 4vw; bottom: 37px; display: flex; gap: 56px; }
.hero-proof div { display: grid; gap: 5px; }
.hero-proof strong { font-family: var(--display); font-size: 1.55rem; font-weight: 400; }
.hero-proof span { color: rgba(255,255,255,.6); font-size: .63rem; letter-spacing: .1em; text-transform: uppercase; }

html[lang="zh-CN"] .hero h1,
html[lang="zh-CN"] .intro h2,
html[lang="zh-CN"] .section-head h2,
html[lang="zh-CN"] .seo-intro h2,
html[lang="zh-CN"] .cap-content h2,
html[lang="zh-CN"] .contact h2,
html[lang="zh-CN"] .catalog-hero h1,
html[lang="zh-CN"] .project-case-hero h1,
html[lang="zh-CN"] .project-archive-hero h1,
html[lang="zh-CN"] .journal-hero h1,
html[lang="zh-CN"] .article-detail-header h1,
html[lang="zh-CN"] .product-detail-copy h1,
html[lang="zh-CN"] .product-procurement h2,
html[lang="zh-CN"] .product-faq h2,
html[lang="zh-CN"] .related-products h2 {
  font-family: var(--display-zh);
  font-weight: 500;
  letter-spacing: .015em;
  line-height: 1.08;
  text-wrap: balance;
}

html[lang="zh-CN"] .catalog-hero h1,
html[lang="zh-CN"] .project-case-hero h1,
html[lang="zh-CN"] .project-archive-hero h1,
html[lang="zh-CN"] .journal-hero h1 {
  max-width: 1180px;
  font-size: clamp(3.2rem, 6vw, 6.4rem);
}

html[lang="zh-CN"] .hero h1 {
  font-size: clamp(3.4rem, 7vw, 6.8rem);
}

html[lang="zh-CN"] .catalog-hero > p:last-child,
html[lang="zh-CN"] .project-case-hero > p:last-child,
html[lang="zh-CN"] .project-archive-hero > p:last-child,
html[lang="zh-CN"] .journal-hero > p:last-child {
  max-width: 760px;
  font-size: 1rem;
  line-height: 1.85;
}

.section { padding: 120px 7vw; }
.intro { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .72fr); gap: 8vw; align-items: center; padding-bottom: 95px; }
.intro h2, .section-head h2, .cap-content h2, .contact h2 { margin: 0; font-size: clamp(3.2rem, 5.4vw, 6rem); }
.intro h2 { max-width: 1080px; text-wrap: balance; }
.intro-copy { max-width: 520px; color: #4f4d47; }
.intro-copy p { margin: 0 0 28px; font-size: 1.04rem; line-height: 1.75; }
.intro-tags { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0 0 34px; padding: 0; list-style: none; }
.intro-tags li { min-height: 42px; display: flex; align-items: center; padding: 0 14px; border: 1px solid var(--line); color: #34332f; font-size: .7rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.seo-intro { display: grid; grid-template-columns: minmax(190px, .34fr) minmax(0, 1fr); gap: 6vw; padding-top: 82px; padding-bottom: 82px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #ebe7dc; }
.seo-intro h2 { max-width: 920px; margin: 0; font-size: clamp(2.8rem, 4.2vw, 4.9rem); text-wrap: balance; }
.seo-intro p:last-of-type { max-width: 780px; margin: 24px 0 0; color: #5d5a53; }
.seo-badges { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.seo-badges span { padding: 9px 13px; border: 1px solid rgba(18,18,16,.22); color: #383630; font-size: .65rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.arrow-link { display: inline-block; padding-bottom: 5px; color: var(--ink); border-bottom: 1px solid var(--line); font-size: .78rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.inline-more { display: inline-block; margin-top: 14px; padding-bottom: 3px; border-bottom: 1px solid currentColor; color: var(--ink); font-size: .72rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }

.collections { padding-top: 90px; }
.section-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 440px); align-items: end; gap: 7vw; margin-bottom: 48px; }
.section-head h2 { max-width: 1150px; text-wrap: balance; }
.section-head p:last-child { max-width: 440px; margin: 0 0 8px; color: #5f5c55; }
.collection-grid { display: grid; grid-template-columns: 1.1fr .9fr .9fr; grid-template-rows: 310px 310px; gap: 16px; }
.collection-card { position: relative; min-height: 0; overflow: hidden; color: white; }
.collection-card img { transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.collection-card:not(.card-large) img { object-position: 68% center; }
.collection-card:hover img { transform: scale(1.035); }
.card-large { grid-row: 1 / 3; }
.card-cream { background: var(--cream); color: var(--ink); }
.card-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(8,8,7,.68), transparent 55%); }
.card-copy { position: absolute; left: 34px; right: 34px; bottom: 30px; display: grid; grid-template-columns: 38px 1fr auto; align-items: end; }
.card-copy span { font-size: .65rem; opacity: .68; }
.card-copy h3 { margin: 0; font-family: var(--display); font-size: clamp(2rem, 3vw, 3.4rem); font-weight: 400; line-height: 1; }
.card-copy a { padding-bottom: 3px; border-bottom: 1px solid currentColor; font-size: .65rem; letter-spacing: .08em; text-transform: uppercase; }
.card-copy.dark { color: var(--ink); }
.line-art { position: absolute; inset: 25px; display: grid; place-items: center; }
.line-art svg { width: min(68%, 360px); fill: none; stroke: rgba(18,18,16,.4); stroke-width: 1; }
.card-wide { display: block; }

.capabilities { display: grid; grid-template-columns: 1.08fr .92fr; min-height: 820px; margin-top: 20px; background: var(--ink); color: white; }
.cap-image { min-height: 700px; }
.cap-content { padding: 100px 8vw 80px 7vw; }
.cap-content h2 { max-width: 600px; }
.cap-content > p:not(.eyebrow) { max-width: 560px; color: rgba(255,255,255,.62); }
.cap-list { margin: 44px 0 42px; padding: 0; list-style: none; border-top: 1px solid rgba(255,255,255,.15); }
.cap-list li { display: flex; gap: 24px; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.15); font-size: .82rem; letter-spacing: .06em; text-transform: uppercase; }
.cap-list span { color: var(--gold); font-size: .64rem; }
.cap-content .button-dark { border-color: rgba(255,255,255,.4); }

.project-head { align-items: end; }
.project-list { border-top: 1px solid var(--line); }
.project-list article { border-bottom: 1px solid var(--line); transition: padding .25s, background .25s; }
.project-list article > a { display: grid; grid-template-columns: 80px 1fr auto; align-items: center; gap: 22px; min-height: 132px; color: inherit; }
.project-list article:hover { padding: 0 20px; background: #e8e4da; }
.project-number, .project-year, .project-list p { color: #76736c; font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; }
.project-list p { margin: 0 0 6px; }
.project-list h3 { margin: 0; font-family: var(--display); font-size: clamp(1.5rem, 2.3vw, 2.6rem); font-weight: 400; line-height: 1.15; }
.procurement { padding-top: 20px; }
.procurement-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: var(--line); }
.procurement-steps article { min-width: 0; padding: 34px 28px 38px; background: #e7e2d7; }
.procurement-steps span { display: inline-block; margin-bottom: 54px; color: var(--gold); font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; }
.procurement-steps h3 { margin: 0 0 16px; font-family: var(--display); font-size: clamp(1.9rem, 2.6vw, 3rem); font-weight: 400; line-height: 1; }
.procurement-steps p { margin: 0; color: #615e57; font-size: .9rem; }
.project-case-hero { padding: 145px 7vw 90px; background: linear-gradient(90deg, rgba(12,12,10,.84), rgba(12,12,10,.58)), url("/wp-content/uploads/meiyun-assets/hero-custom-chandelier.jpg") center 35% / cover; color: white; }
.project-case-hero h1 { max-width: 1040px; margin: 0; font-family: var(--display); font-size: clamp(4rem, 8vw, 8rem); font-weight: 400; line-height: .94; }
.project-case-hero > p:last-child { max-width: 680px; margin: 32px 0 0; color: rgba(255,255,255,.66); font-size: 1.05rem; }
.project-case-body { display: grid; grid-template-columns: 1.05fr .95fr; min-height: 720px; background: var(--paper); }
.project-case-media { min-height: 720px; overflow: hidden; background: #dedbd2; }
.project-case-media img { width: 100%; height: 100%; object-fit: cover; }
.project-case-copy { display: flex; flex-direction: column; justify-content: center; padding: 90px 8vw 90px 7vw; }
.project-case-copy h2 { margin: 0; font-family: var(--display); font-size: clamp(3rem, 5.5vw, 6rem); font-weight: 400; line-height: .98; }
.project-case-copy ul { display: grid; gap: 18px; margin: 35px 0 0; padding: 0; list-style: none; }
.project-case-copy li { padding-left: 22px; border-left: 1px solid var(--gold); color: #5f5c55; }
.project-case-actions { display: flex; align-items: center; gap: 28px; margin-top: 42px; }
.dark-link { color: var(--ink); }
.project-archive-hero { padding: 140px 7vw 85px; background: linear-gradient(90deg, rgba(12,12,10,.86), rgba(12,12,10,.48)), url("/wp-content/uploads/meiyun-assets/hero-custom-chandelier.jpg") center 34% / cover; color: white; }
.project-archive-hero h1 { max-width: 1160px; margin: 0; font-family: var(--display); font-size: clamp(4rem, 6.7vw, 7.2rem); font-weight: 400; line-height: .96; text-wrap: balance; }
.project-archive-hero > p:last-child { max-width: 720px; margin: 32px 0 0; color: rgba(255,255,255,.64); font-size: 1.05rem; }
.project-archive-main { padding: 70px 7vw 120px; }
.project-archive-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin-bottom: 60px; background: var(--line); }
.project-archive-stats div { display: grid; gap: 7px; padding: 28px; background: #e7e2d7; }
.project-archive-stats strong { font-family: var(--display); font-size: clamp(2rem, 4vw, 4.5rem); font-weight: 400; line-height: 1; }
.project-archive-stats span { color: #6d6961; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; }
.case-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 48px 16px; }
.case-card { min-width: 0; }
.case-image { position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden; background: #dedbd2; }
.case-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s ease; }
.case-card:hover .case-image img { transform: scale(1.035); }
.case-image span { position: absolute; left: 14px; bottom: 14px; padding: 7px 10px; background: rgba(18,18,16,.86); color: white; font-size: .62rem; letter-spacing: .08em; text-transform: uppercase; }
.case-card-copy { padding-top: 18px; }
.case-card-copy p { margin: 0 0 7px; color: #777269; font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; }
.case-card-copy h2 { margin: 0 0 16px; font-family: var(--display); font-size: 1.75rem; font-weight: 400; line-height: 1.08; }

.certifications { padding-top: 50px; border-top: 1px solid var(--line); }
.cert-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 35px; color: #777269; }
.cert-row span { font-family: var(--display); font-size: clamp(1.5rem, 2.4vw, 2.5rem); }

.contact { display: grid; grid-template-columns: .85fr 1.15fr; gap: 9vw; padding: 120px 7vw; background: #24231f; color: white; }
.contact-copy > p:not(.eyebrow) { max-width: 500px; color: rgba(255,255,255,.6); }
.contact-person { display: grid; margin-top: 55px; }
.contact-person span { margin-bottom: 8px; color: var(--gold); font-size: .65rem; letter-spacing: .14em; text-transform: uppercase; }
.contact-person strong { margin-bottom: 8px; font-family: var(--display); font-size: 1.6rem; font-weight: 400; }
.contact-person a { color: rgba(255,255,255,.62); font-size: .85rem; }
.inquiry-form { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 20px; align-content: start; }
.inquiry-form label { display: grid; gap: 7px; color: rgba(255,255,255,.55); font-size: .65rem; letter-spacing: .1em; text-transform: uppercase; }
.inquiry-form input, .inquiry-form textarea { width: 100%; padding: 11px 0; color: white; background: transparent; border: 0; border-bottom: 1px solid rgba(255,255,255,.25); border-radius: 0; outline: 0; resize: vertical; }
.inquiry-form input:focus, .inquiry-form textarea:focus { border-color: var(--gold); }
.inquiry-form .full { grid-column: 1 / -1; }
.inquiry-form button { margin-top: 8px; border: 0; }
.inquiry-form button span { margin-left: 12px; }
.form-success { grid-column: 1 / -1; margin-bottom: 20px; padding: 14px 16px; border: 1px solid rgba(183,154,104,.55); color: #f0dfbf; font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; }

footer { display: grid; grid-template-columns: 1fr auto; gap: 60px; padding: 70px 7vw 28px; background: #11110f; color: white; }
.footer-links { display: flex; flex-wrap: wrap; gap: 30px; color: rgba(255,255,255,.65); font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.footer-meta { grid-column: 1 / -1; display: flex; justify-content: space-between; padding-top: 26px; border-top: 1px solid rgba(255,255,255,.12); color: rgba(255,255,255,.35); font-size: .65rem; }
.whatsapp { position: fixed; z-index: 9; right: 20px; bottom: 20px; display: grid; width: 48px; height: 48px; place-items: center; background: #fff; color: #181814; border-radius: 50%; box-shadow: 0 8px 30px rgba(0,0,0,.25); font-size: .68rem; font-weight: 700; letter-spacing: .04em; }

@media (max-width: 900px) {
  body.admin-bar .site-header:not(.catalog-site-header) { top: 46px; }
  .site-header { padding: 20px 22px; }
  .menu-toggle { z-index: 11; display: grid; gap: 6px; padding: 10px; }
  .menu-toggle span:not(.sr-only) { display: block; width: 24px; height: 1px; background: currentColor; transition: .2s; }
  nav { position: fixed; inset: 0; z-index: 10; display: none; flex-direction: column; align-items: flex-start; justify-content: center; padding: 12vw; background: #141412; font-family: var(--display); font-size: 2.3rem; }
  nav.open { display: flex; }
  .nav-cta { padding: 0; border: 0; }
  .hero { min-height: 740px; }
  .hero-content { left: 24px; right: 24px; top: 45%; }
  .hero h1 { font-size: clamp(3.5rem, 16vw, 6rem); }
  .hero-proof { left: 24px; right: 24px; justify-content: space-between; gap: 15px; }
  .section { padding: 85px 24px; }
  .intro, .contact { grid-template-columns: 1fr; }
  .section-head { display: block; }
  .section-head p:last-child { margin-top: 25px; }
  .collection-grid { grid-template-columns: 1fr; grid-template-rows: 630px 440px 440px 440px 440px; }
  .card-large { grid-row: auto; }
  .card-wide { display: block; }
  .capabilities { grid-template-columns: 1fr; }
  .cap-image { min-height: 520px; }
  .cap-content { padding: 80px 24px; }
  .project-list article > a { grid-template-columns: 38px 1fr auto; }
  .procurement-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-case-body { grid-template-columns: 1fr; }
  .project-case-media { min-height: 480px; }
  .project-case-copy { padding: 80px 24px; }
  .case-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  footer { grid-template-columns: 1fr; }
  .footer-meta { grid-column: auto; display: grid; gap: 8px; }
}

@media (max-width: 560px) {
  .brand svg { width: 36px; }
  .hero-media { background-position: 58% center; }
  .hero-copy { font-size: .92rem; }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 22px; }
  .hero-proof div:nth-child(3) { display: none; }
  .intro h2, .section-head h2, .cap-content h2, .contact h2 { font-size: 3.1rem; }
  .collection-grid { grid-template-rows: 520px 380px 380px 380px 380px; }
  .card-copy { left: 22px; right: 22px; bottom: 22px; grid-template-columns: 1fr; gap: 8px; }
  .card-copy a { justify-self: start; }
  .project-year { display: none; }
  .project-list article > a { min-height: 150px; }
  .procurement-steps { grid-template-columns: 1fr; }
  .procurement-steps span { margin-bottom: 36px; }
  .project-case-hero { padding: 105px 24px 65px; }
  .project-case-hero h1 { font-size: 3.6rem; }
  .project-case-actions { align-items: flex-start; flex-direction: column; }
  .project-archive-hero { padding: 100px 24px 65px; }
  .project-archive-hero h1 { font-size: clamp(3rem, 11vw, 3.8rem); line-height: 1.03; }
  .project-archive-main { padding: 55px 24px 85px; }
  .project-archive-stats, .case-grid { grid-template-columns: 1fr; }
  .inquiry-form { grid-template-columns: 1fr; }
  .inquiry-form .full { grid-column: auto; }
  .cert-row { justify-content: flex-start; }
}

/* Articles */
.journal-hero { padding: 135px 7vw 90px; background: var(--ink); color: white; }
.journal-hero h1 { max-width: 1180px; margin: 0; font-family: var(--display); font-size: clamp(4rem, 6.6vw, 7.1rem); font-weight: 400; line-height: .96; text-wrap: balance; }
.journal-hero > p:last-child { max-width: 660px; margin: 30px 0 0; color: rgba(255,255,255,.63); }
.journal-main { padding: 85px 7vw 120px; }
.journal-topbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 48px; padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.journal-topbar h2 { margin: 0; font-size: clamp(2.3rem, 4vw, 4rem); }
.journal-categories { display: flex; flex-wrap: wrap; gap: 18px; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
.journal-categories a { padding-bottom: 3px; border-bottom: 1px solid transparent; }
.journal-categories a:hover, .journal-categories a.active { border-color: currentColor; }
.article-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 55px 20px; }
.article-card { min-width: 0; }
.article-image { display: block; aspect-ratio: 1.35 / 1; overflow: hidden; background: #dedbd2; }
.article-image img { transition: transform .5s ease; }
.article-card:hover .article-image img { transform: scale(1.035); }
.article-card-copy { padding-top: 20px; }
.article-meta { display: flex; justify-content: space-between; gap: 15px; color: #777269; font-size: .62rem; letter-spacing: .08em; text-transform: uppercase; }
.article-card h2 { margin: 14px 0 12px; font-size: clamp(1.7rem, 2.2vw, 2.5rem); line-height: 1.08; }
.article-card-copy > p { margin: 0 0 20px; color: #65625b; font-size: .88rem; }
.article-read { padding-bottom: 3px; border-bottom: 1px solid var(--line); font-size: .68rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.journal-empty { color: #65625b; }
.article-detail { padding-bottom: 100px; }
.article-detail-header { padding: 95px 16vw 65px; background: var(--ink); color: white; text-align: center; }
.article-detail-header .back-link { display: inline-block; margin: 0 0 55px; color: rgba(255,255,255,.55); }
.article-detail-header h1 { max-width: 1050px; margin: 0 auto; font-family: var(--display); font-size: clamp(3.5rem, 6.5vw, 7rem); font-weight: 400; line-height: .98; }
.article-byline { display: flex; justify-content: center; gap: 28px; margin-top: 35px; color: rgba(255,255,255,.5); font-size: .67rem; letter-spacing: .08em; text-transform: uppercase; }
.article-featured { width: min(1180px, 86vw); max-height: 720px; margin: 70px auto 0; overflow: hidden; }
.article-body { width: min(740px, calc(100% - 48px)); margin: 75px auto; color: #363530; font-size: 1.06rem; line-height: 1.85; }
.article-body h2, .article-body h3 { margin: 2em 0 .7em; line-height: 1.15; }
.article-body h2 { font-size: 2.5rem; }
.article-body h3 { font-size: 1.7rem; }
.article-body img { height: auto; margin: 45px 0; }
.article-body blockquote { margin: 45px 0; padding: 10px 0 10px 28px; border-left: 2px solid var(--gold); font-family: var(--display); font-size: 1.65rem; line-height: 1.35; }
.article-body a { border-bottom: 1px solid var(--gold); }
.article-end { display: flex; align-items: center; justify-content: space-between; gap: 30px; width: min(900px, calc(100% - 48px)); margin: 0 auto; padding: 38px; background: #ded8ca; }
.article-end p { margin: 0; font-family: var(--display); font-size: 1.7rem; }

@media (max-width: 900px) {
  .article-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .journal-hero { padding: 100px 24px 65px; }
  .journal-hero h1 { font-size: clamp(2.75rem, 10.8vw, 3.7rem); line-height: 1.04; }
  .journal-main { padding: 60px 24px 85px; }
  .journal-topbar { align-items: flex-start; flex-direction: column; }
  .article-grid { grid-template-columns: 1fr; }
  .article-detail-header { padding: 75px 24px 55px; }
  .article-byline { flex-wrap: wrap; gap: 10px 20px; }
  .article-featured { width: 100%; margin-top: 0; }
  .article-end { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Product catalog */
.catalog-page { background: #ece9e1; }
.catalog-site-header { position: relative; background: var(--ink); }
.catalog-hero { padding: 140px 7vw 85px; background: linear-gradient(90deg, rgba(12,12,10,.86), rgba(12,12,10,.52), rgba(12,12,10,.28)), url("/wp-content/uploads/meiyun-assets/hero-custom-stair-light.jpg") center 46% / cover; color: white; }
.catalog-hero h1 { max-width: 980px; margin: 0; font-family: var(--display); font-size: clamp(4rem, 8vw, 8rem); font-weight: 400; line-height: .94; }
.catalog-hero > p:last-child { max-width: 610px; margin: 32px 0 0; color: rgba(255,255,255,.64); font-size: 1.05rem; }
.catalog-main { padding: 60px 7vw 120px; }
.catalog-filter { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 46px; }
.catalog-filter a { display: inline-flex; gap: 12px; padding: 11px 16px; border: 1px solid var(--line); color: #5f5c55; font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; }
.catalog-filter a:hover, .catalog-filter a.active { background: var(--ink); color: white; }
.catalog-filter span { opacity: .55; }
.legacy-category-showcase { margin-bottom: 72px; padding-bottom: 62px; border-bottom: 1px solid var(--line); }
.legacy-category-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.legacy-category-card { position: relative; display: flex; min-height: 360px; flex-direction: column; justify-content: flex-end; overflow: hidden; padding: 24px; color: white; background: #dedbd2; }
.legacy-category-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(8,8,7,.78), rgba(8,8,7,.08) 62%); }
.legacy-category-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .55s ease; }
.legacy-category-card:hover img { transform: scale(1.035); }
.legacy-category-card span, .legacy-category-card strong { position: relative; z-index: 1; }
.legacy-category-card span { margin-bottom: 12px; color: rgba(255,255,255,.68); font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; }
.legacy-category-card strong { max-width: 210px; font-family: var(--display); font-size: clamp(1.65rem, 2vw, 2.45rem); font-weight: 400; line-height: 1.02; }
.series-showcase { margin-bottom: 70px; padding-bottom: 58px; border-bottom: 1px solid var(--line); }
.series-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.series-card { position: relative; min-height: 320px; overflow: hidden; background: #dedbd2; color: white; }
.series-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(8,8,7,.68), transparent 58%); }
.series-card > a { display: block; width: 100%; height: 100%; color: inherit; }
.series-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s ease; }
.series-card:hover img { transform: scale(1.035); }
.series-card > div { position: absolute; z-index: 1; left: 22px; right: 22px; bottom: 20px; }
.series-card p { margin: 0 0 8px; color: rgba(255,255,255,.68); font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; }
.series-card h3 { margin: 0; font-family: var(--display); font-size: clamp(1.7rem, 2.5vw, 2.8rem); font-weight: 400; line-height: 1; }
.product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px 16px; }
.category-seo-copy { display: grid; grid-template-columns: .8fr 1.2fr; gap: 6vw; margin: 0 0 55px; padding: 36px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.category-seo-copy h2 { margin: 0; font-family: var(--display); font-size: clamp(2rem, 3.2vw, 3.7rem); font-weight: 400; line-height: 1.05; }
.category-seo-copy p { align-self: end; margin: 0; color: #66635d; }
.product-card { min-width: 0; }
.product-image { position: relative; display: block; height: 0; padding-bottom: 118%; overflow: hidden; background: #dedbd2; }
.product-image img { position: absolute; inset: 0; transition: transform .5s ease; }
.product-image span { position: absolute; right: 15px; bottom: 15px; padding: 8px 12px; background: rgba(18,18,16,.88); color: white; opacity: 0; transform: translateY(8px); transition: .25s ease; font-size: .63rem; letter-spacing: .08em; text-transform: uppercase; }
.product-card:hover .product-image img { transform: scale(1.035); }
.product-card:hover .product-image span { opacity: 1; transform: translateY(0); }
.product-card-copy { padding-top: 17px; }
.product-card-copy p { margin: 0 0 5px; color: #777269; font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; }
.product-card-copy h2 { margin: 0; font-family: var(--display); font-size: 1.55rem; font-weight: 400; line-height: 1.2; }
.navigation.pagination { margin-top: 65px; }
.nav-links { display: flex; gap: 8px; justify-content: center; }
.page-numbers { display: grid; min-width: 42px; height: 42px; padding: 0 10px; place-items: center; border: 1px solid var(--line); font-size: .75rem; }
.page-numbers.current { background: var(--ink); color: white; }
.catalog-contact { display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; padding: 100px 7vw; background: #24231f; color: white; }
.catalog-contact h2 { max-width: 680px; margin: 0; font-size: clamp(3rem, 5vw, 5.8rem); }
.catalog-contact > div:last-child { align-self: end; max-width: 520px; color: rgba(255,255,255,.65); }
.catalog-contact .button { margin-top: 24px; }
.catalog-contact .inquiry-form { margin-top: 28px; }
.catalog-contact .inquiry-form label { color: rgba(255,255,255,.62); }
.catalog-footer { display: flex; align-items: center; justify-content: space-between; padding: 38px 7vw; background: #11110f; color: white; }
.catalog-footer > span { color: rgba(255,255,255,.4); font-size: .65rem; }
.product-detail { display: grid; grid-template-columns: 1.08fr .92fr; min-height: calc(100vh - 97px); }
.product-detail-image { position: relative; min-height: 720px; background: #ddd9d0; }
.product-back-overlay { position: absolute; z-index: 2; top: 28px; left: 28px; display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 18px; background: rgba(17,17,15,.86); color: white; backdrop-filter: blur(8px); font-size: .7rem; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; transition: background .2s, transform .2s; }
.product-back-overlay:hover { background: var(--gold); transform: translateX(-3px); }
.product-detail-copy { display: flex; flex-direction: column; justify-content: center; padding: 90px 8vw 90px 7vw; background: var(--paper); }
.back-link { margin-bottom: 70px; color: #6b6861; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.product-detail-copy h1 { margin: 0; font-family: var(--display); font-size: clamp(3.5rem, 6vw, 6.8rem); font-weight: 400; line-height: 1; }
.product-lead { max-width: 520px; margin: 28px 0 38px; color: #68655e; }
.product-keyword { margin: 14px 0 0; color: var(--gold); font-size: .72rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.product-specs { margin: 0 0 38px; border-top: 1px solid var(--line); }
.product-specs div { display: grid; grid-template-columns: 130px 1fr; padding: 13px 0; border-bottom: 1px solid var(--line); }
.product-specs dt { color: #777269; font-size: .66rem; letter-spacing: .09em; text-transform: uppercase; }
.product-specs dd { margin: 0; font-size: .82rem; }
.product-detail-copy .button { align-self: flex-start; }
.detail-whatsapp { align-self: flex-start; margin-top: 22px; padding-bottom: 3px; border-bottom: 1px solid var(--line); font-size: .72rem; letter-spacing: .07em; text-transform: uppercase; }
.product-procurement, .product-process, .product-faq, .related-products { padding: 95px 7vw; background: var(--paper); border-top: 1px solid var(--line); }
.product-procurement { display: grid; grid-template-columns: .8fr 1.2fr; gap: 7vw; }
.product-procurement h2, .product-faq h2, .related-products h2 { margin: 0; font-family: var(--display); font-size: clamp(2.8rem, 4.8vw, 5.6rem); font-weight: 400; line-height: .98; }
.procurement-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.procurement-grid article { padding: 28px; background: #e6e1d6; }
.procurement-grid span { color: var(--gold); font-size: .66rem; letter-spacing: .1em; }
.procurement-grid h3 { margin: 22px 0 10px; font-family: var(--display); font-size: 2rem; font-weight: 400; line-height: 1.05; }
.procurement-grid p { margin: 0; color: #625f58; font-size: .9rem; }
.product-process ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 0; padding: 0; list-style: none; background: var(--line); }
.product-process li { min-height: 180px; padding: 28px; background: var(--paper); }
.product-process strong { display: block; margin-bottom: 18px; font-family: var(--display); font-size: 2rem; font-weight: 400; }
.product-process span { color: #625f58; font-size: .9rem; }
.product-faq { display: grid; grid-template-columns: .75fr 1.25fr; gap: 8vw; }
.product-faq details { border-top: 1px solid var(--line); }
.product-faq details:last-child { border-bottom: 1px solid var(--line); }
.product-faq summary { cursor: pointer; padding: 22px 0; font-family: var(--display); font-size: 1.8rem; list-style: none; }
.product-faq summary::-webkit-details-marker { display: none; }
.product-faq p { margin: 0 0 24px; color: #625f58; }
.related-products { padding-bottom: 120px; }

@media (max-width: 980px) {
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .legacy-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .series-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-detail { grid-template-columns: 1fr; }
  .product-detail-image { min-height: auto; aspect-ratio: 1 / 1; }
  .catalog-contact, .product-procurement, .product-faq { grid-template-columns: 1fr; }
  .seo-intro, .category-seo-copy { grid-template-columns: 1fr; }
  .product-process ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .catalog-hero { padding: 100px 24px 60px; }
  .catalog-hero h1 { font-size: 3.7rem; }
  .catalog-main { padding: 40px 24px 80px; }
  .catalog-filter { flex-wrap: nowrap; margin-right: -24px; overflow-x: auto; padding-right: 24px; }
  .catalog-filter a { flex: 0 0 auto; }
  .legacy-category-grid { grid-template-columns: 1fr; }
  .legacy-category-card { min-height: 300px; }
  .product-grid { grid-template-columns: 1fr; gap: 34px; }
  .series-grid { grid-template-columns: 1fr; }
  .series-card { min-height: 390px; }
  .product-image { padding-bottom: 108%; }
  .product-image span { opacity: 1; transform: none; }
  .catalog-contact { padding: 80px 24px; }
  .catalog-footer { align-items: flex-start; flex-direction: column; gap: 25px; padding: 38px 24px; }
  .product-detail-copy { padding: 70px 24px; }
  .back-link { margin-bottom: 45px; }
  .product-back-overlay { top: 18px; left: 18px; min-height: 42px; padding: 0 15px; }
  .product-procurement, .product-process, .product-faq, .related-products { padding: 75px 24px; }
  .procurement-grid, .product-process ol { grid-template-columns: 1fr; }
  .procurement-grid article, .product-process li { padding: 24px; }
  .product-faq summary { font-size: 1.45rem; }
  html[lang="zh-CN"] .hero h1,
  html[lang="zh-CN"] .catalog-hero h1,
  html[lang="zh-CN"] .project-case-hero h1,
  html[lang="zh-CN"] .project-archive-hero h1,
  html[lang="zh-CN"] .journal-hero h1,
  html[lang="zh-CN"] .article-detail-header h1,
  html[lang="zh-CN"] .product-detail-copy h1 {
    font-size: clamp(2.65rem, 12vw, 4.25rem);
    line-height: 1.12;
  }
}