/* Standalone HELIO experience page. Its styles do not depend on homepage motion. */
:root{color-scheme:light;--ink:#17223a;--muted:#647089;--line:#dce1ec;--paper:#f6f8fc;--blue:#4f66e8;--night:#101114;--white:#f2f4f7;font-family:Arial,"Microsoft YaHei",sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:112px}
body{margin:0;background:var(--paper);color:var(--ink);font-size:16px;line-height:1.8;overflow-wrap:break-word}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
p,h1,h2,h3,figure{margin:0}
a:focus-visible{outline:3px solid var(--blue);outline-offset:6px}
.case-shell{width:min(1240px,calc(100% - 96px));margin-inline:auto}
.case-skip{position:fixed;top:12px;left:16px;z-index:30;padding:8px 16px;background:var(--white);color:var(--ink);transform:translateY(-150%)}
.case-skip:focus{transform:none}
.case-header{position:sticky;top:0;z-index:20;background:rgba(16,17,20,.96);color:var(--white);border-bottom:1px solid rgba(242,244,247,.12);backdrop-filter:blur(14px)}
.header-row{display:flex;align-items:center;justify-content:space-between;min-height:96px;gap:24px}
.case-brand{display:inline-flex;align-items:center;padding:12px 0}
.case-brand img{width:160px;height:auto}
.header-row nav{display:flex;gap:38px;align-items:center;font-size:14px}
.header-row nav span{margin-left:8px}
.header-contact{border:1px solid #4e535e;border-radius:3px;padding:9px 20px}
.header-row nav a:hover{color:#c2ccff}
.case-hero{padding:70px 0 0;background:var(--night);color:var(--white)}
.hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:64px;align-items:center}
.case-eyebrow{font-size:11px;line-height:1.5;letter-spacing:.18em;font-weight:400;color:var(--blue)}
.hero-copy>.case-eyebrow{color:#a6b5ff}
.case-eyebrow span{margin-inline:12px;color:#68728a}
.experience-label{font-size:13px;color:#b6bfd1;margin-top:24px}
h1{font-size:clamp(38px,4.3vw,62px);line-height:1.27;letter-spacing:-.025em;font-weight:700;margin-top:17px}
.hero-intro{font-size:17px;color:#c1c9d7;max-width:460px;margin-top:28px;line-height:1.9}
.hero-anchor{display:inline-flex;gap:36px;align-items:center;font-size:13px;border-bottom:1px solid #5a616f;padding:8px 0;margin-top:28px}
.hero-photo{position:relative;align-self:stretch;min-height:550px;overflow:hidden;background:#23252b}
.hero-photo>img{width:100%;height:100%;object-fit:cover;object-position:46% 50%}
.hero-photo::after{content:"";position:absolute;inset:60% 0 0;background:linear-gradient(transparent,rgba(16,17,20,.75));pointer-events:none}
.hero-photo figcaption{position:absolute;z-index:1;bottom:24px;left:24px;right:24px;font-size:13px;display:flex;justify-content:space-between;gap:20px;color:var(--white)}
.hero-photo figcaption span{font-size:11px;opacity:.8}
.case-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;padding:42px 0;border-top:1px solid rgba(242,244,247,.16);margin-top:56px}
.case-facts div{display:flex;flex-direction:column;gap:5px}
.case-facts span{color:#a6afbf;font-size:12px}
.case-facts strong{font-size:15px;font-weight:400}
.reading-layout{display:grid;grid-template-columns:190px 1fr;gap:70px;padding:96px 0 110px}
.reading-nav{position:sticky;top:142px;align-self:start}
.reading-nav>span{font-size:10px;letter-spacing:.15em;color:#778298}
.reading-nav nav{display:flex;flex-direction:column;gap:12px;border-left:1px solid var(--line);margin-top:26px;padding-left:20px;font-size:13px}
.reading-nav a:hover{color:var(--blue)}
.case-story{min-width:0}
.story-section+.story-section{padding-top:70px;margin-top:70px;border-top:1px solid var(--line)}
.story-section>h2{margin:20px 0 24px;font-size:clamp(27px,3.1vw,42px);line-height:1.42;letter-spacing:-.02em;font-weight:700}
.story-section>p:not(.case-eyebrow){max-width:820px;color:#4e5b73;line-height:1.9;margin-top:16px}
.story-section>p.story-lead{font-size:19px;color:var(--ink);line-height:1.9}
.thinking-diagram{margin-top:34px}
.thinking-diagram ol{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;list-style:none;padding:0;margin:0}
.thinking-diagram li{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:220px;padding:26px 22px;background:#fff;border:1px solid var(--line)}
.thinking-diagram li+li::before{content:"→";position:absolute;left:-20px;top:44%;color:var(--blue);font-size:19px}
.thinking-diagram li span{font-size:12px;color:var(--muted)}
.thinking-diagram li strong{font-size:22px;font-weight:400;line-height:1.6;margin:18px 0;color:var(--ink)}
.thinking-diagram li:last-child{background:#e9edff;border-color:#d2d9fa}
.thinking-diagram small{font-size:11px;color:var(--muted)}
.thinking-diagram figcaption{margin-top:13px;color:#778298;font-size:12px;line-height:1.7}
.insight{display:flex;gap:20px;align-items:flex-start;background:#fff;border-left:3px solid var(--blue);padding:23px 28px;margin-top:28px}
.insight>span{font-size:24px;color:var(--blue);line-height:1.4}
.insight p{font-size:17px;color:var(--ink)}
.participation-list{margin-top:34px}
.participation-list article{display:grid;grid-template-columns:50px 1fr;gap:20px;border-top:1px solid var(--line);padding:28px 0}
.participation-list article>span{font-size:12px;color:var(--blue);padding-top:5px}
.participation-list h3{font-size:21px;font-weight:400;line-height:1.6;margin-bottom:12px}
.participation-list p{color:#4e5b73;line-height:1.9}
.participation-list p.touchpoints{font-size:12px;color:var(--muted);margin-top:15px}
.scene-photo{margin-top:34px}
.scene-photo>img{width:100%;height:auto}
.scene-photo figcaption{display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:12px;margin-top:13px}
.boundary-section{padding:35px!important;border:1px solid var(--line)!important;background:#fff}
.boundary-section>h2{font-size:27px;margin-top:16px}
.boundary-section>p:not(.case-eyebrow){font-size:14px}
.source-link{font-size:13px;color:var(--blue);display:inline-flex;gap:18px;align-items:center;border-bottom:1px solid #cad2ff;margin-top:24px;padding-bottom:5px}
.case-next{background:#e9edff;padding:74px 0}
.next-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:40px;align-items:center}
.case-next h2{font-size:clamp(30px,3.5vw,46px);line-height:1.4;letter-spacing:-.02em;margin-top:20px}
.case-next p:not(.case-eyebrow){font-size:15px;line-height:1.9;color:#4e5b73;margin-top:20px}
.next-actions{display:flex;flex-direction:column;align-items:flex-start;gap:20px;font-size:14px;justify-self:end}
.case-button{background:var(--blue);color:#fff;border-radius:3px;padding:15px 25px;display:inline-flex;gap:38px;align-items:center}
.case-button:hover{background:#4057d8}
.next-actions>a:last-child{padding:7px 0;border-bottom:1px solid #b5bfe8}
.next-actions>a:last-child span{padding-left:28px}
.case-footer{background:var(--night);color:var(--white);padding:38px 0 26px}
.footer-brand-row{display:flex;align-items:center;gap:35px;padding-bottom:28px}
.footer-brand-row p{font-size:14px;color:#a6afbf}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:30px;border-top:1px solid #333842;padding-top:22px;font-size:11px;color:#a6afbf}
.footer-bottom nav{display:flex;gap:19px;flex-wrap:wrap}
.footer-bottom a:hover{color:var(--white)}
@media(max-width:1000px){.case-shell{width:calc(100% - 64px)}.hero-grid{gap:36px}.hero-photo{min-height:500px}.hero-intro{font-size:16px}.reading-layout{grid-template-columns:150px 1fr;gap:42px}.thinking-diagram ol{gap:18px}.thinking-diagram li{padding:22px 16px}.thinking-diagram li+li::before{left:-16px}.thinking-diagram li strong{font-size:20px}.footer-bottom{align-items:flex-start;flex-direction:column;gap:15px}}
@media(max-width:760px){html{scroll-padding-top:92px}.case-shell{width:calc(100% - 40px)}.header-row{min-height:80px;gap:20px}.case-brand img{width:136px}.header-row nav{font-size:12px;gap:0}.header-contact{display:none}.case-hero{padding-top:42px}.hero-grid{grid-template-columns:1fr;gap:35px}.hero-intro{max-width:520px}.hero-copy h1{font-size:42px}.hero-photo{min-height:0;aspect-ratio:1.25}.hero-photo>img{height:100%;object-position:50% 48%}.hero-photo figcaption{left:18px;right:18px;bottom:16px}.case-facts{grid-template-columns:1fr;gap:18px;padding:27px 0;margin-top:28px}.case-facts div{flex-direction:row;gap:24px;align-items:center}.case-facts span{min-width:62px}.case-facts strong{font-size:13px}.reading-layout{display:block;padding:36px 0 58px}.reading-nav{position:static;margin-bottom:40px}.reading-nav>span{display:none}.reading-nav nav{flex-direction:row;flex-wrap:wrap;border-left:0;border-bottom:1px solid var(--line);margin:0;padding:0 0 20px;gap:12px 22px;font-size:12px}.story-section+.story-section{margin-top:45px;padding-top:45px}.story-section>h2{font-size:30px;margin-top:17px}.story-section>p.story-lead{font-size:17px}.story-section>p:not(.case-eyebrow){font-size:15px}.thinking-diagram li{min-height:200px;padding:19px 13px}.thinking-diagram li strong{font-size:17px}.thinking-diagram li span{font-size:11px}.thinking-diagram small{font-size:10px}.thinking-diagram figcaption{font-size:11px}.insight{padding:20px;gap:14px}.insight p{font-size:15px}.participation-list article{grid-template-columns:30px 1fr;gap:14px;padding:24px 0}.participation-list h3{font-size:20px}.participation-list p{font-size:15px}.scene-photo figcaption{font-size:11px}.boundary-section{padding:24px!important}.boundary-section>h2{font-size:24px}.source-link{font-size:12px;gap:10px}.next-grid{grid-template-columns:1fr;gap:32px}.next-actions{justify-self:start}.case-next{padding:48px 0}.case-next h2{font-size:34px}.footer-brand-row{align-items:flex-start;flex-direction:column;gap:5px}.case-footer{padding-top:25px}.footer-bottom{font-size:10px}.footer-bottom nav{gap:12px 16px}}
@media(max-width:430px){.hero-copy h1{font-size:38px}.experience-label{font-size:12px}.case-eyebrow{font-size:10px}.thinking-diagram ol{grid-template-columns:1fr;gap:18px}.thinking-diagram li{min-height:0;display:grid;grid-template-columns:65px 1fr;column-gap:18px;padding:21px}.thinking-diagram li strong{font-size:20px;margin:0}.thinking-diagram li small{grid-column:2;font-size:11px;margin-top:8px}.thinking-diagram li span{padding-top:5px}.thinking-diagram li+li::before{content:"↓";left:calc(50% - 5px);top:-21px;font-size:17px}.hero-photo figcaption{font-size:11px;gap:10px}.hero-photo figcaption span{font-size:10px}.case-brand img{width:122px}.case-shell{width:calc(100% - 36px)}.story-section>h2{font-size:27px}.hero-intro{font-size:15px}.header-row nav{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}