/* === Montserrat (woff2 only) === */
@font-face{
  font-family:"Montserrat";
  src:url("/wp-content/themes/kuko-main-theme/assets/fonts/Montserrat/Montserrat-Regular.woff2") format("woff2");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Montserrat";
  src:url("/wp-content/themes/kuko-main-theme/assets/fonts/Montserrat/Montserrat-SemiBold.woff2") format("woff2");
  font-weight:600;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Montserrat";
  src:url("/wp-content/themes/kuko-main-theme/assets/fonts/Montserrat/Montserrat-Bold.woff2") format("woff2");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Montserrat";
  src:url("/wp-content/themes/kuko-main-theme/assets/fonts/Montserrat/Montserrat-ExtraBold.woff2") format("woff2");
  font-weight:800;
  font-style:normal;
  font-display:swap;
}

/* ===== TOKENS ===== */
:root {
  --brand:#c8102e;

  /* light */
  --bg:#ffffff;
  --bg-elev:#f7f7f7;
  --card:#ffffff;
  --text:#353535;
  --muted:#666666;
  --border:#e5e5e5;
  --link:#c8102e;
  --link-hover:#f11337;
  --focus:#1e40af33;
  --green:#2bad67;
  --green-hover:#31c374;
  --yellow:#a4ad2b;
  --red:#ab5f5f;

  --container: 1520px; /* макс-ширина контента */
  --header-h: 64px;
}
html[data-theme="dark"]{
  --bg:#323232;
  --bg-elev:#232323;
  --card:#3b3b3b;
  --text:#e3e3e3;
  --muted:#bdbdbd;
  --border:#4a4a4a;
  --link:#c8102e;
  --link-hover:#f11337;
  --focus:#9bb5ff33;
  --green-hover:#31c374;  
  --green:#2bad67;
  --yellow:#a4ad2b;
  --red:#e95e5e;
}

/* На момент инициализации темы отключаем переходы, чтобы не мигало */
.no-trans *, .no-trans *::before, .no-trans *::after {
  transition: none !important;
}
p {line-height: normal;}
@media (max-width: 900px){
h1, h2, h3, h4 {line-height:1.2}
}
h1, h2, h3, h4 {font-weight: 600}
h2 {font-size: 1.30em;}
h3 {font-size: 1.17em;}



    line-height: 1.1;
/* ===== BASE ===== */
*{box-sizing:border-box}
body{
  margin:0;
  font-family:"Montserrat", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  line-height:1.6;
  background:var(--bg);
  color:var(--text);
  transition:background .2s,color .2s;
}

:focus-visible{outline:1px solid var(--link);}
@media (max-width: 768px) {
.container{width:95%; margin:0 auto}
}
@media (min-width: 769px) {
.container{width:92%; margin:0 auto}
}
.container{max-width:var(--container);}

/* === Глобальная нормализация иконок (СПРАЙТ) === */
/* Иконки наследуют цвет от родителя (динамично при смене темы) */
:where(svg.icon){
  inline-size: 22px;
  block-size: 22px;
  display: inline-block;
  vertical-align: -0.2em;
  color: inherit;
}
/* Принудительно перекрашиваем «жёсткие» fill/stroke из символов в currentColor */
:where(svg.icon) *[fill]{   fill: currentColor !important; }
:where(svg.icon) *[stroke]{ stroke: currentColor !important; }

/* Утилиты размеров (по желанию) */
.icon-16{ font-size:16px; }
.icon-18{ font-size:18px; }
.icon-20{ font-size:20px; }
.icon-22{ font-size:22px; }
.icon-24{ font-size:24px; }

/* ===== HEADER ===== */
.site-header{background:var(--bg-elev); border-bottom:1px solid var(--border); position:sticky; top:0; z-index:100}
.header-bar{
  display:grid; grid-template-columns:auto auto 1fr auto auto;
  align-items:center; gap:16px; min-height:var(--header-h); padding:8px 0;
  color: var(--text); /* единый источник цвета для всех контролов хедера */
}
.brand{font-weight:700; color:var(--text); text-decoration:none}
.header-actions{display:flex; gap:10px; align-items:center}

/* === Logo switch: показывать только один логотип === */
/* по умолчанию: светлый виден, тёмный скрыт */
.brand .brand-logo--dark { display: none !important; }
/* ручной тёмный режим через data-theme */
html[data-theme="dark"] .brand .brand-logo--light { display: none !important; }
html[data-theme="dark"] .brand .brand-logo--dark  { display: inline-block !important; }
/* фолбэк по системной теме, если data-theme ещё не проставлен (исключаем FOUC) */
@media (prefers-color-scheme: dark){
  html:not([data-theme]) .brand .brand-logo--light { display: none !important; }
  html:not([data-theme]) .brand .brand-logo--dark  { display: inline-block !important; }
}
/* на всякий случай — защита от wc img {max-width:100%} и пр. */
.brand .brand-logo--light,
.brand .brand-logo--dark {
  height: 40px;
  width: auto;
  max-width: none !important;
  vertical-align: middle;
}

/* поиск в шапке */
.header-search form{display:flex; align-items:center; gap:8px}
.header-search input[type="search"]{width:100%; padding:8px 12px; border-radius:10px; border:1px solid var(--border); background:var(--card); color:var(--text)}
.header-search input[type="submit"]{display:none}
.dgwt-wcas-ico-magnifier, .dgwt-wcas-ico-submit, .dgwt-wcas-close {
    color: var(--text)!important;
}
/* бургер (иконка из спрайта) */
.burger{
  width:40px; height:40px; border-radius:10px;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--card); border:1px solid var(--border);
  color: inherit; /* важное: наследуем цвет хедера */
}
.burger .icon{ font-size:24px; }

/* основное меню */
.main-nav { overflow: hidden; }
.menu--header { display:flex; gap:18px; list-style:none; margin:0; padding:0; flex-wrap:nowrap; }
.menu--header > li > a { text-decoration:none; color:var(--text); padding:6px 8px; border-radius:8px; }
.menu--header > li > a:hover { background: var(--bg-elev); }
.main-nav.is-collapsed { display:none; }

/* Кнопки */
.btn{appearance:none; border:1px solid var(--border); background:var(--card); padding:8px;border-radius:10px;display: flex;align-items: center;font-family: "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; cursor:pointer; color:var(--text)}
.btn:hover{color: #fff; border:1px solid var(--link-hover);background: #f11337}
.btn-primary{background:var(--brand); color:#fff; border-color:var(--brand)}
.btn-primary:hover{filter:brightness(.95)}

/* переключатель темы — теперь иконки из спрайта */
.theme-toggle .icon{ font-size:20px; }
html[data-theme="dark"] .theme-toggle .icon-sun{display:none}
html[data-theme="light"] .theme-toggle .icon-moon{display:none}

/* ===== MAIN ===== */
.site-main{padding:16px 0}
.entry{padding:16px 0;}
.entry-title{margin:0 0 32px}
a{color:var(--link);text-decoration:none}
a:hover{color:var(--link-hover)}

/* ===== CUSTOM SLIDER ===== */

.custom-slider-container {
  width: 100%;
  position: relative;
  overflow: hidden;
  margin: 0 auto;
  margin-top: -24px;
  
}

.custom-slider {
  position: relative;
  width: 100%;
  height: auto;
}

.slides-wrapper {
  display: flex;
  transition: transform 0.6s ease;
  width: 100%;
}

.custom-slide {
  flex: 0 0 100%;
  position: relative;
}

.custom-slide picture,
.custom-slide img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  line-height: 0;
}

/* ===== Подписи и кнопки ===== */
.custom-caption {
    position: absolute;
    left: 0%;
    top: 30%;
    transform: translate(-50%, -50%);
    text-align: right;
    color: #fff;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.6);
    z-index: 3;
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
    background-color: #ffffff50;
    border-radius: 10px;
    padding:0 20px 0 50px;
}

.custom-caption .slide-text1 {
  font-size: clamp(1.8rem, 3vw, 3rem);
  margin: 0 0 0.4em;
  font-weight: 600;
}

.custom-caption .slide-text2 {
  font-size: clamp(1.2rem, 2vw, 1.6rem);
  display: block;
  margin-bottom: 1em;
}

.custom-slider-button {
  display: inline-block;
  background: var(--brand, #c8102e);
  color: #fff;
  padding: 0.75em 1.8em;
  border-radius: 2em;
  text-decoration: none;
  transition: all 0.3s ease;
}
.custom-slider-button:hover {
  background: #a00;
  transform: translateY(-2px);
}

/* ===== Точки навигации ===== */
.dots {
  position: absolute;
  left: 50%;
  padding: 10px 0;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  z-index: 4;
}

.dots .dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(255,255,255,0.5);
  border: none;
  cursor: pointer;
  transition: background 0.3s;
}
.dots .dot.active {
  background: var(--brand, #c8102e);
}

/* ===== Mobile tweaks ===== */
@media (max-width: 768px) {
    .custom-caption {
        top: auto;
        bottom: 20%;
        transform: translateX(-2%);
        text-align: center;
        padding:0 20px 0 20px;
    }
  .custom-caption .slide-text1 {
    font-size: 1.5rem;
  }
  .custom-caption .slide-text2 {
    font-size: 1rem;
  }
}
/* ===== MODAL (базовые) ===== */
.modal[aria-hidden="true"]{display:none}
.modal{position:fixed; inset:0; display:grid; place-items:center; z-index:1000}
.modal-backdrop{position:absolute; inset:0; background:rgba(0,0,0,.45)}
.modal-dialog{position:relative; background:var(--bg-elev); color:var(--text); border:1px solid var(--border); border-radius:12px; width:min(480px,92%); padding:20px; box-shadow:0 10px 40px rgba(0,0,0,.25)}
.modal-close{position:absolute; top:8px; right:8px; border:0; background:transparent; font-size:24px; cursor:pointer; color:var(--text)}

/* ===== MENU POPUP (левое боковое меню) ===== */
.modal--menu { display: block; }
.modal.modal--menu{z-index: 900;}
.modal--menu .modal-backdrop { position: fixed; inset: 0; }
.modal--menu .modal-dialog--menu {
  position: fixed; top: 0; left: 0; height: 100vh; width: 300px; max-width: 92vw;
  border-radius: 0; box-shadow: none; border-right: 1px solid var(--border);
  background: var(--card); color: var(--text); padding: 16px;
  transform: translateX(-100%); transition: transform .25s ease;
}
.modal--menu[aria-hidden="false"] .modal-dialog--menu { transform: translateX(0); }
.modal--menu .modal-title { margin: 0 0 10px; font-size: 18px; }
.modal--menu .modal-close { position: absolute; top: 8px; right: -12px; border: 0; background: transparent; font-size: 24px; line-height: 1; cursor: pointer; color: var(--text); }

.menu-modal-search { margin: 8px 0 12px; }
.menu-modal-search input[type="search"]{ width: 100%; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--border); background: var(--card); color: var(--text); }

.menu-modal-list{ list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.menu-modal-list > li > a{ display: block; padding: 10px 12px; border-radius: 8px; color: var(--text); text-decoration: none; }
.menu-modal-list > li > a:hover{ background: var(--bg-elev); }
.menu-modal-list .sub-menu{
  list-style: none; margin: 6px 0 6px 12px; padding: 0 0 0 10px; border-left: 2px solid var(--border);
}
.menu-modal-list .sub-menu a{ display: block; padding: 8px 10px; border-radius: 6px; color: var(--text); text-decoration: none; }
.menu-modal-list .sub-menu a:hover{ background: var(--bg-elev); }

.menu-modal-extra{ margin-top: 14px; display: flex; gap: 10px; flex-wrap: wrap; }

/* ==== Sticky footer ==== */
html, body { height: 100%; }
body { min-height: 100svh; display: flex; flex-direction: column; }
.site-main { flex: 1 0 auto; }
.site-footer { margin-top: auto; }
body.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .site-header { top: 46px; } }

/* ==== Home: 4 кружка ==== */
.home-circles { padding: 24px 0; }
.home-circles__grid { display:grid; grid-template-columns: repeat(12, 1fr); gap:16px; }
.circle-item { grid-column: span 3; text-align:center; }
.circle-item__img { display:flex; justify-content:center; }
.circle-img,
.circle-img img { width:120px; height:120px; border-radius:50%; object-fit:cover; display:block; border:4px solid var(--brand); background:var(--bg-elev); }
.circle-img--ph { width:120px; height:120px; border-radius:50%; background:var(--bg-elev); border:4px solid var(--brand); }
.circle-item__text { margin-top:10px; color:var(--text); }
@media (max-width:1023.98px){ .circle-item { grid-column: span 6; } }
@media (max-width:640px){ .circle-item { grid-column: span 12; } }

/* ==== Home: товары (карусель на desktop, стек на mobile) ==== */
.home-products2 { padding: 8px 0 24px; --visible: 3; }
.prod-carousel { position:relative; }
.prod-carousel__track {
  display:grid; grid-auto-flow: column;
  grid-auto-columns: calc((100% - (var(--visible) - 1) * 16px) / var(--visible));
  gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; padding: 2px; scroll-behavior: smooth;
}
.prod-carousel__track:focus { outline:2px solid var(--link); outline-offset:2px; }
.prod-carousel__track::-webkit-scrollbar { height: 8px; }
.prod-carousel__track::-webkit-scrollbar-thumb { background: var(--border); }
.prod-card { scroll-snap-align: start; border:1px solid var(--border); background:var(--card); border-radius:12px; overflow:hidden; display:flex; flex-direction:column; }
.prod-card__img img { width:100%; height:auto; display:block; }
.prod-card__ph { width:100%; aspect-ratio: 4/3; background:var(--bg-elev); }
.prod-card__body { padding:12px; display:grid; gap:8px; }
.prod-card__title { margin:0; font-size:16px; }
.prod-card__price { color:var(--text); font-weight:600; }
.prod-carousel__nav {
  position:absolute; top:50%; transform:translateY(-50%);
  width:38px; height:38px; border-radius:50%;
  border:1px solid var(--border); background:var(--card); cursor:pointer; z-index:2;
}
.prod-carousel__nav--prev { left:-8px; }
.prod-carousel__nav--next { right:-8px; }
.prod-stack { display:none; }
@media (max-width: 767.98px){
  .prod-carousel { display:none; }
  .prod-stack { display:block; }
  .prod-card.prod-card--stack { margin-bottom: 12px; }
}

/* ==== Home: видео ==== */
.home-video { padding: 24px 0; }
.video-wrap { position:relative; width:100%; aspect-ratio:16/9; background:var(--bg-elev); border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.video-wrap iframe { position:absolute; inset:0; width:100%; height:100%; }

/* ==== Home: CTA ==== */
.home-cta { padding: 24px 0; }
.home-cta__box { border:1px solid var(--border); background:var(--card); border-radius:12px; padding:16px; display:grid; gap:8px; }
.home-cta__title { margin:0; font-size:22px; }
.home-cta__subtitle { margin:0; color:var(--muted); }

/* ==== Home: Карта ==== */
.home-map {margin: -7px 0;}
.map-wrap iframe { width:100%; height:420px; border:0; }
@media (max-width:640px){ .map-wrap iframe{ height:300px; } }

/* ===== ACCESSIBILITY ===== */
.visually-hidden{position:absolute !important; height:1px; width:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); white-space:nowrap}

/* ===== RESPONSIVE ===== */
@media (min-width:1024px){
  .header-bar{grid-template-columns:auto auto 1fr auto auto}
  .burger{display:none}
}
@media (max-width:1023.98px){
  .header-bar{grid-template-columns:auto 1fr auto}
  .main-nav{display:none}
  .header-search{min-width:0}
}

/* ===== Delete home in breadcrumb ===== */
span.sr-only {
    font-size: 0px;
}

/* ==== Footer grid etc. (appended) ==== */
.footer-grid { display:grid; grid-template-columns: repeat(12, 1fr); gap:16px; padding:24px 0; }
.footer-col { grid-column: span 3; }
.footer-menu { list-style:none; padding:0; margin:0; display:grid; gap:8px; }
.footer-copy { background: var(--bg);border-top:1px solid var(--border); padding:10px 0; color:var(--muted); font-size:14px; }
.logos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 0px;
  align-items: center;
}

.logo {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 20px;
}

/* Чтобы все картинки подгонялись под контейнер и не вылазили */
.logo img {
  object-fit: contain;
}

/* ---- Размерные модификаторы ---- */

/* Широкий логотип */
.logo.l-wide {
  grid-column: span 3;
  height: 60px; /* базовая высота контейнера */
  object-fit: contain;
}

.logo.l-wide img {
  height: 60px;
  width: auto;       /* сохраняет пропорции */
  object-fit: contain;
}

/* Маленький логотип */
.logo.l-small {
  grid-column: span 1;
  height: 28px;
}

.logo.l-small img {
  max-height: 100%;
  width: auto;
}

.site-footer {
    background: #232323;
    color: #f3f3f3;
}

/* Language dropdown + cart popover */
.lang-switch { position:relative; display:inline-flex; align-items:center; }
.lang-switch .lang-current {
  display:flex; align-items:center; gap:6px; height: 40px;
}
.lang-switch .lang-list {
  position:absolute; right:0; top:calc(100% + 6px);
  background:var(--card); border:1px solid var(--border); border-radius:10px;
  list-style:none; margin:0; padding:6px; min-width:120px; display:none; z-index:1000;
}
.lang-switch[aria-expanded="true"] .lang-list,
.lang-switch:hover .lang-list { display:block; }
.lang-switch .lang-list a { display:block; padding:8px 10px; border-radius:8px; color:var(--text); text-decoration:none; }
.lang-switch .lang-list li.is-current a { background:var(--bg-elev); font-weight:600; }
.lang-switch .lang-list a:hover { background:var(--bg-elev); }

/* мостик заполняет зазор под кнопкой */
.lang-switch{ position:relative; display:inline-flex; align-items:center; }
.lang-switch::after{
  content:"";
  position:absolute;
  left:-6px; right:-6px;
  top:100%;
  height:12px;            /* больше твоего зазора (6px) */
  /* прозрачный, но участвует в hover */
}

.hdr-account { display:flex; align-items:center; gap:8px; text-decoration:none; color:var(--text); }
.hdr-account__icon { display:inline-flex; }
.hdr-login { display:inline-flex; align-items:center; gap:8px; }

.hdr-cart { position:relative; }
.hdr-cart__btn {
  position:relative; width:40px; height:40px; border-radius:10px;
  border:1px solid var(--border); background:var(--card);
  display:inline-flex; align-items:center; justify-content:center;
  color: inherit; /* наследуем цвет, чтобы иконка красилась */
  cursor: pointer;
}

.hdr-cart__btn:hover {background:#f11337;}
.hdr-cart__badge, .acc-nav__badge {
  min-width:18px; height:18px; border-radius:9px;
  background: var(--brand); color:#fff; font-size:11px; display:inline-flex;justify-content:center;
}
.hdr-cart__badge {align-items: center; top:-4px; right:-4px; position:absolute;}
.acc-nav__badge {position: absolute;right: 12px;top: 50%;transform: translateY(-50%);}
.cart-popover {
  position:absolute; right:0; top:calc(100% + 8px); width:min(380px, 92vw);
  background:var(--card); border:1px solid var(--border);
  border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.15); padding:10px; z-index:1200; display:none;
}
.cart-popover[aria-hidden="false"]{ display:block; }
.cart-popover__checkout { width:100%; margin-top:10px; }

/* Drawer extras */
.drawer-langs { display:flex; gap:8px; flex-wrap:wrap; padding:8px 0 12px; }
.drawer-lang { padding:6px 10px; border:1px solid var(--border); border-radius:10px; text-decoration:none; color:var(--text); background:var(--card); }
.drawer-lang.is-active { background:var(--brand); border-color:var(--brand); color:#fff; }
.drawer-hello { margin-bottom:8px; }
.drawer-cart, .drawer-user { padding: 12px 14px 14px;border-radius: 12px;background: var(--bg-elev);text-align: center;box-shadow: 0 2px 10px rgba(0, 0, 0, .06);margin: 8px 0;}
.drawer-prod__btn {display: flex;justify-content: center;gap: 12px;}
.drawer-cart__summary, .drawer-user__card { display:flex; justify-content:space-between;}
.drawer-user__card  {color:inherit;align-items: center;}
.socials { display:flex; gap:8px; margin-top:8px; }
.soc { display: flex; align-items: center; justify-content: center;}
.socials .icon { width: 30px; height: 30px; display: inline-block; }

@media (max-width:1023.98px){
  .footer-col { grid-column: span 6; }
}
@media (max-width:640px){
  .footer-col { grid-column: span 12; }
}

/* ==== Mobile header fix: brand | search | burger ==== */
@media (max-width:1023.98px){
  .site-header .header-bar{
    display:grid;
    grid-template-columns: auto 1fr auto;
    grid-template-areas: "brand search burger";
    align-items:center;
    gap: 10px;
  }

  /* расставляем элементы по зонам */
  .site-header .brand{ grid-area: brand; display:inline-flex; align-items:center; }
  .site-header .header-search{ grid-area: search; min-width:0; }
  .site-header .burger{ grid-area: burger; }

  /* прячем хедер-actions на мобиле (языки/тема/корзина уйдут в боковое меню) */
  .site-header .header-actions{ display:none !important; }

  /* логотип не тянем на всю ширину и не перекрываем слой */
  .site-header .brand{ width:auto; }
  .site-header .brand .brand-logo{ height:40px; width:auto; max-width:none; display:block; }
}

/* чтобы ссылка-логотип не занимала лишнюю площадь в любом режиме */
.site-header .brand{ display:inline-flex; }


/* Layout */
.shop-archive-grid{
  display:grid; grid-template-columns:280px 1fr; gap:24px; align-items:start;
}
@media (max-width:1200px){ .shop-archive-grid{ grid-template-columns:280px 1fr; } }
@media (max-width:768px){ .shop-archive-grid{ grid-template-columns:1fr; } }

/* Toolbar + ordering pill */
.shop-toolbar{ display:flex; justify-content:space-between; gap:16px; align-items:center; margin-bottom:16px; }
.woocommerce-ordering select{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  padding:10px 36px 10px 12px;
  border:1px solid var(--border,#e5e5e5); border-radius:999px; background:#fff; cursor:pointer;
}

/* Grid */
.products-grid ul.products{
  display:grid !important; gap:24px;
  grid-template-columns: repeat(4, minmax(0,1fr));
}
@media (max-width:1200px){ .products-grid ul.products{ grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width:768px){  .products-grid ul.products{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
.products-grid ul.products li.product{
  width:100% !important; margin:0 !important; background:var(--card,#fff);
  border:1px solid var(--border,#e5e5e5); border-radius:16px; overflow:hidden;
  box-shadow:0 3px 14px rgba(0,0,0,.06);
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.products-grid ul.products li.product:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(0,0,0,.10);
  border-color:#8d8d8d61;
}
.products-grid ul.products li.product .woocommerce-LoopProduct-link{ display:block; padding:14px 14px 0; }
.products-grid ul.products li.product .price,
.products-grid ul.products li.product .star-rating,
.products-grid ul.products li.product .button,
.products-grid ul.products li.product .add_to_cart_button{}

/* Price look */
.products-grid .price{ display:flex; align-items:baseline; gap:8px; }
.products-grid .price del{ color:#999; font-size:.95em; }
.products-grid .price ins{ color:#c8102e; text-decoration:none; font-weight:700; }

/* Spinner */
.loading-spinner{ display:flex; justify-content:center; align-items:center; padding:120px 0; }
.kuko-spinner{ display:block; animation:kuko-spin 1s linear infinite; }
@keyframes kuko-spin { from{transform:rotate(0)} to{transform:rotate(360deg)} }

/* 1) Отключаем legacy-псевдоэлементы, чтобы они не становились grid-элементами */
.products-grid ul.products::before,
.products-grid ul.products::after,
.woocommerce ul.products::before,
.woocommerce ul.products::after {
  content: none !important;
  display: none !important;
}

/* 2) Убираем флоаты/сбрасываем хаки старой сетки у карточек */
.products-grid ul.products li.product,
.woocommerce ul.products li.product {
  float: none !important;
  clear: none !important;
  margin: 0 !important;
  width: 100% !important;
}

/* 3) На всякий случай глушим наследованные классы от Woo: .first/.last и nth-child-правила */
.woocommerce ul.products li.product.first,
.woocommerce ul.products li.product.last {
  clear: none !important;
  margin-right: 0 !important;
}

/* RESET старых флоатов/clearfix Woo, чтобы сетка не плыла */
.kuko-card-reset { float:none !important; clear:none !important; width:100% !important; margin:0 !important; }
.woocommerce ul.products::before,
.woocommerce ul.products::after { content:none !important; display:none !important; }

/* Карточка как у донора */
.woocommerce ul.products li.product{
  border:1px solid var(--border); border-radius:12px; background:var(--card);
  box-shadow:0 2px 8px rgba(0,0,0,.06);
  overflow:hidden; position:relative;
  transition:transform .12s, box-shadow .12s, border-color .12s;
}
.woocommerce ul.products li.product:hover{
  transform:translateY(-2px); box-shadow:0 10px 24px rgba(0,0,0,.10); border-color:#8d8d8d61;
}

/* картинка */
.product-image{ padding:14px 14px 0; }
.product-image img{ display:block; width:100%; height:auto; background:var(--bg-elev); border-radius:10px; object-fit:contain; }

/* заголовок */
.woocommerce-loop-product__title{ margin:10px 14px 8px; font-size:16px; font-weight:600; line-height:1.35; }
.woocommerce-loop-product__title a{ color:var(--text); text-decoration:none; }
.woocommerce-loop-product__title a:hover{ text-decoration:underline; }

/* отзывы/иконки */
.product-reviews{ display:flex; align-items:center; justify-content:space-between;padding:0 14px 4px; }
.rating-section{ display:inline-flex; align-items:center; gap:8px; color:#ff9800; }
.rating-section .star-rating{ margin:0; }
.rating-value{ color:var(--text); font-weight:600; }
.review-section{ display:inline-flex; align-items:center; gap:6px; color:var(--muted); }
.product-icons{ margin-left:auto; display:flex; gap:8px; }
.woocommerce ul.products li.product .add_to_cart_button, .product-icons a{
  width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--border); border-radius:10px; background:var(--card); color:inherit;
  transition:background .12s, transform .12s;
}
/* активное состояние: тянем брендовый цвет */
.toggle-compare-button.is-in-compare, .toggle-wishlist-button.is-in-wishlist { 
  color: var(--brand);            /* ← ключевая строка */
}/* активное состояние */

/* аккуратные переходы */
.toggle-compare-button .icon, .toggle-wishlist-button.is-in-wishlist { 
  transition: transform .2s, opacity .2s;
}
.toggle-compare-button.is-in-compare .icon, .toggle-wishlist-button.is-in-wishlist { 
  transform: scale(1.05);
  opacity: 1;
}

.product-icons a:hover{ background:var(--bg-elev); transform:translateY(-1px); }


/* наличие */
.product-availability{ padding:0 14px 6px; }
.product-status{ margin:0; font-size:13px; }
.product-status-in-stock{ color: var(--green); }
.product-status-backorder{ color: var(--yellow); }
.product-status-out{ color: var(--muted); }

/* цена */
.product-price-cart {padding:0px 14px 14px 14px;height: 45px;display: flex;flex-direction: column;align-items: stretch;justify-content: flex-end;}
.price-row{ display:flex; justify-content:space-between; align-items: flex-end;justify-content: space-between;}
.price-on-sale del{ color:#999; }
.price-sale-color{ color:#c8102e!important; text-decoration:none; }

/* Наша кнопка корзины (иконка из вашего спрайта) */
.kuko-btn-cart{
  width:40px; height:40px; border-radius:12px;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--card); border:1px solid var(--border); color:inherit;
  transition: background .12s ease, border-color .12s ease, transform .12s ease;
}
.kuko-btn-cart:hover{ background:var(--brand); border-color:var(--brand); color:#fff; transform:translateY(-1px); }
.kuko-btn-cart--goto:hover{ background:var(--bg-elev); color:inherit; border-color:var(--border); }

/* Нормализуем ваши svg-иконки */
.woocommerce ul.products li.product .icon{
  inline-size:20px; block-size:20px; display:inline-block; color:inherit;
}
.woocommerce ul.products li.product .icon *[fill]{   fill: currentColor !important; }
.woocommerce ul.products li.product .icon *[stroke]{ stroke: currentColor !important; }

/* === SINGLE PRODUCT LAYOUT === */
.kuko-single__title{ margin: 8px 0 16px; font-size: clamp(22px, 2.6vw, 36px); font-weight: 800; }
.kuko-single__grid{ display:grid; grid-template-columns: 2fr 1fr; gap:24px; align-items:start; }
@media (max-width:1023.98px){ .kuko-single__grid{ grid-template-columns: 1fr; } }

.kuko-single__media, .kuko-single__aside{
  background: var(--card); border:1px solid var(--border); border-radius:12px; padding:12px;
}

/* aside passport */
.kuko-aside__row{ display:flex; gap:8px; padding:6px 0; border-bottom:1px dashed var(--border); align-items:center; }
.kuko-aside__row:last-child{ border-bottom:0; }
.kuko-aside__label{ color:var(--muted); min-width:92px; }
.kuko-aside__value{ font-weight:600; color:var(--text); }

/* fronts */
.kuko-fronts{ margin-top:12px; }
.kuko-fronts__title{ margin:0 0 6px; color:var(--muted);}
.kuko-fronts__grid{ display:grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap:8px; }
.kuko-fronts__item{
  position:relative; border:1px solid var(--border); background:var(--bg-elev);
  border-radius:10px; padding:8px; display:flex; align-items:center; justify-content:center; height:64px;
  opacity:.55; filter: grayscale(1);
}
.kuko-fronts__item .front-ico{ inline-size:48px; block-size:32px; }
.kuko-fronts__item.is-active{
  opacity:1; filter:none; background:var(--card); border-color:var(--brand);
  box-shadow: 0 0 0 2px color-mix(in oklab, var(--brand) 25%, transparent) inset;
}
.kuko-fronts__check{
  position:absolute; right:6px; bottom:6px;
  width:20px; height:20px; border-radius:50%;
  background: var(--brand); color:#fff; display:grid; place-items:center;
}

/* bars */
.section-bar{ margin:18px auto 10px; }
.section-bar__text{
  display:block; padding:10px 12px; font-weight:700; text-transform:uppercase; letter-spacing:.02em;
}

/* description */
.kuko-single__desc .content{ background:var(--card); border:1px solid var(--border); border-radius:12px; padding:16px; }

/* specs + drawing */
.kuko-specs__grid{ display:grid; grid-template-columns: 1fr 1fr; gap:24px; }
@media (max-width:1023.98px){ .kuko-specs__grid{ grid-template-columns:1fr; } }
.kuko-drawing{ margin:0; }
.kuko-drawing img{ width:100%; max-height:500px; border-radius:12px; display:block; object-fit:contain; }
html[data-theme="dark"] .kuko-drawing img {
  filter: invert(1);
}
.kuko-drawing__pdf{ display:inline-block; padding:10px 14px; border:1px solid var(--border); border-radius:10px; background:var(--card); text-decoration:none; }
.kuko-drawing__pdf:hover{ background: var(--hover-bg); }
.kuko-drawing__empty{ color:var(--muted); }

/* rows of products (related / viewed) */
.prod-row{
  display:grid; gap:16px;
  grid-template-columns: repeat(7, minmax(0,1fr));
}
@media (max-width:1360px){ .prod-row{ grid-template-columns: repeat(5, minmax(0,1fr)); } }
@media (max-width:1023.98px){ .prod-row{ grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width:640px){ .prod-row{ grid-template-columns: repeat(2, minmax(0,1fr)); } }

/* === Woo shortcode [products] — KUKO skin === */

/* 0) Сбрасываем старые before/after и флоаты у Woo */
.woocommerce ul.products::before,
.woocommerce ul.products::after { content: none !important; display: none !important; }
.woocommerce ul.products li.product { float:none !important; clear:none !important; width:100% !important; margin:0 !important; }

/* 1) Грид по колонкам (Woo добавляет класс .columns-X) */
.woocommerce ul.products{
  display:grid !important; gap:4px;
  grid-template-columns: repeat(4, minmax(0,1fr)); /* дефолт */
  padding:0; list-style:none;
}

@media (max-width:1360px){
  .woocommerce ul.products{ grid-template-columns: repeat(5, minmax(0,1fr)); }
}
@media (max-width:1024px){
  .woocommerce ul.products{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width:640px){
  .woocommerce ul.products{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}

/* 2) Карточка */
.woocommerce ul.products li.product{
  position:relative; overflow:hidden;
  background:var(--card); border:1px solid var(--border); border-radius:16px;
  box-shadow:0 3px 14px rgba(0,0,0,.06);
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
  display:flex; flex-direction:column;
}
.woocommerce ul.products li.product:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(0,0,0,.10);
  border-color:#8d8d8d61;
}

/* 3) Медиа */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{
  display:block; padding:14px 14px 0;
}
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link img{
  width:100%; height:auto; display:block; background:var(--bg-elev);
  border-radius:10px; object-fit:contain;
}

/* 4) Тайтл */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  margin:10px 14px 8px; font-size:16px; font-weight:600; line-height:1.35;
  color:var(--text);
}

/* 5) Цена и рейтинг */
.woocommerce ul.products li.product .star-rating{ margin:0 14px 8px; }
.woocommerce ul.products li.product .price{
  display:flex; align-items:baseline; gap:8px;
}

ins.price.price--current {
    text-decoration: none;
}
del.price.price--regular {
    color: #8f8f8f !important;
}
.woocommerce ul.products li.product .price del{ color:#999; font-size:.95em; }
.woocommerce ul.products li.product .price ins{ color:#c8102e; font-weight:700; text-decoration:none; }

.woocommerce ul.products li.product .button:hover,
.woocommerce ul.products li.product .add_to_cart_button:hover{
  background:var(--green); border-color:var(--green); color:#fff; transform:translateY(-1px);
}

/* 7) Бейдж SALE — если его не убрали хуками, делаем маленьким/аккуратным */
.woocommerce ul.products li.product .onsale{
  position:absolute; right:5px; top:5px; z-index:2;
  background: var(--green); color:#fff; border-radius:12px;
  font-weight:700; font-size:12px; box-shadow:0 2px 6px rgba(0,0,0,.08);width:48px;min-height:18px;height:18px;display:flex;align-items:center;justify-content: center;
  
}

.woocommerce ul.products li.product .icon *[fill]{   fill: currentColor !important; }
.woocommerce ul.products li.product .icon *[stroke]{ stroke: currentColor !important; }

/* ===== KUKO swap: ОДНА СТРОКА, ЖЁСТКАЯ ШИРИНА КАРТОЧКИ ===== */
.kuko-swap{
  --card: 240px;   /* fallback – можно переопределить инлайном или JS */
  --gap: 16px;
  position: relative; width: 100%;
}

/* ul: одна строка колонками, ничего не переносим, скрываем лишнее */
.kuko-swap ul.products{
  display: grid !important;
  grid-auto-flow: column;
  grid-auto-columns: var(--card);
  gap: var(--gap);
  overflow: hidden;
  padding: 0; margin: 0;
  list-style: none;
}

/* самое важное — прибить проценты и флоаты у любых .columns-*  */
.kuko-swap ul.products > li.product{
  box-sizing: border-box;
  width: var(--card) !important;
  min-width: var(--card) !important;
  max-width: var(--card) !important;
  margin: 0 !important;
  float: none !important;
  clear: none !important;
}

/* на всякий — срежем псевдоэлементы сетки Woo */
.kuko-swap ul.products::before,
.kuko-swap ul.products::after{ content:none !important; display:none !important; }

/* чтобы картинка не растягивала колонку */
.kuko-swap ul.products img{ max-width: 100%; height: auto; display: block; }

/* кнопки-стрелки */
.kuko-swap__nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:40px; height:40px; border-radius:50%;
  border:1px solid var(--border); background:var(--card);
  display:grid; place-items:center; cursor:pointer; z-index:2;
  box-shadow:0 2px 10px rgba(0,0,0,.08);
}
.kuko-swap__nav[disabled]{ opacity:.35; pointer-events:none; }
.kuko-swap__prev{ left:-8px; }
.kuko-swap__next{ right:-8px; }
.kuko-swap__nav::before{
  content:''; width:10px; height:10px; display:block;
  border-top:2px solid currentColor; border-right:2px solid currentColor;
  transform:rotate(135deg);
}
.kuko-swap__next::before{ transform:rotate(-45deg); }

/* Shop ordering wrapper (по желанию) */
.shop-ordering{display:flex;justify-content:flex-end;align-items:center}

/* KUKO select */
.shop-ordering .woocommerce-ordering .orderby{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  padding:10px 38px 10px 12px;border-radius:999px;
  border:1px solid var(--border);background:var(--card);color:var(--text);
  line-height:1;cursor:pointer;transition:border-color .12s,background .12s,color .12s,box-shadow .12s;
  /* стрелка на currentColor (автоматически меняет цвет в тёмной теме) */
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;background-size:16px 16px;
}
.shop-ordering .woocommerce-ordering .orderby:hover{background:var(--bg-elev)}
.shop-ordering .woocommerce-ordering .orderby:disabled{opacity:.6;cursor:not-allowed}

/* Сбрасываем возможные унаследованные тенюшки/рамки от темы/плагинов */
.shop-ordering .woocommerce-ordering .orderby{box-shadow:none}

/* Firefox убираем внутренний focus */
@-moz-document url-prefix(){.shop-ordering .woocommerce-ordering .orderby{background-clip:padding-box}}

/* Спрятать "Просмотр корзины" на архивах */
.woocommerce.archive a.added_to_cart.wc-forward{display:none!important}



.drawer-login-cta__text{
  margin: 0 0 10px;
  font-size: 14px;
  color: var(--text);
}

.drawer-login-cta__btn{
  justify-content: center;
  border-radius: 12px; 
}

/* === Mini-cart in modal (KUKO) === */
.modal-dialog--cart{
  width: min(820px, 92vw);
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 32px); /* на десктопе оставляем зазор сверху/снизу */
  box-sizing: border-box;
}

#kuko-mini-cart{
  display: grid;
  gap: 12px;
}

.kuko-mini-list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

.kuko-mini-item{
  display: grid;
  grid-template-columns: 68px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--card);
}

.kuko-mini-thumb{
  width: 64px;
  height: 64px;
  object-fit: contain;
  border-radius: 8px;
  background: #fff;
  display: block;
}

.kmi-title{
  margin: 0 0 6px;
  font-size: 15px;
  line-height: 1.35;
}
.kmi-title a{
  color: var(--text);
  text-decoration: none;
}
.kmi-title a:hover{
  text-decoration: underline;
}

.kmi-qty{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.kmi-qty__btn{
  width: 34px;
  height: 34px;
  border: 1px solid var(--border);
  background: var(--card);
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.kmi-qty__btn  svg {
    color: var(--text);
}
.kmi-qty__btn:hover{
  background: var(--bg-elev);
  border-color: color-mix(in oklab, var(--brand) 40%, var(--border));
}
.kmi-qty__input{
  width: 56px;
  text-align: center;
  padding: 6px 8px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--card);
  color: var(--text);
  font-variant-numeric: tabular-nums;
  -moz-appearance: textfield;
}
.kmi-qty__input::-webkit-outer-spin-button,
.kmi-qty__input::-webkit-inner-spin-button{
  -webkit-appearance: none;
  margin: 0;
}

.kmi-right{
    display: flex;
    gap: 20px;
    justify-items: end;
    justify-content: space-between;
}
.kmi-price{
  display: grid;
  gap: 2px;
  text-align: right;
}
.kmi-price__old{ color: var(--muted); }
.kmi-price__cur{
  color: var(--brand);
  text-decoration: none;
  font-weight: 700;
}

.kmi-remove{
  color: var(--muted);
  text-decoration: none;
}
.kmi-remove:hover{
  color: var(--red);
}

@media (max-width: 640px){
  .kuko-mini-footer{
    margin-bottom: 56px;
  }
}
.kuko-mini-footer{
/* футер корзины: всегда снизу, без огромных внешних отступов */
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding-top: 6px;
  border-top: 1px solid var(--border);
  margin-top: 10px;
}

.kmi-total{
  display: flex;
  align-items: center;
  gap: 8px;
}
.kmi-total__label{
  color: var(--text);
  font-weight: 600;
}
.kmi-total__value{
  font-size: 18px;
  color: var(--text);
  font-weight: 400 !important;
}

.cart-modal__checkout{ width: auto; }
.cart-modal__note{
  display: flex;
  gap: 8px;
  align-items: flex-start;
  color: var(--muted);
  font-size: 13px;
  margin: 0;
}

.kuko-mini-empty{
  height: 100px;
  display: flex;
  justify-content: center;
}

/* тело корзины скроллится, фон стоит */
.cart-modal__body{
  flex: 1 1 auto;
  overflow-y: auto;
  min-height: 0;
}

/* Мобилка: фулл-экранный диалог + компактная сетка */
@media (max-width: 640px){
  .modal-dialog--cart{
    width: 100vw;
    max-width: 100vw;
    height: 100vh;
    max-height: 100vh;
    margin: 0;
    border-radius: 0;
    padding: 16px;
  }

  .cart-modal__body{
    flex: 1 1 auto;
    overflow-y: auto;
  }

  .kuko-mini-item{
    grid-template-columns: 56px 1fr;
    align-items: start;
  }
  .kmi-right{
    grid-column: 2 / 3;
    justify-items: start;
  }
}


/* ==== Page template: WITH SIDEBAR (additive) ==== */
/* grid-каркас страницы */

.page-with-sidebar {padding:16px 0}
.page-with-sidebar .page-grid{
  display:grid;
  grid-template-columns: 280px 1fr;
  gap: 32px;
}

/* сайдбар: липкий на десктопе */
.page-with-sidebar .page-sidebar{ position:relative; }
@media (min-width: 992px){
  .page-with-sidebar .page-sidebar{
    position: sticky;
    top: 100px;         /* отступ от верхнего края */
    align-self: start; /* чтобы прилипал к началу колонки */
    border-right: 1px solid var(--border);
  }
}

/* меню в сайдбаре (если выводишь wp_nav_menu) */
.page-with-sidebar .sidebar-menu{
  list-style:none; margin:0; padding:0;
  display:grid; gap:8px;
}
.page-with-sidebar .sidebar-menu a{
  display:block; padding:10px 12px; border-radius:8px;
  color: var(--text); text-decoration:none;
}
.page-with-sidebar .sidebar-menu a:hover{
  background: var(--bg-elev);
}

/* универсальный блок сайдбара под любые вставки */
.page-with-sidebar .sidebar-block{ margin-top: 20px; }
.page-with-sidebar .widget-title{ margin:0 0 10px; font-weight:600; }

/* контентная колонка */
.page-with-sidebar .page-content{}
.page-with-sidebar .page-title{ margin:0 0 12px; }

/* желтый callout как на скрине (иконка-слева / текст / кнопка-справа) */
.page-with-sidebar .callout{
  display:grid;
  grid-template-columns: 24px 1fr auto;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  border-radius:10px;
  background:#FFE8BA; /* при желании вынеси в токен */
  color: var(--text);
}
.page-with-sidebar .callout__icon svg{ display:block; }
.page-with-sidebar .callout .btn{
  border:0; border-radius:10px;
  background: var(--brand); color:#fff; padding:8px 14px;
}
.page-with-sidebar .callout .btn:hover{ filter: brightness(.95); }

/* соц.иконки в сайдбаре (используют уже существующие .socials/.soc) */
.page-with-sidebar .socials--sidebar .soc{
  width:36px; height:36px; border-radius:8px;
  background: var(--card); 
}
.page-with-sidebar .socials--sidebar .soc:hover{ background: var(--bg-elev); }

/* адаптив: на мобиле сайдбар вниз */
@media (max-width: 991.98px){
  .page-with-sidebar .page-grid{ grid-template-columns: 1fr; gap: 20px; }
  .page-with-sidebar .page-sidebar{ order: 2; }
  .page-with-sidebar .page-content{ order: 1; }
  .page-with-sidebar .callout{ grid-template-columns: 24px 1fr; }
  .page-with-sidebar .callout .btn{ grid-column: 1 / -1; justify-self: start; margin-top: 6px; }
}
/* ==== KUKO swap: простая горизонтальная карусель ==== */
.kuko-swap{
  --card: 240px;      /* ширина карточки, можно переопределить инлайном */
  --gap: 16px;        /* расстояние между карточками */
  position: relative;
  width: 100%;
}

/* лента */
.kuko-swap ul.products{
  display: flex !important;
  gap: var(--gap);
  overflow-x: auto;                /* нативный горизонтальный скролл */
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  padding: 0;
  margin: 0;
  list-style: none;
  /* перестраховка против сеток Woo внутри */
  grid-template-columns: none !important;
}

/* карточки: фикс-ширина, не сжимать */
.kuko-swap ul.products > li.product{
  flex: 0 0 var(--card);
  max-width: var(--card);
  scroll-snap-align: start;
  margin: 0 !important;
  float: none !important;
  clear: none !important;
}

/* скроем полосу прокрутки */
.kuko-swap ul.products::-webkit-scrollbar{ height: 0; }
.kuko-swap ul.products{ scrollbar-width: none; }

/* стрелки-кнопки */
.kuko-swap__nav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  display: grid;
  place-items: center;
  cursor: pointer;
  z-index: 5;
  box-shadow: 0 4px 12px rgba(0,0,0,.1);
  transition: all .2s ease;
}

/* на десктопе — снаружи */
.kuko-swap__prev{ left: -60px; }
.kuko-swap__next{ right: -60px; }

/* иконки стрелок */
.kuko-swap__nav::before{
  content: '';
  width: 12px;
  height: 12px;
  display: block;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
}
.kuko-swap__prev::before{ transform: rotate(-135deg); } /* ← */
.kuko-swap__next::before{ transform: rotate(45deg); }   /* → */

/* hover/active */
.kuko-swap__nav:hover{
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
  transform: translateY(-50%) scale(1.05);
}
.kuko-swap__nav:active{
  transform: translateY(-50%) scale(0.95);
}
.kuko-swap__nav[disabled]{
  opacity: .4;
  pointer-events: none;
}

/* мобильная адаптация: сузим контейнер и подтянем стрелки внутрь экрана */
@media (max-width: 767.98px){
  .kuko-swap{
    width: calc(100% - 80px);   /* оставляем по ~40px под стрелки */
    margin: 0 auto;
  }
  .kuko-swap__prev{ left: -10px; }
  .kuko-swap__next{ right: -10px; }
}

/* очень узкие экраны — ещё чуть ближе */
@media (max-width: 420px){
  .kuko-swap{
    width: calc(100% - 64px);
  }
  .kuko-swap__prev{ left: -6px; }
  .kuko-swap__next{ right: -6px; }
}


@media (max-width:640px){
  .woocommerce ul.products { --thumb-ratio: 4/3; } /* пример */
}

/* === Home: HERO (full width) === */
.home-hero{
  padding: 12px 0 8px;
  background: var(--bg);
  margin-bottom: 32px;
}
.home-hero__inner{ }
.home-hero__pill{
  min-height: var(--hero-h, 200px);
  display: flex;
  align-items: center;
}


/* === Home: ARTICLES — overlapped art === */

/* 1) Лента без промежутков, чтобы overlap было видно */
.home-articles__list{
  display:grid;
  gap: 0;                 /* без вертикальных отступов */
}

/* 2) Карточка: 2/3 текст + 1/3 картинка */
.ha-card{
  position: relative;
  display: grid;
  grid-template-columns: 2fr 1fr;
  align-items: stretch;
  background: var(--card);
  box-shadow: 0 6px 24px rgba(0,0,0,.12);  /* визуальное разделение вместо паддингов */
  overflow: visible;       /* чтобы картинка могла вылезать за рамки */
}
/* Тень в светлой теме уже есть в базовом .ha-card */
html[data-theme="dark"] .ha-card {
  box-shadow: 0 4px 16px rgba(0, 0, 0, .6); 
}

/* 3) Фиксируем высоту текстовой части; всё остальное под неё */
.ha-card{
  border-radius: 0 16px 16px 0;
  --textH: 220px;          /* <<< ПРАВЬ ВЫСОТУ ТЕКСТОВОГО БЛОКА ТУТ */
  margin: 8px 0;
}


h3.ha-card__title {
    font-size: 1.5em;
    margin: 8px 0;
}

.ha-card__body{
  order:1;
  padding: 18px 16px;
  display: grid;
  grid-template-rows: auto 1fr auto; /* title / excerpt / button */
  align-content: start;
}

/* короткий аккуратный анонс — чтобы высота была стабильной */
.ha-card__excerpt{
  margin:0;
  color:var(--text);
  display:-webkit-box;
  -webkit-line-clamp: 4;   /* ~4 строки; подбери под --textH */
  -webkit-box-orient: vertical;
  overflow:hidden;
}

/* 4) Картинка по умолчанию (НЕчётные — базовые) */
.ha-card__media{
  order:2;
  position: relative;
  height: var(--textH);
  overflow: clip;
  z-index: 1;              /* базовый слой */
  border-radius: 0 16px 16px 0;
}
.ha-card__media img{
  display:block;
  width:100%;
  height:100%;
  object-fit: cover;
  border-radius: 0 16px 16px 0;
  
}

@media (max-width: 900px){
.ha-card__media, .ha-card__media img, .ha-card__media::after { border-radius: 0px 0px 16px 16px;}
.ha-card {border-radius: 16px;}
}
/* накладываем слой */
.ha-card__media::after {
  content: "";
  position: absolute;
  inset: 0; /* занимает всю картинку */
  background: rgb(255 255 255 / 7%); /* полупрозрачный слой */
  transition: opacity 0.1s ease;
  opacity: 1;
  border-radius: 0 16px 16px 0;
  pointer-events: none; /* чтобы не блокировал клик по ссылке */
  
}

/* при наведении — плавно убираем слой */
.ha-card__media:hover::after {
  opacity: 0;
}
html[data-theme="dark"] .ha-card__media::after {
  background: rgb(0 0 0 / 5%); /* полупрозрачный слой */
}
/* 5) Чётные — «верхние»: +10px к высоте, вынос на 5px вверх/вниз и лёгкий сдвиг влево */
.ha-card--even .ha-card__media{
/*  height: calc(var(--textH) + 10px); */
/*  width: calc(100% + 20px); */
/*  margin-top: -5px;   */     /* налезть на верх соседней */
/*  margin-bottom: -5px; */    /* и на нижнюю */
/*  transform: translateX(-10px); */
  z-index: 2;              /* лежит поверх соседних */
  box-shadow: 10px 10px 28px rgba(0,0,0,.30);
}


/* 6) Нечётные — «нижние»: как есть (можно чуть вправо увести для ритма, если хочется) */
.ha-card--odd .ha-card__media{
  transform: translateX(0);
}


/* 8) Hover по желанию */
.ha-card:hover{ box-shadow: 0 12px 36px rgba(0,0,0,.16); }

/* 9) Мобайл — складываем в колонку и отключаем оверлап, чтобы не ломать поток */
@media (max-width: 767.98px){
  .ha-card{
    grid-template-columns: 1fr;
    --textH: 200px;             /* можно чуть ниже на мобиле */
  }
  .ha-card__media{
    height: auto;               /* пусть растёт по контенту */
    margin: 0;
    transform: none;
    z-index: 1;
    aspect-ratio: 4/3;          /* ровная сетка превью */
  }
  .ha-card--even .ha-card__media{
    height: auto;
    margin: 0;
    transform: none;
    z-index: 1;
    box-shadow: none;
  }
}

/* KUKO — wp-block-table: чистая зебра, без бордеров */
.entry-content .wp-block-table,
.page-content  .wp-block-table {
  margin: 1.5em 0;
  border-radius: 12px;
  overflow: hidden;            /* скругления + горизонтальный скролл */
  background: var(--card);
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}

/* внутри таблицы */
.entry-content .wp-block-table table,
.page-content  .wp-block-table table {
  width: 100%;
  border-collapse: collapse;
  border: 0;
}

/* убираем ВСЕ бордеры от core */
.entry-content .wp-block-table thead,
.entry-content .wp-block-table tfoot,
.entry-content .wp-block-table td,
.entry-content .wp-block-table th,
.page-content  .wp-block-table thead,
.page-content  .wp-block-table tfoot,
.page-content  .wp-block-table td,
.page-content  .wp-block-table th {
  border: 0;
}

/* зебра */
.entry-content .wp-block-table tbody tr:nth-child(odd),
.page-content  .wp-block-table tbody tr:nth-child(odd) {
  background: var(--bg-elev);
}

/* шапка */
.entry-content .wp-block-table thead th,
.page-content  .wp-block-table thead th {
  background: var(--bg);
  font-weight: 700;
  text-align: left;
}

/* ячейки и отступы */
.entry-content .wp-block-table th,
.entry-content .wp-block-table td,
.page-content  .wp-block-table th,
.page-content  .wp-block-table td {
  padding: .8em 1em;
  background: transparent;
}

/* подпись */
.entry-content .wp-block-table figcaption,
.page-content  .wp-block-table figcaption {
  color: var(--muted);
  font-size: 14px;
  padding: 8px 12px 0;
}

/* адаптивный скролл */
.entry-content .wp-block-table,
.page-content  .wp-block-table { overflow-x: auto; }
.entry-content .wp-block-table table { min-width: 520px; }

/* темная тема — мягче зебра */
html[data-theme="dark"] .wp-block-table tbody tr:nth-child(odd) {
  background: color-mix(in oklab, var(--bg-elev) 85%, transparent);
}

.home-modular { margin: 40px 0; }
.home-modular__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(16px, 3vw, 32px);
  align-items: center;
}
.home-modular__img { width: 100%; height: auto; border-radius: 12px; display:block; }
.home-modular__ph { width:100%; aspect-ratio: 4 / 3; background: var(--card, #f5f5f7); border-radius: 12px; }
.home-modular__content :where(h2,h3){ margin-top: 0; }
.kuko-link {
  display:inline-flex; align-items:center; gap:8px;
  text-decoration: none;
}
.kuko-link .icon { flex:0 0 auto; }
@media (max-width: 900px){
  .home-modular__grid{ grid-template-columns: 1fr; }
}

/* === CTA WIDE (v2: fixed form width) ======================================= */
/* full-bleed background для секции CTA2 */
.home-cta2 {
  position: relative;
  isolation: isolate;             /* свой стек слоёв, чтобы z-index работал предсказуемо */
  margin: clamp(28px, 6vw, 64px) 0;
  padding: clamp(32px, 6vw, 72px) 0;
}

/* Full-bleed фон без горизонтального скролла */
.home-hero,
.home-cta2::before {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  /* ключ: ширина вьюпорта минус ширина скролла */
  width: calc(100vw - (100vw - 100%));
  background: var(--bg-elev);
  z-index: 0;
  pointer-events: none;
}
.home-cta2 { position: relative; isolation: isolate; z-index: 0; }
.home-cta2::before {
  content:""; position:absolute; inset:0; z-index:-1;
  box-shadow: 0 0 0 100vmax var(--bg-elev);
  clip-path: inset(0 -100vmax);
}

.home-hero, .home-cta2__inner {               /* твой .container */
  position: relative;
  z-index: 1;                     /* контент над фоном */
}

/* остальной твой CSS из предыдущей версии можно оставить как есть */



.home-cta2__grid {
  display: grid;
  grid-template-columns: 1fr min(360px, 40vw); /* текст тянется, форма фиксируется */
  gap: clamp(20px, 4vw, 56px);
  align-items: start;
}

/* левая колонка — типографика */
.home-cta2__left .content :where(h1,h2,h3){ margin: 0 0 .5em; line-height: 1.2; }
.home-cta2__left .content p { margin: .6em 0 0; opacity: .9; }

/* правая колонка — форма */
.home-cta2__right { width: 100%; }
.home-cta2__form {
  max-width: 360px;                      /* не шире 360 */
  background: var(--card, rgba(0,0,0,0.03));
  border: 1px solid var(--border, rgba(0,0,0,0.08));
  border-radius: 14px;
  padding: clamp(16px, 2.5vw, 24px);
  box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

/* инпуты/кнопки внутри CF7 */
.home-cta2__form input[type="text"],
.home-cta2__form input[type="tel"],
.home-cta2__form input[type="email"],
.home-cta2__form textarea,
.home-cta2__form select {
  padding: 12px 14px;
  border: 1px solid var(--border, rgba(0,0,0,0.1));
  border-radius: 10px;
  background: var(--card, #fff);
  color: var(--text, inherit);
  outline: none;
  max-width:90%;
}

.home-cta2__form .wpcf7-submit,
.home-cta2__form button[type="submit"],
.home-cta2__form .btn.btn-primary {
  display: inline-block;
  width: auto;
  padding: 10px 16px;
  border-radius: 12px;
  border: none;
  background: var(--link);
  color: #fff;
  cursor: pointer;
}

.home-cta2__form .wpcf7-submit,
.home-cta2__form button[type="submit"],
.home-cta2__form .btn.btn-primary:hover {
    background: var(--link-hover);
    
}

.home-cta2__form .wpcf7 form .wpcf7-response-output {
  margin: 10px 0 0;
  border-radius: 10px;
}

/* мелочи для CF7 (опционально) */
.home-cta2__form .wpcf7-spinner { margin-left: 8px; }
.home-cta2__form label { display:block; margin: 0 0 10px; }

/* Адаптив: на мобиле форма 100%, текст сверху */
@media (max-width: 980px){
  .home-cta2__grid {display: flex;flex-direction: column;}
  .home-cta2__right { order: 2;}
  .home-cta2__left  { order: 1; }
  .home-cta2__form { max-width: 100%; }
  
}

/* === KUKO: Account layout ================================================= */
.kuko-account{
  display:grid;
  grid-template-columns: 280px 1fr;
  gap: 24px;
  align-items: start;
}
@media (max-width: 980px){
  .kuko-account{ grid-template-columns: 1fr; }
}

/* Левый столбец */
.kuko-account__aside{ position: sticky; top: 129px; align-self: start; }
@media (max-width: 980px){ .kuko-account__aside{ position: static; } }

/* Карточка пользователя */
.acc-user{
  border:1px solid var(--border);
  background: var(--card);
  border-radius: 12px;
  padding: 14px;
  display: grid;
  gap: 12px;
  margin-bottom: 12px;
}
.acc-user__row{ display:flex; gap:12px; align-items:center; }
.acc-user__avatar img{ width:48px; height:48px; border-radius:50%; }
.acc-user__name{ font-weight:700; }
.acc-user__email, .acc-user__phone{ color: var(--muted); font-size: 14px; }

.acc-user__actions{ display:flex; gap:8px; flex-wrap:wrap; }
.acc-user .btn{
  display:inline-flex; align-items:center; gap:8px; border-radius:10px;
  padding:8px 10px; background:var(--card); border:1px solid var(--border); color: var(--text);
}
.acc-user .btn:hover{ background: var(--bg-elev); }
.acc-user .btn .icon{ font-size:20px; }

/* Навигация */
.acc-nav{ border:1px solid var(--border); background:var(--card); border-radius:12px; }
.acc-nav__list{ list-style:none; margin:0; padding:6px; display:grid; gap:4px; }
.acc-nav__list > li > a{
  display:flex; align-items:center; gap:10px; padding:10px 10px; border-radius:8px;
  color: var(--text); text-decoration:none;
}
.acc-nav__list > li > a:hover{ background: var(--bg-elev); }
.acc-nav__list .is-active > a,
.acc-nav__list > li.is-active > a{ background: var(--bg-elev); font-weight:600; }

/* Контент */
.kuko-account__content{
  border:1px solid var(--border); background:var(--card);
  border-radius:12px; padding:16px;
}

/* Заглушка */
.acc-placeholder h2{ margin-top:0; }

/* кликабельная карточка пользователя */
.acc-user--link{ position:relative; }
.acc-user__link{ position:absolute; inset:0; border-radius:12px; }
.acc-user--link:has(.acc-user__link:hover){ border: 1px solid var(--brand); }
.acc-nav__list>li>a{ position:relative; }

/* только ЛК */
.is-account .entry.entry-page > .entry-title:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* на всякий — убираем верхние зазоры у контейнеров темы */
.is-account .entry.entry-page,
.is-account .entry-content,
.is-account .entry-content > .woocommerce {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* если вдруг у первого блока внутри .entry-content схлопывается margin — отменяем схлопывание */
.is-account .entry-content { overflow: visible !important; }

/* === AUTH (login modal, global) ========================================= */
.kap-auth{ display:grid; gap:14px; }
.kap-auth__title{ margin:0 0 6px; font-size:22px; font-weight:700; }

.kap-auth__form.kap-pane{ display:grid; gap:10px; }
.kap-auth__label{ display:grid; gap:6px; font-weight:600; }

/* Инпуты формы входа — в стиле сайта */
.kap-auth .kap-input,
.kap-auth input[type="text"],
.kap-auth input[type="email"],
.kap-auth input[type="tel"],
.kap-auth input[type="password"]{
  padding:.75rem 1rem;
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--card);
  color:var(--text);
  font:inherit; line-height:1.2;
  transition: border-color .12s, box-shadow .12s, background .12s, color .12s;
}
.kap-auth input::placeholder{ color:var(--muted); opacity:.8; }
.kap-auth input:focus{
  outline:0;
  border-color: var(--brand);
}

/* Кнопка «продолжить/отправить» — на всю ширину */
.kap-auth__submit{ width:100%;margin: 12px 0;display: flex;justify-content: center; }

/* Текст про политику */
.kap-auth__note{ margin:.25rem 0 0; color:var(--muted);display: flex;justify-content: center;flex-wrap:wrap; }
.kap-auth__note a{ color:var(--link); }
.kap-auth__note a:hover{ color:var(--link-hover); }

/* Разделитель "или" */
.kap-auth__sep{
  display:flex; align-items:center; gap:10px;
  color:var(--muted); font-size:14px; margin:2px 0;
}
.kap-auth__sep::before,
.kap-auth__sep::after{ content:""; flex:1; height:1px; background:var(--border); }

/* Альтернативные способы входа (кнопки) */
.kap-auth__alts{ display:grid; gap:8px; }
.kap-auth__alt.btn{ justify-content:center; }
.kap-auth__alt .icon{ inline-size:18px; block-size:18px; margin-right:8px; }

/* ===== Кнопки: утилиты для всего проекта ===== */
.btn-block{ width:100%; }

.btn-outline{
  background: var(--card);
  color: var(--text);
  border-color: var(--border);
}
.btn-outline:hover{
  background: var(--bg-elev);
  border-color: var(--brand);
  color: var(--text);
}

/* Состояние disabled для любых кнопок */
.btn[disabled],
button[disabled]{
  opacity:.55; cursor:not-allowed; filter:saturate(.2);
}

/* На всякий — чтобы outline-ховеры не перекрылись общим .btn:hover */
.btn.btn-outline:hover{ color: var(--text) !important; }

.kap-auth .kap-status{ margin-top:6px; font-size:14px; color:var(--muted); }
.kap-auth .kap-status.is-ok{ color:var(--green); }
.kap-auth .kap-status.is-err{ color:var(--red); }
.kap-auth .kap-status.is-busy{ opacity:.9; }
/* KUKO Auth: уважать hidden/aria-hidden */
/* Прячем только панели и альтернативные кнопки, а не любые aria-hidden */
.kap-auth .kap-auth__pane[hidden],
.kap-auth .kap-pane[hidden],
.kap-auth [data-pane][hidden] { display: none !important; }

.kap-auth .kap-auth__alt[hidden],
.kap-auth .kap-auth__alt[aria-hidden="true"] { display: none !important; }

/* ==== Drawer layout upgrade ============================================ */

/* сам модальный диалог — колонка, чтобы контакты ушли вниз */
.modal-dialog--menu{
  display:flex;
  flex-direction:column;
  height:100vh;           /* фикс по высоте вьюпорта */
  max-height:100vh;
  overflow-y:auto;        /* ← скроллится САМО меню */
  overscroll-behavior:contain;
}

/* чтобы фон-модалки не пропускал скролл к body */
.modal--menu{
  position:fixed;
  inset:0;
}

/* верхняя строка: языки слева, тема справа */
.drawer-top{
  padding:0 0 6px;
  margin-bottom:4px;
}
.drawer-top__row{
  display:flex;
  align-items:center;
  gap:8px;
}

/* языки — в одну строку, без переносов */
.drawer-top__langs .drawer-langs{
  display:flex;
  flex-wrap:nowrap;
  gap:6px;
  padding:0;
}
.drawer-top__langs .drawer-lang{
  padding:4px 8px;
  font-size:13px;
}

/* кнопка темы справа */
.drawer-top .theme-toggle{
  margin-left:auto;
  padding:6px 8px;
  margin-right: 40px;
}

/* блок корзины: кнопки рядом */
.drawer-cart__actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.drawer-extra__section + .drawer-extra__section{
  margin-top:8px;
}
.drawer-extra__title{
  margin:20px 0 10px;
}

.drawer-contacts__title{
  margin:0 0 4px;
}
.drawer-contacts__title--socials{
  margin-top:10px;
}

/* мессенджеры под контактами, компактно */
.drawer-messengers{
  margin-top:8px;
}
.drawer-messengers__title{
  font-size:13px;
  color:var(--muted);
  margin-bottom:4px;
}
.socials--messengers .soc,
.socials--drawer .soc{
  width:32px;
  height:32px;
}

.drawer-socials {
    padding-bottom: 100px;
}

[data-cart-summary][hidden]{
  display:none !important;
}

/* Когда открыта модалка — фиксируем страницу */
body.modal-open{
  overflow: hidden;
  touch-action: none; /* на всякий случай блокируем жесты body */
}

/* Внутри модалки скроллим только контент */
.modal-dialog--menu{
  max-height: 100dvh;              /* не выше экрана */
  overflow-y: auto;                /* вертикальный скролл внутри */
  overscroll-behavior: contain;    /* не тянем за собой страницу */
  touch-action: pan-y;             /* только вертикальный скролл, без горизонтального “езда” */
  -webkit-overflow-scrolling: touch;
}

/* Полностью запрещаем горизонтальные жесты внутри бокового меню */
.modal--menu,
.modal--menu * {
  touch-action: pan-y !important;      /* только вертикальный скролл */
}

/* На всякий случай убираем горизонтальный скролл */
.modal--menu {
  overflow-x: hidden;
}

