/* Houston-Area Locations page (slug: houston-area; parent: locations) */
/* Was locations.css; re-scoped body.page-locations -> body.page-houston-area when
   the new Texas overview took over /locations/ (2026-05-24). */
/* Dependencies: colors_and_type.css (design tokens); .hub-subnav lives in nav.css. */

body.page-houston-area {
  font-family: var(--font-sans);
  color: var(--navy-500);
  -webkit-font-smoothing: antialiased;
  /* Standard sitewide FIXED page gradient. The legacy SCROLL-attached
     navy-ending ombré (2026-06-04) is RETIRED 2026-06-05 — the page now uses
     the unified Case-B closer treatment (.hub-cta = flat navy + ombré band)
     for the footer dissolve, so the body gradient returns to fixed like the
     rest of the site. */
  background: var(--grad-page-v3) no-repeat;
  background-attachment: fixed;
  min-height: 100vh;
}

/* Hero — pulled up tight now that the sub-nav strip sits above it. */
body.page-houston-area .hub-hero { padding: clamp(28px, 3vw, 44px) 32px clamp(24px, 3vw, 40px); text-align: center; }
body.page-houston-area .hub-hero__inner { max-width: 880px; margin: 0 auto; }
body.page-houston-area .hub-hero__eyebrow { font-family: var(--font-accent); font-weight: 700; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--pink-600); margin: 0 0 14px; }
body.page-houston-area .hub-hero__title { font-family: var(--font-display); font-weight: 800; font-size: clamp(2.2rem, 5vw, 3.6rem); color: var(--navy-700); line-height: 1.08; letter-spacing: -0.022em; margin: 0 0 18px; }
body.page-houston-area .hub-hero__title em { font-style: italic; color: var(--pink-500); font-weight: 700; }
body.page-houston-area .hub-hero__lede { font-family: var(--font-sans); font-size: clamp(1.02rem, 1.2vw, 1.18rem); line-height: 1.6; color: var(--navy-500); margin: 0; }

/* Grid of office cards */
body.page-houston-area .hub-grid-wrap { padding: clamp(24px, 4vw, 56px) 24px clamp(60px, 8vw, 96px); }
body.page-houston-area .hub-grid { max-width: 1240px; margin: 0 auto; display: grid; gap: 22px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
body.page-houston-area .hub-card { display: flex; flex-direction: column; padding: 28px 28px 24px; background: #fff; border-radius: 22px; box-shadow: 0 1px 3px rgba(31,45,64,0.05), 0 14px 36px rgba(31,45,64,0.08); text-decoration: none; color: inherit; transition: transform .2s ease, box-shadow .2s ease; border: 1px solid rgba(41,52,72,0.06); position: relative; overflow: hidden; }
body.page-houston-area .hub-card:hover { transform: translateY(-3px); box-shadow: 0 2px 5px rgba(31,45,64,0.06), 0 22px 48px rgba(31,45,64,0.12); }
body.page-houston-area .hub-card:hover .hub-card__title { color: var(--pink-500); }
body.page-houston-area .hub-card:hover .hub-card__cta { color: var(--pink-500); }
body.page-houston-area .hub-card__chip { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px 4px; border-radius: 999px; background: rgba(194,99,138,0.10); color: var(--pink-600); font-family: var(--font-accent); font-weight: 700; font-size: 10.5px; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 18px; }
body.page-houston-area .hub-card__chip[data-kind="home"] { background: rgba(63,90,127,0.10); color: var(--navy-500); }
body.page-houston-area .hub-card__title { font-family: var(--font-display); font-weight: 800; font-size: 1.55rem; color: var(--navy-700); margin: 0 0 4px; letter-spacing: -0.012em; line-height: 1.18; transition: color .18s ease; }
body.page-houston-area .hub-card__sub { font-family: var(--font-sans); font-style: italic; font-size: 0.92rem; color: var(--navy-400); margin: 0 0 16px; }
body.page-houston-area .hub-card__addr { font-family: var(--font-sans); font-size: 0.94rem; line-height: 1.55; color: var(--navy-500); margin: 0 0 16px; }
body.page-houston-area .hub-card__addr em { font-style: italic; color: var(--navy-400); font-size: 0.86rem; display: block; margin-top: 4px; }
body.page-houston-area .hub-card__blurb { font-family: var(--font-sans); font-size: 0.95rem; line-height: 1.6; color: var(--navy-500); margin: 0 0 22px; flex: 1; }
body.page-houston-area .hub-card__meta { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 18px; }
body.page-houston-area .hub-card__tag { font-family: var(--font-accent); font-weight: 600; font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--navy-500); padding: 4px 10px; background: rgba(41,52,72,0.06); border-radius: 999px; }
body.page-houston-area .hub-card__cta { font-family: var(--font-accent); font-weight: 700; font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--navy-700); margin-top: auto; display: inline-flex; align-items: center; gap: 8px; transition: color .18s ease; }
body.page-houston-area .hub-card__cta svg { width: 14px; height: 14px; }

/* San Antonio cross-link strip */
body.page-houston-area .hub-sa { position: relative; z-index: 1; max-width: 1180px; margin: 0 auto; padding: 32px 28px; background: var(--card-lift-bg); backdrop-filter: var(--card-lift-blur); -webkit-backdrop-filter: var(--card-lift-blur); border-radius: 22px; border: 1px solid rgba(41,52,72,0.07); display: flex; gap: 28px; align-items: center; flex-wrap: wrap; }
body.page-houston-area .hub-sa__body { flex: 1; min-width: 240px; }
body.page-houston-area .hub-sa__eyebrow { font-family: var(--font-accent); font-weight: 700; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--pink-600); margin: 0 0 8px; }
body.page-houston-area .hub-sa__title { font-family: var(--font-display); font-weight: 800; font-size: 1.35rem; color: var(--navy-700); margin: 0 0 6px; letter-spacing: -0.01em; }
body.page-houston-area .hub-sa__lede { font-family: var(--font-sans); font-size: 0.96rem; line-height: 1.55; color: var(--navy-500); margin: 0; }
body.page-houston-area .hub-sa__cta { font-family: var(--font-accent); font-weight: 700; font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--navy-700); text-decoration: none; padding: 12px 22px; background: #fff; border: 1px solid var(--navy-700); border-radius: 999px; transition: background .18s ease, color .18s ease; display: inline-flex; align-items: center; gap: 8px; }
body.page-houston-area .hub-sa__cta:hover { background: var(--navy-700); color: #fff; }

/* Footer-CTA — light closer; the global footer ombré (.footer-ombre-blend,
   enabled for page-houston-area in footer.css) handles the fade into the navy
   footer. Flipped navy->light 2026-06-08 (Suzanne). Was a navy band (qa4 #1,
   2026-05-28) back when there was no global Case-A ombré on this page. */
body.page-houston-area .hub-cta { padding: clamp(72px, 9vw, 112px) 32px clamp(80px, 10vw, 120px); text-align: center; }
body.page-houston-area .hub-cta__inner {
  max-width: 720px; margin: 0 auto;
  background: var(--card-lift-bg);
  -webkit-backdrop-filter: var(--card-lift-blur); backdrop-filter: var(--card-lift-blur);
  border: 1px solid rgba(255,255,255,0.6); border-radius: var(--radius-xl);
  padding: clamp(40px,5.5vw,60px) clamp(28px,4vw,48px);
  box-shadow: 0 18px 50px -28px rgba(41,52,72,0.35);
}
body.page-houston-area .hub-cta__title { font-family: var(--font-display); font-weight: 800; font-size: clamp(1.8rem, 3.2vw, 2.4rem); color: var(--navy-700); margin: 0 0 12px; letter-spacing: -0.012em; }
body.page-houston-area .hub-cta__lede { font-family: var(--font-sans); font-size: 1.04rem; line-height: 1.6; color: var(--navy-500); margin: 0 0 28px; }
body.page-houston-area .hub-cta__row { display: inline-flex; gap: 14px; flex-wrap: wrap; justify-content: center; }
body.page-houston-area .hub-cta__btn { font-family: var(--font-sans); font-weight: 600; font-size: 14px; padding: 14px 26px; border-radius: 999px; text-decoration: none; transition: transform .18s ease, background .18s ease, color .18s ease; }
body.page-houston-area .hub-cta__btn--primary { background: var(--pink-500); color: #fff; }
body.page-houston-area .hub-cta__btn--primary:hover { background: var(--pink-600); transform: translateY(-1px); }
body.page-houston-area .hub-cta__btn--ghost { background: #fff; color: var(--navy-700); border: 1px solid var(--navy-700); }
body.page-houston-area .hub-cta__btn--ghost:hover { background: var(--navy-700); color: #fff; }

/* ── QA 2026-06-15 (Suzanne QA – Location Pages) ──
   Remove the arrow from the San Antonio CTA, for consistency with the hub. */
body.page-houston-area .hub-sa__cta svg { display: none; }