/* ═══════════════════════════════════════════════════════════════════════
   Edmacro — research editing technologies
   Sharp editorial corners: there is no border-radius in this file, by design.
   Values transcribed from the approved design reference; see README.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Tokens ─────────────────────────────────────────────────────────── */
:root {
  /* Accent ships as proof red. Alternates in site.config.json — change BOTH
     the hex and the rgb triple, the ruled-paper margin rule uses the triple. */
  --em-accent: #A8261D;
  --em-accent-rgb: 168,38,29;

  --em-paper: #F6F3EC;
  --em-card: #FDFBF5;
  --em-tan: #ECE5D6;
  --em-ink: #191613;
  --em-dark: #14110D;
  --em-terminal: #0C0A08;

  --em-serif: 'STIX Two Text', Georgia, 'Times New Roman', serif;
  --em-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --em-gutter: clamp(20px, 5vw, 52px);
  --em-measure: 1180px;
  --em-section: clamp(64px, 9vw, 110px);
  --em-header: clamp(52px, 7vw, 88px);
}

/* ── Base ───────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--em-paper);
  color: var(--em-ink);
  font-family: var(--em-serif);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::selection { background: var(--em-accent); color: var(--em-paper); }

a { color: inherit; text-decoration: none; }
a:hover { color: var(--em-accent); }

input, textarea, button, select { font: inherit; color: inherit; }
input::placeholder, textarea::placeholder { color: rgba(25, 22, 19, .38); }
input:focus:not(:focus-visible), textarea:focus:not(:focus-visible) { outline: none; }

a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, summary:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--em-ink);
  outline-offset: 3px;
}
.em-band--dark :focus-visible,
.em-band--accent :focus-visible,
.em-foot :focus-visible { outline-color: var(--em-paper); }

summary::-webkit-details-marker { display: none; }

/* ── Layout primitives ──────────────────────────────────────────────── */
.em-shell { min-height: 100vh; display: flex; flex-direction: column; }
.em-main { flex: 1; }

.em-container {
  max-width: var(--em-measure);
  margin: 0 auto;
  padding: 0 var(--em-gutter);
}

.em-skip {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100;
  background: var(--em-ink);
  color: var(--em-paper);
  padding: 12px 18px;
  font-family: var(--em-mono);
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.em-skip:focus { left: 0; color: var(--em-paper); }

/* For headings the design renders as a kicker or omits entirely — keeps the
   H1 → H2 → H3 outline intact for screen readers without touching the layout. */
.em-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

/* Ruled-paper ground: horizontal rules every 32px + the red margin rule at 63px.
   --rule sets the margin-rule alpha (hero .16, inner headers .14). */
.em-ruled {
  --rule: .14;
  background-image:
    repeating-linear-gradient(to bottom, transparent 0 31px, rgba(25, 22, 19, .05) 31px 32px),
    linear-gradient(to right,
      transparent 63px,
      rgba(var(--em-accent-rgb), var(--rule)) 63px,
      rgba(var(--em-accent-rgb), var(--rule)) 64px,
      transparent 64px);
  border-bottom: 1px solid var(--em-ink);
}
.em-ruled--hero { --rule: .16; }
/* Newsletter header: horizontal rules only, no red margin rule. */
.em-ruled--lines {
  background-image: repeating-linear-gradient(to bottom, transparent 0 31px, rgba(25, 22, 19, .05) 31px 32px);
}

.em-band--tan { background: var(--em-tan); border-top: 1px solid var(--em-ink); border-bottom: 1px solid var(--em-ink); }
.em-band--tan-top { background: var(--em-tan); border-top: 1px solid var(--em-ink); border-bottom: 0; }
.em-band--dark { background: var(--em-dark); color: var(--em-paper); }
.em-band--dark-b { border-bottom: 1px solid var(--em-ink); }
.em-band--accent { background: var(--em-accent); color: var(--em-paper); border-bottom: 1px solid var(--em-ink); }
.em-rule-b { border-bottom: 1px solid rgba(25, 22, 19, .16); }
.em-rule-t { border-top: 1px solid rgba(25, 22, 19, .16); }

.em-pad { padding-block: var(--em-section); }
.em-pad-s { padding-block: clamp(48px, 6vw, 72px); }
.em-pad-m { padding-block: clamp(40px, 5vw, 64px); }

/* ── Type ───────────────────────────────────────────────────────────── */
.em-kicker {
  margin: 0 0 12px;
  font-family: var(--em-mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--em-accent);
}
.em-kicker--hero { margin-bottom: 22px; font-size: 11.5px; }
.em-kicker--mute { color: rgba(25, 22, 19, .5); }
.em-kicker--onaccent { color: rgba(246, 243, 236, .75); }

.em-h1 {
  margin: 0 0 18px;
  font-size: clamp(40px, 6vw, 68px);
  font-weight: 500;
  letter-spacing: -.022em;
  line-height: 1.02;
}
.em-h2 {
  margin: 0;
  font-size: clamp(32px, 4.4vw, 54px);
  font-weight: 500;
  letter-spacing: -.02em;
  line-height: 1.05;
}
.em-h3 {
  margin: 14px 0 10px;
  font-size: clamp(22px, 2.2vw, 27px);
  font-weight: 600;
  letter-spacing: -.01em;
}
.em-lede {
  margin: 0;
  max-width: 620px;
  font-size: 17px;
  line-height: 1.65;
  color: rgba(25, 22, 19, .66);
}
.em-mono { font-family: var(--em-mono); }
.em-accent { color: var(--em-accent); }
/* The red full stop that closes a heading. */
.em-stop { color: var(--em-accent); }

/* ── Buttons & links ────────────────────────────────────────────────── */
.em-btn {
  display: inline-block;
  cursor: pointer;
  background: var(--em-accent);
  color: var(--em-paper);
  border: 1px solid var(--em-accent);
  padding: 15px 26px;
  font-family: var(--em-mono);
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}
.em-btn:hover { background: var(--em-ink); border-color: var(--em-ink); color: var(--em-paper); }

.em-btn--sm { padding: 12px 20px; font-size: 11px; }
.em-btn--ink { background: var(--em-ink); border-color: var(--em-ink); color: var(--em-paper); }
.em-btn--ink:hover { background: var(--em-paper); border-color: var(--em-paper); color: var(--em-ink); }

.em-btn--ghost {
  display: inline-block;
  cursor: pointer;
  background: none;
  border: 1px solid var(--em-paper);
  color: var(--em-paper);
  padding: 14px 24px;
  font-family: var(--em-mono);
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  transition: background-color .18s ease, color .18s ease;
}
.em-btn--ghost:hover { background: var(--em-paper); color: var(--em-dark); }

/* Mono link with a hard rule under it. */
.em-ulink {
  display: inline-block;
  cursor: pointer;
  font-family: var(--em-mono);
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--em-ink);
  padding: 15px 4px;
}
.em-ulink:hover { border-bottom-color: var(--em-accent); }
.em-ulink--sm { font-size: 11.5px; padding: 0 0 3px; }
.em-inline-link { color: var(--em-accent); border-bottom: 1px solid var(--em-accent); }
.em-inline-link:hover { color: var(--em-ink); border-bottom-color: var(--em-ink); }

/* ── Nav ────────────────────────────────────────────────────────────── */
.em-nav {
  position: sticky;
  top: 0;
  z-index: 60;
  background: rgba(246, 243, 236, .94);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(25, 22, 19, .7);
}
.em-nav__inner {
  max-width: var(--em-measure);
  margin: 0 auto;
  padding: 0 var(--em-gutter);
  height: 62px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.em-wordmark { display: flex; align-items: baseline; gap: 1px; }
.em-wordmark__name { font-size: 23px; font-weight: 600; letter-spacing: -.01em; }
.em-wordmark__caret {
  font-family: var(--em-mono);
  font-weight: 600;
  font-size: 15px;
  color: var(--em-accent);
  transform: translateY(-7px);
  display: inline-block;
}
.em-desk { display: flex; align-items: center; gap: 30px; }
.em-navlink {
  font-family: var(--em-mono);
  font-size: 11.5px;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.em-navcta {
  font-family: var(--em-mono);
  font-size: 11.5px;
  letter-spacing: .14em;
  text-transform: uppercase;
  background: var(--em-accent);
  color: var(--em-paper);
  padding: 10px 18px;
  border: 1px solid var(--em-accent);
  transition: background-color .18s ease, border-color .18s ease;
}
.em-navcta:hover { background: var(--em-ink); border-color: var(--em-ink); color: var(--em-paper); }

.em-mob {
  display: none;
  background: none;
  border: 1px solid var(--em-ink);
  padding: 8px 14px;
  min-height: 44px;
  font-family: var(--em-mono);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  cursor: pointer;
  align-items: center;
}
.em-menu {
  border-top: 1px solid rgba(25, 22, 19, .14);
  background: var(--em-paper);
  padding: 18px var(--em-gutter) 26px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.em-menu[hidden] { display: none; }
.em-menu a {
  font-size: 26px;
  padding: 9px 0;
  min-height: 44px;
  border-bottom: 1px solid rgba(25, 22, 19, .1);
}
.em-menu a:last-child { border-bottom: 0; color: var(--em-accent); }

@media (max-width: 880px) {
  .em-desk { display: none; }
  .em-mob { display: inline-flex; }
  .em-hidem { display: none !important; }
}

/* ── Home: hero ─────────────────────────────────────────────────────── */
.em-hero__grid {
  max-width: var(--em-measure);
  margin: 0 auto;
  padding: clamp(56px, 8vw, 110px) var(--em-gutter) clamp(64px, 9vw, 120px);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr));
  gap: clamp(40px, 6vw, 80px);
  align-items: center;
}
.em-hero__h1 {
  margin: 0;
  font-size: clamp(44px, 6.6vw, 82px);
  line-height: 1.02;
  font-weight: 500;
  letter-spacing: -.022em;
}
.em-hero__lede {
  margin: 30px 0 0;
  max-width: 520px;
  font-size: clamp(16px, 1.6vw, 18.5px);
  line-height: 1.65;
  color: rgba(25, 22, 19, .68);
}
.em-hero__cta { margin-top: 36px; display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }

/* Tracked change in the headline: "good" struck, "meticulous" inserted. */
.em-del-h1 { position: relative; display: inline-block; text-decoration: none; }
.em-del-h1::after {
  content: '';
  position: absolute;
  left: 0;
  top: 52%;
  height: 3px;
  width: 0;
  background: var(--em-accent);
  animation: emStrike .4s ease-out 1.1s forwards;
}
.em-ins-h1 {
  position: relative;
  display: inline-block;
  font-style: italic;
  color: var(--em-accent);
  text-decoration: none;
  opacity: 0;
  animation: emInsert .5s ease-out 1.6s forwards;
}
.em-ins-h1::after {
  content: '^';
  position: absolute;
  left: 50%;
  bottom: -.52em;
  transform: translateX(-50%);
  font-family: var(--em-mono);
  font-style: normal;
  font-size: .4em;
}

/* Manuscript specimen card */
.em-specimen { position: relative; }
.em-specimen__sheet {
  position: absolute;
  inset: 12px -12px -12px 12px;
  background: var(--em-tan);
  border: 1px solid rgba(25, 22, 19, .25);
}
.em-specimen__card {
  position: relative;
  background: var(--em-card);
  border: 1px solid var(--em-ink);
  padding: clamp(22px, 3vw, 34px);
  box-shadow: 0 18px 40px -22px rgba(25, 22, 19, .35);
}
.em-specimen__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid rgba(25, 22, 19, .14);
  padding-bottom: 12px;
  margin-bottom: 18px;
}
.em-specimen__file { font-family: var(--em-mono); font-size: 10.5px; letter-spacing: .12em; color: rgba(25, 22, 19, .55); }
.em-blip { width: 8px; height: 8px; border-radius: 50%; background: var(--em-accent); animation: emBlink 1.6s steps(1) infinite; }
.em-specimen__body { margin: 0; font-size: clamp(15px, 1.5vw, 16.5px); line-height: 1.85; }
.em-specimen__foot {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  border-top: 1px solid rgba(25, 22, 19, .14);
  padding-top: 14px;
  margin-top: 18px;
  gap: 10px;
  flex-wrap: wrap;
}
.em-specimen__log { font-family: var(--em-mono); font-size: 10.5px; color: rgba(25, 22, 19, .55); }

.em-del {
  text-decoration: line-through;
  text-decoration-color: var(--em-accent);
  text-decoration-thickness: 2px;
  opacity: 0;
  animation: emMark .3s ease-out var(--em-delay, 0s) forwards;
}
.em-ins {
  color: var(--em-accent);
  font-style: italic;
  text-decoration: none;
  opacity: 0;
  animation: emInsert .4s ease-out var(--em-delay, 0s) forwards;
}
.em-ellipse {
  display: inline-block;
  border: 1.5px solid var(--em-accent);
  border-radius: 50%;
  padding: 0 7px;
  opacity: 0;
  animation: emMark .35s ease-out var(--em-delay, 0s) forwards;
}
.em-stamp {
  font-family: var(--em-mono);
  font-size: 10px;
  letter-spacing: .14em;
  color: var(--em-accent);
  border: 1.5px solid var(--em-accent);
  padding: 4px 8px;
  transform: rotate(4deg);
  opacity: 0;
  animation: emMark .35s ease-out 3.1s forwards;
}
.em-note {
  position: absolute;
  font-family: var(--em-mono);
  font-size: 10.5px;
  color: var(--em-accent);
  opacity: 0;
  animation: emMark .4s ease-out var(--em-delay, 0s) forwards;
}
.em-note--top { top: -26px; right: 8px; transform: rotate(-2deg); }
.em-note--bottom { bottom: -24px; left: 26px; transform: rotate(-1.5deg); }

/* ── Home: ticker ───────────────────────────────────────────────────── */
.em-ticker {
  background: var(--em-dark);
  color: var(--em-paper);
  border-bottom: 1px solid var(--em-ink);
  overflow: hidden;
  padding: 13px 0;
}
.em-ticker__track { display: flex; width: max-content; animation: emMarquee 34s linear infinite; }
.em-ticker__row {
  display: flex;
  align-items: center;
  gap: 30px;
  padding-right: 30px;
  font-family: var(--em-mono);
  font-size: 11px;
  letter-spacing: .2em;
  text-transform: uppercase;
  white-space: nowrap;
}

/* ── Home: stats & platforms ────────────────────────────────────────── */
.em-stats {
  max-width: var(--em-measure);
  margin: 0 auto;
  padding: clamp(36px, 5vw, 56px) var(--em-gutter);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
  gap: clamp(20px, 3vw, 40px);
}
.em-stat { border-left: 1px solid rgba(25, 22, 19, .35); padding-left: 18px; }
.em-stat__n { font-size: clamp(30px, 3.4vw, 40px); font-weight: 600; letter-spacing: -.02em; color: var(--em-accent); }
.em-stat__l {
  margin-top: 6px;
  font-family: var(--em-mono);
  font-size: 10.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(25, 22, 19, .55);
}
.em-platforms {
  border-top: 1px solid rgba(25, 22, 19, .16);
  padding: 20px 0 clamp(28px, 4vw, 40px);
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.em-platforms__label {
  font-family: var(--em-mono);
  font-size: 10.5px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(25, 22, 19, .5);
  margin-right: 14px;
}
.em-chip {
  font-family: var(--em-mono);
  font-size: 10.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  border: 1px solid rgba(25, 22, 19, .3);
  padding: 6px 12px;
}

/* ── Section heads ──────────────────────────────────────────────────── */
.em-sechead {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 20px;
  flex-wrap: wrap;
  margin-bottom: clamp(36px, 5vw, 56px);
}

/* ── Cards (services preview) ───────────────────────────────────────── */
.em-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr));
  gap: clamp(16px, 2.2vw, 26px);
}
.em-card {
  background: var(--em-card);
  border-top: 2px solid var(--em-ink);
  border-right: 1px solid rgba(25, 22, 19, .3);
  border-bottom: 1px solid rgba(25, 22, 19, .3);
  border-left: 1px solid rgba(25, 22, 19, .3);
  padding: 24px;
}
.em-card--dark { background: var(--em-dark); color: var(--em-paper); border: 0; border-top: 2px solid var(--em-accent); }
.em-card__idx { font-family: var(--em-mono); font-size: 12px; color: var(--em-accent); }
.em-card__body { margin: 0; font-size: 15.5px; line-height: 1.65; color: rgba(25, 22, 19, .66); }
.em-card--dark .em-card__body { color: rgba(246, 243, 236, .65); }

/* ── Home: terminal ─────────────────────────────────────────────────── */
.em-split {
  max-width: var(--em-measure);
  margin: 0 auto;
  padding: var(--em-section) var(--em-gutter);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr));
  gap: clamp(36px, 5vw, 72px);
  align-items: center;
}
.em-split__lede { margin: 0 0 30px; font-size: 16.5px; line-height: 1.7; color: rgba(246, 243, 236, .68); max-width: 480px; }
.em-term {
  background: var(--em-terminal);
  border: 1px solid rgba(246, 243, 236, .18);
  padding: clamp(20px, 2.6vw, 30px);
  font-family: var(--em-mono);
  font-size: clamp(12px, 1.3vw, 13.5px);
  line-height: 2.05;
  overflow-x: auto;
}
.em-term__head {
  color: rgba(246, 243, 236, .45);
  border-bottom: 1px solid rgba(246, 243, 236, .12);
  padding-bottom: 10px;
  margin-bottom: 14px;
}
/* pre-wrap keeps the column padding aligned on desktop and still wraps on a phone. */
.em-term__line { animation: emUp .4s ease-out var(--em-delay, 0s) both; white-space: pre-wrap; }
.em-cursor {
  display: inline-block;
  width: 9px;
  height: 17px;
  background: var(--em-paper);
  vertical-align: text-bottom;
  animation: emBlink 1s steps(1) infinite;
}

/* ── Pull quote ─────────────────────────────────────────────────────── */
.em-quote {
  max-width: 900px;
  margin: 0 auto;
  padding: var(--em-section) var(--em-gutter);
  text-align: center;
}
.em-quote__pilcrow { font-family: var(--em-mono); font-size: 30px; color: var(--em-accent); line-height: 1; }
.em-quote__text {
  margin: 22px 0 0;
  font-size: clamp(23px, 3vw, 34px);
  line-height: 1.4;
  font-style: italic;
  font-weight: 400;
  letter-spacing: -.01em;
}
.em-quote__by {
  margin: 26px 0 0;
  font-family: var(--em-mono);
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(25, 22, 19, .55);
}

/* ── FAQ ────────────────────────────────────────────────────────────── */
.em-faq { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: clamp(24px, 3.4vw, 44px); }
.em-faq__item { border-top: 1px solid rgba(25, 22, 19, .3); padding-top: 18px; }
.em-faq__q { margin: 0 0 8px; font-size: 20px; font-weight: 600; }
.em-faq__a { margin: 0; font-size: 15px; line-height: 1.65; color: rgba(25, 22, 19, .66); }

/* ── Forms ──────────────────────────────────────────────────────────── */
.em-form__row { display: flex; gap: 12px; flex-wrap: wrap; align-items: stretch; }
.em-input {
  flex: 1;
  min-width: 220px;
  background: transparent;
  border: none;
  border-bottom: 1.5px solid var(--em-ink);
  padding: 13px 2px;
  font-size: 17px;
}
.em-input--inv { border-bottom-color: rgba(246, 243, 236, .8); color: var(--em-paper); }
.em-input--inv::placeholder { color: rgba(246, 243, 236, .55); }
/* Invalid: the rule swaps to the opposite ink. */
.em-input.is-err { border-bottom-color: var(--em-accent); }
.em-input--inv.is-err { border-bottom-color: var(--em-ink); }
.em-fine {
  margin: 14px 0 0;
  font-family: var(--em-mono);
  font-size: 10.5px;
  letter-spacing: .08em;
  color: rgba(25, 22, 19, .5);
}
.em-fine--inv { color: rgba(246, 243, 236, .7); }
.em-said { margin: 0; font-size: 19px; line-height: 1.6; }
.em-form-note { margin: 14px 0 0; font-size: 15px; line-height: 1.6; }
[hidden] { display: none !important; }

/* ── Services page ──────────────────────────────────────────────────── */
.em-svc {
  padding: clamp(44px, 6vw, 72px) 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
  gap: clamp(24px, 4vw, 60px);
}
.em-svc + .em-svc { border-top: 1px solid rgba(25, 22, 19, .16); }
.em-svc__idx { font-family: var(--em-mono); font-size: 13px; color: var(--em-accent); }
.em-svc__h2 {
  margin: 14px 0 10px;
  font-size: clamp(28px, 3.2vw, 38px);
  font-weight: 600;
  letter-spacing: -.015em;
  line-height: 1.1;
}
.em-svc__meta {
  margin: 0;
  font-family: var(--em-mono);
  font-size: 11.5px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(25, 22, 19, .5);
}
.em-svc__body { margin: 0 0 22px; font-size: 16px; line-height: 1.7; color: rgba(25, 22, 19, .72); }
/* Deliberately serif, not mono. */
.em-checks {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
  gap: 11px 28px;
  font-size: 15.5px;
  line-height: 1.6;
  color: rgba(25, 22, 19, .75);
}
.em-dash { color: var(--em-accent); }

.em-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); gap: clamp(20px, 3vw, 36px); }
.em-step { border-left: 1px solid rgba(25, 22, 19, .3); padding-left: 18px; }
.em-step__n { font-family: var(--em-mono); font-size: 11px; color: var(--em-accent); text-transform: uppercase; }
.em-step__h { margin: 10px 0 8px; font-size: 20px; font-weight: 600; }
.em-step__b { margin: 0; font-size: 14.5px; line-height: 1.6; color: rgba(25, 22, 19, .62); }

.em-ethics { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: clamp(20px, 3vw, 40px); }
.em-ethics h3 { margin: 0 0 8px; font-size: 19px; font-weight: 600; }
.em-ethics p { margin: 0; font-size: 14.5px; line-height: 1.65; color: rgba(246, 243, 236, .62); }

.em-ctarow {
  max-width: var(--em-measure);
  margin: 0 auto;
  padding: clamp(52px, 7vw, 80px) var(--em-gutter);
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: center;
  justify-content: space-between;
}
.em-ctarow h2 { margin: 0; font-size: clamp(26px, 3.4vw, 40px); font-weight: 500; letter-spacing: -.02em; }

/* ── Macros page ────────────────────────────────────────────────────── */
.em-tools {
  max-width: var(--em-measure);
  margin: 0 auto;
  padding: clamp(40px, 5vw, 64px) var(--em-gutter);
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 272px), 1fr));
  gap: clamp(16px, 2vw, 24px);
}
.em-tool {
  background: var(--em-card);
  border: 1px solid rgba(25, 22, 19, .35);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: border-color .18s ease;
}
.em-tool:hover { border-color: var(--em-accent); }
.em-tool__top { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.em-tool__name { font-family: var(--em-mono); font-weight: 600; font-size: 15px; }
.em-tool__ver { font-family: var(--em-mono); font-size: 10px; color: var(--em-accent); border: 1px solid var(--em-accent); padding: 2px 6px; }
.em-tool__body { margin: 0; font-size: 14.5px; line-height: 1.6; color: rgba(25, 22, 19, .66); flex: 1; }
.em-tool__foot { font-family: var(--em-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: rgba(25, 22, 19, .5); }

.em-license {
  max-width: var(--em-measure);
  margin: 0 auto;
  padding: clamp(48px, 6vw, 72px) var(--em-gutter);
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  align-items: center;
  justify-content: space-between;
}
.em-license h2 { margin: 0 0 10px; font-size: clamp(24px, 3vw, 34px); font-weight: 500; letter-spacing: -.015em; }
.em-license p { margin: 0; font-size: 15.5px; line-height: 1.65; color: rgba(246, 243, 236, .65); }

/* ── Resources ──────────────────────────────────────────────────────── */
.em-row {
  display: grid;
  grid-template-columns: minmax(120px, 180px) 1fr auto;
  gap: clamp(14px, 3vw, 40px);
  align-items: baseline;
  padding: 26px 0;
  border-bottom: 1px solid rgba(25, 22, 19, .16);
}
a.em-row:hover, a.em-row:hover * { color: var(--em-accent); }
.em-row__meta { font-family: var(--em-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(25, 22, 19, .5); }
.em-row__title { font-size: clamp(20px, 2.4vw, 27px); font-weight: 500; letter-spacing: -.01em; }
.em-row__time { font-family: var(--em-mono); font-size: 11px; color: rgba(25, 22, 19, .5); }
@media (max-width: 620px) {
  .em-row { grid-template-columns: 1fr; gap: 8px; }
}

/* ── Newsletter page ────────────────────────────────────────────────── */
.em-bigh1 {
  margin: 0 0 18px;
  font-size: clamp(48px, 8vw, 96px);
  font-weight: 500;
  letter-spacing: -.025em;
  line-height: .98;
}
.em-issue {
  background: var(--em-card);
  border: 1px solid var(--em-ink);
  padding: clamp(24px, 3vw, 36px);
  box-shadow: 8px 8px 0 var(--em-tan);
}
.em-issue__head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-family: var(--em-mono);
  font-size: 10.5px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(25, 22, 19, .5);
  border-bottom: 1px solid rgba(25, 22, 19, .14);
  padding-bottom: 12px;
  margin-bottom: 18px;
}
.em-issue__h2 { margin: 0 0 12px; font-size: clamp(24px, 2.6vw, 32px); font-weight: 600; letter-spacing: -.015em; line-height: 1.15; }
.em-issue__body { margin: 0 0 18px; font-size: 15.5px; line-height: 1.7; color: rgba(25, 22, 19, .68); }
.em-issue__foot { font-family: var(--em-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--em-accent); }
.em-arch {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: baseline;
  padding: 16px 0;
  border-bottom: 1px solid rgba(25, 22, 19, .16);
}
.em-arch:last-child { border-bottom: 0; }
.em-arch__t { font-size: 18px; font-weight: 500; }
.em-arch__d { font-family: var(--em-mono); font-size: 11px; color: rgba(25, 22, 19, .5); white-space: nowrap; }
.em-topics { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr)); gap: clamp(14px, 2vw, 22px); }
.em-topic {
  border: 1px solid rgba(25, 22, 19, .35);
  background: var(--em-card);
  padding: 22px;
  transition: border-color .18s ease;
}
.em-topic:hover { border-color: var(--em-accent); }
.em-topic__idx { font-family: var(--em-mono); font-size: 11px; color: var(--em-accent); margin-bottom: 10px; }
.em-topic h3 { margin: 0 0 8px; font-size: 19px; font-weight: 600; }
.em-topic p { margin: 0; font-size: 14px; line-height: 1.6; color: rgba(25, 22, 19, .62); }

/* ── Careers ────────────────────────────────────────────────────────── */
.em-job { border-bottom: 1px solid rgba(25, 22, 19, .16); }
.em-job__sum {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: space-between;
  align-items: baseline;
  padding: 22px 0;
  cursor: pointer;
  list-style: none;
}
.em-job__sum:hover, .em-job__sum:hover * { color: var(--em-accent); }
.em-job__h2 { margin: 0 0 6px; font-size: clamp(22px, 2.6vw, 29px); font-weight: 600; letter-spacing: -.01em; }
.em-job__meta { margin: 0; font-family: var(--em-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(25, 22, 19, .5); }
.em-job__toggle { font-family: var(--em-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--em-accent); }
.em-job[open] .em-more { display: none; }
.em-job:not([open]) .em-less { display: none; }
.em-job__body { padding: 2px 0 34px; max-width: 960px; }
.em-job__blurb { margin: 0 0 22px; font-size: 16px; line-height: 1.7; color: rgba(25, 22, 19, .72); }
.em-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: clamp(20px, 3vw, 44px); }
.em-collabel {
  margin: 0 0 10px;
  font-family: var(--em-mono);
  font-size: 10.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--em-accent);
}
.em-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 9px;
  font-size: 15.5px;
  line-height: 1.6;
  color: rgba(25, 22, 19, .75);
}
.em-apply { margin-top: 26px; display: flex; flex-wrap: wrap; gap: 18px; align-items: center; }
.em-perks { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: clamp(20px, 3vw, 36px); }
.em-perks h3 { margin: 0 0 8px; font-size: 19px; font-weight: 600; }
.em-perks p { margin: 0; font-size: 14.5px; line-height: 1.6; color: rgba(25, 22, 19, .62); }

/* ── About ──────────────────────────────────────────────────────────── */
.em-about { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: clamp(28px, 4vw, 64px); }
.em-story { font-size: 17px; line-height: 1.75; color: rgba(25, 22, 19, .78); }
.em-story p { margin: 0 0 18px; }
.em-story p:last-child { margin: 0; }
.em-principle { border-top: 2px solid var(--em-ink); padding: 18px 0; }
.em-principle h3 { margin: 0 0 6px; font-size: 20px; font-weight: 600; }
.em-principle p { margin: 0; font-size: 14.5px; line-height: 1.6; color: rgba(25, 22, 19, .62); }
.em-team { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: clamp(20px, 3vw, 36px); }
.em-mono-sq {
  width: 72px;
  height: 72px;
  background: var(--em-dark);
  color: var(--em-paper);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  font-weight: 600;
  font-style: italic;
}
.em-mono-sq--accent { background: var(--em-accent); }
.em-team h3 { margin: 14px 0 2px; font-size: 18px; font-weight: 600; }
.em-team p { margin: 0; font-family: var(--em-mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: rgba(25, 22, 19, .5); }

/* ── Contact ────────────────────────────────────────────────────────── */
.em-contact {
  max-width: var(--em-measure);
  margin: 0 auto;
  padding: var(--em-header) var(--em-gutter);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
  gap: clamp(32px, 5vw, 72px);
  align-items: start;
}
.em-contact__h1 { margin: 0 0 18px; font-size: clamp(38px, 5vw, 60px); font-weight: 500; letter-spacing: -.022em; line-height: 1.04; }
.em-contact__lede { margin: 0 0 28px; font-size: 16.5px; line-height: 1.65; color: rgba(25, 22, 19, .66); }
.em-bigmail {
  font-size: clamp(20px, 2.4vw, 26px);
  font-weight: 500;
  color: var(--em-accent);
  border-bottom: 1.5px solid var(--em-accent);
  display: inline-block;
}
.em-bigmail:hover { color: var(--em-ink); border-bottom-color: var(--em-ink); }
.em-facts {
  margin-top: 36px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-family: var(--em-mono);
  font-size: 12px;
  line-height: 1.6;
  color: rgba(25, 22, 19, .6);
}
.em-formcard {
  background: var(--em-card);
  border: 1px solid var(--em-ink);
  padding: clamp(24px, 3vw, 36px);
  box-shadow: 10px 10px 0 var(--em-tan);
}
.em-formcard__stack { display: flex; flex-direction: column; gap: 22px; }
.em-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.em-chip-btn {
  cursor: pointer;
  border: 1px solid var(--em-ink);
  background: transparent;
  color: var(--em-ink);
  padding: 8px 14px;
  font-family: var(--em-mono);
  font-size: 10.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  transition: background-color .15s ease, color .15s ease;
}
.em-chip-btn[aria-pressed='true'] { background: var(--em-ink); color: var(--em-paper); }
.em-label {
  display: block;
  font-family: var(--em-mono);
  font-size: 10.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(25, 22, 19, .5);
  margin-bottom: 4px;
}
.em-field {
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 1.5px solid var(--em-ink);
  padding: 10px 2px;
  font-size: 16.5px;
}
.em-field.is-err { border-bottom-color: var(--em-accent); }
textarea.em-field { resize: vertical; line-height: 1.6; }
.em-done { padding: 20px 0; }
.em-done__caret { font-family: var(--em-mono); font-size: 26px; color: var(--em-accent); }
.em-done h2 { margin: 12px 0 10px; font-size: 26px; font-weight: 600; letter-spacing: -.01em; }
.em-done p { margin: 0; font-size: 16px; line-height: 1.7; color: rgba(25, 22, 19, .68); }

/* ── Footer ─────────────────────────────────────────────────────────── */
.em-foot { background: var(--em-dark); color: var(--em-paper); margin-top: auto; }
.em-foot__inner { max-width: var(--em-measure); margin: 0 auto; padding: clamp(48px, 6vw, 80px) var(--em-gutter) 28px; }
.em-foot__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  gap: clamp(28px, 4vw, 56px);
  padding-bottom: clamp(32px, 4vw, 52px);
  border-bottom: 1px solid rgba(246, 243, 236, .16);
}
.em-foot__wordmark { font-size: 30px; font-weight: 600; letter-spacing: -.01em; }
.em-foot__caret { font-family: var(--em-mono); font-weight: 600; font-size: 19px; color: var(--em-accent); transform: translateY(-9px); display: inline-block; }
.em-foot__tag {
  margin: 12px 0 0;
  font-family: var(--em-mono);
  font-size: 11px;
  line-height: 1.7;
  letter-spacing: .06em;
  color: rgba(246, 243, 236, .5);
  max-width: 240px;
}
.em-foot__coltitle {
  margin: 0 0 14px;
  font-family: var(--em-mono);
  font-size: 10.5px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(246, 243, 236, .45);
}
.em-foot__links { display: flex; flex-direction: column; gap: 10px; font-size: 15.5px; }
.em-foot__bottom {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 28px;
  justify-content: space-between;
  padding-top: 22px;
  font-family: var(--em-mono);
  font-size: 10.5px;
  letter-spacing: .1em;
  color: rgba(246, 243, 236, .4);
}

/* ── Essays ─────────────────────────────────────────────────────────── */
.em-byline {
  margin: 22px 0 0;
  font-family: var(--em-mono);
  font-size: 11.5px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(25, 22, 19, .5);
}

/* Long-form prose. Measure is deliberately narrow — 66-ish characters is the
   readable width, and the rest of the site's 1180px container is far too wide. */
.em-prose {
  max-width: 680px;
  font-size: 17.5px;
  line-height: 1.75;
  color: rgba(25, 22, 19, .82);
}
.em-prose > p { margin: 0 0 22px; }
.em-prose > p:first-child { margin-top: 0; }
.em-prose strong { font-weight: 600; color: var(--em-ink); }
.em-prose em { font-style: italic; }
.em-prose a { color: var(--em-accent); border-bottom: 1px solid rgba(var(--em-accent-rgb), .4); }
.em-prose a:hover { border-bottom-color: var(--em-accent); }

.em-prose h2 {
  margin: clamp(38px, 5vw, 52px) 0 16px;
  padding-top: 20px;
  border-top: 2px solid var(--em-ink);
  font-size: clamp(24px, 2.8vw, 31px);
  font-weight: 600;
  letter-spacing: -.015em;
  line-height: 1.15;
  color: var(--em-ink);
}
.em-prose h3 {
  margin: 32px 0 10px;
  font-size: 20px;
  font-weight: 600;
  color: var(--em-ink);
}

.em-prose ul { margin: 0 0 22px; padding: 0; list-style: none; }
.em-prose ul li { position: relative; padding-left: 24px; margin-bottom: 11px; }
.em-prose ul li::before {
  content: '—';
  position: absolute;
  left: 0;
  color: var(--em-accent);
}
.em-prose code {
  font-family: var(--em-mono);
  font-size: .86em;
  background: var(--em-tan);
  padding: 2px 6px;
  color: var(--em-ink);
}

/* Rule-of-thumb aside: a card lifted off the page, same anatomy as a service card. */
.em-callout {
  background: var(--em-card);
  border-top: 2px solid var(--em-accent);
  border-right: 1px solid rgba(25, 22, 19, .3);
  border-bottom: 1px solid rgba(25, 22, 19, .3);
  border-left: 1px solid rgba(25, 22, 19, .3);
  padding: 22px 24px;
  margin: 32px 0;
}
.em-callout__label {
  margin: 0 0 8px;
  font-family: var(--em-mono);
  font-size: 10.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--em-accent);
}
.em-callout p:last-child { margin: 0; font-size: 16.5px; line-height: 1.7; }

.em-postfoot {
  margin-top: clamp(44px, 6vw, 64px);
  padding-top: clamp(28px, 4vw, 36px);
  border-top: 1px solid rgba(25, 22, 19, .3);
}

/* ── 404 ────────────────────────────────────────────────────────────── */
.em-404 { max-width: 720px; margin: 0 auto; padding: clamp(72px, 12vw, 140px) var(--em-gutter); }

/* ── Entrance animations ────────────────────────────────────────────── */
.em-up { animation: emUp .6s ease-out var(--em-delay, 0s) both; }
.em-up--fast { animation: emUp .5s ease-out var(--em-delay, 0s) both; }
.em-up--slow { animation: emUp .7s ease-out var(--em-delay, 0s) both; }

@keyframes emUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes emStrike { to { width: 100%; } }
@keyframes emInsert { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }
@keyframes emMark { from { opacity: 0; transform: scale(.86); } to { opacity: 1; transform: none; } }
@keyframes emMarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes emBlink { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }

/* Reduced motion: collapse rather than cancel, so `forwards` still lands the
   final state — cancelling outright would strand opacity:0 elements invisible. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-delay: 0s !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  .em-blip, .em-cursor { animation: none !important; opacity: 1 !important; }
  .em-ticker__track { animation: none !important; }
  .em-del-h1::after { width: 100% !important; }
}
