/* =====================================================================
   7 STREAMS COMMERCIAL GROUP — DESIGN SYSTEM v1.0
   Deep navy / cool neutral institutional system.
   Core structural pattern: sections alternate between DATA MODE
   (ruled tables, indexed grids, tight baseline, high density) and
   PHOTOGRAPHY MODE (full-bleed imagery, minimal type, breathing room).
   Never combine both modes at the same scroll position.
   ===================================================================== */

/* ------------------------------------------------------------------
   1. TOKENS
   ------------------------------------------------------------------ */
:root {
  /* Color */
  --c-navy: #0B1E3D;          /* primary dark, authority anchor */
  --c-charcoal: #1A1A1A;      /* typography-dominant sections */
  --c-black: #000000;         /* full dark-mode sections */
  --c-offwhite: #F0EFED;      /* light-mode canvas (cool, not cream) */
  --c-white: #FFFFFF;
  --c-slate: #2A5A8A;         /* secondary accent: CTAs hover, links, data highlights */
  --c-body: #333843;
  --c-border: #C7CCD1;
  --c-burgundy: #8C2020;      /* reserve accent — use sparingly, never default */

  /* Type
     Headlines: Neue Haas Grotesk Display Condensed Bold
     TODO: Self-host licensed Neue Haas Grotesk (or Suisse Int'l Condensed) woff2
           files in assets/fonts/ and uncomment @font-face blocks below.
     ASSUMPTION: Until licensed fonts are provided, "Inter Tight" (Google Fonts)
     is used as the condensed-grotesque display stand-in, with Inter for
     text/body per spec's universal fallback. */
  --f-display: "neue-haas-grotesk-display", "Suisse Intl Condensed", "Inter Tight", "Inter", -apple-system, sans-serif;
  --f-text: "neue-haas-grotesk-text", "Inter", -apple-system, sans-serif;

  --fs-h1: clamp(40px, 6vw, 72px);
  --fs-h2: clamp(30px, 4vw, 48px);
  --fs-h3: clamp(20px, 2.2vw, 26px);
  --fs-body: 16px;
  --fs-label: 11px;           /* spaced-caps category labels */
  --fs-stat: clamp(44px, 5vw, 68px);

  --lh-body: 1.7;
  --ls-label: 0.16em;

  /* Layout */
  --max-w: 1240px;
  --max-w-narrow: 820px;
  --pad-x: clamp(20px, 4vw, 48px);
  --sec-y: clamp(64px, 9vw, 128px);
  --sec-y-tight: clamp(40px, 6vw, 80px);

  /* Surfaces */
  --radius: 2px;              /* sharp, institutional — never pill */
  --shadow-card: 0 1px 12px rgba(0, 0, 0, 0.06);
  --hairline: 1px solid var(--c-border);

  /* Motion */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --t-fast: 180ms;
  --t-med: 320ms;
}

/* TODO: Licensed font self-hosting — uncomment when woff2 files are placed
@font-face {
  font-family: "neue-haas-grotesk-display";
  src: url("../fonts/NHaasGroteskDSPro-CondBd.woff2") format("woff2");
  font-weight: 700; font-display: swap;
}
@font-face {
  font-family: "neue-haas-grotesk-text";
  src: url("../fonts/NHaasGroteskTXPro-55Rg.woff2") format("woff2");
  font-weight: 400; font-display: swap;
}
*/

/* ------------------------------------------------------------------
   2. BASE
   ------------------------------------------------------------------ */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

body.sevenstreams {
  font-family: var(--f-text);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--c-body);
  background: var(--c-white);
  -webkit-font-smoothing: antialiased;
  margin: 0;
}

.s7-wrap { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--pad-x); }
.s7-wrap--narrow { max-width: var(--max-w-narrow); }

h1, h2, h3, h4 { margin: 0 0 0.5em; color: var(--c-charcoal); }
h1, .s7-h1 { font-family: var(--f-display); font-weight: 700; font-size: var(--fs-h1); line-height: 1.02; letter-spacing: -0.015em; text-transform: none; }
h2, .s7-h2 { font-family: var(--f-display); font-weight: 700; font-size: var(--fs-h2); line-height: 1.08; letter-spacing: -0.01em; }
h3, .s7-h3 { font-family: var(--f-text); font-weight: 600; font-size: var(--fs-h3); line-height: 1.3; }
p { margin: 0 0 1.2em; }
a { color: var(--c-slate); text-decoration: none; transition: color var(--t-fast) var(--ease); }
a:hover { color: var(--c-navy); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--c-slate); outline-offset: 2px;
}
img { max-width: 100%; height: auto; display: block; }

/* Spaced-caps section label */
.s7-label {
  display: block;
  font-family: var(--f-text);
  font-size: var(--fs-label);
  font-weight: 600;
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--c-slate);
  margin-bottom: 16px;
}

/* Section rhythm */
.s7-sec { padding: var(--sec-y) 0; }
.s7-sec--tight { padding: var(--sec-y-tight) 0; }
.s7-sec--white { background: var(--c-white); }
.s7-sec--offwhite { background: var(--c-offwhite); }
.s7-sec--navy { background: var(--c-navy); }
.s7-sec--black { background: var(--c-black); }
.s7-sec--navy h1, .s7-sec--navy h2, .s7-sec--navy h3,
.s7-sec--black h1, .s7-sec--black h2, .s7-sec--black h3 { color: var(--c-white); }
.s7-sec--navy p, .s7-sec--black p { color: rgba(255, 255, 255, 0.72); }

/* ------------------------------------------------------------------
   3. BUTTONS — navy base, slate hover, sharp corners
   ------------------------------------------------------------------ */
.s7-btn {
  display: inline-block;
  font-family: var(--f-text);
  font-weight: 600;
  font-size: 15px;
  letter-spacing: 0.02em;
  padding: 15px 30px;
  border-radius: var(--radius);
  border: 1px solid transparent;
  cursor: pointer;
  text-align: center;
  transition: background var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.s7-btn--primary { background: var(--c-navy); color: var(--c-white); }
.s7-btn--primary:hover { background: var(--c-slate); color: var(--c-white); }
.s7-btn--outline-white { background: transparent; color: var(--c-white); border-color: rgba(255, 255, 255, 0.85); }
.s7-btn--outline-white:hover { background: var(--c-white); color: var(--c-navy); }
.s7-btn--slate { background: var(--c-slate); color: var(--c-white); }
.s7-btn--slate:hover { background: var(--c-navy); color: var(--c-white); }
.s7-btn--outline-navy { background: transparent; color: var(--c-navy); border-color: var(--c-navy); }
.s7-btn--outline-navy:hover { background: var(--c-navy); color: var(--c-white); }

.s7-arrowlink {
  font-weight: 600; color: var(--c-slate); display: inline-flex; align-items: center; gap: 8px;
}
.s7-arrowlink .arr { transition: transform var(--t-fast) var(--ease); }
.s7-arrowlink:hover .arr { transform: translateX(5px); }

/* ------------------------------------------------------------------
   4. NAVIGATION
   ------------------------------------------------------------------ */
.s7-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  background: var(--c-navy);
  transition: box-shadow var(--t-med) var(--ease);
}
.s7-nav.is-scrolled { box-shadow: 0 2px 18px rgba(0, 0, 0, 0.35); }
.s7-nav__inner {
  max-width: var(--max-w); margin: 0 auto; padding: 0 var(--pad-x);
  display: flex; align-items: center; justify-content: space-between;
  min-height: 76px; gap: 24px;
}
.s7-nav__brand { display: flex; flex-direction: column; gap: 2px; }
.s7-nav__brand img {
  height: 44px; width: auto;
}
.s7-nav__powered {
  font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
}
.s7-nav__links { display: flex; align-items: center; gap: 28px; list-style: none; margin: 0; padding: 0; }
.s7-nav__links a {
  color: var(--c-white); font-size: 15px; font-weight: 500;
  border-bottom: 2px solid transparent; padding: 4px 0;
}
.s7-nav__links a:hover, .s7-nav__links a.is-active { color: var(--c-white); border-bottom-color: var(--c-slate); }
.s7-nav__cta { flex-shrink: 0; }
.s7-nav .s7-btn--primary { border: 1px solid rgba(255, 255, 255, 0.35); padding: 11px 22px; }
.s7-nav .s7-btn--primary:hover { border-color: var(--c-slate); }

.s7-nav__toggle {
  display: none; background: none; border: 0; cursor: pointer; padding: 8px;
}
.s7-nav__toggle span {
  display: block; width: 24px; height: 2px; background: var(--c-white); margin: 5px 0;
  transition: transform var(--t-fast) var(--ease), opacity var(--t-fast) var(--ease);
}

@media (max-width: 960px) {
  .s7-nav__toggle { display: block; }
  .s7-nav__links {
    position: absolute; top: 100%; left: 0; right: 0;
    background: var(--c-navy); flex-direction: column; align-items: flex-start;
    padding: 20px var(--pad-x) 28px; gap: 18px; display: none;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
  }
  .s7-nav__links.is-open { display: flex; }
  .s7-nav.is-open .s7-nav__toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .s7-nav.is-open .s7-nav__toggle span:nth-child(2) { opacity: 0; }
  .s7-nav.is-open .s7-nav__toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
}
/* Offset for fixed nav */
.s7-nav-offset { height: 76px; }

/* ------------------------------------------------------------------
   5. HERO — photography mode
   ------------------------------------------------------------------ */
.s7-hero {
  position: relative; min-height: 90vh;
  display: flex; align-items: center; justify-content: center;
  background-size: cover; background-position: center;
  text-align: center;
}
.s7-hero::before {
  content: ""; position: absolute; inset: 0;
  background: rgba(11, 30, 61, 0.72);
}
.s7-hero__content { position: relative; z-index: 2; max-width: 900px; padding: 120px var(--pad-x); }
.s7-hero__pre {
  font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase;
  color: #6E9CC9; /* slate lightened one step for AA contrast on navy overlay */
  font-weight: 600; margin-bottom: 22px; display: block;
}
.s7-hero h1 { color: var(--c-white); margin-bottom: 20px; }
.s7-hero__sub { font-size: clamp(17px, 2vw, 20px); color: rgba(255, 255, 255, 0.7); max-width: 640px; margin: 0 auto 36px; }
.s7-hero__ctas { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; margin-bottom: 44px; }
.s7-hero__paths { display: flex; gap: clamp(20px, 4vw, 48px); justify-content: center; flex-wrap: wrap; }
.s7-hero__paths a { color: var(--c-white); font-weight: 600; font-size: 15px; opacity: 0.9; }
.s7-hero__paths a:hover { opacity: 1; color: #6E9CC9; }

/* Interior page hero (navy, no photo) */
.s7-pagehero { background: var(--c-navy); padding: 120px 0 72px; }
.s7-pagehero h1 { color: var(--c-white); }
.s7-pagehero .s7-crumbs { font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.5); margin-bottom: 18px; }
.s7-pagehero .s7-crumbs a { color: rgba(255,255,255,0.7); }
.s7-pagehero p { color: rgba(255, 255, 255, 0.72); font-size: 18px; max-width: 640px; }

/* ------------------------------------------------------------------
   6. STATS BAND — data mode
   ------------------------------------------------------------------ */
.s7-stats { background: var(--c-navy); border-top: 1px solid rgba(255,255,255,0.08); }
.s7-stats__grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  max-width: var(--max-w); margin: 0 auto;
}
.s7-stat {
  padding: clamp(36px, 5vw, 64px) 24px; text-align: center;
  border-left: 1px solid var(--c-slate);
}
.s7-stat:first-child { border-left: 0; }
.s7-stat__num {
  font-family: var(--f-display); font-weight: 700; font-size: var(--fs-stat);
  color: #6E9CC9; line-height: 1; display: block; margin-bottom: 10px;
  font-variant-numeric: tabular-nums;
}
.s7-stat__lbl {
  font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase;
  color: rgba(255, 255, 255, 0.65); font-weight: 600;
}
@media (max-width: 860px) {
  .s7-stats__grid { grid-template-columns: repeat(2, 1fr); }
  .s7-stat:nth-child(3) { border-left: 0; }
  .s7-stat:nth-child(n+3) { border-top: 1px solid var(--c-slate); }
}

/* ------------------------------------------------------------------
   7. PATHWAY CARDS (2x2 navy grid)
   ------------------------------------------------------------------ */
.s7-paths-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 780px) { .s7-paths-grid { grid-template-columns: 1fr; } }
.s7-pathcard {
  background: var(--c-navy); border-radius: var(--radius);
  padding: clamp(28px, 3.4vw, 44px); color: var(--c-white); display: block;
  transition: background var(--t-fast) var(--ease);
}
.s7-pathcard:hover { background: #0F2851; color: var(--c-white); }
.s7-pathcard__icon { display: inline-block; width: 40px; height: 40px; margin-bottom: 20px; color: #6E9CC9; }
.s7-pathcard__icon svg { width: 100%; height: 100%; stroke: currentColor; fill: none; stroke-width: 1.5; }
.s7-pathcard h3 { color: var(--c-white); margin-bottom: 6px; }
.s7-pathcard__svc { font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; color: #6E9CC9; font-weight: 600; display: block; margin-bottom: 14px; }
.s7-pathcard p { color: rgba(255, 255, 255, 0.65); font-size: 15px; margin-bottom: 18px; }
.s7-pathcard .s7-arrowlink { color: #6E9CC9; }

/* ------------------------------------------------------------------
   8. LISTING TILES — hover-reveal metadata (signature interaction)
   ------------------------------------------------------------------ */
.s7-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
@media (max-width: 980px) { .s7-tiles { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .s7-tiles { grid-template-columns: 1fr; } }

.s7-tile {
  position: relative; aspect-ratio: 4 / 3; overflow: hidden;
  border-radius: var(--radius); background: var(--c-navy); display: block;
}
.s7-tile__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform var(--t-med) var(--ease); }
.s7-tile:hover .s7-tile__img { transform: scale(1.035); }
/* Placeholder tile face (used where no property photography provided yet) */
.s7-tile--ph { background: linear-gradient(160deg, #0B1E3D 0%, #13294e 55%, #1A1A1A 100%); }
.s7-tile--ph::after {
  content: "Property photography pending"; position: absolute; top: 16px; left: 16px;
  font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255,255,255,0.35);
}
.s7-tile__meta {
  position: absolute; inset: auto 0 0 0; padding: 22px;
  background: linear-gradient(to top, rgba(11, 30, 61, 0.96), rgba(11, 30, 61, 0.6) 70%, transparent);
  transform: translateY(calc(100% - 62px));
  transition: transform var(--t-med) var(--ease);
  color: var(--c-white);
}
.s7-tile:hover .s7-tile__meta, .s7-tile:focus-visible .s7-tile__meta { transform: translateY(0); }
.s7-tile__badge {
  display: inline-block; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
  font-weight: 700; padding: 5px 10px; border-radius: var(--radius);
  background: var(--c-slate); color: var(--c-white); margin-bottom: 10px;
}
.s7-tile__addr { font-weight: 600; font-size: 17px; display: block; }
.s7-tile__specs { font-size: 13px; color: rgba(255, 255, 255, 0.7); display: block; margin: 6px 0 12px; }
.s7-tile__cta { font-size: 13px; font-weight: 700; color: #6E9CC9; letter-spacing: 0.06em; text-transform: uppercase; }
@media (hover: none) {
  /* Touch devices: metadata always visible */
  .s7-tile__meta { transform: translateY(0); }
}

/* ------------------------------------------------------------------
   9. TRANSACTION INDEX — data mode deal-history table
   ------------------------------------------------------------------ */
.s7-txlist { border-top: var(--hairline); }
.s7-txrow {
  display: grid;
  grid-template-columns: 84px 2.2fr 1fr 0.9fr 0.8fr 0.9fr;
  gap: 20px; align-items: center;
  padding: 18px 0; border-bottom: var(--hairline);
  font-size: 14px; color: var(--c-body);
}
.s7-txrow__thumb {
  width: 84px; height: 58px; border-radius: var(--radius); overflow: hidden;
  background: linear-gradient(150deg, #0B1E3D, #1A1A1A);
}
.s7-txrow__thumb img { width: 100%; height: 100%; object-fit: cover; }
.s7-txrow__addr { font-weight: 600; color: var(--c-charcoal); }
.s7-txrow__addr small { display: block; font-weight: 400; color: var(--c-body); font-size: 12px; }
.s7-txbadge {
  display: inline-block; font-size: 10px; letter-spacing: 0.12em; font-weight: 700;
  text-transform: uppercase; padding: 4px 9px; border-radius: var(--radius);
}
.s7-txbadge--sold { background: var(--c-navy); color: #fff; }
.s7-txbadge--leased { background: var(--c-slate); color: #fff; }
.s7-txbadge--acquired { background: var(--c-charcoal); color: #fff; }
.s7-txrow__num { font-variant-numeric: tabular-nums; }
@media (max-width: 820px) {
  .s7-txrow { grid-template-columns: 64px 1fr auto; row-gap: 6px; }
  .s7-txrow > :nth-child(4), .s7-txrow > :nth-child(5), .s7-txrow > :nth-child(6) { grid-column: 2 / -1; }
}

/* Transactions gallery cards (filterable page) */
.s7-txcard { background: var(--c-white); border: var(--hairline); border-radius: var(--radius); overflow: hidden; }
.s7-sec--offwhite .s7-txcard { border: 0; box-shadow: var(--shadow-card); }
.s7-txcard__media { aspect-ratio: 16 / 10; background: linear-gradient(150deg, #0B1E3D, #16305c 60%, #1A1A1A); position: relative; }
.s7-txcard__media::after {
  content: "Photo pending"; position: absolute; top: 12px; right: 12px;
  font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255,255,255,0.35);
}
.s7-txcard__body { padding: 20px 22px 24px; }
.s7-txcard__badges { display: flex; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.s7-txcard__badges .asset { background: var(--c-offwhite); color: var(--c-navy); border: var(--hairline); }
.s7-txcard h3 { font-size: 17px; margin-bottom: 4px; }
.s7-txcard__meta { font-size: 13px; color: var(--c-body); margin-bottom: 10px; }
.s7-txcard__outcome { font-size: 14px; color: var(--c-body); margin: 0; }

/* Filter bar */
.s7-filters { display: flex; flex-wrap: wrap; gap: 24px; margin-bottom: 36px; }
.s7-filters__group { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.s7-filters__lbl { font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; font-weight: 600; color: var(--c-body); margin-right: 4px; }
.s7-chip {
  font-size: 13px; font-weight: 600; padding: 8px 14px;
  border: var(--hairline); border-radius: var(--radius);
  background: var(--c-white); color: var(--c-body); cursor: pointer;
  transition: all var(--t-fast) var(--ease);
}
.s7-chip:hover { border-color: var(--c-slate); color: var(--c-slate); }
.s7-chip.is-active { background: var(--c-navy); border-color: var(--c-navy); color: var(--c-white); }

/* ------------------------------------------------------------------
   10. TESTIMONIALS
   ------------------------------------------------------------------ */
.s7-quotes { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (max-width: 780px) { .s7-quotes { grid-template-columns: 1fr; } }
.s7-quote {
  background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.1);
  border-left: 3px solid var(--c-slate);
  border-radius: var(--radius); padding: clamp(26px, 3vw, 40px);
}
.s7-quote__mark { font-family: var(--f-display); font-size: 56px; line-height: 0.5; color: var(--c-slate); display: block; margin: 14px 0 22px; }
.s7-quote p { color: rgba(255, 255, 255, 0.85); font-size: 17px; }
.s7-quote cite { display: block; font-style: normal; margin-top: 18px; }
.s7-quote cite strong { color: var(--c-white); display: block; font-size: 15px; }
.s7-quote cite span { color: rgba(255, 255, 255, 0.55); font-size: 13px; }

/* ------------------------------------------------------------------
   11. TEXAS MAP + MARKET CARDS
   ------------------------------------------------------------------ */
.s7-mapsec { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
@media (max-width: 900px) { .s7-mapsec { grid-template-columns: 1fr; } }
.s7-txmap svg { width: 100%; height: auto; }
.s7-txmap .tx-outline { fill: var(--c-offwhite); stroke: var(--c-border); stroke-width: 2; }
.s7-txmap .tx-node { fill: var(--c-slate); transition: r var(--t-fast) var(--ease); cursor: pointer; }
.s7-txmap a:hover .tx-node { fill: var(--c-navy); }
.s7-txmap .tx-nodelbl { font-family: var(--f-text); font-size: 13px; font-weight: 600; fill: var(--c-charcoal); }
.s7-marketcards { display: grid; gap: 14px; }
.s7-marketcard {
  border: var(--hairline); border-radius: var(--radius); padding: 20px 22px;
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
  transition: border-color var(--t-fast) var(--ease); background: var(--c-white);
}
.s7-marketcard:hover { border-color: var(--c-slate); }
.s7-marketcard h3 { font-size: 17px; margin: 0 0 2px; }
.s7-marketcard p { font-size: 13px; margin: 0; color: var(--c-body); }

/* ------------------------------------------------------------------
   12. SPLIT / eXp SECTION
   ------------------------------------------------------------------ */
.s7-split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 80px); align-items: center; }
@media (max-width: 860px) { .s7-split { grid-template-columns: 1fr; } }
.s7-checks { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.s7-checks li { display: flex; gap: 14px; align-items: flex-start; font-size: 16px; color: var(--c-body); }
.s7-checks .ck {
  flex-shrink: 0; width: 22px; height: 22px; margin-top: 2px;
  border-radius: var(--radius); background: var(--c-slate); color: var(--c-white);
  display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700;
}

/* eXp Realty + eXp Commercial logo pair (National Reach section) — small
   "partner credential strip" below the checklist, left-aligned with it,
   always a single side-by-side row (never stacked, even on mobile). Both
   images pre-trimmed to tight bounding boxes with matching aspect ratios
   (~1.93:1 / 1.96:1), so a shared height reads as a balanced matched pair. */
.s7-exp-logos { display: flex; align-items: center; gap: 24px; }
.s7-exp-logos img { height: 40px; width: auto; display: block; flex-shrink: 0; }
.s7-exp-logos--muted img { opacity: 0.85; }
@media (max-width: 480px) {
  .s7-exp-logos { gap: 18px; }
  .s7-exp-logos img { height: 30px; }
}

/* ------------------------------------------------------------------
   13. FORMS — Gravity/HubSpot-compatible field styling
   ------------------------------------------------------------------ */
.s7-form { display: grid; gap: 16px; }
.s7-form--2col { grid-template-columns: 1fr 1fr; }
@media (max-width: 640px) { .s7-form--2col { grid-template-columns: 1fr; } }
.s7-field { display: grid; gap: 6px; }
.s7-field--full { grid-column: 1 / -1; }
.s7-field label { font-size: 13px; font-weight: 600; color: var(--c-charcoal); }
.s7-field label .req { color: var(--c-burgundy); }
.s7-field input, .s7-field select, .s7-field textarea {
  font-family: var(--f-text); font-size: 16px; color: var(--c-charcoal);
  padding: 14px 14px; /* large touch targets */
  border: var(--hairline); border-radius: var(--radius); background: var(--c-white);
  transition: border-color var(--t-fast) var(--ease); width: 100%; box-sizing: border-box;
}
.s7-field input:focus, .s7-field select:focus, .s7-field textarea:focus { border-color: var(--c-slate); outline: none; }
.s7-form .s7-btn { grid-column: 1 / -1; justify-self: start; }
.s7-privacy { grid-column: 1 / -1; font-size: 12px; color: var(--c-body); opacity: 0.75; margin: 4px 0 0; }

/* ------------------------------------------------------------------
   13b. HUBSPOT FORMS (v3 classic / raw-HTML embed, switched from v4
   iframe 2026-07-16) — targets HubSpot's own native form markup
   (.hs-form-field, .hs-input, .hs-button, etc.), reusing the same
   tokens as the .s7-field system above so classic-embedded HubSpot
   forms read as part of the site rather than a dropped-in widget.
   Apply via cssClass: "s7-hsform" in hbspt.forms.create(); add
   "s7-hsform--invert" too for forms placed directly on a navy/dark
   section with no white card wrapper.
   ------------------------------------------------------------------ */
.s7-hsform.hs-form { display: grid; gap: 16px; }
.s7-hsform .hs-form-field { display: grid; gap: 6px; }
.s7-hsform .hs-form-field > label { font-size: 13px; font-weight: 600; color: var(--c-charcoal); }
.s7-hsform .hs-form-field .hs-form-required { color: var(--c-burgundy); }
.s7-hsform .input { width: 100%; }
.s7-hsform .hs-input:not([type="checkbox"]):not([type="radio"]) {
  font-family: var(--f-text); font-size: 16px; color: var(--c-charcoal);
  padding: 14px 14px;
  border: var(--hairline); border-radius: var(--radius); background: var(--c-white);
  transition: border-color var(--t-fast) var(--ease); width: 100%; box-sizing: border-box;
}
.s7-hsform textarea.hs-input { min-height: 110px; }
.s7-hsform .hs-input:focus { border-color: var(--c-slate); outline: none; }
.s7-hsform .hs-error-msgs { list-style: none; margin: 4px 0 0; padding: 0; }
.s7-hsform .hs-error-msgs label { font-size: 12px; color: var(--c-burgundy); }
.s7-hsform .legal-consent-container, .s7-hsform .hs-richtext {
  font-size: 12px; color: var(--c-body); opacity: 0.75; line-height: 1.5;
}
.s7-hsform .legal-consent-container label { font-size: 12px; font-weight: 400; display: flex; gap: 8px; align-items: flex-start; }
.s7-hsform .hs_submit { margin-top: 4px; }
.s7-hsform input.hs-button {
  display: inline-block; font-family: var(--f-text); font-weight: 600; font-size: 15px;
  letter-spacing: 0.02em; padding: 15px 30px; border-radius: var(--radius);
  border: 1px solid transparent; cursor: pointer;
  background: var(--c-navy); color: var(--c-white);
  transition: background var(--t-fast) var(--ease);
}
.s7-hsform input.hs-button:hover { background: var(--c-slate); }
.s7-hsform .submitted-message { font-size: 16px; color: var(--c-charcoal); }

/* Dark-band variant: form sits directly on a navy section, no white card */
.s7-hsform--invert .hs-form-field > label { color: rgba(255, 255, 255, 0.85); }
.s7-hsform--invert .hs-input:not([type="checkbox"]):not([type="radio"]) {
  background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.3); color: var(--c-white);
}
.s7-hsform--invert .hs-input:not([type="checkbox"]):not([type="radio"])::placeholder { color: rgba(255, 255, 255, 0.5); }
.s7-hsform--invert .hs-input:focus { border-color: var(--c-white); }
.s7-hsform--invert .legal-consent-container, .s7-hsform--invert .hs-richtext { color: rgba(255, 255, 255, 0.65); }
.s7-hsform--invert .legal-consent-container label { color: rgba(255, 255, 255, 0.85); }
.s7-hsform--invert .submitted-message { color: var(--c-white); }
.s7-hsform--invert input.hs-button { background: var(--c-slate); }
.s7-hsform--invert input.hs-button:hover { background: var(--c-white); color: var(--c-navy); }

/* Inline newsletter band form */
.s7-inlineform { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
.s7-inlineform input {
  font-size: 16px; padding: 14px 16px; min-width: 220px;
  border: 1px solid rgba(255, 255, 255, 0.3); border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.06); color: var(--c-white);
}
.s7-inlineform input::placeholder { color: rgba(255, 255, 255, 0.5); }

/* Segmented contact form switcher */
.s7-segtabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 32px; }
.s7-segpanel { display: none; }
.s7-segpanel.is-active { display: block; }

/* ------------------------------------------------------------------
   14. TEAM PARADE — horizontal full-height portraits
   ------------------------------------------------------------------ */
.s7-parade {
  display: flex; gap: 24px; overflow-x: auto; padding-bottom: 16px;
  scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
}
.s7-parade::-webkit-scrollbar { height: 6px; }
.s7-parade::-webkit-scrollbar-thumb { background: var(--c-border); border-radius: 3px; }
.s7-portrait { flex: 0 0 min(380px, 82vw); scroll-snap-align: start; }
.s7-portrait__img {
  aspect-ratio: 3 / 4; width: 100%; object-fit: cover; object-position: top center;
  border-radius: var(--radius); background: var(--c-offwhite); display: block;
}
.s7-portrait h3 { margin: 18px 0 2px; font-size: 20px; }
.s7-portrait__title { font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--c-slate); font-weight: 600; display: block; margin-bottom: 10px; }
.s7-portrait p { font-size: 14px; }

/* ------------------------------------------------------------------
   15. SERVICE HUB GRID
   ------------------------------------------------------------------ */
.s7-svcgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
@media (max-width: 980px) { .s7-svcgrid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .s7-svcgrid { grid-template-columns: 1fr; } }
.s7-svccard {
  border: var(--hairline); border-radius: var(--radius); padding: 26px 26px 24px;
  display: flex; flex-direction: column; gap: 10px; background: var(--c-white);
  transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
.s7-svccard:hover { border-color: var(--c-slate); box-shadow: var(--shadow-card); }
.s7-svccard__idx { font-family: var(--f-display); font-weight: 700; color: var(--c-border); font-size: 15px; letter-spacing: 0.06em; }
.s7-svccard h3 { font-size: 18px; margin: 0; }
.s7-svccard p { font-size: 14px; margin: 0; flex: 1; }

/* Numbered process steps */
.s7-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; counter-reset: step; }
@media (max-width: 900px) { .s7-steps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .s7-steps { grid-template-columns: 1fr; } }
.s7-step { border-top: 3px solid var(--c-slate); padding-top: 18px; }
.s7-step__num { font-family: var(--f-display); font-weight: 700; font-size: 34px; color: var(--c-navy); display: block; margin-bottom: 8px; }
.s7-step h3 { font-size: 17px; }
.s7-step p { font-size: 14px; margin: 0; }

/* ------------------------------------------------------------------
   16. PHOTOGRAPHY BREAK BAND (photography mode divider)
   ------------------------------------------------------------------ */
.s7-photoband {
  min-height: clamp(300px, 46vw, 520px);
  background-size: cover; background-position: center;
  position: relative;
}
.s7-photoband::before { content: ""; position: absolute; inset: 0; background: rgba(11, 30, 61, 0.35); }

/* ------------------------------------------------------------------
   17. FOOTER
   ------------------------------------------------------------------ */
.s7-footer { background: var(--c-navy); color: rgba(255, 255, 255, 0.7); padding: clamp(56px, 7vw, 88px) 0 0; }
.s7-footer__grid {
  display: grid; grid-template-columns: 1.4fr 1fr 1.1fr 0.9fr 1.1fr; gap: clamp(24px, 3.5vw, 48px);
  padding-bottom: clamp(40px, 5vw, 64px);
}
@media (max-width: 960px) { .s7-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .s7-footer__grid { grid-template-columns: 1fr; } }
.s7-footer img.footer-logo { height: 52px; width: auto; margin-bottom: 16px; }
.s7-footer__tag { font-family: var(--f-display); font-weight: 700; color: var(--c-white); font-size: 18px; letter-spacing: 0.01em; margin-bottom: 10px; }
.s7-footer h4 { color: var(--c-white); font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; margin-bottom: 18px; }
.s7-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.s7-footer a { color: rgba(255, 255, 255, 0.7); font-size: 14px; }
.s7-footer a:hover { color: var(--c-white); }
.s7-footer__contact li { font-size: 14px; }
.s7-social { display: flex; gap: 14px; margin-top: 18px; }
.s7-social a { display: inline-flex; width: 34px; height: 34px; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,0.25); border-radius: var(--radius); }
.s7-social a:hover { border-color: var(--c-slate); }
.s7-social svg { width: 16px; height: 16px; fill: currentColor; }
/* Light-background variant (About page, Market Insights) — same icon glyphs
   and sizing as the footer treatment, with a visible border and dark
   currentColor instead of the white-on-navy footer styling. */
.s7-social--dark a { border-color: var(--c-border); color: var(--c-slate); }
.s7-social--dark a:hover { border-color: var(--c-navy); color: var(--c-navy); }
.s7-footer__bar {
  border-top: 2px solid var(--c-slate);
  padding: 22px 0; font-size: 12px; color: rgba(255, 255, 255, 0.45);
}
.s7-footer__bar .s7-wrap { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }

/* ------------------------------------------------------------------
   18. LANDING PAGE TEMPLATE (no nav/footer)
   ------------------------------------------------------------------ */
.s7-lp { min-height: 100vh; display: grid; grid-template-columns: 1.1fr 1fr; }
@media (max-width: 900px) { .s7-lp { grid-template-columns: 1fr; } }
.s7-lp__pitch {
  background: var(--c-navy); color: var(--c-white);
  padding: clamp(48px, 7vw, 96px) clamp(24px, 5vw, 72px);
  display: flex; flex-direction: column; justify-content: center;
}
.s7-lp__pitch img.lp-logo { height: 48px; width: auto; align-self: flex-start; margin-bottom: clamp(32px, 5vw, 64px); }
.s7-lp__pitch h1 { color: var(--c-white); font-size: clamp(34px, 4.4vw, 56px); }
.s7-lp__pitch .sub { color: rgba(255, 255, 255, 0.72); font-size: 18px; max-width: 480px; }
.s7-lp__trust { margin-top: clamp(32px, 4vw, 56px); display: grid; gap: 14px; }
.s7-lp__trust li { display: flex; gap: 12px; align-items: baseline; list-style: none; color: rgba(255,255,255,0.8); font-size: 15px; }
.s7-lp__trust strong { font-family: var(--f-display); font-weight: 700; color: #6E9CC9; font-size: 22px; min-width: 88px; }
.s7-lp__formcol { background: var(--c-offwhite); padding: clamp(48px, 7vw, 96px) clamp(24px, 5vw, 72px); display: flex; align-items: center; }
.s7-lp__formcard { background: var(--c-white); border-radius: var(--radius); box-shadow: var(--shadow-card); padding: clamp(26px, 3vw, 44px); width: 100%; max-width: 560px; margin: 0 auto; }
.s7-lp__formcard h2 { font-size: 24px; }

/* ------------------------------------------------------------------
   19. UTILITIES
   ------------------------------------------------------------------ */
.s7-center { text-align: center; }
.s7-mt-0 { margin-top: 0; } .s7-mb-0 { margin-bottom: 0; }
.s7-mt-32 { margin-top: 32px; } .s7-mt-48 { margin-top: 48px; }
.s7-maxw-640 { max-width: 640px; } .s7-mx-auto { margin-left: auto; margin-right: auto; }
.s7-hide { display: none !important; }
.s7-iframe-wrap iframe { width: 100%; border: none; display: block; }

/* Kadence content-width neutralization inside full-bleed sections */
.sevenstreams .entry-content > * { max-width: none; }
.sevenstreams .content-area, .sevenstreams .site-container { padding: 0; }

/* ============================================================
   PHASE 2 ADDITIONS — market pages, blog, service sub-pages
   ============================================================ */

/* Market stat strip (inside pagehero) */
.s7-herostats{display:flex;flex-wrap:wrap;gap:0;margin-top:36px;border-top:1px solid rgba(255,255,255,0.18);}
.s7-herostats > div{flex:1 1 160px;padding:18px 24px 0 0;border-right:1px solid rgba(255,255,255,0.12);margin-right:24px;}
.s7-herostats > div:last-child{border-right:none;margin-right:0;}
.s7-herostats .n{display:block;font-family:var(--s7-font-display);font-weight:700;font-size:30px;line-height:1.1;color:#6E9CC9;letter-spacing:-0.01em;}
.s7-herostats .l{display:block;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:rgba(255,255,255,0.65);margin-top:6px;}
@media (max-width:700px){.s7-herostats > div{flex:1 1 45%;border-right:none;margin-right:0;padding-right:0;}}

/* Gradient pagehero for markets without photography — flagged placeholder */
.s7-pagehero--ph{background:linear-gradient(160deg,#0B1E3D 0%,#12294d 55%,#0a1830 100%);}

/* Submarket grid */
.s7-submkts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--s7-border);border:1px solid var(--s7-border);}
.s7-submkt{background:#fff;padding:26px 24px;}
.s7-submkt h3{font-size:17px;margin:0 0 8px;}
.s7-submkt p{font-size:14.5px;line-height:1.6;margin:0;color:var(--s7-body);}
.s7-submkt .tag{display:inline-block;font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--s7-slate);margin-bottom:10px;}
@media (max-width:960px){.s7-submkts{grid-template-columns:repeat(2,1fr);}}
@media (max-width:640px){.s7-submkts{grid-template-columns:1fr;}}

/* Asset class conditions table (data mode) */
.s7-assettbl{width:100%;border-collapse:collapse;margin-top:32px;border-top:2px solid var(--s7-navy);}
.s7-assettbl th{font-size:11px;letter-spacing:0.14em;text-transform:uppercase;text-align:left;color:var(--s7-slate);padding:14px 16px 10px 0;border-bottom:1px solid var(--s7-border);font-weight:600;}
.s7-assettbl td{padding:16px 16px 16px 0;border-bottom:1px solid var(--s7-border);font-size:15px;line-height:1.55;vertical-align:top;color:var(--s7-body);}
.s7-assettbl td:first-child{font-family:var(--s7-font-display);font-weight:700;color:var(--s7-navy);white-space:nowrap;font-size:16px;}
@media (max-width:760px){.s7-assettbl thead{display:none;}.s7-assettbl td{display:block;padding:6px 0;border-bottom:none;}.s7-assettbl tr{display:block;border-bottom:1px solid var(--s7-border);padding:14px 0;}}

/* Blog index cards */
.s7-bloggrid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:36px;}
.s7-postcard{background:#fff;border:1px solid var(--s7-border);border-radius:2px;display:flex;flex-direction:column;}
.s7-postcard__band{height:8px;background:var(--s7-navy);}
.s7-postcard__body{padding:26px 24px 28px;display:flex;flex-direction:column;flex:1;}
.s7-postcard__meta{font-size:11px;letter-spacing:0.13em;text-transform:uppercase;color:var(--s7-slate);margin-bottom:12px;}
.s7-postcard h2,.s7-postcard h3{font-size:19px;line-height:1.3;margin:0 0 12px;}
.s7-postcard h2 a,.s7-postcard h3 a{color:var(--s7-navy);text-decoration:none;}
.s7-postcard h2 a:hover,.s7-postcard h3 a:hover{color:var(--s7-slate);}
.s7-postcard p{font-size:14.5px;line-height:1.65;color:var(--s7-body);margin:0 0 18px;flex:1;}
@media (max-width:960px){.s7-bloggrid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:640px){.s7-bloggrid{grid-template-columns:1fr;}}

/* Single post article */
.s7-article{max-width:760px;margin:0 auto;padding:64px 24px 80px;}
.s7-article__meta{font-size:12px;letter-spacing:0.12em;text-transform:uppercase;color:var(--s7-slate);margin-bottom:28px;}
.s7-article h2{font-size:28px;margin:44px 0 16px;}
.s7-article h3{font-size:20px;margin:32px 0 12px;}
.s7-article p,.s7-article li{font-size:16.5px;line-height:1.75;color:var(--s7-body);}
.s7-article ul,.s7-article ol{padding-left:22px;}
.s7-article blockquote{border-left:3px solid var(--s7-slate);margin:28px 0;padding:4px 0 4px 22px;font-size:17px;color:var(--s7-navy);}
.s7-article .s7-postcta{background:var(--s7-navy);border-radius:2px;padding:34px 32px;margin-top:52px;}
.s7-article .s7-postcta h3{color:#fff;margin:0 0 10px;}
.s7-article .s7-postcta p{color:rgba(255,255,255,0.78);font-size:15px;margin:0 0 20px;}

/* ============================================================
   PHASE 3 ADDITIONS — case studies, calculator, map, gate
   ============================================================ */

/* Case study layout: metadata sidebar + narrative */
.s7-case{display:grid;grid-template-columns:300px 1fr;gap:48px;align-items:start;}
.s7-case__meta{position:sticky;top:96px;border:1px solid var(--s7-border);border-radius:2px;background:#fff;}
.s7-case__meta h3{font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--s7-slate);margin:0;padding:16px 20px;border-bottom:1px solid var(--s7-border);}
.s7-case__meta dl{margin:0;padding:8px 20px 16px;}
.s7-case__meta dt{font-size:11px;letter-spacing:0.13em;text-transform:uppercase;color:var(--s7-slate);margin-top:14px;}
.s7-case__meta dd{margin:4px 0 0;font-family:var(--s7-font-display);font-weight:700;font-size:17px;color:var(--s7-navy);}
.s7-case__body h2{font-size:26px;margin:36px 0 14px;}
.s7-case__body p{font-size:16px;line-height:1.75;color:var(--s7-body);}
@media (max-width:900px){.s7-case{grid-template-columns:1fr;}.s7-case__meta{position:static;}}

/* Cap rate calculator */
.s7-calc{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;}
.s7-calc__panel{background:#fff;border:1px solid var(--s7-border);border-radius:2px;padding:30px 28px;}
.s7-calc label{display:block;font-size:11px;letter-spacing:0.13em;text-transform:uppercase;color:var(--s7-slate);margin:18px 0 6px;font-weight:600;}
.s7-calc label:first-of-type{margin-top:0;}
.s7-calc input[type=text],.s7-calc input[type=number],.s7-calc select{width:100%;padding:12px 14px;font-size:16px;border:1px solid var(--s7-border);border-radius:2px;font-family:inherit;color:var(--s7-charcoal);background:#fff;}
.s7-calc input:focus,.s7-calc select:focus{outline:2px solid var(--s7-slate);outline-offset:-1px;}
.s7-calc__result{background:var(--s7-navy);border-radius:2px;padding:30px 28px;color:#fff;}
.s7-calc__result .big{font-family:var(--s7-font-display);font-weight:800;font-size:44px;line-height:1.05;color:#6E9CC9;display:block;margin:6px 0 2px;}
.s7-calc__result .lbl{font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:rgba(255,255,255,0.65);}
.s7-calc__result p{color:rgba(255,255,255,0.78);font-size:14px;line-height:1.6;}
.s7-sens{width:100%;border-collapse:collapse;margin-top:20px;}
.s7-sens th,.s7-sens td{padding:9px 10px;font-size:13.5px;border-bottom:1px solid rgba(255,255,255,0.14);text-align:right;color:rgba(255,255,255,0.85);}
.s7-sens th{color:#6E9CC9;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;font-size:11px;}
.s7-sens td:first-child,.s7-sens th:first-child{text-align:left;}
.s7-sens tr.hl td{color:#fff;font-weight:600;background:rgba(42,90,138,0.35);}
@media (max-width:860px){.s7-calc{grid-template-columns:1fr;}}

/* Interactive Texas map enhancements */
.s7-txmap .tx-node{transition:r .18s ease, fill .18s ease;cursor:pointer;}
.s7-txmap a:hover .tx-node,.s7-txmap a:focus .tx-node,.s7-txmap a.is-active .tx-node{r:12;fill:#6E9CC9;}
.s7-txmap a:focus{outline:none;}
.s7-txmap a:focus .tx-nodelbl{text-decoration:underline;}
.s7-txmap .tx-pulse{animation:s7pulse 2.4s ease-out infinite;transform-origin:center;pointer-events:none;}
@keyframes s7pulse{0%{opacity:.55;r:9;}70%{opacity:0;r:22;}100%{opacity:0;r:22;}}
@media (prefers-reduced-motion:reduce){.s7-txmap .tx-pulse{animation:none;opacity:0;}}
.s7-marketcard.is-active{border-color:var(--s7-slate);box-shadow:0 1px 12px rgba(42,90,138,0.18);}

/* Off-market gate */
.s7-gate{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;}
.s7-gate__form{background:#fff;border:1px solid var(--s7-border);border-radius:2px;padding:32px 30px;}
.s7-gate__form h3{margin-top:0;}
@media (max-width:860px){.s7-gate{grid-template-columns:1fr;}}

/* ============================================================
   PHASE 3 — mobile audit fixes (375px / 390px / 768px review)
   ============================================================ */
/* Very small screens: tighten hero stat strip and page hero padding */
@media (max-width:420px){
	.s7-pagehero h1{font-size:30px;line-height:1.12;}
	.s7-herostats .n{font-size:24px;}
	.s7-calc__result .big{font-size:34px;}
}
/* Guard against horizontal scroll from wide inline content */
.s7-sec{overflow-x:clip;}
/* Case study metadata values wrap rather than overflow */
.s7-case__meta dd{overflow-wrap:anywhere;}
/* Texas map labels remain legible when SVG scales down */
@media (max-width:640px){.s7-txmap .tx-nodelbl{font-size:15px;}}
/* Sensitivity table fits narrow result panel */
@media (max-width:400px){.s7-sens th,.s7-sens td{padding:8px 6px;font-size:12.5px;}}

/* --- Footer nested market groups (correction v2) --- */
.s7-ftr-mkts > li > a { color: var(--c-white); font-weight: 600; }
.s7-ftr-sub { margin-top: 8px !important; padding-left: 12px !important; border-left: 1px solid rgba(255, 255, 255, 0.18); gap: 7px !important; }
.s7-ftr-sub a { font-size: 13px; }

/* --- Transactions CPT gallery (real data, July 2026) --- */
.s7-txcard__media--photo { background: var(--c-charcoal); }
.s7-txcard__media--photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.s7-txcard__media--photo::after { display: none; }
.s7-txbadge--sublease { background: var(--c-slate); color: #fff; }

/* --- About page: bring principals section above the fold on desktop (July 2026) ---
   Scoped to about.html only (compact modifiers, not the shared .s7-pagehero/.s7-photoband
   rules) and gated to tablet+/desktop so the mobile portrait-carousel layout is untouched. */
@media (min-width: 861px) {
	.s7-pagehero--compact { padding: 88px 0 40px; }
	.s7-photoband--compact { min-height: clamp(180px, 22vw, 260px); }
	.s7-team-sec { padding-top: clamp(40px, 5vw, 64px); }
	/* Narrow the wrap to a column sized to the two fixed-width (380px) cards, rather
	   than the shared 1240px .s7-wrap, so it reads as a centered column like the "Why
	   7 Streams Exists" section below it. Card size is untouched, so this can't match
	   --max-w-narrow (820px) exactly — two 380px cards + gap need ~880px including side
	   padding.
	   The other sections on this page look centered on the page even though their text
	   is left-aligned, because their content fills the full width of its container
	   (paragraph text wraps edge-to-edge in "Why 7 Streams Exists"; the 4-up grid in
	   "The 7 Streams Standard" spans the whole 1240px wrap). The two portraits here are
	   fixed-width and don't fill this 940px column, so simply left-aligning them (as
	   those other sections do) leaves dead space on the column's right that reads as the
	   whole block being shifted left of the page's true center. Centering the label,
	   heading, parade, and social row within the column is what actually reproduces
	   "looks centered on the page" for content that doesn't stretch to fill its
	   container. Left off mobile so the horizontal-scroll carousel keeps its natural
	   start edge. */
	.s7-team-sec .s7-wrap { max-width: 940px; }
	.s7-team-sec > .s7-wrap > .s7-label,
	.s7-team-sec > .s7-wrap > h2 { text-align: center; }
	.s7-team-sec .s7-parade { justify-content: center; }
	.s7-team-sec .s7-social { justify-content: center; }
}