/* The consultation stays legible at 320 px and uses native form controls. */
.contact-wrap{max-width:1120px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);grid-template-areas:"side main";gap:clamp(24px,5vw,72px);align-items:start}
.contact-side{grid-area:side;min-width:0;display:grid;gap:28px;align-content:start}
.contact-aside{min-width:0}
.contact-channels{margin-top:0;gap:10px}
.contact-channels a{padding:16px;min-width:0}
.contact-channels b{font-size:clamp(.78rem,1.3vw,.95rem);overflow-wrap:anywhere}
.contact-wizard{min-width:0;padding:clamp(20px,3vw,36px);border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,#fffdf9,#f5f0e8);box-shadow:0 18px 60px rgba(48,35,27,.05);scroll-margin-top:92px}
.wizard-badge{font-size:.65rem;letter-spacing:.16em;color:#795b2a;margin:0 0 22px;font-weight:700}
.wizard-title{font-family:var(--f-serif-jp);font-size:clamp(1.25rem,2vw,1.65rem);font-weight:500;line-height:1.7;margin:0 0 20px;outline-offset:6px}
.contact-wizard p{line-height:1.9}
.contact-wizard .wizard-note{font-size:.78rem;color:#615b53;line-height:1.8;margin:16px 0}
.wizard-top{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.75rem;color:var(--ink-3)}
.contact-wizard progress{display:block;width:100%;height:3px;border:0;background:#e6ddd0;margin:12px 0 28px;accent-color:#967444}
.contact-wizard progress::-webkit-progress-bar{background:#e6ddd0}
.contact-wizard progress::-webkit-progress-value{background:#967444}
.contact-wizard progress::-moz-progress-bar{background:#967444}
.wizard-options{border:0;padding:0;margin:0;display:grid;gap:10px;min-width:0}
.wizard-option{display:flex;align-items:center;gap:12px;min-height:56px;padding:14px 16px;border:1px solid #d8cfc2;border-radius:14px;background:rgba(255,255,255,.7);cursor:pointer;font-size:.85rem;line-height:1.7;transition:border-color .15s,background .15s}
.wizard-option:has(input:checked){border-color:#967444;background:#f1e8d8;box-shadow:inset 0 0 0 1px #967444}
.wizard-option:has(input:focus-visible){outline:2px solid var(--lilac-d);outline-offset:3px}
.wizard-option input,.wizard-consent input{flex:0 0 18px;width:18px;height:18px;accent-color:#795b2a;margin:0}
.wizard-option span{min-width:0;overflow-wrap:anywhere}
.wizard-link{appearance:none;background:none;border:0;color:#6e4b2e;font:inherit;font-size:.78rem;text-decoration:underline;text-underline-offset:4px;padding:10px 2px;min-height:44px;cursor:pointer}
.wizard-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:24px}
.wizard-next{margin-left:auto}
.contact-wizard .btn{font-size:.83rem;min-height:48px;white-space:normal;text-align:center}
.contact-wizard button:disabled{opacity:.45;cursor:not-allowed}
.wizard-theme{font-family:var(--f-serif-jp);font-size:1.3rem;padding:24px 0;border-block:1px solid var(--line)}
.wizard-recommendation{padding:20px;border:1px solid #dac8a8;border-radius:14px;background:#faf4e8;margin-bottom:24px}
.wizard-recommendation .wizard-badge{margin-bottom:8px}
.wizard-recommendation h4{font-size:1rem;line-height:1.8;margin:0 0 12px}
.wizard-recommendation p{font-size:.83rem}
.wizard-summary{margin:0}
.wizard-summary>div{padding:12px 0;border-bottom:1px solid var(--line)}
.wizard-summary dt{font-size:.72rem;color:var(--ink-3);margin-bottom:5px}
.wizard-summary dd{margin:0;display:flex;align-items:start;gap:12px;justify-content:space-between;font-size:.83rem;line-height:1.8}
.wizard-summary dd>span{min-width:0}
.wizard-summary .wizard-link{flex:0 0 auto;max-width:100px;text-align:right;line-height:1.6;padding:0;font-size:.7rem}
.wizard-field{display:grid;gap:8px;margin-top:18px}
.wizard-field label{font-size:.78rem;font-weight:500}
.wizard-field input,.wizard-field select,.wizard-field textarea{width:100%;min-width:0;border:1px solid #cfc5b7;border-radius:10px;background:#fffdf9;padding:12px;font:inherit;font-size:16px;color:var(--ink);min-height:48px}
.wizard-field textarea{resize:vertical}
.wizard-field :focus-visible{outline:2px solid var(--lilac-d);outline-offset:3px}
.wizard-consent{display:flex;align-items:start;gap:12px;font-size:.76rem;line-height:1.9;margin-top:24px}
.wizard-consent input{margin-top:4px}
.wizard-consent a{color:#6e426f;text-decoration:underline;text-underline-offset:3px}
.wizard-error{color:#96362b;font-size:.82rem;margin:0}
.wizard-error:not(:empty){margin-top:20px;padding:12px;border-left:3px solid currentColor;background:#fff5f2}
.wizard-field-error{color:#96362b;font-size:.76rem;line-height:1.7;margin:0}
.wizard-field-error:empty{display:none}
.wizard-field [aria-invalid="true"]{border-color:#96362b;background:#fff9f6}
.contact-wizard .wizard-count{font-size:.72rem;margin:0;text-align:right}
#wizard-reconnect{display:block;margin-top:14px}
@media(max-width:980px){.contact-wrap{grid-template-columns:1fr;grid-template-areas:"aside" "main" "channels";gap:32px}.contact-side{display:contents}.contact-aside{grid-area:aside}.contact-channels{grid-area:channels}[data-scene] .contact-main,[data-scene] .contact-channels{width:100%;max-width:640px;margin:0}.contact-main .contact-wizard{width:100%}}
@media(max-width:760px){.contact-wizard{scroll-margin-top:84px}.wizard-actions{gap:16px}.wizard-next{flex:1;min-height:52px}.wizard-summary dd{display:block}.wizard-summary .wizard-link{display:block;max-width:none;text-align:left}.wizard-badge{font-size:.72rem;letter-spacing:.12em}}
@media(prefers-reduced-motion:reduce){.wizard-option{transition:none}}
/* 左の列は、長いフォームの横で追従させる（画面の高さが足りないときは追従しない）。 */
@media(min-width:981px) and (min-height:820px){.contact-side{position:sticky;top:104px}}
.contact-main{grid-area:main;min-width:0;display:grid;gap:24px}
.quick-form{min-width:0;padding:clamp(20px,3vw,36px);border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,#fffdf9,#f5f0e8);box-shadow:0 18px 60px rgba(48,35,27,.05);scroll-margin-top:92px}
.quick-form p{line-height:1.9;overflow-wrap:anywhere}
.quick-form .wizard-note{font-size:.78rem;color:#615b53;line-height:1.8;margin:16px 0}
.quick-lead strong{font-weight:700}
.quick-opt{color:var(--ink-3);font-weight:400}
/* 入力欄の枠は、地との明暗差が1.68:1しか無く、部品の境界に求められる3:1に届かなかった（2026-10-29の採点）。既存のトークン --ink-3 は5.76:1。誤りのときの赤茶は別の規則が決める。 */
.quick-form .wizard-field :is(input,select,textarea):not([aria-invalid="true"]){border-color:var(--ink-3)}
.quick-form select:required:invalid{color:#757575}
.quick-form select option{color:var(--ink)}
/* WebKitの標準の選択欄は min-height を無視して23pxになる。矢印をグラデーションで描き、高さを保証する。 */
.quick-form select{--arrow:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);appearance:none;-webkit-appearance:none;padding-right:44px;background-image:var(--arrow);background-repeat:no-repeat;background-position:calc(100% - 22px) 50%,calc(100% - 16px) 50%;background-size:6px 6px,6px 6px}
.quick-form select[aria-invalid="true"]{background-image:var(--arrow);background-repeat:no-repeat;background-position:calc(100% - 22px) 50%,calc(100% - 16px) 50%;background-size:6px 6px,6px 6px}
.quick-form .btn{display:flex;justify-content:center;width:100%;min-height:52px;font-size:.83rem;white-space:normal;text-align:center;margin-top:20px}
.quick-form .wizard-link{width:auto}
.quick-form button:disabled{opacity:.45;cursor:not-allowed}
.quick-form .wizard-error:not(:empty){border-radius:10px;border-left:0;box-shadow:inset 3px 0 0 currentColor}
.quick-form #quick-security{margin-top:20px}
/* 同意の箱: 標準の灰色は暖色の枠と合わず、誤りも伝わらなかった。押せる範囲は label 全体（48px以上）。 */
.quick-form .wizard-consent{min-height:48px;align-items:flex-start}
.quick-form .wizard-consent small{font-size:inherit;line-height:inherit}
.quick-form .wizard-consent input{appearance:none;-webkit-appearance:none;flex:0 0 22px;width:22px;height:22px;margin:0;border:1.5px solid var(--ink-3);border-radius:6px;background:#fffdf9;display:grid;place-content:center;cursor:pointer}
.quick-form .wizard-consent input::after{content:"";width:6px;height:11px;border:solid #fffdf9;border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-1px);opacity:0}
.quick-form .wizard-consent input:checked{background:var(--ink);border-color:var(--ink)}
.quick-form .wizard-consent input:checked::after{opacity:1}
.quick-form .wizard-consent input[aria-invalid="true"]{border-color:#96362b}
.quick-form .wizard-consent input:focus-visible{outline:2px solid var(--lilac-d);outline-offset:3px}
.quick-form #quick-consent-error{margin-top:8px}
.quick-form #quick-challenge-status{margin:8px 0 0}
.quick-form #quick-receipt{overflow-wrap:anywhere}
.quick-form [hidden]{display:none}
.quick-assure{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:18px 0 0}
.quick-assure li{padding:3px 12px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.55);font-size:.72rem;line-height:1.8;color:var(--ink-3);white-space:nowrap}
.contact-main:has(#contact-wizard[data-state="active"],#contact-wizard[data-state="done"]) .quick-form{display:none}
/* 相談メモが待機中のあいだは副の扱い: 影を消し、見出しを小さくし、入口のボタンは塗りをやめて枠だけにする。文字の左端は短いフォームとそろえる。 */
#contact-wizard[data-state="idle"]{box-shadow:none;padding:20px clamp(20px,3vw,36px)}
#contact-wizard[data-state="idle"] .wizard-title{font-size:clamp(1.05rem,1.6vw,1.2rem);margin-bottom:12px}
.contact-main #wizard-start{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink-3)}
.contact-main #wizard-start:hover:not(:disabled){background:var(--paper-3);color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);transform:none}
