/* =========================================================
   テーマ A 「熱量・ヒーロー」
   墨黒 × ヒーロー赤、太い書体、写真前面・力強い
   ========================================================= */

:root {
  --bg:            #f6f2ec;
  --surface:       #ffffff;
  --surface-alt:   #efe8df;
  --text:          #1b1815;
  --text-muted:    #6c6258;
  --accent:        #e2342b;   /* ヒーロー赤 */
  --accent-contrast:#ffffff;
  --border:        #e2d8cb;
  --radius:        14px;
  --shadow:        0 14px 34px rgba(27,24,21,.16);

  --font-head: "Zen Kaku Gothic New", system-ui, sans-serif;
  --font-body: "Zen Kaku Gothic New", system-ui, sans-serif;
  --head-weight: 900;

  --header-bg:    rgba(27,24,21,.92);
  --header-text:  #ffffff;
  --header-border:transparent;

  --footer-bg:   #1b1815;
  --footer-text: #f6f2ec;
}

/* ヒーロー：代表写真を背景に、暗オーバーレイ＋白文字で力強く */
.hero {
  background:
    linear-gradient(180deg, rgba(20,16,14,.55), rgba(20,16,14,.78)),
    url("/images/hero-original.jpg") center / cover no-repeat;
  color: #fff;
}
.hero .eyebrow { color: #ffd0cc; }
.hero .lead { color: rgba(255,255,255,.9); }
.hero h1 { text-shadow: 0 2px 20px rgba(0,0,0,.3); }

/* セクション見出しに赤の下線アクセント */
h2.section-title { position: relative; }
h2.section-title::after {
  content: ""; display: block; width: 48px; height: 4px;
  background: var(--accent); border-radius: 4px;
  margin: .6rem auto 0;
}