/* Gallery + footer socials on the home page. Uses the page's own colors. */
.gal-theme{margin-top:40px}
.gal-theme>h3{font-size:24px;margin-bottom:6px}
.gal-class{margin-top:22px}
.gal-class>h4{margin:0 0 10px;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted,#b3c1cd)}
.gal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:860px){.gal-grid{grid-template-columns:repeat(2,1fr)}}
.gal-item{position:relative;aspect-ratio:1;border:2px solid var(--line,#34506b);border-radius:14px;overflow:hidden;background:#0f1824;padding:0;cursor:pointer;transition:opacity .25s,filter .25s,transform .25s,border-color .25s}
.gal-item img{width:100%;height:100%;object-fit:cover;display:block}
.gal-grid:hover .gal-item:not(:hover):not(:focus-visible){opacity:.5;filter:saturate(.6) brightness(.8)}
.gal-item:hover,.gal-item:focus-visible{filter:saturate(1.3) brightness(1.1);transform:scale(1.03);border-color:var(--gold,#f4b740);z-index:1}
.gal-crown{position:absolute;top:8px;right:8px;background:var(--gold,#f4b740);color:#12100e;border-radius:999px;padding:2px 8px;font-size:15px;font-weight:700;line-height:1.3}
.gal-code{position:absolute;left:0;right:0;bottom:0;padding:18px 10px 8px;font:700 13px ui-monospace,Menlo,monospace;color:#fbf3e4;background:linear-gradient(transparent,rgba(0,0,0,.7));text-align:left}
.gal-hof{border:2px solid var(--gold,#f4b740);border-radius:18px;padding:18px;margin-top:34px;background:rgba(244,183,64,.06)}
.gal-hof>h3{margin-bottom:12px}
#gal-view{position:fixed;inset:0;z-index:100;background:rgba(8,12,18,.94);display:none;align-items:center;justify-content:center;padding:20px;flex-direction:column;gap:14px}
#gal-view.open{display:flex}
#gal-stage{position:relative;width:min(92vw,78vh);aspect-ratio:1;perspective:900px}
#gal-stage img{width:100%;height:100%;object-fit:contain;border-radius:12px;filter:brightness(.25) blur(2px);transition:filter 1.6s ease}
#gal-stage.revealed img{filter:none}
#gal-prompt{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:8%;text-align:center;font-family:var(--display,'Bowlby One',sans-serif);font-size:clamp(16px,3.4vw,28px);line-height:1.25;color:#fbf3e4;text-shadow:0 4px 18px #000,0 0 2px #000;transform:translateZ(60px) rotateX(8deg);animation:galFloat 3.6s ease-in-out forwards;pointer-events:none}
#gal-stage.revealed #gal-prompt{opacity:0;animation:none;transition:opacity 1.2s}
@keyframes galFloat{0%{opacity:0;transform:translateZ(0) rotateX(20deg) scale(.92)}20%{opacity:1;transform:translateZ(70px) rotateX(8deg) scale(1)}80%{opacity:1;transform:translateZ(90px) rotateX(4deg) scale(1.03)}100%{opacity:0;transform:translateZ(120px) rotateX(0) scale(1.08)}}
.gal-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;align-items:center;color:#b3c1cd;font-size:15px}
#gal-text{max-width:70ch;text-align:center;color:#fbf3e4;display:none;background:#182a3d;border:1px solid #34506b;border-radius:12px;padding:12px 16px;max-height:22vh;overflow:auto;white-space:pre-wrap}
@media (prefers-reduced-motion:reduce){#gal-prompt{animation:none;opacity:0}#gal-stage img{filter:none;transition:none}.gal-item{transition:none}}
.socials{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.socials a{display:inline-flex;border:1.5px solid var(--line,#34506b);border-radius:999px;padding:6px 14px;color:var(--chalk,#fbf3e4);text-decoration:none;font-weight:700;font-size:14px}
.socials a:hover{border-color:var(--gold,#f4b740);color:var(--gold,#f4b740)}
