/* FAQ Accordion Component */
.faq-accordion-container {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.faq-accordion-item {
  border-bottom: 1px solid var(--hsc-border);
}
.faq-accordion-btn {
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  padding: 1.5rem 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  gap: 1rem;
}
.faq-accordion-title {
  font-family: var(--fh);
  font-size: 1rem;
  font-weight: 700;
  color: var(--hsc-dark);
  line-height: 1.4;
}
.faq-accordion-icon-wrap {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--hsc-blue-lt);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease;
  color: var(--hsc-blue);
  font-size: 1.25rem;
  line-height: 1;
}
.faq-accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease, padding-bottom 0.3s ease;
}
.faq-accordion-text {
  font-size: 0.97rem;
  color: var(--hsc-text);
  line-height: 1.8;
  margin: 0;
  padding-bottom: 0;
}
/* Shared Cards CSS */
.concern-card {
  background: var(--hsc-white);
  border-radius: 16px;
  padding: 1.75rem 2rem;
  height: 100%;
  box-shadow: 0 2px 12px rgba(0,0,0,0.05);
  border: 1px solid var(--hsc-border);
}
.concern-icon-wrap {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--hsc-blue-lt);
  display: flex;
  align-items: center;
  justify-content: center;
}
.concern-icon-wrap i { color: var(--hsc-blue); font-size: 1.1rem; }
.concern-title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--hsc-dark);
  margin-bottom: 0.5rem;
}
.concern-desc {
  font-size: 0.93rem;
  color: var(--hsc-text);
  margin: 0;
  line-height: 1.7;
}

.why-us-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
}
.why-us-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  padding: 1.5rem;
}
.why-us-icon-wrap {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: rgba(0, 87, 184, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
}
.why-us-icon-wrap i { color: var(--hsc-accent); font-size: 1.1rem; }
.why-us-card-title {
  font-family: var(--fh);
  font-size: clamp(1.35rem, 2vw, 1.65rem);
  font-weight: 800;
  color: var(--hsc-white);
  letter-spacing: -0.5px;
  margin-bottom: 0.5rem;
}
.why-us-card-desc {
  font-size: 0.88rem;
  color: rgba(255,255,255,0.7);
  margin: 0;
  line-height: 1.65;
}

@media (max-width: 991px) {
  .why-us-grid {
    grid-template-columns: 1fr;
  }
}

/* =====================================================
   Home Security Hero Component
   ===================================================== */
@keyframes heroOrb1{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(40px,-30px) scale(1.15);}}
@keyframes heroOrb2{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(-30px,40px) scale(1.1);}}
@keyframes heroOrb3{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(20px,25px) scale(1.08);}}
@keyframes statsPulse{0%,100%{box-shadow:0 0 0 0 rgba(21,87,192,.35);}70%{box-shadow:0 0 0 12px rgba(21,87,192,0);}}
@keyframes badgeFadeUp{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}
.hs-hero-orb{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;}
.hero-stats-float{position:absolute;right:5%;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:12px;z-index:5;}
.hero-stat-card{background:rgba(255,255,255,.08);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:14px 20px;min-width:160px;animation:badgeFadeUp .6s ease both;}
.hero-stat-card:nth-child(2){animation-delay:.15s;}.hero-stat-card:nth-child(3){animation-delay:.3s;}
.hero-stat-num{font-family:var(--fh);font-size:1.6rem;font-weight:900;color:var(--hsc-white);line-height:1;}
.hero-stat-lbl{font-size:.72rem;color:rgba(255,255,255,.5);font-weight:600;margin-top:2px;text-transform:uppercase;letter-spacing:.5px;}
@media(max-width:991px){.hero-stats-float{display:none;}}
/* CTA Footer Component */
.cta-footer-section {
  background: var(--hsc-navy);
  position: relative;
  overflow: hidden;
}
.cta-footer-bg {
  position: absolute;
  inset: 0;
  opacity: .15;
  background-image: radial-gradient(circle at 50% -10%, var(--hsc-accent) 0, transparent 55%);
}
.cta-footer-container {
  position: relative;
  z-index: 2;
}
.cta-footer-header {
  font-size: clamp(2rem, 3.5vw, 2.8rem);
  font-weight: 900;
  letter-spacing: -1.5px;
}
.cta-footer-desc {
  color: rgba(255,255,255,0.65);
  font-size: 1.05rem;
  line-height: 1.75;
  margin: 0 auto 2.5rem;
  max-width: 720px;
}
.cta-footer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin-bottom: 1.25rem;
}
.cta-footer-btn {
  font-size: 1.05rem;
  font-weight: 700;
}
.cta-footer-btn-primary {
  box-shadow: 0 8px 30px rgba(0,87,184,0.4);
}
.cta-footer-hours {
  color: rgba(255,255,255,0.4);
  font-size: 0.82rem;
}
/* Shared UI Utility Classes */
.ui-section-slate {
  padding: 7rem 0;
  background: var(--hsc-light);
  border-top: 1px solid var(--hsc-border);
}
.ui-section-white {
  padding: 7rem 0;
  background: var(--hsc-white);
  border-top: 1px solid var(--hsc-border);
}
.ui-section-dark {
  padding: 7rem 0;
  background: var(--hsc-dark);
  position: relative;
  overflow: hidden;
}

.ui-badge-blue {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--hsc-blue);
  margin-bottom: 0.75rem;
}
.ui-badge-sky {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--hsc-accent);
  margin-bottom: 0.85rem;
}

.ui-header-dark {
  font-family: var(--fh);
  font-size: clamp(2rem, 3.5vw, 2.8rem);
  font-weight: 900;
  color: var(--hsc-dark);
  line-height: 1.1;
  letter-spacing: -1.5px;
  margin-bottom: 1rem;
}
.ui-header-light {
  font-family: var(--fh);
  font-size: clamp(2rem, 3.5vw, 2.8rem);
  font-weight: 900;
  color: var(--hsc-white);
  line-height: 1.1;
  letter-spacing: -1.5px;
  margin-bottom: 1.25rem;
}
.ui-desc-light {
  color: rgba(255,255,255,0.7);
  font-size: 1rem;
  line-height: 1.8;
  margin-bottom: 2rem;
}
.ui-desc-dark {
  color: var(--hsc-text);
  font-size: 1rem;
  line-height: 1.75;
}
