/* কমন বেস স্টাইল */
.amb-border-link {
    position: relative;
    display: inline-block;
    padding: 10px 18px;
    text-decoration: none;
    color: inherit;
    z-index: 0;
}

.amb-border-link::before,
.amb-border-link::after {
    pointer-events: none;
    box-sizing: border-box;
}

/* ========= Effect 1: বর্ডার স্লাইড / ড্র করা ========= */
.amb-effect-1::before {
    content: "";
    position: absolute;
    inset: 0;
    border: 2px solid #ff4b2b; /* রঙ চাইলে এখানে বদলান */
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.35s ease-out;
}

.amb-effect-1:hover::before,
.amb-effect-1:focus::before {
    transform: scaleX(1);
}

/* ========= Effect 2: ড্যাশড বর্ডার + কালার অ্যানিমেশন ========= */
.amb-effect-2::before {
    content: "";
    position: absolute;
    inset: 0;
    border: 2px dashed #3498db;
    opacity: 0;
    transition: opacity 0.2s ease-out;
    animation: amb-dash-color 1.2s linear infinite;
}

.amb-effect-2:hover::before,
.amb-effect-2:focus::before {
    opacity: 1;
}

@keyframes amb-dash-color {
    0%   { border-color: #3498db; }
    50%  { border-color: #9b59b6; }
    100% { border-color: #3498db; }
}

/* ========= Effect 3: নীয়ন গ্লো + গ্রেডিয়েন্ট মুভ ========= */
.amb-effect-3 {
    /* ব্যাকগ্রাউন্ড একটু ডার্ক থাকলে নীয়ন বেশি সুন্দর দেখাবে */
    background-color: transparent;
}

.amb-effect-3::before {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: 4px;
    background: linear-gradient(120deg,
        #ff6b6b,
        #feca57,
        #54a0ff,
        #5f27cd,
        #ff6b6b
    );
    background-size: 300% 300%;
    z-index: -1;
    opacity: 0;
    transition: opacity 0.2s ease-out;
}

.amb-effect-3::after {
    content: "";
    position: absolute;
    inset: 0;
    background: inherit;  /* মেনুর আসল ব্যাকগ্রাউন্ড রেখে দেয় */
    border-radius: 2px;
    z-index: -1;
}

.amb-effect-3:hover::before,
.amb-effect-3:focus::before {
    opacity: 1;
    animation: amb-neon 2s linear infinite;
}

@keyframes amb-neon {
    0% {
        background-position: 0% 50%;
        box-shadow: 0 0 4px rgba(255,255,255,0.2);
    }
    50% {
        background-position: 100% 50%;
        box-shadow: 0 0 12px rgba(255,255,255,0.7);
    }
    100% {
        background-position: 0% 50%;
        box-shadow: 0 0 4px rgba(255,255,255,0.2);
    }
}