/*
 * brushup.css — サイト全体イメージのブラッシュアップ（加算レイヤー）
 * 方針: レイアウト・文言・構成は一切変えない。色の階調を上質に整え、
 *       ホバー/フォーカス/見出し律動など細部の品質を底上げするだけ。
 * 読み込み: フロントページ（functions.php）＋各カスタムページテンプレの
 *          既存CSSより後。このファイルを読み込むページにのみ効く。
 */

/* ===== 1. パレットの微調整（トークン再定義・後読みで上書き） =====
 * 明るい標準ブルー(#0055cc/#3388ee)を、少し深く落ち着いた上質な階調へ。
 * 共有トークン(--ths-/--accent)と ONE STOP の明るい青(--os-blue)を同じ新階調に統一。
 * ONE STOP のネイビー/シアン(--os-navy/--os-cyan 等)は独自性維持のため触らない。 */
:root {
	--accent: #0847a6;
	--accent-light: #2c7ee4;
	--accent-glow: rgba(44, 126, 228, 0.24);

	--ths-accent: #0847a6;
	--ths-accent-light: #2c7ee4;
	--ths-accent-glow: rgba(44, 126, 228, 0.24);

	--os-blue: #0847a6;
	--os-blue-light: #2c7ee4;
}

/* ===== 2. 直書きブルーの整合（変数化されていない主要グラデを新階調に） ===== */
/* ABOUT見出しのグラデ文字（製造業／生産管理システム／開発、提供）※フロント */
.ths-section--intro .ths-intro-headline .ths-intro-strong {
	background: linear-gradient(135deg, #1a62da 0%, #0847a6 48%, #06256a 100%);
	-webkit-background-clip: text;
	background-clip: text;
}
/* ABOUT見出しのハイライト下線 ※フロント */
.ths-section--intro .ths-intro-headline .ths-intro-mark {
	background: linear-gradient(transparent 62%, rgba(44, 126, 228, 0.30) 62%, rgba(8, 71, 166, 0.30) 100%);
}

/* ===== 3. カードの手触り（ホバーでわずかに浮かせ、影と枠を上質に） ===== */
.ths-keyword-card {
	transition: border-color 0.5s cubic-bezier(0.22, 1, 0.36, 1),
		transform 0.5s cubic-bezier(0.22, 1, 0.36, 1),
		background 0.5s, box-shadow 0.5s;
}
.ths-keyword-card:hover {
	transform: translateY(-4px);
	border-color: var(--ths-accent-light);
	box-shadow:
		0 1px 2px rgba(6, 24, 60, 0.20),
		0 18px 40px -18px rgba(10, 79, 181, 0.55);
}
.ths-consult-card:hover .ths-consult-icon {
	transform: translateY(-6px);
	box-shadow:
		0 2px 6px rgba(0, 30, 80, 0.16),
		0 22px 48px -16px rgba(10, 79, 181, 0.50);
}

/* ===== 4. 品質床：キーボードフォーカスの可視化 =====
 * マウス操作時は出ず、キーボード操作時だけリングが出る（a11y向上・見た目は不変）。 */
a:focus-visible,
button:focus-visible {
	outline: 2px solid var(--ths-accent-light, #2c7ee4);
	outline-offset: 3px;
	border-radius: 4px;
}

/* ===== 5. タイポの律動（見出しを少しだけ広やかに・上質に） ===== */
.ths-headline,
.ths-cta-headline {
	letter-spacing: 0.03em;
	line-height: 1.46;
}

/* ===== 6. シグネチャ：設計図ヘアライン =====
 * ABOUTだけが持っていた両脇ヘアラインを共通アイブロウ(.ths-eyebrow)へ展開し、
 * 「製造業×システム＝設計図」を想起させる統一の符牒にする。 */
.ths-eyebrow {
	letter-spacing: 0.22em;
}
.ths-eyebrow::before,
.ths-eyebrow::after {
	content: "";
	display: inline-block;
	width: 26px;
	height: 1px;
	background: currentColor;
	opacity: 0.4;
	flex: 0 0 auto;
}
