/******************************************************
* 5. STYLE — CPC Trading
*
* Мерна единица: em. Базата е body font-size
* (base.css / font-sizes.css): 14px → 19px при 1920px.
* Макетът е 1920px → 1em = 19px. Стойностите са
* изчислени като px_в_макета / 19.
* Внимание: ако елементът има собствен font-size,
* em-ите в него са спрямо НЕГОВИЯ размер.
******************************************************/

:root{
    --blue: #0C1248;
    --red: #B70C0C;
    --red-dark: #960909;
    --grey-bg: #F3F2F0;
    --grey-page: #F7F7F7;
    --grey-circle: #F4F3F2;
    --grey-line: #E2E2E2;
    --grey-border: #E3E3E3;
    --font: "PT Sans Narrow", "Arial Narrow", Arial, sans-serif;
}

/* ---------- Общи ---------- */
body{
    font-family: "PT Sans Narrow", sans-serif;
    color: var(--blue);
    line-height: 1.25;
}
a{
    color: inherit;
}
a:hover{
    color: var(--red);
    text-decoration: none;
}
h1,h2,h3,h4,h5,h6{
    margin: 0;
    line-height: 1.15;
}
ul{
    list-style: none;
    margin: 0;
    padding: 0;
}
address{
    margin: 0;
}

.page{
    overflow-x: clip;
}

/* ---------- SVG иконки ----------
   Всяка иконка е inline SVG в .svg-wrapper.svg-<име>.
   Размерът се задава на wrapper-а (в em), SVG-то го запълва.
   .svg-cutout = вътрешни „дупки“ в иконката, в цвета на фона
   (--icon-bg се сменя по секции). */
.svg-wrapper{
    display: block;
    width: 1em;
    height: 1em;
    line-height: 0;
    flex: 0 0 auto;
}
.svg-wrapper svg{
    display: block;
    width: 100%;
    height: 100%;
}
.svg-cutout{
    fill: var(--icon-bg, #fff);
}

/* ---------- Заглавия на секции ---------- */
.section{
    padding-top: 2.2em;
}
.section-title{
    display: flex;
    align-items: center;
    gap: 0.75em;
    font-size: 1.9em;               
    font-weight: 700;
    color: var(--red);
    text-transform: uppercase;
    line-height: 1;
}
.section-title > span{
    flex: 0 0 auto;
}
.section-title::after,
.section-title--center::before{
    content: "";
    flex: 1 1 auto;
    /* рамка, не фон с височина - браузърът закръгля рамките до цял пиксел,
       затова линията е еднакво дебела навсякъде (и при zoom / мащаб на Windows) */
    height: 0;
    border-top: 2px solid var(--red);
    opacity: .85;
}
/* линиите излизат до ръба на екрана */
.section-title::after{
    margin-right: calc(50% - 50vw);
}
.section-title--center::before{
    margin-left: calc(50% - 50vw);
}

.section-subtitle {
    margin: 2em auto 0;
    font-size: 1.5em;
    font-weight: 400;
    text-transform: uppercase;
    text-align: center;
    line-height: 1.2;
}

/* ---------- Бутони и линкове ---------- */
.btn-red{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 10.7em;              /* 235px / 22 */
    height: 2.3em;                  /* 50px / 22 */
    padding: 0 1.2em;
    font-size: 1.15em;              /* 22px */
    color: #fff;
    text-transform: uppercase;
    background: var(--red);
    border-radius: 0.2em;
    transition: background-color .2s;
}
.btn-red:hover{
    color: #fff;
    background: var(--red-dark);
}

.link-more {
    display: inline-block;
    font-size: 1.15em;
    color: var(--red);
    text-transform: uppercase;
    text-decoration: underline;
    text-underline-offset: 0.15em;
    white-space: nowrap;
}
.link-more:hover{
    color: var(--blue);
    text-decoration: underline;
}

/******************************************************
* 1. TOP BAR
******************************************************/
.topbar{
    background: var(--red);
    color: #fff;
}
.topbar__inner{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    /* height: 2.75em; */
    padding: 0.6em 0;
}
.topbar__links{
    display: flex;
    gap: 1.25em;
}
.topbar__links a{
    font-size: 0.85em;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    font-family: "Montserrat", sans-serif;
}
.topbar a:hover{
    color: #fff;
    opacity: .75;
}

.topbar_right_part {
    display: flex;
    align-items: center;
}
.topbar__icons{
    display: flex;
    align-items: center;
    gap: 1em;
    margin-left: 1.75em;
}
.topbar__icon{
    display: flex;
    font-size: 1.35em;              /* = размерът на BG | EN */
}


.topbar__lang{
    display: flex;
    align-items: center;
    gap: 0.45em;
    margin-left: 1.75em;
    font-size: 1.35em;
    font-weight: 700;
}
.topbar__lang a{
    opacity: .55;
}
.topbar__lang a.is-active{
    opacity: 1;
}
.topbar__sep{
    width: 2px;
    height: 0.95em;
    background: #fff;
}

/******************************************************
* 2. HEADER
******************************************************/
.header {
    position: relative;
    z-index: 20;
    background: #fff;
    position: sticky;
    top: 0;
}
.header__inner {
    display: flex;
    align-items: center;
    /* height: 5.05em; */
    padding: 1.1em 0;
    padding-bottom: 0.5em;
}
.header__logo{
    flex: 0 0 auto;
    margin-right: auto;
}
.header__logo img{
    display: block;
    width: 8.5em;                   /* 158px */
}
.header__panel{
    display: flex;
    align-items: center;
}
.main-nav{
    display: flex;
    gap: 1.6em;
}
.main-nav a{
    font-size: 1.25em;
    text-transform: uppercase;
    white-space: nowrap;
    transition: color .2s;
    font-weight: 500;
    color: #0C1248;
    letter-spacing: 0.03em;
}
.main-nav a:hover{
    color: #b70c0c;
}

.search{
    position: relative;
    width: 16.7em;                  /* 318px */
    margin-left: 1.6em;
}
.search__input{
    width: 100%;
    height: 2.3em;                  /* 48px / 21 */
    padding: 0 2.9em 0 0.95em;
    font-size: 1.1em;               /* 21px */
    color: var(--blue);
    border: 2px solid #D2D2D2;
    border-radius: 1.15em;
    outline: none;
    transition: border-color .2s;
    font-family: "Montserrat", sans-serif;
}
.search__input::placeholder{
    color: #B0B0B0;
}
.search__input:focus{
    border-color: var(--blue);
}
.search__btn {
    position: absolute;
    top: 50%;
    right: 0.2em;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.1em;
    height: 2.1em;
    padding: 0.2em;
    color: #fff;
    background: var(--red);
    border: 0;
    border-radius: 50%;
    transform: translateY(-50%);
}
.search__btn .svg-search{
    width: 100%;
    height: 100%;
}
.search.is-loading .search__btn{
    animation: search-pulse .8s ease-in-out infinite alternate;
}
@keyframes search-pulse{
    to{ opacity: .45; }
}

/* резултати при писане (js/cpc-search.js) */
.search-results{
    position: absolute;
    top: calc(100% + 0.5em);
    right: 0;
    z-index: 30;
    width: 36em;
    max-width: calc(100vw - 30px);
    max-height: min(70vh, 42em);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 0.6em 0;
    background: #fff;
    border: 1px solid var(--grey-line);
    border-radius: 0.6em;
    box-shadow: 0 1em 2em rgba(12, 18, 72, .15);
    text-align: left;
}
.search-results[hidden]{
    display: none;
}
.search-results__group + .search-results__group{
    margin-top: 0.4em;
    padding-top: 0.4em;
    border-top: 1px solid var(--grey-line);
}
.search-results__title{
    margin: 0;
    padding: 0.5em 1.1em 0.3em;
    font-size: 0.85em;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #8A8A8A;
}
.search-results__item{
    display: flex;
    align-items: center;
    gap: 0.8em;
    padding: 0.5em 1.1em;
    color: var(--blue);
    transition: background .15s;
}
.search-results__item:hover,
.search-results__item.is-active{
    background: #F4F4F4;
}
.search-results__img{
    flex: 0 0 2.8em;
    width: 2.8em;
    height: 2.8em;
    overflow: hidden;
    background: #F4F4F4;
    border-radius: 0.3em;
}
.search-results__img:empty{
    visibility: hidden;
}
.search-results__img img,
.search-results__img .swatch{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.search-results__body{
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-width: 0;
}
.search-results__name{
    font-size: 1em;
    font-weight: 500;
    line-height: 1.3;
}
.search-results__name mark{
    padding: 0;
    color: var(--red);
    background: none;
    font-weight: 700;
}
.search-results__meta{
    font-size: 0.82em;
    color: #8A8A8A;
}
.search-results__price{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    flex: 0 0 auto;
    font-size: 0.85em;
    font-weight: 700;
    white-space: nowrap;
    color: var(--red);
}
.search-results__price del{
    font-weight: 400;
    color: #8A8A8A;
}
.search-results__price .bs-card__price-label{
    font-weight: 400;
}
.search-results__count{
    flex: 0 0 auto;
    min-width: 2em;
    padding: 0.15em 0.5em;
    font-size: 0.8em;
    text-align: center;
    color: #8A8A8A;
    background: #F4F4F4;
    border-radius: 1em;
}
.search-results__item.is-active .search-results__count,
.search-results__item:hover .search-results__count{
    background: #fff;
}
.search-results__all{
    display: block;
    margin: 0.2em 1.1em 0.4em;
    padding: 0.45em 0;
    font-size: 0.9em;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--red);
}
.search-results__all:hover,
.search-results__all.is-active{
    color: var(--red-dark);
    text-decoration: underline;
}
.search-results__empty,
.search-results__fix{
    margin: 0;
    padding: 0.7em 1.1em;
    font-size: 0.95em;
    color: #6A6A6A;
}
.search-results__fix{
    padding-bottom: 0.2em;
}

.header__actions.flex {
    display: flex;
    gap: 1.6em;
    align-items: center;
    justify-content: space-between;
}

.header__cart{
    color: var(--red);
}
.header__cart .svg-cart{
    width: 1.9em;                   /* 36px при 19px */
    height: 1.9em;
}
.header__cart:hover{
    color: var(--red-dark);
}

.header__burger{
    display: none;
    width: 2em;
    height: 2em;
    padding: 0em;
    margin-left: 1.6em;
    color: var(--blue);
    background: none;
    border: 0;
    order: 3;
    padding: 0;
}
.header__burger .svg-wrapper{
    width: 100%;
    height: 100%;
}
.header__burger .svg-state-close{
    display: none;
}
.header.is-open .header__burger .svg-state-open{
    display: none;
}
.header.is-open .header__burger .svg-state-close{
    display: block;
}

/******************************************************
* 3. HERO
******************************************************/
.hero{
    display: flex;
    aspect-ratio: 3840 / 1256;
    min-height: 26em;
    background: var(--blue) url("../../images/cpc/hero.jpg") center right / cover no-repeat;
    color: #fff;
}
.hero > .container{
    display: flex;
    align-items: flex-end;
}
.hero__content{
    padding-bottom: 2.9em;          /* 55px */
}
.hero__title{
    margin: 0;
    font-size: 1em;                 /* нулира h1 1.8em от base.css */
    font-weight: 400;
    text-transform: uppercase;
}
.hero__title-top{
    display: block;
    font-size: 3.35em;              /* 64px */
    line-height: 0.9;
}
.hero__title-accent{
    display: block;
    margin-top: 0.08em;
    font-size: 6.75em;              /* 128px */
    font-weight: 700;
    color: var(--red);
    line-height: 1;
}
.hero__text{
    margin: 1.25em 0 0;
    font-size: 1.35em;
    line-height: 1.2;
    letter-spacing: 0.03em;
}

/******************************************************
* 4. ПРЕДИМСТВА
******************************************************/
.features{
    padding: 2.25em 0;
    background: var(--grey-bg);
}
.feature{
    display: flex;
    align-items: flex-start;
    gap: 1.25em;
    height: 100%;
}
.features .col-lg-3 + .col-lg-3 .feature{
    padding-left: 1.6em;
    border-left: 2px solid #C9C9C9;
}
.feature-inner-wrapper {
    display: flex;
    gap: 1.1em;
    justify-content: space-between;
}

.feature__icon{
    flex: 0 0 auto;
    width: 3.4em;                   /* 65px */
    height: 3.4em;
    margin-top: 0.4em;
    color: var(--blue);
}
.features{
    --icon-bg: var(--grey-bg);      /* колелата на камиона */
}
.feature__title{
    margin-bottom: 0.2em;
    font-size: 1.45em;
    font-weight: 700;
    text-transform: uppercase;
}
.feature__text{
    margin: 0;
    font-size: 1.25em;
    line-height: 1.2;
}

/******************************************************
* 5. ЗА НАС
******************************************************/
.about.section h2.section-title {
    margin-bottom: 1em;
}
.about__body{
    text-align: center;
}
.about__body h3 {
    text-transform: uppercase;
    font-size: 1.1em;
    font-weight: 500;
    margin-bottom: 0.35em;
}
.about.section .about__body{
    margin: 0.3em auto 0;
    font-size: 1.35em;             
    line-height: 1.27;
}

.wrapper-btn.wrapper-btn-about-section {
    text-align: center;
    margin-top: 1.5em;
}
/******************************************************
* 6. НАШИТЕ ПРОДУКТИ
******************************************************/
.products{
    padding-top: 4.4em;
}
/* row + col-6 col-md-4 col-xl; разстоянието между колоните е в em */
.products__row{
    row-gap: 2.5em;
    margin-top: 3.4em;
    margin-left: -1.7em;
    margin-right: -1.7em;
}
.products__row > [class*="col"]{
    padding-left: 1.7em;            /* 3.4em между картите */
    padding-right: 1.7em;
}
.product-card{
    text-align: center;
}
.product-card__img{
    display: block;
    overflow: hidden;
    border-radius: 0.3em;
}
.product-card__img img{
    display: block;
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    transition: transform .4s;
}
.product-card__img:hover img{
    transform: scale(1.04);
}
.product-card__title{
    margin-top: 1.7em;
    font-size: 1.35em;              /* 26px */
    font-weight: 700;
    text-transform: uppercase;
}
.product-card__text {
    margin: 0.55em auto 0;
    font-size: 1.15em;
}
.product-card .link-more{
    margin-top: 0.85em;
}

/******************************************************
* 7. НАЙ-ПОРЪЧВАНИ — карусел
******************************************************/
.bestsellers{
    padding-top: 4.7em;
}
.carousel{
    --gap: 2.2em;                   /* 42px */
    --per-view: 4;
    display: flex;
    align-items: center;
    margin-top: 3.05em;
}
.carousel__arrow{
    flex: 0 0 6.4em;                /* 122px */
    display: flex;
    align-items: center;
    padding: 0;
    color: #000;
    background: none;
    border: 0;
    transition: opacity .2s, color .2s;
}
.carousel__arrow .svg-wrapper{
    width: 1.35em;
    height: 2.25em;
    margin-left: 1.25em;
}
.carousel__arrow--next{
    justify-content: flex-end;
}
.carousel__arrow--next .svg-wrapper{
    margin: 0 1.25em 0 0;
}
.carousel__arrow:hover{
    color: var(--red);
}
.carousel__arrow:disabled{
    opacity: .2;
    cursor: default;
    color: #000;
}
/* всички карти се събират (напр. 1 продукт при 4 на ред) - без стрелки;
   мястото им остава, за да са картите подравнени като в другите карусели */
.carousel.is-static .carousel__arrow{
    visibility: hidden;
}

.carousel__viewport{
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    gap: var(--gap);
    padding: 0.15em 0.1em;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 0.1em;
    scroll-behavior: smooth;
    scrollbar-width: none;
    outline: none;
}
.carousel__viewport::-webkit-scrollbar{
    display: none;
}
.carousel__viewport.is-dragging{
    scroll-snap-type: none;
    scroll-behavior: auto;
    cursor: grabbing;
    user-select: none;
}
.carousel__viewport.is-dragging a{
    pointer-events: none;
}

.bs-card{
    flex: 0 0 calc((100% - (var(--per-view) - 1) * var(--gap)) / var(--per-view));
    display: flex;
    flex-direction: column;
    padding: 0.45em;
    background: #fff;
    border: 1px solid var(--grey-border);
    border-radius: 0.25em;
    box-shadow: 0 0.05em 0.25em rgba(0, 0, 0, .06);
    scroll-snap-align: start;
}
.bs-card__img{
    display: block;
    aspect-ratio: 616 / 380;
    overflow: hidden;
    border-radius: 0.25em;
}
.bs-card__img img,
.bs-card__img .swatch{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.bs-card__img img[src*="primer"]{
    object-fit: contain;
}
.swatch{
    background: var(--swatch);
    border-radius: 0.25em;
}
.bs-card__title{
    margin: 1.9em 0.45em 0;         /* спрямо собствения 24px */
    font-size: 1.27em;              /* 24px */
    font-weight: 700;
}
.bs-card__foot{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: auto 0 0;
    padding: 3.3em 0.55em 0.3em;
}
.bs-card__price{
    font-size: 1.27em;
    font-weight: 700;
}
.bs-card__actions{
    display: flex;
    gap: 0.6em;
}
.round-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.1em;                   /* 40px */
    height: 2.1em;
    padding: 0;
    color: #fff;
    background: var(--blue);
    border: 0;
    border-radius: 50%;
    transition: background-color .2s;
}
.round-btn .svg-wrapper{
    width: 1.25em;
    height: 1.25em;
}
.round-btn:hover{
    background: var(--red);
}

.carousel-progress{
    position: relative;
    height: 3px;
    margin-top: 2.3em;
    background: var(--grey-line);
}
.carousel-progress span{
    position: absolute;
    top: -1px;
    left: 0;
    height: 4px;
    width: 25%;
    background: var(--blue);
    border-radius: 2px;
    transition: left .15s linear, width .2s;
}

.bs-card__actions > a:hover,
a.round-btn.add_to_cart_button.ajax_add_to_cart:hover{
    color: #fff;
}
/******************************************************
* 8. ПАРТНЬОРИ
******************************************************/
.partners{
    padding-top: 4.7em;
}
.partners__subtitle{
    max-width: 31em;
    margin-top: 1.65em;
}
.partners__list{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1.5em 3.8em;               /* 72px */
    margin-top: 2.2em;
}
.partner a{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 7.8em;                   /* 148px */
    height: 7.8em;
    font-size: 1em;
    font-weight: 700;
    background: var(--grey-circle);
    border-radius: 50%;
    transition: background-color .2s, color .2s;
}
.partner a:hover{
    color: #fff;
    background: var(--blue);
}

/******************************************************
* 9. НОВИНИ
******************************************************/
.news{
    padding-top: 2.9em;
}
.news__row{
    margin-top: 2.2em;
    row-gap: 2em;
}
.news__row > [class*="col-"]:first-child{
    padding-right: 1.6em;
}
.news__row > [class*="col-"]:last-child{
    padding-left: 1.6em;
}
.news-card__img{
    display: block;
    overflow: hidden;
    border-radius: 0.35em;
}
.news-card__img img{
    display: block;
    width: 100%;
    aspect-ratio: 1608 / 1020;
    object-fit: cover;
    transition: transform .4s;
}
.news-card__img:hover img{
    transform: scale(1.03);
}
.news-card__body{
    padding: 1.5em 1.05em 0 1.6em;
}
.news-card__title{
    font-size: 1.5em;              
    font-weight: 700;
}
.news-card__row{
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1.5em;
    margin-top: 0.45em;
}
.news-card__text{
    margin: 0;
    font-size: 1.2em;
}

/******************************************************
* 10. ЕВРОПЕЙСКИ ПРОЕКТ
******************************************************/
.eu{
    display: flex;
    margin-top: 5.1em;
    aspect-ratio: 3840 / 886;
    min-height: 19em;
    background: #2C8FD0 url("../../images/cpc/eu-banner.jpg") center / cover no-repeat;
    color: #fff;
}
.eu > .container{
    display: flex;
    align-items: center;
}
.eu__content{
    max-width: 23em;
    text-shadow: 0 0.05em 0.4em rgba(12, 18, 72, .35);
}
.eu__title{
    font-size: 1.6em;               /* 30px */
    font-weight: 700;
    text-transform: uppercase;
}
.eu__text{
    margin: 1.7em 0 0;
    font-size: 1.15em;              /* 22px */
    line-height: 1.27;
}
.eu__link{
    display: inline-block;
    margin-top: 2.4em;
    font-size: 1em;
    text-transform: uppercase;
    text-decoration: underline;
    text-underline-offset: 0.15em;
}
.eu__link:hover{
    color: #fff;
    opacity: .8;
    text-decoration: underline;
}

/******************************************************
* 11. СВЪРЖЕТЕ СЕ С НАС
******************************************************/
.contacts{
    padding-top: 4.4em;
    padding-bottom: 4.3em;
}
.contacts .section-subtitle{
    margin-top: 1.6em;
}
.contacts__row{
    align-items: center;
    margin-top: 2.1em;
}
.contacts__map{
    width: calc(100% - 2.2em);
    height: 11.3em;                 /* 215px */
    overflow: hidden;
    border-radius: 0.35em;
    background: #E9ECEF;
}
.contacts__map iframe{
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}
.contacts__list{
    padding: 0.3em 0 0.3em 4.2em;   /* 80px */
    border-left: 2px solid var(--red);
}
.contact-row{
    display: flex;
    align-items: center;
    gap: 1.6em;
    font-size: 1.15em;
    letter-spacing: 0.02em;
}
.contact-row + .contact-row{
    margin-top: 0.55em;
}
.contact-row a:hover{
    color: var(--red);
}
.icon-circle {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.8em;
    height: 1.8em;
    color: var(--red);
    border-radius: 50%;
}
.icon-circle .svg-wrapper{
    width: 1.15em;
    height: 1.15em;
}
.icon-circle--filled{
    color: #fff;
    background: var(--red);
}
.icon-circle--outline{
    border: 2px solid var(--red);
}
.icon-circle--pin .svg-wrapper{
    width: 2.1em;
    height: 2.1em;
}

/******************************************************
* 12. FOOTER
******************************************************/
.footer{
    padding: 2.4em 0 2.3em;
    background: var(--blue);
    color: #fff;
    --icon-bg: var(--blue);
}
.footer__text {
    max-width: 22em;
    margin: 1.75em 0 0;
    font-size: 1.25em;
    line-height: 1.18;
}
.footer a:hover{
    color: #fff;
    opacity: .7;
}
.footer__logo img{
    display: block;
    width: 8.3em;
}
.footer-col__title {
    font-size: 1.25em;
    font-weight: 700;
    text-transform: uppercase;
}
.footer__social{
    display: flex;
    align-items: center;
    gap: 1.35em;
    margin-top: 1.4em;
}
.footer__social .svg-wrapper{
    width: 1.45em;
    height: 1.45em;
}
.footer__cols{
    display: flex;
    justify-content: flex-end;
    padding-top: 3.15em;
}
.footer-col {
    position: relative;
    padding: 0 2.4em 0;
    width: 33.333%;
    flex: 0 0 33.333%;
    display: flex;
    justify-content: center;
}
.footer-col:first-child{
    padding-left: 0;
}
.footer-col:last-child{
    padding-right: 5.5em;
}
.footer-col + .footer-col::before{
    content: "";
    position: absolute;
    top: 1.85em;
    bottom: 0;
    left: 0;
    width: 2px;
    background: rgba(255, 255, 255, .45);
}
.footer-col ul{
    margin-top: 0.85em;
}
.footer-col li {
    font-size: 1.051em;
    text-transform: uppercase;
    white-space: nowrap;
    margin-bottom: 0.75em;
}
.footer__copy{
    margin: 2.2em 0 0;
    font-size: 1em;
}

/******************************************************
* RESPONSIVE (под 1200px body остава 14px)
******************************************************/

@media (min-width: 768px){
    .logged-in.admin-bar header#header {
        top: 2em;
    }
}

@media (max-width: 1399px){
    .main-nav{
        gap: 1.2em;
    }
    .main-nav a{
        font-size: 1.1em;
    }
    .search{
        width: 13em;
        margin-left: 1.2em;
    }
}

@media (max-width: 1199px){
    /* меню → хамбургер */
    .header__burger{
        display: block;
    }
    .header__cart{
        order: 2;
    }
    .header__panel{
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        flex-direction: column;
        align-items: stretch;
        padding: 1em 15px 1.5em;
        background: #fff;
        border-top: 1px solid var(--grey-line);
        box-shadow: 0 1em 1.5em rgba(12, 18, 72, .12);
        visibility: hidden;
        opacity: 0;
        transform: translateY(-0.5em);
        transition: opacity .2s, transform .2s, visibility .2s;
    }
    .header.is-open .header__panel{
        visibility: visible;
        opacity: 1;
        transform: none;
    }
    .main-nav{
        flex-direction: column;
        gap: 0;
    }
    .main-nav a{
        padding: 0.7em 0;
        font-size: 1.2em;
        border-bottom: 1px solid var(--grey-line);
    }
    .search{
        width: 100%;
        margin: 1.2em 0 0;
    }

    .products__row{
        row-gap: 3em;
        margin-left: -1em;
        margin-right: -1em;
    }
    .products__row > [class*="col"]{
        padding-left: 1em;
        padding-right: 1em;
    }
    .carousel{
        --per-view: 3;
    }
    .features .col-lg-3 + .col-lg-3 .feature{
        padding-left: 1em;
    }
    .footer-col{
        padding: 0 1.5em 0 2.5em;
    }
    .footer-col:last-child{
        padding-right: 0;
    }
}

@media (max-width: 991px){
    .carousel{
        --per-view: 2;              /* таблет */
    }
    .features .row{
        row-gap: 2em;
    }
    .features .col-lg-3 + .col-lg-3 .feature{
        padding-left: 0;
        border-left: 0;
    }
    .contacts__map{
        width: 100%;
        height: 18em;
    }
    .contacts__list{
        margin-top: 2em;
        padding: 0;
        border-left: 0;
    }
    .footer__cols{
        justify-content: flex-start;
        padding-top: 2.5em;
    }
    .footer-col:first-child{
        padding-left: 0;
    }
}

@media (max-width: 767px){
    .section-title{
        font-size: 1.4em;
    }
    .hero{
        aspect-ratio: auto;
        min-height: 30em;
        background-position: 72% center;
        position: relative;
    }
    .hero::before{
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(to top, rgba(12, 18, 72, .85), rgba(12, 18, 72, 0) 70%);
    }
    .hero > .container{
        position: relative;
    }
    .hero__title-top{
        font-size: 2.8em;
    }
    .hero__title-accent{
        font-size: 5em;
    }
    .hero__text br{
        display: none;
    }

    .search .search__btn{
        top: 2px;
        transform: none;
    }

    .about__text{
        font-size: 1.05em;
    }
    .products__row{
        row-gap: 2.5em;
        margin-left: -0.6em;
        margin-right: -0.6em;
    }
    .products__row > [class*="col"]{
        padding-left: 0.6em;
        padding-right: 0.6em;
    }
    .product-card__title{
        font-size: 1.15em;
    }
    .carousel{
        --gap: 1em;
    }
    .carousel__arrow{
        flex-basis: 2.4em;
    }
    .carousel__arrow .svg-wrapper,
    .carousel__arrow--next .svg-wrapper{
        margin: 0;
    }
    .news__row > [class*="col-"]:first-child,
    .news__row > [class*="col-"]:last-child{
        padding-left: 15px;
        padding-right: 15px;
    }
    .news-card__body{
        padding: 1.2em 0 0;
    }
    .news-card__row{
        flex-direction: column;
        gap: 0.6em;
    }
    .eu{
        aspect-ratio: auto;
        min-height: 22em;
        background-position: 65% center;
        position: relative;
    }
    .eu::before{
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(to right, rgba(12, 18, 72, .7), rgba(12, 18, 72, .15));
    }
    .eu > .container{
        position: relative;
    }
    .footer__cols{
        flex-wrap: wrap;
        row-gap: 2em;
    }
    .footer-col,
    .footer-col:first-child,
    .footer-col:last-child{
        flex: 0 0 50%;
        padding: 0;
    }
    .footer-col + .footer-col::before{
        display: none;
    }


    .woocommerce-cart td.product-thumbnail {
        display: block !important;
    }
    .woocommerce-cart td.product-thumbnail:before{
        content: '' !important;
    }
}

@media (max-width: 575px){
    .topbar__links{
        gap: 0.9em;
    }
    .topbar__lang,
    .topbar__icons{
        margin-left: 1em;
    }
    .carousel{
        --per-view: 1;              /* телефон */
    }
    .carousel__arrow{
        display: none;
    }
    .partners__list{
        gap: 1em;
    }
    .partner a{
        width: 6em;
        height: 6em;
    }
    .footer-col,
    .footer-col:first-child,
    .footer-col:last-child{
        flex-basis: 100%;
    }
}

/* фокус рамка само при навигация с клавиатура */
button:focus:not(:focus-visible){
    outline: 0;
}


/******************************************************
* 13. ВЪТРЕШНИ СТРАНИЦИ (общи)
* Ползва се от prahovi-boi.html; компонентите са
* общи и за следващите категорийни страници.
* Макет 879px → 1920px: 1px в макета ≈ 0.115em
******************************************************/

/* активен линк в менюто */
.main-nav a.is-active{
    color: var(--red);
    text-decoration: underline;
    text-underline-offset: 0.25em;
    text-decoration-thickness: 2px;
}

/* заглавие с линия, която спира в края на колоната */
.section-title--col::after{
    margin-right: 0;
}
/* центрирано заглавие, линиите остават в контейнера */
.section-title--contained::before{
    margin-left: 0;
}
.section-title--contained::after{
    margin-right: 0;
}

.wrapper-btn--center{
    text-align: center;
}

/* ---------- Hero на вътрешна страница ---------- */
.hero--inner{
    aspect-ratio: auto;             /* расте със съдържанието, не се застъпва с header-а */
    min-height: 33em;               /* = 628px при 1920 */
}
.hero--inner > .container{
    position: relative;
    padding-top: 5em;               /* място за breadcrumbs */
}
.hero--inner .hero__content{
    padding-bottom: 5.3em;
}
.hero--inner .hero__title-accent{
    font-size: 6em;
}
.hero--inner .hero__text{
    max-width: 24em;
}

.breadcrumbs{
    position: absolute;
    top: 2em;
    left: 15px;                     /* = padding на .container (bootstrap) */
    display: flex;
    align-items: center;
    gap: 0.4em;
    font-family: "Montserrat", sans-serif;
    font-size: 0.8em;
    color: #fff;
}
.breadcrumbs a:hover{
    color: #fff;
    opacity: .75;
}
@media (min-width: 1300px){
    .breadcrumbs{
        left: 8.75em;               /* = 7em padding на .container ÷ 0.8 (собствения font-size) */
    }
}

/* ---------- Текст + снимка (split) ---------- */
.split-section{
    padding: 3.3em 0;
}
.split-section--grey{
    background: var(--grey-page);
}
.split-section--stack{
    padding: 2.6em 0 3em;
}
/* row + col-lg-4 (текст) + col-lg-8 (снимка) */
.split{
    margin-left: -1em;
    margin-right: -1em;
}
.split > [class*="col"]{
    display: flex;                  /* текстовата колона се разтяга до височината на снимката */
    padding-left: 1em;              /* 2em между колоните */
    padding-right: 1em;
}
/* редовете: всеки е на цялата ширина (.split-band) със свой .container */
.split-band + .split-band{
    margin-top: 4.25em;
}
/* ред със собствен фон („Настройки за реда“) - отстъп вътре в цвета,
   без празна ивица между него и съседните редове */
.split-band.cpc-row--bg{
    padding: 3.3em 0;
}
.split-band.cpc-row--bg + .split-band,
.split-band + .split-band.cpc-row--bg{
    margin-top: 0;
}
.split-band.cpc-row--bg + .split-band:not(.cpc-row--bg){
    padding-top: 3.3em;
}
/* ред без фон точно преди цветен ред - отстъп и отдолу (иначе съдържанието опира в цвета) */
.split-band:not(.cpc-row--bg):has(+ .split-band.cpc-row--bg){
    padding-bottom: 3.3em;
}

/* „Отстъп отгоре / отдолу“ от „Настройки за реда“ - заменят автоматичните.
   Разстоянието между два реда = долният отстъп на горния + горният на долния */
.split-band[class*="cpc-row--pt-"]{
    margin-top: 0 !important;
}
.split-band[class*="cpc-row--pb-"] + .split-band{
    margin-top: 0 !important;
}
.split-band.cpc-row--pt-none{ padding-top: 0 !important; }
.split-band.cpc-row--pt-s{    padding-top: 1.6em !important; }
.split-band.cpc-row--pt-m{    padding-top: 3.3em !important; }
.split-band.cpc-row--pt-l{    padding-top: 5em !important; }
.split-band.cpc-row--pb-none{ padding-bottom: 0 !important; }
.split-band.cpc-row--pb-s{    padding-bottom: 1.6em !important; }
.split-band.cpc-row--pb-m{    padding-bottom: 3.3em !important; }
.split-band.cpc-row--pb-l{    padding-bottom: 5em !important; }
.split__text{
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.split__text .section-title{
    align-self: stretch;
    margin-bottom: 1.05em;
}
.split .section-text{
    /* max-width: 16em; */
    font-size: 1.25em;
    line-height: 1.2;
}
.split .section-text *:last-child{
    margin: 0;
}
.split .wrapper-btn{
    margin-top: auto;
    padding-top: 1.8em;
}
.split__media{
    flex: 1 1 auto;
    align-self: flex-start;         /* височината идва от снимката */
    overflow: hidden;
    border-radius: 0.35em;
}
.split__media img{
    display: block;
    width: 100%;
    height: auto;
}

/* първият блок: по-широк текст, сертификати долу */
.split--intro .section-text{
    max-width: 20.5em;
}
.split--intro .wrapper-btn{
    margin-top: 0;
}
.certs{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.6em 1em;
    margin-top: auto;
    padding-top: 2em;
}
li.certs__item {
    width: calc(25% - 1em);
    min-width: calc(25% - 1em);
    flex: 0 0 calc(25% - 1em);
    padding: 0.25em;
}
.certs__item img{
    display: block;
    width: auto;
    height: 3.1em;
}
li.certs__item img {
    width: 100%;
    height: auto;
}

/* ---------- Какво предлагаме ---------- */
.offer{
    padding: 4em 0 2.6em;
}
/* row + col-6 col-md-4 col-xl (5 равни колони на xl) */
.offer__list{
    margin: 1.9em 0 0;
    row-gap: 2.5em;
}
.offer__list > [class*="col"]{
    padding: 0;
}
.offer-item{
    height: 100%;
    padding: 0 1em;
    text-align: center;
}
.offer__list > [class*="col"] + [class*="col"] .offer-item{
    border-left: 2px solid #C9C9C9;
}
.offer-item__icon{
    width: 3.7em;
    height: 3.7em;
    margin: 0 auto;
    color: var(--blue);
}
.offer-item__title{
    margin-top: 0.75em;
    font-size: 1.45em;
    font-weight: 700;
    text-transform: uppercase;
}
.offer-item__text{
    margin: 0.3em 0 0;
    font-size: 1.15em;
    line-height: 1.2;
}

/* ---------- Специални ефекти ---------- */
.effects{
    padding-top: 3.9em;
}
/* row + col-6 col-md-4 col-xl-2 */
.effects__list{
    row-gap: 2.5em;
    margin-top: 2.8em;
    margin-left: -0.575em;
    margin-right: -0.575em;
}
.effects__list > [class*="col"]{
    padding-left: 0.575em;          /* 1.15em между плочките */
    padding-right: 0.575em;
}
.effect{
    text-align: center;
}
.effect__img{
    overflow: hidden;
    border-radius: 0.3em;
}
.effect__img img{
    display: block;
    width: 100%;
    aspect-ratio: 238 / 188;
    object-fit: cover;
}
.effect__title{
    margin-top: 1.1em;
    font-size: 1.35em;
    font-weight: 700;
    text-transform: uppercase;
}
.effect__text{
    margin: 0.3em auto 0;
    max-width: 13em;
    font-size: 1.1em;
    line-height: 1.2;
}

/* ---------- Услуги ---------- */
.services{
    padding-top: 3.6em;
}
/* row + 2 × col-lg-6 */
.services__row{
    align-items: center;
    margin-top: 2.6em;
}
.services__media{
    display: flex;
    justify-content: flex-end;
}
.services__media img{
    display: block;
    width: 32em;
    max-width: 100%;
}
.services__list{
    padding-left: 4.1em;
}
.service{
    display: flex;
    align-items: center;
    gap: 1.7em;
}
.service + .service{
    margin-top: 1.3em;
}
.svg-check-badge{
    width: 1.6em;
    height: 1.6em;
    color: var(--blue);
}
.service__text{
    font-size: 1.3em;
    font-weight: 700;
}

/* ---------- Последни новини ---------- */
.latest-news{
    padding-top: 4.5em;
    padding-bottom: 3.2em;
}
/* row + col-md-6 col-lg-4 */
.latest-news__row{
    row-gap: 2em;
    margin-top: 1.9em;
    margin-left: -0.63em;
    margin-right: -0.63em;
}
.latest-news__row > [class*="col"]{
    padding-left: 0.63em;           /* 1.26em между картите */
    padding-right: 0.63em;
}
.news-tile{
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--grey-page);
    border-radius: 0.35em;
}
.news-tile__img{
    display: block;
    overflow: hidden;
}
.news-tile__img img{
    display: block;
    width: 100%;
    aspect-ratio: 494 / 335;
    object-fit: cover;
    transition: transform .4s;
}
.news-tile__img:hover img{
    transform: scale(1.03);
}
.news-tile__body{
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 1.3em 1.7em 1.4em;
}
.news-tile__date{
    font-size: 1.05em;
    font-weight: 700;
    color: var(--red);
}
.news-tile__title{
    margin-top: 0.35em;
    font-size: 1.35em;
    font-weight: 700;
    line-height: 1.05;
}
.news-tile__text{
    max-width: 15em;
    margin: 0.5em 0 0;
    font-size: 1.1em;
    line-height: 1.2;
}
.news-tile .link-more{
    margin-top: auto;
    padding-top: 1.6em;
}
.latest-news .wrapper-btn{
    margin-top: 1.7em;
}

/* ---------- Responsive: вътрешни страници ---------- */
@media (max-width: 1199px){
    /* 3 на ред (col-md-4): без линия пред 1-ва и 4-та */
    .offer__list > [class*="col"]:nth-child(3n + 1) .offer-item{
        border-left: 0;
    }
}

@media (max-width: 991px){
    .split > [class*="col"]{
        display: block;
    }
    .split > .col-lg-8{
        order: -1;                  /* снимката над текста */
        margin-bottom: 2em;
    }
    .split .section-text,
    .split--intro .section-text{
        max-width: none;
    }
    .split .wrapper-btn{
        padding-top: 1.5em;
    }
    .services__row{
        row-gap: 2.5em;
    }
    .services__media{
        justify-content: center;
    }
    .services__list{
        width: fit-content;
        margin: 0 auto;
        padding-left: 0;
    }

}

@media (max-width: 767px){
    .topbar__inner{
        justify-content: space-between;
    }
    .hero::before,
    .hero--inner::before{
        background: linear-gradient(to top, rgba(12, 18, 72, .92), rgba(12, 18, 72, .55));
    }
    .footer-col{
        justify-content: flex-start;
    }
    .hero--inner .hero__title-accent{
        font-size: 4.2em;
    }
    .hero--inner .hero__text{
        max-width: none;
    }
    /* 2 на ред (col-6): без линия пред нечетните */
    .offer__list > [class*="col"]:nth-child(3n + 1) .offer-item{
        border-left: 2px solid #C9C9C9;
    }
    .offer__list > [class*="col"]:nth-child(2n + 1) .offer-item{
        border-left: 0;
    }
    .service__text{
        font-size: 1.15em;
    }
}

@media (max-width: 575px){
    .offer__list > [class*="col"]{
        flex: 0 0 100%;
        max-width: 100%;
    }
    .offer__list > [class*="col"]:nth-child(n) .offer-item{
        border-left: 0;
    }
    .offer__list > [class*="col"] + [class*="col"] .offer-item{
        padding-top: 2em;
        border-top: 1px solid var(--grey-line);
    }
}


/******************************************************
* 14. ПРОДУКТОВА СТРАНИЦА (produkt.html)
* Макетът е 1920px → 1em = 19px, стойностите са px / 19.
* Подредба: row + col-* и flex (без grid).
******************************************************/

/* breadcrumbs върху бял фон */
.breadcrumbs--page{
    position: static;
    padding-top: 1.85em;
    font-size: 0.85em;              /* 16px */
    color: var(--blue);
}
.breadcrumbs--page a:hover{
    color: var(--red);
    opacity: 1;
}

/* ---------- Горна част: галерия + информация ---------- */
.product{
    padding-top: 1.4em;
}
.product__row,
.product-details__row{
    margin-left: -1.13em;
    margin-right: -1.13em;
}
.product__row > [class*="col"],
.product-details__row > [class*="col"]{
    padding-left: 1.13em;           /* 43px между колоните */
    padding-right: 1.13em;
}

/* галерия */
.gallery__main{
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 708 / 418;
    padding: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid #ECECEC;
    border-radius: 0.3em;
}
button.gallery__main{
    cursor: zoom-in;
    touch-action: pan-y;            /* хоризонталният swipe е в JS */
    user-select: none;
}
.gallery__zoom{
    position: absolute;
    right: 0.7em;
    bottom: 0.7em;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.4em;
    height: 2.4em;
    color: #fff;
    background: var(--blue);
    border-radius: 50%;
    opacity: .85;
    transition: opacity .2s, background-color .2s;
}
.gallery__zoom .svg-wrapper{
    width: 1.1em;
    height: 1.1em;
}
button.gallery__main:hover .gallery__zoom,
button.gallery__main:focus-visible .gallery__zoom{
    opacity: 1;
    background: var(--red);
}

/* видео в галерията: корица / първи кадър + ▶ */
.gallery__main.is-video{
    cursor: pointer;
    background: var(--blue);        /* Vimeo без корица - тъмна плочка */
}
.gallery__main.is-video .gallery__zoom{
    display: none;
}
.gallery__main-video{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none;
}
.gallery__play{
    position: absolute;
    top: 50%;
    left: 50%;
    display: none;
    align-items: center;
    justify-content: center;
    width: 4.2em;
    height: 4.2em;
    margin: -2.1em 0 0 -2.1em;
    color: #fff;
    background: var(--red);
    border-radius: 50%;
    box-shadow: 0 0.3em 1em rgba(0, 0, 0, .25);
    transition: transform .2s;
}
.gallery__play .svg-wrapper{
    width: 1.8em;
    height: 1.8em;
    margin-left: 0.2em;             /* оптически център на ▶ */
}
.gallery__main.is-video .gallery__play,
.gallery__play--small{
    display: flex;
}
.gallery__main.is-video:hover .gallery__play{
    transform: scale(1.08);
}
.gallery__play--small{
    width: 2em;
    height: 2em;
    margin: -1em 0 0 -1em;
}
.gallery__play--small .svg-wrapper{
    width: 0.95em;
    height: 0.95em;
    margin-left: 0.1em;
}
.gallery__main img{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: opacity .2s;
}
.gallery__main img.is-changing{
    opacity: 0;
}
/* миниатюри: карусел (3 на ред, стрелки само ако не се събират) */
.gallery__strip{
    display: flex;
    align-items: center;
    gap: 0.35em;
    margin-top: 0.63em;
}
.gallery__nav{
    flex: 0 0 1.6em;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 2.6em;
    padding: 0;
    color: var(--blue);
    background: none;
    border: 0;
    transition: color .2s, opacity .2s;
}
.gallery__nav .svg-wrapper{
    width: 1.1em;
    height: 1.1em;
}
.gallery__nav:hover{
    color: var(--red);
}
.gallery__nav:disabled{
    opacity: .25;
    cursor: default;
    color: var(--blue);
}
.gallery__thumbs{
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    gap: 0.63em;                    /* 12px между миниатюрите */
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: none;
}
.gallery__thumbs::-webkit-scrollbar{
    display: none;
}
.gallery__thumbs.is-dragging{
    scroll-snap-type: none;
    scroll-behavior: auto;
    cursor: grabbing;
    user-select: none;
}
.gallery__thumb{
    flex: 0 0 calc((100% - 2 * 0.63em) / 3);
    scroll-snap-align: start;
    display: block;
    width: 100%;
    aspect-ratio: 228 / 135;
    padding: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid #ECECEC;
    border-radius: 0.3em;
    transition: border-color .2s;
}
.gallery__thumb img{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.gallery__thumb:hover,
.gallery__thumb.is-active{
    border-color: var(--blue);
}
.gallery__thumb{
    position: relative;
}
.gallery__thumb[data-type="video"]{
    background: var(--blue);
}
.gallery__thumb img,
.gallery__thumb video{
    pointer-events: none;           /* без „влачене“ на снимката при drag */
}
.gallery__thumb video{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* цял екран */
.has-lightbox{
    overflow: hidden;
}
.lightbox{
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3.5em 4.5em;
    overflow: hidden;
    background: rgba(12, 18, 72, .94);
}
.lightbox__img{
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    background: #fff;
    border-radius: 0.3em;
    user-select: none;
    touch-action: none;             /* щипването и влаченето са в JS */
    cursor: zoom-in;
    will-change: transform;
}
.lightbox__img.is-animated{
    transition: transform .25s ease;
}
.lightbox.is-zoomed .lightbox__img{
    cursor: grab;
}
.lightbox.is-panning .lightbox__img{
    cursor: grabbing;
}
/* при увеличена снимка бутоните остават над нея */
.lightbox__close,
.lightbox__nav,
.lightbox__zoom,
.lightbox__count{
    z-index: 1;
}
.lightbox.is-zoomed .lightbox__nav{
    opacity: .3;
    pointer-events: none;
}
.lightbox__zoom{
    position: absolute;
    top: 0.9em;
    left: 0.9em;
    display: flex;
    gap: 0.4em;
}
.lightbox__zoom-btn{
    width: 2.2em;
    height: 2.2em;
    padding: 0;
    font-size: 1.2em;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    background: rgba(255, 255, 255, .15);
    border: 1px solid rgba(255, 255, 255, .4);
    border-radius: 50%;
    transition: background-color .2s, opacity .2s;
}
.lightbox__zoom-btn:hover{
    background: var(--red);
}
.lightbox__zoom-btn:disabled{
    opacity: .35;
    cursor: default;
    background: rgba(255, 255, 255, .15);
}

/* видео на цял екран */
.lightbox.is-video .lightbox__zoom{
    display: none;
}
.lightbox__video{
    max-width: 100%;
    max-height: 100%;
    background: #000;
    border-radius: 0.3em;
}
.lightbox__embed{
    width: min(100%, calc((100vh - 7em) * 16 / 9));
    aspect-ratio: 16 / 9;
}
.lightbox__embed iframe{
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 0.3em;
}
.lightbox__close,
.lightbox__nav{
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: #fff;
    background: none;
    border: 0;
    transition: color .2s;
}
.lightbox__close{
    top: 0.4em;
    right: 0.6em;
    width: 1.6em;
    height: 1.6em;
    font-size: 2.2em;
    line-height: 1;
}
.lightbox__nav{
    top: 50%;
    width: 3em;
    height: 4em;
    margin-top: -2em;
}
.lightbox__nav .svg-wrapper{
    width: 1.8em;
    height: 1.8em;
}
.lightbox__nav--prev{
    left: 0.6em;
}
.lightbox__nav--next{
    right: 0.6em;
}
.lightbox__close:hover,
.lightbox__nav:hover{
    color: #FF6B6B;
}
.lightbox__close:focus-visible,
.lightbox__nav:focus-visible{
    outline: 2px solid #fff;
}
.lightbox__count{
    position: absolute;
    bottom: 0.9em;
    left: 0;
    right: 0;
    margin: 0;
    color: #fff;
    text-align: center;
}
@media (max-width: 767px){
    .lightbox{
        padding: 3.5em 0.5em;
    }
    .lightbox__nav{
        top: auto;
        bottom: 0.2em;
        margin-top: 0;
    }
}

/* информация */
.product-info__title{
    display: inline-block;
    padding-bottom: 0.15em;
    font-size: 2.5em;               /* 48px */
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1.1;
    border-bottom: 2px solid var(--red);
}
.stock{
    display: flex;
    align-items: center;
    gap: 0.55em;
    margin: 0.85em 0 0;
}
.svg-stock{
    width: 1.37em;
    height: 1.37em;
    color: var(--red);
}
.stock__text{
    font-size: 0.95em;
    color: var(--red);
    text-transform: uppercase;
}
.product-specs{
    display: flex;
    flex-wrap: wrap;
    gap: 0.3em 2.3em;
    margin-top: 0.75em;
    font-size: 1.15em;              /* 22px */
}
.product-info__desc{
    margin: 0.75em 0 0;
    font-size: 1.1em;
    line-height: 1.2;
}
.product-color{
    display: flex;
    align-items: center;
    gap: 0.3em;
    margin: 0.6em 0 0;
    font-size: 1.15em;
}
.product-color__dot{
    width: 1em;
    height: 1em;
    margin-left: 0.25em;
    background: var(--dot);
    border-radius: 50%;
}

/* цена + количество + бутон */
.buy{
    display: flex;
    align-items: flex-end;
    margin-top: 2.2em;
}
.buy__main{
    flex: 0 0 29em;                 /* 550px */
    max-width: 29em;
}
.buy__row{
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.5em;
}
.buy__label{
    display: block;
    margin: 0 0 0.3em;
    font-size: 1.05em;
}
.buy__label--red{
    margin: 0;
    font-size: 1.15em;
    font-weight: 700;
    color: var(--red);
}
.buy__amount{
    margin: 0;
    font-size: 1.8em;               /* 34px */
    font-weight: 700;
    color: var(--red);
    line-height: 1.15;
}
/* намалена цена: редовната - зачеркната над текущата */
.buy__old{
    display: block;
    font-size: 1.2em;
    color: #6F7180;
}
/* вариации преди избор: „от … / до …“ */
.buy__range-line{
    margin: 0;
    font-size: 1.5em;
    font-weight: 700;
    color: var(--red);
    line-height: 1.15;
}
.buy__range-line small{
    font-size: 0.6em;
    font-weight: 400;
    color: #6F7180;
}
.buy__tier{
    margin: 0.3em 0 0;
    font-size: 1.05em;
}
.buy__qty{
    flex: 0 0 14.2em;
}

.qty{
    display: flex;
    align-items: stretch;
    height: 2.75em;                 /* 52px */
}
.qty__btn{
    flex: 0 0 2.75em;
    padding: 0;
    font-size: 1em;
    font-weight: 700;
    color: #fff;
    background: var(--blue);
    border: 0;
    border-radius: 0.2em;
    transition: background-color .2s;
}
.qty__btn:hover{
    background: var(--red);
}
.qty__field{
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.3em;
    font-size: 1.05em;
    background: #F4F4F4;
}
.qty__input{
    width: 2.4em;
    padding: 0;
    color: var(--blue);
    text-align: right;
    background: transparent;
    border: 0;
    outline: none;
    -moz-appearance: textfield;
}
.qty__input::-webkit-outer-spin-button,
.qty__input::-webkit-inner-spin-button{
    -webkit-appearance: none;
    margin: 0;
}
.qty__field:focus-within{
    box-shadow: inset 0 0 0 2px var(--blue);
}

.btn-red--block{
    display: flex;
    width: 100%;
    height: 2.1em;
    margin-top: 0.65em;
    font-size: 1.25em;              /* 24px */
    border: 0;
}

.buy__meta{
    margin: 0 0 0.2em 1.6em;
    font-size: 0.85em;              /* 16px */
    line-height: 1.75;
}
.buy__meta span{
    color: var(--red);
}

/* таблица с отстъпки */
.price-table{
    margin-top: 1.45em;
    padding: 0.4em 1.55em 0.9em;
    background: var(--grey-page);
    border-radius: 0.3em;
}
.price-table table{
    width: 100%;
    font-size: 0.95em;              /* 18px */
    text-align: center;
}
.price-table th{
    padding: 0.6em 0;
    font-weight: 400;
    border-bottom: 2px solid var(--red);
}
.price-table td{
    padding: 0.55em 0;
}
.price-table tbody tr:first-child td{
    padding-top: 1.15em;
}
.price-table th,
.price-table td{
    width: 33.333%;
}
.price-table tr.is-active td{
    font-weight: 700;
    color: var(--red);
}
/* клик по ред → количеството от реда */
.price-table tbody tr{
    cursor: pointer;
    transition: color .2s;
}
.price-table tbody tr:hover td{
    color: var(--red);
}
.price-table tbody tr:focus-visible{
    outline: 2px solid var(--blue);
    outline-offset: -2px;
}

/* продукт с вариации: избор на вариация в същата форма */
.buy__attrs{
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.9em 1.5em;
    margin-bottom: 1.4em;
}
.buy__attr .sort__select{
    min-width: 14.2em;
}
.buy__reset{
    margin-bottom: 0.8em;
    font-size: 0.95em;
    color: var(--blue);
    text-decoration: underline;
}
.buy__reset:hover{
    color: var(--red);
}
.buy__variation:empty,
.buy__variation .woocommerce-variation-price,
.buy__variation .woocommerce-variation-description:empty{
    display: none;                  /* цената е в .buy__price */
}
.buy__variation{
    margin-bottom: 1em;
    font-size: 1.05em;
}
.buy__variation .stock{
    margin: 0;
    color: var(--red);
}
.single_add_to_cart_button.disabled{
    opacity: .5;
    cursor: not-allowed;
}

/* ---------- Табове ---------- */
.product-details{
    padding-top: 2.9em;
}
.tabs__nav{
    display: flex;
    justify-content: space-between;
    gap: 1.5em;
    overflow-x: auto;               /* ако табовете не се съберат — скрол, без пренасяне */
    scrollbar-width: none;
    box-shadow: inset 0 -2px #C8C8C8;   /* сивата линия (border би се изрязал от overflow) */
}
.tabs__nav::-webkit-scrollbar{
    display: none;
}
.tabs__btn{
    position: relative;
    flex: 0 0 auto;
    padding: 0 0 0.35em;
    font-size: 1.15em;              /* 22px */
    color: var(--blue);
    text-transform: uppercase;
    white-space: nowrap;
    background: none;
    border: 0;
    transition: color .2s;
}
.tabs__btn:hover{
    color: var(--red);
}
.tabs__btn.is-active{
    font-weight: 700;
    color: var(--red);
}
.tabs__btn.is-active::after{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 3px;
    background: var(--red);
}
.tabs__panel{
    padding-top: 1.45em;
}
/* няколко блока в един таб (текст, изброяване, таблица, файлове) */
.tabs__panel > :first-child{
    margin-top: 0;
}
.tabs__panel > * + *{
    margin-top: 2.1em;
}
.tabs__text{
    max-width: 44em;
}
.tabs__text p{
    margin: 0 0 1.2em;
    font-size: 1.05em;              /* 20px */
    line-height: 1.25;
}
.tabs__text p:last-child{
    margin-bottom: 0;
}

.benefits{
    margin-top: 2.1em;
    row-gap: 1em;
}
.benefit{
    display: flex;
    align-items: center;
    gap: 0.85em;
}
.benefit .svg-check-badge{
    width: 1.37em;
    height: 1.37em;
}
.benefit span:last-child{
    font-weight: 700;
}

.spec-table{
    width: 100%;
    max-width: 44em;
    font-size: 1.05em;
}
.spec-table th,
.spec-table td{
    padding: 0.55em 0;
    border-bottom: 1px solid var(--grey-line);
}
.spec-table th{
    width: 45%;
    padding-right: 1em;
    font-weight: 700;
}

.docs li + li{
    margin-top: 0.8em;
}
.docs__link{
    display: inline-flex;
    align-items: center;
    gap: 0.7em;
    font-size: 1.05em;
    font-weight: 700;
}
.docs__link .svg-doc{
    width: 1.5em;
    height: 1.5em;
    color: var(--red);
}

.product-details__media{
    overflow: hidden;
    border-radius: 0.3em;
}
.product-details__media img{
    display: block;
    width: 100%;
    height: auto;
}

/* ---------- Подобни продукти ---------- */
.bestsellers--similar{
    padding-top: 5.6em;
    padding-bottom: 2.6em;
}
.bs-card__img--contain img{
    object-fit: contain;
    background: #fff;
}

/* ---------- Responsive: продукт ---------- */
@media (max-width: 1199px){
    .tabs__nav{
        justify-content: flex-start;
    }
    .buy{
        flex-wrap: wrap;
    }
    .buy__meta{
        flex: 0 0 100%;
        margin: 1em 0 0;
    }
}

@media (max-width: 991px){
    .product__row,
    .product-details__row{
        row-gap: 2em;
    }
    .buy__main{
        flex: 1 1 auto;
        max-width: 29em;
    }
    .tabs__nav{
        justify-content: flex-start;
    }
}

@media (max-width: 575px){
    .product-info__title{
        font-size: 1.9em;
    }
    .buy__main{
        max-width: none;
    }
    .buy__row{
        flex-direction: column;
        align-items: stretch;
    }
    .buy__qty{
        flex-basis: auto;
    }
    .tabs__btn{
        font-size: 1.05em;
    }
}


/******************************************************
* 15. МАГАЗИН — архив с продукти (magazin.html)
* Подредба: row + col-* и flex (без grid).
******************************************************/

.visually-hidden{
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* ---------- Банер ---------- */
.shop-banner{
    display: flex;
    min-height: 19em;
    color: #fff;
    background: var(--blue) url("../../images/cpc/hero.jpg") 70% center / cover no-repeat;
}
.shop-banner > .container{
    position: relative;             /* за breadcrumbs */
    display: flex;
    align-items: center;
}
.shop-banner__content{
    padding: 5em 0 3em;
}
.shop-banner__title{
    font-size: 3.2em;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1;
}
.shop-banner__text{
    margin: 0.9em 0 0;
    font-size: 1.2em;
    line-height: 1.5;
}

/* ---------- Каталог ---------- */
.shop{
    padding: 2.9em 0 3em;
}
.shop__row{
    margin-left: -1.2em;
    margin-right: -1.2em;
}
.shop__row > [class*="col"]{
    padding-left: 1.2em;
    padding-right: 1.2em;
}

/* странична лента */
.shop-filters-toggle{
    display: none;
}
.shop-sidebar{
    max-width: 17.5em;
}
.shop-sidebar__block + .shop-sidebar__block{
    margin-top: 2.6em;
}
.shop-sidebar__title{
    margin-bottom: 1em;
    font-size: 1.3em;
    font-weight: 700;
    text-transform: uppercase;
}

.cat-list__link{
    display: flex;
    justify-content: space-between;
    gap: 1em;
    padding: 0.45em 0.6em 0.45em 0.75em;
    font-size: 1.05em;
    border-left: 3px solid transparent;
    transition: background-color .2s, border-color .2s;
}
.cat-list__count{
    color: #8A8C99;
}
.cat-list__link:hover{
    color: var(--blue);
    background: #F7F7F7;
}
.cat-list__link.is-active{
    background: #F4F4F4;
    border-left-color: var(--red);
}

.filter-group{
    min-width: 0;
    margin: 0;
    padding: 1.4em 0 1.5em;
    border: 0;
    border-top: 1px solid #E6E6E6;
}
.shop-sidebar__title + .filter-group{
    padding-top: 0.2em;
    border-top: 0;
}
.filter-group__title{
    float: left;                    /* legend без странични отстъпи */
    width: 100%;
    margin-bottom: 0.8em;
    padding: 0;
    font-size: 1em;
    font-weight: 700;
}
.filter-group__title + *{
    clear: both;
}
.filter-group__list li + li{
    margin-top: 0.45em;
}

.check{
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.75em;
    margin: 0;
    font-size: 0.98em;
    cursor: pointer;
}
.check input{
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.check__box{
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.15em;
    height: 1.15em;
    color: transparent;
    background: #fff;
    border: 1px solid #BFC1C8;
    border-radius: 0.15em;
    transition: background-color .15s, border-color .15s;
}
.check__box .svg-check{
    width: 0.8em;
    height: 0.8em;
}
.check input:checked + .check__box{
    color: #fff;
    background: var(--blue);
    border-color: var(--blue);
}
.check input:focus-visible + .check__box{
    outline: 2px solid var(--red);
    outline-offset: 2px;
}
.check__label{
    flex: 1 1 auto;
}
.check__count{
    color: #8A8C99;
}

.swatches{
    display: flex;
    flex-wrap: wrap;
    gap: 0.9em 1.05em;
}
.swatches__item[hidden]{
    display: none;
}
.swatch-check{
    position: relative;
    display: block;
    margin: 0;
    cursor: pointer;
}
.swatch-check input{
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.swatch-check__dot{
    display: block;
    width: 1.75em;
    height: 1.75em;
    background: var(--dot) center / cover;     /* цвят или url() на снимка */
    border-radius: 50%;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12);
    transition: box-shadow .15s;
}
.swatch-check:hover .swatch-check__dot{
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12), 0 0 0 2px #fff, 0 0 0 3px #BFC1C8;
}
.swatch-check input:checked + .swatch-check__dot{
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12), 0 0 0 2px #fff, 0 0 0 4px var(--blue);
}
.swatch-check input:focus-visible + .swatch-check__dot{
    outline: 2px solid var(--red);
    outline-offset: 4px;
}

.link-show-more,
.link-reset{
    margin-top: 0.9em;
    padding: 0;
    font-size: 0.95em;
    color: var(--red);
    background: none;
    border: 0;
}
.link-show-more:hover,
.link-reset:hover{
    text-decoration: underline;
}
.link-reset{
    font-weight: 700;
}

/* лента над продуктите */
.shop-toolbar{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1em;
}
.shop-toolbar__count{
    margin: 0;
    padding-left: 0.8em;
    font-size: 0.98em;
    color: #6F7180;
    border-left: 1px solid #DADADA;
}
.sort{
    position: relative;
    margin: 0;
}
.sort__select{
    min-width: 16em;
    height: 2.7em;
    padding: 0 2.6em 0 1em;
    font-size: 0.98em;
    color: var(--blue);
    background: #fff;
    border: 1px solid #E0E0E0;
    border-radius: 0.25em;
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
}
.sort__select:focus{
    border-color: var(--blue);
    outline: none;
}
.sort .svg-chevron-down{
    position: absolute;
    top: 50%;
    right: 0.9em;
    width: 1em;
    height: 1em;
    color: var(--blue);
    transform: translateY(-50%);
    pointer-events: none;
}

/* продукти: row + col-6 col-md-4 col-xl-3 */
.shop-grid{
    row-gap: 1.5em;
    margin-top: 1.9em;
    margin-left: -0.75em;
    margin-right: -0.75em;
}
.shop-grid > [class*="col"]{
    padding-left: 0.75em;           /* 1.5em между картите */
    padding-right: 0.75em;
}
.shop-grid__col[hidden]{
    display: none;
}
.shop-empty{
    margin: 2em 0 0;
    padding: 2em;
    font-size: 1.1em;
    text-align: center;
    background: var(--grey-page);
    border-radius: 0.3em;
}

/* страници */
.pagination{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.6em;
    margin-top: 2.6em;
}
.pagination__link{
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 2.4em;
    height: 2.4em;
    padding: 0 0.4em;
    font-size: 0.98em;
    color: var(--blue);
    background: #fff;
    border: 1px solid #E0E0E0;
    border-radius: 0.2em;
    transition: border-color .2s, color .2s;
}
.pagination__link:hover{
    color: var(--red);
    border-color: var(--red);
}
.pagination__link.is-active{
    color: #fff;
    background: var(--red);
    border-color: var(--red);
}
.pagination__link .svg-wrapper{
    width: 1em;
    height: 1em;
}
.pagination__dots{
    color: #8A8C99;
}

/* ---------- Responsive: магазин ---------- */
@media (max-width: 991px){
    .shop__row{
        row-gap: 1.5em;
    }
    .shop-filters-toggle{
        display: flex;
        align-items: center;
        gap: 0.6em;
        width: 100%;
        padding: 0.8em 1em;
        font-size: 1.1em;
        font-weight: 700;
        color: var(--blue);
        text-transform: uppercase;
        background: #F4F4F4;
        border: 0;
        border-radius: 0.25em;
    }
    .shop-filters-toggle .svg-filter{
        width: 1.2em;
        height: 1.2em;
    }
    .shop-sidebar{
        display: none;
        max-width: none;
        padding: 1.5em 0 0.5em;
    }
    .shop-sidebar.is-open{
        display: block;
    }
}

@media (min-width: 768px){
    .header__search-mobile {
        display: none;
    }
    form.search {
        margin-top: 0;
    }
}

@media (max-width: 767px){
    .topbar__links a {
        font-size: 0.8em;
    }
    form.search {
        margin-top: 0;
    }

    /* търсачка → бутон; формата се показва под хедъра */
    .header__search-toggle{
        display: flex;
        align-items: center;
        justify-content: center;
        width: 2em;
        height: 2em;
        padding: 0.25em;
        color: #fff;
        background: var(--red);
        border: 0;
        border-radius: 50%;
    }
    .header__search-toggle .svg-search{
        width: 100%;
        height: 100%;
    }
    .header.is-search-open .header__search-toggle{
        background: var(--blue);
    }
    .header__search{
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        padding: 1em 15px;
        background: #fff;
        border-top: 1px solid var(--grey-line);
        box-shadow: 0 1em 1.5em rgba(12, 18, 72, .12);
        visibility: hidden;
        opacity: 0;
        transform: translateY(-0.5em);
        transition: opacity .2s, transform .2s, visibility .2s;
    }
    .header.is-search-open .header__search{
        visibility: visible;
        opacity: 1;
        transform: none;
    }
    .header__search .search{
        width: 100%;
        margin: 0;
    }
    .header__search .search-results{
        position: static;
        width: auto;
        max-width: none;
        max-height: calc(100vh - 14em);
        margin-top: 0.8em;
        box-shadow: none;
    }
    .search-results__price{
        display: none;
    }
    .carousel__viewport {
        padding-right: 20%;
    }


    .shop-banner{
        position: relative;
        background-position: 75% center;
    }
    .shop-banner::before{
        content: "";
        position: absolute;
        inset: 0;
        background: rgba(12, 18, 72, .55);
    }
    .shop-banner > .container{
        position: relative;
    }
    .shop-banner__text br{
        display: none;
    }
    .shop-grid{
        margin-left: -0.45em;
        margin-right: -0.45em;
        row-gap: 0.9em;
    }
    .shop-grid > [class*="col"]{
        padding-left: 0.45em;
        padding-right: 0.45em;
    }
    .bs-card--shop .bs-card__foot{
        flex-wrap: wrap;
        padding-top: 1em;
    }
    .bs-card__desc{
        display: -webkit-box;       /* 2 карти на ред — описанието до 3 реда */
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        font-size: 0.9em;
    }
    .sort,
    .sort__select{
        width: 100%;
    }
}


/******************************************************
* 16. ПОДМЕНЮ „МАГАЗИН“ (header, всички страници)
******************************************************/
.main-nav__item{
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.25em;
}
.main-nav__toggle{
    display: flex;
    padding: 0.2em;
    color: var(--blue);
    background: none;
    border: 0;
    transition: transform .2s, color .2s;
}
.main-nav__toggle .svg-wrapper{
    width: 0.95em;
    height: 0.95em;
}
.main-nav__item:hover .main-nav__toggle,
.main-nav__item.is-open .main-nav__toggle{
    color: var(--red);
}
.main-nav__item.is-open .main-nav__toggle{
    transform: rotate(180deg);
}

.subnav{
    position: absolute;
    top: 100%;
    left: -1.2em;
    z-index: 30;
    min-width: 15em;
    margin-top: 1em;
    padding: 0.6em 0;
    background: #fff;
    border-top: 3px solid var(--red);
    border-radius: 0 0 0.3em 0.3em;
    box-shadow: 0 0.8em 1.8em rgba(12, 18, 72, .14);
    visibility: hidden;
    opacity: 0;
    transform: translateY(0.4em);
    transition: opacity .2s, transform .2s, visibility .2s;
}
/* „мост“, за да не се затваря при преминаване с мишката */
.subnav::before{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100%;
    height: 1.2em;
}
.main-nav__item:hover .subnav,
.main-nav__item:focus-within .subnav,
.main-nav__item.is-open .subnav{
    visibility: visible;
    opacity: 1;
    transform: none;
}
.main-nav .subnav a{
    display: block;
    padding: 0.55em 1.2em;
    font-size: 1.1em;
    text-transform: none;
    letter-spacing: 0;
    transition: color .2s, background-color .2s;
}
.main-nav .subnav a:hover{
    color: var(--red);
    background: #F7F7F7;
}

@media (max-width: 1199px){
    .main-nav__item{
        flex-wrap: wrap;
        gap: 0;
        border-bottom: 1px solid var(--grey-line);
    }
    .main-nav__item > a{
        flex: 1 1 auto;
        border-bottom: 0;
    }
    .main-nav__toggle{
        padding: 0.7em;
    }
    .main-nav__toggle .svg-wrapper{
        width: 1.2em;
        height: 1.2em;
    }
    .subnav,
    .subnav::before{
        position: static;
    }
    .subnav{
        flex: 0 0 100%;
        display: none;
        min-width: 0;
        margin: 0 0 0.6em;
        padding: 0 0 0 1em;
        border: 0;
        box-shadow: none;
        visibility: visible;
        opacity: 1;
        transform: none;
    }
    .subnav::before{
        display: none;
    }
    .main-nav__item.is-open .subnav{
        display: block;
    }
    /* на мобилен hover не отваря */
    .main-nav__item:hover .subnav,
    .main-nav__item:focus-within .subnav{
        display: none;
    }
    .main-nav__item.is-open .subnav{
        display: block;
    }
    .main-nav .subnav a{
        padding: 0.5em 0;
        border-bottom: 0;
    }
}


/******************************************************
* 17. МАГАЗИН — карти (дизайн от началната) + филтър по цена
******************************************************/
.bs-card--shop{
    height: 100%;
    padding: 0.55em;
}
.bs-card--shop .bs-card__brand{
    margin: 1.3em 0.55em 0;
    font-size: 0.9em;
    color: #6F7180;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.bs-card--shop .bs-card__title{
    margin: 0.2em 0.45em 0;
    font-size: 1.2em;
    line-height: 1.15;
}
.bs-card__desc{
    margin: 0.5em 0.55em 0;
    font-size: 0.98em;
    line-height: 1.3;
    color: #3A3F63;
}
.bs-card--shop .bs-card__foot{
    gap: 0.5em;
    padding: 1.4em 0.55em 0.3em;
}
.bs-card--shop .bs-card__price{
    font-size: 1.15em;
    white-space: nowrap;
}
.bs-card__price small{
    font-size: 0.7em;
    font-weight: 400;
    color: #6F7180;
}
/* до два реда: „от … / до …“ или зачеркната + намалената цена */
.bs-card__price{
    display: flex;
    flex-direction: column;
    line-height: 1.15;
}
.bs-card__price-label{
    font-size: 0.75em;
    font-weight: 400;
    color: #6F7180;
}
.bs-card__price-line--old{
    font-size: 0.75em;
    font-weight: 400;
    color: #6F7180;
}
.bs-card__price-line--old + .bs-card__price-line{
    color: var(--red);
}
.bs-card--shop .round-btn{
    width: 1.95em;
    height: 1.95em;
}

/* филтър по цена: два плъзгача на една линия + полета */
.price-range{
    position: relative;
    height: 1.4em;
    margin: 0.2em 0.6em 0.9em;
}
.price-range__track{
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 4px;
    background: #E2E2E2;
    border-radius: 2px;
    transform: translateY(-50%);
}
.price-range__fill{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--blue);
    border-radius: 2px;
}
.price-range__input{
    position: absolute;
    top: 0;
    left: -0.6em;
    width: calc(100% + 1.2em);
    height: 100%;
    margin: 0;
    background: none;
    z-index: 2;
    pointer-events: none;           /* кликът минава само през плъзгачите */
    -webkit-appearance: none;
    appearance: none;
}
.price-range__input::-webkit-slider-runnable-track{
    background: none;
}
.price-range__input::-webkit-slider-thumb{
    width: 1.2em;
    height: 1.2em;
    background: #fff;
    border: 3px solid var(--blue);
    border-radius: 50%;
    pointer-events: auto;
    cursor: pointer;
    -webkit-appearance: none;
}
.price-range__input::-moz-range-track{
    background: none;
}
.price-range__input::-moz-range-thumb{
    width: 0.9em;
    height: 0.9em;
    background: #fff;
    border: 3px solid var(--blue);
    border-radius: 50%;
    pointer-events: auto;
    cursor: pointer;
}
.price-range__input:focus-visible::-webkit-slider-thumb{
    outline: 2px solid var(--red);
    outline-offset: 2px;
}
.price-fields{
    display: flex;
    align-items: center;
    gap: 0.5em;
}
.price-fields__sep{
    color: #8A8C99;
}
.price-field{
    flex: 1 1 0;
    display: flex;
    align-items: center;
    gap: 0.3em;
    margin: 0;
    padding: 0 0.6em;
    height: 2.3em;
    font-size: 0.95em;
    border: 1px solid #DADADA;
    border-radius: 0.2em;
}
.price-field:focus-within{
    border-color: var(--blue);
}
.price-field input{
    width: 100%;
    min-width: 0;
    padding: 0;
    color: var(--blue);
    background: none;
    border: 0;
    outline: none;
    -moz-appearance: textfield;
}
.price-field input::-webkit-outer-spin-button,
.price-field input::-webkit-inner-spin-button{
    -webkit-appearance: none;
    margin: 0;
}
.price-field span{
    color: #8A8C99;
}

/* фокус на плъзгачите се показва на самия плъзгач */
.price-range__input:focus{
    outline: none;
}
/* разстояние между логото и менюто (менюто стана по-широко със стрелката) */
.header__logo{
    padding-right: 1.5em;
}