.contact-daruma-shortcuts {
  position: fixed;
  inset: 0;
  z-index: 18;
  pointer-events: none;
}

.contact-daruma-link {
  position: absolute;
  bottom: 33%;
  width: 100px;
  height: 28px;
  display: block;
  pointer-events: auto;
  filter: drop-shadow(0 7px 12px rgba(0, 0, 0, .28));
  transform: translateY(50%);
  transition: filter .2s ease, transform .2s ease;
}

.contact-daruma-mail { left: 8px; }
.contact-daruma-whatsapp { right: 8px; }
/* The black artwork has less transparent padding, so keep its visible size
   aligned with the red Daruma while using a smaller container. */
.contact-daruma-whatsapp .contact-daruma-avatar { width: 90.8%; }

.contact-daruma-link:hover,
.contact-daruma-link:focus-visible {
  filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .35));
  transform: translateY(50%) scale(1.04);
}

.contact-daruma-link:focus-visible {
  outline: 2px solid #c96e4c;
  outline-offset: 5px;
}

.contact-daruma-avatar {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 12px);
  width: 104%;
  aspect-ratio: 1;
  display: block;
  transform: translateX(-50%);
  filter: drop-shadow(0 5px 8px rgba(0, 0, 0, .38));
  animation: none;
}

.contact-daruma-spin {
  position: absolute;
  inset: 0;
  display: block;
  transform: rotate(calc(var(--look-angle, 0deg) + var(--daruma-spin-angle, 0deg)));
  transform-origin: 50% 50%;
  will-change: transform;
}

@property --daruma-spin-angle {
  syntax: "<angle>";
  inherits: true;
  initial-value: 0deg;
}

.contact-daruma-spin img,
.contact-daruma-label {
  display: block;
  width: 100%;
  height: auto;
}

.contact-daruma-spin img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block; }

.contact-daruma-link:hover .contact-daruma-spin,
.contact-daruma-link:focus-visible .contact-daruma-spin {
  animation: contact-daruma-spin 1.45s linear infinite;
}

.contact-daruma-link:hover .contact-daruma-spin img,
.contact-daruma-link:focus-visible .contact-daruma-spin img {
  scale: 1.08;
}

.contact-daruma-link.is-jumping .contact-daruma-spin {
  animation: none;
  --daruma-spin-angle: 0deg;
}

.contact-daruma-link.is-jumping .contact-daruma-avatar {
  animation: contact-daruma-click .9s cubic-bezier(.22,.8,.3,1) both;
}

@keyframes contact-daruma-spin {
  from { --daruma-spin-angle: 0deg; }
  to { --daruma-spin-angle: 360deg; }
}

@keyframes contact-daruma-click {
  0% { transform: translateX(-50%) translateY(0) scale(1, 1); }
  18% { transform: translateX(-50%) translateY(0) scale(1.16, .82); }
  48% { transform: translateX(-50%) translateY(-24px) scale(.88, 1.14); }
  72% { transform: translateX(-50%) translateY(3px) scale(1.13, .87); }
  88% { transform: translateX(-50%) translateY(-3px) scale(.98, 1.03); }
  100% { transform: translateX(-50%) translateY(0) scale(1, 1); }
}

.footer-legal-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.footer-legal-links a {
  padding: 0;
  font-size: 12px;
  color: rgba(255, 255, 255, .72);
}

.footer-legal-links a:hover,
.footer-legal-links a:focus-visible { color: #fff; text-decoration: underline; }

.legal-dialog-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(18, 31, 24, .56);
  backdrop-filter: blur(10px);
}

.legal-dialog {
  position: relative;
  width: min(580px, 100%);
  padding: 52px;
  background: var(--paper);
  box-shadow: 0 20px 70px rgba(18, 31, 24, .28);
}

.legal-dialog h2 { color: var(--deep); font-size: 48px; }
.legal-dialog p:last-child { max-width: 420px; margin: 24px 0 0; color: #617067; }
.legal-dialog-close { position: absolute; top: 16px; right: 20px; border: 0; background: transparent; color: var(--ink); font-size: 30px; }

@media (max-width: 760px) {
  body { padding-bottom: calc(82px + env(safe-area-inset-bottom)); }
  .contact-daruma-shortcuts {
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    height: calc(82px + env(safe-area-inset-bottom));
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 5px 8px env(safe-area-inset-bottom);
    border-top: 1px solid rgba(35, 63, 49, .14);
    background: rgba(250, 250, 246, .97);
    box-shadow: 0 -5px 20px rgba(29, 45, 37, .1);
    backdrop-filter: blur(10px);
  }
  .contact-daruma-link {
    position: relative !important;
    inset: auto !important;
    bottom: auto;
    width: 100%;
    height: 70px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    transform: none;
    filter: none;
  }
  .contact-daruma-mail { left: auto; border-right: 1px solid rgba(35, 63, 49, .12); }
  .contact-daruma-whatsapp { right: auto; }
  .contact-daruma-avatar {
    top: 0;
    bottom: auto;
    width: 46px;
  }
  .contact-daruma-whatsapp .contact-daruma-avatar { width: 40.2px; }
  .contact-daruma-label {
    width: 86px;
    height: 20px;
    object-fit: contain;
  }
  .contact-daruma-link:hover,
  .contact-daruma-link:focus-visible { transform: scale(1.04); }
  .footer-legal-links { width: 100%; order: 3; }
  .legal-dialog { padding: 40px 24px; }
  .legal-dialog h2 { font-size: 38px; }
}

@media (prefers-reduced-motion: reduce) {
  .contact-daruma-link.is-jumping .contact-daruma-avatar,
  .contact-daruma-avatar,
  .contact-daruma-spin,
  .contact-daruma-spin img,
  .contact-daruma-link:hover .contact-daruma-spin img,
  .contact-daruma-link:focus-visible .contact-daruma-spin img { animation: none; }
  .contact-daruma-link { transition: none; }
}