/* (c) 2026 Jennifer K. Mellen - GenM Software. Jen's lightning photographs: mat-and-frame prints. */
.jp-frame{margin:34px auto;max-width:760px;transform:rotate(var(--jp-tilt,0deg));transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.jp-open{display:block;color:inherit;text-decoration:none;border-radius:6px}
.jp-open:focus-visible{outline:2px solid var(--cyan);outline-offset:6px}
.jp-mat{display:block;position:relative;overflow:hidden;padding:clamp(10px,2.2vw,22px);border-radius:6px;
  background:linear-gradient(160deg,#0F1B3D,#050B1E 70%);border:1px solid rgba(71,231,249,.28);
  box-shadow:0 0 0 1px rgba(5,11,30,.9),0 0 22px -6px rgba(61,139,255,.55),0 0 46px -18px rgba(71,231,249,.5),0 28px 60px -28px rgba(0,0,0,.85)}
/* the one strike-yellow accent: a corner tick on each print */
.jp-mat::before{content:"";position:absolute;top:7px;right:7px;width:12px;height:12px;z-index:1;
  border-top:2px solid var(--strike);border-right:2px solid var(--strike)}
/* hover: a single electric sweep across the mat */
.jp-mat::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;
  background:linear-gradient(115deg,transparent 44%,rgba(71,231,249,.35) 50%,transparent 56%);background-size:300% 100%;background-position:120% 0}
.jp-print{display:block;overflow:hidden;border-radius:2px;background:#050B1E;box-shadow:0 0 0 1px rgba(255,255,255,.08)}
.jp-print picture,.jp-print img{display:block;width:100%;height:100%;object-fit:cover}
.jp-cap{margin-top:10px;text-align:center;font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.08em}
.jp-credit{color:var(--muted);text-decoration:none;border-bottom:1px solid transparent}
.jp-credit:hover,.jp-credit:focus-visible{color:var(--cyan);border-bottom-color:var(--cyan)}
@media (hover:hover){
  .jp-frame:hover{transform:rotate(0deg) translateY(-4px)}
  .jp-frame:hover .jp-mat{border-color:rgba(71,231,249,.6)}
  .jp-frame:hover .jp-mat::after{animation:jp-flash .9s ease-out 1}
}
@keyframes jp-flash{0%{opacity:1;background-position:120% 0}100%{opacity:0;background-position:-20% 0}}
.jp-story{max-width:720px}
.jp-feature{max-width:820px}
/* print wall */
.jp-wall-wrap{margin:64px 0 24px}
.jp-wall{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:clamp(18px,3vw,34px);margin-top:22px;align-items:start}
.jp-wall .jp-frame{margin:0;max-width:none}
.jp-wall .jp-mat{padding:clamp(8px,1.4vw,14px)}
@media (max-width:560px){ .jp-frame{transform:none} }
@media (prefers-reduced-motion:reduce){
  .jp-frame,.jp-frame:hover{transition:none;transform:none}
  .jp-frame:hover .jp-mat::after{animation:none}
}
/* lightbox */
.jp-lb{border:0;padding:0;margin:auto;max-width:96vw;max-height:96vh;background:transparent;color:#EAF1FF;overflow:visible}
.jp-lb::backdrop{background:rgba(5,11,30,.93)}
.jp-lb-fig{margin:0;display:flex;flex-direction:column;align-items:center;gap:10px}
.jp-lb img{display:block;max-width:min(96vw,1600px);max-height:calc(96vh - 60px);width:auto;height:auto;border-radius:3px;
  box-shadow:0 0 0 1px rgba(71,231,249,.35),0 0 40px -10px rgba(61,139,255,.6)}
.jp-lb-cap{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.08em;text-align:center}
.jp-lb-cap .jp-credit{color:#9AA8C7}
.jp-lb button{position:fixed;z-index:2;background:rgba(15,27,61,.85);color:#EAF1FF;border:1px solid rgba(71,231,249,.4);border-radius:999px;
  width:46px;height:46px;font-size:24px;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0}
.jp-lb button[hidden]{display:none}
.jp-lb button:hover{border-color:#F7F160;color:#F7F160}
.jp-lb button:focus-visible{outline:2px solid #47E7F9;outline-offset:2px}
.jp-lb-x{top:14px;right:14px}
.jp-lb-prev{left:12px;top:50%;margin-top:-23px}
.jp-lb-next{right:12px;top:50%;margin-top:-23px}
.jp-lb-count{position:fixed;top:26px;left:18px;font-family:"IBM Plex Mono",monospace;font-size:12px;color:#9AA8C7}