:root {
    /* Current Keys */
    --aafe-wm-horizontal: horizontal-tb;
    --aafe-tf-horizontal: rotate(0deg);
    --aafe-ai-horizontal: center;
    --aafe-jc-horizontal: flex-start;
    
    --aafe-wm-vertical-up: vertical-rl;
    --aafe-tf-vertical-up: rotate(180deg);
    --aafe-ai-vertical-up: flex-end;
    --aafe-jc-vertical-up: center;
    
    --aafe-wm-vertical-down: vertical-rl;
    --aafe-tf-vertical-down: rotate(0deg);
    --aafe-ai-vertical-down: flex-start;
    --aafe-jc-vertical-down: center;

    /* Legacy Keys (from earlier versions) */
    --aafe-wm-horizontal-tb: horizontal-tb;
    --aafe-tf-horizontal-tb: rotate(0deg);
    --aafe-ai-horizontal-tb: center;
    --aafe-jc-horizontal-tb: flex-start;

    --aafe-wm-vertical-rl: vertical-rl;
    --aafe-tf-vertical-rl: rotate(180deg);
    --aafe-ai-vertical-rl: flex-end;
    --aafe-jc-vertical-rl: center;
}

.aafe-expanding-cards-wrapper {
    width: 100%;
}

.aafe-expanding-cards__grid {
    display: flex;
    width: 100%;
    height: 500px; /* Fallback for legacy instances */
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    gap: 8px;
}

.aafe-expanding-cards__item {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    background-color: #1a1a2e;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    flex: 1;
    min-height: 85px;
    transition: flex var(--aafe-transition, 500ms) cubic-bezier(0.25, 1, 0.5, 1), 
                background-color var(--aafe-transition, 500ms) ease-out, 
                border-color var(--aafe-transition, 500ms) ease-out, 
                box-shadow var(--aafe-transition, 500ms) ease-out;
    margin: 0 !important;
    padding: 0 !important;
}

.aafe-expanding-cards__item.active {
    flex: 5;
}

/* Inner wrapper for link support */
.aafe-expanding-cards__inner {
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    position: absolute;
    inset: 0;
}

/* Image */
.aafe-expanding-cards__img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: all var(--aafe-transition, 500ms) cubic-bezier(0.25, 1, 0.5, 1);
    transform: scale(var(--aafe-img-scale-normal, 1.15));
    opacity: var(--aafe-img-opacity-normal, 0.6);
}

.aafe-expanding-cards__item.active .aafe-expanding-cards__img {
    transform: scale(var(--aafe-img-scale-active, 1));
    opacity: var(--aafe-img-opacity-active, 1);
}

/* Overlay Gradient */
.aafe-expanding-cards__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, 
        var(--aafe-ec-overlay-start, rgba(0,0,0,0.8)) 0%, 
        var(--aafe-ec-overlay-mid, rgba(0,0,0,0.3)) 40%, 
        transparent 80%);
    pointer-events: none;
    transition: all var(--aafe-transition, 500ms) ease-out;
}

/* Content Area */
.aafe-expanding-cards__content {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 8px;
    padding: 16px;
    pointer-events: none;
}

.aafe-expanding-cards__item.active .aafe-expanding-cards__content {
    pointer-events: auto;
    overflow-y: auto;
    /* Hide scrollbar for cleaner look */
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.aafe-expanding-cards__item.active .aafe-expanding-cards__content::-webkit-scrollbar {
    display: none;
}

/* Inactive Title Wrapper */
.aafe-expanding-cards__title-vertical-wrapper {
    position: absolute;
    inset: 0;
    display: flex;
    pointer-events: none;
    z-index: 2;
    /* alignment and padding controlled by Elementor */
}

/* Vertical Title (Inactive) */
.aafe-expanding-cards__title-vertical {
    margin: 0 !important;
    line-height: 1 !important;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #ffffff;
    opacity: 1;
    transition: all 400ms ease-in-out;
    text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}

/* Inactive Vertical Title transform is handled by Elementor responsive settings */
.aafe-expanding-cards__item.active .aafe-expanding-cards__title-vertical {
    opacity: 0;
    transform: translateY(20px);
}

/* Icon */
.aafe-expanding-cards__icon {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    color: rgba(255, 255, 255, 0.9);
    opacity: 0;
    transform: translateY(16px);
    transition: all 400ms ease-in-out;
    transition-delay: 100ms;
}

.aafe-expanding-cards__icon svg {
    width: 24px;
    height: 24px;
    fill: currentColor;
}

.aafe-expanding-cards__icon i {
    font-size: 24px;
}

.aafe-expanding-cards__item.active .aafe-expanding-cards__icon {
    opacity: 1;
    transform: translateY(0);
}

/* Active Title */
.aafe-expanding-cards__title {
    margin: 0;
    font-size: 24px;
    font-weight: 700;
    color: #ffffff;
    opacity: 0;
    transform: translateY(16px);
    transition: all 400ms ease-in-out;
    transition-delay: 150ms;
}

.aafe-expanding-cards__item.active .aafe-expanding-cards__title {
    opacity: 1;
    transform: translateY(0);
}

/* Description */
.aafe-expanding-cards__desc {
    margin: 0;
    font-size: 15px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.9);
    max-width: 360px;
    opacity: 0;
    transform: translateY(16px);
    transition: all 400ms ease-in-out;
    transition-delay: 200ms;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.aafe-expanding-cards__item.active .aafe-expanding-cards__desc {
    opacity: 1;
    transform: translateY(0);
}

/* Global Hover Effects */
.aafe-expanding-cards__grid {
    transition: transform var(--aafe-hover-transition, 300ms) ease, box-shadow var(--aafe-hover-transition, 300ms) ease, border-color var(--aafe-hover-transition, 300ms) ease;
}
.aafe-expanding-cards-wrapper[data-hover="lift"] .aafe-expanding-cards__grid:hover { transform:translateY(-6px); box-shadow:0 12px 40px rgba(0,0,0,0.15); }
.aafe-expanding-cards-wrapper[data-hover="scale"] .aafe-expanding-cards__grid:hover { transform:scale(var(--aafe-hover-scale,1.03)); }
.aafe-expanding-cards-wrapper[data-hover="glow"] .aafe-expanding-cards__grid:hover { box-shadow:0 0 0 3px #4F46E5,0 8px 30px rgba(79,70,229,0.25); }
.aafe-expanding-cards-wrapper[data-hover="border-pop"] .aafe-expanding-cards__grid:hover { border-color:#4F46E5; transform:scale(1.01); }


