/* Home-only refinements: brand hierarchy, readable light sections, and flow progress. */
.section-heading h2 span { color: #42595b; }
.dark .section-heading h2 span { color: #b8cbc7; }

.brand-hero {
  min-height: 100vh;
  min-height: 100svh;
  align-items: center;
}
.business-hero-plain { background: var(--ink); }
.brand-hero-content { max-width: 960px; }
.brand-statement { display: grid; gap: 5px; margin: 0 0 22px !important; color: #e2ebe7 !important; font-size: clamp(14px, 1.45vw, 20px) !important; line-height: 1.25 !important; }
.brand-statement span { color: #b8cbc7; }
.brand-statement strong { color: #fff; font-weight: 600; }
.hero-brand-lockup { --brand-word-size: clamp(78px, 7.35vw, 118px); display: flex; align-items: center; gap: clamp(20px, 2.5vw, 40px); }
.hero-logo-mark { display: block; width: auto; height: calc(var(--brand-word-size) * 1.72); flex: 0 0 auto; object-fit: contain; }
.brand-hero .hero-brand-lockup h1 { margin: 0; font-size: var(--brand-word-size); line-height: .86; }
.brand-hero.placeholder-bg::after { align-items: flex-end; padding-bottom: 34px; }
.business-copy { max-width: 980px; }
.business-copy h2 { font-size: clamp(42px, 5.2vw, 74px); line-height: 1.18; }
.business-copy h2 span { white-space: normal; }
html[lang="zh-CN"] .business-copy h2 span { white-space: nowrap; }

.home-flow-progress { position: relative; height: 5px; margin: 0 0 12px; background: #d6dedb; overflow: hidden; }
.home-flow-progress span { display: block; width: var(--flow-progress, 16.6667%); height: 100%; background: var(--red); transition: width .35s ease; }
.home-flow-grid .flow-step { cursor: pointer; }
.home-flow-grid .flow-step[aria-pressed="true"] { outline: 1px solid #d9e3df; outline-offset: -5px; }
.home-flow-grid .flow-step::after { content: ""; position: absolute; inset: 0; z-index: 0; background-image: var(--flow-image); background-position: center; background-size: cover; opacity: 0; filter: saturate(.72) contrast(1.08); transition: opacity .38s ease; }
.home-flow-grid .flow-step[aria-pressed="true"]::after { opacity: .24; }
.home-flow-gallery { position: relative; width: 100%; min-height: clamp(270px, 28vw, 400px); overflow: hidden; border: 1px solid #526467; border-top: 0; background: #111b1e; }
.home-flow-scene { position: absolute; inset: 0; margin: 0; background-color: #172528; background-image: var(--flow-image); background-position: center; background-size: cover; opacity: 0; transform: scale(1.015); transition: opacity .45s ease, transform .7s ease; }
.home-flow-scene::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #101a1c80, transparent 48%, #101a1c38); }
.home-flow-scene::after { content: attr(data-shot); position: absolute; right: 18px; bottom: 15px; color: #ffffffbf; font: 500 9px var(--mono); letter-spacing: .12em; }
.home-flow-scene.active { opacity: 1; transform: none; }
.home-flow-step-1, .home-flow-scene[data-flow-index="0"] { --flow-image: radial-gradient(ellipse at 70% 56%, #bcc8c2 0 7%, #60777a 8% 21%, #1d3033 22% 38%, transparent 39%), linear-gradient(125deg, #40585b, #142326 68%); }
.home-flow-step-2, .home-flow-scene[data-flow-index="1"] { --flow-image: linear-gradient(118deg, #223538 0 28%, #91a5a0 29% 31%, #263b3e 32% 61%, #c1cac4 62% 64%, #172629 65%); }
.home-flow-step-3, .home-flow-scene[data-flow-index="2"] { --flow-image: linear-gradient(145deg, transparent 0 36%, #d1d8d1 37% 43%, transparent 44%), linear-gradient(30deg, #31494c 0 47%, #18272a 48% 100%); }
.home-flow-step-4, .home-flow-scene[data-flow-index="3"] { --flow-image: repeating-linear-gradient(90deg, transparent 0 74px, #d5ddd61f 75px 78px), radial-gradient(ellipse at 66% 50%, #d6dcd5 0 5%, #627779 6% 18%, #19282b 19% 37%, transparent 38%), linear-gradient(130deg, #536b6d, #142225 70%); }
.home-flow-step-5, .home-flow-scene[data-flow-index="4"] { --flow-image: linear-gradient(112deg, #132124 0 34%, #a8b6b0 35% 37%, #2d4447 38% 68%, #d8ded8 69% 71%, #172629 72%), repeating-linear-gradient(0deg, transparent 0 25px, #ffffff14 26px 27px); }
.home-flow-step-6, .home-flow-scene[data-flow-index="5"] { --flow-image: radial-gradient(circle at 72% 45%, #c8d1cb 0 4%, #5e7577 5% 17%, #1b2c2f 18% 34%, transparent 35%), linear-gradient(138deg, #718789, #172629 64%); }
.home-flow-link { display: flex; justify-content: flex-end; margin-top: 20px; }

.project-visual-tile { position: relative; min-height: 190px; overflow: hidden; background: linear-gradient(138deg, #799092 0%, #2c4446 46%, #172629 100%); }
.project-visual-tile::before { content: ""; position: absolute; width: 145px; height: 145px; right: 12%; top: 17%; border: 15px solid #d6ddda; border-radius: 50%; box-shadow: 0 0 0 20px #1c3033; opacity: .9; }
.project-visual-tile::after { content: none; }

#home-materials { scroll-margin-top: 78px; }

@media (max-width: 760px) {
  .brand-statement { margin-bottom: 16px !important; font-size: 14px !important; }
  .hero-brand-lockup { --brand-word-size: clamp(32px, 10.2vw, 42px); gap: 10px; }
  .business-copy h2 { font-size: clamp(28px, 8.2vw, 34px); line-height: 1.2; }
  .home-flow-gallery { min-height: 230px; }
  .home-flow-link { justify-content: stretch; }
  .home-flow-link .button { width: 100%; }
}