/* Elementor can leave custom widgets with .elementor-invisible on the frontend
   when an entrance-animation/lazy reveal hook does not complete. Keep this widget visible. */
.elementor-widget-layer-dental-flipbox.elementor-invisible {
    visibility: visible !important;
    opacity: 1 !important;
}

.ldfb-card {
    position: relative;
    width: 100%;
    min-height: var(--ldfb-min-height, 320px);
    perspective: 1200px;
    isolation: isolate;
}

.ldfb-height-fixed {
    height: var(--ldfb-fixed-height, 560px);
    min-height: 0;
}


/* Equal Height by Row is based only on the natural FRONT side.
   The back face is absolutely overlaid so its longer bio cannot participate in
   the closed card's layout calculation. JavaScript equalizes each visible row
   from the tallest natural front, then expands only the opened card if its back
   content needs more room. */
.ldfb-height-equal {
    height: var(--ldfb-active-height, var(--ldfb-equal-height, auto));
    min-height: 0 !important;
}

.ldfb-height-equal .ldfb-inner {
    display: block;
    height: var(--ldfb-active-height, var(--ldfb-equal-height, auto));
    min-height: 0;
}

/* Front establishes the intrinsic closed-card height. */
.ldfb-height-equal .ldfb-front {
    position: relative;
    inset: auto;
    height: auto;
    min-height: 0;
}

/* Back is an overlay and never contributes to the closed-card height. */
.ldfb-height-equal .ldfb-back {
    position: absolute;
    inset: 0;
    height: 100%;
    min-height: 0;
}

.ldfb-height-equal .ldfb-back-content {
    height: 100%;
    min-height: 0;
}

.ldfb-height-equal.ldfb-layout-split .ldfb-front-image {
    height: var(--ldfb-auto-image-height, 330px) !important;
    flex: 0 0 var(--ldfb-auto-image-height, 330px) !important;
}

.ldfb-height-equal .ldfb-front,
.ldfb-height-equal .ldfb-back,
.ldfb-height-equal .ldfb-front-content {
    overflow: visible;
}

/* The back remains scrollable as a safety net for exceptionally long bios. */
.ldfb-height-equal .ldfb-back-content {
    overflow-y: auto;
    overflow-x: hidden;
}

/* Keep front text intrinsic. Shorter cards may have a small amount of trailing
   row-alignment space below the content, but never the full back-bio gap. */
.ldfb-height-equal.ldfb-layout-split .ldfb-front-content {
    display: block;
    flex: 0 0 auto;
}

.ldfb-height-equal.ldfb-layout-split .ldfb-front-prompt {
    margin-top: 0;
}

/* Auto mode lets the tallest side determine the card height, so text is never clipped. */
.ldfb-height-auto .ldfb-inner {
    display: grid;
    height: auto;
    min-height: var(--ldfb-min-height, 320px);
}

.ldfb-height-auto .ldfb-face {
    position: relative;
    inset: auto;
    grid-area: 1 / 1;
    height: auto;
    min-height: 100%;
}

.ldfb-height-auto .ldfb-back-content {
    height: auto;
    min-height: 100%;
}

.ldfb-inner {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transition-property: transform;
    transition-duration: .65s;
    transition-timing-function: cubic-bezier(.2,.7,.2,1);
}

.ldfb-face {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transition-property: opacity, transform, visibility;
    transition-duration: .65s;
    transition-timing-function: cubic-bezier(.2,.7,.2,1);
}

.ldfb-front {
    display: flex;
    flex-direction: column;
    background: #f7f7f2;
}

.ldfb-front-image {
    position: relative;
    width: 100%;
    overflow: hidden;
    min-height: 0;
}

.ldfb-layout-split .ldfb-front-image {
    height: 72%;
    flex: 0 0 72%;
}

.ldfb-layout-cover .ldfb-front-image {
    position: absolute;
    inset: 0;
    height: 100%;
}

/* In auto-height mode the split portrait gets an explicit responsive image height,
   while the content area remains fully intrinsic. */
.ldfb-height-auto.ldfb-layout-split .ldfb-front-image {
    height: var(--ldfb-auto-image-height, 330px) !important;
    flex: 0 0 var(--ldfb-auto-image-height, 330px) !important;
}

.ldfb-height-auto .ldfb-front,
.ldfb-height-auto .ldfb-back {
    overflow: visible;
}

.ldfb-height-auto .ldfb-front-content,
.ldfb-height-auto .ldfb-back-content {
    overflow: visible;
}


.ldfb-front-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: var(--ldfb-img-position, center center);
}

.ldfb-image-position-custom .ldfb-front-image img {
    object-position: var(--ldfb-img-x, 50%) var(--ldfb-img-y, 50%);
}

.ldfb-front-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
}

.ldfb-front-content {
    position: relative;
    z-index: 2;
    width: 100%;
}

.ldfb-layout-split .ldfb-front-content {
    flex: 1 1 auto;
    background: #f7f7f2;
}

.ldfb-layout-cover .ldfb-front-content {
    margin-top: auto;
    min-height: 42%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.28) 100%);
}

.ldfb-front-subtitle,
.ldfb-back-subtitle {
    margin: 0 0 7px;
    font-size: 11px;
    line-height: 1.3;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ldfb-front-title,
.ldfb-back-title {
    margin: 0 0 12px;
    font-size: 26px;
    line-height: 1.12;
}

.ldfb-front-description {
    margin: 0 0 14px;
    font-size: 14px;
    line-height: 1.55;
}

.ldfb-back {
    display: flex;
    color: #fff;
    background: #00594f;
}

.ldfb-back-content {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.ldfb-bio {
    margin-bottom: 20px;
    font-size: 15px;
    line-height: 1.7;
}

.ldfb-bio > :first-child { margin-top: 0; }
.ldfb-bio > :last-child { margin-bottom: 0; }

.ldfb-prompt,
.ldfb-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: fit-content;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
}

.ldfb-prompt {
    appearance: none;
    border: 0;
    background: transparent;
    padding: 0;
    margin: 0;
    font-family: inherit;
    cursor: pointer;
    text-align: left;
}

.ldfb-prompt:focus-visible,
.ldfb-cta:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 4px;
}

.ldfb-prompt:hover,
.ldfb-cta:hover { opacity: .78; }

.ldfb-cta {
    margin: 0 0 18px;
    color: #e8f0d9;
    text-decoration: none;
}

/* 3D Flip */
.ldfb-animation-flip.ldfb-direction-left .ldfb-back { transform: rotateY(180deg); }
.ldfb-animation-flip.ldfb-direction-left.is-flipped .ldfb-inner { transform: rotateY(180deg); }
.ldfb-animation-flip.ldfb-direction-right .ldfb-back { transform: rotateY(-180deg); }
.ldfb-animation-flip.ldfb-direction-right.is-flipped .ldfb-inner { transform: rotateY(-180deg); }
.ldfb-animation-flip.ldfb-direction-up .ldfb-back { transform: rotateX(-180deg); }
.ldfb-animation-flip.ldfb-direction-up.is-flipped .ldfb-inner { transform: rotateX(-180deg); }
.ldfb-animation-flip.ldfb-direction-down .ldfb-back { transform: rotateX(180deg); }
.ldfb-animation-flip.ldfb-direction-down.is-flipped .ldfb-inner { transform: rotateX(180deg); }

/* Fade */
.ldfb-animation-fade .ldfb-inner { transform: none !important; }
.ldfb-animation-fade .ldfb-back { opacity: 0; visibility: hidden; }
.ldfb-animation-fade.is-flipped .ldfb-front { opacity: 0; visibility: hidden; }
.ldfb-animation-fade.is-flipped .ldfb-back { opacity: 1; visibility: visible; }

/* Zoom */
.ldfb-animation-zoom .ldfb-inner { transform: none !important; }
.ldfb-animation-zoom .ldfb-back { opacity: 0; visibility: hidden; transform: scale(.88); }
.ldfb-animation-zoom.is-flipped .ldfb-front { opacity: 0; visibility: hidden; transform: scale(1.08); }
.ldfb-animation-zoom.is-flipped .ldfb-back { opacity: 1; visibility: visible; transform: scale(1); }

/* Slide */
.ldfb-animation-slide .ldfb-inner { transform: none !important; overflow: hidden; }
.ldfb-animation-slide .ldfb-back { visibility: hidden; }
.ldfb-animation-slide.ldfb-direction-left .ldfb-back { transform: translateX(100%); }
.ldfb-animation-slide.ldfb-direction-right .ldfb-back { transform: translateX(-100%); }
.ldfb-animation-slide.ldfb-direction-up .ldfb-back { transform: translateY(100%); }
.ldfb-animation-slide.ldfb-direction-down .ldfb-back { transform: translateY(-100%); }
.ldfb-animation-slide.is-flipped .ldfb-front { visibility: hidden; }
.ldfb-animation-slide.ldfb-direction-left.is-flipped .ldfb-front { transform: translateX(-100%); }
.ldfb-animation-slide.ldfb-direction-right.is-flipped .ldfb-front { transform: translateX(100%); }
.ldfb-animation-slide.ldfb-direction-up.is-flipped .ldfb-front { transform: translateY(-100%); }
.ldfb-animation-slide.ldfb-direction-down.is-flipped .ldfb-front { transform: translateY(100%); }
.ldfb-animation-slide.is-flipped .ldfb-back { transform: translate(0,0); visibility: visible; }

/* Hover trigger mirrors the flipped state on pointer-capable devices. */
@media (hover:hover) and (pointer:fine) {
    .ldfb-trigger-hover.ldfb-animation-flip.ldfb-direction-left:hover .ldfb-inner,
    .ldfb-trigger-both.ldfb-animation-flip.ldfb-direction-left:hover .ldfb-inner { transform: rotateY(180deg); }
    .ldfb-trigger-hover.ldfb-animation-flip.ldfb-direction-right:hover .ldfb-inner,
    .ldfb-trigger-both.ldfb-animation-flip.ldfb-direction-right:hover .ldfb-inner { transform: rotateY(-180deg); }
    .ldfb-trigger-hover.ldfb-animation-flip.ldfb-direction-up:hover .ldfb-inner,
    .ldfb-trigger-both.ldfb-animation-flip.ldfb-direction-up:hover .ldfb-inner { transform: rotateX(-180deg); }
    .ldfb-trigger-hover.ldfb-animation-flip.ldfb-direction-down:hover .ldfb-inner,
    .ldfb-trigger-both.ldfb-animation-flip.ldfb-direction-down:hover .ldfb-inner { transform: rotateX(180deg); }

    .ldfb-trigger-hover.ldfb-animation-fade:hover .ldfb-front,
    .ldfb-trigger-both.ldfb-animation-fade:hover .ldfb-front { opacity: 0; visibility: hidden; }
    .ldfb-trigger-hover.ldfb-animation-fade:hover .ldfb-back,
    .ldfb-trigger-both.ldfb-animation-fade:hover .ldfb-back { opacity: 1; visibility: visible; }

    .ldfb-trigger-hover.ldfb-animation-zoom:hover .ldfb-front,
    .ldfb-trigger-both.ldfb-animation-zoom:hover .ldfb-front { opacity: 0; visibility: hidden; transform: scale(1.08); }
    .ldfb-trigger-hover.ldfb-animation-zoom:hover .ldfb-back,
    .ldfb-trigger-both.ldfb-animation-zoom:hover .ldfb-back { opacity: 1; visibility: visible; transform: scale(1); }

    .ldfb-trigger-hover.ldfb-animation-slide:hover .ldfb-back,
    .ldfb-trigger-both.ldfb-animation-slide:hover .ldfb-back { transform: translate(0,0); visibility: visible; }
    .ldfb-trigger-hover.ldfb-animation-slide.ldfb-direction-left:hover .ldfb-front,
    .ldfb-trigger-both.ldfb-animation-slide.ldfb-direction-left:hover .ldfb-front { transform: translateX(-100%); visibility: hidden; }
    .ldfb-trigger-hover.ldfb-animation-slide.ldfb-direction-right:hover .ldfb-front,
    .ldfb-trigger-both.ldfb-animation-slide.ldfb-direction-right:hover .ldfb-front { transform: translateX(100%); visibility: hidden; }
    .ldfb-trigger-hover.ldfb-animation-slide.ldfb-direction-up:hover .ldfb-front,
    .ldfb-trigger-both.ldfb-animation-slide.ldfb-direction-up:hover .ldfb-front { transform: translateY(-100%); visibility: hidden; }
    .ldfb-trigger-hover.ldfb-animation-slide.ldfb-direction-down:hover .ldfb-front,
    .ldfb-trigger-both.ldfb-animation-slide.ldfb-direction-down:hover .ldfb-front { transform: translateY(100%); visibility: hidden; }
}

@media (prefers-reduced-motion: reduce) {
    .ldfb-inner,
    .ldfb-face { transition-duration: 0.01ms !important; }
}