/* ===== Mosaic ===== */
.gm{direction:ltr;display:grid;grid-template-columns:repeat(var(--gm-cols,3),minmax(0,1fr));gap:var(--gm-gap,16px);height:var(--gm-h,720px);overflow:hidden;position:relative;
 -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 var(--gm-fade,8%),#000 calc(100% - var(--gm-fade,8%)),transparent 100%);
 mask-image:linear-gradient(180deg,transparent 0,#000 var(--gm-fade,8%),#000 calc(100% - var(--gm-fade,8%)),transparent 100%)}
@media (max-width:767px){.gm{height:var(--gm-h-m,520px)}}
.gm-col{position:relative;overflow:hidden;height:100%;min-width:0}
.gm-track{display:flex;flex-direction:column;will-change:transform;backface-visibility:hidden}
.gm-track.is-ready{animation:gm-scroll var(--gm-dur,30s) linear infinite}
.gm-col[data-dir="down"] .gm-track.is-ready{animation-direction:reverse}
.gm--pause:hover .gm-track{animation-play-state:paused}
.gm-group{display:flex;flex-direction:column;flex:none}
.gm-tile{display:block;flex:none;position:relative;overflow:hidden;line-height:0;margin:0 0 var(--gm-gap,16px);
 border-radius:var(--gm-radius,14px);aspect-ratio:var(--gm-ratio,4/5);transform:translateZ(0);text-decoration:none;box-shadow:none;border:0}
.gm-img{display:block;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.gm-tile:hover .gm-img{transform:scale(1.05)}
@media (hover:hover) and (pointer:fine){.gm-tile{cursor:none}}
@keyframes gm-scroll{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,calc(var(--gm-dist,50%)*-1),0)}}
@media (prefers-reduced-motion:reduce){.gm-track.is-ready{animation:none}}

/* ===== Expand cursor ===== */
.gm-cursor{position:fixed;left:0;top:0;width:92px;height:92px;margin:-46px 0 0 -46px;border-radius:50%;
 background:#fff;color:#111;display:flex;align-items:center;justify-content:center;
 font:600 13px/1 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;letter-spacing:.04em;
 pointer-events:none;z-index:99990;opacity:0;transform:translate3d(-200px,-200px,0) scale(0);
 box-shadow:0 8px 30px rgba(0,0,0,.25);will-change:transform}
.gm-cursor.is-on{opacity:1}
@media (hover:none),(pointer:coarse){.gm-cursor{display:none}}

/* ===== Lightbox ===== */
.gm-lb{position:fixed;inset:0;z-index:99999;display:flex;flex-direction:column;direction:ltr;
 background:var(--lb-overlay,#08080a);color:var(--lb-text,#fff);
 opacity:0;visibility:hidden;transition:opacity .3s ease,visibility 0s linear .3s;
 font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
.gm-lb.is-open{opacity:1;visibility:visible;transition:opacity .3s ease}
.gm-lb-stage{position:relative;flex:1 1 auto;min-height:0}
.gm-lb-img{position:absolute;left:96px;right:96px;top:84px;bottom:24px;width:calc(100% - 192px);height:calc(100% - 108px);
 object-fit:contain;opacity:0;transform:scale(.97);transition:opacity .35s ease,transform .45s cubic-bezier(.2,.7,.2,1);user-select:none;-webkit-user-drag:none}
.gm-lb-img.is-in{opacity:1;transform:none}
.gm-lb-count{position:absolute;top:34px;left:40px;font-size:14px;letter-spacing:.12em;opacity:.7;font-variant-numeric:tabular-nums}
.gm-lb-btn{position:absolute;display:flex;align-items:center;justify-content:center;width:52px;height:52px;padding:0;border-radius:50%;
 color:#fff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);
 -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);cursor:pointer;z-index:3;
 transition:background .25s,color .25s,transform .35s cubic-bezier(.2,.7,.2,1),border-color .25s;outline:none}
.gm-lb-btn:hover,.gm-lb-btn:focus-visible{background:#fff;color:#111;border-color:#fff}
.gm-lb-close{top:22px;right:28px}
.gm-lb-close:hover{transform:rotate(90deg)}
.gm-lb-close i{position:absolute;width:20px;height:2px;border-radius:2px;background:currentColor}
.gm-lb-close i:first-child{transform:rotate(45deg)}
.gm-lb-close i:last-child{transform:rotate(-45deg)}
.gm-lb-prev,.gm-lb-next{top:50%;margin-top:-26px}
.gm-lb-prev{left:22px}
.gm-lb-next{right:22px}
.gm-lb-prev:hover{transform:translateX(-3px)}
.gm-lb-next:hover{transform:translateX(3px)}
.gm-lb-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.gm-lb-bar{flex:none;display:flex;align-items:center;justify-content:space-between;gap:32px;min-height:104px;padding:22px 40px;
 background:var(--lb-bar,#121214);border-top:1px solid rgba(255,255,255,.08)}
.gm-lb-logo{order:1;display:block;width:auto;max-width:200px;height:var(--lb-logo-h,34px);object-fit:contain}
.gm-lb-info{order:2;flex:0 0 62%;max-width:62%;margin-left:auto}
.gm-lb-date{font-size:12px;letter-spacing:.14em;text-transform:uppercase;opacity:.55;margin-bottom:6px}
.gm-lb-text{font-size:17px;line-height:1.7;white-space:pre-line;overflow-wrap:anywhere}
.gm-lb-date:empty,.gm-lb-text:empty{display:none}
.gm-lb.single .gm-lb-prev,.gm-lb.single .gm-lb-next,.gm-lb.single .gm-lb-count{display:none}
body.gm-lock{overflow:hidden}
@media (max-width:767px){
 .gm-lb-img{left:12px;right:12px;top:78px;bottom:12px;width:calc(100% - 24px);height:calc(100% - 90px)}
 .gm-lb-close{top:14px;right:14px;width:46px;height:46px}
 .gm-lb-count{top:28px;left:20px}
 .gm-lb-prev,.gm-lb-next{top:auto;bottom:16px;margin:0;width:44px;height:44px}
 .gm-lb-prev{left:16px}.gm-lb-next{right:16px}
 .gm-lb-bar{flex-direction:column-reverse;align-items:stretch;gap:14px;padding:16px 20px;min-height:0}
 .gm-lb-info{flex:none;max-width:100%}
 .gm-lb-text{font-size:15px}
 .gm-lb-logo{height:calc(var(--lb-logo-h,34px)*.8)}
}

/* Project gallery: all related images in one scrollable dialog. */
.gm-lb{overflow-y:auto;overscroll-behavior:contain;height:100dvh}
.gm-lb-stage{flex:none;min-height:180px;padding:88px 30px 24px}
.gm-lb-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.gm-lb-grid img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;border-radius:12px;background:rgba(255,255,255,.025)}
.gm-lb-prev,.gm-lb-next,.gm-lb-count{display:none!important}
.gm-lb-close{position:fixed;z-index:5}
.gm-lb-bar{margin-top:auto}
@media(max-width:1100px){.gm-lb-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:767px){.gm-lb-stage{padding:76px 16px 20px}.gm-lb-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}
@media(max-width:420px){.gm-lb-grid{grid-template-columns:1fr}}

/* Hold the hovered column still while browsing with the mouse wheel. */
@media (hover:hover) and (pointer:fine){.gm-col:hover .gm-track.is-ready{animation-play-state:paused}}
.gm-col:focus-within .gm-track.is-ready{animation-play-state:paused}

/* Horizontal projects: each saved column becomes an independently moving row. */
.gm--horizontal{display:flex;flex-direction:column;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--gm-fade,8%),#000 calc(100% - var(--gm-fade,8%)),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 var(--gm-fade,8%),#000 calc(100% - var(--gm-fade,8%)),transparent 100%)}
.gm--horizontal .gm-col{flex:1 1 0;min-height:0;width:100%}
.gm--horizontal .gm-track{flex-direction:row;height:100%;width:max-content}
.gm--horizontal .gm-group{flex-direction:row;height:100%;width:max-content}
.gm--horizontal .gm-tile{height:100%;width:auto;min-width:0;margin:0 var(--gm-gap,16px) 0 0}
.gm--horizontal .gm-tile .gm-img{width:100%!important;height:100%!important}
.gm--horizontal .gm-track.is-ready{animation-name:gm-scroll-x}
@keyframes gm-scroll-x{from{transform:translate3d(0,0,0)}to{transform:translate3d(calc(var(--gm-dist,50%)*-1),0,0)}}

.gm--horizontal .gm-group{align-items:stretch}
