body{
  background:#f7f4ef;
}

.contact-page{
  min-height:100vh;
  padding:4rem 0 5rem;
  background:
    radial-gradient(circle at top center, rgba(255, 244, 223, 0.72), transparent 24%),
    radial-gradient(circle at 82% 22%, rgba(126, 188, 162, 0.16), transparent 18%),
    linear-gradient(180deg, #f7f4ef 0%, #fbf8f3 100%);
}

.contact-shell{
  max-width:560px;
  margin:0 auto;
}

.contact-intro{
  margin-bottom:2rem;
  transform:translate3d(0, calc(var(--contact-intro-shift, 0px) + var(--site-reveal-y, 0px)), 0) scale(var(--site-reveal-scale, 1));
  transition:
    transform .18s linear,
    opacity .72s cubic-bezier(.22, 1, .36, 1),
    filter .72s cubic-bezier(.22, 1, .36, 1);
}

.contact-intro h1{
  font-size:clamp(1.75rem, 4vw, 2.3rem);
  letter-spacing:-0.02em;
  margin-bottom:0.5rem;
}

.contact-intro p{
  color:var(--text-secondary);
  margin-bottom:0;
  font-size:0.9rem;
}

.contact-card{
  padding:2rem;
  transform:translate3d(0, calc(var(--contact-card-shift, 0px) + var(--site-reveal-y, 0px)), 0) scale(var(--site-reveal-scale, 1));
  transition:
    transform .18s linear,
    opacity .72s cubic-bezier(.22, 1, .36, 1),
    filter .72s cubic-bezier(.22, 1, .36, 1);
}