/*
 * Post Short Answer Block.
 * The long selectors beat the theme's global rule in assets/css/single.css:
 * section.single-post .section-inner .post-content * { ... }
 */
.post-short-answer-block,
section.single-post .section-inner .post-content .post-short-answer-block {
  width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-flow: column nowrap;
  align-items: flex-start;
  gap: 20px;
  padding: 24px 20px;
  margin-bottom: 24px;
  background: var(--post-short-answer-bg, #fff);
  border: 2px solid #023538;
  border-radius: 14px;
}

.post-short-answer-block__label,
section.single-post .section-inner .post-content .post-short-answer-block__label {
  width: 100%;
  margin: 0;
  color: #6f6440;
  font-family: 'Lato', sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: 1.28px;
  text-transform: uppercase;
  word-break: break-word;
}

.post-short-answer-block__body,
section.single-post .section-inner .post-content .post-short-answer-block__body {
  width: 100%;
  display: flex;
  flex-flow: column nowrap;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
}

.post-short-answer-block__content,
section.single-post .section-inner .post-content .post-short-answer-block__content {
  width: 100%;
  margin: 0;
  color: #3a3a3b;
  font-family: 'Lato', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  word-break: break-word;
}

.post-short-answer-block__content *,
section.single-post .section-inner .post-content .post-short-answer-block__content * {
  font-size: inherit;
  line-height: inherit;
}

.post-short-answer-block__content p,
section.single-post .section-inner .post-content .post-short-answer-block__content p {
  margin: 0;
}

.post-short-answer-block__content p + p,
section.single-post .section-inner .post-content .post-short-answer-block__content p + p {
  margin-top: 10px;
}

.post-short-answer-block__note,
section.single-post .section-inner .post-content .post-short-answer-block__note {
  max-width: 100%;
  box-sizing: border-box;
  margin: 0;
  padding: 0 4px;
  background: #fff4d6;
  border-radius: 4px;
  color: #5c4400;
  font-family: 'Lato', sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 18px;
  text-transform: capitalize;
}

/* Note style (Figma 10623:10426 / 10627:6103): pale yellow box, brown title, centred on mobile. */
.post-short-answer-block--note,
section.single-post .section-inner .post-content .post-short-answer-block--note {
  align-items: stretch;
  gap: 12px;
  margin-top: 20px;
  padding: 20px;
  background: var(--post-short-answer-bg, #fff8e6);
  border: 1px solid #e7c873;
  border-radius: 12px;
  text-align: center;
}

.post-short-answer-block--note .post-short-answer-block__label,
section.single-post .section-inner .post-content .post-short-answer-block--note .post-short-answer-block__label {
  color: #5c4400;
  font-size: 18px;
  line-height: 26px;
  letter-spacing: 0;
  text-transform: none;
}

.post-short-answer-block--note .post-short-answer-block__body,
section.single-post .section-inner .post-content .post-short-answer-block--note .post-short-answer-block__body {
  align-items: stretch;
}

@media (min-width: 768px) {
  .post-short-answer-block--note,
  section.single-post .section-inner .post-content .post-short-answer-block--note {
    padding: 32px;
    text-align: left;
  }

  .post-short-answer-block--note .post-short-answer-block__label,
  section.single-post .section-inner .post-content .post-short-answer-block--note .post-short-answer-block__label {
    font-size: 18px;
    line-height: 26px;
    letter-spacing: 0;
  }

  .post-short-answer-block__label,
  section.single-post .section-inner .post-content .post-short-answer-block__label {
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 1.44px;
  }

  .post-short-answer-block__content,
  section.single-post .section-inner .post-content .post-short-answer-block__content {
    font-size: 18px;
    line-height: 26px;
  }
}
