:root{--black:#070707;--white:#f2f1f4;--muted:#85838b;--line:rgba(242,241,244,.16);--violet:#8b5cf6;--gutter:clamp(24px,4.2vw,68px);--ambient-a:rgba(105,76,168,.13);--ambient-b:rgba(40,91,112,.1);--ambient-c:rgba(160,72,100,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth;overflow-x:hidden}body{margin:0;overflow-x:hidden;background:radial-gradient(ellipse 70% 48% at 8% 12%,var(--ambient-a),transparent 72%),radial-gradient(ellipse 65% 50% at 92% 18%,var(--ambient-b),transparent 72%),radial-gradient(ellipse 78% 60% at 48% 100%,var(--ambient-c),transparent 72%),var(--black);background-attachment:fixed;color:var(--white);font-family:Manrope,Arial,sans-serif;font-size:14px;line-height:1.45}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}
.site-header{height:92px;padding:0 var(--gutter);display:flex;align-items:center;justify-content:space-between;position:relative;z-index:5}.brand{font-size:19px;font-weight:600;letter-spacing:-.08em}.brand span{color:var(--violet)}.header-statement{position:absolute;left:50%;transform:translateX(-50%);margin:0;font:10px 'DM Mono',monospace;color:var(--muted);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}.site-nav{display:flex;gap:38px;font-size:13px;color:#aaa8ad}.site-nav a:first-child{color:var(--white)}.site-nav a:hover{color:var(--violet)}.menu-button{display:none;gap:4px;flex-direction:column}.menu-button span{width:22px;height:1px;background:var(--white)}
.eyebrow{margin:0;font:10px/1.2 'DM Mono',monospace;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}.work-section{padding:13px var(--gutter) 118px}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:44px}h1{font-size:clamp(42px,6vw,82px);font-weight:400;letter-spacing:-.075em;line-height:.94;margin:0 0 18px}.section-note{font:10px 'DM Mono',monospace;text-transform:uppercase;color:var(--muted)}.section-note span{color:var(--white)}
.gallery{display:grid;grid-template-columns:repeat(12,1fr);gap:44px 22px;align-items:start}.card{--drag-x:0px;--drag-y:0px;--glow-a:rgba(163,108,255,.9);--glow-b:rgba(83,151,196,.45);position:relative;z-index:0;cursor:grab;outline:none;transform:translate3d(var(--drag-x),var(--drag-y),0);will-change:transform;touch-action:pan-y;user-select:none}.card::before{content:"";position:absolute;z-index:-1;inset:-30px;border-radius:34px;background:radial-gradient(ellipse at 18% 50%,var(--glow-a) 0%,transparent 66%),radial-gradient(ellipse at 82% 50%,var(--glow-b) 0%,transparent 68%);filter:blur(27px);opacity:0;transform:scale(.84);transition:opacity .38s ease,transform .5s cubic-bezier(.2,.7,.2,1)}.card-image{overflow:hidden;background:#111;position:relative}.card-image img{display:block;width:100%;height:auto;filter:saturate(.94) contrast(1.05) brightness(1.02);transition:transform .8s cubic-bezier(.2,.7,.2,1),filter .55s ease}.card:hover,.card:focus-visible{z-index:2}.card:hover::before,.card:focus-visible::before,.card.is-dragging::before{opacity:1;transform:scale(1)}.card:hover .card-image img,.card:focus-visible .card-image img{transform:scale(1.045);filter:saturate(1.1) contrast(1.06) brightness(1.06)}.card.is-dragging{cursor:grabbing;z-index:10;touch-action:none}.card-meta{display:flex;justify-content:flex-start;gap:12px;padding-top:11px;font-size:14px;color:var(--white)}.card-type{padding-top:4px;font:9px 'DM Mono',monospace;color:var(--muted);letter-spacing:.17em;text-transform:uppercase}
.card-1{grid-column:span 5}.card-2{grid-column:7/span 5;margin-top:54px}.card-3{grid-column:2/span 4;margin-top:-30px}.card-4{grid-column:7/span 5;margin-top:4px}.card-5{grid-column:1/span 4;margin-top:17px}.card-6{grid-column:7/span 5;margin-top:46px}.card-7{grid-column:2/span 4;margin-top:18px}.card-8{grid-column:7/span 5;margin-top:-14px}.card-9{grid-column:1/span 4;margin-top:26px}.card-10{grid-column:6/span 5;margin-top:10px}.card-11{grid-column:2/span 4;margin-top:-4px}
.about-section{border-top:1px solid var(--line);padding:27px var(--gutter) 112px;display:grid;grid-template-columns:1fr 2fr;gap:30px}.about-copy{max-width:700px;margin:0;font-size:clamp(25px,3.7vw,50px);line-height:1.03;letter-spacing:-.055em}.contact-section{background:#101012;min-height:260px;padding:24px var(--gutter) 18px;display:flex;flex-direction:column;justify-content:space-between}.contact-top,.contact-bottom{display:flex;justify-content:space-between;gap:20px;font:10px 'DM Mono',monospace;text-transform:uppercase}.contact-actions{display:flex;flex-wrap:wrap;gap:10px}.contact-button{border:1px solid rgba(242,241,244,.3);border-radius:100px;padding:12px 15px;font:11px 'DM Mono',monospace;text-transform:uppercase;transition:.25s ease}.contact-button:hover{border-color:var(--violet);background:var(--violet);color:white}.contact-button span{margin-left:30px;font-size:15px}
.lightbox{position:fixed;inset:0;z-index:20;background:rgba(5,5,6,0);visibility:hidden;opacity:0;pointer-events:none;display:flex;align-items:center;justify-content:center;padding:60px 12vw;transition:background .55s ease,opacity .55s ease,visibility 0s linear .55s}.lightbox.open{background:rgba(5,5,6,.97);visibility:visible;opacity:1;pointer-events:auto;transition:background .55s ease,opacity .55s ease,visibility 0s linear 0s}.lightbox figure{position:relative;margin:0;max-width:100%;max-height:100%;text-align:center;opacity:0;transform:translateY(10px) scale(.985);transition:opacity .55s ease,transform .65s cubic-bezier(.2,.7,.2,1)}.lightbox.open figure{opacity:1;transform:translateY(0) scale(1)}.lightbox figure::before{content:"";position:absolute;z-index:-1;inset:-34px;border-radius:40px;background:radial-gradient(ellipse at 22% 50%,rgba(166,103,255,.68),transparent 66%),radial-gradient(ellipse at 80% 50%,rgba(75,151,218,.48),transparent 68%);background-size:190% 190%;filter:blur(28px);opacity:0;transition:opacity .55s ease}.lightbox.open figure::before{opacity:1;animation:glow-breathe 8s ease-in-out infinite}.lightbox img{display:block;max-width:100%;max-height:78vh;object-fit:contain}.lightbox figcaption{color:#aaa7b0;font:10px 'DM Mono',monospace;text-transform:uppercase;margin-top:14px}.lightbox-close,.lightbox-arrow{position:absolute;color:var(--white);font-size:30px;padding:15px}.lightbox-close{top:18px;right:28px;font-size:36px;font-weight:200}.lightbox-arrow{top:50%;transform:translateY(-50%);font-size:26px}.previous{left:28px}.next{right:28px}
@media(max-width:800px){.site-header{height:72px}.header-statement{display:none}.site-nav{display:none}.menu-button{display:flex}.work-section{padding-top:28px}.section-heading{display:block;margin-bottom:34px}.section-note{margin-top:22px}.gallery{grid-template-columns:repeat(2,1fr);gap:30px 10px}.card-1,.card-2,.card-3,.card-4,.card-5,.card-6,.card-7,.card-8,.card-9,.card-10,.card-11{grid-column:auto;margin-top:0}.about-section{display:block;padding-bottom:75px}.about-copy{margin-top:34px}.contact-top,.contact-bottom{display:flex}.contact-actions{margin:40px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.card{transform:none!important}}
.brand{display:inline-flex;align-items:center;letter-spacing:0}.brand-mark{display:block;width:25px;height:25px;border-radius:50%;background:radial-gradient(circle at 34% 28%,#d7c2ff 0%,#9b6cff 42%,#5b2bb7 100%);box-shadow:0 0 18px rgba(139,92,246,.32)}.header-wordmark{font-size:19px;font-weight:600;letter-spacing:-.08em;color:var(--white)}
@keyframes glow-breathe{0%,100%{opacity:1;transform:translate3d(0,0,0) scale(1)}50%{opacity:.74;transform:translate3d(0,-.35%,0) scale(1.045)}}
.card::before{mix-blend-mode:screen;will-change:transform,opacity;backface-visibility:hidden}.card:hover::before,.card:focus-visible::before,.card.is-dragging::before{animation:glow-breathe 10s cubic-bezier(.45,0,.55,1) infinite}
.contact-section{min-height:190px;justify-content:center;gap:48px}.contact-actions{width:100%;display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;gap:clamp(24px,5vw,72px)}.contact-button{white-space:nowrap}
@media(max-width:800px){.contact-section{min-height:138px;padding-top:16px;padding-bottom:12px;gap:24px}.contact-actions{width:calc(100% + (var(--gutter) * 2));margin-left:calc(var(--gutter) * -1);gap:0;justify-content:stretch}.contact-button{flex:1;min-width:0;padding:9px 4px;text-align:center;font-size:10px}.contact-button span{margin-left:4px}}
@media (hover:none),(pointer:coarse){.card:hover::before,.card:focus::before,.card:focus-visible::before,.card.is-dragging::before{opacity:0!important;transform:scale(.86)!important;animation:none!important}.card:hover .card-image img,.card:focus .card-image img,.card:focus-visible .card-image img{transform:none;filter:saturate(.94) contrast(1.05) brightness(1.02)}.card{cursor:pointer}}
@media (hover:none),(pointer:coarse){.card.is-touch-glow{z-index:2}.card.is-touch-glow::before{opacity:1!important;transform:scale(1)!important;animation:glow-breathe 8s ease-in-out infinite!important}}

/* Keep the glow on compositor-friendly properties so breathing stays fluid. */
.card::before,.lightbox figure::before{transform:translate3d(0,0,0) scale(.84);transform-origin:center;will-change:transform,opacity;backface-visibility:hidden;transition:opacity .65s cubic-bezier(.22,.61,.36,1),transform .8s cubic-bezier(.22,.61,.36,1)}
.card:hover::before,.card:focus-visible::before,.card.is-dragging::before{transform:translate3d(0,0,0) scale(1);animation-duration:10s;animation-timing-function:cubic-bezier(.45,0,.55,1)}
.lightbox figure::before{background-size:auto;transform:translate3d(0,0,0) scale(.96);transition-duration:.75s,.9s;transition-timing-function:cubic-bezier(.22,.61,.36,1)}
.lightbox.open figure::before{transform:translate3d(0,0,0) scale(1);animation-duration:10s;animation-timing-function:cubic-bezier(.45,0,.55,1)}
@media (hover:none),(pointer:coarse){.card.is-touch-glow::before{transform:translate3d(0,0,0) scale(1)!important;animation-duration:10s!important;animation-timing-function:cubic-bezier(.45,0,.55,1)!important}}

/* Simple glow: tint in, fade out, without moving or reshaping the gradient. */
@keyframes glow-fade{0%,100%{opacity:0}50%{opacity:.9}}
.card::before,.lightbox figure::before{transform:none;will-change:opacity;transition:opacity .7s ease}
.card:hover::before,.card:focus-visible::before,.card.is-dragging::before,.lightbox.open figure::before{transform:none;animation:glow-fade 6s ease-in-out infinite}
@media (hover:none),(pointer:coarse){.card.is-touch-glow::before{transform:none!important;animation:glow-fade 6s ease-in-out infinite!important}}

.lightbox img{opacity:1;transition:opacity .3s ease}
.lightbox.is-loading img{opacity:0}
.lightbox-loader{position:fixed;top:50%;left:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border:2px solid rgba(242,241,244,.18);border-top-color:rgba(242,241,244,.9);border-radius:50%;opacity:0;visibility:hidden;animation:loader-spin 2s linear infinite;transition:opacity 1s ease;pointer-events:none}
.lightbox.is-loading .lightbox-loader{opacity:1;visibility:visible}
@keyframes loader-spin{to{transform:rotate(360deg)}}

/* Decorative motion is intentionally slowed to one tenth of its prior speed. */
.card::before,.lightbox figure::before{transition-duration:70s}
.card-image img{transition-duration:80s,55s}
.contact-button{transition-duration:25s}
.lightbox{transition:background 1s ease,opacity 1s ease,visibility 0s linear 1s}
.lightbox.open{transition:background 1s ease,opacity 1s ease,visibility 0s linear 0s}
.lightbox figure{transition-duration:1s,1s}
.lightbox figure::before{transition-duration:1s}
.card:hover::before,.card:focus-visible::before,.card.is-dragging::before{animation-duration:600s}
.lightbox.open figure::before{animation-duration:5s}
.lightbox img{transition-duration:1s}
@media (hover:none),(pointer:coarse){.card.is-touch-glow::before{animation-duration:600s!important}}
