/* =========================================================
   お問い合わせ（contact.php）ページ固有スタイル
   共通トークン・ヘッダー・フッター・ボタンは common.css を継承
   ========================================================= */

/* --- ページヒーロー（2カラム） --- */
.contact-hero{background:linear-gradient(160deg,var(--navy-950),var(--navy-800));color:#fff;padding:60px 0 52px}
.contact-hero .hero-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:48px;align-items:center}
.contact-hero .hero-text{min-width:0}.contact-hero .hero-visual{min-width:0}
.contact-hero .breadcrumbs{font-size:12px;color:#a9c2d6;margin-bottom:20px}
.contact-hero .breadcrumbs a{color:#cfe0ee}.contact-hero .breadcrumbs a:hover{color:#fff;text-decoration:underline}
.contact-hero .kicker{color:var(--accent-editorial-on-dark)}
.contact-hero h1{font-size:clamp(28px,4vw,42px);letter-spacing:.04em;margin:6px 0 16px;line-height:1.3}
.contact-hero .contact-lead{color:#dbe7f1;font-size:15px;line-height:2;margin:0}

/* --- 画像プレースホルダ枠 --- */
.img-frame{position:relative;border:2px dashed #b9cddb;border-radius:var(--radius);background:linear-gradient(135deg,var(--sky-50),#fff);display:grid;place-items:center;text-align:center;color:#8aa0b2;padding:28px;min-height:240px}
.img-frame .imgf-ico{opacity:.55;margin-bottom:10px;color:#7f97ab}
.img-frame strong{display:block;font-size:13px;color:#6d8398;font-weight:800;letter-spacing:.06em}
.img-frame small{display:block;font-size:11.5px;color:#9fb2c1;margin-top:5px}
.img-frame.wide{min-height:300px}
.img-frame.on-dark{border-color:rgba(255,255,255,.34);background:rgba(255,255,255,.05);color:#aec3d6}
.img-frame.on-dark .imgf-ico{color:#bcd3e6}
.img-frame.on-dark strong{color:#cfe0ee}.img-frame.on-dark small{color:#9fb8cc}

/* --- セクション枠 --- */
.contact-sec{padding:64px 0}
.contact-sec.alt{background:var(--sky-50)}
.contact-sec .sec-head{margin-bottom:28px}
.contact-sec .sec-head h2{font-size:clamp(22px,2.6vw,30px);letter-spacing:.04em;margin:6px 0 12px;color:var(--navy-900)}
.contact-sec .sec-copy{color:var(--muted);font-size:14.5px;line-height:2;margin:0}

/* --- 最優先の誘導ボックス（車両適合は会員店へ） --- */
.lead-notice{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;background:#fff;border:1px solid var(--line);border-left:4px solid var(--blue-600);border-radius:14px;box-shadow:var(--shadow);padding:22px 26px}
.lead-notice .ln-ico{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;color:#fff;background:linear-gradient(150deg,var(--blue-600),var(--navy-800))}
.lead-notice strong{display:block;font-size:15.5px;color:var(--navy-900);margin-bottom:5px}
.lead-notice p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.85}
.lead-notice .btn{white-space:nowrap}

/* --- 用件別 窓口カード --- */
.desk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.desk-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px 28px}
.desk-card .desk-ico{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;font-size:16px;font-weight:800;color:#fff;background:linear-gradient(150deg,var(--blue-600),var(--navy-800));margin-bottom:14px}
.desk-card h3{margin:0 0 8px;font-size:16px;color:var(--navy-900)}
.desk-card p{margin:0 0 16px;color:var(--muted);font-size:13.5px;line-height:1.85;flex:1}
.desk-card .text-link{display:inline-flex;align-items:center;gap:7px;color:var(--blue-600);font-weight:800;font-size:13.5px}
.desk-card .text-link:hover{text-decoration:underline}

/* --- 問い合わせ本体（フォーム＋補足） --- */
.contact-layout{display:grid;grid-template-columns:1.5fr 1fr;gap:34px;align-items:start}
.form-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:32px 34px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 20px}
.field{display:flex;flex-direction:column;min-width:0}
.field.full{grid-column:1 / -1}
.field label{font-size:13px;font-weight:700;color:var(--navy-900);margin-bottom:7px}
.field .req{color:#c0392b;font-size:11.5px;font-weight:800;margin-left:6px}
.field .opt{color:var(--muted);font-size:11px;font-weight:600;margin-left:6px}
.field input,.field select,.field textarea{border:1px solid #c9d9e2;border-radius:10px;padding:12px 14px;font-size:14px;font-family:inherit;color:var(--ink);background:#fff;transition:border-color .2s,box-shadow .2s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--blue-500);box-shadow:0 0 0 3px rgba(37,99,235,.14)}
.field textarea{min-height:140px;resize:vertical;line-height:1.7}
.field .hint{margin-top:6px;font-size:11.5px;color:var(--muted);line-height:1.6}
.type-help{grid-column:1 / -1;margin:0;padding:12px 16px;border-radius:10px;background:var(--sky-50);border:1px solid var(--line);font-size:12.5px;color:var(--navy-800);line-height:1.8}
.consent{grid-column:1 / -1;display:flex;gap:10px;align-items:flex-start;font-size:13px;color:#2c3e4e;line-height:1.7}
.consent input{margin-top:3px;width:17px;height:17px;flex:none}
.consent a{color:var(--blue-600);text-decoration:underline}
.demo-note{grid-column:1 / -1;margin:0;padding:13px 16px;border-radius:10px;background:#fdf8ec;border:1px dashed #d8b56b;color:#8a6d2f;font-size:12.5px;line-height:1.8}
.form-actions{margin-top:22px}
.form-actions .btn[disabled]{opacity:.55;cursor:not-allowed}
.status-message{margin-top:16px;padding:14px 18px;border-radius:10px;background:var(--sky-100);color:var(--navy-900);font-size:13px;line-height:1.8;display:none}
.status-message.is-shown{display:block}

/* --- サイド補足（個人情報・回答について） --- */
.contact-aside{display:flex;flex-direction:column;gap:18px}
.aside-card{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:24px 26px}
.aside-card h3{margin:0 0 12px;font-size:15px;color:var(--navy-900)}
.aside-card ul{margin:0;padding-left:1.15em}
.aside-card li{color:var(--muted);font-size:13px;line-height:1.9;margin-bottom:4px}
.aside-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.9}

/* --- 報道・取材窓口(#press) --- */
.press-box{background:#fff;border:1px solid var(--line);border-left:4px solid var(--navy-900);border-radius:var(--radius);box-shadow:var(--shadow);padding:30px 34px}
.press-box h3{margin:0 0 12px;font-size:18px;color:var(--navy-900)}
.press-box p{margin:0 0 14px;color:#2c3e4e;font-size:14px;line-height:1.9}
.press-list{margin:0 0 14px;padding-left:1.2em}
.press-list li{color:#2c3e4e;font-size:13.5px;line-height:1.95}
.press-note{margin:0;padding:13px 16px;border-radius:10px;background:var(--sky-50);border:1px solid var(--line);font-size:12.5px;color:var(--navy-800);line-height:1.8}

/* --- レスポンシブ --- */
@media (max-width:960px){
  .contact-layout{grid-template-columns:1fr;gap:26px}
}
@media (max-width:900px){
  .contact-hero .hero-grid{grid-template-columns:1fr;gap:30px}
  .contact-hero .hero-visual{order:-1}
  .desk-grid{grid-template-columns:1fr}
  .lead-notice{grid-template-columns:1fr;text-align:left}
  .lead-notice .btn{justify-self:start}
}
@media (max-width:560px){
  .form-grid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .field input,.field select,.field textarea{transition:none}
}

/* お問い合わせの結果（2026-09-06 追加） */
.inq-done{margin:0 0 18px;padding:14px 18px;border-radius:6px;border:1px solid;font-size:14.5px;line-height:1.9}
.inq-done.is-ok{background:#f1f8f2;border-color:#bcd9c2;color:#1e5b2c}
.inq-done.is-ng{background:#fdf4f3;border-color:#e6c4c0;color:#7a1f19}