/* == variables.css == */
:root{--primary: #0070BE;--primary-dark: #082A4A;--primary-light: #EAF7FF;--primary-hover: #005FA3;--accent: #C2410C;--accent-hover: #9A3412;--success: #19A974;--danger: #E53935;--warning: #FFC107;--info: #17A2B8;--gradient-primary: linear-gradient(135deg,#0077C8 0%,#005FA3 100%);--gradient-primary-dark: linear-gradient(135deg,#0a3d6b 0%,#082A4A 100%);--gradient-accent: linear-gradient(135deg,#C2410C 0%,#9A3412 100%);--gradient-hero: linear-gradient(135deg,#0077C8 0%,#00A3E0 50%,#0077C8 100%);--bg-body: #F7F9FC;--bg-white: #FFFFFF;--bg-light: #EAF7FF;--bg-dark: #082A4A;--bg-card: #FFFFFF;--bg-footer: #082A4A;--bg-subtle: #f0f4f8;--text-dark: #17212B;--text-body: #3A4A5C;--text-muted: #64748B;--text-light: #FFFFFF;--text-price: #E53935;--text-sale: #19A974;--border: #E8EDF2;--border-hover: #0077C8;--border-radius: 8px;--border-radius-lg: 12px;--border-radius-xl: 16px;--border-radius-pill: 50px;--shadow-sm: 0 1px 3px rgba(0,0,0,0.04),0 1px 2px rgba(0,0,0,0.06);--shadow: 0 2px 8px rgba(0,0,0,0.06),0 1px 4px rgba(0,0,0,0.04);--shadow-md: 0 4px 16px rgba(0,0,0,0.08),0 2px 6px rgba(0,0,0,0.04);--shadow-lg: 0 12px 40px rgba(0,0,0,0.1),0 4px 12px rgba(0,0,0,0.05);--shadow-hover: 0 8px 25px rgba(0,119,200,0.12),0 3px 10px rgba(0,0,0,0.04);--shadow-card: 0 1px 4px rgba(0,0,0,0.04);--shadow-card-hover: 0 12px 32px rgba(0,119,200,0.12),0 4px 8px rgba(0,0,0,0.06);--font-family: 'Tajawal',sans-serif;--font-size-xs: 0.75rem;--font-size-sm: 0.875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--line-height: 1.7;--space-xs: 0.25rem;--space-sm: 0.5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--space-3xl: 4rem;--container-max: 1320px;--container-padding: 1rem;--header-height: 70px;--topbar-height: 40px;--navbar-height: 50px;--mobile-header-height: 60px;--bottom-nav-height: 60px;--sidebar-width: 280px;--transition-fast: 0.15s ease;--transition: 0.3s cubic-bezier(0.4,0,0.2,1);--transition-slow: 0.5s cubic-bezier(0.4,0,0.2,1);--transition-bounce: 0.4s cubic-bezier(0.34,1.56,0.64,1);--z-dropdown: 100;--z-sticky: 200;--z-fixed: 300;--z-drawer: 400;--z-modal: 500;--z-toast: 600;--z-tooltip: 700}
/* == base.css == */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700;800;900&display=swap');*,*::before,*::after{box-sizing: border-box;margin: 0;padding: 0}html{scroll-behavior: smooth;-webkit-text-size-adjust: 100%;font-size: 16px}body{font-family: var(--font-family);font-size: var(--font-size-base);font-weight: var(--font-weight-normal);line-height: var(--line-height);color: var(--text-body);background-color: var(--bg-body);direction: rtl;text-align: right;overflow-x: hidden;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale}a{color: var(--primary);text-decoration: none;transition: color var(--transition-fast)}a:hover{color: var(--primary-hover)}h1,h2,h3,h4,h5,h6{font-weight: var(--font-weight-bold);color: var(--text-dark);line-height: 1.3;margin-bottom: var(--space-sm)}h1{font-size: var(--font-size-4xl)}h2{font-size: var(--font-size-3xl)}h3{font-size: var(--font-size-2xl)}h4{font-size: var(--font-size-xl)}h5{font-size: var(--font-size-lg)}h6{font-size: var(--font-size-base)}img{max-width: 100%;height: auto;display: block}ul,ol{list-style: none}input,select,textarea,button{font-family: var(--font-family);font-size: var(--font-size-base);outline: none}input[type="text"],input[type="email"],input[type="tel"],input[type="password"],input[type="number"],input[type="search"],select,textarea{width: 100%;padding: 0.75rem 1rem;border: 1px solid var(--border);border-radius: var(--border-radius);background: var(--bg-white);color: var(--text-dark);transition: border-color var(--transition-fast),box-shadow var(--transition-fast)}input:focus,select:focus,textarea:focus{border-color: var(--primary);box-shadow: 0 0 0 3px rgba(0,119,200,0.1)}.btn{display: inline-flex;align-items: center;justify-content: center;gap: 0.5rem;padding: 0.75rem 1.5rem;border: none;border-radius: var(--border-radius);font-family: var(--font-family);font-size: var(--font-size-base);font-weight: var(--font-weight-semibold);cursor: pointer;transition: all var(--transition);text-decoration: none;line-height: 1;white-space: nowrap;position: relative;overflow: hidden}.btn:hover{transform: translateY(-1px)}.btn:active{transform: translateY(0) scale(0.98)}.btn-primary{background: var(--gradient-primary);color: var(--text-light);box-shadow: 0 3px 12px rgba(0,119,200,0.25)}.btn-primary:hover{box-shadow: 0 5px 18px rgba(0,119,200,0.35);color: var(--text-light)}.btn-accent{background: var(--gradient-accent);color: var(--text-light);box-shadow: 0 3px 12px rgba(255,138,0,0.25)}.btn-accent:hover{box-shadow: 0 5px 18px rgba(255,138,0,0.35);color: var(--text-light)}.btn-outline{background: transparent;border: 2px solid var(--primary);color: var(--primary)}.btn-outline:hover{background: var(--primary);color: var(--text-light);box-shadow: 0 3px 12px rgba(0,119,200,0.2)}.btn-success{background: var(--success);color: #fff}.btn-danger{background: var(--danger);color: #fff}.btn-sm{padding: 0.5rem 1rem;font-size: var(--font-size-sm)}.btn-lg{padding: 1rem 2rem;font-size: var(--font-size-lg)}.btn-block{width: 100%}.btn-pill{border-radius: var(--border-radius-pill)}.container{max-width: var(--container-max);margin: 0 auto;padding: 0 var(--container-padding)}.grid{display: grid;gap: var(--space-lg)}.grid-2{grid-template-columns: repeat(2,1fr)}.grid-3{grid-template-columns: repeat(3,1fr)}.grid-4{grid-template-columns: repeat(4,1fr)}.flex{display: flex}.flex-center{display: flex;align-items: center;justify-content: center}.flex-between{display: flex;align-items: center;justify-content: space-between}.flex-wrap{flex-wrap: wrap}.gap-sm{gap: var(--space-sm)}.gap-md{gap: var(--space-md)}.gap-lg{gap: var(--space-lg)}.card{background: var(--bg-card);border-radius: var(--border-radius-lg);box-shadow: var(--shadow-card);border: 1px solid rgba(0,0,0,0.04);overflow: hidden;transition: all var(--transition)}.card:hover{box-shadow: var(--shadow-card-hover);transform: translateY(-4px);border-color: transparent}.card-body{padding: var(--space-lg)}.badge{display: inline-flex;align-items: center;padding: 0.25rem 0.75rem;border-radius: var(--border-radius-pill);font-size: var(--font-size-xs);font-weight: var(--font-weight-bold);line-height: 1;white-space: nowrap}.badge-danger{background: var(--danger);color: #fff}.badge-success{background: var(--success);color: #fff}.badge-primary{background: var(--primary);color: #fff}.badge-accent{background: var(--accent);color: #fff}.badge-dark{background: var(--primary-dark);color: #fff}.section{padding: var(--space-3xl) 0}.section-title{font-size: var(--font-size-2xl);font-weight: var(--font-weight-extrabold);color: var(--primary-dark);text-align: center;margin-bottom: var(--space-sm)}.section-subtitle{font-size: var(--font-size-base);color: var(--text-muted);text-align: center;margin-bottom: var(--space-2xl)}.price-current{font-size: var(--font-size-xl);font-weight: var(--font-weight-bold);color: var(--primary)}.price-old{font-size: var(--font-size-sm);color: var(--text-muted);text-decoration: line-through;margin-right: 0.5rem}.stars{display: inline-flex;gap: 2px;color: #FFC107;font-size: 0.875rem}.stars .empty{color: var(--border)}.toast-container{position: fixed;top: 1rem;left: 50%;transform: translateX(-50%);z-index: var(--z-toast);display: flex;flex-direction: column;gap: 0.5rem;pointer-events: none}.toast{padding: 0.75rem 1.5rem;border-radius: var(--border-radius);font-weight: var(--font-weight-medium);box-shadow: var(--shadow-md);pointer-events: auto;animation: toastIn 0.3s ease,toastOut 0.3s ease 2.7s forwards;display: flex;align-items: center;gap: 0.5rem}.toast-success{background: var(--success);color: #fff}.toast-error{background: var(--danger);color: #fff}.toast-info{background: var(--primary);color: #fff}@keyframes toastIn{from{opacity: 0;transform: translateY(-20px)}to{opacity: 1;transform: translateY(0)}}@keyframes toastOut{from{opacity: 1}to{opacity: 0;transform: translateY(-20px)}}.overlay{position: fixed;inset: 0;background: rgba(0,0,0,0.5);z-index: var(--z-drawer);opacity: 0;visibility: hidden;transition: all var(--transition)}.overlay.active{opacity: 1;visibility: visible}.skeleton{background: linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size: 200% 100%;animation: shimmer 1.5s infinite;border-radius: var(--border-radius)}@keyframes shimmer{0%{background-position: 200% 0}100%{background-position: -200% 0}}.scroll-top{position: fixed;bottom: 145px;left: 1rem;width: 46px;height: 46px;border-radius: 50%;background: var(--gradient-primary);color: #fff;border: none;display: flex;align-items: center;justify-content: center;cursor: pointer;z-index: var(--z-fixed);opacity: 0;visibility: hidden;transition: all var(--transition);box-shadow: 0 4px 15px rgba(0,119,200,0.3);font-size: 1.1rem}.scroll-top.visible{opacity: 1;visibility: visible}.scroll-top:hover{transform: translateY(-3px);box-shadow: 0 6px 20px rgba(0,119,200,0.4)}.whatsapp-float{position: fixed;bottom: 80px;left: 1rem;width: 56px;height: 56px;border-radius: 50%;background: #25D366;color: #fff;display: flex;align-items: center;justify-content: center;font-size: 1.75rem;cursor: pointer;z-index: var(--z-fixed);box-shadow: 0 4px 15px rgba(37,211,102,0.35);transition: transform 0.3s ease,box-shadow 0.3s ease;text-decoration: none}.whatsapp-float:hover{transform: scale(1.1) translateY(-2px);color: #fff;box-shadow: 0 6px 25px rgba(37,211,102,0.55)}.whatsapp-float::before{content: '';position: absolute;inset: -4px;border-radius: 50%;border: 2px solid rgba(37,211,102,0.4);animation: wa-ring 3s ease-in-out infinite}@keyframes wa-ring{0%,100%{transform: scale(1);opacity: 0.4}50%{transform: scale(1.15);opacity: 0}}.wa-icon{display: flex;align-items: center;justify-content: center;animation: wa-sequence 10s ease-in-out infinite;will-change: transform}@keyframes wa-sequence{0%{transform: scale(1) rotate(0deg)}1.5%{transform: scale(1.25) rotate(0deg)}3%{transform: scale(1) rotate(0deg)}28%{transform: scale(1) rotate(0deg)}29%{transform: scale(1) rotate(-12deg)}30.5%{transform: scale(1) rotate(10deg)}32%{transform: scale(1) rotate(-8deg)}33%{transform: scale(1) rotate(5deg)}34%{transform: scale(1) rotate(0deg)}58%{transform: scale(1) rotate(0deg)}58.5%{transform: scale(1) translate(2px,0)}59%{transform: scale(1) translate(-2px,0)}59.5%{transform: scale(1) translate(2px,-1px)}60%{transform: scale(1) translate(-1px,1px)}60.5%{transform: scale(1) translate(1px,0)}61%{transform: scale(1) translate(0,0)}80%{transform: scale(1) translateY(0)}81%{transform: scale(1) translateY(-4px)}82%{transform: scale(1) translateY(1px)}83%{transform: scale(1) translateY(0)}100%{transform: scale(1) rotate(0deg)}}.whatsapp-float:hover .wa-icon{animation: wa-hover-pop 0.5s ease}@keyframes wa-hover-pop{0%{transform: scale(1) rotate(0deg)}20%{transform: scale(1.3) rotate(-8deg)}40%{transform: scale(1.1) rotate(6deg)}60%{transform: scale(1.15) rotate(-4deg)}80%{transform: scale(1.05) rotate(2deg)}100%{transform: scale(1) rotate(0deg)}}.wa-tooltip{position: absolute;left: calc(100% + 12px);top: 50%;transform: translateY(-50%);background: #333;color: #fff;font-size: 0.78rem;font-weight: 600;padding: 0.4rem 0.85rem;border-radius: 6px;white-space: nowrap;pointer-events: none;opacity: 0;visibility: hidden;transition: opacity 0.25s,visibility 0.25s;box-shadow: 0 2px 8px rgba(0,0,0,0.15)}.wa-tooltip::after{content: '';position: absolute;right: 100%;top: 50%;transform: translateY(-50%);border: 5px solid transparent;border-left-color: #333}.whatsapp-float:hover .wa-tooltip{opacity: 1;visibility: visible}@media (prefers-reduced-motion: reduce){.wa-icon{animation: none}.whatsapp-float::before{animation: none}.whatsapp-float:hover .wa-icon{animation: none}}@media (min-width: 1025px){.whatsapp-float{left: calc(72px + 1rem)}.wa-tooltip{right: auto;left: calc(100% + 12px)}.wa-tooltip::after{left: auto;right: 100%;border-right-color: transparent;border-left-color: #333}}.test-content-banner{background: #FFF3CD;color: #856404;padding: 0.5rem 1rem;text-align: center;font-weight: var(--font-weight-semibold);font-size: var(--font-size-sm);border-bottom: 2px solid #FFE69C}.test-content-banner i{margin-left: 0.5rem}.text-center{text-align: center}.text-right{text-align: right}.text-muted{color: var(--text-muted)}.text-primary{color: var(--primary)}.text-success{color: var(--success)}.text-danger{color: var(--danger)}.text-accent{color: var(--accent)}.fw-bold{font-weight: var(--font-weight-bold)}.mb-0{margin-bottom: 0}.mb-1{margin-bottom: var(--space-sm)}.mb-2{margin-bottom: var(--space-md)}.mb-3{margin-bottom: var(--space-lg)}.mb-4{margin-bottom: var(--space-xl)}.mt-2{margin-top: var(--space-md)}.mt-3{margin-top: var(--space-lg)}.p-2{padding: var(--space-md)}.p-3{padding: var(--space-lg)}.d-none{display: none !important}.d-block{display: block !important}.d-flex{display: flex !important}.visually-hidden{position: absolute;width: 1px;height: 1px;overflow: hidden;clip: rect(0,0,0,0)}
/* == layout.css == */
.topbar{background: var(--gradient-primary-dark);color: rgba(255,255,255,0.85);font-size: var(--font-size-sm);padding: 0.5rem 0}.topbar-message{display: flex;align-items: center;gap: 0.5rem}.topbar-message i{color: var(--accent)}.topbar-contact{display: flex;align-items: center;gap: 1.25rem}.topbar-link{color: rgba(255,255,255,0.85);display: flex;align-items: center;gap: 0.35rem}.topbar-link:hover{color: #fff}.topbar-social{display: flex;gap: 0.75rem}.topbar-social a{color: rgba(255,255,255,0.7)}.topbar-social a:hover{color: #fff}.main-header{background: var(--bg-white);padding: 0.75rem 0;border-bottom: 1px solid rgba(0,0,0,0.06);position: relative;z-index: calc(var(--z-sticky) + 1)}.main-header:focus-within{z-index: 9000}.header-logo{display: flex;align-items: center;flex-shrink: 0}.logo-text{display: flex;align-items: center;gap: 0.5rem}.logo-icon{font-size: 1.75rem;color: var(--primary)}.logo-name{display: block;font-size: 1.4rem;font-weight: 800;color: var(--primary-dark);line-height: 1.2}.logo-tagline{display: block;font-size: 0.7rem;color: var(--text-muted)}.header-search{flex: 1;max-width: 580px;margin: 0 2rem;position: relative;z-index: 9999}.search-form{display: flex;border: 2px solid #e0e5ec;border-radius: 50px;transition: border-color 0.2s ease;background: #fff;position: relative}.search-form:focus-within{border-color: var(--primary);box-shadow: 0 0 0 3px rgba(0,119,200,0.08)}.search-category{position: relative}.search-category select{border: none;border-left: 1px solid #e5e8ed;border-radius: 0;padding: 0.65rem 0.75rem;background: #f7f8fa;min-width: 130px;font-family: inherit;font-size: 0.88rem;color: #555;cursor: pointer;outline: none;-webkit-appearance: none;appearance: none}.search-category select:focus{background: #eef3f8}.sc-trigger{display: flex;align-items: center;gap: 0.5rem;border: none;border-left: 1px solid #e5e8ed;border-radius: 0 50px 50px 0;padding: 0.65rem 1.1rem 0.65rem 0.85rem;background: #f7f8fa;min-width: 135px;font-family: inherit;font-size: 0.88rem;color: #444;cursor: pointer;outline: none;transition: all 0.2s;white-space: nowrap}.sc-trigger:hover{background: #eef3f8}.sc-trigger.open{background: #eef3f8}.sc-arrow{font-size: 0.65rem;color: #999;transition: transform 0.25s cubic-bezier(0.4,0,0.2,1);margin-right: auto}.sc-trigger.open .sc-arrow{transform: rotate(180deg)}.sc-dropdown{position: absolute;top: calc(100% + 6px);right: 0;width: 220px;max-height: 380px;overflow-y: auto;background: #fff;border-radius: 10px;box-shadow: 0 10px 35px rgba(0,0,0,0.15);border: 1px solid #e5e8ed;z-index: 1000;display: none;scrollbar-width: thin;scrollbar-color: #ddd transparent}.sc-dropdown.open{display: block;animation: scFadeIn 0.2s ease}@keyframes scFadeIn{from{opacity: 0;transform: translateY(-6px)}to{opacity: 1;transform: translateY(0)}}.sc-group-label{padding: 0.55rem 0.85rem 0.35rem;font-size: 0.82rem;font-weight: 700;color: var(--primary);background: #fafbfd;border-bottom: 1px solid #f0f2f5;position: sticky;top: 0}.sc-option{padding: 0.55rem 0.85rem;font-size: 0.85rem;color: #444;cursor: pointer;transition: all 0.15s;border-bottom: 1px solid #f8f8f8}.sc-option:hover{background: #f0f7ff;color: var(--primary)}.sc-option.selected{background: var(--primary-light);color: var(--primary);font-weight: 600}.sc-option-sub{padding-right: 1.5rem;font-size: 0.83rem;color: #555}.sc-option-special{color: var(--accent);font-weight: 600}.sc-option-special i{font-size: 0.75rem}.sc-divider{height: 1px;background: #eee;margin: 0.25rem 0}.search-form input[type="search"]{border: none;border-radius: 0;flex: 1;padding: 0.65rem 1rem;font-size: 0.92rem;outline: none}.search-form input:focus{box-shadow: none}.search-btn{background: var(--gradient-primary);color: #fff;border: none;padding: 0 1.35rem;cursor: pointer;font-size: 1.15rem;transition: all 0.2s;border-radius: 50px 0 0 50px}.search-btn:hover{opacity: 0.9}.search-results{position: absolute;top: calc(100% + 4px);right: 0;left: 0;background: #fff;border-radius: 12px;box-shadow: 0 12px 40px rgba(0,0,0,0.18);z-index: 9999;display: none;max-height: 480px;overflow-y: auto;border: 1px solid #e5e8ed}.search-results.active{display: block}.sr-grid{display: grid;grid-template-columns: repeat(2,1fr);gap: 0}.sr-item{display: flex;align-items: flex-start;gap: 0.6rem;padding: 0.75rem 1rem;text-decoration: none;border-bottom: 1px solid #f0f0f0;border-left: 1px solid #f0f0f0;transition: background 0.15s}.sr-item:nth-child(2n){border-left: none}.sr-item:hover{background: #f8f9fc}.sr-img{width: 60px;height: 60px;object-fit: contain;flex-shrink: 0;border-radius: 4px}.sr-info{flex: 1;min-width: 0;text-align: right}.sr-name{font-size: 0.82rem;font-weight: 600;color: #333;line-height: 1.4;margin-bottom: 0.2rem;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden}.sr-meta{display: flex;gap: 0.4rem;flex-wrap: wrap;margin-bottom: 0.2rem}.sr-brand{font-size: 0.72rem;color: var(--primary);font-weight: 600}.sr-hp{font-size: 0.72rem;color: #888;font-weight: 500}.sr-sku{font-size: 0.7rem;color: #aaa;margin-bottom: 0.25rem;direction: ltr;text-align: right}.sr-price{font-size: 0.82rem;line-height: 1.3}.sr-price del{color: #bbb;font-size: 0.75rem;margin-left: 0.4rem;text-decoration: line-through}.sr-price strong{color: var(--primary);font-weight: 800}.sr-viewall{display: block;text-align: center;padding: 0.7rem;font-size: 0.85rem;font-weight: 600;color: var(--primary);text-decoration: none;border-top: 1px solid #eee;transition: background 0.15s}.sr-viewall:hover{background: #f0f7ff}.sr-viewall i{margin-left: 0.3rem}.sr-empty{padding: 1.5rem;text-align: center;color: #999;font-size: 0.9rem}.sr-empty i{margin-left: 0.4rem;color: #ccc}@media (max-width: 768px){.sr-grid{grid-template-columns: 1fr}.sr-item{border-left: none}}.header-actions{display: flex;align-items: center;gap: 1.25rem}.header-action{display: flex;flex-direction: column;align-items: center;gap: 0.15rem;color: var(--text-body);font-size: 0.7rem;position: relative}.header-action:hover{color: var(--primary)}.header-action i{font-size: 1.3rem}.action-count{position: absolute;top: -6px;right: -6px;background: var(--accent);color: #fff;font-size: 0.65rem;font-weight: 700;width: 18px;height: 18px;border-radius: 50%;display: flex;align-items: center;justify-content: center}.header-cart{display: flex;align-items: center;gap: 0.5rem}.cart-total{font-weight: 700;color: var(--primary-dark);font-size: var(--font-size-sm);white-space: nowrap}.main-nav{background: var(--bg-white);border-bottom: 2px solid var(--primary);position: relative;z-index: var(--z-sticky)}.mega-menu-btn{position: relative;overflow: hidden;display: flex;align-items: center;gap: 0.55rem;background: linear-gradient(135deg,#0a86d8 0%,#005FA3 100%);color: #fff;border: none;padding: 0.85rem 1.6rem;font-family: var(--font-family);font-size: 1rem;font-weight: 700;cursor: pointer;border-radius: 8px 8px 0 0;text-decoration: none;box-shadow: 0 4px 14px rgba(0,119,200,0.32);animation: svc-btn-glow 2.8s ease-in-out infinite;transition: transform 0.25s cubic-bezier(0.4,0,0.2,1),box-shadow 0.25s,background 0.25s}.mega-menu-btn>*{position: relative;z-index: 2}.mega-menu-btn::before{content: '';position: absolute;top: 0;bottom: 0;left: -75%;width: 45%;background: linear-gradient(115deg,transparent 0%,rgba(255,255,255,0.55) 50%,transparent 100%);transform: skewX(-20deg);z-index: 1;animation: svc-btn-shine 4.8s ease-in-out infinite}.mega-menu-btn .fa-chevron-down{transition: transform 0.3s cubic-bezier(0.4,0,0.2,1)}.mega-menu-btn:hover{background: linear-gradient(135deg,#0e90e6 0%,#0070bf 100%);color: #fff;transform: translateY(-1px);box-shadow: 0 8px 26px rgba(0,119,200,0.5);animation: none}.mega-menu-wrapper:hover .mega-menu-btn .fa-chevron-down{transform: rotate(180deg)}@keyframes svc-btn-glow{0%,100%{box-shadow: 0 4px 14px rgba(0,119,200,0.30)}50%{box-shadow: 0 7px 22px rgba(0,119,200,0.55)}}@keyframes svc-btn-shine{0%,32%{left: -75%}62%,100%{left: 135%}}@media (prefers-reduced-motion: reduce){.mega-menu-btn,.mega-menu-btn::before{animation: none}}.mega-menu{position: absolute;top: 100%;right: 0;background: #fff;min-width: 700px;border-radius: 0 0 12px 12px;box-shadow: 0 12px 40px rgba(0,0,0,0.12);padding: 1.5rem;z-index: var(--z-dropdown);opacity: 0;visibility: hidden;transform: translateY(10px);transition: all 0.3s cubic-bezier(0.4,0,0.2,1)}.mega-menu.active{opacity: 1;visibility: visible;transform: translateY(0)}.mega-menu-inner{display: grid;grid-template-columns: repeat(4,1fr);gap: 1.5rem}.mega-menu-title{display: block;font-weight: 700;color: var(--primary-dark);margin-bottom: 0.5rem;padding-bottom: 0.5rem;border-bottom: 2px solid var(--primary-light)}.mega-menu-list li a{display: block;padding: 0.35rem 0;color: var(--text-body);font-size: var(--font-size-sm);transition: all 0.2s}.mega-menu-list li a:hover{color: var(--primary);padding-right: 0.5rem}.nav-links{display: flex;align-items: center;list-style: none}.nav-links a{display: block;padding: 0.85rem 1rem;color: var(--text-dark);font-weight: 500;position: relative;transition: color 0.2s}.nav-links a::after{content: '';position: absolute;bottom: 0;right: 0;left: 0;height: 2px;background: var(--primary);transform: scaleX(0);transition: transform 0.3s cubic-bezier(0.4,0,0.2,1);transform-origin: center}.nav-links a:hover,.nav-links a.active{color: var(--primary)}.nav-links a:hover::after,.nav-links a.active::after{transform: scaleX(1)}.daily-offers-link{display: flex;align-items: center;gap: 0.4rem;color: var(--accent);font-weight: 700;font-size: var(--font-size-sm);animation: pulse-glow 2s infinite}@keyframes pulse-glow{0%,100%{opacity: 1}50%{opacity: 0.7}}.mega-menu--services{min-width: 380px;padding: 0.7rem}.svc-menu-inner{display: flex;flex-direction: column;gap: 0.7rem}.svc-card{position: relative;display: flex;align-items: center;gap: 0.95rem;padding: 1.15rem 1.1rem;border-radius: 16px;background: var(--bg-light,#f6f9fc);border: 1.5px solid #e6eef6;text-decoration: none;overflow: hidden;transition: transform 0.22s cubic-bezier(0.4,0,0.2,1),box-shadow 0.22s,border-color 0.22s,background 0.22s}.svc-card::before{content: '';position: absolute;inset: 0;opacity: 0;transition: opacity 0.22s;z-index: 0}.svc-card--buy::before{background: var(--gradient-primary)}.svc-card--maint::before{background: linear-gradient(135deg,#19A974,#0f7a52)}.svc-card:hover{transform: translateY(-4px);box-shadow: 0 14px 30px rgba(0,0,0,0.14);border-color: transparent}.svc-card:hover::before{opacity: 1}.svc-card>*{position: relative;z-index: 1}.svc-card__ic{flex: 0 0 auto;width: 50px;height: 50px;border-radius: 14px;display: flex;align-items: center;justify-content: center;font-size: 1.4rem;color: #fff;box-shadow: 0 6px 16px rgba(0,0,0,0.18)}.svc-card--buy .svc-card__ic{background: var(--gradient-primary)}.svc-card--maint .svc-card__ic{background: linear-gradient(135deg,#19A974,#0f7a52)}.svc-card:hover .svc-card__ic{background: #fff}.svc-card--buy:hover .svc-card__ic{color: var(--primary)}.svc-card--maint:hover .svc-card__ic{color: #0f7a52}.svc-card__body{display: flex;flex-direction: column;align-items: flex-start;gap: 0.28rem;min-width: 0}.svc-card__title{font-weight: 800;color: var(--text-dark);font-size: 1.02rem}.svc-card__desc{font-size: 0.72rem;color: var(--text-muted,#64748B);line-height: 1.45}.svc-card:hover .svc-card__title,.svc-card:hover .svc-card__desc{color: #fff}.svc-card__badge{display: inline-flex;align-items: center;gap: 4px;padding: 3px 10px;border-radius: 50px;font-size: 0.62rem;font-weight: 800;line-height: 1;letter-spacing: .2px;color: #fff;background: var(--accent);box-shadow: 0 2px 6px rgba(0,0,0,0.12)}.svc-card__badge i{font-size: 0.6rem}.svc-card--maint .svc-card__badge{background: #19A974}.svc-card:hover .svc-card__badge{background: #fff;box-shadow: 0 3px 10px rgba(0,0,0,0.18)}.svc-card--buy:hover .svc-card__badge{color: var(--primary)}.svc-card--maint:hover .svc-card__badge{color: #0f7a52}.svc-card__go{margin-inline-start: auto;flex: 0 0 auto;color: var(--text-muted,#64748B);font-size: 0.95rem;transition: transform 0.22s}.svc-card:hover .svc-card__go{color: #fff;transform: translateX(-4px)}.svc-bar{display: none}@media (max-width: 991px){.svc-bar{display: grid;grid-template-columns: 1fr 1fr;gap: 0.5rem;padding: 0.55rem 0.7rem;background: linear-gradient(180deg,#eef6ff 0%,var(--bg-white,#fff) 100%);border-bottom: 1px solid var(--border)}.svc-bar__item{position: relative;overflow: hidden;display: flex;align-items: center;gap: 0.55rem;padding: 0.55rem 0.7rem;border-radius: 13px;text-decoration: none;color: #fff;box-shadow: 0 4px 13px rgba(0,0,0,0.14);transition: transform 0.18s}.svc-bar__item--buy{background: linear-gradient(135deg,#0a86d8 0%,#005FA3 100%)}.svc-bar__item--maint{background: linear-gradient(135deg,#19A974 0%,#0f7a52 100%)}.svc-bar__item:active{transform: scale(0.97)}.svc-bar__item>*{position: relative;z-index: 2}.svc-bar__ic{flex: 0 0 auto;width: 34px;height: 34px;border-radius: 10px;background: rgba(255,255,255,0.2);display: flex;align-items: center;justify-content: center;font-size: 1rem}.svc-bar__tx{display: flex;flex-direction: column;line-height: 1.18;min-width: 0}.svc-bar__tx b{font-size: 0.82rem;font-weight: 800}.svc-bar__tx small{font-size: 0.62rem;opacity: 0.92}.svc-bar__item::before{content: '';position: absolute;top: 0;bottom: 0;left: -75%;width: 40%;background: linear-gradient(115deg,transparent 0%,rgba(255,255,255,0.4) 50%,transparent 100%);transform: skewX(-20deg);z-index: 1;animation: svc-btn-shine 5s ease-in-out infinite}}@media (prefers-reduced-motion: reduce){.svc-bar__item::before{animation: none}}.drawer-services{display: grid;grid-template-columns: 1fr 1fr;gap: 0.6rem;padding: 0 1rem 0.4rem}.drawer-svc{display: flex;flex-direction: column;align-items: center;text-align: center;gap: 0.3rem;padding: 1rem 0.6rem;border-radius: 14px;text-decoration: none;color: #fff;box-shadow: 0 6px 16px rgba(0,0,0,0.12)}.drawer-svc--buy{background: var(--gradient-primary)}.drawer-svc--maint{background: linear-gradient(135deg,#19A974,#0f7a52)}.drawer-svc:active{transform: scale(0.97)}.drawer-svc__ic{width: 42px;height: 42px;border-radius: 12px;background: rgba(255,255,255,0.18);display: flex;align-items: center;justify-content: center;font-size: 1.25rem}.drawer-svc__t{font-weight: 800;font-size: 0.92rem}.drawer-svc__d{font-size: 0.68rem;opacity: 0.9}.mobile-header{display: none;background: var(--bg-white);border-bottom: 2px solid var(--primary);position: sticky;top: 0;z-index: var(--z-sticky)}.mobile-header-inner{display: flex;align-items: center;justify-content: space-between;padding: 0.5rem 1rem;height: 60px}.mobile-menu-btn,.mobile-cart-btn{background: none;border: none;font-size: 1.3rem;color: var(--primary-dark);cursor: pointer;position: relative;padding: 0.5rem}.mobile-logo{display: flex;align-items: center;gap: 0.4rem;color: var(--primary-dark);font-size: 1.1rem;font-weight: 800}.mobile-logo .logo-icon{font-size: 1.4rem;color: var(--primary)}.drawer-overlay{position: fixed;inset: 0;background: rgba(0,0,0,0.5);z-index: var(--z-drawer);opacity: 0;visibility: hidden;transition: all 0.3s}.drawer-overlay.active{opacity: 1;visibility: visible}.mobile-drawer{position: fixed;top: 0;right: -300px;width: 300px;height: 100%;background: #fff;z-index: calc(var(--z-drawer) + 1);transition: right 0.3s;overflow-y: auto;box-shadow: var(--shadow-lg)}.mobile-drawer.active{right: 0}.drawer-header{display: flex;align-items: center;justify-content: space-between;padding: 1rem;border-bottom: 1px solid var(--border)}.drawer-tabs{display: flex}.drawer-tab{padding: 0.5rem 1rem;border: none;background: none;font-family: var(--font-family);font-weight: 500;color: var(--text-muted);cursor: pointer;border-bottom: 2px solid transparent}.drawer-tab.active{color: var(--primary);border-bottom-color: var(--primary)}.drawer-close{background: none;border: none;font-size: 1.2rem;color: var(--text-muted);cursor: pointer}.drawer-search{padding: 0.75rem 1rem;border-bottom: 1px solid var(--border)}.drawer-search form{display: flex;border: 1px solid var(--border);border-radius: 8px;overflow: hidden}.drawer-search input{flex: 1;border: none;padding: 0.5rem;font-size: var(--font-size-sm)}.drawer-search button{background: var(--primary);color: #fff;border: none;padding: 0.5rem 0.75rem;cursor: pointer}.drawer-tab-content{display: none;padding: 0.5rem 0}.drawer-tab-content.active{display: block}.drawer-menu li a{display: flex;align-items: center;justify-content: space-between;padding: 0.75rem 1rem;color: var(--text-dark);border-bottom: 1px solid var(--border)}.drawer-menu li a i:first-child{margin-left: 0.5rem;width: 20px;color: var(--primary)}.drawer-menu li a:hover{background: var(--bg-light)}.drawer-submenu{display: none;background: var(--bg-light)}.has-submenu.open .drawer-submenu{display: block}.drawer-submenu a{padding-right: 2.5rem !important;font-size: var(--font-size-sm) !important}.bottom-nav{display: none;position: fixed;bottom: 0;right: 0;left: 0;background: #fff;height: 60px;border-top: 1px solid var(--border);z-index: var(--z-fixed);box-shadow: 0 -2px 10px rgba(0,0,0,0.05)}.bottom-nav-item{flex: 1;display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 0.15rem;color: var(--text-muted);font-size: 0.65rem;font-weight: 500;position: relative}.bottom-nav-item i{font-size: 1.2rem}.bottom-nav-item.active{color: var(--primary)}.bottom-nav-badge{position: absolute;top: 2px;right: calc(50% - 18px);background: var(--accent);color: #fff;font-size: 0.6rem;font-weight: 700;width: 16px;height: 16px;border-radius: 50%;display: flex;align-items: center;justify-content: center}.bottom-nav-badge.is-empty{display: none}.site-footer{background: var(--gradient-primary-dark);color: rgba(255,255,255,0.8);margin-top: 3rem}.footer-main{padding: 3rem 0}.footer-grid{display: grid;grid-template-columns: 2fr 1fr 1fr 1fr;gap: 2rem}.footer-logo{margin-bottom: 1rem}.logo-text-light .logo-name{color: #fff}.logo-text-light .logo-tagline{color: rgba(255,255,255,0.6)}.footer-desc{font-size: var(--font-size-sm);line-height: 1.8;color: rgba(255,255,255,0.65);margin-bottom: 1rem}.footer-contact-list{display: flex;flex-direction: column;gap: 0.5rem}.footer-contact-item{display: flex;align-items: flex-start;gap: 0.5rem;font-size: var(--font-size-sm)}.footer-contact-item i{color: #4db8ff;margin-top: 0.2rem}.footer-contact-item a{color: rgba(255,255,255,0.8)}.footer-contact-item a:hover{color: #fff}.footer-title{color: #fff;font-size: var(--font-size-lg);margin-bottom: 1.5rem;padding-bottom: 0.5rem;border-bottom: 2px solid rgba(0,119,200,0.5);display: inline-block}.footer-links{display: flex;flex-direction: column;gap: 0.5rem}.footer-links a{color: rgba(255,255,255,0.7);font-size: var(--font-size-sm);display: flex;align-items: center;gap: 0.5rem;transition: all 0.2s}.footer-links a:hover{color: #fff;padding-right: 0.25rem}.footer-article-thumb{width: 50px;height: 40px;object-fit: cover;border-radius: 4px;flex-shrink: 0}.footer-social{display: flex;gap: 0.75rem}.social-link{width: 42px;height: 42px;border-radius: 50%;background: rgba(255,255,255,0.08);color: #fff;display: flex;align-items: center;justify-content: center;transition: all 0.3s cubic-bezier(0.4,0,0.2,1)}.social-link:hover{background: var(--primary);transform: translateY(-3px);box-shadow: 0 4px 15px rgba(0,119,200,0.4)}.footer-bottom{background: rgba(0,0,0,0.25);padding: 1rem 0;font-size: var(--font-size-sm)}.footer-bottom a{color: #4db8ff}.main-header.sticky{position: fixed;top: 0;left: 0;right: 0;z-index: var(--z-sticky);box-shadow: 0 2px 20px rgba(0,0,0,0.08);animation: slideDown 0.35s cubic-bezier(0.4,0,0.2,1);background: rgba(255,255,255,0.98);backdrop-filter: blur(8px)}@keyframes slideDown{from{transform: translateY(-100%)}to{transform: translateY(0)}}body.has-sticky-header{padding-top: calc(70px + 50px)}.cart-drawer-overlay{display: none;position: fixed;inset: 0;background: rgba(0,0,0,0.5);z-index: 9990;opacity: 0;transition: opacity 0.3s ease}.cart-drawer-overlay.active{display: block;opacity: 1}.cart-drawer{position: fixed;top: 0;left: -420px;width: 400px;max-width: 90vw;height: 100vh;background: #fff;z-index: 9991;display: flex;flex-direction: column;box-shadow: 4px 0 30px rgba(0,0,0,0.15);transition: left 0.35s cubic-bezier(0.19,1,0.22,1)}.cart-drawer.active{left: 0}.cart-drawer__header{display: flex;align-items: center;justify-content: space-between;padding: 1rem 1.25rem;border-bottom: 1px solid #eee;background: #FAFBFC;flex-shrink: 0}.cart-drawer__title{font-size: 1.05rem;font-weight: 700;color: var(--primary-dark);margin: 0;display: flex;align-items: center;gap: 0.5rem}.cart-drawer__title i{color: var(--primary)}.cart-drawer__close{background: none;border: none;font-size: 0.88rem;color: #666;cursor: pointer;font-family: inherit;display: flex;align-items: center;gap: 0.3rem;padding: 0.4rem 0.75rem;border-radius: 6px;transition: all 0.2s ease}.cart-drawer__close:hover{background: #f0f0f0;color: var(--danger)}.cart-drawer__body{flex: 1;overflow-y: auto;padding: 0;scrollbar-width: thin;scrollbar-color: #ddd transparent}.cart-drawer__body::-webkit-scrollbar{width: 4px}.cart-drawer__body::-webkit-scrollbar-thumb{background: #ddd;border-radius: 4px}.cart-drawer__loading{text-align: center;padding: 3rem 1rem;color: #999;font-size: 0.95rem}.cart-drawer__empty{text-align: center;padding: 3rem 1.5rem;color: #999}.cart-drawer__empty i{font-size: 3rem;color: #ddd;margin-bottom: 1rem;display: block}.cart-drawer__empty p{font-size: 0.95rem;margin-bottom: 1rem}.cart-drawer__empty a{color: var(--primary);text-decoration: none;font-weight: 600}.cd-item{display: flex;gap: 0.85rem;padding: 1rem 1.25rem;border-bottom: 1px solid #f5f5f5;align-items: flex-start;position: relative}.cd-item:last-child{border-bottom: none}.cd-item__remove{position: absolute;top: 0.75rem;left: 0.75rem;background: none;border: none;color: #ccc;cursor: pointer;font-size: 0.95rem;padding: 0.2rem;transition: color 0.15s ease;line-height: 1}.cd-item__remove:hover{color: var(--danger)}.cd-item__img{width: 70px;height: 70px;border-radius: 8px;border: 1px solid #eee;object-fit: contain;background: #fff;flex-shrink: 0}.cd-item__info{flex: 1;min-width: 0}.cd-item__name{font-size: 0.82rem;font-weight: 600;color: var(--text-dark);line-height: 1.5;margin-bottom: 0.4rem;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden}.cd-item__name a{color: inherit;text-decoration: none}.cd-item__qty{display: flex;align-items: center;gap: 0;margin-bottom: 0.4rem}.cd-qty-btn{width: 28px;height: 28px;border: 1px solid #ddd;background: #f9f9f9;cursor: pointer;font-size: 0.85rem;font-weight: 700;color: #555;display: flex;align-items: center;justify-content: center;transition: all 0.2s ease}.cd-qty-btn:first-child{border-radius: 0 4px 4px 0}.cd-qty-btn:last-child{border-radius: 4px 0 0 4px}.cd-qty-btn:hover{background: var(--primary);color: #fff;border-color: var(--primary)}.cd-qty-val{width: 32px;text-align: center;font-size: 0.85rem;font-weight: 700;color: var(--text-dark);border-top: 1px solid #ddd;border-bottom: 1px solid #ddd;height: 28px;line-height: 28px;background: #fff}.cd-item__price{font-size: 0.82rem;color: var(--primary);font-weight: 700}.cart-drawer__footer{border-top: 2px solid #eee;padding: 1rem 1.25rem;background: #FAFBFC;flex-shrink: 0}.cart-drawer__total{display: flex;justify-content: space-between;align-items: center;margin-bottom: 0.85rem;font-size: 1rem}.cart-drawer__total span{color: #666;font-weight: 500}.cart-drawer__total strong{color: var(--primary);font-size: 1.15rem;font-weight: 800}.cart-drawer__btn{display: block;width: 100%;text-align: center;padding: 0.75rem;border-radius: 8px;font-weight: 700;font-size: 0.95rem;text-decoration: none;margin-bottom: 0.5rem;transition: all 0.2s ease;font-family: inherit;border: none;cursor: pointer}.cart-drawer__btn:last-child{margin-bottom: 0}.cart-drawer__btn--view{background: var(--primary-light);color: var(--primary);border: 1px solid var(--primary)}.cart-drawer__btn--view:hover{background: var(--primary);color: #fff}.cart-drawer__btn--checkout{background: var(--accent);color: #fff}.cart-drawer__btn--checkout:hover{background: var(--accent-hover)}@media (max-width: 767px){.cart-drawer{width: 100%;max-width: 100vw;left: -100%}.cart-drawer.active{left: 0}}@media (min-width: 1025px){body{padding-right: 72px}.main-header.sticky{right: 72px}}.brand-rail{position: fixed;right: 0;top: 0;height: 100vh;width: 72px;background: #fff;z-index: 1100;display: flex;flex-direction: column;border-left: 1px solid #e5e9ef;transition: width 0.35s cubic-bezier(0.19,1,0.22,1),box-shadow 0.35s ease;overflow: hidden}.brand-rail:hover{width: 300px;box-shadow: -4px 0 30px rgba(0,0,0,0.12);z-index: 1300}.brand-rail__header{display: flex;align-items: center;gap: 10px;padding: 14px 16px;background: #fff;cursor: default;white-space: nowrap;min-height: 56px;flex-shrink: 0;border-bottom: 1px solid #e5e9ef}.brand-rail__icon{width: 40px;height: 40px;border-radius: 50%;background: var(--primary);color: #fff;display: flex;align-items: center;justify-content: center;font-size: 1.05rem;flex-shrink: 0}.brand-rail__title{font-size: 1rem;font-weight: 700;color: var(--primary-dark);opacity: 0;transform: translateX(10px);transition: opacity 0.25s ease 0.05s,transform 0.25s ease 0.05s;font-family: var(--font-family)}.brand-rail:hover .brand-rail__title{opacity: 1;transform: translateX(0)}.brand-rail__list{flex: 1;overflow-y: auto;overflow-x: hidden;scrollbar-width: none;-ms-overflow-style: none}.brand-rail__list::-webkit-scrollbar{display: none}.brand-rail__item{display: flex;align-items: center;gap: 10px;padding: 7px 14px;text-decoration: none;color: var(--text-body);border-bottom: 1px solid #F1F5F9;transition: background 0.2s ease;white-space: nowrap;min-height: 44px}.brand-rail__item:hover{background: linear-gradient(90deg,transparent,#EAF7FF 30%)}.brand-rail__item:last-child{border-bottom: none}.brand-rail__logo-wrap{width: 36px;height: 36px;display: flex;align-items: center;justify-content: center;flex-shrink: 0;background: #F8FAFB;border-radius: 8px;border: 1px solid #EEF2F6;overflow: hidden;transition: border-color 0.2s ease,transform 0.2s ease}.brand-rail__item:hover .brand-rail__logo-wrap{border-color: #0077C8;transform: scale(1.05)}.brand-rail__logo{width: 26px;height: 26px;object-fit: contain}.brand-rail__logo-fallback{font-size: 0.7rem;font-weight: 800;color: var(--primary-dark);text-align: center;line-height: 1}.brand-rail__name{flex: 1;font-size: 0.95rem;font-weight: 600;color: var(--text-dark);opacity: 0;transform: translateX(8px);transition: opacity 0.2s ease 0.08s,transform 0.2s ease 0.08s,color 0.2s ease}.brand-rail:hover .brand-rail__name{opacity: 1;transform: translateX(0)}.brand-rail__item:hover .brand-rail__name{color: var(--primary)}.brand-rail__arrow{font-size: 0.7rem;color: #B0BEC5;opacity: 0;transition: opacity 0.2s ease 0.1s,color 0.2s ease,transform 0.2s ease;flex-shrink: 0}.brand-rail:hover .brand-rail__arrow{opacity: 0.5}.brand-rail__item:hover .brand-rail__arrow{color: var(--primary);opacity: 1;transform: translateX(-4px)}@media (max-width: 1024px){.brand-rail,.brand-flyout{display: none !important}}.brand-flyout{position: fixed;z-index: 251;background: #fff;border-radius: 14px;box-shadow: 0 8px 32px rgba(0,0,0,0.12),0 2px 8px rgba(0,0,0,0.06);border: 1px solid #EEF2F6;padding: 8px 0;min-width: 160px;opacity: 0;visibility: hidden;transform: translateX(8px);transition: opacity 0.18s ease,transform 0.18s ease,visibility 0.18s ease;pointer-events: none}.brand-flyout.active{opacity: 1;visibility: visible;transform: translateX(0);pointer-events: auto}.brand-flyout__item{display: block;padding: 10px 24px;text-decoration: none;color: var(--text-dark);font-size: 0.95rem;font-weight: 500;font-family: var(--font-family);transition: background 0.15s ease,color 0.15s ease,padding-right 0.15s ease;white-space: nowrap;text-align: right;border-bottom: 1px solid #F5F7FA}.brand-flyout__item:last-child{border-bottom: none}.brand-flyout__item:hover{background: #EAF7FF;color: var(--primary);padding-right: 28px}.brand-trigger{display: none;position: fixed;right: 0;top: 50%;transform: translateY(-50%);z-index: 149;background: linear-gradient(135deg,#0077C8,#005FA3);color: #fff;border: none;padding: 12px 6px;border-radius: 8px 0 0 8px;cursor: pointer;writing-mode: vertical-rl;font-family: var(--font-family);font-size: 0.8rem;font-weight: 600;gap: 6px;align-items: center;box-shadow: -2px 0 12px rgba(0,119,200,0.25);transition: background 0.2s ease,box-shadow 0.2s ease}.brand-trigger:hover{background: linear-gradient(135deg,#005FA3,#004A80);box-shadow: -3px 0 18px rgba(0,119,200,0.35)}.brand-trigger i{writing-mode: horizontal-tb;font-size: 1rem;margin-bottom: 4px}.brand-trigger span{letter-spacing: 1px}@media (max-width: 1024px){.brand-trigger{display: flex}}.brand-drawer-overlay{position: fixed;inset: 0;background: rgba(0,0,0,0.5);z-index: var(--z-drawer);opacity: 0;visibility: hidden;transition: opacity 0.3s ease,visibility 0.3s ease}.brand-drawer-overlay.active{opacity: 1;visibility: visible}.brand-drawer{position: fixed;top: 0;right: -100%;width: 85vw;max-width: 340px;height: 100vh;background: #fff;z-index: calc(var(--z-drawer) + 1);transition: right 0.35s cubic-bezier(0.19,1,0.22,1);display: flex;flex-direction: column;overflow: hidden;box-shadow: -5px 0 25px rgba(0,0,0,0.15)}.brand-drawer.active{right: 0}.brand-drawer__header{display: flex;align-items: center;justify-content: space-between;padding: 16px 20px;background: linear-gradient(135deg,#0077C8,#005FA3);color: #fff;flex-shrink: 0}.brand-drawer__title-wrap{display: flex;align-items: center;gap: 10px}.brand-drawer__title-wrap i{font-size: 1.1rem}.brand-drawer__title-wrap h3{font-size: 1.1rem;font-weight: 700;margin: 0;font-family: var(--font-family)}.brand-drawer__close{background: rgba(255,255,255,0.15);border: none;color: #fff;width: 36px;height: 36px;border-radius: 50%;cursor: pointer;font-size: 1rem;display: flex;align-items: center;justify-content: center;transition: background 0.2s ease}.brand-drawer__close:hover{background: rgba(255,255,255,0.3)}.brand-drawer__list{flex: 1;overflow-y: auto;-webkit-overflow-scrolling: touch}.brand-drawer__group{border-bottom: 1px solid #F1F5F9}.brand-drawer__group:last-child{border-bottom: none}.brand-drawer__item{display: flex;align-items: center;gap: 12px;padding: 12px 20px;color: var(--text-dark);transition: background 0.2s ease}.brand-drawer__item:hover,.brand-drawer__item:active{background: #EAF7FF}.brand-drawer__link{display: flex;align-items: center;gap: 12px;flex: 1;text-decoration: none;color: inherit;min-width: 0}.brand-drawer__logo-wrap{width: 44px;height: 44px;display: flex;align-items: center;justify-content: center;flex-shrink: 0;background: #F8FAFB;border-radius: 10px;border: 1px solid #EEF2F6;overflow: hidden;transition: border-color 0.2s ease}.brand-drawer__item:hover .brand-drawer__logo-wrap,.brand-drawer__item:active .brand-drawer__logo-wrap{border-color: #0077C8}.brand-drawer__logo{width: 32px;height: 32px;object-fit: contain}.brand-drawer__logo-fallback{font-size: 0.85rem;font-weight: 800;color: var(--primary-dark)}.brand-drawer__name{flex: 1;font-size: 1rem;font-weight: 600;color: var(--text-dark);transition: color 0.2s ease}.brand-drawer__item:hover .brand-drawer__name,.brand-drawer__item:active .brand-drawer__name{color: var(--primary)}.brand-drawer__toggle{background: none;border: none;color: #B0BEC5;width: 36px;height: 36px;display: flex;align-items: center;justify-content: center;cursor: pointer;border-radius: 50%;transition: background 0.2s ease,color 0.2s ease,transform 0.3s ease;flex-shrink: 0;font-size: 0.8rem}.brand-drawer__toggle:hover{background: #EAF7FF;color: var(--primary)}.brand-drawer__group.open .brand-drawer__toggle{transform: rotate(180deg);color: var(--primary)}.brand-drawer__arrow-static{font-size: 0.7rem;color: #B0BEC5;flex-shrink: 0;margin-left: 8px}.brand-drawer__submenu{max-height: 0;overflow: hidden;background: #F8FAFB;transition: max-height 0.3s ease}.brand-drawer__group.open .brand-drawer__submenu{max-height: 400px}.brand-drawer__sub-item{display: flex;align-items: center;gap: 8px;padding: 10px 20px 10px 20px;padding-right: 76px;text-decoration: none;color: var(--text-body);font-size: 0.9rem;font-weight: 500;border-bottom: 1px solid #EEF2F6;transition: background 0.15s ease,color 0.15s ease}.brand-drawer__sub-item:last-child{border-bottom: none}.brand-drawer__sub-item:hover,.brand-drawer__sub-item:active{background: #E0F0FF;color: var(--primary)}.brand-drawer__sub-item i{font-size: 0.7rem;color: var(--primary);opacity: 0.5}@media (min-width: 1025px){.brand-drawer,.brand-drawer-overlay{display: none !important}}.admin-front-bar{background: linear-gradient(135deg,#1a1a2e,#16213e);color: rgba(255,255,255,0.85);font-size: 0.75rem;padding: 0;z-index: 9995;position: relative}.admin-front-bar .container{padding: 0.35rem 1rem}.afb-links{display: flex;align-items: center;gap: 0.25rem;flex-wrap: wrap}.afb-links a{color: rgba(255,255,255,0.75);text-decoration: none;padding: 0.25rem 0.6rem;border-radius: 4px;transition: all 0.2s;display: flex;align-items: center;gap: 0.3rem;font-size: 0.75rem}.afb-links a:hover{background: rgba(255,255,255,0.1);color: #fff}.afb-links a i{font-size: 0.65rem}.afb-edit{color: #4db8ff !important;font-weight: 600;background: rgba(77,184,255,0.1)}.afb-edit:hover{background: rgba(77,184,255,0.2) !important}.afb-logout{color: rgba(255,255,255,0.6);text-decoration: none;font-size: 0.72rem;display: flex;align-items: center;gap: 0.25rem;padding: 0.25rem 0.5rem;border-radius: 4px;transition: all 0.2s}.afb-logout:hover{color: #ff6b6b;background: rgba(255,107,107,0.1)}.afb-logout i{font-size: 0.65rem}@media (max-width: 768px){.admin-front-bar{display: none}}.user-dropdown-wrap{position: relative}.user-dropdown-trigger{display: flex;flex-direction: column;align-items: center;gap: 0.15rem;color: var(--text-body);font-size: 0.7rem;cursor: pointer;background: none;border: none;font-family: inherit;padding: 0.25rem 0.5rem;border-radius: 6px;transition: all 0.2s}.user-dropdown-trigger:hover{color: var(--primary);background: rgba(0,119,200,0.05)}.user-dropdown-trigger i:first-child{font-size: 1.3rem}.user-dropdown{position: absolute;top: calc(100% + 8px);left: 50%;transform: translateX(-50%);width: 220px;background: #fff;border-radius: 12px;box-shadow: 0 10px 40px rgba(0,0,0,0.15);border: 1px solid rgba(0,0,0,0.06);z-index: 1000;display: none;animation: udFadeIn 0.2s ease}.user-dropdown.open{display: block}@keyframes udFadeIn{from{opacity: 0;transform: translateX(-50%) translateY(-6px)}to{opacity: 1;transform: translateX(-50%) translateY(0)}}.ud-header{padding: 0.75rem 1rem;background: linear-gradient(135deg,var(--primary),var(--primary-dark));color: #fff;border-radius: 12px 12px 0 0;display: flex;align-items: center;gap: 0.5rem;font-size: 0.82rem;font-weight: 600}.ud-header i{font-size: 1.2rem;opacity: 0.8}.ud-item{display: flex;align-items: center;gap: 0.5rem;padding: 0.6rem 1rem;color: #444;text-decoration: none;font-size: 0.82rem;transition: all 0.15s;border-bottom: 1px solid #f5f5f5}.ud-item:hover{background: #f8f9fc;color: var(--primary)}.ud-item i{font-size: 0.78rem;width: 18px;text-align: center;color: #999}.ud-item:hover i{color: var(--primary)}.ud-admin{color: var(--accent);font-weight: 600}.ud-admin i{color: var(--accent)}.ud-admin:hover{background: rgba(255,138,0,0.05)}.ud-logout{color: #e53935}.ud-logout i{color: #e53935}.ud-logout:hover{background: rgba(229,57,53,0.05)}.ud-divider{height: 1px;background: #eee;margin: 0}.drawer-auth{padding: 1rem;border-top: 1px solid var(--border);margin-top: auto}.drawer-user-info{display: flex;align-items: center;gap: 0.5rem;padding: 0.5rem 0;margin-bottom: 0.5rem;font-weight: 600;color: var(--primary-dark);font-size: 0.9rem}.drawer-user-info i{font-size: 1.5rem;color: var(--primary)}.drawer-login-btn{display: flex;align-items: center;justify-content: center;gap: 0.5rem;padding: 0.7rem 1rem;background: var(--gradient-primary);color: #fff;border-radius: 8px;text-decoration: none;font-weight: 600;font-size: 0.85rem;transition: all 0.2s}.drawer-login-btn:hover{opacity: 0.9;color: #fff}.drawer-auth .logout-link{color: #e53935 !important}
/* == components.css == */
.product-card{background: #fff;border: 1px solid rgba(0,0,0,0.06);border-radius: 10px;overflow: hidden;position: relative;transition: all 0.35s cubic-bezier(0.4,0,0.2,1);box-shadow: 0 1px 4px rgba(0,0,0,0.04)}.product-card:hover{box-shadow: 0 12px 35px rgba(0,119,200,0.1),0 4px 10px rgba(0,0,0,0.05);border-color: transparent;transform: translateY(-5px)}.pc-image{position: relative;overflow: hidden;background: linear-gradient(180deg,#fafcff 0%,#f5f7fa 100%)}.pc-image-link{display: block;aspect-ratio: 1}.pc-image-link img{width: 100%;height: 100%;object-fit: contain;padding: 0.75rem;transition: transform 0.5s cubic-bezier(0.4,0,0.2,1)}.product-card:hover .pc-image-link img{transform: scale(1.06)}.pc-badges{position: absolute;top: 0.5rem;left: 0.5rem;right: auto;display: flex;flex-direction: column;gap: 0.3rem;z-index: 3;align-items: flex-start}.pc-badge{padding: 0.25rem 0.65rem;border-radius: 5px;font-size: 0.7rem;font-weight: 700;color: white;line-height: 1.3;letter-spacing: 0.02em}.pc-badge-sale{background: linear-gradient(135deg,#0077C8,#00A3E0)}.pc-badge-hot{background: linear-gradient(135deg,#C2410C,#9A3412)}.pc-badge-inverter{background: linear-gradient(135deg,#7B1FA2,#9C27B0)}.pc-outstock{position: absolute;bottom: 0;left: 0;right: 0;background: rgba(0,0,0,0.65);color: white;text-align: center;padding: 0.35rem;font-size: 0.75rem;font-weight: 600;backdrop-filter: blur(2px)}.pc-actions{position: absolute;top: 0.5rem;left: 0.5rem;display: flex;flex-direction: column;gap: 0.4rem;z-index: 4;opacity: 0;transform: translateY(10px);transition: all 0.35s cubic-bezier(0.4,0,0.2,1)}.product-card:hover .pc-actions{opacity: 1;transform: translateY(0)}.pc-action-btn{width: 36px;height: 36px;border-radius: 50%;background: rgba(255,255,255,0.95);border: none;color: #666;display: flex;align-items: center;justify-content: center;cursor: pointer;font-size: 0.8rem;transition: all 0.25s;text-decoration: none;box-shadow: 0 2px 10px rgba(0,0,0,0.1);backdrop-filter: blur(4px)}.pc-action-btn:hover{background: var(--primary);color: white;transform: scale(1.12);box-shadow: 0 4px 12px rgba(0,119,200,0.3)}.pc-action-btn.active{background: #E53935;color: white}.pc-hover-specs{position: absolute;bottom: 0;left: 0;right: 0;background: rgba(255,255,255,0.97);padding: 0.5rem 0.75rem;z-index: 3;border-top: 1px solid #eee;transform: translateY(100%);transition: transform 0.35s cubic-bezier(0.4,0,0.2,1);backdrop-filter: blur(4px)}.product-card:hover .pc-hover-specs{transform: translateY(0)}.pc-hover-specs table{width: 100%;border-collapse: collapse}.pc-hover-specs th,.pc-hover-specs td{font-size: 0.72rem;padding: 0.25rem 0.1rem;border-bottom: 1px dashed #ddd}.pc-hover-specs tr:last-child th,.pc-hover-specs tr:last-child td{border-bottom: none}.pc-hover-specs th{color: #888;font-weight: 600;text-align: right;width: 55px}.pc-hover-specs td{color: #333;font-weight: 500}.pc-body{padding: 0.7rem 0.85rem 0.85rem}.pc-name{font-size: 0.84rem;font-weight: 600;color: #2a2f35;line-height: 1.5;margin-bottom: 0.45rem;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;min-height: 2.4em;letter-spacing: -0.01em}.pc-name a{color: inherit;text-decoration: none}.pc-name a:hover{color: var(--primary)}.pc-price{display: flex;align-items: baseline;gap: 0.4rem;margin-bottom: 0.6rem;flex-wrap: wrap}.pc-price-current{font-size: 1.05rem;font-weight: 800;color: #005FA3}.pc-price-current small{font-size: 0.7rem;font-weight: 600}.pc-price-old{font-size: 0.78rem;color: #aaa;text-decoration: line-through}.pc-badge-save{background: linear-gradient(135deg,#ef4444,#d62828);box-shadow: 0 4px 11px rgba(214,40,40,0.32);display: inline-flex;align-items: center;gap: 4px}.pc-badge-save i{font-size: 0.62rem}.pc-cart-btn{width: 100%;padding: 0.6rem;background: var(--gradient-accent);color: white;border: none;border-radius: 8px;font-family: inherit;font-size: 0.82rem;font-weight: 700;cursor: pointer;display: flex;align-items: center;justify-content: center;gap: 0.4rem;transition: all 0.25s cubic-bezier(0.4,0,0.2,1);box-shadow: 0 2px 8px rgba(255,138,0,0.2)}.pc-cart-btn:hover{box-shadow: 0 4px 14px rgba(255,138,0,0.35);transform: translateY(-1px)}.pc-cart-btn:active{transform: translateY(0) scale(0.98)}.pc-cart-btn:disabled{background: #ccc;cursor: not-allowed;box-shadow: none}.pc-cart-btn i{font-size: 0.85rem}.add-to-cart-btn.loading{opacity: 0.7;pointer-events: none}.breadcrumb{padding: 0.85rem 0;font-size: var(--font-size-sm)}.breadcrumb-list{display: flex;align-items: center;flex-wrap: wrap;gap: 0.12rem;list-style: none;margin: 0;padding: 0}.breadcrumb-list li{display: inline-flex;align-items: center;gap: 0.12rem}.breadcrumb-list li a{color: var(--text-muted);font-weight: 600;padding: 0.28rem 0.6rem;border-radius: 8px;display: inline-flex;align-items: center;gap: 0.35rem;transition: background 0.18s,color 0.18s}.breadcrumb-list li a:hover{color: var(--primary);background: rgba(0,119,200,0.08)}.breadcrumb-list li.active{color: var(--primary-dark,#082A4A);font-weight: 700;background: rgba(0,119,200,0.07);padding: 0.28rem 0.65rem;border-radius: 8px}.breadcrumb-sep{color: #c4ced9;font-size: 0.62rem;padding: 0 0.05rem}.page-header{background: linear-gradient(135deg,#f8fbff 0%,#edf4fc 100%);border-bottom: 1px solid #e3edf7;padding: 1.1rem 0 1.35rem;margin-bottom: 1.5rem;position: relative;overflow: hidden}.page-header::before{content: "";position: absolute;inset-inline-start: -60px;top: -60px;width: 200px;height: 200px;background: radial-gradient(circle,rgba(0,119,200,0.09),transparent 70%);pointer-events: none}.page-header .container{position: relative}.page-header__crumbs{padding: 0 0 0.5rem}.page-header__title{font-size: 1.7rem;font-weight: 800;color: var(--primary-dark,#082A4A);margin: 0;line-height: 1.3;display: flex;align-items: center;gap: 0.5rem}.page-header__title i{color: var(--primary);font-size: 0.9em}.page-header__sub{font-size: 0.92rem;color: #51607a;line-height: 1.8;margin: 0.5rem 0 0;max-width: 820px}@media (max-width: 768px){.page-header{padding: 0.9rem 0 1.1rem;margin-bottom: 1.1rem}.page-header__title{font-size: 1.35rem}.page-header__sub{font-size: 0.85rem}}.article-card{background: var(--bg-card);border-radius: var(--border-radius-lg);overflow: hidden;border: 1px solid var(--border);transition: all 0.3s}.article-card:hover{box-shadow: var(--shadow-hover);transform: translateY(-2px)}.article-card-image{aspect-ratio: 16/10;overflow: hidden}.article-card-image img{width: 100%;height: 100%;object-fit: cover;transition: transform 0.3s}.article-card:hover img{transform: scale(1.05)}.article-card-body{padding: 1rem}.article-card-category{display: inline-block;padding: 0.2rem 0.6rem;background: var(--primary-light);color: var(--primary);font-size: 0.7rem;font-weight: 600;border-radius: 4px;margin-bottom: 0.5rem}.article-card-title{font-size: var(--font-size-base);font-weight: 700;color: var(--text-dark);margin-bottom: 0.5rem;line-height: 1.5;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden}.article-card-title a{color: inherit}.article-card-title a:hover{color: var(--primary)}.article-card-meta{display: flex;gap: 1rem;font-size: 0.75rem;color: var(--text-muted)}.article-card-meta i{margin-left: 0.25rem}.mini-cart{position: fixed;top: 0;left: -400px;width: 380px;height: 100%;background: #fff;z-index: calc(var(--z-drawer) + 1);box-shadow: var(--shadow-lg);transition: left 0.3s;display: flex;flex-direction: column}.mini-cart.active{left: 0}.mini-cart-header{display: flex;align-items: center;justify-content: space-between;padding: 1rem 1.25rem;border-bottom: 1px solid var(--border)}.mini-cart-header h3{font-size: 1.1rem;margin: 0}.mini-cart-close{background: none;border: none;font-size: 1.2rem;cursor: pointer;color: var(--text-muted)}.mini-cart-items{flex: 1;overflow-y: auto;padding: 1rem}.mini-cart-item{display: flex;gap: 0.75rem;padding: 0.75rem 0;border-bottom: 1px solid var(--border)}.mini-cart-item img{width: 60px;height: 60px;object-fit: contain;border-radius: 4px;background: #f9f9f9}.mini-cart-item-info{flex: 1}.mini-cart-item-name{font-size: var(--font-size-sm);font-weight: 500;margin-bottom: 0.25rem}.mini-cart-item-price{font-size: var(--font-size-sm);color: var(--primary);font-weight: 600}.mini-cart-item-qty{font-size: 0.75rem;color: var(--text-muted)}.mini-cart-item-remove{background: none;border: none;color: var(--danger);cursor: pointer;font-size: 0.85rem}.mini-cart-footer{padding: 1rem 1.25rem;border-top: 1px solid var(--border);background: var(--bg-light)}.mini-cart-total{display: flex;justify-content: space-between;font-weight: 700;font-size: 1.1rem;margin-bottom: 0.75rem}.mini-cart-buttons{display: flex;flex-direction: column;gap: 0.5rem}.modal-overlay{position: fixed;inset: 0;background: rgba(0,0,0,0.6);z-index: var(--z-modal);display: none;align-items: center;justify-content: center;padding: 1rem}.modal-overlay.active{display: flex}.modal-content{background: #fff;border-radius: var(--border-radius-lg);max-width: 800px;width: 100%;max-height: 90vh;overflow-y: auto;position: relative;animation: modalIn 0.3s ease}@keyframes modalIn{from{opacity: 0;transform: scale(0.95)}to{opacity: 1;transform: scale(1)}}.modal-close{position: absolute;top: 1rem;left: 1rem;background: var(--bg-light);border: none;width: 36px;height: 36px;border-radius: 50%;cursor: pointer;font-size: 1rem;z-index: 2}.modal-close:hover{background: var(--danger);color: #fff}.pagination{display: flex;align-items: center;justify-content: center;gap: 0.4rem;padding: 2rem 0}.pagination a,.pagination span{display: flex;align-items: center;justify-content: center;width: 40px;height: 40px;border-radius: 8px;font-weight: 500;transition: all 0.2s;border: 1px solid var(--border);color: var(--text-body)}.pagination a:hover{background: var(--primary-light);color: var(--primary);border-color: var(--primary)}.pagination .active{background: var(--primary);color: #fff;border-color: var(--primary)}.pagination .dots{border: none;color: var(--text-muted)}.cookie-bar{position: fixed;bottom: 0;left: 0;right: 0;background: var(--primary-dark);color: #fff;padding: 1rem;z-index: var(--z-toast);display: none}.cookie-bar.active{display: flex;align-items: center;justify-content: space-between;gap: 1rem}.cookie-bar p{font-size: var(--font-size-sm);margin: 0}.cookie-accept{background: var(--primary);color: #fff;border: none;padding: 0.5rem 1.5rem;border-radius: 8px;cursor: pointer;font-weight: 600}.accordion{border: 1px solid var(--border);border-radius: var(--border-radius-lg);overflow: hidden}.accordion-item{border-bottom: 1px solid var(--border)}.accordion-item:last-child{border-bottom: none}.accordion-header{display: flex;align-items: center;justify-content: space-between;padding: 1rem 1.25rem;background: var(--bg-white);cursor: pointer;font-weight: 600;color: var(--text-dark);transition: background 0.2s}.accordion-header:hover{background: var(--bg-light)}.accordion-header i{transition: transform 0.3s;color: var(--primary)}.accordion-item.active .accordion-header i{transform: rotate(180deg)}.accordion-body{max-height: 0;overflow: hidden;transition: max-height 0.3s ease}.accordion-item.active .accordion-body{max-height: 500px}.accordion-body-inner{padding: 0 1.25rem 1rem;color: var(--text-body);line-height: 1.8}.trust-grid{display: grid;grid-template-columns: repeat(3,1fr);gap: 1.5rem}.trust-card{text-align: center;padding: 1.5rem 1rem;border-radius: var(--border-radius-lg);background: var(--bg-white);border: 1px solid var(--border);transition: all 0.3s}.trust-card:hover{border-color: var(--primary);box-shadow: var(--shadow-hover);transform: translateY(-3px)}.trust-icon{width: 60px;height: 60px;border-radius: 50%;background: var(--primary-light);color: var(--primary);display: flex;align-items: center;justify-content: center;font-size: 1.5rem;margin: 0 auto 0.75rem}.trust-card h3{font-size: var(--font-size-base);margin-bottom: 0.25rem}.trust-card p{font-size: var(--font-size-sm);color: var(--text-muted);margin: 0}.brand-item{display: flex;align-items: center;justify-content: center;padding: 1rem;border: 1px solid var(--border);border-radius: var(--border-radius);background: #fff;transition: all 0.3s;height: 80px}.brand-item:hover{border-color: var(--primary);box-shadow: var(--shadow-hover)}.brand-item img{max-height: 45px;max-width: 100%;object-fit: contain;filter: grayscale(40%);transition: filter 0.3s}.brand-item:hover img{filter: none}.capacity-grid{display: grid;grid-template-columns: repeat(3,1fr);gap: 1rem}.capacity-card{text-align: center;padding: 1.25rem;border-radius: var(--border-radius-lg);background: linear-gradient(135deg,var(--primary-light),#fff);border: 1px solid var(--border);cursor: pointer;transition: all 0.3s}.capacity-card:hover{border-color: var(--primary);transform: translateY(-3px);box-shadow: var(--shadow-hover)}.capacity-icon{font-size: 2rem;color: var(--primary);margin-bottom: 0.5rem}.capacity-area{font-weight: 700;color: var(--primary-dark);margin-bottom: 0.25rem}.capacity-hp{font-size: var(--font-size-sm);color: var(--text-muted)}
/* == responsive.css == */
@media (max-width: 1199px){.mega-menu-inner{grid-template-columns: repeat(3,1fr)}.mega-menu{min-width: 600px}.grid-4{grid-template-columns: repeat(3,1fr)}.footer-grid{grid-template-columns: 1fr 1fr 1fr}.trust-grid{grid-template-columns: repeat(3,1fr)}.capacity-grid{grid-template-columns: repeat(3,1fr)}}@media (max-width: 991px){.topbar{display: none}.main-header{display: none}.main-nav{display: none}.mobile-header{display: block}.bottom-nav{display: flex}body{padding-bottom: 60px}.whatsapp-float{bottom: 80px}.scroll-top{bottom: 145px}.grid-4{grid-template-columns: repeat(2,1fr)}.grid-3{grid-template-columns: repeat(2,1fr)}.footer-grid{grid-template-columns: 1fr 1fr;gap: 1.5rem}.trust-grid{grid-template-columns: repeat(2,1fr)}.capacity-grid{grid-template-columns: repeat(3,1fr)}.section{padding: 2rem 0}.section-title{font-size: 1.3rem}.mini-cart{width: 100%;left: -100%}h1{font-size: 1.5rem}h2{font-size: 1.3rem}}@media (max-width: 767px){:root{--container-padding: 0.75rem}.grid-4,.grid-3,.grid-2{grid-template-columns: repeat(2,1fr);gap: 0.75rem}.footer-grid{grid-template-columns: 1fr}.trust-grid{grid-template-columns: repeat(2,1fr);gap: 0.75rem}.capacity-grid{grid-template-columns: repeat(2,1fr);gap: 0.75rem}.pc-body{padding: 0.5rem 0.65rem 0.65rem}.pc-name{font-size: 0.8rem}.pc-price-current{font-size: 0.95rem}.pc-hover-specs{display: none}.pc-cart-btn{padding: 0.5rem;font-size: 0.8rem;border-radius: 6px}.product-card-body{padding: 0.5rem 0.75rem 0.75rem}.product-card-name{font-size: 0.8rem}.product-card-price .current{font-size: 0.95rem}.product-card-specs{display: none}.add-to-cart-btn{padding: 0.5rem;font-size: 0.8rem}.buy-now-btn{display: none}.section{padding: 1.5rem 0}.section-title{font-size: 1.15rem}.section-subtitle{font-size: var(--font-size-sm)}.pagination a,.pagination span{width: 35px;height: 35px;font-size: var(--font-size-sm)}}@media (max-width: 374px){.grid-4,.grid-3,.grid-2{gap: 0.5rem}.pc-name,.product-card-name{font-size: 0.75rem}.capacity-grid{grid-template-columns: repeat(2,1fr)}.trust-grid{grid-template-columns: 1fr}}@media print{.topbar,.main-header,.main-nav,.mobile-header,.bottom-nav,.whatsapp-float,.scroll-top,.cookie-bar,.toast-container,.site-footer,.brand-rail,.brand-trigger,.brand-drawer,.brand-drawer-overlay{display: none !important}body{padding: 0 !important}}@media (max-width: 991px){.brand-trigger{bottom: calc(var(--bottom-nav-height) + 200px);top: auto;transform: none}}
/* == contact.css == */
.contact-grid{display: grid;grid-template-columns: 1fr 1.05fr;gap: 2rem;align-items: start;margin-top: 0.5rem}.contact-heading{font-size: 1.6rem;font-weight: 800;color: var(--primary-dark);margin-bottom: 0.5rem}.contact-lead{color: var(--text-muted);font-size: 0.95rem;line-height: 1.7;margin-bottom: 1.5rem;max-width: 46ch}.contact-cards{display: flex;flex-direction: column;gap: 0.85rem}.contact-card{display: flex;align-items: center;gap: 0.9rem;background: #fff;border: 1px solid var(--border);border-radius: 14px;padding: 0.9rem 1rem;box-shadow: 0 1px 3px rgba(15,23,42,0.04);transition: transform 0.2s ease,box-shadow 0.2s ease,border-color 0.2s ease;color: var(--text-dark);text-decoration: none}.contact-card--link:hover{transform: translateY(-2px);box-shadow: 0 8px 24px rgba(0,119,200,0.12);border-color: var(--primary-light)}.cc-icon{flex-shrink: 0;width: 46px;height: 46px;margin: 0;border-radius: 12px;display: flex;align-items: center;justify-content: center;font-size: 1.1rem;background: var(--primary-light);color: var(--primary)}.cc-icon--whatsapp{background: #E3F8EA;color: #25D366}.cc-icon--phone{background: #E6F4FF;color: var(--primary)}.cc-icon--email{background: #FFF1E6;color: var(--accent)}.cc-icon--location{background: var(--primary-light);color: var(--primary)}.cc-text{display: flex;flex-direction: column;gap: 2px;min-width: 0;flex: 1}.cc-label{font-size: 0.8rem;font-weight: 700;color: var(--text-muted)}.cc-value{font-size: 0.95rem;font-weight: 600;color: var(--text-dark);line-height: 1.55;word-break: break-word}.contact-card--link .cc-value{color: var(--primary)}.cc-arrow{flex-shrink: 0;color: #cdd7e1;font-size: 0.75rem;transition: transform 0.2s ease,color 0.2s ease}.contact-card--link:hover .cc-arrow{color: var(--primary);transform: translateX(-3px)}.contact-form-card{background: #fff;border-radius: 16px;padding: 1.75rem;border: 1px solid var(--border);box-shadow: 0 4px 24px rgba(15,23,42,0.05)}.contact-form-title{font-size: 1.2rem;font-weight: 800;color: var(--primary-dark);margin-bottom: 1.25rem;display: flex;align-items: center;gap: 0.5rem}.contact-form-title i{color: var(--primary)}.contact-form-row{display: grid;grid-template-columns: 1fr 1fr;gap: 0.75rem;margin-bottom: 0.75rem}.contact-field{margin-bottom: 0.75rem}.contact-form-card .btn-block{margin-top: 0.25rem}@media (max-width: 768px){.contact-grid{grid-template-columns: 1fr;gap: 1.25rem}.contact-heading{font-size: 1.35rem}.contact-lead{font-size: 0.9rem;margin-bottom: 1.1rem}.contact-form-card{padding: 1.25rem}.contact-form-row{grid-template-columns: 1fr}.cc-icon{width: 42px;height: 42px;font-size: 1rem}}
/* == maintenance-floating.css == */
.maint-float-btn{position: fixed;bottom: 190px;right: 20px;z-index: 1200;display: flex;align-items: center;gap: 0.55rem;padding: 0.7rem 1.3rem;background: linear-gradient(135deg,#0E7C4A,#19A974);color: #fff;border-radius: 50px;text-decoration: none;font-weight: 700;font-size: 0.85rem;box-shadow: 0 4px 18px rgba(14,124,74,0.35);transition: all 0.35s cubic-bezier(.25,.8,.25,1),z-index 0s;overflow: visible}body.fx-on .maint-float-btn{animation: mfAttentionCombo 3s ease-in-out infinite}.maint-float-btn i{font-size: 1.15rem;display: inline-flex;transform-origin: 50% 50%}body.fx-on .maint-float-btn i{animation: mfWrenchContinuous 2.5s ease-in-out infinite}.maint-float-btn .maint-float-text{white-space: nowrap}.maint-float-badge{position: absolute;top: -10px;left: 50%;transform: translateX(-50%);background: linear-gradient(135deg,#FF6B00,#F59E0B);color: #fff;font-size: 0.62rem;font-weight: 800;padding: 2px 10px;border-radius: 10px;white-space: nowrap;pointer-events: none;z-index: 2;box-shadow: 0 2px 8px rgba(255,107,0,0.3)}body.fx-on .maint-float-badge{animation: mfBadgePulse 2s ease-in-out infinite}.maint-float-btn .maint-tooltip{position: absolute;left: auto;right: calc(100% + 14px);top: 50%;transform: translateY(-50%) translateX(6px);background: #1E293B;color: #fff;padding: 7px 14px;border-radius: 8px;font-size: 0.72rem;font-weight: 600;white-space: nowrap;opacity: 0;pointer-events: none;transition: opacity 0.3s,transform 0.3s;box-shadow: 0 3px 12px rgba(0,0,0,0.2);z-index: 3}.maint-float-btn .maint-tooltip::after{content: '';position: absolute;left: 100%;top: 50%;transform: translateY(-50%);border: 5px solid transparent;border-left-color: #1E293B}.maint-float-btn:hover .maint-tooltip{opacity: 1;transform: translateY(-50%) translateX(0)}.maint-float-btn:hover{transform: translateY(-4px) scale(1.1);box-shadow: 0 8px 30px rgba(14,124,74,0.5),0 0 20px rgba(25,169,116,0.3);background: linear-gradient(135deg,#0A6B3F,#14946A);z-index: 10001}.maint-float-btn:hover i{animation: mfWrenchHover 0.6s ease forwards}.maint-float-btn:active{transform: scale(0.92) !important;transition: transform 0.1s !important}.maint-float-btn:hover{z-index: 10001 !important}@keyframes mfAttentionCombo{0%{transform: translateY(0);box-shadow: 0 4px 18px rgba(14,124,74,0.35)}15%{transform: translateY(-8px);box-shadow: 0 8px 25px rgba(14,124,74,0.5),0 0 15px rgba(25,169,116,0.2)}30%{transform: translateY(-2px);box-shadow: 0 4px 18px rgba(14,124,74,0.4)}45%{transform: translateY(-5px);box-shadow: 0 6px 22px rgba(14,124,74,0.45),0 0 10px rgba(25,169,116,0.15)}60%{transform: translateY(0);box-shadow: 0 4px 18px rgba(14,124,74,0.35)}100%{transform: translateY(0);box-shadow: 0 4px 18px rgba(14,124,74,0.35)}}@keyframes mfWrenchContinuous{0%{transform: rotate(0deg)}10%{transform: rotate(18deg)}20%{transform: rotate(-12deg)}30%{transform: rotate(10deg)}40%{transform: rotate(-6deg)}50%{transform: rotate(3deg)}60%{transform: rotate(0deg)}100%{transform: rotate(0deg)}}@keyframes mfWrenchHover{0%{transform: rotate(0deg) scale(1)}20%{transform: rotate(-30deg) scale(1.2)}40%{transform: rotate(20deg) scale(1.15)}60%{transform: rotate(-12deg) scale(1.1)}80%{transform: rotate(6deg) scale(1.05)}100%{transform: rotate(0deg) scale(1)}}@keyframes mfBadgePulse{0%,100%{transform: translateX(-50%) scale(1);opacity: 1}50%{transform: translateX(-50%) scale(1.1);opacity: 0.85}}body.drawer-open .maint-float-btn{opacity: 0 !important;pointer-events: none !important;transform: translateX(80px) !important;transition: all 0.35s cubic-bezier(.25,.8,.25,1) !important}@media (max-width: 768px){.maint-float-btn{top: 10px;left: 90px;right: auto;bottom: auto;padding: 0;border-radius: 50%;width: 52px;height: 52px;justify-content: center;box-shadow: 0 4px 16px rgba(14,124,74,0.35);overflow: visible}.maint-float-text{display: none}.maint-float-btn i{font-size: 1.25rem}.maint-float-btn .maint-tooltip{display: none}.maint-float-badge{top: -9px;left: 50%;right: auto;font-size: 0.55rem;padding: 1px 7px}.maint-float-btn:active{transform: scale(0.88) !important;box-shadow: 0 2px 8px rgba(14,124,74,0.3) !important}}@media (max-width: 420px){.maint-float-btn{top: 10px;left: 82px;right: auto;bottom: auto;width: 48px;height: 48px}}@media (prefers-reduced-motion: reduce){.maint-float-btn,.maint-float-btn i,.maint-float-badge{animation: none !important;transition: none !important}}body.page-maintenance-booking .maint-float-btn{display: none}
/* == mobile-premium.css == */
@media (max-width: 991px){html,body{max-width: 100%;overflow-x: hidden;overflow-x: clip;overscroll-behavior-y: none}img,svg,video,iframe,canvas,table,pre,code{max-width: 100%}.container{width: 100%}}@media (max-width: 600px){#mainContent [style*="grid-template-columns:1fr 1fr"],#mainContent [style*="grid-template-columns: 1fr 1fr"],#mainContent [style*="grid-template-columns:repeat(2"],#mainContent [style*="grid-template-columns: repeat(2"]{grid-template-columns: 1fr !important}}@media (max-width: 991px){.cart-drawer{height: 100vh;height: 100dvh}.cart-drawer__body{-webkit-overflow-scrolling: touch;overscroll-behavior: contain}.cart-drawer__footer{padding-bottom: calc(1rem + env(safe-area-inset-bottom,0px))}.mobile-drawer,.brand-drawer{height: 100vh;height: 100dvh;-webkit-overflow-scrolling: touch}}@media (max-width: 991px){body{padding-bottom: calc(var(--bottom-nav-height) + env(safe-area-inset-bottom,0px))}.bottom-nav{height: auto;min-height: var(--bottom-nav-height);padding-bottom: env(safe-area-inset-bottom,0px);-webkit-backface-visibility: hidden;backface-visibility: hidden}.whatsapp-float{bottom: calc(80px + env(safe-area-inset-bottom,0px))}.scroll-top{bottom: calc(145px + env(safe-area-inset-bottom,0px))}.mobile-cart-btn .action-count{top: 2px;right: -2px}}@media (max-width: 991px){input,select,textarea{font-size: 16px !important}}@media (max-width: 991px){.account-nav,.compare-table-wrapper,.shop-toolbar,[class*="-scroll"],[class*="-tabs"]{-webkit-overflow-scrolling: touch}a,button,.btn,.header-action,.bottom-nav-item,.pc-cart-btn,.add-to-cart-btn,.qty-btn,.cd-qty-btn{-webkit-tap-highlight-color: transparent}.bottom-nav-item{min-height: var(--bottom-nav-height)}.pc-price-current,.price-current,.cart-drawer__total strong{white-space: nowrap}}@media (max-width: 991px){.auth-page{min-height: 100vh;min-height: 100dvh}}@media (max-width: 991px){.mobile-drawer{width: 86vw;max-width: 330px;right: -340px;display: flex;flex-direction: column;background: #fff;box-shadow: -10px 0 44px rgba(8,42,74,0.20)}.mobile-drawer.active{right: 0}.drawer-overlay{backdrop-filter: blur(2px);background: rgba(8,42,74,0.45)}.mobile-drawer .drawer-header{padding: 0.85rem 0.9rem;background: linear-gradient(135deg,var(--primary-dark),var(--primary));border-bottom: none;flex-shrink: 0}.mobile-drawer .drawer-tabs{gap: 0.25rem;background: rgba(255,255,255,0.16);padding: 4px;border-radius: 11px}.mobile-drawer .drawer-tab{color: rgba(255,255,255,0.9);font-weight: 700;font-size: 0.84rem;padding: 0.42rem 0.85rem;border-radius: 8px;border-bottom: none !important;transition: background .2s,color .2s}.mobile-drawer .drawer-tab.active{background: #fff;color: var(--primary);border-bottom: none !important;box-shadow: 0 2px 6px rgba(0,0,0,0.12)}.mobile-drawer .drawer-close{width: 34px;height: 34px;border-radius: 50%;background: rgba(255,255,255,0.18);color: #fff;display: flex;align-items: center;justify-content: center;font-size: 1rem;transition: background .2s}.mobile-drawer .drawer-close:hover{background: rgba(255,255,255,0.30)}.mobile-drawer .drawer-search{padding: 0.85rem 0.85rem 0.3rem;border-bottom: none;flex-shrink: 0}.mobile-drawer .drawer-search form{border: 1px solid #e8edf2;background: #f4f7fb;border-radius: 12px;overflow: hidden;padding: 3px}.mobile-drawer .drawer-search input{background: transparent;padding: 0.55rem 0.7rem;font-size: 0.9rem}.mobile-drawer .drawer-search button{background: var(--primary);border-radius: 9px;padding: 0.5rem 0.85rem}.mobile-drawer .drawer-content{padding: 0.35rem 0.6rem}.mobile-drawer .drawer-menu li a{display: flex;align-items: center;justify-content: flex-start;gap: 0.7rem;padding: 0.6rem 0.6rem;margin-bottom: 2px;border: none;border-bottom: none;border-radius: 12px;color: var(--text-dark);font-weight: 600;font-size: 0.92rem;transition: background .15s,color .15s}.mobile-drawer .drawer-menu li a:hover,.mobile-drawer .drawer-menu li a:active{background: var(--primary-light);color: var(--primary)}.mobile-drawer .drawer-menu li a i:first-child{margin: 0;flex-shrink: 0;width: 34px;height: 34px;border-radius: 10px;background: var(--primary-light);color: var(--primary);display: flex;align-items: center;justify-content: center;font-size: 0.95rem;transition: background .15s,color .15s}.mobile-drawer .drawer-menu li a:hover i:first-child{background: var(--primary);color: #fff}.mobile-drawer .drawer-menu .submenu-arrow{margin-inline-start: auto;color: #c2cedb;font-size: 0.75rem;transition: transform .2s}.mobile-drawer .has-submenu.open .submenu-arrow{transform: rotate(-90deg);color: var(--primary)}.mobile-drawer .drawer-submenu{background: #f7fafd;border-radius: 10px;margin: 0 0 4px;padding: 2px 0}.mobile-drawer .drawer-submenu a{padding: 0.5rem 0.9rem 0.5rem 1rem !important;font-size: 0.85rem !important;color: var(--text-body);border-radius: 8px}.mobile-drawer .drawer-auth{margin-top: auto;padding: 0.85rem;border-top: 1px solid #eef2f6;background: linear-gradient(180deg,#ffffff,#f5faff);flex-shrink: 0}.mobile-drawer .drawer-user-info{background: var(--primary-light);border-radius: 14px;padding: 0.7rem 0.85rem;margin-bottom: 0.7rem;gap: 0.7rem;font-size: 0.92rem}.mobile-drawer .drawer-user-info i{flex-shrink: 0;width: 40px;height: 40px;border-radius: 50%;background: var(--gradient-primary);color: #fff;display: flex;align-items: center;justify-content: center;font-size: 1.05rem}.mobile-drawer .drawer-auth .logout-link:hover{background: #fef2f2;color: var(--danger)}.mobile-drawer .drawer-auth .logout-link i:first-child{background: #fee2e2;color: var(--danger)}.mobile-drawer .drawer-auth .logout-link:hover i:first-child{background: var(--danger);color: #fff}.mobile-drawer .drawer-login-btn{border-radius: 12px;padding: 0.8rem 1rem;font-size: 0.9rem}}