/* Spark Projects Gallery — scoped to .spg-wrap so the theme is unaffected */
.spg-wrap,.spg-wrap *,.spg-wrap *::before,.spg-wrap *::after{box-sizing:border-box}
.spg-wrap{
  --red:#C8102E;--og:#FF6B00;--g1:#f4f4f4;--g2:#e8e8e8;--mu:#6b7280;--px:28px;
  font-family:'Inter',system-ui,sans-serif;background:#fff;color:#111;-webkit-font-smoothing:antialiased;overflow-x:hidden
}
.spg-wrap h1,.spg-wrap h2,.spg-wrap p{margin:0;padding:0}

.spg-wrap .page-hero{position:relative;padding:52px 40px 20px;border-bottom:1px solid var(--g2);opacity:0;transform:translateY(18px);animation:spgFadeUp .7s cubic-bezier(.2,.8,.2,1) .05s forwards;overflow:hidden;display:flex;align-items:center}
.spg-wrap .hero-inner{position:relative;z-index:2}
.spg-wrap .lbl{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:10px}
.spg-wrap .lbl::before{content:'';width:20px;height:2px;background:var(--red);display:block}
.spg-wrap .gallery-title{font-family:'Inter',system-ui,sans-serif;font-size:clamp(30px,7vw,68px);line-height:1;font-weight:900;letter-spacing:-.04em;color:#111}
.spg-wrap .gallery-title .serif{font-family:'Playfair Display',serif;font-style:italic;color:var(--red)}
@keyframes spgFadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

.spg-wrap .filter-bar{display:flex;gap:7px;flex-wrap:wrap;align-items:center;padding:0 var(--px);opacity:0;animation:spgFadeUp .6s cubic-bezier(.2,.8,.2,1) .2s forwards}
.spg-wrap .flbl{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mu);white-space:nowrap}
.spg-wrap .fbtn{padding:6px 15px;border-radius:100px;font-size:11px;font-weight:700;cursor:pointer;border:1.5px solid var(--g2);background:#fff;color:var(--mu);font-family:inherit;line-height:1.4;text-transform:none;letter-spacing:normal;box-shadow:none;transition:all .2s;white-space:nowrap;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.spg-wrap .fbtn:hover,.spg-wrap .fbtn:focus{border-color:var(--red);color:var(--red);background:#fff}
.spg-wrap .fbtn.active{background:var(--red);border-color:var(--red);color:#fff}

.spg-wrap .proj-block{padding:36px var(--px);border-bottom:1px solid var(--g2);opacity:0;transform:translateY(24px);transition:opacity .55s cubic-bezier(.2,.8,.2,1),transform .55s cubic-bezier(.2,.8,.2,1)}
.spg-wrap .proj-block.revealed{opacity:1;transform:none}
.spg-wrap .proj-block.hidden{display:none!important}
.spg-wrap .proj-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 14px;padding-bottom:14px;border-bottom:1px solid var(--g2)}
.spg-wrap .proj-tag{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--red);display:inline-flex;align-items:center;gap:5px;flex-shrink:0}
.spg-wrap .proj-tag::before{content:'';width:12px;height:1.5px;background:var(--red)}
.spg-wrap .proj-name{font-family:'Playfair Display',serif;font-size:clamp(17px,3.5vw,26px);font-weight:700;letter-spacing:-.02em;color:#111;line-height:1.2}

.spg-wrap .img-grid{display:grid;gap:10px;grid-template-columns:repeat(4,1fr)}
.spg-wrap .img-grid:empty{display:none}
.spg-wrap .mi{position:relative;overflow:hidden;border-radius:10px;background:var(--g1);cursor:pointer;aspect-ratio:4/3;-webkit-tap-highlight-color:transparent}
.spg-wrap .mi img{width:100%;height:100%;max-width:none;object-fit:cover;display:block;border-radius:0;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.spg-wrap .mi:hover img{transform:scale(1.06)}
.spg-wrap .mi::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.38) 100%);opacity:0;transition:opacity .3s;pointer-events:none}
.spg-wrap .mi:hover::after{opacity:1}
.spg-wrap .mi::before{content:'';position:absolute;top:0;left:0;width:3px;height:100%;background:linear-gradient(to bottom,var(--red),var(--og));transform:scaleY(0);transform-origin:top;transition:transform .38s cubic-bezier(.2,.8,.2,1);z-index:2;pointer-events:none}
.spg-wrap .mi:hover::before{transform:scaleY(1)}
.spg-wrap .mi.empty-slot{background:transparent!important;cursor:default;pointer-events:none}
.spg-wrap .mi.empty-slot::before,.spg-wrap .mi.empty-slot::after,
.spg-wrap .mi.video-slot::before,.spg-wrap .mi.video-slot::after{display:none!important}
.spg-wrap .mi.video-slot{cursor:default}
.spg-wrap .mi.video-slot video{width:100%;height:100%;object-fit:cover;display:block}

.spg-wrap .proj-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px}
.spg-wrap .chip{padding:4px 11px;border-radius:100px;font-size:10px;font-weight:700;background:rgba(200,16,46,.08);color:var(--red);letter-spacing:.03em;white-space:nowrap}

.spg-wrap .spg-empty{text-align:center;padding:48px var(--px);color:var(--mu);display:none}
.spg-wrap .spg-empty.show{display:block}

/* Lightbox */
.spg-lb{position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.93);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .28s;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.spg-lb.open{opacity:1;pointer-events:all}
.spg-lb .spg-lb-img{max-width:92vw;max-height:84vh;object-fit:contain;border-radius:8px;transform:scale(.92);transition:transform .38s cubic-bezier(.2,.8,.2,1)}
.spg-lb.open .spg-lb-img{transform:scale(1)}
.spg-lb button{padding:0;font-family:inherit;line-height:1;box-shadow:none}
.spg-lb .spg-lb-close{position:fixed;top:14px;right:14px;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.22s;z-index:100000}
.spg-lb .spg-lb-close:hover{background:var(--red,#C8102E);transform:rotate(90deg)}
.spg-lb .spg-lb-nav{position:fixed;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);color:#fff;font-size:17px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.22s;z-index:100000}
.spg-lb .spg-lb-nav:hover{background:var(--red,#C8102E)}
.spg-lb .spg-lb-prev{left:8px}
.spg-lb .spg-lb-next{right:8px}
.spg-lb .spg-lb-counter{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.55);font-size:11px;font-weight:600;letter-spacing:.1em;z-index:100000;white-space:nowrap}

@media(min-width:600px){.spg-wrap{--px:32px}}
@media(min-width:960px){
  .spg-wrap{--px:40px}
  .spg-wrap .page-hero{margin-bottom:32px}
  .spg-wrap .filter-bar{margin-bottom:44px}
  .spg-wrap .fbtn{padding:8px 20px;font-size:12px}
  .spg-wrap .proj-block{padding:52px var(--px)}
  .spg-wrap .img-grid{gap:12px}
}
@media(max-width:899px){
  .spg-wrap .img-grid{grid-template-columns:repeat(2,1fr)}
  .spg-wrap .mi.empty-slot{display:none!important}
}
@media(max-width:700px){
  .spg-wrap .page-hero{padding:20px 20px 10px;margin-bottom:16px}
  .spg-wrap .proj-block{padding:24px var(--px)}
}
@media(max-width:600px){
  .spg-wrap{--px:16px}
  .spg-wrap .img-grid{gap:8px}
}
@media(hover:none){
  .spg-wrap .mi:active img{transform:scale(1.04)}
  .spg-wrap .mi:active::after{opacity:1}
}
@media(prefers-reduced-motion:reduce){
  .spg-wrap .page-hero,.spg-wrap .filter-bar{animation:none;opacity:1;transform:none}
  .spg-wrap .mi img{transition:none}
}
