/* Small layout refinements kept separate from the shared stylesheet. */
:root {
  --accent: #6077ee;
  --sans: Inter, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif;
  --display: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif;
  --serif: var(--display);
  --paper: #f7f8fb;
  --line: #dde1e8;
}

/* Typography: clear sans-serif information layers, restrained editorial display type. */
body {
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.eyebrow,
.site-nav,
.identity-role,
.identity-contact,
.period,
.inline-tags,
.portfolio-card p,
.portfolio-card small,
.button,
.text-link {
  font-family: var(--sans);
}

.section-heading h2,
.identity h1,
.experience-body h3,
.portfolio-card h3,
.project-hero h1,
.visual-heading h2,
.tech-panel h2,
.metric-row strong {
  font-family: var(--serif);
  font-weight: 500;
}

/* Product-oriented display type: remove the overly literary Songti feel from key headings. */
.identity h1,
.section-heading h2,
.portfolio-card h3 {
  font-family: var(--display);
  font-weight: 650;
  letter-spacing: -0.07em;
}

.identity h1 {
  letter-spacing: -0.1em;
}

.section-heading h2 {
  letter-spacing: -0.055em;
}

.eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.15em;
}

.home-hero h1 {
  font-size: clamp(48px, 6vw, 82px);
}

/* 2026 portfolio information architecture */
.identity {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(330px, 0.75fr);
  gap: clamp(48px, 9vw, 150px);
  padding-top: clamp(110px, 16vh, 170px);
  padding-bottom: 120px;
}

.identity h1 {
  margin: 12px 0 8px;
  font-family: var(--serif);
  font-size: clamp(76px, 10vw, 146px);
  font-weight: 500;
  line-height: 0.92;
  letter-spacing: -0.09em;
}

.identity-dot { color: var(--accent); }
.identity-role { margin: 0 0 34px; font-size: 16px; color: var(--muted); }
.identity-contact { display: flex; flex-wrap: wrap; gap: 10px 20px; margin: -20px 0 30px; color: var(--muted); font-size: 13px; }
.identity-contact a { display: inline-flex; align-items: center; gap: 7px; color: inherit; }
.identity-contact svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.identity-contact a:first-child svg { fill: currentColor; stroke: none; }
.identity-statement { max-width: 650px; margin: 0; font-size: clamp(18px, 1.6vw, 22px); line-height: 1.9; }
.identity-links { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; margin-top: 38px; }
.identity-side { align-self: end; display: grid; grid-template-columns: 112px 1fr; gap: 0 24px; }
.identity-side .portrait { width: 112px; height: 145px; object-fit: cover; object-position: top; border-radius: 2px; }
.identity-facts { display: flex; flex-direction: column; justify-content: center; gap: 7px; font-size: 14px; color: var(--muted); }
.identity-facts span:first-child { color: var(--ink); font-size: 16px; font-weight: 600; }
.identity-facts a { color: inherit; }
.skill-note { grid-column: 1 / -1; margin-top: 36px; padding-top: 20px; border-top: 1px solid var(--line); }
.skill-note .eyebrow { margin: 0 0 10px; }
.skill-note p:last-child { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.8; }

.experience { padding-top: 90px; padding-bottom: 40px; }
.experience .section-heading { margin-bottom: 12px; }
.experience-block { display: grid; grid-template-columns: minmax(160px, 0.31fr) minmax(0, 1fr); gap: 35px; padding: 45px 0; border-top: 1px solid var(--line); }
.experience-label { display: flex; align-items: baseline; gap: 13px; }
.experience-label span { color: var(--accent); font-size: 12px; letter-spacing: 0.09em; }
.experience-label p { margin: 0; font-size: 15px; font-weight: 600; }
.experience-body { min-width: 0; }
.experience-entry { padding-bottom: 31px; }
.experience-entry + .experience-entry { padding-top: 30px; border-top: 1px solid var(--line); }
.period { margin: 0 0 9px; color: var(--muted); font-size: 12px; letter-spacing: 0.05em; }
.experience-body h3 { margin: 0 0 10px; font-family: var(--serif); font-size: 25px; font-weight: 500; }
.experience-body > p, .experience-entry > p:not(.period), .competition-entry > p:not(.period), .research-entry > p:not(.period) { max-width: 850px; margin: 0; color: var(--muted); line-height: 1.8; }
.experience-body > p + p { margin-top: 14px; }
.inline-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 18px; }
.inline-tags span { padding: 6px 10px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 12px; }
.project-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.project-summary a { display: flex; min-height: 88px; flex-direction: column; justify-content: center; gap: 5px; padding: 15px 20px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); color: inherit; transition: background .2s ease; }
.project-summary a:last-child:nth-child(odd) { grid-column: span 2; }
.project-summary a:hover { background: #f2f4f8; }
.project-summary strong { font-size: 15px; }.project-summary span { color: var(--muted); font-size: 12px; }
.competition-path { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin: 23px 0; font-size: 13px; }.competition-path span { padding: 7px 10px; border: 1px solid var(--line); }.competition-path i { color: var(--accent); font-style: normal; }
.metric-row { display: grid; grid-template-columns: repeat(4, 1fr); margin: 27px 0; border: 1px solid var(--line); }.metric-row div { padding: 15px; border-right: 1px solid var(--line); }.metric-row div:last-child { border: 0; }.metric-row strong,.metric-row span { display: block; }.metric-row strong { font-family: var(--serif); font-size: 25px; font-weight: 500; }.metric-row span { margin-top: 5px; color: var(--muted); font-size: 11px; }
.awards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }.awards-grid div { min-height: 105px; padding: 18px; background: #f2f4f8; }.awards-grid strong,.awards-grid span { display: block; }.awards-grid span { margin-top: 10px; color: var(--muted); font-size: 13px; line-height: 1.6; }

.portfolio-section { padding: 100px 0 120px; overflow: hidden; background: #11151d; color: #fff; }.portfolio-section .eyebrow,.portfolio-section .section-heading > p { color: #a7adba; }.portfolio-section .section-heading { margin-bottom: 37px; }.portfolio-section .section-heading h2 { color: #fff; }
.portfolio-carousel-wrap { position: relative; width: min(1500px, calc(100% - 42px)); margin: 0 auto; }.portfolio-carousel { display: flex; gap: 16px; overflow-x: auto; padding: 0 3px 16px; scrollbar-width: none; scroll-behavior: smooth; scroll-snap-type: x mandatory; }.portfolio-carousel.is-continuous { scroll-behavior: auto; scroll-snap-type: none; }.portfolio-carousel::-webkit-scrollbar { display: none; }
.portfolio-view-actions { display: flex; align-items: center; gap: 20px; }.portfolio-section .portfolio-view-actions > p { margin: 0; color: #a7adba; font-size: 13px; }.portfolio-view-toggle { padding: 0 0 3px; border: 0; border-bottom: 1px solid rgba(255,255,255,.72); background: transparent; color: #fff; cursor: pointer; font: 600 13px/1.5 var(--sans); }.portfolio-view-toggle span { margin-left: 5px; font-size: 15px; }.portfolio-view-toggle:hover { color: #b9c7ff; border-color: #b9c7ff; }.portfolio-carousel.is-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: visible; padding-bottom: 0; }.portfolio-carousel.is-grid .portfolio-card { width: 100%; min-width: 0; min-height: 350px; }.portfolio-carousel.is-grid .portfolio-card-copy { display: none; }
.portfolio-card { position: relative; display: flex; width: min(380px, 78vw); min-width: min(380px, 78vw); min-height: 400px; flex-direction: column; padding: 25px; overflow: hidden; color: #fff; scroll-snap-align: start; transition: transform .25s ease; }.portfolio-card:hover { transform: translateY(-7px); }.portfolio-card span { font-size: 12px; opacity: .75; }.portfolio-card p { margin: auto 0 9px; font-size: 11px; letter-spacing: .12em; opacity: .75; }.portfolio-card h3 { margin: 0; font-family: var(--serif); font-size: 35px; line-height: 1.16; font-weight: 500; }.portfolio-card small { margin-top: 17px; font-size: 12px; opacity: .84; }.portfolio-card b { position: absolute; right: 23px; bottom: 18px; font-size: 22px; }.portfolio-finance { background: linear-gradient(135deg,#101c31,#26578f); }.portfolio-codura { background: linear-gradient(135deg,#5c2f38,#bc6643); }.portfolio-compliance { background: linear-gradient(135deg,#132d30,#43826f); }.portfolio-talent { background: linear-gradient(135deg,#302251,#7255bb); }.portfolio-teco { background: linear-gradient(135deg,#00308f,#00a6d8); }
.portfolio-card-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; opacity: .78; transition: transform .5s ease; }.portfolio-card::after { position: absolute; inset: 0; content: ""; background: linear-gradient(180deg, rgba(8,12,20,.18) 0%, rgba(8,12,20,.08) 32%, rgba(8,12,20,.87) 80%, rgba(8,12,20,.96) 100%); }.portfolio-card > span, .portfolio-card > p, .portfolio-card > h3, .portfolio-card > small, .portfolio-card > b { position: relative; z-index: 1; }.portfolio-card > b { position: absolute; }.portfolio-card:hover .portfolio-card-image { transform: scale(1.04); }.portfolio-finance .portfolio-card-image { object-fit: contain; background: #06080d; }.portfolio-codura .portfolio-card-image { object-position: left top; }.portfolio-teco .portfolio-card-image { object-fit: contain; background: #f5f7fb; }
.portfolio-codura { background: linear-gradient(145deg, #e7eeeb, #cfdcda); color: #153634; }.portfolio-codura .portfolio-card-image { inset: 48px 24px auto; width: calc(100% - 48px); height: 112px; object-fit: contain; object-position: center; opacity: 1; }.portfolio-codura::after { background: linear-gradient(180deg, rgba(231,238,235,0) 0%, rgba(231,238,235,.12) 43%, rgba(231,238,235,.92) 69%, rgba(231,238,235,.98) 100%); }.portfolio-codura:hover .portfolio-card-image { transform: none; }
.portfolio-finance { background: linear-gradient(145deg, #f4f7fc, #dce8f6); color: #fff; }.portfolio-finance .portfolio-card-image { inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; background: #e8f0fa; opacity: 1; }.portfolio-finance::after { background: linear-gradient(180deg, rgba(232,240,250,0) 0%, rgba(232,240,250,.02) 38%, rgba(27,63,103,.54) 68%, rgba(16,42,73,.92) 100%); }.portfolio-finance:hover .portfolio-card-image { transform: scale(1.03); }
.portfolio-compliance { background: linear-gradient(145deg, #f2f7f3, #dcece3); color: #fff; }.portfolio-compliance .portfolio-card-image { inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; background: #e7f1ea; opacity: 1; }.portfolio-compliance::after { background: linear-gradient(180deg, rgba(231,241,234,0) 0%, rgba(231,241,234,.02) 38%, rgba(25,78,65,.54) 68%, rgba(13,54,45,.92) 100%); }.portfolio-compliance:hover .portfolio-card-image { transform: scale(1.03); }
.talent-card-previews { position: absolute; z-index: 0; top: 42px; right: 25px; left: 25px; height: 168px; }.talent-card-previews img { position: absolute; display: block; width: 73%; height: 124px; object-fit: cover; object-position: top; border: 1px solid rgba(255,255,255,.42); border-radius: 4px; background: #eff4ff; box-shadow: 0 12px 26px rgba(8,7,24,.28); }.talent-card-previews img:first-child { top: 0; left: 0; }.talent-card-previews img:nth-child(2) { top: 35px; right: 0; }.portfolio-talent:hover .talent-card-previews img:first-child { transform: translate(-3px,-3px); }.portfolio-talent:hover .talent-card-previews img:nth-child(2) { transform: translate(3px,3px); }.talent-card-previews img { transition: transform .3s ease; }
.carousel-control { position: absolute; z-index: 2; top: calc(50% - 18px); width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.55); border-radius: 50%; background: #11151d; color: #fff; cursor: pointer; }.carousel-prev { left: -18px; }.carousel-next { right: -18px; }

.project-page { padding-bottom: 100px; }.project-hero { display: grid; grid-template-columns: minmax(340px,.77fr) minmax(0,1.23fr); align-items: center; gap: clamp(38px,7vw,110px); min-height: 620px; padding-top: 120px; padding-bottom: 80px; }.project-hero h1 { margin: 14px 0 25px; font-family: var(--serif); font-size: clamp(48px,6vw,86px); font-weight: 500; line-height: 1.04; letter-spacing: -.06em; }.project-hero h1 em { color: var(--accent); font-style: normal; }.project-hero-copy > p:not(.eyebrow) { max-width: 530px; margin: 0; color: var(--muted); font-size: 17px; line-height: 1.8; }.project-hero-visual { display: flex; min-height: 310px; align-items: center; justify-content: center; overflow: hidden; background: #f2f4f8; }.project-hero-visual img { display: block; width: 100%; max-height: 470px; object-fit: contain; }.finance-visual { background:#080b10; }.finance-visual img { max-height: 560px; object-fit: contain; }.codura-visual img { object-fit: cover; object-position: top; }.compliance-visual img { max-height: 410px; }.teco-visual { background: #f6f8fa; }.teco-visual img { max-width: 78%; }
.visual-section { padding-top: 100px; }.visual-heading { display: grid; grid-template-columns: .63fr 1fr; gap: 30px; align-items: end; margin-bottom: 30px; }.visual-heading .eyebrow { grid-column: 1 / -1; margin: 0; }.visual-heading h2 { margin: 0; font-family: var(--serif); font-size: clamp(32px,4vw,55px); font-weight: 500; line-height: 1.1; letter-spacing: -.05em; }.visual-heading p:last-child { max-width: 590px; margin: 0; color: var(--muted); line-height: 1.75; }
.compliance-capabilities { display:grid; grid-template-columns:repeat(2,1fr); margin-top:24px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.compliance-capabilities article { padding:34px clamp(22px,4vw,50px); }.compliance-capabilities article + article { border-left:1px solid var(--line); }.compliance-capabilities .eyebrow { margin:0 0 14px; }.compliance-capabilities h2 { margin:0 0 12px; font-family:var(--serif); font-size:clamp(28px,3vw,42px); font-weight:500; letter-spacing:-.05em; }.compliance-capabilities p { max-width:500px; margin:0; color:var(--muted); line-height:1.75; }.compliance-capabilities .inline-tags { margin-top:20px; }
.finance-pair,.ide-duo,.talent-duo { display: grid; grid-template-columns: repeat(2,1fr); gap: 18px; }.visual-section figure { margin: 0; overflow: hidden; background:#f2f4f8; }.visual-section figure img { display: block; width:100%; height: auto; }.visual-section figcaption { padding: 12px 14px; color:var(--muted); font-size: 12px; }.single-evidence { max-width: 1050px; margin: 43px auto 0 !important; }.single-evidence figcaption span { color:var(--ink); font-weight:600; }
.finance-adaptation .single-evidence { max-width: none; margin-top: 0 !important; }.finance-metric-row { display:grid; grid-template-columns:repeat(4,1fr); margin-top:22px; border:1px solid var(--line); }.finance-metric-row div { padding:18px 16px; border-right:1px solid var(--line); }.finance-metric-row div:last-child { border-right:0; }.finance-metric-row strong,.finance-metric-row span { display:block; }.finance-metric-row strong { font-size:28px; font-weight:650; letter-spacing:-.05em; }.finance-metric-row span { margin-top:5px; color:var(--muted); font-size:12px; }
.talent-duo { position: relative; align-items: start; gap: clamp(20px, 4vw, 64px); padding-bottom: 70px; }.talent-duo figure { position: relative; overflow: visible; border: 1px solid var(--line); box-shadow: 0 18px 42px rgba(17,19,23,.12); }.talent-duo figure:first-child { z-index: 2; }.talent-duo figure:nth-child(2) { z-index: 1; margin-top: 72px; }.talent-duo figure img { border-bottom: 1px solid var(--line); }.talent-duo figcaption { background: var(--paper); }
.workflow-mosaic { display:grid; grid-template-columns: repeat(3, 1fr); gap:14px; }.workflow-mosaic .wide { grid-column: span 2; }.workflow-mosaic img { aspect-ratio: 1.72; object-fit: cover; object-position: top left; }.redacted-screen { position:relative; }.mosaic-mask { position:absolute; z-index:2; display:block; pointer-events:none; overflow:hidden; border:1px solid rgba(255,255,255,.72); background-color:#d7dde5; background-image:linear-gradient(90deg,rgba(255,255,255,.38) 50%,transparent 50%),linear-gradient(rgba(255,255,255,.2) 50%,transparent 50%),linear-gradient(90deg,transparent 50%,rgba(92,106,123,.23) 50%),linear-gradient(transparent 50%,rgba(92,106,123,.2) 50%); background-size:13px 13px,13px 13px,26px 26px,26px 26px; box-shadow:inset 0 0 0 1px rgba(70,83,99,.1); }.bank-mark { top:.35%; left:.25%; width:9.75%; height:6.5%; }.account-mark { top:.45%; right:2.2%; width:3.4%; height:4.9%; }.redacted-screen--compact-logo .bank-mark { width:7.1%; height:5.1%; }.redacted-screen--compact-logo .account-mark { right:1.7%; width:3.1%; height:4.5%; }.teco-loader-group { display:grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }.teco-loader-group .teco-wide { grid-column: 1 / -1; }.teco-loader-group .teco-wide img { max-height: 450px; object-fit:contain; background:#fff; }.teco-loader-group figure:not(.teco-wide) img { height: 330px; object-fit: contain; }.teco-pptx-group { display:grid; grid-template-columns: repeat(4,1fr); gap:14px; margin-top:14px; }.teco-pptx-group img { height: 190px; object-fit:cover; object-position: top left; }
.feature-stories { display:grid; gap:62px; margin-top:40px; }.feature-story { display:grid; grid-template-columns:minmax(240px,.66fr) minmax(0,1.34fr); align-items:center; gap:clamp(30px,6vw,92px); padding:clamp(28px,4vw,58px); background:#edf1f7; }.feature-story--reverse { grid-template-columns:minmax(0,1.34fr) minmax(240px,.66fr); }.feature-story--reverse .feature-story-copy { order:2; }.feature-story--reverse .feature-image-stack { order:1; }.feature-story-copy h3 { margin:14px 0 20px; font-family:var(--serif); font-size:clamp(38px,4.6vw,65px); font-weight:500; line-height:1.05; letter-spacing:-.06em; }.feature-story-copy > p:not(.eyebrow) { margin:0; color:var(--muted); line-height:1.8; }.feature-steps { display:grid; gap:8px; margin:25px 0; }.feature-steps span { padding:9px 0; border-bottom:1px solid var(--line); color:var(--ink); font-size:13px; font-weight:600; }.feature-image-stack { position:relative; min-height:clamp(280px,31vw,430px); }.feature-image-stack figure { margin:0; overflow:hidden; background:#fff; box-shadow:0 18px 45px rgba(29,48,76,.12); }.feature-image-main { position:absolute; top:0; right:0; width:88%; z-index:1; }.feature-image-secondary { position:absolute; bottom:0; left:0; width:43%; z-index:2; transform:rotate(-1.4deg); }.feature-story--reverse .feature-image-main { right:auto; left:0; }.feature-story--reverse .feature-image-secondary { right:0; left:auto; transform:rotate(1.4deg); }.feature-image-stack img { display:block; width:100%; height:auto; }.feature-image-stack figcaption { padding:10px 12px; color:var(--muted); font-size:11px; background:#fff; }
.agent-showcase { display:grid; grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr); align-items:center; gap:clamp(32px,6vw,86px); margin-top:110px; padding:clamp(25px,4vw,58px); background:#edf1f7; }.agent-copy h2 { margin:14px 0 22px; font-family:var(--serif); font-size:clamp(38px,4.6vw,65px); font-weight:500; line-height:1.06; letter-spacing:-.06em; }.agent-copy > p:not(.eyebrow) { margin:0; color:var(--muted); line-height:1.8; }.agent-steps { display:grid; gap:8px; margin:26px 0; }.agent-steps span { padding:9px 0; border-bottom:1px solid var(--line); color:var(--ink); font-size:13px; font-weight:600; }.agent-evidence { margin:0; overflow:hidden; background:#fff; box-shadow:0 18px 45px rgba(29,48,76,.12); }.agent-evidence img { display:block; width:100%; height:auto; }.agent-evidence figcaption { padding:12px 14px; color:var(--muted); font-size:12px; background:#fff; }
.tech-panel { display:grid; grid-template-columns:.36fr 1fr; gap:36px; margin-top:105px; padding: 42px; background:#11151d; color:#fff; }.tech-panel .eyebrow { margin:0 0 10px; color:#a7adba; }.tech-panel h2 { margin:0; font-family:var(--serif); font-size:42px; font-weight:500; }.tech-groups { display:grid; gap:0; }.tech-groups p { display:grid; grid-template-columns: 145px 1fr; gap:16px; margin:0; padding:15px 0; border-top:1px solid rgba(255,255,255,.18); }.tech-groups strong { font-size:13px; }.tech-groups span { color:#c3c8d2; font-size:13px; line-height:1.6; }

@media (max-width: 760px) {
  .identity { grid-template-columns: 1fr; gap: 42px; padding-top: 112px; padding-bottom: 75px; }.identity h1 { font-size: 82px; }.identity-side { grid-template-columns: 88px 1fr; }.identity-side .portrait { width:88px; height:116px; }.identity-statement { font-size:17px; }.experience { padding-top:55px; }.experience-block { grid-template-columns:1fr; gap:22px; padding:32px 0; }.project-summary,.awards-grid { grid-template-columns:1fr; }.metric-row { grid-template-columns:repeat(2,1fr); }.metric-row div:nth-child(2) { border-right:0; }.metric-row div:nth-child(-n+2) { border-bottom:1px solid var(--line); }.competition-path { gap:6px; }.portfolio-section { padding:75px 0 83px; }.portfolio-card { min-height:330px; }.portfolio-card h3 { font-size:30px; }.carousel-control { display:none; }
  .project-hero { grid-template-columns:1fr; min-height:0; gap:34px; padding-top:110px; padding-bottom:30px; }.project-hero h1 { font-size:54px; }.project-hero-visual { min-height:220px; }.project-hero-visual img { max-height:330px; }.finance-visual img { max-height:420px; }.visual-section { padding-top:70px; }.visual-heading { grid-template-columns:1fr; gap:16px; }.visual-heading h2 { font-size:38px; }.finance-pair,.ide-duo,.talent-duo,.teco-loader-group,.compliance-capabilities,.feature-story,.feature-story--reverse { grid-template-columns:1fr; }.compliance-capabilities article + article { border-top:1px solid var(--line); border-left:0; }.workflow-mosaic { grid-template-columns:1fr; }.workflow-mosaic .wide,.teco-loader-group .teco-wide { grid-column:auto; }.workflow-mosaic img { aspect-ratio:auto; }.feature-stories { gap:34px; margin-top:28px; }.feature-story { gap:28px; padding:26px 20px; }.feature-story--reverse .feature-story-copy,.feature-story--reverse .feature-image-stack { order:initial; }.feature-story-copy h3 { font-size:44px; }.feature-image-stack { min-height:300px; }.feature-image-main { width:91%; }.feature-image-secondary { width:48%; }.teco-pptx-group { grid-template-columns:repeat(2,1fr); }.teco-pptx-group img { height:130px; }.teco-loader-group figure:not(.teco-wide) img { height:auto; }.tech-panel { grid-template-columns:1fr; gap:25px; margin-top:72px; padding:27px 20px; }.tech-groups p { grid-template-columns:1fr; gap:6px; }.tech-panel h2 { font-size:35px; }.agent-showcase { grid-template-columns:1fr; gap:30px; margin-top:70px; padding:26px 20px; }.agent-copy h2 { font-size:44px; }
}

.profile-strip {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 36px;
  gap: 24px;
  padding-top: 27px;
  padding-bottom: 27px;
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
}

.profile-strip .eyebrow {
  margin-bottom: 7px;
}

.profile-strip strong,
.profile-strip span,
.profile-strip a:not(.profile-arrow) {
  display: block;
}

.profile-strip strong {
  font-size: 16px;
}

.profile-strip span,
.profile-strip a:not(.profile-arrow) {
  color: var(--muted);
  font-size: 13px;
}

.profile-arrow {
  align-self: center;
  font-size: 28px;
}

.resume-preview {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  padding-top: 86px;
  padding-bottom: 92px;
}

.resume-preview h2 {
  margin: 0;
  font-size: clamp(34px, 4vw, 55px);
  line-height: 1.05;
  letter-spacing: -0.06em;
}

.resume-preview p:not(.eyebrow) {
  max-width: 500px;
  margin: 3px 0 23px;
  color: var(--muted);
}

.resume-hero {
  display: flex;
  justify-content: space-between;
  align-items: end;
  min-height: 460px;
  padding-top: 84px;
  padding-bottom: 70px;
  border-bottom: 1px solid var(--ink);
}

.resume-hero h1 {
  margin: 0;
  font-size: clamp(66px, 10vw, 136px);
  line-height: .9;
  letter-spacing: -.09em;
}

.resume-position {
  margin: 21px 0 0;
  color: var(--muted);
  font-size: 17px;
}

.resume-contact {
  display: flex;
  gap: 20px;
  margin-top: 18px;
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.portrait {
  width: 180px;
  height: 220px;
  object-fit: cover;
  object-position: center top;
  filter: saturate(.86);
}

.resume-section {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 30px;
  padding-top: 73px;
  padding-bottom: 73px;
  border-bottom: 1px solid var(--line);
}

.resume-section-label h2 {
  margin: 0;
  font-size: 25px;
  line-height: 1.15;
  letter-spacing: -.045em;
}

.resume-content h3 {
  margin: 0;
  font-size: 20px;
  line-height: 1.35;
  letter-spacing: -.035em;
}

.timeline-list article {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  padding: 0 0 27px;
  margin-bottom: 27px;
  border-bottom: 1px solid var(--line);
}

.timeline-list article:last-child {
  border-bottom: 0;
  margin-bottom: 0;
}

.timeline-list p,
.experience-list > article > p,
.research-card > p,
.award-card p {
  margin: 7px 0 0;
  color: var(--muted);
}

.timeline-list time,
.experience-list time {
  flex: none;
  color: #6e737a;
  font: 12px/1.5 ui-monospace, SFMono-Regular, monospace;
}

.highlight-line {
  color: var(--ink)!important;
}

.experience-list > article {
  padding-bottom: 42px;
  margin-bottom: 43px;
  border-bottom: 1px solid var(--line);
}

.experience-list > article:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}

.experience-list header {
  display: flex;
  justify-content: space-between;
  gap: 22px;
}

.experience-list .eyebrow {
  margin-bottom: 9px;
}

.experience-list ul {
  padding-left: 19px;
  margin: 20px 0 22px;
}

.experience-list li {
  margin: 8px 0;
  color: #535960;
  font-size: 14px;
}

.research-card {
  padding: 28px 30px 31px;
  background: #e9ebe4;
}

.research-card h3 {
  max-width: 800px;
}

.research-result {
  color: var(--ink)!important;
}

.award-card {
  padding-bottom: 32px;
  border-bottom: 1px solid var(--line);
}

.award-card strong {
  display: block;
  margin-top: 16px;
  font-size: 26px;
  letter-spacing: -.05em;
}

.skills-grid {
  display: grid;
  grid-template-columns: .7fr 1.3fr;
  gap: 30px;
  padding-top: 30px;
}

.skills-grid p:last-child {
  margin: 0;
  color: #535960;
}

.project-gallery {
  padding-bottom: 86px;
}

.pmr-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin: 0 0 64px;
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
}

.pmr-grid article {
  min-height: 238px;
  padding: 22px 22px 25px 0;
  border-right: 1px solid var(--line);
}

.pmr-grid article + article {
  padding-left: 22px;
}

.pmr-grid article:last-child {
  border-right: 0;
}

.pmr-grid .eyebrow {
  margin-bottom: 28px;
}

.pmr-grid h3 {
  margin: 0 0 12px;
  font-size: 21px;
  line-height: 1.2;
  letter-spacing: -0.04em;
}

.pmr-grid p:last-child {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.75;
}

.dark-feature .pmr-grid {
  border-color: #5a6067;
}

.dark-feature .pmr-grid article {
  border-color: #5a6067;
}

.dark-feature .pmr-grid p:last-child {
  color: #c8cdd2;
}

.project-gallery h2 {
  max-width: 500px;
  margin: 0 0 12px;
  font-size: clamp(32px, 4vw, 52px);
  line-height: 1.05;
  letter-spacing: -0.06em;
}

.gallery-intro {
  max-width: 570px;
  margin: 0 0 35px;
  color: var(--muted);
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 26px;
}

.gallery-grid figure {
  margin: 0;
}

.gallery-grid img {
  width: 100%;
  height: 300px;
  border: 1px solid #dedfd9;
  background: #fff;
  object-fit: contain;
}

.gallery-grid figcaption {
  margin-top: 9px;
  color: #727780;
  font-size: 12px;
}

.compact-gallery {
  margin-top: 62px;
  padding-bottom: 0;
}

.compact-gallery .gallery-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dark-feature .gallery-grid img {
  border-color: #454b52;
}

.dark-feature .gallery-grid figcaption {
  color: #c3c9cf;
}

.tech-stack {
  max-width: var(--max);
  margin: -42px auto 78px;
  padding: 25px 28px;
  background: #e9ebe5;
}

.tech-stack-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 21px;
  border-bottom: 1px solid #cfd1cb;
}

.tech-stack-heading .eyebrow {
  margin: 0;
}

.tech-stack h3 {
  margin: 0;
  font-size: 16px;
  letter-spacing: -0.03em;
}

.tech-stack-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  padding-top: 20px;
}

.tech-stack-list span,
.tech-stack-list strong {
  display: block;
}

.tech-stack-list span {
  margin-bottom: 5px;
  color: #6a7077;
  font-size: 11px;
  letter-spacing: .08em;
}

.tech-stack-list strong {
  font-size: 13px;
  line-height: 1.55;
  font-weight: 600;
}

.feature-project .tech-stack {
  margin: -15px 0 56px;
}

.llm-gate-project {
  background: #e9ebe5;
}

.llm-gate-project .tech-stack {
  margin-bottom: 0;
}

.dark-feature .tech-stack {
  background: #30363d;
}

.dark-feature .tech-stack-heading {
  border-color: #555d65;
}

.dark-feature .tech-stack-list span {
  color: #aeb6bd;
}

.dark-feature .tech-stack-list strong {
  color: #fff;
}

@media (max-width: 760px) {
  .home-hero h1 em {
    display: block;
  }

  .project-gallery {
    padding-bottom: 64px;
  }

  .tech-stack {
    margin: -26px 20px 55px;
    padding: 19px 18px;
  }

  .feature-project .tech-stack {
    margin: -8px 0 39px;
  }

  .tech-stack-heading {
    display: block;
  }

  .tech-stack-heading .eyebrow {
    margin-bottom: 8px;
  }

  .tech-stack-list {
    grid-template-columns: 1fr;
    gap: 13px;
  }

  .profile-strip,
  .resume-preview {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .profile-arrow {
    display: none;
  }

  .resume-preview {
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .resume-hero {
    min-height: 0;
    align-items: start;
    padding-top: 52px;
    padding-bottom: 48px;
  }

  .portrait {
    width: 110px;
    height: 140px;
  }

  .resume-position {
    font-size: 14px;
  }

  .resume-contact {
    flex-direction: column;
    gap: 4px;
    font-size: 12px;
  }

  .resume-section {
    grid-template-columns: 1fr;
    gap: 25px;
    padding-top: 52px;
    padding-bottom: 52px;
  }

  .timeline-list article,
  .experience-list header {
    flex-direction: column;
    gap: 12px;
  }

  .experience-list li {
    font-size: 13px;
  }

  .research-card {
    padding: 23px 20px;
  }

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

  .pmr-grid {
    grid-template-columns: 1fr;
    margin-bottom: 45px;
  }

  .pmr-grid article,
  .pmr-grid article + article {
    min-height: 0;
    padding: 19px 0;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .pmr-grid article:last-child {
    border-bottom: 0;
  }

  .pmr-grid .eyebrow {
    margin-bottom: 14px;
  }

  .gallery-grid,
  .compact-gallery .gallery-grid {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .gallery-grid img {
    height: 240px;
  }
}

/* Keep the project pages intentional when legacy gallery rules are present. */
.project-page .pmr-grid {
  margin-bottom: 0;
}

.project-page .pmr-grid h2 {
  margin: 0 0 14px;
  font-family: var(--serif);
  font-size: clamp(26px, 2.8vw, 38px);
  font-weight: 500;
  line-height: 1.18;
  letter-spacing: -0.05em;
}

.project-page .pmr-grid p:last-child {
  font-size: 14px;
}

.life-section {
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  gap: clamp(30px, 6vw, 88px);
  align-items: center;
  padding-top: 72px;
  padding-bottom: 112px;
}

.life-copy { padding-bottom: 4px; }
.life-copy .eyebrow { margin-bottom: 15px; }
.life-copy h2 { margin: 0 0 20px; font-family: var(--serif); font-size: clamp(35px, 4vw, 58px); font-weight: 500; line-height: 1.08; letter-spacing: -.06em; }
.life-copy p:last-of-type { max-width: 350px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.8; }
.life-toggle { margin-top: 28px; padding: 0; border: 0; border-bottom: 1px solid var(--ink); background: transparent; color: var(--ink); cursor: pointer; font-family: inherit; font-size: 13px; font-weight: 650; line-height: 1.8; }.life-toggle span { display: inline-block; margin-left: 4px; transition: transform .25s ease; }
.life-gallery { position: relative; min-height: 490px; }
.life-gallery figure { position: absolute; width: 250px; height: 340px; margin: 0; padding: 9px 9px 28px; overflow: hidden; background: #fff; box-shadow: 0 17px 38px rgba(17,19,23,.18); transition: transform .45s ease, box-shadow .3s ease; }
.life-gallery figure:first-child { z-index: 6; top: 54px; left: 30%; transform: rotate(-3.5deg); }
.life-gallery figure:nth-child(2) { z-index: 5; top: 19px; left: 7%; transform: rotate(-10deg); }
.life-gallery figure:nth-child(3) { z-index: 4; top: 20px; right: 4%; transform: rotate(9deg); }
.life-gallery figure:nth-child(4) { z-index: 3; right: 14%; bottom: 3px; transform: rotate(4deg); }
.life-gallery figure:nth-child(5) { z-index: 2; bottom: 1px; left: 12%; transform: rotate(-5deg); }
.life-gallery figure:nth-child(6) { z-index: 1; right: 1%; bottom: 23px; transform: rotate(11deg); }
.life-gallery figure:hover { z-index: 8; box-shadow: 0 24px 50px rgba(17,19,23,.25); }
.life-gallery img { width: 100%; height: 100%; object-fit: cover; }
.life-gallery figcaption { position: absolute; right: 11px; bottom: 6px; color: var(--muted); font-size: 10px; letter-spacing: .04em; }
.life-gallery.expanded { display: grid; min-height: 0; grid-template-columns: repeat(3, 1fr); gap: 20px; padding-top: 6px; }
.life-gallery.expanded figure, .life-gallery.expanded figure:first-child, .life-gallery.expanded figure:nth-child(2), .life-gallery.expanded figure:nth-child(3), .life-gallery.expanded figure:nth-child(4), .life-gallery.expanded figure:nth-child(5), .life-gallery.expanded figure:nth-child(6) { position: relative; inset: auto; width: auto; height: auto; aspect-ratio: .74; transform: none; }
.life-section.photos-expanded { grid-template-columns: 1fr; }.life-section.photos-expanded .life-copy { display: grid; grid-template-columns: 1fr auto; gap: 0 28px; align-items: end; }.life-section.photos-expanded .life-copy .eyebrow, .life-section.photos-expanded .life-copy h2 { grid-column: 1; }.life-section.photos-expanded .life-copy p { grid-column: 1; }.life-section.photos-expanded .life-toggle { grid-column: 2; grid-row: 1 / span 3; align-self: end; }.life-section.photos-expanded .life-gallery { width: min(100%, 1080px); }

@media (max-width: 760px) {
  .project-page .pmr-grid { margin-bottom: 0; }
  .life-section { grid-template-columns: 1fr; gap: 30px; padding-top: 48px; padding-bottom: 76px; }
  .life-gallery { min-height: 410px; transform: scale(.9); transform-origin: top center; margin-bottom: -42px; }
  .life-gallery figure { width: 190px; height: 266px; }.life-gallery figure:first-child { top:45px; left:27%; }.life-gallery figure:nth-child(2) { left:2%; }.life-gallery figure:nth-child(3) { right:0; }.life-gallery figure:nth-child(4) { right:8%; }.life-gallery figure:nth-child(5) { left:5%; }.life-gallery figure:nth-child(6) { right:-3%; }
  .life-gallery.expanded { grid-template-columns: 1fr 1fr; min-height: 0; transform: none; margin-bottom: 0; }.life-gallery.expanded figure { width:auto; height:auto; }
  .life-section.photos-expanded .life-copy { display:block; }.life-section.photos-expanded .life-toggle { display:inline-block; }
}

/* Personal details and personal moments share the right column of the opening. */
.identity-side { display: block; align-self: start; }
.identity-profile-card { display: grid; grid-template-columns: 112px 1fr; gap: 24px; align-items: center; }
.identity-profile-card .portrait { width: 112px; height: 145px; }
.identity-profile-card .identity-facts { min-height: 145px; }
.identity-life { margin-top: 28px; padding-top: 18px; border-top: 1px solid var(--line); }
.identity-side > .identity-life { margin-top: 0; padding-top: 0; border-top: 0; }
.identity-life-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.identity-life-heading .eyebrow { margin: 0; }
.identity-life-heading .life-toggle { margin: 0; font-size: 11px; }
.identity-life .life-gallery { min-height: 270px; margin-top: 10px; }
.identity-life .life-gallery figure { width: 150px; height: 208px; padding: 6px 6px 22px; }
.identity-life .life-gallery figure:first-child { top: 30px; left: 31%; }
.identity-life .life-gallery figure:nth-child(2) { top: 3px; left: 8%; }
.identity-life .life-gallery figure:nth-child(3) { top: 4px; right: 5%; }
.identity-life .life-gallery figure:nth-child(4) { right: 13%; bottom: 2px; }
.identity-life .life-gallery figure:nth-child(5) { bottom: 1px; left: 13%; }
.identity-life .life-gallery figure:nth-child(6) { right: 1%; bottom: 15px; }
.identity-life .life-gallery.expanded { grid-template-columns: repeat(3, 1fr); min-height: 0; }
.identity-life.photos-expanded .life-gallery { width: 100%; }
.identity-side .skill-note { margin-top: 28px; }

@media (max-width: 760px) {
  .identity-profile-card { grid-template-columns: 88px 1fr; gap: 19px; }
  .identity-profile-card .portrait { width: 88px; height: 116px; }
  .identity-profile-card .identity-facts { min-height: 116px; }
  .identity-life .life-gallery { min-height: 285px; transform: none; margin-bottom: 0; }
  .identity-life .life-gallery figure { width: 142px; height: 196px; }
  .identity-life .life-gallery figure:first-child { top: 40px; left: 28%; }
  .identity-life .life-gallery figure:nth-child(2) { left: 1%; }
  .identity-life .life-gallery figure:nth-child(3) { right: 0; }
  .identity-life .life-gallery figure:nth-child(4) { right: 8%; }
  .identity-life .life-gallery figure:nth-child(5) { left: 4%; }
  .identity-life .life-gallery figure:nth-child(6) { right: -3%; }
  .identity-life .life-gallery.expanded { grid-template-columns: 1fr 1fr; min-height: 0; }
  .identity-life .life-gallery.expanded figure { width: auto; height: auto; }
  .identity-contact { margin-top: -18px; margin-bottom: 25px; gap: 8px 14px; font-size: 12px; }
  .talent-duo { gap: 18px; padding-bottom: 0; }
  .talent-duo figure:nth-child(2) { margin-top: 0; }
}

/* Final display-type override: contemporary Chinese sans for the public-facing portfolio. */
.identity h1,
.section-heading h2,
.portfolio-card h3 {
  font-family: var(--display);
  font-weight: 650;
  letter-spacing: -0.07em;
}

.identity h1 { letter-spacing: -0.1em; }

/* Finance architecture: turn the transparent source image into a contained technical blueprint panel. */
.finance-visual {
  position: relative;
  isolation: isolate;
  padding: 24px;
  border: 1px solid #cddbeb;
  background: linear-gradient(145deg, #102b4b 0%, #173f6d 100%);
  box-shadow: 0 24px 54px rgba(27, 54, 92, .16);
}

.finance-visual::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  content: "";
  opacity: .28;
  background-image:
    linear-gradient(rgba(184, 211, 241, .26) 1px, transparent 1px),
    linear-gradient(90deg, rgba(184, 211, 241, .26) 1px, transparent 1px),
    radial-gradient(circle at 68% 20%, rgba(111, 166, 238, .4), transparent 33%);
  background-size: 28px 28px, 28px 28px, auto;
}

.finance-visual img {
  position: relative;
  z-index: 1;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .16);
}

.project-external-link {
  display: inline-flex;
  margin-top: 25px;
  align-items: center;
}

/* Lucide icon system */
.lucide-icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  flex: 0 0 auto;
  vertical-align: -0.14em;
}

.text-link .lucide-icon { margin-left: 4px; }
.portfolio-card b .lucide-icon { width: 1.08em; height: 1.08em; }
.portfolio-view-toggle .lucide-icon,
.life-toggle .lucide-icon { margin-left: 5px; transition: transform .25s ease; }
.life-gallery.expanded + * .lucide-icon { transform: rotate(180deg); }

@media (max-width: 760px) {
  .portfolio-view-actions { align-items: flex-end; flex-direction: column; gap: 9px; }
  .portfolio-carousel.is-grid { grid-template-columns: 1fr; }
  .portfolio-carousel.is-grid .portfolio-card { min-height: 330px; }
  .finance-metric-row { grid-template-columns: repeat(2, 1fr); }
  .finance-metric-row div:nth-child(2) { border-right: 0; }
  .finance-metric-row div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
}