@charset "UTF-8";
/* niau group 統合プラットフォーム｜tokens
   出所：シュルール所沢プロぺ通り店ページ（chorule-hair.com/salon/tokorozawa/）の Playwright 実測。
   2026-08-16 岩田さん指示「シュルール所沢のサイトデザインを踏襲」により、
   生成り×キャラメルの初版を破棄し、現行サイトの白基調×ブランドピンクへ全面差し替え。 */

:root{
  /* ---------- ベース（実測：白基調＋青みの淡グレー帯） ---------- */
  --paper:      #FFFFFF;
  --paper-2:    #EFF3F4;   /* 実測 rgb(239,243,244)：セクション帯・ページ見出し帯 */
  --paper-3:    #E3E9EA;   /* 表の縞・境界 */
  --ink-bg:     #362A33;   /* 暗背景（インク色をそのまま面に使う現行の作法） */
  --ink-bg-2:   #4A3A46;

  /* ---------- テキスト（実測 rgb(54,42,51)） ---------- */
  --ink:        #362A33;
  --ink-2:      #6B5C64;
  --ink-3:      #6B5E66;
  --ink-paper:  #FFFFFF;
  --ink-paper-2:#D9CFD4;

  /* ---------- ブランドアクセント（実測：HOTPEPPER予約ボタン rgb(233,80,152)） ----------
     ブランドピンクは白文字比 3.46 でAA未達のため、
     面と大きな数字だけに使い、ボタン・小さい文字は -d / -dd を使う。 */
  --pink:       #E95098;   /* ブランドピンク：白文字比 3.46 → 面・大数字のみ */
  --pink-d:     #C82F76;   /* 白文字比 5.09 ／ 帯上 4.56 ✅ ボタン・小さい文字 */
  --pink-dd:    #B02566;   /* 白文字比 6.36 ✅ hover */
  --pink-soft:  rgba(233,80,152,.08);

  /* ---------- 系統の識別（現行が単一アクセントのため、色でなく“ラベル”で分ける） ---------- */
  --salon:      var(--pink);
  --studio:     #6E8C86;   /* 写真館だけは僅かに寄せる（帯の青みと同系） */
  --studio-d:   #4E6A64;   /* 白文字比 5.4 */
  --recruit:    #362A33;   /* 採用は墨。ピンクと競合させない */

  /* ---------- 罫線・影（現行は影をほぼ使わず、細い罫線で仕切る） ---------- */
  --line:       #DDE3E4;
  --line-soft:  #ECF0F1;
  --line-dark:  rgba(255,255,255,.20);
  --shadow:     0 10px 30px rgba(54,42,51,.07);
  --shadow-sm:  0 2px 10px rgba(54,42,51,.05);

  /* ---------- 書体（実測：欧文 Baskervville／和文 Noto Serif JP／本文ゴシック） ---------- */
  --ff-ja:      "Noto Sans JP","Yu Gothic","游ゴシック","Hiragino Kaku Gothic ProN",sans-serif;
  --ff-ja-disp: "Noto Serif JP","游明朝体","Yu Mincho","Hiragino Mincho ProN",serif;
  --ff-en:      "Baskervville","Times New Roman",serif;

  /* ---------- スケール（実測：セクション見出し Baskervville 60px 中央／ヒーロー 80px） ---------- */
  --fs-display:  clamp(26px, 4.4vw, 44px);   /* 和文ヒーロー */
  --fs-en-disp:  clamp(38px, 6.2vw, 80px);   /* 欧文ヒーロー */
  --fs-en-sec:   clamp(34px, 5vw, 60px);     /* セクション見出し（実測60px） */
  --fs-headline: clamp(18px, 2vw, 22px);     /* 見出しに添える和文（小さい） */
  --fs-body:     clamp(14px, 1.3vw, 15px);
  --fs-sm:       13.5px;
  --fs-label:    12px;

  --side-pad:   clamp(20px, 5vw, 60px);
  --section-py: clamp(64px, 8vw, 116px);
  --maxw:       1200px;
  --text-max:   36em;

  --ease:     cubic-bezier(.16,1,.3,1);
  --ease-io:  cubic-bezier(.4,0,.2,1);
}

/* ==========================================================================
   STUDIO（写真スタジオ）専用トークン
   岩田さん指示 2026-08-16「スタジオは美容室サイトとは違う」
   美容室＝艶・上質・ブランドピンク／スタジオ＝子どもと家族・明るさ・余白・柔らかさ。
   ブランドピンクは使わない。
   ========================================================================== */
.studio{
  --paper:      #FFFDFA;   /* わずかに温かい白 */
  --paper-2:    #F5F1EA;   /* 生成りの帯 */
  --paper-3:    #E9E2D6;
  --ink:        #3B352F;   /* 黒でなく温かい墨 */
  --ink-2:      #6E655B;
  --ink-3:      #6A6158;
  --line:       #E3DCD1;
  --line-soft:  #F0EBE2;
  --pink:       #7F9A83;   /* 系統色を若草へ置換（面・大数字用） */
  --pink-d:     #4E6A55;   /* 白文字比 5.6 */
  --pink-dd:    #3C5443;
  --pink-soft:  rgba(127,154,131,.10);
  --accent-warm:#C98A5E;   /* 差し色（キャンペーン等） */
}