*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#050403;color:#fff;font-family:Inter,Arial,sans-serif;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;background:#050403;z-index:-5}.topbar{height:86px;padding:0 48px;display:flex;align-items:center;justify-content:space-between;position:fixed;top:0;left:0;right:0;z-index:10;background:linear-gradient(180deg,rgba(9,7,4,.96),rgba(12,8,4,.9));border-bottom:1px solid rgba(218,162,64,.55);box-shadow:0 8px 30px rgba(0,0,0,.55)}.logo{font-family:Cinzel,serif;font-size:35px;font-weight:800;color:#ffe5a5;text-decoration:none;text-shadow:0 2px 0 #5c3915,0 0 18px rgba(255,194,86,.4);letter-spacing:.04em}.topbar nav{display:flex;gap:38px;align-items:center}.topbar nav a{position:relative;color:#fff4d7;text-decoration:none;font-size:14px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}.topbar nav a.active:after,.topbar nav a:hover:after{content:"";position:absolute;left:0;right:0;bottom:-29px;height:3px;background:linear-gradient(90deg,transparent,#ffd36a,transparent);box-shadow:0 0 14px #ffc451}.play{min-width:142px;text-align:center;padding:14px 26px;border:1px solid #b97920;border-radius:8px;color:#ffe6ab;text-decoration:none;font-weight:900;text-transform:uppercase;background:rgba(0,0,0,.36);box-shadow:inset 0 0 20px rgba(255,183,64,.06)}.hero{position:relative;min-height:1024px;padding-top:86px;background-image:url('assets/concept-bg.png');background-size:1536px 1024px;background-position:center top;background-repeat:no-repeat;overflow:hidden}.shade{position:absolute;inset:86px 0 0;background:radial-gradient(circle at 58% 35%,rgba(255,211,122,.08),transparent 34%),linear-gradient(90deg,rgba(0,0,0,.12),transparent 26%,transparent 74%,rgba(0,0,0,.15));pointer-events:none}.center-copy{position:absolute;left:50%;top:282px;transform:translateX(-50%);width:480px;text-align:center;text-shadow:0 3px 12px rgba(0,0,0,.75);z-index:2}.small-title{font-family:Cinzel,serif;text-transform:uppercase;font-size:24px;letter-spacing:.05em;color:#fff4d7}.center-copy h1{font-family:Cinzel,serif;font-size:62px;line-height:.95;margin:10px 0 10px;color:#fff0c4;text-shadow:0 4px 0 rgba(72,42,12,.8),0 0 28px rgba(255,219,136,.7)}.ornament{font-size:26px;color:#dca84e;line-height:1;margin-bottom:14px}.center-copy p{font-size:16px;line-height:1.55;font-weight:700;color:#fff3d8;margin:0 0 34px}.hero-actions{display:flex;justify-content:center;gap:18px}.main-btn{height:54px;min-width:168px;border-radius:7px;display:flex;align-items:center;justify-content:center;text-decoration:none;text-transform:uppercase;font-weight:900;font-size:13px;color:#150c04;box-shadow:0 12px 24px rgba(0,0,0,.42)}.main-btn.gold{background:linear-gradient(#ffe28b,#e99e28);border:1px solid #ffd978}.main-btn.dark{color:#fff2cd;background:linear-gradient(#1f170c,#060403);border:1px solid rgba(189,132,43,.45)}.side{position:absolute;top:140px;width:340px;display:flex;flex-direction:column;gap:27px;z-index:3}.side.left{left:64px}.side.right{right:64px}.server-card{height:378px;position:relative;padding:42px 26px 18px;border-radius:10px;background:linear-gradient(180deg,rgba(20,14,8,.91),rgba(7,5,3,.95));border:1px solid rgba(206,158,78,.62);box-shadow:0 18px 44px rgba(0,0,0,.62),inset 0 0 28px rgba(255,210,111,.04)}.server-card:before{content:"";position:absolute;inset:8px;border:1px solid rgba(255,224,150,.11);border-radius:7px;pointer-events:none}.badge{position:absolute;top:-17px;left:50%;transform:translateX(-50%);min-width:86px;height:42px;padding:0 16px;display:flex;align-items:center;justify-content:center;border-radius:7px;font-family:Cinzel,serif;font-size:22px;font-weight:800;background:linear-gradient(180deg,#3d2608,#120b05);border:1px solid #c38a22;color:#ffcf59;text-shadow:0 0 12px rgba(255,191,49,.5)}.blue .badge{color:#60caff;border-color:#168bd4;box-shadow:0 0 13px rgba(0,153,255,.35)}.red .badge{color:#ff776d;border-color:#c6291f;box-shadow:0 0 13px rgba(255,41,31,.35)}.purple .badge{color:#f1a0ff;border-color:#9638bc;box-shadow:0 0 13px rgba(190,67,255,.35)}.server-card h2{font-family:Cinzel,serif;font-size:22px;line-height:1.1;margin:0;text-align:center;color:#fff0cc}.server-card h3{font-family:Cinzel,serif;font-size:16px;margin:10px 0 27px;text-align:center;text-transform:capitalize;color:#f0bd43}.blue h3{color:#58c5ff}.red h3{color:#ff765d}.purple h3{color:#e98cff}.desc{height:58px;margin:0 0 20px;color:#fff2d4;font-size:13px;line-height:1.55;text-align:center;font-weight:600}.line{height:33px;border-top:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:space-between;font-size:13px;font-weight:900}.line span{color:#fff4dc}.on{color:#14ff67;text-shadow:0 0 10px rgba(20,255,103,.65)}.off{color:#ff3a3a;text-shadow:0 0 10px rgba(255,58,58,.5)}.players{border-bottom:0}.bar{height:7px;border-radius:999px;background:rgba(255,255,255,.16);overflow:hidden;margin:4px 0 18px}.bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#ffd56e,#e59622)}.blue .bar i{background:linear-gradient(90deg,#4bc8ff,#2372b9)}.red .bar i{background:linear-gradient(90deg,#ff5146,#b91916)}.purple .bar i{background:linear-gradient(90deg,#d463ff,#6f1a9a)}.actions{display:flex;gap:14px}.btn{height:39px;flex:1;border-radius:6px;display:flex;align-items:center;justify-content:center;text-decoration:none;text-transform:uppercase;font-size:11px;font-weight:900}.btn.ghost{color:#ffe6a9;border:1px solid #b9812c;background:rgba(0,0,0,.26)}.btn.join{color:#110a03;background:linear-gradient(#ffe083,#d99220);border:1px solid #ffcc65}.red .btn.join{color:#fff;background:linear-gradient(#ff5b52,#b91b18);border-color:#ff5147}.blue .btn.join{color:#fff;background:linear-gradient(#46bdff,#145d9d);border-color:#4bc7ff}.purple .btn.join{color:#fff;background:linear-gradient(#b94bdf,#641482);border-color:#d16cff}.hero-footer{position:absolute;left:32px;right:32px;bottom:18px;height:68px;z-index:4;display:grid;grid-template-columns:repeat(5,1fr);align-items:center;border-radius:10px;border:1px solid rgba(194,140,55,.55);background:linear-gradient(180deg,rgba(20,14,8,.88),rgba(6,5,3,.92));box-shadow:0 14px 34px rgba(0,0,0,.55)}.hero-footer div{text-align:center;border-right:1px solid rgba(255,255,255,.08);color:#e9bd66;text-transform:uppercase;font-size:13px;font-weight:900;letter-spacing:.03em}.hero-footer div:last-child{border-right:0}.hero-footer span{display:block;font-size:12px;color:#a77935;margin-bottom:3px}.hero-footer b{color:#ffe0a0}
@media (min-width:1537px){.hero{background-size:100% auto}.side.left{left:7vw}.side.right{right:7vw}.center-copy{top:34vh}}
@media (max-width:1200px){.topbar{height:auto;min-height:78px;padding:18px 20px;gap:18px;flex-wrap:wrap}.topbar nav{order:3;width:100%;justify-content:center;gap:18px;flex-wrap:wrap}.topbar nav a.active:after,.topbar nav a:hover:after{display:none}.hero{padding:120px 18px 30px;min-height:auto;background-size:auto 100%;background-position:58% top}.center-copy,.side{position:relative;left:auto;right:auto;top:auto;transform:none;width:min(430px,100%)}.center-copy{margin:0 auto 28px}.side{margin:0 auto 24px}.side.left,.side.right{left:auto;right:auto}.hero{display:flex;flex-direction:column}.side.left{order:2}.center-copy{order:1}.side.right{order:3}.hero-footer{position:relative;left:auto;right:auto;bottom:auto;order:4;height:auto;grid-template-columns:1fr;padding:14px;margin-top:10px;gap:10px}.hero-footer div{border-right:0}.server-card{height:auto;min-height:360px}.center-copy h1{font-size:46px}.play{display:none}}