
.film-section{position:relative;z-index:2;height:220svh;margin:-65px auto 65px;scroll-margin-top:0}.film-sticky{position:sticky;top:0;height:100svh;display:flex;align-items:center;justify-content:center;padding:100px 0 24px;box-sizing:border-box}.film-stage{width:min(1180px,calc(100% - 96px),calc((100svh - 210px)*16/9));transform:scale(var(--film-scale,1));transform-origin:center;flex:none}.film-preview{position:relative;aspect-ratio:16/9;border-radius:24px;overflow:hidden;background:#101213;box-shadow:0 35px 90px -35px #0e121b70}.film-preview video{display:block;width:100%;height:100%;object-fit:contain}.film-progress{position:absolute;bottom:0;left:0;right:0;height:2px;background:#ffffff12;pointer-events:none}.film-progress i{display:block;height:100%;background:#ff5a16;transform:scaleX(0);transform-origin:left;transition:transform .2s linear}.film-caption{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 4px;color:#0e121b}.film-caption p{color:#0e121b;font-size:19px;font-weight:500;letter-spacing:-.02em;margin:0}.film-controls{display:flex;align-items:center;gap:7px}.film-controls button{display:flex;align-items:center;justify-content:center;width:42px;height:42px;padding:10px;border:0;border-radius:50%;background:#ffffff55;color:#0e121b;cursor:pointer;transition:background .2s,transform .2s}.film-controls button:hover{background:#ffffffaa;transform:translateY(-2px)}.film-controls svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.film-controls>span{font-size:12px;letter-spacing:.05em;margin-left:10px;color:#525866}.film-status{font-size:13px;color:#0e121b}.film-status:empty{display:none}body[data-page=home] .film-section+.experience{margin-top:0}.film-open{overflow:hidden;scrollbar-gutter:stable}
.film-dialog{position:fixed;inset:0;width:min(1280px,calc(100vw - 64px));max-width:none;max-height:calc(100dvh - 48px);margin:auto;padding:0 0 12px;background:#101213;color:#fff;border:0;border-radius:20px;overflow:auto;box-shadow:0 35px 100px #0007}.film-dialog::backdrop{background:#0e121be6;backdrop-filter:blur(16px)}.film-dialog-heading{display:flex;align-items:center;justify-content:space-between;padding:15px 23px;font:500 15px 'Urbanist',sans-serif;gap:20px}.film-close{display:flex;align-items:center;gap:14px;padding:8px 0 8px 16px;background:none;color:#b9c0cc;border:0;font:inherit;cursor:pointer}.film-close span{font-size:27px;line-height:1;font-weight:300}.film-close:hover{color:#ffac87}.film-dialog video{display:block;width:100%;max-height:calc(100dvh - 150px);aspect-ratio:16/9;object-fit:contain;background:#080a0b}.film-dialog-status{margin:12px 22px 0;font-size:13px;color:#ffac87}.film-dialog-status:empty{display:none}
@media(max-width:780px){.film-section{margin:-55px auto 35px}.film-stage{width:min(calc(100% - 36px),calc((100svh - 190px)*16/9))}.film-preview{border-radius:16px}.film-caption{padding:13px 2px;gap:8px}.film-caption p{font-size:16px}.film-controls{gap:4px}.film-controls button{width:40px;height:40px}.film-controls>span{display:none}.film-dialog{width:calc(100vw - 24px);border-radius:14px}.film-dialog-heading{padding:12px 16px;font-size:13px}}
@media(prefers-reduced-motion:reduce){.film-section{height:auto;scroll-margin-top:110px}.film-sticky{position:relative;height:auto;padding:0}.film-stage{transform:none!important}.film-controls button,.film-progress i{transition:none}.film-controls button:hover{transform:none}}
