/* swipeable showcase rail, gallery wall, student band, guru section, lightbox, marquee */

/* marquee strip under the hero */
.marquee{overflow:hidden;border-block:1px solid rgba(217,164,65,.2);padding:16px 0;background:var(--bg)}
.marquee div{display:flex;gap:44px;width:max-content;animation:slide 38s linear infinite;
  font-family:var(--serif);font-style:italic;font-size:24px;color:var(--gold2);white-space:nowrap}
.marquee span::after{content:"\2726";margin-left:44px;color:var(--gold);font-style:normal;font-size:14px}
@keyframes slide{to{transform:translateX(-50%)}}

/* showcase rail: swipe on phone, arrows on desktop */
.rail-wrap{position:relative;margin-top:10px}
.rail{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 24px 24px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.rail::-webkit-scrollbar{display:none}
.slide{flex:0 0 min(74vw,330px);scroll-snap-align:center;position:relative;cursor:zoom-in;overflow:hidden;border:1px solid rgba(217,164,65,.25);background:#000}
.slide img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block;transition:transform .8s}
.slide:hover img{transform:scale(1.05)}
.slide figcaption{position:absolute;left:0;right:0;bottom:0;padding:48px 18px 16px;
  background:linear-gradient(transparent,rgba(15,8,24,.92));font-family:var(--serif);font-size:24px;color:var(--gold2)}
.rail-btn{display:none}
@media(min-width:900px){
  .rail{padding-left:max(24px,calc((100vw - 1120px)/2 + 24px))}
  .rail-btn{display:grid;place-items:center;position:absolute;top:calc(50% - 30px);width:52px;height:52px;border-radius:50%;
    background:rgba(15,8,24,.85);border:1px solid var(--gold);color:var(--gold2);font-size:20px;cursor:pointer;z-index:3;transition:.3s}
  .rail-btn:hover{background:var(--gold);color:#150a22}
  .rail-btn.prev{left:20px}.rail-btn.next{right:20px}
}

/* gallery wall */
.wall{columns:2;column-gap:12px;margin-top:10px}
.wall figure{break-inside:avoid;margin-bottom:12px;overflow:hidden;cursor:zoom-in;border:1px solid rgba(217,164,65,.15);background:#000}
.wall img{width:100%;height:auto;display:block;transition:transform .8s,opacity .4s}
.wall figure:hover img{transform:scale(1.04)}
@media(min-width:760px){.wall{columns:3;column-gap:16px}.wall figure{margin-bottom:16px}}

/* students band */
.band{position:relative;min-height:440px;display:grid;place-items:center;text-align:center;overflow:hidden;padding:0}
.band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.band::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(15,8,24,.55),rgba(15,8,24,.88))}
.band blockquote{position:relative;z-index:2;padding:0 28px;max-width:760px;font-family:var(--serif);font-weight:300;font-style:italic;
  font-size:clamp(30px,5vw,56px);line-height:1.15}
.band cite{display:block;margin-top:18px;font-style:normal;font-family:var(--sans);font-size:11px;letter-spacing:.4em;text-transform:uppercase;color:var(--gold)}

/* guru section */
.guru{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.duo-photos{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
.duo-photos img{width:100%;height:auto;display:block;border:1px solid rgba(217,164,65,.3)}
.duo-photos img:nth-child(2){margin-top:44px}
.guru p{color:var(--mute);margin-bottom:18px}
@media(max-width:900px){.guru{grid-template-columns:1fr;gap:40px}}

/* lightbox (js/lightbox.js) */
.lb{position:fixed;inset:0;z-index:100;background:rgba(8,4,14,.96);display:none;align-items:center;justify-content:center;touch-action:pan-y}
.lb.on{display:flex}
.lb img{max-width:94vw;max-height:88vh;object-fit:contain;animation:lbin .35s ease}
@keyframes lbin{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
.lb button{position:absolute;background:none;border:0;color:var(--gold2);font-size:30px;cursor:pointer;width:56px;height:56px}
.lb .x{top:10px;right:10px}.lb .p{left:6px;top:calc(50% - 28px)}.lb .n{right:6px;top:calc(50% - 28px)}
.lb .count{position:absolute;bottom:18px;left:0;right:0;text-align:center;font-size:11px;letter-spacing:.3em;color:var(--mute)}
@media(max-width:899px){.lb .p,.lb .n{display:none}}
