html {
    scroll-behavior: smooth;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.contact-link {
    color: white;
    text-decoration: none;
    font-weight: 600;
    transition: color 0.25s ease, text-shadow 0.25s ease, opacity 0.25s ease;
}

.contact-link:hover {
    text-shadow: 0 0 12px rgba(139, 92, 246, 0.9);
}

.contact-link:focus-visible,
.btn:focus-visible,
.support-pill:focus-visible,
.logo:focus-visible {
    outline: 2px solid rgba(139, 92, 246, 0.95);
    outline-offset: 4px;
}

.support-pill {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 132px;
    padding: 12px 20px;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 999px;
    background: rgba(18,18,18,0.55);
    backdrop-filter: blur(14px);
    color: white;
    text-decoration: none;
    font-weight: 600;
    letter-spacing: 0.4px;
    box-shadow: 0 12px 28px rgba(0,0,0,0.35);
    transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
}

.support-pill:hover {
    transform: translateY(-2px);
    box-shadow: 0 0 24px rgba(139,92,246,0.42);
    background: rgba(30,30,30,0.68);
}

@media (max-width: 768px) {
    body {
        padding-bottom: calc(104px + env(safe-area-inset-bottom, 0px));
    }

    .support-pill {
        right: 50%;
        bottom: calc(16px + env(safe-area-inset-bottom, 0px));
        transform: translateX(50%);
        width: min(calc(100% - 32px), 340px);
        padding: 14px 20px;
    }

    .support-pill:hover {
        transform: translateX(50%);
    }
}