@font-face{font-family:Familjen Grotesk;src:url(/fonts/familjen-grotesk.woff2)format("woff2");font-style:normal;font-weight:400 700;font-display:swap}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:oklch(10% .004 25);--surface:oklch(14% .005 25);--ink:oklch(97% 0 0);--muted:oklch(72% .008 25);--quiet:oklch(58% .008 25);--line:oklch(29% .008 25);--signal:oklch(63% .19 15);--signal-2:oklch(80% .13 70);--grad-accent:linear-gradient(100deg, var(--signal), var(--signal-2));--font:"Familjen Grotesk", "Arial", sans-serif;--gutter:clamp(1rem, 2.8vw, 2.75rem);--section-space:clamp(4.5rem, 8vw, 8rem);--surface-2:oklch(18% .006 25);--radius-sm:10px;--radius-md:16px;--radius-lg:22px;--radius-pill:999px;--z-header:20;--z-backdrop:40;--z-dialog:50;--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-fluid:cubic-bezier(.32, .72, 0, 1);--shadow-soft:0 1px 1.5px oklch(0% 0 25/.3), 0 10px 28px -12px oklch(0% 0 25/.5);--shadow-raised:inset 0 1px 0 oklch(100% 0 0/.07), 0 1px 2px oklch(0% 0 25/.32), 0 16px 40px -16px oklch(0% 0 25/.62)}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--bg);scroll-padding-top:88px}body{background:var(--bg);min-width:320px;color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased;margin:0;font-size:16px;line-height:1.55}body.dialog-open{overflow:hidden}::selection{color:var(--bg);background:var(--ink)}h1,h2,h3,p{margin:0}h1,h2,h3{text-wrap:balance}p{text-wrap:pretty}a{color:inherit;text-decoration:none}button{color:inherit;font:inherit}img,iframe{max-width:100%;display:block}:focus-visible{outline:2px solid var(--signal);outline-offset:3px}.site-header{z-index:var(--z-header);min-height:60px;margin:.75rem var(--gutter) 0;background:color-mix(in oklch, var(--surface) 88%, transparent);border:1px solid color-mix(in oklch, var(--ink) 9%, transparent);border-radius:var(--radius-pill);box-shadow:var(--shadow-raised);justify-content:space-between;align-items:center;gap:2rem;padding:.4rem .55rem .4rem 1.15rem;display:flex;position:sticky;top:.75rem}@supports ((-webkit-backdrop-filter:blur(18px)) or (backdrop-filter:blur(18px))){.site-header{background:color-mix(in oklch, var(--surface) 94%, transparent);-webkit-backdrop-filter:blur(18px)saturate(1.15);backdrop-filter:blur(18px)saturate(1.15)}}@property --hdr-fade{syntax:"<number>";inherits:false;initial-value:1}@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:scroll()){.site-header{opacity:var(--hdr-fade);transition:opacity .26s var(--ease-fluid);animation:linear both header-recede;animation-timeline:scroll();animation-range:60px 260px}.site-header:hover,.site-header:focus-within{opacity:1}}}@keyframes header-recede{to{--hdr-fade:.94}}.logo{flex:none;align-items:center;gap:.6rem;display:inline-flex}.logo img{width:clamp(137px,15vw,149px);height:auto}.logo-mark{fill:url(#logo-mark-gradient);flex:none;width:19px;height:19px;transition:filter .22s;transform:translateY(-31%)}.logo:hover .logo-mark,.logo:focus-visible .logo-mark{filter:brightness(1.12)saturate(1.08)}.logo-mark rect{transform-box:fill-box;transform-origin:50%}@media (prefers-reduced-motion:no-preference){.logo:hover .logo-mark rect{animation:logo-eq .76s var(--ease-fluid) infinite alternate}.logo:hover .logo-mark rect:first-child{animation-delay:0s}.logo:hover .logo-mark rect:nth-child(2){animation-delay:.12s}.logo:hover .logo-mark rect:nth-child(3){animation-delay:.24s}.logo:hover .logo-mark rect:nth-child(4){animation-delay:90ms}.logo:hover .logo-mark rect:nth-child(5){animation-delay:.2s}}@keyframes logo-eq{0%{transform:scaleY(.55)}to{transform:scaleY(1)}}.site-header nav{align-items:center;gap:.3rem;display:flex}.site-header nav a{min-height:44px;color:var(--muted);border-radius:var(--radius-pill);transition:color .22s var(--ease-fluid), background .22s var(--ease-fluid);align-items:center;padding:0 1.05rem .18em;font-size:.9rem;font-weight:600;line-height:1;display:inline-flex}.site-header nav a:hover,.site-header nav a:focus-visible{color:var(--ink);background:color-mix(in oklch, var(--ink) 8%, transparent)}.site-header nav a:active{transform:scale(.97)}.menu-button{background:color-mix(in oklch, var(--ink) 8%, transparent);border-radius:var(--radius-pill);cursor:pointer;min-height:44px;transition:background .22s var(--ease-fluid);border:0;justify-content:center;align-items:center;padding:0 1.05rem .18em;font-size:.9rem;font-weight:600;line-height:1;display:none}.menu-button:hover{background:color-mix(in oklch, var(--ink) 13%, transparent)}.menu-button:active{transform:scale(.96)}.intro{min-height:390px;padding:clamp(4rem, 7vw, 7rem) var(--gutter) clamp(3rem, 5vw, 5rem);border-bottom:1px solid var(--line);grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr);align-items:end;gap:clamp(2rem,6vw,7rem);display:grid}.intro h1{letter-spacing:-.022em;text-wrap:balance;max-width:17ch;animation:hero-copy-in .82s var(--ease-out);font-size:clamp(2.9rem,6.8vw,6.6rem);font-weight:500;line-height:1.02}.hero-accent{background:var(--grad-accent);color:#0000;animation:hero-copy-in .82s var(--ease-out) .12s backwards;-webkit-background-clip:text;background-clip:text;display:inline-block}.intro-copy p{max-width:46ch;color:var(--muted);animation:hero-copy-in .76s var(--ease-out) .22s backwards;margin-top:1.2rem;font-size:clamp(1rem,1.2vw,1.15rem)}.hero-catalog-link{color:oklch(13% .005 25);background:var(--ink);border-radius:var(--radius-pill);letter-spacing:-.008em;white-space:nowrap;min-height:54px;transition:transform .34s var(--ease-fluid), background .22s ease, box-shadow .34s var(--ease-fluid);animation:hero-action-in .72s var(--ease-out) .32s backwards;place-self:end;align-items:center;padding:.85rem 1.8rem calc(.85rem + .18em);font-size:clamp(1.02rem,1.3vw,1.2rem);font-weight:600;display:inline-flex;box-shadow:inset 0 1px oklch(100% 0 0/.24),0 1px 2px oklch(0% 0 25/.3),0 18px 40px -18px oklch(0% 0 25/.7)}.hero-catalog-link:focus-visible{outline:2px solid var(--signal);outline-offset:4px}.hero-catalog-link:hover{background:color-mix(in oklch, var(--ink) 88%, var(--bg));transform:translateY(-2px);box-shadow:inset 0 1px oklch(100% 0 0/.28),0 2px 4px oklch(0% 0 25/.3),0 22px 48px -18px oklch(0% 0 25/.75)}.hero-catalog-link:active{transition-duration:.1s;transform:translateY(0)scale(.97)}.work{padding:clamp(2.5rem, 5vw, 4.5rem) var(--gutter) var(--section-space)}.work-toolbar{justify-content:space-between;align-items:center;gap:2rem;margin-bottom:clamp(1.5rem,3vw,2.5rem);display:flex}.work-toolbar h2{letter-spacing:-.025em;font-size:clamp(1.75rem,3vw,2.6rem);font-weight:500}.filters{flex-wrap:wrap;justify-content:flex-end;gap:.35rem;display:flex}.filters button{min-height:40px;color:var(--muted);border-radius:var(--radius-pill);cursor:pointer;transition:color .24s var(--ease-fluid), background .24s var(--ease-fluid), box-shadow .24s var(--ease-fluid);background:0 0;border:0;padding:.45rem 1rem calc(.45rem + .18em);font-size:.82rem;font-weight:600}.filters button span{color:var(--quiet);font-variant-numeric:tabular-nums;margin-left:.3rem;font-weight:400}.filters button:hover{color:var(--ink);background:color-mix(in oklch, var(--ink) 7%, transparent)}.filters button[aria-pressed=true]{color:var(--ink);background:color-mix(in oklch, var(--ink) 9%, transparent)}.filters button:focus-visible{outline:2px solid var(--signal);outline-offset:3px}.filters button[aria-pressed=true] span{color:var(--muted)}.filters button:active{transition-duration:.1s;transform:scale(.96)}.catalog-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:clamp(1.5rem,2.4vw,2.25rem) clamp(.9rem,1.6vw,1.4rem);display:grid}.work-item{min-width:0;animation:catalog-item-in .52s var(--ease-out) backwards;animation-delay:calc(var(--stagger,0) * 32ms)}.work-item button{width:100%;color:inherit;text-align:left;border-radius:var(--radius-md);cursor:pointer;background:0 0;border:0;padding:0}.work-item button:focus-visible{outline:1px solid var(--ink);outline-offset:4px}.work-item button:active .cover{transition-duration:.1s;transform:scale(.985)}.cover{aspect-ratio:1;background:var(--surface);border-radius:var(--radius-lg);box-shadow:inset 0 1px 0 oklch(100% 0 0/.06), var(--shadow-soft);transition:transform .34s var(--ease-fluid), box-shadow .34s var(--ease-fluid);display:block;position:relative;overflow:hidden}.cover:after{content:"";pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px color-mix(in oklch, var(--ink) 8%, transparent);position:absolute;inset:0}.cover img{object-fit:cover;width:100%;height:100%;transition:transform .56s var(--ease-fluid), filter .26s ease}.work-item button:hover .cover,.work-item button:focus-visible .cover{transform:translateY(-4px);box-shadow:inset 0 1px oklch(100% 0 0/.07),0 2px 3px oklch(0% 0 25/.3),0 22px 44px -16px oklch(0% 0 25/.66)}.work-item button:hover .cover img,.work-item button:focus-visible .cover img{filter:brightness(.78);transform:scale(1.04)}.play-cue{z-index:1;width:54px;height:54px;color:var(--ink);border-radius:var(--radius-pill);opacity:0;transition:transform .3s var(--ease-fluid), opacity .2s ease;background:oklch(0% 0 25/.56);border:0;place-items:center;margin:auto;font-size:.72rem;display:grid;position:absolute;inset:0;transform:scale(.85)}.work-item button:hover .play-cue,.work-item button:focus-visible .play-cue{opacity:1;transform:scale(1)}.work-meta{padding-top:.65rem;line-height:1.25;display:block}.work-meta strong,.work-meta>span{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.work-meta strong{font-size:.84rem;font-weight:600}.work-meta>span{color:var(--muted);margin-top:.12rem;font-size:.78rem}.work-meta small{color:var(--quiet);margin-top:.14rem;font-size:.7rem;display:block}.dialog-backdrop{z-index:var(--z-backdrop);background:color-mix(in oklch, var(--bg) 86%, transparent);place-items:center;padding:clamp(1rem,4vw,4rem);animation:.18s both backdrop-in;display:grid;position:fixed;inset:0}@supports ((-webkit-backdrop-filter:blur(20px)) or (backdrop-filter:blur(20px))){.dialog-backdrop{background:color-mix(in oklch, var(--bg) 68%, transparent);-webkit-backdrop-filter:blur(20px)saturate(1.1);backdrop-filter:blur(20px)saturate(1.1)}}.project-dialog{z-index:var(--z-dialog);background:color-mix(in oklch, var(--ink) 5%, var(--surface));border:1px solid color-mix(in oklch, var(--ink) 10%, transparent);border-radius:var(--radius-lg);width:min(1050px,100%,177.778svh - 16rem);animation:dialog-in .32s var(--ease-out) both;padding:.5rem;position:relative;box-shadow:inset 0 1px oklch(100% 0 0/.08),0 2px 4px oklch(0% 0 25/.34),0 32px 80px -24px oklch(0% 0 25/.78)}.dialog-close{width:44px;height:44px;color:var(--muted);background:color-mix(in oklch, var(--surface) 92%, transparent);border:1px solid color-mix(in oklch, var(--ink) 10%, transparent);border-radius:var(--radius-pill);cursor:pointer;transition:color .2s ease, background .22s var(--ease-fluid);place-items:center;padding:0;font-size:1.35rem;font-weight:400;line-height:1;display:grid;position:absolute;top:-3.4rem;right:0;box-shadow:0 2px 8px -2px oklch(0% 0 25/.5)}.dialog-close:hover{color:var(--ink);background:var(--surface-2)}.dialog-close:active{transform:scale(.94)}.dialog-video{aspect-ratio:16/9;border-radius:calc(var(--radius-lg) - .5rem);background:#000;overflow:hidden;box-shadow:inset 0 0 0 1px oklch(100% 0 0/.06)}.dialog-video iframe{border:0;width:100%;height:100%}.clients{padding:clamp(2.5rem, 4.5vw, 4rem) var(--gutter);background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.services-title{margin-bottom:clamp(2rem,4vw,3.5rem)}.client-marquee{min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 7% 93%,#0000);mask-image:linear-gradient(90deg,#0000,#000 7% 93%,#0000)}.client-marquee:focus-visible{outline:2px solid var(--signal);outline-offset:4px;border-radius:var(--radius-sm)}.client-track{will-change:transform;align-items:center;width:max-content;animation:27s linear infinite client-marquee;display:flex}.client-marquee:hover .client-track,.client-marquee:focus .client-track{animation-play-state:paused}.client-logo-set{flex:none;align-items:center;gap:clamp(1.5rem,4vw,4rem);padding-inline:clamp(.75rem,2vw,2rem);display:flex}.client-logo-set img{object-fit:contain;opacity:.78;flex:none;width:auto;max-width:clamp(150px,16vw,210px);height:clamp(44px,4.6vw,62px);transition:opacity .16s}.client-logo-set img:hover{opacity:1}.services{padding:var(--section-space) var(--gutter)}.services-title h2{letter-spacing:-.02em;font-size:clamp(1.8rem,2.8vw,2.75rem);font-weight:600;line-height:1.1}.services-title p{max-width:44ch;color:var(--muted);margin-top:.75rem}.service-list{border-top:1px solid var(--line)}.service-list article{border-bottom:1px solid var(--line);grid-template-columns:minmax(190px,.45fr) minmax(280px,1.55fr);gap:clamp(1rem,4vw,4rem);padding:clamp(1.4rem,2.8vw,2.4rem) 0;display:grid}.service-list h3{letter-spacing:-.02em;font-size:clamp(1.2rem,2vw,1.7rem);font-weight:600}.service-list p{max-width:57ch;color:var(--muted)}.contact{padding:clamp(4rem, 8vw, 7.5rem) var(--gutter) 1.75rem;color:var(--ink);background:var(--surface-2);border-top:1px solid var(--line)}.contact-heading h2{letter-spacing:-.025em;font-size:clamp(2.5rem,5.4vw,5.4rem);font-weight:500;line-height:1}.contact-email{color:color-mix(in oklch, var(--signal) 75%, white);letter-spacing:-.015em;-webkit-user-select:all;user-select:all;margin-top:clamp(1rem,1.8vw,1.5rem);font-size:clamp(1.3rem,2.4vw,2rem);font-weight:500}.contact-details{justify-content:space-between;align-items:center;gap:2rem;margin-top:2rem;font-size:.78rem;display:flex}.contact-details p{color:var(--muted)}@keyframes backdrop-in{0%{opacity:0}to{opacity:1}}@keyframes dialog-in{0%{transform:translateY(12px)}to{transform:translateY(0)}}@keyframes hero-copy-in{0%{opacity:0;filter:blur(6px);transform:translateY(26px)}to{opacity:1;filter:blur();transform:translateY(0)}}@keyframes hero-action-in{0%{filter:saturate(.35);transform:translateY(20px)scale(.97)}to{filter:saturate();transform:translateY(0)scale(1)}}@keyframes catalog-item-in{0%{filter:saturate(.55)contrast(.96);transform:translateY(14px)scale(.985)}to{filter:saturate()contrast();transform:translateY(0)scale(1)}}@keyframes client-marquee{to{transform:translate(-50%)}}@media (width<=900px){.intro{grid-template-columns:1fr;min-height:360px}.hero-catalog-link{justify-self:start}}@media (width<=640px){html{scroll-padding-top:76px}.site-header{min-height:56px;margin:.5rem .75rem 0;padding:.3rem .4rem .3rem .9rem;top:.5rem}.logo{gap:.5rem}.logo img{width:132px}.logo-mark{width:17px;height:17px}.menu-button{display:inline-flex}.site-header nav{background:var(--surface);border:1px solid color-mix(in oklch, var(--ink) 9%, transparent);border-radius:var(--radius-lg);transform-origin:top;opacity:0;visibility:hidden;transition:transform .32s var(--ease-fluid), opacity .24s ease, visibility 0s linear .32s;gap:.25rem;padding:.5rem;display:grid;position:fixed;top:4.7rem;left:.75rem;right:.75rem;transform:translateY(-16px)scale(.98);box-shadow:inset 0 1px oklch(100% 0 0/.07),0 2px 4px oklch(0% 0 25/.4),0 24px 56px -16px oklch(0% 0 25/.72)}.site-header nav.is-open{opacity:1;visibility:visible;transition-delay:0s;transform:translateY(0)scale(1)}.site-header nav a{border-radius:calc(var(--radius-lg) - .5rem);align-items:center;min-height:52px;padding:0 1rem;display:flex}.intro{min-height:auto;padding-top:3.5rem}.intro h1{font-size:clamp(2.5rem,12vw,3.9rem)}.hero-catalog-link{justify-content:space-between;width:100%;margin-top:.5rem}.work-toolbar{flex-direction:column;align-items:flex-start;gap:1rem}.filters{justify-content:flex-start}.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.services-title{margin-bottom:2rem}.service-list article{grid-template-columns:1fr;gap:.65rem}.contact-email{font-size:clamp(1.1rem,5.6vw,1.35rem)}.contact-details{flex-direction:column;align-items:flex-start;gap:.5rem}.dialog-backdrop{padding:.75rem}.project-dialog{width:100%}.dialog-close{width:40px;height:40px;top:-3.2rem}}@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){.client-marquee,.services-title,.service-list article,.contact-heading{animation:both soft-rise;animation-timeline:view();animation-range:entry entry 90%}}}@keyframes soft-rise{0%{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:.01ms!important}.client-marquee{overflow:visible;-webkit-mask-image:none;mask-image:none}.client-track{width:100%;transform:none}.client-logo-set{flex-wrap:wrap;justify-content:center;width:100%}.client-logo-set[aria-hidden=true]{display:none}}
