/* Learn: the /learn hub and guide pages (Nov 4, 2026). Loaded only on /learn routes. */
.route-copy.guide, .route-copy.learn-hub { max-width: 920px; }
.guide .breadcrumbs, .learn-hub .breadcrumbs { margin: 0 0 22px; font: 600 13px/1.4 var(--utility); color: rgba(255,255,255,.5); }
.guide .breadcrumbs a, .learn-hub .breadcrumbs a { color: rgba(255,255,255,.72); text-decoration: none; }
.guide .breadcrumbs a:hover, .learn-hub .breadcrumbs a:hover { color: #fff; }
.route-copy .guide-kicker { margin: 0 0 12px; font: 800 12px/1 var(--display); letter-spacing: .14em; text-transform: uppercase; color: #cbbaff; }
.route-copy.guide h1 { margin: 0 0 16px; font-size: clamp(34px, 5vw, 58px); line-height: 1.02; }
.route-copy .guide-meta { margin: 0 0 30px; font-size: 14px; color: rgba(255,255,255,.55); }
.guide-lead { display: grid; gap: 22px; margin: 0 0 36px; }
.guide-lead.has-video { grid-template-columns: minmax(0, 1fr) minmax(200px, 270px); align-items: start; }
@media (max-width: 760px) { .guide-lead.has-video { grid-template-columns: 1fr; } .guide-video { max-width: 320px; } }
.guide-answer { padding: 22px 24px; border-radius: 18px; background: rgba(124,77,255,.14); border: 1px solid rgba(203,186,255,.28); }
.route-copy .guide-answer h2 { margin: 0 0 8px; font: 800 12px/1 var(--display); letter-spacing: .14em; text-transform: uppercase; color: #cbbaff; }
.route-copy .guide-answer p { margin: 0; max-width: none; font-size: clamp(17px, 1.7vw, 20px); color: #fff; }
.guide-video { margin: 0; }
.guide-video video { display: block; width: 100%; aspect-ratio: 9 / 16; object-fit: cover; border-radius: 16px; background: #000; }
.guide-video figcaption { margin-top: 8px; font: 600 13px/1.4 var(--utility); color: rgba(255,255,255,.6); }
.guide-body h2 { margin-top: 46px; }
.guide-body h3 { margin: 26px 0 8px; font: 800 clamp(18px, 2vw, 22px)/1.25 var(--display); letter-spacing: -.01em; }
.guide-body ul, .guide-body ol { padding-left: 1.3em; }
.guide-body li { margin: 6px 0; }
.guide-body strong { color: #fff; }
.guide-body code { padding: .1em .35em; border-radius: 6px; background: rgba(255,255,255,.08); font: 500 .92em ui-monospace, SFMono-Regular, Menlo, monospace; }
.guide-faq { margin-top: 52px; padding-top: 6px; border-top: 1px solid rgba(255,255,255,.12); }
.guide-faq h3 { margin: 24px 0 6px; font: 800 clamp(17px, 1.8vw, 20px)/1.3 var(--display); color: #fff; }
.guide-cta { margin: 52px 0 0; padding: 28px clamp(20px, 3vw, 32px); border-radius: 22px; background: rgba(124,77,255,.16); border: 1px solid rgba(203,186,255,.3); }
.route-copy .guide-cta h2 { margin: 0 0 8px; }
.route-copy .guide-cta-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; margin: 20px 0 0; }
.route-copy .guide-cta .primary-action { margin: 0; }
.route-copy .guide-cta-link { font-weight: 700; }
.guide-next { margin-top: 52px; }
.guide-cards { list-style: none; margin: 16px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px; }
.route-copy .guide-cards li { max-width: none; margin: 0; }
.guide-cards a { display: flex; flex-direction: column; gap: 8px; height: 100%; box-sizing: border-box; padding: 18px 20px; border-radius: 16px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); text-decoration: none; transition: border-color .2s, transform .2s, background .2s; }
.guide-cards a:hover { border-color: rgba(203,186,255,.55); background: rgba(124,77,255,.12); transform: translateY(-2px); }
.guide-cards b { font: 800 17px/1.25 var(--display); letter-spacing: -.01em; color: #fff; }
.guide-cards span { font: 500 14px/1.45 var(--utility); color: rgba(255,255,255,.6); }
.guide-sources { margin-top: 40px; font: 500 14px/1.5 var(--utility); color: rgba(255,255,255,.55); }
.guide-sources summary { cursor: pointer; font-weight: 700; color: rgba(255,255,255,.72); }
.route-copy .guide-sources li { font-size: 14px; }
.route-copy .learn-intro { max-width: 60ch; font-size: clamp(18px, 2vw, 22px); color: rgba(255,255,255,.86); }
.learn-jump { display: flex; flex-wrap: wrap; gap: 10px; margin: 26px 0 6px; }
.route-copy .learn-jump a { padding: 9px 15px; border-radius: 999px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); color: #fff; text-decoration: none; font: 700 14px/1 var(--display); }
.route-copy .learn-jump a:hover { background: rgba(124,77,255,.22); }
.learn-cluster { margin-top: 48px; scroll-margin-top: 110px; }
.route-copy .learn-cluster > p { margin: 0 0 4px; }
/* Long-form reading: Satoshi body text instead of the utility mono (labels and meta keep the mono). */
.route-copy.guide p, .route-copy.guide li, .route-copy.learn-hub p, .guide-cards span { font-family: var(--body); font-weight: 500; letter-spacing: 0; }
.route-copy.guide .guide-body p, .route-copy.guide .guide-body li, .route-copy.guide .guide-faq p { font-size: clamp(17px, 1.45vw, 19px); line-height: 1.7; color: rgba(255,255,255,.84); }
.route-copy .guide-meta, .guide-video figcaption, .guide .breadcrumbs, .learn-hub .breadcrumbs { font-family: var(--utility); }
