/* NYCTechZone Premium MSP Styling */

/* Global Typography Upgrade */
body, h1, h2, h3, h4, h5, h6, p, a, li, span {
    font-family: 'DM Sans', sans-serif !important;
}

/* Make headers slightly tighter to mimic the Google Workspace look */
h1, h2, h3 {
    letter-spacing: -0.02em;
}

/* We use the logo green for tech accents and the tech blue for professional text */
:root {
    --brand-tech-green: #39FF14;
    --brand-prof-blue: #0d6efd; 
}

/* Make the navbar text white to match the logo text */
.navbar-dark .navbar-nav .nav-link {
    color: #FFFFFF !important;
}

.brand-accent {
    color: var(--brand-tech-green);
}

.custom-card-shadow:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.15) !important;
    border-bottom: 3px solid var(--brand-tech-green) !important;
    transition: all 0.3s ease-in-out;
}

/* Custom NYCTechZone Rich Purple Card Background - DRIVER DECISION: Dark background for maximum text contrast */
.bg-tech-rich-purple {
    background-color: #351c75 !important; /* Deep, rich tech purple */
}

/* Force ALL text inside the rich purple cards to be vibrant white */
.bg-tech-rich-purple h3, 
.bg-tech-rich-purple p, 
.bg-tech-rich-purple ul, 
.bg-tech-rich-purple li {
    color: #FFFFFF !important;
}

/* Optional high-contrast pop: Add slight glow/shadow to card headers */
.bg-tech-rich-purple h3 {
    text-shadow: 0 0 10px rgba(255,255,255,0.4);
}

/* --- CSS COMPUTER MONITORS --- */
.monitor-card {
    background-color: #071018; /* Dark, terminal-like screen color */
    border: 12px solid #2a2a2a; /* The monitor bezel */
    border-bottom-width: 28px; /* Thicker bottom bezel like a real monitor */
    border-radius: 8px;
    position: relative;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    margin-bottom: 25px; /* Space for the stand */
}

/* The vertical stand pillar */
.monitor-card::after {
    content: '';
    position: absolute;
    bottom: -25px;
    left: 50%;
    transform: translateX(-50%);
    width: 50px;
    height: 25px;
    background: linear-gradient(to right, #2a2a2a, #444, #2a2a2a);
    z-index: -1;
}

/* The flat base of the stand */
.monitor-card::before {
    content: '';
    position: absolute;
    bottom: -35px;
    left: 50%;
    transform: translateX(-50%);
    width: 140px;
    height: 10px;
    background-color: #222;
    border-radius: 4px;
    box-shadow: 0 5px 10px rgba(0,0,0,0.4);
}

/* Subtle screen glow effect */
.monitor-screen {
    box-shadow: inset 0 0 30px rgba(57, 255, 20, 0.05);
    height: 100%;
}

/* --- TRANSLUCENT CLASS EXTENSIONS (Glassmorphism Effect) --- */
.bg-white-75 {
    background-color: rgba(255, 255, 255, 0.75) !important;
}

.bg-tech-rich-purple-75 {
    background-color: rgba(74, 20, 140, 0.75) !important;
}