/** 
  @ Staff Page Styles
  -------------------------------
*/

.wdt-staff-archive-wrapper { display: flex; flex-wrap: wrap; --ser-gap: 30px; gap: var(--ser-gap); }

.wdt-staff-archive-wrapper.wdt-columns-5 > .wdt-staff-item { flex: 0 0 calc(20% - calc(var(--ser-gap) / 1.25)); }
.wdt-staff-archive-wrapper.wdt-columns-4 > .wdt-staff-item { flex: 0 0 calc(25% - calc(var(--ser-gap) / 1.333)); }
.wdt-staff-archive-wrapper.wdt-columns-3 > .wdt-staff-item { flex: 0 0 calc(33.3333% - calc(var(--ser-gap) / 1.5)); }
.wdt-staff-archive-wrapper.wdt-columns-2 > .wdt-staff-item { flex: 0 0 calc(50% - calc(var(--ser-gap) / 2)); }
.wdt-staff-archive-wrapper.wdt-columns-1 > .wdt-staff-item { flex: 0 0 100%; }


/** 
    Common 
*/

.wdt-staff-item { border-color: transparent; border-style: solid; border-width: 0; position: relative; z-index: 0; }

.wdt-staff-item, 
.wdt-staff-item .wdt-staff-image > a, 
.wdt-staff-item .wdt-staff-image img,
.wdt-staff-item a, 
.wdt-staff-item .wdt-staff-title h5, 
.wdt-staff-item .wdt-staff-title h5 > a { 
    -webkit-transition: var(--wdt-Safe-Transition); transition: var(--wdt-Safe-Transition); }

.wdt-staff-item > div:empty { display: none; }

.wdt-staff-item > div:not(:last-child),
.wdt-staff-item .wdt-staff-image > div:not(:last-child) { margin-bottom: 14px; }


/** 
    Image Element 
*/

.wdt-staff-item .wdt-staff-image { position: relative; }

.wdt-staff-item .wdt-staff-image,
.wdt-staff-item .wdt-staff-image > a { display: inline-flex; }

.wdt-staff-item .wdt-staff-image > a > img { height: inherit; align-self: start; -webkit-border-radius: inherit; border-radius: inherit; }


/** 
    Title & Title Element Group 
*/

.wdt-staff-item .wdt-staff-title h5 {     
    display: block; font-family: var(--wdtFontTypo_Alt); font-size: clamp(1.5rem, 1.4333rem + 0.3681vw, 1.875rem); /*30px - 24px*/ 
    font-weight: var(--wdtFontWeight_Alt); margin-top: 0px; margin-bottom: 0; text-transform: capitalize; }

.wdt-staff-item .wdt-staff-title h5, 
.wdt-staff-item .wdt-staff-title h5 a { pointer-events: all; color: var(--wdtAccentTxtColor); }
.wdt-staff-item .wdt-staff-title h5 a:hover { color: var(--wdtLinkHoverColor); }

.wdt-dark-bg .wdt-staff-item .wdt-staff-title h5, 
.wdt-dark-bg .wdt-staff-item .wdt-staff-title h5 a:not(:hover) { color: var(--wdt-elementor-color-white); }


/** 
    Content & Description Element 
*/

.wdt-staff-item .wdt-staff-description { position: relative; z-index: 0; }

/** 
    Button Element 
*/

.wdt-staff-item .wdt-staff-button { position: relative; z-index: 0; }

.wdt-staff-item .wdt-staff-button > a { border: 1px solid transparent; background-color: var(--wdt-elementor-color-accent); 
    color: var(--wdt-elementor-color-white); fill: var(--wdt-elementor-color-white); display: inline-block; line-height: 1; 
    font-size: 1em; padding: 0.75em 1.5em; text-align: center; -webkit-border-radius: var(--wdtRadius_Zero); border-radius: var(--wdtRadius_Zero); }

.wdt-staff-item .wdt-staff-button > a:hover { background-color: var(--wdtSecondaryColor); }


/** 
    Pagination Element
*/

.wdt-services-holder .wdt-pagination { flex: 0 0 100%; margin: 40px 0 0; text-align: center; }
.wdt-services-holder .wdt-pagination ul { list-style-type: none; padding: 0; margin: 0; display: inline-flex; margin: -4px; }
.wdt-services-holder .wdt-pagination ul li { margin: 4px; padding: 0px; }
.wdt-services-holder .wdt-pagination ul li a, 
.wdt-services-holder .wdt-pagination ul li span {     
    width: 50px; height: 50px; padding: 5px; font-size: calc(var(--wdtFontSize_H6) - 2px); 
    font-weight: var(--wdtFontWeight_Ext); background-color: transparent; 
    color: var(--wdt-elementor-color-primary); display: inline-flex; align-items: center; 
    justify-content: center; -webkit-border-radius: var(--wdtRadius_Part); border-radius: var(--wdtRadius_Part); }
  
.wdt-services-holder .wdt-pagination ul li a.current, .wdt-services-holder .wdt-pagination ul li span.current,
.wdt-services-holder .wdt-pagination ul li a:hover, .wdt-services-holder .wdt-pagination ul li span:hover {
    background-color: var(--wdtPrimaryColor, var(--wdt-elementor-color-accent)); color: var(--wdt-elementor-color-white); }


/* ---------------------------------------------------------------------
 === Service Listing ===
--------------------------------------------------------------------- */

.wdt-staff-item { 
    position: relative; overflow: hidden; display: grid; align-items: end;     
    -webkit-border-radius: var(--wdtRadius_4X); border-radius: var(--wdtRadius_4X); }
.wdt-staff-item .wdt-staff-image,
.wdt-staff-item .wdt-staff-details {     
    grid-area: 1 / -1; position: relative; overflow: hidden; }
.wdt-staff-item > div:not(:last-child) { margin-bottom: 0; }


/* Media Group Styles */

.wdt-staff-item .wdt-staff-image a { position: relative; overflow: hidden; }

.wdt-staff-item .wdt-staff-image a:after {
    content: ''; position: absolute; width: calc(100% + 10%); height: calc(100% + 10%); 
    top: -10%; right: -10%; bottom: -10%; left: -10%;
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 40%, rgba(var(--wdtHeadAltColorRgb), 0.8) 80%); 
    background-size: 100% 100%, 100% 100%; background-position: 100% 100%, 100% 100%; 
    background-repeat: no-repeat; -webkit-transition: var(--wdt-Safe-Transition); 
    transition: var(--wdt-Safe-Transition); opacity: 0; visibility: hidden; margin: auto; }

.wdt-staff-item:hover .wdt-staff-image a:after { 
    background-size: 100% 120%, 100% 100%; opacity: 1; visibility: visible; }

.wdt-staff-item .wdt-staff-image a img {
    display: block; width: 100%; max-width: 100%; min-width: 100px; height: 100%; object-fit: cover; 
    object-position: center center; scale: 1; -webkit-transition: var(--wdt-Safe-Transition); 
    transition: var(--wdt-Safe-Transition); }

.wdt-staff-item:hover .wdt-staff-image a img {
    -webkit-transform: scale(1.1); transform: scale(1.1); }


/* Detail Group Styles */

.wdt-staff-item .wdt-staff-details { 
    position: relative; pointer-events: none; padding: clamp(1.25rem, 1.1388rem + 0.6135vw, 1.875rem); /*30px - 20px*/ 
    display: flex; align-items: flex-end; justify-content: space-between; }

.wdt-staff-item .wdt-staff-details > div:not(:last-child) { margin-right: 12px; }

.wdt-staff-item .wdt-staff-details .wdt-staff-content-group > div:not(:last-child) { margin-bottom: 12px; }

.wdt-staff-item .wdt-staff-details .wdt-staff-sub-title {     
    font-size: var(--wdtFontSize_Base); font-weight: var(--wdtFontWeight_Ext); line-height: var(--wdtLineHeight_Alt); 
    letter-spacing: 0; text-transform: capitalize; color: var(--wdtAccentTxtColor); }

.wdt-staff-item .wdt-staff-details .wdt-staff-social-icons {
    display: flex; flex-direction: column; align-items: center; margin: -5px; }

.wdt-staff-item .wdt-staff-details .wdt-staff-social-icons a { 
    position: relative; pointer-events: all; overflow: hidden; display: inline-flex; justify-content: center; align-items: center; 
    width: clamp(2.5rem, 2.3888rem + 0.6135vw, 3.125rem); /*50px - 40px*/ 
    height: clamp(2.5rem, 2.3888rem + 0.6135vw, 3.125rem); /*50px - 40px*/ 
    font-size: clamp(1rem, 0.9555rem + 0.2454vw, 1.25rem); /*20px - 16px*/ 
    background-color: var(--wdtPrimaryColor); color: var(--wdtAccentTxtColor); padding: 8px; 
    -webkit-transition: var(--wdt-Safe-Transition); transition: var(--wdt-Safe-Transition); 
    -webkit-border-radius: var(--wdtRadius_Part); border-radius: var(--wdtRadius_Part); margin: 5px; }

.wdt-staff-item .wdt-staff-details .wdt-staff-social-icons a:hover { 
    background-color: var(--wdtAccentTxtColor); color: var(--wdtHeadAltColor); }


/* On Hover Styles */

.wdt-staff-item .wdt-staff-details .wdt-staff-sub-title,
.wdt-staff-item .wdt-staff-details .wdt-staff-title,
.wdt-staff-item .wdt-staff-details .wdt-staff-social-icons .wdt-staff-social-item {
    -webkit-transform: translateX(15px) scaleX(1.5); transform: translateX(15px) scaleX(1.5); 
    transform-origin: center left; -webkit-transition: var(--wdt-Safe-Transition); 
    transition: var(--wdt-Safe-Transition); opacity: 0; visibility: hidden; 
    backface-visibility: hidden; will-change: transform; }

.wdt-staff-item:hover .wdt-staff-details .wdt-staff-sub-title,
.wdt-staff-item:hover .wdt-staff-details .wdt-staff-title,
.wdt-staff-item:hover .wdt-staff-details .wdt-staff-social-icons .wdt-staff-social-item {
    -webkit-transform: translateX(0px) scaleX(1); transform: translateX(0px) scaleX(1); 
    -webkit-transition: var(--wdt-Safe-Transition); transition: var(--wdt-Safe-Transition);
    opacity: 1; visibility: visible; backface-visibility: hidden; will-change: transform; }

.wdt-staff-item:hover .wdt-staff-details .wdt-staff-sub-title { transition-delay: .05s; }
.wdt-staff-item:hover .wdt-staff-details .wdt-staff-title { transition-delay: .1s; }
.wdt-staff-item:hover .wdt-staff-details .wdt-staff-social-icons .wdt-staff-social-item:nth-child(1) { transition-delay: .15s; }
.wdt-staff-item:hover .wdt-staff-details .wdt-staff-social-icons .wdt-staff-social-item:nth-child(2) { transition-delay: .2s; }
.wdt-staff-item:hover .wdt-staff-details .wdt-staff-social-icons .wdt-staff-social-item:nth-child(3) { transition-delay: .25s; }
.wdt-staff-item:hover .wdt-staff-details .wdt-staff-social-icons .wdt-staff-social-item:nth-child(4) { transition-delay: .3s; }



/* ---------------------------------------------------------------------
 === Service Detail ===
--------------------------------------------------------------------- */

.wdt_staff_single-wrapper .wdt-staff-single-header { 
    position: relative; display: flex; background-color: var(--wdtAccentTxtColor); 
    -webkit-border-radius: var(--wdtRadius_4X); border-radius: var(--wdtRadius_4X); 
    margin-bottom: clamp(1.5625rem, 1.1733rem + 2.1472vw, 3.75rem); /*60px - 25px*/ }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-image { width: 50%; }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-image img { 
    width: 100%; height: 100%; object-fit: cover; object-position: center; 
    -webkit-border-radius: var(--wdtRadius_4X) 0 0 var(--wdtRadius_4X); 
    border-radius: var(--wdtRadius_4X) 0 0 var(--wdtRadius_4X); }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details { 
    width: 50%; padding: clamp(1.875rem, 1.5414rem + 1.8405vw, 3.75rem); /*60px - 30px*/ }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details .wdt-staff-single-wrapper { 
    position: sticky; top: 0px; height: fit-content; }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details .wdt-staff-role { 
    position: relative; overflow: hidden; display: inline-flex; font-size: var(--wdtFontSize_Ext); 
    font-weight: var(--wdtFontWeight_Ext); line-height: 1; letter-spacing: 0; text-transform: uppercase; 
    color: var(--wdtHeadAltColor); padding: var(--wdtPadding_MiniBtn); border: 1px solid var(--wdtBorderColor); 
    -webkit-border-radius: var(--wdtRadius_Part); border-radius: var(--wdtRadius_Part); }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details .wdt-staff-single-wrapper > div.wdt-staff-role:not(:last-child) {
    margin-bottom: clamp(1rem, 0.9555rem + 0.2454vw, 1.25rem); /*20px - 16px*/ }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details .wdt-staff-single-wrapper > div:not(:last-child) { 
    margin-bottom: 22px; }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details h4,
.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details h6 { margin: 0; }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details h4.wdt-staff-name {
    font-family: var(--wdtFontTypo_Alt); font-size: clamp(1.875rem, 1.7638rem + 0.6135vw, 2.5rem); /*40px - 30px*/ 
    font-weight: var(--wdtFontWeight_Alt); text-transform: capitalize; 
    margin-bottom: clamp(0.75rem, 0.7055rem + 0.2454vw, 1rem); /*16px - 12px*/ }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details .wdt-staff-description { 
    margin-bottom: clamp(1.5rem, 1.4333rem + 0.3681vw, 1.875rem); /*30px - 24px*/ }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] {
    display: grid; grid-template-columns: repeat(3, 1fr); align-items: center; gap: 15px; }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > h6:first-child {
    grid-column: 1 / 2; }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > p:last-child,
.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > a:last-child,
.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > div:last-child {
    grid-column: 2 / 4; color: var(--wdtHeadAltColor); }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > p {
    margin-bottom: 0; }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > h6 {
    font-family: var(--wdtFontTypo_Alt); font-size: var(--wdtFontSize_Base); font-weight: var(--wdtFontWeight_Alt); 
    line-height: var(--wdtLineHeight_Alt); text-transform: uppercase; color: var(--wdtHeadAltColor); }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > p,
.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > a {
    font-family: var(--wdtFontTypo_Base); font-size: var(--wdtFontSize_Base); font-weight: var(--wdtFontWeight_Ext); 
    line-height: var(--wdtLineHeight_Alt); text-transform: capitalize; color: var(--wdtHeadAltColor); }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > a:hover {
    color: var(--wdtLinkHoverColor); }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] .wdt-staff-social-items {
    margin: -2px; margin-left: -8px; }

.wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] .wdt-staff-social-items a {
    font-size: var(--wdtFontSize_Base); margin: 2px; }


/* For Contact Form */

.wdt_staff_single-wrapper .wdt-staff-single-content .wdt-contact-form .wdt-button-holder { justify-content: center; }


/* ---------------------------------------------------------------------
 === Responsive ===
--------------------------------------------------------------------- */

@media only screen and (min-width:1025px) and (max-width:1280px) {
    .wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] {
        grid-template-columns: repeat(2, 1fr); }
}

@media only screen and (min-width:768px) and (max-width:1024px) {
    .wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] {
        grid-template-columns: 1fr; }
    .wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > h6:first-child,
    .wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > p:last-child, 
    .wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > a:last-child, 
    .wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > div:last-child { 
        grid-column: unset; }
}

@media only screen and (max-width: 767px) { 
    .wdt_staff_single-wrapper .wdt-staff-single-header { flex-direction: column; }
    .wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-image,
    .wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details { width: 100%; }
    .wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] {
        grid-template-columns: repeat(2, 1fr); }
    .wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-image img {
        -webkit-border-radius: var(--wdtRadius_4X) var(--wdtRadius_4X) 0 0;
        border-radius: var(--wdtRadius_4X) var(--wdtRadius_4X) 0 0; }
}

@media only screen and (max-width: 479px) {
    .wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] {
        grid-template-columns: 1fr; }
    .wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > h6:first-child,
    .wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > p:last-child, 
    .wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > a:last-child, 
    .wdt_staff_single-wrapper .wdt-staff-single-header .wdt-staff-single-details div[class*="wdt-staff-info-"] > div:last-child { 
        grid-column: unset; }
}