/* Aangepaste CSS variabelen voor het vrouwelijke kleurenpalet */
:root {
    --bs-primary-purple: #8B5CF6; /* Purple-500 */
    --bs-secondary-pink: #EC4899; /* Pink-500 */
    --bs-light-pink: #FFF1F2; /* Pink-50 */
    --bs-light-purple: #EDE9FE; /* Purple-50 */
    --bs-light-yellow: #FFFBEB; /* Yellow-50 */
    --bs-dark-gray: #343a40; /* Donkergrijs voor footer */
    --bs-secondary-rgb: #343a40;
}

body {
    font-family: sans-serif;
    background-color: var(--bs-light-pink); /* Zachte roze achtergrond */
    color: #333;
}

/* Voor de naald en draad bij de titel */
.title-icon {
    font-size: 2.5rem; /* Groter gemaakt voor de titel */
    margin-right: 0.5rem;
    vertical-align: middle;
    color: var(--bs-secondary-pink); /* Roze kleur voor de iconen */
}

/* Custom gradient voor Hero en Call to Action secties */


/* Custom text kleuren */
.text-primary-purple { color: var(--bs-primary-purple); }
.text-secondary-pink { color: var(--bs-secondary-pink); }

/* Custom background kleuren */
.bg-light-pink-custom { background-color: var(--bs-light-pink); }
.bg-light-purple-custom { background-color: var(--bs-light-purple); }
.bg-light-yellow-custom { background-color: var(--bs-light-yellow); }

/* Icon styling (algemeen) */
.icon {
    /* Font Awesome iconen schalen met font-size */
    font-size: 5rem; /* Aanzienlijk groter gemaakt */
    margin-bottom: 1rem;
    color: var(--bs-primary-purple); /* Standaard paarse iconen */
}