main section[id] {
  scroll-margin-top: var(--s8);
}
.section__head {
  margin-bottom: var(--s8);
}
.section--split .split-layout > .section__head {
  margin-bottom: var(--s7);
}
.section__head .lead,
.prose > .rows,
.stack > * + * {
  margin-top: var(--s5);
}
.frame {
  position: relative;
  background: var(--raised);
  border: 1px solid var(--rule);
  border-radius: var(--rc);
  box-shadow: var(--sh-1);
}
.on-deep .frame,
.on-deep .faq,
.on-deep .form-aside {
  box-shadow: none;
}
.frame__body,
.panel {
  padding: var(--s6) var(--s5);
}

/* One column, full width. Two were tried and reverted: 03-REBUILD-NOTES. */
.prose {
  max-width: none;
}
.prose > * + * {
  margin-top: var(--s4);
}
.prose > p + p {
  position: relative;
  margin-top: var(--s6);
  padding-top: var(--s6);
}
.prose > p + p::before,
.rows__row + .rows__row::before,
.card__attribution::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 1px;
  background: var(--rule);
}
.prose.small > p + p {
  margin-top: var(--s5);
  padding-top: var(--s5);
}
.prose > * + h2 {
  margin-top: var(--s9);
}
.prose > * + h3,
.prose > * + h4 {
  margin-top: var(--s7);
}
.prose > h2 + *,
.prose > h3 + *,
.prose > h4 + * {
  margin-top: var(--s4);
}
.prose ul,
.prose ol {
  padding-left: 0;
  list-style: none;
}
.prose ul > li,
.prose ol > li {
  position: relative;
  padding-left: 1.75em;
}
.prose ul > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.72em;
  width: 10px;
  height: 2px;
  border-radius: 1px;
  background: var(--mark);
}
.prose li > strong:first-child {
  font-weight: var(--w-str);
  color: var(--text);
}
.prose ol {
  counter-reset: proseitem;
}
.prose ol > li {
  counter-increment: proseitem;
}
.prose ol > li::before {
  content: counter(proseitem, decimal-leading-zero);
  position: absolute;
  left: 0;
  font-family: var(--mono);
  font-size: var(--f-2);
  font-weight: var(--w-mid);
  color: var(--mark-text);
}
.prose li + li {
  margin-top: var(--s2);
}
.lead {
  font-size: var(--f1);
  line-height: 1.5;
  letter-spacing: -0.015em;
  color: var(--mut);
  text-wrap: pretty;
}
.small,
.eho p,
.compliance__disclosure p {
  font-size: var(--f-1);
  line-height: 1.55;
  color: var(--mut);
}
.data {
  font-family: var(--mono);
  font-weight: var(--w-body);
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
}
.pullquote {
  font-size: var(--f3);
  font-weight: var(--w-mid);
  line-height: 1.25;
  letter-spacing: -0.025em;
  max-width: 30ch;
  margin: var(--s7) 0;
  color: var(--text);
}
.crumbs {
  margin-bottom: var(--s5);
  font-family: var(--mono);
  font-size: var(--f-2);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mut);
}
.crumbs ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s2);
  list-style: none;
  margin: 0;
  padding: 0;
}
.crumbs li + li::before {
  content: "/";
  margin-right: var(--s2);
  color: var(--mark-text);
}
.crumbs a {
  display: inline-block;
  padding-block: 4px;
  color: var(--mut);
  text-decoration: none;
}
.crumbs a:hover {
  color: var(--link);
  text-decoration: underline;
}
.card,
.panel,
.figure,
.ledger {
  background: var(--raised);
  border: 1px solid var(--rule);
  border-radius: var(--rc);
  box-shadow: var(--sh-1);
}
.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--card-track)), 1fr));
  gap: var(--card-gap);
  list-style: none;
  margin: 0;
  padding: 0;
}
.card-grid--2 {
  --card-track: 600px;
}
.card-grid--2 > :last-child:nth-child(odd),
.record__row--wide {
  grid-column: 1 / -1;
}
.card-grid--3 {
  --card-track: 380px;
}
.card {
  display: flex;
  flex-direction: column;
  padding: var(--card-pad);
  box-shadow: var(--sh-2);
  transition: border-color var(--tr), box-shadow var(--tr), transform var(--tr);
}
.card__cover {
  margin: calc(var(--card-pad) * -1) calc(var(--card-pad) * -1) var(--s5);
  border-radius: var(--rc) var(--rc) 0 0;
  overflow: hidden;
}
.card__cover img {
  display: block;
  width: 100%;
}
.card--quote {
  justify-content: space-between;
}
.card__quote {
  margin: 0;
  font-size: var(--f1);
  line-height: 1.5;
  letter-spacing: -0.01em;
  color: var(--text);
  text-wrap: pretty;
}
.card__quote p {
  margin: 0;
}
.card__attribution {
  margin-top: var(--s6);
  padding-top: var(--s5);
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--s1);
  font-family: var(--mono);
  font-size: var(--f-2);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.card__attribution-name {
  font-weight: var(--w-mid);
  color: var(--mark-text);
}
.card__index {
  font-family: var(--mono);
  font-size: var(--f-2);
  font-weight: var(--w-mid);
  letter-spacing: 0.14em;
  color: var(--mark-text);
  margin-bottom: 12px;
}
.card__title {
  font-size: var(--f1);
  font-weight: var(--w-str);
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: var(--text);
  text-wrap: balance;
}
.card__body {
  font-size: var(--f-1);
  line-height: 1.6;
  margin-top: 12px;
  color: var(--mut);
  text-wrap: pretty;
}
.card__foot {
  margin-top: auto;
  padding-top: 20px;
  display: flex;
  justify-content: center;
}
.card__foot .btn {
  min-height: 44px;
  padding: 0.6rem 1.25rem;
}
.card:has(a):hover,
.card:focus-within {
  border-color: var(--acc);
  box-shadow: var(--sh-3);
  transform: translateY(-3px);
}
.on-deep .card:has(a):hover,
.on-deep .card:focus-within {
  border-color: var(--acc-lt);
}
.panel__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--s3);
  margin-bottom: var(--s5);
}
.panel__title {
  max-width: 20ch;
  text-wrap: balance;
  font-size: var(--f3);
  font-weight: var(--w-str);
  line-height: 1.15;
  letter-spacing: -0.025em;
}
.panel__note {
  margin-top: var(--s5);
  font-size: var(--f-1);
  color: var(--mut);
}
.pair,
.form__grid,
.footer__top,
.compliance {
  display: grid;
  gap: var(--s5);
}
.rows {
  margin: 0;
}
.rows__row {
  display: block;
  padding-block: var(--s4);
  position: relative;
}
.rows__row:first-child {
  padding-top: 0;
}
.rows dt {
  font-size: var(--f0);
  font-weight: var(--w-str);
  line-height: 1.5;
  color: var(--text);
}
.rows dd {
  font-size: var(--f0);
  line-height: 1.6;
  margin: var(--s2) 0 0;
  color: var(--mut);
}
.rows dd.data {
  font-size: var(--f1);
  font-weight: var(--w-mid);
}
.ledger {
  overflow-x: auto;
  padding: var(--s5);
}

/* Borders are four sides or none: a collapsed 1px border on every cell. */
.ledger:focus-visible {
  outline: 2px solid var(--ring);
  outline-offset: 2px;
}
.ledger table {
  min-width: 34rem;
  border-collapse: collapse;
}
.ledger caption {
  text-align: left;
  font-size: var(--f-1);
  color: var(--mut);
  margin-bottom: var(--s5);
  max-width: 60ch;
}
.ledger th,
.ledger td {
  padding: var(--s3) var(--s4);
  border: 1px solid var(--rule);
  vertical-align: top;
}
.ledger th {
  text-align: left;
}
.ledger td,
.ledger thead th + th {
  text-align: right;
}
.ledger thead th {
  font-family: var(--mono);
  font-size: var(--f-2);
  font-weight: var(--w-mid);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mut);
}
.ledger .data {
  white-space: nowrap;
}
.ledger tfoot td,
.ledger tfoot th {
  font-weight: var(--w-str);
  background: color-mix(in srgb, var(--rule) 22%, transparent);
}
.ledger__note {
  font-size: var(--f-1);
  color: var(--mut);
  display: block;
  margin-top: var(--s1);
  max-width: 40ch;
  font-weight: var(--w-body);
}
.steps {
  --step-marker: 46px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.steps > li {
  position: relative;
  display: grid;
  grid-template-columns: var(--step-marker) minmax(0, 1fr);
  gap: 0 var(--s6);
  padding-bottom: var(--s8);
}
.steps > li:last-child {
  padding-bottom: 0;
}
.steps > li:not(:last-child)::before {
  content: "";
  position: absolute;
  top: var(--step-marker);
  bottom: 0;
  left: calc(var(--step-marker) / 2 - 1px);
  width: 2px;
  background: var(--rule);
}
.steps__n {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--step-marker);
  height: var(--step-marker);
  border: 1px solid var(--rule);
  border-radius: 50%;
  background: var(--raised);
  box-shadow: var(--sh-1);
  font-family: var(--mono);
  font-size: var(--f-2);
  font-weight: var(--w-mid);
  letter-spacing: 0.06em;
  color: var(--mark-text);
}
.steps h3 {
  font-size: var(--f2);
  align-self: center;
  min-height: var(--step-marker);
  display: flex;
  align-items: center;
}
.steps p {
  grid-column: 2;
  margin-top: var(--s3);
  color: var(--mut);
}
.faq {
  background: var(--raised);
  border: 1px solid var(--rule);
  border-radius: var(--rc);
  box-shadow: var(--sh-1);
  overflow: hidden;
}
.faq__item {
  position: relative;
}
.faq__item + .faq__item::before {
  content: "";
  position: absolute;
  inset: 0 var(--s6) auto;
  height: 1px;
  background: var(--rule);
}
.faq__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s5);
  min-height: 44px;
  padding: var(--s5) var(--s6);
  margin: 0;
  cursor: pointer;
  list-style: none;
  font-size: var(--f1);
  font-weight: var(--w-mid);
  line-height: 1.35;
  letter-spacing: -0.015em;
  color: var(--text);
  transition: background-color var(--tr);
}
.faq__q::-webkit-details-marker {
  display: none;
}
.faq__q:hover {
  background: var(--ground);
}
.faq__q:focus-visible {
  outline: 2px solid var(--ring);
  outline-offset: -3px;
}
.faq__q::after {
  content: "";
  flex: none;
  width: 10px;
  height: 10px;
  margin-right: 3px;
  border-right: 2px solid var(--mark);
  border-bottom: 2px solid var(--mark);
  transform: rotate(45deg) translate(-2px, -2px);
  transition: transform var(--tr);
}
.faq__item[open] > .faq__q::after {
  transform: rotate(225deg) translate(-2px, -2px);
}
.faq__a {
  padding: 0 var(--s6) var(--s6);
}
.faq__a p,
.card__attribution-context {
  color: var(--mut);
}

@supports selector(details::details-content) {
  .faq__item::details-content {
    block-size: 0;
    overflow: hidden;
    transition: block-size 220ms var(--ease), content-visibility 220ms allow-discrete;
  }
  .faq__item[open]::details-content {
    block-size: auto;
  }
}
.figure {
  padding: var(--s3);
  margin: 0;
  box-shadow: var(--sh-2);
}
.figure img,
.figure picture,
.figure svg {
  border-radius: calc(var(--rc) - 8px);
  width: 100%;
}
.figure figcaption {
  padding: var(--s4) var(--s2) var(--s1);
  font-size: var(--f-1);
  color: var(--mut);
  max-width: 60ch;
}
.split {
  display: grid;
  gap: var(--s7);
  align-items: stretch;
}
.cta-band {
  display: grid;
  gap: var(--s6);
  justify-items: start;
}
.cta-band__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s4);
}

.form-layout {
  display: grid;
  gap: var(--s7);
}

.form-aside {
  background: var(--raised);
  border: 1px solid var(--rule);
  border-radius: var(--rc);
  box-shadow: var(--sh-1);
  padding: var(--s6);
  margin-bottom: var(--s7);
}
.form-aside__call {
  display: inline-block;
  font-family: var(--mono);
  font-size: var(--f3);
  font-weight: var(--w-mid);
  letter-spacing: -0.01em;
  color: var(--text);
  text-decoration: none;
  padding-block: 4px;
}
.form-aside__call:hover {
  color: var(--acc);
}
.rows--split {
  display: grid;
  gap: var(--s5) var(--s7);
  max-width: none;
}

.form {
  max-width: none;
}

@media (min-width: 37.5em) {

  .rows--split {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rows--split > :last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
  .rows--split .rows__row {
    padding-block: 0;
  }
  .rows--split .rows__row + .rows__row::before {
    display: none;
  }
  /* Six tracks: a field spans 3, city 4 beside a ZIP of 2, wide fields 6. */
  .form__grid--2 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .form__grid--2 > .field {
    grid-column: span 3;
  }
  .form__grid--2 > .field--city {
    grid-column: span 4;
  }
  .form__grid--2 > .field--zip {
    grid-column: span 2;
  }
  .form__grid--2 > .field--wide {
    grid-column: 1 / -1;
  }
}
.field label {
  display: block;
  font-family: var(--mono);
  font-size: var(--f-2);
  font-weight: var(--w-mid);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mut);
  margin-bottom: var(--s2);
}
.field input,
.field select,
.field textarea {
  display: block;
  width: 100%;
  height: 3.5rem;
  background: var(--surface);
  color: var(--ink);
  border: 1px solid var(--slate);
  border-radius: var(--radius-sm);
  padding: 0 var(--s4);
  font-size: var(--f0);
}
.field textarea {
  height: auto;
  min-height: 8.5rem;
  padding-block: 0.75rem;
  resize: vertical;
}
.field input:focus-visible,
.field select:focus-visible,
.field textarea:focus-visible {
  border-color: var(--acc);
  border-radius: var(--radius-sm);
}
.field__hint {
  display: block;
  margin-top: var(--s2);
  font-family: var(--mono);
  font-size: var(--f-2);
  color: var(--mut);
}
.field--check {
  display: flex;
  align-items: flex-start;
  gap: var(--s3);
}
.field--check input {
  width: 24px;
  height: 24px;
  margin-top: 2px;
  flex: none;
  accent-color: var(--acc);
}
.field--check label {
  font-family: var(--body);
  font-size: var(--f-1);
  letter-spacing: -0.005em;
  text-transform: none;
  color: var(--text);
  margin: 0;
  line-height: 1.55;
}

/* Honeypot: off-screen, not display:none; some bots skip hidden. */
/* Places listbox under the street field (js/places.js). */
.field {
  position: relative;
}
.places {
  position: absolute;
  inset: 100% 0 auto 0;
  z-index: 5;
  margin: 4px 0 0;
  padding: 4px 0;
  list-style: none;
  background: var(--raised);
  border: 1px solid var(--rule);
  border-radius: var(--radius-sm);
  box-shadow: var(--sh-2);
}
.places li {
  padding: 0.5rem 0.75rem;
  cursor: pointer;
}
.places li[aria-selected="true"],
.places li:hover {
  background: var(--ground);
}
.field--trap {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.form__actions .data {
  display: inline-block;
  padding-block: 3px;
}
.form__actions {
  margin-top: var(--s6);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s4);
}
.form__error {
  background: var(--surface);
  border: 1px solid var(--brass);
  border-radius: var(--rc);
  box-shadow: var(--sh-1);
  padding: var(--s5);
  margin-bottom: var(--s6);
  color: var(--ink);
}
.form__error ul {
  margin: var(--s2) 0 0;
  padding-left: var(--s5);
  font-size: var(--f-1);
}
.figure--inline {
  max-width: 560px;
  margin-top: var(--s7);
}
.figure--map {
  max-width: 680px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.plat-map {
  width: 100%;
  height: auto;
}
.plat-map .plat-map__parcel {
  fill: none;
  stroke: var(--rule);
  stroke-width: 1;
}
.plat-map .plat-map__fill {
  fill: var(--ground);
  stroke: var(--mark);
  stroke-width: 1;
}
.plat-map .plat-map__tick {
  stroke: var(--mark);
  stroke-width: 1;
}
.plat-map .plat-map__label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  fill: var(--mut);
}
.plat-map .plat-map__label--key {
  fill: var(--text);
}
.plat-map .plat-map__dot {
  fill: var(--mark);
}
.site-footer {
  padding-block: var(--s5) var(--s4);
}
.site-footer a {
  color: var(--paper);
  text-decoration: none;
}
.site-footer a:hover {
  color: var(--gold);
  text-decoration: underline;
  text-underline-offset: 0.18em;
}
.footer__brand .brand__logo {
  max-height: 36px;
}
.footer__contact {
  margin-top: var(--s2);
  font-size: var(--f-1);
  line-height: 1.4;
  color: var(--mut);
}
.footer__contact a {
  display: inline-block;
  padding-block: 4px;
  font-family: var(--mono);
}
.footer__cols {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: var(--s5);
}
.footer__col ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.footer__col h2 {
  font-family: var(--mono);
  font-size: var(--f-2);
  font-weight: var(--w-mid);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mut);
  max-width: none;
  margin-bottom: var(--s2);
}
.footer__col a {
  display: inline-block;
  padding-block: 4px;
  font-size: var(--f-1);
  line-height: 1.25;
}
.footer__rule {
  border: 0;
  height: 1px;
  background: #c8a77a59;
  margin: var(--s3) 0;
}

/* --- The compliance band. CLAUDE.md 3: legal text, not content. Every record
   row shares one size, weight and colour in one grid. DO NOT target a single
   row: making the broker attribution less conspicuous than the agent's is what
   LREC Chapter 25 forbids. docs/02-DESIGN-NOTES.md. Grid: .pair above. */

@media (min-width: 56.25em) {

  .frame__body {
    padding: var(--s9) var(--s8);
  }
  .pair {
    grid-template-columns: 1fr 1fr;
    gap: var(--s6);
  }
  .panel {
    padding: var(--s7) var(--s6);
  }
  .split {
    grid-template-columns: 1fr 1fr;
    gap: var(--s9);
  }
  .form-layout {
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
    gap: var(--s8);
    align-items: stretch;
  }
  .footer__top {
    grid-template-columns: minmax(220px, 0.9fr) 2.6fr;
    gap: var(--s9);
  }
  .compliance {
    grid-template-columns: 1fr 0.8fr 1.2fr;
    gap: var(--s6);
  }
}
.record__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: var(--s3) var(--s5);
  margin: 0;
  max-width: none;
}
.record__row {
  display: block;
  margin: 0;
}

/* The broker office address: its own full-width row (.record__row--wide, with
   .card-grid--2 above), LREC 3.1: same size, weight and colour as every row. */
.record__row dt {
  font-family: var(--mono);
  font-size: var(--f-2);
  font-weight: var(--w-body);
  line-height: 1.4;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mut);
}
.record__row dd {
  font-family: var(--mono);
  font-size: var(--f-1);
  font-weight: var(--w-mid);
  line-height: 1.4;
  letter-spacing: 0;
  color: var(--paper);
  margin: var(--s1) 0 0;
}
.record__row dd a {
  display: inline-block;
  padding-block: 4px;
  color: var(--paper);
}
.eho {
  display: flex;
  align-items: flex-start;
  gap: var(--s4);
}
.eho__mark {
  flex: none;
  width: 28px;
  height: 28px;
  color: var(--paper);
}

/* Legal text is never set smaller than the rest of the compliance band. */

/* CLAUDE.md 3.2. The principal disclosure, every page, at the band's own size
   and contrast. Never smaller, never hidden. */
.compliance__disclosure {
  margin-top: 0;
}
.compliance__disclosure .eyebrow {
  margin-bottom: var(--s2);
}
.footer__bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s3) var(--s5);
  font-size: var(--f-2);
  color: var(--mut);
}
.footer__legal {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s4);
  list-style: none;
  margin: 0;
  padding: 0;
}
.footer__legal a {
  display: inline-block;
  padding-block: 4px;
  text-decoration: underline;
  text-underline-offset: 0.18em;
}
.footer__admin {
  margin-left: auto;
  color: var(--mut);
  display: inline-flex;
  min-width: 24px;
  min-height: 24px;
  align-items: center;
  justify-content: center;
}
.footer__admin svg {
  width: 16px;
  height: 16px;
}
.js .reveal {
  opacity: 0;
  transform: translateY(6px);
  transition: opacity var(--tr), transform var(--tr);
}
.js .reveal.is-visible {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .js .reveal {
    opacity: 1;
    transform: none;
  }
}
.cluster {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s4);
}
.mt-6 {
  margin-top: var(--s6);
}
.mt-8 {
  margin-top: var(--s8);
}
