:root{--cg:16px;--cols:6}

html body .section > .container{container-type:inline-size}

html body :is(.product-card, .product-card-site){
  cursor:pointer;
  display:flex;flex-direction:column;height:100%;position:relative;
  border-radius:12px;overflow:hidden;background:#fff;
  transition:box-shadow .18s,transform .18s;
}
html body :is(.product-card, .product-card-site):hover{
  box-shadow:0 8px 24px rgba(15,35,70,.12);transform:translateY(-2px);
}

html body .product-card-img{
  aspect-ratio:1/1;height:auto;padding:14px;background:#fff;
  display:flex;align-items:center;justify-content:center;
}
html body .product-card-img img{width:100%;height:100%;object-fit:contain}

html body .product-card-body{
  position:relative;flex:1;display:flex;flex-direction:column;
  padding:8px 14px 14px;
}
html body .product-card-cat,
html body .product-card-code{display:none}

html body .product-card-name{
  font-size:14px;font-weight:500;line-height:1.35;color:#1e293b;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  min-height:0;margin:0 0 6px;display:block;
}

html body .product-card-price{
  margin-top:auto;padding-right:48px;min-height:42px;
  display:flex;flex-wrap:wrap;align-content:flex-end;align-items:baseline;
  column-gap:4px;row-gap:0;
}
html body .product-card-price .price-current{
  order:1;font-size:18px;font-weight:700;color:#e11d48;line-height:1.2;white-space:nowrap;
}
html body .product-card-price .price-unit{
  order:2;font-size:12px;color:#94a3b8;margin:0;white-space:nowrap;
}
html body .product-card-price .price-old{
  order:3;flex-basis:100%;font-size:12px;color:#94a3b8;
  text-decoration:line-through;line-height:1.3;
}

html body .product-card-footer{display:none !important}

html body .btn-quickcart{
  position:absolute;right:12px;bottom:12px;
  width:38px;height:38px;border:0;border-radius:50%;
  background:var(--blue,#2563eb);color:#fff;font-size:16px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 12px rgba(37,99,235,.3);
  transition:background .15s,transform .15s;
}
html body .btn-quickcart:hover{transform:scale(1.08)}
html body .btn-quickcart.done{background:#16a34a;box-shadow:0 4px 12px rgba(22,163,74,.3)}
html body .btn-quickcart:disabled{
  background:#e2e8f0;color:#94a3b8;box-shadow:none;cursor:not-allowed;transform:none;
}

html body .badge-discount{
  position:absolute;top:10px;left:10px;right:auto;z-index:2;
  background:#e11d48;color:#fff;font-size:12.5px;font-weight:800;
  padding:4px 9px;border-radius:8px;line-height:1.2;
  box-shadow:0 3px 10px rgba(225,29,72,.3);
}

html body .products-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}

html body .prod-slider{
  display:flex !important;
  flex-wrap:nowrap !important;
  grid-template-columns:none !important;
  grid-auto-columns:auto !important;
  grid-auto-flow:row !important;
  gap:var(--cg) !important;
  align-items:stretch;
  overflow-x:auto;
}
html body .prod-slider > *{margin:0 !important}
html body .prod-slider .product-card-site{
  flex:0 0 calc((100cqw - (var(--cols) - 1) * var(--cg)) / var(--cols)) !important;
  width:calc((100cqw - (var(--cols) - 1) * var(--cg)) / var(--cols)) !important;
  max-width:none !important;
  min-width:0 !important;
}

html body .sec-banner-row .container{
  display:grid;
  grid-template-columns:calc((100% - (var(--cols) - 1) * var(--cg)) / var(--cols)) minmax(0,1fr);
  column-gap:var(--cg);
}
html body .sec-banner-row .sec-header{grid-column:1 / -1;grid-row:1}
html body .sec-banner-row .sec-banner{grid-column:1;grid-row:2}
html body .sec-banner-row .prod-slider-wrap{grid-column:2;grid-row:2;min-width:0}

html body .sec-banner{
  display:block;border-radius:12px;overflow:hidden;background:#eef2f7;
  transition:transform .2s,box-shadow .2s;
}
html body .sec-banner:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(15,35,70,.14)}
html body .sec-banner img{width:100%;height:100%;object-fit:cover;display:block}

html body .cart-empty{padding:48px 24px}
html body .cart-empty > i{font-size:48px;margin-bottom:14px}
html body .cart-empty h3{font-size:17px;margin-bottom:6px}
html body .cart-empty p{font-size:13.5px;margin-bottom:18px}
html body .cart-empty a{
  display:inline-flex !important;align-items:center;gap:7px;
  width:auto !important;height:42px !important;min-height:0 !important;
  padding:0 22px !important;font-size:14px !important;font-weight:600;
  border-radius:10px !important;line-height:1;
}
html body .cart-empty a i{
  font-size:15px !important;display:inline-block !important;
  margin:0 !important;color:inherit !important;
}

.qf-toast{
  position:fixed;right:18px;bottom:20px;z-index:3000;
  background:#16a34a;color:#fff;padding:11px 18px;border-radius:10px;
  font-size:14px;font-weight:600;box-shadow:0 10px 30px rgba(0,0,0,.18);
  display:flex;align-items:center;gap:8px;
  opacity:0;transform:translateY(10px);transition:.22s;pointer-events:none;
}
.qf-toast.show{opacity:1;transform:none}

@media (max-width:1100px){
  :root{--cg:14px;--cols:4}
  html body .products-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
}

@media (max-width:768px){
  :root{--cg:10px;--cols:2}
  html body .products-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}

  html body .product-card-img{padding:10px}
  html body .product-card-body{padding:6px 10px 10px}
  html body .product-card-name{font-size:13px}
  html body .product-card-price{padding-right:40px;min-height:38px}
  html body .product-card-price .price-current{font-size:15.5px}
  html body .btn-quickcart{width:34px;height:34px;font-size:15px;right:9px;bottom:9px}

  html body .sec-banner-row .container{display:flex;flex-direction:column}
  html body .sec-banner-row .sec-header{order:1}
  html body .sec-banner-row .sec-banner{order:2;aspect-ratio:3/1;margin-bottom:12px}
  html body .sec-banner-row .prod-slider-wrap{order:3}
}

html body .breadcrumb-bar{background:#fff;border-bottom:1px solid var(--border,#e2e8f0)}
html body .breadcrumb-inner{
  max-width:1280px;margin:0 auto;padding:12px 24px;
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font-size:13px;color:#94a3b8;
}
html body .breadcrumb-inner a{color:#64748b;display:inline-flex;align-items:center;gap:5px}
html body .breadcrumb-inner a:hover{color:var(--blue,#2563eb)}
html body .breadcrumb-inner .sep{font-size:10px;color:#cbd5e1}
html body .breadcrumb-inner .current{color:#0f172a;font-weight:600}

html body [class$="-empty"]{padding:48px 24px;text-align:center}
html body [class$="-empty"] > i{font-size:48px;color:#cbd5e1;display:block;margin-bottom:14px}
html body [class$="-empty"] h3{font-size:17px;font-weight:700;margin-bottom:6px}
html body [class$="-empty"] p{font-size:13.5px;color:#94a3b8;margin-bottom:18px}
html body [class$="-empty"] a{
  display:inline-flex !important;align-items:center;gap:7px;
  width:auto !important;height:42px !important;min-height:0 !important;
  padding:0 22px !important;font-size:14px !important;font-weight:600;
  border-radius:10px !important;line-height:1;
  background:var(--blue-dark,#1e40af);color:#fff !important;
}
html body [class$="-empty"] a:hover{background:var(--blue,#2563eb)}
html body [class$="-empty"] a i{
  font-size:15px !important;display:inline-block !important;
  margin:0 !important;color:inherit !important;
}

html body .cart-page{max-width:1280px;margin:0 auto;padding:24px}
html body .cart-layout{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:20px;align-items:start}
html body .cart-card,
html body .order-card{
  background:#fff;border:1px solid var(--border,#e2e8f0);border-radius:14px;overflow:hidden;
}
html body .order-card{position:sticky;top:70px}

html body .cart-card-header{
  display:flex;align-items:center;padding:16px 20px;border-bottom:1px solid var(--border,#e2e8f0);
}
html body .cart-card-header h2{font-size:17px;font-weight:700;margin:0;display:flex;align-items:center}
html body .cart-clear-btn{
  margin-left:auto;border:0;background:#fef2f2;color:#dc2626;
  font-size:12.5px;font-weight:600;padding:6px 12px;border-radius:8px;cursor:pointer;
}
html body .cart-clear-btn:hover{background:#fee2e2}

html body .cart-item{
  display:flex;align-items:center;gap:14px;padding:14px 20px;
  border-bottom:1px solid #f1f5f9;
}
html body .cart-item:last-child{border-bottom:0}
html body .cart-item-img{
  width:64px;height:64px;flex-shrink:0;border-radius:10px;background:#f8fafc;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
html body .cart-item-img img{width:100%;height:100%;object-fit:contain}
html body .cart-item-info{flex:1;min-width:0}
html body .cart-item-name{
  font-size:14px;font-weight:600;color:#1e293b;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
html body .cart-item-code{font-size:12px;color:#94a3b8;margin-top:2px}
html body .cart-item-price{font-size:13px;color:#64748b}
html body .cart-item-subtotal{font-size:15px;font-weight:700;color:#e11d48}

html body .order-section{padding:16px 20px;border-bottom:1px solid #f1f5f9}
html body .order-section:last-child{border-bottom:0}
html body .order-section-title{
  font-size:13.5px;font-weight:700;color:#0f172a;margin-bottom:12px;
  display:flex;align-items:center;gap:7px;
}
html body .order-section-title i{color:var(--blue,#2563eb)}

html body .guest-notice{
  font-size:12.5px;padding:9px 12px;border-radius:9px;margin-bottom:12px;
  background:#fffbeb;border:1px solid #fde68a;color:#92400e;
  display:flex;align-items:center;gap:7px;
}

html body .order-input,
html body .order-textarea,
html body .promo-inp{
  width:100%;border:1.5px solid var(--border,#e2e8f0);border-radius:10px;
  padding:0 13px;font-size:14px;color:#0f172a;background:#fff;outline:none;
  transition:border-color .15s,box-shadow .15s;margin-bottom:9px;
}
html body .order-input,
html body .promo-inp{height:44px}
html body .order-textarea{padding:10px 13px;min-height:70px;resize:vertical}
html body .order-input:focus,
html body .order-textarea:focus,
html body .promo-inp:focus{
  border-color:var(--blue,#2563eb);box-shadow:0 0 0 3px rgba(37,99,235,.12);
}

html body .delivery-toggle{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:10px}
html body .delivery-opt{
  border:1.5px solid var(--border,#e2e8f0);border-radius:11px;padding:11px 8px;
  text-align:center;cursor:pointer;transition:.15s;margin:0;
}
html body .delivery-opt:hover{border-color:#bfdbfe}
html body .delivery-opt.active{border-color:var(--blue,#2563eb);background:#eff6ff}
html body .delivery-opt-icon{font-size:20px;line-height:1;margin-bottom:4px}
html body .delivery-opt-label{font-size:13px;font-weight:600;color:#1e293b}

html body .promo-row{display:flex;gap:8px}
html body .promo-row .promo-inp{margin-bottom:0}
html body .promo-btn{
  height:44px;padding:0 16px;border:0;border-radius:10px;flex-shrink:0;
  background:#f1f5f9;color:#334155;font-weight:600;font-size:13.5px;cursor:pointer;
}
html body .promo-btn:hover{background:#e2e8f0}

html body .summary-row{display:flex;justify-content:space-between;padding:4px 0;font-size:14px}
html body .summary-label{color:#64748b}
html body .summary-row.total{
  border-top:1.5px dashed var(--border,#e2e8f0);margin-top:8px;padding-top:12px;
  font-size:18px;font-weight:800;color:#0f172a;
}

html body .btn-order-submit{
  width:100%;height:50px;border:0;border-radius:12px;
  background:#f59e0b;color:#0f172a;font-size:15.5px;font-weight:700;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px;
  transition:background .15s,transform .15s;
}
html body .btn-order-submit:hover{background:#fbbf24;transform:translateY(-1px)}
html body .btn-order-submit:disabled{background:#e2e8f0;color:#94a3b8;cursor:not-allowed;transform:none}

@media (max-width:992px){
  html body .cart-layout{grid-template-columns:1fr}
  html body .order-card{position:static}
}
@media (max-width:768px){
  html body .breadcrumb-inner{padding:10px 14px}
  html body .cart-page{padding:14px}
  html body .cart-item{padding:12px 14px;gap:11px}
  html body .cart-item-img{width:54px;height:54px}
  html body .order-section{padding:14px}
}

body.no-price .product-card-price .price-current,
body.no-price .product-card-price .price-old,
body.no-price .product-card-price .price-unit,
body.no-price .badge-discount{display:none !important}
body.no-price .product-card-price{padding-right:0}
body.no-price .product-card-price::before{
  content:"Үнэ лавлана уу";font-size:13.5px;font-weight:600;color:#64748b;
}

body.no-price .btn-quickcart,
body.no-order .btn-quickcart,
body.no-order .header-actions a[href$="/cart"],
body.no-price .header-actions a[href$="/cart"]{display:none !important}

body.no-stock .badge-out{display:none !important}

.pm-overlay{
  position:fixed;inset:0;z-index:9999;background:rgba(15,23,42,.55);
  backdrop-filter:blur(3px);align-items:center;justify-content:center;padding:16px;
}
.pm-box{
  background:#fff;border-radius:18px;width:100%;max-width:440px;max-height:92vh;
  overflow-y:auto;box-shadow:0 24px 60px rgba(0,0,0,.25);animation:pmIn .22s ease;
}
@keyframes pmIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

.pm-head{
  display:flex;align-items:flex-start;gap:12px;padding:18px 20px;
  border-bottom:1px solid #f1f5f9;position:sticky;top:0;background:#fff;z-index:1;
}
.pm-title{font-size:16px;font-weight:800;color:#0f172a;display:flex;align-items:center;gap:7px}
.pm-title i{color:#16a34a;font-size:19px}
.pm-sub{font-size:12.5px;color:#64748b;margin-top:3px}
.pm-sub b{color:#0f172a;font-family:Consolas,monospace}
.pm-x{
  margin-left:auto;width:34px;height:34px;border:0;border-radius:50%;flex-shrink:0;
  background:#f1f5f9;color:#475569;cursor:pointer;display:flex;align-items:center;justify-content:center;
}
.pm-x:hover{background:#e2e8f0}

.pm-body{padding:4px 20px}
.pm-step{display:flex;gap:12px;padding:14px 0;border-bottom:1px dashed #e2e8f0}
.pm-step:last-child{border-bottom:0}
.pm-num{
  flex:0 0 26px;height:26px;border-radius:50%;background:#1e40af;color:#fff;
  font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:1px;
}
.pm-step-main{flex:1;min-width:0}
.pm-label{font-size:12.5px;font-weight:600;color:#64748b;margin-bottom:6px}
.pm-row{display:flex;align-items:center;gap:10px}
.pm-amount{font-size:26px;font-weight:900;color:#0f172a;letter-spacing:-.3px}
.pm-code{font-size:26px;font-weight:900;color:#1e40af;letter-spacing:5px;font-family:Consolas,monospace}

.pm-copy{
  margin-left:auto;flex-shrink:0;height:34px;padding:0 12px;border:0;border-radius:9px;
  background:#eff6ff;color:#1e40af;font-size:12.5px;font-weight:700;cursor:pointer;
  display:inline-flex;align-items:center;gap:5px;font-family:inherit;
}
.pm-copy:hover{background:#dbeafe}

.pm-warn{
  margin-top:8px;font-size:12px;line-height:1.45;color:#92400e;background:#fffbeb;
  border:1px solid #fde68a;border-radius:8px;padding:7px 10px;display:flex;gap:6px;align-items:flex-start;
}
.pm-warn i{color:#d97706;margin-top:1px}

.pm-bank{
  display:flex;align-items:center;gap:11px;padding:11px 12px;
  border:1.5px solid #e2e8f0;border-radius:12px;margin-bottom:8px;
}
.pm-bank:last-of-type{margin-bottom:0}
.pm-bank-ic{
  width:38px;height:38px;border-radius:10px;background:#f1f5f9;color:#1e40af;
  font-size:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.pm-bank-info{flex:1;min-width:0}
.pm-bank-name{font-size:12px;font-weight:700;color:#64748b}
.pm-bank-acc{font-size:17px;font-weight:800;color:#0f172a;letter-spacing:1.5px;font-family:Consolas,monospace}
.pm-bank-holder{font-size:12px;color:#94a3b8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pm-bank .pm-copy{width:36px;padding:0;justify-content:center}

.pm-foot{padding:14px 20px 18px;border-top:1px solid #f1f5f9;position:sticky;bottom:0;background:#fff}
.pm-confirm{
  width:100%;height:50px;border:0;border-radius:13px;background:#16a34a;color:#fff;
  font-size:15px;font-weight:800;cursor:pointer;font-family:inherit;text-decoration:none;
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.pm-confirm:hover{background:#15803d;color:#fff}
.pm-later{
  width:100%;margin-top:6px;height:40px;border:0;background:transparent;color:#64748b;
  font-size:13.5px;font-weight:600;cursor:pointer;border-radius:10px;font-family:inherit;
}
.pm-later:hover{background:#f8fafc;color:#0f172a}

.pm-success{text-align:center;padding:34px 26px 24px}
.pm-ok{
  width:70px;height:70px;border-radius:50%;background:#dcfce7;color:#16a34a;
  font-size:36px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;
}
.pm-success h3{font-size:20px;font-weight:800;color:#0f172a;margin-bottom:8px}
.pm-success p{font-size:14px;color:#64748b;line-height:1.55;margin-bottom:22px}
.pm-actions{display:flex;flex-direction:column;gap:6px}
.pm-later-link{display:block;padding:10px;color:#1e40af;font-weight:600;font-size:14px;border-radius:10px}
.pm-later-link:hover{background:#eff6ff}

@media (max-width:576px){
  .pm-overlay{align-items:flex-end;padding:0}
  .pm-box{max-width:none;border-radius:18px 18px 0 0;max-height:94vh;animation:pmUp .25s ease}
  .pm-amount,.pm-code{font-size:22px}
}
@keyframes pmUp{from{transform:translateY(100%)}to{transform:none}}


body.no-price .product-price-current,
body.no-price .product-price-old,
body.no-price .product-price-unit,
body.no-price .product-discount-badge,
body.no-price .gallery-badge .badge-discount{display:none !important}
body.no-price .product-price-main::before{
  content:"Үнэ лавлана уу";font-size:20px;font-weight:700;color:#475569;
}

body.no-price .qty-order-block,
body.no-order .qty-order-block{display:none !important}

body.no-stock .product-stock-info,
body.no-stock .gallery-badge .badge-out{display:none !important}

body.no-price .filter-section:has(.price-inputs),
body.no-stock .filter-section:has(.filter-check){display:none !important}

.price-ask-btn{
  display:inline-flex;align-items:center;gap:8px;margin-top:12px;
  height:46px;padding:0 22px;border-radius:12px;
  background:var(--blue-dark,#1e40af);color:#fff !important;
  font-size:15px;font-weight:700;text-decoration:none;
}
.price-ask-btn:hover{background:var(--blue,#2563eb)}

html body .addr-pick{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}
html body .addr-opt{
  display:flex;gap:10px;align-items:flex-start;padding:11px 12px;margin:0;
  border:1.5px solid #e2e8f0;border-radius:11px;cursor:pointer;transition:.15s;
}
html body .addr-opt:hover{border-color:#bfdbfe}
html body .addr-opt.active{border-color:#2563eb;background:#eff6ff}
html body .addr-opt input{margin-top:3px;accent-color:#2563eb;flex-shrink:0}
html body .addr-opt-title{font-size:13px;font-weight:700;color:#0f172a}
html body .addr-opt-text{font-size:12.5px;color:#64748b;margin-top:1px;line-height:1.4}
html body .addr-new .addr-opt-title{color:#1e40af}
html body .addr-save{
  display:flex;align-items:center;gap:7px;margin:2px 0 8px;
  font-size:13px;color:#475569;cursor:pointer;
}
html body .addr-save input{accent-color:#2563eb}

.tsl{position:relative;overflow:hidden;border-radius:16px;background:#eef2f7}
.tsl-track{display:grid}
.tsl-slide{
  grid-area:1 / 1;display:block;opacity:0;visibility:hidden;
  transition:opacity .6s ease,visibility .6s;
}
.tsl-slide.on{opacity:1;visibility:visible;z-index:1}
.tsl-slide img{display:block;width:100%}

.tsl-nav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:42px;height:42px;border:0;border-radius:50%;cursor:pointer;
  background:rgba(255,255,255,.94);color:#0f172a;font-size:17px;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 14px rgba(0,0,0,.16);opacity:0;transition:opacity .2s;
}
.tsl:hover .tsl-nav{opacity:1}
.tsl-nav.prev{left:14px}
.tsl-nav.next{right:14px}

.tsl-dots{
  position:absolute;left:0;right:0;bottom:12px;z-index:3;
  display:flex;justify-content:center;gap:6px;
}
.tsl-dots button{
  width:8px;height:8px;padding:0;border:0;border-radius:5px;cursor:pointer;
  background:rgba(255,255,255,.55);transition:width .2s,background .2s;
}
.tsl-dots button.on{width:24px;background:#fff}

.hero2{padding:18px 0 6px}
.hero2-grid{display:grid;grid-template-columns:minmax(0,2.8fr) minmax(0,1fr);gap:16px}
.hero2-grid.no-side{grid-template-columns:1fr}
.tsl-slide{position:relative;overflow:hidden}
.tsl-main .tsl-slide::before,
.tsl-side .tsl-slide::before{
  content:"";position:absolute;inset:-30px;z-index:0;
  background:var(--bg) center / cover no-repeat;
  filter:blur(22px) saturate(1.1) brightness(.96);
  transform:scale(1.08);
}
.tsl-slide img{position:relative;z-index:1}

.tsl-main .tsl-slide img{aspect-ratio:12 / 5;height:auto;object-fit:contain}

.tsl-side,
.tsl-side .tsl-track,
.tsl-side .tsl-slide{height:100%}
.tsl-side .tsl-slide img{height:100%;object-fit:contain}

.promo-sec .tsl-slide{align-self:center}
.promo-sec .tsl-slide img{height:auto}

html body .section{padding:34px 0}
html body .section-alt{background:transparent}

html body .section:has(.features-grid){padding:14px 0 4px}
html body .features-grid{gap:12px}
html body .feature-card{
  display:flex;align-items:center;gap:12px;text-align:left;padding:14px 16px;
}
html body .feature-icon{width:44px;height:44px;font-size:20px;margin:0;flex-shrink:0;border-radius:12px}
html body .feature-title{font-size:13.5px;margin-bottom:2px}
html body .feature-desc{font-size:12px;line-height:1.4}

html body .cat-card{border:0;background:transparent;box-shadow:none;padding:6px 4px}
html body .cat-card:hover{transform:translateY(-2px);box-shadow:none}
html body .cat-card img,
html body .cat-card .cat-icon{
  width:84px;height:84px;border-radius:50%;margin:0 auto 10px;display:flex;
  align-items:center;justify-content:center;object-fit:cover;
  background:#fff;border:1.5px solid var(--border,#e2e8f0);font-size:30px;
  transition:border-color .2s,box-shadow .2s;
}
html body .cat-card:hover img,
html body .cat-card:hover .cat-icon{
  border-color:var(--blue,#2563eb);box-shadow:0 6px 18px rgba(37,99,235,.18);
}
html body .cat-name{font-size:13px}

@media (max-width:768px){
  .hero2{padding:10px 0 2px}
  .hero2-grid{grid-template-columns:1fr;gap:10px}
  .tsl-side{display:none}
  .tsl{border-radius:12px}
  .tsl-nav{display:none}

  html body .section{padding:24px 0}
  html body .features-grid{grid-template-columns:repeat(2,1fr);gap:8px}
  html body .feature-card{padding:10px 12px;gap:9px}
  html body .feature-icon{width:36px;height:36px;font-size:17px;border-radius:10px}
  html body .feature-desc{display:none}

  html body .cat-card img,
  html body .cat-card .cat-icon{width:66px;height:66px;font-size:24px}
}

[hidden]{display:none !important}

:root{
  --amber:#f2711d;
  --amber-light:#fff1e6;
}

html body .header-logo img{height:60px}

html body .nav-cat-btn,
html body .btn-hero-primary,
html body .btn-order{background:#f2711d;color:#fff}
html body .nav-cat-btn:hover,
html body .btn-hero-primary:hover,
html body .btn-order:hover{background:#e0620f;color:#fff}
html body .btn-hero-primary:hover{box-shadow:0 8px 20px rgba(242,113,29,.35)}

html body .btn-order-submit{background:#f2711d;color:#fff}
html body .btn-order-submit:hover{background:#e0620f}

html body .hero-badge{
  background:rgba(242,113,29,.18);color:#ffb37f;border-color:rgba(242,113,29,.35);
}
html body .hero h1 span{color:#ff8a3d}

html body .cat-dropdown{border-top-color:#f2711d}

html body .section:has(#sl-cats){padding:18px 0 6px}
html body .section:has(#sl-cats) .sec-header{margin-bottom:12px}
html body .prod-slider-wrap:has(#sl-cats){padding:0}
html body .prod-slider-wrap:has(#sl-cats) .slider-btn{display:none !important}

html body #sl-cats{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr)) !important;
  gap:12px !important;overflow:visible !important;padding:0 !important;
}
html body #sl-cats > *{width:auto !important;max-width:none !important;flex:none !important;margin:0 !important}

html body #sl-cats .cat-card{
  display:grid;grid-template-columns:52px minmax(0,1fr) 14px;grid-template-rows:auto auto;
  column-gap:12px;row-gap:1px;align-items:center;text-align:left;
  padding:12px 14px;background:#fff;border:1px solid var(--border,#e2e8f0);border-radius:14px;
  box-shadow:none;transition:border-color .2s,box-shadow .2s,transform .2s;
  height:auto !important;min-height:0 !important;align-self:start;
}
html body #sl-cats .cat-card:hover{
  border-color:var(--cc,#2563eb);transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(15,35,70,.08);
}

html body #sl-cats .cat-card img,
html body #sl-cats .cat-card .cat-icon{
  grid-column:1;grid-row:1 / span 2;
  width:52px;height:52px;margin:0;border:0;border-radius:14px;
  display:flex;align-items:center;justify-content:center;object-fit:cover;font-size:23px;
  background:var(--cb,#eff6ff);color:var(--cc,#2563eb);box-shadow:none;transform:none;
}
html body #sl-cats .cat-card .cat-icon img{width:100%;height:100%;border-radius:inherit}
html body #sl-cats .cat-card .cat-icon i{color:inherit}

html body #sl-cats .cat-name{
  grid-column:2;align-self:end;margin:0;
  font-size:14px;font-weight:700;color:#0f172a;line-height:1.3;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
html body #sl-cats .cat-count{grid-column:2;align-self:start;margin:0;font-size:12px;color:#94a3b8}

html body #sl-cats .cat-card::after{
  content:"\203A";grid-column:3;grid-row:1 / span 2;
  font-size:22px;line-height:1;color:#cbd5e1;transition:color .2s,transform .2s;
}
html body #sl-cats .cat-card:hover::after{color:var(--cc,#2563eb);transform:translateX(3px)}

html body #sl-cats > :nth-child(6n+1){--cb:#eff6ff;--cc:#2563eb}
html body #sl-cats > :nth-child(6n+2){--cb:#fff1e6;--cc:#f2711d}
html body #sl-cats > :nth-child(6n+3){--cb:#ecfdf5;--cc:#059669}
html body #sl-cats > :nth-child(6n+4){--cb:#f5f3ff;--cc:#7c3aed}
html body #sl-cats > :nth-child(6n+5){--cb:#fef2f2;--cc:#dc2626}
html body #sl-cats > :nth-child(6n+6){--cb:#f0f9ff;--cc:#0284c7}

body.hide-features .section:has(.features-grid),
body.hide-cats .section:has(#sl-cats),
body.hide-featured .section:has(#sl-featured){display:none !important}

@media (max-width:768px){
  html body #sl-cats{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:8px !important}
  html body #sl-cats .cat-card{grid-template-columns:40px minmax(0,1fr);padding:10px;column-gap:9px}
  html body #sl-cats .cat-card img,
  html body #sl-cats .cat-card .cat-icon{width:40px;height:40px;border-radius:11px;font-size:18px}
  html body #sl-cats .cat-name{font-size:12.5px}
  html body #sl-cats .cat-count{font-size:11px}
  html body #sl-cats .cat-card::after{display:none}
}

body.hide-features .section:has(.features-grid),
body.hide-cats .section:has(#sl-cats),
body.hide-featured .section:has(#sl-featured){display:none !important}

body.hide-contact .contact-section{display:none !important}




@media (min-width:1025px){
  html body .footer-grid{grid-template-columns:1.7fr 1fr 1fr 1.5fr}
}
html body .footer-contact{gap:12px}
html body .footer-contact li{
  display:flex;gap:10px;align-items:flex-start;
  font-size:13px;line-height:1.55;color:#94a3b8;
}
html body .footer-contact li > i{color:#f2711d;font-size:14px;margin-top:3px;flex-shrink:0}
html body .footer-contact a{color:#cbd5e1}
html body .footer-contact a:hover{color:#fff}
html body .footer-contact .fc-map{color:#f2711d;font-weight:600;font-size:12.5px}
html body .footer-contact .fc-map:hover{color:#ff9a5c}

html body .prod-slider-wrap{padding-left:0 !important;padding-right:0 !important}
html body .prod-slider{
  padding:6px 0 12px !important;margin-left:0 !important;margin-right:0 !important;
  scroll-padding-inline:0;
}
html body .badge-out{display:none !important}

html body .sec-header{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  flex-wrap:wrap;margin-bottom:16px;
}
html body .sec-header-left{display:flex;align-items:center;gap:12px;min-width:0}
html body .sec-header-icon{
  width:44px;height:44px;border-radius:12px;flex-shrink:0;
  background:#eff6ff;color:#2563eb;font-size:19px;
  display:flex;align-items:center;justify-content:center;
}
html body .sec-header-title{font-size:20px;font-weight:800;color:#0f172a;line-height:1.2}
html body .sec-header-count{
  font-size:12px;font-weight:600;color:#64748b;background:#f1f5f9;
  padding:3px 10px;border-radius:999px;white-space:nowrap;
}
html body .sec-view-all{
  display:inline-flex;align-items:center;gap:6px;padding:8px 16px;
  border:1.5px solid #dbe4ef;border-radius:999px;background:#fff;
  font-size:13px;font-weight:600;color:#2563eb;white-space:nowrap;
  transition:border-color .15s,background .15s;
}
html body .sec-view-all:hover{border-color:#2563eb;background:#eff6ff}
html body .sec-view-all i{transition:transform .15s}
html body .sec-view-all:hover i{transform:translateX(3px)}

@media (max-width:768px){
  html body .sec-header-icon{width:36px;height:36px;font-size:16px;border-radius:10px}
  html body .sec-header-title{font-size:17px}
  html body .sec-header-count{display:none}
  html body .sec-view-all{padding:6px 12px;font-size:12px}
}

html body .sec-banner-right .container{
  grid-template-columns:minmax(0,1fr) calc((100% - (var(--cols) - 1) * var(--cg)) / var(--cols));
}
html body .sec-banner-right .sec-banner{grid-column:2}
html body .sec-banner-right .prod-slider-wrap{grid-column:1}

html body .sec-banner{
  position:relative;margin:6px 0 12px;background:#fff;
  border:1px solid var(--border,#e2e8f0);border-radius:12px;overflow:hidden;
  box-shadow:0 4px 14px rgba(15,35,70,.06);
}
html body .sec-banner::before{
  content:"";position:absolute;inset:-30px;z-index:0;
  background:var(--bg) center / cover no-repeat;
  filter:blur(22px);opacity:.5;transform:scale(1.08);
}
html body .sec-banner img{position:relative;z-index:1;object-fit:contain;padding:6px}
html body .sec-banner:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(15,35,70,.12)}

@media (max-width:768px){
  html body .sec-banner{margin:0 0 12px}
}

html body .sec-banner::before{content:none !important}
html body .sec-banner{background:#fff;display:flex;align-items:center;justify-content:center}
html body .sec-banner img{
  width:100%;height:100%;padding:8px;border-radius:14px;
  object-fit:contain;object-position:center;
}

html body .sec-banner{position:relative;align-self:stretch;min-height:0;height:auto}
html body .sec-banner img{
  position:absolute;inset:0;width:100%;height:100%;
  padding:8px;object-fit:contain;
}

html body .header-logo > div{display:flex;flex-direction:column;width:max-content;max-width:100%}
html body .logo-name{color:#013b7e;letter-spacing:-.3px;white-space:nowrap}
html body .logo-sub{
  display:block;width:max-content;white-space:nowrap;margin-top:3px;
  font-size:13px;font-weight:500;color:#64748b;line-height:1.2;
}

html body .sec-banner{background:#eef2f7;border-color:transparent;box-shadow:0 4px 14px rgba(15,35,70,.08)}
html body .sec-banner img{padding:0;border-radius:0;object-fit:cover;object-position:center}
html body .sec-banner:hover img{transform:scale(1.03)}
html body .sec-banner img{transition:transform .4s ease}