.ob-catalog-master { --obcm-blue:#3513ff; --obcm-ink:#0d0e13; --obcm-soft:#f4f5fa; --obcm-line:#e5e7ee; color:var(--obcm-ink); background:#fff; font-family:Poppins, sans-serif; }
.ob-catalog-master * { box-sizing:border-box; }
.obcm-shell { width:min(1250px, calc(100% - 40px)); margin-inline:auto; }
.obcm-hero { padding:76px 0 64px; color:#fff; background:linear-gradient(135deg,#0c0d12,#17182a); }
.obcm-hero-grid { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:70px; align-items:end; }
.obcm-eyebrow { margin:0 0 10px; color:var(--obcm-blue); font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.obcm-hero .obcm-eyebrow { color:#8d84ff; }
.obcm-hero h1 { max-width:760px; margin:0; font-size:clamp(36px,4.2vw,48px); line-height:1.02; font-weight:700; }
.obcm-hero p:not(.obcm-eyebrow) { max-width:760px; margin:22px 0 0; color:#c9cbd4; font-size:17px; line-height:1.6; }
.obcm-hero-stat { padding:25px; border:1px solid rgb(255 255 255 / 12%); border-radius:20px; background:rgb(255 255 255 / 6%); }
.obcm-hero-stat strong { display:block; font-size:38px; line-height:1; }
.obcm-hero-stat span { display:block; margin-top:5px; font-size:14px; font-weight:600; }
.obcm-hero-stat small { display:block; margin-top:14px; color:#aeb1bd; line-height:1.45; }
.obcm-search-band { padding:28px 0; background:var(--obcm-blue); }
.obcm-search-form { display:grid; grid-template-columns:minmax(320px,1.5fr) minmax(210px,.75fr) minmax(180px,.55fr) auto; gap:10px; align-items:end; }
.obcm-search-form label { min-width:0; }
.obcm-search-form label > span { margin:0 0 7px 4px; display:block; color:#d8d5ff; font-size:11px; font-weight:700; text-transform:uppercase; }
.obcm-search-form input,.obcm-search-form select { width:100%; height:52px; border:0; border-radius:12px; padding:0 16px; background:#fff; color:var(--obcm-ink); font:inherit; font-size:14px; outline:0; }
.obcm-search-form button { height:52px; padding:0 24px; border:0; border-radius:12px; background:var(--obcm-ink); color:#fff; font:inherit; font-weight:700; cursor:pointer; }
.obcm-section-head { margin-bottom:26px; display:flex; align-items:end; justify-content:space-between; gap:38px; }
.obcm-section-head h2,.obcm-results-head h2 { max-width:720px; margin:0; font-size:clamp(28px,3vw,34px); line-height:1.08; }
.obcm-section-head > p { max-width:480px; margin:0; color:#686b76; line-height:1.55; }
.obcm-categories { padding:64px 0; background:var(--obcm-soft); }
.obcm-category-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; }
.obcm-category-grid a { min-height:145px; padding:20px; border:1px solid var(--obcm-line); border-radius:16px; display:flex; flex-direction:column; color:var(--obcm-ink); background:#fff; text-decoration:none; transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.obcm-category-grid a:hover,.obcm-category-grid a.is-active { transform:translateY(-2px); border-color:#bcb5ff; box-shadow:0 12px 28px rgb(30 20 100 / 8%); }
.obcm-category-grid a > span { width:40px; height:40px; border-radius:12px; display:grid; place-items:center; color:var(--obcm-blue); background:#efedff; }
.obcm-category-grid strong { margin-top:20px; font-size:15px; line-height:1.25; }
.obcm-category-grid small { margin-top:5px; color:#777a85; }
.obcm-results { padding:72px 0 96px; }
.obcm-results-head { margin-bottom:28px; display:flex; align-items:end; justify-content:space-between; gap:30px; }
.obcm-results-head > div:last-child { text-align:right; }
.obcm-results-head strong,.obcm-results-head span { display:block; }
.obcm-results-head span { margin-top:4px; color:#777a85; font-size:13px; }
.obcm-active-filters { margin:-8px 0 24px; display:flex; align-items:center; flex-wrap:wrap; gap:8px; color:#727580; font-size:13px; }
.obcm-active-filters b { padding:7px 11px; border-radius:999px; color:var(--obcm-blue); background:#efedff; font-weight:600; }
.obcm-active-filters a { margin-left:auto; color:var(--obcm-ink); font-weight:700; }
.obcm-product-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.obcm-product-card { overflow:hidden; border:1px solid var(--obcm-line); border-radius:18px; background:#fff; transition:box-shadow .2s ease,transform .2s ease; }
.obcm-product-card:hover { transform:translateY(-2px); box-shadow:0 14px 32px rgb(20 20 70 / 7%); }
.obcm-product-media { aspect-ratio:1; padding:14px; display:flex; align-items:center; justify-content:center; background:#f7f8fb; }
.obcm-product-media img { width:100%; height:100%; object-fit:contain; }
.obcm-product-body { padding:17px; }
.obcm-product-body > small { color:#777a85; font-size:10px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.obcm-product-body h3 { min-height:44px; margin:7px 0 6px; font-size:15px; line-height:1.35; }
.obcm-product-body h3 a { color:var(--obcm-ink); text-decoration:none; }
.obcm-product-body > span { color:#858893; font-size:11px; }
.obcm-quote-control { margin-top:14px; padding:4px; border-radius:12px; display:flex; align-items:center; gap:8px; background:#f2f3f7; }
.obcm-quote-control label { min-width:0; padding-left:9px; display:flex; align-items:center; gap:6px; color:#777a85; font-size:10px; font-weight:700; text-transform:uppercase; }
.obcm-quote-control input { width:58px; border:0; background:transparent; font:inherit; font-size:13px; font-weight:700; outline:0; }
.obcm-quote-control button { margin-left:auto; min-width:92px; height:38px; padding:0 12px; border:0; border-radius:9px; display:inline-flex; align-items:center; justify-content:center; gap:7px; background:var(--obcm-ink); color:#fff; font:inherit; font-size:12px; font-weight:700; cursor:pointer; }
.obcm-pagination { margin-top:46px; display:flex; flex-wrap:wrap; justify-content:center; gap:7px; }
.obcm-pagination .page-numbers { min-width:40px; height:40px; padding:0 12px; border:1px solid var(--obcm-line); border-radius:9px; display:inline-flex; align-items:center; justify-content:center; color:var(--obcm-ink); text-decoration:none; font-size:13px; font-weight:600; }
.obcm-pagination .page-numbers.current { border-color:var(--obcm-ink); color:#fff; background:var(--obcm-ink); }
.obcm-empty { padding:46px; border:1px dashed #cfd2dd; border-radius:20px; display:flex; gap:20px; align-items:flex-start; background:var(--obcm-soft); }
.obcm-empty > i { width:50px; height:50px; border-radius:15px; display:grid; place-items:center; color:var(--obcm-blue); background:#e9e6ff; }
.obcm-empty h3 { margin:0 0 7px; font-size:22px; }
.obcm-empty p { margin:0 0 13px; color:#696c77; }
.obcm-empty a { color:var(--obcm-blue); font-weight:700; }
@media (max-width:1100px) { .obcm-search-form { grid-template-columns:1fr 1fr; } .obcm-search-form button { width:100%; } .obcm-category-grid { grid-template-columns:repeat(3,1fr); } .obcm-product-grid { grid-template-columns:repeat(3,1fr); } }
@media (max-width:760px) { .obcm-shell { width:min(100% - 28px,1250px); } .obcm-hero { padding:52px 0; } .obcm-hero-grid { grid-template-columns:1fr; gap:30px; } .obcm-hero h1 { font-size:34px; } .obcm-hero p:not(.obcm-eyebrow) { font-size:15px; } .obcm-hero-stat { display:grid; grid-template-columns:auto 1fr; column-gap:12px; } .obcm-hero-stat small { grid-column:1 / -1; } .obcm-search-form { grid-template-columns:1fr; } .obcm-section-head,.obcm-results-head { align-items:flex-start; flex-direction:column; } .obcm-category-grid { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:8px; } .obcm-category-grid a { min-width:210px; scroll-snap-align:start; } .obcm-results { padding:54px 0 80px; } .obcm-results-head > div:last-child { text-align:left; } .obcm-product-grid { grid-template-columns:1fr; gap:12px; } .obcm-product-card { display:grid; grid-template-columns:118px minmax(0,1fr); } .obcm-product-media { aspect-ratio:1; padding:8px; } .obcm-product-body { min-width:0; padding:13px; } .obcm-product-body h3 { min-height:0; margin-bottom:4px; font-size:14px; } .obcm-quote-control { margin-top:10px; } .obcm-quote-control button { min-width:42px; width:42px; padding:0; } .obcm-quote-control button span { display:none; } .obcm-active-filters a { margin-left:0; } .obcm-empty { padding:28px 22px; } }