/* ==========================================================================
   Vamora Ventures — pages.css
   Section-level layouts for home and interior pages.
   ========================================================================== */

/* ---------- Home hero ---------- */
.hero {
  position: relative;
  min-height: 100vh;
  min-height: 100svh;
  max-height: 1080px;
  display: flex;
  align-items: flex-end;
  color: var(--ivory);
  background: var(--charcoal);
  overflow: hidden;
  isolation: isolate;
}
@media (max-height: 600px) and (orientation: landscape) { .hero { max-height: none; min-height: 640px; } }
.hero__media { position: absolute; inset: 0; z-index: -2; }
.hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 62% 50%;
}
@media (prefers-reduced-motion: no-preference) {
  .hero__media img { animation: hero-settle 2.6s var(--ease-out) both; }
  @keyframes hero-settle { from { transform: scale(1.04); } }
}
/* Overlay: a soft charcoal field behind the text only — the V structure stays clear */
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(120% 90% at 0% 100%, rgba(15,15,16,0.62) 0%, rgba(15,15,16,0.34) 38%, rgba(15,15,16,0) 62%),
    linear-gradient(90deg, rgba(15,15,16,0.30) 0%, rgba(15,15,16,0) 46%),
    linear-gradient(180deg, rgba(15,15,16,0.22) 0%, rgba(15,15,16,0) 18%);
}
.hero__inner {
  width: 100%;
  padding-top: calc(var(--header-h) + 3rem);
  padding-bottom: clamp(3.5rem, 2rem + 6vh, 7.5rem);
}
.hero__content { max-width: 64rem; }
.hero__label {
  font-family: var(--font-body);
  font-size: 0.71875rem;         /* 11.5px */
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(248, 246, 242, 0.62);
}
.hero__title {
  margin-top: clamp(1.25rem, 0.9rem + 1vw, 1.75rem);
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(2.4rem, 1.15rem + 4.5vw, 5.4rem);
  line-height: 1.06;
  letter-spacing: -0.032em;
  max-width: 11em;
}
.hero__text {
  margin-top: clamp(1.5rem, 1.1rem + 1.2vw, 2.25rem);
  max-width: 30rem;
  font-size: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  line-height: 1.65;
  color: rgba(248, 246, 242, 0.76);
}
.hero__actions {
  margin-top: clamp(2rem, 1.5rem + 1.5vw, 2.75rem);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 2.25rem;
}
/* Hero entrance: transform only (no opacity/blur) so LCP isn't delayed */
@media (prefers-reduced-motion: no-preference) {
  .js .hero-rise { animation: hero-rise 1s var(--ease-out) both; animation-delay: calc(0.1s + var(--d, 0) * 0.1s); }
  @keyframes hero-rise { from { transform: translateY(14px); } }
}
/* Primary hero CTA — flat ivory, square, restrained motion */
.btn-hero {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 46px;
  padding: 0.7rem 1.35rem;
  background: var(--ivory);
  color: var(--charcoal);
  border: 1px solid var(--ivory);
  border-radius: 0;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.03em;
  line-height: 1;
  transition: background-color 0.35s var(--ease), border-color 0.35s var(--ease), transform 0.35s var(--ease);
}
.btn-hero .arrow { transition: transform 0.45s var(--ease-out); }
.btn-hero:hover { background: #FFFFFF; border-color: #FFFFFF; transform: translateY(-1px); }
.btn-hero:hover .arrow { transform: translateX(4px); }
.btn-hero:active { transform: translateY(0); }
.btn-hero:focus-visible { outline: 2px solid var(--ivory); outline-offset: 3px; }
.link-arrow--hero { font-size: 0.8125rem; letter-spacing: 0.03em; color: rgba(248, 246, 242, 0.9); }
.link-arrow--hero:hover { color: var(--ivory); }

/* Portrait screens (phones, portrait tablets): keep the V opening in frame, fade from the bottom */
@media (max-aspect-ratio: 1/1) {
  .hero__media img { object-position: 71% 50%; }
  .hero::before {
    background:
      linear-gradient(0deg, rgba(15,15,16,0.8) 0%, rgba(15,15,16,0.52) 38%, rgba(15,15,16,0.06) 68%, rgba(15,15,16,0.22) 100%);
  }
}
.hero__label, .hero__title > span > span { text-wrap: balance; }
@media (max-width: 760px) {
  .hero__title { font-size: clamp(1.9rem, 0.9rem + 5.6vw, 2.6rem); }
  .hero::before {
    background:
      linear-gradient(0deg, rgba(15,15,16,0.78) 0%, rgba(15,15,16,0.5) 40%, rgba(15,15,16,0.08) 72%, rgba(15,15,16,0.25) 100%);
  }
  .hero__inner { padding-bottom: 2.75rem; }
  .hero__actions { flex-direction: column; align-items: stretch; gap: 0.75rem; }
  .btn-hero { justify-content: center; min-height: 48px; }
  .link-arrow--hero { align-self: flex-start; }
}

/* Venture-name marquee band */
.band { padding-block: 1.6rem; border-bottom: 1px solid var(--line-dark); }

/* ---------- What we build ---------- */
.pillars {
  margin-top: clamp(4rem, 2.5rem + 5vw, 7.5rem);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--line-strong);
  list-style: none;
  padding: 0;
}
.pillar {
  position: relative;
  padding: clamp(1.75rem, 1.2rem + 1.6vw, 2.75rem) clamp(1.25rem, 0.8rem + 1.6vw, 2.5rem) clamp(2.5rem, 1.5rem + 3vw, 4.5rem);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-height: clamp(260px, 18rem + 5vw, 380px);
}
.pillar + .pillar { border-left: 1px solid var(--line); }
.pillar:first-child { padding-left: 0; }
.pillar::before {
  content: "";
  position: absolute;
  top: -1px; left: 0; right: 0;
  height: 1px;
  background: var(--charcoal);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.9s var(--ease-out);
}
.pillar:hover::before { transform: scaleX(1); }
.pillar__num { font-size: var(--fs-micro); letter-spacing: 0.2em; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.pillar__title { margin-top: auto; font-size: clamp(1.05rem, 0.9rem + 0.6vw, 1.35rem); letter-spacing: 0.26em; }
.pillar__text { color: var(--ink-2); max-width: 22em; min-height: 3.3em; }
.pillar__glyph { width: 44px; height: 44px; color: var(--ink); opacity: 0.85; }
@media (max-width: 800px) {
  .pillars { grid-template-columns: 1fr; }
  .pillar { min-height: 0; padding-inline: 0; flex-direction: row; flex-wrap: wrap; gap: 0.75rem 1.5rem; align-items: baseline; }
  .pillar + .pillar { border-left: 0; border-top: 1px solid var(--line); }
  .pillar__glyph { display: none; }
  .pillar__title { margin-top: 0; flex: 1; }
  .pillar__text { flex-basis: 100%; min-height: 0; }
}

/* ---------- Ventures grid ---------- */
.ventures { margin-top: clamp(3.5rem, 2rem + 5vw, 6.5rem); }
.venture-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--line-dark);
  border: 1px solid var(--line-dark);
  list-style: none;
  margin: 0;
  padding: 0;
}
.venture-card {
  --mx: 50%;
  --my: 50%;
  position: relative;
  background: var(--charcoal);
  min-height: clamp(300px, 20rem + 6vw, 460px);
  display: flex;
  flex-direction: column;
  padding: clamp(1.5rem, 1rem + 1.8vw, 2.75rem);
  isolation: isolate;
  overflow: hidden;
}
/* Magic UI "magic card" spotlight — restrained, taupe light following the pointer */
.venture-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: radial-gradient(420px circle at var(--mx) var(--my), rgba(183,175,163,0.10), transparent 60%);
  opacity: 0;
  transition: opacity 0.6s var(--ease);
}
.venture-card:hover::before, .venture-card:focus-within::before { opacity: 1; }
.venture-card__top { display: flex; justify-content: space-between; align-items: center; gap: 1rem; color: var(--paper-3); font-size: var(--fs-micro); letter-spacing: 0.18em; text-transform: uppercase; }
.venture-card__body { margin-top: auto; padding-top: 4rem; }
.venture-card__name {
  font-family: var(--font-display);
  font-size: clamp(1.9rem, 1.3rem + 2.2vw, 3.25rem);
  font-weight: 500;
  letter-spacing: -0.03em;
  line-height: 1.02;
}
.venture-card__desc { margin-top: 1rem; color: var(--paper-2); max-width: 26em; }
.venture-card__foot { margin-top: 2rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 44px; }
.venture-card__link::after { content: ""; position: absolute; inset: 0; }
.venture-card--future { background: #141415; }
.venture-card--future .venture-card__name { color: var(--paper-3); }

/* Embossed Atelier keeps its own identity: it is shown on its own plate,
   in its own typographic voice — never in the Vamora lockup style.
   → Replace .ea-wordmark text with the official Embossed Atelier logo file
     (assets/ventures/embossed-atelier.svg) once supplied. */
.venture-card--ea { background: #EDE7DD; color: #2A2622; }
.venture-card--ea .venture-card__top { color: #6A6158; }
.venture-card--ea .venture-card__desc { color: #4F4841; }
.venture-card--ea::before { background: radial-gradient(420px circle at var(--mx) var(--my), rgba(255,255,255,0.5), transparent 60%); }
.venture-card--ea :focus-visible { outline-color: #2A2622; }
.ea-wordmark {
  font-family: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, "Times New Roman", serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.01em;
  line-height: 1;
}
.ea-wordmark em { font-style: italic; }
.venture-card--ea .venture-card__name { font-size: clamp(2.1rem, 1.4rem + 2.6vw, 3.75rem); letter-spacing: -0.005em; }
.venture-card--ea .ea-plate-note { font-size: var(--fs-micro); letter-spacing: 0.14em; text-transform: uppercase; color: #6A6158; }

@media (max-width: 760px) {
  .venture-grid { grid-template-columns: 1fr; }
  .venture-card { min-height: 280px; }
}

/* ---------- Philosophy: scroll-linked text reveal (Magic UI "text reveal" pattern) ---------- */
.philosophy { position: relative; color: var(--ivory); background: var(--charcoal); }
/* 150vh: half a viewport of pinned travel — enough for the word reveal
   without the page feeling stuck mid-scroll. */
.philosophy__track { height: 150vh; position: relative; }
.philosophy__sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100svh;
  display: flex;
  align-items: center;
  overflow: hidden;
  isolation: isolate;
}
.philosophy__media { position: absolute; inset: 0; z-index: -2; }
.philosophy__media img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 60%; opacity: 0.42; filter: grayscale(0.25) contrast(1.05); }
.philosophy__sticky::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, var(--charcoal) 0%, rgba(15,15,16,0.35) 30%, rgba(15,15,16,0.35) 70%, var(--charcoal) 100%);
}
.philosophy__statement {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(2.4rem, 1rem + 6.3vw, 7.5rem);
  line-height: 1.02;
  letter-spacing: -0.035em;
  max-width: 11em;
}
.philosophy__statement .w { opacity: var(--o, 1); transition: opacity 0.25s linear; }
.js-reveal-ready .philosophy__statement .w { --o: 0.16; }
.philosophy__copy { margin-top: clamp(2rem, 1rem + 3vw, 3.5rem); max-width: 34em; color: var(--paper-2); font-size: var(--fs-lead); line-height: 1.6; }
.philosophy__label { margin-bottom: clamp(2rem, 1rem + 2vw, 3rem); }
@media (prefers-reduced-motion: reduce) {
  .philosophy__track { height: auto; }
  .philosophy__sticky { position: relative; height: auto; padding-block: var(--section); }
  .js-reveal-ready .philosophy__statement .w { --o: 1; }
}

/* ---------- Approach ---------- */
.steps { margin-top: clamp(3.5rem, 2rem + 5vw, 6.5rem); list-style: none; padding: 0; border-top: 1px solid var(--line-strong); counter-reset: step; }
.step {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(1rem, 0.5rem + 1.6vw, 2rem);
  align-items: baseline;
  padding-block: clamp(1.5rem, 1rem + 1.6vw, 2.5rem);
  border-bottom: 1px solid var(--line);
  transition: background-color 0.5s var(--ease);
}
.step__num { grid-column: 1 / span 1; font-size: var(--fs-micro); letter-spacing: 0.2em; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.step__word {
  grid-column: 4 / span 4;
  font-family: var(--font-display);
  font-size: clamp(1.6rem, 1rem + 2.6vw, 3.25rem);
  font-weight: 500;
  letter-spacing: 0.14em;
  line-height: 1;
  transition: transform 0.7s var(--ease-out), color 0.5s var(--ease);
}
.step__text { grid-column: 9 / -1; color: var(--ink-2); }
.step:hover .step__word { transform: translateX(10px); color: var(--sage); }
@media (max-width: 760px) {
  .step { grid-template-columns: auto 1fr; row-gap: 0.6rem; }
  .step__num { grid-column: 1; padding-right: 1.25rem; }
  .step__word { grid-column: 2; }
  .step__text { grid-column: 2; }
}

/* ---------- About (home) ---------- */
.about-split { row-gap: 3rem; align-items: start; }
.about-split__media { grid-column: 1 / span 5; }
.about-split__media .frame { aspect-ratio: 4 / 5; }
.about-split__content { grid-column: 7 / -1; padding-top: clamp(0rem, -2rem + 6vw, 5rem); }
.about-split__content .h2 { margin-top: 1.75rem; }
.about-split__content .lead { margin-top: 2rem; }
.note {
  margin-top: clamp(2.5rem, 1.5rem + 3vw, 4rem);
  padding-top: 1.75rem;
  border-top: 1px solid var(--line-strong);
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1.25rem 2rem;
}
.note__label { font-size: var(--fs-micro); letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink-3); padding-top: 0.3rem; }
.note__body p { color: var(--ink-2); }
.note__body p + p { margin-top: 0.9em; }
.note__sign { margin-top: 1.25rem !important; font-family: var(--font-display); font-weight: 500; color: var(--ink) !important; letter-spacing: 0.02em; }
.note__actions { margin-top: 2rem; }
@media (max-width: 900px) {
  .about-split__media, .about-split__content { grid-column: 1 / -1; }
  .about-split__media .frame { aspect-ratio: 16 / 10; }
}
@media (max-width: 520px) { .note { grid-template-columns: 1fr; } }

/* ---------- About page ---------- */
.principles { margin-top: clamp(3rem, 2rem + 4vw, 5.5rem); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; list-style: none; padding: 0; border-top: 1px solid var(--line-strong); }
.principle { padding: 2rem clamp(1rem, 0.5rem + 1.5vw, 2.25rem) 2.5rem 0; }
.principle + .principle { padding-left: clamp(1rem, 0.5rem + 1.5vw, 2.25rem); border-left: 1px solid var(--line); }
.principle__title { font-family: var(--font-display); font-weight: 500; font-size: var(--fs-h3); letter-spacing: -0.015em; }
.principle__text { margin-top: 0.9rem; color: var(--ink-2); }
@media (max-width: 800px) {
  .principles { grid-template-columns: 1fr; }
  .principle, .principle + .principle { padding: 1.75rem 0 2rem; border-left: 0; }
  .principle + .principle { border-top: 1px solid var(--line); }
}

/* Brand architecture diagram */
.arch { margin-top: clamp(3rem, 2rem + 4vw, 5rem); }
.arch__root {
  display: flex;
  justify-content: center;
  padding-bottom: 2.5rem;
  position: relative;
}
.arch__root .logo__mark { width: 42px; }
.arch__root-box { display: inline-flex; flex-direction: column; align-items: center; gap: 1rem; padding: 1.75rem 2.5rem; border: 1px solid var(--line-dark-strong); }
.arch__root::after { content: ""; position: absolute; bottom: 0; left: 50%; width: 1px; height: 2.5rem; background: var(--line-dark-strong); }
.arch__children {
  list-style: none;
  margin: 0;
  padding: 2.5rem 0 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(0.75rem, 0.5rem + 1vw, 1.5rem);
  position: relative;
}
.arch__children::before { content: ""; position: absolute; top: 0; left: 12.5%; right: 12.5%; height: 1px; background: var(--line-dark-strong); }
.arch__child { position: relative; padding: 1.5rem 1.25rem; border: 1px solid var(--line-dark); text-align: center; min-height: 118px; display: flex; flex-direction: column; justify-content: center; gap: 0.6rem; }
.arch__child::before { content: ""; position: absolute; top: -2.5rem; left: 50%; width: 1px; height: 2.5rem; background: var(--line-dark-strong); }
.arch__child-name { font-family: var(--font-display); font-weight: 500; font-size: 1.05rem; letter-spacing: -0.01em; }
.arch__child-name.ea-wordmark { font-family: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif; font-size: 1.25rem; font-weight: 400; }
.arch__child-meta { font-size: var(--fs-micro); letter-spacing: 0.16em; text-transform: uppercase; color: var(--paper-3); }
.arch__child--future { border-style: dashed; }
@media (max-width: 760px) {
  .arch__children { grid-template-columns: 1fr 1fr; }
  .arch__children::before { left: 25%; right: 25%; }
  .arch__child:nth-child(n+3)::before { display: none; }
}

/* ---------- Ventures page ---------- */
.venture-row {
  padding-block: clamp(3rem, 2rem + 3.5vw, 5rem);
  border-top: 1px solid var(--line-strong);
  row-gap: 2rem;
}
.venture-row__meta { grid-column: 1 / span 3; display: flex; flex-direction: column; gap: 1rem; font-size: var(--fs-micro); letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-3); }
.venture-row__main { grid-column: 4 / span 6; }
.venture-row__name { font-family: var(--font-display); font-weight: 500; font-size: clamp(2.2rem, 1.3rem + 3.4vw, 4.5rem); letter-spacing: -0.035em; line-height: 1; }
.venture-row__line { margin-top: 1.5rem; font-size: var(--fs-lead); color: var(--ink); max-width: 24em; }
.venture-row__text { margin-top: 1.25rem; }
.venture-row__note { margin-top: 1.25rem; font-size: var(--fs-small); max-width: 38em; }
.venture-row--ea .venture-row__name { font-family: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif; font-weight: 400; letter-spacing: 0; }
.ea-plate {
  grid-column: 1 / -1;
  margin-top: 1rem;
  background: #EDE7DD;
  color: #2A2622;
  padding: clamp(2rem, 1.4rem + 2.6vw, 3.25rem) clamp(1.5rem, 1rem + 3vw, 4rem);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 1.5rem;
  transition: background-color 0.35s var(--ease);
}
.ea-plate:hover { background: #E3DBCC; }
.ea-plate:hover .ea-plate__arrow { transform: translateX(4px); }
.ea-plate__brand { display: inline-flex; align-items: center; gap: 0.85rem; }
.ea-plate__icon { width: clamp(46px, 3.4rem + 1vw, 64px); height: auto; flex: none; color: #2A2622; }
.ea-plate__wordmark {
  font-family: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  font-weight: 400;
  letter-spacing: -0.01em;
  font-size: clamp(1.75rem, 1.35rem + 1.7vw, 2.75rem);
  line-height: 1;
}
.ea-plate__dot { color: #B0573B; }
.ea-plate__visit {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-family: var(--font-display);
  font-size: var(--fs-micro);
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #6A6158;
  transition: color 0.35s var(--ease);
}
.ea-plate:hover .ea-plate__visit { color: #2A2622; }
.ea-plate__arrow { width: 22px; height: 16px; flex: none; color: currentColor; transition: transform 0.45s var(--ease-out); }
.placeholder-plate {
  grid-column: 1 / -1;
  margin-top: 1rem;
  border: 1px solid var(--line);
  background:
    repeating-linear-gradient(135deg, transparent 0 14px, rgba(15,15,16,0.035) 14px 15px);
  padding: clamp(2.5rem, 1.5rem + 5vw, 6rem) clamp(1.5rem, 1rem + 3vw, 4rem);
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.placeholder-plate__name { font-family: var(--font-display); font-weight: 500; font-size: clamp(2.5rem, 1.2rem + 6vw, 6.5rem); letter-spacing: -0.04em; line-height: 0.95; color: rgba(15,15,16,0.16); }
@media (max-width: 900px) {
  .venture-row__meta { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; }
  .venture-row__main { grid-column: 1 / -1; }
}

/* ---------- Contact page ---------- */
.contact-layout { row-gap: 4rem; }
.contact-layout__info { grid-column: 1 / span 4; }
.contact-layout__form { grid-column: 6 / -1; }
.contact-detail { padding-block: 1.5rem; border-top: 1px solid var(--line); }
.contact-detail:last-child { border-bottom: 1px solid var(--line); }
.contact-detail__label { font-size: var(--fs-micro); letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink-3); }
.contact-detail__value { margin-top: 0.5rem; font-family: var(--font-display); font-weight: 500; font-size: 1.15rem; overflow-wrap: anywhere; }
.contact-detail__hint { margin-top: 0.5rem; font-size: var(--fs-small); color: var(--ink-3); }
@media (max-width: 900px) {
  .contact-layout__info, .contact-layout__form { grid-column: 1 / -1; }
}

.form { display: grid; gap: 2rem; }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
@media (max-width: 640px) { .form__row { grid-template-columns: 1fr; } }
.field { display: grid; gap: 0.6rem; }
.field__label { font-size: var(--fs-micro); letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-2); font-weight: 500; }
.field__label .opt { text-transform: none; letter-spacing: 0; color: var(--ink-3); font-weight: 400; }
.field__input {
  width: 100%;
  min-height: 52px;
  padding: 0.75rem 0;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--line-strong);
  border-radius: 0;
  font-size: 1.0625rem;
  color: var(--ink);
  transition: border-color 0.3s var(--ease);
  -webkit-appearance: none;
  appearance: none;
}
.field__input::placeholder { color: var(--ink-3); opacity: 0.8; }
.field__input:hover { border-bottom-color: var(--ink-2); }
.field__input:focus-visible { outline: none; border-bottom-color: var(--charcoal); box-shadow: 0 1px 0 0 var(--charcoal); }
textarea.field__input { min-height: 160px; resize: vertical; line-height: 1.6; }
select.field__input {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%230F0F10' stroke-width='1.3'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.25rem center;
  padding-right: 2rem;
}
.field__input:user-invalid { border-bottom-color: #9B2C2C; }
.field__error { font-size: var(--fs-small); color: #9B2C2C; min-height: 0; }
.form__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.25rem 2rem; padding-top: 0.5rem; }
.form__fine { font-size: var(--fs-small); color: var(--ink-3); max-width: 30em; }
.form__status { font-size: var(--fs-small); color: var(--ink-2); padding: 1rem 1.25rem; border-left: 2px solid var(--sage); background: var(--ivory-2); }
.form__status[hidden] { display: none; }

/* ---------- Legal pages ---------- */
.legal { row-gap: 3rem; }
.legal__toc { grid-column: 1 / span 3; }
.legal__toc-inner { position: sticky; top: calc(var(--header-h) + 2rem); }
.legal__toc ol { list-style: none; padding: 0; margin: 1.25rem 0 0; display: grid; gap: 0.2rem; counter-reset: toc; }
.legal__toc a { display: flex; gap: 0.75rem; min-height: 36px; align-items: center; font-size: var(--fs-small); color: var(--ink-2); counter-increment: toc; }
.legal__toc a::before { content: counter(toc, decimal-leading-zero); font-size: var(--fs-micro); color: var(--ink-3); font-variant-numeric: tabular-nums; }
.legal__toc a:hover { color: var(--ink); }
.legal__body { grid-column: 5 / span 7; }
.prose { color: var(--ink-2); max-width: 44em; }
.prose h2 { font-family: var(--font-display); font-weight: 500; font-size: clamp(1.3rem, 1.1rem + 0.7vw, 1.65rem); letter-spacing: -0.015em; color: var(--ink); margin-top: 3.5rem; padding-top: 2rem; border-top: 1px solid var(--line); scroll-margin-top: calc(var(--header-h) + 1.5rem); }
.prose h2:first-child { margin-top: 0; }
.prose h3 { font-size: 1rem; font-weight: 600; color: var(--ink); margin-top: 2rem; }
.prose p, .prose ul { margin-top: 1rem; }
.prose ul { padding-left: 1.2rem; }
.prose li + li { margin-top: 0.45rem; }
.prose li::marker { color: var(--ink-3); }
.prose strong { color: var(--ink); font-weight: 600; }
.placeholder { background: rgba(62, 91, 78, 0.1); color: var(--sage); padding: 0.05em 0.35em; font-weight: 500; white-space: normal; }
.review-banner {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  padding: 1.25rem 1.5rem;
  border: 1px solid rgba(62, 91, 78, 0.35);
  background: rgba(62, 91, 78, 0.06);
  color: var(--ink-2);
  font-size: var(--fs-small);
  margin-bottom: 3rem;
}
.review-banner strong { color: var(--sage); }
@media (max-width: 900px) {
  .legal__toc, .legal__body { grid-column: 1 / -1; }
  .legal__toc-inner { position: static; }
}

/* ---------- 404 ---------- */
.notfound { min-height: 100svh; display: flex; align-items: center; padding-top: var(--header-h); }
.notfound__code { font-family: var(--font-display); font-size: var(--fs-micro); letter-spacing: 0.24em; color: var(--ink-3); }
.notfound .h1 { margin-top: 1.5rem; max-width: 12ch; }
.notfound .lead { margin-top: 1.5rem; }
.notfound__actions { margin-top: 2.75rem; display: flex; flex-wrap: wrap; gap: 1rem 2rem; align-items: center; }

/* Single-venture state (only Embossed Atelier is public for now) */
/* "In development" placeholder card — keeps the grid honest with one live
   venture and turns the growth line into a path to contact. */
/* Diagonal hairline texture (dark-mode twin of .placeholder-plate) — reads clearly
   as a designed "in progress" card instead of near-invisible empty space. */
.venture-card--ghost {
  background:
    repeating-linear-gradient(135deg, transparent 0 14px, rgba(248,246,242,0.05) 14px 15px),
    rgba(248, 246, 242, 0.03);
}
.venture-card--ghost .venture-card__name { font-size: clamp(1.5rem, 1.15rem + 1.3vw, 2.25rem); letter-spacing: -0.02em; }
.venture-card--ghost .venture-card__desc { color: var(--paper-3); }
.arch__children--two { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; max-width: 640px; margin-inline: auto; }
.arch__children--two::before { left: calc((100% - 1.5rem) / 4); right: calc((100% - 1.5rem) / 4); }

/* ---------- Mobile refinements ---------- */
.philosophy__statement { text-wrap: balance; }
@media (max-width: 760px) {
  /* No pin on phones: the sticky 100svh track reads as a stuck, near-black
     screen mid-scroll. Plain full-opacity section instead (JS skips the
     word reveal at this width too). */
  .philosophy__track { height: auto; }
  .philosophy__sticky { position: relative; height: auto; min-height: 100svh; padding-block: var(--section); }
  .philosophy__statement { font-size: clamp(2.1rem, 0.9rem + 7vw, 3.4rem); }
  .venture-card--ea .venture-card__name { font-size: clamp(2.1rem, 1rem + 6vw, 3rem); }
  .arch__child { padding: 1.25rem 0.75rem; min-height: 104px; }
  .arch__child-name.ea-wordmark { font-size: 1.1rem; }
}
/* Legal "On this page": collapsible on small screens */
.legal__toc-summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; min-height: 44px; }
.legal__toc-summary::-webkit-details-marker { display: none; }
.legal__toc-summary::after { content: "+"; font-size: 1.1rem; letter-spacing: 0; line-height: 1; transition: transform 0.3s var(--ease); }
.legal__toc-details[open] .legal__toc-summary::after { transform: rotate(45deg); }
@media (max-width: 900px) {
  .legal__toc-details { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .legal__toc-details ol { margin-top: 0.25rem !important; padding-bottom: 1rem !important; }
}
@media (min-width: 901px) {
  .legal__toc-summary { pointer-events: none; }
  .legal__toc-summary::after { display: none; }
}

/* ---------- About hero (dark, image-led — mirrors the home hero) ---------- */
.about-hero {
  position: relative;
  min-height: 82vh;
  min-height: 82svh;
  max-height: 960px;
  display: flex;
  align-items: flex-end;
  color: var(--ivory);
  background: var(--charcoal);
  overflow: hidden;
  isolation: isolate;
}
.about-hero__media { position: absolute; inset: 0; z-index: -2; }
.about-hero__media picture { height: 100%; }
.about-hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 70% 45%; }
@media (prefers-reduced-motion: no-preference) {
  .about-hero__media img { animation: hero-settle 2.6s var(--ease-out) both; }
}
.about-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(120% 95% at 0% 100%, rgba(15,15,16,0.78) 0%, rgba(15,15,16,0.42) 42%, rgba(15,15,16,0) 68%),
    linear-gradient(180deg, rgba(15,15,16,0.35) 0%, rgba(15,15,16,0) 22%);
}
.about-hero__inner { width: 100%; padding-top: calc(var(--header-h) + 4rem); padding-bottom: clamp(2.5rem, 1.5rem + 4vh, 4.5rem); }
.about-hero__title {
  margin-top: clamp(1.25rem, 0.9rem + 1vw, 1.75rem);
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(2.6rem, 1.2rem + 5vw, 6rem);
  line-height: 1.02;
  letter-spacing: -0.035em;
}
.about-hero__text { margin-top: clamp(1.25rem, 1rem + 1vw, 2rem); max-width: 34rem; color: rgba(248,246,242,0.78); font-size: clamp(1rem, 0.95rem + 0.3vw, 1.15rem); line-height: 1.65; }
.facts-strip {
  margin: clamp(2.5rem, 1.5rem + 3vw, 4rem) 0 0;
  padding-top: 1.25rem;
  border-top: 1px solid var(--line-dark-strong);
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem 2rem;
  max-width: 56rem;
}
.facts-strip dt { font-size: 0.6875rem; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(248,246,242,0.56); }
.facts-strip dd { margin: 0.35rem 0 0; font-family: var(--font-display); font-weight: 500; font-size: 1rem; letter-spacing: 0.01em; }
@media (max-aspect-ratio: 1/1) {
  .about-hero__media img { object-position: 74% 50%; }
  .about-hero::before { background: linear-gradient(0deg, rgba(15,15,16,0.86) 0%, rgba(15,15,16,0.55) 42%, rgba(15,15,16,0.1) 72%, rgba(15,15,16,0.3) 100%); }
}
@media (max-width: 640px) {
  .about-hero { min-height: 92svh; }
  .facts-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1.25rem; }
}

/* Principles — numbered */
.principle__num { display: block; font-size: var(--fs-micro); letter-spacing: 0.2em; color: var(--ink-3); font-variant-numeric: tabular-nums; margin-bottom: 1.5rem; }

/* ---------- Founder — editorial portrait split ---------- */
.founder-a__grid { display: grid; grid-template-columns: 5fr 7fr; gap: clamp(2rem, 1rem + 4vw, 6rem); align-items: center; }
.founder-a__photo { margin: 0; aspect-ratio: 4 / 5; overflow: hidden; background: #1A1A1B; }
.founder-a__photo picture { height: 100%; }
.founder-a__photo img { width: 100%; height: 100%; object-fit: cover; }
.founder-a__name {
  margin-top: clamp(1.25rem, 1rem + 1vw, 1.75rem);
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(2.6rem, 1.4rem + 3.8vw, 4.75rem);
  line-height: 1.02;
  letter-spacing: -0.035em;
}
.founder-a__role { margin-top: 1rem; font-family: var(--font-display); font-size: 0.8125rem; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink-3); }
.founder-a__bio { margin-top: clamp(1.5rem, 1.2rem + 1vw, 2.25rem); color: var(--ink-2); font-size: var(--fs-lead); line-height: 1.6; max-width: 34em; }
.founder-a__quote { margin: clamp(1.75rem, 1.4rem + 1vw, 2.5rem) 0 0; padding-top: 1.5rem; border-top: 1px solid var(--line-strong); max-width: 30em; }
.founder-a__quote p { font-family: var(--font-display); font-size: clamp(1.15rem, 1rem + 0.6vw, 1.5rem); line-height: 1.4; letter-spacing: -0.012em; text-wrap: balance; }
.founder-a__links { margin-top: 1.75rem; display: flex; flex-wrap: wrap; gap: 0.25rem 2rem; }
.founder-a__links .link-arrow { overflow-wrap: anywhere; }
@media (max-width: 860px) {
  .founder-a__grid { grid-template-columns: 1fr; }
  .founder-a__photo { max-width: 340px; }
}

/* ---------- Approach — horizontal flow ---------- */
.flow { margin-top: clamp(3rem, 2rem + 4vw, 5.5rem); list-style: none; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1px solid var(--line-strong); }
.flow__step { position: relative; padding: 1.75rem clamp(0.75rem, 0.4rem + 1vw, 1.5rem) 2rem 0; }
.flow__step + .flow__step { padding-left: clamp(0.75rem, 0.4rem + 1vw, 1.5rem); border-left: 1px solid var(--line); }
.flow__step::before { content: ""; position: absolute; top: -1px; left: 0; right: 0; height: 1px; background: var(--sage); transform: scaleX(0); transform-origin: left; transition: transform 0.8s var(--ease-out); }
.flow__step:hover::before { transform: scaleX(1); }
.flow__num { font-size: var(--fs-micro); letter-spacing: 0.2em; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.flow__word { margin-top: 2.5rem; font-family: var(--font-display); font-weight: 500; font-size: clamp(1.1rem, 0.9rem + 0.8vw, 1.6rem); letter-spacing: 0.16em; text-transform: uppercase; }
.flow__text { margin-top: 0.75rem; color: var(--ink-2); font-size: 0.9375rem; }
@media (max-width: 900px) {
  .flow { grid-template-columns: 1fr; }
  .flow__step, .flow__step + .flow__step { padding: 1.25rem 0 1.5rem; border-left: 0; display: grid; grid-template-columns: 3rem 1fr; column-gap: 1rem; align-items: baseline; }
  .flow__step + .flow__step { border-top: 1px solid var(--line); }
  .flow__word { margin-top: 0; }
  .flow__text { grid-column: 2; margin-top: 0.4rem; }
}

/* ---------- Home: about facts + founder teaser ---------- */
.home-facts { margin: clamp(2rem, 1.5rem + 1.5vw, 2.75rem) 0 0; padding-top: 1.25rem; border-top: 1px solid var(--line-strong); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem 1.5rem; }
.home-facts dt { font-size: 0.6875rem; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-3); }
.home-facts dd { margin: 0.35rem 0 0; font-family: var(--font-display); font-weight: 500; }
.founder-mini {
  margin-top: clamp(1.75rem, 1.4rem + 1vw, 2.5rem);
  display: grid; grid-template-columns: 76px 1fr auto; gap: 1.25rem; align-items: center;
  padding: 1rem 1.25rem 1rem 1rem;
  background: var(--ivory);
  border: 1px solid var(--line);
  transition: border-color 0.35s var(--ease), transform 0.35s var(--ease);
}
.founder-mini:hover { border-color: var(--line-strong); transform: translateY(-1px); }
.founder-mini:hover .arrow { transform: translateX(4px); }
.founder-mini .arrow { transition: transform 0.45s var(--ease-out); color: var(--ink-2); }
.founder-mini__photo { width: 76px; aspect-ratio: 4 / 5; display: grid; place-items: center; background: linear-gradient(160deg, #2B2A28 0%, #161617 70%); color: rgba(248,246,242,0.16); overflow: hidden; }
.founder-mini__photo svg { width: 70%; }
.founder-mini__photo picture { width: 100%; height: 100%; }
.founder-mini__photo img { width: 100%; height: 100%; object-fit: cover; }
.founder-mini__body { display: grid; gap: 0.45rem; }
.founder-mini__quote { font-family: var(--font-display); font-size: 1rem; line-height: 1.4; letter-spacing: -0.01em; color: var(--ink); text-wrap: balance; }
.founder-mini__name { font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.02em; }
.founder-mini__role { font-weight: 400; color: var(--ink-3); }
@media (max-width: 480px) {
  .founder-mini { grid-template-columns: 60px 1fr; }
  .founder-mini__photo { width: 60px; }
  .founder-mini > .arrow { display: none; }
  .home-facts { grid-template-columns: repeat(3, auto); justify-content: space-between; }
}