@charset "UTF-8";
/*
 * clover-llmo / assets/header-title.css — ヘッダーのロゴの上の一行（.header_h1）
 *
 * ■ なぜ要るか（2026-10-21 社長指摘・テスト環境で実測）
 *   テーマは固定ページの一行目を「題名｜大分ヘルパーステーション訪問介護のみかた｜株式会社クローバー」で出す
 *   （header.php の is_page() 分岐）。左の箱 .header_L は幅 50%（style.css:3784 が :224 の 55% を上書き）
 *   ＝ inner の最大 1200px（:3781）から左右の余白 3em を引いた 1104px の半分で 552px 固定なので、
 *   題名が長い /recruit/toroku-helper/ と /recruit/seishain/ だけ「訪問｜介護」の語の途中で 2 行に折れ、
 *   ヘッダーの高さも他のページより 24px 高くなっていた（149px 対 125px）。
 *
 * ■ 何をするか
 *   1. PC（641px 以上）では折らずに 1 行で出す。箱の幅は文字の長さに合わせる（width:max-content）。
 *      一行目の高さには右のメニューの文字も「無料採用エントリー」ボタンも無いので重ならない。
 *      上限 900px は、さらに長い題名が来てもボタン（左端は一行目の左端から約 964px）に届かないための安全弁。
 *      超えた分だけ … で切る。2026-10-21 時点の最長は 766px（toroku-helper）で、切れるページは 0。
 *      🔴 964px はテーマの 3 つの値に依存する: inner 1200px（style.css:3781）・余白 3em（:209）・
 *         ボタン画像 140px（:375）。保守会社がこれを動かしたら測り直す（3780 行は保守会社への依頼書きの塊）。
 *   2. スクロールして縮んだヘッダー（header.active）では一行目を見た目だけ隠す。
 *      縮んだ状態ではメニューの文字が上がり、長い題名の行がメニューの文字にほぼ触れるため（社長が案B を選択）。
 *      display:none にしないのは、トップの一行目は本物の <h1>（header.php:137）で、読み上げからは消さないため
 *      （2026-10-21 独立レビュー F4）。position:absolute で流れから外れるので、ロゴが上がる動きは display:none と同じ。
 *   スマホ（640px 以下）はテーマが一行目をトップ以外で隠しているので、ここでは何もしない。
 *
 * ■ 射程
 *   テーマのヘッダーを使う全ページ。テスト環境の 24 ページで測った結果、ふだんの状態で変わるのは
 *   上の 2 ページだけ（他は行数・高さ・右端とも同じ）。スクロール後に隠れるのは全ページ。
 *   🔴 width:max-content を外すと、箱は 552px のまま overflow:hidden で切られて「…訪…」になる
 *   （2026-10-21 に一度この形で書き、画像で見て気づいた）。
 *
 * ■ ロールバック
 *   このファイルを消す（または includes/header-title-style.php を消す）と、テーマの見た目に戻る。
 */

@media screen and (min-width: 641px) {
	.header_h1 {
		white-space: nowrap;
		width: max-content;
		max-width: 900px;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	header.active .header_h1 {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: 0;
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
	}
}