/* ==========================================================
   Our Group accordion + generated pill nav
   Numbers come from CSS counters, so items renumber
   automatically when reordered in the editor.
   ========================================================== */

/* ---- heading area (optional; adjust to taste) ---- */
.acc-eyebrow {
  letter-spacing: 0.25em;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
}

/* ---- pill nav (built by our-group.js, inserted before .our-group) ---- */
.acc-pills {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  padding-bottom: 28px;
  border-bottom: 1px solid #ddd8cf;
  margin-bottom: 48px;
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}
.acc-pills button {
  appearance: none;
  cursor: pointer;
  background: transparent;
  border: 1px solid #c9c4ba;
  border-radius: 999px;
  padding: 9px 18px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: inherit;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.acc-pills button:hover { border-color: currentColor; }
.acc-pills button.is-active {
  background: #1d2521;
  border-color: #1d2521;
  color: #f2efe9;
}
.acc-pills button:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

/* ---- accordion ---- */
.our-group { counter-reset: acc-item; }

.our-group .wp-block-details {
  counter-increment: acc-item;
  border-bottom: 1px solid #ddd8cf;
  padding: 8px 0;
  margin: 0;
  scroll-margin-top: 90px; /* adjust if you have a taller sticky header */
}
.our-group .wp-block-details:first-of-type { border-top: 1px solid #ddd8cf; }

.our-group .wp-block-details > summary {
  list-style: none;                 /* hide default triangle (Firefox) */
  cursor: pointer;
  display: flex;
  align-items: baseline;
  gap: 20px;
  padding: 24px 8px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(22px, 3vw, 30px);
  line-height: 1.2;
}
.our-group .wp-block-details > summary::-webkit-details-marker { display: none; }

/* auto number */
.our-group .wp-block-details > summary::before {
  content: counter(acc-item, decimal-leading-zero);
  font-family: inherit;
  font-family: var(--wp--preset--font-family--body, sans-serif);
  font-size: 13px;
  color: #6c6a63;
  min-width: 24px;
}

/* +/- toggle */
.our-group .wp-block-details > summary::after {
  content: "+";
  margin-left: auto;
  font-family: var(--wp--preset--font-family--body, sans-serif);
  font-size: 26px;
  font-weight: 300;
  line-height: 1;
}
.our-group .wp-block-details[open] > summary::after { content: "\2212"; }

/* open-state title colour */
.our-group .wp-block-details[open] > summary { color: #b9776f; }

/* "coming soon" badge — add the class `coming-soon` to the Details block */
.our-group .coming-soon > summary .acc-badge-js {
  order: -1;
  font-family: var(--wp--preset--font-family--body, sans-serif);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #b9776f;
  border: 1px solid #b9776f;
  border-radius: 999px;
  padding: 4px 10px;
  align-self: center;
}

/* panel content: indent to align with titles */
.our-group .wp-block-details > *:not(summary) {
  padding: 0 8px 24px 52px;
  font-size: 15px;
  line-height: 1.65;
}
.our-group .acc-meta strong { font-size: 14px; }

@media (max-width: 700px) {
  .our-group .wp-block-details > *:not(summary) { padding-left: 8px; }
}

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}