.elementor-kit-4769{--e-global-color-primary:#F8F9FA;--e-global-color-secondary:#000000;--e-global-color-text:#000000;--e-global-color-accent:#C9A24D;--e-global-typography-primary-font-family:"Plus Jakarta Sans";--e-global-typography-primary-font-size:40px;--e-global-typography-primary-font-weight:600;--e-global-typography-primary-line-height:40px;--e-global-typography-primary-letter-spacing:-0.5px;--e-global-typography-secondary-font-family:"Open Sans";--e-global-typography-secondary-font-size:16px;--e-global-typography-secondary-font-weight:400;--e-global-typography-secondary-line-height:16px;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;color:#000000;}.elementor-kit-4769 e-page-transition{background-color:#FFBC7D;}.elementor-kit-4769 h1{color:#000000;}.elementor-kit-4769 h2{color:#000000;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* TARGETED FIX FOR NEWS SECTION AUTHOR WITH SPACING */

/* 1. Hide original author text */
.news-content .elementor-post__meta-data .elementor-post-author,
.news-content .elementor-post__meta-data .elementor-post-author a {
    font-size: 0 !important;
    color: transparent !important;
    visibility: hidden !important;
    line-height: 0 !important;
}

/* 2. Inject Brand Name + Padding for Space */
.news-content .elementor-post__meta-data .elementor-post-author::before {
    content: "Expat Mortgage News";
    visibility: visible !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #a38a4d !important;
    display: inline-block !important;
    line-height: 1.2 !important;
    
    /* ADDED SPACING */
    padding-right: 12px !important; /* Adjust this value to match the date spacing */
    border-right: 1px solid #ddd;   /* Optional: adds a tiny divider line like standard blog meta */
    margin-right: 12px !important;
}

/* 3. Handle 'By' prefix and Icon */
.news-content .elementor-post__meta-data .elementor-post-author-by {
    display: none !important;
}

.news-content .elementor-post__meta-data .elementor-post-author i {
    visibility: visible !important;
    font-size: 12px !important;
    color: #a38a4d !important;
    margin-right: 5px !important;
}

/* 4. Remove the border-right from the last item if you used the divider above */
.news-content .elementor-post__meta-data .elementor-post-author::before {
    border-right: none !important; /* Remove this line if you WANT a vertical divider */
}

/* 1. MAIN CONTAINER - Sets the 3D space */
.team-about-card-container {
    position: relative;
    width: 100%;
    height: 250px !important; 
    perspective: 1000px; /* Essential for 3D depth */
    margin-bottom: 20px;
    font-family: 'Poppins', sans-serif;
    background-color: transparent !important;
}

/* 2. INNER WRAPPER - The element that actually rotates */
.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    transform-style: preserve-3d;
    cursor: pointer;
}

/* Trigger class for the flip (applied via HTML onclick) */
.team-about-card-container.flipped .flip-card-inner {
    transform: rotateY(180deg);
}

/* 3. SHARED FACE STYLES */
.flip-card-front, .flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden; /* Safari */
    backface-visibility: hidden;
    border-radius: 8px;
    padding: 30px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-sizing: border-box;
}

/* 4. FRONT SIDE STYLING */
.flip-card-front {
    background-color: #b5a47e;
    color: #ffffff;
    z-index: 2;
}

.team-about-card-info {
    position: relative;
    z-index: 2;
    max-width: 55%; /* Keeps text from touching the photo */
    display: flex;
    flex-direction: column;
}

.team-about-card-info h4 {
    margin: 0;
    font-size: 26px;
    line-height: 1.1;
    color: #ffffff !important;
    font-weight: 600;
}

.team-about-card-info p {
    margin: 5px 0 0 0;
    line-height: 1.2;
    color: #ffffff;
    font-size: 15px;
}

/* 5. PHOTO POSITIONING */
.team-about-card-photo {
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    width: 170px !important; 
    height: 170px !important;
    object-fit: cover;
    border-radius: 50% !important;
}

/* 6. READ MORE BUTTON */
.read-more-btn {
    background-color: transparent;
    border: 1px solid #ffffff;
    color: #ffffff;
    padding: 6px 14px;
    margin-top: 15px;
    border-radius: 4px;
    font-size: 13px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-family: 'Poppins', sans-serif;
    width: fit-content;
}

.read-more-btn:hover {
    background-color: #ffffff;
    color: #b5a47e;
}

/* 7. BACK SIDE STYLING (Bio Text) */
.flip-card-back {
    background-color: #9c8b66; 
    color: #ffffff;
    transform: rotateY(180deg); /* Pre-rotated to face the back */
    z-index: 1;
    text-align: left;
    overflow-y: auto; /* Scrollable for long text */
}

.flip-card-back h4 {
    font-size: 20px;
    margin: 0 0 10px 0;
    font-weight: 600;
    color: #ffffff;
}

.flip-card-back p {
    font-size: 13px;
    line-height: 1.5;
    margin: 0;
}

/* Custom Scrollbar for Back Side */
.flip-card-back::-webkit-scrollbar {
    width: 4px;
}
.flip-card-back::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.3);
    border-radius: 10px;
}

/* 8. MOBILE RESPONSIVENESS */
@media (max-width: 767px) {
    .team-about-card-container { height: 220px !important; }
    .flip-card-front, .flip-card-back { padding: 20px !important; }
    
    .team-about-card-info h4 { font-size: 20px; }
    
    .team-about-card-photo { 
        width: 100px !important; 
        height: 100px !important; 
        right: 15px !important;
    }
    
    .read-more-btn { margin-top: 10px; padding: 4px 10px; }
}


.emp-card-photo {
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    
    /* These 3 lines ensure it stays a circle regardless of image shape */
    width: 170px !important; 
    height: 170px !important;
    aspect-ratio: 1 / 1 !important; 
    
    /* This crops the image inside the circle without stretching it */
    object-fit: cover !important;
    object-position: center !important; 
    
    border-radius: 50% !important; 
    z-index: 5; 
    transition: all 0.7s cubic-bezier(0.25, 1, 0.5, 1);
}

/* GLOBAL TEAM CARD DESIGN - 250px */
.emp-card-container {
    position: relative;
    background-color: #b5a47e; 
    height: 250px !important; 
    width: 100%;
    display: flex;
    align-items: center; /* Vertically centers the text layer */
    padding: 0 40px; 
    border-radius: 8px;
    
    overflow: hidden; 
    cursor: pointer;
    font-family: 'Poppins', sans-serif;
    margin-bottom: 20px;
}

/* THE TEXT LAYER */
.emp-card-info {
    position: relative;
    z-index: 2; /* Sits behind image on hover if hiding text */
    transition: opacity 0.4s ease;
    max-width: 60%; 
}

.emp-card-info h4 {
    margin: 0;
    font-size: 26px;
    color: #ffffff !important;
    font-weight: 600;
}

.emp-card-info p {
    margin: 8px 0 0 0;
    font-size: 15px;
    color: #ffffff;
    line-height: 1.4;
}

/* THE IMAGE LAYER - CENTERED FIX */
.emp-card-photo {
    position: absolute;
    right: 30px;
    top: 50%; /* Places image at 50% from top */
    transform: translateY(-50%); /* Pulls image up to be perfectly centered */
    width: 170px; 
    height: 170px;
    border-radius: 50% !important; 
    object-fit: cover;
    z-index: 5; 
    transition: all 0.7s cubic-bezier(0.25, 1, 0.5, 1);
}

/* THE HOVER EFFECT */
.emp-card-container:hover .emp-card-photo {
    width: 100% !important;
    height: 100% !important;
    right: 0 !important;
    top: 0 !important; /* Resets top to fill whole card */
    transform: translateY(0) !important; /* Resets centering to fill whole card */
    border-radius: 0% !important;
    z-index: 10; /* Moves to front to hide text */
}

.emp-card-container:hover .emp-card-info {
    opacity: 0; /* Fully hides text as requested previously */
}

/* MOBILE FIX */
@media (max-width: 767px) {
    .emp-card-container { height: 200px !important; padding: 0 20px !important; }
    .emp-card-info h4 { font-size: 18px !important; }
    .emp-card-info p { font-size: 12px !important; }
    .emp-card-photo { 
        width: 100px !important; 
        height: 100px !important; 
        right: 15px !important;
    }
}/* End custom CSS */