/* Signal Ridge Design: shared cinematic motion layer */
.sw{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .02em .12em;margin:0 -.02em -.12em}
.swi{display:inline-block}

/* film intro: letterbox bars that open on load */
.lb{position:fixed;left:0;right:0;height:14vh;background:#000;z-index:10000;pointer-events:none;transition:transform 1.5s cubic-bezier(.77,0,.18,1) .2s}
.lb.t{top:0;transform-origin:top}.lb.b{bottom:0;transform-origin:bottom}
html.cine-go .lb{transform:scaleY(0)}

/* hero slideshow with slow camera moves */
[data-slides]{position:absolute;inset:0;overflow:hidden;z-index:-3;background:#000}
[data-slides] img,[data-slides] video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.2) translate3d(var(--px,0),var(--py,0),0);transition:opacity 2.2s ease,transform 9s cubic-bezier(.25,.6,.3,1);will-change:transform,opacity}
[data-slides] img.on,[data-slides] video.on{opacity:1;transform:scale(1.03) translate3d(0,0,0)}
.slide-cap{position:absolute;right:clamp(1rem,4vw,3rem);top:96px;z-index:3;display:flex;align-items:center;gap:.6em;font:600 .72rem/1.4 system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#fff;padding:.6em 1em;border-radius:99px;background:rgba(0,0,0,.45);backdrop-filter:blur(8px);opacity:0;transform:translateY(8px);transition:.6s ease}
.slide-cap.in{opacity:1;transform:none}
.slide-cap::before{content:"";width:8px;height:8px;border-radius:50%;background:#F5A524;box-shadow:0 0 10px #F5A524}
.slide-dots{position:absolute;left:50%;bottom:18px;translate:-50% 0;z-index:3;display:flex;gap:8px}
.slide-dots i{width:26px;height:3px;border-radius:3px;background:rgba(255,255,255,.35);overflow:hidden;position:relative}
.slide-dots i.on::after{content:"";position:absolute;inset:0;background:#fff;transform-origin:left;animation:dotfill var(--dur,5.5s) linear forwards}
@keyframes dotfill{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* film grain over heroes */
.grain{position:absolute;inset:-50%;z-index:-1;pointer-events:none;opacity:.08;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-5%,3%)}40%{transform:translate(3%,-4%)}60%{transform:translate(-2%,5%)}80%{transform:translate(4%,2%)}100%{transform:translate(0,0)}}

/* side-swipe galleries */
[data-hscroll]{overflow:hidden}
[data-track]{display:flex;gap:clamp(.9rem,1.6vw,1.4rem);width:max-content;will-change:transform}
[data-track]>*{flex:none}
.hbar{display:flex;align-items:center;gap:1rem;margin-top:1.4rem}
.hprog{flex:1;height:3px;border-radius:3px;background:rgba(127,127,127,.28);overflow:hidden}
.hprog i{display:block;height:100%;background:currentColor;transform-origin:left;transform:scaleX(.08)}
.harrows{display:flex;gap:.5rem}
.harrows button{width:46px;height:46px;border-radius:50%;border:1.5px solid currentColor;background:transparent;color:inherit;cursor:pointer;display:grid;place-items:center;opacity:.85}
.harrows button:hover{opacity:1}
.harrows svg{width:18px;height:18px}
.swipe-hint{display:none;font:600 .72rem/1.4 system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;opacity:.7}
@media (max-width:820px){
  [data-hscroll]{overflow:visible}
  [data-track]{width:auto;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px;margin:0 calc(-1 * var(--hpad,1.15rem));padding-left:var(--hpad,1.15rem);padding-right:var(--hpad,1.15rem);scroll-padding:0 var(--hpad,1.15rem)}
  [data-track]::-webkit-scrollbar{display:none}
  [data-track]>*{scroll-snap-align:start}
  .swipe-hint{display:inline-flex;align-items:center;gap:.5em}
  .swipe-hint::after{content:"→";animation:nudge 1.4s ease-in-out infinite}
}
@keyframes nudge{50%{transform:translateX(6px)}}

/* zoom-through scene */
.zoom{position:relative;background:#000;color:#fff}
.zoom__stage{position:relative;height:100svh;overflow:hidden;display:grid;place-items:center;text-align:center}
.zoom__stage>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.zoom__stage::after{content:"";position:absolute;inset:0;background:radial-gradient(70% 60% at 50% 50%,rgba(0,0,0,.25),rgba(0,0,0,.7))}
.zoom__txt{position:relative;z-index:2;padding:0 1.2rem;width:min(1050px,100%)}

/* scroll-linked image reveal */
[data-wipe]{will-change:clip-path}

/* type safety on small screens */
@media (max-width:600px){h1,h2{line-height:1.02!important}}
@media (prefers-reduced-motion:reduce){
  [data-slides] img,[data-slides] video{transform:none!important}
  .grain,.lb{display:none}
}
@media (max-width:600px){.slide-cap{top:84px;font-size:.62rem}}
