/* Destination : assets/css/service-detail.css */

.nh-breadcrumb { font-size: 0.82rem; color: var(--nh-grey-600); margin-bottom: 1.75rem; }
.nh-breadcrumb a { color: var(--nh-grey-600); font-weight: 600; }
.nh-breadcrumb a:hover { color: var(--nh-rose); }
.nh-breadcrumb i { font-size: 0.65rem; margin: 0 0.4rem; }
.nh-breadcrumb span { color: var(--nh-rose-dark); font-weight: 700; }

.nh-sd-hero { background: linear-gradient(180deg, var(--nh-rose-light) 0%, var(--nh-cream) 100%); padding: 3rem 0 4rem; }
.nh-sd-icon {
  width: 64px; height: 64px; border-radius: 18px;
  background: var(--nh-gradient-primary); color: var(--nh-white);
  display: flex; align-items: center; justify-content: center; font-size: 1.6rem;
  margin-bottom: 1.2rem; box-shadow: var(--nh-shadow-glow);
}
.nh-sd-hero h1 { font-size: clamp(1.9rem, 3.4vw, 2.6rem); font-weight: 900; margin-bottom: 0.9rem; }
.nh-sd-lead { font-size: 1.02rem; color: var(--nh-grey-600); max-width: 560px; }
.nh-sd-audience { font-size: 0.9rem; font-weight: 600; color: var(--nh-rose-dark); margin-top: 0.6rem; }
.nh-sd-audience i { margin-right: 0.4rem; }
.nh-sd-actions { display: flex; gap: 0.8rem; flex-wrap: wrap; margin-top: 1.6rem; }
.nh-sd-img { aspect-ratio: 4 / 3.4; border-radius: var(--nh-radius-lg); }
img.nh-sd-img { width: 100%; object-fit: cover; }

.nh-sd-body { color: var(--nh-grey-600); font-size: 0.97rem; }
.nh-sd-body h4 { color: var(--nh-dark); margin-top: 1.4rem; }
.nh-sd-body ul { padding-left: 1.2rem; }
.nh-sd-body li::marker { color: var(--nh-rose); }

.nh-sd-sidebar-card {
  background: var(--nh-white);
  border-radius: var(--nh-radius-md);
  padding: 1.75rem;
  box-shadow: var(--nh-shadow-sm);
  margin-bottom: 1.5rem;
}
.nh-sd-sidebar-card h3 { font-size: 1.02rem; margin-bottom: 1.1rem; }
.nh-sd-sidebar-card h3 i { color: var(--nh-rose); margin-right: 0.5rem; }

.nh-sd-steps { list-style: none; counter-reset: nh-step; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 1rem; }
.nh-sd-steps li {
  counter-increment: nh-step;
  position: relative;
  padding-left: 2.4rem;
  font-size: 0.9rem;
  color: var(--nh-dark);
}
.nh-sd-steps li::before {
  content: counter(nh-step);
  position: absolute; left: 0; top: -2px;
  width: 26px; height: 26px; border-radius: 50%;
  background: var(--nh-rose-light); color: var(--nh-rose-dark);
  font-weight: 800; font-size: 0.78rem;
  display: flex; align-items: center; justify-content: center;
}

.nh-sd-cta-card { background: var(--nh-dark); color: var(--nh-grey-300); text-align: center; }
.nh-sd-cta-card h3 { color: var(--nh-white); }
.nh-sd-cta-card p { font-size: 0.88rem; margin-bottom: 1.2rem; }

.nh-sd-property-card { display: block; background: var(--nh-white); border-radius: var(--nh-radius-md); overflow: hidden; box-shadow: var(--nh-shadow-sm); transition: var(--nh-transition); color: var(--nh-dark); }
.nh-sd-property-card:hover { transform: translateY(-6px); box-shadow: var(--nh-shadow-md); color: var(--nh-dark); }
.nh-sd-property-img { aspect-ratio: 4 / 3; }
img.nh-sd-property-img { width: 100%; object-fit: cover; }
.nh-sd-property-body { padding: 1.2rem 1.4rem; }
.nh-sd-property-city { font-size: 0.78rem; color: var(--nh-grey-600); margin-bottom: 0.3rem; }
.nh-sd-property-city i { color: var(--nh-rose); }
.nh-sd-property-body h3 { font-size: 1rem; margin-bottom: 0.5rem; }
.nh-sd-property-price { font-weight: 800; color: var(--nh-rose-dark); margin: 0; }

@media (max-width: 991.98px) {
  .nh-sd-hero { padding: 2rem 0 2.5rem; }
}