/* Rewire Divi Flipbox 1.0.0 — CSS 3D transition + lightweight event-driven flip state.
 * First direct Group = front; second direct Group = back.
 * IMPORTANT: Divi 5 Visual Builder can insert <style> or other helper nodes
 * as siblings of Group modules. Plain :nth-child(1/2) incorrectly counts them.
 * :nth-child(n of .et_pb_group) counts only actual native Group modules.
 * This also works with a custom HTML tag assigned to the Group.
 * No height syncing JS; grid's single cell takes the height of its tallest child.
 */
.rwdf {
  display: block;
  min-width: 0;
  width: 100%;
  max-width: 100%;
}
/* Each Flipbox keeps its own animation parameters, independent of other cards.
 * Default transform values exactly reproduce the 0.1.3 leftwards flip.
 * CSS custom properties hold full transform functions (not fragments), so
 * rotateX and rotateY interpolate reliably without animation JS.
 */
.rwdf {
  --rwdf-zero: rotateY(0deg);
  --rwdf-front-flipped: rotateY(-180deg);
  --rwdf-back-initial: rotateY(180deg);
  --rwdf-duration: 600ms;
  --rwdf-easing: ease;
}
.rwdf[data-rwdf-direction="right"] {
  --rwdf-front-flipped: rotateY(180deg);
  --rwdf-back-initial: rotateY(-180deg);
}
.rwdf[data-rwdf-direction="up"] {
  --rwdf-zero: rotateX(0deg);
  --rwdf-front-flipped: rotateX(180deg);
  --rwdf-back-initial: rotateX(-180deg);
}
.rwdf[data-rwdf-direction="down"] {
  --rwdf-zero: rotateX(0deg);
  --rwdf-front-flipped: rotateX(-180deg);
  --rwdf-back-initial: rotateX(180deg);
}
.rwdf-stage { min-width: 0; max-width: 100%; perspective: 1200px; }
/* The div generated by Divi elements.render(content). */
.rwdf-stage > :first-child {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  isolation: isolate;
  min-width: 0;
  width: 100%;
}
/* Only the two root Group elements participate in the two-sided card. */
.rwdf-stage > :first-child > :nth-child(1 of .et_pb_group),
.rwdf-stage > :first-child > :nth-child(2 of .et_pb_group) {
  grid-area: 1 / 1;
  min-width: 0;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transition: transform var(--rwdf-duration, 600ms) var(--rwdf-easing, ease);
  transform-style: preserve-3d;
}
.rwdf-stage > :first-child > :nth-child(1 of .et_pb_group) {
  position: relative;
  transform: var(--rwdf-zero, rotateY(0deg));
  z-index: 2;
}
.rwdf-stage > :first-child > :nth-child(2 of .et_pb_group) {
  position: relative;
  transform: var(--rwdf-back-initial, rotateY(180deg));
  z-index: 1;
}
/* Extra root modules indicate an authoring mistake; do not allow unexpected overlay layers. */
.rwdf-stage > :first-child > :nth-child(n+3 of .et_pb_group) { display: none !important; }
/* Click/tap and keyboard activation on both input-capability types. */
.rwdf[data-rwdf-ready="on"][data-rwdf-flipped="on"] .rwdf-stage > :first-child > :nth-child(1 of .et_pb_group) { transform: var(--rwdf-front-flipped, rotateY(-180deg)); z-index: 1; }
.rwdf[data-rwdf-ready="on"][data-rwdf-flipped="on"] .rwdf-stage > :first-child > :nth-child(2 of .et_pb_group) { transform: var(--rwdf-zero, rotateY(0deg)); z-index: 2; }
/* Mouse/trackpad hover only. A hybrid device's touch activation explicitly
   disables CSS :hover (which may otherwise remain sticky after tapping). */
@media (hover: hover) and (pointer: fine) {
  .rwdf[data-rwdf-mode="hover"][data-rwdf-ready="on"]:not([data-rwdf-input="touch"]):not([data-rwdf-input="keyboard"]):hover .rwdf-stage > :first-child > :nth-child(1 of .et_pb_group) { transform: var(--rwdf-front-flipped, rotateY(-180deg)); z-index: 1; }
  .rwdf[data-rwdf-mode="hover"][data-rwdf-ready="on"]:not([data-rwdf-input="touch"]):not([data-rwdf-input="keyboard"]):hover .rwdf-stage > :first-child > :nth-child(2 of .et_pb_group) { transform: var(--rwdf-zero, rotateY(0deg)); z-index: 2; }
}
.rwdf[data-rwdf-ready="on"]:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
/* Builder editing is a normal, non-animated face, controlled only by Content-tab field. */
.rwdf[data-rwdf-builder="on"] .rwdf-stage > :first-child > :nth-child(1 of .et_pb_group),
.rwdf[data-rwdf-builder="on"] .rwdf-stage > :first-child > :nth-child(2 of .et_pb_group),
.rwdf[data-rwdf-builder="on"]:hover .rwdf-stage > :first-child > :nth-child(1 of .et_pb_group),
.rwdf[data-rwdf-builder="on"]:hover .rwdf-stage > :first-child > :nth-child(2 of .et_pb_group) {
  transform: none !important;
  transition: none !important;
  backface-visibility: visible;
  -webkit-backface-visibility: visible;
}
.rwdf[data-rwdf-builder="on"][data-rwdf-edit="front"] .rwdf-stage > :first-child > :nth-child(1 of .et_pb_group),
.rwdf[data-rwdf-builder="on"][data-rwdf-edit="back"] .rwdf-stage > :first-child > :nth-child(2 of .et_pb_group) {
  visibility: visible;
  pointer-events: auto;
  z-index: 2;
}
.rwdf[data-rwdf-builder="on"][data-rwdf-edit="front"] .rwdf-stage > :first-child > :nth-child(2 of .et_pb_group),
.rwdf[data-rwdf-builder="on"][data-rwdf-edit="back"] .rwdf-stage > :first-child > :nth-child(1 of .et_pb_group) {
  visibility: hidden;
  pointer-events: none;
  z-index: 1;
}
.rwdf-empty {
  padding: 28px 18px;
  border: 1px dashed #a3a3a3;
  background: rgba(120, 120, 120, .06);
  color: #555;
  text-align: center;
  font: 14px/1.5 system-ui, sans-serif;
}
.rwdf[data-rwdf-builder="on"] .rwdf-empty { margin-top: 12px; }
@media (prefers-reduced-motion: reduce) {
  .rwdf-stage > :first-child > :nth-child(1 of .et_pb_group),
  .rwdf-stage > :first-child > :nth-child(2 of .et_pb_group) { transition-duration: 1ms; }
}

/* 0.1.5: accessible state announcement. Visually hidden but still announced by
   assistive technologies. No visual control is added to the card. */
.rwdf-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}