/* Custom Typography & Palette Layout matching Mockup UI */
body {
    font-family: 'Plus Jakarta Sans', sans-serif;
    color: #2d3748;
    background-color: #fafbfc;
}

/* Color Variables Code Setup */
.bg-navy {
    background-color: #0c2340 !important;
}
.text-navy {
    color: #0c2340 !important;
}
.btn-navy {
    background-color: #0c2340 !important;
    color: #ffffff !important;
    border: 1px solid #0c2340;
    transition: all 0.3s ease;
}
.btn-navy:hover {
    background-color: #14355e !important;
    color: #ffffff !important;
}

.top-bar {
    background-color: #061527;
    letter-spacing: 0.5px;
}

/* Hero UI */
.min-vh-75 {
    min-height: 75vh;
}
.hero-bg-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.z-index-2 {
    z-index: 2;
}
.fw-extrabold {
    font-weight: 800;
}

/* Custom Soft Badges for Courses */
.bg-primary-soft { background-color: rgba(13, 110, 253, 0.1); }
.bg-danger-soft { background-color: rgba(220, 53, 69, 0.1); }
.bg-success-soft { background-color: rgba(25, 135, 84, 0.1); }

.border-bottom-3 {
    border-bottom: 4px solid !important;
}

/* Gallery Hover Animation Structure */
.gallery-card {
    cursor: pointer;
}
.gallery-overlay {
    background: linear-gradient(to top, rgba(12, 35, 64, 0.95) 0%, rgba(12, 35, 64, 0.1) 100%);
    opacity: 0.9;
    transition: opacity 0.3s ease;
}
.transition-img {
    transition: transform 0.5s ease;
}
.gallery-card:hover .transition-img {
    transform: scale(1.08);
}

/* Utilities */
.bg-light-blue {
    background-color: rgba(12, 35, 64, 0.05);
}
.max-w-xl { max-width: 600px; }
.max-w-3xl { max-width: 800px; }
.hover-white:hover {
    color: #ffffff !important;
}
.transition-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.transition-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 1rem 3rem rgba(0,0,0,0.1) !important;
}