
    :root{
        --bg:#ffffff;
        --text:#111111;
        --primary:#0057b8;
        --secondary:#f4f4f4;
        --card:#ffffff;
        --border:#dcdcdc;
        --font-size:16px;
    }

    body.dark-theme{
        --bg:#121212;
        --text:#f5f5f5;
        --primary:#4ea1ff;
        --secondary:#1e1e1e;
        --card:#252525;
        --border:#444;
    }

    body.high-contrast{
        --bg:#000000;
        --text:#ffff00;
        --primary:#00ffff;
        --secondary:#000000;
        --card:#111111;
        --border:#ffff00;
    }

    *{
        margin:0;
        padding:0;
        box-sizing:border-box;
    }

    html{
        scroll-behavior:smooth;
    }

    body{
        font-family:Arial, Helvetica, sans-serif;
        background:var(--bg);
        color:var(--text);
        font-size:var(--font-size);
        line-height:1.6;
        transition:0.3s;
    }

    a{
        color:var(--primary);
    }

    img{
        max-width:100%;
    }

    /* Accessibility */
    .skip-link{
        position:absolute;
        left:-9999px;
        top:auto;
    }

    .skip-link:focus{
        left:20px;
        top:20px;
        background:#000;
        color:#fff;
        padding:10px;
        z-index:1000;
    }

    button:focus,
    a:focus{
        outline:3px solid orange;
        outline-offset:3px;
    }

    /* Header */
    header{
        background:var(--primary);
        color:white;
        padding:15px 30px;
        position:sticky;
        top:0;
        z-index:999;
    }

    .navbar{
        display:flex;
        align-items:center;
        justify-content:space-between;
        flex-wrap:wrap;
        gap:20px;
    }

    .logo{
        display:flex;
        align-items:center;
        gap:10px;
    }

    .logo img{
        width:60px;
        height:60px;
        object-fit:contain;
        border-radius:10px;
        background:white;
        padding:5px;
    }

    .logo h1{
        font-size:1.5rem;
    }

    nav ul{
        display:flex;
        list-style:none;
        gap:20px;
        flex-wrap:wrap;
    }

    nav a{
        color:white;
        text-decoration:none;
        font-weight:bold;
    }

    /* Accessibility Buttons */
    .accessibility-bar{
        display:flex;
        justify-content:center;
        gap:10px;
        padding:15px;
        background:var(--secondary);
        flex-wrap:wrap;
    }

    .accessibility-bar button{
        padding:10px 15px;
        border:none;
        border-radius:8px;
        cursor:pointer;
        background:var(--primary);
        color:white;
        font-weight:bold;
    }

    /* Sections */
    section{
        padding:70px 20px;
        max-width:1200px;
        margin:auto;
    }

    h2{
        text-align:center;
        margin-bottom:40px;
        font-size:2rem;
    }

    /* Pricing */
    .pricing-grid{
        display:grid;
        grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
        gap:25px;
    }

    .pricing-card{
        background:var(--card);
        border:2px solid var(--border);
        border-radius:15px;
        padding:30px;
        text-align:center;
        transition:0.3s;
    }

    .pricing-card:hover{
        transform:translateY(-5px);
    }

    .pricing-card h3{
        margin-bottom:15px;
        font-size:1.8rem;
    }

    .price{
        font-size:2rem;
        color:var(--primary);
        margin-bottom:20px;
        font-weight:bold;
    }

    .pricing-card ul{
        list-style:none;
        margin-bottom:20px;
    }

    .pricing-card li{
        padding:8px 0;
    }

    .pricing-card button{
        padding:12px 20px;
        border:none;
        border-radius:8px;
        background:var(--primary);
        color:white;
        cursor:pointer;
        font-weight:bold;
    }

    /* QOS */
    .accordion{
        display:flex;
        flex-direction:column;
        gap:15px;
    }

    .accordion-item{
        border:2px solid var(--border);
        border-radius:10px;
        overflow:hidden;
        background:var(--card);
    }

    .accordion-header{
        width:100%;
        background:var(--secondary);
        border:none;
        padding:18px;
        text-align:left;
        font-size:1.1rem;
        font-weight:bold;
        cursor:pointer;
        display:flex;
        justify-content:space-between;
        align-items:center;
        color:var(--text);
    }

    .accordion-content{
        display:none;
        padding:20px;
        border-top:1px solid var(--border);
    }

    .accordion-content a{
        font-weight:bold;
    }

    .accordion-item.active .accordion-content{
        display:block;
    }

    /* Footer */
    .footer{
        background:var(--primary);
        color:white;
        padding:40px 20px;
    }

    .footer-content{
        max-width:1200px;
        margin:auto;
        display:grid;
        grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
        gap:30px;
        align-items:center;
    }

    .footer-logo{
        display:flex;
        align-items:center;
        gap:15px;
    }

    .footer-logo img{
        width:70px;
        background:white;
        border-radius:10px;
        padding:5px;
    }

    .contact-info p{
        margin-bottom:10px;
    }

    /* Responsive */
    @media(max-width:768px){

        .navbar{
            flex-direction:column;
            text-align:center;
        }

        nav ul{
            justify-content:center;
        }

        .logo{
            justify-content:center;
        }
    }