/* The VIP edit: a portrait cinema with an editorial playlist. */
.vip-films{padding:88px 7% 94px;background:#181617;color:#faf4ee;color-scheme:dark}
.films-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:35px;margin-bottom:38px}
.films-heading .eyebrow{font-size:10px;letter-spacing:.17em;color:#c8b6ae;display:flex;align-items:center;gap:10px;margin-bottom:19px}
.films-dot{width:6px;height:6px;display:inline-block;background:#eac6bd;border-radius:50%;box-shadow:0 0 16px #eac6bd60}
.films-heading h2{font-size:clamp(58px,6.4vw,92px);letter-spacing:-.045em}
.films-heading h2 em{color:#eac6bd}
.films-heading>p{font-size:14px;line-height:1.8;color:#b7aaa4;padding-bottom:8px}
.films-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(330px,1fr);gap:32px;align-items:start;max-width:1440px;margin:auto}
.films-player{min-width:0;overflow:hidden;border:1px solid #ffffff19;border-radius:12px;background:#201c1d}
.films-stage{position:relative;height:clamp(430px,40vw,560px);overflow:hidden;background:#0e0c0d;isolation:isolate}
.films-stage:before{content:"";position:absolute;inset:-35px;background-image:var(--film-poster);background-size:cover;background-position:center;filter:blur(30px);opacity:.22;z-index:-1}
.films-stage:after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 80px #0005}
.films-stage video{display:block;width:100%;height:100%;object-fit:contain}
.films-preview-tag{position:absolute;left:19px;top:18px;font-size:9px;letter-spacing:.15em;font-weight:600;pointer-events:none;text-shadow:0 1px 6px #000}
.films-preview-tag>span{display:block;font-size:7px;letter-spacing:.1em;color:#c7b7b2;margin-top:4px}
.films-player-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:20px}
.films-overline{display:block;font:500 9px/1.6 var(--sans);letter-spacing:.14em;color:#bbaba5}
.films-player-bar h3{font:400 20px/1.25 var(--serif);margin-top:6px}
.films-player-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.films-pause,.films-transport button{display:grid;place-items:center;width:40px;height:40px;border:1px solid #ffffff30;border-radius:50%;background:transparent;color:#faf4ee;font-size:13px}
.films-watch{display:flex;align-items:center;gap:10px;border:1px solid #eac6bd70;border-radius:50px;background:#eac6bd;color:#251e1c;padding:12px 17px;font-size:11px;font-weight:600;white-space:nowrap}
.films-watch>span{font-size:18px;line-height:1}
.films-watch:hover{background:#f7ded5}
.films-list-heading{display:flex;justify-content:space-between;gap:20px;font-size:9px;letter-spacing:.14em;color:#b7aaa4;padding:5px 0 20px}
.film-card{position:relative;display:flex;gap:18px;align-items:center;width:100%;padding:16px;text-align:left;background:#201d1e;border:1px solid #ffffff12;border-radius:10px;color:#faf4ee;margin-bottom:12px;transition:background .2s,border-color .2s,transform .2s}
.film-card:hover,.film-card[data-active="true"]{border-color:#eac6bd80;background:#302729}
.film-card:hover{transform:translateX(-3px)}
.film-card:focus-visible,.films-watch:focus-visible,.films-pause:focus-visible,.films-replay:focus-visible,.films-close:focus-visible,.films-transport button:focus-visible{outline:2px solid #eac6bd;outline-offset:4px}
.film-thumb{position:relative;flex:0 0 76px;width:76px;height:108px;overflow:hidden;border-radius:6px;background:#100f0f}
.film-thumb img{width:100%;height:100%;object-fit:cover}
.film-duration{position:absolute;bottom:6px;right:5px;border-radius:3px;background:#100d0edb;padding:2px 5px;font-size:9px;font-variant-numeric:tabular-nums;color:#fff}
.film-copy{display:flex;flex-direction:column;gap:7px;flex:1;min-width:0}
.film-meta{font-size:8px;letter-spacing:.12em;color:#b6a5a0;line-height:1.5}
.film-copy strong{font-size:17px;font-weight:500;line-height:1.3;letter-spacing:-.02em}
.film-description{font-size:11px;line-height:1.7;color:#c0b1ab;max-width:270px}
.film-state{font-size:9px;letter-spacing:.04em;color:#eac6bd;line-height:1.4}
.film-arrow{align-self:flex-start;font-size:20px;color:#eac6bd;line-height:1}
.film-card[data-viewed="true"] .film-state:before{content:"✓ ";margin-right:3px}
.films-footnote{border-top:1px solid #ffffff18;margin-top:23px;padding-top:18px;display:flex;flex-direction:column;gap:5px;font-size:10px;line-height:1.7;color:#b7aaa4}
.films-footnote>span+span+span{font-size:9px;color:#9c8d88}
.films-touch-hint{display:none}
.films-replay{background:transparent;border:0;padding:8px 0;color:#eac6bd;font-size:12px;text-align:left}
.films-message{font:12px/1.6 var(--sans);color:#eac6bd;padding:0 20px 16px;margin:0}
.films-noscript{font-size:13px;padding-top:25px}.films-noscript a{text-decoration:underline}
.films-dialog{width:min(1080px,calc(100% - 40px));max-width:none;max-height:calc(100dvh - 40px);padding:0;border:1px solid #ffffff25;border-radius:14px;background:#181617;color:#faf4ee;color-scheme:dark;overflow:auto;box-shadow:0 30px 120px #0009}
.films-dialog::backdrop{background:#080607e8;backdrop-filter:blur(14px)}
.films-dialog-header{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 24px;background:#181617;border-bottom:1px solid #ffffff17}
.films-close{display:grid;place-items:center;flex-shrink:0;width:38px;height:38px;padding:0;background:#ffffff08;border:1px solid #ffffff25;border-radius:50%;color:#faf4ee;font-size:16px}
.films-dialog-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(300px,1fr)}
.films-modal-player{min-width:0;background:#0c0b0c}
.films-modal-player video{display:block;width:100%;height:min(65dvh,620px);min-height:240px;object-fit:contain;background:#0c0b0c}
.films-modal-caption{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px 24px}
.films-dialog h2{font:400 28px/1.2 var(--serif);margin:6px 0 0;letter-spacing:-.02em}
.films-transport{display:flex;gap:8px}.films-transport button{font-size:18px}
.films-modal-sidebar{padding:24px;border-left:1px solid #ffffff17}
.films-modal-sidebar .film-card{gap:13px;padding:12px}.films-modal-sidebar .film-thumb{flex-basis:58px;width:58px;height:82px}
.films-modal-sidebar .film-copy strong{font-size:14px}.films-modal-sidebar .film-description{display:none}
.films-modal-note{font-size:11px;line-height:1.8;color:#b7aaa4;padding:10px 0 0}
.films-modal-player>.films-message{padding-top:15px}
@media(min-width:1600px){.vip-films{padding-left:max(7%,calc((100vw - 1400px)/2));padding-right:max(7%,calc((100vw - 1400px)/2))}}
@media(max-width:1050px){.films-layout{gap:22px;grid-template-columns:minmax(0,1fr) minmax(300px,1fr)}.films-player-bar{flex-wrap:wrap}.film-card{gap:12px;padding:12px}.film-copy strong{font-size:16px}.film-thumb{flex-basis:64px;width:64px;height:96px}.film-description{font-size:10px}.films-stage{height:470px}}
@media(max-width:760px){.vip-films{padding:58px 6% 60px}.films-heading{display:block;margin-bottom:28px}.films-heading .eyebrow{font-size:8px;letter-spacing:.11em;gap:8px}.films-heading h2{font-size:62px}.films-heading>p{font-size:12px;margin-top:20px;padding:0}.films-heading>p br{display:none}.films-heading>p br:after{content:" "}.films-layout{grid-template-columns:1fr;gap:26px}.films-stage{height:460px;max-height:65svh;min-height:330px}.films-preview-tag{font-size:8px;left:12px;top:12px}.films-preview-tag>span{font-size:6px}.films-player-bar{padding:17px;gap:15px}.films-player-bar h3{font-size:21px}.films-player-actions{width:100%;justify-content:space-between}.films-watch{padding:12px 18px}.films-list-heading{padding-bottom:16px}.film-card{padding:13px;gap:16px}.film-thumb{flex-basis:70px;width:70px;height:100px}.film-copy strong{font-size:16px}.film-description{font-size:11px}.films-hover-hint{display:none}.films-touch-hint{display:inline}.films-footnote{margin-top:20px}.films-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 20px);border-radius:10px}.films-dialog-header{padding:10px 14px}.films-dialog-header .films-overline{font-size:8px;letter-spacing:.1em}.films-dialog-layout{grid-template-columns:1fr}.films-modal-player video{height:55dvh;min-height:220px}.films-modal-caption{padding:17px}.films-dialog h2{font-size:25px}.films-modal-sidebar{padding:18px;border-left:0;border-top:1px solid #ffffff17}.films-modal-sidebar .film-description{display:block;font-size:10px}.films-modal-sidebar .film-thumb{height:85px}.film-card:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.film-card{transition:none}.film-card:hover{transform:none}}

/* One seekable timeline spans the complete collection, on both players. */
.films-timeline{padding:18px 20px 5px;border-top:1px solid #ffffff18;background:#201c1d}
.films-timeline-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;color:#b7aaa4;font-size:8px;letter-spacing:.13em}
.films-time{color:#eac6bd;font-size:11px;font-variant-numeric:tabular-nums;letter-spacing:.03em}
.films-seek{position:relative;height:38px;margin:2px 6px 0}
.films-segments{position:absolute;inset:17px 0 auto;display:flex;gap:4px;height:4px;border-radius:2px;overflow:hidden;pointer-events:none}
.films-segment{display:block;min-width:0;background:linear-gradient(to right,#eac6bd var(--played,0%),#ffffff25 var(--played,0%))}
.films-playhead{position:absolute;top:13px;left:0;transform:translateX(-50%);height:12px;width:12px;border-radius:50%;background:#f8dfd7;box-shadow:0 0 0 4px #eac6bd15;pointer-events:none}
.films-seek input{position:absolute;inset:0;width:100%;height:38px;margin:0;opacity:0;cursor:pointer}
.films-seek:focus-within{outline:2px solid #eac6bd;outline-offset:3px;border-radius:4px}
.films-chapters{display:flex;gap:4px;margin:0 6px}
.films-chapters button{min-width:0;padding:3px 4px 7px 0;text-align:left;border:0;background:transparent;color:#b7aaa4;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.films-chapters button[aria-current="true"],.films-chapters button:hover{color:#f6dcd3}
.films-chapters button:focus-visible{outline:2px solid #eac6bd;outline-offset:1px}
.films-timeline>.films-replay{display:block;margin:10px 0 3px;padding:7px 12px;border:1px solid #ffffff25;border-radius:30px;color:#ead4cc;font-size:10px}
.films-timeline>.films-replay:hover{background:#ffffff0c;border-color:#eac6bd}
.films-modal-stage{position:relative}
.films-complete{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:18px;padding:25px;text-align:center;background:#151213df;backdrop-filter:blur(12px)}
.films-complete>p{font:400 clamp(34px,4vw,54px)/1.1 var(--serif);color:#faf4ee;padding:0}
.films-complete>p em{color:#eac6bd}
.films-complete>.films-replay{display:block;padding:14px 23px;background:#eac6bd;border:1px solid #eac6bd;border-radius:40px;color:#251e1c;font-size:13px;font-weight:600}
.films-complete>.films-replay:hover{background:#f7ded5}
.films-modal-player .films-timeline{background:#161314}
@media(max-width:760px){.films-timeline{padding:15px 17px 4px}.films-chapters button{font-size:8px}.films-complete{gap:16px}.films-complete>.films-overline{font-size:8px}}
