.portfolio-content-shell{--portfolio-shell-inset:44px;width:100%;max-width:calc(var(--portfolio-content-width) + 88px);padding-inline:var(--portfolio-shell-inset);margin-inline:auto}.portfolio-hero{width:min(var(--portfolio-content-width), calc(100% - 88px));margin-inline:auto;padding-top:40px}.portfolio-hero-panel{border-radius:var(--portfolio-radius);background:var(--portfolio-gradient-hero);align-items:center;gap:80px;height:400px;padding-right:40px;display:flex;position:relative}.portfolio-hero-portrait-slot{flex:0 0 380px;height:561px;position:relative}.portfolio-hero-portrait-crop{width:380px;height:561px;position:absolute;top:0;left:-24px;overflow:hidden}.portfolio-hero-portrait-crop img{width:101.58%;max-width:none;height:105.2%;position:absolute;top:-6.49%;left:0}.portfolio-hero-copy{flex-direction:column;flex:0 468px;gap:24px;min-width:0;display:flex;position:relative}.portfolio-hero-heading{flex-direction:column;gap:20px;display:flex}.portfolio-hero-role{color:var(--portfolio-text-secondary);font-size:var(--portfolio-text-s-size);font-weight:var(--portfolio-font-weight-semibold);line-height:var(--portfolio-text-s-line-height);letter-spacing:var(--portfolio-font-letter-spacing)}.portfolio-hero h1{color:#000;font-size:var(--portfolio-h1-size);font-weight:var(--portfolio-font-weight-semibold);line-height:var(--portfolio-h1-line-height)}.portfolio-hero h1 em{color:var(--portfolio-text-secondary);font-style:italic}.portfolio-hero-description{color:var(--portfolio-text-secondary);font-size:var(--portfolio-text-l-size);line-height:var(--portfolio-text-l-line-height);flex-direction:column;gap:8px;display:flex}.portfolio-home-body{--portfolio-preview-height:clamp(320px, calc(100svh - 292px), 680px);background:var(--portfolio-background-page);position:relative}.portfolio-work{flex-direction:column;gap:16px;padding-top:24px;display:flex}.portfolio-home-page #work{scroll-margin-top:92px}.portfolio-section-label{color:var(--portfolio-text-secondary);font-size:var(--portfolio-h3-size);line-height:var(--portfolio-h3-line-height);font-weight:var(--portfolio-font-weight-semibold)}.portfolio-case-caption{flex-direction:column;gap:12px;display:flex}.portfolio-case-caption h3{font-size:var(--portfolio-h3-size);font-weight:var(--portfolio-font-weight-semibold);line-height:var(--portfolio-h3-line-height)}.portfolio-case-heading-row{align-items:center;gap:24px;display:flex}.portfolio-case-copy{flex:1;min-width:0;transition:transform .22s cubic-bezier(.2,.7,.3,1)}.portfolio-case-title-link{color:inherit;text-decoration:none;transition:color .22s;display:block}.portfolio-case-title-link:hover{text-decoration:none}.portfolio-case-caption p{font-size:var(--portfolio-text-l-size);line-height:var(--portfolio-text-l-line-height);color:var(--portfolio-text-secondary);margin-top:0}.portfolio-case-preview{flex-direction:column;gap:12px;width:100%;display:flex}.portfolio-case-read{min-height:44px;color:var(--portfolio-text-on-action);font-size:var(--portfolio-text-m-size);line-height:var(--portfolio-text-m-line-height);font-weight:var(--portfolio-font-weight-semibold);flex:0 0 112px;align-items:center;text-decoration:none;display:inline-flex}.portfolio-case-read-surface{background:var(--portfolio-accent);border-radius:24px;justify-content:center;align-items:center;gap:8px;width:112px;height:44px;padding-inline:16px;transition:transform .22s cubic-bezier(.2,.7,.3,1),box-shadow .22s;display:inline-flex}.portfolio-case-read svg{flex:none;transition:transform .22s cubic-bezier(.2,.7,.3,1)}.portfolio-case-read:hover{text-decoration:none}.portfolio-case-read:focus-visible,.portfolio-case-title-link:focus-visible{outline:3px solid var(--portfolio-accent);outline-offset:4px;border-radius:4px}.portfolio-case-read:focus-visible{border-radius:24px}@media (hover:hover){.portfolio-case-heading-row:has(a:hover) .portfolio-case-copy{transform:translate(2px)}.portfolio-case-heading-row:has(a:hover) h3 a{color:var(--portfolio-accent)}.portfolio-case-heading-row:has(a:hover) p a{color:color-mix(in srgb, var(--portfolio-text-secondary) 55%, var(--portfolio-text-primary))}.portfolio-case-heading-row:has(a:hover) .portfolio-case-read-surface{box-shadow:0 5px 14px color-mix(in srgb, var(--portfolio-accent) 15%, transparent);transform:translateY(-2px)}.portfolio-case-heading-row:has(a:hover) .portfolio-case-read svg{transform:translate(4px)}}.portfolio-case-heading-row:has(a:focus-visible) .portfolio-case-read svg{transform:translate(4px)}.portfolio-case-heading-row .portfolio-case-read:active .portfolio-case-read-surface{box-shadow:none;transform:scale(.97)}.portfolio-work{transition:opacity .16s,transform .16s}.portfolio-work--leaving{opacity:0;transform:translateY(-6px)}@media (prefers-reduced-motion:reduce){.portfolio-work,.portfolio-case-copy,.portfolio-case-title-link,.portfolio-case-read-surface,.portfolio-case-read svg{transition:none!important;transform:none!important}}.portfolio-concepts{padding-top:24px}.portfolio-page.portfolio-case-viewer{z-index:100;background:var(--portfolio-background-page);border-radius:24px;justify-content:center;align-items:center;min-height:0;padding:56px 24px 24px;display:flex;position:fixed;inset:24px;overflow:auto}.portfolio-case-viewer>img{object-fit:contain;border-radius:8px;width:auto;max-width:100%;height:auto;max-height:100%;display:block}@media (width<=1127px){.portfolio-hero-panel{gap:40px;height:400px;min-height:400px;padding:32px 32px 32px 0}.portfolio-hero-portrait-slot{flex-basis:39%;height:561px}.portfolio-hero-portrait-crop{width:380px;height:561px;top:50%;left:-20px;transform:translateY(-50%)}.portfolio-hero-copy{flex:1}.portfolio-hero h1{font-size:var(--portfolio-h2-size);line-height:var(--portfolio-h2-line-height)}.portfolio-hero-description{font-size:var(--portfolio-text-m-size);line-height:var(--portfolio-text-m-line-height)}}@media (width<=900px){.portfolio-home-body{--portfolio-preview-height:clamp(320px, calc(100svh - 328px), 680px)}.portfolio-content-shell{--portfolio-shell-inset:24px}.portfolio-hero{width:calc(100% - 48px);padding-top:64px}.portfolio-hero-panel{gap:24px}.portfolio-hero-portrait-slot{flex-basis:42%;height:561px}.portfolio-hero-portrait-crop{width:380px;height:561px;top:50%}}@media (width<=640px){.portfolio-content-shell{--portfolio-shell-inset:20px}.portfolio-hero{width:calc(100% - 40px);padding-top:48px}.portfolio-hero-panel{flex-direction:column;align-items:stretch;gap:20px;height:auto;min-height:0;padding:0 24px 28px}.portfolio-hero-portrait-slot{flex:none;width:100%;height:292px}.portfolio-hero-portrait-crop{width:250px;height:369px;top:-52px;left:50%;transform:translate(-50%)}.portfolio-hero-copy{flex:none}.portfolio-hero h1{font-size:var(--portfolio-h3-size);line-height:var(--portfolio-h3-line-height)}.portfolio-hero-heading{gap:12px}.portfolio-hero-copy{gap:20px}.portfolio-section-label{font-size:var(--portfolio-text-l-size);line-height:var(--portfolio-text-l-line-height)}.portfolio-case-caption p{font-size:var(--portfolio-text-m-size);line-height:var(--portfolio-text-m-line-height)}.portfolio-case-heading-row{flex-wrap:wrap;gap:12px}.portfolio-case-copy{flex-basis:100%}.portfolio-case-read{margin-left:auto}.portfolio-case-read-surface{height:44px}.portfolio-work,.portfolio-concepts{padding-top:32px}.portfolio-page.portfolio-case-viewer{padding-inline:12px;inset:12px}}@media (width>=901px){.portfolio-case-preview .sporthub-comparison-frame{padding-inline:48px}}@media (width>=641px) and (width<=900px){.portfolio-hero-panel{flex-direction:column;align-items:stretch;gap:20px;height:auto;min-height:0;padding:0 32px 32px}.portfolio-hero-portrait-slot{flex:none;width:100%;height:332px}.portfolio-hero-portrait-crop{width:290px;height:428px;top:-60px;left:50%;transform:translate(-50%)}.portfolio-hero-copy{flex:none}}
