/* V4 → dev2: блог (18.10.2026; 19.10.2026, слово владельца — стиль Tea Journal с blog.tealyra.com в светлых тонах сайта).
   Список — addons/wg_blog/views/blog/listed_items.tpl + v4_card.tpl, статья — hooks/pages/page_content.override.tpl, рубрики переносит v4-blog.js.
   Заголовки — Fraunces (шрифт Tea Journal), текст — Inter, как на всём сайте */
@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600&display=swap");

/* боковая колонка блога скрыта, контент — во всю ширину */
html.v4bl-page .span4.et-content, html.v4bl-page .tygh-content .span4.et-content { display: none !important; }
html.v4bl-page .span12.et-content, html.v4bl-page .tygh-content .span12.et-content { width: 100% !important; margin-left: 0 !important; float: none !important; }
html.v4bl-page .tygh-content .row > [class*="span"].span12.et-content.et-content { margin-left: 0 !important; width: 100% !important; }
/* 22.10.2026, аудит UK/IE: CLS 0.30 на главной журнала — класс v4bl-page ставит скрипт (defer) уже после отрисовки, боковая колонка
   пропадала, а колонка с обложкой расширялась. :has() срабатывает до скрипта; правила выше оставлены для старых браузеров */
html:has(.v4bl) .span4.et-content, html:has(.v4bl) .tygh-content .span4.et-content { display: none !important; }
html:has(.v4bl) .span12.et-content, html:has(.v4bl) .tygh-content .span12.et-content { width: 100% !important; margin-left: 0 !important; float: none !important; }
html:has(.v4bl) .tygh-content .row > [class*="span"].span12.et-content.et-content { margin-left: 0 !important; width: 100% !important; }

.v4bj, .v4bp { --j-ink: #1E2421; --j-txt: #3A4440; --j-mute: #737A76; --j-green: #0F5C45; --j-gold: #A07C3B; --j-line: #E7E1D4; --j-cream: #F8F4EC; --j-serif: Fraunces, Georgia, "Times New Roman", serif; font-family: Inter, system-ui, sans-serif; }
.v4bj { max-width: 1200px; margin: 0 auto; }
.v4bj a, .v4bp a { text-decoration: none; }
.v4bj .v4bj-k, .v4bp .v4bj-k { margin: 0 0 12px !important; font: 700 12px/1.3 Inter, system-ui, sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--j-gold); }
.v4bj-k a { color: inherit !important; }
.v4bj-k a:hover { color: var(--j-green) !important; }
.v4bj .v4bj-meta { margin: 0 !important; font: 500 13px/1.4 Inter, system-ui, sans-serif; color: var(--j-mute); }
.v4bj-btn { display: inline-flex; align-items: center; height: 46px; padding: 0 24px; border-radius: 999px; background: var(--j-green); color: #fff !important; font: 700 15px/1 Inter, system-ui, sans-serif; transition: background .2s, transform .2s; }
.v4bj-btn:hover { background: #0B4A37; transform: translateY(-1px); }

/* 1. заголовок журнала и рубрики */
.v4bj-mast { margin: 4px 0 34px; padding: 18px 0 0; border-bottom: 1px solid var(--j-line); text-align: center; }
.v4bj .v4bj-h1 { margin: 0 !important; padding: 0 !important; border: 0 !important; font: 500 clamp(46px, 6.4vw, 84px)/1 var(--j-serif) !important; letter-spacing: -.02em; color: var(--j-ink) !important; text-transform: none !important; text-align: center !important; }
.v4bj .v4bj-by { display: inline-flex; align-items: center; gap: 8px; margin: 12px 0 0 !important; font: 700 12px/1 Inter, system-ui, sans-serif; letter-spacing: .22em; text-transform: uppercase; color: var(--j-gold); }
.v4bj-by svg { width: 18px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.v4bj-mastSm { text-align: left; }
.v4bj-mastSm .v4bj-h1 { font-size: clamp(36px, 4.6vw, 56px) !important; text-align: left !important; }
.v4bj-tags { display: flex; justify-content: safe center; gap: 4px 26px; margin: 22px 0 0; padding: 0 2px; overflow-x: auto; scrollbar-width: none; }
.v4bj-tags::-webkit-scrollbar { display: none; }
.v4bj-mastSm .v4bj-tags { justify-content: flex-start; }
.v4bj-tags .v4bl-tag { flex: 0 0 auto; padding: 0 0 14px; border-bottom: 2px solid transparent; color: var(--j-txt) !important; font: 600 14.5px/1 Inter, system-ui, sans-serif; white-space: nowrap; transition: color .2s, border-color .2s; }
.v4bj-tags .v4bl-tag:hover { color: var(--j-green) !important; }
.v4bj-tags .v4bl-tag.v4bl-tagOn { color: var(--j-green) !important; border-bottom-color: var(--j-green); }

/* картинки статей */
.v4bj-pic { position: relative; display: block; overflow: hidden; border-radius: 16px; background: var(--j-cream); }
.v4bj-pic img, .v4bj-pic picture { display: block; width: 100% !important; height: 100% !important; max-width: none !important; }
.v4bj-pic img { object-fit: cover; transition: transform .7s cubic-bezier(.22,1,.36,1); }
.v4bj-cover:hover .v4bj-pic img, .v4bj-card:hover .v4bj-pic img { transform: scale(1.04); }
.v4bj-noPic { display: block; width: 100%; height: 100%; background: radial-gradient(circle at 30% 30%, #E4F1EA, var(--j-cream)); }

/* 2. главная статья */
.v4bj-cover { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: center; gap: clamp(24px, 4vw, 48px); }
.v4bj-cover .v4bj-pic { aspect-ratio: 4 / 3; }
.v4bj .v4bj-coverT { margin: 0 0 16px !important; padding: 0 !important; border: 0 !important; font: 500 clamp(32px, 3.5vw, 48px)/1.08 var(--j-serif) !important; letter-spacing: -.01em; text-transform: none !important; text-align: left !important; }
.v4bj .v4bj-coverT a, .v4bj .v4bj-cardT a { color: var(--j-ink) !important; font: inherit !important; }
.v4bj .v4bj-coverT a:hover, .v4bj .v4bj-cardT a:hover { color: var(--j-green) !important; }
.v4bj .v4bj-ex { margin: 0 0 16px !important; font: 400 17px/1.6 Inter, system-ui, sans-serif; color: var(--j-txt); }
.v4bj-cover .v4bj-meta { margin-bottom: 22px !important; }

/* разделы: заголовок с линией сверху */
.v4bj-sec { margin-top: 60px; }
.v4bj-secHead { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin: 0 0 22px; padding-top: 16px; border-top: 1px solid var(--j-ink); }
.v4bj .v4bj-secT { margin: 0 !important; padding: 0 !important; border: 0 !important; font: 500 clamp(26px, 2.6vw, 32px)/1.15 var(--j-serif) !important; color: var(--j-ink) !important; text-transform: none !important; text-align: left !important; }
.v4bj-secA { flex: 0 0 auto; color: var(--j-gold) !important; font: 700 14px/1 Inter, system-ui, sans-serif; }
.v4bj-secA:hover { color: var(--j-green) !important; }

/* 3 и 6. карточки */
.v4bj-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px 28px; }
.v4bj-card .v4bj-pic { aspect-ratio: 3 / 2; margin-bottom: 16px; }
.v4bj-card .v4bj-k { margin-bottom: 8px !important; }
.v4bj .v4bj-cardT { margin: 0 0 10px !important; padding: 0 !important; border: 0 !important; font: 500 22px/1.25 var(--j-serif) !important; text-transform: none !important; text-align: left !important; }

/* 4. шпаргалка заваривания */
.v4bj-steep { margin-top: 64px; padding: clamp(24px, 3.4vw, 40px); border-radius: 24px; background: var(--j-cream); }
.v4bj-steepHead { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 8px 20px; margin-bottom: 22px; }
.v4bj-steepHead p { margin: 0 !important; font: 400 14px/1.4 Inter, system-ui, sans-serif; color: var(--j-mute); }
.v4bj-steepGrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.v4bj-tile { display: flex; flex-direction: column; gap: 6px; padding: 18px 20px; border: 1px solid var(--j-line); border-radius: 16px; background: #fff; transition: transform .25s, box-shadow .25s; }
.v4bj-tile:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(60, 45, 20, .08); }
.v4bj-tile b { font: 500 22px/1.2 var(--j-serif); color: var(--j-ink); }
.v4bj-tile span { font: 600 15px/1.3 Inter, system-ui, sans-serif; color: var(--j-green); }
.v4bj-tile small { font: 500 13px/1.3 Inter, system-ui, sans-serif; color: var(--j-mute); }

/* 5. «More reading» и карточка магазина */
.v4bj-two { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 48px); align-items: start; }
.v4bj-two .v4bj-sec { margin-top: 0; }
.v4bj-two { margin-top: 60px; }
.v4bj-list { margin: 0 0 18px !important; padding: 0 !important; list-style: none !important; }
.v4bj-row { margin: 0 !important; border-bottom: 1px solid var(--j-line); list-style: none !important; }
.v4bj-row a { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; padding: 16px 0; }
.v4bj-rowT { font: 500 20px/1.3 var(--j-serif); color: var(--j-ink); transition: color .2s; }
.v4bj-row a:hover .v4bj-rowT { color: var(--j-green); }
.v4bj-rowM { flex: 0 0 auto; font: 500 13px/1 Inter, system-ui, sans-serif; color: var(--j-mute); }
.v4bj-store { padding: clamp(24px, 3vw, 36px); border-top: 3px solid #C9A15A; border-radius: 6px 6px 22px 22px; background: var(--j-cream); }
.v4bj-store .v4bj-storeT { margin: 0 0 12px !important; padding: 0 !important; border: 0 !important; font: 500 clamp(24px, 2.4vw, 30px)/1.2 var(--j-serif) !important; color: var(--j-ink) !important; text-transform: none !important; text-align: left !important; }
.v4bj-store .v4bj-storeX { margin: 0 0 22px !important; font: 400 15px/1.6 Inter, system-ui, sans-serif; color: var(--j-txt); }

/* листание страниц */
.v4bl .ty-pagination { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; margin: 40px 0 18px !important; padding: 0 !important; border: 0 !important; background: none !important; }
.v4bl .ty-pagination__items { display: flex; gap: 8px; }
.v4bl .ty-pagination__item, .v4bl .ty-pagination__selected { display: inline-flex !important; align-items: center; justify-content: center; min-width: 40px; height: 40px; margin: 0 !important; padding: 0 12px !important; border: 1.5px solid #E3E7E5 !important; border-radius: 999px !important; background: #fff !important; color: var(--j-ink) !important; font: 600 14px/1 Inter, system-ui, sans-serif !important; text-decoration: none !important; }
.v4bl .ty-pagination__selected { background: var(--j-green) !important; border-color: var(--j-green) !important; color: #fff !important; }
.v4bl .ty-pagination__item:hover { border-color: #9fb3ae !important; }
.v4bl .ty-pagination-container > .ty-pagination:first-child { display: none !important; }
.v4bl hr { display: none; }

/* ===== страница статьи ===== */
.v4bp { max-width: 760px; margin: 0 auto; }
.v4bp-head { margin: 8px 0 34px; }
html.v4bp-page .v4bp .v4bp-h1 { margin: 0 0 16px !important; padding: 0 !important; border: 0 !important; font: 500 clamp(36px, 4.8vw, 58px)/1.06 var(--j-serif) !important; letter-spacing: -.015em; color: var(--j-ink) !important; text-transform: none !important; text-align: left !important; }
html.v4bp-page .v4bp .v4bp-h1 span { font: inherit !important; color: inherit !important; }
.v4bp .v4bp-lead { margin: 0 0 18px !important; font: 400 19px/1.55 Inter, system-ui, sans-serif; color: var(--j-txt); }
.v4bp .v4bp-by { margin: 0 0 16px !important; font: 500 13.5px/1.4 Inter, system-ui, sans-serif; color: var(--j-mute); }
.v4bp-share { position: relative; display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 14px 0; border-top: 1px solid var(--j-line); border-bottom: 1px solid var(--j-line); }
.v4bp-shareL { margin-right: 6px; font: 700 11px/1 Inter, system-ui, sans-serif; letter-spacing: .18em; text-transform: uppercase; color: var(--j-mute); }
.v4bp-share a, .v4bp-share button { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; margin: 0; padding: 0; border: 1px solid var(--j-line); border-radius: 50%; background: #fff; color: var(--j-ink); cursor: pointer; transition: border-color .2s, color .2s, background .2s; }
.v4bp-share a:hover, .v4bp-share button:hover { border-color: var(--j-green); color: var(--j-green); background: #F2F8F5; }
.v4bp-share svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.v4bp-share.v4bp-copied .v4bp-copy { border-color: var(--j-green); background: var(--j-green); color: #fff; }
.v4bp-share.v4bp-copied .v4bp-copy::after { content: attr(data-tip); position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%); padding: 6px 10px; border-radius: 8px; background: var(--j-ink); color: #fff; font: 600 12px/1 Inter, system-ui, sans-serif; white-space: nowrap; }
.v4bp-copy { position: relative; }

/* текст статьи */
.v4bp .v4bp-text { font: 400 17.5px/1.75 Inter, system-ui, sans-serif; color: var(--j-txt); }
.v4bp .v4bp-text :is(p, ul, ol, li, span, div) { font-size: inherit !important; line-height: inherit !important; }
.v4bp .v4bp-text p { margin: 0 0 1.1em !important; }
.v4bp .v4bp-text h2 { margin: 1.9em 0 .55em !important; padding: 0 !important; border: 0 !important; font: 500 clamp(26px, 2.6vw, 32px)/1.2 var(--j-serif) !important; color: var(--j-ink) !important; text-transform: none !important; text-align: left !important; }
.v4bp .v4bp-text h3, .v4bp .v4bp-text h4 { margin: 1.6em 0 .5em !important; padding: 0 !important; font: 500 23px/1.25 var(--j-serif) !important; color: var(--j-ink) !important; text-transform: none !important; }
.v4bp .v4bp-text :is(h2, h3, h4) * { font: inherit !important; color: inherit !important; }
.v4bp .v4bp-text a { color: var(--j-green) !important; text-decoration: underline !important; text-decoration-color: rgba(15, 92, 69, .35) !important; text-underline-offset: 3px; }
.v4bp .v4bp-text a:hover { text-decoration-color: var(--j-green) !important; }
.v4bp .v4bp-text strong, .v4bp .v4bp-text b { color: var(--j-ink); font-weight: 650; }
.v4bp .v4bp-text img { display: block; max-width: 100% !important; height: auto !important; margin: 1.6em auto !important; border-radius: 18px; }
.v4bp .v4bp-text :is(ul, ol) { margin: 0 0 1.3em !important; padding-left: 1.4em !important; }
.v4bp .v4bp-text li { margin: 0 0 .5em !important; padding-left: .2em; }
.v4bp .v4bp-text ul li { list-style: disc !important; }
.v4bp .v4bp-text ol li { list-style: decimal !important; }
.v4bp .v4bp-text li::marker { color: var(--j-gold); }
.v4bp .v4bp-text blockquote { margin: 1.6em 0 !important; padding: 4px 0 4px 22px !important; border-left: 3px solid #C9A15A !important; font: 400 21px/1.5 var(--j-serif); color: var(--j-ink); }
.v4bp .v4bp-text table { width: 100% !important; margin: 1.4em 0 !important; border-collapse: collapse; font-size: 15px; }
.v4bp .v4bp-text th, .v4bp .v4bp-text td { padding: 10px 12px !important; border: 0 !important; border-bottom: 1px solid var(--j-line) !important; text-align: left; vertical-align: top; }
.v4bp .v4bp-text th, .v4bp .v4bp-text thead td { background: var(--j-cream); color: var(--j-ink); font-weight: 650; }
.v4bp .v4bp-text iframe { max-width: 100%; border-radius: 16px; }
.v4bp-foot { margin: 46px 0 0; }
.v4bp .v4bp-enjoy { margin: 0 0 14px !important; font: 500 22px/1.3 var(--j-serif); color: var(--j-ink); }
.v4bp-foot .v4bj-store { margin-top: 30px; }
.v4bp-fresh { max-width: 1200px; margin: 64px auto 24px; }

@media (max-width: 1006px) {
  .v4bj-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v4bj-cover, .v4bj-two { grid-template-columns: 1fr; }
  .v4bj-steepGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v4bj-tags { justify-content: flex-start; }
}
@media (max-width: 640px) {
  .v4bj-mast { margin-bottom: 24px; }
  .v4bj-grid { grid-template-columns: 1fr; gap: 28px; }
  .v4bj-sec, .v4bj-two, .v4bj-steep { margin-top: 44px; }
  .v4bj-steep { padding: 22px 18px; border-radius: 20px; }
  .v4bj-steepGrid { gap: 10px; }
  .v4bj-tile { padding: 14px; }
  .v4bj-tile b { font-size: 19px; }
  .v4bj-tile span { font-size: 13.5px; }
  .v4bj-rowT { font-size: 18px; }
  .v4bj .v4bj-ex { font-size: 16px; }
  .v4bp .v4bp-text { font-size: 16.5px; }
  .v4bp .v4bp-lead { font-size: 17px; }
}
@media (prefers-reduced-motion: reduce) { .v4bj *, .v4bp * { transition: none !important; } }

/* 20.10.2026, бриф блог-админа: обложка вверху поста; 1–2 строки описания у карточек; пагинация — только номера страниц
   (ссылка-диапазон «2 - 8» убрана с глаз) */
.v4bp-cover { max-width: 820px; margin: 0 auto 28px; padding: 0 16px; }
.v4bp-cover img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 16px; background: #F4F6F5; }
.v4bj-ex.v4bj-exS { margin: 6px 0 0; font-size: 14px; line-height: 1.5; color: #4A524D; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.v4bl .ty-pagination__range { display: none !important; }

/* 20.10.2026, этап B брифа блога: ссылки на категории и вводный текст категории */
.v4bj-cats { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 0; }
.v4bj-cats a { display: inline-block; padding: 7px 14px; border: 1px solid #DCE3DF; border-radius: 999px; color: #1E2421; font-size: 14px; line-height: 1.2; text-decoration: none; background: #fff; }
.v4bj-cats a:hover { border-color: #0F5C45; color: #0F5C45; }
.v4bj-cats a[aria-current="page"] { background: #0F5C45; border-color: #0F5C45; color: #fff; }
.v4bj-intro { max-width: 820px; margin: 0 0 28px; color: #3A433F; font-size: 17px; line-height: 1.65; }
.v4bj-intro h2, .v4bj-intro h3 { margin: 18px 0 8px; }
.v4bj-intro img { max-width: 100%; height: auto; }

/* 20.10.2026, слово владельца: статья на компьютере шире (было 760px — «очень узкая колонка») */
.v4bp { max-width: 1200px; }   /* 20.10.2026, владелец: 980px — всё ещё узко; = ширина списка блога */
.v4bp-cover { max-width: 1232px; }
/* «Teas in this article» — карточки магазина в конце статьи */
.v4bp-teas { margin: 40px 0 8px; }
.v4bp .v4bp-teasT { margin: 0 0 18px !important; padding: 0 !important; border: 0 !important; font: 500 clamp(24px, 2.4vw, 30px)/1.2 var(--j-serif) !important; color: var(--j-ink) !important; text-transform: none !important; text-align: left !important; }
/* таблицы и вставки в статье на телефоне — прокрутка по горизонтали, не шире экрана */
@media (max-width: 767px) {
  .v4bp .v4bp-text table { display: block; max-width: 100% !important; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .v4bp .v4bp-text th, .v4bp .v4bp-text td { min-width: 110px; }
  .v4bp .v4bp-text :is(iframe, video, pre) { max-width: 100% !important; }
  .v4bp .v4bp-text pre { overflow-x: auto; }
}
/* слово владельца: блог на телефоне — категории каруселью вверху, статьи списком (фото меньше, сбоку), больше статей на экране */
@media (max-width: 640px) {
  .v4bj-cats { flex-wrap: nowrap; overflow-x: auto; margin: 14px -16px 0; padding: 0 16px 6px; scrollbar-width: none; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; }
  .v4bj-cats::-webkit-scrollbar { display: none; }
  .v4bj-cats a { flex: 0 0 auto; scroll-snap-align: start; }
  .v4bj-grid { grid-template-columns: 1fr; gap: 0; }
  .v4bj-card { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 14px; align-items: start; padding: 14px 0; border-bottom: 1px solid var(--j-line); }
  .v4bj-card .v4bj-pic { aspect-ratio: 1 / 1; margin: 0; border-radius: 12px; }
  .v4bj-card .v4bj-k { margin-bottom: 4px !important; font-size: 10.5px; letter-spacing: .12em; }
  .v4bj .v4bj-cardT { margin: 0 0 6px !important; font-size: 17px !important; line-height: 1.3 !important; }
  .v4bj-card .v4bj-exS { display: none; }
  .v4bj-card .v4bj-meta { margin: 0 !important; font-size: 12px; }
  .v4bj-cover { gap: 14px; }
  .v4bj-cover .v4bj-pic { aspect-ratio: 16 / 9; }
  .v4bj .v4bj-coverT { font-size: 26px !important; margin-bottom: 10px !important; }
  .v4bj-cover .v4bj-ex { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .v4bj-cover .v4bj-meta { margin-bottom: 12px !important; }
}
/* 20.10.2026, владелец («подправь разграничение»): кнопки категорий не прилипают к линии под шапкой журнала */
.v4bj-mast .v4bj-cats { margin-bottom: 24px; }
@media (max-width: 640px) { .v4bj-mast .v4bj-cats { margin-bottom: 16px; } }
/* 20.10.2026, бриф блог-админа («обложка поста слишком большая»): файл остаётся 1200×630 (og:image), на странице поста — не выше
   360px на компьютере и 220px на телефоне, обрезка по центру без растягивания; width/height у <img> есть — страница не прыгает.
   Карточки списка блога не меняются */
.v4bp-cover img { aspect-ratio: auto !important; height: 360px !important; max-height: 360px; object-fit: cover; object-position: center; }
@media (max-width: 640px) { .v4bp-cover img { height: 220px !important; max-height: 220px; } }

/* 21.10.2026, слово владельца: «Teas in this article» на телефоне — карточка списком: картинка слева, справа название, звёзды, описание;
   ниже на всю ширину — Loose/Bags, фасовка с количеством в одну строку, кнопка. Обёртки карточки «прозрачные» (display: contents),
   поэтому места в сетке заданы самим элементам и порядком (order) */
@media (max-width: 640px) {
  .v4bp-teas .ty-grid-list__item { margin-bottom: 16px !important; padding: 12px !important; border: 1px solid #E4E8E6 !important; border-radius: 16px !important; background: #fff !important; }
  .v4bp-teas .vs-grid { display: grid !important; grid-template-areas: none !important; grid-template-rows: none !important; grid-template-columns: 96px minmax(0, 1fr) !important; column-gap: 14px; row-gap: 6px; align-items: start; }
  .v4bp-teas .vs-grid .preview-image { grid-area: auto !important; order: 1 !important; grid-column: 1 !important; grid-row: span 3 !important; width: 96px !important; height: 96px !important; margin: 0 !important; padding: 0 !important; border-radius: 12px; overflow: hidden; }
  .v4bp-teas .vs-grid .preview-image .scroll-image, .v4bp-teas .vs-grid .preview-image a { width: 96px !important; height: 96px !important; margin: 0 !important; padding: 0 !important; }
  .v4bp-teas .vs-grid .preview-image img { width: 96px !important; height: 96px !important; object-fit: cover; }
  .v4bp-teas .vs-grid .preview-image [class*="label"] { display: none !important; }
  .v4bp-teas .vs-grid .product-title { grid-area: auto !important; order: 2 !important; grid-column: 2 !important; margin: 0 !important; font-size: 16px !important; line-height: 1.25 !important; height: auto !important; }
  .v4bp-teas .vs-grid .rating-buttons { grid-area: auto !important; order: 3 !important; grid-column: 2 !important; justify-self: start; margin: 0 !important; position: static !important; }
  .v4bp-teas .vs-grid .short-description-wrapper { grid-area: auto !important; order: 4 !important; grid-column: 2 !important; width: auto !important; margin: 0 !important; font-size: 13px !important; line-height: 1.4 !important; max-height: 4.2em; overflow: hidden; }
  .v4bp-teas .vs-grid .origin-category-wrapper { display: none !important; }
  .v4bp-teas .vs-grid .ty-group-links { grid-area: auto !important; order: 5 !important; grid-column: 1 / -1 !important; width: 100% !important; margin: 6px 0 0 !important; position: static !important; }
  .v4bp-teas .vs-grid .variants-container { grid-area: auto !important; order: 6 !important; grid-column: 1 / -1 !important; width: 100% !important; margin: 0 !important; display: flex !important; gap: 8px; align-items: center; }
  .v4bp-teas .vs-grid .variants-container .ty-product-options-grid { flex: 1 1 auto; width: auto !important; }
  .v4bp-teas .vs-grid .variants-container .ty-product-amount-grid { flex: 0 0 72px; width: 72px !important; }
  .v4bp-teas .vs-grid .product-description { grid-area: auto !important; order: 7 !important; grid-column: 1 / -1 !important; width: 100% !important; margin: 0 !important; position: static !important; }
  .v4bp-teas .vs-grid > .ty-product-amount-grid, .v4bp-teas .vs-grid .product-description .ty-product-amount-grid { grid-area: auto !important; order: 6 !important; grid-column: 1 / -1 !important; }
  .tygh-content .v4bp-teas .ty-grid-list__item .vs-grid .ty-grid-list-product__click > .ty-product-grid-labels.ty-product-grid-labels.ty-product-grid-labels { grid-area: auto !important; order: 3 !important; grid-column: 2 !important; justify-self: start; margin: 0 !important; position: static !important; }
}

/* 25.10.2026, бриф блог-админа («обложка поста обрезается»): обложка показывается целиком — в пропорциях самого файла
   (1200×630; у старых постов бывает 3:2), не шире 860px, по центру; на телефоне тоже целиком. Карточки, список блога и og:image не меняются */
.v4bp-cover { max-width: 860px; } .v4bp-cover img { aspect-ratio: auto !important; height: auto !important; max-height: none !important; object-fit: cover; } @media (max-width: 640px) { .v4bp-cover img { height: auto !important; max-height: none !important; } }