:root{--bg:#252826;--panel:#303431;--ink:#f7f4f0;--muted:#c1c4bf;--pink:#ed4f86;--light:#f7bfd0;--line:#555b56}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.8 'PingFang SC','Microsoft YaHei',sans-serif}a{color:inherit;text-decoration:none}button{font:inherit}img{max-width:100%;display:block}.wrap{width:min(1160px,calc(100% - 48px));margin:auto}.nav{position:sticky;z-index:10;top:14px;width:min(730px,calc(100% - 32px));margin:18px auto -70px;background:#252826ee;border:1px solid #656a65;border-radius:40px;display:flex;align-items:center;justify-content:center;gap:4px;padding:5px;backdrop-filter:blur(15px)}.nav a{font-size:13px;padding:7px 14px;border-radius:25px;white-space:nowrap;color:#d6d8d4}.nav a.active,.nav a:hover{background:var(--pink);color:#252826}.hero{padding:150px 0 50px;position:relative;min-height:780px}.eyebrow{font-size:12px;letter-spacing:.16em;font-weight:700;color:var(--light);text-transform:uppercase}.hero h1{font-size:25px;margin:12px 0 0}.portfolio{font-size:clamp(54px,7vw,82px);letter-spacing:-.055em;line-height:1.06;font-weight:750;margin:8px 0 18px}.pink{color:var(--pink)}.subtitle{font-size:20px;color:var(--light);font-weight:600}.lead{color:var(--muted);font-size:16px;line-height:1.9;max-width:610px}.buttons{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.button{border:1px solid #757b74;border-radius:30px;padding:9px 22px;display:inline-block;font-size:14px}.button.primary{background:var(--pink);border-color:var(--pink);color:#252826;font-weight:700}.portrait{position:absolute;right:7%;top:160px;width:210px;height:210px;border-radius:50%;object-fit:cover;object-position:center 35%;border:3px solid #9b828a}.fan{display:flex;justify-content:center;align-items:center;gap:12px;margin:70px 0 0}.fan a{width:150px;height:195px;padding:10px;border:1px solid #696f69;border-radius:12px;background:#343936;display:flex;flex-direction:column;align-items:center;justify-content:space-between;box-shadow:0 15px 32px #15171575;transition:transform .25s}.fan a:first-child{transform:rotate(-7deg) translateY(12px)}.fan a:last-child{transform:rotate(7deg) translateY(12px)}.fan a:hover{transform:translateY(-12px)}.fan img{height:145px;width:100%;object-fit:contain}.fan span{font-size:13px}.section{padding:95px 0;border-top:1px solid var(--line)}.heading{font-size:clamp(30px,4vw,48px);line-height:1.2;letter-spacing:-.035em;margin:14px 0 18px}.intro{color:var(--muted);max-width:720px}.case-list{margin-top:45px}.case-row{display:grid;grid-template-columns:54% 46%;padding:28px 0;border-top:1px solid var(--line);align-items:center}.case-image{height:390px;background:#303431;display:grid;place-items:center;overflow:hidden}.case-image img{max-height:340px;width:auto;object-fit:contain}.case-copy{padding:35px 0 35px 65px}.case-copy h3{font-size:30px;line-height:1.35;margin:14px 0}.case-copy p,.muted{color:var(--muted)}.case-copy a:not(.arrow){display:block}.arrow{display:inline-block;margin-top:16px;color:var(--light);font-weight:600}.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}.work{border-top:1px solid var(--line);padding-top:18px}.work img,.work .tile{height:190px;width:100%;object-fit:contain;background:var(--panel)}.tile{display:grid;place-items:center;letter-spacing:.1em;color:#bfc3bc}.work h3{font-size:18px;margin:18px 0 5px}.work p{font-size:14px;color:var(--muted);margin:0}.split{display:grid;grid-template-columns:1fr 1fr;gap:70px}.strengths{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:30px}.strength{padding:24px;border:1px solid var(--line);border-radius:12px}.strength h3{font-size:20px;line-height:1.5}.strength p{color:var(--muted);font-size:14px}.timeline{margin-top:25px;border-left:1px solid var(--pink);padding-left:25px}.timeline p{margin:0 0 20px;color:var(--muted);font-size:14px}.timeline strong{display:block;color:var(--ink);font-size:16px}.contact{padding:90px 0 110px}.contact-grid{display:flex;justify-content:space-between;align-items:end;gap:30px}.contact h2{font-size:clamp(32px,4vw,48px);line-height:1.3}.contact a{text-decoration:underline;text-underline-offset:4px}.footer{border-top:1px solid var(--line);padding:24px 0;color:#acb0aa;font-size:12px}.topbar{padding:25px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:20px}.topbar a:hover{color:var(--light)}.case-hero{padding:90px 0 65px}.case-hero h1{font-size:clamp(36px,5vw,60px);line-height:1.2;letter-spacing:-.035em;max-width:950px;margin:18px 0}.case-hero p{max-width:850px;font-size:18px;color:var(--muted)}.case-banner{background:#303431;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px;padding:55px;min-height:420px}.case-banner h2{font-size:36px;line-height:1.45}.case-banner img{width:auto;max-height:370px;justify-self:center;object-fit:contain}.case-body{width:min(1040px,calc(100% - 48px));margin:auto}.case-section{padding:75px 0;border-bottom:1px solid var(--line)}.case-section h2{font-size:clamp(26px,3vw,36px);line-height:1.35;margin:14px 0 24px}.case-section p{color:var(--muted);line-height:2}.case-section .two{display:grid;grid-template-columns:1fr 1fr;gap:60px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;margin:30px 0}.stat{border-left:2px solid var(--pink);padding-left:18px}.stat strong{display:block;font-size:30px;color:var(--ink);line-height:1.3}.stat span{font-size:14px;color:var(--muted)}.quote{font-size:clamp(26px,3vw,36px);line-height:1.6;color:var(--light);margin:30px 0}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:35px}.gallery.two-col{grid-template-columns:repeat(2,1fr)}figure{margin:0}.image-btn{cursor:zoom-in;border:0;padding:18px;background:#343935;width:100%;height:440px;display:grid;place-items:center}.image-btn img{max-height:100%;max-width:100%;width:auto;object-fit:contain}.image-btn:focus-visible,.button:focus-visible{outline:3px solid var(--pink);outline-offset:3px}figcaption{font-size:13px;color:var(--muted);margin-top:10px}.evidence .image-btn{height:auto;min-height:250px}.evidence img{max-height:440px}details{margin-top:25px;border-top:1px solid var(--line);padding-top:20px}summary{cursor:pointer;color:var(--light)}.sources{display:flex;gap:22px;flex-wrap:wrap}.sources a{text-decoration:underline;text-underline-offset:4px}.next{display:flex;justify-content:space-between;gap:20px;padding:45px 0 80px}.lightbox{position:fixed;inset:0;background:#0b0d0bee;z-index:30;display:none;place-items:center;padding:55px 25px}.lightbox.open{display:grid}.lightbox img{max-width:100%;max-height:85vh;object-fit:contain}.lightbox button{position:absolute;right:20px;top:10px;color:white;background:none;border:0;font-size:38px;cursor:pointer}.reveal{opacity:1;transform:none}@media(prefers-reduced-motion:no-preference){.js .reveal{opacity:.88;transform:translateY(14px);transition:opacity .6s,transform .6s}.js .reveal.visible{opacity:1;transform:none}}@media(max-width:700px){body{font-size:15px}.wrap,.case-body{width:calc(100% - 36px)}.nav{top:8px;overflow-x:auto;justify-content:flex-start}.nav a{padding:7px 10px;font-size:12px}.hero{padding-top:125px;min-height:0}.hero h1{font-size:19px;padding-right:125px}.portfolio{font-size:clamp(44px,11vw,64px)}.hero .lead{padding-right:0}.portrait{width:105px;height:105px;right:2px;top:125px}.fan{margin:50px 0 15px;gap:5px}.fan a{width:30%;height:157px;padding:7px}.fan img{height:111px}.section{padding:65px 0}.case-row,.split,.case-banner,.case-section .two{grid-template-columns:1fr;gap:20px}.case-image{height:300px}.case-image img{max-height:270px}.case-copy{padding:20px 0 30px}.case-copy h3{font-size:25px}.work-grid,.strengths{grid-template-columns:1fr}.work img,.work .tile{height:220px}.contact-grid{display:block}.case-hero{padding:65px 0 45px}.case-banner{padding:30px;min-height:0}.case-banner img{max-height:300px}.case-section{padding:55px 0}.gallery{grid-template-columns:1fr 1fr;gap:12px}.gallery.two-col{grid-template-columns:1fr}.image-btn{height:300px;padding:12px}.stats{grid-template-columns:1fr;gap:20px}.topbar{font-size:13px}.next{font-size:14px}}
/* 米咖案例：沿用已确认 Demo 的章节、图文节奏与粉色细节 */
.ribbon{height:25px;background:#f7bfd0;color:#252826;font-size:9px;letter-spacing:.3em;text-align:center;line-height:25px}.m-hero{padding:95px 0 80px;display:grid;grid-template-columns:1.25fr .75fr;align-items:center;gap:80px}.m-hero h1{font-size:clamp(55px,7vw,82px);line-height:1.1;margin:26px 0}.m-hero h1 span{color:#ed6e9b;text-shadow:2px 2px #f7bfd0}.m-hero h2{font-size:clamp(28px,3.5vw,40px);line-height:1.45;margin:0 0 24px}.m-hero p{color:var(--muted);max-width:650px}.m-hero .image-btn{height:480px;padding:12px;border:1px solid var(--line);background:transparent}.role-label{font-size:13px;color:var(--light);margin-top:32px}.m-hero p.roles{font-size:14px;color:var(--ink)}.m-overview{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:38px 0;display:grid;grid-template-columns:1fr 1fr;gap:70px}.m-overview p{color:var(--muted);margin-bottom:0}.m-results{display:grid;grid-template-columns:repeat(5,1fr);gap:15px;padding:40px 0 10px}.m-result{border-left:1px solid var(--pink);padding-left:15px}.m-result strong{display:block;font-size:clamp(20px,2.4vw,30px);line-height:1.3}.m-result span,.m-note{font-size:13px;color:var(--muted)}.m-note{line-height:1.8}.chapter-nav{display:flex;gap:0;flex-wrap:wrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:42px 0 0}.chapter-nav a{padding:15px 20px 15px 0;margin-right:20px;font-size:13px;color:var(--light)}.m-chapter{display:grid;grid-template-columns:190px 1fr;gap:35px}.chapter-label{display:flex;flex-direction:column;gap:8px;color:var(--light)}.chapter-label b{font-size:15px}.chapter-label span{font-size:24px;color:var(--ink);font-weight:700}.chapter-label small{font-size:10px;letter-spacing:.1em;color:#a7aba5;line-height:1.5}.m-three{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:35px 0}.m-three>div{border-top:1px solid var(--line);padding-top:18px}.m-three small,.m-concepts small{color:var(--light)}.m-three h3{font-size:17px;margin:10px 0}.m-three p{font-size:14px}.m-concepts{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:32px 0}.m-concepts>div{border-left:2px solid var(--pink);padding-left:20px}.m-concepts strong{display:block;font-size:28px;color:var(--light)}.wide-image{height:auto;min-height:180px;margin-top:30px}.wide-image img{max-height:330px}.collab{margin-top:90px}.collab>p{max-width:850px}.m-review p{border-top:1px solid var(--line);padding-top:15px}.m-review b{color:var(--ink)}.review-image{max-width:360px;margin-top:35px}.review-image .image-btn{height:420px}@media(max-width:700px){.m-hero{padding:55px 0;grid-template-columns:1fr;gap:30px}.m-hero .image-btn{height:330px}.m-overview{grid-template-columns:1fr;gap:25px}.m-results{grid-template-columns:repeat(2,1fr);gap:25px}.m-chapter{grid-template-columns:1fr;gap:20px}.chapter-label{flex-direction:row;align-items:baseline;gap:12px}.chapter-label small{margin-left:auto}.m-three{grid-template-columns:1fr;gap:5px}.m-concepts strong{font-size:20px}.collab{margin-top:55px}.micafe-page .gallery{grid-template-columns:1fr}.micafe-page .gallery .image-btn{height:390px}.micafe-page .evidence .image-btn{height:auto}}
.video-cover{min-height:320px;background:#303431;border:1px solid var(--line);display:grid;grid-template-columns:40% 60%;align-items:center;gap:20px;padding:25px;margin-top:30px}.video-cover>img{height:280px;width:100%;object-fit:contain}.video-cover h3{font-size:28px;margin:12px 0 22px}.video-cover button{cursor:pointer}.video-embed{width:100%;aspect-ratio:16/9;border:0;background:#171917;display:block;margin-top:30px}@media(max-width:700px){.video-cover{grid-template-columns:1fr;gap:10px}.video-cover>img{height:240px}.video-cover h3{font-size:23px}}
/* 首页：以炭灰为基底，加入柔和的粉色光晕。 */
body{background:radial-gradient(ellipse 55% 520px at 87% 4%,rgba(237,79,134,.17),transparent 72%),radial-gradient(ellipse 48% 650px at 4% 25%,rgba(247,191,208,.085),transparent 74%),radial-gradient(ellipse 45% 700px at 94% 66%,rgba(237,79,134,.08),transparent 72%),#252826}
.portrait{object-position:center 35%}
.fan-wrap{margin:70px -12px 0;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin;scrollbar-color:#8e586a transparent;padding:20px 12px 18px}
.fan{margin:0;min-width:1010px;gap:6px;align-items:center}.fan a{flex:0 0 107px;width:107px;height:160px;padding:8px 6px;background:#303532;transform:rotate(0deg);transition:transform .25s,background .25s,border-color .25s}.fan img{height:110px;width:100%;object-fit:contain}.fan span{font-size:11px;text-align:center;line-height:1.3;white-space:nowrap}.fan a:nth-child(1){transform:rotate(-7deg) translateY(14px)}.fan a:nth-child(2){transform:rotate(-5deg) translateY(7px)}.fan a:nth-child(3){transform:rotate(-3deg) translateY(3px)}.fan a:nth-child(4){transform:rotate(-1deg)}.fan a:nth-child(5){transform:none}.fan a:nth-child(6){transform:rotate(1deg)}.fan a:nth-child(7){transform:rotate(3deg) translateY(3px)}.fan a:nth-child(8){transform:rotate(5deg) translateY(7px)}.fan a:nth-child(9){transform:rotate(7deg) translateY(14px)}.fan a:hover,.fan a:focus-visible{transform:translateY(-9px);background:#44383e;border-color:#ed4f86;position:relative;z-index:1}.fan a:focus-visible{outline:2px solid #f7bfd0;outline-offset:3px}.fan-hint{display:none;color:#d5b7c1;font-size:12px;margin:10px 0 0;text-align:right}
@media(max-width:1100px){.fan{justify-content:flex-start}.fan-hint{display:block}}
@media(max-width:700px){.fan-wrap{margin-top:45px}.fan{min-width:1010px}.fan a{flex-basis:107px;width:107px;height:160px}.fan img{height:110px}.portrait{object-position:center 34%}}
@media(prefers-reduced-motion:reduce){.fan a{transition:none}html{scroll-behavior:auto}}
/* 精选案例：左侧主案例，右侧两张并列高度的案例卡。 */
.featured-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:250px 250px;gap:18px;margin-top:42px}.featured-card{position:relative;display:flex;align-items:center;gap:22px;overflow:hidden;border:1px solid #5a5e5a;border-radius:22px;background:linear-gradient(145deg,rgba(237,79,134,.16),rgba(48,52,49,.8) 48%,#242826);padding:26px;transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease}.featured-card:first-child{grid-row:span 2;flex-direction:column;align-items:stretch;justify-content:space-between;padding:32px}.featured-card:hover,.featured-card:focus-visible{transform:scale(1.018);border-color:#cf7796;box-shadow:0 14px 32px #1118;z-index:1}.featured-card:focus-visible{outline:2px solid #f7bfd0;outline-offset:4px}.featured-media{width:46%;height:100%;display:grid;place-items:center;min-width:0}.featured-media img{max-height:100%;max-width:100%;width:auto;object-fit:contain}.featured-main .featured-media{width:100%;height:320px}.featured-copy{flex:1;min-width:0}.featured-copy h3{font-size:25px;line-height:1.25;margin:10px 0}.featured-copy p{color:var(--muted);margin:0 0 12px;line-height:1.5;font-size:14px}.featured-copy span{font-size:13px;color:var(--light);font-weight:600}.hero h1{font-weight:700;letter-spacing:-.025em}.portfolio{font-weight:750;letter-spacing:-.04em}.hero .subtitle{font-weight:700}.hero .eyebrow{letter-spacing:.18em}.nav{box-shadow:0 8px 30px #1114}.page-exiting{opacity:.84;transform:translateY(5px);transition:opacity .18s ease,transform .18s ease}@media(max-width:700px){.featured-grid{grid-template-columns:1fr;grid-template-rows:auto;gap:14px}.featured-card,.featured-card:first-child{grid-row:auto;min-height:230px;flex-direction:row;align-items:center;padding:20px}.featured-main .featured-media,.featured-media{width:42%;height:190px;flex:none}.featured-copy h3{font-size:22px}.featured-card:hover{transform:none}}@media(prefers-reduced-motion:reduce){.featured-card,.page-exiting{transition:none}.featured-card:hover{transform:none}}
.featured-media{min-height:0;overflow:hidden}.featured-media img{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain}.featured-main .featured-media{height:300px;flex:0 0 300px}@media(max-width:700px){.featured-main .featured-media{height:190px;flex:0 0 42%}}
.featured-media{display:block}.featured-media img{display:block;width:100%;height:100%;object-fit:contain}
/* 首页参考：深蓝黑渐变、粉色标题与扇形卡片。 */
body{background:radial-gradient(ellipse 50% 650px at 13% 7%,rgba(24,58,69,.65),transparent 75%),radial-gradient(ellipse 43% 500px at 85% 4%,rgba(89,30,66,.42),transparent 75%),linear-gradient(120deg,#101d23 0%,#071015 70%,#090c10 100%);background-attachment:fixed;color:#f2f5f5}
.nav{background:#0a131ad9;border-color:#38444b;box-shadow:0 8px 30px #0005}.nav a.active,.nav a:hover{background:#ed3b91;color:#071015}.hero{padding-top:132px;min-height:810px}.hero h1{font-size:clamp(48px,5.5vw,76px);line-height:1.08;letter-spacing:-.05em;font-weight:800;color:#ed3b91;margin:18px 0 8px}.portfolio{font-size:clamp(46px,4.5vw,64px);font-weight:450;letter-spacing:.015em;line-height:1.08;margin:6px 0 18px}.hero .subtitle{font-size:25px;color:#ed3b91;font-weight:700}.hero .lead{color:#a9b2b4;font-size:15px;max-width:535px;margin:18px 0}.button.primary{background:#ed3b91;border-color:#ed3b91}.hero .button{padding:10px 22px}.hero-notes{display:flex;gap:10px;margin-top:17px}.hero-notes span{padding:10px 16px;min-width:142px;min-height:51px;border-radius:14px;font-size:13px;line-height:1.5;background:#e96aab;color:#142027}.hero-notes span+span{background:#f2dce7}.portrait{width:300px;height:300px;right:7%;top:133px;border:4px solid #53535d;object-position:center 33%}.portrait-note{position:absolute;right:2%;top:352px;background:#091218;border:1px solid #34414b;padding:12px 15px;border-radius:12px;font-size:11px;color:#d1d6d6;line-height:1.5}.portrait-note strong{color:#ed3b91;font-size:14px}.fan-wrap{position:relative;margin:25px -12px 0;padding:74px 12px 28px;overflow-x:auto;overflow-y:hidden}.fan{position:relative;min-width:1010px;gap:6px}.fan::before{content:'PORTFOLIO';position:absolute;right:0;top:-42px;z-index:0;font-size:118px;letter-spacing:-.06em;font-weight:800;color:transparent;-webkit-text-stroke:1px #a6b7bb15;pointer-events:none}.fan a{--angle:0deg;--rise:0px;position:relative;z-index:1;transform:translateY(var(--rise)) rotate(var(--angle));background:linear-gradient(155deg,#192d35,#0a151b);border-color:#43535a;transition:transform .3s cubic-bezier(.2,.8,.2,1),border-color .3s,box-shadow .3s;transform-origin:50% 85%}.fan a:nth-child(1){--angle:-7deg;--rise:14px}.fan a:nth-child(2){--angle:-5deg;--rise:7px}.fan a:nth-child(3){--angle:-3deg;--rise:3px}.fan a:nth-child(4){--angle:-1deg}.fan a:nth-child(5){--angle:0deg}.fan a:nth-child(6){--angle:1deg}.fan a:nth-child(7){--angle:3deg;--rise:3px}.fan a:nth-child(8){--angle:5deg;--rise:7px}.fan a:nth-child(9){--angle:7deg;--rise:14px}.fan a:nth-child(n){transform:translateY(var(--rise)) rotate(var(--angle))}.fan a.is-neighbor{transform:translateY(-14px) scale(1.12) rotate(0deg);z-index:3}.fan a.is-active,.fan a:focus-visible{transform:translateY(-35px) scale(1.43) rotate(0deg);border-color:#ed3b91;box-shadow:0 0 0 1px #ed3b91,0 15px 40px #000a;z-index:5}.featured-card{background:linear-gradient(150deg,rgba(101,44,79,.45),#101b21 75%);border-color:#35444a}.section,.footer{border-color:#34434a}.case-image,.work img,.work .tile{background:#17262b}
@media(max-width:700px){.hero{padding-top:115px;min-height:0}.hero h1{font-size:clamp(37px,9vw,52px);padding-right:110px}.portfolio{font-size:clamp(38px,10vw,54px)}.hero .subtitle{font-size:19px}.portrait{width:110px;height:110px;right:0;top:125px}.portrait-note{display:none}.hero-notes span{min-width:0;font-size:12px}.fan-wrap{margin-top:20px;padding-top:55px}.fan a.is-active,.fan a:focus-visible{transform:translateY(-20px) scale(1.2)}.fan::before{font-size:80px}}
@media(prefers-reduced-motion:reduce){.fan a{transition:none}.fan a.is-active,.fan a.is-neighbor,.fan a:focus-visible{transform:translateY(var(--rise)) rotate(var(--angle))}}
.hero .lead{max-width:620px}.fan-wrap{padding-top:130px}@media(max-width:700px){.fan-wrap{padding-top:82px}}
.more-rows{margin-top:0}
/* 首屏静态基准与参考页的逐字、卡片动画。 */
:root{--hero-u:clamp(.65px,.048828125vw,1px)}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,'PingFang SC','Microsoft YaHei',sans-serif;background:radial-gradient(ellipse 55% 75% at 18% 50%,#122d37 0%,transparent 72%),radial-gradient(ellipse 32% 48% at 75% 16%,rgba(94,33,70,.29),transparent 75%),linear-gradient(112deg,#0a151b 0%,#071014 56%,#03090c 100%);background-attachment:fixed}
.nav{width:calc(952 * var(--hero-u));height:calc(67 * var(--hero-u));margin:calc(66 * var(--hero-u)) auto calc(-133 * var(--hero-u));border-radius:99px;background:#0a1319e8;border:1px solid #35434a;gap:0}.nav a{font-size:calc(16 * var(--hero-u));padding:calc(12 * var(--hero-u)) calc(20 * var(--hero-u));font-weight:400}.nav a.active,.nav a:hover{background:#ec4899}
.hero{width:min(1160px,56.64vw);left:50%;transform:translateX(-50%);height:calc(950 * var(--hero-u));min-height:0;padding:calc(146 * var(--hero-u)) 0 0 calc(17 * var(--hero-u));overflow:visible}
.hero:before{content:'';position:absolute;z-index:-1;pointer-events:none;left:calc(50% - 50vw + 42px);right:calc(50% - 50vw + 42px);top:calc(44 * var(--hero-u));bottom:calc(6 * var(--hero-u));border:1px solid #26363e;border-radius:calc(38 * var(--hero-u))}
.hero .eyebrow{font-size:calc(11 * var(--hero-u));letter-spacing:.2em;color:#ec4899;font-weight:800;line-height:1.5}
.hero h1{font-size:calc(94.4 * var(--hero-u));line-height:1.18;font-weight:900;letter-spacing:-.02em;color:#ec4899;text-shadow:0 0 26px #ec48991f;margin:calc(20 * var(--hero-u)) 0 0;white-space:nowrap}
.hero .portfolio{font-size:calc(49.56 * var(--hero-u));font-weight:500;line-height:.98;letter-spacing:.06em;margin:calc(8 * var(--hero-u)) 0 calc(14 * var(--hero-u));color:#f5f8f6;white-space:nowrap}
.hero .subtitle{font-size:calc(30 * var(--hero-u));font-weight:800;letter-spacing:-.03em;line-height:1.5;color:#ec4899}
.hero .lead{font-size:calc(13 * var(--hero-u));line-height:1.55;color:#f5f8f6b3;margin:calc(14 * var(--hero-u)) 0 0;max-width:calc(610 * var(--hero-u))}
.hero .buttons{margin-top:calc(22 * var(--hero-u));gap:calc(10 * var(--hero-u))}.hero .button{font-size:calc(15 * var(--hero-u));padding:calc(10 * var(--hero-u)) calc(20 * var(--hero-u));line-height:1.3}.hero .button.primary{background:#ec4899;border-color:#ec4899}.hero-notes{gap:calc(10 * var(--hero-u));margin-top:calc(16 * var(--hero-u))}.hero-notes span{width:calc(146 * var(--hero-u));min-width:0;min-height:calc(58 * var(--hero-u));padding:calc(13 * var(--hero-u));border-radius:calc(14 * var(--hero-u));font-size:calc(13 * var(--hero-u));background:#ee6fad;color:#081115}.hero-notes span+span{background:#f4dce8}
.hero .portrait{top:calc(149 * var(--hero-u));left:55.5%;right:auto;width:calc(420 * var(--hero-u));height:calc(420 * var(--hero-u));filter:grayscale(1);border:calc(4 * var(--hero-u)) solid #53535d;object-position:center 34%}.portrait-note{top:calc(382 * var(--hero-u));left:calc(100% - 105 * var(--hero-u));right:auto;width:calc(116 * var(--hero-u));padding:calc(12 * var(--hero-u));font-size:calc(10 * var(--hero-u));background:#091218;border:1px solid #34414b}.portrait-note strong{font-size:calc(14 * var(--hero-u));color:#ec4899}
.fan-wrap{position:absolute;top:calc(592 * var(--hero-u));left:50%;transform:translateX(-50%);width:min(calc(1352 * var(--hero-u)),calc(100vw - 60px));height:calc(322 * var(--hero-u));margin:0;padding:calc(100 * var(--hero-u)) 0 calc(20 * var(--hero-u));overflow:visible}.fan{width:100%;min-width:0;height:calc(200 * var(--hero-u));margin:0;gap:calc(13 * var(--hero-u));justify-content:center;align-items:flex-start}.fan::before{top:calc(-110 * var(--hero-u));right:calc(-6 * var(--hero-u));font-size:calc(150 * var(--hero-u));-webkit-text-stroke:1px #a6b7bb15}.fan-slot{position:relative;flex:0 0 calc(138 * var(--hero-u));height:calc(182 * var(--hero-u))}.fan a,.fan a:nth-child(n){width:100%;height:100%;padding:calc(8 * var(--hero-u));transform-origin:center bottom;transform:rotate(var(--angle)) translateY(var(--rise));transition:transform .34s cubic-bezier(.2,.8,.2,1),scale .34s cubic-bezier(.2,.8,.2,1),border-color .28s,box-shadow .28s;scale:1;border-radius:calc(16 * var(--hero-u));background:linear-gradient(145deg,rgba(28,45,54,.96),rgba(8,16,22,.96));border-color:#405059}.fan img{height:calc(127 * var(--hero-u));width:100%;object-fit:contain}.fan span{font-size:calc(11 * var(--hero-u));line-height:1.25}.fan .fan-slot:nth-child(1) a{--angle:-5deg;--rise:16px}.fan .fan-slot:nth-child(2) a{--angle:-3.75deg;--rise:8px}.fan .fan-slot:nth-child(3) a{--angle:-2.5deg;--rise:1px}.fan .fan-slot:nth-child(4) a{--angle:-1.25deg;--rise:-4px}.fan .fan-slot:nth-child(5) a{--angle:0deg;--rise:-8px}.fan .fan-slot:nth-child(6) a{--angle:1.25deg;--rise:-4px}.fan .fan-slot:nth-child(7) a{--angle:2.5deg;--rise:1px}.fan .fan-slot:nth-child(8) a{--angle:3.75deg;--rise:8px}.fan .fan-slot:nth-child(9) a{--angle:5deg;--rise:16px}.fan a.is-active,.fan a.is-active:nth-child(n),.fan a:focus-visible{scale:1.4;transform:translateY(calc(var(--rise) - 8px)) rotate(0deg);border-color:#ec4899;box-shadow:0 0 0 1px #ec4899,0 12px 32px #0009;z-index:20}.fan a.is-neighbor,.fan a.is-neighbor:nth-child(n){scale:1.2;transform:rotate(var(--angle)) translateY(var(--rise));z-index:10}.fan-slot:has(.is-active){z-index:20}.fan-slot:has(.is-neighbor){z-index:10}
.hero-char{display:inline-block}.intro-running .hero-char{animation:reference-char-in 1.05s cubic-bezier(.22,.8,.24,1) var(--char-delay) both}.intro-running .hero-notes span{animation:reference-note-in .72s cubic-bezier(.22,.8,.24,1) .34s both}.intro-running .hero .eyebrow,.intro-running .subtitle,.intro-running .lead,.intro-running .buttons{animation:reference-content-in .68s cubic-bezier(.22,.8,.24,1) .12s both}.intro-running .fan-wrap{animation:reference-content-in .72s cubic-bezier(.22,.8,.24,1) .24s both}
@keyframes reference-char-in{0%{opacity:0;transform:translate3d(0,72px,0) scale(.82)}68%{opacity:1;transform:translate3d(0,-8px,0) scale(1.03)}100%{opacity:1;transform:translate3d(0,0,0) scale(1)}}@keyframes reference-content-in{from{opacity:0;translate:0 18px}to{opacity:1;translate:0 0}}@keyframes reference-note-in{0%{opacity:0;translate:0 44px;scale:.72}58%{opacity:1;translate:0 -8px;scale:1.06}78%{translate:0 3px;scale:.98}100%{opacity:1;translate:0;scale:1}}
@media(max-width:900px){.nav{width:calc(100% - 24px);height:auto;min-height:50px;margin:12px auto -62px;overflow-x:auto}.nav a{font-size:12px;padding:8px 10px}.hero{width:100%;left:auto;transform:none;height:auto;min-height:0;padding:110px 0 40px}.hero:before{display:none}.hero h1{font-size:clamp(37px,9vw,60px);padding-right:110px;line-height:1.15}.hero .portfolio{font-size:clamp(34px,9vw,50px)}.hero .subtitle{font-size:20px}.hero .lead{font-size:14px;max-width:100%;margin-top:14px}.hero .eyebrow{font-size:11px}.hero .button{font-size:13px;padding:10px 16px}.hero-notes span{font-size:12px;width:140px;min-height:50px;padding:10px}.hero .portrait{width:105px;height:105px;top:110px;left:auto;right:0}.portrait-note{display:none}.fan-wrap{position:relative;top:auto;left:auto;transform:none;width:calc(100% + 24px);height:auto;margin:30px -12px 0;padding:65px 12px 25px;overflow-x:auto;overflow-y:hidden}.fan{width:1020px;height:160px;justify-content:flex-start;gap:6px}.fan-slot{flex-basis:107px;height:150px}.fan img{height:104px}.fan span{font-size:11px}.fan-hint{display:block}}
@media(prefers-reduced-motion:reduce){.intro-running .hero-char,.intro-running .hero-notes span,.intro-running .subtitle,.intro-running .lead,.intro-running .buttons,.intro-running .fan-wrap{animation:none}.fan a,.fan a:nth-child(n){transition:none}.fan a.is-active,.fan a.is-neighbor{scale:1}}
@media(min-width:901px){.hero .lead{margin-top:calc(5 * var(--hero-u))}.hero .buttons{margin-top:calc(20 * var(--hero-u))}}
@media(hover:hover) and (pointer:fine){.fan-slot{transition:margin .34s cubic-bezier(.2,.8,.2,1)}.fan-slot:has(.is-active){margin-inline:calc(30 * var(--hero-u))}.fan-slot:has(.is-neighbor){margin-inline:calc(15 * var(--hero-u))}}@media(prefers-reduced-motion:reduce){.fan-slot{transition:none}}
.content-growth{padding-top:82px}.growth-heading{font-size:clamp(26px,3.2vw,38px);line-height:1.25;margin:14px 0}.content-growth .case-list{margin-top:35px}
/* 详情页共用媒体：图片约束在预览框内，图注和章节保持正常文档流。 */
body.detail-page{background-color:#091318;background-image:radial-gradient(ellipse 72% 36% at 12% 12%,rgba(25,56,65,.48),transparent 75%),radial-gradient(ellipse 55% 32% at 88% 42%,rgba(82,35,61,.15),transparent 72%),linear-gradient(115deg,#0b171c,#071014 65%,#050b0e);background-attachment:scroll;background-repeat:no-repeat;background-size:100% 100%}
.detail-page .case-section{position:static;height:auto;min-height:0;background:transparent;transform:none!important;opacity:1!important}.detail-page .case-section .two,.detail-page .gallery{align-items:start}.detail-page .case-section .two>div,.detail-page .gallery>figure{min-width:0}.detail-page .case-section h2,.detail-page .case-hero h1{text-wrap:balance}
.detail-page .case-banner{grid-template-columns:minmax(0,2fr) minmax(0,3fr);background:linear-gradient(130deg,#172329,#101a20);padding:clamp(25px,3vw,45px);gap:clamp(24px,3vw,48px);min-height:0;align-items:center}.detail-page .case-banner>div{min-width:0}.detail-page .case-banner img{display:block;width:100%;height:clamp(330px,38vw,480px);max-height:none;min-height:0;object-fit:contain}
.detail-page .gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 20px}.detail-page .gallery.two-col{grid-template-columns:repeat(2,minmax(0,1fr))}.detail-page figure{display:flex;flex-direction:column;min-width:0;margin:0;align-self:start}.detail-page .image-btn{box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:100%;height:400px;min-height:0;padding:14px;background:#18262b;border:1px solid #34464a;border-radius:12px;cursor:zoom-in}.detail-page .image-btn img{display:block;flex:0 1 auto;min-width:0;min-height:0;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}.detail-page figcaption{position:static;margin:14px 0 0;line-height:1.6;font-size:13px;color:var(--muted)}.detail-page .case-section .two>div>figure{margin-top:0}.detail-page .wide-image{min-height:0}.detail-page .m-hero .image-btn{height:480px;background:transparent}
.lightbox{position:fixed;inset:0;z-index:30;display:none;background:rgba(5,10,12,.96);padding:70px 20px 20px;place-items:stretch}.lightbox.open{display:block}.lightbox-toolbar{position:absolute;top:12px;right:20px;display:flex;gap:10px;z-index:2}.lightbox .lightbox-toolbar button{position:static;border:1px solid #6b7778;border-radius:22px;padding:7px 15px;color:#fff;background:#19262b;font:inherit;font-size:14px;cursor:pointer}.lightbox .lightbox-zoom{display:none}.lightbox.is-long .lightbox-zoom{display:block}.lightbox-scroll{height:100%;width:100%;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.lightbox-scroll img{display:block;width:auto;height:auto;max-width:100%;max-height:calc(100dvh - 100px);object-fit:contain;margin:0 auto}.lightbox.is-long .lightbox-scroll img{max-height:none}.lightbox.is-long.zoomed .lightbox-scroll img{width:max(100%,var(--zoom-width,900px));max-width:none;height:auto;margin:0}
.contact-methods{display:flex;align-items:flex-end;gap:32px}.wechat{margin:0;text-align:center}.wechat a{display:block;width:180px;background:white;padding:8px;border-radius:12px}.wechat img{width:100%;height:auto;display:block;filter:none;object-fit:contain}.wechat figcaption{margin-top:10px;font-size:13px;color:var(--muted)}
@media(max-width:900px){.detail-page .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.detail-page .case-banner{grid-template-columns:1fr}.detail-page .case-banner img{height:340px}.detail-page .gallery.two-col{grid-template-columns:1fr}.contact-methods{margin-top:28px;align-items:flex-start;flex-direction:column;gap:24px}.detail-page .image-btn{height:360px}.detail-page .m-hero .image-btn{height:330px}}
@media(max-width:600px){.detail-page .gallery{grid-template-columns:1fr}.lightbox{padding:65px 12px 12px}.lightbox-toolbar{right:12px}.wechat a{width:180px}}
.detail-page .showcase-subtitle{margin:54px 0 14px}
.official-display{margin:30px 0 18px}.detail-page .official-display .image-btn{height:auto;min-height:0;padding:14px}.detail-page .official-display .image-btn img{width:100%;height:auto;max-height:none}.brand-cooperation-image{width:100%;border:0;padding:0;cursor:zoom-in}.brand-cooperation-image:focus-visible{outline:2px solid #f7bfd0;outline-offset:4px}.cooperation-roles{font-size:14px;color:#f7bfd0!important;line-height:1.8}

.video-cover > a:has(img) img{height:280px;width:100%;object-fit:contain}@media(max-width:700px){.video-cover > a:has(img) img{height:240px}}