/*!
 * KCSOS CYBHI Fee Schedule
 * Page-specific styles
 * Author: KCSOS Web Team
 * Version: 1.0.0
 */

/* ==========================================================================
   Variables
   ========================================================================== */

.cybhi-home {

    --cybhi-navy: #083b8c;
    --cybhi-blue: #2d74c7;
    --cybhi-cyan: #4fc3d9;
    --cybhi-green: #8cc63f;
    --cybhi-gold: #f6be2c;
    --cybhi-red: #e94b5b;

    --cybhi-bg-light: #f7f9fc;
    --cybhi-bg-blue: #eef6fd;
    --cybhi-border: rgba(8, 59, 140, .08);

}


/* ==========================================================================
   Section spacing
   ========================================================================== */

.cybhi-home section {
    margin-bottom: 5rem;
}

.cybhi-home .section-title {
    color: var(--cybhi-navy);
    font-weight: 700;
    margin-bottom: .75rem;
}

.cybhi-home .section-lead {
    max-width: 760px;
    color: #5f6b7a;
}


/* ==========================================================================
   Hero
   ========================================================================== */

.cybhi-home .hero-panel {

    background:
        linear-gradient(135deg,#ffffff,#f6faff);

    border-top:5px solid var(--cybhi-blue);
    border-radius: 1.5rem;

    padding: 3.5rem;

    box-shadow: var(--ar-box-shadow-sm);

}

.cybhi-home .hero-panel h1 {

    color: var(--cybhi-navy);
    font-weight: 700;

}

.cybhi-home .hero-panel .lead {

    max-width: 760px;

}


/* ==========================================================================
   Cards
   ========================================================================== */

.cybhi-home .cybhi-card {

    border-radius: 1.25rem;

    border: 1px solid var(--cybhi-border);

    box-shadow: var(--ar-box-shadow-sm);

    transition: .25s ease;

    height: 100%;

}

.cybhi-home .cybhi-card:hover {

    transform: translateY(-4px);

    box-shadow: var(--ar-box-shadow);

}

.cybhi-home .cybhi-card .card-body {

    padding: 2.25rem;

}

.cybhi-home .cybhi-card h3 {

    color: var(--cybhi-navy);
    margin-bottom: 1rem;

}


/* ==========================================================================
   Resource Hub
   ========================================================================== */

.cybhi-home .resource-card {

    background: var(--cybhi-bg-blue);
    border-left:5px solid var(--cybhi-blue);

}

.cybhi-home .resource-links {

    columns: 2;
    gap: 2rem;

}

.cybhi-home .resource-links a {

    display: block;

    color: var(--cybhi-navy);

    text-decoration: none;

    margin-bottom: .85rem;

    font-weight: 500;

}

.cybhi-home .resource-links a:hover {

    color: var(--cybhi-blue);

}


/* ==========================================================================
   Update Cards
   ========================================================================== */

.cybhi-home .update-card {

    position: relative;

}

.update-card{
    height:100%;
}

.update-card .card-body{
    display:flex;
    flex-direction:column;
}

.update-card .btn{
    margin-top:auto;
}

.cybhi-home .update-icon {

    width: 60px;
    height: 60px;

    border-radius: 50%;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    background: var(--cybhi-blue);

    color: white;

    font-size: 1.4rem;

    margin-bottom: 1.25rem;

}

.cybhi-home .update-card .btn {

    margin-top: auto;

}


/* ==========================================================================
   Contact
   ========================================================================== */

.cybhi-home .contact-card {

    background: linear-gradient(
        135deg,
        #ffffff,
        #f9fbfd
    );

}

.cybhi-home .contact-card h2 {

    color: var(--cybhi-navy);

}

.cybhi-home .contact-person {

    font-weight: 600;

}

.cybhi-home .contact-title {

    color: #697587;

    font-size: .95rem;

}


/* ==========================================================================
   Buttons
   ========================================================================== */

.cybhi-home .btn-cybhi {

    background: var(--cybhi-blue);

    border-color: var(--cybhi-blue);

    color: #fff;

}

.cybhi-home .btn-cybhi:hover {

    background: var(--cybhi-navy);

    border-color: var(--cybhi-navy);

    color: #fff;

}


/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 991px) {

    .cybhi-home .hero-panel {

        padding: 2rem;

    }

    .cybhi-home .resource-links {

        columns: 1;

    }

}

@media (max-width: 767px) {

    .cybhi-home section {

        margin-bottom: 3rem;

    }

    .cybhi-home .hero-panel {

        padding: 1.75rem;

    }

    .cybhi-home .cybhi-card .card-body {

        padding: 1.5rem;

    }

}