/* Shared reading shell for the 013 Field Notes and the policy pages.
   It sits after each legacy page's local CSS so the library reads as one
   013 Labs property without changing the underlying, translated article copy. */

body.field-note-page,
body.policy-page {
  background: var(--paper);
  color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.65;
}

body.field-note-page main,
body.policy-page main {
  width: min(calc(100% - 2.5rem), 780px);
  max-width: none;
  margin: 0 auto;
  padding: clamp(3.25rem, 7vw, 6.5rem) 0 clamp(4.5rem, 8vw, 7rem);
}

body.field-note-page .back-link {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  margin: 0 0 2.25rem;
  color: var(--teal);
  font-size: .9rem;
  font-weight: 750;
  text-decoration: none;
}

body.field-note-page .back-link:hover { color: var(--ink); }

body.field-note-page .eyebrow {
  margin-bottom: 1.15rem;
}

body.field-note-page h1,
body.policy-page h1 {
  max-width: 15ch;
  margin: 0 0 2.1rem;
  color: var(--ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.7rem, 5.8vw, 4.8rem);
  font-weight: 500;
  letter-spacing: -.045em;
  line-height: .98;
}

body.policy-page h1 { margin-bottom: .7rem; }

body.field-note-page .article-visual {
  margin: 0 0 2.7rem;
  border: 1px solid var(--rule);
  border-radius: 22px;
  background: var(--card);
  box-shadow: 0 20px 55px rgba(23,37,43,.10);
}

body.field-note-page .article-body p,
body.policy-page p,
body.policy-page li {
  color: var(--ink-soft);
  font-size: clamp(1.02rem, 1.4vw, 1.12rem);
}

body.field-note-page .article-body p {
  max-width: 66ch;
  margin: 0 0 1.45rem;
}

body.field-note-page .article-body strong,
body.policy-page strong { color: var(--ink); }

body.policy-page h2 {
  margin: 3rem 0 .85rem;
  color: var(--ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.45rem, 2.8vw, 2.05rem);
  font-weight: 500;
  letter-spacing: -.025em;
  line-height: 1.1;
}

body.policy-page ul { padding-inline-start: 1.35rem; }
body.policy-page li { margin: .7rem 0; }
body.policy-page code { color: var(--teal); font-size: .9em; }
body.policy-page .updated { color: var(--ink-soft); }

body.field-note-page .next-up {
  margin-top: 4.2rem;
  padding: 1.7rem 0 0;
  border-top: 1px solid var(--rule);
}

body.field-note-page .next-up p {
  margin-bottom: .8rem;
  color: var(--coral);
  font-size: .72rem;
  font-weight: 850;
  letter-spacing: .1em;
}

body.field-note-page .next-up a {
  color: var(--ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.35rem, 2.5vw, 1.8rem);
  font-weight: 500;
  line-height: 1.15;
  text-decoration: none;
}

body.field-note-page .next-up a:hover { color: var(--teal); }

.field-note-bridge {
  width: min(calc(100% - 2.5rem), 1240px);
  margin: 0 auto clamp(3.25rem, 7vw, 6rem);
  padding: clamp(1.8rem, 4.5vw, 3.5rem);
  border-radius: var(--radius);
  background: var(--navy);
  color: #fff8ed;
}

.field-note-bridge-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2rem;
  align-items: center;
}

.field-note-bridge .eyebrow { color: #7dd4ca; }
.field-note-bridge h2 {
  max-width: 16ch;
  margin: 0;
  font-size: clamp(2rem, 4vw, 3.35rem);
}
.field-note-bridge p:not(.eyebrow) {
  max-width: 58ch;
  margin-top: .9rem;
  color: rgba(255,255,255,.75);
}
.field-note-bridge .button-row { justify-content: flex-end; margin: 0; }
.field-note-bridge .btn-secondary { border-color: rgba(255,255,255,.3); color: #fff8ed; background: transparent; }

body.field-note-page footer,
body.policy-page footer {
  max-width: none;
  margin: 0;
  padding: 2.6rem max(1.25rem, calc((100vw - var(--max)) / 2)) 3.4rem;
  border: 0;
  background: var(--ink);
  color: rgba(255,255,255,.72);
}

body.field-note-page footer .brand-mark,
body.policy-page footer .brand-mark { color: #fff8ed; }
body.field-note-page footer .brand-primary,
body.policy-page footer .brand-primary { color: #fff8ed; }
body.field-note-page footer .frontier-mark,
body.policy-page footer .frontier-mark { display: none; }
body.field-note-page footer .foot-links,
body.policy-page footer .foot-links { gap: .9rem 1.3rem; }
body.field-note-page footer .foot-links a,
body.policy-page footer .foot-links a { color: rgba(255,255,255,.7); }
body.field-note-page footer .foot-links a:hover,
body.policy-page footer .foot-links a:hover { color: #fff8ed; }

html[dir="rtl"] body.field-note-page main,
html[dir="rtl"] body.policy-page main,
html[dir="rtl"] .field-note-bridge { text-align: right; }
html[dir="rtl"] body.field-note-page .article-body p,
html[dir="rtl"] body.policy-page p,
html[dir="rtl"] body.policy-page li,
html[dir="rtl"] body.field-note-page .next-up a,
html[dir="rtl"] .field-note-bridge p { unicode-bidi: plaintext; }
html[dir="rtl"] body.field-note-page .back-link { flex-direction: row-reverse; }

@media (max-width: 700px) {
  body.field-note-page main,
  body.policy-page main { width: min(calc(100% - 2rem), 780px); }
  .field-note-bridge { width: min(calc(100% - 2rem), 1240px); }
  .field-note-bridge-grid { grid-template-columns: 1fr; }
  .field-note-bridge .button-row { justify-content: flex-start; }
  body.field-note-page h1,
  body.policy-page h1 { font-size: clamp(2.5rem, 12vw, 3.35rem); }
}