/*
Theme Name: Lightning Child - Hiroshima Y's Men's Club
Template: lightning
Description: 広島ワイズメンズクラブ公式サイト用 Lightning子テーマ
Version: 1.0
Text Domain: ys-hiroshima-child
*/

/* =====================================================
   カラー変数（配色方針：青系ベース＋温かみのあるアクセント）
   ===================================================== */
:root {
	--ys-blue-primary: #1e5aa8;   /* メインの青（ヘッダー・見出し・ボタン） */
	--ys-blue-dark: #123a6e;      /* 濃い青（ホバー・footer） */
	--ys-accent-warm: #e8965a;    /* 温かみのあるアクセント（CTA・強調） */
	--ys-text-main: #2b2b2b;      /* 本文文字色 */
	--ys-text-sub: #6b6b6b;       /* 補足文字色 */
	--ys-bg-light: #f7f9fc;       /* セクション背景（淡い青灰） */
	--ys-white: #ffffff;
}

/* =====================================================
   フォント（Noto Sans JP。Google Fonts APIはfunctions.phpでenqueue）
   ===================================================== */
body,
.site-header,
.site-footer {
	font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
	color: var(--ys-text-main);
}

/* =====================================================
   ヘッダー
   ===================================================== */
.site-header {
	background-color: var(--ys-white);
	border-bottom: 3px solid var(--ys-blue-primary);
}

.site-title a {
	color: var(--ys-blue-primary);
	font-weight: 700;
}

/* =====================================================
   見出し
   ===================================================== */
h1, h2, h3 {
	color: var(--ys-blue-primary);
	font-weight: 700;
}

/* =====================================================
   ボタン・CTA（アクセントカラーは目立たせすぎない・1箇所に絞る運用を想定）
   ===================================================== */
.btn,
.wp-block-button__link {
	background-color: var(--ys-blue-primary);
	border-radius: 4px;
	transition: background-color 0.2s ease;
}

.btn:hover,
.wp-block-button__link:hover {
	background-color: var(--ys-blue-dark);
}

.btn-accent {
	background-color: var(--ys-accent-warm);
}

/* =====================================================
   お知らせ・カード類
   ===================================================== */
.card,
.vk_post-col {
	background-color: var(--ys-bg-light);
	border-radius: 6px;
}

/* =====================================================
   フッター
   ===================================================== */
.site-footer {
	background-color: var(--ys-blue-dark);
	color: var(--ys-white);
}

.site-footer a {
	color: var(--ys-white);
}

/* =====================================================
   スマホ表示調整（375px幅を基準に確認すること）
   ===================================================== */
@media (max-width: 480px) {
	h1 {
		font-size: 1.6rem;
	}
	h2 {
		font-size: 1.3rem;
	}
}