/* Shared case studies presentation used by every page with the work slider. */
#work.work--compact,
#work.work--compact *,
#work.work--compact *::before,
#work.work--compact *::after { box-sizing: border-box; }

#work.work--compact {
    --work-left: clamp(24px, calc(24px + (100vw - 1186px) * .146), 131px);
    --work-right: clamp(9px, calc(24px - (100vw - 1186px) * .0205), 24px);
    position: relative;
    isolation: isolate;
    width: 100%;
    min-height: 791px;
    margin-inline: auto;
    padding: 146px 0 70px;
    overflow: hidden;
    border-radius: 0;
    background: #031d3d;
}

#work.work--compact::before {
    content: '';
    position: absolute;
    z-index: -1;
    top: 0;
    left: 50%;
    width: 1920px;
    height: 791px;
    transform: translateX(-50%);
    background: center / contain no-repeat url('../assets/new-landing/case-studies-lines.svg');
    pointer-events: none;
}

#work.work--compact #work_inner {
    width: calc(100% - var(--work-left) - var(--work-right));
    max-width: none;
    margin-left: var(--work-left);
    flex-direction: row;
    align-items: flex-start;
    gap: clamp(48px, 8.44vw, 162px);
}

#work.work--compact .work_left { flex: 0 0 clamp(319px, calc(319px + (100vw - 1186px) * .1), 392px); max-width: 392px; padding-top: 0; }
#work.work--compact .work_title { color: #fff; font-size: clamp(48px, 3.75vw, 72px); line-height: 1.08; }
#work.work--compact .work_txt { color: #b9c0d4; font-size: 22px; margin-bottom: 60px; }
#work.work--compact .work_right { flex: 1; min-width: 0; }
#work.work--compact #work_slider { max-width: none; }
#work.work--compact .work_slide { width: min(414.375px, 100%); }
#work.work--compact .case_study { display: flex; flex-direction: column; gap: 15.607px; height: 499px; padding: 14.047px 18.729px; border-radius: 24.972px; }
#work.work--compact .case_study_top { flex: 0 0 auto; flex-direction: row; align-items: center; gap: 8px; padding: 0; margin-bottom: 0; }
#work.work--compact .case_study_dr,
#work.work--compact .case_study_dr_left,
#work.work--compact .case_study_dr_right,
#work.work--compact .case_study_traffic { gap: 4px; }
#work.work--compact .case_study_top_txt { font-size: 15px; }
#work.work--compact .case_study_dr_left img,
#work.work--compact .case_study_traffic > img { width: 17px; height: 17px; }
#work.work--compact .case_study_traffic_per { padding: 3px 5px; }
#work.work--compact .case_study_traffic_per span { font-size: 11px; }
#work.work--compact .viewport { flex: 0 0 315px; max-width: none; max-height: none; height: 315px; padding: 14px; margin-bottom: 0; border-radius: 18px; }
#work.work--compact .viewport_inner { height: 287px; }
#work.work--compact .viewport_top,
#work.work--compact .viewport_lines { max-height: 263px; }
#work.work--compact .viewport_bottom_item { font-size: 10px; }
#work.work--compact .case_study_bottom { flex: 1; justify-content: space-between; gap: 8px; }
#work.work--compact .case_study_title { min-height: 54px; max-height: 62px; font-size: 19px; line-height: 1.08; }
#work.work--compact .case_study_btn { gap: 8px; }
#work.work--compact .case_study_btn span { font-size: 14px; }
#work.work--compact .case_study_btn img { width: 24px; height: 24px; }

@media (max-width: 900px) {
    #work.work--compact #work_inner { gap: 24px; }
    #work.work--compact .work_left { flex-basis: 33%; }
    #work.work--compact .work_title { font-size: 48px; }
    #work.work--compact .work_txt { font-size: 17px; }
}

@media (max-width: 720px) {
    #work.work--compact { min-height: 0; padding: 22px 0 48px; }
    #work.work--compact #work_inner { width: calc(100% - 32px); margin-left: 16px; flex-direction: column; }
    #work.work--compact .work_left { flex: none; width: 100%; max-width: none; }
    #work.work--compact .work_right { width: 100%; }
    #work.work--compact .work_title { font-size: 48px; }
}