/* Contact page — same column grid as About (text column starts at 880u) */
.contact-page .accent { color: var(--pink); }
.contact-top { position: relative; display: grid; grid-template-columns: calc(696 * var(--u)) calc(800 * var(--u)); column-gap: calc(0 * var(--u)); padding: calc(160 * var(--u)) 0 calc(150 * var(--u)) calc(184 * var(--u)); }
.contact-formwrap { grid-column: 2; margin-left: calc(0 * var(--u)); }
.contact-top { grid-template-columns: calc(696 * var(--u)) calc(800 * var(--u)); }
.contact-head { font-weight: 500; font-size: calc(96 * var(--u)); line-height: 1.04; letter-spacing: -0.025em; }
.contact-sub { margin-top: calc(34 * var(--u)); max-width: calc(520 * var(--u)); font-size: calc(24.3 * var(--u)); line-height: 1.3; }

.cf-trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.cf-field + .cf-field { margin-top: calc(28 * var(--u)); }
.cf-field label { display: block; margin-bottom: calc(10 * var(--u)); font-weight: 500; font-size: calc(20.2 * var(--u)); line-height: 1; }
.cf-field input, .cf-field textarea {
  display: block; width: 100%; box-sizing: border-box; margin: 0;
  padding: 0 calc(24 * var(--u)); border: 1px solid var(--ink); border-radius: 0; background: transparent; color: var(--ink);
  font: inherit; font-weight: 300; font-size: calc(24.3 * var(--u)); line-height: 1.3; transition: border-color 0.18s ease;
}
.cf-field input { height: calc(72 * var(--u)); }
.cf-field textarea { padding-top: calc(22 * var(--u)); padding-bottom: calc(22 * var(--u)); min-height: calc(240 * var(--u)); resize: vertical; }
.cf-field input:hover, .cf-field textarea:hover { border-color: var(--pink); }
.cf-field input:focus, .cf-field textarea:focus { outline: none; border-color: var(--pink); box-shadow: 0 0 0 1px var(--pink); }
.cf-field.has-error input, .cf-field.has-error textarea { border-color: var(--pink); }

.cf-actions { display: flex; align-items: center; gap: calc(28 * var(--u)); margin-top: calc(34 * var(--u)); flex-wrap: wrap; }
.cf-send {
  display: inline-flex; align-items: center; justify-content: center; gap: calc(16 * var(--u));
  height: calc(88 * var(--u)); padding: 0 calc(40 * var(--u)); border: 1px solid var(--ink); background: transparent; cursor: pointer;
  font-weight: 500; font-size: calc(29.6 * var(--u)); line-height: 1; color: var(--ink); transition: color 0.18s ease, border-color 0.18s ease;
}
.cf-send:hover, .cf-send:focus-visible { color: var(--pink); border-color: var(--pink); }
.cf-send:hover .arrow { transform: translateX(calc(4 * var(--u))); }
.cf-send .arrow { transition: transform 0.2s ease; }
.cf-send[disabled] { opacity: 0.5; cursor: default; }
.cf-status { font-size: calc(20.2 * var(--u)); line-height: 1.3; min-height: 1em; }
.cf-status.is-error { color: var(--pink); }
.cf-direct { margin-top: calc(48 * var(--u)); display: flex; flex-wrap: wrap; align-items: center; column-gap: calc(10 * var(--u)); row-gap: 6px; font-size: calc(20.2 * var(--u)); line-height: 1.3; }
.cf-direct-label { font-weight: 300; }
.cf-direct .email-box { margin-top: 0; height: auto; padding: 0; border: 0; }
.cf-direct .email-box:hover, .cf-direct .email-box:focus-within { padding-right: 0; }
.cf-direct .email-link { font-size: calc(20.2 * var(--u)); line-height: 1.3; border-bottom: 1px solid var(--ink); transition: color 0.18s ease, border-color 0.18s ease; }
.cf-direct .email-box:hover .email-link, .cf-direct .email-box:focus-within .email-link { border-color: var(--pink); }
.cf-direct .copy-btn { height: calc(32 * var(--u)); font-size: calc(17 * var(--u)); }
.cf-direct .email-box:hover .copy-btn, .cf-direct .email-box:focus-within .copy-btn { width: calc(80 * var(--u)); margin-left: calc(14 * var(--u)); }
.cf-done-title { font-weight: 500; font-size: calc(48 * var(--u)); line-height: 1.1; }
.cf-done p { margin-top: calc(16 * var(--u)); font-size: calc(24.3 * var(--u)); }
.cf-done[hidden], .contact-form[hidden] { display: none; }

.contact-footer { padding-bottom: calc(60 * var(--u)); }
.contact-footer .footer-legal { margin-top: calc(40 * var(--u)); }
.nav-links a[href$="contact.html"] { color: var(--pink); }

@media (min-width: 901px) and (max-width: 1190px) {
  .contact-top { grid-template-columns: 1fr 1fr; column-gap: 44px; padding: 80px 40px 100px; }
  .contact-head { font-size: 54px; }
  .contact-sub { margin-top: 22px; font-size: 18px; max-width: none; }
  .cf-field label { font-size: 16px; margin-bottom: 8px; }
  .cf-field input, .cf-field textarea { font-size: 18px; padding: 0 16px; }
  .cf-field input { height: 54px; }
  .cf-field textarea { padding: 15px 16px; min-height: 180px; }
  .cf-field + .cf-field { margin-top: 20px; }
  .cf-send { height: 62px; padding: 0 28px; font-size: 22px; }
  .cf-status { font-size: 16px; }
  .cf-direct { font-size: 16px; }
  .cf-direct .email-link { font-size: 16px; }
  .cf-direct .copy-btn { height: 28px; font-size: 14px; }
  .cf-direct .email-box:hover .copy-btn, .cf-direct .email-box:focus-within .copy-btn { width: 64px; }
  .cf-done-title { font-size: 34px; }
  .cf-done p { font-size: 18px; }
}
@media (max-width: 900px) {
  .contact-top { display: block; padding: 40px 22px 64px; }
  .contact-head { font-size: 40px; }
  .contact-sub { margin-top: 16px; font-size: 18px; max-width: none; }
  .contact-formwrap { margin-top: 36px; }
  .cf-field label { font-size: 16px; margin-bottom: 8px; }
  .cf-field input, .cf-field textarea { font-size: 18px; padding: 0 14px; }
  .cf-field input { height: 52px; }
  .cf-field textarea { padding: 14px; min-height: 170px; }
  .cf-field + .cf-field { margin-top: 18px; }
  .cf-actions { margin-top: 24px; gap: 16px; }
  .cf-send { height: 60px; padding: 0 26px; font-size: 20px; }
  .cf-status { font-size: 15px; }
  .cf-direct { margin-top: 36px; font-size: 16px; }
  .cf-direct .email-link { font-size: 16px; }
  .cf-direct .copy-btn { width: 52px; height: 30px; margin-left: 10px; font-size: 14px; }
  .cf-direct .email-box:hover .copy-btn, .cf-direct .email-box:focus-within .copy-btn { width: 52px; margin-left: 10px; }
  .cf-done-title { font-size: 30px; }
  .cf-done p { font-size: 18px; }
  .contact-footer { padding-bottom: 40px; }
}

/* Decorative stars */
.contact-star { position: absolute; height: auto; z-index: 0; }
.cs-b { left: calc(1752 * var(--u)); top: calc(96 * var(--u)); width: calc(65 * var(--u)); }
.cs-c { left: calc(470 * var(--u)); top: calc(700 * var(--u)); width: calc(92 * var(--u)); }
.cs-d { left: calc(1738 * var(--u)); top: calc(884 * var(--u)); width: calc(54 * var(--u)); }
@media (min-width: 901px) and (max-width: 1190px) {
    .cs-b { left: auto; right: 24px; top: 36px; width: 44px; }
  .cs-c { left: 200px; top: 480px; width: 62px; }
  .cs-d { display: none; }
}
@media (max-width: 900px) {
    .cs-b, .cs-c { display: none; }
  .cs-d { left: auto; right: 24px; top: auto; bottom: 18px; width: 34px; }
  .contact-top { position: relative; }
}

/* If the copy button sliding in would push the address onto a new line, start it on its own line instead */
@media (min-width: 901px) and (max-width: 1060px) {
  .cf-direct-label { flex-basis: 100%; }
}