:root {
  --black: #000;
  --near-black: #060708;
  --ink: #161719;
  --ink-soft: #45484c;
  --muted: #858a90;
  --paper: #f2f4f8;
  --paper-deep: #e7e9ed;
  --line: rgba(17, 19, 22, .12);
  --radius: 32px;
  --gutter: 16px;
  --sans: "FZLanTingHeiS-R-GB", "方正兰亭黑简体", "Lantinghei SC", "PingFang SC", "Microsoft YaHei UI", "Microsoft YaHei", sans-serif;
  --serif: Georgia, "Times New Roman", "Songti SC", serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { min-height: 100%; background: var(--black); }
body { min-width: 320px; margin: 0; color: var(--ink); background: var(--black); font-family: var(--sans); font-weight: 400; overflow-x: hidden; }
body.is-editing [data-edit-id], body.is-editing [data-project-field] { outline: 1px dashed rgba(77, 133, 184, .8); outline-offset: 4px; cursor: text; }
body.is-editing [data-image-id], body.is-editing [data-detail-media] { outline: 2px dashed rgba(77, 133, 184, .85); outline-offset: 4px; cursor: pointer; }
body.is-editing [data-layout-id] { transition: outline-color .2s ease; }
body.is-editing [data-layout-id].is-layout-selected { outline: 2px solid #168cff; outline-offset: 7px; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
img { display: block; max-width: 100%; }
::selection { color: #fff; background: #1e3448; }
.skip-link { position: fixed; left: 14px; top: -80px; z-index: 200; padding: 10px 14px; color: #000; background: #fff; }
.skip-link:focus { top: 14px; }

.app-view { display: none; min-height: 100svh; animation: viewIn .65s cubic-bezier(.2, .7, .2, 1) both; }
.app-view.is-active { display: block; }
@keyframes viewIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.page-wipe { position: fixed; z-index: 150; inset: 0; pointer-events: none; background: #050607; transform: scaleY(0); transform-origin: bottom; }
.page-wipe.is-moving { animation: wipe .62s cubic-bezier(.76, 0, .24, 1); }
@keyframes wipe { 0% { transform: scaleY(0); transform-origin: bottom; } 48% { transform: scaleY(1); transform-origin: bottom; } 52% { transform: scaleY(1); transform-origin: top; } 100% { transform: scaleY(0); transform-origin: top; } }

/* 点击中心姓名后的首页揭幕层 */
.wordmark-reveal { position: relative; z-index: 155; height: 185svh; background: transparent; pointer-events: none; }
.wordmark-reveal-sticky { position: sticky; top: 0; height: 100svh; overflow: hidden; will-change: transform; transform: translate3d(0, 0, 0); }
.wordmark-reveal-sticky > div { height: 100%; }
.wordmark-reveal .hero { height: calc(100svh - 32px); min-height: 0; }
body.is-wordmark-revealing { overflow-x: hidden; }
body.is-wordmark-revealing [data-view="about"].is-active { position: fixed; z-index: 0; inset: 0; display: block; overflow: hidden; }
.app-view[data-view="about"] { animation: none; }

.room { position: relative; margin: var(--gutter); border-radius: var(--radius); overflow: hidden; }
.notched::before { content: ""; position: absolute; z-index: 12; left: 50%; top: -1px; width: 142px; height: 35px; border-radius: 0 0 72px 72px; transform: translateX(-50%); background: #000; pointer-events: none; }
.paper-page { background: radial-gradient(circle at 56% 30%, #fafbfc 0%, var(--paper) 52%, var(--paper-deep) 100%); }
.eyebrow { margin: 0 0 16px; color: var(--muted); font-family: var(--serif); font-size: 12px; font-weight: 400; }

/* 始终展开的顶部导航 */
.nav-shell {
  position: fixed; z-index: 160; left: 50%; top: 0; width: min(760px, calc(100vw - 32px)); height: 49px;
  border-radius: 0 0 28px 28px; color: #fff; background: #000;
  box-shadow: 0 18px 42px rgba(0, 0, 0, .2);
  transform: translateX(-50%); overflow: hidden;
}
.nav-inner { height: 49px; display: grid; grid-template-columns: 1fr 116px 1fr; align-items: center; }
.wordmark { position: relative; z-index: 2; width: 116px; height: 49px; border: 0; padding: 0 0 8px; color: #fff; background: transparent; cursor: pointer; font-family: var(--sans); font-size: 15px; font-weight: 500; letter-spacing: .08em; }
.nav-group { min-width: 0; display: flex; align-items: center; justify-content: space-evenly; gap: 28px; opacity: 1; visibility: visible; transform: none; }
.nav-group a { white-space: nowrap; font-size: 10px; font-weight: 500; letter-spacing: .025em; opacity: .58; transition: opacity .2s ease; }
.nav-group a:hover, .nav-group a:focus-visible, .nav-group a.is-current { opacity: 1; }

/* 鼠标跟随 */
.cursor-dot, .cursor-ring { position: fixed; z-index: 170; left: 0; top: 0; pointer-events: none; border-radius: 50%; opacity: 0; transform: translate(-50%, -50%); transition: opacity .2s ease; }
.cursor-dot { width: 5px; height: 5px; background: #fff; mix-blend-mode: difference; }
.cursor-ring { width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.55); mix-blend-mode: difference; }
body.has-pointer .cursor-dot, body.has-pointer .cursor-ring { opacity: 1; }
body.over-action .cursor-ring { width: 58px; height: 58px; background: rgba(255,255,255,.12); }

/* 首页 */
.hero { min-height: calc(100svh - 32px); color: #fff; background: radial-gradient(ellipse 68% 66% at 50% 38%, #18364d 0%, #102638 34%, #09151f 64%, #05070a 100%); }
.hero::after { content: ""; position: absolute; inset: 0; opacity: .28; background-image: linear-gradient(rgba(255,255,255,.012) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.012) 1px, transparent 1px); background-size: 60px 60px; }
.hero-glow { position: absolute; z-index: 1; left: 50%; top: 42%; width: min(55vw, 760px); aspect-ratio: 1; border-radius: 50%; transform: translate(-50%, -50%); background: radial-gradient(circle, rgba(90, 139, 173, .22), rgba(25, 55, 77, .08) 38%, transparent 70%); filter: blur(18px); will-change: transform; }
.hero-center { position: absolute; z-index: 3; left: 50%; top: 48%; width: min(710px, 74vw); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 28px; transform: translate(-50%, -50%); }
.hero-center p { margin: 0; white-space: nowrap; font-size: 13px; font-weight: 500; letter-spacing: .025em; }
.hero-center p:last-child { font-weight: 300; }
.hero-line { height: 1px; background: rgba(255,255,255,.28); transform-origin: center; }
.hero-foot { position: absolute; z-index: 3; left: 50%; bottom: 7.5%; width: min(650px, calc(100% - 48px)); text-align: center; transform: translateX(-50%); }
.hero-foot p { margin: 0 auto 17px; font-size: 13px; font-weight: 500; line-height: 1.55; letter-spacing: .005em; }
.hero-foot span { color: rgba(255,255,255,.5); font-family: var(--serif); font-size: 11px; letter-spacing: .05em; }
.hero-enter { position: absolute; z-index: 4; right: 28px; bottom: 26px; display: flex; align-items: center; gap: 20px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; padding: 9px 10px 9px 16px; color: rgba(255,255,255,.72); background: rgba(0,0,0,.2); cursor: pointer; font-size: 10px; }
.hero-enter i { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; color: #111; background: #fff; font-style: normal; }

/* 关于 */
.about-page { min-height: calc(100svh - 32px); padding: 175px 7vw 120px; }
.page-heading { display: grid; grid-template-columns: 31% 1fr; gap: 9%; min-height: 590px; align-items: center; }
.page-heading h1 { max-width: 920px; margin: 0; color: var(--ink-soft); font-size: clamp(34px, 4.7vw, 72px); font-weight: 400; line-height: 1.05; letter-spacing: -.055em; }
.page-heading h1 span { color: #c4c8ce; }
.page-heading .about-summary { display: grid; gap: 18px; font-family: var(--sans); font-size: clamp(21px, 2.15vw, 34px); font-weight: 400; line-height: 1.45; letter-spacing: -.035em; }
.page-heading .about-summary span { display: block; color: var(--ink-soft); }
.career-display { width: min(1040px, 88%); margin: 0 auto; padding: 100px 0 200px; }
.career-line { display: grid; grid-template-columns: 1fr 118px; align-items: baseline; color: #c6c9ce; transition: color .3s ease, transform .3s ease; }
.career-line:hover { color: #3d4044; transform: translateX(8px); }
.career-line.is-current { color: #3d4044; }
.career-line strong { font-family: var(--serif); font-size: clamp(48px, 7vw, 104px); font-weight: 400; line-height: 1.02; letter-spacing: -.06em; }
.career-line--first strong { font-family: Arial, sans-serif; font-size: 80px; letter-spacing: -.045em; }
.career-line--current strong { font-family: Inter, Arial, sans-serif; font-size: 80px; letter-spacing: -.045em; }
.career-line time { color: #858a90; font-family: var(--serif); font-size: 12px; font-weight: 400; }
.career-note { width: min(760px, 82%); margin: 14px 0 56px; padding-left: 8px; color: #666b71; font-size: 14px; line-height: 1.9; letter-spacing: .01em; }
.career-note p { margin: 0; }
.career-note--current { margin-top: 14px; margin-bottom: 36px; }
.split-section { display: grid; grid-template-columns: 31% 1fr; gap: 9%; padding: 70px 0 60px; }
.section-copy h2 { margin: 0 0 20px; color: var(--ink-soft); font-size: 32px; font-weight: 500; letter-spacing: -.045em; }
.section-copy > p:last-child { max-width: 390px; margin: 0; color: #74787e; font-family: var(--serif); font-size: 17px; line-height: 1.48; }
.info-table { border-top: 1px solid var(--line); }
.info-row--profile { grid-template-columns: 125px 1fr; min-height: 118px; align-items: start; padding: 24px 0; font-size: 15px; line-height: 1.9; }
.info-row--profile strong { font-family: var(--sans); font-size: 18px; font-weight: 500; }
.info-row--profile strong span { display: block; margin-top: 2px; color: #a4a8ad; font-size: 10px; font-weight: 400; letter-spacing: .08em; }
.software-list { display: flex; flex-wrap: wrap; gap: 16px 24px; }
.software-item { min-width: 92px; display: inline-flex; align-items: center; gap: 9px; color: #555b63; font-family: var(--sans); }
.software-item b { font-size: 12px; font-weight: 500; }
.software-icon { width: 25px; height: 25px; flex: 0 0 25px; overflow: visible; color: inherit; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.software-icon text { fill: currentColor; stroke: none; font-family: Arial, sans-serif; font-size: 10px; font-weight: 700; }
.info-row { min-height: 76px; display: grid; grid-template-columns: 1.2fr 1fr auto; align-items: center; gap: 24px; border-bottom: 1px solid var(--line); font-size: 12px; }
.info-row strong { font-weight: 500; }
.info-row span { color: #858a90; font-family: var(--serif); }
.info-row time { font-size: 11px; font-weight: 500; }
.info-row.info-row--profile { grid-template-columns: 125px 1fr; }
.about-page .info-table .info-row--profile:first-child > div,
.about-page .info-table .info-row--profile:last-child > div { color: rgb(133, 138, 144); }

/* 项目列表：纵向滚动同步横向画廊 */
.work-page { min-height: calc(100svh - 32px); overflow: visible; color: #fff; background: transparent; }
.work-sticky { position: sticky; top: var(--gutter); width: 100%; height: calc(100svh - 32px); display: flex; align-items: center; overflow: hidden; border-radius: var(--radius); background: radial-gradient(circle at 50% 48%, #0c1218 0%, #050608 55%, #020202 100%); }
.work-rail { width: 100%; display: flex; gap: clamp(22px, 2.8vw, 42px); overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: none; scrollbar-width: none; padding: 100px max(5vw, 34px) 82px; touch-action: pan-x; }
.work-rail::-webkit-scrollbar { display: none; }
.project-card { position: relative; flex: 0 0 clamp(290px, 29vw, 410px); height: clamp(430px, 57vh, 560px); overflow: hidden; border: 0; border-radius: 11px; padding: 0; color: #fff; background: #111; cursor: pointer; scroll-snap-align: center; text-align: left; opacity: 1; filter: blur(0); transform: translateZ(0); transition: opacity .45s ease, filter .45s ease, transform .45s cubic-bezier(.2,.7,.2,1); }
.project-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2,.7,.2,1), filter .5s ease; }
.project-card::after { content: ""; position: absolute; inset: 35% 0 0; background: linear-gradient(transparent, rgba(0,0,0,.82)); }
.project-card:hover img { transform: scale(1.03); filter: contrast(1.06); }
@media (hover: hover) and (pointer: fine) {
  .work-rail:has(.project-card:hover) .project-card:not(:hover) { opacity: .4; filter: blur(4px); transform: scale(.985); }
}
.project-caption { position: absolute; z-index: 2; left: 28px; right: 28px; bottom: 27px; text-align: center; }
.project-caption small { display: block; margin-bottom: 9px; color: rgba(255,255,255,.65); font-family: var(--serif); font-size: 11px; font-weight: 400; }
.project-caption strong { display: block; font-size: clamp(19px,1.55vw,24px); font-weight: 400; line-height: 1.12; letter-spacing: -.025em; }
.rail-hint { position: absolute; left: 50%; bottom: 28px; width: min(380px, 54vw); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; color: rgba(255,255,255,.34); font-size: 9px; transform: translateX(-50%); }
.rail-hint i { height: 1px; background: rgba(255,255,255,.15); }

/* 人工智能实验室，四列方图 + 惯性 */
.lab-page { min-height: calc(100svh - 32px); display: grid; place-items: center; color: #bab8b9; background: #111; }
.lab-toolbar { position: absolute; z-index: 4; left: 0; top: 0; width: 100%; min-height: 86px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 18px 25px; border-bottom: 1px solid #323232; }
.lab-toolbar p { margin: 0; font-size: 21px; font-weight: 300; }
.lab-toolbar p strong { color: #f0f0f0; font-weight: 500; }
.lab-toolbar > div:last-child { display: flex; justify-content: flex-end; }
.lab-pill, .lab-toolbar button { min-height: 46px; display: inline-flex; align-items: center; gap: 8px; border-radius: 24px; padding: 0 18px; font-size: 11px; font-weight: 500; }
.lab-pill { background: #232323; }
.lab-pill b { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; color: #151515; background: #dedede; font-family: var(--serif); }
.lab-toolbar button { border: 1px solid #323232; color: #bab8b9; background: transparent; cursor: pointer; }
.lab-medias { width: min(920px, 76vw); display: grid; grid-template-columns: repeat(3, 1fr); gap: 1vw; padding: 120px 0 50px; }
.lab-media { position: relative; aspect-ratio: 1; overflow: hidden; border: 0; border-radius: 4%; padding: 0; background: #1f2326; cursor: pointer; }
.lab-media img { width: 100%; height: 100%; object-fit: cover; pointer-events: none; will-change: transform; filter: saturate(.5) brightness(.95); }
body.is-editing .lab-media img { pointer-events: auto; }
.lab-media span { position: absolute; z-index: 2; left: 12px; right: 12px; bottom: 11px; color: rgba(255,255,255,.72); font-size: 9px; font-weight: 400; text-align: left; opacity: 0; transform: translateY(6px); transition: .25s ease; }
.lab-media:hover span { opacity: 1; transform: none; }
.lab-ghost { opacity: .55; }

/* 项目详情 */
.detail-hero { min-height: calc(100svh - 32px); color: #fff; background: #090b0e; }
.detail-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.66) saturate(.6); }
.detail-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.28), rgba(0,0,0,.1) 38%, rgba(0,0,0,.8)); }
.detail-title-wrap { position: absolute; z-index: 3; left: 6.5vw; right: 6.5vw; bottom: 9%; }
.detail-title-wrap > p { margin: 0 0 16px; color: rgba(255,255,255,.62); font-family: var(--serif); font-size: 12px; }
.detail-title-wrap h1 { max-width: 1020px; margin: 0 0 46px; font-size: clamp(54px, 9vw, 132px); font-weight: 400; line-height: .92; letter-spacing: -.065em; }
.detail-title-wrap h1.is-project-title { width: 100%; max-width: none; white-space: nowrap; }
.detail-meta { max-width: 740px; display: grid; grid-template-columns: repeat(3,1fr); gap: 34px; margin: 0; }
.detail-meta div { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: baseline; }
.detail-meta dt { color: rgba(255,255,255,.48); font-size: 9px; font-weight: 500; }
.detail-meta dd { margin: 0; font-family: var(--serif); font-size: 11px; }
.is-lab-detail .detail-meta { display: none; }
.scroll-cue { position: absolute; z-index: 3; right: 28px; bottom: 27px; display: flex; align-items: center; gap: 16px; border: 0; color: rgba(255,255,255,.58); background: transparent; cursor: pointer; font-size: 10px; }
.scroll-cue span { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; }
.detail-story { padding: 145px 7vw 120px; }
.story-columns { display: grid; grid-template-columns: repeat(3,1fr); gap: 7vw; padding-bottom: 150px; }
.new01-story-heading { margin: 0 0 54px; color: #62666c; font-family: var(--serif); font-size: clamp(24px, 3vw, 42px); font-weight: 400; letter-spacing: -.03em; }
.story-columns section > p:last-child { margin: 0; color: #62666c; font-family: "Inter Variable", Arial, sans-serif; font-size: clamp(18px, 1.6vw, 24px); line-height: 1.45; }
.new04-project-heading { grid-column: 1 / -1; padding-bottom: 72px; text-align: center; }
.new04-project-heading h2 { margin: 0; color: #7c838d; font-family: "Inter Variable", Arial, sans-serif; font-size: clamp(46px, 5.3vw, 70px); font-weight: 200; line-height: 1; letter-spacing: -.045em; }
.new04-project-heading p { margin: 20px 0 0; color: #bbc2ce; font-family: system-ui, sans-serif; font-size: clamp(16px, 1.55vw, 24px); }
.new04-project-heading--gallery { margin-top: 18px; padding: 84px 0 0; border-top: 1px solid #bbc2ce; }
.is-new04-detail .story-columns { display: none; }
.new05-project-heading { padding-top: 84px; border-top: 1px solid #bbc2ce; }
.is-new05-detail .story-columns { display: none; }
.is-new07-detail .story-columns { display: none; }
.is-new03-detail .story-columns { display: none; }
.is-new06-detail .story-columns,
.is-new08-detail .story-columns { display: none; }
.is-new09-detail .story-columns { display: none; }
.is-new09-detail .detail-meta { grid-template-columns: repeat(2, 1fr); }
.is-new09-detail .detail-meta > div:nth-child(2) { display: none; }
.is-new04-detail .detail-meta { grid-template-columns: repeat(2, 1fr); }
.is-new04-detail .detail-meta > div:nth-child(2) { display: none; }
.is-new05-detail .detail-meta, .is-new06-detail .detail-meta { grid-template-columns: repeat(2, 1fr); }
.is-new05-detail .detail-meta > div:nth-child(2), .is-new06-detail .detail-meta > div:nth-child(2) { display: none; }
.is-petroleum-detail .story-columns { grid-template-columns: minmax(180px, .75fr) minmax(170px, .65fr) minmax(420px, 1.6fr); gap: clamp(32px, 4vw, 64px); padding-bottom: 68px; }
.is-vanke-detail .story-columns { display: none; }
.is-vanke-detail [data-layout-id="feature-gallery"] { display: none !important; }
.t9-story-wide { margin: 0 0 120px; }
.t9-story-wide img { display: block; width: 100%; height: auto; aspect-ratio: auto; object-fit: contain; border-radius: 11px; background: #d9dce1; }
.is-t3-detail .detail-story { --line: rgba(255,255,255,.14); margin: 0; border-radius: 0; color: #d9dce0; background: transparent; overflow: visible; }
.is-t3-detail .detail-story.notched::before { display: none; }
.is-t3-detail .story-columns { grid-template-columns: minmax(170px, .72fr) minmax(340px, 1.62fr) minmax(190px, .82fr); gap: clamp(42px, 6vw, 96px); }
.is-t3-detail .story-columns section { padding-top: 18px; border-top: 1px solid var(--line); }
.is-t3-detail .story-columns section > p:last-child { color: #b6bac0; }
.is-t3-detail .story-columns .eyebrow, .is-t3-detail .detail-gallery figcaption { color: #767b82; }
.is-t3-detail .concept-legend b, .is-t3-detail .t3-delivery-story b { color: #b2b6bc; }
.is-t3-detail .concept-legend p, .is-t3-detail .t3-delivery-story p, .is-t3-detail .t3-comparison-intro p { color: #858a91; }
.is-dark-detail .detail-story { --line: rgba(255,255,255,.14); margin: 0; border-radius: 0; color: #fff; background: #000; overflow: visible; }
.is-dark-detail .detail-story.notched::before { display: none; }
.is-dark-detail .story-columns section > p:last-child,
.is-dark-detail .story-columns .eyebrow,
.is-dark-detail .detail-gallery figcaption,
.is-dark-detail .new10-story-intro,
.is-dark-detail .new01-story-heading,
.is-dark-detail .new04-project-heading h2,
.is-dark-detail .new04-project-heading p { color: #f2f2f2; }
.is-dark-detail .new04-project-heading--gallery,
.is-dark-detail .new05-project-heading { border-color: rgba(255,255,255,.2); }
.detail-gallery { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 84px 24px; }
.detail-gallery figure { margin: 0; }
.detail-gallery figure.media-wide { grid-column: 1 / -1; }
.detail-gallery figcaption { min-height: 34px; display: flex; justify-content: space-between; align-items: center; color: #74787e; font-family: var(--serif); font-size: 11px; }
.detail-gallery figcaption b { font-family: var(--sans); font-size: 10px; font-weight: 500; }
.new02-caption-specific { display: none; }
.is-new02-detail .new02-caption-default { display: none; }
.is-new02-detail .new02-caption-specific { display: inline; }
.is-new02-detail .story-columns { display: none; }
.detail-gallery figure img { width: 100%; aspect-ratio: 4/5; object-fit: cover; border-radius: 11px; background: #d9dce1; }
#project-detail img { background-color: transparent !important; }
.detail-gallery figure.media-wide img { aspect-ratio: 16/9; }
.is-lab01-detail .detail-gallery > :not([data-lab01-gallery]) { display: none !important; }
.lab01-pair { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.lab01-pair--mixed { grid-template-columns: minmax(0, 4fr) minmax(0, 3fr); }
.detail-gallery .lab01-pair--mixed figure:first-child img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; }
.detail-gallery .lab01-pair--mixed figure:last-child img,
.detail-gallery .lab01-pair--portrait img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.detail-gallery .lab01-pair--landscape img,
.detail-gallery .lab01-single img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.lab01-single { grid-column: 1 / -1; }
.is-lab02-detail .story-columns { display: none; }
.is-lab02-detail .detail-gallery > :not([data-lab02-gallery]) { display: none !important; }
.lab02-pair { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.lab02-pair--mixed { grid-template-columns: minmax(0, 4fr) minmax(0, 3fr); }
.detail-gallery .lab02-pair--landscape img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.detail-gallery .lab02-pair--portrait img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.detail-gallery .lab02-pair--mixed figure:first-child img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; }
.detail-gallery .lab02-pair--mixed figure:last-child img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.lab02-panorama { grid-column: 1 / -1; }
.detail-gallery .lab02-panorama img { width: 100%; height: auto; aspect-ratio: 21/8; object-fit: cover; }
.is-lab03-detail .story-columns { display: none; }
.is-lab03-detail .detail-gallery > :not([data-lab03-gallery]) { display: none !important; }
.lab03-pair { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.detail-gallery .lab03-pair img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.is-lab05-detail .story-columns { display: none; }
.is-lab05-detail .detail-gallery > :not([data-lab05-gallery]) { display: none !important; }
.lab05-pair { grid-column: 1 / -1; display: grid; gap: 24px; align-items: start; }
.lab05-pair--mixed { grid-template-columns: minmax(0, 4fr) minmax(0, 3fr); }
.detail-gallery .lab05-pair--mixed figure:first-child img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; }
.detail-gallery .lab05-pair--mixed figure:last-child img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.lab05-pair--square-landscape { grid-template-columns: minmax(0, 3fr) minmax(0, 4fr); }
.detail-gallery .lab05-pair--square-landscape figure:first-child img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; }
.detail-gallery .lab05-pair--square-landscape figure:last-child img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.is-lab06-detail .story-columns { display: none; }
.is-lab06-detail .detail-gallery > :not([data-lab06-gallery]) { display: none !important; }
.lab06-wide { grid-column: 1 / -1; }
.detail-gallery .lab06-wide img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.lab06-pair { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.detail-gallery .lab06-pair--portrait img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.detail-gallery .lab06-pair--square img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; }
.energy-main-pair { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 16fr) minmax(0, 9fr); gap: 24px; align-items: start; }
.energy-main-pair figure { display: grid; grid-template-rows: 34px auto; }
.detail-gallery .energy-main-pair .energy-main-wide img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.detail-gallery .energy-main-pair .energy-main-square img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; }
.energy-square-pair { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.energy-square-pair figure { display: grid; grid-template-rows: 34px auto; }
.detail-gallery .energy-square-pair img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; }
.detail-gallery .energy-wide img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.detail-gallery .energy-completion img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.is-energy-detail .concept-stage { min-height: 0; padding: 64px 0; }
.is-energy-detail .concept-stage blockquote { margin: 0 auto; }
.is-energy-detail .story-columns { grid-template-columns: minmax(210px, 1fr) minmax(230px, 1.08fr) minmax(340px, 1.55fr); gap: clamp(32px, 4.5vw, 72px); }
.is-energy-detail .t3-feature-bottom { grid-column: 1 / -1; }
.is-energy-detail .detail-gallery .t3-feature-bottom img,
.is-energy-detail .detail-gallery .t3-feature-bottom img.layout-ratio-wide { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.new-project-gallery { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 84px 24px; }
.new-project-gallery .new-project-wide { grid-column: 1 / -1; }
.new-project-mixed-row { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.new-project-new02-pair { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr; }
.new-project-new02-portrait-pair { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr; }
.new-project-new02-portrait-pair > .new-project-wide { grid-column: auto; }
.detail-gallery .new-project-new02-portrait-pair > .new-project-wide img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.detail-gallery .new-project-new02-pair .new-project-08 img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.is-new02-detail .new-project-new02-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.is-new02-detail .detail-gallery .new-project-new02-pair img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.is-new02-detail .new-project-new02-portrait-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.is-new02-detail .detail-gallery .new-project-new02-portrait-pair img,
.is-new02-detail .detail-gallery .new-project-new02-portrait-pair > .new-project-wide img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.is-new03-detail .new-project-pair-06 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.is-new03-detail .detail-gallery .new-project-pair-06 img,
.is-new03-detail .detail-gallery .new-project-pair-06 > .new-project-wide img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.is-new04-detail .new-project-new02-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.is-new04-detail .detail-gallery .new-project-new02-pair img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.is-new04-detail .new-project-pair-06 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 84px 24px; align-items: start; }
.is-new04-detail .detail-gallery .new-project-pair-06 > .new-project-wide img,
.is-new04-detail .detail-gallery .new-project-pair-06 .new04-landscape img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.is-new04-detail .detail-gallery .new-project-pair-06 .new04-portrait img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.is-new04-detail .new04-port-row-square,
.is-new04-detail .new04-port-row-portrait { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.is-new04-detail .detail-gallery .new04-port-row-square img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; }
.is-new04-detail .detail-gallery .new04-port-row-portrait img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.is-new04-detail .detail-gallery .new04-port-wide img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.is-new05-detail .new-project-pair-01 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.is-new05-detail .detail-gallery .new-project-pair-01 img,
.is-new05-detail .detail-gallery .new-project-pair-01 > .new-project-wide img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.is-new05-detail .detail-gallery .new05-row-4x3 img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.is-new05-detail .detail-gallery .new05-row-3x4 img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.is-new05-detail [data-new05-item09-replaced] { display: none !important; }
.is-new05-detail .new05-four-grid-07 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 84px 24px; }
.is-new05-detail .detail-gallery .new05-four-grid-07 img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.is-new05-detail .new05-row-16x9--08 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.is-new05-detail .detail-gallery .new05-row-16x9--08 img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.is-new06-detail [data-new06-remove],
.is-new01-detail [data-new01-item07],
.is-new03-detail [data-new03-item07],
.is-new07-detail [data-new07-replaced],
.is-new09-detail [data-new09-remove],
.is-new09-detail [data-new09-remove-after05] { display: none !important; }
.is-new06-detail .new-project-pair-01 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.is-new06-detail .detail-gallery .new-project-pair-01 img,
.is-new06-detail .detail-gallery .new-project-pair-01 > .new-project-wide img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.is-new09-detail .new09-square-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.is-new09-detail .detail-gallery .new09-square-row img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; }
.is-new07-detail .new07-final-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 84px 24px; }
.is-new07-detail .detail-gallery .new07-final-grid figure:nth-child(-n+2) img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.is-new07-detail .detail-gallery .new07-final-grid figure:nth-child(n+3) img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; }
.is-new08-detail .new-project-pair-01 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.is-new08-detail .detail-gallery .new-project-pair-01 img,
.is-new08-detail .detail-gallery .new-project-pair-01 > .new-project-wide img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; }
.is-new08-detail .new-project-mixed-row--03-04 ~ * { display: none !important; }
.is-new09-detail .new09-project-heading { margin-bottom: -48px; padding-bottom: 0; }
.new10-story-intro { margin: 0 0 72px; font-size: clamp(34px, 5vw, 76px); font-weight: 300; letter-spacing: -.045em; line-height: 1.08; }
.is-new10-detail .new-project-gallery > :not([data-new10-extra]) { display: none !important; }
.is-new10-detail .new10-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.is-new10-detail .detail-gallery .new10-wide img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.is-new10-detail .detail-gallery .new10-row--portrait img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.is-new10-detail .detail-gallery .new10-row--landscape img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.detail-gallery .new-project-gallery .new-project-wide img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.detail-gallery .new-project-gallery .new-project-pair img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.is-new01-detail .story-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.is-new01-detail .new-project-mixed-row--03-04 { grid-template-columns: minmax(0, 64fr) minmax(0, 27fr); }
.is-new01-detail .detail-gallery .new-project-mixed-row--03-04 figure:first-child img { aspect-ratio: 16/9; }
.is-new01-detail .detail-gallery .new-project-mixed-row--03-04 figure:last-child img { aspect-ratio: 3/4; }
.is-new01-detail .new-project-mixed-row--10-11 { grid-template-columns: minmax(0, 4fr) minmax(0, 3fr); }
.is-new01-detail .detail-gallery .new-project-mixed-row--10-11 figure:first-child img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.is-new01-detail .detail-gallery .new-project-mixed-row--10-11 figure:last-child img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.is-new01-detail .new-project-mixed-row--13-14 { grid-template-columns: minmax(0, 4fr) minmax(0, 3fr); }
.is-new01-detail .detail-gallery .new-project-mixed-row--13-14 figure:first-child img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.is-new01-detail .detail-gallery .new-project-mixed-row--13-14 figure:last-child img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.is-new01-detail .new-project-mixed-row--15-16 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.is-new01-detail .detail-gallery .new-project-mixed-row--15-16 img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.is-new02-detail .new-project-mixed-row--03-04 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.is-new02-detail .detail-gallery .new-project-mixed-row--03-04 img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.detail-gallery figure[data-t3-extra-media] img { height: auto; aspect-ratio: auto; object-fit: contain; }
.concept-stage { grid-column: 1 / -1; min-height: 560px; display: grid; place-items: center; }
.concept-copy { width: 100%; }
.detail-gallery blockquote { max-width: 980px; margin: 80px auto; color: #8c9197; font-family: "Inter Variable", Arial, sans-serif; font-size: clamp(32px,5vw,70px); font-weight: 100; line-height: 1.02; text-align: center; letter-spacing: -.045em; }
.is-vanke-detail .concept-stage { min-height: 0; padding: 64px 0 12px; border-top: 1px solid var(--line); }
.is-vanke-detail .concept-stage blockquote { margin: 0 auto; }
.is-vanke-detail .concept-stage .t9-analysis-caption { margin: 18px 0 0; color: #74787e; font-family: var(--serif); font-size: 13px; line-height: 1.6; text-align: center; }
.is-petroleum-detail .concept-stage { min-height: 0; padding: 54px 0 22px; border-top: 1px solid var(--line); }
.is-petroleum-detail .concept-stage blockquote { margin: 0 auto; }
.is-petroleum-detail .petroleum-analysis-caption { margin: 18px 0 0; color: #74787e; font-family: var(--serif); font-size: 13px; line-height: 1.6; text-align: center; }
.is-vanke-detail .t9-analysis-three .concept-copy { display: grid; justify-items: center; gap: 18px; }
.is-vanke-detail .t9-analysis-three p { margin: 0; color: #74787e; font-family: var(--serif); font-size: 13px; line-height: 1.6; text-align: center; }
.detail-gallery blockquote span { display: block; }
.is-t3-detail .detail-gallery blockquote span:first-child { font-size: 40px; line-height: 1.15; }
.is-t3-detail .detail-gallery blockquote span:nth-child(2) { margin-top: 10px; font-size: 40px; font-weight: 300; line-height: 1.15; }
.is-t3-detail .concept-stage { grid-template-columns: minmax(0, 1fr) minmax(240px, 32%); gap: clamp(60px, 9vw, 140px); align-items: center; padding: 100px 4vw; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.is-t3-detail .detail-gallery blockquote { margin: 0 0 55px; text-align: left; }
.concept-legend { max-width: 520px; border-top: 1px solid var(--line); }
.concept-legend p { display: grid; grid-template-columns: 70px 1fr; gap: 24px; margin: 0; padding: 15px 0; border-bottom: 1px solid var(--line); color: #858a90; font-size: 11px; line-height: 1.5; }
.concept-legend b { color: #555a60; font-weight: 500; }
.concept-portrait { width: 100%; }
.detail-gallery .concept-portrait img { height: auto; aspect-ratio: auto; object-fit: contain; }
.detail-gallery figure[data-t3-original-media] img { height: auto; aspect-ratio: auto; object-fit: contain; }
.is-t3-detail .detail-gallery figure.t3-four-three img { aspect-ratio: 4/3; }
.t3-quartet { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.detail-gallery .t3-quartet figure img { aspect-ratio: 3/4; }
.t3-comparison-intro { grid-column: 1 / -1; padding: 34px 0 0; border-top: 1px solid var(--line); }
.t3-comparison-intro p { max-width: 620px; margin: 0; color: #6f747a; font-size: clamp(18px, 2vw, 28px); font-weight: 300; letter-spacing: -.025em; }
.t3-comparison-gallery { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.detail-gallery .t3-comparison-gallery figure img { aspect-ratio: 4/3; }
.t3-feature-layout { display: contents; }
.t3-feature-layout[hidden] { display: none !important; }
.is-t3-detail .t3-feature-layout { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.8fr); gap: 24px; align-items: stretch; }
.is-t3-detail .t3-feature-main { display: grid; grid-template-rows: 34px 1fr; }
.is-t3-detail .t3-feature-main img { width: 100%; height: auto; aspect-ratio: 9/16; object-fit: cover; }
.t3-feature-stack { display: contents; }
.is-t3-detail .t3-feature-stack { position: relative; min-width: 0; min-height: 0; align-self: stretch; display: block; }
.is-t3-detail .t3-feature-stack figure { position: absolute; left: 0; right: 0; height: calc((100% - 24px) / 2); min-height: 0; display: grid; grid-template-rows: 34px minmax(0, 1fr); }
.is-t3-detail .t3-feature-stack .t3-feature-top { top: 0; }
.is-t3-detail .t3-feature-stack .t3-feature-bottom { bottom: 0; }
.is-t3-detail .t3-feature-stack img { width: 100%; height: 100%; min-height: 0; aspect-ratio: auto; object-fit: cover; }
.detail-gallery .t3-added-wide img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.is-vanke-detail .detail-gallery > figure:first-child img { height: auto; aspect-ratio: 4/3; }
.detail-gallery figure.media-wide.t9-gallery-wide img,
.detail-gallery figure.media-wide.t9-gallery-wide img.layout-ratio-auto { display: block; width: 100%; height: auto; aspect-ratio: auto; object-fit: contain; }
.is-vanke-detail .t3-quartet { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.is-vanke-detail .t3-quartet figure:nth-child(3) { display: none; }
.is-vanke-detail .detail-gallery .t3-quartet figure img { height: auto; aspect-ratio: 4/3; object-fit: cover; }
.t9-original-gallery { grid-column: 1 / -1; display: grid; gap: 84px; }
.detail-gallery .t9-original-gallery figure img { width: 100%; height: auto; aspect-ratio: auto; object-fit: contain; }
.t9-feature-gallery { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 84px 24px; align-items: stretch; }
.t9-feature-main { display: grid; grid-template-rows: 34px minmax(0, 1fr); }
.is-vanke-detail .detail-gallery .t9-feature-main img { width: 100%; height: 100%; min-height: 0; aspect-ratio: 4/5; object-fit: cover; }
.t9-feature-right { display: grid; grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 24px; }
.t9-feature-right figure { min-height: 0; display: grid; grid-template-rows: 34px minmax(0, 1fr); }
.is-vanke-detail .detail-gallery .t9-feature-right img { width: 100%; height: 100%; min-height: 0; aspect-ratio: auto; object-fit: cover; }
.t9-feature-pair { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.t9-feature-pair figure { display: grid; grid-template-rows: 34px auto; }
.is-vanke-detail .detail-gallery .t9-feature-pair img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.petroleum-exhibit-grid { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 16fr) minmax(0, 9fr); gap: 84px 24px; align-items: stretch; }
.petroleum-exhibit-grid figure { display: grid; grid-template-rows: 34px minmax(0, 1fr); }
.detail-gallery .petroleum-exhibit-grid figure img { width: 100%; height: 100%; min-height: 0; object-fit: cover; }
.detail-gallery .petroleum-exhibit-grid .petroleum-ratio-wide img { aspect-ratio: 16/9; }
.detail-gallery .petroleum-exhibit-grid .petroleum-ratio-square img { aspect-ratio: 1/1; }
.petroleum-outcome-intro { grid-column: 1 / -1; padding: 58px 0 18px; border-top: 1px solid var(--line); text-align: center; }
.petroleum-outcome-intro h2 { margin: 0; color: #8c9197; font-size: clamp(38px, 5vw, 70px); font-weight: 100; line-height: 1.05; letter-spacing: -.045em; }
.petroleum-outcome-intro p { margin: 18px 0 0; color: #74787e; font-family: var(--serif); font-size: 13px; line-height: 1.6; }
.detail-gallery .petroleum-wide img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.detail-gallery figure.petroleum-original-ratio { align-self: start; height: max-content; }
.detail-gallery figure.petroleum-original-ratio img,
.detail-gallery figure.petroleum-original-ratio img.layout-ratio-auto { display: block; width: 100%; height: auto; aspect-ratio: auto !important; object-fit: contain; }
.petroleum-comparison-row { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.detail-gallery .petroleum-comparison-row img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.petroleum-review { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.petroleum-review article { min-width: 0; padding: 28px 24px 34px; border-right: 1px solid var(--line); }
.petroleum-review article:first-child { padding-left: 0; }
.petroleum-review article:last-child { padding-right: 0; border-right: 0; }
.petroleum-review article > span { color: #999da3; font-size: 10px; letter-spacing: .12em; }
.petroleum-review h3 { margin: 34px 0 18px; color: #777c83; font-size: 20px; font-weight: 400; letter-spacing: .04em; }
.petroleum-review p { margin: 0; color: #666b72; font-family: var(--serif); font-size: 14px; line-height: 1.9; }
.petroleum-review strong { display: block; margin: 0 0 10px; color: #545960; font-size: 18px; font-weight: 500; line-height: 1.45; }
.detail-gallery figure.petroleum-final-wide { align-self: start; height: max-content; }
.detail-gallery figure.petroleum-final-wide img,
.detail-gallery figure.petroleum-final-wide img.layout-ratio-auto { display: block; width: 100%; height: auto; aspect-ratio: auto !important; object-fit: contain; }
.detail-gallery > .layout-span-wide { grid-column: 1 / -1; }
.detail-gallery > .layout-span-half { grid-column: auto; }
.detail-gallery > .layout-hidden { display: none !important; }
.detail-gallery img.layout-ratio-wide { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.detail-gallery img.layout-ratio-square { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; }
.detail-gallery img.layout-ratio-portrait { width: 100%; height: auto; aspect-ratio: 9/16; object-fit: cover; }
.detail-gallery img.layout-ratio-auto { width: 100%; height: auto; aspect-ratio: auto; object-fit: contain; }
.custom-layout-block figcaption { min-height: 34px; }
.t3-delivery-story { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.t3-delivery-story > div { min-height: 150px; padding: 24px 22px; border-right: 1px solid var(--line); }
.t3-delivery-story > div:nth-child(5) { border-right: 0; }
.t3-delivery-story b { display: block; margin-bottom: 24px; color: #555a60; font-size: 11px; font-weight: 500; }
.t3-delivery-story p { margin: 0; color: #7b8086; font-size: 12px; line-height: 1.75; }
.t3-delivery-story .delivery-review { grid-column: 1 / -1; min-height: 0; display: grid; grid-template-columns: 120px 1fr; padding: 28px 22px; border-top: 1px solid var(--line); border-right: 0; }
.t3-delivery-story .delivery-review b { margin: 0; }
.delivery-review-items { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); background: transparent; }
.delivery-review-items p { display: grid; gap: 16px; padding: 0 26px; }
.delivery-review-items p + p { border-left: 1px solid var(--line); }
.delivery-review-items strong { color: #555a60; font-size: 11px; font-weight: 500; }
.delivery-review-items span { line-height: 1.75; }
.is-vanke-detail .t3-delivery-story { display: block; border-right: 0; }
.is-vanke-detail .t3-delivery-story > div:not(.delivery-review) { display: none; }
.is-vanke-detail .t3-delivery-story .delivery-review { grid-template-columns: 1fr; gap: 28px; padding: 30px 22px; border-top: 0; }
.is-vanke-detail .t3-delivery-story .delivery-review > b { margin: 0; font-size: clamp(24px, 3vw, 40px); font-weight: 400; letter-spacing: -.04em; }
.t9-preprocess-row { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.detail-gallery .t9-preprocess-row figure img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }
.t3-process-gallery { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 64px 24px; }
.detail-gallery .t3-process-gallery figure img { aspect-ratio: 4/3; }
.is-vanke-detail .detail-gallery .t3-process-gallery figure img { height: auto; aspect-ratio: 16/9; object-fit: cover; }

/* 联系页 */
.contact-page { min-height: calc(100svh - 32px); padding: 165px 7vw 110px; }
.contact-heading { min-height: 430px; }
.contact-card { display: grid; grid-template-columns: 1fr; margin-left: 40%; padding-top: 40px; }
.contact-list { border-top: 1px solid var(--line); }
.contact-item { min-height: 66px; display: grid; grid-template-columns: 76px 1fr 34px; align-items: center; border-bottom: 1px solid var(--line); font-size: 11px; }
.contact-item > span:first-child { font-weight: 500; }
.contact-value { min-width: 0; color: #7c8187; font-family: var(--serif); overflow-wrap: anywhere; }
.copy-button { width: 28px; height: 28px; display: grid; place-items: center; border: 0; border-radius: 50%; color: #fff; background: #101113; cursor: pointer; }
.copy-button svg { width: 12px; fill: none; stroke: currentColor; stroke-width: 1.5; }
/* 详情底部 / 通用底部 */
.site-footer { min-height: 720px; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr); gap: clamp(70px, 11vw, 170px); align-content: start; padding: 96px 5vw 32px; color: #fff; background: #000; }
.footer-left .footer-kicker { margin: 0 0 46px; color: #555; font-family: var(--sans); font-size: 9px; font-weight: 500; letter-spacing: .16em; }
.footer-heading-block { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto; align-items: stretch; margin-bottom: 54px; }
.footer-left h2 { margin: 0; font-family: var(--sans); font-size: clamp(42px, 4.3vw, 68px); font-weight: 500; line-height: .95; letter-spacing: -.055em; }
.footer-heading-block > p { max-width: 500px; margin: 28px 0 0; color: #777; font-family: var(--sans); font-size: 14px; font-weight: 400; line-height: 1.75; }
.footer-left .contact-list { max-width: 600px; border-color: #222; }
.footer-left .contact-item { min-height: 58px; grid-template-columns: 70px 1fr 34px; border-color: #202020; }
.footer-left .contact-item > span:first-child { color: #ddd; font-size: 10px; font-weight: 500; }
.footer-left .contact-value { color: #6e6e6e; font-family: var(--sans); font-size: 11px; }
.footer-left .copy-button { color: #bbb; background: #151515; }
.footer-right { min-height: 100%; display: flex; align-items: flex-start; padding-top: 196px; }
.footer-right nav { width: 100%; }
.footer-right nav { display: grid; grid-template-columns: 1fr; gap: 0; border-top: 1px solid #242424; transform: translateY(14px); }
.footer-right nav a { min-height: 77px; display: grid; grid-template-columns: 42px 1fr auto; align-items: center; border-bottom: 1px solid #242424; color: #f0f0f0; font-size: clamp(18px, 1.55vw, 24px); font-weight: 400; letter-spacing: -.025em; transition: color .25s ease, padding-left .25s ease; }
.footer-right nav a::before { content: attr(data-index); align-self: start; padding-top: 24px; color: #555; font-size: 9px; font-weight: 500; letter-spacing: .08em; }
.footer-right nav a::after { content: '↗'; color: #555; font-size: 14px; font-weight: 400; }
.footer-right nav a:hover { padding-left: 8px; color: #fff; }
.project-nav { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin-bottom: 20px; border-top: 1px solid #242424; border-bottom: 1px solid #242424; }
.project-nav[hidden] { display: none; }
.project-nav button { min-height: 132px; display: grid; align-content: center; gap: 18px; border: 0; padding: 24px 30px; color: #e7e7e7; background: transparent; cursor: pointer; text-align: left; transition: transform .25s ease, opacity .25s ease, background-color .25s ease; }
.project-nav button + button { border-left: 1px solid #242424; text-align: right; }
.project-nav-label { color: #666; font-size: 10px; letter-spacing: .08em; }
.project-nav-title { display: flex; align-items: center; gap: 14px; font-size: clamp(17px, 1.6vw, 24px); }
.project-nav button:last-child .project-nav-title { justify-content: flex-end; }
.project-nav-title strong { font-weight: 400; }
.project-nav-title i { color: #777; font-size: 20px; font-style: normal; }
.project-nav button:not(:disabled):hover { transform: translateY(-4px); background: #070707; }
.project-nav button:disabled { opacity: .28; cursor: default; }
.footer-bar { grid-column: 1 / -1; align-self: end; min-height: 54px; display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; gap: 20px; margin-top: 88px; padding: 0; border-top: 1px solid #242424; border-radius: 0; background: transparent; color: #555; font-size: 9px; letter-spacing: .06em; }
.footer-bar strong { font-family: var(--serif); font-size: 18px; font-weight: 400; text-align: center; letter-spacing: -.1em; }
.footer-bar span:last-child { text-align: right; }

/* 滚动联动文字显现 */
.reveal-word { display: inline-block; opacity: var(--word-reveal, 0); transform: translateY(calc((1 - var(--word-reveal, 0)) * 20px)); will-change: opacity, transform; }
.reveal-line { min-width: 0; }
.reveal-space { white-space: pre; }
@media (prefers-reduced-motion: reduce) {
  .reveal-word { opacity: 1; transform: none; }
}

/* 编辑器 */
.edit-toggle { position: fixed; z-index: 180; right: 20px; bottom: 20px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; padding: 11px 16px; color: #fff; background: rgba(10,10,11,.88); box-shadow: 0 10px 35px rgba(0,0,0,.2); cursor: pointer; font-size: 10px; font-weight: 500; backdrop-filter: blur(12px); }
.edit-panel { position: fixed; z-index: 179; right: 20px; bottom: 72px; width: min(380px,calc(100vw - 40px)); max-height: calc(100svh - 100px); display: none; padding: 18px; border: 1px solid rgba(255,255,255,.15); border-radius: 18px; color: #fff; background: rgba(10,10,11,.94); box-shadow: 0 25px 80px rgba(0,0,0,.45); overflow-y: auto; backdrop-filter: blur(18px); }
.edit-panel.is-open { display: block; }
.edit-panel h3 { margin: 0 0 8px; font-size: 14px; font-weight: 500; }
.edit-panel p { margin: 0 0 14px; color: #aaa; font-size: 11px; line-height: 1.5; }
.edit-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.edit-actions button { border: 0; border-radius: 9px; padding: 10px; cursor: pointer; font-size: 10px; font-weight: 500; }
.layout-tools { margin: 0 0 14px; padding: 12px; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; background: rgba(255,255,255,.04); }
.layout-tools[hidden] { display: none; }
.layout-tools .layout-selection { margin: 0 0 10px; color: #fff; }
.layout-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.layout-actions button { border: 1px solid rgba(255,255,255,.1); border-radius: 8px; padding: 8px 6px; color: #ddd; background: #1d1e20; cursor: pointer; font-size: 10px; }
.layout-actions button:hover { color: #fff; background: #292b2e; }
.toast { position: fixed; z-index: 210; left: 50%; bottom: 28px; padding: 10px 16px; border-radius: 999px; color: #fff; background: #111; opacity: 0; transform: translate(-50%,12px); pointer-events: none; transition: .25s ease; font-size: 11px; }
.toast.is-visible { opacity: 1; transform: translate(-50%,0); }

@media (max-width: 900px) {
  :root { --radius: 24px; --gutter: 10px; }
  .notched::before { width: 108px; height: 29px; }
  .nav-shell { width: calc(100vw - 20px); height: 43px; border-radius: 0 0 22px 22px; }
  .nav-inner { height: 43px; grid-template-columns: 1fr 92px 1fr; }
  .wordmark { width: 92px; height: 43px; padding-bottom: 7px; font-size: 18px; }
  .nav-group { gap: 10px; }
  .nav-group a { font-size: 9px; }
  .hero { min-height: calc(100svh - 20px); }
  .wordmark-reveal .hero { height: calc(100svh - 20px); }
  .hero-center { width: 82vw; gap: 16px; }
  .hero-center p { font-size: 10px; }
  .about-page, .contact-page { min-height: calc(100svh - 20px); padding: 120px 8vw 90px; }
  .page-heading, .split-section { grid-template-columns: 1fr; gap: 42px; }
  .page-heading { min-height: 610px; align-content: center; }
  .career-display { width: 100%; padding: 50px 0 130px; }
  .career-line { grid-template-columns: 1fr 90px; }
  .career-line strong { font-size: clamp(43px,9vw,72px); }
  .career-line--first strong { font-size: clamp(40px, 8.5vw, 64px); }
  .career-line--current strong { font-size: clamp(40px, 8.5vw, 64px); }
  .career-note { width: 90%; margin: 12px 0 42px; padding-left: 2px; font-size: 13px; line-height: 1.75; }
  .section-copy > p:last-child { max-width: 580px; }
  .work-page { min-height: calc(100svh - 20px); height: calc(100svh - 20px) !important; }
  .work-sticky { position: relative; top: 0; height: calc(100svh - 20px); }
  .work-rail { scroll-snap-type: x mandatory; touch-action: pan-x; -webkit-overflow-scrolling: touch; }
  .lab-page { min-height: calc(100svh - 20px); padding: 110px 0 55px; }
  .lab-toolbar { min-height: 72px; }
  .lab-toolbar p { font-size: 16px; }
  .lab-medias { width: 72vw; grid-template-columns: repeat(2,1fr); gap: 2vw; padding: 20px 0; }
  .detail-hero { min-height: calc(100svh - 20px); }
  .story-columns { grid-template-columns: 1fr; gap: 64px; }
  .is-petroleum-detail .story-columns { grid-template-columns: 1fr; gap: 48px; padding-bottom: 72px; }
  .delivery-review-items { grid-template-columns: 1fr; }
  .delivery-review-items p { padding: 20px 0; }
  .delivery-review-items p + p { border-top: 1px solid var(--line); border-left: 0; }
  .is-vanke-detail .t3-delivery-story .delivery-review { grid-template-columns: 1fr; gap: 24px; }
  .is-t3-detail .story-columns { grid-template-columns: 1fr; gap: 64px; }
  .t3-quartet { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .t3-delivery-story { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .t3-delivery-story > div { border-bottom: 1px solid var(--line); }
  .t3-delivery-story > div:nth-child(2n) { border-right: 0; }
  .t3-delivery-story .delivery-review { grid-column: 1 / -1; border-bottom: 0; }
  .contact-card { margin-left: 0; }
  .site-footer { grid-template-columns: 1fr; gap: 15px; }
  .footer-right { min-height: auto; align-items: flex-start; padding-top: 80px; }
  .footer-right nav { transform: none; }
}

@media (max-width: 600px) {
  .lab-toolbar > p { display: none; }
  .nav-shell { height: auto; min-height: 152px; }
  .nav-shell .nav-inner { height: auto; min-height: 146px; grid-template-columns: 1fr 64px 1fr; }
  .nav-shell .wordmark { width: 64px; align-self: start; }
  .nav-shell .nav-group { min-height: 128px; flex-direction: column; align-items: flex-start; justify-content: center; gap: 18px; padding-top: 12px; }
  .nav-shell .nav-right { align-items: flex-end; }
  .hero-center { top: 46%; width: calc(100% - 44px); grid-template-columns: auto 1fr; gap: 12px; }
  .hero-center p:first-child { font-size: 11px; }
  .hero-center p:last-child { grid-column: 1/-1; justify-self: end; }
  .hero-foot { bottom: 10%; }
  .hero-foot p { max-width: 300px; font-size: 12px; }
  .hero-enter { right: 16px; bottom: 16px; }
  .page-heading { min-height: 560px; }
  .page-heading h1 { font-size: 33px; line-height: 1.08; }
  .page-heading .about-summary { gap: 12px; font-size: 20px; line-height: 1.5; }
  .career-line { grid-template-columns: 1fr 70px; }
  .career-line strong { font-size: 40px; }
  .career-line time { font-size: 9px; }
  .split-section { padding-top: 20px; }
  .info-row { grid-template-columns: 1fr auto; gap: 8px; padding: 14px 0; }
  .info-row span { grid-row: 2; }
  .info-row time { grid-row: 1/3; grid-column: 2; }
  .work-rail { gap: 16px; padding-inline: 8vw; scroll-snap-type: x mandatory; touch-action: pan-x; -webkit-overflow-scrolling: touch; }
  .project-card { flex-basis: 78vw; height: 58vh; }
  .rail-hint { width: 65vw; }
  .lab-toolbar { grid-template-columns: 1fr 1fr; padding: 14px; }
  .lab-toolbar > p { display: none; }
  .lab-pill, .lab-toolbar button { min-height: 40px; padding-inline: 13px; }
  .lab-medias { width: 78vw; }
  .lab-media span { opacity: 1; transform: none; font-size: 8px; }
  .detail-title-wrap { left: 24px; right: 24px; bottom: 10%; }
  .detail-title-wrap h1 { margin-bottom: 34px; font-size: clamp(48px,15vw,72px); }
  .detail-meta { grid-template-columns: 1fr; gap: 12px; }
  .is-new09-detail .detail-meta { grid-template-columns: 1fr; }
  .detail-meta div { grid-template-columns: 52px 1fr; }
  .is-new09-detail .new09-project-heading { margin-bottom: -28px; }
  .scroll-cue { display: none; }
  .detail-story { padding: 110px 7vw 90px; }
  .story-columns { padding-bottom: 100px; }
  .detail-gallery { grid-template-columns: 1fr; gap: 56px; }
  .lab06-pair { grid-template-columns: 1fr; gap: 56px; }
  .t9-feature-gallery, .t9-feature-pair, .t9-preprocess-row { grid-template-columns: 1fr; gap: 42px; }
  .new-project-gallery { grid-template-columns: 1fr; gap: 56px; }
  .new-project-gallery .new-project-wide { grid-column: auto; }
  .new-project-mixed-row, .is-new01-detail .new-project-mixed-row--03-04, .is-new01-detail .new-project-mixed-row--10-11, .is-new01-detail .new-project-mixed-row--13-14, .is-new01-detail .new-project-mixed-row--15-16 { grid-template-columns: 1fr; gap: 56px; }
  .is-new02-detail .new-project-new02-pair { grid-template-columns: 1fr; gap: 56px; }
  .is-new02-detail .new-project-new02-portrait-pair { grid-template-columns: 1fr; gap: 56px; }
  .is-new03-detail .new-project-pair-06 { grid-template-columns: 1fr; gap: 56px; }
  .is-new04-detail .new-project-new02-pair { grid-template-columns: 1fr; gap: 56px; }
  .is-new04-detail .new-project-pair-06 { grid-template-columns: 1fr; gap: 56px; }
  .is-new04-detail .new04-port-row-square,
  .is-new04-detail .new04-port-row-portrait { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 12px; }
  .is-new05-detail .new-project-pair-01 { grid-template-columns: 1fr; gap: 56px; }
  .is-new05-detail .new05-four-grid-07 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 12px; }
  .is-new05-detail .new05-row-16x9--08 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .energy-main-pair { grid-template-columns: 1fr; gap: 42px; }
  .energy-square-pair { grid-template-columns: 1fr; gap: 42px; }
  .petroleum-exhibit-grid, .petroleum-comparison-row { grid-template-columns: 1fr; gap: 42px; }
  .petroleum-exhibit-grid figure { display: grid; grid-template-rows: 34px auto; }
  .detail-gallery .petroleum-exhibit-grid figure img { height: auto; }
  .petroleum-review { grid-template-columns: 1fr; }
  .petroleum-review article, .petroleum-review article:first-child, .petroleum-review article:last-child { padding: 24px 0 28px; border-right: 0; border-bottom: 1px solid var(--line); }
  .petroleum-review article:last-child { border-bottom: 0; }
  .petroleum-review h3 { margin-top: 18px; }
  .t9-feature-right { gap: 42px; }
  .detail-gallery figure.media-wide, .detail-gallery blockquote { grid-column: auto; }
  .concept-stage { grid-column: auto; min-height: 0; }
  .is-t3-detail .concept-stage { grid-template-columns: 1fr; gap: 55px; padding: 70px 0; }
  .is-t3-detail .detail-gallery blockquote { margin-bottom: 36px; }
  .detail-gallery figure img, .detail-gallery figure.media-wide img { aspect-ratio: 4/5; }
  .detail-gallery figure.petroleum-final-wide img,
  .detail-gallery figure.petroleum-final-wide img.layout-ratio-auto { height: auto; aspect-ratio: auto !important; object-fit: contain; }
  .detail-gallery blockquote { margin: 65px 0; font-size: 35px; text-align: left; }
  .is-t3-detail .detail-gallery blockquote span:first-child { font-size: 30px; }
  .is-t3-detail .detail-gallery blockquote span:nth-child(2) { font-size: 30px; }
  .t3-quartet { grid-template-columns: 1fr; gap: 42px; }
  .t3-delivery-story { grid-template-columns: 1fr; }
  .t3-delivery-story > div { min-height: 0; border-right: 0; }
  .t3-delivery-story .delivery-review { grid-column: auto; grid-template-columns: 1fr; gap: 14px; }
  .t3-process-gallery { grid-template-columns: 1fr; gap: 42px; }
  .t3-comparison-gallery { grid-template-columns: 1fr; gap: 42px; }
  .is-t3-detail .t3-feature-layout { grid-template-columns: 1fr; gap: 42px; }
  .is-t3-detail .t3-feature-stack { position: static; display: grid; gap: 42px; }
  .is-t3-detail .t3-feature-stack figure { position: static; height: auto; }
  .is-t3-detail .t3-feature-stack img { height: auto; aspect-ratio: 16/9; }
  .contact-card { grid-template-columns: 1fr; }
  .site-footer { min-height: 980px; padding: 70px 26px 24px; }
  .footer-left > p { font-size: 15px; }
  .footer-heading-block { grid-template-columns: minmax(0, 1fr); }
  .footer-heading-block > p { margin-top: 22px; font-size: 13px; }
  .footer-right nav { grid-template-columns: 1fr; gap: 0; }
  .footer-right nav { transform: none; }
  .footer-right nav a { min-height: 76px; grid-template-columns: 34px 1fr auto; font-size: 20px; }
  .footer-right nav a::before { padding-top: 23px; }
  .footer-bar { margin-top: 56px; }
  .footer-bar { grid-template-columns: 1fr auto; padding-inline: 16px; }
  .footer-bar strong { display: none; }
  .project-nav button { min-height: 108px; gap: 12px; padding: 18px 14px; }
  .project-nav-title { gap: 8px; font-size: 14px; }
}

@media (hover: none), (pointer: coarse) {
  .cursor-dot, .cursor-ring { display: none; }
  .lab-media span { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .cursor-dot, .cursor-ring { display: none; }
}