/* Editorial pages share the typography, colors and spacing of the home. */
.topic-hero { background: var(--color-sand); padding: calc(72px + clamp(2rem, 5vw, 4rem)) 0 clamp(3rem, 7vw, 6rem); }
.topic-breadcrumb { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 2.5rem; font-size: .82rem; color: var(--color-text-secondary); }
.topic-breadcrumb a, .topic-related a, .topic-inline-link { text-decoration: underline; text-underline-offset: .2em; }
.topic-hero__grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, .8fr); gap: clamp(2rem, 5vw, 5rem); align-items: end; }
.topic-hero h1 { max-width: 850px; font: 500 clamp(2.4rem, 4.5vw, 4.4rem)/1.12 var(--font-heading); color: var(--color-deep); margin: .9rem 0 1.5rem; letter-spacing: -.035em; }
.topic-hero__lead { max-width: 760px; font-size: clamp(1.05rem, 1.4vw, 1.2rem); line-height: 1.8; color: var(--color-text-secondary); }
.topic-hero__note { border-left: 2px solid var(--color-deep); padding-left: 1.5rem; font-size: .93rem; line-height: 1.8; }
.topic-hero__note img { width: 52px; height: 52px; margin-bottom: 1rem; border-radius: 50%; }
.topic-hero .hero__ctas { margin-top: 2rem; }
.topic-body { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(220px, .7fr); gap: clamp(2.5rem, 6vw, 6rem); align-items: start; }
.topic-copy > section { margin-bottom: 3rem; }
.topic-copy h2 { font: 500 clamp(1.7rem, 2.8vw, 2.3rem)/1.3 var(--font-heading); color: var(--color-deep); margin: 0 0 1rem; }
.topic-copy p, .topic-copy li { line-height: 1.85; color: var(--color-text-secondary); }
.topic-copy ul { padding-left: 1.3rem; }
.topic-copy li + li { margin-top: .65rem; }
.topic-example { padding: clamp(1.25rem, 3vw, 2.25rem); background: var(--color-sand); border-radius: var(--radius-md); }
.topic-example .example-label { margin-bottom: 1.2rem; }
.topic-example ol { padding-left: 1.3rem; }
.topic-boundary { border-top: 1px solid var(--color-border); padding-top: 2rem; }
.topic-related { border-top: 2px solid var(--color-deep); padding-top: 1.3rem; }
.topic-related h2 { font: 500 1.35rem/1.4 var(--font-heading); margin-bottom: 1rem; }
.topic-related a { display: block; margin: 1rem 0; font-size: .93rem; line-height: 1.6; }
.topic-faq details { border-bottom: 1px solid var(--color-border); padding-block: 1.2rem; }
.topic-faq summary { font-weight: 600; line-height: 1.6; cursor: pointer; }
.topic-faq details p { margin: 1rem 0 0; }
.topic-cta { background: var(--color-sand); padding-block: clamp(3rem, 6vw, 5rem); }
.topic-cta .container { max-width: 900px; text-align: center; }
.topic-cta h2 { font: 500 clamp(1.8rem, 3vw, 2.7rem)/1.25 var(--font-heading); margin-bottom: 1.2rem; }
.topic-cta p { line-height: 1.8; margin-bottom: 1.75rem; }
.language-links { display: flex; flex-wrap: wrap; gap: .6rem 1.2rem; padding-block: 1rem; font-size: .75rem; border-top: 1px solid var(--color-border); }
.language-links a[aria-current="page"] { font-weight: 600; text-decoration: underline; text-underline-offset: .2em; }
.footer-applications { padding-block: 1.5rem; border-top: 1px solid var(--color-border); }
.footer-applications h2 { margin: 0 0 1rem; color: var(--color-white); font: 600 .85rem/1.5 var(--font-body); }
.footer-applications > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem 2rem; }
.footer-applications a { font-size: .9rem; line-height: 1.7; text-decoration: underline; text-underline-offset: .25em; }
@media (max-width: 760px) { .footer-applications > div { grid-template-columns: 1fr; gap: .8rem; } }
@media (max-width: 760px) { .topic-hero__grid, .topic-body { grid-template-columns: 1fr; } .topic-hero__note { max-width: 540px; } .topic-breadcrumb { margin-bottom: 1.75rem; } }