:root{--navy:#061d2d;--navy2:#0a314d;--blue:#2d8cff;--ink:#0c1d2a;--muted:#607080;--light:#f4f7f9;--line:#dbe3e9}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Arial,sans-serif;color:var(--ink);background:#fff}a{color:inherit;text-decoration:none}.wrap{width:min(1180px,calc(100% - 40px));margin:auto}.site-header{position:sticky;top:0;z-index:20;background:rgba(6,29,45,.94);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.08)}.nav{height:78px;display:flex;align-items:center;justify-content:space-between}.brand{
    height:78px;
    display:flex;
    align-items:center;
    overflow:hidden;
}

.brand img{
    display:block;
    width:205px;
    height:150px;
    object-fit:contain;
    object-position:left center;
}.nav nav{display:flex;align-items:center;gap:28px;color:#fff;font-size:14px}.menu{display:none;background:none;border:0;color:#fff;font-size:26px}.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:8px;padding:14px 22px;background:var(--blue);color:#fff;font-weight:750;cursor:pointer;transition:.2s}.btn:hover{transform:translateY(-1px);filter:brightness(1.08)}.btn.small{padding:10px 16px}.btn.ghost{background:transparent;border:1px solid rgba(255,255,255,.35)}.hero{min-height:690px;background:radial-gradient(circle at 75% 40%,#123f5d 0,transparent 28%),linear-gradient(135deg,#041722,#08283b);color:#fff;display:flex;align-items:center;overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}.eyebrow{display:inline-block;font-size:12px;letter-spacing:.16em;font-weight:800;color:#5fa8ff;margin-bottom:18px}.hero h1{font-size:clamp(52px,7vw,86px);line-height:.95;letter-spacing:-.055em;margin:0 0 24px}.hero h1 span{color:#75b7ff}.hero p{max-width:650px;font-size:19px;line-height:1.7;color:#c7d6e1}.actions{display:flex;gap:12px;margin:34px 0}.trust{display:flex;flex-wrap:wrap;gap:10px}.trust a{
    display:inline-flex;
    align-items:center;
    border:1px solid rgba(255,255,255,.14);
    border-radius:999px;
    padding:8px 12px;
    color:#c9d7e1;
    font-size:12px;
    text-decoration:none;
    transition:.2s;
}

.trust a:hover{
    color:#fff;
    border-color:#2d8cff;
    background:rgba(45,140,255,.12);
    transform:translateY(-1px);
};color:#c9d7e1;font-size:12px}.shield-card{height:460px;border:1px solid rgba(255,255,255,.12);border-radius:28px;background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.02));position:relative;display:grid;place-items:center;box-shadow:0 30px 80px rgba(0,0,0,.25)}.orb{position:absolute;width:280px;height:280px;border-radius:50%;background:#1478cc;filter:blur(80px);opacity:.25}.shield{position:relative;text-align:center;font-size:90px;font-weight:900}.hero-brand{
    position:relative;
    z-index:2;
    width:100%;
    height:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:50px;
    text-align:center;
}

.hero-brand img{
    width:330px;
    max-width:90%;
    height:auto;
    display:block;
    filter:drop-shadow(0 12px 28px rgba(0,0,0,.35));
}

.hero-brand-line{
    width:70px;
    height:2px;
    margin:30px auto 20px;
    background:#2d8cff;
    border-radius:2px;
}

.hero-brand p{
    margin:0;
    color:#9fc7e6;
    font-size:12px;
    font-weight:750;
    letter-spacing:.22em;
    line-height:1.6;
}.section{padding:100px 0}.section h2{font-size:clamp(38px,5vw,58px);line-height:1.05;letter-spacing:-.04em;margin:0 0 20px}.lead{max-width:760px;color:var(--muted);font-size:18px;line-height:1.7}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:48px}.cards article{padding:30px;border:1px solid var(--line);border-radius:16px;background:#fff;min-height:245px}.cards b{color:var(--blue);font-size:12px}.cards h3{font-size:22px;margin:35px 0 12px}.cards p,.dark p,.support p{color:var(--muted);line-height:1.7}.dark{background:var(--navy);color:#fff}.dark p{color:#c2d0da}.split{display:grid;grid-template-columns:.9fr 1.1fr;gap:90px}.steps{margin-top:30px}.steps>div{display:flex;gap:18px;padding:18px 0;border-top:1px solid rgba(255,255,255,.12)}.steps b{color:#5fa8ff}.steps span{display:flex;flex-direction:column}.steps small{color:#9fb1bd;margin-top:5px}.support{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.support-list{display:grid;grid-template-columns:1fr 1fr;gap:12px}.support-list span{padding:20px;border-radius:12px;background:var(--light);font-weight:650}.contact{background:var(--light)}.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px}.contact-lines{display:flex;flex-direction:column;gap:10px;margin:30px 0;font-weight:650}.contact-lines a{color:var(--navy2)}.qr{width:130px;border-radius:10px}.form{background:#fff;border:1px solid var(--line);border-radius:18px;padding:32px;box-shadow:0 20px 60px rgba(6,29,45,.08)}.form h3{font-size:26px;margin:0 0 24px}.form label{display:block;font-weight:650;font-size:14px;margin:14px 0}.form input,.form select,.form textarea{display:block;width:100%;margin-top:7px;padding:13px 14px;border:1px solid #cbd7df;border-radius:8px;font:inherit;background:#fff}.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid rgba(45,140,255,.25);border-color:var(--blue)}.notice{font-size:12px;color:var(--muted);line-height:1.5}.hp{position:absolute!important;left:-9999px!important}.footer{display:grid;grid-template-columns:1.3fr .7fr 1fr;gap:50px;padding:50px 0}.footer img{width:210px}.footer>div{display:flex;flex-direction:column;gap:10px}.footer small{color:var(--muted);margin-top:10px}footer{background:#03141f;color:#d5e1e8}
@media(max-width:800px){.nav nav{display:none;position:absolute;left:0;right:0;top:78px;background:var(--navy);padding:22px;flex-direction:column;align-items:flex-start}.nav nav.open{display:flex}.menu{display:block}.hero{padding:80px 0}.hero-grid,.split,.support,.contact-grid{grid-template-columns:1fr}.shield-card{height:330px}.cards{grid-template-columns:1fr}.support-list{grid-template-columns:1fr}.section{padding:72px 0}.footer{grid-template-columns:1fr}.brand img{width:175px}}
.support-actions{
    display:flex;
    align-items:center;
    gap:12px;
    margin-top:25px;
    flex-wrap:wrap;
}

.support-actions .btn{
    min-width:190px;
}

.ticket-btn{
    background:var(--navy2);
    border:1px solid var(--navy2);
}

.ticket-btn:hover{
    background:var(--blue);
    border-color:var(--blue);
}

@media(max-width:600px){
    .support-actions{
        flex-direction:column;
        align-items:stretch;
    }

    .support-actions .btn{
        width:100%;
    }
}
.support-actions{
    display:flex;
    align-items:center;
    gap:12px;
    margin-top:25px;
    flex-wrap:wrap;
}

.support-actions .btn{
    min-width:190px;
}

.ticket-btn{
    background:var(--navy2);
}

.ticket-btn:hover{
    background:var(--blue);
}

@media(max-width:600px){
    .support-actions{
        flex-direction:column;
        align-items:stretch;
    }

    .support-actions .btn{
        width:100%;
    }
}
.ai-btn{
    background:#1367a8;
    border:1px solid #2d8cff;
}

.ai-btn:hover{
    background:#2d8cff;
}
/* =========================================
   LINKO AI SECURITY HOMEPAGE
   ========================================= */

.ai-home{
    position:relative;
    overflow:hidden;
    background:
        radial-gradient(
            circle at 80% 50%,
            rgba(45,140,255,.10),
            transparent 32%
        ),
        #f4f7f9;
}

.ai-home-grid{
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:70px;
    align-items:center;
}

.ai-home-content h2{
    max-width:620px;
}

.ai-home-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:30px;
}

.ai-outline{
    background:#fff;
    color:#061d2d;
    border:1px solid #cbd7df;
}

.ai-outline:hover{
    background:#061d2d;
    color:#fff;
}

.ai-home-note{
    max-width:620px;
    margin-top:22px;
    color:#607080;
    font-size:12px;
    line-height:1.6;
}


/* AI PANEL */

.ai-feature-panel{
    background:#061d2d;
    color:#fff;
    border-radius:22px;
    padding:30px;
    box-shadow:
        0 30px 80px rgba(6,29,45,.18);
}

.ai-feature-header{
    display:flex;
    align-items:center;
    gap:14px;
    padding-bottom:24px;
    border-bottom:
        1px solid rgba(255,255,255,.12);
}

.ai-feature-header div:last-child{
    display:flex;
    flex-direction:column;
}

.ai-feature-header strong{
    font-size:18px;
}

.ai-feature-header small{
    margin-top:4px;
    color:#9fb1bd;
}


/* BLUE STATUS DOT */

.ai-pulse{
    width:12px;
    height:12px;
    flex:0 0 12px;
    border-radius:50%;
    background:#2d8cff;
    box-shadow:
        0 0 0 7px rgba(45,140,255,.12);
}


/* FEATURE CARDS */

.ai-feature-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:22px;
}

.ai-feature-grid > div{
    min-height:150px;
    padding:20px;
    border-radius:12px;
    background:rgba(255,255,255,.055);
    border:
        1px solid rgba(255,255,255,.09);
    display:flex;
    flex-direction:column;
}

.ai-feature-grid span{
    color:#5fa8ff;
    font-size:11px;
    font-weight:800;
}

.ai-feature-grid strong{
    margin-top:18px;
    font-size:16px;
}

.ai-feature-grid small{
    margin-top:8px;
    color:#aebfca;
    line-height:1.5;
}


/* FAKE AI INPUT / LINK */

.ai-ask-box{
    margin-top:20px;
    min-height:58px;
    padding:0 18px;
    border-radius:10px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    background:#fff;
    color:#607080;
    transition:.2s;
}

.ai-ask-box strong{
    color:#2d8cff;
    white-space:nowrap;
}

.ai-ask-box:hover{
    transform:translateY(-1px);
    box-shadow:
        0 10px 30px rgba(0,0,0,.18);
}


/* MOBILE */

@media(max-width:850px){

    .ai-home-grid{
        grid-template-columns:1fr;
        gap:40px;
    }

}

@media(max-width:600px){

    .ai-feature-grid{
        grid-template-columns:1fr;
    }

    .ai-home-actions{
        flex-direction:column;
    }

    .ai-home-actions .btn{
        width:100%;
    }

    .ai-feature-panel{
        padding:22px;
    }

}
/* =========================================
   RESPONSIVE FONT SIZING
   ========================================= */

/* Laptops and smaller desktop screens */
@media (max-width: 1366px) {

    .wrap{
        width:min(1100px,calc(100% - 40px));
    }

    .hero{
        min-height:600px;
    }

    .hero h1{
        font-size:clamp(46px,5.5vw,68px);
    }

    .hero p{
        font-size:17px;
    }

    .section{
        padding:80px 0;
    }

    .section h2{
        font-size:clamp(34px,4vw,48px);
    }

    .lead{
        font-size:16px;
    }

    .cards h3{
        font-size:20px;
    }

    .cards p,
    .dark p,
    .support p{
        font-size:15px;
    }

    .nav nav{
        gap:20px;
        font-size:13px;
    }
}
/* Tablets */
@media (max-width: 900px) {

    .hero h1{
        font-size:48px;
        line-height:1;
    }

    .hero p{
        font-size:16px;
    }

    .section h2{
        font-size:38px;
    }

    .lead{
        font-size:15px;
    }

    .eyebrow{
        font-size:11px;
    }

    .cards h3{
        font-size:19px;
    }

    .cards p{
        font-size:14px;
    }
}
/* Smartphones */
@media (max-width: 600px) {

    .wrap{
        width:calc(100% - 30px);
    }

    .hero{
        min-height:auto;
        padding:70px 0;
    }

    .hero h1{
        font-size:40px;
        line-height:1.02;
        letter-spacing:-.04em;
    }

    .hero p{
        font-size:15px;
        line-height:1.6;
    }

    .section{
        padding:60px 0;
    }

    .section h2{
        font-size:32px;
        line-height:1.08;
    }

    .lead{
        font-size:15px;
        line-height:1.6;
    }

    .eyebrow{
        font-size:10px;
        letter-spacing:.13em;
    }

    .cards h3{
        font-size:18px;
    }

    .cards p,
    .dark p,
    .support p{
        font-size:14px;
        line-height:1.6;
    }

    .btn{
        font-size:14px;
        padding:12px 18px;
    }

    .ai-feature-header strong{
        font-size:16px;
    }

    .ai-feature-grid strong{
        font-size:15px;
    }

    .ai-feature-grid small{
        font-size:12px;
    }

    .ai-home-note{
        font-size:11px;
    }

    .footer{
        font-size:13px;
    }
}
@media (max-width: 400px) {

    .hero h1{
        font-size:35px;
    }

    .section h2{
        font-size:29px;
    }

    .hero p,
    .lead{
        font-size:14px;
    }

    .btn{
        font-size:13px;
    }
}
/* =========================================
   MOBILE NAVIGATION
   ========================================= */

@media (max-width: 950px){

    .site-header{
        position:relative;
        z-index:2000;
        overflow:visible;
    }

    .nav{
        position:relative;
        height:70px;
        overflow:visible;
    }


    .brand img{
        width:175px;
    }

    .menu{
        display:block;
        position:relative;
        z-index:1001;
        background:transparent;
        border:0;
        color:#fff;
        font-size:28px;
        line-height:1;
        padding:8px;
        cursor:pointer;
    }

   .site-header .nav nav{
        display:none;

        position:absolute;
        top:70px;
        left:0;
        right:0;
            z-index:1000;

        background:#061d2d;

        padding:18px;

        border:1px solid rgba(255,255,255,.10);
        border-top:0;

        border-radius:0 0 14px 14px;

        box-shadow:0 20px 40px rgba(0,0,0,.25);

        flex-direction:column;
        align-items:stretch;

        gap:4px;
    }

    .nav nav.open{
        display:flex;
    }

    .site-header .nav nav a{
        display:block;
        width:100%;

        padding:13px 12px;

        border-radius:7px;

        font-size:14px;

        color:#fff;
    }

    .nav nav a:hover{
        background:rgba(255,255,255,.08);
    }

    .nav nav .btn{
        margin-top:8px;
        text-align:center;
        background:#2d8cff;
    }
}
/* =========================================
   LINKO COOKIE CONSENT
========================================= */

.cookie-banner{
    position:fixed;
    left:20px;
    right:20px;
    bottom:20px;
    z-index:9999;

    max-width:1180px;
    margin:auto;

    background:#061d2d;
    color:#fff;

    border:1px solid rgba(255,255,255,.14);
    border-radius:16px;

    box-shadow:0 20px 60px rgba(0,0,0,.35);

    padding:22px;

    display:none;
}

.cookie-banner.show{
    display:block;
}

.cookie-content{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
}

.cookie-text{
    max-width:700px;
}

.cookie-text h3{
    margin:0 0 8px;
    font-size:20px;
}

.cookie-text p{
    margin:0 0 8px;
    color:#c5d4de;
    line-height:1.55;
    font-size:14px;
}

.cookie-text a{
    color:#75b7ff;
    font-size:13px;
    font-weight:700;
}

.cookie-actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

.cookie-btn{
    border-radius:8px;
    padding:11px 15px;
    font:inherit;
    font-size:13px;
    font-weight:750;
    cursor:pointer;
}

.cookie-btn.primary{
    background:#2d8cff;
    color:#fff;
    border:1px solid #2d8cff;
}

.cookie-btn.secondary{
    background:transparent;
    color:#fff;
    border:1px solid rgba(255,255,255,.3);
}

.cookie-btn:hover{
    filter:brightness(1.1);
}


/* COOKIE SETTINGS */

.cookie-modal{
    position:fixed;
    inset:0;
    z-index:10000;

    background:rgba(2,15,24,.72);
    backdrop-filter:blur(5px);

    display:none;
    align-items:center;
    justify-content:center;

    padding:20px;
}

.cookie-modal.show{
    display:flex;
}

.cookie-modal-box{
    position:relative;

    width:min(600px,100%);
    max-height:90vh;
    overflow:auto;

    background:#fff;
    color:#0c1d2a;

    padding:35px;

    border-radius:18px;

    box-shadow:0 30px 90px rgba(0,0,0,.35);
}

.cookie-modal-box h2{
    margin:0 0 12px;
    font-size:32px;
}

.cookie-modal-box > p{
    color:#607080;
    line-height:1.6;
}

.cookie-close{
    position:absolute;
    right:18px;
    top:14px;

    border:0;
    background:none;

    font-size:28px;
    cursor:pointer;

    color:#607080;
}

.cookie-option{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;

    padding:20px 0;

    border-top:1px solid #dbe3e9;
}

.cookie-option strong{
    display:block;
    margin-bottom:5px;
}

.cookie-option small{
    display:block;
    color:#607080;
    line-height:1.45;
    max-width:410px;
}


/* TOGGLE */

.cookie-switch{
    position:relative;
    width:48px;
    height:26px;
    flex:0 0 48px;
}

.cookie-switch input{
    opacity:0;
    width:0;
    height:0;
}

.cookie-switch span{
    position:absolute;
    inset:0;

    background:#cbd7df;

    border-radius:30px;

    cursor:pointer;

    transition:.2s;
}

.cookie-switch span:before{
    content:"";

    position:absolute;

    width:20px;
    height:20px;

    left:3px;
    top:3px;

    background:#fff;

    border-radius:50%;

    transition:.2s;
}

.cookie-switch input:checked + span{
    background:#2d8cff;
}

.cookie-switch input:checked + span:before{
    transform:translateX(22px);
}


/* MOBILE */

@media(max-width:700px){

    .cookie-banner{
        left:10px;
        right:10px;
        bottom:10px;
        padding:18px;
    }

    .cookie-content{
        display:block;
    }

    .cookie-text h3{
        font-size:18px;
    }

    .cookie-text p{
        font-size:12px;
    }

    .cookie-actions{
        margin-top:15px;
    }

    .cookie-btn{
        font-size:11px;
        padding:10px 12px;
    }

    .cookie-modal-box{
        padding:27px 20px;
    }

    .cookie-modal-box h2{
        font-size:25px;
    }

    .cookie-option small{
        font-size:11px;
    }
}
/* ==================================================
   LINKO CYBERSECURITY SERVICES PAGE
================================================== */

.cyber-hero{
    padding:110px 0;
    color:#fff;
    background:
        radial-gradient(circle at 80% 40%,rgba(28,110,170,.35),transparent 28%),
        linear-gradient(135deg,#03141f,#072b40);
    overflow:hidden;
}

.cyber-hero-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    align-items:center;
}

.cyber-hero h1{
    margin:0 0 25px;
    font-size:clamp(48px,5.7vw,76px);
    line-height:1;
    letter-spacing:-.05em;
}

.cyber-hero h1 span{
    color:#75b7ff;
}

.cyber-hero p{
    max-width:680px;
    color:#c4d4df;
    font-size:18px;
    line-height:1.7;
}

.cyber-tags{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:30px;
}

.cyber-tags span{
    padding:7px 11px;
    border:1px solid rgba(255,255,255,.15);
    border-radius:100px;
    color:#a9c1d1;
    font-size:10px;
    letter-spacing:.08em;
}


/* HERO SECURITY MAP */

.security-map{
    padding:30px;
    border:1px solid rgba(94,169,255,.25);
    border-radius:22px;
    background:rgba(3,20,31,.62);
    box-shadow:0 30px 80px rgba(0,0,0,.3);
}

.map-title{
    margin-bottom:25px;
    color:#5fa8ff;
    font-size:9px;
    font-weight:800;
    letter-spacing:.18em;
}

.map-clouds{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
}

.map-clouds div{
    padding:15px 5px;
    text-align:center;
    border:1px solid rgba(117,183,255,.3);
    border-radius:30px;
}

.map-clouds span,
.map-clouds strong{
    display:block;
}

.map-clouds span{
    color:#75b7ff;
    font-size:25px;
}

.map-clouds strong{
    margin-top:3px;
    font-size:10px;
}

.map-lines{
    height:35px;
    display:flex;
    justify-content:space-around;
}

.map-lines span{
    border-left:1px dashed #477a9d;
}

.map-internet{
    text-align:center;
    color:#9fc7e6;
    font-size:11px;
}

.map-internet span{
    margin-right:7px;
    color:#5fa8ff;
}

.map-arrow{
    padding:12px;
    text-align:center;
    color:#5fa8ff;
}

.map-firewall{
    padding:20px;
    text-align:center;
    border:1px solid #2d8cff;
    border-radius:9px;
    background:linear-gradient(180deg,#154462,#061d2d);
    box-shadow:0 0 30px rgba(45,140,255,.18);
}

.map-firewall small,
.map-firewall strong,
.map-firewall span{
    display:block;
}

.map-firewall small{
    color:#5fa8ff;
    font-size:8px;
    letter-spacing:.18em;
}

.map-firewall strong{
    margin:5px 0;
    font-size:14px;
}

.map-firewall span{
    color:#92b1c4;
    font-size:8px;
    letter-spacing:.07em;
}

.map-destinations{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
}

.map-destinations div{
    padding:13px 5px;
    text-align:center;
    border-radius:7px;
    background:rgba(255,255,255,.06);
}

.map-destinations strong,
.map-destinations small{
    display:block;
}

.map-destinations strong{
    font-size:9px;
}

.map-destinations small{
    margin-top:4px;
    color:#8fa9b9;
    font-size:8px;
}


/* INTRO */

.cyber-intro{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:90px;
}

.cyber-large-copy{
    margin-top:0;
    color:#18384d;
    font-size:20px;
    line-height:1.65;
}


/* SERVICES */

.cyber-services{
    background:#f4f7f9;
}

.cyber-service-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;
    margin-top:50px;
}

.cyber-service-grid article{
    padding:30px;
    border:1px solid #dbe3e9;
    border-radius:14px;
    background:#fff;
    transition:.2s;
}

.cyber-service-grid article:hover{
    transform:translateY(-4px);
    box-shadow:0 20px 50px rgba(6,29,45,.08);
}

.cyber-service-icon{
    margin-bottom:24px;
    color:#2d8cff;
    font-size:30px;
}

.cyber-service-grid h3{
    margin:0 0 12px;
    font-size:21px;
}

.cyber-service-grid p{
    color:#607080;
    font-size:14px;
    line-height:1.65;
}

.cyber-service-grid ul{
    margin:20px 0;
    padding:0;
    list-style:none;
}

.cyber-service-grid li{
    padding:7px 0;
    border-top:1px solid #edf1f4;
    color:#435866;
    font-size:12px;
}

.cyber-service-grid li:before{
    content:"✓";
    margin-right:8px;
    color:#2d8cff;
    font-weight:800;
}

.cyber-service-grid a{
    color:#126fc7;
    font-size:12px;
    font-weight:800;
}


/* DARK ARCHITECTURE */

.architecture-dark{
    color:#fff;
    background:#041925;
}

.architecture-description{
    max-width:700px;
    color:#a9becb;
    line-height:1.7;
}

.enterprise-diagram{
    max-width:950px;
    margin:55px auto 0;
}

.diagram-zone{
    display:flex;
    justify-content:center;
    gap:15px;
    position:relative;
}

.zone-label{
    position:absolute;
    top:-20px;
    left:0;
    color:#64869c;
    font-size:8px;
    font-weight:800;
    letter-spacing:.15em;
}

.diagram-node{
    min-width:130px;
    padding:15px;
    text-align:center;
    border:1px solid rgba(255,255,255,.13);
    border-radius:8px;
    background:#09283a;
}

.diagram-node span,
.diagram-node strong{
    display:block;
}

.diagram-node span{
    color:#5fa8ff;
    font-size:25px;
}

.diagram-node strong{
    margin-top:5px;
    font-size:10px;
}

.diagram-down{
    padding:20px;
    text-align:center;
    color:#7b9aad;
}

.diagram-down span,
.diagram-down strong{
    display:block;
}

.diagram-down span{
    font-size:8px;
    letter-spacing:.1em;
}

.diagram-down strong{
    color:#5fa8ff;
    font-size:22px;
}

.security-edge{
    padding:25px;
    border:1px solid #276e9d;
    border-radius:14px;
    background:#061f30;
}

.edge-label{
    margin-bottom:18px;
    color:#5fa8ff;
    font-size:8px;
    font-weight:800;
    letter-spacing:.16em;
}

.edge-engine{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:8px;
}

.edge-engine div{
    padding:14px 5px;
    text-align:center;
    background:#0a3048;
    border-radius:6px;
}

.edge-engine small,
.edge-engine strong{
    display:block;
}

.edge-engine small{
    color:#5fa8ff;
    font-size:7px;
}

.edge-engine strong{
    margin-top:5px;
    font-size:9px;
}

.edge-firewall{
    margin-top:15px;
    padding:12px;
    text-align:center;
    border:1px solid #2d8cff;
    border-radius:5px;
    color:#a8d1ef;
    font-size:10px;
    font-weight:900;
    letter-spacing:.15em;
}

.safe-traffic strong{
    color:#3dc978;
}

.internal-zones{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:10px;
}

.internal-zones div{
    padding:18px 5px;
    text-align:center;
    border:1px solid rgba(255,255,255,.1);
    border-radius:7px;
    background:#082536;
}

.internal-zones span,
.internal-zones strong,
.internal-zones small{
    display:block;
}

.internal-zones span{
    font-size:22px;
}

.internal-zones strong{
    margin-top:7px;
    font-size:9px;
}

.internal-zones small{
    margin-top:3px;
    color:#7f9baa;
    font-size:7px;
}


/* MITM */

.mitm-comparison{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
    margin-top:50px;
}

.mitm-panel{
    padding:30px;
    border-radius:15px;
}

.mitm-danger{
    border:1px solid #f0caca;
    background:#fffafa;
}

.mitm-safe{
    border:1px solid #bfe4ce;
    background:#f7fcf9;
}

.mitm-panel-title{
    display:flex;
    gap:12px;
    align-items:center;
}

.mitm-panel-title > span{
    font-size:25px;
}

.mitm-panel-title small{
    color:#778894;
    font-size:7px;
    letter-spacing:.15em;
}

.mitm-panel-title h3{
    margin:3px 0 0;
}

.mitm-network{
    display:flex;
    align-items:center;
    margin:40px 0;
}

.mitm-device,
.mitm-attacker,
.mitm-protection{
    width:90px;
    text-align:center;
}

.mitm-device span,
.mitm-attacker span,
.mitm-protection span{
    display:block;
    font-size:28px;
}

.mitm-device strong,
.mitm-attacker strong,
.mitm-protection strong{
    display:block;
    font-size:9px;
}

.mitm-attacker{
    color:#c52e2e;
}

.mitm-protection{
    color:#14854a;
}

.mitm-attacker small,
.mitm-protection small{
    display:block;
    margin-top:3px;
    font-size:7px;
}

.mitm-connection{
    flex:1;
    position:relative;
    border-top:2px dashed;
    text-align:center;
}

.mitm-connection span{
    position:relative;
    top:-20px;
    padding:2px 4px;
    background:inherit;
    font-size:7px;
}

.mitm-connection.bad{
    border-color:#d64141;
    color:#b22c2c;
}

.mitm-connection.good{
    border-color:#24a65e;
    color:#187e49;
}

.mitm-status{
    padding:10px;
    text-align:center;
    border-radius:5px;
    font-size:8px;
    font-weight:900;
    letter-spacing:.08em;
}

.bad-status{
    color:#a72929;
    background:#ffecec;
}

.good-status{
    color:#137843;
    background:#e5f7ec;
}

.technical-note{
    margin-top:20px;
    padding:20px;
    border-left:4px solid #2d8cff;
    background:#f4f8fb;
}

.technical-note p{
    margin-bottom:0;
    color:#526775;
    font-size:13px;
    line-height:1.6;
}


/* ZERO TRUST */

.zero-trust-section{
    color:#fff;
    background:#07283b;
}

.zero-grid{
    display:grid;
    grid-template-columns:.8fr 1.2fr;
    gap:80px;
    align-items:center;
}

.zero-grid p{
    color:#b5c7d2;
    line-height:1.7;
}

.zero-flow{
    display:flex;
    align-items:center;
    gap:8px;
}

.zero-item{
    flex:1;
    padding:20px 8px;
    text-align:center;
    border:1px solid rgba(255,255,255,.15);
    border-radius:7px;
}

.zero-item strong,
.zero-item small{
    display:block;
}

.zero-item strong{
    font-size:9px;
}

.zero-item small{
    margin-top:5px;
    color:#89a5b6;
    font-size:7px;
}

.zero-item.highlight{
    border-color:#2d8cff;
    background:#0e4160;
}


/* PROCESS */

.process-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:0;
    margin-top:45px;
    border-top:1px solid #dbe3e9;
    border-left:1px solid #dbe3e9;
}

.process-grid > div{
    padding:30px;
    border-right:1px solid #dbe3e9;
    border-bottom:1px solid #dbe3e9;
}

.process-grid span{
    color:#2d8cff;
    font-size:10px;
    font-weight:900;
}

.process-grid h3{
    margin:15px 0 10px;
}

.process-grid p{
    color:#607080;
    font-size:13px;
    line-height:1.6;
}


/* ASSESSMENT */

.assessment-section{
    padding:75px 0;
    color:#fff;
    background:#0b3853;
}

.assessment-grid{
    display:grid;
    grid-template-columns:1fr auto;
    gap:70px;
    align-items:center;
}

.assessment-grid h2{
    margin:0 0 15px;
    font-size:40px;
}

.assessment-grid p{
    max-width:700px;
    color:#bed0da;
    line-height:1.7;
}

.assessment-actions{
    display:flex;
    flex-direction:column;
    gap:15px;
}

.assessment-link{
    text-align:center;
    color:#c8d9e3;
    font-size:12px;
}


/* FAQ */

.faq-wrap{
    max-width:900px;
}

.faq-section details{
    border-top:1px solid #dbe3e9;
}

.faq-section details:last-child{
    border-bottom:1px solid #dbe3e9;
}

.faq-section summary{
    padding:22px 0;
    cursor:pointer;
    font-weight:750;
}

.faq-section details p{
    max-width:760px;
    margin-top:0;
    padding-bottom:20px;
    color:#607080;
    line-height:1.7;
}


/* FINAL CTA */

.cyber-final{
    padding:90px 0;
    text-align:center;
    color:#fff;
    background:
        radial-gradient(circle at center,#104b70,transparent 45%),
        #031722;
}

.cyber-final h2{
    max-width:750px;
    margin:0 auto 20px;
    font-size:clamp(38px,5vw,60px);
    letter-spacing:-.04em;
}

.cyber-final p{
    color:#b8cad5;
}

.final-actions{
    justify-content:center;
}


/* RESPONSIVE */

@media(max-width:1000px){

    .cyber-hero-grid,
    .cyber-intro,
    .zero-grid{
        grid-template-columns:1fr;
    }

    .cyber-service-grid{
        grid-template-columns:1fr 1fr;
    }

    .mitm-comparison{
        grid-template-columns:1fr;
    }

    .assessment-grid{
        grid-template-columns:1fr;
    }

}

@media(max-width:650px){

    .cyber-hero{
        padding:70px 0;
    }

    .cyber-hero h1{
        font-size:40px;
    }

    .cyber-service-grid{
        grid-template-columns:1fr;
    }

    .edge-engine,
    .internal-zones{
        grid-template-columns:1fr 1fr;
    }

    .process-grid{
        grid-template-columns:1fr;
    }

    .mitm-panel{
        padding:18px;
    }

    .mitm-device,
    .mitm-attacker,
    .mitm-protection{
        width:60px;
    }

    .mitm-device span,
    .mitm-attacker span,
    .mitm-protection span{
        font-size:20px;
    }

    .zero-flow{
        display:grid;
        grid-template-columns:1fr;
    }

    .zero-flow > span{
        text-align:center;
        transform:rotate(90deg);
    }

    .assessment-grid h2{
        font-size:30px;
    }

}
/* SECURITY ARCHITECTURE DIAGRAM */

.security-map{

    padding:30px;

    border:
        1px solid
        rgba(94,169,255,.25);

    border-radius:22px;

    background:
        rgba(3,20,31,.62);

    box-shadow:
        0 30px 80px
        rgba(0,0,0,.30);
}


.map-title{

    margin-bottom:25px;

    color:#5fa8ff;

    font-size:9px;
    font-weight:800;

    letter-spacing:.18em;
}


.map-clouds{

    display:grid;

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

    gap:10px;
}


.map-clouds div{

    padding:15px 5px;

    text-align:center;

    border:
        1px solid
        rgba(117,183,255,.30);

    border-radius:30px;
}


.map-clouds span,
.map-clouds strong{

    display:block;
}


.map-clouds span{

    color:#75b7ff;

    font-size:25px;
}


.map-clouds strong{

    margin-top:3px;

    font-size:10px;
}


.map-lines{

    height:35px;

    display:flex;

    justify-content:
        space-around;
}


.map-lines span{

    border-left:
        1px dashed #477a9d;
}


.map-internet{

    text-align:center;

    color:#9fc7e6;

    font-size:11px;
}


.map-internet span{

    margin-right:7px;

    color:#5fa8ff;
}


.map-arrow{

    padding:12px;

    text-align:center;

    color:#5fa8ff;

    font-size:20px;
}


.map-firewall{

    padding:20px;

    text-align:center;

    border:
        1px solid #2d8cff;

    border-radius:9px;

    background:
        linear-gradient(
            180deg,
            #154462,
            #061d2d
        );

    box-shadow:
        0 0 30px
        rgba(45,140,255,.18);
}


.map-firewall small,
.map-firewall strong,
.map-firewall span{

    display:block;
}


.map-firewall small{

    color:#5fa8ff;

    font-size:8px;

    letter-spacing:.18em;
}


.map-firewall strong{

    margin:5px 0;

    font-size:14px;
}


.map-firewall span{

    color:#92b1c4;

    font-size:8px;

    letter-spacing:.07em;
}


.map-destinations{

    display:grid;

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

    gap:8px;
}


.map-destinations div{

    padding:13px 5px;

    text-align:center;

    border-radius:7px;

    background:
        rgba(255,255,255,.06);
}


.map-destinations strong,
.map-destinations small{

    display:block;
}


.map-destinations strong{

    font-size:9px;
}


.map-destinations small{

    margin-top:4px;

    color:#8fa9b9;

    font-size:8px;
}
/* CYBERSECURITY PAGE RESPONSIVE */

@media(max-width:1000px){

    .cyber-hero-grid{
        grid-template-columns:1fr;
    }

    .security-map{
        max-width:650px;
    }

}


@media(max-width:700px){

    .cyber-hero{
        padding:65px 0;
    }

    .cyber-hero h1{
        font-size:40px;
    }

    .cyber-hero p{
        font-size:15px;
    }

    .security-map{
        padding:20px 14px;
    }

    .map-clouds{
        gap:5px;
    }

    .map-clouds div{
        padding:11px 3px;
    }

    .map-clouds strong{
        font-size:8px;
    }

    .map-firewall strong{
        font-size:11px;
    }

    .map-firewall span{
        font-size:7px;
    }

}
/* ==================================================
   NETWORK + CLOUD SECURITY
================================================== */

.cyber-services{
    background:#f4f7f9;
}

.technical-services{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
    margin-top:50px;
}

.technical-service-card{
    padding:32px;
    background:#fff;
    border:1px solid #dbe3e9;
    border-radius:16px;
    box-shadow:0 15px 40px rgba(6,29,45,.05);
}

.technical-service-heading{
    display:flex;
    align-items:center;
    gap:17px;
    margin-bottom:20px;
}

.technical-icon{
    width:55px;
    height:55px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex:0 0 55px;

    border-radius:12px;

    background:#eaf4ff;
    color:#2d8cff;

    font-size:27px;
}

.service-label{
    display:block;
    margin-bottom:5px;

    color:#2d8cff;

    font-size:9px;
    font-weight:850;
    letter-spacing:.15em;
}

.technical-service-card h3{
    margin:0;
    font-size:23px;
    line-height:1.2;
}

.technical-service-card > p{
    color:#607080;
    font-size:14px;
    line-height:1.7;
}

.capability-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:7px;
    margin:25px 0 30px;
}

.capability-grid span{
    padding:9px 10px;

    border:1px solid #e2e9ee;
    border-radius:6px;

    background:#f8fafb;

    color:#405665;

    font-size:10px;
    font-weight:700;
}

.capability-grid span:before{
    content:"✓";
    margin-right:7px;
    color:#2d8cff;
}


/* NETWORK DIAGRAM */

.network-mini-diagram{
    min-height:145px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:20px 12px;

    border-radius:10px;

    background:#061d2d;
}

.mini-node{
    min-width:85px;
    padding:13px 8px;

    text-align:center;

    border:1px solid rgba(255,255,255,.13);
    border-radius:6px;

    background:#0b3047;
}

.mini-node strong,
.mini-node small{
    display:block;
}

.mini-node strong{
    color:#fff;
    font-size:9px;
}

.mini-node small{
    margin-top:4px;
    color:#829faf;
    font-size:7px;
}

.mini-security{
    min-width:80px;
    padding:15px 8px;

    text-align:center;

    border:1px solid #2d8cff;
    border-radius:6px;

    background:#10415f;

    box-shadow:0 0 20px rgba(45,140,255,.2);
}

.mini-security small,
.mini-security strong{
    display:block;
}

.mini-security small{
    color:#79baff;
    font-size:6px;
    letter-spacing:.12em;
}

.mini-security strong{
    margin-top:4px;
    color:#fff;
    font-size:11px;
}

.mini-link{
    padding:0 8px;
    color:#5fa8ff;
    font-weight:900;
}


/* CLOUD DIAGRAM */

.cloud-mini-diagram{
    min-height:250px;

    padding:22px;

    border-radius:10px;

    background:#061d2d;
}

.cloud-mini-diagram > .mini-cloud{
    width:30%;
    display:inline-block;

    margin-right:3%;

    padding:12px 4px;

    text-align:center;

    border:1px solid rgba(95,168,255,.25);
    border-radius:30px;

    background:#0b3047;
}

.cloud-mini-diagram > .mini-cloud:nth-child(3){
    margin-right:0;
}

.mini-cloud span,
.mini-cloud strong{
    display:block;
}

.mini-cloud span{
    color:#5fa8ff;
    font-size:20px;
}

.mini-cloud strong{
    color:#fff;
    font-size:8px;
}

.cloud-connectors{
    height:32px;
    display:flex;
    justify-content:space-around;
}

.cloud-connectors span{
    border-left:1px dashed #44799c;
}

.cloud-security-core{
    max-width:330px;
    margin:auto;

    padding:15px;

    text-align:center;

    border:1px solid #2d8cff;
    border-radius:6px;

    background:#103c58;
}

.cloud-security-core small,
.cloud-security-core strong,
.cloud-security-core span{
    display:block;
}

.cloud-security-core small{
    color:#69aff7;
    font-size:6px;
    letter-spacing:.13em;
}

.cloud-security-core strong{
    margin:4px 0;
    color:#fff;
    font-size:10px;
}

.cloud-security-core span{
    color:#88a9bd;
    font-size:6px;
}

.cloud-arrow{
    padding:8px;
    text-align:center;
    color:#5fa8ff;
}

.onprem-node{
    max-width:260px;
    margin:auto;

    padding:11px;

    text-align:center;

    border:1px solid rgba(255,255,255,.12);
    border-radius:5px;

    background:#09283b;
}

.onprem-node strong,
.onprem-node small{
    display:block;
}

.onprem-node strong{
    color:#fff;
    font-size:8px;
}

.onprem-node small{
    margin-top:3px;
    color:#829eae;
    font-size:6px;
}


/* TABLET / MOBILE */

@media(max-width:900px){

    .technical-services{
        grid-template-columns:1fr;
    }

}

@media(max-width:600px){

    .technical-service-card{
        padding:22px 17px;
    }

    .technical-service-card h3{
        font-size:19px;
    }

    .capability-grid{
        grid-template-columns:1fr 1fr;
    }

    .network-mini-diagram{
        display:grid;
        grid-template-columns:1fr;
        gap:6px;
    }

    .mini-link{
        text-align:center;
        transform:rotate(90deg);
    }

    .cloud-mini-diagram{
        padding:15px 8px;
    }

}
/* ==================================================
   FIREWALL + ZERO TRUST
================================================== */

.advanced-security{
    background:#ffffff;
}

.advanced-security-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
    margin-top:50px;
}

.advanced-security-card{
    padding:32px;

    border:1px solid #dbe3e9;
    border-radius:16px;

    background:#f9fbfc;

    box-shadow:
        0 15px 40px
        rgba(6,29,45,.05);
}

.advanced-heading{
    display:flex;
    align-items:center;
    gap:17px;

    margin-bottom:20px;
}

.advanced-icon{
    width:55px;
    height:55px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex:0 0 55px;

    border-radius:12px;

    background:#eaf4ff;
    color:#2d8cff;

    font-size:27px;
}

.advanced-security-card h3{
    margin:0;

    font-size:23px;
    line-height:1.2;
}

.advanced-security-card > p{
    color:#607080;

    font-size:14px;
    line-height:1.7;
}


/* TECHNICAL ACTION LINK */

.technical-action{
    display:inline-block;

    margin-top:22px;

    color:#126fc7;

    font-size:12px;
    font-weight:800;

    text-decoration:none;
}

.technical-action:hover{
    text-decoration:underline;
}


/* ==================================================
   FIREWALL DIAGRAM
================================================== */

.firewall-flow{
    margin-top:30px;

    padding:24px;

    border-radius:12px;

    background:
        radial-gradient(
            circle at 50% 45%,
            rgba(36,120,180,.18),
            transparent 45%
        ),
        #061d2d;

    color:#fff;
}


.flow-title{
    margin-bottom:22px;

    color:#669fc4;

    font-size:8px;
    font-weight:900;

    letter-spacing:.16em;
}


.internet-source{
    text-align:center;
}

.internet-source span{
    display:block;

    color:#5fa8ff;

    font-size:29px;
}

.internet-source strong{
    display:block;

    margin-top:3px;

    font-size:10px;
}

.internet-source small{
    display:block;

    margin-top:3px;

    color:#7f9baa;

    font-size:6px;

    letter-spacing:.1em;
}


/* TRAFFIC */

.traffic-stream{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;

    gap:5px;

    margin-top:17px;
}

.traffic-stream span{
    padding:5px 8px;

    border-radius:4px;

    font-size:7px;
    font-weight:800;
}

.traffic-stream.attack span{
    border:
        1px solid
        rgba(255,91,91,.35);

    background:
        rgba(192,42,42,.18);

    color:#ff9999;
}


.flow-down{
    padding:13px 0;

    text-align:center;

    font-size:8px;
    font-weight:800;

    letter-spacing:.12em;
}

.attack-arrow{
    color:#ff7777;
}


/* NGFW */

.ngfw-device{
    border:
        1px solid #2d8cff;

    border-radius:8px;

    background:
        linear-gradient(
            180deg,
            #164966,
            #08283c
        );

    box-shadow:
        0 0 30px
        rgba(45,140,255,.17);

    overflow:hidden;
}

.ngfw-top{
    padding:15px;

    text-align:center;

    border-bottom:
        1px solid
        rgba(255,255,255,.1);
}

.ngfw-top small,
.ngfw-top strong{
    display:block;
}

.ngfw-top small{
    color:#68b2ff;

    font-size:6px;

    letter-spacing:.17em;
}

.ngfw-top strong{
    margin-top:5px;

    font-size:11px;
}


/* FIREWALL INSPECTION */

.inspection-grid{
    display:grid;

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

    gap:1px;

    background:
        rgba(255,255,255,.08);
}

.inspection-grid div{
    padding:12px 4px;

    text-align:center;

    background:#0c3248;
}

.inspection-grid small,
.inspection-grid strong{
    display:block;
}

.inspection-grid small{
    color:#6fa4c5;

    font-size:5px;
}

.inspection-grid strong{
    margin-top:3px;

    font-size:7px;
}


.security-engines{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;

    gap:5px;

    padding:13px;
}

.security-engines span{
    padding:5px 8px;

    border:
        1px solid
        rgba(96,177,255,.25);

    border-radius:4px;

    background:#09293d;

    color:#91c9f5;

    font-size:6px;
    font-weight:800;
}


/* FIREWALL DECISION */

.firewall-results{
    display:grid;

    grid-template-columns:1fr 1fr;

    gap:8px;

    margin-top:14px;
}

.blocked-result,
.allowed-result{
    padding:10px;

    text-align:center;

    border-radius:5px;
}

.blocked-result{
    border:
        1px solid
        rgba(255,80,80,.30);

    background:
        rgba(184,39,39,.16);

    color:#ff8d8d;
}

.allowed-result{
    border:
        1px solid
        rgba(64,211,126,.30);

    background:
        rgba(30,146,81,.15);

    color:#70dda0;
}

.blocked-result span,
.blocked-result strong,
.blocked-result small,
.allowed-result span,
.allowed-result strong,
.allowed-result small{
    display:block;
}

.blocked-result span,
.allowed-result span{
    font-size:15px;
}

.blocked-result strong,
.allowed-result strong{
    margin-top:2px;

    font-size:7px;
}

.blocked-result small,
.allowed-result small{
    margin-top:2px;

    font-size:5px;
}


/* PROTECTED NETWORK */

.protected-destinations{
    display:grid;

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

    gap:7px;

    margin-top:14px;
}

.protected-destinations div{
    padding:10px 5px;

    text-align:center;

    border:
        1px solid
        rgba(255,255,255,.10);

    border-radius:5px;

    background:#09283a;
}

.protected-destinations strong,
.protected-destinations small{
    display:block;
}

.protected-destinations strong{
    color:#fff;

    font-size:7px;
}

.protected-destinations small{
    margin-top:3px;

    color:#7896a8;

    font-size:5px;
}


/* ==================================================
   ZERO TRUST DIAGRAM
================================================== */

.zero-trust-diagram{
    margin-top:30px;

    padding:24px;

    border-radius:12px;

    background:
        radial-gradient(
            circle at 50% 45%,
            rgba(36,120,180,.18),
            transparent 45%
        ),
        #061d2d;

    color:#fff;
}


/* USER + DEVICE */

.request-source{
    display:grid;

    grid-template-columns:
        1fr 1fr;

    gap:8px;
}

.request-source div{
    padding:12px;

    text-align:center;

    border:
        1px solid
        rgba(255,255,255,.12);

    border-radius:6px;

    background:#092b40;
}

.request-source span,
.request-source strong{
    display:block;
}

.request-source span{
    font-size:22px;
}

.request-source strong{
    margin-top:4px;

    font-size:8px;
}


/* ZERO TRUST ARROW */

.zero-arrow{
    padding:12px;

    text-align:center;

    color:#65adf1;

    font-size:7px;
    font-weight:900;

    letter-spacing:.12em;
}

.zero-arrow.trusted{
    color:#55cf8a;
}


/* POLICY ENGINE */

.policy-engine{
    padding:16px;

    border:
        1px solid #2d8cff;

    border-radius:8px;

    background:
        linear-gradient(
            180deg,
            #164966,
            #08283c
        );
}

.policy-engine > small,
.policy-engine > strong{
    display:block;

    text-align:center;
}

.policy-engine > small{
    color:#67b3ff;

    font-size:6px;

    letter-spacing:.15em;
}

.policy-engine > strong{
    margin-top:5px;

    font-size:11px;
}


.policy-checks{
    display:grid;

    grid-template-columns:
        1fr 1fr;

    gap:6px;

    margin-top:15px;
}

.policy-checks div{
    padding:10px 6px;

    border:
        1px solid
        rgba(255,255,255,.10);

    border-radius:5px;

    background:#0a3046;
}

.policy-checks span,
.policy-checks strong,
.policy-checks small{
    display:block;
}

.policy-checks span{
    color:#65b0f7;

    font-size:6px;
    font-weight:900;
}

.policy-checks strong{
    margin-top:3px;

    font-size:7px;
}

.policy-checks small{
    margin-top:3px;

    color:#829faf;

    font-size:5px;
    line-height:1.4;
}


/* ZERO TRUST DECISION */

.zero-decision{
    display:grid;

    grid-template-columns:1fr 1fr;

    gap:8px;

    margin-top:14px;
}

.deny-access,
.grant-access{
    padding:10px;

    text-align:center;

    border-radius:5px;
}

.deny-access{
    border:
        1px solid
        rgba(255,80,80,.30);

    background:
        rgba(184,39,39,.16);

    color:#ff8d8d;
}

.grant-access{
    border:
        1px solid
        rgba(64,211,126,.30);

    background:
        rgba(30,146,81,.15);

    color:#70dda0;
}

.deny-access span,
.deny-access strong,
.deny-access small,
.grant-access span,
.grant-access strong,
.grant-access small{
    display:block;
}

.deny-access span,
.grant-access span{
    font-size:15px;
}

.deny-access strong,
.grant-access strong{
    font-size:7px;
}

.deny-access small,
.grant-access small{
    margin-top:2px;

    font-size:5px;
}


/* APPLICATION */

.application-target{
    display:flex;

    align-items:center;
    justify-content:center;

    gap:10px;

    padding:13px;

    border:
        1px solid
        rgba(64,211,126,.25);

    border-radius:6px;

    background:
        rgba(27,132,73,.12);
}

.application-target > span{
    color:#68d798;

    font-size:24px;
}

.application-target strong,
.application-target small{
    display:block;
}

.application-target strong{
    font-size:8px;
}

.application-target small{
    margin-top:3px;

    color:#83a999;

    font-size:6px;
}


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

@media(max-width:900px){

    .advanced-security-grid{
        grid-template-columns:1fr;
    }

}


@media(max-width:600px){

    .advanced-security-card{
        padding:22px 17px;
    }

    .advanced-security-card h3{
        font-size:19px;
    }

    .firewall-flow,
    .zero-trust-diagram{
        padding:17px 10px;
    }

    .inspection-grid{
        grid-template-columns:1fr 1fr;
    }

}
/* ==================================================
   SECURITY ENGINEERING PROCESS
================================================== */

.security-process{
    background:#f4f7f9;
}

.process-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
    margin-top:45px;
}

.process-step{
    position:relative;
    padding:28px;

    background:#fff;

    border:1px solid #dce5eb;
    border-radius:12px;

    overflow:hidden;
}

.process-step:before{
    content:"";
    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:3px;

    background:#2d8cff;
}

.process-number{
    display:block;

    margin-bottom:20px;

    color:#2d8cff;

    font-size:11px;
    font-weight:900;

    letter-spacing:.12em;
}

.process-step h3{
    margin:0 0 10px;

    font-size:21px;
}

.process-step p{
    margin:0;

    color:#617382;

    font-size:13px;
    line-height:1.65;
}

.process-step small{
    display:block;

    margin-top:20px;

    color:#7890a0;

    font-size:7px;
    font-weight:800;

    letter-spacing:.1em;
}


/* ==================================================
   SECURITY ASSESSMENT
================================================== */

.assessment-section{
    background:#071d2b;
    color:#fff;
}

.assessment-layout{
    display:grid;

    grid-template-columns:
        1.05fr .95fr;

    gap:65px;

    align-items:center;
}

.assessment-content h2{
    color:#fff;
}

.assessment-content > p{
    color:#a9bdc9;

    line-height:1.7;
}

.assessment-list{
    display:grid;

    grid-template-columns:
        1fr 1fr;

    gap:9px 22px;

    margin:30px 0;
}

.assessment-list > div{
    display:flex;

    gap:10px;

    padding:11px 0;

    border-bottom:
        1px solid
        rgba(255,255,255,.08);
}

.assessment-list > div > span{
    color:#5fb2ff;

    font-weight:900;
}

.assessment-list p{
    margin:0;

    color:#8fa7b6;

    font-size:11px;
    line-height:1.5;
}

.assessment-list strong{
    display:block;

    margin-bottom:3px;

    color:#fff;

    font-size:11px;
}

.assessment-ticket{
    border-color:
        rgba(255,255,255,.25);

    color:#fff;
}


/* ASSESSMENT CONSOLE */

.assessment-console{
    border:
        1px solid
        rgba(85,168,240,.25);

    border-radius:14px;

    background:#04131d;

    box-shadow:
        0 30px 70px
        rgba(0,0,0,.25);

    overflow:hidden;
}

.console-header{
    display:flex;

    align-items:center;

    gap:6px;

    padding:12px 15px;

    border-bottom:
        1px solid
        rgba(255,255,255,.08);

    background:#0a2535;
}

.console-header > span{
    width:7px;
    height:7px;

    border-radius:50%;

    background:#4b7189;
}

.console-header small{
    margin-left:auto;

    color:#7194a8;

    font-size:6px;
    font-weight:800;

    letter-spacing:.15em;
}

.console-body{
    padding:25px;
}

.console-status{
    display:flex;

    align-items:center;

    gap:10px;

    padding-bottom:20px;

    border-bottom:
        1px solid
        rgba(255,255,255,.08);
}

.status-dot{
    width:10px;
    height:10px;

    border-radius:50%;

    background:#4dd78b;

    box-shadow:
        0 0 15px
        rgba(77,215,139,.5);
}

.console-status small,
.console-status strong{
    display:block;
}

.console-status small{
    color:#66879a;

    font-size:6px;
}

.console-status strong{
    margin-top:3px;

    font-size:10px;
}

.assessment-meter{
    display:grid;

    grid-template-columns:
        1fr 1fr;

    gap:7px;

    margin:20px 0;
}

.assessment-meter div{
    padding:13px;

    border:
        1px solid
        rgba(255,255,255,.08);

    border-radius:6px;

    background:#082434;
}

.assessment-meter span,
.assessment-meter strong,
.assessment-meter small{
    display:block;
}

.assessment-meter span{
    color:#59adf6;

    font-size:6px;
    font-weight:900;
}

.assessment-meter strong{
    margin-top:5px;

    font-size:8px;
}

.assessment-meter small{
    margin-top:4px;

    color:#7692a2;

    font-size:6px;
}

.console-flow{
    display:flex;

    align-items:center;
    justify-content:center;

    gap:8px;

    margin:22px 0;
}

.console-flow div{
    padding:7px 9px;

    border:
        1px solid
        rgba(83,169,244,.20);

    border-radius:4px;

    color:#8fc8f6;

    font-size:6px;
    font-weight:800;
}

.console-flow span{
    color:#477995;
}

.console-result{
    padding:15px;

    text-align:center;

    border:
        1px solid
        rgba(77,215,139,.20);

    border-radius:6px;

    background:
        rgba(32,140,82,.08);
}

.console-result small,
.console-result strong,
.console-result span{
    display:block;
}

.console-result small{
    color:#55d08a;

    font-size:6px;
    letter-spacing:.15em;
}

.console-result strong{
    margin:5px 0;

    font-size:9px;
}

.console-result span{
    color:#789d8b;

    font-size:6px;
}


/* ==================================================
   FAQ
================================================== */

.faq-section{
    background:#f5f7f9;
}

.faq-list{
    max-width:900px;

    margin-top:40px;
}

.faq-list details{
    margin-bottom:9px;

    border:
        1px solid #dce4e9;

    border-radius:9px;

    background:#fff;

    overflow:hidden;
}

.faq-list summary{
    position:relative;

    padding:19px 55px 19px 20px;

    cursor:pointer;

    list-style:none;

    color:#122d3e;

    font-size:14px;
    font-weight:800;
}

.faq-list summary::-webkit-details-marker{
    display:none;
}

.faq-list summary:after{
    content:"+";

    position:absolute;

    right:20px;
    top:50%;

    transform:translateY(-50%);

    color:#2d8cff;

    font-size:22px;
    font-weight:400;
}

.faq-list details[open] summary:after{
    content:"−";
}

.faq-list details p{
    margin:0;

    padding:
        0 55px 20px 20px;

    color:#617482;

    font-size:13px;
    line-height:1.7;
}

.faq-list .technical-action{
    margin:
        0 20px 20px;

}


/* ==================================================
   PROCESS / ASSESSMENT / FAQ MOBILE
================================================== */

@media(max-width:900px){

    .process-grid{
        grid-template-columns:
            1fr 1fr;
    }

    .assessment-layout{
        grid-template-columns:1fr;
    }

}


@media(max-width:600px){

    .process-grid{
        grid-template-columns:1fr;
    }

    .process-step{
        padding:22px;
    }

    .assessment-list{
        grid-template-columns:1fr;
    }

    .assessment-console{
        margin-top:15px;
    }

    .console-body{
        padding:18px 12px;
    }

    .console-flow{
        gap:4px;
    }

    .console-flow div{
        padding:6px 5px;

        font-size:5px;
    }

    .faq-list summary{
        padding:
            17px 45px 17px 16px;

        font-size:13px;
    }

    .faq-list details p{
        padding:
            0 16px 18px;

        font-size:12px;
    }

}
/* ==================================================
   MITM THREAT EDUCATION V2
================================================== */

.mitm-section{
    background:#fff;
}

.mitm-intro{
    max-width:850px;
}


/* ATTACK ARCHITECTURE */

.mitm-architecture{
    margin-top:50px;

    border:1px solid #e7caca;
    border-radius:15px;

    background:
        radial-gradient(
            circle at 50% 50%,
            rgba(182,42,42,.06),
            transparent 45%
        ),
        #fffafa;

    overflow:hidden;
}

.mitm-architecture-header,
.protected-header{
    display:flex;

    align-items:center;
    justify-content:space-between;

    gap:20px;

    padding:17px 22px;

    border-bottom:1px solid #efdede;
}

.mitm-architecture-header > div,
.protected-header > div{
    display:flex;
    align-items:center;
    gap:10px;
}

.mitm-architecture-header small,
.mitm-architecture-header strong,
.protected-header small,
.protected-header strong{
    display:block;
}

.mitm-architecture-header small,
.protected-header small{
    color:#7b8d99;
    font-size:6px;
    letter-spacing:.15em;
}

.mitm-architecture-header strong,
.protected-header strong{
    margin-top:3px;
    font-size:10px;
}

.mitm-alert-dot{
    width:10px;
    height:10px;

    flex:0 0 10px;

    border-radius:50%;

    background:#df4949;

    box-shadow:
        0 0 12px
        rgba(223,73,73,.35);
}

.mitm-risk-label{
    padding:6px 9px;

    border:1px solid #edc5c5;
    border-radius:4px;

    background:#fff0f0;

    color:#b83232;

    font-size:6px;
    font-weight:900;

    letter-spacing:.12em;
}


/* ATTACK PATH */

.mitm-path{
    display:grid;

    grid-template-columns:
        110px 1fr 120px 1fr 110px;

    align-items:center;

    max-width:850px;

    margin:auto;

    padding:50px 25px 35px;
}

.mitm-endpoint{
    text-align:center;
}

.mitm-endpoint-icon{
    width:62px;
    height:62px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin:0 auto 8px;

    border:1px solid #dce5ea;
    border-radius:12px;

    background:#fff;

    font-size:27px;
}

.mitm-endpoint strong,
.mitm-endpoint small{
    display:block;
}

.mitm-endpoint strong{
    color:#183547;
    font-size:9px;
}

.mitm-endpoint small{
    margin-top:3px;
    color:#82939e;
    font-size:6px;
}


/* WIRES */

.mitm-wire{
    position:relative;

    text-align:center;
}

.mitm-wire > div{
    position:relative;

    width:100%;

    border-top:2px dashed #d54a4a;
}

.mitm-wire > div:after{
    content:"";

    position:absolute;

    top:-5px;
    right:-1px;

    width:7px;
    height:7px;

    border-top:2px solid #d54a4a;
    border-right:2px solid #d54a4a;

    transform:rotate(45deg);
}

.mitm-wire span{
    display:block;

    margin-bottom:7px;

    color:#b73737;

    font-size:6px;
    font-weight:900;

    letter-spacing:.1em;
}

.mitm-wire small{
    display:block;

    margin-top:7px;

    color:#a17d7d;

    font-size:6px;
}


/* ATTACKER */

.mitm-threat-node{
    padding:16px 8px;

    text-align:center;

    border:1px solid #d94747;
    border-radius:9px;

    background:#fff0f0;

    box-shadow:
        0 0 25px
        rgba(190,47,47,.12);
}

.mitm-threat-icon{
    color:#d83d3d;
    font-size:25px;
}

.mitm-threat-node > small,
.mitm-threat-node > strong,
.mitm-threat-node > span{
    display:block;
}

.mitm-threat-node > small{
    margin-top:5px;

    color:#c44646;

    font-size:5px;

    letter-spacing:.13em;
}

.mitm-threat-node > strong{
    margin-top:3px;

    color:#9e2929;

    font-size:10px;
}

.mitm-threat-node > span{
    margin-top:5px;

    color:#bc6262;

    font-size:6px;
}


/* ATTACK ACTIONS */

.mitm-actions{
    display:grid;

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

    border-top:1px solid #efdede;

    background:#fff;
}

.mitm-actions > div{
    padding:18px;

    border-right:1px solid #efdede;
}

.mitm-actions > div:last-child{
    border-right:0;
}

.mitm-actions span,
.mitm-actions strong,
.mitm-actions small{
    display:block;
}

.mitm-actions span{
    color:#d34848;

    font-size:7px;
    font-weight:900;
}

.mitm-actions strong{
    margin-top:5px;

    color:#243c4a;

    font-size:9px;
}

.mitm-actions small{
    margin-top:5px;

    color:#758894;

    font-size:8px;
    line-height:1.5;
}


/* ==================================================
   RISK SCENARIOS
================================================== */

.mitm-vector-heading,
.defense-heading{
    margin-top:55px;
}

.mitm-vector-heading h3,
.defense-heading h3{
    margin:7px 0 0;

    font-size:25px;
}

.mitm-vectors{
    display:grid;

    grid-template-columns:
        1fr 1fr;

    gap:12px;

    margin-top:25px;
}

.mitm-vectors article{
    display:flex;

    gap:15px;

    padding:20px;

    border:1px solid #dde5ea;
    border-radius:10px;

    background:#f8fafb;
}

.vector-icon{
    width:42px;
    height:42px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex:0 0 42px;

    border-radius:8px;

    background:#e9f3fb;

    color:#277cc0;

    font-size:19px;
}

.mitm-vectors strong{
    display:block;

    color:#19384a;

    font-size:12px;
}

.mitm-vectors p{
    margin:6px 0 0;

    color:#667b88;

    font-size:10px;
    line-height:1.6;
}


/* ==================================================
   PROTECTED ARCHITECTURE
================================================== */

.protected-architecture{
    margin-top:55px;

    border:1px solid #c9e5d4;
    border-radius:15px;

    background:
        radial-gradient(
            circle at 50% 50%,
            rgba(39,158,90,.06),
            transparent 45%
        ),
        #f9fdfa;

    overflow:hidden;
}

.protected-header{
    border-bottom:1px solid #d9eadf;
}

.protected-dot{
    width:10px;
    height:10px;

    flex:0 0 10px;

    border-radius:50%;

    background:#39b873;

    box-shadow:
        0 0 12px
        rgba(57,184,115,.35);
}

.protected-label{
    padding:6px 9px;

    border:1px solid #bee2cd;
    border-radius:4px;

    background:#ebf8f0;

    color:#21804c;

    font-size:6px;
    font-weight:900;

    letter-spacing:.12em;
}


/* SECURE PATH */

.protected-path{
    display:grid;

    grid-template-columns:
        110px 1fr 190px 1fr 110px;

    align-items:center;

    max-width:900px;

    margin:auto;

    padding:50px 25px;
}

.protected-endpoint{
    text-align:center;
}

.protected-endpoint > div{
    width:62px;
    height:62px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin:0 auto 8px;

    border:1px solid #cfe3d7;
    border-radius:12px;

    background:#fff;

    font-size:27px;
}

.protected-endpoint strong,
.protected-endpoint small{
    display:block;
}

.protected-endpoint strong{
    color:#183b2b;
    font-size:9px;
}

.protected-endpoint small{
    margin-top:3px;
    color:#7c9788;
    font-size:6px;
}


/* SECURE WIRE */

.secure-wire{
    text-align:center;
}

.secure-wire span{
    display:block;

    margin-bottom:7px;

    color:#258b54;

    font-size:7px;
    font-weight:900;
}

.secure-wire > div{
    position:relative;

    border-top:2px solid #3bb773;
}

.secure-wire > div:after{
    content:"";

    position:absolute;

    top:-5px;
    right:-1px;

    width:7px;
    height:7px;

    border-top:2px solid #3bb773;
    border-right:2px solid #3bb773;

    transform:rotate(45deg);
}

.secure-wire small{
    display:block;

    margin-top:7px;

    color:#69917a;

    font-size:6px;
}


/* TRUST ENGINE */

.trust-engine{
    padding:17px 12px;

    text-align:center;

    border:1px solid #35a968;
    border-radius:9px;

    background:#eef9f2;

    box-shadow:
        0 0 25px
        rgba(48,160,96,.10);
}

.trust-engine > small,
.trust-engine > strong{
    display:block;
}

.trust-engine > small{
    color:#36855a;

    font-size:5px;

    letter-spacing:.14em;
}

.trust-engine > strong{
    margin-top:4px;

    color:#1e633e;

    font-size:9px;
}

.trust-checks{
    display:grid;

    grid-template-columns:
        1fr 1fr;

    gap:5px;

    margin-top:12px;
}

.trust-checks span{
    padding:5px;

    border-radius:4px;

    background:#fff;

    color:#357654;

    font-size:6px;
    font-weight:700;
}


/* PROTECTED RESULT */

.protected-status{
    display:flex;

    align-items:center;
    justify-content:center;

    gap:12px;

    padding:17px;

    border-top:1px solid #d9eadf;

    background:#f0f9f4;
}

.protected-status > span{
    width:28px;
    height:28px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:#37ad6c;

    color:#fff;

    font-size:13px;
    font-weight:900;
}

.protected-status strong,
.protected-status small{
    display:block;
}

.protected-status strong{
    color:#236443;
    font-size:8px;
}

.protected-status small{
    margin-top:3px;

    color:#6b8a78;

    font-size:7px;
}


/* ==================================================
   DEFENSE IN DEPTH
================================================== */

.mitm-defense-grid{
    display:grid;

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

    gap:10px;

    margin-top:25px;
}

.mitm-defense-grid > div{
    padding:18px;

    border:1px solid #dce5ea;
    border-radius:8px;

    background:#f8fafb;
}

.mitm-defense-grid span,
.mitm-defense-grid strong,
.mitm-defense-grid small{
    display:block;
}

.mitm-defense-grid span{
    color:#2d8cff;

    font-size:7px;
    font-weight:900;
}

.mitm-defense-grid strong{
    margin-top:6px;

    color:#17384c;

    font-size:9px;
}

.mitm-defense-grid small{
    margin-top:5px;

    color:#70838f;

    font-size:8px;
    line-height:1.5;
}


/* SECURITY NOTE */

.mitm-security-note{
    display:flex;

    gap:15px;

    margin-top:25px;

    padding:20px;

    border-left:4px solid #2d8cff;

    background:#f1f7fb;
}

.security-note-icon{
    width:30px;
    height:30px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex:0 0 30px;

    border-radius:50%;

    background:#2d8cff;

    color:#fff;

    font-family:serif;
    font-weight:bold;
}

.mitm-security-note strong{
    color:#18384b;
}

.mitm-security-note p{
    margin:5px 0 0;

    color:#5e7482;

    font-size:12px;
    line-height:1.65;
}


/* ==================================================
   MITM MOBILE
================================================== */

@media(max-width:800px){

    .mitm-path,
    .protected-path{
        grid-template-columns:1fr;

        gap:10px;

        padding:30px 20px;
    }

    .mitm-wire,
    .secure-wire{
        width:100px;

        margin:auto;

        transform:rotate(90deg);
    }

    .mitm-wire span,
    .mitm-wire small,
    .secure-wire span,
    .secure-wire small{
        display:none;
    }

    .mitm-threat-node,
    .trust-engine{
        width:200px;

        margin:auto;
    }

    .mitm-actions{
        grid-template-columns:1fr;
    }

    .mitm-actions > div{
        border-right:0;
        border-bottom:1px solid #efdede;
    }

    .mitm-actions > div:last-child{
        border-bottom:0;
    }

    .mitm-vectors{
        grid-template-columns:1fr;
    }

    .mitm-defense-grid{
        grid-template-columns:
            1fr 1fr;
    }

}


@media(max-width:500px){

    .mitm-architecture-header,
    .protected-header{
        align-items:flex-start;

        padding:15px;
    }

    .mitm-risk-label,
    .protected-label{
        display:none;
    }

    .mitm-defense-grid{
        grid-template-columns:1fr;
    }

    .mitm-vector-heading h3,
    .defense-heading h3{
        font-size:21px;
    }

}
/* ==================================================
   ACTIVE FIREWALL
================================================== */

.map-firewall,
.ngfw-device{

    position:relative;

    transition:
        border-color .3s ease,
        box-shadow .3s ease;
}


.map-firewall:before,
.ngfw-device:before{

    content:"";

    position:absolute;

    width:7px;
    height:7px;

    top:10px;
    right:10px;

    border-radius:50%;

    background:#55d88a;

    box-shadow:
        0 0 10px
        rgba(85,216,138,.8);

    animation:
        firewallStatus 2s
        ease-in-out infinite;
}


@keyframes firewallStatus{

    0%,
    100%{
        opacity:.55;
    }

    50%{
        opacity:1;

        box-shadow:
            0 0 14px
            rgba(85,216,138,1);
    }

}


.map-firewall:hover,
.ngfw-device:hover{

    border-color:#65b2ff;

    box-shadow:
        0 0 35px
        rgba(45,140,255,.25);
}
/* ==================================================
   FIREWALL TRAFFIC ANIMATION
================================================== */

.firewall-flow{
    position:relative;
    overflow:hidden;
}

.traffic-stream span{

    transition:
        transform .2s ease,
        background .2s ease;
}

.traffic-stream span:hover{
    transform:translateY(-2px);
}


.attack-arrow{

    animation:
        inspectPulse 1.8s
        ease-in-out infinite;
}


@keyframes inspectPulse{

    0%,
    100%{
        opacity:.45;
    }

    50%{
        opacity:1;
    }

}


/* Inspection engines */

.inspection-grid div{

    transition:
        background .25s ease,
        box-shadow .25s ease;
}


.inspection-grid div:hover{

    background:#12415c;

    box-shadow:
        inset 0 0 15px
        rgba(71,165,235,.12);
}


/* Security engines */

.security-engines span{

    transition:
        border-color .2s ease,
        background .2s ease,
        color .2s ease;
}


.security-engines span:hover{

    border-color:
        rgba(96,177,255,.65);

    background:#10405c;

    color:#c4e5ff;
}
/* ==================================================
   ZERO TRUST VALIDATION
================================================== */

.policy-checks div{

    position:relative;

    transition:
        border-color .25s ease,
        background .25s ease,
        transform .25s ease;
}


.policy-checks div:hover{

    transform:translateY(-2px);

    border-color:
        rgba(88,177,245,.4);

    background:#0d3a53;
}


.grant-access{

    animation:
        trustedAccess 3s
        ease-in-out infinite;
}


@keyframes trustedAccess{

    0%,
    100%{
        box-shadow:none;
    }

    50%{
        box-shadow:
            0 0 18px
            rgba(64,211,126,.13);
    }

}
/* ==================================================
   MITM VISUAL MOTION
================================================== */

.mitm-threat-node{

    animation:
        threatPulse 3s
        ease-in-out infinite;
}


@keyframes threatPulse{

    0%,
    100%{
        box-shadow:
            0 0 12px
            rgba(190,47,47,.08);
    }

    50%{
        box-shadow:
            0 0 25px
            rgba(190,47,47,.20);
    }

}


/* Secure trust engine */

.trust-engine{

    animation:
        trustPulse 3.5s
        ease-in-out infinite;
}


@keyframes trustPulse{

    0%,
    100%{
        box-shadow:
            0 0 10px
            rgba(48,160,96,.06);
    }

    50%{
        box-shadow:
            0 0 25px
            rgba(48,160,96,.16);
    }

}
/* ==================================================
   BUTTON POLISH
================================================== */

.btn{

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        background .2s ease;
}


.btn:hover{

    transform:translateY(-2px);

    box-shadow:
        0 10px 25px
        rgba(17,93,148,.18);
}


.btn:active{

    transform:translateY(0);
}
/* ACTIVE NAVIGATION */

.site-header nav a.active-section{
    color:#2d8cff;
}

.site-header nav a.active-section:after{

    content:"";

    display:block;

    width:100%;
    height:2px;

    margin-top:4px;

    border-radius:2px;

    background:#2d8cff;
}
/* MOBILE MOTION REDUCTION */

@media(max-width:600px){

    .map-lines span:after{
        animation-duration:3.5s;
    }

    .technical-service-card:hover,
    .advanced-security-card:hover,
    .process-step:hover,
    .mitm-vectors article:hover,
    .mitm-defense-grid > div:hover{

        transform:none;
    }

}
/* ==================================================
   ACCESSIBILITY - REDUCED MOTION
================================================== */

@media (prefers-reduced-motion: reduce){

    html{
        scroll-behavior:auto;
    }

    *,
    *::before,
    *::after{

        animation-duration:.01ms !important;

        animation-iteration-count:1 !important;

        transition-duration:.01ms !important;

        scroll-behavior:auto !important;
    }

}


/* ==================================================
   HOMEPAGE SERVICE DETAIL LINKS
   Added for homepage service cards
================================================== */

.service-learn{
    display:inline-flex;
    align-items:center;
    margin-top:16px;
    color:#1675c1;
    font-size:11px;
    font-weight:800;
    line-height:1.4;
    text-decoration:none;
    transition:color .2s ease, transform .2s ease;
}

.service-learn:hover{
    color:#0c5591;
    transform:translateX(3px);
}

.service-learn:focus-visible{
    outline:2px solid var(--blue);
    outline-offset:4px;
    border-radius:3px;
}

/* Keep service-card links positioned consistently */
.cards article{
    display:flex;
    flex-direction:column;
}

.cards article .service-learn{
    margin-top:auto;
    padding-top:16px;
}

/* Tablet and phone adjustments */
@media(max-width:900px){
    .service-learn{
        font-size:11px;
    }
}

@media(max-width:600px){
    .service-learn{
        margin-top:12px;
        padding-top:12px;
        font-size:11px;
    }
}


/* ==================================================
   HOMEPAGE LIVE SECURITY ARCHITECTURE
================================================== */
.home-live-security{position:relative;overflow:hidden;background:#061b29;color:#fff}
.home-live-security:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.22;background-image:linear-gradient(rgba(91,164,214,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(91,164,214,.08) 1px,transparent 1px);background-size:34px 34px;animation:linkoGridMove 18s linear infinite}
.home-live-security .wrap{position:relative;z-index:1}
.home-live-heading{max-width:820px;margin-bottom:34px}.home-live-heading h2{color:#fff;margin-bottom:12px}.home-live-heading .lead{color:#9eb5c3}
.live-sec-console{max-width:940px;margin:0 auto;border:1px solid rgba(93,174,231,.28);border-radius:16px;overflow:hidden;background:rgba(3,18,28,.94);box-shadow:0 32px 80px rgba(0,0,0,.28)}
.live-sec-topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 18px;border-bottom:1px solid rgba(255,255,255,.08);background:#0a293b}
.live-sec-topbar small{font-size:7px;letter-spacing:.16em;color:#668fa8;font-weight:800}.live-sec-status{display:flex;align-items:center;gap:8px;font-size:8px;letter-spacing:.09em}
.live-status-dot,.firewall-active-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#48d486;box-shadow:0 0 12px rgba(72,212,134,.9);animation:linkoStatusPulse 1.8s ease-in-out infinite}
.live-cloud-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:660px;margin:32px auto 0;padding:0 22px}
.live-cloud{padding:14px;text-align:center;border:1px solid rgba(86,167,226,.24);border-radius:8px;background:#092b40;transition:transform .2s ease,border-color .2s ease,background .2s ease}
.live-cloud:hover{transform:translateY(-3px);border-color:#4ba5e4;background:#0b3550}.cloud-mark{display:block;color:#69b9f4;font-size:23px;margin-bottom:3px}.live-cloud strong,.live-cloud small{display:block}.live-cloud strong{font-size:9px}.live-cloud small{font-size:5px;color:#698da3;margin-top:3px;letter-spacing:.1em}
.live-vertical-link{position:relative;width:2px;height:38px;margin:0 auto;background:linear-gradient(#275f80,#4ca8e6);overflow:visible}
.live-vertical-link:after{content:"";position:absolute;bottom:-1px;left:-3px;width:6px;height:6px;border-right:2px solid #55afe9;border-bottom:2px solid #55afe9;transform:rotate(45deg)}
.packet{position:absolute;left:-3px;top:-5px;width:8px;height:8px;border-radius:50%;background:#73c7ff;box-shadow:0 0 12px rgba(115,199,255,.95);animation:linkoPacketDown 1.8s linear infinite}.packet-b{animation-delay:.55s}.packet-c{animation-delay:1.1s}.packet-d{animation-delay:.3s}.packet-e{animation-delay:.7s}.packet-f{animation-delay:1.05s}
.live-edge-node,.live-zero-trust{max-width:470px;margin:0 auto;padding:12px 18px;text-align:center;border:1px solid rgba(79,159,215,.24);border-radius:7px;background:#09293b}
.live-edge-node small,.live-edge-node strong,.live-zero-trust small,.live-zero-trust strong{display:block}.live-edge-node small,.live-zero-trust small{font-size:6px;color:#65a9d5;letter-spacing:.13em}.live-edge-node strong,.live-zero-trust strong{font-size:9px;margin-top:4px}
.live-firewall{position:relative;max-width:560px;margin:0 auto;padding:18px;border:1px solid #3d9bd9;border-radius:10px;background:linear-gradient(180deg,#123d56,#082638);box-shadow:0 0 34px rgba(44,143,211,.13)}
.firewall-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}.firewall-head>div{display:flex;align-items:center;gap:7px}.firewall-head small{font-size:6px;color:#70b5e2;letter-spacing:.13em}
.firewall-state{padding:4px 7px;border:1px solid rgba(72,212,134,.35);border-radius:4px;color:#6ee29e;background:rgba(72,212,134,.07);font-size:6px;font-weight:900;letter-spacing:.1em}
.live-firewall>strong{display:block;text-align:center;font-size:13px;letter-spacing:.04em}.firewall-engines{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin:13px 0}.firewall-engines span{padding:6px 4px;text-align:center;border:1px solid rgba(110,184,235,.18);border-radius:4px;background:#0a3045;color:#8fc7ea;font-size:6px;font-weight:800}
.inspection-line{position:relative;height:3px;border-radius:4px;background:#123f59;overflow:hidden}.inspection-line span{position:absolute;top:0;left:-28%;width:28%;height:100%;background:linear-gradient(90deg,transparent,#65c1ff,transparent);animation:linkoInspectSweep 2.2s linear infinite}.firewall-caption{display:block;text-align:center;margin-top:9px;color:#7299ae;font-size:6px;letter-spacing:.1em}
.live-zero-trust>div{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:10px}.live-zero-trust>div span{padding:5px;border-radius:4px;background:#0c354c;color:#91c5e5;font-size:6px;font-weight:800}
.live-assets{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;max-width:620px;margin:0 auto 30px;padding:0 22px}.live-assets div{padding:13px;text-align:center;border:1px solid rgba(255,255,255,.08);border-radius:6px;background:#092536}.live-assets strong,.live-assets small{display:block}.live-assets strong{font-size:8px}.live-assets small{font-size:5px;color:#668596;margin-top:3px}
.live-sec-footer{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:13px 18px;border-top:1px solid rgba(255,255,255,.07);background:#061f2e;color:#718f9f;font-size:6px;font-weight:800;letter-spacing:.07em}.live-sec-footer span{display:flex;align-items:center;gap:6px}.live-sec-footer a{margin-left:auto;color:#72bdf0;text-decoration:none;font-size:8px;letter-spacing:0}
.legend-dot{display:inline-block;width:6px;height:6px;border-radius:50%}.legend-dot.allowed{background:#48d486;box-shadow:0 0 8px rgba(72,212,134,.55)}.legend-dot.blocked{background:#df5555;box-shadow:0 0 8px rgba(223,85,85,.45)}
@keyframes linkoPacketDown{0%{top:-5px;opacity:0}12%{opacity:1}82%{opacity:1}100%{top:35px;opacity:0}}
@keyframes linkoInspectSweep{from{left:-28%}to{left:100%}}
@keyframes linkoStatusPulse{0%,100%{opacity:.55;transform:scale(.9)}50%{opacity:1;transform:scale(1.12)}}
@keyframes linkoGridMove{from{background-position:0 0,0 0}to{background-position:34px 34px,34px 34px}}
@media(max-width:700px){.live-cloud-row{gap:6px;padding:0 10px}.live-cloud{padding:10px 5px}.live-firewall,.live-edge-node,.live-zero-trust{margin-left:12px;margin-right:12px}.firewall-engines{gap:3px}.live-zero-trust>div{grid-template-columns:1fr 1fr}.live-assets{gap:5px;padding:0 10px}.live-sec-footer{gap:10px}.live-sec-footer a{width:100%;margin-left:0;margin-top:4px}}
@media(prefers-reduced-motion:reduce){.home-live-security:before,.packet,.live-status-dot,.firewall-active-dot,.inspection-line span{animation:none!important}}



/* ==================================================
   LINKO MANAGED SECURITY SERVICES
================================================== */
.managed-hero{padding:105px 0;color:#fff;background:radial-gradient(circle at 78% 38%,rgba(37,124,180,.3),transparent 30%),linear-gradient(135deg,#03141f,#082d43);overflow:hidden}
.managed-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center}
.managed-hero h1{font-size:clamp(48px,5.8vw,76px);line-height:1;letter-spacing:-.05em;margin:0 0 24px}
.managed-hero p{max-width:650px;color:#c4d5df;font-size:18px;line-height:1.7}
.managed-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}.managed-tags span{padding:7px 10px;border:1px solid rgba(255,255,255,.15);border-radius:999px;color:#9fc0d3;font-size:9px;font-weight:700}
.managed-ops-console{border:1px solid rgba(82,166,223,.28);border-radius:16px;background:#041722;box-shadow:0 30px 80px rgba(0,0,0,.28);overflow:hidden}
.ops-topbar{display:flex;align-items:center;justify-content:space-between;padding:13px 15px;background:#092b40;border-bottom:1px solid rgba(255,255,255,.08);font-size:7px;letter-spacing:.11em}.ops-topbar>div{display:flex;align-items:center;gap:7px}.ops-topbar>span{color:#6f90a4;font-size:6px}
.ops-live-dot{width:8px;height:8px;border-radius:50%;background:#49d98b;box-shadow:0 0 12px rgba(73,217,139,.8);animation:opsPulse 1.8s ease-in-out infinite}
.ops-stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.06)}
.ops-stat-grid>div{padding:18px;background:#082536}.ops-stat-grid small,.ops-stat-grid strong,.ops-stat-grid span{display:block}.ops-stat-grid small{font-size:6px;color:#6c93aa;letter-spacing:.1em}.ops-stat-grid strong{font-size:18px;margin:7px 0;color:#fff}.ops-stat-grid span{font-size:6px;color:#7898a9}.ops-stat-grid .ops-good{color:#56d58f}
.ops-traffic{padding:20px}.ops-title{font-size:6px;color:#669ec0;letter-spacing:.13em;margin-bottom:16px;font-weight:900}.ops-flow{display:grid;grid-template-columns:1fr auto 1.2fr auto 1fr;gap:8px;align-items:center}.ops-flow>div{padding:13px 7px;text-align:center;border:1px solid rgba(255,255,255,.1);border-radius:6px;background:#09293b}.ops-flow strong,.ops-flow small{display:block}.ops-flow strong{font-size:8px}.ops-flow small{font-size:5px;color:#6f8d9e;margin-top:3px}.ops-flow .ops-control{border-color:#2d8cff;background:#0e3c58;box-shadow:0 0 22px rgba(45,140,255,.13)}.ops-arrow{color:#64b8ed;animation:opsArrow 1.7s ease-in-out infinite}
.ops-note{padding:12px 15px;border-top:1px solid rgba(255,255,255,.06);color:#658496;font-size:6px;line-height:1.5}
.managed-services-section{background:#f4f7f9}.managed-service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:48px}.managed-service-grid article{padding:28px;border:1px solid #dbe3e9;border-radius:14px;background:#fff;transition:.2s}.managed-service-grid article:hover{transform:translateY(-4px);box-shadow:0 18px 45px rgba(6,29,45,.08)}.managed-icon{font-size:28px;color:#2d8cff;margin-bottom:20px}.managed-service-grid h3{margin:0 0 10px;font-size:21px}.managed-service-grid p{color:#607080;font-size:13px;line-height:1.65}.managed-service-grid ul{list-style:none;padding:0;margin:18px 0 0}.managed-service-grid li{padding:7px 0;border-top:1px solid #eef2f4;color:#465b68;font-size:11px}.managed-service-grid li:before{content:"✓";color:#2d8cff;font-weight:900;margin-right:8px}
.managed-operations{background:#061d2d;color:#fff}.managed-operations-grid{display:grid;grid-template-columns:1fr 1fr;gap:75px;align-items:start}.managed-operations h2{color:#fff}.managed-operations p{color:#b4c7d2;line-height:1.7}.managed-checks{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:28px}.managed-checks span{padding:11px;border:1px solid rgba(255,255,255,.09);border-radius:6px;color:#abc0cc;font-size:10px}.managed-checks span:before{content:"✓";color:#5fa8ff;margin-right:7px}
.managed-timeline>div{display:flex;gap:16px;padding:18px 0;border-top:1px solid rgba(255,255,255,.1)}.managed-timeline b{color:#5fa8ff;font-size:10px}.managed-timeline span{display:flex;flex-direction:column}.managed-timeline strong{font-size:13px}.managed-timeline small{color:#8fa7b5;margin-top:5px;line-height:1.5}
.managed-plans{background:#fff}.plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:45px}.plan-grid article{display:flex;flex-direction:column;padding:30px;border:1px solid #dbe3e9;border-radius:16px;background:#fff;box-shadow:0 12px 35px rgba(6,29,45,.04)}.plan-grid .plan-featured{border-color:#2d8cff;box-shadow:0 20px 50px rgba(45,140,255,.12);transform:translateY(-5px)}.plan-label{color:#2d8cff;font-size:8px;font-weight:900;letter-spacing:.15em}.plan-grid h3{font-size:23px;margin:12px 0}.plan-grid p{color:#607080;font-size:13px;line-height:1.6}.plan-grid ul{list-style:none;padding:0;margin:18px 0 24px}.plan-grid li{padding:8px 0;border-top:1px solid #eef2f4;color:#445b69;font-size:11px}.plan-grid li:before{content:"✓";color:#2d8cff;margin-right:8px;font-weight:900}.plan-btn{margin-top:auto;width:100%}
.managed-deliverables{background:#f4f7f9}.managed-deliverables-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:start}.deliverable-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.deliverable-grid>div{padding:20px;border:1px solid #dbe3e9;border-radius:10px;background:#fff}.deliverable-grid strong,.deliverable-grid small{display:block}.deliverable-grid strong{font-size:12px}.deliverable-grid small{margin-top:6px;color:#607080;font-size:10px;line-height:1.5}
.managed-final{padding:85px 0;text-align:center;color:#fff;background:radial-gradient(circle at 50% 50%,#104b70,transparent 44%),#031722}.managed-final h2{max-width:760px;margin:0 auto 18px;font-size:clamp(38px,5vw,58px);letter-spacing:-.04em}.managed-final p{color:#b8cad5;max-width:700px;margin:0 auto}.managed-final .final-actions{justify-content:center}
@keyframes opsPulse{0%,100%{opacity:.55;transform:scale(.9)}50%{opacity:1;transform:scale(1.12)}}
@keyframes opsArrow{0%,100%{opacity:.4;transform:translateX(0)}50%{opacity:1;transform:translateX(3px)}}
@media(max-width:950px){.managed-hero-grid,.managed-operations-grid,.managed-deliverables-grid{grid-template-columns:1fr}.managed-service-grid,.plan-grid{grid-template-columns:1fr 1fr}.plan-grid .plan-featured{transform:none}}
@media(max-width:650px){.managed-hero{padding:70px 0}.managed-hero h1{font-size:40px}.managed-service-grid,.plan-grid,.managed-checks,.deliverable-grid{grid-template-columns:1fr}.ops-flow{grid-template-columns:1fr}.ops-arrow{transform:rotate(90deg);text-align:center}.ops-stat-grid{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){.ops-live-dot,.ops-arrow{animation:none!important}}



/* HOMEPAGE MANAGED SERVICES */
.home-managed-services{background:#071d2b;color:#fff}.home-managed-grid{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center}.home-managed-services h2{color:#fff}.home-managed-services .lead{color:#a9bdc9}.home-managed-list{display:flex;flex-wrap:wrap;gap:7px;margin:26px 0}.home-managed-list span{padding:7px 10px;border:1px solid rgba(111,184,240,.22);border-radius:999px;background:rgba(53,133,190,.08);color:#9ecbea;font-size:9px;font-weight:700}.home-managed-ghost{border-color:rgba(255,255,255,.3)}
.home-managed-console{padding:25px;border:1px solid rgba(83,164,225,.25);border-radius:14px;background:#04141f;box-shadow:0 30px 70px rgba(0,0,0,.22)}.home-managed-console-head{display:flex;align-items:center;gap:8px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.08);font-size:8px;letter-spacing:.1em}.home-managed-console-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:18px 0}.home-managed-console-grid>div{padding:13px;border:1px solid rgba(255,255,255,.08);border-radius:6px;background:#082536}.home-managed-console-grid small,.home-managed-console-grid strong{display:block}.home-managed-console-grid small{color:#6d93a8;font-size:6px}.home-managed-console-grid strong{margin-top:4px;font-size:10px}.home-managed-flow{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;padding:12px;border:1px solid rgba(75,163,224,.18);border-radius:6px;background:#09283a}.home-managed-flow span{color:#8ec7eb;font-size:6px;font-weight:900}.home-managed-flow b{color:#477f9f}.home-managed-demo{display:block;margin-top:12px;color:#658496;font-size:6px;line-height:1.5}
@media(max-width:850px){.home-managed-grid{grid-template-columns:1fr}.home-managed-console{margin-top:10px}}



/* ==================================================
   CONTACT FORM V2
================================================== */

.contact-form-v2{
    position:relative;
}

.contact-form-v2 .form-intro{
    margin:-10px 0 22px;
    color:#607080;
    font-size:13px;
    line-height:1.6;
}

.form-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
}

.contact-form-v2 label{
    margin:10px 0;
}

.contact-form-v2 input,
.contact-form-v2 select,
.contact-form-v2 textarea{
    transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}

.contact-form-v2 input:focus,
.contact-form-v2 select:focus,
.contact-form-v2 textarea:focus{
    outline:none;
    border-color:#2d8cff;
    box-shadow:0 0 0 3px rgba(45,140,255,.12);
}

.contact-form-v2 textarea{
    resize:vertical;
    min-height:145px;
}

.contact-form-v2 optgroup{
    font-weight:800;
    color:#0c1d2a;
}

.form-security-note{
    display:flex;
    flex-direction:column;
    gap:4px;
    margin:18px 0;
    padding:13px 15px;
    border-left:3px solid #2d8cff;
    border-radius:5px;
    background:#f3f8fc;
}

.form-security-note strong{
    color:#18384b;
    font-size:11px;
}

.form-security-note span{
    color:#607080;
    font-size:10px;
    line-height:1.5;
}

.form-bottom-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin-top:18px;
    flex-wrap:wrap;
}

.form-bottom-row .btn{
    min-width:165px;
}

.form-support-link{
    margin-top:16px;
    padding-top:14px;
    border-top:1px solid #e7edf1;
    color:#607080;
    font-size:11px;
}

.form-support-link a{
    margin-left:4px;
    color:#1675c1;
    font-weight:800;
}

.form-support-link a:hover{
    text-decoration:underline;
}

@media(max-width:700px){
    .form-row{
        grid-template-columns:1fr;
        gap:0;
    }

    .form-bottom-row{
        align-items:stretch;
        flex-direction:column;
    }

    .form-bottom-row .btn{
        width:100%;
    }

    .contact-form-v2{
        padding:24px 18px;
    }
}
.qr-section {
    margin: 25px 0;
    padding: 22px;
    background: #f5f8fa;
    border: 1px solid #dce5ea;
    border-radius: 10px;
    text-align: center;
}

.mfa-qr {
    width: 260px;
    max-width: 100%;
    height: auto;
    background: #ffffff;
    padding: 8px;
    border-radius: 6px;
}

.qr-help {
    max-width: 400px;
    margin: 15px auto 0;
    color: #607482;
    font-size: 12px;
    line-height: 1.6;
}


/* ==================================================
   LINKO CYBERSECURITY LIVE FLOW ANIMATIONS
   Mobile + desktop
================================================== */

/* Hero cloud-to-edge traffic */
.live-traffic-lines span{
    position:relative;
    overflow:visible;
}

.live-traffic-lines .packet{
    position:absolute;
    left:-4px;
    top:-6px;
    width:8px;
    height:8px;
    border-radius:50%;
    background:#73c7ff;
    box-shadow:0 0 12px rgba(115,199,255,.95);
    animation:linkoCyberPacketDown 1.8s linear infinite;
}

.live-traffic-lines .p2{
    animation-delay:.55s;
}

.live-traffic-lines .p3{
    animation-delay:1.1s;
}


/* Vertical flow arrows used throughout cybersecurity.html */
.live-vertical-flow{
    position:relative;
    overflow:visible;
}

.live-vertical-flow .traffic-packet{
    position:absolute;
    left:50%;
    top:0;
    width:7px;
    height:7px;
    margin-left:-3.5px;
    border-radius:50%;
    background:#73c7ff;
    box-shadow:0 0 11px rgba(115,199,255,.9);
    pointer-events:none;
    animation:linkoCyberVerticalFlow 1.7s linear infinite;
}

.live-vertical-flow.safe-flow .traffic-packet{
    background:#55d88a;
    box-shadow:0 0 11px rgba(85,216,138,.85);
}

.live-vertical-flow.danger-flow{
    animation:linkoCyberDangerPulse 1.8s ease-in-out infinite;
}


/* MITM and protected-path moving traffic */
.live-wire{
    position:relative;
}

.live-wire > div{
    position:relative;
    overflow:hidden;
}

.live-wire > div::after{
    content:"";
    position:absolute;
    top:50%;
    left:-24%;
    width:24%;
    height:3px;
    transform:translateY(-50%);
    border-radius:999px;
    animation:linkoCyberWireSweep 1.9s linear infinite;
}

.danger-live-wire > div::after{
    background:linear-gradient(
        90deg,
        transparent,
        #ef6a6a,
        transparent
    );
    box-shadow:0 0 10px rgba(239,106,106,.55);
}

.secure-live-wire > div::after{
    background:linear-gradient(
        90deg,
        transparent,
        #55d88a,
        transparent
    );
    box-shadow:0 0 10px rgba(85,216,138,.5);
}


/* Sequential JS states already applied by cybersecurity.html */
.policy-checks > div.flow-active,
.inspection-grid > div.flow-active{
    border-color:#4faef0 !important;
    background:#10405c !important;
    box-shadow:
        0 0 0 1px rgba(79,174,240,.18),
        0 0 22px rgba(45,140,255,.14);
    transform:translateY(-2px);
}


/* Motion definitions */
@keyframes linkoCyberPacketDown{
    0%{
        top:-6px;
        opacity:0;
    }
    12%{
        opacity:1;
    }
    82%{
        opacity:1;
    }
    100%{
        top:34px;
        opacity:0;
    }
}

@keyframes linkoCyberVerticalFlow{
    0%{
        top:0;
        opacity:0;
        transform:translateY(-3px);
    }
    15%{
        opacity:1;
    }
    85%{
        opacity:1;
    }
    100%{
        top:100%;
        opacity:0;
        transform:translateY(3px);
    }
}

@keyframes linkoCyberWireSweep{
    from{
        left:-24%;
    }
    to{
        left:100%;
    }
}

@keyframes linkoCyberDangerPulse{
    0%,100%{
        opacity:.55;
    }
    50%{
        opacity:1;
    }
}


/* Mobile rendering */
@media(max-width:700px){

    .live-traffic-lines .packet,
    .live-vertical-flow .traffic-packet,
    .live-wire > div::after{
        animation-play-state:running;
        -webkit-animation-play-state:running;
        will-change:transform,opacity,top,left;
    }

    .live-vertical-flow{
        min-height:38px;
    }

    .mitm-path,
    .protected-path{
        overflow:visible;
    }
}


/*
 * Respect the user's OS accessibility setting.
 * If Reduce Motion is enabled on iPhone/Android,
 * motion intentionally stops.
 */
@media(prefers-reduced-motion:reduce){

    .live-traffic-lines .packet,
    .live-vertical-flow .traffic-packet,
    .live-wire > div::after,
    .danger-live-wire,
    .policy-checks > div,
    .inspection-grid > div{
        animation:none !important;
        transition:none !important;
    }
}
/* ===== HEADER NAVIGATION CLEANUP ===== */

.site-header .nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.site-header nav {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 18px;
    margin-left: auto;
}

.site-header nav a {
    margin: 0;
    white-space: nowrap;
}

/* Client Portal */
.site-header nav .client-portal {
    padding: 9px 14px;
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 7px;
}

/* Keep support button compact */
.site-header nav .btn.small {
    padding: 10px 16px;
    white-space: nowrap;
}

/* Slightly tighter navigation on laptops */
@media (max-width: 1200px) {
    .site-header nav {
        gap: 12px;
    }

    .site-header nav a {
        font-size: 14px;
    }
}
/* =========================================
   MOBILE STICKY HEADER
   Keep logo + hamburger visible while scrolling
========================================= */

@media (max-width: 950px) {

    .site-header {
        position: sticky !important;
        top: 0;
        left: 0;
        right: 0;
        z-index: 10000;
        overflow: visible;
        width: 100%;
        background: rgba(6, 29, 45, 0.98);
        -webkit-backdrop-filter: blur(12px);
        backdrop-filter: blur(12px);
    }

    .site-header .nav {
        position: relative;
        z-index: 10001;
        overflow: visible;
    }

    .site-header .brand,
    .site-header .menu {
        position: relative;
        z-index: 10002;
    }

    .site-header nav {
        z-index: 10001;
    }
}
/* =========================================
   LINKO GLOBAL COPYRIGHT BAR
========================================= */

.linko-global-copyright{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:9000;

    padding:8px 15px;

    background:#03141f;
    border-top:1px solid rgba(255,255,255,.08);

    color:#8fa5b3;

    font-size:11px;
    line-height:1.4;
    text-align:center;

    box-shadow:0 -4px 18px rgba(0,0,0,.12);
}

/* Prevent page content from being hidden behind bar */
body{
    padding-bottom:34px;
}

@media(max-width:600px){

    .linko-global-copyright{
        padding:7px 10px;
        font-size:9px;
    }

    body{
        padding-bottom:31px;
    }
}