/* ============================================================
   J-DIO お問い合わせフォーム v1.0.0
   テーマ側の濃紺基調に合わせる。色はテーマのCSS変数を使い、
   単体で使われた場合のフォールバックも書いておく。
   ============================================================ */
.jdiof{--f-line:var(--line,rgba(88,150,210,.24));
  --f-cyan:var(--cyan-l,#4FB4F5);
  --f-txt:var(--txt,#EAF1F9);
  --f-sub:var(--sub,#9DB4CE);
  --f-err:#F6796F;
  max-width:720px}

.jdiof-lead{font-size:13.5px;line-height:1.95;color:var(--f-txt);margin-bottom:22px}

.jdiof-alert{border:1px solid rgba(246,121,111,.55);background:rgba(246,121,111,.1);
  color:#FFD9D5;border-radius:8px;padding:12px 16px;font-size:13px;line-height:1.7;margin-bottom:20px}

.jdiof-row{margin-bottom:18px}
.jdiof-row label{display:flex;align-items:center;gap:9px;font-size:12.5px;font-weight:700;
  letter-spacing:.04em;color:var(--f-txt);margin-bottom:7px}
.jdiof-req{font-size:10px;font-weight:700;letter-spacing:.06em;color:#fff;
  background:#C0453C;border-radius:3px;padding:2px 7px}
.jdiof-any{font-size:10px;letter-spacing:.06em;color:var(--f-sub);
  border:1px solid var(--f-line);border-radius:3px;padding:1px 7px}

.jdiof input[type=text],.jdiof input[type=email],.jdiof input[type=tel],.jdiof textarea{
  width:100%;font:inherit;font-size:15px;color:var(--f-txt);
  background:rgba(4,16,31,.55);border:1px solid var(--f-line);border-radius:8px;
  padding:13px 15px;transition:border-color .18s,box-shadow .18s}
.jdiof textarea{line-height:1.85;resize:vertical;min-height:170px}
.jdiof input::placeholder,.jdiof textarea::placeholder{color:rgba(157,180,206,.6)}
.jdiof input:focus,.jdiof textarea:focus{outline:none;border-color:var(--f-cyan);
  box-shadow:0 0 0 3px rgba(79,180,245,.18)}

.jdiof-row.is-err input,.jdiof-row.is-err textarea{border-color:var(--f-err)}
.jdiof-err{display:block;margin-top:6px;font-size:12px;color:#FFC4BE}

/* ハニーポット：人には見えないが、読み上げ・タブ移動からも外す */
.jdiof-hp{position:absolute!important;width:1px;height:1px;overflow:hidden;
  clip:rect(1px,1px,1px,1px);white-space:nowrap}

.jdiof-note{font-size:11.5px;line-height:1.75;color:var(--f-sub);
  border-top:1px solid var(--f-line);padding-top:14px;margin:24px 0 20px}

.jdiof-send{margin:0}
.jdiof-btn{display:inline-flex;align-items:center;justify-content:center;
  min-width:220px;padding:15px 38px;border:0;border-radius:8px;cursor:pointer;
  font-size:15px;font-weight:700;letter-spacing:.1em;color:#fff;
  background:linear-gradient(100deg,#1F8FE0,#38B6F5);
  box-shadow:0 6px 20px rgba(31,143,224,.35);transition:.22s}
.jdiof-btn:hover{filter:brightness(1.08);transform:translateY(-2px);
  box-shadow:0 10px 26px rgba(31,143,224,.45)}
.jdiof-btn:active{transform:none}

/* 送信完了 */
.jdiof-done{border:1px solid rgba(79,180,245,.4);border-radius:12px;
  background:rgba(6,28,54,.6);padding:30px 28px;max-width:720px}
.jdiof-done-t{font-size:18px;font-weight:700;color:#fff;margin-bottom:12px;
  display:flex;align-items:center;gap:11px}
.jdiof-done-t::before{content:"";width:24px;height:24px;flex:none;border-radius:50%;
  background:#2E9E63 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12l5 5L20 6'/%3E%3C/svg%3E") center/15px no-repeat}
.jdiof-done-b{font-size:13.5px;line-height:1.95;color:var(--f-txt)}

@media(max-width:560px){
  .jdiof input[type=text],.jdiof input[type=email],.jdiof input[type=tel],.jdiof textarea{font-size:16px}
  .jdiof-btn{width:100%}
}
