/* Centered coverflow with four faces and a readable active panel. */
.has-prism{--prism-width:clamp(215px,22vw,275px);perspective:1000px;overflow:hidden}
.has-prism .carousel-controls{max-width:760px}
.has-prism .service-list{width:100%;height:460px;min-height:0;aspect-ratio:auto;transform:none;perspective:1000px;overflow:visible}
.has-prism .service-row{inset:24px auto auto 50%;width:var(--prism-width);height:auto;aspect-ratio:3/4;min-height:0;display:flex;padding:20px;background:rgba(31,31,31,.58);border:1px solid rgba(255,255,255,.3);border-radius:12px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 12px 35px rgba(0,0,0,.24);transform-style:preserve-3d;transition:transform .8s cubic-bezier(.22,.68,.2,1),opacity .65s ease,filter .65s ease;will-change:transform,opacity;overflow:hidden}
.has-prism .service-row:hover{padding:20px;background:rgba(31,31,31,.58)}
.has-prism .service-row[data-position=active]{transform:translateX(-50%) translateZ(85px);opacity:1;filter:none;z-index:4;pointer-events:auto}
.has-prism .service-row[data-position=prev]{transform:translateX(-120%) rotateY(35deg) translateZ(-80px);opacity:.5;filter:blur(3px);z-index:2;pointer-events:none}
.has-prism .service-row[data-position=next]{transform:translateX(20%) rotateY(-35deg) translateZ(-80px);opacity:.5;filter:blur(3px);z-index:2;pointer-events:none}
.has-prism .service-row[data-position=away]{transform:translateX(-50%) translateZ(-260px) scale(.84);opacity:0;filter:blur(5px);z-index:0;pointer-events:none}
.has-prism .service-row .service-no{font-size:11px}
.has-prism .service-row h3{font-size:clamp(21px,1.8vw,25px);line-height:1.35;margin:auto 0 13px}
.has-prism .service-row p{font-size:13px;line-height:1.7;word-break:keep-all}
.has-prism .service-row small{font-size:11px;line-height:1.65;margin-top:13px}
.services-section.visible .has-prism .service-row.is-active .service-no,
.services-section.visible .has-prism .service-row.is-active h3,
.services-section.visible .has-prism .service-row.is-active p,
.services-section.visible .has-prism .service-row.is-active small,
.services-section.visible .has-prism .service-row.is-active>b{animation:card-text-in .6s cubic-bezier(.2,.7,.2,1) both}
.services-section.visible .has-prism .service-row.is-active h3{animation-delay:.09s}
.services-section.visible .has-prism .service-row.is-active p{animation-delay:.18s}
.services-section.visible .has-prism .service-row.is-active small{animation-delay:.27s}
.services-section.visible .has-prism .service-row.is-active>b{animation-delay:.36s}
@keyframes card-text-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

/* Each mark describes the work rather than being a decorative shape. */
.partnership-map article.active:after,.motion-steps article:after{display:none}
.story-icon{width:44px;height:44px;stroke:#f1efea;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.partnership-map article .story-icon{position:absolute;right:28px;top:27px}
.partnership-map article.active .story-icon{stroke:#d36d61}
.motion-steps article .story-icon{position:absolute;right:30px;top:29px}
.motion-steps article:nth-child(2) .story-icon{stroke:#d36d61}
.why-section h2 em{color:#d36d61}
.why-section .partnership-map article.active p strong{color:#f4e2dc;font-weight:650}
.why-section .partnership-map article.active p strong:first-child{color:#e48b80}
.process-track .process-card{grid-template-columns:180px minmax(0,1fr)}

/* Native color emoji: the glyph follows the visitor's operating system. */
.problem-grid article{position:relative;overflow:hidden}
.problem-emoji{position:absolute;top:26px;right:28px;font-family:'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji',sans-serif;font-size:44px;line-height:1;animation:emoji-float 4.5s ease-in-out infinite}
.problem-grid article:nth-child(2) .problem-emoji{animation-delay:.5s}
.problem-grid article:nth-child(3) .problem-emoji{animation-delay:1s}
@keyframes emoji-float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-6px) rotate(3deg)}}
@media(max-width:760px){
 .has-prism{--prism-width:min(59vw,230px);perspective:900px}
 .has-prism .service-list{height:405px;min-height:0}
 .has-prism .service-row{padding:20px}
 .has-prism .service-row:hover{padding:20px}
 .has-prism .service-row h3{font-size:21px}
 .has-prism .service-row p{font-size:12px}
 .has-prism .service-row small{font-size:10px}
 .has-prism .service-row[data-position=prev]{transform:translateX(-115%) rotateY(35deg) translateZ(-80px)}
 .has-prism .service-row[data-position=next]{transform:translateX(15%) rotateY(-35deg) translateZ(-80px)}
 .process-track .process-card{grid-template-columns:65px minmax(0,1fr)}
 .story-icon{width:38px;height:38px}
 .problem-emoji{font-size:38px;top:22px;right:24px}
}
@media(max-width:360px){.has-prism .service-row,.has-prism .service-row:hover{padding:14px}.has-prism .service-row h3{font-size:19px;margin-bottom:8px}.has-prism .service-row p{font-size:11px;line-height:1.55}.has-prism .service-row small{font-size:10px;line-height:1.45;margin-top:8px}}
@media(prefers-reduced-motion:reduce){
 .problem-emoji{animation:none}
 .services-section.visible .has-prism .service-row.is-active>*{animation:none}
 .has-prism .service-row{transition:none}
}
