/* ==========================================================================
   南城市観光サイト（旅ポータル）― デザイントークン v1
   確定日：2026-07-02
   正本：南城デジタル基盤_デザイン方向書 v5（統合案）＋ 書体定着 v2（ふだんとハレ）
   ──────────────────────────────────────────────
   家訓（3サイト共通）：明るさが基準／細い線で凛と／動きはフェードのみ／
   写真が主役・色は脇役／確認日と出典を小さく必ず／個人名は公開物に入れない
   ========================================================================== */
:root{

  /* --- 色：白砂の地（基準。淡色の「面」はこの地だけ） --- */
  --suna:#FBF9F3;
  --suna-2:#F4F1E8;          /* わずかな段差用。多用しない */

  /* --- 色：墨緑のインク（文字と骨格。黒ではなく海の底の色） --- */
  --ink:#15211F;
  --ink-soft:#4C5A56;
  --ink-faint:#939C96;

  /* --- 色：南城の海（鮮やかな一色。ベタの色面で使う唯一の色） --- */
  --umi:#00A7B5;
  --umi-koi:#008291;          /* hover・押下・本文リンク */

  /* --- 色：朝の光（らしいねの黄レール継承。レール・バッジ・紋の一点のみ） --- */
  --hikari:#F2B33D;

  /* --- 色：ハートの桃（「ハート型をした、ハートフルな街。」の一点専用） --- */
  --sango:#F0708C;            /* ★アイデンティティの一箇所以外で使用禁止 */

  /* --- 線：細く凛と --- */
  --sen:rgba(21,33,31,.14);
  --sen-faint:rgba(21,33,31,.07);

  /* --- 書体：ふだんとハレの二段構え --- */
  --font-body:"Noto Sans JP",sans-serif;            /* 本文・UI（400/500） */
  --font-head:"Noto Sans JP",sans-serif;            /* ふだんの見出し（700・字間.1〜.14em） */
  --font-hare:"Shippori Antique B1",sans-serif;     /* ハレの見出し（特集・journal・四季のみ） */
  --font-latin:"Space Grotesk",sans-serif;          /* 欧文・数字（時代の錨） */

  /* --- ふだんの見出しの標準字間 --- */
  --ls-head:.12em;

  /* --- 版面 --- */
  --maxw:1180px;
  --pad-x:clamp(16px,3.5vw,44px);
  --lh-body:1.9;
  --radius:4px;               /* 角丸は小さく。ピル型は使わない */
}

/* ==========================================================================
   声の掟（実装ルール。クラスで統制し、例外は作らない）
   ========================================================================== */

/* ふだんの見出し：全ページ標準（タグライン・章・スポット名・料金・アクセス） */
.h-ke{font-family:var(--font-head);font-weight:700;letter-spacing:var(--ls-head);line-height:1.6}

/* ハレの見出し：特集の扉・journal記事見出し・「南城の四季」・季節のことば 限定
   掟：24px以上／字間0〜.06em／隣に必ず --font-latin の数字かラベル／
       丸UI・かわいいイラストと組まない／色は --ink か 色面上の白抜きのみ／
       お知らせ・臨時情報・ステータス帯には絶対に使わない（信頼の声色はふだんの声） */
.h-hare{font-family:var(--font-hare);font-weight:400;letter-spacing:.03em;line-height:1.65;font-size:max(24px,1em)}

/* 欧文・数字：時刻・料金・座標・小ラベル。数字は桁が揺れない */
.t-latin{font-family:var(--font-latin);font-variant-numeric:tabular-nums;letter-spacing:.04em}

/* 確認日・出典（家族の約束）：小さく静かに、しかし必ず */
.t-checked{font-family:var(--font-latin);font-size:10px;letter-spacing:.06em;color:var(--ink-faint)}

/* ==========================================================================
   基盤（リセット・動き）
   ========================================================================== */
*{box-sizing:border-box}
body{
  margin:0;background:var(--suna);color:var(--ink);
  font-family:var(--font-body);line-height:var(--lh-body);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img,svg{display:block;max-width:100%}
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--pad-x);padding-right:var(--pad-x)}

/* フォーカス可視（a11y・最初から） */
a:focus-visible,button:focus-visible{outline:2px solid var(--umi-koi);outline-offset:3px}

/* 動きはフェードのみ。reduced-motion 尊重（家訓） */
.fade{opacity:0;transform:translateY(8px);animation:fadein 1.2s cubic-bezier(.2,.6,.2,1) forwards}
.fade.d1{animation-delay:.12s}.fade.d2{animation-delay:.3s}.fade.d3{animation-delay:.5s}
@keyframes fadein{to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.fade{opacity:1;transform:none;animation:none}}

/* ==========================================================================
   ★布（NUNO）スロット ― このサイトのオリジナルの一枚（未定・最優先クリエイティブ）
   斎場御嶽の「王の紅型」にあたる、発注者制作のオリジナルグラフィックの席。
   候補の種：玉城城跡の円い城門と朝日／「あがり」の太陽／ニライカナイの水平線／サングヮー。
   決定後：--nuno-url と関連トークンをここに追記し、v1.1とする。
   決定前：布に依存する装飾は実装しない（借り物で埋めない）。
   ========================================================================== */
/* :root{ --nuno-url:url("/assets/vn/brand/nuno.svg"); } */

/* ==========================================================================
   ［参考・仮置き］DMOなんじょうサイトのトークン草案
   ― 実物モック制作時に最終確認のうえ、別ファイル（dmo/tokens.css）として確定
   地：--shiro:#FCFCF9 ／ 主：--sora:#2E86AB（晴れた海と空の間・暗くしない）
   深：--sora-koi:#1E6787 ／ グラフ第2色：--wakaba:#6FA867
   グラフ限定パレット4色：sora / wakaba / hikari / sango系 — 増やさない
   書体：ふだんの声のみ（ハレは使わない基本線）。結（ゆい）の紋は案のまま保留。
   ========================================================================== */
