/* Live-site additions on top of each page's own styles */
html{-webkit-text-size-adjust:100%}
html.wlock{overflow:hidden}
::selection{background:#D4A888;color:#2A1A16}
a,button,summary,[role=button]{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[role=button]:focus-visible{outline:2px solid #B87A5A;outline-offset:3px}
.skip{font-family:'Instrument Sans',sans-serif;position:fixed;left:16px;top:12px;z-index:999;background:#2A1A16;color:#FAF6F0;padding:10px 16px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;transform:translateY(-220%);transition:transform .25s}
.skip:focus{transform:none}

/* page to page: a short, quiet cross-fade where the browser supports it */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vtOut .22s ease both}
::view-transition-new(root){animation:vtIn .5s cubic-bezier(.2,.7,.2,1) both}
@keyframes vtOut{to{opacity:0}}
@keyframes vtIn{from{opacity:0;transform:translateY(8px)}}

/* header: returns on scroll up */
.nv.stuck{position:fixed;background:rgba(250,246,240,.94);-webkit-backdrop-filter:saturate(1.2) blur(12px);backdrop-filter:saturate(1.2) blur(12px);box-shadow:0 1px 0 rgba(192,180,162,.6);transform:translateY(-110%);transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.nv.stuck.show{transform:none}
.nv.stuck.lt .lg{color:#2A1A16}
.nv.stuck.lt ul a,.nv.stuck.lt .lang{color:#7A6858}
.nv.stuck.lt ul a:hover{color:#2A1A16}
.nv.stuck.lt .lang b{color:#B87A5A}
.nv.stuck.lt .lang{border-left-color:#C0B4A2}
.nv.stuck.lt .mb span{background:#2A1A16}
@media (max-width:900px){
.nv.open{position:fixed;top:0;left:0;right:0;height:auto;min-height:52px;flex-wrap:wrap;background:#FAF6F0;z-index:200;padding-top:0;padding-bottom:22px;box-shadow:0 24px 40px -24px rgba(42,26,22,.35);transform:none}
.nv.open .lg,.nv.open.lt .lg{color:#2A1A16;line-height:52px}
.nv.open ul{display:flex!important;flex-direction:column;gap:18px;width:100%;order:9;margin:6px 0 0;padding:18px 0 0;border-top:1px solid #C0B4A2}
.nv.open ul li{animation:mIn .5s cubic-bezier(.2,.7,.2,1) both}
.nv.open ul li:nth-child(2){animation-delay:.04s}.nv.open ul li:nth-child(3){animation-delay:.08s}.nv.open ul li:nth-child(4){animation-delay:.12s}.nv.open ul li:nth-child(5){animation-delay:.16s}
.nv.open ul a,.nv.open.lt ul a{font-size:13px;color:#2A1A16}
.nv.open .lang,.nv.open.lt .lang,.nv.open .lang a{color:#7A6858}
.nv.open .mb span,.nv.open.lt .mb span{background:#2A1A16}
.nv.open .mb span:first-child{transform:translateY(3.75px) rotate(45deg)}
.nv.open .mb span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
}
@keyframes mIn{from{opacity:0;transform:translateY(-6px)}}
.nv .mb span{transition:transform .3s cubic-bezier(.2,.7,.2,1)}

/* sections and rows arrive as you reach them */
.js-rv{opacity:0;transform:translateY(22px);transition:opacity .9s ease,transform 1s cubic-bezier(.2,.7,.2,1)}
.js-rv.in{opacity:1;transform:none}
.js-st>*{opacity:0;transform:translateY(16px);transition:opacity .7s ease var(--d,0s),transform .8s cubic-bezier(.2,.7,.2,1) var(--d,0s)}
.js-st.in>*{opacity:1;transform:none}
img.ld{opacity:0;transition:opacity .7s ease}
img.ld.ok{opacity:1}

/* buttons feel pressed */
.btn-solid:active,.send:active,.wsend:active{transform:translateY(1px) scale(.99)!important}
.send.sending,.wsend.sending{opacity:.6;cursor:progress}

/* accordions */
details .dbody{overflow:hidden}

/* video */
[data-yt]{cursor:pointer}
[data-yt] iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:5;animation:vtIn .5s ease both}
[data-yt].playing .pl,[data-yt].playing .vc{display:none}

/* Work: strip and project view */
.scr{user-select:none;-webkit-user-select:none;overscroll-behavior-x:contain}
.scr img{-webkit-user-drag:none;pointer-events:none}
.scr .strip,.scr .slow{animation:none!important}
.scr.dragging,.scr.dragging .po{cursor:grabbing}
.scr.dragging .po:hover{transform:none}
.wdv{position:fixed;inset:0;height:auto;z-index:400}
.wdv .wim img.on{animation:none!important}
.wdv .wd.on>*{animation:none!important;opacity:0;transform:translateY(14px);transition:opacity .25s ease,transform .3s ease}
.wdv.txin .wd.on>*{opacity:1;transform:none;transition:opacity .6s ease,transform .75s cubic-bezier(.2,.7,.2,1)}
.wdv.txin .wd.on>*:nth-child(2){transition-delay:.05s}.wdv.txin .wd.on>*:nth-child(3){transition-delay:.1s}.wdv.txin .wd.on>*:nth-child(4){transition-delay:.15s}
.wdv.txin .wd.on>*:nth-child(5){transition-delay:.2s}.wdv.txin .wd.on>*:nth-child(6){transition-delay:.25s}.wdv.txin .wd.on>*:nth-child(7){transition-delay:.3s}
.wdv .wx,.wdv .wnav{opacity:0;transition:opacity .3s ease}
.wdv.txin .wx,.wdv.txin .wnav{opacity:1;transition:opacity .5s ease .25s}
.wfly{position:fixed;z-index:450;object-fit:cover;pointer-events:none;display:block;margin:0}
@media (max-width:760px){
.wdv{overflow-y:auto;-webkit-overflow-scrolling:touch}
.wdv .wtx{overflow:visible}
.wdv .wx{position:fixed}
.wdv .wnav{position:static;order:3;margin:22px 22px 30px}
.wdv .wnav button{background:none;padding:6px 0}
}

/* writing + contact */
.fmsg{font-size:13.5px;color:#9B3D2E;margin-top:10px}
.send[disabled],.wsend[disabled]{cursor:progress}
.ew .cp.done{color:#B87A5A}
.sub .n.ok{color:#2A1A16}

@media (prefers-reduced-motion:reduce){
.js-rv,.js-st>*{opacity:1!important;transform:none!important;transition:none!important}
img.ld{opacity:1;transition:none}
.nv.stuck{transition:none}
.nv.open ul li{animation:none}
::view-transition-old(root),::view-transition-new(root){animation:none}
.wdv .wd.on>*,.wdv .wx,.wdv .wnav{transition:none!important}
}
