﻿/*background colours*/
.bg-light {
    background-color: #efefef !important; /*light grey*/
}

.bg-light-vector {
    background-color: #efefef !important;
    background-image: url('/images/triangle-round-asymmetrical 6.png');
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
}

.bg-light-slide {
    background-color: #efefef !important;
    background-image: url('/images/AbstractBlue.png');
    background-repeat: no-repeat;
    background-position: top left;
    background-size: 400px;
}

.bg-light-slide2 {
    background-color: #efefef !important;
    background-image: url('/images/AbstractGreen.png');
    background-repeat: no-repeat;
    background-position: top left;
    background-size: 400px;
}

.bg-dark {
    background-color: #1b2438 !important; /*dark blue*/
}

.bg-primary {
    background-color: #ff5d00 !important; /*orange*/
}

.bg-primary-w-opacity {
    background-color: rgba(255, 93, 0, 0.22) !important; /*orange opacity 22%*/
    background-image: url('/images/Vector 2.png'), url('/images/Vector.png');
    background-repeat: no-repeat;
    background-position: top left, bottom right;
    background-size: 400px, 500px;
}

.bg-white-home {
    background-color: white !important;
    background-image: url('/images/Abstract.jpg');
    background-repeat: no-repeat;
    background-position: top right;
    background-size: 570px;
}

.img-fluid-alt {
    width: 100%;
    height: 520px;
    object-fit: cover;
}


/*text colours*/
.text-primary {
    color: #ff5d00 !important; /*orange*/
}

.text-dark {
    color: #1b2438 !important; /*dark blue*/
}

/*custom nav*/
.hcg-navbar {
    background-color: #1b2438 !important;
    height: 80px;
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: none !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 1030 !important;
    overflow: visible !important; /* Allow logo to overflow */
}

    /* Fix navbar container spacing */
    .hcg-navbar .container-fluid {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
        height: 80px;
    }

    .hcg-navbar .navbar-collapse {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .hcg-navbar .navbar-brand {
        padding-left: 20px !important;
        height: 80px;
        display: flex;
        align-items: flex-start; /* Align to top to allow downward overflow */
        padding-top: 0 !important;
    }


.navbar {
    padding: 0 !important;
}


.box-shadow {
    margin: 0 !important;
}

.mb-3 {
    margin-bottom: 0 !important;
}


.hcg-navbar + section {
    margin-top: 0 !important;
}

/* Responsive Navbar Logo - Keep 190px on desktop */
.navbar-brand img {
    height: 60px !important; /* Default mobile size */
    width: auto !important;
    object-fit: contain;
    transition: all 0.3s ease;
    position: relative;
}

/* Large desktop */
@media (min-width: 1200px) {
    .navbar-brand img {
        height: 55px !important;
    }
}

/* Tablet and smaller desktop */
@media (max-width: 1199px) and (min-width: 992px) {
    .navbar-brand img {
        height: 160px !important;
    }
}

/* Tablet */
@media (max-width: 991px) and (min-width: 768px) {
    .navbar-brand img {
        height: 120px !important;
    }
}

/* Mobile - keep the smaller sizes you had */
@media (max-width: 767px) {
    .navbar-brand img {
        height: 50px !important;
    }

    .hcg-navbar .navbar-brand {
        padding-left: 15px !important;
    }
}

/* Small mobile */
@media (max-width: 576px) {
    .navbar-brand img {
        height: 45px !important;
    }

    .hcg-navbar .navbar-brand {
        padding-left: 10px !important;
    }
}

/* Extra small mobile */
@media (max-width: 480px) {
    .navbar-brand img {
        height: 40px !important;
    }
}




/*fonts*/
.poppins-regular {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.poppins-semibold {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-style: normal;
}

.poppins-bold {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-style: normal;
}

.poppins-extrabold {
    font-family: "Poppins", sans-serif;
    font-weight: 800;
    font-style: normal;
}

.poppins-regular-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-style: italic;
}

.abhaya-libre-regular {
    font-family: "Abhaya Libre", serif;
    font-weight: 400;
    font-style: normal;
}

.abhaya-libre-medium {
    font-family: "Abhaya Libre", serif;
    font-weight: 500;
    font-style: normal;
}

.abhaya-libre-semibold {
    font-family: "Abhaya Libre", serif;
    font-weight: 600;
    font-style: normal;
}

.abhaya-libre-bold {
    font-family: "Abhaya Libre", serif;
    font-weight: 700;
    font-style: normal;
}

.abhaya-libre-extrabold {
    font-family: "Abhaya Libre", serif;
    font-weight: 800;
    font-style: normal;
}

.splash-regular {
    font-family: "Splash", cursive;
    font-weight: 400;
    font-style: normal;
}

.splash-medium {
    font-family: "Splash", cursive;
    font-weight: 500;
    font-style: normal;
}

.splash-semibold {
    font-family: "Splash", cursive;
    font-weight: 600;
    font-style: normal;
}

.splash-bold {
    font-family: "Splash", cursive;
    font-weight: 700;
    font-style: normal;
}

.splash-extrabold {
    font-family: "Splash", cursive;
    font-weight: 800;
    font-style: normal;
}
