/* Approved central invitation and consistent navigation geometry. */
.hero-study .hero-actions .button{width:230px;min-width:230px;min-height:56px;padding:16px 22px;justify-content:center;gap:12px;font-size:16px;box-sizing:border-box}
.hero-study .hero-actions .button svg{width:23px;height:23px;flex:none}
.hero-showcase{position:relative}
.banner-rotation{position:absolute;z-index:4;top:16px;right:16px;min-height:44px;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:30px;background:#fff;color:#4d259f;font-size:14px;font-weight:500;box-shadow:0 4px 16px #21133720;cursor:pointer}
.banner-rotation:hover{background:#eee6fd}.banner-rotation svg{width:18px;height:18px}
.banner-rotation .resume-icon{display:none}.banner-rotation[data-paused=true] .resume-icon{display:block}.banner-rotation[data-paused=true] .pause-icon{display:none}
.project-meta .client-mark{display:flex;align-items:center;justify-content:center;width:100px;height:74px;flex:none;padding:4px}
.project-meta .client-mark svg,.project-meta .client-mark img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;filter:none;box-shadow:none}
.home-inline-applications .application-intro{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:36px 0 64px!important;align-items:start}
.home-inline-applications .application-intro p{margin:0;padding:0 32px 0 34px;max-width:62ch;font-size:22px;line-height:1.6;text-wrap:pretty}
.home-inline-applications .application-intro p+p{color:#56398b}
.home-inline-applications .application-detail{scroll-margin-top:24px}
.inner-hero{min-height:540px;padding-bottom:160px}
.inner-hero .inner-heading{min-height:272px;padding-top:32px;padding-bottom:24px;box-sizing:border-box}
.inner-hero .inner-heading h1{font-size:52px;line-height:1.12;min-height:117px;margin:0;display:flex;flex-direction:column;justify-content:center}
.inner-hero .inner-heading>p{font-size:20px;line-height:1.6;margin-top:20px;max-width:810px}
.inner-hero>.waves{height:190px}





.project-body{position:relative;z-index:2;margin-top:-210px;padding-top:0}.project-body .back-link{margin-bottom:16px;background:#fff;border-radius:24px;padding:8px 14px}
@media(max-width:900px){.inner-hero{min-height:520px}.inner-hero .inner-heading h1{font-size:44px;min-height:100px}}
@media(max-width:600px){
 .hero-study .hero-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:10px}
 .hero-study .hero-actions .button{width:100%;min-width:0;min-height:52px;padding:12px 10px;font-size:12px;gap:7px;white-space:nowrap}
 .hero-study .hero-actions .button svg{width:18px;height:18px}
 .banner-rotation{top:12px;right:12px;font-size:12px;padding:10px 12px}
 .home-inline-applications .application-intro{grid-template-columns:1fr;gap:18px;margin:28px 0 44px!important}
 .home-inline-applications .application-intro p{padding:0 14px;font-size:18px}
 .inner-hero{min-height:478px;padding-bottom:100px}
 .inner-hero .inner-heading{min-height:288px;padding-top:20px;padding-bottom:24px}
 .inner-hero .inner-heading h1{font-size:36px;min-height:121px;line-height:1.12}
 .inner-hero .inner-heading>p{font-size:17px;line-height:1.5;margin-top:16px}
 .inner-hero>.waves{height:120px}
 
 
 .project-body{margin-top:-165px}.project-body .back-link{margin:0 0 14px;padding:6px 12px}
 .project-meta .client-mark{width:72px;height:62px}
 .project-body .project-navigation{padding-right:68px;gap:16px}
}
/* Playback timing belongs to the three choices; the corner control stays quiet. */
.hero-showcase .banner-rotation{width:44px;height:44px;min-height:44px;padding:0;justify-content:center;border-radius:50%;top:12px;right:12px}
.banner-rotation>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.hero-study .project-tab{position:relative;overflow:visible}
.project-tab .banner-progress{position:absolute;top:-9px;left:0;right:0;height:4px;border-radius:4px;background:#d9c6ec;overflow:hidden;pointer-events:none}
.banner-progress-fill{display:block;width:100%;height:100%;background:#6034cf;transform:scaleX(0);transform-origin:left;border-radius:inherit}
.hero-study .showcase-controls{padding-top:24px}
.hero-media .media-poster{animation:none!important;transform:none!important}
.hero-media .banner-outgoing{position:absolute;inset:0;pointer-events:none;z-index:0}
.project-body .project-navigation{margin-top:32px}
.project-neighbor{display:flex;align-items:center;gap:16px;min-width:0}
.project-neighbor .neighbor-mark{display:flex;align-items:center;justify-content:center;width:58px;height:48px;flex:none}
.neighbor-mark svg,.neighbor-mark img{width:100%;height:100%;object-fit:contain;display:block}
@media(max-width:600px){
 .project-neighbor{gap:8px}.project-neighbor .neighbor-mark{width:30px;height:32px}
 .project-body .project-navigation{gap:12px;margin-top:24px;padding-right:60px;grid-template-columns:repeat(2,minmax(0,1fr))}
 .project-body .project-navigation strong{font-size:15px;line-height:1.35}
 .project-body .project-navigation a{min-width:0}.project-neighbor strong{min-width:0}
}
/* Internal introductions meet the existing wave edge; hero geometry stays shared. */
.inner-hero:not(.project-hero) + main > :is(.about-story,.solution-section,.portfolio-section,.contact-layout):first-child{
 position:relative;z-index:2;margin-top:-48px;padding-top:0;
}
@media(max-width:600px){
 .inner-hero:not(.project-hero) + main > :is(.about-story,.solution-section,.portfolio-section,.contact-layout):first-child{margin-top:-24px}
}

/* Project navigation: direction above a larger, optically cropped client logo. */
.project-body .project-navigation{padding-right:0;column-gap:24px}
.project-body .project-navigation a{width:152px;max-width:100%;align-items:center;justify-self:start;text-align:center;gap:12px}
.project-body .project-navigation a:last-child{align-items:center;justify-self:end;text-align:center}
.project-body .project-navigation a>span{font-size:14px;line-height:1.4;color:#645375}
.project-body .project-neighbor{justify-content:center;width:100%;gap:0}
.project-body .project-neighbor .neighbor-mark{width:132px;height:88px;max-width:100%}
.project-navigation a:hover>span{color:var(--purple);text-decoration:underline;text-underline-offset:4px}
@media(max-width:600px){.project-body .project-navigation{column-gap:20px}.project-body .project-navigation a{width:120px;gap:12px}.project-body .project-navigation a>span{font-size:13px}.project-body .project-neighbor .neighbor-mark{width:112px;height:72px}}

/* Mobile project headings: more room for the experience, same wave geometry. */
@media(max-width:600px){
 .project-hero .inner-heading h1{font-size:32px;min-height:72px;line-height:1.12}
 .project-hero .inner-heading>p{display:none}
 .project-hero+main .project-body{margin-top:-270px}
}