:root {
--clay: #b34a2e;
--clay-deep: #8c3620;
--slate: #2e3438;
--slate-soft: #556066;
--sand: #f4e9df;
--paper: #ffffff;
--line: #e0d5c9;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: system-ui, -apple-system, "Segoe UI", sans-serif; color: var(--slate); background: var(--paper); line-height: 1.7; }
img { max-width: 100%; height: auto; }
.wrap { max-width: 64rem; margin-inline: auto; padding-inline: 1.2rem; }
.narrow { max-width: 40rem; }
.site-head { background: var(--paper); border-bottom: 3px solid var(--clay); }
.head-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-block: .8rem; flex-wrap: wrap; }
.brand { font-size: 1.3rem; font-weight: 800; color: var(--slate); text-decoration: none; letter-spacing: .01em; }
.brand span { color: var(--clay); }
.site-nav { display: flex; gap: 1.1rem; align-items: center; flex-wrap: wrap; }
.site-nav a { color: var(--slate); text-decoration: none; font-weight: 600; font-size: .95rem; }
.site-nav a:hover { color: var(--clay); }
.nav-cta { background: var(--clay); color: #fff !important; padding: .45rem .9rem; border-radius: 6px; }
.nav-cta:hover { background: var(--clay-deep); }
.hero { background: var(--sand); padding: 3rem 0 2.6rem; position: relative; overflow: hidden; }
.hero::before { content: ""; position: absolute; inset: 0; opacity: .35;
background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);
background-size: 46px 46px; }
.hero .wrap { position: relative; }
.hero h1 { margin: 0 0 .5rem; font-size: clamp(1.7rem, 4vw, 2.5rem); line-height: 1.15; color: var(--slate); max-width: 34ch; }
.hero .lede { margin: 0; color: var(--slate-soft); font-size: 1.1rem; max-width: 60ch; }
.hero-svc { padding: 2.2rem 0 1.8rem; }
.svc-nav { display: flex; gap: .45rem; flex-wrap: wrap; padding-block: 1rem 0; }
.svc-nav a { font-size: .85rem; font-weight: 600; text-decoration: none; color: var(--clay-deep);
border: 1px solid var(--line); border-radius: 999px; padding: .3rem .8rem; }
.svc-nav a:hover { background: var(--sand); }
.band { padding: 2.2rem 0; }
.prose { max-width: 46rem; }
.prose h2 { color: var(--clay-deep); margin: 1.6rem 0 .6rem; font-size: clamp(1.2rem, 2.4vw, 1.5rem); }
.prose h3, .prose h4 { color: var(--slate); margin: 1.2rem 0 .4rem; }
.prose p { margin: 0 0 1rem; color: var(--slate-soft); }
.prose ul { margin: 0 0 1.1rem; padding-left: 1.2rem; }
.prose li { margin-bottom: .45rem; color: var(--slate-soft); }
.prose li::marker { color: var(--clay); }
.band-form { background: var(--sand); }
.band-form h2 { margin: 0 0 .4rem; color: var(--clay-deep); }
.band-form p { margin: 0 0 1.1rem; color: var(--slate-soft); }
.quote-form { display: grid; gap: .9rem; }
.quote-form label { display: grid; gap: .3rem; font-weight: 600; font-size: .92rem; }
.quote-form input, .quote-form textarea { font: inherit; padding: .65rem .8rem; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.quote-form textarea { resize: vertical; }
.quote-form button { font: inherit; font-weight: 700; background: var(--clay); color: #fff; border: 0; border-radius: 8px; padding: .8rem 1.4rem; cursor: pointer; justify-self: start; }
.quote-form button:hover { background: var(--clay-deep); }
.quote-form .hp { position: absolute; left: -9999px; }
[data-lead-success] { color: #1c6b34; font-weight: 600; }
[data-lead-error] { color: #a02020; font-weight: 600; }
.site-foot { background: var(--slate); color: #cfd6da; padding: 1.3rem 0; margin-top: 1.5rem; }
.site-foot p { margin: 0; font-size: .9rem; }
.site-foot a { color: var(--sand); }
@media (max-width: 640px) {
.head-row { justify-content: center; text-align: center; }
.site-nav { justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}