/* Native vertical film showcase and right-edge scrubber. */
.alpha-portfolio-template { --alpha-adminbar: 0px; --portfolio-ink: #fff; --portfolio-muted: rgba(255,255,255,.72); background: #151719; color: var(--portfolio-ink); }
.alpha-portfolio-template.admin-bar { --alpha-adminbar: 32px; }
.alpha-portfolio-template.alpha-portfolio-light { --portfolio-ink: #17191b; --portfolio-muted: rgba(23,25,27,.72); }
.alpha-portfolio-template::after { display: none !important; }
.alpha-portfolio-template #wrapper { position: relative; }
.alpha-portfolio-template.no-js #wrapper { position: relative; }
.alpha-portfolio-template #content { background: #151719; }
.alpha-portfolio-template #top { display: none; }
.alpha-portfolio-template.portfolio-ready { overflow: hidden !important; }
.alpha-portfolio-template.portfolio-ready #wrapper { position: fixed; inset: var(--alpha-adminbar) 0 0; height: calc(100svh - var(--alpha-adminbar)); height: calc(100dvh - var(--alpha-adminbar)); }
.alpha-portfolio-template.portfolio-ready #content { height: 100%; }
.alpha-portfolio-template.portfolio-ready #header { position: fixed; top: var(--alpha-adminbar); height: var(--alpha-header-height); padding: 0; background: transparent; color: #fff; transform: none !important; z-index: 1000; }
.alpha-portfolio-template.portfolio-ready #logo-holder { position: absolute; left: var(--alpha-gutter); top: 50%; margin: 0; transform: translateY(-50%); }
.alpha-portfolio-template.portfolio-ready #menu-holder { right: var(--alpha-gutter); }
.alpha-portfolio-template.portfolio-ready #logo-holder #logo > .light { display: block; position: relative; opacity: 1; visibility: visible; }
.alpha-portfolio-template.portfolio-ready #logo-holder #logo > .dark { display: none; }
.alpha-portfolio-template.portfolio-ready #menu-opener .lines, .alpha-portfolio-template.portfolio-ready #menu-opener .lines::before, .alpha-portfolio-template.portfolio-ready #menu-opener .lines::after { background: currentColor; height: 2px; }
.alpha-portfolio-template.portfolio-ready #menu-opener.opened .lines { background: transparent; }
.alpha-portfolio-template.portfolio-ready #menu-opener.opened .lines::before, .alpha-portfolio-template.portfolio-ready #menu-opener.opened .lines::after { background: currentColor; }
.alpha-portfolio-template.portfolio-ready #main-menu { top: var(--alpha-adminbar); height: calc(100% - var(--alpha-adminbar)); }
.alpha-portfolio-template .alpha-showcase { position: relative; height: calc(100svh - var(--alpha-adminbar)); height: calc(100dvh - var(--alpha-adminbar)); color: var(--portfolio-ink); }
.alpha-portfolio-template.portfolio-ready .alpha-showcase { height: 100%; }
.alpha-showcase__sr { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; border: 0 !important; }
.alpha-showcase__track { height: 100%; width: 100%; overflow-y: auto; overflow-x: hidden; scroll-snap-type: y mandatory; overscroll-behavior-y: contain; touch-action: pan-y pinch-zoom; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.alpha-showcase__track::-webkit-scrollbar { display: none; }
.alpha-portfolio-template .alpha-showcase__track:focus-visible { outline: 2px solid var(--portfolio-ink); outline-offset: -6px; }
.alpha-showcase__slide { position: relative; isolation: isolate; height: 100%; min-height: 100%; width: 100%; scroll-snap-align: start; scroll-snap-stop: always; color: #fff; overflow: hidden; }
/* The veils are shared tokens: the film hero uses exactly the same gradients. */
.alpha-showcase__slide::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: var(--alpha-veil-dark); }
.alpha-showcase__slide[data-tone-l="light"] { color: #17191b; }
.alpha-showcase__slide[data-tone-l="light"]::after { background: var(--alpha-veil-light); }
.alpha-showcase__media { position: absolute; inset: 0; z-index: -2; pointer-events: none; }
.alpha-showcase__media picture, .alpha-showcase__media .alpha-showcase__image { display: block; width: 100%; height: 100%; }
.alpha-showcase__media .alpha-showcase__image { object-fit: cover; object-position: center; }
.alpha-showcase__background-video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .4s ease; }
.alpha-showcase__slide.is-video-playing .alpha-showcase__background-video { opacity: 1; }
.alpha-showcase__caption { position: absolute; inset-inline: var(--alpha-gutter) calc(var(--alpha-gutter) + 3.5rem); bottom: var(--alpha-caption-bottom); max-width: 76rem; z-index: 2; max-height: calc(100% - 12rem); overflow: auto; scrollbar-width: thin; padding-block: .5rem; }
/* Eyebrow metadata typography lives in template-modern.css, shared with the film hero. */
.alpha-showcase__title { color: inherit; font-size: var(--alpha-film-title); line-height: 1.04; font-weight: 400; letter-spacing: -.045em; margin: 0; max-width: 100%; overflow-wrap: normal; word-break: normal; hyphens: none; text-wrap: balance; text-transform: none; }
.alpha-showcase__subtitle { max-width: 36rem; margin: 1.5rem 0 0; font-size: clamp(.95rem, 1.3vw, 1.2rem); line-height: 1.6; }
.alpha-showcase__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: 2rem; }
.alpha-showcase__canvas-link { position: absolute; inset: 0; z-index: 1; -webkit-tap-highlight-color: transparent; }
/* Film titles are links without underlines in every state and on every input type. */
.alpha-showcase__film-link { display: block; color: inherit; -webkit-tap-highlight-color: transparent; }
.alpha-showcase__film-link, .alpha-showcase__film-link:is(:hover, :focus, :active), .alpha-showcase__film-link * { text-decoration: none !important; }
.alpha-showcase__film-link:hover { color: inherit; }
.alpha-portfolio-template .alpha-showcase__cta { display: inline-flex; align-items: center; gap: 1.25rem; min-height: 44px; padding: .35rem 0; border: 0; border-bottom: 1px solid currentColor; border-radius: 0; background: transparent; color: inherit; font-size: var(--alpha-small-size); letter-spacing: .025em; text-transform: none; text-decoration: none; transition: opacity .2s; }
.alpha-showcase__cta svg, .alpha-showcase__cta > span { width: 22px; font-size: 1.35rem; transition: transform .25s ease; }
.alpha-showcase__cta:hover { opacity: .78; text-decoration: none; }
.alpha-showcase__cta:hover > span { transform: translate(3px, -3px); }
.alpha-showcase__cta:hover svg { transform: translateY(3px); }
.alpha-showcase__video-toggle { min-height: 44px; border: 0; border-bottom: 1px solid currentColor; border-radius: 0; padding: .6rem 0; color: inherit; background: transparent; font: inherit; font-size: .75rem; cursor: pointer; }
.portfolio-ready .alpha-showcase__caption { transition: opacity .4s ease, transform .5s cubic-bezier(.2,.75,.25,1); }
.portfolio-ready .alpha-showcase__slide:not(.is-active) .alpha-showcase__caption { opacity: .4; transform: translate3d(0, 18px, 0); }
.alpha-showcase__hud, .alpha-showcase__progress { display: none; }
.portfolio-ready .alpha-showcase__hud { position: absolute; inset-inline: var(--alpha-gutter); bottom: max(1.5rem, env(safe-area-inset-bottom)); display: flex; align-items: center; justify-content: space-between; gap: 1rem; z-index: 5; pointer-events: none; }
.alpha-showcase__position { display: flex; align-items: center; gap: 2rem; }
.alpha-showcase__counter { font-size: var(--alpha-small-size); font-variant-numeric: tabular-nums; letter-spacing: .08em; white-space: nowrap; }
.alpha-showcase__counter-divider { opacity: .45; }
.alpha-showcase__hint { display: flex; align-items: center; gap: .5rem; color: var(--portfolio-muted); font-size: .65rem; text-transform: uppercase; letter-spacing: .09em; }
.alpha-showcase__hint svg { width: 18px; height: 18px; }
/* Arrow buttons take their circular glass look from the shared control rule in template-modern.css. */
.alpha-showcase__controls { display: flex; gap: .5rem; pointer-events: auto; }
.alpha-showcase__controls button:disabled { opacity: .3; cursor: default; }
/* A 44px hit area surrounds each hairline dash. Long collections scroll vertically. */
.alpha-film-scrubber { display: none; }
.alpha-film-scrubber__list { list-style: none; margin: 0; padding: .5rem 0; max-height: min(62svh, 42rem); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; }
.alpha-film-scrubber__list::-webkit-scrollbar { display: none; }
.alpha-film-scrubber__list li { margin: 0; padding: 0; }
.alpha-film-scrubber__link { position: relative; display: flex; align-items: center; justify-content: flex-end; width: 44px; height: 44px; margin-inline-start: auto; padding-inline-end: 4px; color: inherit; pointer-events: auto; }
.alpha-film-scrubber__pip { display: block; width: 14px; height: 2px; border-radius: 2px; background: currentColor; opacity: .5; transform-origin: right center; transition: transform .35s var(--alpha-ease-out), opacity .3s, box-shadow .35s; box-shadow: 0 0 10px rgba(0,0,0,.3); }
.alpha-film-scrubber__link.is-active .alpha-film-scrubber__pip { background: var(--alpha-brand); opacity: 1; transform: scaleX(2); box-shadow: 0 0 12px color-mix(in srgb, var(--alpha-brand) 55%, transparent); }
.alpha-film-scrubber__link:is(:hover, :focus-visible) .alpha-film-scrubber__pip { opacity: 1; transform: scaleX(2.5); }
.alpha-film-scrubber__link:focus-visible { outline-offset: -1px; }
/* Hover labels: larger, high-contrast type on dark frosted glass. */
.alpha-film-scrubber__label { position: absolute; inset-inline-end: 52px; display: flex; align-items: center; gap: 1.1rem; width: max-content; max-width: min(32rem, calc(100vw - 9rem)); padding: .8rem 1.15rem; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; background: rgba(10,11,13,.86); color: #fff; box-shadow: 0 14px 34px rgba(0,0,0,.3); font-size: clamp(1.1rem, .85rem + .45vw, 1.5rem); font-weight: 500; letter-spacing: -.01em; line-height: 1.3; opacity: 0; visibility: hidden; transform: translateX(8px); transition: opacity .22s ease, transform .35s var(--alpha-ease-out), visibility .22s; pointer-events: none; }
.alpha-film-scrubber__label > span:first-child { text-wrap: balance; }
.alpha-film-scrubber__number { color: rgba(255,255,255,.62); white-space: nowrap; font-variant-numeric: tabular-nums; font-size: .78rem; font-weight: 500; letter-spacing: .08em; }
.alpha-film-scrubber__link.is-active .alpha-film-scrubber__number { color: var(--alpha-brand); }
.alpha-film-scrubber__link:is(:hover, :focus-visible) .alpha-film-scrubber__label { opacity: 1; visibility: visible; transform: none; }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .alpha-film-scrubber__label { background: rgba(10,11,13,.74); -webkit-backdrop-filter: blur(18px) saturate(150%); backdrop-filter: blur(18px) saturate(150%); }
}
/* Opening cursor: a compact glass pill that follows the pointer with frame-rate independent easing. */
.alpha-film-cursor { display: none; position: fixed; top: 0; left: 0; z-index: 50; pointer-events: none; transform: translate3d(-200px, -200px, 0); will-change: transform; }
.alpha-film-cursor__pill { position: relative; display: inline-flex; align-items: center; gap: .6rem; height: 40px; padding: 0 1rem 0 5px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; background: rgba(12,13,15,.62); color: #fff; box-shadow: 0 10px 30px rgba(0,0,0,.28); white-space: nowrap; translate: -50% -50%; opacity: 0; scale: .72; transition: opacity .22s ease, scale .45s var(--alpha-ease-out), padding .4s var(--alpha-ease-out), gap .4s var(--alpha-ease-out); }
.alpha-film-cursor__pill::before { content: ""; position: absolute; inset: -1px; border: 1px solid var(--alpha-brand); border-radius: inherit; box-shadow: 0 0 18px color-mix(in srgb, var(--alpha-brand) 45%, transparent); opacity: .2; pointer-events: none; animation: alpha-cursor-breathe 3.2s ease-in-out infinite; }
.alpha-film-cursor__icon { position: relative; display: flex; align-items: center; justify-content: center; flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--alpha-brand); color: #111; transition: background-color .3s ease; }
.alpha-film-cursor__icon svg { display: block; width: 12px; height: 12px; transition: opacity .2s ease, scale .3s var(--alpha-ease-out); }
.alpha-film-cursor__label { max-width: 9em; overflow: hidden; font-size: 11px; font-weight: 600; letter-spacing: .12em; line-height: 1; text-transform: uppercase; transition: max-width .4s var(--alpha-ease-out), opacity .2s ease; }
.alpha-film-cursor.is-visible .alpha-film-cursor__pill { opacity: 1; scale: 1; }
.alpha-film-cursor.is-visible.is-magnetic .alpha-film-cursor__pill { scale: 1.06; }
/* Opening a film: the label folds away, leaving a round glass badge whose play disc becomes a spinning gold arc. */
.alpha-film-cursor__icon::after { content: ""; position: absolute; inset: 0; border: 2px solid color-mix(in srgb, var(--alpha-brand) 22%, transparent); border-top-color: var(--alpha-brand); border-radius: 50%; opacity: 0; transition: opacity .25s ease .1s; }
.alpha-film-cursor.is-loading { display: block; }
.alpha-film-cursor.is-loading .alpha-film-cursor__pill { gap: 0; padding-inline-end: 5px; }
.alpha-film-cursor.is-loading .alpha-film-cursor__pill::before { animation: none; opacity: 0; }
.alpha-film-cursor.is-loading .alpha-film-cursor__label { max-width: 0; opacity: 0; }
.alpha-film-cursor.is-loading .alpha-film-cursor__icon { background-color: transparent; }
.alpha-film-cursor.is-loading .alpha-film-cursor__icon svg { opacity: 0; scale: .5; }
.alpha-film-cursor.is-loading .alpha-film-cursor__icon::after { opacity: 1; animation: alpha-cursor-spin .8s linear infinite; }
@keyframes alpha-cursor-spin { to { rotate: 360deg; } }
@keyframes alpha-cursor-breathe { 0%, 100% { opacity: .18; } 50% { opacity: .85; } }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .alpha-film-cursor__pill { background: rgba(12,13,15,.5); -webkit-backdrop-filter: blur(14px) saturate(160%); backdrop-filter: blur(14px) saturate(160%); }
}
@media (prefers-reduced-transparency: reduce) {
    .alpha-film-cursor__pill, .alpha-film-scrubber__label { background: #141618; -webkit-backdrop-filter: none; backdrop-filter: none; }
}
.alpha-showcase__empty { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 6rem var(--alpha-gutter); gap: 1rem; color: #fff; text-align: center; overflow: auto; }
.alpha-showcase__empty h2 { font-size: clamp(2rem, 6vw, 5rem); line-height: 1.1; }
.alpha-showcase__empty .post-password-form { width: min(100%, 30rem); }
.alpha-showcase__empty input { width: 100%; color: #151515; }
/* Opening a film: the reel's controls recede while the cursor folds into a loading ring (below). */
.alpha-portfolio-template.alpha-page-leaving #content { opacity: 1; }
.alpha-portfolio-template :is(.alpha-showcase__hud, .alpha-film-scrubber) { transition: opacity .2s ease; }
.alpha-portfolio-template:is(.alpha-page-leaving, .alpha-film-opening) :is(.alpha-showcase__hud, .alpha-film-scrubber) { opacity: 0; }

@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
    .portfolio-ready .alpha-film-scrubber { position: absolute; display: block; right: calc(var(--alpha-gutter) - 4px); top: 50%; width: min(36rem, calc(100vw - var(--alpha-gutter) * 2)); transform: translateY(-50%); z-index: 8; color: var(--portfolio-ink); pointer-events: none; }
}
@media (hover: hover) and (pointer: fine) {
    .has-portfolio-cursor .has-visible-cursor .alpha-showcase__canvas-link, .has-portfolio-cursor .has-visible-cursor .alpha-showcase__film-link { cursor: none; }
    .has-portfolio-cursor .alpha-film-cursor { display: block; }
}
/* Touch has no hover cursor, but a tapped film still shows the loading ring where the finger landed. */
@media (hover: none), (pointer: coarse) { .alpha-film-cursor:not(.is-loading), .alpha-film-scrubber { display: none !important; } }
@media (max-width: 782px) { .alpha-portfolio-template.admin-bar { --alpha-adminbar: 46px; } }
@media (max-width: 767px) and (orientation: portrait) {
    .alpha-showcase__slide[data-tone-p="dark"] { color: #fff; }
    .alpha-showcase__slide[data-tone-p="dark"]::after { background: var(--alpha-veil-dark); }
    .alpha-showcase__slide[data-tone-p="light"] { color: #17191b; }
    .alpha-showcase__slide[data-tone-p="light"]::after { background: var(--alpha-veil-light); }
}
@media (max-width: 599px) {
    /* Title size and caption offset come from the shared mobile tokens in style.css. */
    .alpha-showcase__title { line-height: 1.08; letter-spacing: -.03em; }
    .alpha-showcase__caption { max-height: calc(100% - 11rem); inset-inline-end: var(--alpha-gutter); }
    .alpha-showcase__subtitle { margin-top: 1rem; }
    .alpha-showcase__actions { margin-top: 1.5rem; }
    .alpha-showcase__position { gap: .8rem; }
    .alpha-showcase__hint { font-size: .55rem; letter-spacing: .03em; gap: .2rem; }
}
@media (max-height: 500px) { .alpha-showcase__caption, .portfolio-ready .alpha-showcase__caption { max-height: calc(100% - 10rem); } .portfolio-ready .alpha-film-scrubber { display: none; } }
@media (prefers-reduced-motion: reduce) { .alpha-showcase *, .alpha-showcase *::after { transition: none !important; scroll-behavior: auto !important; } .alpha-film-cursor { display: none !important; } }
@media (forced-colors: active) { .alpha-film-scrubber__label { background: Canvas; color: CanvasText; border: 1px solid ButtonText; } .alpha-showcase__slide::after { background: Canvas !important; } .alpha-showcase__slide { color: CanvasText !important; } .alpha-film-cursor { display: none !important; } .has-portfolio-cursor .alpha-showcase__canvas-link, .has-portfolio-cursor .alpha-showcase__film-link { cursor: pointer !important; } }