/* Rak Stimot Flow – service areas page (/service-areas/, page-service-areas.php).
   Loaded after editorial.css and before accessibility-v17.css, so the accessibility overrides still win.
   Scoped to .rsf-areas-* plus one .home-contact-info rule for the shared contact section's link.
   Sizes are in rem so the accessibility text-size setting scales them; the panel and the list collapse
   to one column through rem-based minimum widths, not viewport breakpoints. Group blocks are matched
   with and without .wp-block-group__inner-container (WordPress adds it when there is no theme.json). */

/* ---------- Intro ---------- */
.rsf-areas-entry > .rsf-areas-lead {
  color: var(--ink);
  font-size: 1.1875rem;
  font-weight: 500;
  line-height: 1.65;
}
.rsf-areas-lead strong {
  color: var(--navy);
  font-weight: 800;
  background: linear-gradient(transparent 60%, rgba(254, 91, 136, .28) 0);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.rsf-areas-entry > .rsf-areas-intro { color: var(--muted); }

/* ---------- Panel: pastel band, white cards ---------- */
.rsf-areas-entry > .rsf-areas-panel {
  margin-top: 2.5rem;
  padding: clamp(1rem, 3vw, 2.5rem);
  border-radius: 1.75rem;
  background: var(--purple-l);
}
.rsf-areas-panel,
.rsf-areas-panel > .wp-block-group__inner-container {
  display: flex; flex-wrap: wrap; align-items: flex-start;
  gap: 1.25rem;
}
.rsf-areas-panel > .wp-block-group__inner-container { flex: 1 1 100%; min-width: 0; }
.rsf-areas-panel .rsf-areas-home,
.rsf-areas-panel .rsf-areas-places {
  min-width: 0;
  margin: 0;
  padding: clamp(1.25rem, 2.5vw, 2rem);
  border-radius: 1.25rem;
  background: #fff;
}
/* Side by side only while both minimum widths fit; at 320px or large text each takes a full row. */
.rsf-areas-panel .rsf-areas-home {
  flex: 1 1 16rem;
  border-inline-start: .375rem solid var(--cyan);
}
.rsf-areas-panel .rsf-areas-places { flex: 2.5 1 28rem; }

.rsf-areas-entry :where(.rsf-areas-home, .rsf-areas-places, .rsf-areas-next) > * + *,
.rsf-areas-entry :where(.rsf-areas-home, .rsf-areas-places, .rsf-areas-next) > .wp-block-group__inner-container > * + * {
  margin-top: .75rem;
}
.rsf-areas-entry .rsf-areas-home h2 {
  font-size: clamp(1.625rem, calc(1.3rem + 1.2vw * var(--a11y-scale, 1)), 2.25rem);
  line-height: 1.2;
}
.rsf-areas-entry .rsf-areas-home p { color: var(--ink); }
.rsf-areas-entry .rsf-areas-places h2 { font-size: 1.375rem; line-height: 1.35; }
.rsf-areas-entry .rsf-areas-note { color: var(--muted); font-size: .9375rem; line-height: 1.5; }

/* ---------- Localities: plain text grid, not links ---------- */
.rsf-areas-entry .rsf-areas-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 10.5rem), 1fr));
  gap: 0 1.75rem;
  margin-top: 1rem;
  padding: 0;
  list-style: disc;
}
.rsf-areas-entry .rsf-areas-list > li,
.rsf-areas-entry .rsf-areas-list > li + li {
  min-width: 0;
  margin-block: 0;
  margin-inline: 1.125em 0;
  padding-block: .625rem;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  font-weight: 500;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.rsf-areas-entry .rsf-areas-list > li::marker { color: var(--purple); }

/* ---------- Closing ---------- */
.rsf-areas-entry > .rsf-areas-next { margin-top: 3rem; }
.rsf-areas-entry .rsf-areas-next h2::before {
  content: "";
  display: block;
  width: 2.5rem; height: .25rem;
  margin-bottom: 1rem;
  border-radius: .25rem;
  background: var(--pink);
}
.rsf-areas-entry .rsf-areas-actions {
  display: flex; flex-wrap: wrap; gap: .75rem;
  margin-top: 1.25rem;
}
.rsf-areas-entry .rsf-areas-actions .btn { max-width: 100%; text-align: center; }
.rsf-areas-entry .rsf-areas-more { color: var(--muted); }

/* ---------- High contrast / forced colours ---------- */
html[data-a11y-contrast="high"] .rsf-areas-entry > .rsf-areas-panel { border: 2px solid var(--ink); background: #fff; }
html[data-a11y-contrast="high"] .rsf-areas-panel :where(.rsf-areas-home, .rsf-areas-places) { border: 2px solid var(--ink); }
html[data-a11y-contrast="high"] .rsf-areas-entry .rsf-areas-list > li { border-color: var(--ink); }
html[data-a11y-contrast="high"] .rsf-areas-lead strong { background: none; text-decoration: underline; text-underline-offset: .2em; }

@media (forced-colors: active) {
  .rsf-areas-entry > .rsf-areas-panel,
  .rsf-areas-panel :where(.rsf-areas-home, .rsf-areas-places) { border: 1px solid CanvasText; }
}

@media print {
  .rsf-areas-entry > .rsf-areas-panel { padding: 0; background: none; }
  .rsf-areas-panel :where(.rsf-areas-home, .rsf-areas-places) { border: 1px solid #000; }
}

/* ---------- Shared contact section (homepage and helper) ---------- */
/* The "where we go" link is a second value under the service area; -2 / -1 keeps it in the value
   column on wide rows and in the single column at narrow widths. */
.home-contact-info .home-contact-more { grid-column: -2 / -1; }
