@font-face{font-family:'Cormorant Garamond';font-weight:500;font-style:normal;font-display:swap;src:url('/assets/fonts/cormorant-garamond-500.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-weight:600;font-style:normal;font-display:swap;src:url('/assets/fonts/cormorant-garamond-600.woff2') format('woff2')}
@font-face{font-family:'Inter Tight';font-weight:400;font-style:normal;font-display:swap;src:url('/assets/fonts/inter-tight-400.woff2') format('woff2')}
@font-face{font-family:'Inter Tight';font-weight:500;font-style:normal;font-display:swap;src:url('/assets/fonts/inter-tight-500.woff2') format('woff2')}

:root{
  --ink:#0B0B0C; --coal:#141416; --char:#1C1C1F; --bone:#ECE9E3; --bone-2:#DEDAD2; --ash:#8D8A85; --ash-2:#5E5C59;
  --line:rgba(236,233,227,.14); --line-l:rgba(11,11,12,.14);
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif; --sans:'Inter Tight',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --max:78rem; --gut:clamp(1.25rem,5vw,3.5rem); --ease:cubic-bezier(.2,.75,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5rem}
body{margin:0;background:var(--ink);color:var(--bone);font-family:var(--sans);font-size:1.05rem;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-wrap:break-word}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--bone);outline-offset:3px}
.skip{position:absolute;left:1rem;top:-4rem;background:var(--bone);color:var(--ink);padding:.7rem 1rem;z-index:300;text-decoration:none}
.skip:focus{top:1rem}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
h1,h2,h3{margin:0;font-family:var(--serif);font-weight:500;line-height:1.08;letter-spacing:.005em;text-wrap:balance}
h2{font-size:clamp(2.3rem,4.6vw,3.8rem)}
h3{font-size:1.45rem;font-weight:500}
p{margin:0}
.lead{font-size:clamp(1.08rem,1.3vw,1.2rem);color:var(--ash);max-width:38rem}
.section{padding-block:clamp(4.5rem,9vw,8rem)}
.label{display:block;font-family:var(--sans);font-size:.78rem;letter-spacing:.32em;text-transform:uppercase;color:var(--ash);margin-bottom:1.1rem}
.rule{display:flex;align-items:center;gap:.9rem;color:var(--ash-2)}
.rule::before,.rule::after{content:"";height:1px;flex:1;background:currentColor;opacity:.7}
.rule i{width:.5rem;height:.5rem;transform:rotate(45deg);border:1px solid currentColor}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:3.1rem;padding:.75rem 1.6rem;border:1px solid var(--bone);background:transparent;color:var(--bone);font-family:var(--sans);font-weight:500;font-size:.92rem;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.btn:hover{background:var(--bone);color:var(--ink)}
.btn--solid{background:var(--bone);color:var(--ink)}
.btn--solid:hover{background:transparent;color:var(--bone)}
.light .btn{border-color:var(--ink);color:var(--ink)}
.light .btn:hover{background:var(--ink);color:var(--bone)}

/* header */
.top{position:fixed;inset:0 0 auto 0;z-index:100;transition:background .4s,border-color .4s;border-bottom:1px solid transparent}
.top.is-scrolled{background:rgba(11,11,12,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-color:var(--line)}
.top__in{display:flex;align-items:center;gap:1.5rem;height:4.6rem}
.brand{display:flex;align-items:center;gap:.8rem;text-decoration:none;margin-right:auto}
.brand img{width:3.2rem;height:auto}
.brand span{font-family:var(--serif);font-weight:500;font-size:1.05rem;letter-spacing:.3em;text-transform:uppercase;line-height:1}
.nav{display:flex;gap:2rem}
.nav a{text-decoration:none;font-size:.82rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ash);transition:color .25s}
.nav a:hover,.nav a[aria-current="true"]{color:var(--bone)}
@media (max-width:40rem){.nav{gap:1.1rem}.nav a{font-size:.72rem;letter-spacing:.16em}.brand span{display:none}}

/* hero: the wings open */
.hero{position:relative;min-height:100svh;display:grid;place-items:center;text-align:center;overflow:hidden;padding-block:6rem 4rem}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 45% at 50% 42%,rgba(236,233,227,.07),rgba(236,233,227,0) 70%);pointer-events:none}
.hero__mark{width:min(34rem,82vw);margin:0 auto;clip-path:inset(0 50% 0 50%);opacity:.2;transition:clip-path 2.2s cubic-bezier(.65,0,.25,1) .2s,opacity 1.6s ease .2s}
body.is-ready .hero__mark{clip-path:inset(0 0 0 0);opacity:1}
.hero h1{margin-top:clamp(1.6rem,4vw,2.6rem);font-size:clamp(2.2rem,6vw,4.6rem);font-weight:500;text-transform:uppercase;letter-spacing:.34em;padding-left:.34em;opacity:0;transition:opacity 1.4s ease 1.6s,letter-spacing 2.2s var(--ease) 1.6s}
body.is-ready .hero h1{opacity:1;letter-spacing:.24em}
.hero .rule{max-width:22rem;margin:1.4rem auto 0;opacity:0;transition:opacity 1.2s ease 2.2s}
.hero__sub{margin-top:1.3rem;font-family:var(--serif);font-style:italic;font-size:clamp(1.2rem,1.8vw,1.45rem);color:var(--ash);opacity:0;transition:opacity 1.2s ease 2.4s}
.hero__cta{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center;margin-top:2.2rem;opacity:0;transition:opacity 1.2s ease 2.7s}
body.is-ready .hero .rule,body.is-ready .hero__sub,body.is-ready .hero__cta{opacity:1}
.scroll-cue{position:absolute;left:50%;bottom:1.6rem;width:1px;height:3.2rem;background:linear-gradient(var(--ash),transparent);transform:translateX(-50%);animation:cue 2.4s ease-in-out infinite}
@keyframes cue{0%,100%{opacity:.2;transform:translateX(-50%) scaleY(.6);transform-origin:top}50%{opacity:.8;transform:translateX(-50%) scaleY(1)}}

/* work */
.work__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1.5rem;margin-bottom:clamp(2rem,4vw,3.2rem)}
.gallery{columns:3 18rem;column-gap:1.6rem}
.piece{break-inside:avoid;margin:0 0 2.2rem;position:relative}
.piece button{display:block;width:100%;padding:clamp(.6rem,1.2vw,.9rem);border:0;background:var(--char);cursor:zoom-in;position:relative;overflow:hidden;box-shadow:0 18px 40px -24px rgba(0,0,0,.8)}
.piece img{width:100%;height:auto;transition:transform 1.2s var(--ease),opacity .6s}
.piece button:hover img{transform:scale(1.025)}
.piece button::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(236,233,227,.08);pointer-events:none}
.piece figcaption{display:flex;justify-content:space-between;gap:1rem;margin-top:.9rem;align-items:baseline}
.piece figcaption b{font-family:var(--serif);font-weight:500;font-size:1.25rem;font-style:italic}
.piece figcaption span{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ash);text-align:right}
.piece--own figcaption b{font-style:normal}
.sample{position:absolute;top:1.3rem;left:1.3rem;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;background:rgba(11,11,12,.72);color:var(--ash);padding:.25rem .5rem}
.work__note{margin-top:1rem;font-size:.9rem;color:var(--ash-2);max-width:40rem}

/* lightbox */
.lb{position:fixed;inset:0;z-index:200;background:rgba(6,6,7,.96);display:grid;grid-template-rows:1fr auto;opacity:0;pointer-events:none;transition:opacity .35s ease}
.lb.is-open{opacity:1;pointer-events:auto}
.lb__stage{display:grid;place-items:center;padding:4.5rem 4.5rem 1rem;min-height:0}
.lb__stage img{max-width:100%;max-height:calc(100svh - 10rem);width:auto;height:auto;object-fit:contain;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.lb__cap{text-align:center;padding:0 1.5rem 1.6rem}
.lb__cap b{font-family:var(--serif);font-weight:500;font-size:1.4rem}
.lb__cap span{display:block;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ash);margin-top:.2rem}
.lb__btn{position:absolute;width:3rem;height:3rem;border:1px solid var(--line);background:rgba(11,11,12,.6);color:var(--bone);cursor:pointer;display:grid;place-items:center;font-size:1.3rem;line-height:1;transition:border-color .2s}
.lb__btn:hover{border-color:var(--bone)}
.lb__close{top:1.2rem;right:1.2rem}
.lb__prev{left:1.2rem;top:50%;transform:translateY(-50%)}
.lb__next{right:1.2rem;top:50%;transform:translateY(-50%)}
@media (max-width:40rem){.lb__stage{padding:4rem 1rem 1rem}.lb__prev,.lb__next{top:auto;bottom:4.6rem;transform:none}}

/* about */
.light{background:var(--bone);color:var(--ink)}
.light .lead,.light .label{color:var(--ash-2)}
.about__grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,6vw,5.5rem);align-items:center}
.about__mark{max-width:24rem;opacity:.92}
.about p{margin-top:1.1rem;color:#3B3936;max-width:38rem}
.about .sig{margin-top:1.6rem;font-family:var(--serif);font-style:italic;font-size:1.6rem;color:var(--ink)}
@media (max-width:56rem){.about__grid{grid-template-columns:1fr}.about__mark{max-width:16rem}}

/* enquire */
.enq__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,6vw,5rem);align-items:start}
.enq__list{list-style:none;margin:1.8rem 0 0;padding:0;border-top:1px solid var(--line)}
.enq__list li{padding:1rem 0;border-bottom:1px solid var(--line)}
.enq__list b{display:block;font-family:var(--serif);font-weight:500;font-size:1.3rem}
.enq__list span{color:var(--ash);font-size:.97rem}
form{display:grid;gap:1rem}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.field{display:flex;flex-direction:column;gap:.4rem;min-width:0}
.field label{font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ash)}
.field input,.field select,.field textarea{min-height:3.1rem;border:0;border-bottom:1px solid var(--line);background:transparent;padding:.6rem 0;color:var(--bone);border-radius:0;max-width:100%}
.field select option{color:var(--ink)}
.field textarea{min-height:7rem;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-bottom-color:var(--bone)}
.form__err{min-height:1.2rem;font-size:.9rem;color:#D9A8A2}
form .btn{justify-self:start}
@media (max-width:56rem){.enq__grid{grid-template-columns:1fr}}
@media (max-width:30rem){.row2{grid-template-columns:1fr}}

/* footer */
.foot{border-top:1px solid var(--line);padding-block:3rem 2rem;text-align:center;color:var(--ash);font-size:.9rem}
.foot img{width:4.4rem;margin:0 auto 1rem;opacity:.85}
.foot .name{font-family:var(--serif);font-size:1.1rem;letter-spacing:.3em;text-transform:uppercase;color:var(--bone)}
.foot nav{display:flex;justify-content:center;gap:1.8rem;margin-top:1.3rem}
.foot nav a{text-decoration:none;font-size:.78rem;letter-spacing:.22em;text-transform:uppercase}
.foot nav a:hover{color:var(--bone)}
.foot small{display:block;margin-top:1.8rem;font-size:.8rem;color:var(--ash-2)}
.foot small a{text-decoration:none}

.rise{opacity:0;transform:translateY(22px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.rise.in{opacity:1;transform:none}
.simple{min-height:74vh;display:grid;place-items:center;text-align:center;padding-block:7rem 4rem}
.simple h1{font-size:clamp(2.4rem,6vw,4rem)}
.simple p{margin:1rem auto 0;max-width:32rem;color:var(--ash)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .hero__mark{clip-path:none!important;opacity:1!important}
  .hero h1,.hero .rule,.hero__sub,.hero__cta,.rise{opacity:1!important;transform:none!important}
}