:root { --navy:#06152f; --blue:#2379d8; --sky:#8fd8ff; --paper:#f7fbff; --ink:#102844; --muted:#60758c; --line:rgba(16,40,68,.14); --display:Georgia,"Songti SC","STSong",serif; --sans:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",system-ui,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; color:var(--ink); background:var(--paper); font-family:var(--sans); line-height:1.75; line-break:strict; -webkit-font-smoothing:antialiased; }
h1,h2,h3 { text-wrap:balance; }
p,li { text-wrap:pretty; }
h1 > span,h2 > span,h3 > span { white-space:nowrap; }
a { color:inherit; text-decoration:none; }
.case-wrap { width:min(1160px,calc(100% - 80px)); margin:0 auto; }
.case-nav { position:absolute; z-index:10; top:0; right:0; left:0; width:min(1160px,calc(100% - 80px)); min-height:96px; display:flex; align-items:center; justify-content:space-between; margin:auto; color:white; }
.case-brand { display:inline-flex; align-items:center; gap:14px; }
.case-brand span { width:50px; height:50px; display:grid; place-items:center; color:#0a3b76; background:white; border-radius:50% 50% 50% 10px; font:700 14px/1 Georgia,serif; letter-spacing:.08em; }
.case-brand strong { font:600 22px/1.2 var(--display); letter-spacing:.08em; }
.back-home { display:inline-flex; align-items:center; gap:10px; padding:12px 2px; color:rgba(255,255,255,.82); font-size:13px; letter-spacing:.06em; transition:color .18s ease,transform .18s ease; }
.back-home i { color:var(--sky); font-size:18px; font-style:normal; line-height:1; }
.back-home:hover { color:var(--sky); transform:translateX(-3px); }
.back-home:focus-visible,.case-brand:focus-visible,.case-disclaimer a:focus-visible { outline:2px solid var(--sky); outline-offset:5px; }

.case-hero { position:relative; min-height:720px; overflow:hidden; color:white; background:linear-gradient(128deg,#040e21 0%,#092b5c 53%,#0b4a91 100%); isolation:isolate; }
.case-hero.case-two { background:linear-gradient(130deg,#061327 0%,#123a68 50%,#1d6a9e 100%); }
.case-hero::before { content:""; position:absolute; z-index:-1; width:680px; height:680px; right:-120px; top:-170px; border:1px solid rgba(171,223,255,.24); border-radius:50%; box-shadow:0 0 0 86px rgba(140,211,255,.045),0 0 0 172px rgba(140,211,255,.022); animation:caseBreathe 8s ease-in-out infinite; }
.case-hero::after { content:"CASE FILE"; position:absolute; z-index:-1; right:-1vw; bottom:-3.5vw; color:rgba(255,255,255,.04); font:700 13vw/1 Georgia,serif; letter-spacing:-.07em; }
.case-hero-grid { position:absolute; z-index:-2; inset:0; opacity:.21; background-image:linear-gradient(rgba(183,228,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(183,228,255,.12) 1px,transparent 1px); background-size:96px 96px; mask-image:linear-gradient(100deg,black,transparent 82%); }
.case-hero-media { position:absolute; z-index:-1; right:0; bottom:0; width:min(52vw,760px); height:78%; opacity:.38; background:linear-gradient(90deg,#0d3767 0%,transparent 42%),url("/assets/section-molecular-orbit-v1.png") center/cover no-repeat; mix-blend-mode:screen; mask-image:linear-gradient(90deg,transparent 0%,black 42%,black 100%); }
.case-two .case-hero-media { background-image:linear-gradient(90deg,#174b79 0%,transparent 42%),url("/assets/section-material-micro-v1.png"); opacity:.33; }
.case-hero-layout { position:relative; z-index:2; min-height:720px; display:grid; grid-template-columns:minmax(0,1fr) minmax(290px,340px); gap:clamp(42px,6vw,82px); align-items:center; padding:148px 0 76px; }
.case-hero-copy { max-width:720px; min-width:0; }
.eyebrow { margin:0; color:var(--sky); font-size:10px; font-weight:800; letter-spacing:.2em; }
.eyebrow::before { content:""; display:inline-block; width:42px; height:1px; margin:0 12px 4px 0; background:currentColor; }
.eyebrow.dark { color:var(--blue); }
.case-hero h1 { max-width:720px; margin:24px 0 26px; font:500 clamp(48px,4.8vw,72px)/1.14 var(--display); letter-spacing:-.052em; }
.case-hero h1 span { color:var(--sky); }
.case-lead { max-width:610px; margin:0; color:rgba(233,248,255,.76); font-size:14px; line-height:1.95; }
.case-tags { display:flex; flex-wrap:wrap; gap:10px; margin-top:30px; }
.case-tags span { padding:7px 12px; color:#d9f2ff; border:1px solid rgba(179,225,255,.34); border-radius:999px; background:rgba(7,33,72,.22); font-size:10px; letter-spacing:.08em; backdrop-filter:blur(6px); }
.hero-record { position:relative; align-self:end; margin-bottom:18px; padding:29px 29px 27px; overflow:hidden; border:1px solid rgba(189,229,255,.32); background:linear-gradient(145deg,rgba(8,38,79,.66),rgba(4,21,49,.48)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 24px 56px rgba(1,13,34,.24); backdrop-filter:blur(16px); }
.hero-record::before { content:""; position:absolute; top:-1px; left:28px; width:72px; height:2px; background:var(--sky); }
.hero-record::after { content:""; position:absolute; width:120px; height:120px; right:-64px; bottom:-70px; border:1px solid rgba(143,216,255,.22); border-radius:50%; }
.hero-record small { color:var(--sky); font-size:9px; font-weight:800; letter-spacing:.18em; }
.hero-record strong { display:block; margin:21px 0 14px; font:500 24px/1.42 var(--display); letter-spacing:-.035em; }
.hero-record p { max-width:260px; margin:0; color:rgba(232,247,255,.66); font-size:12px; line-height:1.85; }

.case-intro { position:relative; padding:118px 0 124px; overflow:hidden; background:radial-gradient(circle at 86% 12%,rgba(35,121,216,.055),transparent 23%),linear-gradient(180deg,#fff 0%,#f9fcff 100%); }
.case-intro::after { content:""; position:absolute; width:480px; height:480px; right:-300px; bottom:-290px; border:1px solid rgba(35,121,216,.08); border-radius:50%; box-shadow:0 0 0 70px rgba(35,121,216,.018); }
.intro-grid { position:relative; z-index:1; display:grid; grid-template-columns:108px minmax(0,1fr); column-gap:clamp(32px,5vw,68px); align-items:start; }
.case-index { grid-column:1; grid-row:1 / span 2; padding-top:4px; color:var(--blue); }
.case-index span { display:block; font:500 66px/1 Georgia,serif; letter-spacing:-.06em; }
.case-index p { margin:10px 0 0; color:#7990a5; font-size:9px; font-weight:800; letter-spacing:.18em; }
.intro-grid > div:nth-child(2) { grid-column:2; max-width:820px; }
.intro-grid h2,.path-heading h2,.actions-title h2,.case-outcome h2 { margin:18px 0 0; font:500 clamp(40px,4vw,58px)/1.25 var(--display); letter-spacing:-.045em; }
.intro-grid h2 span,.path-heading h2 span,.actions-title h2 span,.case-outcome h2 span { color:var(--blue); }
.intro-copy { grid-column:2; max-width:720px; margin:32px 0 0; padding:3px 0 3px 27px; color:var(--muted); border-left:2px solid rgba(35,121,216,.2); font-size:14px; line-height:2; }

.case-path { position:relative; padding:120px 0 126px; overflow:hidden; color:white; background:radial-gradient(circle at 78% 15%,rgba(35,121,216,.26),transparent 24%),linear-gradient(140deg,#051630,#08295a); }
.case-path::after { content:""; position:absolute; inset:0; opacity:.16; background-image:linear-gradient(rgba(180,224,255,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(180,224,255,.09) 1px,transparent 1px); background-size:108px 108px; mask-image:linear-gradient(120deg,black,transparent 76%); }
.case-path > .case-wrap { position:relative; z-index:1; }
.path-heading { max-width:760px; }
.path-heading h2 { color:white; }
.path-heading h2 span { color:var(--sky); }
.path-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:68px 0 0; padding:0; list-style:none; }
.path-list li { position:relative; min-height:250px; display:grid; grid-template-columns:46px minmax(0,1fr); gap:19px; padding:31px 32px 30px; overflow:hidden; border:1px solid rgba(180,224,255,.17); background:linear-gradient(145deg,rgba(10,44,91,.78),rgba(4,24,56,.5)); box-shadow:inset 0 1px 0 rgba(255,255,255,.04); transition:background .2s ease,border-color .2s ease,transform .2s ease; }
.path-list li::after { content:""; position:absolute; width:110px; height:110px; right:-70px; bottom:-75px; border:1px solid rgba(143,216,255,.16); border-radius:50%; }
.path-list > li > span { width:38px; height:38px; display:grid; place-items:center; color:var(--sky); border:1px solid rgba(143,216,255,.3); border-radius:50%; font:500 12px/1 Georgia,serif; }
.path-list small { display:block; margin:3px 0 0; color:rgba(181,226,255,.66); font-size:9px; font-weight:800; letter-spacing:.18em; }
.path-list h3 { max-width:390px; margin:14px 0 12px; color:white; font:500 25px/1.36 var(--display); letter-spacing:-.025em; }
.path-list p { max-width:430px; margin:0; color:rgba(231,246,255,.67); font-size:12px; line-height:1.9; }

.case-actions { position:relative; padding:120px 0 132px; overflow:hidden; background:radial-gradient(circle at 50% 0,rgba(35,121,216,.07),transparent 30%),#f4f9fd; }
.case-actions::before { content:""; position:absolute; width:620px; height:220px; left:-250px; bottom:-130px; border:1px solid rgba(35,121,216,.09); border-radius:50%; transform:rotate(-8deg); }
.actions-title { max-width:820px; margin:0 auto; text-align:center; }
.actions-title .eyebrow::before { width:54px; }
.actions-title h2 { margin-top:22px; }
.action-grid { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-top:62px; }
.action-grid article { position:relative; min-height:260px; padding:31px 30px 29px; overflow:hidden; border:1px solid rgba(16,40,68,.12); background:linear-gradient(145deg,#fff,#fafdff); box-shadow:0 16px 42px rgba(18,66,118,.055); transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease; }
.action-grid article::before { content:""; position:absolute; top:0; right:0; left:0; height:3px; background:linear-gradient(90deg,var(--blue),var(--sky)); transform:scaleX(.26); transform-origin:left; transition:transform .25s ease; }
.action-grid article:nth-child(2) { color:white; border-color:rgba(79,167,231,.42); background:linear-gradient(145deg,#082c5c,#0c5599); box-shadow:0 22px 54px rgba(10,61,117,.17); }
.action-grid span { width:40px; height:40px; display:grid; place-items:center; color:var(--blue); border:1px solid rgba(35,121,216,.2); border-radius:50%; font:500 11px/1 Georgia,serif; }
.action-grid article:nth-child(2) span { color:var(--sky); border-color:rgba(143,216,255,.34); }
.action-grid h3 { margin:46px 0 13px; font:500 26px/1.25 var(--display); letter-spacing:-.03em; }
.action-grid p { margin:0; color:var(--muted); font-size:12px; line-height:1.9; }
.action-grid article:nth-child(2) p { color:rgba(232,247,255,.7); }

.case-outcome { position:relative; overflow:hidden; padding:110px 0; color:white; background:linear-gradient(115deg,#082653,#0d5596); }
.case-outcome::before { content:""; position:absolute; width:520px; height:520px; left:-260px; top:-300px; border:1px solid rgba(190,228,255,.13); border-radius:50%; box-shadow:0 0 0 75px rgba(255,255,255,.015); }
.case-outcome::after { content:"RESULT"; position:absolute; right:-1vw; bottom:-3vw; color:rgba(255,255,255,.04); font:700 14vw/1 Georgia,serif; letter-spacing:-.08em; }
.outcome-layout { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(320px,.72fr); gap:clamp(50px,8vw,96px); align-items:center; }
.case-outcome h2 { margin-top:18px; color:white; }
.case-outcome h2 span { color:var(--sky); }
.outcome-layout > p { max-width:440px; margin:0; padding:27px 29px; color:rgba(234,248,255,.78); border:1px solid rgba(185,226,255,.2); border-left:3px solid var(--sky); background:rgba(5,28,64,.24); font-size:14px; line-height:2; backdrop-filter:blur(8px); }

.case-disclaimer { padding:40px 0; background:#06152f; color:rgba(225,243,255,.56); }
.case-disclaimer > .case-wrap { display:flex; align-items:center; justify-content:space-between; gap:45px; }
.case-disclaimer p { max-width:740px; margin:0; font-size:10px; line-height:1.9; }
.case-disclaimer a { flex:0 0 auto; min-height:48px; display:inline-flex; align-items:center; gap:15px; padding:0 19px; color:var(--navy); background:white; border:1px solid rgba(255,255,255,.86); border-radius:999px; box-shadow:0 12px 30px rgba(0,12,31,.22); font-size:12px; font-weight:700; letter-spacing:.06em; transition:transform .18s ease,box-shadow .18s ease; }
.case-disclaimer a span { color:var(--sky); font-size:16px; transition:transform .18s ease; }
.case-footer { min-height:108px; display:flex; align-items:center; justify-content:space-between; gap:30px; padding:0 max(40px,calc((100% - 1160px) / 2)); color:rgba(255,255,255,.58); background:#030e21; }
.case-footer .case-brand { color:white; }
.case-footer p { margin:0; font-size:10px; }

@media (hover:hover) and (pointer:fine) {
  .path-list li:hover { z-index:1; border-color:rgba(143,216,255,.4); background:linear-gradient(145deg,rgba(16,67,130,.9),rgba(5,31,70,.66)); transform:translateY(-4px); }
  .action-grid article:hover { border-color:rgba(35,121,216,.25); transform:translateY(-5px); box-shadow:0 23px 52px rgba(20,68,121,.11); }
  .action-grid article:hover::before { transform:scaleX(1); }
  .case-disclaimer a:hover { transform:translateY(-3px); box-shadow:0 17px 38px rgba(0,12,31,.3); }
  .case-disclaimer a:hover span { transform:translate(3px,-3px); }
}

@keyframes caseBreathe { 0%,100% { transform:scale(.96); opacity:.55; } 50% { transform:scale(1.04); opacity:1; } }

@media (max-width:1080px) {
  .case-wrap,.case-nav { width:min(100% - 56px,1160px); }
  .case-hero-layout { grid-template-columns:minmax(0,1fr) 300px; gap:42px; }
  .case-hero h1 { font-size:clamp(48px,6vw,64px); }
  .intro-grid { grid-template-columns:90px minmax(0,1fr); column-gap:42px; }
  .case-index span { font-size:58px; }
  .action-grid { gap:12px; }
  .action-grid article { padding:27px 25px; }
}

@media (max-width:820px) {
  h1 > span,h2 > span,h3 > span { white-space:normal; }
  .case-hero,.case-hero-layout { min-height:auto; }
  .case-hero-layout { grid-template-columns:1fr; gap:42px; padding:140px 0 70px; }
  .case-hero-media { width:100%; height:60%; opacity:.24; }
  .hero-record { align-self:auto; width:min(100%,520px); margin:0; }
  .intro-grid { grid-template-columns:1fr; row-gap:24px; }
  .case-index { grid-column:1; grid-row:auto; display:flex; align-items:center; gap:14px; }
  .case-index p { margin:0; }
  .intro-grid > div:nth-child(2),.intro-copy { grid-column:1; }
  .intro-copy { margin-top:4px; }
  .path-list { grid-template-columns:1fr; }
  .action-grid { grid-template-columns:1fr; max-width:620px; margin-right:auto; margin-left:auto; }
  .action-grid article { min-height:230px; }
  .outcome-layout { grid-template-columns:1fr; gap:36px; }
  .outcome-layout > p { max-width:600px; }
}

@media (max-width:560px) {
  .case-wrap,.case-nav { width:calc(100% - 32px); }
  .case-nav { min-height:78px; }
  .case-brand { gap:11px; }
  .case-brand span { width:44px; height:44px; font-size:13px; }
  .case-brand strong { font-size:19px; }
  .back-home { font-size:11px; }
  .case-hero-layout { padding:126px 0 60px; }
  .case-hero h1 { margin:20px 0 22px; font-size:clamp(40px,12.5vw,48px); line-height:1.18; }
  .case-lead { font-size:13px; }
  .hero-record { padding:24px 23px; }
  .hero-record strong { margin:17px 0 11px; font-size:22px; }
  .case-intro,.case-path,.case-actions { padding:86px 0 92px; }
  .case-index span { font-size:48px; }
  .intro-grid h2,.path-heading h2,.actions-title h2,.case-outcome h2 { font-size:36px; line-height:1.3; }
  .intro-copy { padding-left:20px; font-size:13px; }
  .path-list { margin-top:48px; }
  .path-list li { min-height:auto; grid-template-columns:38px minmax(0,1fr); gap:15px; padding:25px 22px 27px; }
  .path-list > li > span { width:34px; height:34px; }
  .path-list h3 { font-size:23px; }
  .actions-title { text-align:left; }
  .actions-title .eyebrow::before { width:42px; }
  .action-grid { margin-top:46px; }
  .action-grid article { min-height:0; padding:26px 23px; }
  .action-grid h3 { margin-top:36px; }
  .case-outcome { padding:88px 0; }
  .outcome-layout > p { padding:22px 20px; font-size:13px; }
  .case-disclaimer { padding:30px 0; }
  .case-disclaimer > .case-wrap,.case-footer { align-items:flex-start; flex-direction:column; }
  .case-disclaimer a { margin-top:0; }
  .case-footer { min-height:146px; padding:32px 16px; justify-content:center; }
}

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