/* Paramètres généraux */
:root {
    --primary-color: #f04c5d;
    --text-color: #F0F3BD;
    --font-family: 'Poppins', sans-serif;
    --navbar-height: 40px;
    --default-spacing: 20px;
}

/* Réinitialisation de base */
*,
*::before,
*::after {
    box-sizing: border-box;

}
html {
    font-size: 16px; /* Taille par défaut pour les grands écrans */
}

body {
    margin: 0;
    padding: 0;
    font-family: var(--font-family);
    color: var(--text-color);
    background-color: #00A896 ;
}

#cursor-circle {
    position: fixed;
    width: 45px; /* Taille du cercle */
    height: 45px; /* Taille du cercle */
    border-radius: 50%; /* Rend le div complètement rond */
    border: 1.5px solid #264653; /* Bordure noire de 2px */
    background: transparent; /* Intérieur transparent */
    pointer-events: none; /* Le cercle ne gênera pas les clics de souris */
    transform: translate(-50%, -50%); /* Ajustement pour centrer le cercle sur le curseur */
    z-index: 10000; /* S'assure que le cercle est bien visible */
}
.svg-container {
    margin-left: auto; 
    margin-right: 0;
    width: 20%; 
   
}

.svg-container svg {
    width: 100%; /* Le SVG remplit la largeur de .svg-container */
    height: auto; /* Garde les proportions du SVG */
}


.svg-container svg path {
    fill: #E76F51; /* votre couleur choisie */
}

@media (max-width: 768px) {
    .svg-container {
        width: 50%;
        margin-left: auto;
        margin-right: 0;
    }
}