/* An expressive scroll layer, preserving the original layout, copy and palette. */
.motion-page-stage,.motion-case-stage {display:contents}
.motion-coin-scene,.motion-surface {display:none}
@media (min-width:901px) {
  /* Keep the supporting spread beside the headline at desktop widths. */
  .newsletter-hero-proof img:last-child {left:25%}
}
@media (prefers-reduced-motion:no-preference) {
  .motion-continuity .motion-coin-scene,.motion-continuity .motion-surface {display:block}
  .motion-continuity .motion-image {scale:var(--media-scale,1);translate:0 var(--media-travel,0px)}
  .motion-continuity .motion-heading {translate:0 var(--heading-y,0px)}
  .motion-continuity .motion-heading.is-visible {transition:opacity .8s var(--ease),translate .08s linear}
  .motion-continuity .experience-block .motion-heading,
  .motion-continuity .about-method .motion-heading {translate:var(--heading-x,0px) 0}

  .motion-continuity .home-hero {height:168svh;min-height:168svh;overflow:clip}
  .motion-continuity .motion-hero-stage {position:sticky;top:0;height:100svh;overflow:clip;isolation:isolate;background:#1d1821}
  .motion-continuity .motion-hero-stage:before {content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.2;background-image:linear-gradient(90deg,transparent 0 49.8%,rgba(239,187,77,.12) 50%,transparent 50.2%),linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px);background-size:50% 100%,100% 12.5vh}
  .motion-continuity .home-hero:after {display:none}
  .motion-continuity .motion-hero-stage:after {content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,rgba(8,8,8,.76) 0%,rgba(8,8,8,.48) 48%,rgba(8,8,8,.08) 82%),linear-gradient(0deg,rgba(8,8,8,.72),transparent 58%)}
  .motion-continuity .motion-coin-scene {width:clamp(14rem,22vw,24rem);aspect-ratio:1;-webkit-perspective:1100px;perspective:1100px;pointer-events:none;user-select:none}
  .motion-continuity .motion-coin-scene--portal {position:fixed;left:0;top:0;z-index:18;opacity:var(--coin-opacity,1);transform:translate3d(var(--coin-screen-x,58vw),var(--coin-screen-y,47vh),0) translate(-50%,-50%) scale(var(--coin-scale,.78));will-change:transform,opacity}
  .motion-continuity .motion-coin-scene--portal:before {content:"";position:absolute;inset:-8%;border-radius:50%;background:radial-gradient(circle,rgba(239,187,77,.2),transparent 70%);filter:blur(16px)}
  .motion-continuity .motion-coin {position:absolute;inset:0;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;transform:rotateX(calc(var(--coin-x,14deg) + var(--coin-pointer-x,0deg))) rotateY(calc(var(--coin-y,-18deg) + var(--coin-pointer-y,0deg)));will-change:transform}
  .motion-continuity .motion-coin__rim {position:absolute;inset:0;border-radius:50%;background:repeating-conic-gradient(from 3deg,#e1b36f 0deg 1deg,#895532 1deg 2deg,#ba8554 2deg 3deg);box-shadow:inset 0 0 0 2px #6b4029;transform:translateZ(var(--depth))}
  .motion-continuity .motion-coin__face {position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;border:9px solid #ad7747;border-radius:50%;-webkit-backface-visibility:hidden;backface-visibility:hidden;box-shadow:inset 0 0 0 2px rgba(255,219,160,.75),inset 0 0 2.5rem rgba(0,0,0,.5),0 0 0 2px #3d271f;background:radial-gradient(circle at 28% 20%,rgba(255,224,166,.4),transparent 38%),radial-gradient(circle at 50% 58%,#704453 0,#492a3a 66%,#2b1b2c 100%);color:#f8dfb2;transform:translateZ(8px)}
  .motion-continuity .motion-coin__face:before {content:"";position:absolute;inset:6%;border:1px solid rgba(255,220,166,.6);border-radius:50%;box-shadow:0 0 0 7px rgba(194,133,68,.15)}
  .motion-continuity .motion-coin__face--back {color:#241825;background:radial-gradient(circle at 26% 18%,#f8dbac,#d2a168 47%,#8b543b 100%);transform:rotateY(180deg) translateZ(8px)}
  .motion-continuity .motion-coin__engraving {position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.55rem;width:85%;height:85%;text-align:center;text-shadow:0 1px 3px rgba(0,0,0,.25)}
  .motion-continuity .motion-coin__engraving span,.motion-continuity .motion-coin__engraving small {font:700 clamp(.5rem,.62vw,.75rem)/1.3 var(--sans);letter-spacing:.13em}
  .motion-continuity .motion-coin__engraving strong {font:700 clamp(4.5rem,8vw,8rem)/1 var(--sans);letter-spacing:-.1em}
  .motion-continuity .contact-main {position:relative}
  .motion-continuity .contact-main > div:not(.motion-coin-scene) {position:relative;z-index:2}
  .motion-continuity .motion-coin-scene--contact {position:absolute;right:3%;top:13%;z-index:1;width:clamp(11rem,18vw,18rem);opacity:.28;--coin-y:-24deg;--coin-x:14deg}
  .motion-continuity .home-hero .hero-title {transform:translate3d(0,var(--hero-shift,0px),0) scale(var(--hero-title-scale,1));transform-origin:24% 45%}
  .motion-continuity .home-hero .hero-title span:first-child {translate:var(--hero-line-a,0px) 0}
  .motion-continuity .home-hero .hero-title .line-2 {translate:var(--hero-line-b,0px) 0}
  .motion-continuity .home-hero .hero-title .execution {translate:var(--hero-line-c,0px) 0}
  .motion-continuity .home-hero .hero-portrait {scale:var(--hero-zoom,1);transform-origin:50% 72%}
  .motion-continuity .home-hero .hero-file--a {translate:calc(var(--hero-phase,0)*-7vw) 0}
  .motion-continuity .home-hero .hero-file .stamp {display:none}
  .motion-continuity .home-hero .hero-file--c {display:none}
  .motion-continuity .home-hero .hero-portrait {bottom:.5rem}
  .motion-continuity .hero-bottom {transform:translateY(calc(var(--hero-phase,0)*-2.5rem))}
  .motion-continuity .manifesto-strip {position:relative;z-index:4;margin-top:-3rem}

  /* Cards move outwards, settle around the statement, then clear the next chapter. */
  .motion-continuity .problems {height:188svh;min-height:188svh;overflow:clip}
  .motion-continuity .problems__sticky {position:sticky;top:0;height:100svh;min-height:100svh}
  .motion-continuity .problem-piece {translate:var(--card-x,0px) var(--card-y,0px);scale:var(--card-motion-scale,1);transition:box-shadow .28s ease,border-color .24s ease}
  .motion-continuity .problem-piece--1,
  .motion-continuity .problem-piece--3,
  .motion-continuity .problem-piece--5 {--x:-33vw}
  .motion-continuity .problem-piece--2,
  .motion-continuity .problem-piece--4,
  .motion-continuity .problem-piece--6 {--x:33vw}
  .motion-continuity .problem-piece--3 {--x:-31vw}
  .motion-continuity .problems__statement {transform:translateY(var(--statement-y,0px)) scale(var(--statement-scale,1));transform-origin:50% 50%}
  .motion-continuity .selected-home {position:relative;z-index:2;margin-top:-7svh}
  .motion-continuity .motion-overlap {position:relative;z-index:var(--chapter-layer,2);margin-top:-1.25rem}
  .motion-continuity .motion-overlap--reverse.chapter-section:before {transform-origin:right}
  .motion-continuity .motion-surface-section {position:relative;isolation:isolate;background-color:transparent!important;background-image:none!important}
  .motion-continuity .motion-surface-section > .motion-surface {position:absolute;inset:-4svh 0 0;z-index:-1;background:var(--motion-surface-color);pointer-events:none;clip-path:inset(0 var(--surface-hide,0%) 0 0)}
  .motion-continuity .motion-surface--rise > .motion-surface {clip-path:inset(var(--surface-hide,0%) 0 0 0)}
  .motion-continuity .motion-surface-section > :not(.motion-surface) {opacity:var(--surface-content,1)}
  .motion-continuity .moment,.motion-continuity .work-tile,.motion-continuity .about-method__steps article {translate:0 var(--item-y,0px);scale:var(--item-scale,1);rotate:var(--item-tilt,0deg)}
  .motion-continuity .motion-scene.is-visible .moment,
  .motion-continuity .motion-scene.is-visible .work-tile,
  .motion-continuity .motion-scene.is-visible .about-method__steps article {translate:0 var(--item-y,0px);scale:var(--item-scale,1);rotate:var(--item-tilt,0deg)}

  /* Inner page headings approach the viewport as the following section takes over. */
  .motion-continuity .page-hero,.motion-continuity .case-hero {overflow:visible}
  .motion-continuity .case-hero {overflow-x:clip}
  .motion-continuity .page-hero h1,.motion-continuity .case-hero h1 {transform:translate3d(0,var(--motion-title-y,0px),0) scale(var(--motion-title-scale,1));transform-origin:left center}
  .motion-continuity .about-profile__copy h1,.motion-continuity .contact-main h1 {transform:translateY(var(--motion-title-y,0px)) scale(var(--motion-title-scale,1));transform-origin:left center}
  .motion-continuity .page-hero__ghost,.motion-continuity .case-next__ghost,
  .motion-continuity .experience-year {translate:var(--motion-ghost-x,0px) 0}
  .motion-continuity [data-page="work"] .page-hero__ghost {transform:perspective(900px) rotateY(var(--ghost-turn,0deg)) scale(var(--ghost-scale,1))}
  .motion-continuity [data-page="work"] .page-hero__ghost {color:rgba(239,187,77,.15);text-shadow:2px 2px 0 rgba(239,187,77,.12),5px 5px 0 rgba(239,187,77,.08),9px 9px 0 rgba(239,187,77,.04)}
  .motion-continuity [data-page="experience"] .page-hero__ghost {scale:var(--ghost-scale,1);color:rgba(255,255,255,.12);text-shadow:3px 3px 0 rgba(239,187,77,.1),8px 8px 0 rgba(0,0,0,.16)}
  .motion-continuity [data-page="journey"] .page-hero__ghost {transform:perspective(900px) rotateX(var(--ghost-turn,0deg)) scale(var(--ghost-scale,1))}
  .motion-continuity [data-page="journey"] .page-hero__ghost {color:rgba(90,41,71,.14);text-shadow:3px 3px 0 rgba(90,41,71,.08),8px 8px 0 rgba(90,41,71,.04)}
  .motion-continuity .archive-year__number {translate:var(--motion-year-x,0px) 0}
  .motion-continuity .archive-year__number,.motion-continuity .experience-year,.motion-continuity .about-team__number strong {scale:var(--year-scale,1);opacity:var(--year-presence,1)}
  .motion-continuity .archive-year__number {color:rgba(90,41,71,.24);text-shadow:2px 2px 0 rgba(90,41,71,.1),6px 6px 0 rgba(90,41,71,.05)}
  .motion-continuity .experience-year {color:rgba(255,255,255,.16);text-shadow:4px 4px 0 rgba(0,0,0,.14)}
  .motion-continuity .experience-block--light .experience-year {color:rgba(90,41,71,.17);text-shadow:4px 4px 0 rgba(90,41,71,.08)}
  .motion-continuity .about-team__number strong {text-shadow:4px 4px 0 rgba(239,187,77,.35),10px 10px 0 rgba(0,0,0,.13)}
  .motion-continuity .about-profile__portrait {translate:0 var(--motion-portrait-y,0px)}
  .motion-continuity .about-profile__portrait {transform:perspective(1200px) rotateY(var(--portrait-turn,0deg)) rotateZ(1.2deg)}
  .motion-continuity .case-hero__media > img {scale:var(--case-zoom,1)}
  .motion-continuity .newsletter-hero-proof {scale:var(--case-zoom,1)}
  .motion-continuity .newsletter-hero-proof {transform:perspective(1200px) rotateY(var(--case-turn,0deg))}
  .motion-continuity .case--bastarda .bastarda-wall {transform:perspective(1200px) rotateY(var(--case-turn,0deg)) rotateZ(2deg)}
  .motion-continuity .case--automation .automation-repeat {transform:perspective(900px) rotateY(var(--case-turn,0deg))}
  .motion-continuity .case-next__ghost {transform:perspective(1000px) rotateY(var(--ghost-turn,0deg)) scale(var(--ghost-scale,1))}

  /* Crop and scale the picture within its established card, never its caption. */
  .motion-continuity .selected-home .feature-media > img,
  .motion-continuity .work-wall .feature-media > img,
  .motion-continuity .moment--hub > img,
  .motion-continuity .moment--newsletter > img,
  .motion-continuity .work-tile--image > img {clip-path:inset(0 var(--media-crop,0%) 0 0);transform:none}
  .motion-continuity .newsletter-proof__page .motion-image {clip-path:inset(var(--media-reveal,0%) 0 0 0)}
  .motion-continuity .media-spread figure .motion-image {clip-path:inset(0 var(--media-reveal,0%) 0 0)}
  .motion-continuity .newsletter-hero-proof > .motion-image {scale:var(--media-scale,1)}
  .motion-continuity :where(.quick-access,.index-trigger,.btn,.quick-action,.contact-link,.home-work-link):active {scale:.97}
  .motion-continuity .quick-section h2 {position:relative}
  .motion-continuity .quick-section h2:after {content:"";position:absolute;left:0;bottom:-1px;width:34%;height:2px;background:var(--plum);transform:scaleX(var(--quick-progress,0));transform-origin:left}
}
@media (min-width:1100px) and (min-height:850px) and (prefers-reduced-motion:no-preference) {
  .motion-continuity .page-hero {display:block;height:132svh;min-height:132svh;padding:0}
  .motion-continuity .case-hero {display:block;height:140svh;min-height:140svh;padding:0}
  .motion-continuity .motion-page-stage,
  .motion-continuity .motion-case-stage {position:sticky;top:0;display:flex;align-items:end;height:100svh;min-height:100svh;overflow:visible}
  .motion-continuity .motion-page-stage {padding:calc(var(--header) + 5rem) 0 clamp(3.5rem,7vw,7rem)}
  .motion-continuity .motion-case-stage {padding:calc(var(--header) + 3rem) 0 3rem}
  .motion-continuity .page-hero + .section,
  .motion-continuity .page-hero + .experience-block {position:relative;z-index:2;margin-top:-1.25rem}
  .motion-continuity .page-hero + .chronology-rail {margin-top:-1.25rem}
  .motion-continuity .case-hero + .case-nav {margin-top:-1.25rem}
  .motion-continuity .newsletter-case-hero:before {display:none}
  .motion-continuity .newsletter-case-hero .motion-case-stage:before {content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,var(--white) 0%,rgba(251,250,246,.97) 42%,rgba(251,250,246,.35) 68%,rgba(251,250,246,.08))}
}
@media (max-width:900px) and (prefers-reduced-motion:no-preference) {
  .motion-continuity .home-hero {height:auto;min-height:100svh}
  .motion-continuity .manifesto-strip,.motion-continuity .selected-home {margin-top:0}
  .motion-continuity .motion-overlap {margin-top:0}
  .motion-continuity .motion-surface-section > .motion-surface {inset:0;clip-path:inset(var(--surface-hide-mobile,0%) 0 0 0)}
  .motion-continuity .motion-hero-stage {position:relative;height:auto;min-height:100svh}
  .motion-continuity .home-hero .hero-title,.motion-continuity .home-hero .hero-portrait {transform:none;scale:1}
  .motion-continuity .home-hero .hero-title span {translate:0 0}
  .motion-continuity .home-hero .hero-portrait {transform:translate3d(0,calc(var(--hero-scroll,0)*-5rem),0)}
  .motion-continuity .motion-coin-scene--portal {width:clamp(8rem,30vw,13rem)}
  .motion-continuity .motion-coin-scene--contact {right:2%;top:7%;width:clamp(7rem,28vw,11rem);opacity:.14}
  .motion-continuity .motion-coin__engraving strong {font-size:clamp(2.7rem,10vw,4rem)}
  .motion-continuity .problems {height:auto;min-height:0;overflow:visible}
  .motion-continuity .problems__sticky {position:relative;height:auto;min-height:0}
  .motion-continuity .problem-piece {translate:0 0;scale:1;transition:translate .4s ease,box-shadow .28s ease}
  .motion-continuity .problem-piece:active {translate:0 -.3rem}
  .motion-continuity .problems__statement {transform:none}
  .motion-continuity .page-hero h1,.motion-continuity .case-hero h1 {transform:translateY(var(--motion-title-y,0px))}
  .motion-continuity .archive-year__number,.motion-continuity .about-profile__portrait {translate:0 0}
  .motion-continuity .about-profile__portrait {transform:none}
  .motion-continuity .case--bastarda .bastarda-wall,.motion-continuity .case--automation .automation-repeat,.motion-continuity .newsletter-hero-proof {transform:none}
  .motion-continuity .newsletter-proof__page .motion-image,
  .motion-continuity .media-spread figure .motion-image {clip-path:inset(var(--media-reveal,0%) 0 0 0)}
}
@media (max-height:820px) and (min-width:901px) and (prefers-reduced-motion:no-preference) {
  .motion-continuity .home-hero,.motion-continuity .problems,.motion-continuity .page-hero,.motion-continuity .case-hero {height:auto;min-height:100svh;overflow:visible}
  .motion-continuity .motion-hero-stage,.motion-continuity .problems__sticky,.motion-continuity .motion-page-stage,.motion-continuity .motion-case-stage {position:relative;height:auto;min-height:100svh;overflow:visible}
  .motion-continuity .motion-page-stage,.motion-continuity .motion-case-stage {padding-block:calc(var(--header) + 4rem) 4rem}
}
@media (prefers-reduced-motion:reduce),print {
  .motion-image {scale:1!important;translate:0 0!important;clip-path:none!important}
  .motion-heading {translate:0 0!important}
  .home-hero,.problems {height:auto!important;min-height:0!important}
}