/* The homepage leads with the company and lets identity work carry the gallery. */
.page-home { --einhar-section-gap: clamp(170px, 16vw, 250px); }
body.page-home { min-width: 0; overflow-x: clip; }
.page-home .nav-stage { width: 100%; }
.page-home #recent-posts { width: 100% !important; max-width: 100% !important; }
.page-home .opening { margin-bottom: 0 !important; }
.page-home #approach,
.page-home #working-method,
.page-home #thinking,
.page-home #research-note,
.page-home #recent-posts,
.page-home #horizon { margin-top: var(--einhar-section-gap) !important; margin-bottom: 0 !important; }
.page-home #horizon { margin-bottom: var(--einhar-section-gap) !important; }

.page-home .opening.reading {
  width: 100% !important;
  max-width: none !important;
  margin-inline: auto !important;
  padding-top: clamp(36px, 4vw, 58px) !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: visible;
  text-align: center;
}
.page-home .opening h1 {
  max-width: 13ch !important;
  margin: 0 auto !important;
  font-size: clamp(50px, 5vw, 72px) !important;
  font-weight: 500 !important;
  line-height: 1.035 !important;
  letter-spacing: -.065em !important;
  text-wrap: balance;
}
.page-home .opening p { max-width: 585px; margin: clamp(8px, 2.3vw, 30px) 20px 0 !important; font-size: 16px !important; line-height: 1.62 !important; }
.page-home .opening-continuation.reading { width: 100%; max-width: none; box-sizing: border-box; padding-inline: var(--page-edge); margin: clamp(140px, 15vw, 225px) 0 0; }
.page-home .opening-continuation p { max-width: 780px; font-size: clamp(18px, 1.8vw, 23px); line-height: 1.55; }
.page-home .visual-interlude { display: block; margin-bottom: 0; }
.page-home .visual-interlude--field {
  width: 100%;
  max-width: none;
  margin: clamp(112px, 11vw, 175px) 0 0;
  overflow: hidden;
}
.page-home .home-gallery-track {
  --gallery-height: clamp(180px, 15.5vw, 270px);
  display: flex;
  align-items: stretch;
  gap: clamp(6px, .55vw, 9px);
  width: 100%;
  height: var(--gallery-height);
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
}
.page-home .home-gallery-track::-webkit-scrollbar { display: none; }
.page-home .home-work-row + .home-work-row { margin-top: clamp(62px, 6vw, 100px); }
.page-home .home-work-heading {
  display: flex;
  align-items: baseline;
  gap: 16px;
  min-height: 29px;
  padding: 0;
  color: var(--ink-primary, #171717);
}
.page-home .home-work-heading h2 {
  margin: 0;
  font: 500 15px/1.2 var(--font-einhar, Arial, sans-serif);
  letter-spacing: -.035em;
}
.page-home .home-work-heading span {
  color: var(--ink-secondary, #6e6e6e);
  font: 400 14px/1.2 var(--font-einhar, Arial, sans-serif);
  letter-spacing: -.02em;
}
.page-home .home-gallery-item {
  position: relative;
  display: block;
  flex: 0 0 auto;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  scroll-snap-align: start;
}
.page-home .home-gallery-item--field { flex-basis: calc(var(--gallery-height) * 1.78); }
.page-home .home-art--field-painting { flex-basis: calc(var(--gallery-height) * 1.55); }
.page-home .home-art--specimen { flex-basis: calc(var(--gallery-height) * 1.03); background: #fff; }
.page-home .home-art--seed { flex-basis: calc(var(--gallery-height) * 1.48); }
.page-home .home-art--grainform-folio { flex-basis: calc(var(--gallery-height) * 1.53); }
.page-home .home-art--grainform-particles { flex-basis: calc(var(--gallery-height) * 1.7); background: #0f0f0e; }
.page-home .home-art--grainform-detail { flex-basis: calc(var(--gallery-height) * 1.45); }
.page-home .home-art > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.page-home .home-art--grainform-particles > img { object-fit: contain; }
.page-home .home-gallery-imprint {
  position: absolute;
  left: 8%;
  bottom: 8%;
  color: #f7f3e9;
  font: 500 clamp(25px, 3.2vw, 48px)/1 var(--font-einhar, Arial, sans-serif);
  letter-spacing: -.085em;
  text-shadow: 0 1px 9px #302b2544;
}
.page-home .home-gallery-print { position: relative; width: 100%; height: 100%; background: #fff; }
.page-home .home-gallery-print img {
  display: block;
  width: 57%;
  height: 79%;
  object-fit: cover;
  margin: auto;
  filter: saturate(.68);
}
.page-home .home-gallery-print span {
  position: absolute;
  left: 21.5%;
  bottom: 4%;
  color: #69645d;
  font: 400 clamp(8px, .8vw, 11px)/1.25 var(--font-einhar, Arial, sans-serif);
  text-align: left;
}
.page-home .home-art--seed { background: #fff; }
.page-home .home-art--seed > img { height: 78%; filter: saturate(.62); }
.page-home .home-gallery-seed-note {
  position: absolute;
  left: 0;
  bottom: 2%;
  color: #282923;
  font: 400 clamp(12px, 1.15vw, 16px)/1.2 Georgia, serif;
  letter-spacing: -.025em;
  text-align: left;
}
.page-home .home-gallery-item.home-art--grainform-particles > img { filter: grayscale(1) contrast(1.08); }
.page-home .home-gallery-item .grain-frame {
  height: 100%;
  border-radius: 0;
  background: #f0eee8;
}
.page-home .home-gallery-item img {
  object-position: center;
  filter: none;
  transition: opacity .8s ease, transform 1.2s cubic-bezier(.2,.7,.2,1);
}
.page-home .home-gallery-item--field img { object-position: center 61%; filter: grayscale(.84) contrast(1.13) brightness(.96); }
.page-home .home-gallery-item.grain-ready .grain-frame img { opacity: 0; }
.page-home .home-gallery-item.grain-ready.is-in-view .grain-frame img {
  opacity: 1;
  transition: opacity 1.15s ease .55s, transform 1.2s cubic-bezier(.2,.7,.2,1);
}
.page-home .home-gallery-item.grain-ready.is-in-view .grain-frame canvas {
  opacity: 0;
  filter: contrast(1);
  transform: none;
  transition: opacity .86s ease .78s, filter 1.2s ease, transform 1.7s ease;
}
.page-home .home-gallery-item:hover img { transform: scale(1.018); }
.page-home .home-gallery-track:focus-visible {
  outline: 2px solid var(--ink-primary, #161616);
  outline-offset: -2px;
}
.page-home .visual-interlude .grain-frame {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  background: #050505;
  border-radius: 4px;
}
.page-home .visual-interlude--field .grain-frame { aspect-ratio: auto; max-height: none; border-radius: 0; -webkit-mask-image: none; mask-image: none; }
.page-home .visual-interlude--field .grain-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: none;
}
.page-home .visual-interlude--field .grain-frame img { filter: none; }
.page-home .visual-interlude .grain-frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(1) contrast(1.28) brightness(.84);
}
.page-home .visual-interlude .grain-frame canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  image-rendering: pixelated;
  filter: contrast(1.12);
  transform: scale(1.006);
}
.page-home .visual-interlude.grain-ready .grain-frame img { opacity: 0; }
.page-home .visual-interlude.grain-ready.is-in-view .grain-frame img {
  opacity: 1;
  transition: opacity 1.15s ease .55s;
}
.page-home .visual-interlude.grain-ready.is-in-view .grain-frame canvas {
  opacity: 0;
  filter: contrast(1);
  transform: none;
  transition: opacity .86s ease .78s, filter 1.2s ease, transform 1.7s ease;
}
.page-home .visual-interlude--branch .grain-frame img { filter: grayscale(1) contrast(1.3) brightness(.86); }
.page-home .visual-interlude--evidence .grain-frame img { filter: grayscale(1) contrast(1.25) brightness(.94); }
@keyframes einhar-hero-title { from { opacity: 0; filter: blur(12px); transform: translateY(12px); } to { opacity: 1; filter: blur(0); transform: none; } }
@keyframes einhar-hero-art { from { opacity: 0; filter: blur(13px); transform: translateY(22px) scale(1.025); } to { opacity: 1; filter: blur(0); transform: none; } }
@keyframes einhar-hero-copy { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.page-home .opening h1 { animation: einhar-hero-title 1.15s cubic-bezier(.2,.7,.2,1) .1s both; }
.page-home .opening .visual-interlude--field { animation: einhar-hero-art 1.5s cubic-bezier(.2,.7,.2,1) .57s both; }
.page-home .opening > p { animation: einhar-hero-copy .8s ease 1.35s both; }
.page-home #working-method { width: 100% !important; max-width: none !important; margin-inline: 0 !important; }
.page-home #thinking { margin-top: 0 !important; }
.page-home .decision-sticky {
  position: relative;
  width: 100%;
  min-height: 84svh;
  margin: 0;
  padding: 0 var(--page-edge);
  box-sizing: border-box;
  isolation: isolate;
}
.page-home #decision-statement {
  max-width: 12ch;
  margin: 0;
  color: var(--ink-primary, #171717);
  font: 500 clamp(42px, 6.2vw, 88px)/1.01 var(--font-einhar,Arial),sans-serif;
  letter-spacing: -.066em;
}
.page-home .decision-visual { position: relative; width: 100%; aspect-ratio: 1.72; margin-top: clamp(35px, 5vw, 72px); overflow: hidden; background: #f5f5f3; }
.page-home .decision-visual picture { display: block; width: 100%; height: 100%; }
.page-home .decision-image { display: block; width: 100%; height: 100%; object-fit: cover; }
html.decision-enabled .page-home #working-method { height: 245svh; }
html.decision-enabled .page-home .decision-sticky { position: sticky; top: 0; height: 100svh; min-height: 0; padding: 0; overflow: hidden; background: var(--surface-page); }
html.decision-enabled .page-home .decision-visual { position: absolute; inset: 25svh var(--page-edge) 4svh; width: auto; height: auto; aspect-ratio: auto; margin: 0; }
html.decision-enabled .page-home .decision-image { opacity: var(--photo-opacity, 0); transform: scale(var(--photo-scale, 1)); transform-origin: center; }
html.decision-enabled .page-home .decision-pixels { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
html.decision-enabled .page-home #decision-statement { position: absolute; z-index: 4; top: clamp(24px, 5.8svh, 68px); left: var(--page-edge); width: min(850px, calc(100% - 2 * var(--page-edge))); max-width: 12ch; opacity: var(--copy-opacity, 1); }

/* Small annotations can be opened without putting lines under the prose. */
.page-home .inline-link.expand-trigger {
  display: inline !important;
  padding: 4px 8px 5px !important;
  margin-inline: 1px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: rgba(255,255,255,.09) !important;
  box-shadow: none !important;
  color: #f5f5f2 !important;
  line-height: inherit !important;
  text-decoration: none !important;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  white-space: nowrap;
  transition: background-color .2s ease;
}
.page-home .inline-link.expand-trigger:hover,
.page-home .inline-link.expand-trigger[aria-expanded="true"] { background: rgba(255,255,255,.16) !important; }
.page-home .inline-link.expand-trigger:focus-visible { outline: 2px solid #fff !important; outline-offset: 3px !important; }
.page-home .inline-link.expand-trigger::before,
.page-home .inline-link.expand-trigger::after { border: 0 !important; box-shadow: none !important; }
.page-home .inline-link .plus {
  position: relative;
  top: -5px;
  display: inline-block;
  width: 11px;
  height: 11px;
  margin-left: 6px;
  font-size: 0;
  vertical-align: -.01em;
}
.page-home .inline-link .plus::before,
.page-home .inline-link .plus::after { content: ""; position: absolute; background: currentColor; border-radius: 1px; }
.page-home .inline-link .plus::before { width: 11px; height: 1.5px; left: 0; top: 4.75px; }
.page-home .inline-link .plus::after { width: 1.5px; height: 11px; left: 4.75px; top: 0; }
.page-home .margin-note { padding-left: 0; border-left: 0; }
.journal-inline-link { display: inline-flex; align-items: baseline; gap: 4px; color: #fff !important; text-decoration: none; white-space: nowrap; }
.journal-inline-link svg { width: 14px; height: 14px; align-self: center; }
.journal-inline-link:hover { opacity: .75; }
.journal-inline-link:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }

/* A botanical image gives the shared-foundation passage a visual counterpart. */
.page-home #thinking.paired-passage {
  display: grid !important;
  width: 100% !important;
  max-width: none !important;
  padding: 0 var(--page-edge) !important;
  box-sizing: border-box !important;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr) !important;
  align-items: center !important;
  column-gap: clamp(70px, 9vw, 145px) !important;
  row-gap: clamp(75px, 9vw, 125px) !important;
}
.page-home #thinking .independence-heading { grid-column: 1 / -1; max-width: 900px; margin: 0; color: #f2f2ee; font: 500 clamp(44px,5.8vw,80px)/1.02 var(--font-einhar,Arial),sans-serif; letter-spacing: -.063em; }
.page-home #thinking .independence-heading span { display: block; margin-top: .16em; }
.page-home #thinking .visual-interlude--branch { grid-column: 1; grid-row: 2; width: 100%; margin: 0; }
.page-home #thinking .visual-interlude--branch .grain-frame { aspect-ratio: 1.16; }
.page-home #thinking .paired-text { grid-column: 2; grid-row: 2; width: 100% !important; max-width: 510px !important; }
.page-home #thinking .paired-text p:first-child { margin-top: 0 !important; }
.page-home .visual-interlude--evidence {
  width: 100%;
  box-sizing: border-box;
  padding-inline: var(--page-edge);
  margin: clamp(85px, 10vw, 145px) 0 0;
}
.page-home .visual-interlude--evidence .grain-frame { aspect-ratio: 1.6; }

.page-home .grain-letter { width: fit-content; max-width: 100%; }
.page-home #approach h2,
.page-home #research-note h2,
.page-home #horizon h2 { font-size: clamp(30px,3.3vw,44px) !important; line-height: 1.1 !important; letter-spacing: -.05em !important; margin-bottom: 29px !important; }
.page-home .grain-letter:hover,
.page-home #thinking .independence-heading span {
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  background-image: var(--einhar-pixel-field, linear-gradient(#f5f4f0, #f5f4f0));
  background-size: var(--einhar-pixel-size);
  background-position: 0 0;
  background-repeat: repeat;
  -webkit-background-clip: text;
  background-clip: text;
  animation: einhar-pixel-shift .68s steps(4,end) infinite;
}
.page-home #thinking .independence-heading span { background-size: var(--einhar-pixel-size); }
.page-home #recent-posts .recent-topline h2 { font-size: clamp(24px,2.7vw,35px) !important; letter-spacing: -.048em !important; }
.page-home .recent-arrow { width: 36px; height: 36px; border-radius: 9px !important; background: rgba(255,255,255,.075) !important; color: #fff; transition: background-color .2s ease; }
.page-home .recent-arrow:hover:not(:disabled) { background: rgba(255,255,255,.16) !important; }
.page-home .recent-arrow:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.page-home .recent-arrow:disabled { opacity: .3; }

@media (max-width: 700px) {
  .page-home { --einhar-section-gap: clamp(125px, 21vw, 165px); }
  .page-home .opening.reading { width: 100% !important; padding-top: 48px !important; }
  .page-home .opening h1 { max-width: 11ch !important; font-size: clamp(46px,11.7vw,65px) !important; line-height: 1.02 !important; padding: 0 15px; }
  .page-home .opening p { font-size: 15px !important; line-height: 1.65 !important; }
  .page-home .opening .visual-interlude--field { width: 100%; margin-top: 96px; }
  .page-home .home-gallery-track {
    display: flex;
    --gallery-height: clamp(205px, 58vw, 275px);
    height: var(--gallery-height);
    gap: 7px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .page-home .home-gallery-track::-webkit-scrollbar { display: none; }
  .page-home .home-work-row + .home-work-row { margin-top: 58px; }
  .page-home .home-work-heading { min-height: 29px; gap: 12px; padding-inline: 0; }
  .page-home .home-work-heading h2 { font-size: 15px; }
  .page-home .home-work-heading span { font-size: 13px; }
  .page-home .home-gallery-item--field { flex-basis: min(calc(var(--gallery-height) * 1.78), 82vw); }
  .page-home .home-art--field-painting { flex-basis: min(calc(var(--gallery-height) * 1.55), 78vw); }
  .page-home .home-art--brand-study { flex-basis: min(calc(var(--gallery-height) * 1.2), 70vw); }
  .page-home .home-art--einhar-pixels { flex-basis: min(calc(var(--gallery-height) * 1.7), 82vw); }
  .page-home .home-art--grainform-folio { flex-basis: min(calc(var(--gallery-height) * 1.53), 78vw); }
  .page-home .home-art--grainform-particles { flex-basis: min(calc(var(--gallery-height) * 1.7), 82vw); }
  .page-home .home-art--grainform-detail { flex-basis: min(calc(var(--gallery-height) * 1.45), 78vw); }
  .page-home .opening-continuation.reading { margin-top: 128px; }
  .page-home .decision-sticky { min-height: 72svh; }
  .page-home #decision-statement { font-size: clamp(40px, 10vw, 60px); max-width: 12ch; }
  .page-home .decision-visual { aspect-ratio: 1.05; margin-top: 34px; }
  html.decision-enabled .page-home .decision-visual { inset: 35svh var(--page-edge) 7svh; display: grid; place-items: center; }
  html.decision-enabled .page-home .decision-image { object-fit: contain; }
  html.decision-enabled .page-home .decision-pixels { width: 100%; height: 100%; }
  html.decision-enabled .page-home #decision-statement { top: 7svh; max-width: 10ch; font-size: clamp(39px, 10vw, 57px); }
  .page-home #thinking.paired-passage { display: block !important; width: 100% !important; }
  .page-home #thinking .independence-heading { font-size: clamp(36px,9.2vw,54px); margin-bottom: 0; }
  .page-home #thinking .independence-heading span { max-width: 14ch; }
  .page-home #thinking .visual-interlude--branch { margin-top: 65px; }
  .page-home #thinking .visual-interlude--branch .grain-frame { aspect-ratio: 1.03; }
  .page-home #thinking .paired-text { margin-top: 56px; }
  .page-home .visual-interlude--evidence { margin: 78px 0 0; padding-inline: var(--page-edge); }
  .page-home .visual-interlude--evidence .grain-frame { aspect-ratio: .98; }
  .page-home #recent-posts .recent-topline h2 { font-size: 23px !important; }
  .page-home .recent-arrow { width: 32px; height: 32px; }
}

@media(prefers-reduced-motion:reduce) {
  .page-home .home-gallery-item img { transition: none !important; }
}
@media (max-width: 360px) {
  .page-home #recent-posts .recent-topline { flex-wrap: wrap; }
  .page-home #recent-posts .recent-topline h2 { width: 100%; }
  .page-home #recent-posts .recent-controls { width: 100%; justify-content: flex-end; }
  .page-home #recent-posts .recent-more { margin-right: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .page-home .opening h1,
  .page-home .opening .visual-interlude--field,
  .page-home .opening > p { animation: none; }
  .page-home .grain-letter:hover,
  .page-home #thinking .independence-heading span { animation: none; }
  .page-home .visual-interlude.grain-ready .grain-frame img,
  .page-home .home-gallery-item.grain-ready .grain-frame img { opacity: 1; transition: none; }
  .page-home .visual-interlude .grain-frame canvas { display: none; }
  .page-home .home-gallery-item:hover img { transform: none; }
  .page-home .recent-arrow { transition: none; }
}