/* Contact page */
.contact-sec { background: var(--ink); }

.contact-grid {
  display: grid; grid-template-columns: 1fr 1.3fr; gap: clamp(48px, 8vw, 110px);
  align-items: start;
}

.contact-ttl {
  font-family: var(--font-display); font-size: clamp(28px, 4vw, 48px);
  font-weight: 600; line-height: 1.2; letter-spacing: 0.04em; margin: 16px 0 20px;
}
.contact-desc { color: var(--text-dim); font-size: 15px; line-height: 2; margin-bottom: 48px; }

.contact-flow { display: flex; flex-direction: column; gap: 0; }
.cf-item {
  display: grid; grid-template-columns: 40px 1fr; gap: 20px;
  padding: 20px 0; border-bottom: 1px solid var(--line); align-items: start;
}
.cf-item:first-child { border-top: 1px solid var(--line); }
.cf-num { font-size: 10px; letter-spacing: 0.3em; color: var(--blue-bright); padding-top: 2px; }
.cf-item strong { font-size: 15px; font-weight: 600; letter-spacing: 0.06em; display: block; margin-bottom: 5px; }
.cf-item p { color: var(--text-dim); font-size: 13px; line-height: 1.7; }

.contact-form-wrap {
  background: var(--ink-3); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: clamp(32px, 4vw, 56px);
}
.form-note { font-size: 12px; color: var(--text-dim); margin-bottom: 28px; }

.form-success {
  text-align: center; padding: 48px 24px;
}
.fs-icon {
  font-size: 48px; color: var(--cyan);
  margin-bottom: 20px;
  text-shadow: 0 0 20px var(--cyan);
}
.form-success h3 { font-size: 22px; margin-bottom: 12px; }
.form-success p  { color: var(--text-dim); font-size: 15px; line-height: 1.85; }

/* ブラウザのオートフィル（自動入力）による白背景を上書き */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #101C2B inset !important;
  -webkit-text-fill-color: #E8EDF4 !important;
  caret-color: #E8EDF4;
  transition: background-color 9999s ease-in-out 0s;
}

@media (max-width: 900px) {
  .contact-grid { grid-template-columns: 1fr; }
}