/* =========================================================
   ORWA デザイントークン
   色・サイズ・余白はすべてここで定義する。
   本文HTMLで #0f6ea6 のような直接指定は行わず、
   var(--orwa-primary) の形で参照すること。
   ========================================================= */

:root {

  /* --- 色 ------------------------------------------------
     ブランドカラー確定後に差し替える（暫定値） */
  --orwa-primary:      #0f3a55;  /* メインカラー */
  --orwa-primary-dark: #0a2839;
  --orwa-accent:       #c9a227;  /* アクセント（CTA等） */
  --orwa-text:         #1f2a33;  /* 本文文字色 */
  --orwa-text-sub:     #66717a;  /* 補足文字色 */
  --orwa-border:       #dde3e8;  /* 罫線 */
  --orwa-bg:           #ffffff;  /* 背景 */
  --orwa-bg-sub:       #f7f9fa;  /* 薄い背景 */

  /* 濃い色の上に乗る文字色。値は --orwa-bg と同じだが役割が違う。
     背景色を文字色に流用すると、片方を変えたときに
     もう片方が意図せず動く。前景と背景は別の変数で持つ。 */
  --orwa-on-primary:   #ffffff;

  --orwa-notice-bg:    #fff4ce;  /* 注記背景 */
  --orwa-notice-line:  #e0c878;
  --orwa-notice-text:  #5a4a20;

  /* --- 幅 ------------------------------------------------ */
  --orwa-w-article:  820px;   /* 記事本文 */
  --orwa-w-wide:    1200px;   /* 一覧・LP */
  --orwa-gutter:      20px;   /* 左右の余白（SP） */

  /* --- 文字 ---------------------------------------------- */
  --orwa-font: system-ui, -apple-system, "Hiragino Sans",
               "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;

  --orwa-fs-xs:  0.75rem;
  --orwa-fs-sm:  0.875rem;
  --orwa-fs-md:  1rem;
  --orwa-fs-lg:  1.125rem;
  --orwa-fs-xl:  1.375rem;
  --orwa-fs-2xl: 1.75rem;
  --orwa-fs-3xl: 2.25rem;

  --orwa-lh:       1.8;
  --orwa-lh-tight: 1.4;

  /* --- 余白 ---------------------------------------------- */
  --orwa-sp-1: 4px;
  --orwa-sp-2: 8px;
  --orwa-sp-3: 16px;
  --orwa-sp-4: 24px;
  --orwa-sp-5: 40px;
  --orwa-sp-6: 64px;
  --orwa-sp-7: 96px;

  /* --- その他 -------------------------------------------- */
  --orwa-touch: 44px;
  --orwa-stroke: 1px;
  --orwa-fw-bold: 700;
  --orwa-radius: 6px;
  --orwa-shadow: 0 1px 3px rgba(0,0,0,.08);
}

/* =========================================================
   ブレークポイント（参考値。実際は各CSSで media query を書く）
     スマホ      : ～767px
     タブレット  : 768px～1023px
     PC          : 1024px～
   ========================================================= */

/* =========================================================
   新デザイン（Figma「旅するウエディング」TOP・下層）のトークン
   既存の --orwa-primary などは旧サイト再現ページが使うため値を変えない。
   新デザインの部品はこちらを参照する。
   ========================================================= */

:root {
  --orwa-c-blue:       #00b0ec;  /* ボタン・言語切替・SNS 帯・PAGE TOP */
  --orwa-c-navy:       #173142;  /* 本文・ナビ・コピーライト帯 */
  --orwa-c-gray:       #667985;  /* 日付・カテゴリー・補足 */
  --orwa-c-line:       #d7e2e5;  /* 罫線 */
  --orwa-c-line-light: #dde3e4;
  --orwa-c-orange:     #ff9200;  /* お問い合わせ */
  --orwa-c-pink:       #e85a7d;  /* NEW・本文の小見出し */
  --orwa-c-sky:        #6bc5f7;  /* 筆記体の飾り */
  --orwa-c-link:       #187da0;  /* 記事の H1・本文リンク */
  --orwa-c-gold:       #cbb77b;  /* 2 つ目のボタン */
  --orwa-c-beige:      #ebeae5;  /* ベージュの囲み */
  --orwa-c-table-head: #69a2b5;  /* 表の見出しセル */
  --orwa-c-bg:         #f7f6f1;  /* 下層ページの地 */
  --orwa-c-bg-top:     #d2edf7;  /* TOP の地 */
  --orwa-c-grad-1:     #88d3d9;  /* KV・SP メニューのグラデーション */
  --orwa-c-grad-2:     #2493d3;
  --orwa-c-grad-3:     #4690bf;
  --orwa-c-white:      #ffffff;
  --orwa-c-cream:      #f0eee7;  /* ロマン時間：施設カードの名前の地 */
  --orwa-c-sea:        #38a5de;  /* ロマン時間：カテゴリのタイルの帯 */
  --orwa-c-teal:       #479ea2;  /* ロマン時間：3 つ目のイベント */
  --orwa-c-gold-light: #e9d290;  /* ロマン時間：相談ボタンのグラデーションの上端 */
  --orwa-c-news-table:       #333333;  /* お知らせの表：線と文字 */
  --orwa-c-news-table-head:  #eef1f5;  /* お知らせの表：見出しセル（is-gray も同じ） */
  --orwa-c-news-table-beige: #f4efe6;  /* 旧サイトから移した表 is-beige の見出しセル */
  --orwa-c-news-table-blue:  #ebf3f9;  /* 旧サイトから移した表 is-blue の見出しセル */
  --orwa-c-news-table-navy:  #1b4965;  /* is-blue の見出しの文字 */
  --orwa-c-news-table-line:  #b8c4ce;  /* is-blue の線 */

  --orwa-ff-sans:  "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", sans-serif;
  --orwa-ff-serif: "Noto Serif JP", "Hiragino Mincho ProN", serif;
  --orwa-ff-en:    "Inter", "Noto Sans JP", sans-serif;

  --orwa-fw-regular: 400;
  --orwa-fw-medium:  500;

  --orwa-w-site:    75rem;    /* 1200px：TOP のお知らせ・フッターの中身 */
  --orwa-w-page:    68.75rem; /* 1100px：固定ページの本文 */
  --orwa-w-article: 62.5rem;  /* 1000px：記事・詳細の白い箱 */
  --orwa-header-h:  5rem;     /* 80px（SP は 58px） */
}