.about-fixed { position: fixed; left: 16px; right: 16px; top: 92px; z-index: 2147483646; pointer-events: none; mix-blend-mode: difference; }
.about-fixed-art { display: block; width: 100%; height: auto; filter: invert(1); clip-path: inset(0 75% 0 0); transform: scale(.75); transform-origin: top left; }
.about-fixed-intro-art { position: absolute; top: 0; bottom: 0; left: 26.9900922446%; width: 31.5%; background: url('assets/work/47.png') no-repeat; background-size: calc(var(--about-art-width, calc(100vw - 32px)) * .75) auto; background-position: calc(var(--about-art-width, calc(100vw - 32px)) * -.269900922446 * .75) 0; filter: invert(1); }
.about-fixed-contact-art { position: absolute; top: 0; bottom: 0; left: var(--contact-left, 75.2%); right: 0; background: url('assets/work/47.png') no-repeat; background-size: calc(var(--about-art-width, calc(100vw - 32px)) * .75) auto; background-position: calc(var(--about-art-width, calc(100vw - 32px)) * -.8356679194 * .75) 0; filter: invert(1); }
.about-fixed-mobile { display: none; }
@media (max-width: 900px) {
  .about-fixed { left: 12px; right: 12px; }
}
@media (max-width: 700px) {
  .about-fixed { left: 12px; right: 12px; top: 64px; }
  .about-fixed-art { display: none; }
  .about-fixed-intro-art, .about-fixed-contact-art { display: none; }
  .about-fixed-mobile { display: grid; grid-template-columns: minmax(0, calc(var(--contact-left, 65%) - 12px)); gap: 12px; color: #fff; font-size: clamp(8.25px, 2.1vw, 11.25px); line-height: 1.1; font-weight: 700; letter-spacing: -.025em; }
  .about-fixed-mobile h1 { grid-column: 1 / -1; margin: 0; font-size: inherit; }
  .about-fixed-mobile p { margin: 0; }
  .about-fixed-mobile .about-contact { position: absolute; top: 0; left: var(--contact-left, 65%); right: 0; overflow-wrap: anywhere; }
}