/* Shared cinematic image viewer for the three marketing pages. */
.cf-zoom-trigger{display:block;width:100%;padding:0;text-align:left;cursor:zoom-in}
.cf-zoom-hint{position:absolute;right:10px;bottom:10px;display:grid;place-items:center;width:24px;height:24px;border:1px solid rgba(201,164,92,.35);border-radius:50%;background:rgba(16,22,28,.88);color:var(--gold-text);box-shadow:0 3px 12px #0004;pointer-events:none}
.cf-zoom-hint svg{width:12px;height:12px}
.cf-lightbox{position:fixed;inset:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:24px;border:0;background:transparent;color:var(--text);overflow:auto;overscroll-behavior:contain}
.cf-lightbox[open]{display:grid;place-items:center}
.cf-lightbox::backdrop{background:rgba(3,8,12,.84);backdrop-filter:blur(10px);animation:cf-backdrop-in .38s ease both}
.cf-lightbox-stage{width:min(1400px,calc(100vw - 64px),calc((100dvh - 200px)*var(--zoom-ratio,1.8685)));min-width:0}
.cf-lightbox-toolbar{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:16px;animation:cf-toolbar-in .4s ease both}
.cf-lightbox-eyebrow{font-size:10px;letter-spacing:.16em;color:var(--gold-text)}
.cf-lightbox-toolbar h2{margin-top:4px;font-size:clamp(16px,2vw,22px);font-weight:500;line-height:1.3;letter-spacing:-.025em}
.cf-lightbox-close{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:1px solid rgba(201,164,92,.3);border-radius:50%;background:rgba(255,255,255,.04);color:var(--text);transition:background .2s,border-color .2s}
.cf-lightbox-close:hover{background:rgba(201,164,92,.12);border-color:var(--gold)}
.cf-lightbox .cf-lightbox-frame{transform-origin:top left;border-radius:16px;border-color:rgba(201,164,92,.5);box-shadow:0 32px 100px #0009,0 0 60px rgba(201,164,92,.07);transition:none;transform:none}
.cf-lightbox.is-closing::backdrop{animation:cf-backdrop-out .26s ease both}
.cf-lightbox.is-closing .cf-lightbox-toolbar{animation:cf-toolbar-out .18s ease both}
@keyframes cf-backdrop-in{from{opacity:0}to{opacity:1}}
@keyframes cf-backdrop-out{from{opacity:1}to{opacity:0}}
@keyframes cf-toolbar-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes cf-toolbar-out{to{opacity:0}}
@media(max-width:560px){
 .cf-lightbox{padding:12px}
 .cf-lightbox-stage{width:min(calc(100vw - 24px),calc((100dvh - 180px)*var(--zoom-ratio,1.8685)))}
 .cf-lightbox-toolbar{gap:12px;margin-bottom:12px}
 .cf-lightbox .cf-lightbox-frame{border-radius:10px}
}

.cf-lightbox-frame{position:relative;aspect-ratio:var(--zoom-ratio,1.8685);overflow:hidden;border:1px solid rgba(201,164,92,.5);background:var(--pb-surface);touch-action:pan-y pinch-zoom}
.cf-lightbox-frame img{position:absolute;display:block;max-width:none;height:auto;user-select:none;-webkit-user-drag:none}
.cf-lightbox-frame video{display:block;width:100%;height:100%;object-fit:contain;background:#080d11}
.cf-lightbox-nav{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:18px}
.cf-lightbox-nav button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid rgba(201,164,92,.3);border-radius:50%;background:rgba(255,255,255,.04);color:var(--gold-text);transition:background .2s,border-color .2s}
.cf-lightbox-nav button:hover{background:rgba(201,164,92,.14);border-color:var(--gold)}
.cf-lightbox-count{min-width:48px;text-align:center;color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}
.cf-lightbox-swipe{margin-top:8px;text-align:center;font-size:11px;color:var(--muted)}
@media(hover:hover) and (pointer:fine){.cf-lightbox-swipe{display:none}}
.cf-film-zoom{position:absolute;inset:0;z-index:1;border:0;background:transparent}
.cf-film-zoom .cf-zoom-hint{top:16px;bottom:auto;right:16px}
.cf-portrait-zoom{z-index:1;padding:0;border:0;border-radius:50%}
.cf-portrait-zoom:focus-visible{outline:2px solid var(--gold-text);outline-offset:4px}
.cf-zoom-trigger.finder-image-stage{background:var(--pb-surface)}
@media(prefers-reduced-motion:reduce){.cf-lightbox::backdrop,.cf-lightbox-toolbar{animation:none!important}}
.cf-zoom-trigger.cf-portrait-zoom{width:64px;height:64px}
@media(max-width:380px){.cf-zoom-trigger.cf-portrait-zoom{width:56px;height:56px}}