/* =============================================
   ARIZONA PROPERTY MANAGEMENT & INVESTMENTS
   AZ EZ Rentals — azezrentals.com
   Built by Thunderbird Agency
   ============================================= */

:root {
  /* === BRAND COLORS — to swap palette, change only these lines === */
  --c-primary:      #1A1A1A;   /* Near-black — headers, nav */
  --c-accent:       #D4721A;   /* Warm orange — CTAs, highlights */
  --c-accent-dark:  #B05A10;   /* Darker orange — hover */
  --c-cream:        #F5F0E8;   /* Section backgrounds */
  --c-cream-dark:   #EDE4D4;   /* Alternate sections */
  --c-white:        #FFFFFF;
  --c-text:         #1A1A1A;
  --c-text-mid:     #555555;
  --c-text-light:   #888888;
  --c-border:       #E0D9CE;
  --c-light-bg:     #FAF8F5;

  /* === VETERAN ACCENTS === */
  --c-navy:         #1B2A4A;
  --c-vet-red:      #8C1515;
  --c-vet-gold:     #C9A84C;

  /* === TYPOGRAPHY === */
  --font-heading: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* === EFFECTS === */
  --shadow-sm: 0 2px 8px rgba(0,0,0,0.06);
  --shadow-md: 0 4px 24px rgba(0,0,0,0.10);
  --shadow-lg: 0 8px 48px rgba(0,0,0,0.15);
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --transition: 0.25s ease;
}

/* === RESET === */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--font-body); color: var(--c-text); background: var(--c-white); line-height: 1.6; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; transition: var(--transition); }
ul { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }

/* === LAYOUT === */
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.container--wide { max-width: 1400px; margin: 0 auto; padding: 0 24px; }
.section { padding: 80px 24px; }
.section--cream { background: var(--c-cream); }
.section--dark { background: var(--c-primary); color: var(--c-white); }
.section--navy { background: var(--c-navy); color: var(--c-white); }
.section--light { background: var(--c-light-bg); }

/* === TYPOGRAPHY === */
.section-label {
  font-size: 11px; font-weight: 700; letter-spacing: 3px;
  text-transform: uppercase; color: var(--c-accent);
  margin-bottom: 12px; display: block;
}
.section-title {
  font-family: var(--font-heading);
  font-size: clamp(28px, 4vw, 44px);
  font-weight: 700; line-height: 1.2;
  color: var(--c-primary); margin-bottom: 16px;
}
.section--dark .section-title,
.section--navy .section-title { color: var(--c-white); }
.section-subtitle { font-size: 18px; color: var(--c-text-mid); max-width: 600px; line-height: 1.7; }
.section--dark .section-subtitle,
.section--navy .section-subtitle { color: rgba(255,255,255,0.8); }
.text-center { text-align: center; }
.text-center .section-subtitle { margin: 0 auto; }

/* === BUTTONS === */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 28px; border-radius: var(--radius-sm);
  font-size: 15px; font-weight: 600;
  border: 2px solid transparent; transition: var(--transition); white-space: nowrap;
}
.btn-primary { background: var(--c-accent); color: var(--c-white); border-color: var(--c-accent); }
.btn-primary:hover { background: var(--c-accent-dark); border-color: var(--c-accent-dark); transform: translateY(-1px); box-shadow: var(--shadow-md); }
.btn-outline { background: transparent; color: var(--c-primary); border-color: var(--c-primary); }
.btn-outline:hover { background: var(--c-primary); color: var(--c-white); }
.btn-outline-white { background: transparent; color: var(--c-white); border-color: rgba(255,255,255,0.6); }
.btn-outline-white:hover { background: rgba(255,255,255,0.15); border-color: var(--c-white); }
.btn-white { background: var(--c-white); color: var(--c-primary); }
.btn-white:hover { background: var(--c-cream); transform: translateY(-1px); box-shadow: var(--shadow-md); }
.btn-gold { background: var(--c-vet-gold); color: var(--c-navy); }
.btn-gold:hover { background: #b8962a; transform: translateY(-1px); }
.btn-lg { padding: 18px 36px; font-size: 17px; }
.btn-sm { padding: 10px 20px; font-size: 13px; }
.btn-full { width: 100%; justify-content: center; }

/* === VET BADGE === */
.vet-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--c-navy); color: var(--c-vet-gold);
  padding: 6px 14px; border-radius: 3px;
  font-size: 11px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
}
.vet-badge::before { content: '★'; font-size: 12px; }

/* === TOP BAR === */
.top-bar { background: var(--c-primary); color: rgba(255,255,255,0.85); padding: 8px 0; font-size: 13px; }
.top-bar__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.top-bar__left { display: flex; align-items: center; gap: 20px; }
.top-bar__phone { display: flex; align-items: center; gap: 6px; color: var(--c-white); font-weight: 600; font-size: 15px; }
.top-bar__phone:hover { color: var(--c-accent); }
.top-bar__right { display: flex; align-items: center; gap: 16px; }
.top-bar__link { color: rgba(255,255,255,0.7); font-size: 12px; font-weight: 500; }
.top-bar__link:hover { color: var(--c-white); }

/* === HEADER === */
.site-header { background: var(--c-white); border-bottom: 1px solid var(--c-border); position: sticky; top: 0; z-index: 1000; box-shadow: var(--shadow-sm); }
.header__inner { display: flex; align-items: center; justify-content: space-between; padding: 14px 24px; max-width: 1400px; margin: 0 auto; }
.header__logo img { height: 64px; width: auto; }
.main-nav { display: flex; align-items: center; gap: 2px; }
.main-nav__item { position: relative; }
.main-nav__link {
  padding: 10px 12px; font-size: 14px; font-weight: 600;
  color: var(--c-primary); border-radius: var(--radius-sm);
  display: flex; align-items: center; gap: 4px; white-space: nowrap;
}
.main-nav__link:hover { background: var(--c-cream); color: var(--c-accent); }
.chevron { width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); margin-top: -3px; }
.main-nav__dropdown {
  position: absolute; top: calc(100% + 6px); left: 0; min-width: 220px;
  background: var(--c-white); border: 1px solid var(--c-border);
  border-radius: var(--radius-md); box-shadow: var(--shadow-lg);
  opacity: 0; visibility: hidden; transform: translateY(-8px); transition: all 0.2s ease; z-index: 100;
}
.main-nav__item:hover .main-nav__dropdown { opacity: 1; visibility: visible; transform: translateY(0); }
.main-nav__dropdown a { display: block; padding: 11px 16px; font-size: 13px; font-weight: 500; color: var(--c-text); border-bottom: 1px solid var(--c-border); }
.main-nav__dropdown li:last-child a { border-bottom: none; }
.main-nav__dropdown a:hover { background: var(--c-cream); color: var(--c-accent); }
.header__cta { display: flex; align-items: center; gap: 10px; }
.mobile-toggle { display: none; flex-direction: column; gap: 5px; padding: 8px; background: none; border: none; }
.mobile-toggle span { display: block; width: 24px; height: 2px; background: var(--c-primary); transition: var(--transition); }
.mobile-close { display: none; position: absolute; top: 20px; right: 20px; font-size: 28px; color: var(--c-primary); background: none; border: none; z-index: 1001; }

@media (max-width: 1024px) {
  .main-nav, .header__cta .btn-outline { display: none; }
  .mobile-toggle { display: flex; }
  .main-nav.open {
    display: flex; flex-direction: column; position: fixed;
    inset: 0; background: var(--c-white); padding: 72px 24px 24px;
    z-index: 999; overflow-y: auto; gap: 0;
  }
  .main-nav.open .mobile-close { display: block; }
  .main-nav.open .main-nav__link { font-size: 17px; padding: 14px 0; border-bottom: 1px solid var(--c-border); border-radius: 0; }
  .main-nav.open .main-nav__dropdown { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: none; border-radius: 0; background: var(--c-cream); margin: 4px 0 8px; }
  .main-nav.open .main-nav__dropdown a { padding: 10px 16px; }
}

/* === HERO === */
.hero {
  position: relative;
  background: linear-gradient(160deg, #FFFFFF 0%, var(--c-cream) 55%, var(--c-cream-dark) 100%);
  color: var(--c-primary); padding: 100px 24px 80px; overflow: hidden;
  border-bottom: 1px solid var(--c-border);
}
.hero::after {
  content: '';
  position: absolute; inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23D4721A' fill-opacity='0.025'%3E%3Cpath d='M40 40m-2 0a2 2 0 1 1 4 0a2 2 0 1 1-4 0'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  pointer-events: none; z-index: 0;
}
.hero__inner { position: relative; z-index: 1; max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 60px; align-items: center; }
.hero__vet { margin-bottom: 20px; }
.hero__title { font-family: var(--font-heading); font-size: clamp(36px, 5vw, 64px); font-weight: 700; line-height: 1.1; color: var(--c-primary); margin-bottom: 8px; }
.hero__title-sub { font-family: var(--font-heading); font-size: clamp(20px, 3vw, 32px); font-weight: 400; color: var(--c-accent); font-style: italic; margin-bottom: 24px; display: block; }
.hero__subtitle { font-size: 17px; line-height: 1.7; color: var(--c-text-mid); margin-bottom: 36px; max-width: 520px; }
.hero__actions { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 44px; }
.hero__stats { display: flex; gap: 32px; flex-wrap: wrap; padding-top: 32px; border-top: 1px solid var(--c-border); }
.hero__stat-num { font-family: var(--font-heading); font-size: 30px; font-weight: 700; color: var(--c-accent); line-height: 1; margin-bottom: 4px; }
.hero__stat-label { font-size: 11px; color: var(--c-text-light); font-weight: 500; text-transform: uppercase; letter-spacing: 1px; }
.hero__card { background: var(--c-white); border: 1px solid var(--c-border); border-radius: var(--radius-lg); padding: 0; box-shadow: var(--shadow-md); overflow: hidden; }
.hero__video { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-md); width: 100%; }
.hero__video wistia-player { display: block; width: 100%; border-radius: var(--radius-lg); }
.hero__card-img { width: 100%; height: 200px; background: linear-gradient(135deg, var(--c-cream-dark) 0%, #d9ccb8 100%); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: var(--c-text-light); font-size: 14px; border-bottom: 1px solid var(--c-border); position: relative; }
.hero__card-img-icon { font-size: 48px; opacity: 0.5; }
.hero__card-img-label { font-size: 12px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; color: var(--c-text-light); }
.hero__card-img img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.hero__card-links { padding: 24px; }
.hero__card h3 { font-family: var(--font-heading); font-size: 16px; color: var(--c-primary); margin-bottom: 14px; }
.hero__quick-links { display: flex; flex-direction: column; gap: 8px; }
.hero__quick-link { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; background: var(--c-light-bg); border-radius: var(--radius-sm); color: var(--c-text); font-weight: 500; font-size: 14px; transition: var(--transition); border: 1px solid var(--c-border); }
.hero__quick-link:hover { background: var(--c-accent); border-color: var(--c-accent); color: var(--c-white); transform: translateX(4px); }
.hero__quick-link-icon { font-size: 18px; }

@media (max-width: 900px) { .hero { padding: 60px 24px; } .hero__inner { grid-template-columns: 1fr; gap: 40px; } .hero__card { display: none; } .hero__video { display: none; } }

/* === IMAGE & VIDEO PLACEHOLDERS === */
.img-placeholder {
  background: linear-gradient(135deg, var(--c-cream-dark) 0%, #d9ccb8 100%);
  border-radius: var(--radius-lg); border: 1px solid var(--c-border);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 12px; color: var(--c-text-light); text-align: center; padding: 32px;
  position: relative; overflow: hidden;
}
.img-placeholder img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.img-placeholder__icon { font-size: 40px; opacity: 0.4; position: relative; z-index: 1; }
.img-placeholder__label { font-size: 12px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--c-text-light); position: relative; z-index: 1; }

/* === VIDEO SECTION === */
.video-section { background: var(--c-cream); padding: 80px 24px; color: var(--c-primary); }
.video-section__inner { max-width: 1000px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.video-placeholder {
  background: #111111; border-radius: var(--radius-lg); aspect-ratio: 16/9;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid rgba(255,255,255,0.1); cursor: pointer; position: relative; overflow: hidden;
  transition: var(--transition);
}
.video-placeholder:hover { border-color: var(--c-accent); }
.video-placeholder__bg { position: absolute; inset: 0; background: linear-gradient(135deg, #1a1a2e 0%, #111 100%); opacity: 0.9; }
.video-placeholder__play {
  width: 72px; height: 72px; background: var(--c-accent); border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 28px; color: var(--c-white); position: relative; z-index: 1;
  box-shadow: 0 0 0 12px rgba(212,114,26,0.15); transition: var(--transition);
}
.video-placeholder:hover .video-placeholder__play { transform: scale(1.08); box-shadow: 0 0 0 16px rgba(212,114,26,0.2); }
.video-placeholder__label { position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%); font-size: 11px; color: rgba(255,255,255,0.5); letter-spacing: 1.5px; text-transform: uppercase; font-weight: 700; z-index: 1; white-space: nowrap; }
.video-section__text h2 { font-family: var(--font-heading); font-size: clamp(26px, 3.5vw, 40px); color: var(--c-primary); margin-bottom: 16px; line-height: 1.25; }
.video-section__text p { font-size: 16px; color: var(--c-text-mid); line-height: 1.75; margin-bottom: 28px; }
@media (max-width: 768px) { .video-section__inner { grid-template-columns: 1fr; } }

/* === TRUST BAR === */
.trust-bar { background: var(--c-primary); border-bottom: 3px solid var(--c-accent); }
.trust-bar__inner { display: grid; grid-template-columns: repeat(5, 1fr); max-width: 1400px; margin: 0 auto; }
.trust-bar__item { padding: 22px 16px; text-align: center; border-right: 1px solid rgba(255,255,255,0.1); display: flex; flex-direction: column; align-items: center; gap: 5px; }
.trust-bar__item:last-child { border-right: none; }
.trust-bar__icon { font-size: 22px; margin-bottom: 2px; }
.trust-bar__num { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--c-accent); line-height: 1; }
.trust-bar__label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.5px; color: rgba(255,255,255,0.7); }

@media (max-width: 768px) { .trust-bar__inner { grid-template-columns: repeat(2, 1fr); } .trust-bar__item:nth-child(2) { border-right: none; } .trust-bar__item:nth-child(5) { grid-column: 1/-1; border-top: 1px solid var(--c-border); border-right: none; } }

/* === AUDIENCE LANES === */
.audience-lanes { padding: 64px 24px; background: var(--c-white); }
.audience-lanes__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; max-width: 1200px; margin: 0 auto; }
.audience-card { border-radius: var(--radius-lg); padding: 40px 32px; position: relative; overflow: hidden; transition: var(--transition); border: 1px solid transparent; }
.audience-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.audience-card--owner { background: var(--c-white); border: 1px solid var(--c-border); border-top: 4px solid var(--c-accent); box-shadow: var(--shadow-sm); }
.audience-card--tenant { background: var(--c-white); border: 1px solid var(--c-border); border-top: 4px solid #2465C9; box-shadow: var(--shadow-sm); }
.audience-card--investor { background: var(--c-white); border: 1px solid var(--c-border); border-top: 4px solid var(--c-vet-gold); box-shadow: var(--shadow-sm); }
.audience-card__icon { font-size: 44px; margin-bottom: 20px; }
.audience-card__label { font-size: 11px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 10px; display: block; }
.audience-card--tenant .audience-card__label { color: #2465C9; }
.audience-card--investor .audience-card__label { color: #8a6a00; }
.audience-card__title { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--c-primary); margin-bottom: 12px; }
.audience-card__text { font-size: 15px; color: var(--c-text-mid); line-height: 1.7; margin-bottom: 28px; }
.audience-card__links { display: flex; flex-direction: column; gap: 10px; }
.audience-card__link { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; background: var(--c-light-bg); border-radius: var(--radius-sm); color: var(--c-text); font-size: 13px; font-weight: 500; transition: var(--transition); border: 1px solid var(--c-border); }
.audience-card__link:hover { background: var(--c-cream); color: var(--c-accent); padding-left: 20px; }

@media (max-width: 768px) { .audience-lanes__grid { grid-template-columns: 1fr; } }

/* === AREA MAP === */
.area-map { background: var(--c-cream); padding: 80px 24px; }
.area-map__header { text-align: center; max-width: 600px; margin: 0 auto 48px; }
.area-map__container { max-width: 860px; margin: 0 auto; }
.area-map__wrap { background: var(--c-white); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); padding: 28px; border: 1px solid var(--c-border); }
.area-map__wrap svg { width: 100%; height: auto; display: block; }
.map-city { cursor: pointer; transition: all 0.2s ease; }
.map-city rect { fill: var(--c-light-bg); stroke: var(--c-border); stroke-width: 1.5; transition: all 0.2s ease; rx: 6; }
.map-city:hover rect { fill: var(--c-accent); stroke: var(--c-accent-dark); }
.map-city text { font-family: var(--font-body); font-size: 10px; font-weight: 700; fill: var(--c-primary); text-anchor: middle; dominant-baseline: middle; pointer-events: none; transition: all 0.2s ease; letter-spacing: 0.5px; text-transform: uppercase; }
.map-city text.city-sub { font-size: 8px; font-weight: 400; fill: var(--c-text-light); }
.map-city:hover text { fill: var(--c-white); }
.map-city:hover text.city-sub { fill: rgba(255,255,255,0.8); }
.map-label { font-family: var(--font-body); font-size: 9px; font-weight: 800; fill: var(--c-text-light); letter-spacing: 2px; text-transform: uppercase; }
.area-map__note { text-align: center; margin-top: 16px; font-size: 13px; color: var(--c-text-light); }

/* === PILLARS === */
.pillars { background: var(--c-white); padding: 80px 24px; }
.pillars__header { text-align: center; max-width: 680px; margin: 0 auto 56px; }
.pillars__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; max-width: 1200px; margin: 0 auto; }
.pillar-card { padding: 32px 24px; border-radius: var(--radius-lg); border: 1px solid var(--c-border); background: var(--c-light-bg); transition: var(--transition); position: relative; overflow: hidden; }
.pillar-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--c-accent); transform: scaleX(0); transform-origin: left; transition: transform 0.3s ease; }
.pillar-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: var(--c-accent); }
.pillar-card:hover::before { transform: scaleX(1); }
.pillar-card__num { font-family: var(--font-heading); font-size: 52px; font-weight: 700; color: var(--c-cream-dark); line-height: 1; margin-bottom: 16px; }
.pillar-card__title { font-family: var(--font-heading); font-size: 18px; font-weight: 700; color: var(--c-primary); margin-bottom: 10px; }
.pillar-card__text { font-size: 14px; color: var(--c-text-mid); line-height: 1.7; }
.pillar-card__features { margin-top: 16px; display: flex; flex-direction: column; gap: 8px; }
.pillar-card__feature { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; color: var(--c-text-mid); }
.pillar-card__feature::before { content: '✓'; color: var(--c-accent); font-weight: 700; flex-shrink: 0; }

@media (max-width: 768px) { .pillars__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .pillars__grid { grid-template-columns: 1fr; } }

/* === STATS === */
.stats-section { background: linear-gradient(135deg, var(--c-primary) 0%, #2C2C2C 100%); padding: 80px 24px; }
.stats-section__header { text-align: center; margin-bottom: 56px; }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; max-width: 1200px; margin: 0 auto 48px; }
.stat-card { text-align: center; padding: 28px 20px; border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius-lg); background: rgba(255,255,255,0.06); }
.stat-card__num { font-family: var(--font-heading); font-size: 44px; font-weight: 700; color: var(--c-accent); line-height: 1; margin-bottom: 8px; }
.stat-card__label { font-size: 13px; color: rgba(255,255,255,0.75); font-weight: 500; line-height: 1.5; }
.stats-cta { text-align: center; }

@media (max-width: 768px) { .stats-grid { grid-template-columns: repeat(2, 1fr); } }

/* === 24/7 MAINTENANCE === */
.maintenance-section { background: var(--c-cream); padding: 80px 24px; color: var(--c-primary); }
.maintenance-section__inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.maintenance-section__badge { display: inline-flex; align-items: center; gap: 8px; background: rgba(212,114,26,0.1); border: 1px solid var(--c-accent); color: var(--c-accent); padding: 6px 14px; border-radius: 3px; font-size: 11px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 20px; }
.maintenance-section__title { font-family: var(--font-heading); font-size: clamp(28px, 4vw, 44px); color: var(--c-primary); margin-bottom: 20px; line-height: 1.2; }
.maintenance-section__title span { color: var(--c-accent); }
.maintenance-section__text { font-size: 16px; color: var(--c-text-mid); line-height: 1.75; margin-bottom: 32px; }
.maintenance-section__features { display: flex; flex-direction: column; gap: 16px; margin-bottom: 36px; }
.maintenance-section__feature { display: flex; align-items: center; gap: 14px; font-size: 15px; color: var(--c-text); }
.feature-icon { width: 38px; height: 38px; background: rgba(212,114,26,0.2); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; }
.maintenance-section__visual { background: var(--c-white); border: 1px solid var(--c-border); border-radius: var(--radius-lg); padding: 36px 32px; }
.maintenance-visual__title { font-family: var(--font-heading); font-size: 20px; color: var(--c-white); margin-bottom: 6px; }
.maintenance-visual__sub { font-size: 12px; color: rgba(255,255,255,0.55); margin-bottom: 24px; }
.chat-bubbles { display: flex; flex-direction: column; gap: 10px; }
.chat-bubble { padding: 13px 17px; border-radius: 12px; font-size: 14px; max-width: 88%; line-height: 1.5; }
.chat-bubble--in { background: rgba(255,255,255,0.1); color: rgba(255,255,255,0.9); border-radius: 12px 12px 12px 0; align-self: flex-start; }
.chat-bubble--out { background: var(--c-accent); color: var(--c-white); border-radius: 12px 12px 0 12px; align-self: flex-end; }
.chat-bubble--sys { background: rgba(201,168,76,0.15); border: 1px solid rgba(201,168,76,0.3); color: var(--c-vet-gold); font-size: 11px; font-weight: 700; text-align: center; align-self: center; border-radius: 20px; padding: 6px 16px; max-width: 100%; }

@media (max-width: 768px) { .maintenance-section__inner { grid-template-columns: 1fr; } }

/* === VETERAN SECTION === */
.veteran-section { background: var(--c-cream-dark); padding: 80px 24px; color: var(--c-primary); position: relative; overflow: hidden; border-top: 4px solid var(--c-navy); }
.veteran-section::before { content: '★'; position: absolute; font-size: 500px; color: rgba(27,42,74,0.04); top: 50%; left: 50%; transform: translate(-50%, -50%); pointer-events: none; }
.veteran-section__inner { position: relative; z-index: 1; max-width: 800px; margin: 0 auto; text-align: center; }
.veteran-seal { width: 80px; height: 80px; background: var(--c-navy); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 38px; margin: 0 auto 28px; border: 4px solid rgba(27,42,74,0.2); }
.veteran-section__title { font-family: var(--font-heading); font-size: clamp(28px, 4vw, 46px); color: var(--c-primary); margin-bottom: 20px; line-height: 1.2; }
.veteran-section__title span { color: var(--c-navy); }
.veteran-section__text { font-size: 17px; color: var(--c-text-mid); line-height: 1.8; margin-bottom: 40px; max-width: 680px; margin-left: auto; margin-right: auto; }
.veteran-values { display: flex; justify-content: center; gap: 48px; flex-wrap: wrap; margin-bottom: 40px; }
.veteran-value__icon { font-size: 30px; margin-bottom: 10px; }
.veteran-value__label { font-size: 11px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--c-navy); }

/* === TESTIMONIALS === */
.testimonials { background: var(--c-cream); padding: 80px 24px; }
.testimonials__header { text-align: center; max-width: 600px; margin: 0 auto 48px; }
.testimonials__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; max-width: 1200px; margin: 0 auto 40px; }
.testimonial-card { background: var(--c-white); border-radius: var(--radius-lg); padding: 32px; box-shadow: var(--shadow-sm); border: 1px solid var(--c-border); transition: var(--transition); }
.testimonial-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.testimonial-card__stars { color: var(--c-accent); font-size: 16px; margin-bottom: 16px; letter-spacing: 2px; }
.testimonial-card__text { font-size: 15px; color: var(--c-text-mid); line-height: 1.75; margin-bottom: 20px; font-style: italic; }
.testimonial-card__author { display: flex; align-items: center; gap: 12px; }
.testimonial-card__avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--c-cream-dark); display: flex; align-items: center; justify-content: center; font-weight: 700; color: var(--c-primary); font-size: 16px; flex-shrink: 0; }
.testimonial-card__name { font-weight: 700; font-size: 14px; color: var(--c-primary); }
.testimonial-card__role { font-size: 12px; color: var(--c-text-light); }
.testimonials__cta { text-align: center; display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; margin-top: 24px; }
.testimonials__cta .btn { padding: 10px 20px !important; font-size: 13px !important; font-weight: 600 !important; }

@media (max-width: 768px) { .testimonials__grid { grid-template-columns: 1fr; } }

/* === TEAM === */
.team-preview { background: var(--c-white); padding: 80px 24px; }
.team-preview__header { text-align: center; max-width: 600px; margin: 0 auto 48px; }
.team-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 28px; max-width: 900px; margin: 0 auto 40px; }
.team-grid .team-member-card { width: 400px; flex-shrink: 0; }
.team-card { text-align: center; padding: 36px 28px; border-radius: var(--radius-lg); border: 1px solid var(--c-border); transition: var(--transition); }
.team-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: var(--c-accent); }
.team-card__photo { width: 100px; height: 100px; border-radius: 50%; object-fit: cover; margin: 0 auto 20px; border: 3px solid var(--c-accent); background: var(--c-cream); display: flex; align-items: center; justify-content: center; font-size: 36px; color: var(--c-primary); overflow: hidden; }
.team-card__photo img { width: 100%; height: 100%; object-fit: cover; }
.team-card__name { font-family: var(--font-heading); font-size: 20px; font-weight: 700; color: var(--c-primary); margin-bottom: 6px; }
.team-card__title { font-size: 12px; color: var(--c-accent); font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 14px; }
.team-card__bio { font-size: 14px; color: var(--c-text-mid); line-height: 1.65; }
.team-card__links { display: flex; justify-content: center; gap: 10px; margin-top: 16px; }
.team-card__link { font-size: 13px; color: var(--c-accent); font-weight: 600; }
.team-card__link:hover { color: var(--c-accent-dark); }

@media (max-width: 768px) { .team-grid .team-member-card { width: 100%; max-width: 400px; } }

/* ── PROFILE CREDENTIALS BAND ── */
.profile-creds { background: var(--c-primary); padding: 56px 24px; border-top: 1px solid rgba(255,255,255,0.06); }
.profile-creds__inner { max-width: 860px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.profile-creds__item { padding: 32px 20px; text-align: center; border-right: 1px solid rgba(255,255,255,0.07); position: relative; transition: background 0.2s; }
.profile-creds__item:last-child { border-right: none; }
.profile-creds__item:hover { background: rgba(212,114,26,0.06); }
.profile-creds__value { font-family: var(--font-heading); font-size: 38px; font-weight: 700; color: var(--c-accent); line-height: 1; margin-bottom: 10px; }
.profile-creds__label { font-size: 12px; color: rgba(255,255,255,0.48); font-weight: 500; line-height: 1.55; letter-spacing: 0.03em; text-transform: uppercase; }
@media (max-width: 600px) { .profile-creds__item { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.07); padding: 28px 16px; } .profile-creds__item:last-child { border-bottom: none; } }

/* ── AGENT LISTINGS SECTION ── */
.agent-listings { background: var(--c-primary); padding: 60px 24px 52px; }
.agent-listings__inner { max-width: 920px; margin: 0 auto; }
.agent-listings__header { margin-bottom: 28px; }
.agent-listings__header .section-label { color: var(--c-accent); opacity: 0.85; }
.agent-listings__title { font-family: var(--font-heading); font-size: clamp(22px, 3vw, 28px); color: #fff; margin-top: 8px; margin-bottom: 0; }
.agent-listings__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px; margin-bottom: 32px; }
.agent-listings__footer { text-align: center; }

.alc { display: block; text-decoration: none; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.09); border-top: 3px solid var(--c-accent); border-radius: 12px; padding: 22px 22px 20px; transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease; }
.alc:hover { transform: translateY(-4px); box-shadow: 0 10px 30px rgba(212,114,26,0.22); border-color: rgba(212,114,26,0.45); }
.alc__badge { display: inline-block; background: rgba(212,114,26,0.18); color: var(--c-accent); font-size: 9.5px; font-weight: 800; letter-spacing: 0.13em; text-transform: uppercase; padding: 3px 10px; border-radius: 50px; border: 1px solid rgba(212,114,26,0.3); margin-bottom: 14px; }
.alc__city { font-size: 10.5px; color: rgba(255,255,255,0.4); font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 5px; }
.alc__address { font-size: 16px; font-weight: 700; color: #fff; margin-bottom: 12px; line-height: 1.3; }
.alc__stats { display: flex; gap: 14px; font-size: 12.5px; color: rgba(255,255,255,0.52); margin-bottom: 16px; flex-wrap: wrap; }
.alc__stat { display: flex; align-items: center; gap: 4px; }
.alc__price { font-size: 24px; font-weight: 800; color: var(--c-accent); line-height: 1; }
.alc__price-unit { font-size: 13px; font-weight: 500; color: rgba(255,255,255,0.4); margin-left: 2px; }

/* ── WE MANAGE IT. YOU PROFIT. ── */
.manage-profit { background: var(--c-white); padding: 0 24px 72px; border-top: 4px solid var(--c-accent); }
.manage-profit__inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: start; }
.manage-profit__text .section-label { display: block; margin-bottom: 16px; }
.manage-profit__title { font-family: var(--font-heading); font-size: clamp(32px, 4.5vw, 54px); color: var(--c-primary); line-height: 1.15; margin-bottom: 20px; }
.manage-profit__title span { color: var(--c-accent); }
.manage-profit__desc { font-size: 17px; color: var(--c-text-mid); line-height: 1.8; margin-bottom: 28px; }
.manage-profit__list { list-style: none; padding: 0; margin: 0 0 32px; display: flex; flex-direction: column; gap: 12px; }
.manage-profit__list--grid { display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px 20px !important; }
.manage-profit__list li { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--c-text); }
.manage-profit__list li span { width: 20px; height: 20px; background: var(--c-accent); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 800; color: var(--c-white); flex-shrink: 0; }
.manage-profit__image { border-radius: var(--radius-lg); overflow: hidden; box-shadow: 0 8px 24px rgba(0,0,0,0.10); min-height: 420px; background: var(--c-cream-dark); }
.manage-profit__image img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 900px) { .manage-profit__inner { grid-template-columns: 1fr; } .manage-profit__image { min-height: 280px; } }

/* ── TEAM PHOTO STRIP MARQUEE ── */
.team-strip { background: var(--c-white); padding: 80px 0; overflow: hidden; }
.team-strip__header { text-align: center; max-width: 600px; margin: 0 auto 48px; padding: 0 24px; }
.team-marquee { width: 100%; overflow: hidden; position: relative; }
.team-marquee::before, .team-marquee::after { content: ''; position: absolute; top: 0; bottom: 0; width: 80px; z-index: 2; pointer-events: none; }
.team-marquee::before { left: 0; background: linear-gradient(to right, var(--c-white), transparent); }
.team-marquee::after { right: 0; background: linear-gradient(to left, var(--c-white), transparent); }
.team-marquee__track { display: flex; gap: 28px; width: max-content; animation: team-scroll 40s linear infinite; padding: 8px 14px; }
.team-marquee__track:hover { animation-play-state: paused; }
@keyframes team-scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
.team-photo-card { width: 260px; flex-shrink: 0; border-radius: var(--radius-lg); overflow: hidden; background: var(--c-cream); border: 1px solid var(--c-border); box-shadow: var(--shadow-sm); transition: var(--transition); }
.team-photo-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: var(--c-accent); }
.team-photo-card img { width: 100%; height: 300px; object-fit: cover; object-position: top; display: block; background: var(--c-cream-dark); }
.team-photo-card__info { padding: 20px; }
.team-photo-card__name { font-family: var(--font-heading); font-size: 17px; font-weight: 700; color: var(--c-primary); margin-bottom: 4px; }
.team-photo-card__role { font-size: 12px; color: var(--c-accent); font-weight: 700; text-transform: uppercase; letter-spacing: 1.2px; }

/* === LEAD CAPTURE === */
.lead-capture { background: var(--c-cream); padding: 80px 24px; border-top: 4px solid var(--c-accent); }
.lead-capture__inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.lead-capture__title { font-family: var(--font-heading); font-size: clamp(28px, 4vw, 44px); color: var(--c-primary); margin-bottom: 16px; line-height: 1.2; }
.lead-capture__text { font-size: 16px; color: var(--c-text-mid); line-height: 1.75; margin-bottom: 28px; }
.lead-capture__includes { display: flex; flex-direction: column; gap: 12px; }
.lead-capture__include { display: flex; align-items: center; gap: 12px; font-size: 15px; color: var(--c-text); }
.lead-capture__include-icon { width: 22px; height: 22px; background: var(--c-accent); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; flex-shrink: 0; color: var(--c-white); }
.lead-form { background: var(--c-white); border-radius: var(--radius-lg); padding: 40px; box-shadow: var(--shadow-lg); }
.lead-form__title { font-family: var(--font-heading); font-size: 22px; color: var(--c-primary); margin-bottom: 24px; text-align: center; }
.form-group { margin-bottom: 16px; }
.form-group label { display: block; font-size: 12px; font-weight: 700; color: var(--c-text); margin-bottom: 6px; text-transform: uppercase; letter-spacing: 0.5px; }
.form-group input, .form-group select, .form-group textarea { width: 100%; padding: 12px 16px; border: 1.5px solid var(--c-border); border-radius: var(--radius-sm); font-family: var(--font-body); font-size: 14px; color: var(--c-text); background: var(--c-white); transition: var(--transition); outline: none; appearance: none; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color: var(--c-accent); box-shadow: 0 0 0 3px rgba(212,114,26,0.1); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.form-note { font-size: 12px; color: var(--c-text-light); text-align: center; margin-top: 12px; }
/* GHL FORM SLOT */
.ghl-form-embed { min-height: 200px; }

@media (max-width: 768px) { .lead-capture__inner { grid-template-columns: 1fr; } .form-row { grid-template-columns: 1fr; } }

/* === FOOTER === */
.site-footer { background: var(--c-primary); color: rgba(255,255,255,0.75); padding: 64px 24px 32px; }
.footer__grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 40px; max-width: 1200px; margin: 0 auto 48px; }
.footer__logo { height: 110px; width: auto; margin-bottom: 18px; }
.footer__tagline { font-family: var(--font-heading); font-size: 15px; color: var(--c-accent); margin-bottom: 12px; font-style: italic; }
.footer__desc { font-size: 13px; line-height: 1.7; color: rgba(255,255,255,0.6); margin-bottom: 20px; }
.footer__vet { margin-bottom: 20px; }
.footer__social { display: flex; gap: 8px; }
.footer__social-link { width: 34px; height: 34px; background: rgba(255,255,255,0.08); border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; font-size: 13px; color: rgba(255,255,255,0.65); transition: var(--transition); }
.footer__social-link:hover { background: var(--c-accent); color: var(--c-white); }
.footer__col-title { font-size: 11px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 20px; }
.footer__links { display: flex; flex-direction: column; gap: 10px; }
.footer__link { font-size: 13px; color: rgba(255,255,255,0.6); }
.footer__link:hover { color: var(--c-white); }
.footer__bottom { border-top: 1px solid rgba(255,255,255,0.1); padding-top: 24px; max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.footer__copy { font-size: 12px; color: rgba(255,255,255,0.45); }
.footer__bottom-links { display: flex; gap: 20px; }
.footer__bottom-link { font-size: 12px; color: rgba(255,255,255,0.45); }
.footer__bottom-link:hover { color: rgba(255,255,255,0.85); }

@media (max-width: 768px) { .footer__grid { grid-template-columns: 1fr 1fr; } .footer__grid > *:first-child { grid-column: 1/-1; } .footer__bottom { flex-direction: column; text-align: center; } }
@media (max-width: 480px) { .footer__grid { grid-template-columns: 1fr; } }

/* === PAGE HERO (Interior) === */
.page-hero { background: #1A1A1A; border-bottom: 3px solid #D4721A; padding: 72px 24px 68px; color: var(--c-white); }
.page-hero__inner { max-width: 1200px; margin: 0 auto; }
.breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 12px; color: rgba(255,255,255,0.45); margin-bottom: 22px; }
.breadcrumb a { color: rgba(255,255,255,0.45); }
.breadcrumb a:hover { color: var(--c-accent); }
.breadcrumb__sep { color: rgba(255,255,255,0.25); }
.page-hero__eyebrow { font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: #D4721A; margin-bottom: 16px; }
.page-hero__title { font-family: var(--font-heading); font-size: clamp(32px, 4vw, 52px); color: var(--c-white); margin-bottom: 16px; line-height: 1.2; }
.page-hero__title em { color: #D4721A; font-style: normal; }
.page-hero__subtitle { font-size: 17px; color: rgba(255,255,255,0.68); max-width: 640px; line-height: 1.7; }
.page-hero__trust { display: flex; gap: 20px; flex-wrap: nowrap; margin-top: 24px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,0.1); }
.page-hero__chip { display: flex; align-items: center; gap: 6px; font-size: 12px; color: rgba(255,255,255,0.5); white-space: nowrap; }
.page-hero__chip strong { color: #fff; font-weight: 600; }
.page-hero__chip--accent { color: rgba(212,114,26,0.9); }
.page-hero__chip--accent strong { color: #D4721A; }

/* === COMPARISON TABLE === */
.comparison-table { max-width: 820px; margin: 0 auto; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-md); }
.comparison-row { display: grid; grid-template-columns: 2.5fr 1fr 1fr; background: var(--c-white); border-bottom: 1px solid var(--c-border); }
.comparison-row--header { background: var(--c-primary); }
.comparison-cell { padding: 15px 20px; font-size: 14px; display: flex; align-items: center; }
.comparison-row--header .comparison-cell { font-weight: 700; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; color: var(--c-white); }
.comparison-cell:not(:first-child) { justify-content: center; border-left: 1px solid var(--c-border); }
.comparison-row--header .comparison-cell:not(:first-child) { border-left-color: rgba(255,255,255,0.2); }
.comparison-cell--apmi { background: rgba(212,114,26,0.05); font-weight: 600; color: var(--c-primary); }
.check { color: var(--c-accent); font-size: 20px; font-weight: 700; }
.ex { color: #B22234; font-size: 20px; }
.partial { color: var(--c-text-light); font-size: 14px; }

/* === INFO CARDS === */
.info-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; max-width: 1200px; margin: 0 auto; }
.info-card { background: var(--c-white); border-radius: var(--radius-lg); padding: 32px; border: 1px solid var(--c-border); box-shadow: var(--shadow-sm); }
.info-card__icon { font-size: 36px; margin-bottom: 16px; }
.info-card__title { font-family: var(--font-heading); font-size: 20px; font-weight: 700; color: var(--c-primary); margin-bottom: 10px; }
.info-card__text { font-size: 14px; color: var(--c-text-mid); line-height: 1.7; }

@media (max-width: 768px) { .info-grid { grid-template-columns: 1fr; } }

/* === CONTACT FORM PAGE === */
.contact-layout { display: grid; grid-template-columns: 1fr 1.3fr; gap: 60px; max-width: 1200px; margin: 0 auto; align-items: start; }
.contact-info__item { display: flex; gap: 16px; margin-bottom: 28px; align-items: flex-start; }
.contact-info__icon { width: 44px; height: 44px; background: var(--c-cream); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; border: 1px solid var(--c-border); }
.contact-info__label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; color: var(--c-text-light); margin-bottom: 4px; }
.contact-info__value { font-size: 16px; font-weight: 600; color: var(--c-primary); }
.contact-info__value a { color: var(--c-primary); }
.contact-info__value a:hover { color: var(--c-accent); }

@media (max-width: 768px) { .contact-layout { grid-template-columns: 1fr; } }

/* === PORTAL BUTTONS === */
.portal-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; max-width: 700px; margin: 0 auto; }
.portal-card { background: var(--c-white); border: 1px solid var(--c-border); border-radius: var(--radius-lg); padding: 36px 28px; text-align: center; transition: var(--transition); box-shadow: var(--shadow-sm); }
.portal-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: var(--c-accent); }
.portal-card__icon { font-size: 48px; margin-bottom: 16px; }
.portal-card__title { font-family: var(--font-heading); font-size: 22px; color: var(--c-primary); margin-bottom: 10px; }
.portal-card__text { font-size: 14px; color: var(--c-text-mid); margin-bottom: 24px; line-height: 1.6; }

@media (max-width: 480px) { .portal-grid { grid-template-columns: 1fr; } }

/* === WHY US LIST === */
.reason-list { max-width: 900px; margin: 0 auto; display: flex; flex-direction: column; gap: 24px; }
.reason-item { display: flex; gap: 24px; background: var(--c-white); border-radius: var(--radius-lg); padding: 28px 32px; border: 1px solid var(--c-border); box-shadow: var(--shadow-sm); align-items: flex-start; }
.reason-item__num { font-family: var(--font-heading); font-size: 52px; font-weight: 700; color: var(--c-cream-dark); line-height: 1; flex-shrink: 0; min-width: 56px; }
.reason-item__title { font-family: var(--font-heading); font-size: 20px; font-weight: 700; color: var(--c-primary); margin-bottom: 8px; }
.reason-item__text { font-size: 15px; color: var(--c-text-mid); line-height: 1.7; }

@media (max-width: 600px) { .reason-item { flex-direction: column; gap: 12px; } .reason-item__num { font-size: 36px; } }

/* === MISC HELPERS === */
.mt-8 { margin-top: 8px; } .mt-16 { margin-top: 16px; } .mt-24 { margin-top: 24px; } .mt-32 { margin-top: 32px; } .mt-48 { margin-top: 48px; }
.mb-8 { margin-bottom: 8px; } .mb-16 { margin-bottom: 16px; } .mb-24 { margin-bottom: 24px; } .mb-32 { margin-bottom: 32px; }
.flex-center { display: flex; justify-content: center; }
.gap-16 { gap: 16px; }

/* === ANIMATIONS === */
@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
.fade-up { opacity: 0; animation: fadeUp 0.6s ease forwards; }
.fade-up:nth-child(2) { animation-delay: 0.1s; }
.fade-up:nth-child(3) { animation-delay: 0.2s; }
.fade-up:nth-child(4) { animation-delay: 0.3s; }

/* =============================================
   AREA MAP — DARK GEOGRAPHIC PIN MAP
   ============================================= */
.area-map {
  background: var(--c-primary);
  padding: 80px 0 60px;
}
.area-map .section-label { color: var(--c-accent); }
.area-map__inner {
  display: grid;
  grid-template-columns: 210px 1fr;
  gap: 0;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 24px;
  align-items: start;
}
/* SIDEBAR */
.area-map__sidebar {
  padding: 8px 0 20px;
  border-right: 1px solid rgba(255,255,255,0.08);
  padding-right: 24px;
}
.area-map__sidebar-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 3px;
  color: var(--c-accent);
  margin-bottom: 18px;
  display: block;
}
.area-list { display: flex; flex-direction: column; gap: 2px; margin-bottom: 20px; }
.area-btn {
  width: 100%;
  text-align: left;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.45);
  background: transparent;
  border-left: 3px solid transparent;
  transition: all 0.2s;
  cursor: pointer;
}
.area-btn:hover {
  color: rgba(255,255,255,0.9);
  background: rgba(255,255,255,0.04);
  border-left-color: rgba(201,168,76,0.5);
}
.area-btn.active {
  color: var(--c-accent);
  background: rgba(212,114,26,0.1);
  border-left-color: var(--c-accent);
}
.area-map__view-all {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: var(--c-accent);
  letter-spacing: 0.5px;
  padding: 8px 12px;
  transition: opacity 0.2s;
}
.area-map__view-all:hover { opacity: 0.75; }

/* MAP CANVAS */
.area-map__canvas {
  padding-left: 32px;
  border-radius: 0 10px 10px 0;
  overflow: hidden;
}
.area-map__canvas svg {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
}

/* SVG METRO SHAPE */
.metro-shape {
  fill: #1a1a1a;
  stroke: rgba(255,255,255,0.12);
  stroke-width: 2;
}

/* FREEWAYS */
.fw-interstate {
  fill: none;
  stroke: #C9A84C;
  stroke-width: 2;
  opacity: 0.55;
}
.fw-loop {
  fill: none;
  stroke: #C9A84C;
  stroke-width: 1.5;
  opacity: 0.35;
}
.fw-shield-i { fill: #003087; }
.fw-shield-l { fill: #2D5016; }
.fw-num {
  font-size: 8px;
  font-weight: 800;
  fill: #ffffff;
  text-anchor: middle;
  dominant-baseline: middle;
  font-family: var(--font-body);
}
.fw-num-sm { font-size: 6.5px; }

/* PINS */
.map-pin {
  cursor: pointer;
  transition: filter 0.25s;
}
.pin-halo {
  fill: transparent;
  stroke: var(--c-vet-gold);
  stroke-width: 1.5;
  opacity: 0.3;
  transition: all 0.25s;
}
.pin-body {
  fill: var(--c-vet-gold);
  transition: fill 0.25s;
}
.pin-dot {
  fill: rgba(0,0,0,0.4);
  transition: all 0.25s;
}
.pin-label {
  font-family: var(--font-body);
  font-size: 7.5px;
  font-weight: 700;
  fill: rgba(255,255,255,0.5);
  text-anchor: middle;
  letter-spacing: 0.6px;
  transition: fill 0.25s;
  pointer-events: none;
}
.pin-label--bold { font-size: 8.5px; }

/* Hover state */
.map-pin:hover .pin-halo {
  opacity: 0.7;
  stroke: var(--c-accent);
  r: 20;
}
.map-pin:hover .pin-body { fill: var(--c-accent); }
.map-pin:hover .pin-label { fill: rgba(255,255,255,0.9); }

/* Active/lit state */
.map-pin.active {
  filter: url(#pinGlowOrange);
}
.map-pin.active .pin-halo {
  opacity: 1;
  stroke: var(--c-accent);
}
.map-pin.active .pin-body { fill: var(--c-accent); }
.map-pin.active .pin-dot { fill: rgba(255,255,255,0.7); }
.map-pin.active .pin-label { fill: white; }

/* MAP NOTE */
.area-map__note {
  margin-top: 28px;
  font-size: 13px;
  color: rgba(255,255,255,0.4);
  text-align: center;
}
.area-map__note a { color: var(--c-accent); font-weight: 600; }
.area-map__note a:hover { opacity: 0.8; }

/* RESPONSIVE */
@media (max-width: 768px) {
  .area-map__inner {
    grid-template-columns: 1fr;
  }
  .area-map__sidebar {
    border-right: none;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    padding-right: 0;
    padding-bottom: 20px;
    margin-bottom: 24px;
  }
  .area-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 4px;
  }
  .area-map__canvas { padding-left: 0; }
}

/* ── FULL-SERVICE DECLARATION ── */
.full-service { background: var(--c-white); padding: 80px 24px; }
.full-service__header { text-align: center; max-width: 640px; margin: 0 auto 48px; }
.full-service__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; max-width: 1200px; margin: 0 auto; }
.full-service__card { background: var(--c-cream); border-radius: var(--radius-lg); padding: 36px 28px; border: 1px solid var(--c-border); border-top: 4px solid transparent; transition: var(--transition); }
.full-service__card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.fs-pm   { border-top-color: var(--c-accent); }
.fs-buy  { border-top-color: #2465C9; }
.fs-sell { border-top-color: var(--c-vet-gold); }
.fs-invest { border-top-color: #4a7c59; }
.full-service__icon { font-size: 36px; margin-bottom: 16px; }
.full-service__card h3 { font-family: var(--font-heading); font-size: 20px; color: var(--c-primary); margin-bottom: 10px; }
.full-service__card p { font-size: 14px; color: var(--c-text-mid); line-height: 1.7; margin-bottom: 18px; }
.full-service__link { font-size: 13px; font-weight: 700; color: var(--c-accent); text-decoration: none; }
.full-service__link:hover { color: var(--c-accent-dark); }
@media (max-width: 900px) { .full-service__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .full-service__grid { grid-template-columns: 1fr; } }

/* ── 3-ZONE INTERACTIVE MAP ── */
.zone-map-section { background: var(--c-primary); padding: 80px 24px; color: var(--c-white); }
.zone-map__header { text-align: center; max-width: 640px; margin: 0 auto 48px; }
.zone-map__inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 280px; gap: 40px; align-items: center; }
.zone-map__canvas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.zone { background: rgba(255,255,255,0.07); border: 2px solid rgba(255,255,255,0.15); border-radius: var(--radius-lg); padding: 40px 24px; text-align: center; cursor: pointer; transition: all 0.25s ease; min-height: 200px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; }
.zone:hover, .zone.active { background: rgba(212,114,26,0.2); border-color: var(--c-accent); transform: translateY(-2px); }
.zone__label { font-family: var(--font-heading); font-size: 22px; font-weight: 700; color: var(--c-white); }
.zone__cities { font-size: 12px; color: rgba(255,255,255,0.6); line-height: 1.6; }
.zone-map__sidebar { display: flex; flex-direction: column; gap: 12px; }
.zone-btn { display: flex; align-items: center; gap: 10px; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); padding: 14px 18px; color: var(--c-white); font-size: 14px; font-weight: 600; text-decoration: none; transition: all 0.2s ease; }
.zone-btn:hover { background: rgba(212,114,26,0.25); border-color: var(--c-accent); color: var(--c-white); }
.zone-btn--all { background: var(--c-accent); border-color: var(--c-accent); margin-top: 8px; justify-content: center; }
.zone-btn--all:hover { background: var(--c-accent-dark); }
.zone-btn__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--c-accent); flex-shrink: 0; }
.zone-btn__arrow { margin-left: auto; }
@media (max-width: 900px) { .zone-map__inner { grid-template-columns: 1fr; } .zone-map__canvas { grid-template-columns: 1fr; } }

/* ── PM PITCH ── */
.pm-pitch { background: var(--c-cream); padding: 96px 24px; }
.pm-pitch__inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; }
.pm-pitch__image { border-radius: var(--radius-lg); overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,0.12); min-height: 480px; background: var(--c-cream-dark); }
.pm-pitch__image img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
.pm-pitch__title { font-family: var(--font-heading); font-size: clamp(28px, 4vw, 46px); color: var(--c-primary); line-height: 1.15; margin-bottom: 20px; }
.pm-pitch__title span { color: var(--c-accent); }
.pm-pitch__desc { font-size: 16px; color: var(--c-text-mid); line-height: 1.8; margin-bottom: 28px; }
.pm-pitch__list { list-style: none; padding: 0; margin: 0 0 36px; display: flex; flex-direction: column; gap: 12px; }
.pm-pitch__list li { display: flex; align-items: center; gap: 10px; font-size: 15px; color: var(--c-text); }
.pm-pitch__list li span { width: 22px; height: 22px; background: var(--c-accent); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 800; color: var(--c-white); flex-shrink: 0; }
.pm-pitch__actions { display: flex; gap: 14px; flex-wrap: wrap; }
@media (max-width: 900px) { .pm-pitch__inner { grid-template-columns: 1fr; } .pm-pitch__image { min-height: 280px; } }

/* ── PROPERTY PHOTO STRIP ── */
.photo-strip { width: 100%; overflow: hidden; }
.photo-strip__track { display: grid; grid-template-columns: repeat(4, 1fr); height: 280px; }
.photo-strip__item { background-size: cover; background-position: center; transition: transform 0.4s ease; }
.photo-strip__item:hover { transform: scale(1.03); }

/* ── EDUCATION CARDS ── */
.education { background: var(--c-white); padding: 80px 24px; }
.education__header { text-align: center; max-width: 640px; margin: 0 auto 48px; }
.education__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; max-width: 1200px; margin: 0 auto; }
.education__card { background: var(--c-cream); border-radius: var(--radius-lg); padding: 32px 24px; border: 1px solid var(--c-border); transition: var(--transition); }
.education__card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--c-accent); }
.education__icon { font-size: 32px; margin-bottom: 14px; }
.education__card h3 { font-family: var(--font-heading); font-size: 17px; color: var(--c-primary); margin-bottom: 10px; }
.education__card p { font-size: 14px; color: var(--c-text-mid); line-height: 1.7; }
@media (max-width: 900px) { .education__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .education__grid { grid-template-columns: 1fr; } }

/* ── HERO SLOGAN ── */
.hero__slogan { font-family: var(--font-heading); font-size: clamp(15px, 1.8vw, 20px); color: var(--c-accent); font-style: italic; margin-bottom: 12px; }

/* ── ZONE MAP LIGHT VERSION ── */
.zone-map-section--light { background: var(--c-cream) !important; color: var(--c-primary) !important; }
.zone-map-section--light .zone { background: var(--c-white); border: 2px solid var(--c-border); }
.zone-map-section--light .zone:hover, .zone-map-section--light .zone.active { background: rgba(212,114,26,0.08); border-color: var(--c-accent); }
.zone-map-section--light .zone__label { color: var(--c-primary); }
.zone-map-section--light .zone__cities { color: var(--c-text-mid); }
.zone-map-section--light .zone-btn { background: var(--c-white); border: 1px solid var(--c-border); color: var(--c-primary); }
.zone-map-section--light .zone-btn:hover { background: rgba(212,114,26,0.1); border-color: var(--c-accent); color: var(--c-primary); }
.zone-map-section--light .zone-btn--all { background: var(--c-accent); border-color: var(--c-accent); color: var(--c-white); }

/* ── VETERAN SECTION WITH PHOTO BACKGROUND ── */
.veteran-section { background-size: cover !important; background-position: center top !important; position: relative; }
.veteran-section::after { content: ''; position: absolute; inset: 0; background: rgba(27,42,74,0.78); z-index: 0; }
.veteran-section .veteran-seal,
.veteran-section .veteran-section__inner,
.veteran-section .veteran-section__title,
.veteran-section .veteran-section__text,
.veteran-section .veteran-values,
.veteran-section a { position: relative; z-index: 1; }
.veteran-section .veteran-section__title { color: var(--c-white); }
.veteran-section .veteran-section__title span { color: var(--c-vet-gold); }
.veteran-section .veteran-section__text { color: rgba(255,255,255,0.85); }
.veteran-section .veteran-value__label { color: var(--c-vet-gold); }

/* ── CTA BANDS ── */
.cta-band { padding: 48px 24px; }
.cta-band__inner { max-width: 1100px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.cta-band--orange { background: var(--c-accent); }
.cta-band--navy { background: var(--c-navy); }
.cta-band__title { font-family: var(--font-heading); font-size: clamp(22px, 3vw, 32px); color: var(--c-white); margin-bottom: 6px; }
.cta-band__sub { font-size: 15px; color: rgba(255,255,255,0.8); }
.btn-white { background: var(--c-white); color: var(--c-primary); font-weight: 700; flex-shrink: 0; }
.btn-white:hover { background: var(--c-cream); }
@media (max-width: 700px) { .cta-band__inner { flex-direction: column; text-align: center; } }

/* ── PM PITCH INLINE FORM ── */
.pm-pitch__form { background: var(--c-white); border-radius: var(--radius-lg); padding: 32px; box-shadow: var(--shadow-md); border: 1px solid var(--c-border); margin-top: 8px; }
.pm-pitch__form-title { font-family: var(--font-heading); font-size: 20px; color: var(--c-primary); margin-bottom: 18px; }
.pm-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.pm-pitch__form input { width: 100%; padding: 12px 14px; border: 1px solid var(--c-border); border-radius: var(--radius); font-size: 14px; color: var(--c-text); margin-bottom: 12px; box-sizing: border-box; }
.pm-pitch__form input:focus { outline: none; border-color: var(--c-accent); }
.pm-form-note { font-size: 12px; color: var(--c-text-light); text-align: center; margin-top: 10px; }
.btn-full { width: 100%; text-align: center; }

/* ── EDUCATION CTA ── */
.education__cta { text-align: center; margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--c-border); display: flex; align-items: center; justify-content: center; gap: 20px; flex-wrap: wrap; }
.education__cta p { font-size: 16px; color: var(--c-text-mid); margin: 0; }

/* ── CTA BAND CREAM ── */
.cta-band--cream { background: var(--c-cream); border-top: 4px solid var(--c-accent); border-bottom: 4px solid var(--c-accent); }

/* ── MAINTENANCE CTA SECTION ── */
.maintenance-cta { background: var(--c-white); padding: 80px 24px; }
.maintenance-cta__inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.maintenance-cta__title { font-family: var(--font-heading); font-size: clamp(28px, 4vw, 44px); color: var(--c-primary); line-height: 1.2; margin-bottom: 16px; }
.maintenance-cta__title span { color: var(--c-accent); }
.maintenance-cta__text p { font-size: 16px; color: var(--c-text-mid); line-height: 1.75; margin-bottom: 24px; }
.maintenance-cta__features { display: flex; flex-direction: column; gap: 10px; font-size: 14px; color: var(--c-text); }
.maintenance-cta__features div { padding: 8px 0; border-bottom: 1px solid var(--c-border); }
.chat-bubble { padding: 12px 16px; border-radius: 18px; font-size: 14px; line-height: 1.5; max-width: 85%; margin-bottom: 10px; }
.chat-bubble--tenant { background: var(--c-cream-dark); color: var(--c-primary); align-self: flex-start; border-bottom-left-radius: 4px; }
.chat-bubble--apmi { background: var(--c-accent); color: var(--c-white); margin-left: auto; border-bottom-right-radius: 4px; }
.maintenance-cta__chat { display: flex; flex-direction: column; background: var(--c-cream); border-radius: var(--radius-lg); padding: 28px; border: 1px solid var(--c-border); }
@media (max-width: 900px) { .maintenance-cta__inner { grid-template-columns: 1fr; } .pm-form-row { grid-template-columns: 1fr; } }

/* ══════════════════════════════════════
   MOBILE OPTIMIZATION + CONTRAST FIXES
   ══════════════════════════════════════ */

/* ── CONTRAST: section-label always visible ── */
.section-label { color: var(--c-accent) !important; }
.section--light .section-label,
.section .section-label { color: var(--c-accent) !important; }

/* ── CONTRAST: cards on cream bg need border ──
   .education__card was in this rule too. It is now a hairline-ruled
   editorial list rather than a floated card, and the !important here beat
   that treatment. Separation on the cream ground comes from the rule above
   each item instead. .full-service__card still needs it. */
.full-service__card { background: var(--c-white) !important; border: 1px solid #e0d8ce !important; }

/* ── CONTRAST: btn-outline on cream needs dark border ── */
.btn-outline { border: 2px solid var(--c-primary) !important; color: var(--c-primary) !important; }
.btn-outline:hover { background: var(--c-primary) !important; color: var(--c-white) !important; }

/* ── GOLD BUTTON ── */
.btn-gold { background: var(--c-vet-gold) !important; color: var(--c-primary) !important; font-weight: 800 !important; }
.btn-gold:hover { background: #b8922e !important; }

/* ══ MOBILE — Base (≤ 480px) ══ */
@media (max-width: 480px) {
  /* Nav */
  .header__inner { padding: 0 16px; }
  .header__logo img { height: 48px; }

  /* Hero */
  .hero { padding: 40px 16px 32px; }
  .hero__title { font-size: 32px; }
  .hero__title-sub { font-size: 28px; }
  .hero__subtitle { font-size: 15px; }
  .hero__actions { flex-direction: column; gap: 10px; }
  .hero__actions .btn { width: 100%; text-align: center; font-size: 15px; padding: 14px 20px; }
  .hero__stats { grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 24px; }
  .hero__stat-num { font-size: 20px; }
  .hero__video { display: none; }

  /* Trust bar */
  .trust-bar__inner { grid-template-columns: repeat(3, 1fr); }
  .trust-bar__item { padding: 14px 8px; }
  .trust-bar__num { font-size: 16px; }
  .trust-bar__label { font-size: 9px; letter-spacing: 0.5px; }

  /* Full service */
  .full-service { padding: 48px 16px; }
  .full-service__grid { grid-template-columns: 1fr; gap: 14px; }
  .full-service__card { padding: 24px 20px; }

  /* PM Pitch */
  .pm-pitch { padding: 48px 16px; }
  .pm-pitch__inner { grid-template-columns: 1fr; gap: 32px; }
  .pm-pitch__image { min-height: 240px; order: -1; }
  .pm-form-row { grid-template-columns: 1fr; }
  .pm-pitch__form { padding: 20px; }

  /* Zone map */
  .zone-map-section { padding: 48px 16px; }
  .zone-map__inner { grid-template-columns: 1fr; gap: 24px; }
  .zone-map__canvas { grid-template-columns: 1fr; gap: 10px; }
  .zone { min-height: 90px; padding: 20px 16px; }
  .zone__label { font-size: 17px; }
  .zone__cities { font-size: 11px; }
  .zone-map__sidebar { flex-direction: column; gap: 8px; }

  /* Testimonials */
  .testimonials { padding: 48px 16px; }
  .testimonials__grid { grid-template-columns: 1fr; }

  /* Maintenance */
  .maintenance-cta { padding: 48px 16px; }
  .maintenance-cta__inner { grid-template-columns: 1fr; gap: 32px; }

  /* Stats */
  .stats-section { padding: 48px 16px; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }

  /* Education */
  .education { padding: 48px 16px; }
  .education__grid { grid-template-columns: 1fr; }
  .education__cta { flex-direction: column; gap: 12px; text-align: center; }

  /* CTA bands */
  .cta-band { padding: 36px 16px; }
  .cta-band__inner { flex-direction: column; text-align: center; }
  .cta-band__title { font-size: 22px; }
  .cta-band .btn { width: 100%; text-align: center; }

  /* Veteran */
  .veteran-section { padding: 60px 16px; }

  /* Manage-profit */
  .manage-profit { padding: 48px 16px; }
  .manage-profit__inner { grid-template-columns: 1fr; }
  .manage-profit__image { min-height: 240px; }

  /* Photo strip */
  .photo-strip__track { grid-template-columns: repeat(2, 1fr); height: 200px; }

  /* Lead capture */
  .lead-capture { padding: 48px 16px; }
  .lead-capture__inner { grid-template-columns: 1fr; gap: 32px; }

  /* Footer */
  .footer__grid { grid-template-columns: 1fr; gap: 32px; padding: 40px 16px; }
}

/* ══ TABLET (481px – 900px) ══ */
@media (min-width: 481px) and (max-width: 900px) {
  .hero__inner { grid-template-columns: 1fr; }
  .hero__video { display: block; max-width: 560px; margin: 24px auto 0; }
  .hero__stats { grid-template-columns: repeat(5, 1fr); }

  .full-service__grid { grid-template-columns: repeat(2, 1fr); }

  .pm-pitch__inner { grid-template-columns: 1fr; }
  .pm-pitch__image { min-height: 300px; order: -1; }
  .pm-form-row { grid-template-columns: 1fr 1fr; }

  .zone-map__inner { grid-template-columns: 1fr; }
  .zone-map__canvas { grid-template-columns: repeat(3, 1fr); }

  .testimonials__grid { grid-template-columns: 1fr 1fr; }

  .maintenance-cta__inner { grid-template-columns: 1fr; }

  .stats-grid { grid-template-columns: repeat(2, 1fr); }

  .education__grid { grid-template-columns: repeat(2, 1fr); }

  .manage-profit__inner { grid-template-columns: 1fr; }
  .manage-profit__image { min-height: 300px; }

  .lead-capture__inner { grid-template-columns: 1fr; }
  .footer__grid { grid-template-columns: repeat(2, 1fr); }
}

/* =============================================
   ROUND 1 ADDITIONS — azezrentals.com
   ============================================= */

/* --- TRUST BAR — clickable items --- */
.trust-bar__item { text-decoration: none; }
.trust-bar__item:hover .trust-bar__num { color: var(--c-white); }
.trust-bar__item:hover .trust-bar__label { color: rgba(255,255,255,0.9); }
.trust-bar__item:hover { opacity: 0.85; }

/* --- HERO SLOGAN — more prominent --- */
.hero__slogan {
  font-size: clamp(17px, 2vw, 22px) !important;
  font-style: italic;
  color: var(--c-accent) !important;
  font-weight: 600;
  margin-bottom: 10px;
  letter-spacing: 0.01em;
}

/* --- AUDIENCE SORTER --- */
.audience-sorter { background: var(--c-white); }
.audience-sorter__header { margin-bottom: 40px; }
.audience-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  max-width: 1100px;
  margin: 0 auto;
}
.audience-card {
  display: flex; flex-direction: column;
  padding: 36px 28px;
  background: var(--c-cream);
  border: 2px solid var(--c-border);
  border-radius: var(--radius-lg);
  text-decoration: none; color: var(--c-text);
  transition: var(--transition);
  cursor: pointer;
}
.audience-card:hover {
  border-color: var(--c-accent);
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}
.audience-card__icon { font-size: 40px; margin-bottom: 16px; }
.audience-card h3 {
  font-family: var(--font-heading);
  font-size: 22px; font-weight: 700;
  margin-bottom: 12px; color: var(--c-primary);
}
.audience-card p { font-size: 15px; color: var(--c-text-mid); line-height: 1.6; flex: 1; }
.audience-card__cta {
  display: block; margin-top: 20px;
  font-size: 14px; font-weight: 700;
  color: var(--c-accent);
  letter-spacing: 0.02em;
}
.audience-card:hover .audience-card__cta { text-decoration: underline; }

/* --- ZONE MAP — Google Maps iframe version --- */
.zone-map-section--white { background: var(--c-white) !important; }
.zone-map__map {
  flex: 1 1 60%;
  min-height: 440px;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-md);
}
.zone-map__map iframe { display: block; min-height: 440px; }

/* --- TESTIMONIALS — Google Reviews CTA --- */
.btn-google {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--c-white); color: #333;
  border: 2px solid #ddd; border-radius: var(--radius-sm);
  padding: 14px 24px; font-size: 15px; font-weight: 600;
  transition: var(--transition);
}
.btn-google:hover { border-color: #4285f4; box-shadow: var(--shadow-sm); }
.google-g {
  font-weight: 900; font-size: 18px;
  background: linear-gradient(45deg, #4285f4 25%, #ea4335 25%, #ea4335 50%, #fbbc05 50%, #fbbc05 75%, #34a853 75%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* --- EDUCATION PORTAL CARDS --- */
.education__card .full-service__link {
  display: inline-block;
  margin-top: 12px;
  font-size: 14px; font-weight: 700;
  color: var(--c-accent);
}

/* --- VETERAN SECTION — cleaner, less blue-on-blue --- */
.veteran-section--about {
  background-attachment: fixed !important;
}
.veteran-section--about::after {
  background: rgba(20, 30, 55, 0.82) !important;
}

/* --- WE MANAGE IT — photo on left --- */
.manage-profit__inner {
  display: flex; align-items: flex-start; gap: 60px;
}
.manage-profit__image { flex: 0 0 420px; max-width: 420px; margin-top: 0; }
.manage-profit__image img {
  width: 100%; border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  object-fit: cover; object-position: top;
  max-height: 520px;
}
.manage-profit__text { flex: 1; }

/* --- TEAM TEASER — minimal homepage version --- */
/* legacy kept for any refs */
.team-teaser { background: var(--c-primary); }
.team-face-grid { display: none; }

/* ── TEAM SHOWCASE — homepage ── */
.team-showcase {
  background: var(--c-primary);
  padding: 80px 24px 72px;
}
.team-showcase__inner {
  max-width: 1240px;
  margin: 0 auto;
}
.team-showcase__header {
  text-align: center;
  margin-bottom: 52px;
}
.team-showcase__header h2 {
  font-family: var(--font-heading);
  font-size: clamp(28px, 3.5vw, 44px);
  font-weight: 700; line-height: 1.2;
  color: #fff; margin-bottom: 16px;
}
.team-showcase__header p {
  font-size: 17px; color: rgba(255,255,255,0.6);
  max-width: 600px; margin: 0 auto; line-height: 1.75;
}
.team-showcase__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
  gap: 14px;
}
.tsc-card {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  aspect-ratio: 3 / 4;
  background: #2b2b2b;
  display: block;
  text-decoration: none;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.tsc-card--linked:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 36px rgba(212,114,26,0.3);
}
.tsc-card--linked .tsc-card__arrow {
  position: absolute;
  top: 11px; right: 11px;
  width: 28px; height: 28px;
  background: var(--c-accent);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; color: #fff;
  opacity: 0;
  transform: scale(0.7);
  transition: 0.2s ease;
}
.tsc-card--linked:hover .tsc-card__arrow {
  opacity: 1;
  transform: scale(1);
}
.tsc-card__photo {
  position: absolute; inset: 0;
}
.tsc-card__photo img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: top center;
  display: block;
}
.tsc-card__overlay {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: linear-gradient(to top, rgba(10,10,10,0.92) 0%, rgba(10,10,10,0.5) 55%, transparent 100%);
  padding: 44px 14px 15px;
}
.tsc-card__name {
  font-family: var(--font-heading);
  font-size: 15px; font-weight: 700;
  color: #fff; line-height: 1.2;
  margin-bottom: 4px;
}
.tsc-card__role {
  font-size: 10px; font-weight: 700;
  color: var(--c-accent);
  text-transform: uppercase;
  letter-spacing: 0.09em;
}
.team-showcase__footer {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 20px;
  margin-top: 44px;
  padding-top: 36px;
  border-top: 1px solid rgba(255,255,255,0.08);
}
.team-showcase__stat {
  display: flex; align-items: center; gap: 12px;
}
.team-showcase__stat-num {
  font-family: var(--font-heading);
  font-size: 32px; font-weight: 700;
  color: var(--c-accent); line-height: 1;
}
.team-showcase__stat-label {
  font-size: 13px; color: rgba(255,255,255,0.5);
  line-height: 1.4; max-width: 100px;
}

/* --- FINAL CTA --- */
.final-cta {
  background: var(--c-navy);
  padding: 80px 24px;
  text-align: center;
}
.final-cta__inner { max-width: 900px; margin: 0 auto; }
.final-cta__title {
  font-family: var(--font-heading);
  font-size: clamp(30px, 4vw, 52px);
  font-weight: 700; color: var(--c-white);
  line-height: 1.2; margin-bottom: 16px;
}
.final-cta__title span { color: var(--c-vet-gold); }
.final-cta__sub {
  font-size: 18px; color: rgba(255,255,255,0.8);
  margin-bottom: 40px; line-height: 1.6;
}
.final-cta__buttons {
  display: flex; flex-wrap: wrap; gap: 16px;
  justify-content: center;
}

/* --- FOOTER COMPLIANCE --- */
.footer__compliance {
  border-top: 1px solid rgba(255,255,255,0.1);
  padding: 24px 40px 20px;
  background: rgba(0,0,0,0.2);
}
.footer__compliance-inner {
  display: flex; align-items: flex-start; gap: 24px;
  max-width: 1200px; margin: 0 auto;
}
.footer__eho-badge {
  flex: 0 0 auto;
  display: flex; align-items: center; gap: 8px;
  padding: 12px 16px;
  border: 2px solid rgba(255,255,255,0.3);
  border-radius: var(--radius-sm);
  text-align: center;
}
.eho-icon { font-size: 28px; color: var(--c-white); }
.footer__eho-badge span {
  font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1px;
  color: rgba(255,255,255,0.8);
  line-height: 1.4;
}
.footer__legal {
  font-size: 11px; color: rgba(255,255,255,0.55);
  line-height: 1.7; flex: 1;
}
.footer__legal .placeholder {
  color: var(--c-vet-gold); font-style: italic;
}

/* =============================================
   RESPONSIVE — Round 1 additions
   ============================================= */
@media (max-width: 900px) {
  .audience-grid { grid-template-columns: 1fr; max-width: 480px; }
  .zone-map__map { min-height: 300px; }
  .zone-map__map iframe { min-height: 300px; }
  .manage-profit__inner { flex-direction: column; gap: 32px; }
  .manage-profit__image { flex: none; width: 100%; max-width: 100%; }
  .team-showcase__grid { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
  .team-showcase__footer { flex-direction: column; align-items: flex-start; }
  .final-cta__buttons { flex-direction: column; align-items: center; }
  .final-cta__buttons .btn { width: 100%; max-width: 380px; justify-content: center; }
  .footer__compliance-inner { flex-direction: column; gap: 16px; }
}
@media (max-width: 480px) {
  .audience-card { padding: 24px 20px; }
  .team-showcase__grid { grid-template-columns: repeat(3, 1fr); }
  .final-cta { padding: 60px 24px; }
}

/* =============================================
   ROUND 2 ADDITIONS
   ============================================= */

/* ── HERO v2 ── */
.hero--v2 {
  background: var(--c-cream);
  padding: 0 0 60px;
}
.hero__headline-bar {
  background: var(--c-primary);
  width: 100%;
  padding: 22px 40px;
  margin-bottom: 48px;
}
.hero__headline {
  font-family: var(--font-heading);
  font-size: clamp(20px, 2.6vw, 32px);
  font-weight: 800;
  color: var(--c-white);
  text-align: center;
  letter-spacing: -0.02em;
  margin: 0;
}
.hero__inner {
  display: flex;
  align-items: flex-start;
  gap: 48px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 40px;
}
.hero__content {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.hero__logo-large img {
  max-width: 260px;
  height: auto;
}
.hero__vet {
  display: flex;
  align-items: center;
  margin-top: 28px !important;   /* more space from the headline bar above */
  margin-bottom: 4px !important; /* tighten gap to the quote below */
}
.vet-badge {
  display: inline-block;
  background: var(--c-primary);
  color: var(--c-white);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 6px 14px;
  border-radius: 4px;
}
.hero__slogan {
  font-size: clamp(24px, 3vw, 38px) !important;
  font-style: italic;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: var(--c-accent) !important;
  margin: 0;
}
.hero__subtitle {
  font-size: clamp(14px, 1.5vw, 17px);
  color: #444;
  line-height: 1.6;
  margin: 0;
}
.hero__bullets {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.hero__bullets li {
  font-size: clamp(14px, 1.4vw, 16px);
  color: var(--c-primary);
  font-weight: 600;
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 8px;
}
.hero__video {
  flex: 1 1 48%;
  min-width: 280px;
}
.hero__video wistia-player {
  width: 100%;
  border-radius: var(--radius-lg);
  overflow: hidden;
  display: block;
  box-shadow: 0 8px 32px rgba(0,0,0,0.15);
}

/* ── AUDIENCE SORTER v2 ── */
.audience-grid--v2 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  max-width: 1100px;
  margin: 0 auto;
}
.audience-card--v2 {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 40px 32px;
  background: var(--c-white);
  border: 3px solid var(--c-border, #e8e4dc);
  border-radius: var(--radius-lg);
  text-decoration: none;
  color: var(--c-primary);
  transition: border-color 0.2s, transform 0.2s, box-shadow 0.2s;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}
.audience-card--v2:hover {
  border-color: var(--c-accent);
  transform: translateY(-6px);
  box-shadow: 0 12px 32px rgba(212,114,26,0.14);
}
.audience-card__number {
  font-family: var(--font-heading);
  font-size: 52px;
  font-weight: 900;
  color: var(--c-accent);
  line-height: 1;
  opacity: 0.85;
}
.audience-card--v2 h3 {
  font-family: var(--font-heading);
  font-size: clamp(20px, 2vw, 26px);
  font-weight: 800;
  color: var(--c-primary);
  line-height: 1.25;
  margin: 0;
}
.audience-card--v2 p {
  font-size: 15px;
  color: #555;
  line-height: 1.6;
  margin: 0;
  flex: 1;
}
.audience-card__cta {
  font-size: 14px;
  font-weight: 700;
  color: var(--c-accent);
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

/* ── ZONE MAP — dark variant ── */
.zone-map-section--dark {
  background: #12151c !important;
}
.zone-map-section--dark .section__title {
  color: var(--c-white) !important;
}
.zone-map-section--dark .section__subtitle {
  color: rgba(255,255,255,0.7) !important;
}
.zone-map__sidebar--dark {
  background: #1c2230;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--radius-lg);
  padding: 28px 20px;
}
.zone-map__sidebar-title {
  font-family: var(--font-heading);
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--c-accent);
  margin: 0 0 16px;
}
.zone-btn--dark {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  color: var(--c-white) !important;
  transition: background 0.2s, border-color 0.2s;
}
.zone-btn--dark:hover {
  background: rgba(212,114,26,0.2);
  border-color: var(--c-accent);
  color: var(--c-accent) !important;
}
.zone-btn__cities {
  display: block;
  font-size: 11px;
  font-weight: 400;
  color: rgba(255,255,255,0.5);
  margin-top: 2px;
  white-space: normal;
  letter-spacing: 0;
  text-transform: none;
}
.zone-btn--dark:hover .zone-btn__cities {
  color: rgba(212,114,26,0.8);
}

/* ── REVIEWS CAROUSEL (auto-scroll) ── */
.reviews-carousel {
  overflow: hidden;
  width: 100%;
  position: relative;
}
.reviews-carousel::before,
.reviews-carousel::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 80px;
  z-index: 2;
  pointer-events: none;
}
.reviews-carousel::before {
  left: 0;
  background: linear-gradient(to right, var(--c-cream, #F5F0E8), transparent);
}
.reviews-carousel::after {
  right: 0;
  background: linear-gradient(to left, var(--c-cream, #F5F0E8), transparent);
}
.reviews-track {
  display: flex;
  gap: 24px;
  width: max-content;
  animation: reviews-scroll 40s linear infinite;
}
.reviews-track:hover {
  animation-play-state: paused;
}
@keyframes reviews-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.reviews-track .testimonial-card {
  flex: 0 0 320px !important;
  width: 320px !important;
  min-width: 320px !important;
  max-width: 320px !important;
  white-space: normal !important;
  word-wrap: break-word !important;
}
.review-card {
  flex: 0 0 320px;
  background: var(--c-white);
  border: 1px solid #e0dbd3;
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}
.review-card__stars {
  font-size: 16px;
  color: #F4B400;
  letter-spacing: 2px;
}
.review-card__text {
  font-size: 14px;
  color: #444;
  line-height: 1.65;
  font-style: italic;
  flex: 1;
}
.review-card__author {
  font-size: 13px;
  font-weight: 700;
  color: var(--c-primary);
}
.review-card__role {
  font-size: 12px;
  color: #888;
  margin-top: 2px;
}
.reviews-cta {
  margin-top: 36px;
  text-align: center;
}
.btn-google {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--c-white);
  border: 2px solid #dadce0;
  color: var(--c-primary);
  padding: 12px 24px;
  border-radius: var(--radius-sm);
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  transition: box-shadow 0.2s;
}
.btn-google:hover { box-shadow: 0 2px 12px rgba(0,0,0,0.12); }
.google-g {
  font-weight: 900;
  font-size: 18px;
  background: linear-gradient(135deg, #4285F4, #EA4335, #FBBC05, #34A853);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ── CTA BAND — brand colors ── */
.cta-band--brand {
  background: var(--c-primary) !important;
}
.cta-band--brand .cta-band__title,
.cta-band--brand .cta-band__text {
  color: var(--c-white) !important;
}
.cta-band--brand .btn-primary {
  background: var(--c-accent);
  border-color: var(--c-accent);
  color: var(--c-white);
}
.cta-band--brand .btn-primary:hover {
  background: #b85e12;
  border-color: #b85e12;
}
.cta-band--brand .btn-outline {
  border-color: var(--c-accent);
  color: var(--c-accent);
}
.cta-band--brand .btn-outline:hover {
  background: var(--c-accent);
  color: var(--c-white);
}

/* ── TEAM TEASER — placeholder circle ── */
.team-face-placeholder {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--c-navy);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-heading);
  font-size: clamp(28px, 4vw, 40px);
  font-weight: 900;
  color: var(--c-white);
  letter-spacing: -0.02em;
}

/* ── PM PITCH ── */
.pm-pitch {
  background: var(--c-cream);
  padding: 80px 24px;
}
.pm-pitch__inner {
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  gap: 60px;
  align-items: flex-start;
}
.pm-pitch__quote-col {
  flex: 0 0 360px;
  max-width: 360px;
}
.pm-pitch__quote {
  font-family: var(--font-heading);
  font-size: clamp(22px, 2.5vw, 30px);
  font-weight: 800;
  color: var(--c-primary);
  line-height: 1.3;
  margin: 0 0 20px;
  font-style: italic;
}
.pm-pitch__quote::before {
  content: '\201C';
  font-size: 60px;
  color: var(--c-accent);
  line-height: 0;
  vertical-align: -0.4em;
  margin-right: 4px;
}
.pm-pitch__sig {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 20px;
}
.pm-pitch__sig img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  object-fit: cover;
  object-position: top;
}
.pm-pitch__sig-name {
  font-weight: 700;
  font-size: 15px;
  color: var(--c-primary);
}
.pm-pitch__sig-title {
  font-size: 13px;
  color: #666;
}
.pm-pitch__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}
.pm-pitch__form-col {
  flex: 1;
  background: var(--c-white);
  border-radius: var(--radius-lg);
  padding: 36px 32px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.07);
}
.pm-pitch__form-col h3 {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 800;
  color: var(--c-primary);
  margin: 0 0 20px;
}

/* ── FINAL CTA — brand colors ── */
.final-cta--brand {
  background: var(--c-primary) !important;
}
.final-cta--brand .final-cta__title,
.final-cta--brand .final-cta__sub {
  color: var(--c-white) !important;
}
.final-cta--brand .final-cta__title span {
  color: var(--c-accent) !important;
}
.final-cta--brand .btn-primary {
  background: var(--c-accent);
  border-color: var(--c-accent);
  color: var(--c-white);
}
.final-cta--brand .btn-primary:hover {
  background: #b85e12;
  border-color: #b85e12;
}
.final-cta--brand .btn-outline {
  border-color: rgba(255,255,255,0.5);
  color: var(--c-white);
}
.final-cta--brand .btn-outline:hover {
  border-color: var(--c-accent);
  background: rgba(212,114,26,0.15);
}

/* ── LEAD MAGNET MODAL ── */
.lm-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9000;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.lm-modal[aria-hidden="false"] {
  display: flex;
}
.lm-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.65);
  cursor: pointer;
}
.lm-modal__box {
  position: relative;
  background: var(--c-white);
  border-radius: var(--radius-lg);
  padding: 48px 40px;
  max-width: 520px;
  width: 100%;
  box-shadow: 0 24px 60px rgba(0,0,0,0.3);
  text-align: center;
  z-index: 1;
}
.lm-modal__close {
  position: absolute;
  top: 16px; right: 20px;
  background: none;
  border: none;
  font-size: 28px;
  line-height: 1;
  color: #999;
  cursor: pointer;
  padding: 0;
  transition: color 0.15s;
}
.lm-modal__close:hover { color: var(--c-primary); }
.lm-modal__badge {
  display: inline-block;
  background: var(--c-accent);
  color: var(--c-white);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 5px 14px;
  border-radius: 4px;
  margin-bottom: 20px;
}
.lm-modal__title {
  font-family: var(--font-heading);
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 900;
  color: var(--c-primary);
  line-height: 1.25;
  margin: 0 0 12px;
}
.lm-modal__sub {
  font-size: 15px;
  color: #555;
  line-height: 1.6;
  margin: 0 0 28px;
}
.lm-modal__form {
  display: flex;
  flex-direction: column;
  gap: 14px;
  text-align: left;
}
.lm-modal__form input {
  width: 100%;
  padding: 13px 16px;
  border: 2px solid #e0dbd3;
  border-radius: var(--radius-sm);
  font-size: 15px;
  font-family: var(--font-body);
  color: var(--c-primary);
  box-sizing: border-box;
  transition: border-color 0.2s;
}
.lm-modal__form input:focus {
  outline: none;
  border-color: var(--c-accent);
}
.lm-modal__form .btn {
  width: 100%;
  justify-content: center;
  margin-top: 4px;
}
.lm-modal__disclaimer {
  font-size: 11px;
  color: #999;
  margin-top: 12px;
  text-align: center;
}

/* ── RESPONSIVE — Round 2 ── */
@media (max-width: 1024px) {
  .pm-pitch__inner { flex-direction: column; gap: 40px; }
  .pm-pitch__quote-col { flex: none; max-width: 100%; }
}
@media (max-width: 900px) {
  .hero--v2 { padding: 0 0 48px; }
  .hero__headline-bar { padding: 18px 24px; }
  .hero__inner { flex-direction: column; padding: 0 24px; gap: 32px; }
  .hero__video { width: 100%; min-width: 0; }
  .audience-grid--v2 { grid-template-columns: 1fr; max-width: 440px; }
  .zone-map__sidebar--dark { padding: 20px 16px; }
}
@media (max-width: 480px) {
  .hero__headline { font-size: 18px; }
  .hero__logo-large img { max-width: 180px; }
  .audience-card--v2 { padding: 28px 20px; }
  .audience-card__number { font-size: 40px; }
  .lm-modal__box { padding: 36px 24px; }
  .pm-pitch__form-col { padding: 28px 20px; }
  .review-card { flex: 0 0 260px; }
}

/* =============================================
   ROUND 3 ADDITIONS
   ============================================= */

/* ── GLOBAL BLACK UNIFICATION ──────────────────
   All dark sections use exactly #1A1A1A (--c-primary).
   Eliminate the faded #2C2C2C gradient. */
.stats-section {
  background: var(--c-primary) !important;
}
.site-footer {
  background: var(--c-primary) !important;
}
.trust-bar {
  background: var(--c-primary) !important;
}
.cta-band--brand {
  background: var(--c-primary) !important;
}
.final-cta--brand {
  background: var(--c-primary) !important;
}

/* ── GLOBAL BUTTON DYNAMICS ────────────────────
   All buttons get lift + shadow on hover */
.btn {
  transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, border-color 0.18s ease !important;
}
.btn-primary:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 24px rgba(212,114,26,0.35) !important;
}
.btn-outline:hover,
.btn-outline-white:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 6px 18px rgba(0,0,0,0.18) !important;
}

/* ── HERO — actions under video ────────────────*/
.hero__actions--under-video {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 20px;
  justify-content: flex-start;
}
.hero-btn-main {
  min-width: 280px;
  padding: 18px 32px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
}
.hero-btn-sec {
  min-width: 160px;
  padding: 18px 28px !important;
  font-size: 15px !important;
}

/* ── ZONE MAP — light/white variant ───────────*/
.zone-map-section--light {
  background: var(--c-white) !important;
}
.zone-map-section--light .section-title {
  color: var(--c-primary) !important;
}
.zone-map-section--light .section-subtitle {
  color: #555 !important;
}
.zone-map__sidebar--light {
  background: var(--c-cream);
  border: 1px solid var(--c-border, #e8e4dc);
  border-radius: var(--radius-lg);
  padding: 28px 20px;
}
.zone-map__sidebar--light .zone-map__sidebar-title {
  color: var(--c-primary);
}
.zone-btn--light {
  background: var(--c-white);
  border: 1.5px solid #ddd;
  color: var(--c-primary) !important;
  border-radius: var(--radius-sm);
  transition: background 0.18s, border-color 0.18s, transform 0.18s, box-shadow 0.18s;
}
.zone-btn--light:hover {
  background: var(--c-accent);
  border-color: var(--c-accent);
  color: var(--c-white) !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(212,114,26,0.28);
}
.zone-btn--light .zone-btn__cities {
  color: #888;
}
.zone-btn--light:hover .zone-btn__cities {
  color: rgba(255,255,255,0.8);
}

/* ── TESTIMONIALS — tighter overall spacing ───*/
.testimonials {
  padding: 48px 24px !important;
}
.testimonials__header {
  margin-bottom: 20px !important;
}
.testimonial-card {
  padding: 20px !important;
}
.testimonial-card__stars {
  margin-bottom: 8px !important;
}
.testimonial-card__text {
  margin-bottom: 12px !important;
}

/* ── REVIEWS — 5-star bridge transition ───────*/
.reviews-stars-bridge {
  text-align: center;
  padding: 8px 0 12px;
}
.reviews-stars-row {
  display: flex;
  justify-content: center;
  gap: 6px;
  font-size: 48px;
  color: #F4B400;
  letter-spacing: 6px;
  margin-bottom: 8px;
  animation: stars-pop 0.6s ease both;
}
@keyframes stars-pop {
  0%   { opacity: 0; transform: scale(0.7); }
  70%  { transform: scale(1.08); }
  100% { opacity: 1; transform: scale(1); }
}
.reviews-stars-tagline {
  font-size: 14px;
  color: #777;
  font-style: italic;
  letter-spacing: 0.02em;
  margin: 0;
}

/* ── REVIEW CARDS — clamp text height ─────────*/
.testimonial-card__text,
.review-card__text {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 14px !important;
}

/* ── WE MANAGE IT — bigger photo, no cream pad ─*/
.manage-profit__image {
  flex: 0 0 480px !important;
  max-width: 480px !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}
.manage-profit__image img {
  width: 100%;
  height: auto;
  border-radius: var(--radius-lg);
  display: block;
  object-fit: cover;
  object-position: top center;
}
.manage-profit__inner {
  align-items: center !important;
  gap: 56px !important;
}

/* ── SECTION WAVE DIVIDER ──────────────────────*/
.section-wave-divider {
  line-height: 0;
  overflow: hidden;
  background: var(--c-primary); /* top section color — default dark */
  margin-bottom: -2px;
}
.section-wave-divider--cream-to-white {
  background: var(--c-cream); /* cream section above, white wave below */
}
.section-wave-divider svg {
  display: block;
  width: 100%;
  height: 60px;
}

/* ── CTA BAND — glowing pulse on primary button ─*/
@keyframes btn-glow {
  0%   { box-shadow: 0 0 0 0 rgba(212,114,26,0.55); }
  60%  { box-shadow: 0 0 0 14px rgba(212,114,26,0); }
  100% { box-shadow: 0 0 0 0 rgba(212,114,26,0); }
}
.cta-band--brand .btn-primary {
  animation: btn-glow 2.2s ease-in-out infinite;
}
.cta-band--brand .btn-primary:hover {
  animation: none;
  transform: translateY(-3px) !important;
  box-shadow: 0 10px 28px rgba(212,114,26,0.45) !important;
}

/* ── PM PITCH — chips above quote ─────────────*/
.pm-pitch__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 20px;
}
.pm-chip {
  display: inline-block;
  background: var(--c-cream, #F5F0E8);
  border: 1.5px solid var(--c-accent);
  color: var(--c-primary);
  font-size: 12px;
  font-weight: 700;
  padding: 6px 14px;
  border-radius: 100px;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.pm-pitch__quote--sm {
  font-size: clamp(14px, 1.4vw, 16px) !important;
  line-height: 1.7 !important;
}

/* ── FOOTER — cleaner compliance bar ──────────*/
.footer__compliance {
  border-top: none !important;
  background: rgba(0,0,0,0.35) !important;
  padding: 20px 40px !important;
}
.footer__compliance-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}
.footer__legal {
  font-size: 11px !important;
  color: rgba(255,255,255,0.45) !important;
  line-height: 1.5 !important;
}

/* ── RESPONSIVE R3 ─────────────────────────────*/
@media (max-width: 900px) {
  .hero__actions--under-video { justify-content: center; }
  .hero-btn-main { min-width: 100%; }
  .manage-profit__image { flex: none !important; max-width: 100% !important; }
  .zone-map__sidebar--light { padding: 16px; }
}
@media (max-width: 480px) {
  .hero-btn-main, .hero-btn-sec { width: 100%; min-width: 0; justify-content: center; }
  .pm-pitch__chips { gap: 6px; }
  .pm-chip { font-size: 11px; padding: 5px 10px; }
}

/* ── HEADLINE BAR (moved above nav) ────────────
   Sits between top-bar and site-header.
   Full-width black band, text perfectly centered. */
.hero__headline-bar {
  background: var(--c-primary) !important;
  width: 100%;
  padding: 18px 24px !important;
  margin-bottom: 0 !important;
  position: relative;
  z-index: 100;
}
.hero__headline-wrap {
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
}
.hero__headline {
  text-align: center !important;
  font-size: clamp(18px, 2.4vw, 30px) !important;
  font-weight: 800 !important;
  color: var(--c-white) !important;
  letter-spacing: -0.015em !important;
  margin: 0 !important;
}

/* Remove the margin-bottom that was pushing the headline-bar
   away from the hero inner (it no longer lives inside hero--v2) */
.hero--v2 {
  padding-top: 32px;
}

/* ── HERO buttons — side by side, equal width, flush to video ── */
.hero__actions--under-video {
  flex-wrap: nowrap !important;
  gap: 12px !important;
  margin-top: 16px !important;
}
.hero__actions--under-video .btn {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  text-align: center !important;
  justify-content: center !important;
  padding: 16px 20px !important;
  font-size: 15px !important;
}
@media (max-width: 600px) {
  .hero__actions--under-video {
    flex-wrap: wrap !important;
  }
  .hero__actions--under-video .btn {
    flex: 1 1 100% !important;
  }
}

/* ── HERO video — no shadow/card effect ── */
.hero__video {
  background: transparent !important;
  box-shadow: none !important;
}
.hero__video wistia-player {
  box-shadow: none !important;
  border-radius: 10px !important;
}

/* ── HERO layout — equal columns, tight spacing, balanced ── */
.hero--v2 {
  padding-bottom: 48px !important;
}
.hero__headline-bar {
  margin-bottom: 0 !important;
}
.hero__inner {
  align-items: center !important;
  gap: 40px !important;
}
.hero__content {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}
.hero__logo-large img {
  max-width: 200px !important;
}
.hero__video {
  flex: 1 1 0 !important;
  min-width: 0 !important;
}
.hero__video wistia-player {
  width: 100% !important;
  display: block !important;
}

/* Button under the left column text */
.hero__cta-under-text {
  margin-top: 16px !important;
  padding-top: 0 !important;
}
.hero__cta-under-text .btn {
  width: 100% !important;
  justify-content: center !important;
  padding: 18px 28px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
}

@media (max-width: 900px) {
  .hero__content { flex: none !important; }
  .hero__video   { flex: none !important; width: 100% !important; }
  .hero__cta-under-text { padding-top: 20px !important; margin-top: 0 !important; }
  .hero__cta-under-text .btn { width: 100% !important; }
}

/* ── SECTION ACCENT RULE — subtle divider between white sections ── */
.section-accent-rule {
  width: 100%;
  height: 1px;
  background: linear-gradient(
    to right,
    transparent 0%,
    #e0d8cc 20%,
    #c8a97a 50%,
    #e0d8cc 80%,
    transparent 100%
  );
  margin: 0;
  opacity: 0.7;
}

/* ── WE MANAGE IT — remove accent border, add top padding ── */
.manage-profit {
  border-top: none !important;
  padding-top: 72px !important;
}

/* ── WAVE DIVIDER between manage-profit and education ── */
.section-wave-between {
  line-height: 0;
  overflow: hidden;
  background: var(--c-white);
  margin: 0;
  padding: 0;
  display: block;
}
.section-wave-between svg {
  display: block;
  width: 100%;
  height: 80px;
}

/* ── PM PITCH — remove tan fallback box behind photo ── */
.pm-pitch__image {
  background: transparent !important;
  box-shadow: none !important;
}
.pm-pitch__image img {
  border-radius: var(--radius-lg);
}

/* ── PM PITCH — GHL form iframe sizing ── */
.pm-pitch__form-wrap {
  background: var(--c-white);
  border-radius: var(--radius-lg);
  padding: 28px 32px 20px;
  box-shadow: var(--shadow-md);
  border: 1px solid var(--c-border);
  margin-top: 8px;
}
.pm-pitch__form-title {
  font-size: 17px;
  font-weight: 700;
  margin: 0 0 16px;
  color: var(--c-primary);
}
.pm-pitch__ghl-form {
  width: 100%;
  min-height: 480px;
  border: none;
  display: block;
}
/* hide the iframe shell until a real URL is set */
.pm-pitch__ghl-form[src="GHL-FORM-EMBED-URL"] {
  display: none;
}
/* also hide the wrapper if form URL not set */
.pm-pitch__ghl-form[src="GHL-FORM-EMBED-URL"] ~ .pm-form-note {
  display: none;
}

/* hide entire form wrap until GHL URL is live */
.pm-pitch__form-wrap:has(.pm-pitch__ghl-form[src="GHL-FORM-EMBED-URL"]) {
  display: none;
}

/* ── PAGE HERO — kill navy gradient, use unified dark ── */
.page-hero {
  background: #1A1A1A !important;
  border-bottom: 3px solid #D4721A !important;
}

/* ── FOOTER COMPLIANCE — unified black, white logos ── */
.footer__compliance {
  background: rgba(0,0,0,0.18) !important;
}
.footer__bottom {
  background: transparent !important;
}
.footer__compliance-logos {
  flex: 0 0 auto;
  height: 52px;
  width: auto;
  opacity: 0.85;
  filter: brightness(1.05);
}

/* ── EDUCATION — cream background to match wave divider ── */
.education.section {
  background: var(--c-cream) !important;
}

/* ── TEAM SECTION — contained between two waves ── */
.section-wave-divider--dark-to-light {
  background: var(--c-primary); /* dark CTA band above */
}
.section-wave-divider--light-to-cream {
  background: var(--c-cream); /* cream PM pitch below */
}
.section-wave-divider--dark-to-light svg,
.section-wave-divider--light-to-cream svg {
  display: block;
  width: 100%;
  height: 80px;
}

/* ── TEAM TEASER — fix clipped bottom row photos ── */
.team-teaser {
  padding-bottom: 72px !important;
  overflow: visible !important;
}
.team-teaser__faces {
  overflow: visible !important;
}
.team-face-grid {
  overflow: visible !important;
}
.team-face-grid img {
  display: block;
}

/* ── WAVE DIVIDERS — full viewport width, no clipping ── */
.section-wave-divider,
.section-wave-between,
.section-wave-divider--dark-to-light,
.section-wave-divider--light-to-cream {
  width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  overflow: hidden !important;
}
.section-wave-divider svg,
.section-wave-between svg,
.section-wave-divider--dark-to-light svg,
.section-wave-divider--light-to-cream svg {
  width: 100% !important;
  min-width: 100% !important;
  display: block !important;
}

/* ── TEAM SECTION — shadow lift effect ── */
.team-teaser {
  box-shadow: 0 6px 32px rgba(0,0,0,0.09), 0 -4px 20px rgba(0,0,0,0.04) !important;
  position: relative !important;
  z-index: 1 !important;
}

/* ── WAVE: Testimonials (cream) → We Manage It (white) ── */
.section-wave-divider--cream-to-white-top {
  background: var(--c-cream);
}

/* ── FOOTER — single full-width divider, no compliance border ── */

/* Remove constrained border-top from footer__bottom */
.footer__bottom {
  border-top: none !important;
  padding-top: 0 !important;
  padding-bottom: 8px !important;
}

/* Full-width line above copyright row */
.footer__bottom::before {
  content: '';
  display: block;
  position: relative;
  left: 50%;
  margin-left: -50vw;
  width: 100vw;
  height: 1px;
  background: rgba(255,255,255,0.15);
  margin-bottom: 12px;
}

/* Kill ALL borders on compliance bar — one line only */
.footer__compliance {
  background: transparent !important;
  border-top: none !important;
  border-bottom: none !important;
  padding-bottom: 24px !important;
}

/* No trailing space below compliance */
.site-footer {
  padding-bottom: 0 !important;
}

/* ── WE MANAGE IT — nudge photo down ── */
.manage-profit__image {
  margin-top: 40px !important;
}

/* ── WE MANAGE IT — close sub-pixel gap at bottom ── */
.manage-profit {
  margin-bottom: -1px !important;
}

/* ── SECTION SUBTITLE centering fix ── */
.section-subtitle.text-center,
p.section-subtitle.text-center {
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

/* ── HERO CTA button — slightly smaller ── */
.hero-btn-main {
  min-width: 220px !important;
  padding: 13px 28px !important;
  font-size: 15px !important;
}

/* ── FOOTER WAVE — softens footer top with a curved wave on all pages ── */
.site-footer {
  position: relative;
  overflow: visible;
}
.site-footer::before {
  content: '';
  display: block;
  position: absolute;
  top: -59px;
  left: 0;
  right: 0;
  height: 60px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60' preserveAspectRatio='none'%3E%3Cpath d='M0%2C30 C360%2C0 1080%2C60 1440%2C30 L1440%2C60 L0%2C60 Z' fill='%231A1A1A'/%3E%3C/svg%3E");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: 0 0;
  pointer-events: none;
  z-index: 2;
}

/* ═══════════════════════════════════════════════════════════════
   OPTION B HERO — Cream headline stripe + Black hero body
   ═══════════════════════════════════════════════════════════════ */

/* Headline stripe flips to cream/tan */
.hero__headline-bar {
  background: var(--c-cream) !important;
  border-bottom: 3px solid var(--c-accent) !important;
}
.hero__headline {
  color: var(--c-primary) !important;
}

/* Hero body goes full black */
.hero--v2 {
  background: var(--c-primary) !important;
}

/* Subtitle + bullets go light on dark */
.hero__subtitle {
  color: rgba(255,255,255,0.72) !important;
}
.hero__bullets li {
  color: rgba(255,255,255,0.90) !important;
}

/* Vet badge — flip to cream on dark bg so it's visible */
.hero__vet .vet-badge {
  background: var(--c-cream) !important;
  color: var(--c-primary) !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
}

/* Slogan stays orange — pops great on black */

/* Trust bar bottom border aligns (already black, no change needed) */

/* ═══════════════════════════════════════════════════════════════
   HERO ANIMATED ENTRANCE — Option C
   ═══════════════════════════════════════════════════════════════ */

@keyframes heroFadeUp {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes heroFadeRight {
  from { opacity: 0; transform: translateX(32px); }
  to   { opacity: 1; transform: translateX(0); }
}

.hero-anim {
  opacity: 0;
  animation: heroFadeUp 0.65s cubic-bezier(0.22,1,0.36,1) forwards;
}
.hero-anim-right {
  opacity: 0;
  animation: heroFadeRight 0.75s cubic-bezier(0.22,1,0.36,1) forwards;
}

/* Stagger delays */
.hero-anim--d1  { animation-delay: 0.10s; }
.hero-anim--d2  { animation-delay: 0.25s; }
.hero-anim--d3  { animation-delay: 0.40s; }
.hero-anim--d4  { animation-delay: 0.52s; }
.hero-anim--d5  { animation-delay: 0.62s; }
.hero-anim--d6  { animation-delay: 0.72s; }
.hero-anim--d7  { animation-delay: 0.82s; }
.hero-anim-right--d1 { animation-delay: 0.35s; }

/* ═══════════════════════════════════════════════════════════════════════
   SCROLL REVEAL  —  visible by default, animated as an enhancement
   ═══════════════════════════════════════════════════════════════════════
   The reveal is opt-IN via .will-reveal, which main.js only adds once it
   has confirmed an IntersectionObserver exists and motion is wanted. If JS
   never runs, never fires, or the visitor prefers reduced motion, the
   content simply renders — it can never be left invisible.               */

.will-reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .5s ease, transform .5s ease;
}
.will-reveal.is-revealed {
  opacity: 1;
  transform: none;
}

/* ═══════════════════════════════════════════════════════════════════════
   REDUCED MOTION
   ═══════════════════════════════════════════════════════════════════════
   The site ships 7 keyframe animations — two of them infinite marquees —
   and had no reduced-motion handling at all. Anyone with vestibular
   sensitivity got the full carousel.                                     */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  /* Marquees animate via transform; stopping them mid-slide would hide
     content, so reset them to their start position and let the track wrap
     into a normal scrollable row instead. */
  .reviews-track,
  .team-track {
    animation: none !important;
    transform: none !important;
    flex-wrap: wrap;
    justify-content: center;
    width: 100% !important;
  }
  .will-reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   FOCUS VISIBILITY
   ═══════════════════════════════════════════════════════════════════════
   Keyboard users had no visible focus ring on the brand-coloured controls. */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--c-accent);
  outline-offset: 2px;
  border-radius: 3px;
}
.site-header a:focus-visible,
.top-bar a:focus-visible,
.site-footer a:focus-visible,
.nf__card:focus-visible {
  outline-color: var(--c-accent);
}

/* Skip link — first tab stop on every page. */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 9999;
  background: var(--c-primary);
  color: #fff;
  padding: 12px 20px;
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  border-radius: 0 0 var(--radius-md) 0;
}
.skip-link:focus {
  left: 0;
}

/* ═══════════════════════════════════════════════════════════════════════
   LEAD FORM STATES
   ═══════════════════════════════════════════════════════════════════════
   Forms used to submit to action="#" and silently reload. They now report
   what actually happened — including the phone number, every time, so a
   failure is never a dead end.                                           */

.lead-status {
  margin: 14px 0 0;
  padding: 12px 14px;
  border-radius: var(--radius-md);
  font-size: 14.5px;
  line-height: 1.5;
  font-family: var(--font-body);
}
.lead-status--pending {
  background: var(--c-cream);
  color: var(--c-text-mid);
}
.lead-status--error {
  background: #FBEAEA;
  color: #8C1515;
  border: 1px solid #E7C4C4;
}

.lead-done {
  text-align: center;
  padding: 44px 28px;
  background: var(--c-light-bg);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
}
.lead-done__mark {
  width: 54px;
  height: 54px;
  margin: 0 auto 18px;
  border-radius: 50%;
  background: var(--c-accent);
  color: #fff;
  font-size: 27px;
  line-height: 54px;
  font-weight: 700;
}
.lead-done h3 {
  font-family: var(--font-heading);
  font-size: 26px;
  color: var(--c-text);
  margin: 0 0 10px;
}
.lead-done p {
  font-size: 16px;
  line-height: 1.6;
  color: var(--c-text-mid);
  margin: 0 auto 8px;
  max-width: 42ch;
}
.lead-done__call {
  font-size: 14.5px;
  color: var(--c-text-light);
  margin-top: 16px;
}
.lead-done__call a {
  color: var(--c-accent);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
}

/* Dark form surfaces (management-services, vendor-contact) need the
   inverse treatment or the confirmation renders ink-on-ink. */
.ms-form .lead-done,
.vf-form .lead-done {
  background: rgba(255, 255, 255, .05);
  border-color: rgba(255, 255, 255, .16);
}
.ms-form .lead-done h3,
.vf-form .lead-done h3 { color: #fff; }
.ms-form .lead-done p,
.vf-form .lead-done p { color: rgba(255, 255, 255, .74); }

/* The image slot carries its own placeholder colour, so a failed or
   still-loading photo shows the brand tone rather than a white gap. This
   replaces an inline onerror that set the parent's background — which a
   <picture> wrapper would have broken, and which did nothing during the
   load, only after a failure. */
.manage-profit__image {
  background: var(--c-cream-dark);
}

/* ═══════════════════════════════════════════════════════════════════════
   MOBILE OVERFLOW
   ═══════════════════════════════════════════════════════════════════════
   Every page scrolled sideways on a phone. Measured at 375px before this:
   search-all-available-rentals 1060px (2.83x), meet-our-team 1033px,
   contact-us 1020px, featured-rentals 577px, home 446px.

   The dominant cause was the page-hero trust strip: `flex-wrap: nowrap` on
   the container plus `white-space: nowrap` on each chip forced three ~350px
   chips onto one line — 1060px of content in a 375px viewport, on the page
   a renter is most likely to land on. Most rental traffic is mobile.       */

.page-hero__trust {
  flex-wrap: wrap;
  row-gap: 10px;
}

@media (max-width: 900px) {
  /* Below the desktop layout the chips are stacked statements, not a row of
     labels, so they are allowed to wrap their own text. */
  .page-hero__chip {
    white-space: normal;
    flex: 1 1 100%;
    line-height: 1.45;
  }
}

@media (max-width: 560px) {
  /* Two stat cards side by side is 476px of content at 375px wide. */
  .stats-grid {
    grid-template-columns: 1fr;
  }
}

/* The marquee track is deliberately wider than the screen; the window it
   scrolls inside has to be the thing that clips it. */
.reviews-carousel,
.team-scroll {
  max-width: 100%;
  overflow-x: hidden;
}

/* Last-resort guard. If any future element overflows, the page still must
   not scroll sideways — a horizontal scrollbar on a phone reads as broken
   no matter what caused it. */
html,
body {
  overflow-x: hidden;
}

/* The skip link parks off-screen vertically rather than horizontally, so it
   can never contribute to horizontal overflow in any writing direction. */
.skip-link {
  left: 0;
  top: -100px;
  transition: top .15s ease;
}
.skip-link:focus {
  left: 0;
  top: 0;
}
@media (prefers-reduced-motion: reduce) {
  .skip-link { transition: none; }
}

/* ═══════════════════════════════════════════════════════════════════════
   NAV DROPDOWNS — keyboard and touch
   ═══════════════════════════════════════════════════════════════════════
   The six dropdown parents were <a href="#">: a dead tap on touch, invisible
   to a screen reader, and unreachable by keyboard because the menu only
   opened on :hover. They are real buttons now, and the menu opens on hover,
   on focus, and on aria-expanded.                                          */

.main-nav__toggle {
  background: none;
  border: 0;
  font: inherit;
  cursor: pointer;
  color: inherit;
}

.main-nav__item:hover .main-nav__dropdown,
.main-nav__item:focus-within .main-nav__dropdown,
.main-nav__toggle[aria-expanded="true"] + .main-nav__dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

@media (max-width: 1024px) {
  /* In the mobile drawer every dropdown used to be permanently expanded,
     which made the menu a wall of 30 links. They collapse now, and the
     button's aria-expanded is the truth of what is open. */
  .main-nav.open .main-nav__dropdown {
    display: none;
  }
  .main-nav.open .main-nav__toggle[aria-expanded="true"] + .main-nav__dropdown {
    display: block;
  }
  .main-nav__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    text-align: left;
  }
  .main-nav__toggle .chevron {
    transition: transform .2s ease;
  }
  .main-nav__toggle[aria-expanded="true"] .chevron {
    transform: rotate(180deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .main-nav__toggle .chevron { transition: none; }
}

/* ═══════════════════════════════════════════════════════════════════════
   ICONS
   ═══════════════════════════════════════════════════════════════════════
   Drawn set replacing 489 emoji. Every icon inherits the colour and the
   optical size of the text beside it, so it can never look pasted on.     */

.ic {
  width: 1em;
  height: 1em;
  /* Optical alignment: a 24-box stroke icon sits slightly high against a
     Latin baseline, so it is nudged down rather than centred arithmetically. */
  vertical-align: -0.135em;
  flex: none;
  color: inherit;
  overflow: visible;
}

/* Icons that stand alone as a section marker are drawn at display size and
   in the accent, because there they ARE the graphic, not a text companion. */
.education__icon .ic,
.trust-bar__icon .ic,
.svc-card__icon .ic,
.tech-tool__icon .ic,
.profile-meta__icon .ic,
.veteran-value__icon .ic,
.reason-item__icon .ic,
.pillar-card__icon .ic,
.audience-card__icon .ic {
  width: 1.9rem;
  height: 1.9rem;
  vertical-align: baseline;
  color: var(--c-accent);
  stroke-width: 1.5;
}

/* Inside a button or a chip the icon is a companion: same colour as the
   label, a hair smaller, with real space between icon and word. */
.btn .ic,
.pm-chip .ic,
.page-hero__chip .ic,
.top-bar__phone .ic,
.footer__link .ic {
  width: 1.05em;
  height: 1.05em;
  margin-right: .12em;
}

/* Buttons lay out as a row so the icon cannot drift from its label when the
   text wraps. */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45em;
}
.btn .ic { margin-right: 0; }

/* On a dark ground the standalone icons take the gold-orange; on white they
   already do. Nothing here overrides an explicitly coloured parent. */
.stats-section .ic,
.cta-band .ic,
.final-cta .ic,
.team-showcase .ic {
  color: currentColor;
}

/* A check inside a feature list is semantic, not decorative — give it the
   accent so a scan of the list reads as a list of yeses. */
.manage-profit__list .ic,
.hero__bullets .ic {
  color: var(--c-accent);
}

/* ═══════════════════════════════════════════════════════════════════════
   SERVICE-AREA MAP
   ═══════════════════════════════════════════════════════════════════════
   Replaces a Google Maps iframe pinned on downtown Phoenix at default zoom,
   which told a renter nothing about where APMI actually works.

   The zone list is the real navigation and works on its own. The WebGL layer
   is an enhancement that removes itself if it cannot run, so this section can
   never become an empty rectangle.                                        */

.zone-gl {
  /* Hidden until the renderer is ready. Without JavaScript, or if three.js
     fails to load, the section shows its zone list instead of an empty
     dark rectangle. */
  display: none;
  width: 100%;
  height: 440px;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background:
    radial-gradient(120% 90% at 30% 15%, #26262a 0%, #17171a 55%, #101012 100%);
  border: 1px solid rgba(255, 255, 255, .08);
  position: relative;
}
.zone-gl.is-live { display: block; }
.zone-gl canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
}
/* Until the canvas mounts, the panel reads as a deliberate dark slab rather
   than a loading gap. */
.zone-gl::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(70% 55% at 50% 45%, rgba(212, 114, 26, .10), transparent 70%);
  pointer-events: none;
}

.zone-gl__hint {
  margin: 10px 2px 0;
  font-size: 12.5px;
  letter-spacing: .04em;
  color: var(--c-text-light);
  text-align: center;
  opacity: 0;
  transition: opacity .4s ease;
}
.zone-gl.is-live + .zone-gl__hint { opacity: 1; }

/* ── Zone list ─────────────────────────────────────────────────────────
   Cities used to sit in a separate div below each button, so the button and
   the places it covers were two unrelated things. They are one target now. */
.zone-btn {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid var(--c-border);
  border-radius: var(--radius-md);
  background: var(--c-white);
  text-decoration: none;
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.zone-btn + .zone-btn { margin-top: 10px; }

.zone-btn__body { display: block; flex: 1; min-width: 0; }
.zone-btn__name {
  display: block;
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 700;
  color: var(--c-text);
  margin-bottom: 3px;
}
.zone-btn__cities {
  display: block;
  font-size: 12px;
  line-height: 1.5;
  color: var(--c-text-light);
}
.zone-btn__dot {
  width: 10px; height: 10px;
  border-radius: 50%;
  background: var(--c-accent);
  flex: none;
  margin-top: 5px;
}
.zone-btn__arrow {
  flex: none;
  margin-top: 3px;
  color: var(--c-text-light);
  transition: transform .18s ease, color .18s ease;
}

/* One hover state, shared by pointer, keyboard and the map itself — so the
   map lighting a zone and you hovering its name look identical. */
.zone-btn:hover,
.zone-btn:focus-visible,
.zone-btn.is-active {
  border-color: var(--c-accent);
  transform: translateX(3px);
  box-shadow: 0 6px 20px -12px rgba(212, 114, 26, .8);
}
.zone-btn:hover .zone-btn__arrow,
.zone-btn:focus-visible .zone-btn__arrow,
.zone-btn.is-active .zone-btn__arrow {
  transform: translateX(3px);
  color: var(--c-accent);
}

.zone-btn--all {
  justify-content: center;
  align-items: center;
  margin-top: 14px;
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: #fff;
  font-weight: 700;
  font-size: 14px;
}
.zone-btn--all:hover { background: var(--c-accent); border-color: var(--c-accent); transform: translateX(0); }

.zone-map__office {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 18px 2px 0;
  font-size: 12.5px;
  color: var(--c-text-light);
}
.zone-map__office .ic { color: var(--c-accent); }

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

@media (max-width: 900px) {
  .zone-gl { height: 320px; }
}
@media (prefers-reduced-motion: reduce) {
  .zone-btn, .zone-btn__arrow { transition: none; }
  .zone-btn:hover, .zone-btn.is-active { transform: none; }
}

/* ═══════════════════════════════════════════════════════════════════════
   SECTION RHYTHM
   ═══════════════════════════════════════════════════════════════════════
   The homepage ran one shape six times: centred eyebrow, centred serif
   headline, centred grey subtitle, then a grid of equal cards. Uniform
   meter is the signature of generated layout — a reader feels it even when
   they cannot name it. Each block below is given its own meter, weight and
   alignment so the page reads as a sequence of different moments.

   No markup was restructured. This is composition, not a rebuild.        */

/* ── 1. Audience sorter: a fork in the road, not three cards ─────────── */
.audience-sorter { padding-top: 92px; padding-bottom: 20px; }

.audience-sorter__header {
  max-width: 1120px;
  margin: 0 auto 8px;
  text-align: left;          /* was centred like everything else */
  padding: 0 24px;
}
.audience-sorter__header .section-subtitle { margin-left: 0; max-width: 46ch; }

.audience-grid--v2 {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 2px solid var(--c-text);
}
.audience-card--v2 {
  /* Card chrome removed. These are three doorways in one wall, divided by
     rules rather than floated as separate objects. */
  background: none;
  border: 0;
  border-right: 1px solid var(--c-border);
  border-radius: 0;
  box-shadow: none;
  padding: 34px 30px 40px 0;
  position: relative;
  transition: background .25s ease;
}
.audience-card--v2:last-child { border-right: 0; }
.audience-card--v2 + .audience-card--v2 { padding-left: 30px; }
.audience-card--v2:hover { background: linear-gradient(180deg, rgba(212,114,26,.05), transparent 70%); }

.audience-card__number {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .18em;
  color: var(--c-accent);
  margin-bottom: 18px;
}
.audience-card--v2 h3 {
  font-family: var(--font-heading);
  font-size: clamp(22px, 2.2vw, 30px);
  line-height: 1.12;
  margin-bottom: 12px;
}
.audience-card__cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 18px;
  font-weight: 700;
  font-size: 14px;
  color: var(--c-accent);
  border-bottom: 1px solid transparent;
  transition: border-color .2s ease;
}
.audience-card--v2:hover .audience-card__cta { border-bottom-color: var(--c-accent); }

/* ── 2. Stats: a measured band, not four boxes ───────────────────────── */
.stats-section__header { max-width: 900px; margin: 0 auto 46px; }
.stats-grid {
  gap: 0;
  max-width: 1120px;
}
.stat-card {
  background: none;
  border: 0;
  border-left: 1px solid rgba(255, 255, 255, .16);
  border-radius: 0;
  padding: 8px 26px 8px 26px;
  text-align: left;
}
.stat-card:first-child { border-left: 0; padding-left: 0; }
.stat-card__num {
  font-family: var(--font-heading);
  font-size: clamp(34px, 4vw, 52px);
  line-height: 1;
  font-variant-numeric: tabular-nums;
  margin-bottom: 12px;
}
.stat-card__label { font-size: 13.5px; line-height: 1.5; }

/* ── 3. Education: an editorial list, not a fourth card grid ─────────── */
.education__header {
  max-width: 1120px;
  margin: 0 auto 44px;
  padding: 0 24px;
  text-align: left;
}
.education__header .section-subtitle { margin-left: 0; max-width: 52ch; }

.education__grid {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 24px;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 56px;
}
.education__card {
  background: none;
  border: 0;
  border-top: 1px solid var(--c-border);
  border-radius: 0;
  box-shadow: none;
  padding: 30px 20px 34px 0;
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 0 18px;
  align-items: start;
}
.education__card h3 { grid-column: 2; font-size: 19px; margin-bottom: 8px; }
.education__card p  { grid-column: 2; margin-bottom: 14px; }
.education__card .full-service__link { grid-column: 2; }
.education__icon { grid-row: 1 / span 3; margin: 2px 0 0; }

/* ── 4. Stop the two photo blocks mirroring each other ───────────────── */
.pm-pitch__inner { direction: rtl; }
.pm-pitch__inner > * { direction: ltr; }

@media (max-width: 900px) {
  .audience-grid--v2,
  .education__grid { grid-template-columns: 1fr; }
  .audience-card--v2 {
    border-right: 0;
    border-bottom: 1px solid var(--c-border);
    padding: 28px 0 30px;
  }
  .audience-card--v2 + .audience-card--v2 { padding-left: 0; }
  .stat-card {
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, .16);
    padding: 22px 0;
  }
  .stat-card:first-child { border-top: 0; padding-top: 0; }
  .pm-pitch__inner { direction: ltr; }
}

/* ═══════════════════════════════════════════════════════════════════════
   POINTER DEPTH
   ═══════════════════════════════════════════════════════════════════════
   Cards respond to where the cursor is. Applied only to the cards people
   actually browse; JS adds .is-tilting and sets the custom properties, and
   only on a device with a real hovering pointer.                          */

.fr-card,
.tsc-card,
.zone-btn,
.audience-card--v2 {
  --tilt-x: 0deg;
  --tilt-y: 0deg;
  --glow-x: 50%;
  --glow-y: 50%;
  transform-style: preserve-3d;
  will-change: transform;
}

.fr-card.is-tilting,
.tsc-card.is-tilting {
  transform: perspective(900px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translateY(-4px) translateZ(6px);
  transition: transform .08s linear, box-shadow .25s ease;
  box-shadow: 0 18px 44px -22px rgba(26, 26, 26, .55);
}
.fr-card, .tsc-card { transition: transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s ease; }

/* A sheen that tracks the pointer, so the surface reads as lit rather than
   printed. Kept very low contrast — it should be felt, not noticed. */
.fr-card.is-tilting::after,
.tsc-card.is-tilting::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(
    240px circle at var(--glow-x) var(--glow-y),
    rgba(255, 255, 255, .13), transparent 62%);
}
.fr-card, .tsc-card { position: relative; }

/* The zone list and the audience columns get the lighting only — tilting a
   full-width row reads as wobble, not depth. */
.zone-btn.is-tilting {
  background-image: radial-gradient(
    320px circle at var(--glow-x) var(--glow-y),
    rgba(212, 114, 26, .07), transparent 60%);
}
.audience-card--v2.is-tilting {
  background-image: radial-gradient(
    420px circle at var(--glow-x) var(--glow-y),
    rgba(212, 114, 26, .08), transparent 62%);
}

@media (prefers-reduced-motion: reduce) {
  .fr-card, .tsc-card, .zone-btn, .audience-card--v2 {
    transform: none !important;
    transition: none !important;
    background-image: none !important;
    will-change: auto;
  }
  .fr-card::after, .tsc-card::after { display: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   LIVE LISTINGS
   ═══════════════════════════════════════════════════════════════════════
   Rendered from /api/listings. Replaces ten hand-typed properties whose
   photos were hotlinked from Redfin and Brivity, and five filter controls
   that had no name, no id and no handler.                                */

.lst-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 24px;
}

.lst-card {
  background: var(--c-white);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: border-color .2s ease, box-shadow .25s ease, transform .25s ease;
}
.lst-card:hover {
  border-color: var(--c-accent);
  box-shadow: 0 14px 36px -20px rgba(26, 26, 26, .5);
  transform: translateY(-3px);
}

.lst-card__media {
  position: relative;
  display: block;
  aspect-ratio: 4 / 3;
  background: var(--c-cream-dark);
  overflow: hidden;
}
.lst-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s cubic-bezier(.2, .7, .3, 1);
}
.lst-card:hover .lst-card__media img { transform: scale(1.04); }

.lst-card__noimg {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: var(--c-text-light);
}
.lst-card__noimg .ic { width: 2.4rem; height: 2.4rem; }

.lst-card__tag,
.lst-card__price {
  position: absolute;
  font-family: var(--font-body);
  line-height: 1;
}
.lst-card__tag {
  top: 12px; left: 12px;
  background: var(--c-accent);
  color: #fff;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 6px 10px;
  border-radius: 20px;
}
.lst-card__price {
  bottom: 12px; right: 12px;
  background: rgba(20, 20, 20, .88);
  color: #fff;
  font-size: 19px;
  font-weight: 700;
  padding: 8px 12px;
  border-radius: var(--radius-md);
  font-variant-numeric: tabular-nums;
}
.lst-card__per { font-size: 11px; font-weight: 400; opacity: .8; }

.lst-card__body {
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}
.lst-card__addr {
  font-family: var(--font-body);
  font-size: 15.5px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
}
.lst-card__addr a { color: var(--c-text); text-decoration: none; }
.lst-card__addr a:hover { color: var(--c-accent); }
.lst-card__city  { font-size: 13px; color: var(--c-text-mid); margin: 0; }
.lst-card__facts { font-size: 12.5px; color: var(--c-text-light); margin: 2px 0 0; }
.lst-card__actions {
  display: flex;
  gap: 8px;
  margin-top: auto;
  padding-top: 14px;
}
.lst-card__actions .btn { flex: 1; }

/* Loading placeholders that hold the card's real shape, so nothing jumps
   when the data lands. */
.lst-skeleton {
  aspect-ratio: 4 / 3;
  border-radius: var(--radius-lg);
  background: linear-gradient(100deg, var(--c-cream) 30%, #fff 50%, var(--c-cream) 70%);
  background-size: 220% 100%;
  animation: lst-shimmer 1.4s linear infinite;
}
@keyframes lst-shimmer { to { background-position: -220% 0; } }

.lst-status { font-size: 13px; color: var(--c-text-light); margin: 4px 0 0; }
.lst-status--info { color: var(--c-accent); }

.lst-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 56px 24px;
  background: var(--c-light-bg);
  border: 1px dashed var(--c-border);
  border-radius: var(--radius-lg);
}
.lst-empty h3 {
  font-family: var(--font-heading);
  font-size: 22px;
  margin: 0 0 10px;
}
.lst-empty p {
  max-width: 46ch;
  margin: 0 auto 20px;
  color: var(--c-text-mid);
  font-size: 15px;
  line-height: 1.6;
}
.lst-empty__actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

/* ── Filter rail ─────────────────────────────────────────────────────── */
.lst-filters {
  background: var(--c-white);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
  padding: 22px;
  align-self: start;
  position: sticky;
  top: 92px;
}
.lst-filters__title {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--c-text);
  margin-bottom: 16px;
}
.lst-filters__note {
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--c-text-light);
  margin: 14px 0 0;
}
.lst-filters__help {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--c-border);
}
.lst-filters__help p {
  font-size: 13px;
  line-height: 1.55;
  color: var(--c-text-mid);
  margin-bottom: 12px;
}

@media (max-width: 900px) {
  .lst-filters { position: static; }
}
@media (prefers-reduced-motion: reduce) {
  .lst-card, .lst-card__media img { transition: none; }
  .lst-card:hover { transform: none; }
  .lst-card:hover .lst-card__media img { transform: none; }
  .lst-skeleton { animation: none; }
}

/* A city filter has no matching option in the zone select — the city tiles
   above the results send a city, the homepage map sends a zone — so it shows
   as a chip the visitor can clear. */
.lst-chips { margin-top: 8px; }
.lst-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: var(--c-accent);
  color: #fff;
  border: 0;
  border-radius: 20px;
  padding: 5px 12px;
  font-family: var(--font-body);
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  transition: background .18s ease;
}
.lst-chip:hover { background: var(--c-accent-dark); }
.lst-chip .ic { width: .85em; height: .85em; }


/* ── Dropdown section label ───────────────────────────────────────────────
   The Manage menu now carries the three service-area pages. Without a divider
   they read as three more services rather than as a group of places. */
.main-nav__group {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #a89f8f;
  padding: 12px 20px 5px;
  margin-top: 6px;
  border-top: 1px solid #efe9dd;
  pointer-events: none;
}


/* ── Listing card: pet policy and availability ────────────────────────────
   Both come straight from AppFolio and were being parsed and thrown away.
   "Do they take dogs" and "when can I move in" are the two questions a
   renter asks before they ask anything else. */
.lst-card__pets {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  font-size: 13px;
  font-weight: 600;
  
  color: #2f7d46;
}
.lst-card__pets .ic { width: 15px; height: 15px; flex: 0 0 auto; }
.lst-card__avail {
  margin-top: 6px;
  font-size: 13px;
  font-weight: 600;
  color: #B85F12;
}


/* A future move-in date is not "available now". Muted rather than the live
   orange, so a scanner's eye goes to the homes they can actually move into. */
.lst-card__tag--later {
  background: rgba(26, 26, 26, 0.82);
  color: #fff;
}


/* ══ IDX — homes for sale ═══════════════════════════════════════════════
   Reuses the rental card and grid classes deliberately: a home for sale and
   a home for rent are the same object to a visitor, and two card systems
   would drift apart the way the header once did. */

.lst-layout { display: grid; grid-template-columns: 264px 1fr; gap: 40px; align-items: start; }
.lst-side { position: sticky; top: 20px; }
.lst-main { min-width: 0; }

.idx-pager {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  margin-top: 36px; padding-top: 24px; border-top: 1px solid #e6e0d5;
}
.idx-pager__at { font-size: 13px; color: #7a7a7a; font-weight: 600; }

/* Listing-brokerage attribution. Required by the IDX licence on every
   listing that is not ours — never remove it to tidy up a card. */
.idx-attr { font-size: 11.5px; color: #8a8a8a; margin-top: 8px; line-height: 1.5; }
.idx-attr--block { margin-top: 28px; padding-top: 16px; border-top: 1px solid #e6e0d5; font-size: 12px; }

.idx-cities { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 28px; }
.idx-city {
  background: #fff; border: 1px solid #e6e0d5; border-radius: 999px;
  padding: 9px 18px; font-size: 14px; font-weight: 600; color: #1A1A1A;
  text-decoration: none; transition: border-color .16s ease, color .16s ease, transform .16s ease;
}
.idx-city:hover { border-color: #D4721A; color: #D4721A; transform: translateY(-1px); }

.page-hero--tight { padding-bottom: 34px; }
.idx-detail__h1 { font-size: clamp(26px, 3.4vw, 40px); }
.idx-detail__price { font-size: 30px; font-weight: 800; color: #D4721A; margin-top: 14px; font-family: var(--font-heading); }
.idx-detail__price span { font-size: 15px; font-weight: 600; color: rgba(255,255,255,.6); letter-spacing: .06em; text-transform: uppercase; }

.idx-gallery {
  position: relative;
  display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 190px; gap: 8px;
  margin-bottom: 40px; border-radius: 14px; overflow: hidden;
}
.idx-gallery img { width: 100%; height: 100%; object-fit: cover; display: block; background: #ece7dd; }
/* Hero spans two columns and both rows; four more fill the remainder, which
   is why the renderer caps at five. */
.idx-gallery img:first-child { grid-column: span 2; grid-row: span 2; }
/* A listing with fewer than five still fills the row rather than leaving a
   hole where the grid expected one. */
.idx-gallery[data-count="1"] { grid-template-columns: 1fr; grid-auto-rows: 420px; }
.idx-gallery[data-count="2"] { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 300px; }
.idx-gallery[data-count="2"] img:first-child { grid-column: span 1; grid-row: span 1; }
.idx-gallery[data-count="3"] { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 240px; }
.idx-gallery[data-count="3"] img:first-child { grid-column: span 1; grid-row: span 1; }
.idx-gallery[data-count="4"] { grid-template-columns: repeat(3, 1fr); }
.idx-gallery[data-count="4"] img:first-child { grid-column: span 2; grid-row: span 2; }
.idx-gallery__more {
  position: absolute; right: 12px; bottom: 12px;
  background: rgba(26,26,26,.86); color: #fff; font-size: 12.5px; font-weight: 600;
  padding: 7px 13px; border-radius: 999px; letter-spacing: .02em;
}

.idx-detail { display: grid; grid-template-columns: 1fr 320px; gap: 44px; align-items: start; }
.idx-h2 { font-family: var(--font-heading); font-size: 24px; color: #1A1A1A; margin: 0 0 14px; }
.idx-h2 + .idx-body { margin-bottom: 34px; }
.idx-body { font-size: 15.5px; line-height: 1.85; color: #4a4a4a; white-space: pre-line; }

.idx-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: #e6e0d5; border: 1px solid #e6e0d5; border-radius: 10px; overflow: hidden; margin: 0; }
.idx-facts > div { background: #fff; padding: 14px 18px; }
.idx-facts dt { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: #8a8a8a; font-weight: 700; margin-bottom: 4px; }
.idx-facts dd { margin: 0; font-size: 15.5px; font-weight: 600; color: #1A1A1A; }

.idx-cta { position: sticky; top: 20px; background: #1A1A1A; border-radius: 14px; padding: 26px 24px; }
.idx-cta h3 { font-family: var(--font-heading); font-size: 21px; color: #fff; margin: 0 0 10px; }
.idx-cta p { font-size: 14px; color: rgba(255,255,255,.7); line-height: 1.7; margin-bottom: 18px; }
.idx-cta .btn { margin-bottom: 10px; }
.idx-cta__note { font-size: 12px; color: rgba(255,255,255,.45); margin: 6px 0 0; }

@media (max-width: 900px) {
  .lst-layout { grid-template-columns: 1fr; gap: 28px; }
  .lst-side { position: static; }
  .idx-detail { grid-template-columns: 1fr; gap: 32px; }
  .idx-cta { position: static; }
  .idx-gallery { grid-template-columns: repeat(2, 1fr); }
  .idx-gallery img { height: 150px; }
  .idx-gallery img:first-child { grid-column: span 2; height: 220px; }
  .idx-facts { grid-template-columns: 1fr; }
}


/* ══ Search filter controls ════════════════════════════════════════════
   Moved here out of search-all-available-rentals' inline <style>. The
   homes-for-sale pages are rendered by a Pages Function and so cannot
   inherit another page's inline CSS — and two copies of a control's styling
   is how the header ended up in fourteen versions. One definition, both
   searches. */
.filter-group { margin-bottom: 20px; }
.filter-group label { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: var(--c-text-mid); margin-bottom: 8px; }
.filter-group select, .filter-group input { width: 100%; padding: 10px 14px; border: 1.5px solid var(--c-border); border-radius: var(--radius-sm); font-family: var(--font-body); font-size: 14px; color: var(--c-text); outline: none; appearance: none; }
.filter-group select:focus, .filter-group input:focus { border-color: var(--c-accent); box-shadow: 0 0 0 3px rgba(212,114,26,0.1); }




/* Accessible geographic search and practical resource tools */
.valley-search{color:#172d3b;width:100%;min-width:0}.valley-controls{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:18px}.valley-controls label{display:grid;gap:8px;font-size:16px;font-weight:600;flex:1;min-width:180px}.valley-controls input,.valley-controls select{padding:12px;border:1px solid #acbac4;border-radius:8px;background:white;color:#172d3b;font:inherit;width:100%}.valley-svg{overflow:auto}.valley-svg svg{display:block;width:100%;min-width:640px}.valley-cities{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.valley-cities .btn{font-size:14px}.resource-body{max-width:900px;margin:auto;line-height:1.7}.resource-body h2{margin:34px 0 14px}.resource-body p,.resource-body li{font-size:17px}.resource-body ul,.resource-body ol{padding-left:24px}.resource-body details{border:1px solid #d7dfe4;border-radius:10px;padding:20px;margin:16px 0}.resource-body summary{font-size:21px;font-weight:700;cursor:pointer}.resource-body label{display:block;font-size:16px;margin:14px 0 6px}.resource-body input,.resource-body textarea{padding:12px;border:1px solid #9cabb6;border-radius:6px;width:100%;font:inherit}.resource-body input[type=checkbox]{width:auto}.resource-grid-fields{display:grid;grid-template-columns:1fr 1fr;gap:18px}.resource-result{padding:24px;background:#edf5f7;border-left:4px solid #135e72;margin:22px 0}.resource-actions{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.resource-body table{width:100%;border-collapse:collapse}.resource-body td,.resource-body th{padding:12px;border-bottom:1px solid #ccd7dd;text-align:left}.resource-body progress{width:100%;height:20px}.resource-note{font-size:14px!important;color:#526370}.resource-check{display:flex!important;gap:10px;align-items:baseline}.resource-check input{flex:0 0 auto}.resource-body :focus-visible,.valley-search :focus-visible{outline:3px solid #135e72;outline-offset:4px}@media(max-width:640px){.resource-grid-fields{grid-template-columns:1fr}.valley-controls{display:block}.valley-controls label{margin-bottom:12px}.zone-map__inner{display:block!important}.zone-map__map{width:100%!important;min-width:0}.resource-body{padding:0 8px}}@media print{.site-header,.top-bar,.site-footer,.resource-actions,form[data-lead-form],.page-hero__trust{display:none!important}.resource-body{max-width:none}.page-hero{padding:24px!important}}



/* Shared page exploration, search, and responsive interactions. */
[hidden] { display: none !important; }
.xp-search-trigger { flex:0 0 auto; border:1px solid #d8c4b3; border-radius:999px; padding:9px 12px; background:#fffaf4; color:#54301b; font:600 12px var(--font-body, sans-serif); cursor:pointer; min-height:40px; }
.xp-search-trigger:hover { background:#f3e6d6; }
.xp-search-dialog { width:min(720px,calc(100% - 28px)); max-height:85dvh; margin:auto; padding:28px; border:1px solid #dbc9b4; border-radius:20px; background:#fffdf9; color:#322116; box-shadow:0 28px 90px #0005; }
.xp-search-dialog::backdrop { background:rgb(26 19 14 / 65%); backdrop-filter:blur(4px); }
.xp-dialog-head { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:20px; }
.xp-dialog-head h2 { margin:0; font-family:var(--font-heading,serif); font-size:28px; }
.xp-search-dialog label,.xp-tools>label,.xp-faq-label { display:block; font-size:14px; font-weight:600; margin-bottom:8px; }
.xp-input { width:100%; max-width:100%; min-width:0; min-height:46px; padding:11px 14px; border:1px solid #bda58e; border-radius:9px; background:#fff; color:#352216; font:inherit; box-sizing:border-box; }
.xp-input:focus-visible,.xp-button:focus-visible,.xp-search-trigger:focus-visible,.xp-save:focus-visible { outline:3px solid #bc671d; outline-offset:3px; }
.xp-status { font-size:13px; color:#68574a; margin:10px 0; }
.xp-search-results { display:grid; gap:8px; margin-top:14px; }
.xp-search-result { padding:15px 17px; display:block; border:1px solid #eadfce; border-radius:10px; color:#59311a; font-weight:700; text-decoration:none; background:#fff; }
.xp-search-result:hover,.xp-search-result:focus-visible { background:#f6eadb; border-color:#c58d56; }
.xp-search-result span { display:block; margin-top:5px; font-size:13px; color:#68574a; font-weight:400; line-height:1.5; }
.xp-page-nav { display:flex; align-items:center; justify-content:center; gap:18px; padding:14px 24px; background:#faf6ef; border-block:1px solid #e6d8c7; }
.xp-page-nav label { flex-shrink:0; font-size:12px; text-transform:uppercase; font-weight:700; letter-spacing:.08em; }
.xp-page-nav select { width:min(520px,100%); font-size:14px; }
.xp-anchor { scroll-margin-top:130px; }
.xp-reading-progress { position:fixed; top:0; left:0; width:100%; height:3px; z-index:10001; background:#d98b34; transform-origin:left; pointer-events:none; }
.xp-tools { border:1px solid #decbb5; background:#fbf7f0; padding:24px; border-radius:16px; margin:28px auto; max-width:900px; text-align:left; }
.xp-filter-row { display:flex; flex-wrap:wrap; gap:9px; margin:16px 0; }
.xp-button,.xp-save { min-height:44px; padding:10px 17px; border:1px solid #bfa68a; border-radius:999px; background:#fffdf8; color:#573219; font:600 14px var(--font-body,sans-serif); cursor:pointer; }
.xp-button:hover,.xp-save:hover { background:#f1e3cf; }
.xp-button[aria-pressed=true],.xp-save[aria-pressed=true] { color:#fff; background:#633c23; border-color:#633c23; }
.xp-empty { padding:20px; background:#faf3e9; border-radius:12px; color:#50351f; }
.xp-journey { background:#f8f1e6; border-bottom:1px solid #ddc8ac; padding:32px 0; }
.xp-journey h2 { font:600 clamp(25px,3vw,34px) var(--font-heading,serif); margin-bottom:8px; }
.xp-journey-result { display:flex; flex-wrap:wrap; align-items:center; gap:10px 24px; border-top:1px solid #decaaf; padding-top:18px; }
.xp-journey-result p { flex:1 1 310px; margin:0; }
.xp-journey-result a,.xp-checklist>a { color:#754015; text-decoration:underline; text-underline-offset:4px; font-weight:600; }
.xp-checklist { width:calc(100% - 40px); max-width:880px; margin:32px auto; padding:28px; background:#faf5ed; border:1px solid #e0cdb4; border-radius:16px; box-sizing:border-box; }
.xp-checklist h2 { font:600 clamp(24px,3vw,32px) var(--font-heading,serif); margin-bottom:12px; }
.xp-checklist>p { line-height:1.65; }
.xp-check { display:flex; align-items:flex-start; gap:12px; padding:14px 0; border-bottom:1px solid #e7d8c4; cursor:pointer; }
.xp-check input { flex:none; width:20px; height:20px; margin-top:3px; accent-color:#70441e; }
.xp-checklist>a { display:inline-block; margin:12px 18px; }
.xp-shortlist-bar { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin:18px 0; }
.lst-card__actions { flex-wrap:wrap; }
.xp-save { font-size:12px; padding:8px 12px; }
.faq-q[aria-expanded=true] .faq-chevron { transform:rotate(180deg); }
@media (prefers-reduced-motion:no-preference) {
  .xp-enter { animation:xp-arrive .55s cubic-bezier(.2,.7,.2,1) both; }
  @keyframes xp-arrive { from { opacity:.75; transform:translateY(14px); } to { opacity:1; transform:translateY(0); } }
  .team-member-card,.next-step,.xp-search-result,.xp-button,.xp-save { transition:box-shadow .22s,background-color .22s,border-color .22s; }
  .team-member-card:hover { box-shadow:0 16px 40px #51301620; }
  .page-hero__title,.profile-hero__name { animation:xp-arrive .6s ease-out both; }
}
@media (max-width:700px) {
 .xp-search-trigger { margin-left:auto; font-size:11px; padding:7px 10px; }
 .xp-search-dialog { padding:20px; }
 .xp-dialog-head h2 { font-size:23px; }
 .xp-page-nav { padding:12px 16px; gap:10px; }
 .xp-page-nav label { font-size:10px; }
 .xp-checklist { padding:20px; }
 .xp-tools { padding:18px; }
 .xp-journey { padding:26px 0; }
}
@media print { .xp-search-trigger,.xp-page-nav,.xp-search-dialog,.xp-reading-progress,.xp-shortlist-bar,.xp-save { display:none!important; } }


@media (max-width:500px) {
 .header__logo { flex:0 0 72px; }
 .header__logo img { max-width:72px; height:auto; }
 .header__cta { gap:7px; }
 .header__cta .btn-primary { font-size:11px; padding:10px; white-space:normal; text-align:center; }
 .xp-search-trigger { max-width:58px; line-height:1.2; }
}

.xp-motion-toggle { font:inherit; color:inherit; background:none; border:1px solid currentColor; border-radius:6px; padding:6px 10px; cursor:pointer; }
.xp-motion-paused *, .xp-motion-paused *::before, .xp-motion-paused *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
.xp-motion-paused .will-reveal { opacity:1!important; transform:none!important; }



/* ── MLS market snapshot ───────────────────────────────────────────────
   Pre-plumbed blocks on the service-area pages. They ship showing the
   fallback copy and are replaced in place by assets/js/mls-modules.js once
   the ARMLS feed is connected, so both states need to look deliberate. */
.mls-stats { max-width: 780px; margin-left: auto; margin-right: auto; text-align: center; }
.mls-stats__fallback { font-size: 16px; line-height: 1.7; color: var(--c-text-mid); margin: 0 auto 22px; max-width: 660px; }
.mls-stats__fallback-cta { margin: 0; display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.mls-stats__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 24px; margin: 0 0 20px; }
/* One grid item per statistic. Each .mls-stats__cell holds its own dt/dd in
   valid order (dt first); the number is lifted above the label with flex
   column-reverse, so the visual order is value-then-label without inverting
   the markup a screen reader relies on. */
.mls-stats__cell { display: flex; flex-direction: column-reverse; align-items: center; }
.mls-stats__grid dd { font-family: var(--font-heading); font-size: clamp(28px, 4vw, 38px); font-weight: 700; color: var(--c-accent); margin: 0; line-height: 1.1; }
.mls-stats__grid dt { font-size: 12px; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; color: var(--c-text-mid); margin: 6px 0 0; }
.mls-stats__note { font-size: 12.5px; line-height: 1.6; color: var(--c-text-light); margin: 0; }

/* ==== BEGIN generated heading-visual mirrors — build-heading-visuals.mjs ==== */
/* Generated — do not edit. A heading whose LEVEL was corrected for
   screen readers keeps the appearance of the level it replaced.
   Regenerate: node scripts/build-heading-visuals.mjs */
.hero__card .h3-visual { font-family: var(--font-heading); font-size: 16px; color: var(--c-primary); margin-bottom: 14px; }
.video-section__text .h2-visual { font-family: var(--font-heading); font-size: clamp(26px, 3.5vw, 40px); color: var(--c-primary); margin-bottom: 16px; line-height: 1.25; }
.full-service__card .h3-visual { font-family: var(--font-heading); font-size: 20px; color: var(--c-primary); margin-bottom: 10px; }
.education__card .h3-visual { font-family: var(--font-heading); font-size: 17px; color: var(--c-primary); margin-bottom: 10px; }
.audience-card .h3-visual { font-family: var(--font-heading); font-size: 22px; font-weight: 700; margin-bottom: 12px; color: var(--c-primary); }
.team-showcase__header .h2-visual { font-family: var(--font-heading); font-size: clamp(28px, 3.5vw, 44px); font-weight: 700; line-height: 1.2; color: #fff; margin-bottom: 16px; }
.audience-card--v2 .h3-visual { font-family: var(--font-heading); font-size: clamp(20px, 2vw, 26px); font-weight: 800; color: var(--c-primary); line-height: 1.25; margin: 0; }
.pm-pitch__form-col .h3-visual { font-family: var(--font-heading); font-size: 22px; font-weight: 800; color: var(--c-primary); margin: 0 0 20px; }
.lead-done .h3-visual { font-family: var(--font-heading); font-size: 26px; color: var(--c-text); margin: 0 0 10px; }
.ms-form .lead-done .h3-visual, .vf-form .lead-done .h3-visual { color: #fff; }
.audience-card--v2 .h3-visual { font-family: var(--font-heading); font-size: clamp(22px, 2.2vw, 30px); line-height: 1.12; margin-bottom: 12px; }
.education__card .h3-visual { grid-column: 2; font-size: 19px; margin-bottom: 8px; }
.lst-empty .h3-visual { font-family: var(--font-heading); font-size: 22px; margin: 0 0 10px; }
.idx-cta .h3-visual { font-family: var(--font-heading); font-size: 21px; color: #fff; margin: 0 0 10px; }
.resource-body .h2-visual { margin:34px 0 14px }
.xp-dialog-head .h2-visual { margin:0; font-family:var(--font-heading,serif); font-size:28px; }
.xp-journey .h2-visual { font:600 clamp(25px,3vw,34px) var(--font-heading,serif); margin-bottom:8px; }
.xp-checklist .h2-visual { font:600 clamp(24px,3vw,32px) var(--font-heading,serif); margin-bottom:12px; }
@media(max-width:700px) {
  .xp-dialog-head .h2-visual { font-size:23px; }
}
/* ==== END generated heading-visual mirrors ==== */
