/* Fixed reference canvas: media dimensions cannot stretch the section. */
@font-face{font-family:'SJ Amita';src:url('../fonts/Amita-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'SJ Cormorant';src:url('../fonts/CormorantGaramond.woff2') format('woff2');font-weight:300 700;font-display:swap}
@font-face{font-family:'SJ Cormorant';src:url('../fonts/CormorantGaramond-Italic.woff2') format('woff2');font-style:italic;font-weight:300 700;font-display:swap}
@font-face{font-family:'SJ Bodoni';src:url('../fonts/BodoniModa.ttf') format('truetype');font-style:normal;font-weight:400 900;font-display:swap}
@font-face{font-family:'SJ Instrument';src:url('../fonts/InstrumentSerif-Italic.ttf') format('truetype');font-style:italic;font-weight:400;font-display:swap}
.sj-captured-stories.sj-captured-stories--reference{display:grid;grid-template-columns:minmax(0,1fr);gap:2rem;align-items:start;max-inline-size:1440px;margin-inline:auto;margin-block-end:clamp(3rem,6vw,6rem)}
.sj-captured-stories--reference .sj-captured-stories__copy{max-inline-size:27rem;inline-size:100%;margin-inline:auto;padding:0;text-align:center}
.sj-captured-stories--reference .sj-captured-stories__copy h2{display:flex;align-items:baseline;justify-content:center;flex-wrap:wrap;gap:12px;overflow:visible;line-height:1.4;margin:0 0 1.3rem}
.sj-captured-stories--reference .sj-captured-stories__mark{font-family:'SJ Amita',serif!important;font-size:clamp(3rem,5.5vw,5.5rem);font-weight:400;line-height:1.5;letter-spacing:0;color:#f7c928!important;white-space:nowrap}
.sj-captured-stories--reference .sj-captured-stories__title-copy{font-family:'SJ Cormorant',serif!important;font-size:clamp(1.5rem,2.5vw,2.5rem);font-style:italic;font-weight:600;line-height:1.4;letter-spacing:-.035em;white-space:nowrap;color:#f7c928!important}
.sj-captured-stories--reference .sj-captured-stories__copy>p{font-family:'SJ Cormorant',serif;font-size:clamp(1.5rem,2.65vw,2.6rem);font-weight:400;line-height:1.28;letter-spacing:-.035em;max-inline-size:25ch;margin:0 auto 1.5rem;color:#f4f1ea}
.sj-captured-stories--reference .sj-text-link{min-block-size:44px;display:inline-flex;align-items:center}
.sj-captured-stories--reference .sj-captured-stories__gallery{display:block;position:relative;inline-size:100%;block-size:auto;min-block-size:0;aspect-ratio:724/644;overflow:visible;isolation:isolate}
.sj-captured-stories--reference .sj-captured-stories__gallery .sj-captured-stories__image{position:absolute;inset:auto;left:var(--tile-x);top:var(--tile-y);width:var(--tile-w);height:var(--tile-h);inline-size:var(--tile-w);block-size:var(--tile-h);min-inline-size:0;min-block-size:0;max-inline-size:none;margin:0;padding:0;grid-area:auto;aspect-ratio:auto;transform:none!important;scale:1;rotate:0;overflow:hidden;border:0;border-radius:0;z-index:1}
.sj-captured-stories--reference .sj-captured-stories__image img,.sj-captured-stories--reference .sj-captured-stories__image video{display:block;width:100%;height:100%;inline-size:100%;block-size:100%;max-inline-size:none;object-fit:cover;object-position:center;aspect-ratio:auto;transform:none}
.sj-captured-stories--reference .sj-captured-stories__image--1{--tile-x:34.94%;--tile-y:0%;--tile-w:15.88%;--tile-h:22.98%}
.sj-captured-stories--reference .sj-captured-stories__image--2{--tile-x:52.9%;--tile-y:11.8%;--tile-w:18.09%;--tile-h:11.18%}
.sj-captured-stories--reference .sj-captured-stories__image--3{--tile-x:72.24%;--tile-y:7.3%;--tile-w:16.44%;--tile-h:11.49%}
.sj-captured-stories--reference .sj-captured-stories__image--4{--tile-x:13.81%;--tile-y:17.39%;--tile-w:19.2%;--tile-h:19.88%}
.sj-captured-stories--reference .sj-captured-stories__image--5{--tile-x:34.94%;--tile-y:24.38%;--tile-w:36.05%;--tile-h:40.68%}
.sj-captured-stories--reference .sj-captured-stories__image--6{--tile-x:72.24%;--tile-y:20.19%;--tile-w:26.1%;--tile-h:24.53%}
.sj-captured-stories--reference .sj-captured-stories__image--7{--tile-x:0%;--tile-y:38.66%;--tile-w:33.56%;--tile-h:26.24%}
.sj-captured-stories--reference .sj-captured-stories__image--8{--tile-x:72.24%;--tile-y:46.89%;--tile-w:20.3%;--tile-h:18.17%}
.sj-captured-stories--reference .sj-captured-stories__image--9{--tile-x:13.81%;--tile-y:66.15%;--tile-w:15.19%;--tile-h:16.93%}
.sj-captured-stories--reference .sj-captured-stories__image--10{--tile-x:30.39%;--tile-y:66.15%;--tile-w:18.51%;--tile-h:26.09%}
.sj-captured-stories--reference .sj-captured-stories__image--11{--tile-x:50.28%;--tile-y:66.15%;--tile-w:28.31%;--tile-h:33.85%}
.sj-captured-stories--reference .sj-captured-stories__image--12{--tile-x:80.25%;--tile-y:66.77%;--tile-w:19.75%;--tile-h:15.68%}
@media(min-width:768px){.sj-captured-stories.sj-captured-stories--reference{grid-template-columns:minmax(0,.56fr) minmax(0,1fr);gap:5vw}.sj-captured-stories--reference .sj-captured-stories__copy{padding-block-start:3vw}}
#selected-work{scroll-margin-top:80px;padding-block-start:clamp(32px,5vw,64px)}
/* Bound typography by viewport height as well as width. Keep motion hooks. */
.sj-project-mosaic > .sj-project-card:nth-child(n+5){grid-column:span 6;margin-block-start:0}
.sj-kinetic-strip .sj-kinetic-strip__group>span:not(.sj-kinetic-strip__mark){font-family:'SJ Bodoni','SJ Cormorant',serif;font-size:clamp(2.1rem,4.65vw,5.25rem);font-weight:500;line-height:1.2;letter-spacing:-.035em;padding-block:.1em .28em;font-variant-ligatures:common-ligatures discretionary-ligatures}
.sj-kinetic-strip .sj-kinetic-strip__group>span:nth-of-type(4n+3){font-family:'SJ Instrument','SJ Cormorant',serif;font-style:italic;font-weight:400;letter-spacing:-.02em}
@media(max-width:767px){.sj-kinetic-strip{min-block-size:29svh;padding-block:2.5rem 3rem}.sj-kinetic-strip__viewport{padding-block-start:1.75rem}.sj-kinetic-strip .sj-kinetic-strip__group>span:not(.sj-kinetic-strip__mark){font-size:clamp(2rem,8vw,3.25rem)}}
.sj-about-mosaic .sj-about-mosaic__mission-copy{gap:1rem;max-inline-size:38rem;margin-inline:auto;padding:1.5rem;background:rgba(8,8,8,.65)}
.sj-about-mosaic .sj-about-mosaic__mission-copy h2,.sj-about-mosaic .sj-about-mosaic__mission-copy p,.sj-about-mosaic .sj-about-mosaic__floating-label{font-family:'SJ Cormorant',serif;font-size:clamp(1.4rem,2.3vw,2rem);font-weight:400;line-height:1.4;letter-spacing:0;max-inline-size:35ch;text-wrap:pretty}
.sj-about-mosaic .sj-about-mosaic__mission-copy h2{max-inline-size:none}
.sj-about-mosaic .sj-about-mosaic__floating-label{inline-size:46%;max-inline-size:36ch;inset:50% auto auto 50%;padding:1rem;background:rgba(8,8,8,.82)}
.sj-about-mosaic .sj-about-mosaic__floating-stage{min-block-size:1040px}
.sj-about-mosaic .sj-about-mosaic__floating-label{background:none}
@media(max-width:767px){.sj-project-mosaic>.sj-project-card:nth-child(n+5){grid-column:1}.sj-about-mosaic .sj-about-mosaic__mission-copy{padding:0;background:none}.sj-about-mosaic .sj-about-mosaic__floating-label{inline-size:100%;max-inline-size:34ch;padding:.5rem;font-size:1.4rem}.sj-about-mosaic .sj-about-mosaic__floating-stage{min-block-size:900px}.sj-about-mosaic .sj-about-mosaic__float{width:29%}}
/* Beat the legacy nth-child reset: absolute photos need a real aspect ratio. */
@media(max-width:767px){
 .sj-about-mosaic .sj-about-mosaic__mission-stage{padding-block-start:104px;grid-template-rows:auto 24px auto;row-gap:16px}
 .sj-about-mosaic .sj-about-mosaic__mission-image--1:nth-child(n),.sj-about-mosaic .sj-about-mosaic__mission-image--2:nth-child(n){aspect-ratio:3/4;inline-size:100%;height:auto}
 .sj-about-mosaic .sj-about-mosaic__float:nth-child(n){aspect-ratio:3/4;inline-size:29%;width:29%;height:auto}
}
.sj-template-home .sj-hero{min-block-size:calc(100svh - var(--sj-admin-bar-height,0px));height:auto;overflow:hidden}
.sj-template-home .sj-hero__content{box-sizing:border-box;min-block-size:calc(100svh - var(--sj-admin-bar-height,0px));height:auto;padding-block:clamp(90px,13svh,140px) max(24px,env(safe-area-inset-bottom));justify-content:space-between;gap:1rem}
.sj-template-home .sj-hero h1{font-size:clamp(2.5rem,min(10vw,15svh),10rem);line-height:1.02;margin-block:0;overflow:visible}
.sj-template-home .sj-hero__line{padding-block:.08em;margin-block:-.08em;overflow:visible}
.sj-template-home .sj-hero__media img{object-fit:cover;object-position:center;background:#080808}
.sj-template-home .sj-hero__bottom{gap:1rem;padding-block-start:1rem}
.sj-template-home .sj-hero__bottom>p{font-size:clamp(.875rem,1.2vw,1.1rem);max-inline-size:38ch}
.sj-template-home .sj-hero__content>h1{flex-shrink:0}
@media(max-width:767px) and (max-height:650px){.sj-template-home .sj-hero__content{min-block-size:650px}.sj-template-home .sj-hero h1{font-size:2.5rem}}
@media(max-width:767px){.sj-template-home .sj-hero h1{font-size:clamp(2.5rem,min(13vw,12svh),5rem)}.sj-template-home .sj-hero__media img{object-fit:cover;object-position:52% center}.sj-template-home .sj-hero__bottom{grid-template-columns:1fr;gap:1.25rem}.sj-template-home .sj-hero__content{gap:1rem}.sj-template-home .sj-hero__bottom>p{font-size:1rem;line-height:1.5;max-inline-size:38ch}.sj-template-home .sj-hero__bottom .sj-actions{flex-wrap:wrap;gap:.75rem 1rem;align-items:center}.sj-template-home .sj-hero__bottom .sj-actions>a{min-block-size:44px;display:inline-flex;align-items:center;justify-content:center}}
@media(max-height:500px) and (min-width:768px){.sj-template-home .sj-hero__content{padding-block:80px 16px;gap:.5rem}.sj-template-home .sj-hero h1{font-size:clamp(2rem,12svh,4rem)}.sj-template-home .sj-hero__kicker{margin:0}.sj-template-home .sj-hero__bottom{padding-block-start:.5rem}}

/* 0.11.6: keep the existing mobile hero composition, but bring its type and actions onto one grid. */
@media(max-width:767px){
 .sj-template-home .sj-hero__line--2{transform:none;text-align:start;padding-inline-start:clamp(1.5rem,11vw,3.5rem)}
 .sj-template-home .sj-hero__line--3{transform:none;text-align:start;padding-inline-start:clamp(3rem,20vw,6rem)}
 .sj-template-home .sj-hero__bottom>p{max-inline-size:34ch;text-wrap:pretty}
 .sj-template-home .sj-hero__bottom .sj-actions{inline-size:100%;align-items:flex-start;justify-content:flex-start;gap:.5rem}
 .sj-template-home .sj-hero__bottom .sj-actions>a{margin-inline:0}
}

/* Slightly calmer desktop marquee; retain its type treatment, clear descenders and scroll motion. */
@media(min-width:1024px){
 .sj-template-home .sj-kinetic-strip{min-block-size:31svh}
 .sj-template-home .sj-kinetic-strip__viewport{padding-block-start:clamp(2rem,4vh,3rem)}
 .sj-template-home .sj-kinetic-strip .sj-kinetic-strip__group>span:not(.sj-kinetic-strip__mark){font-size:clamp(2.1rem,4vw,4.7rem)}
}