@media (min-width: 992px) {
    .valuesSection .content .values .value .title { max-width: 260px; }
}

.valuesSection { background: linear-gradient(rgba(var(--dark-blue-rgb), 0.95), rgba(var(--dark-blue-rgb), 0.95)), url('/src/assets/img/values-section-bg.png') no-repeat center center; background-size: cover; }
.valuesSection .container {  }
.valuesSection .content { padding: 7.5rem 0; }
.valuesSection .content h2 { color: var(--white); font-size: 2.5rem; font-weight: 400; line-height: 1.2; font-family: 'RobotoSerif', sans-serif; margin-bottom: 1.5rem; }
.valuesSection .content .subtitle { color: var(--white); font-size: 1.25rem; font-weight: 400; line-height: 1.4; margin-bottom: 0; }
.valuesSection .content .values { padding-top: 5rem; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; gap: 1.5rem; }
.valuesSection .content .values .value { flex: 0 0 calc((100% / 3) - 1rem); width: calc((100% / 3) - 1rem); }
.valuesSection .content .values .value .icon { width: 3rem; height: 3rem; margin-bottom: 1rem; display: inline-block; }
.valuesSection .content .values .value .icon img { filter: var(--gold-filter); display: block; width: 100%; height: 100%; object-fit: contain; }
.valuesSection .content .values .value .title { color: var(--gold); font-size: 1.5rem; font-weight: 400; line-height: 1.2; font-family: 'RobotoSerif', sans-serif; margin-bottom: 1.5rem; }
.valuesSection .content .values .value .description { color: var(--white); font-size: 1rem; font-weight: 400; line-height: 1.4; margin-bottom: 0; }

@media (max-width: 991.98px) {
    .valuesSection .content { padding: 5rem 0; }
    .valuesSection .content h2 { font-size: 2.125rem; }
    .valuesSection .content .subtitle { font-size: 1.1rem; }
    .valuesSection .content .values { flex-wrap: wrap; padding-top: 3rem; }
    .valuesSection .content .values .value { flex: 1 0 100%; width: 100%; display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; align-content: center; justify-content: flex-start; gap: 1rem; }
    .valuesSection .content .values .value .icon { flex: 0 0 3rem; width: 3rem; height: 3rem; display: inline-block; margin-bottom: 0; }
    .valuesSection .content .values .value .title { flex: 1 0 auto; width: auto; margin-bottom: 0; }
    .valuesSection .content .values .value .description { flex: 1 0 100%; width: 100%; }
}

@media (max-width: 767.98px) {
    .valuesSection .content { padding: 4rem 0; }
    .valuesSection .content h2 { font-size: 1.875rem; }
    .valuesSection .content .values .value .title { font-size: 1.35rem; }
}

@media (max-width: 575.98px) {
    .valuesSection .content .values .value .icon { flex: 0 0 1.8rem; width: 1.8rem; height: 1.8rem; }
    .valuesSection .content .values .value .title { font-size: 1rem; }
    .valuesSection .content .values .value .description { font-size: 0.9rem; }
}