@font-face{font-family:HelveticaPortfolio;src:url('fonts/HelveticaNeueCyr-Roman.woff2') format('woff2');font-weight:400;font-display:swap}@font-face{font-family:HelveticaPortfolio;src:url('fonts/HelveticaNeueCyr-Medium.woff2') format('woff2');font-weight:500;font-display:swap}@font-face{font-family:GaramondPortfolio;src:url('fonts/ITCGaramondStd-BkCond.ttf') format('truetype');font-weight:400;font-display:swap}
:root{--bg:#F6F1E9;--fg:#000000;--muted:#000000;--u:min(1vw,14.4px);color-scheme:light}html[data-theme=dark]{--bg:#101010;--fg:#DFDAD3;--muted:#DFDAD3;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font-family:HelveticaPortfolio,'Helvetica Neue',Helvetica,Arial,sans-serif;transition:background-color .35s,color .35s}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:2px solid var(--fg);outline-offset:6px}button{border:0}h1,h2,h3,p{margin:0;font-weight:400}img{display:block;width:100%}main:focus{outline:none}[hidden]{display:none!important}.site{max-width:1440px;margin:auto}header{height:calc(var(--u)*6.18);padding:calc(var(--u)*1.53) calc(var(--u)*3.33) 0;display:flex;align-items:center;font-size:clamp(14px,1.667vw,24px);font-weight:500;text-transform:uppercase;line-height:1.42;gap:calc(var(--u)*4.7)}.brand{margin-right:auto;white-space:nowrap;padding-top:0}nav{display:flex;gap:calc(var(--u)*4.1);padding-top:0}.nav-link{position:relative}.nav-link:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .25s}.nav-link:focus-visible:after{transform:scaleX(1);transform-origin:left}.party-control{display:flex;align-items:center;gap:calc(var(--u)*1.05);white-space:nowrap}.segmented{display:flex;border-radius:999px;background:#E0DBD3;padding:4px;color:#000}.segmented button{background:transparent;border-radius:999px;color:#000000;text-transform:uppercase;font-weight:500;transition:background .25s,color .25s}.party-control button{font-size:clamp(14px,1.25vw,18px);line-height:1.45;padding:calc(var(--u)*.417) calc(var(--u)*.833)}.segmented button[aria-pressed=true]{background:#F877B3;color:#000000}.hero{position:relative;height:calc(var(--u)*49.79)}.name{font-family:GaramondPortfolio,Georgia,serif;font-size:calc(var(--u)*16.389);line-height:1.2;letter-spacing:0}.first-name{position:absolute;top:0;left:3.333%}.last-name{position:absolute;top:calc(var(--u)*30.28);left:35.486%;z-index:2}.disco{position:absolute;width:43.194%;height:calc(var(--u)*31.319);top:calc(var(--u)*5.556);left:28.403%;object-fit:fill;z-index:1}.intro{position:absolute;top:calc(var(--u)*39.444);left:1.875%;width:29.931%;font-size:calc(var(--u)*2.222);line-height:1.25}.work-section{padding:0 3.194% 0 2.153%}.filters{margin-left:-4px;display:inline-flex;margin-bottom:calc(var(--u)*3.54)}.filters button{font-size:clamp(16px,1.667vw,24px);line-height:1.417;padding:8px 16px}.gallery{display:flex;flex-direction:column;gap:calc(var(--u)*1.945)}.gallery-row{display:grid;gap:calc(var(--u)*2.22);height:calc(var(--u)*28.75)}.row-1{grid-template-columns:540fr 790fr}.row-2{grid-template-columns:717fr 615fr}.row-3{grid-template-columns:394fr 591fr;max-width:74.7%}.case-card{display:block;overflow:hidden;position:relative;background:#eee}.case-card img,.case-card video{display:block;width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.65,.3,1),filter .5s}.case-card:hover img,.case-card:hover video,.case-card:focus-visible img,.case-card:focus-visible video{transform:scale(1.035);filter:brightness(.9)}.case-card:focus-visible{outline-offset:3px}.filtered{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}.filtered .case-card{height:calc(var(--u)*28.75)}.contact{text-align:center;padding:calc(var(--u)*7.64) 20px calc(var(--u)*7.99)}.contact h2{font-family:GaramondPortfolio,Georgia,serif;font-size:calc(var(--u)*5.556);line-height:1.2}.contact a{display:inline-block;font-size:calc(var(--u)*2.222);line-height:1.16}.contact a:hover{text-decoration:underline;text-underline-offset:5px}.about{padding:calc(var(--u)*6.39) 3.333% 50px}.about h1,.about h2{font-size:clamp(32px,3.889vw,56px);line-height:1.214;font-weight:500;max-width:554px}.bio{max-width:678px}.bio-copy{font-size:clamp(19px,1.945vw,28px);line-height:1.214;color:var(--muted);margin-top:40px}.bio-copy p+p{margin-top:34px}.socials{display:flex;gap:40px;font-size:28px;margin-top:40px}.socials a{text-decoration:underline;text-underline-offset:3px}.experience{max-width:792px;margin-top:122px}.jobs{display:grid;gap:40px;margin-top:40px}.job{display:flex;justify-content:space-between;align-items:center;gap:24px}.job h3{font-size:24px;font-weight:500;line-height:40px}.job p{font-size:18px;line-height:24px}.job time{font-size:24px;color:var(--muted);white-space:nowrap}.get-in-touch{margin-top:116px}.get-in-touch h2{max-width:554px}.get-in-touch a{display:inline-block;margin-top:40px;color:var(--muted);font-size:56px;font-weight:500;line-height:68px}.get-in-touch a:hover{color:var(--fg)}footer{display:flex;justify-content:space-between;gap:24px;margin-top:147px;padding-bottom:50px;font-size:18px}footer .socials{font-size:18px;margin:0;gap:53px}.case-page{padding:70px 3.333% 90px}.back-link{font-size:18px;display:inline-block;margin-bottom:48px}.back-link:hover{text-decoration:underline}.case-page h1{font-family:GaramondPortfolio,Georgia,serif;font-size:clamp(60px,8vw,115px);line-height:1}.case-subtitle{font-size:clamp(20px,2.22vw,32px);margin-top:24px;color:var(--muted)}.case-cover{max-height:760px;object-fit:contain;background:color-mix(in srgb,var(--fg) 5%,var(--bg));margin:48px 0}.case-description{max-width:760px;font-size:24px;line-height:1.5}.case-next{display:inline-block;margin-top:60px;font-size:24px;text-decoration:underline;text-underline-offset:5px}.skip{position:fixed;top:-100px;left:16px;padding:12px;background:var(--bg);z-index:20}.skip:focus{top:16px}
@media(min-width:769px) and (max-width:1100px){header{gap:3vw}nav{gap:3vw}.party-control{gap:1vw}.brand{font-size:14px}.party-control>span{font-size:14px}.party-control .segmented{padding:3px}.party-control button{padding:3px 7px}.experience{margin-top:90px}}
@media(max-width:768px){:root{--u:1vw}header{height:auto;padding:22px 20px 0;display:grid;grid-template-columns:1fr auto;gap:22px 10px;font-size:14px}.brand{padding:0;grid-column:1/-1;font-size:15px}nav{padding:0;gap:25px;align-self:center}.party-control{gap:9px;font-size:12px}.party-control button{padding:5px 9px;font-size:12px;min-height:30px}.hero{height:136vw;margin-top:25px}.first-name{left:5%;font-size:28vw}.disco{width:90%;height:65.26vw;left:5%;top:20vw}.last-name{left:auto;right:4%;top:76vw;font-size:23.6vw}.intro{left:5%;top:107vw;width:85%;font-size:clamp(18px,4.6vw,28px);max-width:550px;line-height:1.3}.work-section{padding:0 20px}.filters{margin:0 0 28px}.filters button{min-height:44px;padding:6px 14px}.gallery{gap:18px}.gallery-row{display:flex;flex-direction:column;gap:18px;height:auto;max-width:none}.case-card{width:100%;aspect-ratio:1.4}.row-3 .case-card:last-child{aspect-ratio:1}.filtered{grid-template-columns:1fr;gap:18px}.filtered .case-card{height:auto;aspect-ratio:1.35}.contact{padding:72px 20px 80px}.contact h2{font-size:58px}.contact a{font-size:23px;margin-top:8px}.about{padding:65px 20px 32px}.about h1,.about h2{font-size:36px}.bio-copy{margin-top:28px;line-height:1.4}.bio-copy p+p{margin-top:24px}.socials{font-size:19px;gap:26px;margin-top:30px}.experience{margin-top:80px}.jobs{gap:32px;margin-top:28px}.job{display:block}.job h3{font-size:22px;line-height:32px}.job p{font-size:16px}.job time{display:block;font-size:16px;margin-top:8px}.get-in-touch{margin-top:80px}.get-in-touch a{font-size:36px;line-height:1.2;margin-top:28px}footer{margin-top:90px;flex-direction:column;padding-bottom:32px;font-size:14px}footer .socials{font-size:14px;gap:28px}.case-page{padding:55px 20px 65px}.back-link{margin-bottom:32px}.case-cover{margin:30px 0}.case-description{font-size:19px}.case-next{font-size:21px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}
.disco{overflow:hidden}.disco-canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none;opacity:0;transition:opacity .4s}.disco.is-ready .disco-canvas{opacity:1}
/* Helvetica's cap height sits high within its em box: center the control first,
   then apply a small optical correction to the label only. */
.segmented button{display:flex;align-items:center;justify-content:center;line-height:1;text-align:center}
.segmented button>span{display:block;line-height:1;transform:translateY(.09em)}
.party-control button{height:38px;padding:0 12px;min-width:51px}
.filters button{height:50px;padding:0 16px}
.hero{isolation:isolate}.first-name,.last-name{z-index:1}.disco{z-index:2}.intro{z-index:3}
/* Light spots move from right to left using the same phase as the 3D rotation. */
.party-lights{position:absolute;inset:-10% 0 0;overflow:hidden;z-index:0;pointer-events:none;opacity:0;transition:opacity .7s;contain:paint}
html[data-theme=dark] .party-lights{opacity:1}
.party-lights:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 38% 45% at 18% 37%,#CE1CA666,transparent 75%),radial-gradient(ellipse 36% 50% at 82% 55%,#CE1CA666,transparent 75%),radial-gradient(ellipse 28% 25% at 54% 19%,#CE1CA64d,transparent 80%),radial-gradient(ellipse 45% 12% at 53% 96%,#CE1CA655,transparent 80%)}
.party-lights .light-spot{position:absolute;left:0;display:block;border-radius:50%;background:radial-gradient(ellipse,rgba(255,255,255,.85) 0%,rgba(var(--light-rgb),1) 20%,rgba(var(--light-rgb),.6) 48%,rgba(var(--light-rgb),0) 75%);box-shadow:0 0 15px 3px rgba(var(--light-rgb),.5),0 0 34px 9px rgba(var(--light-rgb),.18);filter:blur(1.3px);will-change:transform}
@media(min-width:769px) and (max-width:1100px){.party-control button{height:30px;min-width:40px;padding:0 8px}}
@media(max-width:768px){.party-control button{height:30px;min-width:37px;padding:0 9px}.filters button{height:44px;padding:0 14px}.party-lights{inset:0 -0% 0}.party-lights i:nth-child(2){filter:blur(.5px)}}
@media(prefers-reduced-motion:reduce){.party-lights i{animation:none!important}}

/* The light theme keeps a clean cream background. */
html:not([data-theme=dark]) .party-lights{display:none}
/* Run once when the document opens; navigation and filters remain immediate. */
@keyframes site-appear{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){.site{animation:site-appear .85s cubic-bezier(.2,.65,.3,1) both}}

/* Figma case grid and case detail layouts. */
.work-section{padding:0 2.778%}
.gallery{gap:calc(var(--u)*1.667)}
.gallery-row{gap:calc(var(--u)*1.667);height:calc(var(--u)*28.75)}
.gallery-work .row-1{grid-template-columns:546fr 790fr}
.gallery-work .row-2{grid-template-columns:716fr 620fr}
.gallery-work .row-3{grid-template-columns:584fr 752fr;max-width:none}
.gallery-not-work .row-1{grid-template-columns:752fr 584fr}
.gallery-not-work .row-2{grid-template-columns:620fr 716fr}
.gallery-not-work .row-3{grid-template-columns:716fr 620fr;max-width:none}
.case-card img,.case-card video{object-fit:cover}
.case-page{padding:57px 0 120px}
.case-content{width:min(720px,calc(100% - 40px));margin:0 auto;display:flex;flex-direction:column;gap:32px}
.case-heading{display:flex;flex-direction:column;align-items:center;gap:8px;height:auto;padding:0;font-size:inherit;line-height:normal;text-transform:none;width:100%}
.back-link{display:inline-flex;align-items:center;gap:8px;margin:0;font-size:16px;line-height:22px;font-weight:500;text-transform:uppercase}
.back-link img{width:20px;height:20px}
html[data-theme=dark] .back-link img{filter:invert(1)}
.case-page h1{font-family:HelveticaPortfolio,'Helvetica Neue',Arial,sans-serif;font-size:48px;line-height:64px;font-weight:500;text-align:center}
.case-description{max-width:none;font-size:32px;line-height:44px;white-space:pre-line}
.case-media{display:flex;flex-direction:column;gap:32px}
.case-media-item{display:block;width:100%;height:auto;border:0;background:#000;object-fit:cover}.case-media video.case-media-item{object-fit:contain}
.case-media img.case-media-item{object-fit:cover}
.case-youtube{position:relative;overflow:hidden}
.case-youtube iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.case-page-compact .case-description{font-size:24px;line-height:32px}
.case-contact{padding:66px 20px 116px}

@media(max-width:768px){
 header{height:145px;padding:24px 19px 0;display:grid;grid-template-columns:1fr;grid-template-rows:34px 46px;gap:17px}
 .brand{display:none}
 nav{grid-row:1;justify-content:center;gap:69px;padding:0;font-size:20px;line-height:26px}
 .party-control{grid-row:2;justify-content:center;gap:16px;font-size:20px;line-height:26px}
 .party-control button{height:38px;min-width:auto;padding:0 12px;font-size:18px}
 .hero{height:600px;margin-top:0;max-height:none}
 .first-name{top:44px;left:50%;transform:translateX(-50%);font-size:98.723px;line-height:86px}
 .disco{top:103px;left:calc(50% - 184px);width:368px;height:267px}
 .last-name{top:356px;left:50%;right:auto;transform:translateX(-50%);font-size:98.723px;line-height:86px}
 .intro{top:503px;left:calc(50% - 177.5px);width:355px;font-size:24px;line-height:32px}
 .work-section{padding:0 16px}
 .filters{margin:24px 0 24px 3px}
 .filters button{height:50px;min-height:50px;padding:0 16px;font-size:24px}
 .gallery{gap:16px}
 .gallery-row{display:flex;flex-direction:column;gap:16px;height:auto;max-width:none}
 .case-card,.row-3 .case-card:last-child{width:100%;aspect-ratio:361/232}
 .contact{padding:96px 20px 116px}
 .contact h2{font-size:80px;line-height:96px}
 .contact a{font-size:32px;line-height:37px;margin-top:0}
 .case-page{padding:35px 0 72px}
 .case-content{width:calc(100% - 32px);gap:24px}
 .back-link{font-size:14px;line-height:20px}
 .back-link img{width:18px;height:18px}
 .case-page h1{font-size:36px;line-height:44px}
 .case-description{font-size:22px;line-height:32px}
 .case-media{gap:16px}
 .case-media-item{height:auto}
 .case-page-compact .case-description{font-size:22px;line-height:32px}
 .case-contact{padding:72px 20px 84px}
 .case-contact h2{font-size:58px;line-height:1.15}
 .case-contact a{font-size:23px;line-height:1.3}
}

/* Match the mobile intro composition: three large editorial lines. */
.mobile-break{display:none}
@media(max-width:768px){
 .hero{height:625px}
 .intro{top:493px;left:8px;width:calc(100% - 16px);max-width:none;font-size:clamp(28px,7.8vw,36px);line-height:1.22;letter-spacing:-.025em}
 .mobile-break{display:block}
}

/* Graphic accents follow the ball at every screen size. */
.disco{overflow:visible}
.disco-star{position:absolute;right:7%;top:14%;width:23%;height:38%;z-index:3;overflow:visible;pointer-events:none}
@media(max-width:768px){.disco-star{right:8%;width:20%;top:12%}}

/* Keep the complete navigation on one row at mobile widths. */
@media(max-width:768px){
 header{height:auto;padding:24px 16px 0;display:flex;align-items:center;justify-content:center;gap:16px;white-space:nowrap}
 nav{display:flex;gap:16px;padding:0;font-size:14px;line-height:30px}
 .party-control{display:flex;gap:8px;font-size:14px;line-height:30px}
 .party-control button{height:30px;min-width:auto;padding:0 8px;font-size:12px}
}

/* About page — Figma frame 62:410. */
.about{position:relative;min-height:2181px;padding:92px 48px 117px}
.about-copy{width:792px}
.about .bio{width:678px;max-width:none}
.about h1,.about h2{font-size:56px;line-height:68px;font-weight:500;max-width:554px}
.about .bio-copy{width:678px;margin-top:40px;font-size:28px;line-height:34px}
.about .bio-copy p+p{margin-top:34px}
.about .socials{margin-top:40px;gap:40px;font-size:28px;line-height:34px}
.about .experience{width:678px;max-width:none;margin-top:122px}
.about .jobs{gap:40px;margin-top:40px}
.about .job{gap:40px}
.about .job h3{font-size:24px;line-height:40px;font-weight:500}
.about .job p{font-size:18px;line-height:24px}
.about .job time{width:272px;font-size:24px;line-height:40px;text-align:right;opacity:.6}
.about .get-in-touch{width:792px;margin-top:116px}
.about .get-in-touch h2{max-width:686px}
.about .get-in-touch a{margin-top:40px;font-size:56px;line-height:68px;font-weight:500;opacity:.6}
.about-photos{position:absolute;inset:0;pointer-events:none}
.about-photos-track{display:contents}
.about-photo-clone{display:none}
.about-photo{position:absolute;width:300px;margin:0;padding:16px;background:#fff;box-shadow:0 0 6px rgba(0,0,0,.1)}
.about-photo img{width:268px;height:340px;object-fit:cover}
.about-photo.photo-1{top:108px;right:74px;transform:rotate(-8.51deg)}
.about-photo.photo-2{top:432px;right:174px;transform:rotate(15deg)}
.about-photo.photo-3{top:777px;right:74px;transform:rotate(-15deg)}
.about-photo.photo-4{top:777px;right:74px;transform:rotate(-15deg)}

@media(max-width:768px){
 header{height:145px;padding:24px 19px 0;display:grid;grid-template-columns:1fr;grid-template-rows:34px 46px;align-items:start;justify-content:stretch;gap:17px;white-space:nowrap}
 .brand{display:none}
 nav{grid-row:1;display:flex;justify-content:center;gap:69px;padding:0;font-size:20px;line-height:26px}
 .party-control{grid-row:2;display:flex;justify-content:center;gap:16px;font-size:20px;line-height:38px}
 .party-control button{height:38px;min-width:auto;padding:0 12px;font-size:18px}
 .about{min-height:0;padding:0 20px 88px;overflow:hidden}
 .about-copy{display:flex;flex-direction:column;width:100%;max-width:none}
 .about .bio,.about .bio-copy,.about .experience,.about .get-in-touch{width:100%;max-width:none}
 .about h1,.about h2{font-size:40px;line-height:48px;max-width:none}
 .about .bio-copy{margin-top:32px;font-size:22px;line-height:30px}
 .about .bio-copy p+p{margin-top:28px}
 .about .socials{margin-top:32px;font-size:22px;line-height:30px;gap:32px}
 .about-photos{order:-1;position:relative;inset:auto;width:calc(100% + 40px);height:318px;margin:0 -20px 54px;overflow:hidden;pointer-events:auto}
 .about-photos-track{display:flex;width:max-content;gap:12px;padding:62px 0 38px;animation:about-photo-loop 20s linear infinite;will-change:transform}
 .about-photo,.about-photo-clone{display:block;position:relative;top:auto!important;right:auto!important;left:auto!important;flex:0 0 190px;width:190px;padding:10px;box-shadow:0 0 6px rgba(0,0,0,.12)}
 .about-photo img{width:170px;height:216px;object-fit:cover}
 .about-photo.photo-1{transform:rotate(-8deg)}
 .about-photo.photo-2{transform:rotate(12deg)}
 .about-photo.photo-4{transform:rotate(-12deg)}
 .about .experience{margin-top:88px}
 .about .jobs{gap:32px;margin-top:32px}
 .about .job{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center}
 .about .job h3{font-size:20px;line-height:28px}
 .about .job p{font-size:15px;line-height:22px}
 .about .job time{width:auto;font-size:16px;line-height:24px;text-align:right;margin:0}
 .about .get-in-touch{margin-top:88px}
 .about .get-in-touch h2{max-width:none}
 .about .get-in-touch a{margin-top:32px;font-size:40px;line-height:48px}
}
@keyframes about-photo-loop{to{transform:translateX(-606px)}}
@media(max-width:768px) and (prefers-reduced-motion:reduce){.about-photos-track{animation:none}}

/* Keep the dark hero clean: the 3D ball is the only party-mode effect. */
html[data-theme=dark] .party-lights{display:none}

/* Clean 3D stage: no star, rays, particles, glow, or theme overlays. */
.party-lights,.disco-star{display:none!important}
.disco{overflow:hidden}
.disco-canvas{filter:none!important;mix-blend-mode:normal}

/* Latest responsive polish. */
.disco:before{content:'';position:absolute;inset:5%;border-radius:50%;opacity:0;pointer-events:none;transition:opacity .35s;background:radial-gradient(circle,rgba(248,119,179,.28) 0%,rgba(206,28,166,.13) 46%,transparent 72%);filter:blur(18px)}
html[data-theme=dark] .disco:before{opacity:1}
.case-perfect-ad-generator .case-media video{width:min(100%,420px);margin-inline:auto;max-height:746px}
@media(max-width:768px){
 header{height:auto;padding:20px 12px 0;display:flex;align-items:center;justify-content:space-between;gap:8px;white-space:nowrap}
 nav{display:flex;justify-content:flex-start;gap:14px;padding:0;font-size:12px;line-height:30px}
 .party-control{display:flex;justify-content:flex-end;gap:6px;font-size:12px;line-height:30px}
 .party-control button{height:30px;min-width:auto;padding:0 7px;font-size:11px}
 .hero{height:570px}
 .disco{top:90px;left:calc(50% - 190px);width:380px;height:300px}
 .last-name{top:354px}
 .intro{top:493px;font-size:17px;line-height:23px}
 .contact{padding:76px 20px 88px}
 .contact h2{font-family:HelveticaPortfolio,'Helvetica Neue',Arial,sans-serif;font-size:46px;line-height:1.15;font-weight:500}
 .contact a{font-family:HelveticaPortfolio,'Helvetica Neue',Arial,sans-serif;font-size:20px;line-height:28px;margin-top:8px}
 .case-perfect-ad-generator .case-media video{width:min(100%,300px);max-height:534px}
}

@media(max-width:768px){
 .hero{height:585px}
 .intro{top:493px;left:16px;width:calc(100% - 32px);max-width:none;font-size:18px;line-height:24px;letter-spacing:-.015em}
 .filters{margin-left:0}
 .filters button{height:38px;min-height:38px;padding:0 12px;font-size:18px}
}
