/* =========================================================
   PARTNERS (로고 흐름/마키 + 버튼) 최종본
   - 중복 제거 / Swiper(grid/slide) 관련 제거
   - 현재 구조: .partners_track > .partners_row > .partner_item (2번 복제) 기준
   ========================================================= */

/* ===== Section / Header ===== */
.partners{ background: transparent; }

.partners_head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}

/* (선택) 토글 버튼을 다시 쓸 경우만 유지 */
.partners_toggle{
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  border-radius:999px;
  padding:8px 12px;
  cursor:pointer;
  font-size:14px;
  line-height:1;
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#111;
}
.partners_toggle[aria-pressed="true"]{
  border-color: var(--color-main);
  color: var(--color-main);
}

/* ===== Prev/Next 버튼(화살표만) ===== */
.partners_nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  gap: var(--layout-width);
  z-index: 5;
  pointer-events:none;           /* 래퍼는 클릭 막고 */
}
.partners_btn{
  pointer-events:auto;           /* 버튼만 클릭 가능 */
  width:auto;
  height:auto;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;

  font-size: 50px;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;

  color: rgba(0,0,0,0.415);
  transition: color .15s ease, transform .15s ease;
}
.partners_btn:hover{
  color: rgba(0,0,0,.85);
  transform: translateY(-1px);
}
.partners_btn:active{ transform: translateY(0); }
.partners_btn:focus-visible{
  outline: 2px solid var(--color-main);
  outline-offset: 3px;
  border-radius: 6px;
}

/* ===== Track / Row (마키 트랙) ===== */
.partners_track{
  overflow:hidden;
  width:100%;
  touch-action: pan-y;          /* 세로 스크롤 유지(가로는 JS가 판정) */
  cursor: grab;
}
.partners_track.is-dragging{ cursor: grabbing; }

.partners_row{
  display:flex;
  flex-wrap:nowrap;             /* 줄바꿈 금지(필수) */
  align-items:center;
  gap:16px;                     /* PC gap */
  margin: 20px 0;
  will-change: transform;
}

/* ===== Card ===== */
.partner_item{
  display:flex;
  align-items:center;
  justify-content:center;

  height: 76px;
  padding: 0 18px;

  border-radius: 14px;
  background:#fff;
  border:1px solid #e9e9ee;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .08);

  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  will-change: transform;
  overflow:hidden;              /* ✅ 모바일 2개 강제 시 튀어나옴 방지(PC도 문제 없음) */
}

/* 로고 이미지 */
.partner_item img{
  display:block;
  width:auto;
  height:auto;
  max-width: 100% !important;   /* ✅ 카드 밖으로 못 나가게 */
  max-height: 50px;

  object-fit:contain;
  filter: grayscale(1) opacity(.85);
  transition: filter .2s ease;
  -webkit-user-drag:none;
  user-drag:none;
}

/* Hover / Focus */
.partner_item:hover,
.partner_item:focus-visible{
  transform: translateY(-2px);
  border-color: rgba(0,0,0,.14);
  box-shadow: 0 10px 24px rgba(0,0,0,.10);
  outline:none;
}
.partner_item:hover img,
.partner_item:focus-visible img{
  filter: grayscale(0) opacity(1);
}

/* ===== Width rules (PC vs Mobile 2-up) ===== */
@media (min-width: 821px){
  .partners_row{ gap:16px; }
  .partners_row .partner_item{
    flex: 0 0 auto;
    min-width: 170px;
  }
}

@media (max-width: 820px){
  .partners_row{ gap:12px; }

  /* ✅ 모바일: 2개씩 고정 */
  .partners_row .partner_item{
    flex: 0 0 calc((100% - 12px) / 2);
    min-width: 0;
  }

  .partner_item{
    height: 72px;
    padding: 0 14px;
    box-shadow: none !important;      /* 모바일은 그림자 제거 */
  }
  .partner_item img{
    max-height: 40px;
  }

  /* 모바일은 hover 리프트 제거 */
  .partner_item:hover,
  .partner_item:focus-visible{
    transform:none;
    box-shadow:none;
  }
}

/* 모션 최소화 */
@media (prefers-reduced-motion: reduce){
  .partner_item, .partner_item img { transition: none !important; }
}

.partner_item{
  min-width: 0;       /* ✅ 내용 폭 때문에 카드가 안 늘어나게 */
}

.partner_item img{
  width: 100%;
  max-width: 100% !important;   /* ✅ 카드 폭에 맞춰 축소 */
  height: auto;
  object-fit: contain;
}
@media (max-width: 820px){
  .partners_row .partner_item{
    flex: 0 0 calc((100% - 12px) / 2) !important;
    width: calc((100% - 12px) / 2) !important;
    max-width: calc((100% - 12px) / 2) !important;
    min-width: 0 !important;
  }
}
@media (min-width: 821px){
  .partners_row .partner_item{
    width: 170px;
    flex: 0 0 170px;
  }
}