@font-face{font-family:Geist;src:url('assets/fonts/geist-latin.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{--mp-paper:#f5f8fa;--mp-white:#fff;--mp-ink:#192f3b;--mp-muted:#526774;--mp-blue:#1959a6;--mp-soft:#eaf1f6;--mp-line:#cbd7df;--mp-ease:cubic-bezier(.22,1,.36,1);color-scheme:light;font-family:Geist,'Noto Sans SC','Microsoft YaHei',sans-serif;font-synthesis:none;color:var(--mp-ink);background:var(--mp-paper)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px;scrollbar-color:#8cabbc var(--mp-paper)}body{margin:0;font-size:16px;line-height:1.8;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a,button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{border:0;background:none}img{display:block;width:100%;height:auto}h1,h2,h3,p,figure,dl,dd{margin:0}h1,h2,h3{text-wrap:balance}p{max-width:65ch}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}::selection{background:#c7def1;color:#122e45}:focus-visible{outline:2px solid var(--mp-blue);outline-offset:5px}button:active{background-color:#dce8f1}.mp-wrap{width:min(1280px,calc(100% - 112px));margin-inline:auto}.mp-skip{position:fixed;z-index:100;top:14px;left:20px;padding:10px 18px;background:var(--mp-ink);color:white;transform:translateY(-160%)}.mp-skip:focus{transform:none}.mp-header{display:flex;align-items:center;justify-content:space-between;height:96px;border-bottom:1px solid var(--mp-line)}.mp-brand{font-family:Georgia,'Times New Roman',serif;font-size:33px;letter-spacing:-.04em;line-height:1.2}.mp-header nav{display:flex;gap:30px;font-size:13px}.mp-header nav a{padding:12px 0;transition:color 180ms}.mp-header nav a:hover{color:var(--mp-blue)}
.mp-hero{padding-top:48px}.mp-title-row{display:flex;justify-content:space-between;gap:40px;align-items:flex-end;margin-bottom:36px}.mp-project-name{font-size:13px;color:var(--mp-muted);margin-bottom:16px}.mp-title-row h1{font-size:clamp(70px,8.9vw,128px);font-weight:450;letter-spacing:-.04em;line-height:.98;white-space:nowrap}.mp-title-row .case-statement{font-size:25px;line-height:1.5;font-weight:450;margin-bottom:4px;flex-shrink:0}.mp-image-open{padding:0;display:block;position:relative;width:100%;text-align:left;background:transparent}.mp-image-open img{width:100%;height:auto}.mp-zoom{position:absolute;right:16px;bottom:16px;display:flex;align-items:center;gap:13px;background:#fff;color:var(--mp-ink);padding:10px 15px;font-size:12px;line-height:1.6;transition:background-color 200ms,color 200ms}.mp-zoom svg{width:18px;height:18px;transition:transform 200ms}.mp-image-open:hover .mp-zoom{background:var(--mp-ink);color:white}.mp-image-open:hover .mp-zoom svg{transform:translate(1px,-1px)}.mp-image-open:active .mp-zoom{background:var(--mp-blue);color:white}.mp-hero-visual{position:relative}.mp-hero-visual img{aspect-ratio:2.45;object-fit:cover;object-position:49% center}.mp-hero-visual figcaption,.mp-figure figcaption,.mp-product-image figcaption,.mp-company-photo figcaption{font-size:12px;line-height:1.7;color:var(--mp-muted);margin-top:12px}.mp-chapters{display:flex;gap:34px;border-block:1px solid var(--mp-line);margin-top:28px;padding:12px 0;font-size:12px}.mp-chapters a{padding:9px 0;transition:color 180ms}.mp-chapters a:hover{color:var(--mp-blue);text-decoration:underline;text-underline-offset:6px}
.mp-section{padding-block:94px}.mp-intro{display:grid;grid-template-columns:1.12fr .88fr;gap:120px;align-items:start;margin-bottom:48px}.mp-section h2{font-size:clamp(35px,3.8vw,55px);font-weight:500;letter-spacing:-.03em;line-height:1.35}.mp-prose{font-size:16px;line-height:1.95;color:var(--mp-muted);max-width:46ch;padding-top:7px}.mp-prose p+p{margin-top:17px}.mp-meta{display:grid;grid-template-columns:1fr 1.1fr 1.4fr;gap:36px;border-top:1px solid var(--mp-line);padding-top:25px}.mp-meta dt{font-size:12px;color:var(--mp-muted);margin-bottom:9px}.mp-meta dd{font-size:14px;line-height:1.9}.mp-challenge{display:grid;grid-template-columns:1.12fr .88fr;gap:120px;border-top:1px solid var(--mp-line);margin-top:32px;padding-top:31px}.mp-challenge h3{font-size:25px;line-height:1.5;font-weight:450}.mp-challenge p{font-size:15px;line-height:1.9;color:var(--mp-muted);max-width:46ch}
.mp-products{background:var(--mp-soft)}.mp-products .mp-intro{margin-bottom:36px}.mp-tab-row{display:flex;align-items:center;justify-content:space-between;gap:30px;border-bottom:1px solid #b8cad7}.mp-tab-list{display:grid;grid-template-columns:repeat(3,1fr);position:relative;width:570px;max-width:100%;--active:0}.mp-tab-list button{position:relative;min-height:64px;font-size:17px;padding:18px 24px;color:var(--mp-muted);transition:color 200ms,background-color 200ms}.mp-tab-list button:hover{color:var(--mp-blue);background:#dae6ee}.mp-tab-list button[aria-selected=true]{color:var(--mp-blue);font-weight:550}.mp-tab-list button:active{background:#cedfec}.mp-tab-list button:focus-visible{outline-offset:-6px}.mp-tab-indicator{position:absolute;bottom:-1px;left:0;width:33.3333%;height:2px;background:var(--mp-blue);transform:translateX(calc(var(--active)*100%));transition:transform 320ms var(--mp-ease)}.mp-demo-label{font-size:12px;color:var(--mp-muted)}.mp-product-panel{display:grid;grid-template-columns:230px minmax(0,1fr);align-items:center;gap:40px;min-height:500px;padding-top:37px}.mp-product-panel[hidden]{display:none}.mp-product-copy h3{font-size:27px;line-height:1.25;letter-spacing:-.02em;font-weight:500;max-width:15ch}.mp-product-thesis{font-size:18px;margin-top:24px}.mp-product-copy>p:last-of-type{font-size:14px;line-height:1.9;color:var(--mp-muted);margin-top:12px}.mp-text-link{display:inline-flex;align-items:center;justify-content:space-between;gap:25px;min-height:44px;padding:7px 0;border-bottom:1px solid #8a9fab;font-size:13px;line-height:1.7;transition:color 200ms,border-color 200ms,background-color 100ms}.mp-text-link:hover{color:var(--mp-blue);border-color:var(--mp-blue)}.mp-text-link svg{width:20px;height:20px;transition:transform 200ms var(--mp-ease)}.mp-text-link:hover svg{transform:translateX(4px)}.mp-text-link:active{background-color:#dce8f1}.mp-product-copy .mp-text-link{margin-top:22px}.mp-product-image{min-width:0;max-width:960px}.mp-product-image .mp-image-open{background:white;aspect-ratio:900/460;display:flex;align-items:center}.mp-product-image picture{display:block;width:100%}.mp-product-image img{object-fit:contain;max-height:500px}.mp-product-image .mp-zoom{bottom:10px;right:10px}.mp-source-note{font-size:12px;color:var(--mp-muted);line-height:1.85;max-width:72ch}.mp-products>.mp-wrap>.mp-source-note{border-top:1px solid #c2d1dc;padding-top:18px;margin-top:24px}
.mp-details-band{background:var(--mp-white)}#details{background:white}.mp-detail-layout{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.mp-device .mp-image-open{background:#f4f8fa;min-height:450px;display:flex;align-items:center}.mp-device img{max-width:580px;margin:auto}.mp-specification .mp-image-open{background:#f4f8fa}.mp-specification .mp-source-note{margin-top:18px;max-width:60ch}#details>.mp-text-link{margin-top:28px}.mp-figure .mp-zoom{bottom:10px;right:10px}
.mp-brand-section{background:#edf3f6}.mp-brand-layout{display:grid;grid-template-columns:320px minmax(0,1fr);gap:74px;align-items:center}.mp-company-photo{max-width:320px;width:100%;justify-self:start}.mp-company-photo img{aspect-ratio:405/460;object-fit:contain}.mp-brand-screen{min-width:0}.mp-brand-screen .mp-image-open{background:#171717}.mp-brand-screen .mp-zoom{bottom:12px;right:12px}.mp-brand-decision{display:grid;grid-template-columns:1fr 1fr;gap:40px;max-width:none}.mp-brand-decision h3{font-size:18px;font-weight:500;margin-bottom:8px}.mp-brand-decision p{font-size:14px;color:var(--mp-muted);line-height:1.85}.mp-brand-decision p+h3{margin-top:23px}.mp-ad-layout{display:grid;grid-template-columns:.62fr 1.38fr;gap:75px;align-items:center;margin-top:38px;border-top:1px solid var(--mp-line);padding-top:32px}.mp-ad-layout h3{font-size:26px;line-height:1.5;font-weight:450}.mp-ad-layout>div>p{font-size:14px;color:var(--mp-muted);margin-top:19px}.mp-ad-layout .mp-text-link{margin-top:22px}.mp-ad-layout .mp-zoom{padding:8px 11px;font-size:12px}.mp-delivery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:47px}.mp-delivery-grid>div{border-top:1px solid var(--mp-line);padding-top:22px}.mp-delivery-grid h3{font-size:20px;font-weight:500;margin-bottom:13px}.mp-delivery-grid p{font-size:14px;color:var(--mp-muted);line-height:1.9}.mp-project-sources{margin-top:48px;display:flex;justify-content:space-between;gap:50px;padding-top:23px;border-top:1px solid var(--mp-line)}.mp-project-sources>p{font-size:12px;max-width:75ch;line-height:1.9;color:var(--mp-muted)}.mp-project-sources nav{display:flex;gap:22px;flex-shrink:0;font-size:12px;align-items:flex-start}.mp-project-sources a{display:flex;gap:7px;align-items:center;min-height:44px;transition:color 200ms}.mp-project-sources svg{width:15px;height:15px}.mp-project-sources a:hover{color:var(--mp-blue)}
.mp-next{display:flex;justify-content:space-between;align-items:flex-end;padding-block:15px 62px}.mp-next-case{display:grid;grid-template-columns:1fr 50px;gap:10px 45px;align-items:center;min-width:330px}.mp-next-case span{grid-column:1/-1;color:var(--mp-muted);font-size:12px}.mp-next-case strong{font-size:60px;line-height:1.1;letter-spacing:-.03em;font-weight:450}.mp-next-case>svg{width:40px;height:40px;transition:transform 200ms var(--mp-ease)}.mp-next-case:hover{color:var(--mp-blue)}.mp-next-case:hover>svg{transform:translateX(6px)}.mp-next-case:active{color:var(--mp-ink)}.mp-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:34px;border-top:1px solid var(--mp-line);font-size:12px}.mp-footer .mp-brand{font-size:30px}.mp-footer>a:hover{color:var(--mp-blue)}
.mp-viewer{border:0;padding:0;background:var(--mp-paper);color:var(--mp-ink);width:min(1400px,calc(100% - 64px));height:90dvh;max-width:100%;max-height:100dvh;box-shadow:0 24px 100px #102c4466}.mp-viewer::backdrop{background:#0a2035b8}.mp-viewer[open]{display:flex;flex-direction:column}.mp-view-head{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 26px;border-bottom:1px solid var(--mp-line)}.mp-view-head h2{font-size:18px;font-weight:500}.mp-view-head>div{display:flex;gap:15px}.mp-view-head button{display:flex;align-items:center;gap:9px;min-height:44px;padding:9px 14px;font-size:13px;background:#e1eaf0;transition:background-color 180ms}.mp-view-head button:hover{background:#cbdce8}.mp-view-caption{font-size:12px;color:var(--mp-muted);padding:14px 26px}.mp-view-scroll{overflow:auto;min-height:0;flex:1;padding:20px;display:flex;align-items:flex-start;justify-content:center}.mp-view-scroll img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;margin:auto}.mp-viewer[data-original=true] .mp-view-scroll{display:block}.mp-viewer[data-original=true] img{max-width:none;max-height:none;margin:0}
@media(min-width:768px) and (max-width:1100px){.mp-wrap{width:calc(100% - 72px)}.mp-intro,.mp-challenge{gap:65px}.mp-title-row .case-statement{font-size:20px}.mp-product-panel{grid-template-columns:230px 1fr;gap:30px;min-height:450px}.mp-brand-layout{gap:65px}.mp-project-sources{display:block}.mp-project-sources nav{margin-top:15px}}
@media(max-width:767px){html{scroll-padding-top:20px}.mp-wrap{width:calc(100% - 40px)}.mp-header{height:auto;min-height:113px;display:block;padding:22px 0 12px}.mp-brand{font-size:31px}.mp-header nav{justify-content:space-between;gap:16px;font-size:12px;margin-top:13px}.mp-header nav a{padding:6px 0}.mp-hero{padding-top:30px}.mp-title-row{display:block;margin-bottom:24px}.mp-project-name{font-size:12px;margin-bottom:15px}.mp-title-row h1{font-size:15.6vw;letter-spacing:-.04em}.mp-title-row .case-statement{font-size:24px;line-height:1.5;margin-top:25px;margin-bottom:0}.mp-hero-visual .mp-image-open img{aspect-ratio:1.18;object-fit:cover;object-position:49% center}.mp-zoom{padding:8px 10px;font-size:12px;gap:8px;right:10px;bottom:10px}.mp-zoom svg{width:16px;height:16px}.mp-hero-visual figcaption,.mp-figure figcaption,.mp-product-image figcaption,.mp-company-photo figcaption{font-size:12px;margin-top:10px}.mp-chapters{flex-wrap:wrap;gap:1px 23px;font-size:12px;margin-top:21px;padding-block:12px}.mp-chapters a{padding:7px 0}.mp-section{padding-block:61px}.mp-intro{display:block;margin-bottom:29px}.mp-section h2{font-size:34px;line-height:1.4;letter-spacing:-.025em}.mp-prose{font-size:15px;line-height:1.9;max-width:none;padding:0;margin-top:23px}.mp-prose p+p{margin-top:14px}.mp-meta{display:block;padding-top:0;border:0}.mp-meta>div{display:grid;grid-template-columns:85px 1fr;gap:20px;padding-block:17px;border-top:1px solid var(--mp-line)}.mp-meta dt{font-size:12px;margin:2px 0 0}.mp-meta dd{font-size:13px}.mp-challenge{display:block;margin-top:16px;padding-top:25px}.mp-challenge h3{font-size:23px}.mp-challenge p{font-size:14px;margin-top:19px}.mp-products .mp-intro{margin-bottom:20px}.mp-tab-row{display:block}.mp-tab-list{width:100%}.mp-tab-list button{padding:15px 5px;font-size:15px;min-height:58px}.mp-demo-label{display:block;font-size:12px;padding:12px 0 10px}.mp-tab-indicator{bottom:0}.mp-product-panel{display:flex;flex-direction:column;align-items:stretch;gap:24px;min-height:570px;padding-top:24px}.mp-product-copy h3{font-size:27px;max-width:none}.mp-product-thesis{font-size:17px;margin-top:14px}.mp-product-copy>p:last-of-type{font-size:14px;margin-top:8px;line-height:1.85}.mp-product-copy .mp-text-link{margin-top:13px}.mp-product-image .mp-image-open{aspect-ratio:400/280;display:flex;align-items:center}.mp-product-image img{height:auto;max-height:260px;object-fit:contain}.mp-product-image .mp-zoom{padding:7px 9px;font-size:12px;bottom:8px;right:8px}.mp-products>.mp-wrap>.mp-source-note{margin-top:15px;padding-top:14px}.mp-source-note{font-size:12px;line-height:1.9}.mp-detail-layout{display:flex;flex-direction:column;gap:29px;align-items:stretch}.mp-device .mp-image-open{min-height:250px}.mp-specification .mp-source-note{margin-top:16px}#details>.mp-text-link{margin-top:19px}.mp-brand-layout{display:grid;grid-template-columns:1fr;gap:27px;align-items:stretch}.mp-brand-screen .mp-zoom{position:static;justify-content:flex-end;background:white;padding:9px}.mp-company-photo{align-self:start;max-width:235px}.mp-brand-decision{grid-template-columns:1fr;gap:21px;margin-top:24px;padding-top:23px;border-top:1px solid var(--mp-line)}.mp-brand-decision h3{font-size:17px}.mp-brand-decision p{font-size:14px}.mp-ad-layout{display:block;margin-top:34px;padding-top:28px}.mp-ad-layout h3{font-size:25px}.mp-ad-layout>div>p{font-size:14px;margin-top:13px}.mp-ad-layout .mp-text-link{margin-top:15px}.mp-ad-layout .mp-figure{margin-top:25px}.mp-ad-layout .mp-zoom{position:static;justify-content:flex-end;background:white;padding:9px}.mp-delivery-grid{display:block}.mp-delivery-grid>div{padding-top:21px;margin-top:24px}.mp-delivery-grid h3{font-size:19px;margin-bottom:10px}.mp-delivery-grid p{font-size:14px}.mp-project-sources{display:block;margin-top:30px;padding-top:22px}.mp-project-sources>p{font-size:12px;line-height:1.9}.mp-project-sources nav{flex-wrap:wrap;gap:5px 24px;font-size:12px;margin-top:15px}.mp-next{display:flex;flex-direction:column;align-items:stretch;gap:32px;padding-block:0 43px}.mp-next>.mp-text-link{align-self:flex-start}.mp-next-case{min-width:0;grid-template-columns:1fr 35px;gap:10px 25px}.mp-next-case strong{font-size:43px}.mp-next-case>svg{width:30px;height:30px}.mp-footer{flex-direction:column;align-items:flex-start;gap:20px;padding-block:30px;font-size:12px}.mp-viewer{width:100%;height:100dvh;margin:0}.mp-view-head{padding:10px 12px;gap:8px}.mp-view-head h2{font-size:14px;max-width:5em}.mp-view-head>div{gap:8px}.mp-view-head button{font-size:12px;padding:9px}.mp-view-caption{padding:12px 16px;font-size:12px}.mp-view-scroll{padding:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}.mp-text-link:hover svg,.mp-next-case:hover>svg,.mp-image-open:hover .mp-zoom svg{transform:none}}
@media(forced-colors:active){.mp-tab-indicator{background:Highlight}.mp-tab-list button[aria-selected=true]{color:Highlight;outline:1px solid Highlight;outline-offset:-3px}}
