/* market.css — augusta. Rules that differ from, or do not exist in,
   the shared base. Loaded after base.css.

   Palette — antebellum brick, river-plain ink and copper, drawn from the
   Summerville and Olde Town housing stock rather than from anything
   coastal:

     --primary    #7a3542  old brick — buttons, links, CTA band
     --secondary  #2c2833  river ink — hero, step numbers, footer
     --accent     #c69a63  copper — eyebrows, hero weave pattern
     --muted      #f4f1ec  warm sand — alternating section bands

   Warmer and heavier than the coastal markets in the group, which is the
   point: this is a brick-and-heart-pine city, not a stucco one. The same
   three values drive favicon.svg and og-image.svg, so the tab icon, the
   share card and the site agree.

   Only three rules hardcode a brand colour rather than reading a token:
   the hero backdrop gradient, the hero scrim, and the photo placeholder
   wash. Everything else is structural and shared, which is what keeps
   tools/check-cascade.mjs quiet. */

:root { --background: #ffffff; --foreground: #0f0f0f; --muted: #f4f1ec; --muted-2: #faf8f5; --muted-foreground: #5c5651; --primary: #7a3542; --primary-dark: #5f2833; --primary-foreground: #ffffff; --secondary: #2c2833; --secondary-dark: #1e1b24; --secondary-foreground: #ffffff; --accent: #c69a63; --accent-soft: #e3cfae; --border: #e2dcd4; --border-strong: #cbc2b6; --ring: #7a3542; --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; --radius: 0.5rem; --radius-btn: 0.375rem; --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.08), 0 1px 2px -1px rgb(0 0 0 / 0.08); --shadow-md: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 2px 6px -1px rgb(0 0 0 / 0.1); --shadow-lg: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 8px 20px -6px rgb(0 0 0 / 0.16); --wrap: 1180px; --header-h: 74px; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 12px); }
body { margin: 0; font-family: var(--font-sans); font-size: 1rem; line-height: 1.65; color: var(--foreground); background: var(--background); -webkit-font-smoothing: antialiased; overflow-x: clip; }
h1, h2, h3, h4 { line-height: 1.2; margin: 0 0 0.6em; font-weight: 700; letter-spacing: -0.015em; }
h1 { font-size: clamp(2rem, 5.2vw, 3rem); }
h2 { font-size: clamp(1.55rem, 3.6vw, 1.95rem); }
h3 { font-size: 1.125rem; }
ul, ol { margin: 0 0 1rem; padding-left: 1.25rem; }
a { color: var(--primary); text-decoration-thickness: 1px; text-underline-offset: 2px; }
:focus-visible { outline: 3px solid var(--ring); outline-offset: 2px; border-radius: 3px; }
.section { padding-block: 3.5rem; }
.section--tight { padding-block: 2.5rem; }
.lead { font-size: 1.075rem; color: var(--muted-foreground); }
.section--dark .lead, .section--brand .lead { color: rgb(255 255 255 / 0.85); }
.measure { max-width: 68ch; }
.eyebrow { display: inline-block; margin: 0 0 0.65rem; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.13em; text-transform: uppercase; color: var(--primary); }
.section-head { max-width: 62ch; margin-bottom: 2.25rem; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.75rem 1.35rem; border: 2px solid transparent; border-radius: var(--radius-btn); font: inherit; font-weight: 600; font-size: 0.95rem; line-height: 1.2; text-decoration: none; cursor: pointer; transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, transform 0.1s ease; }
.btn--ghost { background: transparent; color: #fff; border-color: rgb(255 255 255 / 0.75); }
.btn--ghost:hover { background: rgb(255 255 255 / 0.14); color: #fff; border-color: #fff; }
.arrow-link { display: inline-flex; align-items: center; gap: 0.35rem; font-weight: 600; text-decoration: none; }
.topbar { background: var(--secondary-dark); color: rgb(255 255 255 / 0.92); font-size: 0.82rem; text-align: center; padding: 0.5rem 1.25rem; }
.site-header { position: sticky; top: 0; z-index: 60; background: #fff; border-bottom: 1px solid var(--border); box-shadow: var(--shadow-sm); }
.brand { display: flex; align-items: center; gap: 0.65rem; text-decoration: none; color: inherit; margin-right: auto; }
.brand__mark { flex: none; width: 42px; height: 42px; }
.brand__name { font-weight: 700; font-size: 1.02rem; line-height: 1.15; letter-spacing: -0.02em; color: var(--secondary); }
.site-nav ul { display: flex; align-items: center; gap: 0.15rem; list-style: none; margin: 0; padding: 0; }
.site-nav a { display: block; padding: 0.5rem 0.7rem; border-radius: var(--radius-btn); font-size: 0.9rem; font-weight: 500; color: var(--secondary); text-decoration: none; }
.site-nav a[aria-current="page"] { color: var(--primary); font-weight: 600; box-shadow: inset 0 -2px 0 var(--primary); }
.mobile-nav { display: none; border-top: 1px solid var(--border); background: #fff; padding: 0.75rem 0 1.15rem; }
.mobile-nav a { display: block; padding: 0.7rem 0.35rem; border-bottom: 1px solid var(--border); font-weight: 600; color: var(--secondary); text-decoration: none; }
.hero { position: relative; display: flex; align-items: center; min-height: 520px; padding-block: 3.5rem; background: var(--secondary); overflow: hidden; isolation: isolate; }
.hero--short { min-height: 340px; padding-block: 3rem; }
.hero__bg { position: absolute; inset: 0; z-index: -2; background:
    radial-gradient(120% 100% at 78% 18%, rgb(198 154 99 / 0.30) 0%, transparent 58%),
    radial-gradient(90% 90% at 10% 88%, rgb(122 53 66 / 0.46) 0%, transparent 62%),
    linear-gradient(115deg, #1e1b24 0%, #2c2833 48%, #56313c 100%); }
.hero__pattern { position: absolute; inset: 0; z-index: -1; opacity: 0.16; pointer-events: none; }
.hero__scrim { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(18 15 22 / 0.86) 0%, rgb(18 15 22 / 0.62) 45%, rgb(18 15 22 / 0.30) 100%); }
.hero__inner { position: relative; max-width: 40rem; color: #fff; }
.hero h1 { color: #fff; margin-bottom: 0.75rem; }
.hero__sub { font-size: 1.1rem; font-weight: 600; color: var(--accent); margin-bottom: 0.9rem; }
.hero p.hero__body { color: rgb(255 255 255 / 0.9); font-size: 1.03rem; margin-bottom: 1.6rem; }
.hero .btn-row { margin-bottom: 1.4rem; }
.hero__trust { display: flex; flex-wrap: wrap; gap: 0.5rem 1.4rem; list-style: none; margin: 0; padding: 0; font-size: 0.85rem; color: rgb(255 255 255 / 0.85); }
.hero__trust li { display: flex; align-items: center; gap: 0.4rem; }
.hero__trust svg { flex: none; color: var(--accent); }
.hero__seal { display: none; }
.crumbs { font-size: 0.85rem; color: var(--muted-foreground); padding-block: 0.9rem; }
.crumbs li + li::before { content: "/"; margin-right: 0.4rem; color: var(--border-strong); }
.grid { display: grid; gap: 1.25rem; }
.features { display: grid; gap: 1.4rem; }
.feature__icon { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: var(--radius); background: var(--primary); color: #fff; }
.feature h3 { font-size: 1rem; margin-bottom: 0.2rem; }
.feature p { font-size: 0.92rem; color: var(--muted-foreground); }
.card { display: flex; flex-direction: column; padding: 1.5rem; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); transition: box-shadow 0.18s ease, transform 0.18s ease, border-color 0.18s ease; }
.card:hover { box-shadow: var(--shadow-lg); transform: translateY(-3px); border-color: var(--border-strong); }
.card__icon { display: grid; place-items: center; width: 48px; height: 48px; margin-bottom: 1rem; border-radius: var(--radius); background: var(--muted); color: var(--primary); border: 1px solid var(--border); }
.card p { font-size: 0.94rem; color: var(--muted-foreground); }
.card--flag { border-top: 4px solid var(--primary); }
.tag { display: inline-block; margin-bottom: 0.75rem; padding: 0.2rem 0.6rem; border-radius: 999px; background: var(--primary); color: #fff; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.panel { display: grid; gap: 1.75rem; padding: 1.75rem; border: 1px solid var(--border); border-left: 5px solid var(--primary); border-radius: var(--radius); background: linear-gradient(135deg, #ffffff 0%, var(--muted) 100%); box-shadow: var(--shadow-md); }
.panel h2 { margin-bottom: 0.5rem; }
.checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6rem; }
.checklist li { display: flex; gap: 0.6rem; font-size: 0.94rem; }
.checklist svg { flex: none; margin-top: 0.28rem; color: var(--primary); }
.section--dark .checklist svg { color: var(--accent); }
.steps { display: grid; gap: 1.25rem; counter-reset: step; }
.step { position: relative; padding: 1.4rem 1.4rem 1.4rem 1.4rem; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); }
.step__num { display: grid; place-items: center; width: 34px; height: 34px; margin-bottom: 0.8rem; border-radius: 999px; background: var(--secondary); color: #fff; font-size: 0.9rem; font-weight: 700; }
.step h3 { font-size: 1.02rem; margin-bottom: 0.35rem; }
.step p { font-size: 0.92rem; color: var(--muted-foreground); margin: 0; }
.stats { display: grid; gap: 1.5rem; grid-template-columns: repeat(2, 1fr); margin-top: 2rem; text-align: center; }
.stat__num { font-size: clamp(2rem, 5vw, 2.6rem); font-weight: 700; color: var(--accent); line-height: 1.1; }
.stat__label { font-size: 0.9rem; color: rgb(255 255 255 / 0.85); }
.info-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.1rem; }
.info-list .info__icon { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: var(--radius); background: #fff; border: 1px solid var(--border); color: var(--primary); }
.info__label { font-size: 0.76rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted-foreground); }
a.info__value:hover { color: var(--primary); text-decoration: underline; }
.form-card { padding: 1.5rem; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.field label { font-size: 0.85rem; font-weight: 600; color: var(--secondary); }
.field .hint { font-size: 0.78rem; font-weight: 400; color: var(--muted-foreground); }
.field input, .field select, .field textarea { width: 100%; padding: 0.65rem 0.75rem; font: inherit; font-size: 0.95rem; color: var(--foreground); background: #fff; border: 1px solid var(--border-strong); border-radius: var(--radius-btn); }
fieldset legend { padding: 0; margin-bottom: 0.75rem; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted-foreground); }
.form-note { font-size: 0.82rem; color: var(--muted-foreground); margin-top: 0.9rem; }
.form-status[data-tone='ok'] { background: #eef6ee; border-color: #b8d9b8; color: #1f5130; }
.form-status[data-tone='error'] { background: #fdf0ec; border-color: #e8bfae; color: #8a2f12; }
.callout { display: grid; gap: 1rem; align-items: center; padding: 1.5rem; border: 1px solid var(--border); border-radius: var(--radius); background: #fff; }
.callout__icon { display: grid; place-items: center; width: 56px; height: 56px; border-radius: var(--radius); background: var(--secondary); color: var(--accent); }
.callout h2 { font-size: 1.15rem; margin-bottom: 0.3rem; }
.callout p { font-size: 0.92rem; color: var(--muted-foreground); margin: 0; }
.pill-list { display: flex; flex-wrap: wrap; gap: 0.5rem; list-style: none; margin: 0; padding: 0; }
.pill-list li { padding: 0.4rem 0.85rem; border: 1px solid var(--border-strong); border-radius: 999px; background: #fff; font-size: 0.87rem; font-weight: 500; color: var(--secondary); }
.section--dark .pill-list li { background: rgb(255 255 255 / 0.08); border-color: rgb(255 255 255 / 0.22); color: #fff; }
.faq { display: grid; gap: 0.75rem; }
.faq details { border: 1px solid var(--border); border-radius: var(--radius); background: #fff; overflow: hidden; }
.faq details[open] { border-color: var(--border-strong); box-shadow: var(--shadow-sm); }
.faq summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 1.15rem; font-weight: 600; font-size: 1rem; color: var(--secondary); cursor: pointer; list-style: none; }
.faq summary::after { content: "+"; flex: none; font-size: 1.35rem; font-weight: 400; color: var(--primary); line-height: 1; }
.faq .faq__body { padding: 0 1.15rem 1.15rem; font-size: 0.94rem; color: var(--muted-foreground); }
.prose { width: 100%; max-width: 72ch; }
.prose h2 { margin-top: 2.5rem; padding-top: 0.4rem; }
.prose h2:first-child { margin-top: 0; }
.prose h3 { margin-top: 1.75rem; font-size: 1.05rem; }
.prose p, .prose li { color: #2b2b2b; }
.prose blockquote { margin: 1.5rem 0; padding: 1rem 1.25rem; border-left: 4px solid var(--accent); background: var(--muted); border-radius: 0 var(--radius) var(--radius) 0; font-size: 0.96rem; }
.toc { padding: 1.25rem 1.4rem; background: var(--muted); border: 1px solid var(--border); border-radius: var(--radius); }
.toc h2 { font-size: 0.8rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted-foreground); margin: 0 0 0.7rem; }
.toc ol { margin: 0; padding-left: 1.1rem; font-size: 0.93rem; }
.toc li { margin-bottom: 0.3rem; }
.table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius); }
table { width: 100%; border-collapse: collapse; font-size: 0.92rem; background: #fff; }
caption { padding: 0.75rem 1rem; text-align: left; font-size: 0.85rem; color: var(--muted-foreground); background: var(--muted); border-bottom: 1px solid var(--border); }
th { background: var(--muted-2); font-weight: 700; color: var(--secondary); white-space: nowrap; }
.photo-ph { position: relative; display: grid; place-items: center; min-height: 220px; padding: 1.5rem; border: 2px dashed var(--border-strong); border-radius: var(--radius); background:
    linear-gradient(135deg, rgb(122 53 66 / 0.10) 0%, rgb(44 40 51 / 0.10) 100%),
    repeating-linear-gradient(45deg, var(--muted) 0 12px, var(--muted-2) 12px 24px); text-align: center; }
.photo-ph__label { font-size: 0.74rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--primary); }
.photo-ph__caption { font-size: 0.9rem; color: var(--muted-foreground); max-width: 32ch; margin: 0.35rem auto 0; }
.quote { display: flex; flex-direction: column; padding: 1.5rem; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); }
.quote blockquote { margin: 0 0 1rem; font-size: 0.96rem; }
.quote__stars { display: flex; gap: 2px; color: var(--accent); margin-bottom: 0.8rem; }
.quote__by { margin-top: auto; font-size: 0.86rem; color: var(--muted-foreground); }
.quote__by strong { display: block; color: var(--foreground); font-size: 0.92rem; }
.site-footer { background: var(--secondary); color: rgb(255 255 255 / 0.78); font-size: 0.92rem; }
.footer-brand__name { font-weight: 700; color: #fff; font-size: 1rem; line-height: 1.2; }
.site-footer h3 { color: #fff; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 1rem; }
.site-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; }
.footer-social { display: flex; gap: 0.6rem; margin-top: 1.1rem; }
.footer-social a { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid rgb(255 255 255 / 0.22); border-radius: var(--radius-btn); color: rgb(255 255 255 / 0.8); }
.footer-social a:hover { background: rgb(255 255 255 / 0.1); color: #fff; }
.footer-bottom { display: flex; flex-wrap: wrap; gap: 0.6rem 1.25rem; justify-content: space-between; padding-block: 1.25rem; border-top: 1px solid rgb(255 255 255 / 0.14); font-size: 0.85rem; }
.callbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--border-strong); border-top: 1px solid var(--border-strong); box-shadow: 0 -2px 12px rgb(0 0 0 / 0.12); }
.callbar a { padding: 0.85rem 0.5rem; background: #fff; color: var(--secondary); font-size: 0.9rem; font-weight: 600; text-align: center; text-decoration: none; }
.err { display: grid; place-items: center; text-align: center; padding-block: 5rem; }
.err__code { font-size: clamp(4rem, 16vw, 8rem); font-weight: 700; line-height: 1; color: var(--accent); letter-spacing: -0.04em; }
.u-mt-125 { margin-top:1.25rem; }
.u-white { color:#fff; }
.u-mt-1 { margin-top:1rem; }
.u-row-center-15 { justify-content:center; margin-top:1.5rem; }
.u-mt-2 { margin-top:2rem; }
.u-mt-175 { margin-top:1.75rem; }
.u-fs-095 { font-size:0.95rem; }
.u-narrow { max-width:60rem; margin-inline:auto; }
.u-my-15 { margin:1.5rem 0; }
.u-fs-125 { font-size:1.25rem; }
.u-fs-115 { font-size:1.15rem; }
.u-fs-098 { font-size:0.98rem; }
.u-my-2 { margin:2rem 0; }
.u-panel-ghost { margin-top:2.5rem; background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.25); }
.u-mt-15 { margin-top:1.5rem; }
.u-row-center-175 { justify-content:center; margin-top:1.75rem; }
.u-fw-500 { font-weight:500; }
.u-fs-135 { font-size:1.35rem; }
.u-fs-094-muted { font-size:0.94rem; color:var(--muted-foreground); }
.u-white-80 { color:rgba(255,255,255,.8); }
.u-white-mt-175 { color:#fff; margin-top:1.75rem; }
.u-accent { color:var(--accent); }
.u-bt-0 { border-top:0; }
.u-btn-accent { background:var(--accent); border-color:var(--accent); color:#2c2833; }

/* ---- media queries, ascending (mobile-first) ---------------------- */
@media (min-width: 800px) {
  .callout { grid-template-columns: 56px 1fr auto; gap: 1.4rem; }
}
@media (min-width: 900px) {
  .hero__seal { display: block; position: absolute; right: 2rem; bottom: 1.5rem; width: 132px; opacity: 0.5; pointer-events: none; }
  .grid--4 { grid-template-columns: repeat(4, 1fr); }
  .split { grid-template-columns: 1.05fr 1fr; gap: 3rem; }
  .split--wide-right { grid-template-columns: 1fr 1.15fr; }
  .panel { grid-template-columns: 1.15fr 1fr; padding: 2.25rem; align-items: center; }
}
@media (min-width: 1024px) {
  .header-cta { display: flex; align-items: center; gap: 0.9rem; }
  .header-cta__num { font-weight: 700; font-size: 0.95rem; color: var(--secondary); text-decoration: none; white-space: nowrap; }
  .header-cta__num:hover { color: var(--primary); }
  .header-cta__note { font-size: 0.85rem; color: var(--muted-foreground); white-space: nowrap; }
}
@media (max-width: 1023px) {
  body { padding-bottom: 54px; }
}

/* ---- cascade repair -------------------------------------------------
   These four declarations live in base.css inside media queries, but this
   file declares the same properties at top level and loads afterwards.
   Media queries carry no specificity, so the later top-level rule was
   winning and the responsive behaviour was silently lost:

     .callbar     stayed visible over content at desktop
     .mobile-nav  never got its desktop reset
     .stats       stayed 2-up instead of 4-up above 900px
     html         kept smooth scrolling for reduced-motion users

   Re-declared here so they land last. Values are copied verbatim from
   base.css — nothing new is introduced. */
@media (min-width: 900px) {
  .stats { grid-template-columns: repeat(4, 1fr); }
}
@media (min-width: 1024px) {
  .mobile-nav,
  .mobile-nav.is-open { display: none; }
  .callbar { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/* Contact page phone: the one piece of information on that page a visitor
   may want to act on immediately, so it reads as a link and not as body
   copy sitting inside the info list. */
.info__phone { font-weight: 700; font-size: 1.05rem; color: var(--secondary); text-decoration: none; }
.info__phone:hover { color: var(--primary); text-decoration: underline; }