/*============================================================================
    1. Footer General Styling
==============================================================================*/

footer {
    background-color: var(--secondary-bg);
    color: var(--secondary-foreground);
    border-top: 1px solid var(--border);
}



/*============================================================================
    2. Footer Content & Links
==============================================================================*/

footer .font-playfair-display {
    font-family: 'Playfair Display', serif;
}

footer h4 {
    font-weight: 700; /* Bold */
}

footer a {
    transition: color 0.2s ease-in-out;
}

footer a:hover {
    color: var(--primary);
}

/*============================================================================
    3. Back to Top Button
==============================================================================*/

#back-to-top {
    position: fixed;
    bottom: 32px;
    right: 32px;
    background-color: var(--primary);
    color: white;
    border-radius: 9999px; /* Circle */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    display: none; /* Initially hidden */
    justify-content: center;
    align-items: center;
    transition: opacity 0.3s ease, transform 0.3s ease;
    transform: translateY(100px);
}

#back-to-top.visible {
    display: flex;
    transform: translateY(0);
}

#back-to-top:hover {
    transform: scale(1.1);
}