/* Editorial system — rhythm, navigation and reusable page layouts. */
:root{--gutter:clamp(20px,5.5vw,88px);--content:1440px;--space-1:8px;--space-2:16px;--space-3:24px;--space-4:32px;--space-6:48px;--space-8:64px;--space-12:96px;--text-muted:#625669;--accent-text:#b40a61;--line:#39204326;--heading:clamp(36px,4.4vw,64px)}
html{scroll-padding-top:110px;scrollbar-gutter:stable}
body{font-size:16px;line-height:1.55;overflow-wrap:break-word}
[hidden]{display:none!important}
p{line-height:1.7}
.section{padding:var(--space-8) max(var(--gutter),calc((100vw - var(--content))/2))}
.header{position:fixed;inset:0 0 auto;height:84px;padding:0 var(--gutter);border:0;gap:24px;transition:background-color 180ms ease,box-shadow 180ms ease}
.header.is-scrolled,.header.story-header{background:var(--purple);box-shadow:0 1px 0 #ffffff24}
.brand{width:174px;flex-shrink:0}.brand img{height:auto;aspect-ratio:1129/270}
.header nav{gap:clamp(16px,2.5vw,36px);font-size:14px;line-height:1.2}
.header nav a{min-height:44px;white-space:nowrap}
.header nav a[aria-current=page]{text-decoration:underline;text-decoration-color:#f6a3ce;text-underline-offset:8px;text-decoration-thickness:2px}
.header .nav-contact{padding:12px 20px;border:1px solid #ffffff88;border-radius:30px}
.header a:focus-visible{outline-color:#ffb7dd}
.manifesto,.work,.services,.clients,.about,.contact,footer{isolation:isolate}
.work::before,.services::before,.clients::before,.about::before,footer::before{display:none}
.manifesto{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,88px);align-items:center;padding:80px max(var(--gutter),calc((100vw - 1160px)/2)) 72px}
.manifesto-stage{overflow:hidden}
.manifesto h2{font-size:clamp(38px,4.3vw,62px);line-height:1.02;margin:0;max-width:none}
.manifesto-bottom{display:block;width:100%;max-width:none;margin:0;padding:0;border:0}
.manifesto-bottom p{font-size:16px;line-height:1.7;margin-bottom:18px;max-width:55ch}
.manifesto-bottom p:last-child{margin:0;color:var(--text-muted)}

.work{background:var(--paper);padding-top:32px;padding-bottom:72px}
.section-heading{gap:40px;padding-top:36px;border-top:1px solid var(--line);margin-bottom:28px}
.work .section-heading{border-top:0;padding-top:0}
.manifesto+.work{padding-top:40px}
.section-heading h2,.services h2,.clients h2,.about h2{font-size:var(--heading);line-height:1.04}
.section-heading p{font-size:15px;max-width:30ch;line-height:1.65}
.filters{gap:8px;margin-bottom:24px}.filters button{font-size:14px;min-height:44px;padding:10px 19px}
.filters button:not(.active):hover,.filters button:hover{background:var(--pink);border-color:var(--pink);color:var(--ink)}
.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 32px;align-items:start}
.project{grid-column:span 1;position:relative;min-width:0;padding-top:0}
.project-media{aspect-ratio:1.5;border-radius:0;background:#dfd9e1}
.project-media img{filter:none;object-fit:cover}
.project-caption{align-items:flex-start;margin-top:16px;gap:16px}
.project-caption h3{font-size:clamp(27px,2.6vw,37px);line-height:1.08}
.project-caption h3>span:not(.standard-e){display:block;font:400 16px/1.5 Arial,sans-serif;text-transform:none;letter-spacing:0;margin-top:5px;color:var(--text-muted)}
.project-caption .project-category{font-size:11px;letter-spacing:.07em;margin-top:6px;text-align:right;flex-shrink:0}
.project:hover .project-caption h3,.project:focus-visible .project-caption h3{color:var(--accent-text)}
.project-grid:not([data-filter=Todos]) .project{grid-column:span 1;padding-top:0}
.archive-action{margin-top:44px;justify-content:center}
.archive-button{font-size:24px;min-height:56px;text-align:center;max-width:100%}
.services{padding-top:56px;padding-bottom:64px}.services-intro{margin-bottom:30px}
.services h2{font-size:clamp(36px,4vw,56px)}
.services-scene{max-width:1320px;margin:0 auto 24px}.service-studio{max-width:1320px;margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.service-studio .service-pillar{padding:12px 12px 0!important}
.service-pillar h3.service-title{font-size:clamp(29px,2.6vw,38px)}
.service-pillar>p{font-size:15px;line-height:1.65;max-width:29ch}.service-pillar>p.service-subtitle{font-size:14px;margin-bottom:16px}
.service-mobile-icon,.production-mobile{display:none}
.service-contact{display:table;margin:30px auto 0;color:#fff;padding:10px 0;min-height:44px;border-bottom:1px solid #f3a1cf;font-size:15px}
.clients{padding-top:56px;padding-bottom:56px}
.clients h2{font-size:clamp(32px,3.6vw,48px);text-align:left;margin-bottom:28px;max-width:620px}
.clients h2 br{display:none}.clients h2 br::after{content:' '}
.client-grid.client-logos{max-width:none;gap:0}
.client-logos>.client-logo{height:100px;flex-basis:calc(100% / 7);border:0;padding:20px 14px}
.client-logo svg{max-height:46px;max-width:100%}
.about{grid-template-columns:1fr 1fr;gap:8%;padding-top:60px;padding-bottom:60px;align-items:center}
.about-collage{translate:none;max-height:510px;margin:0;aspect-ratio:1.2}
.about-copy h2{margin-bottom:24px}.about-copy>p:not(.eyebrow){font-size:16px;line-height:1.7;color:#44324d;margin-bottom:18px}
.about-copy .archive-button{margin-top:8px}
.contact{margin:0;padding-top:64px;padding-bottom:64px}
.contact-title{font-size:clamp(52px,6.5vw,90px);line-height:1.02;text-align:center;margin:0}
.contact-bottom{margin-top:36px;padding-top:28px;gap:24px}
.contact-bottom>a{font-size:clamp(21px,2.1vw,29px);min-height:62px}
footer{padding:44px var(--gutter);gap:24px}.footer-brand{width:170px}
footer nav{display:flex;gap:22px;flex-wrap:wrap}footer nav a,footer div a{font-size:14px;min-height:44px;display:inline-flex;align-items:center}
footer small{width:100%;font-size:12px;letter-spacing:.02em;color:#cbbbd2}
.cases-main,.story,.case-detail{padding-top:140px;padding-bottom:64px}
.cases-intro{margin-bottom:32px;gap:40px}.cases-intro h1,.story h1,.case-heading h1{font-size:clamp(48px,6.3vw,88px);line-height:1.02;margin:0}
.cases-intro p{font-size:16px;max-width:38ch;margin:0}
.portfolio-status{font-size:13px;color:var(--text-muted);margin:0 0 28px}
.cases-contact{border-top:1px solid var(--line);margin-top:64px;padding-top:36px}.cases-contact h2{font-size:clamp(36px,4.3vw,56px)}
.back-link{display:inline-flex;align-items:center;min-height:44px;font-size:15px;text-decoration:underline;text-underline-offset:5px;text-decoration-color:#ad94b9}
.story>.back-link{margin-bottom:24px}
.story-intro{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:start}
.story-prose p{font-size:17px;line-height:1.75;margin-bottom:20px;max-width:60ch}
.story-photo{margin:40px 0 56px}.story-photo img{width:100%;height:auto;aspect-ratio:1280/853;max-height:540px;object-fit:cover;object-position:50% 45%;filter:grayscale(1) brightness(1.14) contrast(.76)}
.story-photo figcaption{font-size:12px;color:var(--text-muted);padding-top:10px}
.team-title{font-size:clamp(36px,4vw,54px);line-height:1.06;margin:48px 0 24px}
.team-grid{margin-top:0;gap:0 32px}.team-member{padding:22px 0}.team-member h3{font-size:29px}.team-member p{font-size:15px;color:var(--text-muted)}
.team-invite{margin-top:48px;padding:32px;background:#e4d7ed;display:flex;justify-content:space-between;align-items:center;gap:24px}.team-invite p{margin:0;font-size:18px}
.breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:12px;font-size:14px;margin-bottom:32px}.breadcrumbs a{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-underline-offset:5px}
.case-heading{display:flex;justify-content:space-between;gap:48px;align-items:end;margin-bottom:36px}.case-heading>div{max-width:75%}.case-client{font-size:17px;color:var(--accent-text);margin:0 0 12px}.case-heading h1{max-width:900px}.case-heading dl{display:flex;gap:32px;margin:0}.case-heading dt{font-size:12px;color:var(--text-muted);margin-bottom:4px}.case-heading dd{font-size:15px;margin:0;white-space:nowrap}
.case-cover{display:block;position:relative;background:var(--purple)}.case-cover img{width:100%;height:auto;max-height:760px;object-fit:contain}.case-cover>span{position:absolute;bottom:24px;right:24px;padding:16px 24px;background:var(--purple);color:white;font:900 25px/1.2 Conduit;clip-path:polygon(1% 0,100% 3%,98% 100%,0 96%)}.case-cover:hover>span{background:var(--pink);color:var(--ink)}
.case-actions{display:flex;justify-content:space-between;gap:24px;padding:20px 0 36px}
.project-pagination{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);padding-top:28px;gap:24px}.project-neighbor{display:flex;flex-direction:column;gap:6px;min-height:100px}.project-neighbor:last-child{text-align:right}.project-neighbor>span,.project-neighbor small{font-size:14px;color:var(--text-muted)}.project-neighbor strong{font:900 38px/1.1 Conduit}.project-neighbor:hover strong{color:var(--accent-text)}

@media(max-width:1000px){
 .header nav{gap:18px}.brand{width:150px}.header nav{font-size:13px}
 .project-grid{gap:36px 24px}.project-caption{display:block}.project-caption .project-category{display:block;text-align:left;margin-top:8px;font-size:11px}
 .client-logos>.client-logo{flex-basis:calc(100% / 5)}
 .case-heading{display:block}.case-heading>div{max-width:100%}.case-heading dl{margin-top:24px}.story-intro{gap:40px}
}
@media(max-width:760px){
 html{scroll-padding-top:130px}.header{height:112px;padding:16px 20px 8px;display:flex;flex-wrap:wrap;gap:2px;background:var(--purple)}.header .brand{width:140px;margin-right:auto}.header nav{width:100%;justify-content:space-between;gap:8px;font-size:12px}.header nav>a:nth-child(2){display:inline-flex}.header .nav-contact{padding:8px 10px;min-height:38px}
 .section{padding-left:24px;padding-right:24px}
 .manifesto{grid-template-columns:1fr;gap:24px;padding-top:48px;padding-bottom:32px}.manifesto h2{font-size:42px}.manifesto-bottom p{font-size:16px}
 .section-heading{display:block;margin-bottom:24px;padding-top:24px}.section-heading p{margin:16px 0 0;max-width:none}.section-heading h2{font-size:42px}
 .project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 20px}.project,.project:nth-child(n),.project-grid:not([data-filter=Todos]) .project{grid-column:span 1;padding:0}.project-caption h3{font-size:29px}
 .services{padding-top:44px;padding-bottom:44px}.services h2{font-size:40px}.services-scene{display:none}.service-studio{grid-template-columns:1fr 1fr;gap:24px}.service-studio .service-pillar{padding:0!important;text-align:left;display:block}.service-mobile-icon{display:block;width:140px;height:125px;margin:0 auto 16px}.service-pillar>p,.service-pillar>p.service-subtitle{margin-left:0;margin-right:0;max-width:none}.service-pillar>p{font-size:15px}.service-pillar h3.service-title{font-size:34px}.production-mobile{display:block;font-size:14px}.production-mobile summary{min-height:44px;padding:10px 0;cursor:pointer;color:#f3a1cf}.production-mobile p{font-size:15px}.mobile-node-2 .scene-halo{stroke:var(--pink);stroke-width:1.5}
 .clients{padding-top:44px;padding-bottom:44px}.clients h2{font-size:36px}.client-logos>.client-logo{height:86px;flex-basis:25%;padding:16px 12px}.client-logo svg{max-height:38px}
 .about{grid-template-columns:1fr;gap:24px;padding-top:36px;padding-bottom:44px}.about-collage{max-width:560px;width:100%;margin:auto;aspect-ratio:1.35;max-height:none}.about h2{font-size:42px}.about-copy{max-width:none}.about-copy>p:not(.eyebrow){font-size:16px}
 .contact{padding-top:44px;padding-bottom:44px}.contact-title{font-size:clamp(46px,8vw,66px)}.contact-bottom{grid-template-columns:1fr;margin-top:28px;gap:16px;padding-top:24px}.contact-bottom>a{font-size:23px}
 footer{padding:36px 24px;display:flex;flex-wrap:wrap}footer nav{width:100%;gap:8px 22px}footer div{gap:24px}footer small{line-height:1.6}
 .cases-main,.story,.case-detail{padding-top:144px}.cases-intro{display:block;margin-bottom:28px}.cases-intro h1,.story h1,.case-heading h1{font-size:clamp(44px,8vw,64px)}.cases-intro p{margin-top:20px}.cases-contact{display:block;margin-top:44px}.cases-contact .archive-button{margin-top:24px}
 .story-intro{grid-template-columns:1fr;gap:24px}.story-prose p{font-size:16px}.story-photo{margin:28px 0 36px}.story-photo img{aspect-ratio:1.3;object-fit:cover}.team-grid{grid-template-columns:1fr 1fr;gap:0 24px}.team-member h3{font-size:27px}.team-member p{font-size:14px}.team-invite{display:block;padding:24px}.team-invite p{margin-bottom:20px}.team-invite .archive-button{font-size:23px}
 .breadcrumbs{margin-bottom:20px}.case-heading dl{gap:32px}.case-cover>span{font-size:21px;right:12px;bottom:12px;padding:12px 16px}.case-actions{flex-wrap:wrap;gap:8px}.project-neighbor strong{font-size:30px}
}
@media(max-width:520px){
 .project-grid{grid-template-columns:1fr}.project:nth-child(n) .project-media{aspect-ratio:1.5}.project-caption{display:flex}.project-caption .project-category{font-size:10px;max-width:95px;margin-top:5px}.project-caption h3>span:not(.standard-e){font-size:15px}.filters{gap:7px}.filters button{font-size:13px;padding:10px 14px}
 .service-studio{grid-template-columns:1fr;gap:28px}.service-studio .service-pillar{display:grid;grid-template-columns:82px minmax(0,1fr);column-gap:18px;text-align:left}.service-mobile-icon{grid-column:1;grid-row:1 / span 4;width:82px;height:78px;margin:0}.service-pillar h3,.service-pillar>p,.production-mobile{grid-column:2}.service-pillar h3.service-title{font-size:32px;margin-bottom:6px}.service-pillar>p.service-subtitle{margin-bottom:12px;font-size:14px}.service-pillar>p{margin-bottom:0}
 .client-logos>.client-logo{flex-basis:calc(100% / 3);height:80px;padding:16px 12px}.client-logo svg{max-height:35px}.clients h2{font-size:34px}
 .team-grid{grid-template-columns:1fr 1fr;gap:0 20px}.team-member h3{font-size:26px}.team-member{padding:18px 0}.archive-button{padding:16px 24px;font-size:23px}
}
@media(prefers-reduced-motion:reduce){.header{transition:none}}

/* Resolve legacy service-grid placement and keep corrected glyphs inline. */
.project-caption h3 .standard-e{display:inline-block;margin-top:0}
@media(max-width:760px){.header .nav-contact{min-height:44px}}
@media(max-width:520px){
 .service-studio .service-pillar h3.service-title{grid-column:2;grid-row:1}
 .service-studio .service-pillar>p.service-subtitle{grid-column:2;grid-row:2}
 .service-studio .service-pillar>p:not(.service-subtitle){grid-column:2;grid-row:3}
 .service-studio .service-pillar>.production-mobile{grid-column:2;grid-row:4}
}
@media(max-width:380px){
 html{scroll-padding-top:172px}
 .header{height:156px}.header nav{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;font-size:13px}.header nav a{justify-content:flex-start}.header .nav-contact{justify-content:center;padding:8px}
 .cases-main,.story,.case-detail{padding-top:188px}
 .team-grid{grid-template-columns:1fr}
}

.header nav>a:nth-child(2){display:inline-flex}

/* Brand treatment keeps the original hover reveal and compact footprint. */
.project-action{background:rgb(237 22 131 / 82%);color:var(--purple);border-radius:0;padding:10px 15px;font:900 18px/1.1 Conduit,'Arial Narrow',sans-serif;letter-spacing:0;clip-path:polygon(3% 0,100% 4%,97% 100%,0 96%);border:0}
@media(max-width:520px){.project-action{font-size:17px;padding:9px 13px}}

/* A single manifesto composition: two supporting voices around the headline. */
.manifesto{background:#e4d7ed;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,1fr);gap:clamp(28px,3.5vw,64px);padding:80px max(var(--gutter),calc((100vw - 1440px)/2));align-items:center}
.manifesto-stage{grid-column:2;grid-row:1;text-align:center}
.manifesto h2{font-size:clamp(38px,3.8vw,58px)}
.manifesto-bottom{display:contents}
.manifesto-bottom p{grid-column:1;grid-row:1;margin:0;max-width:none;color:var(--purple);font-size:16px;line-height:1.75}
.manifesto-bottom p:last-child{grid-column:3;margin:0;color:var(--purple)}
@media(max-width:1000px){
 .manifesto{grid-template-columns:1fr 1fr;gap:32px;padding-top:56px;padding-bottom:56px}
 .manifesto-stage{grid-column:1 / -1;grid-row:1}
 .manifesto-bottom p{grid-column:1;grid-row:2}
 .manifesto-bottom p:last-child{grid-column:2}
}
@media(max-width:600px){
 .manifesto{grid-template-columns:1fr;gap:24px;padding-top:44px;padding-bottom:44px}
 .manifesto h2{font-size:40px}
 .manifesto-bottom p{grid-column:1;grid-row:2}
 .manifesto-bottom p:last-child{grid-column:1;grid-row:3}
}

/* Carry the manifesto background through its torn-paper transition. */
.manifesto{--seam-color:#e4d7ed}
.manifesto>.paper-seam .paper-seam-front{background:#e4d7ed}

.manifesto-bottom p,.manifesto-bottom p:last-child{color:#201825}

/* Monochrome backstage image over the brand ink background. */
.manifesto{background:var(--ink);--seam-color:var(--ink)}
.manifesto::after{content:"";position:absolute;inset:-34px 0 0;z-index:-1;pointer-events:none;background:url('assets/manifesto-bastidores.jpg') center 58% / cover no-repeat;filter:grayscale(1);opacity:.32;clip-path:polygon(0 21px,9% 28px,19% 13.3px,31% 23.8px,42% 4.9px,54% 16.1px,66% 8.4px,77% 22.4px,89% 11.9px,100% 18.2px,100% 100%,0 100%)}
.manifesto>.paper-seam .paper-seam-front{background:var(--ink)}
@media(max-width:800px){.manifesto::after{inset:-24px 0 0;background-position:center;clip-path:polygon(0 16.5px,9% 22px,19% 10.45px,31% 18.7px,42% 3.85px,54% 12.65px,66% 6.6px,77% 17.6px,89% 9.35px,100% 14.3px,100% 100%,0 100%)}}

.manifesto h2,.manifesto-bottom p,.manifesto-bottom p:last-child{color:var(--paper)}
.manifesto h2>span{color:#ee8fbe}
.manifesto .ink-copy h2,.manifesto .ink-copy h2>span{color:var(--paper)}

/* Stronger separation between the photograph and manifesto copy. */
.manifesto h2,.manifesto-bottom p,.manifesto-bottom p:last-child{color:#fff;text-shadow:0 2px 8px #0005}
.manifesto-bottom p,.manifesto-bottom p:last-child{font-size:17px;line-height:1.8}
.manifesto h2>span{color:#f3a1cf}
@media(max-width:600px){.manifesto-bottom p,.manifesto-bottom p:last-child{font-size:16px}}

/* Consistent pink feedback for understated navigation links. */
.back-link,.breadcrumbs a{transition:color 180ms ease,text-decoration-color 180ms ease}
@media(hover:hover){.back-link:hover,.breadcrumbs a:hover{color:var(--pink);text-decoration-color:var(--pink)}}
.back-link:active,.breadcrumbs a:active,.back-link:focus-visible,.breadcrumbs a:focus-visible{color:var(--pink);text-decoration-color:var(--pink)}

/* Footer links: restrained pointer feedback; instant keyboard feedback. */
footer nav a,footer>div a{display:inline-block;transition:color 180ms ease,transform 220ms cubic-bezier(.23,1,.32,1)}
@media(hover:hover) and (pointer:fine){footer nav a:hover,footer>div a:hover{color:var(--pink);transform:translateY(-2px)}}
footer nav a:active,footer>div a:active{color:var(--pink);transform:translateY(0)}
footer nav a:focus-visible,footer>div a:focus-visible{color:var(--pink);transform:none;transition:none}
html[data-input=keyboard] footer nav a,html[data-input=keyboard] footer>div a{transition:none;transform:none}
@media(prefers-reduced-motion:reduce){footer nav a,footer>div a{transition:none;transform:none!important}}

/* Native brand cursors keep system responsiveness and touch behavior intact. */
@media(hover:hover) and (pointer:fine){
 body{cursor:url('assets/cursor-diamond.svg') 12 12,auto}
 :is(a,button,summary,[role="button"],.production-trigger,.reel-tv,.reel-close,.production-mobile summary){cursor:url('assets/cursor-diamond-link.svg') 15 15,pointer}
 input,textarea,[contenteditable="true"]{cursor:text}
 button:disabled,[aria-disabled="true"]{cursor:not-allowed}
}
@media(forced-colors:active){body{cursor:auto}:is(a,button,summary,[role="button"],.production-trigger,.reel-tv,.reel-close,.production-mobile summary){cursor:pointer}}


/* Approved 3D service objects. Original version is saved in backups. */
.services-scene-3d{margin-bottom:24px}
.service-objects{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center}
.service-object{min-width:0;aspect-ratio:1.08;display:flex;align-items:center;justify-content:center}
.services-scene-3d .node-motion,.services-scene-3d .art-front{width:100%;transform-origin:50% 55%}
.service-object img,.service-mobile-icon img{display:block;width:100%;height:auto;pointer-events:none;user-select:none}
.service-object-estrategia img{scale:1.1}
.service-object-criacao img{scale:.79}
.service-object-producao img{scale:.94}
.service-object-performance img{scale:.94}
.services-scene-3d .production-trigger{inset:5% 6%;width:88%;height:95%}
.services-scene-3d .production-badge{bottom:0;font-size:14px;padding:7px 13px}
.services-scene-3d .production-note{z-index:8}
@media(max-width:760px){
 .service-mobile-icon{width:100%;max-width:230px;height:210px;margin:0 auto 14px;display:flex;align-items:center;justify-content:center}
 .service-mobile-icon img{width:100%;height:100%;object-fit:contain}
 .service-studio .service-pillar{text-align:center}
 .service-studio .service-pillar>p{margin-left:auto;margin-right:auto;max-width:30ch}
 .service-studio{row-gap:36px}
}
@media(max-width:520px){
 .service-studio .service-pillar{display:block;text-align:center}
 .service-mobile-icon{width:220px;height:200px;margin:0 auto 12px}
 .service-studio .service-pillar>p:not(.service-subtitle){font-size:16px;line-height:1.65}
 .service-studio .service-pillar>.production-mobile{margin-top:14px}
 .service-studio .service-pillar h3.service-title{margin-bottom:8px}
}
@media(prefers-reduced-motion:reduce){
 .services-scene-3d .node-motion,.services-scene-3d .art-front{transform:none!important}
}


/* A quiet continuous thread connects the four disciplines behind their objects. */
.services-scene-3d{isolation:isolate}
.services-scene-3d>.service-thread{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;overflow:visible}
.service-thread path{fill:none;stroke:#f3a1cf;stroke-width:1.5;vector-effect:non-scaling-stroke;stroke-linecap:round;opacity:.28;transition:opacity 200ms ease}
.service-thread path.is-active{opacity:.7}
@media(max-width:520px){
 .service-studio .service-pillar{position:relative}
 .service-studio .service-pillar:not(:last-child)::after{content:'';position:absolute;bottom:-29px;left:50%;width:20px;height:23px;border-right:1px solid #f3a1cf55;border-radius:50%;transform:translateX(-50%) rotate(15deg);pointer-events:none}
}
@media(prefers-reduced-motion:reduce){.service-thread path{transition:none}}

/* Footer signature aligned to the right. */
footer .footer-tagline{float:right;text-align:right;margin-left:24px}
@media(max-width:520px){footer .footer-tagline{display:block;float:none;margin-left:0;margin-top:8px;text-align:right}}

/* Home cases: heading balanced directly above the cards. */
.work .section-heading{align-items:center;gap:32px;margin-bottom:40px}
.work .section-heading h2{margin:0;max-width:14ch}
.work .section-heading p{margin:0;max-width:30ch}
@media(max-width:760px){.work .section-heading{margin-bottom:28px}.work .section-heading p{margin-top:16px}}

.project-media .wollner-cover-logo{position:absolute;top:50%;left:7%;width:43%;height:auto;transform:translateY(-50%);color:#fff;pointer-events:none;filter:drop-shadow(0 2px 8px #0004)}

/* Experimental client ribbon; previous home saved in backups. */
.brand-ribbon{overflow:hidden;background:#390f50;color:#f4f0e9;padding:52px 0;border-top:2px solid #d50365;border-bottom:1px solid #ffffff18;isolation:isolate}
.brand-ribbon-track{display:flex;width:max-content;animation:brand-ribbon-slide 160s linear infinite;will-change:transform}
.brand-ribbon-group{display:flex;align-items:center;flex-shrink:0;gap:72px;padding-right:72px}
.brand-ribbon .client-logo{display:flex;justify-content:center;align-items:center;flex:0 0 130px;width:130px;height:76px;padding:0;border:0;background:transparent;color:inherit;opacity:1;transform:none}
.brand-ribbon:hover .brand-ribbon-track,.brand-ribbon:focus-within .brand-ribbon-track{animation-play-state:paused}
.brand-ribbon:focus-visible{outline:2px solid #d50365;outline-offset:-4px}
@keyframes brand-ribbon-slide{to{transform:translateX(-50%)}}
@media(max-width:700px){.brand-ribbon{padding:32px 0}.brand-ribbon-group{gap:28px;padding-right:28px}.brand-ribbon .client-logo{flex-basis:112px;width:112px;height:64px}}
@media(prefers-reduced-motion:reduce){.brand-ribbon{overflow-x:auto}.brand-ribbon-track{animation:none;will-change:auto}.brand-ribbon-group[aria-hidden=true]{display:none}}

/* Logos share the manifesto photograph, without a separate color band. */
.manifesto>.brand-ribbon{grid-column:1/-1;grid-row:2;width:100vw;max-width:none;justify-self:center;background:transparent;border:0;padding:30px 0 10px;margin-top:10px;color:#fff;mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent)}
.manifesto>.brand-ribbon .client-logo{flex-basis:160px;width:160px;height:96px}
.manifesto>.brand-ribbon .client-logo svg{transform:scale(1.25);transform-origin:center}
@media(max-width:1000px){.manifesto>.brand-ribbon{grid-row:3}}
@media(max-width:600px){.manifesto>.brand-ribbon{grid-row:4;padding:24px 0 4px;margin-top:8px}.manifesto>.brand-ribbon .client-logo{flex-basis:140px;width:140px;height:80px}.manifesto>.brand-ribbon .client-logo svg{transform:scale(1.15)}}

/* Two continuous rows framing the manifesto. */
.manifesto>.brand-ribbon-top{grid-row:1;margin-top:0;padding:8px 0 24px}
.manifesto>.manifesto-stage{grid-row:2}
.manifesto>.manifesto-bottom p{grid-row:2}
.manifesto>.brand-ribbon-bottom{grid-row:3}
.brand-ribbon .brand-ribbon-track{animation-duration:85s}
.brand-ribbon:hover .brand-ribbon-track,.brand-ribbon:focus-within .brand-ribbon-track{animation-play-state:running}
@media(max-width:1000px){.manifesto>.manifesto-bottom p{grid-row:3}.manifesto>.brand-ribbon-bottom{grid-row:4}}
@media(max-width:600px){.manifesto>.manifesto-bottom p:last-child{grid-row:4}.manifesto>.brand-ribbon-bottom{grid-row:5}.manifesto>.brand-ribbon-top{padding:4px 0 16px}}

.manifesto>.brand-ribbon .client-logo,.manifesto>.brand-ribbon .client-logo:hover{color:#fff;opacity:.4;transition:none}

.brand-ribbon-top .brand-ribbon-track{animation-direction:reverse}

.m2br-mark{display:block;width:112px;height:54px;flex-shrink:0;background:currentColor;mask:url("assets/logo-m2br.png") center/contain no-repeat;-webkit-mask:url("assets/logo-m2br.png") center/contain no-repeat}.manifesto>.brand-ribbon .m2br-mark{width:140px;height:68px}

.client-grid .m2br-mark{color:inherit}

/* Official inDrive symbol and wordmark, from indrive.com. */
.indrive-mark{display:block;width:138px;height:30px;flex-shrink:0;background:currentColor;mask:url("assets/indrive-complete.svg") center/contain no-repeat;-webkit-mask:url("assets/indrive-complete.svg") center/contain no-repeat}
.client-grid .indrive-mark{color:inherit}

/* Official vector client marks; color follows each placement. */
.official-client-mark{display:block;width:130px;height:38px;flex-shrink:0;background:currentColor;mask:var(--client-mark) center/contain no-repeat;-webkit-mask:var(--client-mark) center/contain no-repeat}
.prio-mark{--client-mark:url("assets/logo-prio.svg?v=2")}
.world-mark{--client-mark:url("assets/logo-world.svg")}
.client-grid .official-client-mark{color:inherit}

/* Match the existing SVG hover motion for vector-mask logos in the client grid. */
.client-grid .client-logo :is(.official-client-mark,.indrive-mark,.m2br-mark){transition:transform 220ms var(--ease-out);max-width:100%}
@media(hover:hover) and (pointer:fine){.client-grid .client-logo:hover :is(.official-client-mark,.indrive-mark,.m2br-mark){transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.client-grid .client-logo :is(.official-client-mark,.indrive-mark,.m2br-mark){transition:none}.client-grid .client-logo:hover :is(.official-client-mark,.indrive-mark,.m2br-mark){transform:none}}
.loreal-mark{--client-mark:url("assets/logo-loreal.svg?v=2")}
.supermarket-mark{--client-mark:url("assets/logo-supermarket-flat.svg");width:96px;height:74px}
.light-mark{--client-mark:url("assets/logo-light.png");width:112px;height:42px}

/* Balance tall symbols and wide wordmarks by visual area, without stretching. */
.client-grid .client-logo svg,.manifesto>.brand-ribbon .client-logo svg{max-height:72px;max-width:100%;flex-shrink:0}
.manifesto>.brand-ribbon .client-logo svg{transform:none}
.client-logos>.client-logo{height:116px;padding:20px 14px}
@media(max-width:600px){.client-logos>.client-logo{height:100px;padding:14px 10px}.client-grid .client-logo svg{max-height:64px;max-width:100%}.manifesto>.brand-ribbon .client-logo svg{max-height:68px;max-width:130px;transform:none}}

.project-media img.prio-card-logo{position:absolute;top:10%;left:0;right:0;margin-inline:auto;width:25%;max-width:250px;height:auto;aspect-ratio:auto;object-fit:contain;filter:brightness(0) invert(1);z-index:2;transform:none;pointer-events:none}
.project-media img.light-card-logo{position:absolute;inset:0;margin:auto;width:30%;max-width:240px;height:auto;aspect-ratio:auto;object-fit:contain;filter:brightness(0) invert(1) drop-shadow(0 2px 12px #0005);z-index:2;transform:none;pointer-events:none}

.project-media .colorama-card-photos{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden}.project-media .colorama-card-photos img{position:static;width:100%;height:100%;object-fit:cover;object-position:center;min-width:0}.project-media img.colorama-card-logo{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)!important;width:30%;max-width:280px;height:auto;object-fit:contain;filter:brightness(0) invert(1) drop-shadow(0 2px 5px #0008);z-index:2}

.project-media img.colorama-card-logo{filter:grayscale(1) invert(1);mix-blend-mode:screen}

.project-media img.supermarket-card-logo{position:absolute;top:7%;right:6%;left:auto;width:22%;height:24%;object-fit:contain;object-position:center;filter:brightness(0) invert(1);z-index:2;transform:none!important}

.official-client-mark.abic-mark{display:block;width:112px;height:70px;background:currentColor;mask:url("assets/logo-abic.svg") center/contain no-repeat;-webkit-mask:url("assets/logo-abic.svg") center/contain no-repeat}

.project-media img.abic-card-logo{position:absolute;left:50%;top:50%;width:38%;height:auto;transform:translate(-50%,-50%)!important;object-fit:contain;filter:brightness(0) invert(1);z-index:2}