/* ------------------------------------------------------------------------------------------------------------------ */
/* Section - Premium (카드 슬라이더) — 통일 섀도 & 선명한 컨트롤 버튼 (정리본)                                          */
/* ------------------------------------------------------------------------------------------------------------------ */
.wrap.xet-section.xet-premium{
  padding:40px 0;
  --theme-color:#58c4a7;               /* 페이지별 포인트 컬러 */
}

/* 헤더 */
.wrap.xet-section.xet-premium .head{ max-width:1120px; margin:0 auto 24px; text-align:center; }
.wrap.xet-section.xet-premium .head .h2{ font-weight:800; letter-spacing:-.02em; }
.wrap.xet-section.xet-premium .head .sub{ margin-top:8px; color:#6b7280; }

/* 슬라이더 래퍼 */
.wrap.xet-section.xet-premium .slider{ position:relative; max-width:1120px; margin:0 auto; }

/* 트랙 */
.wrap.xet-section.xet-premium .slider .track{
  display:grid; grid-auto-flow:column; gap:20px;
  grid-auto-columns:calc((100% - 40px)/3);
  overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  padding:4px 0 12px; -ms-overflow-style:none;
}
.wrap.xet-section.xet-premium .slider .track::-webkit-scrollbar{ display:none; }
.wrap.xet-section.xet-premium .slider .track{ scrollbar-width:none; }

/* 카드 */
.wrap.xet-section.xet-premium .slider .card{
  scroll-snap-align:start;
  background:#fff; border:1px solid #e5e7eb; border-radius:16px;
  box-shadow:0 4px 14px rgba(0,0,0,.10); overflow:hidden;
}
/* === 카드 썸네일: 3:2 고정 비율 === */
.wrap.xet-section.xet-premium .slider .thumb{
  aspect-ratio: 3 / 2;
  overflow: hidden;
  background:#f5f5f5;
}

/* 이미지: 박스에 맞춰 채움(가로폭 100%, 세로 자동X) */
.wrap.xet-section.xet-premium .slider .thumb img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;        /* 비율 유지하며 잘라냄 */
  object-position:center;  /* 중앙 기준 크롭 */
}
.wrap.xet-section.xet-premium .slider .body{ padding:16px; }
.wrap.xet-section.xet-premium .slider .body h3{ font-size:18px; margin:0 0 8px; }
.wrap.xet-section.xet-premium .slider .body p{ margin:0; color:#4b5563; }

/* 컨트롤 버튼(좌/우) — 테마 실색 + 통일 섀도 */
.wrap.xet-section.xet-premium .slider .controls{
  display:flex; justify-content:center; gap:20px; margin-top:18px;
  position:relative; z-index:50;
}
.wrap.xet-section.xet-premium .slider .controls .arrow{
  width:56px; height:56px; border-radius:9999px;
  display:grid; place-items:center;
  border:1px solid var(--theme-color, #58c4a7);
  background:var(--theme-color, #58c4a7);
  color:#fff;                                     /* 아이콘(currentColor) */
  transition:.15s ease;
  box-shadow:0 4px 14px rgba(0,0,0,.10);          /* 기본: 약한 섀도 */
}
.wrap.xet-section.xet-premium .slider .controls .arrow svg{
  width:28px; height:28px; fill:none; stroke:currentColor; stroke-width:2;
}
.wrap.xet-section.xet-premium .slider .controls .arrow:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 30px rgba(0,0,0,.25);         /* 호버: 강한 섀도 */
}
.wrap.xet-section.xet-premium .slider .controls .arrow:active{ transform:translateY(0); }
.wrap.xet-section.xet-premium .slider .controls .arrow:focus-visible{
  outline:none;
  box-shadow:
    0 0 0 4px color-mix(in oklab, var(--theme-color, #58c4a7) 28%, transparent),
    0 10px 30px rgba(0,0,0,.25);                  /* 포커스: 강한 섀도 */
}
.wrap.xet-section.xet-premium .slider .controls .arrow:disabled{
  background:#e5e7eb; border-color:#e5e7eb; color:#9ca3af;
  transform:none; box-shadow:none; cursor:not-allowed;
}

/* 반응형 */
@media (max-width:480px){
  .wrap.xet-section.xet-premium .slider .track{ grid-auto-columns:100%; padding:0 0 12px; }
}
@media (min-width:481px) and (max-width:1023px){
  .wrap.xet-section.xet-premium .slider .track{
    grid-auto-columns:calc((100% - 20px)/2); padding:4px 0 12px;
  }
}