html{scrollbar-gutter:stable}@layer tokens{:root{--primary:#0C1E3A;--primary-dark:#071428;--primary-light:#1A365D;--primary-50:#EBF0F7;--primary-100:#C8D6E7;--primary-200:#8FA8C8;--secondary:#2B5F9E;--secondary-dark:#1C4678;--secondary-light:#3E7EC2;--accent:#1565E8;--accent-hover:#0D4FC4;--accent-light:#4A8AF4;--accent-glow:rgba(21, 101, 232, 0.14);--cta-secondary:#E8590C;--cta-secondary-hover:#C2410C;--success:#0D9668;--success-light:#34D399;--success-bg:#ECFDF5;--warning:#D97706;--warning-bg:#FFFBEB;--error:#DC2626;--error-bg:#FEF2F2;--info:#2563EB;--info-bg:#EFF6FF;--text-primary:#0F172A;--text-secondary:#334155;--text-tertiary:#64748B;--text-light:#94A3B8;--text-inverse:#FFFFFF;--text-white:#FFFFFF;--bg-primary:#FFFFFF;--bg-secondary:#F8FAFC;--bg-tertiary:#F1F5F9;--bg-dark:#0F172A;--bg-gradient-start:#0C1E3A;--bg-gradient-end:#1A365D;--bg-accent:#EFF6FF;--border-color:#E2E8F0;--border-light:#F1F5F9;--border-dark:#CBD5E1;--border-focus:var(--accent-light);--border-accent:var(--accent);--group-acdc:#2563EB;--group-dcdc:#059669;--group-comm:#7C3AED;--group-io:#EA580C;--group-sensor:#DC2626;--group-drive:#0891B2;--font-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'PingFang SC','Microsoft YaHei','Noto Sans SC',sans-serif;--font-mono:'JetBrains Mono','Fira Code','Cascadia Code',monospace;--font-size-xs:12px;--font-size-sm:14px;--font-size-base:16px;--font-size-lg:18px;--font-size-xl:20px;--font-size-2xl:24px;--font-size-3xl:32px;--font-size-4xl:40px;--font-size-5xl:48px;--font-size-6xl:56px;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;--line-height-tight:1.2;--line-height-snug:1.35;--line-height-base:1.6;--line-height-relaxed:1.75;--letter-spacing-tight:-0.025em;--letter-spacing-normal:0;--letter-spacing-wide:0.025em;--letter-spacing-wider:0.05em;--letter-spacing-widest:0.1em;--spacing-0:0;--spacing-1:4px;--spacing-2:8px;--spacing-3:12px;--spacing-4:16px;--spacing-5:20px;--spacing-6:24px;--spacing-8:32px;--spacing-10:40px;--spacing-12:48px;--spacing-16:64px;--spacing-20:80px;--spacing-24:96px;--spacing-xxs:2px;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--spacing-2xl:48px;--spacing-3xl:64px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-2xl:20px;--radius-full:9999px;--shadow-xs:0 1px 2px rgba(12, 30, 58, 0.04);--shadow-sm:0 1px 3px rgba(12, 30, 58, 0.06),0 1px 2px rgba(12, 30, 58, 0.04);--shadow-md:0 4px 6px -1px rgba(12, 30, 58, 0.07),0 2px 4px -1px rgba(12, 30, 58, 0.04);--shadow-lg:0 10px 15px -3px rgba(12, 30, 58, 0.07),0 4px 6px -2px rgba(12, 30, 58, 0.03);--shadow-xl:0 20px 25px -5px rgba(12, 30, 58, 0.07),0 10px 10px -5px rgba(0,0,0,0.03);--shadow-2xl:0 25px 50px -12px rgba(12, 30, 58, 0.18);--shadow-inner:inset 0 2px 4px rgba(12, 30, 58, 0.05);--shadow-glow:0 0 20px rgba(21, 101, 232, 0.14);--transition-fast:150ms ease;--transition-base:250ms ease;--transition-slow:350ms ease;--transition-spring:500ms cubic-bezier(0.34, 1.56, 0.64, 1);--z-base:1;--z-dropdown:100;--z-sticky:1000;--z-fixed:1100;--z-overlay:1500;--z-modal:2000;--z-toast:3000;--container-max:1280px;--container-wide:1400px;--container-padding:24px;--section-padding-y:88px;--header-height:68px;--aspect-video:16/9;--aspect-card:4/3;--aspect-square:1/1}body{font-family:var(--font-sans);font-size:var(--font-size-base);font-weight:var(--font-weight-normal);line-height:var(--line-height-base);color:var(--text-primary);background-color:var(--bg-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;padding-top:calc(68px + env(safe-area-inset-top));font-feature-settings:'cv02','cv03','cv04','cv11';background:#fafbfc}h1,h2,h3,h4,h5,h6{font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);color:var(--text-primary);letter-spacing:var(--letter-spacing-tight)}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)}p{color:var(--text-secondary);margin-bottom:var(--spacing-4)}a{color:var(--accent);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--accent-hover)}#header-container{height:0;overflow:visible}b,strong{font-weight:var(--font-weight-semibold)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-2);padding:12px 24px;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);line-height:1;cursor:pointer;border:2px solid transparent;border-radius:var(--radius-lg);transition:all var(--transition-base);white-space:nowrap;text-decoration:none;min-height:48px;font-family:var(--font-sans)}.btn-primary{background-color:var(--accent);color:var(--text-inverse);border-color:var(--accent)}.btn-primary:hover{background-color:var(--accent-hover);border-color:var(--accent-hover);color:var(--text-inverse);transform:translateY(-2px);box-shadow:var(--shadow-lg),var(--shadow-glow)}.btn-primary:active{transform:translateY(0);box-shadow:var(--shadow-sm)}.btn-secondary{background-color:transparent;color:var(--accent);border-color:var(--accent)}.btn-secondary:hover{background-color:var(--accent-glow);color:var(--accent);transform:translateY(-2px)}.btn-cta{background-color:var(--cta-secondary);color:var(--text-inverse);border-color:var(--cta-secondary);font-weight:var(--font-weight-bold)}.btn-cta:hover{background-color:var(--cta-secondary-hover);border-color:var(--cta-secondary-hover);color:var(--text-inverse);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-ghost{background:0 0;color:var(--text-secondary);border-color:transparent}.btn-ghost:hover{color:var(--accent);background-color:var(--accent-glow)}.btn-sm{padding:8px 16px;font-size:var(--font-size-sm);min-height:36px;border-radius:var(--radius-md)}.btn-lg{padding:16px 32px;font-size:var(--font-size-lg);min-height:56px}:focus-visible{outline:2px solid var(--accent-light);outline-offset:2px}.btn:focus-visible{outline:2px solid var(--accent-light);outline-offset:2px;box-shadow:var(--shadow-glow)}::selection{background-color:var(--accent-glow);color:var(--text-primary)}@media (max-width:768px){:root{--font-size-2xl:20px;--font-size-3xl:24px;--font-size-4xl:28px;--font-size-5xl:32px;--font-size-6xl:36px;--section-padding-y:56px;--container-padding:16px}}.page-loader{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background-color:var(--bg-primary);transition:opacity .3s,visibility .3s;opacity:0;pointer-events:none}.page-loader.show{opacity:1;pointer-events:auto}.page-loader.hidden{opacity:0;visibility:hidden;pointer-events:none}.loader-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-4)}.loader-spinner{width:40px;height:40px;border:3px solid var(--border-color);border-top-color:var(--accent);border-radius:50%;animation:.8s linear infinite page-loader-spin}.loader-text{color:var(--text-tertiary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}@keyframes page-loader-spin{to{transform:rotate(360deg)}}@media print{body{color:#000;background:#fff}a{color:#000;text-decoration:underline}}}@layer overrides{@media (prefers-reduced-motion:reduce){*{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important;scroll-behavior:auto!important}}@media print{.carousel-arrow,.carousel-nav,.floating-buttons-container,.footer,.header,.mobile-toggle-btn,.sidebar,.smart-filter-bar,.view-toggle{display:none!important}}}@layer base{body{font-family:var(--font-sans);font-size:var(--font-size-base);line-height:var(--line-height-base);color:var(--text-primary);background-color:var(--bg-primary);min-height:100vh}.container{max-width:var(--container-max);margin:0 auto;padding:0 var(--container-padding)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;font-family:var(--font-sans);font-size:var(--font-size-base);font-weight:500;line-height:1.5;border-radius:var(--radius-md);border:2px solid transparent;cursor:pointer;transition:all var(--transition-base);text-decoration:none;white-space:nowrap;min-height:44px}.btn-primary{background-color:var(--accent);color:var(--text-white);border-color:var(--accent)}.btn-primary:hover{background-color:var(--accent-hover);border-color:var(--accent-hover);color:var(--text-white);transform:translateY(-2px);box-shadow:var(--shadow-md)}.btn-secondary{background-color:var(--secondary);color:var(--text-white);border-color:var(--secondary)}.btn-secondary:hover{background-color:var(--primary);border-color:var(--primary);color:var(--text-white);transform:translateY(-2px);box-shadow:var(--shadow-md)}.btn-outline{background-color:transparent;color:var(--accent);border-color:var(--accent)}.btn-outline:hover{background-color:var(--accent);color:var(--text-white);transform:translateY(-2px)}.btn-nav{background-color:var(--accent);color:var(--text-white);padding:10px 20px;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:500}.btn-nav:hover{background-color:var(--accent-hover);color:var(--text-white)}.header{position:fixed;top:env(safe-area-inset-top);left:0;right:0;background-color:var(--bg-primary);border-bottom:1px solid var(--border-light);z-index:1101;box-shadow:var(--shadow-xs)}.nav-container{max-width:var(--container-max);margin:0 auto;padding:0 var(--container-padding);display:flex;align-items:center;justify-content:space-between;height:100%}.nav-menu{display:flex;align-items:center;gap:var(--spacing-xs)}.nav-menu>li{position:relative}.nav-menu>li>a{display:flex;align-items:center;padding:10px 14px;font-size:var(--font-size-sm);font-weight:500;color:var(--text-primary);transition:color var(--transition-fast);border-radius:var(--radius-sm)}.nav-menu>li>a.active,.nav-menu>li>a:hover{color:var(--accent);background-color:rgba(52,152,219,.06)}.dropdown{position:relative}.dropdown-menu{position:absolute;top:calc(100% + 8px);left:0;min-width:240px;background-color:var(--bg-primary);border:1px solid var(--border-light);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;transform:translateY(8px);transition:all var(--transition-base);padding:8px 0;z-index:var(--z-dropdown)}.dropdown.active .dropdown-menu,.dropdown:hover .dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)}.dropdown-menu li a{display:block;padding:10px 20px;font-size:var(--font-size-sm);color:var(--text-secondary);transition:all var(--transition-fast)}.dropdown-menu li a:hover{background-color:var(--bg-secondary);color:var(--accent);padding-left:24px}.hero{padding:calc(68px + var(--spacing-4xl)) 0 var(--spacing-4xl);background:linear-gradient(135deg,var(--bg-secondary) 0,var(--bg-primary) 100%)}.hero-content{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-3xl);align-items:center}.hero-text h1{font-size:var(--font-size-5xl);margin-bottom:var(--spacing-lg);line-height:1.15}.hero-text p{font-size:var(--font-size-lg);color:var(--text-secondary);margin-bottom:var(--spacing-xl);line-height:var(--line-height-relaxed)}.hero-buttons{display:flex;gap:var(--spacing-md);margin-bottom:var(--spacing-xl);flex-wrap:wrap}.hero-certifications{display:flex;gap:var(--spacing-md);flex-wrap:wrap}.hero-certifications span{color:#1a1a1a;padding:6px 14px;background-color:var(--bg-tertiary);color:var(--text-primary);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:600;letter-spacing:.3px}.hero-image img{width:100%;border-radius:var(--radius-lg);box-shadow:var(--shadow-xl)}}.product-actions .btn{flex:1;padding:10px 16px;font-size:var(--font-size-sm)}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-lg);text-align:center}.stat-item{padding:var(--spacing-xl)}.stat-number{font-size:var(--font-size-4xl);font-weight:700;color:var(--accent);margin-bottom:var(--spacing-xs);line-height:1}.stat-label{font-size:var(--font-size-base);color:var(--text-secondary)}.page-header{background:linear-gradient(135deg,var(--bg-secondary) 0,var(--bg-primary) 100%);padding:calc(68px + var(--spacing-xl)) 0 var(--spacing-xl)}.float-btn{border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;color:var(--text-white);box-shadow:var(--shadow-lg);transition:all var(--transition-base);text-decoration:none;min-width:44px;min-height:44px}.float-btn:hover{transform:scale(1.08);box-shadow:var(--shadow-xl)}.float-btn:active{transform:scale(.96)}.float-btn svg{fill:currentColor;flex-shrink:0}img[loading=lazy].loaded{opacity:1}.product-header{background:linear-gradient(135deg,var(--bg-secondary) 0,var(--bg-primary) 100%);padding:calc(68px + var(--spacing-2xl)) 0 var(--spacing-2xl)}.breadcrumb{display:flex;align-items:center;gap:var(--spacing-xs);margin-bottom:var(--spacing-lg);font-size:var(--font-size-sm);flex-wrap:wrap}.breadcrumb a{color:var(--text-light)}.breadcrumb a:hover{color:var(--accent)}.breadcrumb span{color:var(--text-light)}.product-detail-header{background:var(--bg-secondary);padding:var(--spacing-lg) 0;margin-bottom:var(--spacing-xl)}.product-detail-container{padding:var(--spacing-xl) 0 var(--spacing-2xl)}.product-hero{margin-bottom:var(--spacing-2xl)}.product-hero-wrapper{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-2xl);align-items:start}.main-image{background:var(--bg-primary);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md)}.main-image img{width:100%;height:auto;display:block}.skeleton-btn{height:44px;width:100%;background:linear-gradient(90deg,var(--bg-secondary) 25%,var(--bg-tertiary) 50%,var(--bg-secondary) 75%);background-size:200% 100%;border-radius:var(--radius-md);margin-top:auto}.specs-table tbody tr:hover{background-color:var(--bg-secondary)}.stats-grid{grid-template-columns:repeat(2,1fr);gap:var(--spacing-md);grid-template-columns:repeat(2,1fr)}.stat-item{padding:var(--spacing-md)}.stat-number{font-size:var(--font-size-3xl)}.hero{padding-top:calc(68px + var(--spacing-xl));padding-bottom:var(--spacing-xl)}.product-cta .btn{width:auto;display:inline-flex}.stat-number{font-size:var(--font-size-2xl)}.product-hero-wrapper{grid-template-columns:1fr;gap:var(--spacing-lg)}.product-actions .btn{width:100%;text-align:center}.quick-inquiry .form-submit-wrapper .btn{min-width:200px}.btn-wide{min-width:200px}.cookie-btn{padding:var(--spacing-sm) var(--spacing-lg);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:500;border:none;cursor:pointer;transition:all var(--transition-fast)}.cookie-btn-accept{background-color:#165dff;color:var(--text-white)}.cookie-btn-accept:hover{background-color:#0d47a1}.cookie-btn-reject{background-color:transparent;color:var(--text-white);border:1px solid var(--text-white)}.cookie-btn-reject:hover{background-color:rgba(255,255,255,.1)}.cookie-btn-settings{background-color:transparent;color:var(--text-white);text-decoration:none;border:1px solid var(--text-white)}.cookie-btn-settings:hover{background-color:rgba(255,255,255,.1)}.page-loader{position:fixed;top:0;left:0;right:0;bottom:0;background-color:var(--bg-primary);z-index:9999;display:flex;align-items:center;justify-content:center}.page-loader.hidden{opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}.cookie-btn{padding:8px 16px;border-radius:var(--radius-md);font-size:13px;font-weight:500;cursor:pointer;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary);transition:all .2s ease;min-height:36px;text-decoration:none;display:inline-flex;align-items:center}.cookie-btn-accept{background:var(--accent);color:#fff;border-color:var(--accent)}.cookie-btn-accept:hover{background:var(--accent-hover)}.cookie-btn-reject:hover{background:var(--bg-tertiary)}.cookie-btn-settings:hover{background:var(--bg-tertiary)}@layer responsive{@media(max-width:768px){:root{--container-padding:1rem;--section-padding-y:2.5rem;--spacing-xl:1.5rem;--spacing-2xl:2rem;--spacing-3xl:2.5rem;--radius-card:12px;--radius-btn:10px}html{font-size:15px;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{-webkit-overflow-scrolling:auto;background:#fafbfc;font-feature-settings:'cv02','cv03','cv04','cv11'}.container{padding-left:var(--container-padding);padding-right:var(--container-padding);max-width:100%}section{padding-top:var(--section-padding-y);padding-bottom:var(--section-padding-y)}#header-container+main>section:first-child,#header-container+section,.calc-hero,.category-hero,.compare-hero,.quote-hero,.search-hero,.seo-hero,.solution-hero,.solutions-hero{padding-top:0!important}h1{font-size:1.625rem;line-height:1.25;letter-spacing:-.02em;font-weight:700}h2{font-size:1.375rem;line-height:1.3;letter-spacing:-.015em;font-weight:700}h3{font-size:1.125rem;line-height:1.35;letter-spacing:-.01em;font-weight:600}.btn{padding:.75rem 1.25rem;font-size:.9375rem;font-weight:600;min-height:48px;min-width:44px;border-radius:var(--radius-btn);letter-spacing:.01em;transition:all .2s ease}.btn-primary{background:linear-gradient(135deg,#1565e8 0,#1976d2 100%);box-shadow:0 2px 8px rgba(21,101,232,.25)}.btn-primary:active{background:linear-gradient(135deg,#0d4fc4 0,#1565e8 100%);box-shadow:0 1px 4px rgba(21,101,232,.2);transform:scale(.98)}.btn-lg{padding:1rem 1.75rem;font-size:1rem;min-height:52px}}}