/******* Do not edit this file *******
Code Snippets Manager
Saved: Dec 02 2025 | 12:18:51 */
@charset "UTF-8";
.flip-box {
  display: inline-block;
  perspective: 1000px;
  margin: 0 auto;
  width: 400px;
  height: 300px;
}
.flip-box-inner {
  position: relative;
  transition: transform 0.5s;
  transform-style: preserve-3d;
}
.flip-box:hover .flip-box-inner {
  transform: rotateY(180deg);
}
.flip-box-front, .flip-box-back {
  position: absolute;
  margin: 0 auto;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}
.flip-box-back {
  transform: rotateY(180deg);
}
/* 1) Compactar el grid de GenerateBlocks */
.flip-grid {
  --wp--style--block-gap: 0;
  /* anula el block-gap de WP dentro del grid */
}
.flip-grid .gb-grid {
  gap: 20px;
  /* valor base */
  row-gap: 0 !important;
  /* sin separación vertical */
  column-gap: 20px !important;
  /* separación horizontal */
}
/* 2) Quitar relleno y márgenes verticales de las columnas/contenedores */
.flip-grid .gb-grid-column, .flip-grid .gb-grid-column > .gb-container, .flip-grid .gb-grid-column > .gb-container > .gb-inside-container {
  margin: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
/* Anular márgenes que añaden los bloques hijos dentro de cada columna */
.flip-grid .gb-container > *:first-child {
  margin-top: 0 !important;
}
.flip-grid .gb-container > *:last-child {
  margin-bottom: 0 !important;
}
/* 3) Ajustes del flipbox dentro del grid (sin tocar el resto del sitio) */
.flip-grid .flip-box {
  display: block;
  /* evita inline gaps */
  margin: 0;
  /* elimina separación vertical residual */
  width: 100%;
  /* que ocupe su columna (33%) */
  height: 300px;
  /* tu altura fija */
}
.flip-grid .flip-box-inner {
  width: 100%;
  height: 100%;
}
.cristal {
  padding: 5% 10%;
  background-color: white;
  border: 1px solid #dde4f0;
  border-radius: 18px;
  box-shadow: 3px 3px 4px 1px var(--contrast-2);
}
/* Mantén tu CSS de flip tal cual (backface, transform, etc.) */