/*
Theme Name: nkp
Theme URI: https://nkp.rs
Description: Custom child theme
Author: Vuk Nikolic
Author URI: https://www.linkedin.com/in/nikolicv/
Version: 1.0.0
Template: Divi
*/

/* global stuff */
b {
    font-weight: 600;
}
p, span {
    line-height: 22px;
}
/* end global stuff */

/* Homepage news Slider read more button */
#page-container #news-slider .et_pb_button.dp-dfg-more-button {
    padding: 2px 24px!important;
}
/* Homepage our people slider - icons */
.slider-icon-custom > .et_pb_icon_wrap {
    cursor: pointer;
}
.et-pb-icon.disabled {
    color: lightgrey!important;
}
/* --- Homepage our people slider - icons END ---- */


/* Homepage menu change bg color when scrolled and disappear / appear*/
.menu-homepage-dark-bg {
    background-color: rgba(0, 0, 0, 0.9);
}
.menu-homepage-disappear {
    opacity: 0!important;
    transition: opacity 0.3s
}
#main-menu-home-change-bg {
    transition: opacity 0.3s;
    opacity: 1;
}
/* end homepage menu stuff */

/* HUGE SCREENS */
@media screen and (min-width: 2180px) {
    h1 {
        font-size: 80px!important;
    }
    h2 {
        font-size: 62px!important;
    }
    .homepage-logo img {
        height: 80px!important;
    }
    .homepage-about-text {
        max-width: 50%!important;
    }

/*   main menu */
    .main-menu-logo img {
        height: 40px!important;
    }
    .main-menu-text-1 {
        margin-top: 10px!important;
    }
    .main-menu-text-2 {
        font-size: 22px!important;
    }
    .main-menu-text-2-sub-div > div {
        padding-top: 10px!important;
    }
}

/* hack for displaying about us section in homepage properly. Also hack for smaller expertise titles letters on mobile*/
/* buttons on small screens as well */
@media screen and (max-width: 1920px) {
    .about-us-homepage-row {
        padding-left: 72px!important;
        padding-right: 72px!important;
    }
}
@media screen and (max-width: 980px) {
    .about-us-homepage-row {
        margin-left: 0!important;
        margin-right: 0!important;
        padding-left: 48px!important;
        padding-right: 48px!important;
    }

    #title-items .dg-cpt-outer-wrap {
        height: 20px;
    }

    .et_pb_button, .dg-cpt-read-more > span {
        font-size: 12px!important;
    }
    .dg-cpt-read-more > span {
        display: block!important;
        height: 100%!important;
    }
    .dg-cpt-read-more {
        height: 26px!important;
    }
}
/* end hack for about us*/

/* smaller screens css shenanigans (Nest Hub) */
@media screen and (min-width: 981px) and (max-width: 1280px) {
    h1 {
      font-size: 48px!important;
    }
    h2 {
        font-size: 36px;
    }
    .main-menu-text-1 p {
        font-size: 10px!important;
    }
    .homepage-about-text {
        max-width: 100%!important;
    }
    .et_pb_button, .dg-cpt-read-more > span {
        font-size: 12px!important;
    }
    .dg-cpt-read-more > span {
        display: block!important;
        height: 100%!important;
    }
    .dg-cpt-read-more {
        height: 26px!important;
    }
    #cpt-grid-news h2, #our-people-carousel h2 {
        font-size: 24px!important;
    }
    #cpt-grid-news .dg-cpt-date-wrap {
        font-size: 14px!important;
    }
    #news-section {
        padding-bottom: 100px!important;
    }
}

/* Ultra small screens */
@media screen and (max-width: 390px) {
    p {
        font-size: 12px!important;
    }
}
/* end ultra small screens*/

/* MENU */
/* change columns width on small screens (custom width because of the menu layout)*/
@media (max-width: 1140px) {
    .menuColumn1 {
        width: 90%!important;
    }
    .menuColumn2 {
        width: 10%!important;
    }
    .big-screen-menu {
        display: none!important;
    }
}
.huge-menu-overlay {
    z-index: 999;
    position: fixed!important;
    top: 0!important;
    right: -100vw;
    width: 100vw;
    transition: right 0.3s;
    height: 100vh;
}
.huge-menu-overlay.active {
    right: 0;
    transition: right 0.3s
}
/*show desktop menu*/
.horizontal-menu .et_pb_menu__menu {
    display: flex!important;
    flex-grow: 1;
    width: 100%!important;
}
.horizontal-menu .et_mobile_nav_menu {
    display: none!important;
}
.horizontal-menu nav {
    width: 100%!important;
}
.horizontal-menu ul {
    display: flex;
    flex-direction: row;
    align-items: center!important;
    width: 100%;
}
.horizontal-menu ul li {
    display: flex;
}
/* Fixing phone number color in iphone safari */
.et_pb_text_inner a[href^="tel"],
.et_pb_text_inner a[x-apple-data-detectors],
.et_pb_bg_layout_dark .et_pb_text_inner a[href^="tel"] {
    color: inherit !important;
    text-decoration: none !important;
    -webkit-text-fill-color: inherit !important;
    pointer-events: none;
}
/* end fixing phone number color */
/* END MENU */

/* news card */
#cpt-grid-news h2, #cpt-carousel-news h2, #news-page-grid h2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    /* autoprefixer: ignore next */
    -webkit-box-orient: vertical;
    line-height: 32px;
}
#cpt-grid-news .dg-cpt-button-wrap a, #cpt-carousel-news .dg-cpt-button-wrap a {
    font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif;
    font-size: 14px!important;
    font-weight: 500;
    padding: 0 24px;
    max-width: 140px;
    text-align: center;
    border: 1px solid #000000;
    border-radius: 50px;
    height: 30px;
    transition: max-width 0.2s;
}
#cpt-grid-news .dg-cpt-button-wrap a:hover, #cpt-carousel-news .dg-cpt-button-wrap a:hover {
    max-width: 160px;
    transition: max-width 0.2s;
}
#cpt-grid-news, #cpt-carousel-news {
    margin-bottom: 0!important;
}
#cpt-grid-news article, #cpt-carousel-news article {
    padding-bottom: 0!important;
}
/* news card end*/

/* Team members - separate lines of text in biography */
.team-member-biography-text-separator p {
    margin-bottom: 24px;
}

/* Our people slider homepage */
#our-people-carousel .dg-item-wrap {
    margin-bottom: 0;
}
#our-people-carousel h2 {
    padding-top: 8px;
    padding-bottom: 2px;
}
/* end our people slider*/

/* Expertise */
/* all article elements should have height of the content */
.layout-grid .dg-cpt-item {
    height: auto!important;
}
/* expertise end */

/* News page */
#news-page-grid img {
    object-fit: cover;
}
/* News page end */

/* News Article */
.custom-post-content p {
    margin-bottom: 10px;
    text-align: justify;
}
/* end news article */


/* March 2026 updates */
/* news grid custom date style */
#homepage-news-grid-with-custom-date .dg-cpt-inner-wrap {
    display: flex!important;
    flex-direction: row!important;
    align-items: flex-start!important;
    flex-shrink: 0!important;
    width: auto!important;
}

#homepage-news-grid-with-custom-date .dg-cpt-date-wrap {
    display: flex!important;
    flex-direction: column!important;
    align-items: flex-start!important;
    margin-right: 16px!important;
    text-align: left!important;
    gap: 0!important;
}

#homepage-news-grid-with-custom-date .date-day {
    font-size: 62px!important;
    font-weight: 500!important;
    font-family: 'Didot', Helvetica, Arial, Lucida, sans-serif!important;
    line-height: 1!important;
    margin-left: 6px!important;
}

#homepage-news-grid-with-custom-date .date-month-year {
    font-size: 14px!important;
    font-weight: 400!important;
    line-height: 1.2!important;
    margin: 0!important;
}

#homepage-news-grid-with-custom-date .dg-cpt-title-wrap {
    flex: 1!important;
}
.dg-item-wrap {
    margin-bottom: 0!important;
}
/* end news grid custom date style */

/* Google Maps - Hide UI controls */
.et_pb_map_container a[title="Toggle fullscreen view"],
.et_pb_map_container .gm-style-mtc,
.et_pb_map_container .gm-svpc,
.et_pb_map_container .gm-control-active,
.et_pb_map_container .gmnoprint,
.et_pb_map_container .gm-style-cc,
.et_pb_map_container a[href^="https://maps.google.com/maps"],
.et_pb_map_container div[style*="background-image"][title="Google"] {
    display: none!important;
}
/* end Google Maps controls */

/* custom our people grid with 8 columns */
#custom-eight-column-grid-wrapper .dg-cpts-wrap {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 8px;
}
#custom-eight-column-grid-wrapper .dg-cpts-wrap article {
    width: 100%;
}
/* end custom our people grid with 8 columns*/

/* team member grid view - fix spacing between the image and the persons name */
.dp-dfg-cf-team_member_title_value {
    font-size: 0!important;
}
/* end team member grid view */

/* header - bottom menu - prevent from turning into burger*/
@media (max-width: 980px) {
    #header-bottom-menu .et_pb_menu__menu {
        display: block !important;
    }
    #header-bottom-menu .et_mobile_nav_menu {
        display: none !important;
    }
    /* Optional: Ensure menu items are horizontal if space allows */
    #header-bottom-menu #top-menu li {
        display: inline-block;
    }
}
/* end */

/* header slider */
#main-slider {
    height: calc(100vh - 88px - 126px) /* 88px - height of menu & logo part on large screens, 126px - height bottom white section */
}
#main-slider div {
    border: 0;
    height: calc(100vh - 88px - 126px); /* 88px - height of menu & logo part on large screens, 126px - height bottom white section */
    max-width: 100%!important;
    width: 100%;
    padding: 0!important;
}
#main-slider img {
    height: calc(100vh - 88px - 126px); /* 88px - height of menu & logo part on large screens, 126px - height bottom white section */
    max-width: 100%!important;
    max-height: 100%!important;
    width: 100%;
    object-fit: cover!important;
}
#main-slider .et-pb-controllers {
    height: 40px;
    position: absolute;
    bottom: 0;
    z-index: 10;
}
#main-slider .et-pb-controllers a {
    background-color: hsla(0, 0%, 100%, .5);
    border: 2px solid #fff!important;
    border-radius: 16px;
    height: 16px;
    width: 16px;
}
#main-slider .et-pb-active-control {
    background-color: #fff!important;
}

@media (max-width: 980px) {
    #main-slider {
        height: calc(100vh - 82px) /* 88px - height of menu & logo part on large screens */
    }
    #main-slider div {
        height: calc(100vh - 82px) /* 88px - height of menu & logo part on large screens */
    }
    #main-slider img {
        height: calc(100vh - 82px); /* 88px - height of menu & logo part on large screens */
    }
}
/* end */

/* team-member page - image style */
#team-member-image {
    max-height: 80%;
}
#team-member-image span, #team-member-image img {
    max-height: 100%;
}
/* end*/

/* sub-menu css */
.menu-item-has-children > a {
    font-weight: normal!important;
}

.sub-menu {
    border: none!important;
    padding: 20px 0;
    box-shadow: none!important;
    min-width: 300px;
    left: -60px!important;
}

.sub-menu li {
    padding: 0;
}

.sub-menu li a {
    color: #1a1a1a;
    padding: 12px 30px;
    display: block;
    text-decoration: none;
    font-size: 16px;
    line-height: 1.5;
    min-width: 300px;
}

.sub-menu li a:hover {
    background-color: #f5f5f5;
}
/* end */

/* Proper Collapsable Mobile Menu */
/* Style the icon's placeholder */
#mobile_menu1 {
    border-top: none!important;
}

ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
ul.et_mobile_menu li.page_item_has_children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.page_item_has_children .mobile-toggle {
    width: 44px;
    height: 100%;
    padding-top: 8px!important;
    max-height: 36px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 999;
    background-color: transparent;
    border-bottom: 0;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

ul.et_mobile_menu > li.menu-item-has-children,
ul.et_mobile_menu > li.page_item_has_children,
ul.et_mobile_menu > li.menu-item-has-children .sub-menu li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu > li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu > li.page_item_has_children,
.et-db #et-boc .et-l ul.et_mobile_menu > li.menu-item-has-children .sub-menu li.menu-item-has-children {
    position: relative;
}

.et_mobile_menu .menu-item-has-children > a,
.et-db #et-boc .et-l .et_mobile_menu .menu-item-has-children > a {
    background-color: transparent;
}

/* Hide the Sub-menu */
ul.et_mobile_menu .menu-item-has-children .sub-menu,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu {
    display: none !important;
    visibility: hidden !important;
}

/* Show the sub-menu when the + icon is clicked */
ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible {
    display: block !important;
    visibility: visible !important;
    max-height: 60vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

/* Create the opening/closing icon using the SVG Icons */
ul.et_mobile_menu li.menu-item-has-children .mobile-toggle .dt-icons,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle .dt-icons {
    display: block;
}

/* Hide the closing icon if the sub-menu is not open */
ul.et_mobile_menu li.menu-item-has-children:not(.dt-open) .mobile-toggle .dt-close-icon,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children:not(.dt-open) .mobile-toggle .dt-close-icon {
    display: none;
}

/* Hide the opening icon if the sub-menu is open */
ul.et_mobile_menu li.menu-item-has-children.dt-open > .mobile-toggle .dt-open-icon,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children.dt-open > .mobile-toggle .dt-open-icon {
    display: none;
}

/* Make icons more subtle on tablet and mobile */
@media (max-width: 980px) {
    ul.et_mobile_menu li.menu-item-has-children .mobile-toggle .dt-icons,
    .et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle .dt-icons {
        opacity: 0.4;
    }
}

/* Hide icons completely on large screens (desktop) */
@media (min-width: 981px) {
    .mobile-toggle {
        display: none !important;
    }
}
/* End Proper Collapsable Mobile Menu */

/* Homepage hero image */
#hero-image-homepage {
    position: relative;
}

#hero-image-homepage::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 5px);
    background-color: rgba(0, 0, 0, 0.3);
    pointer-events: none;
    z-index: 1;
}
/* End homepage hero image*/

/* Homepage - fix for contact section for small screens */
@media (max-width: 980px) {
    .contact-info-label {
        width: 100px!important
    }
}
/* End Homepage fix for contact section for small screens*/

/* Body hack for horizontal scroll */
body {
    overflow-x: hidden!important;
}
/* End body hack for horizontal scroll*/
/* End March 2026 updates*/