/* Production tweaks layered over each page's design styles */
html{scroll-behavior:smooth}
img,video{max-width:100%}
.proj{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:baseline;padding:16px 0;border-bottom:1px solid #e2e2e2;font-size:14px}
.proj strong{font-size:16px;min-width:180px}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #A8875A;outline-offset:2px}
@media (max-width:760px){
  .wrap{padding:0 16px}
  .h1{font-size:38px!important}
  .h2{font-size:28px!important}
  [style*="width: 4"],[style*="width: 5"],[style*="width: 7"]{width:auto!important;max-width:100%!important}
  [style*="minmax(420px"],[style*="minmax(340px"],[style*="minmax(320px"]{grid-template-columns:1fr!important}
  .hero-photo{display:block!important;min-height:0!important}
  .hero-photo>img{position:static!important;display:block;height:420px!important}
  .hero-photo>.wrap{padding-top:32px!important;padding-bottom:48px!important}
  header nav{order:3;width:100%;justify-content:space-between}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* About: sticky "My approach" scroll */
.approach{position:relative;height:300vh}
.approach-pin{position:sticky;top:0;height:100vh;display:flex;align-items:center;overflow:hidden}
.approach-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:48px;align-items:center;width:100%}
.approach-grid img{width:100%;max-height:78vh;aspect-ratio:4/5;object-fit:cover;display:block;border-radius:4px}
.approach-window{height:260px;overflow:hidden;-webkit-mask-image:linear-gradient(transparent,#000 22%,#000 78%,transparent);mask-image:linear-gradient(transparent,#000 22%,#000 78%,transparent)}
.approach-words{list-style:none;margin:0;padding:0;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.approach-words li{height:52px;line-height:52px;font-family:'Playfair Display',Georgia,serif;font-size:30px;color:#b3b3b3;transition:font-size .4s,color .4s;white-space:nowrap}
.approach-words li.is-near{font-size:38px;color:#6f6f6f}
.approach-words li.is-active{font-size:52px;color:#1a1a1a}
@media (max-width:760px),(prefers-reduced-motion:reduce){
  .approach{height:auto}
  .approach-pin{position:static;height:auto;padding:64px 0}
  .approach-window{height:auto;-webkit-mask-image:none;mask-image:none}
  .approach-words{transform:none!important}
  .approach-words li{font-size:30px!important;color:#1a1a1a!important;height:auto;line-height:1.4}
}