:root{
  --bg:#0a0a0a; --surface:#121110;
  --ink:#f4efe6; --ink-soft:#c9c0b3; --ink-faint:#8a8178;
  --accent:#b5502e; --accent-light:#d97a52; --accent-ink:#0a0a0a;
  --line:rgba(244,239,230,.16);
  --font-display:'Unbounded',system-ui,sans-serif; --font-mono:'Space Mono',monospace; --font-body:'Archivo','Segoe UI',sans-serif; --font-tag:'Permanent Marker',cursive;
  --ease:cubic-bezier(.22,1,.36,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} *{animation-duration:.01ms !important;transition-duration:.01ms !important} }
body{font-family:var(--font-body);font-weight:400;color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--font-display);font-weight:600;line-height:1.04;color:var(--ink);overflow-wrap:break-word}
em{font-style:normal;font-family:var(--font-tag);color:var(--accent-light);font-weight:400}
:focus-visible{outline:2px solid var(--accent-light);outline-offset:3px}
.mono{font-family:var(--font-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-light)}
.container{max-width:1400px;margin:0 auto;padding:0 6vw}
.section{padding:140px 0}
@media (max-width:720px){.section{padding:88px 0}}
.logo-mark{height:28px;width:auto;display:block}
@media (max-width:600px){.logo-mark{height:22px}}

/* NAV */
header.site{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:32px 6vw;mix-blend-mode:difference}
.wordmark{font-family:var(--font-display);font-size:22px;font-weight:600;letter-spacing:.02em;color:var(--ink)}
.menu-toggle{display:flex;align-items:center;gap:12px;background:none;border:none;cursor:pointer;color:var(--ink)}
.menu-toggle .mono{color:var(--ink)}
.menu-toggle .bars{display:flex;flex-direction:column;gap:5px;width:26px}
.menu-toggle .bars span{display:block;height:1.5px;background:var(--ink);transition:transform .3s var(--ease),opacity .3s var(--ease)}
.menu-toggle[aria-expanded="true"] .bars span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] .bars span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] .bars span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

.full-nav{position:fixed;inset:0;z-index:99;background:var(--bg);display:flex;flex-direction:column;padding:100px 6vw 32px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .5s var(--ease),visibility 0s linear .5s;overflow-y:auto}
.full-nav.open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .5s var(--ease),visibility 0s linear 0s}
.full-nav-body{flex:1;display:flex;align-items:center;min-height:0}
.full-nav ol{list-style:none;display:flex;flex-direction:column;gap:clamp(2px,1vw,8px)}
.full-nav li{overflow:hidden}
.full-nav ol a{font-family:var(--font-display);font-size:clamp(30px,7vw,76px);font-weight:600;color:var(--ink-soft);display:inline-block;transition:color .3s,transform .5s var(--ease);transform:translateY(100%)}
.full-nav.open ol a{transform:translateY(0)}
.full-nav ol a:hover{color:var(--accent-light)}
.full-nav-foot{flex:0 0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;padding-top:24px}

/* HERO */
.hero{position:relative;height:100vh;min-height:640px;overflow:hidden}
.hero img{position:absolute;inset:-10% 0;width:100%;height:120%;object-fit:cover;object-position:center 30%;filter:grayscale(.15) contrast(1.05);will-change:transform}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(10,10,10,.15) 0%, rgba(10,10,10,.35) 55%, rgba(10,10,10,.92) 100%);z-index:0}
.hero-content{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:0 6vw 64px;display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.hero-content h1{font-size:clamp(44px,9vw,132px);letter-spacing:-.01em;text-wrap:balance;max-width:16ch}
.hero-content p{font-size:16px;color:var(--ink-soft);max-width:38ch}
.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 30px;border:1px solid var(--ink);border-radius:100px;font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);transition:background .3s var(--ease),color .3s var(--ease)}
.btn:hover{background:var(--ink);color:var(--bg)}
.btn-solid{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn-solid:hover{background:var(--accent-light);border-color:var(--accent-light);color:var(--accent-ink)}

/* INTRO / PHILOSOPHY */
.intro{position:relative;background:var(--surface);overflow:hidden}
.intro-bg{position:absolute;inset:0;opacity:.22;object-fit:cover;width:100%;height:100%}
.intro-inner{position:relative;max-width:none}
.intro-inner p{font-family:var(--font-display);font-size:clamp(24px,3.6vw,44px);font-weight:500;line-height:1.32;color:var(--ink);text-align:justify;text-align-last:left;hyphens:auto}
/* ARTISTS */
.artists{display:grid;grid-template-columns:1fr 1fr}
@media (max-width:820px){.artists{grid-template-columns:1fr}}
.artist{padding:100px 6vw;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:18px;transition:background .4s var(--ease)}
.artist:hover{background:rgba(244,239,230,.03)}
.artist:first-child{border-right:1px solid var(--line)}
@media (max-width:820px){.artist:first-child{border-right:none}}
.artist h3{font-size:clamp(34px,5vw,64px)}

/* PROCESS */
.process-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}
@media (max-width:820px){.process-grid{grid-template-columns:1fr}}
.process-step{background:var(--bg);padding:52px 40px;display:flex;flex-direction:column;gap:14px}
.step-num{font-family:var(--font-mono);font-size:13px;color:var(--accent-light)}
.process-step h3{font-size:clamp(22px,2.6vw,30px)}
.process-step p{color:var(--ink-soft);font-size:14px;max-width:32ch}

/* GALLERY */
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
@media (max-width:640px){.gallery-grid{grid-template-columns:repeat(2,1fr)}}
.gallery-tile{position:relative;aspect-ratio:1/1;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--surface);border:1px solid var(--line);padding:0;cursor:zoom-in;transition:border-color .4s var(--ease),transform .4s var(--ease),background .4s var(--ease)}
.gallery-tile:hover{border-color:var(--accent-light);transform:translateY(-4px)}
.gallery-tile img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.gallery-tile:hover img{transform:scale(1.06)}
.gallery-tile-cta{background:var(--accent);cursor:pointer}
.gallery-tile-cta .mono{color:var(--accent-ink);font-weight:700;text-align:center;line-height:1.6}
.gallery-tile-cta:hover{background:var(--accent-light)}

/* LIGHTBOX */
.lightbox{position:fixed;inset:0;z-index:300;background:rgba(6,6,6,.95);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .35s var(--ease),visibility 0s linear .35s}
.lightbox.open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .35s var(--ease),visibility 0s linear 0s}
.lightbox img{max-width:88vw;max-height:82vh;border-radius:4px;box-shadow:0 30px 80px -20px rgba(0,0,0,.7);transform:scale(.94);transition:transform .35s var(--ease)}
.lightbox.open img{transform:scale(1)}
.lightbox-close,.lightbox-prev,.lightbox-next{position:absolute;background:rgba(244,239,230,.08);border:1px solid var(--line);color:var(--ink);border-radius:50%;width:48px;height:48px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:20px;transition:background .25s,transform .25s}
.lightbox-close:hover,.lightbox-prev:hover,.lightbox-next:hover{background:rgba(244,239,230,.18);transform:scale(1.06)}
.lightbox-close{top:24px;right:24px}
.lightbox-prev{left:24px;top:50%;transform:translateY(-50%)}
.lightbox-next{right:24px;top:50%;transform:translateY(-50%)}
@media (max-width:640px){.lightbox-prev,.lightbox-next{width:40px;height:40px}.lightbox-close{width:40px;height:40px;top:14px;right:14px}}
.artist .role{order:-1}
.artist a{font-family:var(--font-mono);font-size:13px;letter-spacing:.06em;color:var(--accent-light);align-self:flex-start;border-bottom:1px solid transparent;transition:border-color .3s}
.artist a:hover{border-color:var(--accent-light)}

/* SERVICES */
.services{display:grid;grid-template-columns:1fr 1fr}
@media (max-width:820px){.services{grid-template-columns:1fr}}
.service-panel{position:relative;height:70vh;min-height:460px;overflow:hidden;display:flex;align-items:flex-end;padding:44px}
.service-panel-imgwrap{position:absolute;inset:-8% 0;width:100%;height:116%;will-change:transform}
.service-panel-imgwrap img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.service-panel:hover .service-panel-imgwrap img{transform:scale(1.06)}
.service-panel::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(10,10,10,.1), rgba(10,10,10,.88));z-index:0}
.service-panel .inner{position:relative;z-index:1;display:flex;flex-direction:column;gap:12px}
.service-panel h3{font-size:clamp(34px,4.6vw,56px)}
.service-panel p{color:var(--ink-soft);max-width:34ch;font-size:14px}

/* PORTFOLIO TEASER */
.teaser{position:relative;background:var(--bg);text-align:center;padding:180px 6vw;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden}
.teaser-marquee{position:absolute;top:38%;left:0;white-space:nowrap;font-family:var(--font-display);font-size:14vw;font-weight:600;color:transparent;-webkit-text-stroke:1px var(--line);opacity:.5;pointer-events:none}
.teaser h2{position:relative;font-size:clamp(32px,5.6vw,72px);max-width:16ch;margin:0 auto 28px;line-height:1.08}
.teaser p{position:relative;color:var(--ink-soft);max-width:46ch;margin:0 auto 40px}

/* TRUST / REVIEWS */
.trust{padding:140px 0}
.trust-stat{display:flex;align-items:baseline;gap:20px;margin-bottom:64px;flex-wrap:wrap}
.trust-stat strong{font-family:var(--font-display);font-size:clamp(56px,9vw,120px);color:var(--accent-light);line-height:1}
.trust-stat span{color:var(--ink-soft);max-width:32ch}
.quotes{display:flex;flex-direction:column;gap:0}
.quote-row{padding:36px 0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 220px;gap:40px;align-items:start}
@media (max-width:720px){.quote-row{grid-template-columns:1fr}}
.quote-row:last-child{border-bottom:1px solid var(--line)}
.quote-row p{font-family:var(--font-display);font-size:clamp(19px,2.4vw,26px);font-style:italic;line-height:1.5;color:var(--ink)}
.quote-row .mono{white-space:nowrap}

/* LOCATION */
.location{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:end}
@media (max-width:820px){.location{grid-template-columns:1fr;gap:36px}}
.location h2{font-size:clamp(30px,4.4vw,54px);margin-bottom:24px}
.location-row{display:flex;flex-direction:column;gap:6px;margin-bottom:24px}
.location-row span:first-child{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-light)}
.location-row span:last-child{color:var(--ink-soft);font-size:15px}
.location-note{font-size:13px;color:var(--ink-faint);max-width:44ch}

/* FOOTER */
footer{border-top:1px solid var(--line);padding:44px 6vw;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px}
footer .wordmark{font-size:18px}
footer .mono{color:var(--ink-faint)}

/* reveal */
html.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
html.js .reveal.is-visible{opacity:1;transform:none;transition-delay:var(--stagger,0s)}
html.js .reveal-wide{opacity:0;transform:scaleX(.7);transform-origin:left;transition:opacity 1s var(--ease),transform 1s var(--ease)}
html.js .reveal-wide.is-visible{opacity:1;transform:scaleX(1)}
html.js .reveal-left{opacity:0;transform:translateX(-48px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
html.js .reveal-left.is-visible{opacity:1;transform:none}
html.js .reveal-right{opacity:0;transform:translateX(48px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
html.js .reveal-right.is-visible{opacity:1;transform:none}
html.js .reveal-scale{opacity:0;transform:scale(.88);transition:opacity .6s var(--ease),transform .6s var(--ease)}
html.js .reveal-scale.is-visible{opacity:1;transform:scale(1);transition-delay:var(--stagger,0s)}

.scroll-progress{position:fixed;top:0;left:0;height:2px;width:0%;background:var(--accent-light);z-index:200;transition:width .1s linear}