/* Methodology: readable overview first, detailed rules on demand. */
.sp-method { overflow-wrap: break-word; }
.sp-method-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.sp-method-heading h2 { margin-bottom: 14px; }
.sp-method .sp-method-date { flex: none; margin: 3px 0 0; padding: 7px 10px; border: 1px solid #d8e4ec; border-radius: 6px; color: #52677b; font-size: 12px; white-space: nowrap; }
.sp-method-intro { max-width: 790px; color: #38536a; }
.sp-method-status { padding: 14px 17px; border-left: 3px solid #bf812a; border-radius: 0 8px 8px 0; background: #fff7e9; font-size: 13px; line-height: 1.7; color: #634a20; }
.sp-method-status strong { color: #634a20; }
.sp-method .sp-method-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0; list-style: none; padding: 0; margin: 26px 0 20px; border: 1px solid #d7e4ed; border-radius: 12px; overflow: hidden; background: #f5f9fc; }
.sp-method .sp-method-steps li { min-width: 0; margin: 0; padding: 20px; }
.sp-method-steps li+li { border-left: 1px solid #d7e4ed; }
.sp-method-number { display: inline-flex; width: 30px; height: 30px; justify-content: center; align-items: center; border-radius: 50%; background: #e0f0ef; color: #006e70; font-size: 14px; font-weight: 750; }
.sp-method .sp-method-steps h3 { margin: 13px 0 10px; font-size: 18px; line-height: 1.35; letter-spacing: -.015em; }
.sp-method .sp-method-steps p { margin: 0; font-size: 14px; line-height: 1.65; color: #38536a; }
.sp-method-tip { font-size: 13px; line-height: 1.7; padding-left: 13px; border-left: 3px solid #009397; color: #38536a; }
.sp-method-tip strong { color: #142e4b; }
.sp-method-comparison { margin: 27px 0 25px; }
.sp-method .sp-method-comparison h3 { margin: 0 0 10px; font-size: 20px; }
.sp-method-comparison>p { font-size: 14px; color: #38536a; max-width: 790px; }
.sp-method .sp-method-equation { display: flex; align-items: center; gap: 12px; max-width: none; padding: 15px 18px; margin: 16px 0 0; border-radius: 9px; background: #edf7f6; font-size: 13px; line-height: 1.45; }
.sp-method-equation span { flex: 1 1 0; }
.sp-method-equation b { color: #007779; font-size: 22px; font-weight: 500; }
.sp-method-equation strong { flex: 1.3 1 0; color: #126466; }
.sp-method.sp-section>.sp-method-detail { padding: 0; border-top: 1px solid #d7e4ed; }
.sp-method-detail>summary { padding: 18px 28px 18px 0; position: relative; list-style: none; font-size: 15px!important; color: #142e4b; }
.sp-method-detail>summary::-webkit-details-marker { display: none; }
.sp-method-detail>summary::after { content: '+'; position: absolute; right: 3px; top: 14px; color: #087f83; font-size: 23px; font-weight: 450; }
.sp-method-detail[open]>summary::after { content: '−'; }
.sp-method-detail[open] { padding-bottom: 18px!important; }
.sp-method-detail dl { margin: 0; padding: 0 0 0 17px; border-left: 2px solid #d8e9e8; }
.sp-method-detail dl>div+div { margin-top: 17px; }
.sp-method-detail dt { color: #142e4b; font-size: 14px; line-height: 1.5; font-weight: 750; margin-bottom: 4px; }
.sp-method-detail dd { color: #38536a; font-size: 14px; line-height: 1.75; margin: 0; }
.sp-method.sp-section>.sp-method-detail p { margin: 0 0 12px; color: #38536a; font-size: 14px; line-height: 1.75; }
.sp-method.sp-section>.sp-method-detail p:last-child { margin: 0; }
.sp-method-data { border-top: 1px solid #d7e4ed; padding-top: 18px; margin-top: 2px; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 12px; line-height: 1.6; }
.sp-method-data>span { width: 100%; font-weight: 650; color: #52677b; }
.sp-method-data a { min-height: 32px; display: inline-flex; align-items: center; }
@media(max-width:900px) {
  .sp-method-heading { display: block; }
  .sp-method .sp-method-date { display: inline-block; margin: 0 0 18px; padding: 0; border: 0; }
  .sp-method .sp-method-steps li { padding: 17px 15px; }
  .sp-method .sp-method-steps h3 { font-size: 17px; }
}
@media(max-width:680px) {
  .sp-method .sp-method-steps { grid-template-columns: 1fr; margin-top: 22px; }
  .sp-method .sp-method-steps li { display: flex; gap: 13px; padding: 18px 15px; }
  .sp-method-number { flex: none; width: 27px; height: 27px; font-size: 13px; }
  .sp-method-steps li+li { border-left: 0; border-top: 1px solid #d7e4ed; }
  .sp-method .sp-method-steps h3 { margin: 2px 0 7px; }
  .sp-method .sp-method-equation { display: grid; grid-template-columns: 22px minmax(0,1fr); gap: 9px 10px; padding: 15px; }
  .sp-method-equation span:first-child { grid-column: 2; }
  .sp-method-equation b { font-size: 21px; text-align: center; line-height: 1; }
  .sp-method-equation strong { font-size: 14px; }
  .sp-method-status { padding: 13px 14px; }
  .sp-method-status strong { display: block; margin-bottom: 3px; }
  .sp-method-detail>summary { font-size: 14px!important; }
  .sp-method-data { gap: 5px 15px; }
}
