.realisations{--real-h: min(96vw, 30rem);padding-block:var(--section-pad);background:var(--color-bg)}.dial,.dial-meta,.dial-nav{display:none}.realisations-stage{margin-top:var(--space-7)}.realisations-viewport{margin-inline:calc(-1 * var(--gutter));overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);scrollbar-width:thin;scrollbar-color:var(--color-input-border) transparent}.realisations-viewport:focus-visible{outline-offset:-3px}.realisations-track{display:flex;align-items:flex-start;gap:var(--space-3);width:max-content;padding:0 var(--gutter) var(--space-4)}.real{flex:none;width:calc(var(--real-h) * var(--ar));scroll-snap-align:start}.real img{width:100%;height:var(--real-h);object-fit:cover;border-radius:var(--radius-lg);background:var(--color-surface)}.real--small{width:calc(var(--real-h) * .75 * var(--ar))}.real--small img{height:calc(var(--real-h) * .75)}.real figcaption{max-width:34ch;margin-top:var(--space-3);color:var(--color-surface-text);font-size:var(--text-md);line-height:1.45}@media (min-width: 1024px){.realisations:not(.is-dial) .realisations-viewport{margin-inline:0;overflow:visible;scroll-snap-type:none}.realisations:not(.is-dial) .realisations-track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-7) var(--space-4);width:auto;padding:0}.realisations:not(.is-dial) .real{width:auto}.realisations:not(.is-dial) .real img{height:auto;aspect-ratio:var(--ar)}}.realisations.is-dial{--dial-d: min(46vw, calc(100svh - var(--header-h) - var(--space-8)), 44rem);--dial-s: calc(var(--dial-d) * .62);height:calc(100svh + var(--dial-n, 12) * 24svh);padding-block:0;scroll-margin-top:calc(-1 * var(--header-h))}.is-dial .realisations-pin{position:sticky;top:0;height:100svh;padding-top:var(--header-h);overflow:hidden}.is-dial .realisations-layout{display:grid;grid-template-columns:minmax(0,1fr) var(--dial-d) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);column-gap:var(--space-6);height:100%;padding-block:var(--space-6)}.is-dial .realisations-head{grid-column:1;grid-row:1}.is-dial .realisations-stage{position:relative;grid-column:2;grid-row:1 / -1;align-self:center;width:var(--dial-d);height:var(--dial-d);margin-top:0}.is-dial .dial-nav{display:block;grid-column:1;grid-row:2;align-self:end}.dial-nav-label{margin-bottom:var(--space-3);color:var(--color-text-muted)}.dial-list{font-size:clamp(1rem,2.9svh,1.75rem);font-weight:500;letter-spacing:var(--tracking-tight);line-height:1.15}.dial-list button{display:flex;align-items:center;min-height:1.5rem;padding:0;border:0;background:none;color:var(--color-text-muted);text-align:left;transition:color var(--dur-fast) linear}.dial-list button:before{content:"";flex:none;width:0;height:2px;margin-right:0;background:currentColor;transition:width var(--dur-base) var(--ease-out),margin-right var(--dur-base) var(--ease-out)}.dial-list button:hover,.dial-list button[aria-current=true]{color:var(--color-text)}.dial-list button[aria-current=true]:before{width:.6em;margin-right:.4em}.is-dial .dial{position:absolute;inset:0;display:block}.dial-ring{position:absolute;inset:0;width:100%;height:100%}.dial-ring path{fill:none;stroke:var(--color-border);stroke-width:.25}.dial-ring--on path{stroke:var(--color-text)}.dial-ring--on{-webkit-mask-image:conic-gradient(currentColor calc(var(--p, 0) * 360deg),transparent 0);mask-image:conic-gradient(currentColor calc(var(--p, 0) * 360deg),transparent 0)}.is-dial .realisations-viewport{position:absolute;inset:0;display:grid;place-items:center;margin:0;overflow:visible;scroll-snap-type:none}.is-dial .realisations-track{display:grid;place-items:center;width:auto;padding:0}.is-dial .real,.is-dial .real--small{grid-area:1 / 1;width:min(var(--dial-s),calc(var(--dial-s) * var(--ar)));opacity:0;transform:scale(.96);transition:opacity var(--dur-base) linear,transform var(--dur-slow) var(--ease-out)}.is-dial .real.is-active{opacity:1;transform:none}.is-dial .real img,.is-dial .real--small img{height:auto;aspect-ratio:var(--ar)}.is-dial .real figcaption{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.is-dial .dial-meta{display:block;grid-column:3;grid-row:1 / -1;align-self:center;justify-self:end;max-width:16rem;text-align:right}.dial-count{color:var(--color-text-muted)}.dial-index{color:var(--color-text)}.dial-caption{margin-top:var(--space-2);color:var(--color-surface-text);font-size:var(--text-md);line-height:1.45}.realisations.is-hscroll{height:calc(100svh + var(--hs-dist, 0px));padding-block:0;scroll-margin-top:calc(-1 * var(--header-h))}.is-hscroll .realisations-pin{position:sticky;top:0;height:100svh;padding-top:var(--header-h);overflow:hidden}.is-hscroll .realisations-layout{display:flex;flex-direction:column;height:100%;padding-block:var(--space-5)}.is-hscroll .realisations-stage{flex:1;min-height:0;margin-top:var(--space-5)}.is-hscroll .realisations-viewport{height:100%;overflow:hidden;scroll-snap-type:none}.is-hscroll .realisations-track{height:100%;padding-bottom:0;will-change:transform}.is-hscroll .real{--hs-ih: min(calc(var(--hs-stage-h, 60svh) - 5.75rem), calc(84vw / var(--ar)));width:calc(var(--hs-ih) * var(--ar));scroll-snap-align:none}.is-hscroll .real img{height:var(--hs-ih)}.is-hscroll .real figcaption{max-width:none}.is-hscroll .dial-meta{display:flex;align-items:center;gap:var(--space-4);margin-top:var(--space-3)}.is-hscroll .dial-caption{display:none}.is-hscroll .dial-meta:after{content:"";flex:1;height:2px;background:linear-gradient(90deg,var(--color-text) calc(var(--p, 0) * 100%),var(--color-border) 0)}
