﻿/* THE OPENING - Field Manual editorial rescue
   Restores the sharper field-code rhythm from the first version. */

.manual-cover {
  min-height: 92svh;
  align-items: flex-end;
  padding: clamp(120px, 14vh, 160px) 0 clamp(58px, 7vw, 92px);
  background:
    radial-gradient(ellipse 70% 55% at 25% 18%, rgba(255, 199, 0, 0.055), transparent 60%),
    var(--black);
}

.manual-cover::before {
  inset: 0;
  background: url("../assets/img/curation/field-manual/FIELD_HERO_01_rain_reflections_texture.jpg?v=assetfix1") center / cover no-repeat;
  transform: none;
  transform-origin: center;
  filter: grayscale(0.95) contrast(1.08) brightness(0.42);
  opacity: 0.18;
}

.manual-cover h1 {
  max-width: 12.4ch;
  font-size: clamp(3.7rem, 7.35vw, 7.7rem);
  line-height: 0.88;
  letter-spacing: -0.032em;
  font-weight: 840;
}

.manual-sub {
  max-width: 48ch;
  font: italic clamp(1.06rem, 1.42vw, 1.36rem)/1.56 var(--serif);
}

.manual-note p {
  color: rgba(255, 248, 236, 0.66);
}

.limits {
  background: var(--black);
}

.limits h2 {
  max-width: 16ch;
}

.limits-intro {
  max-width: 54ch;
  color: rgba(239, 235, 225, 0.76);
}

.limits .h-display,
.pressure-test .h-display,
.field-reading .h-display,
.field-code .h-display {
  font-size: clamp(3rem, 5.8vw, 6.1rem);
  line-height: 0.9;
  letter-spacing: -0.032em;
  font-weight: 840;
}

.pressure-test .serif-em {
  display: block;
  margin: 0.02em 0 0.04em;
  font-family: "Newsreader", Georgia, serif;
  font-style: italic;
  font-weight: 500;
  text-transform: none;
  letter-spacing: -0.012em;
  line-height: 0.9;
  color: var(--bone);
}

.limit-list {
  display: grid;
  gap: 0;
  margin-top: clamp(42px, 5.5vw, 72px);
}

.limit {
  position: relative;
  top: auto;
  z-index: auto;
  display: grid;
  grid-template-columns: minmax(0, 6ch) minmax(0, 0.9fr) minmax(0, 1.35fr);
  gap: clamp(16px, 3vw, 48px);
  align-items: baseline;
  margin: 0;
  padding: clamp(24px, 2.8vw, 36px) 0;
  border-top: 1px solid rgba(248, 247, 242, 0.14);
  background: transparent;
}

.limit:last-child {
  border-bottom: 1px solid rgba(248, 247, 242, 0.14);
}

.limit::before {
  display: none;
}

.limit-no {
  margin: 0;
  vertical-align: baseline;
  color: var(--mark);
  font-size: clamp(0.95rem, 1.35vw, 1.35rem);
  letter-spacing: 0.05em;
}

.limit h3 {
  display: block;
  font-size: clamp(1.28rem, 2.08vw, 2.05rem);
  line-height: 1.02;
  letter-spacing: -0.018em;
}

.limit p {
  max-width: 60ch;
  margin: 0;
  color: rgba(239, 235, 225, 0.72);
  line-height: 1.62;
}

.pressure-test {
  min-height: 104svh;
  background: #000000;
}

.pressure-test::before {
  inset: 0;
  background: url("../assets/img/curation/field-manual/FIELD_PRESSURE_01_times_square_bw.jpg?v=assetfix1") center 30% / cover no-repeat;
  transform: none;
  transform-origin: center;
  filter: saturate(0.55) contrast(1.08) brightness(0.38);
  opacity: 0.72;
}

.pressure-copy {
  max-width: 48ch;
  font-size: clamp(1rem, 1.12vw, 1.12rem);
  line-height: 1.64;
}

.conditions {
  margin-top: clamp(52px, 6.4vw, 92px);
  justify-content: flex-start;
  text-align: left;
  gap: clamp(8px, 1.1vw, 18px) clamp(18px, 2.8vw, 44px);
  max-width: 1120px;
  font-size: clamp(1.35rem, 2.85vw, 3.15rem);
  line-height: 1.08;
  letter-spacing: -0.018em;
  color: rgba(239, 235, 225, 0.62);
}

.conditions span {
  color: rgba(239, 235, 225, 0.62);
}

.conditions span:nth-child(2),
.conditions span:nth-child(4),
.conditions span:nth-child(6),
.conditions span:nth-child(10) {
  color: var(--mark);
}

.pressure-end {
  color: #f8f7f2;
}

.field-reading {
  background:
    linear-gradient(rgba(239, 235, 225, 0.94), rgba(239, 235, 225, 0.94)),
    url("../assets/img/curation/field-manual/FIELD_TEXTURE_01_bone_paper.jpg?v=assetfix1") center / clamp(680px, 75vw, 1200px) auto;
}

.observation-scroll-container,
.observation-sticky {
  height: auto;
  min-height: 0;
  position: static;
  overflow: visible;
}

.observation-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  transform: none;
}

.observation:nth-child(n) {
  grid-column: auto;
  margin: 0;
}

.observation {
  display: grid;
  grid-template-columns: minmax(0, 6ch) minmax(0, 0.9fr) minmax(0, 1.35fr);
  gap: clamp(16px, 3vw, 48px);
  align-items: baseline;
  padding: clamp(24px, 2.8vw, 36px) 0;
}

.observation h3 {
  font-size: clamp(1.28rem, 2.08vw, 2.05rem);
  line-height: 1.02;
  letter-spacing: -0.018em;
}

.field-code {
  background: var(--black);
}

.field-code h2 {
  max-width: 14ch;
}

.code-lines {
  display: grid;
  gap: clamp(10px, 1.4vw, 18px);
  margin-top: clamp(42px, 5vw, 66px);
}

.code-line {
  margin: 0;
  color: var(--white);
  font: 840 clamp(1.85rem, 4.4vw, 4.1rem)/1 var(--display);
  letter-spacing: -0.028em;
  text-transform: uppercase;
}

.code-line b {
  color: var(--mark);
  font-weight: 800;
}

.field-question {
  margin-top: clamp(44px, 5vw, 72px);
  padding-left: clamp(20px, 2vw, 30px);
  border-left: 1px solid rgba(255, 248, 236, 0.16);
}

.field-question .lab {
  margin-bottom: 14px;
  color: var(--mark);
  font: 600 11px var(--mono);
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.field-question p {
  max-width: 27ch;
  margin: 0;
  color: var(--bone);
  font: italic clamp(1.28rem, 2.1vw, 2.05rem)/1.38 var(--serif);
}

.use-field h2 {
  max-width: 22ch;
  font-size: clamp(2.25rem, 4.8vw, 5rem);
  line-height: 0.92;
  letter-spacing: -0.032em;
  font-weight: 840;
}

.use-copy {
  max-width: 52ch;
}

@media (max-width: 760px) {
  .limit,
  .observation {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .conditions {
    font-size: clamp(1.45rem, 8.8vw, 3.05rem);
  }
}

/* Field Manual alignment with the global cinematic/editorial pass. */
.manual-cover,
.limits,
.pressure-test,
.field-code,
.use-field {
  background: #000000;
}

.manual-cover,
.pressure-test {
  min-height: 100svh;
}

.manual-cover::before,
.pressure-test::before {
  inset: 0;
  transform: none;
  filter: grayscale(1) contrast(1.12) brightness(0.46);
}

.manual-cover::before {
  opacity: 0.24;
}

.pressure-test::before {
  opacity: 0.68;
}

.manual-cover h1,
.limits .h-display,
.pressure-test .h-display,
.field-reading .h-display,
.field-code .h-display,
.use-field h2 {
  font-weight: 860;
  font-stretch: 94%;
  letter-spacing: -0.036em;
  text-transform: uppercase;
}

.manual-cover h1 {
  font-size: clamp(3.45rem, 6.9vw, 7.2rem);
  max-width: 12.8ch;
}

.limits .h-display,
.pressure-test .h-display,
.field-reading .h-display,
.field-code .h-display {
  font-size: clamp(2.8rem, 5.25vw, 5.75rem);
}

.manual-sub,
.limits-intro,
.pressure-copy,
.use-copy {
  color: rgba(239, 235, 225, 0.78);
  line-height: 1.58;
}

.limit,
.observation {
  padding: clamp(30px, 3.3vw, 44px) 0;
  border-top-color: rgba(239, 235, 225, 0.18);
}

.field-reading .observation {
  border-top-color: rgba(3, 3, 3, 0.2);
}

.field-reading {
  padding-top: clamp(108px, 11.5vw, 168px);
  padding-bottom: clamp(112px, 12vw, 184px);
}

.field-code,
.use-field,
.limits,
.pressure-test {
  padding-top: clamp(108px, 11.5vw, 168px);
  padding-bottom: clamp(112px, 12vw, 184px);
}

.code-line {
  font-size: clamp(1.65rem, 3.85vw, 3.75rem);
  line-height: 0.98;
}

.field-question {
  border-left-color: rgba(255, 199, 0, 0.42);
}

/* Editorial cleanup: Field Manual keeps signal color without yellow text boxes. */
.limit::before,
.limit.in::before {
  content: none;
  display: none;
  width: 0;
  background: transparent;
}

.limit .limit-no {
  background: transparent;
  color: var(--mark);
  padding: 0;
  box-shadow: none;
}

.field-reading .serif-em,
.pressure-test .serif-em,
.manual-cover .serif-em {
  background: transparent;
  padding: 0;
  box-shadow: none;
}

.field-reading .serif-em {
  color: var(--ink);
}

.pressure-test .serif-em,
.manual-cover .serif-em {
  color: var(--bone);
}

.field-reading .observation,
.limit {
  background: transparent;
  box-shadow: none;
}

/* Field Manual type governance: one hero, then editorial manual rhythm. */
body .manual-cover h1 {
  font-size: clamp(3.7rem, 6.85vw, 7.45rem);
  line-height: 0.86;
  letter-spacing: -0.038em;
  font-weight: 860;
}

body .limits .h-display,
body .pressure-test .h-display,
body .field-reading .h-display,
body .field-code .h-display,
body .use-field h2 {
  font-size: clamp(2.55rem, 4.6vw, 5.05rem);
  line-height: 0.94;
  letter-spacing: -0.032em;
  font-weight: 830;
}

body .pressure-test .h-display {
  font-size: clamp(2.9rem, 5.1vw, 5.65rem);
}

body .limit h3,
body .observation h3 {
  font-weight: 820;
  font-size: clamp(1.35rem, 2.25vw, 2.35rem);
  line-height: 1.04;
  letter-spacing: -0.028em;
}

body .conditions {
  font-size: clamp(2.1rem, 5.8vw, 5.2rem);
  line-height: 0.96;
  letter-spacing: -0.035em;
  font-weight: 830;
}

body .manual-sub,
body .limits-intro,
body .pressure-copy,
body .use-copy,
body .observation p,
body .limit p {
  font-size: clamp(1rem, 1.22vw, 1.18rem);
  line-height: 1.58;
}

body .serif-em,
body .manual-cover .serif-em,
body .pressure-test .serif-em,
body .field-reading .serif-em {
  font-family: "Newsreader", Georgia, serif;
  font-style: italic;
  font-weight: 500;
  text-transform: none;
  letter-spacing: -0.006em;
}

@media (max-width: 760px) {
  .manual-cover h1 {
    font-size: clamp(3.1rem, 13vw, 4.8rem);
  }

  .limits .h-display,
  .pressure-test .h-display,
  .field-reading .h-display,
  .field-code .h-display {
    font-size: clamp(2.65rem, 12vw, 4.3rem);
  }

  body .limits .h-display,
  body .pressure-test .h-display,
  body .field-reading .h-display,
  body .field-code .h-display,
  body .use-field h2 {
    font-size: clamp(2.35rem, 10.4vw, 3.95rem);
    line-height: 0.96;
  }

  body .conditions {
    font-size: clamp(1.8rem, 8.8vw, 3.2rem);
  }
}

