:root{--ink:#f1eee8;--ember:#f18a70;--max:1180px}
*{box-sizing:border-box}
html{min-height:100%;background:#050403;scroll-behavior:smooth;scroll-snap-type:y mandatory}
body{min-height:100%;margin:0;overflow-x:hidden;background:#050403;color:var(--ink);font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300;letter-spacing:.02em}
main{position:relative;z-index:10}.section-shell{width:min(var(--max),calc(100% - 48px));margin-inline:auto}.snap-screen{height:100svh;min-height:100svh;overflow:hidden;scroll-snap-align:start;scroll-snap-stop:always}

/* Background / CRT */
.background{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:#080605}
.background-image{position:absolute;inset:-3%;width:106%;height:106%;z-index:0;background:url("assets/back.webp") center/cover no-repeat;filter:brightness(.40) contrast(1.22) saturate(.66) sepia(.08);transform:scale(1.035);will-change:transform,filter}
#analogFx{position:absolute;inset:0;z-index:6;width:100%;height:100%;opacity:.92;pointer-events:none}
.crt-darken,.vignette,.film-burn,.scanlines,.noise,.tracking-line{position:absolute;inset:0;pointer-events:none}
.crt-darken{z-index:1;background:linear-gradient(180deg,rgba(5,7,8,.17),rgba(5,2,2,.31)),radial-gradient(ellipse at center,transparent 15%,rgba(0,0,0,.15) 58%,rgba(0,0,0,.62) 115%)}
.vignette{z-index:2;background:radial-gradient(ellipse at center,transparent 18%,rgba(0,0,0,.10) 48%,rgba(0,0,0,.62) 120%)}
.film-burn{z-index:3;opacity:.11;mix-blend-mode:screen;background:radial-gradient(ellipse at 12% 22%,rgba(255,60,15,.34),transparent 20%),radial-gradient(ellipse at 84% 68%,rgba(255,120,30,.18),transparent 18%);animation:burn 8s ease-in-out infinite alternate}
.scanlines{z-index:4;opacity:.22;mix-blend-mode:overlay;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.025) 0 1px,rgba(0,0,0,.18) 1px 3px,transparent 3px 5px)}
.noise{z-index:5;opacity:.055;mix-blend-mode:screen;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.72'/%3E%3C/svg%3E");animation:grain .22s steps(2) infinite}
.tracking-line{top:-12%;bottom:auto;z-index:7;height:9%;opacity:0;background:linear-gradient(to bottom,transparent,rgba(255,255,255,.065),rgba(0,0,0,.09),transparent);mix-blend-mode:overlay}
.crt-jump .background-image{transform:scale(1.045) translate3d(var(--tear,5px),var(--tear-y,0),0);filter:brightness(.43) contrast(1.3) saturate(.62)}

/* Fixed logo */
.site-header{position:fixed;top:12px;left:0;right:0;z-index:40;display:flex;justify-content:center;pointer-events:none}
.header-logo{width:30px;height:52px;object-fit:contain;filter:drop-shadow(0 0 12px rgba(255,255,255,.12))}

/* Screen 1 */
.hero{display:flex;align-items:center;justify-content:center;padding:72px 0 24px;text-align:center}
.hero-content{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;gap:34px}
.hero-copy{width:100%;max-width:900px;margin:0 auto}
.hero-line{margin:0 auto;color:#d8d1c9;font-size:clamp(12px,1vw,15px);font-weight:300;line-height:1.5;letter-spacing:.04em}
.descienda-fire{margin:8px 0 0;color:var(--ember);font-size:clamp(17px,1.6vw,24px);font-weight:200;line-height:1;letter-spacing:.13em;text-transform:uppercase}
.bandcamp-frame{flex:0 0 350px;width:350px;height:350px;overflow:hidden}
.bandcamp-frame iframe{display:block;width:350px!important;height:350px!important;border:0}

/* Text glitch */
.glitch-text{position:relative;isolation:isolate}
.glitch-text::before,.glitch-text::after{content:attr(data-text);position:absolute;inset:0;opacity:0;pointer-events:none;white-space:pre-wrap}
.glitch-text.vhs-glitch::before{opacity:.62;color:#ff3a27;transform:translate(6px,-1px);clip-path:polygon(0 11%,100% 11%,100% 32%,0 32%,0 69%,100% 69%,100% 76%,0 76%);mix-blend-mode:screen}
.glitch-text.vhs-glitch::after{opacity:.5;color:#48d4d8;transform:translate(-5px,2px);clip-path:polygon(0 38%,100% 38%,100% 55%,0 55%,0 82%,100% 82%,100% 91%,0 91%);mix-blend-mode:screen}
.vhs-glitch{animation:vhsTextJolt .18s steps(2,end)}

/* Screen 2 */
.album{display:flex;align-items:center;justify-content:center;padding:70px 0 30px}
.statement{width:min(690px,calc(100% - 48px));margin:0 auto;color:#d1cbc4;font-size:clamp(13px,1.05vw,15px);line-height:1.58;text-align:justify;text-justify:inter-word;text-shadow:0 1px 12px #000}
.statement p{margin:0 0 15px}.statement p:last-child{margin-bottom:0}

/* Screen 3 */
.final-screen{display:flex;flex-direction:column;justify-content:center;padding:72px 0 18px}
.members{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:min(980px,calc(100% - 48px));height:min(47vh,440px);margin:0 auto 22px;padding:0}
.member-card{position:relative;overflow:hidden;background:#080808;border:1px solid rgba(255,120,90,.16)}
.member-card img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.06);filter:saturate(.9) contrast(1.08);transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .5s ease}
.member-overlay{position:absolute;inset:0;display:flex;align-items:flex-end;padding:34px;opacity:0;transform:translateY(10px);background:linear-gradient(to top,rgba(0,0,0,.93),rgba(0,0,0,.08) 70%);transition:.45s ease}
.member-overlay p{width:100%;margin:0;color:#d7d0ca;font-size:.75rem;line-height:1.55;text-align:center}
.member-card:hover img,.member-card:focus-within img{transform:scale(1.095);filter:saturate(.62) contrast(1.12) brightness(.38)}
.member-card:hover .member-overlay,.member-card:focus-within .member-overlay{opacity:1;transform:none}

/* Footer */
.footer{margin-top:auto;padding:0;text-align:center}.socials{display:flex;justify-content:center;gap:26px}
.socials a{display:grid;place-items:center;width:28px;height:28px;color:#fff;opacity:.82;transition:opacity .25s ease,transform .25s ease}
.socials a:hover,.socials a:focus-visible{color:#fff;opacity:1;transform:translateY(-2px)}
.socials svg{display:block;width:100%;height:100%;fill:currentColor}
.bandcamp-icon{display:block;width:24px;height:24px;object-fit:contain}
.copyright{margin:12px 0 2px;color:#7d7771;font-size:11px;letter-spacing:.18em;text-transform:uppercase}

@keyframes grain{0%{transform:translate(0)}25%{transform:translate(-1.5%,1%)}50%{transform:translate(1%,-1.5%)}75%{transform:translate(1.2%,1%)}100%{transform:translate(-1%,-1%)}}
@keyframes burn{from{transform:translate3d(-2%,0,0) scale(1.03);opacity:.1}to{transform:translate3d(2%,-1%,0) scale(1.08);opacity:.23}}
@keyframes vhsTextJolt{0%,100%{transform:none;filter:none}20%{transform:translateX(-4px) skewX(-1.5deg);filter:contrast(1.3)}45%{transform:translateX(5px)}65%{transform:translateX(-2px) skewX(1deg)}80%{transform:translateX(2px)}}

@media(max-height:760px) and (min-width:801px){.hero{padding-top:66px;padding-bottom:14px}.hero-content{gap:22px}.statement{font-size:12px;line-height:1.45}.statement p{margin-bottom:10px}.members{height:43vh;margin-bottom:14px}}
@media(max-width:800px){.section-shell{width:calc(100% - 28px)}.site-header{top:9px}.header-logo{width:25px;height:43px}.hero{padding:58px 14px 14px}.hero-content{gap:24px}.hero-line{font-size:12px;line-height:1.45;letter-spacing:.025em}.descienda-fire{margin-top:7px;font-size:clamp(16px,4.8vw,21px);letter-spacing:.10em}.bandcamp-frame{flex-basis:min(350px,calc(100vw - 28px));width:min(350px,calc(100vw - 28px));height:min(350px,calc(100vw - 28px))}.bandcamp-frame iframe{width:350px!important;height:350px!important}.album{padding:62px 0 20px}.statement{width:calc(100% - 44px);font-size:12px;line-height:1.46}.statement p{margin-bottom:10px}.final-screen{justify-content:flex-start;padding:62px 0 12px}.members{grid-template-columns:repeat(3,1fr);width:calc(100% - 24px);height:42vh;gap:4px;margin-bottom:12px}.member-overlay{padding:12px}.member-overlay p{font-size:10px;line-height:1.35}.socials{gap:16px}.copyright{margin-top:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}#analogFx,.film-burn,.noise{display:none}}
