@charset "utf-8";
/* CSS Document */
/* ===== Bulletproof single-column on phones ===== */
@media (max-width: 640px) {
  /* Force ALL “rows” into a single column regardless of grid/flex */
  .my-animation-page .two-column .grid-row,
  .my-animation-page .image-grid .grid-row,
  .my-animation-page .grid-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-auto-flow: row !important;
    gap: 24px !important; /* optional spacing between stacked items */
  }

  /* Neutralize flex-based widths */
  .my-animation-page .grid-row > .grid-item {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }

  /* Kill any floats that might force side-by-side */
  .my-animation-page .grid-row > .grid-item,
  .my-animation-page .two-column .grid-item {
    float: none !important;
    clear: both !important;
  }

  /* Tidy paddings/margins */
  .my-animation-page,
  .my-animation-page .image-grid,
  .my-animation-page .grid-container,
  .my-animation-page .grid-row {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
}