.contact-card .contact-copy { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.contact-card .contact-copy h2 { min-width: 0; }
.profile .contact-card h2 { font-size: clamp(16px, 1.3vw, 18px); }
.contact-eyes { position: relative; display: block; flex: 0 0 147.2px; width: 147.2px; aspect-ratio: 2106 / 747; opacity: 0; pointer-events: none; user-select: none; }
.contact-eyes.is-ready { opacity: 1; }
.contact-eyes-motion, .contact-eyes-normal { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.contact-eyes img { display: block; width: 100%; height: 100%; max-width: none; }
.contact-eyes-base { position: absolute; inset: 0; z-index: 0; }
.contact-eye-flame { position: absolute; z-index: 2; display: block; opacity: 0; }
.contact-eye-socket { position: absolute; z-index: 1; display: block; overflow: hidden; border-radius: 50%; }
.contact-eye-pupil { position: absolute; width: 58%; height: 120%; display: block; background: #25251f; border-radius: 50%; transform: translate(-50%, -50%) translate3d(var(--pupil-x, 0px), var(--pupil-y, 0px), 0); }
.contact-eyes.is-fire .contact-eye-pupil { opacity: 0; }
.contact-eyes.is-fire .contact-eye-flame { opacity: 1; }
.contact-eyes.is-fire .contact-eyes-motion { animation: contact-eyes-shiver 180ms linear infinite; }
.contact-card.is-wide .contact-eyes { flex-basis: 232px; width: 232px; }
.contact-card.is-wide .contact-copy { gap: 24px; }
.contact-card.is-wide h2 { font-size: clamp(28px, 3vw, 42px); }
@keyframes contact-eyes-shiver {
  0%, 100% { transform: translate(0, 0) rotate(0); }
  25% { transform: translate(-1px, .8px) rotate(-1.2deg); }
  50% { transform: translate(.8px, -.7px) rotate(.8deg); }
  75% { transform: translate(-.5px, -.6px) rotate(-.5deg); }
}
@media (min-width: 901px) and (max-width: 1100px) {
  .profile .contact-eyes { flex-basis: 110.4px; width: 110.4px; }
  .profile .contact-copy { gap: 6px; }
  .contact-card.is-wide .contact-eyes { flex-basis: 154px; width: 154px; }
  .contact-card.is-wide .contact-copy { gap: 16px; }
  .contact-card.is-wide h2 { font-size: 30px; }
}
@media (max-width: 900px) {
  .contact-card.is-wide .contact-copy { gap: 12px; }
  .contact-card.is-wide .contact-eyes { flex-basis: 80px; width: 80px; }
  .contact-card.is-wide h2 { font-size: clamp(24px, 5vw, 32px); }
}
@media (max-width: 900px), (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
  .contact-eyes .contact-eyes-motion { animation: none !important; }
}
