/* Site styles — Redtail Commercial Partners */
@import url('fonts/fonts.css');
@import url('tokens.css');
[hidden]{display:none!important}

* { box-sizing: border-box; }
html, body {
  margin: 0; padding: 0;
  font-family: var(--rt-sans);
  background: var(--rt-paper);
  color: var(--rt-ink);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body { min-height: 100vh; }
a { color: inherit; text-decoration: none; }

/* ── Site shell ── */
.site {
  max-width: 1480px;
  margin: 0 auto;
  padding: 0 var(--rt-gutter, 48px);
}
@media (max-width: 1080px) { .site { --rt-gutter: 40px; } }
@media (max-width: 720px) {
  .site { --rt-gutter: 24px; }
}

/* ── Header ── */
.nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--rt-nav-pt, 24px) 0 var(--rt-nav-pb, 20px);
  border-bottom: 1px solid rgba(27,23,20,0.12);
}
/* Lockup, refined Oct 2026 (design system Lockup component).
   Header = Compact spacing; footer (.foot-lockup) = Primary spacing. Scale with --rt-lockup. */
.nav-mark {
  display: flex; align-items: flex-start; gap: calc(1.9px * var(--rt-lockup, 1));
  flex-shrink: 0;
  color: var(--rt-ink);
}
.nav-mark > svg {
  width: calc(54.1px * var(--rt-lockup, 1));
  height: calc(54.1px * var(--rt-lockup, 1));
  margin-left: calc(-12.1px * var(--rt-lockup, 1));
  flex-shrink: 0;
}
.nav-mark > div { margin-top: calc(7.1px * var(--rt-lockup, 1)); line-height: 1; }
.nav-mark .nav-word {
  font-family: var(--rt-serif);
  font-weight: 400;
  font-size: calc(29px * var(--rt-lockup, 1));
  letter-spacing: -0.026em;
  line-height: 1;
}
.nav-mark .nav-tag {
  font-family: var(--rt-sans); font-weight: 600;
  font-size: calc(9.5px * var(--rt-lockup, 1));
  letter-spacing: 0.2em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--rt-ink-3);
  margin-top: calc(2px * var(--rt-lockup, 1));
}
.nav-menu {
  display: flex; align-items: center; gap: 36px;
}
.nav-menu .btn, .nav-cta { white-space: nowrap; }
@media (max-width: 1220px) {
  .nav-menu { gap: 20px; }
  .nav-menu a:not(.nav-cta) { font-size: 10px; letter-spacing: 0.09em; }
}
@media (max-width: 1080px) {
  .nav-menu { gap: 16px; }
  .nav-menu a:not(.nav-cta) { font-size: 9.5px; letter-spacing: 0.08em; }
  .nav-cta { padding: 9px 14px; font-size: 12px; letter-spacing: 0.01em; }
}
@media (max-width: 860px) {
  .nav { flex-wrap: wrap; gap: 14px; }
  .nav-menu { width: 100%; flex-wrap: wrap; gap: 14px 18px; }
}
.nav-menu a:not(.nav-cta) {
  font-family: var(--rt-sans); font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.125em;
  text-transform: uppercase;
  color: var(--rt-ink-2);
  position: relative;
  padding: 8px 0;
  transition: color .2s var(--rt-ease);
}
.nav-menu a:not(.nav-cta):hover { color: var(--rt-red); }
.nav-menu a.active:not(.nav-cta) { color: var(--rt-ink); }
.nav-menu a.active:not(.nav-cta)::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -1px;
  height: 1px; background: var(--rt-red);
}
.nav-cta {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--rt-ink);
  color: var(--rt-bone);
  padding: 11px 18px;
  font-family: var(--rt-sans); font-weight: 500;
  font-size: 13px;
  letter-spacing: 0.01em;
  transition: background .25s var(--rt-ease), color .25s var(--rt-ease);
}
.nav-cta .arr {
  display: inline-block;
  transition: transform .25s var(--rt-ease);
  opacity: 0.75;
}
.nav-cta:hover { background: var(--rt-red); }
.nav-cta:hover .arr { transform: translateX(3px); opacity: 1; }

/* ── Footer ── */
.foot {
  margin-top: 168px;
  border-top: 1px solid rgba(27,23,20,0.12);
  padding: 56px 0 30px;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr; /* restore 2fr 1fr 1fr 1fr when Connect column is unhidden */
  gap: 48px;
}
.foot-lockup { display: inline-flex; align-self: flex-start; --rt-lockup: 1.5; }
.foot-lockup { gap: calc(6.2px * var(--rt-lockup, 1)); }
.foot-lockup > svg {
  width: calc(58.4px * var(--rt-lockup, 1));
  height: calc(58.4px * var(--rt-lockup, 1));
  margin-left: calc(-13.1px * var(--rt-lockup, 1));
}
.foot-lockup > div { margin-top: calc(7.7px * var(--rt-lockup, 1)); }
.foot-lockup .nav-tag { margin-top: calc(5.1px * var(--rt-lockup, 1)); }
@media (max-width: 900px) { .foot-lockup { --rt-lockup: 1.25; } }
.foot-brand h3 {
  font-family: var(--rt-serif);
  font-weight: 400;
  font-size: 32px;
  line-height: 1.1;
  margin: 0;
  max-width: 380px;
  letter-spacing: -0.01em;
}
.foot-brand p {
  font-family: var(--rt-sans);
  font-size: 13px;
  line-height: 1.6;
  color: var(--rt-ink-2);
  max-width: 320px;
  margin: 0;
}
.foot-col h2, .foot-col h4 {
  font-family: var(--rt-sans);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rt-ink-3);
  margin: 0 0 18px;
  font-weight: 500;
}
.foot-col a, .foot-col p {
  display: block;
  font-family: var(--rt-sans);
  font-size: 13.5px;
  color: var(--rt-ink-2);
  margin: 0 0 10px;
  line-height: 1.5;
  transition: color .2s;
}
.foot-col a:hover { color: var(--rt-red); }
.foot-end {
  grid-column: 1 / -1;
  margin-top: 26px;
  padding: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--rt-sans); font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rt-ink-3);
}

/* ── TX-required real estate disclosures ── */
.foot-disclosures {
  grid-column: 1 / -1;
  margin-top: 6px;
  padding: 18px 0 0;
  border-top: 1px solid rgba(27,23,20,0.12);
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  align-items: start;
}
.foot-disclosures .disc-head {
  font-family: var(--rt-sans); font-weight: 500;
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rt-ink-3);
}
.foot-disclosures .disc-body {
  font-family: var(--rt-sans);
  font-size: 11.5px;
  line-height: 1.6;
  color: var(--rt-ink-3);
  max-width: 760px;
}
.foot-disclosures .disc-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 26px;
  margin-top: 0;
  justify-content: flex-start;
}
.foot-disclosures .disc-links a {
  font-family: var(--rt-sans); font-weight: 500;
  font-size: 14px; /* TREC 22 TAC 531.20: full "Texas Real Estate Commission ..." label requires min 10pt (13.33px) */
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rt-ink-2);
  border-bottom: 1px solid rgba(27,23,20,0.14);
  padding-bottom: 2px;
  transition: color .2s var(--rt-ease), border-color .2s var(--rt-ease);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.foot-disclosures .disc-links a:hover {
  color: var(--rt-red);
  border-color: var(--rt-red);
}
.foot-disclosures .disc-links a .arr {
  font-size: 12px;
  opacity: 0.6;
  transition: transform .2s var(--rt-ease);
}
.foot-disclosures .disc-links a:hover .arr { transform: translateX(2px); opacity: 1; }
@media (max-width: 820px) {
  .foot-disclosures { grid-template-columns: 1fr; }
}

/* ── Buttons ── */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 16px 28px;
  font-family: var(--rt-sans); font-weight: 500;
  font-size: 14px;
  letter-spacing: 0.01em;
  cursor: pointer;
  transition: background .25s var(--rt-ease), color .25s var(--rt-ease), border-color .25s var(--rt-ease);
  border: none;
  background: transparent;
}
.btn-primary { background: var(--rt-ink); color: var(--rt-bone); }
.btn-primary:hover { background: var(--rt-red); }
.btn:focus-visible, .link:focus-visible, .nav-menu a:focus-visible {
  outline: 2px solid var(--rt-red); outline-offset: 3px;
}

/* ── Text links (in-page) ── */
/* Sentence case, underlined, in the body size. Quieter than the nav. */
.link {
  display: inline-block;
  font-family: var(--rt-sans); font-weight: 500;
  font-size: 15px;
  line-height: 1.3;
  color: var(--rt-ink);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
  text-decoration-color: rgba(27,23,20,0.35);
  transition: color .2s var(--rt-ease), text-decoration-color .2s var(--rt-ease);
}
.link:hover { color: var(--rt-red); text-decoration-color: var(--rt-red); }
.link-light { color: var(--rt-bone); text-decoration-color: rgba(250,246,238,0.4); }
.link-light:hover { color: var(--rt-sand); text-decoration-color: var(--rt-sand); }

/* ── Role label on service cards ── */
.role {
  font-family: var(--rt-serif);
  font-style: italic;
  font-size: 17px;
  line-height: 1;
  color: var(--rt-red);
}
.btn-ghost {
  color: var(--rt-ink);
  border-bottom: 1px solid var(--rt-ink);
  padding: 8px 0 6px;
}
.btn-ghost:hover { color: var(--rt-red); border-color: var(--rt-red); }
/* Card links: mono + arrow is enough; the rule appears on hover only. */
article .btn-ghost, .section > div > .btn-ghost { border-bottom-color: transparent; }
article .btn-ghost:hover, .section > div > .btn-ghost:hover { border-bottom-color: var(--rt-red); }
.btn .arr { transition: transform .25s var(--rt-ease); }
.btn:hover .arr { transform: translateX(4px); }

/* ── Type utilities ── */
h1, h2, h3, h4 { font-family: var(--rt-serif); font-weight: 400; letter-spacing: -0.015em; margin: 0; }
.eyebrow {
  font-family: var(--rt-sans); font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rt-ink-2);
  display: inline-flex; align-items: center; gap: 10px;
}
.eyebrow::before {
  content: ''; width: 18px; height: 1.5px; background: var(--rt-red);
}
.body-lg { font-size: 18px; line-height: 1.6; color: var(--rt-ink-2); text-wrap: pretty; }
.body { font-size: 16px; line-height: 1.6; color: var(--rt-ink-2); text-wrap: pretty; }
.mono-small {
  font-family: var(--rt-sans); font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rt-ink-3);
}

/* ── Placeholder imagery (striped) ── */
.ph {
  position: relative;
  background: repeating-linear-gradient(
    135deg,
    var(--rt-paper-2) 0px, var(--rt-paper-2) 10px,
    var(--rt-paper-3) 10px, var(--rt-paper-3) 20px
  );
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.ph-dark {
  background: repeating-linear-gradient(
    135deg,
    #2a2520 0px, #2a2520 10px,
    #322b25 10px, #322b25 20px
  );
}
.ph .ph-label {
  font-family: var(--rt-sans); font-weight: 500;
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(27,23,20,0.45);
}
.ph-dark .ph-label { color: rgba(250,246,238,0.4); }

/* ── Stat blocks ── */
.stats { display: grid; gap: 24px; }
.stat .stat-n {
  font-family: var(--rt-serif);
  font-weight: 400;
  font-size: 56px;
  letter-spacing: -0.02em;
  line-height: 1;
  color: var(--rt-ink);
}
.stat .stat-n em { font-style: italic; color: var(--rt-red); }
.stat .stat-l {
  margin-top: 10px;
  font-family: var(--rt-sans); font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rt-ink-3);
}

/* ── Property card ── */
.prop {
  display: flex; flex-direction: column; gap: 16px;
  cursor: pointer;
}
.prop .prop-img {
  aspect-ratio: 4/3;
  width: 100%;
  transition: transform .4s var(--rt-ease);
}
.prop:hover .prop-img { transform: scale(1.02); }
.prop-meta { display: flex; justify-content: space-between; align-items: baseline; }
.prop h3 {
  font-size: 24px;
  line-height: 1.15;
  letter-spacing: -0.01em;
}
.prop h3 em { font-style: italic; color: var(--rt-red); }
.prop-addr {
  font-family: var(--rt-sans); font-weight: 400;
  font-size: 11px;
  letter-spacing: 0.02em;
  color: var(--rt-ink-3);
  margin-top: 4px;
}
.prop-status {
  font-family: var(--rt-sans); font-weight: 500;
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: 4px 8px;
  color: var(--rt-bone);
  background: var(--rt-red);
  flex: 0 0 auto;
}
.prop-status.lease { background: var(--rt-ink); }
.prop-status.sold { background: var(--rt-ink-3); }
.prop-details {
  display: flex; gap: 24px;
  font-family: var(--rt-sans); font-weight: 400; letter-spacing: 0.02em;
  font-size: 12px;
  color: var(--rt-ink-2);
  padding-top: 12px;
  border-top: 1px solid rgba(27,23,20,0.12);
}
.prop-details div span {
  display: block;
  font-size: 9.5px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--rt-ink-3); margin-top: 2px;
}

/* ── Section helpers ── */
.section { padding: 96px 0; }
.section-tight { padding: 64px 0; }
.divider { border-top: 1px solid rgba(27,23,20,0.12); }
.divider-strong { border-top: 1px solid rgba(27,23,20,0.12); }

/* Visually-hidden but available to screen readers and search engines */
.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ── Phone layout ── */
@media (max-width: 900px) {
  .site [style*="position: sticky"] { position: static !important; }
}
@media (max-width: 760px) {
  .site [style*="grid-template-columns"]:not(li) { grid-template-columns: minmax(0,1fr) !important; }
  .site [style*="grid-template-columns"]:not(li):not([style*="gap: 1px"]) { gap: 36px !important; }
  .site [style*="grid-template-columns"] > * { min-width: 0; }
  .site [style*="border-left: 1px solid"] { border-left: 0 !important; padding-left: 0 !important; }
  .site article[style*="padding: 54px"] { padding: 36px 24px 30px !important; }
  .site img { max-width: 100%; }
  .listing-grid { grid-template-columns: minmax(0,1fr) !important; }
  .foot { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 36px 24px; margin-top: 112px; }
  .foot-brand { grid-column: 1 / -1; }
  .foot-disclosures .disc-links { gap: 4px 16px; }
  .foot-disclosures .disc-links a, .foot-col a { padding: 9px 0; }
  .foot-end { flex-wrap: wrap; gap: 8px 16px; }
  .nav .nav-menu a:not(.nav-cta) { padding: 13px 0; }
  .nav .nav-cta { padding: 14px 16px; }
  .nav-menu { gap: 2px 20px; }
  .site [style*="justify-content: space-between"] { flex-wrap: wrap; gap: 20px; }
  .site .btn { min-height: 44px; }
  a[href^="mailto:"], a[href^="tel:"] { display: inline-flex; align-items: center; min-height: 44px; }
  h1, h2 { overflow-wrap: break-word; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; }
}

/* Launch check: 24px+ tap area for standalone text links, without moving layout */
.link { position: relative; }
.link::after { content: ""; position: absolute; inset: -4px 0; }

/* ── Spacing system (Oct 2026) ──
   Sections 96 (phone 64) · page intro 84 / 72 (phone 48 / 48)
   closing CTA 112 (phone 72) · space above footer 96 (phone 64) */
.page-intro { padding: 84px 0 72px; }
.section-cta { padding: 112px 0; }
.foot { margin-top: 96px; }
@media (max-width: 760px) {
  .section { padding-top: 64px !important; padding-bottom: 64px !important; }
  .section-cta { padding-top: 72px !important; padding-bottom: 72px !important; }
  .page-intro { padding: 48px 0; }
  .hero { padding-top: 48px !important; padding-bottom: 64px !important; }
  .foot { margin-top: 64px; }
}

/* ── Phone menu button (checkbox toggle, no script) ── */
.nav-check, .nav-btn { display: none; }
@media (max-width: 760px) {
  .nav { flex-wrap: wrap; align-items: center; gap: 0; }
  .nav-mark { margin-right: auto; }
  .nav-check { display: block; position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
  .nav-btn {
    display: inline-flex; align-items: center; gap: 10px;
    min-height: 44px; padding: 0 14px;
    border: 1px solid rgba(27,23,20,0.25);
    font-family: var(--rt-sans); font-weight: 500; font-size: 14px; color: var(--rt-ink);
    cursor: pointer; user-select: none;
  }
  .nav-btn-icon { position: relative; width: 16px; height: 10px; border-top: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; }
  .nav-btn-icon::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; margin-top: -0.75px; border-top: 1.5px solid currentColor; }
  .nav-check:focus-visible + .nav-btn { outline: 2px solid var(--rt-red); outline-offset: 2px; }
  .nav-check:checked + .nav-btn { background: var(--rt-ink); border-color: var(--rt-ink); color: var(--rt-bone); }
  .nav-menu { display: none; width: 100%; flex-direction: column; align-items: stretch; gap: 0; margin-top: 16px; }
  .nav-check:checked ~ .nav-menu { display: flex; }
  .nav .nav-menu a:not(.nav-cta) { padding: 14px 0; border-top: 1px solid rgba(27,23,20,0.12); font-size: 12px; }
  .nav .nav-menu .nav-cta { margin-top: 12px; justify-content: center; text-align: center; }
}

/* ── Oct 30 review: phone menu active state, phone footer links ── */
@media (max-width: 760px) {
  .nav .nav-menu a.active:not(.nav-cta) { color: var(--rt-red); }
  .nav .nav-menu a.active:not(.nav-cta)::after { display: none; }
  .foot-disclosures .disc-links a { text-transform: none; letter-spacing: 0.01em; }
}

/* Dark track-record band runs edge to edge on wide screens (beyond the 1480px column) */
[data-screen-label="Track record"] { box-shadow: 0 0 0 100vmax var(--rt-ink); clip-path: inset(0 -100vmax); }

/* Home asset-class ledger: each type links to its deals on Transactions */
.ledger-link { text-decoration: none; color: inherit; }
.ledger-link > span:first-child { transition: width .24s var(--rt-ease); }
.ledger-link .ledger-name { text-decoration: underline; text-decoration-color: transparent; text-decoration-thickness: 1px; text-underline-offset: 6px; transition: text-decoration-color .24s var(--rt-ease); }
.ledger-link:hover > span:first-child, .ledger-link:focus-visible > span:first-child { width: 100% !important; }
.ledger-link:hover .ledger-name, .ledger-link:focus-visible .ledger-name { text-decoration-color: rgba(250,246,238,0.5); }
@media (prefers-reduced-motion: reduce) { .ledger-link > span:first-child, .ledger-link .ledger-name { transition: none; } }
