/* Interaction states layer: subtle, consistent, layout-safe */

:root {
    --focus-ring-color: rgba(161, 130, 105, 0.55);
    --focus-ring-soft: rgba(161, 130, 105, 0.2);
    --interaction-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* Smooth baseline for interactive elements */
:where(a, button, [role="button"], input, textarea, select, .custom-select-trigger, .project-card, .mobile-nav-toggle) {
    transition-timing-function: var(--interaction-ease);
}

/* Hover clarity on links */
.main-header .nav-link,
.footer-link,
.link-cta,
.case-back,
.mobile-nav-link {
    transition: color 0.3s var(--interaction-ease), opacity 0.3s var(--interaction-ease), transform 0.3s var(--interaction-ease), background-color 0.25s var(--interaction-ease);
}

.main-header .nav-link:hover,
.footer-link:hover,
.case-back:hover {
    opacity: 1;
}

/* More tactile active state */
:where(.hero-cta, .cta-btn, .nav-cta, .btn-continuar, .submit-btn, .btn-voltar, .mobile-nav-cta, .mobile-nav-toggle, .custom-select-trigger):active {
    transform: translateY(1px) scale(0.99);
}

/* Card hover/active clarity without changing layout */
.project-card {
    transition: filter 0.35s var(--interaction-ease), transform 0.35s var(--interaction-ease);
}

.project-card:hover {
    filter: brightness(1.02);
}

.project-card:active {
    transform: translateY(1px);
}

/* Keyboard/mobile focus states */
:where(a, button, [role="button"], input, textarea, select, .custom-select-trigger, .mobile-nav-toggle):focus {
    outline: none;
}

:where(a, button, [role="button"], input, textarea, select, .custom-select-trigger, .mobile-nav-toggle):focus-visible {
    outline: 2px solid var(--focus-ring-color);
    outline-offset: 2px;
    box-shadow: 0 0 0 4px var(--focus-ring-soft);
    border-radius: 10px;
}

/* Keep rounded buttons with rounded focus ring */
:where(.hero-cta, .cta-btn, .nav-cta, .btn-continuar, .submit-btn, .btn-voltar, .mobile-nav-cta, .mobile-nav-toggle):focus-visible {
    border-radius: 999px;
}

/* Inputs focus clarity */
:where(input[type="text"], input[type="email"], textarea, select):focus-visible {
    border-bottom-color: var(--color-accent, #A18269);
}

/* Respect reduced motion settings */
@media (prefers-reduced-motion: reduce) {
    :where(a, button, [role="button"], input, textarea, select, .custom-select-trigger, .project-card, .mobile-nav-toggle) {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}

/* Global mobile footer readability (layout-safe) */
@media (max-width: 768px) {
    .site-footer .footer-bar {
        flex-wrap: wrap;
        row-gap: 14px;
    }

    .site-footer .footer-nav {
        width: 100%;
        flex-wrap: wrap;
        gap: 12px 16px;
        justify-content: flex-start;
    }
}