.project-visual{position:relative;overflow:hidden;isolation:isolate;background:#17171a}
.project-visual::after{content:attr(data-mark);position:absolute;right:12px;bottom:10px;z-index:4;font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;color:rgba(255,255,255,.68)}
.visual-trades{background:radial-gradient(circle at 82% 18%,rgba(255,255,255,.22),transparent 23%),linear-gradient(135deg,#2c48dd,#4f6cff)}
.visual-trades .browser{position:absolute;left:12%;top:16%;width:76%;height:68%;padding:17% 9% 8%;background:#f4f2eb;box-shadow:0 18px 40px rgba(0,0,0,.24)}
.visual-trades .browser::before{content:'●  ●  ●';position:absolute;top:7%;left:6%;color:#3b5bff;font-size:6px;letter-spacing:3px}
.visual-trades .browser strong{display:block;color:#0a0a0b;font-size:clamp(12px,1.35vw,24px);line-height:.9;letter-spacing:-.05em;text-transform:uppercase}
.visual-trades .browser i{display:block;width:42%;height:7px;margin-top:12%;background:#3b5bff}
.visual-hospitality{background:linear-gradient(rgba(10,10,11,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(10,10,11,.07) 1px,transparent 1px),#efede4;background-size:24px 24px}
.visual-hospitality .identity{position:absolute;inset:12%;display:flex;align-items:center;justify-content:center;border:1px solid rgba(10,10,11,.18);color:#0a0a0b}
.visual-hospitality .identity strong{font-size:clamp(26px,4.5vw,72px);line-height:1;letter-spacing:-.08em}
.visual-hospitality .identity span{position:absolute;top:10%;right:8%;width:18%;aspect-ratio:1;border-radius:50%;background:#3b5bff}
.visual-retail{background:linear-gradient(145deg,#111114 0 58%,#3b5bff 58%)}
.visual-retail .products{position:absolute;inset:13%;display:grid;grid-template-columns:repeat(3,1fr);gap:6%}
.visual-retail .products span{position:relative;background:#efede4;box-shadow:0 14px 30px rgba(0,0,0,.2)}
.visual-retail .products span::before{content:'';position:absolute;top:13%;left:14%;right:14%;height:54%;background:linear-gradient(160deg,#dedbd0,#aaa79d)}
.visual-retail .products span:nth-child(2)::before{background:linear-gradient(160deg,#6c7fff,#2a43c6)}
.visual-retail .products span::after{content:'';position:absolute;left:14%;right:28%;bottom:15%;height:4px;background:#0a0a0b}
.work-grid-section{padding:88px 6vw 120px;background:#fff;color:var(--ink-on-paper)}
.work-grid-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:38px;padding-bottom:22px;border-bottom:1px solid rgba(10,10,11,.14)}
.work-grid-heading .eyebrow{margin:0}
.work-grid-heading p{color:var(--ink-on-paper-dim);font-size:15px}
.clean-project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:54px 24px}
.clean-project-card{min-width:0}
.clean-project-card .project-visual{width:100%;aspect-ratio:4/3;border-radius:4px;transition:transform .45s var(--ease),filter .45s var(--ease)}
.clean-project-card:hover .project-visual{transform:translateY(-3px);filter:brightness(1.035)}
.clean-project-copy{padding-top:18px}
.clean-project-copy h2{font-size:clamp(20px,1.8vw,28px);line-height:1.12;letter-spacing:-.025em}
.clean-project-copy p{margin-top:7px;color:var(--ink-on-paper-dim);font-family:var(--font-mono);font-size:12px;line-height:1.5;letter-spacing:.05em;text-transform:uppercase}
@media(max-width:1050px){.clean-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
  .work-grid-section{padding:68px 6vw 84px}
  .work-grid-heading{align-items:flex-start;flex-direction:column;margin-bottom:28px}
  .clean-project-grid{grid-template-columns:1fr;gap:42px}
  .clean-project-card .project-visual{aspect-ratio:16/11}
}
