*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#070707;color:#f5f5f5;font-family:Inter,Arial,sans-serif}
:root{--red:#ff2a22;--red2:#a90808;--panel:#0b0b0be6;--line:#2a2a2a}
a{color:inherit;text-decoration:none}.topbar{position:fixed;top:0;left:300px;right:0;height:82px;z-index:20;display:flex;align-items:center;justify-content:flex-end;padding:0 44px;background:linear-gradient(180deg,#050505ee,#05050599);border-bottom:1px solid #222}
.brand-mini{margin-right:auto;font-family:"Bebas Neue",sans-serif;font-size:28px;color:var(--red);display:none}
.topnav{display:flex;gap:40px}.topnav a{font-family:"Bebas Neue",sans-serif;letter-spacing:1px;font-size:17px;color:#ddd;position:relative;padding:29px 0 25px}.topnav a.active,.topnav a:hover{color:var(--red)}.topnav a.active:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--red)}
.menu-btn{display:none;background:none;color:#fff;border:0;font-size:28px}
.sidebar{position:fixed;inset:0 auto 0 0;width:300px;background:linear-gradient(180deg,#090b0d 0%,#060708 100%);z-index:30;border-right:1px solid #222;display:flex;flex-direction:column}
.logo-wrap{height:330px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-bottom:1px solid #2a1515;background:radial-gradient(circle at center,#181818 0,#090909 62%)}
.logo-mark{font-size:92px;filter:grayscale(1) contrast(1.6);text-shadow:0 0 25px #ff2a2270}.logo-text{font-family:"Bebas Neue",sans-serif;font-size:46px;color:var(--red);font-style:italic;text-shadow:0 2px 10px #000}
.side-nav{display:flex;flex-direction:column}.side-nav a{display:flex;align-items:center;gap:22px;padding:20px 35px;border-bottom:1px solid #161616;color:#c9c9c9;font-family:"Bebas Neue",sans-serif;font-size:20px;letter-spacing:1.2px}.side-nav a:hover,.side-nav a.active{color:#fff;background:linear-gradient(90deg,#541010aa,#171010);box-shadow:inset 3px 0 0 var(--red)}.side-nav a:first-child{color:#ffb0ad}.socials{margin-top:auto;display:flex;gap:24px;padding:24px 36px 12px;font-size:22px;color:#aaa}.sidebar small{padding:0 36px 28px;color:#666}
main{margin-left:300px}.hero{min-height:100vh;position:relative;padding-top:82px;background-image:url("assets/rumkraken-homepage-reference.png");background-position:center top;background-size:cover;background-repeat:no-repeat;overflow:hidden}.overlay{position:absolute;inset:0;background:linear-gradient(90deg,#0009 0%,#0002 45%,#0001 70%),linear-gradient(0deg,#000b 0,#0000 45%)}
.hero-content{position:relative;z-index:2;max-width:760px;padding:165px 7vw 0}.eyebrow{font-family:"Bebas Neue",sans-serif;letter-spacing:8px;font-size:29px;margin:0 0 4px}.hero h1{font-family:"Bebas Neue",sans-serif;font-size:clamp(88px,8.5vw,160px);line-height:.9;margin:0;color:var(--red);text-shadow:0 0 12px #000,0 0 30px #8d0b0b;transform:skew(-7deg)}.tagline{font-family:"Bebas Neue",sans-serif;letter-spacing:4px;font-size:24px;color:#ddd;margin:28px 0 26px}.cta{display:inline-flex;align-items:center;justify-content:space-between;gap:38px;padding:16px 30px;border:1px solid var(--red);color:#fff;background:#180808cc;box-shadow:0 0 18px #ff2a2240;font-family:"Bebas Neue",sans-serif;letter-spacing:2px;font-size:20px;transition:.2s}.cta:hover{background:#6a0c0c;transform:translateY(-2px)}.cta span{font-size:30px;color:var(--red)}.cta.small{margin-top:20px;font-size:16px;padding:12px 20px}
.feature-grid{position:absolute;z-index:3;left:7vw;right:4vw;bottom:55px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.feature{min-height:116px;display:grid;grid-template-columns:58px 1fr 20px;align-items:center;gap:16px;padding:20px;background:linear-gradient(135deg,#111d,#080808e8);border:1px solid #322020;border-radius:6px;box-shadow:0 10px 30px #0008;transition:.2s}.feature:hover{border-color:var(--red);transform:translateY(-4px)}.feature .icon{font-size:38px;color:var(--red);filter:grayscale(.2)}.feature h3{font-family:"Bebas Neue",sans-serif;font-size:22px;letter-spacing:1px;margin:0 0 4px}.feature p{font-size:13px;line-height:1.55;color:#a9a9a9;margin:0}.feature>span{font-size:28px;color:var(--red)}
.content-section{padding:100px 8vw;min-height:420px;background:#0a0a0a;border-top:1px solid #181818}.content-section.alt{background:#111}.section-kicker{font-family:"Bebas Neue",sans-serif;letter-spacing:4px;color:var(--red);font-size:20px}.content-section h2{font-family:"Bebas Neue",sans-serif;font-size:52px;letter-spacing:1px;margin:8px 0 18px}.content-section>p:last-of-type{max-width:760px;color:#aaa;line-height:1.8}.contact-form{max-width:720px;display:grid;gap:14px;margin-top:28px}.contact-form input,.contact-form textarea{width:100%;padding:16px 18px;background:#090909;border:1px solid #2a2a2a;color:#fff;font:inherit}.contact-form input:focus,.contact-form textarea:focus{outline:1px solid var(--red);border-color:var(--red)}.contact-form button{width:max-content}
@media(max-width:1200px){.feature-grid{grid-template-columns:repeat(2,1fr)}.hero{min-height:1100px}.hero-content{padding-top:130px}.topnav{gap:22px}}
@media(max-width:900px){.sidebar{display:none}.topbar{left:0;padding:0 20px;height:70px}.brand-mini{display:block}.menu-btn{display:block}.topnav{position:absolute;top:70px;left:0;right:0;display:none;flex-direction:column;gap:0;background:#080808f7;padding:12px 20px;border-bottom:1px solid #222}.topnav.open{display:flex}.topnav a{padding:13px 6px}.topnav a.active:after{display:none}main{margin-left:0}.hero{padding-top:70px;min-height:970px}.hero-content{padding:120px 6vw 0}.feature-grid{left:6vw;right:6vw;bottom:35px}.eyebrow{font-size:22px}.tagline{font-size:19px}}
@media(max-width:600px){.hero{min-height:1180px;background-position:58% top}.hero-content{padding-top:105px}.hero h1{font-size:82px}.feature-grid{grid-template-columns:1fr}.feature{min-height:105px}.content-section{padding:80px 6vw}.content-section h2{font-size:40px}}
