/* Left panel: brand, subtitle, CTAs, socials, project hover info. */
.workPanel{width:27%;height:100%;padding:var(--space-7) var(--space-5) var(--space-5) var(--space-5);border-right:1px solid #0000;flex-direction:column;flex-shrink:0;justify-content:space-between;display:flex;position:sticky;top:0}
.workPanelTop{flex-direction:column;flex:1;min-height:0;display:flex}
.workSubtitle{margin:var(--space-3) 0 0;font-family:var(--font-body);color:var(--body-text);text-wrap:pretty;max-width:22em;font-size:13.5px;font-weight:400;line-height:1.5}
.workUniform .workPanel{padding-top:28px}
.workBrandRow{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}
.workBrand{font-family:var(--font-cesare), "Times New Roman", serif;letter-spacing:-.01em;color:var(--text);text-wrap:balance;min-width:0;margin:0;font-size:clamp(2.125rem,7.5vw,4rem);font-weight:400;line-height:1}
.workBrandDot{color:var(--color-accent-orange)}
.workBrandDotBounce{transform-origin:50% 85%;display:inline-block}
@media (prefers-reduced-motion:reduce) {
.workBrandDotBounce{animation:none}
}
.workUniform .workSubtitle{max-width:none;font-size:15px;line-height:24px}
.workSubtitle strong{color:var(--text);font-weight:600}
.workSocials{padding-top:var(--space-6);padding-bottom:var(--space-2);opacity:1;flex-direction:column;align-items:flex-start;gap:14px;margin-top:auto;transition:opacity .167s linear;display:flex}
.workSocial{color:var(--muted);font-family:var(--font-body);letter-spacing:-.01em;outline:none;align-items:center;gap:4px;font-size:15px;font-weight:400;line-height:1.2;text-decoration:none;transition:color .167s linear;display:inline-flex}
.workSocialArrow{flex-shrink:0;width:12px;height:12px;display:block}
.workSocialLabel{white-space:nowrap;align-items:center;gap:4px;display:inline-flex}
.workSocial:hover,.workSocial:focus-visible{color:#fff}
.socialMenu{z-index:90;flex-shrink:0;width:44px;height:44px;display:none;position:relative}
.socialMenuBtn{background:var(--sys-glass-weak);width:44px;height:44px;color:var(--text);cursor:pointer;touch-action:manipulation;z-index:2;border:0;border-radius:8px;justify-content:center;align-items:center;margin:0;padding:0;transition:background-color .12s linear;display:inline-flex;position:relative}
.socialMenuBtn.on{background:var(--sys-glass)}
@media (hover:hover) {
.socialMenuBtn:hover,.socialMenuLink:hover{background:var(--sys-glass)}
}
.socialMenuBtn:focus-visible{outline:1px solid var(--color-border);outline-offset:2px}
.socialMenuGlyph{width:16px;height:16px;display:grid}
.socialMenuGlyph svg{grid-area:1/1;width:16px;height:16px;display:block}
.socialMenuPanel{z-index:90;background:color-mix(in srgb, var(--color-canvas) 88%, transparent);-webkit-backdrop-filter:blur(18px)saturate(1.35);pointer-events:none;will-change:clip-path, opacity;border:1px solid #ffffff1a;flex-direction:column;min-width:220px;margin:0;padding:8px;display:flex;position:absolute;top:calc(100% + 8px);right:0;border-radius:8px!important;transform:none!important}
.socialMenu[data-open=true] .socialMenuPanel{pointer-events:auto}
.socialMenuLink{min-height:44px;color:var(--color-text);font-family:var(--font-body);border-radius:6px;align-items:center;gap:10px;padding:0 10px;font-size:15px;font-weight:400;line-height:1.2;text-decoration:none;display:flex}
.socialMenuLink:focus-visible{background:var(--sys-glass)}
.socialMenuIcon{width:16px;height:16px;color:var(--muted);flex-shrink:0;justify-content:center;align-items:center;display:flex}
.socialMenuIcon svg{width:16px;height:16px;display:block}
.workPanel.is-project-hover .workTicker,.workPanel.is-project-hover .workSocials{opacity:0;pointer-events:none}
.workFit{flex-wrap:wrap;align-items:center;gap:16px 20px;max-width:none;margin-top:20px;display:flex}
.workFitActions{flex-wrap:wrap;flex-shrink:0;align-items:center;gap:8px;width:100%;min-width:0;display:flex}
.workFitBtn{--work-cta-hover-duration:.25s;--work-cta-press-duration:80ms;--work-cta-motion-ease:cubic-bezier(.22, 1, .36, 1);height:36px;font-family:var(--font-body);letter-spacing:0;text-transform:none;box-sizing:border-box;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;transform-origin:50%;transition:transform var(--work-cta-hover-duration) var(--work-cta-motion-ease), filter .15s ease-in-out, border-color .15s ease-in-out, background-color .15s ease-in-out, color .15s ease-in-out;border-radius:8px;justify-content:center;align-items:center;gap:6px;padding:0 20px;font-size:14px;font-weight:500;line-height:1;text-decoration:none;display:inline-flex;transform:translateY(0)scale(1)}
@media (hover:hover) and (pointer:fine) {
.workFitBtn:hover{transform:scale(.98)}
}
.workFitBtn:active{transition-duration:var(--work-cta-press-duration);transform:scale(.97)}
.intCopyBtn{font-weight:500;text-decoration:none;position:relative;overflow:hidden}
.intCopyBtnIconAfter{transform-origin:0;gap:6px}
.workFitBtn.intCopyBtnIconAfter{transform-origin:50%}
.intCopyBtnIconAfter .intCopyIcon{order:1}
.intCopyIcon{flex-shrink:0;width:14px;height:14px;display:grid}
.intCopyIcon svg{grid-area:1/1;width:14px;height:14px}
.intCopyLabel{font-weight:500;line-height:1;display:inline-grid;position:relative}
.intCopyLabel>span{white-space:nowrap;grid-area:1/1;font-weight:500}
.intCopyMeasures{visibility:hidden;pointer-events:none;width:0;height:0;position:absolute;overflow:hidden}
.intCopyMeasures>span{white-space:nowrap;font:inherit;letter-spacing:inherit;position:absolute}
.workFitBtnGhost{color:#fafafa;background:#353535;border:1px solid #0000}
.workFitBtnGhost:hover{background:#4a4a4a}
.workFitBtnSolid{color:#121413;background:#fff;border:1px solid #0000;font-weight:500}
.workFitBtnSolid:hover{background:#e0e0e0}
.workFitBtn:focus-visible{outline-offset:2px;outline:2px solid #fff}
.srOnly{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}
@media (prefers-reduced-motion:reduce) {
.workFitBtn{transition:none}
.workFitBtn:hover,.workFitBtn:active{transform:none}
}
.workUniform .workSubtitle,.workUniform .workNavLabel,.workUniform .workNavDesc,.workUniform .workFeaturedTitle,.workUniform .workFeaturedTag,.workUniform .workFeaturedCat,.workUniform .workCardTagline,.workUniform .workCardPlaceholder,.workUniform .mono{font-weight:400}
.workHoverInfo{left:var(--space-5);right:var(--space-5);bottom:var(--space-5);opacity:0;pointer-events:none;transition:opacity .167s linear;position:absolute}
.workHoverInfo.on{opacity:1}
.workHoverDescWrap{align-items:end;display:grid}
.workHoverDescLayer{isolation:isolate;gap:var(--space-5);flex-direction:column;grid-area:1/1;align-self:end;width:100%;display:flex;position:relative}
.workHoverDesc{font-family:var(--font-body);color:var(--body-text);text-wrap:wrap;margin:0;font-size:15px;font-weight:400;line-height:24px}
.workHoverMeta{align-items:center;gap:var(--space-media);display:flex}
.workHoverThumb{border-radius:var(--radius-lg);flex-shrink:0;width:40px;height:40px;position:relative;overflow:hidden}
.workHoverThumb img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}
.workHoverName{font-family:var(--font-body);color:var(--text);font-size:15px;font-weight:400;line-height:24px}
.workHoverYear{font-family:var(--font-mono), ui-monospace, monospace;letter-spacing:.05em;color:var(--faint);margin-top:2px;font-size:11px;font-weight:500}
@media (prefers-reduced-motion:reduce) {
.workHoverDescLayer{transition:none!important}
}
@media (max-width:900px) {
.workPanel{width:100%;min-width:0;max-width:none;height:auto;padding:max(var(--space-5), env(safe-area-inset-top)) max(var(--space-4), env(safe-area-inset-right)) calc(var(--space-3) + var(--space-4)) max(var(--space-4), env(safe-area-inset-left));flex:none;position:static}
.workUniform .workPanel{padding-top:max(var(--space-5), env(safe-area-inset-top))}
.workBrand{text-wrap:unset;white-space:nowrap;flex:1;padding-top:6px;font-size:clamp(3.25rem + 8px,7vw + 32px,3.75rem + 8px)}
.workFeatured,.workHoverInfo,.workSocials{display:none}
.socialMenu{display:block}
.workFit{max-width:none}
.workFitActions{width:100%}
.workFitBtn,.engModalCta{min-height:44px}
}
@media (prefers-reduced-motion:reduce) {
.socialMenuPanel{will-change:auto}
}
html[data-intro=play]:not([data-intro-done]) .workBrandDotBounce{animation:work-brand-dot-bounce 1.26s linear calc(1.25s * var(--intro-speed)) both, work-brand-dot-impact 1.26s ease-in-out calc(1.25s * var(--intro-speed)) both}
@media (min-width:901px) {
.workLayout-stack .workPanel{width:100%;height:auto;padding:112px var(--space-5) var(--space-8);position:relative}
.workLayout-stack .workPanelTop{text-align:center;align-items:center;max-width:640px;margin:0 auto}
.workLayout-stack .workBrandRow{justify-content:center}
.workLayout-stack .workSubtitle{max-width:34em;margin-top:var(--space-5);font-size:15px}
.workLayout-stack .workFit{margin-top:var(--space-5);justify-content:center}
.workLayout-stack .workFitActions{justify-content:center;width:auto}
.workLayout-stack .workSocials{margin-top:var(--space-7);flex-flow:wrap;justify-content:center;gap:6px 20px;padding:0}
}
/* Cascade corrections the site applies in later stylesheet layers. */
.workFitBtn{ border-radius: var(--radius-pill); }
.workHoverDescWrap{ align-items: end; display: grid; }
.workDescriptionGlow{z-index:-1;opacity:.4;inset:-40px 20px calc(-1 * var(--space-5)) calc(-1 * var(--space-5));pointer-events:none;background:radial-gradient(ellipse at 0% 100%, color-mix(in srgb, var(--project-accent) 35%, transparent), color-mix(in srgb, var(--project-accent) 10%, transparent) 45%, transparent 80%), radial-gradient(ellipse at 20% 85%, color-mix(in srgb, color-mix(in srgb, var(--project-accent) 75%, #8c78aa) 14%, transparent), transparent 65%);position:absolute;-webkit-mask-image:linear-gradient(#0000 6%,#000 55% 100%),linear-gradient(90deg,#000 0% 40%,#0000 94%);mask-image:linear-gradient(#0000 6%,#000 55% 100%),linear-gradient(90deg,#000 0% 40%,#0000 94%);-webkit-mask-composite:source-in;mask-composite:intersect}
