/* General Body & Layout */
body {
    background-color: #f8f9fa;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

main {
    flex-grow: 1;
}

/* Navbar */
.navbar-brand {
    font-weight: bold;
}

/* Hero Section on Homepage */
.hero-section {
    background-color: #212529; /* Darker, more serious charcoal */
    color: white;
    padding: 4rem 2rem;
    border-radius: .25rem; /* Sharper corners */
    margin-bottom: 2rem;
}

/*
==================================
CUSTOM BUTTON STYLES
==================================
*/
.btn {
    border-radius: 0.2rem; /* Sharper corners for all buttons */
    font-weight: 500;
    padding: 0.6rem 1.2rem;
    transition: all 0.2s ease-in-out;
}

/* Primary Button (Engineering/Product focus) */
.btn-primary {
    background-color: #004085; /* A deep, professional navy blue */
    border-color: #004085;
}
.btn-primary:hover {
    background-color: #00336a;
    border-color: #00336a;
    transform: translateY(-2px);
}

/* Secondary Button (Programming/Consulting focus) */
.btn-secondary {
    background-color: #495057; /* A solid, professional gray */
    border-color: #495057;
}
.btn-secondary:hover {
    background-color: #343a40;
    border-color: #343a40;
    transform: translateY(-2px);
}

/* Outline Secondary Button */
.btn-outline-secondary {
    border-color: #495057;
    color: #495057;
}
.btn-outline-secondary:hover {
    background-color: #495057;
    color: #fff;
}

/* Outline Light Button (for use on dark backgrounds) */
.btn-outline-light:hover {
    color: #000;
}

/* Success Button (for links to industrydocs.org) */
.btn-success {
    background-color: #198754; /* A rich, standard green */
    border-color: #198754;
}
.btn-success:hover {
    background-color: #146c43;
    border-color: #146c43;
    transform: translateY(-2px);
}


/* Custom Card Styles */
.card {
    transition: transform .2s ease-in-out, box-shadow .2s ease-in-out;
    border: 1px solid #dee2e6;
    border-radius: 0.2rem; /* Sharper corners */
}

.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 4px 15px rgba(0,0,0,.08);
}

.card-title {
    color: #004085; /* Match the new primary button color */
}

.card-footer {
    background-color: #f8f9fa;
    border-top: 1px solid #dee2e6;
}

/* Project Experience Page Styles */
.project-card {
    border-left: 4px solid #004085; /* Match the new primary color */
    margin-bottom: 1.5rem;
}

.project-card .card-body {
    padding: 1.5rem;
}

.project-card h5 {
    font-weight: bold;
}

.project-card h6.text-muted {
    margin-bottom: 1rem;
}

.tech-tags span {
    background-color: #e9ecef;
    border-radius: .25rem;
    padding: .25rem .5rem;
    font-size: 0.85em;
    margin-right: .5rem;
    margin-bottom: .5rem;
    display: inline-block;
}

/* Article Page Styles */
.article-header {
    background-color: #e9ecef;
    padding: 2rem;
    border-radius: .25rem; /* Sharper corners */
    margin-bottom: 2rem;
}

.article-meta {
    font-size: 0.9em;
    color: #6c757d;
}

.article-content a {
    font-weight: 500;
    color: #004085;
}
.article-content a:hover {
    color: #00336a;
}

.related-product-box {
    background-color: #f1f3f5;
    border: 1px solid #dee2e6;
    border-radius: .25rem; /* Sharper corners */
    padding: 1.5rem;
}

.related-product-box h4 {
    margin-top: 0;
}