html{scroll-behavior:smooth}
body.heritage{--work-paper:#edddc5;--work-ink:#7d2027}
.portfolio-story{position:relative}
.line-transition-track{position:relative;height:300svh}
.line-transition-viewport{position:sticky;top:0;height:100svh;overflow:clip;isolation:isolate;background:#ce9042}
.line-transition-viewport:before{content:'';position:absolute;inset:0;pointer-events:none;background-image:url('assets/ochre-paper-grain.svg');opacity:.54;mix-blend-mode:soft-light;z-index:0}
.hero-scene{position:absolute;inset:0;z-index:3;overflow:clip;clip-path:inset(15.5% 0 6%)}
.hero-scene .hero-shell{height:100svh;min-height:0}
.heritage .line-transition-viewport>.hero-header{position:absolute;inset:0 3.5% auto;height:15.5%;z-index:20;border:0;will-change:opacity}
.heritage .line-transition-viewport>.hero-header nav a{color:#edddc5!important;text-shadow:0 .6px 0 #27413355}
.line-transition-viewport>.hero-header a:hover{text-underline-offset:4px}
.closing-rule,.turning-rule,.opening-rule{position:absolute;z-index:12;pointer-events:none;background:#7d2027;opacity:.4;will-change:transform,opacity}
.closing-rule{left:3.5%;right:3.5%;height:1px}.rule-top{top:15.5%}.rule-bottom{top:94%}
.turning-rule{left:50%;top:50%;width:93vw;height:1px;transform:translate(-50%,-50%);opacity:0;transform-origin:center}
.opening-rule{top:0;bottom:0;width:1px;opacity:0}.rule-left{left:50%}.rule-right{left:50%}
.work-reveal{position:absolute;inset:0;z-index:4;clip-path:inset(0 50%);overflow:clip;pointer-events:none}
.work-section{position:relative;background:#ce9042;color:var(--work-ink);font-family:'Iosevka Charon Mono',monospace;font-weight:700}
.portfolio-story>.work-section{margin-top:-100svh;z-index:15;visibility:hidden}
.work-surface{position:relative;margin:0 4%;background:var(--work-paper);padding:10svh 3.5vw 7svh;border-left:1px solid #7d202766;border-right:1px solid #7d202766}
.work-surface:before{content:'';position:absolute;inset:0;background-image:url('assets/ochre-paper-grain.svg');opacity:.09;mix-blend-mode:multiply;pointer-events:none}
.work-section-header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:5svh;position:relative;z-index:1}
.work-section-header h2{font:700 clamp(12px,1.05vw,16px)/1.2 'Iosevka Charon Mono',monospace;letter-spacing:.02em;margin:0}
.work-section-header nav{display:flex;gap:22px;font-size:clamp(12px,1.05vw,16px);color:#274133}
.work-section-header a:hover{text-decoration:underline;text-underline-offset:4px}
.work-columns{display:grid;grid-template-columns:42% 52%;gap:6%;position:relative;z-index:1}
.work-row{display:flex;flex-direction:column;justify-content:center;min-height:44svh;padding:5svh 0;border-top:1px solid #7d202735;transition:color .35s,opacity .35s;color:#7d20276e;position:relative}
.work-row:last-child{border-bottom:1px solid #7d202735}
.work-row.is-active,.work-row:hover,.work-row:focus-visible{color:#7d2027}
.row-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.row-heading h3{font:700 clamp(31px,3.7vw,58px)/1.06 'Iosevka Charon Mono',monospace;letter-spacing:-.035em;margin:0;font-synthesis:none}
.row-arrow{font-size:26px;opacity:0;transform:translate(-6px,5px);transition:opacity .35s,transform .35s}
.is-active .row-arrow,.work-row:hover .row-arrow{opacity:1;transform:none}
.row-kind{font-size:clamp(10px,.85vw,13px);letter-spacing:.025em;line-height:1.5;margin:20px 0 10px}
.row-award{font-size:clamp(11px,.9vw,14px);line-height:1.65;margin:0;font-weight:700;max-width:95%;opacity:.85}
.preview-column{position:relative;min-width:0}
.preview-stick{position:sticky;top:16svh;height:70svh}
.work-preview-card{position:absolute;inset:0 0 25px;display:flex;flex-direction:column;pointer-events:none;opacity:0;transform:translateY(12px);transition:opacity .45s,transform .6s cubic-bezier(.22,.7,.2,1)}
.work-preview-card.is-active{opacity:1;transform:none;pointer-events:auto;z-index:2}
.work-mat{flex:1;min-height:0;background:var(--mat);padding:20px;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:3px}
.work-mat img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 9px 14px #4b253329);transition:transform 1s cubic-bezier(.25,.7,.2,1);transform:scale(.975)}
.is-active .work-mat img{transform:scale(1)}
.preview-caption{display:flex;justify-content:space-between;gap:20px;font-size:11px;line-height:1.2;letter-spacing:.025em;padding-top:15px;color:#7d2027}
.preview-progress{height:1px;background:#7d202733;position:absolute;bottom:0;left:0;right:0;overflow:hidden}
.preview-progress i{display:block;height:100%;width:25%;background:#7d2027;transform:translateX(var(--preview-progress,0%));transition:transform .65s cubic-bezier(.22,.7,.2,1)}
.work-footer{display:flex;justify-content:flex-end;padding-top:7svh;font-size:12px;letter-spacing:.025em;position:relative;z-index:1}
.work-footer a:hover{text-decoration:underline;text-underline-offset:4px}
.work-reveal>.work-preview-section{position:absolute;inset:0;height:100svh;overflow:clip;visibility:visible}
.work-preview-section .work-surface{min-height:100svh}
.work-preview-section .preview-stick{position:relative;top:0}
@media(max-width:650px){
 .heritage .line-transition-viewport>.hero-header{left:6%;right:6%;height:11%}
 .work-surface{margin:0 5%;padding:7svh 5vw;border-color:#7d202755}
 .work-section-header{margin-bottom:4svh;align-items:start}.work-section-header nav{font-size:11px;gap:12px}.work-section-header h2{font-size:11px}
 .work-columns{grid-template-columns:1fr;gap:0}
 .work-index{display:contents}.preview-column{display:none}
 .work-row{min-height:0;padding:5svh 0;display:flex}
 .row-heading h3{font-size:33px}.row-arrow{font-size:21px}.row-kind{font-size:10px;margin:15px 0 7px}.row-award{font-size:11px;line-height:1.5}
 .mobile-project-image{display:block;margin-top:25px;padding:13px;background:var(--mat);border-radius:2px}
 .mobile-project-image img{width:100%;height:auto;max-height:50svh;object-fit:contain;display:block;filter:drop-shadow(0 5px 9px #4b253321)}
 .work-footer{padding-top:4svh;font-size:11px}.work-preview-section .work-row:not(:first-child){display:none}
}
@media(min-width:651px){.mobile-project-image{display:none}}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}.line-transition-track{height:100svh}.line-transition-viewport{position:relative}.hero-scene{clip-path:none!important}.closing-rule,.turning-rule,.opening-rule,.work-reveal{display:none}
 .portfolio-story>.work-section{margin-top:0;visibility:visible!important}.line-transition-viewport>.hero-header{opacity:1!important;visibility:visible!important}
 .work-preview-card,.work-mat img,.row-arrow,.work-row,.preview-progress i{transition:none}
}

@media(max-width:650px){.closing-rule{left:6%;right:6%}}

.line-transition-viewport:before{display:none}
