/* Cash For Cars Phoenix wordmark: sun badge + full business name. */
.cf-mark { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; white-space: nowrap; }
.cf-mark:hover, .cf-mark:focus { text-decoration: none; }
.cf-mark__sun {
  flex: none; width: 34px; height: 34px; border-radius: 50%;
  background: radial-gradient(circle at 50% 50%, #f4cf4d 55%, transparent 57%),
    repeating-conic-gradient(#f4cf4d 0 12deg, transparent 12deg 30deg);
}
.cf-mark__name { font: 600 21px/1 'Barlow', 'Helvetica Neue', Arial, sans-serif; letter-spacing: .02em; color: #fff; text-shadow: 0 1px 0 rgba(0, 0, 0, .12); }
.cf-mark__name strong { font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: #222b45; }

/* On the site's white header bar. */
.cf-mark--light .cf-mark__name { color: #222b45; text-shadow: none; }
.cf-mark--light .cf-mark__name strong { color: #00807b; }
.cf-mark--light .cf-mark__sun {
  background: radial-gradient(circle at 50% 50%, #f4cf4d 55%, transparent 57%),
    repeating-conic-gradient(#f4b400 0 12deg, transparent 12deg 30deg);
}
.navbar-brand.cf-mark, .navbar > .container .navbar-brand.cf-mark { height: auto; padding: 0; margin: 20px 0 0 5px; gap: 9px; }
.navbar-brand.cf-mark .cf-mark__sun { width: 40px; height: 40px; }
/* Stacked in the site header (like the original logo): small "CASH FOR CARS" over a large "PHOENIX". */
@media (min-width: 768px) {
  .navbar-brand.cf-mark .cf-mark__name { display: flex; flex-direction: column; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; line-height: 1.05; }
  .navbar-brand.cf-mark .cf-mark__name strong { font-size: 29px; letter-spacing: .03em; line-height: 1; }
}
@media (max-width: 991px) {
  .navbar-brand.cf-mark, .navbar > .container .navbar-brand.cf-mark { margin: 14px 0 0 5px; }
}
@media (max-width: 767px) {
  .navbar-brand.cf-mark, .navbar > .container .navbar-brand.cf-mark { display: inline-flex; margin: 10px 0 0 15px; gap: 8px; }
  .navbar-brand.cf-mark .cf-mark__sun { width: 30px; height: 30px; }
  .navbar-brand.cf-mark .cf-mark__name { font-size: 18px; }
  .cf-mark__name { font-size: 18px; }
}
@media (max-width: 359px) {
  .navbar-brand.cf-mark .cf-mark__name { font-size: 16px; }
}