*{
    margin: 0;
    padding: 0;
}
.cosection {
  width: 100%;
  height: 300px; /* fixed height */
  overflow: hidden;
  position: relative;
}

/* Responsive background image */
.cosection picture,
.cosection img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* ensures full coverage without distortion */
  object-position: center;
  display: block;
}


/* Responsive fine-tuning (optional visual tweaks) */
@media (max-width: 500px) {
  .cosection {
    height: 250px;
  }
}

@media (min-width: 1440px) {
  .cosection {
    height: 350px;
  }
}