/* Shared front-end and Gutenberg FAQ sections. */
@font-face {
  font-family: Montserrat;
  src: url("../fonts/Montserrat%5Bwght%5D.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
:is(body.single-post .sp-content, .editor-styles-wrapper) :is(.narrow-article-faq, .is-style-narrow-faq) {
  --narrow-faq-answer-inset: clamp(1rem, 2.5vw, 1.5rem);
  position: relative;
  margin: 3.5rem 0;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid rgba(255, 120, 79, .22);
  border-radius: 22px;
  background: rgba(255, 120, 79, .025);
}
:is(body.single-post .sp-content, .editor-styles-wrapper) :is(.narrow-article-faq, .is-style-narrow-faq)::after {
  content: '?';
  position: absolute;
  top: .9rem;
  right: clamp(1rem, 2vw, 1.5rem);
  color: #ff784f;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 4.25rem;
  font-weight: 750;
  line-height: 1;
  opacity: .85;
  pointer-events: none;
}
:is(body.single-post .sp-content, .editor-styles-wrapper) :is(.narrow-article-faq, .is-style-narrow-faq) h2.wp-block-heading {
  margin-top: 0;
  padding-right: 4rem;
}
:is(body.single-post .sp-content, .editor-styles-wrapper) :is(.narrow-article-faq__item, .is-style-narrow-faq-item) {
  margin: 0;
  padding: 1.5rem 0;
  border: 0;
  border-bottom: 1px solid rgba(38, 35, 34, .11);
  border-radius: 0;
  background: transparent;
}
:is(body.single-post .sp-content, .editor-styles-wrapper) :is(.narrow-article-faq__item, .is-style-narrow-faq-item):last-child {
  padding-bottom: 0;
  border-bottom: 0;
}
:is(body.single-post .sp-content, .editor-styles-wrapper) :is(.narrow-article-faq, .is-style-narrow-faq) h3.wp-block-heading {
  margin: 0 0 .75rem;
  padding: 0;
  font-size: 1.25rem !important;
  font-weight: 650;
  line-height: 1.4;
}
:is(body.single-post .sp-content, .editor-styles-wrapper) :is(.narrow-article-faq, .is-style-narrow-faq) h3::before { content: none; }
:is(body.single-post .sp-content, .editor-styles-wrapper) :is(.narrow-article-faq, .is-style-narrow-faq) p {
  margin-left: var(--narrow-faq-answer-inset);
  font-size: inherit;
}
:is(body.single-post .sp-content, .editor-styles-wrapper) :is(.narrow-article-faq, .is-style-narrow-faq) :is(ul, ol) { margin-left: var(--narrow-faq-answer-inset); }
:is(body.single-post .sp-content, .editor-styles-wrapper) :is(.narrow-article-faq__item, .is-style-narrow-faq-item) p:last-child { margin-bottom: 0; }
/* Selecting the section style also works on a flat group of headings and answers. */
:is(body.single-post .sp-content, .editor-styles-wrapper) :is(.narrow-article-faq, .is-style-narrow-faq) > h3.wp-block-heading,
:is(body.single-post .sp-content, .editor-styles-wrapper) :is(.narrow-article-faq, .is-style-narrow-faq) > .wp-block-group__inner-container > h3.wp-block-heading {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(38, 35, 34, .11);
}
@media (max-width: 700px) {
  :is(body.single-post .sp-content, .editor-styles-wrapper) :is(.narrow-article-faq, .is-style-narrow-faq) { padding-inline: 1rem; }
  :is(body.single-post .sp-content, .editor-styles-wrapper) :is(.narrow-article-faq, .is-style-narrow-faq)::after {
    top: 1rem;
    right: 1rem;
    font-size: 3.5rem;
  }
  :is(body.single-post .sp-content, .editor-styles-wrapper) :is(.narrow-article-faq, .is-style-narrow-faq) h3.wp-block-heading { font-size: 1.125rem !important; }
}
