@media (min-width: 810px) and (hover: hover) and (pointer: fine) {
  #main .framer-wbGfx a[data-portfolio-preview] {
    background-color: transparent !important;
    transition: background-color 200ms ease;
  }
  #main .framer-wbGfx a[data-portfolio-preview]:hover,
  #main .framer-wbGfx a[data-portfolio-preview]:focus-visible {
    background-color: rgba(33, 36, 49, .055) !important;
  }
  #main .framer-wbGfx a[data-portfolio-preview]:focus-visible {
    outline: 2px solid #212431;
    outline-offset: -2px;
  }
  #main .framer-wbGfx a[data-portfolio-preview] .framer-f1mklf {
    transition: translate 240ms cubic-bezier(.22, 1, .36, 1);
  }
  #main .framer-wbGfx a[data-portfolio-preview]:hover .framer-f1mklf,
  #main .framer-wbGfx a[data-portfolio-preview]:focus-visible .framer-f1mklf {
    translate: 6px 0;
  }
}
.portfolio-project-preview {
  position: fixed;
  left: 0;
  top: 0;
  width: clamp(240px, 25vw, 340px);
  aspect-ratio: 4 / 3;
  z-index: 20;
  pointer-events: none;
  opacity: 0;
  transition: opacity 180ms ease;
  will-change: transform;
}
/* Project detail hero: title, description and metadata share the left column. */
#main .framer-wd55z{--portfolio-project-section-gap:160px}
#main .framer-wd55z .framer-1dsf731{gap:24px!important}
.portfolio-project-return{display:inline-flex;align-items:center;align-self:flex-start;gap:10px;min-height:44px;padding:10px 0;border:0;background:transparent;box-shadow:none;color:#212431;text-decoration:none;font:500 11px/1.4 "Roboto Mono",monospace;text-transform:uppercase;transition:color 180ms ease,opacity 140ms ease,transform 140ms ease;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.portfolio-project-return>span:first-child{font-size:18px;transition:transform 220ms cubic-bezier(.22,1,.36,1)}
.portfolio-project-return:hover{color:#4f5d75}
.portfolio-project-return>span:last-child{text-decoration-line:underline;text-decoration-color:transparent;text-underline-offset:5px;transition:text-decoration-color 180ms ease}
.portfolio-project-return:hover>span:last-child{ text-decoration-color:currentColor }
.portfolio-project-return:hover>span:first-child{transform:translateX(-3px)}
.portfolio-project-return:focus-visible{outline:2px solid currentColor;outline-offset:4px}
html[data-portfolio-theme=frosted] .portfolio-project-return{font-family:"Portfolio Mono",monospace;color:#fab387}
html[data-portfolio-theme=frosted] .portfolio-project-return:hover{color:#f5c2e7}
html[data-portfolio-theme=tactile] .portfolio-project-return{font-family:"Portfolio Plex",monospace;color:#ebdbb2}
html[data-portfolio-theme=tactile] .portfolio-project-return:hover{color:#d79921}
.portfolio-project-return:active{transform:translateY(1px) scale(.97);opacity:.65}
.portfolio-project-return:active>span:first-child{transform:translateX(-5px)}
@media(prefers-reduced-motion:reduce){.portfolio-project-return,.portfolio-project-return>span:first-child{transition:none}}
#main .framer-wd55z .framer-1urho9m{height:auto!important;min-height:0!important;padding-bottom:0!important;gap:var(--portfolio-project-section-gap)!important}
#main .framer-wd55z .framer-1409o2i{display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;height:auto!important;min-height:0!important;gap:24px!important}
#main .framer-wd55z .framer-1409o2i{align-self:stretch!important}
#main .framer-wd55z .framer-umq7yu{display:flex!important;flex-direction:column!important;width:100%!important;max-width:420px;height:auto!important;flex:none!important;gap:24px!important;margin-top:auto!important;padding:0!important}
#main .framer-wd55z .framer-umq7yu>:is([data-framer-name="Duration"],[data-framer-name="Client"]){display:flex!important;flex-direction:row!important;justify-content:space-between!important;width:100%!important;min-width:0!important;height:auto!important;align-items:flex-start!important;gap:24px!important}
#main .framer-wd55z .framer-umq7yu>:is([data-framer-name="Duration"],[data-framer-name="Client"])>div:last-child{min-width:0;max-width:70%}
#main .framer-wd55z .framer-umq7yu .framer-text{white-space:normal!important;overflow-wrap:anywhere}
@media(min-width:810px) and (max-width:1199.98px){
 #main .framer-wd55z{--portfolio-project-section-gap:120px}
}
@media(max-width:809.98px){
 #main .framer-wd55z .framer-1dsf731{gap:20px!important}
 #main .framer-wd55z{--portfolio-project-section-gap:96px}
 #main .framer-wd55z .framer-1409o2i{gap:20px!important}
 #main .framer-wd55z .framer-umq7yu{gap:20px!important;margin-top:0!important}
}
.portfolio-project-preview img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 8px;
  box-shadow: 0 12px 36px rgba(33, 36, 49, .16);
  transform: scale(.97);
  opacity: 0;
  transition: opacity 220ms ease, transform 280ms cubic-bezier(.22, 1, .36, 1);
}
.portfolio-project-preview img.is-current { opacity: 1; }
.portfolio-project-preview.is-visible { opacity: 1; }
.portfolio-project-preview.is-visible img.is-current { transform: scale(1); }
@media (prefers-reduced-motion: reduce) {
  #main .framer-wbGfx a[data-portfolio-preview],
  #main .framer-wbGfx a[data-portfolio-preview] .framer-f1mklf,
  .portfolio-project-preview,
  .portfolio-project-preview img { transition: none; }
  #main .framer-wbGfx a[data-portfolio-preview] .framer-f1mklf { translate: none !important; }
}