/* Editorial surfaces reuse the established palette, typography and controls. */
.discovery-links { padding-block: 64px; border-top: 1px solid var(--line); }
.discovery-links h2 { font-size: clamp(36px, 4.5vw, 64px); line-height: 1.07; margin-block: 16px 32px; }
.discovery-links h2::first-line, .page-tools h1::first-line, .page-books h1::first-line { color: var(--cyan); }
.discovery-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.discovery-grid > a { display: flex; flex-direction: column; gap: 18px; padding: clamp(22px,3vw,36px); border: 1px solid var(--line); border-radius: 20px; background: #101b22; transition: border-color .18s ease, transform .18s ease; }
.discovery-grid h3 { font-size: clamp(23px,2.5vw,32px); line-height: 1.2; }
.discovery-grid p { color: var(--muted); line-height: 1.65; }
.discovery-grid > a > span:first-child { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); }
.discovery-cta { margin-top: auto; color: var(--cyan); font-size: 15px; }
.discovery-grid > a:focus-visible { outline: 2px solid var(--cyan); outline-offset: 4px; }
.editorial-copy { max-width: 820px; }
.editorial-copy > p, .editorial-copy li { font-size: 18px; line-height: 1.75; }
.editorial-copy > p + p { margin-top: 18px; }
.editorial-copy a:not(.button) { text-decoration: underline; text-underline-offset: .18em; }
.editorial-copy h2 { margin-bottom: 26px; }
.editorial-copy h3 { margin-block: 24px 10px; }
.editorial-copy ol, .editorial-copy ul { padding-left: 1.4em; }
.editorial-copy li + li { margin-top: 18px; }
.editorial-copy .support-note { margin-top: 28px; }
.editorial-copy .button { margin-top: 24px; }
.editorial-breadcrumb { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; font-size: 14px; color: var(--muted); }
.editorial-breadcrumb a { text-decoration: underline; text-underline-offset: 4px; }
.editorial-hero-icon { float: right; width: 76px; height: 76px; border-radius: 20px; margin: 0 0 16px 24px; }
.kb-main .discovery-links > .wrap { width: 100%; }
@media (hover: hover) and (pointer: fine) { .discovery-grid > a:hover { border-color: var(--cyan); transform: translateY(-3px); } }
@media (max-width: 640px) { .discovery-grid { grid-template-columns: 1fr; } .editorial-hero-icon { width: 56px; height: 56px; border-radius: 14px; } .editorial-copy > p, .editorial-copy li { font-size: 17px; } }
@media (prefers-reduced-motion: reduce) { .discovery-grid > a { transition: none; transform: none !important; } }