/* AFTER CUT V4.3.9 — targeted visual pass over the approved V4.3.7 base.
   Hero geometry, scroll frames, showcase alignment and motion timings stay in their original files. */
:root{--ac-glass:rgba(22,24,24,.72);--ac-hairline:rgba(255,255,255,.12);--ac-content:1364px}

/* One fixed footprint for pause / resume / autoplay fallback. */
#heroPause,#startHeroVideo{
  left:var(--pad);bottom:8vh;top:auto;right:auto;width:44px;height:44px;min-width:44px;min-height:44px;
  display:grid;place-items:center;padding:0;border:1px solid var(--ac-hairline);border-radius:50%;
  background:var(--ac-glass);color:var(--text);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  font-size:0;transform:none;transition:background .4s,border-color .4s;
}
#heroPause[hidden],#startHeroVideo[hidden]{display:none!important}
#startHeroVideo:before{content:'';width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:8px solid currentColor;transform:translateX(1px)}
#heroPause:hover,#startHeroVideo:hover{background:#242626;border-color:var(--accent);transform:none}
.film-trigger{position:relative;overflow:visible}
.film-trigger>span.film-micro-label{
  position:absolute;left:calc(100% + 12px);top:50%;transform:translateY(-50%);display:block;
  width:max-content;white-space:nowrap;line-height:1.4;font-size:9px;letter-spacing:.14em;font-weight:500;
  color:#c7ccca;transition:color .4s,translate .5s var(--ease);
}
.film-trigger:hover .film-micro-label,.film-trigger:focus-visible .film-micro-label{color:var(--accent);translate:3px 0}

/* Shared floating media controls. */
.ui-media-controls{
  width:min(620px,calc(100vw - 40px));gap:9px;padding:6px 8px;border:0;
  background:var(--ac-glass);box-shadow:0 8px 30px #0004;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
}
.ui-media-controls button{width:40px;height:40px;flex:0 0 40px;min-height:40px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:var(--text);padding:10px;transition:background .3s,color .3s}
.ui-media-controls button:hover{background:#ffffff12;color:var(--accent);transform:none}
.ui-media-controls svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ui-media-controls button[hidden]{display:none}
.ui-media-range{min-width:24px;min-height:40px;margin:0;accent-color:var(--accent)}
.ui-media-time{min-width:80px;letter-spacing:.03em;font-size:10px}
.ui-media-controls :focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.case-hero>.ui-media-controls{position:absolute;bottom:22px;width:min(580px,calc(100% - 40px));visibility:hidden;opacity:0;transition:opacity .45s ease;z-index:8}
.case-hero.is-playing>.ui-media-controls{visibility:visible;opacity:1}
.case-hero.is-playing .case-film{border-radius:0;inset:0;width:100%;height:100%;box-shadow:none}
.case-hero:fullscreen{height:100dvh;width:100vw;max-height:none;background:#030505;border-radius:0}
.case-hero:fullscreen .case-film{object-fit:contain}
.player-status{padding:14px 0;gap:20px;line-height:1.6}
.player-status[hidden]{display:none}
.player-status p{margin:0}
.back-to-poster{font-size:10px;min-height:44px}
.media-dialog video{border-radius:0;box-shadow:none;max-height:calc(100dvh - 150px)}
.media-dialog>p{font-size:10px;text-transform:none;letter-spacing:.015em}
.media-dialog>p:before{display:none}

/* Viewer: keep the image, a light caption and two navigation arrows. */
.image-dialog,.media-dialog{background:rgba(5,6,6,.97)}
.dialog-close{width:44px;height:44px;border:0;background:var(--ac-glass);right:max(20px,env(safe-area-inset-right));top:max(20px,env(safe-area-inset-top));box-shadow:none}
.dialog-close:hover,.dialog-close:focus-visible{transform:none;background:#ffffff19;color:var(--accent)}
.image-dialog>img{max-width:calc(100vw - 64px);max-height:calc(100dvh - 156px);border-radius:0;box-shadow:none}
.image-dialog>p{left:24px;top:28px;max-width:calc(100vw - 110px);font-size:11px;letter-spacing:.01em;text-transform:none;line-height:1.5;color:#aeb6b4}
.image-dialog>p:before{display:none}
.image-dialog .image-nav{gap:12px!important;border:0!important;background:transparent!important;backdrop-filter:none;-webkit-backdrop-filter:none;padding:0!important;bottom:max(22px,env(safe-area-inset-bottom))!important}
.image-dialog .image-nav[hidden]{display:none!important}
.image-nav button{width:44px;height:44px;background:var(--ac-glass)}
.image-nav button:disabled{opacity:.25}
.image-nav button:not(:disabled):hover{transform:none;background:#ffffff18;color:var(--accent)}
.image-count{min-width:46px;font-size:10px;letter-spacing:.07em;font-variant-numeric:tabular-nums;color:#aeb6b4}
.image-open>span{width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:50%;background:var(--ac-glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font-size:16px}

/* A real exit sequence at the end of each case. */
.case-footer{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px 40px;margin-top:clamp(40px,5vw,72px);padding:28px 0 0;border:0;border-top:1px solid #ffffff10}
.case-behance{position:relative;display:grid;grid-template-columns:1fr auto;row-gap:9px;align-items:center;width:380px;max-width:100%;min-height:84px;padding:17px 20px;background:linear-gradient(120deg,#141616,#0d0f0f);border:1px solid #ffffff0c;border-radius:12px;overflow:hidden;transition:background .6s,border-color .6s}
.case-behance:before{content:'';position:absolute;left:0;top:30%;bottom:30%;width:2px;background:var(--accent);opacity:.6;transition:top .6s var(--ease),bottom .6s var(--ease),opacity .6s}
.case-behance__eyebrow{font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:#8f9996;grid-column:1}
.case-behance__title{grid-column:1;font-size:12px;letter-spacing:.025em;font-weight:500;line-height:1.35}
.case-behance__destination{color:#aeb6b3}
.case-behance__arrow{grid-column:2;grid-row:1/3;color:var(--accent);font-size:22px;margin-left:18px;transition:transform .6s var(--ease)}
.case-behance:hover{border-color:#ff6a0033;background:linear-gradient(120deg,#191b19,#111210)}
.case-behance:hover:before{top:20%;bottom:20%;opacity:1}
.case-behance:hover .case-behance__arrow{transform:translate(4px,-4px)}
.case-behance.is-unavailable{cursor:default}
.case-behance.is-unavailable .case-behance__arrow{opacity:.5}
.case-return{width:auto;max-width:100%;display:flex;justify-content:space-between;align-items:center;gap:18px;text-align:left;padding:12px 0;border:0;background:none}
.case-return__copy{display:grid;gap:8px}
.case-return .micro{margin:0;color:#88928f;font-size:8px;letter-spacing:.1em}
.case-return__title{font-size:clamp(16px,1.2vw,20px);line-height:1.08;letter-spacing:-.045em;font-weight:500}
.case-return__dot{color:var(--accent)}
.case-return__arrow{flex:0 0 38px;height:38px;display:grid;place-items:center;border:1px solid #ffffff21;border-radius:50%;font-size:19px;color:var(--accent);transition:transform .65s var(--ease),background .5s,border-color .5s}
 .case-return:hover .case-return__arrow{transform:translateY(-3px);border-color:var(--accent);background:#ff6a0009}
.project-stage.is-returning .case-study{opacity:.35;transition:opacity .6s ease}
.project-card{outline:1px solid transparent}
.case-behance:focus-visible,.case-return:focus-visible,.dialog-close:focus-visible,.image-nav button:focus-visible{outline:2px solid var(--accent);outline-offset:6px}

/* Optional compare: the left label belongs to the left image. */
.project-compare[hidden]{display:none!important}
.project-compare__after{clip-path:none}
.project-compare__before{clip-path:inset(0 calc(100% - var(--compare-pos)) 0 0)}
.project-compare__frame{border:0;border-radius:10px;aspect-ratio:16/9}
.project-compare__range:focus-visible{outline:0}
.project-compare__frame:focus-within{outline:2px solid var(--accent);outline-offset:5px}
.project-compare__knob{width:48px;height:48px;border:1px solid #ffffff80;background:var(--ac-glass)}
.project-compare__head .micro{font-size:9px;color:#8c9692}
.project-compare__head h4{font-size:clamp(26px,3vw,42px)}
.project-compare__hint{font-size:11px;color:#818d88}
.project-compare.is-inviting .project-compare__line{animation:none}
.project-compare.is-inviting .project-compare__knob{animation:comparePulse 1.5s ease 1}
@keyframes comparePulse{0%,100%{box-shadow:0 0 0 0 #ffffff00}50%{box-shadow:0 0 0 9px #ffffff12}}

/* About and Contact share an identical outer grid, including wide screens. */
#about,#contact{width:100%;max-width:none;margin-inline:0;padding-inline:max(var(--pad),calc((100vw - var(--ac-content)) / 2))}
#about .about-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);column-gap:clamp(32px,5vw,80px);justify-content:stretch;align-items:center}
#about .about-copy{width:100%;max-width:600px;min-width:0}
#about .about-grid .portrait{width:100%;max-width:470px;justify-self:end}
#contact .contact-minimal{width:100%;max-width:none}
#contact .contact-minimal h3{max-width:none;font-size:clamp(54px,7.5vw,126px)}
#contact .contact-email{width:100%;max-width:none;overflow-wrap:anywhere}
#contact .contact-form-mini{width:100%;max-width:920px}
#contact .contact-form-mini .send{min-height:44px}
.contact-actions button{min-height:44px}
.footer-behance:disabled{cursor:default;opacity:.45}

@media(max-width:1000px) and (min-width:761px){#about .about-grid{column-gap:28px;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}}
@media(max-width:760px){
  #heroPause,#startHeroVideo{bottom:11vh}
  .film-trigger>span.film-micro-label{font-size:8px;left:calc(100% + 9px)}
  .ui-media-controls{gap:3px;padding:5px;width:calc(100vw - 28px);bottom:max(18px,env(safe-area-inset-bottom))}
  .ui-media-controls button{width:36px;height:40px;flex-basis:36px;padding:8px}
  .ui-media-time{font-size:9px;min-width:66px;letter-spacing:0}
  .case-hero>.ui-media-controls{bottom:12px;width:calc(100% - 20px)}
  .image-dialog>img{max-width:100vw;max-height:calc(100dvh - 170px)}
  .image-dialog>p{left:20px;top:27px;max-width:calc(100vw - 96px);font-size:10px}
  .media-dialog>p{left:20px;top:27px;max-width:calc(100vw - 100px);line-height:1.5}
  .case-footer{gap:18px;padding-top:24px}.case-behance{min-height:80px;padding:16px 18px;row-gap:8px;border-radius:10px}
  .case-behance__title{font-size:11px}.case-behance__destination{display:inline;margin-top:0}
  .case-behance__arrow{font-size:20px;margin-left:12px}
  .case-behance__eyebrow{font-size:8px;letter-spacing:.1em}
  .case-return{gap:16px;padding:10px 0}.case-return__copy{gap:7px}
  .case-return__title{font-size:17px;max-width:none}
  .case-return__arrow{flex-basis:36px;height:36px;font-size:18px}
  .case-return .micro{font-size:8px;letter-spacing:.1em}
  .project-compare__frame{aspect-ratio:16/9;border-radius:7px}
  .project-compare__head{gap:14px}.project-compare__head h4{font-size:26px}
  .project-compare__demo{max-width:100px;font-size:8px;line-height:1.5;text-align:right}
  .project-compare__knob{width:40px;height:40px}
  .project-compare__label{font-size:8px;padding:6px 8px;top:10px}
  #about .about-grid{display:flex;flex-direction:column;gap:24px}
  #about .about-copy{max-width:none}
  #about .about-grid .portrait{align-self:center;max-width:330px}
  #contact .contact-minimal h3{font-size:clamp(46px,13.8vw,92px);line-height:.95}
  .contact-email{gap:16px}
}
@media(prefers-reduced-motion:reduce){
  .case-behance,.case-behance:before,.case-behance__arrow,.case-return__arrow,.film-micro-label,.project-stage.is-returning .case-study,.ui-media-controls{transition:none!important}
  .project-compare.is-inviting .project-compare__knob{animation:none}
}


/* V4.3.9 — one showreel control; no anonymous text node or pseudo-element
   competing with the icon for a second grid row. */
.film-trigger .play-circle{position:relative;line-height:0!important;font-size:0!important}
.film-trigger .play-circle:after{content:none!important;display:none!important}
.film-trigger .play-circle svg{display:block;position:absolute;left:50%;top:50%;width:18px;height:18px;transform:translate(-50%,-50%);fill:currentColor;overflow:visible}
#openReel{
  width:max-content!important;height:48px!important;min-height:48px!important;display:inline-flex!important;
  align-items:center!important;justify-content:center;gap:10px!important;padding:5px 18px 5px 5px!important;
  border:1px solid #ffffff30!important;border-radius:999px!important;background:rgba(12,15,15,.48)!important;
  backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important;
  transition:border-color .4s,background .4s;
}
#openReel .play-circle{width:36px!important;height:36px!important;min-width:36px!important;flex:0 0 36px;border:1px solid #ffffff20!important;background:#ffffff05!important;transform:none!important}
#openReel>span.film-micro-label{position:static;display:block;transform:none;translate:none;white-space:nowrap;font-size:10px;letter-spacing:.09em;line-height:1;color:#f1f0ed}
#openReel:hover,#openReel:focus-visible{border-color:var(--accent)!important;background:rgba(25,27,25,.8)!important}
#openReel:hover .play-circle,#openReel:focus-visible .play-circle{color:#fff!important;background:#ffffff0a!important;border-color:var(--accent)!important}
#openReel:focus-visible{outline:2px solid var(--accent);outline-offset:5px}

/* About: distinct rhythms. The title changes light with scroll; paragraphs
   fade as whole blocks, without line masks, lateral movement or blur. */
#about[data-about-motion="light-reveal"] .section-heading{opacity:1;transform:none;transition:none}
#about[data-about-motion="light-reveal"] .section-heading h2{animation:none!important;clip-path:none!important;transform:none!important}
.motion-lab #about[data-about-motion="light-reveal"] .about-statement,
.motion-lab #about[data-about-motion="light-reveal"] .about-prose{transform:none}
#about[data-about-motion="light-reveal"] .about-line{overflow:visible}
#about[data-about-motion="light-reveal"] .about-line>span{display:block;transform:none;opacity:1;color:#f1f0ed}
@supports (background-clip:text) or (-webkit-background-clip:text){
  #about[data-about-motion="light-reveal"].has-light-reveal .about-line>span{
    background-image:linear-gradient(100deg,#f1f0ed 0%,#f1f0ed var(--about-lit,100%),#626968 calc(var(--about-lit,100%) + 18%),#626968 100%);
    background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  }
}
#about .about-copy .about-role{font-size:clamp(12px,1.03vw,16px);font-weight:500;letter-spacing:.01em;line-height:1.5;color:#d8dddb;max-width:38em;margin-bottom:28px}
#about .about-copy>p.about-prose{font-size:clamp(15px,1.12vw,18px);line-height:1.65;letter-spacing:-.015em;max-width:36em;margin:0 0 22px;color:#b8c0bd}
#about .about-copy>p.about-signature{margin:30px 0 0;color:#f1f0ed;font-size:15px;letter-spacing:.01em}
#about .about-copy .clients{margin-top:48px}
@media(max-width:760px){
  #openReel{height:46px!important;min-height:46px!important;padding-right:16px!important}
  #openReel>span.film-micro-label{font-size:9px}
  #about .about-copy>p.about-prose{font-size:16px;line-height:1.65}
  #about .about-copy .about-role{font-size:12px}
}
@media(prefers-reduced-motion:reduce){
  #about[data-about-motion="light-reveal"] .about-line>span{background:none!important;color:#f1f0ed!important;-webkit-text-fill-color:currentColor!important}
}
