/* ======================
  Base layout
========================= */

.node--type-listing.node--view-mode-full > .node__content {
  display: grid;
  gap: 16px;
  grid-template-columns:
    minmax(0, 22%)
    minmax(0, 1fr)
    minmax(0, 28%);
  grid-template-areas:
    "hero hero hero"
    "title title title"
    "left content right"
    "connect connect connect"
    "paragraphs paragraphs paragraphs";
  align-items: stretch;
}

.node--type-listing.node--view-mode-full > .node__content > #hero-gallery {
  grid-area: hero;
}

.node--type-listing.node--view-mode-full > .node__content > #title-container {
  grid-area: title;
}

.node--type-listing.node--view-mode-full > .node__content > #left-sidebar {
  grid-area: left;
}

.node--type-listing.node--view-mode-full > .node__content > #content-container {
  grid-area: content;
}

.node--type-listing.node--view-mode-full > .node__content > #right-sidebar {
  grid-area: right;
}

.node--type-listing.node--view-mode-full > .node__content > #connectbar {
  grid-area: connect;
}

.node--type-listing.node--view-mode-full > .node__content > #paragraphs-container {
  grid-area: paragraphs;
}

@media (max-width: 980px) {
.node--type-listing.node--view-mode-full > .node__content {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "hero hero"
      "title title"
      "left right"
      "content content"
      "paragraphs paragraphs";
  }
}


/* ======================
  Title container
  ======================= */

#title-container {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr) 200px;
  grid-template-areas:
    "left center right";
  column-gap: 32px;
  align-items: center;
  width: 100%;
  min-height: 150px;
}
@media (max-width: 1200px) {
  #title-container {
  grid-template-columns: 50% 50%;
  grid-auto-rows: minmax(150px, auto);
  grid-template-areas:
    "left right"
    "center center";
}
}


/* LEFT COLUMN – organizer */
#title-container .field--name-field-organization-ref {
  grid-area: left;
  justify-self: start;
  align-self: center;
  vertical-align: top;
}

#title-container .column-title-center {
  grid-area: center;
  text-align: center;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
/* RIGHT COLUMN – local tasks */
#title-container .column-right {
  grid-area: right;
  justify-self: end;
  align-self: center;
}

/* remove default heading margins */
#title-container h1,
#title-container h3 {
  margin: 0;
}



/* ====================
  Sidebars
======================= */

.page-node-type-listing #left-sidebar {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  max-height: 850px;
  align-items: center;             /* horizontal: center content */
  text-align: center;   
}
.page-node-type-listing #right-sidebar {
  padding-left: 20px;
  text-align: center;
}