@charset "utf-8";
/* ============================================================
   ROSE — 暖かいピンク（色相345°）を基調にした明るい配色。
   差し色は1色だけ持ち、面用・文字用・塗り用の3段に分けて
   文字に使う値は必ず 4.5:1 以上を満たす。
   ============================================================ */

:root{
  /* 差し色：色相345°を維持したまま用途で3段に割る */
  --accent:      #F07694;   /* 面・罫・アイコン専用。白地 2.72:1 なので文字には使わない */
  --accent-ink:  #CF1745;   /* 文字用。白5.44 / 淡ピンク面4.94 / 水色面4.57 */
  --accent-fill: #E1194B;   /* 塗りCTA。白文字 4.73:1 */
  --accent-bg:   #FDF1F4;   /* 淡ピンク面 */
  --alert-bg:    #FFF6F6;   /* 罰金の注意書きの地 */
  --support:     #DCEEF9;   /* 補助の水色面 */

  --bg-sub:      #FCF9FA;
  --rule:        #EFE2E6;
  --rule-strong: #D9C3CA;

  /* この系統は明朝を使わない。見出しも本文もゴシックで通す */
  --serif:"Noto Sans JP","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;

  --r-sm:4px;               /* 角丸は付ける。ただしピル(9999px)にはしない */
  --sec:64px; --sec-lg:80px;
}
@media (min-width:960px){ :root{ --sec:96px; --sec-lg:120px; } }
/* 見出しはゴシック太。明朝前提の字間・行間を戻す */
:where(h1,h2,.lead,.serif){ font-weight:700; letter-spacing:.02em; }
h1{ letter-spacing:.01em; line-height:1.4; }
h2{ letter-spacing:.01em; line-height:1.45; }
.lead{ font-weight:400; letter-spacing:.02em; }
.card-name{ font-weight:700; letter-spacing:.01em; }
.logo{ font-weight:700; letter-spacing:.01em; }
.logo .lt{ color:var(--accent-ink); }
/* セクション見出しにピンクの短い罫を添える */
.h-block .kicker{ color:var(--accent-ink); }
.h-block h2{ position:relative; padding-left:14px; }
.h-block h2::before{
  content:""; position:absolute; left:0; top:.24em; bottom:.24em; width:4px;
  background:var(--accent); border-radius:2px;
}
.wrap-read .h-block h2::before{ content:none; }
.wrap-read .h-block h2{ padding-left:0; }
/* FV：暗幕を浅くして明るい印象に寄せる */
.fv-veil{
  /* 明るい写真に白文字を乗せるので、見出しが載る下半分だけ暗幕を強くする。
     上は明るいまま＝この系統の「明るさ」を殺さない。実測で 4.5:1 以上。 */
  background:linear-gradient(to bottom,
    hsl(345 20% 10% / .30) 0%, hsl(345 20% 10% / .06) 22%,
    hsl(345 20% 10% / .52) 54%, hsl(345 25% 8% / .88) 100%);
}
.fv-eyebrow{ color:#FFD9E2; }
/* 検索カードは水色面に乗せる */
.searchcard{ background-color:var(--support); border-color:transparent; border-radius:var(--r-sm); }
.searchcard h2{ color:var(--ink); }
.searchcard select{ background-color:#fff; border-color:var(--rule-strong); }
.searchcard .sc-field label{ color:#3A3A3A; }
/* 数字パネル：ピンク枠＋淡ピンク面 */
.numpanel{ border-color:var(--accent); border-radius:var(--r-sm); overflow:hidden; }
.numpanel > div{ border-color:var(--accent); }
.numpanel .full{ background:var(--accent-bg); }
.numpanel .full dd{ color:var(--accent-ink); }
.stats{ border-color:var(--accent); border-radius:var(--r-sm); overflow:hidden; }
.stats div{ border-color:var(--accent); }
.stats dd{ color:var(--accent-ink); }
/* バッジ・タグ */
.badge{ background:var(--accent-fill); }
.tile-t{ flex-wrap:nowrap; }
.tile-t b{ letter-spacing:.02em; }
.tag{ border-color:var(--accent); color:var(--accent-ink); border-radius:var(--r-sm); }
.tag-more{ border-color:var(--rule-strong); color:var(--ink-mute); }
/* 塗りも線もピンク。緑は枠とマークだけ（緑地に白文字は 2.26:1 で不合格） */
.btn{ border-radius:var(--r-sm); }
.btn-ghost{ border-radius:var(--r-sm); font-weight:700; }
.chip{ border-radius:var(--r-sm); }
.chip[data-on="1"]{ border-color:var(--accent); background:var(--accent-bg); color:var(--accent-ink); }
/* タイル・写真も角丸を揃える */
.tile img,.card-img,.gal img{ border-radius:var(--r-sm); }
.tiles{ background:transparent; border:0; gap:8px; }
/* 業種リンクの見出し色 */
.typegroup h3{ color:var(--accent-ink); }
.qa h3::before{ color:var(--accent-ink); }
.feat .n,.route .n{ color:var(--accent-ink); }
.ft h3{ color:var(--accent-ink); }
.demobar{ background:var(--accent-bg); color:var(--accent-ink); }