/* HELL-MU ETAP 5 — approved gothic scenery, 1600px center and enhanced atmosphere.
   This file intentionally loads after the earlier theme styles. */
:root { --gold:#f0c485; --red:#df1d16; --border:#80503c; }
body { min-width:320px; position:relative; background-color:#080305 !important;
 background-image:linear-gradient(to bottom,rgba(5,2,3,.08) 0,rgba(5,2,3,.08) 350px,rgba(5,2,3,.26) 920px,#090506 1800px),url('../images/hell-scenery-3440.jpg') !important;
 background-repeat:no-repeat,no-repeat !important; background-size:100% 100%,max(100vw,1800px) auto !important;
 background-position:center top,center top !important; overflow-x:hidden;
}
body::before,body::after{content:none!important;display:none!important}
.page-shell{width:min(100%,1680px);max-width:1680px;position:relative;z-index:4;isolation:isolate}
.navigation,.content-grid{width:min(1600px,calc(100% - 32px))!important}
.feature-area,.bottom-promo,footer{max-width:1600px!important}
.content-grid{grid-template-columns:minmax(0,1fr) clamp(268px,21vw,336px)!important;gap:16px!important}
.nav-items{grid-template-columns:repeat(8,minmax(0,1fr));}
.nav-items a{font-size:clamp(11px,.85vw,15px)!important;letter-spacing:.14px;position:relative;overflow:hidden}
.nav-items a::after{content:'';position:absolute;inset:auto 0 0;width:0;height:2px;background:#ff7544;box-shadow:0 0 13px #ff2215;transition:width .26s}
.nav-items a:is(:hover,:focus-visible)::after{width:100%}
.nav-items a:is(:hover,:focus-visible){text-shadow:0 0 12px #ff9c71,0 0 4px #ff4c30}
.navigation:before{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent,#fd3618 25%,#ef9830 55%,#fd3618 80%,transparent);opacity:.5;animation:nav-heat 5s ease-in-out infinite}
@keyframes nav-heat{50%{opacity:1;filter:brightness(1.6)}}
/* logo is an independent transparent visual element, never another page screenshot */
.masthead{height:268px!important;isolation:isolate;background:transparent!important}
.masthead::before{content:'';position:absolute;top:3px;left:50%;width:min(600px,65vw);height:249px;transform:translateX(-50%);pointer-events:none;z-index:0;
 background:url('../images/hell-logo-v5.png') center center/contain no-repeat!important;
 filter:drop-shadow(0 0 11px #b51a0a);animation:logo-heat 6.4s ease-in-out infinite}
@keyframes logo-heat{0%,100%{filter:drop-shadow(0 0 7px #921209)}52%{filter:drop-shadow(0 0 23px #ff4b1266)}68%{filter:drop-shadow(0 0 10px #c40f0a)}}
.masthead-logo{display:none!important}
.masthead-caption{z-index:2;bottom:11px;white-space:nowrap;font-size:10px;letter-spacing:2px}
.header-sidecopy{left:max(22px,6%);top:62px;z-index:2}
.header-tagline{right:8%;top:100px;font-size:clamp(20px,1.5vw,29px);z-index:2}
.utility-bar{top:10px;right:3.7%;z-index:7;gap:8px}
.utility-actions{background:rgba(8,4,5,.94)}
.utility-actions .languages{color:#f4ceab!important}
.utility-actions a{transition:background .25s,color .25s,text-shadow .25s}
.utility-actions a:hover{box-shadow:inset 0 -2px 0 #d73e1d;text-shadow:0 0 9px #f24428}
.hero{height:clamp(300px,22vw,356px);overflow:hidden}
.hero-image{background-image:url('../images/hero.jpg');background-position:center;animation:hero-breathe 15s ease-in-out infinite alternate,hero-light 7s ease-in-out infinite}
@keyframes hero-light{0%,100%{filter:brightness(.94) saturate(1)}50%{filter:brightness(1.13) saturate(1.12)}}
.hero-shade{background:linear-gradient(90deg,#040407de 0%,#070309aa 36%,#0d04043b 70%,transparent 90%)}
.hero-copy{top:14%;left:7%;max-width:65%;text-align:center}
.hero h1{font-size:clamp(27px,2.6vw,43px)}
.hero h1 strong{text-shadow:0 0 13px #b00808,0 2px 8px #000}
.hero .hero-kicker{letter-spacing:2.6px}
.btn-glow,.download-button{position:relative;overflow:hidden;isolation:isolate}
.btn-glow::after,.download-button::after{content:'';position:absolute;top:-80%;left:-75%;width:28%;height:240%;background:linear-gradient(90deg,transparent,#ffe7b444,transparent);transform:rotate(23deg);animation:metal-sweep 8s ease-in-out infinite;pointer-events:none}
@keyframes metal-sweep{0%,34%{left:-60%;opacity:0}45%{opacity:1}63%,100%{left:140%;opacity:0}}
.btn-glow:is(:hover,:focus-visible){box-shadow:0 0 18px #ed311b,0 0 44px #a1100e}
.slide-dots button.is-active{animation:dot-pulse 2.1s ease-in-out infinite}
@keyframes dot-pulse{50%{box-shadow:0 0 16px 4px #ed3e33}}
.slide-control{transition:background .2s,box-shadow .25s,transform .2s}
.slide-control:hover{transform:scale(1.12);box-shadow:0 0 22px #f0311977}
/* No duplicated action cards, Donate or Rules: directly rankings + news */
.quick-links,.side-actions{display:none!important}
.lower-grid{grid-template-columns:1fr .95fr!important;gap:14px;margin-top:14px}
.panel{background:linear-gradient(165deg,#16100ff7,#0b0909f6 70%,#080708f9);backdrop-filter:blur(2px)}
.panel-header h2{color:#f1c481}
.news-row{min-height:41px}
.rank-table th,.rank-table td{padding:8px 6px}
.sidebar{gap:13px}
.sidebar .stat-list>div{padding:7px 0}
.sidebar .panel-header{padding:12px}
.social-links a{transition:transform .25s,box-shadow .25s}
.social-links a:hover{box-shadow:0 0 15px #4175dc66}
.feature-area{margin-top:35px;background:linear-gradient(180deg,#100707ed,#210b0af5,#070505ed)}
.feature-card,.panel,.hero,.ornate{transition:border-color .28s,box-shadow .28s}
.feature-card:hover,.panel:hover{border-color:#b36138}
/* Atmospheric layers: inexpensive GPU compositing, never cover actual content */
.fx-atmosphere{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:1}
.fx-smoke{position:absolute;inset:-22% -25%;opacity:.38;
 background:radial-gradient(ellipse 20% 22% at 15% 72%,#8b393466,transparent 95%),radial-gradient(ellipse 30% 22% at 75% 74%,#973a2f55,transparent 95%),radial-gradient(ellipse 18% 14% at 46% 12%,#85382b36,transparent 95%);
 filter:blur(43px);animation:smoke-drift 35s ease-in-out infinite alternate;will-change:transform}
@keyframes smoke-drift{from{transform:translate3d(-3%,1%,0) scale(1)}to{transform:translate3d(3%,-3%,0) scale(1.05)}}
.fx-glow{position:absolute;inset:0;opacity:.58;mix-blend-mode:screen;background:
 radial-gradient(ellipse 18% 46% at 7% 75%,#9d1c071a,transparent 95%),radial-gradient(ellipse 16% 40% at 93% 70%,#fd360b22,transparent 95%);
 animation:lava-flicker 5.3s ease-in-out infinite alternate;pointer-events:none}
@keyframes lava-flicker{0%,100%{opacity:.30}18%{opacity:.65}27%{opacity:.39}35%{opacity:.7}61%{opacity:.36}75%{opacity:.8}}
canvas.fx-embers{position:fixed;inset:0;display:block;width:100vw;height:100vh;pointer-events:none;z-index:6;opacity:.84}
.fx-toggle{border:1px solid #6b3625;background:#150b0a;color:#c89e80;padding:6px 11px;font:11px Georgia,serif;cursor:pointer}
.fx-toggle:hover{border-color:#d8532c;color:#fff}
.reveal-ready:not(.reveal-in){opacity:.0;transform:translate3d(0,16px,0)}
.reveal-ready{transition:opacity .75s ease,transform .75s ease}
.reveal-in{opacity:1;transform:translate3d(0,0,0)}
.hell-dialog{max-width:min(470px,calc(100vw - 28px));padding:0;color:#f3ddbc;background:linear-gradient(145deg,#2a0b0a,#070606);border:1px solid #a85d34;box-shadow:0 0 55px #000,0 0 25px #8e1d1599}
.hell-dialog::backdrop{background:#030101c9;backdrop-filter:blur(5px)}
.dialog-inner{padding:32px 38px}.dialog-inner h2{font:25px Georgia,serif;color:#f1be76}.dialog-inner p{line-height:1.8;color:#cebcaf}.dialog-close{position:absolute;top:8px;right:9px;cursor:pointer;background:none;border:0;color:#f1c99e;font-size:26px}
.eyebrow{letter-spacing:2px;font-size:10px;color:#f45c2b}
body.fx-low canvas.fx-embers{opacity:.45}body.fx-low .fx-glow{opacity:.27}body.fx-low .fx-smoke{opacity:.18}
body.fx-off canvas.fx-embers,body.fx-off .fx-atmosphere{display:none!important}body.fx-off .masthead::before,body.fx-off .hero-image,body.fx-off .navigation::before,body.fx-off .btn-glow::after{animation:none!important}
@media (min-width:761px) and (max-width:1360px){.content-grid{grid-template-columns:minmax(0,1fr) 260px!important}.header-sidecopy{left:2%;top:60px}.header-sidecopy strong{font-size:14px}.header-tagline{right:3%;font-size:19px;top:111px}.hero h1{font-size:29px}.hero-copy{left:5%;top:16%}.hero-subtitle{font-size:10px}.news-row{font-size:11px}}
@media(max-width:980px){.lower-grid{grid-template-columns:1fr!important}.hero-copy{max-width:70%}.header-sidecopy{display:none}.header-tagline{display:none}}
@media(max-width:760px){body{background-size:100% 100%,auto 1300px!important}.masthead{height:180px!important}.masthead::before{height:180px;width:min(520px,100vw);top:0}.masthead-caption{display:none}.header-sidecopy,.header-tagline{display:none}.navigation,.content-grid{width:calc(100% - 18px)!important}.nav-items{display:none;grid-template-columns:repeat(2,minmax(0,1fr))}.nav-items.open{display:grid}.hero{height:285px}.hero h1{font-size:25px}.hero-copy{top:17%;max-width:88%;left:6%}.lower-grid{margin-top:10px}.sidebar{margin-top:12px;display:grid;grid-template-columns:1fr 1fr}.sidebar .server-clock{align-self:start}.feature-area{margin-top:24px}.fx-smoke{opacity:.15}}
@media(max-width:440px){.masthead{height:143px!important}.masthead::before{height:143px}.utility-actions{font-size:10px}.hero{height:266px}.hero h1{font-size:23px}.hero-subtitle{font-size:9px}.sidebar{display:block}.feature-area{margin-top:20px}.feature-grid{grid-template-columns:repeat(2,1fr)}.feature-card:last-child{grid-column:1/-1}.dialog-inner{padding:28px 20px}}
@media(prefers-reduced-motion:reduce){.fx-atmosphere,.fx-embers{display:none!important}.masthead::before,.hero-image,.navigation::before,.slide-dots button,.btn-glow::after{animation:none!important}.reveal-ready{opacity:1!important;transform:none!important}}

.hero-copy.slide-enter{animation:slide-in-v5 .6s ease both}@keyframes slide-in-v5{from{opacity:.15;transform:translate3d(-12px,0,0)}to{opacity:1;transform:none}}
