.content-section {
    max-width: 1200px;
    margin: 20px auto;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    line-height: 1.6;
    padding: 20px;
    color: #333;
  }

  /* Desktop/Tablet: Text wraps around the image */
  .wrapped-image {
    float: left;
    width: 300px; /* Fixed or percentage width */
    max-width: 100%;
    height: auto;
    margin: 0 25px 15px 0;
    border-radius: 4px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  }

  /* Mobile: Text stacks below the image */
  @media screen and (max-width: 600px) {
    .wrapped-image {
      float: none;      /* Removes the wrap */
      display: block;   /* Makes it a block element */
      margin: 0 auto 20px auto; /* Centers the image */
      width: 100%;      /* Image takes full width */
    }
    
    h2 {
      text-align: center;
    }
  }

  /* Standard Clearfix */
  .clearfix::after {
    content: "";
    clear: both;
    display: table;
  }