/* Contact: quiet and direct */
.contact { padding: clamp(130px, 15vw, 240px) var(--pad) clamp(80px, 10vw, 160px); }
.contact h1 { margin: 0; max-width: 11em; font: 500 clamp(46px, 7.4vw, 124px)/.98 var(--serif); letter-spacing: -.025em; }
.c-grid { display: grid; gap: clamp(50px, 6vw, 90px); margin-top: clamp(50px, 7vw, 110px); border-top: 1px solid #d9d4ca; padding-top: clamp(30px, 4vw, 60px); }
@media (min-width: 900px) { .c-grid { grid-template-columns: 1.5fr 1fr; gap: clamp(60px, 8vw, 140px); } }
.c-form { display: grid; gap: 26px; align-content: start; }
.c-form label { display: grid; gap: 10px; font: 600 12px/1 var(--sans); letter-spacing: .06em; color: #6b675f; }
.c-form label span { font-weight: 400; letter-spacing: .1em; }
.c-form input, .c-form textarea { width: 100%; padding: 8px 0 14px; border: 0; border-bottom: 1px solid #cfc9bd; border-radius: 0; background: none; color: var(--onyx); font: 400 clamp(20px, 1.8vw, 26px)/1.3 var(--serif); letter-spacing: 0; text-transform: none; outline: none; transition: border-color .3s; resize: vertical; }
.c-form input:focus, .c-form textarea:focus { border-color: var(--blush); }
.c-form .invalid { border-color: var(--blush); }
.pill-btn.dark { justify-self: start; margin-top: 8px; background: none; border: 1px solid var(--onyx); color: var(--onyx); cursor: pointer; }
.pill-btn.dark:hover { background: var(--blush); border-color: var(--blush); color: #fff; }
.c-note { margin: 0; min-height: 1.4em; font: 400 14px/1.4 var(--sans); color: #6b675f; }
.c-side h2 { margin: 0 0 10px; font: 600 12px/1 var(--sans); letter-spacing: .06em; color: #6b675f; }
.c-side p { margin: 0 0 clamp(30px, 3vw, 44px); font: 500 clamp(22px, 2vw, 30px)/1.25 var(--serif); letter-spacing: -.01em; }
.c-side p:last-child { font: 400 15px/1.6 var(--sans); color: #4a4741; max-width: 24em; }
.c-mail { border-bottom: 1px solid #c9c4b9; transition: color .3s, border-color .3s; }
.c-mail:hover { color: var(--blush); border-color: var(--blush); }
.c-form .hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.c-form.sent > :not(.c-note) { display: none; }
.c-form.sent .c-note { font: 500 clamp(24px, 2.4vw, 36px)/1.2 var(--serif); color: var(--onyx); }
.c-do { list-style: none; margin: 0 0 clamp(30px, 3vw, 44px); padding: 0; display: grid; gap: 14px; }
.c-do li { position: relative; padding-left: 22px; font: 500 clamp(18px, 1.5vw, 22px)/1.3 var(--serif); letter-spacing: -.005em; }
.c-do li::before { content: ""; position: absolute; left: 0; top: .52em; width: 7px; height: 7px; border-radius: 50%; background: var(--blush); }
