/* Virtual Network Pvt. Ltd. — Custom CSS v3.0 */

:root {
    --vn-primary:      #4B2FBF;
    --vn-primary-dark: #3621A0;
    --vn-dark:         #1A1A2E;
    --vn-text:         #2d3748;
}

body { font-family:'Segoe UI',system-ui,-apple-system,sans-serif; color:var(--vn-text); }

/* Brand button */
.btn-vn-primary {
    background-color: var(--vn-primary);
    border-color:     var(--vn-primary);
    color:            #fff;
    transition: background .2s, transform .15s;
}
.btn-vn-primary:hover, .btn-vn-primary:focus {
    background-color: var(--vn-primary-dark);
    border-color:     var(--vn-primary-dark);
    color:            #fff;
    transform: translateY(-1px);
}
.bg-vn-primary { background-color: var(--vn-primary) !important; }

/* Navbar */
.navbar { border-bottom: 1px solid #f0f0f0; z-index:1030; }
.nav-link { font-size:.9rem; color:var(--vn-text) !important; padding:.5rem .85rem !important; border-radius:6px; transition:background .2s; }
.nav-link:hover, .nav-link.active { background:rgba(75,47,191,.08); color:var(--vn-primary) !important; }

/* Hero */
.hero-section { background:linear-gradient(135deg,#f8f7ff 0%,#eef2ff 100%); padding:5rem 0 4rem; }
.hero-title    { font-size:clamp(2rem,5vw,3.5rem); font-weight:800; line-height:1.15; color:var(--vn-dark); }
.hero-title em { font-style:italic; color:var(--vn-primary); }
.hero-badge    {
    display:inline-flex; align-items:center;
    background:rgba(75,47,191,.1); color:var(--vn-primary);
    font-size:.8rem; font-weight:600; padding:.3rem .9rem; border-radius:50px;
}

/* Network pulse dot */
.network-status {
    display:inline-block; width:8px; height:8px;
    border-radius:50%; background:#16a34a;
    animation:pulse-green 2s infinite;
}
@keyframes pulse-green { 0%,100%{opacity:1} 50%{opacity:.3} }

/* Stats bar */
.stats-bar { background:var(--vn-primary); color:#fff; padding:2.5rem 0; }
.stat-item .stat-number { font-size:2rem; font-weight:800; display:block; }
.stat-item .stat-label  { font-size:.82rem; opacity:.85; }

/* Section label */
.section-label { font-size:.75rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--vn-primary); display:block; margin-bottom:.4rem; }

/* Feature cards */
.feature-card { border:1px solid #eef0f5; border-radius:14px; padding:1.75rem; transition:box-shadow .25s,transform .25s; background:#fff; height:100%; }
.feature-card:hover { box-shadow:0 8px 32px rgba(75,47,191,.1); transform:translateY(-3px); }
.feature-icon { width:52px; height:52px; border-radius:12px; background:rgba(75,47,191,.1); display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin-bottom:1rem; }

/* Plan cards */
.plan-card { border:2px solid #eef0f5; border-radius:16px; padding:2rem; transition:border-color .2s,box-shadow .2s; background:#fff; }
.plan-card.featured { border-color:var(--vn-primary); box-shadow:0 0 0 4px rgba(75,47,191,.08); }
.plan-price { font-size:2.2rem; font-weight:800; color:var(--vn-dark); }

/* Forms */
.form-control:focus, .form-select:focus { border-color:var(--vn-primary); box-shadow:0 0 0 .2rem rgba(75,47,191,.18); }

/* Responsive */
@media(max-width:991.98px){
    .navbar-collapse { padding:1rem 0; border-top:1px solid #f0f0f0; margin-top:.5rem; }
    .nav-item .btn   { width:100%; text-align:center; margin-top:.5rem; }
    .hero-section    { padding:3rem 0 2.5rem; }
}