.reviews { padding: 0 15px 15px 15px; } .reviews__header { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 0 24px; height: 129px; background: #ffffff; border-radius: 24px; } .reviews__title { font-family: 'FixelDisplay', Serif; font-size: 32px; font-weight: 500; line-height: normal; letter-spacing: 0; color: var(--green-primary, #4A853E); text-transform: uppercase; } .reviews__btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 24px; height: 48px; border-radius: 12px; border: none; background: #232323; cursor: pointer; text-decoration: none; white-space: nowrap; flex-shrink: 0; font-family: 'Arial', Serif; font-size: 16px; font-weight: 700; line-height: 20px; letter-spacing: -0.4px; color: #ffffff; transition: opacity 0.25s ease; } .reviews__btn:hover, .reviews__btn:focus-visible { opacity: 0.85; color: #ffffff; } .reviews__btn-icon { width: 20px; height: 20px; flex-shrink: 0; } .reviews__btn--mobile { display: none; width: 306px; margin: 8px auto 0; } .reviews__slider { margin-top: 8px; overflow: hidden; } .reviews__card { display: flex; flex-direction: column; min-height: 320px; height: 100%; max-height: 520px; background: #ffffff; border-radius: 24px; overflow: hidden; position: relative; justify-content: space-between; } .reviews__card-top { display: flex; flex-direction: column; gap: 16px; padding: 24px 24px 0; flex-shrink: 0; } .reviews__stars { display: flex; gap: 5px; } .reviews__star { font-size: 24px; line-height: 1; color: #E0E0E0; } .reviews__star--filled { color: #F5A623; } .reviews__card-title { font-family: 'FixelDisplay', Serif; font-size: 24px; font-weight: 500; line-height: normal; letter-spacing: 0; color: var(--green-primary, #4A853E); text-transform: uppercase; } .reviews__text { font-family: 'FixelDisplay', Serif; font-size: 16px; font-weight: 400; line-height: 160%; letter-spacing: -0.4px; color: rgba(28, 31, 34, 0.90); display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; } .reviews__card-image { flex: 1; display: flex; align-items: center; justify-content: center; padding: 16px 24px; overflow: hidden; } .reviews__card-image img { max-width: 265px; max-height: 162px; width: 100%; height: auto; object-fit: contain; } .reviews__author { margin: 0 24px 24px; padding: 12px 16px; border-radius: 20px; border: 1px solid #DBDBDB; background: rgba(255, 255, 255, 0.16); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); flex-shrink: 0; } .reviews__author-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; } .reviews__author-name { font-family: 'FixelDisplay', Serif; font-size: 16px; font-weight: 500; line-height: 20px; letter-spacing: -0.4px; color: rgba(28, 31, 34, 0.90); } .reviews__author-type { font-family: 'FixelDisplay', Serif; font-size: 16px; font-weight: 500; line-height: 20px; letter-spacing: -0.4px; color: rgba(28, 31, 34, 0.90); text-align: right; flex-shrink: 0; } .reviews__author-company { margin-top: 2px; font-family: 'FixelDisplay', Serif; font-size: 14px; font-weight: 400; line-height: 18px; letter-spacing: -0.2px; color: rgba(28, 31, 34, 0.70); } .reviews__controls { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin-top: 8px; padding: 0 24px; height: 64px; background: #ffffff; border-radius: 24px; } .reviews__nav { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; border: none; background: transparent; cursor: pointer; color: rgba(28, 31, 34, 0.90); transition: color 0.2s ease; } .reviews__nav svg { pointer-events: none; } .reviews__nav:hover:not(.swiper-button-disabled), .reviews__nav:focus-visible:not(.swiper-button-disabled) { color: var(--green-primary, #4A853E); } .reviews__nav.swiper-button-disabled { opacity: 0.3; cursor: default; } .reviews__slider .swiper-wrapper{ display: grid; grid-auto-flow:column; } @media (max-width: 576px) { .reviews__header { height: auto; padding: 0; background: transparent; border-radius: 0; margin-bottom: 16px; } .reviews__title { font-size: 24px; } .reviews__btn--desktop { display: none; } .reviews__btn--mobile { display: inline-flex; width: 100%; margin: 13px auto; } .reviews__slider { margin-top: 0; } .reviews__card-top { padding: 24px 8px 0; } .reviews__card-title { font-size: 18px; } .reviews__text { font-size: 14px; } .reviews__card-image img { max-width: 205px; max-height: 112px; } .reviews__author { margin: 0 8px 8px; } .reviews__author-name, .reviews__author-type { font-size: 14px; } .reviews__controls { height: 48px; border-radius: 20px; } }