/* arXte — Sigillo di ceralacca (wax seal styles)
   Prefix: sl- */

.sl-seal {
  display: inline-block;
  vertical-align: middle;
  overflow: visible;
  filter: drop-shadow(0 2px 8px rgba(28, 26, 22, 0.12));
  user-select: none;
  touch-action: manipulation;
}

.sl-body {
  transform-box: fill-box;
  transform-origin: 50% 50%;
  will-change: transform, opacity;
}

.sl-half {
  transform-box: fill-box;
  transform-origin: 50% 50%;
  will-change: transform, opacity;
}

.sl-blob,
.sl-disc {
  transition: filter 0.2s ease;
}

.sl-monogram {
  font-family: var(--font-brand, 'Bodoni Moda', 'Didot', 'Bodoni 72', serif); /* the brand face: wordmark and seals only */
  font-optical-sizing: auto;
  font-style: italic;
  font-weight: 400; /* Bodoni is self-hosted at 400 only; a heavier weight would be synthesized */
  text-anchor: middle;
  pointer-events: none;
  user-select: none;
}

.sl-crack-line {
  pointer-events: none;
}

.sl-impact-ring {
  pointer-events: none;
  transform-origin: 50% 50%;
}

/* Demo and standalone wrapper utilities */
.sl-seal-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 32px 24px;
  background-color: var(--paper-2);
  border: 1px solid var(--hairline);
  box-shadow: var(--shadow-paper);
  position: relative;
  transition: transform 0.3s var(--ease-out), box-shadow 0.3s var(--ease-out), border-color 0.3s var(--ease-out);
  cursor: pointer;
}

.sl-seal-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-lift);
  border-color: var(--hairline-strong);
}

.sl-seal-card:focus-visible {
  outline: 1px solid var(--ink);
  outline-offset: 3px;
}

.sl-seal-stage {
  min-height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.sl-seal-meta {
  margin-top: 20px;
  text-align: center;
}

.sl-seal-title {
  font-family: var(--font-display);
  font-size: var(--fs-body);
  color: var(--ink);
  margin: 0 0 4px 0;
  letter-spacing: -0.01em;
}

.sl-seal-desc {
  font-family: var(--font-text);
  font-size: var(--fs-small);
  color: var(--ink-soft);
  margin: 0;
}
