/* =========================================================
   PG RAJAWALI II
   ENTERPRISE FINAL v5
   Optimized for Nexelit 2026
========================================================= */

:root{
    --primary:#123A63;
    --dark:#0B1F33;
    --bg:#F3F6FA;
    --text:#1B2A3A;
    --muted:#6B7A8A;
    --white:#FFFFFF;
}

/* =========================================================
   GLOBAL
========================================================= */

*,
*::before,
*::after{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    overflow-x:hidden;
    background:var(--bg);
    color:var(--text);
    font-family:"Poppins",sans-serif;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}

img{
    max-width:100%;
    height:auto;
    image-rendering:auto;
}

a{
    text-decoration:none;
    transition:.3s ease;
}

h1,h2,h3,h4,h5,h6{
    color:var(--dark);
    line-height:1.3;
}

p{
    color:var(--muted);
    line-height:1.8;
}

/* =========================================================
   NAVBAR
========================================================= */

.navbar-area{
    background:rgba(255,255,255,.98);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);

    border-bottom:1px solid rgba(18,58,99,.08);

    transition:.35s ease;
    z-index:999;
}

.navbar-area.scrolled{
    box-shadow:0 8px 30px rgba(0,0,0,.08);
}

.navbar-area .container,
.navbar-area .nav-container{
    max-width:1280px;
}

.navbar-area .nav-container{
    min-height:78px;
    display:flex;
    align-items:center;
}

/* =========================================================
   LOGO
========================================================= */

.logo-area{
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
}

.logo-wrapper{
    background:transparent !important;

    width:auto !important;
    height:auto !important;

    padding:0 !important;
    margin-right:20px !important;

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

.logo-wrapper img,
.logo img,
.desktop-logo img,
.navbar-brand img{
    max-height:60px !important;
    width:auto !important;
}

/* Shape Nexelit dimatikan secara aman */

.header-style-03.header-variant-06 .logo-wrapper::after{
    background:transparent !important;
}

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

.navbar-area .navbar-nav{
    align-items:center;
}

.navbar-area .navbar-nav > li{
    position:relative;
    margin:0 3px;
}

.navbar-area .navbar-nav > li > a{
    color:var(--text);
    font-size:13px !important;
    font-weight:600;
    padding:30px 8px !important;
    position:relative;
    transition:.25s ease;
}

.navbar-area .navbar-nav > li:hover > a,
.navbar-area .navbar-nav > li.current-menu-item > a,
.navbar-area .navbar-nav > li.current_page_item > a{
    color:var(--primary);
    transform:translateY(-1px);
}

.navbar-area .navbar-nav > li > a::after{
    content:"";
    position:absolute;
    left:8px;
    bottom:22px;

    width:0;
    height:2px;

    background:var(--primary);

    border-radius:50px;
    transition:.3s ease;
}

.navbar-area .navbar-nav > li:hover > a::after,
.navbar-area .navbar-nav > li.current-menu-item > a::after,
.navbar-area .navbar-nav > li.current_page_item > a::after{
    width:calc(100% - 16px);
}

/* =========================================================
   SUBMENU
========================================================= */

@media(min-width:992px){

    .navbar-area .navbar-nav li{
        position:relative;
    }

    .navbar-area .navbar-nav li ul,
    .navbar-area .navbar-nav li .sub-menu{

        min-width:240px;

        background:#fff;

        border-radius:14px;

        padding:8px 0;

        box-shadow:
        0 10px 30px rgba(0,0,0,.06),
        0 20px 50px rgba(18,58,99,.06);

        opacity:0;
        visibility:hidden;

        transform:translateY(10px);

        transition:.25s ease;

        z-index:99999;
    }

    .navbar-area .navbar-nav li:hover > ul,
    .navbar-area .navbar-nav li:hover > .sub-menu{
        opacity:1;
        visibility:visible;
        transform:translateY(0);
    }

    .navbar-area .navbar-nav li ul li a,
    .navbar-area .navbar-nav li .sub-menu li a{

        display:block;

        padding:12px 20px !important;

        font-size:14px !important;

        color:var(--text);

        white-space:nowrap;
    }

    .navbar-area .navbar-nav li ul li a:hover,
    .navbar-area .navbar-nav li .sub-menu li a:hover{

        background:#F5F7FA;

        color:var(--primary);
    }

    .navbar-area .navbar-nav ul ul{
        left:100%;
        top:0;
        margin-left:4px;
    }
}

/* =========================================================
   BUTTON
========================================================= */

.btn,
.boxed-btn{

    background:var(--primary);

    color:#fff !important;

    border:none;

    border-radius:10px;

    padding:12px 24px;

    font-weight:600;

    box-shadow:0 6px 20px rgba(18,58,99,.15);

    transition:.3s ease;
}

.btn:hover,
.boxed-btn:hover{

    background:var(--dark);

    transform:translateY(-3px);

    box-shadow:0 12px 30px rgba(18,58,99,.25);
}

/* =========================================================
   CARD
========================================================= */

.single-service-item,
.single-blog-grid,
.single-case-study-item{

    background:#fff;

    border-radius:18px;

    border:1px solid rgba(0,0,0,.04);

    box-shadow:
    0 4px 10px rgba(0,0,0,.03),
    0 12px 40px rgba(18,58,99,.06);

    transition:.3s ease;
}

.single-service-item:hover,
.single-blog-grid:hover,
.single-case-study-item:hover{

    transform:translateY(-5px);

    box-shadow:
    0 10px 20px rgba(0,0,0,.04),
    0 18px 50px rgba(18,58,99,.10);
}

/* =========================================================
   UTILITIES
========================================================= */

.header-cart,
.menu-cart,
.cart-btn,
.header-wishlist,
.menu-wishlist{
    display:none !important;
}

input,
textarea,
select,
button{
    max-width:100%;
    box-shadow:none !important;
}

.table-responsive{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
}

a,
button{
    -webkit-tap-highlight-color:transparent;
}

/* =========================================================
   PERFORMANCE
========================================================= */

.single-service-item,
.single-blog-grid,
.single-case-study-item,
.btn,
.boxed-btn{
    will-change:transform;
}

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

@media(max-width:991px){

    .nav-container{
        min-height:72px;
        padding:0 12px;
    }

    .logo-wrapper{
        margin-right:0 !important;
    }

    .logo-wrapper img,
    .logo img,
    .desktop-logo img,
    .navbar-brand img{
        max-height:42px !important;
    }

    .navbar-area .navbar-collapse.show{

        background:#fff;

        padding:15px;

        border-radius:14px;

        margin-top:10px;

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

    .navbar-area .navbar-nav{
        width:100%;
    }

    .navbar-area .navbar-nav li{
        width:100%;
    }

    .navbar-area .navbar-nav li a{

        display:block;

        width:100%;

        padding:14px 12px !important;

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

    .navbar-area .navbar-nav > li > a::after{
        display:none;
    }

    .btn,
    .boxed-btn{
        width:100%;
    }
}