:root{
  --blue:#1264f4;--blue2:#0d4ed8;--ink:#111827;--muted:#667085;--line:#e8edf4;--soft:#f5f8fc;--green:#13a35a;--red:#ef4444;--shadow:0 12px 30px rgba(24,39,75,.08);--radius:18px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:var(--ink);background:#fff}a{text-decoration:none;color:inherit}button,input{font:inherit}.shell{max-width:1180px;margin:0 auto;padding:0 18px}.topbar{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.header{height:68px;display:flex;align-items:center;gap:14px}.brand{display:flex;align-items:center;gap:8px;min-width:max-content}.brand img{width:38px}.brand b{font-size:19px}.brand small{display:block;color:#8b95a5;font-size:10px;margin-top:-2px}.search{flex:1;position:relative}.search input{width:100%;height:42px;border:1px solid var(--line);background:var(--soft);border-radius:12px;padding:0 48px 0 16px;outline:0}.search button{position:absolute;right:5px;top:5px;height:32px;border:0;border-radius:9px;background:var(--blue);color:#fff;padding:0 14px;cursor:pointer}.head-actions{display:flex;gap:10px}.icon-btn{height:40px;min-width:40px;border:1px solid var(--line);background:#fff;border-radius:12px;display:grid;place-items:center;position:relative;cursor:pointer}.icon-btn .badge{position:absolute;right:-3px;top:-4px;background:var(--red);color:#fff;border:2px solid #fff;border-radius:99px;font-size:10px;min-width:19px;height:19px;display:grid;place-items:center}.mobile-only{display:none}
.hero{margin-top:16px;border-radius:22px;overflow:hidden;background:linear-gradient(105deg,#07101d 0%,#0a1727 53%,#0d263d 100%);color:#fff;min-height:340px;position:relative;box-shadow:var(--shadow)}.hero-inner{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;padding:42px}.hero h1{font-size:46px;line-height:1.02;margin:9px 0 14px;letter-spacing:-1.4px}.hero h1 span{color:#5ca4ff}.hero p{color:#c1c9d5;font-size:16px;max-width:540px;line-height:1.6}.eyebrow{font-size:12px;letter-spacing:1.7px;color:#91a0b4}.btn{border:0;border-radius:12px;background:var(--blue);color:#fff;height:46px;padding:0 20px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn.secondary{background:#fff;color:var(--blue);border:1px solid var(--line)}.hero-art{display:flex;justify-content:center;align-items:center}.hero-art img{width:100%;max-width:500px;filter:drop-shadow(0 20px 32px rgba(0,0,0,.35))}.hero-pills{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}.hero-pill{padding:9px 11px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);border-radius:12px;color:#d7deea;font-size:12px}
.quick-benefits{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:14px 0 26px}.benefit{border:1px solid var(--line);background:#fff;border-radius:14px;padding:14px 12px;display:flex;align-items:center;gap:10px;font-size:12px}.benefit .i{width:32px;height:32px;border-radius:10px;background:#eaf2ff;color:var(--blue);display:grid;place-items:center;font-weight:900}
.section{margin:28px 0}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:14px}.section h2{margin:0;font-size:25px;letter-spacing:-.4px}.section-head a{color:var(--blue);font-size:13px;font-weight:700}.categories{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.category{border:1px solid var(--line);border-radius:16px;background:#fff;padding:14px;text-align:center;transition:.2s;cursor:pointer}.category:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.category .pic{height:80px;background:var(--soft);border-radius:13px;display:flex;align-items:center;justify-content:center;margin-bottom:10px}.category img{max-width:90%;max-height:68px}.category b{font-size:12px}.brand-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;border:1px solid var(--line);border-radius:16px;padding:14px}.brand-pill{height:54px;border-right:1px solid var(--line);display:grid;place-items:center;font-size:18px;font-weight:800;letter-spacing:-.4px}.brand-pill:last-child{border:0}.brand-pill:nth-child(1){color:#e11d48}.brand-pill:nth-child(2){color:#2563eb}.brand-pill:nth-child(3){color:#64748b}
.promo-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:12px}.promo{border-radius:18px;min-height:174px;padding:22px;position:relative;overflow:hidden;background:linear-gradient(135deg,#eaf2ff,#dbeafe)}.promo.dark{background:linear-gradient(135deg,#101827,#24374e);color:#fff}.promo h3{font-size:21px;margin:0 0 8px;max-width:60%}.promo p{font-size:13px;color:#637083;max-width:55%;line-height:1.45}.promo.dark p{color:#cbd5e1}.promo img{position:absolute;right:-15px;bottom:-10px;width:48%;max-height:160px;object-fit:contain}
.tabs{display:flex;gap:8px;overflow:auto;padding-bottom:4px;margin-bottom:14px}.tab{white-space:nowrap;border:0;background:var(--soft);border-radius:10px;padding:9px 13px;font-size:12px;cursor:pointer}.tab.active{background:var(--blue);color:#fff}.products{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.product{border:1px solid var(--line);border-radius:17px;background:#fff;padding:12px;position:relative;display:flex;flex-direction:column;min-width:0}.product:hover{box-shadow:var(--shadow)}.product .visual{height:160px;border-radius:14px;background:linear-gradient(180deg,#fafcff,#f4f7fb);display:flex;align-items:center;justify-content:center}.product .visual img{max-width:92%;max-height:150px}.tag{position:absolute;top:14px;left:14px;background:var(--green);color:#fff;border-radius:8px;font-size:10px;font-weight:800;padding:5px 7px}.tag.red{background:var(--red)}.heart{position:absolute;right:16px;top:16px;font-size:20px;color:#94a3b8}.product h3{font-size:14px;line-height:1.35;margin:12px 0 3px}.spec{font-size:11px;color:var(--muted);min-height:30px}.rating{font-size:11px;color:#f59e0b;margin:7px 0}.price{font-size:17px;font-weight:800}.old-price{font-size:10px;text-decoration:line-through;color:#98a2b3;margin-left:5px}.stock{font-size:11px;color:var(--green);font-weight:700;margin:5px 0 10px}.product .btn{height:39px;width:100%;margin-top:auto;font-size:12px}
.solution-banner{border-radius:20px;background:linear-gradient(100deg,#0d1b2d,#122d4b);color:#fff;padding:30px;display:flex;align-items:center;justify-content:space-between;gap:18px}.solution-banner h3{font-size:28px;margin:0 0 6px}.solution-banner p{color:#cbd5e1;margin:0}.footer{border-top:1px solid var(--line);margin-top:40px;padding:30px 0 100px}.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:24px}.footer h4{margin:0 0 10px}.footer p,.footer a{color:var(--muted);font-size:12px;line-height:1.9;display:block}
.bottom-nav{display:none}
/* catalog */.page-title{display:flex;justify-content:space-between;align-items:center;margin:24px 0}.catalog-layout{display:grid;grid-template-columns:240px 1fr;gap:20px}.filters{border:1px solid var(--line);border-radius:16px;padding:18px;height:max-content;position:sticky;top:90px}.filter-block{border-bottom:1px solid var(--line);padding:0 0 16px;margin-bottom:16px}.filter-block:last-child{border:0}.filter-block h4{margin:0 0 10px}.check{display:flex;gap:9px;align-items:center;margin:9px 0;font-size:13px;color:#475467}.range-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.range-row input{width:100%;height:38px;border:1px solid var(--line);border-radius:10px;padding:0 10px}.catalog-products{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.sortbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.sortbar select{border:1px solid var(--line);border-radius:10px;height:38px;padding:0 10px;background:#fff}.filter-open{display:none}
/* product */.product-page{display:grid;grid-template-columns:1fr 1fr;gap:34px;margin-top:26px}.gallery-main{border:1px solid var(--line);border-radius:22px;background:var(--soft);height:480px;display:grid;place-items:center}.gallery-main img{max-width:88%;max-height:420px}.thumbs{display:flex;gap:10px;margin-top:10px}.thumb{width:76px;height:66px;border:1px solid var(--line);border-radius:12px;display:grid;place-items:center;background:#fff}.thumb.active{border:2px solid var(--blue)}.thumb img{max-width:90%;max-height:58px}.product-info h1{font-size:31px;line-height:1.15;margin:0 0 8px}.product-code{color:var(--muted);font-size:12px}.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:18px 0}.fact{border:1px solid var(--line);border-radius:12px;padding:12px;text-align:center}.fact b{display:block;font-size:17px}.fact small{color:var(--muted)}.big-price{font-size:30px;font-weight:900;margin:20px 0 4px}.buy-row{display:flex;gap:10px;margin-top:18px}.buy-row .btn{flex:1}.desc{margin-top:25px;border-top:1px solid var(--line);padding-top:20px;color:#475467;line-height:1.7}
/* cart/profile */.cart-list{display:grid;gap:12px}.cart-item{display:grid;grid-template-columns:120px 1fr auto;gap:14px;align-items:center;border:1px solid var(--line);border-radius:16px;padding:12px}.cart-item img{width:110px;height:90px;object-fit:contain;background:var(--soft);border-radius:12px}.qty{display:flex;align-items:center;gap:8px}.qty button{width:32px;height:32px;border:1px solid var(--line);background:#fff;border-radius:9px}.checkout{margin-top:18px;border:1px solid var(--line);border-radius:16px;padding:18px}.checkout .row{display:flex;justify-content:space-between;margin:8px 0}.checkout .total{font-size:24px;font-weight:900;padding-top:12px;border-top:1px solid var(--line)}.profile-card{display:grid;grid-template-columns:80px 1fr;gap:15px;align-items:center;border:1px solid var(--line);border-radius:18px;padding:18px}.avatar{width:70px;height:70px;border-radius:50%;background:linear-gradient(135deg,#1264f4,#60a5fa);color:#fff;display:grid;place-items:center;font-size:26px;font-weight:800}.menu-list{margin-top:16px;border:1px solid var(--line);border-radius:18px;overflow:hidden}.menu-list a{display:flex;justify-content:space-between;padding:16px;border-bottom:1px solid var(--line)}.menu-list a:last-child{border:0}
.toast{position:fixed;left:50%;bottom:90px;transform:translate(-50%,20px);background:#111827;color:#fff;padding:11px 16px;border-radius:12px;font-size:12px;opacity:0;pointer-events:none;transition:.2s;z-index:99}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:800px){body{background:#fff}.shell{padding:0 12px}.desktop-only{display:none!important}.mobile-only{display:grid}.header{height:62px;gap:8px}.brand b{font-size:15px}.brand small{font-size:8px}.brand img{width:31px}.head-actions{gap:6px}.icon-btn{height:36px;min-width:36px;border:0}.search{order:3;flex-basis:100%;width:100%}.topbar .shell{display:flex;flex-wrap:wrap}.topbar{padding-bottom:8px}.header{height:auto;padding:8px 0}.search input{height:38px}.search button{display:none}.hero{margin-top:12px;min-height:0;border-radius:18px}.hero-inner{grid-template-columns:1fr;padding:22px 18px 12px}.hero h1{font-size:28px;max-width:260px;margin:6px 0 8px}.hero p{font-size:12px;max-width:245px}.eyebrow{font-size:9px}.hero-art{position:absolute;right:-28px;bottom:5px;width:58%;opacity:.95}.hero-art img{max-width:290px}.hero .btn{height:38px;font-size:12px;padding:0 14px}.hero-pills{margin-top:18px;gap:6px;max-width:62%}.hero-pill{font-size:9px;padding:6px 7px}.quick-benefits{grid-template-columns:repeat(3,1fr);gap:7px;margin:10px 0 22px}.benefit{padding:9px 6px;display:block;text-align:center;font-size:9px}.benefit:nth-child(n+4){display:none}.benefit .i{margin:0 auto 5px;width:29px;height:29px}.section{margin:22px 0}.section h2{font-size:19px}.section-head{margin-bottom:11px}.categories{grid-template-columns:repeat(4,1fr);gap:8px}.category{padding:8px 5px;border-radius:14px}.category .pic{height:58px;margin-bottom:7px}.category img{max-height:52px}.category b{font-size:9px}.brand-strip{display:flex;overflow:auto;gap:0;padding:8px}.brand-pill{min-width:96px;height:40px;font-size:14px}.promo-grid{grid-template-columns:1fr}.promo{min-height:145px;padding:17px}.promo:nth-child(n+2){display:none}.promo h3{font-size:18px}.products{grid-template-columns:repeat(2,1fr);gap:8px}.product{padding:8px;border-radius:14px}.product .visual{height:125px}.product .visual img{max-height:116px}.product h3{font-size:12px}.spec{font-size:9px}.rating{font-size:9px}.price{font-size:15px}.product .btn{height:36px;font-size:11px}.solution-banner{padding:20px 16px;border-radius:17px}.solution-banner h3{font-size:20px}.solution-banner p{font-size:11px}.footer{display:none}.bottom-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;bottom:0;left:0;right:0;z-index:30;background:rgba(255,255,255,.97);backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:7px 4px calc(7px + env(safe-area-inset-bottom))}.bottom-nav a{text-align:center;font-size:9px;color:#667085}.bottom-nav a span{display:block;font-size:20px;line-height:22px}.bottom-nav a.active{color:var(--blue);font-weight:700}.page-title{margin:16px 0}.page-title h1{font-size:21px}.catalog-layout{display:block}.filters{display:none;position:fixed;inset:0;z-index:50;border:0;border-radius:0;background:#fff;padding:20px;overflow:auto}.filters.open{display:block}.filter-open{display:inline-flex}.catalog-products{grid-template-columns:1fr;gap:9px}.catalog-products .product{display:grid;grid-template-columns:110px 1fr 42px;gap:9px;align-items:center}.catalog-products .product .visual{height:95px;grid-row:1/5}.catalog-products .product .tag{top:8px;left:8px}.catalog-products .product .heart{display:none}.catalog-products .product h3{margin:0}.catalog-products .product .spec{min-height:0}.catalog-products .product .rating{display:none}.catalog-products .product .btn{width:38px;padding:0;grid-column:3;grid-row:1/5}.sortbar{font-size:11px}.sortbar select{height:34px;font-size:11px}.product-page{grid-template-columns:1fr;gap:18px;margin-top:14px}.gallery-main{height:310px}.gallery-main img{max-height:270px}.product-info h1{font-size:23px}.facts{grid-template-columns:repeat(4,1fr);gap:6px}.fact{padding:9px 5px}.fact b{font-size:13px}.fact small{font-size:8px}.big-price{font-size:25px}.cart-item{grid-template-columns:80px 1fr;gap:9px}.cart-item img{width:80px;height:70px}.cart-item>.qty{grid-column:2}.checkout .btn{width:100%}.profile-card{grid-template-columns:62px 1fr}.avatar{width:56px;height:56px}.menu-list a{padding:15px;font-size:13px}}

/* FastAPI marketplace additions */
.notice{padding:12px 14px;border-radius:14px;background:#eff6ff;color:#174ea6;margin:12px 0;font-size:14px}.muted{color:#667085}.form-card{background:#fff;border:1px solid #e8edf4;border-radius:20px;padding:20px;box-shadow:0 10px 30px rgba(16,24,40,.06)}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field{display:flex;flex-direction:column;gap:6px}.field.full{grid-column:1/-1}.field label{font-size:13px;font-weight:700;color:#344054}.field input,.field textarea,.field select{width:100%;border:1px solid #d0d5dd;border-radius:12px;padding:12px 13px;font:inherit;background:white}.field textarea{min-height:90px;resize:vertical}.auth-wrap{max-width:480px;margin:38px auto 100px}.auth-tabs{display:flex;gap:8px;margin-bottom:16px}.auth-tabs button{flex:1}.dashboard{display:grid;grid-template-columns:230px 1fr;gap:18px;margin:22px auto 100px}.sidepanel{background:#fff;border:1px solid #e8edf4;border-radius:18px;padding:14px;height:max-content;position:sticky;top:88px}.sidepanel a{display:block;padding:11px 12px;border-radius:11px;color:#344054;margin:3px 0}.sidepanel a:hover{background:#f2f4f7}.panel{background:#fff;border:1px solid #e8edf4;border-radius:18px;padding:18px;overflow:auto}.stat-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:16px}.stat{background:#fff;border:1px solid #e8edf4;border-radius:16px;padding:16px}.stat b{display:block;font-size:24px;margin-top:5px}.table{width:100%;border-collapse:collapse;min-width:680px}.table th,.table td{padding:11px 10px;text-align:left;border-bottom:1px solid #eef2f6;font-size:14px}.table th{font-size:12px;color:#667085;text-transform:uppercase}.pill{display:inline-flex;padding:5px 9px;border-radius:999px;background:#eef4ff;color:#175cd3;font-size:12px;font-weight:700}.seller-tools{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px}.role-link{font-size:13px;color:#175cd3;font-weight:700}.empty{padding:34px;text-align:center;color:#667085}.order-card{border:1px solid #e8edf4;border-radius:16px;padding:15px;margin:10px 0}.order-top{display:flex;justify-content:space-between;gap:12px}.checkout{display:grid;grid-template-columns:1fr 360px;gap:18px}.summary{background:#fff;border:1px solid #e8edf4;border-radius:18px;padding:18px;height:max-content}.api-error{background:#fef3f2;color:#b42318;padding:10px 12px;border-radius:10px;margin:8px 0}.api-ok{background:#ecfdf3;color:#067647;padding:10px 12px;border-radius:10px;margin:8px 0}
@media(max-width:900px){.dashboard{grid-template-columns:1fr}.sidepanel{position:static;display:flex;overflow:auto;gap:6px}.sidepanel a{white-space:nowrap}.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.checkout{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}}
@media(max-width:640px){.auth-wrap{margin:18px auto 90px;padding:0 12px}.dashboard{margin-top:12px}.panel{border-radius:14px;padding:13px}.stat-grid{grid-template-columns:1fr 1fr}.stat{padding:13px}.stat b{font-size:20px}.seller-tools{align-items:flex-start;flex-direction:column}.checkout{gap:10px}}

/* === Motion system / animations === */
@keyframes pageRise{from{opacity:.01;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes heroFloat{0%,100%{transform:translate3d(0,0,0) rotate(-1deg)}50%{transform:translate3d(0,-14px,0) rotate(1deg)}}
@keyframes heroGlow{0%,100%{transform:translate3d(-8%,-4%,0) scale(1);opacity:.5}50%{transform:translate3d(10%,8%,0) scale(1.18);opacity:.9}}
@keyframes shine{0%{transform:translateX(-160%) skewX(-18deg)}100%{transform:translateX(320%) skewX(-18deg)}}
@keyframes badgePop{0%{transform:scale(.72)}45%{transform:scale(1.28)}100%{transform:scale(1)}}
@keyframes iconBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes addSuccess{0%{transform:scale(1)}30%{transform:scale(.94)}60%{transform:scale(1.06)}100%{transform:scale(1)}}
@keyframes toastIn{0%{opacity:0;transform:translate(-50%,18px) scale(.92)}65%{transform:translate(-50%,-3px) scale(1.02)}100%{opacity:1;transform:translate(-50%,0) scale(1)}}
@keyframes navBounce{0%,100%{transform:translateY(0)}45%{transform:translateY(-4px)}}
@keyframes softPulse{0%,100%{box-shadow:0 0 0 0 rgba(18,100,244,0)}50%{box-shadow:0 0 0 8px rgba(18,100,244,.08)}}

body.motion-ready main,body.motion-ready .topbar{animation:pageRise .5s cubic-bezier(.2,.8,.2,1) both}
.topbar{transition:box-shadow .3s ease,background .3s ease,border-color .3s ease}
.topbar.scrolled{background:rgba(255,255,255,.9);box-shadow:0 12px 35px rgba(16,24,40,.08);border-color:rgba(232,237,244,.7)}

.scroll-progress{position:fixed;left:0;top:0;height:3px;width:0;background:linear-gradient(90deg,#1264f4,#5ca4ff,#8b5cf6);z-index:100;transform-origin:left center;box-shadow:0 0 12px rgba(18,100,244,.45);transition:width .08s linear}

.hero::before{content:"";position:absolute;width:430px;height:430px;border-radius:50%;right:4%;top:-46%;background:radial-gradient(circle,rgba(41,137,255,.34),rgba(41,137,255,0) 68%);filter:blur(4px);pointer-events:none;animation:heroGlow 7s ease-in-out infinite}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 0 42%,rgba(255,255,255,.045) 49%,transparent 56%);transform:translateX(-120%);animation:shine 7s ease-in-out 1.2s infinite;pointer-events:none}
.hero-inner{position:relative;z-index:1}
.hero .eyebrow{animation:pageRise .55s .08s both}.hero h1{animation:pageRise .6s .15s both}.hero p{animation:pageRise .6s .23s both}.hero .btn{animation:pageRise .6s .31s both}.hero-pills{animation:pageRise .6s .38s both}.hero-art img{animation:heroFloat 5.4s ease-in-out infinite;will-change:transform}
.hero-pill{transition:transform .25s ease,background .25s ease,border-color .25s ease}.hero-pill:hover{transform:translateY(-2px);background:rgba(255,255,255,.11);border-color:rgba(255,255,255,.24)}

.btn{position:relative;overflow:hidden;isolation:isolate;transition:transform .18s ease,box-shadow .25s ease,background .25s ease}.btn::after{content:"";position:absolute;top:-40%;bottom:-40%;width:34px;left:-60px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent);transform:skewX(-18deg);transition:left .55s ease;z-index:-1}.btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(18,100,244,.2)}.btn:hover::after{left:calc(100% + 50px)}.btn:active{transform:scale(.97)}.btn.cart-success{animation:addSuccess .46s ease}.btn.cart-success::before{content:"✓";position:absolute;inset:0;display:grid;place-items:center;background:var(--green);color:#fff;font-size:18px;z-index:3}
.icon-btn,.search input,.search button{transition:transform .2s ease,box-shadow .25s ease,border-color .25s ease,background .25s ease}.icon-btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(16,24,40,.08)}.search input:focus{border-color:#9fc0ff;background:#fff;box-shadow:0 0 0 4px rgba(18,100,244,.09)}.search button:hover{transform:scale(1.03)}
.icon-btn .badge.bump{animation:badgePop .42s cubic-bezier(.22,1.3,.36,1)}

.reveal{opacity:0;transform:translateY(22px) scale(.985);transition:opacity .62s cubic-bezier(.2,.7,.2,1),transform .62s cubic-bezier(.2,.7,.2,1);transition-delay:var(--delay,0ms);will-change:opacity,transform}.reveal.from-left{transform:translateX(-24px)}.reveal.from-right{transform:translateX(24px)}.reveal.is-visible{opacity:1;transform:none}

.benefit,.category,.brand-pill,.product,.promo,.stat,.order-card,.form-card,.panel,.cart-item,.fact,.thumb{transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease,border-color .25s ease,background .25s ease}
.benefit:hover,.category:hover,.stat:hover,.order-card:hover{transform:translateY(-4px);box-shadow:0 14px 32px rgba(24,39,75,.09);border-color:#d9e5f7}.benefit:hover .i{animation:iconBob .65s ease}
.category:hover .pic img{transform:scale(1.08) translateY(-2px)}.category .pic img{transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.brand-pill:hover{transform:scale(1.05);background:#fafcff}.brand-pill{cursor:default}
.product{overflow:hidden}.product:hover{transform:translateY(-5px);box-shadow:0 18px 38px rgba(24,39,75,.12);border-color:#d7e4f6}.product .visual{overflow:hidden;position:relative}.product .visual::after{content:"";position:absolute;inset:-40%;background:linear-gradient(110deg,transparent 42%,rgba(255,255,255,.9) 50%,transparent 58%);transform:translateX(-70%);opacity:0;transition:transform .55s ease,opacity .25s ease}.product:hover .visual::after{transform:translateX(70%);opacity:.7}.product .visual img{transition:transform .36s cubic-bezier(.2,.8,.2,1),filter .36s ease}.product:hover .visual img{transform:scale(1.07) translateY(-3px);filter:drop-shadow(0 12px 13px rgba(17,24,39,.13))}.heart{transition:transform .2s ease,color .2s ease}.heart:hover{transform:scale(1.18);color:#ef4444}.tag{animation:softPulse 2.4s ease-in-out infinite}

.solution-banner{position:relative;overflow:hidden}.solution-banner::after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-90px;top:-100px;background:radial-gradient(circle,rgba(92,164,255,.3),transparent 68%);animation:heroGlow 7.5s ease-in-out infinite;pointer-events:none}.solution-banner>*{position:relative;z-index:1}
.gallery-main img{transition:transform .4s cubic-bezier(.2,.8,.2,1),filter .35s ease;animation:heroFloat 6s ease-in-out infinite}.gallery-main:hover img{transform:scale(1.04);filter:drop-shadow(0 16px 20px rgba(17,24,39,.15))}.thumb:hover{transform:translateY(-3px);border-color:#a9c6f8}.qty button:active{transform:scale(.88)}

.toast{position:fixed;left:50%;bottom:92px;z-index:200;background:#111827;color:#fff;padding:12px 16px;border-radius:13px;box-shadow:0 12px 30px rgba(0,0,0,.18);opacity:0;pointer-events:none;transform:translate(-50%,16px);transition:opacity .2s ease,transform .2s ease;white-space:nowrap;max-width:calc(100vw - 32px);font-size:13px}.toast.show{opacity:1;transform:translate(-50%,0);animation:toastIn .32s ease both}
.bottom-nav a,.bottom-nav a span{transition:color .2s ease,transform .2s ease}.bottom-nav a:active span{transform:scale(.85)}.bottom-nav a.active span{animation:navBounce 1.8s ease-in-out infinite}

@media(max-width:640px){
  .hero::before{width:260px;height:260px;right:-8%;top:-30%}.hero-art img{animation-duration:4.6s}.reveal{transform:translateY(14px);transition-duration:.5s}.product:active,.category:active,.benefit:active{transform:scale(.98)}.product:hover{transform:none;box-shadow:none}.product:active{box-shadow:0 10px 22px rgba(24,39,75,.1)}.category:hover,.benefit:hover{transform:none;box-shadow:none}.brand-pill:hover{transform:none}.btn:hover{transform:none;box-shadow:none}.btn:active{transform:scale(.96)}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}.reveal{opacity:1!important;transform:none!important}.scroll-progress{display:none}
}

/* === Catalog + lead model === */
.hero-actions{display:flex;gap:10px;flex-wrap:wrap}.btn.ghost{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);color:#fff}.price-note{font-size:11px;color:var(--muted);line-height:1.5}.product-price{font-size:28px}.contact-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.contact-card{border:1px solid var(--line);border-radius:16px;padding:16px;display:flex;align-items:center;gap:12px;transition:.25s;background:#fff}.contact-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.contact-card>span{width:42px;height:42px;border-radius:13px;background:#eaf2ff;color:var(--blue);display:grid;place-items:center;font-size:20px}.contact-card b{display:block}.contact-card small{color:var(--muted);display:block;margin-top:3px}.contact-hidden{display:none!important}.direct-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.contact-chip{border:1px solid var(--line);border-radius:999px;padding:9px 13px;font-size:12px;font-weight:700;color:#175cd3;background:#fff}.back-link{display:inline-block;margin-top:20px;color:var(--muted);font-size:13px}.direct-contact-box{border-top:1px solid var(--line);margin-top:16px;padding-top:14px;display:grid;gap:8px}.direct-contact-box a{color:var(--blue);font-weight:700;font-size:13px}.nav-badge{font-style:normal;position:absolute;top:2px;margin-left:-6px;background:var(--red);color:#fff;border-radius:99px;min-width:16px;height:16px;line-height:16px;font-size:8px}.bottom-nav a{position:relative}.mini-btn{border:1px solid var(--line);background:#fff;color:#344054;border-radius:9px;padding:7px 10px;cursor:pointer;font-size:12px}.table select{border:1px solid var(--line);border-radius:9px;padding:7px;background:#fff}.muted{color:var(--muted);font-size:12px;line-height:1.5}.summary .btn{width:100%}
@media(max-width:800px){.bottom-nav{grid-template-columns:repeat(4,1fr)}.contact-grid{grid-template-columns:1fr 1fr}.hero-actions .btn{flex:0 0 auto}.hero-actions .btn.ghost{background:rgba(255,255,255,.08)}.solution-banner{display:block}.solution-banner .btn{margin-top:14px}.section-head>div{max-width:75%}}
@media(max-width:480px){.contact-grid{grid-template-columns:1fr 1fr}.contact-card{padding:12px}.contact-card>span{width:36px;height:36px}.contact-card b{font-size:12px}.contact-card small{font-size:9px}.buy-row{display:grid;grid-template-columns:1fr}.section-head>div{max-width:100%}}

.catalog-typebar{display:flex;justify-content:flex-end;margin:14px 0}.catalog-typebar select{min-width:240px;height:42px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:0 12px;color:var(--text);font:inherit}.catalog-typebar select:focus{outline:2px solid rgba(38,111,241,.16);border-color:var(--blue)}@media(max-width:640px){.catalog-typebar{justify-content:stretch}.catalog-typebar select{width:100%;min-width:0}}


/* === 2026 realistic storefront + clickable brand filters === */
body{
  background:
    radial-gradient(circle at 18% -10%,rgba(18,100,244,.055),transparent 29rem),
    linear-gradient(180deg,#ffffff 0,#f7f9fc 56%,#ffffff 100%);
}
.topbar{background:rgba(255,255,255,.9)}
.hero{
  min-height:390px;
  background:linear-gradient(105deg,#07111f 0%,#0a1728 50%,#0d2034 100%);
  box-shadow:0 24px 55px rgba(3,14,31,.18);
}
.hero-inner{grid-template-columns:.92fr 1.08fr;padding:46px 46px 42px}
.hero-photo{
  min-height:305px;
  border-radius:24px;
  background-image:
    linear-gradient(90deg,rgba(7,16,29,.05),rgba(7,16,29,0)),
    url('/assets/realistic/hero-security.jpg');
  background-size:cover;
  background-position:center;
  box-shadow:0 26px 55px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.08);
  transform:perspective(900px) rotateY(-2deg);
  animation:heroPhotoFloat 6.5s ease-in-out infinite;
}
@keyframes heroPhotoFloat{0%,100%{transform:perspective(900px) rotateY(-2deg) translateY(0)}50%{transform:perspective(900px) rotateY(-1deg) translateY(-7px)}}
.hero::after{opacity:.5}
.quick-benefits{margin-top:18px}
.benefit{box-shadow:0 8px 24px rgba(16,24,40,.035)}
.section-subtitle{margin:5px 0 0;color:var(--muted);font-size:12px}
.category{
  border:1px solid rgba(222,229,239,.95);
  box-shadow:0 10px 26px rgba(18,32,55,.045);
  padding:10px;
}
.category .pic{
  height:104px;
  background:linear-gradient(180deg,#fff,#f4f7fb);
  overflow:hidden;
  border-radius:14px;
}
.category img{
  width:100%;
  height:100%;
  max-width:none;
  max-height:none;
  object-fit:cover;
  mix-blend-mode:multiply;
}
.category:hover .pic img{transform:scale(1.045)}
.brand-strip{
  border:0;
  padding:0;
  gap:12px;
  background:transparent;
}
.brand-pill{
  position:relative;
  min-height:106px;
  height:auto;
  border:1px solid #e5ebf3!important;
  border-radius:20px;
  background:linear-gradient(145deg,#fff,#f8faff);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  padding:18px 20px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(18,32,55,.045);
  cursor:pointer;
}
.brand-pill::after{
  content:"";
  position:absolute;
  width:120px;height:120px;border-radius:50%;
  right:-65px;top:-55px;
  background:currentColor;
  opacity:.055;
  transition:transform .3s ease,opacity .3s ease;
}
.brand-pill:hover::after{transform:scale(1.25);opacity:.09}
.brand-pill:hover{transform:translateY(-4px) scale(1.01);background:#fff;box-shadow:0 18px 38px rgba(18,32,55,.11)}
.brand-pill .brand-word{font-size:22px;font-weight:900;letter-spacing:-.7px;line-height:1}
.brand-pill small{font-size:10px;color:#778196;margin-top:9px;font-weight:600}
.brand-pill>b{position:absolute;right:17px;bottom:15px;font-size:18px}
.brand-hikvision{color:#e11d48!important}
.brand-hilook{color:#2563eb!important}
.brand-ezviz{color:#475569!important}

.product{
  border-color:#e3e9f1;
  border-radius:21px;
  padding:10px 10px 12px;
  box-shadow:0 9px 26px rgba(16,24,40,.04);
}
.product .visual{
  height:176px;
  border-radius:17px;
  background:#fff;
  border:1px solid #eef2f7;
}
.product .visual img{
  width:100%;height:100%;
  max-width:none;max-height:none;
  object-fit:contain;
  border-radius:16px;
}
.product-brand{
  margin-top:10px;
  width:max-content;
  max-width:100%;
  font-size:9px;
  font-weight:900;
  letter-spacing:.5px;
  text-transform:uppercase;
  padding:5px 7px;
  border-radius:999px;
  background:#f2f5f9;
  color:#667085;
}
.product-brand.brand-hikvision{background:#fff0f3;color:#c9143e}
.product-brand.brand-hilook{background:#eef4ff;color:#175cd3}
.product-brand.brand-ezviz{background:#f2f4f7;color:#344054}
.product h3{font-size:13px;margin-top:8px}
.product .price{letter-spacing:-.3px}
.product .btn{border-radius:11px}

.catalog-filter-panel{
  margin:16px 0 18px;
  padding:16px;
  border:1px solid #e3e9f1;
  border-radius:20px;
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(10px);
  box-shadow:0 12px 30px rgba(16,24,40,.045);
}
.filter-label{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:#98a2b3;font-weight:800;margin:0 0 8px}
.catalog-brandbar{display:flex;gap:8px;overflow:auto;padding-bottom:12px;margin-bottom:10px;border-bottom:1px solid #edf1f6;scrollbar-width:none}
.catalog-brandbar::-webkit-scrollbar{display:none}
.catalog-brand-chip{
  flex:0 0 auto;
  border:1px solid #dfe6ef;
  background:#fff;
  color:#475467;
  border-radius:999px;
  height:38px;
  padding:0 15px;
  font-weight:800;
  font-size:12px;
  cursor:pointer;
  transition:.2s ease;
}
.catalog-brand-chip:hover{transform:translateY(-1px);box-shadow:0 7px 18px rgba(16,24,40,.08)}
.catalog-brand-chip.active{background:#101828;color:#fff;border-color:#101828;box-shadow:0 8px 20px rgba(16,24,40,.16)}
.catalog-brand-chip.brand-hikvision.active{background:#e11d48;border-color:#e11d48}
.catalog-brand-chip.brand-hilook.active{background:#2563eb;border-color:#2563eb}
.catalog-brand-chip.brand-ezviz.active{background:#475569;border-color:#475569}
.catalog-filter-panel .catalog-typebar{justify-content:flex-start;margin:0}
.catalog-filter-panel .catalog-typebar select{min-width:280px;background:#fff}
.catalog-result-head{display:flex;align-items:center;justify-content:space-between;margin:4px 0 12px}
.catalog-result-head>b{font-size:15px}
.catalog-reset{border:0;background:transparent;color:#667085;font-size:11px;font-weight:700;cursor:pointer;padding:7px}
.notice{border-radius:15px;background:#eef6ff!important;border:1px solid #d9eaff!important;color:#344054}

.gallery-main{background:#fff;box-shadow:0 16px 36px rgba(16,24,40,.05)}
.gallery-main img{object-fit:contain}

@media(max-width:800px){
  body{background:linear-gradient(180deg,#fff 0,#f7f9fc 55%,#fff 100%)}
  .hero{min-height:360px}
  .hero-inner{grid-template-columns:1fr;padding:22px 17px 16px}
  .hero-photo{
    position:relative;
    right:auto;bottom:auto;
    width:100%;
    min-height:175px;
    margin-top:12px;
    border-radius:18px;
    background-position:center 43%;
    transform:none;
    animation:heroMobileFloat 6s ease-in-out infinite;
  }
  @keyframes heroMobileFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
  .hero-art{opacity:1}
  .hero-pills{max-width:100%}
  .categories{grid-template-columns:repeat(3,1fr)}
  .category .pic{height:82px}
  .brand-strip{display:grid;grid-template-columns:repeat(2,1fr);overflow:visible;gap:8px;padding:0}
  .brand-pill{min-width:0;min-height:88px;height:auto;padding:13px 14px}
  .brand-pill .brand-word{font-size:17px}
  .brand-pill small{font-size:8px}
  .brand-pill>b{right:12px;bottom:11px}
  .products{grid-template-columns:repeat(2,1fr)}
  .product .visual{height:136px}
  .catalog-filter-panel{padding:12px;margin-top:11px}
  .catalog-brandbar{gap:7px}
  .catalog-brand-chip{height:36px;padding:0 13px;font-size:11px}
  .catalog-filter-panel .catalog-typebar select{width:100%;min-width:0}
}
@media(max-width:430px){
  .categories{grid-template-columns:repeat(3,1fr)}
  .category{padding:7px}
  .category .pic{height:74px}
  .brand-pill{min-height:84px}
  .brand-pill .brand-word{font-size:16px}
  .product .visual{height:128px}
  .product-brand{font-size:8px}
}


/* Master Admin animated 3D logo */
.animated-brand-logo{position:relative;width:42px;height:42px;flex:0 0 42px;display:block;overflow:hidden;border-radius:12px;background:#06111f;box-shadow:0 8px 20px rgba(28,110,255,.22),inset 0 0 0 1px rgba(123,190,255,.16);isolation:isolate}
.animated-brand-logo::after{content:"";position:absolute;inset:-35%;background:radial-gradient(circle,rgba(69,147,255,.24),transparent 60%);animation:logoHalo 3.4s ease-in-out infinite;pointer-events:none}
.animated-brand-logo video,.animated-brand-logo img{position:relative;z-index:1;width:100%;height:100%;display:block;object-fit:cover}
.brand-logo-static::after{display:none}
@keyframes logoHalo{0%,100%{transform:scale(.82);opacity:.55}50%{transform:scale(1.2);opacity:1}}
.hero-logo-mark{position:absolute;right:18px;bottom:18px;width:122px;height:146px;padding:8px 8px 9px;border:1px solid rgba(126,194,255,.22);border-radius:22px;background:rgba(4,14,27,.72);backdrop-filter:blur(12px);box-shadow:0 18px 45px rgba(0,0,0,.36),0 0 35px rgba(39,124,255,.18);overflow:hidden;z-index:2;animation:masterLogoFloat 5.5s ease-in-out infinite}
.hero-logo-mark video{width:106px;height:106px;border-radius:16px;display:block;object-fit:cover}
.hero-logo-mark span{display:block;margin-top:7px;text-align:center;color:#dfeeff;font-size:9px;font-weight:900;letter-spacing:1.5px;text-shadow:0 0 12px rgba(69,151,255,.55)}
@keyframes masterLogoFloat{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-8px) rotate(1deg)}}
@media(max-width:800px){.animated-brand-logo{width:36px;height:36px;flex-basis:36px;border-radius:10px}.brand img{display:none}.hero-logo-mark{right:10px;bottom:10px;width:82px;height:99px;padding:5px;border-radius:15px}.hero-logo-mark video{width:70px;height:70px;border-radius:11px}.hero-logo-mark span{font-size:6px;letter-spacing:.8px;margin-top:5px}}
@media(prefers-reduced-motion:reduce){.animated-brand-logo::after,.hero-logo-mark{animation:none}}

/* === 2026-09 bilingual + light/dark storefront refresh === */
:root{--bg:#f7f9fc;--surface:#ffffff;--surface2:#f3f6fb;--text:#101828;--text-soft:#667085;--header-bg:rgba(255,255,255,.9);--card-line:#e4eaf2;--input-bg:#fff;--phone:#16a34a}
html[data-theme="dark"]{--bg:#080f1c;--surface:#0f1928;--surface2:#121f31;--text:#f3f7fd;--text-soft:#9eacc0;--header-bg:rgba(8,15,28,.88);--card-line:#223148;--line:#223148;--soft:#121f31;--ink:#f3f7fd;--muted:#9eacc0;--shadow:0 16px 38px rgba(0,0,0,.28)}
body{background:var(--bg);color:var(--text);transition:background .25s ease,color .25s ease}.topbar{background:var(--header-bg);border-color:var(--card-line)}
.search input,.field input,.field textarea,.field select,.catalog-typebar select{background:var(--input-bg);color:var(--text);border-color:var(--card-line)}
html[data-theme="dark"] .search input,html[data-theme="dark"] .field input,html[data-theme="dark"] .field textarea,html[data-theme="dark"] .field select,html[data-theme="dark"] .catalog-typebar select{background:#111d2d;color:#f4f7fb}
html[data-theme="dark"] .icon-btn,html[data-theme="dark"] .category,html[data-theme="dark"] .product,html[data-theme="dark"] .benefit,html[data-theme="dark"] .contact-card,html[data-theme="dark"] .form-card,html[data-theme="dark"] .summary,html[data-theme="dark"] .catalog-filter-panel,html[data-theme="dark"] .gallery-main{background:var(--surface);border-color:var(--card-line);color:var(--text)}
html[data-theme="dark"] .category .pic,html[data-theme="dark"] .product .visual{background:linear-gradient(180deg,#132033,#0e1928);border-color:#223148}
html[data-theme="dark"] .product .visual img,html[data-theme="dark"] .category img{mix-blend-mode:normal}
html[data-theme="dark"] .brand-pill{background:linear-gradient(145deg,#101c2c,#0c1726);border-color:#223148!important}
html[data-theme="dark"] .brand-pill:hover{background:#142238}
html[data-theme="dark"] .notice{background:#10233a!important;border-color:#1d3d63!important;color:#d8e8fa!important}
html[data-theme="dark"] .catalog-brand-chip{background:#111d2d;border-color:#26374f;color:#d0d9e6}
html[data-theme="dark"] .catalog-brand-chip.active{background:#e8eef8;color:#101828;border-color:#e8eef8}
html[data-theme="dark"] .footer{border-color:#223148}
html[data-theme="dark"] .bottom-nav{background:rgba(9,16,28,.96);border-color:#223148}
html[data-theme="dark"] .bottom-nav a{color:#9eacc0}html[data-theme="dark"] .bottom-nav a.active{color:#6aa8ff}
html[data-theme="dark"] .contact-chip{background:#101c2c;border-color:#26374f;color:#80b7ff}
html[data-theme="dark"] .old-price{color:#8391a6}

/* transparent animated MA mark in header only */
.animated-brand-logo{width:48px;height:44px;flex:0 0 48px;display:grid;place-items:center;overflow:visible;border:0;border-radius:0;background:transparent!important;box-shadow:none!important;isolation:auto}
.animated-brand-logo::after{display:none!important}.animated-brand-logo img{display:block!important;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 6px 10px rgba(30,112,255,.32));animation:headerLogoFloat 4.4s ease-in-out infinite;transform-origin:center}
@keyframes headerLogoFloat{0%,100%{transform:translateY(0) rotateY(0deg) scale(1)}45%{transform:translateY(-2px) rotateY(10deg) scale(1.035)}70%{transform:translateY(0) rotateY(-6deg) scale(1.015)}}
@media(prefers-reduced-motion:reduce){.animated-brand-logo img{animation:none}}

.lang-switch{height:38px;display:flex;align-items:center;padding:3px;border:1px solid var(--card-line);border-radius:12px;background:var(--surface)}.lang-switch button{border:0;background:transparent;color:var(--text-soft);font-size:11px;font-weight:800;padding:7px 8px;border-radius:8px;cursor:pointer}.lang-switch button.active{background:var(--blue);color:#fff}.theme-btn{font-size:17px}.phone-head{background:var(--phone)!important;color:#fff!important;border-color:transparent!important}.hero-title-main{color:#fff!important}.call-cta{border-color:rgba(255,255,255,.25)!important}.contact-call{background:var(--phone)}
.footer-brand b{font-size:18px;display:block}.footer-brand small{color:var(--text-soft);font-size:10px}.footer p,.footer a{color:var(--text-soft)}
.bottom-nav em{font-style:normal;display:block}.bottom-nav{grid-template-columns:repeat(3,1fr)!important}

.contact-hero{margin:28px 0 10px;min-height:300px;border-radius:28px;padding:42px;display:grid;grid-template-columns:110px 1fr;gap:30px;align-items:center;background:linear-gradient(125deg,#071426,#0c2745);color:#fff;box-shadow:0 24px 55px rgba(3,14,31,.18)}.contact-hero-icon{width:100px;height:100px;border-radius:28px;display:grid;place-items:center;font-size:44px;background:linear-gradient(145deg,#1a8cff,#0d5cda);box-shadow:0 18px 45px rgba(18,100,244,.35)}.contact-hero h1{font-size:42px;margin:5px 0 10px}.contact-hero p{max-width:720px;color:#c7d3e3;line-height:1.6}.contact-phone-big{margin-top:12px;background:#16a34a;font-size:16px}.contact-page-grid{grid-template-columns:repeat(3,1fr)}.phone-primary{border-color:rgba(22,163,74,.3);background:linear-gradient(145deg,#f2fff6,#fff)}html[data-theme="dark"] .phone-primary{background:linear-gradient(145deg,#10261a,#0f1928)}.contact-meta{display:grid;grid-template-columns:1fr 1fr;gap:12px}.contact-meta>div{border:1px solid var(--card-line);border-radius:17px;padding:18px;background:var(--surface)}.contact-meta span{display:block;font-size:11px;color:var(--text-soft);margin-bottom:5px}.contact-meta b{font-size:14px}

@media(max-width:800px){
 .header{gap:7px}.brand{min-width:0}.brand>span:last-child{min-width:0}.brand b{font-size:13px;white-space:nowrap}.brand small{font-size:7px;white-space:nowrap}.animated-brand-logo{width:38px;height:36px;flex-basis:38px}.brand img{display:block!important}
 .head-actions{margin-left:auto}.lang-switch{height:34px}.lang-switch button{padding:6px 7px;font-size:10px}.theme-btn,.phone-head{height:34px;min-width:34px}
 .search{order:3;flex-basis:100%}.topbar{padding-bottom:6px}.hero-title-main{display:block}.contact-hero{margin-top:14px;grid-template-columns:1fr;padding:24px 18px;text-align:center}.contact-hero-icon{width:72px;height:72px;border-radius:21px;font-size:32px;margin:0 auto}.contact-hero h1{font-size:28px}.contact-hero p{font-size:13px}.contact-phone-big{width:100%;font-size:13px}.contact-page-grid{grid-template-columns:1fr}.contact-meta{grid-template-columns:1fr}.bottom-nav{grid-template-columns:repeat(3,1fr)!important}
}
@media(max-width:430px){.brand small{display:none}.lang-switch button{padding:5px 6px}.head-actions{gap:4px}.animated-brand-logo{width:34px;height:32px;flex-basis:34px}.contact-grid{grid-template-columns:1fr 1fr}.contact-page-grid{grid-template-columns:1fr}.phone-primary{grid-column:1/-1}}


/* === Premium SVG icon system === */
.ui-icon{width:20px;height:20px;display:inline-block;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}.icon-btn .ui-icon{width:19px;height:19px}.btn .ui-icon{width:18px;height:18px}.benefit .i{background:linear-gradient(145deg,#eef5ff,#e2edff);border:1px solid rgba(18,100,244,.08);box-shadow:0 6px 16px rgba(18,100,244,.08)}.benefit .i .ui-icon{width:17px;height:17px}.contact-icon{width:40px;height:40px;border-radius:12px;display:grid!important;place-items:center;background:linear-gradient(145deg,#eef5ff,#e5efff);color:var(--blue);border:1px solid rgba(18,100,244,.09);flex:0 0 40px}.contact-icon .ui-icon{width:19px;height:19px}.phone-primary .contact-icon{background:linear-gradient(145deg,#eafff0,#dff8e7);color:#15803d;border-color:rgba(22,163,74,.12)}.contact-hero-icon .ui-icon{width:46px;height:46px}.bottom-nav .ui-icon{width:21px;height:21px}.direct-row .ui-icon{width:16px;height:16px}.theme-btn{font-size:0}.phone-head{font-size:0}.brand-strip{grid-template-columns:repeat(3,1fr)}
html[data-theme="dark"] .benefit .i,html[data-theme="dark"] .contact-icon{background:linear-gradient(145deg,#14263f,#102037);border-color:#243a57}html[data-theme="dark"] .phone-primary .contact-icon{background:linear-gradient(145deg,#153522,#11291b);color:#62d78a;border-color:#205737}
@media(max-width:800px){.brand-strip{grid-template-columns:repeat(3,1fr)}.contact-icon{width:36px;height:36px;flex-basis:36px;border-radius:11px}.contact-icon .ui-icon{width:18px;height:18px}}
@media(max-width:520px){.brand-strip{grid-template-columns:1fr}.brand-pill{min-height:70px}}

/* Unified 1:1 product photographs, with the original device kept fully visible. */
.product .visual{position:relative;aspect-ratio:1/1;height:auto;width:100%;overflow:hidden;background:#fff;border:1px solid #edf0f4;isolation:isolate}
.product .visual img{position:absolute;inset:0;width:100%;height:100%;padding:9% 6% 16%;object-fit:contain;max-width:none;max-height:none;border-radius:0;transition:transform .22s ease}
.product:hover .visual img{transform:scale(1.025)}
.photo-signature{position:absolute;left:12px;bottom:12px;color:#89939f;font-size:8px;font-weight:800;letter-spacing:1.4px;line-height:1;pointer-events:none}
.photo-kind{position:absolute;right:9px;bottom:9px;padding:4px 6px;border:1px solid #e4e8ed;border-radius:6px;background:rgba(255,255,255,.96);color:#6b7380;font-size:8px;font-weight:600;line-height:1.2}
.product-card-meta{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:11px;min-width:0;flex-wrap:wrap}
.product-card-meta .product-brand{margin:0;max-width:100%;white-space:normal}
.product-card-meta .tag{position:static;font-size:8px;max-width:100%;font-weight:650;border-radius:6px;line-height:1.3}
.product-card-meta .availability-tag{color:var(--text-soft);background:var(--soft);border:1px solid var(--card-line)}
.product h3{font-size:13px;line-height:1.45;overflow-wrap:anywhere;margin:10px 0 7px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}
.product .spec{line-height:1.6;min-height:36px;margin-bottom:12px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.product .price{margin-top:auto}
.product .btn{flex-shrink:0;margin-top:0}
.product-detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:36px;align-items:start}
.product-gallery,.product-info{min-width:0}
.product-image{position:relative;width:100%;aspect-ratio:1/1;height:auto;min-height:0;background:#fff;overflow:hidden;border:1px solid var(--card-line);border-radius:24px;box-shadow:0 12px 35px rgba(20,35,60,.035)}
.product-image img{width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;padding:8%;display:block}
.product-photo-note{font-size:12px;line-height:1.6;color:var(--text-soft);margin:12px 2px 0}
.product-photo-note[hidden]{display:none}
[data-p-desc]{white-space:pre-line;font-size:14px;line-height:1.75;overflow-wrap:anywhere}
.product-info h1{overflow-wrap:anywhere;font-size:clamp(23px,2.3vw,31px);line-height:1.28;margin:8px 0 13px}
.product-info .product-price{font-size:30px;margin-top:18px}
@media(max-width:800px){body{padding-bottom:80px}.product .visual{height:auto}.product-image{height:auto;aspect-ratio:1/1}.product-detail{grid-template-columns:minmax(0,1fr);gap:24px}}
@media(max-width:430px){.product .visual{height:auto}.photo-signature{font-size:6px;letter-spacing:.8px;left:8px;bottom:10px}.photo-kind{font-size:7px;right:6px;bottom:6px;padding:3px 4px}.product h3{font-size:12px}.product .spec{font-size:10px}}
@media(prefers-reduced-motion:reduce){.product .visual img{transition:none}}

/* SEO/service additions */
.breadcrumbs{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:22px 0 0;font-size:12px;color:var(--muted)}.breadcrumbs a{color:var(--blue)}.related-section{margin-top:8px}.service-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.service-links a{padding:10px 13px;border:1px solid var(--line);border-radius:999px;background:var(--card);font-size:12px;font-weight:700}.service-hero{margin:34px 0 20px;padding:44px;border-radius:26px;background:linear-gradient(135deg,#07111f,#102942);color:#fff}.service-hero h1{font-size:clamp(30px,5vw,56px);max-width:900px;margin:8px 0 16px}.service-hero p{max-width:760px;line-height:1.7}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.service-grid article{padding:22px;border:1px solid var(--line);border-radius:18px;background:var(--card)}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.steps div{padding:18px;border:1px solid var(--line);border-radius:16px;background:var(--card);display:flex;gap:12px;align-items:center}.steps b{width:34px;height:34px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center}details{border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin:10px 0;background:var(--card)}summary{font-weight:800;cursor:pointer}@media(max-width:800px){.service-hero{padding:28px 20px}.service-grid,.steps{grid-template-columns:1fr}}