@charset "UTF-8";
@media all and (min-width: 768px) {
  .content-distributor.content-col {
    width: 100%; } }

@media all and (min-width: 1024px) {
  .content-distributor.content-col {
    width: 83.333333333%; } }

@media all and (min-width: 1266px) {
  .content-distributor.content-col {
    width: 83.333333333%; } }

.content-distributor .wrap {
  display: flex;
  flex-direction: column;
  gap: 60px;
  align-items: center; }
  @media (min-width: 768px) {
    .content-distributor .wrap {
      flex-wrap: wrap;
      flex-direction: row;
      justify-content: center; } }
  @media (min-width: 1024px) {
    .content-distributor .wrap {
      flex-direction: row;
      align-items: flex-start; } }
  @media (min-width: 1265px) {
    .content-distributor .wrap {
      gap: 65px;
      flex-wrap: nowrap; } }
  .content-distributor .wrap .item {
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center; }
    @media (min-width: 768px) {
      .content-distributor .wrap .item {
        flex: 0 0 45%;
        /* Jedes Kind exakt 1/3 */ } }
    @media (min-width: 1265px) {
      .content-distributor .wrap .item {
        flex: 0 0 33.333%;
        /* Jedes Kind exakt 1/3 */ } }
    .content-distributor .wrap .item h2 {
      margin-top: 1.875rem; }
      @media (min-width: 1265px) {
        .content-distributor .wrap .item h2 {
          margin-top: clamp(1.875rem, calc(0.66rem + 1.54vw), 3.125rem); } }
    .content-distributor .wrap .item .image-wrap {
      width: 14.75rem;
      height: 14.75rem;
      border-radius: 50%;
      overflow: hidden;
      position: relative; }
      @media (min-width: 1265px) {
        .content-distributor .wrap .item .image-wrap {
          width: clamp(14.75rem, calc(0.18rem + 18.44vw), 29.6875rem);
          height: clamp(14.75rem, calc(0.18rem + 18.44vw), 29.6875rem); } }
      .content-distributor .wrap .item .image-wrap img {
        width: 100%;
        /* Bild füllt Container aus */
        height: 100%;
        object-fit: cover;
        /* Wichtig für runde Bilder */
        position: absolute;
        /* Beide Bilder übereinander */
        top: 0;
        left: 0;
        transition: transform 0.6s ease, opacity 0.6s ease;
        /* Smooth transitions */ }
      .content-distributor .wrap .item .image-wrap .hover {
        opacity: 0; }
    .content-distributor .wrap .item:hover img {
      transform: scale(1.2); }
      .content-distributor .wrap .item:hover img.def {
        opacity: 0; }
      .content-distributor .wrap .item:hover img.hover {
        opacity: 1; }

.dark_green .content-distributor h2 {
  color: #fff !important; }

.light_green .content-distributor h2 {
  color: #09372A !important; }

/*# sourceMappingURL=distributor.css.map */