/* CONTAINER QUERIES FOR RESPONSIVE POPOVER */
@container popover (min-width: 600px) {
  /* Large: Two columns with biography */
  .contact-popover__grid {
    grid-template-columns: 1fr 2fr;
    gap: var(--space-lg);
  }

  .contact-popover {
    max-width: 33vw;
    width: auto;
  }
}

@container popover (min-width: 400px) and (max-width: 599px) {
  /* Medium: Two columns without biography */
  .contact-popover__grid {
    grid-template-columns: 1fr 2fr;
    gap: var(--space-md);
  }

  .contact-popover__description {
    display: none;
  }

  .contact-popover {
    max-width: 60vw;
    width: auto;
  }
}

@container popover (max-width: 399px) {
  /* Small: Single column stacked */
  .contact-popover__grid {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .contact-popover__image {
    max-width: 200px;
    margin: 0 auto;
  }

  .contact-popover {
    width: 90vw;
    margin: var(--space-md);
  }
}
