/* Layout: ink and stone bands alternate down one long page; condensed display type carries the voice, brass marks the action. */
:root {
  --ink: #0E0D0B;
  --ink-2: #191714;
  --ink-3: #24211C;
  --stone: #ECE9E2;
  --stone-2: #E1DCD1;
  --brass: #D4A23C;
  --brass-hi: #E8BE5E;
  --brass-deep: #7A5512;
  --gold-metal: linear-gradient(180deg, #EDC566 0%, #D4A23C 55%, #B98526 100%);
  --on-ink: #F3EFE7;
  --on-ink-muted: #ABA498;
  --on-stone: #15130F;
  --on-stone-muted: #57524A;
  --rule-ink: rgba(243, 239, 231, 0.14);
  --rule-stone: rgba(21, 19, 15, 0.16);

  --display: "Archivo", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --body: "Instrument Sans", "Helvetica Neue", Arial, sans-serif;
  --accent-serif: "Instrument Serif", Georgia, "Times New Roman", serif;

  --wrap: 1180px;
  --band-y: clamp(72px, 10vw, 136px);
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; }
body {
  margin: 0;
  background: var(--ink);
  color: var(--on-ink);
  font-family: var(--body);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body::before {
  content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px);
  z-index: 60; background: var(--ink);
}
img { max-width: 100%; display: block; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--brass); outline-offset: 3px; }

.skip {
  position: absolute; left: 12px; top: -60px; z-index: 100;
  background: var(--brass); color: var(--ink); padding: 10px 16px; font-weight: 600; text-decoration: none;
}
.skip:focus { top: 12px; }

.wrap {
  width: 100%; max-width: calc(var(--wrap) + 64px); margin-inline: auto;
  padding-left: max(16px, env(safe-area-inset-left, 0px), 4vw);
  padding-right: max(16px, env(safe-area-inset-right, 0px), 4vw);
}
@media (min-width: 1300px) { .wrap { padding-left: max(32px, env(safe-area-inset-left, 0px)); padding-right: max(32px, env(safe-area-inset-right, 0px)); } }

.band { padding-block: var(--band-y); }
.band--ink { background: var(--ink); color: var(--on-ink); }
.band--ink2 { background: var(--ink-2); color: var(--on-ink); }
.band--stone { background: var(--stone); color: var(--on-stone); }
.band--stone2 { background: var(--stone-2); color: var(--on-stone); }

/* ---------- Type ---------- */
.display {
  font-family: var(--display);
  font-variation-settings: "wdth" 72;
  font-weight: 850;
  text-transform: uppercase;
  line-height: 0.92;
  letter-spacing: -0.01em;
  text-wrap: balance;
  margin: 0;
}
.h-xl { font-size: clamp(2.7rem, 6.4vw, 5.8rem); }
.h-lg { font-size: clamp(2.3rem, 5.6vw, 4.6rem); }
.h-md { font-size: clamp(1.6rem, 3vw, 2.25rem); line-height: 1; }
.eyebrow {
  font-family: var(--display);
  font-variation-settings: "wdth" 100;
  font-weight: 600; font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase;
  margin: 0 0 20px;
}
.eyebrow::before { content: ""; display: inline-block; width: 28px; height: 1px; background: currentColor; margin-right: 12px; vertical-align: 0.3em; }
.band--ink .eyebrow, .band--ink2 .eyebrow, .hero .eyebrow { color: var(--brass); }
.band--stone .eyebrow, .band--stone2 .eyebrow { color: var(--brass-deep); }
.lede { font-size: clamp(1.08rem, 1.6vw, 1.25rem); max-width: 60ch; margin: 22px 0 0; }
.band--ink .lede, .band--ink2 .lede { color: var(--on-ink-muted); }
.band--stone .lede, .band--stone2 .lede { color: var(--on-stone-muted); }
.serif { font-family: var(--accent-serif); font-weight: 400; text-transform: none; letter-spacing: 0; font-style: italic; }
p { margin: 0; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 52px; padding: 14px 26px;
  font-family: var(--display); font-variation-settings: "wdth" 88; font-weight: 750;
  font-size: 0.95rem; letter-spacing: 0.08em; text-transform: uppercase; text-decoration: none;
  border: 1.5px solid transparent; cursor: pointer; transition: background .2s, color .2s, border-color .2s, transform .2s;
}
.btn:hover { transform: translateY(-1px); }
.btn--primary { background: var(--gold-metal); color: var(--ink); box-shadow: inset 0 1px 0 rgba(255,255,255,0.35); }
.btn--primary:hover { background: var(--brass-hi); }
.btn--ghost { background: transparent; color: currentColor; border-color: currentColor; }
.band--ink .btn--ghost:hover, .hero .btn--ghost:hover { border-color: var(--brass); color: var(--brass); }
.band--stone .btn--primary, .band--stone2 .btn--primary { background: var(--on-stone); color: var(--stone); }
.band--stone .btn--primary:hover, .band--stone2 .btn--primary:hover { background: var(--brass-deep); }
.btn .arrow { font-family: var(--body); font-weight: 500; }
.cta-row { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.micro { font-size: 0.85rem; letter-spacing: 0.04em; }

/* ---------- Header ---------- */
.site-header {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50;
  background: rgba(14, 13, 11, 0.92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--rule-ink);
}
.nav { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 84px; }
/* Transparent LRM Consulting mark sits directly on ink; a gold hairline separates it from the name. */
.brand { display: flex; align-items: center; gap: 16px; text-decoration: none; min-width: 0; }
.brand-mark { display: block; flex: none; line-height: 0; }
.brand-mark img { height: 58px; width: auto; }
.brand-rule { width: 1px; height: 36px; background: rgba(212, 162, 60, 0.5); flex: none; }
.foot-mark { display: block; line-height: 0; margin-bottom: 26px; }
.foot-mark img { width: 176px; height: auto; }
@media (max-width: 960px) { .brand-mark img { height: 48px; } .brand { gap: 12px; } .brand-rule { height: 30px; } }
@media (max-width: 520px) { .wordmark b { font-size: 1.18rem; white-space: nowrap; } .wordmark small { display: none; } }
@media (max-width: 420px) { .brand-rule { display: none; } .brand { gap: 10px; } .brand-mark img { height: 44px; } .wordmark b { font-size: 1.05rem; } .menu-toggle { padding: 0 11px; } }
.wordmark { display: flex; flex-direction: column; text-decoration: none; line-height: 1; }
.wordmark b {
  font-family: var(--display); font-variation-settings: "wdth" 75; font-weight: 850;
  font-size: 1.4rem; letter-spacing: 0.02em; text-transform: uppercase;
}
.wordmark b span { color: var(--brass); }
.wordmark small { font-size: 0.66rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--on-ink-muted); margin-top: 5px; }
.nav-links { display: flex; align-items: center; gap: 28px; list-style: none; margin: 0; padding: 0; }
.nav-links a {
  text-decoration: none; font-family: var(--display); font-variation-settings: "wdth" 95;
  font-weight: 600; font-size: 0.82rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--on-ink-muted);
}
.nav-links a:hover { color: var(--on-ink); }
.nav-links .btn { min-height: 42px; padding: 10px 18px; font-size: 0.8rem; color: var(--ink); }
.menu-toggle {
  display: none; background: none; border: 1px solid var(--rule-ink); color: var(--on-ink);
  min-height: 44px; padding: 0 14px; font: 600 0.8rem var(--body); letter-spacing: 0.12em; text-transform: uppercase; cursor: pointer;
}
@media (max-width: 960px) {
  .menu-toggle { display: inline-flex; align-items: center; }
  .nav-links {
    position: absolute; left: 0; right: 0; top: 100%;
    flex-direction: column; align-items: stretch; gap: 0;
    background: var(--ink); border-bottom: 1px solid var(--rule-ink);
    padding: 8px max(16px, env(safe-area-inset-right, 0px)) 20px max(16px, env(safe-area-inset-left, 0px));
  }
  .nav-links[data-open="false"] { display: none; }
  .nav-links li a:not(.btn) { display: block; padding: 14px 4px; border-bottom: 1px solid var(--rule-ink); font-size: 0.95rem; }
  .nav-links li:last-child { padding-top: 16px; }
  .nav-links .btn { width: 100%; min-height: 50px; }
}

/* ---------- Hero ---------- */
.hero { background: var(--ink); color: var(--on-ink); padding-block: clamp(48px, 7vw, 96px) clamp(64px, 9vw, 120px); overflow: hidden; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.85fr); gap: clamp(40px, 6vw, 96px); align-items: center; }
.hero .photo { box-shadow: 18px 18px 0 -1px var(--ink), 18px 18px 0 0 var(--brass); overflow: hidden; }
@media (max-width: 860px) { .hero .photo { box-shadow: 12px 12px 0 -1px var(--ink), 12px 12px 0 0 var(--brass); } }
.hero h1 .accent { color: var(--brass); }
.hero .lede { color: var(--on-ink-muted); }
.hero .cta-row { margin-top: 36px; }
.hero-facts { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 22px; color: var(--on-ink-muted); }
.hero-facts span::before { content: ""; display: inline-block; width: 6px; height: 6px; background: var(--brass); margin-right: 9px; vertical-align: middle; }
@media (max-width: 860px) { .hero-grid { grid-template-columns: 1fr; } .hero .photo { max-width: 440px; } }

@media (prefers-reduced-motion: no-preference) {
  .rise { animation: rise .8s cubic-bezier(.2,.7,.2,1) both; }
  .rise-2 { animation-delay: .12s; } .rise-3 { animation-delay: .24s; } .rise-4 { animation-delay: .36s; }
  @keyframes rise { from { transform: translateY(18px); opacity: .001; } to { transform: none; opacity: 1; } }
}

/* ---------- Photos (replaceable) ---------- */
.photo { position: relative; margin: 0; aspect-ratio: 4 / 5; width: 100%; max-width: 100%; background: var(--ink-3); overflow: hidden; }
.photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.photo .ph {
  position: absolute; inset: 14px; display: flex; flex-direction: column; justify-content: flex-end; gap: 6px;
  padding: 20px; border: 1px dashed rgba(201, 160, 74, 0.55); color: var(--on-ink-muted); font-size: 0.82rem; line-height: 1.45;
}
.photo .ph b { color: var(--brass); font-family: var(--display); font-variation-settings: "wdth" 90; letter-spacing: 0.1em; text-transform: uppercase; font-size: 0.72rem; }
.photo .ph code { font-size: 0.75rem; color: var(--on-ink); }
.photo.is-empty img { display: none; }
/* Approved portraits keep their natural proportions on desktop; phones use a 4:5 head-and-shoulders frame. */
.photo--portrait { aspect-ratio: var(--ar, 4 / 5); }
.photo--portrait img { object-position: var(--pos, 50% 20%); }
@media (max-width: 860px) { .photo--portrait { aspect-ratio: 4 / 5; } }
.photo-tag {
  position: absolute; left: 0; bottom: 0; background: rgba(14, 13, 11, 0.86); color: var(--on-ink);
  border-left: 2px solid var(--brass); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  font-family: var(--display); font-variation-settings: "wdth" 90; font-weight: 600; font-size: 0.7rem; letter-spacing: 0.16em; text-transform: uppercase;
  padding: 11px 16px;
}
.photo-tag span { color: var(--brass); }

/* ---------- Signature line ---------- */
.signature { background: var(--ink-2); color: var(--on-ink); padding-block: clamp(48px, 7vw, 88px); text-align: center; border-block: 1px solid rgba(212, 162, 60, 0.35); }
.signature p { font-family: var(--accent-serif); font-style: italic; font-size: clamp(1.7rem, 4vw, 3.1rem); line-height: 1.15; text-wrap: balance; max-width: 22ch; margin-inline: auto; }
.signature .sig { display: block; margin-top: 18px; font-family: var(--display); font-variation-settings: "wdth" 100; font-weight: 600; font-style: normal; font-size: 0.74rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--brass); }

/* ---------- Problems ---------- */
.problems-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr); gap: 32px; align-items: end; }
@media (max-width: 860px) { .problems-head { grid-template-columns: 1fr; } }
.problem-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin-top: 56px; border-top: 1.5px solid var(--on-stone); }
@media (max-width: 960px) { .problem-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .problem-grid { grid-template-columns: 1fr; } }
.problem { padding: 30px 28px 34px 0; border-bottom: 1px solid var(--rule-stone); display: flex; flex-direction: column; gap: 12px; min-width: 0; }
@media (min-width: 961px) { .problem:not(:nth-child(3n)) { border-right: 1px solid var(--rule-stone); } .problem:not(:nth-child(3n+1)) { padding-left: 28px; } }
@media (min-width: 621px) and (max-width: 960px) { .problem:nth-child(odd) { border-right: 1px solid var(--rule-stone); } .problem:nth-child(even) { padding-left: 28px; } }
.problem h3 { font-family: var(--display); font-variation-settings: "wdth" 80; font-weight: 800; font-size: 1.45rem; line-height: 1.05; text-transform: uppercase; margin: 0; text-wrap: balance; }
.problem p { color: var(--on-stone-muted); font-size: 1rem; }
.problems-foot { margin-top: 48px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 28px; align-items: center; }
.problems-foot p { font-size: 1.15rem; max-width: 62ch; }
.problems-foot p strong { font-weight: 600; }
@media (max-width: 760px) { .problems-foot { grid-template-columns: 1fr; } }

/* ---------- Services ---------- */
.cap-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 56px; }
@media (max-width: 980px) { .cap-grid { grid-template-columns: 1fr; } }
.cap { background: var(--ink-2); border-top: 3px solid var(--brass); padding: 32px 28px 30px; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.cap-label { font-family: var(--display); font-variation-settings: "wdth" 100; font-size: 0.72rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--brass); }
.cap h3 { font-family: var(--display); font-variation-settings: "wdth" 76; font-weight: 850; font-size: clamp(1.6rem, 2.4vw, 2rem); line-height: 1; text-transform: uppercase; margin: 0; }
.cap .why { color: var(--on-ink); font-size: 1.02rem; }
.cap h4 { margin: 8px 0 0; font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--on-ink-muted); font-weight: 600; }
.ticks { list-style: none; padding: 0; margin: 0; display: grid; gap: 9px; }
.ticks li { position: relative; padding-left: 20px; color: var(--on-ink-muted); font-size: 0.97rem; line-height: 1.45; }
.ticks li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 9px; height: 1.5px; background: var(--brass); }
.ticks li b { color: var(--on-ink); font-weight: 600; }
.cap .note { margin-top: auto; padding-top: 16px; border-top: 1px solid var(--rule-ink); font-size: 0.86rem; color: var(--on-ink-muted); }

.central { margin-top: 72px; display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 72px); align-items: start; padding-top: 56px; border-top: 1px solid var(--rule-ink); }
@media (max-width: 860px) { .central { grid-template-columns: 1fr; } }
.central p { color: var(--on-ink-muted); font-size: 1.1rem; max-width: 58ch; }
.central p + p { margin-top: 16px; }
.central .cta-row { margin-top: 28px; }
.central--photo { grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr); align-items: center; }
.central-copy { display: grid; gap: 16px; min-width: 0; }
.central-copy .eyebrow { font-size: 0.78rem; color: var(--brass); margin: 0; }
.central-copy p + p { margin-top: 0; }
.central-copy .cta-row { margin-top: 12px; }
@media (max-width: 860px) { .central--photo { grid-template-columns: 1fr; } .central--photo .photo { max-width: 440px; } }

/* ---------- Process ---------- */
.steps { list-style: none; padding: 0; margin: 56px 0 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; counter-reset: s; }
@media (max-width: 1000px) { .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .steps { grid-template-columns: 1fr; } }
.step { padding: 28px 26px 32px; border-top: 1.5px solid var(--on-stone); display: flex; flex-direction: column; gap: 14px; min-width: 0; position: relative; }
@media (min-width: 601px) { .step + .step { border-left: 1px solid var(--rule-stone); } }
@media (min-width: 601px) and (max-width: 1000px) { .step:nth-child(3) { border-left: 0; } }
.step-num { font-family: var(--display); font-variation-settings: "wdth" 70; font-weight: 900; font-size: 3.4rem; line-height: 0.85; color: var(--brass-deep); }
.step h3 { font-family: var(--display); font-variation-settings: "wdth" 80; font-weight: 850; font-size: 1.7rem; text-transform: uppercase; margin: 0; line-height: 1; }
.step p { color: var(--on-stone-muted); font-size: 0.99rem; }
.step-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; padding-top: 6px; }
.chip {
  display: inline-block; font-size: 0.74rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase;
  padding: 6px 10px; border: 1px solid var(--rule-stone); color: var(--on-stone); background: rgba(255,255,255,0.35);
  font-variant-numeric: tabular-nums;
}
.chip--strong { background: var(--on-stone); color: var(--stone); border-color: var(--on-stone); }
.step.is-first { background: var(--on-stone); color: var(--stone); border-top-color: var(--brass); }
.step.is-first .step-num { color: var(--brass); }
.step.is-first p { color: #C9C3B7; }
.step.is-first .chip { background: transparent; color: var(--stone); border-color: rgba(236,233,226,0.3); }
.step.is-first .chip--strong { background: var(--brass); color: var(--ink); border-color: var(--brass); }
.process-foot { margin-top: 40px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 28px; align-items: center; }
.process-foot p { color: var(--on-stone-muted); max-width: 64ch; }
@media (max-width: 760px) { .process-foot { grid-template-columns: 1fr; } }

/* ---------- Work ---------- */
.work-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 56px; }
@media (max-width: 900px) { .work-grid { grid-template-columns: 1fr; } }
.project { background: var(--ink-2); display: flex; flex-direction: column; min-width: 0; }
.project-media { aspect-ratio: 16 / 7; position: relative; background: var(--ink-3); overflow: hidden; }
.project-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.project-media .ph { position: absolute; inset: 12px; border: 1px dashed rgba(201,160,74,0.45); display: flex; align-items: flex-end; padding: 14px 16px; color: var(--on-ink-muted); font-size: 0.78rem; }
.project-media.is-empty img { display: none; }
.project-body { padding: 26px 26px 28px; display: flex; flex-direction: column; gap: 16px; flex: 1; }
.project-top { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.tag { font-size: 0.7rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; padding: 5px 9px; border: 1px solid var(--rule-ink); color: var(--on-ink-muted); }
.tag--rel { border-color: rgba(201,160,74,0.6); color: var(--brass); }
.tag--phase { background: var(--ink-3); color: var(--on-ink); border-color: transparent; }
.project h3 { font-family: var(--display); font-variation-settings: "wdth" 78; font-weight: 850; font-size: clamp(1.5rem, 2.4vw, 1.95rem); line-height: 1; text-transform: uppercase; margin: 0; }
.project .industry { color: var(--on-ink-muted); font-size: 0.92rem; margin-top: -8px; }
.kv { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 10px 18px; margin: 0; font-size: 0.95rem; }
.kv dt { font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--brass); font-weight: 600; padding-top: 3px; }
.kv dd { margin: 0; color: var(--on-ink); min-width: 0; }
.kv dd .ticks li { font-size: 0.93rem; }
@media (max-width: 520px) { .kv { grid-template-columns: 1fr; gap: 4px; } .kv dd { margin-bottom: 10px; } }
.project details { border-top: 1px solid var(--rule-ink); padding-top: 14px; margin-top: auto; }
.project summary { cursor: pointer; font-size: 0.8rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--on-ink-muted); list-style: none; display: flex; justify-content: space-between; align-items: center; min-height: 32px; }
.project summary::-webkit-details-marker { display: none; }
.project summary::after { content: "+"; font-size: 1.2rem; color: var(--brass); }
.project details[open] summary::after { content: "–"; }
.project details .kv { margin-top: 14px; }
.disclose { font-size: 0.84rem; color: var(--on-ink-muted); border-left: 2px solid var(--brass); padding-left: 12px; }
.review-flag {
  display: none; font-size: 0.72rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
  background: #3A2F17; color: var(--brass-hi); padding: 8px 12px; border: 1px dashed var(--brass);
}
body.preview .review-flag { display: block; }
.todo { color: var(--brass-hi); font-style: italic; }
body:not(.preview) .todo { display: none; }

/* ---------- Testimonials ---------- */
.quotes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 48px; }
@media (max-width: 860px) { .quotes { grid-template-columns: 1fr; } }
.quote { border: 1px solid var(--rule-ink); padding: 28px; display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.quote blockquote { margin: 0; font-family: var(--accent-serif); font-size: 1.45rem; line-height: 1.3; color: var(--on-ink); }
.quote.is-slot blockquote { color: var(--on-ink-muted); font-size: 1.15rem; font-style: italic; }
.quote figcaption { font-size: 0.9rem; color: var(--on-ink-muted); }
.quote figcaption b { color: var(--on-ink); font-weight: 600; display: block; }

/* ---------- About ---------- */
.about-grid { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 88px); align-items: start; }
@media (max-width: 900px) { .about-grid { grid-template-columns: 1fr; } .about-grid .photo { max-width: 420px; } }
.about-grid .photo { background: var(--stone-2); }
.about-grid .photo .ph { border-color: rgba(119, 88, 22, 0.5); color: var(--on-stone-muted); }
.about-grid .photo .ph b { color: var(--brass-deep); }
.about-grid .photo .ph code { color: var(--on-stone); }
.pitch { margin-top: 28px; padding-left: 22px; border-left: 3px solid var(--brass-deep); display: grid; gap: 14px; }
.pitch p { font-size: 1.12rem; color: var(--on-stone); max-width: 60ch; }
.about-body { margin-top: 32px; display: grid; gap: 16px; }
.about-body p { color: var(--on-stone-muted); max-width: 62ch; }
.about-body p strong { color: var(--on-stone); font-weight: 600; }
.seats { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 30px; padding: 0; list-style: none; }
.seats li { font-size: 0.8rem; font-weight: 500; padding: 7px 12px; border: 1px solid var(--rule-stone); color: var(--on-stone); }
.author-note { margin-top: 28px; font-size: 0.92rem; color: var(--on-stone-muted); }
.author-note a { color: var(--brass-deep); font-weight: 600; }

/* ---------- Insights ---------- */
.insight-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 48px; }
@media (max-width: 760px) { .insight-grid { grid-template-columns: 1fr; } }
.insight { color: var(--on-stone); background: var(--stone); border: 1px solid var(--rule-stone); padding: 28px; display: flex; flex-direction: column; gap: 12px; text-decoration: none; transition: border-color .2s, transform .2s; min-width: 0; }
.insight:hover { border-color: var(--on-stone); transform: translateY(-2px); }
.insight .where { font-size: 0.72rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--brass-deep); }
.insight h3 { font-family: var(--display); font-variation-settings: "wdth" 80; font-weight: 850; font-size: 1.6rem; text-transform: uppercase; line-height: 1; margin: 0; }
.insight p { color: var(--on-stone-muted); font-size: 0.98rem; }
.insight .go { margin-top: auto; padding-top: 8px; font-weight: 600; font-size: 0.9rem; }

/* ---------- Booking ---------- */
.book-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 88px); align-items: start; margin-top: 8px; }
@media (max-width: 900px) { .book-grid { grid-template-columns: 1fr; } }
.facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin-top: 40px; border-top: 1px solid var(--rule-ink); }
.fact { padding: 18px 0; border-bottom: 1px solid var(--rule-ink); }
.fact:nth-child(odd) { padding-right: 16px; }
.fact:nth-child(even) { padding-left: 16px; border-left: 1px solid var(--rule-ink); }
.fact b { display: block; font-family: var(--display); font-variation-settings: "wdth" 76; font-weight: 850; font-size: 1.7rem; text-transform: uppercase; line-height: 1; color: var(--on-ink); }
.fact span { font-size: 0.82rem; color: var(--on-ink-muted); letter-spacing: 0.04em; }
.flow { background: var(--ink-2); padding: clamp(24px, 4vw, 40px); border-top: 3px solid var(--brass); }
.flow h3 { margin: 0 0 22px; font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--brass); font-weight: 600; }
.flow ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; counter-reset: f; }
.flow li { counter-increment: f; display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--rule-ink); }
.flow li::before { content: counter(f); font-family: var(--display); font-variation-settings: "wdth" 70; font-weight: 900; font-size: 1.6rem; line-height: 1; color: var(--brass); }
.flow li b { display: block; font-weight: 600; color: var(--on-ink); }
.flow li span { font-size: 0.93rem; color: var(--on-ink-muted); }
.flow .cta-row { margin-top: 26px; }
.flow .btn--primary { width: 100%; }
.alt-link { font-size: 0.92rem; color: var(--on-ink-muted); }
.alt-link a { color: var(--on-ink); font-weight: 600; text-underline-offset: 3px; }
.setup-note { display: none; margin-top: 16px; font-size: 0.85rem; padding: 12px 14px; border: 1px dashed var(--brass); color: var(--brass-hi); background: #2A2416; }
body.needs-links .setup-note { display: block; }
.privacy-note { margin-top: 18px; font-size: 0.82rem; color: var(--on-ink-muted); line-height: 1.55; }
.privacy-note a { color: var(--on-ink); }
.contact-line { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; color: var(--on-ink-muted); font-size: 0.95rem; }
.contact-line .addr { color: var(--on-ink); font-weight: 600; user-select: all; }
.copy-btn { background: none; border: 1px solid var(--rule-ink); color: var(--on-ink-muted); font: 600 0.72rem var(--body); letter-spacing: 0.12em; text-transform: uppercase; padding: 8px 12px; cursor: pointer; min-height: 36px; }
.copy-btn:hover { color: var(--on-ink); border-color: var(--on-ink-muted); }

/* ---------- Footer ---------- */
.site-footer { background: var(--ink-2); color: var(--on-ink-muted); padding-block: 64px 40px; font-size: 0.9rem; border-top: 1px solid var(--rule-ink); }
.foot-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) repeat(2, minmax(0, 0.7fr)); gap: 40px; }
@media (max-width: 800px) { .foot-grid { grid-template-columns: 1fr; } }
.foot-brand .display { font-size: clamp(1.8rem, 3.6vw, 2.6rem); color: var(--on-ink); }
.foot-brand .display span { color: var(--brass); }
.foot-brand p { margin-top: 14px; max-width: 44ch; }
.foot-col h4 { margin: 0 0 14px; font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--on-ink); font-weight: 600; }
.foot-col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.foot-col a { text-decoration: none; }
.foot-col a:hover { color: var(--on-ink); text-decoration: underline; }
.legal { margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--rule-ink); display: grid; gap: 10px; font-size: 0.8rem; line-height: 1.6; }
.legal p { max-width: 110ch; }

/* ---------- Section heads ---------- */
.section-head { max-width: 860px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Service pages ---------- */
.crumbs { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0 0 26px; padding: 0; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--on-ink-muted); }
.crumbs li + li::before { content: "/"; margin-right: 8px; color: var(--brass); }
.crumbs a { text-decoration: none; }
.crumbs a:hover { color: var(--on-ink); }
.svc-hero { background: var(--ink); color: var(--on-ink); padding-block: clamp(48px, 7vw, 96px) clamp(56px, 8vw, 104px); border-bottom: 1px solid rgba(212, 162, 60, 0.3); }
.svc-hero .display { max-width: 18ch; }
.svc-hero .lede { color: var(--on-ink-muted); }
.svc-hero .cta-row { margin-top: 34px; }
.proof { margin-top: 40px; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: start; max-width: 760px; padding: 20px 22px; background: var(--ink-2); border-left: 2px solid var(--brass); }
.proof b { font-family: var(--display); font-variation-settings: "wdth" 90; font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--brass); padding-top: 3px; }
.proof p { color: var(--on-ink); font-size: 0.98rem; }
@media (max-width: 600px) { .proof { grid-template-columns: 1fr; gap: 6px; } }
.deliver-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 48px; }
@media (max-width: 980px) { .deliver-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .deliver-grid { grid-template-columns: 1fr; } }
.deliver { background: var(--ink-2); border-top: 2px solid var(--brass); padding: 26px 24px 28px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.deliver h3 { font-family: var(--display); font-variation-settings: "wdth" 80; font-weight: 800; font-size: 1.3rem; line-height: 1.05; text-transform: uppercase; margin: 0; }
.deliver p { color: var(--on-ink-muted); font-size: 0.97rem; }
.note-line { margin-top: 32px; font-size: 0.92rem; color: var(--on-ink-muted); max-width: 70ch; }
.band--stone .note-line, .band--stone2 .note-line { color: var(--on-stone-muted); }
.who { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; padding: 0; list-style: none; }
.who li { font-size: 0.85rem; padding: 8px 13px; border: 1px solid var(--rule-stone); color: var(--on-stone); background: rgba(255,255,255,0.35); }
.faq { margin-top: 40px; border-top: 1.5px solid var(--on-stone); }
.faq details { border-bottom: 1px solid var(--rule-stone); }
.faq summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 22px 0; font-family: var(--display); font-variation-settings: "wdth" 85; font-weight: 750; font-size: 1.15rem; text-transform: uppercase; line-height: 1.15; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-family: var(--body); font-weight: 400; font-size: 1.6rem; color: var(--brass-deep); flex: none; }
.faq details[open] summary::after { content: "–"; }
.faq details p { padding: 0 0 24px; color: var(--on-stone-muted); max-width: 70ch; }
.related { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 40px; }
@media (max-width: 760px) { .related { grid-template-columns: 1fr; } }
.cap .more { margin-top: 6px; font-weight: 600; font-size: 0.92rem; color: var(--brass); text-decoration: none; }
.cap .more:hover { color: var(--brass-hi); }
.book-mini { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 28px; align-items: center; }
@media (max-width: 760px) { .book-mini { grid-template-columns: 1fr; } }
.book-mini .lede { margin-top: 14px; }
.problem-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 621px) {
  .problem-grid--2 .problem { border-right: 0; padding-left: 0; }
  .problem-grid--2 .problem:nth-child(odd) { border-right: 1px solid var(--rule-stone); padding-right: 28px; }
  .problem-grid--2 .problem:nth-child(even) { padding-left: 28px; }
}
@media (max-width: 620px) { .problem-grid--2 { grid-template-columns: 1fr; } }

/* ---------- v3.1: compact band + Selected Work ---------- */
.band--compact { padding-block: clamp(48px, 6vw, 72px); }
.band--compact .insight-grid { margin-top: 28px; }
.band--compact .insight { padding: 22px 24px; gap: 8px; }
.band--compact .insight h3 { font-size: 1.35rem; }
.sw { padding-block: clamp(56px, 7vw, 88px); }
.sw-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 36px; }
@media (max-width: 980px) { .sw-grid { grid-template-columns: 1fr; } }
.sw-item { border-top: 2px solid var(--brass); background: var(--ink-2); padding: 24px 24px 26px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.sw-item h3 { font-family: var(--display); font-variation-settings: "wdth" 80; font-weight: 800; font-size: 1.3rem; line-height: 1.05; text-transform: uppercase; margin: 0; }
.sw-item p { color: var(--on-ink-muted); font-size: 0.97rem; }
.sw-item .sw-proof { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--rule-ink); color: var(--on-ink); font-size: 0.92rem; }

/* ---------- v3.1: tap targets and minimum label sizes ---------- */
.micro { font-size: 0.8rem; }
.photo-tag { font-size: 0.76rem; }
.cap-label, .tag, .kv dt, .insight .where, .flow h3, .foot-col h4 { font-size: 0.76rem; }
.cap .more, .alt-link a, .author-note a, .insight .go { display: inline-block; padding-block: 10px; }
.foot-col ul { gap: 2px; }
.foot-col a { display: inline-block; padding-block: 8px; }
.nav-links a:not(.btn) { display: inline-block; padding-block: 12px; }
@media (max-width: 960px) { .nav-links li a:not(.btn) { display: block; } }
.chip, .signature .sig, .proof b { font-size: 0.76rem; }
.wordmark small { font-size: 0.75rem; }
.photo:not(.is-empty) .ph { display: none; }
.privacy-note a, .crumbs a { display: inline-block; padding-block: 6px; }
