/* alex.mrcuculain.com — improved copy of alexardid.cargo.site */
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/inter-latin-wght-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/inter-latin-ext-wght-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-style:italic;font-weight:100 900;font-display:swap;src:url(/assets/fonts/inter-latin-wght-italic.woff2) format('woff2')}
@font-face{font-family:'Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/IBMPlexMono-normal-400-latin.woff2) format('woff2')}

:root{--hdr:4.9rem;--m:1}
*,*::before,*::after{box-sizing:border-box}
html{font-size:max(10px,.9vw);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:#fff;color:rgba(0,0,0,.8);font-family:'Inter',Helvetica,Arial,sans-serif;font-weight:500;font-size:calc(1.2rem * var(--m));line-height:1.2;letter-spacing:-.006em;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.locked{overflow:hidden}
a{color:inherit;text-decoration:none}
a:active{opacity:.7}
img{display:block;max-width:100%;height:auto}
img{-webkit-user-drag:none;user-select:none}
hr{border:0;height:1px;background:rgba(255,255,255,.2);margin:.35rem 0 1rem}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px;top:8px;background:#000;color:#fff;padding:8px 12px;z-index:200}
.skip:focus{left:8px}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.ov:focus{outline:none}

/* ---------- Cargo text styles ---------- */
[style*="--font-scale"]{font-size:calc(var(--font-scale) * 1em)}
.small-caps{font-variant:small-caps;text-transform:lowercase}
.index{font-size:calc(1.2rem * var(--m));font-weight:520;letter-spacing:.016em;line-height:1.05;display:inline-block}
.work-title{display:block;font-size:calc(1.2rem * var(--m));font-weight:520;color:rgba(255,255,255,.85);line-height:1.15;padding:.45rem 0}
.work-title b,.work-title i{font-weight:inherit;font-style:normal}
.caption-indented{display:inline-block;font-size:calc(1.05rem * var(--m));font-weight:420;color:rgba(255,255,255,.62);line-height:1.2;letter-spacing:.01em;border-left:.1rem solid rgba(255,255,255,.2);padding:.48rem .4rem .4rem 1.25rem}
.caption-indented i{font-style:italic}
.caption{display:block;font-family:'Plex Mono',ui-monospace,monospace;font-size:calc(.75rem * var(--m));font-weight:400;color:rgba(255,255,255,.6);line-height:1.2;letter-spacing:.005em}
.caption a{color:inherit}
.caption[style*="--font-scale"]{font-size:calc(var(--font-scale) * .75rem)}
.bodycopy-light{display:block;font-size:calc(1.2rem * var(--m));font-weight:500;color:rgba(255,255,255,.85);line-height:1.28;letter-spacing:.006em}
.bodycopy-light a{color:inherit}
.small:empty{display:none}
h1{margin:0;font-size:4.5rem;font-weight:380;line-height:1;letter-spacing:-.01em;color:rgba(0,0,0,.85)}
.ti{width:1em;height:1em;display:inline-block;vertical-align:-.1em}
ul.lineated{list-style:none;margin:0 0 0 3em;padding:0;text-indent:-3em}
ul.lineated li{text-indent:0}

/* ---------- column sets (12-column grid) ---------- */
.cs{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--g,1.4rem);align-items:start}
.cu{grid-column:span var(--span,12);min-width:0}

/* ---------- header (pinned, frosted) ---------- */
.hdr{position:fixed;top:0;left:0;right:0;z-index:60;background:rgba(255,255,255,.5);-webkit-backdrop-filter:blur(.34rem);backdrop-filter:blur(.34rem);padding:.8rem .8rem .5rem}
.hdr .cs{align-items:center}
.hdr .index{font-size:calc(1.2rem * 1.94 * var(--m));line-height:1}
.hdr [style*="--font-scale"]{font-size:inherit}
.hdr .small-caps{font-size:calc(1.2rem * 1.94 * var(--m));font-weight:580;letter-spacing:.016em;line-height:1}
.hdr .small-caps a,.hdr .small-caps .index{font-size:inherit}
.hdr a{display:inline-flex;align-items:center;min-height:2.6rem;transition:opacity .2s}
.hdr a:hover{opacity:.6}
.hdr .cu:last-child > div{display:flex;justify-content:flex-end}
.hdr .cu:last-child .small-caps{display:flex;gap:2.4rem}
.hdr .cu:first-child .small-caps{display:flex;gap:.55em}

/* ---------- home: masonry of work ---------- */
.home{padding:calc(var(--hdr) + 8.7rem) 6.4rem 6rem 9.6rem}
.home > hr{display:none}
.masonry{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;align-items:start}
.mcol{display:flex;flex-direction:column;gap:1rem}
.tile{position:relative;display:block;overflow:hidden;background:#f1efed}
.tile img{width:100%;transition:filter .3s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.tile-cap{position:absolute;left:0;right:0;bottom:0;background:rgba(255,255,255,.85);color:#000;padding:.55rem .7rem;font-size:.95rem;text-align:center;opacity:0;transition:opacity .3s ease}
.tile:hover img{filter:brightness(.7)}
.tile:hover .tile-cap,.tile:focus-visible .tile-cap{opacity:1}
.reveal{opacity:0;transform:translateY(2.2rem);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* ---------- overlays ---------- */
.ov{position:fixed;inset:0;z-index:50;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.ov-spacer{height:var(--top,0)}
.ov-panel{position:relative;min-height:100vh;background:var(--tint,rgba(0,0,0,.6));-webkit-backdrop-filter:blur(var(--blur,.4rem));backdrop-filter:blur(var(--blur,.4rem));border-top:.1rem solid rgba(255,255,255,.2);box-shadow:0 0 .05rem rgba(0,0,0,.3)}
.ov-content{padding:.8rem .8rem .5rem}
/* open / close animations */
.ov-project,.ov-index{transition:transform .5s cubic-bezier(.22,.8,.24,1),opacity .5s ease}
.ov-project.pre,.ov-index.pre{transform:translateY(100vh)}
.ov-project.out,.ov-index.out{transform:translateY(2vh);opacity:0}
.ov-about{transition:opacity 1s ease}
.ov-about.pre{opacity:0}
.ov-about.out{opacity:0;transition-duration:.15s}
.ov-info{transition:opacity .4s ease,transform .4s cubic-bezier(.22,.8,.24,1)}
.ov-info.pre{opacity:0;transform:translateY(100%)}
.ov-info.out{opacity:0;transition-duration:.37s}

/* project overlay content */
.ov-project .cs{margin-bottom:0}
.ov-project .ov-content > br,.ov-index .ov-content > br{display:block;content:"";margin-top:1.2rem}
.ov-project .cu > br:first-child{display:none}
.mi{display:block;max-width:100%}
.mi img{width:100%}
.mi.mh img{height:var(--mh);width:auto;max-width:100%}
.mi.linked{transition:opacity .25s}
.mi.linked:hover{opacity:.82}
.ov-project .bodycopy-light a[style*="--font-scale"],.ov-project a[style*="--font-scale"]{display:inline-flex;align-items:center;gap:.25em;line-height:1;color:rgba(255,255,255,.9);margin:1.2rem 0}
.ov-project a[style*="--font-scale"]:hover{opacity:.7}
a.caption{display:inline-block;padding:.4rem 0}

/* justified gallery */
.gj{display:flex;flex-wrap:wrap;gap:var(--g)}
.gj::after{content:"";flex-grow:999}
.ji{flex:var(--ar) 1 calc(var(--ar) * var(--rh));min-width:0}
.ji img{width:100%;height:100%;object-fit:cover}
.ji .film{height:100%}

/* slideshow */
.gs{position:relative;margin:1.2rem 0}
.gs .track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth}
.gs .track::-webkit-scrollbar{display:none}
.gs .slide{flex:0 0 100%;scroll-snap-align:center;display:flex;justify-content:center;align-items:center;height:min(88vh,62vw)}
.gs .slide img{max-height:100%;width:auto;max-width:100%;object-fit:contain}
.gs .slide .film{height:100%;width:auto;max-width:100%}
.gs button{position:absolute;bottom:15px;width:30px;height:30px;border:0;border-radius:50%;background:rgba(87,87,87,.35);cursor:pointer;display:grid;place-items:center}
.gs button::before{content:"";width:8px;height:8px;border:solid rgba(255,255,255,.9);border-width:1.5px 1.5px 0 0}
.gs-prev{left:15px}.gs-prev::before{transform:translateX(1px) rotate(-135deg)}
.gs-next{right:15px}.gs-next::before{transform:translateX(-1px) rotate(45deg)}
.gs button:active{opacity:.7}
.gs-count{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);font-family:'Plex Mono',monospace;font-size:.75rem;color:rgba(255,255,255,.7)}

/* films (click to play) */
.film{position:relative;display:block;width:100%;background:#000;overflow:hidden;color:#fff}
.film img{width:100%;height:100%;object-fit:cover;opacity:.92;transition:opacity .3s}
.film:hover img{opacity:1}
.film iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.film .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:4.4rem;height:4.4rem;border-radius:50%;background:rgba(0,0,0,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:grid;place-items:center;transition:transform .25s}
.film:hover .play{transform:translate(-50%,-50%) scale(1.08)}

/* index overlay */
.ov-index .ov-panel{background:var(--tint);border-radius:2.6rem 2.6rem 0 0;border-top:0;-webkit-backdrop-filter:none;backdrop-filter:none}
.ov-index .ov-content{padding:1.4rem 1rem 3rem}
.ov-index .cs{margin-bottom:.4rem}
.ov-index .mi{margin-bottom:.6rem}
.ov-index .work-title a{color:inherit}

/* about overlay */
.ov-about{z-index:70}
.ov-about .ov-panel{background:var(--tint);border-top:8.7rem solid rgba(255,255,255,.35);-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));box-shadow:none}
.ov-about .ov-content{padding:6.2rem .8rem 4rem;color:rgba(0,0,0,.8);font-size:calc(1.2rem * var(--m));line-height:1.28}
.ov-about .caption{color:rgba(54,45,45,.6)}
.ov-about h1 a{display:inline-flex;align-items:center}
.ov-about .icon-link{font-size:1.4rem}
.ov-about b{font-weight:700}

/* information strip */
.ov-info{display:flex;flex-direction:column;overflow:hidden;z-index:65}
.ov-info .ov-spacer{flex:1}
.ov-info .ov-panel{min-height:0;background:var(--tint);border-top:0;box-shadow:none}
.ov-info .ov-content{padding:.8rem .8rem 1.385rem;color:rgba(0,0,0,.85)}
.ov-info a:hover{opacity:.6}
.ov-info .caption{margin-top:.2rem}

/* ---------- tablet ---------- */
@media (max-width:1100px){
  html{font-size:10px}
  .home{padding-left:4rem;padding-right:3rem}
}

/* ---------- mobile ---------- */
@media (max-width:760px){
  html{font-size:10.5px}
  :root{--m:1.25;--hdr:3.6rem}
  .hdr{padding:.7rem .8rem .5rem}
  .hdr .index,.hdr .small-caps{font-size:calc(1.2rem * 1.3 * var(--m))}
  .hdr .cu:last-child .small-caps{gap:1.6rem}
  .home{padding:calc(var(--hdr) + 3rem) 1rem 4rem}
  .masonry,.mcol{gap:.6rem}
  .tile-cap{display:none}
  .cs.stack{grid-template-columns:minmax(0,1fr);row-gap:1rem}
  .cs.stack > .cu{grid-column:1 / -1}
  .cs.stack > .cu.empty{display:none}
  .ov-project{--top:38vh!important}
  .ov-index{--top:22vh!important}
  .ji{flex-basis:100%}
  .gs .slide{height:auto;max-height:80vh}
  .ov-index .cs{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
  .ov-index .cs > .cu{grid-column:auto}
  .ov-index .cs > .cu.empty{display:none}
  .ov-about .cs{grid-template-columns:minmax(0,1fr) auto}
  .ov-about .cs > .cu{grid-column:auto}
  .ov-about .cs > .cu.empty{display:none}
  .ov-about h1{font-size:3.6rem}
  .ov-about .ov-panel{border-top-width:3rem}
  .ov-about .ov-content{padding-top:3rem}
  .ov-info .cs{grid-template-columns:minmax(0,1fr);row-gap:.8rem}
  .ov-info .cs > .cu{grid-column:1 / -1}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important}
  .reveal{opacity:1;transform:none}
}