/*  SUBMISSIONS MAIN - TOP BLOCK  */

   /* Desktop / wide layout */
.submissions-top {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  justify-content: center;   /* center the pair horizontally */
  align-items: center;       /* 1) vertical middle alignment */
}

.submissions-top__text {
  flex: 2 1 60%;
}

.submissions-top__map {
  flex: 1 1 30%;
  display: flex;             /* center the map inside its column */
  justify-content: center;
}

/* Narrow layout / stacked */
@media (max-width: 800px) {
  .submissions-top {
    flex-direction: column;
    align-items: center;     /* 2) center blocks when stacked */
    text-align: center;      /* center the text block content */
  }

  .submissions-top__text,
  .submissions-top__map {
    flex: 0 0 auto;
    width: 100%;
  }

  .submissions-top__map iframe {
    display: block;
    margin: 0 auto;         /* make sure the iframe centers */
  }
}

/* ---------- DESKTOP: side-by-side ---------- */

.submissions-top {
  display: flex !important;          /* force flex */
  flex-wrap: nowrap;
  justify-content: center;           /* center the pair horizontally */
  align-items: center;               /* 1) vertical middle alignment */
  gap: 1.5rem;
}

/* Two columns: ~2/3 text, ~1/3 map */
.submissions-top__text {
  flex: 2 1 60%;
}

.submissions-top__map {
  flex: 1 1 30%;
  display: flex;
  justify-content: center;           /* center map inside its column */
}

/* Catch iframe even if it's wrapped in a <p> etc. */
.submissions-top__map iframe {
  display: block;
  margin: 0 auto;
}

/* ---------- MOBILE: stacked & centered ---------- */

@media (max-width: 800px) {
  .submissions-top {
    flex-direction: column;
    align-items: center;             /* 2) center blocks when stacked */
    text-align: center;              /* center text content */
  }

  .submissions-top__text,
  .submissions-top__map {
    flex: 0 0 auto;
    width: 100%;
  }

  .submissions-top__text > * {
    margin-left: auto;
    margin-right: auto;
  }

  .submissions-top__map iframe {
    max-width: 100%;
    height: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
}