/* Nine-slice paper frame keeps the supplied artwork around live, accessible text. */
.concept { padding: 64px 4%; background: #fff; scroll-margin-top: 106px; }
.concept-inner { max-width: 1240px; margin-inline: auto; container-type: inline-size; }
.concept-paper {
  border-style: solid;
  border-color: transparent;
  border-width: 33.5cqw 10.4cqw 22.7cqw;
  border-image-source: url('assets/concept-paper.png');
  border-image-slice: 420 130 285 130 fill;
  border-image-repeat: stretch;
}
.concept-content { padding: 4px 4% 20px; position: relative; }
.concept h2 { margin: 0 0 32px; font-family: var(--serif); font-size: clamp(28px, 4cqw, 50px); font-weight: 400; line-height: 1.7; letter-spacing: .025em; color: #293f40; }
.concept-body { font-family: var(--serif); font-size: 16px; line-height: 2; letter-spacing: .025em; color: #3c4747; }
.concept-body p { margin: 0; }
.concept-body .concept-intro { margin-top: 18px; }
.concept-questions { list-style: none; margin: 15px 0; padding: 0 0 0 18px; border-left: 1px solid #a3cdd0; }
.concept-questions li { line-height: 2; }
.concept-body .concept-statement { margin-top: 24px; font-size: 20px; line-height: 1.9; color: #294e50; }
.concept-body .concept-closing { margin-top: 20px; }
@media (min-width: 1050px) {
  .concept-content { display: grid; grid-template-columns: .95fr 1fr; gap: 32px; padding-inline: 2%; }
  .concept h2 { font-size: clamp(30px, 3.2cqw, 40px); letter-spacing: 0; align-self: center; margin-bottom: 0; }
}
@media (max-width: 640px) {
  .concept { padding: 40px 0 56px; scroll-margin-top: 82px; }
  .concept-content { padding: 12px 3% 28px; }
  .concept h2 { font-size: clamp(22px, 5.8cqw, 34px); line-height: 1.8; letter-spacing: 0; margin-bottom: 26px; }
  .concept-body { font-size: 16px; line-height: 2.1; letter-spacing: 0; }
  .concept-body .concept-statement { font-size: 18px; }
  .concept-questions { padding-left: 9px; }
}
