:root{--ink:#2a1d1a;--dim:#5a473f;--line:rgba(42,29,26,.22);--accent:#8e1f3a;--char:#2a2622;--cream:#f6ecdf;--display:"Bricolage Grotesque",system-ui,sans-serif;--text:"Instrument Sans",system-ui,sans-serif;--pad:clamp(18px,3vw,44px);--dye:#c9a887;--wash:rgba(250,242,230,.42)}
.p-work{--dye:#c9a887}
.p-studio{--dye:#b86f55;--wash:rgba(252,236,226,.34)}
.p-contact{--dye:#c49a45;--wash:rgba(252,244,226,.38)}
.field{background:linear-gradient(var(--wash),var(--wash)),url(../textures/corduroy.jpg) 0 0/420px,var(--dye);background-blend-mode:normal,luminosity}
*{box-sizing:border-box}
html{min-height:100%;background:linear-gradient(rgba(252,246,236,.5),rgba(252,246,236,.5)),url(../textures/corduroy.jpg) 0 0/420px,#c2ad93;background-blend-mode:normal,luminosity}
body{margin:0;min-height:100vh;color:var(--ink);font:500 16px/1.5 var(--text);-webkit-font-smoothing:antialiased;animation:pageIn .5s ease both}
@keyframes pageIn{from{opacity:0}}
a{color:inherit;text-decoration:none}
a:hover{color:var(--accent)}
p,h1,h2,h3{margin:0}
.top{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;padding:22px var(--pad)}
.logo{display:flex;align-items:baseline;gap:12px;margin-right:auto}
.logo b{font:800 30px/1 var(--display);letter-spacing:-.045em}
.logo small{font-size:13px;font-weight:600;color:var(--dim)}
.logo:hover{color:var(--ink)}
.nav{display:flex;gap:4px}
.nav a{padding:10px 18px;border-radius:999px;font-weight:600;font-size:14px;transition:background .15s}
.nav a:hover{background:rgba(42,29,26,.08);color:var(--ink)}
.nav a[aria-current],.pill{background:var(--char) url(../textures/corduroy.jpg) center/300px;background-blend-mode:soft-light;color:var(--cream);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 3px 8px rgba(40,28,18,.22)}
.pill{display:inline-flex;align-items:center;gap:12px;padding:15px 24px;border:0;border-radius:999px;font:700 14px/1 var(--text);cursor:pointer;transition:transform .15s}
.pill:hover,.nav a[aria-current]:hover{background:#8e1f3a url(../textures/velvet.jpg) center/400px;background-blend-mode:normal;color:var(--cream)}
.pill:active{transform:scale(.97)}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
@media (max-width:640px){.logo small{display:none}.nav a{padding:9px 12px}}

/* warm tint over the whole site: raise --warm for warmer/darker, 0 turns it off */
:root{--warm:.42}
html::after{content:"";position:fixed;inset:0;z-index:2147483647;pointer-events:none;background:#e9b77a;mix-blend-mode:multiply;opacity:var(--warm)}
@media print{html::after{display:none}}

/* the back arrow sits in the same spot on every page */
.back.pin{position:fixed!important;top:100px;right:calc(var(--pad) + 40px - (100vw - 100%));margin:0!important;z-index:20}