.bsl-results { width: 100%; max-width: 760px; padding: clamp(24px, 4vw, 48px); background: #f5f7f8; border-radius: 20px; } .bsl-results__percentage { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px; margin-bottom: 20px; } .bsl-results__number { font-size: clamp(3rem, 8vw, 6rem); font-weight: 800; line-height: 1; } .bsl-results__label { max-width: 360px; font-size: clamp(1.1rem, 2vw, 1.5rem); font-weight: 600; line-height: 1.3; } .bsl-results__progress { width: 100%; height: 18px; margin-bottom: 28px; overflow: hidden; background: #d9dfe2; border-radius: 999px; } .bsl-results__progress-bar { height: 100%; background: #157347; border-radius: inherit; transition: width 0.5s ease; } .bsl-results__details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; } .bsl-results__item { display: flex; flex-direction: column; gap: 6px; padding: 20px; background: #ffffff; border-radius: 12px; } .bsl-results__item strong { font-size: 2.25rem; line-height: 1; } .bsl-results__item span { font-size: 1rem; line-height: 1.5; } .bsl-results__item--available { border-left: 5px solid #157347; } .bsl-results__item--missing { border-left: 5px solid #b42318; } @media (max-width: 600px) { .bsl-results__details { grid-template-columns: 1fr; } }