.block-page-media-group {
  margin-top: var(--margin-top);
  margin-bottom: var(--margin-bottom);
  gap: var(--gap);
  
  /* Grid layout */
  &[style*="--layout: grid"] {
    display: grid;
    grid-template-columns: repeat(var(--columns), 1fr);
    
    @media (max-width: 768px) {
      grid-template-columns: repeat(2, 1fr);
    }
    
    @media (max-width: 480px) {
      grid-template-columns: 1fr;
    }
  }
  
  /* Masonry layout */
  &[style*="--layout: masonry"] {
    columns: var(--columns);
    column-gap: var(--gap);
    
    .block-page-media {
      break-inside: avoid;
      margin-bottom: var(--gap);
    }
    
    @media (max-width: 768px) {
      columns: 2;
    }
    
    @media (max-width: 480px) {
      columns: 1;
    }
  }
  
  /* Flex row layout */
  &[style*="--layout: flex-row"] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    
    .block-page-media {
      flex: 1 1 calc(100% / var(--columns) - var(--gap));
    }
  }
  
  /* Flex column layout */
  &[style*="--layout: flex-column"] {
    display: flex;
    flex-direction: column;
  }
  
  .block-page-media {
    img, video {
      width: 100%;
      height: auto;
      display: block;
    }
  }
}