/*
Theme Name: STM Theme
Description: 埼玉おもちゃ美術館 オリジナルテーマ
Version: 1.0.0
Text Domain: stm-theme
*/

/* =========================================================
   CSS変数（デザインシステム / docs/01_design-system.md）
   ========================================================= */
:root {
  /* ロゴ（オレンジの家＋黒文字）に合わせた配色。ベースは白。 */
  --stm-primary:      #F39800;  /* ロゴのオレンジ：CTA・アクセント */
  --stm-primary-dark: #D97E00;  /* ホバー・リンク濃色 */
  --stm-wood:         #F5A623;  /* 明るいアンバー：補助アクセント */
  --stm-wood-dark:    #3A2A1A;  /* 濃いブラウン：フッター・濃い見出し */
  --stm-cream:        #FFFBF4;  /* ページ背景：あたたかいオフホワイト */
  --stm-wood-light:   #FFF3E0;  /* 淡いアンバー：カード・帯背景 */
  --stm-green:        #3B6D11;  /* WEST館（識別色として維持） */
  --stm-blue:         #185FA5;  /* EAST館（識別色として維持） */
  --stm-text:         #3A2A1A;  /* 本文：やわらかいブラウン系 */
  --stm-gray:         #7A6A5C;  /* サブテキスト（温かみのあるグレー） */
  --stm-white:        #FFFFFF;  /* 白（カード地） */
  --stm-border:       #EFE7DC;  /* 区切り線（あたたかい薄ベージュ） */

  --stm-font-base:    'Noto Sans JP', sans-serif;
  --stm-font-round:   'Zen Maru Gothic', 'Noto Sans JP', sans-serif; /* 見出し用 丸ゴシック */
  --stm-font-en:      'Poppins', sans-serif;

  --stm-radius-sm:    12px;
  --stm-radius-md:    20px;
  --stm-radius-lg:    32px;
  --stm-radius-pill:  100px;
  --stm-section:      64px;
  --stm-container:    1100px;

  /* やわらかい影 */
  --stm-shadow:       0 8px 24px rgba(150, 110, 60, 0.12);
  --stm-shadow-sm:    0 4px 14px rgba(150, 110, 60, 0.10);
}

/* 見出しは丸ゴシックでやわらかく */
h1, h2, h3, h4,
.stm-section__title,
.stm-hero__title,
.stm-page-hero__title {
  font-family: var(--stm-font-round);
}

/* =========================================================
   CSSリセット
   ========================================================= */
*,
*::before,
*::after {
  box-sizing: border-box;
}

* {
  margin: 0;
  padding: 0;
}

img {
  max-width: 100%;
  height: auto;
}

/* =========================================================
   body ベーススタイル
   ========================================================= */
html {
  /* clip は横はみ出しを防ぎつつ position:sticky を壊さない（hidden だと固定が効かない） */
  overflow-x: clip;
}

body {
  font-family: var(--stm-font-base);
  color: var(--stm-text);
  background: var(--stm-cream);
  line-height: 1.8;
  overflow-x: clip;
}

a {
  color: var(--stm-primary-dark);
}

/* =========================================================
   汎用クラス
   ========================================================= */

/* コンテンツ幅コンテナ */
.stm-container {
  max-width: var(--stm-container);
  margin: 0 auto;
  padding: 0 16px;
}

/* セクション余白（モバイルファースト：スマホ40px → PC64px） */
.stm-section {
  padding: 40px 0;
}

/* プライマリボタン */
.stm-btn-primary {
  display: inline-block;
  background: var(--stm-primary);
  color: var(--stm-white);
  font-family: var(--stm-font-round);
  font-weight: 700;
  text-decoration: none;
  text-align: center;
  border: none;
  border-radius: var(--stm-radius-pill);
  padding: 14px 34px;
  box-shadow: 0 4px 0 rgba(183, 110, 0, 0.35); /* ぷっくりした立体感 */
  cursor: pointer;
  transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.stm-btn-primary:hover {
  background: var(--stm-primary-dark);
  transform: translateY(-2px);
  box-shadow: 0 6px 0 rgba(183, 110, 0, 0.35);
}

.stm-btn-primary:active {
  transform: translateY(2px);
  box-shadow: 0 2px 0 rgba(183, 110, 0, 0.35);
}

/* セカンダリボタン */
.stm-btn-secondary {
  display: inline-block;
  background: var(--stm-white);
  color: var(--stm-primary-dark);
  font-family: var(--stm-font-round);
  font-weight: 700;
  text-decoration: none;
  text-align: center;
  border: 2px solid var(--stm-primary);
  border-radius: var(--stm-radius-pill);
  padding: 12px 30px;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, transform 0.15s ease;
}

.stm-btn-secondary:hover {
  background: var(--stm-primary);
  color: var(--stm-white);
  transform: translateY(-2px);
}

/* =========================================================
   レスポンシブ（PC拡張：min-widthで上書き）
   ========================================================= */
@media (min-width: 1024px) {
  .stm-section {
    padding: var(--stm-section) 0;
  }
}