/* ============================================================
   PRESENCE IMPACT お問い合わせ／資料ダウンロード 共通スタイル
   株式会社プレゼンス・メディカル

   無料診断フォーム（camp-shindan/index.html）と同じ拠り所です。
   ・ご提案書 Vol.19 表紙・p21〜23
   ・余白 → 装飾英字の階層 → 1px罫線 → 最小限の動き
   ・角丸は 8〜10px 固定。影は薄く。グラデーションはゴールドのみ

   ★色とフォントの値は診断フォームから写しています。
     片方だけ変えると見た目がずれます。変えるときは両方を直してください。
   ============================================================ */

:root{
  --navy-900:#0B1E38;
  --navy-800:#0E2340;
  --navy-700:#12304F;
  --navy-600:#1B4570;
  --gold-500:#C9A227;
  --gold-600:#B08A20;
  --cream:#F7F1DF;
  --cream-line:#E6D9AE;
  --ink:#132132;
  --ink-2:#41526A;
  --ink-3:#66778E;
  --line:#DDE4EC;
  --bg:#F4F7FB;
  --danger:#B3261E;
  --ok:#1E7A4B;
  --font: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif;
}

*{box-sizing:border-box;}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--font);font-size:16px;line-height:1.8;
  -webkit-text-size-adjust:100%;
}
.wrap{max-width:760px;margin:0 auto;padding:0 20px 80px;}

/* ---- ヘッダー ---- */
.bar{background:var(--navy-800);color:#fff;padding:14px 0;}
.bar .wrap{padding-bottom:0;display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.bar .name{font-size:13px;letter-spacing:.14em;}
.bar .sep{width:1px;height:14px;background:rgba(255,255,255,.3);}
.bar .svc{font-size:13px;color:var(--gold-500);letter-spacing:.10em;font-weight:600;}

.hero{
  background:linear-gradient(180deg,var(--navy-800),var(--navy-900));
  color:#fff;padding:46px 0 40px;
}
.hero .rule{width:60px;height:3px;background:var(--gold-500);margin-bottom:20px;}
.hero .eyebrow{
  font-size:11px;letter-spacing:.28em;color:var(--gold-500);
  text-transform:uppercase;margin-bottom:12px;
}
.hero h1{font-size:26px;line-height:1.5;margin:0 0 14px;font-weight:700;}
.hero p{margin:0;color:#C7D3E2;font-size:14.5px;}

/* ---- カード ---- */
.card{
  background:#fff;border:1px solid var(--line);border-radius:10px;
  padding:28px 26px;margin-top:26px;
}
.card h2{
  font-size:17px;margin:0 0 4px;font-weight:700;color:var(--navy-800);
}
.card .lead{margin:0 0 22px;color:var(--ink-2);font-size:14px;}

/* ---- 入力欄 ---- */
.fields{display:grid;grid-template-columns:1fr 1fr;gap:18px 20px;}
.field.wide{grid-column:1 / -1;}
@media(max-width:640px){ .fields{grid-template-columns:1fr;} }

label{display:block;font-size:13.5px;font-weight:600;margin-bottom:7px;color:var(--navy-700);}
.req,.opt{
  display:inline-block;margin-left:8px;padding:1px 7px;border-radius:3px;
  font-size:10.5px;font-weight:700;letter-spacing:.06em;vertical-align:1px;
}
.req{background:var(--navy-700);color:#fff;}
.opt{background:#EDF1F6;color:var(--ink-3);}

input[type=text],input[type=email],input[type=tel],select,textarea{
  width:100%;padding:12px 13px;border:1px solid var(--line);border-radius:8px;
  font-family:var(--font);font-size:15.5px;color:var(--ink);background:#fff;
  transition:border-color .15s, box-shadow .15s;
}
textarea{min-height:150px;resize:vertical;line-height:1.75;}
select{appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2366778E' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;padding-right:36px;}
input:focus,select:focus,textarea:focus{
  outline:none;border-color:var(--navy-600);box-shadow:0 0 0 3px rgba(27,69,112,.12);
}
.hint{margin:6px 0 0;font-size:12.5px;color:var(--ink-3);}
.err{margin:6px 0 0;font-size:12.5px;color:var(--danger);display:none;}
.field.bad input,.field.bad select,.field.bad textarea{border-color:var(--danger);}
.field.bad .err{display:block;}

/* ---- ボタン ---- */
.actions{margin-top:26px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
.btn{
  border:0;border-radius:8px;font-family:var(--font);font-weight:700;
  cursor:pointer;letter-spacing:.04em;transition:background .15s, opacity .15s;
}
.btn-gold{
  background:linear-gradient(180deg,var(--gold-500),var(--gold-600));
  color:var(--navy-900);font-size:16px;padding:15px 38px;
}
.btn-gold:hover{background:linear-gradient(180deg,#D6AF2F,var(--gold-500));}
.btn-gold[disabled]{opacity:.55;cursor:default;}
.state{font-size:13.5px;color:var(--ink-2);}
.state.bad{color:var(--danger);font-weight:600;}
.state.good{color:var(--ok);font-weight:600;}

/* ---- 送信後 ---- */
.done{display:none;}
.done.on{display:block;}
.form-area.off{display:none;}
.done .mark{
  width:52px;height:52px;border-radius:50%;background:var(--cream);
  border:1px solid var(--cream-line);display:flex;align-items:center;justify-content:center;
  margin-bottom:18px;
}
.done .mark svg{display:block;}
.done h2{font-size:20px;margin:0 0 10px;}
.done p{margin:0 0 12px;color:var(--ink-2);font-size:14.5px;}
.dl{
  display:inline-block;margin-top:6px;padding:15px 34px;border-radius:8px;
  background:linear-gradient(180deg,var(--gold-500),var(--gold-600));
  color:var(--navy-900);font-weight:700;text-decoration:none;font-size:16px;
}
.dl:hover{background:linear-gradient(180deg,#D6AF2F,var(--gold-500));}

/* ---- 個人情報の扱い ---- */
.privacy{
  margin-top:22px;padding:16px 18px;background:#EEF2F7;
  border-radius:8px;font-size:12.5px;color:var(--ink-2);line-height:1.75;
}
.privacy a{color:var(--navy-600);}

footer{
  margin-top:44px;padding-top:22px;border-top:1px solid var(--line);
  font-size:12.5px;color:var(--ink-3);text-align:center;
}
