body {
    position: relative;
    
  }

  #home{
    scroll-margin-top: 60px; /* 根據 header 高度調整 */
  }

.bg-points{
    background-color: #ee7f4f; 
}

.text-points{
  color: #ef7f4f;
}


/* 原價（小字＋刪除線） */
.card-title .orig-price{
  font-size: .75rem;
  line-height: 1;
  vertical-align: baseline;
  opacity: .85;
}

.card-title .subnote-block{
  display: inline-block;      /* ← 由 block 改成 inline-block，寬度跟內容走 */
  max-width: 100%;
  font-size: .8rem;
  line-height: 1;
  margin-top: .5rem;
   margin-bottom: .5rem;       /* ✅ 與下方文字拉開 0.5rem */
  padding:  .4rem .45rem;
  border-radius: .5rem;
  background-color: var(--bs-secondary-bg, #f1f3f5);
  color: var(--bs-secondary-color, #6c757d);
}
@media (max-width:576px){
  .card-title .subnote-block{ font-size: .75rem; }
}

.accordion-button:not(.collapsed) {
  background-color: #f5b793; /* 展開時的背景顏色 */
  color: #ffffff;                /* 展開時的文字顏色 */
  box-shadow: 0 4px 8px #de776923; /* 展開時增加陰影 */
}

.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");

}

.accordion-button::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23e74c3c'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
}


/* BN 圖片：跟旁邊輪播一樣大小，高度自適應 */
.bn-img{
  object-fit: cover;   /* 填滿容器，多餘裁切 */
  object-position: center;
  display: block;
}


/* 兩邊媒體容器：固定 680x440 比例，圖片塞滿且不變形 */
.media-frame{
  position: relative;
  width: 100%;
}
.aspect-680-440{
  aspect-ratio: 680 / 440;  /* 約 1.545:1 */
}

/* 左邊輪播也填滿容器高度 */
.media-frame .carousel,
.media-frame .carousel-inner,
.media-frame .carousel-item{
  height: 100%;
}

/* 圖片統一 cover，鋪滿同高同寬；無圓角、無陰影 */
.media-frame .carousel-item img,
.media-frame > img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}


/* 左右共用框：讓兩側等高、滿版裁切；不要圓角和陰影 */
.media-box{
  position: relative;
  width: 100%;
  height: clamp(220px, 36vw, 440px); /* 手機較矮，桌機上限 440px（可改） */
  overflow: hidden;                  /* 直接裁切邊緣、無圓角陰影 */
}

.media-box > img,
.media-box .carousel-item img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;                 /* 與左側/其他區一致做滿版裁切 */
}

/* 讓 carousel 高度撐滿容器 */
.media-box .carousel,
.media-box .carousel-inner,
.media-box .carousel-item{
  height: 100%;
}

/* 可選：指示點/箭頭可視性微調 */
.media-box .carousel-indicators [data-bs-target]{ background-color: rgba(255,255,255,.85); }
.media-box .carousel-control-prev,
.media-box .carousel-control-next{ filter: drop-shadow(0 1px 4px rgba(0,0,0,.6)); }


/* 錨點停靠，避免被 fixed-top navbar 擋住 */
#home, #meyer, #products, #thing, #app { 
  scroll-margin-top: 58px; /* 你的導覽列高度 */
}


/* 讓容器內的區塊出血到視窗左右貼邊 */
.video-bleed{
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.video-bleed .ratio { width: 100%; }
.video-bleed iframe{
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
