.clients-intro{padding-top:76px;padding-bottom:70px}
.clients-intro h1{font-size:clamp(48px,6vw,86px);line-height:1.02;letter-spacing:-.055em;margin-top:25px;max-width:1100px}
.clients-intro h1 span{color:var(--green)}
.clients-intro-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:50px;margin-top:35px}
.clients-intro-bottom>p{max-width:410px;font-size:15px;color:var(--muted);line-height:1.8}
.clients-shortcuts{display:flex;gap:30px;flex-wrap:wrap}
.clients-page .work-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:42px 30px}
.clients-page .project-visual{height:350px}
.clients-page .project-della h3{font-size:75px}
.clients-page .project-depaula h3{font-size:56px}
.clients-page .project-soet h3{font-size:105px}
.clients-page .produce-label{width:230px;padding:39px 16px 32px}
.clients-page .produce-label h3{font-size:39px}
.clients-page .project-info h3{font-size:18px}
.clients-page .project-info p{font-size:13px;max-width:430px}
.clients-page .voices{padding-top:100px;padding-bottom:90px}
.clients-contact{padding:75px 0 80px;background:var(--yellow)}
.clients-contact h2{margin-top:24px;max-width:700px}
.clients-contact .btn{margin-top:30px}
@media(max-width:1000px){.clients-intro-bottom{display:block}.clients-shortcuts{margin-top:22px}.clients-page .project-visual{height:310px}.clients-page .project-della h3{font-size:62px}.clients-page .project-depaula h3{font-size:47px}}
@media(max-width:600px){.clients-intro{padding-top:44px;padding-bottom:45px}.clients-intro h1{font-size:clamp(42px,10vw,60px);margin-top:20px}.clients-intro-bottom{margin-top:24px}.clients-intro-bottom>p{font-size:14px}.clients-shortcuts{gap:10px 24px}.clients-shortcuts .text-link{font-size:12px;gap:16px}.clients-page .work-grid{grid-template-columns:1fr;gap:34px}.clients-page .project-visual{height:300px}.clients-page .project-della h3{font-size:62px}.clients-page .project-depaula h3{font-size:48px}.clients-page .project-soet h3{font-size:96px}.clients-page .produce-label{width:220px}.clients-page .produce-label h3{font-size:36px}.clients-page .project-info p{font-size:12px}.clients-page .voices{padding-top:65px;padding-bottom:60px}.clients-contact{padding:55px 0}.clients-contact h2{font-size:44px}}

/* The Instagram icon and arrow share one keyboard-accessible link. */
.project-instagram{display:inline-flex;align-items:center;justify-content:center;gap:11px;flex-shrink:0;width:68px;min-width:68px;height:44px;min-height:44px;align-self:flex-start;white-space:nowrap;margin-top:-9px;color:var(--cream);border-radius:4px;transition:color 180ms}
.project-instagram .instagram-arrow{display:block;width:68px;height:28px;flex:none;stroke:currentColor;stroke-width:1.9}
.project-instagram:hover{color:var(--yellow)}
.project-instagram:focus-visible{outline:2px solid var(--yellow);outline-offset:4px}
.clients-page .project-info>div{min-width:0}
@media(prefers-reduced-motion:reduce){.project-instagram{transition:none}}
.motion-paused .project-instagram{transition:none}

/* Fotos reais: horizontais na diagonal, retratos com proporção preservada. */
.clients-page .work-grid{align-items:start;gap:32px clamp(30px,6vw,96px)}
.clients-page .project{min-width:0;width:100%}
.clients-page .project-portrait{width:68%;max-width:380px}
.clients-page .project-portrait:nth-child(2){justify-self:end}
.clients-page .project-portrait:nth-child(3){justify-self:start}
.clients-page .project-photo{height:auto;background:transparent;border-radius:8px;overflow:hidden}
.clients-page .project-photo img{display:block;width:100%;height:auto}
@media(max-width:600px){
 .clients-page .work-grid{gap:32px}
 .clients-page .project-portrait{width:84%;max-width:340px;justify-self:center!important}
}

/* Quatro fotos em torno de uma área central para a câmera. */
.clients-camera{width:100%;max-width:220px;justify-self:center;align-self:center;color:var(--cream);pointer-events:none}
.clients-camera svg{display:block;width:100%;height:auto;overflow:visible}
.clients-camera .camera-accent{stroke:var(--yellow)}
@media(min-width:601px){
 .clients-page .work-grid{--photo-gap:clamp(30px,6vw,96px);grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:auto 180px auto;gap:32px 0}
 .clients-page .project-landscape{width:calc(100% - var(--photo-gap)/2)}
 .clients-page .project-portrait{width:calc(102% - var(--photo-gap)*.34);max-width:380px}
 .clients-page .project:nth-child(1){grid-area:1/1/2/4;align-self:start}
 .clients-page .project:nth-child(2){grid-area:1/5/3/7;align-self:start;justify-self:end}
 .clients-page .project:nth-child(3){grid-area:2/1/4/3;align-self:start;justify-self:start}
 .clients-page .project:nth-child(4){grid-area:3/4/4/7;align-self:start;justify-self:end}
 .clients-camera{grid-area:2/3/3/5}
}
@media(max-width:600px){.clients-camera{max-width:150px;margin:0 auto}}
