/* =============================================================================
   Text, Akkordeon & 2 Bilder — Text links, zwei versetzte Bilder rechts.
   Akkordeon-Styles kommen aus faq.css.
   ========================================================================== */

@scope (.about-me) {
  .footer_spacing-block2 {
    width: 100%;
    padding-bottom: 2rem;
  }

  .bento-wrap {
    display: grid;
    flex: 0 100%;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    gap: 16px;
  }

  .bento-left,
  .bento-left > img {
    align-self: end;
  }

  .bento-left {
    height: auto;
    padding-top: 5rem;
  }

  .portrait {
    aspect-ratio: 282 / 330;
  }

  @media (width <= 991px) {
    .bento-wrap {
      width: 80%;
    }

    .bento-left {
      padding-top: 5rem;
    }
  }

  @media (width <= 767px) {
    .footer_spacing-block2 {
      padding-bottom: 1.5rem;
    }

    .bento-left {
      padding-top: 4rem;
    }
  }

  @media (width <= 479px) {
    .bento-wrap {
      width: 100%;
      gap: 12px;
    }

    .bento-left {
      padding-top: 3rem;
    }
  }
}
