/* Users Features Section Component - 반응형 (데스크탑만) */
/* 기준 뷰포트: 1920px, clamp(min @768px, preferred vw, max @1920px) */
@media screen and (min-width: 768px) {
  .users-features-section {
    width: 100%;
    padding: clamp(40px, 5.21vw, 100px) 0; /* 100px @1920px */
    background-color: #ffffff;
  }

  .users-features-section__container {
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
  }

  /* 섹션 제목 */
  .users-features-section__title {
    font-family: var(--font-pretendard);
    font-weight: 700;
    font-size: clamp(17.6px, 2.29vw, 44px); /* 44px @1920px */
    line-height: clamp(24.64px, 3.21vw, 61.6px); /* 61.6px @1920px */
    letter-spacing: 0;
    color: #1a1d21;
    text-align: center;
    margin: 0;
    width: 100%;
    max-width: 1920px;
  }

  /* Feature 아이템 컨테이너 */
  .users-features-section__items {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: clamp(480px, 62.5vw, 1200px); /* 1200px @1920px */
    margin-left: auto;
    margin-right: auto;
    margin-top: clamp(88.8px, 11.56vw, 222px); /* 222px @1920px */
  }

  /* 개별 Feature 아이템 */
  .users-feature-item {
    width: 100%;
    display: flex;
    align-items: center;
    margin: 0;
  }

  /* Feature 1: 434px 높이 */
  .users-feature-item:nth-child(1) {
    height: clamp(173.6px, 22.6vw, 434px); /* 434px @1920px */
    margin-bottom: clamp(80px, 10.42vw, 200px); /* 200px @1920px */
  }

  /* Feature 2: 617px 높이 */
  .users-feature-item:nth-child(2) {
    height: clamp(246.8px, 32.14vw, 617px); /* 617px @1920px */
    margin-bottom: clamp(80px, 10.42vw, 200px); /* 200px @1920px */
  }

  /* Feature 3: 327px 높이 */
  .users-feature-item:nth-child(3) {
    height: clamp(130.8px, 17.03vw, 327px); /* 327px @1920px */
    margin-bottom: clamp(80px, 10.42vw, 200px); /* 200px @1920px */
  }

  /* Feature 4: 434px 높이 */
  .users-feature-item:nth-child(4) {
    height: clamp(173.6px, 22.6vw, 434px); /* 434px @1920px */
    margin-bottom: clamp(80px, 10.42vw, 200px); /* 200px @1920px */
  }

  /* Feature 5: 434px 높이 */
  .users-feature-item:nth-child(5) {
    height: clamp(173.6px, 22.6vw, 434px); /* 434px @1920px */
  }

  /* 텍스트 영역 기본 */
  .users-feature-item__text-area {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 0;
  }

  /* Feature 1: 텍스트 영역 (--reverse) */
  .users-feature-item:nth-child(1) .users-feature-item__text-area {
    width: clamp(216px, 28.13vw, 540px); /* 540px @1920px */
    margin-left: clamp(40px, 5.21vw, 100px); /* 100px @1920px */
    margin-right: 0;
  }

  /* Feature 2: 텍스트 영역 */
  .users-feature-item:nth-child(2) .users-feature-item__text-area {
    width: clamp(296px, 38.54vw, 740px); /* 740px @1920px */
  }

  /* Feature 3: 텍스트 영역 (--reverse) */
  .users-feature-item:nth-child(3) .users-feature-item__text-area {
    width: clamp(240px, 31.25vw, 600px); /* 600px @1920px */
    margin-left: clamp(40px, 5.21vw, 100px); /* 100px @1920px */
  }

  /* Feature 4: 텍스트 영역 */
  .users-feature-item:nth-child(4) .users-feature-item__text-area {
    width: clamp(232px, 30.21vw, 580px); /* 580px @1920px */
  }

  /* Feature 5: 텍스트 영역 (--reverse) */
  .users-feature-item:nth-child(5) .users-feature-item__text-area {
    width: clamp(216px, 28.13vw, 540px); /* 540px @1920px */
    margin-left: clamp(40px, 5.21vw, 100px); /* 100px @1920px */
  }

  /* 이미지가 왼쪽에 있는 경우 (reverse) */
  .users-feature-item--reverse {
    flex-direction: row-reverse;
  }

  .users-feature-item--reverse .users-feature-item__text-area {
    margin-left: 0;
    margin-right: clamp(24px, 3.13vw, 60px); /* 60px @1920px */
    text-align: left;
  }

  /* Feature 제목 */
  .users-feature-item__title {
    font-family: var(--font-pretendard);
    font-weight: 700;
    font-size: clamp(12.8px, 1.67vw, 32px); /* 32px @1920px */
    line-height: clamp(17.92px, 2.33vw, 44.8px); /* 44.8px @1920px */
    letter-spacing: clamp(-0.26px, -0.033vw, -0.64px); /* -0.64px @1920px */
    color: #1a1d21;
    margin: 0;
    margin-bottom: clamp(9.6px, 1.25vw, 24px); /* 24px @1920px */
    text-align: left;
  }

  /* Feature 설명 */
  .users-feature-item__description {
    font-family: var(--font-pretendard);
    font-weight: 400;
    font-size: clamp(8px, 1.04vw, 20px); /* 20px @1920px */
    line-height: clamp(11.2px, 1.46vw, 28px); /* 28px @1920px */
    letter-spacing: clamp(-0.16px, -0.021vw, -0.4px); /* -0.4px @1920px */
    color: #4a5058;
    margin: 0;
    text-align: left;
    white-space: pre-line;
  }

  /* 이미지 영역 */
  .users-feature-item__image-area {
    flex-shrink: 0;
    background-color: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }

  /* Feature 1: 이미지 560px × 434px */
  .users-feature-item:nth-child(1) .users-feature-item__image-area {
    width: clamp(224px, 29.17vw, 560px); /* 560px @1920px */
    height: clamp(173.6px, 22.6vw, 434px); /* 434px @1920px */
  }

  /* Feature 2: 이미지 400px × 617px */
  .users-feature-item:nth-child(2) .users-feature-item__image-area {
    width: clamp(160px, 20.83vw, 400px); /* 400px @1920px */
    height: clamp(246.8px, 32.14vw, 617px); /* 617px @1920px */
  }

  /* Feature 3: 이미지 500px × 327px */
  .users-feature-item:nth-child(3) .users-feature-item__image-area {
    width: clamp(200px, 26.04vw, 500px); /* 500px @1920px */
    height: clamp(130.8px, 17.03vw, 327px); /* 327px @1920px */
  }

  /* Feature 4: 이미지 560px × 434px */
  .users-feature-item:nth-child(4) .users-feature-item__image-area {
    width: clamp(224px, 29.17vw, 560px); /* 560px @1920px */
    height: clamp(173.6px, 22.6vw, 434px); /* 434px @1920px */
  }

  /* Feature 5: 이미지 560px × 434px */
  .users-feature-item:nth-child(5) .users-feature-item__image-area {
    width: clamp(224px, 29.17vw, 560px); /* 560px @1920px */
    height: clamp(173.6px, 22.6vw, 434px); /* 434px @1920px */
  }

  .users-feature-item__image-placeholder {
    display: none;
  }

  /* 데스크탑 이미지 표시 */
  .users-feature-item__image-desktop {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  /* Feature 1, 3, 4, 5: cornerRadius 40px */
  .users-feature-item:nth-child(1) .users-feature-item__image-desktop,
  .users-feature-item:nth-child(3) .users-feature-item__image-desktop,
  .users-feature-item:nth-child(4) .users-feature-item__image-desktop,
  .users-feature-item:nth-child(5) .users-feature-item__image-desktop {
    border-radius: clamp(16px, 2.08vw, 40px); /* 40px @1920px */
  }

  /* Feature 2: cornerRadius 28px */
  .users-feature-item:nth-child(2) .users-feature-item__image-desktop {
    border-radius: clamp(11.2px, 1.46vw, 28px); /* 28px @1920px */
  }

  /* 데스크탑에서 모바일 이미지 숨김 */
  .users-feature-item__image-mobile {
    display: none;
  }
}