@import url('/cinema-cut.css?v=3');

/* A soft light field stays behind the portrait and fades before its edge. */
:root{--beam-x:52%;--beam-y:38%;--beam-angle:112deg;--beam-shift:50%}
@property --beam-idle-x{syntax:"<percentage>";inherits:false;initial-value:24%}
.profile-main:before{
  background:radial-gradient(ellipse 46% 86% at var(--beam-idle-x) var(--beam-y),#dceaf222 0%,#c3d9eb0d 44%,transparent 80%);
  mask-image:linear-gradient(to right,#000 0%,#000 48%,#0009 66%,transparent 84%);
  mix-blend-mode:screen;
  opacity:.9;
  animation:light-idle 17s ease-in-out infinite alternate;
  z-index:0;
}
.portrait{z-index:1}
.portrait:before{
  display:none;
}
html.light-interactive .profile-main:before{background:radial-gradient(ellipse 46% 86% at var(--beam-x) var(--beam-y),#dceaf222 0%,#c3d9eb0d 44%,transparent 80%)}
html.light-interactive .profile-main:before,
html.light-interactive .portrait:before{animation:none}
@keyframes light-idle{from{--beam-idle-x:24%}to{--beam-idle-x:70%}}
.profile-copy h1{background:none;color:#f3f1ef;animation:none}
.profile-copy{padding-left:var(--section-gutter,24px)}
.profile-main:after{left:8px}

.site-header nav a{position:relative;transition:color .25s ease}
.site-header nav .nav-contact{padding-block:0}
.site-header nav a:after{content:'';position:absolute;left:0;right:0;bottom:-5px;height:1px;background:linear-gradient(90deg,#e76b67,#d7e3ec);transform:scaleX(0);transform-origin:left;transition:transform .32s ease}
.site-header nav a:hover:after,.site-header nav a:focus-visible:after{transform:scaleX(1)}
.profile-actions .contact-button{transition:color .25s ease,border-color .25s ease,text-shadow .25s ease}
.profile-actions .contact-button:hover{color:#fff;text-shadow:0 0 14px #d4e7f744}
.profile-actions .telegram-button:hover{border-bottom-color:#d8e6ee}
.featured-grid .film-card,.credit-card{transition:background .28s ease,box-shadow .28s ease}
.featured-grid .film-card:hover,.credit-card:hover{background:linear-gradient(var(--beam-angle),#b9cde80b,#dcebf013,#b9cde806)!important;box-shadow:inset 0 1px #d4e5ef44}
.credits-tabs-list button:hover{border-bottom-color:#c9dae86b!important}
.credits-tabs-list button[data-active]:hover{border-bottom-color:#e76b67!important}
.resource:hover{border-color:#d4e3ed63}
a:focus-visible,button:focus-visible{outline:2px solid #d4e5ef;outline-offset:3px}
.film-card .film-poster,.credit-card .credit-poster,.film-card .film-source svg,.credit-card .credit-title svg,.profile-actions svg:last-child{transition:transform .34s ease,filter .34s ease,box-shadow .34s ease,color .34s ease,background .34s ease}
@media(hover:hover) and (pointer:fine){
  .featured-grid .film-card:hover,.featured-grid .film-card:focus-visible{box-shadow:inset 0 1px #d5e6ef65,inset 0 -1px #d5e6ef30;background:linear-gradient(var(--beam-angle),#cbd9e510,#dcebf01e,#b9cde80a)!important}
  .film-card:hover .film-poster,.film-card:focus-visible .film-poster{transform:translateY(-2px) scale(1.07);filter:brightness(1.13) saturate(1.08);box-shadow:0 7px 20px #0009}
  .film-card:hover .film-source svg,.film-card:focus-visible .film-source svg{transform:translate(3px,-3px);color:#d5e6ef}
  a.credit-card:hover,a.credit-card:focus-visible{box-shadow:inset 0 1px #d5e6ef65,inset 0 -1px #d5e6ef30;background:linear-gradient(var(--beam-angle),#cbd9e510,#dcebf01e,#b9cde80a)!important}
  a.credit-card:hover .credit-poster,a.credit-card:focus-visible .credit-poster{transform:translateY(-2px) rotate(-3deg);background:#d7e4ef1a;color:#d5e6ef;box-shadow:0 4px 14px #0008}
  a.credit-card:hover .credit-title svg,a.credit-card:focus-visible .credit-title svg{transform:translate(3px,-3px);color:#d5e6ef}
  .profile-actions .contact-button:hover svg:last-child,.contact-section .contact-button:hover svg:last-child{transform:translate(3px,-3px)}
  .profile-fact-link:hover dt:after{color:#f7fbff;text-shadow:0 0 18px #d6e7f766}
  .production-section button:hover,.filmography-expansion button:hover{box-shadow:inset 0 1px #d5e6ef55,inset 0 -1px #d5e6ef2c;background:#d8e5ee0d}
}
@property --stat-count{syntax:"<integer>";inherits:false;initial-value:0}
@keyframes count-51{from{--stat-count:0}to{--stat-count:51}}
@keyframes count-18{from{--stat-count:0}to{--stat-count:18}}
@keyframes count-lock{0%,77%{opacity:0;transform:scaleX(0)}94%{opacity:.8;transform:scaleX(1)}100%{opacity:.46;transform:scaleX(1)}}
.profile-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:8px 0!important;border-top:0}
.profile-fact-link{display:block;position:relative;min-width:0;cursor:pointer;background:#ffffff04;border-top:1px solid #ffffff2b;border-bottom:1px solid #ffffff12;transition:background-color .25s ease,border-color .25s ease,transform .25s ease,box-shadow .25s ease}
.profile-fact-link dl{display:block;height:100%}
.profile-fact-link dl>div{display:flex;align-items:center;gap:14px;min-height:62px;padding:9px 24px}
.profile-fact-link dd{min-width:0}
.profile-fact-link:first-child dd>span{display:none}
.profile-fact-link:before{content:"";position:absolute;left:24px;right:24px;bottom:-1px;height:1px;background:#d5e6ef;transform-origin:left;animation:count-lock 1.85s ease-out both;pointer-events:none}
.profile-fact-link:hover,.profile-fact-link:focus-visible{background:#172027;border-top-color:#b9d0df7a;box-shadow:inset 0 1px #d8e9f026;transform:translateY(-2px)}
.profile-fact-link:active{background:#24313b;box-shadow:inset 0 0 0 1px #cfe3ef6b;transform:translateY(0)}
.profile-facts dt{font-variant-numeric:tabular-nums;min-width:2ch;position:relative;color:transparent;counter-reset:stat var(--stat-count)}
.profile-facts dt:after{content:counter(stat);position:absolute;inset:0;color:#f3f1ef}
.profile-fact-link:first-child dt{animation:count-51 1.4s cubic-bezier(.18,.65,.22,1) .2s both}
.profile-fact-link:nth-child(2) dt{animation:count-18 1.4s cubic-bezier(.18,.65,.22,1) .2s both}
.light-permission{display:none}
@media(min-width:901px){
  .profile-main{min-height:430px;background:radial-gradient(ellipse at 85% 38%,#394045 0%,#20272d 39%,#0b0e12 78%)}
  .portrait img{position:absolute;top:-18px;left:auto;right:0;width:min(34vw,380px);height:auto;max-width:none;object-fit:contain;filter:contrast(1.04) saturate(.38) brightness(1.02);mask-image:linear-gradient(to right,transparent 0%,#0005 10%,#000b 23%,#000 35%)}
  .portrait:after{background:linear-gradient(to bottom,transparent 79%,#0b0e12 100%)}
  .profile-copy{padding-top:22px;padding-bottom:22px}
  .profile-copy h1{font-size:clamp(54px,5.8vw,76px);margin:15px 0 16px}
  .profile-role{font-size:17px}
  .profile-value{font-size:15.5px;line-height:1.44;margin-top:14px}
  .profile-detail{font-size:14.5px}
  .profile-actions{margin-top:14px}
  .profile-fact-link dl>div{min-height:62px}
  section h2{font-size:clamp(28px,3vw,36px)}
}
@media(min-width:601px) and (max-width:900px){
  .profile-main{min-height:420px}
  .portrait img{position:absolute;top:-12px;left:auto;right:0;width:min(44vw,350px);height:auto;max-width:none;object-fit:contain;filter:contrast(1.04) saturate(.4) brightness(1.02);mask-image:linear-gradient(to right,transparent,#0005 10%,#000b 22%,#000 34%)}
  .portrait:after{background:linear-gradient(to bottom,transparent 81%,#0b0e12 100%)}
}
@media(max-width:600px){
  :root{--text-body:15px}
  .portrait{width:53%}
  .profile-copy h1{font-size:clamp(29px,8.9vw,39px);max-width:78%;letter-spacing:-.07em;line-height:.95;margin-top:90px;margin-bottom:9px;position:relative;z-index:3;text-shadow:0 2px 18px #0b0e12cc}
  .profile-role{padding-top:7px}
  .profile-value,.profile-detail{font-size:var(--text-body);line-height:1.5}
  .portrait img{filter:contrast(1.04) saturate(.4) brightness(1.02)}
  .profile-facts{gap:7px;padding:8px 0!important}
  .profile-fact-link dl>div{gap:5px;min-height:64px;padding:8px 7px}
  .profile-fact-link:before{left:7px;right:7px}
  .light-permission{display:block;width:100%;padding:4px 16px 7px 0;border:0;background:none;color:#aebdc8;text-align:right;font:500 11px Manrope,Arial,sans-serif;letter-spacing:.03em;cursor:pointer}
  .light-permission:hover,.light-permission:focus-visible{color:#f3f1ef}
}
@media(min-width:351px) and (max-width:600px){.profile-fact-link dl>div{padding-inline:16px}.profile-fact-link:before{left:16px;right:16px}}
@media(max-width:350px){.profile-fact-link:first-child dd{font-size:12px}}
@media(prefers-reduced-motion:reduce){
  .profile-main:before,.portrait:before{animation:none!important}
  .site-header nav a:after,.profile-actions .contact-button,.featured-grid .film-card,.credit-card{transition:none}
  .profile-facts dt{animation:none;color:#f3f1ef}
  .profile-facts dt:after{content:none}
  .profile-fact-link{transition:none}
  .profile-fact-link:before{animation:none;opacity:.46;transform:none}
  .credit-card .credit-title svg{transition:none}
}
