.showreel-entry{display:block;position:relative;padding:0;text-align:left;width:100%}.showreel-preview{display:block;position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--surface)}.showreel-preview img,.showreel-preview video{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.showreel-preview video{opacity:0;transition:opacity .35s}.showreel-entry.playing video{opacity:1}
.showreel-top{display:grid;grid-template-columns:144px minmax(0,1fr) auto;align-items:center;gap:24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;margin:0 0 36px}.showreel-top .micro{color:var(--muted);display:block;margin-bottom:8px}.showreel-top strong{font-weight:400;font-size:25px;letter-spacing:-.035em}.showreel-entry-arrow{font-size:36px;color:var(--accent);transition:transform .3s}.showreel-top:hover .showreel-entry-arrow{transform:translate(4px,-4px)}
.showreel-finale{position:relative;border-top:1px solid var(--line);margin-top:28px;padding-top:28px}.showreel-finale::before{content:"";position:absolute;top:-1px;left:0;width:64px;height:1px;background:var(--accent)}.showreel-finale-heading{display:grid;grid-template-columns:1fr 1fr;gap:25px;align-items:end;margin-bottom:34px}.showreel-finale-heading .micro{color:var(--muted)}.showreel-finale h3{font-size:clamp(38px,5.5vw,80px);line-height:1.02;letter-spacing:-.05em;margin:22px 0 0}.showreel-finale-heading p{max-width:48ch;font-size:16px;line-height:1.7;color:var(--muted)}.showreel-bottom .showreel-preview{max-height:65vh;aspect-ratio:16/9}.showreel-bottom-cta{display:flex;align-items:center;justify-content:space-between;padding-top:20px;font-size:24px;letter-spacing:-.025em}.showreel-bottom-cta>span{font-size:34px;color:var(--accent)}
#project-body[data-project-slug="showreel"] .sheet-heading{display:block}#project-body[data-project-slug="showreel"] .sheet-heading>.micro{max-width:none;margin-top:20px}
@media(max-width:650px){.showreel-top{grid-template-columns:96px minmax(0,1fr) auto;gap:16px;padding:16px 0}.showreel-top strong{font-size:21px}.showreel-top .micro{font-size:8px}.showreel-entry-arrow{font-size:28px}.showreel-finale{margin-top:20px;padding-top:24px}.showreel-finale-heading{grid-template-columns:1fr;gap:24px}.showreel-finale-heading p{font-size:15px}.showreel-bottom-cta{font-size:21px}}
@media(prefers-reduced-motion:reduce){.showreel-preview video{display:none}.showreel-entry-arrow{transition:none}}
/* Give the opening showreel its own substantial frame. */
.showreel-top{grid-template-columns:minmax(260px,44%) minmax(0,1fr) auto;gap:32px;padding:28px 0;margin-bottom:40px}
.showreel-top strong{font-size:clamp(30px,4vw,58px);line-height:1.05;display:block;max-width:10ch}
.showreel-top .micro{font-size:10px;margin-bottom:18px}
.showreel-top .showreel-entry-arrow{font-size:clamp(38px,5vw,68px)}
@media(max-width:650px){.showreel-top{grid-template-columns:minmax(0,1fr) auto;gap:20px;padding:24px 0}.showreel-top .showreel-preview{grid-column:1/-1;width:100%}.showreel-top strong{font-size:34px;max-width:none}.showreel-top .micro{margin-bottom:10px}.showreel-top .showreel-entry-arrow{font-size:42px}}

/* A quiet invitation unfolds from the work arrow. */
.hero-bottom .round-link{position:relative;overflow:visible;isolation:isolate}
.round-link-caption{position:absolute;left:calc(100% + 16px);top:50%;transform:translate(-10px,-50%);font-family:Arial,Helvetica,sans-serif;font-size:13px;font-weight:400;line-height:1.4;letter-spacing:0;white-space:nowrap;color:var(--paper);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s,transform .4s cubic-bezier(.22,1,.36,1),visibility .25s}
.round-link:is(:hover,:focus-visible) .round-link-caption{opacity:1;visibility:visible;transform:translate(0,-50%)}
@media(max-width:850px){.round-link-caption{left:auto;right:0;top:calc(100% + 14px);transform:translateY(-6px)}.round-link:is(:hover,:focus-visible) .round-link-caption{transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.round-link-caption{transition:none}}

#hero-title .hero-cinematographer{display:block;font-size:clamp(18px,3.2vw,52px);line-height:1.2;letter-spacing:-.035em;margin-top:18px;font-weight:400}
@media(max-width:650px){#hero-title .hero-cinematographer{font-size:clamp(13px,3.3vw,21px);margin-top:10px;letter-spacing:-.025em}}

/* A small signal travels along the divider, followed by a faint phosphor trail. */
.showreel-finale::before,.showreel-finale::after{content:"";position:absolute;left:0;width:100%;pointer-events:none;background-color:transparent;background-repeat:no-repeat;animation:showreel-radio-signal 12s linear infinite}
.showreel-finale::before{top:-1px;height:1px;background-image:linear-gradient(90deg,transparent,rgba(229,0,6,.12) 35%,var(--accent) 72%,var(--accent));background-size:224px 1px}
.showreel-finale::after{top:-3px;height:5px;background-image:linear-gradient(90deg,transparent,rgba(229,0,6,.06) 40%,rgba(229,0,6,.2));background-size:224px 2px;filter:blur(2px)}
@keyframes showreel-radio-signal{0%{background-position:-224px 50%;opacity:0}5%{opacity:1}92%{opacity:1}100%{background-position:calc(100% + 224px) 50%;opacity:0}}
.motion-paused .showreel-finale::before,.motion-paused .showreel-finale::after,.no-scroll .showreel-finale::before,.no-scroll .showreel-finale::after{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.showreel-finale::before{width:64px;background:var(--accent);animation:none}.showreel-finale::after{display:none}}

/* Soft phosphor bloom: two small beats, then a quiet recovery. */
.showreel-finale::before{animation:showreel-radio-signal 12s linear infinite,showreel-heartbeat 2.8s ease-out infinite;filter:drop-shadow(0 0 2px #e5000630) drop-shadow(0 0 5px #e5000618)}
.showreel-finale::after{height:9px;top:-5px;background-size:224px 3px;animation:showreel-radio-signal 12s linear infinite,showreel-heartbeat-halo 2.8s ease-out infinite}
@keyframes showreel-heartbeat{0%,34%,100%{filter:brightness(1) drop-shadow(0 0 2px #e5000628) drop-shadow(0 0 5px #e5000610)}8%{filter:brightness(1.18) drop-shadow(0 0 3px #e5000670) drop-shadow(0 0 9px #e5000628)}15%{filter:brightness(1) drop-shadow(0 0 2px #e5000630)}23%{filter:brightness(1.1) drop-shadow(0 0 3px #e5000650) drop-shadow(0 0 7px #e5000620)}}
@keyframes showreel-heartbeat-halo{0%,34%,100%{filter:blur(3px) brightness(.8)}8%{filter:blur(4px) brightness(1.6)}15%{filter:blur(3px) brightness(.85)}23%{filter:blur(4px) brightness(1.25)}}
@media(prefers-reduced-motion:reduce){.showreel-finale::before,.showreel-finale::after{animation:none!important}}.motion-paused .showreel-finale::before,.motion-paused .showreel-finale::after{animation-play-state:paused!important}

/* A luminous travelling point with a fine core and a soft optical bloom. */
.showreel-finale::before{height:3px;top:-2px;background-image:linear-gradient(90deg,transparent 0%,#e5000620 35%,#ef191e70 72%,#ff807b 96%,#fff5e7 99%,#ff6c62 100%);background-size:240px 2px;filter:drop-shadow(0 0 3px #ff3c3390) drop-shadow(0 0 10px #e5000640);animation:showreel-radio-signal 12s linear infinite,showreel-light-shimmer 2.3s linear infinite}
.showreel-finale::after{top:-23px;height:46px;background-image:radial-gradient(ellipse 8px 20px at 235px 50%,#fff8e9c0 0%,#ffb4a780 14%,#ff453a30 40%,transparent 100%),radial-gradient(ellipse 33px 7px at 235px 50%,#fff1dd90 0%,#ff504060 20%,#e5000615 65%,transparent 100%),linear-gradient(90deg,transparent,#e5000612 65%,#ff59432b 96%,transparent);background-size:240px 46px;filter:blur(2px);animation:showreel-radio-signal 12s linear infinite,showreel-light-shimmer 2.3s linear infinite}
@keyframes showreel-light-shimmer{0%,100%{filter:brightness(1) drop-shadow(0 0 4px #e5000640)}13%{filter:brightness(1.35) drop-shadow(0 0 7px #ff6b5c65)}19%{filter:brightness(.95) drop-shadow(0 0 3px #e5000640)}24%{filter:brightness(1.2) drop-shadow(0 0 6px #ff6b5c50)}55%{filter:brightness(1.05) drop-shadow(0 0 4px #e5000640)}59%{filter:brightness(1.3) drop-shadow(0 0 8px #ff6b5c60)}66%{filter:brightness(1) drop-shadow(0 0 4px #e5000640)}}
.showreel-finale::after{background-image:radial-gradient(ellipse 8px 20px at 235px 50%,#fff8e9c0 0%,#ffb4a780 14%,#ff453a30 40%,transparent 100%),radial-gradient(ellipse 33px 7px at 235px 50%,#fff1dd90 0%,#ff504060 20%,#e5000615 65%,transparent 100%)}
/* Deep red, restrained monitor glow. */
.showreel-finale::before{height:1px;top:-1px;background-image:linear-gradient(90deg,transparent,#79091355 40%,#a80d1a 82%,#c51b29);background-size:240px 1px;animation:showreel-radio-signal 12s linear infinite,showreel-deep-pulse 3s ease-in-out infinite;filter:drop-shadow(0 0 3px #a20a1d50)}
.showreel-finale::after{top:-6px;height:12px;background-image:radial-gradient(ellipse 20px 4px at 230px 50%,#b6112448,transparent 100%);background-size:240px 12px;filter:blur(3px);animation:showreel-radio-signal 12s linear infinite,showreel-deep-pulse 3s ease-in-out infinite}
@keyframes showreel-deep-pulse{0%,38%,100%{filter:brightness(.85) drop-shadow(0 0 2px #9b0d1b35)}10%{filter:brightness(1.08) drop-shadow(0 0 4px #ad112550)}22%{filter:brightness(.95) drop-shadow(0 0 3px #a00d2040)}}
