/* Source-owned diagrams describe project scope, without invented client data. */
.project-art.art-illustrated { position: relative; width: 100%; height: 100%; min-height: 0; overflow: hidden; background: var(--art-bg,#deebe4); color: #29423d; }
.art-illustrated .art-layer { position: absolute; inset: 0; }
.project-illustration { display: block; width: 100%; height: 100%; }
.project-illustration text { font-family: Poppins, sans-serif; }
.illustration-float, .illustration-accent { transform-box: fill-box; transform-origin: center; transition: translate 500ms cubic-bezier(.22,1,.36,1), rotate 500ms, scale 500ms; }
.illustration-signal { opacity: .45; }
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
 :is(.project-link,.case-frame):is(:hover,:focus-visible) .illustration-float { translate: 0 -7px; rotate: -.6deg; }
 :is(.project-link,.case-frame):is(:hover,:focus-visible) .illustration-accent { translate: 5px -11px; rotate: 2deg; }
 :is(.project-link,.case-frame):is(:hover,:focus-visible) .illustration-signal { animation: illustration-signal 1500ms ease-in-out infinite; }
 :is(.project-link,.case-frame):is(:hover,:focus-visible) .illustration-flow { stroke-dasharray: 7 9; animation: illustration-flow 1400ms linear infinite; }
}
@keyframes illustration-flow { to { stroke-dashoffset: -32; } }
@keyframes illustration-signal { 50% { opacity: 1; } }
.work-preview { padding: 4.5rem 4%; background: #fff; color: #3c3c3c; }
.work-preview > h5 { margin-bottom: 3.2rem; }
.preview-work-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: clamp(22px,2.6vw,38px); max-width: 1260px; margin: 0 auto; text-align: left; }
.portfolio-card { min-width: 0; }
.portfolio-card .project-link { display: flex; flex-direction: column; height: 100%; padding: 12px 12px 20px; border-radius: 26px; color: inherit; text-decoration: none; transition: translate 300ms cubic-bezier(.22,1,.36,1), background 300ms, box-shadow 300ms; }
.portfolio-card .project-link:is(:hover,:focus-visible) { translate: 0 -5px; background: #fff; box-shadow: 0 12px 34px #18383114, 0 0 0 1px #1838310a; }
.portfolio-card .project-link:focus-visible { outline: 2px solid var(--brand-primary); outline-offset: 3px; }
.preview-work-visual { aspect-ratio: 1.62; border-radius: 20px; overflow: hidden; }
.preview-work-caption { margin: 18px 4px 8px; }
.preview-work-caption h3 { margin: 0; font-family: futura,sans-serif; font-size: 2.1rem; font-weight: 500; line-height: 1.3; }
.portfolio-card p { margin: 0 4px; font: 400 1.25rem/1.65 Poppins,sans-serif; color: #707070; }
.work-preview .case-study-action { margin-top: 2.5rem; }
.work-preview .work-discovery-link { font-size: 1.8rem; }
.work-preview .work-discovery-label { transition: color 200ms, translate 200ms; }
.work-preview .work-discovery-link:is(:hover,:focus-visible) .work-discovery-label { color: #008d7e; translate: 0 -2px; }
@media (max-width:767px) {
 .work-preview { padding: 4rem 2.5rem; }
 .preview-work-grid { grid-template-columns: minmax(0,1fr); max-width: 480px; gap: 24px; }
 .preview-work-visual { aspect-ratio: 1.65; }
 .preview-work-caption h3 { font-size: 2.5rem; }
 .portfolio-card p { font-size: 1.6rem; }
}
@media (prefers-reduced-motion:reduce) {
 .illustration-float, .illustration-accent, .portfolio-card .project-link, .work-preview .work-discovery-label { transition: none; }
 .portfolio-card .project-link:is(:hover,:focus-visible), .work-preview .work-discovery-link:is(:hover,:focus-visible) .work-discovery-label { translate: none; }
 .project-illustration * { animation: none !important; }
}