:root {
  --paper: #f1ede4;
  --ink: #14130f;
  --rule: #14130f;
  --muted: #6a665d;
  --accent: #d6291f;
  --grid: rgba(20, 19, 15, 0.18);
  --gutter: 16px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { -webkit-text-size-adjust: 100%; }

body {
  font-family: "Barlow Condensed", "Archivo Narrow", Arial Narrow, sans-serif;
  font-weight: 500;
  font-size: 15px;
  line-height: 1.35;
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }

/* ---------- TYPE SCALE — only two sizes ----------
   Body: 15px (1rem). Display: clamp(56px, 18vw, 220px).
   Everything else uses one of these two sizes. */

.body, .label, p, li, dd, dt, address, figcaption, th, td, .nav__link, .pill, .stat__value, .stat__label, .review__text, .review__author, .ft, .crumb {
  font-size: 15px;
  line-height: 1.35;
}

.display, h1, h2, h3 {
  font-family: "Barlow Condensed", "Archivo Narrow", Arial Narrow, sans-serif;
  font-weight: 700;
  font-size: clamp(56px, 18vw, 220px);
  line-height: 0.86;
  letter-spacing: -0.02em;
  text-transform: uppercase;
}

.label, .crumb {
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-weight: 600;
  color: var(--ink);
}

.muted { color: var(--muted); }

/* ---------- LAYOUT ---------- */

.shell {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.rule { border: 0; border-top: 1px solid var(--rule); margin: 0; }
.rule--thick { border-top-width: 3px; }
.rule--hair { border-top: 1px solid var(--grid); }

/* Modular grid with visible column rules */
.grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  position: relative;
}

@media (min-width: 720px) {
  .grid--6 { grid-template-columns: repeat(6, 1fr); }
  .grid--12 { grid-template-columns: repeat(12, 1fr); }
  .grid--4 { grid-template-columns: repeat(4, 1fr); }
  .grid--3 { grid-template-columns: repeat(3, 1fr); }
  .grid--2 { grid-template-columns: repeat(2, 1fr); }
  .grid > * + * { border-left: 1px solid var(--grid); }
  .grid > * { padding: 22px 18px; }
}

.grid > * {
  padding: 18px var(--gutter);
}

.grid > * + * {
  border-top: 1px solid var(--grid);
}

@media (min-width: 720px) {
  .grid > * + * { border-top: 0; }
}

/* ---------- NAV ---------- */

.nav {
  position: sticky;
  top: 0;
  z-index: 30;
  background: var(--paper);
  border-bottom: 1px solid var(--rule);
}

.nav__row {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 56px;
  padding: 0 var(--gutter);
  flex-wrap: wrap;
}

.nav__brand {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 15px;
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  margin-right: auto;
}

.nav__brand .nav__sub {
  font-weight: 500;
  letter-spacing: 0.18em;
  color: var(--muted);
  font-size: 15px;
}

.nav__link, .pill {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 12px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 600;
  font-size: 15px;
  border-left: 1px solid var(--rule);
}

.nav__link--call {
  background: var(--accent);
  color: var(--paper);
}

.pill {
  border-left: 1px solid var(--rule);
  gap: 8px;
}

.pill .dot {
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--accent);
  display: inline-block;
}

@media (max-width: 719px) {
  .nav__row { padding: 0; }
  .nav__brand { padding: 0 var(--gutter); flex-basis: 100%; min-height: 44px; display: flex; align-items: center; border-bottom: 1px solid var(--grid); }
  .nav__link, .pill { flex: 1; justify-content: center; border-left: 0; border-right: 1px solid var(--grid); min-height: 48px; }
  .nav__link:last-child, .pill:last-child { border-right: 0; }
}

/* ---------- HERO ---------- */

.hero {
  border-bottom: 3px solid var(--rule);
  padding-top: 8px;
}

.hero__crumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  border-bottom: 1px solid var(--grid);
}

.hero__crumbs > * {
  flex: 1 1 0;
  padding: 10px var(--gutter);
  border-right: 1px solid var(--grid);
  font-size: 15px;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hero__crumbs > *:last-child { border-right: 0; }

.hero__display {
  padding: 28px var(--gutter) 8px;
  border-bottom: 1px solid var(--grid);
}

.hero__display .display {
  display: block;
  line-height: 1.0;
}

.hero__display .display .a {
  color: var(--accent);
}

.hero__meta {
  display: grid;
  grid-template-columns: 1fr;
}

@media (min-width: 720px) {
  .hero__meta { grid-template-columns: 2fr 1fr 1fr; }
  .hero__meta > * + * { border-left: 1px solid var(--grid); }
}

.hero__meta > * {
  padding: 18px var(--gutter);
}

.hero__meta > * + * {
  border-top: 1px solid var(--grid);
}

@media (min-width: 720px) {
  .hero__meta > * + * { border-top: 0; }
}

.hero__lede {
  font-size: 15px;
  line-height: 1.45;
  max-width: 60ch;
}

.cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  border-top: 1px solid var(--rule);
}

.cta {
  flex: 1 1 50%;
  min-width: 0;
  text-align: center;
  padding: 22px 16px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 15px;
  border-right: 1px solid var(--rule);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 64px;
}

.cta:last-child { border-right: 0; }
.cta--primary { background: var(--accent); color: var(--paper); }

.cta .arrow {
  font-weight: 400;
}

/* ---------- SECTION SCAFFOLD ---------- */

.sec {
  border-bottom: 1px solid var(--rule);
}

.sec__head {
  display: grid;
  grid-template-columns: 1fr;
  align-items: end;
  border-bottom: 1px solid var(--grid);
}

.sec__head > * {
  padding: 14px var(--gutter);
}

@media (min-width: 720px) {
  .sec__head { grid-template-columns: 80px 1fr 240px; }
  .sec__head > * + * { border-left: 1px solid var(--grid); }
}

.sec__head .sec__no {
  text-transform: uppercase;
  letter-spacing: 0.18em;
}

.sec__head .sec__title {
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-weight: 700;
}

.sec__body {
  padding: 0;
}

/* ---------- STATS BAND ---------- */

.stats {
  background: var(--ink);
  color: var(--paper);
  border-bottom: 1px solid var(--rule);
}

.stats__row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

@media (min-width: 720px) {
  .stats__row { grid-template-columns: repeat(4, 1fr); }
}

.stats__cell {
  padding: 22px 16px;
  border-right: 1px solid rgba(241, 237, 228, 0.18);
  border-bottom: 1px solid rgba(241, 237, 228, 0.18);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
@media (min-width: 720px) {
  .stats__cell { border-bottom: 0; }
  .stats__cell:last-child { border-right: 0; }
}

.stats__cell .stat__value {
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 700;
  font-size: clamp(56px, 18vw, 220px);
  line-height: 0.86;
  letter-spacing: -0.02em;
}

.stats__cell .stat__label {
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: rgba(241, 237, 228, 0.7);
}

.stats__cell .stat__value .accent { color: var(--accent); }

/* ---------- SERVICES ---------- */

.svc-list {
  list-style: none;
  display: grid;
  grid-template-columns: 1fr;
}

@media (min-width: 720px) {
  .svc-list { grid-template-columns: repeat(2, 1fr); }
}

.svc-list li {
  padding: 18px var(--gutter);
  border-top: 1px solid var(--grid);
  display: grid;
  grid-template-columns: 36px 1fr;
  gap: 14px;
}

@media (min-width: 720px) {
  .svc-list li:nth-child(2n) { border-left: 1px solid var(--grid); }
  .svc-list li:nth-child(1), .svc-list li:nth-child(2) { border-top: 0; }
}

.svc__no {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--accent);
}

.svc__title {
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-weight: 700;
  margin-bottom: 4px;
}

.svc__desc { color: var(--muted); }

/* ---------- PHOTO PLATE ---------- */

.plate {
  display: grid;
  grid-template-columns: 1fr;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}

@media (min-width: 720px) {
  .plate { grid-template-columns: 1fr 1fr; }
  .plate > * + * { border-left: 1px solid var(--rule); }
}

.plate__img {
  background: #2a2722;
  position: relative;
  overflow: hidden;
}

.plate__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  min-height: 360px;
}

.plate__caption {
  padding: 22px var(--gutter);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 22px;
  min-height: 360px;
}

.plate__caption .label { color: var(--muted); }

.plate__quote {
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 600;
  font-size: clamp(56px, 18vw, 220px);
  line-height: 0.9;
  letter-spacing: -0.015em;
  text-transform: uppercase;
}

/* ---------- TESTIMONIALS ---------- */

.reviews {
  display: grid;
  grid-template-columns: 1fr;
}

@media (min-width: 720px) {
  .reviews { grid-template-columns: repeat(3, 1fr); }
  .reviews > * + * { border-left: 1px solid var(--grid); }
  .reviews > *:nth-child(n+4) { border-top: 1px solid var(--grid); }
  .reviews > *:nth-child(3n+1) { border-left: 0; }
}

.review {
  padding: 22px var(--gutter);
  border-top: 1px solid var(--grid);
  display: flex;
  flex-direction: column;
  gap: 14px;
}

@media (min-width: 720px) {
  .review:nth-child(1), .review:nth-child(2), .review:nth-child(3) { border-top: 0; }
}

.review__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
}

.review__no {
  font-weight: 700;
  letter-spacing: 0.18em;
  color: var(--accent);
}

.review__stars {
  letter-spacing: 0.08em;
  color: var(--ink);
}

.review__text {
  line-height: 1.5;
  white-space: pre-wrap;
}

.review__author {
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-weight: 700;
  margin-top: auto;
}

.review__when {
  color: var(--muted);
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

/* ---------- VISIT ---------- */

.visit {
  display: grid;
  grid-template-columns: 1fr;
}

@media (min-width: 720px) {
  .visit { grid-template-columns: 1fr 1fr; }
  .visit > * + * { border-left: 1px solid var(--grid); }
}

.visit__panel {
  padding: 22px var(--gutter);
  border-top: 1px solid var(--grid);
}
@media (min-width: 720px) {
  .visit__panel { border-top: 0; }
}

.visit__panel + .visit__panel { border-top: 1px solid var(--grid); }
@media (min-width: 720px) {
  .visit__panel + .visit__panel { border-top: 0; }
}

.kv {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 0;
}

.kv > dt, .kv > dd {
  padding: 10px 0;
  border-top: 1px solid var(--grid);
}

.kv > dt {
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-weight: 700;
  color: var(--muted);
}

.kv > dd { font-style: normal; }

.kv > dt:first-of-type, .kv > dd:first-of-type { border-top: 0; padding-top: 0; }

.hours {
  list-style: none;
  display: grid;
  grid-template-columns: 1fr;
}

.hours li {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  border-top: 1px solid var(--grid);
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 600;
}

.hours li:first-child { border-top: 0; }
.hours li.closed { color: var(--muted); }

.map {
  border-top: 1px solid var(--rule);
  background: #ddd;
}

iframe.map__frame {
  width: 100%;
  height: 380px;
  display: block;
  border: 0;
}

/* ---------- FOOT CTA ---------- */

.footcta {
  background: var(--accent);
  color: var(--paper);
  text-align: center;
  padding: 56px var(--gutter);
  border-bottom: 1px solid var(--rule);
}

.footcta a {
  display: inline-block;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: -0.01em;
  font-size: clamp(56px, 18vw, 220px);
  line-height: 0.9;
}

.footcta__small {
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-weight: 600;
  margin-bottom: 12px;
}

/* ---------- FOOTER ---------- */

.foot {
  background: var(--ink);
  color: var(--paper);
}

.foot__row {
  display: grid;
  grid-template-columns: 1fr;
  padding: 0;
}

@media (min-width: 720px) {
  .foot__row { grid-template-columns: 2fr 1fr 1fr 1fr; }
  .foot__row > * + * { border-left: 1px solid rgba(241, 237, 228, 0.18); }
}

.foot__cell {
  padding: 22px var(--gutter);
  border-top: 1px solid rgba(241, 237, 228, 0.18);
}

@media (min-width: 720px) {
  .foot__cell { border-top: 0; }
}

.foot__cell .label {
  color: rgba(241, 237, 228, 0.55);
  margin-bottom: 6px;
}

.foot__fine {
  background: var(--ink);
  color: rgba(241, 237, 228, 0.55);
  border-top: 1px solid rgba(241, 237, 228, 0.18);
  padding: 16px var(--gutter);
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: 15px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
}
