/* Responsive layout values from the current Figma Design page. */
.brands{padding-block:32px 40px}
.expertise{padding-block:80px}
.section-intro h2{margin-top:16px}
.section-intro .lead{max-width:503px;margin-top:16px}
.services{margin-top:80px}
.service{--art-width:354px;display:grid;grid-template-columns:minmax(220px,312px) minmax(0,580px) minmax(var(--art-width),1fr);grid-template-areas:"title detail art";align-items:center;gap:0;padding:32px 0;border:0}
.service:first-child{--art-width:346px}
.service:not(:last-child){border-bottom:1px dashed transparent}
.service h3{grid-area:title;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:8px;padding-right:32px;font-size:28px;line-height:36px;letter-spacing:-.28px;font-weight:700}
.service-number{font-size:inherit;line-height:inherit;color:var(--quiet)}
.service-detail{grid-area:detail;padding-right:32px}
.service+.service{border-top:0}
.service h4{font-size:18px;line-height:26px;color:var(--accent);font-weight:800;margin-bottom:8px}
.service-detail .tags{margin-top:16px}
.service .tags li{color:var(--quiet)}
.service-illustration{grid-area:art;justify-self:end;position:relative;width:var(--scene-width);max-width:100%;aspect-ratio:var(--scene-ratio);flex:none;contain:layout style}
.illustration-scene{transform-origin:0 0;pointer-events:none}
.illustration-scene img,.illustration-scene svg{display:block}
.studio-shell{width:100%;max-width:1440px;margin:auto;padding-inline:16px}
.studio{width:100%;max-width:none;padding:96px 80px;grid-template-columns:440px minmax(0,1fr);gap:48px;background:var(--surface);border-radius:16px;border:0}
.studio .designer{justify-content:flex-start;gap:20px}
.studio .identity{flex:none}
.studio .identity h3{font-size:28px;line-height:36px;letter-spacing:-.28px;font-weight:700}
.studio .identity p{font-size:14px;line-height:20px;color:var(--quiet);font-weight:800;margin-top:4px}
.studio .approach h3{margin-bottom:12px}
.studio .tools{border-top:1px dashed var(--line)}
.recommendations .quote-stage{height:220px;min-height:220px;margin:0 auto 32px;overflow:hidden}
.recommendation{height:250px;gap:24px}
.recommendation blockquote{font-size:22px;line-height:32px;letter-spacing:0}
.recommendation figcaption{gap:0}
.recommendation strong{font-size:16px;line-height:28px;font-weight:600}
.recommendation figcaption span{font-size:12px;line-height:22px;color:var(--quiet)}
.quote-controls{height:20px;min-height:20px;gap:16px}
.quote-dot{height:20px;width:6px;position:relative}
.quote-dot::after{content:"";position:absolute;inset:-12px -8px}
.contact-invitation .lead{margin-top:16px}
.privacy-note{display:flex;flex-direction:column;gap:4px;align-items:center}
.privacy-note .text-button{color:var(--text)}
.footer{border-color:transparent}
#privacy-dialog{padding:24px;color:var(--quiet);max-width:560px;border-radius:16px;box-shadow:0 20px 80px #0009;max-height:calc(100svh - 32px);overflow:auto}
#privacy-dialog .dialog-heading{height:40px;margin:0 0 24px;gap:16px}
#privacy-dialog h2{font-size:28px;line-height:36px;letter-spacing:-1.12px;font-weight:800}
#privacy-dialog .dialog-body{display:flex;flex-direction:column;gap:16px}
#privacy-dialog p{font-size:14px;line-height:22px;margin:0}
#privacy-dialog .dialog-close{flex:none;display:flex;align-items:center;justify-content:center;color:var(--quiet)}
@media(max-width:1439px) and (min-width:1101px){.studio{grid-template-columns:minmax(320px,35.3%) 1fr}}
@media(max-width:1100px){
.expertise{padding-block:48px}.services{margin-top:48px}
.service{display:flex;flex-direction:column;align-items:stretch;gap:24px}
.service h3{flex-direction:row;justify-content:flex-start;align-items:center;gap:16px;padding:0;order:0}
.service-illustration{align-self:center;order:1}.service-detail{order:2;padding:0}
.studio{padding:96px 48px;grid-template-columns:1fr;gap:48px}
.recommendations .quote-stage{height:250px;min-height:250px}
}
@media(max-width:600px){
.expertise{padding-block:24px}.services{margin-top:24px}
.section-intro h2{margin-top:8px}.section-intro .lead{margin-top:16px}
.service h3{font-size:24px;line-height:32px;letter-spacing:-.24px}
.service-illustration{align-self:flex-start;width:min(100%,var(--scene-width))}
.studio{padding:64px 24px;gap:32px}
.recommendations h2{margin-top:8px}
.recommendations .quote-stage{height:260px;min-height:260px}
.recommendation{height:260px}
.contact{gap:48px}.contact-invitation .lead{margin-top:16px}
}

#privacy-title:focus{outline:none}
#privacy-dialog .dialog-close{border:0;outline:none;box-shadow:none;-webkit-tap-highlight-color:transparent;transition:background-color .16s ease}
#privacy-dialog .dialog-close:focus-visible{outline:2px solid #ff89cb;outline-offset:4px}
#privacy-dialog .dialog-close img{transition:filter .16s ease}
@media(hover:hover) and (pointer:fine){
  #privacy-dialog .dialog-close:hover{background:var(--line)}
  #privacy-dialog .dialog-close:hover img{filter:brightness(1.5)}
}
#privacy-dialog .dialog-close:active{background:var(--line)}
#privacy-dialog .dialog-close:active img{filter:brightness(1.5)}