.og{aspect-ratio:1;isolation:isolate;touch-action:pan-y;-webkit-user-select:none;user-select:none;cursor:grab;width:100%;max-width:820px;margin-inline:auto;position:relative;container-type:inline-size}.og:active{cursor:grabbing}.og-canvas{z-index:100;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.og-card{transform:translate3d(calc(var(--x) * 1cqw - 50%), calc(var(--y) * 1cqw - 50%), 0) scale(var(--s));transform-origin:50%;will-change:transform, opacity;pointer-events:none;border-radius:1.4cqw;position:absolute;top:0;left:0;overflow:hidden;box-shadow:0 1px 1px #1216140f,0 2.4cqw 4.6cqw -2.4cqw #1216146b}.js .og:not(.og-live) .og-card{visibility:hidden;animation:0s 4s forwards og-unhide}@keyframes og-unhide{to{visibility:visible}}.og-card--client{width:15.5cqw;box-shadow:none;background:0 0;border-radius:0;flex-direction:column;align-items:center;display:flex;overflow:visible}.og-avatar{aspect-ratio:1;border:.55cqw solid var(--color-surface);background:var(--color-raised);border-radius:50%;width:100%;position:relative;box-shadow:0 1px 1px #12161414,0 2cqw 4cqw -2cqw #12161480}.og-avatar img{border-radius:50%}.og-avatar .og-avatar-flag,.og-badge .og-avatar-flag{z-index:1;box-shadow:0 0 0 .3cqw var(--color-surface);font-size:1.15cqw;position:absolute;bottom:6%;right:2%}.og-client{border:1px solid var(--color-line);background:var(--color-surface);text-align:center;border-radius:1.2cqw;justify-items:center;width:max-content;max-width:25cqw;margin-top:-1.4cqw;padding:.75cqw 1.4cqw .85cqw;display:grid;box-shadow:0 1.2cqw 2.6cqw -1.4cqw #12161459}.og-client-name{max-width:100%;font-family:var(--font-display);letter-spacing:-.02em;color:var(--color-ink);white-space:nowrap;text-overflow:ellipsis;font-size:1.9cqw;font-weight:700;line-height:1.15;overflow:hidden}.og-client-role{max-width:100%;font-family:var(--font-ui);color:var(--color-muted);white-space:nowrap;text-overflow:ellipsis;margin-top:.15cqw;font-size:1.3cqw;font-weight:500;overflow:hidden}:root[data-theme=dark] .og-avatar,:root[data-theme=dark] .og-client{box-shadow:0 1px 1px #0000004d,0 2cqw 4cqw -2cqw #000c}.og-card--logo{width:13cqw;box-shadow:none;background:0 0;border-radius:0;flex-direction:column;align-items:center;display:flex;overflow:visible}.og-badge{aspect-ratio:1;border:.55cqw solid var(--color-surface);width:100%;box-shadow:0 0 0 1px var(--color-line), 0 1px 1px #12161414, 0 2cqw 4cqw -2cqw #12161480;background:#fff;border-radius:50%;place-items:center;display:grid;position:relative}.og-badge--mono{background:linear-gradient(#fff,#edf1ea)}.og-badge-img{object-fit:contain;border-radius:50%;padding:12%}.og-badge-img--fill{object-fit:cover;padding:0}.og-badge-initials{font-family:var(--font-display);letter-spacing:.04em;color:#38443d;font-size:3.1cqw;font-weight:700}:root[data-theme=dark] .og-badge{box-shadow:0 1px 1px #0000004d,0 2cqw 4cqw -2cqw #000c}.og-card--site{background:var(--color-surface);border:1px solid var(--color-line);width:24cqw}.og-shot{aspect-ratio:16/10;background:var(--color-raised);border-bottom:1px solid var(--color-line);position:relative}.og-meta{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:.1cqw .8cqw;padding:.85cqw 1cqw 1cqw;display:grid}.og-flag{font-family:var(--font-data);letter-spacing:.08em;background:var(--color-er-bg);color:var(--color-volt);border-radius:.45cqw;grid-row:span 2;padding:.4cqw .5cqw;font-size:1cqw;font-weight:500}.og-title{font-family:var(--font-display);letter-spacing:-.02em;color:var(--color-ink);white-space:nowrap;text-overflow:ellipsis;font-size:1.45cqw;font-weight:700;line-height:1.15;overflow:hidden}.og-work{font-family:var(--font-ui);color:var(--color-muted);white-space:nowrap;text-overflow:ellipsis;font-size:1.1cqw;font-weight:500;overflow:hidden}.og-card--cities{aspect-ratio:4/5;width:16.5cqw;color:var(--color-er-ink);font-family:var(--font-display);letter-spacing:-.02em;text-transform:uppercase;background:linear-gradient(160deg,#1f2824,#0e1411);flex-direction:column;justify-content:space-between;padding:1.55cqw;font-size:1.9cqw;font-weight:800;line-height:1;display:flex}.og-card--cities span:nth-child(2){align-self:center}.og-card--cities span:last-child{color:var(--color-volt);align-self:flex-end}.og-card--brand{aspect-ratio:1;width:17cqw;color:var(--color-er-ink);background:radial-gradient(circle at 30% 18%,#65f54552,#0000 62%),#121614;flex-direction:column;justify-content:space-between;padding:1.55cqw;display:flex}.og-brand-title{font-family:var(--font-display);letter-spacing:-.03em;font-size:2cqw;font-weight:800;line-height:1.04}.og-brand-sub{font-family:var(--font-data);letter-spacing:.08em;text-transform:uppercase;color:var(--color-volt);margin-top:.6cqw;font-size:1cqw}.og-card--stack{background:var(--color-accent-soft);border:1px solid color-mix(in srgb, var(--color-accent) 22%, transparent);width:16cqw;padding:1.55cqw}.og-stack-title{font-family:var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--color-accent);font-size:.95cqw;font-weight:700}.og-stack-list{font-family:var(--font-display);letter-spacing:-.02em;color:var(--color-ink);margin-top:.7cqw;font-size:1.65cqw;font-weight:700;line-height:1.32}.og-card--hours{aspect-ratio:5/6;background:var(--color-surface);border:1px solid var(--color-line);flex-direction:column;justify-content:space-between;width:15.5cqw;padding:1.55cqw;display:flex}.og-hours-big{font-family:var(--font-display);letter-spacing:-.045em;color:var(--color-ink);font-size:3.4cqw;font-weight:800;line-height:1}.og-hours-sub{font-family:var(--font-ui);color:var(--color-muted);font-size:1.12cqw;font-weight:600}.og-hours-dot{background:var(--color-volt);border-radius:50%;width:1cqw;height:1cqw;box-shadow:0 0 0 .45cqw #65f54540}@media (prefers-reduced-motion:reduce){.js .og:not(.og-live) .og-card{visibility:visible;animation:none}}@container (max-width:430px){.og-client,.og-card--cities,.og-card--brand,.og-card--stack,.og-card--hours{display:none}.og-card--client,.og-card--logo{width:17cqw}.og-avatar .og-avatar-flag,.og-badge .og-avatar-flag{border-radius:.3em;padding:.2em .35em;font-size:max(8px,1.9cqw)}.og-badge-initials{font-size:4.6cqw}}
.hero{background-image:linear-gradient(#1e7a321a,#1e7a3209 45%,#0000 80%),url(/hero-grid.svg);background-position:top;background-repeat:no-repeat;background-size:100% max(50vw,560px),max(100%,1100px);position:relative;overflow:hidden}:root[data-theme=dark] .hero{background-image:linear-gradient(#5dd06a14,#5dd06a06 45%,#0000 80%),linear-gradient(#111814cc,#111814cc),url(/hero-grid.svg);background-size:100% max(50vw,560px),100% max(50vw,560px),max(100%,1100px)}.hero-title{letter-spacing:-.045em;flex-direction:column;gap:.09em;font-size:clamp(2.3rem,3.5vw,4.3rem);font-weight:800;line-height:1;display:flex}@media (max-width:640px){.hero-title{font-size:clamp(1.4rem,7.2vw,2.3rem)}}.hero-title [data-line]{white-space:nowrap}.hero-line-lead{font-size:1.2em}.hero-stop{margin-left:-.07em}.hero-glow{aspect-ratio:1;pointer-events:none;filter:blur(24px);background:radial-gradient(closest-side,#65f54533,#65f5450f 55%,#0000 78%);border-radius:50%;width:min(62vw,1050px);animation:20s ease-in-out infinite alternate glow-drift;position:absolute;top:2%;right:-8%}@keyframes glow-drift{0%{translate:0;scale:1}to{translate:-6% 5%;scale:1.12}}.split-mask{overflow:hidden}@keyframes unhide{to{opacity:1;transform:none}}@keyframes unhide-opacity{to{opacity:1}}.js .hero:not(.hero-ready) [data-line]{animation:0s 5s forwards unhide;transform:translateY(110%)}.js .hero:not(.hero-ready) [data-after]{opacity:0;animation:0s 5s forwards unhide-opacity}@media (min-width:1024px){.reveal-on .bench:not(.bench-ready) .hero-stage,.reveal-on .bench:not(.bench-ready) .bench-card{opacity:0}}.bench{margin-top:clamp(2rem,4vw,3.5rem);position:relative}@media (min-width:1024px){.bench{min-height:660px;padding:40px 0 24px}}.hero-stage{--lx:68%;--ly:42%;--r:clamp(72px, 27vw, 120px);--brand:#2b4c7e;aspect-ratio:4/5;border:1px solid var(--color-line);background:var(--color-surface);isolation:isolate;touch-action:pan-y;border-radius:18px;width:100%;max-width:900px;margin-inline:auto;position:relative;overflow:hidden;box-shadow:0 1px 1px #1216140d,0 50px 100px -40px #12161473}@media (min-width:640px){.hero-stage{aspect-ratio:16/10;--r:150px}}@media (min-width:1024px){.hero-stage{--r:170px}}.hero-layer{grid-template-rows:auto 1fr auto auto;gap:14px;padding:18px;display:grid;position:absolute;inset:42px 0 0}@media (min-width:640px){.hero-layer{gap:16px;padding:22px 26px}}.hero-surface{background:var(--color-surface);color:var(--color-ink)}.hero-engine{background:radial-gradient(circle calc(var(--r) * 1.05) at var(--lx) var(--ly), #65f54521, #65f54500 75%), linear-gradient(#f2f4f10f 1px, transparent 1px) 0 0 / 24px 24px, linear-gradient(90deg, #f2f4f10f 1px, transparent 1px) 0 0 / 24px 24px, #27322d;color:var(--color-er-ink);-webkit-mask-image:radial-gradient(circle var(--r) at var(--lx) var(--ly), #000 calc(100% - 1px), transparent 100%);-webkit-mask-image:radial-gradient(circle var(--r) at var(--lx) var(--ly), #000 calc(100% - 1px), transparent 100%);mask-image:radial-gradient(circle var(--r) at var(--lx) var(--ly), #000 calc(100% - 1px), transparent 100%);padding-top:60px;inset:0}@media (min-width:640px){.hero-engine{padding-top:64px}}.hero-lens{--handle:clamp(9px, calc(var(--r) * .085), 14px);left:var(--lx);top:var(--ly);width:calc(var(--r) * 2);height:calc(var(--r) * 2);pointer-events:none;background:radial-gradient(circle at 30% 24%,#fff3,#fff0 46%);border:4px solid #fffffff5;border-radius:50%;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #1216141a,inset 0 0 0 1px #65f5458c,inset 0 0 28px #ffffff1a,0 22px 44px -24px #12161461}.hero-lens:before{content:"";left:85.36%;top:calc(85.36% - var(--handle) / 2);width:calc(var(--r) * .55);height:var(--handle);transform-origin:0;background:linear-gradient(#2f3833,#121614);border-radius:999px;position:absolute;transform:rotate(45deg);box-shadow:inset 0 1px #ffffff2e,0 10px 20px -10px #12161473}.hero-lens:after{content:"engine room";font-family:var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--color-volt);white-space:nowrap;background:#121614;border-radius:999px;padding:4px 9px;font-size:10px;font-weight:700;line-height:1;position:absolute;bottom:-30px;left:50%;transform:translate(-50%);box-shadow:0 6px 14px -8px #12161480}.mock-block{border-radius:12px}.hero-surface .mock-block{background:linear-gradient(#f2f4f0,#e9ede6)}.hero-engine .mock-block{border:1px dashed var(--color-er-line);background:0 0}.mock-brand{color:var(--brand)}.mock-brand-bg{background:var(--brand)}.stage-ready .mock-piece{opacity:1;transform:none}.reveal-on .hero-stage:not(.stage-ready) .mock-piece{opacity:0;transform:translateY(14px)scale(.98)}.bench-card{background:var(--color-surface);border:1px solid var(--color-line);width:100%;font-family:var(--font-data);color:var(--color-muted);border-radius:14px;padding:14px 16px;font-size:12px;line-height:1.5;position:relative;box-shadow:0 1px 1px #1216140d,0 30px 60px -30px #12161466}:root[data-theme=dark] .bench-card{box-shadow:0 1px 1px #0000004d,0 30px 60px -30px #000c}.bench-card b{font-family:var(--font-ui);color:var(--color-ink);font-size:13px;font-weight:700;display:block}.bench-card .bob{display:block}.js .bench-card .bob{animation:bob var(--bob-dur,6s) ease-in-out var(--bob-delay,0s) infinite}.bench-cards-mobile{gap:12px;margin-top:14px;display:grid}@media (min-width:640px){.bench-cards-mobile{grid-template-columns:1fr 1fr}}@media (min-width:1024px){.bench-cards-mobile{display:contents}.bench-card{z-index:2;width:250px;position:absolute}.bench-card.c-vitals{width:270px;top:6%;left:0}.bench-card.c-figma{width:220px;top:58%;left:2%}.bench-card.c-qa{width:230px;bottom:0;left:10%}.bench-card.c-commits{width:280px;top:10%;right:0}.bench-card.c-slack{width:300px;bottom:4%;right:2%}.bench-card.c-staging{z-index:3;border-radius:999px;width:max-content;margin-inline:auto;padding:8px 14px;top:0;left:0;right:0}}@media (max-width:1023px){.bench-card.lg-only{display:none}}.ring{flex:none;width:40px;height:40px}.ring circle{fill:none;stroke-width:3.5px}.ring .track{stroke:var(--color-raised)}.ring .bar{stroke:var(--color-accent);stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:0;transform-origin:50%;transform:rotate(-90deg)}@media (prefers-reduced-motion:reduce){.hero-stage{--lx:70%;--ly:46%}.js .hero:not(.hero-ready) [data-line],.js .hero:not(.hero-ready) [data-after],.reveal-on .bench:not(.bench-ready) .hero-stage,.reveal-on .bench:not(.bench-ready) .bench-card,.reveal-on .hero-stage:not(.stage-ready) .mock-piece{opacity:1;animation:none;transform:none}.js .bench-card .bob,.hero-glow{animation:none}}
