/* Website walkthroughs. All styles stay within the four project cards. */
.folio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin-top:56px;}
.folio{min-width:0;border:2px solid var(--black);background:var(--white);}
.folio-preview{position:relative;aspect-ratio:16/9;background:#111;overflow:hidden;isolation:isolate;}
.folio-poster,.folio-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;}
.folio-video{opacity:0;transition:opacity .2s ease;}
.folio.is-playing .folio-video,.folio.has-frame .folio-video{opacity:1;}
.folio-preview-label{position:absolute;left:12px;bottom:12px;padding:7px 9px;background:rgba(10,10,10,.82);color:#fff;font-family:'Satoshi',sans-serif;font-weight:600;font-size:9px;letter-spacing:.11em;text-transform:uppercase;pointer-events:none;}
.folio-preview-label::before{content:'';display:inline-block;width:5px;height:5px;background:var(--folio-accent);border-radius:50%;margin-right:7px;vertical-align:1px;}
.folio-toggle{position:absolute;right:12px;bottom:12px;display:inline-flex;align-items:center;gap:6px;min-width:72px;min-height:36px;padding:7px 10px;border:1px solid rgba(255,255,255,.4);background:rgba(10,10,10,.86);color:#fff;font:600 11px 'Satoshi',sans-serif;cursor:pointer;transition:background .2s;}
.folio-toggle[hidden]{display:none;}
.folio-toggle:hover{background:#111;}
.folio-toggle svg{width:16px;height:16px;fill:currentColor;}
.folio-pause-icon,.folio.is-playing .folio-play-icon{display:none;}
.folio.is-playing .folio-pause-icon{display:block;}
.folio.is-loading .folio-toggle svg{opacity:.45;}
.folio-body{padding:22px 24px 24px;border-top:2px solid var(--black);}
.folio-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.folio-name{font-family:'Clash Display','Arial Black',sans-serif;font-size:clamp(24px,2.7vw,40px);font-weight:700;line-height:1.08;letter-spacing:-.035em;}
.folio-name a{color:var(--black);text-decoration:none;}
.folio-visit{flex-shrink:0;font-family:'Satoshi',sans-serif;font-weight:700;font-size:11px;letter-spacing:.04em;color:var(--black);text-decoration:none;border-bottom:1px solid currentColor;padding:6px 0;white-space:nowrap;}
.folio-visit span{display:inline-block;transition:transform .2s;}
.folio-visit:hover span{transform:translate(2px,-2px);}
.folio-tagline{font:500 13px/1.5 'Satoshi',sans-serif;color:var(--muted);margin-top:7px;}
.folio-notes{margin-top:23px;padding-top:20px;border-top:1px solid var(--line);}
.folio-notes .work-sub-label{font-size:10px;letter-spacing:.11em;margin-bottom:10px;}
.folio-notes .work-sub-title{font-size:clamp(25px,2.7vw,40px);margin-bottom:13px;}
.folio-notes .work-sub-copy{font-size:14px;line-height:1.7;max-width:none;margin-bottom:0;}
.folio a:focus-visible,.folio-toggle:focus-visible{outline:3px solid var(--red);outline-offset:4px;}
.folio-toggle:focus-visible{outline-color:var(--folio-accent);outline-offset:-5px;}
@media(max-width:959px){.folio-grid{grid-template-columns:minmax(0,1fr);gap:26px;}.folio-name{font-size:34px;}.folio-notes .work-sub-title{font-size:36px;}}
@media(max-width:599px){.folio-grid{margin-top:36px;gap:24px;}.folio-body{padding:18px 16px 20px;}.folio-name{font-size:28px;}.folio-notes{margin-top:18px;padding-top:17px;}.folio-notes .work-sub-title{font-size:30px;}.folio-notes .work-sub-copy{font-size:14px;}.folio-preview-label{left:8px;bottom:8px;font-size:8px;padding:7px;}.folio-toggle{right:8px;bottom:8px;min-height:36px;}.folio-visit{font-size:10px;}}
@media(prefers-reduced-motion:reduce){.folio-video,.folio-visit span{transition:none;}}