:root{color-scheme:light;--ink:#393831;--muted:#817b70;--line:#ded7c9;--bg:#faf7f0;--panel:#fffdf8}body{background:var(--bg);color:var(--ink)}::selection{background:#e9bea4;color:#392f27}.nav{width:90%;left:5%;top:18px;height:72px;padding:0 28px;border:1px solid #ffffffa8;border-radius:20px;background:#fffaf1e8;color:#3d3a32;backdrop-filter:blur(14px)}.cn-name{color:#82796a}.menu-toggle,.menu-close{color:#665746}.menu-lines{border-color:#806b56}.hero{min-height:820px;background:#f9eed7}.hero-portrait{inset:0;width:100%;height:100%;aspect-ratio:auto;transform:none;object-fit:cover;object-position:65% center;mask-image:none;opacity:1;filter:none}.hero-shade{background:linear-gradient(90deg,#fff4ddbb, #fff4dd7a 36%,transparent 64%),linear-gradient(0deg,#faf7f0,transparent 28%)}.hero-grid{display:none}.hero-content{width:60%;max-width:850px;padding-left:8vw;padding-top:130px}.hero-content>.eyebrow{color:#7a634f}.hero h1{color:#393126;font-size:39px}.hero h1 .hero-en{font-size:82px;color:#322d26}.hero-statement{color:#514230}.hero .intro,.hero-education{color:#685a48}.hero .primary{background:#c97e5d;color:white}.hero .primary:hover{background:#b96849}.hero-bottom{color:#887967}.type-line:after{background:#a97957}.light-surface{background:#faf7f0;color:#393831}.light-surface:before{display:none}.projects-section{background:#eeeae0}.project-card{background:#faf8f1;border-color:#d9d3c6}.project-card:hover{background:#fffdf7;border-color:#bda88e}.project-kicker{color:#97826a}.project-card h3,.account-card h3{color:#433c31}.project-card p,.account-card p{color:#7d776c}.project-bottom{border-color:#d9d1c1;color:#71624e}.section-head>p{color:#887d6d}.eyebrow{color:#96836a}.account-card{background:#fffdf7;border-color:#e2d8c8}.closing{color:#4b4033}.email{color:#8b674e;border-color:#cba98a}footer{border-color:#e2d8c8}footer>span,footer>a:last-child{color:#978b7c}.light-surface .experience-item{border-color:#e0d8c9}.light-surface .motion-teaser{background:radial-gradient(ellipse at 90% 8%,#ead1b080,transparent 65%),#fffcf5;border-color:#dfd5c4}.insight-stack{position:sticky;top:28px}.light-surface .motion-teaser{position:relative;top:auto}.insight-rail{background:none}.company-logo{filter:none;opacity:1}.logo-nio{filter:brightness(0);opacity:.8}.logo-frame{display:flex;align-items:center;justify-content:center;width:170px;height:110px;position:relative;overflow:hidden}.frame-ipg{width:170px;height:92px}.frame-ipg .logo-ipg{position:absolute;max-height:none;width:247px;height:247px;left:-38px;top:-78px}.frame-island{width:190px;height:85px}.frame-island .logo-island{position:absolute;max-height:none;width:329px;height:auto;left:-72px;top:-223px}.frame-apea{width:190px;height:110px}.logo-apea{width:190px;mix-blend-mode:multiply}.case-entry{margin-top:18px;width:100%;display:flex;flex-direction:column;gap:12px;text-align:left;border:1px solid #d9cfbd;background:#f0e9db;border-radius:12px;padding:25px;color:#594a38;transition:background .2s,transform .2s}.case-entry:hover{background:#eadeca;transform:translateY(-2px)}.case-entry .eyebrow{margin:0;font-size:10px}.case-entry strong{font-family:var(--editorial);font-size:22px;font-weight:400}.case-entry>span:not(.eyebrow){font-size:13px}.case-entry-link{display:flex;justify-content:space-between;border-top:1px solid #d5c6b0;padding-top:14px;margin-top:5px}dialog{background:#faf7f0;color:#443c32;border-color:#d9cfbc;box-shadow:0 30px 130px #40332455}dialog::backdrop{background:#47392b70}.dialog-top{background:#faf7f0f5;border-color:#ddd1be}.close,.case-close{background:#f1e6d5;border:1px solid #d7c4a8;color:#705a40}.dialog-title,.process-title,.step h3,.principle h3,.article-card h4,.chart-title{color:#443b30}.dialog-intro,.step p,.principle p,.article-card p{color:#7b7162}.step,.stat,.chart-box,.flow-work>div{background:#f0eadf;border-color:#dcd0bd}.stat span,.flow-work span,.chart-note,.dialog-note,.step-no,.article-meta,.read-link{color:#8a7760}.stat strong,.bar-number,.flow-work b{color:#75533c}.bar-track{background:#e6dccd}.bar{background:#d1b292}.bar.current{background:#c67f5d}.bar-row{color:#8a7760}.principle{border-color:#c49a73}.article-heading,.article-card,.method-details,.poster-details{border-color:#ddd1bf}.article-card:hover .read-link{color:#ad653f}.article-card>img{border-color:#ddd1bf}#site-menu{background:#faf6edf7;color:#453a2d}.overlay-links>a{color:#564735;border-color:#decfb9}.overlay-links i,.menu-email{color:#9b8468}.overlay-links a:hover{color:#c07b58}#case-dialog{width:min(1150px,calc(100% - 32px));max-height:93dvh;padding:0 32px 32px;background:#faf8f3}.case-top{position:sticky;top:0;z-index:2;background:#faf8f3f5;padding:23px 0 16px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #e3dccf}.case-top .eyebrow{font-size:10px;margin:0 0 6px}.case-top h2{font-family:var(--editorial);font-size:29px;font-weight:400;margin:0}.case-close{border-radius:50%;width:36px;height:36px;font-size:25px;flex-shrink:0}.case-intro{font-size:14px;color:#8b7e6b;margin:20px 0 24px}.case-grid{columns:4;column-gap:18px}.social-card{display:inline-block;break-inside:avoid;width:100%;margin:0 0 20px;background:white;border:1px solid #ebe5da;border-radius:14px;overflow:hidden;transition:transform .2s,box-shadow .2s}.social-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px #5f492214}.social-cover{display:block;width:100%;height:auto}.social-copy{padding:13px}.social-copy h3{font-family:inherit;font-size:15px;font-weight:500;line-height:1.6;margin:0 0 12px;color:#423c33}.social-author{display:flex;gap:6px;align-items:center;font-size:11px;color:#9b9080}.social-author>span:last-child{margin-left:auto;color:#c28265;font-size:10px}.case-search{text-align:center;border-top:1px solid #dfd4c3;padding-top:27px;margin-top:18px;font-size:14px;color:#9b8a73;line-height:2}.case-search strong{font-weight:500;color:#b97958}.social-card:focus-visible,button:focus-visible,a:focus-visible,summary:focus-visible{outline-color:#bc805b}
@media(max-width:1000px){.hero-content{width:67%}.hero h1 .hero-en{font-size:66px}.case-grid{columns:3}}
@media(max-width:720px){.nav{width:92%;left:4%;height:60px;top:13px;padding:0 17px;border-radius:16px}.hero{min-height:820px;justify-content:flex-end}.hero-portrait{inset:0;width:100%;height:57%;transform:none;object-fit:cover;object-position:72% center;mask-image:linear-gradient(#000 75%,transparent);aspect-ratio:auto}.hero-shade{background:linear-gradient(0deg,#faf7f0 38%,transparent 65%)}.hero-content{width:100%;padding:350px 26px 90px}.hero-content>.eyebrow{font-size:8px}.hero h1{font-size:30px}.hero h1 .hero-en{font-size:51px}.hero-statement{font-size:18px}.hero-bottom{bottom:20px}.hero-education{margin-top:22px}.insight-stack{position:static}.case-grid{columns:2;column-gap:12px}#case-dialog{width:calc(100% - 16px);padding:0 16px 22px}.case-top h2{font-size:23px}.case-top{padding-top:18px}.case-intro{font-size:12px}.social-copy{padding:10px}.social-copy h3{font-size:13px}.social-author{font-size:10px;flex-wrap:wrap}.social-author>span:last-child{display:none}.case-search{font-size:12px}.case-entry{padding:23px}.case-entry strong{font-size:22px}}
/* Logo exits the stage completely; the question gets the full width. */
.brand-stage{overflow:hidden}.brand-emblem{transform:none;opacity:1;transform-origin:center;transition:transform .6s cubic-bezier(.22,1,.36,1),opacity .35s}
.question-reveal{left:0;right:0;transform:translate(35px,-50%);opacity:0;padding:0 8px;transition:transform .6s cubic-bezier(.22,1,.36,1),opacity .4s}
.motion-teaser:is(:hover,:focus-visible) .brand-emblem{transform:translateX(-115%);opacity:0}
.motion-teaser:is(:hover,:focus-visible) .question-reveal{transform:translate(0,-50%);opacity:1}
.motion-teaser:is(:hover,:focus-visible) .brand-stage:before{opacity:0;transform:translateX(-110%)}
.logo-frame{mix-blend-mode:multiply}.frame-ipg{width:166px;height:89px}.frame-ipg .logo-ipg{left:-40px;top:-79px}.frame-apea{mix-blend-mode:multiply}.frame-island{mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent),linear-gradient(0deg,transparent,#000 9%,#000 91%,transparent);mask-composite:intersect}
@media(max-width:720px),(hover:none){.brand-emblem{transform:translateX(-115%);opacity:0}.question-reveal{left:0;right:0;opacity:1;transform:translate(0,-50%)}.brand-stage:before{opacity:0}}
@media(prefers-reduced-motion:reduce){.brand-emblem,.question-reveal{transition:none}}
/* Compact fixed navigation and disappearing marks. */
.nav{position:fixed;z-index:20;box-shadow:0 4px 25px #806d4810}html{scroll-padding-top:115px}body:has(#site-menu[open]){overflow:auto}#site-menu{position:fixed;inset:102px 5% auto auto;width:300px;height:auto;max-height:calc(100dvh - 120px);max-width:calc(100% - 32px);padding:12px 22px 20px;margin:0;border:1px solid #e1d6c3;border-radius:16px;background:#fffaf1f5;box-shadow:0 18px 50px #66513322;backdrop-filter:blur(18px);z-index:21}#site-menu .menu-top{height:30px;justify-content:flex-end}#site-menu .menu-top>.brand,#site-menu .menu-email{display:none}#site-menu .menu-close{padding:0;font-size:9px;gap:8px}#site-menu .overlay-links{margin:5px 0 0;gap:0}#site-menu .overlay-links>a{font-family:inherit;font-size:16px;letter-spacing:0;padding:15px 0;gap:10px}#site-menu .overlay-links>a:last-child{border:0}#site-menu .overlay-links>a>span{font-size:9px;width:17px}#site-menu .overlay-links i{font-size:11px}.back-top{position:fixed;bottom:24px;left:24px;z-index:19;display:grid;place-items:center;width:43px;height:43px;border:1px solid #d9c5ac;background:#fffaf1e8;color:#a57450;border-radius:50%;box-shadow:0 4px 18px #73552b12;font-size:22px;backdrop-filter:blur(12px);transition:transform .2s}.back-top:hover{transform:translateY(-4px)}.brand-stage{overflow:hidden}.brand-emblem{transform:none;opacity:1;transition:transform .6s cubic-bezier(.22,1,.36,1),opacity .3s}.motion-teaser:is(:hover,:focus-visible) .brand-emblem{transform:translateX(-115%);opacity:0}.question-reveal{left:8px;right:8px;transform:translate(40px,-50%);opacity:0;text-align:center}.motion-teaser:is(:hover,:focus-visible) .question-reveal{transform:translate(0,-50%);opacity:1;transition-delay:.12s}.motion-teaser:is(:hover,:focus-visible) .brand-stage:before{opacity:0}.logo-frame{mix-blend-mode:multiply}.frame-island{border-radius:12px;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent),linear-gradient(0deg,transparent,#000 12%,#000 89%,transparent);mask-composite:intersect}.case-entry{grid-column:1/-1;margin-top:0;display:grid;grid-template-columns:1fr auto;gap:8px 30px;padding:29px 32px;background:linear-gradient(110deg,#f2e4cd,#f7f0e4);min-height:165px}.case-entry>.eyebrow,.case-entry>strong,.case-entry>span:not(.case-entry-link){grid-column:1}.case-entry .case-entry-link{grid-column:2;grid-row:1/4;align-self:center;min-width:150px;gap:40px;margin:0;border:1px solid #d3b795;border-radius:30px;padding:12px 19px}.insight-stack{top:115px}
@media(max-width:720px){#site-menu{top:84px;right:4%;width:270px}.case-entry{padding:24px;display:flex;min-height:0}.case-entry .case-entry-link{align-self:stretch;margin-top:8px}.back-top{left:14px;bottom:16px;width:38px;height:38px}.brand-emblem{transform:translateX(-115%);opacity:0}.question-reveal{opacity:1;transform:translate(0,-50%)}.insight-stack{top:auto}}
@media(hover:none){.brand-emblem{transform:translateX(-115%);opacity:0}.question-reveal{opacity:1;transform:translate(0,-50%)}}
.hero-bottom{left:85px}@media(max-width:720px){.hero-bottom{left:66px}.hero-bottom>span:first-child{font-size:7px}}
.brand-stage{mix-blend-mode:multiply;isolation:auto}.logo-frame{mix-blend-mode:normal}
/* Geometric close icons avoid font-baseline offsets on all devices. */
.close,.case-close{position:relative;display:grid;place-items:center;box-sizing:border-box;width:40px;height:40px;min-width:40px;min-height:40px;padding:0;line-height:1;font-size:0;border-radius:50%;flex-shrink:0}.close:before,.close:after,.case-close:before,.case-close:after{content:'';position:absolute;left:50%;top:50%;width:14px;height:1.5px;border-radius:1px;background:currentColor;transform:translate(-50%,-50%) rotate(45deg)}.close:after,.case-close:after{transform:translate(-50%,-50%) rotate(-45deg)}#site-menu .menu-close{min-height:36px;align-items:center}#site-menu .menu-close>span{position:relative;width:18px;height:18px;font-size:0;display:inline-block}#site-menu .menu-close>span:before,#site-menu .menu-close>span:after{content:'';position:absolute;left:50%;top:50%;width:12px;height:1.5px;background:currentColor;transform:translate(-50%,-50%) rotate(45deg)}#site-menu .menu-close>span:after{transform:translate(-50%,-50%) rotate(-45deg)}.dashboard-work{margin:36px 0 28px;padding-top:28px;border-top:1px solid #ddd1bf}.dashboard-work-head .eyebrow{font-size:10px;margin:0 0 15px}.dashboard-work-head h3{font-family:var(--editorial);font-weight:400;font-size:25px;line-height:1.6;margin:0 0 15px}.dashboard-work-head p{font-size:15px;color:#7b7162;line-height:1.9;margin:0}.build-flow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:21px 0}.build-flow span{background:#eee5d6;border-radius:6px;padding:6px 10px;font-size:12px;color:#816b52}.build-flow i{font-size:12px;font-style:normal;color:#b8a386}.dashboard-caption{font-size:12px;color:#93816a;line-height:1.9;margin:16px 0}game-marketing-dashboard{--gmd-font:inherit;--gmd-text:#443b30;--gmd-muted:#81705b;--gmd-subtle:#9b8a75;--gmd-accent:#b97a53;--gmd-action:#b97a53;--gmd-link:#a46744;--gmd-bg-start:#fffdf7;--gmd-bg-end:#f4ecde;--gmd-card:#eee5d655;--gmd-card-open:#ecd9be70;--gmd-border:#ddd0ba;--gmd-radius:14px;--gmd-card-radius:9px;--gmd-max-width:100%;--gmd-padding:23px;--gmd-shadow:none;display:block}@media(max-width:720px){.dashboard-work-head h3{font-size:22px}.build-flow{gap:5px}.build-flow span{font-size:10px;padding:5px 7px}game-marketing-dashboard{--gmd-padding:15px}.close,.case-close{width:40px;height:40px}}