/* ==========================================================================
   theme-luxury.css
   デザインパターン: 「高級・ラグジュアリー」
   配色: 黒/ネイビー+ゴールド / フォント: セリフ / 写真量: 少数精鋭・大きめ / レイアウト: 余白贅沢

   base.css・main.js はシンプルパターンと完全共通(コピーしただけで無編集)。
   このファイルの値と、下部の一部レイアウト微調整だけで雰囲気を変えている。
   ========================================================================== */

:root {
  /* ---- ベースカラー(黒・ネイビー系) ---- */
  --color-bg: #0B0D12;           /* ページ背景:深いブラックネイビー */
  --color-surface: #131722;      /* カード等の背景:一段明るいネイビー */
  --color-text: #EDE6D6;         /* 本文文字色:ゴールドがかったアイボリー */
  --color-text-sub: #B5AF9E;     /* 補足文字色:くすんだゴールドグレー */
  --color-border: #2A2E3A;       /* 罫線・区切り線:ダークネイビーの罫線 */

  /* ---- キーカラー(ゴールド系) ---- */
  --color-primary: #C9A227;      /* ボタン・強調:ゴールド */
  --color-accent: #D4AF37;       /* アイコン・価格・アクセント:クラシックゴールド */

  /* ---- ヒーロー(ファーストビュー) ---- */
  --color-hero-overlay: rgba(0, 0, 0, 0.5);
  --color-hero-text: #F5EFE0;

  /* ---- フッター ---- */
  --color-footer-bg: #030405;    /* ほぼ黒 */
  --color-footer-text: #CBB98A;  /* 落ち着いたゴールドクリーム */

  /* ---- フォント ----
     セリフ体を想定。「Shippori Mincho」を指定(和文の高級感のある明朝体)。
     本番導入時は google Fonts の <link> をheadに追加すること
     (このパターンではNoto Sans JPではなくShippori Minchoに変更している)。 */
  --font-heading: "Shippori Mincho", "Hiragino Mincho ProN", serif;
  --font-body: "Shippori Mincho", "Hiragino Mincho ProN", serif;

  /* ---- 形状・余白・影 ---- */
  --radius: 0px;                  /* 角丸なし。シャープな輪郭で高級感を出す */
  --spacing-unit: 1.6rem;         /* 余白を大きめに取り、贅沢な空間を作る */
  --shadow-style: 0 10px 36px rgba(201, 162, 39, 0.16); /* ゴールドがかった控えめな光の影 */
  --image-filter: grayscale(8%) contrast(1.08) brightness(0.95); /* 写真をやや落ち着いた編集部風トーンに */
}

/* 高級・ラグジュアリーパターン固有の微調整 */
body {
  font-weight: 400;
  letter-spacing: 0.03em; /* セリフ体は字間を少し広めに取ると上品に見える */
}
h1, h2, h3, h4 {
  font-weight: 600;
  letter-spacing: 0.06em;
}

/* セクションラベルを英字・字間広め・ゴールドの小さなキャプションとして扱う */
.section__label {
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--color-accent);
}

/* ギャラリー・メニューは「少数精鋭・大きめ」にするため列数を減らし、1点を大きく見せる */
.gallery__grid {
  grid-template-columns: repeat(3, 1fr);
  gap: calc(var(--spacing-unit) * 1.5);
}
.menu-card__grid {
  grid-template-columns: repeat(2, 1fr);
  gap: calc(var(--spacing-unit) * 1.5);
}

/* ダーク背景では黒影がほぼ見えないため、カードは影の代わりに極細のゴールド系ボーダーで輪郭を出す */
.menu-card,
.reviews__card,
.reasons__item,
.shop-link-card,
.reservation-form,
.line-cta,
.reviews-full {
  border: 1px solid var(--color-border);
  box-shadow: none;
}

/* LINE CTAは元がライトグリーン背景固定なので、ダークテーマでも浮かないように調整 */
.line-cta {
  background: var(--color-surface);
}

/* ロゴをセリフ体の大文字風・字間広めにして高級感を出す */
.site-header__logo {
  font-weight: 600;
  letter-spacing: 0.1em;
  font-size: 1.25rem;
}