.method-mechanism { border-top: 1px solid var(--color-border); }
.method-mechanism__loop { list-style: none; counter-reset: step; display: grid; gap: 1rem; padding: 0; margin: 0 0 3rem; }
.method-mechanism__loop li { counter-increment: step; padding: 1.25rem; border-radius: .6rem; background: var(--color-primary-soft); font-weight: 600; }
.method-mechanism__loop li::before { content: counter(step, decimal-leading-zero); display: block; font-size: .75rem; margin-bottom: .8rem; }
.method-mechanism__grid { display: grid; gap: 2rem; }
.method-mechanism__grid article { border-top: 1px solid var(--color-border); padding-top: 1.5rem; }
.method-mechanism__grid h3 { margin-bottom: 1rem; }
.method-mechanism__grid p { color: var(--color-muted); }
.method-mechanism__note { margin-top: 2.5rem; color: var(--color-muted); font-size: .8rem; max-width: 55rem; }
@media (min-width: 40rem) { .method-mechanism__loop { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 60rem) { .method-mechanism__loop { grid-template-columns: repeat(4, 1fr); } .method-mechanism__grid { grid-template-columns: repeat(3, 1fr); } }

.method-mechanism--compact .section-heading { margin-bottom:0; }

.method-mechanism--embedded { padding:0; border:0; }
.method-mechanism--embedded > .container { width:100%; margin:0; }
.method-mechanism--embedded .section-heading { max-width:none; margin:0; }

.method-mechanism__title-highlight { color:#a34c0b; background:#fff1cc; border-radius:.12em; box-decoration-break:clone; -webkit-box-decoration-break:clone; }

/* Full method presentation; the compact homepage introduction stays unchanged. */
.method-mechanism:not(.method-mechanism--compact) .method-mechanism__header { margin-bottom: 2.5rem; }
.method-mechanism__header--split { display: grid; gap: 2rem; align-items: start; }
.method-mechanism__header--split .section-heading { max-width: none; margin: 0; }
.method-mechanism__summary { padding: clamp(1.25rem, 2.5vw, 2rem); border: 1px solid #edf1ed; border-radius: 1.25rem; background: linear-gradient(130deg, #f4f7f5, #f8faf9); display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); gap: 1rem; }
.method-mechanism__summary .eyebrow { font-size: .65rem; letter-spacing: .08em; line-height: 1.6; margin-bottom: .75rem; }
.method-mechanism__summary h3 { font-size: clamp(1.15rem, 1.6vw, 1.5rem); line-height: 1.3; margin: 0; }
.method-mechanism__summary > p { grid-column: 1 / -1; margin: 0; font-size: .95rem; line-height: 1.65; color: var(--color-muted); }
.method-mechanism__icon { width: 2.75rem; height: 2.75rem; border-radius: .9rem; display: grid; place-items: center; background: #f0f5f2; color: #385347; flex: none; }
.method-mechanism__icon svg { width: 1.5rem; height: 1.5rem; }
.method-mechanism__loop { gap: 1.5rem; margin-bottom: 1.5rem; }
.method-mechanism__loop li { position: relative; display: flex; align-items: start; gap: 1rem; border: 1px solid #edf2ee; border-radius: 1rem; background: linear-gradient(130deg, #f3f7f4, #f7f9f8); padding: 1.25rem; }
.method-mechanism__loop li::before { display: none; }
.method-mechanism__step-number { display: grid; place-items: center; flex: none; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: #fff; font-size: .9rem; }
.method-mechanism__step-copy { display: grid; gap: .75rem; line-height: 1.35; }
.method-mechanism__step-copy svg { width: 1.5rem; height: 1.5rem; color: #385347; }
.method-mechanism__grid { gap: 1.5rem 2rem; }
.method-mechanism__grid article { display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); gap: 1rem; padding-top: 1.5rem; }
.method-mechanism__grid h3 { font-size: 1.1rem; line-height: 1.35; margin: .2rem 0 .85rem; }
.method-mechanism__grid p { font-size: .95rem; line-height: 1.6; margin: 0; }
@media (min-width: 60rem) {
 .method-mechanism__header--split { grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: 2.5rem; }
 .method-mechanism__loop li:not(:last-child)::after { content: ''; position: absolute; height: 1px; width: 1.5rem; background: #bdcdbf; left: 100%; top: 50%; }
 .method-mechanism__grid article:not(:nth-child(3n)) { border-right: 1px solid #e3ebe5; padding-right: 1.5rem; }
}
@media (min-width: 40rem) and (max-width: 59.999rem) { .method-mechanism__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
