.hero{position:relative;min-height:100vh;min-height:100svh;width:100%;display:flex;flex-direction:column;align-items:center;overflow:hidden;background:var(--black);padding:0}
#tsparticles{position:absolute;inset:0;z-index:4;pointer-events:none}
.logo{position:fixed;top:clamp(14px,2.5vh,30px);left:50%;z-index:10008;display:flex;align-items:center;justify-content:center;width:min(28vw,214px);margin:0;flex-shrink:0;opacity:0;transform:translate3d(-50%,0,0);transition:opacity 1.4s cubic-bezier(.22,1,.36,1),transform 1.4s cubic-bezier(.22,1,.36,1);user-select:none;will-change:opacity,transform;pointer-events:none}
.logo-mark{display:block;width:100%;height:auto;filter:drop-shadow(0 0 18px rgba(255,255,255,.08))}
.cover-frame{position:relative;z-index:3;flex:1;display:flex;align-items:flex-start;justify-content:center;width:100%;min-height:100vh;min-height:100svh;padding:0 0 clamp(18px,2.6vh,34px);margin-top:0}
.cover-inner{position:relative;width:min(78vw,760px);aspect-ratio:2/3;min-height:min(74vh,920px);max-width:760px;overflow:visible;transform-origin:50% 0%;will-change:transform;transition:transform .12s linear}
.cover-image{position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse at 50% 40%,#a01010 0%,#6b0000 35%,#350000 60%,#0a0000 85%);filter:none;opacity:0;transition:opacity .01s linear}
.cover-loom-canvas{position:absolute;inset:0;z-index:2;display:block;width:100%;height:100%;opacity:0;pointer-events:none;will-change:opacity;transition:opacity .01s linear}
.cover-vignette{position:absolute;inset:0;z-index:3;pointer-events:none;background:radial-gradient(ellipse 96% 88% at 50% 34%,transparent 68%,rgba(0,0,0,.42) 80%,rgba(0,0,0,.82) 92%,rgba(0,0,0,.98) 100%);opacity:1}
.cover-image::before,.cover-image::after{display:none}
.hero-buttons{position:absolute;bottom:clamp(100px,14.5vh,164px);left:50%;transform:translateX(-50%);z-index:5;display:flex;flex-direction:column;align-items:center;gap:12px;opacity:0;transition:opacity 1.4s cubic-bezier(.22,1,.36,1),transform .12s linear;will-change:opacity,transform}
.hero-buttons-row{display:flex;gap:10px}
.btn-subscribe-hero{background:transparent;color:var(--light);border:1px solid rgba(255,255,255,.12);font-size:.65rem;padding:13px 0;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);width:max(280px,calc(100% + 40px));max-width:380px;text-align:center;line-height:1.5;letter-spacing:.08em}
.btn-subscribe-hero .cta-action{display:block;font-size:.78rem;font-weight:500;letter-spacing:.14em;color:var(--bright)}
.btn-subscribe-hero:hover{border-color:var(--blood);box-shadow:0 0 30px rgba(139,0,0,.2);transform:translateY(-1px)}
@supports not(backdrop-filter:blur(4px)){.btn-latest,.btn-subscribe-hero{background:rgba(20,20,20,.85)}}
.hero.hero-ready.hero-loom-ready .cover-image{filter:none;opacity:1 !important}
.hero.hero-loom-ready .cover-loom-canvas{opacity:1}
.hero.hero-ready .logo{transform:translate3d(-50%,0,0)}
@media(min-width:701px) and (max-height:980px){.logo{top:clamp(12px,2vh,22px);width:min(24vw,188px)}.cover-frame{padding-bottom:clamp(28px,5vh,56px)}.cover-inner{width:min(74vw,700px);min-height:min(70vh,800px);max-width:700px}.hero-buttons{position:fixed;bottom:calc(20px + var(--sab));gap:10px;transition:opacity 1.4s cubic-bezier(.22,1,.36,1),transform .12s linear}.hero-buttons-row{gap:8px}.hero-buttons-row .btn{padding:10px 24px;font-size:.76rem}.btn-subscribe-hero{max-width:340px;padding:12px 0;font-size:.62rem}.btn-subscribe-hero .cta-action{font-size:.74rem}}
@media(min-width:701px) and (max-height:820px){.logo{top:clamp(10px,1.6vh,18px);width:min(22vw,164px)}.cover-frame{padding-bottom:clamp(34px,6vh,72px)}.cover-inner{width:min(70vw,620px);min-height:min(62vh,660px);max-width:620px}.hero-buttons{position:fixed;bottom:calc(16px + var(--sab));gap:9px;transition:opacity 1.4s cubic-bezier(.22,1,.36,1),transform .1s linear}.hero-buttons-row{gap:7px}.hero-buttons-row .btn{padding:9px 22px;font-size:.72rem}.btn-subscribe-hero{max-width:308px;padding:11px 0;font-size:.6rem}.btn-subscribe-hero .cta-action{font-size:.7rem}}@media(max-width:700px){.hero{min-height:calc(100svh + 18vh)}#tsparticles{inset:0}.cover-frame{min-height:calc(100svh + 18vh);padding:0 0 clamp(18vh,20vh,24vh)}.cover-inner{width:min(108vw,1080px);min-height:min(88vh,1080px)}.hero-buttons{bottom:calc(clamp(128px,19vh,168px) + var(--sab))}.hero-buttons-row .btn{padding:10px 22px;font-size:.75rem}.btn-subscribe-hero{max-width:300px}.logo{width:min(40vw,176px);top:calc(18px + var(--sat))}}
@media(max-width:600px){.cover-frame{margin-top:0;padding-bottom:clamp(18vh,21vh,26vh)}.cover-inner{min-height:min(90vh,1100px)}.hero-buttons{bottom:calc(clamp(138px,20vh,178px) + var(--sab))}}