/* Decorative artwork owns a flow row, separate from every text block.
   Its padding also reserves the full footprint of a rotating square. */
.brand-elements{--element-size:clamp(44px,7vw,96px);position:relative;
  display:flex;justify-content:flex-end;align-items:center;flex-wrap:wrap;
  gap:calc(var(--element-size)*.5);width:calc(100% - var(--gutter)*2);
  max-width:var(--maxw);margin:clamp(1.5rem,4vw,3rem) auto 0;
  padding:calc(var(--element-size)*.25);isolation:isolate}
.brand-elements .el{position:relative!important;inset:auto!important;
  display:block!important;width:var(--element-size)!important;height:var(--element-size);
  flex:0 0 var(--element-size);aspect-ratio:1;z-index:auto;opacity:1!important;
  transform:none;translate:none!important}
.brand-elements .el.rve{transform:none!important}
.brand-elements .el{animation:none}
.brand-elements .el img{width:100%;height:100%;object-fit:contain}
.brand-elements .el--spin img{animation:brandSpin 28s linear infinite}
.brand-elements .el--spin-r img{animation:brandSpin 38s linear infinite reverse}
.brand-elements .el--float img{animation:brandFloat 7s var(--ease-io) infinite alternate}
.brand-elements .el--pulse img{animation:brandPulse 5s var(--ease-io) infinite alternate}
.brand-elements .el.rve img{scale:.8;transition:scale .9s var(--ease-io)}
.brand-elements .el.rve.in img{scale:1}
.brand-elements .el.rve:not(.in) img{animation-play-state:paused}
@keyframes brandSpin{to{transform:rotate(360deg)}}
@keyframes brandFloat{to{transform:translateY(-8%) rotate(4deg)}}
@keyframes brandPulse{to{transform:scale(1.08)}}

/* Plain project copy stays white; artwork with its own backgrounds keeps its colours. */
.behance-project,.behance-project .gal__text,.behance-project figcaption,
.behance-project .gal__copy,.behance-project .gal__credits{color:var(--white);opacity:1}
.behance-project .gal__text *{color:inherit!important}
.project-page .on-black .muted,.project-page .on-black .credits__k,
.project-page .on-black .label,.project-page .gasser-next__meta{color:var(--white)}
.gal .gal__copy{padding:clamp(2rem,6vw,5rem) clamp(1.25rem,7vw,6rem);
  display:grid;gap:1.5rem;font-size:clamp(1.0625rem,1.7vw,1.4rem);line-height:1.6}
.gal__copy h3{font-family:var(--display);font-size:clamp(1.75rem,3.2vw,3rem);
  font-weight:500;line-height:1.15;letter-spacing:var(--ls-snug)}
.gal__copy p{max-width:65ch}
.gal__copy dl{display:grid;gap:.6rem;font-size:1rem;margin:1rem 0 0}
.gal__copy dl div{display:flex;flex-wrap:wrap;gap:0 .4em}
.gal__copy dt{font-weight:600}.gal__copy dd{margin:0}
.gal .behance-slice svg{display:block;width:100%;height:auto;overflow:hidden}
.gal .gal__credits{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:2rem;padding:clamp(2rem,5vw,4rem) var(--gutter);font-size:1rem;line-height:1.6}
.gal__credits-logo svg{width:36px;height:auto;fill:currentColor}
.gal__credits-logo{display:grid;gap:1rem;align-content:start}
.gal__credits ul{display:grid;gap:.5rem}

/* The CTA arrow has no circular border or hover background. */
.cta-big__link .cta-big__arr{border:0;border-radius:0;width:auto;height:auto;
  line-height:1;background:none;color:inherit}
.cta-big__link:hover .cta-big__arr{background:none;color:inherit}
.cta-big__link{max-width:100%;font-size:clamp(1.8rem,8vw,8rem)}
.cta-big__t{min-width:0}
.cta-big__row{max-width:100%;overflow-wrap:anywhere}

/* One scroll pass, ending with the final word at the viewport centre. */
.arc{height:460svh}
/* The blue slide rises over the held clients section, then pins for its line. */
.manifesto-journey{position:relative;z-index:2;margin-top:-100svh}
.clients-slide{position:sticky;top:var(--clients-top,0px);z-index:0;background:var(--white)}
.manifesto-journey .arc{z-index:1}
.arc__svg{max-height:calc(100svh - var(--nav-h) - 9rem)}
.arc__label{top:calc(var(--nav-h) + 1.25rem)}
.arc__foot{bottom:clamp(1.5rem,4vw,2.75rem)}
.wk-mobile{display:none}
.wk-mobile__project{padding:clamp(2rem,6vw,4rem) 0;border-top:1px solid var(--g800)}
.wk-mobile__copy{padding-inline:var(--gutter);display:grid;gap:1rem}
.wk-mobile__copy h2{font-family:var(--display);font-size:clamp(2rem,6vw,3rem);
  line-height:1.05;letter-spacing:var(--ls-tight)}
.wk-mobile__copy p{max-width:55ch;font-size:1rem;line-height:1.6}
.wk-mobile__gallery{display:flex;gap:.75rem;overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;padding:1.5rem var(--gutter) .75rem;scroll-padding-inline:var(--gutter)}
.wk-mobile__gallery img{flex:0 0 86%;width:86%;aspect-ratio:4/3;object-fit:contain;
  background:var(--black);max-width:720px;
  scroll-snap-align:start;min-width:0}

/* Minimum widths and long labels must not force page overflow at high zoom. */
.head>*,.studio-about>*,.ab-split>*,.form>*,.work-card__meta{min-width:0}
.ph-head__t,.studio-about__title,.person-card__name,.work-card__name,
.gasser-next__name{overflow-wrap:anywhere}
.crumbs{flex-wrap:wrap}
.ph-head__t .w,.ph-head__t .w i{max-width:100%;overflow-wrap:anywhere}
.credits__v,.foot__mail{min-width:0;overflow-wrap:anywhere}
.field input,.field textarea,.field select{max-width:100%;min-width:0;width:100%}

@media(max-width:900px){
  .wk-archive{height:auto!important}
  .wk-archive .wk-stage{display:none}
  .wk-mobile{display:block;padding-top:var(--nav-h)}
  .ab-split{grid-template-columns:minmax(0,1fr)!important}
}
@media(max-width:760px){
  :root{--pad-y:clamp(3.5rem,12vw,5rem)}
  .brand-elements{--element-size:clamp(40px,12vw,64px);margin-top:1.5rem}
  .head,.studio-about{grid-template-columns:minmax(0,1fr)}
  .ph-head__t{font-size:clamp(2.2rem,10vw,4.75rem)}
  .person-card{padding:1.5rem var(--gutter)}
  .person-card__role{font-size:.75rem;line-height:1.5}
  .form{grid-template-columns:minmax(0,1fr)}
  .field input,.field textarea,.field select{font-size:1rem}
  .nav__in{gap:.875rem}
  .nav .btn,.btn,.tlink{min-height:44px}
  .drawer{overflow-y:auto;gap:2rem}
  .drawer nav,.drawer__meta{flex-shrink:0}
  .filters{gap:.5rem}
  .filter{min-height:44px;padding:.6rem .8rem}
  .cta-big__link{gap:.5em}
  .cta-big__row{gap:1rem;font-size:.6875rem;line-height:1.6}
  .gal .gal__credits{grid-template-columns:minmax(0,1fr)}
  .gasser-next__caption{gap:.75rem;flex-wrap:wrap}
  .arc__foot{flex-direction:column;gap:.75rem;font-size:.625rem}
}
@media(max-width:480px){
  .credits__row{grid-template-columns:minmax(0,1fr);gap:.5rem}
  .gasser-next__caption{display:grid;grid-template-columns:minmax(0,1fr) auto}
  .gasser-next__name{grid-column:1/-1;font-size:clamp(1.65rem,7vw,2.5rem)}
  .gasser-next__meta{grid-column:1;font-size:.625rem}
  .gasser-next__arrow{grid-column:2}
}
@media(prefers-reduced-motion:reduce){
  .arc{height:auto!important}
  .arc__pin{position:relative;height:auto;min-height:100svh}
  .arc__phase{position:relative;min-height:100svh}
  .arc__svg{display:none}
  .arc__static{position:static;width:auto;height:auto;clip:auto;clip-path:none;
    overflow:visible;white-space:normal;margin:0;padding:8rem var(--gutter);
    font-family:var(--display);font-size:clamp(2.5rem,8vw,7rem);line-height:1.05}
  .wk-archive{height:auto!important;margin-top:0}
  .wk-archive .wk-stage{display:none}
  .wk-mobile{display:block}
  .brand-elements .el,.brand-elements .el img{animation:none!important}
  .brand-elements .el.rve img{scale:1;transition:none}
  .clients-slide{position:relative;top:auto}
}

/* Editable project paragraphs */
.gal .project-text,.gal .project-import-text{color:var(--white);opacity:1}
.gal :is(.gal__text,.gal__copy,.gal__credits,.project-text,.project-import-text)
  :is(p,h1,h2,h3,h4,h5,h6,li,dt,dd,span,a,strong,em){color:inherit!important}
.gal .project-text p{overflow-wrap:anywhere}
.gal .project-import-text{padding:clamp(2rem,6vw,5rem) clamp(1.25rem,7vw,6rem);
  font-size:clamp(1.0625rem,1.7vw,1.4rem);line-height:1.6}