/* お問い合わせフォーム（現行ページの Elementor カスタムCSSをそのまま移植） */
/* ============================================
   HIROMU GARAGE | Contact Form 7 custom style
   ============================================ */
.hg-contact{
  --hg-red:#e60012;
  --hg-red-bright:#ff2a2a;
  --hg-field:rgba(255,255,255,.04);
  --hg-border:rgba(255,255,255,.14);
  --hg-muted:rgba(255,255,255,.35);
  max-width:640px;
  margin:0 auto;
  color:#f2f2f2;
  font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP","Helvetica Neue",Arial,sans-serif;
}
.hg-contact .hg-row{margin-bottom:26px;}
.hg-contact label{display:block;}
.hg-contact fieldset{border:0;margin:0;padding:0;}
.hg-contact legend{padding:0;width:100%;}

/* 項目名 */
.hg-ttl,
.hg-contact legend label{
  display:flex;align-items:center;gap:10px;
  margin-bottom:10px;
  font-size:14px;font-weight:700;letter-spacing:.06em;
}
/* 必須バッジ */
.hg-req{
  display:inline-block;background:var(--hg-red);color:#fff;
  font-size:10px;font-weight:700;line-height:1;
  padding:4px 7px;border-radius:3px;letter-spacing:.12em;
}

/* 入力欄 */
.hg-contact input[type="text"],
.hg-contact input[type="email"],
.hg-contact input[type="tel"],
.hg-contact select,
.hg-contact textarea{
  width:100%;box-sizing:border-box;
  background:var(--hg-field);
  border:1px solid var(--hg-border);
  border-radius:8px;color:#fff;
  font-size:16px;line-height:1.5;padding:14px 16px;
  -webkit-appearance:none;appearance:none;
  transition:border-color .2s,background .2s,box-shadow .2s;
}
.hg-contact textarea{min-height:150px;resize:vertical;}
.hg-contact input::placeholder,
.hg-contact textarea::placeholder{color:var(--hg-muted);}
.hg-contact input:focus,
.hg-contact select:focus,
.hg-contact textarea:focus{
  outline:none;border-color:var(--hg-red);
  background:rgba(230,0,18,.06);
  box-shadow:0 0 0 3px rgba(230,0,18,.18);
}
/* セレクトの矢印 */
.hg-contact select{
  background-image:
    linear-gradient(45deg,transparent 50%,var(--hg-red) 50%),
    linear-gradient(135deg,var(--hg-red) 50%,transparent 50%);
  background-position:calc(100% - 20px) center,calc(100% - 15px) center;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;
  padding-right:42px;cursor:pointer;
}
.hg-contact select option{background:#1a1a1a;color:#fff;}

/* プライバシー同意 */
.hg-privacy{text-align:center;font-size:14px;color:#cfcfcf;}
.hg-privacy a{color:var(--hg-red-bright);text-decoration:underline;}
.hg-privacy .wpcf7-list-item{margin:0;}

/* 送信（＝確認）ボタン */
.hg-btns{margin-top:34px;text-align:center;}
.hg-contact input.wpcf7-submit{
  -webkit-appearance:none;appearance:none;cursor:pointer;
  min-width:240px;padding:16px 40px;border:none;border-radius:8px;
  background:var(--hg-red);color:#fff;
  font-size:16px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;
  box-shadow:0 8px 24px rgba(230,0,18,.35);
  transition:transform .15s,background .2s,box-shadow .2s;
}
.hg-contact input.wpcf7-submit:hover{
  background:var(--hg-red-bright);transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(230,0,18,.45);
}
.hg-contact input.wpcf7-submit:active{transform:translateY(0);}
.hg-contact .wpcf7-spinner{display:block;margin:14px auto 0;}

/* バリデーション・メッセージ */
.hg-contact .wpcf7-not-valid-tip{color:#ff6b6b;font-size:12.5px;margin-top:6px;}
.hg-contact .wpcf7-not-valid{
  border-color:#ff3b3b !important;
  box-shadow:0 0 0 3px rgba(255,59,59,.18) !important;
}
.wpcf7 .wpcf7-response-output{
  max-width:640px;margin:24px auto 0;
  border-width:1px;border-radius:8px;padding:14px 18px;
  font-size:14px;text-align:center;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output{
  border-color:#ff3b3b;color:#ff8a8a;background:rgba(255,59,59,.08);
}
.wpcf7 form.sent .wpcf7-response-output{
  border-color:#22c55e;color:#7ee2a4;background:rgba(34,197,94,.08);
}

/* ============================================
   確認画面（Confirm Plus）#wpcf7cpcnf
   ============================================ */
#wpcf7cpcnf{
  background:#141414 !important;color:#f2f2f2 !important;
  border:1px solid rgba(255,255,255,.14) !important;
  border-top:4px solid #e60012 !important;
  border-radius:10px !important;padding:28px !important;
  box-shadow:0 20px 60px rgba(0,0,0,.6) !important;
}
#wpcf7cpcnf table{width:100% !important;border-collapse:collapse !important;}
#wpcf7cpcnf th,#wpcf7cpcnf td{
  text-align:left !important;padding:14px 12px !important;
  border-bottom:1px solid rgba(255,255,255,.08) !important;
  vertical-align:top !important;font-size:15px !important;
}
#wpcf7cpcnf th{width:34% !important;color:#ff2a2a !important;font-weight:700 !important;white-space:nowrap !important;}
#wpcf7cpcnf td{color:#fff !important;word-break:break-all !important;}
/* 確認画面のボタン（この内容で送信する／修正） */
#wpcf7cpcnf input[type="button"],
#wpcf7cpcnf button,
#wpcf7cpcnf input.wpcf7-submit{
  cursor:pointer;min-width:160px;margin:18px 8px 0;
  padding:14px 28px;border-radius:8px;
  font-size:15px;font-weight:700;letter-spacing:.08em;border:none;
  transition:transform .15s,opacity .2s;
}
#wpcf7cpcnf input.wpcf7-submit{background:#e60012;color:#fff;box-shadow:0 8px 24px rgba(230,0,18,.35);}
#wpcf7cpcnf input.wpcf7-submit:hover{background:#ff2a2a;transform:translateY(-2px);}
#wpcf7cpcnf input[type="button"],#wpcf7cpcnf button{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.14);}
#wpcf7cpcnf input[type="button"]:hover,#wpcf7cpcnf button:hover{border-color:#fff;}

/* スマホ対応 */
@media (max-width:600px){
  .hg-contact input.wpcf7-submit{width:100%;min-width:0;}
  #wpcf7cpcnf{padding:18px !important;}
  #wpcf7cpcnf th,#wpcf7cpcnf td{display:block !important;width:100% !important;}
  #wpcf7cpcnf th{border-bottom:none !important;padding-bottom:0 !important;}
}
