/* ============================================================
   base.css — 最小 reset + 720 置中單欄 + 設計變數
   新業清水民和路（全民版）自製架構
   ============================================================ */

:root {
  /* 版面 */
  --col-width: 720px;          /* 置中單欄寬度（設計基準） */
  --page-bg: #06142e;          /* 桌機兩側留白底色（深藍） */

  /* 色票 */
  --navy: #0b2e6b;
  --navy-deep: #061735;
  --gold: #c6ac8e;             /* 沿用原版輪播圓點作用色 */
  --cta-yellow: #f6e58a;       /* 送出鈕黃（與 submit-btn 圖一致系） */
  --text-light: #ffffff;
  --error-red: #e3342f;

  /* 字級 */
  --font-zh: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui, sans-serif;

  /* 動畫 */
  --reveal-distance: 30px;
  --reveal-duration: 1s;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

body {
  background-color: var(--page-bg);
  color: var(--text-light);
  font-family: var(--font-zh);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  /* 預留固定底部 CTA 列高度，避免內容被遮住 */
  padding-bottom: var(--cta-bar-h, 72px);
}

/* 固定全螢幕背景（桌機兩側留白處顯示；手機被滿版內容欄蓋住）
   沿用原版 .global-body-wrapper 的固定背景做法 */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  background: #06142e url("https://d10acm3j8e4ewy.cloudfront.net/EDM/hisnyeh.news/v20260602/images/fullscreen-bg-navy.avif") center center / cover no-repeat;
}

img {
  display: block;
  max-width: 100%;
  border: 0;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  font-family: inherit;
  cursor: pointer;
}

/* 防止使用者誤選／誤拖背景與裝飾圖 */
.no-pointer {
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
}

/* ---- 720 置中單欄 ---- */
.page {
  width: 100%;
  max-width: var(--col-width);
  margin: 0 auto;
  position: relative;
  z-index: 0;
  background-color: var(--navy-deep); /* 段落間萬一有縫，以深藍墊底 */
  overflow: hidden;
}

/* 桌機：置中欄加陰影，與固定背景分層（手機滿版時不需要） */
@media (min-width: 768px) {
  .page {
    box-shadow: 0 0 80px rgba(0, 0, 0, 0.55);
  }
}

/* 每個區段：相對定位容器，背景圖滿欄 */
.section {
  position: relative;
  width: 100%;
  font-size: 0; /* 消除 inline img 底部間隙 */
}

.section__bg {
  width: 100%;
  height: auto;
}

/* 同尺寸標題文字層，疊在 bg 上 */
.section__title {
  position: absolute;
  inset: 0;
  width: 100%;
  height: auto;
}
