/* Primary site theme: photography machinery + Theme 09 "Ember".
   Generated by build.js from theme-photos.css + theme-v9.css — edit those. */

/* ============================================================
   Shared photography machinery for the photo themes (v6-v9).
   Loads before theme-vN.css, which sets the color tokens plus:
     --p-sat-hero / --p-bright-hero  hero grade
     --p-sat / --p-bright            inner-page hero grade
     --scrim                         R,G,B triple matching the theme ground
   Imagery licensing: see the credit line on the preview homepages.
   ============================================================ */

:root {
  --p-sat-hero: 0.72;
  --p-bright-hero: 0.6;
  --p-sat: 0.7;
  --p-bright: 0.52;
  --scrim: 20, 17, 14;
}

/* ---------- homepage hero: Dallas dusk from Reunion Tower ---------- */
.hero-rings { display: none; }

.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image: url('/assets/img/city/dallas-hero.webp');
  background-size: cover;
  background-position: center 38%;
  filter: saturate(var(--p-sat-hero)) brightness(var(--p-bright-hero)) contrast(1.06);
}

.hero-vignette {
  z-index: 1;
  background:
    linear-gradient(100deg,
      rgba(var(--scrim), 0.94) 0%,
      rgba(var(--scrim), 0.82) 34%,
      rgba(var(--scrim), 0.38) 62%,
      rgba(var(--scrim), 0.55) 100%),
    linear-gradient(to bottom,
      rgba(var(--scrim), 0.55) 0%,
      rgba(var(--scrim), 0) 30%,
      rgba(var(--scrim), 0) 62%,
      rgba(var(--scrim), 0.96) 100%);
}

.hero::after {
  content: '— DALLAS · FROM REUNION TOWER';
  position: absolute;
  right: clamp(1.25rem, 4vw, 2.5rem);
  bottom: 1.4rem;
  z-index: 2;
  font-family: var(--mono);
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.26em;
  color: var(--ink-faint);
}

.hero .lede { color: var(--ink-dim); }

/* ---------- creed band: Historic Collin County Courthouse ---------- */
.creed {
  position: relative;
  background:
    linear-gradient(rgba(var(--scrim), 0.9), rgba(var(--scrim), 0.93)),
    url('/assets/img/city/mckinney-courthouse.webp') center 30% / cover no-repeat;
}
.creed blockquote,
.creed figcaption { position: relative; }
.creed::after {
  content: '— HISTORIC COLLIN COUNTY COURTHOUSE · DOWNTOWN McKINNEY';
  display: block;
  margin-top: 2.2rem;
  font-family: var(--mono);
  font-size: 0.6rem;
  font-weight: 500;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--ink-faint);
}

/* ---------- closing CTA band: Dallas dusk ---------- */
.cta-band {
  background:
    linear-gradient(rgba(var(--scrim), 0.9), rgba(var(--scrim), 0.86)),
    url('/assets/img/city/dallas-cta.webp') center 42% / cover no-repeat;
}
.cta-rings { opacity: 0.1; }

.service-area { background: var(--bg-raised); }

@media (max-width: 720px) {
  .hero::before { background-position: 62% 38%; }
  .hero::after { display: none; }
}

/* ============================================================
   Inner-page hero photography (the /vN/ full-site subtrees)
   ============================================================ */

.vp-systems-access-control .page-hero-rings,
.vp-systems-video-surveillance .page-hero-rings,
.vp-systems-intercom-entry .page-hero-rings,
.vp-approach .page-hero-rings,
.vp-industries-k-12-schools .page-hero-rings,
.vp-industries-healthcare .page-hero-rings,
.vp-industries-commercial .page-hero-rings,
.vp-contact .page-hero-rings,
.vp-insights .page-hero-rings,
.vp-insights-texas-school-door-audit .page-hero-rings,
.vp-insights-school-safety-allotment .page-hero-rings,
.vp-insights-secured-vestibule-design .page-hero-rings,
.vp-insights-healthcare-workplace-violence-plans .page-hero-rings,
.vp-insights-lost-master-key .page-hero-rings { display: none; }

.vp-systems-access-control .page-hero::before,
.vp-systems-video-surveillance .page-hero::before,
.vp-systems-intercom-entry .page-hero::before,
.vp-approach .page-hero::before,
.vp-industries-k-12-schools .page-hero::before,
.vp-industries-healthcare .page-hero::before,
.vp-industries-commercial .page-hero::before,
.vp-contact .page-hero::before,
.vp-insights .page-hero::before,
.vp-insights-texas-school-door-audit .page-hero::before,
.vp-insights-school-safety-allotment .page-hero::before,
.vp-insights-secured-vestibule-design .page-hero::before,
.vp-insights-healthcare-workplace-violence-plans .page-hero::before,
.vp-insights-lost-master-key .page-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -2;
  background-size: cover;
  background-position: center;
  filter: saturate(var(--p-sat)) brightness(var(--p-bright)) contrast(1.04);
}

.vp-systems-access-control .page-hero::after,
.vp-systems-video-surveillance .page-hero::after,
.vp-systems-intercom-entry .page-hero::after,
.vp-approach .page-hero::after,
.vp-industries-k-12-schools .page-hero::after,
.vp-industries-healthcare .page-hero::after,
.vp-industries-commercial .page-hero::after,
.vp-contact .page-hero::after,
.vp-insights .page-hero::after,
.vp-insights-texas-school-door-audit .page-hero::after,
.vp-insights-school-safety-allotment .page-hero::after,
.vp-insights-secured-vestibule-design .page-hero::after,
.vp-insights-healthcare-workplace-violence-plans .page-hero::after,
.vp-insights-lost-master-key .page-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(100deg,
      rgba(var(--scrim), 0.95) 0%,
      rgba(var(--scrim), 0.86) 38%,
      rgba(var(--scrim), 0.55) 72%,
      rgba(var(--scrim), 0.72) 100%),
    linear-gradient(to bottom,
      rgba(var(--scrim), 0.5) 0%,
      rgba(var(--scrim), 0.15) 40%,
      rgba(var(--scrim), 0.98) 100%);
}

.vp-systems-access-control .page-hero::before { background-image: url('/assets/img/city/access-control.webp'); background-position: center 30%; }
.vp-systems-video-surveillance .page-hero::before { background-image: url('/assets/img/city/video-surveillance.webp'); background-position: center 22%; }
.vp-systems-intercom-entry .page-hero::before { background-image: url('/assets/img/city/intercom.webp'); background-position: center 45%; }
.vp-approach .page-hero::before { background-image: url('/assets/img/city/approach.webp'); }
.vp-industries-k-12-schools .page-hero::before { background-image: url('/assets/img/city/school.webp'); background-position: center 55%; }
.vp-industries-healthcare .page-hero::before { background-image: url('/assets/img/city/hospital.webp'); background-position: center 40%; }
.vp-industries-commercial .page-hero::before { background-image: url('/assets/img/city/commercial.webp'); background-position: center 25%; }
.vp-contact .page-hero::before { background-image: url('/assets/img/city/mckinney-downtown.webp'); background-position: center 40%; }
.vp-insights .page-hero::before { background-image: url('/assets/img/city/dallas-cta.webp'); background-position: center 42%; }
.vp-insights-texas-school-door-audit .page-hero::before { background-image: url('/assets/img/city/school.webp'); background-position: center 55%; }
.vp-insights-school-safety-allotment .page-hero::before { background-image: url('/assets/img/city/capitol.webp'); background-position: center 30%; }
.vp-insights-secured-vestibule-design .page-hero::before { background-image: url('/assets/img/city/intercom.webp'); background-position: center 45%; }
.vp-insights-healthcare-workplace-violence-plans .page-hero::before { background-image: url('/assets/img/city/hospital.webp'); background-position: center 40%; }
.vp-insights-lost-master-key .page-hero::before { background-image: url('/assets/img/city/keys.webp'); }


/* ============================================================
   Theme 09 — "EMBER"
   Photography at +40% vibrance over v6, on a deep maroon-charcoal
   ground with a Texas-sunset ember accent. Type stays the base pairing.
   ============================================================ */
:root {
  /* photo grade: v6 × 1.4 */
  --p-sat-hero: 1.0;
  --p-bright-hero: 0.84;
  --p-sat: 0.98;
  --p-bright: 0.73;
  --scrim: 21, 15, 14;

  /* palette */
  --bg: #150f0e;
  --bg-raised: #191211;
  --surface: #1f1614;
  --ink: #f2e9e2;
  --ink-dim: #bda99e;
  --ink-faint: #8b7a71;
  --copper: #e8622d;
  --copper-bright: #f47f4a;
  --copper-pale: #ffcfb4;
  --copper-deep: #a53e15;
  --on-copper: #1a0d06;
  --hairline: rgba(242, 233, 226, 0.14);
  --hairline-soft: rgba(242, 233, 226, 0.07);
  --metal: linear-gradient(103deg, #a53e15 0%, #f5915c 34%, #ffd9bd 50%, #e8622d 68%, #7c2e0d 100%);
}

.site-header.is-scrolled {
  background: rgba(21, 15, 14, 0.88);
}
.process-num { -webkit-text-stroke-color: rgba(242, 233, 226, 0.16); }
.chapter-num { -webkit-text-stroke-color: rgba(232, 98, 45, 0.4); }