
.team-image.grow-hover {
    overflow: hidden;       /* crop extra part when image grows */
}

.team-image.grow-hover img {
    display: block;                      /* prevents inline gaps */
    transform: scale(1);                 /* default size */
    transition: transform 0.4s ease-in-out; /* smooth grow/shrink */
}

.team-image.grow-hover:hover img {
    transform: scale(1.1);               /* grow smoothly inside box */
}


/* =========================
   Card Text Alignment (Global)
   ========================= */
.calmhaven-team-card {
    text-align: left; /* default */
}

.calmhaven-team-card.text-align-left  { text-align: left; }
.calmhaven-team-card.text-align-center{ text-align: center; }
.calmhaven-team-card.text-align-right { text-align: right; }

/* =========================
   Base Spacing + Layout
   ========================= */
.team-image,
.team-name,
.team-subtitle,
.team-text,
.team-button,
.team-social {
    margin: 0;
    padding: 0;
    line-height: normal;
}

.team-image img {
    max-width: 100%;
    height: auto;
    display: block;
}

.calmhaven-team-card .team-name {
    margin: 0;
    line-height: 1.2;
}

/* =========================
   Button Styling
   ========================= */
.team-button a {
    display: inline-block;
    margin: var(--button-margin, 0);
    transition: all 0.3s ease;
}

.team-button a:hover {
    cursor: pointer;
}

/* =========================
   Social Icons
   ========================= */
.team-social {
    display: inline-flex; /* aligns as inline element and respects parent text-align */
    flex-wrap: wrap;
    gap: 8px;
}

.team-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--social-icon-padding, 4px);
    transition: all 0.3s ease;
}

.team-social a i {
    font-size: var(--social-icon-size, 16px);
    transition: all 0.3s ease;
}

.team-social a:hover {
    transform: translateY(-6px);
}



/* =========================
   OVERLAY CSS FIXED - FULL
   ========================= */

.calmhaven-team-card.overlay-content {
    position: relative;
}

.calmhaven-team-card.overlay-content .team-content-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: center; /* vertical centering */
    opacity: 0;
    transition: opacity 0.3s ease;
    width: 100%;
}

/* Show overlay on hover */
.calmhaven-team-card.overlay-content:hover .team-content-overlay {
    opacity: 1;
}

/* =========================
   Overlay Horizontal Alignment
   ========================= */

/* Left align */
.calmhaven-team-card.overlay-content.text-align-left .team-content-overlay {
    align-items: flex-start;
}
.calmhaven-team-card.overlay-content.text-align-left .team-content-overlay * {
    text-align: left;
}
.calmhaven-team-card.overlay-content.text-align-left .team-button,
.calmhaven-team-card.overlay-content.text-align-left .team-social {
    justify-content: flex-start;
}

/* Center align */
.calmhaven-team-card.overlay-content.text-align-center .team-content-overlay {
    align-items: center;
}
.calmhaven-team-card.overlay-content.text-align-center .team-content-overlay * {
    text-align: center;
}
.calmhaven-team-card.overlay-content.text-align-center .team-button,
.calmhaven-team-card.overlay-content.text-align-center .team-social {
    justify-content: center;
}

/* Right align */
.calmhaven-team-card.overlay-content.text-align-right .team-content-overlay {
    align-items: flex-end;
}
.calmhaven-team-card.overlay-content.text-align-right .team-content-overlay * {
    text-align: right;
}
.calmhaven-team-card.overlay-content.text-align-right .team-button,
.calmhaven-team-card.overlay-content.text-align-right .team-social {
    justify-content: flex-end;
}

/* =========================
   Make inner button and social icons respect alignment
   ========================= */
.calmhaven-team-card.overlay-content .team-button a,
.calmhaven-team-card.overlay-content .team-social a {
    display: inline-flex; /* ensures flex for alignment */
}









