@import url('/quotefleet-color-system.css');

/* Phase BQ: WeFixTrades-style skin for secondary public pages. */
.qf-public-wft {
  --accent: #6E8BFF; /* on-dark TEXT/link accent (accentOnDark); was cobalt #0D3CFC → failed WCAG (~2.5:1) on dark. Solid cobalt button fills below stay hardcoded. */
  --accent-ink: #ffffff;
  --accent-soft: rgba(13,60,252,.14);
  --qf-wft-bg: #181D1F;
  --qf-wft-panel: #22282A;
  --qf-wft-panel-2: #22282A;
  --qf-wft-line: rgba(255,255,255,.12);
  --qf-wft-line-strong: rgba(255,255,255,.22);
  --qf-wft-text: #FFFFFF;
  --qf-wft-muted: #B1C5CE;
  --qf-wft-faint: rgba(177,197,206,.74);
  --qf-wft-blue: #0D3CFC;
  --qf-wft-cream: #E4EDF1;
  --qf-wft-radius: 8px;
  background: #181D1F;
  color: var(--qf-wft-muted);
}
.qf-public-wft .topnav {
  background: #22282A;
  border-bottom: 1px solid var(--qf-wft-line-strong);
  backdrop-filter: blur(14px);
}
.qf-public-wft .topnav-inner {
  min-height: 42px;
  padding-block: var(--space-1);
}
.qf-public-wft .brand-mark {
  font-weight: 900;
  letter-spacing: -0.035em;
}
/* Unified minimal rising-rate-line mark (matches landing header/footer).
 * Render the inline SVG bare; drop the old "QF + check" monogram badge. */
.qf-public-wft .brand-mark .logo {
  position: relative;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
}
.qf-public-wft .brand-mark .logo svg { display: block; width: 26px; height: 26px; }
.qf-public-wft .brand-mark .logo::before,
.qf-public-wft .brand-mark .logo::after {
  content: none;
  display: none;
}
.qf-public-wft .nav-link,
.qf-public-wft .signin {
  font-family: var(--font-mono);
  font-size: 11px !important;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.qf-public-wft .btn-primary {
  background: #0D3CFC;
  color: #FFFFFF;
  border-color: #0D3CFC;
  box-shadow: none;
  border-radius: 4px;
}
.qf-public-wft .btn-primary:hover { border-color: #FFFFFF; }
.qf-public-wft .btn-primary .arr { color: #FFFFFF; }
.qf-public-wft .btn-secondary {
  background: #FFFFFF;
  border-color: #FFFFFF;
  color: #0D3CFC;
  border-radius: 4px;
}
.qf-public-wft .btn-secondary:hover { border-color: #0D3CFC; }
.qf-public-wft .hero {
  padding-top: var(--space-7-5);
  padding-bottom: var(--space-4);
}
.qf-public-wft .hero::before {
  background: radial-gradient(ellipse 50% 34% at 50% 12%, rgba(13,60,252,.16), transparent 68%);
}
.qf-public-wft .hero h1,
.qf-public-wft .support-shell h1,
.qf-public-wft .sec-shell h1 {
  color: var(--qf-wft-text);
  font-weight: 900;
  letter-spacing: -.055em;
}
.qf-public-wft .container,
.qf-public-wft .support-shell,
.qf-public-wft .sec-shell {
  position: relative;
  z-index: 1;
}
.qf-public-wft .pricing,
.qf-public-wft .support-grid,
.qf-public-wft .sec-shell .card-row {
  gap: var(--space-1);
}
.qf-public-wft .price-card,
.qf-public-wft .support-card,
.qf-public-wft .support-note,
.qf-public-wft .support-table,
.qf-public-wft .sec-shell .ct-card,
.qf-public-wft .sec-shell .footer-note,
.qf-public-wft main.container > div[style*="text-align: center"] {
  background: #22282A !important;
  border: 1px solid var(--qf-wft-line) !important;
  border-radius: var(--qf-wft-radius) !important;
  box-shadow: 0 28px 70px -55px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.04) !important;
}
.qf-public-wft .price-card.featured {
  border-color: rgba(13,60,252,.58) !important;
  box-shadow: 0 0 0 1px rgba(13,60,252,.18), 0 28px 70px -55px rgba(0,0,0,.85) !important;
}
.qf-public-wft .price-card h3,
.qf-public-wft .support-card h3,
.qf-public-wft .support-shell h2,
.qf-public-wft .sec-shell h2,
.qf-public-wft .sec-shell .lead-line,
.qf-public-wft .sec-shell .ct-card h4,
.qf-public-wft main.container h3 {
  color: var(--qf-wft-text) !important;
}
.qf-public-wft .price,
.qf-public-wft .support-card a,
.qf-public-wft .sec-shell a {
  color: var(--qf-wft-text) !important;
}
.qf-public-wft .price .per,
.qf-public-wft .muted,
.qf-public-wft .support-shell p,
.qf-public-wft .support-shell li,
.qf-public-wft .support-card p,
.qf-public-wft .support-table td,
.qf-public-wft .support-table th,
.qf-public-wft .sec-shell p,
.qf-public-wft .sec-shell li,
.qf-public-wft .sec-shell .ct-card p,
.qf-public-wft .sec-shell h3,
.qf-public-wft .sec-shell .footer-note {
  color: var(--qf-wft-muted) !important;
}
.qf-public-wft .support-pill,
.qf-public-wft .sec-shell .pill,
.qf-public-wft .tag {
  color: #FFFFFF !important;
  background: rgba(13,60,252,.16) !important;
  border: 1px solid rgba(13,60,252,.42) !important;
}
.qf-public-wft .support-table th,
.qf-public-wft .support-table td {
  border-color: var(--qf-wft-line) !important;
}
.qf-public-wft .support-table th {
  background: rgba(255,255,255,.04) !important;
}
.qf-public-wft .site-footer {
  background: #22282A;
  border-top: 1px solid var(--qf-wft-line);
  color: #B1C5CE;
}
.qf-public-wft .site-footer a {
  color: #FFFFFF;
}
.qf-public-wft .site-footer a:hover {
  color: #FFFFFF;
}
@media (max-width: 760px) {
  .qf-public-wft .hero h1,
  .qf-public-wft .support-shell h1,
  .qf-public-wft .sec-shell h1 { font-size: 38px !important; }
  .qf-public-wft .support-shell,
  .qf-public-wft .sec-shell { padding-inline: var(--space-2); }
}