/* =========================================================
       Tech-business theme (B2B export friendly)
       - Removed scanlines, neon pink, glitch jitter, offset shadows, super-tooltips, AI block
       - Optional: extremely subtle static halo (0.05)
       ========================================================= */
    * { margin: 0; padding: 0; box-sizing: border-box; }
    html{
      -webkit-text-size-adjust: 100%;
      text-size-adjust: 100%;
    }
    :root{
      --bg-0:#d8e4ff;
      --bg-1:#b8cbff;
      --bg-2:#edf4ff;
      --card-bg: rgba(247,249,255,0.74);
      --card-bg-2: rgba(232,238,255,0.58);
      --border: rgba(74,118,210,0.24);
      --border-strong: rgba(64,138,235,0.40);
      --accent:#2563eb;
      --accent-2:#22d3ee;
      --accent-3:#dbeafe;
      --tj-product-bg: #eaf3ff;
      --tj-product-bg-mid: #d6e8ff;
      --glass-border: rgba(86,153,233,0.30);
      --pd-primary-soft: #cfefff;
      --text-1:#13254d;
      --text-2:#36527f;
      --text-3:#5e7ea8;
      --shadow-lg: 0 26px 64px rgba(72,90,162,0.16);
      --shadow-md: 0 16px 38px rgba(84,104,184,0.12);
      --radius-card:24px;
      --radius-btn:999px;
      --radius-input:16px;
      --container-pad:32px;
      --section-pad:110px;
      --section-pad-mobile:72px;
      --grid-gap:32px;
      --nav-h:68px;
      --nav-stack-h: calc(var(--nav-h) + env(safe-area-inset-top, 0px));
    }
    @media (max-width: 480px){
      :root{
        --container-pad: 16px;
        --section-pad-mobile: 56px;
        --grid-gap: 20px;
      }
    }
    body{
      font-family: Inter, Manrope, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
      background:
        linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.10)),
        repeating-linear-gradient(90deg, rgba(123,143,220,0.10) 0 1px, transparent 1px 88px),
        repeating-linear-gradient(180deg, rgba(123,143,220,0.08) 0 1px, transparent 1px 88px),
        linear-gradient(145deg, var(--bg-0), var(--bg-1));
      color: var(--text-2);
      line-height: 1.65;
      scroll-behavior: smooth;
      min-height: 100vh;
      position: relative;
      overflow-x: hidden;
    }
    html:has(.mobile-menu.open){
      overflow: hidden;
    }
    body.mobile-nav-open{
      overflow: hidden;
      touch-action: none;
    }
    body::before{
      content:'';
      position: fixed;
      inset: 0;
      pointer-events: none;
      z-index: 0;
      background:
        radial-gradient(620px 420px at 14% 8%, rgba(124,232,255,0.18) 0%, rgba(124,232,255,0) 72%),
        radial-gradient(680px 480px at 88% 12%, rgba(95,112,255,0.16) 0%, rgba(95,112,255,0) 70%);
    }
    body::after{
      content:'';
      position: fixed;
      width: 520px;
      height: 520px;
      left: calc(var(--mouse-x, 50vw) - 260px);
      top: calc(var(--mouse-y, 30vh) - 260px);
      pointer-events: none;
      z-index: 1;
      opacity: .34;
      background: radial-gradient(circle, rgba(124,232,255,0.22) 0%, rgba(95,112,255,0.16) 28%, rgba(95,112,255,0.04) 48%, rgba(95,112,255,0) 70%);
      filter: blur(18px);
      transition: left .14s ease-out, top .14s ease-out, opacity .2s ease-out;
    }
    body.perf-lite::after{ display:none; }
    body.perf-lite .oem-fs-tech-pill{ animation:none !important; }
    body.perf-lite .oem-fs-media{ animation:none !important; transform:none !important; }
    body.perf-lite .hero-header .hero-soft-fog,
    body.perf-lite .oem-fs-mask{ backdrop-filter:none !important; }
    @media (pointer: coarse), (max-width: 1024px){
      body::after{ display:none; }
      .hero-header .hero-soft-fog,
      .oem-fs-mask{ backdrop-filter:none !important; }
    }
    .container{
      max-width: 1440px;
      margin: 0 auto;
      padding-left: max(var(--container-pad), env(safe-area-inset-left, 0px));
      padding-right: max(var(--container-pad), env(safe-area-inset-right, 0px));
      width:100%;
      position: relative;
      z-index: 2;
    }
    /* Inner pages: space below sticky nav + safe area */
    .page-top-pad{
      margin-top: max(92px, calc(var(--nav-stack-h) + 24px));
    }
    .page-top-pad--pb{
      padding-bottom: max(48px, env(safe-area-inset-bottom, 0px));
    }
    .page-top-pad--detail{
      max-width: 1320px;
    }
    img, video{
      max-width: 100%;
      height: auto;
    }
    section{ padding: var(--section-pad) 0; position: relative; z-index: 2; }
    section::before{
      content:'';
      position:absolute;
      inset:0;
      pointer-events:none;
      background: linear-gradient(90deg, transparent 0%, rgba(124,232,255,0.04) 28%, rgba(95,112,255,0.04) 72%, transparent 100%);
    }
    section::after{ content:''; position:absolute; left:0; right:0; bottom:0; height:1px; background: linear-gradient(90deg, transparent, rgba(112,132,224,0.28), transparent); }
    section:last-of-type::after{ display:none; }
    .section-alt{ background: linear-gradient(180deg, rgba(244,246,255,0.52), rgba(226,232,255,0.58)); }
    .section-title{ margin-bottom: 52px; text-align: center; }
    .section-title h2{
      font-size: clamp(2rem, 3vw, 3rem);
      font-weight: 800;
      color: var(--text-1);
      letter-spacing: -0.04em;
      font-family: Inter, Manrope, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
      text-shadow: none;
    }
    .section-title h2{ font-size: clamp(2rem, 3vw, 2.7rem); letter-spacing: -0.03em; }
    .section-title p{ font-size: 1rem; color: #b7c7e5; margin-top: 14px; max-width: 760px; margin-left:auto; margin-right:auto; line-height: 1.78; }
    :focus-visible{ outline: none; box-shadow: 0 0 0 4px rgba(95,112,255,0.18); border-radius: 14px; }

    .navbar{
      height: var(--nav-stack-h);
      padding-top: env(safe-area-inset-top, 0px);
      display:flex;
      align-items:center;
      background: rgba(241,244,255,0.64);
      backdrop-filter: blur(18px);
      position: sticky;
      top:0;
      width:100%;
      z-index: 1000;
      border-bottom: 1px solid rgba(108,126,220,0.16);
      transition: background .2s ease, box-shadow .2s ease;
      box-shadow: 0 8px 20px rgba(86,102,184,0.10);
    }
    .navbar.scrolled{ background: rgba(240,244,255,0.78); }
    .navbar .container{ display:flex; justify-content: space-between; align-items:center; gap: 14px; flex-wrap: nowrap; }
    .logo{ font-weight: 800; font-size: 1.04rem; letter-spacing: -.02em; cursor:pointer; display:inline-flex; align-items:center; gap:8px; font-family: Inter, Manrope, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
    .logo i{ color: var(--accent); }
    .logo span{ color: var(--text-1); }
    .nav-links{ display:flex; gap: 22px; align-items:center; flex-wrap: nowrap; }
    .nav-links a{
      text-decoration:none;
      font-weight: 700;
      color: var(--text-2);
      font-size: .88rem;
      cursor:pointer;
      text-transform: none;
      letter-spacing: .01em;
      transition: color .15s ease;
    }
    .nav-links a:hover{ color: var(--text-1); }

    .dropdown{ position: relative; display:inline-block; }
    .dropdown-content{
      display:none;
      position:absolute;
      top: 40px;
      left: 0;
      min-width: 220px;
      background: rgba(243,246,255,0.88);
      backdrop-filter: blur(18px);
      border: 1px solid rgba(108,126,220,0.16);
      border-radius: 18px;
      padding: 10px 0;
      box-shadow: var(--shadow-md);
      z-index: 100;
    }
    .dropdown-content a{ display:block; padding: 10px 18px; color: var(--text-2); font-size: .88rem; }
    .dropdown-content a:hover{ background: rgba(95,112,255,0.10); color: var(--text-1); }
    .dropdown.show .dropdown-content{ display:block; }

    .lang-dropdown{ position: relative; display:inline-block; }
    .lang-btn{
      background: rgba(243,246,255,0.72);
      border: 1px solid rgba(108,126,220,0.16);
      border-radius: 999px;
      padding: 9px 14px;
      color: var(--text-2);
      font-weight: 700;
      font-size: .82rem;
      display:flex;
      align-items:center;
      gap: 8px;
      cursor:pointer;
      text-transform: none;
      letter-spacing: .01em;
      box-shadow: 0 10px 20px rgba(86,102,184,0.08);
      -webkit-tap-highlight-color: transparent;
      touch-action: manipulation;
    }
    .lang-menu{
      display:none;
      position:absolute;
      right:0;
      min-width: 190px;
      background: rgba(243,246,255,0.90);
      backdrop-filter: blur(18px);
      border: 1px solid rgba(108,126,220,0.16);
      border-radius: 18px;
      padding: 10px 0;
      box-shadow: var(--shadow-md);
      z-index: 100;
    }
    .lang-menu span{
      display:block;
      padding: 10px 18px;
      cursor:pointer;
      color: var(--text-2);
      font-size: .88rem;
      line-height: 1.2;
      white-space: nowrap;
    }
    .lang-menu span:hover{ background: rgba(95,112,255,0.10); color: var(--text-1); }
    .lang-dropdown.show .lang-menu{ display:block; }

    .nav-toggle{
      display:none;
      align-items:center;
      justify-content:center;
      min-width: 44px;
      min-height: 44px;
      background: rgba(243,246,255,0.72);
      border: 1px solid rgba(108,126,220,0.16);
      border-radius: 14px;
      color: var(--text-2);
      padding: 10px 12px;
      cursor:pointer;
      -webkit-tap-highlight-color: transparent;
      touch-action: manipulation;
    }

    .mobile-menu{ display:none; position: fixed; inset:0; z-index: 9999; }
    .mobile-menu.open{ display:block; }
    .mobile-menu .backdrop{ position:absolute; inset:0; background: rgba(80,94,168,0.24); backdrop-filter: blur(12px); }
    .mobile-menu .panel{
      position:absolute;
      top:0; right:0;
      width: min(360px, 88vw);
      height: 100%;
      max-height: 100dvh;
      background: rgba(238,242,255,0.92);
      border-left: 1px solid rgba(108,126,220,0.16);
      padding:
        max(18px, env(safe-area-inset-top, 0px))
        max(18px, env(safe-area-inset-right, 0px))
        max(18px, env(safe-area-inset-bottom, 0px))
        max(18px, env(safe-area-inset-left, 0px));
      display:flex;
      flex-direction: column;
      gap: 14px;
      box-shadow: -20px 0 60px rgba(86,102,184,0.16);
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
    }
    .panel-head{ display:flex; align-items:center; justify-content: space-between; gap: 12px; }
    .mobile-menu .panel button.link{
      width: 100%;
      text-align:left;
      border-radius: 16px;
      padding: 12px 14px;
      border: 1px solid rgba(108,126,220,0.14);
      background: rgba(246,248,255,0.82);
      color: var(--text-2);
      font-weight: 800;
      text-transform: none;
      letter-spacing: .01em;
      cursor:pointer;
    }
    .mobile-menu .panel button.link:hover{ background: rgba(95,112,255,0.10); border-color: rgba(95,112,255,0.24); }
    .mobile-submenu{
      display:flex;
      flex-direction: column;
      gap: 8px;
      margin: -6px 0 4px;
      padding: 4px 0 8px 12px;
      border-left: 3px solid rgba(95,112,255,0.22);
    }
    .mobile-menu .panel button.link--sub{
      font-weight: 700;
      font-size: .9rem;
      padding: 11px 12px;
    }

    .btn-primary, .btn-outline, .cat-btn{
      font-family: Inter, Manrope, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
      font-weight: 800;
      text-transform: none;
      letter-spacing: .01em;
      transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease, filter .18s ease;
    }
    .btn-primary{
      background: linear-gradient(135deg, var(--accent), var(--accent-2));
      border: none;
      color:#fff;
      padding: 13px 24px;
      border-radius: var(--radius-btn);
      font-size: .94rem;
      cursor:pointer;
      box-shadow: 0 18px 38px rgba(95,112,255,0.22);
    }
    .btn-primary:hover{ transform: translateY(-2px); filter: brightness(1.03); box-shadow: 0 24px 50px rgba(95,112,255,0.28); }
    .btn-outline{
      border: 1.5px solid rgba(111,132,232,0.34);
      background: rgba(245,247,255,0.58);
      color: var(--text-2);
      padding: 11px 22px;
      border-radius: var(--radius-btn);
      font-size: .94rem;
      cursor:pointer;
      box-shadow: 0 12px 28px rgba(86,102,184,0.08);
    }
    .btn-outline:hover{ transform: translateY(-2px); background: rgba(95,112,255,0.10); box-shadow: 0 18px 36px rgba(86,102,184,0.14); }

    /* Strong CTA for product catalog download */
    .download-catalog-btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap: 10px;
      padding: 13px 28px !important;
      border: none !important;
      background: linear-gradient(135deg, var(--accent), var(--accent-2)) !important;
      color:#fff !important;
      font-size: .98rem;
      font-weight: 900;
      letter-spacing: -.01em;
      box-shadow: 0 20px 45px rgba(95,112,255,0.24), 0 12px 26px rgba(45,212,191,0.16);
      transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
      position: relative;
    }
    .download-catalog-btn::before{
      content: "\f1c1"; /* file-pdf (Font Awesome) */
      font-family: "Font Awesome 6 Free";
      font-weight: 900;
      font-size: 1.05em;
      line-height: 1;
      opacity: .95;
    }
    .download-catalog-btn:hover{
      transform: translateY(-2px);
      filter: brightness(1.04);
      box-shadow: 0 28px 64px rgba(95,112,255,0.30), 0 16px 30px rgba(45,212,191,0.20);
    }
    .catalog-cta-strip{
      margin: 14px 0 20px;
      padding: 14px 16px;
      border-radius: 16px;
      border: 1px solid rgba(111,132,232,0.22);
      background: linear-gradient(135deg, rgba(247,249,255,0.92), rgba(228,238,255,0.86));
      display:flex;
      align-items:center;
      justify-content: space-between;
      gap: 12px;
      box-shadow: 0 14px 34px rgba(86,102,184,0.10);
    }
    .catalog-cta-copy{
      color: var(--text-2);
      font-size: .93rem;
      line-height: 1.6;
      font-weight: 700;
    }
    .catalog-cta-copy strong{
      display:block;
      color: var(--text-1);
      font-size: 1rem;
      margin-bottom: 2px;
      font-family: Manrope, Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    }
    @media (max-width: 760px){
      .catalog-cta-strip{
        flex-direction: column;
        align-items: stretch;
      }
      .catalog-cta-strip .download-catalog-btn{
        width: 100%;
      }
    }

    /* Hero */
    .hero-header{
      position: relative;
      margin-top: 0;
      min-height: calc(100svh - var(--nav-stack-h) - 8px);
      display:flex;
      align-items:stretch;
      justify-content:center;
      overflow: hidden;
      isolation:isolate;
      padding: 0;
      background:
        radial-gradient(ellipse 95% 58% at 50% 40%, rgba(34, 211, 238, 0.16) 0%, rgba(34, 211, 238, 0.04) 45%, rgba(34, 211, 238, 0) 62%),
        radial-gradient(ellipse 72% 48% at 86% 78%, rgba(139, 92, 246, 0.12) 0%, rgba(139, 92, 246, 0) 58%),
        radial-gradient(circle at 14% 22%, rgba(59, 130, 246, 0.10) 0%, rgba(59, 130, 246, 0) 42%),
        linear-gradient(168deg, #01060d 0%, #071322 38%, #030712 100%);
    }
    .hero-carousel-viewport{
      position: relative;
      width: 100%;
      min-height: inherit;
      overflow: hidden;
      flex: 1 1 auto;
    }
    .hero-carousel-track{
      display: flex;
      width: 100%;
      min-height: inherit;
      height: 100%;
      transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
      will-change: transform;
    }
    .hero-carousel-slide{
      position: relative;
      flex: 0 0 100%;
      width: 100%;
      min-height: calc(100svh - var(--nav-stack-h) - 8px);
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
    }
    .hero-carousel-slide--banner{
      background: transparent;
      padding: 0;
      align-items: stretch;
    }
    .hero-banner-img{
      display: block;
      width: 100%;
      height: 100%;
      min-height: inherit;
      object-fit: cover;
      object-position: center center;
      user-select: none;
      pointer-events: none;
    }
    .hero-carousel-nav{
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      z-index: 8;
      width: 44px;
      height: 44px;
      border-radius: 999px;
      border: 1px solid rgba(255,255,255,0.28);
      background: rgba(4, 10, 20, 0.48);
      color: #f8fafc;
      cursor: pointer;
      display: grid;
      place-items: center;
      backdrop-filter: blur(8px);
      transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
    }
    .hero-carousel-nav:hover{
      background: rgba(8, 24, 48, 0.72);
      border-color: rgba(103, 232, 249, 0.55);
    }
    .hero-carousel-nav:active{ transform: translateY(-50%) scale(0.96); }
    .hero-carousel-nav--prev{ left: clamp(10px, 2vw, 24px); }
    .hero-carousel-nav--next{ right: clamp(10px, 2vw, 24px); }
    .hero-carousel-dots{
      position: absolute;
      left: 50%;
      bottom: clamp(14px, 2.4vw, 26px);
      transform: translateX(-50%);
      z-index: 8;
      display: flex;
      gap: 10px;
      align-items: center;
    }
    .hero-carousel-dot{
      width: 10px;
      height: 10px;
      padding: 0;
      border-radius: 999px;
      border: 1px solid rgba(255,255,255,0.45);
      background: rgba(255,255,255,0.28);
      cursor: pointer;
      transition: width 0.25s ease, background 0.25s ease, border-color 0.25s ease;
    }
    .hero-carousel-dot.is-active{
      width: 28px;
      background: #67e8f9;
      border-color: #67e8f9;
    }
    @media (max-width: 768px) {
      .hero-carousel-nav{
        width: 44px;
        height: 44px;
        font-size: 0.95rem;
        background: rgba(4, 10, 20, 0.62);
      }
      .hero-carousel-dot{
        width: 12px;
        height: 12px;
        min-width: 12px;
        min-height: 12px;
      }
      .hero-carousel-dot.is-active{ width: 30px; }
      .hero-carousel-dots{
        bottom: max(12px, env(safe-area-inset-bottom, 0px));
        gap: 12px;
      }
      /* Fill the hero frame — no letterbox / black bars around promo banners */
      .hero-carousel-slide--banner{
        min-height: calc(100svh - var(--nav-stack-h) - 8px);
        max-height: none;
        background: transparent;
      }
      .hero-banner-img{
        object-fit: cover;
        object-position: center center;
        min-height: inherit;
        height: 100%;
        width: 100%;
      }
      .hero-header.hero-no-video .hero-share-bg{ display: none; }
      .hero-actions{
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
      }
      .hero-actions .btn-primary,
      .hero-actions .btn-outline{
        min-height: 44px;
        padding: 12px 16px;
        flex: 1 1 auto;
      }
    }
    @media (prefers-reduced-motion: reduce) {
      .hero-carousel-track{ transition: none; }
    }
    .hero-share-bg{
      position:absolute;
      inset:0;
      z-index:0;
      pointer-events:none;
      overflow:hidden;
    }
    .hero-share-bg .hero-bg-video{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      object-fit: cover;
      opacity: .72;
      filter: saturate(1.15) contrast(1.08) brightness(.78);
    }
    .hero-share-bg canvas{
      display:block;
      width:100%;
      height:100%;
      opacity: .22;
    }
    .hero-header::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 900'%3E%3Cg fill='none'%3E%3Cg opacity='0.18' stroke='%2326b4ff'%3E%3Cpath d='M0 112 C 210 90, 412 92, 640 126 S 1098 170, 1600 110'/%3E%3Cpath d='M0 790 C 220 734, 422 722, 666 770 S 1102 846, 1600 782'/%3E%3C/g%3E%3Cg opacity='0.12' stroke='%2326b4ff'%3E%3Cpath d='M838 178h158l42 42v92'/%3E%3Cpath d='M1006 274h92l34 34v74'/%3E%3Cpath d='M812 574h166l36-36h138'/%3E%3C/g%3E%3Cg opacity='0.12' stroke='%2399e9ff'%3E%3Ccircle cx='1038' cy='312' r='7'/%3E%3Ccircle cx='1128' cy='382' r='8'/%3E%3Ccircle cx='1014' cy='536' r='7'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") center center / cover no-repeat;
      z-index:1;
      opacity: .22;
      filter: blur(2px) saturate(.88);
      pointer-events:none;
    }
    .hero-header::after{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(90deg, rgba(0,4,12,0.94) 0%, rgba(2,10,24,0.76) 30%, rgba(3,14,32,0.58) 56%, rgba(1,8,20,0.46) 100%),
        linear-gradient(180deg, rgba(0,0,0,0.28) 0%, transparent 38%, transparent 62%, rgba(0,2,8,0.38) 100%),
        linear-gradient(122deg, transparent 52%, rgba(56, 189, 248, 0.075) 70%, transparent 86%);
      z-index:2;
      pointer-events:none;
    }
    .hero-header .hero-soft-fog{
      position:absolute;
      inset:0;
      z-index:3;
      pointer-events:none;
      background:
        radial-gradient(ellipse 125% 85% at 46% 42%, rgba(56, 189, 248, 0.10) 0%, rgba(56, 189, 248, 0.02) 48%, transparent 62%),
        radial-gradient(circle at 52% 46%, rgba(241, 245, 255, 0.06) 0%, transparent 52%),
        linear-gradient(180deg, rgba(15, 23, 42, 0.18), rgba(15, 23, 42, 0.05));
      backdrop-filter: blur(1.4px);
    }
    .hero-header .hero-carousel-slide > .container,
    .hero-header > .container{
      position: relative;
      z-index: 4;
    }
    .hero-header .hero-inner{
      backdrop-filter: saturate(1.04);
    }
    .hero-bg-geo{ display:none; }
    .hero-inner{
      display:grid;
      grid-template-columns: minmax(560px, 1.5fr) minmax(420px, 1fr);
      align-items: stretch;
      gap: clamp(22px, 2.8vw, 52px);
      min-height: calc(100svh - var(--nav-stack-h) - 28px);
      position:relative;
      z-index:2;
      padding: 22px 0 12px;
    }
    .hero-side-brand{
      position:absolute;
      left: 18px;
      top: 16px;
      z-index: 6;
      pointer-events:none;
    }
    .hero-side-brand span{
      writing-mode: horizontal-tb;
      text-orientation: mixed;
      color: #ffffff;
      font-size: clamp(1.06rem, 1.2vw, 1.34rem);
      font-weight: 900;
      letter-spacing: .16em;
      text-shadow: 0 10px 30px rgba(0,0,0,0.30);
      text-transform: uppercase;
      white-space: nowrap;
    }
    .hero-product-stage{
      position:relative;
      min-height: clamp(360px, 52vh, 580px);
      height: 100%;
      display:flex;
      flex-direction: column;
      align-items: stretch;
      align-self: stretch;
      justify-content:center;
      padding: 10px 0;
      overflow: visible;
      justify-self: stretch;
      margin-left: calc(-1 * var(--container-pad));
      width: calc(100% + var(--container-pad));
      max-width: none;
    }
    .hero-cabinet-showcase{
      flex: 1 1 auto;
      width: 100%;
      max-width: none;
      position: relative;
      padding: clamp(10px, 1.6vw, 20px) 6px clamp(10px, 1.6vw, 20px) 0;
      min-height: 0;
      height: 100%;
      display:flex;
      flex-direction: column;
      align-items: center;
      justify-content:center;
      overflow: visible;
    }
    .hero-cabinet-badge{
      display:inline-block;
      position:absolute;
      top: -6px;
      left: 50%;
      transform: translateX(-50%);
      z-index: 3;
      padding: 10px 16px;
      border-radius: 999px;
      border: 1px solid rgba(124,232,255,0.36);
      background: linear-gradient(180deg, rgba(2,18,44,0.88), rgba(4,28,70,0.72));
      color:#e8f5ff;
      font-size: clamp(.86rem, .95vw, .98rem);
      font-weight: 900;
      letter-spacing: .08em;
      text-transform: uppercase;
      box-shadow: 0 12px 30px rgba(0,10,30,0.36);
      white-space: nowrap;
    }
    .hero-cabinet-row{
      --hero-cabinet-slot-h: clamp(300px, 52vh, 640px);
      --hero-cabinet-gap: clamp(-96px, -7vw, -48px);
      flex: 0 0 auto;
      display:grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      grid-template-rows: var(--hero-cabinet-slot-h);
      align-items: stretch;
      justify-items: stretch;
      align-content: center;
      gap: 0;
      margin-top: 0;
      width: min(100%, clamp(520px, 58vw, 920px));
      min-height: var(--hero-cabinet-slot-h);
      transform: translate(clamp(-18px, -1.2vw, 8px), 0) scale(1.24);
      transform-origin: center center;
    }
    .hero-cabinet-item + .hero-cabinet-item{
      margin-left: var(--hero-cabinet-gap);
    }
    .hero-cabinet-item{
      position:relative;
      min-width: 0;
      min-height: 0;
      height: 100%;
      width: 100%;
      border-radius: 0;
      padding: 0;
      background: none;
      border: none;
      box-shadow: none;
      display:flex;
      flex-direction: column;
      justify-content: center;
      align-items: stretch;
      overflow: hidden;
    }
    .hero-cabinet-pic{
      align-self: stretch;
      flex: 1 1 0;
      width: 100%;
      height: 100%;
      min-height: 0;
      object-fit: contain;
      object-position: center;
      background: transparent;
      display: block;
      pointer-events: none;
      user-select: none;
    }
    .hero-cabinet-row .hero-cabinet-item:first-child .hero-cabinet-pic{
      transform: scale(1.32);
      transform-origin: right center;
      object-position: right center;
    }
    .hero-cabinet-row .hero-cabinet-item:last-child .hero-cabinet-pic{
      transform: translateX(1cm);
      object-position: left center;
    }
    .hero-cabinet-row .hero-cabinet-item:first-child{
      overflow: visible;
    }
    .hero-cabinet-row .hero-cabinet-item:last-child{
      overflow: visible;
    }
    @media (max-width: 640px){
      .hero-product-stage{ min-height: auto; padding: 10px 0 0; overflow: visible; }
      .hero-cabinet-showcase{ width:100%; padding: 6px 0; }
      .hero-cabinet-badge{ position:static; transform:none; display:block; width: fit-content; margin: 0 auto 10px; white-space: normal; text-align:center; }
      .hero-cabinet-row{
        --hero-cabinet-slot-h: clamp(200px, 38vh, 400px);
        --hero-cabinet-gap: clamp(-48px, -10vw, -24px);
        grid-template-rows: var(--hero-cabinet-slot-h);
        min-height: var(--hero-cabinet-slot-h);
        margin-top: 0;
        width: min(100%, clamp(300px, 92vw, 520px));
        transform: translate(0, 0) scale(1.12);
        transform-origin: center center;
      }
      .hero-cabinet-item{
        height: 100%;
        min-height: 0;
      }
      .hero-cabinet-pic{
        align-self: stretch;
        flex: 1 1 0;
        min-height: 0;
        width: 100%;
        height: 100%;
        object-fit: contain;
      }
      .hero-cabinet-row .hero-cabinet-item:first-child .hero-cabinet-pic{
        object-position: right center;
        transform-origin: right center;
      }
      .hero-cabinet-row .hero-cabinet-item:last-child .hero-cabinet-pic{
        object-position: left center;
        transform: translateX(1cm);
      }
    }
    .hero-copy{
      max-width: 760px;
      padding: 14px clamp(8px, 1.2vw, 16px) 12px clamp(52px, 5.5vw, 104px);
      text-align:right;
      position: relative;
      z-index: 2;
      color:#ffffff;
      justify-self: end;
      align-self: center;
      font-size: 2em;
      padding-right: 0;
    }
    .hero-copy::before{ display:none; }
    .hero-copy::after{ display:none; }
    .hero-kicker{
      display:flex;
      align-items:center;
      justify-content:center;
      width: 100%;
      padding: 0;
      color: #b8dcff;
      font-size: clamp(2rem, 3.6vw, 3.4rem);
      font-weight: 800;
      letter-spacing: .14em;
      margin-bottom: clamp(14px, 2vh, 22px);
      background: transparent;
      border: none;
      border-radius: 0;
      text-transform: uppercase;
      box-shadow: none;
      text-align: center;
    }
    .hero-title{
      font-size: clamp(3.45rem, 5.85vw, 6.1rem);
      font-weight: 900;
      letter-spacing: -0.05em;
      color: #ffffff;
      font-family: Inter, Manrope, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
      line-height: 1.05;
      margin: 0;
      text-shadow: 0 12px 30px rgba(0,0,0,0.22);
    }
    .hero-title .hero-title-line1{
      display: block;
      white-space: nowrap;
    }
    .hero-title .hero-title-with{
      display: block;
      font-size: 0.72em;
      font-weight: 800;
      letter-spacing: 0.1em;
      text-transform: lowercase;
      line-height: 1;
      margin: 0;
      color: rgba(230, 244, 255, 0.95);
    }
    .hero-title .title-accent{
      display:block;
      color: #91eaff;
      font-size: clamp(2.45rem, 4.1vw, 4.45rem);
      margin: 0.02em 0 0;
      letter-spacing: -0.03em;
      line-height: 1.12;
      white-space: nowrap;
    }
    .hero-subtitle{
      font-size: clamp(1.28rem, 1.5vw, 1.5rem);
      margin: clamp(18px, 2.2vh, 26px) 0 0;
      margin-left: auto;
      color: #d3e8ff;
      max-width: 34rem;
      line-height: 1.55;
    }
    .hero-subtitle .hero-desc-highlight{
      display: block;
      margin-top: 0.4em;
      font-weight: 800;
      letter-spacing: 0.02em;
      color: #e8f4ff;
    }
    @media (max-width: 1180px){
      .hero-title .hero-title-line1{ white-space: normal; }
      .hero-title .title-accent{ white-space: normal; }
    }
    .hero-chip-row{ display:none; }
    .hero-actions{ margin-top: 20px; display:flex; gap: 14px; flex-wrap: wrap; justify-content:flex-end; }
    .hero-metrics{ display:flex; flex-wrap:wrap; gap: 12px; margin-top: 16px; justify-content:flex-end; }
    .hero-badge{
      display:inline-flex; align-items:center; gap:8px;
      padding: 6px 9px;
      border-radius: 999px;
      background: rgba(255,255,255,0.08);
      border: 1px solid rgba(153,233,255,0.16);
      color: #f3f8ff;
      font-weight: 700;
      font-size: 1.02rem;
      backdrop-filter: blur(8px);
      box-shadow: none;
    }
    .hero-note{
      color: #b7daff;
      font-size: clamp(1.08rem, 1.18vw, 1.2rem);
      font-weight: 700;
      letter-spacing: .04em;
      margin-top: 16px;
    }
    .hero-actions .btn-primary,
    .hero-actions .btn-outline{
      font-size: 0.94rem !important;
      padding: 9px 17px !important;
    }
    .scenario-grid-wrap{
      margin: 18px 0 26px;
      padding: clamp(18px, 2vw, 26px);
      border-radius: 20px;
      border: 1px solid rgba(126,170,232,0.22);
      background: linear-gradient(180deg, rgba(9,21,44,0.5), rgba(8,18,36,0.28));
    }
    .scenario-grid-head{
      text-align:center;
      margin-bottom: 16px;
    }
    .scenario-grid-head h3{
      color:#eef5ff;
      font-size: clamp(1.15rem, 1.8vw, 1.5rem);
      font-weight: 800;
    }
    .scenario-grid-head p{
      margin-top: 6px;
      color: rgba(201,220,246,0.82);
      font-size: .92rem;
    }
    .scenario-grid{
      display:grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: clamp(18px, 2.4vw, 30px);
    }
    .scenario-card{
      display:flex;
      flex-direction:column;
      gap: 10px;
    }
    .scenario-card__media{
      aspect-ratio: 1.58 / 1;
      overflow: hidden;
      border-radius: 14px;
      box-shadow: 0 14px 34px rgba(7, 15, 32, 0.24);
      border: 1px solid rgba(130, 175, 226, 0.18);
    }
    .scenario-card__media img{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
      transform: scale(1.02);
    }
    .scenario-card__label{
      color: #f2f7ff;
      font-size: clamp(1rem, 1.04vw, 1.12rem);
      font-weight: 700;
      line-height: 1.4;
      text-align:center;
      text-shadow: 0 1px 12px rgba(0, 11, 35, 0.36);
    }
    .hero-art{ display:none; }
    @media (min-width: 981px){
      .hero-inner{
        grid-template-columns: minmax(560px, 1.5fr) minmax(420px, 1fr);
        gap: clamp(22px, 2.8vw, 52px);
        padding-left: 0;
      }
      .hero-copy{
        max-width: 720px;
        padding-left: clamp(70px, 7vw, 148px);
        justify-self: end;
        font-size: 2em;
        text-align: right;
        transform: translateX(clamp(64px, 7vw, 150px));
      }
      .hero-kicker{ margin-bottom: 14px; }
      .hero-subtitle{ margin-top: 18px; }
      .hero-metrics{ margin-top: 16px; }
      .hero-actions{ margin-top: 18px; }
      .hero-note{ margin-top: 14px; }
    }
    @keyframes heroShine {
      0% { transform: translateX(-30%) skewX(-18deg); opacity: 0; }
      18% { opacity: .95; }
      50% { transform: translateX(220%) skewX(-18deg); opacity: .88; }
      100% { transform: translateX(220%) skewX(-18deg); opacity: 0; }
    }
    @media (max-width: 1100px){
      .hero-inner{
        grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
        gap: clamp(18px, 2.4vw, 36px);
        padding-left: 0;
      }
    }
    @media (max-height: 980px){
      .hero-inner{ min-height: calc(100svh - var(--nav-stack-h) - 30px); gap: clamp(16px, 2vw, 28px); }
      .hero-kicker{ margin-bottom: 10px; font-size: clamp(1.45rem, 2.6vw, 2.1rem); }
      .hero-title{ font-size: clamp(2.2rem, 4.35vw, 3.1rem); line-height: 1.1; }
      .hero-title .title-accent{ font-size: clamp(1.55rem, 2.75vw, 2.35rem); }
      .hero-subtitle{ margin-top: 10px; line-height: 1.58; font-size: 1.12rem; }
      .hero-product-stage{ min-height: clamp(340px, 44vh, 520px); }
      .hero-metrics{ margin-top: 8px; gap: 8px; }
      .hero-actions{ margin-top: 10px; }
      .hero-note{ margin-top: 8px; font-size: 0.98rem; }
    }
    @media (max-height: 860px){
      .hero-inner{ min-height: calc(100svh - var(--nav-stack-h) - 18px); gap: clamp(18px, 2.2vw, 36px); }
      .hero-title{ font-size: clamp(2.4rem, 4.7vw, 3.4rem); }
      .hero-title .title-accent{ font-size: clamp(1.65rem, 2.9vw, 2.5rem); }
      .hero-subtitle{ margin-top: 14px; line-height: 1.65; }
      .hero-product-stage{ min-height: clamp(360px, 48vh, 560px); }
      .hero-actions{ margin-top: 14px; }
      .hero-metrics{ margin-top: 12px; }
      .hero-note{ margin-top: 12px; }
    }
    @media (max-height: 760px){
      .hero-metrics{ display:none; }
      .hero-note{ display:none; }
      .hero-actions{ margin-top: 8px; }
      .hero-product-stage{ min-height: clamp(300px, 40vh, 460px); }
      .hero-side-brand span{ font-size: clamp(1.02rem, 1.3vw, 1.28rem); }
    }
    @media (max-width: 980px){
      .hero-header{ min-height: auto; padding: 34px 0 28px; }
      .hero-carousel-slide{ min-height: auto; }
      .hero-carousel-slide--banner{
        min-height: calc(100svh - var(--nav-stack-h) - 8px);
        background: transparent;
      }
      .hero-inner{ grid-template-columns: 1fr; gap: 18px; min-height: auto; padding-left: 0; }
      .hero-side-brand{
        position: absolute;
        left: 16px;
        top: 14px;
        transform: none;
        opacity: 1;
        pointer-events: none;
      }
      .hero-side-brand span{ writing-mode: horizontal-tb; font-size: 1.15rem; letter-spacing: .14em; }
      .hero-product-stage{ order: 2; min-height: clamp(340px, 52vh, 560px); }
      .hero-copy{
        order: 3;
        max-width: 100%;
        text-align:center;
        padding: 0 10px 10px;
        justify-self: stretch;
        align-self: stretch;
        font-size: 1.68em;
      }
      .hero-subtitle{
        font-size: clamp(1rem, 3.6vw, 1.22rem);
        line-height: 1.58;
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
      }
      .hero-badge{
        font-size: clamp(0.78rem, 2.4vw, 0.95rem);
        padding: 7px 10px;
      }
      .hero-note{
        font-size: clamp(0.84rem, 2.5vw, 1.02rem);
      }
      .hero-actions .btn-primary,
      .hero-actions .btn-outline{
        font-size: clamp(0.9rem, 2.8vw, 1rem) !important;
        padding: 12px 18px !important;
        min-height: 46px;
      }
      .hero-kicker, .hero-metrics, .hero-actions{ justify-content:center; }
      .hero-note{ letter-spacing: .03em; }
    }
    @media (max-width: 640px){
      .hero-product-stage{ min-height: clamp(280px, 44vh, 440px); }
      .hero-product-main{ width:min(100%, 250px); }
      .hero-product-a{ width:84px; left:8px; bottom:36px; padding:10px; }
      .hero-product-c{ width:88px; right:8px; top:44px; padding:10px; }
      .hero-title{ font-size: clamp(2.5rem, 9.8vw, 3.45rem); }
      .hero-title .title-accent{ font-size: clamp(1.72rem, 5.6vw, 2.45rem); }
      .hero-subtitle{ font-size: 1.18rem; }
      .hero-title .hero-title-line1{ white-space: normal; }
      .scenario-grid-wrap{ margin: 14px 0 20px; padding: 12px; }
      .scenario-grid{ grid-template-columns: 1fr; gap: 16px; }
      .scenario-card__label{ font-size: .98rem; }
    }
    @media (max-width: 1100px){
      .scenario-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }
    /* Cards + grids */
    .merge-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: var(--grid-gap); margin: 40px 0; align-items: stretch; }
    .product-grid{ display:grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--grid-gap); margin-top: 24px; position:relative; }
    .product-grid::before{
      content:'';
      position:absolute;
      inset:-14px;
      pointer-events:none;
      background:
        repeating-linear-gradient(90deg, rgba(96,165,250,0.10) 0 1px, transparent 1px 84px),
        repeating-linear-gradient(180deg, rgba(96,165,250,0.08) 0 1px, transparent 1px 84px),
        linear-gradient(135deg, rgba(37,99,235,0.10), rgba(34,211,238,0.05));
      border-radius: 30px;
      opacity: .88;
      z-index:0;
    }
    .product-grid::after{
      content:'';
      position:absolute;
      inset: 18px 8px auto 8px;
      height: calc(100% - 36px);
      pointer-events:none;
      background:
        linear-gradient(90deg, transparent 8%, rgba(34,211,238,0.14) 12%, rgba(34,211,238,0) 16%, transparent 28%, rgba(96,165,250,0.12) 34%, rgba(96,165,250,0) 40%, transparent 54%, rgba(34,211,238,0.10) 60%, rgba(34,211,238,0) 66%, transparent 82%),
        linear-gradient(180deg, transparent 10%, rgba(96,165,250,0.10) 14%, rgba(96,165,250,0) 18%, transparent 36%, rgba(34,211,238,0.10) 42%, rgba(34,211,238,0) 48%, transparent 70%, rgba(96,165,250,0.09) 78%, rgba(96,165,250,0) 84%);
      mix-blend-mode: screen;
      z-index:0;
    }
    .trust-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-top: 28px; }
    .apps-grid{ display:grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--grid-gap); margin-top: 24px; }
    /* Operations backend screenshot gallery (horizontal screenshots) */
    #oemAppsGrid{
      display:grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
      margin-top: 14px;
    }
    #oemAppsGrid .backend-card{
      border-radius: 18px;
      border: none;
      background: transparent;
      overflow: hidden;
      box-shadow: 0 12px 28px rgba(2,6,23,0.28);
    }
    #oemAppsGrid .backend-shot{
      width: 100%;
      aspect-ratio: 16 / 9;
      background: #020617;
      display:flex;
      align-items:center;
      justify-content:center;
      color:#9fb3d9;
      font-size:.8rem;
      letter-spacing:.06em;
      text-transform: uppercase;
    }
    #oemAppsGrid .backend-shot img{
      width: 100%;
      height: 100%;
      object-fit: cover;
      display:block;
      background: transparent;
      animation: none !important;
      filter: saturate(1.02) contrast(1.03);
    }
    #oemAppsGrid .backend-shot.is-clickable{ cursor: zoom-in; }
    #oemAppsGrid .backend-body{
      padding: 10px 12px 12px;
    }
    #oemAppsGrid .backend-title{
      display:flex;
      align-items:center;
      justify-content: space-between;
      gap: 10px;
      color:#f8fcff;
      font-weight: 900;
      letter-spacing: -.01em;
      margin: 0;
      font-size: 1rem;
    }
    #oemAppsGrid .backend-badge{
      flex-shrink: 0;
      font-size: .72rem;
      font-weight: 900;
      padding: 4px 10px;
      border-radius: 999px;
      border: 1px solid rgba(103,232,249,0.36);
      color:#bff6ff;
      background: rgba(8,22,54,0.55);
      text-transform: uppercase;
      letter-spacing: .08em;
    }
    #oemAppsGrid .backend-desc{
      margin-top: 8px;
      color:#dbeafe;
      font-size: .86rem;
      line-height: 1.65;
    }
    /* Backend image viewer */
    .backend-lightbox{
      position: fixed;
      inset: 0;
      z-index: 10080;
      background: rgba(2,6,23,0.94);
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 18px;
    }
    .backend-lightbox-stage{
      width: min(95vw, 1500px);
      height: min(88vh, 980px);
      display:flex;
      align-items:center;
      justify-content:center;
      overflow: hidden;
      border-radius: 16px;
      border: 1px solid rgba(148,163,184,0.22);
      background: #020617;
    }
    .backend-lightbox-stage img{
      max-width: 100%;
      max-height: 100%;
      transform-origin: center center;
      user-select: none;
      -webkit-user-drag: none;
    }
    .backend-lightbox-bar{
      position: absolute;
      top: 16px;
      right: 16px;
      display:flex;
      gap: 8px;
      z-index: 2;
    }
    .backend-lightbox-bar button{
      width: 40px;
      height: 40px;
      border-radius: 999px;
      border: 1px solid rgba(148,163,184,0.32);
      background: rgba(15,23,42,0.86);
      color: #f8fafc;
      cursor: pointer;
      font-weight: 800;
    }
    /* Expand usable width for screenshot-heavy section on desktop */
    .oem-fs-section--interactive .oem-fs-inner{
      width: min(1260px, 96vw);
    }
    @media (max-width: 1280px){
      #oemAppsGrid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .oem-fs-section--interactive .oem-fs-inner{ width: min(1160px, 95vw); }
    }
    @media (max-width: 1100px){
      #oemAppsGrid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }
    @media (max-width: 760px){
      #oemAppsGrid{
        grid-template-columns: 1fr;
        gap: 10px;
      }
      #oemAppsGrid .backend-body{ padding: 10px 11px 12px; }
      #oemAppsGrid .backend-title{ font-size: .94rem; }
      #oemAppsGrid .backend-desc{ font-size: .84rem; line-height: 1.58; }
    }
    .oem-app-frame{
      border-radius: 18px;
      border: 1px solid rgba(96,165,250,0.22);
      background: linear-gradient(180deg, rgba(8,15,35,0.94), rgba(8,22,54,0.9));
      overflow: hidden;
      margin-bottom: 10px;
    }
    .oem-app-shot{
      width: 100%;
      aspect-ratio: 16 / 10;
      display:flex;
      align-items:center;
      justify-content:center;
      color:#9fb3d9;
      font-size:.82rem;
      letter-spacing:.06em;
      text-transform: uppercase;
      background:
        linear-gradient(135deg, rgba(56,189,248,0.12), rgba(37,99,235,0.12) 45%, rgba(15,23,42,0.55)),
        repeating-linear-gradient(90deg, rgba(96,165,250,0.09) 0 1px, transparent 1px 36px),
        repeating-linear-gradient(180deg, rgba(96,165,250,0.07) 0 1px, transparent 1px 36px);
    }
    .oem-app-shot img{
      width: 100%;
      height: 100%;
      object-fit: cover;
      display:block;
      animation: oemKenBurns 18s ease-in-out infinite alternate;
      transform-origin: center center;
      filter: saturate(1.04) contrast(1.02);
    }
    .oem-lux-page{ padding: 12px 0 28px; }
    .oem-lux-hero{
      position: relative;
      min-height: calc(100vh - 132px);
      border-radius: 26px;
      overflow: hidden;
      border: 1px solid rgba(96,165,250,0.22);
      box-shadow: 0 32px 70px rgba(2,6,23,0.34);
      margin-bottom: 28px;
    }
    .oem-lux-section{
      position: relative;
      border-radius: 24px;
      overflow: hidden;
      border: 1px solid rgba(96,165,250,0.20);
      box-shadow: 0 22px 56px rgba(2,6,23,0.28);
      margin-bottom: 24px;
      min-height: calc(100vh - 132px);
    }
    .oem-lux-media{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      object-fit: cover;
      opacity: .7;
      transform: scale(1.02);
      filter: saturate(1.05) contrast(1.05);
    }
    .oem-lux-media--img{
      animation: oemKenBurns 24s ease-in-out infinite alternate;
      transform-origin: center center;
    }
    .oem-lux-section:nth-of-type(2) .oem-lux-media--img{ animation-duration: 28s; }
    .oem-lux-section:nth-of-type(3) .oem-lux-media--img{ animation-duration: 22s; }
    .oem-lux-section:nth-of-type(4) .oem-lux-media--img{ animation-duration: 30s; }
    .oem-lux-section:nth-of-type(5) .oem-lux-media--img{ animation-duration: 26s; }
    .oem-lux-overlay{
      position:absolute;
      inset:0;
      background:
        linear-gradient(120deg, rgba(3,8,20,0.80) 0%, rgba(5,10,24,0.66) 42%, rgba(8,14,30,0.58) 100%),
        radial-gradient(circle at 14% 22%, rgba(34,211,238,0.18) 0%, rgba(34,211,238,0.03) 32%, transparent 55%),
        radial-gradient(circle at 82% 18%, rgba(59,130,246,0.14) 0%, rgba(59,130,246,0.02) 36%, transparent 60%);
    }
    .oem-lux-content{
      position: relative;
      z-index: 2;
      padding: clamp(22px, 4.2vw, 42px);
    }
    .oem-lux-kicker{
      display:inline-flex;
      align-items:center;
      gap:8px;
      border-radius: 999px;
      padding: 6px 12px;
      border: 1px solid rgba(125,211,252,0.34);
      background: rgba(8,22,54,0.46);
      color: #bae6fd;
      font-size: .78rem;
      font-weight: 800;
      letter-spacing: .05em;
      text-transform: uppercase;
      margin-bottom: 12px;
    }
    .oem-lux-title{
      font-size: clamp(1.9rem, 4vw, 3rem);
      line-height: 1.12;
      letter-spacing: -.03em;
      color: #f7fbff;
      margin-bottom: 12px;
      font-family: Manrope, Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    }
    .oem-lux-sub{
      color: #d6e2f5;
      font-size: 1rem;
      max-width: 860px;
      line-height: 1.8;
    }
    .oem-lux-grid{
      display:grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 16px;
      margin-top: 18px;
    }
    .oem-lux-glass{
      border-radius: 16px;
      border: 1px solid rgba(148,163,184,0.28);
      background: rgba(8,15,35,0.44);
      backdrop-filter: blur(6px);
      padding: 14px 16px;
      color:#e6effe;
    }
    .oem-lux-glass strong{ color:#fff; display:block; margin-bottom:6px; }
    .oem-lux-cta-row{ display:flex; flex-wrap:wrap; gap:12px; margin-top: 18px; }
    .oem-lux-steps{
      display:grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 14px;
      margin-top: 16px;
    }
    .oem-lux-step{
      border-radius: 14px;
      border: 1px solid rgba(148,163,184,0.28);
      background: rgba(8,15,35,0.44);
      padding: 12px;
      color:#dbe7fb;
      font-size:.9rem;
      line-height:1.6;
    }
    .oem-lux-step i{ color:#67e8f9; margin-right:6px; }
    @keyframes oemKenBurns{
      0%{ transform: scale(1.02) translate3d(0,0,0); }
      50%{ transform: scale(1.08) translate3d(-0.8%, -0.6%, 0); }
      100%{ transform: scale(1.12) translate3d(0.8%, 0.6%, 0); }
    }
    #oemPage{
      overflow: hidden;
    }
    .oem-fs-page{
      width: 100%;
      margin-top: 0;
      background: #030711;
      position: relative;
      transform: translateY(-1cm);
    }
    .oem-fs-section{
      position: relative;
      width: 100%;
      min-height: calc(100vh - var(--nav-stack-h));
      overflow: hidden;
      display: flex;
      align-items: center;
      isolation: isolate;
    }
    .oem-fs-section::before{
      content: '';
      position: absolute;
      inset: 0;
      pointer-events: none;
      z-index: 1;
      background: linear-gradient(180deg, rgba(2,8,20,0.24) 0%, rgba(2,8,20,0.04) 18%, rgba(2,8,20,0.04) 78%, rgba(2,8,20,0.30) 100%);
    }
    .oem-fs-media{
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      transform: scale(1.03);
      animation: oemKenBurns 26s ease-in-out infinite alternate;
      filter: saturate(1.02);
    }
    .oem-fs-media[data-oem-video]{
      animation: none;
      transform: none;
      filter: saturate(1.06) contrast(1.03);
    }
    .oem-fs-mask{
      position:absolute;
      inset:0;
      background: linear-gradient(120deg, rgba(4,10,22,0.72) 0%, rgba(4,10,22,0.58) 45%, rgba(4,10,22,0.72) 100%);
      z-index: 2;
    }
    .oem-fs-inner{
      position: relative;
      z-index: 3;
      width: min(1100px, 92vw);
      margin: 0 auto;
      color: #f3f8ff;
      transform: translateY(10px);
      opacity: .96;
      transition: transform .45s ease, opacity .45s ease;
    }
    .oem-fs-section--hero .oem-fs-inner{
      width: min(1420px, 96vw);
    }
    .oem-hero-split{
      display:grid;
      grid-template-columns: minmax(560px, 760px) minmax(0, 1fr);
      gap: clamp(18px, 2.6vw, 34px);
      align-items: center;
    }
    .oem-hero-left{
      width: 100%;
      max-width: 760px;
      justify-self: start;
    }
    .oem-fs-section--hero .oem-fs-title{
      max-width: 16ch;
      margin-bottom: 16px;
      font-size: clamp(2.1rem, 4.2vw, 3.4rem);
      line-height: 1.06;
      letter-spacing: -0.035em;
      text-wrap: balance;
    }
    .oem-fs-section--hero .oem-fs-desc{
      max-width: 62ch;
      color: #d5e7ff;
      line-height: 1.82;
    }
    .oem-hero-right{
      display:flex;
      flex-direction:column;
      gap: 12px;
      width: 100%;
      max-width: 760px;
      justify-self: end;
      padding: clamp(14px, 1.6vw, 20px);
      border-radius: 22px;
      border: 1px solid rgba(125,211,252,0.20);
      background: rgba(3,10,26,0.42);
      box-shadow: 0 18px 44px rgba(1,6,20,0.34);
      backdrop-filter: blur(7px);
    }
    .oem-backend-demo{
      border-radius: 20px;
      overflow: hidden;
      border: 1px solid rgba(125,211,252,0.22);
      background: rgba(8,15,35,0.35);
      box-shadow: 0 22px 56px rgba(0,0,0,0.36);
    }
    .oem-backend-demo video{
      width:100%;
      height: clamp(340px, 38vw, 560px);
      object-fit: cover;
      display:block;
      background: #040a16;
    }
    .oem-backend-caption{
      font-size: .9rem;
      line-height: 1.72;
      color:#d2e5ff;
      background: rgba(8,15,35,0.22);
      border: 1px solid rgba(125,211,252,0.14);
      border-radius: 14px;
      padding: 12px 14px;
    }
    .oem-backend-caption strong{
      display:block;
      margin-bottom: 4px;
      font-size: .98rem;
      letter-spacing: .01em;
    }
    @media (max-width: 980px){
      .oem-hero-split{ grid-template-columns: 1fr; }
      .oem-hero-right{ order: 2; }
      .oem-fs-section--hero .oem-fs-inner{ width: min(94vw, 1100px); }
      .oem-fs-section--hero .oem-fs-title{ max-width: 100%; }
      .oem-hero-left{
        max-width: 100%;
      }
      .oem-hero-right{
        max-width: 100%;
        width: 100%;
        justify-self: stretch;
        padding: 12px;
        border-radius: 16px;
      }
    }
    @media (min-width: 981px) and (max-width: 1240px){
      .oem-fs-section--hero .oem-fs-inner{
        width: min(96vw, 1220px);
      }
      .oem-hero-split{
        grid-template-columns: minmax(0, 1fr) minmax(460px, 1fr);
      }
      .oem-hero-right{
        max-width: 100%;
      }
      .oem-backend-demo video{
        height: clamp(310px, 34vw, 460px);
      }
    }
    .oem-fs-kicker{
      display: inline-block;
      padding: 6px 12px;
      border-radius: 999px;
      border: 1px solid rgba(125,211,252,0.40);
      background: rgba(8,15,35,0.35);
      font-size: .78rem;
      font-weight: 800;
      letter-spacing: .06em;
      margin-bottom: 14px;
    }
    .oem-fs-title{
      font-size: clamp(2rem, 4.6vw, 3.5rem);
      line-height: 1.1;
      margin-bottom: 12px;
      letter-spacing: -0.03em;
      color: #ffffff;
    }
    .oem-fs-desc{
      font-size: clamp(.98rem, 1.2vw, 1.08rem);
      color: #dbe8ff;
      max-width: 760px;
      line-height: 1.8;
    }
    .oem-fs-actions{ display:flex; gap:12px; flex-wrap:wrap; margin-top: 22px; }
    .oem-fs-section--hero .oem-fs-actions{ margin-top: 18px; }
    .oem-fs-section--hero .oem-fs-mask{
      background:
        linear-gradient(120deg, rgba(2,8,22,0.56) 0%, rgba(22,28,72,0.42) 45%, rgba(2,8,22,0.60) 100%),
        radial-gradient(circle at 70% 22%, rgba(90,120,255,0.28) 0%, rgba(90,120,255,0.00) 45%),
        radial-gradient(circle at 22% 72%, rgba(0,214,255,0.16) 0%, rgba(0,214,255,0.00) 42%);
      backdrop-filter: blur(1.6px);
    }
    .oem-fs-section--cinematic .oem-fs-mask{
      background:
        linear-gradient(135deg, rgba(3,9,20,0.78) 0%, rgba(3,9,20,0.60) 44%, rgba(3,9,20,0.84) 100%),
        radial-gradient(circle at 64% 22%, rgba(56,189,248,0.10) 0%, rgba(56,189,248,0.00) 42%);
      backdrop-filter: blur(1.1px);
    }
    .oem-fs-section--interactive .oem-fs-mask{
      background:
        linear-gradient(125deg, rgba(5,12,28,0.70) 0%, rgba(5,12,28,0.48) 40%, rgba(5,12,28,0.78) 100%),
        radial-gradient(circle at 26% 22%, rgba(45,212,191,0.18) 0%, rgba(45,212,191,0.00) 42%),
        radial-gradient(circle at 78% 24%, rgba(59,130,246,0.16) 0%, rgba(59,130,246,0.00) 38%);
      backdrop-filter: blur(.8px);
    }
    .oem-fs-divider{
      height: clamp(24px, 3.2vh, 42px);
      margin-top: -2px;
      margin-bottom: -2px;
      position: relative;
      z-index: 4;
      pointer-events: none;
      background:
        linear-gradient(180deg, rgba(2,8,20,0.00) 0%, rgba(2,8,20,0.34) 46%, rgba(2,8,20,0.00) 100%),
        radial-gradient(ellipse 52% 80% at 50% 50%, rgba(56,189,248,0.14) 0%, rgba(56,189,248,0) 68%);
    }
    .oem-fs-divider::after{
      content: '';
      position: absolute;
      left: 50%;
      top: 50%;
      width: min(68vw, 760px);
      height: 1px;
      transform: translate(-50%, -50%);
      background: linear-gradient(90deg, transparent, rgba(125,211,252,0.55), transparent);
    }
    .oem-page-dots{
      position: fixed;
      right: 18px;
      top: 50%;
      transform: translateY(-50%);
      z-index: 40;
      display: none;
      gap: 12px;
      flex-direction: column;
      padding: 10px 8px;
      border-radius: 999px;
      border: 1px solid rgba(125,211,252,0.30);
      background: rgba(4,10,24,0.36);
      backdrop-filter: blur(8px);
    }
    .oem-page-dots.is-visible{ display:flex; }
    .oem-dot{
      width: 10px;
      height: 10px;
      border-radius: 999px;
      border: 1px solid rgba(191,219,254,0.72);
      background: rgba(148,163,184,0.46);
      cursor: pointer;
      transition: transform .18s ease, background .2s ease, box-shadow .2s ease, border-color .2s ease;
    }
    .oem-dot:hover{ transform: scale(1.14); }
    .oem-dot.is-active{
      background: rgba(34,211,238,0.98);
      border-color: rgba(34,211,238,1);
      box-shadow: 0 0 0 3px rgba(34,211,238,0.22);
      transform: scale(1.18);
    }
    @media (max-width: 980px){
      .oem-page-dots{ display:none !important; }
    }
    @media (prefers-reduced-motion: reduce){
      .oem-fs-inner{ transform:none; opacity:1; transition:none; }
    }
    .oem-fs-tech-row{
      display:grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap:12px;
      margin-top:20px;
      max-width: none;
    }
    .oem-fs-tech-pill{
      display:flex;
      flex-direction: column;
      align-items:flex-start;
      gap:2px;
      padding: 12px 14px;
      border-radius: 14px;
      border: 1px solid rgba(125,211,252,0.40);
      background: rgba(6,14,34,0.52);
      color:#e6f1ff;
      font-size:.84rem;
      font-weight:700;
      box-shadow: 0 10px 24px rgba(2,6,23,0.28);
      min-height: 108px;
    }
    .oem-pill-top{
      display:flex;
      align-items:center;
      gap:6px;
      color:#bfe9ff;
      font-size:.78rem;
      letter-spacing:.01em;
    }
    .oem-pill-value{
      display:block;
      margin-top:4px;
      color:#fff;
      font-size:.92rem;
      line-height:1.3;
    }
    .oem-pill-note{
      display:block;
      margin-top:3px;
      color:#cfe7ff;
      font-size:.73rem;
      line-height:1.35;
      font-weight:500;
    }
    .oem-fs-split{
      display:grid;
      grid-template-columns: 1.1fr 1fr;
      gap:16px;
      margin-top:16px;
    }
    .oem-fs-timeline{
      display:grid;
      gap:10px;
      margin-top:8px;
    }
    .oem-fs-step{
      border:1px solid rgba(125,211,252,0.28);
      border-radius:14px;
      padding:10px 12px;
      background: rgba(4,16,40,0.42);
    }
    .oem-fs-step strong{ color:#f0f9ff; font-size:.9rem; }
    .oem-fs-step p{ margin-top:4px; color:#dbeafe; font-size:.8rem; line-height:1.45; }
    .oem-fs-card-grid{
      display:grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap:10px;
      margin-top:8px;
    }
    .oem-fs-stat-grid{
      display:grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap:10px;
      margin-top:8px;
    }
    .oem-fs-stat{
      border:1px solid rgba(125,211,252,0.24);
      border-radius:14px;
      padding:10px 12px;
      background: rgba(4,16,40,0.42);
    }
    .oem-fs-stat .value{ color:#67e8f9; font-weight:800; font-size:1.1rem; }
    .oem-fs-stat .label{ display:block; margin-top:2px; color:#f0f9ff; font-size:.82rem; font-weight:700; }
    .oem-fs-stat .note{ display:block; margin-top:2px; color:#dbeafe; font-size:.74rem; line-height:1.35; }
    .oem-fs-mini-note{ margin-top:8px; color:#cfe7ff; font-size:.78rem; }
    .oem-fs-cert-table{
      width:100%;
      border-collapse:collapse;
      margin-top:10px;
      color:#e0f2fe;
      font-size:.8rem;
    }
    .oem-fs-cert-table th,
    .oem-fs-cert-table td{
      border:1px solid rgba(125,211,252,0.28);
      padding:8px 10px;
      text-align:left;
      vertical-align:top;
      background: rgba(4,16,40,0.38);
    }
    .oem-fs-cert-table th{
      color:#f8fcff;
      background: rgba(3,11,30,0.62);
      font-weight:700;
    }
    @keyframes fsFloat{
      0%,100%{ transform: translateY(0); }
      50%{ transform: translateY(-4px); }
    }
    @media (max-width: 980px){
      .oem-fs-section{ min-height: calc(100vh - var(--nav-stack-h)); }
      .oem-fs-inner{ width: min(94vw, 1100px); }
      .oem-fs-tech-row{ max-width: 100%; }
      .oem-fs-split{ grid-template-columns: 1fr; }
      .oem-fs-tech-row{ grid-template-columns: 1fr; }
      .oem-fs-section--hero{
        padding-top: 20px;
        padding-bottom: 24px;
      }
      .oem-fs-section--hero .oem-fs-title{
        font-size: clamp(1.6rem, 8vw, 2.2rem);
        line-height: 1.14;
        margin-bottom: 10px;
      }
      .oem-fs-section--hero .oem-fs-desc{
        font-size: .96rem;
        line-height: 1.72;
      }
      .oem-fs-actions{
        gap: 10px;
      }
      .oem-fs-actions .btn-primary,
      .oem-fs-actions .btn-outline{
        width: 100%;
        justify-content: center;
      }
      .oem-backend-demo video{
        height: auto;
        aspect-ratio: 16 / 9;
        min-height: 0;
      }
      .oem-backend-caption{
        font-size: .88rem;
        line-height: 1.66;
      }
    }
    @media (max-width: 980px){
      .oem-lux-hero, .oem-lux-section{ min-height: clamp(460px, 88vh, 760px); }
      .oem-lux-grid{ grid-template-columns: 1fr; }
      .oem-lux-steps{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }
    @media (max-width: 640px){
      .oem-lux-steps{ grid-template-columns: 1fr; }
      .oem-lux-title{ font-size: clamp(1.5rem, 8vw, 2rem); }
    }

    .product-card{
      border-radius: 26px;
      border: 1px solid rgba(96,165,250,0.22);
      background:
        linear-gradient(180deg, rgba(8,15,35,0.94), rgba(8,22,54,0.92) 54%, rgba(7,17,42,0.96) 100%);
      box-shadow: 0 26px 60px rgba(2,6,23,0.34), inset 0 0 0 1px rgba(34,211,238,0.06);
      overflow:hidden;
      position:relative;
      isolation:isolate;
      z-index:1;
    }
    .product-card::before{
      content:'';
      position:absolute;
      inset:0;
      background:
        linear-gradient(140deg, rgba(56,189,248,0.08), rgba(37,99,235,0.10) 38%, rgba(15,23,42,0) 72%),
        repeating-linear-gradient(90deg, rgba(96,165,250,0.07) 0 1px, transparent 1px 54px),
        repeating-linear-gradient(180deg, rgba(96,165,250,0.05) 0 1px, transparent 1px 54px);
      pointer-events:none;
      z-index:0;
    }
    .product-card::after{
      content:'';
      position:absolute;
      left: 18px;
      right: 18px;
      bottom: 86px;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(34,211,238,0.44), rgba(96,165,250,0.32), transparent);
      box-shadow: 0 0 16px rgba(34,211,238,0.16);
      pointer-events:none;
      z-index:1;
    }
    .merge-card, .app-card, .trust-card, .case-card-stat, .step-card, .blog-card{
      border-radius: var(--radius-card);
      border: 1px solid var(--border);
      background: linear-gradient(180deg, rgba(247,249,255,0.82), rgba(229,235,255,0.58));
      backdrop-filter: blur(16px);
      box-shadow: var(--shadow-md);
      transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
      overflow:hidden;
    }
    .merge-card:hover, .product-card:hover, .app-card:hover, .trust-card:hover, .case-card-stat:hover, .step-card:hover, .blog-card:hover{
      transform: translateY(-4px);
      border-color: rgba(111,132,232,0.34);
      box-shadow: var(--shadow-lg);
    }

    .merge-card{ padding: 1.75rem; text-align:left; }
    .merge-card i{ color: var(--accent-2); }
    .merge-card h3{ margin: .75rem 0 .5rem; font-size: 1.15rem; color: var(--text-1); font-family: Inter, Manrope, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
    .merge-card p{ color: var(--text-3); font-size: .95rem; }

    .product-img{
      position: relative;
      overflow: hidden;
      border-radius: 26px 26px 0 0;
      background:
        radial-gradient(circle at 50% 18%, rgba(34,211,238,0.22) 0%, rgba(34,211,238,0.08) 24%, rgba(34,211,238,0) 56%),
        radial-gradient(circle at 50% 82%, rgba(59,130,246,0.22) 0%, rgba(59,130,246,0.08) 30%, rgba(59,130,246,0) 58%),
        linear-gradient(180deg, #06111f 0%, #0a1833 52%, #071223 100%);
    }
    .product-img::before{
      content:'';
      position:absolute;
      inset:12px;
      border-radius: 20px;
      background:
        repeating-linear-gradient(90deg, rgba(96,165,250,0.10) 0 1px, transparent 1px 28px),
        repeating-linear-gradient(180deg, rgba(96,165,250,0.08) 0 1px, transparent 1px 28px),
        linear-gradient(180deg, rgba(10,20,42,0.66), rgba(8,15,35,0.42));
      border: 1px solid rgba(96,165,250,0.16);
      box-shadow: inset 0 0 0 1px rgba(34,211,238,0.06);
      pointer-events:none;
    }
    .product-img::after{
      content:'';
      position:absolute;
      left: 12%; right: 12%; bottom: 20px;
      height: 2px;
      background: linear-gradient(90deg, transparent, rgba(34,211,238,0.48), rgba(96,165,250,0.44), transparent);
      box-shadow: 0 0 20px rgba(34,211,238,0.18);
      pointer-events:none;
    }
    .product-img--cable{
      background:
        radial-gradient(circle at 50% 18%, rgba(34,211,238,0.18) 0%, rgba(34,211,238,0.05) 28%, rgba(34,211,238,0) 58%),
        radial-gradient(circle at 50% 84%, rgba(59,130,246,0.20) 0%, rgba(59,130,246,0.06) 32%, rgba(59,130,246,0) 60%),
        linear-gradient(180deg, #06111f 0%, #091833 56%, #071223 100%);
    }
    .product-img--pb{
      background:
        radial-gradient(circle at 50% 18%, rgba(34,211,238,0.18) 0%, rgba(34,211,238,0.05) 28%, rgba(34,211,238,0) 58%),
        radial-gradient(circle at 50% 84%, rgba(59,130,246,0.20) 0%, rgba(59,130,246,0.06) 32%, rgba(59,130,246,0) 60%),
        linear-gradient(180deg, #06111f 0%, #091833 56%, #071223 100%);
    }
    .product-img--pb::before{
      background:
        repeating-linear-gradient(90deg, rgba(96,165,250,0.08) 0 1px, transparent 1px 32px),
        repeating-linear-gradient(180deg, rgba(96,165,250,0.06) 0 1px, transparent 1px 32px),
        linear-gradient(180deg, rgba(8,15,35,0.24), rgba(8,15,35,0.08));
      border: 1px solid rgba(96,165,250,0.12);
      box-shadow: inset 0 0 0 1px rgba(34,211,238,0.05);
    }
    .product-img--pb::after{
      background: linear-gradient(90deg, transparent, rgba(34,211,238,0.42), rgba(96,165,250,0.38), transparent);
      box-shadow: 0 0 20px rgba(34,211,238,0.18);
    }
    .product-img--pb img{
      filter: drop-shadow(0 24px 30px rgba(2,6,23,0.42)) drop-shadow(0 0 24px rgba(34,211,238,0.10));
    }
    .product-img--cable::before{
      background:
        repeating-linear-gradient(90deg, rgba(96,165,250,0.08) 0 1px, transparent 1px 32px),
        repeating-linear-gradient(180deg, rgba(96,165,250,0.06) 0 1px, transparent 1px 32px),
        linear-gradient(180deg, rgba(8,15,35,0.24), rgba(8,15,35,0.08));
      border: 1px solid rgba(96,165,250,0.12);
      box-shadow: inset 0 0 0 1px rgba(34,211,238,0.05);
    }
    .product-img--cable::after{
      background: linear-gradient(90deg, transparent, rgba(34,211,238,0.42), rgba(96,165,250,0.38), transparent);
      box-shadow: 0 0 20px rgba(34,211,238,0.18);
    }
    .product-img--cable img{
      filter: drop-shadow(0 24px 30px rgba(2,6,23,0.42)) drop-shadow(0 0 24px rgba(34,211,238,0.10));
    }
    .product-tags-overlay{
      position:absolute;
      left: 16px;
      right: 16px;
      bottom: 14px;
      z-index: 2;
      display:flex;
      flex-wrap: wrap;
      gap: 8px;
      pointer-events:none;
    }
    .product-tags-overlay span{
      border-radius: 999px;
      border: 1px solid rgba(76,111,255,0.24);
      background: rgba(255,255,255,0.84);
      color: #2e3d6d;
      font-size: .74rem;
      font-weight: 800;
      letter-spacing: .01em;
      padding: 4px 9px;
      box-shadow: 0 6px 14px rgba(64,88,174,0.10);
    }
    .product-img.product-img--gallery,
    .product-card--cabinet-orange .product-img--gallery{
      background:
        radial-gradient(circle at 50% 18%, rgba(34,211,238,0.22) 0%, rgba(34,211,238,0.08) 24%, rgba(34,211,238,0) 56%),
        radial-gradient(circle at 50% 82%, rgba(59,130,246,0.22) 0%, rgba(59,130,246,0.08) 30%, rgba(59,130,246,0) 58%),
        linear-gradient(180deg, #06111f 0%, #0a1833 52%, #071223 100%);
    }
    .product-img img{
      position: relative;
      z-index: 1;
      width: auto;
      height: auto;
      max-width: 100%;
      max-height: 220px;
      object-fit: contain;
      object-position: center;
      display:block;
      margin: 0 auto;
      padding: 18px 18px 14px;
      filter: drop-shadow(0 24px 30px rgba(2,6,23,0.42)) drop-shadow(0 0 24px rgba(34,211,238,0.10));
    }
    .product-info{ position:relative; z-index:1; padding: 1.5rem; background: linear-gradient(180deg, rgba(8,15,35,0.00), rgba(8,15,35,0.14)); }
    .product-info h3{ font-size: 1.25rem; color: #f3f7ff; font-family: Inter, Manrope, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; letter-spacing: -0.02em; }
    .product-info p{ color: #9fb3d9; margin-top: 10px; font-size: .95rem; }
    .spec-badge{ border-radius: 999px; border: 1px solid rgba(96,165,250,0.30); background: rgba(10,20,42,0.66); color: #d9e6ff; padding: 6px 10px; font-weight: 800; font-size: .8rem; box-shadow: inset 0 0 0 1px rgba(34,211,238,0.04); }
    .spec-badge-list{ display:flex; flex-wrap:wrap; gap: 10px; margin-top: 10px; }
    .spec-table{ width:100%; border-collapse: separate; border-spacing: 0; margin-top: 18px; border: 1px solid rgba(111,132,232,0.16); background: rgba(245,247,255,0.78); overflow:hidden; border-radius: 16px; }
    .spec-table th, .spec-table td{ padding: 10px 12px; text-align:left; font-size: .92rem; border-bottom: 1px solid rgba(111,132,232,0.10); vertical-align: top; }
    .spec-table th{ color: var(--text-2); font-weight: 800; width: 34%; background: rgba(235,239,255,0.92); }
    .spec-table td{ color: var(--text-3); }
    .spec-table tr:last-child th, .spec-table tr:last-child td{ border-bottom: none; }
    .quick-quote{ width:100%; margin-top: 12px; }

    .product-subnav{
      position: sticky;
      top: calc(var(--nav-stack-h) + 12px);
      z-index: 50;
      margin: 10px 0 18px;
      padding: 14px 16px;
      border-radius: 22px;
      border: 1px solid rgba(96,165,250,0.18);
      background:
        linear-gradient(180deg, rgba(7,14,32,0.96), rgba(9,20,45,0.92)),
        repeating-linear-gradient(90deg, rgba(96,165,250,0.06) 0 1px, transparent 1px 52px);
      backdrop-filter: blur(14px);
      display:flex;
      flex-wrap: wrap;
      gap: 10px;
      justify-content: center;
      box-shadow: 0 22px 54px rgba(2,6,23,0.32), inset 0 0 0 1px rgba(34,211,238,0.04);
      overflow:hidden;
    }
    .product-subnav::before{
      content:'';
      position:absolute;
      inset:0;
      pointer-events:none;
      background:
        linear-gradient(90deg, transparent 0%, rgba(34,211,238,0.12) 14%, rgba(34,211,238,0) 22%, transparent 38%, rgba(96,165,250,0.10) 52%, rgba(96,165,250,0) 60%, transparent 78%),
        linear-gradient(180deg, transparent 16%, rgba(96,165,250,0.08) 22%, rgba(96,165,250,0) 28%, transparent 72%, rgba(34,211,238,0.07) 80%, rgba(34,211,238,0) 86%);
    }
    .product-subnav .cat-btn{
      padding: 10px 16px;
      font-size: 0.9rem;
      background: rgba(11,23,50,0.92);
      color: #eaf2ff;
      border: 1px solid rgba(96,165,250,0.24);
      box-shadow: inset 0 0 0 1px rgba(34,211,238,0.03);
    }
    .product-subnav .cat-btn:hover,
    .product-subnav .cat-btn.active{
      background: linear-gradient(135deg, rgba(29,78,216,0.46), rgba(14,165,233,0.26));
      border-color: rgba(56,189,248,0.42);
      color: #ffffff;
    }

    .trust-card{ padding: 1.75rem; }
    .trust-card i{ color: var(--accent-2); }
    .trust-card h3{ margin-top: 12px; color: var(--text-1); font-family: Inter, Manrope, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; letter-spacing: -0.02em; }
    .trust-card p{ color: var(--text-3); margin-top: 10px; }
    .trust-badges{ display:flex; flex-wrap:wrap; gap:10px; margin-top: 14px; }
    .trust-badge{ padding: 8px 12px; border-radius: 999px; border: 1px solid rgba(111,132,232,0.16); background: rgba(244,246,255,0.72); color: var(--text-2); font-size: .85rem; font-weight: 800; }

    .feature-grid{ display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin-top: 28px; }
    .feature-card{
      border-radius: 22px;
      border: 1px solid rgba(111,132,232,0.16);
      background: linear-gradient(180deg, rgba(247,249,255,0.84), rgba(229,235,255,0.56));
      box-shadow: var(--shadow-md);
      padding: 1.5rem;
    }
    .feature-card h3{ color: var(--text-1); font-size: 1.12rem; letter-spacing: -0.02em; }
    .feature-card p{ color: var(--text-3); margin-top: 10px; }
    .feature-card .meta{ margin-top: 14px; display:flex; flex-wrap:wrap; gap:10px; }
    .meta-pill{ padding: 7px 11px; border-radius: 999px; border: 1px solid rgba(111,132,232,0.16); background: rgba(244,246,255,0.72); color: var(--text-2); font-size: .82rem; font-weight: 700; }

    .image-placeholder,
    .media-slot{
      width:100%; min-height: 220px; border-radius: 22px;
      border: 1px dashed rgba(124,232,255,0.46);
      background:
        linear-gradient(135deg, rgba(124,232,255,0.10), rgba(95,112,255,0.10)),
        repeating-linear-gradient(90deg, rgba(123,143,220,0.08) 0 1px, transparent 1px 28px),
        repeating-linear-gradient(180deg, rgba(123,143,220,0.06) 0 1px, transparent 1px 28px),
        rgba(244,246,255,0.52);
      display:flex; align-items:center; justify-content:center; text-align:center;
      color: var(--text-3); padding: 18px;
    }
    .image-placeholder strong,
    .media-slot strong{ display:block; color: var(--text-1); margin-bottom: 8px; }
    .media-slot{
      position: relative;
      overflow:hidden;
      text-decoration:none;
      cursor:pointer;
      transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
      box-shadow: var(--shadow-md);
    }
    .media-slot:hover{
      transform: translateY(-3px);
      border-color: rgba(124,232,255,0.60);
      box-shadow: var(--shadow-lg);
    }
    .media-slot::after{
      content:'Replace with your image / video';
      position:absolute;
      right: 14px;
      bottom: 14px;
      padding: 7px 12px;
      border-radius: 999px;
      font-size: .78rem;
      font-weight: 700;
      color: #eff4ff;
      background: rgba(38,52,118,0.72);
      border: 1px solid rgba(124,232,255,0.24);
    }
    .media-slot--nohint::after{ content:none; display:none; }
    .media-slot__inner{ max-width: 460px; margin: 0 auto; }
    .media-slot__icon{ width: 62px; height: 62px; border-radius: 999px; margin: 0 auto 14px; display:flex; align-items:center; justify-content:center; background: linear-gradient(135deg, rgba(95,112,255,0.86), rgba(124,232,255,0.86)); color:#fff; box-shadow: 0 16px 30px rgba(86,102,184,0.20); }
    .media-slot__icon i{ font-size: 1.25rem; }
    .media-slot--video{ min-height: 320px; aspect-ratio: 16 / 9; }
    .media-slot--video .media-slot__icon{ width: 74px; height: 74px; }
    .factory-video-slot{
      padding: 0 !important;
      display:block !important;
      background: #020617 !important;
      border-style: solid !important;
      border-color: rgba(124,232,255,0.28) !important;
    }
    .factory-video{
      width: 100%;
      height: auto;
      aspect-ratio: 16 / 9;
      object-fit: cover;
      display: block;
      border-radius: inherit;
      background: #020617;
    }
    .factory-video-error{
      position:absolute;
      inset:auto 12px 12px 12px;
      padding: 8px 10px;
      border-radius: 10px;
      font-size: .8rem;
      line-height: 1.35;
      color:#e2e8f0;
      background: rgba(15,23,42,0.72);
      border: 1px solid rgba(148,163,184,0.35);
      backdrop-filter: blur(4px);
      z-index: 2;
      display:none;
      text-align:left;
    }
    .factory-video-slot.has-error .factory-video-error{ display:block; }

    .about-hero-grid{
      display:grid;
      grid-template-columns: minmax(420px, 1fr) minmax(520px, 1.18fr);
      gap: clamp(20px, 2.4vw, 34px);
      align-items: stretch;
    }
    .about-hero-grid .merge-card{
      height: 100%;
      display:flex;
      flex-direction: column;
      justify-content: center;
    }
    .about-main-visual-slot{
      padding: 0 !important;
      display: block !important;
      min-height: clamp(280px, 34vw, 460px);
      aspect-ratio: 16 / 10;
      border-style: solid !important;
      border-color: rgba(124,232,255,0.32) !important;
      background: #020617 !important;
      box-shadow: 0 28px 58px rgba(2,6,23,0.30);
    }
    .about-main-visual-video{
      width: 100%;
      height: 100%;
      min-height: inherit;
      display: block;
      object-fit: cover;
      border-radius: inherit;
      background: #020617;
    }
    .about-main-visual-note{
      position: absolute;
      left: 14px;
      right: 14px;
      bottom: 14px;
      padding: 8px 12px;
      border-radius: 999px;
      color: #e6f1ff;
      font-size: .78rem;
      font-weight: 700;
      background: rgba(15,23,42,0.66);
      border: 1px solid rgba(124,232,255,0.26);
      backdrop-filter: blur(6px);
      text-align: center;
      letter-spacing: .01em;
      pointer-events: none;
    }
    #aboutPage{
      position: relative;
      overflow-x: hidden;
      overflow-y: visible;
      background:
        radial-gradient(ellipse 90% 55% at 50% -10%, rgba(248, 174, 42, 0.28) 0%, rgba(248, 174, 42, 0) 70%),
        linear-gradient(180deg, #f4f6f9 0%, #e8edf4 42%, #f7f8fb 100%);
    }
    #aboutPage::before{
      content: '';
      position: absolute;
      inset: 0;
      z-index: 1;
      pointer-events: none;
      background:
        linear-gradient(180deg, rgba(255,255,255,0.45) 0%, rgba(255,255,255,0.18) 40%, rgba(255,255,255,0.35) 100%);
    }
    #aboutPage > .container{ position: relative; z-index: 2; margin-top: 0 !important; padding-top: clamp(86px, 12vh, 130px); }
    .about-stat-grid{ display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 18px; margin-top: 24px; }
    .about-stat-card{
      border-radius: 18px; padding: 1.25rem;
      background: linear-gradient(180deg, rgba(247,249,255,0.84), rgba(229,235,255,0.56));
      border: 1px solid rgba(111,132,232,0.16);
      box-shadow: var(--shadow-md);
    }
    .about-stat-card .num{ font-size: 1.8rem; font-weight: 900; color: var(--text-1); letter-spacing: -0.04em; }
    .about-stat-card .label{ margin-top: 6px; color: var(--text-3); font-size: .9rem; }
    .about-process-grid{
      display:grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 18px;
      margin-top: 16px;
    }
    .about-process-lead{
      color: #0f172a !important;
      background: rgba(255,255,255,0.78);
      border: 1px solid rgba(37,99,235,0.28);
      border-radius: 12px;
      padding: 10px 12px;
      line-height: 1.7;
      font-weight: 600;
      text-shadow: none;
    }
    .about-process-card{
      border-radius: 18px;
      border: 1px solid rgba(111,132,232,0.18);
      background: linear-gradient(180deg, rgba(248,251,255,0.88), rgba(233,239,255,0.66));
      box-shadow: var(--shadow-md);
      overflow: hidden;
    }
    .about-process-video{
      width: 100%;
      aspect-ratio: 16 / 9;
      display: block;
      object-fit: cover;
      background: #0b1326;
    }
    .about-process-body{
      padding: 14px 14px 16px;
      text-align: left;
    }
    .about-process-body h3{
      color: var(--text-1);
      font-size: 1.02rem;
      letter-spacing: -0.01em;
    }
    .about-process-body p{
      margin-top: 8px;
      color: var(--text-3);
      font-size: .92rem;
      line-height: 1.65;
    }

    .accordion-grid{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 22px; margin-top: 28px; }
    .accordion-card{
      border-radius: 22px;
      border: 1px solid rgba(111,132,232,0.16);
      background: linear-gradient(180deg, rgba(247,249,255,0.84), rgba(229,235,255,0.56));
      box-shadow: var(--shadow-md);
      overflow: hidden;
    }
    .accordion-card summary{
      list-style:none; cursor:pointer; padding: 1.2rem 1.3rem;
      color: var(--text-1); font-weight: 800; display:flex; align-items:center; justify-content:space-between; gap:12px;
    }
    .accordion-card summary::-webkit-details-marker{ display:none; }
    .accordion-card summary::after{ content:'+'; color: var(--accent); font-size: 1.15rem; }
    .accordion-card[open] summary::after{ content:'−'; }
    .accordion-card .accordion-body{ padding: 0 1.3rem 1.3rem; color: var(--text-3); }
    .accordion-card .accordion-body p + p{ margin-top: 10px; }
    .accordion-card .accordion-body .image-placeholder{ margin-top: 14px; min-height: 180px; }

    @media (max-width: 980px){
      .feature-grid, .accordion-grid, .about-stat-grid, .about-hero-grid{ grid-template-columns: 1fr; }
      .about-hero-grid{ gap: 16px; }
      .about-process-grid{ grid-template-columns: 1fr; gap: 14px; }
      .about-main-visual-slot{
        order: -1;
        min-height: 0;
        aspect-ratio: 16 / 9;
      }
      .about-hero-grid .merge-card{ height: auto; }
    }
    @media (max-width: 640px){
      .about-main-visual-slot{ border-radius: 16px; }
      .about-main-visual-note{
        left: 10px;
        right: 10px;
        bottom: 10px;
        font-size: .74rem;
        padding: 7px 10px;
      }
    }

    /* Customer logo wall */
    .customer-wall{ margin-top: 26px; }
    .customer-wall-title{ text-align:center; color: var(--text-1); font-weight: 900; font-family: Manrope, Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; letter-spacing: -0.01em; }
    .customer-wall-sub{ text-align:center; color: var(--text-3); margin-top: 10px; }
    .customer-types{ display:grid; grid-template-columns: repeat(6, 1fr); gap: 14px; margin-top: 18px; }
    .customer-type{
      border-radius: 14px;
      border: 1px solid rgba(255,255,255,0.08);
      background: rgba(15,23,42,0.45);
      padding: 14px 12px;
      display:flex;
      align-items:center;
      gap: 10px;
      justify-content:center;
      color: var(--text-2);
      font-weight: 900;
      font-size: .88rem;
    }
    .customer-type .icon{
      width: 38px; height: 38px; border-radius: 999px;
      background: rgba(148,163,184,0.10);
      display:flex; align-items:center; justify-content:center;
      color: rgba(148,163,184,0.95);
    }

    /* Latest Insights placeholder */
    .blog-section{
      position: relative;
      overflow: hidden;
      background:
        radial-gradient(circle at 18% 16%, rgba(74,160,255,0.12) 0%, rgba(74,160,255,0.05) 22%, rgba(74,160,255,0) 48%),
        radial-gradient(circle at 82% 18%, rgba(124,232,255,0.10) 0%, rgba(124,232,255,0.04) 18%, rgba(124,232,255,0) 40%),
        radial-gradient(circle at 50% 84%, rgba(95,112,255,0.12) 0%, rgba(95,112,255,0.05) 26%, rgba(95,112,255,0) 50%),
        linear-gradient(180deg, #081a31 0%, #091f39 44%, #071628 100%);
      min-height: 100vh;
      display: flex;
      align-items: center;
    }
    .blog-section::before{
      content:'';
      position:absolute;
      inset:0;
      background:
        repeating-linear-gradient(90deg, rgba(158,202,255,0.07) 0 1px, transparent 1px 96px),
        repeating-linear-gradient(180deg, rgba(158,202,255,0.05) 0 1px, transparent 1px 96px),
        linear-gradient(90deg, rgba(6,18,36,0.82) 0%, rgba(6,18,36,0.42) 32%, rgba(6,18,36,0.18) 56%, rgba(6,18,36,0.62) 100%);
      opacity: .82;
      pointer-events:none;
    }
    .blog-section::after{
      content:'';
      position:absolute;
      inset:0;
      background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 900'%3E%3Cg fill='none'%3E%3Cg opacity='0.14' stroke='%235fb6ff'%3E%3Cpath d='M0 184 C 174 154, 336 150, 520 178 S 880 242, 1128 214 S 1388 142, 1600 184'/%3E%3Cpath d='M0 724 C 220 690, 402 684, 614 722 S 1068 802, 1360 760 S 1518 710, 1600 676'/%3E%3Cpath d='M220 500h162l42-42h150'/%3E%3Cpath d='M1028 304h158l34 34h126'/%3E%3C/g%3E%3Cg opacity='0.12' stroke='%2399e9ff'%3E%3Ccircle cx='574' cy='458' r='6'/%3E%3Ccircle cx='1184' cy='338' r='6'/%3E%3Ccircle cx='420' cy='542' r='5'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") center center / cover no-repeat;
      mix-blend-mode: screen;
      opacity: .52;
      pointer-events:none;
    }
    .blog-section .container{ position: relative; z-index: 1; }
    .blog-section .section-title h2,
    .blog-section .section-title p{ color: #eef4fb; }
    .blog-section .section-title p{ max-width: 700px; color: rgba(210,222,242,0.78); }
    .blog-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: var(--grid-gap); margin-top: 24px; }
    .blog-card{
      padding: 0;
      border: 1px solid rgba(118,154,214,0.20);
      background:
        linear-gradient(180deg, rgba(10,19,38,0.80), rgba(11,24,46,0.74) 54%, rgba(8,17,33,0.86) 100%);
      box-shadow: 0 20px 46px rgba(3,10,24,0.26), inset 0 0 0 1px rgba(255,255,255,0.02);
      position: relative;
      isolation: isolate;
    }
    .blog-card::before{
      content:'';
      position:absolute;
      inset:0;
      background:
        linear-gradient(145deg, rgba(91,165,255,0.06), rgba(67,108,214,0.06) 38%, rgba(15,23,42,0) 74%),
        repeating-linear-gradient(90deg, rgba(134,175,232,0.04) 0 1px, transparent 1px 62px),
        repeating-linear-gradient(180deg, rgba(134,175,232,0.03) 0 1px, transparent 1px 62px);
      pointer-events:none;
      z-index:0;
    }
    .blog-card > *{ position: relative; z-index: 1; }
    .blog-media{
      height: 170px;
      width: 100%;
      background:
        radial-gradient(circle at 20% 18%, rgba(118,198,255,0.12) 0%, rgba(118,198,255,0.04) 18%, rgba(118,198,255,0) 46%),
        linear-gradient(180deg, rgba(7,17,42,0.14), rgba(7,17,42,0.52));
      display:flex;
      align-items:center;
      justify-content:center;
      color: rgba(148,163,184,0.85);
      border: 0;
      padding: 0;
      text-align: left;
      font: inherit;
      -webkit-appearance: none;
      appearance: none;
    }
    .blog-media.is-link{ cursor: pointer; }
    .blog-media.is-link:hover{ filter: saturate(1.03) contrast(1.02) brightness(1.02); }
    .blog-media.is-link:focus{ outline: none; }
    .blog-media.is-link:focus-visible{ box-shadow: 0 0 0 3px rgba(118,198,255,0.14) inset, 0 0 0 1px rgba(118,198,255,0.30) inset; }
    .blog-body{ padding: 1.3rem 1.5rem 1.5rem; }
    .blog-body h3{ color: #f0f5fc; font-size: 1.05rem; font-weight: 900; }
    .blog-body p{ color: #9eb0cd; margin-top: 8px; font-size: .92rem; }
    .blog-actions{ margin-top: 14px; display:flex; gap:10px 14px; align-items:center; justify-content: space-between; flex-wrap: wrap; }
    .blog-btn{
      border: 1px solid rgba(118,154,214,0.20);
      background: rgba(10,19,38,0.72);
      color: #d6e3f5;
      padding: 10px 12px;
      border-radius: 999px;
      font-weight: 900;
      cursor: pointer;
      transition: transform .18s ease, border-color .18s ease, background .18s ease;
    }
    .blog-btn:hover{ transform: translateY(-1px); border-color: rgba(124,232,255,0.24); background: rgba(124,232,255,0.08); }
    .blog-meta{ color: rgba(186,204,230,0.82); font-size: .82rem; font-weight: 800; letter-spacing: .01em; }
    .blog-media.is-cover{ background-size: cover; background-position: center; position: relative; overflow:hidden; }
    .blog-media.is-cover::after{
      content:'';
      position:absolute; inset:0;
      background:
        linear-gradient(180deg, rgba(2,6,23,0.08) 0%, rgba(3,11,28,0.26) 48%, rgba(2,6,23,0.72) 100%),
        linear-gradient(120deg, transparent 60%, rgba(123,235,255,0.08) 70%, transparent 78%);
      pointer-events:none;
    }
    .blog-badge{
      position:absolute; left: 12px; top: 12px; z-index: 2;
      padding: 7px 10px; border-radius: 999px;
      border: 1px solid rgba(160,192,232,0.20);
      background: rgba(9,18,34,0.68);
      color: #ecf3fb;
      font-weight: 900;
      font-size: .78rem;
      backdrop-filter: blur(10px);
      box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02);
    }

    .below-blog-section{
      position: relative;
      overflow: hidden;
      background:
        linear-gradient(135deg, #091728 0%, #0b1e35 34%, #10233f 62%, #0a182b 100%);
      isolation: isolate;
    }
    .below-blog-section::before{
      content:'';
      position:absolute;
      inset:0;
      background:
        linear-gradient(118deg, transparent 0%, transparent 18%, rgba(105,170,255,0.10) 28%, rgba(105,170,255,0.03) 36%, transparent 44%),
        linear-gradient(126deg, transparent 0%, transparent 54%, rgba(124,232,255,0.11) 64%, rgba(124,232,255,0.03) 72%, transparent 80%),
        repeating-linear-gradient(90deg, rgba(160,198,246,0.05) 0 1px, transparent 1px 104px),
        repeating-linear-gradient(180deg, rgba(160,198,246,0.03) 0 1px, transparent 1px 104px);
      opacity: .92;
      pointer-events:none;
      z-index:0;
    }
    .below-blog-section::after{
      content:'';
      position:absolute;
      inset:0;
      background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 900'%3E%3Cg fill='none'%3E%3Cg opacity='0.16' stroke='%2386c8ff'%3E%3Cpath d='M96 212h316l66-66h246'/%3E%3Cpath d='M878 254h202l48 48h226'/%3E%3Cpath d='M144 666h272l82-82h238'/%3E%3Cpath d='M932 624h194l56-56h258'/%3E%3C/g%3E%3Cg opacity='0.12' stroke='%2399e9ff'%3E%3Cpath d='M0 792C196 708 374 676 560 688C760 700 904 806 1110 800C1302 794 1452 708 1600 628'/%3E%3C/g%3E%3Cg opacity='0.14' fill='%2399e9ff'%3E%3Ccircle cx='412' cy='212' r='6'/%3E%3Ccircle cx='1128' cy='302' r='6'/%3E%3Ccircle cx='416' cy='666' r='6'/%3E%3Ccircle cx='1182' cy='624' r='6'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") center center / cover no-repeat;
      mix-blend-mode: screen;
      opacity: .6;
      pointer-events:none;
      z-index:0;
    }
    .below-blog-section > .container{ position: relative; z-index: 1; }
    .below-blog-section .section-title h2{ color: #edf4fc; }
    .below-blog-section .section-title p{ color: rgba(205,220,242,0.78); }
    .below-blog-section .merge-card{
      border: 1px solid rgba(124,164,224,0.20);
      background: linear-gradient(180deg, rgba(11,21,40,0.78), rgba(12,25,48,0.70));
      box-shadow: 0 22px 46px rgba(3,10,24,0.24), inset 0 0 0 1px rgba(255,255,255,0.02);
      backdrop-filter: blur(14px);
    }
    .below-blog-section .merge-grid{
      margin-top: 20px;
      gap: clamp(20px, 2.2vw, 34px);
    }
    .below-blog-section .merge-card h3,
    .below-blog-section .merge-card p,
    .below-blog-section .merge-card i{ position: relative; z-index: 1; }
    .below-blog-section .merge-card h3{ color: #eef4fb; }
    .below-blog-section .merge-card p{ color: #a8b9d4; }
    .below-blog-section .merge-card i{ color: #8ed6ff; }

    /* Insight modal (blog detail) */
    .insight-modal{ position: fixed; inset:0; z-index: 10040; background: rgba(2,6,23,0.92); display:none; }
    .insight-modal.is-open{ display:block; }
    .insight-modal__panel{
      width: min(820px, 94vw);
      max-height: min(90vh, 920px);
      margin: 5vh auto 0;
      overflow:auto;
      border-radius: 20px;
      border: 1px solid rgba(255,255,255,0.10);
      background: #0f172a;
      box-shadow: 0 34px 110px rgba(0,0,0,0.58);
    }
    .insight-modal__hero{ position:relative; height: 220px; background: rgba(148,163,184,0.08); }
    .insight-modal__hero img{ width:100%; height:100%; object-fit: cover; display:block; }
    .insight-modal__hero::after{ content:''; position:absolute; inset:0; background: linear-gradient(180deg, rgba(2,6,23,0.05) 0%, rgba(2,6,23,0.82) 100%); }
    .insight-modal__close{
      position: fixed;
      top: 18px; right: 18px;
      z-index: 10060;
      width: 44px; height: 44px;
      border-radius: 50%;
      border: 1px solid rgba(255,255,255,0.12);
      background: rgba(15,23,42,0.65);
      color: #fff;
      cursor:pointer;
    }
    .insight-modal__close:hover{ background: rgba(45,212,191,0.18); border-color: rgba(45,212,191,0.45); }
    .insight-article{ padding: 0 28px 30px; max-width: 720px; margin: 0 auto; }
    .insight-article__meta{
      padding: 20px 28px 0;
      max-width: 720px;
      margin: 0 auto;
      display: flex;
      flex-wrap: wrap;
      gap: 8px 16px;
      color: rgba(186, 204, 230, 0.88);
      font-size: .84rem;
      font-weight: 600;
    }
    .insight-article__meta a{ color: #7dd3fc; text-decoration: none; font-weight: 700; }
    .insight-article__meta a:hover{ text-decoration: underline; }
    .insight-article__kicker{
      display: block;
      width: 100%;
      font-size: .76rem;
      font-weight: 800;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: #2dd4bf;
      margin-bottom: 4px;
    }
    .insight-article h1{ color: #f8fbff; font-size: clamp(1.45rem, 3vw, 1.95rem); line-height: 1.2; letter-spacing: -0.02em; margin: 0 0 12px; font-weight: 800; }
    .insight-article .sub{ color: #a8bdd9; font-size: 1.02rem; line-height: 1.65; margin-bottom: 22px; padding-bottom: 18px; border-bottom: 1px solid rgba(148,163,184,0.14); }
    .insight-article h2{ color: #f0f5fc; font-size: 1.18rem; margin: 30px 0 10px; line-height: 1.35; font-weight: 800; }
    .insight-article p{ color: #d5e2f7; font-size: 1rem; line-height: 1.78; margin: 0 0 14px; }
    .insight-article ul, .insight-article ol{ color: #d5e2f7; margin: 0 0 16px; padding-left: 1.2rem; line-height: 1.75; }
    .insight-article li{ margin: 7px 0; }
    .insight-article .callout{
      margin: 20px 0;
      padding: 16px 18px;
      border-radius: 12px;
      border: 1px solid rgba(124,232,255,0.16);
      background: rgba(17, 28, 51, 0.72);
      color: #d9e7fb;
    }
    .insight-article .callout p{ margin: 0; }
    .insight-article figure{ margin: 22px 0; border-radius: 12px; overflow: hidden; border: 1px solid rgba(148,163,184,0.14); }
    .insight-article figure img{
      width:100%;
      display:block;
      cursor: zoom-in;
    }
    .insight-article figcaption{ color: rgba(168,189,217,0.92); font-size: .86rem; margin: 0; padding: 10px 12px; border-top: 1px solid rgba(148,163,184,0.12); line-height: 1.5; }
    .insight-article .cta-row{ display:flex; flex-wrap:wrap; gap: 10px; margin-top: 28px; padding-top: 20px; border-top: 1px solid rgba(148,163,184,0.14); }
    .insight-article .cta-row .btn{ padding: 11px 16px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.10); background: rgba(15,23,42,0.55); color: #eef4ff; font-weight: 700; cursor:pointer; font-size: .9rem; }
    .insight-article .cta-row .btn.primary{ background: rgba(45,212,191,0.14); border-color: rgba(45,212,191,0.38); color: #e7fffb; }
    .insight-article .cta-row .btn:hover{ border-color: rgba(45,212,191,0.45); background: rgba(45,212,191,0.10); }
    .blog-card .blog-read-link{
      display: inline-flex;
      align-items: center;
      gap: 6px;
      margin-top: 12px;
      color: #7dd3fc;
      font-size: .86rem;
      font-weight: 700;
      text-decoration: none;
    }
    .blog-card .blog-read-link:hover{ text-decoration: underline; }

    /* OEM timeline */
    .process-timeline{ display:grid; gap:0; margin: 32px 0; position:relative; padding-left: 28px; border-left: 2px solid rgba(45,212,191,0.45); }
    .process-step{ position:relative; padding: 16px 0 16px 20px; }
    .process-step::before{ content:''; position:absolute; left:-35px; top:22px; width:14px; height:14px; border-radius:50%; background: var(--accent); box-shadow: 0 0 0 4px rgba(45,212,191,0.10); }
    .process-step h4{ color: var(--text-1); margin-bottom: 6px; font-size: 1rem; }
    .process-step p{ color: var(--text-3); font-size: .92rem; }
    .case-card-stat .big-stat{ font-size: 2rem; font-weight: 900; color: var(--text-1); font-family: Manrope, Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }

    /* FAQ (search only) */
    .faq-search{
      width: 100%;
      max-width: 520px;
      margin: 0 auto 18px;
      display:block;
      padding: 12px 16px;
      border-radius: var(--radius-input);
      border: 1px solid rgba(255,255,255,0.12);
      background: rgba(15,23,42,0.55);
      color: var(--text-2);
    }
    .faq-hint{ text-align:center; color: var(--text-3); font-size: .9rem; margin: -8px auto 18px; max-width: 740px; }
    .faq-list-wrap{ max-height: 70vh; overflow:auto; padding-right: 8px; }
    .faq-item details{ border: 1px solid rgba(255,255,255,0.10); border-radius: 12px; margin-bottom: 10px; background: rgba(15,23,42,0.55); padding: 0 14px; }
    .faq-item summary{ cursor:pointer; padding: 14px 6px; font-weight: 800; color: var(--text-2); list-style:none; }
    .faq-item summary::-webkit-details-marker{ display:none; }
    .faq-item .faq-answer{ padding: 0 6px 14px; color: var(--text-3); font-size: .92rem; line-height: 1.6; border-top: 1px solid rgba(255,255,255,0.06); padding-top: 12px; }

    /* SEO answer strip + hub links (below hero, above blog) */
    .seo-answer-section{
      padding: 36px 0 28px;
      background: linear-gradient(180deg, rgba(11,18,32,0.98) 0%, rgba(15,23,42,0.96) 100%);
      border-top: 1px solid rgba(148,163,184,0.12);
      border-bottom: 1px solid rgba(148,163,184,0.08);
    }
    .seo-answer-lead{
      max-width: 820px;
      margin: 0 auto 18px;
      text-align: center;
      color: #c5d4ea;
      font-size: 1.02rem;
      line-height: 1.75;
    }
    .seo-answer-lead strong{ color: #eef4fb; font-weight: 700; }
    .hub-path{
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 10px 18px;
    }
    .hub-path a{
      color: #93c5fd;
      text-decoration: none;
      font-size: .92rem;
      font-weight: 600;
      border-bottom: 1px solid rgba(147,197,253,0.35);
      padding-bottom: 2px;
    }
    .hub-path a:hover{ color: #bfdbfe; border-bottom-color: rgba(191,219,254,0.7); }
    .hub-path--faq{ margin-top: 22px; }
    .faq-section{
      padding: 64px 0 72px;
    }
    .faq-section .section-title h2{ color: #edf4fc; }
    .faq-section .section-title p{ color: rgba(205,220,242,0.78); }
    .cases-section{
      padding: 64px 0 56px;
      background: linear-gradient(180deg, rgba(11,18,32,0.98) 0%, rgba(15,23,42,0.94) 100%);
    }
    .cases-section .section-title h2{ color: #edf4fc; }
    .cases-section .section-title p{ color: rgba(205,220,242,0.78); }
    .cases-grid{
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px;
      margin-top: 8px;
    }
    @media (max-width: 960px){
      .cases-grid{ grid-template-columns: 1fr; }
    }
    .cases-section .case-card-stat{
      background: rgba(15,23,42,0.72);
      border: 1px solid rgba(148,163,184,0.14);
      border-radius: 16px;
      height: 100%;
    }
    .page-crumb{
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px;
      font-size: .86rem;
      color: var(--text-3);
      margin: 0 0 18px;
    }
    .page-crumb a{
      color: #93c5fd;
      text-decoration: none;
    }
    .page-crumb a:hover{ text-decoration: underline; }

    /* Contact */
    #contactPage{ background: linear-gradient(160deg, #eef5ff 0%, #ddeeff 100%); }
    .contact-block{
      display:grid;
      grid-template-columns: 1fr 1.3fr;
      gap:0;
      overflow:hidden;
      border-radius: var(--radius-card);
      box-shadow: 0 20px 60px rgba(37,99,235,0.13);
      background: #ffffff;
    }
    .contact-info{
      background: linear-gradient(145deg, #2563eb 0%, #1d4ed8 60%, #1e40af 100%);
      padding: 2.5rem 2rem;
      color: #ffffff;
      display: flex;
      flex-direction: column;
      gap: 18px;
    }
    .contact-info h2{
      color: #ffffff !important;
      font-size: 1.55rem;
      font-weight: 800;
      line-height: 1.25;
    }
    .contact-info p{
      color: rgba(255,255,255,0.88);
      font-size: 1rem;
      margin-bottom: 6px;
    }
    .contact-info div{
      color: rgba(255,255,255,0.90);
      font-size: .95rem;
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .contact-info i{
      color: #93c5fd;
      font-size: 1.05rem;
      flex-shrink: 0;
    }
    .contact-info a.contact-info__link{
      color: rgba(255,255,255,0.95);
      text-decoration: underline;
      text-underline-offset: 3px;
      word-break: break-word;
    }
    .contact-info a.contact-info__link:hover{
      color: #ffffff;
    }
    .contact-form{
      padding: 2.5rem 2rem;
      background: #ffffff;
    }
    .contact-form-title{
      font-size: 1.15rem;
      font-weight: 700;
      color: #1e3a8a;
      margin-bottom: 18px;
      letter-spacing: -.01em;
    }
    .form-control{
      width:100%;
      background: #f0f6ff;
      border: 1.5px solid #bfdbfe;
      color: #1e3a8a;
      border-radius: 12px;
      padding: 13px 16px;
      margin-bottom: 12px;
      font-size: .97rem;
      transition: border-color .18s, box-shadow .18s;
      outline: none;
      font-family: inherit;
    }
    .form-control:focus{
      border-color: #2563eb;
      box-shadow: 0 0 0 3px rgba(37,99,235,0.15);
      background: #ffffff;
    }
    .form-control::placeholder{ color: #6b90c4; }
    select.form-control{ color: #1e3a8a; cursor: pointer; }
    select.form-control option{ background: #ffffff; color: #1e3a8a; }
    textarea.form-control{ resize: vertical; min-height: 90px; }
    .form-row{ display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }

    /* Footer */
    footer{ background: linear-gradient(180deg, #030711 0%, #060d1d 42%, #050b18 100%); border-top: 1px solid rgba(148,163,184,0.14); margin-top: 24px; }
    .footer-top-note{ margin-top: 24px; padding: 18px 22px; border-radius: 18px; background: linear-gradient(180deg, rgba(12,20,40,0.78), rgba(8,14,30,0.72)); border: 1px solid rgba(148,163,184,0.14); color: #d8e2ef; font-size: .94rem; line-height: 1.7; }
    .footer-row{ display:grid; grid-template-columns: 1.2fr 1fr 1fr 1.1fr; gap: 30px; margin-top: 18px; padding: 30px; border-radius: 22px; background: linear-gradient(180deg, rgba(5,10,22,0.96), rgba(5,10,22,0.88)); border: 1px solid rgba(148,163,184,0.14); box-shadow: 0 18px 42px rgba(2,6,23,0.30); }
    .footer-title{ color: #ffffff; font-weight: 900; margin-bottom: 12px; font-family: Manrope, Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; letter-spacing: .01em; }
    .footer-sub{ color: #ccd8ec; font-size: .95rem; line-height: 1.8; }
    .footer-nav-list{ list-style:none; display:grid; gap:10px; }
    .footer-nav-list a{ color:#e6eef8; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:8px; transition: color .2s ease, transform .2s ease; }
    .footer-nav-list a::before{ content:'•'; color: rgba(96,165,250,0.75); }
    .footer-nav-list a:hover{ color:#7dd3fc; transform: translateX(2px); }
    .footer-social-label{ color:#f4f8ff; font-weight: 800; margin-top:14px; font-size:.98rem; }
    .footer-icons{ display:flex; gap:10px; margin-top: 12px; flex-wrap: wrap; }
    .footer-icons a{ width:40px; height:40px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; color:#fff; border:1px solid rgba(255,255,255,0.16); background: rgba(30,41,59,0.52); transition: transform .2s ease, filter .2s ease, border-color .2s ease; text-decoration:none; }
    .footer-icons a:hover{ transform: translateY(-2px) scale(1.03); border-color: rgba(124,232,255,0.52); filter: brightness(1.08); }
    .footer-icons a.yt{ background:#ff0000; }
    .footer-icons a.ig{ background: linear-gradient(135deg,#f58529,#dd2a7b,#8134af,#515bd4); }
    .footer-icons a.tt{ background:#111; }
    .footer-icons a.fb{ background:#1877f2; }
    .footer-icons a.in{ background:#0a66c2; }
    .footer-icons a.wa{ background:#25d366; }
    .footer-contact-list{ display:grid; gap:10px; margin-top: 6px; }
    .footer-contact-item{ display:flex; align-items:flex-start; gap:10px; color:#d9e5f8; font-size:.93rem; line-height:1.55; }
    .footer-contact-item i{ color:#7dd3fc; width:16px; margin-top:3px; }
    .footer-contact-item a{ color:#d9e5f8; text-decoration:none; }
    .footer-contact-item a:hover{ color:#7dd3fc; }

    .back-arrow{ display:inline-flex; align-items:center; gap:10px; background: transparent; border:none; color: var(--text-2); font-weight: 900; margin-bottom: 18px; cursor:pointer; font-size: .92rem; text-transform: none; letter-spacing: .01em; }
    .back-arrow i{ color: var(--accent); }
    /* Floating back button: always reachable while scrolling */
    .back-arrow.is-floating{
      position: fixed;
      left: 18px;
      top: calc(var(--nav-stack-h) + 14px);
      z-index: 1200;
      margin: 0;
      padding: 10px 14px;
      border-radius: 999px;
      background: rgba(10,12,20,0.72);
      backdrop-filter: blur(10px);
      border: 1px solid rgba(255,255,255,0.10);
      box-shadow: 0 14px 40px rgba(0,0,0,0.35);
    }
    .back-arrow.is-floating:hover{ background: rgba(15,23,42,0.86); border-color: rgba(45,212,191,0.28); }
    @media (max-width: 980px){
      .back-arrow.is-floating{ left: 12px; top: calc(var(--nav-stack-h) + 10px); }
    }

    .hidden{ display:none; }
    .text-center{ text-align:center; }
    .mt-2{ margin-top: 10px; }
    .mt-3{ margin-top: 14px; }
    .mt-4{ margin-top: 18px; }
    .pt-3{ padding-top: 12px; }
    .border-top{ border-top: 1px solid rgba(255,255,255,0.06); }
    .small{ font-size: .9rem; }

    /* Floating actions */
    .wa-float{
      position: fixed;
      right: max(18px, env(safe-area-inset-right, 0px));
      bottom: max(18px, env(safe-area-inset-bottom, 0px));
      z-index: 10050;
      width: 56px;
      height: 56px;
      border-radius: 999px;
      background: #25D366;
      color:#fff;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      border: 1px solid rgba(255,255,255,0.18);
      box-shadow: 0 18px 44px rgba(0,0,0,0.35);
      text-decoration:none;
      transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
    }
    .wa-float:hover{ transform: translateY(-3px); filter: brightness(1.02); box-shadow: 0 26px 70px rgba(0,0,0,0.45); }
    .wa-float i{ font-size: 1.6rem; }

    .to-top{
      position: fixed;
      right: max(18px, env(safe-area-inset-right, 0px));
      bottom: max(86px, calc(22px + env(safe-area-inset-bottom, 0px) + 56px));
      z-index: 10040;
      width: 48px;
      height: 48px;
      border-radius: 999px;
      border: 1px solid rgba(255,255,255,0.14);
      background: rgba(15,23,42,0.72);
      color: var(--text-2);
      display:none;
      align-items:center;
      justify-content:center;
      cursor:pointer;
      box-shadow: 0 18px 44px rgba(0,0,0,0.30);
      transition: transform .18s ease, border-color .18s ease, background .18s ease;
    }
    .to-top:hover{ transform: translateY(-2px); border-color: rgba(45,212,191,0.35); background: rgba(15,23,42,0.85); }
    .support-btn{
      border: 1px solid rgba(94,234,212,0.45);
      background: linear-gradient(135deg, rgba(16,185,129,0.30), rgba(45,212,191,0.22));
      color: #e9fffa !important;
      box-shadow: inset 0 0 0 1px rgba(94,234,212,0.18);
    }
    .support-btn:hover{ border-color: rgba(94,234,212,0.66); background: linear-gradient(135deg, rgba(16,185,129,0.42), rgba(45,212,191,0.30)); }
    .customer-widget{
      position: fixed;
      right: max(18px, env(safe-area-inset-right, 0px));
      top: 50%;
      transform: translateY(-50%);
      z-index: 10055;
      display:flex;
      align-items:center;
      gap: 10px;
      pointer-events: none;
    }
    .customer-trigger{
      width: 58px;
      height: 58px;
      border-radius: 16px;
      border: 1px solid rgba(94,234,212,0.46);
      background: linear-gradient(145deg, rgba(8,22,54,0.94), rgba(8,15,35,0.98));
      color:#dffcf4;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      cursor:pointer;
      box-shadow: 0 18px 40px rgba(2,6,23,0.42);
      transition: transform .2s ease, border-color .2s ease;
      pointer-events: auto;
    }
    .customer-trigger i{ font-size: 1rem; margin-bottom: 2px; color:#5eead4; }
    .customer-trigger span{ font-size: .72rem; font-weight: 800; letter-spacing: .02em; }
    .customer-trigger:hover{ transform: translateY(-2px); border-color: rgba(94,234,212,0.72); }
    .customer-panel{
      width: 280px;
      border-radius: 18px;
      border: 1px solid rgba(148,163,184,0.26);
      background: linear-gradient(180deg, rgba(5,12,28,0.95), rgba(7,18,42,0.94));
      box-shadow: 0 22px 60px rgba(2,6,23,0.52);
      padding: 14px;
      opacity: 0;
      pointer-events: none;
      transform: translateX(10px);
      transition: opacity .2s ease, transform .2s ease;
    }
    .customer-widget.is-open .customer-panel{ opacity:1; pointer-events:auto; transform: translateX(0); }
    .customer-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
    .customer-head strong{ color:#eff7ff; font-size:.96rem; }
    .customer-close{ border:none; background:transparent; color:#9fb3d9; cursor:pointer; }
    .customer-item{
      display:flex;
      align-items:center;
      gap:10px;
      border-radius: 12px;
      border: 1px solid rgba(148,163,184,0.22);
      background: rgba(15,23,42,0.54);
      color:#e6eefb;
      padding: 10px 10px;
      text-decoration:none;
      margin-top:8px;
      font-size:.88rem;
      width:100%;
      cursor:pointer;
    }
    .customer-item i{ width:16px; color:#67e8f9; }
    .customer-item:hover{ border-color: rgba(94,234,212,0.56); background: rgba(16,185,129,0.14); }
    .customer-note{ color:#9fb3d9; font-size:.78rem; margin-top:10px; line-height:1.55; }

    /* Responsive */
    @media (max-width: 980px){
      .merge-grid{ grid-template-columns: 1fr; }
      #oemCaseGrid{ grid-template-columns: 1fr !important; }
      .trust-grid{ grid-template-columns: 1fr; }
      .footer-row{ grid-template-columns: 1fr; gap:20px; }
      .customer-types{ grid-template-columns: repeat(2, 1fr); }
      .blog-grid{ grid-template-columns: 1fr; }
      .nav-toggle{ display:inline-flex; }
      .nav-links{ display:none; }
      .lang-btn{ min-height: 44px; }
      .navbar .container{ gap: 10px; }
      .logo{ font-size: clamp(0.92rem, 3.5vw, 1.04rem); }
      .contact-block{ grid-template-columns: 1fr; }
      .customer-widget{ right: max(12px, env(safe-area-inset-right, 0px)); top: auto; bottom: max(148px, calc(20px + env(safe-area-inset-bottom, 0px) + 56px)); transform: none; }
      .customer-panel{ width: min(78vw, 290px); }
    }
    @media (max-width: 768px){
      section{ padding: var(--section-pad-mobile) 0; }
      .product-grid{ grid-template-columns: 1fr; gap: 20px; }
      .form-row{ grid-template-columns: 1fr; }
      body::before{ opacity: .6; }
      /* iOS: prevent input zoom; keep tap targets comfortable */
      input, select, textarea{ font-size: 16px !important; }
      .wa-float, .to-top, .customer-trigger{
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
      }
      .wa-float{
        width: 52px;
        height: 52px;
        bottom: max(14px, env(safe-area-inset-bottom, 0px));
        right: max(14px, env(safe-area-inset-right, 0px));
      }
      .to-top{
        width: 46px;
        height: 46px;
        bottom: max(76px, calc(14px + env(safe-area-inset-bottom, 0px) + 52px));
      }
      /* Give page content room above floating WA / support */
      body{ padding-bottom: max(88px, calc(72px + env(safe-area-inset-bottom, 0px))); }
      .blog-card, .product-card, .btn-primary, .btn-outline, .inquiry-btn{
        -webkit-tap-highlight-color: transparent;
      }
      .product-img img, .pd-gallery img{
        max-width: 100%;
        height: auto;
      }
    }
    @media (max-width: 640px){
      .customer-types{ grid-template-columns: 1fr; }
      .page-top-pad{
        margin-top: max(64px, calc(var(--nav-stack-h) + 10px));
      }
      .apps-grid{ grid-template-columns: 1fr; }
      .merge-grid{ gap: 18px; margin: 28px 0; }
      .footer-row{
        padding: 18px 14px;
        gap: 22px;
        border-radius: 16px;
      }
      .footer-top-note{
        padding: 14px 14px;
        font-size: .88rem;
      }
      .contact-info, .contact-form{
        padding: 1.35rem 1.05rem;
      }
      .contact-info h2{
        font-size: 1.28rem;
      }
      .contact-form-title{
        font-size: 1.05rem;
      }
      .spec-table th, .spec-table td{
        padding: 8px 10px;
        font-size: .84rem;
      }
      .spec-table th{
        width: 38%;
      }
      .back-arrow.is-floating{
        left: max(10px, env(safe-area-inset-left, 0px));
        padding: 8px 10px;
        font-size: .86rem;
      }
    }
    @media (max-width: 480px){
      .form-control{
        font-size: 16px;
      }
    }

    /* ——  / （ · ）—— */
    .product-img { position: relative; overflow: hidden; border-radius: 26px 26px 0 0; background: radial-gradient(circle at 50% 24%, rgba(124,232,255,0.24) 0%, rgba(124,232,255,0.08) 28%, rgba(124,232,255,0) 60%), radial-gradient(circle at 50% 82%, rgba(95,112,255,0.18) 0%, rgba(95,112,255,0.04) 34%, rgba(95,112,255,0) 62%), linear-gradient(180deg, #edf2ff 0%, #e3eaff 48%, #d0dbff 100%); }
    .product-img--gallery img { object-fit: contain; object-position: center; padding: clamp(8px, 2vw, 16px); width: auto; height: auto; max-width: 100%; max-height: clamp(180px, 28vw, 220px); }
    .product-img--gallery img.tj-cabinet-shot { background: transparent; }
    .product-card--cabinet-orange { border: 1px solid rgba(251, 146, 60, 0.35); }
    .product-card--cabinet-orange .product-img--gallery {
      background: linear-gradient(180deg, rgba(60, 32, 18, 0.95), rgba(22, 12, 8, 1));
    }
    .detail-gallery-shell { position: relative; width: 100%; max-width: min(100%, 920px); margin: 0 auto; }
    .detail-gallery-frame {
      position: relative; width: 100%; border-radius: clamp(20px, 4vw, 32px); overflow: hidden;
      background:
        radial-gradient(circle at 50% 18%, rgba(34,211,238,0.18) 0%, rgba(34,211,238,0.05) 28%, rgba(34,211,238,0) 58%),
        radial-gradient(circle at 50% 84%, rgba(59,130,246,0.20) 0%, rgba(59,130,246,0.06) 32%, rgba(59,130,246,0) 60%),
        linear-gradient(180deg, #06111f 0%, #091833 56%, #071223 100%);
      border: 1px solid rgba(96,165,250,0.18);
      box-shadow: 0 28px 60px rgba(2,6,23,0.38), inset 0 0 0 1px rgba(34,211,238,0.05);
    }
    .detail-gallery-frame::before{
      content:'';
      position:absolute;
      inset:14px;
      border-radius: 24px;
      background:
        repeating-linear-gradient(90deg, rgba(96,165,250,0.08) 0 1px, transparent 1px 32px),
        repeating-linear-gradient(180deg, rgba(96,165,250,0.06) 0 1px, transparent 1px 32px),
        linear-gradient(180deg, rgba(8,15,35,0.24), rgba(8,15,35,0.08));
      border: 1px solid rgba(96,165,250,0.12);
      pointer-events:none;
    }
    .detail-gallery-frame--orange {
      border-color: rgba(96,165,250,0.18);
      background:
        radial-gradient(circle at 50% 18%, rgba(34,211,238,0.18) 0%, rgba(34,211,238,0.05) 28%, rgba(34,211,238,0) 58%),
        radial-gradient(circle at 50% 84%, rgba(59,130,246,0.20) 0%, rgba(59,130,246,0.06) 32%, rgba(59,130,246,0) 60%),
        linear-gradient(180deg, #06111f 0%, #091833 56%, #071223 100%);
      box-shadow: 0 28px 60px rgba(2,6,23,0.38), inset 0 0 0 1px rgba(34,211,238,0.05);
    }
    .detail-gallery-main {
      position: relative;
      display: flex; align-items: center; justify-content: center;
      width: 100%; min-height: min(52vw, 380px); max-height: min(72vh, 560px);
      padding: clamp(12px, 3vw, 32px);
    }
    .detail-gallery-main img {
      width: 100%; height: auto; max-height: min(72vh, 560px); object-fit: contain; object-position: center;
      cursor: zoom-in; user-select: none; -webkit-user-drag: none;
    }
    .detail-gallery-main img.tj-cabinet-shot { background: transparent; }
    .pd-related-card img.tj-cabinet-shot { background: radial-gradient(ellipse 85% 75% at 50% 65%, var(--tj-product-bg-mid) 0%, var(--tj-product-bg) 72%) !important; }
    .detail-nav-btn {
      position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border: none; border-radius: 50%;
      background: rgba(15,23,42,0.88); color: #fff; backdrop-filter: blur(8px);
      box-shadow: 0 10px 24px rgba(0,0,0,0.35); cursor: pointer; z-index: 2; transition: background 0.2s, transform 0.15s;
    }
    .detail-nav-btn:hover { background: rgba(45,212,191,0.45); }
    .detail-nav-btn:active { transform: translateY(-50%) scale(0.96); }
    .detail-thumb-strip { display: grid; gap: 12px; padding: 0 8px 16px; }
    .detail-thumb-strip img {
      width: 100%; aspect-ratio: 4/3; object-fit: contain; object-position: center;
      border-radius: 16px; background: linear-gradient(180deg, rgba(8,15,35,0.88), rgba(8,22,54,0.82)); cursor: pointer;
      border: 1px solid rgba(96,165,250,0.18); transition: opacity 0.2s, box-shadow 0.2s, border-color 0.2s;
    }
    .detail-thumb-strip img.is-active {
      border-color: rgba(34,211,238,0.55); opacity: 1;
      box-shadow: 0 0 0 1px rgba(34,211,238,0.24), 0 12px 28px rgba(2,6,23,0.28);
    }
    .detail-thumb-strip img:not(.is-active) { opacity: 0.78; }
    .detail-thumb-strip img:hover { opacity: 1; border-color: rgba(96,165,250,0.55); }
    .detail-gallery-hover-zone { width: 100%; }
    .detail-lightbox { position: fixed; inset: 0; z-index: 10050; background: rgba(2,6,23,0.94); display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 12px; touch-action: pan-y; }
    .detail-lightbox-toolbar { position: absolute; top: 12px; left: 12px; right: 12px; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; z-index: 10060; pointer-events: none; }
    .detail-lightbox-toolbar button { pointer-events: auto; width: 42px; height: 42px; border: none; border-radius: 50%; background: rgba(255,255,255,0.1); color: #fff; cursor: pointer; font-size: 0.95rem; }
    .detail-lightbox-toolbar button:hover { background: rgba(45,212,191,0.45); }
    .detail-lightbox-stage {
      flex: 1; width: 100%; max-width: min(1200px, 96vw); overflow: auto; display: flex; align-items: center; justify-content: center;
      cursor: grab; touch-action: none; margin-top: 48px;
    }
    .detail-lightbox-stage.dragging { cursor: grabbing; }
    .detail-lightbox-stage img {
      width: auto;
      height: auto;
      max-width: min(88vw, 1080px);
      max-height: min(78vh, 760px);
      border-radius: 20px;
      box-shadow: 0 24px 80px rgba(0,0,0,0.55);
      transform-origin: center center;
      transition: transform 0.06s ease-out;
      object-fit: contain;
    }
    .detail-lightbox-nav {
      position: absolute; top: 50%; transform: translateY(-50%); width: 52px; height: 52px; border: none; border-radius: 50%;
      background: rgba(15,23,42,0.92); color: #fff; cursor: pointer; z-index: 10060; box-shadow: 0 8px 20px rgba(0,0,0,0.45);
      pointer-events: auto; font-size: 1.1rem;
    }
    .detail-lightbox-nav:hover { background: rgba(45,212,191,0.55); }
    .detail-lightbox-nav.lb-prev { left: 8px; }
    .detail-lightbox-nav.lb-next { right: 8px; }
    .detail-lightbox-bottom-nav {
      position: absolute; bottom: 56px; left: 50%; transform: translateX(-50%); display: flex; gap: 14px; align-items: center;
      z-index: 10060; pointer-events: auto;
    }
    .detail-lightbox-bottom-nav button {
      padding: 11px 22px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.28);
      background: rgba(15,23,42,0.95); color: #e2e8f0; font-size: 0.92rem; font-weight: 600; cursor: pointer;
    }
    .detail-lightbox-bottom-nav button:hover { background: rgba(45,212,191,0.45); border-color: rgba(94,234,212,0.55); }
    .detail-lightbox-dots { position: absolute; bottom: 100px; left: 50%; transform: translateX(-50%); display: flex; gap: 10px; z-index: 10060; pointer-events: auto; }
    .detail-lightbox-dots span { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,0.22); cursor: pointer; transition: background 0.2s, transform 0.15s; }
    .detail-lightbox-dots span.is-on { background: var(--accent); transform: scale(1.15); }
    .detail-lightbox-hint { position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%); color: #94a3b8; font-size: 0.82rem; text-align: center; max-width: 92%; z-index: 10055; pointer-events: none; }
    .product-detail-page-wrap { padding-bottom: 48px; position:relative; }
    .product-detail-page-wrap::before,
    #allProductsPage::before,
    #productListPage::before,
    #productDetailPage::before{
      content:'';
      position:fixed;
      inset:0;
      z-index:-1;
      pointer-events:none;
      background:
        radial-gradient(circle at 15% 18%, rgba(34,211,238,0.12) 0%, rgba(34,211,238,0.03) 20%, transparent 38%),
        radial-gradient(circle at 82% 12%, rgba(59,130,246,0.14) 0%, rgba(59,130,246,0.04) 22%, transparent 40%),
        radial-gradient(circle at 50% 100%, rgba(37,99,235,0.14) 0%, rgba(37,99,235,0.04) 28%, transparent 50%),
        repeating-linear-gradient(90deg, rgba(96,165,250,0.05) 0 1px, transparent 1px 72px),
        repeating-linear-gradient(180deg, rgba(96,165,250,0.04) 0 1px, transparent 1px 72px),
        linear-gradient(180deg, #050b18 0%, #091225 36%, #0a1830 68%, #081221 100%);
    }
    #allProductsPage > .container,
    #productListPage > .container,
    #productDetailPage > .container,
    .product-detail-page-wrap > .container{
      position: relative;
      z-index: 1;
    }
    .pd-hero {
      display: grid;
      grid-template-columns: minmax(0, 42%) minmax(0, 58%);
      gap: clamp(24px, 3vw, 40px);
      align-items: start;
      margin-bottom: clamp(28px, 4vw, 48px);
    }
    .pd-col-gallery { position: sticky; top: 96px; }
    .pd-gallery-zone { width: 100%; }
    .pd-main-frame { position: relative; }
    .pd-zoom-badge {
      position: absolute; top: 14px; right: 14px; z-index: 3;
      display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px;
      font-size: 0.8rem; font-weight: 600; color: #e2e8f0;
      background: rgba(10, 12, 20, 0.78); border: 1px solid rgba(45,212,191,0.4);
      pointer-events: none; backdrop-filter: blur(8px);
    }
    .pd-thumb-row {
      display: flex; flex-wrap: nowrap; gap: 10px; margin-top: 14px;
      overflow-x: auto; padding-bottom: 6px; scrollbar-width: thin;
      max-width: 100%;
    }
    .pd-thumb-more-hint { font-size: 0.72rem; color: var(--text-3); margin-top: 8px; padding-left: 2px; }
    .pd-thumb-row img {
      flex: 0 0 auto; width: 88px; height: 66px; object-fit: contain; border-radius: 12px;
      background: linear-gradient(180deg, rgba(8,15,35,0.92), rgba(8,22,54,0.84)); border: 1px solid rgba(96,165,250,0.18); cursor: pointer;
      transition: box-shadow 0.2s, border-color 0.2s, opacity 0.2s; opacity: 0.82;
    }
    .pd-thumb-row img.is-active { border-color: rgba(34,211,238,0.55); opacity: 1; box-shadow: 0 0 0 1px rgba(34,211,238,0.24), 0 10px 24px rgba(2,6,23,0.30); }
    .pd-thumb-row img:hover { opacity: 1; border-color: rgba(96,165,250,0.55); }
    .pd-thumb-row img.tj-cabinet-shot { background: linear-gradient(180deg, rgba(8,15,35,0.92), rgba(8,22,54,0.84)); }
    .pd-col-info {
      padding: 10px 0 0 0;
      position: relative;
    }
    .pd-col-info::before{
      content:'';
      position:absolute;
      inset:-18px -18px -18px -10px;
      border-radius: 30px;
      background:
        linear-gradient(180deg, rgba(7,14,32,0.94), rgba(9,20,45,0.90)),
        repeating-linear-gradient(90deg, rgba(96,165,250,0.05) 0 1px, transparent 1px 58px),
        repeating-linear-gradient(180deg, rgba(96,165,250,0.04) 0 1px, transparent 1px 58px);
      border: 1px solid rgba(96,165,250,0.14);
      box-shadow: 0 28px 64px rgba(2,6,23,0.32);
      z-index:0;
      pointer-events: none;
    }
    .pd-col-info > *{ position:relative; z-index:1; }
    .pd-title {
      font-size: clamp(1.9rem, 3vw, 2.6rem); font-weight: 900; letter-spacing: -0.03em; line-height: 1.12; margin-bottom: 18px;
      background: linear-gradient(135deg, #ffffff, #dbeafe 42%, #7dd3fc 100%); background-clip: text; -webkit-background-clip: text; color: transparent;
    }
    .pd-selling-row {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
      margin-bottom: 20px;
    }
    .pd-selling-item {
      display: flex; align-items: center; gap: 12px; font-size: 0.94rem; color: #d7e4fb;
      padding: 12px 14px;
      border-radius: 16px;
      background: rgba(11,23,50,0.86);
      border: 1px solid rgba(96,165,250,0.18);
      line-height: 1.45;
    }
    .pd-selling-item i { color: #67e8f9; font-size: 1.05rem; }
    .pd-tag-row { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 18px; }
    .pd-mini-tag {
      font-size: 0.82rem; font-weight: 700; padding: 8px 14px; border-radius: 999px;
      background: rgba(17,31,63,0.96); border: 1px solid rgba(96,165,250,0.26); color: #eaf2ff;
    }
    .pd-oem-pill {
      display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px; border-radius: 16px; margin-bottom: 22px;
      font-weight: 800; font-size: 0.9rem; letter-spacing: 0.02em;
      background: linear-gradient(105deg, rgba(37,99,235,0.30), rgba(14,165,233,0.18));
      border: 1px solid rgba(96,165,250,0.34); color: #f8fbff;
      box-shadow: 0 10px 24px rgba(2,6,23,0.22);
    }
    /* Orange variant (6-slot orange cabinet) */
    .pd-theme-orange .pd-mini-tag { background: rgba(251,146,60,0.12); border-color: rgba(251,146,60,0.42); }
    .pd-theme-orange .pd-oem-pill {
      background: linear-gradient(105deg, rgba(251,146,60,0.16), rgba(45,212,191,0.10));
      border-color: rgba(251,146,60,0.48);
    }
    .pd-theme-orange .pd-thumb-row img.is-active { border-color: rgba(251,146,60,0.65); box-shadow: 0 0 0 1px rgba(251,146,60,0.45); }
    .pd-theme-orange .detail-nav-btn:hover { background: rgba(251,146,60,0.55); }
    .pd-theme-orange .pd-zoom-badge { border-color: rgba(251,146,60,0.42); }

    .pd-stack-tabs{ margin: 8px 0 14px; padding: 12px 12px; border-radius: 16px; background: rgba(15,23,42,0.38); border: 1px solid rgba(255,255,255,0.08); }
    .pd-stack-tabs__label{ font-size: 0.78rem; color: var(--text-3); margin-bottom: 10px; letter-spacing: .02em; }
    .pd-stack-tabs__row{ display:flex; flex-wrap: wrap; gap: 8px; }
    .pd-stack-tab{ border: 1px solid rgba(255,255,255,0.10); background: rgba(10,12,20,0.35); color: var(--text-2); padding: 8px 12px; border-radius: 999px; cursor:pointer; font-weight: 800; font-size: 0.85rem; }
    .pd-stack-tab:hover{ border-color: rgba(45,212,191,0.35); background: rgba(15,23,42,0.62); }
    .pd-stack-tab.is-active{ border-color: rgba(45,212,191,0.55); box-shadow: 0 0 0 1px rgba(45,212,191,0.22) inset; background: rgba(45,212,191,0.12); color: #e7fffb; }
    .pd-theme-orange .pd-stack-tab:hover{ border-color: rgba(251,146,60,0.42); }
    .pd-theme-orange .pd-stack-tab.is-active{ border-color: rgba(251,146,60,0.65); box-shadow: 0 0 0 1px rgba(251,146,60,0.22) inset; background: rgba(251,146,60,0.12); }

    .pd-stack-color-tabs{ margin: 10px 0 14px; padding: 12px 14px; border-radius: 16px; background: rgba(10,12,20,0.34); border: 1px solid rgba(255,255,255,0.14); }
    .pd-stack-color-tabs__label{ font-size: 0.8rem; color: #dbe7fb; margin-bottom: 10px; letter-spacing: .04em; font-weight: 800; text-transform: uppercase; }
    .pd-stack-color-tabs__row{ display:flex; flex-wrap: wrap; gap: 10px; }
    .pd-stack-color-tab,
    .pd-color-tab{ border: 1.5px solid rgba(255,255,255,0.18); background: rgba(15,23,42,0.55); color: #e8f0ff; padding: 8px 14px; border-radius: 999px; cursor:pointer; font-weight: 800; font-size: 0.88rem; display:inline-flex; align-items:center; gap:8px; min-height:40px; }
    .pd-color-dot{ width:14px; height:14px; border-radius:50%; border:1px solid rgba(255,255,255,0.35); flex:0 0 auto; }
    .pd-color-tab.is-white .pd-color-dot, .pd-stack-color-tab.is-white .pd-color-dot{ background: linear-gradient(145deg,#fff,#e5e7eb); }
    .pd-color-tab.is-orange .pd-color-dot, .pd-stack-color-tab.is-orange .pd-color-dot{ background: linear-gradient(145deg,#fb923c,#ea580c); }
    .pd-color-tab.is-yellow .pd-color-dot, .pd-stack-color-tab.is-yellow .pd-color-dot{ background: linear-gradient(145deg,#f2d04a,#d4a017 55%,#b8860b); box-shadow: inset 0 1px 0 rgba(255,248,210,.55); }
    .pd-color-tab.is-cyan .pd-color-dot, .pd-stack-color-tab.is-cyan .pd-color-dot{ background: linear-gradient(145deg,#6fd4d8,#1aa8b0 55%,#0e7480); box-shadow: inset 0 1px 0 rgba(210,250,252,.45); }
    .pd-stack-color-tab:hover, .pd-color-tab:hover{ border-color: rgba(45,212,191,0.45); background: rgba(15,23,42,0.78); }
    .pd-stack-color-tab.is-active, .pd-color-tab.is-active{ border-color: rgba(45,212,191,0.75); box-shadow: 0 0 0 1px rgba(45,212,191,0.28) inset; background: rgba(45,212,191,0.16); color: #e7fffb; }
    .pd-theme-orange .pd-stack-color-tab:hover, .pd-theme-orange .pd-color-tab:hover{ border-color: rgba(251,146,60,0.5); }
    .pd-theme-orange .pd-stack-color-tab.is-active, .pd-theme-orange .pd-color-tab.is-active{ border-color: rgba(251,146,60,0.75); box-shadow: 0 0 0 1px rgba(251,146,60,0.28) inset; background: rgba(251,146,60,0.14); }
    .pd-cta-row { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 22px; }
    .pd-cta-row .btn-primary, .pd-cta-row .btn-outline { padding: 14px 26px; font-size: 0.95rem; }
    .pd-trust-row { display: flex; flex-wrap: wrap; gap: 12px 18px; font-size: 0.82rem; color: var(--text-3); }
    .pd-trust-row span { display: inline-flex; align-items: center; gap: 6px; }
    .pd-trust-row i { color: var(--accent); }
    .pd-bento { display: flex; flex-direction: column; gap: clamp(20px, 3vw, 28px); }
    .pd-card {
      border-radius: 24px; padding: clamp(22px, 3vw, 30px);
      background: linear-gradient(180deg, rgba(10,18,40,0.96), rgba(10,24,56,0.92));
      border: 1px solid rgba(96,165,250,0.18);
      box-shadow: 0 28px 64px rgba(2,6,23,0.34), inset 0 0 0 1px rgba(34,211,238,0.04);
      position:relative;
      overflow:hidden;
    }
    .pd-card::before{
      content:'';
      position:absolute;
      inset:0;
      pointer-events:none;
      background:
        linear-gradient(135deg, rgba(34,211,238,0.05), rgba(37,99,235,0.08) 44%, rgba(15,23,42,0) 72%),
        repeating-linear-gradient(90deg, rgba(96,165,250,0.05) 0 1px, transparent 1px 52px),
        repeating-linear-gradient(180deg, rgba(96,165,250,0.04) 0 1px, transparent 1px 52px);
    }
    .pd-card h2 { position:relative; z-index:1; font-size: 1.28rem; font-weight: 900; margin-bottom: 16px; color: #f8fbff; font-family: Manrope, Inter, system-ui, sans-serif; }
    .pd-card .pd-prose { position:relative; z-index:1; color: #d0ddf5; font-size: 1rem; line-height: 1.82; }
    .pd-card .pd-prose p + p { margin-top: 14px; }
    .pd-spec-table-wrap { overflow-x: auto; border-radius: 16px; border: 1px solid rgba(96,165,250,0.18); position:relative; z-index:1; background: rgba(8,18,40,0.42); }
    .pd-spec-table { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
    .pd-spec-table th, .pd-spec-table td { padding: 14px 16px; text-align: left; border-bottom: 1px solid rgba(96,165,250,0.10); vertical-align: top; }
    .pd-spec-table th { color: #f1f6ff; font-weight: 800; width: 34%; background: rgba(16,32,66,0.86); }
    .pd-spec-table td { color: #d5e2f7; }
    .pd-spec-table tr:last-child th, .pd-spec-table tr:last-child td { border-bottom: none; }
    .pd-apps-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
    .pd-apps-item { display:block; border-radius: 16px; overflow: hidden; border: 1px solid rgba(96,165,250,0.18); background: rgba(8,22,54,0.72); text-decoration:none; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
    .pd-apps-item figure { margin:0; }
    .pd-apps-item:hover { transform: translateY(-2px); border-color: rgba(94,234,212,0.38); box-shadow: 0 12px 28px rgba(2,6,23,0.28); }
    .pd-apps-item img { width: 100%; height: 140px; object-fit: cover; display: block; }
    .pd-apps-item figcaption { padding: 10px 12px; font-size: 0.82rem; color: #c6d4ef; text-align: center; }
    .pd-factory-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
    .pd-factory-item {
      border-radius: 16px; overflow: hidden; border: 1px solid rgba(96,165,250,0.18);
      background: rgba(8,22,54,0.72); transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
    }
    .pd-factory-item:hover { transform: translateY(-3px); border-color: rgba(34,211,238,0.36); box-shadow: 0 12px 28px rgba(2,6,23,0.28); }
    .pd-factory-item img { width: 100%; height: 130px; object-fit: cover; display: block; }
    .pd-factory-item p { padding: 10px 12px; font-size: 0.82rem; color: #c6d4ef; line-height: 1.45; }
    .pd-oem-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
    .pd-oem-cell {
      display: flex; align-items: flex-start; gap: 12px; padding: 14px; border-radius: 14px;
      background: rgba(8,22,54,0.72); border: 1px solid rgba(96,165,250,0.18); font-size: 0.88rem; color: #d3ddf1;
    }
    .pd-oem-cell i { color: #67e8f9; margin-top: 2px; }
    .pd-related-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
    @media (max-width: 900px) {
      .pd-related-grid {
        display: flex; flex-wrap: nowrap; gap: 16px; overflow-x: auto; padding-bottom: 8px;
        scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
      }
      .pd-related-card { min-width: min(280px, 85vw); flex: 0 0 auto; scroll-snap-align: start; }
    }
    .pd-related-card {
      border-radius: 20px; overflow: hidden; border: 1px solid rgba(96,165,250,0.18);
      background: linear-gradient(180deg, rgba(10,18,40,0.94), rgba(10,24,56,0.90)); display: flex; flex-direction: column;
      cursor: pointer;
      box-shadow: 0 22px 44px rgba(2,6,23,0.26);
    }
    .pd-related-card img { width: 100%; height: 140px; object-fit: contain; background: linear-gradient(180deg, #08111f 0%, #0c1730 100%); padding: 14px; }
    .pd-related-card .pd-rc-body { padding: 16px; flex: 1; display: flex; flex-direction: column; gap: 10px; }
    .pd-related-card h4 { font-size: 1rem; font-weight: 800; color: #f3f7ff; font-family: Manrope, Inter, system-ui, sans-serif; }
    .pd-related-card .pd-rc-spec { font-size: 0.82rem; color: #b7c7e5; line-height: 1.6; }

    @media (max-width: 1024px) {
      .pd-hero { grid-template-columns: 1fr; }
      .pd-col-gallery { position: static; }
    }
    @media (max-width: 768px) {
      .pd-apps-grid, .pd-factory-grid { grid-template-columns: 1fr; }
      .pd-oem-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }
    @media (max-width: 640px) {
      .detail-lightbox-nav { width: 40px; height: 40px; }
      .detail-nav-btn { width: 38px; height: 38px; }
      .pd-oem-grid { grid-template-columns: 1fr; }
    }