/* =====Hero區===== */

/* mobile圖片 */
.hero-1 {
  background: url("../images/success-model/bakery/hero/case-bakery@1x.jpg")
    center/cover no-repeat;
}

/* tablet圖片 */
@media (min-width: 768px) {
  .hero-1 {
    background: url("../images/success-model/bakery/hero/case-bakery@tablet.jpg")
      center center / cover no-repeat;
  }
}

/* desktop圖片 */
@media (min-width: 1024px) {
  .hero-1 {
    background: url("../images/success-model/bakery/hero/case-bakery@desktop.jpg")
      center center / cover no-repeat;
  }
}

/* =====背景圖===== */
.bakery-block::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    /* 先鋪一層柔和的頂部到下方的淡白漸層，避免上方文字太突兀 */ linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.85) 0%,
      rgba(255, 255, 255, 0.55) 35%,
      rgba(255, 255, 255, 0.35) 100%
    ),
    url("../images/success-model/bakery/bakery-block/bakery-bg@1x.jpg") center /
      cover no-repeat; /* 背景圖 */
  z-index: -2; /* 在內容底下 */
}

@media (min-width: 768px) {
  .bakery-block::before {
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.85) 0%,
        rgba(255, 255, 255, 0.55) 35%,
        rgba(255, 255, 255, 0.35) 100%
      ),
      url("../images/success-model/bakery/bakery-block/bakery-bg@tablet.jpg")
        center/cover no-repeat;
  }
}

@media (min-width: 1200px) {
  .bakery-block::before {
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.85) 0%,
        rgba(255, 255, 255, 0.55) 35%,
        rgba(255, 255, 255, 0.35) 100%
      ),
      url("../images/success-model/bakery/bakery-block/bakery-bg@desktop.jpg")
        center/cover no-repeat;
  }
}
