/* China Ready: a reading desk within the existing Voyage East system. */
.cr-page .cr-wrap { width: min(1296px,calc(100% - 2 * var(--editorial-gutter))); margin-inline: auto; }
.cr-page main h1,.cr-page main h2,.cr-page main h3 { font-family: var(--font-serif); font-weight: 400; color: var(--ve-teal); }
.cr-page main p { line-height: 1.7; }
.cr-page main figure { margin: 0; min-width: 0; }
.cr-page main img { width: 100%; height: auto; display: block; object-fit: cover; }
.cr-page main figcaption { font-size: 11px; color: var(--fg3); line-height: 1.5; margin-top: 12px; }
.cr-page .cr-link { display: inline-flex; gap: 18px; align-items: center; min-height: 44px; border-bottom: 1px solid var(--rule); font-size: 13px; color: var(--ve-teal); }
.cr-page .cr-link span { transition: transform var(--motion-paper) var(--ease-paper); }
.cr-page .cr-link:is(:hover,:focus-visible) span { transform: translate(3px,-3px); }
.cr-page .cr-label { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: var(--fg3); }
.cr-page .cr-masthead { padding-top: 146px; padding-bottom: 42px; display: grid; grid-template-columns: 1.35fr 1fr; gap: 8vw; align-items: end; border-bottom: 1px solid var(--rule); }
.cr-page .cr-masthead h1 { font-size: clamp(70px,8.5vw,122px); line-height: .95; letter-spacing: -.035em; margin-top: 25px; }
.cr-page .cr-masthead > div:last-child > p:first-child { font-family: var(--font-serif); font-size: 30px; line-height: 1.1; color: var(--ve-teal); }
.cr-page .cr-masthead > div:last-child > p + p { font-size: 15px; color: var(--fg2); margin-top: 16px; max-width: 45ch; }
.cr-page .cr-masthead nav { display: flex; gap: 28px; margin-top: 16px; }
.cr-page .cr-masthead nav a { font-size: 12px; min-height: 44px; display: flex; align-items: center; text-decoration: underline; text-underline-offset: 6px; }
.cr-page .cr-front { padding-block: 42px 68px; }
.cr-page .cr-lead { display: grid; grid-template-columns: 1.15fr 1fr; gap: 8vw; align-items: center; }
.cr-page .cr-lead-copy { max-width: 580px; }
.cr-page .cr-lead h2 { font-size: clamp(42px,4.9vw,70px); line-height: 1.02; margin: 25px 0; max-width: 16ch; text-wrap: balance; }
.cr-page .cr-lead-copy > p:not(.eyebrow) { color: var(--fg2); font-size: 17px; max-width: 48ch; }
.cr-page .cr-lead .cr-link { margin-top: 22px; }
.cr-page .cr-lead-image { overflow: hidden; display: block; }
.cr-page .cr-lead-image img { height: 440px; object-position: 50% 58%; }
.cr-page .cr-entry-image { display: block; overflow: hidden; }
.cr-page .cr-lead-image img,.cr-page .cr-entry-image img { transition: transform 900ms var(--ease-paper); }
.cr-page .cr-reading-pair { display: grid; grid-template-columns: 1.45fr .8fr; gap: 8vw; padding: 44px 0 88px; border-top: 1px solid var(--rule); }
.cr-page .cr-apps-entry { display: grid; grid-template-columns: .8fr 1fr; gap: 34px; align-items: start; }
.cr-page .cr-apps-entry img { aspect-ratio: 3 / 4; height: auto; }
.cr-page .cr-reading-pair h2 { font-size: clamp(32px,3.2vw,46px); line-height: 1.08; text-wrap: balance; margin: 22px 0; }
.cr-page .cr-reading-pair p:not(.eyebrow) { color: var(--fg2); font-size: 15px; }
.cr-page .cr-reading-pair .cr-link { margin-top: 16px; }
.cr-page .cr-vpn-entry { padding-top: 36px; }
.cr-page .cr-vpn-entry h2 { margin-top: 20px; }
.cr-page .cr-vpn-entry figure { margin-top: 30px; width: 85%; }
.cr-page .cr-vpn-entry figure img { aspect-ratio: 3 / 2; }
.cr-page .cr-kit { background: var(--surface-celadon); padding: 54px 64px; display: grid; grid-template-columns: 1.05fr 1fr; gap: 8vw; align-items: start; }
.cr-page .cr-kit h2 { font-size: clamp(50px,5.5vw,78px); line-height: .98; margin: 28px 0; }
.cr-page .cr-kit-intro > p:not(.eyebrow) { max-width: 42ch; font-size: 16px; color: var(--fg2); }
.cr-page .cr-kit-contents { list-style: none; padding: 0; margin: 30px 0 0; columns: 2; column-gap: 24px; max-width: 500px; }
.cr-page .cr-kit-contents li { break-inside: avoid; font-size: 12px; color: var(--fg2); padding-block: 7px; }
.cr-page .cr-kit-request { padding-top: 64px; }
.cr-page .cr-kit-note { font-family: var(--font-serif); font-size: 38px; line-height: 1.1; color: var(--ve-teal); margin-bottom: 16px; }
.cr-page .cr-kit-request > p + p { font-size: 15px; color: var(--fg2); }
.cr-page .cr-request { margin-top: 28px; border-top: 1px solid var(--ve-teal); }
.cr-page .cr-request summary { cursor: pointer; display: flex; gap: 20px; align-items: center; justify-content: space-between; font-size: 14px; min-height: 64px; list-style: none; }
.cr-page summary::-webkit-details-marker { display: none; }
.cr-page .cr-request summary span { font-size: 24px; transition: transform var(--motion-paper) var(--ease-paper); }
.cr-page .cr-request[open] summary span { transform: rotate(45deg); }
.cr-page .capture { padding: 12px 0 0; background: transparent; border: 0; }
.cr-page .capture-grid { grid-template-columns: 1fr; }
.cr-page .form-privacy { font-size: 12px; }
.cr-page .cr-reference { display: block; padding-block: 88px 80px; }
.cr-page .cr-reference > div { padding-bottom: 38px; }
.cr-page .cr-reference h2 { font-size: 54px; line-height: 1.03; margin-top: 20px; }
.cr-page .cr-reference nav { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-left: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.cr-page .cr-reference nav a { display: block; position: relative; min-height: 190px; padding: 26px 42px 28px 26px; border-top: 1px solid var(--rule); border-right: 1px solid var(--rule); }
.cr-page .cr-reference h3 { font-size: clamp(25px,2.2vw,31px); line-height: 1.08; }
.cr-page .cr-reference nav p { font-size: 14px; color: var(--fg2); margin-top: 8px; }
.cr-page .cr-reference nav span { position: absolute; right: 22px; top: 23px; font-size: 22px; color: var(--ve-teal); }
.cr-page .cr-further { border-top: 1px solid var(--rule); display: grid; grid-template-columns: 1fr 1fr; gap: 10vw; padding-block: 42px 80px; }
.cr-page .cr-further h2 { font-size: 43px; line-height: 1.1; }
.cr-page .cr-further p { font-size: 16px; max-width: 58ch; color: var(--fg2); }
.cr-page .cr-further a,.cr-page .cr-reading a { text-decoration: underline; text-underline-offset: 4px; }
/* Article openings share a masthead, with photography proportioned to the subject. */
.cr-page .cr-article-opening { padding-top: 122px; display: grid; grid-template-columns: 1.5fr .85fr; gap: 28px 7vw; align-items: center; padding-bottom: 64px; border-bottom: 1px solid var(--rule); }
.cr-page .cr-back { grid-column: 1 / -1; width: fit-content; min-height: 44px; display: inline-flex; align-items: center; font-size: 13px; color: var(--fg2); }
.cr-page .cr-article-opening h1 { font-size: clamp(44px,5.1vw,74px); line-height: 1.02; letter-spacing: -.02em; margin: 26px 0; text-wrap: balance; }
.cr-page .cr-deck { font-size: 19px; color: var(--fg2); max-width: 60ch; }
.cr-page .cr-meta { margin-top: 28px; font-size: 11px; color: var(--fg3); }
.cr-page .cr-article-opening figure img { height: 420px; }
.cr-page.cr-article--vpn .cr-article-opening { grid-template-columns: 1.5fr .9fr; }
.cr-page.cr-article--vpn .cr-article-opening figure img { height: 280px; }
.cr-page .cr-reading-layout { display: grid; grid-template-columns: 230px minmax(0,680px); gap: 8vw; padding-top: 54px; padding-bottom: 72px; }
.cr-page .cr-reading-nav { align-self: start; position: sticky; top: 112px; }
.cr-page .cr-contents summary { display: flex; justify-content: space-between; align-items: center; cursor: pointer; min-height: 44px; font-size: 13px; color: var(--ve-teal); border-top: 1px solid var(--rule); list-style: none; }
.cr-page .cr-contents summary span { font-size: 22px; }
.cr-page .cr-contents[open] summary span { transform: rotate(45deg); }
.cr-page .cr-contents nav { display: grid; padding-top: 12px; }
.cr-page .cr-contents nav a { font-size: 12px; line-height: 1.5; color: var(--fg2); padding: 9px 0; }
.cr-page .cr-contents nav a:hover { color: var(--ve-teal); text-decoration: underline; text-underline-offset: 4px; }
.cr-page .cr-reading { min-width: 0; font-size: 18px; }
.cr-page .cr-reading > p { margin: 0 0 24px; color: var(--fg2); line-height: 1.8; }
.cr-page .cr-reading h2 { font-size: 39px; line-height: 1.12; margin: 52px 0 22px; scroll-margin-top: 112px; }
.cr-page .cr-reading h2:first-child { margin-top: 0; }
.cr-page .cr-reading h3 { font-size: 27px; line-height: 1.2; margin: 32px 0 12px; }
.cr-page .cr-reading .cr-answer { font-family: var(--font-serif); color: var(--ve-teal); font-size: 34px; line-height: 1.2; padding: 30px 34px; margin-bottom: 42px; background: var(--surface-celadon); }
.cr-page .cr-reading-photo { margin: 44px -60px 48px 0; }
.cr-page .cr-reading-photo img { height: 370px; }
.cr-page .cr-reading .cr-sources { border-top: 1px solid var(--rule); margin-top: 50px; padding-top: 28px; }
.cr-page .cr-reading .cr-sources h2 { font-size: 27px; margin: 0 0 18px; }
.cr-page .cr-sources p,.cr-page .cr-sources li { font-size: 13px; line-height: 1.7; color: var(--fg2); }
.cr-page .cr-sources ul { padding-left: 18px; margin-top: 16px; }
.cr-page .cr-sources li { padding-block: 4px; }
.cr-page .cr-next-step { margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--rule); }
.cr-page .cr-next-step p { font-size: 15px; color: var(--fg2); margin-bottom: 18px; }
.cr-page .cr-download-list { list-style: none; padding: 0; }
.cr-page .cr-download-list li { position: relative; padding: 18px 0 18px 26px; border-top: 1px solid var(--rule); color: var(--fg2); line-height: 1.7; }
.cr-page .cr-download-list li::before { content: ''; width: 7px; height: 7px; border: 1px solid var(--ve-teal); position: absolute; left: 0; top: 29px; }
.cr-page .cr-setup-check { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; min-height: 44px; font-family: var(--font-sans); font-size: 12px; color: var(--fg2); margin: -12px 0 10px; }
.cr-page .cr-setup-check input { appearance: auto; accent-color: var(--ve-teal); width: 17px; height: 17px; margin: 0; }
.cr-page .cr-progress { font-size: 12px; color: var(--ve-teal); border-top: 1px solid var(--rule); margin-top: 20px; padding-top: 18px; }
.cr-page .cr-related { padding-block: 48px 88px; border-top: 1px solid var(--rule); display: grid; grid-template-columns: 1fr 1.5fr; gap: 8vw; }
.cr-page .cr-related h2 { font-size: 55px; margin: 20px 0; }
.cr-page .cr-related-links { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.cr-page .cr-entry { display: block; position: relative; border-top: 1px solid var(--rule); padding: 22px 0 38px; }
.cr-page .cr-entry h3 { font-size: 33px; line-height: 1.12; margin-top: 18px; text-wrap: balance; }
.cr-page .cr-arrow { position: absolute; bottom: 0; right: 0; font-size: 24px; color: var(--ve-teal); transition: transform var(--motion-paper) var(--ease-paper); }
.cr-page .cr-entry:is(:hover,:focus-visible) .cr-arrow { transform: translate(3px,-3px); }
@media (hover:hover) and (pointer:fine) {
 .cr-page :is(.cr-lead,.cr-apps-entry):is(:hover,:focus-within) img { transform: scale(1.025); }
 .cr-page main h2 a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }
}
@media(max-width:1100px) {
 .cr-page .cr-masthead { grid-template-columns: 1.1fr 1fr; gap: 40px; }
 .cr-page .cr-lead { gap: 48px; }
 .cr-page .cr-reading-pair { grid-template-columns: 1.15fr 1fr; gap: 48px; }
 .cr-page .cr-apps-entry { display: block; }
 .cr-page .cr-apps-entry img { aspect-ratio: 4 / 3; }
 .cr-page .cr-apps-entry > div { padding-top: 28px; }
 .cr-page .cr-kit { padding: 44px; gap: 40px; }
 .cr-page .cr-reading-layout { grid-template-columns: 185px minmax(0,1fr); gap: 48px; }
 .cr-page .cr-reading-photo { margin-right: 0; }
}
@media(max-width:800px) {
 .cr-page .cr-masthead { grid-template-columns: 1fr; gap: 28px; padding-top: 120px; }
 .cr-page .cr-masthead h1 { font-size: 84px; margin-top: 20px; }
 .cr-page .cr-masthead > div:last-child { max-width: 65ch; }
 .cr-page .cr-masthead > div:last-child > p + p { max-width: 65ch; }
 .cr-page .cr-lead { grid-template-columns: 1fr 1fr; gap: 30px; }
 .cr-page .cr-lead h2 { font-size: 43px; }
 .cr-page .cr-lead-image img { height: 370px; }
 .cr-page .cr-lead-copy > p:not(.eyebrow) { font-size: 15px; }
 .cr-page .cr-kit { gap: 32px; padding: 36px; }
 .cr-page .cr-kit h2 { font-size: 54px; }
 .cr-page .cr-kit-request { padding-top: 54px; }
 .cr-page .cr-kit-note { font-size: 30px; }
 .cr-page .cr-kit-contents { columns: 1; }
 .cr-page .cr-reference { padding-block: 72px; }
 .cr-page .cr-reference h2 { font-size: 43px; }
 .cr-page .cr-reference nav { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .cr-page .cr-article-opening { grid-template-columns: 1fr !important; gap: 24px; padding-top: 100px; padding-bottom: 34px; }
 .cr-page .cr-article-opening h1 { font-size: 56px; max-width: 22ch; }
 .cr-page .cr-deck { font-size: 18px; }
 .cr-page .cr-article-opening figure img { height: 330px; }
 .cr-page.cr-article--vpn .cr-article-opening figure img { height: 300px; }
 .cr-page .cr-reading-layout { display: block; padding-top: 26px; }
 .cr-page .cr-reading-nav { position: static; margin-bottom: 30px; }
 .cr-page .cr-contents { border-bottom: 1px solid var(--rule); }
 .cr-page .cr-contents nav { padding-bottom: 18px; }
 .cr-page .cr-contents nav a { min-height: 44px; }
 .cr-page .cr-reading { max-width: 680px; }
 .cr-page .cr-related { grid-template-columns: 1fr; gap: 30px; }
 .cr-page .cr-related-heading { max-width: 560px; }
}
@media(max-width:540px) {
 .cr-page .cr-masthead { padding-top: 114px; padding-bottom: 24px; gap: 24px; }
 .cr-page .cr-masthead h1 { font-size: 70px; }
 .cr-page .cr-masthead .eyebrow { font-size: 9px; letter-spacing: .12em; }
 .cr-page .cr-masthead > div:last-child > p:first-child { font-size: 28px; }
 .cr-page .cr-front { padding-block: 32px 48px; }
 .cr-page .cr-lead { display: flex; flex-direction: column; gap: 26px; align-items: stretch; }
 .cr-page .cr-lead h2 { font-size: 46px; margin: 20px 0; }
 .cr-page .cr-lead-image { margin-left: 40px; }
 .cr-page .cr-lead-image img { height: 250px; }
 .cr-page .cr-reading-pair { display: block; padding-block: 30px 52px; }
 .cr-page .cr-apps-entry { display: flex; flex-direction: column; }
 .cr-page .cr-apps-entry .cr-entry-image { width: 65%; margin-right: auto; }
 .cr-page .cr-apps-entry img { aspect-ratio: 1 / 1; }
 .cr-page .cr-apps-entry > div { padding-top: 0; }
 .cr-page .cr-reading-pair h2 { font-size: 38px; }
 .cr-page .cr-vpn-entry { margin-top: 38px; padding-top: 30px; border-top: 1px solid var(--rule); }
 .cr-page .cr-vpn-entry figure { width: 78%; margin-left: auto; }
 .cr-page .cr-kit { display: block; padding: 32px 24px; }
 .cr-page .cr-kit h2 { font-size: 58px; }
 .cr-page .cr-kit-request { padding-top: 34px; }
 .cr-page .cr-kit-contents { columns: 2; }
 .cr-page .cr-kit-intro > p:not(.eyebrow) { font-size: 15px; }
 .cr-page .cr-kit-note { font-size: 35px; }
 .cr-page .cr-kit .btn-primary { width: 100%; padding-inline: 10px; }
 .cr-page .cr-reference { padding-block: 56px; }
 .cr-page .cr-reference h2 { font-size: 45px; }
 .cr-page .cr-reference > div { padding-bottom: 30px; }
 .cr-page .cr-reference nav { grid-template-columns: 1fr; }
 .cr-page .cr-reference nav a { min-height: 0; padding-block: 24px; }
 .cr-page .cr-further { display: block; padding-bottom: 54px; }
 .cr-page .cr-further h2 { font-size: 38px; }
 .cr-page .cr-further p { margin-top: 22px; font-size: 15px; }
 .cr-page .cr-article-opening { padding-top: 96px; }
 .cr-page .cr-article-opening h1 { font-size: 44px; margin: 20px 0; }
 .cr-page .cr-deck { font-size: 17px; }
 .cr-page .cr-meta { margin-top: 22px; font-size: 10px; }
 .cr-page .cr-article-opening figure img { height: 250px; }
 .cr-page.cr-article--vpn .cr-article-opening figure img { height: 210px; }
 .cr-page .cr-reading { font-size: 17px; }
 .cr-page .cr-reading h2 { font-size: 33px; margin-top: 40px; }
 .cr-page .cr-reading h3 { font-size: 27px; }
 .cr-page .cr-reading .cr-answer { font-size: 29px; padding: 24px; }
 .cr-page .cr-reading-photo { margin-block: 34px; }
 .cr-page .cr-reading-photo img { height: 235px; }
 .cr-page .cr-related { padding-block: 34px 54px; }
 .cr-page .cr-related h2 { font-size: 46px; }
 .cr-page .cr-related-links { grid-template-columns: 1fr; gap: 24px; }
 .cr-page .cr-entry h3 { max-width: 24ch; font-size: 30px; }
}
@media(prefers-reduced-motion:reduce) {
 .cr-page .cr-link span,.cr-page .cr-entry .cr-arrow,.cr-page .cr-request summary span,.cr-page .cr-lead-image img,.cr-page .cr-entry-image img { transition: none; transform: none !important; }
}
/* Related reading keeps each article's visual identity in a quiet two-row index. */
.cr-page .cr-related-links { grid-template-columns: 1fr; gap: 22px; }
.cr-page .cr-entry { display: grid; grid-template-columns: 90px 1fr; column-gap: 24px; padding: 20px 34px 20px 0; align-items: start; }
.cr-page .cr-entry > img { grid-row: 1 / 3; height: 108px; }
.cr-page .cr-entry .cr-label { grid-column: 2; }
.cr-page .cr-entry h3 { grid-column: 2; margin-top: 10px; }
.cr-page .cr-entry .cr-arrow { bottom: 22px; }
@media(max-width:540px){.cr-page .cr-entry{grid-template-columns:72px 1fr;column-gap:18px;padding-right:0;padding-bottom:36px}.cr-page .cr-entry>img{height:90px}.cr-page .cr-entry .cr-arrow{bottom:8px}.cr-page .cr-entry h3{font-size:27px}.cr-page .cr-entry .cr-label{font-size:9px}}
/* On a phone, show the first article photograph before the long question. */
@media(max-width:540px){
 .cr-page .cr-lead-copy{display:contents}
 .cr-page .cr-lead-copy>.eyebrow{order:0}
 .cr-page .cr-lead-image{order:1}
 .cr-page .cr-lead h2{order:2;margin:0}
 .cr-page .cr-lead-copy>p:not(.eyebrow){order:3}
 .cr-page .cr-lead .cr-link{order:4;align-self:flex-start;margin-top:0}
}