/*
Theme Name: 中谷電気工事 Child
Template: twentytwentyfive
Version: 1.6
Description: Twenty Twenty-Five の子テーマ。Jimdo版サイトに合わせたヘッダー(ヒーロー画像+丸みナビ)を追加。
*/

/* リンク・ボタンをクリック(タップ)した際に表示される黒/白い四角(既定のフォーカス枠・タップハイライト)を、
   サイト全体で非表示にする。キーボード操作(Tabキー)でのフォーカス表示は :focus-visible で維持する */
* {
	-webkit-tap-highlight-color: transparent;
}
a:focus:not(:focus-visible),
a:active,
button:focus:not(:focus-visible),
button:active,
summary:focus:not(:focus-visible),
summary:active {
	outline: none !important;
	box-shadow: none !important;
}

/* ページ最上部、ヒーロー画像の上にできる薄い隙間を消す(お知らせ・業務内容・採用情報ページなど、
   ヒーローがテンプレートの先頭ブロックになっているページで発生していた) */
html, body {
	margin: 0 !important;
	padding: 0 !important;
}
.wp-site-blocks {
	padding-top: 0 !important;
	margin-top: 0 !important;
}
/* 本当の原因: wp:htmlブロック内の<style>タグがDOM上で実際の兄弟要素になり、
   WordPressのブロック間余白(block gap)の仕組み(直前に兄弟要素がある要素にmargin-topを付与)が
   目に見えない<style>タグを「直前の要素」とみなして、ヒーローdivに余白を足してしまっていた */
.wp-site-blocks > style + .alignfull {
	margin-top: 0 !important;
	margin-block-start: 0 !important;
}

/* 【2026/08/27】お知らせ一覧(archive.html)・採用情報ページで、ページ最上部の
   ヒーロー画像の上にも同じ種類の薄い隙間が残っていた。原因は上と全く同じ仕組みだが、
   これらのページではヒーローdivの直前の兄弟要素が<style>ではなく<script>タグ
   (ヒーロー内のロゴ演出・見出しアニメーション用)だったため、上のstyle+.alignfullの
   ルールに一致せず、隙間が解消されていなかった。script直後のパターンも同様に潰す */
.wp-site-blocks > script + .alignfull {
	margin-top: 0 !important;
	margin-block-start: 0 !important;
}

/* ヒーローの「下」、業務内容・お知らせ欄などの帯セクションが始まる手前にできる薄い隙間を消す。
   原因は上と同じ仕組み: wp:htmlブロックの末尾にある<script>タグも見えない兄弟要素としてカウントされ、
   そのすぐ後に続く<main>(mainタグ自体は各テンプレートのインラインstyleでmargin-top:0を指定済みだが、
   このブロック間余白はグローバルスタイル側で!important付きで出力されているらしく、
   インラインstyle(!important無し)では上書きしきれていなかった)にブロック間余白ぶんのmargin-topが
   乗ってしまい、position:fixedの背景画像(nakaden-bg-glow.svg)がその隙間から帯状に見えてしまっていた */
.wp-site-blocks > main.wp-block-group {
	margin-top: 0 !important;
	margin-block-start: 0 !important;
}

/* 【2026/08/26 訂正】以前ここにあった #work-content 専用の force-fix
   (margin-top:-150px !important + padding-top:172px !important で
   ヒーロー側へめり込ませる力技)は撤去した。
   理由: id セレクタ(#work-content)は下の nth-child(2) ルールより詳細度が高いため、
   下のルールが margin-top:0 に直しても、この -150px が上書きしてしまい、
   本来もう不要になったはずの「めり込ませ+パディングで相殺」が生き残っていた。
   相殺しきれない数px〜数十px分が「少しの余白」として業務内容ページにだけ残っていた。
   下の nth-child(2) ルール(!important)はWordPressが margin-block-start に
   出すブロック間余白(非!important)より優先されるので、これだけで隙間は消えるはず。
   保険として、page-業務内容.html 側でも #work-content の margin-top を 0 に戻し、
   <main>のブロック間余白そのものを blockGap:0 で発生させないよう設定済み */

/* 【新しく判明した本当の原因】これまでの対策はすべて margin-top だけを
   !important で上書きしていたが、WordPressのブロック間余白(block gap)は
   実際には論理プロパティの margin-block-start で出力されている。
   物理プロパティ(margin-top)と論理プロパティ(margin-block-start)は
   別物として扱われるため、margin-topだけ0にしてもmargin-block-start側の
   余白が生きたままになり、何度margin-topを潰しても隙間が消えなかった。
   全テンプレート共通で、<main>の1番目の子(position:fixedの背景画像div、
   nakaden-bg-glow.svg。画面には見えないが実DOM上のブロックとして存在する)の
   直後に続く2番目の子(実際に表示される帯セクション)に、この隙間が生まれる。
   margin-top・margin-block-startの両方を0にすることで、全ページ共通で解消する */
main.wp-block-group > *:nth-child(2) {
	margin-top: 0 !important;
	margin-block-start: 0 !important;
}

/* 【2026/08/26】ホーム画面下部(ご挨拶〜許可関係の紫グラデーション帯とフッターの間)にも、
   ページ最上部やヒーロー直下で見つかったのと全く同じ「wp:htmlブロック内の見えない
   <style>/<a>/<script>タグがDOM上の兄弟要素としてカウントされ、その直後に続く要素へ
   ブロック間余白(margin-top)が乗ってしまう」パターンで隙間が発生していた。
   parts/footer.htmlは <style> → <a> → <script> → <footer> という並びのwp:htmlブロックで、
   このうち最後の<footer>タグ自体が.wp-site-blocksの直接の子になり、直前に見えない兄弟
   (style/a/script)がある扱いになるため、自動生成CSSでmargin-top(block-gap)が付与されて
   しまい、その透明な隙間から固定背景(nakaden-bg-glow.svg)が帯状に透けて見えていた。
   footerは全ページ共通のテンプレートパーツなので、ここで直せば他ページ(archive.html、
   page-業務内容.html、page-採用情報.html等)の同じ症状も一緒に解消される */
.wp-site-blocks footer {
	margin-top: 0 !important;
	margin-block-start: 0 !important;
}
