/* Fenestration Services brand logo — 2026-08-22 V3
   Transparent maple-leaf/house emblem only. The existing brand text remains intact. */

/* Navbar: use the existing dedicated brand__mark slot before the text brand. */
app-landing-navbar .brand__mark {
  display: block !important;
  width: 67px !important;
  height: 67px !important;
  flex: 0 0 67px !important;
  border-radius: 0 !important;
  background-color: #b59060 !important;
  background-image: none !important;
  -webkit-mask: url('/assets/landing-page/fenestration-logo-transparent.png?v=20260822-gold1') center / contain no-repeat !important;
  mask: url('/assets/landing-page/fenestration-logo-transparent.png?v=20260822-gold1') center / contain no-repeat !important;
}

/* Footer: add the emblem before the original text without replacing/removing any footer content. */
app-landing-footer .footer-brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  width: fit-content !important;
}

app-landing-footer .footer-brand::before {
  content: "";
  display: block;
  width: 74px;
  height: 74px;
  flex: 0 0 74px;
  background-color: #b59060;
  background-image: none;
  -webkit-mask: url('/assets/landing-page/fenestration-logo-transparent.png?v=20260822-gold1') center / contain no-repeat;
  mask: url('/assets/landing-page/fenestration-logo-transparent.png?v=20260822-gold1') center / contain no-repeat;
}

/* Keep Windows & Doors directly under Fenestration and exactly within Fenestration's column width. */
app-landing-footer .footer-brand .brand-text {
  display: grid !important;
  grid-template-columns: max-content max-content !important;
  grid-template-rows: auto auto !important;
  column-gap: .25em !important;
  align-items: start !important;
  font-size: 1.15rem !important;
  font-weight: 800 !important;
  letter-spacing: .2px !important;
  line-height: 1.05 !important;
  color: #fff !important;
}

app-landing-footer .footer-brand .brand-text::after {
  content: "W i n d o w s & D o o r s" !important;
  grid-column: 1 !important;
  grid-row: 2 !important;
  width: 100% !important;
  margin-top: 2px !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 11px !important;
  letter-spacing: 0 !important;
  word-spacing: -.5px !important;
  white-space: nowrap !important;
  text-align: justify !important;
  text-align-last: justify !important;
}

app-landing-footer .footer-brand .brand-text > strong {
  grid-column: 2 !important;
  grid-row: 1 !important;
  color: var(--link-hover) !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
}

@media (max-width: 767px) {
  app-landing-navbar .brand__mark {
    width: 60px !important;
    height: 60px !important;
    flex-basis: 60px !important;
  }

  app-landing-footer .footer-brand::before {
    width: 67px;
    height: 67px;
    flex-basis: 67px;
  }
}