:root{
--dark-base:#020617;
--dark-mid:#05070d;
--accent:#00e5ff;
}

/* GRID */
.site-grid{
max-width:1050px;
margin:0 auto;
padding-left:30px;
padding-right:30px;
box-sizing:border-box;
}

body{background:var(--dark-mid);color:#cbd5e1;margin:0;font-family:Segoe UI}

/* TYPO */
p{line-height:1.75;font-size:16px;margin-bottom:18px}
h1,h2,h3{color:#e2e8f0;line-height:1.3;margin-bottom:20px}

/* HEADER */
.header{background:var(--dark-base);padding:12px 0 18px}
.branding{display:flex;align-items:center;gap:20px}
.branding img{max-height:170px}
.hero-slogan h2{color:var(--accent)}

/* MENU FIX */
.menu-bar{background:linear-gradient(to bottom,#020617 0%,#05070d 70%,rgba(5,7,13,0.95) 100%);border-top:1px solid rgba(0,229,255,0.08);border-bottom:1px solid rgba(0,229,255,0.15);padding:0}

.main-nav ul.mod-menu{display:flex!important;gap:22px;list-style:none;margin:0;padding:0;align-items:center}
.main-nav li{display:inline-block!important}

.main-nav a{
display:inline-block;
position:relative;
color:var(--accent)!important;
text-decoration:none;
font-size:13px;
letter-spacing:1px;
text-transform:uppercase;
opacity:.75;
padding:14px 0;
transition:all .25s ease;
}

.main-nav a:hover{opacity:1;transform:translateY(-1px)}

.main-nav a::after{
content:'';
position:absolute;
left:0;
bottom:-6px;
width:0;
height:2px;
background:var(--accent);
transition:width .3s;
}

.main-nav a:hover::after{width:100%;box-shadow:0 0 10px rgba(0,229,255,0.6)}
.main-nav .current a::after{width:100%}

/* CONTENT */
.container{padding:60px 0}
.lego-card{max-width:750px}

/* IMAGE FIX */
.intro-shield{
float:right;
width:25%;
max-width:160px;
margin:0 0 15px 40px;
transform:translateX(10px);
}

.footer{background:var(--dark-base);color:#777;padding:25px 0}