/*
 Theme Name:   Lowery Property Advisors
 Theme URI:    https://lowerypa.com
 Description:  Genesis child theme for Lowery Property Advisors
 Author:       LMG
 Author URI:   https://lawtonmg.com
 Template:     genesis
 Version:      1.0.18
 License:      GPL-2.0-or-later
 Text Domain:  lpa-theme
*/

/* ==========================================================================
   Lowery Property Advisors — site.css
   Shared styles. Brand colors extracted from clone/lowerypa.com.
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500&display=swap");

:root {
  /* Brand */
  --burgundy: #77232f;
  --burgundy-deep: #5a1a23;
  --burgundy-bright: #cc4b37;

  /* Surfaces */
  --dark: #16262e;
  --dark-deep: #0c161c;
  --cream: #f6f6f4;
  --paper: #ffffff;
  --bg-soft: #f1efea;
  --rule: #e2e0d8;
  --rule-deep: #cdc9bc;

  /* Text */
  --ink: #16262e;
  --ink-soft: #4a5560;
  --ink-mute: #7a8290;

  /* Accents */
  --gold: #f3c94b;
  --blue-soft: #80a1c1;

  /* Layout */
  --max: 1560px;
  --max-narrow: 1200px;
  --max-wide: 1800px;
  --pad: clamp(20px, 4.5vw, 72px);
  --radius-sm: 6px;
  --radius: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --shadow-sm: 0 4px 12px -4px rgba(22, 38, 46, 0.10);
  --shadow: 0 16px 36px -16px rgba(22, 38, 46, 0.20);
  --shadow-lg: 0 24px 56px -20px rgba(22, 38, 46, 0.25);
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--paper);
  color: var(--ink);
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: inherit; text-decoration: none; }
/* Keep the hidden attribute authoritative over component display rules (e.g. .btn) */
[hidden] { display: none !important; }
img { max-width: 100%; display: block; }
::selection { background: var(--burgundy); color: var(--cream); }

/* ============================== UTILITY BAR ============================== */
.util {
  background: var(--dark-deep);
  color: rgba(255, 255, 255, 0.78);
  font-size: 12.5px;
}
.util-inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 9px var(--pad);
  display: flex;
  justify-content: space-between;
  gap: 24px;
}
.util b { color: var(--gold); margin-right: 6px; font-weight: 600; }
.util a:hover { color: var(--gold); }
.util .links { display: flex; gap: 22px; }
@media (max-width: 720px) { .util .links { display: none; } }

/* ============================== MAIN NAV ============================== */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 30;
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: background 280ms ease, border-color 280ms ease, box-shadow 280ms ease;
}
.nav-inner {
  max-width: none;
  margin: 0;
  padding: 22px clamp(20px, 4.5vw, 72px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  transition: padding 280ms ease;
}
.brand { display: flex; align-items: center; gap: 14px; }
.brand img {
  height: clamp(72px, 8vw, 112px);
  width: auto;
  filter: brightness(0) invert(1);
  transition: height 280ms ease, filter 280ms ease;
}
.menu {
  display: flex;
  gap: 26px;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--paper);
  align-items: center;
}
.menu > a,
.menu .has-submenu > a,
.menu .has-submenu > span {
  display: inline-block;
  padding: 8px 0;
  position: relative;
  color: rgba(255, 255, 255, 0.92);
  transition: color 200ms ease;
}
.menu .has-submenu > span { cursor: default; }
.menu > a:hover, .menu > a.is-active,
.menu .has-submenu > a:hover, .menu .has-submenu > a.is-active,
.menu .has-submenu:hover > span,
.menu .has-submenu:focus-within > span { color: var(--gold); }
.menu > a::after,
.menu .has-submenu > a::after,
.menu .has-submenu > span::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 2px;
  background: var(--gold);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 280ms cubic-bezier(.2,.8,.2,1), background 280ms ease;
}
.menu > a:hover::after, .menu > a.is-active::after,
.menu .has-submenu > a:hover::after, .menu .has-submenu > a.is-active::after,
.menu .has-submenu:hover > span::after,
.menu .has-submenu:focus-within > span::after { transform: scaleX(1); transform-origin: left; }

.menu > a.nav-cta {
  padding: 10px 18px;
  margin-left: 6px;
  font-size: 14px;
  letter-spacing: 0.02em;
  color: var(--paper);
  background: var(--burgundy);
  border-radius: 999px;
}
.menu > a.nav-cta::after { display: none; }
/* CTA stays burgundy/white in every state except :hover (which goes gold). */
.menu > a.nav-cta,
.menu > a.nav-cta.is-active,
.menu > a.nav-cta.current-menu-item,
.menu > a.nav-cta.current_page_item,
.nav.is-scrolled .menu > a.nav-cta,
.nav.is-scrolled .menu > a.nav-cta.is-active,
.nav.is-scrolled .menu > a.nav-cta.current-menu-item {
  background: var(--burgundy);
  color: var(--paper);
}
.menu > a.nav-cta:hover,
.nav.is-scrolled .menu > a.nav-cta:hover {
  background: var(--gold);
  color: var(--ink);
}
.nav.is-scrolled .menu .has-submenu > span { color: var(--ink); }
.nav.is-scrolled .menu .has-submenu:hover > span,
.nav.is-scrolled .menu .has-submenu:focus-within > span { color: var(--burgundy); }
.nav.is-scrolled .menu .has-submenu > span::after { background: var(--burgundy); }

.menu .has-submenu {
  position: relative;
}
.menu .submenu {
  position: absolute;
  top: 100%;
  left: -16px;
  margin-top: 14px;
  min-width: 240px;
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  box-shadow: 0 16px 40px -10px rgba(22, 38, 46, 0.20);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-6px);
  transition: opacity 200ms ease, transform 200ms ease;
  z-index: 5;
}
/* Invisible bridge across the 14px gap so the submenu stays open while the cursor crosses */
.menu .submenu::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -16px;
  height: 16px;
  background: transparent;
}
.menu .has-submenu:hover .submenu,
.menu .has-submenu:focus-within .submenu {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
.menu .submenu a {
  display: block;
  padding: 10px 14px;
  color: var(--ink);
  border-radius: 8px;
  font-size: 15px;
  font-weight: 600;
  white-space: nowrap;
  transition: background 200ms, color 200ms;
}
.menu .submenu a:hover { background: var(--bg-soft); color: var(--burgundy); }

@media (max-width: 1080px) { .menu { display: none; } }
.nav-cta { display: flex; align-items: center; gap: 12px; }

/* Scrolled (and non-hero pages) — solid paper bg, smaller logo, dark menu */
.nav.is-scrolled {
  background: var(--paper);
  border-bottom-color: var(--rule);
  box-shadow: 0 4px 16px -8px rgba(22, 38, 46, 0.10);
}
.nav.is-scrolled .nav-inner { padding-top: 14px; padding-bottom: 14px; }
.nav.is-scrolled .brand img { height: 56px; filter: none; }
.nav.is-scrolled .menu { color: var(--ink); }
.nav.is-scrolled .menu a { color: var(--ink); }
.nav.is-scrolled .menu a:hover, .nav.is-scrolled .menu a.is-active { color: var(--burgundy); }
.nav.is-scrolled .menu a::after { background: var(--burgundy); }

/* ============================== BUTTONS ============================== */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: inherit;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.04em;
  padding: 13px 22px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  transition: all 220ms cubic-bezier(.2,.8,.2,1);
  text-decoration: none;
  white-space: nowrap;
}
.btn-burgundy {
  background: var(--burgundy);
  color: var(--paper);
  box-shadow: 0 4px 0 0 var(--burgundy-deep);
  transition: background 200ms ease, color 200ms ease, transform 200ms ease, box-shadow 200ms ease;
}
.btn-burgundy:hover {
  background: var(--gold);
  color: var(--ink);
  transform: translateY(-1px);
  box-shadow: 0 5px 0 0 #c89a13;
}
.btn-fill {
  background: var(--dark);
  color: var(--paper);
}
.btn-fill:hover { background: var(--burgundy); }
.btn-line {
  border: 1.5px solid var(--ink);
  color: var(--ink);
  padding: 11.5px 20.5px;
}
.btn-line:hover { background: var(--ink); color: var(--paper); }
.btn-line-burgundy {
  border: 1.5px solid var(--burgundy);
  color: var(--burgundy);
  padding: 11.5px 20.5px;
}
.btn-line-burgundy:hover { background: var(--burgundy); color: var(--paper); }
.btn-ghost-light {
  color: var(--paper);
  border: 1.5px solid rgba(255, 255, 255, 0.4);
  padding: 11.5px 20.5px;
}
.btn-ghost-light:hover {
  background: var(--paper);
  color: var(--ink);
  border-color: var(--paper);
}

/* ============================== HERO ============================== */
.hero {
  position: relative;
  padding: clamp(90px, 11vw, 150px) 60px 60px;
  overflow: hidden;
  color: var(--paper);
  isolation: isolate;
  min-height: 100vh;          /* fallback */
  min-height: 100svh;          /* avoids mobile-chrome jump */
  min-height: 100dvh;          /* responds when chrome shows/hides */
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.hero > .hero-inner { width: 100%; }
/* Tighter rails on small screens so 60px doesn't crowd the content */
@media (max-width: 640px) {
  .hero { padding: clamp(90px, 11vw, 150px) 24px 24px; }
}
/* Short viewports — center content, tighter padding */
@media (max-height: 640px) {
  .hero {
    padding-top: clamp(72px, 9vw, 120px);
    padding-bottom: 40px;
    justify-content: center;
  }
}
.hero-bg {
  position: absolute;
  inset: 0;
  z-index: -1;
}
.hero-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(22, 38, 46, 0.30) 0%, rgba(22, 38, 46, 0.65) 70%, rgba(22, 38, 46, 0.85) 100%),
    var(--bg);
  background-size: cover;
  background-position: center;
}
.hero-inner {
  max-width: none;
  margin: 0;
  width: 100%;
}
.pill-tag {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: rgba(255, 255, 255, 0.10);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: 8px 16px 8px 12px;
  border-radius: 999px;
  font-size: 12px;
  letter-spacing: 0.06em;
  font-weight: 600;
  color: var(--paper);
  margin-bottom: 28px;
  border: 1px solid rgba(255, 255, 255, 0.18);
}
.pill-tag::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 0 var(--gold);
  animation: pulse 1.6s infinite;
}
@keyframes pulse {
  0% { box-shadow: 0 0 0 0 rgba(243, 201, 75, 0.6); }
  70% { box-shadow: 0 0 0 8px rgba(243, 201, 75, 0); }
  100% { box-shadow: 0 0 0 0 rgba(243, 201, 75, 0); }
}
.hero h1 {
  font-weight: 800;
  font-size: clamp(40px, 6vw, 78px);
  line-height: 1.04;
  letter-spacing: -0.03em;
  margin: 0 0 22px;
  max-width: 18ch;
}
.hero h1 mark, .hero h1 .hl { background: none; color: var(--gold); }
.hero p {
  font-size: clamp(17px, 1.5vw, 21px);
  max-width: 56ch;
  color: rgba(255, 255, 255, 0.86);
  margin: 0 0 36px;
  font-weight: 400;
}
.hero-cta { display: flex; gap: 14px; flex-wrap: wrap; }

/* compact hero (sub-pages) */
.hero-sm {
  padding: clamp(120px, 12vw, 180px) 60px 60px;
  min-height: 60vh;
  min-height: 60svh;
  min-height: 60dvh;
}
@media (max-width: 640px) {
  .hero-sm { padding: clamp(120px, 12vw, 180px) 24px 24px; }
}
@media (max-height: 640px) {
  .hero-sm { min-height: auto; padding-bottom: 40px; }
}
.hero-sm h1 { font-size: clamp(34px, 4.4vw, 60px); margin-bottom: 14px; }
.hero-sm p { font-size: 17px; max-width: 56ch; margin-bottom: 0; }

/* Phones + tablets (iPad included): homepage hero 60vh, interior heroes 30vh */
@media (max-width: 1024px) {
  .hero {
    min-height: 60vh;
    min-height: 60svh;
  }
  .hero-sm {
    min-height: 30vh;
    min-height: 30svh;
    padding-top: 110px;
    padding-bottom: 28px;
  }
}
.crumb {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 600;
  margin-bottom: 22px;
}
.crumb a { color: rgba(255, 255, 255, 0.78); }
.crumb a:hover { color: var(--gold); }
.crumb span { color: rgba(255, 255, 255, 0.4); }

/* ============================== SECTION SHELLS ============================== */
.section { padding: clamp(72px, 9vw, 128px) var(--pad); }
.section--cream { background: var(--cream); }
.section--soft { background: var(--bg-soft); }
.section--dark { background: var(--dark); color: var(--paper); }
.section--dark .text-mute { color: rgba(255,255,255,0.78); }
.section-inner { max-width: var(--max); margin: 0 auto; }
.section-narrow { max-width: var(--max-narrow); margin: 0 auto; }

.eyebrow {
  font-size: 11px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--burgundy);
  font-weight: 700;
  margin-bottom: 14px;
  display: inline-block;
}
.section--dark .eyebrow { color: var(--gold); }
h2.section-h2,
h2 {
  font-weight: 800;
  font-size: clamp(34px, 5vw, 64px);
  line-height: 1.1;
  letter-spacing: -0.025em;
  margin: 0;
  max-width: 22ch;
  color: var(--ink);
}
.lpa-prose h2 { font-size: 28px; max-width: 100%; }
.section--dark h2 { color: var(--paper); }
h2 .hl {
  background: linear-gradient(180deg, transparent 60%, var(--gold) 60%);
  padding: 0 4px;
  color: inherit;
}
.section--dark h2 .hl {
  background: linear-gradient(180deg, transparent 60%, var(--burgundy) 60%);
  color: var(--paper);
}
.section-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 24px;
  margin-bottom: 36px;
  flex-wrap: wrap;
}
.section-prose { font-size: 17px; line-height: 1.7; color: var(--ink-soft); max-width: 64ch; }
.section--dark .section-prose { color: rgba(255,255,255,0.78); }

/* ============================== INTRO ============================== */
.intro { padding: clamp(72px, 8vw, 120px) var(--pad) clamp(28px, 3vw, 48px); background: var(--paper); }
.intro-inner {
  max-width: var(--max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 8fr 4fr;
  gap: 64px;
  align-items: end;
}
@media (max-width: 880px) {
  .intro-inner { grid-template-columns: 1fr; gap: 24px; }
  .intro-actions { justify-self: start !important; }
}
.intro h2 { max-width: 22ch; }
.intro-actions { justify-self: end; }

/* ============================== SERVICE TILES ============================== */
.svc-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
@media (max-width: 880px) { .svc-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .svc-grid { grid-template-columns: 1fr; } }
/* Two-up tile grids set their columns inline (Careers, Newsworthy); stack on phones */
@media (max-width: 560px) { .svc-grid[style*="repeat(2"] { grid-template-columns: 1fr !important; } }

.svc-tile {
  position: relative;
  aspect-ratio: 5/4;
  border-radius: var(--radius-lg);
  overflow: hidden;
  cursor: pointer;
  isolation: isolate;
  text-decoration: none;
  color: inherit;
  display: block;
}
.svc-tile-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 600ms cubic-bezier(.2,.8,.2,1);
}
.svc-tile:hover .svc-tile-bg { transform: scale(1.06); }
.svc-tile::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(22, 38, 46, 0.10) 30%, rgba(22, 38, 46, 0.85) 100%);
  transition: background 320ms;
  z-index: 1;
}
.svc-tile:hover::after {
  background: linear-gradient(180deg, rgba(119, 35, 47, 0.15) 0%, rgba(119, 35, 47, 0.40) 50%, rgba(22, 38, 46, 0.95) 100%);
}
.svc-tile-content {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 22px 24px 24px;
  color: var(--paper);
  z-index: 2;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
}
.svc-tile-name {
  font-weight: 800;
  font-size: 22px;
  letter-spacing: -0.015em;
  margin: 0;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.4);
}
.svc-tile-arrow {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--gold);
  color: var(--ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 14px;
  transition: transform 280ms;
  flex-shrink: 0;
  box-shadow: 0 3px 0 0 #c89a13;
}
.svc-tile:hover .svc-tile-arrow { transform: translateY(-2px) rotate(-12deg); }

/* property-type tile photo backgrounds (verbatim from live site) */
.pt-office       { background: url("/wp-content/uploads/lpa/property-types/office.jpg") center/cover no-repeat; }
.pt-industrial   { background: url("/wp-content/uploads/lpa/property-types/industrial.jpg") center/cover no-repeat; }
.pt-retail       { background: url("/wp-content/uploads/lpa/property-types/retail.jpg") center/cover no-repeat; }
.pt-multifamily  { background: url("/wp-content/uploads/lpa/property-types/multi-family.jpg") center/cover no-repeat; }
.pt-hospitality  { background: url("/wp-content/uploads/lpa/property-types/hotel.jpg") center/cover no-repeat; }
.pt-special      { background: url("/wp-content/uploads/lpa/property-types/special-purpose.jpg") center/cover no-repeat; }
.pt-self-storage { background: url("/wp-content/uploads/lpa/property-types/self-storage.jpg") center/cover no-repeat; }
.pt-mobile       { background: url("/wp-content/uploads/lpa/property-types/multi-family.jpg") center/cover no-repeat; }
.pt-hotel        { background: url("/wp-content/uploads/lpa/property-types/hotel.jpg") center/cover no-repeat; }
.pt-carwash      { background: url("/wp-content/uploads/lpa/property-types/car-wash.jpg") center/cover no-repeat; }
.pt-admin-team   { background: url("/wp-content/uploads/lpa/about/admin-team.jpg") center/cover no-repeat; }
.pt-development  { background: url("/wp-content/uploads/lpa/property-types/development.jpg") center/cover no-repeat; }
.pt-vacant-land  { background: url("/wp-content/uploads/lpa/property-types/vacant-land.jpg") center/cover no-repeat; }

/* ============================== FIND APPRAISER ============================== */
.find {
  padding: clamp(72px, 8vw, 120px) var(--pad);
  background: var(--bg-soft);
}
.find-card {
  max-width: var(--max-narrow);
  margin: 0 auto;
  background: var(--paper);
  border-radius: var(--radius-xl);
  padding: clamp(40px, 6vw, 80px) clamp(24px, 5vw, 80px);
  box-shadow: var(--shadow-lg);
  text-align: center;
  position: relative;
  overflow: hidden;
}
.find-card::before {
  content: "";
  position: absolute;
  top: -40px;
  right: -40px;
  width: 220px;
  height: 220px;
  background: radial-gradient(closest-side, rgba(119, 35, 47, 0.08), transparent 70%);
}
@media (max-width: 760px) { .find-card { padding: 40px 24px; } }
.find-card h2 { margin: 0 auto 14px; }
.find-card p {
  color: var(--ink-soft);
  max-width: 56ch;
  margin: 0 auto 32px;
  font-size: 17px;
}
.find-form {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto;
  gap: 12px;
  max-width: 1100px;
  margin: 0 auto;
  position: relative;
}
@media (max-width: 760px) { .find-form { grid-template-columns: 1fr; } }
.find-form input,
.lpa-input {
  background: var(--bg-soft);
  border: 1.5px solid var(--rule);
  border-radius: 999px;
  padding: 16px 22px;
  font: inherit;
  font-size: 15px;
  color: var(--ink);
  transition: all 200ms;
}
.find-form input:focus,
.lpa-input:focus {
  outline: 0;
  border-color: var(--burgundy);
  background: var(--paper);
}
.find-form button {
  background: var(--burgundy);
  color: var(--paper);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.04em;
  border: 0;
  border-radius: 999px;
  padding: 0 28px;
  cursor: pointer;
  transition: background 200ms;
  font-family: inherit;
}
.find-form button:hover { background: var(--gold); color: var(--ink); }

/* ============================== INSIGHT CARDS ============================== */
.ins-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
@media (max-width: 880px) { .ins-grid { grid-template-columns: 1fr; } }
.ins-card {
  background: var(--bg-soft);
  border-radius: var(--radius-lg);
  overflow: hidden;
  cursor: pointer;
  transition: all 280ms cubic-bezier(.2,.8,.2,1);
  text-decoration: none;
  color: inherit;
  display: block;
}
.ins-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.ins-img {
  aspect-ratio: 16/10;
  position: relative;
  overflow: hidden;
}
.ins-img-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 600ms;
}
.ins-card:hover .ins-img-bg { transform: scale(1.05); }
.ins-card:nth-child(3n+1) .ins-img-bg { background-color: #2c4860; background-image: linear-gradient(135deg, #2c4860 0%, #16262e 100%); }
.ins-card:nth-child(3n+2) .ins-img-bg { background-color: #77232f; background-image: linear-gradient(135deg, #77232f 0%, #3a1218 100%); }
.ins-card:nth-child(3n+3) .ins-img-bg { background-color: #345a4d; background-image: linear-gradient(135deg, #345a4d 0%, #14241d 100%); }
.ins-body { padding: 22px 24px 26px; }
.ins-meta {
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--burgundy);
  font-weight: 700;
}
.ins-title {
  font-weight: 700;
  font-size: 19px;
  line-height: 1.35;
  color: var(--ink);
  margin: 12px 0 0;
}
.ins-excerpt {
  font-size: 14px;
  line-height: 1.55;
  color: var(--ink-soft);
  margin: 10px 0 0;
}

.section-head .all {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--ink);
  padding: 10px 18px;
  border-radius: 999px;
  border: 1.5px solid var(--rule);
  transition: all 220ms;
}
.section-head .all:hover { border-color: var(--burgundy); background: var(--burgundy); color: var(--paper); }

/* ============================== NEWSLETTER ============================== */
.news {
  background: var(--gold);
  padding: clamp(64px, 7vw, 112px) var(--pad);
  color: var(--ink);
}
.news-inner {
  max-width: var(--max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 6fr 6fr;
  gap: 56px;
  align-items: center;
}
@media (max-width: 880px) { .news-inner { grid-template-columns: 1fr; gap: 24px; } }
.news .eyebrow { color: var(--burgundy); }
.news h2 {
  font-weight: 800;
  font-size: clamp(34px, 5vw, 64px);
  margin: 0;
  letter-spacing: -0.025em;
  max-width: 18ch;
  line-height: 1.1;
}
.news p { color: rgba(22, 38, 46, 0.78); margin: 12px 0 0; max-width: 44ch; }
.news-form {
  display: flex;
  gap: 0;
  align-items: stretch;
  background: var(--paper);
  border-radius: 999px;
  overflow: hidden;
  box-shadow: 0 6px 0 0 #c89a13;
}
.news-form input {
  flex: 1;
  background: transparent;
  border: 0;
  padding: 18px 24px;
  font: inherit;
  color: var(--ink);
}
.news-form input:focus { outline: 0; }
.news-form button {
  background: var(--burgundy);
  color: var(--paper);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.04em;
  border: 0;
  padding: 0 28px;
  cursor: pointer;
  font-family: inherit;
}
.news-form button:hover { background: var(--gold); color: var(--ink); }
.news small { display: block; font-size: 12px; color: rgba(22, 38, 46, 0.65); margin-top: 14px; }

/* ============================== CTA / CONSULTATION ============================== */
.cta { background: var(--paper); padding: clamp(72px, 8vw, 120px) var(--pad); }
.cta-card {
  max-width: var(--max-wide);
  margin: 0 auto;
  background: var(--dark);
  color: var(--paper);
  border-radius: var(--radius-xl);
  overflow: hidden;
  display: grid;
  grid-template-columns: 5fr 7fr;
  gap: 0;
  min-height: 480px;
}
@media (max-width: 880px) { .cta-card { grid-template-columns: 1fr; } }
.cta-left {
  padding: clamp(48px, 5vw, 80px) clamp(32px, 4.5vw, 72px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 18px;
  position: relative;
  background: linear-gradient(135deg, var(--dark) 0%, var(--dark-deep) 100%);
}
.cta-left::before {
  content: "";
  position: absolute;
  right: -40px;
  bottom: -40px;
  width: 240px;
  height: 240px;
  background: radial-gradient(closest-side, rgba(119, 35, 47, 0.42), transparent 70%);
}
.cta-left .eyebrow { color: var(--gold); }
.cta-left h2 {
  font-weight: 800;
  font-size: clamp(34px, 5vw, 64px);
  line-height: 1.05;
  letter-spacing: -0.025em;
  margin: 0;
  max-width: 14ch;
  color: var(--paper);
}
.cta-left h2 .hl {
  background: linear-gradient(180deg, transparent 60%, var(--burgundy) 60%);
  padding: 0 4px;
  color: var(--paper);
}
.cta-left p { color: rgba(255, 255, 255, 0.78); margin: 0; max-width: 38ch; position: relative; }
.cta-left .actions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 8px; position: relative; }
.cta-right {
  background: var(--paper);
  color: var(--ink);
  padding: clamp(48px, 5vw, 80px) clamp(32px, 4.5vw, 72px);
  display: flex;
  flex-direction: column;
  gap: 18px;
  justify-content: center;
}
.cta-right h3 {
  font-weight: 800;
  font-size: 24px;
  color: var(--ink);
  margin: 0 0 4px;
  letter-spacing: -0.015em;
}
.cta-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.cta-form .full { grid-column: span 2; }
.cta-form input,
.cta-form textarea {
  width: 100%;
  background: var(--bg-soft);
  border: 1.5px solid var(--rule);
  border-radius: var(--radius);
  padding: 14px 18px;
  font: inherit;
  color: var(--ink);
  font-family: inherit;
  transition: all 200ms;
}
.cta-form input:focus,
.cta-form textarea:focus { outline: 0; border-color: var(--burgundy); background: var(--paper); }
.cta-form textarea { resize: vertical; min-height: 90px; }
.cta-form button { grid-column: span 2; justify-self: start; }

/* ============================== FOOTER ============================== */
footer.site {
  background: var(--dark);
  color: rgba(255, 255, 255, 0.72);
  padding: 64px var(--pad) 48px;
}
.foot-inner {
  max-width: var(--max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 4fr 2fr 2fr 2fr 2fr;
  gap: 32px;
}

/* Locations-grid footer variant */
.foot-inner--locations {
  grid-template-columns: minmax(220px, 320px) 1fr; /* 320: fits 7 social icons on one row */
  gap: clamp(40px, 6vw, 96px);
  align-items: start;
}
@media (max-width: 880px) {
  /* .foot-inner.foot-inner--locations so it beats the generic 2-col .foot-inner rule below */
  .foot-inner.foot-inner--locations { grid-template-columns: 1fr; }
}
.foot-brand .foot-mark { margin-bottom: 24px; }
.foot-brand .foot-meta {
  margin-top: 22px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.62);
}
.foot-brand .foot-meta a {
  color: rgba(255, 255, 255, 0.78);
  transition: color 200ms;
}
.foot-brand .foot-meta a:hover { color: var(--gold); }
.foot-social {
  display: flex;
  gap: 8px;
  margin-top: 4px;
}
.foot-social a {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1.5px solid rgba(255, 255, 255, 0.20);
  color: rgba(255, 255, 255, 0.85);
  background: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 200ms ease;
}
.foot-social a:hover {
  background: var(--burgundy);
  border-color: var(--burgundy);
  color: var(--paper);
}
.foot-social a svg { width: 16px; height: 16px; }

.foot-locations h4 {
  font-weight: 800;
  font-size: clamp(28px, 3vw, 36px);
  letter-spacing: -0.02em;
  color: var(--paper);
  margin: 0 0 14px;
  text-transform: none;
}
.foot-locations h4::after {
  content: "";
  display: block;
  width: 56px;
  height: 2px;
  background: var(--gold);
  margin-top: 12px;
}
.foot-locations a.hq {
  display: inline-block;
  font-weight: 800;
  font-size: 17px;
  letter-spacing: -0.005em;
  color: var(--paper);
  text-decoration: underline;
  text-decoration-color: var(--gold);
  text-underline-offset: 4px;
  margin: 14px 0 18px;
  transition: color 200ms;
}
.foot-locations a.hq:hover { color: var(--gold); }
.foot-loc-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px 24px;
}
@media (max-width: 720px) { .foot-loc-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .foot-loc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; } }
.foot-loc-grid a {
  font-weight: 700;
  font-size: 15px;
  letter-spacing: -0.005em;
  color: rgba(255, 255, 255, 0.92);
  text-decoration: underline;
  text-decoration-color: rgba(255, 255, 255, 0.20);
  text-underline-offset: 4px;
  transition: color 200ms, text-decoration-color 200ms;
}
.foot-loc-grid a:hover { color: var(--gold); text-decoration-color: var(--gold); }
@media (max-width: 880px) { .foot-inner { grid-template-columns: 1fr 1fr; } }
.foot-mark { display: flex; align-items: center; gap: 14px; }
.foot-mark img { height: 96px; width: auto; filter: brightness(0) invert(1); }
.foot-blurb {
  margin: 18px 0 0;
  font-size: 13.5px;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.6);
  max-width: 32ch;
}
.foot-social { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.foot-social a {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--paper);
  font-weight: 700;
  font-size: 12px;
  transition: all 220ms;
}
.foot-social a:hover { background: var(--burgundy); color: var(--paper); }
footer.site h4 {
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 4px 0 14px;
  font-weight: 700;
}
footer.site ul { list-style: none; margin: 0; padding: 0; font-size: 13.5px; line-height: 2.05; }
footer.site ul a:hover { color: var(--gold); }
.foot-base {
  max-width: var(--max);
  margin: 36px auto 0;
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, 0.10);
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.55);
  flex-wrap: wrap;
  gap: 12px;
}
.foot-base a:hover { color: var(--gold); }

/* ============================== ENTRANCE ANIMATION ============================== */
.reveal { opacity: 0; transform: translateY(14px); animation: rise 1000ms cubic-bezier(.2,.8,.2,1) forwards; }
.reveal.d2 { animation-delay: 180ms; }
.reveal.d3 { animation-delay: 320ms; }
.reveal.d4 { animation-delay: 460ms; }
@keyframes rise { to { opacity: 1; transform: none; } }

/* Scroll-driven reveal — JS tags content blocks with .scroll-reveal and
   toggles .is-visible as each enters the viewport. Stagger across grid
   children comes from inline transition-delay set in JS. */
.scroll-reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 520ms cubic-bezier(.2,.8,.2,1), transform 520ms cubic-bezier(.2,.8,.2,1);
  will-change: opacity, transform;
}
.scroll-reveal.is-visible {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .scroll-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ============================== ACCORDION (FAQs) ============================== */
.accordion { max-width: 880px; margin: 0 auto; }
.acc-item { border-bottom: 1px solid var(--rule); }
.acc-item summary {
  list-style: none;
  cursor: pointer;
  padding: 22px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  font-weight: 700;
  font-size: 17px;
  color: var(--ink);
  transition: color 200ms;
}
.acc-item summary::-webkit-details-marker { display: none; }
.acc-item summary::after {
  content: "+";
  font-size: 24px;
  font-weight: 400;
  color: var(--burgundy);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--bg-soft);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: all 240ms;
}
.acc-item[open] summary::after { content: "−"; background: var(--burgundy); color: var(--paper); }
.acc-item summary:hover { color: var(--burgundy); }
.acc-body {
  padding: 0 0 24px;
  color: var(--ink-soft);
  line-height: 1.7;
  max-width: none;
}

/* Smooth slide-reveal for the accordion body. JS drives the height transition;
   keep `display: block` so the body remains rendered while we animate height to 0
   on close (overrides the native <details> behavior that would hide it). */
.acc-item > .acc-body {
  display: block;
  overflow: hidden;
  transition: height 380ms cubic-bezier(.2, .8, .2, 1);
}

/* ============================== STAT BAND ============================== */
.stat-band {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  background: var(--paper);
}
@media (max-width: 720px) { .stat-band { grid-template-columns: repeat(2, 1fr); } }
.stat {
  padding: 36px 24px;
  border-right: 1px solid var(--rule);
  text-align: center;
}
.stat:last-child { border-right: 0; }
@media (max-width: 720px) { .stat:nth-child(2) { border-right: 0; } .stat:nth-child(-n+2) { border-bottom: 1px solid var(--rule); } }
/* 3-stat bands set their columns inline; stack them on phones */
@media (max-width: 480px) {
  .stat-band[style*="repeat(3"] { grid-template-columns: 1fr !important; }
  .stat-band[style*="repeat(3"] .stat { border-right: 0; border-bottom: 1px solid var(--rule); padding: 26px 20px; }
  .stat-band[style*="repeat(3"] .stat:last-child { border-bottom: 0; }
}
.stat-num {
  font-weight: 800;
  font-size: clamp(40px, 4.6vw, 60px);
  line-height: 1;
  color: var(--ink);
  letter-spacing: -0.025em;
}
.stat-num small { color: inherit; font-size: 1em; font-weight: inherit; }
.stat-lbl {
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin-top: 12px;
  font-weight: 600;
}

/* ============================== OFFICE / LOCATION GRID ============================== */
.offices-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
@media (max-width: 980px) { .offices-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px) { .offices-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .offices-grid { grid-template-columns: 1fr; } }
.office-card {
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  padding: 22px 20px 24px;
  cursor: pointer;
  transition: all 240ms;
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 130px;
  justify-content: space-between;
}
.office-card:hover {
  border-color: var(--burgundy);
  transform: translateY(-3px);
  box-shadow: var(--shadow-sm);
}
.office-state {
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--burgundy);
  font-weight: 700;
}
.office-name {
  font-weight: 800;
  font-size: 19px;
  color: var(--ink);
  letter-spacing: -0.015em;
}
.office-meta {
  font-size: 12px;
  color: var(--ink-soft);
  margin-top: 4px;
}
.office-card.hq {
  background: var(--burgundy);
  border-color: var(--burgundy);
  color: var(--paper);
}
.office-card.hq .office-name { color: var(--paper); }
.office-card.hq .office-state { color: var(--gold); }
.office-card.hq .office-meta { color: rgba(255,255,255,0.78); }
.office-card.hq:hover { background: var(--burgundy-deep); }

/* ============================== GENERAL TYPOGRAPHY ============================== */
.lpa-prose { max-width: 70ch; line-height: 1.75; color: var(--ink); font-size: 17px; }
.lpa-prose p { margin: 0 0 1.2em; }
.lpa-prose h2 { font-size: 28px; margin: 1.8em 0 0.6em; letter-spacing: -0.015em; max-width: 100%; }
.lpa-prose h3 { font-size: 22px; margin: 1.4em 0 0.4em; letter-spacing: -0.005em; }
.lpa-prose ul, .lpa-prose ol { margin: 0 0 1.2em; padding-left: 1.4em; }
.lpa-prose li { margin: 0.3em 0; }
.lpa-prose strong { color: var(--burgundy); }
/* Inline body-copy links: maroon, no underline in any state */
.lpa-prose a:not(.btn),
.why-text p a:not(.btn),
.why-text li a:not(.btn),
.position-body p a:not(.btn),
.position-body li a:not(.btn),
.signup-fineprint a:not(.btn),
.acc-body a:not(.btn),
.fineprint a:not(.btn),
.appraisal-intro a:not(.btn),
.intro p a:not(.btn),
.section-inner > p a:not(.btn),
blockquote a:not(.btn) {
  color: var(--burgundy);
  text-decoration: none;
}
.lpa-prose a:not(.btn):hover,
.why-text p a:not(.btn):hover,
.why-text li a:not(.btn):hover,
.position-body p a:not(.btn):hover,
.position-body li a:not(.btn):hover,
.signup-fineprint a:not(.btn):hover,
.acc-body a:not(.btn):hover,
.fineprint a:not(.btn):hover,
.appraisal-intro a:not(.btn):hover,
.intro p a:not(.btn):hover,
.section-inner > p a:not(.btn):hover,
blockquote a:not(.btn):hover {
  color: var(--burgundy);
  text-decoration: none;
}

/* utilities */
.text-center { text-align: center; }
.mt-0 { margin-top: 0; }
.mt-1 { margin-top: 8px; }
.mt-2 { margin-top: 16px; }
.mt-3 { margin-top: 24px; }
.mt-4 { margin-top: 32px; }
.mt-5 { margin-top: 48px; }
.hide-md { }
@media (max-width: 880px) { .hide-md { display: none !important; } }

/* ============================== MOBILE NAV ============================== */
.nav-mobile-toggle {
  display: none;
  background: transparent;
  border: 0;
  width: 40px;
  height: 40px;
  cursor: pointer;
  padding: 0;
  align-items: center;
  justify-content: center;
}
.nav-mobile-toggle span {
  position: relative;
  width: 22px;
  height: 2px;
  background: var(--paper);
  display: block;
  transition: background 240ms ease;
}
.nav-mobile-toggle span::before,
.nav-mobile-toggle span::after {
  content: "";
  position: absolute;
  left: 0;
  width: 22px;
  height: 2px;
  background: var(--paper);
  transition: transform 240ms, background 240ms ease;
}
.nav.is-scrolled .nav-mobile-toggle span,
.nav.is-scrolled .nav-mobile-toggle span::before,
.nav.is-scrolled .nav-mobile-toggle span::after { background: var(--ink); }
.nav-mobile-toggle span::before { top: -7px; }
.nav-mobile-toggle span::after { top: 7px; }
@media (max-width: 1080px) { .nav-mobile-toggle { display: inline-flex; } }
.nav-mobile {
  display: none;
  position: fixed;
  inset: 0;
  background: var(--paper);
  z-index: 50;
  flex-direction: column;
  overscroll-behavior: contain;
}
.nav-mobile.is-open { display: flex; animation: nm-in 220ms cubic-bezier(.2,.8,.2,1) both; }
@keyframes nm-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }

/* Pinned header — mirrors the scrolled site nav: logo left, close right */
.nav-mobile-head {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px clamp(20px, 4.5vw, 72px);
  border-bottom: 1px solid var(--rule);
  background: var(--paper);
  box-shadow: 0 4px 16px -8px rgba(22, 38, 46, 0.10);
}
.nav-mobile-head .brand img { height: 56px; width: auto; display: block; filter: none; }
.nav-mobile .close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--rule);
  border-radius: 999px;
  background: var(--paper);
  color: var(--ink);
  cursor: pointer;
  padding: 0;
  transition: background 200ms, color 200ms, border-color 200ms;
}
.nav-mobile .close:hover,
.nav-mobile .close:focus-visible { background: var(--burgundy); border-color: var(--burgundy); color: var(--paper); }

/* Scrolling list */
.nav-mobile-body {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 8px clamp(20px, 4.5vw, 72px) 32px;
}
.nm-list, .nm-sub ul { list-style: none; margin: 0; padding: 0; }
.nm-item { border-bottom: 1px solid var(--rule); }
.nm-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.nm-link {
  flex: 1;
  display: block;
  padding: 16px 0;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--ink);
  transition: color 200ms;
}
.nm-link:hover, .nm-link.is-active { color: var(--burgundy); }
.nm-toggle {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 999px;
  background: var(--bg-soft);
  color: var(--ink);
  cursor: pointer;
  padding: 0;
  transition: background 200ms, color 200ms;
}
.nm-toggle svg { transition: transform 240ms cubic-bezier(.2,.8,.2,1); }
.nm-toggle:hover { color: var(--burgundy); }
.nm-item.is-open .nm-toggle { background: var(--burgundy); color: var(--paper); }
.nm-item.is-open .nm-toggle svg { transform: rotate(180deg); }
.nm-toggle:focus-visible, .nm-link:focus-visible, .nm-sub a:focus-visible {
  outline: 2px solid var(--burgundy);
  outline-offset: 2px;
}
/* Expand/collapse via grid rows so the height animates without JS measuring */
.nm-sub {
  display: grid;
  grid-template-rows: 0fr;
  visibility: hidden;
  transition: grid-template-rows 260ms cubic-bezier(.2,.8,.2,1), visibility 0s linear 260ms;
}
.nm-sub > ul { overflow: hidden; min-height: 0; }
.nm-item.is-open .nm-sub {
  grid-template-rows: 1fr;
  visibility: visible;
  transition: grid-template-rows 260ms cubic-bezier(.2,.8,.2,1), visibility 0s;
}
.nm-sub ul { padding: 0 0 12px 14px; border-left: 2px solid var(--gold); margin-left: 2px; }
.nm-sub a {
  display: block;
  padding: 10px 0 10px 12px;
  font-size: 15px;
  font-weight: 600;
  color: var(--ink-soft);
  transition: color 200ms;
}
.nm-sub a:hover, .nm-sub a.is-active { color: var(--burgundy); }
.nm-foot {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  margin-top: 24px;
}
.nm-foot .nm-tel { font-size: 15px; font-weight: 700; }
@media (prefers-reduced-motion: reduce) {
  .nav-mobile.is-open { animation: none; }
  .nm-sub, .nm-item.is-open .nm-sub, .nm-toggle svg { transition: none; }
}

/* ============================== HERO ROTATING SLIDES ============================== */
.hero-bg .hero-slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 1400ms ease-in-out;
}
.hero-bg .hero-slide.is-active { opacity: 1; }
/* Lightened left-to-right veil — brightens the photo while keeping the
   bottom band dark enough for the white headline (bottom-left) to read */
.hero-veil {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(90deg,
      rgba(12, 22, 28, 0.50) 0%,
      rgba(12, 22, 28, 0.38) 22%,
      rgba(12, 22, 28, 0.26) 38%,
      rgba(12, 22, 28, 0.16) 50%,
      rgba(12, 22, 28, 0.08) 64%,
      rgba(12, 22, 28, 0.02) 80%,
      rgba(12, 22, 28, 0.00) 100%),
    linear-gradient(180deg, rgba(12, 22, 28, 0.00) 45%, rgba(12, 22, 28, 0.34) 100%);
}
@media (max-width: 880px) {
  .hero-veil { background:
    linear-gradient(180deg, rgba(12, 22, 28, 0.20) 0%, rgba(12, 22, 28, 0.55) 100%); }
}
.hero-mark {
  position: absolute;
  right: clamp(24px, 4vw, 80px);
  top: 50%;
  transform: translateY(-50%);
  width: clamp(180px, 22vw, 360px);
  height: auto;
  opacity: 0.10;
  pointer-events: none;
  filter: brightness(0) invert(1);
}
@media (max-width: 880px) { .hero-mark { display: none; } }
.hero-now {
  position: absolute;
  bottom: 60px;
  right: 60px;
  left: auto;
  font-size: 11px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--gold);
  display: inline-flex;
  align-items: center;
  gap: 12px;
  z-index: 1;
}
.hero-now::before {
  content: "";
  width: 28px;
  height: 1px;
  background: var(--gold);
}
@media (max-width: 640px) {
  .hero-now { right: 24px; bottom: 24px; }
}
.hero-now-name { color: rgba(255,255,255,0.78); letter-spacing: 0.18em; font-weight: 600; }

/* ============================== WHY (TIER 1) ============================== */
.tier-why { padding: clamp(72px, 9vw, 128px) var(--pad); background: var(--paper); }
.why-grid {
  display: grid;
  grid-template-columns: 6fr 6fr;
  gap: clamp(32px, 5vw, 80px);
  align-items: center;
}
@media (max-width: 980px) { .why-grid { grid-template-columns: 1fr; } }
.why-text h2 { max-width: 18ch; margin-bottom: 22px; }
.why-text p { color: var(--ink-soft); font-size: 17px; line-height: 1.75; max-width: 60ch; margin: 0 0 14px; }
.why-text .stat-pair { display: flex; gap: 36px; margin-top: 32px; flex-wrap: wrap; }
.why-text .stat-pair > div > b { display: block; font-size: 32px; font-weight: 800; letter-spacing: -0.02em; color: var(--burgundy); line-height: 1; }
.why-text .stat-pair > div > span { display: block; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ink-soft); margin-top: 8px; font-weight: 600; }

.why-figure {
  position: relative;
  border-radius: var(--radius-xl);
  overflow: hidden;
  aspect-ratio: 4/5;
  background: var(--bg-soft);
  box-shadow: var(--shadow-lg);
}
.why-figure img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 800ms cubic-bezier(.2,.8,.2,1); }
.why-figure:hover img { transform: scale(1.04); }
.why-figure::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 60%, rgba(22, 38, 46, 0.45) 100%);
}
.why-figure .badge {
  position: absolute;
  left: 24px;
  bottom: 24px;
  z-index: 1;
  background: var(--burgundy);
  color: var(--paper);
  padding: 14px 18px;
  border-radius: var(--radius);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-weight: 700;
  box-shadow: var(--shadow);
}
.why-figure .badge b { display: block; font-size: 22px; letter-spacing: -0.01em; color: var(--gold); margin-bottom: 4px; text-transform: none; font-weight: 800; }

/* --- Homepage Tier 1 variant: on-time proof panel ------------------------
   Scoped to .tier-why--proof so the shared .tier-why layout used by the
   other 11 pages (Why LPA, Team, service pages, Clients, Careers...) is
   untouched: narrower text column, divider rule, stacked stat pair, and an
   uncropped full-bleed comparison graphic. */
.tier-why--proof .why-grid {
  grid-template-columns: 5fr 7fr;
  gap: 0;
  align-items: center;
}
.tier-why--proof .why-text {
  padding-right: clamp(28px, 4vw, 64px);
  border-right: 1px solid var(--rule);
}
.tier-why--proof .why-figure { margin-left: clamp(28px, 4vw, 64px); }

.tier-why--proof .why-text h2 { margin-bottom: 34px; }

.tier-why--proof .why-stat + .why-stat {
  margin-top: 26px;
  padding-top: 26px;
  border-top: 1px solid var(--rule);
}
.tier-why--proof .why-stat b {
  display: block;
  font-size: clamp(38px, 4.2vw, 60px);
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.05;
  color: var(--burgundy);
}
.tier-why--proof .why-stat--lpa b { color: var(--ink); }
.tier-why--proof .why-stat p {
  margin: 10px 0 0;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.5;
  color: var(--ink);
  max-width: none;
}

.tier-why--proof .why-lede {
  margin: 28px 0 0;
  font-size: 16px;
  line-height: 1.7;
  color: var(--ink-soft);
  max-width: 46ch;
}
.tier-why--proof .why-cta { margin-top: 30px; }

/* The graphic carries its own baked-in type, so show it uncropped at its
   native ratio and drop the shared bottom scrim that would muddy it. */
.tier-why--proof .why-figure { aspect-ratio: 1716 / 1532; }
.tier-why--proof .why-figure::after { content: none; }
.tier-why--proof .why-figure:hover img { transform: none; }

/* Stack at 1080px rather than the shared 980px: below that the text column
   is too narrow to hold "of commercial appraisals are delivered late." on a
   single line, which the design calls for. */
@media (max-width: 1080px) {
  .tier-why--proof .why-grid { grid-template-columns: 1fr; gap: clamp(32px, 5vw, 56px); }
  .tier-why--proof .why-text { padding-right: 0; border-right: 0; }
  .tier-why--proof .why-figure { margin-left: 0; }
}
/* Phone widths: ease the caption down so it still sets on one line. */
@media (max-width: 560px) {
  .tier-why--proof .why-stat p { font-size: 15px; }
}
@media (max-width: 400px) {
  .tier-why--proof .why-stat p { font-size: 14px; }
}

/* ============================== CORE VALUES — ACCENT CARDS (TIER 4) ============================== */
/* Always-visible cards. Flex + justify-content:center so the orphan row
   (items 4-5 of 5) sits centered under the first row of three. */
.values-eyebrow {
  display: block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--burgundy);
  margin-bottom: 14px;
}
.values-cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 22px;
  max-width: 1240px;
  margin: 0 auto;
}
.value-card {
  position: relative;
  flex: 0 1 calc((100% - 44px) / 3); /* 3 across, 2 × 22px gaps */
  min-width: 0;
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  padding: 34px 30px 32px;
  overflow: hidden;
  transition: transform 300ms ease, box-shadow 300ms ease;
}
.value-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  background: var(--gold);
}
.value-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow);
}
.value-card .vc-wm {
  position: absolute;
  top: -14px;
  right: 6px;
  font-size: 120px;
  font-weight: 800;
  line-height: 1;
  color: var(--burgundy);
  opacity: 0.06;
  pointer-events: none;
}
.value-card .vc-kicker {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--burgundy);
}
.value-card h3 {
  font-weight: 800;
  font-size: 23px;
  margin: 8px 0 14px;
  letter-spacing: -0.01em;
  color: var(--ink);
  line-height: 1.1;
}
.value-card p {
  font-size: 14.5px;
  line-height: 1.68;
  color: var(--ink-soft);
  margin: 0;
}
@media (max-width: 980px) {
  .value-card { flex: 0 1 calc((100% - 22px) / 2); } /* 2 across */
}
@media (max-width: 620px) {
  .value-card { flex: 1 1 100%; } /* stacked */
}

/* ============================== TIMELINE (LAST TIER) ============================== */
.tier-timeline { padding: clamp(80px, 9vw, 140px) var(--pad); background: var(--paper); color: var(--ink); }
.tier-timeline .eyebrow { color: var(--burgundy); }
.tier-timeline h2 { color: var(--ink); }
.tier-timeline h2 .hl { background: linear-gradient(180deg, transparent 60%, var(--gold) 60%); color: var(--ink); }

.timeline {
  list-style: none;
  margin: 56px 0 0;
  padding: 0;
  position: relative;
}
.timeline::before {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  left: 50%;
  width: 1px;
  background: linear-gradient(180deg, transparent 0%, var(--rule-deep) 8%, var(--rule-deep) 92%, transparent 100%);
}
@media (max-width: 880px) { .timeline::before { left: 22px; } }
.tl-item {
  display: grid;
  grid-template-columns: 1fr 90px 1fr;
  gap: 0;
  align-items: center;
  margin: 0 0 36px;
  position: relative;
}
@media (max-width: 880px) {
  .tl-item { grid-template-columns: 56px minmax(0, 1fr); gap: 18px; align-items: start; }
  /* Left items put the card before the marker in the DOM; pin both to row 1
     so the year pill sits beside its card instead of wrapping below it. */
  .tl-item > .tl-card, .tl-item > .tl-marker { grid-row: 1; }
  .tl-item > .tl-marker { padding-top: 18px; }
}
@media (max-width: 480px) {
  .tl-item { grid-template-columns: 48px minmax(0, 1fr); gap: 12px; }
  .tl-year { padding: 5px 10px; font-size: 11px; letter-spacing: 0.1em; }
  .timeline::before { left: 24px; }
}
.tl-marker {
  grid-column: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  z-index: 1;
}
@media (max-width: 880px) { .tl-marker { grid-column: 1; } }
.tl-year {
  font-size: 13px;
  letter-spacing: 0.18em;
  font-weight: 800;
  color: var(--paper);
  background: var(--burgundy);
  padding: 10px 16px;
  border-radius: 999px;
  box-shadow: 0 4px 0 0 var(--burgundy-deep);
}
.tl-card {
  background: var(--bg-soft);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  padding: 22px 24px;
}
.tl-item.left  .tl-card { grid-column: 1; text-align: right; }
.tl-item.right .tl-card { grid-column: 3; text-align: left; }
@media (max-width: 880px) {
  .tl-item.left .tl-card,
  .tl-item.right .tl-card { grid-column: 2; text-align: left; }
}
.tl-card h3 {
  font-weight: 800;
  font-size: 19px;
  letter-spacing: -0.01em;
  margin: 0 0 8px;
  color: var(--burgundy);
}
.tl-card ul { list-style: none; margin: 0; padding: 0; font-size: 14.5px; line-height: 1.6; color: var(--ink-soft); }
.tl-card li + li { margin-top: 4px; }
.tl-photos {
  display: flex;
  gap: 8px;
  margin-top: 14px;
  justify-content: inherit;
}
.tl-item.left .tl-photos { justify-content: flex-end; }
.tl-photos img {
  flex: 1 1 0;
  min-width: 0;
  max-width: 320px;
  height: 200px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid var(--rule);
  cursor: zoom-in;
  transition: transform 240ms cubic-bezier(.2,.8,.2,1), border-color 240ms;
}
.tl-photos img:hover { transform: translateY(-2px); border-color: var(--burgundy); }

/* ============================== LIGHTBOX ============================== */
.lightbox {
  position: fixed;
  inset: 0;
  background: rgba(8, 14, 18, 0.92);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
  opacity: 0;
  pointer-events: none;
  transition: opacity 220ms ease;
  padding: 32px;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.lightbox.is-open { opacity: 1; pointer-events: auto; }
.lightbox img {
  flex: 0 0 auto;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: scale-down;
  border-radius: 12px;
  box-shadow: 0 24px 80px -20px rgba(0,0,0,0.6);
  cursor: zoom-out;
}
.lightbox .lightbox-close {
  position: absolute;
  top: 22px;
  right: 24px;
  width: 44px;
  height: 44px;
  border: 0;
  background: rgba(255,255,255,0.10);
  color: var(--paper);
  border-radius: 50%;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 200ms;
}
.lightbox .lightbox-close:hover { background: var(--burgundy); }
@media (max-width: 880px) { .tl-photos { justify-content: flex-start !important; } }
@media (max-width: 560px) { .tl-photos img { height: 140px; } }

/* ============================== FOOTER CTA STRIP ============================== */
.foot-cta {
  max-width: var(--max);
  margin: 0 auto 48px;
  padding: 24px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 999px;
}
.foot-cta .label {
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 700;
}
.foot-cta .actions { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.foot-cta a.tel {
  font-size: 17px;
  font-weight: 700;
  color: var(--paper);
  letter-spacing: 0.02em;
}
.foot-cta a.tel:hover { color: var(--gold); }
@media (max-width: 720px) { .foot-cta { border-radius: var(--radius-lg); } }

/* ============================== LOCATIONS — MINIMALIST LIST ============================== */
.locations-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0;
  border-top: 1px solid var(--rule);
}
@media (max-width: 720px) { .locations-list { grid-template-columns: 1fr; } }
.locations-list > a {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: baseline;
  gap: 18px;
  padding: 22px 6px;
  border-bottom: 1px solid var(--rule);
  text-decoration: none;
  color: var(--ink);
  transition: color 200ms, padding 240ms cubic-bezier(.2,.8,.2,1);
  position: relative;
}
.locations-list > a:nth-child(odd) { border-right: 1px solid var(--rule); padding-right: 28px; }
@media (max-width: 720px) { .locations-list > a:nth-child(odd) { border-right: 0; padding-right: 6px; } }
.locations-list > a:hover { color: var(--burgundy); padding-left: 18px; }
.locations-list .num {
  font-size: 11px;
  letter-spacing: 0.22em;
  color: var(--ink-mute);
  font-weight: 700;
  width: 32px;
}
.locations-list .name {
  display: block;
  font-weight: 800;
  font-size: clamp(22px, 2.4vw, 32px);
  letter-spacing: -0.015em;
  line-height: 1.1;
}
.locations-list .name b { color: var(--burgundy); margin-left: 10px; font-size: 11px; letter-spacing: 0.22em; vertical-align: middle; padding: 4px 10px; background: rgba(119,35,47,0.08); border-radius: 999px; font-weight: 700; }
.locations-list .state {
  display: block;
  margin-top: 6px;
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink-soft);
  font-weight: 600;
}
.locations-list .arrow {
  font-size: 18px;
  color: var(--ink-mute);
  transition: transform 240ms, color 240ms;
}
.locations-list > a:hover .arrow { transform: translateX(6px); color: var(--burgundy); }

/* ============================== TEAM — CITY PHOTO CARDS ============================== */
.team-cities {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
@media (max-width: 980px) { .team-cities { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px)  { .team-cities { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .team-cities { grid-template-columns: 1fr; } }
/* Single-column city cards: landscape crop so each card isn't a full screen tall */
@media (max-width: 480px) {
  .team-cities > .team-city,
  .city-track > .team-city { aspect-ratio: 4 / 3; }
}

/* Office carousel (View Team by Location) */
.city-carousel {
  position: relative;
  margin-top: 8px;
  padding: 0 56px;
}
@media (max-width: 720px) { .city-carousel { padding: 0; } }
.city-track {
  display: flex;
  gap: 14px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 8px;
}
.city-track::-webkit-scrollbar { display: none; }
.city-track > .team-city {
  flex: 0 0 calc((100% - 42px) / 4);
  scroll-snap-align: start;
}
@media (max-width: 980px) {
  .city-track > .team-city { flex-basis: calc((100% - 28px) / 3); }
}
@media (max-width: 720px) {
  .city-track > .team-city { flex-basis: calc((100% - 14px) / 2); }
}
@media (max-width: 480px) {
  .city-track > .team-city { flex-basis: 100%; }
}
.cc-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid var(--rule);
  background: var(--paper);
  color: var(--ink);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  transition: all 200ms ease;
}
.cc-arrow:hover {
  background: var(--burgundy);
  border-color: var(--burgundy);
  color: var(--paper);
}
.cc-arrow:disabled { opacity: 0.35; cursor: not-allowed; }
.cc-prev { left: 0; }
.cc-next { right: 0; }
/* Mobile: move the arrows out of the sides and center them below the track */
@media (max-width: 720px) {
  .city-carousel {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
  }
  .city-carousel > .city-track { order: 0; flex: 0 0 100%; min-width: 0; }
  .city-carousel > .cc-arrow {
    order: 1;
    position: static;
    transform: none;
  }
}
.team-city {
  position: relative;
  aspect-ratio: 3/4;
  border-radius: var(--radius-lg);
  overflow: hidden;
  text-decoration: none;
  color: var(--paper);
  display: block;
  isolation: isolate;
}
.team-city::before {
  content: "";
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: var(--pos, center); /* optional per-tile crop, e.g. style="--pos: 22% center" */
  background-image: var(--bg);
  transition: transform 800ms cubic-bezier(.2,.8,.2,1);
}
.team-city:hover::before { transform: scale(1.05); }
.team-city::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(22,38,46,0.0) 35%, rgba(22,38,46,0.85) 100%);
  transition: opacity 280ms;
}
.team-city:hover::after { background: linear-gradient(180deg, rgba(119,35,47,0.0) 30%, rgba(119,35,47,0.55) 70%, rgba(22,38,46,0.92) 100%); }
.team-city .label {
  position: absolute;
  left: 18px;
  bottom: 18px;
  right: 18px;
  z-index: 1;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 10px;
}
.team-city .label .city {
  font-weight: 800;
  font-size: 22px;
  letter-spacing: -0.01em;
  line-height: 1.1;
  text-shadow: 0 2px 16px rgba(0,0,0,0.4);
}
.team-city .label .state {
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 700;
  margin-top: 4px;
  display: block;
}
.team-city .label .arrow {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--gold);
  color: var(--ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  flex-shrink: 0;
  transition: transform 240ms;
}
.team-city:hover .label .arrow { transform: translate(2px, -2px) rotate(-12deg); }

/* ============================== TEAM DIRECTORY ============================== */
.team-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 32px;
}
.team-filter button {
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 10px 16px;
  border-radius: 999px;
  border: 1.5px solid var(--rule);
  background: var(--paper);
  color: var(--ink);
  cursor: pointer;
  transition: all 200ms cubic-bezier(.2,.8,.2,1);
}
.team-filter button:hover { border-color: var(--burgundy); color: var(--burgundy); }
.team-filter button.is-active { background: var(--burgundy); color: var(--paper); border-color: var(--burgundy); }
.team-filter .count {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 7px;
  border-radius: 999px;
  background: rgba(0,0,0,0.06);
  font-size: 10.5px;
  letter-spacing: 0.04em;
  font-weight: 700;
}
.team-filter button.is-active .count { background: rgba(255,255,255,0.18); }

.team-section + .team-section { margin-top: 36px; }
.team-section h3.tier {
  font-size: 22px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--burgundy);
  font-weight: 800;
  margin: 0 0 22px;
}

.team-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
@media (max-width: 1080px) { .team-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px)  { .team-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .team-grid { grid-template-columns: 1fr; } }
/* Multi-column grids with narrow cards (tablet / small laptop): the absolute
   corner ribbon collides with long names and titles, so drop it into flow
   under the title instead. */
@media (min-width: 481px) and (max-width: 1280px) {
  .team-member > .team-ribbon {
    position: static;
    align-self: flex-start;
    margin: -6px 18px 16px;
  }
}

.team-member {
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  padding: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  cursor: pointer;
  overflow: hidden;
  font: inherit;
  text-align: left;
  color: inherit;
  transition: all 240ms cubic-bezier(.2,.8,.2,1);
}
.team-member:hover {
  border-color: var(--burgundy);
  transform: translateY(-3px);
  box-shadow: var(--shadow);
}
.team-member .photo {
  width: 100%;
  aspect-ratio: 1 / 1;
  background-size: cover;
  background-position: center top;
  background-color: var(--bg-soft);
  position: relative;
  overflow: hidden;
}
.team-member .photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(22,38,46,0) 70%, rgba(22,38,46,0.3) 100%);
  opacity: 0;
  transition: opacity 240ms;
}
.team-member:hover .photo::after { opacity: 1; }
.team-member .info {
  padding: 16px 18px 18px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.team-member .name {
  font-weight: 800;
  font-size: 15px;
  letter-spacing: -0.005em;
  color: var(--ink);
  line-height: 1.25;
}
.team-member .title {
  font-size: 12px;
  color: var(--ink-soft);
  line-height: 1.4;
}

/* Ribbon — small pill at bottom-right of the cell showing office/location */
.team-ribbon {
  position: absolute;
  bottom: 12px;
  right: 12px;
  background: var(--burgundy);
  color: var(--paper);
  padding: 5px 10px;
  font-size: 9.5px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 700;
  border-radius: 999px;
  white-space: nowrap;
  z-index: 1;
  box-shadow: 0 2px 8px rgba(0,0,0,0.18);
}

/* Multi-office cards (Regional Leadership) — when someone covers several
   offices the pills sit in normal flow under the job title and wrap, rather
   than stacking on top of the name the way one absolute pill safely can. */
.team-member .info .team-ribbons {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.team-member .info .team-ribbon {
  position: static;
  box-shadow: none;
}

/* ============================== TEAM FLYOUT (right-side bio panel) ============================== */
.team-flyout-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(8, 14, 18, 0.55);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 280ms ease;
  z-index: 190;
}
.team-flyout-backdrop.is-open { opacity: 1; pointer-events: auto; }

.team-flyout {
  position: fixed;
  top: 0;
  right: 0;
  height: 100vh;
  height: 100dvh;
  width: clamp(320px, 92vw, 580px);
  background: var(--paper);
  z-index: 200;
  transform: translateX(100%);
  transition: transform 360ms cubic-bezier(.2,.8,.2,1);
  display: block;
  box-shadow: -24px 0 60px rgba(8, 14, 18, 0.30);
  overflow-y: auto;
  overflow-x: hidden;
}
.team-flyout.is-open { transform: translateX(0); }
@media (max-width: 720px) { .team-flyout { box-shadow: none; } }
.team-flyout .close {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 2;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 50%;
  background: rgba(255,255,255,0.92);
  color: var(--ink);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  transition: background 200ms, color 200ms;
}
.team-flyout .close:hover { background: var(--burgundy); color: var(--paper); }

.team-flyout .photo {
  width: 100%;
  background: var(--paper);
  flex-shrink: 0;
}
.team-flyout .photo img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}
.team-flyout .photo .office { display: none; }
.team-flyout .body {
  padding: 28px clamp(24px, 4vw, 40px) 36px;
}
.team-flyout .title {
  font-size: 11px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--burgundy);
  font-weight: 700;
  margin: 0 0 8px;
}
.team-flyout .name {
  font-weight: 800;
  font-size: clamp(26px, 3.4vw, 36px);
  letter-spacing: -0.02em;
  margin: 0 0 18px;
  line-height: 1.05;
  color: var(--ink);
}
.team-flyout .bio {
  font-size: 15.5px;
  line-height: 1.7;
  color: var(--ink-soft);
  margin: 0 0 24px;
}
.team-flyout .bio p { margin: 0 0 1em; }
.team-flyout .actions { display: flex; gap: 10px; flex-wrap: wrap; padding-top: 18px; border-top: 1px solid var(--rule); }
.team-flyout .actions a { font-size: 13px; }


/* ============================== LOCATION DETAIL (prose + photo glass card) ============================== */
.loc-detail {
  display: grid;
  grid-template-columns: 6fr 5fr;
  gap: clamp(32px, 5vw, 72px);
  align-items: stretch;
}
@media (max-width: 880px) { .loc-detail { grid-template-columns: 1fr; } }
.loc-detail .text { padding: 14px 0; }
.loc-detail .text h2 { margin-bottom: 22px; }
.loc-detail .text p { color: var(--ink-soft); font-size: 17px; line-height: 1.75; max-width: 60ch; margin: 0 0 14px; }

.loc-detail .photo-card {
  position: relative;
  height: clamp(420px, 50vh, 520px);
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  isolation: isolate;
  align-self: center;
  padding: 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}
.loc-detail .photo-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: var(--bg);
  background-size: cover;
  background-position: center;
  transition: transform 1200ms cubic-bezier(.2,.8,.2,1);
}
.loc-detail .photo-card:hover::before { transform: scale(1.04); }
.loc-detail .photo-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(22,38,46,0.05) 30%, rgba(22,38,46,0.55) 100%);
}
.loc-detail .city-tag {
  position: relative;
  z-index: 1;
  background: var(--burgundy);
  color: var(--paper);
  padding: 10px 14px;
  border-radius: 999px;
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-weight: 700;
}
.loc-detail .glass-card {
  position: relative;
  z-index: 1;
  width: 100%;
  background: rgba(12, 22, 28, 0.55);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: var(--radius-lg);
  padding: 22px 24px 24px;
  color: var(--paper);
}
.loc-detail .glass-card h3 {
  font-weight: 800;
  font-size: 22px;
  margin: 0 0 14px;
  letter-spacing: -0.015em;
  color: var(--paper);
}
.loc-detail .row {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 10px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.92);
  font-size: 14.5px;
  line-height: 1.5;
}
.loc-detail .row:first-of-type { border-top: 0; padding-top: 0; }
.loc-detail .row .ico {
  width: 18px; height: 18px; flex-shrink: 0; color: var(--gold); margin-top: 2px;
}
.loc-detail .row a { color: inherit; text-decoration: none; transition: color 200ms; }
.loc-detail .row a:hover { color: var(--gold); }
.loc-detail .glass-card .btn {
  margin-top: 16px;
  background: var(--gold);
  color: var(--ink);
  box-shadow: 0 4px 0 0 #c89a13;
}
.loc-detail .glass-card .btn:hover {
  background: var(--paper);
  color: var(--ink);
  transform: translateY(-1px);
  box-shadow: 0 5px 0 0 #c89a13;
}

/* ============================== CLIENT TESTIMONIALS (CAROUSEL) ============================== */
.quote-carousel {
  position: relative;
  margin-top: 8px;
  padding: 0 56px;
}
@media (max-width: 720px) { .quote-carousel { padding: 0; } }

.quote-track {
  display: flex;
  align-items: flex-start;
  gap: 24px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 8px;
  overflow-y: hidden;
}
.quote-track::-webkit-scrollbar { display: none; }

.quote-track .quote {
  flex: 0 0 calc((100% - 48px) / 3);
  scroll-snap-align: start;
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  padding: 56px 28px 28px;
  margin: 26px 0 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 18px;
  position: relative;
  transition: all 240ms cubic-bezier(.2,.8,.2,1);
}
@media (max-width: 980px) {
  .quote-track .quote { flex-basis: calc((100% - 24px) / 2); }
}
@media (max-width: 640px) {
  .quote-track .quote { flex-basis: 100%; }
}
.quote-track .quote:hover {
  border-color: var(--burgundy);
  transform: translateY(-3px);
  box-shadow: var(--shadow-sm);
}
.quote-track .quote::before {
  content: "\201C";
  position: absolute;
  top: -26px;
  left: 50%;
  transform: translateX(-50%);
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--burgundy);
  color: var(--gold);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 56px;
  line-height: 78px;
  text-align: center;
  box-shadow: 0 6px 18px rgba(119, 35, 47, 0.25);
}
.quote-track blockquote {
  margin: 0;
  font-size: 16px;
  line-height: 1.65;
  color: var(--ink);
  font-weight: 500;
  position: relative;
  z-index: 1;
}
.quote-track figcaption {
  margin-top: auto;
  padding-top: 18px;
  border-top: 1px solid var(--rule);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 2px;
  width: 100%;
}
.quote-track figcaption .name {
  font-weight: 800;
  font-size: 15px;
  color: var(--ink);
  letter-spacing: -0.005em;
}
.quote-track figcaption .company {
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--burgundy);
  font-weight: 700;
  margin-top: 4px;
}
.quote-track figcaption .role {
  font-size: 13px;
  color: var(--ink-soft);
  line-height: 1.4;
}

.qc-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid var(--rule);
  background: var(--paper);
  color: var(--ink);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  transition: all 200ms ease;
}
.qc-arrow:hover {
  background: var(--burgundy);
  border-color: var(--burgundy);
  color: var(--paper);
}
.qc-arrow:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}
.qc-prev { left: 0; }
.qc-next { right: 0; }
@media (max-width: 720px) { .qc-arrow { display: none; } }

/* ============================== CLIENT LIST ============================== */
.client-list {
  list-style: none;
  margin: 24px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border-top: 1px solid var(--rule);
}
@media (max-width: 880px) { .client-list { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .client-list { grid-template-columns: 1fr; } }
.client-list li {
  padding: 18px 14px;
  border-bottom: 1px solid var(--rule);
  border-right: 1px solid var(--rule);
  font-size: 14.5px;
  font-weight: 600;
  letter-spacing: -0.005em;
  color: var(--ink);
}
.client-list li:nth-child(4n) { border-right: 0; }
@media (max-width: 880px) { .client-list li:nth-child(4n) { border-right: 1px solid var(--rule); } .client-list li:nth-child(2n) { border-right: 0; } }
@media (max-width: 480px) { .client-list li { border-right: 0; } }

/* ============================== SURVEY FORM ============================== */
.survey-form {
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.survey-block {
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  padding: 26px 28px 28px;
  margin: 0;
}
.survey-block legend {
  font-weight: 800;
  font-size: 16px;
  letter-spacing: -0.005em;
  color: var(--ink);
  padding: 0 8px;
  background: var(--bg-soft);
  border-radius: 999px;
  margin-left: -2px;
}
.survey-grid, .survey-subgrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
@media (max-width: 640px) { .survey-grid, .survey-subgrid { grid-template-columns: 1fr; } }
.survey-grid .full, .survey-subgrid .full { grid-column: 1 / -1; }
.survey-form label {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.survey-form label > span {
  font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--ink-soft);
  font-weight: 600;
}
.survey-form input,
.survey-form select,
.survey-form textarea {
  width: 100%;
  background: var(--bg-soft);
  border: 1.5px solid var(--rule);
  border-radius: var(--radius);
  padding: 12px 16px;
  font: inherit;
  font-size: 15px;
  color: var(--ink);
  transition: all 200ms;
}
.survey-form input:focus,
.survey-form select:focus,
.survey-form textarea:focus {
  outline: 0;
  border-color: var(--burgundy);
  background: var(--paper);
}
.survey-form textarea { resize: vertical; min-height: 80px; }
.survey-form > .btn { align-self: flex-start; }

/* Step form */
.survey-progress {
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  padding: 22px 26px 18px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.survey-progress-meta {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  flex-wrap: wrap;
}
.survey-progress-label {
  font-size: 11px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--burgundy);
  font-weight: 800;
}
.survey-progress-count {
  font-size: 13px;
  color: var(--ink-soft);
}
.survey-progress-count strong { color: var(--ink); font-weight: 800; }
.survey-progress-bar {
  position: relative;
  height: 6px;
  background: var(--bg-soft);
  border-radius: 999px;
  overflow: hidden;
}
.survey-progress-bar-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: 0;
  background: linear-gradient(90deg, var(--burgundy), var(--gold));
  border-radius: 999px;
  transition: width 320ms cubic-bezier(.2,.8,.2,1);
}
.survey-progress-steps {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}
.survey-progress-step {
  flex: 1 1 0;
  min-width: 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  background: none;
  border: 0;
  padding: 4px 2px;
  cursor: pointer;
  font: inherit;
  color: var(--ink-soft);
  transition: color 200ms;
}
.survey-progress-step .dot {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--bg-soft);
  border: 1.5px solid var(--rule);
  color: var(--ink-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 800;
  transition: all 220ms;
}
.survey-progress-step .lbl {
  font-size: 11px;
  letter-spacing: 0.04em;
  font-weight: 600;
  text-align: center;
  line-height: 1.2;
}
@media (max-width: 720px) { .survey-progress-step .lbl { display: none; } }
.survey-progress-step.is-current .dot {
  background: var(--burgundy);
  border-color: var(--burgundy);
  color: var(--paper);
  box-shadow: 0 0 0 4px rgba(119, 35, 47, 0.12);
}
.survey-progress-step.is-current { color: var(--ink); }
.survey-progress-step.is-done .dot {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--ink);
}
.survey-progress-step.is-done { color: var(--ink); }

.survey-form[data-step-form] .survey-step { display: none; }
.survey-form[data-step-form] .survey-step.is-active {
  display: block;
  animation: survey-step-in 320ms cubic-bezier(.2,.8,.2,1) both;
}
@keyframes survey-step-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.survey-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.survey-actions .btn { align-self: auto; }
.survey-actions .spacer { flex: 1; }
.survey-form[data-step-form] > .btn { display: none; }
.survey-form .btn:disabled,
.survey-form .btn[aria-disabled="true"] {
  opacity: 0.4;
  pointer-events: none;
}

/* Radio scale chips (Q1, Q2, Q3) */
.scale-row { margin-bottom: 18px; }
.scale-row:last-child { margin-bottom: 0; }
.scale-row > .scale-label {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
  margin: 0 0 10px;
}
.scale-options {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.scale-options label {
  position: relative;
  display: inline-flex;
  align-items: center;
  border: 1.5px solid var(--rule);
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 13px;
  color: var(--ink-soft);
  background: var(--bg-soft);
  cursor: pointer;
  transition: all 180ms;
  user-select: none;
}
.scale-options label input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.scale-options label:hover {
  border-color: var(--burgundy);
  color: var(--ink);
}
.scale-options label:has(input:checked) {
  background: var(--burgundy);
  border-color: var(--burgundy);
  color: var(--paper);
}
.scale-options label:focus-within {
  outline: 2px solid var(--burgundy);
  outline-offset: 2px;
}

/* Rate tables (Q4, Q5) */
.rate-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  margin-top: 6px;
}
.rate-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  min-width: 520px;
}
.rate-table th,
.rate-table td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid var(--rule);
  border-right: 1px solid var(--rule);
}
.rate-table th:last-child,
.rate-table td:last-child { border-right: 0; }
.rate-table tbody tr:last-child th,
.rate-table tbody tr:last-child td { border-bottom: 0; }
.rate-table thead th {
  background: var(--bg-soft);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 800;
  color: var(--ink);
}
.rate-table tbody th[scope="row"] {
  background: var(--bg-soft);
  font-weight: 700;
  font-size: 13.5px;
  color: var(--ink);
  white-space: nowrap;
}
.rate-table td { padding: 6px; background: var(--paper); }
.rate-table td input {
  width: 100%;
  background: transparent;
  border: 0;
  padding: 8px 10px;
  font: inherit;
  font-size: 14px;
  color: var(--ink);
  border-radius: 6px;
  transition: background 180ms, box-shadow 180ms;
}
.rate-table td input:focus {
  outline: 0;
  background: var(--bg-soft);
  box-shadow: inset 0 0 0 2px var(--burgundy);
}

/* ============================== JOB POSTING ============================== */
.position {
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  padding: 36px clamp(28px, 4vw, 48px);
  margin-top: 24px;
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: clamp(24px, 4vw, 56px);
}
@media (max-width: 880px) { .position { grid-template-columns: 1fr; } }
.position-head h3 {
  font-weight: 800;
  font-size: clamp(22px, 2.6vw, 28px);
  letter-spacing: -0.015em;
  line-height: 1.15;
  margin: 6px 0 0;
  color: var(--ink);
}

/* Accordion variant */
.position-acc {
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  margin-top: 14px;
  overflow: hidden;
  transition: border-color 220ms ease, box-shadow 220ms ease;
}
.position-acc[open] {
  border-color: var(--burgundy);
  box-shadow: var(--shadow-sm);
}
.position-acc summary {
  list-style: none;
  cursor: pointer;
  padding: 22px clamp(20px, 3vw, 32px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.position-acc summary::-webkit-details-marker { display: none; }
.position-acc summary h3 {
  font-weight: 800;
  font-size: clamp(18px, 2vw, 22px);
  letter-spacing: -0.01em;
  line-height: 1.25;
  margin: 0;
  color: var(--ink);
  flex: 1;
}
.position-acc:hover summary h3 { color: var(--burgundy); }
.position-acc .acc-toggle {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--bg-soft);
  color: var(--burgundy);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-weight: 400;
  line-height: 1;
  transition: background 220ms, color 220ms, transform 280ms cubic-bezier(.2,.8,.2,1);
}
.position-acc[open] .acc-toggle {
  background: var(--burgundy);
  color: var(--paper);
  transform: rotate(45deg);
}
.position-acc .position-body {
  padding: 4px clamp(20px, 3vw, 32px) 28px;
}
.position-body h4 {
  font-size: 18px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--burgundy);
  font-weight: 800;
  margin: 24px 0 10px;
}
.position-body h4:first-child { margin-top: 0; }
.position-body p {
  font-size: 15.5px;
  line-height: 1.7;
  color: var(--ink-soft);
  margin: 0 0 12px;
}
.position-body ul {
  margin: 0 0 12px;
  padding-left: 1.2em;
}
.position-body li {
  font-size: 15px;
  line-height: 1.55;
  color: var(--ink-soft);
  margin: 4px 0;
}
.position-body a { color: var(--burgundy); }

/* ============================== ROW MARKET LEADERS ============================== */
.row-leaders {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin-top: 16px;
  max-width: 860px;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 480px) {
  .row-leaders { grid-template-columns: 1fr; }
}
.row-leader {
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  padding: 22px 18px 24px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  transition: all 240ms cubic-bezier(.2,.8,.2,1);
}
.row-leader:hover {
  border-color: var(--burgundy);
  transform: translateY(-3px);
  box-shadow: var(--shadow);
}
.row-leader .photo {
  width: 144px;
  height: 144px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--soft);
  margin-bottom: 6px;
  border: 3px solid var(--burgundy);
  box-sizing: border-box;
  box-shadow: 0 0 0 4px var(--paper), 0 0 0 5px var(--rule);
  display: block;
  transition: transform 240ms cubic-bezier(.2,.8,.2,1), box-shadow 240ms;
}
a.row-leader .photo,
a.photo { cursor: pointer; }
.row-leader > a.photo:hover {
  transform: scale(1.04);
  box-shadow: 0 0 0 4px var(--paper), 0 0 0 5px var(--burgundy);
}
.row-leader .photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}
.row-leader .role {
  font-size: 11px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--burgundy);
  font-weight: 700;
}
.row-leader .name {
  font-weight: 800;
  font-size: 17px;
  line-height: 1.25;
  color: var(--ink);
  letter-spacing: -0.005em;
}
.row-leader .title {
  font-size: 13px;
  color: var(--muted);
  letter-spacing: 0.02em;
}

/* ============================== LOCATION SERVICE ICON ROW ============================== */
.svc-icons {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 8px;
}
@media (max-width: 880px) { .svc-icons { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .svc-icons { grid-template-columns: 1fr; } }
.svc-icons > * {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 26px 22px;
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  background: var(--paper);
  text-decoration: none;
  color: var(--ink);
  transition: all 240ms cubic-bezier(.2,.8,.2,1);
}
.svc-icons > a:hover {
  border-color: var(--burgundy);
  transform: translateY(-3px);
  box-shadow: var(--shadow);
}
.svc-icons .ico {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(119,35,47,0.08), rgba(119,35,47,0.18));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--burgundy);
  transition: background 240ms, color 240ms;
}
.svc-icons > a:hover .ico { background: var(--burgundy); color: var(--paper); }
.svc-icons .ico svg { width: 24px; height: 24px; stroke: currentColor; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.svc-icons h4 {
  font-weight: 800;
  font-size: 16px;
  margin: 0;
  letter-spacing: -0.005em;
  color: var(--ink);
}
.svc-icons p { font-size: 13.5px; color: var(--ink-soft); line-height: 1.55; margin: 0; }

.svc-icons.svc-icons--3x4 {
  grid-template-columns: repeat(3, 1fr);
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
  gap: 20px;
}
.svc-icons.svc-icons--3x4 > * {
  align-items: center;
  text-align: center;
}
.svc-icons.svc-icons--3x4 h4 { text-align: center; }
@media (max-width: 880px) { .svc-icons.svc-icons--3x4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .svc-icons.svc-icons--3x4 { grid-template-columns: 1fr; } }

/* ============================== REQUEST AN APPRAISAL FORM ============================== */
.appraisal-intro {
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink-soft);
  margin: 0 0 28px;
  text-align: center;
}
.appraisal-form {
  display: flex;
  flex-direction: column;
  gap: 22px;
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  padding: clamp(28px, 4vw, 44px);
}
.appraisal-form .field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  border: 0;
  margin: 0;
  padding: 0;
}
.appraisal-form .field > label,
.appraisal-form .field > legend {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink);
  padding: 0;
}
.appraisal-form .req { color: var(--burgundy); }
.appraisal-form input[type="text"],
.appraisal-form input[type="email"],
.appraisal-form input[type="tel"],
.appraisal-form select,
.appraisal-form textarea {
  width: 100%;
  background: var(--bg-soft);
  border: 1.5px solid var(--rule);
  border-radius: var(--radius);
  padding: 12px 16px;
  font: inherit;
  font-size: 15px;
  color: var(--ink);
  transition: all 200ms;
}
.appraisal-form select { appearance: none; -webkit-appearance: none; padding-right: 38px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%2377232f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat: no-repeat; background-position: right 14px center; background-size: 12px 8px;
}
.appraisal-form textarea { resize: vertical; min-height: 96px; }
.appraisal-form input:focus,
.appraisal-form select:focus,
.appraisal-form textarea:focus {
  outline: 0;
  border-color: var(--burgundy);
  background: var(--paper);
  box-shadow: 0 0 0 3px rgba(119, 35, 47, 0.12);
}
.appraisal-form .turnaround-other-input {
  display: none;
  margin-top: 12px;
}
.appraisal-form [data-turnaround]:has([data-turnaround-other]:checked) .turnaround-other-input {
  display: block;
  animation: turnaround-fade 200ms ease-out both;
}
@keyframes turnaround-fade {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: none; }
}
.appraisal-form .field-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
@media (max-width: 520px) { .appraisal-form .field-grid-2 { grid-template-columns: 1fr; } }
.appraisal-form .field-grid-2 .sub {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.appraisal-form .field-grid-2 .sub > span {
  font-size: 11px;
  letter-spacing: 0.04em;
  color: var(--ink-soft);
  font-weight: 600;
  text-transform: none;
}
.appraisal-actions {
  margin-top: 6px;
  display: flex;
  justify-content: flex-end;
}
.appraisal-form .fineprint {
  margin: 6px 0 0;
  font-size: 13px;
  line-height: 1.55;
  color: var(--ink-soft);
}

/* ============================== INTERIOR HERO (LAYERED IMAGE + GRADIENT) ============================== */
.hero-int {
  position: relative;
  padding: clamp(80px, 10vw, 140px) var(--pad) clamp(60px, 7vw, 100px);
  color: var(--paper);
  isolation: isolate;
  overflow: hidden;
}
.hero-int .hero-bg-img {
  position: absolute;
  inset: 0;
  z-index: -2;
  background-size: cover;
  background-position: center;
}
.hero-int .hero-veil { z-index: -1; }
.hero-int .hero-inner { max-width: var(--max); margin: 0 auto; }
.hero-int h1 {
  font-weight: 800;
  font-size: clamp(36px, 5vw, 64px);
  line-height: 1.05;
  letter-spacing: -0.025em;
  margin: 0 0 14px;
  max-width: 22ch;
  color: var(--paper);
}
.hero-int h1 .hl { color: var(--gold); }
.hero-int p { color: rgba(255,255,255,0.86); font-size: 17px; max-width: 60ch; margin: 0; }

/* ============================== FLOATING SIGN-UP ============================== */
/* Office card — hide redundant meta (state already shown above the city) */
.offices-grid .office-card .office-meta { display: none; }

/* ============================== LOCATIONS — INTERACTIVE MAP ============================== */
.lpa-map-shell {
  margin: 0 auto;
  max-width: 1500px;
}
.lpa-map-stage {
  position: relative;
  aspect-ratio: 16 / 9;
  background: transparent;
  overflow: hidden;
}
.lpa-map-stage svg { width: 100%; height: 100%; display: block; }

.lpa-map-shell .state-fill { fill: #e9e8e3; stroke: #c5c2bc; stroke-width: 0.6; transition: fill 200ms; }
.lpa-map-shell .state-fill.has-office { fill: #efe4dd; }

.lpa-map-shell .marker { cursor: pointer; }
.lpa-map-shell .marker .pin {
  transition: transform 220ms cubic-bezier(.2,.8,.2,1);
  transform-box: fill-box;
  transform-origin: center;
}
.lpa-map-shell .marker:hover .pin { transform: scale(1.16); }
.lpa-map-shell .marker.is-active .pin { transform: scale(1.32); }
.lpa-map-shell .marker .pin-shape {
  fill: var(--burgundy);
  stroke: var(--paper);
  stroke-width: 2;
  filter: drop-shadow(0 4px 8px rgba(119,35,47,0.35));
}
.lpa-map-shell .marker .pin-dot { fill: var(--paper); }
.lpa-map-shell .marker.is-hq .pin-shape { fill: var(--gold); }
.lpa-map-shell .marker.is-hq .pin-dot { fill: var(--ink); }
.lpa-map-shell .marker.is-active .pin-shape { fill: var(--gold); stroke: var(--burgundy); }

/* Overlay address card layer above the SVG */
.lpa-map-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.lpa-map-card {
  position: absolute;
  pointer-events: auto;
  width: 280px;
  background: var(--paper);
  color: var(--ink);
  border-radius: 12px;
  padding: 16px 18px 18px;
  box-shadow: 0 18px 40px -12px rgba(22,38,46,0.35);
  border: 1px solid var(--rule);
  transform: translate(-50%, calc(-100% - 18px));
  animation: lpa-card-pop 220ms cubic-bezier(.2,.8,.2,1) both;
  z-index: 2;
}
.lpa-map-card::after {
  content: "";
  position: absolute;
  bottom: -8px;
  left: 50%;
  width: 14px;
  height: 14px;
  background: var(--paper);
  border-right: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  transform: translateX(-50%) rotate(45deg);
}
@keyframes lpa-card-pop {
  from { opacity: 0; transform: translate(-50%, calc(-100% - 4px)); }
  to   { opacity: 1; transform: translate(-50%, calc(-100% - 18px)); }
}
.lpa-map-card .lpa-map-card-eyebrow {
  display: block;
  font-size: 11px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--burgundy);
  font-weight: 800;
}
.lpa-map-card .lpa-map-card-city {
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.01em;
  line-height: 1.1;
  margin: 4px 0 8px;
  color: var(--ink);
}
.lpa-map-card .lpa-map-card-line {
  font-size: 13px;
  line-height: 1.45;
  color: var(--ink-soft);
}
.lpa-map-card .lpa-map-card-phone {
  font-size: 13px;
  margin-top: 6px;
}
.lpa-map-card .lpa-map-card-phone a {
  color: var(--burgundy);
  font-weight: 700;
  text-decoration: none;
}
.lpa-map-card .lpa-map-card-cta {
  margin-top: 12px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.lpa-map-card .lpa-map-card-cta .btn {
  padding: 7px 12px;
  font-size: 12px;
}
.lpa-map-card-close {
  appearance: none;
  position: absolute;
  top: 8px;
  right: 8px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 0;
  background: var(--bg-soft);
  color: var(--ink);
  font: 700 16px/1 sans-serif;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 200ms, color 200ms;
}
.lpa-map-card-close:hover { background: var(--burgundy); color: var(--paper); }

/* Legend — overlaid centered at the top of the map stage */
.lpa-map-stage .lpa-map-legend {
  position: absolute;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 9px 14px;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid var(--rule);
  border-radius: 999px;
  box-shadow: 0 4px 14px -4px rgba(22, 38, 46, 0.18);
  font-size: 12px;
  color: var(--ink-soft);
}
.lpa-map-stage .lpa-map-legend .dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; vertical-align: middle; margin-right: 6px; }
.lpa-map-stage .lpa-map-legend .dot.b { background: var(--burgundy); }
.lpa-map-stage .lpa-map-legend .dot.g { background: var(--gold); }

/* Sitewide: tel: and mailto: links render in burgundy with no underline,
   in any state (overrides the body-copy link rule that adds an underline). */
a[href^="tel:"],
a[href^="mailto:"],
.lpa-prose a[href^="tel:"],
.lpa-prose a[href^="mailto:"],
.why-text p a[href^="tel:"],
.why-text p a[href^="mailto:"],
.why-text li a[href^="tel:"],
.why-text li a[href^="mailto:"],
.position-body a[href^="tel:"],
.position-body a[href^="mailto:"],
.signup-fineprint a[href^="tel:"],
.signup-fineprint a[href^="mailto:"],
.acc-body a[href^="tel:"],
.acc-body a[href^="mailto:"],
.fineprint a[href^="tel:"],
.fineprint a[href^="mailto:"],
.section-inner > p a[href^="tel:"],
.section-inner > p a[href^="mailto:"] {
  color: var(--burgundy);
  text-decoration: none;
}
a[href^="tel:"]:hover,
a[href^="mailto:"]:hover,
.lpa-prose a[href^="tel:"]:hover,
.lpa-prose a[href^="mailto:"]:hover,
.why-text p a[href^="tel:"]:hover,
.why-text p a[href^="mailto:"]:hover,
.position-body a[href^="tel:"]:hover,
.position-body a[href^="mailto:"]:hover,
.signup-fineprint a[href^="tel:"]:hover,
.signup-fineprint a[href^="mailto:"]:hover,
.acc-body a[href^="tel:"]:hover,
.acc-body a[href^="mailto:"]:hover,
.fineprint a[href^="tel:"]:hover,
.fineprint a[href^="mailto:"]:hover {
  color: var(--burgundy);
  text-decoration: none;
}

/* Footer social icons use mailto:/tel: hrefs but are icon buttons, not body
   links — keep them white (override the sitewide tel/mailto burgundy rule above). */
.foot-social a[href^="tel:"],
.foot-social a[href^="mailto:"] { color: var(--paper); }
.foot-social a[href^="tel:"]:hover,
.foot-social a[href^="mailto:"]:hover { color: var(--paper); }

/* Clients page — tighten the gap between the testimonials carousel
   (Tier 1) and the cream "The LPA Way" Tier 2 below it. */
body.page-id-35 .section + .tier-why,
body.page-id-35 .section + .section--cream {
  padding-top: clamp(40px, 5vw, 64px);
}

/* Hide the floating sign-up button while the mobile menu is open */
body:has(.nav-mobile.is-open) .signup-fab { display: none; }
.signup-fab {
  position: fixed;
  right: clamp(16px, 3vw, 28px);
  bottom: clamp(16px, 3vw, 28px);
  z-index: 90;
  /* Match .menu > a.nav-cta exactly: same padding, font-size, letter-spacing, weight, radius */
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.02em;
  padding: 10px 18px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  background: var(--burgundy);
  color: var(--paper);
  box-shadow: 0 4px 14px rgba(119, 35, 47, 0.39);
  transition: background 200ms ease-out, color 200ms ease-out;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--burgundy);
  color: var(--paper);
  border: 0;
  padding: 14px 22px;
  border-radius: 999px;
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.04em;
  cursor: pointer;
  box-shadow: 0 14px 30px rgba(119, 35, 47, 0.32);
  transition: transform 220ms cubic-bezier(.2,.8,.2,1), box-shadow 220ms, background 220ms;
}
.signup-fab:hover {
  background: var(--gold);
  color: var(--ink);
}
.signup-fab svg {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}
@media (max-width: 520px) {
  .signup-fab span { display: none; }
  .signup-fab { padding: 14px; }
  .signup-fab svg { width: 22px; height: 22px; }
}

.signup-modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: none;
  align-items: center;
  justify-content: center;
  padding: clamp(12px, 4vw, 32px);
}
.signup-modal.is-open { display: flex; animation: signup-fade 220ms ease-out both; }
@keyframes signup-fade { from { opacity: 0; } to { opacity: 1; } }
.signup-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(12, 22, 28, 0.62);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.signup-modal-dialog {
  position: relative;
  width: 100%;
  max-width: 720px;
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  background: var(--paper);
  border-radius: var(--radius-lg);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.36);
  padding: clamp(28px, 4vw, 44px);
  animation: signup-pop 260ms cubic-bezier(.2,.8,.2,1) both;
}
@keyframes signup-pop { from { transform: translateY(20px) scale(0.98); opacity: 0; } to { transform: none; opacity: 1; } }
.signup-modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--rule);
  background: var(--paper);
  color: var(--ink);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 200ms;
}
.signup-modal-close:hover {
  background: var(--burgundy);
  border-color: var(--burgundy);
  color: var(--paper);
}
.signup-modal h2 {
  font-size: clamp(22px, 2.6vw, 28px);
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.2;
  margin: 0 0 18px;
  color: var(--burgundy);
  font-weight: 800;
  text-align: center;
  border-bottom: 2px solid var(--rule);
  padding-bottom: 18px;
  max-width: none;
  width: 100%;
}
.signup-form {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 8px;
}
.signup-form label { display: block; }
.signup-form .full-2 { grid-column: span 2; }
.signup-form .full { grid-column: 1 / -1; }
@media (max-width: 720px) {
  .signup-form { grid-template-columns: 1fr 1fr; }
  .signup-form .full-2 { grid-column: 1 / -1; }
}
@media (max-width: 480px) {
  .signup-form { grid-template-columns: 1fr; }
  .signup-form .full-2 { grid-column: auto; }
}
.signup-form input,
.signup-form textarea {
  width: 100%;
  background: var(--paper);
  border: 1.5px solid var(--rule);
  border-radius: var(--radius);
  padding: 14px 16px;
  font: inherit;
  font-size: 15px;
  color: var(--ink);
  transition: border-color 180ms, box-shadow 180ms;
}
.signup-form textarea {
  resize: vertical;
  min-height: 110px;
}
.signup-form input:focus,
.signup-form textarea:focus {
  outline: 0;
  border-color: var(--burgundy);
  box-shadow: 0 0 0 3px rgba(119, 35, 47, 0.12);
}
.signup-form input::placeholder,
.signup-form textarea::placeholder {
  color: var(--ink-soft);
  opacity: 0.85;
}
.signup-form-actions {
  grid-column: 1 / -1;
  margin-top: 4px;
}
.signup-fineprint {
  margin: 22px 0 0;
  font-size: 13px;
  line-height: 1.55;
  color: var(--ink-soft);
}
.signup-fineprint a { color: var(--burgundy); }


/* -------------------------------------------------------------------------- */
/*  GRAVITY FORMS — bespoke submit states (honeypot / success / error)         */
/* -------------------------------------------------------------------------- */

/* Honeypot — visually hidden, kept in the layout flow off-screen for bots */
.lpa-hp {
  position: absolute !important;
  left: -9999px !important;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

/* Inline success panel (replaces the form on AJAX success) */
.lpa-form-success {
  max-width: 640px;
  margin: 32px auto 0;
  padding: 28px 32px;
  background: var(--cream);
  border: 1px solid rgba(119, 35, 47, 0.18);
  border-left: 4px solid var(--burgundy);
  border-radius: 10px;
  color: var(--ink);
  font-size: 17px;
  line-height: 1.6;
  text-align: center;
  box-shadow: 0 8px 28px rgba(22, 38, 46, 0.08);
}
.lpa-form-success a { color: var(--burgundy); text-decoration: none; }

/* Error banner (prepended inside the form) */
.lpa-form-error {
  margin: 0 0 20px;
  padding: 12px 16px;
  background: #fbecea;
  border: 1px solid var(--burgundy-bright);
  border-radius: 8px;
  color: var(--burgundy-deep);
  font-size: 14.5px;
  line-height: 1.5;
}

/* Highlighted invalid fields */
.has-error input,
.has-error select,
.has-error textarea,
.field.has-error input,
.field.has-error select,
.field.has-error textarea {
  border-color: var(--burgundy-bright) !important;
  box-shadow: 0 0 0 2px rgba(204, 75, 55, 0.18) !important;
}
.has-error > legend,
.has-error > span:first-child { color: var(--burgundy-deep); }

/* File input on the education / cta forms */
.cta-form input[type="file"] {
  width: 100%;
  font-size: 14.5px;
  color: var(--ink-soft);
  padding: 10px 0;
}

/* ============================== GRAVITY FORMS — SIGNUP (.lpa-gf) ============================== */
/* Wrap a [gravityform] shortcode in <div class="lpa-gf"> to give it the
   theme's signup-form look (labels, rounded inputs, burgundy pill button)
   in place of Gravity Forms' Orbital styling. */
.lpa-gf .gform_wrapper.gform-theme { margin: 0; }
.lpa-gf .gform_wrapper.gform-theme .gform_required_legend { display: none; }
.lpa-gf .gform_wrapper.gform-theme .gform_fields {
  column-gap: 14px;
  row-gap: 14px;
}
.lpa-gf .gform_wrapper.gform-theme .gfield_label {
  display: block;
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  color: var(--ink);
  margin: 0 0 6px;
}
.lpa-gf .gform_wrapper.gform-theme .gfield_required {
  color: var(--burgundy);
  font-size: inherit;
  font-weight: 700;
  margin-left: 2px;
}
.lpa-gf .gform_wrapper.gform-theme input[type="text"],
.lpa-gf .gform_wrapper.gform-theme input[type="tel"],
.lpa-gf .gform_wrapper.gform-theme input[type="email"],
.lpa-gf .gform_wrapper.gform-theme textarea {
  width: 100%;
  height: auto;
  min-height: 0;
  background: var(--paper);
  border: 1.5px solid var(--rule);
  border-radius: var(--radius);
  box-shadow: none;
  padding: 14px 16px;
  font-family: inherit;
  font-size: 15px;
  line-height: 1.5;
  color: var(--ink);
  transition: border-color 180ms, box-shadow 180ms;
}
.lpa-gf .gform_wrapper.gform-theme input:focus,
.lpa-gf .gform_wrapper.gform-theme textarea:focus {
  outline: 0;
  border-color: var(--burgundy);
  box-shadow: 0 0 0 3px rgba(119, 35, 47, 0.12);
}
.lpa-gf .gform_wrapper.gform-theme .gform_footer {
  margin: 0;
  padding: 14px 0 0;
}
/* !important: Gravity Forms' theme framework styles the submit button with
   higher-specificity rules than the field selectors above. */
.lpa-gf .gform_wrapper.gform-theme .gform_footer .gform_button {
  display: inline-flex;
  align-items: center;
  font-family: inherit !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  letter-spacing: 0.04em !important;
  line-height: normal !important;
  padding: 13px 22px !important;
  min-height: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--burgundy) !important;
  color: var(--paper) !important;
  box-shadow: 0 4px 0 0 var(--burgundy-deep) !important;
  cursor: pointer;
  transition: background 200ms ease, color 200ms ease, transform 200ms ease, box-shadow 200ms ease;
}
.lpa-gf .gform_wrapper.gform-theme .gform_footer .gform_button:hover {
  background: var(--gold) !important;
  color: var(--ink) !important;
  transform: translateY(-1px);
  box-shadow: 0 5px 0 0 #c89a13 !important;
}

/* ============================== 2026-09 REVIEW FIXES ============================== */

/* iOS Safari inflates long paragraphs (but not short ones) in landscape,
   which made FAQ answers render at mixed sizes. Keep type at authored size. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

/* In-page anchors (e.g. #newsletter-signup after a form post) clear the fixed nav */
section[id] { scroll-margin-top: 84px; }

/* Homepage hero: never start content above the bottom of the (tall,
   unscrolled) logo — short/landscape phones were overlapping the headline. */
.is-home .hero { padding-top: max(clamp(90px, 11vw, 150px), calc(clamp(72px, 8vw, 112px) + 68px)); }
@media (max-height: 640px) {
  .is-home .hero { padding-top: calc(clamp(72px, 8vw, 112px) + 64px); }
}
@media (max-height: 500px) {
  .is-home .hero h1 { font-size: clamp(30px, 5vw, 44px); }
}

/* Location pages, Tier 2 ("Our Appraisal Team in …"): let the heading run
   the full row instead of wrapping at the global 22ch h2 measure. */
.parent-pageid-44 .section-head h2 { max-width: none; }

/* Regional Leadership "Oversees …" pill — longer copy, allow wrapping */
.team-member .info .team-ribbon--oversees {
  white-space: normal;
  letter-spacing: 0.08em;
  line-height: 1.45;
  border-radius: 10px;
  padding: 6px 10px;
}

/* Why LPA, Tier 2: on stacked (mobile) layout the photo follows the copy */
@media (max-width: 980px) {
  .page-id-8 .why-figure--left { order: 2; }
}

/* Survey: fieldsets default to min-width: min-content, so the wide rate
   tables stretched the whole page instead of scrolling inside their wrapper. */
.survey-form fieldset { min-width: 0; }
.rate-table-wrap { -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
/* Keep the row label visible while swiping across a rate table */
.rate-table tbody th[scope="row"],
.rate-table thead th:first-child {
  position: sticky;
  left: 0;
  z-index: 1;
  box-shadow: inset -1px 0 0 var(--rule);
}
@media (max-width: 640px) {
  .rate-table tbody th[scope="row"] { white-space: normal; width: 132px; min-width: 132px; max-width: 132px; font-size: 12.5px; overflow-wrap: anywhere; line-height: 1.3; }
}

/* Locations map — zoom controls, phone layout */
.lpa-map-stage svg { touch-action: pan-y; }
.lpa-map-shell .state-fill { vector-effect: non-scaling-stroke; }
.lpa-map-controls {
  position: absolute;
  right: 12px;
  bottom: 12px;
  z-index: 3;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--rule);
  border-radius: 10px;
  overflow: hidden;
  background: var(--paper);
  box-shadow: 0 4px 14px -4px rgba(22, 38, 46, 0.18);
}
.lpa-map-controls button {
  width: 36px;
  height: 36px;
  border: 0;
  background: var(--paper);
  color: var(--ink);
  font: 700 18px/1 "Montserrat", sans-serif;
  cursor: pointer;
  transition: background 200ms, color 200ms;
}
.lpa-map-controls button + button { border-top: 1px solid var(--rule); }
.lpa-map-controls button:hover { background: var(--burgundy); color: var(--paper); }
.lpa-map-controls button:focus-visible { outline: 2px solid var(--burgundy); outline-offset: -2px; }
/* Card flips below the pin when there's no room above */
.lpa-map-card.is-below { transform: translate(-50%, 22px); animation-name: lpa-card-pop-below; }
.lpa-map-card.is-below::after {
  bottom: auto;
  top: -8px;
  border: 0;
  border-left: 1px solid var(--rule);
  border-top: 1px solid var(--rule);
}
@keyframes lpa-card-pop-below {
  from { opacity: 0; transform: translate(-50%, 8px); }
  to   { opacity: 1; transform: translate(-50%, 22px); }
}
.lpa-map-sheet { display: none; }
@media (max-width: 720px) {
  .lpa-map-stage { aspect-ratio: auto; }
  .lpa-map-stage svg { height: auto; aspect-ratio: 16 / 9; }
  .lpa-map-stage .lpa-map-legend {
    position: static;
    transform: none;
    width: fit-content;
    margin: 0 auto 10px;
  }
  .lpa-map-controls { right: 6px; bottom: 6px; }
  .lpa-map-sheet { display: block; margin-top: 12px; }
  .lpa-map-hint { margin: 0; text-align: center; font-size: 13px; color: var(--ink-soft); }
  .lpa-map-sheet .lpa-map-card {
    position: relative;
    width: 100%;
    transform: none;
    animation: lpa-card-sheet 220ms cubic-bezier(.2,.8,.2,1) both;
  }
  .lpa-map-sheet .lpa-map-card::after { display: none; }
}
@keyframes lpa-card-sheet {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: none; }
}

/* Clients quote carousel: every card matches the tallest quote (see
   main.js) — center short quotes in the extra space and keep the
   attribution pinned to the bottom. */
.quote-track blockquote { margin: auto 0; }
.quote-track figcaption { margin-top: 0; }

/* Blog/news cards: the photo is a lazy-loaded <img> layered over the
   gradient placeholder (.ins-img-bg), replacing the old background-image. */
.ins-img-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 600ms;
}
.ins-card:hover .ins-img-photo { transform: scale(1.05); }
