:root {
  color-scheme: dark;
  --ink: #0b0c0c;
  --ink-soft: #111412;
  --paper: #d7d8d2;
  --paper-bright: #eceee8;
  --muted: rgba(228, 230, 224, 0.74);
  --quiet: rgba(228, 230, 224, 0.5);
  --line: rgba(235, 237, 231, 0.18);
  --line-strong: rgba(235, 237, 231, 0.34);
  --accent: #5b78ff;
  --accent-ink: #090f26;
  --radius: 14px;
  --page: min(1500px, calc(100% - 72px));
  --content-inline: max(36px,calc((100vw - 1500px)/2));
  --case-max: 1500px;
  --case-ease: cubic-bezier(.16,1,.3,1);
  --font: "Avenir Next", "Helvetica Neue", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: clip; background: var(--ink); }
body { margin: 0; overflow-x: hidden; background: var(--ink); color: var(--paper); font-family: var(--font); font-weight: 300; line-height: 1.65; -webkit-font-smoothing: antialiased; }
body::after { position: fixed; inset: 0; z-index: 60; pointer-events: none; content: ""; opacity: .045; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E"); mix-blend-mode: soft-light; }
a { color: inherit; text-decoration: none; }
a:focus-visible, article:focus-visible, button:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
img { display: block; max-width: 100%; height: auto; }
h1, h2, h3, p, figure, dl, dd { margin-top: 0; }
.skip-link { position: fixed; top: 10px; left: 10px; z-index: 80; padding: 8px 12px; background: var(--paper-bright); color: var(--ink); transform: translateY(-150%); }
.skip-link:focus { transform: none; }

.case-nav { position: fixed; inset: 0 0 auto; z-index: 30; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; height: 76px; padding: 0 clamp(20px, 2.4vw, 42px); border-bottom: 1px solid rgba(235,237,231,.12); background: rgba(11,12,12,.74); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); font-size: 11px; }
.case-nav__brand { display: inline-flex; align-items: center; justify-self: start; gap: 10px; font-weight: 600; white-space: nowrap; }
.case-nav__monogram { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid var(--line); border-radius: 50%; font-size: 11px; }
.case-nav__links { display: flex; gap: clamp(24px,2.5vw,44px); color: rgba(242,243,239,.72); white-space: nowrap; }
.case-nav__links a, .case-nav__back { transition: color 180ms ease, transform 180ms ease, background-color 180ms ease; }
.case-nav__links a:hover, .case-nav__links a:focus-visible { color: var(--paper-bright); }
.case-nav__back { display: inline-flex; align-items: center; justify-self: end; gap: 12px; padding: 6px 6px 6px 14px; border-radius: 6px; background: var(--paper); color: #111311; font-weight: 500; white-space: nowrap; }
.case-nav__back b { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 4px; background: #121412; color: var(--paper); font-size: 15px; font-weight: 400; }
.case-nav__back:hover, .case-nav__back:focus-visible { background: var(--accent); transform: translateY(-1px); }
.case-nav__back:active { transform: translateY(1px); }

.case-wrap { width: var(--page); margin-inline: auto; }
.case-topbar { position: fixed; inset: 0 0 auto; z-index: 70; border-bottom: 1px solid rgba(235,237,231,.11); background: rgba(9,10,11,.96); -webkit-backdrop-filter: blur(0) saturate(100%); backdrop-filter: blur(0) saturate(100%); transition: background-color .28s ease,border-color .28s ease,box-shadow .28s ease,-webkit-backdrop-filter .28s ease,backdrop-filter .28s ease; }
.case-topbar.is-scrolled { border-bottom-color: rgba(235,237,231,.16); background: rgba(9,10,12,.66); box-shadow: 0 10px 34px rgba(0,0,0,.2); -webkit-backdrop-filter: blur(24px) saturate(155%); backdrop-filter: blur(24px) saturate(155%); }
.case-topbar__inner { display: flex; align-items: center; gap: 18px; min-height: 64px; }
.case-topbar__back { display: inline-flex; flex: none; align-items: center; gap: 8px; padding: 8px 15px; border: 1px solid var(--line); border-radius: 999px; color: var(--paper-bright); font-size: 13px; font-weight: 750; transition: border-color .2s,transform .2s var(--case-ease); }
.case-topbar__back:hover, .case-topbar__back:focus-visible { border-color: var(--paper-bright); transform: translateX(-3px); }
.case-topbar__meta { display: flex; min-width: 0; align-items: baseline; gap: 10px; font-size: 13px; }
.case-topbar__badge { flex: none; padding: 3px 9px; border-radius: 999px; background: var(--accent); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .04em; }
.case-topbar__title { overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.case-toc { display: flex; gap: 20px; margin-left: auto; font-size: 13px; font-weight: 650; white-space: nowrap; }
.case-toc a { color: var(--muted); transition: color .2s; }
.case-toc a:hover, .case-toc a:focus-visible, .case-toc a.is-active { color: var(--paper-bright); }

main { padding-top: 64px; }

.hero { position: relative; min-height: calc(100dvh - 64px); overflow: hidden; display: grid; grid-template-columns: minmax(0,.92fr) minmax(430px,1.08fr); column-gap: clamp(32px,5vw,80px); align-items: center; padding: 72px var(--content-inline) 28px; isolation: isolate; background: radial-gradient(ellipse 62% 32% at 65% 62%,rgba(91,120,255,.18),transparent 66%), linear-gradient(180deg,#3d4657 0%,#303640 13%,#141719 45%,#090a0b 100%); }
.hero::before { position: absolute; inset: 0; z-index: -1; content: ""; background: linear-gradient(90deg,rgba(7,9,10,.92) 0%,rgba(7,9,10,.5) 48%,transparent 78%), linear-gradient(0deg,var(--ink) 0%,transparent 30%); }
.hero__atmosphere { position: absolute; inset: 22% -8% auto 22%; z-index: -2; height: 54%; opacity: .7; filter: blur(40px); transform: rotate(-3deg); background: radial-gradient(ellipse at 30% 50%,rgba(91,120,255,.42),transparent 40%), radial-gradient(ellipse at 80% 46%,rgba(119,131,158,.45),transparent 42%); }
.hero__copy { position: relative; z-index: 2; width: 100%; min-width: 0; max-width: 760px; padding-left: 0; }
.hero__meta { margin-bottom: 20px; color: var(--accent); font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; }
.hero h1 { display: block; max-width: none; margin-bottom: 0; color: var(--paper-bright); font-size: clamp(30px,3.2vw,52px); font-weight: 800; line-height: 1.08; letter-spacing: -.045em; white-space: nowrap; }
.hero__title-mask { display: block; overflow: hidden; padding: 0 .04em .08em; margin: 0 -.04em -.08em; }
.hero__title-word { display: block; transform-origin: 0 100%; }
.hero__title-mask--muted { color: #9298a3; }
.hero__summary { max-width: 68ch; margin: 22px 0 0; color: var(--muted); font-size: clamp(15px,1.5vw,18px); line-height: 1.68; }
.hero__tags { display: flex; flex-wrap: wrap; gap: 9px; margin: 26px 0 0; padding: 0; list-style: none; }
.hero__tags li { padding: 6px 13px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 12px; font-weight: 700; }
.hero__facts { display: flex; flex-wrap: wrap; gap: 20px clamp(28px,3.5vw,60px); margin-bottom: 0; }
.hero__facts div, .project-strip dl { min-width: max-content; }
.hero__facts dt, .project-strip dt { color: var(--muted); font-size: 12px; white-space: nowrap; }
.hero__facts dd { margin: 4px 0 0; color: var(--paper-bright); font-size: 20px; font-weight: 560; white-space: nowrap; }
.hero__visual { position: relative; align-self: end; justify-self: stretch; width: 100%; min-width: 0; max-width: 940px; margin: 0 0 -3vw; transform: none; }
.hero__visual::after { position: absolute; inset: auto 5% 4% 6%; z-index: -1; height: 14%; border-radius: 50%; background: rgba(0,0,0,.48); filter: blur(28px); content: ""; }
.hero__visual img { width: 100%; max-height: calc(100dvh - 90px); object-fit: contain; object-position: bottom right; }
.js .hero__visual img { opacity: 0; transform: translate3d(0,56px,0); }
.js .hero__visual.is-hero-media-visible img { animation: hero-media-enter .92s cubic-bezier(.16,1,.3,1) both; }
@keyframes hero-media-enter { from { opacity: 0; transform: translate3d(0,56px,0); } to { opacity: 1; transform: translate3d(0,0,0); } }

.chapter { width: var(--page); margin: 0 auto; padding: clamp(108px,10vw,160px) 0; }
.chapter__header { max-width: 1040px; margin-bottom: clamp(64px,8vw,120px); }
.chapter__keyword { margin-bottom: 20px; color: var(--accent); font-size: clamp(12px,.9vw,14px); font-weight: 500; letter-spacing: -.01em; white-space: nowrap; }
h2 { margin-bottom: 0; color: var(--paper-bright); font-size: clamp(25px,3.15vw,46px); font-weight: 530; line-height: 1.12; letter-spacing: -.05em; }
.chapter__header > p:last-child:not(.chapter__keyword), .result__copy > p:last-child, .solution-showcase__copy > p:last-child { max-width: 48em; margin: 24px 0 0; color: var(--muted); font-size: clamp(15px,1.12vw,17px); line-height: 1.75; }

.ownership { padding: clamp(56px,6vw,88px) 0; }
.ownership__capsule { padding: clamp(28px,3.6vw,50px); overflow: hidden; border: 1px solid rgba(235,237,231,.12); border-radius: 28px; background: linear-gradient(135deg,rgba(91,120,255,.1),rgba(255,255,255,.025) 48%,rgba(255,255,255,.01)); }
.ownership__capsule .chapter__header { max-width: 1180px; margin-bottom: 28px; }
.ownership__statement { max-width: 980px; margin: 0 0 34px; }
.ownership__statement p { margin-bottom: 0; color: var(--muted); font-size: clamp(15px,1.25vw,18px); line-height: 1.72; letter-spacing: -.01em; }
.ownership__scope { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: clamp(28px,5vw,72px); max-width: 1180px; margin-bottom: 28px; }
.ownership__scope dl { min-width: 0; margin: 0; }
.ownership__scope dt { margin-bottom: 8px; color: var(--accent); font-size: 12px; font-weight: 500; white-space: nowrap; }
.ownership__scope dd { margin: 0; color: var(--paper); font-size: 14px; line-height: 1.65; }
.project-strip { display: grid; grid-template-columns: .8fr 1.35fr .85fr; margin-bottom: 86px; border-top: 1px solid var(--line-strong); }
.ownership .project-strip { margin-bottom: 0; border-top: 0; }
.ownership .project-strip dl { border-bottom: 0; }
.project-strip dl { min-width: 0; margin: 0; padding: 24px 26px 24px 0; border-bottom: 1px solid var(--line); }
.project-strip dl + dl { padding-left: 26px; border-left: 1px solid var(--line); }
.project-strip dd { margin: 10px 0 0; font-size: 14px; white-space: nowrap; }
.governance__rules h3 { margin-bottom: 76px; color: var(--accent); font-size: 12px; font-weight: 500; white-space: nowrap; }
.governance__rules p { max-width: 36em; margin-bottom: 0; color: var(--muted); font-size: 14px; line-height: 1.75; }

.business, .segmentation, .governance { width: 100%; padding-right: var(--content-inline); padding-left: var(--content-inline); }
.business { padding-bottom: 0; background: linear-gradient(180deg,transparent,rgba(91,120,255,.028),transparent); }
.business-story { position: relative; min-height: 110dvh; }
.business-story__stage { position: sticky; top: 64px; display: grid; grid-template-rows: auto minmax(0,1fr); gap: clamp(18px,2vw,28px); height: calc(100dvh - 64px); padding-bottom: clamp(14px,1.6vw,22px); overflow: hidden; }
.business-story__stage .chapter__header { max-width: 1180px; margin-bottom: 0; }
.business-story__stage .chapter__header > p:last-child { max-width: 42em; }
.business-carousel { display: grid; grid-template-rows: minmax(0,1fr) auto; min-width: 0; min-height: 0; align-self: stretch; touch-action: pan-y; }
.business-carousel__viewport { min-width: 0; min-height: 0; overflow: hidden; }
.business-carousel__track { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); width: 200%; height: 100%; transform: translate3d(0,0,0); transition: transform 720ms cubic-bezier(.16,1,.3,1); }
.business-carousel.is-second .business-carousel__track { transform: translate3d(-50%,0,0); }
.business-slide { min-width: 0; height: 100%; padding-right: clamp(0px,1.5vw,22px); }
.business-slide:nth-child(2) { padding-right: 0; padding-left: clamp(0px,1.5vw,22px); }
.business-slide figure { display: grid; width: 100%; height: 100%; min-width: 0; margin: 0; overflow: hidden; place-items: center; border-radius: var(--radius); background: #0e1117; }
.business-slide img { width: 100%; height: 100%; object-fit: contain; object-position: center; }
.business-carousel__indicator { position: relative; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); width: 72px; gap: 4px; margin: 14px auto 0; }
.business-carousel__indicator::before, .business-carousel__indicator i { position: absolute; right: 0; bottom: 0; left: 0; height: 1px; content: ""; }
.business-carousel__indicator::before { background: rgba(235,237,231,.16); }
.business-carousel__indicator i { width: 50%; background: var(--accent); transform: translateX(0); transition: transform 720ms cubic-bezier(.16,1,.3,1); }
.business-carousel.is-second .business-carousel__indicator i { transform: translateX(100%); }
.business-carousel__indicator button { position: relative; z-index: 1; height: 12px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.business-carousel__indicator button:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

.judgement__layout { display: grid; grid-template-columns: minmax(0,.9fr) minmax(440px,1.1fr); gap: clamp(60px,9vw,150px); align-items: start; }
.judgement__narrative { min-width: 0; max-width: 100%; }
.judgement__narrative .chapter__header { margin-bottom: clamp(44px,5vw,72px); }
.judgement__copy { max-width: 600px; }
.judgement__copy p { margin-bottom: 24px; color: var(--muted); font-size: 15px; line-height: 1.8; }
.judgement__evidence { min-width: 0; }
.judgement__evidence dl { display: grid; min-height: clamp(280px,21vw,350px); align-content: center; margin: 0; padding: 38px 0 42px; border-top: 1px solid rgba(235,237,231,.09); }
.judgement__evidence dl:last-child { border-bottom: 1px solid rgba(235,237,231,.09); }
.dot-icon { --dot-size: 2.75px; display: grid; grid-template-columns: repeat(12,var(--dot-size)); gap: 2px; width: max-content; margin-bottom: clamp(22px,1.8vw,28px); overflow: hidden; color: var(--accent); clip-path: inset(0 round 9px); }
.dot-icon i { width: var(--dot-size); height: var(--dot-size); border-radius: 50%; background: currentColor; opacity: .14; }
.dot-icon i.is-on { opacity: .88; }
.judgement__evidence dt { color: var(--paper-bright); font-size: clamp(80px,8.6vw,132px); font-weight: 560; line-height: .82; letter-spacing: -.08em; white-space: nowrap; }
.judgement__evidence dd { max-width: 34em; margin: clamp(22px,2.2vw,32px) 0 0; color: var(--muted); font-size: clamp(15px,1.2vw,17px); line-height: 1.5; letter-spacing: -.015em; text-wrap: balance; }
.legacy-problem { width: var(--page); margin: 0 auto; }
.before-figure { display: grid; grid-template-columns: minmax(500px,.95fr) minmax(520px,1.05fr); align-items: stretch; gap: clamp(42px,5vw,82px); margin: 120px 0 0; padding: 64px clamp(28px,4vw,64px) 0; overflow: hidden; border-radius: var(--radius); background: linear-gradient(135deg,#171b22,#0f1114); }
.legacy-problem .before-figure { margin: 0; }
.before-figure__phones { display: flex; min-width: 0; align-items: end; justify-content: center; gap: clamp(12px,1.5vw,24px); min-height: 850px; }
.before-phone { display: grid; width: calc(50% - 8px); min-width: 0; align-content: end; gap: 16px; }
.before-phone > span { display: block; width: 100%; color: var(--paper); font-size: clamp(14px,1.1vw,18px); font-weight: 300; text-align: center; white-space: nowrap; }
.before-phone img, .before-figure__phones img:first-child { width: 100%; max-width: none; max-height: none; object-fit: contain; object-position: bottom; filter: drop-shadow(0 24px 36px rgba(0,0,0,.28)); }
.before-problems { display: grid; min-width: 0; align-content: center; margin: 0; padding: 14px 0 64px; }
.before-problems article { padding: clamp(28px,3vw,44px) 0; border-bottom: 1px solid rgba(235,237,231,.1); }
.before-problems article:last-child { border-bottom: 0; }
.before-problems h3 { display: flex; align-items: baseline; gap: 14px; margin: 0 0 18px; color: var(--paper-bright); font-size: clamp(18px,1.55vw,25px); font-weight: 540; line-height: 1.35; letter-spacing: -.025em; }
.before-problems h3 span { color: var(--accent); font-size: 28px; font-weight: 560; }
.before-problems ul { display: grid; gap: 10px; margin: 0; padding: 0 0 0 38px; list-style: none; }
.before-problems li { position: relative; color: var(--muted); font-size: clamp(13px,1vw,15px); line-height: 1.65; }
.before-problems li::before { position: absolute; top: 0; right: calc(100% + 10px); color: var(--quiet); content: "↳"; }

.strategy-summary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: clamp(22px,2.8vw,44px); }
.strategy-summary article { display: grid; grid-template-rows: auto 1fr; min-width: 0; min-height: clamp(270px,21vw,340px); padding: clamp(28px,3.2vw,48px); border-radius: var(--radius); }
.strategy-summary__business { border: 1px solid var(--line-strong); background: #0e1013; }
.strategy-summary__judgement { border: 1px solid transparent; background: #4657d6; }
.strategy-summary__label { display: flex; align-items: center; gap: 16px; margin: 0; color: var(--paper-bright); font-size: clamp(13px,1.1vw,17px); font-weight: 560; }
.strategy-summary__label::before { width: 4px; height: 32px; flex: 0 0 auto; background: var(--accent); content: ""; }
.strategy-summary__judgement .strategy-summary__label::before { background: var(--paper-bright); }
.strategy-summary h2, .strategy-summary h3 { align-self: center; max-width: 16em; margin: 0; color: var(--paper-bright); font-size: clamp(24px,2.35vw,38px); font-weight: 540; line-height: 1.35; letter-spacing: -.04em; text-wrap: balance; }
.strategy-summary__judgement h3 { color: #f2f4ff; }

.segmentation { background: linear-gradient(180deg,#0f1218,#0b0c0c); }
.segmentation__grid { display: grid; grid-template-columns: 1.25fr .92fr .83fr; align-items: end; margin: 0 auto 100px; padding: 0 clamp(0px,5vw,72px); }
.segmentation__grid article { position: relative; min-height: 390px; padding: 34px; border: 1px solid var(--line); border-radius: var(--radius); background: #12151a; transform-origin: bottom center; transition: transform 420ms cubic-bezier(.16,1,.3,1),border-color 260ms ease,background-color 260ms ease; }
.segmentation__grid article:nth-child(1) { z-index: 3; min-height: 450px; background: #171c26; }
.segmentation__grid article:nth-child(2) { z-index: 2; margin-left: -36px; transform: translateY(18px) rotate(1.5deg); }
.segmentation__grid article:nth-child(3) { z-index: 1; margin-left: -36px; transform: translateY(34px) rotate(3deg); }
.segmentation__grid article:hover, .segmentation__grid article.is-active { z-index: 5; border-color: rgba(91,120,255,.7); background: #1a2130; transform: translateY(-16px) rotate(0); }
.segmentation__grid span { color: var(--accent); font-size: 12px; font-weight: 500; white-space: nowrap; }
.segmentation__grid h3 { margin: 180px 0 16px; color: var(--paper-bright); font-size: clamp(16px,1.55vw,24px); font-weight: 500; }
.segmentation__grid p { max-width: 22em; margin-bottom: 0; color: var(--muted); }
.segmentation__summary { display: grid; grid-template-columns: 150px 1fr auto; align-items: center; gap: 34px; width: min(1180px,88%); margin: 0 auto; padding: 30px 0; border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line); }
.segmentation__summary span, .segmentation__summary strong { color: var(--accent); font-size: 13px; font-weight: 500; white-space: nowrap; }
.segmentation__summary p { margin-bottom: 0; color: var(--paper); font-size: 15px; }
.segment-proof { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: stretch; gap: clamp(24px,3vw,44px); width: min(1240px,92%); margin: 120px auto 0; }
.segment-proof figure { display: grid; grid-template-columns: minmax(0,1fr) minmax(170px,.48fr); align-items: stretch; min-width: 0; min-height: 680px; margin: 0; padding: 36px 36px 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: #10131a; }
.segment-proof img { align-self: end; width: 100%; min-width: 0; max-height: 644px; object-fit: contain; object-position: bottom; }
.segment-proof figcaption { display: flex; min-width: 0; max-width: 100%; flex-direction: column; justify-content: space-between; padding: 88px 0 42px 24px; }
.segment-proof figcaption strong, .segment-proof figcaption span { display: block; }
.segment-proof figcaption strong { margin-bottom: 10px; color: var(--accent); font-size: 12px; }
.segment-proof figcaption span { color: var(--muted); font-size: 13px; }
.segment-proof figcaption dl { margin: 0; padding-top: 24px; border-top: 1px solid var(--line); }
.segment-proof figcaption dt { color: var(--paper-bright); font-size: clamp(34px,3.2vw,50px); font-weight: 540; line-height: .92; letter-spacing: -.06em; white-space: nowrap; }
.segment-proof figcaption dd { margin: 12px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }

.mechanism-board { border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line-strong); }
.mechanism-path { display: grid; grid-template-columns: minmax(220px,.7fr) minmax(0,1.3fr); gap: clamp(36px,6vw,104px); align-items: center; min-height: 252px; padding: 42px 0; }
.mechanism-path + .mechanism-path { border-top: 1px solid var(--line); }
.mechanism-path__intro h3 { margin: 0 0 30px; color: var(--accent); font-size: 12px; font-weight: 500; }
.mechanism-path__intro strong { display: block; color: var(--paper-bright); font-size: clamp(22px,2.2vw,34px); font-weight: 520; letter-spacing: -.04em; }
.mechanism-path__intro p { max-width: 25em; margin: 12px 0 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
.mechanism-path__steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin: 0; padding: 0; list-style: none; }
.mechanism-path__steps li { position: relative; min-width: 0; min-height: 116px; padding: 24px 30px; border-left: 1px solid var(--line); }
.mechanism-path__steps li:last-child { border-right: 1px solid var(--line); }
.mechanism-path__steps li:not(:last-child)::after { position: absolute; top: 50%; right: -12px; z-index: 1; width: 23px; height: 23px; border: 1px solid var(--line-strong); border-radius: 50%; background: var(--ink); color: var(--accent); content: "\2192"; font-size: 12px; line-height: 21px; text-align: center; transform: translateY(-50%); }
.mechanism-path__steps small, .mechanism-path__steps strong { display: block; }
.mechanism-path__steps small { margin-bottom: 34px; color: var(--quiet); font-size: 10px; }
.mechanism-path__steps strong { color: var(--paper); font-size: clamp(13px,1.15vw,16px); font-weight: 500; line-height: 1.45; white-space: nowrap; }
.mechanism-result { display: grid; grid-template-columns: minmax(220px,.7fr) minmax(0,1.3fr); gap: clamp(36px,6vw,104px); align-items: baseline; padding: 32px 0; border-top: 1px solid rgba(91,120,255,.42); }
.mechanism-result span { color: var(--accent); font-size: 11px; }
.mechanism-result p { margin: 0; color: var(--muted); font-size: clamp(17px,1.7vw,24px); line-height: 1.5; letter-spacing: -.02em; }
.mechanism-result strong { color: var(--paper-bright); font-weight: 520; }

.architecture__order { display: grid; grid-template-columns: 1.25fr 1fr .92fr .83fr; min-height: 310px; margin-bottom: 104px; border-top: 1px solid var(--line-strong); }
.architecture__order article { position: relative; padding: 30px 30px 30px 0; overflow: hidden; }
.architecture__order article + article { padding-left: 30px; border-left: 1px solid var(--line); }
.architecture__order article:hover, .architecture__order article.is-active { background: rgba(91,120,255,.07); }
.architecture__order span { color: var(--accent); font-size: clamp(18px,2.05vw,32px); font-weight: 510; letter-spacing: -.04em; white-space: nowrap; }
.architecture__order p { position: absolute; right: 30px; bottom: 30px; left: 0; margin-bottom: 0; color: var(--muted); }
.architecture__order article + article p { left: 30px; }
.architecture-transform { display: grid; grid-template-columns: 1fr 140px 1fr; min-height: 590px; }
.architecture-transform > article { display: grid; grid-template-rows: auto 1fr auto; padding: clamp(30px,4vw,56px); border: 1px solid var(--line); border-radius: var(--radius); background: #0f1217; }
.architecture-transform header span, .architecture-transform header strong { display: block; }
.architecture-transform header span { margin-bottom: 10px; color: var(--accent); font-size: 12px; }
.architecture-transform header strong { color: var(--paper-bright); font-size: 15px; font-weight: 500; }
.architecture-transform article > p { margin-bottom: 0; color: var(--muted); font-size: 13px; }
.architecture-transform__move { display: grid; align-content: center; justify-items: center; color: var(--quiet); }
.architecture-transform__move span { margin-bottom: 20px; font-size: 11px; white-space: nowrap; }
.architecture-transform__move b { position: relative; display: block; width: 96px; height: 72px; }
.architecture-transform__move b::before, .architecture-transform__move b::after { position: absolute; top: 0; width: 64px; height: 72px; content: ""; clip-path: polygon(0 0,32% 0,100% 50%,32% 100%,0 100%,68% 50%); }
.architecture-transform__move b::before { left: 0; background: linear-gradient(90deg,rgba(91,120,255,.03),rgba(91,120,255,.2)); }
.architecture-transform__move b::after { right: 0; background: linear-gradient(90deg,rgba(91,120,255,.06),rgba(91,120,255,.34)); }

.governance { background: linear-gradient(180deg,transparent,#10131a 48%,transparent); }
.governance__rules { display: grid; grid-template-columns: 1.2fr .95fr .85fr; margin-bottom: 104px; }
.governance__rules article { position: sticky; top: 110px; min-height: 380px; padding: 34px; border: 1px solid var(--line); border-radius: var(--radius); background: #141820; box-shadow: 0 30px 80px rgba(5,8,14,.34); }
.governance__rules article:nth-child(2) { top: 130px; margin: 42px 0 0 -24px; background: #12161d; }
.governance__rules article:nth-child(3) { top: 150px; margin: 84px 0 0 -24px; background: #101319; }
.governance__rules h3 { margin-bottom: 180px; }
.governance-proof { display: grid; gap: 46px; width: min(1260px,92%); margin-left: auto; }
.governance-proof figure { margin: 0; }
.governance-proof img { width: 100%; border-radius: var(--radius); background: #0e1014; }
.governance-proof figcaption { max-width: 48em; margin: 16px 0 0 auto; color: var(--muted); font-size: 13px; line-height: 1.7; text-align: right; }

.redesign-overview { width: var(--page); margin: 0 auto; overflow: hidden; background: #111; }
.redesign-overview img { width: 100%; max-width: none; height: auto; }

.solution-showcase { position: relative; display: grid; grid-template-columns: minmax(320px,.72fr) minmax(0,1.28fr); column-gap: clamp(40px,6vw,96px); align-items: center; min-height: 100dvh; padding: 100px max(4.5vw,28px) 0; overflow: hidden; background: radial-gradient(circle at 70% 48%,rgba(91,120,255,.18),transparent 36%), linear-gradient(145deg,#171b23,#090a0c 72%); }
.solution-showcase__copy { position: relative; z-index: 2; align-self: center; width: 100%; min-width: 0; max-width: 680px; }
.solution-showcase__copy h2 { max-width: 11em; }
.solution-showcase__media { align-self: end; justify-self: stretch; width: 100%; min-width: 0; max-width: 860px; margin: 0; }
.solution-showcase__media img { width: auto; max-width: 100%; max-height: calc(100dvh - 50px); margin-left: auto; object-fit: contain; object-position: bottom; }

.gallery { width: var(--page); padding-right: 0; padding-left: 0; }
.gallery__track { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(260px,31%); gap: clamp(16px,2vw,26px); padding: 0 0 24px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.28) transparent; }
.gallery__track figure { min-width: 0; margin: 0; scroll-snap-align: start; }
.gallery__track img { width: 100%; border-radius: var(--radius); background: #0d1427; }
.gallery__track figcaption { display: grid; gap: 5px; margin-top: 16px; }
.gallery__track figcaption strong { color: var(--paper-bright); font-size: 12px; font-weight: 500; }
.gallery__track figcaption span { color: var(--muted); font-size: 11.5px; }

.result { min-height: 100dvh; padding: clamp(140px,15vw,230px) var(--content-inline) 60px; background: radial-gradient(circle at 76% 38%,rgba(91,120,255,.15),transparent 34%), linear-gradient(145deg,#171b23,#090a0c 72%); }
.project-flow { width: var(--page); }
.result__copy { max-width: 1080px; }
.result__metrics { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(28px,6vw,100px); margin-top: 100px; }
.result__metrics dl { margin: 0; padding: 30px 0 44px; border-top: 1px solid var(--line-strong); }
.result__metrics dt { color: var(--paper-bright); font-size: clamp(64px,9.2vw,145px); font-weight: 540; line-height: .92; letter-spacing: -.075em; white-space: nowrap; }
.result__metrics dd { margin: 20px 0 8px; color: var(--accent); font-size: 15px; white-space: nowrap; }
.result__metrics small { color: var(--muted); }
.project-reflection { margin-top: clamp(150px,17vw,250px); }
.project-reflection__header { max-width: 900px; margin-bottom: clamp(58px,7vw,96px); }
.project-reflection__list { border-top: 1px solid var(--line-strong); }
.project-reflection__list article { display: grid; grid-template-columns: 64px minmax(300px,.92fr) minmax(320px,1.08fr); gap: clamp(28px,4vw,72px); align-items: baseline; padding: clamp(34px,4vw,58px) 0; border-bottom: 1px solid var(--line); }
.project-reflection__list span { color: var(--accent); font-size: 12px; font-variant-numeric: tabular-nums; }
.project-reflection__list h3 { margin: 0; color: var(--paper-bright); font-size: clamp(20px,2.1vw,31px); font-weight: 520; line-height: 1.35; letter-spacing: -.035em; }
.project-reflection__list p { max-width: 39em; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.85; }
.case-footer { margin-top: clamp(64px,8vw,110px); padding: 36px 0 64px; border-top: 1px solid var(--line); }
.case-footer__row { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; color: var(--muted); font-size: 13px; }
.case-footer__next { display: inline-flex; align-items: center; gap: 9px; margin-left: auto; padding: 11px 20px; border: 1px solid var(--line); border-radius: 999px; color: var(--paper-bright); font-size: 14px; font-weight: 750; white-space: nowrap; transition: border-color .2s,transform .25s var(--case-ease); }
.case-footer__next:hover, .case-footer__next:focus-visible { border-color: var(--paper-bright); transform: translateX(3px); }

.js .reveal { opacity: 0; transform: translateY(28px); transition: opacity 760ms ease,transform 760ms cubic-bezier(.16,1,.3,1); }
.js .reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion:no-preference) {
  .hero__title-word { animation: title-enter 1.05s cubic-bezier(.16,1,.3,1) both; animation-delay: calc(180ms + var(--title-step)*135ms); }
  @keyframes title-enter { from { opacity: .08; transform: translate3d(0,118%,0) rotate(2.5deg); } to { opacity: 1; transform: none; } }
}

@media (max-width:1100px) {
  :root { --page: min(100% - 48px,1500px); --content-inline: 24px; }
  .hero { grid-template-columns: 1fr .85fr; }
  .hero__visual { width: 65vw; margin-right: -16vw; opacity: .82; }
  .mechanism-path, .mechanism-result { grid-template-columns: minmax(190px,.55fr) minmax(0,1.45fr); gap: 36px; }
  .before-figure { grid-template-columns: 1fr; }
  .before-figure__phones { grid-row: auto; }
  .segment-proof figure { grid-template-columns: 1fr; min-height: 0; padding: 30px 30px 0; }
  .segment-proof figcaption { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 24px; padding: 24px 0 30px; }
  .segment-proof figcaption dl { min-width: 150px; padding: 0 0 0 24px; border-top: 0; border-left: 1px solid var(--line); }
  .architecture-transform { grid-template-columns: 1fr 100px 1fr; }
}

@media (max-width:760px) {
  :root { --page: calc(100% - 32px); --content-inline: 16px; }
  .case-wrap { width: var(--page); }
  .case-toc { display: none; }
  .case-topbar__title { max-width: 44vw; }
  .case-nav { grid-template-columns: 1fr auto; height: 64px; padding: 0 16px; }
  .case-nav__links, .case-nav__back span, .case-nav__brand > span:last-child { display: none; }
  .hero { grid-template-columns: 1fr; align-content: start; min-height: calc(100dvh - 64px); padding: 58px var(--content-inline) 28px; }
  .hero::before { background: linear-gradient(180deg,rgba(7,9,10,.94) 0%,rgba(7,9,10,.5) 58%,var(--ink) 100%); }
  .hero h1 { font-size: clamp(22px,6.6vw,30px); white-space: nowrap; }
  .hero__summary { max-width: 23em; margin: 24px 0 30px; }
  .hero__facts { gap: 14px 28px; }
  .hero__facts dd { font-size: 17px; }
  .hero__visual { position: absolute; right: -36%; bottom: -3%; z-index: -1; width: 122vw; margin: 0; opacity: .42; }
  .chapter { padding: 104px 0; }
  .business, .segmentation, .governance { padding-right: var(--content-inline); padding-left: var(--content-inline); }
  .chapter__header { margin-bottom: 54px; }
  .business-story { min-height: auto; }
  .business-story__stage { position: relative; top: auto; height: auto; min-height: 0; gap: 28px; padding-bottom: 0; overflow: visible; }
  .business-slide, .business-slide:nth-child(2) { gap: 18px; padding: 0; }
  .business-slide img { height: auto; aspect-ratio: 2.58 / 1; }
  .business-carousel__indicator { margin-top: 16px; }
  .chapter__keyword { margin-bottom: 16px; font-size: 12px; }
  h2 { font-size: clamp(23px,6.4vw,34px); }
  .ownership { padding: 44px 0; }
  .ownership__capsule { padding: 24px 20px; border-radius: 20px; }
  .ownership__capsule .chapter__header { margin-bottom: 22px; }
  .ownership__statement { margin: 0 0 28px; }
  .ownership__statement p { font-size: 15px; }
  .ownership__scope { grid-template-columns: 1fr; gap: 18px; margin-bottom: 20px; }
  .project-strip, .strategy-summary, .segmentation__grid, .architecture__order, .governance__rules, .result__metrics, .segment-proof { grid-template-columns: 1fr; }
  .project-strip dl, .project-strip dl + dl { min-width: 0; padding: 20px 0; border-left: 0; }
  .project-strip dd { overflow-x: auto; font-size: 13px; scrollbar-width: none; }
  .judgement__layout { grid-template-columns: 1fr; gap: 68px; }
  .judgement__evidence { margin-top: 0; }
  .judgement__evidence dl { min-height: 276px; padding: 38px 0 42px; }
  .dot-icon { --dot-size: 2.5px; gap: 2px; margin-bottom: 24px; clip-path: inset(0 round 8px); }
  .judgement__evidence dt { font-size: clamp(72px,23vw,106px); }
  .judgement__evidence dd { margin-top: 22px; font-size: 15px; }
  .before-figure { gap: 28px; margin-top: 72px; padding: 42px 20px 0; }
  .before-figure__phones { min-height: 420px; }
  .before-figure__phones img, .before-figure__phones img:first-child { max-height: none; }
  .before-phone { gap: 10px; }
  .before-phone > span { font-size: 13px; }
  .before-problems { padding-bottom: 36px; }
  .strategy-summary { gap: 14px; }
  .strategy-summary article { min-height: 230px; padding: 24px 22px; }
  .strategy-summary h2, .strategy-summary h3 { font-size: clamp(22px,6.3vw,30px); }
  .segmentation__grid { gap: 14px; padding: 0; margin-bottom: 60px; }
  .segmentation__grid article, .segmentation__grid article:nth-child(1), .segmentation__grid article:nth-child(2), .segmentation__grid article:nth-child(3) { min-height: 280px; margin-left: 0; transform: none; }
  .segmentation__grid h3 { margin-top: 100px; }
  .segmentation__summary { grid-template-columns: 1fr; gap: 18px; width: 100%; }
  .segment-proof { width: 100%; margin-top: 72px; }
  .segment-proof figure { transform: none; }
  .segment-proof img { max-height: 560px; }
  .mechanism-path, .mechanism-result { grid-template-columns: 1fr; gap: 28px; }
  .mechanism-path { min-height: 0; padding: 36px 0; }
  .mechanism-path__intro h3 { margin-bottom: 18px; }
  .mechanism-path__steps { grid-template-columns: 1fr; }
  .mechanism-path__steps li { display: grid; grid-template-columns: 54px 1fr; align-items: center; min-height: 72px; padding: 18px 16px; border-top: 1px solid var(--line); border-right: 0; border-left: 0; }
  .mechanism-path__steps li:last-child { border-right: 0; border-bottom: 1px solid var(--line); }
  .mechanism-path__steps li:not(:last-child)::after { top: auto; right: 16px; bottom: -12px; transform: rotate(90deg); }
  .mechanism-path__steps small { margin: 0; }
  .mechanism-result { gap: 14px; padding: 28px 0; }
  .architecture__order { min-height: 0; margin-bottom: 66px; }
  .architecture__order article, .architecture__order article + article { min-height: 180px; padding: 24px 0; border-left: 0; border-bottom: 1px solid var(--line); }
  .architecture__order p, .architecture__order article + article p { right: 0; bottom: 24px; left: 0; }
  .architecture-transform { grid-template-columns: 1fr; gap: 18px; min-height: 0; }
  .architecture-transform__move { min-height: 80px; }
  .architecture-transform__move b { transform: rotate(90deg); }
  .governance__rules { gap: 14px; margin-bottom: 70px; }
  .governance__rules article, .governance__rules article:nth-child(2), .governance__rules article:nth-child(3) { position: relative; top: auto; min-height: 280px; margin: 0; }
  .governance__rules h3 { margin-bottom: 120px; }
  .governance-proof { width: 100%; gap: 30px; }
  .governance-proof figcaption { text-align: left; }
  .solution-showcase { grid-template-columns: 1fr; min-height: 100dvh; padding: 104px 18px 0; }
  .solution-showcase__media { width: min(100%,560px); }
  .gallery__track { grid-auto-columns: 78%; }
  .result { padding: 112px var(--content-inline) 48px; }
  .result__metrics { gap: 8px; margin-top: 70px; }
  .result__metrics dt { font-size: clamp(60px,18.5vw,96px); }
  .project-reflection { margin-top: 120px; }
  .project-reflection__header { margin-bottom: 48px; }
  .project-reflection__list article { grid-template-columns: 40px 1fr; gap: 14px 18px; padding: 32px 0; }
  .project-reflection__list h3 { font-size: 20px; }
  .project-reflection__list p { grid-column: 2; font-size: 13px; line-height: 1.75; }
  .case-footer__row { display: grid; grid-template-columns: 1fr; }
  .case-footer__next { justify-content: center; margin-left: 0; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  .js .reveal { opacity: 1; transform: none; transition: none; }
  .js .hero__visual img, .js .hero__visual.is-hero-media-visible img { opacity: 1; transform: none; animation: none; }
  .hero__title-word, .segmentation__grid article { animation: none; transition: none; }
  .business-story { min-height: auto; }
  .business-story__stage { position: relative; top: auto; height: auto; min-height: 0; overflow: visible; }
  .business-carousel__track, .business-carousel__indicator i { transition: none; }
}


/* Preserve the approved centered Hero; all other styles use the original case. */
@font-face{font-family:'IBM Plex Sans';src:url('assets/fonts/ibm-plex-sans-400.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('assets/fonts/ibm-plex-sans-700.ttf') format('truetype');font-weight:700;font-display:swap}
.hero.hero--retained{display:block;width:100%;min-height:0;margin:0;padding:64px 0 0;background:#101115;text-align:center;font-family:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif}
.hero--retained::before,.hero--retained .hero__atmosphere,.hero--retained .hero__visual::after{display:none}
.hero--retained .hero__copy{width:min(75vw,1040px);max-width:960px;margin:0 auto;padding:0;opacity:1;transform:none}
.hero--retained h1{font-size:56px;line-height:1.12;letter-spacing:-1.7px;font-weight:700;color:#f5f4f8;white-space:normal;margin:0}
.hero--retained .hero__summary{margin:24px auto 0;max-width:880px;font-size:18px;font-weight:400;line-height:1.65;color:#b5b5c0}
.hero--retained .hero__visual{position:relative;inset:auto;z-index:auto;opacity:1;width:min(64.5vw,894.4px);max-width:900px;margin:44px auto 0;transform:none}
.js .hero--retained .hero__visual img{width:100%;height:auto;max-height:none;object-fit:contain;opacity:1;transform:none;animation:none}
@media(min-width:1440px){.hero.hero--retained{padding-top:80px}.hero--retained .hero__visual{margin-top:56px}}
@media(max-width:1199px){.hero--retained .hero__copy{width:76vw}.hero--retained h1{font-size:46px}.hero--retained .hero__visual{width:65.36vw}}
@media(max-width:809px){.hero.hero--retained{padding-top:48px}.hero--retained .hero__copy{width:82vw}.hero--retained h1{font-size:38px;letter-spacing:-1px}.hero--retained .hero__summary{font-size:16px;margin-top:20px}.hero--retained .hero__visual{width:82vw;margin-top:32px}}
@media(max-width:440px){.hero--retained h1{font-size:32px}.hero--retained .hero__summary{font-size:15px}}
