.fij-dual-btn-wrapper { display: flex; align-items: stretch; justify-content: center; position: relative; width: fit-content; margin: 0 auto; transition: 0.3s; }
.fij-dbtn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 15px 30px; text-decoration: none; font-weight: 700;
    transition: all 0.3s ease; border: none; cursor: pointer;
}
.fij-dbtn i { margin-right: 8px; }

/* Connected Layout */
.fij-dual-btn-wrapper:not(.layout-separated) .fij-dbtn-1 { border-radius: 5px 0 0 5px; }
.fij-dual-btn-wrapper:not(.layout-separated) .fij-dbtn-2 { border-radius: 0 5px 5px 0; }

/* Connector */
.fij-dbtn-connector {
    position: relative; z-index: 2;
    width: 36px; height: 36px; line-height: 36px;
    background: #8e44ad; color: #fff;
    text-align: center; border-radius: 50%;
    font-size: 12px; font-weight: 800;
    align-self: center; margin-left: -18px; margin-right: -18px;
    box-shadow: 0 0 0 3px #fff; /* Border effect */
}

/* Hover Effects (The Million Dollar Feel) */
.fij-dual-btn-wrapper:hover .fij-dbtn { opacity: 0.5; filter: blur(1px); }
.fij-dual-btn-wrapper .fij-dbtn:hover { opacity: 1; filter: blur(0); transform: scale(1.05); z-index: 5; box-shadow: 0 10px 20px rgba(0,0,0,0.1); }

/* Responsive */
@media (max-width: 767px) {
    .fij-dual-btn-wrapper { flex-direction: column; width: 100%; }
    .fij-dbtn { width: 100%; border-radius: 5px !important; margin-bottom: 10px; }
    .fij-dbtn-connector { margin: -20px auto; transform: rotate(90deg); box-shadow: none; border: 2px solid #fff; }
}