/* Shared editorial document surface for Nature Release. */
:root { --doc-ink: var(--black); --doc-paper: var(--white); --doc-line: var(--grey); --doc-quiet: var(--light-grey); --doc-signal: var(--signal); }
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { min-width: 320px; margin: 0; overflow-x: hidden; background: var(--doc-ink); color: var(--doc-paper); font-family: Manrope, Arial, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; }

/* Navigation mirrors the landing's compact, editorial header. */
.header, .l-header { position: sticky; top: 0; z-index: 20; min-height: 72px; padding: 0 max(32px, calc((100vw - 1360px) / 2)); display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--doc-line); background: var(--black-90); backdrop-filter: blur(18px); }
.header__left, .l-header__left { display: flex; align-items: center; gap: 24px; min-width: 0; }
.logo, .l-logo { display: inline-flex; align-items: center; gap: 10px; color: var(--doc-paper); font: 700 13px/1 Manrope, Arial, sans-serif; letter-spacing: -.03em; text-decoration: none; white-space: nowrap; }
.logo::before, .l-logo::before { width: 18px; height: 10px; flex: none; border-radius: 0; background: center / contain no-repeat url('../icons/nature-release/vector-icon/signal.svg'); box-shadow: none; content: ''; }
.back, .l-back { color: var(--doc-quiet); font: 500 12px/1 "DM Mono", monospace; letter-spacing: .02em; text-decoration: none; white-space: nowrap; transition: color .2s ease; }
.back:hover, .l-back:hover { color: var(--doc-signal); }
.language-toggle, .l-lang { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-width: 46px; height: 34px; padding: 0 12px; border: 1px solid var(--white-22); border-radius: 999px; background: transparent; color: var(--doc-paper); cursor: pointer; font: 500 11px/1 "DM Mono", monospace; letter-spacing: .06em; transition: border-color .2s ease, color .2s ease, background .2s ease; }
.language-toggle:hover, .l-lang:hover { border-color: var(--doc-signal); background: var(--signal-07); color: var(--doc-signal); }
.l-lang svg { width: 14px; height: 14px; }
.l-lang svg path { stroke: currentColor; }
.l-lang-label { margin: 0; color: currentColor; font: inherit; }

/* Legal documents. */
.l-main { width: min(100% - 64px, 1040px); max-width: none; margin: 0 auto; padding: clamp(64px, 9vw, 136px) 0 clamp(72px, 10vw, 152px); }
.l-label { margin: 0 0 24px; color: var(--doc-signal); font: 500 11px/1 "DM Mono", monospace; letter-spacing: .1em; text-transform: uppercase; }
.l-title { max-width: 850px; margin: 0 0 16px; color: var(--doc-paper); font: 500 clamp(48px, 6.4vw, 88px)/.9 Manrope, Arial, sans-serif; letter-spacing: -.065em; }
.l-updated { margin: 0 0 42px; color: var(--doc-quiet); font: 400 13px/1.5 "DM Mono", monospace; }
.l-intro { max-width: 720px; margin: 0; padding: 0 0 clamp(44px, 6vw, 72px); border-bottom: 1px solid var(--doc-line); color: var(--doc-quiet); font-size: clamp(17px, 2vw, 23px); line-height: 1.48; letter-spacing: -.03em; }
.l-sections { display: grid; gap: 10px; margin-top: clamp(38px, 5vw, 64px); }
.l-section { position: relative; padding: clamp(24px, 3vw, 40px); border: 1px solid var(--doc-line); border-radius: 0; background: var(--dark-grey); transition: border-color .2s ease, transform .2s ease; }
.l-section:hover { border-color: var(--white-28); transform: translateY(-2px); }
.l-section-num { margin: 0 0 16px; color: var(--doc-signal); font: 500 11px/1 "DM Mono", monospace; letter-spacing: .1em; }
.l-section-title { max-width: 760px; margin: 0 0 22px; color: var(--doc-paper); font: 500 clamp(22px, 3vw, 36px)/1.03 Manrope, Arial, sans-serif; letter-spacing: -.045em; }
.l-section-body { max-width: 780px; color: var(--doc-quiet); font-size: 16px; line-height: 1.72; }
.l-section-body p { margin: 0 0 16px; }
.l-section-body p:last-child { margin-bottom: 0; }
.l-section-body ul { display: grid; gap: 8px; margin: 18px 0; padding: 0; list-style: none; }
.l-section-body ul li { display: grid; grid-template-columns: 16px minmax(0, 1fr); gap: 10px; }
.l-section-body ul li::before { margin: 0; color: var(--doc-signal); content: '→'; }
.l-section-body strong { color: var(--doc-paper); font-weight: 600; }
.l-section-body a { color: var(--doc-signal); border-bottom: 1px solid var(--signal-30); text-decoration: none; }
.l-sub { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--white-10); }
.l-sub-title { margin: 0 0 10px; color: var(--doc-paper); font: 500 11px/1.3 "DM Mono", monospace; letter-spacing: .08em; text-transform: uppercase; }
.l-footer, .footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; width: min(100% - 64px, 1360px); margin: 0 auto; padding: 30px 0 42px; border-top: 1px solid var(--doc-line); }
.l-footer-copy, .footer__copy, .l-footer-links a, .footer a { color: var(--doc-quiet); font: 400 11px/1.4 "DM Mono", monospace; letter-spacing: .025em; text-decoration: none; }
.l-footer-links, .footer__links { display: flex; flex-wrap: wrap; gap: 12px 20px; }
.l-footer-links a:hover, .footer a:hover { color: var(--doc-paper); }
.l-footer-links a.is-current, .footer a.current { color: var(--doc-signal); }

/* Methodology uses a roomy reading column plus a quiet desktop index. */
.document { display: grid; grid-template-columns: 190px minmax(0, 780px); justify-content: space-between; gap: clamp(48px, 8vw, 160px); width: min(100% - 64px, 1360px); margin: 0 auto; padding: clamp(64px, 9vw, 132px) 0 clamp(72px, 10vw, 152px); }
.toc { position: sticky; top: 112px; align-self: start; padding-left: 14px; border-left: 1px solid var(--doc-line); }
.toc__label, .eyebrow, .section__number { color: var(--doc-signal); font: 500 11px/1.2 "DM Mono", monospace; letter-spacing: .1em; text-transform: uppercase; }
.toc__label { margin-bottom: 18px; }
.toc a { display: block; margin: 0 0 12px; color: var(--doc-quiet); font-size: 12px; line-height: 1.4; text-decoration: none; transition: color .2s ease; }
.toc a:hover { color: var(--doc-paper); }
.eyebrow { margin-bottom: 24px; }
.document h1 { max-width: 850px; margin: 0; color: var(--doc-paper); font: 500 clamp(50px, 6.2vw, 88px)/.9 Manrope, Arial, sans-serif; letter-spacing: -.065em; }
.lede { max-width: 680px; margin: 28px 0 clamp(46px, 6vw, 74px); padding-bottom: clamp(42px, 6vw, 74px); border-bottom: 1px solid var(--doc-line); color: var(--doc-quiet); font-size: clamp(17px, 2vw, 23px); line-height: 1.48; letter-spacing: -.03em; }
.sections { display: grid; gap: 10px; }
.section { padding: clamp(24px, 3vw, 40px); border: 1px solid var(--doc-line); border-radius: 0; background: var(--dark-grey); scroll-margin-top: 104px; transition: border-color .2s ease, transform .2s ease; }
.section:hover { border-color: var(--white-28); transform: translateY(-2px); }
.section__number { margin-bottom: 16px; }
.section h2 { max-width: 720px; margin: 0 0 24px; color: var(--doc-paper); font: 500 clamp(24px, 3vw, 38px)/1.03 Manrope, Arial, sans-serif; letter-spacing: -.05em; }
.section p, .statement { color: var(--doc-quiet); font-size: 16px; line-height: 1.72; }
.section p { margin: 0 0 16px; }
.section p:last-child { margin-bottom: 0; }
.statements { display: grid; gap: 8px; margin: 20px 0; }
.statement { display: grid; grid-template-columns: 16px minmax(0, 1fr); gap: 10px; }
.statement::before { color: var(--doc-signal); content: '→'; }
.section blockquote { margin: 24px 0; padding: 18px 20px; border-left: 1px solid var(--doc-signal); background: var(--signal-07); color: var(--doc-paper); font-size: 16px; line-height: 1.65; }
.section blockquote:last-child { margin-bottom: 0; }

@media (max-width: 820px) { .document { grid-template-columns: 1fr; } .toc { display: none; } }
@media (max-width: 640px) { .header, .l-header { min-height: 60px; padding: 0 20px; } .header__left, .l-header__left { gap: 18px; } .logo, .l-logo { font-size: 14px; } .logo::before, .l-logo::before { display: none; } .back, .l-back { font-size: 11px; } .l-main, .document { width: min(100% - 40px, 1360px); padding-top: 56px; padding-bottom: 72px; } .l-title, .document h1 { font-size: clamp(42px, 13vw, 62px); } .l-intro, .lede { font-size: 17px; } .l-section, .section { padding: 24px 20px; } .l-section-title, .section h2 { font-size: 25px; } .l-section-body, .section p, .statement { font-size: 15px; line-height: 1.68; } .l-footer, .footer { align-items: flex-start; flex-direction: column; width: min(100% - 40px, 1360px); padding: 25px 0 32px; } }

/* Long-form sections use the same compact, exclusive disclosure pattern as the landing modules. */
.l-section, .section { padding: 0; border: 0; border-top: 1px solid var(--doc-line); border-radius: 0; background: transparent; }
.l-section:last-child, .section:last-child { border-bottom: 1px solid var(--doc-line); }
.l-section:hover, .section:hover { border-color: var(--doc-line); transform: none; }
.document-accordion__toggle { display: grid; grid-template-columns: 64px minmax(0, 1fr) 28px; gap: 16px; align-items: start; width: 100%; padding: 23px 0; border: 0; background: transparent; color: var(--doc-paper); cursor: pointer; text-align: left; -webkit-tap-highlight-color: transparent; appearance: none; }
.document-accordion__toggle:focus { outline: none; }
.document-accordion__toggle:focus-visible { outline: 1px solid var(--doc-signal); outline-offset: -1px; }
.document-accordion__number { margin: 6px 0 0; color: var(--doc-quiet); font: 500 11px/1 "DM Mono", monospace; letter-spacing: .1em; }
.document-accordion__title { margin: 0; color: var(--doc-paper); font: 500 clamp(22px, 3vw, 36px)/1.03 Manrope, Arial, sans-serif; letter-spacing: -.045em; }
.document-accordion__icon { color: var(--doc-signal); font: 400 24px/.9 "DM Mono", monospace; text-align: right; transition: transform .25s ease; }
.is-open > .document-accordion__toggle .document-accordion__icon { transform: rotate(45deg); }
.document-accordion__body { max-height: 0; overflow: hidden; opacity: 0; transition: max-height .45s ease, opacity .25s ease, padding .25s ease; }
.is-open > .document-accordion__body { max-height: 8000px; padding: 0 0 30px 80px; opacity: 1; }
.document-accordion__body .l-section-body, .document-accordion__body > p, .document-accordion__body .statements, .document-accordion__body blockquote { max-width: 780px; }
@media (max-width: 640px) { .l-section, .section { padding: 0; } .document-accordion__toggle { grid-template-columns: 46px minmax(0, 1fr) 24px; gap: 10px; padding: 20px 0; } .document-accordion__number { margin-top: 5px; } .document-accordion__title { font-size: 24px; } .is-open > .document-accordion__body { padding: 0 0 26px 56px; } }

/* Reading layout: a quiet index never displaces the content column. */
.document { display: block; position: relative; width: min(100% - 64px, 1360px); }
.document > article { width: min(100%, 780px); margin: 0 auto; }
.document .toc { position: fixed; top: 112px; left: max(32px, calc((100vw - 1360px) / 2)); width: 180px; }
.toc a, .l-toc a { transition: color .28s ease; }
.toc a.is-active, .l-toc a.is-active { color: var(--doc-paper); }
.document .section, .l-section { padding: clamp(28px, 3vw, 42px) 0; border: 0; border-top: 1px solid var(--doc-line); background: transparent; }
.document .section:last-child, .l-section:last-child { border-bottom: 1px solid var(--doc-line); }
.document .section:hover, .l-section:hover { border-color: var(--doc-line); transform: none; }
.document .section h2, .l-section-title { max-width: 760px; margin-bottom: 20px; }
.l-main { position: relative; width: min(100% - 64px, 1200px); }
.l-document-content { width: min(100%, 780px); margin: 0 auto; }
.l-toc { position: fixed; top: 112px; left: max(32px, calc((100vw - 1200px) / 2)); width: 180px; padding-left: 14px; border-left: 1px solid var(--doc-line); }
.l-toc__label { margin-bottom: 18px; color: var(--doc-signal); font: 500 11px/1.2 "DM Mono", monospace; letter-spacing: .1em; text-transform: uppercase; }
.l-toc__links { display: grid; gap: 10px; }
.l-toc a { color: var(--doc-quiet); font-size: 12px; line-height: 1.4; text-decoration: none; }
@media (max-width: 980px) { .document .toc, .l-toc { display: none; } }
@media (max-width: 640px) { .l-main, .document { width: min(100% - 40px, 1360px); } .document > article, .l-document-content { width: 100%; } .document .section, .l-section { padding: 28px 0; } }

/* Keep the reading column mathematically centred; the index lives independently on the left. */
.document > article, .l-document-content { width: min(780px, 100%); margin-right: auto; margin-left: auto; }
.toc a, .l-toc a { display: block; color: var(--doc-quiet); opacity: .62; transition: color .32s ease, opacity .32s ease; }
.toc a.is-active, .l-toc a.is-active { color: var(--doc-paper); opacity: 1; }