/* My Backyard Reset — page-level additions to the design system.
   Everything here either cannot be expressed inline (media queries,
   pseudo-elements) or is a shared page pattern used across templates. */

body { margin: 0; background: #0b2026; color: #f8f6f1; font-family: "Inter", system-ui, sans-serif; }
a:not([class]) { color: inherit; }
a:not([class]):hover { color: inherit; }

/* --- header refinements --- */
.mbr-nav-desktop a { white-space: nowrap; }
.mbr-nav-desktop ul { gap: clamp(.875rem, 1.5vw, 1.75rem) !important; }
.mbr-nav-desktop a[aria-current] { border-block-end-color: var(--color-bronze-600) !important; }
.mbr-wordmark-name { white-space: nowrap; }
.mbr-header-phone { display: none !important; }
@media (width >= 82rem) { .mbr-header-phone { display: inline-flex !important; } }
.mbr-header-cta { padding-inline: .9375rem; min-height: 2.625rem; font-size: .8125rem; }
.mbr-menu-button {
  background: rgba(11, 32, 38, .58) !important;
  border-color: color-mix(in oklab, #f8f6f1 62%, transparent) !important;
  color: #f8f6f1; min-height: 2.875rem;
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.mbr-menu-button:hover { background: rgba(11, 32, 38, .78) !important; border-color: #f8f6f1 !important; }

/* --- hero service strip --- */
.mbr-strip { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; margin: 0; padding: 0; list-style: none; }
.mbr-strip li { padding: 1.125rem .5rem; text-align: center; border-block-end: 1px solid color-mix(in oklab, #a8c3ba 16%, transparent); }
.mbr-strip li:nth-child(odd) { border-inline-end: 1px solid color-mix(in oklab, #a8c3ba 16%, transparent); }
@media (width >= 48rem) {
  .mbr-strip { grid-template-columns: repeat(4, 1fr); }
  .mbr-strip li { border-block-end: 0; border-inline-end: 1px solid color-mix(in oklab, #a8c3ba 16%, transparent); padding-block: 1.25rem; }
  .mbr-strip li:last-child { border-inline-end: 0; }
}

/* --- shot-direction placeholder (stands in for unshot photography) --- */
.mbr-shot {
  border: 1px dashed color-mix(in oklab, #a8c3ba 34%, transparent);
  background: #123039; display: grid; align-content: end; gap: .5rem;
  padding: clamp(.875rem, 3vw, 1.25rem);
}
.mbr-surface-salt .mbr-shot, .mbr-surface-limestone .mbr-shot {
  border-color: color-mix(in oklab, #0b2026 26%, transparent); background: #f0ebe3;
}
.mbr-shot-label { font-size: .625rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #9a654f; }
.mbr-surface-salt .mbr-shot-label, .mbr-surface-limestone .mbr-shot-label { color: #7f4f3d; }
.mbr-shot p { margin: 0; font-size: .8125rem; line-height: 1.5; color: #c7d9d3; max-width: 36ch; }
.mbr-surface-salt .mbr-shot p, .mbr-surface-limestone .mbr-shot p { color: #1d4148; }

/* --- handoff annotation --- */
.mbr-note { border-left: 2px solid #9a654f; padding: .625rem 0 .625rem .875rem; display: grid; gap: .375rem; max-width: 62ch; }
.mbr-note p { font-size: .8125rem; line-height: 1.5; color: #c7d9d3; margin: 0; }
.mbr-surface-salt .mbr-note p, .mbr-surface-limestone .mbr-note p { color: #1d4148; }
.mbr-note-label { font-size: .625rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #9a654f; }
.mbr-surface-salt .mbr-note-label, .mbr-surface-limestone .mbr-note-label { color: #7f4f3d; }

/* --- shared content patterns --- */
.mbr-includes { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.mbr-includes li {
  display: grid; grid-template-columns: .875rem 1fr; gap: .875rem; align-items: start;
  padding-block: .9375rem; border-block-start: 1px solid color-mix(in oklab, #a8c3ba 22%, transparent);
  font-size: .9375rem; line-height: 1.5;
}
.mbr-includes li:last-child { border-block-end: 1px solid color-mix(in oklab, #a8c3ba 22%, transparent); }
.mbr-surface-salt .mbr-includes li, .mbr-surface-limestone .mbr-includes li,
.mbr-surface-salt .mbr-includes li:last-child, .mbr-surface-limestone .mbr-includes li:last-child {
  border-color: color-mix(in oklab, #0b2026 14%, transparent);
}
.mbr-includes svg { color: #9a654f; margin-block-start: .3125rem; }

.mbr-card-body { font-size: .9375rem; line-height: 1.55; color: #c7d9d3; margin: 0; }
.mbr-surface-salt .mbr-card-body, .mbr-surface-limestone .mbr-card-body { color: #1d4148; }
.mbr-plan-title { font-family: var(--font-display); font-size: 1.625rem; line-height: 1.15; margin: .625rem 0 0; letter-spacing: -.01em; }
.mbr-index-num { display: flex; align-items: center; font-family: var(--font-sans); font-size: .6875rem; font-weight: 700; letter-spacing: .12em; color: #7f4f3d; }
@media (width >= 48rem) { .mbr-index-link { grid-template-columns: 2.25rem minmax(12rem, 18rem) 1fr auto !important; } }
.mbr-crumbs { display: flex; flex-wrap: wrap; gap: .5rem .75rem; align-items: baseline; }
.mbr-crumbs a { text-decoration: none; }
.mbr-crumbs a:hover { text-decoration: underline; }
.mbr-two { display: grid; gap: clamp(2rem, 6vw, 4rem); align-items: start; }
@media (width >= 64rem) { .mbr-two { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.mbr-two-wide { display: grid; gap: clamp(2rem, 6vw, 4rem); align-items: start; }
@media (width >= 64rem) { .mbr-two-wide { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); } }
.mbr-tags { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.mbr-table { width: 100%; border-collapse: collapse; font-size: .9375rem; }
.mbr-table th, .mbr-table td { text-align: left; padding: .875rem .75rem; border-block-end: 1px solid color-mix(in oklab, #0b2026 14%, transparent); vertical-align: top; }
.mbr-table th { font-family: var(--font-sans); font-size: .6875rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #315e54; }
.mbr-table td:first-child { font-family: var(--font-display); font-size: 1.125rem; }