/* Shared chrome for static service pages. Matches Design C colors/fonts; does not change the homepage hero. */
:root {
  --ink: #282825;
  --evergreen: #2A311D;
  --sage: #5E6959;
  --rust: #90582B;
  --tan: #CFB187;
  --bone: #F7F2E8;
}

html { scroll-behavior: smooth; font-size: 109%; }
body {
  margin: 0;
  font-family: 'DM Sans', system-ui, sans-serif;
  background: #F7F2E8;
  color: #282825;
  -webkit-font-smoothing: antialiased;
}

@font-face {
  font-family: 'Sloop Script Pro';
  src: url('/assets/fonts/sloop-script/SloopScript-Regular.woff2') format('woff2'),
       url('/assets/fonts/sloop-script/SloopScript-Regular.woff') format('woff');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Kudryashev Display';
  src: url('/assets/fonts/kudryashev/KudryashevDisplay.woff2') format('woff2'),
       url('/assets/fonts/kudryashev/KudryashevDisplay.woff') format('woff');
  font-weight: 400 700; font-style: normal; font-display: swap;
}

a { color: inherit; }

.display {
  font-family: 'Kudryashev Display', 'Bodoni Moda', Didot, 'Bodoni 72', Georgia, serif;
  font-weight: 500;
  letter-spacing: -0.025em;
  line-height: 0.96;
  -webkit-text-stroke: 0.5px currentColor;
  paint-order: stroke fill;
}
.display-italic {
  font-family: 'Sloop Script Pro', 'Pinyon Script', cursive;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.01em;
}
.eyebrow {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  font-weight: 500;
}

.site-header {
  background: rgba(247,242,232,0.94);
  border-bottom: 1px solid rgba(17,17,17,0.06);
}
.site-header-inner,
.page-wrap,
.site-footer-inner {
  width: min(1480px, calc(100% - 40px));
  margin: 0 auto;
}
.site-header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 0;
  gap: 20px;
}
.site-logo { height: 48px; width: auto; }
.site-nav { display: none; gap: 28px; }
.site-nav a {
  font-size: 13.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  color: rgba(40,40,37,0.65);
}
.site-nav a:hover,
.site-nav a[aria-current="page"] { color: #282825; }

.btn-solid {
  background: #2A311D; color: #F7F2E8;
  padding: 14px 26px; font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 500;
  display: inline-flex; align-items: center; gap: 10px; text-decoration: none;
}
.btn-solid:hover { background: #90582B; color: #F7F2E8; }
.btn-outline {
  background: transparent; border: 1px solid rgba(42,49,29,0.35); color: #2A311D;
  padding: 11px 20px; font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 500;
  display: inline-flex; align-items: center; gap: 10px; text-decoration: none;
}
.btn-outline:hover { border-color: #2A311D; background: #2A311D; color: #F7F2E8; }
.header-phone { display: none; }

.page-hero { padding: 48px 0 20px; }
.page-hero h1 {
  font-size: clamp(2.4rem, 6vw, 4.6rem);
  margin: 16px 0 20px;
  max-width: 16ch;
}
.page-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 36px;
  padding: 12px 0 72px;
  align-items: start;
}
.page-copy p {
  font-size: 16px;
  line-height: 1.7;
  color: rgba(40,40,37,0.78);
  max-width: 42rem;
  margin: 0 0 1.1em;
}
.page-copy a { color: #2A311D; text-underline-offset: 3px; }
.page-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 28px 0 8px; }
.page-photo img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  box-shadow: 0 28px 60px -36px rgba(42,49,29,.55);
}
.related {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid rgba(40,40,37,0.12);
}
.related ul { margin: 10px 0 0; padding: 0; list-style: none; }
.related li { margin: 0 0 8px; }
.related a { color: #2A311D; }

.site-footer {
  background: #282825;
  color: rgba(247,242,232,0.8);
  padding: 40px 0 28px;
}
.site-footer-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
  margin-bottom: 28px;
}
.site-footer img { height: 64px; width: auto; }
.site-footer a { color: rgba(247,242,232,0.8); text-decoration: none; }
.site-footer a:hover { color: #CFB187; }
.site-footer .fine { font-size: 12px; color: rgba(247,242,232,0.4); border-top: 1px solid rgba(247,242,232,0.1); padding-top: 20px; }

address { font-style: normal; }

@media (min-width: 768px) {
  .site-logo { height: 64px; }
  .header-phone { display: inline-flex; }
  .site-header-inner,
  .page-wrap,
  .site-footer-inner { width: min(1480px, calc(100% - 80px)); }
  .page-layout { grid-template-columns: 1.15fr 0.85fr; gap: 56px; }
  .site-footer-grid { grid-template-columns: 1.4fr 1fr 1fr; }
}
@media (min-width: 1024px) {
  .site-nav { display: flex; }
  .site-header-inner,
  .page-wrap,
  .site-footer-inner { width: min(1480px, calc(100% - 128px)); }
}
@media (max-width: 640px) {
  html { font-size: 100%; }
  .btn-solid, .btn-outline { width: 100%; justify-content: center; }
}