body{
    font-family: "Poppins", sans-serif;
    background:#f8f9fa;
    color:#222;
}

.hero-section{
    background:linear-gradient(135deg,#0d6efd,#0a3d91);
    color:white;
}

.hero-section h1{
    line-height:1.2;
}

.card{
    transition:.3s;
    border-radius:18px;
}

.card:hover{
    transform:translateY(-10px);
    box-shadow:0 20px 40px rgba(0,0,0,.15);
}

.btn{
    border-radius:30px;
}

.section-title{
    font-size:40px;
    font-weight:700;
}

.team-photo{
    width:180px;
    height:180px;
    object-fit:cover;
    border-radius:50%;
    border:5px solid white;
    box-shadow:0 10px 30px rgba(0,0,0,.15);
}

.counter{
    font-size:55px;
    font-weight:700;
}

footer{
    background:#111;
    color:white;
}

footer a{
    color:white;
    text-decoration:none;
}

footer a:hover{
    color:#0d6efd;
}

.navbar{
    box-shadow:0 3px 15px rgba(0,0,0,.1);
}

.fade-up{
    animation:fadeUp .9s ease;
}

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

footer a{

    transition:.3s;

}

footer a:hover{

    color:#0d6efd !important;

}

footer ul li{

    margin-bottom:10px;

}

footer i{

    margin-right:6px;

}

.navbar{

    transition:0.3s;

}

.navbar-brand{

    font-size:1.5rem;

    letter-spacing:1px;

}

.nav-link{

    margin-left:12px;

    transition:.3s;

    font-weight:500;

}

.nav-link:hover{

    color:#0d6efd !important;

}

.navbar .btn{

    border-radius:8px;

}

/* ===========================
   Hero Section
=========================== */
.hero-section{

    background:

        linear-gradient(

            rgba(0,0,0,.65),

            rgba(0,0,0,.65)

        ),

        url("../images/hero/research.d1600565a6e0.png");

    background-size:cover;

    background-position:center;

    background-repeat:no-repeat;

}




.hero-section{

    min-height:85vh;

    display:flex;

    align-items:center;

}

.hero-section h1{

    line-height:1.2;

}

.hero-section .badge{

    font-size:0.95rem;

    padding:10px 18px;

}

.hero-section .btn{

    padding:12px 28px;

    border-radius:10px;

}

.hero-image{

    border-radius:20px;

    transition:0.4s ease;

}

.hero-image:hover{

    transform:scale(1.03);

}

@media (max-width:991px){

    .hero-section{

        text-align:center;

        min-height:auto;

        padding:80px 0;

    }

}

/* ===========================
   Statistics Section
=========================== */

.stat-card{

    padding:30px;

    border-radius:15px;

    transition:0.3s;

}

.stat-card:hover{

    transform:translateY(-8px);

}

.stat-card h2{

    font-size:3rem;

    margin-bottom:10px;

}

.stat-card h5{

    font-weight:500;

}

/* ===========================
   Research Cards
=========================== */

.research-card{

    border-radius:18px;

    overflow:hidden;

    transition:0.35s ease;

}

.research-card:hover{

    transform:translateY(-10px);

    box-shadow:0 15px 35px rgba(0,0,0,.15);

}

.research-card img{

    transition:.4s;

}

.research-card:hover img{

    transform:scale(1.05);

}

.research-card .btn{

    border-radius:8px;

}

/* ===========================
   Project Cards
=========================== */

.project-card{

    border-radius:18px;

    overflow:hidden;

    transition:0.35s ease;

}

.project-card:hover{

    transform:translateY(-10px);

    box-shadow:0 15px 35px rgba(0,0,0,.18);

}

.project-card img{

    transition:.4s;

}

.project-card:hover img{

    transform:scale(1.08);

}

.project-card .badge{

    font-size:.85rem;

    padding:8px 14px;

}

.project-card .btn{

    border-radius:8px;

}

/* ===========================
   Publications
=========================== */

.publication-card{

    border-radius:18px;

    transition:.35s ease;

}

.publication-card:hover{

    transform:translateY(-8px);

    box-shadow:0 15px 35px rgba(0,0,0,.15);

}

.publication-card .badge{

    font-size:.9rem;

    padding:8px 14px;

}

.publication-card .btn{

    border-radius:8px;

}

/* ===========================
   Home Team Section
=========================== */

.team-home-card{

    border-radius:18px;

    transition:.35s ease;

    overflow:hidden;

}

.team-home-card:hover{

    transform:translateY(-10px);

    box-shadow:0 15px 35px rgba(0,0,0,.15);

}

.team-home-image{

    width:170px;

    height:170px;

    object-fit:cover;
    object-position:center top;

    border-radius:50%;

    border:5px solid #f8f9fa;

    transition:.4s;

}

.team-home-card:hover .team-home-image{

    transform:scale(1.05);

}

.team-home-card i{

    color:#0d6efd;

    transition:.3s;

}

.team-home-card i:hover{

    color:#084298;

}

.team-home-card .btn{

    border-radius:8px;

}


/* ===========================
   Gallery
=========================== */

.gallery-card{

    position:relative;

    overflow:hidden;

    border-radius:18px;

    cursor:pointer;

}

.gallery-card img{

    width:100%;

    height:260px;

    object-fit:cover;

    transition:.45s;

}

.gallery-card:hover img{

    transform:scale(1.1);

}

.gallery-overlay{

    position:absolute;

    left:0;

    bottom:0;

    width:100%;

    padding:18px;

    background:linear-gradient(transparent,rgba(0,0,0,.85));

    color:#fff;

    opacity:0;

    transition:.35s;

}

.gallery-card:hover .gallery-overlay{

    opacity:1;

}

.gallery-overlay h6{

    margin-bottom:4px;

}

/* ===========================
   Achievements
=========================== */

.achievement-card{

    border-radius:18px;

    transition:.35s ease;

}

.achievement-card:hover{

    transform:translateY(-10px);

    box-shadow:0 15px 35px rgba(0,0,0,.15);

}

.achievement-icon{

    width:90px;

    height:90px;

    margin:auto;

    border-radius:50%;

    background:#fff3cd;

    display:flex;

    align-items:center;

    justify-content:center;

}

.achievement-icon i{

    font-size:2.5rem;

    color:#f0ad00;

}

.achievement-card .badge{

    padding:8px 16px;

    font-size:.9rem;

}

/* ===========================
   Partners
=========================== */

.partner-card{

    background:#fff;

    border-radius:18px;

    padding:25px;

    transition:.35s ease;

    height:100%;

    box-shadow:0 5px 20px rgba(0,0,0,.08);

}

.partner-card:hover{

    transform:translateY(-8px);

    box-shadow:0 15px 35px rgba(0,0,0,.15);

}

.partner-logo{

    width:100%;

    height:90px;

    object-fit:contain;

    transition:.35s;

}

.partner-card:hover .partner-logo{

    transform:scale(1.08);

}

.partner-card h6{

    margin-top:15px;

    font-weight:600;

}
/* ===========================
   News Section
=========================== */

.news-card{

    border-radius:18px;

    overflow:hidden;

    transition:.35s ease;

}

.news-card:hover{

    transform:translateY(-10px);

    box-shadow:0 15px 35px rgba(0,0,0,.15);

}

.news-card img{

    transition:.4s;

}

.news-card:hover img{

    transform:scale(1.05);

}

.news-card .badge{

    font-size:.85rem;

    padding:8px 14px;

}

.news-card .btn{

    border-radius:8px;

}

/* ===========================
   Contact CTA
=========================== */

.contact-cta{

    background:linear-gradient(
        135deg,
        #0d6efd,
        #0b5ed7,
        #084298
    );

    text-align:center;

}

.contact-cta h2{

    line-height:1.2;

}

.contact-cta p{

    max-width:850px;

    margin:auto;

}

.contact-cta .btn{

    padding:14px 32px;

    border-radius:10px;

    transition:.35s;

}

.contact-cta .btn:hover{

    transform:translateY(-4px);

}

/* ===========================
   Project Detail Page
=========================== */

.project-info-card{

    background:#fff;

    border-radius:18px;

}

.project-description{

    font-size:1.05rem;

    line-height:1.8;

}

.project-info-card .btn{

    border-radius:10px;

}

/* ===========================
   Research Detail
=========================== */

.research-content{

    font-size:1.05rem;

    line-height:1.9;

    color:#555;

}

.research-content p{

    margin-bottom:18px;

}

.research-content ul{

    margin-bottom:20px;

}

.research-content li{

    margin-bottom:8px;

}

/* ===========================
   Team Detail Page
=========================== */

.profile-photo{

    width:240px;

    height:240px;

    object-fit:cover;

    border-radius:50%;

    border:6px solid #f8f9fa;

    box-shadow:0 10px 25px rgba(0,0,0,.15);

}

.detail-content{

    font-size:1.05rem;

    line-height:1.9;

    color:#555;

}

.detail-content p{

    margin-bottom:18px;

}

/* ===========================
   News Detail
=========================== */

.detail-content{

    font-size:1.08rem;

    line-height:1.9;

    color:#555;

}

.detail-content p{

    margin-bottom:18px;

}

/* ===========================
   Contact Page
=========================== */

.form-control{

    border-radius:10px;

    padding:12px;

}

.form-control:focus{

    box-shadow:0 0 0 .2rem rgba(13,110,253,.2);

}

.card{

    border-radius:18px;

}

/* ===========================
   404 Page
=========================== */

.error-title{

    font-size:9rem;

    font-weight:700;

    color:#0d6efd;

}

.error-page{

    min-height:70vh;

    display:flex;

    align-items:center;

}

html{
    background-color:#111;
}

#backToTop{
    position:fixed;
    bottom:30px;
    right:30px;
    width:55px;
    height:55px;
    font-size:1.5rem;
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:999;
}

html{
    background-color:#111;
    overflow-x:hidden;
}

.navbar form.d-flex{
    flex-wrap:nowrap;
}

.navbar form.d-flex .form-control{
    width:160px;
    max-width:160px;
}

@media (max-width:991px){

    .navbar form.d-flex .form-control{
        width:100%;
        max-width:100%;
    }

}

.navbar-nav .nav-link{
    margin-left:8px;
}

.navbar-brand{
    font-size:1.3rem;
}


/* ===========================
   Image Protection (deterrent only)
=========================== */

img{

    -webkit-user-drag:none;

    -khtml-user-drag:none;

    -moz-user-drag:none;

    -o-user-drag:none;

    user-drag:none;

    -webkit-touch-callout:none;

    -webkit-user-select:none;

    -moz-user-select:none;

    -ms-user-select:none;

    user-select:none;

}


.navbar-nav .nav-link{
    margin-left:6px;
    font-size:0.95rem;
}

.navbar form.d-flex .form-control{
    width:130px;
}

.navbar .btn-success{
    padding:8px 14px;
    font-size:0.9rem;
}

/* === navbar-hover-fit-patch === */

/* Fit all nav items + search + Apply Now on one line at the xl breakpoint (1200-1399px) */
@media (min-width:1200px) and (max-width:1399.98px){

    .navbar-nav .nav-link{
        margin-left:2px;
        padding-left:.55rem;
        padding-right:.55rem;
        font-size:0.88rem;
    }

    .navbar form.d-flex .form-control{
        width:100px;
    }

    .navbar .btn-success{
        padding:8px 12px;
        font-size:0.85rem;
    }

}

/* Rotate the dropdown arrow when the "Resources" menu is open (hover or click) */
@media (hover: hover) and (pointer: fine){

    .navbar .dropdown-toggle::after{
        transition:transform .2s ease;
    }

    .navbar .dropdown.show .dropdown-toggle::after{
        transform:rotate(180deg);
    }

    .navbar .dropdown-menu{
        margin-top:.25rem;
    }

}

/* === footer-email-wrap-fix === */
footer .col-lg-3 p {
    overflow-wrap: break-word;
    word-break: break-word;
}

/* === india-map-section === */

.india-map-section{
    padding:70px 0;
}

.india-map-container{
    position:relative;
    max-width:520px;
    margin:0 auto;
}

.india-map-svg{
    width:100%;
    height:auto;
    display:block;
}

.india-map-state{
    fill:#dbe4f0;
    stroke:#ffffff;
    stroke-width:0.6;
    transition:fill .2s ease;
}

.india-map-state.has-data{
    fill:#0d6efd;
    cursor:pointer;
}

.india-map-state.has-data:hover{
    fill:#084298;
}

.india-map-tooltip{
    position:absolute;
    top:0;
    left:0;
    background:#1a1a1a;
    color:#fff;
    padding:8px 12px;
    border-radius:8px;
    font-size:0.85rem;
    line-height:1.4;
    pointer-events:none;
    z-index:10;
    max-width:220px;
    box-shadow:0 6px 16px rgba(0,0,0,.25);
    opacity:0;
    visibility:hidden;
    transition:opacity .15s ease;
}

.india-map-tooltip.is-visible{
    opacity:1;
    visibility:visible;
}

/* === india-map-labels === */

.india-map-label{
    font-size:6px;
    font-weight:600;
    fill:#334155;
    text-anchor:middle;
    dominant-baseline:middle;
    pointer-events:none;
    font-family:sans-serif;
}

.india-map-label.on-data{
    fill:#ffffff;
}

/* === india-map-palette-v2 === */

.india-map-state{
    fill:#e2e8f0;
    stroke-width:1;
}

.india-map-state.has-data{
    fill:#2563eb;
}

.india-map-state.has-data:hover{
    fill:#1d4ed8;
}

/* === vbrl-chat-widget === */

#vbrl-chat-widget{
    position:fixed;
    bottom:100px;
    right:30px;
    z-index:1000;
    font-family:"Poppins",sans-serif;
}

#vbrl-chat-toggle{
    width:60px;
    height:60px;
    border-radius:50%;
    background:#0d6efd;
    color:#fff;
    border:none;
    font-size:1.5rem;
    box-shadow:0 4px 15px rgba(0,0,0,.25);
    cursor:pointer;
}

#vbrl-chat-panel{
    position:fixed;
    bottom:170px;
    right:30px;
    width:340px;
    max-width:90vw;
    height:460px;
    max-height:70vh;
    background:#fff;
    border-radius:16px;
    box-shadow:0 10px 40px rgba(0,0,0,.25);
    display:flex;
    flex-direction:column;
    overflow:hidden;
}

#vbrl-chat-header{
    background:#0d6efd;
    color:#fff;
    padding:14px 16px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-weight:600;
}

#vbrl-chat-close{
    background:none;
    border:none;
    color:#fff;
    font-size:1.4rem;
    cursor:pointer;
    line-height:1;
}

#vbrl-chat-messages{
    flex:1;
    overflow-y:auto;
    padding:14px;
    display:flex;
    flex-direction:column;
    gap:10px;
}

.vbrl-msg{
    max-width:85%;
    padding:8px 12px;
    border-radius:12px;
    font-size:.9rem;
    line-height:1.4;
}

.vbrl-msg.user{
    align-self:flex-end;
    background:#0d6efd;
    color:#fff;
    border-bottom-right-radius:2px;
}

.vbrl-msg.bot{
    align-self:flex-start;
    background:#f1f3f5;
    color:#222;
    border-bottom-left-radius:2px;
}

#vbrl-chat-form{
    display:flex;
    border-top:1px solid #eee;
    padding:10px;
    gap:8px;
}

#vbrl-chat-input{
    flex:1;
    border:1px solid #ddd;
    border-radius:20px;
    padding:8px 14px;
    font-size:.9rem;
    min-width:0;
}

#vbrl-chat-input:focus{
    outline:none;
    border-color:#0d6efd;
}

#vbrl-chat-form button{
    background:#0d6efd;
    color:#fff;
    border:none;
    width:38px;
    height:38px;
    border-radius:50%;
    flex-shrink:0;
}

/* === vbrl-chat-panel-size-fix === */

#vbrl-chat-panel{
    height:400px;
    max-height:55vh;
    bottom:100px;
}

#vbrl-chat-toggle{
    bottom:30px;
    right:30px;
}

#vbrl-chat-panel{
    right:100px;
}

/* === navbar-simple-links-color === */

.navbar-dark .nav-link{
    color:rgba(255,255,255,.85) !important;
}

.navbar-dark .nav-link:hover{
    color:#ffffff !important;
}

/* === vbrl-chat-widget-mobile === */

@media (max-width: 576px){

    #vbrl-chat-panel{
        right:10px;
        left:10px;
        width:auto;
        max-width:none;
        bottom:90px;
    }

    #vbrl-chat-toggle{
        right:20px;
        bottom:20px;
    }

}

/* === vbrl-chat-text-wrap === */

.vbrl-msg{
    overflow-wrap:anywhere;
    word-break:break-word;
}

/* === vbrl-design-tokens === */

:root{
    --bs-primary: #1a56db;
    --bs-primary-rgb: 26,86,219;
    --bs-body-bg: #f7f8fb;
    --bs-body-color: #0d1b3d;
    --vbrl-navy: #0d1b3d;
    --vbrl-blue: #1a56db;
    --vbrl-orange: #f5a623;
    --vbrl-teal: #14b8a6;
    --vbrl-paper: #f7f8fb;
    --vbrl-slate: #5b6478;
}

body{
    font-family:"Inter",sans-serif;
    background-color: var(--vbrl-paper);
    color: var(--vbrl-navy);
}

h1,h2,h3,h4,h5,h6,
.display-1,.display-2,.display-3,.display-4,.display-5,.display-6{
    font-family:"Space Grotesk",sans-serif;
    font-weight:600;
    color: var(--vbrl-navy);
}

.navbar-brand span,
.navbar-brand{
    font-family:"Space Grotesk",sans-serif;
}

/* === vbrl-heading-contrast-fix === */
/* Headings inside dark/colored sections must inherit white text,
   not the global navy heading color set above. */

.text-white h1, .text-white h2, .text-white h3,
.text-white h4, .text-white h5, .text-white h6,
.bg-dark h1, .bg-dark h2, .bg-dark h3,
.bg-dark h4, .bg-dark h5, .bg-dark h6,
.bg-primary h1, .bg-primary h2, .bg-primary h3,
.bg-primary h4, .bg-primary h5, .bg-primary h6,
.text-white .display-1, .text-white .display-2, .text-white .display-3,
.text-white .display-4, .text-white .display-5, .text-white .display-6,
.bg-dark .display-1, .bg-dark .display-2, .bg-dark .display-3,
.bg-dark .display-4, .bg-dark .display-5, .bg-dark .display-6{
    color: inherit;
}

/* === vbrl-icon-circles === */

.vbrl-icon-circle{
    width:64px;
    height:64px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:1.6rem;
    color:#fff;
}
.vbrl-icon-navy{ background-color: var(--vbrl-navy); }
.vbrl-icon-blue{ background-color: var(--vbrl-blue); }
.vbrl-icon-orange{ background-color: var(--vbrl-orange); }
.vbrl-icon-teal{ background-color: var(--vbrl-teal); }

.vbrl-work-card{
    border-radius:12px;
    text-align:left;
}
.vbrl-work-navy{ border-left:4px solid var(--vbrl-navy); }
.vbrl-work-teal{ border-left:4px solid var(--vbrl-teal); }
.vbrl-work-orange{ border-left:4px solid var(--vbrl-orange); }

/* === vbrl-info-table === */

.vbrl-info-table{ border-collapse:collapse; }
.vbrl-info-table thead th{
    text-transform:uppercase;
    font-size:0.72rem;
    letter-spacing:0.04em;
    color: var(--vbrl-slate);
    border-bottom:2px solid #dfe3ea;
    font-weight:600;
    padding-bottom:10px;
}
.vbrl-info-table tbody td{
    padding:14px 12px;
    border-bottom:1px solid #eceef2;
    vertical-align:top;
}
.vbrl-info-table tbody tr:last-child td{ border-bottom:none; }

.vbrl-work-blue{ border-left:4px solid var(--vbrl-blue); }

/* === vbrl-icon-circle-lg === */

.vbrl-icon-circle-lg{
    width:88px;
    height:88px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:2.2rem;
    color:#fff;
}

/* === vbrl-icon-circle-sm === */

.vbrl-icon-circle-sm{
    width:44px;
    height:44px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:1.1rem;
    color:#fff;
    flex-shrink:0;
}

/* === vbrl-modern-interactions === */

html{ scroll-behavior: smooth; }

.navbar{
    transition: box-shadow .25s ease, background-color .25s ease;
}
.navbar.vbrl-scrolled{
    box-shadow: 0 4px 24px rgba(0,0,0,.35) !important;
}

.card{
    transition: transform .25s ease, box-shadow .25s ease;
}
.card:hover{
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(13,27,61,.15) !important;
}

.btn{
    transition: transform .18s ease, box-shadow .18s ease;
}
.btn:hover{
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(13,27,61,.2);
}
.btn:active{
    transform: translateY(0);
}

@keyframes vbrlHeroFadeUp{
    from{ opacity:0; transform: translateY(24px); }
    to{ opacity:1; transform: translateY(0); }
}
.vbrl-hero-animate{
    animation: vbrlHeroFadeUp .8s ease both;
}

/* === vbrl-big-redesign === */

.vbrl-diagonal-bottom{
    position: relative;
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 70px), 0 100%);
    margin-bottom: -70px;
    padding-bottom: calc(3rem + 70px) !important;
}
.vbrl-diagonal-top{
    position: relative;
    clip-path: polygon(0 70px, 100% 0, 100% 100%, 0 100%);
    margin-top: -70px;
    padding-top: calc(3rem + 70px) !important;
}

.vbrl-hero-bold{
    padding-top: 6rem !important;
    padding-bottom: 6rem !important;
    background-image: radial-gradient(circle, rgba(255,255,255,0.07) 1.5px, transparent 1.5px);
    background-size: 28px 28px;
}

/* === vbrl-hero-watermark === */

.hero-section > .container{
    position: relative;
    z-index: 1;
}

/* === vbrl-hero-distinct-bg === */

.hero-section{
    background: linear-gradient(135deg, #0d1b3d 0%, #14284f 55%, #1a3a73 100%) !important;
}

/* === vbrl-navbar-footer-color === */

nav.navbar{
    background-color: #15161c !important;
    box-shadow: none !important;
    transition: all .35s ease;
    margin: 0;
    border-radius: 0;
}

footer.bg-dark{
    background: linear-gradient(160deg, #0d1b3d 0%, #11304a 55%, #0d3d3a 100%) !important;
}

/* === vbrl-bagris-patterns === */

.vbrl-accent-word{
    font-family: 'Playfair Display', serif;
    font-style: italic;
    font-weight: 600;
}

.vbrl-pill-badge{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.25);
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: #fff;
}

.vbrl-stat-number{
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 700;
    font-size: 2.6rem;
    color: var(--vbrl-navy);
}

.vbrl-floating-badge{
    position: absolute;
    bottom: -20px;
    right: -20px;
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(6px);
    border-radius: 14px;
    padding: 12px 18px;
    box-shadow: 0 8px 24px rgba(13,27,61,.25);
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: 240px;
}

.vbrl-cta-banner{
    background: linear-gradient(135deg, #0d1b3d 0%, #14284f 55%, #1a3a73 100%);
}

/* === vbrl-responsive-fit === */

:root{ --vbrl-diag: clamp(32px, 4vw, 160px); }

html{ -webkit-text-size-adjust: 100%; }
body{ overflow-x: clip; overflow-wrap: break-word; }
img, video{ max-width: 100%; }

/* Large / ultra-wide / curved screens: scale layout up */
@media (min-width:1600px){ .container{ max-width: 1500px; } }
@media (min-width:2000px){ html{ font-size: 18px; } .container{ max-width: 1650px; } }
@media (min-width:2600px){ html{ font-size: 22px; } .container{ max-width: 2000px; } }
@media (min-width:3400px){ html{ font-size: 26px; } .container{ max-width: 2450px; } }

/* Small screens */
@media (max-width:575.98px){
    .py-5{ padding-top: 2.5rem !important; padding-bottom: 2.5rem !important; }
    .vbrl-cta-banner{ padding: 1.5rem !important; }
    .vbrl-cta-banner h2{ font-size: 1.4rem; }
    .vbrl-stat-number{ font-size: 2rem; }
    nav.navbar .nav-link{ padding-left: .5rem; padding-right: .5rem; }
}
@media (max-width:767.98px){
    .vbrl-work-card.p-5{ padding: 1.5rem !important; }
}
@media (max-width:991.98px){
    .vbrl-floating-badge{ right: 12px; bottom: 12px; max-width: calc(100% - 24px); }
}

/* Fluid diagonal dividers + hero (override earlier fixed-px versions) */
.vbrl-diagonal-bottom{
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--vbrl-diag)), 0 100%);
    margin-bottom: calc(-1 * var(--vbrl-diag));
    padding-bottom: calc(3rem + var(--vbrl-diag)) !important;
}
.vbrl-diagonal-top{
    clip-path: polygon(0 var(--vbrl-diag), 100% 0, 100% 100%, 0 100%);
    margin-top: calc(-1 * var(--vbrl-diag));
    padding-top: calc(3rem + var(--vbrl-diag)) !important;
}
.hero-section.vbrl-hero-bold{
    padding-top: clamp(2.5rem, 7vw, 6rem) !important;
    padding-bottom: calc(clamp(1.5rem, 3vw, 3rem) + var(--vbrl-diag)) !important;
}
.hero-section h1{ font-size: clamp(2rem, 5.5vw, 4rem); line-height: 1.1; }

/* === vbrl-navbar-fullwidth === */

nav.navbar > .container,
nav.navbar > .container-fluid,
nav.navbar > .container-sm,
nav.navbar > .container-md,
nav.navbar > .container-lg,
nav.navbar > .container-xl,
nav.navbar > .container-xxl{
    max-width: none !important;
    width: 100%;
    padding-left: clamp(1rem, 3vw, 5rem);
    padding-right: clamp(1rem, 3vw, 5rem);
}

/* === vbrl-container-fullwidth === */

@media (min-width:1400px){
    .container{
        max-width: none !important;
        padding-left: clamp(1rem, 3vw, 5rem);
        padding-right: clamp(1rem, 3vw, 5rem);
    }
}

/* === vbrl-backtotop === */

#backToTop{
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .25s ease, visibility .25s ease;
}
#backToTop.vbrl-show{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* === vbrl-floating-buttons === */

#vbrl-chat-toggle{
    background: linear-gradient(135deg, #1a56db 0%, #3b82f6 100%);
    box-shadow: 0 6px 20px rgba(26,86,219,.45);
    transition: transform .25s ease, box-shadow .25s ease;
    animation: vbrlChatPulse 2.4s ease-out 2s 4;
}
#vbrl-chat-toggle:hover{
    transform: scale(1.1);
    box-shadow: 0 10px 28px rgba(26,86,219,.55);
    animation: none;
}
#vbrl-chat-toggle:active{ transform: scale(.96); }
#vbrl-chat-toggle i{ display: inline-block; }
#vbrl-chat-toggle:hover i{ animation: vbrlChatWiggle .6s ease; }

@keyframes vbrlChatPulse{
    0%{ box-shadow: 0 0 0 0 rgba(26,86,219,.55), 0 6px 20px rgba(26,86,219,.45); }
    70%{ box-shadow: 0 0 0 20px rgba(26,86,219,0), 0 6px 20px rgba(26,86,219,.45); }
    100%{ box-shadow: 0 0 0 0 rgba(26,86,219,0), 0 6px 20px rgba(26,86,219,.45); }
}
@keyframes vbrlChatWiggle{
    0%, 100%{ transform: rotate(0); }
    25%{ transform: rotate(-14deg); }
    75%{ transform: rotate(14deg); }
}

#vbrl-chat-widget::after{
    content: "Ask VBRL";
    position: absolute;
    right: calc(100% + 12px);
    top: 50%;
    transform: translateY(-50%) translateX(8px);
    background: #0d1b3d;
    color: #fff;
    font-size: .8rem;
    font-weight: 600;
    padding: 6px 12px;
    border-radius: 999px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease;
}
#vbrl-chat-widget:has(#vbrl-chat-toggle:hover)::after{
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

#backToTop{
    border: 3px solid transparent;
    border-radius: 50%;
    color: #fff;
    background:
        linear-gradient(#0d1b3d, #0d1b3d) padding-box,
        conic-gradient(#f5a623 calc(var(--vbrl-p, 0) * 1%), rgba(255,255,255,.18) 0) border-box;
    box-shadow: 0 6px 18px rgba(13,27,61,.4);
    transform: translateY(14px);
    transition: opacity .25s ease, visibility .25s ease, transform .25s ease, box-shadow .25s ease;
}
#backToTop.vbrl-show{ transform: translateY(0); }
#backToTop.vbrl-show:hover{
    transform: translateY(-4px);
    box-shadow: 0 10px 24px rgba(13,27,61,.5);
}
#backToTop i{ display: inline-block; transition: transform .25s ease; }
#backToTop:hover i{ transform: translateY(-3px); }

@media (hover: none), (max-width: 767.98px){
    #vbrl-chat-widget::after{ display: none; }
}
@media (prefers-reduced-motion: reduce){
    #vbrl-chat-toggle, #vbrl-chat-toggle i, #backToTop, #backToTop i{
        animation: none !important;
        transition: none !important;
    }
}

/* === vbrl-chat-follow-backtotop === */

#vbrl-chat-widget{ --vbrl-chat-drop: 0px; }
#vbrl-chat-toggle{ translate: 0 var(--vbrl-chat-drop); }
#vbrl-chat-widget::after{ translate: 0 var(--vbrl-chat-drop); }

#vbrl-chat-widget.vbrl-chat-anim #vbrl-chat-toggle{
    transition: transform .25s ease, box-shadow .25s ease, translate .4s cubic-bezier(.4,0,.2,1);
}
#vbrl-chat-widget.vbrl-chat-anim::after{
    transition: opacity .2s ease, transform .2s ease, translate .4s cubic-bezier(.4,0,.2,1);
}

/* === vbrl-label-off === */

#vbrl-chat-widget.vbrl-label-off::after{
    opacity: 0 !important;
}
