* {
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

:root {
    --gold-color: #FFD700;
    --light-gold-color: #FFEA80;
    --dark-gray-text: #333333;
    --teal-color: #008080; /* Used for specific checkmarks as requested */
}

.gold {
    color: var(--gold-color);
}

.bg-gold {
    background-color: var(--gold-color);
}

.b--gold {
    border-color: var(--gold-color);
}

.bg-washed-yellow {
    background-color: var(--light-gold-color);
}

.dark-gray {
    color: var(--dark-gray-text);
}

.teal {
    color: var(--teal-color);
}

.site-title {
    font-size: 1.5rem; /* Default for mobile */
}

.heading-h1 {
    font-size: 1.5rem; /* Mobile */
}

.heading-h2 {
    font-size: 1.25rem; /* Mobile */
}

.heading-h3 {
    font-size: 1.125rem; /* Mobile */
}

@media screen and (min-width: 768px) {
    .site-title {
        font-size: 1.8rem;
    }
    .heading-h1 {
        font-size: 2.2rem;
    }
    .heading-h2 {
        font-size: 1.8rem;
    }
    .heading-h3 {
        font-size: 1.6rem;
    }
}

@media screen and (min-width: 1024px) {
    .site-title {
        font-size: 2.25rem;
    }
    .heading-h1 {
        font-size: 2.5rem;
    }
    .heading-h2 {
        font-size: 2rem;
    }
    .heading-h3 {
        font-size: 1.75rem;
    }
}

.h-100vh {
    height: 100vh;
}

.bg-black-50 {
    background-color: rgba(0, 0, 0, 0.5);
}

.hero-section {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    background-image: url('visuals/uploads/trading-desk-background.jpeg');
}

.testimonial-card {
    min-height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    padding-top: 4rem; /* Space for avatar */
}

.testimonial-avatar {
    position: absolute;
    top: -1.5rem;
    left: 1rem;
    border: 3px solid var(--gold-color);
    object-fit: cover;
}

.rotate-1 {
    transform: rotate(1deg);
}

.rotate--1 {
    transform: rotate(-1deg);
}

.rotate-2 {
    transform: rotate(2deg);
}

.faq-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0s ease-out;
}

.faq-content.active {
    max-height: 500px; /* Sufficiently large value for content */
    transition: max-height 0s ease-in;
}

.process-step {
    position: relative;
}

@media screen and (min-width: 60em) { /* Tachyons' ns breakpoint */
    .process-step:not(:last-child)::after {
        content: '';
        position: absolute;
        top: 2.5rem;
        left: calc(50% + 6rem);
        width: calc(100% - 12rem);
        border-bottom: 2px dotted var(--gold-color);
        z-index: 0;
    }
}

.email-break-all {
    word-break: break-all;
}

.no-underline {
    text-decoration: none;
}

#mobile-menu {
    overflow-y: auto;
}

.h-100vh {
    height: 100vh;
}

.w-70 {
    width: 70%;
}

.w-50-m {
    width: 50%;
}

.z-max {
    z-index: 9999;
}
.infoGuardBlock {
    /* Main block container spacing */
    margin-top: 40px; /* Space above the block */
    padding-left: 20px; /* Padding on the left side */
    padding-right: 20px; /* Padding on the right side */
    max-width: 960px; /* Optional: Sets a maximum width for content readability */
    margin-left: auto; /* Centers the block horizontally if max-width is set */
    margin-right: auto; /* Centers the block horizontally if max-width is set */
}

.infoGuardBlock h1 {
    /* Heading 1 styles */
    font-size: 2em; /* Moderate size, e.g., 32px if base is 16px */
    line-height: 1.2; /* Line height for readability */
    font-weight: bold; /* Bold text */
    margin-top: 32px; /* Space above heading */
    margin-bottom: 16px; /* Space below heading */
}

.infoGuardBlock h2 {
    /* Heading 2 styles */
    font-size: 1.75em; /* Moderate size, e.g., 28px */
    line-height: 1.3;
    font-weight: bold;
    margin-top: 28px;
    margin-bottom: 14px;
}

.infoGuardBlock h3 {
    /* Heading 3 styles */
    font-size: 1.5em; /* Moderate size, e.g., 24px */
    line-height: 1.4;
    font-weight: bold;
    margin-top: 24px;
    margin-bottom: 12px;
}

.infoGuardBlock h4 {
    /* Heading 4 styles */
    font-size: 1.25em; /* Moderate size, e.g., 20px */
    line-height: 1.5;
    font-weight: bold;
    margin-top: 20px;
    margin-bottom: 10px;
}

.infoGuardBlock h5 {
    /* Heading 5 styles */
    font-size: 1.1em; /* Moderate size, e.g., 17.6px */
    line-height: 1.6;
    font-weight: bold;
    margin-top: 16px;
    margin-bottom: 8px;
}

.infoGuardBlock p {
    /* Paragraph styles */
    font-size: 1em; /* Base font size for paragraphs */
    line-height: 1.6; /* Line height for better readability */
    margin-bottom: 1em; /* Space between paragraphs */
}

.infoGuardBlock ul {
    /* Unordered list container styles */
    list-style-type: disc; /* Default bullet style */
    margin-top: 1em; /* Space above the list */
    margin-bottom: 1em; /* Space below the list */
    padding-left: 24px; /* Indentation for bullet points */
}

.infoGuardBlock li {
    /* List item styles */
    margin-bottom: 0.5em; /* Space between individual list items */
    line-height: 1.6; /* Ensure readability for list item text */
}
nav .flex-ns {
    flex-wrap: wrap !important;
    gap: 10px;
    margin-left: 5px;
    justify-content: center !important;
}
footer .flex {
    flex-wrap: wrap;
}
@media  (max-width: 767px) {  
    .site-title {
        font-size: 14px;
    }
    header .f5-ns {
        font-size: 14px !important;
    }
    #temoignages .flex {
        flex-direction: column;
    }
     #temoignages .w-third-ns{
        width: 100% !important;
    }
    #statistiques .flex {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    #statistiques .w-third-ns {
        width: 100% !important;
    }
    #avantages .flex {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    #avantages .w-50-ns {
        width: 100% !important;
    }
    #fonctionnement .flex {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    #fonctionnement .w-third-ns {
        width: 100% !important;
    }
}
section {
    overflow: hidden;
}