@import url("/assets/brand/constellation-1.0.0.css");

/* PFM-001F/G: field photographs behave as documentary figures, never equal-height cards. */
.field-photo {
  min-width: 0;
  margin: 0;
  color: var(--shell-muted);
}

.field-photo picture,
.field-photo img {
  display: block;
  max-width: 100%;
}

.field-photo img {
  width: 100%;
  height: auto;
  background: var(--shell-surface-2);
}

.field-photo--portrait img {
  width: auto;
  max-height: 720px;
  margin-inline: auto;
}

.field-photo figcaption {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--shell-border);
  font-size: .76rem;
  line-height: 1.55;
}

.field-photo__fallback {
  display: grid;
  min-height: 220px;
  margin: 0;
  place-items: center;
  border: 1px solid var(--shell-border);
  color: var(--shell-muted);
  background: var(--shell-surface-2);
}

.field-photo__fallback[hidden] { display: none; }
.field-photo.is-unavailable picture { display: none; }

.field-observation { scroll-margin-top: 88px; }
.field-observation__heading { align-items: end; }

.field-observation__route {
  display: flex;
  flex-wrap: wrap;
  margin: 32px 0 64px;
  border-block: 1px solid var(--shell-border);
}

.field-observation__route a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  padding: 8px 18px;
  border-right: 1px solid var(--shell-border);
  color: var(--shell-muted);
  font: 700 .82rem/1.2 var(--brand-font-ui);
  text-decoration: none;
}

.field-observation__route a:hover,
.field-observation__route a:focus-visible {
  color: var(--shell-text);
  background: var(--shell-surface-2);
}

.field-observation__route a:focus-visible {
  outline: 3px solid var(--shell-focus);
  outline-offset: 2px;
}

.field-observation__list {
  display: grid;
  gap: clamp(72px, 11vw, 148px);
  margin: 0;
  padding: 0;
  list-style: none;
}

.field-observation__list > li {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(260px, .72fr);
  gap: clamp(32px, 7vw, 96px);
  align-items: center;
  scroll-margin-top: 96px;
}

.field-observation__list > li:nth-child(even) {
  grid-template-columns: minmax(260px, .72fr) minmax(0, 1.12fr);
}

.field-observation__list > li:nth-child(even) .field-photo { order: 2; }
.field-observation__list > li:nth-child(even) .field-observation__prompt { order: 1; }

.field-observation__prompt {
  padding-block: 28px;
  border-block: 1px solid var(--shell-border);
}

.field-observation__prompt > span {
  color: var(--shell-link);
  font: 700 .76rem/1 var(--brand-font-ui);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.field-observation__prompt h3 {
  max-width: 18ch;
  margin: 18px 0;
  color: var(--shell-text);
  font: 650 clamp(1.7rem, 3.5vw, 3.4rem)/1 var(--brand-font-display);
  letter-spacing: -.035em;
}

.field-observation__prompt p,
.field-rights-note,
.field-observation__review {
  max-width: 58ch;
  color: var(--shell-muted);
  line-height: 1.7;
}

.field-observation__prompt .science-link {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  margin-top: 12px;
}

.field-observation__review {
  margin: 72px 0 0;
  padding: 16px;
  border: 1px solid var(--shell-border);
  background: var(--shell-surface-2);
  color: var(--shell-text);
  font-size: .88rem;
}

.field-rights-note {
  margin: 24px 0 0;
  padding-top: 20px;
  border-top: 1px solid var(--shell-border);
  font-size: .82rem;
}

/* PFM-001G: one field figure supports the provenance narrative without becoming a gallery. */
.field-to-record {
  overflow: clip;
  background: color-mix(in srgb, var(--shell-surface) 72%, var(--shell-bg));
}

.field-to-record__grid {
  display: grid;
  grid-template-columns: minmax(320px, .84fr) minmax(0, 1.16fr);
  gap: clamp(42px, 8vw, 108px);
  align-items: center;
}

.field-to-record__copy { min-width: 0; }
.field-to-record__copy .section-h2 { max-width: 14ch; }
.field-to-record__boundary { max-width: 54ch; }

.field-to-record__steps {
  margin: 34px 0 0;
  padding: 0;
  border-block: 1px solid var(--shell-border);
  list-style: none;
}

.field-to-record__steps li {
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  gap: 14px;
  padding-block: 16px;
}

.field-to-record__steps li + li { border-top: 1px solid var(--shell-border); }

.field-to-record__steps span {
  color: var(--shell-link);
  font: 750 .74rem/1.65 var(--brand-font-ui);
  letter-spacing: .06em;
}

.field-to-record__steps p {
  margin: 0;
  color: var(--shell-muted);
  line-height: 1.55;
}

.field-to-record__steps strong {
  display: block;
  margin-bottom: 2px;
  color: var(--shell-text);
  font-family: var(--brand-font-ui);
}

.field-to-record__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
  margin-top: 26px;
}

.field-to-record__actions a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
}

.field-to-record__photo {
  width: min(100%, 640px);
  justify-self: end;
}

.field-to-record__photo img { border: 1px solid var(--shell-border); }
.field-to-record__photo figcaption { max-width: 58ch; }

/* BRAND-001E: presentation only for trust, policy and transition surfaces.
 * Legal prose remains in the HTML and is not generated or rewritten here. */

.trust-page {
  --bg: var(--shell-bg);
  --surface: var(--shell-surface);
  --surface-2: var(--shell-surface-2);
  --surface-3: var(--brand-neutral-200);
  --text: var(--shell-text);
  --text-muted: var(--shell-muted);
  --text-faint: var(--shell-muted);
  --accent: var(--shell-link);
  --accent-lt: var(--brand-amber-500);
  --gold: var(--shell-link);
  --divider: var(--shell-border);
  --border: var(--shell-border);
  --max-content: 1120px;
  background: var(--shell-bg);
  overflow-x: clip;
}

/* Keep editorial motion without fading readable content below AA contrast. */
.trust-page .reveal,
.js .trust-page .reveal {
  opacity: 1;
  transition: transform .6s var(--ease-out);
}

.trust-page :is(main, .breadcrumb, .page-hero, .legal) { min-width: 0; max-width: 100%; }

.trust-page .breadcrumb {
  max-width: 1120px;
  padding-top: 96px;
  color: var(--shell-muted);
}

.trust-page .page-hero {
  max-width: 1120px;
  padding-block: 56px 76px;
  border-bottom: 1px solid var(--shell-border);
}

.trust-page .page-eyebrow,
.trust-page .section-label {
  color: var(--shell-link);
  font-weight: 700;
  letter-spacing: .14em;
}

.trust-page .page-title {
  max-width: 15ch;
  margin-bottom: 24px;
  color: var(--shell-text);
  font-size: clamp(2.8rem, 7vw, 6.4rem);
  line-height: .94;
  letter-spacing: -.055em;
}

.trust-page .page-title em,
.trust-page .section-h2 em {
  color: var(--shell-link) !important;
  font-style: normal;
}

.trust-page .page-subtitle {
  max-width: 68ch;
  color: var(--shell-muted);
  font-size: clamp(1rem, 1.6vw, 1.22rem);
}

.trust-page .page-section {
  padding-block: 76px;
  border-color: var(--shell-border);
}

.trust-page .container,
.trust-page .container--wide {
  max-width: 1120px;
}

.trust-page .section-h2 {
  max-width: 23ch;
  color: var(--shell-text);
  font-size: clamp(2rem, 4.4vw, 4rem);
  line-height: 1;
  letter-spacing: -.04em;
}

.trust-page .body-text,
.trust-page .page-subtitle,
.trust-page .source-card-desc,
.trust-page .profile-desc,
.trust-page .profile-contrib li,
.trust-page .form-subtitle,
.trust-page .step-desc {
  color: var(--shell-muted);
}

.trust-page .source-grid,
.trust-page .status-grid,
.trust-page .profiles-grid {
  gap: 1px;
  padding: 1px;
  border: 0;
  background: var(--shell-border);
}

.trust-page .source-card,
.trust-page .status-item,
.trust-page .profile-card {
  border: 0;
  border-radius: 0;
  background: var(--shell-surface);
  box-shadow: none;
}

.trust-page .source-card:hover,
.trust-page .profile-card:hover {
  border: 0;
  background: color-mix(in srgb, var(--shell-surface) 88%, var(--shell-link));
}

.trust-page .status-item-value.available,
.trust-page .status-item-value.pending,
.trust-page .source-card-link,
.trust-page .profile-icon {
  color: var(--shell-link);
}

.trust-page .pull-quote,
.trust-page .authority-card,
.trust-page .cta-band,
.trust-page .form-section {
  border: 1px solid var(--shell-border);
  border-radius: 0;
  background: var(--shell-surface);
  box-shadow: none;
}

.trust-page .btn-profile,
.trust-page .btn-submit,
.trust-page .btn-primary,
.trust-page .btn-ghost {
  border-radius: 2px;
}

.trust-page .form-row :is(input, select, textarea) {
  border-radius: 2px;
  background: var(--shell-bg);
  color: var(--shell-text);
}

.trust-page .timeline .step-num {
  border-radius: 2px;
  background: var(--shell-surface);
  color: var(--shell-link);
}

/* Policies become reading desks: index at left, immutable document at right. */
.trust-page--legal .page-title { max-width: 18ch; font-size: clamp(2.6rem, 6vw, 5rem); }
.trust-page--legal .page-hero { padding-bottom: 52px; }
.trust-page--legal .legal {
  display: grid;
  grid-template-columns: minmax(210px, 270px) minmax(0, 1fr);
  gap: 24px 64px;
  max-width: 1120px;
  padding-block: 56px 80px;
}

.trust-page--legal .legal .toc {
  grid-column: 1;
  grid-row: 1 / span 30;
  position: sticky;
  top: 88px;
  align-self: start;
  margin: 0;
  padding: 20px 0;
  border: 0;
  border-block: 1px solid var(--shell-border);
  border-radius: 0;
  background: transparent;
}

.trust-page--legal .legal .toc ol {
  columns: 1;
  padding-left: 1.25rem;
}

.trust-page--legal .legal section {
  grid-column: 2;
  min-width: 0;
  margin: 0;
  padding-bottom: 28px;
  border-bottom: 1px solid var(--shell-border);
}

.trust-page--legal .legal h2.sec {
  display: grid;
  grid-template-columns: 2.5rem 1fr;
  gap: 12px;
  padding: 0;
  border: 0;
  color: var(--shell-text);
  font-size: clamp(1.45rem, 2.5vw, 2.15rem);
  line-height: 1.1;
}

.trust-page--legal .legal :is(p, ul, td),
.trust-page--legal .legal .toc a {
  color: var(--shell-muted);
}

.trust-page--legal .legal :is(.callout, .rights-card, .role-card) {
  border-color: var(--shell-border);
  border-radius: 0;
  background: var(--shell-surface);
}

.trust-page--legal .doc-badge {
  border-radius: 2px;
  border-color: var(--shell-border);
  color: var(--shell-muted);
}

/* Auth and legacy entry points are truthful transitions, never local forms. */
.transition-page {
  min-height: 100%;
  color-scheme: light dark;
  background: var(--brand-neutral-950);
  color: var(--brand-cream-100);
  font-family: var(--brand-font-body);
}

.transition-page *,
.transition-page *::before,
.transition-page *::after { box-sizing: border-box; }

.transition-page body {
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at 82% 14%, color-mix(in srgb, var(--brand-indigo-600) 32%, transparent), transparent 28rem),
    linear-gradient(135deg, var(--brand-neutral-950), #0f1018 68%, var(--brand-indigo-900));
}

.transition-shell {
  min-height: 100vh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  width: min(100%, 1180px);
  margin: 0 auto;
  padding: 28px clamp(20px, 5vw, 64px) 36px;
}

.transition-brand {
  display: inline-flex;
  width: fit-content;
  min-height: 44px;
  align-items: center;
}

.transition-brand img { width: 154px; height: auto; display: block; }

.transition-main {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .65fr);
  gap: clamp(44px, 9vw, 112px);
  align-items: center;
  padding-block: clamp(72px, 12vh, 148px);
}

.transition-kicker {
  margin: 0 0 18px;
  color: var(--brand-amber-500);
  font: 700 .75rem/1 var(--brand-font-ui);
  letter-spacing: .16em;
  text-transform: uppercase;
}

.transition-main h1 {
  max-width: 11ch;
  margin: 0;
  font: 650 clamp(3rem, 8vw, 7.2rem)/.9 var(--brand-font-display);
  letter-spacing: -.06em;
}

.transition-main h1 em { color: var(--brand-neutral-200); font-style: normal; }

.transition-summary {
  max-width: 58ch;
  margin: 28px 0 0;
  color: var(--brand-neutral-200);
  font-size: clamp(1rem, 1.5vw, 1.16rem);
  line-height: 1.7;
}

.transition-status {
  padding: 24px;
  border: 1px solid color-mix(in srgb, var(--brand-cream-100) 18%, transparent);
  background: color-mix(in srgb, var(--brand-neutral-900) 82%, transparent);
}

.transition-status strong {
  display: block;
  margin-bottom: 10px;
  color: var(--brand-cream-100);
  font: 650 1.22rem/1.2 var(--brand-font-display);
}

.transition-status p {
  margin: 0;
  color: var(--brand-neutral-200);
  line-height: 1.65;
}

.transition-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.transition-actions a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  padding: 0 18px;
  border: 1px solid var(--brand-amber-500);
  color: var(--brand-neutral-950);
  background: var(--brand-amber-500);
  font-weight: 750;
  text-decoration: none;
}
.transition-actions a + a { color: var(--brand-cream-100); background: transparent; }
.transition-actions a:focus-visible,
.transition-brand:focus-visible { outline: 3px solid var(--brand-amber-500); outline-offset: 4px; }

.transition-note {
  padding-top: 22px;
  border-top: 1px solid color-mix(in srgb, var(--brand-cream-100) 16%, transparent);
  color: var(--brand-neutral-400);
  font-size: .82rem;
  line-height: 1.6;
}

@media (max-width: 760px) {
  .field-to-record__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 38px;
  }
  .field-to-record__photo { width: 100%; justify-self: stretch; }
  .field-observation__route {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 52px;
  }
  .field-observation__route a {
    min-width: 0;
    border-bottom: 1px solid var(--shell-border);
  }
  .field-observation__list > li,
  .field-observation__list > li:nth-child(even) {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }
  .field-observation__list > li:nth-child(even) .field-photo,
  .field-observation__list > li:nth-child(even) .field-observation__prompt { order: initial; }
  .field-observation__prompt { padding-block: 22px; }
  .field-photo--portrait img { width: 100%; max-height: none; }
  .trust-page .page-hero { padding-block: 38px 52px; }
  .trust-page .page-title { font-size: clamp(2.65rem, 15vw, 4.5rem); }
  .trust-page .page-section { padding-block: 52px; }
  .trust-page--legal .legal {
    grid-template-columns: minmax(0, 1fr);
    gap: 36px;
    width: auto;
    margin-inline: 20px;
    padding: 36px 0 56px;
  }
  .trust-page--legal .legal .toc {
    grid-column: 1;
    grid-row: auto;
    position: static;
  }
  .trust-page--legal .legal section { grid-column: 1; }
  .trust-page--legal .table-wrap { max-width: 100%; }
  .transition-main { grid-template-columns: 1fr; gap: 40px; padding-block: 68px; }
  .transition-main h1 { font-size: clamp(2.8rem, 17vw, 5rem); }
  .transition-brand img { width: 132px; }
}

@media (prefers-reduced-motion: reduce) {
  .trust-page *, .transition-page * { scroll-behavior: auto !important; transition: none !important; }
}