.editorial-hero { display:grid; grid-template-columns:minmax(0,1fr) 180px; align-items:center; gap:80px; padding-block:90px 75px; }
.editorial-hero h1 { max-width:19ch; font-size:clamp(2.8rem,5vw,4.6rem); line-height:1.08; letter-spacing:-.045em; }
.editorial-hero p:not(.editorial-kicker) { max-width:60ch; margin-top:28px; color:var(--muted); font-size:1.15rem; line-height:1.75; }
.editorial-brand { border-radius:40px; box-shadow:var(--shadow); max-width:100%; }
.editorial-kicker { color:var(--muted); font-size:.85rem; font-weight:600; margin-bottom:18px; }
.guide-index { padding-bottom:90px; }
.guide-entry { display:grid; grid-template-columns:90px minmax(0,1fr); gap:36px; border-top:1px solid var(--line); padding-block:48px; }
.guide-symbol { width:70px; height:70px; display:grid; place-items:center; border-radius:22px; color:var(--feature); background:color-mix(in srgb,var(--feature) 15%,var(--paper)); }
.guide-symbol>.icon { width:32px; height:32px; }
.guide-entry h2 { max-width:32ch; font-size:clamp(1.6rem,3vw,2.2rem); line-height:1.2; }
.guide-entry h2 a { color:var(--text); text-decoration:none; }
.guide-entry h2 a:hover { text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:5px; }
.guide-entry p:not(.editorial-kicker) { max-width:70ch; color:var(--muted); margin-top:20px; line-height:1.8; }
.editorial-back { display:inline-flex; align-items:center; gap:12px; color:var(--muted); text-decoration:none; margin-bottom:30px; }
.editorial-back .icon { width:18px; transform:scaleX(-1); }
[dir="rtl"] .editorial-back .icon { transform:none; }
.article-layout { display:grid; grid-template-columns:minmax(180px,1fr) minmax(0,3fr); gap:72px; padding-block:30px 90px; align-items:start; }
.article-contents { position:sticky; top:32px; max-height:calc(100dvh - 64px); overflow:auto; padding-inline-end:6px; scrollbar-gutter:stable; font-size:.9rem; }
.article-contents>p { font-weight:650; margin-bottom:18px; }
.article-contents ol { padding-inline-start:20px; color:var(--muted); line-height:1.7; }
.article-contents li+li { margin-top:14px; }
.article-contents a { color:inherit; text-underline-offset:4px; }
.article-body { min-width:0; }
.article-body .content-section { padding-block:42px; scroll-margin-top:30px; }
.article-body h2,.editorial-prose h2 { font-size:clamp(1.6rem,2.8vw,2.2rem); line-height:1.2; max-width:32ch; }
.article-body .content-section>p,.editorial-prose .content-section>p { color:var(--muted); line-height:1.85; margin-top:26px; }
.article-body .detail-list li+li { margin-top:22px; }
.article-media { padding:36px; background:var(--paper); border-radius:32px; margin-block:24px 42px; }
.editorial-prose { max-width:980px; padding-bottom:90px; }
.editorial-related { display:flex; flex-direction:column; align-items:flex-start; gap:10px; }
@media(max-width:980px) { .editorial-hero { gap:40px; } .article-layout { grid-template-columns:minmax(0,1fr); gap:30px; } .article-contents { position:static; max-height:none; overflow:visible; max-width:65ch; padding-bottom:24px; } }
@media(max-width:600px) { .editorial-hero { grid-template-columns:minmax(0,1fr); padding-block:55px; gap:30px; } .editorial-brand { grid-row:1; width:80px; height:80px; border-radius:20px; } .guide-entry { grid-template-columns:minmax(0,1fr); gap:22px; padding-block:36px; } .guide-symbol { width:52px; height:52px; border-radius:16px; } .article-media { padding:22px 8px; } }
