.elementor-21256 .elementor-element.elementor-element-5cb0117 .wd-text-block{max-width:1000px;}/* Start custom CSS for wd_text_block, class: .elementor-element-6ad5e7a *//* Container to hold everything together and manage positioning */
.image-container {
  position: relative;
  display: inline-block;
  padding: 40px; /* Gives room for the shifting background elements */
}

/* 1. Main Image Styling with Custom Corners */
.main-image {
  display: block;
  width: 100%;
  max-width: 500px; /* Adjust to match your design size */
  height: auto;
  
  /* Asymmetrical border radius: 
     Top-left: 0px, Top-right: 60px, Bottom-right: 20px, Bottom-left: 60px */
  border-radius: 10px 60px 20px 60px;
  position: relative;
  z-index: 2; /* Keeps image above the dots */
}

/* 2. The Dot Matrix Background */
.image-wrapper {
  position: relative;
  display: inline-block;
}

.image-wrapper::before {
  content: "";
  position: absolute;
  /* Adjust these to shift the pattern further out or in */
  bottom: -25px; 
  left: -25px;
  width: 150px;
  height: 150px;
  z-index: 1; /* Sits completely behind the image */
  
  /* CSS-only repeating dot pattern */
  background-image: radial-gradient(#9ca3af 20%, transparent 20%);
  background-position: 0 0;
  background-size: 12px 12px; /* Controls dot density */
  
  /* Smooth mask to give it that organic, rounded outline shape */
  border-radius: 40%; 
}

/* 3. The Floating Blurred Triangle */
.decorative-triangle {
  position: absolute;
  top: 10px;
  left: 10px;
  width: 0;
  height: 0;
  /* Creates a sharp CSS triangle pointing downwards/right */
  border-left: 25px solid transparent;
  border-right: 25px solid transparent;
  border-top: 45px solid #1e3a8a; /* Dark blue color */
  
  /* Rotates and blurs the triangle slightly to mimic the graphic */
  transform: rotate(-15deg);
  filter: blur(2px);
  z-index: 3; /* Floating slightly over or level with the image bounds */
  opacity: 0.85;
}
.main-image {
  display: block;
  width: 100%;
  max-width: 500px;
  height: auto;

  /* Matches the asymmetrical curves of image_fb7fd9.jpg */
  /* Top-Left: 0 | Top-Right: 80px | Bottom-Right: 20px | Bottom-Left: 80px */
  border-radius: 0 80px 20px 80px;

  /* Optional: Add a subtle shadow to make it pop like the original */
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  position: relative;
  z-index: 2;
}/* End custom CSS */