:root{--ink:#151614;--paper:#e9e5dc;--acid:#d6ff3e;--muted:#888780;--line:rgba(21,22,20,.18);--mono:'DM Mono',monospace;--sans:'Manrope',sans-serif;--serif:'Playfair Display',serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);overflow-x:hidden}.grain{pointer-events:none;position:fixed;z-index:10;inset:0;opacity:.11;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='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E")}.section-pad{padding-left:5vw;padding-right:5vw}.site-header{height:88px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:5}.wordmark{font-size:1.1rem;font-weight:800;letter-spacing:-.08em;color:inherit;text-decoration:none}.wordmark span{font:400 .45em var(--mono);vertical-align:top;margin-left:3px}.site-nav{display:flex;gap:2rem}.site-nav a,footer a{color:inherit;text-decoration:none;font:500 .68rem var(--mono);text-transform:uppercase;letter-spacing:.02em}.site-nav a:hover,footer a:hover{color:#667c00}.menu-toggle{display:none}.hero{min-height:calc(100vh - 88px);padding-top:7.5rem;padding-bottom:3rem;display:flex;flex-direction:column;justify-content:space-between}.eyebrow{font:500 .66rem var(--mono);text-transform:uppercase;letter-spacing:.05em;margin:0;color:#494a45}.hero-title{margin:3rem 0;font-size:clamp(3.2rem,8.7vw,9.3rem);line-height:.89;letter-spacing:-.085em;max-width:1100px;font-weight:700}.hero-title em,h2 em{font-family:var(--serif);font-weight:600;letter-spacing:-.08em}.hero-bottom{display:flex;justify-content:space-between;align-items:end;gap:2rem}.hero-bottom p{font-size:clamp(.9rem,1.3vw,1.08rem);line-height:1.55;max-width:410px;margin:0}.round-link{height:66px;width:66px;border:1px solid var(--ink);border-radius:50%;display:grid;place-items:center;text-decoration:none;color:var(--ink);font-size:1.5rem;transition:.25s}.round-link:hover{background:var(--acid);transform:rotate(-45deg)}.work-section{background:var(--ink);color:var(--paper);padding-top:7rem;padding-bottom:8rem}.section-heading{display:grid;grid-template-columns:1fr 2fr 1fr;gap:2rem;align-items:start;margin-bottom:4.6rem}.section-heading .eyebrow{color:#a9aaa3;padding-top:.8rem}.section-heading h2,.about h2,.contact h2{font-size:clamp(2.8rem,5.8vw,6.3rem);letter-spacing:-.08em;line-height:.9;margin:0}.section-intro{font-size:.92rem;line-height:1.6;margin:0;padding-top:.8rem;color:#bebeb7}.motion-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:1.2rem}.motion-card:nth-child(1),.motion-card:nth-child(4){grid-column:span 7}.motion-card:nth-child(2),.motion-card:nth-child(3){grid-column:span 5}.video-button{border:0;background:transparent;color:inherit;padding:0;text-align:left;width:100%;cursor:pointer}.video-poster{background:var(--card-color);aspect-ratio:16/10;position:relative;overflow:hidden;padding:1.2rem;isolation:isolate;transition:transform .5s cubic-bezier(.2,.7,.2,1)}.video-poster:before,.video-poster:after{content:"";position:absolute;z-index:-1;border:1px solid currentColor;opacity:.45}.video-poster:before{width:55%;height:150%;top:-20%;right:12%;transform:rotate(35deg)}.video-poster:after{width:80%;height:1px;right:-10%;bottom:24%;background:currentColor}.video-button:hover .video-poster{transform:scale(.98)}.work-index{font:500 .62rem var(--mono)}.play{position:absolute;inset:0;display:grid;place-content:center;text-align:center;gap:.5rem}.play i{font-style:normal;background:var(--acid);color:var(--ink);border-radius:50%;height:58px;width:58px;display:grid;place-items:center;font-size:.9rem;padding-left:3px;margin:auto}.play b{font:500 .6rem var(--mono);text-transform:uppercase;letter-spacing:.08em}.work-details{padding-top:1rem;display:grid;grid-template-columns:1fr auto;column-gap:1rem;align-items:start}.work-details h3{font-size:.98rem;letter-spacing:-.04em;margin:0}.work-details p,.work-details span{font:400 .62rem var(--mono);text-transform:uppercase;letter-spacing:.04em;color:#b8b8af;margin:.25rem 0 0}.work-details span{grid-column:2;grid-row:1}.text-link{display:inline-flex;gap:2.5rem;color:inherit;border-bottom:1px solid currentColor;padding-bottom:.45rem;text-decoration:none;font-size:.9rem;margin-top:5rem}.text-link span{transition:transform .2s}.text-link:hover span{transform:translateX(5px)}.branding-section{padding-top:7rem;padding-bottom:8rem}.branding-section .section-heading{grid-template-columns:1fr 2fr}.brand-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}.brand-card:nth-child(1){grid-column:span 2}.brand-art{height:clamp(250px,35vw,530px);background:var(--brand-color);position:relative;padding:1.4rem;overflow:hidden}.brand-art:before{content:attr(data-mark);position:absolute;right:-.1em;bottom:-.3em;font-size:clamp(7rem,18vw,19rem);font-weight:800;line-height:.8;letter-spacing:-.15em;color:var(--brand-ink);opacity:.9}.brand-art:after{content:"";position:absolute;width:50%;aspect-ratio:1;border:1px solid var(--brand-ink);border-radius:50%;left:8%;top:12%;opacity:.7}.brand-art span{font:500 .64rem var(--mono);text-transform:uppercase;position:relative;z-index:1;color:var(--brand-ink)}.brand-card .work-details p{color:#555}.about{background:#c9c5ba;padding-top:7rem;padding-bottom:7rem}.about-layout{display:grid;grid-template-columns:1.6fr .8fr;gap:5vw;margin-top:3rem}.about-copy{padding-top:.5rem;font-size:1rem;line-height:1.6}.about-copy p{margin:0 0 1.2rem}.about-copy .text-link{margin-top:1rem}.skills{border-top:1px solid var(--line);margin-top:7rem;padding-top:1.2rem;display:grid;grid-template-columns:1fr 3fr}.skills ul{padding:0;margin:0;list-style:none;display:flex;flex-wrap:wrap;gap:.5rem 1.6rem}.skills li{font-size:clamp(1rem,1.7vw,1.5rem);letter-spacing:-.05em}.contact{padding-top:7rem;padding-bottom:2rem;background:var(--acid);min-height:85vh;display:flex;flex-direction:column}.contact-title{margin:3rem 0 auto}.contact-email{font-size:clamp(1.4rem,3vw,3.5rem);letter-spacing:-.075em;text-decoration:none;color:var(--ink);border-bottom:2px solid var(--ink);padding-bottom:.4rem;align-self:flex-start}.contact-email span{font-family:var(--mono);font-size:.55em}.contact-meta{border-top:1px solid var(--ink);margin-top:6rem;padding-top:1rem;display:flex;justify-content:space-between;gap:2rem;font:400 .66rem var(--mono);text-transform:uppercase;line-height:1.55}.contact-meta p{max-width:330px;margin:0}.contact-meta div{display:flex;gap:1.5rem}.contact-meta a{color:inherit}footer{background:var(--ink);color:var(--paper);padding:1.25rem 5vw;display:flex;align-items:center;justify-content:space-between}footer p{font:400 .6rem var(--mono);text-transform:uppercase;margin:0;color:#aaa}.reveal{transition:opacity .7s ease,transform .7s ease}.js .reveal{opacity:0;transform:translateY(20px)}.js .reveal.is-visible{opacity:1;transform:none}dialog{border:0;background:#111;color:white;width:min(1000px,92vw);padding:0;overflow:visible}dialog::backdrop{background:rgba(0,0,0,.82);backdrop-filter:blur(5px)}.video-frame{aspect-ratio:16/9;background:#222}.video-frame iframe{width:100%;height:100%;border:0}.close-modal{position:absolute;right:0;top:-46px;border:0;background:none;color:white;font-size:2.3rem;cursor:pointer}
@media(max-width:700px){.site-header{height:70px}.site-nav{display:none;position:absolute;right:5vw;top:60px;background:var(--ink);padding:1.2rem;flex-direction:column;gap:1rem}.site-nav.open{display:flex}.site-nav a{color:var(--paper)}.menu-toggle{display:flex;gap:.5rem;align-items:center;background:none;border:0;font:500 .65rem var(--mono);text-transform:uppercase}.menu-toggle span{display:block;width:15px;height:1px;background:currentColor}.hero{min-height:calc(100vh - 70px);padding-top:4.5rem}.hero-title{font-size:clamp(3.1rem,15vw,5.5rem)}.section-heading,.about-layout,.skills{display:block}.section-heading h2{margin:1.4rem 0}.section-intro{max-width:380px}.motion-grid{display:block}.motion-card{margin-bottom:2.8rem}.motion-card:nth-child(n){grid-column:auto}.brand-grid{grid-template-columns:1fr;gap:2.5rem}.brand-card:nth-child(1){grid-column:auto}.about-copy{margin-top:2rem}.skills{margin-top:4.5rem}.skills .eyebrow{margin-bottom:1.2rem}.skills ul{gap:.5rem 1rem}.contact{min-height:75vh}.contact-meta{margin-top:4rem;display:block}.contact-meta div{margin-top:1.2rem}footer{gap:1rem}footer p{display:none}}

/*-inspired presentation: dark film-grain canvas, compact frames, neon and blue accents. */
:root{--ink:#111214;--paper:#f1f1ee;--acid:#c9ff43;--muted:#a6a7a7;--line:rgba(255,255,255,.13)}body{background:var(--ink);color:var(--paper)}.grain{opacity:.16;mix-blend-mode:screen}.site-header{position:fixed;top:20px;left:50%;transform:translateX(-50%);width:min(91vw,740px);height:62px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(27,28,32,.85);backdrop-filter:blur(16px);padding:6px 8px 6px 14px}.wordmark{display:flex;align-items:center;gap:.45rem;letter-spacing:0}.wordmark b{width:42px;height:42px;border:1px solid rgba(255,255,255,.35);border-radius:50%;display:grid;place-items:center;font-size:1.4rem;color:var(--paper)}.wordmark span{font:600 .63rem var(--mono);vertical-align:middle;margin:0;letter-spacing:.05em}.site-nav{height:100%;align-items:center;gap:.15rem}.site-nav a{padding:.8rem 1rem;border-radius:999px;color:#e9e9e9;font:600 .78rem var(--sans);text-transform:none}.site-nav a:last-child{background:#4d88f7;color:#fff;box-shadow:0 0 20px rgba(67,127,255,.35)}.hero{padding-top:12rem;min-height:100vh;background:radial-gradient(circle at 45% 43%,rgba(55,58,59,.16),transparent 16%),var(--ink)}.hero-title{font-family:var(--sans);font-weight:800;font-size:clamp(3.4rem,8vw,8rem);max-width:920px;line-height:.95;letter-spacing:-.075em}.hero-title em,h2 em{font-family:var(--sans);font-style:normal;color:var(--acid);letter-spacing:inherit}.hero-bottom{border-top:1px solid var(--line);padding-top:1.4rem}.hero-bottom p{color:#c1c2c2}.round-link{border-color:var(--acid);color:var(--acid)}.round-link:hover{background:var(--acid);color:var(--ink)}.work-section,.branding-section,.about{background:var(--ink);color:var(--paper);padding-top:7rem;padding-bottom:7rem}.section-heading{grid-template-columns:1fr 2.2fr 1fr;margin-bottom:3rem}.section-heading .eyebrow,.eyebrow{color:var(--acid)}.section-intro{color:#aeb0b0}.motion-grid{display:block}.motion-card:nth-child(n){display:block;margin:0;border:1px solid var(--line);border-bottom:0}.motion-card:last-child{border-bottom:1px solid var(--line)}.video-button{display:grid;grid-template-columns:108px 1fr;width:100%;min-height:116px;align-items:stretch}.video-poster{aspect-ratio:auto;min-height:114px;margin:10px;background:var(--card-color);padding:.75rem;border-radius:8px}.video-poster:before{width:100%;height:100%;top:0;right:0;transform:rotate(0)}.play{place-content:center}.play i{width:35px;height:35px;font-size:.6rem;background:var(--paper)}.play b{display:none}.work-details{padding:1.15rem 1.5rem;align-self:center;grid-template-columns:1fr auto;position:relative}.work-details:before{content:'⌄';position:absolute;right:1.35rem;top:50%;transform:translateY(-50%);color:#ccc}.work-details h3{font-size:1.1rem}.work-details p{font-family:var(--sans);text-transform:none;font-size:.85rem;letter-spacing:0;color:#9c9e9e;max-width:590px}.work-details span{display:none}.motion-card:hover{background:rgba(255,255,255,.035)}.motion-card:hover .video-poster{transform:none}.text-link{margin-top:2.8rem;border:0;background:var(--acid);color:var(--ink);border-radius:999px;padding:.75rem 1.2rem;font:700 .75rem var(--sans)}.branding-section .section-heading{grid-template-columns:1fr 2fr}.frame-wall{overflow:hidden;margin:0 -5vw;padding:0 0 2rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#16171a}.brand-grid{display:flex;width:max-content;gap:0;animation:frame-wall 32s linear infinite}.frame-wall:hover .brand-grid{animation-play-state:paused}.brand-card,.brand-card:nth-child(1){width:clamp(180px,20vw,300px);flex:0 0 clamp(180px,20vw,300px);border-right:1px solid rgba(255,255,255,.16);padding:1rem}.brand-art{height:clamp(150px,18vw,260px);border-radius:4px}.brand-card .work-details{display:block;padding:.85rem 0 0}.brand-card .work-details:before{display:none}.brand-card .work-details h3{font-size:.84rem}.brand-card .work-details p{font-size:.64rem;color:#a6a7a7}.branding-section .text-link{margin-top:3rem}@keyframes frame-wall{to{transform:translateX(-50%)}}.about{border-top:1px solid var(--line)}.about-copy{color:#b8baba}.skills{border-color:var(--line)}.skills li{color:#e9e9e9}.contact{background:var(--ink);color:var(--paper);border-top:1px solid var(--line);min-height:auto;padding-bottom:5rem}.contact-email{color:var(--acid);border-color:var(--acid);margin-top:3rem}.contact-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;margin-top:5rem;border-top:1px solid var(--line);padding-top:1.4rem}.contact-meta{border:0;margin:0;padding:0;display:block;color:#aeb0b0}.contact-meta div{margin-top:1.8rem}.contact-meta a{color:var(--paper)}.project-form{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}.project-form label{display:grid;gap:.45rem;font:500 .64rem var(--mono);text-transform:uppercase;letter-spacing:.05em;color:#aeb0b0}.project-form input,.project-form select,.project-form textarea{width:100%;border:1px solid var(--line);border-radius:4px;background:#191a1d;color:var(--paper);padding:.8rem;font:400 .87rem var(--sans);outline:none}.project-form input:focus,.project-form select:focus,.project-form textarea:focus{border-color:var(--acid)}.project-form .full{grid-column:1/-1}.send-button{justify-self:start;border:0;border-radius:999px;background:#4d88f7;color:#fff;padding:.85rem 1.15rem;font:700 .78rem var(--sans);cursor:pointer}.send-button span{margin-left:1.5rem}footer{background:#0b0c0d;border-top:1px solid var(--line)}footer .wordmark b{width:28px;height:28px;font-size:.9rem}footer .wordmark span{display:none}@media(max-width:700px){.site-header{top:12px;width:94vw}.site-header .wordmark span{display:none}.site-nav{top:68px;right:0;border:1px solid var(--line);border-radius:14px;background:#191a1d}.site-nav a:last-child{background:transparent;box-shadow:none}.menu-toggle{color:var(--paper)}.hero{padding-top:9rem}.section-heading,.branding-section .section-heading{display:block}.video-button{grid-template-columns:82px 1fr;min-height:98px}.video-poster{min-height:78px;margin:8px}.work-details{padding:.8rem 1.8rem .8rem .75rem}.work-details p{font-size:.72rem}.contact-layout{display:block;margin-top:3.5rem}.project-form{margin-top:2.4rem}.contact-meta div{display:flex}.brand-card,.brand-card:nth-child(1){width:180px;flex-basis:180px}.brand-art{height:150px}}
.video-poster.has-thumbnail {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.video-poster.has-thumbnail::after {
  background: linear-gradient(
    90deg,
    rgba(0, 0, 0, 0.22),
    rgba(0, 0, 0, 0.04)
  );
}
.brand-art.has-brand-image {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.brand-art.has-brand-image::before,
.brand-art.has-brand-image::after {
  display: none;
}

.brand-art.has-brand-image span {
  background: rgba(17, 18, 20, 0.76);
  color: #fff;
  padding: 0.35rem 0.45rem;
  border-radius: 3px;
}

.expertise-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.2rem;
  margin-top: 5rem;
}

.expertise-block {
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 10px;
  padding: 1.4rem;
  background: rgba(255, 255, 255, 0.02);
}

.expertise-block .eyebrow {
  margin-bottom: 1.2rem;
}

.what-i-do-box,
.tools-box {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.what-i-do-box span,
.tools-box span {
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  padding: 0.7rem 0.85rem;
  color: #f1f1ee;
  font-size: 0.82rem;
  line-height: 1;
}

.what-i-do-box span {
  background: #191a1d;
  border-color: rgba(255, 255, 255, 0.12);
  color: #d9d9d9;
  font-weight: 700;
}

.tools-box span {
  background: #191a1d;
  color: #d9d9d9;
}

@media (max-width: 700px) {
  .expertise-grid {
    grid-template-columns: 1fr;
    margin-top: 3.5rem;
  }
}
