/* ═══════════════════════════════════════════════════════════════════
   Хаб «Автомобили» (/avtomobili/): навигация по маркам, поиск, фильтр.
   Подключается только на этой странице. Без JS остаются сетка марок
   и таблицы: фильтр-панель в разметке скрыта атрибутом hidden.
   ═══════════════════════════════════════════════════════════════════ */

/* Каталогу нужна вся ширина: правую колонку (новое на сайте, реклама) на этой странице не показываем. */
.page-id-1333 #right-sidebar{display:none}
.page-id-1333 #primary{width:100%;flex:1 1 100%}
.page-id-1333 .entry-content>.lede,
.page-id-1333 .entry-content>.trakt-actual{max-width:44rem}
.entry-content>.trakt-hub{max-width:none}
.trakt-hub{--hub-sticky:0px;margin:1.4rem 0 2rem}
.trakt-hub [hidden]{display:none!important}

/* ── сетка марок ───────────────────────────────────────────────────── */
.trakt-hub__brands{margin:0 0 1.2rem;scroll-margin-top:calc(var(--trakt-header-h,0px) + 12px)}
.trakt-hub__brands-title{
	font-family:var(--mono);font-size:12.5px;letter-spacing:.14em;
	text-transform:uppercase;color:var(--slate);margin:0 0 .7rem;
}
.trakt-hub__brands ul{
	list-style:none;margin:0;padding:0;
	display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:.5rem;
}
.trakt-hub__brands li{margin:0}
.trakt-hub__brands li+li{margin-top:0}
.trakt-brandtile{
	display:flex;align-items:baseline;justify-content:space-between;gap:.5rem;
	padding:.65rem .8rem;min-height:44px;
	background:var(--paper-2);border:1px solid var(--rule);
	font-family:var(--display);font-weight:600;font-size:.98rem;line-height:1.2;
	color:var(--ink);text-decoration:none;
	transition:border-color .15s,background-color .15s;
}
.trakt-brandtile:hover{border-color:var(--stamp);color:var(--stamp)}
.trakt-brandtile:focus-visible{outline:2px solid var(--stamp);outline-offset:2px}
.trakt-brandtile__n{font-family:var(--mono);font-weight:500;font-size:.8rem;color:var(--slate);font-variant-numeric:tabular-nums}
.trakt-brandtile.is-empty{opacity:.4;pointer-events:none}

/* ── панель поиска и фильтра ───────────────────────────────────────── */
.trakt-hub__bar{
	position:sticky;top:var(--trakt-header-h,0px);z-index:8;
	background:var(--paper);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
	padding:.7rem 0;margin:0 0 .5rem;
	display:grid;gap:.6rem;grid-template-columns:minmax(0,1fr) auto;align-items:center;
}
.trakt-hub__search{position:relative;min-width:0}
.trakt-hub__search input{
	width:100%;box-sizing:border-box;height:44px;
	padding:0 2.6rem 0 2.6rem;
	background:var(--paper-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%235A6376' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat .8rem center;
	border:1px solid var(--rule);border-radius:0;
	font-family:var(--display);font-size:1rem;color:var(--ink);
	-webkit-appearance:none;appearance:none;
}
.trakt-hub__search input::placeholder{color:var(--slate);opacity:1}
.trakt-hub__search input:focus{outline:2px solid var(--stamp);outline-offset:-1px;border-color:var(--stamp)}
.trakt-hub__search input::-webkit-search-cancel-button{-webkit-appearance:none}
.trakt-hub__clear{
	position:absolute;right:.2rem;top:50%;transform:translateY(-50%);
	width:40px;height:40px;border:0;background:none;color:var(--slate);
	font-size:1.4rem;line-height:1;cursor:pointer;
}
.trakt-hub__clear:hover,.trakt-hub__clear:focus-visible{color:var(--ink)}
.trakt-hub__count{
	font-family:var(--mono);font-size:12.5px;color:var(--slate);white-space:nowrap;
	font-variant-numeric:tabular-nums;
}
.trakt-hub__chips{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.trakt-chip{
	min-height:36px;padding:0 .8rem;
	background:var(--paper-2);border:1px solid var(--rule);border-radius:0;
	font-family:var(--display);font-weight:500;font-size:.88rem;color:var(--ink);cursor:pointer;
}
.trakt-chip:hover{border-color:var(--stamp)}
.trakt-chip:focus-visible{outline:2px solid var(--stamp);outline-offset:2px}
.trakt-chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper-2)}
.trakt-chip__n{font-family:var(--mono);font-size:.78rem;opacity:.7;margin-left:.35rem}
.trakt-hub__brandsel{
	height:36px;margin-left:auto;max-width:100%;
	background:var(--paper-2);border:1px solid var(--rule);border-radius:0;
	font-family:var(--display);font-size:.88rem;color:var(--ink);padding:0 .5rem;
}

.trakt-hub__empty{
	margin:1.2rem 0;padding:1rem 1.2rem;border-left:3px solid var(--amber);background:#FBF7F1;
	font-family:var(--display);
}
.trakt-hub__empty button{margin-left:.4rem}

/* ── секция марки ──────────────────────────────────────────────────── */
.trakt-brand{scroll-margin-top:calc(var(--trakt-header-h,0px) + var(--hub-sticky) + 12px)}
.entry-content .trakt-brand>h2{
	display:flex;align-items:baseline;gap:.7rem;flex-wrap:wrap;
	margin:2.2rem 0 .4rem;padding-top:1rem;border-top:2px solid var(--ink);
}
.trakt-brand__n{font-family:var(--mono);font-weight:500;font-size:.85rem;color:var(--slate)}
.trakt-brand__up{
	margin-left:auto;font-family:var(--display);font-weight:500;font-size:.85rem;
	color:var(--slate);text-decoration:none;
}
.trakt-brand__up:hover,.trakt-brand__up:focus-visible{color:var(--stamp);text-decoration:underline}
.entry-content .trakt-brand__models{
	list-style:none;margin:.2rem 0 .6rem;padding:0;display:flex;flex-wrap:wrap;gap:.35rem;
}
.entry-content .trakt-brand__models li{margin:0}
.trakt-brand__models a{
	display:inline-block;padding:.3rem .65rem;min-height:32px;box-sizing:border-box;
	background:var(--paper-2);border:1px solid var(--rule);
	font-family:var(--display);font-weight:500;font-size:.85rem;color:var(--ink);text-decoration:none;
}
.trakt-brand__models a:hover,.trakt-brand__models a:focus-visible{border-color:var(--stamp);color:var(--stamp)}
.trakt-brand__models li.is-off{display:none}
/* заголовок линейки внутри таблицы марки */
.trakt-hub tr.trakt-group{scroll-margin-top:calc(var(--trakt-header-h,0px) + var(--hub-sticky) + 8px)}
.entry-content .trakt-hub tr.trakt-group th{
	padding:.85rem .7rem .4rem;background:none;border-bottom:2px solid var(--rule);
	font-family:var(--display);font-weight:600;font-size:1rem;letter-spacing:0;text-transform:none;color:var(--ink);
}
.trakt-group .trakt-brand__n{margin-left:.5rem}

.entry-content .trakt-hub table{margin:.4rem 0 .8rem;table-layout:fixed}
/* базовая тема рисует рамку вокруг каждой ячейки: оставляем только линии между строками */
.entry-content .trakt-hub table,
.entry-content .trakt-hub th,
.entry-content .trakt-hub td{border:0}
.entry-content .trakt-hub td{border-bottom:1px solid var(--rule)}
.entry-content .trakt-hub thead th{border-bottom:1px solid var(--ink)}
.trakt-hub thead th:nth-child(1){width:34%}
.trakt-hub thead th:nth-child(2){width:15%}
.trakt-hub td{vertical-align:top}
.trakt-hub td:nth-child(1){font-weight:600}
.trakt-hub td:nth-child(1) a{text-decoration:none}
.trakt-hub td:nth-child(1) a:hover,.trakt-hub td:nth-child(1) a:focus-visible{text-decoration:underline}
.trakt-hub td:nth-child(2){white-space:nowrap;font-variant-numeric:tabular-nums}
.trakt-hub td:nth-child(3){font-size:.88rem;line-height:1.45;color:var(--slate)}
.trakt-hub tbody tr:hover td{background:rgba(23,35,63,.035)}

/* ── плавающая кнопка «К маркам»: появляется, когда сетка марок ушла вверх ── */
.trakt-hub__top{
	position:fixed;right:16px;bottom:16px;z-index:20;
	min-height:44px;padding:0 1rem;display:none;align-items:center;
	background:var(--ink);color:var(--paper-2);border:0;
	font-family:var(--display);font-weight:600;font-size:.9rem;text-decoration:none;
	box-shadow:0 4px 14px rgba(23,35,63,.28);
}
.trakt-hub__top.is-on{display:inline-flex}
.trakt-hub__top:hover,.trakt-hub__top:focus-visible{color:var(--paper-2);background:var(--stamp)}

/* ── планшет и телефон ─────────────────────────────────────────────── */
@media (max-width:768px){
	.trakt-hub__bar{position:static;grid-template-columns:1fr;border-top:0;padding-top:.2rem}
	.trakt-hub__count{justify-self:start}
	.trakt-hub__brandsel{margin-left:0;width:100%}
	.trakt-hub__brands ul{grid-template-columns:repeat(auto-fill,minmax(128px,1fr))}
	/* линейки марки: одна строка с прокруткой, чтобы не съедать экран */
	.entry-content .trakt-brand__models{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:.3rem}
	.trakt-brand__models a{white-space:nowrap}
	.trakt-brand,.trakt-hub tr.trakt-group{scroll-margin-top:calc(var(--trakt-header-h,0px) + 12px)}
}
@media (max-width:640px){
	/* таблица превращается в список карточек: название, годы, статус */
	.entry-content .trakt-hub table{table-layout:auto}
	.trakt-hub thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
	.trakt-hub table,.trakt-hub tbody,.trakt-hub tr,.trakt-hub td{display:block;width:100%}
	.trakt-hub tr{padding:.7rem 0;border-bottom:1px solid var(--rule)}
	.trakt-hub tr.trakt-group{padding:1rem 0 0;border-bottom:0}
	.entry-content .trakt-hub tr.trakt-group th{display:block;width:100%;padding-left:0;padding-right:0}
	.entry-content .trakt-hub td{border:0;padding:0}
	.entry-content .trakt-hub tr{border-bottom:1px solid var(--rule)}
	.trakt-hub td:nth-child(1){font-size:1.02rem}
	.trakt-hub td:nth-child(2){font-family:var(--mono);font-size:.8rem;color:var(--slate);margin:.1rem 0 .3rem}
	.trakt-hub tbody tr:hover td{background:none}
	.trakt-brand__up{display:none}
}

@media (prefers-reduced-motion:reduce){
	.trakt-brandtile{transition:none}
}
