:root{
    --dark-bg:#000;
    --dark-bg-color:#fff;
    /* --brand-color:#03218f; */
    --brand-color:#1E4CFF;
    --brand-hover-color:#00247E;
    --brand-color-secondary: #fa9b27;
    --brand-bg-color:#b4bdde;
    --bg:#0B0F17; 
    --soft:#ffffff0d; 
    --soft-2:#ffffff14; 
    --border:#ffffff1a; 
    --text:#e5e7eb; 
    --muted:#a1a1aa;
    --indigo:#6366f1; 
    --indigo-600:#5458e3; 
    --fuchsia:#d946ef;
    --glass: rgba(255, 255, 255, .06);
}
html{scroll-behavior:smooth}
body{background:var(--bg); 
    color:#fff; 
    font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial
}
*{
    font-family: 'Montserrat', sans-serif;
}
a{
    text-decoration: none;
}
p{
    font-weight: 400;
    font-size: 14px;
}
.container-fluid{
    max-width: 1500px;
}
.btn-brand{
    background-color: var(--brand-color);
    color: var(--dark-bg-color);
    border: none;
}
.btn-brand:hover,.btn-brand:focus{
    background-color: var(--brand-hover-color) !important;
    color: var(--dark-bg-color) !important;
}
/* =====================Header======================= */
header .header-top{
    background: var(--brand-color-secondary);
    padding: 5px 0;
}
header .header-top ul{
    list-style: none;
    padding: 0;
    margin: 0;
}
header .header-top ul li{
    display: inline-block;
}
header .header-top .contact-links li a{
    color: var(--dark-bg-color);
    font-size: 11px;
    margin: 0 15px 0 0;
    transition: .5s;
    font-weight: 500;
    letter-spacing: .5px;
}
header .header-top .contact-links li a:hover{
    letter-spacing: 1px;
}

header .header-top .social-media li{
    width: 25px;
    height: 25px;
    border-radius: 100%;
    text-align: center;
    background: var(--dark-bg-color);
    margin: 0 0 0 7px ;
}
header .header-top .social-media li a{
    color: var(--brand-color);
    font-size: 12px;
}

header nav{
    /* background: transparent; */
    backdrop-filter:saturate(180%) blur(10px); 
    background:rgba(11, 15, 23, 0.388);
    border-bottom:1px solid var(--border);
    padding: 5px 10px;
}
header .header-row{
    min-height: 53px;
}
header .header-logo img{
    max-width: 70px;
    max-height: 60px;
    width: 100%;
    padding: 0;
}
header nav ul{
    list-style: none;
    /* padding: 10px 0 0 0; */
    margin: 0;
}
header nav ul li{
    display: inline-block;
    margin: 0 0 0 25px;
    padding: 15px 0 0 0;
    min-height: 53px;
}
header nav ul li:first-child{
    margin: 0;
}
header nav ul li a{
    font-weight: 700;
    font-size: 12px;
    color: var(--dark-bg-color);
    text-transform: uppercase;
}
header nav ul li a:hover{
    color: var(--brand-color-secondary);
}
/* ----mobile-menu---- */
header nav .bi-list{
    color: var(--dark-bg-color);
    margin: 10px 0 0 0;
    cursor: pointer;
    font-size: 30px;
}
header .technology-menu .tech-list{
    position: absolute;
    max-width: 1100px;
    width: 100%;
    background: var(--dark-bg-color);
    left: 50%;
    top: 60px;
    transform: translateX(-50%);
    padding: 15px 20px;
    display: none;
    z-index: 999;
    box-shadow: 0 0 5px #999;
}
header .technology-menu .tech-list h5 a{
    font-size: 15px;
    font-weight: 700;
    color: var(--dark-bg);
}
header .technology-menu .tech-list ul{
    width: 100%;
    padding: 5px 0 25px 0;
}
header .technology-menu .tech-list .cloud-server ul,
header .technology-menu .tech-list .databases ul,
header .technology-menu .tech-list .ecommerce ul{
    padding: 5px 0 0 0;
}
header .technology-menu .tech-list .framework ul ,
header .technology-menu .tech-list .front-end ul{
    padding: 5px 0 5px 0;
}
header .technology-menu .tech-list ul li{
    width: 100%;
    margin: 0 0 7px 0;
    padding: 0;
    min-height: 0 !important;
    font-size: 11px;
    font-weight: 600;
    color: var(--dark-bg);
}
header .technology-menu .tech-list ul li:last-child{
    margin: 0;
}
header .technology-menu .tech-list ul li a{
    font-size: 11px;
    font-weight: 600;
    color: var(--dark-bg);
}
header .technology-menu .tech-list ul li img{
    max-width: 18px;
    width: 100;
}

header .others-dropdown-list{
    position: absolute;
    background: var(--dark-bg-color);
    left: 50%;
    top: 53.4px;
    transform: translateX(-22%);
    padding: 15px 0;
    display: none;
    z-index: 999;
    box-shadow: 0 0 5px #999;
}
header .others-dropdown-list ul li{
    text-align: left;
    width: 100%;
    padding: 0 20px;
    margin: 12px 0 0 0;
    min-height: 0;
    min-width: 200px;
}
header .others-dropdown-list ul li:hover,header .others-dropdown-list ul li:hover a{
    color: var(--dark-bg-color);
    background: var(--brand-color);
}
header .others-dropdown-list ul li a{
    font-weight: 600;
    letter-spacing: 0.5px;
    color: var(--dark-bg);
}
header .services-list{
    min-width: 255px;
}
header .user-nav{
    height: 100dvh;
    width: 85%;
    max-width: 380px;
    position: fixed;
    top: 0;
    left: 0;
    background: linear-gradient(180deg, rgba(11,15,23,.98), rgba(8,11,19,.96));
    backdrop-filter: blur(20px);
    z-index: 1032;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    margin-left: -85%;
    overflow-y: auto;
    border-right: 1px solid var(--border);
}
header .user-nav .nav-user-details{
    padding: 20px 16px;
    border-bottom: 1px solid var(--border);
    background: linear-gradient(90deg, rgba(30,76,255,.12), transparent);
}
header .user-nav .user-icon{
    padding: 0;
    flex-shrink: 0;
}
header .user-nav .user-icon img{
    width: 52px;
    height: 52px;
    border-radius: 14px;
    object-fit: cover;
    border: 2px solid rgba(255,255,255,.1);
    display: block;
    background: rgba(255,255,255,.04);
}
header .user-nav .user-details p{
    font-weight: 600;
    margin: 0;
    color: #fff;
    font-size: 14px;
}
header .user-nav .user-details p:last-child{
    color: var(--muted);
    font-size: 12px;
    font-weight: 400;
    margin-top: 2px;
}
header .user-nav .user-link-list{
    padding: 12px 12px 20px;
}
header .user-nav .user-link-list ul{
    list-style: none;
    padding: 0;
    margin: 0;
}
header .user-nav .user-link-list ul li{
    margin: 0;
    padding: 0;
    min-height: 0;
    border: none;
    display: block;
}
header .user-nav .user-link-list ul li a{
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    border-radius: 10px;
    color: rgba(255,255,255,.6);
    font-weight: 500;
    font-size: 13px;
    transition: all .25s ease;
    text-decoration: none;
    text-transform: none;
    border: none;
}
header .user-nav .user-link-list ul li a i{
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: rgba(255,255,255,.04);
    font-size: 14px;
    flex-shrink: 0;
    transition: all .25s ease;
}
header .user-nav .user-link-list ul li a:hover{
    color: #fff;
    background: rgba(255,255,255,.06);
}
header .user-nav .user-link-list ul li a:hover i{
    background: rgba(255,255,255,.1);
}
header .user-nav .user-link-list ul li:last-child a{
    color: rgba(255,255,255,.4);
}
header .user-nav .user-link-list ul li:last-child a:hover{
    color: #ef4444;
    background: rgba(239,68,68,.1);
}
header .user-nav .user-link-list ul li:last-child a:hover i{
    background: rgba(239,68,68,.15);
    color: #ef4444;
}
@media screen and (max-width: 991px) {
    header .header-top{
        display: none;
    }
    header .header-row{
        align-items: center;
    }
    header .header-logo{
        padding-left: 15px;
    }
    header .header-logo img{
        padding: 0;
    }
    header nav{
        padding: 6px 0;
    }
    header nav .col-8{
        text-align: start !important;
    }
    header nav .mobile-nav-bar{
        text-align: end;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 8px;
    }
    header nav .mobile-nav-bar .nav-icon-btn{
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        border-radius: 10px;
        background: rgba(255,255,255,.04);
        border: 1px solid var(--border);
        cursor: pointer;
        transition: all .25s ease;
        color: #fff;
        font-size: 20px;
    }
    header nav .mobile-nav-bar .nav-icon-btn:hover{
        background: rgba(255,255,255,.08);
        border-color: rgba(255,255,255,.12);
        color: var(--brand-color);
    }
    header nav .mobile-nav-bar .bi-person-circle{
        font-size: 18px;
        color: #fff;
        margin: 0;
    }
    header nav .mobile-nav-bar .bi-list{
        font-size: 20px;
        color: #fff;
        margin: 0;
    }
    header nav .nav-lists{
        height: 100dvh;
        width: 80%;
        max-width: 380px;
        top: 0;
        left: 0;
        position: fixed;
        overflow-y: auto; 
        margin-left: -80%;
        background: linear-gradient(180deg, rgba(11,15,23,.98), rgba(8,11,19,.96));
        backdrop-filter: blur(20px);
        scrollbar-width: none;
        -ms-overflow-style: none;
        z-index: 1032;
        border-right: 1px solid var(--border);
        transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
    }
    header nav .nav-drawer{
        background: rgba(0,0,0,.7);
        backdrop-filter: blur(4px);
        height: 100dvh;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 1031; 
        display: none;
    }
    header .mobile-nav-sidebar-logo{
        padding: 24px 20px 16px;
        border-bottom: 1px solid var(--border);
        margin-bottom: 8px;
    }
    header .mobile-nav-sidebar-logo img{
        max-width: 70px;
        width: 100%;
        margin: 0;
    }
    header nav ul{
        text-align: left;
        padding: 0 12px;
    }
    header nav ul li{
        display: block; 
        margin: 0 !important;
        padding: 0;
        min-height: 0;
        position: relative;
        border: none;
    }
    header nav ul li a{
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 11px 16px;
        font-size: 14px;
        font-weight: 500;
        color: rgba(255,255,255,.75);
        text-transform: none;
        border-radius: 10px;
        transition: all .25s ease;
        text-decoration: none;
        letter-spacing: .3px;
    }
    header nav ul li a .fa-chevron-down{
        display: none;
    }
    header nav ul li a i:not(.fa-chevron-down){
        width: 32px;
        height: 32px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 8px;
        background: rgba(255,255,255,.04);
        font-size: 14px;
        flex-shrink: 0;
        transition: all .25s ease;
    }
    header nav ul li a:hover i:not(.fa-chevron-down){
        background: rgba(255,255,255,.1);
    }
    header nav ul li.active > a{
        color: #fff;
        background: linear-gradient(90deg, rgba(30,76,255,.2), transparent);
        border-left: 3px solid var(--brand-color);
        padding-left: 17px;
    }
    header nav ul li a:hover{
        color: #fff;
        background: rgba(255,255,255,.06);
    }
    header nav ul li a:hover i{
        background: rgba(255,255,255,.1);
    }
    header nav .fa-plus,header nav .fa-minus{
        position: absolute;
        right: 10px;
        top: 10px;
        width: 36px;
        height: 36px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 8px;
        background: rgba(255,255,255,.04);
        color: rgba(255,255,255,.6);
        cursor: pointer;
        transition: all .25s ease;
        font-size: 14px;
    }
    header nav .fa-plus:hover,header nav .fa-minus:hover{
        background: rgba(255,255,255,.1);
        color: #fff;
    }
    header .others-dropdown-list,
    header .technology-menu .tech-list{
        position: relative;
        left: 0;
        top: 0;
        transform: translateX(0);
        padding: 0 0 4px 12px;
        display: none;
        width: 100% !important;
        max-width: 100% !important;
        background: transparent;
        box-shadow: none !important;
    }
    header .others-dropdown-list ul li,
    header .technology-menu .tech-list .col{
        border: none;
        padding: 0;
    }
    header .others-dropdown-list ul li a,
    header .technology-menu .tech-list h5 a{
        padding: 8px 14px 8px 20px;
        font-size: 13px;
        text-transform: capitalize;
        color: rgba(255,255,255,.7) !important;
        font-weight: 500;
        border-left: 1px solid var(--border);
        margin-left: 16px;
        border-radius: 0;
        background: transparent;
    }
    header .technology-menu .tech-list h5 a{
        color: rgba(255,255,255,.85) !important;
        font-weight: 600;
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: .5px;
        padding: 12px 14px 4px 20px;
        border-left: none;
        margin-left: 16px;
    }
    header .others-dropdown-list ul li a:hover,
    header .technology-menu .tech-list ul li a:hover{
        color: #fff !important;
        background: transparent;
    }
    header .others-dropdown-list ul li:hover,
    header .others-dropdown-list ul li:hover a,
    header .technology-menu .tech-list .col:hover,
    header .technology-menu .tech-list .col:hover a{
        background: transparent;
        color: #fff !important;
    }
    header .others-dropdown-list ul li:last-child{
        border-bottom: none;
    }
    header .technology-menu .tech-list .row{
        flex-direction: column;
    }
    header .technology-menu .tech-list .row .col{
        width: 100%;
        margin-bottom: 0 !important;
    }
    header .technology-menu .tech-list ul li{
        width: 100%;
        margin: 0;
        padding: 0;
        min-height: 0;
        border: none;
        display: block;
    }
    header .technology-menu .tech-list ul{
        padding: 0;
    }
    header .technology-menu .tech-list ul li{
        color: rgba(255,255,255,.7) !important;
        font-size: 13px;
        font-weight: 500;
        margin: 0;
        padding: 6px 14px 6px 36px;
        display: flex;
        align-items: center;
        gap: 8px;
        border-left: 1px solid var(--border);
        margin-left: 16px;
    }
    header .technology-menu .tech-list ul li a{
        padding: 0;
        font-size: 13px;
        text-transform: capitalize;
        color: rgba(255,255,255,.7) !important;
        font-weight: 500;
        border: none;
        margin: 0;
        border-radius: 0;
        background: transparent;
        line-height: 1.4;
    }
    header .technology-menu .tech-list ul li img{
        max-width: 16px;
        width: auto;
        height: 16px;
        flex-shrink: 0;
        object-fit: contain;
    }
    header nav ul li a,header nav .contacts a{
        color: rgba(255,255,255,.65);
        font-weight: 500;
    }
    header nav ul li a:hover,header nav .contacts a:hover{
        color: #fff;
    }
    header nav .contacts{
        padding: 20px 20px 30px;
        border-top: 1px solid var(--border);
        margin-top: 12px;
    }
    header nav .contacts p{
        margin: 6px 0 0;
        text-align: left;
    }
    header nav .contacts p a{
        color: var(--muted);
        font-size: 13px;
        font-weight: 400;
        text-decoration: none;
        display: flex;
        align-items: center;
        gap: 10px;
    }
    header nav .contacts p a i{
        width: 32px;
        height: 32px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 8px;
        background: rgba(255,255,255,.04);
        font-size: 14px;
        color: var(--brand-color);
    }
    header nav .contacts p a:hover{
        color: #fff;
    }
}
/* =====================Footer======================= */
footer{border-top: 1px solid var(--border);padding: 30px 0 0 0;}
footer .logo img{max-width: 100px;width: 100%;}
footer .logo p{color: var(--muted);font-size: 13px;font-weight: 500;margin: 20px 0 10px 0;line-height: 20px;}
footer h5{color: var(--dark-bg-color);font-weight: 700;font-size: 18px;letter-spacing: 1px;}
footer ul{list-style: none;padding: 0;}
footer ul li{margin: 0 0 4px 0;font-size: 12px;color: var(--muted);line-height: 20px;}
footer ul li a{color: var(--muted);font-size: 12px;transition: .5s;font-weight: 500;letter-spacing: .7px;}
footer ul li a:hover{letter-spacing: 1px;color: var(--dark-bg-color);}
footer .socials { display:flex; gap:8px; margin-top:6px; }
footer .socials a { width:40px; height:40px; display:grid; place-items:center; border-radius:10px; color:var(--text);background:transparent; border:1px solid rgba(255,255,255,0.04); text-decoration:none; transition:all .18s; }
footer .socials a:hover { transform:translateY(-3px); background: linear-gradient(90deg,#4f6df6,#d86ef1); }
footer .copyright{border-top: 1px solid var(--border);}
footer .copyright p{color: var(--muted); margin: 10px 0;font-size: 12px;font-weight: 500;}
@media screen and (max-width: 767px) {
    footer .socials,footer .logo { justify-content:center; }
    footer .logo { text-align:center; }
    footer h5{margin: 15px 0 10px 0;}
    footer ul li{margin: 0 0 6px 0;}
}
/* =====================Contact Us Page======================= */
 /* HERO */
.contact-us-page .hero {padding:40px 20px;background: radial-gradient(600px 200px at 10% 10%, rgba(37,99,235,0.08), transparent),linear-gradient(90deg, rgba(37,99,235,0.08), rgba(139,92,246,0.04));text-align:center;color: #fff;}
.contact-us-page .hero .kicker { display:inline-block; padding:6px 12px; border-radius:999px; background:rgba(255,255,255,0.03); color:var(--muted); font-weight:700; font-size:.9rem; margin-bottom:12px; }
.contact-us-page .hero h1{ font-size:40px; margin:6px 0 12px; font-weight:700; letter-spacing:-0.02em; }
.contact-us-page .hero p.lead{ max-width:800px; margin:0 auto; color:var(--muted); font-size: 15px;}
.contact-us-page .col-left { padding:18px; }
.contact-us-page .col-right { padding:18px; }
.contact-us-page .panel {background:rgba(255,255,255,0.03); border-radius:12px; padding:18px; border:1px solid rgba(255,255,255,0.04);}
.contact-us-page input.form-control, .contact-us-page textarea.form-control, .contact-us-page select.form-select{background:transparent; border:1px solid rgba(255,255,255,0.06); color: #eaf0ff; border-radius:10px; padding:9px 12px; font-size: 14px;}
.contact-us-page input::placeholder, .contact-us-page textarea::placeholder { color:#9aa0ab; }
.contact-us-page .label { color:var(--muted); font-size:14px; margin-bottom:6px; display:block; }
.contact-us-page option{background: var(--bg);}
.contact-us-page .btn,.contact-us-page .btn:hover{background-color: var(--brand-color); color: var(--dark-bg-color);padding: 8px 40px;border: none;}
.contact-us-page label.error{color: red; font-size: 13px;}
.contact-us-page .contact-item { display:flex; gap:12px; align-items:flex-start; margin-bottom:12px; color:var(--muted); }
.contact-us-page .contact-item i { font-size:20px; color:var(--brand-color); min-width:26px; }
.contact-us-page .contact-item strong { font-size: 14px; font-weight: 500;}
.contact-us-page .contact-item span { font-size: 13px;}
.contact-us-page .map {width:100%; height:220px; border-radius:10px; overflow:hidden; border:1px solid rgba(255,255,255,0.04); background:#06111f;}
@media screen and (max-width: 767px) {
    .contact-us-page .container{ padding: 0;}
    .contact-us-page .hero h1{ font-size:29px;}
    .contact-us-page .hero p.lead{font-size: 14px;}
    .contact-us-page .col-left { margin-top:40px; }
    .contact-us-page .col-left .panel{ padding:18px 10px; }
    .contact-us-page .col-right { padding-top:0; margin-bottom: 30px;}
    .contact-us-page .btn,.contact-us-page .btn:hover{padding: 6px 0; width: 100%;}
    .contact-us-page input.form-control, .contact-us-page textarea.form-control, .contact-us-page select.form-select{padding:7px 12px; font-size: 13px;}
    .contact-us-page .label {font-size:13px;}
}
/* =====================About Us Page======================= */
.about-us-page .section{padding-block:4rem}
.about-us-page .eyebrow{letter-spacing:.18em;color:#c7d2fe;text-transform:uppercase;font-weight:700}
.about-us-page .muted{color:var(--muted)}
.about-us-page .glass{background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05)); border:1px solid var(--border); border-radius:1rem; box-shadow:0 10px 30px rgba(0,0,0,.35); position:relative; overflow:hidden}
.about-us-page .obj-lg{width:100%;max-height:360px;object-fit:cover;border-radius:1rem}
.about-us-page .pill{display:inline-flex;align-items:center;justify-content:center;background:var(--soft);border:1px solid var(--border);border-radius:999px;padding:.4rem .75rem;color:#cbd5e1;font-size: 13px;}
.about-us-page h2{font-weight: 700;font-size: 33px;}
.about-us-page h3{font-size: 21px;font-weight: 600;}

.about-us-page .top-section p{font-size: 16px; padding: 0 50px 0 0;}

.about-us-page .cta{background:linear-gradient(90deg, rgba(99,102,241,.25), transparent 40%, rgba(217,70,239,.25))}
.about-us-page .cta h3{font-weight: 600;font-size: 28px;}
.about-us-page .cta .muted{color: var(--muted);font-size: 14px}
.about-us-page .cta input{ font-weight: 500; font-size: 14px; color: var(--dark-bg-color);border: 1px solid var(--dark-bg-color) !important;}
.about-us-page .cta .btn{background-color: var(--brand-color); font-weight: 500; font-size: 14px;}

/* =====================Policy pages======================= */
.policy-page{background:var(--bg);color:var(--text)}
.policy-page .policy-hero{padding:5rem 0 4rem;background:linear-gradient(90deg,rgba(99,102,241,.25),transparent 42%,rgba(217,70,239,.22))}
.policy-page .eyebrow{display:inline-block;letter-spacing:.18em;color:#c7d2fe;text-transform:uppercase;font-weight:700;font-size:12px;margin-bottom:12px}
.policy-page h1{font-size:46px;line-height:1.12;font-weight:800;margin:0 0 16px;color:#fff}
.policy-page .policy-hero p{font-size:16px;line-height:1.8;color:var(--muted);max-width:820px;margin:0}
.policy-page .policy-summary{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-start;background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.05));border:1px solid var(--border);border-radius:1rem;padding:20px}
.policy-page .policy-summary span{display:inline-flex;align-items:center;min-height:34px;padding:6px 12px;border:1px solid var(--border);border-radius:999px;background:var(--soft);color:#dbeafe;font-size:13px;font-weight:600}
.policy-page .policy-content{padding:4rem 0}
.policy-page .policy-side{position:sticky;top:96px;background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.05));border:1px solid var(--border);border-radius:1rem;padding:24px;box-shadow:0 10px 30px rgba(0,0,0,.28)}
.policy-page .policy-side p{color:var(--muted);font-size:13px;text-transform:uppercase;letter-spacing:.12em;font-weight:700}
.policy-page .policy-side h2{font-size:21px;font-weight:700;color:#fff;margin-bottom:22px}
.policy-page .policy-links{display:grid;gap:10px;margin-bottom:24px}
.policy-page .policy-links a{display:flex;align-items:center;justify-content:space-between;color:#d1d5db;border:1px solid var(--border);border-radius:10px;padding:12px 14px;font-size:14px;font-weight:600;background:rgba(255,255,255,.04);transition:.25s}
.policy-page .policy-links a:after{content:"\f285";font-family:"bootstrap-icons";font-size:12px;color:var(--brand-color-secondary)}
.policy-page .policy-links a:hover,.policy-page .policy-links a.active{color:#fff;border-color:rgba(250,155,39,.55);background:rgba(250,155,39,.12)}
.policy-page .policy-contact{display:flex;gap:12px;align-items:flex-start;border-top:1px solid var(--border);padding-top:18px}
.policy-page .policy-contact i{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;background:var(--brand-color);color:#fff}
.policy-page .policy-contact strong{display:block;color:#fff;font-size:14px}
.policy-page .policy-contact a{color:var(--brand-color-secondary);font-size:13px;font-weight:600}
.policy-page .policy-card{background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.04));border:1px solid var(--border);border-radius:1rem;box-shadow:0 10px 30px rgba(0,0,0,.28);overflow:hidden}
.policy-page .policy-section{display:grid;grid-template-columns:72px 1fr;gap:18px;padding:28px;border-bottom:1px solid var(--border)}
.policy-page .policy-section:last-child{border-bottom:0}
.policy-page .section-count{width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;background:rgba(99,102,241,.18);border:1px solid rgba(99,102,241,.36);color:#c7d2fe;font-weight:800;font-size:14px}
.policy-page .policy-section h2{font-size:22px;font-weight:700;color:#fff;margin:0 0 10px}
.policy-page .policy-section p{color:#cbd5e1;font-size:15px;line-height:1.85;margin:0}
@media(max-width:991px){.policy-page .policy-hero{padding:4rem 0 3rem}.policy-page h1{font-size:38px}.policy-page .policy-side{position:static}.policy-page .policy-content{padding:3rem 0}}
@media(max-width:575px){.policy-page h1{font-size:32px}.policy-page .policy-hero p{font-size:14px}.policy-page .policy-section{grid-template-columns:1fr;padding:22px}.policy-page .policy-section h2{font-size:19px}.policy-page .policy-section p{font-size:14px}.policy-page .policy-summary span{font-size:12px}}


@media screen and (max-width:767px){
    .about-us-page h2{font-size: 30px;}
    .about-us-page .cta h3{font-size: 23px;}
    .about-us-page .cta .btn{width:100%; margin:8px 0 0 0;}
}
/* =====================Faq's Page======================= */
.faqs-page .page-heading h1{font-size: 35px;font-weight: 600;margin: 0;padding: 20px 0;}
.faqs-page .page-subheading h2{font-size: 25px;font-weight: 600;margin: 0;padding: 0 0 15px 0;}
.faqs-page .page-subheading .divider{border-bottom: 2px solid var(--muted);max-width: 200px;margin: 0 auto;margin-bottom: 40px;}
.faqs-page .accordion-item{background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05));margin: 0 0 10px 0; border-radius: 16px;border:1px solid var(--border);}
.faqs-page .accordion-header{background:transparent}
.faqs-page .accordion-button {background: transparent;border: none;box-shadow: none;color: var(--dark-bg-color);font-size: 14px;}
.faqs-page .accordion-body p{color: var(--dark-bg-color); font-size: 13px;}
.faqs-page .accordion-button::after {background-size: 16px;filter: brightness(0) invert(1);}
.faqs-page .accordion-button:not(.collapsed)::after{filter: brightness(0) invert(1);}

.accordion-button::after {
    background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' d='M8 0a1 1 0 0 1 1 1v6h6a1 1 0 1 1 0 2H9v6a1 1 0 1 1-2 0V9H1a1 1 0 0 1 0-2h6V1a1 1 0 0 1 1-1z' clip-rule='evenodd'/%3e%3c/svg%3e");
    transform: scale(.7) !important;
    background-size: 18px;
}
.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' d='M0 8a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H1a1 1 0 0 1-1-1z' clip-rule='evenodd'/%3e%3c/svg%3e");
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(344deg) brightness(106%) contrast(102%);
} 
@media screen and (max-width:767px){
    .faqs-page .page-heading h1{font-size: 33px;}
    .faqs-page .page-subheading h2{font-size: 20px;}
    .faqs-page .accordion-item button{font-size: 12px;}
    .faqs-page .page-subheading .divider{margin-bottom: 30px;max-width: 150px;}
}

/* =====================Blogs Page======================= */
/* .blog-page .top-section{
    background: linear-gradient(rgba(0, 0, 0, 0.619),rgba(0,0,0,.619)),
    url(https://bytenovo.com/public/storage/images/20241219-000408-990818-bytenovo-banner.webp) center center no-repeat;
    background-size: cover;
    margin: 0 0 40px 0;
    padding: 30px 0;
}
.blog-page .top-section h1{
    color: var(--dark-bg-color);
    font-size: 35px;
    font-weight: 600;
    letter-spacing: 1px;
}
.blog-page .top-section h3,.blog-page .top-section h3 a{
    color: var(--dark-bg-color);
    font-size: 22px;
    letter-spacing: 1px;
}
.blog-page .image-container{
    width: 100%;
    overflow: hidden;
    position: relative;
    border-radius: 10px;
    margin: 0 0 10px 0;
}
.blog-page .image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}
.blog-page .image-container:hover img {
    transform: scale(1.2);
}
.blog-page .blog-publised p{
    font-weight: 600;
    font-size: 13px;
}
.blog-page .blog_title h2{
    font-size: 17px;
    font-weight: 600;
}
.blog-page .blog-title h2{
    font-size: 17px;
    font-weight: 600;
    color: var(--dark-bg);
}
.blog-page .short-desk p{
    font-size: 13px;
    color: var(--dark-bg);
}
@media screen and (max-width:767px){
    .blog-page .top-section{
        padding: 20px 0;
    }
} */
.blog-page .section {padding-block: 3rem}
.blog-page .hero {padding: 3.5rem 0;background: linear-gradient(90deg, rgba(99, 102, 241, .25), transparent 40%, rgba(217, 70, 239, .25))}
.blog-page .glass { background: rgba(255, 255, 255, .06);border: 1px solid var(--border);border-radius: 1rem;box-shadow: 0 10px 30px rgba(0, 0, 0, .35)}
.blog-page .muted {color: var(--muted)}
.blog-page .post-img {width: 100%;height: 220px;object-fit: cover;border-radius: .8rem}
.blog-page article h5{font-size: 16px; font-weight: 600;line-height: 20px;}
.blog-page .chip {display: inline-flex;gap: .4rem;align-items: center;padding: .25rem .5rem;border-radius: 999px;background: rgba(255, 255, 255, .06);border: 1px solid var(--border);font-size: 11px;color: #cbd5e1}
.blog-page .form-control,.blog-page .form-select {background: transparent;color: #fff;border: 1px solid var(--border)}
.blog-page .form-control::placeholder {color: #cbd5e1}
.blog-page .form-select option {color: var(--bg);font-size: 14px;}
.blog-page .input-group-text{border-color: var(--border);}
.blog-page .btn-primary {background: #6366f1;border-color: #6366f1}
.blog-page .btn-outline-light {border-color: var(--border);color: #e5e7eb}
.blog-page .btn-outline-light:hover {background: #ffffff12}
.blog-page .post-card:hover {transform: translateY(-3px);transition: transform .2s}
.blog-page .pagination p.text-muted{display: none !important;}
.blog-page .pagination ul li .page-link{background: transparent;border: none;padding: 0 5px;margin: 0 13px;color:#fff;}
.blog-page .pagination ul li.active .page-link,.pagination ul li.disabled .page-link{color: var(--muted)}
.blog-page .subscription-form input{font-size: 14px;}


/* =====================Single Blog Page======================= */
.single-blog-page .hero h1{font-size: 35px;}
.hero{padding:3.5rem 0;background:linear-gradient(90deg,rgba(99,102,241,.25),transparent 40%,rgba(217,70,239,.25))}
.single-blog-page .section{padding-block:3rem}
.single-blog-page .glass{background:rgba(255,255,255,.06);border:1px solid var(--border);border-radius:1rem;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.single-blog-page .muted{color:var(--muted)}
.single-blog-page .chip{display:inline-flex;gap:.4rem;align-items:center;padding:.25rem .6rem;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid var(--border);font-size:.85rem;color:#cbd5e1}
.single-blog-page .blog-details .blog-content h3{font-size: 20px;font-weight: 600;}
.single-blog-page .blog-details .blog-content p{color: var(--muted);font-size: 14px;}
.single-blog-page .blog-details .blog-content h4{font-size: 16px;font-weight: 600;}
.single-blog-page .blog-list .blog-image{overflow: hidden;position: relative;}
.single-blog-page .blog-list .list-heading h2{font-size: 22px;font-weight: 600;margin: 0;}
.single-blog-page .blog-list h3 {font-size: 15px;color: var(--dark-bg-color);font-weight: 600;margin: 10px 0 0 0;}
.single-blog-page .blog-list .blog-image img {object-fit: cover;transition: transform 0.5s ease;}
.single-blog-page .blog-list .blog-image:hover img {transform: scale(1.2);}
.single-blog-page .blog-list .chip {font-size: 12px;}
.single-blog-page .btn-primary{background:#6366f1;border-color:#6366f1;font-size: 14px;}
.single-blog-page input,.single-blog-page input:focus,
.single-blog-page textarea,.single-blog-page textarea:focus{background:transparent;color: var(--dark-bg-color);font-size: 14px;border-color: var(--border);}
.single-blog-page label.error{color: var(--brand-color-secondary);font-size: 13px;}
.single-blog-page label.success{color: forestgreen;font-size: 13px;}
@media screen and (max-width:767px){
    .single-blog-page .hero h1{font-size: 30px;}
    .single-blog-page .blog-list .list-heading{margin-top: 30px;}
}
/* =====================How We Works Page======================= */
.how-we-work .section{padding-block:4rem}
.how-we-work .eyebrow{letter-spacing:.18em;color:#c7d2fe;text-transform:uppercase;font-weight:700}
.how-we-work .obj-lg{width:100%;max-height:360px;object-fit:cover;border-radius :1rem;}
.how-we-work .glass{background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05)); border:1px solid var(--border); border-radius:1rem; box-shadow:0 10px 30px rgba(0,0,0,.35); position:relative; overflow:hidden}
.how-we-work .muted{color:var(--muted)}
.how-we-work .pill{display:inline-flex;align-items:center;justify-content:center;background:var(--soft);border:1px solid var(--border);border-radius:999px;padding:.4rem .75rem;color:#cbd5e1;font-size: 13px;}
.how-we-work h1{font-size: 44px;}
.how-we-work h2{font-size: 33px;font-weight: 700;}
.how-we-work h5{font-weight: 700;font-size: 18px; letter-spacing: 0.5px;}

.how-we-work .hero-section {background:linear-gradient(90deg, rgba(99,102,241,.25), transparent 40%, rgba(217,70,239,.25))}
.how-we-work .hero-section p{font-size: 16px;}

.how-we-work .step { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:12px; padding:24px; text-align:center; transition:all .2s; }
.how-we-work .step:hover { background:rgba(255,255,255,0.06); transform:translateY(-4px); }
.how-we-work .step-icon { width:60px; height:60px; border-radius:12px; display:flex; align-items:center; justify-content:center; margin:0 auto 16px; font-size:26px; background:linear-gradient(135deg,#3b82f6,#8b5cf6); color:#fff; }
.how-we-work .step h4 { font-weight:700; margin-bottom:10px;font-size: 18px;}
.how-we-work .step p { color:#b0b7c9; font-size:13px; }

.how-we-work .engagement p{font-size: 14px;}
.how-we-work .engagement li{font-size: 13px; margin: 0 0 3px 0;}

.how-we-work .cta { background:linear-gradient(90deg, rgba(99,102,241,.25), transparent 40%, rgba(217,70,239,.25)); text-align:center; color:#fff; padding:50px 20px; margin-top:40px; }
.how-we-work .cta h2 {margin-bottom:14px; }
.how-we-work .cta p { margin-bottom:22px; }
.how-we-work .btn{background-color: var(--brand-color); color: var(--dark-bg-color); font-size: 14px; font-weight: 500; padding: 6px 35px;}
.how-we-work .btn:hover{background-color: var(--indigo);}
@media screen and (max-width:767px){
    .how-we-work h1{font-size: 30px;}
    .how-we-work h2{font-size: 28px;}
}

/* =====================Services Page Page======================= */


/* ================== User Login Page ================ */
.login-page .brand {font-weight: 800;letter-spacing: .3px}
.login-page .auth-wrap{width:100%;max-width:440px;margin:2rem}
.login-page .glass{background:rgba(255,255,255,.06);border:1px solid #ffffff1a;border-radius:1rem;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.login-page .hero{padding:1.75rem;border-bottom:1px solid #ffffff1a;background:linear-gradient(90deg,rgba(99,102,241,.25),transparent 40%,rgba(217,70,239,.25));border-top-left-radius:1rem;border-top-right-radius:1rem}
.login-page .muted{color:var(--muted)}
.login-page  input{background:transparent;color:#fff;border:1px solid var(--border);font-size: 14px;}
.login-page input:focus{background:transparent;color:#fff;}
.login-page input::placeholder{color:#cbd5e1}
.login-page a{color:var(--brand-color-secondary);font-size: 14px;}
.login-page label.error{color:red;font-size: 14px; margin: 4px 0 0 0;}
.login-page .btn{background-color: var(--brand-color);color: var(--dark-bg-color);border: none;}
.login-page .btn:hover{background-color: var(--brand-color);color: var(--dark-bg-color);}
@media screen and (max-width:767px){
    .login-page .auth-wrap{width:100%;max-width:440px;margin:4rem 0}
}

/* ================== User Register Page ================ */
.register-page .auth-wrap{width:100%;max-width:540px;margin:2rem}
.register-page .glass{background:rgba(255,255,255,.06);border:1px solid #ffffff1a;border-radius:1rem;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.register-page .hero{padding:1.2rem;border-bottom:1px solid #ffffff1a;;background:linear-gradient(90deg,rgba(99,102,241,.25),transparent 40%,rgba(217,70,239,.25));border-top-left-radius:1rem;border-top-right-radius:1rem}
.register-page .muted{color:var(--muted)}
.register-page .brand{font-weight:800;letter-spacing:.3px}
.register-page input,.register-page select{background:transparent;color:#fff;border:1px solid var(--border);font-size: 13px;}
.register-page input:focus{background:transparent;color:#fff;}
.register-page input::placeholder{color:#cbd5e1}
.register-page label{font-size: 13px;}
.register-page .country_code{background:transparent; font-size: 13px;border:1px solid var(--border);color: var(--muted);}
.register-page label.error{color:red;font-size: 12px; margin: 4px 0 0 0;}
.register-page .btn{background-color: var(--brand-color);color: var(--dark-bg-color);border: none; padding: 5px 25px;}
.register-page .btn:hover{background-color: var(--brand-color);color: var(--dark-bg-color);}
.register-page select option{background-color: rgba(32, 32, 32, 0.683);}
.register-page a{color:var(--brand-color-secondary);font-size: 14px;font-weight: 500;}
@media screen and (max-width:767px){
    .register-page .auth-wrap{margin:2rem 0}
}
/* ================== Forgot/Reset Password Page ================ */
.forgot-pass-page .auth-wrap{width:100%;max-width:460px;margin:2rem}
.forgot-pass-page .glass{background:rgba(255,255,255,.06);border:1px solid #ffffff1a;border-radius:1rem;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.forgot-pass-page .hero{padding:1.2rem;border-bottom:1px solid #ffffff1a;;background:linear-gradient(90deg,rgba(99,102,241,.25),transparent 40%,rgba(217,70,239,.25));border-top-left-radius:1rem;border-top-right-radius:1rem}
.forgot-pass-page .muted{color:var(--muted);font-size: 13px;}
.forgot-pass-page .brand{font-weight:800;letter-spacing:.3px}
.forgot-pass-page label{font-size: 13px;}
.forgot-pass-page input{background:transparent;color:#fff;border:1px solid var(--border);font-size: 13px;}
.forgot-pass-page input:focus{background:transparent;color:#fff;}
.forgot-pass-page input::placeholder{color:#cbd5e1}
.forgot-pass-page .btn{background-color: var(--brand-color);color: var(--dark-bg-color);border: none; font-size: 14px; font-weight: 500;}
.forgot-pass-page .btn:hover{background-color: var(--brand-color);color: var(--dark-bg-color);}
.forgot-pass-page label.error{color:red;font-size: 12px; margin: 4px 0 0 0;}
@media screen and (max-width:767px){
    .forgot-pass-page .auth-wrap{margin:2rem 0}
}
/* ================== Dashboard all code ================ */
/* ---user sidebar--- */
/* --- Sidebar --- */
.user-sidebar{
    background: linear-gradient(180deg, rgba(15,20,35,.98), rgba(10,14,26,.95));
    min-height: 100vh;
    overflow-y: auto;
    border-right: 1px solid var(--border);
    position: sticky;
    top: 0;
    z-index: 100;
}
.user-sidebar .sidebar-inner{
    padding: 24px 16px;
    display: flex;
    flex-direction: column;
    height: 100%;
}
.user-sidebar .user-profile{
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 0 24px 0;
    margin: 0 0 16px 0;
    border-bottom: 1px solid var(--border);
}
.user-sidebar .user-profile .avatar{
    flex-shrink: 0;
}
.user-sidebar .user-profile .avatar img{
    width: 44px;
    height: 44px;
    border-radius: 12px;
    object-fit: cover;
    border: 2px solid rgba(255,255,255,.08);
}
.user-sidebar .user-profile .user-meta{
    flex: 1;
    min-width: 0;
}
.user-sidebar .user-profile .user-meta .greeting{
    display: block;
    font-size: 11px;
    color: var(--muted);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .5px;
    margin: 0 0 2px 0;
}
.user-sidebar .user-profile .user-meta h3{
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.user-sidebar .nav-list{
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.user-sidebar .nav-list li a{
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    border-radius: 10px;
    color: rgba(255,255,255,.6);
    font-weight: 500;
    font-size: 13px;
    transition: all .25s ease;
    text-decoration: none;
}
.user-sidebar .nav-list li a .icon-wrap{
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: rgba(255,255,255,.04);
    font-size: 14px;
    flex-shrink: 0;
    transition: all .25s ease;
}
.user-sidebar .nav-list li a:hover{
    color: #fff;
    background: rgba(255,255,255,.06);
}
.user-sidebar .nav-list li a:hover .icon-wrap{
    background: rgba(255,255,255,.1);
}
.user-sidebar .nav-list li.active a{
    color: #fff;
    background: linear-gradient(90deg, rgba(30,76,255,.2), transparent);
    border-left: 3px solid var(--brand-color);
}
.user-sidebar .nav-list li.active a .icon-wrap{
    background: var(--brand-color);
    color: #fff;
}
.user-sidebar .nav-list li.logout-item{
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}
.user-sidebar .nav-list li.logout-item a{
    color: rgba(255,255,255,.4);
}
.user-sidebar .nav-list li.logout-item a:hover{
    color: #ef4444;
    background: rgba(239,68,68,.1);
}
.user-sidebar .nav-list li.logout-item a:hover .icon-wrap{
    background: rgba(239,68,68,.15);
    color: #ef4444;
}

/* --- Dashboard page --- */
.dashboard-page{min-height: 90vh; padding-top: 20px;}

/* Stats row */
.dashboard-page .stats-row{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
    padding: 0 24px;
    margin: 0 0 28px 0;
}
.dashboard-page .stat-card{
    background: linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 16px;
    transition: all .3s ease;
}
.dashboard-page .stat-card:hover{
    border-color: rgba(255,255,255,.12);
    transform: translateY(-2px);
    background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
}
.dashboard-page .stat-card .stat-icon{
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    flex-shrink: 0;
}
.dashboard-page .stat-card .stat-icon.orders{background: rgba(30,76,255,.15); color: var(--brand-color);}
.dashboard-page .stat-card .stat-icon.active{background: rgba(34,197,94,.15); color: #22c55e;}
.dashboard-page .stat-card .stat-icon.subs{background: rgba(99,102,241,.15); color: #818cf8;}
.dashboard-page .stat-card .stat-icon.address{background: rgba(250,155,39,.15); color: var(--brand-color-secondary);}
.dashboard-page .stat-card .stat-body{
    display: flex;
    flex-direction: column;
}
.dashboard-page .stat-card .stat-value{
    font-size: 26px;
    font-weight: 800;
    color: #fff;
    line-height: 1;
    letter-spacing: -.02em;
}
.dashboard-page .stat-card .stat-label{
    font-size: 12px;
    color: var(--muted);
    font-weight: 500;
    margin-top: 4px;
}

/* Dashboard cards */
.dashboard-page .card{background-color: var(--glass);border-radius: 1rem;border: 1px solid var(--border);}
.dashboard-page .hero{border-radius: 1rem 1rem 0 0;padding: 1.2rem;border-bottom: 1px solid #ffffff1a;background: linear-gradient(90deg, rgba(99, 102, 241, .25), transparent 40%, rgba(217, 70, 239, .25));}
.dashboard-page .user-info h2{font-size: 18px;text-transform: uppercase;font-weight: 700;color: #fff;}
.dashboard-page .user-info input{font-size: 12px;background-color: transparent;color: #fff;}
.dashboard-page .user-info label{font-size: 12px;font-weight: 500;color: var(--muted);}
.dashboard-page .user-info .btn-outline-success{
    font-size: 14px;
    font-weight: 600;
    min-width: 78px;
    border-radius: 0;
    border: 1px solid var(--brand-color) !important;
    --bs-btn-color: #fff !important;
    --bs-btn-active-bg: var(--brand-color) !important;
    --bs-btn-active-color: #fff !important;
}
.dashboard-page .user-info .edit-btn{
    background-color: var(--brand-color);
    color: #fff;
    padding: 7px 25px;
    font-size: 12px;
    transition: all 0.3s ease-in-out;
    font-weight: 500;
}
.dashboard-page .user-info .edit-btn:hover,.dashboard-page .add-address .btn:hover{
    background-color: var(--brand-hover-color);
}
.dashboard-page .add-address h3{
    font-size: 16px;
    font-weight: 700;
    color: #fff;
}
.dashboard-page .add-address .btn{
    background-color: var(--brand-color);
    color: #fff;
    padding: 7px 30px;
    font-size: 12px;
    transition: all 0.3s ease-in-out;
    font-weight: 500;
    margin: 20px 0 0 0;
}
@media screen and (max-width:767px){
    .dashboard-page .stats-row{
        grid-template-columns: 1fr 1fr;
        padding: 15px 12px 0 12px;
    }
    .dashboard-page{
        padding: 0 10px !important;
    }
    .dashboard-page .user-info .edit-btn{
        width: 100%;
        margin: 10px 0 0 0;
    }
}

/* ---address page--- */
.user-address-page .card{background:var(--glass); border:1px solid var(--border); border-radius:1.5rem}
.user-address-page .hero{border-radius: 1rem 1rem 0 0;padding: 1.2rem;border-bottom: 1px solid #ffffff1a;background: linear-gradient(90deg, rgba(99, 102, 241, .25), transparent 40%, rgba(217, 70, 239, .25));}
.user-address-page  h2{font-size: 18px;text-transform: uppercase;font-weight: 600;color: var(--dark-bg-color);}
.user-address-page .details{padding: 20px 40px 40px 40px;}
.user-address-page input,.user-address-page input:focus,.user-address-page select,.user-address-page select:focus{font-size: 13px;background: rgba(255,255,255,.04);color: #fff;border: 1px solid var(--border);border-radius: 8px;}
.user-address-page input:focus,.user-address-page select:focus{border-color: var(--brand-color);box-shadow: none;}
.user-address-page select option{background: #1a1f2e;color: #fff;}
.user-address-page .label{font-size: 13px;font-weight: 500;margin: 0 0 5px 0;}
.user-address-page label.error{font-size: 13px;color: red;}
.user-address-page .edit-btn{background-color: var(--brand-color);color: #fff;padding: 5px 35px;font-size: 14px;transition: all 0.3s ease-in-out;font-weight: 500;margin: 10px 0 0 0;}
.user-address-page .edit-btn:hover{background-color: var(--brand-hover-color);color: #fff;}
.user-address-page .response-message{font-weight: 600; padding: 15px 40px 0 40px;}
@media screen and (max-width:767px){
    .user-address-page{padding: 0 15px;}
    .user-address-page .details{padding: 20px 15px 40px 15px;}
    .user-address-page .edit-btn{padding: 7px 0; width: 100%;}
    .user-address-page .response-message{padding: 15px 15px 0 15px;}
}
/* ---Change password page--- */
.change-pass-page .card{background: var(--glass);border-radius: 1rem;border: 1px solid var(--border);}
.change-pass-page .hero{border-radius: 1rem 1rem 0 0;padding: 1.4rem;border-bottom: 1px solid #ffffff1a;background: linear-gradient(90deg, rgba(99, 102, 241, .25), transparent 40%, rgba(217, 70, 239, .25));}
.change-pass-page .details{padding: 0 40px 40px 40px;}
.change-pass-page  h2{font-size: 18px;text-transform: uppercase;font-weight: 600;color: var(--dark-bg-color);}
.change-pass-page input,.change-pass-page input:focus{font-size: 13px;background: rgba(255,255,255,.04);color: #fff;border: 1px solid var(--border);border-radius: 8px;}
.change-pass-page input:focus{border-color: var(--brand-color);box-shadow: none;}
.change-pass-page .label{font-size: 13px;font-weight: 600;margin: 0 0 5px 0;color: var(--muted);}
.change-pass-page label.error{font-size: 13px;font-weight: 500;color: red;}
.change-pass-page .edit-btn{background-color: var(--brand-color);color: #fff;padding: 5px 35px;font-size: 14px;transition: all 0.3s ease-in-out;font-weight: 500;}
.change-pass-page .edit-btn:hover{background-color: var(--brand-hover-color);color: #fff;}
.change-pass-page .response-message{font-weight: 600;}
@media screen and (max-width:767px){
    .change-pass-page{padding: 50px 15px 50px 15px;}
    .change-pass-page .details{padding: 0 15px 40px 15px;}
    .change-pass-page  h2{font-size: 18px;text-align: center;}
    .change-pass-page .edit-btn{width: 100%;}
}
/* ---User profile page--- */
.user-profile-page .card{background-color: var(--glass);border-radius: 1rem;border: 1px solid var(--border);}
.user-profile-page .hero{border-radius: 1rem 1rem 0 0;padding: 1.3rem;border-bottom: 1px solid #ffffff1a;background: linear-gradient(90deg, rgba(99, 102, 241, .25), transparent 40%, rgba(217, 70, 239, .25));}
.user-profile-page h2{font-size: 18px;text-transform: uppercase;font-weight: 700;color: var(--dark-bg-color);margin: 0;}
.user-profile-page input,.user-profile-page input:focus,.user-profile-page select,.user-profile-page select:focus{font-size: 13px;background: rgba(255,255,255,.04);color: #fff;border: 1px solid var(--border);border-radius: 8px;}
.user-profile-page input:focus,.user-profile-page select:focus{border-color: var(--brand-color);box-shadow: none;}
.user-profile-page input.readonly{background: rgba(255,255,255,.06) !important;color: rgba(255,255,255,.6) !important;cursor: not-allowed;}
.user-profile-page label{font-size: 13px;font-weight: 500;margin: 0 0 5px 0;}
.user-profile-page ::-webkit-calendar-picker-indicator {filter: invert(1);}
.user-profile-page .btn-outline-success{
    font-size: 14px;
    font-weight: 600;
    min-width: 80px;
    border-radius: 0;
    border: 1px solid var(--brand-color) !important;
    --bs-btn-color: var(--dark-bg-color) !important;
    --bs-btn-active-bg: var(--brand-color) !important;
    --bs-btn-active-color: var(--dark-bg-color) !important;
}
.user-profile-page .edit-btn{background-color: var(--brand-color);color: #fff;padding: 8px 45px;font-size: 12px;transition: all 0.3s ease-in-out;font-weight: 500;}
.user-profile-page .edit-btn:hover{background-color: var(--brand-hover-color);color: #fff;}
@media screen and (max-width:767px){
    .user-profile-page{padding: 0 15px !important;}
    .user-profile-page .details{padding: 15px 15px 0 15px !important;}
    .user-profile-page .edit-btn{width: 100%;margin: 0 0 30px 0;}
}
/* ---Orders List page--- */
.user-orders-page  .order-list .hero {border-radius: 1rem 1rem 0 0;padding: 1rem;border-bottom: 1px solid #ffffff1a;background: linear-gradient(90deg, rgba(99, 102, 241, .25), transparent 40%, rgba(217, 70, 239, .25));margin: 15px 0 0 0;}
.user-orders-page  .order-list h2{font-size: 20px;}
.user-orders-page .order-list .card{padding: 15px 10px;background: var(--glass);border-color: var(--border);}
.user-orders-page .order-list .card a{color: var(--dark-bg-color);}
.user-orders-page .order-list .card a:hover{color: var(--muted);}
.user-orders-page .order-list .card img{max-width: 45px;border-radius: 100px;}
.user-orders-page .order-list .card p{margin: 0;font-weight: 600;}
.user-orders-page .order-list .card span{font-weight: 500;text-transform: capitalize;}

.user-orders-page .not-found .card{background-color: var(--glass);border-radius: 1rem;border-color: var(--border);}
.user-orders-page .not-found .hero {border-radius: 1rem 1rem 0 0;padding: 1.3rem;border-bottom: 1px solid #ffffff1a;background: linear-gradient(90deg, rgba(99, 102, 241, .25), transparent 40%, rgba(217, 70, 239, .25));}
.user-orders-page .not-found h1{font-weight: 600;font-size: 25px;}
.user-orders-page .not-found h2{font-weight: 600;font-size: 22px;margin: 0;padding: 30px 0;}
.user-orders-page .not-found .btn{font-weight: 500;background-color: var(--brand-color) !important;border-radius: 8px;padding: 8px 30px;font-size: 13px;}
.user-orders-page .not-found .btn:hover{font-weight: 500;background-color: var(--brand-hover-color) !important;
}
@media screen and (max-width:767px){
    .user-orders-page .order-list .card span{font-size: 12px;}
}

/* ---Orders Details page--- */
.user-orders-page  .order-details h2{font-size: 20px;}
.user-orders-page .order-details .hero {border-radius: 1rem 1rem 0 0;padding: 1.3rem;border-bottom: 1px solid #ffffff1a;background: linear-gradient(90deg, rgba(99, 102, 241, .25), transparent 40%, rgba(217, 70, 239, .25));}
.user-orders-page .order-details .card{padding: 0 0 15px 0;background: var(--glass);border-color: var(--border);border-radius: 1rem 1rem .5rem .5rem;}
.user-orders-page .order-details .card .product-name a{color: var(--dark-bg-color);font-weight: 700;text-decoration: underline;}
.user-orders-page .order-details .card a:hover{color: var(--indigo-600);}
.user-orders-page .order-details .card img{max-width: 40px;border-radius: 100px;width: 100%;}
.user-orders-page .order-details .card p{margin: 0 0 4px 0;font-weight: 500;font-size: 13px;}
.user-orders-page .order-details .card span{font-weight: 500;text-transform: capitalize;font-size: 12px;}
.user-orders-page .order-details .card .ext-link a{color: var(--dark-bg-color);font-weight: 600;font-size: 14px;text-decoration: underline;}
.user-orders-page .order-details .card .ext-link a:hover{color: var(--indigo-600);}
.user-orders-page .order-details .billing-add{font-size: 20px;text-transform: uppercase;font-weight: 700;margin: 30px 0 10px 0;}

/* ---Subscriptions Details page--- */
.user-subscription .not-found .card{background: var(--glass);border-color: var(--border);border-radius: 1rem 1rem .5rem .5rem;}
.user-subscription .not-found .hero {border-radius: 1rem 1rem 0 0;padding: 1.3rem;border-bottom: 1px solid #ffffff1a;background: linear-gradient(90deg, rgba(99, 102, 241, .25), transparent 40%, rgba(217, 70, 239, .25));}
.user-subscription .not-found h1{font-size: 25px; font-weight: 600; margin: 0;}
.user-subscription .not-found h2{font-weight: 600;font-size: 22px;margin: 0;padding: 30px 0;}
.user-subscription .not-found .btn:hover{background: var(--indigo-600) !important;}

.user-subscription .slist .hero{border-radius: 1rem 1rem 0 0;padding: 1rem;border-bottom: 1px solid #ffffff1a;background: linear-gradient(90deg, rgba(99, 102, 241, .25), transparent 40%, rgba(217, 70, 239, .25));}
.user-subscription .slist .hero h2{font-weight: 600;font-size: 24px;}
.user-subscription .slist .hero p{font-size: 13px;}
.user-subscription .slist .card{background: var(--glass);border: 1px solid var(--border);border-radius: 12px;transition: all .25s ease;}
.user-subscription .slist .card:hover{border-color: rgba(255,255,255,.12);background: rgba(255,255,255,.08);}
.user-subscription .slist .card a{text-decoration: none;display: block;padding: 16px;}
.user-subscription .slist .card a:hover{text-decoration: none;}
.user-subscription .slist .card img{width: 40px;height: 40px;border-radius: 10px;object-fit: cover;}
.user-subscription .slist .card h6{font-weight: 700; font-size: 15px; padding: 0 0 4px 0;color: #fff;}
.user-subscription .slist .card p{color: rgba(255,255,255,.7);font-size: 13px;}
.user-subscription .slist .card p.muted{font-size: 12px; color: var(--muted); padding: 3px 0 5px 0;}
.user-subscription .slist .card p.amt{font-weight: 700; font-size: 18px;color: #fff;padding: 0 0 4px 0;}
.user-subscription .slist .card .badge{font-size: 10px;padding: 3px 8px;}
.user-subscription .slist .card span.muted{color: var(--muted)}
@media screen and (max-width:767px){
    .user-subscription .slist .card{padding: 5px 0;}
    .user-subscription .slist .card .bot-col{padding-top: 18px;} 
    .user-subscription .slist .card p{font-size: 13px;} 
}

.user-subscription .ssd{background: var(--glass);border-color: var(--border);border-radius: 1rem}
.user-subscription .ssd .top-det h2{font-size: 22px; font-weight: 600; padding: 15px 0 0 0;}
.user-subscription .ssd .top-det p{font-size: 13px; color: var(--muted);}
.user-subscription .ssd .section h3{font-size: 16px; font-weight: 600; margin: 25px 0 15px 0;}
.user-subscription .ssd .section td{color: var(--dark-bg-color);border: none; color: var(--muted); font-size: 13px; padding: 0 0 4px 0;}
.user-subscription .ssd .section td:first-child{font-weight: 600;}
.user-subscription .ssd .section span{border-radius: 5px; padding: 2px 13px;}
.user-subscription .ssd .billing-section p{font-size: 13px; color: var(--muted); margin: 0 0 4px 0;}

/* ---User Payment Details page--- */
.user-payment-list table th,.user-payment-list table td{font-size: 13px;}
.user-payment-list table span{font-size: 12px;padding: 2px 8px;border-radius: 4px;}
.user-payment-list .glass{background: var(--glass);border-color: var(--border);border-radius: 1rem;margin:0 0 20px 0;padding: 15px;}
.user-payment-list .glass p{margin:2px 0;}
.user-payment-list .glass span{font-size: 12px;padding: 2px 8px;border-radius: 4px;margin: 0 0 0 10px;}

/* ---User Support Details page--- */
.user-support-ct .create-ticket .hero{border-radius: 1rem 1rem 0 0;padding: 1rem;border-bottom: 1px solid #ffffff1a;background: linear-gradient(90deg, rgba(99, 102, 241, .25), transparent 40%, rgba(217, 70, 239, .25));}
.user-support-ct .create-ticket .hero h2{font-weight: 600;font-size: 24px;}
.user-support-ct .create-ticket .glass{padding: 25px 0;background: var(--glass);border-color: var(--border);border-radius: 1rem;}
.user-support-ct .create-ticket label{color: var(--muted);font-size: 14px;margin: 0 0 5px 0;}
.user-support-ct .create-ticket input,.user-support-ct .create-ticket select,.user-support-ct .create-ticket textarea{font-size: 14px;}
.user-support-ct .create-ticket .readonly,.user-support-ct .create-ticket .readonly:focus{background: #cdcdcd;}
.user-support-ct .ticket-list{background: var(--glass);border-color: var(--border);border-radius: 1rem;}
.user-support-ct .ticket-list input,.user-support-ct .ticket-list .form-control{font-size: 13px;background: rgba(255,255,255,.04);border: 1px solid var(--border);color: #fff;border-radius: 8px;}
.user-support-ct .ticket-list .form-control:focus{background: rgba(255,255,255,.06);border-color: var(--brand-color);box-shadow: none;color: #fff;}
.user-support-ct .ticket-list .glass-card .btn-primary{background: var(--brand-color);border: none;border-radius: 8px;padding: 8px 24px;font-size: 13px;font-weight: 500;transition: all .2s ease;}
.user-support-ct .ticket-list .glass-card .btn-primary:hover{background: var(--brand-hover-color);}
.user-support-ct .ticket-list .btn{font-size: 13px;}
.user-support-ct .ticket-list td,.user-support-ct .ticket-list th{font-size: 13px;}
.user-support-ct .ticket-list table span{font-weight: 500;}
.user-support-ct .ticket-list table span.customer{color: var(--brand-color-secondary);}

.user-support-ct .create-ticket .not-found h2{font-size: 25px;font-weight: 600;padding: 20px 0 0 0;}
.user-support-ct .create-ticket .not-found .btn{font-size: 13px; margin: 25px 0 30px 0;}
.user-support-ct .btn-primary{background: var(--brand-color);border: none;border-radius: 8px;font-weight: 500;font-size: 14px;padding: 8px 30px;transition: all .2s ease;}
.user-support-ct .btn-primary:hover{background: var(--brand-hover-color);}
.user-support-ct .btn-secondary{background: rgba(255,255,255,.08);border: none;border-radius: 8px;font-weight: 500;font-size: 14px;padding: 8px 30px;color: #fff;transition: all .2s ease;}
.user-support-ct .btn-secondary:hover{background: rgba(255,255,255,.15);color: #fff;}
.user-support-ct .glass input,.user-support-ct .glass select,.user-support-ct .glass textarea{background: rgba(255,255,255,.04);border: 1px solid var(--border);color: #fff;font-size: 14px;border-radius: 8px;}
.user-support-ct .glass input:focus,.user-support-ct .glass select:focus,.user-support-ct .glass textarea:focus{background: rgba(255,255,255,.06);border-color: var(--brand-color);box-shadow: none;color: #fff;}

.user-support-ct .tdetails .glass{padding: 17px;background: var(--glass);border-color: var(--border);border-radius: .7rem;}
.user-support-ct .tdetails .glass h3{font-size: 16px;}
.user-support-ct .tdetails .glass h3>small{font-size: 13px; font-weight: 400;}
.user-support-ct .tdetails .glass .date{font-size: 13px; font-weight: 400;}
.user-support-ct .tdetails .bordered{border: 1px solid var(--border);border-radius: 12px;overflow: hidden;}
.user-support-ct .tdetails .msg{padding: 17px;color: rgba(255,255,255,.8);font-size: 14px;}
.user-support-ct .tdetails .glass h4{font-size: 18px; font-weight: 600;}
.user-support-ct .tdetails form{padding: 0 17px 17px;}
.user-support-ct .tdetails label{color: var(--muted);font-size: 14px;margin: 0 0 5px 0;}
.user-support-ct .tdetails input,.user-support-ct .tdetails textarea,.user-support-ct .tdetails select{font-size: 14px;background: rgba(255,255,255,.04);border: 1px solid var(--border);color: #fff;border-radius: 8px;}
.user-support-ct .tdetails input:focus,.user-support-ct .tdetails textarea:focus,.user-support-ct .tdetails select:focus{background: rgba(255,255,255,.06);border-color: var(--brand-color);box-shadow: none;color: #fff;}
.user-support-ct .tdetails .readonly,.user-support-ct .tdetails .readonly:focus{background: rgba(255,255,255,.06) !important;color: rgba(255,255,255,.6) !important;cursor: not-allowed;}
.user-support-ct .tdetails .btn{padding: 8px 30px; font-size: 14px; font-weight: 500; border-radius: 8px;}
.user-support-ct .tdetails .btn-secondary{background: rgba(255,255,255,.08);border: none;color: #fff;}
.user-support-ct .tdetails .btn-secondary:hover{background: rgba(255,255,255,.15);color: #fff;}
.user-support-ct .tdetails .btn-primary{background: var(--brand-color);border: none;color: #fff;}
.user-support-ct .tdetails .btn-primary:hover{background: var(--brand-hover-color);}
.user-support-ct .tdetails .alert p{font-size: 13px; font-weight: 500;}

/* ---User Notification Details page--- */
.user-notification .hero{border-radius: 1rem 1rem 0 0;padding: 1.2rem;border-bottom: 1px solid #ffffff1a;background: linear-gradient(90deg, rgba(99, 102, 241, .25), transparent 40%, rgba(217, 70, 239, .25));}
.user-notification .hero h2{font-weight: 600;font-size: 24px;}
.user-notification .hero .text-success,.user-notification .hero .text-danger{font-weight: 600;}
.user-notification fieldset{border: 1px solid var(--border); margin: 0 0 15px 0; border-radius: 12px; padding: 16px;background: rgba(255,255,255,.03);}
.user-notification legend{font-weight: 700;font-size: 16px;color: #fff;padding: 0;}
.user-notification legend p{margin: 0 0 5px 0 !important;}
.user-notification .helper{font-size: 13px;color: var(--muted);margin: 2px 0 12px 0;}
.user-notification .custom-outline-btn {border-color: rgba(255,255,255,.3);padding: 5px 20px;font-size: 12px;font-weight: 500;border-radius: 8px;color: #fff;transition: all .2s ease;}
.user-notification .custom-outline-btn:hover {border-color: var(--brand-color);background-color: var(--brand-color);color: #fff;}
.user-notification .custom-outline-btn:active,
.user-notification .custom-outline-btn.active,
.user-notification .custom-outline-btn:focus {border-color: var(--brand-color);background-color: var(--brand-color);color: #fff;}
.user-notification .btn-primary{background: var(--brand-color);border: none;border-radius: 8px;padding: 8px 30px;font-weight: 600;font-size: 13px;transition: all .2s ease;}
.user-notification .btn-primary:hover{background: var(--brand-hover-color);}
@media screen and (max-width:767px){
    .user-notification form button{margin: 0 15px 0 0;}
}

/* --- Shared dashboard components --- */
.glass-card{
    background: var(--glass);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 20px;
}
.badge{
    font-weight: 600;
    font-size: 11px;
    padding: 4px 10px;
    border-radius: 6px;
    text-transform: capitalize;
}

/* Order cards (clickable list items) */
.order-card{
    display: block;
    background: var(--glass);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 16px 20px;
    margin: 0 0 10px 0;
    text-decoration: none;
    transition: all .25s ease;
}
.order-card:hover{
    border-color: rgba(255,255,255,.12);
    background: rgba(255,255,255,.08);
    transform: translateY(-1px);
}
.order-card img{
    width: 40px;
    height: 40px;
    border-radius: 10px;
    object-fit: cover;
}
.order-card .order-id{font-weight: 700;color: #fff;font-size: 14px;}
.order-card .order-name{color: rgba(255,255,255,.7);font-size: 13px;font-weight: 500;}
.order-card .order-price{color: #fff;font-weight: 700;font-size: 14px;}
.order-card .order-date{color: var(--muted);font-size: 12px;}
.order-card .badge{font-size: 10px;padding: 3px 8px;}
.order-card .fa-chevron-right{color: var(--muted);font-size: 11px;}

/* Order detail rows */
.detail-row{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 0;
    border-bottom: 1px solid rgba(255,255,255,.04);
}
.detail-row:last-child{border-bottom: none;}
.detail-label{color: var(--muted);font-size: 13px;font-weight: 500;}
.detail-value{color: #fff;font-size: 13px;font-weight: 600;text-align: right;}
.billing-add{font-size: 16px;font-weight: 700;color: #fff;}
.support-link{color: var(--brand-color);font-size: 14px;font-weight: 500;text-decoration: none;}
.support-link:hover{color: var(--brand-hover-color);text-decoration: underline;}

/* Dark theme tables */
.dark-table{
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    color: #fff;
}
.dark-table thead th{
    background: rgba(255,255,255,.04);
    color: var(--muted);
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .5px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--border);
}
.dark-table tbody td{
    padding: 12px 14px;
    border-bottom: 1px solid rgba(255,255,255,.04);
    font-size: 13px;
    color: rgba(255,255,255,.8);
    vertical-align: middle;
}
.dark-table tbody tr:hover td{
    background: rgba(255,255,255,.03);
}
.dark-table tbody td a{
    color: #fff;
    text-decoration: none;
}
.dark-table tbody td a:hover{
    color: var(--brand-color);
}
.table-wrapper{
    background: var(--glass);
    border: 1px solid var(--border);
    border-radius: 12px;
    overflow: hidden;
}

/* Ticket status badges */
.ticket-status{font-size: 12px;font-weight: 500;padding: 3px 10px;border-radius: 6px;display: inline-block;}
.ticket-status.new{color: #60a5fa;background: rgba(96,165,250,.12);}
.ticket-status.answered{color: #34d399;background: rgba(52,211,153,.12);}
.ticket-status.customer-reply{color: #fbbf24;background: rgba(251,191,36,.12);}
.ticket-status.closed{color: var(--muted);background: rgba(161,161,170,.12);}

/* Dark form controls for dashboard */
.user-support-ct .glass-card select option,
.user-address-page select option,
.user-profile-page select option{
    background: #1a1f2e;
    color: #fff;
}

/* ===========================New Design=============================== */

/* ----Index Page---- */
.index-page .section{padding-block:5rem}
.index-page .nd-top-section .eyebrow{letter-spacing:.18em;color:var(--dark-bg-color);text-transform:uppercase; font-weight:600;background-color: var(--brand-color);font-size: 10px;padding: 2px 15px;}

.index-page .nd-top-section .title-hero{font-size: 42px;font-weight:700;margin: 20px 0 0 0;}
.index-page .nd-top-section .subtitle{font-size: 14px;font-weight:500;margin: 20px 0 20px 0;}
.index-page .contact-us-btn{background-color: var(--brand-color);color: var(--dark-bg-color);font-size: 14px;font-weight: 500;letter-spacing: 1px;max-height: 35px;width: 200px;border: none;}
.index-page .nd-top-section .contact-us-btn:hover{background-color: var(--indigo) !important;}
.index-page .nd-top-section .btn-outline-light{font-size: 14px;font-weight: 500;letter-spacing: 1px; max-height: 35px;background-color: var(--dark-bg-color);color: var(--bg);border: none;}
.index-page .nd-top-section .btn-outline-light:hover{background-color: #d8dde2 !important;color: var(--bg);}
.index-page .nd-top-section .d-inline-flex{color: var(--dark-bg-color);}
.index-page .nd-top-section .glass{background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05)); border:1px solid var(--border); border-radius:1.5rem}
/* .index-page .nd-top-section .glow-1,.index-page .nd-top-section .glow-2{position:absolute;filter:blur(70px);z-index:0}
.index-page .nd-top-section .glow-1{top:-80px;left:50%;transform:translateX(-50%);width:80vw;height:260px;background:rgba(99,102,241,.25);border-radius:999px}
.index-page .nd-top-section .glow-2{right:-40px;bottom:-40px;width:60vw;height:220px;background:rgba(217,70,239,.20);border-radius:999px} */
.index-page .nd-top-section .link-light:hover{color:#fff!important}

.index-page .nd-wcu .eyebrow{letter-spacing: .18em;color: #c7d2fe;text-transform: uppercase;font-weight: 700;}
.index-page .nd-wcu h2{font-weight: 700;font-size: 33px;}
.index-page .nd-wcu h3{font-size: 17px;font-weight: 600;}
.index-page .nd-wcu p{font-size: 11px;color:var(--muted);}
.index-page .nd-wcu .glass{background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05)); border:1px solid var(--border); border-radius:1.5rem}
.index-page .nd-wcu .card-soft{background:var(--soft); border:1px solid var(--border); border-radius:1.5rem}
.index-page .nd-wcu .card-glow{position:relative; overflow:hidden}
.index-page .nd-wcu .card-glow::after{content:""; position:absolute; inset:0; background:linear-gradient(45deg, transparent, rgba(99,102,241,.08), transparent); opacity:0; transition:opacity .25s}
.index-page .nd-wcu .card-glow:hover::after{opacity:1}
.index-page .nd-wcu .icon-wrap{width:48px;height:48px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;background:rgba(99,102,241,.2);border:1px solid rgba(129,140,248,.3)}

.index-page .nd-our-services .eyebrow{letter-spacing: .18em;color: #c7d2fe;text-transform: uppercase;font-weight: 700;}
.index-page .nd-our-services h2{font-weight: 700;font-size: 33px;}
.index-page .nd-our-services .section h3{font-size: 17px;}
.index-page .nd-our-services .section p{font-size: 13px;color:var(--muted);}
.index-page .nd-our-services .glass{background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05)); border:1px solid var(--border); border-radius:1.5rem}
.index-page .nd-our-services .card-soft{background:var(--soft); border:1px solid var(--border); border-radius:1.5rem}
.index-page .nd-our-services .card-glow{position:relative; overflow:hidden}
.index-page .nd-our-services .card-glow::after {content: "";position: absolute;inset: 0;background: linear-gradient(45deg, transparent, rgba(99,102,241,.08), transparent);opacity: 0;transition: opacity .25s;pointer-events: none;}
.index-page .nd-our-services .card-glow:hover::after{opacity:1}
.index-page .nd-our-services .icon-wrap{width:48px;height:48px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;background:rgba(99,102,241,.2);border:1px solid rgba(129,140,248,.3)}
.index-page .nd-our-services .obj{width:100%;height:180px;object-fit:cover}

.index-page .nd-industries .industry-pill{background:var(--soft);border:1px solid var(--border);border-radius:1rem;padding:1rem;text-align:center;color:#cbd5e1}

.index-page .nd-case-study .eyebrow{letter-spacing: .18em;color: #c7d2fe;text-transform: uppercase;font-weight: 700;}
.index-page .nd-case-study h2{font-weight: 700;font-size: 33px;}
.index-page .nd-our-services .section h3{font-size: 17px;}
.index-page .nd-our-services .section p{font-size: 13px;color:var(--muted);}
.index-page .nd-case-study .glass{background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05)); border:1px solid var(--border); border-radius:1.5rem}
.index-page .nd-case-study .obj{width:100%;max-height:160px;object-fit:cover}

.index-page .nd-stats .stats-pill{background:var(--soft);border:1px solid var(--border);border-radius:1rem;padding:1.25rem}

.index-page .nd-work-process .eyebrow{letter-spacing: .18em;color: #c7d2fe;text-transform: uppercase;font-weight: 700;}
.index-page .nd-work-process h2{font-weight: 700;font-size: 33px;}
.index-page .nd-work-process h5{font-size: 17px;}
.index-page .nd-work-process  p{font-size: 13px;color:var(--muted);}
.index-page .nd-work-process .card-soft{background:var(--soft); border:1px solid var(--border); border-radius:1.5rem}
.index-page .nd-work-process .step-num{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:.6rem;background:rgba(99,102,241,.2);border:1px solid rgba(129,140,248,.3);margin-bottom:.5rem}

.index-page .nd-testimonial .eyebrow{letter-spacing: .18em;color: #c7d2fe;text-transform: uppercase;font-weight: 700}
.index-page .nd-testimonial h2{font-weight: 700;font-size: 33px; margin: 0 0 50px 0}
.index-page .nd-testimonial .comment {color: var(--muted);font-size: 13px}
.index-page .nd-testimonial .company-name{color: var(--muted);font-size: 12px;padding: 3px 0 0 0}
.index-page .nd-testimonial .glass{background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05)); border:1px solid var(--border); border-radius:1.5rem;min-height: 260px;}
.index-page .nd-testimonial .slick-list{margin: 0 -10px; }
.index-page .nd-testimonial .slick-slide{padding: 0 15px;}
.index-page .nd-testimonial .slick-dots {display: flex;justify-content: center;margin: 30px 0 0 0;list-style-type: none;}
.index-page .nd-testimonial .slick-dots button{display: none;}
.index-page .nd-testimonial .slick-dots li{background: var(--muted); height: 10px; width: 10px; margin: 0 10px 0 0; border-radius: 100%;}
.index-page .nd-testimonial .slick-dots .slick-active{background: var(--indigo-600);}

.index-page .nd-blogs .eyebrow{letter-spacing: .18em;color: #c7d2fe;text-transform: uppercase;font-weight: 700}
.index-page .nd-blogs h2{font-weight: 700;font-size: 33px;}
.index-page .nd-blogs .glass{background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05)); border:1px solid var(--border); border-radius:1.5rem}
.index-page .nd-blogs .obj{width:100%;max-height:200px;object-fit:cover}
.index-page .nd-blogs h5{ font-size: 16px}
.index-page .nd-blogs .muted{color: var(--muted);font-size: 13px}
.index-page .nd-blogs .btn{padding: 5px 15px;margin: 5px 0 0 0;font-size: 13px;font-weight: 500;letter-spacing: 0.7px}
.index-page .nd-blogs .slick-list{margin: 0 -10px; }
.index-page .nd-blogs .slick-slide{padding: 0 20px;}
.index-page .nd-blogs .slides .slick-next{right: -33px;height: 35px;width: 35px;background: none;border: none;padding: 0;}
.index-page .nd-blogs .slides .slick-prev{left: -33px;height: 35px;width: 35px;z-index: 99;background: none;border: none;padding: 0;}
.index-page .nd-blogs .slides .slick-prev::before,.index-page .nd-blogs .slides .slick-next::before{display:none;content:none;}
.index-page .nd-blogs .slides .slick-next svg,.index-page .nd-blogs .slides .slick-prev svg{color: var(--muted);height: 35px;width: 35px;border: 2px solid var(--muted);border-radius: 100px;cursor: pointer;padding: 8px;}
.index-page .nd-blogs .slides .slick-next svg:hover,.index-page .nd-blogs .slides .slick-prev svg:hover{color: var(--indigo);border-color: var(--indigo);}

.index-page .cta-gradient{background:linear-gradient(90deg, rgba(99,102,241,.35), rgba(0,0,0,0) 40%, rgba(217,70,239,.35));border:1px solid var(--border);border-radius:1rem}
.index-page .cta-gradient h3{font-weight: 600;font-size: 28px;}
.index-page .cta-gradient .muted{color: var(--muted);font-size: 14px}
.index-page .cta-gradient input{ font-weight: 500; font-size: 14px; color: var(--dark-bg-color);border: 1px solid var(--dark-bg-color) !important;}
.index-page .cta-gradient .btn{background-color: var(--brand-color); font-weight: 500; font-size: 14px;}

.index-page .nd-faqs .accordion-item{background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05));margin: 0 0 10px 0; border-radius: 16px;border:1px solid var(--border);}
.index-page .nd-faqs .accordion-header{background:transparent}
.index-page .nd-faqs .accordion-button {background: transparent;border: none;box-shadow: none;color: var(--dark-bg-color);font-size: 14px;}
.index-page .nd-faqs .accordion-body p{color: var(--dark-bg-color); font-size: 13px;}
.index-page .nd-faqs .accordion-button::after {background-size: 16px;filter: brightness(0) invert(1);}
.index-page .nd-faqs .accordion-button:not(.collapsed)::after{filter: brightness(0) invert(1);}

@media screen and (max-width:767px){
    .index-page .section{padding-block:3rem}
    .index-page .nd-top-section .eyebrow{font-size: 8px;padding: 5px 5px;}
    .index-page .nd-top-section .title-hero{font-size: 34px;}
    .index-page .contact-us-btn{font-size:13px;letter-spacing: 0.5px;width: auto; padding:7px 10px;}
    .index-page .nd-top-section .btn-outline-light{font-size:13px;letter-spacing: 0.5px; padding:7px 10px;}
    .index-page .nd-top-section .d-inline-flex{font-size:12px;}

    .index-page .nd-wcu h2{font-size: 30px;}
    .index-page .nd-our-services h2{font-size: 30px;}
    .index-page .nd-testimonial h2{font-size: 30px}
    .index-page .nd-case-study h2{font-size: 30px;}
    .index-page .nd-work-process h2{font-size: 30px;}
    .index-page .nd-blogs h2{font-size: 30px;}
    .index-page .nd-blogs .slick-list{margin: 0 -10px;}
    .index-page .nd-blogs .slides .slick-next{right: -10px;}
    .index-page .nd-blogs .slides .slick-prev{left: -10px;}
    .index-page .nd-blogs .slick-slide{padding: 0;}
    .index-page .cta .container-xl{padding: 0;}
    .index-page .cta-gradient h3{font-size: 23px;}
    .index-page .cta-gradient .muted{font-size: 13px}
    .index-page .cta-gradient .btn{width: 100%; margin: 8px 0 0 0;}
}

/* ----Services Page---- */
.nd-service-page .section{padding-block:4rem}
.nd-service-page .eyebrow{letter-spacing:.18em;color:#c7d2fe;text-transform:uppercase;font-weight:700}
.nd-service-page .obj{width:100%;max-height:340px;object-fit:cover;border-radius:1rem;}
.nd-service-page .muted{color:#a1a1aa}
.nd-service-page .glass{background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05)); border:1px solid #ffffff1a; border-radius:1rem; box-shadow:0 10px 30px rgba(0,0,0,.35)}

.nd-service-page .top-section{background:linear-gradient(90deg, rgba(99,102,241,.25), transparent 40%, rgba(217,70,239,.25))}
.nd-service-page .top-section h1{font-size: 18px; font-weight: 700;}
.nd-service-page .top-section h2{font-size: 42px;}
.nd-service-page .top-section p{font-size: 14px; padding: 0 50px 0 0;}
.nd-service-page .top-section .contact-us-btn{background-color: var(--brand-color);color: var(--dark-bg-color);font-size: 14px;font-weight: 500;letter-spacing: 1px;max-height: 35px;width: 200px;border: none;}
.nd-service-page .top-section .contact-us-btn:hover{background-color: var(--indigo) !important;}
.nd-service-page .top-section .btn-outline-light{font-size: 14px;font-weight: 500;letter-spacing: 1px; max-height: 35px;background-color: var(--dark-bg-color);color: var(--bg);border: none;}
.nd-service-page .top-section .btn-outline-light:hover{background-color: #d8dde2 !important;color: var(--bg);}
.nd-service-page .top-section .small span{font-size: 13px;}

.nd-service-page .logo-skel{width:110px;height:28px;border-radius:8px;background:rgba(255,255,255,.08);border:1px solid var(--border)}
.nd-service-page .services-list h2{font-weight: 700;font-size: 33px;}
.nd-service-page .services-list img{width:100%;max-height:180px;object-fit:cover;border-radius:1rem 1rem 0 0;}
.nd-service-page .services-list p{font-size: 13px;}
.nd-service-page .services-list .btn-outline-light{font-size: 12px;padding: 6px 15px;}
.nd-service-page .services-list .icon-pill{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:12px;background:rgba(99,102,241,.2);border:1px solid rgba(129,140,248,.3);margin-bottom:.75rem}

.nd-service-page .engagement h2{font-weight: 700;font-size: 33px;}
.nd-service-page .engagement h5{font-size: 18px; font-weight: 600;}
.nd-service-page .engagement .pill{display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.06);border:1px solid #ffffff1a;border-radius:999px;padding:5px 12px;color:#cbd5e1;margin:2px;font-size: 13px;}
.nd-service-page .engagement p{font-size: 13px;}
.nd-service-page .engagement ul li{font-size: 13px;}
.nd-service-page .engagement .btn{background-color: var(--brand-color); color: var(--dark-bg-color); padding: 5px 15px; font-size: 13px; font-weight: 500; letter-spacing: 0.5px;}
.nd-service-page .engagement .btn:hover{background-color: var(--indigo);}

.nd-service-page .how-we-work h2{font-weight: 700;font-size: 33px;}
.nd-service-page .how-we-work h6{font-size: 16px; font-weight: 600; padding: 5px 0 0 0;}
.nd-service-page .how-we-work .pill{display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.06);border:1px solid #ffffff1a;border-radius:999px;color:#cbd5e1;margin:2px;height: 38px; width: 38px;}
.nd-service-page .how-we-work p{font-size: 13px;}

.nd-service-page .cta{background:linear-gradient(90deg, rgba(99,102,241,.25), transparent 40%, rgba(217,70,239,.25))}
.nd-service-page .cta h3{font-weight: 600;font-size: 28px;}
.nd-service-page .cta .muted{color: var(--muted);font-size: 14px}
.nd-service-page .cta input{ font-weight: 500; font-size: 14px; color: var(--dark-bg-color);border: 1px solid var(--dark-bg-color) !important;}
.nd-service-page .cta .btn{background-color: var(--brand-color); font-weight: 500; font-size: 14px;}

@media screen and (max-width:767px){
    .nd-service-page .section{padding-block:3rem}
    .nd-service-page .top-section h2{font-size: 34px;}
    .nd-service-page .top-section .small span{font-size: 11px;}
    .nd-service-page .top-section .contact-us-btn{width:100%;}
    .nd-service-page .top-section .btn-outline-light{width:100%;}
    .nd-service-page .services-list h2{font-size: 30px;}
    .nd-service-page .engagement h2{font-size: 30px;}
    .nd-service-page .how-we-work h2{font-size: 30px;}
    .nd-service-page .cta h3{font-size: 23px;}
    .nd-service-page .cta .btn{width:100%; margin:8px 0 0 0;}
}

/* ----Single Services Page---- */
.nd-single-service-details .section{padding-block:4rem}
.nd-single-service-details .eyebrow{letter-spacing:.18em;color:#c7d2fe;text-transform:uppercase;font-weight:700}
.nd-single-service-details .muted{color:#a1a1aa}
.nd-single-service-details h1{font-size: 42px; font-weight: 700;}
.nd-single-service-details h2{font-weight: 700;font-size: 33px;}
.nd-single-service-details .glass{background:rgba(255,255,255,.06);border:1px solid #ffffff1a;border-radius:1rem;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.nd-single-service-details .obj{width:100%;max-height:330px;object-fit:cover;border-radius:1rem}
.nd-single-service-details .pill{display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.06);border:1px solid #ffffff1a;border-radius:999px;padding:6px 12px;color:#cbd5e1;margin:3px}

.nd-single-service-details .top-section{background:linear-gradient(90deg,rgba(99,102,241,.25),transparent 40%,rgba(217,70,239,.25))}
.nd-single-service-details .top-section .lead{font-size: 16px;}
.nd-single-service-details .top-section .link a{color: var(--brand-color-secondary);font-weight: 700;font-size: 13px;}

.nd-single-service-details .content-section p{font-size: 13px; color:#a1a1aa;}
.nd-single-service-details .capability h5{font-size: 18px;}
.nd-single-service-details .capability p,
.nd-single-service-details .wcu p,
.nd-single-service-details .process p,
.nd-single-service-details .benefits p,
.nd-single-service-details .challanges p{font-size: 13px;}

.nd-single-service-details .accordion-item{background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05));margin: 0 0 10px 0; border-radius: 16px;border:1px solid var(--border);}
.nd-single-service-details .accordion-header{background:transparent}
.nd-single-service-details .accordion-button {background: transparent;border: none;box-shadow: none;color: var(--dark-bg-color);font-size: 14px;}
.nd-single-service-details .accordion-body p{color: var(--dark-bg-color); font-size: 13px; text-align: left;}
.nd-single-service-details .accordion-button::after {background-size: 16px;filter: brightness(0) invert(1);}
.nd-single-service-details .accordion-button:not(.collapsed)::after{filter: brightness(0) invert(1);}

.nd-single-service-details .cta{background:linear-gradient(90deg,rgba(99,102,241,.25),transparent 40%,rgba(217,70,239,.25))}
.nd-single-service-details .cta h3{font-weight: 600;font-size: 28px;}
.nd-single-service-details .cta .muted{color: var(--muted);font-size: 14px}
.nd-single-service-details .cta input{ font-weight: 500; font-size: 14px; color: var(--dark-bg-color);border: 1px solid var(--dark-bg-color) !important;}
.nd-single-service-details .cta .btn{background-color: var(--brand-color); font-weight: 500; font-size: 14px;}

@media screen and (max-width:767px){
    .nd-single-service-details h1{font-size: 32px;}
    .nd-single-service-details h2{font-size: 28px;}
    .nd-single-service-details .cta h3{font-size: 23px;}
    .nd-single-service-details .cta .btn{width:100%; margin:8px 0 0 0;}
}

/* ----Subscription form validation---- */
.subscription-form label.error{color: var(--brand-color-secondary);font-size: 13px;margin: 5px 0 0 0;padding: 0;}
.subscription-form label.success{color: greenyellow;font-size: 13px;margin: 5px 0 0 0;padding: 0;}

/* ----Tech Type Page---- */
.tech-type-page .hero{padding:3.5rem 0;background:linear-gradient(90deg,rgba(99,102,241,.25),transparent 40%,rgba(217,70,239,.25))}
.tech-type-page .section{padding-block:3rem}
.tech-type-page .card-tech{background:rgba(255,255,255,.06);border:1px solid var(--border);border-radius:1rem;overflow:hidden;transition:.3s}
.tech-type-page .card-tech:hover{transform:translateY(-5px);box-shadow:0 10px 25px rgba(0,0,0,.45)}
.tech-type-page .card-tech .tech-image{height:210px;object-fit:cover;width:100%;overflow: hidden;}
.tech-type-page .badge{background:rgba(255,255,255,.1);border:1px solid var(--border);color:#fff;font-size:.7rem;margin:.2rem;font-weight: 600;}
.tech-type-page .muted{color:var(--muted)}
.tech-type-page .tech-list img{max-width: 20px;}
.tech-type-page .btn{background:var(--brand-color);color: var(--dark-bg-color);font-weight: 500; padding: 4px 15px;}
.tech-type-page .btn:hover{background:var(--indigo);}

@media screen and (max-width:767px){
    .tech-type-page .hero{padding:2.5rem 0;}
}

/* ==========================Product Pages========================= */
/* ----comming soon---- */
.product-comming-soon{ margin:0;min-height:85vh;display:flex;justify-content:center;align-items:center;flex-direction:column;background: linear-gradient(135deg, #0a0c14 0%, #1a1f2c 100%);color:#fff;text-align:center;}
.product-comming-soon h1 {font-size:2.2rem;font-weight:800;margin-bottom:12px;}
.product-comming-soon p {color:#aab0bc;margin-bottom:24px;}
.product-comming-soon input {flex:1;min-width:200px;border-radius:8px;border:1px solid rgba(255,255,255,0.2);background:transparent;color:#fff;}
.product-comming-soon input::placeholder { color:#aab0bc; }
.product-comming-soon button {border:none;border-radius:8px;font-weight:500;cursor:pointer;background: linear-gradient(90deg,#3b82f6,#8b5cf6);color:#fff;}
.product-comming-soon .note {margin-top:12px;color:#aab0bc;}
@media screen and (max-width:767px){
    .product-comming-soon button {width: 100%;margin: 10px 0 0 0;}
}

/* Product Listing Page */
.products-page{background:var(--bg);min-height:100vh;padding-bottom:60px}
.products-hero{background:linear-gradient(135deg,#0a0c14 0%,#1a1f2c 100%);padding:50px 0 40px;text-align:center;border-bottom:1px solid var(--border)}
.products-hero h1{font-size:2rem;font-weight:700;margin:0 0 8px;color:#fff}
.products-hero p{color:var(--muted);margin:0;font-size:.95rem}
.products-hero .breadcrumb-nav{margin-top:16px}
.products-hero .breadcrumb-nav a{color:var(--brand-color);text-decoration:none;font-size:.85rem}
.products-hero .breadcrumb-nav span{color:var(--muted);font-size:.85rem;margin:0 6px}
.products-hero .breadcrumb-nav .current{color:var(--text)}

/* Search Bar */
.products-search-bar{padding:20px 0;border-bottom:1px solid var(--border);background:var(--bg)}
.products-search-bar .search-wrapper{position:relative;max-width:500px}
.products-search-bar .search-wrapper i{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:.9rem}
.products-search-bar .search-input{width:100%;padding:10px 14px 10px 40px;border-radius:8px;border:1px solid var(--border);background:var(--soft);color:#fff;font-size:.9rem;outline:none;transition:border-color .2s}
.products-search-bar .search-input:focus{border-color:var(--brand-color)}
.products-search-bar .search-input::placeholder{color:var(--muted)}
.products-search-bar .results-count{color:var(--muted);font-size:.85rem;margin-top:8px}

/* Layout */
.products-layout{display:flex;gap:24px;padding-top:24px}
.products-sidebar{width:260px;flex-shrink:0}
.products-content{flex:1;min-width:0}

/* Sidebar Filters */
.filter-section{background:var(--soft);border:1px solid var(--border);border-radius:12px;padding:20px;margin-bottom:16px}
.filter-section h5{font-size:.85rem;font-weight:600;color:var(--text);text-transform:uppercase;letter-spacing:.5px;margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid var(--border)}
.filter-list{list-style:none;padding:0;margin:0}
.filter-list li{margin-bottom:4px}
.filter-list li label{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:6px;cursor:pointer;transition:background .15s;color:var(--text);font-size:.9rem}
.filter-list li label:hover{background:var(--soft-2)}
.filter-list li input[type="checkbox"]{display:none}
.filter-list li .checkmark{width:18px;height:18px;border:2px solid var(--border);border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .15s;flex-shrink:0}
.filter-list li input[type="checkbox"]:checked+.checkmark{background:var(--brand-color);border-color:var(--brand-color)}
.filter-list li input[type="checkbox"]:checked+.checkmark::after{content:'';width:6px;height:6px;background:#fff;border-radius:2px}
.filter-list li .count{color:var(--muted);font-size:.8rem;margin-left:auto}

/* Product Grid */
.products-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.product-card{background:var(--soft);border:1px solid var(--border);border-radius:16px;overflow:hidden;transition:transform .25s cubic-bezier(.4,0,.2,1),border-color .25s,box-shadow .25s;position:relative}
.product-card:hover{transform:translateY(-6px);border-color:var(--brand-color);box-shadow:0 12px 40px rgba(30,76,255,.18)}
.product-card .card-image{position:relative;overflow:hidden;background:linear-gradient(135deg,#1a1f2e 0%,#0d1117 100%);aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;padding:16px}
.product-card .card-image img{width:100%;height:100%;object-fit:contain;transition:transform .4s cubic-bezier(.4,0,.2,1)}
.product-card:hover .card-image img{transform:scale(1.06)}
.product-card .card-image .placeholder-icon{font-size:3.5rem;color:var(--muted);opacity:.25}
.product-card .card-image .image-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,.3) 100%);opacity:0;transition:opacity .25s;pointer-events:none}
.product-card:hover .card-image .image-overlay{opacity:1}

/* Sale Badge - Modern design */
.product-card .badge-sale{position:absolute;top:14px;left:14px;background:linear-gradient(135deg,#ff6b6b 0%,#ee5a24 50%,#f0932b 100%);color:#fff;padding:5px 12px;border-radius:20px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.8px;z-index:2;box-shadow:0 2px 10px rgba(238,90,36,.4);display:flex;align-items:center;gap:4px}
.product-card .badge-sale::before{content:'';width:6px;height:6px;background:#fff;border-radius:50%;opacity:.8;animation:badge-pulse 2s infinite}
@keyframes badge-pulse{0%,100%{opacity:.8;transform:scale(1)}50%{opacity:.4;transform:scale(.8)}}

.product-card .badge-category{position:absolute;top:14px;right:14px;background:rgba(0,0,0,.55);backdrop-filter:blur(12px);color:#fff;padding:4px 10px;border-radius:20px;font-size:.68rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;z-index:2;border:1px solid rgba(255,255,255,.1)}
.product-card .card-body{padding:18px 18px 16px}
.product-card .card-title{font-size:.92rem;font-weight:600;color:#fff;margin:0 0 6px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em}
.product-card .card-title a{color:inherit;text-decoration:none;transition:color .2s}
.product-card .card-title a:hover{color:var(--brand-color)}
.product-card .card-desc{font-size:.8rem;color:var(--muted);margin:0 0 14px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.4em}
.product-card .price-row{display:flex;align-items:center;gap:10px;margin-bottom:14px;padding-top:12px;border-top:1px solid var(--border)}
.product-card .price{font-size:1.2rem;font-weight:700;background:linear-gradient(135deg,#fff 0%,#e0e7ff 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.product-card .price-sale{font-size:.85rem;color:var(--muted);text-decoration:line-through;opacity:.6}
.product-card .price-free{font-size:1.05rem;font-weight:700;color:#34d399;letter-spacing:.3px}
.product-card .card-actions{display:flex;gap:8px}
.product-card .btn-view{flex:1;padding:10px 14px;border-radius:10px;background:linear-gradient(135deg,var(--brand-color) 0%,#5b21b6 100%);color:#fff;font-size:.82rem;font-weight:600;text-align:center;border:none;transition:all .2s;box-shadow:0 2px 8px rgba(30,76,255,.2)}
.product-card .btn-view:hover{box-shadow:0 4px 16px rgba(30,76,255,.35);color:#fff;transform:translateY(-1px)}
.product-card .btn-cart{padding:10px 12px;border-radius:10px;background:transparent;border:1px solid var(--border);color:var(--text);font-size:.85rem;transition:all .2s;display:flex;align-items:center;justify-content:center}
.product-card .btn-cart:hover{border-color:var(--brand-color);color:var(--brand-color);background:rgba(30,76,255,.08)}

/* Empty State */
.products-empty{text-align:center;padding:60px 20px}
.products-empty i{font-size:3rem;color:var(--muted);opacity:.4;margin-bottom:16px}
.products-empty h3{color:var(--text);margin:0 0 8px;font-size:1.1rem}
.products-empty p{color:var(--muted);margin:0;font-size:.9rem}

/* Pagination */
.products-pagination{margin-top:40px;display:flex;justify-content:center}
.products-pagination .pagination{gap:6px}
.products-pagination .page-link{background:var(--soft);border:1px solid var(--border);color:var(--text);padding:8px 14px;border-radius:8px;font-size:.85rem;text-decoration:none;transition:all .15s}
.products-pagination .page-link:hover{border-color:var(--brand-color);color:var(--brand-color)}
.products-pagination .active .page-link{background:var(--brand-color);border-color:var(--brand-color);color:#fff}
.products-pagination .disabled .page-link{opacity:.4;pointer-events:none}

/* Mobile Filter Toggle */
.mobile-filter-toggle{display:none;margin-bottom:16px}
.mobile-filter-toggle button{width:100%;padding:10px;border-radius:8px;background:var(--soft);border:1px solid var(--border);color:var(--text);font-size:.9rem;display:flex;align-items:center;justify-content:center;gap:8px}

/* Responsive */
@media screen and (max-width:1200px){
    .products-grid{grid-template-columns:repeat(2,1fr)}
}
@media screen and (max-width:991px){
    .products-layout{flex-direction:column}
    .products-sidebar{width:100%;display:none}
    .products-sidebar.show{display:block}
    .mobile-filter-toggle{display:block}
}
@media screen and (max-width:576px){
    .products-grid{grid-template-columns:1fr}
    .products-hero h1{font-size:1.5rem}
}

/* Product Details Page */
.product-details-page{background:var(--bg);min-height:100vh;padding-bottom:60px}
.pd-breadcrumb{padding:20px 0;border-bottom:1px solid var(--border)}
.pd-breadcrumb a{color:var(--muted);text-decoration:none;font-size:.85rem;transition:color .15s}
.pd-breadcrumb a:hover{color:var(--brand-color)}
.pd-breadcrumb span{color:var(--muted);font-size:.85rem;margin:0 6px}
.pd-breadcrumb .current{color:var(--text);font-size:.85rem}

.pd-hero{padding:40px 0 50px}
.pd-layout{display:grid;grid-template-columns:1fr 380px;gap:40px;align-items:start;max-width:1100px;margin:0 auto}

/* Gallery */
.pd-gallery{position:sticky;top:100px}
.pd-main-image{background:linear-gradient(135deg,#1a1f2e 0%,#0d1117 100%);border-radius:16px;overflow:hidden;aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;margin-bottom:16px;border:1px solid rgba(30,76,255,.2);box-shadow:0 0 30px rgba(30,76,255,.08),inset 0 0 60px rgba(30,76,255,.03);position:relative;transition:border-color .3s,box-shadow .3s}
.pd-main-image:hover{border-color:rgba(30,76,255,.4);box-shadow:0 0 50px rgba(30,76,255,.15),inset 0 0 60px rgba(30,76,255,.05)}
.pd-main-image img{width:100%;height:100%;object-fit:contain;padding:24px;transition:transform .4s ease,opacity .25s ease}
.pd-main-image:hover img{transform:scale(1.05)}
.pd-main-image .placeholder-icon{font-size:5rem;color:var(--muted);opacity:.2}
.pd-main-image::after{content:'';position:absolute;inset:0;border-radius:16px;padding:1px;background:linear-gradient(135deg,rgba(30,76,255,.3),transparent 50%,rgba(30,76,255,.1));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:0;transition:opacity .4s}
.pd-main-image:hover::after{opacity:1}
.pd-main-image:hover .pd-gallery-nav{opacity:1}
.pd-gallery-nav{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;background:rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.1);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .25s ease;opacity:0;z-index:2;backdrop-filter:blur(4px);font-size:.85rem}
.pd-gallery-nav:hover{background:rgba(30,76,255,.6);border-color:rgba(30,76,255,.4);box-shadow:0 0 20px rgba(30,76,255,.2)}
.pd-gallery-prev{left:12px}
.pd-gallery-next{right:12px}
.pd-gallery-counter{position:absolute;bottom:12px;right:12px;background:rgba(0,0,0,.6);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.08);color:#fff;font-size:.72rem;font-weight:600;padding:3px 10px;border-radius:20px;z-index:2;letter-spacing:.3px}
.pd-thumbs{display:flex;gap:10px;overflow-x:auto;padding-bottom:8px;padding-top:4px;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}
.pd-thumbs::-webkit-scrollbar{height:3px}
.pd-thumbs::-webkit-scrollbar-track{background:transparent}
.pd-thumbs::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}
.pd-thumb{width:72px;height:56px;border-radius:8px;overflow:hidden;cursor:pointer;border:1.5px solid rgba(255,255,255,.06);transition:all .3s cubic-bezier(.4,0,.2,1);flex-shrink:0;background:linear-gradient(135deg,#1a1f2e 0%,#0d1117 100%);position:relative;opacity:.5;filter:saturate(.6)}
.pd-thumb::after{content:'';position:absolute;inset:0;border-radius:7px;padding:1px;background:linear-gradient(135deg,rgba(30,76,255,.2),transparent 60%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;transition:opacity .3s}
.pd-thumb:hover{opacity:.9;filter:saturate(.9);border-color:rgba(30,76,255,.4);transform:translateY(-3px);box-shadow:0 6px 16px rgba(0,0,0,.4)}
.pd-thumb.active{opacity:1;filter:saturate(1);border-color:var(--brand-color);box-shadow:0 0 20px rgba(30,76,255,.2),0 8px 24px rgba(0,0,0,.4);transform:translateY(-3px)}
.pd-thumb.active::after{opacity:1;background:linear-gradient(135deg,rgba(30,76,255,.4),transparent 60%)}
.pd-thumb img{width:100%;height:100%;object-fit:contain;padding:5px;transition:transform .35s cubic-bezier(.4,0,.2,1)}
.pd-thumb:hover img,.pd-thumb.active img{transform:scale(1.1)}

/* Sidebar Info */
.pd-info{position:sticky;top:100px}
.pd-info .pd-category{display:inline-block;background:rgba(30,76,255,.12);color:var(--brand-color);padding:4px 12px;border-radius:20px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px}
.pd-info .pd-title{font-size:1.6rem;font-weight:700;color:#fff;margin:0 0 12px;line-height:1.3}
.pd-info .pd-short-desc{color:var(--muted);font-size:.9rem;line-height:1.6;margin:0 0 24px}

/* Price Box */
.pd-price-box{background:var(--soft);border:1px solid var(--border);border-radius:14px;padding:20px;margin-bottom:20px}
.pd-price-row{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.pd-price-current{font-size:2rem;font-weight:800;background:linear-gradient(135deg,#fff 0%,#e0e7ff 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.pd-price-original{font-size:1.1rem;color:var(--muted);text-decoration:line-through;opacity:.6}
.pd-price-save{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;padding:3px 10px;border-radius:20px;font-size:.72rem;font-weight:700;text-transform:uppercase}
.pd-price-breakdown{margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}
.pd-price-row-item{display:flex;justify-content:space-between;font-size:.85rem;color:var(--muted);margin-bottom:6px}
.pd-price-row-item.total{color:#fff;font-weight:600;font-size:.95rem;margin-bottom:0;margin-top:8px;padding-top:8px;border-top:1px solid var(--border)}

/* Action Buttons */
.pd-actions{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.pd-btn-primary{display:block;width:100%;padding:14px;border-radius:12px;background:linear-gradient(135deg,var(--brand-color) 0%,#5b21b6 100%);color:#fff;font-size:.95rem;font-weight:600;text-align:center;border:none;cursor:pointer;transition:all .2s;box-shadow:0 4px 15px rgba(30,76,255,.3)}
.pd-btn-primary:hover{box-shadow:0 6px 25px rgba(30,76,255,.45);transform:translateY(-2px);color:#fff;text-decoration:none}
.pd-btn-preview{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:13px;border-radius:12px;background:linear-gradient(135deg,rgba(30,76,255,.08),rgba(99,102,241,.05));border:1px solid rgba(30,76,255,.25);color:var(--text);font-size:.9rem;font-weight:500;cursor:pointer;transition:all .25s ease;position:relative;overflow:hidden}
.pd-btn-preview::before{content:'';position:absolute;inset:0;border-radius:12px;padding:1px;background:linear-gradient(135deg,rgba(30,76,255,.4),rgba(99,102,241,.1));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.pd-btn-preview:hover{border-color:rgba(30,76,255,.5);color:var(--brand-color);background:linear-gradient(135deg,rgba(30,76,255,.15),rgba(99,102,241,.08));box-shadow:0 4px 20px rgba(30,76,255,.15);transform:translateY(-1px)}
.pd-btn-preview:active{transform:translateY(0)}
.pd-btn-preview i{font-size:1.1rem;transition:transform .25s ease}
.pd-btn-preview:hover i{transform:translate(2px,-2px)}

/* Meta Info */
.pd-meta{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px}
.pd-meta-item{background:var(--soft);border:1px solid var(--border);border-radius:10px;padding:14px;text-align:center}
.pd-meta-item i{font-size:1.2rem;color:var(--brand-color);margin-bottom:6px}
.pd-meta-item .label{display:block;font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px}
.pd-meta-item .value{display:block;font-size:.88rem;font-weight:600;color:#fff}

/* Tabs Section */
.pd-tabs-section{padding:40px 0 50px}
.pd-tabs-header{display:flex;gap:0;border-bottom:1px solid var(--border);margin-bottom:24px;overflow-x:auto}
.pd-tab-btn{padding:12px 20px;background:none;border:none;color:var(--muted);font-size:.9rem;font-weight:500;cursor:pointer;border-bottom:2px solid transparent;transition:all .15s;white-space:nowrap}
.pd-tab-btn:hover{color:var(--text)}
.pd-tab-btn.active{color:var(--brand-color);border-bottom-color:var(--brand-color)}
.pd-tab-content{display:none}
.pd-tab-content.active{display:block}
.pd-description{color:var(--text);font-size:.92rem;line-height:1.8}
.pd-description h1,.pd-description h2,.pd-description h3{color:#fff;margin:20px 0 12px}
.pd-description p{margin-bottom:14px}
.pd-description ul,.pd-description ol{padding-left:20px;margin-bottom:14px}
.pd-description li{margin-bottom:6px}

.pd-features-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.pd-feature-item{background:var(--soft);border:1px solid var(--border);border-radius:10px;padding:16px;display:flex;gap:12px;align-items:flex-start}
.pd-feature-icon{width:36px;height:36px;border-radius:8px;background:rgba(30,76,255,.12);color:var(--brand-color);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.95rem}
.pd-feature-item h4{margin:0 0 4px;font-size:.9rem;font-weight:600;color:#fff}
.pd-feature-item p{margin:0;font-size:.82rem;color:var(--muted);line-height:1.5}

/* Related Products */
.pd-related{padding:40px 0 60px;border-top:1px solid var(--border)}
.pd-related h2{font-size:1.4rem;font-weight:700;color:#fff;margin:0 0 8px}
.pd-related .subtitle{color:var(--muted);font-size:.9rem;margin:0 0 24px}
.related-scroll{display:flex;gap:20px;overflow-x:auto;padding-bottom:16px;scroll-snap-type:x mandatory}
.related-scroll::-webkit-scrollbar{height:6px}
.related-scroll::-webkit-scrollbar-thumb{background:var(--border);border-radius:6px}
.related-scroll .product-card{min-width:300px;max-width:300px;scroll-snap-align:start;flex-shrink:0}

/* Responsive */
@media screen and (max-width:1200px){
    .pd-layout{grid-template-columns:1fr 340px;gap:32px}
}
@media screen and (max-width:991px){
    .pd-layout{grid-template-columns:1fr}
    .pd-gallery,.pd-info{position:static}
    .pd-thumbs .pd-thumb{width:64px;height:48px}
}
@media screen and (max-width:767px){
    .pd-info .pd-title{font-size:1.3rem}
    .pd-price-current{font-size:1.6rem}
    .pd-meta{grid-template-columns:1fr 1fr}
    .pd-features-grid{grid-template-columns:1fr}
}
@media screen and (max-width:576px){
    .pd-hero{padding:24px 0 32px}
    .pd-tabs-section{padding:24px 0 32px}
    .pd-related{padding:24px 0 40px}
    .related-scroll .product-card{min-width:260px;max-width:260px}
}

/* Checkout Page */
.checkout-page{background:var(--bg);min-height:100vh;padding-bottom:60px}
.checkout-card{background:var(--soft);border:1px solid var(--border);border-radius:16px;overflow:hidden}
.checkout-header{padding:20px 28px;border-bottom:1px solid var(--border)}
.checkout-header h2{font-size:1.1rem;font-weight:700;color:#fff;margin:0;display:flex;align-items:center}
.checkout-header h2 i{color:var(--brand-color);font-size:1.15rem}
.checkout-product{padding:20px 28px;border-bottom:1px solid var(--border)}
.checkout-product-main{display:flex;gap:20px;align-items:center}
.checkout-product-img{width:110px;height:80px;flex-shrink:0;background:linear-gradient(135deg,#1a1f2e 0%,#0d1117 100%);border-radius:10px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);overflow:hidden}
.checkout-product-img img{width:100%;height:100%;object-fit:contain;padding:8px}
.checkout-product-img i{font-size:2.2rem;color:var(--muted);opacity:.3}
.checkout-product-info{flex:1;min-width:0}
.checkout-product-info h4{font-size:1rem;font-weight:600;color:#fff;margin:0 0 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.checkout-category{display:inline-block;background:rgba(30,76,255,.12);color:var(--brand-color);padding:2px 10px;border-radius:20px;font-size:.68rem;font-weight:600;text-transform:uppercase;letter-spacing:.3px;margin-bottom:6px}
.checkout-price{display:flex;align-items:center;gap:8px}
.checkout-price .price-current{font-size:1.2rem;font-weight:800;background:linear-gradient(135deg,#fff 0%,#e0e7ff 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.checkout-price .price-original{font-size:.8rem;color:var(--muted);text-decoration:line-through;opacity:.6}
.checkout-price .price-free{font-size:1.2rem;font-weight:800;color:#22c55e}
.checkout-section{padding:20px 28px;border-bottom:1px solid var(--border)}
.checkout-section:last-child{border-bottom:none}
.checkout-section h5{font-size:.88rem;font-weight:600;color:#fff;margin:0 0 12px;display:flex;align-items:center}
.checkout-section h5 i{color:var(--brand-color);font-size:.9rem}
.checkout-section p{font-size:.85rem;color:var(--muted);line-height:1.7;margin:0}
.checkout-desc-content{font-size:.85rem;color:var(--muted);line-height:1.7}
.checkout-desc-content h1,.checkout-desc-content h2,.checkout-desc-content h3,.checkout-desc-content h4{color:#fff;margin:16px 0 8px;font-size:1rem}
.checkout-desc-content p{margin-bottom:10px}
.checkout-desc-content ul,.checkout-desc-content ol{padding-left:18px;margin-bottom:10px}
.checkout-desc-content li{margin-bottom:4px}
.checkout-features{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.checkout-feature-item{display:flex;gap:10px;align-items:flex-start;background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:8px;padding:12px}
.checkout-feature-item i{color:var(--brand-color);font-size:1rem;margin-top:2px;flex-shrink:0}
.checkout-feature-item div{min-width:0}
.checkout-feature-item strong{display:block;font-size:.78rem;color:#fff;font-weight:600;margin-bottom:2px}
.checkout-feature-item span{display:block;font-size:.72rem;color:var(--muted);line-height:1.4}
.checkout-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.checkout-meta-item{background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:8px;padding:12px;text-align:center}
.meta-label{display:block;font-size:.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:4px}
.meta-value{display:block;font-size:.82rem;font-weight:600;color:#fff}
.checkout-summary{padding:20px 28px}
.summary-row{display:flex;justify-content:space-between;font-size:.85rem;color:var(--muted);margin-bottom:8px}
.summary-row.total{padding-top:12px;border-top:1px solid var(--border);color:#fff;font-size:1rem;font-weight:700;margin-bottom:0}
.co-coupon{padding:16px 28px;border-bottom:1px solid var(--border)}
.co-coupon-row{display:flex;gap:8px}
.co-coupon-input{flex:1;padding:10px 14px;border-radius:8px;border:1px solid var(--border);background:rgba(255,255,255,.04);color:#fff;font-size:.85rem;outline:none;transition:border-color .2s}
.co-coupon-input::placeholder{color:var(--muted);opacity:.6}
.co-coupon-input:focus{border-color:var(--brand-color)}
.co-coupon-btn{padding:10px 20px;border-radius:8px;border:none;background:linear-gradient(135deg,var(--brand-color) 0%,#5b21b6 100%);color:#fff;font-size:.82rem;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap;box-shadow:0 4px 15px rgba(30,76,255,.25)}
.co-coupon-btn:hover{box-shadow:0 6px 20px rgba(30,76,255,.4);transform:translateY(-1px)}
.co-coupon-btn.applied{opacity:.7;cursor:default;transform:none;box-shadow:none}
.co-coupon-msg{font-size:.78rem;margin-top:8px;padding:6px 10px;border-radius:6px;display:none}
.co-coupon-msg.error{display:block;color:#ef4444;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.2)}
.co-coupon-applied{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:rgba(34,197,94,.08);border:1px solid rgba(34,197,94,.2);border-radius:8px}
.co-cpn-badge{display:flex;align-items:center;gap:6px;font-size:.82rem;font-weight:600;color:#22c55e}
.co-cpn-badge i{font-size:.8rem}
.co-coupon-remove{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:rgba(34,197,94,.15);color:#22c55e;cursor:pointer;font-size:.65rem;transition:all .15s;flex-shrink:0}
.co-coupon-remove:hover{background:#22c55e;color:#fff}
.co-cpn-row{display:none}
.co-cpn-row span:first-child{display:flex;align-items:center;gap:4px}
.co-coupon-msg.error{display:block;color:#ef4444;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.2)}
.checkout-user{display:flex;align-items:center;gap:12px;padding:16px 28px;border-top:1px solid var(--border);background:rgba(255,255,255,.02)}
.checkout-user-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--brand-color),#5b21b6);display:flex;align-items:center;justify-content:center;color:#fff;font-size:.8rem;font-weight:700;flex-shrink:0}
.checkout-user-info{min-width:0}
.checkout-user-info strong{display:block;font-size:.85rem;color:#fff;font-weight:600}
.checkout-user-info span{display:block;font-size:.75rem;color:var(--muted)}
.checkout-actions{padding:20px 28px}
.checkout-actions form{width:100%}
.btn-place-order{width:100%;padding:14px;border-radius:12px;background:linear-gradient(135deg,var(--brand-color) 0%,#5b21b6 100%);color:#fff;font-size:.9rem;font-weight:600;border:none;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 15px rgba(30,76,255,.3);display:flex;align-items:center;justify-content:center}
.btn-place-order:hover{box-shadow:0 6px 25px rgba(30,76,255,.45);transform:translateY(-2px);color:#fff}
.btn-back{display:block;text-align:center;width:100%;padding:10px;border-radius:10px;border:1px solid var(--border);color:var(--muted);text-decoration:none;font-size:.85rem;transition:all .15s;margin-top:10px}
.btn-back:hover{color:var(--text);border-color:var(--brand-color);text-decoration:none}
.co-price-box{padding:24px 28px;border-bottom:1px solid var(--border)}
.co-price-main{display:flex;align-items:baseline;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.co-price-current{font-size:2rem;font-weight:800;background:linear-gradient(135deg,#fff 0%,#e0e7ff 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1}
.co-price-original{font-size:1rem;color:var(--muted);text-decoration:line-through;opacity:.5}
.co-price-save{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;padding:3px 10px;border-radius:20px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.3px}
.co-price-free{font-size:2rem;font-weight:800;color:#22c55e;line-height:1}
.co-price-breakdown{border-top:1px solid var(--border);padding-top:14px}
.co-price-row{display:flex;justify-content:space-between;font-size:.85rem;color:var(--muted);margin-bottom:8px}
.co-price-total{font-size:.95rem;font-weight:700;color:#fff;margin-bottom:0;padding-top:8px;border-top:1px solid var(--border)}
.checkout-preview{padding:20px 28px}
.btn-preview{display:flex;align-items:center;justify-content:center;width:100%;padding:12px;border-radius:12px;background:linear-gradient(135deg,rgba(30,76,255,.08),rgba(99,102,241,.05));border:1px solid rgba(30,76,255,.25);color:var(--text);font-size:.85rem;font-weight:500;text-decoration:none;transition:all .25s ease}
.btn-preview:hover{border-color:rgba(30,76,255,.5);color:var(--brand-color);background:linear-gradient(135deg,rgba(30,76,255,.15),rgba(99,102,241,.08));box-shadow:0 4px 20px rgba(30,76,255,.15);transform:translateY(-1px);text-decoration:none}
.checkout-auth{padding:32px 28px;text-align:center}
.checkout-auth-icon{font-size:2.5rem;color:var(--brand-color);margin-bottom:16px}
.checkout-auth-text{font-size:.88rem;color:var(--muted);line-height:1.6;margin:0 0 24px}
.checkout-auth-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:20px}
.btn-auth{padding:12px 28px;border-radius:10px;font-size:.88rem;font-weight:600;cursor:pointer;transition:all .2s;text-decoration:none;display:inline-flex;align-items:center}
.btn-auth-login{background:transparent;border:1px solid var(--brand-color);color:var(--brand-color)}
.btn-auth-login:hover{background:rgba(30,76,255,.1);box-shadow:0 0 20px rgba(30,76,255,.15);text-decoration:none;color:var(--brand-color)}
.btn-auth-register{background:linear-gradient(135deg,var(--brand-color) 0%,#5b21b6 100%);border:none;color:#fff;box-shadow:0 4px 15px rgba(30,76,255,.3)}
.btn-auth-register:hover{box-shadow:0 6px 25px rgba(30,76,255,.45);transform:translateY(-2px);text-decoration:none;color:#fff}
.checkout-auth-benefits{display:flex;flex-direction:column;gap:8px;align-items:center;margin-bottom:16px}
.benefit-item{display:flex;align-items:center;gap:8px;font-size:.8rem;color:var(--muted)}
.benefit-item i{color:#22c55e;font-size:.75rem}
@media(max-width:991px){
    .checkout-features{grid-template-columns:1fr}
}
@media(max-width:767px){
    .checkout-card{margin-left:-12px;margin-right:-12px;border-radius:12px;border-left:none;border-right:none}
    .checkout-header,.checkout-product,.checkout-section,.checkout-summary,.checkout-actions,.checkout-auth,.checkout-preview,.checkout-user{padding-left:20px;padding-right:20px}
    .checkout-product-main{flex-direction:column;align-items:flex-start}
    .checkout-product-img{width:100%;height:auto;aspect-ratio:16/8}
    .checkout-meta{grid-template-columns:1fr 1fr}
    .btn-auth{width:100%;justify-content:center}
}
/* ── Technology Detail Page ── */
.tech-detail-page{--glow:rgba(99,102,241,.35);--glow-soft:rgba(99,102,241,.12)}
.tech-detail-page .section{padding-block:4rem}
.tech-detail-page .container{max-width:1200px}
.tech-detail-page .tech-hero{position:relative;padding:5rem 0 4rem;background:radial-gradient(ellipse 600px 400px at 10% 30%,rgba(99,102,241,.18) 0%,transparent 70%),radial-gradient(ellipse 500px 500px at 90% 70%,rgba(217,70,239,.12) 0%,transparent 70%),radial-gradient(ellipse 300px 300px at 50% 50%,rgba(30,76,255,.06) 0%,transparent 70%);overflow:hidden}
.tech-detail-page .tech-hero::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent,transparent 100px,rgba(255,255,255,.015) 100px,rgba(255,255,255,.015) 101px);pointer-events:none}
.tech-detail-page .tech-hero .hero-content{position:relative;z-index:1}
.tech-detail-page .tech-hero .breadcrumb-nav{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-size:.85rem;color:var(--muted);margin-bottom:1.5rem}
.tech-detail-page .tech-hero .breadcrumb-nav a{color:var(--muted);text-decoration:none;transition:color .2s}
.tech-detail-page .tech-hero .breadcrumb-nav a:hover{color:#fff}
.tech-detail-page .tech-hero .breadcrumb-nav .sep{opacity:.4}
.tech-detail-page .tech-hero .hero-title{font-size:clamp(2.2rem,5vw,3.5rem);font-weight:800;line-height:1.12;background:linear-gradient(135deg,#fff 40%,var(--indigo) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:1rem}
.tech-detail-page .tech-hero .hero-sub{color:var(--muted);font-size:1.1rem;line-height:1.7;max-width:540px}
.tech-detail-page .tech-hero .hero-desc{color:#94a3b8;font-size:.95rem;line-height:1.75;margin-top:.5rem;max-width:540px}
.tech-detail-page .tech-hero .hero-actions{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1.75rem}
.tech-detail-page .tech-hero .hero-actions .btn-primary{background:var(--brand-color);color:#fff;border:none;padding:.65rem 2rem;border-radius:999px;font-weight:600;font-size:.95rem;transition:.3s}
.tech-detail-page .tech-hero .hero-actions .btn-primary:hover{background:var(--indigo);transform:translateY(-2px);box-shadow:0 8px 25px rgba(99,102,241,.4)}
.tech-detail-page .tech-hero .hero-actions .btn-outline{background:transparent;color:#fff;border:1px solid var(--border);padding:.65rem 2rem;border-radius:999px;font-weight:500;font-size:.95rem;transition:.3s}
.tech-detail-page .tech-hero .hero-actions .btn-outline:hover{border-color:var(--indigo);background:rgba(99,102,241,.1)}
.tech-detail-page .tech-hero .hero-image-wrap{position:relative;border-radius:1.25rem;overflow:hidden}
.tech-detail-page .tech-hero .hero-image-wrap::before{content:'';position:absolute;inset:-2px;border-radius:inherit;background:conic-gradient(from 0deg,var(--indigo),rgba(217,70,239,.5),var(--indigo));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:2px;animation:hero-rotate 6s linear infinite}
@keyframes hero-rotate{to{transform:rotate(360deg)}}
.tech-detail-page .tech-hero .hero-image-wrap img{display:block;width:100%;height:400px;object-fit:cover;border-radius:1.25rem;position:relative;z-index:1}
.tech-detail-page .tech-hero .hero-glow{position:absolute;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,var(--glow),transparent 70%);top:10%;right:-5%;pointer-events:none;z-index:0;animation:pulse-glow 4s ease-in-out infinite}
@keyframes pulse-glow{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.15)}}
.tech-detail-page .stats-strip{background:rgba(255,255,255,.03);border-block:1px solid var(--border);padding:2rem 0}
.tech-detail-page .stats-strip .stat-item{text-align:center}
.tech-detail-page .stats-strip .stat-number{font-size:2rem;font-weight:800;background:linear-gradient(135deg,var(--indigo),var(--brand-color-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.tech-detail-page .stats-strip .stat-label{font-size:.85rem;color:var(--muted);margin-top:.2rem}
.tech-detail-page .content-section .glass{background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03));border:1px solid var(--border);border-radius:1.25rem;box-shadow:0 10px 40px rgba(0,0,0,.35)}
.tech-detail-page .content-section .glass h1,.tech-detail-page .content-section .glass h2,.tech-detail-page .content-section .glass h3,.tech-detail-page .content-section .glass h4{color:#fff;margin-top:2rem;margin-bottom:.75rem;font-weight:700}
.tech-detail-page .content-section .glass h2{font-size:1.6rem;padding-bottom:.5rem;border-bottom:1px solid var(--border)}
.tech-detail-page .content-section .glass p{color:#cbd5e1;line-height:1.85;font-size:1rem;margin-bottom:1rem}
.tech-detail-page .content-section .glass ul,.tech-detail-page .content-section .glass ol{padding-left:1.5rem;color:#cbd5e1;line-height:1.85}
.tech-detail-page .content-section .glass li{margin-bottom:.4rem}
.tech-detail-page .content-section .glass img{max-width:100%;border-radius:.85rem;margin:1.5rem 0;box-shadow:0 8px 30px rgba(0,0,0,.4)}
.tech-detail-page .content-section .glass a{color:var(--indigo);text-decoration:underline}
.tech-detail-page .content-section .glass blockquote{border-left:3px solid var(--indigo);padding-left:1rem;margin:1.5rem 0;color:var(--muted);font-style:italic}
.tech-detail-page .benefit-grid .row{--bs-gutter-x:2rem;--bs-gutter-y:2rem}
.tech-detail-page .benefit-grid .benefit-card{background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.08);border-radius:1.25rem;padding:1.5rem;transition:all .35s ease;position:relative;overflow:hidden;height:100%}
.tech-detail-page .benefit-grid .benefit-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--brand-color),var(--indigo),rgba(217,70,239,.5));opacity:0;transition:opacity .35s ease}
.tech-detail-page .benefit-grid .benefit-card:hover{border-color:rgba(99,102,241,.4);transform:translateY(-3px);box-shadow:0 12px 35px rgba(0,0,0,.3),0 0 30px rgba(99,102,241,.06)}
.tech-detail-page .benefit-grid .benefit-card:hover::before{opacity:1}
.tech-detail-page .benefit-grid .benefit-card h4{color:#fff;font-size:1.05rem;font-weight:700;display:flex;align-items:center;gap:10px;margin-bottom:.6rem}
.tech-detail-page .benefit-grid .benefit-card h4 i{font-size:1.4rem;color:var(--indigo);flex-shrink:0}
.tech-detail-page .benefit-grid .benefit-card p{color:#cbd5e1;line-height:1.75;font-size:.95rem;margin-bottom:0}
.tech-detail-page .research-timeline{position:relative;max-width:1200px;margin:0 auto;counter-reset:step-counter}
.tech-detail-page .research-timeline::before{content:'';position:absolute;left:50%;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--indigo),rgba(99,102,241,.1));transform:translateX(-50%)}
.tech-detail-page .research-step{position:relative;width:50%;padding:0 50px 50px;counter-increment:step-counter;box-sizing:border-box}
.tech-detail-page .research-step:last-of-type{padding-bottom:0}
.tech-detail-page .research-step:nth-child(odd){margin-left:0;margin-right:auto;text-align:right}
.tech-detail-page .research-step:nth-child(even){margin-left:auto;margin-right:0;text-align:left}
.tech-detail-page .research-step::before{content:counter(step-counter);position:absolute;top:0;width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--brand-color),var(--indigo));color:#fff;font-size:.9rem;font-weight:800;display:flex;align-items:center;justify-content:center;z-index:2;box-shadow:0 0 0 4px rgba(99,102,241,.15)}
.tech-detail-page .research-step:nth-child(odd)::before{right:-20px;transform:translateX(0)}
.tech-detail-page .research-step:nth-child(even)::before{left:-20px;transform:translateX(0)}
.tech-detail-page .research-step .step-card{background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));border:1px solid var(--border);border-radius:1.25rem;padding:1.5rem;display:block;text-align:left;width:100%;transition:all .35s ease}
.tech-detail-page .research-step .step-card:hover{border-color:rgba(99,102,241,.3);box-shadow:0 8px 30px rgba(0,0,0,.3);transform:translateY(-2px)}
.tech-detail-page .research-step .step-card h3{color:#fff;font-size:1.05rem;font-weight:700;margin-bottom:.5rem}
.tech-detail-page .research-step .step-card p{color:#cbd5e1;line-height:1.75;font-size:.9rem;margin-bottom:0}
.tech-detail-page .implement-flow{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;counter-reset:impl-step}
.tech-detail-page .impl-step-card{background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));border:1px solid var(--border);border-radius:1.25rem;padding:2.5rem 1.5rem 1.5rem 2rem;position:relative;counter-increment:impl-step;transition:all .35s ease}
.tech-detail-page .impl-step-card::before{content:'';position:absolute;top:0;left:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--brand-color),var(--indigo),rgba(217,70,239,.5));border-radius:1.25rem 0 0 1.25rem}
.tech-detail-page .impl-step-card .step-num{position:absolute;top:-1px;left:0px;width:36px;height:36px;border-radius:1.25rem 0 1.25rem 0;background:linear-gradient(135deg,var(--brand-color),var(--indigo));color:#fff;font-size:.85rem;font-weight:800;display:flex;align-items:center;justify-content:center;z-index:3}
.tech-detail-page .impl-step-card:hover{border-color:rgba(99,102,241,.3);transform:translateY(-3px);box-shadow:0 12px 35px rgba(0,0,0,.3),0 0 30px rgba(99,102,241,.06)}
.tech-detail-page .impl-step-card h3{color:#fff;font-size:1rem;font-weight:700;margin-bottom:.6rem}
.tech-detail-page .impl-step-card p{color:#cbd5e1;line-height:1.75;font-size:.9rem;margin-bottom:0}
.tech-detail-page .eyebrow{display:inline-block;padding:.35rem 1rem;border-radius:999px;background:rgba(99,102,241,.15);color:var(--indigo);font-size:.8rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;margin-bottom:.75rem}
.tech-detail-page .section-title{font-size:clamp(1.6rem,3vw,2.25rem);font-weight:800;color:#fff;margin-bottom:.6rem}
.tech-detail-page .section-desc{color:var(--muted);font-size:1.05rem;max-width:640px;margin:0 auto 2.5rem}
.tech-detail-page .benefits-section,.tech-detail-page .research-section,.tech-detail-page .implement-section{background:rgba(99,102,241,.035)}
.tech-detail-page .tech-grid{display:flex;flex-wrap:wrap;gap:1.25rem;justify-content:center}
.tech-detail-page .tech-grid .tech-card{flex:0 0 180px}
.tech-detail-page .tech-card{background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));border:1px solid var(--border);border-radius:1rem;padding:1.5rem 1rem;text-align:center;transition:.35s;cursor:default}
.tech-detail-page .tech-card:hover{transform:translateY(-6px);border-color:rgba(99,102,241,.3);box-shadow:0 12px 35px rgba(0,0,0,.4),0 0 30px rgba(99,102,241,.08)}
.tech-detail-page .tech-card .tech-icon{width:56px;height:56px;object-fit:contain;margin-bottom:.85rem;filter:drop-shadow(0 2px 8px rgba(0,0,0,.3));transition:transform .35s}
.tech-detail-page .tech-card:hover .tech-icon{transform:scale(1.1)}
.tech-detail-page .tech-card h6{font-weight:700;color:#fff;font-size:.95rem;margin-bottom:.75rem}
.tech-detail-page .tech-card .btn{background:transparent;border:1px solid var(--border);color:#cbd5e1;border-radius:999px;padding:.3rem 1rem;font-size:.8rem;font-weight:600;transition:.3s}
.tech-detail-page .tech-card .btn:hover{background:var(--brand-color);border-color:var(--brand-color);color:#fff}
.tech-detail-page .cta-section{position:relative;overflow:hidden}
.tech-detail-page .cta-section::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 800px 400px at 20% 60%,rgba(99,102,241,.15) 0%,transparent 60%),radial-gradient(ellipse 600px 400px at 80% 40%,rgba(217,70,239,.1) 0%,transparent 60%),linear-gradient(135deg,rgba(99,102,241,.04) 0%,transparent 50%,rgba(217,70,239,.04) 100%);pointer-events:none}
.tech-detail-page .cta-section .cta-card{max-width:900px;margin:0 auto;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));border:1px solid var(--border);border-radius:1.5rem;padding:3rem 2rem;box-shadow:0 10px 40px rgba(0,0,0,.35);position:relative;z-index:1}
.tech-detail-page .cta-section h3{font-weight:800;font-size:1.6rem;color:#fff;margin-bottom:.5rem}
.tech-detail-page .cta-section .cta-desc{color:var(--muted);font-size:1rem;margin-bottom:1.5rem}
.tech-detail-page .cta-section .cta-form{display:flex;gap:.75rem;max-width:500px;margin:0 auto;flex-wrap:wrap;justify-content:center}
.tech-detail-page .cta-section .cta-form input{flex:1;min-width:200px;background:rgba(255,255,255,.06);border:1px solid var(--border);border-radius:999px;padding:.7rem 1.25rem;color:#fff;font-size:.9rem;outline:none;transition:.3s}
.tech-detail-page .cta-section .cta-form input:focus{border-color:var(--indigo);box-shadow:0 0 0 3px rgba(99,102,241,.15)}
.tech-detail-page .cta-section .cta-form input::placeholder{color:var(--muted)}
.tech-detail-page .cta-section .cta-form .input-wrap{flex:1;min-width:200px;display:flex;flex-direction:column}
.tech-detail-page .cta-section .cta-form .input-wrap input{width:100%}
.tech-detail-page .cta-section .cta-form .input-wrap .submit-result{font-size:.85rem;margin-top:.35rem;text-align:left !important}
.tech-detail-page .cta-section .cta-form .input-wrap .submit-result label{text-align:left !important;margin:0;display:block;font-weight:500}
.tech-detail-page .cta-section .cta-form .input-wrap .submit-result label.success{color:#22c55e}
.tech-detail-page .cta-section .cta-form .input-wrap .submit-result label.error{color:#ef4444}
.tech-detail-page .cta-section .cta-form .input-wrap label.error{color:#ef4444;font-size:.8rem;font-weight:500;text-align:left !important;margin-top:.25rem}
.tech-detail-page .cta-section .cta-form button{background:linear-gradient(135deg,var(--brand-color),var(--indigo));border:none;color:#fff;font-weight:700;font-size:.9rem;padding:.7rem 2rem;border-radius:999px;cursor:pointer;transition:.3s;line-height:1.4;height:44px;white-space:nowrap;outline:none;box-sizing:border-box}
.tech-detail-page .cta-section .cta-form button:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(99,102,241,.4)}
.tech-detail-page .cta-section .cta-form button:active,.tech-detail-page .cta-section .cta-form button:focus{padding:.7rem 2rem;outline:none;height:44px;box-shadow:0 0 0 3px rgba(99,102,241,.3)}
@media(max-width:991px){
    .tech-detail-page .section{padding-block:2.5rem}
    .tech-detail-page .tech-hero{padding:3rem 0 2.5rem}
    .tech-detail-page .tech-hero .hero-image-wrap img{height:260px}
    .tech-detail-page .tech-hero .hero-sub{max-width:100%}
    .tech-detail-page .implement-flow{grid-template-columns:repeat(2,1fr)}
    .tech-detail-page .benefit-grid .row{--bs-gutter-x:1.5rem;--bs-gutter-y:1.5rem}
    .tech-detail-page .research-step{padding:0 30px 40px}
}
@media(max-width:576px){
    .tech-detail-page .section{padding-block:2rem}
    .tech-detail-page .tech-hero{padding:2rem 0 1.5rem}
    .tech-detail-page .tech-hero .hero-image-wrap img{height:200px}
    .tech-detail-page .tech-hero .hero-title{font-size:1.8rem}
    .tech-detail-page .tech-hero .hero-sub{font-size:.95rem}
    .tech-detail-page .tech-hero .hero-desc{font-size:.85rem}
    .tech-detail-page .tech-hero .hero-actions a{padding:.55rem 1rem;font-size:.85rem}
    .tech-detail-page .stats-strip{padding:1.25rem 0}
    .tech-detail-page .stats-strip .stat-number{font-size:1.5rem}
    .tech-detail-page .implement-flow{grid-template-columns:1fr}
    .tech-detail-page .research-timeline::before{left:20px}
    .tech-detail-page .research-step{width:100%;padding:0 0 30px 50px;margin-left:0 !important;margin-right:0 !important;text-align:left !important}
    .tech-detail-page .research-step::before{left:0 !important;right:auto !important;width:32px;height:32px;font-size:.8rem}
    .tech-detail-page .research-step .step-card{display:block}
    .tech-detail-page .impl-step-card{flex:1 1 100%;min-width:0}
    .tech-detail-page .cta-section .cta-card{padding:2rem 1.25rem}
    .tech-detail-page .cta-section .cta-form{flex-direction:column;align-items:stretch}
    .tech-detail-page .cta-section .cta-form .input-wrap{min-width:0}
    .tech-detail-page .cta-section .cta-form button{width:100%}
    .tech-detail-page .tech-grid .tech-card{flex:0 0 calc(50% - .625rem)}
}
@media(max-width:400px){
    .tech-detail-page .tech-grid .tech-card{flex:0 0 100%}
    .tech-detail-page .tech-hero .hero-image-wrap img{height:160px}
}
.rzp-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);padding:12px 24px;border-radius:10px;font-size:.85rem;font-weight:500;z-index:99999;max-width:90%;text-align:center;animation:rzpToastIn .3s ease;box-shadow:0 8px 30px rgba(0,0,0,.4)}
.rzp-toast.error{background:#dc2626;color:#fff;border:1px solid #ef4444}
.rzp-toast.success{background:#16a34a;color:#fff;border:1px solid #22c55e}
.rzp-toast.warning{background:#d97706;color:#fff;border:1px solid #f59e0b}
@keyframes rzpToastIn{from{opacity:0;transform:translateX(-50%) translateY(20px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.spinner{display:inline-block;width:18px;height:18px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite;margin-right:6px;vertical-align:middle}
@keyframes spin{to{transform:rotate(360deg)}}
#paypal-button-container{min-height:48px;width:100%}
#paypal-button-container .paypal-buttons{margin-top:0;min-height:48px}