/* When your nervous system is full: shared reflective-guide paper (reflective-guides.css) plus
   two pieces of its own:
   - "Learn your earlier signals" sits under a three-part gauge (sage, gold, brick) so the three
     check-ins read as one scale from available to overloaded; each card carries a numbered marker
     on its stretch of the gauge, so the order never depends on colour alone;
   - "What keeping your cool can sound like" is a stack of paper slips: the moment on a small
     label, the words to say in navy. */

/* ---------- the gauge ---------- */
.p-nervous .guide-sections .accordion-body .pg-gauge {
  position: relative; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; padding-top: 30px; margin-top: 10px;
  counter-reset: pg-gauge;
}
.p-nervous .guide-sections .accordion-body .pg-gauge::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 12px; border-radius: 12px;
  background: linear-gradient(90deg, var(--sage) 0 33.3%, var(--gold) 33.3% 66.6%, var(--brick) 66.6%);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .15);
}
.p-nervous .guide-sections .accordion-body .pg-gauge.pg-gauge > article { counter-increment: pg-gauge; --c: var(--sage); }
.p-nervous .guide-sections .accordion-body .pg-gauge.pg-gauge > article:nth-child(2) { --c: var(--gold); }
.p-nervous .guide-sections .accordion-body .pg-gauge.pg-gauge > article:nth-child(3) { --c: var(--brick); }
.p-nervous .guide-sections .accordion-body .pg-gauge.pg-gauge > article::after { /* the marker that ties the card to its stretch of the gauge */
  content: counter(pg-gauge); position: absolute; left: 50%; top: -37px; translate: -50% 0; width: 26px; height: 26px; border-radius: 50%;
  display: grid; place-items: center; background: #fff; box-shadow: 0 0 0 3px var(--c), 0 3px 6px -2px rgba(0, 0, 0, .3);
  font: 700 13px/1 var(--f-display); color: var(--navy);
}
.p-nervous .guide-sections .accordion-body .pg-gauge.pg-gauge > article h3 { font: 400 27px/1.1 var(--f-hand); letter-spacing: 0; }
.p-nervous .guide-sections .accordion-body .pg-gauge.pg-gauge > article:nth-child(1) h3 { color: var(--sage-ink); }
.p-nervous .guide-sections .accordion-body .pg-gauge.pg-gauge > article:nth-child(2) h3 { color: var(--gold-dark); }
.p-nervous .guide-sections .accordion-body .pg-gauge.pg-gauge > article:nth-child(3) h3 { color: var(--brick-ink); }
.p-nervous .guide-sections .accordion-body .pg-gauge.pg-gauge > article p:last-child { padding-top: 10px; border-top: 1px dashed #e2cf9d; }
@media (max-width: 720px) {
  .p-nervous .guide-sections .accordion-body .pg-gauge { grid-template-columns: 1fr; padding-top: 0; padding-left: 28px; gap: 22px; }
  .p-nervous .guide-sections .accordion-body .pg-gauge::before { right: auto; bottom: 0; width: 10px; height: auto; background: linear-gradient(180deg, var(--sage) 0 33.3%, var(--gold) 33.3% 66.6%, var(--brick) 66.6%); }
  .p-nervous .guide-sections .accordion-body .pg-gauge.pg-gauge > article::after { left: -36px; top: 20px; translate: 0 0; }
}

/* ---------- the slips of words ---------- */
.p-nervous .guide-sections ul.pg-scripts { list-style: none; margin: 16px 0 10px; padding: 0; display: grid; gap: 12px; }
.p-nervous .guide-sections ul.pg-scripts > li {
  position: relative; margin: 0; padding: 14px 18px 14px 20px; border-radius: 4px 14px 14px 4px; background: #fffaf0;
  box-shadow: inset 4px 0 0 var(--gold), 0 12px 20px -16px rgba(60, 40, 10, .55); font-size: 17px; line-height: 1.55; color: var(--navy);
}
.p-nervous .guide-sections ul.pg-scripts > li:nth-child(even) { box-shadow: inset 4px 0 0 var(--blue), 0 12px 20px -16px rgba(60, 40, 10, .55); }
.p-nervous .guide-sections ul.pg-scripts > li > strong:first-child {
  display: block; margin-bottom: 4px; font: 800 12px/1.4 var(--f-body); letter-spacing: .07em; text-transform: uppercase; color: var(--muted);
}