/*
 * Дизайн-система редизайна liggohub.ru.
 * Собрана из макетов «Сайт финал»: общая база одинакова на всех
 * страницах, ниже к ней добавлены секции конкретных страниц.
 */


/* ---------------------------------------------------------------
   Общая база: переменные, шапка, навигация, подвал, кнопки, формы
   --------------------------------------------------------------- */

:root{
  --yellow:#f7c600;
  --yellow-dark:#d7a800;
  --yellow-soft:#fff7cf;
  --black:#181818;
  --black-2:#232323;
  --text:#22242a;
  --muted:#767d88;
  --line:#e7e9ee;
  --bg:#f5f6f8;
  --card:#fff;
  --radius:16px;
  --radius-lg:24px;
  --shadow-sm:0 8px 24px rgba(22,22,22,.06);
  --shadow-md:0 16px 44px rgba(22,22,22,.10);
  --container:1240px;
  --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font);background:var(--bg);color:var(--text);font-size:14px;line-height:1.48;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{text-decoration:none;color:inherit}
button,input,textarea,select{font:inherit}
.wrap{width:min(var(--container),calc(100% - 32px));margin:0 auto}
.icon{width:20px;height:20px;display:inline-grid;place-items:center}
.muted{color:var(--muted)}
.topbar{background:var(--black);color:#e9e9e9;border-bottom:1px solid rgba(255,255,255,.08)}
.topbar__inner{min-height:42px;display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:13px}
.topbar__links,.topbar__contacts{display:flex;align-items:center;gap:18px;white-space:nowrap}
.topbar a{color:#e9e9e9;opacity:.92;transition:.18s}
.topbar a:hover{color:var(--yellow);opacity:1}
.topbar__note{color:#cfcfcf;opacity:.9}
.header{background:#fff;position:sticky;top:0;z-index:40;border-bottom:1px solid var(--line);box-shadow:0 4px 22px rgba(0,0,0,.04)}
.header__inner{height:88px;display:grid;grid-template-columns:238px minmax(260px,1fr) 250px;align-items:center;gap:26px}
.logo{display:flex;align-items:center;gap:12px;min-width:0}
.logo__mark{width:52px;height:52px;border-radius:15px;background:linear-gradient(145deg,var(--yellow),#ffe36e);display:grid;place-items:center;box-shadow:0 14px 30px rgba(247,198,0,.38);color:#111;font-size:26px;font-weight:950;letter-spacing:-.05em}
.logo__text{display:flex;flex-direction:column;gap:2px;min-width:0}
.logo__title{font-size:25px;line-height:1;font-weight:950;letter-spacing:-.04em;color:#151515;text-transform:uppercase}
.logo__sub{font-size:11px;color:#737983;font-weight:750;white-space:nowrap}
.search{height:50px;display:flex;align-items:center;border:1px solid var(--line);background:#f7f8fa;border-radius:14px;overflow:hidden;transition:.18s}
.search:focus-within{background:#fff;border-color:#e3bf20;box-shadow:0 0 0 4px rgba(247,198,0,.13)}
.search__icon{width:48px;display:grid;place-items:center;color:#6f7580;flex:0 0 auto}
.search input{height:100%;border:0;background:transparent;outline:0;min-width:0;flex:1;padding:0 8px;color:#1f2228;font-weight:600}
.search button{height:100%;border:0;background:var(--yellow);padding:0 22px;font-weight:900;color:#111;cursor:pointer;transition:.18s}
.search button:hover{background:#ffe05e}
.actions{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.action{height:48px;min-width:48px;padding:0 12px;border-radius:14px;background:#f6f7f9;border:1px solid transparent;color:#242424;display:flex;align-items:center;justify-content:center;gap:8px;font-weight:850;position:relative;transition:.18s}
.action:hover{background:var(--yellow-soft);border-color:#f4dd77}
.action__count{position:absolute;top:-7px;right:-5px;min-width:20px;height:20px;border-radius:20px;background:var(--yellow);border:2px solid #fff;display:grid;place-items:center;font-size:10px;font-weight:950}
.nav{background:#fff;border-bottom:1px solid var(--line)}
.nav__inner{height:58px;display:flex;align-items:center;gap:8px;overflow-x:auto;scrollbar-width:none}
.nav__inner::-webkit-scrollbar{display:none}
.catalog-btn{border:0;background:var(--yellow);color:#111;border-radius:14px;padding:12px 18px;font-weight:950;display:flex;align-items:center;gap:10px;white-space:nowrap;box-shadow:0 10px 24px rgba(247,198,0,.25);cursor:pointer}
.nav a{padding:11px 12px;border-radius:12px;font-weight:820;color:#3b3f46;white-space:nowrap;transition:.18s}
.nav a:hover,.nav a.active{background:#f4f5f7;color:#111}
.nav .accent{color:#b68d00;background:#fff8da}
.main{padding:24px 0 48px}
.breadcrumbs{display:flex;gap:8px;align-items:center;color:#818792;font-weight:750;font-size:13px;margin:0 0 16px}
.breadcrumbs a{color:#6e7480}
.breadcrumbs span{color:#1f2228}
.page-hero{position:relative;overflow:hidden;border-radius:var(--radius-lg);background:linear-gradient(135deg,#252525 0%,#171717 62%,#2c2c2c 100%);color:#fff;box-shadow:var(--shadow-md);padding:34px;margin-bottom:24px}
.page-hero:before{content:"";position:absolute;right:-80px;top:-90px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(247,198,0,.34),rgba(247,198,0,0) 70%)}
.page-hero:after{content:"";position:absolute;right:90px;bottom:-92px;width:260px;height:260px;border-radius:50%;background:rgba(247,198,0,.13)}
.page-hero__content{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:end}
.badge{display:inline-flex;align-items:center;gap:8px;background:rgba(247,198,0,.13);border:1px solid rgba(247,198,0,.38);color:#ffe071;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:950}
.page-hero h1{margin:16px 0 10px;font-size:42px;line-height:1.04;letter-spacing:-.05em;color:#fff}
.page-hero p{margin:0;color:#d6d6d6;font-size:16px;max-width:760px}
.hero-kpis{display:grid;grid-template-columns:repeat(3,128px);gap:10px}
.kpi{padding:13px;border-radius:15px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.10)}
.kpi strong{display:block;color:var(--yellow);font-size:21px;line-height:1;font-weight:950;letter-spacing:-.03em}
.kpi span{display:block;margin-top:6px;color:#d8d8d8;font-weight:750;font-size:12px}
.section{margin-top:28px}
.section__head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:16px}
.section h2,.section-title{margin:0;color:#181818;font-size:31px;line-height:1.08;letter-spacing:-.045em;font-weight:950}
.section p{margin:7px 0 0;color:var(--muted);font-weight:650}
.grid{display:grid;gap:16px}
.grid.two{grid-template-columns:repeat(2,1fr)}
.grid.three{grid-template-columns:repeat(3,1fr)}
.grid.four{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);padding:20px;transition:.18s}
.card:hover{box-shadow:var(--shadow-md);border-color:#e9ca42;transform:translateY(-2px)}
.card h3{margin:0 0 8px;font-size:20px;letter-spacing:-.03em;line-height:1.18}
.card p{margin:0;color:#646b76;font-weight:650}
.card-icon{width:54px;height:54px;border-radius:17px;background:linear-gradient(145deg,#fff5c8,var(--yellow));display:grid;place-items:center;color:#111;box-shadow:0 10px 24px rgba(247,198,0,.2);margin-bottom:14px;font-size:23px}
.number{display:grid;place-items:center;width:40px;height:40px;border-radius:14px;background:#202020;color:var(--yellow);font-weight:950;margin-bottom:12px}
.btn{border:0;border-radius:14px;padding:13px 18px;font-weight:950;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.18s}
.btn--yellow{background:var(--yellow);color:#111;box-shadow:0 12px 26px rgba(247,198,0,.28)}
.btn--yellow:hover{background:#ffe06a;transform:translateY(-1px)}
.btn--dark{background:#222;color:#fff}
.btn--dark:hover{background:#000}
.btn--ghost{background:#f6f7f9;border:1px solid var(--line);color:#262a31}
.btn--ghost:hover{background:var(--yellow-soft);border-color:#f3d658}
.form-card{background:#fff;color:#111;border:1px solid var(--line);border-radius:22px;padding:24px;box-shadow:var(--shadow-sm)}
label{display:block;font-weight:950;margin:0 0 7px;color:#202020}
input,textarea,select{width:100%;border:1px solid var(--line);border-radius:13px;background:#f7f8fa;outline:0;padding:0 14px;margin-bottom:12px;font-weight:650;transition:.18s}
input,select{height:48px}
textarea{min-height:118px;padding-top:13px;resize:vertical}
input:focus,textarea:focus,select:focus{background:#fff;border-color:#e3bf20;box-shadow:0 0 0 4px rgba(247,198,0,.13)}
.hint{font-size:12px;color:#7d838c;margin-top:10px;font-weight:650}
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:22px;align-items:start}
.panel-dark{background:#202020;color:#fff;border-radius:24px;padding:28px;box-shadow:var(--shadow-md)}
.panel-dark h2{margin:0 0 12px;font-size:32px;line-height:1.08;letter-spacing:-.05em;color:#fff}
.panel-dark p{color:#d4d4d4}
.list-check{display:grid;gap:12px;margin:18px 0 0;padding:0;list-style:none}
.list-check li{display:flex;gap:10px;align-items:flex-start;font-weight:750;color:#e7e7e7}
.check{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;border-radius:999px;background:var(--yellow);color:#111;font-weight:950;font-size:12px}
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.step-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:var(--shadow-sm)}
.step-card:before{content:"";position:absolute;right:-18px;top:36px;width:36px;height:2px;background:#d9dce4}
.step-card:last-child:before{display:none}
.step-card .number{background:var(--yellow);color:#111}
.step-card h3{margin:0 0 8px;font-size:18px}
.step-card p{margin:0;color:#666d78;font-weight:650}
.note{background:var(--yellow-soft);border:1px solid #f3d658;border-radius:18px;padding:18px;color:#342900;font-weight:750}
.sidebar-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:22px;align-items:start}
.side-filter{position:sticky;top:170px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);padding:18px}
.side-filter h3{margin:0 0 12px;font-size:18px}
.chip-list{display:flex;gap:8px;flex-wrap:wrap}
.chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 12px;font-weight:850;color:#3b3f46}
.chip.active{background:var(--yellow);border-color:var(--yellow);color:#111}
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);padding:14px 16px;margin-bottom:16px}
.products{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.product{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;min-height:402px;transition:.18s}
.product:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:#e9ca42}
.product__media{height:184px;background:linear-gradient(135deg,#fafafa,#eceff4);position:relative;display:grid;place-items:center;overflow:hidden}
.product__media:before{content:"";position:absolute;width:160px;height:160px;border-radius:50%;background:rgba(247,198,0,.18);right:-62px;bottom:-70px}
.fake-img{width:96px;height:96px;border-radius:26px;background:#fff;display:grid;place-items:center;box-shadow:0 14px 34px rgba(22,22,22,.08);position:relative;z-index:1;color:#111;font-size:44px}
.sku{position:absolute;left:12px;top:12px;background:#fff;border:1px solid #edf0f5;border-radius:10px;padding:6px 8px;font-size:11px;color:#787e89;font-weight:950;z-index:2}
.heart{position:absolute;right:12px;top:12px;width:36px;height:36px;border-radius:50%;background:#fff;border:1px solid #edf0f5;display:grid;place-items:center;color:#c99b00;z-index:2}
.product__body{padding:15px;display:flex;flex-direction:column;gap:8px;flex:1}
.supplier{min-height:34px;color:#858b95;font-size:12px;line-height:1.35;font-weight:680}
.pname{font-size:15px;color:#20242a;font-weight:950;line-height:1.28;min-height:58px;letter-spacing:-.01em}
.price{font-size:27px;font-weight:950;letter-spacing:-.04em;color:#111;margin-top:auto}
.product__bottom{display:flex;align-items:center;gap:8px;margin-top:8px}
.details{height:42px;flex:1;border-radius:12px;background:#222;color:#fff;font-weight:950;display:grid;place-items:center;transition:.18s}
.details:hover{background:var(--yellow);color:#111}
.cart-btn{height:42px;width:44px;border-radius:12px;background:#f7f8fa;border:1px solid var(--line);display:grid;place-items:center;color:#111;transition:.18s}
.cart-btn:hover{background:var(--yellow)}
.product-page{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);gap:22px;align-items:start}
.gallery{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-sm);padding:18px}
.gallery__main{height:440px;border-radius:20px;background:linear-gradient(135deg,#f8f9fb,#eceff4);display:grid;place-items:center;position:relative;overflow:hidden}
.gallery__main:before{content:"";position:absolute;right:-80px;bottom:-100px;width:260px;height:260px;background:rgba(247,198,0,.22);border-radius:50%}
.gallery__main .fake-img{width:190px;height:190px;font-size:78px}
.thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:12px}
.thumb{height:74px;border-radius:14px;background:#f1f3f6;border:1px solid var(--line);display:grid;place-items:center;font-size:25px}
.buy-box{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-sm);padding:24px}
.buy-box h1{margin:0 0 12px;font-size:32px;line-height:1.1;letter-spacing:-.045em}
.meta{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 18px}
.meta span{border-radius:999px;background:#f6f7f9;border:1px solid var(--line);padding:8px 11px;font-weight:850;color:#565d68}
.buy-box .price{font-size:40px;margin:14px 0}
.benefits{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:16px}
.benefit{background:#f7f8fa;border:1px solid var(--line);border-radius:15px;padding:12px;font-weight:850}
.benefit b{display:block;color:#111;margin-bottom:4px}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.tab{background:#fff;border:1px solid var(--line);border-radius:999px;padding:10px 17px;font-weight:950;color:#343942;box-shadow:0 6px 18px rgba(22,22,22,.04)}
.tab.active{background:var(--yellow);border-color:var(--yellow);color:#111}
.specs{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--shadow-sm)}
.specs td{padding:13px 16px;border-bottom:1px solid var(--line);font-weight:700}
.specs tr:last-child td{border-bottom:0}
.specs td:first-child{color:#737a85;background:#fafafa;width:34%}
.faq-list{display:grid;gap:12px}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);overflow:hidden}
.faq-item summary{list-style:none;cursor:pointer;padding:18px 20px;font-size:18px;font-weight:950;display:flex;align-items:center;justify-content:space-between;gap:12px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:'+';display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;border-radius:10px;background:var(--yellow);font-size:20px}
.faq-item[open] summary:after{content:'–'}
.faq-item div{padding:0 20px 20px;color:#5f6672;font-weight:650}
.review-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.review-card{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);padding:20px}
.review-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}
.avatar{width:46px;height:46px;border-radius:15px;background:linear-gradient(145deg,#fff5c8,var(--yellow));display:grid;place-items:center;font-weight:950}
.stars{color:#e0ad00;font-size:18px;letter-spacing:1px}
.review-card h3{margin:0;font-size:17px}
.review-card .date{color:#858b95;font-weight:800;font-size:12px}
.auth-wrap{display:grid;place-items:center;min-height:560px}
.auth-card{width:min(480px,100%);background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-md);padding:28px}
.auth-card h1{margin:0 0 8px;font-size:34px;letter-spacing:-.045em}
.auth-card p{margin:0 0 20px;color:#68707b;font-weight:650}
.code-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.code-row input{text-align:center;font-size:22px;font-weight:950;padding:0}
.map{min-height:382px;border-radius:24px;background:linear-gradient(135deg,#e9edf3,#fff6cf);border:1px solid var(--line);box-shadow:var(--shadow-sm);position:relative;overflow:hidden;display:grid;place-items:center}
.map:before,.map:after{content:"";position:absolute;border:2px solid rgba(24,24,24,.08);border-radius:999px}
.map:before{width:560px;height:560px}
.map:after{width:330px;height:330px}
.pin{position:relative;z-index:1;display:grid;place-items:center;width:74px;height:74px;border-radius:24px;background:var(--black);color:var(--yellow);font-size:34px;box-shadow:0 16px 44px rgba(22,22,22,.18)}
.contact-row{display:flex;gap:12px;align-items:flex-start}
.contact-row b{display:block;font-size:16px}
.contact-row span{color:#6c7380;font-weight:650}
.footer{background:#1d1d1d;color:#e7e7e7;margin-top:36px;padding:44px 0 22px}
.footer__grid{display:grid;grid-template-columns:1.25fr .85fr .75fr .75fr .85fr;gap:28px}
.footer h4{margin:0 0 14px;color:#fff;font-size:16px;letter-spacing:-.01em}
.footer p,.footer a{color:#c9c9c9;font-weight:650}
.footer a{display:block;margin:9px 0;transition:.18s}
.footer a:hover{color:var(--yellow)}
.footer .logo__title{color:#fff}
.footer .logo{margin-bottom:12px}
.pay{margin-top:14px;display:flex;gap:8px;flex-wrap:wrap}
.pay span{height:28px;border-radius:8px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.09);display:grid;place-items:center;padding:0 10px;font-size:12px;font-weight:900;color:#fff}
.copy{border-top:1px solid rgba(255,255,255,.08);margin-top:30px;padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:14px;color:#9e9e9e;font-size:13px;font-weight:650}
@media (max-width:1150px){.header__inner{grid-template-columns:220px 1fr 178px;gap:18px}.page-hero__content,.split,.product-page,.sidebar-layout{grid-template-columns:1fr}.hero-kpis{grid-template-columns:repeat(3,1fr)}.side-filter{position:static}.products{grid-template-columns:repeat(2,1fr)}.timeline{grid-template-columns:repeat(2,1fr)}.step-card:before{display:none}.footer__grid{grid-template-columns:1fr 1fr 1fr}.grid.four{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){.topbar__inner{justify-content:center;flex-wrap:wrap;padding:8px 0}.topbar__links{display:none}.header__inner{height:auto;grid-template-columns:1fr;padding:16px 0}.actions{justify-content:flex-start}.search{order:3}.page-hero{padding:24px}.page-hero h1{font-size:33px}.hero-kpis{grid-template-columns:1fr}.grid.two,.grid.three,.grid.four,.products,.review-grid,.benefits{grid-template-columns:1fr}.toolbar{align-items:stretch;flex-direction:column}.timeline{grid-template-columns:1fr}.gallery__main{height:300px}.footer__grid{grid-template-columns:1fr}.copy{flex-direction:column;align-items:flex-start}.nav__inner{height:auto;padding:10px 0}.catalog-btn{padding:10px 14px}.section h2,.section-title{font-size:27px}.auth-wrap{min-height:440px}}

/* ---------------------------------------------------------------
   Главная: герой, категории, витрины товаров, блок заказа, блог
   --------------------------------------------------------------- */

:root{
      --yellow:#f7c600;
      --yellow-dark:#d7a800;
      --yellow-soft:#fff6cf;
      --black:#181818;
      --black-2:#232323;
      --text:#22242a;
      --muted:#7c828d;
      --line:#e7e9ee;
      --bg:#f5f6f8;
      --card:#ffffff;
      --radius:16px;
      --radius-lg:24px;
      --shadow-sm:0 8px 24px rgba(22,22,22,.06);
      --shadow-md:0 16px 44px rgba(22,22,22,.10);
      --container:1240px;
      --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
    }
body{
      margin:0;
      font-family:var(--font);
      background:var(--bg);
      color:var(--text);
      font-size:14px;
      line-height:1.45;
      -webkit-font-smoothing:antialiased;
      text-rendering:optimizeLegibility;
    }
button,input{font:inherit}
.svg{width:20px;height:20px;display:inline-block;vertical-align:middle}
.topbar__inner{height:42px;display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:13px}
.nav a:hover{background:#f4f5f7;color:#111}
.layout{display:grid;grid-template-columns:288px minmax(0,1fr);gap:22px;align-items:start}
.sidebar{position:sticky;top:170px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}
.sidebar__title{height:58px;background:var(--black-2);color:#fff;padding:0 18px;display:flex;align-items:center;justify-content:space-between;font-weight:950;letter-spacing:-.01em}
.sidebar__title span{display:grid;place-items:center;min-width:28px;height:28px;border-radius:999px;background:var(--yellow);color:#111;font-size:12px}
.menu{list-style:none;margin:0;padding:8px 0}
.menu a{display:flex;align-items:center;gap:11px;justify-content:space-between;padding:12px 16px;color:#292c32;border-bottom:1px solid #f0f1f4;font-weight:800;transition:.16s}
.menu li:last-child a{border-bottom:0}
.menu a:hover{background:#fff8d9;padding-left:18px}
.menu__left{display:flex;align-items:center;gap:10px;min-width:0}
.menu__icon{width:32px;height:32px;border-radius:10px;background:#f7f8fa;border:1px solid #edf0f5;display:grid;place-items:center;flex:0 0 auto;color:#1f1f1f}
.menu__name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.menu__arrow{color:#a5a8af;font-size:18px}
.content{min-width:0}
/* Hero */
    .hero{display:grid;grid-template-columns:1.15fr .85fr;gap:18px;margin-bottom:20px}
.hero__main{position:relative;overflow:hidden;border-radius:var(--radius-lg);background:linear-gradient(135deg,#252525 0%,#171717 60%,#2c2c2c 100%);color:#fff;box-shadow:var(--shadow-md);min-height:340px;padding:34px}
.hero__main:before{content:"";position:absolute;right:-80px;top:-90px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(247,198,0,.34),rgba(247,198,0,0) 70%)}
.hero__main:after{content:"";position:absolute;right:70px;bottom:-86px;width:240px;height:240px;border-radius:50%;background:rgba(247,198,0,.16);filter:blur(2px)}
.hero__label{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(247,198,0,.12);border:1px solid rgba(247,198,0,.36);color:#ffe071;font-weight:900;font-size:13px;position:relative;z-index:1}
.hero h1{position:relative;z-index:1;margin:18px 0 12px;font-size:44px;line-height:1.02;letter-spacing:-.05em;max-width:690px;color:#fff}
.hero p{position:relative;z-index:1;margin:0;color:#d9d9d9;font-size:16px;max-width:620px}
.hero__cta{position:relative;z-index:1;display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.btn{border:0;border-radius:14px;padding:13px 18px;font-weight:950;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:.18s}
.btn--dark{background:rgba(255,255,255,.09);color:#fff;border:1px solid rgba(255,255,255,.14)}
.btn--dark:hover{background:rgba(255,255,255,.14)}
.hero__stats{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:28px;max-width:620px}
.stat{padding:13px;border-radius:15px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.10)}
.stat strong{display:block;color:var(--yellow);font-size:22px;line-height:1;font-weight:950;letter-spacing:-.03em}
.stat span{display:block;margin-top:6px;color:#d8d8d8;font-weight:750;font-size:12px}
.hero__side{display:grid;gap:14px}
.mini-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:22px;position:relative;overflow:hidden}
.mini-card--yellow{background:linear-gradient(145deg,var(--yellow),#ffe574);color:#111;border:0}
.mini-card h3{margin:0 0 8px;font-size:23px;letter-spacing:-.035em;line-height:1.12}
.mini-card p{margin:0;color:#5d626c;font-weight:650}
.mini-card--yellow p{color:#4e4200}
.mini-card__icon{width:48px;height:48px;border-radius:14px;background:#fff;display:grid;place-items:center;margin-bottom:14px;box-shadow:0 8px 22px rgba(0,0,0,.08)}
.mini-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mini-row .mini-card{min-height:145px;padding:18px}
.mini-row .mini-card h3{font-size:18px}
.section h2{margin:0;color:#181818;font-size:31px;line-height:1.08;letter-spacing:-.045em;font-weight:950}
.link{display:inline-flex;align-items:center;gap:8px;font-weight:950;color:#bd9200;border-radius:999px;padding:8px 10px;transition:.18s;white-space:nowrap}
.link:hover{background:#fff4c0;color:#111}
.categories{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.cat-card{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);padding:18px;min-height:236px;display:flex;flex-direction:column;position:relative;overflow:hidden;transition:.18s}
.cat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:#e9ca42}
.cat-card:before{content:"";position:absolute;right:-44px;top:-48px;width:136px;height:136px;border-radius:50%;background:rgba(247,198,0,.16)}
.cat-card__top{display:flex;align-items:center;gap:13px;position:relative;z-index:1;margin-bottom:12px}
.cat-card__icon{width:58px;height:58px;border-radius:17px;background:linear-gradient(145deg,#fff5c8,var(--yellow));display:grid;place-items:center;color:#111;box-shadow:0 10px 24px rgba(247,198,0,.2);flex:0 0 auto}
.cat-card h3{margin:0;font-size:18px;line-height:1.18;letter-spacing:-.02em;color:#1f1f1f}
.cat-card ul{margin:0 0 16px;padding-left:18px;position:relative;z-index:1;color:#5b606b;line-height:1.85;font-weight:680}
.cat-card .more-link{margin-top:auto;align-self:flex-start;background:#f5f6f8;border-radius:12px;padding:10px 13px;font-weight:950;color:#222;position:relative;z-index:1;transition:.18s}
.cat-card .more-link:hover{background:var(--yellow)}
.tabs{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:16px}
.products{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.product__fake-img{width:96px;height:96px;border-radius:26px;background:#fff;display:grid;place-items:center;box-shadow:0 14px 34px rgba(22,22,22,.08);position:relative;z-index:1;color:#111}
/* Заказ по ссылке */
    .order{margin-top:34px;border-radius:24px;overflow:hidden;background:#202020;color:#fff;box-shadow:var(--shadow-md);display:grid;grid-template-columns:1.13fr .87fr}
.order__text{padding:34px;position:relative;overflow:hidden}
.order__text:after{content:"";position:absolute;right:-60px;bottom:-80px;width:240px;height:240px;border-radius:50%;background:rgba(247,198,0,.12)}
.badge{display:inline-flex;align-items:center;gap:8px;background:rgba(247,198,0,.13);border:1px solid rgba(247,198,0,.38);color:#ffe071;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:950;position:relative;z-index:1}
.order h2{position:relative;z-index:1;margin:18px 0 10px;font-size:34px;line-height:1.07;letter-spacing:-.05em;color:#fff}
.order p{position:relative;z-index:1;margin:0;color:#d4d4d4;font-size:15px;max-width:650px}
.steps{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:24px}
.step{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.11);border-radius:16px;padding:14px;font-weight:850;color:#f5f5f5}
.step span{display:block;color:var(--yellow);font-size:22px;font-weight:950;margin-bottom:5px}
.form{background:#fff;color:#111;padding:24px}
.form label{display:block;font-weight:950;margin:0 0 7px;color:#202020}
.form input{width:100%;height:48px;border:1px solid var(--line);border-radius:13px;background:#f7f8fa;outline:0;padding:0 14px;margin-bottom:12px;font-weight:650;transition:.18s}
.form input:focus{background:#fff;border-color:#e3bf20;box-shadow:0 0 0 4px rgba(247,198,0,.13)}
.form button{width:100%;height:50px;border:0;border-radius:14px;background:var(--yellow);color:#111;font-weight:950;cursor:pointer;transition:.18s;margin-top:4px}
.form button:hover{background:#ffe06a}
.form__hint{font-size:12px;color:#7d838c;margin-top:10px;font-weight:650}
.blog{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.post{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);overflow:hidden;transition:.18s}
.post:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:#e9ca42}
.post__image{height:148px;background:linear-gradient(135deg,#fff5bd,#eceff4);display:grid;place-items:center;position:relative;color:#111}
.post__image:before{content:"";position:absolute;right:-50px;bottom:-58px;width:130px;height:130px;border-radius:50%;background:rgba(247,198,0,.28)}
.post__image svg{position:relative;z-index:1;width:50px;height:50px}
.post__body{padding:15px}
.post__tag{color:#b98e00;font-size:12px;font-weight:950;text-transform:uppercase;letter-spacing:.04em}
.post h3{margin:7px 0 10px;font-size:16px;line-height:1.25;color:#1f2228;letter-spacing:-.02em}
.date{font-size:13px;color:#858b95;font-weight:700}
@media (max-width:1150px){
      .header__inner{grid-template-columns:220px 1fr 178px;gap:18px}
      .layout{grid-template-columns:1fr}
      .sidebar{position:static}
      .menu{display:grid;grid-template-columns:repeat(2,1fr)}
      .menu a{border-right:1px solid #f0f1f4}
      .hero{grid-template-columns:1fr}
      .hero__side{grid-template-columns:1fr 1fr}
      .mini-row{grid-template-columns:1fr}
      .quick{grid-template-columns:repeat(3,1fr)}
      .products{grid-template-columns:repeat(3,1fr)}
      .footer__grid{grid-template-columns:repeat(2,1fr)}
    }
@media (max-width:850px){
      .topbar__inner{height:auto;padding:10px 0;align-items:flex-start;flex-direction:column;gap:6px}
      .topbar__links,.topbar__contacts{flex-wrap:wrap;gap:10px}
      .header__inner{height:auto;padding:16px 0;grid-template-columns:1fr;gap:14px}
      .actions{justify-content:flex-start}
      .nav__inner{height:56px}
      .hero__main{padding:24px;min-height:auto}
      .hero h1{font-size:36px}
      .hero__stats{grid-template-columns:1fr}
      .hero__side{grid-template-columns:1fr}
      .quick{grid-template-columns:repeat(2,1fr)}
      .categories,.products,.blog,.order{grid-template-columns:1fr}
      .steps{grid-template-columns:1fr}
      .section__head{align-items:flex-start;flex-direction:column}
      .menu{grid-template-columns:1fr}
      .footer__grid{grid-template-columns:1fr}
      .copy{align-items:flex-start;flex-direction:column}
    }
@media (max-width:520px){
      .wrap{width:min(100% - 22px,var(--container))}
      .hero h1{font-size:31px}
      .section h2{font-size:27px}
      .quick{grid-template-columns:1fr}
      .action span:not(.action__count){display:none}
      .search button{padding:0 14px}
    }
.blog-banner{
  background:linear-gradient(135deg,#fff7cf,#ffffff);
  position:relative;
  overflow:hidden;
}
.blog-banner span{
  position:relative;
  z-index:2;
  font-size:46px;
  filter:drop-shadow(0 8px 12px rgba(0,0,0,.12));
}
.blog-banner:after{
  content:'';
  position:absolute;
  right:-35px;
  bottom:-45px;
  width:150px;
  height:150px;
  border-radius:50%;
  background:rgba(247,198,0,.35);
}
.blog-banner--factory{
  background:linear-gradient(135deg,#232323,#3b3520);
}
.blog-banner--factory span{
  filter:grayscale(.2) brightness(1.2);
}
.blog-banner--import{
  background:linear-gradient(135deg,#fff4b8,#f5f6f8);
}
.blog-banner--market{
  background:linear-gradient(135deg,#222,#4b4118);
}

/* ---------------------------------------------------------------
   Корзина и избранное
   --------------------------------------------------------------- */

.simple-page{min-height:260px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);padding:46px 0 58px}
.simple-page h1{max-width:860px;margin:0 auto;color:#2d4776;font-size:34px;line-height:1.15;letter-spacing:-.035em;font-weight:800}
.favorite-tools{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px;flex-wrap:wrap}
.favorite-summary{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.favorite-summary .pill{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;border-radius:999px;padding:9px 13px;font-weight:900;color:#3b3f46;box-shadow:var(--shadow-sm)}
.favorite-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:22px;align-items:start}
.favorite-aside{position:sticky;top:170px;background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow-sm);padding:22px}
.favorite-aside h3{margin:0 0 10px;font-size:20px;letter-spacing:-.03em}
.favorite-aside p{margin:0 0 16px;color:#67707c;font-weight:650}
.favorite-card .product-img{position:relative}
.favorite-badge{position:absolute;left:12px;top:12px;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:999px;padding:6px 10px;font-weight:950;color:#d99e00;box-shadow:0 8px 20px rgba(0,0,0,.08)}
.fav-heart{position:absolute;right:12px;top:12px;width:38px;height:38px;border-radius:13px;border:0;background:var(--yellow);color:#111;font-size:20px;display:grid;place-items:center;box-shadow:0 12px 26px rgba(247,198,0,.28);cursor:pointer}
.empty-favorite{display:grid;grid-template-columns:1fr .75fr;gap:22px;align-items:center;border:1px dashed #f0cd37;background:linear-gradient(135deg,#fff,#fff7cf);border-radius:24px;padding:30px;box-shadow:var(--shadow-sm);margin-bottom:22px}
.empty-favorite h2{margin:0 0 8px;font-size:30px;letter-spacing:-.045em}
.empty-favorite p{margin:0 0 18px;color:#69717d;font-weight:650}
.empty-visual{height:230px;border-radius:22px;background:radial-gradient(circle at 50% 35%,rgba(247,198,0,.5),rgba(247,198,0,.1) 38%,transparent 70%),linear-gradient(135deg,#222,#111);display:grid;place-items:center;color:var(--yellow);font-size:76px;box-shadow:var(--shadow-md)}
@media (max-width:980px){.favorite-layout{grid-template-columns:1fr}.favorite-aside{position:static}.empty-favorite{grid-template-columns:1fr}.empty-visual{height:170px}}

/* ---------------------------------------------------------------
   Доставка: шаги
   --------------------------------------------------------------- */

.delivery-steps{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:18px}
.delivery-step{position:relative;background:linear-gradient(135deg,#fff,#fff8dc);border:1px solid #f3d658;border-radius:18px;padding:18px 18px 18px 58px;font-weight:850;color:#252525;box-shadow:0 10px 24px rgba(247,198,0,.12);min-height:82px;display:flex;align-items:center}
.delivery-step strong{position:absolute;left:16px;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;background:#181818;color:#f7c600;display:grid;place-items:center;font-size:14px;font-weight:950}
.delivery-step:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(22,22,22,.12)}

/* ---------------------------------------------------------------
   Заказ по ссылке: процесс
   --------------------------------------------------------------- */

.process-title{margin-bottom:20px}
.process-title h2{font-size:34px!important}
.process-sub{color:#cfcfcf!important;font-size:15px}
.panel-dark .timeline{gap:18px}
.panel-dark .step-card{background:linear-gradient(145deg,#ffffff,#f5f6f8);border:1px solid rgba(255,255,255,.12);min-height:210px;padding:22px 18px;display:flex;flex-direction:column;transition:.2s}
.panel-dark .step-card:hover{transform:translateY(-5px);box-shadow:0 18px 35px rgba(0,0,0,.25)}
.panel-dark .step-card .number{width:46px;height:46px;border-radius:50%;font-size:15px;box-shadow:0 8px 18px rgba(247,198,0,.35);margin-bottom:18px}
.panel-dark .step-card h3{font-size:19px;margin-bottom:10px;color:#171717}
.panel-dark .step-card p{font-size:14px;line-height:1.45;color:#626975}

/* ---------------------------------------------------------------
   Карточка товара
   --------------------------------------------------------------- */

.buy-box .badge{
  color:#111;
}

/* ---------------------------------------------------------------
   Отзывы
   --------------------------------------------------------------- */

.page-hero h1{margin:16px 0 10px;font-size:38px;white-space:nowrap;line-height:1.04;letter-spacing:-.05em;color:#fff}
@media (max-width:760px){
.page-hero h1{white-space:normal;}.topbar__inner{justify-content:center;flex-wrap:wrap;padding:8px 0}.topbar__links{display:none}.header__inner{height:auto;grid-template-columns:1fr;padding:16px 0}.actions{justify-content:flex-start}.search{order:3}.page-hero{padding:24px}.page-hero h1{font-size:33px}.hero-kpis{grid-template-columns:1fr}.grid.two,.grid.three,.grid.four,.products,.review-grid,.benefits{grid-template-columns:1fr}.toolbar{align-items:stretch;flex-direction:column}.timeline{grid-template-columns:1fr}.gallery__main{height:300px}.footer__grid{grid-template-columns:1fr}.copy{flex-direction:column;align-items:flex-start}.nav__inner{height:auto;padding:10px 0}.catalog-btn{padding:10px 14px}.section h2,.section-title{font-size:27px}.auth-wrap{min-height:440px}}

/* ---------------------------------------------------------------
   Дополнено при интеграции: элементы, которых не было в макетах —
   мобильное меню, выпадающий каталог, уведомления, пагинация.
   Свёрстано в тех же переменных и радиусах, что и остальное.
   --------------------------------------------------------------- */

/* Бургер — только на узких экранах */
.action--burger{display:none;background:none;border:0;cursor:pointer;color:inherit}

/* Выпадающий каталог из кнопки «По всем категориям» */
.catalog-drop{position:absolute;left:0;right:0;z-index:39;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow-md)}
.catalog-drop[hidden]{display:none}
.catalog-drop__inner{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px 26px;padding:24px 0 28px}
.catalog-drop__col{min-width:0}
.catalog-drop__title{display:block;font-weight:800;font-size:14px;color:#151515;margin-bottom:8px;letter-spacing:-.01em}
.catalog-drop__title:hover{color:var(--yellow-dark)}
.catalog-drop__link{display:block;font-size:13px;color:var(--muted);padding:3px 0}
.catalog-drop__link:hover{color:var(--text)}

/* Мобильное меню */
.mobile-menu{position:fixed;inset:0 0 0 auto;width:min(320px,86vw);z-index:60;background:#fff;overflow-y:auto;box-shadow:-14px 0 44px rgba(0,0,0,.18)}
.mobile-menu[hidden]{display:none}
.mobile-menu__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;background:var(--black);color:#fff;font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.04em}
.mobile-menu__head button{background:none;border:0;color:#fff;font-size:18px;cursor:pointer;line-height:1}
.mobile-menu__nav{display:flex;flex-direction:column;padding:6px 0}
.mobile-menu__nav a{padding:11px 18px;font-size:14px;font-weight:600;border-bottom:1px solid var(--line)}
.mobile-menu__nav a:hover{background:var(--yellow-soft)}
.menu-backdrop{position:fixed;inset:0;z-index:55;background:rgba(15,15,18,.45)}
.menu-backdrop[hidden]{display:none}

/* Уведомления */
.flash{margin:18px 0;padding:13px 16px;border-radius:var(--radius);font-size:14px;font-weight:600;border:1px solid}
.flash--ok{background:#eefaf1;border-color:#bfe7cb;color:#1d6b37}
.flash--err{background:#fdeeee;border-color:#f2c3c3;color:#a32626}

/* Пагинация. Разметка берётся из vendor/pagination/custom.blade.php */
.pagination{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;margin:28px 0 6px;padding:0;list-style:none}
.pagination .page-item{margin:0}
.page-link{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;border:1px solid var(--line);background:#fff;border-radius:12px;font-size:14px;font-weight:800;color:var(--text)}
a.page-link:hover{border-color:var(--yellow);background:var(--yellow-soft)}
.page-link.active{background:var(--yellow);border-color:var(--yellow);color:#111}
.page-item.disabled .page-link{opacity:.45}
.page-prev:before{content:"‹"}
.page-next:before{content:"›"}

/* Пустые состояния и мелочи, общие для нескольких страниц */
.empty-state{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);padding:46px 24px;text-align:center}
.empty-state h2{margin:0 0 8px;font-size:22px;letter-spacing:-.02em}
.empty-state p{margin:0 0 18px;color:var(--muted)}

@media (max-width:980px){
  .action--burger{display:inline-flex;align-items:center}
  .nav__inner{overflow-x:auto;scrollbar-width:none}
  .nav__inner::-webkit-scrollbar{display:none}
  .header__inner{grid-template-columns:1fr auto;gap:14px;height:auto;padding:12px 0}
  .search{grid-column:1/-1;order:3}
  .footer__grid{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:520px){
  .footer__grid{grid-template-columns:1fr}
  .copy{flex-direction:column;gap:8px;align-items:flex-start}
}

/* Реальные изображения вместо эмодзи-заглушек из макетов */
/* Фото занимает всю область карточки: в макетах на этом месте была
   эмодзи-заглушка в белом квадрате, для реальных фото это не нужно. */
.product__media{background:#fff}
.product__media .product-img{grid-area:1/1;width:100%;height:100%;object-fit:cover;display:block;z-index:1}

/* Карточка сведена к названию товара и цене.
   Название показываем целиком — без обрезки и многоточий. */
.product{min-height:0}
.product .pname{min-height:0;overflow:visible;text-overflow:clip;white-space:normal}
.product:hover .pname{color:var(--yellow-dark)}
.cat-card__icon img{width:34px;height:34px;object-fit:contain}
.menu__icon img{width:20px;height:20px;object-fit:contain}
.post__image{overflow:hidden}
.post__image .post-img{width:100%;height:100%;object-fit:cover;position:relative;z-index:1}
.supplier a{color:inherit}
.supplier a:hover{color:var(--text)}
.cart-btn{border:1px solid var(--line);cursor:pointer;font-size:16px}
.heart{cursor:pointer;font-size:16px;text-decoration:none}
.heart.active{background:var(--yellow);border-color:var(--yellow);color:#111}
.tab{border:0;cursor:pointer;font:inherit}
.stat{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:12px 14px}
.stat strong{display:block;font-size:19px;color:#fff;letter-spacing:-.02em}
.stat span{font-size:12px;color:#c9c9c9}
.cat-card__top h3 a{color:inherit}
.post__body h3 a{color:inherit}

/* Каталог: SEO-текст и счётчик в списке подкатегорий */
.category-seo-text{margin-top:26px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);padding:22px 24px;font-size:14px;line-height:1.6;color:#3b4048}
.category-seo-text h2,.category-seo-text h3{margin:0 0 10px;font-size:19px;letter-spacing:-.02em;color:#181818}
.category-seo-text p{margin:0 0 12px}
.category-seo-text p:last-child{margin:0}
.menu .number{font-size:12px;color:var(--muted);font-weight:800}
.side-filter form{display:grid;gap:6px}
.side-filter .btn{margin-top:12px;justify-content:center;text-align:center}

/* ---------------------------------------------------------------
   Карточка товара: галерея, варианты, количество, производитель
   --------------------------------------------------------------- */

.gallery__main{display:grid;place-items:center;overflow:hidden}
.gallery__main img{width:100%;height:100%;max-height:420px;object-fit:contain}
/* Миниатюры — горизонтальная лента одинаковых плиток с прокруткой,
   а не сетка: фотографий у товара может быть сколько угодно. */
.thumbs{display:flex;flex-wrap:nowrap;gap:10px;margin-top:12px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:6px;scrollbar-width:thin;scrollbar-color:#d6dae1 transparent}
.thumbs::-webkit-scrollbar{height:6px}
.thumbs::-webkit-scrollbar-track{background:transparent}
.thumbs::-webkit-scrollbar-thumb{background:#d6dae1;border-radius:6px}
.thumb{flex:0 0 92px;width:92px;height:74px;padding:0;overflow:hidden;cursor:pointer;border:1px solid var(--line);background:#fff;border-radius:14px;scroll-snap-align:start;transition:.18s}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.thumb.active{border-color:var(--yellow);box-shadow:0 0 0 3px rgba(247,198,0,.22)}

.variant-block{margin:14px 0}
.variant-block__name{display:block;font-weight:900;font-size:13px;margin-bottom:8px;color:#2b2f36}
.list-colors{display:flex;gap:8px;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.variant-item{width:52px;height:52px;border-radius:13px;border:1px solid var(--line);overflow:hidden;background:#fff}
.variant-item img{width:100%;height:100%;object-fit:cover}

.buy-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:18px 0}
.buy-row .btn{flex:1;min-width:180px}
.buy-row .btn--ghost{flex:0 0 auto;min-width:52px;font-size:17px}
.buy-row .btn--ghost.active{background:var(--yellow);border-color:var(--yellow)}
.qty{display:flex;align-items:center;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;flex:0 0 auto}
.qty button{width:40px;height:48px;border:0;background:#f7f8fa;cursor:pointer;font-size:17px;font-weight:900;color:#333}
.qty button:hover{background:var(--yellow-soft)}
.qty input{width:62px;height:48px;border:0;text-align:center;font-weight:900;outline:0;-moz-appearance:textfield}
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

.certificates{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.certificates__label{font-weight:900;font-size:13px}
.certificates ul{margin:8px 0 0;padding-left:18px;color:#4a505a}
.certificates a{color:#b68d00;font-weight:800;margin-left:4px}

.vendor-row{display:flex;gap:18px;align-items:center;margin-top:12px;flex-wrap:wrap}
.vendor-logo{width:92px;height:92px;object-fit:contain;border:1px solid var(--line);border-radius:16px;background:#fff;padding:10px}
.vendor-row h3{margin:0 0 6px;font-size:19px;letter-spacing:-.02em}
.vendor-row p{margin:0 0 8px}

/* Вход и регистрация: соцкнопки под формой */
.auth-social{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);text-align:center}
.auth-social__label{display:block;font-size:12px;color:var(--muted);font-weight:750;margin-bottom:10px}
.auth-social .btn{width:100%}
.auth-card [data-auth-message]{margin-bottom:14px}

/* ---------------------------------------------------------------
   Корзина
   --------------------------------------------------------------- */

.cart-list{display:grid;gap:12px}
.cart-row{display:grid;grid-template-columns:96px minmax(0,1fr) 120px auto 120px 44px;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);padding:14px}
.cart-row__media{width:96px;height:96px;border-radius:14px;background:#f7f8fa;display:grid;place-items:center;overflow:hidden}
.cart-row__media img{width:100%;height:100%;object-fit:contain;padding:8px}
.cart-row__name{font-weight:900;font-size:15px;line-height:1.3;color:#1f2228;letter-spacing:-.01em}
.cart-row__name:hover{color:var(--yellow-dark)}
.cart-row__variants{margin:6px 0 0;padding-left:16px;font-size:12px;color:var(--muted)}
.cart-row__price,.cart-row__sum{font-weight:950;font-size:16px;color:#1f2228}
.cart-row__price-mobile{display:none;font-weight:900;color:var(--muted);font-size:13px;margin-top:6px}
.cart-row__remove{width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:#f7f8fa;cursor:pointer;color:#8b919b;font-size:15px;font-weight:900}
.cart-row__remove:hover{background:#fdeeee;border-color:#f2c3c3;color:#a32626}
.cart-actions{display:flex;gap:10px;justify-content:space-between;flex-wrap:wrap;margin-top:18px}
.cart-total{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:12px 0}
.cart-total strong{font-size:22px;letter-spacing:-.03em}

@media (max-width:850px){
  .cart-row{grid-template-columns:76px minmax(0,1fr) 44px;gap:12px}
  .cart-row__media{width:76px;height:76px}
  .cart-row__price,.cart-row__sum{display:none}
  .cart-row__price-mobile{display:block}
  .cart-row .qty{grid-column:2}
}

/* Бренды и статья блога */
.brand-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.brand-card{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);overflow:hidden;transition:.18s;display:flex;flex-direction:column}
.brand-card:hover{box-shadow:var(--shadow-md);border-color:#e9ca42;transform:translateY(-2px)}
.brand-card__logo{height:132px;background:linear-gradient(135deg,#fafafa,#eceff4);display:grid;place-items:center;padding:16px}
.brand-card__logo img{max-width:100%;max-height:100%;object-fit:contain}
.brand-card__body{padding:14px 16px 16px;display:grid;gap:4px}
.brand-card__name{font-weight:950;font-size:15px;color:#20242a;line-height:1.3;letter-spacing:-.01em}
.brand-card__name:hover{color:var(--yellow-dark)}
.brand-card__count{margin-top:4px;font-size:12px;font-weight:850;color:#b68d00}

.article__cover{border-radius:var(--radius-lg);overflow:hidden;margin-bottom:20px;box-shadow:var(--shadow-sm);background:#fff}
.article__cover img{width:100%;max-height:420px;object-fit:cover;display:block}
.article__body{font-size:15px;line-height:1.65;color:#3b4048}
.article__body h2,.article__body h3{margin:22px 0 10px;letter-spacing:-.02em;color:#181818}
.article__body p{margin:0 0 14px}
.article__body img{max-width:100%;height:auto;border-radius:14px}
.article__body ul,.article__body ol{padding-left:20px}

/* ---------------------------------------------------------------
   Оформление заказа, результат оплаты, личный кабинет
   --------------------------------------------------------------- */

.checkout-items{display:grid;gap:10px;margin-top:6px}
.checkout-item{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:baseline;font-size:13px}
.checkout-item__name{color:#3b4048;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.checkout-item__qty{color:var(--muted);font-weight:800}
.checkout-item__sum{font-weight:900;color:#1f2228}

.result-card{max-width:640px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:34px;text-align:center}
.result-card h1{margin:14px 0 8px;font-size:30px;letter-spacing:-.04em}
.result-card p{margin:0 0 16px;color:#4a505a}
.result-card .specs{text-align:left;margin:0 0 16px}
.result-card__icon{width:80px;height:80px;border-radius:50%;display:grid;place-items:center;margin:0 auto}
.result-card__icon--ok{background:#eefaf1;color:#1d9c4b}
.result-card__icon--err{background:#fdeeee;color:#d43b3b}

.order-list{display:grid;gap:14px}
.order-card{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);overflow:hidden}
.order-card__head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:16px 18px;border-bottom:1px solid var(--line)}
.order-card__head h3{margin:0 0 2px;font-size:17px;letter-spacing:-.02em}
.order-status{border-radius:999px;padding:6px 12px;font-size:12px;font-weight:900;background:#f4f5f7;color:#4a505a}
.order-status--processing{background:#eefaf1;color:#1d6b37}
.order-status--cancelled{background:#fdeeee;color:#a32626}
.order-status--pending{background:var(--yellow-soft);color:#8a6b00}
.order-card__items{display:grid;gap:12px;padding:16px 18px}
.order-item{display:grid;grid-template-columns:56px minmax(0,1fr) auto auto;gap:12px;align-items:center}
.order-item__media{width:56px;height:56px;border-radius:12px;background:#f7f8fa;overflow:hidden;display:grid;place-items:center}
.order-item__media img{width:100%;height:100%;object-fit:contain;padding:5px}
.order-item__name{font-weight:800;font-size:14px;line-height:1.3;color:#20242a}
.order-item__name:hover{color:var(--yellow-dark)}
.order-card__foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 18px;border-top:1px solid var(--line);background:#fbfbfc}
.order-paid{font-weight:900;color:#1d9c4b}

@media (max-width:760px){
  .order-item{grid-template-columns:48px minmax(0,1fr);row-gap:4px}
  .order-item__media{width:48px;height:48px}
}
