/* ==========================================================================
   お問い合わせフォームの補助表示と、受付完了ページ（/thanks/）のデザイン
   ・フォームか受付番号のブロックがあるページだけで読み込みます（テーマに依存しません）。
   ・色は実家安心サポートLPと同じブランドカラー：オレンジ #F59E42（文字用 #B8530C）、淡い水色 #D9EFF8・#F1F8FB、紺 #213D52、本文 #263746
   ========================================================================== */

/* ---------- フォームの補助表示 ---------- */
.tr-form__hint { margin: 6px 0 0; font-size: .88rem; font-weight: 700; color: #8A4B0A; background: #FFF6EA; border-radius: 6px; padding: 6px 10px; }
.tr-form__hint[hidden], .tr-form__row[hidden] { display: none !important; }
.tr-form button[disabled] { opacity: .7; cursor: wait; }

/* ---------- 受付番号と確認メールの案内 ---------- */
.tr-receipt { background: #F1F8FB; border: 1.5px solid #BFDDEE; border-radius: 16px; padding: 20px 22px; text-align: center; margin: 24px 0; }
.tr-receipt > * { margin: 0; }
.tr-receipt__label { display: inline-block; background: #213D52; color: #fff; font-weight: 800; font-size: .88rem; letter-spacing: .08em; padding: .2em 1em; border-radius: 999px; }
.tr-receipt__no { margin-top: .35em !important; font-size: clamp(1.15rem, 6.2vw, 2.2rem); font-weight: 800; letter-spacing: .02em; color: #B8530C; font-feature-settings: "palt"; line-height: 1.3; white-space: nowrap; }
.tr-receipt__mail { margin-top: .7em !important; padding-top: .7em; border-top: 1px dashed #BFDDEE; font-size: .98rem; line-height: 1.8; color: #263746; font-weight: 600; text-align: left; }
.tr-receipt--warn { background: #FFF6EA; border-color: #F0C98F; }
.tr-receipt--warn .tr-receipt__mail { border-top-color: #F0C98F; color: #7A3608; }
.tr-receipt--none { background: #fff; }
.tr-receipt--none .tr-receipt__mail { border-top: 0; padding-top: 0; margin-top: 0 !important; font-weight: 400; text-align: center; }

/* ---------- 受付完了ページ ---------- */
.trf-thanks { margin-block: 0 !important; padding: clamp(32px, 6vw, 72px) 16px clamp(48px, 8vw, 96px) !important; color: #263746; font-weight: 400;
	background: radial-gradient(620px 520px at 94% -14%, rgba(255, 200, 130, .38), rgba(255, 200, 130, 0) 62%), radial-gradient(520px 380px at -8% 104%, rgba(217, 239, 248, .8), rgba(217, 239, 248, 0) 70%), linear-gradient(170deg, #FFF7EE 0%, #FBF8F2 55%, #FFFFFF 100%); }
.trf-card { background: #fff; border-radius: 20px; padding: clamp(24px, 5vw, 48px) clamp(18px, 5vw, 48px) !important; box-shadow: 0 30px 60px -40px rgba(38, 55, 70, .45), 0 0 0 1px rgba(38, 121, 168, .08); position: relative; overflow: hidden; }
.trf-card::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 5px; background: linear-gradient(90deg, #F59E42, #8CC8E6); }
.trf-card > * { margin-top: 0; }
.trf-card p, .trf-card li { line-height: 1.9; }
.trf-kicker { display: inline-block; font-size: .85rem; font-weight: 700; color: #213D52; background: #D9EFF8; padding: .25em 1em; border-radius: 999px; margin-bottom: .8em !important; }
.trf-card h1.trf-title { color: #213D52; font-size: clamp(1.55rem, 4.6vw, 2.2rem); line-height: 1.45; margin: 0 0 .5em; word-break: auto-phrase; }
.trf-lead { font-size: 1.02rem; }
.trf-card h2.trf-h2 { color: #213D52; font-size: clamp(1.15rem, 3.2vw, 1.35rem); margin: 2em 0 .7em; padding-left: .7em; border-left: 4px solid #F59E42; line-height: 1.5; }
.trf-notice { background: #FFF6EA; border-radius: 12px; padding: 14px 18px !important; border-left: 4px solid #F59E42; }
.trf-notice > * { margin: .2em 0 !important; }
.trf-notice strong { color: #7A3608; }
.trf-steps { list-style: none; padding: 0 !important; margin: 0; counter-reset: trf; display: grid; gap: 10px; }
.trf-steps > li { counter-increment: trf; position: relative; margin: 0; background: #F1F8FB; border-radius: 14px; padding: 14px 16px 14px 62px; }
.trf-steps > li::before { content: counter(trf, decimal-leading-zero); position: absolute; left: 16px; top: 13px; font-size: 1.35rem; font-weight: 800; color: #B8530C; line-height: 1.3; }
.trf-steps strong { display: block; color: #213D52; }
.trf-list { padding-left: 1.3em !important; }
.trf-list li { margin: .3em 0; }
.trf-contact { border: 1px solid #DCE6EC; border-radius: 12px; padding: 14px 18px !important; margin-top: 1em !important; font-size: .95rem; }
.trf-contact > * { margin: .15em 0 !important; }
.trf-contact a { color: #1D5E85; font-weight: 700; }
.trf-btns { margin-top: 2em !important; gap: 12px; justify-content: center; }
.trf-btns .wp-block-button__link { border-radius: 999px !important; font-weight: 700; padding: .95em 2em; }
.trf-btn-main .wp-block-button__link { background: #2679A8; color: #fff; }
.trf-btn-main .wp-block-button__link:hover { background: #213D52; }
.trf-btn-sub .wp-block-button__link { background: #fff; color: #B8530C; border: 2px solid #B8530C; }
@media (max-width: 599px) {
	.trf-btns { flex-direction: column; align-items: stretch; }
	.trf-btns .wp-block-button, .trf-btns .wp-block-button__link { width: 100%; text-align: center; box-sizing: border-box; }
	.trf-steps > li { padding-left: 54px; }
	.trf-steps > li::before { left: 14px; }
}
