
.grid{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));column-gap:var(--gutter)}
.c-text,.c-media{grid-column:1/-1}
@media (min-width:1024px){.c-text{grid-column:1/span 5}.c-media{grid-column:6/span 7}}
.chap{padding-block:var(--sp-7)}
@media (min-width:1024px){.chap{padding-block:var(--sp-8)}}
.h2{margin:0;max-width:20ch;font:var(--w-h1) var(--t-sec)/1 var(--sans);letter-spacing:-.03em;text-wrap:balance}
.intro{max-width:var(--measure-body);margin:var(--sp-3) 0 0}
.more{margin:var(--sp-6) 0 0}
.chap img{display:block;max-width:100%;height:auto}
.work{background:var(--papel)}
.work .sub,.work .cap{color:var(--cinza-esc)}
.cases{margin-top:var(--sp-7);row-gap:var(--sp-8)}
.case{position:relative;display:flex;flex-direction:column;gap:var(--sp-2);grid-column:1/-1;min-width:0}
.case>figure{margin:0 0 var(--sp-2)}
.case .pmfig{display:grid;gap:var(--sp-2)}
.case .nm{margin:0;max-width:30ch;font:500 var(--t-lede)/1.2 var(--sans);letter-spacing:-.02em;text-wrap:pretty}
.case .prob{margin:0;max-width:52ch;color:var(--cinza-esc);text-wrap:pretty}
.pm.pm-pic{position:relative;overflow:hidden;padding:0;background:var(--papel-2)} 
.pm.pm-pic img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.pm.pm-pic.pm-r-2x1{aspect-ratio:2/1}
.pm.pm-pic.pm-r-16x9{aspect-ratio:16/9}
.pm.pm-pic.pm-r-4x5{aspect-ratio:4/5}
.pm.pm-pic.pm-r-1x1{aspect-ratio:1}
.tag{display:inline-block;padding:0 var(--sp-2);border:1px solid var(--linha);font:var(--w-mono) var(--t-mono)/1.6 var(--mono);letter-spacing:var(--ls-mono)}
.tag.built::before,.tag.disc::before{content:"";display:inline-block;width:8px;height:8px;margin-right:6px;border-radius:50%;vertical-align:-1px}
.tag.built::before{background:currentColor}
.shu-x .tag.built.shu-on::before{background:var(--shu)}
@media (prefers-reduced-motion:no-preference){.tag.built::before{transition:background-color var(--dur-fill) ease-out}}
.tag.disc::before{border:1.5px solid currentColor}
.nm .case-link{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-decoration-color:var(--tinta);text-decoration-thickness:2px;text-underline-offset:.2em}
.case-link{color:var(--tinta);text-decoration:none}
.case-link::after{content:"";position:absolute;inset:0}
.case-link:hover{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:.2em}
.case-link:focus-visible{outline:none}
.case-link:focus-visible::after{outline:3px solid var(--shu-esc);outline-offset:4px}
.duo,.shot{margin:0;display:grid;gap:var(--sp-2);align-content:start}
.duo-in{position:relative;aspect-ratio:16/10}
.scr{position:absolute;left:0;top:0;width:76%;height:84%;border-radius:var(--r-screen);overflow:hidden;background:var(--papel-2)}
.scr img{width:100%;height:100%;object-fit:cover;object-position:top left}
.phone{position:absolute;right:0;bottom:0;height:96%;aspect-ratio:584/1126;border:4px solid var(--tinta);border-radius:22px;overflow:hidden;background:var(--papel-2)}
.phone img{width:100%;height:100%;object-fit:cover;object-position:top}
.cap{max-width:46ch;font-size:var(--t-cap);line-height:1.4}
.meta{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-5);margin:0;font-size:var(--t-cap);line-height:1.4}
.meta div{display:flex;gap:var(--sp-2);align-items:baseline}
.meta dt{color:var(--cinza-esc)}
.meta dd{margin:0}
.shot-in{aspect-ratio:16/10;overflow:hidden;border-radius:var(--r-screen);border:1px solid var(--linha);background:var(--papel-2)}
.shot-in img{width:100%;height:100%;object-fit:cover;object-position:top left}
@media (min-width:1024px){
  .case{grid-column:span 6}
  .cases{column-gap:min(var(--sp-8),calc((100% - var(--cols) * var(--sp-3)) / (var(--cols) - 1)))} 
  .case .duo,.case .shot{grid-template-rows:auto 2.8em}
}
.svc{background:var(--shu);color:var(--tinta)}
.svc :focus-visible{outline-color:var(--tinta)}
.svc .pending-tag{border-color:var(--tinta);color:var(--tinta)}
.sprite{position:absolute}
.svc{padding-block:var(--sp-6)}
@media (min-width:1024px){.svc{padding-block:var(--sp-7)}}
.svc-list{list-style:none;margin:var(--sp-5) 0 0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);column-gap:var(--sp-6)}
.svc-list li{display:flex;flex-direction:column;align-items:flex-start;gap:var(--sp-3);padding-block:var(--sp-4);border-top:2px solid var(--tinta)}
@media (min-width:640px){.svc-list{grid-template-columns:repeat(2,minmax(0,1fr))}.svc-list li{padding-block:var(--sp-5)}}
.obj3d{width:100%;max-width:170px;aspect-ratio:88/66;perspective:900px}
.rig{position:relative;width:100%;height:100%;transform-style:preserve-3d;transform:rotateX(16deg) rotateY(-22deg)}
.rig svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.rig .l3,.rig .l2,.rig .l1{fill:color-mix(in srgb,var(--tinta) 32%,var(--shu));color:transparent}
.rig .l3{transform:translateZ(-27px)}
.rig .l2{transform:translateZ(-18px)}
.rig .l1{transform:translateZ(-9px)}
.rig .l0{fill:var(--tinta);color:transparent}
.rig .ld{transform:translateZ(36px);fill:transparent;color:var(--papel)}
@keyframes turn{from{transform:rotateX(16deg) rotateY(28deg)}to{transform:rotateX(16deg) rotateY(-28deg)}}
@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){.rig{animation:turn linear both;animation-timeline:view()}}}
.svc .name{margin:0;font:var(--w-display) clamp(2rem,1.4rem + 1.9vw,3.25rem)/.95 var(--sans);letter-spacing:var(--ls-display)}
.svc-text{margin:0;max-width:34ch;text-wrap:pretty}
.svc .proof{margin-top:auto;color:var(--tinta);min-height:44px;display:inline-flex;align-items:center}
.svc a.proof{text-underline-offset:.2em}
.pf{background:var(--branco);color:var(--tinta)}
.pf :focus-visible{outline-color:var(--shu-esc)}
.pf .pending-tag{border-color:var(--cinza-esc);color:var(--cinza-esc)}
.buy{row-gap:var(--sp-6)}
.buy h2{margin:0 0 var(--sp-4);font:var(--w-h1) var(--t-case)/1.15 var(--sans);letter-spacing:-.02em}
.price-lead{margin:0 0 var(--sp-4);max-width:24ch;font:500 var(--t-lede)/1.25 var(--sans);letter-spacing:-.01em}
.price-scope{margin:0;max-width:34ch;text-wrap:pretty} 
.price-scope .amt{font-weight:var(--w-h1);white-space:nowrap}
.price-vat{margin:var(--sp-2) 0 0;font-size:var(--t-small);line-height:var(--lh-small);color:var(--cinza-esc)}
.faq details{border-top:1px solid var(--linha)}
.faq details:last-child{border-bottom:1px solid var(--linha)}
.faq summary{display:flex;justify-content:space-between;gap:var(--sp-3);min-height:44px;padding-block:var(--sp-3);cursor:pointer;list-style:none;font:400 var(--t-lede)/1.25 var(--sans)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-weight:300}
.faq details[open] summary::after{content:"\2013"}
.faq summary:hover{text-decoration:underline}
.faq details p{margin:0;padding-bottom:var(--sp-3);color:var(--cinza-esc)}
.contact{background:var(--papel);padding-block:var(--sp-6)}
@media (min-width:1024px){.contact{padding-block:var(--sp-7)}}
.contact .big{margin:0;max-width:16ch;font:var(--w-display) clamp(2rem,1.4rem + 1.9vw,3.25rem)/.95 var(--sans);letter-spacing:var(--ls-display);text-wrap:balance}
.contact .more{margin-top:var(--sp-4)}
.chap h2.ttl{margin-inline:auto}
.titles-right .chap h2.ttl{margin-inline:auto 0}
.chap .buy h2.ttl,.titles-right .chap .buy h2.ttl{margin-inline:0;text-align:left}
.chap .buy h2.ttl::after,.titles-right .chap .buy h2.ttl::after{margin-inline:0}
.contact .wrap{text-align:center}
.contact .intro{margin-inline:auto}
.titles-right .contact .wrap{text-align:right}
.titles-right .contact .intro{margin-inline:auto 0}
