:root {
  --ink: #30282a;
  --paper: #fbf9f5;
  --signal: #9a786f;
  --line: #ded6cf;
  --muted: #6f6462;
  --recovery: #4b3d3e;
  --sapphire: #eee8e2;
  --amethyst: #e9dfdc;
  --emerald: #e8e4df;
  --garnet: #e5d7d3;
}

body {
  background: var(--paper);
  color: var(--ink);
  font-family: "Avenir Next", Avenir, "Helvetica Neue", Arial, sans-serif;
  font-weight: 400;
}

h1,
h2,
h3,
.quote,
.fact b {
  font-family: Didot, "Bodoni 72", "Bodoni MT", "Times New Roman", serif;
  font-weight: 400;
}

h1,
h2 {
  letter-spacing: -.045em;
}

.site-header {
  background: rgba(251, 249, 245, .94);
  border-bottom-color: rgba(154, 120, 111, .25);
}

.brand {
  align-items: center;
  gap: 14px;
}

.brand b {
  color: #b4a097;
  font-family: Didot, "Bodoni 72", "Bodoni MT", "Times New Roman", serif;
  font-size: 2rem;
  font-weight: 400;
  letter-spacing: -.075em;
}

.brand span {
  color: #403638;
  font-family: "Snell Roundhand", "Segoe Script", "Brush Script MT", cursive;
  font-size: 1.02rem;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
}

.nav-links a,
.button,
.eyebrow,
.ticker,
.service a {
  font-family: "Avenir Next", Avenir, "Helvetica Neue", Arial, sans-serif;
}

.nav-links a {
  letter-spacing: .13em;
}

.eyebrow {
  color: var(--signal);
  letter-spacing: .26em;
}

.hero-copy {
  background: #eee8e2;
}

.hero-image::after {
  background: rgba(251, 249, 245, .92);
  color: var(--ink);
}

.ticker {
  background: #3d3234;
  color: #f8f2ed;
}

.button {
  background: #3d3234;
  border-color: #3d3234;
}

.button.light {
  background: transparent;
  color: #3d3234;
  border-color: #7c6965;
}

.button:hover,
.form-submit {
  background: #9a786f;
  border-color: #9a786f;
}

.service {
  padding: 35px 30px;
}

.service:nth-child(1) {
  background: #eee7e2;
}

.service:nth-child(2) {
  background: #e8e3de;
}

.service:nth-child(3) {
  background: #e5d8d4;
}

.recovery-band,
.recovery-page .page-hero {
  background: #4b3d3e;
}

.recovery-band p,
.recovery-page .page-hero p {
  color: #eee6e1;
}

.recovery-band .button {
  background: #f7f2ed;
  color: #4b3d3e;
  border-color: #f7f2ed;
}

.contact-card {
  background: #3d3234;
}

.contact-card p {
  color: #e1d8d3;
}

.contact-list a {
  border-color: #695a58;
}

.contact-list a:last-child {
  border-bottom-color: #695a58;
}

.page-hero {
  border-bottom: 1px solid #cbbcb5;
}

.recovery-page .page-hero {
  border-bottom: 1px solid #8d7773;
}

.recovery-note,
.clients-section {
  background: #eae4df;
}

.recovery-note {
  border-left-color: #9a786f;
}

.logo-card {
  background: rgba(255, 253, 249, .82);
  border-color: rgba(75, 61, 62, .12);
}

.logo-card.dark {
  background: #4b3d3e;
}

.field input,
.field select,
.field textarea {
  background: #fdfbf8;
  border-color: #8b7975;
}

.field input:focus,
.field select:focus,
.field textarea:focus {
  outline-color: rgba(154, 120, 111, .32);
  border-color: #9a786f;
}

/* Keep Courtney's photography dominant inside the edge-to-edge portfolio mosaics. */
.gallery-mosaic figure {
  background: transparent;
}

.gallery-mosaic img {
  object-fit: cover;
  object-position: center;
}

.gallery-mosaic figure.focus-top img {
  object-position: center 25%;
}

.gallery-mosaic figure.focus-high img {
  object-position: center 15%;
}

.clients-section {
  padding: clamp(75px, 10vw, 130px) 0;
}

.logo-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}

.logo-card {
  min-height: 150px;
  padding: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.logo-card img {
  width: 100%;
  height: 82px;
  object-fit: contain;
}

@media (max-width: 900px) {
  .nav-links {
    background: var(--paper);
  }

  .service + .service {
    padding-left: 30px;
  }

  .logo-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 560px) {
  .logo-grid {
    grid-template-columns: 1fr;
  }
}
