/* Contact Form 7。CF7 既定 CSS は dequeue しているので、隠蔽ユーティリティ等もここで補う。 */

/* --- CF7 既定 CSS の機能ユーティリティ（dequeue 分の補完） --- */
.wpcf7 .screen-reader-response { position: absolute; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; width: 1px; margin: -1px; padding: 0; border: 0; word-wrap: normal !important; word-break: normal !important; }
.wpcf7 .hidden-fields-container { display: none; }
.wpcf7-form fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.wpcf7-form-control-wrap { position: relative; }
.wpcf7 [inert] { opacity: 0.5; }
.wpcf7 input[type="url"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"] { direction: ltr; }
.wpcf7 .wpcf7-submit:disabled { cursor: not-allowed; }
.wpcf7-list-item { display: inline-block; margin: 0 0 0 1em; }
.wpcf7-list-item-label::before, .wpcf7-list-item-label::after { content: " "; }
/* スピナー（送信中のローディング表示） */
.wpcf7-spinner { visibility: hidden; display: inline-block; background-color: var(--text, #23282d); opacity: 0.75; width: 24px; height: 24px; border: none; border-radius: 100%; padding: 0; margin: 0 24px; position: relative; }
.wpcf7-form.submitting .wpcf7-spinner { visibility: visible; }
.wpcf7-spinner::before { content: ''; position: absolute; background-color: #fbfbfc; top: 4px; left: 4px; width: 6px; height: 6px; border: none; border-radius: 100%; transform-origin: 8px 8px; animation: wpcf7-spin 1000ms linear infinite; }
@keyframes wpcf7-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .wpcf7-spinner::before { animation: wpcf7-blink 2000ms infinite; } }
@keyframes wpcf7-blink { from { opacity: 0; } 50% { opacity: 1; } to { opacity: 0; } }

.wpcf7-form { max-width: 600px; margin: clamp(24px, 4vw, 40px) auto; }
/* 本文中に埋め込んだ CF7（shortcode 経由）も前後に余白を取る。 */
:is(.entry-content, [class*="wp-block-post-content"]) .wp-block-shortcode { margin-block: clamp(24px, 4vw, 40px); }
/* 縦並びラジオ（[radio* foo class:is-vertical ...]）：オプション 1 件ずつ改行表示。 */
.wpcf7-form .wpcf7-form-control.is-vertical .wpcf7-list-item { display: block; margin: 0 0 10px; }
.wpcf7-form .wpcf7-form-control.is-vertical .wpcf7-list-item:last-child { margin-bottom: 0; }
.wpcf7-form .wpcf7-form-control.is-vertical .wpcf7-list-item-label { display: inline; vertical-align: middle; }
.wpcf7-form .field { margin-bottom: 22px; }
/* ラベルは flex-wrap させて <br> や <small>（補足注記）が改行できるようにする（display:flex の
   既定だと <br> が flex アイテム扱いで改行されないため）。 */
.wpcf7-form label.field-label { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; margin-bottom: 8px; font-family: var(--wp--custom--brand-body); font-size: 13px; font-weight: 500; color: #000; letter-spacing: 0; }
.wpcf7-form label.field-label br { flex-basis: 100%; height: 0; }
.wpcf7-form label.field-label small { display: block; width: 100%; margin: 0; font-size: 11px; font-weight: 400; line-height: 1.6; color: var(--warm-grey, #6e6e6e); letter-spacing: 0; }
.wpcf7-form .required { display: inline-block; font-size: 10px; font-weight: 600; line-height: 1; padding: 3px 6px; background: var(--aureate); color: #fff; letter-spacing: 0.04em; border-radius: 2px; }
.wpcf7-form .optional { display: inline-block; font-size: 10px; font-weight: 500; line-height: 1; padding: 3px 6px; background: transparent; color: var(--warm-grey); border: 1px solid #d8d0cc; letter-spacing: 0.04em; border-radius: 2px; }
.wpcf7-form .wpcf7-form-control-wrap { display: block; }
.wpcf7-form input[type="text"], .wpcf7-form input[type="email"], .wpcf7-form input[type="tel"], .wpcf7-form input[type="date"], .wpcf7-form input[type="number"], .wpcf7-form textarea, .wpcf7-form select {
	width: 100%; box-sizing: border-box; padding: 12px 14px; font: inherit; font-size: 15px; line-height: 1.5; background: #fff; color: #000; border: 1px solid #d8d0cc; border-radius: 0; transition: border-color 0.15s, box-shadow 0.15s; font-family: var(--wp--custom--brand-body); appearance: none; -webkit-appearance: none;
}
.wpcf7-form input:focus, .wpcf7-form textarea:focus, .wpcf7-form select:focus { outline: 0; border-color: var(--aureate); box-shadow: 0 0 0 3px color-mix(in srgb, var(--aureate) 12%, transparent); }
/* iOS Safari の空 input[type=date] で高さが詰まる問題回避: 最小高さを line-height + padding + border で固定。 */
.wpcf7-form input[type="date"] { min-height: calc(1.5em + 26px); }
.wpcf7-form textarea { min-height: 140px; resize: vertical; }
.wpcf7-form .field-help { display: block; margin-top: 6px; font-family: var(--wp--custom--brand-body); font-size: 12px; color: var(--warm-grey); line-height: 1.5; }

/* プライバシーポリシー同意 */
.wpcf7-form .field-consent .wpcf7-list-item { margin: 0; }
.wpcf7-form .field-consent label { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; font-family: var(--wp--custom--brand-body); font-size: 13px; line-height: 1.6; color: #000; }
.wpcf7-form .field-consent input[type="checkbox"] { appearance: none; -webkit-appearance: none; width: 18px; height: 18px; margin: 2px 0 0; flex-shrink: 0; background: #fff; border: 1px solid #d8d0cc; border-radius: 2px; cursor: pointer; position: relative; transition: border-color 0.15s; }
.wpcf7-form .field-consent input[type="checkbox"]:checked { border-color: var(--aureate); }
.wpcf7-form .field-consent input[type="checkbox"]:checked::after { content: ""; position: absolute; left: 5px; top: 1px; width: 5px; height: 9px; border: solid var(--aureate); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.wpcf7-form .field-consent input[type="checkbox"]:focus-visible { outline: 2px solid var(--aureate); outline-offset: 2px; }
.wpcf7-form .field-consent a { color: var(--aureate); text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 1px; }

/* 送信（戻るは左・送信は中央） */
.wpcf7-form .form-submit { margin-top: 36px; display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: center; }
.wpcf7-form .button-back { font-family: var(--wp--custom--brand-body); font-weight: 500; font-size: 13px; color: var(--aureate); padding: 10px 0; background: transparent; cursor: pointer; transition: color 0.15s; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; justify-self: start; }
.wpcf7-form .button-back:hover { color: color-mix(in srgb, var(--aureate) 70%, #000); text-decoration: underline; text-underline-offset: 4px; }
.wpcf7-form .wpcf7-submit { grid-column: 2; font-family: var(--wp--custom--brand-body); font-weight: 700; font-size: 14px; letter-spacing: 0.02em; padding: 16px 48px; border: 0; cursor: pointer; background: var(--aureate); color: #fff; transition: background 0.2s; border-radius: 0; min-width: 240px; }
.wpcf7-form .wpcf7-submit:hover { background: color-mix(in srgb, var(--aureate) 80%, #000); }

/* 検証メッセージ・送信ステータス */
/* ラジオやセレクト等の inline 要素直下に span として挿入されるので、明示的に block にして
   ラジオ/テキストの右隣ではなくその下に表示する。 */
.wpcf7-form .wpcf7-not-valid-tip { display: block; font-family: var(--wp--custom--brand-body); font-size: 12px; color: #b3261e; margin-top: 6px; }
.wpcf7-form input[aria-invalid="true"], .wpcf7-form textarea[aria-invalid="true"] { border-color: #b3261e; }
.wpcf7-form .wpcf7-response-output { font-family: var(--wp--custom--brand-body); font-size: 13px; line-height: 1.6; margin: 24px 0 0; padding: 14px 18px; border-radius: 0; }
.wpcf7-form.init .wpcf7-response-output,
.wpcf7-form.resetting .wpcf7-response-output,
.wpcf7-form.submitting .wpcf7-response-output { display: none; }
.wpcf7-form.invalid .wpcf7-response-output,
.wpcf7-form.unaccepted .wpcf7-response-output,
.wpcf7-form.payment-required .wpcf7-response-output { border: 1px solid #c0392b; background: #fcecea; color: #9e271b; }
.wpcf7-form.sent .wpcf7-response-output { border: 1px solid var(--aureate); background: color-mix(in srgb, var(--aureate) 8%, #fff); color: var(--aureate); }
.wpcf7-form.spam .wpcf7-response-output,
.wpcf7-form.failed .wpcf7-response-output,
.wpcf7-form.aborted .wpcf7-response-output { border: 1px solid #c0392b; background: #fcecea; color: #9e271b; }

@media (max-width: 520px) {
	.wpcf7-form .form-submit { grid-template-columns: 1fr; gap: 16px; }
	.wpcf7-form .button-back { justify-self: start; }
	.wpcf7-form .wpcf7-submit { grid-column: 1; width: 100%; min-width: 0; }
}