/*
Theme Name: Harashina Standard
Description: 有限会社原科の会社標準オリジナルテーマ。Snow Monkeyからの移行用に開発中。表示・レイアウト・デザインのみを担当し、会社固有の業務ロジックは持たない方針。トップページのHero〜CTAに続き、Footer（会社情報＋Google Map／ナビゲーション／法務リンク＋Copyright）を正式実装。
Version: 0.7.0
Text Domain: harashina-standard
Requires PHP: 7.4
*/

/*
 * ------------------------------------------------------------
 * header（骨組み実装。色・フォントサイズ・余白・アニメーション等は
 * 今後調整する前提の暫定スタイル。現行Snow Monkeyの見た目の再現は目的としない）
 * ------------------------------------------------------------
 */

.site-header {
	background-color: #fff;
	border-bottom: 1px solid #eee;
}

/*
 * ------------------------------------------------------------
 * header: scroll direction behavior（デザイン非変更、位置・表示制御のみ）
 *
 * 常時 position: sticky で画面上部に保持し、assets/js/header-scroll.js が
 * スクロール方向に応じて .is-header-hidden を付け外しする。CSS側は
 * transform: translateY(-100%) で隠すだけで、色・高さ・余白・ナビの
 * デザインには一切触れていない。
 *
 * z-indexは.mobile-drawer(1000)/.drawer-overlay(999)より低い値にし、
 * drawer展開中にHeaderがそれらの上に被らないようにしている
 * （body.has-drawer-open時はJS側でもhidden化しないよう制御、下記参照）。
 * ------------------------------------------------------------
 */
.site-header {
	position: sticky;
	top: 0;
	z-index: 500;
	transform: translateY(0);
	transition: transform 0.3s ease;
}

/* WordPress admin bar（ログイン時にposition:fixedで最上部に表示される）
   との重なりを避けるため、admin bar分だけstickyのtopをずらす。
   32px/46pxの値・782pxのbreakpointはWordPressコア標準の値をそのまま使用。 */
body.admin-bar .site-header {
	top: 32px;
}
@media screen and (max-width: 782px) {
	body.admin-bar .site-header {
		top: 46px;
	}
}

.site-header.is-header-hidden {
	transform: translateY(-100%);
}

/* モバイルdrawer展開中は、ハンバーガーボタンごとHeaderが隠れると
   操作不能になるため、常に表示状態を強制する。 */
body.has-drawer-open .site-header {
	transform: translateY(0) !important;
}

@media (prefers-reduced-motion: reduce) {
	.site-header {
		transition: none;
	}
}

.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: nowrap;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0.75rem 1rem;
	gap: 1rem;
}

.site-branding {
	flex: 0 0 auto;
}

.site-branding img {
	display: block;
	height: auto;
	max-height: 48px;
	width: auto;
}

.site-branding__title {
	margin: 0;
	font-size: 1.1rem;
}

.site-branding__title a {
	text-decoration: none;
	color: inherit;
}

/* PC: 事業ナビ */
.primary-navigation {
	display: none;
}

.primary-navigation__menu {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.primary-navigation__menu a {
	text-decoration: none;
	color: inherit;
	white-space: nowrap;
}

/* PC: 「取扱商品・サービス」サブメニュー（hover / focus / クリックのいずれでも開閉） */
.primary-navigation__menu .menu-item-has-children {
	position: relative;
}

.primary-navigation__menu .menu-item-has-children > a::after {
	content: "\25BC";
	display: inline-block;
	margin-left: 0.35em;
	font-size: 0.6em;
	vertical-align: middle;
	transition: transform 0.15s ease;
}

.primary-navigation__menu .menu-item-has-children > a[aria-expanded="true"]::after,
.primary-navigation__menu .menu-item-has-children:hover > a::after,
.primary-navigation__menu .menu-item-has-children:focus-within > a::after {
	transform: rotate(180deg);
}

.primary-navigation__menu .sub-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 10rem;
	margin: 0;
	padding: 0.5rem 0;
	list-style: none;
	background-color: #fff;
	border: 1px solid #eee;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
	z-index: 10;
}

.primary-navigation__menu .menu-item-has-children:hover > .sub-menu,
.primary-navigation__menu .menu-item-has-children:focus-within > .sub-menu,
.primary-navigation__menu .menu-item-has-children > a[aria-expanded="true"] + .sub-menu {
	display: block;
}

.primary-navigation__menu .sub-menu li {
	white-space: nowrap;
}

.primary-navigation__menu .sub-menu a {
	display: block;
	padding: 0.5em 1em;
}

.primary-navigation__menu .sub-menu a:hover,
.primary-navigation__menu .sub-menu a:focus {
	background-color: #f5f5f5;
}

/* PC: EC導線（事業ナビとは構造・視覚的に分離） */
.header-ec-nav {
	display: none;
	align-items: center;
	gap: 1rem;
	padding-left: 1rem;
	border-left: 1px solid #ddd;
	flex: 0 0 auto;
}

.header-ec-nav__link {
	text-decoration: none;
	color: inherit;
	white-space: nowrap;
	font-size: 0.9rem;
}

.header-ec-nav__link--shop {
	font-weight: bold;
}

/* モバイル: SHOP常時導線 */
.mobile-shop-entry {
	flex: 0 0 auto;
}

.mobile-shop-entry__link {
	display: inline-block;
	text-decoration: none;
	font-weight: bold;
	color: inherit;
	border: 1px solid currentColor;
	border-radius: 4px;
	padding: 0.35em 0.8em;
	font-size: 0.9rem;
	white-space: nowrap;
}

/* ハンバーガーボタン */
.drawer-toggle {
	flex: 0 0 auto;
	width: 40px;
	height: 40px;
	padding: 0;
	border: none;
	background: transparent;
	cursor: pointer;
}

.drawer-toggle__box {
	position: relative;
	display: block;
	width: 24px;
	height: 2px;
	margin: 0 auto;
	background-color: currentColor;
}

.drawer-toggle__box::before,
.drawer-toggle__box::after {
	content: "";
	position: absolute;
	left: 0;
	width: 24px;
	height: 2px;
	background-color: currentColor;
}

.drawer-toggle__box::before {
	top: -8px;
}

.drawer-toggle__box::after {
	top: 8px;
}

/* drawer（モバイルメニュー） */
.mobile-drawer {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	width: 80%;
	max-width: 320px;
	background-color: #fff;
	box-shadow: -2px 0 8px rgba(0, 0, 0, 0.15);
	transform: translateX(100%);
	transition: transform 0.25s ease;
	z-index: 1000;
	overflow-y: auto;
}

.mobile-drawer.is-open {
	transform: translateX(0);
}

.mobile-drawer__inner {
	padding: 1rem;
}

.mobile-drawer__close {
	display: block;
	margin-left: auto;
	width: 40px;
	height: 40px;
	font-size: 1.5rem;
	line-height: 1;
	border: none;
	background: transparent;
	cursor: pointer;
}

.mobile-drawer__menu,
.mobile-drawer__ec-menu {
	list-style: none;
	margin: 0 0 1rem;
	padding: 0;
}

.mobile-drawer__menu li,
.mobile-drawer__ec-menu li {
	border-bottom: 1px solid #eee;
}

.mobile-drawer__menu a,
.mobile-drawer__ec-menu a {
	display: block;
	padding: 0.75em 0.25em;
	text-decoration: none;
	color: inherit;
}

.mobile-drawer__ec-menu {
	border-top: 2px solid #ddd;
	padding-top: 0.5rem;
}

/* drawer: 「取扱商品・サービス」サブメニュー（タップで開閉するアコーディオン方式。hoverには依存しない） */
.mobile-drawer__menu .menu-item-has-children > a::after {
	content: "\25BC";
	display: inline-block;
	margin-left: 0.35em;
	font-size: 0.75em;
	vertical-align: middle;
	transition: transform 0.15s ease;
}

.mobile-drawer__menu .menu-item-has-children > a[aria-expanded="true"]::after {
	transform: rotate(180deg);
}

.mobile-drawer__menu .sub-menu {
	display: none;
	list-style: none;
	margin: 0;
	padding: 0 0 0 1rem;
}

.mobile-drawer__menu .menu-item-has-children > a[aria-expanded="true"] + .sub-menu {
	display: block;
}

.mobile-drawer__menu .sub-menu li {
	border-bottom: none;
	border-top: 1px solid #f2f2f2;
}

.drawer-overlay {
	position: fixed;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.4);
	z-index: 999;
}

body.has-drawer-open {
	overflow: hidden;
}

/* PC表示への切り替え（コンテンツ最大幅1280pxの節目を暫定的に採用） */
@media screen and ( min-width: 1024px ) {
	.primary-navigation,
	.header-ec-nav {
		display: flex;
	}

	.mobile-shop-entry,
	.drawer-toggle,
	.mobile-drawer,
	.drawer-overlay {
		display: none;
	}
}

/*
 * ------------------------------------------------------------
 * 通常固定ページ／slim固定ページの本文幅
 *
 * 通常幅は、Footer会社情報（footer.css の .footer__top、
 * max-width: var(--width-content)＝1180px、padding-left/right:
 * clamp(1.2rem, 4vw, 3rem)）と同じ基準に統一している（2026-09-16変更。
 * 旧値はmax-width:1280px／padding:1remの固定値だったが、タイトル・本文・
 * Footer会社情報の左右位置がページごとに揃わないため、Footer側を基準に
 * 合わせた）。slim幅=46remは対象外（変更しない）。
 *
 * フロントページ（front-page.php、body.home）は対象外とし、
 * トップページの現在のレイアウトには影響させない。
 * ------------------------------------------------------------
 */
body:not(.home) .entry-content {
	max-width: var(--width-content);
	margin-left: auto;
	margin-right: auto;
	padding-left: clamp(1.2rem, 4vw, 3rem);
	padding-right: clamp(1.2rem, 4vw, 3rem);
	box-sizing: border-box;
}

body:not(.home) .entry-content--slim {
	max-width: 46rem;
}

/*
 * ------------------------------------------------------------
 * 固定ページタイトル（entry-title）の横幅
 *
 * 上記.entry-content／.entry-content--slimは本文側の幅指定のみで、
 * page.php／page-templates/one-column.php／one-column-slim.phpが
 * 共通で出力するh1.entry-titleには幅・margin・paddingの指定がなく、
 * 本文より大きく左（画面端近く）に表示されていた（2026-09-15確認）。
 * 本文と同じ考え方でタイトル側にも幅を揃える。横方向のレイアウトのみを
 * 対象とし、font-size等の見た目・.entry-content側の既存指定は変更しない。
 * 幅の基準は上記.entry-contentと同じ理由でFooter会社情報に統一している。
 *
 * slim幅の判定はone-column-slim.phpが付与する専用class
 * （entry-title--slim）による。フロントページ（body.home）は対象外。
 *
 * entry-titleクラスはsearch.php／404.php／index.phpでも使われているが
 * （検索結果・404・投稿一覧の見出し）、今回のスコープは固定ページのみの
 * ため、body_class()がpost_type=pageの固定ページに標準で付与する
 * bodyクラス「page」で限定する（テーマ側でbody_classへの独自フィルタは
 * 追加していないため、WordPress標準の付与仕様どおりに機能する）。
 * ------------------------------------------------------------
 */
body.page:not(.home) .entry-title {
	max-width: var(--width-content);
	margin-left: auto;
	margin-right: auto;
	padding-left: clamp(1.2rem, 4vw, 3rem);
	padding-right: clamp(1.2rem, 4vw, 3rem);
	box-sizing: border-box;
}

body.page:not(.home) .entry-title--slim {
	max-width: 46rem;
}

/*
 * ------------------------------------------------------------
 * 通常固定ページの見出しサイズ（レスポンシブ）
 *
 * これまでh1(.entry-title)／.entry-content内のh2〜h4にはfont-size指定が
 * なく、theme.jsonのstyles.elements.headingもfont-family/font-weight/
 * line-heightのみでfont-sizeを持たないため、ブラウザ標準のUAデフォルト
 * （h1=2em/h2=1.5em/h3=1.17em/h4=1em、body基準16px）がPC・スマホ問わず
 * 同じ絶対pxで使われていた（2026-09-16確認）。390px幅では見出しの
 * 主張が強く見えるとの指摘を受け、PC側の見た目（h1=32px/h2=24px/
 * h3=約18.7px/h4=16px）は維持したまま、スマホ側だけ小さくなるよう
 * clamp()を追加する。本文（16px）は対象外、変更しない。
 *
 * single.css(.single-info__title)・information.css(.information__heading)
 * で既に使われている「固定pxのbreakpoint別上書きではなく、単一のclamp()で
 * 連続的にサイズを変化させる」という、このテーマの既存方針を踏襲する
 * （複雑な多段階の式にはしない）。基準viewportは390px→現在のcontentSize
 * である1180pxとし、1180px以上ではPC側の現在値でクランプされる。
 *
 * スコープはbody.page:not(.home)／.entry-content（既存の幅指定と同じ
 * 条件）。ID34(/hpproduction/)・専用フォームテンプレート・投稿ページ・
 * WooCommerce・Header/Footerはentry-content/entry-titleを使わない
 * （WooCommerce商品タイトルのみ偶然.entry-titleクラスを共有するが、
 * body_class()にpageが付かないためbody.pageスコープの対象外）ため、
 * いずれも影響しない。
 *
 * ID665(.homestay-price-table__title等)は、より詳細度の高い
 * page-homestay-price.css側の個別指定（.page-id-665 .homestay-price-table__title）
 * が優先されるべきだが、素のh2要素セレクタを使うと詳細度で上回ってしまう
 * ため、:where()でスコープ部分の詳細度をゼロにし、ID665側の既存指定が
 * 確実に勝つようにしている。
 * ------------------------------------------------------------
 */
body.page:not(.home) .entry-title {
	font-size: clamp(1.625rem, 1.44rem + 0.76vw, 2rem);
}

:where(body:not(.home)) .entry-content h2 {
	font-size: clamp(1.25rem, 1.13rem + 0.51vw, 1.5rem);
}

:where(body:not(.home)) .entry-content h3 {
	font-size: clamp(1.0625rem, 1.01rem + 0.22vw, 1.17rem);
}

:where(body:not(.home)) .entry-content h4 {
	font-size: 1rem;
}

/*
 * ------------------------------------------------------------
 * TOWA商品ページ entry-subtitle（H1/H2分割表示、2026-09-16
 * ID975で試験→21ページへ共通化）
 *
 * page-templates/one-column.php側で、対象21ページ（$towa_h1_h2_ids）
 * のみpost_title「TOWA取り扱い商品 ◯◯ ◯◯」をH1「TOWA取り扱い商品」
 * ＋H2(class="entry-subtitle")「◯◯ ◯◯」に分割している。対象時のみ
 * body_classフィルタで付与される共通class「has-entry-subtitle」で
 * スコープし、21個のpage-id-*を列挙しない。ここではその見た目だけを
 * 最小限整える（ID975で確認したサイズ・余白から変更なし）。
 *
 * - 幅・左右padding: 上記.entry-titleと同じ考え方（本文幅に揃える）
 * - font-size: 新しい値は作らず、既存の「固定ページ内h2」と同じ
 *   clamp(1.25rem, 1.13rem + 0.51vw, 1.5rem)（上記:where() h2ルールと同値）
 *   をそのまま流用し、H1(2rem)より明確に小さく・H1と競合しないようにする
 * - margin: リセットCSSが存在せずh1/h2ともUA既定値（h1は約0.67em、
 *   h2は約0.83em相当の上下margin）が残っているため、H1直後にH2を
 *   置くと既定値同士の相殺でも間隔が空きすぎる。H1側のmargin-bottomを
 *   対象ページ限定で0にし、H2のmargin-topも0にして詰め、H2の
 *   margin-bottomだけblocks.css側の.wp-block-buttons/.wp-block-heading
 *   と同じ--wp--preset--spacing--s（1rem）にして本文（直後のボタン）
 *   との間隔を「通常の余白」に揃える。
 *
 * has-entry-subtitleクラスは対象21ページのみに付与されるため、他の
 * one-columnページ・通常固定ページ・ID34等の専用ページの.entry-title／
 * .entry-contentの既存ルールには一切触れていない。
 * ------------------------------------------------------------
 */
body.has-entry-subtitle.page:not(.home) .entry-title {
	margin-bottom: 0;
}

body.has-entry-subtitle .entry-subtitle {
	max-width: var(--width-content);
	margin-top: 0;
	margin-bottom: var(--wp--preset--spacing--s, 1rem);
	margin-left: auto;
	margin-right: auto;
	padding-left: clamp(1.2rem, 4vw, 3rem);
	padding-right: clamp(1.2rem, 4vw, 3rem);
	box-sizing: border-box;
	font-size: clamp(1.25rem, 1.13rem + 0.51vw, 1.5rem);
}

/*
 * ------------------------------------------------------------
 * 本文内画像のレスポンシブ対応
 *
 * WooCommerce側に .woocommerce img, .woocommerce-page img { max-width:100% }
 * があるが、body に woocommerce／woocommerce-page classが付かない
 * WordPress標準の検索結果ページ等では効かず、商品本文（the_content()）内の
 * 画像がネイティブ幅のまま表示され、スマホ幅で横はみ出しの原因になっていた
 * （実測確認済み）。.entry-content配下の画像全般に適用し、検索結果に限らず
 * 今後追加されるコンテンツの同種の再発も防ぐ。
 * ------------------------------------------------------------
 */
.entry-content img {
	max-width: 100%;
	height: auto;
}

/*
 * footer（正式実装済み）は assets/css/footer.css を参照。
 * ここにあった骨組み段階の暫定スタイル（法的リンク4件＋copyrightのみ、
 * design tokens未使用）は正式実装により置き換え済みのため削除した。
 */

/*
 * ------------------------------------------------------------
 * 「会社案内」見出し・リード文の表示復旧（ID833・ID18で確認済み）
 *
 * 原因: post_content側のsnow-monkey-blocks/sectionブロックが
 * --smb-section--color / --smb-section--background-color を
 * var(--_color-white) / var(--accent-color) として指定しているが、
 * このテーマはSnow Monkeyテーマ本体のCSSを読み込まないため
 * --accent-color が未定義（背景色が透明のまま）。--_color-white は
 * Snow Monkey Blocksプラグイン側のfallback.cssで#fffとして定義されて
 * いるため文字色だけ白になり、白背景に同化して読めなくなっていた。
 *
 * ID833（トップページ）は見出し（smb-section__title）のみ復旧済み
 * だったが、実描画確認により同じ問題がリード文（smb-section__lede）
 * にも残っていたことが判明したため、今回あわせて復旧する。
 * ID18（ホーム（旧））はpost_content側が同一構造（同じ「会社案内」
 * ブロック）のため、同じ修正を適用する。他ページのsmb-sectionや
 * Information/事業内容の見出しには影響しない。
 * ------------------------------------------------------------
 */
.page-id-833 .smb-section__title,
.page-id-18 .smb-section__title {
	background-color: #187ce0;
	color: #fff;
	padding: 0.5em 1em;
}

.page-id-833 .smb-section__lede,
.page-id-18 .smb-section__lede {
	color: #333;
}

/*
 * ------------------------------------------------------------
 * トップページ「Information」お知らせ一覧（core/latest-posts）
 *
 * Snow Monkey Blocks依存を外すため、core/latest-postsに
 * className「information-latest-posts」を付与して限定表示。
 * このテーマ・サイト内で該当クラスを持つブロックは
 * このInformation部分のみのため、.page-id-833との二重指定で
 * 他ページ・他のlatest-postsブロックに影響しないようにする。
 *
 * core標準では各行が「タイトル→日付」の縦並びだが、
 * ここではflexで1行にまとめ、日付を先頭（order:-1）に
 * 表示し直している。
 * ------------------------------------------------------------
 */
.page-id-833 .information-latest-posts.wp-block-latest-posts__list {
	list-style: none;
	margin: 0;
	padding: 16px;
}

.page-id-833 .information-latest-posts li {
	display: flex;
	align-items: baseline;
	gap: 1.1em;
	list-style: none;
	margin: 0 0 1em;
}

.page-id-833 .information-latest-posts li:last-child {
	margin-bottom: 0;
}

.page-id-833 .information-latest-posts .wp-block-latest-posts__post-date {
	order: -1;
	flex-shrink: 0;
	display: inline;
	font-size: 1em;
	color: #555;
}

.page-id-833 .information-latest-posts .wp-block-latest-posts__post-title {
	color: #187ce0;
	text-decoration: none;
}

.page-id-833 .information-latest-posts .wp-block-latest-posts__post-title:hover {
	text-decoration: underline;
}

/* PC表示ではコンテンツ左端に寄りすぎないよう内側余白を広げる（既存のPC切り替え節目1024pxに合わせる） */
@media screen and ( min-width: 1024px ) {
	.page-id-833 .information-latest-posts.wp-block-latest-posts__list {
		padding: 22px 35px;
	}
}

/*
 * ------------------------------------------------------------
 * トップページ「社屋メインビジュアル」の上下余白調整
 *
 * 原因: snow-monkey-blocks/section-with-bgimageが使う
 * .smb-section共通CSS（プラグイン側）は --smb-section--padding を
 * 前提にしているが、このテーマはSnow Monkeyテーマ本体のCSS変数を
 * 読み込まないため、プラグインのfallback.css側のフルードpadding
 * （デスクトップ幅で上下とも約68px相当）がそのまま適用され、
 * 画像の上下、特に画像下からInformation見出しまでの間に
 * 大きな白い空白ができていた。
 *
 * メインビジュアルとしては上下paddingが不要なため0にし、あわせて
 * ブロック自身のmargin-bottom（post_content側でvar(--wp--preset--spacing--50)
 * ≒24pxが指定されている。post_contentは変更せずCSS側で打ち消す）と、
 * 画像を包むfigure要素のコアデフォルトmargin-bottom（約1em）も
 * このセクション内だけ0にする。
 *
 * ID833内にsection-with-bgimageは現状この1つのみだが、他ページ・
 * 将来の追加ブロックに影響させないよう、このセクション固有の
 * className（is-style-smb-section-undecorated-title）を条件に加えて
 * このメインビジュアルのセクションだけに限定する。
 * ------------------------------------------------------------
 */
.page-id-833 .smb-section-with-bgimage.is-style-smb-section-undecorated-title {
	--smb-section--padding: 0;
	margin-bottom: 0 !important;
}

.page-id-833 .smb-section-with-bgimage.is-style-smb-section-undecorated-title figure.wp-block-image {
	margin-bottom: 0;
}