/* === Lightweight Owl (no jQuery) === */
@charset "utf-8";

.owl-carousel{position:relative;width:100%;touch-action:pan-y;user-select:none}
.owl-carousel.owl-loading{opacity:0}
.owl-carousel.owl-loaded{opacity:1}

.owl-carousel .owl-stage-outer{
  position:relative;
  overflow:hidden; /* 外層當視口；JS 會對它 scrollLeft */
  width:100%
}
.owl-carousel .owl-stage{display:flex;will-change:transform}
.owl-carousel .owl-item{flex:0 0 auto;position:relative}
.owl-carousel .owl-item img{display:block;width:100%;height:auto}

/* dots */
.owl-dots{position:relative;display:flex;gap:8px;justify-content:center;margin-top:10px;}
.owl-dot{width:6px; height: 6px; border-radius:999px;background:#ccc;border:0; #ccc;opacity:.7;cursor: pointer;}
.owl-dot[aria-current="true"], .owl-dot:hover{background:var(--primary-color, #333);opacity:1}

/* nav */
.owl-nav{position:absolute;inset:0;pointer-events:none}
.owl-prev,.owl-next{
  pointer-events:auto;position:absolute;top:50%;transform:translateY(-50%);
  width:40px;height:40px;border-radius:999px;border:0;display:grid;place-items:center;
  background:rgba(0,0,0,.2);color:#fff;font-size:20px;line-height:1;cursor:pointer
}
.owl-prev{left:6px}
.owl-next{right:6px}
.owl-prev:hover,.owl-next:hover{background:rgba(0,0,0,.55)}

/* fade */
.animated{animation-duration:600ms;animation-fill-mode:both}
.fadeIn{animation-name:owlFadeIn}
.fadeOut{animation-name:owlFadeOut}
@keyframes owlFadeIn{from{opacity:0}to{opacity:1}}
@keyframes owlFadeOut{from{opacity:1}to{opacity:0}}

/* autoHeight */
.owl-height{transition:height .35s ease}


/* === Owl Tabs (取代 dots 用的頁籤) === */
.owl-tabs {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  align-items: center;
  margin: 10px 0 14px;         /* 頁籤在上方：你也可以改成 margin-top */
  border-bottom: 1px solid rgba(0,0,0,.08);
  padding-bottom: 6px;
}
.owl-tab {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 6px 10px;
  font: inherit;
  color: #666;
  cursor: pointer;
  border-radius: 8px;
  transition: background .2s ease, color .2s ease;
}
.owl-tab:hover { background: rgba(0,0,0,.05); color: #333; }
.owl-tab[aria-current="true"] {
  color: #111;
  background: rgba(0,0,0,.08);
}

/* 你原有的 Owl 核心樣式（上一回給你的）保持不變；只列出必要段落以提醒 */
.owl-carousel{position:relative;width:100%;touch-action:pan-y;user-select:none}
.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;width:100%}
.owl-carousel .owl-stage{display:flex;will-change:transform}
.owl-carousel .owl-item{flex:0 0 auto;position:relative}
.owl-dots{position:relative;display:flex;gap:8px;justify-content:center;margin-top:10px}