/* =========================================================================
   The Brokerage Collective — "Editorial" brand stylesheet (brand build #2)

   Ported from her approved draft 2 (tenant-sites/brokeragecollective/preview/
   style.css, concept A + the "Draft 2" palette block). Linked ONLY by this
   brand's build (BaseLayout, brand.branding.stylesheetUrl) and pruned from
   every other brand's dist/ — see docs/site-brands.md "Brand build #2".

   A static file on purpose: the editorial chrome and pages are imported into
   shared modules (BaseLayout, the brand-page dispatcher), and a stylesheet
   Astro bundles from a component would land on Homestead pages too.

   The shared consumer components (search, listing pages) are repainted by the
   brand's palette overrides on <html> (brands.static.ts) — this file only
   styles the editorial chrome, the brand pages, and a few shared-surface
   touches scoped under `body.tbc`.
   ========================================================================= */

:root {
  --tbc-navy: #071426;
  --tbc-burgundy: #651D32;
  --tbc-burgundy-deep: #4A1525;
  --tbc-gold: #D9BE91;
  --tbc-cream: #F6F0E4;
  --tbc-walnut: #6B4A33;
  --tbc-surface: #FCF8F0;
  --tbc-ink: var(--tbc-navy);
  --tbc-muted: #5F5347;
  --tbc-line: #DCCFBB;
  --tbc-wash: #EDE3D2;
  --tbc-on-navy: #F3EAD9;
  --tbc-on-navy-muted: #C9C2B4;
  --tbc-serif: 'Zodiak', Georgia, serif;
  --tbc-sans: 'Switzer', Arial, sans-serif;
}

body.tbc {
  background: var(--tbc-cream);
  color: var(--tbc-ink);
  font-family: var(--tbc-sans);
}

/* Headings across the brand (shared components included) are Zodiak, not the
   Homestead display caps. */
body.tbc h1,
body.tbc h2,
body.tbc h3,
body.tbc h4 {
  font-family: var(--tbc-serif);
  font-weight: 400;
  letter-spacing: -0.03em;
  line-height: 1.15;
  text-transform: none;
  color: inherit;
}
body.tbc em { font-style: italic; font-weight: 400; }
body.tbc a:hover { opacity: 0.8; }
body.tbc :focus-visible { outline: 3px solid #BD9A57; outline-offset: 3px; }

.tbc-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ── Header ──────────────────────────────────────────────────────────────── */
.tbc-header {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 24px;
  min-height: 112px;
  padding: 0 4.4%;
  border-bottom: 1px solid var(--tbc-line);
  background: var(--tbc-cream);
}
.tbc-header__nav { display: flex; gap: 26px; align-items: center; }
.tbc-header__nav--right { justify-content: flex-end; }
.tbc-header__link {
  font-size: 12px;
  letter-spacing: 0.065em;
  text-transform: uppercase;
  padding: 12px 0;
  white-space: nowrap;
  border-bottom: 1px solid transparent;
}
.tbc-header__link.is-active { border-bottom-color: var(--tbc-burgundy); }
.tbc-header__account { border-bottom: 1px solid var(--tbc-burgundy); }
.tbc-header__account span { margin-left: 6px; }
.tbc-header__brand { display: block; padding: 8px 0; }
.tbc-header__brand img { width: 235px; height: auto; margin: 0 auto; }
.tbc-header__mobile { display: none; }

@media (max-width: 1100px) {
  .tbc-header { padding: 0 3%; gap: 16px; }
  .tbc-header__nav { gap: 16px; }
  .tbc-header__link { font-size: 11px; }
  .tbc-header__brand img { width: 180px; }
}
@media (max-width: 900px) {
  .tbc-header { grid-template-columns: 1fr auto; min-height: 84px; padding: 10px 20px; }
  .tbc-header__nav { display: none; }
  .tbc-header__brand img { width: 160px; margin: 0; }
  .tbc-header__mobile { display: block; justify-self: end; position: relative; }
  .tbc-header__mobile summary {
    list-style: none; cursor: pointer; width: 44px; height: 44px;
    display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 6px;
  }
  .tbc-header__mobile summary::-webkit-details-marker { display: none; }
  .tbc-header__mobile summary span { display: block; width: 22px; height: 1.5px; background: var(--tbc-ink); }
  .tbc-header__mobile ul {
    position: absolute; right: 0; top: 52px; z-index: 40; min-width: 240px;
    background: var(--tbc-surface); border: 1px solid var(--tbc-line); padding: 8px 0;
  }
  .tbc-header__mobile li a { display: block; padding: 12px 20px; font-size: 15px; }
}

/* ── Footer ──────────────────────────────────────────────────────────────── */
.tbc-footer { background: var(--tbc-navy); color: var(--tbc-on-navy); padding: 50px 6% 26px; }
.tbc-footer a { color: var(--tbc-on-navy); }
.tbc-footer__top { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 50px; }
.tbc-footer__seal { display: flex; gap: 22px; align-items: center; }
.tbc-footer__seal img { width: 108px; height: 108px; flex-shrink: 0; }
/* 22 TAC 535.155: the brokerage name stays large (22px). */
.tbc-footer__brand { font-family: var(--tbc-serif); font-size: 22px; margin: 0 0 6px; }
.tbc-footer__tag { font-size: 14px; color: var(--tbc-on-navy-muted); }
.tbc-footer__contact { font-style: normal; font-size: 14px; color: var(--tbc-on-navy-muted); margin-top: 10px; line-height: 1.7; }
.tbc-footer__links { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; font-size: 14px; }
/* TREC notices: never smaller than 12pt (16px), on every page. */
.tbc-footer__trec {
  display: flex; flex-wrap: wrap; gap: 12px 36px;
  border-top: 1px solid #2A3A52; margin-top: 38px; padding-top: 20px;
}
.tbc-footer__trec a { font-size: 16px; text-decoration: underline; text-underline-offset: 4px; }
.tbc-footer__bottom {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 24px;
  border-top: 1px solid #2A3A52; margin-top: 18px; padding-top: 18px;
  font-size: 13px; color: var(--tbc-on-navy-muted);
}
.tbc-footer__bottom a { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 760px) {
  .tbc-footer__top { grid-template-columns: 1fr 1fr; gap: 25px; }
  .tbc-footer__top > :first-child { grid-column: 1 / -1; }
  .tbc-footer__seal img { width: 84px; height: 84px; }
  .tbc-footer__trec { flex-direction: column; }
}

/* ── Building blocks ─────────────────────────────────────────────────────── */
.tbc-wrap { max-width: 1340px; margin: 0 auto; padding: 64px 5%; }
.tbc-eyebrow {
  display: block; margin-bottom: 18px;
  font-size: 12px; font-weight: 500; letter-spacing: 0.19em; text-transform: uppercase;
  color: var(--tbc-walnut);
}
.tbc-eyebrow--light { color: #EADCC3; }
.tbc-muted { color: var(--tbc-muted); }
.tbc-lede { font-size: 18px; line-height: 1.6; margin: 20px 0; max-width: 560px; }
.tbc-caption { font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; margin-top: 30px; color: var(--tbc-walnut); }
.tbc-breadcrumb { font-size: 12px; color: var(--tbc-muted); margin-bottom: 24px; }
body.tbc .tbc-wrap h1, body.tbc .tbc-hero h1 { font-size: clamp(40px, 5vw, 64px); }
body.tbc .tbc-wrap h2, body.tbc .tbc-journey h2 { font-size: clamp(30px, 3.2vw, 46px); }
body.tbc .tbc-wrap h3 { font-size: 24px; }

.tbc-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 22px;
  min-height: 50px; padding: 14px 24px;
  background: var(--tbc-burgundy); color: #FFF9EF; border: 1px solid var(--tbc-burgundy);
  font-size: 14px; cursor: pointer;
}
.tbc-btn:hover { background: var(--tbc-burgundy-deep); opacity: 1; }
.tbc-btn--light { background: #F5EEE1; color: var(--tbc-burgundy); border-color: #F5EEE1; }
.tbc-btn--light:hover { background: #FFF; }
.tbc-text-link { display: inline-block; font-size: 14px; border-bottom: 1px solid currentColor; padding: 5px 0; }
.tbc-actions { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; margin-top: 28px; }

.tbc-section-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 30px; margin-bottom: 30px; }
.tbc-section-head p { color: var(--tbc-muted); max-width: 420px; }
.tbc-page-head p { margin: 18px 0 26px; max-width: 640px; color: var(--tbc-muted); }
.tbc-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 7%; align-items: start; }
.tbc-split { display: grid; grid-template-columns: 1fr 1fr; gap: 9%; align-items: center; border-top: 1px solid var(--tbc-line); }
.tbc-split p { margin-bottom: 18px; }
.tbc-note { margin-top: 50px; padding: 28px; border: 1px dashed var(--tbc-line); }
.tbc-note .tbc-eyebrow { margin-bottom: 8px; }

/* ── Home hero ───────────────────────────────────────────────────────────── */
.tbc-hero {
  display: grid; grid-template-columns: 1.15fr 0.85fr;
  margin: 20px 24px 0; background: var(--tbc-navy); color: var(--tbc-on-navy);
  min-height: 560px;
}
.tbc-hero__copy { padding: 64px 7% 64px; align-self: center; }
.tbc-hero h1 { max-width: 720px; color: var(--tbc-on-navy); }
.tbc-hero__copy > p { margin-top: 20px; max-width: 460px; color: #EDE7DE; font-size: 17px; }
.tbc-hero__micro { font-size: 13px !important; color: var(--tbc-on-navy-muted) !important; }
.tbc-hero__portrait { margin: 0; overflow: hidden; }
.tbc-hero__portrait img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.tbc-search { display: flex; margin-top: 30px; max-width: 585px; background: var(--tbc-surface); padding: 6px; border: 1px solid var(--tbc-line); }
.tbc-search input {
  flex: 1; min-width: 0; border: 0; background: none; padding: 14px; font: inherit; font-size: 16px; color: var(--tbc-ink);
}
.tbc-search input:focus { outline: none; }
.tbc-search:focus-within { outline: 3px solid #BD9A57; outline-offset: 3px; }

.tbc-service-strip { display: grid; grid-template-columns: repeat(3, 1fr); padding: 0 5.5%; border-bottom: 1px solid var(--tbc-line); }
.tbc-service-strip a { display: flex; justify-content: space-between; align-items: center; padding: 27px 25px; border-right: 1px solid var(--tbc-line); }
.tbc-service-strip a:first-child { padding-left: 0; }
.tbc-service-strip a:last-child { border-right: 0; }
.tbc-service-strip strong { display: block; font-family: var(--tbc-serif); font-size: 21px; font-weight: 400; }
.tbc-service-strip small { color: var(--tbc-muted); font-size: 14px; }
.tbc-arrow { font-size: 24px; margin-left: 18px; color: var(--tbc-burgundy); }

/* ── Live listing cards (home) ───────────────────────────────────────────── */
.tbc-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; }
.tbc-card { display: block; min-width: 0; }
.tbc-card__media { background: var(--tbc-wash); aspect-ratio: 3 / 2; overflow: hidden; display: grid; place-items: center; }
.tbc-card__media img { width: 100%; height: 100%; object-fit: cover; }
.tbc-card__nophoto { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--tbc-muted); }
.tbc-card__body { padding: 18px 0; border-bottom: 1px solid var(--tbc-line); }
.tbc-card__price { font-family: var(--tbc-serif); font-size: 26px; }
/* LAR IDX: the listing brokerage line is the SAME size as the card's other
   text (15px), never a recessed footnote. */
.tbc-card__addr, .tbc-card__meta, .tbc-card__courtesy { font-size: 15px; margin-top: 6px; }
.tbc-card__meta { color: var(--tbc-muted); }
.tbc-idx { margin-top: 28px; font-size: 13px; line-height: 1.6; color: var(--tbc-muted); max-width: 900px; }
.tbc-idx p + p { margin-top: 6px; }

/* ── Editorial / journey ─────────────────────────────────────────────────── */
.tbc-editorial { display: grid; grid-template-columns: 1fr 1fr; gap: 9%; align-items: center; }
.tbc-editorial__figure { margin: 0; }
.tbc-editorial__figure img { width: 100%; height: 460px; object-fit: cover; object-position: center 30%; }
.tbc-editorial__figure--seal { background: var(--tbc-navy); display: grid; place-items: center; height: 460px; }
.tbc-editorial__figure--seal img { width: 62%; height: auto; max-width: 340px; object-fit: contain; }
.tbc-editorial p { margin-bottom: 26px; }
.tbc-path-row { display: flex; justify-content: space-between; padding: 18px 0; border-top: 1px solid var(--tbc-line); }
.tbc-journey { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; padding: 56px 7%; background: var(--tbc-burgundy); color: #F8F0E4; }
.tbc-journey h2 { color: #F8F0E4; }
.tbc-journey p { color: #E5D8CC; margin-bottom: 20px; }

/* ── Steps, builder, about, FAQ, forms ───────────────────────────────────── */
.tbc-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 35px; }
.tbc-steps--stack { grid-template-columns: 1fr; gap: 0; }
.tbc-step { border-top: 1px solid var(--tbc-line); padding: 23px 0; }
.tbc-step__n { font-family: var(--tbc-serif); color: var(--tbc-walnut); font-size: 18px; }
.tbc-step h3 { margin: 16px 0 10px; }
.tbc-step p { color: var(--tbc-muted); }

.tbc-builder {
  display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 70px; align-items: center;
  background: var(--tbc-surface); border-top: 1px solid var(--tbc-line); border-bottom: 1px solid var(--tbc-line);
  padding: 64px max(5%, calc((100% - 1340px) / 2 + 67px));
}
.tbc-builder__logo { background: #FFF; border: 1px solid var(--tbc-line); padding: 48px; display: flex; align-items: center; justify-content: center; }
.tbc-builder__logo img { width: 100%; max-width: 380px; height: auto; }
.tbc-builder h2 { font-size: clamp(30px, 3.2vw, 46px); margin-bottom: 18px; }

.tbc-about { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 64px; align-items: center; }
.tbc-about__portrait { margin: 0; }
.tbc-about__portrait img { width: 100%; height: auto; }
/* 22 TAC 535.155: the brokerage name is at least half the agent name's size
   (h1 here is capped at 52px; this is 28px). */
.tbc-about__brokerage { font-family: var(--tbc-serif); font-size: 28px; color: var(--tbc-burgundy); margin-bottom: 14px; }
body.tbc .tbc-about h1 { font-size: clamp(38px, 4.2vw, 52px); }
.tbc-about__role { font-size: 12px; letter-spacing: 0.19em; text-transform: uppercase; color: var(--tbc-walnut); margin-top: 10px; }
.tbc-about p:not(.tbc-about__brokerage):not(.tbc-about__role) { margin-top: 16px; line-height: 1.7; max-width: 620px; }
.tbc-about__sign { font-family: var(--tbc-serif); font-style: italic; font-size: 20px; }

.tbc-faq { margin-top: 26px; }
.tbc-faq details { border-bottom: 1px solid var(--tbc-line); padding: 20px 0; }
.tbc-faq summary { cursor: pointer; font-family: var(--tbc-serif); font-size: 20px; line-height: 1.45; }
.tbc-faq details p { color: var(--tbc-muted); font-size: 15px; margin-top: 14px; }

.tbc-direct { display: flex; flex-direction: column; gap: 8px; font-style: normal; font-size: 16px; margin-top: 28px; }
.tbc-direct a { border-bottom: 1px solid var(--tbc-line); align-self: flex-start; }
.tbc-form-card { background: var(--tbc-surface); border: 1px solid var(--tbc-line); padding: 28px; }
.tbc-form-card .cif { margin-top: 0; }
body.tbc .tbc-form-card h2 { font-size: 26px; }
.tbc-notfound { min-height: 46vh; }

/* ── Shared consumer surfaces under this brand ───────────────────────────── */
/* The IDX listing brokerage line on a listing page (MlsAttribution, LAR). */
body.tbc .ldp-listedby { font-size: 15px; color: var(--tbc-ink); }

@media (max-width: 1100px) {
  .tbc-hero { grid-template-columns: 1fr 0.8fr; }
  .tbc-two-col, .tbc-about { gap: 40px; }
}
@media (max-width: 760px) {
  .tbc-wrap { padding: 42px 22px; }
  .tbc-hero { grid-template-columns: 1fr; margin: 12px 12px 0; }
  .tbc-hero__copy { padding: 42px 24px 36px; }
  .tbc-hero__portrait { max-height: 360px; }
  .tbc-search { flex-wrap: wrap; }
  .tbc-search .tbc-btn { width: 100%; }
  .tbc-service-strip { grid-template-columns: 1fr; padding: 0 22px; }
  .tbc-service-strip a, .tbc-service-strip a:first-child { padding: 18px 0; border-right: 0; border-bottom: 1px solid var(--tbc-line); }
  .tbc-section-head { flex-direction: column; align-items: flex-start; gap: 16px; }
  .tbc-cards, .tbc-steps, .tbc-two-col, .tbc-split, .tbc-editorial, .tbc-about, .tbc-builder, .tbc-journey {
    grid-template-columns: 1fr; gap: 28px;
  }
  .tbc-editorial__figure img { height: 320px; }
  .tbc-editorial__figure--seal { height: 300px; }
  .tbc-editorial__figure--seal img { height: auto; }
  .tbc-builder { padding: 42px 22px; }
  .tbc-builder__logo { padding: 28px; }
  .tbc-journey { padding: 40px 22px; }
  .tbc-form-card { padding: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  body.tbc * { transition: none !important; scroll-behavior: auto !important; }
}
