@charset "utf-8";

/* トクニゴ外食（/tokunigo/restaurant/）専用。style.css の後に読み込む。
   分野色はワインレッド #8E1B3A（アプリの ic_launcher_background と hub.css の --soon-color と同じ値）。
   配信中ページ。右カラムにはヘッダー画像（.hero-graphic）を置く。 */

.hero--restaurant {
	color: var(--ink);
	background: linear-gradient(180deg, #fbf5f6 0%, #ecd0d8 100%);
}
.hero--restaurant::before {
	opacity: .5;
	background-image: linear-gradient(rgba(18,33,43,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(18,33,43,.05) 1px, transparent 1px);
}
.hero--restaurant::after {
	border-color: #8E1B3A;
	opacity: .5;
}
.hero--restaurant .badge { border-color: rgba(142,27,58,.55); color: #8E1B3A; }
.hero--restaurant .tagline em { color: #8E1B3A; }
.hero--restaurant h1 span { color: var(--teal-dark); }
.hero--restaurant .desc { color: var(--muted); }
.hero--restaurant .cta-note { color: var(--muted); }
.hero--restaurant .app-icon { box-shadow: 0 10px 28px rgba(24,36,38,.22); }

/* ヒーロー右カラム：ヘッダー画像 */
.hero--restaurant .hero-graphic { box-shadow: 18px 18px 0 #8E1B3A; }
.hero--restaurant .hero-graphic img { border-color: rgba(18,33,43,.12); }

/* 出題範囲：4分野の2×2カード */
.cat-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin-bottom: 22px; }
.cat-card { padding: 24px 26px; background: #fffdf8; border: 1px solid rgba(24,36,38,.12); border-top: 5px solid #8E1B3A; }
.cat-card h3 { margin: 0 0 4px; font-size: 18px; }
.cat-card .cat-count { margin: 0 0 14px; color: #8E1B3A; font-size: 13px; font-weight: 800; letter-spacing: .03em; }
.cat-card ul { margin: 0; padding: 0; list-style: none; color: var(--muted); font-size: 14px; display: grid; gap: 6px; }
.cat-card li { position: relative; padding-left: 16px; }
.cat-card li::before { position: absolute; left: 0; content: "・"; color: #8E1B3A; }
.cat-note { margin: 0; color: var(--muted); font-size: 13.5px; }

@media (max-width: 800px) {
	.cat-grid { grid-template-columns: 1fr; }
}