.jr-finale{background:#14100f;color:#f8f4ee;padding:48px 0 64px;overflow:hidden}
.jr-finale--portfolio-films .jr-finale__films{grid-template-columns:repeat(3,minmax(0,1fr));max-width:960px;margin:0 auto}
.jr-finale--crowns .jr-finale__gallery .jr-finale__photo{aspect-ratio:3/4}
.jr-finale--crowns .jr-finale__gallery .jr-finale__photo img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:top center}
@media(max-width:640px){.jr-finale--portfolio-films .jr-finale__films{grid-template-columns:1fr}}
.jr-finale .jr-shell{max-width:1280px;width:calc(100% - 80px);margin:auto}
.jr-finale__masthead{display:flex;justify-content:space-between;padding-bottom:25px;border-bottom:1px solid #ffffff29;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#d7c0a1}
.jr-finale__hero{display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:center;padding:52px 0 64px}
.jr-finale__eyebrow{font-size:11px!important;letter-spacing:.19em;text-transform:uppercase;color:#d7c0a1!important;margin:0 0 22px!important}
.jr-finale h2{font-size:clamp(40px,4.5vw,68px);line-height:1.07;letter-spacing:-.045em;color:#fff;margin:0 0 26px;font-weight:500}
.jr-finale h2 em{font-family:Georgia,serif;font-weight:400;color:#d7c0a1}
.jr-finale__name{font-size:24px!important;color:#fff!important;line-height:1.3!important;margin:0 0 8px!important}
.jr-finale__intro{font-size:16px!important;color:#dfd7d1!important;margin:0 0 24px!important}
.jr-finale__description{font-size:14px!important;line-height:1.85!important;color:#bcb3ac!important;max-width:450px}
.jr-finale__credits{display:flex;gap:38px;border-top:1px solid #ffffff29;margin:28px 0;padding-top:22px;font-size:10px;color:#c4b7a9;text-transform:uppercase;letter-spacing:.1em}
.jr-finale__credits strong{display:block;font-size:12px;font-weight:400;text-transform:none;letter-spacing:0;color:#fff;margin-top:7px}
.jr-finale__link{display:inline-flex;gap:25px;align-items:center;color:#f8f4ee!important;font-size:12px;border-bottom:1px solid #a89075;padding-bottom:7px;transition:color .2s}
.jr-finale__link:hover{color:#d7c0a1!important}
.jr-finale__link:focus-visible,.jr-finale summary:focus-visible,.jr-finale video:focus-visible{outline:2px solid #d7c0a1;outline-offset:6px}
.jr-finale figure{margin:0}
.jr-finale__portrait{position:relative;background:#211c19}
.jr-finale__portrait img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 65%}
.jr-finale__portrait figcaption{position:absolute;bottom:0;left:0;right:0;padding:60px 24px 22px;background:linear-gradient(transparent,#000c);display:flex;justify-content:space-between;gap:12px;font-size:10px;color:#fff;letter-spacing:.04em}
/* `end` rather than `baseline`: the left column starts with a small eyebrow, so
   baseline alignment pins the tagline to that rather than to "Behind the look"
   and it reads as a stray line above the heading. */
.jr-finale__films-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;border-top:1px solid #ffffff29;padding-top:38px;margin-bottom:26px;scroll-margin-top:100px}
.jr-finale__films-heading .jr-finale__eyebrow{margin-bottom:10px!important}
.jr-finale h3{font-size:32px;font-weight:400;letter-spacing:-.025em;color:#fff;margin:0}
.jr-finale__films-heading>p{font-size:12px;color:#bcb3ac;margin:0;text-align:right}
.jr-finale__films{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.jr-finale__video{position:relative;background:#211c19;aspect-ratio:9/13;overflow:hidden}
.jr-finale video{width:100%;height:100%;display:block;object-fit:cover}

/* The play control. Only present once the script has taken the native chrome
   away, so a no-JavaScript visitor keeps the browser's own controls. */
.jr-finale__play{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;cursor:pointer;background:linear-gradient(180deg,#0000 45%,#0000006e);transition:background .3s}
.jr-finale__play-icon{position:absolute;top:50%;left:50%;width:62px;height:62px;transform:translate(-50%,-50%);border:1px solid #ffffff8a;border-radius:50%;background:#1410004d;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);transition:border-color .3s,background .3s,transform .3s}
/* The triangle, drawn rather than shipped as an asset. */
.jr-finale__play-icon::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-42%,-50%);border-style:solid;border-width:7px 0 7px 12px;border-color:transparent transparent transparent #fff;transition:border-left-color .3s}
.jr-finale__play:hover .jr-finale__play-icon,.jr-finale__play:focus-visible .jr-finale__play-icon{border-color:#d7c0a1;background:#14100080;transform:translate(-50%,-50%) scale(1.06)}
.jr-finale__play:hover .jr-finale__play-icon::after,.jr-finale__play:focus-visible .jr-finale__play-icon::after{border-left-color:#d7c0a1}
.jr-finale__play:focus-visible{outline:2px solid #d7c0a1;outline-offset:-4px}
.jr-finale__video.is-playing .jr-finale__play{display:none}

.jr-finale__film figcaption{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:2px 12px;padding:18px 0}
.jr-finale__number{color:#d7c0a1;font-size:11px;line-height:1.5}
.jr-finale h4{color:#fff;font-size:15px;font-weight:400;margin:0 0 5px;line-height:1.35}
.jr-finale__film figcaption p{color:#bcb3ac;font-size:11px;line-height:1.5;margin:0}
.jr-finale__duration{font-size:10px;color:#bcb3ac;white-space:nowrap;line-height:1.6}
/* The "more from the finale" clips carry no number and no description, so they
   get two columns rather than inheriting the three above. */
.jr-finale__film--compact figcaption{grid-template-columns:minmax(0,1fr) auto;align-items:baseline}
.jr-finale__film--compact h4{margin:0}
.jr-finale__more{border-top:1px solid #ffffff29;border-bottom:1px solid #ffffff29;margin-top:18px}
.jr-finale__more summary{padding:20px 0;cursor:pointer;font-size:12px;color:#e9ded0;list-style:none;display:flex;justify-content:space-between}
.jr-finale__more summary::-webkit-details-marker{display:none}
.jr-finale__more summary:hover{color:#fff}
.jr-finale__more summary span{font-size:20px;line-height:1;color:#d7c0a1;transition:transform .25s}
.jr-finale__more[open] summary span{transform:rotate(45deg)}
.jr-finale__more .jr-finale__films{padding:10px 0 20px}
.jr-finale__footer{display:flex;align-items:center;gap:35px;margin-top:30px}
.jr-finale__footer p{margin:0 auto 0 0;font-size:13px;color:#bcb3ac}
.jr-finale__footer .jr-btn{font-size:11px}
@media(max-width:900px){.jr-finale .jr-shell{width:calc(100% - 40px)}.jr-finale__hero{gap:30px}.jr-finale__credits{gap:18px}.jr-finale__films{gap:16px}.jr-finale__duration{display:none}.jr-finale__portrait figcaption{flex-direction:column}.jr-finale__footer{gap:20px}}
@media(max-width:640px){.jr-finale{padding:30px 0 38px}.jr-finale__masthead{font-size:9px;letter-spacing:.12em}.jr-finale__hero{grid-template-columns:1fr;padding:35px 0;gap:30px}.jr-finale h2{font-size:48px}.jr-finale__description{max-width:none}.jr-finale__portrait img{aspect-ratio:4/5}.jr-finale__films-heading{display:block;padding-top:30px}.jr-finale__films-heading>p{margin-top:12px}.jr-finale__films{grid-template-columns:1fr}.jr-finale__video{aspect-ratio:9/14;max-height:620px}.jr-finale__film figcaption{padding:14px 0 20px}.jr-finale__duration{display:block}.jr-finale__footer{flex-wrap:wrap}.jr-finale__footer p{flex-basis:100%}.jr-finale__footer .jr-btn{margin-top:5px}.jr-finale__portrait figcaption{flex-direction:row}}
@media(prefers-reduced-motion:reduce){.jr-finale *{transition:none!important;scroll-behavior:auto!important}}
/* Editorial additions: supplied September portfolio media. */
.jr-finale__gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-bottom:50px}
.jr-finale__photo{display:block;position:relative;overflow:hidden;background:#211c19}
.jr-finale__photo img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;transition:transform .4s}
/* The carousel's own hover zoom supersedes this; kept only for the non-carousel
   gallery layout, which has no `--ease` variable of its own. */
.jr-finale__gallery:not(.jr-finale__carousel) .jr-finale__photo:hover img{transform:scale(1.035)}
.jr-finale__photo span{position:absolute;right:12px;bottom:12px;display:grid;place-items:center;width:34px;height:34px;background:#14100fcc;border:1px solid #ffffff70;border-radius:50%;color:white}
.jr-finale__gallery figcaption{font-size:11px;line-height:1.6;color:#c4b7a9;padding-top:12px}
.jr-finale__spotlight{display:grid;grid-template-columns:1.2fr 1fr;gap:10%;align-items:center;padding:56px 0;border-bottom:1px solid #ffffff29}
.jr-finale__spotlight h3{font-size:clamp(30px,3.4vw,48px);line-height:1.2;margin-bottom:24px}
.jr-finale__spotlight h3 em{font-family:Georgia,serif;color:#d7c0a1;font-weight:400}
.jr-finale__spotlight .jr-finale__video{aspect-ratio:9/16;max-height:580px}
.jr-finale__spotlight figcaption{display:flex;justify-content:space-between}
.jr-finale__references{display:flex;gap:24px;flex-wrap:wrap;padding:24px 0;border-bottom:1px solid #ffffff29;font-size:11px;color:#c4b7a9}
.jr-finale__references a{color:#f8f4ee;text-decoration:underline;text-underline-offset:5px}
.jr-finale__photo:focus-visible,.jr-finale__references a:focus-visible{outline:2px solid #d7c0a1;outline-offset:4px}
.jr-finale-lightbox{border:1px solid #ffffff40;padding:48px 16px 16px;background:#14100f;color:white;max-width:95vw;max-height:95vh}
.jr-finale-lightbox::backdrop{background:#000d}
.jr-finale-lightbox img{display:block;max-height:78vh;max-width:85vw;width:auto;margin:auto}
.jr-finale-lightbox button{position:absolute;right:12px;top:8px;background:transparent;color:white;border:1px solid #ffffff80;padding:5px 14px;cursor:pointer}
@media(max-width:900px){.jr-finale__gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.jr-finale__spotlight{gap:30px}}
@media(max-width:640px){.jr-finale__spotlight{grid-template-columns:1fr;padding:35px 0}.jr-finale__gallery{margin-bottom:35px}.jr-finale__references{gap:18px}.jr-finale__references>span{width:100%}.jr-finale__films-heading>.jr-finale__link{margin-top:18px}}
/* Compact, tabbed portfolio: one browsable row at a time. */
.jr-finale--compact{padding:44px 0 32px}
.jr-finale__heading{display:flex;align-items:center;justify-content:space-between;gap:28px}
.jr-finale--compact h2{font-size:clamp(28px,3vw,42px);line-height:1.15;margin:0 0 12px;letter-spacing:-.035em}
.jr-finale--compact .jr-finale__eyebrow{margin-bottom:12px!important;font-size:10px!important}
.jr-finale__subtitle{font-size:13px;color:#c4b7a9;margin:0}
.jr-finale__subtitle span{margin:0 8px}
.jr-finale__heading>.jr-finale__link{flex-shrink:0}
.jr-finale__toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:26px 0 20px;padding-top:20px;border-top:1px solid #ffffff24}
.jr-finale__tabs{display:flex;gap:4px;background:#ffffff09;padding:4px;border:1px solid #ffffff17;border-radius:30px}
.jr-finale__tabs[hidden],.jr-finale__panel[hidden]{display:none!important}
.jr-finale__tabs button{border:0;border-radius:24px;padding:9px 19px;background:transparent;color:#c4b7a9;font:inherit;font-size:13px;cursor:pointer;line-height:1.4}
.jr-finale__tabs button[aria-selected=true]{background:#d7c0a1;color:#211c19}
.jr-finale__tabs button span{font-size:10px;opacity:.7;margin-left:8px}
.jr-finale__hint,.jr-finale__browse{font-size:11px;color:#bcb3ac}
.jr-finale--compact .jr-finale__rail{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc((100% - 64px)/5);gap:16px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#a89075 #ffffff12;padding-bottom:14px;margin:0;overscroll-behavior-x:contain}
.jr-finale__rail>figure{min-width:0;scroll-snap-align:start}
.jr-finale--compact .jr-finale__photo img{aspect-ratio:3/4;object-position:center}
/* Every clip displays 720x1280 — five of the nine are rotated phone video, so
   they report landscape but play upright — and every poster is 9:16 to match.
   A 3/4 frame sat all nine behind black pillarbox bars. */
.jr-finale--compact .jr-finale__video{aspect-ratio:9/16;max-height:none}
.jr-finale--compact video{object-fit:cover;background:#0d0b0a}
.jr-finale--compact .jr-finale__film figcaption{display:block;padding:10px 0 0}
.jr-finale--compact .jr-finale__film h4{font-size:12px;line-height:1.4;margin:0 0 4px}
.jr-finale--compact .jr-finale__duration{display:block;font-size:10px;color:#bcb3ac}
.jr-finale--compact .jr-finale__play-icon{width:44px;height:44px}
.jr-finale__browse{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:12px}
.jr-finale__browse .jr-finale__link{font-size:11px}
.jr-finale__tabs button:focus-visible,.jr-finale__rail:focus-visible{outline:2px solid #d7c0a1;outline-offset:4px}
.jr-finale--tabs-ready .jr-finale__fallback-title{display:none}
@media(max-width:900px){.jr-finale--compact .jr-finale__rail{grid-auto-columns:calc((100% - 32px)/3)}.jr-finale__hint{display:none}}
@media(max-width:640px){.jr-finale--compact{padding:28px 0}.jr-finale__heading{display:block}.jr-finale__heading>.jr-finale__link{margin-top:16px}.jr-finale__subtitle{font-size:12px;line-height:1.7}.jr-finale__toolbar{margin:20px 0 16px;padding-top:16px}.jr-finale--compact .jr-finale__rail{grid-auto-columns:68%;gap:12px}.jr-finale__browse{font-size:10px}}
.jr-finale--compact{scroll-margin-top:110px}
/* Phone layout: comfortable controls and a visible next-card preview. */
@media(max-width:640px){
 .jr-finale--compact .jr-shell{width:calc(100% - 32px)}
 .jr-finale--compact h2{font-size:clamp(28px,7.5vw,36px);line-height:1.18}
 .jr-finale__subtitle{max-width:32ch;font-size:13px}
 .jr-finale__heading>.jr-finale__link{min-height:44px;align-items:center;margin-top:8px;padding-bottom:0}
 .jr-finale__toolbar{margin-top:16px;padding-top:16px}
 .jr-finale__tabs{width:100%;box-sizing:border-box}
 .jr-finale__tabs button{flex:1;min-height:44px;font-size:14px;padding:10px 16px;touch-action:manipulation}
 .jr-finale--compact .jr-finale__rail{grid-auto-columns:min(80%,300px);gap:12px;padding-bottom:12px;scroll-padding-inline:0}
 .jr-finale--compact .jr-finale__gallery figcaption,.jr-finale--compact .jr-finale__film h4{font-size:13px;line-height:1.5}
 .jr-finale--compact .jr-finale__duration{font-size:12px}
 .jr-finale__browse{gap:10px;margin-top:4px;font-size:11px;flex-wrap:wrap}
 .jr-finale__browse .jr-finale__link{min-height:44px;padding-bottom:0;align-items:center;font-size:12px}
 .jr-finale__photo span{width:40px;height:40px}
 .jr-finale-lightbox{box-sizing:border-box;width:calc(100vw - 24px);max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:60px 10px 12px}
 .jr-finale-lightbox img{width:100%;max-width:100%;height:auto;max-height:calc(100vh - 110px);max-height:calc(100dvh - 110px);object-fit:contain}
 .jr-finale-lightbox button{min-height:44px;min-width:64px;top:8px;right:10px;touch-action:manipulation}
}
@media(max-height:500px) and (orientation:landscape){
 .jr-finale-lightbox{max-height:96dvh;padding-top:52px}
 .jr-finale-lightbox img{max-height:calc(96dvh - 76px);object-fit:contain}
}

/* Cinematic portfolio carousel; enhanced only when its controls are ready. */
.jr-finale--compact .jr-finale__carousel{--card-width:28%;--ease:cubic-bezier(.22,.61,.36,1);display:flex;gap:24px;scrollbar-width:none;padding:0 0 4px;align-items:start}
.jr-finale__carousel::-webkit-scrollbar{display:none}

/* Every card keeps its size, so the captions share one baseline. Scaling the
   whole figure lifted each inactive caption by about 6% of the card height and
   dimmed its type along with the picture, which is what made the row read as
   ragged instead of cinematic. The emphasis lives on the media alone now. */
.jr-finale__carousel>figure{flex:0 0 var(--card-width)}
/* A 9:16 film beside a 3:4 photograph: three-quarters of the width lands both
   tabs on the same card height, so the section does not resize when you switch. */
.jr-finale--compact .jr-finale__films.jr-finale__carousel{--card-width:21%}
/* Recessive, not switched off. At .55/.72 the neighbouring photographs read as
   failed loads rather than as the quieter half of a composition — the point is
   to lead the eye, not to hide five of the six pictures. */
.jr-finale__carousel .jr-finale__photo img,
.jr-finale__carousel .jr-finale__video video{opacity:.74;filter:saturate(.88);transition:opacity .55s var(--ease),filter .55s var(--ease),transform .8s var(--ease)}
.jr-finale__carousel>figure.is-current .jr-finale__photo img,
.jr-finale__carousel>figure.is-current .jr-finale__video video,
.jr-finale__carousel>figure:hover .jr-finale__photo img,
.jr-finale__carousel>figure:hover .jr-finale__video video,
.jr-finale__carousel>figure:focus-within .jr-finale__photo img,
.jr-finale__carousel>figure:focus-within .jr-finale__video video,
.jr-finale__carousel .jr-finale__video.is-playing video,
.jr-finale__carousel .jr-finale__video.is-previewing video{opacity:1;filter:none}

/* Captions recede by colour rather than by opacity, so the type never sits
   grey-on-grey over the dark ground. */
.jr-finale__carousel>figure figcaption,.jr-finale__carousel>figure figcaption h4{transition:color .5s var(--ease)}
.jr-finale__carousel>figure:not(.is-current):not(:hover):not(:focus-within) figcaption{color:#9c938b}
.jr-finale__carousel>figure:not(.is-current):not(:hover):not(:focus-within) figcaption h4{color:#b3a89f}
.jr-finale--compact .jr-finale__carousel>figure:not(.is-current):not(:hover):not(:focus-within) .jr-finale__duration{color:#6f6660}

.jr-finale__carousel{cursor:grab}
.jr-finale__carousel.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.jr-finale__carousel.is-dragging a{cursor:grabbing}
.jr-finale__carousel img{-webkit-user-drag:none;user-select:none}
.jr-finale__controls{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px 24px;align-items:center;margin-top:20px}
/* Column one, so the arrows can take the `auto` column beside it. */
.jr-finale__position{display:flex;align-items:center;gap:22px;min-width:0;grid-column:1}
.jr-finale__count{color:#d7c0a1;font-size:12px;letter-spacing:.12em;font-variant-numeric:tabular-nums;white-space:nowrap}
.jr-finale__active-caption{color:#e5dad0;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jr-finale__navigation{display:flex;gap:8px}
.jr-finale__navigation button{display:grid;place-items:center;width:44px;height:44px;border:1px solid #d7c0a155;border-radius:50%;background:transparent;color:#d7c0a1;font-size:19px;line-height:1;padding:0;cursor:pointer;transition:background .25s,color .25s}
.jr-finale__navigation button:hover{background:#d7c0a1;color:#14100f}
.jr-finale__navigation button:disabled{opacity:.3;cursor:default;background:transparent;color:#d7c0a1}
.jr-finale__navigation button:focus-visible{outline:2px solid #d7c0a1;outline-offset:4px}
.jr-finale__progress{grid-column:1/-1;height:2px;background:#d7c0a122;overflow:hidden}
.jr-finale__progress span{display:block;height:100%;background:#d7c0a1;transition:width .65s ease}
@media(max-width:900px){.jr-finale--compact .jr-finale__carousel{--card-width:40%;gap:18px}.jr-finale--compact .jr-finale__films.jr-finale__carousel{--card-width:30%}}
@media(max-width:640px){.jr-finale--compact .jr-finale__carousel{--card-width:80%;gap:12px}.jr-finale--compact .jr-finale__films.jr-finale__carousel{--card-width:60%}.jr-finale__controls{gap:14px 10px;margin-top:12px}.jr-finale__position{display:grid;gap:5px}.jr-finale__count{font-size:11px}.jr-finale__active-caption{font-size:12px}.jr-finale__navigation{gap:6px}}

/* Quiet motion previews keep the same click-to-play surface and native controls. */
.jr-finale__preview-label{position:absolute;left:12px;right:12px;bottom:16px;text-align:center;color:#f8f4ee;font-size:10px;letter-spacing:.08em;line-height:1.5;opacity:0;transform:translateY(5px);transition:opacity .3s,transform .3s;pointer-events:none}
.jr-finale__video.is-previewing .jr-finale__preview-label{opacity:1;transform:translateY(0)}
.jr-finale__video.is-previewing .jr-finale__play-icon{opacity:0;transform:translate(-50%,-50%) scale(.85)}
.jr-finale__play-icon{transition:opacity .3s,transform .3s,border-color .3s,background .3s}
.jr-finale__carousel .jr-finale__photo,
.jr-finale__carousel .jr-finale__video{transition:box-shadow .45s var(--ease)}
.jr-finale__carousel .jr-finale__play{cursor:grab}
.jr-finale__carousel.is-dragging .jr-finale__play{cursor:grabbing}

/* Hover belongs to the picture: the image drifts inside a frame that stays put,
   a hairline warms the edge, and the expand badge arrives with it instead of
   sitting on all six cards at once. Pointer-guarded, so a phone keeps the badge
   permanently visible - there is no hover to reveal it with. */
@media(hover:hover) and (pointer:fine){
 .jr-finale--compact .jr-finale__photo span{opacity:0;transform:translateY(10px);transition:opacity .4s var(--ease),transform .4s var(--ease),background .25s,border-color .25s}
 /* The badge is the only sign these open. Hiding it on every card until hover
    left the gallery with no affordance at all, so the card in focus keeps it. */
 .jr-finale__carousel>figure.is-current .jr-finale__photo span,
 .jr-finale--compact .jr-finale__photo:hover span,
 .jr-finale--compact .jr-finale__photo:focus-visible span{opacity:1;transform:none}
 .jr-finale--compact .jr-finale__photo:hover span{background:#d7c0a1;border-color:#d7c0a1;color:#14100f}
 .jr-finale__carousel .jr-finale__photo:hover img{transform:scale(1.06)}
 .jr-finale__carousel .jr-finale__photo:hover,
 .jr-finale__carousel .jr-finale__video:hover{box-shadow:inset 0 0 0 1px #d7c0a166}
}
@media(prefers-reduced-motion:reduce){
 .jr-finale__preview-label{transition:none}
 .jr-finale__carousel .jr-finale__photo:hover img{transform:none}
 .jr-finale--compact .jr-finale__photo span{opacity:1;transform:none}
}

/* ── Celebrity artistry: one film, so a spotlight rather than a rail ────────
   Reuses the `jr-finale__spotlight` grid the earlier full-width layout defined
   and never used. Sits directly under the Miss Universe section, so it drops
   the top padding and picks the divider up from that section's bottom edge. */
.jr-finale--celebrity{padding:0 0 52px}
.jr-finale--celebrity .jr-finale__heading{padding-top:38px;border-top:1px solid #ffffff24}
.jr-finale--celebrity h2{font-size:clamp(28px,3vw,42px);line-height:1.15;margin:0 0 12px;letter-spacing:-.035em}
.jr-finale--celebrity .jr-finale__eyebrow{margin-bottom:12px!important;font-size:10px!important}
/* Both tracks are fixed and the pair is centred in the shell. Letting the copy
   take a `1fr` second column stretched the measure to about 95 characters and
   left a wide empty band at the right — a composed pair reads as deliberate. */
.jr-finale--celebrity .jr-finale__spotlight{grid-template-columns:minmax(0,320px) minmax(0,540px);gap:64px;justify-content:center;align-items:center;padding:34px 0 0;border-bottom:0}
/* The titles line. Gold and letterspaced so it reads as billing under the name
   rather than as a second subtitle competing with the credit below it. */
.jr-finale__titles{font-size:11px!important;line-height:1.7!important;letter-spacing:.11em;text-transform:uppercase;color:#d7c0a1!important;margin:0 0 9px!important}
.jr-finale__titles span{margin:0 8px;color:#8d7c66}
.jr-finale--celebrity .jr-finale__film figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:14px 0 0}
.jr-finale--celebrity .jr-finale__film h4{font-size:14px;margin:0}
.jr-finale__spotlight-copy p{color:#bcb3ac;font-size:15px;line-height:1.8;margin:0 0 18px;max-width:none}
.jr-finale__spotlight-note{font-size:13px!important;color:#8d837c!important;border-left:1px solid #d7c0a166;padding-left:16px}
.jr-finale__spotlight-copy .jr-finale__link{margin-top:6px}
@media(max-width:900px){
 .jr-finale--celebrity .jr-finale__spotlight{grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:32px;justify-content:start}
 .jr-finale__spotlight-copy p{font-size:14px;line-height:1.75}
}
@media(max-width:640px){
 .jr-finale--celebrity{padding-bottom:34px}
 .jr-finale--celebrity .jr-shell{width:calc(100% - 32px)}
 .jr-finale--celebrity .jr-finale__heading{display:block;padding-top:28px}
 .jr-finale--celebrity .jr-finale__heading>.jr-finale__link{margin-top:16px}
 .jr-finale--celebrity h2{font-size:clamp(28px,7.5vw,36px);line-height:1.18}
 .jr-finale--celebrity .jr-finale__spotlight{grid-template-columns:1fr;gap:24px;padding-top:24px}
 .jr-finale--celebrity .jr-finale__video{max-height:none}
 .jr-finale__spotlight-copy p{max-width:none}
}

/* ── Pageant crowns: the roll of titleholders ───────────────────────────────
   Third in the dark block, after the Miss Universe rail and the celebrity
   spotlight. Same trick as the celebrity section: no top padding, and the
   heading takes its own hairline, so the three read as one continuous field
   rather than three stacked bands. */
.jr-finale--crowns{padding:0 0 60px}
.jr-finale--crowns .jr-finale__heading{padding-top:38px;border-top:1px solid #ffffff24}
.jr-finale--crowns h2{font-size:clamp(28px,3vw,42px);line-height:1.15;margin:0 0 12px;letter-spacing:-.035em}
.jr-finale--crowns .jr-finale__eyebrow{margin-bottom:12px!important;font-size:10px!important}

/* Both lists in this section carry their own resets. The section is a
   shortcode, so it can land inside a page whose own `ul`/`ol` styling paints
   bullets and numbers on every list item — the article and service bodies both
   do. Two class names deep beats those selectors without reaching for
   `!important`. */
.jr-crowns__roll,.jr-crowns__links{list-style:none}
.jr-finale--crowns .jr-crowns__roll>li::before,
.jr-finale--crowns .jr-crowns__links>li::before,
.jr-finale--crowns .jr-crowns__roll>li::marker,
.jr-finale--crowns .jr-crowns__links>li::marker{content:none;display:none}
.jr-finale--crowns .jr-crowns__roll>li,
.jr-finale--crowns .jr-crowns__links>li{padding-left:0;text-indent:0}

.jr-crowns__roll{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin:34px 0 0;padding:0}
/* The three notes run to two, three and two lines, so the links have to be
   pushed rather than left to follow the copy — otherwise the row of "read
   more" links steps down the page instead of sharing a baseline. */
.jr-crowns__card{min-width:0;display:flex;flex-direction:column}
.jr-crowns__copy{display:flex;flex-direction:column;flex:1}
.jr-crowns__card>.jr-crowns__copy>.jr-finale__link{margin-top:auto;align-self:flex-start}
/* A card carrying several of its own links takes the same list the spotlight
   uses, stacked rather than in a row — a card column is too narrow to sit two
   links side by side without one of them wrapping mid-label. */
.jr-crowns__card .jr-crowns__links{margin-top:auto;flex-direction:column;gap:10px;align-items:flex-start}
.jr-crowns__card .jr-crowns__links .jr-finale__link{font-size:11px;gap:12px}
.jr-crowns__portrait{position:relative;overflow:hidden;background:#211c19;margin:0}
.jr-crowns__portrait img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;object-position:50% 22%;transition:transform .6s cubic-bezier(.22,.61,.36,1)}
.jr-crowns__copy{padding-top:16px}
/* The index sits on the title line rather than over the picture: three gold
   numerals floating on three portraits read as watermarks, not as a sequence. */
.jr-crowns__title{font-size:10px!important;letter-spacing:.16em;text-transform:uppercase;color:#d7c0a1!important;margin:0 0 9px!important}
.jr-crowns__index{margin-right:12px;color:#8d7c66;font-variant-numeric:tabular-nums}
.jr-finale--crowns .jr-crowns__card h3{font-size:21px;font-weight:400;letter-spacing:-.02em;color:#fff;margin:0 0 10px}
.jr-crowns__note{font-size:13px!important;line-height:1.75!important;color:#bcb3ac!important;margin:0 0 16px!important;max-width:34ch}
.jr-crowns__card .jr-finale__link{font-size:11px;gap:14px}
@media(hover:hover) and (pointer:fine){
 .jr-crowns__card:hover .jr-crowns__portrait img{transform:scale(1.05)}
 .jr-crowns__card:hover .jr-crowns__portrait{box-shadow:inset 0 0 0 1px #d7c0a166}
}

/* The newest sash. Fixed tracks and centred, for the reason the celebrity
   spotlight is: a `1fr` copy column stretches the measure past 90 characters
   and leaves a dead band on the right. */
.jr-crowns__spotlight{grid-template-columns:minmax(0,340px) minmax(0,540px);gap:64px;justify-content:center;align-items:center;padding:56px 0 0;border-bottom:0;scroll-margin-top:100px}
.jr-crowns__portrait--large figcaption{position:absolute;bottom:0;left:0;right:0;padding:64px 20px 18px;background:linear-gradient(transparent,#000c);display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:12px;color:#fff}
.jr-crowns__portrait--large figcaption span{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#d7c0a1}
.jr-crowns__portrait--large img{aspect-ratio:4/5;object-position:50% 18%}
.jr-finale--crowns .jr-finale__spotlight-copy h3{font-size:clamp(26px,2.6vw,34px);font-weight:500;line-height:1.2;letter-spacing:-.03em;margin:0 0 20px}
.jr-finale--crowns .jr-finale__spotlight-copy h3 em{font-family:Georgia,serif;font-weight:400;color:#d7c0a1}
.jr-crowns__links{display:flex;flex-wrap:wrap;gap:14px 30px;list-style:none;margin:26px 0 0;padding:0}
.jr-crowns__links .jr-finale__link{font-size:11px;gap:12px}

.jr-crowns__gallery-head{display:flex;align-items:baseline;justify-content:space-between;gap:24px;border-top:1px solid #ffffff24;margin-top:56px;padding-top:30px;margin-bottom:24px}
.jr-finale--crowns .jr-crowns__gallery-head h3{font-size:24px;font-weight:400;letter-spacing:-.02em;color:#fff;margin:0}
.jr-crowns__gallery-head p{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#c4b7a9;margin:0;text-align:right}
.jr-finale--crowns .jr-finale__gallery{margin-bottom:26px}
.jr-finale--crowns .jr-finale__photo img{object-position:50% 20%}

@media(max-width:900px){
 /* Four 3:4 portraits across a tablet leaves each one about 160px wide, which
    is narrower than the crown in them. Two up, two down. */
 .jr-crowns__roll{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 24px}
 .jr-crowns__note{font-size:12px!important}
 .jr-crowns__spotlight{grid-template-columns:minmax(0,270px) minmax(0,1fr);gap:34px;justify-content:start;padding-top:40px}
}
@media(max-width:640px){
 .jr-finale--crowns{padding-bottom:38px}
 .jr-finale--crowns .jr-shell{width:calc(100% - 32px)}
 .jr-finale--crowns .jr-finale__heading{display:block;padding-top:28px}
 .jr-finale--crowns .jr-finale__heading>.jr-finale__link{margin-top:16px;min-height:44px;align-items:center;padding-bottom:0}
 .jr-finale--crowns h2{font-size:clamp(28px,7.5vw,36px);line-height:1.18}
 /* Three 3:4 portraits stacked full width is most of a phone screen each. The
    card turns on its side instead, so the roll stays a list you can read in
    one scroll. */
 .jr-crowns__roll{grid-template-columns:1fr;gap:22px;margin-top:26px}
 .jr-crowns__card{display:grid;grid-template-columns:112px minmax(0,1fr);gap:16px;align-items:start}
 .jr-crowns__copy{padding-top:2px}
 .jr-crowns__note{max-width:none;margin-bottom:12px!important}
 .jr-finale--crowns .jr-crowns__card h3{font-size:18px}
 .jr-crowns__card .jr-finale__link{min-height:44px;align-items:center;padding-bottom:0}
 .jr-crowns__spotlight{grid-template-columns:1fr;gap:26px;padding-top:32px}
 .jr-crowns__links{gap:2px 24px}
 .jr-crowns__links .jr-finale__link{min-height:44px;align-items:center;padding-bottom:0;font-size:12px}
 .jr-crowns__gallery-head{display:block;margin-top:38px;padding-top:24px}
 .jr-crowns__gallery-head p{text-align:left;margin-top:8px}
 .jr-finale--crowns .jr-finale__gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
}
@media(prefers-reduced-motion:reduce){.jr-crowns__portrait img{transition:none}.jr-crowns__card:hover .jr-crowns__portrait img{transform:none}}

/* Lightbox navigation stays below the photograph, within thumb reach. */
.jr-finale-lightbox__navigation{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:12px;color:#d7c0a1;font-size:12px;letter-spacing:.12em;font-variant-numeric:tabular-nums}
.jr-finale-lightbox .jr-finale-lightbox__navigation button{position:static;display:grid;place-items:center;min-width:44px;width:44px;min-height:44px;height:44px;padding:0;border:1px solid #d7c0a177;border-radius:50%;background:transparent;color:#d7c0a1;font-size:22px;line-height:1;cursor:pointer}
.jr-finale-lightbox .jr-finale-lightbox__navigation button:hover{background:#d7c0a1;color:#14100f}
.jr-finale-lightbox button:focus-visible{outline:2px solid #d7c0a1;outline-offset:3px}
.jr-finale-lightbox .jr-finale-lightbox__navigation button:disabled{opacity:.35;cursor:default}
.jr-finale-lightbox img{max-height:calc(95vh - 140px);max-height:calc(95dvh - 140px)}
@media(max-width:640px){.jr-finale-lightbox img{max-height:calc(100vh - 175px);max-height:calc(100dvh - 175px)}}
@media(max-height:500px) and (orientation:landscape){.jr-finale-lightbox img{max-height:calc(96dvh - 140px)}}

/* Homepage portfolio: original dark palette with consistent responsive layout. */
.home .jr-finale{background:#14100f;color:#f8f4ee}
.home .jr-finale .jr-shell{max-width:var(--jr-shell,1200px);width:calc(100% - 48px)}
.home .jr-finale :is(h2,h3,h4),
.home .jr-finale .jr-crowns__card h3,
.home .jr-finale .jr-crowns__gallery-head h3{color:#f8f4ee}
.home .jr-finale h2{font-size:clamp(28px,3vw,42px);line-height:1.15;margin-bottom:12px}
.home .jr-finale :is(h2,h3) em,
.home .jr-finale .jr-finale__spotlight-copy h3 em{color:#d7c0a1}
.home .jr-finale :is(.jr-finale__eyebrow,.jr-finale__titles,.jr-crowns__title){color:#d7c0a1!important}
.home .jr-finale :is(.jr-finale__subtitle,.jr-finale__spotlight-copy p,.jr-finale__hint,.jr-finale__browse,.jr-finale__duration,.jr-crowns__gallery-head p,.jr-finale__gallery figcaption,.jr-finale__film figcaption){color:#bcb3ac}
.home .jr-finale :is(.jr-crowns__note,.jr-finale__spotlight-note){color:#bcb3ac!important}
.home .jr-finale :is(.jr-finale__titles span,.jr-crowns__index){color:#a99b8d}
.home .jr-finale .jr-finale__link{color:#f8f4ee!important;border-color:#ffffff29}
.home .jr-finale .jr-finale__link:hover{color:#d7c0a1!important}
.home .jr-finale :is(.jr-finale__heading,.jr-finale__toolbar,.jr-finale__spotlight,.jr-crowns__gallery-head,.jr-finale__spotlight-note,.jr-finale__controls){border-color:#ffffff29}
.home .jr-finale .jr-finale__tabs{background:#ffffff09;border-color:#ffffff29}
.home .jr-finale .jr-finale__tabs button{color:#bcb3ac}
.home .jr-finale .jr-finale__tabs button[aria-selected=true]{background:#d7c0a1;color:#14100f}
.home .jr-finale--celebrity .jr-finale__spotlight,
.home .jr-finale--crowns .jr-crowns__spotlight{grid-template-columns:minmax(0,340px) minmax(0,540px);gap:48px;justify-content:center;padding-top:36px}
.home .jr-finale--celebrity .jr-finale__video{aspect-ratio:9/16;max-height:none}
.home .jr-finale--celebrity video{object-fit:contain}
.home .jr-crowns__portrait--large img{aspect-ratio:3/4;object-fit:cover;object-position:top center}
.home .jr-crowns__roll{gap:20px}
.home .jr-finale--portfolio-films{padding-top:0}
.home .jr-finale--portfolio-films .jr-finale__heading{border-top:1px solid #ffffff29;padding-top:38px;margin-bottom:30px}
.home .jr-finale--portfolio-films .jr-finale__films{max-width:960px;gap:20px}
.home .jr-finale--portfolio-films .jr-finale__video{aspect-ratio:9/16;max-height:none}
.home .jr-finale--portfolio-films video{object-fit:contain}
@media(max-width:900px){
 .home .jr-finale--celebrity .jr-finale__spotlight,
 .home .jr-finale--crowns .jr-crowns__spotlight{grid-template-columns:minmax(0,280px) minmax(0,1fr);gap:28px}
}
@media(max-width:640px){
 .home .jr-finale .jr-shell{width:calc(100% - 32px)}
 .home .jr-finale--celebrity .jr-finale__spotlight,
 .home .jr-finale--crowns .jr-crowns__spotlight{grid-template-columns:minmax(0,1fr);gap:24px;padding-top:24px}
 .home .jr-finale--portfolio-films .jr-finale__films{gap:24px}
}

.home .jr-finale :is(.jr-finale__count,.jr-finale__active-caption){color:#bcb3ac}
.home .jr-finale .jr-finale__navigation button{color:#f8f4ee;border-color:#ffffff29}
.home .jr-finale .jr-finale__navigation button:hover:not(:disabled){background:#d7c0a1;border-color:#d7c0a1;color:#14100f}
.home .jr-finale .jr-finale__progress{background:#ffffff29}
.home .jr-finale .jr-finale__progress span{background:#d7c0a1}
.home .jr-finale :is(a,button):focus-visible{outline-color:#d7c0a1}

/* Credited films: a sash over the clip, then name, look and running time.
   The caption is a block rather than the number/title/duration grid the finale
   rail uses, and every rule is scoped through `figcaption` so it outweighs
   `.jr-finale__film figcaption p`, which would otherwise grey the gold line. */
/* The figure is a grid/flex item and already stretches to the tallest card;
   this passes that height down so the one card with a link can pin it to the
   bottom rather than hanging under a short note. */
.jr-finale__film--credit{display:flex;flex-direction:column}
.jr-finale__film--credit figcaption{display:flex;flex-direction:column;flex:1;padding:16px 0 0}
.jr-finale__film--credit figcaption h4{font-size:17px;letter-spacing:-.012em;margin:0 0 6px}
.jr-finale__film--credit figcaption .jr-finale__film-label{font-size:10px;letter-spacing:.15em;text-transform:uppercase;line-height:1.5;color:#d7c0a1;margin:0 0 10px}
.jr-finale__film--credit figcaption .jr-finale__film-note{font-size:12px;line-height:1.75;color:#bcb3ac;margin:0}
/* `align-self` so the link's own underline is only as wide as its text: as a
   flex child in a column it would otherwise stretch the full card. */
.jr-finale__film--credit figcaption .jr-finale__link{align-self:flex-start;margin-top:16px;font-size:11px;gap:10px;padding-bottom:4px}
/* The clips are 9:16 in a 9:16 frame, so this sits on the film itself; it fades
   out on play rather than staying over the look. */
.jr-finale__sash{position:absolute;top:12px;left:12px;z-index:2;pointer-events:none;max-width:calc(100% - 24px);padding:6px 11px;background:#14100fc4;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid #d7c0a14d;color:#e9ded0;font-size:10px;letter-spacing:.14em;text-transform:uppercase;line-height:1.4;transition:opacity .3s}
.jr-finale__video.is-playing .jr-finale__sash{opacity:0}
/* The duration is hidden between 640 and 900px for the rail's compact cards;
   here it is half of the credit line, so it stays. */
@media(max-width:900px){.jr-finale__film--credit figcaption .jr-finale__duration{display:block}}

/* Keep the extended photo set in one compact, evenly sized row. */
.jr-finale--crowns .jr-finale__gallery{grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}
@media(max-width:900px){.jr-finale--crowns .jr-finale__gallery{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:14px}.jr-finale--crowns .jr-finale__gallery>figure{flex:0 0 30%;min-width:0;scroll-snap-align:start}}
@media(max-width:640px){.jr-finale--crowns .jr-finale__gallery>figure{flex-basis:72%}.jr-finale--portfolio-films .jr-finale__films{display:flex;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:14px}.jr-finale--portfolio-films .jr-finale__films>figure{flex:0 0 72%;min-width:0;scroll-snap-align:start}}