:root{--ground:#0a0c10;--panel:#0c0f15;--line:#1b212c;--edge:#222835;--text:#f5f7fa;--muted:#9ba3b4;--dim:#767f93;--accent:#4d82ff;--accent-soft:#8fb4ff;--on-accent:#050810}*{box-sizing:border-box}html{scroll-behavior:smooth;overflow-x:hidden}body{background:var(--ground);width:100%;color:var(--text);-webkit-font-smoothing:antialiased;margin:0;font-family:Schibsted Grotesk,system-ui,sans-serif;overflow-x:hidden}h1,h2,h3{margin:0;font-weight:600}p{margin:0}a{color:var(--accent-soft)}.accent{color:var(--accent)}.skip{background:var(--accent);color:var(--on-accent);z-index:100;padding:12px 18px;text-decoration:none;position:absolute;top:0;left:-9999px}.skip:focus{left:0}:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}.nav{justify-content:space-between;align-items:center;gap:16px;max-width:1280px;margin:0 auto;padding:24px 22px;display:flex}.mark{color:var(--text);font-family:Instrument Serif,Georgia,serif;font-size:21px;text-decoration:none}.nav nav{align-items:center;gap:22px;display:flex}.nav nav a{color:var(--muted);font-size:14px;text-decoration:none}.nav nav a:hover{color:var(--text)}.pill{border:1px solid var(--edge);border-radius:999px;padding:13px 20px;color:var(--text)!important}.hero{max-width:1280px;margin:0 auto;padding:clamp(56px,11vw,150px) 22px clamp(64px,9vw,120px);position:relative;overflow:hidden}.glow{pointer-events:none;background:radial-gradient(#4d82ff26,#4d82ff00 68%);width:min(880px,130%);height:620px;position:absolute;top:-200px;left:-120px}.eyebrow{letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:clamp(22px,3vw,34px);font-size:11px;position:relative}.hero h1{letter-spacing:-.028em;max-width:13ch;font-family:Instrument Serif,Georgia,serif;font-size:clamp(50px,11.2vw,164px);font-weight:400;line-height:.96;position:relative}.hero-foot{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:32px 56px;margin-top:clamp(36px,5vw,62px);display:flex;position:relative}.sub{max-width:44ch;color:var(--muted);font-size:clamp(16px,1.5vw,19px);line-height:1.6}.cta{flex-wrap:wrap;gap:12px;display:flex}.btn{background:var(--accent);color:var(--on-accent);cursor:pointer;border:none;border-radius:999px;padding:16px 30px;font-family:inherit;font-size:15px;font-weight:600;text-decoration:none;display:inline-block}.btn.ghost{color:var(--text);border:1px solid var(--edge);background:0 0}.proof{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--panel)}.proof-in{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:34px 44px;max-width:1280px;margin:0 auto;padding:clamp(36px,4.5vw,56px) 22px;display:grid}.fig{flex-direction:column;gap:8px;display:flex;position:relative}.fig:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(at 24% 42%,#f5f7fa0e,#f5f7fa00 66%);width:128%;height:190%;position:absolute;top:-58%;left:-14%}.fig.lead:before{background:radial-gradient(at 24% 42%,#4d82ff29,#4d82ff00 68%)}.n{z-index:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums;text-shadow:0 0 34px #f5f7fa38;font-size:clamp(38px,5.4vw,62px);font-weight:600;line-height:1;position:relative}.fig.lead .n{color:var(--accent);text-shadow:0 0 38px #4d82ff8c,0 0 86px #4d82ff47;font-size:clamp(44px,6.6vw,78px)}.l{z-index:1;letter-spacing:.13em;text-transform:uppercase;color:var(--dim);max-width:26ch;font-size:12px;font-weight:500;line-height:1.4;position:relative}.fig.lead .l{color:var(--muted)}.work{max-width:1280px;margin:0 auto;padding:clamp(64px,8vw,104px) 22px clamp(40px,5vw,64px)}.work h2,.stance p,.studio h2,.contact h2{font-family:Instrument Serif,Georgia,serif;font-weight:400}.work-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:40px;display:flex}.work h2{font-size:clamp(38px,5vw,58px);line-height:1.04}.work-head p{color:var(--muted);margin-top:10px;font-size:16px}.updated{letter-spacing:.1em;text-transform:uppercase;color:var(--dim);font-size:11px}.work-grid{grid-template-columns:minmax(0,390px) minmax(0,1fr);align-items:center;gap:clamp(28px,4vw,60px);display:grid}.caption{flex-direction:column;justify-content:center;min-height:310px;display:flex;position:relative}.cap{display:none}.cap[data-active=true]{display:block}.cap h3{letter-spacing:-.015em;font-size:clamp(28px,3.4vw,40px);line-height:1.08}.cap p{color:var(--muted);max-width:38ch;margin-top:14px;font-size:16px;line-height:1.6}.cap p.meta{letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-top:12px;font-size:11px}.stats{flex-wrap:wrap;gap:36px;margin-top:28px;display:flex}.stat{flex-direction:column;gap:4px;display:flex}.sv{letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-size:clamp(26px,3vw,36px);font-weight:700;line-height:1}.stat.accent .sv{color:var(--accent)}.sl{color:var(--muted);font-size:12px}.controls{align-items:center;gap:14px;margin-top:36px;display:flex}.arrow{border:1px solid var(--edge);width:48px;height:48px;color:var(--text);cursor:pointer;background:0 0;border-radius:999px;flex:none;place-items:center;display:grid}.arrow:hover{border-color:var(--accent);color:var(--accent)}.arrow svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}.dots{gap:0;display:flex}.dot{background:var(--edge);cursor:pointer;box-sizing:content-box;background-clip:content-box;border:none;border-radius:2px;width:10px;height:4px;padding:22px 9px;transition:width .3s,background .3s}.dot[aria-selected=true]{background:var(--accent);background-clip:content-box;width:26px}.stage{height:580px;position:relative;overflow:hidden}.track{width:100%;height:100%;position:relative}.card{will-change:transform, opacity;width:268px;margin:-276px 0 0 -134px;position:absolute;top:50%;left:50%}.phone{border:1px solid var(--edge);background:#15171d;border-radius:36px;width:268px;height:552px;padding:10px;box-shadow:0 30px 70px #0009}.screen{background:#000;border-radius:27px;width:100%;height:100%;position:relative;overflow:hidden}.feed{will-change:transform;flex-direction:column;display:flex}.tile{display:block;position:relative}.feed img{width:100%;height:auto;display:block}.views{color:#fff;font-variant-numeric:tabular-nums;text-shadow:0 1px 6px #000000d9;align-items:center;gap:5px;font-size:13px;font-weight:600;display:inline-flex;position:absolute;bottom:9px;left:9px}.views svg{fill:none;stroke:#fff;stroke-width:2.2px;filter:drop-shadow(0 1px 4px #000c);width:13px;height:13px}.screen-fade{pointer-events:none;background:linear-gradient(#0000,#000000e0);height:86px;position:absolute;bottom:0;left:0;right:0}.stance{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--panel)}.stance p{text-align:center;max-width:1280px;margin:0 auto;padding:clamp(64px,10vw,112px) 22px;font-size:clamp(28px,4.4vw,52px);line-height:1.22}.do{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:44px;max-width:1280px;margin:0 auto;padding:clamp(64px,9vw,112px) 22px 0;display:grid}.item{flex-direction:column;gap:13px;display:flex}.num{letter-spacing:.16em;color:var(--accent);font-size:11px}.item h3{font-size:21px}.item p{color:var(--muted);font-size:15px;line-height:1.65}.studio{flex-wrap:wrap;align-items:center;gap:56px;max-width:1280px;margin:0 auto;padding:clamp(64px,9vw,116px) 22px;display:flex}.portrait{flex:0 400px;min-width:280px;position:relative}.portrait:before{content:"";pointer-events:none;background:radial-gradient(at 42% 45%,#4d82ff29,#4d82ff00 66%);position:absolute;inset:-50px -34px -34px -50px}.portrait-frame{aspect-ratio:4/5;border:1px solid var(--edge);perspective:900px;background:#12161f;border-radius:18px;width:100%;position:relative;overflow:hidden}.portrait-tilt{transform-style:preserve-3d;will-change:transform;position:absolute;inset:0}.portrait-img{will-change:transform;background-image:url(/studio/karim-imran.jpg);background-position:50%;background-size:cover;animation:17s ease-in-out infinite alternate breathe;position:absolute;inset:-7%}@keyframes breathe{0%{transform:scale(1.02)translate(0,0)}to{transform:scale(1.085)translate(.9%,-1.3%)}}.portrait-sheen{pointer-events:none;mix-blend-mode:screen;opacity:.55;background:linear-gradient(115deg,#fff0 34%,#ffd8aa29 48%,#fff0 63%) 0 0/240% 240%;animation:12s ease-in-out infinite sweep;position:absolute;inset:0}@keyframes sweep{0%{background-position:0 0}50%{background-position:100% 100%}to{background-position:0 0}}.portrait-grain{pointer-events:none;opacity:.075;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>");animation:1.1s steps(5,end) infinite grain;position:absolute;inset:-60%}@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-2.5%,1.8%)}40%{transform:translate(1.9%,-2.2%)}60%{transform:translate(-1.4%,-1.6%)}80%{transform:translate(2.2%,1.3%)}to{transform:translate(0,0)}}.studio-copy{flex-direction:column;flex:999 420px;gap:22px;display:flex}.studio h2{font-size:clamp(30px,4vw,46px);line-height:1.14}.studio p{color:var(--muted);font-size:17px;line-height:1.7}.studio strong{color:var(--text);font-weight:600}.contact{border-top:1px solid var(--line);background:var(--panel)}.contact-in{max-width:780px;margin:0 auto;padding:clamp(64px,9vw,110px) 22px}.contact h2{font-size:clamp(32px,4.6vw,52px);line-height:1.08}.contact-head{margin-bottom:40px}.contact-head p{color:var(--muted);margin-top:14px;font-size:17px}.form{flex-direction:column;gap:16px;display:flex}.pair{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;display:grid}.form label{color:var(--muted);flex-direction:column;gap:7px;font-size:12px;display:flex}.form input,.form textarea{background:var(--ground);border:1px solid var(--edge);color:var(--text);border-radius:10px;width:100%;padding:14px;font-family:inherit;font-size:16px}.form textarea{resize:vertical}.hp{position:absolute;left:-9999px}.form .btn{align-self:flex-start}.note{color:var(--accent-soft);min-height:20px;font-size:14px}.foot{border-top:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;max-width:1280px;margin:0 auto;padding:32px 22px 48px;display:flex}.foot div{color:var(--dim);flex-wrap:wrap;gap:22px;font-size:13px;display:flex}.foot a{color:var(--dim);text-decoration:none}.foot a:hover{color:var(--text)}@media (width<=860px){.work-grid{grid-template-columns:1fr;gap:26px}.caption{min-height:0}.stage{height:500px}.card{width:230px;margin:-237px 0 0 -115px}.phone{border-radius:30px;width:230px;height:474px;padding:9px}.screen{border-radius:22px}.nav nav a:not(.pill){display:none}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition-duration:.001ms!important;animation-duration:.001ms!important}.portrait-img,.portrait-sheen,.portrait-grain{animation:none!important;transform:none!important}.portrait-grain{display:none}}
