/* Reset Body & Full Bleed Canvas */
body.tactical-landing-body,
html {
    margin: 0 !important;
    padding: 0 !important;
    background-color: #060708 !important;
    font-family: 'Arial Black', Impact, sans-serif;
    color: #fff;
    overflow-x: hidden;
}

body.tactical-landing-body.admin-bar {
    margin-top: 0 !important;
}

.tactical-wrapper {
    width: 100% !important;
    max-width: 520px !important;
    margin: 0 auto !important;
    background-color: #0c0d0f !important;
    box-shadow: 0 0 50px rgba(0,0,0,0.95);
    border-left: 1px solid #1a1c1e;
    border-right: 1px solid #1a1c1e;
}

/* 1. Header Plate - High-Definition Brushed Steel */
.tactical-header-plate {
    position: relative !important;
    background: 
        linear-gradient(180deg, rgba(65,70,75,0.7) 0%, rgba(25,27,30,0.6) 50%, rgba(45,48,52,0.7) 100%),
        url('assets/images/metal-brushed.png') repeat-x center !important;
    background-size: auto 100% !important;
    border-top: 2px solid #5a5e63 !important;
    border-bottom: 3px solid #000 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.25), 0 8px 25px rgba(0,0,0,0.85) !important;
    padding: 30px 20px 24px 20px !important;
    text-align: center !important;
    overflow: hidden !important;
    display: block !important;
}

/* Corner Industrial Hex Screws */
.tactical-header-plate::before,
.tactical-header-plate::after {
    content: "";
    position: absolute;
    top: 18px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 35%, #9aa0a6, #202224);
    box-shadow: inset 0 1px 2px #fff, 0 2px 5px #000;
    border: 1px solid #111;
}
.tactical-header-plate::before { left: 24px; }
.tactical-header-plate::after { right: 24px; }

/* Balanced Proportional Logo */
.tactical-logo-container {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
}

.tactical-brand-logo {
    display: block !important;
    width: auto !important;
    max-width: 520px !important;
    max-height: 220px !important;
    height: auto !important;
    margin: 0 auto !important;
    filter: drop-shadow(0 8px 18px rgba(0,0,0,0.95)) !important;
}

/* 2. Hex Mesh Navigation */
.tactical-navbar {
    background: #0d0d0e url('assets/images/hex-mesh.png') repeat !important;
    background-size: 75px 75px !important;
    border-top: 2px solid #33363a !important;
    border-bottom: 2px solid #08090a !important;
    display: block !important;
}
.nav-links {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 12px 0 !important;
}
.nav-links li {
    margin: 0 24px !important;
    position: relative !important;
    display: inline-block !important;
}
.nav-links li:not(:last-child)::after {
    content: "|" !important;
    color: #444 !important;
    position: absolute !important;
    right: -24px !important;
    font-size: 13px !important;
}
.nav-links a {
    color: #d1d4d6 !important;
    text-decoration: none !important;
    letter-spacing: 1.5px !important;
    font-size: 14px !important;
    text-shadow: 0 2px 4px #000 !important;
    transition: color 0.2s ease !important;
}
.nav-links li.active a,
.nav-links a:hover {
    color: #ff6a00 !important;
    text-shadow: 0 0 10px rgba(255,106,0,0.7) !important;
}

/* 3. Hero Section */
.tactical-hero {
    position: relative !important;
    background: #08090a url('assets/images/fog-bg.png') no-repeat center bottom !important;
    background-size: cover !important;
    min-height: 560px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    overflow: hidden !important;
    padding: 0 40px !important;
}
.hero-left {
    position: relative !important;
    flex: 1.2 !important;
    z-index: 2 !important;
    padding-bottom: 40px !important;
}
.hero-pistol {
    max-width: 110% !important;
    transform: rotate(3deg) !important;
    filter: drop-shadow(8px 14px 25px rgba(0,0,0,0.95)) !important;
    display: block !important;
}
.hero-center {
    flex: 1 !important;
    text-align: center !important;
    z-index: 1 !important;
    margin-bottom: 140px !important;
}
.hero-headline {
    font-size: 46px !important;
    line-height: 1.15 !important;
    letter-spacing: 2px !important;
    color: #dcdedc !important;
    text-shadow: 2px 2px 10px #000, 0 0 25px rgba(0,0,0,0.9) !important;
    margin: 0 !important;
}
.hero-right {
    flex: 1 !important;
    z-index: 2 !important;
    text-align: right !important;
    display: flex !important;
    justify-content: flex-end !important;
}
.hero-operator {
    max-height: 220px !important;
    width: auto !important;
    vertical-align: bottom !important;
    filter: drop-shadow(-8px 12px 20px rgba(0,0,0,0.95)) !important;
    display: block !important;
}

/* Custom Builds Button */
.tactical-btn {
    display: inline-block !important;
    background: linear-gradient(180deg, #4b4e52 0%, #1a1b1d 100%) !important;
    border: 1px solid #6b7075 !important;
    border-radius: 4px !important;
    padding: 9px 24px !important;
    text-decoration: none !important;
    color: #fff !important;
    text-align: center !important;
    margin-top: 15px !important;
    box-shadow: 0 6px 15px rgba(0,0,0,0.85), inset 0 1px 0 rgba(255,255,255,0.25) !important;
}
.tactical-btn:hover {
    border-color: #ff6a00 !important;
}
.tactical-btn .btn-inner {
    font-size: 13px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
}
.tactical-btn small {
    font-size: 11px !important;
    color: #9da1a6 !important;
    text-transform: capitalize !important;
    font-family: sans-serif !important;
}