* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    background: #090000;
}

/* =========================
   MAIN HEADER
========================= */

.vj-header {
    width: 100%;
    background:
        radial-gradient(circle at top right, rgba(255, 176, 20, 0.12), transparent 35%),
        linear-gradient(180deg, #090000, #120004);
    color: #fff;
    position: relative;
    z-index: 100;
}

/* =========================
   TOP HEADER
========================= */

.vj-top-header {
    width: 100%;
    min-height: 122px;
    padding: 8px 65px 12px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
}

/* Brand */
.vj-brand {
    display: flex;
    align-items: center;
    gap: 15px;
}

.vj-logo-link {
    display: inline-flex;
    text-decoration: none;
}

.vj-brand img {
    width: 92px;
    height: 92px;
    border-radius: 50%;
    object-fit: cover;
    background: #fff;
    padding: 3px;

    box-shadow:
        0 0 0 2px #ffbd19,
        0 0 20px rgba(255, 181, 0, 0.65),
        0 12px 25px rgba(0, 0, 0, 0.65);
}

.vj-brand-text h1 {
    margin: 0;
    font-size: 32px;
    line-height: 1.08;
    font-weight: 900;
    letter-spacing: 1px;
    color: #fff;
}

.vj-brand-text h1 span {
    color: #ffc21a;
}

.vj-brand-text p {
    margin: 8px 0 0;
    color: #ffd45a;
    font-size: 17px;
    font-weight: 700;
}

/* Contact Info */
.vj-contact-info {
    display: flex;
    align-items: center;
    gap: 24px;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    flex-wrap: wrap;
}

.vj-contact-info span {
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.vj-contact-info i {
    color: #ffc21a;
    font-size: 18px;
    text-shadow:
        0 0 8px rgba(255, 194, 26, 0.9),
        0 0 14px rgba(255, 140, 0, 0.8);
}

/* =========================
   AUTH BUTTONS
========================= */

.vj-auth-buttons {
    display: flex;
    align-items: center;
    gap: 14px;
}

.vj-auth-buttons a {
    text-decoration: none;
    transition: 0.35s ease;
    white-space: nowrap;
}

/* Login Button */
.vj-login {
    color: #fff;
    font-weight: 800;
    border-radius: 8px;
    padding: 12px 22px;
    border: 1px solid #ffbd18;

    display: inline-flex;
    align-items: center;
    gap: 7px;

    background:
        linear-gradient(145deg, #4b000b, #230004);

    box-shadow:
        inset 2px 2px 5px rgba(255,255,255,0.10),
        inset -4px -4px 8px rgba(0,0,0,0.50),
        0 0 15px rgba(255, 180, 0, 0.35);
}

/* Register Button */
.vj-register {
    color: #120000;
    font-weight: 900;
    border-radius: 8px;
    padding: 12px 22px;

    display: inline-flex;
    align-items: center;
    gap: 7px;

    background:
        linear-gradient(145deg, #ffc21a, #ff8a00);

    box-shadow:
        inset 2px 2px 6px rgba(255,255,255,0.45),
        inset -5px -5px 10px rgba(124, 51, 0, 0.40),
        0 0 22px rgba(255, 171, 0, 0.65);
}

.vj-login i {
    color: #fff;
}

.vj-register i {
    color: #2a0000;
}

.vj-login:hover,
.vj-register:hover {
    transform: translateY(-5px) scale(1.05);
}

/* Notification Bell */
.vj-notification-btn {
    width: 47px;
    height: 47px;
    position: relative;

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

    font-size: 21px;
    border-radius: 50%;
    color: #ffc21a;
    border: 1px solid #ffbd18;

    background:
        linear-gradient(145deg, #4b000b, #230004);

    box-shadow:
        inset 2px 2px 5px rgba(255,255,255,0.12),
        inset -4px -4px 8px rgba(0,0,0,0.55),
        0 0 18px rgba(255, 180, 0, 0.45);

    animation: vjBellPulse 2.5s infinite;
}

.vj-notification-btn i {
    text-shadow:
        0 0 8px rgba(255, 194, 26, 0.95),
        0 0 16px rgba(255, 149, 0, 0.85);
}

.vj-notification-btn:hover {
    transform: translateY(-5px) scale(1.08);
    background:
        linear-gradient(145deg, #7c0015, #310005);
}

@keyframes vjBellPulse {
    0%, 100% {
        box-shadow:
            inset 2px 2px 5px rgba(255,255,255,0.12),
            inset -4px -4px 8px rgba(0,0,0,0.55),
            0 0 12px rgba(255, 180, 0, 0.35);
    }

    50% {
        box-shadow:
            inset 2px 2px 5px rgba(255,255,255,0.15),
            inset -4px -4px 8px rgba(0,0,0,0.55),
            0 0 26px rgba(255, 180, 0, 0.85);
    }
}

/* Notification Badge */
.vj-notification-badge {
    position: absolute;
    top: -7px;
    right: -7px;

    min-width: 21px;
    height: 21px;
    padding: 0 5px;

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

    border-radius: 50%;
    font-size: 11px;
    font-weight: 900;

    color: #fff;
    background:
        linear-gradient(145deg, #ff0000, #9b0000);

    border: 2px solid #ffbd18;

    box-shadow:
        0 0 12px rgba(255, 0, 0, 0.8),
        0 5px 10px rgba(0,0,0,0.45);
}

/* User Profile */
.vj-user-profile {
    height: 48px;
    padding: 6px 16px 6px 7px;

    display: flex;
    align-items: center;
    gap: 10px;

    color: #fff;
    font-weight: 800;
    border-radius: 30px;
    border: 1px solid #ffbd18;

    background:
        linear-gradient(145deg, #5c0010, #250004);

    box-shadow:
        inset 2px 2px 6px rgba(255,255,255,0.13),
        inset -5px -5px 10px rgba(0,0,0,0.55),
        0 0 18px rgba(255, 180, 0, 0.35);

    max-width: 190px;
}

.vj-user-profile img {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    object-fit: cover;

    background: #fff;
    border: 2px solid #ffbd18;

    box-shadow:
        0 0 10px rgba(255, 190, 20, 0.75);
}

.vj-user-profile span {
    display: inline-block;
    max-width: 110px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.vj-user-profile:hover {
    transform: translateY(-5px) scale(1.04);
    background:
        linear-gradient(145deg, #8b001a, #360006);
}

/* Logout */
.vj-logout {
    font-weight: 900;
    border-radius: 8px;
    padding: 12px 20px;

    color: #fff;
    border: 1px solid #ffbd18;

    display: inline-flex;
    align-items: center;
    gap: 7px;

    background:
        linear-gradient(145deg, #7a0000, #330000);

    box-shadow:
        inset 2px 2px 5px rgba(255,255,255,0.12),
        inset -4px -4px 8px rgba(0,0,0,0.55),
        0 0 18px rgba(255, 70, 20, 0.45);
}

.vj-logout i {
    color: #ffc21a;
}

.vj-logout:hover {
    transform: translateY(-5px) scale(1.05);
    background:
        linear-gradient(145deg, #b30000, #4d0000);
}

/* =========================
   3D NAVBAR
========================= */

.vj-navbar {
    width: calc(100% - 20px);
    margin: 0 auto;
    min-height: 98px;
    border-radius: 36px;
    position: relative;

    background:
        linear-gradient(145deg, #9b001f 0%, #650015 28%, #470008 62%, #250003 100%);

    border: 2px solid #ffbd18;

    box-shadow:
        0 0 20px rgba(255, 190, 20, 0.75),
        0 18px 35px rgba(0, 0, 0, 0.72),
        inset 0 3px 7px rgba(255, 215, 70, 0.22),
        inset 0 -9px 18px rgba(0, 0, 0, 0.48);

    transform-style: preserve-3d;
    animation: vjNavbarFloat 4s ease-in-out infinite;
    overflow: hidden;
}

@keyframes vjNavbarFloat {
    0%, 100% {
        transform: perspective(1000px) rotateX(0deg) translateY(0);
    }

    50% {
        transform: perspective(1000px) rotateX(1.6deg) translateY(-4px);
    }
}

/* Navbar Shine */
.vj-navbar::before {
    content: "";
    position: absolute;
    top: 0;
    left: -120%;
    width: 70%;
    height: 100%;

    background:
        linear-gradient(
            110deg,
            transparent,
            rgba(255, 205, 70, 0.18),
            transparent
        );

    animation: vjShine 5s linear infinite;
    pointer-events: none;
}

@keyframes vjShine {
    0% {
        left: -120%;
    }

    45%, 100% {
        left: 130%;
    }
}

/* Menu */
.vj-menu {
    margin: 0;
    padding: 0;
    min-height: 98px;
    list-style: none;

    display: grid;
    grid-template-columns: repeat(10, minmax(0, 1fr));

    position: relative;
    z-index: 2;
}

.vj-menu li {
    position: relative;
}

.vj-menu li:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 12px;

    width: 1px;
    height: 74px;

    background:
        rgba(255,255,255,0.22);
}

.vj-menu li a {
    height: 98px;
    padding: 12px 4px;

    text-decoration: none;
    color: #fff;

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

    font-size: 14px;
    font-weight: 900;
    text-shadow:
        0 3px 4px rgba(0,0,0,0.85);

    transition: 0.35s ease;
    position: relative;
    overflow: hidden;
}

/* Golden Font Awesome Menu Icons */
.vj-menu li a i {
    font-size: 28px;
    line-height: 1;
    margin-bottom: 8px;

    color: #ffc21a;

    text-shadow:
        0 0 6px rgba(255, 194, 26, 0.95),
        0 0 14px rgba(255, 149, 0, 0.85),
        0 5px 6px rgba(0, 0, 0, 0.75);

    filter:
        drop-shadow(0 0 5px rgba(255, 190, 20, 0.95))
        drop-shadow(0 0 12px rgba(255, 130, 0, 0.75));

    transition: 0.45s ease;
}

.vj-menu li a span {
    display: block;
}

/* Active and Hover */
.vj-menu li a:hover,
.vj-menu li a.active {
    background:
        linear-gradient(145deg, #e69a18, #b75d0d 50%, #8d2d05);

    color: #fff;

    transform:
        translateY(-7px)
        scale(1.04);

    box-shadow:
        inset 2px 2px 8px rgba(255, 255, 255, 0.35),
        inset -6px -6px 14px rgba(70, 10, 0, 0.55),
        0 15px 28px rgba(0,0,0,0.55),
        0 0 25px rgba(255, 186, 25, 0.75);
}

.vj-menu li a:hover i,
.vj-menu li a.active i {
    color: #fff3a3;

    transform:
        translateY(-4px)
        scale(1.22)
        rotateY(360deg);

    text-shadow:
        0 0 8px rgba(255, 255, 180, 1),
        0 0 18px rgba(255, 194, 26, 1),
        0 0 28px rgba(255, 120, 0, 0.95);

    filter:
        drop-shadow(0 0 8px rgba(255, 236, 120, 1))
        drop-shadow(0 0 18px rgba(255, 149, 0, 0.9));
}

/* Bottom Glow */
.vj-menu li a::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 9px;

    width: 0;
    height: 4px;

    border-radius: 20px;

    background:
        linear-gradient(90deg, #fff2a5, #ffbd18, #ff7a00);

    transform:
        translateX(-50%);

    transition: 0.35s;

    box-shadow:
        0 0 14px rgba(255, 190, 24, 0.9);
}

.vj-menu li a:hover::after,
.vj-menu li a.active::after {
    width: 55%;
}

/* =========================
   MOBILE MENU
========================= */

#vj-menu-toggle {
    display: none;
}

.vj-menu-icon {
    display: none;

    width: 46px;
    height: 38px;

    cursor: pointer;
    flex-direction: column;
    justify-content: space-between;

    margin: 22px;

    position: relative;
    z-index: 5;
}

.vj-menu-icon span {
    width: 100%;
    height: 5px;

    border-radius: 20px;

    background:
        #ffc21a;

    box-shadow:
        0 0 12px rgba(255, 194, 26, 0.9);
}

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

@media (max-width: 1200px) {

    .vj-top-header {
        padding: 10px 25px;
        flex-wrap: wrap;
    }

    .vj-contact-info {
        justify-content: center;
        gap: 14px;
    }

    .vj-menu li a {
        font-size: 12px;
    }

    .vj-menu li a i {
        font-size: 24px;
    }
}

@media (max-width: 900px) {

    .vj-top-header {
        flex-direction: column;
        text-align: center;
    }

    .vj-brand {
        flex-direction: column;
    }

    .vj-contact-info {
        flex-direction: column;
        gap: 8px;
    }

    .vj-auth-buttons {
        justify-content: center;
        flex-wrap: wrap;
    }

    .vj-user-profile {
        max-width: 220px;
    }

    .vj-user-profile span {
        max-width: 140px;
    }

    .vj-navbar {
        width: calc(100% - 20px);
        border-radius: 24px;
        overflow: visible;
    }

    .vj-menu-icon {
        display: flex;
    }

    .vj-menu {
        display: none;
        grid-template-columns: 1fr;
        min-height: auto;

        background:
            linear-gradient(145deg, #750017, #2b0005);

        border-radius: 0 0 24px 24px;
        overflow: hidden;
    }

    #vj-menu-toggle:checked ~ .vj-menu {
        display: grid;
    }

    .vj-menu li:not(:last-child)::after {
        display: none;
    }

    .vj-menu li a {
        height: 75px;
        flex-direction: row;
        gap: 12px;
        justify-content: flex-start;

        padding-left: 28px;

        border-top:
            1px solid rgba(255,255,255,0.12);
    }

    .vj-menu li a i {
        margin-bottom: 0;
    }

    .vj-menu li a:hover,
    .vj-menu li a.active {
        transform:
            translateX(8px)
            scale(1.02);
    }
}

@media (max-width: 480px) {

    .vj-brand-text h1 {
        font-size: 25px;
    }

    .vj-brand img {
        width: 78px;
        height: 78px;
    }

    .vj-auth-buttons a {
        font-size: 14px;
    }

    .vj-login,
    .vj-register,
    .vj-logout {
        padding: 10px 15px;
    }

    .vj-notification-btn {
        width: 42px;
        height: 42px;
        font-size: 19px;
    }

    .vj-user-profile {
        height: 44px;
        padding-right: 12px;
    }

    .vj-user-profile img {
        width: 32px;
        height: 32px;
    }
}


/* =========================================================
   INDEX THEME RESPONSIVE + BUTTON EFFECT UPDATE
   Color palette matched with index page style:
   Dark: #090000 / #120202 / #170006
   Maroon: #8a001d / #4d0015 / #25000a
   Gold: #ffbf22 / #ffc328 / #ff8a00
   Added by ChatGPT
========================================================= */

:root {
    --vjm-bg-dark: #090000;
    --vjm-bg-deep: #120202;
    --vjm-bg-card: #170006;
    --vjm-maroon: #8a001d;
    --vjm-maroon-dark: #4d0015;
    --vjm-gold: #ffbf22;
    --vjm-gold-2: #ffc328;
    --vjm-orange: #ff8a00;
    --vjm-cream: #fffaf3;
}

html,
body {
    max-width: 100%;
    overflow-x: hidden !important;
}

body {
    background-color: var(--vjm-bg-dark);
}

img,
video,
iframe {
    max-width: 100%;
    height: auto;
}

a {
    text-decoration: none;
}

table {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
}

input,
select,
textarea {
    max-width: 100%;
}

/* Header include should not be affected by old page navbar CSS */
.vj-header,
.vj-header * {
    box-sizing: border-box;
}

.vj-header .vj-navbar {
    display: block !important;
    width: calc(100% - 40px) !important;
    max-width: none !important;
    margin: 0 auto !important;
    padding: 0 !important;
    min-height: 98px !important;
    background:
        linear-gradient(145deg, var(--vjm-maroon) 0%, #650015 28%, #470008 62%, #250003 100%) !important;
    border: 2px solid var(--vjm-gold) !important;
}

.vj-header .vj-navbar .vj-menu {
    width: 100% !important;
    min-height: 98px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    display: grid !important;
    grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
    gap: 0 !important;
    background: transparent !important;
}

.vj-header .vj-navbar .vj-menu li {
    width: 100% !important;
    min-width: 0 !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.vj-header .vj-navbar .vj-menu li a {
    width: 100% !important;
    height: 98px !important;
    float: none !important;
    margin: 0 !important;
    padding: 12px 8px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    color: #fff !important;
    font-weight: 900 !important;
    word-break: normal !important;
}

.vj-header .vj-navbar .vj-menu li a i {
    color: var(--vjm-gold) !important;
    text-shadow:
        0 0 6px rgba(255, 191, 34, 0.95),
        0 0 14px rgba(255, 138, 0, 0.85) !important;
}

.vj-header .vj-navbar .vj-menu li a:hover,
.vj-header .vj-navbar .vj-menu li a.active {
    background: linear-gradient(145deg, var(--vjm-gold), var(--vjm-orange) 58%, #8a2d05) !important;
    color: #fff !important;
    box-shadow:
        inset 2px 2px 8px rgba(255,255,255,0.35),
        inset -6px -6px 14px rgba(70,10,0,0.55),
        0 0 25px rgba(255, 191, 34, 0.75) !important;
}

/* Header effect for all page buttons */
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.submit-btn,
.gold-btn,
.reset-btn,
.primary-btn,
.secondary-btn,
.search-btn,
.entry-btn,
.top-btn,
.dark-btn,
.view-btn,
.book-btn,
.pay-btn,
.register-btn,
.login-btn,
.btn,
.card button,
.plan-card a,
.plan-card button,
.contact-form button,
.pay-form button,
.enquiry-card button,
.register-card button,
.login-card button,
.left-sidebar button,
.left-filter button,
.sidebar button,
a.button,
a.btn {
    border-radius: 10px !important;
    border: 1px solid var(--vjm-gold) !important;
    background: linear-gradient(145deg, var(--vjm-gold), var(--vjm-orange)) !important;
    color: #1c0000 !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    box-shadow:
        inset 2px 2px 6px rgba(255,255,255,0.45),
        inset -5px -5px 10px rgba(124, 51, 0, 0.40),
        0 0 18px rgba(255, 191, 34, 0.55),
        0 10px 22px rgba(0, 0, 0, 0.35) !important;
    transition: transform 0.30s ease, box-shadow 0.30s ease, background 0.30s ease !important;
}

button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
.submit-btn:hover,
.gold-btn:hover,
.reset-btn:hover,
.primary-btn:hover,
.secondary-btn:hover,
.search-btn:hover,
.entry-btn:hover,
.top-btn:hover,
.dark-btn:hover,
.view-btn:hover,
.book-btn:hover,
.pay-btn:hover,
.register-btn:hover,
.login-btn:hover,
.btn:hover,
.card button:hover,
.plan-card a:hover,
.plan-card button:hover,
.contact-form button:hover,
.pay-form button:hover,
.enquiry-card button:hover,
.register-card button:hover,
.login-card button:hover,
.left-sidebar button:hover,
.left-filter button:hover,
.sidebar button:hover,
a.button:hover,
a.btn:hover {
    transform: translateY(-4px) scale(1.03) !important;
    background: linear-gradient(145deg, #ffe27a, var(--vjm-gold) 48%, #b65d10) !important;
    color: #210004 !important;
    box-shadow:
        inset 2px 2px 8px rgba(255,255,255,0.55),
        inset -6px -6px 14px rgba(70, 10, 0, 0.45),
        0 0 26px rgba(255, 191, 34, 0.85),
        0 14px 28px rgba(0,0,0,0.45) !important;
}

/* Page cards/boxes index-theme border and fit */
.page-box,
.contact-card,
.box,
.share-box,
.sidebar,
.right-sidebar,
.left-sidebar,
.left-filter,
.pay-card,
.pay-summary,
.plan-card,
.register-card,
.login-card,
.enquiry-card,
.status-card,
.temple-card,
.card {
    max-width: 100%;
    border-color: rgba(255, 191, 34, 0.55) !important;
}

/* Common content fit */
.page-wrapper,
.page-box,
.payment-page,
.contact-section,
.ebook-layout,
.main-layout,
.matri-layout,
.dashboard,
.layout,
.cards,
.stats,
.register-page,
.login-page,
.plan-page,
.viewer-wrapper,
.enquiry-page,
.about-page,
.page {
    max-width: 100% !important;
}

/* Desktop wrapping fixes */
.cards,
.stats,
.temples-grid,
.contact-section,
.plans {
    width: 100%;
}

@media (max-width: 1200px) {
    .cards,
    .stats,
    .temples-grid,
    .contact-section,
    .plans {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .ebook-layout,
    .main-layout,
    .matri-layout,
    .dashboard,
    .layout,
    .payment-box {
        grid-template-columns: 1fr !important;
    }

    .left-sidebar,
    .right-sidebar,
    .left-filter,
    .sidebar,
    .right-panel,
    .main-content,
    .center-content {
        width: 100% !important;
        max-width: 100% !important;
    }
}

@media (max-width: 900px) {
    body {
        overflow-x: hidden !important;
    }

    .vj-header .vj-navbar {
        width: calc(100% - 20px) !important;
        min-height: auto !important;
        overflow: visible !important;
    }

    .vj-header .vj-navbar .vj-menu {
        display: none !important;
        grid-template-columns: 1fr !important;
        min-height: auto !important;
    }

    .vj-header .vj-navbar #vj-menu-toggle:checked ~ .vj-menu {
        display: grid !important;
    }

    .vj-header .vj-navbar .vj-menu li a {
        height: 75px !important;
        flex-direction: row !important;
        justify-content: flex-start !important;
        text-align: left !important;
        gap: 12px !important;
        padding-left: 28px !important;
    }

    .top-header,
    .header,
    .top,
    .vj-top-header {
        flex-direction: column !important;
        text-align: center !important;
        align-items: center !important;
        gap: 14px !important;
    }

    .contact,
    .top-info,
    .header-info,
    .vj-contact-info {
        flex-direction: column !important;
        justify-content: center !important;
        gap: 8px !important;
    }

    .register-page,
    .login-page,
    .page,
    .about-page,
    .enquiry-page,
    .payment-box {
        display: grid !important;
        grid-template-columns: 1fr !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
        gap: 18px !important;
    }

    .left-panel,
    .right-panel,
    .left-box,
    .login-card,
    .register-card,
    .enquiry-card {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
    }

    .cards,
    .stats,
    .temples-grid,
    .contact-section,
    .plans {
        grid-template-columns: 1fr !important;
    }

    button,
    input[type="submit"],
    input[type="button"],
    input[type="reset"],
    .submit-btn,
    .gold-btn,
    .reset-btn,
    .primary-btn,
    .secondary-btn,
    .search-btn,
    .entry-btn,
    .top-btn,
    .dark-btn,
    .view-btn,
    .book-btn,
    .pay-btn,
    .register-btn,
    .login-btn,
    .btn,
    .card button,
    .plan-card a,
    .plan-card button {
        width: 100% !important;
        justify-content: center !important;
        text-align: center !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

@media (max-width: 520px) {
    .vj-header .vj-brand-text h1,
    .logo-box h1,
    .brand h1,
    .logo h1,
    .left-box h1,
    .left-panel h1 {
        font-size: 24px !important;
        line-height: 1.15 !important;
    }

    .vj-header .vj-brand img,
    .logo-box img,
    .brand img,
    .logo img,
    .main-logo {
        width: 72px !important;
        height: 72px !important;
    }

    .page-title h1,
    .page-title h2,
    .hero-title h1,
    .contact-hero h1,
    .register-card h2,
    .login-card h2 {
        font-size: 28px !important;
    }

    .page-box,
    .contact-card,
    .box,
    .share-box,
    .register-card,
    .login-card,
    .enquiry-card,
    .plan-card,
    .payment-page,
    .pay-card,
    .pay-summary {
        padding: 16px !important;
    }
}


/* LIVE HOSTING HEADER FORCE FIX */

/* LIVE HOSTING HEADER FORCE FIX - protects header from page CSS */
html body .vj-header{
    width:100%!important;
    max-width:100%!important;
    min-height:auto!important;
    display:block!important;
    background:radial-gradient(circle at top right,rgba(255,176,20,.12),transparent 35%),linear-gradient(180deg,#090000,#120004)!important;
    color:#fff!important;
    position:relative!important;
    z-index:99999!important;
    overflow:visible!important;
    margin:0!important;
    padding:0!important;
}
html body .vj-header *{
    box-sizing:border-box!important;
}
html body .vj-header .vj-top-header{
    width:100%!important;
    min-height:122px!important;
    padding:8px 65px 12px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:25px!important;
    background:transparent!important;
    float:none!important;
    clear:both!important;
}
html body .vj-header .vj-brand{
    display:flex!important;
    align-items:center!important;
    gap:15px!important;
    width:auto!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
    float:none!important;
}
html body .vj-header .vj-logo-link{
    width:92px!important;
    height:92px!important;
    min-width:92px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
    border-radius:50%!important;
    text-decoration:none!important;
}
html body .vj-header .vj-brand img,
html body .vj-header a.vj-logo-link img{
    width:92px!important;
    height:92px!important;
    max-width:92px!important;
    max-height:92px!important;
    min-width:92px!important;
    min-height:92px!important;
    object-fit:cover!important;
    display:block!important;
    border-radius:50%!important;
    background:#fff!important;
    padding:3px!important;
    margin:0!important;
    position:static!important;
    transform:none!important;
}
html body .vj-header .vj-brand-text{
    display:block!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    float:none!important;
}
html body .vj-header .vj-brand-text h1{
    margin:0!important;
    font-size:32px!important;
    line-height:1.08!important;
    font-weight:900!important;
    letter-spacing:1px!important;
    color:#fff!important;
    text-align:left!important;
}
html body .vj-header .vj-brand-text h1 span{color:#ffc21a!important;}
html body .vj-header .vj-brand-text p{
    margin:8px 0 0!important;
    color:#ffd45a!important;
    font-size:17px!important;
    font-weight:700!important;
    text-align:left!important;
}
html body .vj-header .vj-contact-info{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex-wrap:wrap!important;
    gap:24px!important;
    width:auto!important;
    margin:0!important;
    padding:0!important;
    font-size:16px!important;
}
html body .vj-header .vj-auth-buttons{
    display:flex!important;
    align-items:center!important;
    gap:14px!important;
    width:auto!important;
    margin:0!important;
    padding:0!important;
}
html body .vj-header .vj-navbar{
    display:block!important;
    width:calc(100% - 20px)!important;
    max-width:none!important;
    min-height:98px!important;
    margin:0 auto!important;
    padding:0!important;
    border-radius:36px!important;
    position:relative!important;
    z-index:99999!important;
    overflow:visible!important;
    background:linear-gradient(145deg,#9b001f 0%,#650015 28%,#470008 62%,#250003 100%)!important;
    border:2px solid #ffbd18!important;
    float:none!important;
    clear:both!important;
}
html body .vj-header .vj-menu{
    width:100%!important;
    min-height:98px!important;
    list-style:none!important;
    margin:0!important;
    padding:0!important;
    display:grid!important;
    grid-template-columns:repeat(10,minmax(0,1fr))!important;
    gap:0!important;
    background:transparent!important;
    position:relative!important;
    z-index:2!important;
}
html body .vj-header .vj-menu>li{
    width:100%!important;
    min-width:0!important;
    list-style:none!important;
    margin:0!important;
    padding:0!important;
    display:block!important;
    position:relative!important;
}
html body .vj-header .vj-menu>li>a{
    width:100%!important;
    height:98px!important;
    margin:0!important;
    padding:12px 4px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    text-align:center!important;
    color:#fff!important;
    text-decoration:none!important;
    font-size:13px!important;
    font-weight:900!important;
    line-height:1.2!important;
    float:none!important;
    position:relative!important;
    overflow:hidden!important;
}
html body .vj-header .vj-menu>li>a i{
    color:#ffc21a!important;
    font-size:28px!important;
    margin:0 0 8px!important;
}
html body .vj-header .vj-menu>li>a span{
    display:block!important;
    color:inherit!important;
}
@media(max-width:900px){
    html body .vj-header .vj-top-header{
        flex-direction:column!important;
        text-align:center!important;
        padding:10px 16px!important;
    }
    html body .vj-header .vj-brand{flex-direction:column!important;}
    html body .vj-header .vj-brand-text h1,
    html body .vj-header .vj-brand-text p{text-align:center!important;}
    html body .vj-header .vj-menu{
        display:none!important;
        grid-template-columns:1fr!important;
        min-height:auto!important;
    }
    html body .vj-header #vj-menu-toggle:checked~.vj-menu{display:grid!important;}
    html body .vj-header .vj-menu>li>a{
        height:75px!important;
        flex-direction:row!important;
        justify-content:flex-start!important;
        padding-left:28px!important;
        text-align:left!important;
    }
    html body .vj-header .vj-menu>li>a i{margin:0!important;}
}


/* ===== VJM 10-item desktop navbar: Home ... Contact Us in one row ===== */
@media (min-width: 901px) {
    .vj-navbar {
        width: calc(100% - 12px) !important;
        margin-left: 6px !important;
        margin-right: 6px !important;
        min-height: 92px !important;
        border-radius: 28px !important;
        overflow: visible !important;
    }
    .vj-menu {
        display: grid !important;
        grid-template-columns: repeat(10, minmax(0, 1fr)) !important;
        grid-auto-flow: row !important;
        width: 100% !important;
        min-height: 92px !important;
        flex-wrap: nowrap !important;
    }
    .vj-menu > li {
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .vj-menu > li > a {
        height: 92px !important;
        min-width: 0 !important;
        padding: 9px 3px !important;
        font-size: 12px !important;
        line-height: 1.15 !important;
        white-space: nowrap !important;
    }
    .vj-menu > li > a > span {
        white-space: nowrap !important;
        overflow: visible !important;
    }
    .vj-menu > li > a > i {
        font-size: 25px !important;
        margin-bottom: 7px !important;
    }
    .vj-menu li:not(:last-child)::after {
        height: 66px !important;
        top: 13px !important;
    }
}


/* ===== FINAL PRATIBHA DESKTOP NAVBAR ONE-LINE FIX ===== */
@media (min-width: 901px) {
 html body .vj-header .vj-navbar { width: calc(100% - 12px) !important; margin: 0 6px !important; min-height: 92px !important; }
 html body .vj-header .vj-menu { display:grid !important; grid-template-columns:repeat(10,minmax(0,1fr)) !important; width:100% !important; min-height:92px !important; }
 html body .vj-header .vj-menu > li > a { height:92px !important; padding:8px 2px !important; font-size:12px !important; line-height:1.1 !important; white-space:nowrap !important; }
 html body .vj-header .vj-menu > li > a i { font-size:24px !important; margin-bottom:6px !important; }
 html body .vj-header .vj-menu > li > a span { white-space:nowrap !important; }
}
