/* Shared tokens and foundations */
:root {
  --forest:#14251b;
  --pine:#20382b;
  --olive:#626b48;
  --bone:#f2ebdd;
  --sand:#c7ab7c;
  --charcoal:#252a26;
  --paper:#faf8f2;
  --muted:#5c635a;
  --line:#d9d4c6;
  --container:1600px;
  --site-max-width:1400px;
  --site-inset:1.25rem;
  --gutter:clamp(1.25rem,4vw,4rem);
  --font-display:Rockwell,'Roboto Slab',Georgia,serif;
  --font-label:Bahnschrift,'Arial Narrow',Arial,sans-serif
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:7rem
}

body {
  margin:0;
  background:var(--paper);
  color:var(--forest);
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.65
}

img {
  display:block;
  width:100%;
  height:auto
}

a {
  color:inherit;
  text-underline-offset:.25em
}

button {
  font:inherit
}

a,button {
  -webkit-tap-highlight-color:transparent
}

a:focus-visible,button:focus-visible {
  outline:3px solid #a86b16;
  outline-offset:5px
}

h1,h2,h3,p {
  margin-top:0
}

h1,h2,h3 {
  line-height:1.08
}

h2 {
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(2.25rem,4vw,3.7rem);
  font-weight:400;
  letter-spacing:-.035em;
  margin-bottom:1.4rem
}

h3 {
  font-family:Georgia,'Times New Roman',serif;
  font-size:1.65rem;
  font-weight:400
}

p {
  margin-bottom:1.25rem
}

.container {
  width:min(100% - var(--gutter)*2,var(--container));
  margin-inline:auto
}


.eyebrow {
  font-size:.7rem;
  font-weight:700;
  letter-spacing:.22em;
  text-transform:uppercase;
  margin-bottom:1.2rem
}

.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:1.5rem;
  min-height:44px;
  padding:.65rem 1.1rem;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.73rem;
  font-weight:700;
  border:1px solid transparent;
  transition:background .2s,transform .2s
}

.button-sand {
  background:var(--sand);
  color:var(--forest);
  border-color:#d8c19a
}

.button:hover {
  background:var(--bone);
  transform:translateY(-2px)
}

.text-link {
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  font-size:.8rem;
  font-weight:700;
  text-decoration:none;
  border-bottom:1px solid var(--sand);
  padding-block:.4rem
}

.text-link:hover {
  border-color:currentColor
}

.skip-link {
  position:fixed;
  left:1rem;
  top:-6rem;
  z-index:10;
  background:var(--bone);
  padding:.8rem
}

.skip-link:focus {
  top:1rem
}

/* Header and progressively enhanced navigation */
.site-header {
  background:var(--forest);
  color:var(--bone);
  border-bottom:1px solid #ffffff25;
  position:relative;
  z-index:3
}

.header-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:1.3rem;
  padding-block:.85rem
}

.wordmark {
  text-decoration:none;
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  line-height:1.05;
  flex-shrink:0
}

.wordmark>span {
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(1.35rem,2.2vw,2rem);
  letter-spacing:-.03em
}

.wordmark small {
  font-size:.65rem;
  letter-spacing:.55em;
  padding-left:.55em;
  margin-top:.5rem
}

.navigation {
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  align-items:center;
  width:100%
}

.navigation>a:not(.button) {
  font-family:var(--font-label);
  font-size:.8rem;
  text-transform:uppercase;
  text-decoration:none;
  padding:.5rem 0
}

.navigation>a:not(.button):hover {
  color:var(--sand)
}

.menu-toggle {
  color:var(--bone);
  background:transparent;
  border:1px solid #c7ab7c70;
  padding:.45rem .7rem;
  min-height:44px;
  font-size:.8rem
}

.menu-toggle span {
  margin-left:.6rem
}

.navigation[hidden] {
  display:none
}

/* Shared footer: aligned with the header and homepage content. */
.site-footer {
  background: #101e16 url('../images/header-grain.svg') repeat;
  color: var(--bone);
  border-top: 1px solid #c7ab7c45;
  padding-block: clamp(2.5rem, 5vw, 4rem) 1.25rem;
}

.site-footer .container {
  width: calc(100% - var(--site-inset) * 2);
  max-width: var(--site-max-width);
}

.footer-top {
  display: grid;
  gap: 2.5rem;
  padding-bottom: 2.75rem;
}

.footer-top > * { min-width: 0; }
.footer-brand > a { display: block; max-width: 340px; }
.footer-brand img { aspect-ratio: 5 / 1; object-fit: cover; }
.footer-slogan {
  margin: 1.25rem 0 .75rem;
  color: var(--sand);
  font-family: var(--font-label);
  font-size: .8rem;
  letter-spacing: .13em;
}
.footer-tagline { margin: 0; color: #c4cbbf; font-size: .9rem; }
.site-footer h2 {
  margin: 0 0 1.25rem;
  font-family: var(--font-label);
  font-size: .95rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.footer-services ul { list-style: none; margin: 0; padding: 0; }
.footer-services a {
  display: inline-block;
  padding-block: .3rem;
  color: #d3d8cc;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  text-decoration: none;
}
.site-footer a:hover { color: var(--sand); }
.site-footer a:focus-visible { outline-color: var(--sand); }
.footer-contact address { font-style: normal; }
.footer-contact address p {
  display: flex;
  align-items: flex-start;
  gap: .85rem;
  margin: 0 0 1.1rem;
  font-size: .9rem;
}
.footer-contact address svg {
  flex: 0 0 21px;
  width: 21px;
  height: 21px;
  margin-top: .15rem;
  fill: none;
  stroke: var(--sand);
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.footer-contact address a { overflow-wrap: anywhere; text-decoration: none; }
.footer-pending { color: #b4bfaf; }
.footer-back { display: inline-flex; gap: 1.5rem; padding-block: .5rem; font-size: .8rem; }
.footer-bottom {
  border-top: 1px solid #c7ab7c35;
  padding-top: 1.25rem;
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 2rem;
  justify-content: space-between;
  color: #b4bfaf;
}
.footer-bottom small { font-size: .75rem; }
.footer-credit { color: var(--bone); }

@media (min-width: 700px) {
  .footer-top { grid-template-columns: 1fr 1fr; gap: 2.5rem 3rem; }
  .footer-brand { grid-column: 1 / -1; }
}

@media (min-width: 1100px) {
  .footer-top { grid-template-columns: 1.15fr 1fr 1fr; gap: clamp(2rem, 5vw, 5rem); }
  .footer-brand { grid-column: auto; }
}

@media (min-width:650px) {
  :root { --site-inset:2rem; }
}

@media (min-width:1050px) {
  :root { --site-inset:2.5rem; }
  .header-inner { flex-wrap:nowrap; }
  .navigation { width:auto; gap:1.8rem; }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*::before,*::after {
    transition:none!important
  }
}


.button-forest { background:var(--forest); color:var(--bone); }
.button-forest:hover { background:var(--pine); }
[hidden] { display:none!important; }