/* =========================================================
KIBERBIZTONSÁG
========================================================= */

.cyber-hero{

    padding:190px 0 120px;

    background:
        linear-gradient(
            rgba(8,17,31,.62),
            rgba(8,17,31,.62)
        ),
        url("../assets/cyber-hero.webp");

    background-size:cover;
    background-position:center;

    text-align:center;

    color:#fff;

}

.cyber-hero h1{

    color:#fff;

    font-size:68px;

    line-height:1.05;

    margin:25px 0;

}

.cyber-hero h1 span{

    color:var(--primary);

}

.cyber-hero p{

    max-width:800px;

    margin:auto;

    font-size:22px;

    opacity:.9;

}

.cyber-hero .hero-buttons{

    display:flex;

    justify-content:center;

    gap:20px;

    margin-top:40px;

}

/* =========================================================
INTRO
========================================================= */

.cyber-intro{

    padding:110px 0;

    background:#fff;

}

.cyber-intro-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:80px;

    align-items:center;

}

/* =========================================================
TÉVHITEK
========================================================= */

.cyber-myths{

    padding:110px 0;

    background:#f8fafc;

}

.myth-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:25px;

}

.myth-card{

    background:#fff;

    padding:35px;

    border-radius:24px;

    box-shadow:
        0 15px 40px rgba(15,23,42,.05);

}

.myth-card h3{

    margin-bottom:15px;

}

/* =========================================================
TÁMADÁSOK
========================================================= */

.cyber-threats{

    padding:110px 0;

    background:#fff;

}

.threat-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

}

.threat-card{

    position:relative;

    overflow:hidden;

    background:#fff;

    border-radius:28px;

    padding:40px;

    min-height:320px;

    box-shadow:
        0 15px 40px rgba(15,23,42,.05);

}

.threat-card::before{

    content:'';

    position:absolute;

    inset:0;

    opacity:.08;

    background-size:cover;

    background-position:center;

}

.threat-card>*{

    position:relative;

    z-index:2;

}

.threat-card::before{
    opacity:.40;
}

.threat-card.ransomware::before{
    background-image:url('../assets/ransomware.webp');
}

.threat-card.phishing::before{
    background-image:url('../assets/phishing.webp');
}

.threat-card.email::before{
    background-image:url('../assets/email-compromise.webp');
}

.threat-card.ceo::before{
    background-image:url('../assets/ceo-fraud.webp');
}

.threat-card.vpn::before{
    background-image:url('../assets/vpn-security.webp');
}

.threat-card.web::before{
    background-image:url('../assets/web-security.webp');
}

/* =========================================================
MIT VÉDÜNK
========================================================= */

.cyber-protect{

    padding:110px 0;

    background:#f8fafc;

}

.protect-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

}

.protect-card{

    background:#fff;

    border-radius:28px;

    padding:40px;

    box-shadow:
        0 15px 40px rgba(15,23,42,.05);

}

.protect-card h3{

    margin-bottom:15px;

}

/* =========================================================
TÖBBRÉTEGŰ VÉDELEM
========================================================= */

.cyber-layers{

    padding:120px 0;

    background:#fff;

}

.layer-wrapper{

    display:flex;

    flex-wrap:wrap;

    justify-content:center;

    gap:20px;

}

.layer-item{

    padding:18px 28px;

    border-radius:999px;

    background:#f8fafc;

    border:1px solid rgba(0,0,0,.06);

    font-weight:600;

}

/* =========================================================
SZOLGÁLTATÁSOK
========================================================= */

.cyber-services{

    padding:110px 0;

    background:
        linear-gradient(
            180deg,
            #ffffff,
            #f5faf0
        );

}

.cyber-services-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:25px;

}

.cyber-service-card{

    background:#fff;

    padding:35px;

    border-radius:24px;

    text-align:center;

    box-shadow:
        0 15px 40px rgba(15,23,42,.05);

}

/* =========================================================
MONITORING
========================================================= */

.cyber-monitoring{

    padding:120px 0;

    background:#08111f;

    color:#fff;

}

.cyber-stats{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:25px;

    margin-top:50px;

}

.cyber-stat{

    text-align:center;

}

.cyber-stat-number{

    font-size:52px;

    font-weight:800;

    color:var(--primary);

}

/* =========================================================
VALÓS PROBLÉMÁK
========================================================= */

.cyber-reality{

    padding:110px 0;

    background:#fff;

}

.reality-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:25px;

}

.reality-item{

    background:#f8fafc;

    border-left:5px solid var(--primary);

    padding:25px;

    border-radius:16px;

}

/* =========================================================
TECHNOLÓGIÁK
========================================================= */

.cyber-tech{

    padding:110px 0;

    background:#f8fafc;

}

.tech-badges{

    display:flex;

    flex-wrap:wrap;

    gap:15px;

    justify-content:center;

}

.tech-badges span{

    padding:14px 22px;

    border-radius:999px;

    background:#fff;

    box-shadow:
        0 5px 15px rgba(15,23,42,.05);

}

/* =========================================================
JÖVŐBIZTOS
========================================================= */

.cyber-future{

    padding:120px 0;

    background:
        linear-gradient(
            rgba(255,255,255,.90),
            rgba(255,255,255,.90)
        ),
        url("../assets/cyber-future.webp");

    background-size:cover;

    background-position:center;

}

.cyber-future-content{

    max-width:900px;

    margin:auto;

    text-align:center;

    padding:60px;

    border-radius:32px;

    background:rgba(255,255,255,.70);

    backdrop-filter:blur(12px);

}

/* =========================================================
RESPONSIVE
========================================================= */

@media(max-width:992px){

    .cyber-intro-grid,
    .myth-grid,
    .threat-grid,
    .protect-grid,
    .cyber-services-grid,
    .cyber-stats{

        grid-template-columns:1fr 1fr;

    }

}

@media(max-width:768px){

    .cyber-hero{

        padding:150px 0 80px;

    }

    .cyber-hero h1{

        font-size:40px;

    }

    .cyber-hero .hero-buttons{

        flex-direction:column;

        align-items:center;

    }

    .cyber-intro-grid,
    .myth-grid,
    .threat-grid,
    .protect-grid,
    .cyber-services-grid,
    .cyber-stats,
    .reality-grid{

        grid-template-columns:1fr;

    }

    .cyber-future-content{

        padding:35px 25px;

    }

}