/* ================= BASE ================= */

:root{
    --container: 1320px;
    --blue: #15466E;        /* фирменный синий */
    --ease: cubic-bezier(.2,.8,.2,1);

    /* ЕДИНЫЙ ОТСТУП СВЕРХУ (и для лого, и для карточек) */
    --topPad: 40px;
}

*{ margin:0; padding:0; box-sizing:border-box; }
img{ display:block; max-width:100%; }
body{ font-family:'Montserrat', Arial, sans-serif; }

/* ================= HEADER ================= */

.site-header{
    position:absolute;
    top:0; left:0;
    width:100%;
    z-index:200;
    transition: background .35s var(--ease), box-shadow .35s var(--ease);
}

.header-inner{
    max-width: var(--container);
    margin: 0 auto;
    padding: var(--topPad) 40px 22px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap: 24px;
}

.header-logo{
    position: relative;
    display:inline-flex;
    align-items:center;
    text-decoration:none;
    min-height: 48px;
}

.header-logo .logo-full,
.header-logo .logo-compact{
    display:inline-flex;
    align-items:center;
    transition: opacity .35s var(--ease);
    will-change: opacity;
}

.header-logo .logo-full svg,
.header-logo .logo-compact svg{
    height:48px;
    width:auto;
    color: #fff;
    transition: color .35s var(--ease);
}

/* фикс смещения: не двигаем и не масштабируем — меняем только opacity */
.header-logo .logo-full{ opacity:1; }
.header-logo .logo-compact{
    position:absolute;
    left:0; top:50%;
    transform: translateY(-50%);
    opacity:0;
}

/* MENU */
.header-menu{
    display:flex;
    align-items:center;
    gap: 22px;
    position: relative;
}

.header-menu .menu{
    list-style:none;
    display:flex;
    align-items:center;
}

.header-menu .menu li{
    position: relative;
    padding: 0 16px;
}

.header-menu .menu li:not(:last-child)::after{
    content:"|";
    position:absolute;
    right:-4px;
    top:50%;
    transform:translateY(-50%);
    color: rgba(255,255,255,.65);
    transition: color .35s var(--ease);
}

.header-menu .menu a{
    color:#fff;
    text-decoration:none;
    font-weight:500;
    font-size:16px;
    letter-spacing:.08em;
    line-height:1;
    position:relative;
    padding-bottom:8px;
    transition: color .35s var(--ease);
}

/* underline */
.header-menu .menu a::after{
    content:"";
    position:absolute;
    bottom:0;
    height:2px;
    background: currentColor;
    width:0;
    transition: width .28s var(--ease);
}
.header-menu .menu li:first-child a::after{ left:0; }
.header-menu .menu li:nth-child(2) a::after{ right:0; }
.header-menu .menu a:hover::after{ width:100%; }

/* CATALOG BUTTON */
.catalog-button{
    display:flex;
    align-items:center;
    gap: 14px;

    padding: 12px 18px;
    border-radius: 18px;

    border: 1px solid rgba(255,255,255,.25);
    background: rgba(255,255,255,.95);
    color: var(--blue);

    cursor:pointer;
    font-weight:500;
    font-size: 14px;
    letter-spacing: .08em;

    box-shadow: 0 14px 40px rgba(0,0,0,.18);
    transition: background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease), transform .2s var(--ease);
}

.catalog-button:hover{ transform: translateY(-1px); }

.catalog-text{ white-space:nowrap; }

.catalog-burger{
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap: 4px;

    padding-left: 14px;
    border-left: 1px solid rgba(21,70,110,.16);
    transition: border-color .35s var(--ease);
}

.catalog-burger span{
    width: 18px;
    height: 2px;
    background: currentColor;
    display:block;
    border-radius: 2px;
    transition: transform .28s var(--ease), opacity .18s var(--ease);
}

/* burger -> X (работает и через .active, и через aria-expanded="true") */
.catalog-button.active .catalog-burger span:nth-child(1),
.catalog-button[aria-expanded="true"] .catalog-burger span:nth-child(1){
    transform: translateY(6px) rotate(45deg);
}
.catalog-button.active .catalog-burger span:nth-child(2),
.catalog-button[aria-expanded="true"] .catalog-burger span:nth-child(2){
    opacity: 0;
}
.catalog-button.active .catalog-burger span:nth-child(3),
.catalog-button[aria-expanded="true"] .catalog-burger span:nth-child(3){
    transform: translateY(-6px) rotate(-45deg);
}

/* CART */
.header-cart{
    width: 44px;
    height: 44px;
    border-radius: 999px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    text-decoration:none;
    transition: background .2s var(--ease), color .35s var(--ease);
}
.header-cart:hover{ background: rgba(255,255,255,.14); }
.header-cart svg{ width: 22px; height: 22px; }

/* ================= FIXED HEADER STATE ================= */

.site-header.is-fixed{
    position: fixed;
    top: 0;
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(10px);
    box-shadow: 0 18px 55px rgba(0,0,0,.14);
}

.site-header.is-fixed .header-inner{
    padding: 14px 40px;
}

.site-header.is-fixed .header-logo .logo-full{ opacity:0; }
.site-header.is-fixed .header-logo .logo-compact{ opacity:1; }

.site-header.is-fixed .header-logo svg{ color: var(--blue); }

.site-header.is-fixed .header-menu .menu a{ color: var(--blue); }
.site-header.is-fixed .header-menu .menu li:not(:last-child)::after{ color: rgba(21,70,110,.55); }

.site-header.is-fixed .header-cart{ color: var(--blue); }
.site-header.is-fixed .header-cart:hover{ background: rgba(21,70,110,.08); }

.site-header.is-fixed .catalog-button{
    background: var(--blue);
    color: #fff;
    border-color: rgba(21,70,110,.10);
}
.site-header.is-fixed .catalog-burger{ border-color: rgba(255,255,255,.28); }

/* ================= DROPDOWN ================= */

.catalog-wrap{
    position: relative;
    display: inline-flex;
    align-items: center;
}

.catalog-button{
    text-decoration:none;
}

.catalog-dropdown{
    position: absolute;
    top: calc(100% + 12px);
    right: 0;
    left: auto;
    width: 760px;
    max-width: calc(100vw - 32px);

    opacity:0;
    visibility:hidden;
    transform: translateY(-8px);

    transition: opacity .18s var(--ease), transform .18s var(--ease), visibility .18s var(--ease);
    z-index: 500;
}

.catalog-wrap:hover .catalog-dropdown,
.catalog-wrap:focus-within .catalog-dropdown,
.catalog-dropdown.active{
    opacity:1;
    visibility:visible;
    transform: translateY(0);
}

.catalog-dropdown-inner{
    background: rgba(255,255,255,.98);
    border-radius: 20px;
    border: 1px solid rgba(21,70,110,.10);
    box-shadow: 0 24px 60px rgba(0,0,0,.16);
    overflow:hidden;
}

.catalog-grid{
    padding: 16px 18px;
    display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 22px;
    position: relative;
    max-width: 740px;
    margin: 0 auto;
    align-content: start;
}

.catalog-grid::before{
    content:"";
    position:absolute;
    top: 16px;
    bottom: 16px;
    left: 50%;
    width: 1px;
    background: rgba(21,70,110,.12);
    transform: translateX(-0.5px);
    pointer-events:none;
}

.catalog-item{
    display:flex;
    align-items:center;
    gap: 8px;
    padding: 7px 8px;
    border-radius: 12px;
    text-decoration:none;
    color: var(--blue);
    background: transparent;
    transition: background .16s var(--ease), transform .16s var(--ease);
}

.catalog-grid .catalog-item:nth-child(odd){ padding-right: 12px; }
.catalog-grid .catalog-item:nth-child(even){ padding-left: 12px; }

.catalog-item:hover{
    background: rgba(21,70,110,.06);
    transform: translateY(-1px);
}

.catalog-item-icon{
    flex: 0 0 26px;
    width: 26px;
    height: 26px;
    border-radius: 9px;
    display:flex;
    align-items:center;
    justify-content:center;
    background: rgba(21,70,110,.06);
    font-size: 14px;
}

.catalog-title{
    display:block;
    font-weight: 500;
    font-size: 11.2px;
    line-height: 1.18;
    letter-spacing: -.01em;
    word-break: normal;
}

/* ================= HERO ================= */

.hero{
    background: url('../img/hero-bg.svg') center / cover no-repeat;
    min-height: 94vh;
    padding-bottom: 0;
}

.hero-inner{
    max-width: var(--container);
    margin: 0 auto;
    padding: calc(var(--topPad) + 120px) 40px 60px;
    display: grid;
    grid-template-columns: 440px 720px;
    gap: 88px;
    justify-content: center;
    align-items: center;
}

/* PRODUCTS (desktop) */
.hero-products{
    display:flex;
    flex-direction:column;
    gap: 16px;
}

.hero-products--mobile{
    display:none;
    margin-top: 42px;
}

/* CARD */
.product-card{
    background: rgba(255,255,255,.92);
    border-radius: 18px;
    box-shadow: 0 18px 46px rgba(0,0,0,.16);
    overflow:hidden;
    display:grid;
    grid-template-columns: 185px 1fr;
    min-height: 130px;
}

.product-media{
    background: linear-gradient(180deg, rgba(21,70,110,.06), rgba(21,70,110,0));
    display:flex;
    align-items:center;
    justify-content:center;
    padding: 14px;
}

.product-media img{
    width: 100%;
    height: 132px;
    object-fit: contain;
}

.product-body{
    padding: 14px 16px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap: 7px;
}

.product-title{
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
    color: var(--blue);
}

.product-desc{
    font-size: 12px;
    line-height: 1.35;
    color: rgba(21,70,110,.78);
}

.product-prices{
    display:flex;
    align-items:baseline;
    gap: 10px;
}

.old-price{
    font-size: 11px;
    color: rgba(21,70,110,.52);
    text-decoration: line-through;
}

.new-price{
    font-size: 16px;
    font-weight: 900;
    color: var(--blue);
}

.btn-order{
    margin-top: 6px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height: 36px;
    padding: 0 16px;
    border-radius: 12px;
    background: var(--blue);
    color: #fff;
    text-decoration:none;
    font-weight: 500;
    font-size: 12px;
    transition: transform .2s var(--ease);
}

.btn-order:hover{ transform: translateY(-1px); }

/* TEXT */
.hero-text{
    color:#fff;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.hero-title{
    font-size: 56px;
    font-weight: 900;
    letter-spacing: -0.02em;
    line-height: 1.06;
    margin-bottom: 18px;
}

.hero-subtitle{
    font-size: 18px;
    line-height: 1.65;
    max-width: 640px;
    color: rgba(255,255,255,.92);
}

.hero-actions{
    margin-top: 24px;
    display:flex;
    align-items:center;
    gap: 14px;
}

.hero-cta{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height: 42px;
    padding: 0 16px;
    border-radius: 14px;
    background: #fff;
    color: var(--blue);
    text-decoration:none;
    font-weight: 500;
    font-size: 13px;
    white-space: nowrap;
    box-shadow: 0 16px 40px rgba(0,0,0,.16);
    transition: transform .2s var(--ease);
}
.hero-cta:hover{ transform: translateY(-1px); }

.hero-cta--ghost{
    background: transparent;
    color: rgba(255,255,255,.95);
    border: 1px solid rgba(255,255,255,.40);
    box-shadow: none;
}

/* ================= RESPONSIVE ================= */

@media (max-width: 1200px){
    .hero-inner{
        grid-template-columns: 420px 1fr;
        gap: 60px;
    }
    .hero-title{ font-size: 48px; }
}

@media (max-width: 920px){

    :root{ --topPad: 28px; }

    .header-inner{
        padding: var(--topPad) 18px 16px;
    }
    .site-header.is-fixed .header-inner{
        padding: 12px 18px;
    }

    .header-menu .menu{
        display:none;
    }

    .catalog-dropdown{
        position: fixed;
        left: 12px;
        right: 12px;
        top: 78px;
        width: auto;
        max-width: none;
        transform: translateY(-8px);
    }
    .catalog-wrap:hover .catalog-dropdown,
    .catalog-wrap:focus-within .catalog-dropdown,
    .catalog-dropdown.active{
        transform: translateY(0);
    }
    .catalog-dropdown-inner{
        max-height: calc(100vh - 110px);
        overflow-y: auto;
        border-radius: 18px;
    }

    .catalog-grid{
        max-width: none;
        margin: 0 auto;
        padding: 12px;
        gap: 4px;
        grid-template-columns: 1fr;
    }
    .catalog-grid::before{
        display:none;
    }
    .catalog-grid .catalog-item{ padding: 8px 10px; }
    .catalog-title{ font-size: 11.5px; line-height: 1.2; }
    .catalog-item-icon{ width: 24px; height: 24px; flex-basis: 24px; font-size: 13px; }


    /* фон короче на мобилке */
    .hero{
        min-height: 80vh;
        padding-bottom: 0;
    }

    .hero-inner{
        padding: calc(var(--topPad) + 92px) 22px 80px;
        grid-template-columns: 1fr;
        gap: 24px;
        justify-content: center;
        align-items: start;
    }

    .hero-products{ display:none; }

    .hero-products--mobile{
        display:flex;
        justify-content:center;
        margin-top: 46px;
    }

    .hero-products--mobile .product-card{
        width: 100%;
        max-width: 420px;
        margin: 0 auto;
    }

    .hero-title{
        font-size: 38px;
        line-height: 1.08;
    }

    .hero-subtitle{
        font-size: 15px;
        line-height: 1.6;
    }

    .hero-actions{
        justify-content: center;
        gap: 12px;
        flex-wrap: nowrap;
        margin-top: 18px;
    }

    .hero-cta{
        height: 40px;
        padding: 0 14px;
        font-size: 12px;
        border-radius: 14px;
    }

    @media (max-width: 390px){
        .hero-actions{ flex-wrap: wrap; }
        .hero-cta{ width: 100%; }
    }
}

/* ================= INNER PAGES HEADER ================= */

.site-header.header--inner {
    position: fixed;
    top: 0;
    background: rgba(255,255,255,.96);
    backdrop-filter: blur(10px);
    box-shadow: 0 18px 55px rgba(0,0,0,.14);
}

/* логотипы */
.site-header.header--inner .logo-full {
    opacity: 0;
}

.site-header.header--inner .logo-compact {
    opacity: 1;
}

/* цвет логотипа */
.site-header.header--inner svg {
    color: var(--blue);
}

/* меню */
.site-header.header--inner .header-menu .menu a {
    color: var(--blue);
}

.site-header.header--inner .header-menu .menu li:not(:last-child)::after {
    color: rgba(21,70,110,.55);
}

/* корзина */
.site-header.header--inner .header-cart {
    color: var(--blue);
}

.site-header.header--inner .header-cart:hover {
    background: rgba(21,70,110,.08);
}

/* кнопка каталога */
.site-header.header--inner .catalog-button {
    background: var(--blue);
    color: #fff;
    border-color: rgba(21,70,110,.10);
}

.site-header.header--inner .catalog-burger {
    border-color: rgba(255,255,255,.28);
}

/* ================= INNER PAGES FIX ================= */

/* высота хедера в "проскролленном" состоянии */
:root{
    --header-fixed-height: 76px;
}

/* отступ контента вниз */
body.inner-page{
    padding-top: var(--header-fixed-height);
}

/* хэдер на внутренних страницах */
.site-header.header--inner{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--header-fixed-height);
}

/* фиксируем padding, чтобы он НЕ менялся */
.site-header.header--inner .header-inner{
    padding: 14px 40px;
}

/* ===== TERMS: CARD + SIDEBAR NAV ===== */

.terms-layout {
    padding: 56px 16px;
}

.terms-layout__wrap {
    max-width: 1180px;
    margin: 0 auto;
}

.terms-layout__header {
    margin-bottom: 18px;
}

.terms-layout__title {
    margin: 0 0 8px;
    font-size: 28px;
    line-height: 1.2;
    font-weight: 700;
}

.terms-layout__subtitle {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    color: rgba(17, 24, 39, 0.65);
    max-width: 860px;
}

.terms-layout__grid {
    margin-top: 24px;
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 18px;
    align-items: start;
}

/* Sidebar */

.terms-nav {
    position: sticky;
    top: 92px; /* подстрой под высоту шапки */
}

.terms-nav__box {
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 14px 40px rgba(0,0,0,0.06);
    padding: 16px;
}

.terms-nav__label {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(17, 24, 39, 0.55);
    margin-bottom: 10px;
}

.terms-nav__list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: calc(100vh - 140px);
    overflow: auto;
    padding-right: 6px;
}

/* аккуратный скролл */
.terms-nav__list::-webkit-scrollbar {
    width: 8px;
}
.terms-nav__list::-webkit-scrollbar-thumb {
    background: rgba(17, 24, 39, 0.15);
    border-radius: 8px;
}
.terms-nav__list::-webkit-scrollbar-track {
    background: transparent;
}

.terms-nav__link {
    display: block;
    padding: 10px 10px;
    border-radius: 12px;
    font-size: 14px;
    line-height: 1.3;
    color: rgba(17, 24, 39, 0.82);
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
}

.terms-nav__link:hover {
    background: rgba(17, 24, 39, 0.06);
}

.terms-nav__link.is-active {
    background: rgba(12, 74, 110, 0.10); /* мягкий акцент */
    color: rgba(12, 74, 110, 1);
    font-weight: 600;
}

.terms-nav__empty {
    font-size: 13px;
    color: rgba(17, 24, 39, 0.6);
    padding: 10px;
    border-radius: 12px;
    background: rgba(17, 24, 39, 0.04);
}

/* Card */

.terms-card {
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 14px 40px rgba(0,0,0,0.06);
    overflow: hidden;
}

.terms-card__content {
    padding: 26px 26px 34px;
    font-size: 15px;
    line-height: 1.75;
    color: rgba(17, 24, 39, 0.92);
}

/* Typography inside content */

.terms-card__content h2 {
    margin: 42px 0 12px;
    font-size: 20px;
    line-height: 1.25;
    font-weight: 700;
    scroll-margin-top: 110px; /* чтобы заголовок не прятался под fixed header */
}

.terms-card__content h3 {
    margin: 26px 0 10px;
    font-size: 16px;
    line-height: 1.25;
    font-weight: 700;
}

.terms-card__content p {
    margin: 0 0 14px;
}

.terms-card__content ul {
    margin: 12px 0 18px 20px;
}

.terms-card__content li {
    margin-bottom: 8px;
}

.terms-card__content a {
    color: rgba(12, 74, 110, 1);
    text-decoration: underline;
}

/* убираем уродские hr если они есть в контенте */
.terms-card__content hr {
    border: 0;
    border-top: 1px solid rgba(17, 24, 39, 0.12);
    margin: 18px 0;
}

/* Responsive */

@media (max-width: 980px) {
    .terms-layout__grid {
        grid-template-columns: 1fr;
    }

    .terms-nav {
        position: relative;
        top: auto;
    }

    .terms-nav__list {
        max-height: none;
        overflow: visible;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 8px;
        padding-right: 0;
    }

    .terms-nav__link {
        padding: 8px 10px;
        border-radius: 999px;
        font-size: 13px;
    }
}

@media (max-width: 560px) {
    .terms-layout {
        padding: 36px 12px;
    }

    .terms-card__content {
        padding: 18px 16px 24px;
    }

    .terms-layout__title {
        font-size: 22px;
    }
}

/* ===========================
   NSK Catalog (Woo archive)
=========================== */
.nsk-catalog{
  padding:32px 0 50px;
}

.nsk-catalog__container{
  max-width:1400px;
  margin:0 auto;
  padding:0 20px;
  display:grid;
  grid-template-columns:300px 1fr;
  gap:28px;
  align-items:start;
}

.nsk-catalog__sidebar{
  position:sticky;
  top:120px;
}

.nsk-catalog__block{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:18px;
  padding:16px;
  box-shadow:0 12px 26px rgba(0,0,0,.06);
}

.nsk-catalog__block + .nsk-catalog__block{ margin-top:14px; }

.nsk-catalog__title{
  font-weight:900;
  font-size:14px;
  margin:0 0 12px;
  color:#111827;
}

.nsk-catalog__cats{
  list-style:none;
  padding:0;
  margin:0;
}

.nsk-catalog__cats li{
  margin:0;
}

.nsk-catalog__cats a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 12px;
  border-radius:12px;
  color:#111827;
  text-decoration:none;
}

.nsk-catalog__cats a:hover{
  background:#f3f6fb;
}

.nsk-catalog__main .woocommerce-result-count,
.nsk-catalog__main .woocommerce-ordering{
  margin-bottom:16px;
}

.woocommerce ul.products{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:20px;
  margin:0 !important;
}

.woocommerce ul.products li.product{
  float:none !important;
  width:auto !important;
  margin:0 !important;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 12px 26px rgba(0,0,0,.06);
}

.woocommerce ul.products li.product a img{
  border-radius:18px !important;
  padding:14px;
  margin:0 !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title{
  padding:0 14px;
  font-size:16px !important;
  font-weight:900 !important;
  line-height:1.25;
  margin:0 0 8px !important;
}

.woocommerce ul.products li.product .price{
  padding:0 14px 10px;
  font-weight:900;
  color:#111827;
}

.woocommerce ul.products li.product .button{
  margin:0 14px 14px !important;
  width:calc(100% - 28px);
  text-align:center;
  border-radius:999px !important;
  background:#15466E !important;
  color:#fff !important;
  font-weight:900 !important;
  border:none !important;
}

.woocommerce nav.woocommerce-pagination ul{
  border:none;
}
.woocommerce nav.woocommerce-pagination ul li{
  border:none;
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{
  border-radius:999px;
  padding:10px 14px;
  border:1px solid #d1d5db;
}

@media (max-width:1200px){
  .woocommerce ul.products{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
  .nsk-catalog__container{ grid-template-columns:280px 1fr; }
}
@media (max-width:900px){
  .nsk-catalog__container{ grid-template-columns:1fr; }
  .nsk-catalog__sidebar{ position:static; }
  .woocommerce ul.products{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width:520px){
  .woocommerce ul.products{ grid-template-columns:1fr; }
}

/* ================= MOBILE HEADER FIX ================= */

@media (max-width: 920px){

    /* реальная высота мобильной шапки */
    :root{
        --header-fixed-height: 72px;
    }

    body.inner-page{
        padding-top: calc(var(--header-fixed-height) + env(safe-area-inset-top));
    }

    .site-header.header--inner{
        height: var(--header-fixed-height);
        padding-top: env(safe-area-inset-top);
    }

}

/* если вдруг на очень узких экранах */
@media (max-width: 480px){

    :root{
        --header-fixed-height: 68px;
    }

    body.inner-page{
        padding-top: calc(var(--header-fixed-height) + env(safe-area-inset-top));
    }

}
/* Hover bridge: курсор не теряет выпадающее меню между кнопкой и списком */
.catalog-wrap::after{
    content:"";
    position:absolute;
    top:100%;
    right:0;
    width:100%;
    height:14px;
}

/* ===== Equal popular/product cards: price and button aligned ===== */
.woocommerce ul.products li.product{
  display:flex !important;
  flex-direction:column !important;
  min-height:445px;
  padding-bottom:14px;
}
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link,
.woocommerce ul.products li.product a.woocommerce-loop-product__link{
  display:flex !important;
  flex-direction:column !important;
  flex:1 1 auto !important;
  min-height:0;
}
.woocommerce ul.products li.product a img{
  width:100% !important;
  height:220px !important;
  object-fit:contain !important;
  padding:18px !important;
  margin:0 auto 10px !important;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  min-height:62px;
  display:block;
  padding:0 18px !important;
  margin:0 0 14px !important;
}
.woocommerce ul.products li.product .price{
  margin-top:auto !important;
  min-height:44px;
  padding:0 18px 10px !important;
  display:flex !important;
  align-items:flex-end;
  gap:8px;
  flex-wrap:wrap;
}
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button{
  margin:0 18px 0 !important;
  width:calc(100% - 36px) !important;
  min-height:46px;
  display:flex !important;
  align-items:center;
  justify-content:center;
  align-self:stretch;
}
@media (max-width: 768px){
  .woocommerce ul.products li.product{min-height:410px;}
  .woocommerce ul.products li.product a img{height:190px !important;}
  .woocommerce ul.products li.product .woocommerce-loop-product__title{min-height:54px;}
}