/* =====================================================================
   D. OSESENAGA — portfolio
   palette: deep black · warm ash · hard red
   ===================================================================== */
@font-face{font-family:'Anton'; font-style:normal; font-weight:400; font-display:swap; src:url(../fonts/anton-latin-400-normal.woff2) format('woff2');}
@font-face{font-family:'Lato'; font-style:normal; font-weight:400; font-display:swap; src:url(../fonts/lato-latin-400-normal.woff2) format('woff2');}
@font-face{font-family:'Lato'; font-style:normal; font-weight:700; font-display:swap; src:url(../fonts/lato-latin-700-normal.woff2) format('woff2');}
@font-face{font-family:'Lato'; font-style:normal; font-weight:900; font-display:swap; src:url(../fonts/lato-latin-900-normal.woff2) format('woff2');}
@font-face{font-family:'Fraunces'; font-style:italic; font-weight:500; font-display:swap; src:url(../fonts/fraunces-latin-500-italic.woff2) format('woff2');}
@font-face{font-family:'IBM Plex Mono'; font-style:normal; font-weight:400; font-display:swap; src:url(../fonts/ibm-plex-mono-latin-400-normal.woff2) format('woff2');}
@font-face{font-family:'IBM Plex Mono'; font-style:normal; font-weight:500; font-display:swap; src:url(../fonts/ibm-plex-mono-latin-500-normal.woff2) format('woff2');}

:root{
  --bg:#0a0807;
  --bg-deep:#050403;
  --bg-raised:#16130f;
  --bg-raised2:#1d1912;
  --ash:#b8a998;
  --ash-dim:#7d7062;
  --ash-faint:#524a41;
  --paper:#ece3d6;
  --red:#a5271f;
  --red-bright:#c9382d;
  --line:rgba(236,227,214,0.13);
  --line-strong:rgba(236,227,214,0.28);
  --display:'Anton', 'Impact', sans-serif;
  --sans:'Lato', system-ui, sans-serif;
  --serif:'Fraunces', Georgia, serif;
  --mono:'IBM Plex Mono', ui-monospace, Menlo, monospace;
  --gutter:clamp(1.25rem,5vw,3.5rem);
  --ease:cubic-bezier(.16,.84,.44,1);
  --master-h:42px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{-webkit-text-size-adjust:100%; text-size-adjust:100%;}
html.reduce-motion{scroll-behavior:smooth;}
body{background:var(--bg); color:var(--paper); font-family:var(--sans); line-height:1.5; overflow-x:clip;
     -webkit-font-smoothing:antialiased; padding-bottom:calc(var(--master-h) + env(safe-area-inset-bottom));}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
button{font:inherit; color:inherit; background:none; border:0; cursor:pointer;}
ol,ul{list-style:none;}
::selection{background:var(--red); color:var(--paper);}
:focus-visible{outline:1px solid var(--red-bright); outline-offset:3px;}

/* lenis */
html.lenis, html.lenis body{height:auto;}
.lenis.lenis-stopped{overflow:clip;}

.skip-link{position:fixed; left:1rem; top:-4rem; z-index:2000; background:var(--paper); color:var(--bg); padding:.6rem 1rem; font-weight:700; font-size:.8rem;}
.skip-link:focus{top:1rem;}

/* =====================================================================
   FILM LEADER
   ===================================================================== */
.leader{display:none;}
html.show-leader .leader{
  display:flex; position:fixed; inset:0; z-index:1000; align-items:center; justify-content:center; cursor:pointer;
  animation:leaderFailsafe .01s 11s forwards;
}
@keyframes leaderFailsafe{to{opacity:0; visibility:hidden; pointer-events:none;}}
.leader-bar{position:absolute; left:0; right:0; height:50.5%; background:#000; z-index:1;}
.leader-bar.top{top:0;} .leader-bar.bottom{bottom:0;}
.leader-ring{position:relative; z-index:3; width:min(46vmin,260px); aspect-ratio:1; display:grid; place-items:center;}
.leader-sweep{position:absolute; inset:11.4%; border-radius:50%;
  --a:0deg;
  background:conic-gradient(from 0deg, rgba(201,56,45,0.85) 0deg, rgba(201,56,45,0.85) var(--a), rgba(236,227,214,0.06) var(--a));}
.leader-ring svg{position:absolute; inset:0; width:100%; height:100%; fill:none; stroke:rgba(236,227,214,0.55); stroke-width:1.2;}
.leader-num{position:relative; font-family:var(--display); font-size:min(24vmin,8.5rem); line-height:1; color:var(--paper);}
.leader-title{position:absolute; z-index:4; left:50%; top:50%; transform:translate(-50%,-50%); width:min(62vw,560px); opacity:0; pointer-events:none;}
.leader-title svg{display:block; width:100%; height:auto; overflow:visible;}
.leader-meta{position:absolute; z-index:3; left:var(--gutter); right:var(--gutter); bottom:2rem; display:flex; justify-content:space-between;
  font-family:var(--mono); font-size:.68rem; letter-spacing:.16em; color:var(--ash-dim);}

/* =====================================================================
   CURSOR
   ===================================================================== */
.cursor{display:none;}
html.cursor-ready .cursor{display:block; position:fixed; left:0; top:0; z-index:9999; pointer-events:none;}
html.cursor-ready body, html.cursor-ready a, html.cursor-ready button, html.cursor-ready [data-cursor]{cursor:none;}
.cursor-dot, .cursor-ring{position:fixed; left:0; top:0; will-change:transform;}
.cursor-dot{width:6px; height:6px; margin:-3px 0 0 -3px; border-radius:50%; background:var(--red-bright);}
.cursor-ring{width:38px; height:38px; margin:-19px 0 0 -19px; border:1px solid rgba(236,227,214,0.45); border-radius:50%;
  display:grid; place-items:center; transition:width .35s var(--ease), height .35s var(--ease), margin .35s var(--ease), background .25s, border-color .25s, opacity .2s;}
.cursor-ring .tick{position:absolute; background:rgba(236,227,214,0.7); transition:opacity .2s;}
.cursor-ring .tick.t, .cursor-ring .tick.b{width:1px; height:6px; left:50%;}
.cursor-ring .tick.t{top:-4px;} .cursor-ring .tick.b{bottom:-4px;}
.cursor-ring .tick.l, .cursor-ring .tick.r{height:1px; width:6px; top:50%;}
.cursor-ring .tick.l{left:-4px;} .cursor-ring .tick.r{right:-4px;}
.cursor-label{font-family:var(--mono); font-size:.6rem; letter-spacing:.12em; text-transform:uppercase; color:var(--bg); opacity:0; transition:opacity .2s; white-space:nowrap;}
.cursor.has-label .cursor-ring{width:78px; height:78px; margin:-39px 0 0 -39px; background:var(--paper); border-color:var(--paper);}
.cursor.has-label .cursor-label{opacity:1;}
.cursor.has-label .tick{opacity:0;}
.cursor.has-label .cursor-dot{opacity:0;}
.cursor.is-down .cursor-ring{width:30px; height:30px; margin:-15px 0 0 -15px;}
.cursor.is-hidden{opacity:0;}

/* =====================================================================
   NAV + MENU
   ===================================================================== */
.nav{position:fixed; top:0; left:0; right:0; z-index:100; display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:1.35rem var(--gutter); border-bottom:1px solid transparent;
  transition:background .35s ease, backdrop-filter .35s ease, border-color .35s ease, transform .5s var(--ease);}
.nav.scrolled{background:rgba(10,8,7,0.72); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom-color:var(--line);}
.wordmark{display:block; line-height:0;}
.wordmark img{height:22px; width:auto; display:block; transition:opacity .25s;}
.wordmark:hover img{opacity:.8;}
@media (max-width:640px){ .wordmark img{height:18px;} }
.nav-links{display:flex; gap:clamp(1rem,2.4vw,2rem); font-size:.74rem; letter-spacing:.08em; font-weight:700;}
.nav-links a{position:relative; opacity:.78; transition:opacity .2s; display:flex; align-items:baseline; gap:.35rem; padding:.25rem 0;}
.nav-links a i{font-style:normal; font-family:var(--mono); font-size:.58rem; font-weight:400; color:var(--ash-faint); transition:color .2s;}
.nav-links a::after{content:''; position:absolute; left:0; right:0; bottom:-2px; height:1px; background:var(--red-bright); transform:scaleX(0); transform-origin:right; transition:transform .45s var(--ease);}
.nav-links a:hover, .nav-links a.is-active{opacity:1;}
.nav-links a:hover::after, .nav-links a.is-active::after{transform:scaleX(1); transform-origin:left;}
.nav-links a.is-active i{color:var(--red-bright);}
.nav-role{font-family:var(--display); font-size:.85rem; letter-spacing:.08em; color:var(--red-bright); white-space:nowrap;}
.menu-btn{display:none; align-items:center; gap:.7rem; font-family:var(--mono); font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; padding:.4rem 0;}
.mb-icon{position:relative; display:block; width:22px; height:10px;}
.mb-icon b{position:absolute; left:0; right:0; height:1.5px; background:var(--paper); transition:transform .4s var(--ease), top .4s var(--ease), background .3s;}
.mb-icon b:first-child{top:0;} .mb-icon b:last-child{top:8.5px; left:8px;}
.menu-btn[aria-expanded="true"] .mb-icon b{background:var(--red-bright);}
.menu-btn[aria-expanded="true"] .mb-icon b:first-child{top:4px; transform:rotate(45deg);}
.menu-btn[aria-expanded="true"] .mb-icon b:last-child{top:4px; left:0; transform:rotate(-45deg);}
@media (max-width:900px){
  .nav.scrolled{backdrop-filter:none; -webkit-backdrop-filter:none; background:#0a0807;}
  .nav-links{display:none;}
  .nav-role{display:none;}
  .menu-btn{display:flex;}
}
.menu{position:fixed; inset:0; z-index:95; background:var(--bg-deep); padding:6rem var(--gutter) 3rem; display:flex; flex-direction:column; justify-content:space-between;}
.menu[hidden]{display:none;}
.menu ol{display:flex; flex-direction:column; gap:.2rem;}
.menu li{overflow:hidden; border-bottom:1px solid var(--line);}
.menu li a{display:flex; align-items:baseline; gap:1rem; font-family:var(--display); font-size:clamp(2.2rem,11vw,4rem); line-height:1.15; padding:.25rem 0;}
.menu li a i{font-style:normal; font-family:var(--mono); font-size:.68rem; color:var(--red-bright); letter-spacing:.1em; min-width:3.6rem;}
.menu-foot{display:flex; flex-direction:column; gap:.4rem; font-size:.9rem; color:var(--ash);}
.menu-foot a{font-family:var(--mono); font-size:.8rem; letter-spacing:.06em;}

/* =====================================================================
   HERO
   ===================================================================== */
.hero{position:relative; height:100vh; height:100svh; min-height:560px; overflow:hidden; background:#000; isolation:isolate;}
.hero-frame{position:absolute; inset:0; overflow:hidden; will-change:transform; transform-origin:50% 0;}
.hero-frame video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:brightness(.86); transform-origin:50% 45%;}
.hero-shade{position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,8,7,.35) 0%, rgba(10,8,7,.15) 35%, rgba(10,8,7,.55) 70%, rgba(10,8,7,.96) 100%);}

.hud{position:absolute; z-index:2; inset:5.2rem var(--gutter) 1.6rem; pointer-events:none;}
.hud-c{position:absolute; width:22px; height:22px; border-color:rgba(236,227,214,.55); border-style:solid; border-width:0;}
.hud-c.tl{top:0; left:0; border-top-width:1px; border-left-width:1px;}
.hud-c.tr{top:0; right:0; border-top-width:1px; border-right-width:1px;}
.hud-c.bl{bottom:0; left:0; border-bottom-width:1px; border-left-width:1px;}
.hud-c.br{bottom:0; right:0; border-bottom-width:1px; border-right-width:1px;}
.hud-row{position:absolute; left:2.2rem; right:2.2rem; display:flex; justify-content:space-between; align-items:center;
  font-family:var(--mono); font-size:.68rem; letter-spacing:.14em; color:rgba(236,227,214,.82);}
.hud-row.top{top:.15rem;}
.rec{display:flex; align-items:center; gap:.45rem; color:var(--paper);}
.rec b, .rec-dot{display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--red-bright); animation:blink 1.2s steps(2) infinite;}
@keyframes blink{50%{opacity:.15}}
.hud-tc{font-variant-numeric:tabular-nums; font-weight:500;}
.hud-dim{color:rgba(236,227,214,.5);}
@media (max-width:640px){ .hud-dim{display:none;} .hud-row{left:1.6rem; right:1.6rem;} .hud{inset:4.6rem 1rem 1rem;} }

.hero-content{position:absolute; z-index:3; left:0; right:0; bottom:0; padding:0 var(--gutter) clamp(3rem,7vh,4.5rem);}
html.js:not(.reduce-motion) .hero-content{opacity:0; animation:heroFailsafe .01s 11.5s forwards;}
html.js .hero-content.is-in{opacity:1; animation:none;}
@keyframes heroFailsafe{to{opacity:1}}
.hero-name{font-family:var(--display); font-weight:400; line-height:.84; margin-bottom:clamp(1.2rem,2.5vw,2rem); letter-spacing:.004em;}
.hero-name .hn{display:block; font-size:clamp(3.6rem,15.5vw,14.5rem); overflow:hidden; padding-top:.04em; white-space:nowrap;}
.hero-name .hn-2{color:var(--red-bright);}
@media (max-width:640px){ .hero-name .hn{font-size:21.5vw;} }
.hero-name .ch{display:inline-block; will-change:transform;}
.hero-lower{display:flex; justify-content:space-between; align-items:flex-end; gap:2rem; flex-wrap:wrap;}
.hero-role{font-size:.8rem; letter-spacing:.16em; font-weight:700; color:var(--ash); text-transform:uppercase; margin-bottom:.8rem;}
.tagline{font-size:clamp(1rem,1.3vw,1.12rem); color:var(--ash); max-width:36ch;}
.hero-ctas{display:flex; gap:.8rem; flex-wrap:wrap;}

.hero-ctas{align-items:center; gap:clamp(1.4rem,3vw,2.4rem);}
.cta{display:inline-flex; align-items:center; gap:.9rem; font-family:var(--display); font-size:clamp(1rem,1.3vw,1.2rem); letter-spacing:.06em; text-transform:uppercase; color:var(--paper);}
.cta-txt{position:relative; padding-bottom:3px;}
.cta-txt::after{content:''; position:absolute; left:0; right:0; bottom:0; height:1px; background:currentColor; transform:scaleX(0); transform-origin:right; transition:transform .5s var(--ease);}
.cta:hover .cta-txt::after{transform:scaleX(1); transform-origin:left;}
.cta-icon{position:relative; width:58px; height:58px; border-radius:50%; background:var(--red-bright); display:grid; place-items:center; flex-shrink:0;
  box-shadow:0 0 0 0 rgba(201,56,45,.45); transition:box-shadow .5s var(--ease), background .3s;}
.cta-icon i{display:block; width:0; height:0; border-style:solid; border-width:8px 0 8px 13px; border-color:transparent transparent transparent var(--paper); margin-left:4px;}
.cta-play:hover .cta-icon{box-shadow:0 0 0 10px rgba(201,56,45,.18);}
.cta-line{color:var(--ash);}
.cta-line:hover{color:var(--paper);}
.cta-arrow{display:inline-block; color:var(--red-bright); transition:transform .45s var(--ease);}
.cta-line:hover .cta-arrow{transform:translateX(6px);}

.scroll-cue{position:absolute; z-index:3; right:var(--gutter); top:50%; transform:translateY(-50%) ; display:flex; flex-direction:column; align-items:center; gap:.8rem;
  font-family:var(--mono); font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ash-dim); writing-mode:vertical-rl;}
.scroll-cue i{display:block; width:1px; height:64px; background:linear-gradient(var(--paper),var(--paper)) no-repeat; background-size:1px 40%; background-color:rgba(236,227,214,.15);
  animation:cue 2.2s var(--ease) infinite;}
@keyframes cue{0%{background-position:0 -100%} 100%{background-position:0 200%}}
@media (max-width:760px){ .scroll-cue{display:none;} }

/* =====================================================================
   FILM STRIP
   ===================================================================== */
.filmstrip{position:relative; overflow:hidden; background:var(--bg-deep); padding:20px 0; border-block:1px solid var(--line);}
.filmstrip::before, .filmstrip::after{content:''; position:absolute; left:0; right:0; height:10px;
  background:repeating-linear-gradient(90deg, transparent 0 10px, rgba(236,227,214,.16) 10px 22px, transparent 22px 34px);
  -webkit-mask:linear-gradient(#000,#000); }
.filmstrip::before{top:7px;} .filmstrip::after{bottom:7px;}
.filmstrip-track{display:flex; width:max-content; will-change:transform;}
.strip-set{display:flex; align-items:center; flex-shrink:0;}
.strip-set span{font-family:var(--display); font-size:clamp(2.4rem,6vw,4.8rem); line-height:1.1; text-transform:uppercase; padding:0 1.4rem; color:var(--paper); white-space:nowrap;}
.strip-set span.o{color:transparent; -webkit-text-stroke:1px rgba(236,227,214,.55);}
.strip-set b{display:block; width:12px; height:12px; background:var(--red-bright); flex-shrink:0;}

/* =====================================================================
   SECTIONS
   ===================================================================== */
.sec{position:relative; padding:clamp(3rem,6.5vw,5.5rem) var(--gutter);}
.section-head{display:grid; grid-template-columns:1fr auto; align-items:end; gap:.4rem 1.5rem; margin-bottom:clamp(1.4rem,3vw,2.4rem);
  border-bottom:1px solid var(--line); padding-bottom:1.1rem; position:relative;}
.section-head::after{content:''; position:absolute; left:0; bottom:-1px; height:1px; width:100%; background:var(--red-bright); transform:scaleX(var(--draw,0)); transform-origin:var(--o,left) center;}
.section-head h2{grid-column:1; font-family:var(--display); font-weight:400; font-size:clamp(2.4rem,6.4vw,5.4rem); line-height:.95; letter-spacing:.005em;}
.section-head p{grid-column:2; font-size:.84rem; color:var(--ash-dim); max-width:28ch; text-align:right; padding-bottom:.4rem;}
.reveal-title{overflow:hidden; padding-top:.06em;}
.reveal-title > span{display:inline-block; will-change:transform;}
@media (max-width:640px){ .section-head{grid-template-columns:1fr;} .section-head p{grid-column:1; text-align:left;} }

.slate{grid-column:1/-1; display:inline-flex; flex-direction:column; width:max-content; margin-bottom:.7rem;}
.slate-arm{display:block; width:100%; height:9px; transform-origin:0 100%;
  background:repeating-linear-gradient(-55deg, var(--paper) 0 7px, var(--bg) 7px 14px); border:1px solid var(--paper);}
.slate-body{display:block; font-family:var(--mono); font-size:.66rem; letter-spacing:.16em; padding:.4rem 0 0; color:var(--ash);}
.slate-body em{font-style:normal; color:var(--red-bright); margin-left:.6rem;}

/* =====================================================================
   ABOUT
   ===================================================================== */
.about-grid{display:grid; grid-template-columns:1.65fr 1fr; gap:clamp(2.5rem,6vw,6rem); align-items:start;}
@media (max-width:900px){ .about-grid{grid-template-columns:1fr;} }
.about-bio p{font-size:clamp(1.25rem,2.2vw,2rem); line-height:1.38; color:var(--ash); max-width:30ch; letter-spacing:-.005em;}
.about-bio p + p{margin-top:1.3rem;}
.about-bio strong{color:var(--paper); font-weight:700;}
.about-bio em.hl{font-style:normal;}
.about-bio .w{display:inline;}
.stats-col{border-left:2px solid var(--red); padding-left:1.5rem; display:flex; flex-direction:column; gap:1.6rem;}
.stat{display:flex; flex-direction:column; gap:.15rem;}
.stat .num{font-family:var(--display); font-size:clamp(2.6rem,4.5vw,3.8rem); line-height:1; color:var(--paper); font-variant-numeric:tabular-nums;}
.stat .label{font-family:var(--mono); font-size:.66rem; letter-spacing:.12em; color:var(--ash-dim); text-transform:uppercase;}
.disciplines{display:grid; grid-template-columns:1fr 1fr; gap:.1rem 1rem; border-top:1px solid var(--line); padding-top:1.2rem;}
.disciplines li{font-size:.85rem; color:var(--ash); padding:.35rem 0; display:flex; gap:.6rem; align-items:baseline; transition:color .25s, transform .4s var(--ease);}
.disciplines li i{font-style:normal; font-family:var(--mono); font-size:.6rem; color:var(--ash-faint);}
.disciplines li:hover{color:var(--paper); transform:translateX(4px);}
.disciplines li:hover i{color:var(--red-bright);}

/* =====================================================================
   WORK — single screen + film strip
   ===================================================================== */
/* crop-mark frame: four corner ticks instead of a box */
.marks{--mk:rgba(236,227,214,.55); --ml:18px; position:relative; padding:12px;
  background:
    linear-gradient(var(--mk),var(--mk)) 0 0/var(--ml) 1px, linear-gradient(var(--mk),var(--mk)) 0 0/1px var(--ml),
    linear-gradient(var(--mk),var(--mk)) 100% 0/var(--ml) 1px, linear-gradient(var(--mk),var(--mk)) 100% 0/1px var(--ml),
    linear-gradient(var(--mk),var(--mk)) 0 100%/var(--ml) 1px, linear-gradient(var(--mk),var(--mk)) 0 100%/1px var(--ml),
    linear-gradient(var(--mk),var(--mk)) 100% 100%/var(--ml) 1px, linear-gradient(var(--mk),var(--mk)) 100% 100%/1px var(--ml);
  background-repeat:no-repeat;}

.reel{display:grid; grid-template-columns:minmax(0,1fr) clamp(260px,24vw,360px); grid-template-areas:"screen info" "strip strip"; gap:clamp(1.2rem,2.4vw,2.2rem) clamp(1.5rem,3vw,3rem);}
.reel-screen{grid-area:screen;}
.reel-info{grid-area:info;}
.reel-strip{grid-area:strip;}
@media (max-width:980px){ .reel{grid-template-columns:1fr; grid-template-areas:"screen" "info" "strip";} }

.player-shell{position:relative; aspect-ratio:16/9; background:#000; overflow:hidden;}
.player-shell iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}
.reel-unmute{position:absolute; z-index:4; left:14px; bottom:14px; display:inline-flex; align-items:center; gap:.55rem; padding:.55rem .85rem .55rem .7rem; border-radius:999px;
  background:var(--red-bright); color:var(--paper); font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; box-shadow:0 8px 24px rgba(0,0,0,.45);}
.reel-unmute[hidden]{display:none;}
.reel-unmute i{width:14px; height:12px; background:currentColor; clip-path:polygon(0 30%,30% 30%,65% 0,65% 100%,30% 70%,0 70%);}
.reel-unmute::after{content:''; width:6px; height:6px; border-radius:50%; background:var(--paper); animation:blink 1.2s steps(2) infinite;}
.reel-cut{position:absolute; inset:0; z-index:3; background:#000; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.3rem;
  opacity:0; visibility:hidden; transition:opacity .35s ease, visibility 0s .35s; pointer-events:none;}
.reel-cut.show{opacity:1; visibility:visible; transition:opacity .2s ease;}
.rc-label{font-family:var(--mono); font-size:.66rem; letter-spacing:.24em; text-transform:uppercase; color:var(--red-bright);}
.rc-num{font-family:var(--mono); font-size:.75rem; color:var(--ash-dim); letter-spacing:.12em;}
.rc-title{font-family:var(--display); font-size:clamp(2rem,5vw,4.4rem); line-height:1; color:var(--paper); text-align:center; padding:0 1rem;}
.reel-cut.show .rc-title{animation:rcIn .6s var(--ease) both;}
@keyframes rcIn{from{transform:translateY(14px); opacity:0} to{transform:none; opacity:1}}

.reel-info{position:relative; display:flex; flex-direction:column; gap:.9rem; padding-left:clamp(0rem,1.6vw,1.6rem); border-left:1px solid var(--line); min-width:0;}
@media (max-width:980px){ .reel-info{border-left:0; padding-left:0;} }
.ri-now{display:flex; align-items:center; gap:.5rem; font-family:var(--mono); font-size:.64rem; letter-spacing:.14em; color:var(--ash-dim); text-transform:uppercase;}
.ri-now em{font-style:normal; color:var(--red-bright); margin-left:auto;}
.live-dot{display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--red-bright); box-shadow:0 0 0 0 rgba(201,56,45,.6); animation:pulse 1.8s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(201,56,45,.55)} 70%{box-shadow:0 0 0 9px rgba(201,56,45,0)} 100%{box-shadow:0 0 0 0 rgba(201,56,45,0)}}
.ri-title{font-family:var(--display); font-weight:400; font-size:clamp(2rem,3.4vw,3.2rem); line-height:.95;}
.ri-meta{display:grid; gap:.1rem;}
.ri-meta div{display:flex; justify-content:space-between; gap:1rem; padding:.5rem 0; border-bottom:1px solid var(--line); font-size:.86rem;}
.ri-meta dt{font-family:var(--mono); font-size:.64rem; letter-spacing:.12em; color:var(--ash-faint); text-transform:uppercase; padding-top:.15rem;}
.ri-meta dd{text-align:right;}
.ri-desc{font-size:.92rem; color:var(--ash); line-height:1.6;}
.ri-foot{display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:.3rem;}
.ri-arrows{display:flex; gap:1.1rem;}
.ri-arrows button{font-size:1.25rem; line-height:1; color:var(--ash); padding:.3rem 0; transition:color .25s, transform .35s var(--ease);}
.ri-arrows button:hover{color:var(--red-bright);}
.ri-arrows button:first-child:hover{transform:translateX(-4px);}
.ri-arrows button:last-child:hover{transform:translateX(4px);}
.ri-watch{font-size:.74rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; transition:color .25s;
  background:linear-gradient(var(--red-bright),var(--red-bright)) 0 100%/0 1px no-repeat; padding-bottom:3px; transition:color .25s, background-size .45s var(--ease);}
.ri-watch:hover{color:var(--red-bright); background-size:100% 1px;}
.ri-big{margin-top:auto; font-family:var(--display); font-size:clamp(5rem,10vw,9rem); line-height:.8; color:transparent; -webkit-text-stroke:1px rgba(236,227,214,.14); user-select:none; pointer-events:none;}
@media (max-width:980px){ .ri-big{display:none;} }

/* the films sit on a strip of film, sprocket holes and all */
.reel-strip{position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; background:var(--bg-deep); padding:26px 10px;}
.reel-strip::before, .reel-strip::after{content:''; position:absolute; left:10px; right:10px; height:8px; pointer-events:none;
  background:repeating-linear-gradient(90deg, rgba(236,227,214,.14) 0 10px, transparent 10px 22px);}
.reel-strip::before{top:9px;} .reel-strip::after{bottom:9px;}
@media (max-width:760px){ .reel-strip{grid-template-columns:repeat(2,minmax(0,1fr)); padding:24px 8px; gap:8px;} }
.reel-item{display:flex; flex-direction:column; width:100%; text-align:left; gap:.55rem; color:var(--paper);}
.rit-frame{position:relative; display:block; aspect-ratio:16/9; overflow:hidden; background:var(--bg-raised2);}
.rit-thumb{position:absolute; inset:0; background-size:cover; background-position:center; filter:grayscale(1) brightness(.55); transform:scale(1.04);
  transition:filter .5s ease, transform .9s var(--ease);}
.reel-item:hover .rit-thumb, .reel-item:focus-visible .rit-thumb{filter:grayscale(.2) brightness(.85); transform:scale(1.1);}
.reel-item.active .rit-thumb{filter:none; transform:scale(1);}
.rit-play{position:absolute; left:50%; top:50%; width:44px; height:44px; margin:-22px 0 0 -22px; border-radius:50%; display:grid; place-items:center;
  background:var(--red-bright); color:var(--paper); font-size:.8rem; padding-left:3px; transform:scale(.6); opacity:0; transition:transform .45s var(--ease), opacity .3s;}
.reel-item:hover .rit-play{transform:scale(1); opacity:1;}
.reel-item.active .rit-play{opacity:0;}
.reel-item.active .rit-frame::after{content:'NOW'; position:absolute; left:.45rem; top:.4rem; font-family:var(--mono); font-size:.55rem; letter-spacing:.16em;
  color:var(--paper); background:var(--red-bright); padding:.15rem .35rem;}
.rit-bar{position:relative; display:block; height:14px; cursor:pointer; touch-action:none;}
.rit-bar::before{content:''; position:absolute; left:0; right:0; top:6px; height:2px; background:rgba(236,227,214,.12);}
.rit-bar i{position:absolute; left:0; right:0; top:6px; height:2px; background:var(--red-bright); transform:scaleX(0); transform-origin:left; transition:transform .3s linear;}
.reel-item.active .rit-bar::before{background:rgba(236,227,214,.22);}
.rit-text{display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:.6rem; align-items:baseline;}
.rit-num{grid-row:1/3; font-family:var(--mono); font-size:.62rem; color:var(--ash-faint);}
.reel-item.active .rit-num{color:var(--red-bright);}
.rit-name{font-family:var(--display); font-size:clamp(1rem,1.5vw,1.35rem); line-height:1.05; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; transition:color .25s;}
.reel-item:not(.active) .rit-name{color:var(--ash);}
.reel-item:hover .rit-name{color:var(--paper);}
.rit-type{font-family:var(--mono); font-size:.58rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ash-faint);}

.ig-line{margin-top:1.3rem; font-size:.85rem; color:var(--ash); display:flex; flex-wrap:wrap; align-items:center; gap:.5rem;}
.ig-line a{color:var(--red-bright); font-weight:700; background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat; transition:background-size .45s var(--ease);}
.ig-line a:hover{background-size:100% 1px;}

/* =====================================================================
   PROCESS
   ===================================================================== */
.process-pin{position:relative;}
.process-stage{position:relative;}
.process-board{position:relative; padding:.9rem 1rem; overflow-x:auto; overflow-y:hidden;}
.proc-row{display:flex; align-items:center; gap:.7rem; padding:.16rem 0; cursor:pointer; border-radius:2px; transition:background .2s;}
.proc-row:hover, .proc-row.active{background:rgba(165,39,31,.12);}
.proc-label{flex:0 0 40px; font-family:var(--mono); font-size:.56rem; letter-spacing:.04em; color:var(--ash-faint); text-align:right; text-transform:uppercase; transition:color .2s;}
.proc-row:hover .proc-label, .proc-row.active .proc-label{color:var(--red-bright);}
.proc-row.lit .proc-label{color:var(--ash);}
.proc-lane{flex:1; display:flex; gap:2px; height:12px; min-width:640px; background:rgba(236,227,214,.035);}
.proc-clip{height:100%; border-radius:1px; opacity:.85; transform-origin:left center; transition:opacity .2s;}
.proc-row:hover .proc-clip, .proc-row.active .proc-clip{opacity:1;}
.proc-gap{height:100%;}
.c-paper{background:var(--paper);}
.c-ash{background:var(--ash-dim);}
.c-red{background:var(--red-bright);}
.c-line{background:rgba(236,227,214,.22);}
@media (max-width:700px){
  .proc-lane{min-width:0; height:10px;}
  .proc-label{flex-basis:34px; font-size:.5rem;}
  .process-board{padding:.7rem .6rem;}
}
.proc-playhead{position:absolute; top:.5rem; bottom:.5rem; left:calc(1rem + 40px + .7rem); width:2px; margin-left:-1px; background:var(--red-bright);
  box-shadow:0 0 10px rgba(201,56,45,.7); z-index:3; pointer-events:none; opacity:0;}
.proc-tooltip{position:absolute; left:50%; top:0; max-width:min(320px,80vw);
  transform:translate(-50%,-100%) translateY(-10px) scale(.85);
  background:var(--paper); color:var(--bg); border-radius:5px; padding:.65rem .9rem; font-size:.78rem; line-height:1.45; text-align:center;
  box-shadow:0 10px 28px rgba(0,0,0,.5); opacity:0; pointer-events:none; z-index:30; transition:opacity .16s ease, transform .16s ease;}
.proc-tooltip.show{opacity:1; transform:translate(-50%,-100%) translateY(-14px) scale(1);}
.proc-tooltip strong{display:block; font-family:var(--display); font-size:.72rem; letter-spacing:.06em; color:var(--red); margin-bottom:.25rem; font-weight:400;}
.proc-tooltip::after{content:''; position:absolute; top:100%; left:50%; transform:translateX(-50%); border:6px solid transparent; border-top-color:var(--paper);}
.proc-steps{display:grid; grid-template-columns:repeat(5,1fr); gap:2px; margin-top:1rem;}
.proc-steps li{font-family:var(--mono); font-size:.64rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ash-faint);
  padding:.7rem .7rem .6rem; border-top:2px solid var(--line); transition:color .3s, border-color .3s;}
.proc-steps li i{display:block; font-style:normal; color:inherit; margin-bottom:.2rem; opacity:.7;}
.proc-steps li.on{color:var(--ash); border-top-color:var(--ash-dim);}
.proc-steps li.now{color:var(--paper); border-top-color:var(--red-bright);}
.proc-steps li.now i{color:var(--red-bright); opacity:1;}
@media (max-width:700px){ .proc-steps{grid-template-columns:repeat(2,1fr);} .proc-steps li:last-child{grid-column:1/-1;} }
.proc-hint{margin-top:1rem; font-size:.8rem; color:var(--ash-faint);}

/* =====================================================================
   STILLS — accordion
   ===================================================================== */
.stills-grid{display:flex; flex-direction:column; gap:.5rem; counter-reset:fr;}
.stills-row{display:flex; gap:.5rem; height:clamp(280px,38vw,470px);}
.stills-row figure{position:relative; overflow:hidden; cursor:pointer; flex:1 1 0%; min-width:0; background:var(--bg-deep);
  transition:flex-grow .7s var(--ease); counter-increment:fr;}
.stills-row figure:hover, .stills-row figure:focus-visible{flex-grow:3.2;}
.stills-row img{width:100%; height:100%; object-fit:cover; transform:scale(1.06);
  transition:object-fit 0s .38s, transform 1.1s var(--ease), filter .6s;}
.stills-row figure:hover img, .stills-row figure:focus-visible img{object-fit:contain; transform:scale(1);}
.stills-row:hover figure:not(:hover) img{filter:brightness(.55) grayscale(.3);}
.stills-row figure::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, transparent 60%, rgba(10,8,7,.55)); transition:opacity .4s; pointer-events:none;}
.stills-row figure:hover::after{opacity:0;}
.stills-row figure::before{content:'FR ' counter(fr, decimal-leading-zero); position:absolute; z-index:2; left:.6rem; bottom:.55rem;
  font-family:var(--mono); font-size:.58rem; letter-spacing:.12em; color:rgba(236,227,214,.75); transition:opacity .3s;}
.stills-row figure:hover::before{opacity:0;}
@media (max-width:760px){
  .stills-row{height:auto; flex-wrap:wrap;}
  .stills-row figure{flex:1 1 44%; aspect-ratio:9/16; height:auto;}
  .stills-row figure:hover{flex-grow:1;}
  .stills-row figure:hover img{object-fit:cover;}
  .stills-row:hover figure:not(:hover) img{filter:none;}
}

/* lightbox */
.lightbox{position:fixed; inset:0; z-index:900; background:var(--bg-deep); display:flex; flex-direction:column;}
.lightbox[hidden]{display:none;}
.lb-stage{flex:1; display:grid; place-items:center; padding:clamp(1rem,4vw,3rem); min-height:0; touch-action:pan-y;}
.lb-stage img{max-width:100%; max-height:calc(100vh - 9rem); max-height:calc(100svh - 9rem); object-fit:contain; box-shadow:0 30px 80px rgba(0,0,0,.6);}
.lb-bar{display:flex; justify-content:space-between; align-items:center; padding:1rem var(--gutter) calc(1rem + env(safe-area-inset-bottom)); border-top:1px solid var(--line);}
.lb-count{font-family:var(--mono); font-size:.75rem; letter-spacing:.14em; color:var(--ash);}
.lb-btns{display:flex; gap:1.6rem; align-items:center;}
.lb-btns button{min-width:44px; height:44px; padding:0 .2rem; font-size:1.1rem; color:var(--ash); transition:color .25s;}
.lb-btns button:hover{color:var(--red-bright);}
.lb-close{font-family:var(--mono); font-size:.7rem !important; letter-spacing:.12em; text-transform:uppercase;}

/* =====================================================================
   LOG → GRADE
   ===================================================================== */
.grade{display:grid; grid-template-columns:minmax(0,1fr) clamp(180px,17vw,250px); gap:clamp(1rem,2.4vw,2rem); align-items:start;}
@media (max-width:900px){ .grade{grid-template-columns:1fr;} }
.grade-stage{display:flex; justify-content:center;}
.grade-frame{--p:50%; position:relative; width:min(100%, calc(76vh * var(--r, 1.778))); overflow:hidden; background:#000; touch-action:pan-y; user-select:none; -webkit-user-select:none; cursor:ew-resize;}
.grade-frame img{display:block; width:100%; height:100%; object-fit:cover; pointer-events:none; -webkit-user-drag:none;}
.g-after{position:relative;}
.g-before{position:absolute; inset:0; clip-path:inset(0 calc(100% - var(--p)) 0 0); will-change:clip-path;}
.g-handle{position:absolute; top:0; bottom:0; left:var(--p); width:2px; margin-left:-1px; background:var(--paper); z-index:3; outline:none;}
.g-handle::before{content:''; position:absolute; top:0; bottom:0; left:-16px; right:-16px;}
.g-knob{position:absolute; left:50%; top:50%; width:54px; height:54px; margin:-27px 0 0 -27px; border-radius:50%; background:var(--paper); display:flex; align-items:center; justify-content:center; gap:10px;
  box-shadow:0 10px 30px rgba(0,0,0,.45); transition:transform .35s var(--ease), background .25s;}
.g-knob i{width:0; height:0; border-style:solid; border-width:6px 8px 6px 0; border-color:transparent var(--bg) transparent transparent;}
.g-knob i + i{border-width:6px 0 6px 8px; border-color:transparent transparent transparent var(--bg);}
.grade-frame:hover .g-knob, .g-handle:focus-visible .g-knob, .grade-frame.is-dragging .g-knob{transform:scale(1.1);}
.g-handle:focus-visible .g-knob{background:var(--red-bright);}
.g-tag{position:absolute; top:.8rem; z-index:2; font-family:var(--mono); font-size:.62rem; letter-spacing:.22em; text-transform:uppercase; padding:.3rem .5rem; pointer-events:none; transition:opacity .3s;}
.g-tag-l{left:.8rem; color:var(--paper); background:rgba(10,8,7,.55);}
.g-tag-r{right:.8rem; color:var(--paper); background:var(--red-bright);}
.grade-frame[data-side="grade"] .g-tag-l, .grade-frame[data-side="log"] .g-tag-r{opacity:.25;}
.grade-frames{display:flex; flex-direction:column; gap:.9rem;}
@media (max-width:900px){ .grade-frames{flex-direction:row;} .grade-frames li{flex:1; min-width:0;} }
.gf{display:flex; flex-direction:column; gap:.45rem; width:100%; text-align:left;}
.gf-thumb{display:block; aspect-ratio:16/10; background-size:cover; background-position:center; filter:grayscale(1) brightness(.5); transition:filter .45s, transform .6s var(--ease); position:relative;}
.gf:hover .gf-thumb{filter:grayscale(.3) brightness(.8);}
.gf.active .gf-thumb{filter:none; box-shadow:inset 0 -3px 0 var(--red-bright);}
.gf-text{display:flex; gap:.6rem; align-items:baseline; min-width:0;}
.gf-num{font-family:var(--mono); font-size:.62rem; color:var(--ash-faint);}
.gf.active .gf-num{color:var(--red-bright);}
.gf-name{font-family:var(--display); font-size:clamp(.95rem,1.3vw,1.2rem); color:var(--ash); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; transition:color .25s;}
.gf.active .gf-name, .gf:hover .gf-name{color:var(--paper);}

/* =====================================================================
   HIRE
   ===================================================================== */
.hire{background:var(--bg); border-top:1px solid var(--line);}
.hire-grid{display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr); gap:clamp(2rem,6vw,6rem); align-items:start;}
@media (max-width:900px){ .hire-grid{grid-template-columns:1fr;} }
.hire-head{position:sticky; top:96px;}
@media (max-width:900px){ .hire-head{position:static;} }
.hire-title{font-family:var(--display); font-weight:400; font-size:clamp(2.8rem,7vw,6.2rem); line-height:.9; color:var(--paper);}
.hire-roles{display:flex; flex-wrap:wrap; gap:.3rem 1rem; margin-top:1.6rem; font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ash-dim);}
.hire-roles li::before{content:'— '; color:var(--red-bright);}
.hire-form{display:flex; flex-direction:column; gap:1.7rem;}
.hf-group{border:0; min-width:0;}
.hf-group legend, .hf-field > span{display:flex; align-items:baseline; gap:.6rem; font-family:var(--display); font-size:clamp(1.15rem,1.8vw,1.55rem); color:var(--paper); margin-bottom:.8rem; padding:0;}
.hf-group legend i, .hf-field > span i{font-style:normal; font-family:var(--mono); font-size:.62rem; color:var(--red-bright); letter-spacing:.1em;}
.hf-chips{display:flex; flex-wrap:wrap; gap:.5rem 1.4rem;}
.chip{position:relative; font-size:.95rem; color:var(--ash-dim); padding:.3rem 0 .3rem 1.1rem; transition:color .25s;}
.chip::before{content:''; position:absolute; left:0; top:50%; width:.6rem; height:.6rem; margin-top:-.3rem; border:1px solid currentColor; border-radius:50%; transition:background .25s, border-color .25s, transform .3s var(--ease);}
.chip:hover{color:var(--paper);}
.chip[aria-pressed="true"]{color:var(--paper);}
.chip[aria-pressed="true"]::before{background:var(--red-bright); border-color:var(--red-bright); transform:scale(1.15);}
.hf-row{display:grid; grid-template-columns:1fr 1fr; gap:1.6rem;}
@media (max-width:640px){ .hf-row{grid-template-columns:1fr;} }
.hf-field{display:flex; flex-direction:column;}
.hf-field input, .hf-field textarea{font:inherit; font-size:1.02rem; color:var(--paper); background:transparent; border:0; border-bottom:1px solid var(--line-strong); padding:.5rem 0 .6rem; outline:none; resize:vertical; transition:border-color .25s; border-radius:0;}
.hf-field input::placeholder, .hf-field textarea::placeholder{color:var(--ash-faint);}
.hf-field input:focus, .hf-field textarea:focus{border-bottom-color:var(--red-bright);}
.hf-send{display:flex; align-items:center; gap:1.4rem; flex-wrap:wrap; margin-top:.4rem;}
.hf-note{font-family:var(--mono); font-size:.62rem; letter-spacing:.1em; color:var(--ash-faint); text-transform:uppercase;}
.hf-note.warn{color:var(--red-bright);}
.hire .credits{margin-top:clamp(3rem,7vw,5rem); text-align:center;}

/* =====================================================================
   FILMOGRAPHY — edit decision list
   ===================================================================== */
.filmo{border-top:1px solid var(--line);}
.filmo-row{position:relative; display:grid; grid-template-columns:4.2rem 2.2fr 1.6fr 1fr auto; gap:1rem; align-items:center; padding:1.35rem .4rem;
  border-bottom:1px solid var(--line); font-size:.92rem; isolation:isolate;}
.filmo-row::before{content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg, rgba(165,39,31,.22), rgba(165,39,31,0) 85%);
  transform:scaleX(0); transform-origin:left; transition:transform .55s var(--ease);}
a.filmo-row:hover::before, a.filmo-row:focus-visible::before{transform:scaleX(1);}
.filmo-row.head{color:var(--ash-faint); font-family:var(--mono); font-size:.62rem; letter-spacing:.14em; padding-top:.9rem; padding-bottom:.9rem; text-transform:uppercase;}
.filmo-row .f-num{font-family:var(--mono); font-size:.7rem; color:var(--ash-faint); transition:color .3s;}
.filmo-row .f-title{font-family:var(--display); font-size:clamp(1.25rem,2.2vw,1.9rem); line-height:1.05; letter-spacing:.01em; transition:transform .5s var(--ease), color .3s; display:flex; align-items:center; gap:.8rem;}
.filmo-row .f-role{color:var(--ash); font-size:.84rem;}
.filmo-row .f-type{color:var(--ash-dim); font-size:.8rem;}
.filmo-row .f-link{font-size:.74rem; justify-self:end; white-space:nowrap; font-weight:700; letter-spacing:.08em; text-transform:uppercase; transition:color .3s, transform .4s var(--ease);}
a.filmo-row:hover .f-title{transform:translateX(.8rem);}
a.filmo-row:hover .f-num{color:var(--red-bright);}
a.filmo-row:hover .f-link{color:var(--red-bright); transform:translateX(-4px);}
.f-thumb{display:none; flex:0 0 auto; width:72px; aspect-ratio:16/9; background:var(--bg-raised2) center/cover no-repeat;}
@media (max-width:760px){
  .filmo-row{grid-template-columns:2.6rem 1fr; gap:.25rem .8rem; padding:1.1rem 0;}
  .filmo-row.head{display:none;}
  .filmo-row .f-num{grid-row:1/4; align-self:start; padding-top:.5rem;}
  .filmo-row .f-title, .filmo-row .f-role, .filmo-row .f-type, .filmo-row .f-link{grid-column:2;}
  .filmo-row .f-link{justify-self:start; color:var(--red-bright);}
  .f-thumb{display:block;}
  a.filmo-row:hover .f-title{transform:none;}
}
.filmo-preview{position:fixed; left:0; top:0; z-index:60; width:clamp(240px,22vw,340px); aspect-ratio:16/9; pointer-events:none; overflow:hidden;
  opacity:0; transform:scale(.85); background:var(--bg-raised2); box-shadow:0 20px 50px rgba(0,0,0,.55); will-change:transform,opacity;}
.filmo-preview img{width:100%; height:100%; object-fit:cover;}
.fp-tag{position:absolute; left:.5rem; bottom:.45rem; font-family:var(--mono); font-size:.58rem; letter-spacing:.12em; text-transform:uppercase;
  background:var(--red-bright); color:var(--paper); padding:.2rem .4rem;}
@media (hover:none), (max-width:760px){ .filmo-preview{display:none;} }

/* =====================================================================
   CONTACT + FOOTER
   ===================================================================== */
.contact{background:var(--bg-deep); text-align:center; padding-top:clamp(4rem,8vw,6.5rem); padding-bottom:clamp(3rem,6vw,4.5rem); overflow:hidden;}
.contact .eyebrow{display:inline-flex; align-items:center; gap:.6rem; font-family:var(--display); font-size:.95rem; letter-spacing:.12em; color:var(--red-bright);
  margin-bottom:1.6rem; text-transform:uppercase;}
.poem{font-family:var(--serif); font-style:italic; font-weight:500; font-size:clamp(1.8rem,5.4vw,4rem); line-height:1.22;
  max-width:22ch; margin:0 auto 2.4rem; color:var(--paper);}
.poem .pl{display:block;}
.poem em{font-style:italic; color:var(--paper); transition:color .6s;}
.poem em.is-red{color:var(--red-bright);}
.poem .w{display:inline-block;}
.mail-wrap{display:flex; flex-direction:column; align-items:center; gap:.9rem; margin-bottom:2.4rem;}
.mail-big{display:inline-block; font-family:var(--display); font-size:clamp(1.9rem,7.2vw,6.4rem); line-height:1; letter-spacing:.005em; color:var(--paper);
  background:linear-gradient(var(--red-bright),var(--red-bright)) 0 100%/0 3px no-repeat; padding-bottom:.12em; transition:color .35s, background-size .6s var(--ease); word-break:break-all;}
.mail-big:hover{color:var(--red-bright); background-size:100% 3px;}
.copy-btn{font-family:var(--mono); font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ash-dim); padding:.3rem 0; display:inline-flex; align-items:center; gap:.5rem; transition:color .25s;}
.copy-btn::before{content:''; width:18px; height:1px; background:currentColor;}
.copy-btn:hover{color:var(--paper);}
.copy-btn.copied{color:var(--red-bright);}
.contact .links{display:flex; justify-content:center; gap:clamp(1.5rem,4vw,3rem); flex-wrap:wrap; font-size:.92rem; border-top:1px solid var(--line); padding-top:2rem; font-weight:700;}
.contact .links a{color:var(--ash); transition:color .25s;}
.contact .links a:hover{color:var(--red-bright);}
.credits{margin-top:clamp(2.5rem,5vw,3.5rem);}
.credits p:first-child{display:flex; justify-content:center; flex-wrap:wrap; gap:.4rem 1.4rem; font-family:var(--mono); font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ash-dim);}
.credits-name{font-family:var(--display); font-size:clamp(1.2rem,2.4vw,1.7rem); letter-spacing:.08em; margin-top:.7rem;}

.footer{display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:1rem; padding:1.6rem var(--gutter); font-size:.7rem; color:var(--ash-faint); letter-spacing:.04em; background:var(--bg-deep); border-top:1px solid var(--line);}
.footer-logo{height:34px; width:auto; justify-self:center; opacity:.95;}
.rewind{justify-self:end; font-family:var(--mono); font-size:.64rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ash-dim); transition:color .25s;}
.rewind:hover{color:var(--red-bright);}
@media (max-width:640px){ .footer{grid-template-columns:1fr; text-align:center;} .rewind{justify-self:center;} }

/* =====================================================================
   MASTER TIMELINE
   ===================================================================== */
.master{position:fixed; left:0; right:0; bottom:0; z-index:90; height:calc(var(--master-h) + env(safe-area-inset-bottom)); padding:0 var(--gutter) env(safe-area-inset-bottom);
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:1.4rem;
  background:rgba(8,6,5,.97); border-top:1px solid var(--line);
  transform:translateY(100%); transition:transform .6s var(--ease);}
.master.show{transform:translateY(0);}
.master-tc{display:flex; align-items:center; gap:.5rem; font-family:var(--mono); font-size:.7rem; font-weight:500; letter-spacing:.08em; font-variant-numeric:tabular-nums; color:var(--paper); min-width:7.6rem;}
.rec-dot{display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--red-bright); animation:blink 1.2s steps(2) infinite;}
.master-track{position:relative; height:26px;}
.master-clips{position:absolute; inset:0; display:flex; gap:4px;}
.m-clip{position:relative; height:100%; min-width:0; display:flex; flex-direction:column; justify-content:flex-end; gap:5px; text-align:left; padding:0;}
.m-lbl{font-family:var(--mono); font-size:.55rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ash-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; transition:color .25s;}
.m-line{position:relative; display:block; height:3px; background:rgba(236,227,214,.14); overflow:hidden; transition:background .25s;}
.m-fill{position:absolute; inset:0; background:var(--ash-dim); transform:scaleX(0); transform-origin:left;}
.m-clip:hover .m-lbl{color:var(--paper);}
.m-clip:hover .m-line{background:rgba(236,227,214,.3);}
.m-clip.active .m-lbl{color:var(--paper);}
.m-clip.active .m-fill{background:var(--red-bright);}
.master-head{position:absolute; bottom:-5px; height:13px; left:0; width:2px; margin-left:-1px; background:var(--red-bright); box-shadow:0 0 10px rgba(201,56,45,.7); cursor:ew-resize; touch-action:none;}
.master-head::after{content:''; position:absolute; top:-12px; bottom:-8px; left:-12px; right:-12px;}
.master-name{font-family:var(--mono); font-size:.64rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ash); min-width:9rem; text-align:right; white-space:nowrap;}
@media (max-width:760px){
  :root{--master-h:36px;}
  .master{gap:.8rem;}
  .master-name{display:none;}
  .master-tc{min-width:0; font-size:.62rem;}
  .m-lbl{display:none;}
  .master-track{height:12px;}
}

/* =====================================================================
   REDUCED MOTION
   ===================================================================== */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important;}
}