/* Practical guides: adapters on top of /css/features.css, so they keep the features catalogue design. */
.editorial-guide-topline { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .25rem 1rem; margin: 0 0 .75rem; color: var(--muted); font-size: .84rem; }
.editorial-guide-topline .breadcrumb { min-width: 0; overflow-wrap: anywhere; }
.editorial-guide-topline a, .editorial-guide .related a { color: var(--primary); text-underline-offset: .2em; }
.editorial-guide-topline a { display: inline-flex; min-height: 44px; align-items: center; }
.editorial-language { margin: 0; }
.features-hero.is-text-only { min-height: auto; grid-template-columns: minmax(0, 1fr); }
.features-hero.is-text-only h1 { max-width: 22ch; }
.features-hero h1 { line-height: 1.04; }
.editorial-guide-figure { align-self: center; min-height: 0; margin: 0; }
.editorial-guide-figure img { display: block; width: 100%; height: auto; border: 1px solid #ffffff26; border-radius: 16px; box-shadow: 0 18px 40px #02061766; }
.editorial-guide-figure figcaption { margin-top: .6rem; color: var(--muted); font-size: .84rem; line-height: 1.45; }
.editorial-guide .features-section-nav strong { display: inline-flex; flex: 0 0 auto; align-items: center; padding: 0 .5rem; color: var(--subtle); font-size: .72rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.editorial-guide .features-section-nav a > span { display: inline-grid; width: 1.5rem; height: 1.5rem; place-items: center; border-radius: 50%; color: var(--primary); background: color-mix(in srgb, var(--primary) 12%, transparent); font-size: .72rem; }
.editorial-guide .feature-section-icon { font-size: 1.3rem; font-weight: 900; }
.editorial-guide .feature-section-heading { margin-bottom: 1.4rem; }
.editorial-guide .feature-section-heading h2 { max-width: 30ch; }
.editorial-guide .feature-card-grid.is-single { grid-template-columns: minmax(0, 1fr); }
.editorial-guide .feature-detail-card > p { margin: 0; color: var(--muted); font-size: .98rem; line-height: 1.7; }
.editorial-guide-example { margin: 0; border-color: color-mix(in srgb, #a78bfa 40%, var(--line)); background: linear-gradient(105deg, color-mix(in srgb, #a78bfa 12%, var(--surface)), var(--surface)); }
.editorial-guide-example > span { color: #c4b5fd; background: color-mix(in srgb, #a78bfa 15%, transparent); font-size: 1.5rem; }
.editorial-guide-example h2 { margin: 0; }
.editorial-guide-example p { max-width: 80ch; margin: .55rem 0 0; color: var(--muted); line-height: 1.65; }
.editorial-guide-faq { grid-template-columns: minmax(0, 1fr); gap: .75rem; }
.editorial-guide-faq summary { display: flex; min-height: 44px; align-items: center; cursor: pointer; font-weight: 800; line-height: 1.4; }
.editorial-guide-faq details[open] summary { color: var(--feature-accent); }
.editorial-guide-faq details > p { margin: .5rem 0 0; color: var(--muted); line-height: 1.65; }
.editorial-guide .features-final ul { display: grid; gap: .2rem; margin: .8rem 0 0; padding-left: 1.2rem; }
.editorial-guide .features-final .related a { display: inline-flex; min-height: 40px; align-items: center; color: #e0e7ff; font-weight: 700; }
.editorial-guide .features-final .secondary-cta { border-color: #ffffff8a; color: #fff; }
.editorial-guide .features-final .features-actions { flex-direction: column; align-items: stretch; }
.editorial-guide-footer .footer-guides { grid-column: 2; }
a:focus-visible, summary:focus-visible { outline: 3px solid #a78bfa; outline-offset: 4px; }
@media (max-width: 1050px) {
    .editorial-guide .features-final .features-actions { flex-direction: row; flex-wrap: wrap; }
}
@media (max-width: 700px) {
    .editorial-guide-topline { margin-bottom: .4rem; }
    .editorial-guide-figure { width: 100%; }
    .editorial-guide .features-final .features-actions .secondary-cta { width: 100%; }
    .editorial-guide-footer .footer-guides { grid-column: auto; justify-content: flex-start; }
}
