/* =====================================================
   kuganikutuba — CSS変数・ベーススタイル
   テーマ変更は :root 変数だけ書き換えてください
   ===================================================== */

:root {
  /* ── ブランドカラー ── */
  --clr-accent:        #1B9EC9;
  --clr-accent-rgb:    27, 158, 201;
  --clr-accent-lit:    #4DC4E8;
  --clr-accent-dark:   #0D6E8E;

  /* ── ヒーロー背景グラデーション ── */
  --clr-hero-bg-1:     #000d14;
  --clr-hero-bg-2:     #001820;
  --clr-hero-bg-3:     #00202e;

  /* ── 薄いブランド背景 ── */
  --clr-surface-tint:  #f0f9fc;
  --clr-surface-tint2: #d9f0f8;

  /* ── 背景・サーフェス ── */
  --clr-bg:            #030d14;
  --clr-surface:       #0d1f2d;
  --clr-surface2:      #152535;

  /* ── テキスト ── */
  --clr-text:         #ffffff;
  --clr-text-muted:   rgba(255, 255, 255, 0.55);
  --clr-text-subtle:  #6b7280;

  /* ── ボーダー ── */
  --clr-border:       rgba(255, 255, 255, 0.10);

  /* ── フォント ── */
  --font-sans:        'Noto Sans JP', sans-serif;
  --font-serif:       'Noto Serif JP', serif;

  /* ── LINE ── */
  --clr-line:         #06C755;
}

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font-sans);
  background: var(--clr-bg);
  color: var(--clr-text);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  display: block;
  max-width: 100%;
}