@font-face{font-family:Onest;font-weight:400;font-display:swap;src:url(/fonts/onest-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Onest;font-weight:400;font-display:swap;src:url(/fonts/onest-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Onest;font-weight:500;font-display:swap;src:url(/fonts/onest-cyrillic-500-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Onest;font-weight:500;font-display:swap;src:url(/fonts/onest-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Onest;font-weight:700;font-display:swap;src:url(/fonts/onest-cyrillic-700-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Onest;font-weight:700;font-display:swap;src:url(/fonts/onest-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{--ink:#101314;--blue:#bed9eb;--blue-line:#a9d4ef;--yellow:#e1d775;--green:#49b454;--green-d:#3d9e47;--line:#a7a18b;--zebra:#f3f3ef;--soft:#f1f1f1;--muted:#7b7d7e;--radius:20px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);font:400 14px/1.35 Onest,Arial,Helvetica,sans-serif;background:#fff;-webkit-font-smoothing:antialiased}
a{color:inherit}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.muted{color:var(--muted)}

/* Шапка */
.hero{background:var(--blue);border-radius:0 0 var(--radius) var(--radius);overflow:hidden}
.hero-inner,main,.footer{max-width:1160px;margin:0 auto}
.hero-inner{min-height:101px;display:grid;grid-template-columns:205px minmax(0,1fr) auto 300px;align-items:center;gap:0 24px;position:relative}
.brand{display:flex;align-items:center;gap:8px;font-size:29px;font-weight:700;text-decoration:none;letter-spacing:-.01em}
.logo-mark{width:34px;height:44px;flex:none}
.intro h1{font-size:20px;font-weight:700;margin:0 0 4px}
.intro p{margin:0;font-size:14px}
.contacts{font-size:16px;line-height:30px}
.contacts div{display:flex;align-items:center;gap:8px}
.contacts a{text-decoration:none}
.contacts a:hover{text-decoration:underline}
.contacts .ic{display:flex}
.contacts img{display:block}
.hero-art{align-self:stretch;position:relative;margin-right:-120px}
.hero-art:before{content:"";position:absolute;left:0;top:-170px;width:640px;height:460px;border-radius:50%;background:var(--yellow)}
.hero-art img{position:absolute;left:58px;bottom:0;width:260px;height:100px;object-fit:cover}

main{padding:20px 0 10px}

/* Панель с датой */
.toolbar{min-height:58px;border:1px solid #e9e9e9;border-radius:30px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:5px 5px 5px 18px;margin-bottom:20px}
.date{display:flex;align-items:center;gap:12px}
.toolbar-actions{display:flex;align-items:center;gap:8px}
.download{height:47px;border:0;border-radius:27px;background:var(--green);color:#fff;padding:0 26px 0 22px;font:500 14px Onest,Arial,sans-serif;display:inline-flex;align-items:center;gap:12px;cursor:pointer;text-decoration:none;transition:background .15s}
.download:hover{background:var(--green-d)}
.btn-ghost{height:47px;display:inline-flex;align-items:center;padding:0 20px;border-radius:27px;background:var(--soft);text-decoration:none;font-weight:500;transition:background .15s}
.btn-ghost:hover{background:#e4e4e4}

/* Поиск */
.search{height:52px;border:1px solid var(--blue-line);border-radius:28px;display:flex;align-items:center;padding-left:30px;margin-bottom:20px;background:#fff;transition:box-shadow .15s}
.search:focus-within{box-shadow:0 0 0 3px rgba(169,212,239,.45)}
.search input{border:0;outline:0;font:inherit;font-size:16px;width:100%;background:transparent;color:var(--ink)}
.search input::placeholder{color:#55595b}
.search-btn{width:42px;height:42px;flex:none;border-radius:50%;background:var(--blue);border:0;margin-right:4px;display:grid;place-items:center;cursor:pointer;color:var(--ink)}

/* Фильтры */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.filter,.page{border:0;background:var(--soft);height:40px;border-radius:22px;padding:0 15px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:500;transition:background .15s}
.filter:hover,a.page:hover{background:#e3e3e3}
.filter.active,.page.active{background:var(--ink);color:#fff}
.found{margin:-8px 0 14px;color:var(--muted)}
.found a{color:var(--ink)}

/* Таблица */
#catalog{transition:opacity .15s}
#catalog.loading{opacity:.55}
.table{border:1px solid var(--line);border-radius:11px;overflow:hidden}
.table-head,.row{display:grid;grid-template-columns:1.05fr 1.05fr 1.05fr 1.95fr 1.95fr .62fr 1.08fr}
.table-head{background:var(--yellow);font-weight:500;border-bottom:1px solid var(--line)}
.table-head span,.cell{padding:12px;border-right:1px solid var(--line)}
.table-head span:last-child,.cell:last-child{border-right:0}
.table-head .sort{text-decoration:none;white-space:nowrap}
.table-head .sort:hover,.table-head .sort.on{text-decoration:underline}
.row{min-height:78px}
.row:nth-child(even){background:var(--zebra)}
.row:hover{background:#eaf3f9}
.cell{display:flex;align-items:center;line-height:18px;word-break:break-word}
.sku{font-weight:500}
.price{white-space:nowrap;font-weight:500}
.mobile-label{display:none}
.empty{text-align:center;padding:48px 20px;border:1px dashed var(--line);border-radius:11px}
.empty p{margin:6px 0}

/* Пагинация */
.pagination{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:20px}
.pagination .page{min-width:40px;padding:0 6px}
.page.gap{background:var(--soft)}
.arrow{width:40px;height:40px;position:relative;display:block;margin:0 22px}
.arrow:before{content:"";position:absolute;width:10px;height:10px;border-top:2px solid;border-right:2px solid;top:14px}
.prev:before{transform:rotate(-135deg);left:17px}
.next:before{transform:rotate(45deg);left:12px}
.arrow.disabled{opacity:.25}

/* Заявка */
.lead{margin:44px 0 10px;background:var(--zebra);border-radius:var(--radius);padding:32px;display:grid;grid-template-columns:1fr 1.35fr;gap:32px;scroll-margin-top:16px}
.lead h2{font-size:24px;margin:0 0 10px}
.lead-text p{margin:0 0 12px;max-width:380px}
.lead-alt a{white-space:nowrap}
.lead-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lead-form label{display:flex;flex-direction:column;gap:6px;font-weight:500}
.lead-form label b{color:#c0392b}
.lead-form input,.lead-form textarea{font:inherit;font-size:16px;font-weight:400;border:1px solid #d9d6c8;border-radius:12px;padding:12px 14px;background:#fff;color:var(--ink);resize:vertical;outline:0}
.lead-form input:focus,.lead-form textarea:focus{border-color:var(--blue-line);box-shadow:0 0 0 3px rgba(169,212,239,.45)}
.lead-form input[aria-invalid=true]{border-color:#d9534f}
.lead-form .wide{grid-column:1/-1}
.lead-actions{display:flex;align-items:center;gap:16px}
.lead-actions small{color:var(--muted);font-size:12px}
.lead-status{margin:0;min-height:1em;font-weight:500}
.lead-status.ok{color:var(--green-d)}
.lead-status.err{color:#c0392b}
.captcha-box{min-height:102px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

.footer{display:flex;justify-content:space-between;gap:12px;padding:24px 0 32px;color:var(--muted);font-size:13px}
.footer a{text-decoration:none}

@media (max-width:1200px){
  .hero-inner,main,.footer{padding-left:20px;padding-right:20px}
  .hero-inner{grid-template-columns:180px minmax(0,1fr) auto 200px}
  .hero-art{margin-right:-20px}
}
@media (max-width:980px){
  .hero-inner{grid-template-columns:auto minmax(0,1fr) 200px}
  .intro{grid-column:2;grid-row:1}
  .contacts{grid-column:1/3;grid-row:2;display:flex;gap:20px;padding-bottom:12px}
  .hero-art{grid-column:3;grid-row:1/3}
  .table-head,.row{grid-template-columns:.9fr 1fr 1fr 2fr 1.7fr .7fr 1fr}
  .table-head span,.cell{padding:10px 8px}
}

/* Мобильная версия — карточки, как в макете */
@media (max-width:700px){
  body{font-size:13px}
  .hero{border-radius:0 0 18px 18px}
  .hero-inner{display:block;padding:20px 15px 16px;min-height:194px}
  .brand{font-size:22px;gap:5px}
  .logo-mark{width:26px;height:34px}
  .intro{margin-top:10px;position:relative;z-index:2}
  .intro h1{font-size:17px}
  .intro p{font-size:12px;margin-top:4px}
  .contacts{display:block;font-size:14px;margin-top:10px;line-height:34px;position:relative;z-index:2;padding:0}
  .contacts div{gap:6px}
  .hero-art{position:absolute;right:0;bottom:0;width:150px;height:100px;margin:0}
  .hero-art:before{left:0;top:0;width:300px;height:220px}
  .hero-art img{left:18px;width:150px;height:auto;bottom:0;object-fit:contain;object-position:left bottom}
  main{padding:11px 15px 10px}
  .toolbar{flex-wrap:wrap;padding:5px 5px 5px 16px;border-radius:30px}
  .date{font-size:13px;gap:8px}
  .date .lbl{display:none}
  .toolbar{flex-wrap:nowrap}
  .btn-ghost{display:none}
  .download{height:46px;padding:0 14px;gap:8px}
  .search{height:52px;padding-left:22px;margin-bottom:10px}
  .search input{font-size:16px}
  .filters{gap:5px;margin-bottom:10px}
  .filter{height:33px;padding:0 13px;font-size:12px}
  .found{margin:0 0 10px}
  .table{border:0;border-radius:0;overflow:visible}
  .table-head{display:none}
  .row{display:grid;grid-template-columns:1fr;border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-bottom:6px;min-height:0;background:#fff!important}
  .cell{display:grid;grid-template-columns:50% 50%;align-items:stretch;padding:0;border:0;border-bottom:1px solid var(--line);min-height:32px;line-height:15px}
  .cell:last-child{border-bottom:0}
  .mobile-label{display:flex;align-items:center;background:var(--yellow);font-weight:500;padding:8px 12px}
  .cell:nth-child(odd) .value{background:var(--zebra)}
  .value{display:flex;align-items:center;padding:8px 12px}
  .pagination{margin-top:12px;gap:4px}
  .pagination .page{min-width:36px;height:36px}
  .arrow{margin:0 6px}
  .lead{grid-template-columns:1fr;padding:22px 16px;gap:16px;margin-top:28px}
  .lead-form{grid-template-columns:1fr}
  .lead-actions{flex-direction:column;align-items:stretch}
  .lead-actions .download{justify-content:center}
  .footer{flex-direction:column;padding:20px 15px 28px}
}