/* Data Security & DLP — Saral Cyber Team (page-specific overrides) */

body.cy-dlp .ms-hero {
    background: linear-gradient(135deg, rgba(8,51,68,0.78) 0%, rgba(22,78,99,0.65) 50%, rgba(14,116,144,0.58) 100%), url('/static/assets/cyber/data-security-dlp-hero.jpg') center/cover no-repeat;
    padding-top: var(--space-5);
}
body.cy-dlp .ms-cta {
    background: linear-gradient(135deg, #083344 0%, #0e7490 100%);
}
body.cy-dlp .ms-hero-badge {
    background: rgba(255, 255, 255, 0.12);
    color: #22d3ee;
}
body.cy-dlp .ms-hero h1 span {
    color: #22d3ee;
}
body.cy-dlp .ms-card {
    --card-accent: linear-gradient(135deg, #164e63, #0e7490, #083344);
}
body.cy-dlp .ms-card-icon,
body.cy-dlp .ms-why-icon,
body.cy-dlp .ms-process-num,
body.cy-dlp .ms-case-visual-icon {
    background: linear-gradient(135deg, #164e63, #0e7490, #083344);
}
body.cy-dlp .ms-insight-tag,
body.cy-dlp .ms-case-tag {
    background: #cffafe;
    color: #0e7490;
}
body.cy-dlp .ms-btn-primary {
    background: #0891b2;
}
body.cy-dlp .ms-btn-primary:hover {
    background: #22d3ee;
    color: #0f172a;
}
body.cy-dlp .ms-faq h2 {
    color: #0f172a;
}


body.cy-dlp .cy-section-divider {
    position: relative;
    height: 48px;
    overflow: hidden;
    background:
        radial-gradient(circle, rgba(34,211,238,0.22) 0 1.25px, transparent 1.6px) 0 0 / 22px 22px,
        radial-gradient(circle, rgba(34,211,238,0.10) 0 1px, transparent 1.4px) 11px 11px / 22px 22px,
        linear-gradient(90deg, transparent 8%, rgba(34,211,238,0.55) 50%, transparent 92%);
    background-repeat: repeat, repeat, no-repeat;
    background-size: 22px 22px, 22px 22px, 100% 1px;
    background-position: 0 0, 11px 11px, center;
}
body.cy-dlp .cy-section-divider::before,
body.cy-dlp .cy-section-divider::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 8px;
    height: 8px;
    transform: translateY(-50%) rotate(45deg);
    border: 1px solid rgba(34,211,238,0.55);
    background: rgba(34,211,238,0.12);
}
body.cy-dlp .cy-section-divider::before { left: 18%; }
body.cy-dlp .cy-section-divider::after { right: 18%; }

@media (max-width: 768px) {
    body.cy-dlp .ms-hero {
        min-height: auto;
        padding: var(--space-4) 1.25rem var(--space-5);
    }
    body.cy-dlp .ms-hero h1 {
        font-size: 1.8rem;
    }
}