.methodology-page { background: var(--color-background); }
.methodology-hero { border-bottom: 1px solid var(--color-border); background: radial-gradient(circle at 80% 18%, rgb(52 214 255 / .08), transparent 32rem), var(--color-background); }
.methodology-hero__inner { padding-block: clamp(5rem, 9vw, 8rem) clamp(3.5rem, 7vw, 6rem); }
.methodology-back { display: inline-block; margin-bottom: var(--space-8); color: var(--color-cyan); font-size: var(--text-sm); font-weight: 600; text-decoration: none; }
.methodology-back:hover, .methodology-prose a:hover, .methodology-jump a:hover { color: var(--color-mint); }
.methodology-hero h1 { max-width: 13ch; font-size: clamp(3rem, 7vw, 5.75rem); line-height: 1.08; letter-spacing: -.03em; }
.methodology-hero__inner > p { max-width: 63ch; margin-top: var(--space-6); color: var(--color-text-secondary); font-size: clamp(1.125rem, 1rem + .5vw, 1.4rem); line-height: 1.55; }
.methodology-jump { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-6); margin-top: var(--space-12); }
.methodology-jump a { color: var(--color-text); font-size: var(--text-sm); text-decoration-thickness: 1px; text-underline-offset: .3em; }
.methodology-section { padding-block: clamp(var(--space-16), 8vw, var(--space-30)); }
.methodology-section--technical { background: var(--color-surface); border-block: 1px solid var(--color-border); }
.methodology-layout { display: grid; grid-template-columns: minmax(12rem, 18rem) minmax(0, 46rem); justify-content: center; align-items: start; gap: clamp(var(--space-8), 6vw, var(--space-20)); }
.methodology-section__heading { position: sticky; top: 6rem; }
.methodology-section__heading h2 { font-size: clamp(1.75rem, 2.5vw, 2.5rem); line-height: 1.16; }
.methodology-section__heading p { margin-top: var(--space-4); color: var(--color-text-secondary); line-height: 1.5; }
.methodology-prose { min-width: 0; color: var(--color-text-secondary); line-height: 1.72; }
.methodology-prose p + p { margin-top: var(--space-4); }
.methodology-prose a { color: var(--color-cyan); text-underline-offset: .2em; }
.methodology-prose h3 { color: var(--color-text); font-size: var(--text-xl); line-height: 1.3; }
.methodology-lead { color: var(--color-text); font-size: clamp(1.1rem, 1rem + .35vw, 1.3rem); }
.methodology-steps { margin-block: var(--space-12); border-top: 1px solid var(--color-border); }
.methodology-steps > div { display: grid; grid-template-columns: minmax(10rem, 14rem) 1fr; gap: var(--space-6); padding-block: var(--space-6); border-bottom: 1px solid var(--color-border); }
.methodology-steps h3 { font-size: var(--text-lg); }
.methodology-key-point { padding: var(--space-8); background: var(--color-surface-elevated); border-radius: var(--radius-md); }
.methodology-key-point strong { display: block; margin-bottom: var(--space-3); color: var(--color-mint); font-family: var(--font-display); font-size: var(--text-lg); }
.methodology-technical > section + section { margin-top: var(--space-12); padding-top: var(--space-12); border-top: 1px solid var(--color-border); }
.methodology-technical h3 { margin-bottom: var(--space-4); }
.methodology-prose code { color: var(--color-text); font-size: .94em; overflow-wrap: anywhere; }
.methodology-use-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-8); margin-bottom: var(--space-12); }
.methodology-use-grid > div { border-top: 1px solid var(--color-border); padding-top: var(--space-6); }
.methodology-prose ul { margin-top: var(--space-4); padding-left: 1.25rem; }
.methodology-prose li + li { margin-top: var(--space-2); }
.methodology-references { margin-top: var(--space-12); padding-top: var(--space-8); border-top: 1px solid var(--color-border); }
.methodology-references h3 { margin-bottom: var(--space-3); }
@media (max-width: 52rem) { .methodology-layout { grid-template-columns: 1fr; gap: var(--space-8); } .methodology-section__heading { position: static; } }
@media (max-width: 36rem) { .methodology-steps > div, .methodology-use-grid { grid-template-columns: 1fr; gap: var(--space-3); } .methodology-hero__inner { padding-top: var(--space-16); } }