.card3d {
  width: 280px;
  height: 260px;
  perspective: 1200px;
  margin: 40px auto;
  position: relative;
}

/* Внутри — «толстая» карточка */
.card3d-inner {
  width: 100%;
  height: 100%;
  position: relative;
  transform-style: preserve-3d;
  transition: transform 0.8s cubic-bezier(.25,.8,.25,1);
}

/* Общие стили граней */
.card3d-face {
  position: absolute;
  inset: 0;
  border-radius: 18px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 24px;
  box-sizing: border-box;
  font-family: 'Montserrat', sans-serif;
  backface-visibility: hidden;
}

/* Лицевая (синяя) */
.card3d-front {
  background: #003A8C; /* синий */
  color: #fff;
  transform: rotateX(0deg) translateZ(12px); /* имитация толщины */
  box-shadow: 0 14px 32px rgba(0,0,0,.25);
}

/* Оборотная (серая) */
.card3d-back {
  background: #e6e6e6;
  color: #222;
  transform: rotateX(180deg) translateZ(12px);
  box-shadow: 0 14px 32px rgba(0,0,0,.25);
}

/* Переворот всей карточки по оси X */
.card3d:hover .card3d-inner {
  transform: rotateX(180deg);
}