/*
    ========================================
    FOOTER-SOCIAL.CSS
    Auteur                : Renaud
    Création              : 09 décembre 2025
    Dernière modification : 12 décembre 2025
    ========================================
*/
/**
*   @project   DEVENIR-ARTISAN.NET
*   Style de la section Réseaux Sociaux.
*
*   @file  css/footer-social.css
*
*   @see   includes/footer-social-list.php
*/

/* --- BLOCK : Footer Social --- */
.footer-social {
    /* PLACEMENT */
    /* S'aligne à droite par défaut dans la grille Desktop (définie dans footer-content.css) */
    justify-self: end;
}

/* --- ELEMENT : Title (h4) --- */
.footer-social__title {
    /* PLACEMENT */
    margin-bottom: 1.5rem;

    /* TEXTE */
    font-family: var(--font-ui-label);
    font-weight: 700;
    font-size: 0.85rem;
    color: var(--color-footer-title); /* Blanc */
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* --- ELEMENT : List --- */
.footer-social__list {
    /* PLACEMENT */
    display: flex;
    flex-direction: column; /* Liste verticale par défaut (Desktop) */
    gap: 0.8rem;
}

/* --- ELEMENT : Link --- */
.footer-social__link {
    /* PLACEMENT */
    display: flex;
    align-items: center;
    gap: 0.5rem;

    /* TEXTE */
    font-family: var(--font-ui-label);
    font-size: 0.9rem;
    color: var(--color-text-footer);
    text-decoration: none;

    /* EFFET */
    transition: color 0.2s ease;
}

/* ÉTAT : Hover */
.footer-social__link:hover {
    /* TEXTE */
    color: var(--color-white); /* Devient blanc */
}


/* --- RESPONSIVE --- */
/* TABLETTE (< 1150px) */
@media (max-width: 1150px) {
    .footer-social {
        /* PLACEMENT : Revient à gauche (alignement standard) */
        justify-self: start; 
    }
    
    .footer-social__list {
        /* PLACEMENT : Passe à l'horizontale */
        flex-direction: row; 
        flex-wrap: wrap;
        gap: 1.5rem;
    }
}

/* MOBILE (< 768px) */
@media (max-width: 768px) {
    .footer-social {
        /* PLACEMENT : Centré */
        justify-self: center; 
    }
}