/* ==========================================================================
   Project Link Card - WordPress Themify Builder Implementation
   ========================================================================== */

/* Left Column (Image Wrapper) */
.module_column.project-link-container .sub_column.first {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-shrink: 0 !important;
}

/* Title Styling Specificity Fix */
.project-link-container-link-title .tb_text_wrap p,
.project-link-container-link-title .tb_text_wrap p strong {
    font-family: var(--font-heading) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    color: var(--color-on-surface) !important;
    margin: 0 0 8px 0 !important;
    /* Margin bottom creates space above link */
}

/* Base Link Wrapper Alignment */
.project-link-container-link .live-link {
    display: inline-flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    text-decoration: none !important;
    color: var(--color-primary) !important;
    transition: color 0.3s ease !important;
    max-width: 100% !important;
}

/* Icon Resizing and Vertical Centering */
.project-link-container-link .link-icon {
    font-size: 18px !important;
    vertical-align: middle !important;
    display: inline-block !important;
    transition: transform 0.3s ease !important;
}

/* Underline Isolation - Only wraps around the actual link text */
.project-link-container-link .link-text {
    font-family: var(--font-main) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    border-bottom: 2px solid rgba(112, 47, 229, 0.3) !important;
    padding-bottom: 2px !important;
    transition: border-color 0.3s ease !important;
    word-break: break-all !important;
}

/* Global Hover Triggers (Fires when hovering anywhere over the text block module) */
.project-link-container-link:hover .live-link {
    color: var(--color-primary-container) !important;
}

.project-link-container-link:hover .link-icon {
    transform: scale(1.1) !important;
}

.project-link-container-link:hover .link-text {
    border-color: var(--color-primary) !important;
}