/* Explain: Shared interaction polish for buttons, cards, and focus states. */
/* ==========================================================================
   Shared interaction polish
   Consistent hover lift, border + shadow feedback and clear keyboard focus
   outlines across homepage buttons, feature cards and pricing packages.
   ========================================================================== */

/* Buttons: shared transition list so the lift animates smoothly */
.btn {
    transition-property: color, background-color, border-color, box-shadow, transform;
    transition-duration: 0.2s;
    transition-timing-function: ease;
}

/* Hover lift + shadow feedback for action buttons (icon/ghost buttons excluded) */
.btn:not(.btn-ghost):not(.btn-circle):not(.btn-link):not(:disabled):hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 24px -12px rgba(79, 70, 229, 0.45);
}

.btn:not(.btn-ghost):not(.btn-circle):not(.btn-link):not(:disabled):active {
    transform: translateY(0);
    box-shadow: none;
}

/* Feature cards and pricing packages share one hover lift + border + shadow */
.lift-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.lift-card:hover {
    transform: translateY(-6px);
    border-color: var(--primary-color);
    box-shadow: 0 20px 44px -18px rgba(79, 70, 229, 0.35);
}

/* Clear focus outline for every keyboard-reachable element */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid var(--accent-color);
    outline-offset: 3px;
}

/* Respect visitors who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
    .btn,
    .lift-card {
        transition: none;
    }
    .btn:not(.btn-ghost):not(.btn-circle):not(.btn-link):not(:disabled):hover,
    .btn:not(.btn-ghost):not(.btn-circle):not(.btn-link):not(:disabled):active,
    .lift-card:hover {
        transform: none;
    }
}