@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&family=Playfair+Display:ital,wght@0,600;0,700;1,600;1,700&display=swap');

:root { --ink:#0b0d0c; --ink-soft:#1b201e; --paper:#efeee9; --lime:#d3ff47; --blue:#4c77ff; --muted:#8b908b; --line:rgba(239,238,233,.2); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--ink); }
body { margin:0; color:var(--paper); background:var(--ink); font-family:Manrope,Arial,sans-serif; overflow-x:hidden; }
body:has(.lightbox[open]) { overflow:hidden; }
button,a { -webkit-tap-highlight-color:transparent; }
button { font:inherit; }
img { display:block; max-width:100%; }
.noise { pointer-events:none; position:fixed; z-index:50; inset:0; opacity:.055; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E"); }
.cursor { display:none; position:fixed; z-index:60; width:76px; height:76px; margin:-38px 0 0 -38px; border-radius:50%; background:var(--lime); color:var(--ink); align-items:center; justify-content:center; pointer-events:none; mix-blend-mode:screen; opacity:0; transform:scale(.4); transition:opacity .2s,transform .25s; }
.cursor span { font:500 9px/1 'DM Mono',monospace; letter-spacing:.12em; }
.cursor.visible { opacity:1; transform:scale(1); }
.site-header { position:absolute; z-index:10; top:0; left:0; width:100%; padding:25px 3.5vw; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.brand,.footer-brand { color:var(--paper); text-decoration:none; font-size:21px; font-weight:800; letter-spacing:-.08em; line-height:1; }
.brand span,.footer-brand span { color:var(--lime); font-family:'Playfair Display',Georgia,serif; font-size:31px; font-style:italic; }
nav { display:flex; gap:31px; }
nav a,.header-cta { color:var(--paper); text-decoration:none; transition:color .2s; }
nav a:hover,.header-cta:hover { color:var(--lime); }
.header-cta { justify-self:end; border-bottom:1px solid rgba(239,238,233,.65); padding-bottom:5px; }
.header-cta span { padding-left:10px; color:var(--lime); font-size:15px; }
.menu-toggle { display:none; }
.hero { min-height:100svh; height:900px; max-height:1120px; position:relative; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; }
.hero-media { position:absolute; inset:0; background-color:var(--ink-soft); background-position:center; background-size:cover; background-repeat:no-repeat; transform:scale(1.03); animation:hero-in 1.7s cubic-bezier(.2,.8,.2,1) both; }
@keyframes hero-in { from { opacity:0; transform:scale(1.12); } to { opacity:1; transform:scale(1.03); } }
.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(4,6,5,.6) 0%,rgba(4,6,5,.05) 58%),linear-gradient(0deg,rgba(4,6,5,.76) 1%,transparent 48%); }
.hero-content,.hero-meta,.hero-stamp { position:relative; z-index:1; }
.hero-content { padding:0 3.5vw 43px; }
.eyebrow,.section-kicker { margin:0; font:500 10px/1.4 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.1em; }
.eyebrow:before { content:'✦'; color:var(--lime); padding-right:9px; }
h1,h2,p { margin-top:0; }
h1 { max-width:1200px; margin:10px 0 0; font-size:clamp(61px,10.8vw,180px); line-height:.8; letter-spacing:-.084em; font-weight:800; }
h1 em,h2 em { color:var(--lime); font-family:'Playfair Display',Georgia,serif; font-weight:600; letter-spacing:-.09em; }
.hero-bottom { margin-top:39px; display:flex; justify-content:space-between; align-items:flex-end; max-width:710px; }
.hero-bottom p { margin:0; font-size:12px; line-height:1.65; font-weight:500; }
.round-link { position:relative; width:104px; height:104px; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:9px; color:var(--ink); text-align:center; text-transform:uppercase; text-decoration:none; background:var(--lime); border-radius:50%; font:500 8px/1.3 'DM Mono',monospace; letter-spacing:.07em; transform:rotate(-12deg); transition:transform .35s; }
.round-link:hover { transform:rotate(0deg) scale(1.08); }.round-link b { font-size:18px; line-height:1; }
.hero-meta { position:absolute; top:100px; right:3.5vw; display:flex; gap:35px; font:500 9px 'DM Mono',monospace; letter-spacing:.1em; text-transform:uppercase; writing-mode:vertical-rl; }
.hero-stamp { position:absolute; bottom:37px; right:3.5vw; width:124px; height:124px; border:1px solid rgba(239,238,233,.7); border-radius:50%; display:grid; place-items:center; }
.hero-stamp svg { position:absolute; width:100%; height:100%; animation:spin 19s linear infinite; }.hero-stamp text { fill:var(--paper); font:600 8px 'DM Mono',monospace; letter-spacing:1px; }.hero-stamp>span { color:var(--lime); font:italic 53px/1 'Playfair Display',Georgia,serif; }
@keyframes spin { to { transform:rotate(360deg); } }
.ticker { overflow:hidden; color:var(--ink); background:var(--lime); padding:14px 0; white-space:nowrap; }.ticker-track { display:inline-flex; align-items:center; gap:25px; width:max-content; animation:ticker 24s linear infinite; font-size:21px; font-weight:800; letter-spacing:-.055em; }.ticker i { font-size:13px; font-style:normal; }@keyframes ticker { to { transform:translateX(-50%); } }
.section-pad { padding:153px 7.2vw; }.intro { background:var(--paper); color:var(--ink); }.section-kicker { color:inherit; }.intro-grid { margin-top:72px; display:grid; grid-template-columns:1.45fr .55fr; gap:80px; align-items:end; }.intro h2 { margin:0; font-size:clamp(40px,5vw,81px); font-weight:800; line-height:.91; letter-spacing:-.08em; }.intro h2 em { color:var(--blue); }.intro-copy { max-width:320px; }.intro-copy p { font-size:14px; line-height:1.85; }.text-link { display:inline-flex; align-items:center; gap:17px; margin-top:19px; color:inherit; font:700 11px 'DM Mono',monospace; letter-spacing:.05em; text-decoration:none; text-transform:uppercase; border-bottom:1px solid currentColor; padding-bottom:7px; }.text-link span { font-size:18px; line-height:.5; transition:transform .2s; }.text-link:hover span { transform:translateX(4px); }
.feature-project { background:var(--ink-soft); padding:0 3.5vw 123px; }.feature-image-wrap { height:min(79vw,930px); overflow:hidden; position:relative; }.feature-image-wrap img { width:100%; height:100%; object-fit:cover; object-position:center 45%; transition:transform .8s cubic-bezier(.2,.8,.2,1); }.feature-image-wrap:hover img { transform:scale(1.025); }.image-view-button { position:absolute; inset:auto 23px 20px auto; border:0; display:flex; align-items:center; gap:15px; color:var(--ink); background:var(--lime); cursor:pointer; padding:12px 16px; font:600 9px 'DM Mono',monospace; letter-spacing:.07em; text-transform:uppercase; }.image-view-button b { font-size:19px; }.feature-caption { display:grid; grid-template-columns:1fr 2fr 1fr; align-items:end; padding-top:21px; }.feature-caption p,.feature-caption>div { margin:0; font:500 9px/1.4 'DM Mono',monospace; letter-spacing:.08em; text-transform:uppercase; }.feature-caption h2 { margin:0; font-size:clamp(54px,9.4vw,148px); line-height:.75; letter-spacing:-.095em; }.feature-caption>div { display:flex; justify-content:space-between; align-self:start; padding-top:7px; gap:10px; }
.work { background:var(--ink); }.section-heading { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:72px; }.section-heading>p:last-child { margin:0; color:#a2a7a2; font-size:12px; }.gallery { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:20px; align-items:start; }.gallery-item { border:0; margin:0; padding:0; position:relative; overflow:hidden; background:#151917; cursor:pointer; text-align:left; min-height:200px; height:clamp(520px,44vw,680px); }.gallery-item img { height:100%; width:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.8,.2,1),filter .6s; }.gallery-item:after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,rgba(3,5,4,.75),transparent 40%); opacity:.6; transition:opacity .3s; }.gallery-item:hover img { transform:scale(1.055); filter:saturate(1.13); }.gallery-item:hover:after { opacity:.35; }.gallery-label { position:absolute; z-index:1; bottom:17px; left:18px; color:var(--paper); font:500 9px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.07em; }.gallery-item.tall { grid-column:span 4; }.gallery-item.wide,.gallery-item.square { grid-column:span 8; }.gallery-item.full { grid-column:1 / -1; height:clamp(450px,48vw,720px); }.gallery-item.shift,.gallery-item.square { margin-top:0; }.gallery-item:nth-child(3),.gallery-item:nth-child(4) { height:clamp(480px,39vw,610px); }.gallery-item:nth-child(5),.gallery-item:nth-child(6) { height:clamp(500px,42vw,650px); }.gallery-footer { margin-top:55px; border-top:1px solid var(--line); padding-top:16px; color:#a2a7a2; display:flex; justify-content:space-between; align-items:center; font:500 10px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.08em; }.gallery-footer .text-link { color:var(--paper); margin:0; }
.services { position:relative; background:var(--blue); color:var(--ink); overflow:hidden; }.services .section-kicker { margin-bottom:58px; }.services-list { border-top:1px solid rgba(11,13,12,.28); position:relative; z-index:1; }.services-list button { width:100%; display:grid; grid-template-columns:80px 1fr 30px; align-items:center; gap:10px; border:0; border-bottom:1px solid rgba(11,13,12,.28); padding:21px 0 22px; color:var(--ink); background:transparent; cursor:pointer; text-align:left; }.services-list span { font:500 9px 'DM Mono',monospace; }.services-list b { font-size:clamp(32px,5vw,72px); line-height:.9; letter-spacing:-.08em; }.services-list i { font-size:26px; font-style:normal; transition:transform .2s; }.services-list button:hover i { transform:translate(5px,-5px); }.service-preview { position:absolute; z-index:2; width:280px; height:365px; right:16vw; top:128px; opacity:0; pointer-events:none; transform:rotate(6deg) scale(.85); transition:opacity .25s,transform .35s cubic-bezier(.2,.8,.2,1); box-shadow:12px 15px 0 var(--lime); }.service-preview.active { opacity:1; transform:rotate(6deg) scale(1); }.service-preview img { height:100%; width:100%; object-fit:cover; }
.statement { position:relative; min-height:970px; display:flex; flex-direction:column; justify-content:flex-end; padding:80px 7.2vw 105px; background:#cf4d5c; overflow:hidden; }.statement-image { position:absolute; inset:0; }.statement-image:after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,rgba(34,4,9,.86),transparent 65%); }.statement-image img { height:100%; width:100%; object-fit:cover; object-position:center 38%; }.statement h2 { position:relative; z-index:1; margin:0; font-size:clamp(70px,11vw,179px); line-height:.78; letter-spacing:-.09em; }.statement h2 em { color:var(--lime); }.statement-sup { position:relative; z-index:1; margin:0 0 22px; font:500 10px/1.5 'DM Mono',monospace; letter-spacing:.08em; text-transform:uppercase; }
.contact { background:var(--paper); color:var(--ink); }.contact-grid { margin-top:69px; display:grid; grid-template-columns:1.65fr .55fr; gap:60px; align-items:end; }.contact h2 { margin:0; font-size:clamp(44px,6.7vw,108px); font-weight:800; line-height:.82; letter-spacing:-.09em; }.contact h2 em { color:var(--blue); }.contact-aside { max-width:310px; }.contact-aside p { font-size:13px; line-height:1.8; }.contact-button { display:flex; align-items:center; justify-content:space-between; margin-top:31px; color:var(--paper); background:var(--ink); padding:18px 19px; text-decoration:none; font:600 9px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.06em; transition:background .25s,transform .25s; }.contact-button:hover { background:var(--blue); transform:translateY(-3px); }.contact-button b { color:var(--lime); font-size:20px; }
footer { background:var(--ink); color:var(--paper); padding:54px 3.5vw 21px; }.footer-top { display:grid; grid-template-columns:1fr .7fr auto; gap:42px; align-items:start; padding-bottom:78px; }.footer-top p { margin:0; color:#a2a7a2; font-size:11px; line-height:1.7; }.footer-socials { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }.footer-socials a { display:flex; align-items:center; gap:9px; min-height:39px; padding:9px 12px; border:1px solid var(--line); color:var(--paper); text-decoration:none; font:600 9px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.07em; transition:color .2s,background .2s,border-color .2s,transform .2s; }.footer-socials a:hover { color:var(--ink); background:var(--lime); border-color:var(--lime); transform:translateY(-2px); }.social-icon { width:16px; height:16px; display:grid; place-items:center; flex:0 0 16px; font-size:16px; font-weight:800; line-height:1; text-transform:none; }.tiktok-icon { font-size:18px; transform:translateY(-1px); }.instagram-icon { position:relative; border:1.7px solid currentColor; border-radius:4px; }.instagram-icon:before { content:''; width:5px; height:5px; border:1.5px solid currentColor; border-radius:50%; }.instagram-icon:after { content:''; position:absolute; top:2px; right:2px; width:2px; height:2px; border-radius:50%; background:currentColor; }.facebook-icon { font-family:Arial,sans-serif; font-size:19px; padding-top:3px; }.footer-bottom { display:flex; justify-content:space-between; border-top:1px solid var(--line); padding-top:16px; color:#858b85; font:500 9px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.07em; }.footer-bottom a { color:inherit; text-decoration:none; }
.lightbox { width:100vw; height:100dvh; max-width:none; max-height:none; border:0; margin:0; padding:60px 8vw; color:var(--paper); background:rgba(5,7,6,.97); }.lightbox::backdrop { background:rgba(5,7,6,.9); }.lightbox figure { height:100%; width:100%; margin:0; display:flex; align-items:center; justify-content:center; position:relative; touch-action:pan-y; }.lightbox figure img { max-height:calc(100dvh - 120px); max-width:100%; object-fit:contain; }.lightbox figcaption { position:absolute; bottom:0; left:0; font:500 9px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.08em; }.lightbox-close,.lightbox-nav { position:absolute; z-index:2; border:0; cursor:pointer; color:var(--paper); background:none; }.lightbox-close { top:20px; right:3vw; font-size:42px; font-weight:200; line-height:1; }.lightbox-nav { top:50%; transform:translateY(-50%); font-size:26px; }.lightbox-nav.previous { left:3vw; }.lightbox-nav.next { right:3vw; }.lightbox-count { position:absolute; z-index:2; top:24px; left:3vw; margin:0; font:500 9px 'DM Mono',monospace; letter-spacing:.1em; }
@media (hover:hover) and (pointer:fine) { .cursor { display:flex; } }
.gallery { grid-auto-flow:dense; }
.gallery-empty { grid-column:1 / -1; margin:0; padding:70px 24px; border:1px solid var(--line); color:#a2a7a2; text-align:center; font:500 10px/1.6 'DM Mono',monospace; letter-spacing:.08em; text-transform:uppercase; }
.gallery-item.half { grid-column:span 6; height:clamp(560px,52vw,760px); }
@media (max-width:720px) { .site-header { padding:20px 21px; display:flex; justify-content:space-between; }.brand { font-size:19px; }.brand span { font-size:28px; }nav,.header-cta { display:none; }.menu-toggle { display:flex; width:42px; height:42px; padding:11px 2px; border:0; background:none; flex-direction:column; justify-content:center; gap:7px; cursor:pointer; }.menu-toggle span { display:block; height:1px; width:100%; background:var(--paper); transition:transform .2s; }.site-header.menu-open { background:var(--ink); }.site-header.menu-open nav { position:absolute; top:82px; left:0; width:100%; padding:22px; background:var(--ink); display:flex; flex-direction:column; gap:21px; font-size:12px; }.site-header.menu-open .menu-toggle span:first-child { transform:translateY(4px) rotate(45deg); }.site-header.menu-open .menu-toggle span:last-child { transform:translateY(-4px) rotate(-45deg); }.hero { height:740px; min-height:100svh; }.hero-media { background-position:61% center; }.hero-content { padding:0 21px 30px; }.hero-meta { top:auto; bottom:186px; right:21px; gap:20px; font-size:7px; }.hero-stamp { display:none; }.hero-bottom { margin-top:31px; }.hero-bottom p { font-size:10px; }.round-link { width:79px; height:79px; font-size:7px; }.ticker { padding:11px 0; }.ticker-track { font-size:17px; }.section-pad { padding:92px 21px; }.intro-grid,.contact-grid { display:block; margin-top:48px; }.intro h2 { font-size:49px; }.intro-copy { margin-top:43px; }.feature-project { padding:0 0 58px; }.feature-image-wrap { height:122vw; }.feature-image-wrap img { object-position:center; }.feature-caption { padding:17px 21px 0; grid-template-columns:1fr 1fr; }.feature-caption h2 { grid-column:1 / -1; grid-row:1; font-size:75px; margin-bottom:18px; }.feature-caption p { grid-row:2; }.feature-caption>div { grid-row:2; }.gallery { grid-template-columns:1fr; gap:10px; }.section-heading { margin-bottom:43px; align-items:flex-start; flex-direction:column; gap:13px; }.section-heading>p:last-child { max-width:205px; font-size:11px; line-height:1.5; }.gallery .gallery-item { grid-column:1 / -1; margin:0; }.gallery .gallery-item.tall { height:125vw; }.gallery .gallery-item.wide { height:66vw; }.gallery .gallery-item.square { height:78vw; }.gallery .gallery-item.full { height:66vw; }.gallery-label { bottom:11px; left:12px; font-size:7px; }.gallery-footer { margin-top:29px; display:block; line-height:1.7; }.gallery-footer .text-link { margin-top:13px; }.services .section-kicker { margin-bottom:39px; }.services-list button { grid-template-columns:39px 1fr 20px; padding:19px 0; }.services-list b { font-size:36px; }.services-list i { font-size:18px; }.service-preview { display:none; }.statement { min-height:670px; padding:60px 21px; }.statement h2 { font-size:76px; }.statement-sup { font-size:8px; }.contact h2 { font-size:51px; }.contact-aside { margin-top:47px; }.footer-top { grid-template-columns:1fr; gap:29px; padding-bottom:51px; }.footer-bottom { gap:13px; flex-wrap:wrap; font-size:7px; }.lightbox { padding:54px 12px; }.lightbox-nav { display:none; }.lightbox figcaption { left:7px; }.lightbox-count { left:20px; }.lightbox-close { right:18px; } }
@media (max-width:720px) { .gallery .gallery-item.half { height:125vw; } }