/* charliecohen.com: static rebuild of the Wix site (layout generated by tools/build.py) */
@font-face{font-family:"Sora";src:url(fonts/sora-latin.woff2) format("woff2");font-weight:100 800;font-display:swap}
@font-face{font-family:"Space Grotesk";src:url(fonts/space-grotesk-latin.woff2) format("woff2");font-weight:300 700;font-display:swap}
/* --u = one Wix design pixel: 1px on desktop, scaled below the 980px stage, and the 320px
   Wix mobile layout scaled to the screen width on phones */
:root{--u:1px;--display:"Sora",sans-serif;--body:"Space Grotesk",sans-serif;--fs:16;--lh:normal;--ls:0;--fsm:16;--lhm:normal;--lsm:0}
@media (max-width:979.98px){:root{--u:calc(100vw / 980)}}
@media (max-width:767.98px){:root{--u:calc(100vw / 320)}}
*{box-sizing:border-box}
html{background:#EDEDED;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:#EDEDED;color:#3D3D3D;font-family:var(--body);min-height:100vh}
.page{position:relative;overflow-x:clip;min-height:100vh}
.blk{position:relative;display:block;width:100%}
.hdr{position:sticky;top:0;z-index:50;transition:transform .4s ease}
.hdr.hdr-hide{transform:translateY(-100%)}
.n{position:absolute;display:block;margin:0;padding:0}
a.n{text-decoration:none;color:inherit}
.ly{position:absolute;display:block}
img.ly,.crop img,video.ly{max-width:none}
.crop{overflow:hidden}
.crop img{position:absolute;display:block}
video.ly{object-fit:cover}
.sv svg{display:block;overflow:visible}
/* text */
.rtx{position:relative;overflow-wrap:break-word}
.rtx *,.lb{font-size:calc(var(--fs) * var(--u));line-height:var(--lh);letter-spacing:calc(var(--ls) * var(--u))}
.rtx a{color:inherit;text-decoration:none}
.lb{position:absolute;display:flex;align-items:center;justify-content:center;white-space:nowrap;text-align:center}
@media (max-width:767.98px){
  .rtx *,.lb{font-size:calc(var(--fsm) * var(--u));line-height:var(--lhm);letter-spacing:calc(var(--lsm) * var(--u))}
  .rtx [style*="--tam"]{text-align:var(--tam)!important}
  .hdr{position:relative}
}
/* links, buttons, hover states (as on Wix) */
.lnk .lb{transition:color .4s ease}
.lnk:hover .lb{color:#1F1F1F!important}
.btn-inv .dc,.btn-inv .lb{transition:background-color .2s ease,color .2s ease}
.btn-inv:hover .dc{background-color:#1F1F1F!important}
.btn-inv:hover .lb{color:#EDEDED!important}
a:focus-visible,button:focus-visible{outline:2px solid #116DFF;outline-offset:2px}
.gl{display:block}
.gimg{display:block;width:100%;height:100%;object-fit:contain}
/* hamburger (desktop header) */
button.n{background:none;border:0;padding:0;cursor:pointer;color:inherit;font:inherit}
.hbm{position:fixed;inset:0;z-index:100}
.hbm[hidden]{display:none}
.hbm-bg{position:absolute;inset:0;background:rgba(237,237,237,.8);opacity:0;transition:opacity .4s ease}
.hbm-panel{position:absolute;top:0;right:0;bottom:0;width:383px;max-width:100%;background:#FFF;transform:translateX(100%);transition:transform .4s ease;overflow:auto}
.hbm.open .hbm-bg{opacity:1}
.hbm.open .hbm-panel{transform:none}
.hbm-x{position:absolute;top:28px;right:28px;width:26px;height:26px;background:none;border:0;padding:0;cursor:pointer}
.hbm nav{margin:77px 0 0 17px}
.hbm-top{display:block;background:none;border:0;cursor:pointer;padding:10px;font:700 44px/56px var(--display);color:#3D3D3D;letter-spacing:-.02em}
.hbm-item:hover .hbm-top,.hbm-item.open .hbm-top,.hbm-top:focus-visible{color:#1F1F1F;text-decoration:underline}
.hbm-sub{display:none;list-style:none;margin:10px 0 0;padding:0;background:#EDEDED;width:293px}
.hbm-item:hover .hbm-sub,.hbm-item:focus-within .hbm-sub,.hbm-item.open .hbm-sub{display:block}
.hbm-sub a{display:block;padding:10px 10px 10px 20px;font:16px/19px Helvetica,Arial,sans-serif;letter-spacing:.03em;color:#000;text-decoration:none}
.hbm-sub a:hover,.hbm-sub a:focus-visible{text-decoration:underline}
.hbm-chev{display:none}
.hb-m{display:none}
@media (max-width:767.98px){
  .hb-m{display:block;position:absolute;left:calc(285*var(--u));top:calc(16*var(--u));width:calc(26*var(--u));height:calc(26*var(--u));background:none;border:0;padding:0;cursor:pointer}
  .hb-m span{position:absolute;left:calc(2*var(--u));width:calc(22*var(--u));height:calc(2*var(--u));background:#3D3D3D}
  .hb-m span:first-child{top:calc(7*var(--u))}.hb-m span+span{top:calc(17*var(--u))}
  .hbm-bg{background:#EDEDED}
  .hbm-panel{inset:0;width:auto;background:transparent;transform:translateY(-60px);opacity:0;transition:transform .5s ease,opacity .5s ease}
  .hbm.open .hbm-panel{transform:none;opacity:1}
  .hbm-x{top:calc(56*var(--u));right:calc(12*var(--u));width:calc(20*var(--u));height:calc(20*var(--u))}
  .hbm nav{width:calc(188*var(--u));margin:calc(95*var(--u)) auto 0}
  .hbm-item{border-bottom:1px solid #FFF}
  .hbm-top{position:relative;width:100%;padding:0;font:400 calc(16*var(--u))/calc(56*var(--u)) var(--body);letter-spacing:0;text-align:center;color:#3D3D3D}
  .hbm-item:hover .hbm-top,.hbm-item.open .hbm-top{text-decoration:none}
  .hbm-chev{display:block;position:absolute;left:calc(20*var(--u));top:50%;width:calc(12*var(--u));height:calc(8*var(--u));margin-top:calc(-4*var(--u));transition:transform .3s}
  .hbm-item.open .hbm-chev{transform:rotate(180deg)}
  .hbm-item:hover .hbm-sub,.hbm-item:focus-within .hbm-sub{display:none}
  .hbm-item.open .hbm-sub{display:block}
  .hbm-sub{width:auto;margin:0 0 calc(10*var(--u));background:transparent}
  .hbm-sub a{padding:0;text-align:center;font:calc(14*var(--u))/calc(40*var(--u)) var(--body);letter-spacing:0;color:#3D3D3D}
}
/* slideshow */
.ss-slide{transition:opacity 1s ease}
.ss-slide:not(.is-on){opacity:0;pointer-events:none}
.ss-btn{z-index:5;background:none;border:0;padding:0;cursor:pointer}
.ss-btn[data-ss="next"]{transform:scaleX(-1)}
/* Wix entrance animations (same keyframes, durations and easings as the Wix site).
   Elements are only hidden when JS has added .mo to <html> (and motion is allowed). */
@keyframes motion-fadeIn{0%{opacity:0}100%{opacity:var(--comp-opacity,1)}}
@keyframes motion-floatIn{0%{opacity:0;animation-timing-function:step-end}0.0001%{opacity:0;transform:translate(var(--motion-translate-x),var(--motion-translate-y))}100%{opacity:var(--comp-opacity,1);transform:translate(0,0)}}
@keyframes motion-slideIn{0.0001%{opacity:var(--comp-opacity,1);transform:translate(var(--motion-translate-x,-100%),var(--motion-translate-y,0%));clip-path:var(--motion-clip-start,polygon(0% 20%,100% 20%,100% 100%,0% 100%))}100%{transform:translate(0px,0px);clip-path:polygon(0% 0%,100% 0%,100% 100%,0% 100%)}}
.mo .mo-run{animation-play-state:running!important}
@media (prefers-reduced-motion:reduce){.hdr,.hbm-panel,.hbm-bg,.ss-slide,.lnk .lb,.btn-inv .dc,.btn-inv .lb{transition:none}}
/* home gallery hover (Wix pro-gallery): rgba(196,196,196,.71) overlay over the image, project title
   in Sora 700 40/50 #3D3D3D centred with 30px padding; overlay fades .2s, title .4s; hidden on touch/mobile */
.gl-ov{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:calc(30*var(--u));text-align:center;pointer-events:none}
.gl-ov::before{content:"";position:absolute;inset:0;background:rgba(196,196,196,.71);opacity:0;transition:opacity .2s}
.gl-t{position:relative;font:700 calc(40*var(--u))/calc(50*var(--u)) var(--display);letter-spacing:normal;color:#3D3D3D;opacity:0;transition:opacity .4s}
@media (hover:hover) and (min-width:768px){
  .gl:hover .gl-ov::before,.gl:hover .gl-t{opacity:1}
}
/* keyboard focus, and the first tap on touch devices (Wix mobile: tap 1 shows, tap 2 opens) */
.gl:focus-visible .gl-ov::before,.gl:focus-visible .gl-t,.gl.is-tap .gl-ov::before,.gl.is-tap .gl-t{opacity:1}
.gl{-webkit-tap-highlight-color:transparent}
/* page transition: Wix "OutIn" - old page content fades out (.35s cubic-bezier(.22,1,.36,1)),
   then the new one fades in (.35s cubic-bezier(.64,0,.78,0), .35s delay); header and footer swap in place */
@keyframes out-in-old{to{opacity:0}}
@keyframes out-in-new{0%{opacity:0}}
@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
  #SITE_HEADER{view-transition-name:header-group}
  #SITE_FOOTER{view-transition-name:footer-group}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none}
  ::view-transition-old(root){animation:.35s cubic-bezier(.22,1,.36,1) forwards out-in-old}
  ::view-transition-new(root){animation:.35s cubic-bezier(.64,0,.78,0) .35s backwards out-in-new}
  /* JS fallback for browsers without cross-document view transitions */
  html.pt-out .page>.blk:not(#SITE_HEADER):not(#SITE_FOOTER){opacity:0;transition:opacity .35s cubic-bezier(.22,1,.36,1)}
  html.pt-pre .page>.blk:not(#SITE_HEADER):not(#SITE_FOOTER){opacity:0}
  html.pt-in .page>.blk:not(#SITE_HEADER):not(#SITE_FOOTER){transition:opacity .35s cubic-bezier(.64,0,.78,0)}
}
@media (prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}
/* 404 page (404.html, generated by tools/build.py) */
.nf{display:flex;align-items:center;justify-content:center;min-height:max(calc(560*var(--u)),calc(100vh - 260*var(--u)));padding:calc(60*var(--u)) calc(20*var(--u))}
.nf-in{display:flex;flex-direction:column;align-items:center;text-align:center}
.nf-code{margin:0 0 calc(8*var(--u));font:400 calc(16*var(--u))/1.4 var(--body);letter-spacing:calc(1.6*var(--u));color:#3D3D3D}
.nf-h{margin:0;font:700 calc(56*var(--u))/1.2 var(--display);letter-spacing:calc(-1.12*var(--u));color:#3D3D3D}
.nf-p{margin:calc(20*var(--u)) 0 calc(40*var(--u));font:400 calc(16*var(--u))/1.6 var(--body);color:#3D3D3D}
.nf-btn{display:inline-flex;align-items:center;justify-content:center;min-width:calc(177*var(--u));height:calc(40*var(--u));padding:0 calc(24*var(--u));border:calc(1*var(--u)) solid #1F1F1F;background:#EDEDED;color:#1F1F1F;font:400 calc(14*var(--u))/1 var(--body);letter-spacing:calc(1.4*var(--u));text-decoration:none;transition:background-color .2s ease,color .2s ease}
.nf-btn:hover,.nf-btn:focus-visible{background:#1F1F1F;color:#EDEDED}
@media (max-width:767.98px){
  .nf{min-height:max(calc(420*var(--u)),calc(100vh - 160*var(--u)));padding:calc(40*var(--u)) calc(20*var(--u))}
  .nf-code{font-size:calc(14*var(--u))}
  .nf-h{font-size:calc(34*var(--u));letter-spacing:calc(-0.68*var(--u))}
  .nf-p{margin:calc(16*var(--u)) 0 calc(32*var(--u));font-size:calc(14*var(--u))}
  .nf-btn{min-width:calc(160*var(--u));height:calc(42*var(--u))}
}
@media (prefers-reduced-motion:no-preference){
  .mo .nf-a:not(.mo-done){animation:motion-floatIn 1200ms 1ms cubic-bezier(0.445,0.05,0.55,0.95) backwards 1 paused;--motion-translate-x:0px;--motion-translate-y:60px}
  .mo .nf-h:not(.mo-done){animation-delay:120ms}
  .mo .nf-p:not(.mo-done){animation-delay:240ms}
  .mo .nf-btn:not(.mo-done){animation-delay:360ms}
}
@media (prefers-reduced-motion:reduce){.nf-btn{transition:none}}