@import url("/staging/home-v10/contact.css?v=22");

:root {
  --font-body: "Inter Display", sans-serif;
  --type-label: 16px;
  --grid-margin: 16px;
}
@media (min-width: 768px) {
  :root { --grid-margin: 32px; }
}
.screen-back { position: relative; height: 100dvh; display: grid; place-items: center; background: #fff; }
.screen-back[data-presentation="overlay"] { position: fixed; inset: 0; z-index: 4; background: transparent; }
.screen-back[hidden] { display: none; }
.contact-form .contact-email { --type-hero: clamp(2rem, 1.55rem + 1.85vw, 4.5rem); border: 0; border-radius: 0; outline: none; color: #111; font-family: inherit; line-height: 1.1; letter-spacing: -.02em; }
.contact-email::placeholder { opacity: 1; }
.contact-message { font-size: 16px; }
.contact-back { position: absolute; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: transparent; cursor: pointer; }
.contact-back::before { content: ""; position: absolute; inset: 5px; border-radius: 50%; background: #e1e1e4; transform: scale(1); }
.contact-back img { position: relative; width: 20px; height: 20px; opacity: .75; transform: rotate(45deg); filter: blur(0); pointer-events: none; transition: opacity 220ms ease, filter 260ms ease, transform 350ms cubic-bezier(.22, 1, .36, 1); }
@media (hover: hover) and (pointer: fine) {
  .screen-back:not(:hover):not(:has(.contact-back:focus-visible)) .contact-back::before { transform: scale(.3); }
  .screen-back:not(:hover):not(:has(.contact-back:focus-visible)) .contact-back img { opacity: 0; filter: blur(8px); }
}
@media (prefers-reduced-motion: reduce) {
  .contact-back::before, .contact-back img { transition: none; }
}

body[data-contact-phase="closing"] .screen-back { overflow: clip; }

body[data-contact-phase="closing"] .screen-back[data-presentation="overlay"] { pointer-events: none; }

.screen-back[data-presentation="overlay"] .contact-back { display: none; }