/* ===================================
    Winston Chidiadi
====================================== */

/* variable */
:root {      
    --alt-font: "Urbanist", sans-serif;
    --primary-font: "Urbanist", sans-serif;
    --secondary-font: "Poppins", sans-serif;
    --secondary-color: #d1ae6c;
    --primary-color: #313c52;
    --medium-gray: #707070;
    --aluminium-gray: rgba(255, 255, 255, 0.4);
    --gray-6: #666666;
}
/* reset */
body{
    font-size: 18px;
    line-height: 30px;
}
a:hover{
    color: var(--primary-color);
}

.text-primary-color {
    color: var(--primary-color) !important;
}
.text-secondary-color {
    color: var(--secondary-color) !important;
}
.text-gray-6 {
    color: var(--gray-6);
}
.font-primary {
    font-family: var(--primary-font);
}
.font-secondary {
    font-family: var(--secondary-font);
}
.border-primary-color {
    border-color: var(--primary-color) !important;
}
.border-secondary-color {
    border-color: var(--secondary-color) !important;
}

.swiper-slide-active .testimonial-wrapit .testimonial-line {
    border-top: 2px dashed var(--medium-gray);
    height: 1px;
    margin: 30px auto;
    max-width: 50%;
}
.swiper-slide-active .testimonial-wrapit {
    background-color: var(--primary-color);
}
.swiper-slide-active .testimonial-wrapit .testimonials-author, .swiper-slide-active .testimonial-wrapit .testimonials-content, .swiper-slide-active .testimonial-wrapit .testimonials-content .testimonial-summary {
    color: #fff;
}
.swiper-slide-active .testimonial-wrapit .testimonials-content .testimonial-subject {
    color: var(--secondary-color);
}
.testimonial-navi {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 99;
}
.winston-stats p {
    color: var(--secondary-color);
}
.people-saying h3 {
    text-wrap: nowrap;
}
.wc-hero-image {
    /* height: 800px; */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom;
}
.wc-hero-name {
    font-size: 115px;
    line-height: 118px;
}
.wc-hero-role span {
    font-size: 85px;
    line-height: 88px;
}
.wc-expertise .feature-box-icon img {
    /*max-height: 140px !important;*/
    max-width: 150px;
}
.info-content ul {
    padding-left: 16px;
    font-weight: 600;
}

.info-content ul li {
    margin: 0 0 10px;
    list-style: disc;
}
.info-img-2:hover, .info-img-2:hover img:hover {
    z-index: 99999;
    position: relative; 
}

.wc-paginate .page-item.active .page-link {
    background-color: var(--primary-color);
}
.winston-abt img {
    max-width: 400px;
    float: left;
    margin-right: 20px;
}
.winston-abt p {
    opacity: 1 !important;
}
.wc-contact-details ul {
    padding-left: 0;
}
.wc-contact-details ul li {
    list-style: none !important;
}
.wc-events-ul li.event_venue, .wc-speaking-ul li {
    flex-direction: column !important;
}
.blog-grid .card:hover .author .date-location-wrap {
height:36px;
}
.event-list figure .blog-image, .event-list figure .blog-image img {
    max-height: 496px;
}
.event-list figure .blog-image img {
    object-fit: cover;
}
.event-list figure .related-image img {
    max-height: 448px;
    object-fit: cover;
}

/* header */
.navbar .navbar-nav .nav-link {
    font-size: 18px;
    font-weight: 600;
}
.navbar .navbar-nav .dropdown.open .dropdown-menu {
    background-color: var(--primary-color);
}
.navbar .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu li a {
    font-size: 17px;
    font-weight: 500;
    color: var(--white);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
header .navbar-brand img {
    max-height: 60px;
}
.header-top-bar div>a {
    color: var(--white);
}
.header-top-bar div>a:hover {
    color: var(--light-gray);
}
.navbar .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu li a i {
    font-size: 30px;
}
.navbar .navbar-nav .dropdown .dropdown-menu a i {
    width: 35px;
}
header .btn.btn-box-shadow.btn-base-color,
.btn.btn-base-color {
    color: var(--primary-color);
}
header .btn.btn-box-shadow.btn-base-color:hover,
.btn.btn-box-shadow.btn-base-color:hover {
    color: var(--primary-color);
}
header .btn.btn-small {
    font-size: 15px; 
    padding: 10px 18px;
}



/* btn */
.btn.btn-hover-animation-switch.btn-link {
    padding-top: 0;
}
.btn { 
    text-transform: inherit;
    font-weight: 600;
    letter-spacing: 0;
}
.btn.btn-extra-large {
    font-size: 18px;
    padding: 16px 32px;
}
.btn.btn-large {
    font-size: 17px;
    padding: 14px 28px;
}
.btn.btn-medium {
    font-size: 16px; 
    padding: 12px 24px;
}
.btn.btn-small {
    font-size: 15px;
}
.btn.btn-very-small {
    font-size: 14px; 
    padding: 9px 20px;
}
.btn.btn-gray-yellow, .btn.btn-yellow-gray:hover {
    background-color: var(--primary-color);
    color: var(--white);
}
.btn.btn-gray-yellow:hover, .btn.btn-yellow-gray, .btn.btn-yellow-static {
    background-color: var(--secondary-color);
    color: #101010;
}
.btn.btn-yellow-static:hover {
    background-color: var(--light-gray);
    color: #101010;
}
.btn-primary-color {
    background-color: var(--primary-color);
    color: white;
}
.btn-primary-color:hover {
    background-color: var(--light-gray);
    color: black;
}

/* counter style */
.counter-style-04 .vertical-counter:after {
    color: var(--base-color);
}
.review-star-icon i {
    color: var(--base-color);
}

.google-maps-link a:hover {
    color: var(--white);
}

/* Fonts */
.fs-220 {
    font-size: 7.5rem;
    line-height: 7.75rem;
}
.fs-280 {
    font-size: 17.5rem;
    line-height: 17.5rem;
}

/* footer style */
footer .quik-links {
    display: flex;
    gap: 25px;
}
footer ul li {
    margin-bottom: 1px;
    display: inline-block;
}
footer p {
    line-height: 28px;
}
.footer-bottom {
    border-top: 1px solid var(--secondary-color);
}
.footer-socials {
    text-align: end;
}

/* page title */
.page-title-double-large h1 {
    font-size: 4.375rem;
    line-height: 4.688rem;
}
.page-title-double-large h2 {
    font-size: 16px;
    line-height: 28px;
}

/* top bottom left right class */
.right-12 {
    right: 12%;
}

.bg-jungle-green {
    background-color: #2ebb79;
}
.bg-primary-color {
    background-color: var(--primary-color);
}
.bg-secondary-color {
    background-color: var(--secondary-color);
}


/* Outside box */
.outside-box-top-205px {
    margin-top: -205px;
}
/* Transparent background color */
.bg-gradient-gray-light-dark-transparent {
    background-image: linear-gradient(to top, #f7f7f7 0%, transparent 100%);
}

/* MEDIA QUERY */
@media (max-width: 1399px) {
    .xl-h-180px {
        height: 180px;
    }
    .xl-w-180px {
        width: 180px;
    }
    wc-hero-name {
        font-size: 95px;
        line-height: 98px;
    }
    .wc-hero-role span {
        font-size: 65px;
        line-height: 68px;
    }
}
@media (max-width: 1199px) {
    .outside-box-top-200px {
        margin-top: -150px;
    }
    .fs-220 {
        font-size: 5.5rem;
        line-height: 5.5rem;
    }
    .fs-280 {
        font-size: 15rem;
        line-height: 15rem;
    }
    .wc-hero-name {
        font-size: 85px;
        line-height: 88px;
    }
    .wc-hero-role span {
        font-size: 55px;
        line-height: 58px;
    }
}
@media (max-width: 991px) {
    .outside-box-top-200px {
        margin-top: 0;
    }
    .navbar .navbar-nav .dropdown.open .dropdown-menu {
        padding-bottom: 15px;
    }
    .navbar .navbar-nav .dropdown .dropdown-menu.show {
        background-color: var(--primary-color);
    }
    .fs-220 {
        font-size: 7rem;
        line-height: 7rem;
    } 
    .fs-280 {
        font-size: 12rem;
        line-height: 12rem;
    }
    .wc-hero-name {
        font-size: 75px;
        line-height: 76px;
    }
    .wc-hero-role span {
        font-size: 45px;
        line-height: 45px;
    }
}
@media (max-width: 767.98px) {
    .people-saying h3 {
        text-wrap: wrap;
    }
    .people-saying h3 span {
        display:block;
    }
    .winston-abt img {
        max-width: 100%;
        float: none;
        margin-right: 0;
        margin-bottom: 20px;
    }
    footer .quik-links {
        display: block;
        text-align: center;
    }
    footer .quik-links li {
        display: list-item;
    }
    .footer-socials {
        text-align: center;
        margin-top: 20px;
    }

}

@media (max-width: 575px) {
    .fs-220 {
        font-size: 4.625rem;
        line-height: 4.625rem;
    } 
    .fs-280 {
        font-size: 8rem;
        line-height: 8rem;
    }
}

/* BREADCRUMBS STYLES */
.breadcrumb {
    font-size: 14px;
    margin-bottom: 20px;
    color: #666;
}

.breadcrumb ol {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
}

.breadcrumb li {
    display: inline;
}

.breadcrumb li:not(:last-child)::after {
    content: " / "; /* This is the separator */
    padding: 0 8px;
    color: var(--secondary-color);
}

.breadcrumb a {
    text-decoration: none;
    color: var(--primary-color);
}

.breadcrumb a:hover {
    text-decoration: underline;
}


/* NAV MENU DESCRIPTION STYLE */

/* Stack title and description vertically inside the link */
.nav-link, .dropdown-menu a {
    flex-direction: column;
    justify-content: center;
    gap: 1px; /* Space between title and description */
}

.dropdown-menu a {
    align-items: start !important;
}

/* Style for the main title */
/* .menu-item-title {
    font-weight: 600;
    line-height: 1.3;
} */
 
.wc-about-bio ul li {
    list-style: disc !important;
    text-align: start;
}

/* Style for the description text */
.menu-item-description {
    font-size: 8px;
    font-weight: 600;
    line-height: 10px;
    color: #fff;
}

.nav-link .menu-item-description {
    background-color: red;
    padding: 2px 3px;
    border-radius: 3px;
}
.dropdown-menu a .menu-item-description {
    font-size: 12px;
    line-height: 14px;
}

/* Hover effect for description */
.nav-link:hover .menu-item-description,
.dropdown-menu a:hover .menu-item-description {
    background-color: var(--secondary-color);
    /* opacity: .6; */
}

/* Optional: Prevent description from breaking layout on mobile */
@media (max-width: 991px) {
    .menu-item-description {
        font-size: 9px;
    }
}
