/* base.css — shared across all markets.
   Generated from the rules that were byte-identical across the market
   stylesheets at extraction time, so adopting it cannot change any
   existing site's appearance. Market-specific rules live in market.css, which loads after
   this file and wins on equal specificity. Do not hand-edit: regenerate
   with _template/tools/split-css.mjs. */

*, *::before, *::after { box-sizing: border-box; }
img, svg { display: block; max-width: 100%; }
p { margin: 0 0 1rem; }
p:last-child { margin-bottom: 0; }
a:hover { color: var(--primary-dark); }
.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: 1.25rem; }
.section--muted { background: var(--muted); }
.section--muted-soft { background: var(--muted-2); border-block: 1px solid var(--border); }
.section--dark { background: var(--secondary); color: var(--secondary-foreground); }
.section--brand { background: var(--primary); color: var(--primary-foreground); }
.center { text-align: center; }
.mx-auto { margin-inline: auto; }
.stack > * + * { margin-top: 1rem; }
.eyebrow--gold { color: var(--accent); }
.section-head.center { margin-inline: auto; }
.skip-link { position: absolute; left: 0.5rem; top: -100px; z-index: 999; padding: 0.7rem 1.1rem; background: var(--primary); color: #fff; font-weight: 600; border-radius: var(--radius-btn); transition: top 0.15s ease; }
.skip-link:focus { top: 0.5rem; color: #fff; }
.btn:active { transform: translateY(1px); }
.btn--primary { background: var(--primary); color: #fff; border-color: var(--primary); }
.btn--primary:hover { background: var(--primary-dark); border-color: var(--primary-dark); color: #fff; }
.btn--onbrand { background: #fff; color: var(--primary); border-color: #fff; }
.btn--onbrand:hover { background: var(--muted); color: var(--primary-dark); }
.btn--outline { background: #fff; color: var(--primary); border-color: var(--border-strong); }
.btn--outline:hover { background: var(--muted); border-color: var(--primary); color: var(--primary-dark); }
.btn-row { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.arrow-link:hover { text-decoration: underline; }
.arrow-link::after { content: "\2192"; transition: transform 0.15s ease; }
.arrow-link:hover::after { transform: translateX(3px); }
.topbar strong { color: var(--accent); }
.topbar a { color: #fff; font-weight: 600; }
.header-inner { display: flex; align-items: center; gap: 1rem; min-height: var(--header-h); }
.nav-toggle { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 0.7rem; background: #fff; border: 1px solid var(--border-strong); border-radius: var(--radius-btn); font: inherit; font-size: 0.85rem; font-weight: 600; color: var(--secondary); cursor: pointer; }
.nav-toggle:hover { background: var(--muted); }
.site-nav { display: none; }
.site-nav a:hover { background: var(--muted); color: var(--primary); }
.header-cta { display: none; }
.mobile-nav.is-open { display: block; }
.mobile-nav ul { list-style: none; margin: 0 0 0.9rem; padding: 0; }
.mobile-nav a[aria-current="page"] { color: var(--primary); }
.mobile-nav .btn { width: 100%; }
.crumbs ol { display: flex; flex-wrap: wrap; gap: 0.4rem; list-style: none; margin: 0; padding: 0; }
.crumbs a { color: var(--muted-foreground); text-decoration: none; }
.crumbs a:hover { color: var(--primary); text-decoration: underline; }
.grid--2 { grid-template-columns: 1fr; }
.grid--3 { grid-template-columns: 1fr; }
.grid--4 { grid-template-columns: 1fr; }
.split { display: grid; gap: 2.25rem; align-items: start; }
.grid > *, .split > *, .steps > *, .features > *, .stats > *, .footer-grid > * { min-width: 0; }
.feature { display: flex; gap: 0.85rem; }
.card .arrow-link { margin-top: auto; padding-top: 1rem; }
.info-list li { display: flex; gap: 0.8rem; }
.info__value { font-weight: 600; color: var(--foreground); text-decoration: none; overflow-wrap: anywhere; }
.form-grid { display: grid; gap: 1rem; }
.field { display: flex; flex-direction: column; gap: 0.35rem; }
.field textarea { min-height: 120px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--primary); }
fieldset { margin: 0 0 1.25rem; padding: 0; border: 0; }
.form-status { margin-top: 1rem; padding: 0.85rem 1rem; border-radius: var(--radius-btn); background: var(--muted); border: 1px solid var(--border); font-size: 0.9rem; }
.form-status:empty { display: none; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.faq summary::-webkit-details-marker { display: none; }
.faq details[open] summary::after { content: "\2212"; }
.faq summary:hover { background: var(--muted-2); }
.prose img, .prose table { max-width: 100%; }
.prose li { margin-bottom: 0.4rem; }
th, td { padding: 0.7rem 1rem; text-align: left; border-bottom: 1px solid var(--border); vertical-align: top; }
tbody tr:last-child td { border-bottom: 0; }
.photo-ph--tall { min-height: 340px; }
.photo-ph svg { margin: 0 auto 0.6rem; color: var(--border-strong); }
.site-footer a { color: rgb(255 255 255 / 0.78); text-decoration: none; }
.site-footer a:hover { color: #fff; text-decoration: underline; }
.footer-grid { display: grid; gap: 2rem; padding-block: 3rem; }
.footer-brand { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.9rem; }
.callbar a.is-primary { background: var(--primary); color: #fff; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
@media (min-width: 1000px) {
  .footer-grid { grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: 2.5rem; }
}
@media (min-width: 1024px) {
  .nav-toggle { display: none; }
  .site-nav { display: block; }
  .mobile-nav, .mobile-nav.is-open { display: none; }
  .callbar { display: none; }
}
@media (min-width: 560px) {
  .features { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 620px) {
  .grid--2 { grid-template-columns: repeat(2, 1fr); }
  .grid--4 { grid-template-columns: repeat(2, 1fr); }
  .steps { grid-template-columns: repeat(2, 1fr); }
  .form-grid--2 { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 720px) {
  .footer-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 900px) {
  .grid--3 { grid-template-columns: repeat(3, 1fr); }
  .stats { grid-template-columns: repeat(4, 1fr); }
}
@media (min-width: 980px) {
  .steps { grid-template-columns: repeat(3, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}
@media print {
  .site-header, .callbar, .topbar, .site-footer { display: none; }
}

/* ---- photo-fig -------------------------------------------------------
   Shared image component used by both the generated pages and the five
   hand-written ones. Replaces the .photo-ph placeholder block that used to
   render the literal words "Photo needed" as body copy. */
.photo-fig { margin: 0; }
.photo-fig img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--radius-card, 10px);
  border: 1px solid var(--border, #e2ded6);
  background: var(--muted, #f4f1ea);
}
.photo-fig figcaption {
  margin-top: 0.6rem;
  font-size: 0.85rem;
  line-height: 1.45;
  color: var(--muted-foreground, #5c5c5c);
}

/* ---- card--link ------------------------------------------------------
   Index-page cards that are themselves the link. */
a.card--link { text-decoration: none; color: inherit; display: block; }
a.card--link h3 { margin-top: 0; }
a.card--link:hover { border-color: var(--primary, #8e2f22); }
a.card--link .arrow-link { margin-top: 0.75rem; display: inline-block; }

/* ---- pill-list -------------------------------------------------------
   Used for nearby-neighborhood and related-type link lists. */
.pill-list { list-style: none; padding: 0; margin: 1rem 0 0; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.pill-list li a,
.pill-list li {
  display: inline-block;
  padding: 0.4rem 0.85rem;
  border: 1px solid var(--border, #e2ded6);
  border-radius: 999px;
  font-size: 0.9rem;
  text-decoration: none;
  color: inherit;
  background: #fff;
}
.pill-list li a:hover { border-color: var(--primary, #8e2f22); color: var(--primary, #8e2f22); }


/* ---- header overflow guard -------------------------------------------
   The primary nav grew when services / rug types / areas were added, and
   on the market with the longest brand string that pushed .header-cta
   past the viewport at 1440px. Flex children default to min-width:auto
   and refuse to shrink below their content, so the row overflowed instead
   of compressing. These two rules let it compress, and the clip stops any
   future nav addition from reintroducing a horizontal scrollbar. */
.site-header .header-inner { min-width: 0; }
.site-header .site-nav { min-width: 0; flex-shrink: 1; }
.site-header .site-nav ul { flex-wrap: nowrap; }
body { overflow-x: clip; }