/* Services: the same grid, navigation and brand system as the home page. */
:root{--service-columns:10;--service-space:80px;--service-primary:36px}
.skip-link{position:fixed;z-index:100;left:24px;top:16px;padding:12px 20px;border-radius:99px;background:var(--ink);color:white;transform:translateY(-150%)}
.skip-link:focus{transform:none}
.services-page .site-header.on-dark,.service-detail-page .site-header.on-dark{background:var(--ink);color:white}
.editorial-grid{display:grid;grid-template-columns:repeat(var(--service-columns),minmax(0,1fr));column-gap:16px;padding-inline:var(--inner-pad)}
.editorial-title{margin:-.175em 0;font:400 var(--service-primary)/1.05 var(--serif);letter-spacing:-.02em}
.editorial-eyebrow{margin:0;font:400 16px/1.3 var(--sans);letter-spacing:-.01em}
.services-hero{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(4,1fr);align-items:center;gap:16px;min-height:133svh;margin-bottom:calc(var(--service-space)*2);padding:var(--service-space) var(--inner-pad);perspective:1000px}
.services-head{grid-area:2 / 1 / 3 / 4;display:flex;flex-direction:column;gap:28px;min-width:0;margin:0;position:relative;z-index:2;pointer-events:none}
.services-head h1{margin:0;max-width:500px;color:var(--quiet);font:400 16px/1.3 var(--sans);letter-spacing:-.01em;animation:service-head-in 1.8s var(--ease) both}
.services-head p{max-width:500px;margin:-.175em 0;font:400 var(--service-primary)/1.05 var(--serif);letter-spacing:-.02em;animation:service-head-in 1.8s .07s var(--ease) both}
.services-images{grid-area:1 / 1 / 4 / 4;height:100%;width:100%;position:relative;transform-style:preserve-3d;pointer-events:none}
.floating-print{position:absolute;left:0;top:0;width:20%;border-radius:16px;container-type:inline-size;backface-visibility:hidden;transform:translateZ(0)}
.floating-print:nth-child(1){left:50%;top:25%;width:25%;z-index:1}
.floating-print:nth-child(2){left:20%;top:-10%;width:20%;filter:blur(4px)}
.floating-print:nth-child(3){left:15%;top:80%;width:15%;filter:blur(1px)}
.floating-print:nth-child(4){left:65%;top:60%;width:15%;filter:blur(4px)}
.floating-print:nth-child(5){left:0;top:15%;width:10%;filter:blur(10px)}
.floating-print:nth-child(6){left:90%;top:50%;width:10%;filter:blur(8px)}
.floating-print:nth-child(7){left:75%;top:100%;width:15%;filter:blur(1px)}
.floating-print:nth-child(8){left:5%;top:120%;width:20%}
.floating-print:nth-child(9){left:45%;top:110%;width:15%;filter:blur(2px);z-index:1}
.floating-print:nth-child(10){left:55%;top:130%;width:10%;filter:blur(4px)}
.brand-print{position:relative;aspect-ratio:4/5;border-radius:inherit;overflow:hidden;padding:8cqw;display:flex;flex-direction:column;justify-content:space-between;transform:translateY(var(--parallax,0px));will-change:transform}
.brand-print small,.print-foot{position:relative;z-index:2;font:400 3cqw/1.3 var(--mono);letter-spacing:.025em}
.brand-print strong{position:relative;z-index:2;font:500 25cqw/.82 var(--display);letter-spacing:-.065em}
.brand-print img{position:absolute;width:70%;left:15%;top:28%}
.print-move{background:var(--ultra);color:var(--paper)}
.print-move strong{font-size:26cqw;align-self:flex-start}
.print-orbit{position:absolute;right:-34%;bottom:0;width:90%;aspect-ratio:1;border:1px solid rgba(255,255,255,.3);border-radius:50%;box-shadow:0 0 0 9cqw rgba(255,255,255,.04),0 0 0 18cqw rgba(255,255,255,.04)}
.print-identity{background:var(--red);color:white}
.print-focus{background:#e9e5de;color:var(--ink)}
.print-focus strong{font-family:var(--serif);font-size:21cqw;font-weight:400;line-height:.95}
.print-dot{width:36%;aspect-ratio:1;border-radius:50%;background:var(--red);align-self:flex-end}
.print-launch{background:var(--red);color:#f5f3ef}
.print-arrow{font:400 95cqw/.7 var(--display);position:absolute;right:-8%;bottom:8%;opacity:.17}
.print-questions{background:var(--ink);color:#f5f3ef}
.print-questions strong{font-family:var(--serif);font-size:21cqw;font-weight:400;line-height:1.04}
.print-target{background:#a0a7f0;color:var(--ink)}
.print-rings{position:absolute;width:70%;aspect-ratio:1;left:15%;top:24%;border:5cqw solid var(--ultra);border-radius:50%;box-shadow:inset 0 0 0 5cqw #a0a7f0,inset 0 0 0 10cqw var(--ultra),inset 0 0 0 15cqw #a0a7f0;background:var(--ultra)}
.print-leadership{background:#2d2926;color:#f5f3ef}
.print-leadership strong{font-family:var(--serif);font-size:23cqw;line-height:.95;font-weight:400}
.print-message{background:#f1eee7;color:var(--red)}
.print-underlines{height:15%;background:repeating-linear-gradient(to bottom,var(--red) 0 2px,transparent 2px 12px)}
.print-plan{background:var(--ultra);color:white}
.print-plan strong{font-size:23cqw}
.print-mark{background:#e5e1d8;color:var(--ink)}
.service-value{padding-block:160px}
.service-value h2{grid-column:2 / span 3;position:sticky;top:50%;height:fit-content;margin:0;padding:.8rem 0;font:400 16px/1.3 var(--sans);letter-spacing:-.01em}
.service-value ul{grid-column:5 / span 5;list-style:none;padding:0;margin:-.175em 0;font:400 var(--service-primary)/1.05 var(--serif);letter-spacing:-.02em}
.service-value li{padding:.5em 0;opacity:.1;transition:opacity .75s cubic-bezier(.165,.84,.44,1)}
.service-value li.in-view{opacity:1}
.service-index{--page-bg:#fff;--page-fg:#000;--page-muted:#5e5855;display:grid;grid-template-columns:repeat(var(--service-columns),minmax(0,1fr));gap:64px;padding:128px var(--inner-pad);background:white;color:black;scroll-margin-top:74px}
.service-index>*{grid-column:2 / span 8}
.service-index .service-row:last-child{border-bottom:0}
.service-index .row-arrow{width:24px;height:24px}
.service-index .service-row h3{font-size:28px}
.service-index .service-row p{max-width:35ch}
.service-capabilities{padding-block:160px;background:var(--ink);color:white}
.service-capabilities>.editorial-eyebrow{grid-column:2 / span 3}
.capabilities-content{grid-column:5 / span 5;display:flex;flex-direction:column;gap:120px}
.capabilities-body{color:#d0d0c8;font:400 16px/1.3 var(--sans);letter-spacing:-.01em}
.capabilities-body p{margin:0 0 1.3em;max-width:60ch}
.text-link{display:inline-flex;gap:12px;align-items:center;margin-top:20px;font-size:14px;color:white}
.text-link span{transition:transform .55s var(--ease)}
.text-link:hover span{transform:translateX(5px)}
.services-page .footer,.service-detail-page .footer{border:0}

/* Each service has a real, bookmarkable detail page. */
.detail-heading{padding-top:208px;padding-bottom:80px;align-items:start}
.detail-back{grid-column:1 / span 3;display:flex;align-items:center;gap:12px;width:fit-content;color:var(--quiet);padding-top:14px}
.detail-back span{font-size:14px;transition:transform .4s var(--ease)}
.detail-back:hover span{transform:translate(2px,-2px)}
.detail-heading hgroup{grid-column:5 / span 6;margin:0;display:flex;flex-direction:column;gap:32px}
.detail-heading h1{margin:-.175em 0;font:400 72px/1 var(--serif);letter-spacing:-.02em;animation:service-head-in 1.8s var(--ease) both}
.detail-heading hgroup p{margin:0;max-width:44ch;color:var(--quiet);font:400 18px/1.3 var(--sans);animation:service-head-in 1.8s .07s var(--ease) both}
.detail-art-frame{margin-inline:var(--inner-pad);border-radius:16px;overflow:hidden}
.detail-art{position:relative;min-height:480px;aspect-ratio:16/9;border-radius:16px;display:flex;flex-direction:column;justify-content:space-between;padding:40px;overflow:hidden;isolation:isolate}
.detail-art small,.detail-art>span{font:400 11px/1.3 var(--mono);letter-spacing:.025em;position:relative;z-index:2}
.detail-art strong{font:500 clamp(72px,11vw,152px)/.82 var(--display);letter-spacing:-.065em;position:relative;z-index:2}
.detail-art img{position:absolute;right:8%;top:50%;transform:translateY(-50%);width:28%;opacity:.18;z-index:0}
.art-positioning{background:var(--ultra);color:white}
.art-priorities{background:#e9e5de;color:var(--ink)}
.art-priorities strong{font-family:var(--serif);font-weight:400;line-height:.95}
.art-launch{background:var(--red);color:white}
.art-leadership{background:#2d2926;color:white}
.art-leadership strong{font-family:var(--serif);font-weight:400;line-height:.95}
.art-social{background:#a0a7f0;color:var(--ink)}
.brand-print [lang="zh-Hans"],.detail-art [lang="zh-Hans"]{font-family:"PingFang SC","Microsoft YaHei",sans-serif;font-weight:500;letter-spacing:-.07em}
.detail-overview{padding-block:160px;row-gap:64px;scroll-margin-top:74px}
.detail-intro{grid-column:2 / span 8;max-width:970px;margin:0;font:400 var(--service-primary)/1.15 var(--serif);letter-spacing:-.02em}
.detail-uses{grid-column:5 / span 5}
.detail-uses h2{margin:0 0 24px;font:400 16px/1.3 var(--sans);color:var(--quiet)}
.detail-uses ul{list-style:none;padding:0;margin:0 0 32px}
.detail-uses li{padding:12px 0;border-bottom:1px solid var(--line);font-size:18px}
.detail-features{padding-block:128px;background:white;row-gap:56px}
.detail-section-head{grid-column:2 / span 3}
.detail-section-head p{max-width:26ch;font-size:16px;line-height:1.4;color:var(--quiet);margin:32px 0 0}
.detail-features dl{grid-column:5 / span 5;margin:0}
.feature-row{padding:28px 0;border-bottom:1px solid var(--line)}
.feature-row:first-child{padding-top:0}
.feature-row:last-child{border-bottom:0;padding-bottom:0}
.feature-row dt{font-size:24px;line-height:1.2;letter-spacing:-.02em;margin-bottom:16px}
.feature-row dd{margin:0;color:var(--quiet);font-size:16px;line-height:1.45;max-width:50ch}
.detail-challenges{background:var(--paper)}
.more-services{padding-bottom:160px}
@keyframes service-head-in{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@media (min-width:768px) and (max-width:959px){
  :root{--service-columns:8;--service-primary:32px}
  .service-index>*{grid-column:2 / span 6}
  .service-value h2{grid-column:2 / span 3}.service-value ul{grid-column:5 / span 4}
  .service-capabilities>.editorial-eyebrow{grid-column:2 / span 2}.capabilities-content{grid-column:5 / span 3}
  .detail-heading hgroup{grid-column:4 / span 5}.detail-heading h1{font-size:58px}
  .detail-intro{grid-column:2 / span 6}.detail-uses{grid-column:4 / span 4}
  .detail-section-head{grid-column:2 / span 2}.detail-features dl{grid-column:4 / span 4}
}
@media (max-width:767px){
  :root{--service-columns:4;--service-space:48px;--service-primary:29px;--inner-pad:24px}
  .services-head p,.services-head h1{max-width:500px}
  .services-head{gap:24px}
  .services-hero{margin-bottom:96px}
  .service-value{padding-block:48px;row-gap:32px}
  .service-value h2{grid-column:1/-1;position:static;padding:0}
  .service-value ul{grid-column:1/-1}
  .service-index{padding-block:96px;gap:48px;scroll-margin-top:82px}
  .service-index>*{grid-column:1/-1}
  .service-index .service-row{grid-template-columns:minmax(0,1fr) 24px;padding:24px 0;gap:12px;min-height:116px}
  .service-index .service-row h3{font-size:24px}
  .service-index .service-row p{font-size:15px;grid-column:1;line-height:1.35;max-width:38ch;padding-right:8px}
  .service-index .row-arrow{color:var(--ink);width:20px;height:20px}
  .service-capabilities{padding-block:96px;row-gap:40px}
  .service-capabilities>.editorial-eyebrow,.capabilities-content{grid-column:1/-1}
  .capabilities-content{gap:64px}
  .detail-heading{padding-top:160px;padding-bottom:64px;row-gap:32px}
  .detail-heading hgroup,.detail-back{grid-column:1/-1}
  .detail-back{padding:0}
  .detail-heading h1{font-size:48px}
  .detail-heading hgroup{gap:24px}
  .detail-heading hgroup p{font-size:17px}
  .detail-art{min-height:0;aspect-ratio:4/5;padding:24px}
  .detail-art strong{font-size:clamp(56px,15vw,108px)}
  .detail-art img{width:50%;top:auto;bottom:10%;transform:none;right:5%}
  .detail-overview,.detail-features{padding-block:88px;row-gap:48px}
  .detail-intro,.detail-uses,.detail-section-head,.detail-features dl{grid-column:1/-1}
  .detail-section-head p{max-width:36ch;margin-top:24px}
  .detail-uses li{font-size:16px}
  .feature-row dt{font-size:22px}
  .more-services{padding-bottom:96px}
}
@media (max-width:767px) and (orientation:portrait){
  .floating-print:nth-child(1){left:40%;top:70%;width:50%}
  .floating-print:nth-child(2){left:10%;top:60%;width:38%;filter:none;z-index:1}
  .floating-print:nth-child(3){left:65%;top:10%;width:30%}
  .floating-print:nth-child(4){left:0;top:100%;width:30%}
  .floating-print:nth-child(5){left:50%;top:110%;width:30%}
  .floating-print:nth-child(n+6){display:none}
}
@media (prefers-reduced-motion:reduce){
  .brand-print{transform:none!important;will-change:auto}
  .service-value li{opacity:1}
  .services-head h1,.services-head p,.detail-heading h1,.detail-heading hgroup p{animation:none;opacity:1;transform:none}
}
