/* CONTACT */
.contact__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2.5rem, 7vw, 6rem); align-items: center; }
.contact__copy p { margin-top: 1.4rem; font-size: 1.15rem; max-width: 30rem; }
.contact__links { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2.2rem; }
.contact__form { padding: clamp(1.6rem, 4vw, 2.8rem); border-radius: var(--r-xl); display: flex; flex-direction: column; gap: 1.4rem; }
.contact__form label { display: flex; flex-direction: column; gap: 0.6rem; }
.contact__form label span { font-size: 0.8rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-dim); }
.contact__form input, .contact__form textarea {
  font: inherit; color: var(--text); background: var(--bg); border: 1px solid transparent; border-radius: var(--r-sm);
  padding: 1rem 1.2rem; box-shadow: var(--neu-in); outline: none; resize: vertical; transition: border-color 0.3s;
}
.contact__form input::placeholder, .contact__form textarea::placeholder {
  color: var(--text-dim); opacity: 0.55; transition: opacity 0.25s var(--ease-soft);
}
.contact__form input:focus::placeholder, .contact__form textarea:focus::placeholder { opacity: 0; }
.contact__form input:focus, .contact__form textarea:focus { border-color: var(--accent); }
.contact__form .btn { align-self: flex-start; }
.contact__status { min-height: 1.4em; font-size: 0.9rem; }
.contact__status.is-ok { color: var(--accent); }
.contact__status.is-err { color: var(--c-pink); }

.footer { padding: 2.5rem 0 3rem; border-top: 1px solid var(--line); }
.footer__row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.footer p { font-size: 0.9rem; }
.to-top { display: grid; place-items: center; width: 3rem; height: 3rem; color: var(--accent); border-radius: 50%; transition: box-shadow 0.3s; }
.to-top:active { box-shadow: var(--neu-in); }
.to-top svg { width: 1.2rem; height: 1.2rem; }
@media (max-width: 900px) { .contact__grid { grid-template-columns: 1fr; } }

.contact__form input, .contact__form textarea { width: 100%; min-width: 0; }
.contact__form button:disabled { opacity: 0.65; cursor: wait; transform: none; }
.contact__status { line-height: 1.55; }
.contact__copy h2 { max-width: 11ch; }
@media (max-width: 560px) {
  .contact__form .btn { width: 100%; }
  .footer__row { align-items: flex-start; }
}
