/* page-contact.css — お問い合わせページ専用。CF7フォームの整え。 */

.contact { padding-block: var(--wp--preset--spacing--xl); }
.contact__inner {
	max-width: var(--wp--style--global--content-size, 720px);
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--md);
}

.contact__body > p:first-child {
	text-align: center;
	color: var(--wp--preset--color--ink-soft);
	margin-bottom: var(--wp--preset--spacing--lg);
}

/* CF7 フォーム本体 */
.wpcf7 { margin-block: var(--wp--preset--spacing--md); }
.wpcf7-form {
	background: #fff;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 18px;
	padding: var(--wp--preset--spacing--lg) var(--wp--preset--spacing--md);
	box-shadow: 0 12px 28px -22px color-mix(in srgb, var(--wp--preset--color--brand) 60%, transparent);
}
@media (min-width: 768px) {
	.wpcf7-form { padding: var(--wp--preset--spacing--lg); }
}

.wpcf7-form p { margin: 0; }
.wpcf7-form label {
	display: block;
	margin-bottom: var(--wp--preset--spacing--md);
	font-weight: 700;
	color: var(--wp--preset--color--ink);
	font-size: var(--wp--preset--font-size--sm);
	letter-spacing: 0.04em;
}

.wpcf7-form-control-wrap { display: block; margin-top: 0.4rem; }

.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="url"],
.wpcf7-form input[type="number"],
.wpcf7-form input[type="date"],
.wpcf7-form select,
.wpcf7-form textarea {
	width: 100%;
	padding: 0.85rem 1rem;
	font-size: var(--wp--preset--font-size--base);
	font-family: inherit;
	color: var(--wp--preset--color--ink);
	background: var(--wp--preset--color--base);
	border: 1.5px solid var(--wp--preset--color--line);
	border-radius: 10px;
	font-weight: 400;
	transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
	box-sizing: border-box;
}
.wpcf7-form textarea {
	min-height: 180px;
	resize: vertical;
	line-height: 1.8;
}
.wpcf7-form input:focus,
.wpcf7-form select:focus,
.wpcf7-form textarea:focus {
	outline: none;
	border-color: var(--wp--preset--color--brand);
	background: #fff;
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--wp--preset--color--brand) 18%, transparent);
}

/* 必須バッジ（ラベル先頭にチップ表示） */
.wpcf7-form label:has(.wpcf7-validates-as-required)::before,
.wpcf7-form label:has([aria-required="true"])::before {
	content: "必須";
	display: inline-block;
	margin-right: 0.6em;
	padding: 0.15em 0.6em;
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--base);
	font-size: 0.7em;
	border-radius: 4px;
	font-weight: 700;
	letter-spacing: 0.08em;
	vertical-align: 0.15em;
}

/* 送信ボタン */
.wpcf7-form .wpcf7-submit,
.wpcf7-form input[type="submit"] {
	display: inline-block;
	min-width: 220px;
	padding: 1rem 2.5rem;
	margin-top: var(--wp--preset--spacing--sm);
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--base);
	border: 0;
	border-radius: 999px;
	font-size: var(--wp--preset--font-size--base);
	font-weight: 700;
	letter-spacing: 0.05em;
	cursor: pointer;
	transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease;
	box-shadow: 0 10px 24px -14px color-mix(in srgb, var(--wp--preset--color--brand) 70%, transparent);
}
.wpcf7-form .wpcf7-submit:hover,
.wpcf7-form input[type="submit"]:hover {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--ink);
	transform: translateY(-2px);
}
.wpcf7-form .wpcf7-submit:disabled {
	opacity: 0.5;
	cursor: not-allowed;
	transform: none;
}

/* 送信ボタンを中央寄せ */
.wpcf7-form p:has(.wpcf7-submit),
.wpcf7-form p:has(input[type="submit"]) {
	text-align: center;
	margin-top: var(--wp--preset--spacing--md);
}

/* 送信中スピナー */
.wpcf7-spinner {
	background-color: var(--wp--preset--color--brand);
}

/* バリデーション・通知 */
.wpcf7-not-valid-tip {
	display: block;
	margin-top: 0.4rem;
	padding: 0.4rem 0.75rem;
	background: color-mix(in srgb, var(--wp--preset--color--brand) 12%, transparent);
	color: var(--wp--preset--color--brand);
	border-radius: 6px;
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 600;
}
.wpcf7-response-output {
	margin: var(--wp--preset--spacing--md) 0 0 !important;
	padding: 1rem 1.25rem !important;
	border-radius: 10px !important;
	border: 0 !important;
	font-weight: 600;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
	background: color-mix(in srgb, var(--wp--preset--color--brand) 18%, transparent);
	color: var(--wp--preset--color--brand);
}
.wpcf7 form.sent .wpcf7-response-output {
	background: color-mix(in srgb, #06C755 18%, transparent);
	color: #048a3a;
}

.wpcf7-form input[aria-invalid="true"],
.wpcf7-form textarea[aria-invalid="true"] {
	border-color: var(--wp--preset--color--brand);
}