html {font-size: 14px;}
body { background-color: #f6f8fc; margin: 0; font-size: 1rem; line-height: 1.6; font-family: 'DM Sans', system-ui, sans-serif;
       font-size: 1rem !important; font-weight: 400; color: #000 !important;}
h1, h2, h3, h4 { font-weight: 600;}
h1 { font-size: 1.5rem; }   
h2 { font-size: 1.375rem; } 
h3 { font-size: 1.125rem; } 
h4 { font-size: 1rem; } 
h5 { font-size: .875rem; } 

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

@media (min-width: 1200px) { .container { max-width: 1180px; }}
/* Whole content background */
.content-area { background-color: #f8f9fb; padding: 40px 0;}

/* MAIN WRAPPER */
.main-wrapper { background-color:#ffffff; padding:25px; border-radius:14px; box-shadow:0 15px 35px rgba(0,0,0,0.04); }

/* MODERN SIDEBAR */
.sidebar-wrapper { background-color: transparent;}
.modern-sidebar { background:#ffffff; padding:25px; border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.05); transition:0.3s ease; }
.sidebar-title { font-weight:600; letter-spacing:0.6px; text-transform:uppercase; margin-bottom:18px; color:#0a1f44; }
.sidebar-list { list-style:none; padding:0; margin:0; }
.sidebar-list li { margin-bottom:10px; }
.sidebar-list a { display:block; padding:8px 0; font-size:14px; color:#555; text-decoration:none; position:relative; transition:all 0.25s ease; }
.sidebar-list a::after { content:""; position:absolute; left:0; bottom:0; width:0%; height:2px; background-color:#003885; transition:width 0.3s ease; }
.sidebar-list a:hover { color:#003885; }
.sidebar-list a:hover::after { width:40%; }
.sidebar-list a.active { color:#003885; font-weight:600; }
.sidebar-section + .sidebar-section { margin-top:30px; padding-top:20px; border-top:1px solid #f0f0f0; }
@media (min-width:768px) { .modern-sidebar { position:sticky; top:20px; } }

/** CUSTOM NAV-BAR **/
.custom-navbar { background-color:#0a1f44; padding:0.9rem 1rem; }
.custom-navbar .form-control { background-color: #f8f9fb !important; color: #000000 !important; }
.custom-navbar .form-control::placeholder { color:rgba(255,255,255,0.6); }
.custom-navbar .form-control:focus { background-color: #ffffff !important; color: #000000 !important; box-shadow:none; }
.navbar-dark .navbar-nav .nav-link { color:rgba(255,255,255,0.95) !important; transition:all 0.3s ease; }
.navbar-dark .navbar-nav .nav-link:hover { color:#ffffff; background-color:rgba(255,255,255,0.08); border-radius:6px; }
/** END CUSTOM NAV-BAR **/

/*** FOOTER-SECTION ***/
.footer-section { background-color:#0a1f44; color:rgba(255,255,255,0.8); }
.footer-title { color:#ffffff; font-weight:600; margin-bottom:15px; }
.footer-text { line-height:1.6; }
.footer-links li { margin-bottom:8px; }
.footer-links a { display:block; padding:2px 0; overflow:hidden; text-overflow:ellipsis; color:rgba(255,255,255,0.75); 
                 transition:0.25s ease; }
.footer-links a:hover { text-decoration:none; color:#ffffff; padding-left:6px; }
.footer-bottom { background-color:#081a39; color:rgba(255,255,255,0.6); font-size:.875rem; }
.footer-bottom a {text-decoration: none; color:rgba(255,255,255,0.6);}
/*** END FOOTER-SECTION ***/

/***  MODERN CAROUSEL ***/
.modern-carousel .carousel-inner { border-radius:12px; overflow:hidden; }
.modern-carousel img { height:420px; object-fit:cover; border-radius:14px; }
.carousel-control-prev,.carousel-control-next { z-index:2; }
.carousel-item a { position:relative; z-index:1; cursor:pointer; }
.carousel-control-prev:hover,.carousel-control-next:hover { opacity:1; }
.modern-carousel::after { content:""; position:absolute; inset:0; 
        background:linear-gradient(to bottom,rgba(0,0,0,0.1),rgba(0,0,0,0.05)); border-radius:14px; }
/***  MODERN CAROUSEL ***/

/***  VIEW ALL LINK ***/
.view-all-link {  font-weight:600; color:#003885; text-decoration:none; position:relative; transition:0.3s ease; }
.view-all-link::after { content:""; position:absolute; left:0; bottom:-3px; width:0%; height:2px; background-color:#003885; 
        transition:0.3s ease; }
.view-all-link:hover::after { width:100%; }
/*** eEND VIEW ALL LINK ***/

/***  COMPANY INTRO ***/
.company-intro { padding:5px 0 5px; }
.intro-title { font-weight:600; color:#0a1f44; }
.intro-subtitle { font-weight:400; color:#003885; }
/***  END COMPANY INTRO ***/

/***  SECTION  ***/
.section-header { margin-bottom: 35px;}
.section-title { font-weight:600; color:#0a1f44; letter-spacing:0.3px; }
.section-underline { width:50px; height:3px; background-color:#003885; border-radius:2px; margin-top:6px; }
.section-divider-soft { height:1px; background:linear-gradient(to right,transparent,#e6e9ef,transparent); margin:15px 0; }

/***  PRODUCT CARD ***/
.product-card { background:#ffffff; border-radius:12px; padding:15px; box-shadow:0 10px 25px rgba(0,0,0,0.05); 
               transition:all 0.35s ease; display:flex; flex-direction:column; }
.product-card:hover { transform:translateY(-6px); box-shadow:0 20px 45px rgba(0,0,0,0.08); }
.product-image { border-radius:12px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.product-image img { max-height:100%; max-width:100%; object-fit:contain; }

.product-body { margin-top:15px; flex-grow:1; }
.product-title { font-weight:600; line-height:1.4; min-height:calc(1.4em * 2); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.product-title a { color:#0a1f44; text-decoration:none; }
.product-title a:hover { color:#003885; }

.product-card .btn { border-radius:8px; }
.btn-brand { background-color:#0a1f44; border:1px solid #0a1f44; color:#ffffff; border-radius:8px; padding:6px 14px; transition:0.25s ease; }
.btn-brand:hover { background-color:#081a39; border-color:#081a39; color:#ffffff; box-shadow:0 8px 20px rgba(10,31,68,0.25); }
.btn-outline-brand { border:1px solid #0a1f44; color:#0a1f44; background:transparent; border-radius:8px; padding:6px 14px; transition:0.25s ease; }
.btn-outline-brand:hover { background-color:#0a1f44; color:#ffffff; }

.product-actions { display:flex; justify-content:center; gap:8px; }
.product-brand { font-size: .75rem; font-weight:600; color:#003885; text-transform:uppercase; margin-bottom:4px; }
.product-meta { font-size: .75rem; font-weight:600; color:#003885; margin-bottom:8px; }
.meta-divider { margin:0 5px; }
.product-excerpt { line-height:1.6; min-height:calc(1.6em * 3); display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.product-price-rating { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.product-rating { color:#f5a623; }
.rating-count { color:#777; margin-left:4px; }
.product-price { font-size: 1.5rem; font-weight:600; color:#0a1f44; }

/*** END PRODUCT CARD ***/

/*** PRODUCT SINGLE ***/
.product-title-single { font-weight:600; color:#0a1f44; margin-bottom:10px; }
.product-price-single { font-size: 1.5rem; font-weight:600; color:#003885; }
.product-excerpt-single { line-height:1.7; color:#555; }
.product-rating-single { display:flex; align-items:center; gap:10px; margin:10px 0; }
.product-rating-single .stars { color:#f5a623; letter-spacing:2px; }

.product-actions-single { display:flex; justify-content:flex-start; gap:15px; }
.product-rating-single .rating-text { color:#666; }
.product-price-rating-single { display:flex; align-items:center; gap:20px; margin:15px 0; }

.product-meta-inline-single { display:flex; align-items:center; gap:15px; margin:12px 0 18px 0;}
.meta-label-single { color:#777; margin-right:4px; }
.meta-value-single, .condition-badge-single { padding:3px 10px; border-radius:20px; background-color:#eef2f7; }
.meta-value-single a { text-decoration: none; color:#0a1f44;}
.meta-separator-single { width:1px; height:16px; background-color:#e6e9ef; }

/*** PRODUCT GALLERY ***/
.product-gallery { text-align:center; }
.main-product-image { border-radius:14px; object-fit:contain; background:#fff; padding:10px; box-shadow:0 10px 30px rgba(0,0,0,0.05); }
.thumbnail-row { display:flex; justify-content:center; gap:12px; padding-top:18px; margin-top:20px; border-top:1px solid #e6e9ef; }
.thumb-item { width:75px; height:75px; border-radius:10px; overflow:hidden; cursor:pointer; border:2px solid #f0f2f6; 
             background:#ffffff; transition:all 0.25s ease; }
.thumb-item img { width:100%; height:100%; object-fit:cover; }
.thumb-item:hover { border-color:#003885; transform:translateY(-2px); }
.thumb-item.active { border-color:#003885; box-shadow:0 6px 15px rgba(0,56,133,0.2); transform:translateY(-2px); }

/*** PRODUCT DESCRIPTION ***/
.product-description-content * { max-width:100%; }
.product-description-section { padding:20px 0; border-top:1px solid #eee; }
.product-description-content { line-height:1.5; color:#555; }
.product-description-content p { margin-bottom:16px; }
.product-description-content h2,.product-description-content h3,.product-description-content h4 { 
    color:#0a1f44; font-weight:600; margin-top:30px; margin-bottom:15px; }
.product-description-content ul,.product-description-content ol { padding-left:20px; margin-bottom:20px; }
.product-description-content li { margin-bottom:8px; }
.product-description-content ul li { list-style:none; position:relative; padding-left:18px; }
.product-description-content ul li::before { content:"•"; position:absolute; left:0; color:#003885; font-weight:bold; }
.product-description-content table { width:100%; border-collapse:collapse; margin-bottom:25px;}
.product-description-content table th,.product-description-content table td { border:1px solid #e6e9ef; padding:10px 12px; 
                                       text-align:left; }
.product-description-content table th { background-color:#f8f9fb; font-weight:600; color:#0a1f44; }
.product-description-content img { max-width:100%; height:auto; border-radius:10px; margin:15px 0; 
                                  box-shadow:0 10px 25px rgba(0,0,0,0.05); }
.product-description-content a { text-decoration: none; color:#003885; font-weight:500; transition:0.25s ease; }
.product-description-content a:hover { color:#0a1f44; }
.product-description-content a[href$=".pdf"] { display:inline-block; padding:6px 12px; border:1px solid #003885; 
                                               border-radius:6px; text-decoration:none; }


.header-title { font-weight: 600; color: #0a1f44; margin-bottom: 10px;}
.header-overview { color: #666; line-height: 1.7;}
.toolbar { padding: 15px 0; border-top: 1px solid #eee; border-bottom: 1px solid #eee;}
.result-count { color: #777;}

/*** PAGINATION ***/
.pagination { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:8px; margin-top:40px; }
.pagination a { text-decoration:none; padding:7px 14px; border-radius:8px; transition:all .25s ease; }
.pag-num { color:#0a1f44; background:#ffffff; border:1px solid #e6e9ef; }
.pag-num:hover { background-color:#0a1f44; color:#ffffff; border-color:#0a1f44; transform:translateY(-2px); }
.pag-num.active { background-color:#003885; color:#ffffff; border-color:#003885; font-weight:500; }
.pag-btn { color:#003885; font-weight:500; padding:7px 16px; border-radius:8px; background:#f8f9fb; border:1px solid #e6e9ef; }
.pag-btn:hover { background-color:#0a1f44; color:#ffffff; border-color:#0a1f44; transform:translateY(-2px); }
@media (max-width:576px) { .pagination { gap:6px; } .pagination a { padding:6px 10px;} }
/*** END PAGINATION ***/

/*** ERROR 404 ***/
.error-404-section { padding:50px 0; background-color:#f6f8fc; }
.error-404-wrapper { max-width:600px; margin:0 auto; }
.error-code { font-size:100px; font-weight:700; color:#0a1f44; margin-bottom:10px; }
.error-title { font-size:26px; font-weight:600; margin-bottom:15px; }
.error-description { color:#666; line-height:1.7; }
.error-actions .btn { min-width:160px; }
.error-404-wrapper::after { content:""; display:block; width:60px; height:3px; background-color:#003885; margin:25px auto 0; border-radius:2px; }
/*** END ERROR 404 ***/


/* FORM */
.contact-form-wrapper, .contact-info-wrapper { background:#ffffff; padding:25px; border-radius:14px; box-shadow:0 15px 40px rgba(0,0,0,.06); height:100%; }
.contact-form-wrapper h4, .contact-info-wrapper h4 { font-weight:700; margin-bottom:30px; }
.contact-form-wrapper label { font-weight:600; margin-bottom:6px; color:#444; }
.contact-form-wrapper .form-control { border-radius:8px; padding:12px 15px; border:1px solid #e2e8f0; transition:all .2s ease; }
.contact-form-wrapper .form-control:focus { border-color:#003885; box-shadow:0 0 0 .2rem rgba(0,56,133,.15); }
.btn-contact { background:#003885; border:none; border-radius:8px; padding:12px; font-weight:600; color:#fff; transition:all .2s ease; }
.btn-contact:hover { background:#002a63; color:#fff; }

.contact-info-item { margin-bottom:20px; color:#555; line-height:1.6; }
.contact-info-wrapper a { color:#003885; text-decoration:none; }
.contact-info-wrapper a:hover { text-decoration:underline; }

.alert-modern { border:none; border-radius:10px; padding:14px 18px; box-shadow:0 10px 25px rgba(0,0,0,.05); }
.alert-modern.alert-success { background:#e6f4ea; color:#1e7e34; }
.alert-modern.alert-danger { background:#fdecea; color:#b02a37; }
.alert-modern .close { opacity:.6; }
.alert-modern .close:hover { opacity:1; }