/* ============================================================
   Hero 電腦版：內容靠左 + 高對比（2026-07-31 站長指定）
   設計約束（站長要求）：
   1. 靠左 —— 文字/查詢框/按鈕全部左對齊；左緣避開誦經直書
      經文欄（incense-blessing.js 桌機 sutra x=4%, maxH=70%，
      實佔約 4%~6%），內容左緣 11.5vw，實測間距 >90px。
      誦經期間（.ib-lit）再讓開到 14.5vw，平滑過渡。
   2. 對比 —— 不用毛玻璃/模糊，改深墨藍 #082744 + 0-blur 白色
      描邊（多重 text-shadow 模擬，跨瀏覽器安全），邊緣銳利。
   3. 不遮背景 —— 不加任何大面積遮罩；內容右緣收在 ~38%，
      貨船、港口起重機、合興宮完整露出。
   僅 >=1024px 生效；手機版維持既有版型不動。
   ============================================================ */

@media (min-width: 1024px) {

  /* ── 版面：整組內容靠左 ───────────────────────────── */
  #landing-hero.landing-hero {
    justify-content: flex-start;
  }

  #landing-hero .hero-content {
    text-align: left !important;
    margin-left: clamp(132px, 11.5vw, 268px) !important;
    margin-right: 0 !important;
    max-width: min(560px, 40vw) !important;
    padding-left: 0 !important;
    padding-right: 1.5rem !important;
    position: relative;
    transition: margin-left .6s ease;
  }

  /* 誦經期間讓開，確保永不壓到直書經文 */
  #landing-hero.ib-lit .hero-content {
    margin-left: clamp(168px, 14.5vw, 310px) !important;
  }

  /* 左側品牌色直條，收攏左對齊的結構 */
  #landing-hero .hero-content::before {
    content: '';
    position: absolute;
    left: -22px;
    top: 6px;
    bottom: 22px;
    width: 4px;
    border-radius: 4px;
    background: linear-gradient(180deg, #f59e0b 0%, #ea580c 45%, #0d9488 100%);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .55);
  }

  /* ── 對比：深墨藍 + 0-blur 白描邊（銳利，非模糊）── */
  #landing-hero .hero-title,
  #landing-hero .hero-title .gradient-text {
    color: #082744 !important;
    -webkit-text-fill-color: #082744 !important;
    background: none !important;
    text-shadow:
      1.6px 0 0 rgba(255, 255, 255, .92), -1.6px 0 0 rgba(255, 255, 255, .92),
      0 1.6px 0 rgba(255, 255, 255, .92), 0 -1.6px 0 rgba(255, 255, 255, .92),
      1.2px 1.2px 0 rgba(255, 255, 255, .92), -1.2px -1.2px 0 rgba(255, 255, 255, .92),
      1.2px -1.2px 0 rgba(255, 255, 255, .92), -1.2px 1.2px 0 rgba(255, 255, 255, .92);
    letter-spacing: .01em;
  }

  #landing-hero .hero-description {
    color: #0f3352;
    margin-left: 0;
    margin-right: 0;
    max-width: 30rem;
    font-weight: 600;
    text-shadow:
      1px 0 0 rgba(255, 255, 255, .85), -1px 0 0 rgba(255, 255, 255, .85),
      0 1px 0 rgba(255, 255, 255, .85), 0 -1px 0 rgba(255, 255, 255, .85);
  }

  /* ── Badge：實心品牌深藍，去毛玻璃 ─────────────────── */
  #landing-hero .hero-badge {
    background: #0e2b48 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: 1px solid rgba(255, 255, 255, .55) !important;
    color: #fff !important;
    box-shadow: 0 4px 14px rgba(8, 39, 68, .30);
    letter-spacing: .02em;
  }

  /* ── 查詢框：實心白 + 深藍細邊，邊界明確 ───────────── */
  #landing-hero .hero-search-form {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 480px;
  }

  #landing-hero .search-input-wrapper {
    background: #fff !important;
    border: 1.5px solid rgba(14, 43, 72, .35) !important;
    box-shadow: 0 10px 26px rgba(8, 39, 68, .22) !important;
  }

  #landing-hero .search-input {
    color: #0e2b48 !important;
    font-weight: 500;
  }

  /* ── 倉庫地址按鈕：靠左 ────────────────────────────── */
  #landing-hero .warehouse-copy-btn {
    margin-left: 0 !important;
    margin-right: auto !important;
    box-shadow: 0 8px 22px rgba(234, 88, 12, .35);
  }

  #landing-hero .warehouse-toast {
    left: 0 !important;
    right: auto !important;
    transform: none !important;
  }

  /* ── 訪客版元素一併靠左 + 提高對比 ─────────────────── */
  #landing-hero .hero-value-props,
  #landing-hero .hero-cta-group,
  #landing-hero .hero-guest-search,
  #landing-hero .hero-stats {
    justify-content: flex-start !important;
  }

  #landing-hero .hero-value-item,
  #landing-hero .hero-login-link,
  #landing-hero .hero-guest-search__link {
    color: #0f3352 !important;
    font-weight: 600;
    text-shadow:
      1px 0 0 rgba(255, 255, 255, .85), -1px 0 0 rgba(255, 255, 255, .85),
      0 1px 0 rgba(255, 255, 255, .85), 0 -1px 0 rgba(255, 255, 255, .85);
  }

  #landing-hero .hero-stats .stat-number,
  #landing-hero .hero-stats .stat-label {
    color: #082744 !important;
    text-shadow:
      1px 0 0 rgba(255, 255, 255, .9), -1px 0 0 rgba(255, 255, 255, .9),
      0 1px 0 rgba(255, 255, 255, .9), 0 -1px 0 rgba(255, 255, 255, .9);
  }

  #landing-hero .hero-stats .stat-divider {
    background: rgba(14, 43, 72, .35) !important;
  }

  /* ── 捲動提示跟著靠左，避免落在船上 ───────────────── */
  #landing-hero .scroll-indicator {
    left: clamp(132px, 11.5vw, 268px) !important;
    transform: none !important;
    color: #0e2b48 !important;
  }

  #landing-hero .scroll-indicator__mouse {
    border-color: rgba(14, 43, 72, .6) !important;
  }

  #landing-hero .scroll-indicator__wheel {
    background: rgba(14, 43, 72, .8) !important;
  }

  /* a11y：尊重減少動態偏好 */
  @media (prefers-reduced-motion: reduce) {
    #landing-hero .hero-content { transition: none; }
  }
}

/* ── 窄桌機（1024~1439）收窄，避免壓到貨船 ─────────── */
@media (min-width: 1024px) and (max-width: 1439px) {
  #landing-hero .hero-content {
    max-width: min(460px, 40vw) !important;
    margin-left: clamp(112px, 10vw, 168px) !important;
  }
  #landing-hero.ib-lit .hero-content {
    margin-left: clamp(140px, 12.5vw, 200px) !important;
  }
  #landing-hero .hero-title {
    font-size: clamp(1.7rem, 3.3vw, 2.5rem) !important;
  }
  #landing-hero .hero-content::before {
    left: -18px;
  }
  #landing-hero .scroll-indicator {
    left: clamp(112px, 10vw, 168px) !important;
  }
}