/* Custom CSS for MiQ IT Solutions */

/* ====== BLUE COLOR PALETTE ====== */
:root {
    --primary-color: #0d6efd; /* A classic Bootstrap Blue */
    --primary-hover: #0b5ed7; /* A slightly darker Blue for hover effects */
    --dark-blue: #2c3e50;    /* A deep, professional blue for text and backgrounds */
    --headings-color: #34495e; /* A slightly lighter blue for headings */
}
/* ================================ */


body {
    color: var(--dark-blue); /* Sets the default text color for the whole site */
}

/* Update Navbar to be taller and use the new dark blue */
.navbar.bg-dark {
    background-color: var(--dark-blue) !important;
  
}

.navbar-brand {
    font-weight: bold;
}



/* Update primary button color */
.btn-primary {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.btn-primary:hover {
    background-color: var(--primary-hover);
    border-color: var(--primary-hover);
}

.nav-link.btn-primary {
    color: white !important;
    padding: 8px 20px;
}

/* Update default link color */
a {
    color: var(--primary-color);
    text-decoration: none; /* Removes underline from links */
}
a:hover {
    color: var(--primary-hover);
}

/* Update headings color */
h1, h2, h3, h4, h5, h6 {
    color: var(--headings-color);
}

/* Hero Section */
.hero-section {
    background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('images/your-hero-image.jpg') no-repeat center center;
    background-size: cover;
    padding: 120px 0;
}

/* Icon Circle for Services */
.icon-circle {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    background-color: var(--primary-color) !important; /* Use new primary color */
}

.card:hover {
    transform: translateY(-5px);
    transition: transform 0.3s ease-in-out;
}

/* Update Footer to use the new dark blue */
footer.bg-dark {
    background-color: var(--dark-blue) !important;
}

footer .text-primary {
    color: var(--primary-color) !important;
}

footer a.text-white:hover {
    color: var(--primary-color) !important;
}

/* Showcase images from previous step */
.showcase-img {
    border: 1px solid #dee2e6; /* A light grey border */
    padding: 5px;
}

/* Fix for sticky navbar covering content on anchor link clicks */
.scroll-anchor {
  scroll-margin-top: 100px; /* This value creates space for the sticky navbar */
}