/* Lumière color tokens — from Figma variables + style guide frame「スタイルガイド」 */
:root {
  /* Brand palette (named per style guide) */
  --will-navy: rgb(16, 24, 65);           /* ウィル・ネイビー — primary text, headings */
  --guiding-blue: rgb(20, 77, 160);       /* ガイディング・ブルー — primary brand blue, section bg, button gradient */
  --open-sky-blue: rgb(233, 244, 251);    /* オープンスカイ・ブルー — light section bg, gradient end */
  --insight-mist: rgb(143, 162, 170);     /* インサイト・ミスト — dividers, muted */
  --lumiere-yellow: rgb(249, 208, 38);    /* ルミエール・イエロー — accent line, highlights */
  --first-light-yellow: rgb(255, 242, 178); /* ファーストライト・イエロー — soft accent */
  --white: rgb(255, 255, 255);            /* ホワイト */

  /* Observed supporting values */
  --off-white-text: rgb(247, 246, 244);   /* hero copy on gradient */
  --border-warm: rgb(226, 224, 220);      /* card hairline border */
  --placeholder-gray: rgb(217, 217, 217); /* image placeholder fill */

  /* Semantic aliases */
  --text-heading: var(--will-navy);
  --text-body: var(--will-navy);
  --text-on-dark: var(--white);
  --text-on-gradient: var(--off-white-text);
  --surface-page: var(--white);
  --surface-section-light: var(--open-sky-blue);
  --surface-section-brand: var(--guiding-blue);
  --surface-card: var(--white);
  --divider: var(--insight-mist);
  --accent: var(--lumiere-yellow);

  /* Brand gradient (button) */
  --gradient-button: linear-gradient(73.877deg, rgb(20, 77, 160) 61.73%, rgb(233, 244, 251) 127.94%); /* @kind other */
}