/* NoVA Contractor Hub — site.css
   Custom styles layered on top of Tailwind CDN */

/* ── Score badge ── */
.score-badge {
  width: 64px;
  height: 64px;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.score-badge .score-num  { font-size: 1.5rem; font-weight: 900; color: #fff; line-height: 1; }
.score-badge .score-tier { font-size: 0.5rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; color: rgba(255,255,255,0.85); }

/* Larger badge for profile pages */
.score-badge-lg {
  width: 96px;
  height: 96px;
  border-radius: 20px;
}
.score-badge-lg .score-num  { font-size: 2.2rem; }
.score-badge-lg .score-tier { font-size: 0.65rem; }

/* ── SVG keyword underline ── */
.underline-wrap { position: relative; display: inline-block; }
.underline-wrap svg {
  position: absolute;
  width: 108%;
  left: -4%;
  bottom: -8px;
  height: 12px;
}

/* ── Hero underline draw animation ── */
@keyframes draw-line {
  0%   { stroke-dashoffset: 120; opacity: 0; }
  10%  { opacity: 1; }
  60%  { stroke-dashoffset: 0; opacity: 1; }
  85%  { stroke-dashoffset: 0; opacity: 1; }
  100% { stroke-dashoffset: 0; opacity: 0; }
}
.hero-underline-path {
  stroke-dasharray: 120;
  stroke-dashoffset: 120;
  animation: draw-line 2.5s cubic-bezier(0.4, 0, 0.2, 1) 0.4s infinite;
}

/* ── Score progress bars ── */
.score-bar-track {
  height: 8px;
  background: #f1f5f9;
  border-radius: 99px;
  overflow: hidden;
}
.score-bar-fill {
  height: 100%;
  border-radius: 99px;
  background: #F15A3B;
  transition: width 0.4s ease;
}

/* ── Star colors ── */
.stars { color: #f59e0b; }

/* ── Contractor card hover ── */
.contractor-card { transition: transform 0.15s ease, box-shadow 0.15s ease; }
.contractor-card:hover { transform: translateY(-2px); box-shadow: 0 8px 30px rgba(0,0,0,0.08); }

/* ── Trade card image zoom ── */
.trade-img { transition: transform 0.6s ease; }
.trade-card:hover .trade-img { transform: scale(1.05); }

/* ── Filter button active state ── */
.filter-btn.active {
  background: #F15A3B;
  color: #fff;
  border-color: #F15A3B;
}
.tier-pill.active {
  background: #1A1A1A;
  color: #fff;
  border-color: #1A1A1A;
}

/* ── Signals checklist ── */
.signal-yes { color: #15803d; }
.signal-no  { color: #dc2626; }

/* ── Breadcrumbs ── */
.breadcrumbs a { color: #6b7280; }
.breadcrumbs a:hover { color: #F15A3B; }
.breadcrumbs span { color: #1A1A1A; font-weight: 600; }

/* ── FAQ details/summary ── */
details summary { cursor: pointer; list-style: none; }
details summary::-webkit-details-marker { display: none; }
details[open] summary .faq-icon { transform: rotate(45deg); }
.faq-icon { transition: transform 0.2s ease; }

/* ── Responsive image strip ── */
.hero-strip { scrollbar-width: none; }
.hero-strip::-webkit-scrollbar { display: none; }

/* ── Featured badge ── */
.featured-badge {
  background: linear-gradient(135deg, #F15A3B, #f59e0b);
  color: white;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 0.2rem 0.5rem;
  border-radius: 4px;
}