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

   Palette is Piedmont rather than coastal: deep pine green carries buttons
   and links, a warm bark brown carries the hero and footer, and the accent
   is tobacco gold. Component structure is unchanged from the sibling
   markets, so the shared base and the generator keep working.

   The cascade-repair block at the end of this file is load-bearing — read
   the comment there before moving anything. The build is gated on
   ../_template/tools/check-cascade.mjs. */

:root { --background: #ffffff; --foreground: #14150f; --muted: #f3f2ea; --muted-2: #faf9f4; --muted-foreground: #57604f; --primary: #26594a; --primary-dark: #1b4136; --primary-foreground: #ffffff; --secondary: #3a3128; --secondary-dark: #29231c; --secondary-foreground: #ffffff; --accent: #c9a227; --accent-soft: #e2c86e; --border: #e0dccf; --border-strong: #cbc4b1; --ring: #26594a; --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); }
/* .eyebrow--gold is declared in base.css BEFORE .eyebrow, and both are single
   class selectors, so the plain .eyebrow colour was winning on source order and
   the modifier did nothing. On this palette that put dark pine green on the
   dark brown hero, which is close to unreadable. Re-declared here, after
   .eyebrow, so the modifier lands. */
.eyebrow--gold { color: var(--accent); }
.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); }
.brand__tag { display: block; font-size: 0.7rem; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted-foreground); }
.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(201 162 39 / 0.26) 0%, transparent 58%),
    radial-gradient(90% 90% at 10% 88%, rgb(38 89 74 / 0.55) 0%, transparent 64%),
    linear-gradient(115deg, #29231c 0%, #3a3128 48%, #4a4034 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(10 22 26 / 0.86) 0%, rgb(10 22 26 / 0.62) 45%, rgb(10 22 26 / 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(38 89 74 / 0.10) 0%, rgb(58 49 40 / 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:#29231c; }

/* ---- 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; }
}

/* No .info__phone rule here, on purpose. This market has no phone number:
   market.json sets phone and phoneDisplay to null, every hasPhone() path in
   the template stays off, and no page renders a tel: link. Styling an
   element that does not exist would only invite someone to add one. */