
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Segoe UI',sans-serif;color:#071b4d;background:#fff;overflow-x:hidden}
a{text-decoration:none}
.topbar{background:#0642b8;color:#fff;font-size:14px;padding:8px 0}
.topbar i{margin-right:6px}
.navbar{padding:16px 0;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.04)}
.logo{font-size:50px;font-weight:900;color:#0642b8;line-height:40px}
.logo small{display:block;font-size:11px;color:#0a235a;font-weight:700}
.nav-link{font-weight:600;color:#08194b!important;margin:0 12px;font-size:14px}
.nav-link.active{color:#0642b8!important;border-bottom:2px solid #0642b8}
.btn-main{background:#0642b8;color:#fff;border-radius:9px;padding:0 18px;border:2px solid #0642b8;transition:.3s}
.btn-main:hover{background:#022f91;color:#fff;transform:translateY(-2px)}
.btn-outline-main{border:2px solid #0642b8;color:#0642b8;background:#fff;border-radius:9px;padding:0 18px;font-weight:800;transition:.3s}
.btn-outline-main:hover{background:#0642b8;color:#fff;transform:translateY(-2px)}
.hero{background:linear-gradient(110deg,#f7fbff 0%,#eef6ff 56%,#0054d9 56%);padding:55px 0 45px;overflow:hidden}
.hero h1{font-size:55px;font-weight:900;line-height:1.08;color:#050b16}
.hero h1 span{color:#0642b8;display:block}
.hero p{font-size:19px;color:#26365f;margin:22px 0}
.hero-img{width:100%;max-height:430px;object-fit:contain;filter:drop-shadow(0 18px 22px rgba(0,0,0,.22))}
.hero-buttons{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.hero-buttons .btn{min-width:210px;height:54px;display:inline-flex;align-items:center;justify-content:center}
.badges{display:flex;gap:52px;margin:25px 0;flex-wrap:wrap}
.badges div{text-align:center;font-size:12px;font-weight:700}
.badges i{font-size:28px;color:#0642b8;display:block;margin-bottom:6px}
.stats{background:#0642b8;color:#fff;border-radius:14px;padding:24px;margin-top:-18px;position:relative;z-index:5}
.stat-box{border-right:1px solid rgba(255,255,255,.25)}
.stat-box:last-child{border-right:0}
.stat-box i{font-size:34px;margin-right:15px}
.stats h3{margin:0;font-weight:500}
.support-item b i {
    font-size: 22px;
}
.support-item b {
    font-size: 16px;
    font-weight: 500;
}
.support-box {
    border: 1px solid #e6ecf7;
    border-radius: 14px;
    padding: 20px 8px;
    margin-top: 10px;
    background: #fff;
}
.contact_datils p {
    margin: 0;
    line-height: 29px;
    font-size: 15px;
}
.support-item{border-left:1px solid #e9edf5;padding-left:15px}
.section-title small{color:#0642b8;font-weight:500}
.section-title h2{font-weight:700;font-size:25px}
.product-card{border:1px solid #e6ecf7;border-radius:13px;padding:18px;background:#fff;height:100%;position:relative;transition:.3s}
.product-card:hover{box-shadow:0 10px 25px rgba(0,0,0,.08);transform:translateY(-4px)}
.product-card img{height:145px;width:100%;object-fit:contain}
.tag{position:absolute;top:14px;left:14px;background:#0642b8;color:#fff;border-radius:12px;padding:6px 9px;font-size:10px;font-weight:800}
.product-card h5{font-size:17px;font-weight:800;margin-top:15px}
.product-card p{font-size:13px;color:#425171;min-height:42px}
.features{display:flex;justify-content:space-between;text-align:center;margin:12px 0;font-size:10px;color:#14327a;gap:5px}
.features i{display:block;font-size:15px;color:#0642b8}
.choose-card {
    background: #f7faff;
    border-radius: 13px;
    padding: 22px 6px;
    height: 100%;
}
.choose-card i{font-size:42px;color:#0642b8;margin-right:18px}
.launch-card{border:1px solid #e6ecf7;border-radius:13px;padding:18px;height:100%;transition:.3s}
.launch-card:hover{box-shadow:0 10px 25px rgba(0,0,0,.08);transform:translateY(-4px)}
.launch-card img{height:125px;width:100%;object-fit:contain}
.market-strip{background:#0642b8;color:#fff;padding:18px 0;margin-top:35px}
.footer{background:#061b3b;color:#fff;padding:35px 0 0}
.footer h6{font-weight:600;margin-bottom:15px}
.footer a{display:block;color:#dce7ff;font-size:16px;margin-bottom:8px}
.footer p{font-size:15px;color:#dce7ff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.15);margin-top:25px;padding:14px 0;font-size:13px}
.whatsapp{position:fixed;right:26px;bottom:28px;background:#25d366;color:#fff;width:62px;height:62px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:38px;box-shadow:0 5px 18px rgba(0,0,0,.25);z-index:99}

@media(max-width:991px){
  .topbar{text-align:center}
  .navbar .btn-main{margin-top:12px}
  .hero{background:#f4f9ff;padding:40px 0 35px;text-align:center}
  .hero h1{font-size:42px}
  .hero p{font-size:17px}
  .badges{justify-content:center;gap:20px}
  .hero-buttons{justify-content:center}
  .hero-img{margin-top:35px;max-height:330px}
  .stat-box{border-right:0;margin-bottom:18px}
  .support-item{border-left:0;padding-left:0;margin-top:20px}
}

@media(max-width:767px){
  .logo{font-size:40px;line-height:34px}
  .hero h1{font-size:34px}
  .hero p{font-size:16px}
  .hero-buttons{gap:12px}
  .hero-buttons .btn{width:100%;min-width:100%}
  .hero-img{max-height:280px}
  .stats{margin-top:20px}
  .stat-box{padding:12px 0}
  .support-box{text-align:center}
  .support-item{padding:18px 0 0}
  .product-card img,.launch-card img{height:170px}
  .section-title{display:block!important}
  .section-title h2{font-size:22px}
  .market-strip .col-md-3{margin-bottom:12px}
  .footer{text-align:center}
}
.logo img {
    width: 150px;
}

/* INNER PAGES STYLES */
/* Inner Hero */
.inner-hero { background: linear-gradient(110deg, #f7fbff 0%, #eef6ff 56%, #0054d9 56%); padding: 50px 0; overflow: hidden; color: #fff; position: relative; }
.inner-hero::before { content: ""; position: absolute; right: -50px; top: -50px; width: 300px; height: 300px; background: rgba(255,255,255,0.05); border-radius: 50%; }
.inner-hero h1 { font-size: 42px; font-weight: 900; color: #050b16; margin-bottom: 15px; }
.inner-hero h1 span { color: #0642b8; display: inline; }
.inner-hero p { font-size: 18px; color: #26365f; margin: 0; max-width: 600px; }
.breadcrumb { margin-bottom: 0; }
.breadcrumb-item a { color: #0642b8; font-weight: 600; }
.breadcrumb-item.active { color: #425171; }

/* About Page */
.story-img { width: 100%; border-radius: 14px; box-shadow: 0 15px 35px rgba(0,0,0,0.08); }
.team-card { border: 1px solid #e6ecf7; border-radius: 13px; overflow: hidden; background: #fff; transition: .3s; text-align: center; padding-bottom: 20px; }
.team-card:hover { box-shadow: 0 10px 25px rgba(0,0,0,.08); transform: translateY(-4px); }
.team-card img { width: 100%; height: 250px; object-fit: cover; border-bottom: 3px solid #0642b8; margin-bottom: 15px; }
.team-card h5 { font-size: 18px; font-weight: 800; margin-bottom: 5px; color: #071b4d; }
.team-card p { font-size: 14px; color: #425171; margin-bottom: 15px; }
.social-links a { display: inline-flex; width: 32px; height: 32px; background: #f7faff; color: #0642b8; align-items: center; justify-content: center; border-radius: 50%; margin: 0 4px; transition: .3s; }
.social-links a:hover { background: #0642b8; color: #fff; }
.process-step { text-align: center; position: relative; padding: 20px; }
.process-icon { width: 80px; height: 80px; background: #f7faff; color: #0642b8; font-size: 32px; display: flex; align-items: center; justify-content: center; border-radius: 50%; margin: 0 auto 20px; border: 2px dashed #0642b8; }
.testimonial-card { background: #f7faff; border-radius: 13px; padding: 30px; position: relative; }
.testimonial-card::before { content: "\F630"; font-family: bootstrap-icons; position: absolute; top: 15px; right: 25px; font-size: 45px; color: rgba(6, 66, 184, 0.05); }
.stars { color: #ffb800; font-size: 14px; margin-bottom: 15px; }

/* Products Page */
.filter-card { border: 1px solid #e6ecf7; border-radius: 13px; padding: 20px; background: #fff; position: sticky; top: 20px; }
.filter-card h6 { font-weight: 800; margin-bottom: 15px; padding-bottom: 10px; border-bottom: 1px solid #e9edf5; }
.form-check-label { font-size: 14px; color: #425171; }
.pagination .page-link { color: #0642b8; font-weight: 700; border-color: #e6ecf7; padding: 10px 18px; }
.pagination .page-item.active .page-link { background-color: #0642b8; border-color: #0642b8; color: #fff; }

/* Product Details Page */
.product-gallery { border: 1px solid #e6ecf7; border-radius: 14px; padding: 20px; background: #fff; text-align: center; }
.product-gallery img { max-width: 100%; height: 400px; object-fit: contain; }
.product-gallery-thumbs { display: flex; gap: 10px; margin-top: 15px; justify-content: center; }
.product-gallery-thumbs img { width: 70px; height: 70px; border: 1px solid #e6ecf7; border-radius: 8px; object-fit: cover; cursor: pointer; transition: .3s; }
.product-gallery-thumbs img:hover, .product-gallery-thumbs img.active { border-color: #0642b8; box-shadow: 0 4px 10px rgba(6,66,184,.15); }
.product-price { font-size: 32px; font-weight: 900; color: #071b4d; margin-bottom: 0; }
.product-price del { font-size: 18px; color: #9aa7c1; font-weight: 600; margin-left: 10px; }
.trust-badges { display: flex; gap: 15px; margin: 25px 0; border-top: 1px dashed #e6ecf7; border-bottom: 1px dashed #e6ecf7; padding: 15px 0; }
.trust-badge { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; color: #425171; text-align: left; line-height: 1.2; }
.trust-badge i { font-size: 24px; color: #0642b8; }
.nav-pills .nav-link { font-weight: 700; color: #425171; border-radius: 8px; padding: 12px 25px; margin-right: 10px; background: #f7faff; }
.nav-pills .nav-link.active {
    background: #0642b8;
    color: #fff !important;
}
.tab-content { background: #fff; border: 1px solid #e6ecf7; border-radius: 13px; padding: 30px; margin-top: 20px; }
.specs-table th { background: #f7faff; font-weight: 700; width: 30%; color: #071b4d; }
.specs-table td, .specs-table th { padding: 12px 15px; border-bottom: 1px solid #e6ecf7; font-size: 15px; }

/* Contact Page */
.contact-info-card { background: #fff; border: 1px solid #e6ecf7; border-radius: 13px; padding: 25px; height: 100%; transition: .3s; display: flex; align-items: flex-start; gap: 15px; }
.contact-info-card:hover { box-shadow: 0 10px 25px rgba(0,0,0,.08); transform: translateY(-4px); }
.contact-info-card i { font-size: 35px; color: #0642b8; background: #f7faff; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; border-radius: 12px; flex-shrink: 0; }
.contact-info-card h5 { font-size: 18px; font-weight: 800; margin-bottom: 8px; }
.contact-info-card p { font-size: 15px; color: #425171; margin: 0; line-height: 1.6; }
.contact-form { background: #fff; border: 1px solid #e6ecf7; border-radius: 14px; padding: 40px; }
.form-control, .form-select { border: 1px solid #e6ecf7; border-radius: 8px; padding: 12px 18px; font-size: 15px; background: #fcfdfe; }
.form-control:focus, .form-select:focus { border-color: #0642b8; box-shadow: 0 0 0 4px rgba(6,66,184,.1); background: #fff; }
.form-label { font-weight: 600; font-size: 14px; color: #071b4d; margin-bottom: 8px; }
.map-container { border-radius: 14px; overflow: hidden; height: 100%; min-height: 400px; border: 1px solid #e6ecf7; }

/* Accordion Customization */
.accordion-item { border: 1px solid #e6ecf7; border-radius: 10px !important; margin-bottom: 15px; overflow: hidden; }
.accordion-button { font-weight: 700; color: #071b4d; padding: 18px 22px; background: #fcfdfe; box-shadow: none !important; }
.accordion-button:not(.collapsed) { background: #f7faff; color: #0642b8; }
.accordion-button::after { background-size: 16px; }

@media(max-width: 991px) {
  .inner-hero { padding: 40px 0; text-align: center; }
  .inner-hero h1 { font-size: 32px; }
  .inner-hero p { font-size: 16px; margin: 0 auto; }
  .product-gallery img { height: 300px; }
  .trust-badges { flex-wrap: wrap; justify-content: center; text-align: center; }
  .trust-badge { justify-content: center; }
}










/* =========================
   PRODUCT MODAL DESIGN
========================= */

.product-modal .modal-content{
    border: none;
    border-radius: 30px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 20px 60px rgba(0,0,0,0.12);
}

.product-image-box{
    background: linear-gradient(135deg,#f5f7ff,#eef2ff);
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 50px;
}

.product-image-box img{
    max-width: 100%;
    transition: 0.4s;
}

.product-image-box img:hover{
    transform: scale(1.05);
}

.product-details{
    padding: 20px;
}

.product-badge {
    background: #0d5eff;
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    padding: 4px 12px;
    border-radius: 30px;
    display: inline-block;
    margin-bottom: 20px;
}

.product-details h2{
    font-size: 34px;
    font-weight: 700;
    color: #0a1744;
    margin-bottom: 15px;
}

.product-desc{
    color: #6b7280;
}

.feature-list{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 18px;
    margin-bottom: 35px;
}

.feature-item{
    background: #f8faff;
    padding: 18px;
    border-radius: 16px;
}

.feature-item h6{
    font-size: 14px;
    color: #0d5eff;
    margin-bottom: 6px;
    font-weight: 700;
}

.feature-item p{
    margin: 0;
    font-size: 14px;
    color: #444;
}

.price-box{
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 30px;
}

.new-price{
    font-size: 34px;
    font-weight: 700;
    color: #0a1744;
}

.old-price{
    color: #999;
    text-decoration: line-through;
    font-size: 18px;
}

.modal-buttons{
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.custom-btn {
    background: #061b3b;
    border: none;
    padding: 14px 28px;
    border-radius: 14px;
    font-weight: 600;
}
.custom-btn:hover{
    background: #0048d8;
}

.custom-outline{
    padding: 14px 28px;
    border-radius: 14px;
    font-weight: 600;
}

.custom-close{
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 5;
    background-size: 13px;
}
.available_icons {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 25px;
}

/* Responsive */

@media(max-width:991px){

    .product-details{
        padding: 30px;
    }

    .product-details h2{
        font-size: 28px;
    }
    .available_icons {
    flex-wrap: wrap;
}
.market_box {
    width: 45%;
}
}

@media(max-width:575px){

    .feature-list{
        grid-template-columns: 1fr;
    }

    .product-image-box{
        padding: 30px;
    }

    .product-details{
        padding: 25px;
    }

}

.social_icons a
{
    color: #fff;
}
