/*
Theme Name: 変換ポケット
Description: 無料ツール紹介・配布サイト「変換ポケット」用のテーマです。Twenty Twenty-Five の子テーマとして、色・文字・部品の見た目だけを追加しています。
Author: 変換ポケット
Template: twentytwentyfive
Version: 1.1.3
Requires at least: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: henkan-pocket
*/

:root {
	--hp-blue: var(--wp--preset--color--accent-1);
	--hp-blue-dark: var(--wp--preset--color--accent-3);
	--hp-blue-tint: var(--wp--preset--color--accent-2);
	--hp-muted: var(--wp--preset--color--accent-4);
	--hp-soft: var(--wp--preset--color--accent-5);
	--hp-line: var(--wp--preset--color--accent-6);
	--hp-radius: 20px;
	--hp-shadow: 0 1px 2px rgba(17, 38, 76, 0.06), 0 8px 24px rgba(17, 38, 76, 0.08);
	--hp-accent: var(--hp-blue);
	--hp-accent-tint: var(--hp-blue-tint);
}

/* アプリごとのアクセント色（既存アイコンの色） */
.hp-accent-image { --hp-accent: var(--wp--preset--color--app-image); --hp-accent-tint: #EAF8EE; }
.hp-accent-media { --hp-accent: var(--wp--preset--color--app-media); --hp-accent-tint: #EEF0FF; }
.hp-accent-merge { --hp-accent: var(--wp--preset--color--app-merge); --hp-accent-tint: #E6F4EC; }
.hp-accent-pdf { --hp-accent: var(--wp--preset--color--app-pdf); --hp-accent-tint: #FBECFE; }
.hp-accent-qr { --hp-accent: var(--wp--preset--color--app-qr); --hp-accent-tint: #E9EFFE; }

body { -webkit-font-smoothing: antialiased; overflow-wrap: anywhere; }
img { max-width: 100%; height: auto; }

/* キーボード操作時のフォーカス表示 */
:where(a, button, summary, input, select, textarea, .wp-element-button):focus-visible {
	outline: 3px solid #0B3D91;
	outline-offset: 3px;
	border-radius: 6px;
}

/* ===== ヘッダー ===== */
.hp-header {
	background: #fff;
	border-bottom: 1px solid var(--hp-line);
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
}
.hp-brand { gap: 0.6rem; }
.hp-brand .hp-brand__logo { margin: 0; }
.hp-brand .hp-brand__logo img { display: block; }
.hp-brand .wp-block-site-title a { color: var(--wp--preset--color--contrast); text-decoration: none; display: inline-block; padding: 0.3rem 0; }
.hp-header .wp-block-navigation a { text-decoration: none; }
.hp-header .wp-block-navigation a:hover { color: var(--hp-blue); text-decoration: underline; }

/* ===== パンくず ===== */
.hp-breadcrumbs { font-size: var(--wp--preset--font-size--small); color: var(--hp-muted); margin-top: 1rem; }
.hp-breadcrumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.25rem 0.5rem; }
.hp-breadcrumbs li + li::before { content: "›"; margin-right: 0.5rem; color: var(--hp-muted); }
.hp-breadcrumbs a { color: var(--hp-muted); display: inline-block; padding: 0.2rem 0; }

/* ===== ファーストビュー ===== */
.hp-hero {
	background:
		radial-gradient(circle at 85% 20%, rgba(255, 180, 0, 0.18) 0, rgba(255, 180, 0, 0) 32%),
		linear-gradient(180deg, var(--hp-blue-tint) 0%, #F7FBFF 70%, #fff 100%);
}
.hp-eyebrow {
	display: inline-block;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	color: var(--hp-blue-dark);
	background: #fff;
	border: 1px solid #C9DDF8;
	border-radius: 999px;
	padding: 0.2em 0.9em;
}
.hp-lead { font-size: var(--wp--preset--font-size--large); color: var(--wp--preset--color--contrast); }

/* 「無料」「インストール不要」などの目印 */
.hp-badges { gap: 0.5rem !important; }
.hp-badges p,
p.hp-badge {
	margin: 0;
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	line-height: 1.4;
	background: #fff;
	color: var(--hp-blue-dark);
	border: 2px solid #BBD4F6;
	border-radius: 999px;
	padding: 0.35em 0.9em;
}
.hp-badges p::before,
p.hp-badge::before {
	content: "";
	width: 1em;
	height: 1em;
	flex: none;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M7.7 14.3 3.4 10l1.4-1.4 2.9 2.9 7.5-7.5 1.4 1.4z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M7.7 14.3 3.4 10l1.4-1.4 2.9 2.9 7.5-7.5 1.4 1.4z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ファーストビュー右側の「ポケット」 */
.hp-pocket {
	position: relative;
	padding: 1.75rem 1.5rem 2.25rem;
	border-radius: 28px 28px 44px 44px;
	background: var(--hp-blue);
	box-shadow: 0 18px 40px rgba(21, 101, 216, 0.28);
}
.hp-pocket::after {
	content: "";
	position: absolute;
	inset: 0.85rem;
	border: 2px dashed rgba(255, 255, 255, 0.55);
	border-radius: 20px 20px 34px 34px;
	pointer-events: none;
}
.hp-pocket .hp-pocket__items { gap: 1rem 1.25rem; position: relative; z-index: 1; }
.hp-pocket .wp-block-image { margin: 0; flex: 0 0 calc((100% - 2.5rem) / 3); }
.hp-pocket img {
	display: block;
	width: 100%;
	max-width: 96px;
	margin: 0 auto;
	filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.25));
}
.hp-pocket-caption { color: #fff; font-weight: 700; text-align: center; margin-top: 1rem !important; position: relative; z-index: 1; }

/* ===== セクション共通 ===== */
.hp-main { padding-bottom: clamp(2rem, 5vw, 3.5rem); }
.hp-section { padding-top: clamp(2.5rem, 6vw, 4.5rem); padding-bottom: clamp(2.5rem, 6vw, 4.5rem); }
.hp-section-sm { padding-top: clamp(1.5rem, 4vw, 2.5rem); padding-bottom: clamp(1.5rem, 4vw, 2.5rem); }
.hp-page .wp-block-post-title { margin-top: 1rem; }
.hp-section-title { text-align: center; }
.hp-section-lead { text-align: center; color: var(--hp-muted); }
.hp-band-soft { background: var(--hp-soft); }

/* ===== カード ===== */
.is-style-hp-card,
.hp-tool-card {
	background: #fff;
	border: 1px solid var(--hp-line);
	border-radius: var(--hp-radius);
	box-shadow: var(--hp-shadow);
}
.hp-tool-card {
	position: relative;
	overflow: hidden;
	padding: 1.5rem 1.4rem 1.4rem;
	height: 100%;
	display: flex;
	flex-direction: column;
	border-top: 6px solid var(--hp-accent);
}
.hp-tool-card .hp-tool-card__icon { margin: 0; }
.hp-tool-card .hp-tool-card__icon img { width: 72px; height: 72px; display: block; }
.hp-tool-card h3 { margin-top: 0.75rem; margin-bottom: 0; }
.hp-tool-card h3 a { color: var(--wp--preset--color--contrast); text-decoration: none; }
.hp-tool-card h3 a:hover { color: var(--hp-blue); text-decoration: underline; }
.hp-tool-card .hp-tool-card__catch { font-weight: 800; color: var(--wp--preset--color--contrast); margin-top: 0.4rem; margin-bottom: 0; line-height: 1.5; }
.hp-tool-card .hp-tool-card__desc { color: var(--hp-muted); font-size: var(--wp--preset--font-size--small); margin-top: 0.5rem; }
.hp-tool-card .wp-block-buttons { margin-top: auto; padding-top: 0.75rem; }
.hp-tool-card .wp-block-button__link { width: 100%; }

/* 枠線だけのボタン（詳しく見る） */
.wp-block-button.is-style-outline .wp-block-button__link {
	background: #fff;
	color: var(--hp-blue);
	border: 2px solid var(--hp-blue);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:focus {
	background: var(--hp-blue-tint);
	color: var(--hp-blue-dark);
	border-color: var(--hp-blue-dark);
}

/* ===== やりたいことから探す ===== */
.hp-want a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	padding: 1rem 1.25rem;
	background: #fff;
	border: 2px solid var(--hp-line);
	border-left: 8px solid var(--hp-accent);
	border-radius: 14px;
	color: var(--wp--preset--color--contrast);
	font-weight: 700;
	text-decoration: none;
	min-height: 3.5rem;
}
.hp-want a::after { content: "→"; color: var(--hp-accent); font-weight: 800; }
.hp-want a:hover { border-color: var(--hp-accent); background: var(--hp-accent-tint); }
.hp-want p { margin: 0; }
.hp-want small { display: block; font-weight: 400; color: var(--hp-muted); font-size: 0.8125rem; }

/* ===== 特徴 ===== */
.hp-feature { background: #fff; border-radius: var(--hp-radius); padding: 1.25rem 1.25rem 1rem; border: 1px solid var(--hp-line); }
.hp-feature h3 { display: flex; align-items: center; gap: 0.5rem; margin-top: 0; }
.hp-feature h3::before {
	content: "";
	width: 1.6rem;
	height: 1.6rem;
	flex: none;
	border-radius: 50%;
	background: var(--wp--preset--color--pop) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%231F2933' d='M7.7 14.3 3.4 10l1.4-1.4 2.9 2.9 7.5-7.5 1.4 1.4z'/%3E%3C/svg%3E") center / 70% no-repeat;
}
.hp-feature p { color: var(--hp-muted); margin-bottom: 0; }

/* ===== アプリページのヒーロー ===== */
.hp-app-hero {
	background: linear-gradient(180deg, var(--hp-accent-tint) 0%, #fff 100%);
	border-radius: 28px;
	padding: clamp(1.25rem, 4vw, 2.5rem);
	margin-top: 1rem;
}
.hp-app-hero .hp-app-hero__icon { margin: 0; }
.hp-app-hero .hp-app-hero__icon img { width: 120px; height: 120px; display: block; filter: drop-shadow(0 10px 16px rgba(0, 0, 0, 0.18)); }
.hp-app-hero h1 { margin-top: 0; margin-bottom: 0.25rem; }
.hp-app-hero .hp-app-hero__catch { font-size: var(--wp--preset--font-size--x-large); font-weight: 800; color: var(--hp-accent); margin-top: 0; line-height: 1.45; }
.hp-accent-image .hp-app-hero__catch { color: #157A2C; }
.hp-accent-merge .hp-app-hero__catch { color: #0B6A32; }

/* ===== ダウンロード ===== */
.hp-download-box {
	background: #fff;
	border: 3px solid var(--hp-blue);
	border-radius: 24px;
	box-shadow: 0 12px 28px rgba(21, 101, 216, 0.14);
	padding: clamp(1.25rem, 4vw, 2.25rem);
	margin-top: clamp(1.5rem, 4vw, 2.5rem);
	max-width: 980px;
}
.hp-download-box h2 { margin-top: 0; }
.wp-block-button.is-style-hp-download .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.6em;
	font-size: var(--wp--preset--font-size--large);
	font-weight: 800;
	padding: 1em 2.2em;
	background: var(--hp-blue);
	color: #fff;
	border-radius: 999px;
	box-shadow: 0 5px 0 #0A3F8F;
	text-decoration: none;
}
.wp-block-button.is-style-hp-download .wp-block-button__link::before {
	content: "";
	width: 1.25em;
	height: 1.25em;
	flex: none;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 3h2v9.2l3.3-3.3 1.4 1.4L12 16l-5.7-5.7 1.4-1.4 3.3 3.3zM4 18h16v2H4z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 3h2v9.2l3.3-3.3 1.4 1.4L12 16l-5.7-5.7 1.4-1.4 3.3 3.3zM4 18h16v2H4z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.wp-block-button.is-style-hp-download .wp-block-button__link:hover,
.wp-block-button.is-style-hp-download .wp-block-button__link:focus {
	background: var(--hp-blue-dark);
	color: #fff;
}
.wp-block-button.is-style-hp-download .wp-block-button__link:active { transform: translateY(3px); box-shadow: 0 2px 0 #0A3F8F; }
.hp-download-meta { color: var(--hp-muted); font-size: var(--wp--preset--font-size--small); }

/* ===== 手順 ===== */
ol.hp-steps { list-style: none; counter-reset: hp-step; padding-left: 0; }
ol.hp-steps > li {
	counter-increment: hp-step;
	position: relative;
	padding: 0.25rem 0 1rem 3.25rem;
	min-height: 2.5rem;
}
ol.hp-steps > li::before {
	content: counter(hp-step);
	position: absolute;
	left: 0;
	top: 0.1rem;
	width: 2.25rem;
	height: 2.25rem;
	border-radius: 50%;
	display: grid;
	place-items: center;
	font-weight: 800;
	color: #fff;
	background: var(--hp-accent);
}
.hp-accent-image ol.hp-steps > li::before { background: #157A2C; }

/* ===== よくある質問 ===== */
.hp-faq .wp-block-details {
	border: 1px solid var(--hp-line);
	border-radius: 14px;
	background: #fff;
	padding: 0 1.25rem;
	margin-top: 0.75rem;
}
.hp-faq .wp-block-details summary {
	cursor: pointer;
	font-weight: 700;
	padding: 1rem 0;
	list-style-position: outside;
}
.hp-faq .wp-block-details[open] summary { border-bottom: 1px dashed var(--hp-line); margin-bottom: 0.75rem; }
.hp-faq .wp-block-details > :last-child { margin-bottom: 1rem; }

/* ===== 詳細情報の表 ===== */
.hp-specs table { border-collapse: collapse; width: 100%; }
.hp-specs th, .hp-specs td { border: 1px solid var(--hp-line); padding: 0.6rem 0.8rem; text-align: left; vertical-align: top; }
.hp-specs th { background: var(--hp-soft); width: 34%; font-weight: 700; }
.hp-specs code, .hp-hash { font-family: var(--wp--preset--font-family--hp-mono); font-size: 0.8125rem; word-break: break-all; }

/* ===== 広告枠（PR） ===== ダウンロードやツールカードと見分けがつく、控えめなグレーの枠 */
.hp-pr-slot {
	background: #F4F5F7;
	border: 1px dashed #B8C0CC;
	border-radius: 12px;
	padding: 1rem 1.25rem 1.25rem;
	color: #3F4752;
}
.hp-pr-slot .hp-pr-slot__label {
	display: inline-block;
	margin: 0 0 0.25rem;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	color: #fff;
	background: #55606E;
	border-radius: 4px;
	padding: 0.1em 0.6em;
}
.hp-pr-slot .hp-pr-slot__title { font-size: var(--wp--preset--font-size--medium); margin: 0.25rem 0 0.5rem; color: #3F4752; }
.hp-pr-slot .hp-pr-slot__ad { text-align: center; line-height: 0; }
.hp-pr-slot .hp-pr-slot__ad a { display: inline-block; max-width: 100%; }
.hp-pr-slot .hp-pr-slot__ad img { max-width: 100%; height: auto; }
/* 2026-10-07 に増やした枠の見出しは段落（ページの見出しの順番を崩さないため h2 にしない） */
.hp-pr-slot p.hp-pr-slot__title { font-weight: 700; line-height: 1.5; }
/* 文章の途中（できること・使い方の後）に入る枠は、前後の文章と間を空ける */
.hp-app-page .hp-section-sm > .hp-pr-slot:not(:only-child) { margin-top: 2rem; margin-bottom: 2rem; }

/* パソコンの右側の枠：横 1280px 以上の画面だけ表示する。
   ページを「本文 820px＋右 300px」の2列にし、ダウンロード枠より下の行から右の列に置いて、読み進めても右に残す（スマホ・狭い画面では出さない） */
.hp-pr-slot--side { display: none; }
@media (min-width: 1280px) {
	.hp-app-page:has(> .hp-pr-slot--side) {
		display: grid;
		grid-template-columns: minmax(0, 820px) 300px;
		column-gap: 48px;
		justify-content: center;
		align-items: start;
	}
	.hp-app-page:has(> .hp-pr-slot--side) > * {
		grid-column: 1;
		width: 100%;
		max-width: none !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
	.hp-app-page:has(> .hp-pr-slot--side) > .hp-app-hero { grid-column: 1 / -1; }
	.hp-app-page:has(> .hp-pr-slot--side) > .hp-download-box { grid-column: 1 / -1; justify-self: center; max-width: 980px !important; }
	.hp-app-page > .hp-pr-slot--side {
		display: block;
		grid-column: 2;
		grid-row: 3 / span 40;
		position: sticky;
		top: 1.5rem;
		/* ダウンロード枠のすぐ横・最初の画面には出さない（ダウンロード枠の下端から 480px 以上あけて始める） */
		margin-top: 480px !important;
	}
}
.hp-pr-slot .hp-pr-slot__placeholder {
	margin: 0;
	padding: 1rem;
	text-align: center;
	font-size: var(--wp--preset--font-size--small);
	color: #55606E;
	background: #fff;
	border-radius: 8px;
}

/* ===== ブログ（一覧） ===== */
.hp-blog .hp-blog__title { margin-top: 1rem; margin-bottom: 0.25rem; }
.hp-blog .hp-blog__lead { color: var(--hp-muted); }
.hp-post-list .wp-block-post-template { list-style: none; padding-left: 0; display: grid; gap: 1rem; margin-top: 1.5rem; }
.hp-post-card {
	background: #fff;
	border: 1px solid var(--hp-line);
	border-radius: 16px;
	box-shadow: var(--hp-shadow);
	padding: 1.1rem 1.25rem 1.2rem;
}
.hp-post-card > * { margin-top: 0; margin-bottom: 0; }
.hp-post-card .hp-post-card__cat { font-size: 0.8125rem; font-weight: 700; }
.hp-post-card .hp-post-card__cat a { color: var(--hp-blue-dark); text-decoration: none; }
.hp-post-card .hp-post-card__title { font-size: var(--wp--preset--font-size--large); line-height: 1.5; margin-top: 0.35rem; }
.hp-post-card .hp-post-card__title a { color: var(--wp--preset--color--contrast); text-decoration: none; }
.hp-post-card .hp-post-card__title a:hover { color: var(--hp-blue); text-decoration: underline; }
.hp-post-card .hp-post-card__date { color: var(--hp-muted); font-size: var(--wp--preset--font-size--small); margin-top: 0.35rem; }
.hp-post-card .hp-post-card__excerpt { margin-top: 0.5rem; }
.hp-post-card .hp-post-card__excerpt p { margin: 0; }
.hp-post-list .wp-block-query-pagination { margin-top: 1.5rem; }

/* ===== ブログ（記事） ===== */
.hp-post .wp-block-post-title { margin-bottom: 0.5rem; }
.hp-post-meta { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; color: var(--hp-muted); font-size: var(--wp--preset--font-size--small); margin: 0 0 1rem; }
.hp-post-pr { margin: 0 0 1.5rem; }
.hp-post-body h2 { border-bottom: 3px solid var(--hp-blue-tint); padding-bottom: 0.3rem; margin-top: 2.5rem; }
.hp-post-body .wp-block-table { overflow-x: auto; }
.hp-post-body .wp-block-table table { border-collapse: collapse; width: 100%; }
.hp-post-body .wp-block-table th,
.hp-post-body .wp-block-table td { border: 1px solid var(--hp-line); padding: 0.55rem 0.75rem; text-align: left; vertical-align: top; }
.hp-post-body .wp-block-table th { background: var(--hp-soft); }
.hp-post-body .hp-summary {
	background: var(--hp-blue-tint);
	border-left: 6px solid var(--hp-blue);
	border-radius: 12px;
	padding: 1rem 1.25rem;
}
.hp-post-body .hp-summary > :first-child { margin-top: 0; }
.hp-post-body .hp-summary > :last-child { margin-bottom: 0; }
.hp-post-body .hp-tool-callout {
	background: #fff;
	border: 2px solid var(--hp-line);
	border-left: 8px solid var(--hp-accent);
	border-radius: 14px;
	padding: 1rem 1.25rem;
}
.hp-post-body .hp-tool-callout > :first-child { margin-top: 0; }
.hp-post-body .hp-tool-callout > :last-child { margin-bottom: 0; }
.hp-post-body .hp-sources { font-size: var(--wp--preset--font-size--small); }
/* のんちゃんのひとこと（意見の部分。事実の部分と見た目を分ける） */
.hp-post-body .hp-nonchan {
	background: #FFF5FA;
	border: 2px solid #F7B6D2;
	border-radius: 16px;
	padding: 1rem 1.25rem;
}
.hp-post-body .hp-nonchan > :first-child { margin-top: 0; }
.hp-post-body .hp-nonchan > :last-child { margin-bottom: 0; }
.hp-post-body .hp-nonchan .hp-nonchan__name { font-weight: 800; color: #B0175A; margin-bottom: 0.35rem; }
.hp-post-body .wp-block-table figcaption { font-size: var(--wp--preset--font-size--small); color: var(--hp-muted); }
.hp-post-about {
	box-sizing: border-box;
	background: var(--hp-soft);
	border-radius: 12px;
	padding: 1rem 1.25rem;
	margin-top: 2.5rem;
	font-size: var(--wp--preset--font-size--small);
}
.hp-post-about p { margin: 0; }
.hp-post-about .hp-post-about__title { font-weight: 700; margin-bottom: 0.35rem; }
.hp-related { margin-top: 2rem; }
.hp-related .hp-related__title { font-size: var(--wp--preset--font-size--large); }
.hp-related ul { list-style: none; padding-left: 0; margin: 0; }
.hp-related li { border-bottom: 1px solid var(--hp-line); padding: 0.6rem 0; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.25rem 1rem; }
.hp-related .hp-related__date { color: var(--hp-muted); font-size: var(--wp--preset--font-size--small); }
.hp-blog-tools { margin-top: 2rem; }

/* ===== お問い合わせフォーム ===== */
.hp-contact { max-width: 640px; }
.hp-contact p { margin: 0 0 1.25rem; }
.hp-contact label { display: block; font-weight: 700; margin-bottom: 0.35rem; }
.hp-contact input[type="text"],
.hp-contact input[type="email"],
.hp-contact select,
.hp-contact textarea {
	box-sizing: border-box;
	width: 100%;
	font: inherit;
	padding: 0.6rem 0.75rem;
	border: 2px solid var(--hp-line);
	border-radius: 10px;
	background: #fff;
	color: var(--wp--preset--color--contrast);
}
.hp-contact input:focus,
.hp-contact select:focus,
.hp-contact textarea:focus { border-color: var(--hp-blue); outline: 3px solid #0B3D91; outline-offset: 1px; }
.hp-contact input[type="file"] { font: inherit; max-width: 100%; }
.hp-contact .hp-contact__req { display: inline-block; margin-left: 0.5rem; font-size: 0.75rem; color: #fff; background: #B0175A; border-radius: 4px; padding: 0 0.4em; vertical-align: middle; }
.hp-contact .hp-contact__help { display: block; margin-top: 0.35rem; color: var(--hp-muted); font-size: var(--wp--preset--font-size--small); font-weight: 400; }
.hp-contact .hp-contact__agree label { font-weight: 400; }
.hp-contact .hp-contact__trap { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.hp-contact .hp-contact__submit { font-weight: 800; padding: 0.8em 2.2em; border-radius: 999px; }
.hp-contact-errors { background: #FDECEC; border: 2px solid #E57373; border-radius: 12px; padding: 1rem 1.25rem; margin-bottom: 1.5rem; }
.hp-contact-errors ul { margin: 0.5rem 0 0; }
.hp-contact-done { background: var(--hp-blue-tint); border-left: 6px solid var(--hp-blue); border-radius: 12px; padding: 1rem 1.25rem; }
.hp-contact-done p:last-child { margin-bottom: 0; }

/* ===== フッター ===== */
.hp-footer { background: #10233F; color: #E8EEF6; }
.hp-footer a { color: #E8EEF6; }
.hp-footer a:hover { color: #fff; }
.hp-footer :where(a, button):focus-visible { outline-color: #FFD45C; }
.hp-footer h2 { color: #fff; font-size: var(--wp--preset--font-size--medium); }
.hp-footer ul { list-style: none; padding-left: 0; margin: 0; }
.hp-footer li { margin: 0.35rem 0; }
.hp-footer .hp-footer__note { font-size: var(--wp--preset--font-size--small); color: #C9D5E6; }
.hp-footer .wp-block-site-title a { color: #fff; text-decoration: none; }

/* ===== スマホ ===== */
@media (max-width: 781px) {
	.hp-hero h1 { font-size: 1.875rem; }
	.hp-pocket { max-width: 420px; margin-left: auto; margin-right: auto; padding: 1.25rem 1rem 1.6rem; }
	.hp-pocket .hp-pocket__items { gap: 0.75rem 0.9rem; }
	.hp-pocket .wp-block-image { flex-basis: calc((100% - 1.8rem) / 3); }
	.hp-pocket img { width: 100% !important; height: auto !important; max-width: 72px; }
	.hp-pocket-caption { margin-top: 0.6rem !important; }
	.hp-app-hero .hp-app-hero__icon img { width: 88px; height: 88px; }
	.wp-block-button.is-style-hp-download,
	.wp-block-button.is-style-hp-download .wp-block-button__link { width: 100%; }
	.wp-block-button.is-style-hp-download .wp-block-button__link { font-size: 1.0625rem; padding: 0.95em 1.1em; }
	.hp-specs th { width: 40%; }
}

@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; scroll-behavior: auto !important; }
}
