:root { color-scheme: dark; --cream:#f4eadc; --soft:rgba(244,234,220,.82); --gold:#d08b48; --blue:#a8c7df; }
*,*::before,*::after { box-sizing:border-box; } html,body { min-height:100%; }
body { margin:0; overflow-x:hidden; background:#130c08; color:var(--cream); font-family:"Manrope",Arial,sans-serif; }
.stage { position:fixed; inset:0; z-index:-1; overflow:hidden; background:#130c08; }.stage__image { width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(.82) contrast(1.04); transform:scale(1.01); }.stage__veil { position:absolute; inset:0; background:radial-gradient(circle at center,rgba(18,10,6,.12),rgba(18,10,6,.34) 56%,rgba(10,6,4,.72)),linear-gradient(rgba(17,10,6,.34),rgba(17,10,6,.56)); }
.shell { display:flex; min-height:100vh; padding:4rem 1.5rem 6rem; flex-direction:column; align-items:center; justify-content:center; text-align:center; text-shadow:0 2px 14px rgba(0,0,0,.7); }
.brand { position:relative; margin:0; font-family:"Cinzel",Georgia,serif; font-size:clamp(3.3rem,8.4vw,6.9rem); font-weight:600; letter-spacing:.085em; line-height:.94; }.brand::before,.brand::after { content:""; position:absolute; top:50%; width:clamp(32px,6vw,82px); height:1px; background:rgba(244,234,220,.72); }.brand::before { right:calc(100% + 24px); }.brand::after { left:calc(100% + 24px); }
.headline { margin:1.35rem 0 0; color:var(--blue); font-family:"Cinzel",Georgia,serif; font-size:clamp(1.25rem,2.2vw,2rem); font-weight:500; letter-spacing:.19em; line-height:1; }.tagline { margin:1rem 0 0; color:var(--soft); font-size:clamp(.92rem,1.35vw,1.08rem); }
.features { display:flex; flex-wrap:wrap; justify-content:center; gap:.55rem 1.65rem; padding:0; margin:1.55rem 0 0; list-style:none; font-family:"Cinzel",Georgia,serif; font-size:clamp(.72rem,1.1vw,.9rem); font-weight:600; letter-spacing:.11em; }.features li:not(:last-child)::after { content:"•"; position:relative; left:.86rem; color:var(--gold); }
.btn-discord { display:inline-flex; align-items:center; justify-content:center; gap:.7rem; min-width:200px; min-height:54px; padding:.8rem 1.6rem; margin-top:2rem; border-radius:8px; background:#5865f2; box-shadow:0 12px 30px rgba(41,48,155,.42); color:#fff; font-size:1rem; font-weight:700; text-decoration:none; text-shadow:none; transition:transform .16s ease,background .16s ease; }.btn-discord:hover { background:#6874ff; transform:translateY(-2px); }.btn-discord img { display:block; }
.foot { position:fixed; bottom:0; left:0; width:100%; padding:1.15rem; color:rgba(244,234,220,.6); font-size:.72rem; text-align:center; }
@media (max-width:680px) { .shell { padding:3rem 1rem 5rem; }.brand { font-size:clamp(2.45rem,13vw,4.2rem); letter-spacing:.04em; }.brand::before,.brand::after { display:none; }.features { max-width:340px; gap:.6rem 1.15rem; line-height:1.7; }.features li:not(:last-child)::after { left:.62rem; } }