/* Scoped static preparation guide. Shared site and Resources styles remain unchanged. */
.demo-prep-hero { padding-bottom: 2.5rem; }
.demo-prep-hero-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.demo-prep-hero h1 { max-width: 17ch; font-size: clamp(2.55rem, 4.7vw, 4.45rem); text-wrap: balance; }
.demo-prep-hero .lead { max-width: 61ch; }
.demo-prep-scene { margin: 0; border: 1px solid #34495e; border-radius: 1rem; overflow: hidden; background: #10263b; }
.demo-prep-scene img { width: 100%; height: auto; }
.demo-prep-scene figcaption { padding: .9rem 1.1rem; color: #c5d4df; font-size: .9rem; }
.demo-prep-pain { margin: 1.1rem 0 1.25rem; padding: 1.1rem 1.3rem; color: #ffc1aa; border: 1px solid #573a3b; border-left: 4px solid #ff8f71; border-radius: 0 .65rem .65rem 0; background: #231e29; }
.demo-prep-pain p { margin: 0; font-size: clamp(1.05rem, 1.5vw, 1.22rem); font-weight: 700; line-height: 1.5; }
.demo-prep-pain .demo-prep-pain-label { margin-bottom: .55rem; font-size: .72rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; color: #ffad92; }
.demo-prep-opening { margin: 2.5rem 0 0; max-width: 68rem; }
.demo-prep-opening > p:last-child { font-size: clamp(1.2rem, 2vw, 1.6rem); }
.demo-prep-layout { display: grid; grid-template-columns: minmax(210px, .32fr) minmax(0, 1fr); gap: clamp(1.5rem, 3.5vw, 3.5rem); align-items: start; }
.demo-prep-sidebar { min-width: 0; position: sticky; top: 6.5rem; }
.demo-prep-contents h2 { color: #c8f000; }
.demo-prep-contents ol { columns: 1; }
.demo-prep-contents li::marker { color: #c8f000; font-weight: 750; }
.demo-prep-article { min-width: 0; color: #c5d4df; }
.demo-prep-intro h2, .demo-prep-cta h2 { color: #f5f8fb; font-size: clamp(1.65rem, 2.4vw, 2.25rem); }
.demo-prep-intro p { max-width: 68ch; margin-bottom: .9rem; }
.demo-prep-step { padding: 1.65rem; margin-bottom: 1.4rem; border: 1px solid #34495e; border-radius: .9rem; background: #0b1928; }
.demo-prep-step h2 { display: flex; align-items: flex-start; gap: .85rem; margin: 0 0 1.25rem; color: #f5f8fb; font-size: clamp(1.35rem, 2vw, 1.8rem); line-height: 1.3; scroll-margin-top: 6.5rem; }
.demo-prep-number { color: #c8f000; font-size: .9rem; line-height: 1.8; letter-spacing: .05em; padding-top: .1rem; flex-shrink: 0; }
.demo-prep-points { margin: 0; padding-left: 1.2rem; list-style: disc; }
.demo-prep-points li { padding: .65rem .2rem; line-height: 1.65; }
.demo-prep-points li + li { border-top: 1px solid #263d52; }
.demo-prep-points li::marker { color: #c8f000; }
.demo-prep-cta { padding: 1.75rem 0 0; }
.demo-prep-cta h2 { margin-top: .25rem; }
.demo-prep-cta p { max-width: 62ch; }
@media (max-width: 1000px) {
 .demo-prep-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, .6fr); gap: 2rem; }
 .demo-prep-layout { grid-template-columns: 1fr; }
 .demo-prep-sidebar { position: static; }
 .demo-prep-contents ol { columns: 2; column-gap: 2rem; }
 .demo-prep-sidebar .resource-related { display: none; }
}
@media (max-width: 700px) {
 .demo-prep-hero-grid { grid-template-columns: 1fr; gap: 1.75rem; }
 .demo-prep-hero h1 { font-size: clamp(2.3rem, 8vw, 3.3rem); max-width: 18ch; }
 .demo-prep-scene { max-width: 26rem; }
 .demo-prep-opening { margin-top: 1.5rem; }
 .demo-prep-step { padding: 1.2rem; }
 .demo-prep-pain { padding: 1rem; }
}
@media (max-width: 440px) {
 .demo-prep-contents ol { columns: 1; }
 .demo-prep-step { padding: 1rem; }
 .demo-prep-step h2 { gap: .65rem; }
}
@media print {
 .demo-prep-sidebar, .demo-prep-scene, .demo-prep-cta, .breadcrumbs { display: none !important; }
 .demo-prep-hero, .demo-prep-reading { padding: 0 !important; }
 .demo-prep-hero-grid, .demo-prep-layout { display: block; }
 .demo-prep-hero h1 { max-width: none; font-size: 25pt; }
 .demo-prep-hero .lead { font-size: 11pt; }
 .demo-prep-opening { margin: .6rem 0 1rem; }
 .demo-prep-intro { margin: 1rem 0; }
 .demo-prep-step { break-inside: avoid; padding: .7rem 1rem; margin-bottom: .7rem; background: #fff !important; border-color: #888; }
 .demo-prep-step h2 { font-size: 15pt; margin-bottom: .4rem; }
 .demo-prep-pain { padding: .5rem .7rem; margin: .5rem 0; border-color: #888; background: #fff !important; }
 .demo-prep-pain p { font-size: 10.5pt; }
 .demo-prep-pain .demo-prep-pain-label { font-size: 8pt; margin-bottom: .2rem; }
 .demo-prep-points li { padding: .35rem .1rem; font-size: 10.5pt; }
}