/* Hero portrait: a hairline ring around the photo with a short accent arc,
   in place of the white mat, the stacked echoes and the glossy sheen.
   The coin's tilt and hover interaction are left as they are. */
.coin--portrait {
  --mat: 4.5%;
}

.coin--portrait .coin__echo,
.coin--portrait .coin__sheen {
  display: none;
}

.coin--portrait .coin__face,
.coin--portrait.is-lifted .coin__face {
  background: none;
  border: 1px solid var(--border-strong);
  box-shadow: none;
  overflow: visible;
}

.coin--portrait .coin__portrait {
  box-shadow: 0 14px 34px oklch(0% 0 0 / .16), 0 3px 10px oklch(0% 0 0 / .08);
  transition: box-shadow .6s var(--ease-out);
}

/* The lift on hover deepens the photo's shadow instead of the face's. */
.coin--portrait.is-lifted .coin__portrait {
  box-shadow: 0 24px 50px oklch(0% 0 0 / .22), 0 6px 16px oklch(0% 0 0 / .1);
}

.coin--portrait .coin__face::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: var(--radius-full);
  border: 2px solid transparent;
  border-top-color: var(--accent);
  transform: rotate(-40deg);
  pointer-events: none;
}