/* Contact: generated hover + responsive vars */
.page-contact{--rv-cCols:minmax(0,0.75fr) minmax(0,1.25fr);--rv-asideOrder:0;--rv-asidePos:sticky}
@media (max-width:1099.98px){.page-contact{--rv-cCols:minmax(0,1fr);--rv-asideOrder:2;--rv-asidePos:static}}

@media (hover:hover){
  .hv-contact-1:hover{color:var(--gold-light) !important}
  .hv-contact-2:hover{background:rgba(201,169,110,0.12) !important;color:var(--gold-light) !important}
  .hv-contact-3:hover{background:rgba(201,169,110,0.08) !important;color:var(--paper) !important}
  .hv-contact-4:hover,.hv-contact-6:hover,.hv-contact-8:hover{background-position:0% 0 !important;color:#0B1026 !important}
  .hv-contact-5:hover,.hv-contact-7:hover{color:var(--text) !important}
}
.hv-contact-1:focus-visible{color:var(--gold-light) !important}
.hv-contact-2:focus-visible{background:rgba(201,169,110,0.12) !important;color:var(--gold-light) !important}
.hv-contact-3:focus-visible{background:rgba(201,169,110,0.08) !important;color:var(--paper) !important}
.hv-contact-4:focus-visible{background-position:0% 0 !important}
.hv-contact-5:focus-visible{color:var(--text) !important}
.hv-contact-6:focus-visible{background-position:0% 0 !important}
.hv-contact-7:focus-visible{color:var(--text) !important}
.hv-contact-8:focus-visible{background-position:0% 0 !important}

/* ---------- フォーム共通パーツ ---------- */
.contact-form{scroll-margin-top:96px}
.contact-form [hidden]{display:none !important}

/* ハニーポット（視覚的にも支援技術からも隠す） */
.cf-hp{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* 必須・任意バッジ（C-9: 12px） */
.cf-badge{font-size:12px;font-weight:400;line-height:1.5;padding:1px 8px;border-radius:3px;letter-spacing:0.06em;white-space:nowrap}
.cf-badge--req{background:#0B1026;color:#F7F5F0}
.cf-badge--opt{border:1px solid rgba(26,26,31,0.24);color:var(--text-muted)}

/* 入力欄（C-2） */
.cf-input{display:block;width:100%;height:60px;padding:0 56px 0 18px;border-radius:8px;border:1px solid var(--line-input);background:#FFFFFF;font:inherit;font-size:17px;color:var(--text);outline:none;transition:border-color 0.3s, box-shadow 0.3s;-webkit-appearance:none;appearance:none}
.cf-input::placeholder{color:#8A8A93;opacity:1}
.cf-input:focus{border-color:var(--focus);box-shadow:0 0 0 3px rgba(126,99,52,0.28)}
.cf-textarea{height:auto;min-height:168px;padding:16px 18px;font-size:16px;line-height:1.8;resize:vertical}
.cf-select{cursor:pointer}
.cf-select__arrow{position:absolute;right:22px;top:50%;margin-top:-6px;width:8px;height:8px;border-right:1px solid var(--text-muted);border-bottom:1px solid var(--text-muted);transform:rotate(45deg);pointer-events:none}
.cf-field.is-ok .cf-select__arrow{display:none}
.cf-field.is-error .cf-input{border-color:#B3422E}
.cf-field.is-ok .cf-input{border-color:#3F8F5F}
.cf-field.is-error .cf-input:focus{box-shadow:0 0 0 3px rgba(179,66,46,0.22)}

/* ✓表示 */
.cf-ok{display:none;position:absolute;right:16px;top:50%;margin-top:-12px;width:24px;height:24px;border-radius:50%;background:#3F8F5F;align-items:center;justify-content:center;pointer-events:none}
.cf-ok > span{width:6px;height:11px;margin-top:-3px;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(45deg)}
.cf-field.is-ok .cf-ok{display:flex}

/* エラー文 */
.cf-err{margin:10px 0 0;display:flex;align-items:center;gap:8px;font-size:13px;line-height:1.6;color:#B3422E}
.cf-err__icon{flex:none;width:16px;height:16px;border-radius:50%;background:#B3422E;color:#fff;font-family:Inter,sans-serif;font-size:11px;font-weight:600;display:inline-flex;align-items:center;justify-content:center}

/* サーバー側エラー */
.cf-server-err{margin:0 0 clamp(28px,3.4vw,40px);padding:20px 22px;border-radius:8px;border:1px solid #B3422E;background:#FBF1EE;color:#7A2618;outline:none}
.cf-server-err:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.cf-server-err__title{margin:0;display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700;color:#B3422E}
.cf-server-err__text{margin:10px 0 0;font-size:15px;line-height:1.8}
.cf-server-err__list{margin:6px 0 0;padding-left:1.4em;font-size:15px;line-height:1.9}

/* 選択（ネイティブ radio + label: C-1） */
.cf-choice{position:relative;display:block}
span.cf-choice{display:inline-block}
.cf-radio{position:absolute;top:0;left:0;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}

.cf-card{position:relative;text-align:left;cursor:pointer;min-height:88px;height:100%;padding:18px 48px 18px 20px;border-radius:8px;background:#FFFFFF;border:1px solid rgba(26,26,31,0.16);color:var(--text);transition:background 0.3s, border-color 0.3s;display:flex;flex-direction:column;gap:6px}
.cf-card__dot{position:absolute;right:18px;top:20px;width:20px;height:20px;border-radius:50%;border:1px solid var(--line-input);background:#FFFFFF;box-shadow:inset 0 0 0 4px #FFFFFF;transition:background 0.3s, border-color 0.3s, box-shadow 0.3s}
.cf-field.is-error .cf-card{border-color:#B3422E}
.cf-radio:checked + .cf-card{background:#F3ECDD;border-color:#7E6334}
.cf-radio:checked + .cf-card .cf-card__dot{border-color:#7E6334;background:#7E6334;box-shadow:inset 0 0 0 4px #F3ECDD}
.cf-radio:focus-visible + .cf-card,
.cf-radio:focus-visible + .cf-pill{outline:2px solid var(--focus);outline-offset:2px}
@media (hover:hover){
  .cf-radio:not(:checked) + .cf-card:hover{border-color:var(--line-input)}
  .cf-radio:not(:checked) + .cf-pill:hover{border-color:#0B1026}
}

.cf-pill{display:inline-flex;align-items:center;white-space:nowrap;min-height:52px;padding:0 22px;border-radius:999px;cursor:pointer;font-size:15px;background:#FFFFFF;color:#1A1A1F;border:1px solid var(--line-input);transition:background 0.3s, color 0.3s, border-color 0.3s}
.cf-radio:checked + .cf-pill{background:#0B1026;color:#F7F5F0;border-color:#0B1026}

/* 同意欄 */
.cf-agree{border:1px solid rgba(26,26,31,0.12);transition:border-color 0.3s}
.cf-agree.is-ok{border-color:#3F8F5F}
.cf-agree.is-error{border-color:#B3422E}
.cf-check:focus-visible{outline:2px solid var(--focus);outline-offset:2px}

/* 入力内容のまとめ（C-4） */
.cf-summary{margin-top:32px;padding:4px 20px;border-radius:8px;background:#FFFFFF;border:1px solid rgba(26,26,31,0.12)}
.cf-summary__title{padding:16px 0 4px;font-size:15px;font-weight:500}
.cf-summary__group{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid rgba(26,26,31,0.1)}
.cf-summary__title + .cf-summary__group{border-top:none}
.cf-summary__list{flex:1;min-width:0;margin:0;display:flex;flex-direction:column;gap:6px}
.cf-summary__list > div{display:grid;grid-template-columns:7.5em minmax(0,1fr);gap:12px;font-size:14px;line-height:1.7}
.cf-summary__list dt{color:var(--text-muted)}
.cf-summary__list dd{margin:0;overflow-wrap:anywhere}
.cf-summary__list dd.is-empty{color:var(--text-muted)}
.cf-edit{flex:none;display:inline-flex;align-items:center;min-height:44px;margin:-10px 0;padding:0 4px;border:none;background:none;cursor:pointer;font:inherit;font-size:14px;color:var(--gold-deep);text-decoration:underline;text-underline-offset:3px}
@media (hover:hover){ .cf-edit:hover{color:var(--text)} }
.cf-edit:focus-visible{color:var(--text);outline:2px solid var(--focus);outline-offset:2px}

/* 進捗 */
.cf-prog-label{color:#6B6B75;transition:color 0.4s}
.cf-prog-label.is-reached{color:#7E6334}

/* ---------- ステップ表示（JS有効時のみ。JS無効時は全ステップを縦に表示） ---------- */
.contact-form:not(.is-stepped) .cf-progress,
.contact-form:not(.is-stepped) [data-nav-row],
.contact-form:not(.is-stepped) [data-nav="back"]{display:none !important}
.contact-form:not(.is-stepped) .contact-step + .contact-step{margin-top:40px;padding-top:40px;border-top:1px solid rgba(26,26,31,0.1)}
.contact-form.is-stepped .contact-step[hidden]{display:none !important}
.contact-form.is-stepped:not(.is-ready) .contact-step:not([data-step="1"]){display:none}
[data-step-heading]:focus{outline:none}

.cf-btn-primary[disabled]{opacity:0.7;cursor:progress}

/* ボタン行（C-3: 600px未満は縦積み、主ボタンは幅100%、「戻る」は下に） */
@media (max-width:599.98px){
  .cf-actions{flex-direction:column-reverse;align-items:stretch !important;gap:8px !important}
  .cf-actions .cf-btn-primary{width:100%;margin-left:0 !important}
  .cf-actions .cf-btn-back{height:48px !important;justify-content:center}
  .cf-summary{padding:4px 16px}
  .cf-summary__list > div{grid-template-columns:minmax(0,1fr);gap:0}
}
