/* Vickers Counsel palette (Brand Identity System 2026): five colors only. */
:root {
  --navy: #0D1B2A;
  --ivory: #F5F1EA;
  --charcoal: #1A1A1A;
  --gold: #B89A5B;
  --saddle: #7A5A3A;
  --serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --sans: Avenir, "Avenir Next", "Nunito Sans", "Segoe UI", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--ivory);
  color: var(--charcoal);
  font-family: var(--sans);
  font-size: 1.125rem;
  line-height: 1.7;
  border-top: 6px solid var(--gold);
  border-bottom: 6px solid var(--gold);
}

/* Navy hero, after the brand guide cover. */
.hero {
  background: var(--navy);
  color: #fff;
  padding: clamp(4rem, 12vh, 8rem) 1rem clamp(3.5rem, 10vh, 6.5rem);
  text-align: center;
}
.hero-inner { max-width: 40rem; margin: 0 auto; }

.mark {
  width: 96px;
  height: 96px;
  margin: 0 auto 2.25rem;
  border-radius: 10px;
  background: var(--gold);
  color: var(--navy);
  font-family: var(--serif);
  font-weight: 700;
  font-size: 4.25rem;
  line-height: 96px;
}

.firm {
  margin: 0 0 1rem;
  color: var(--gold);
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
}
h1 {
  margin: 0;
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(2.75rem, 8vw, 4.75rem);
  line-height: 1.05;
}
.sub {
  margin: 1rem 0 0;
  font-family: var(--serif);
  font-size: clamp(1.35rem, 3.5vw, 1.75rem);
  font-style: italic;
  color: var(--ivory);
}
.rule {
  width: min(28rem, 80%);
  margin: 2.25rem auto 1rem;
  border: 0;
  border-top: 1px solid var(--gold);
}
.place {
  margin: 0;
  font-size: 0.78rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.62);
}

/* Ivory body. */
.body { flex: 1; padding: clamp(3rem, 8vh, 5rem) 1rem; }
.body-inner { max-width: 38rem; margin: 0 auto; text-align: center; }
.body-inner > p { margin: 0 0 1.25rem; }

.contact {
  margin-top: 2.75rem;
  padding-top: 2.25rem;
  border-top: 1px solid var(--gold);
}
.contact h2 {
  margin: 0 0 1rem;
  font-family: var(--serif);
  font-weight: 500;
  font-size: 1.9rem;
  color: var(--navy);
}
.contact a {
  display: block;
  color: var(--navy);
  text-decoration: none;
}
.contact .phone {
  font-variant-numeric: lining-nums;
  font-family: var(--serif);
  font-weight: 700;
  font-size: 2rem;
  letter-spacing: 0.02em;
}
.contact .email {
  margin-top: 0.25rem;
  color: var(--saddle);
  overflow-wrap: anywhere;
}
.contact a:hover, .contact a:focus-visible { text-decoration: underline; text-decoration-color: var(--gold); text-underline-offset: 4px; }
a:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }

.foot {
  background: var(--navy);
  color: rgba(255, 255, 255, 0.62);
  text-align: center;
  font-size: 0.8rem;
  letter-spacing: 0.08em;
  padding: 1.25rem 1rem;
}
.foot p { margin: 0; }