 /*
Wireless CCTV Camera Installation Page
Purpose: Page-only refinements for the wireless CCTV installation page live
here instead of the global custom.css file. Shared CCTV layout classes
remain available from custom.css, while new page-specific changes should be
kept here.
*/

/* Hero image: Wireless CCTV page uses the shared services hero background. */
.service-hero {
    background: #ffffff url("../images/services/camera-installation.jpg") center center/cover no-repeat;
}

/* Service list cards: standard orange hover for consistency across pages. */
.service-list-link:hover i {
    background: #fff3e8;
    color: #ff6b00;
}

/* Reusable section headings: replaces repeated inline heading and intro styles. */
.cctv-section-title {
    color: #1a1a3e;
    font-size: clamp(30px, 3vw, 40px);
    line-height: 1.16;
    font-weight: 900;
    letter-spacing: 0;
}

.cctv-section-intro {
    color: #666;
    font-size: 16px;
    line-height: 1.75;
    margin: 10px auto 0;
}

.cctv-section-intro--narrow {
    max-width: 620px;
}

.cctv-section-intro--wide {
    max-width: 760px;
    margin-bottom: 28px;
}

/* Installation type and FAQ sections: shared white section spacing. */
.cctv-install-types-section,
.cctv-faq-section {
    padding: 100px 0;
    background: #fff;
}

/* Camera solutions strip: local typography inside the feature panel. */
.cctv-solution-title,
.cctv-best-for-title {
    color: #11133a;
    font-weight: 900;
}

.cctv-solution-title {
    margin-bottom: 10px;
}

.cctv-solution-text {
    color: #667085;
    line-height: 1.7;
    margin: 0;
}

.cctv-best-for-title {
    margin-bottom: 16px;
}

/* CTA bands: keeps white text consistent across call-to-action blocks. */
.cctv-cta-title {
    color: #fff;
    font-size: 32px;
    font-weight: 900;
    margin-bottom: 10px;
}

.cctv-cta-title--compact {
    font-size: 30px;
}

.cctv-cta-text {
    color: rgba(255,255,255,0.78);
    margin: 0;
}

/* Areas served section: light background distinct from the white content blocks. */
.cctv-areas-section {
    padding: 90px 0;
    background: #f8faff;
}

/* Stat boxes: keep uniform box height so longer values don't overflow. */
.stat-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 110px;
}

.stat-box .stat-num {
    font-size: clamp(20px, 2.4vw, 32px);
    line-height: 1.15;
    word-break: keep-all;
}