/*
 * pt-2026.css — morning2026 design system
 * Replicates the research/used-cars visual language on the desktop theme.
 * Loaded AFTER style.css; overrides the classic dark boxed frame.
 * Phase 1 scaffold: tokens + ground + container. Components land per phase.
 */

:root {
  --red:        #a60f0f;
  --red-dark:   #8a0c0c;
  --ink:        #1a1a1a;
  --muted:      #63666f;
  --ground:     #f3f3f3;
  --card-line:  rgba(0, 0, 0, .08);
  --chip-bg:    #f4f4f5;
  --rule-soft:  #f0f0f0;

  /* non-variable tokens from the sibling apps, lifted into vars */
  --radius-card: 10px;
  --radius-input: 8px;
  --radius-pill: 999px;
  --shadow-card: 0 1px 3px rgba(0, 0, 0, .06), 0 1px 2px rgba(0, 0, 0, .04);
  --shadow-card-hover: 0 4px 12px rgba(0, 0, 0, .08), 0 2px 4px rgba(0, 0, 0, .06);
  --wrap-max: 1080px;
  --wrap-pad: 20px;
}

/* ---- ground: retire the dark slate frame ------------------------------- */
body {
  background: var(--ground);
  font-family: Arial, sans-serif;
  font-size: 15px;
  line-height: 1.45;
  color: var(--ink);
}

/* ---- container: 980 fixed box -> 1080 responsive ----------------------- */
#main {
  background: none;            /* was: white 980px stripe */
}
#main div.wrapper {
  background: none;            /* content sits on cards, not one big panel */
  width: auto;
  max-width: var(--wrap-max);
  margin: 0 auto;
  padding-left: var(--wrap-pad);
  padding-right: var(--wrap-pad);
  box-shadow: none;
  box-sizing: border-box;
}
#header-menu div.wrapper { box-shadow: none; }

/* ---- reusable components (used from phase 2 onward) -------------------- */
.pt26-card {
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-card);
  transition: box-shadow .15s ease;
}
@media (hover: hover) {
  .pt26-card:hover { box-shadow: var(--shadow-card-hover); }
}

.pt26-chip {
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-pill);
  padding: 7px 13px;
  text-decoration: none;
  white-space: nowrap;
}
@media (hover: hover) {
  .pt26-chip:hover { color: var(--red); border-color: var(--red); }
}
.pt26-chip.on { color: #fff; background: var(--red); border-color: var(--red); }

.pt26-btn {
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  background: var(--red);
  border: 0;
  border-radius: var(--radius-pill);
  padding: 11px 20px;
  cursor: pointer;
  -webkit-appearance: none;
  text-decoration: none;
  display: inline-block;
}
@media (hover: hover) {
  .pt26-btn:hover { background: var(--red-dark); color: #fff; }
}

.pt26-sechead { text-align: left; padding: 0 0 14px; display: flex; align-items: baseline; justify-content: space-between; }
.pt26-sechead h2 { margin: 0; font-size: 22px; font-weight: bold; color: var(--ink); }
.pt26-sechead .pt26-seclink { font-size: 13px; font-weight: bold; color: var(--red); text-decoration: none; }
.pt26-eyebrow { font-size: 11px; font-weight: bold; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); }

/* ================= phase 2: global chrome ================= */

/* ---- sticky appbar (replaces #header + #header-menu rows) -------------- */
.pt26-appbar {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: rgba(0, 0, 0, .97);
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.pt26-appbar-in {
  max-width: var(--wrap-max);
  margin: 0 auto;
  padding: 0 var(--wrap-pad);
  height: 56px;
  display: flex;
  align-items: center;
  gap: 18px;
}
.pt26-logo { display: inline-flex; align-items: center; flex: none; }
.pt26-logo img { width: 126px; height: auto; display: block; }

/* nav: reuse #header-menu so dropdown.js keeps working */
.pt26-appbar #header-menu { flex: 1; min-width: 0; }
.pt26-appbar ul.dropdown {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 2px;
}
.pt26-appbar ul.dropdown > li { position: relative; }
.pt26-appbar ul.dropdown > li > a {
  display: block;
  padding: 18px 10px;
  font: bold 13px/1.2 Arial, sans-serif;
  color: #c9c9c9;
  text-decoration: none;
  white-space: nowrap;
}
.pt26-appbar ul.dropdown > li:hover > a,
.pt26-appbar ul.dropdown > li.sfHover > a { color: #fff; }

/* submenus: white cards under the bar */
.pt26-appbar #header-menu ul.dropdown ul {
  text-align: left;
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 200px;
  margin: 0;
  padding: 6px 0;
  list-style: none;
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: 0 0 var(--radius-card) var(--radius-card);
  box-shadow: var(--shadow-card-hover);
  z-index: 1001;
}
.pt26-appbar #header-menu ul.dropdown li:hover > ul,
.pt26-appbar #header-menu ul.dropdown li.sfHover > ul { display: block; }
.pt26-appbar #header-menu ul.dropdown ul li { position: relative; }
.pt26-appbar #header-menu ul.dropdown ul a {
  display: block;
  padding: 8px 14px;
  font: bold 13px/1.3 Arial, sans-serif;
  color: var(--ink);
  text-decoration: none;
}
.pt26-appbar #header-menu ul.dropdown ul a:hover { color: var(--red); background: var(--chip-bg); }
/* third level opens to the right */
.pt26-appbar #header-menu ul.dropdown ul ul { top: 0; left: 100%; border-radius: var(--radius-card); }

/* ---- footer: dark slab -> light colophon ------------------------------- */
footer {
  background: #fff;
  border-top: 1px solid var(--card-line);
  margin-top: 34px;
  color: var(--muted);
}
footer div.wrapper { width: auto; max-width: var(--wrap-max); padding: 22px var(--wrap-pad); box-sizing: border-box; }
footer a { color: var(--muted); }
footer a:hover { color: var(--red); }
footer div.pt-footer-usedcars { border-bottom: 1px solid var(--rule-soft); }
footer div.pt-footer-usedcars p.title { color: var(--ink); background: none; text-align: left; }
footer div.pt-footer-usedcars p.title span { background: none; color: var(--ink); padding: 0; }
footer p.copy { font-size: 12px; }

/* ---- pre-footer widgets: dark band -> ground --------------------------- */
#main div.wrapper-footer {
  background: none;
  border-top: 1px solid var(--card-line);
}
#main div.wrapper-footer .column h3,
#main div.wrapper-footer .column p.title,
#main div.wrapper-footer .column p.title span { color: var(--ink); background: none; }
#main div.wrapper-footer, #main div.wrapper-footer a { color: var(--muted); }
#main div.wrapper-footer a:hover { color: var(--red); }

/* ---- sidebar widgets as cards ------------------------------------------ */
#side .widget {
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-card);
  padding: 14px 16px;
  margin-bottom: 14px;
}

/* ---- section headings: image strip -> flat left-aligned ---------------- */
p.title {
  background: none;
  text-align: left;
  margin: 22px 0 12px;
}
p.title span {
  background: none;
  color: var(--ink);
  padding: 0;
  font-weight: bold;
}
.title-medium span, .title-large span { font-size: 20px; }
.title-xlarge span { font-size: 24px; }

/* ================= phase 3: homepage hub (desktop layout) ================= */

.pt-hub {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin: 16px 0 6px;
}
.pt-hub > .pt-hub-card:not(.pt-hub-tools) { grid-column: 1 / -1; order: 1; }
.pt-hub > a.pt-hub-sell:nth-of-type(1) { order: 2; }
.pt-hub > a.pt-hub-sell:nth-of-type(2) { order: 3; }
.pt-hub > .pt-hub-tools { grid-column: 1 / -1; order: 4; }

/* --- search card --- */
.pt-hub-card {
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-card);
  padding: 4px 18px 16px;
}
.pt-hub-seg { display: flex; gap: 4px; margin: 0 -18px 14px; padding: 0 14px; border-bottom: 1px solid var(--rule-soft); }
.pt-hub-seg button {
  appearance: none; background: none; border: 0; cursor: pointer;
  font: bold 15px/1.2 Arial, sans-serif; color: var(--muted);
  padding: 14px 14px 12px; border-bottom: 3px solid transparent;
}
.pt-hub-seg button.on { color: var(--ink); border-bottom-color: var(--red); }
.pt-hub-panel { display: none; }
.pt-hub-panel.on { display: block; }

.pt-hub-sform { display: flex; gap: 10px; }
.pt-hub-sform input[type="search"] {
  flex: 1; min-width: 0; font: 16px/1.2 Arial, sans-serif; color: var(--ink);
  background: #fff; border: 1px solid var(--card-line); border-radius: var(--radius-pill);
  padding: 11px 18px; -webkit-appearance: none;
}
.pt-hub-sform input[type="search"]:focus { outline: none; border-color: var(--red); box-shadow: 0 0 0 3px rgba(166, 15, 15, .10); }
.pt-hub-sform button {
  font: bold 14px/1.2 Arial, sans-serif; color: #fff; background: var(--red);
  border: 0; border-radius: var(--radius-pill); padding: 11px 22px; cursor: pointer;
}
.pt-hub-sform button:hover { background: var(--red-dark); }
.pt-hub-adv { display: block; text-align: right; font: bold 12px/1.3 Arial, sans-serif; color: var(--red); text-decoration: none; margin: 8px 2px 0; }
.pt-hub-adv:hover { text-decoration: underline; }

/* --- car strips: horizontal scroll -> 4-up grid --- */
.pt-hub-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-top: 14px;
  overflow: visible;
}
.pt-hub-lcard {
  display: block; background: #fff; border: 1px solid var(--card-line);
  border-radius: var(--radius-card); overflow: hidden; text-decoration: none;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .04); transition: box-shadow .15s ease;
}
@media (hover: hover) {
  .pt-hub-lcard:hover { box-shadow: var(--shadow-card-hover); }
  .pt-hub-lcard:hover .pt-hub-lnm { color: var(--red); }
}
.pt-hub-limg { position: relative; display: block; background: #ececec; }
.pt-hub-limg img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.pt-hub-lnew {
  position: absolute; top: 8px; left: 8px; background: var(--red); color: #fff;
  font: bold 10px/1 Arial, sans-serif; letter-spacing: .06em; border-radius: var(--radius-pill); padding: 4px 8px;
}
.pt-hub-lnm { display: block; font: bold 16px/1.35 Arial, sans-serif; color: var(--ink); padding: 10px 12px 2px; }
.pt-hub-lpr { display: block; font: 13px/1.3 Arial, sans-serif; color: var(--muted); padding: 0 12px 11px; }
.pt-hub-lskel .pt-hub-limg,
.pt-hub-lskel { background: #f0f0f1; min-height: 150px; border-radius: var(--radius-card); }
.pt-hub-fade { mask-image: none; -webkit-mask-image: none; }

/* --- chips --- */
.pt-hub-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; overflow: visible; }
.pt-hub-chips a {
  font: bold 12px/1.2 Arial, sans-serif; color: var(--ink); background: #fff;
  border: 1px solid var(--card-line); border-radius: var(--radius-pill);
  padding: 7px 13px; text-decoration: none; white-space: nowrap;
}
.pt-hub-chips a:hover { color: var(--red); border-color: var(--red); }

/* --- sell ribbon + google card: shared row --- */
.pt-hub a.pt-hub-sell {
  display: flex; align-items: center; gap: 12px; margin: 0;
  background: #fff; border: 1px solid var(--card-line); border-radius: var(--radius-card);
  padding: 14px 16px; color: var(--ink); text-decoration: none; box-shadow: var(--shadow-card);
  transition: box-shadow .15s ease;
}
@media (hover: hover) { .pt-hub a.pt-hub-sell:hover { box-shadow: var(--shadow-card-hover); } }
.pt-hub .pt-hub-sell svg { width: 30px; height: 30px; flex: none; }
.pt-hub .pt-hub-sell-t { flex: 1; min-width: 0; }
.pt-hub .pt-hub-sell-t b { display: block; font-size: 15px; line-height: 1.3; }
.pt-hub .pt-hub-sell-t small { display: block; font-size: 12px; line-height: 1.35; color: var(--muted); }
.pt-hub .pt-hub-sell-cta { flex: none; background: var(--red); color: #fff; font: bold 13px/1.3 Arial, sans-serif; border-radius: var(--radius-pill); padding: 8px 16px; }

/* --- tool tiles --- */
.pt-hub-tools { padding: 16px 18px; }
.pt-hub-tiles { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
.pt-hub-tile {
  position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px;
  font: bold 14px/1.3 Arial, sans-serif; color: var(--ink); text-align: center;
  text-decoration: none; padding: 10px 6px;
  border-radius: var(--radius-card);
}
@media (hover: hover) { .pt-hub-tile:hover { background: var(--chip-bg); color: var(--red); } }
.pt-hub-tile-ic { width: 60px; height: 60px; border-radius: 16px; display: flex; align-items: center; justify-content: center; }
.pt-hub-tile-ic svg { width: 30px; height: 30px; }
.pt-hub-badge {
  position: absolute; top: 2px; left: 50%; transform: translateX(6px);
  background: var(--red); color: #fff; font: bold 9.5px/1 Arial, sans-serif;
  border-radius: var(--radius-pill); padding: 3px 7px;
}

/* ================= phase 3: homepage editorial cards ================= */

/* recent-posts loop items as cards (scoped: NOT the featured grid tiles) */
#content ul.posts.posts-archive > li {
  box-sizing: border-box;
  background: #fff; border: 1px solid var(--card-line); border-radius: var(--radius-card);
  box-shadow: var(--shadow-card); padding: 14px 16px; margin-bottom: 14px;
  transition: box-shadow .15s ease;
}
@media (hover: hover) { #content ul.posts.posts-archive > li:hover { box-shadow: var(--shadow-card-hover); } }
#content ul.posts.posts-archive > li div.cover img { border-radius: var(--radius-input); }
#content p.postmetadata { color: var(--muted); }

/* tile icon pastel chips (ported from Breezy) */
.pt-hub-ic-ins  { background: #fdf0db; color: #d9870a; }
.pt-hub-ic-fix  { background: #eaeef3; color: #475569; }
.pt-hub-ic-data { background: #e7f0fe; color: #2f80ed; }
.pt-hub-ic-batt { background: #e6f6ec; color: #1a9a50; }
.pt-hub-ic-fuel { background: #fde4e6; color: #ea2127; }
.pt-hub-ic-loan { background: #f0e9fb; color: #7a3fd1; }

/* appbar language switcher (research idiom) */
.pt26-appbar .appbar-langs { display: flex; gap: 4px; margin-left: auto; flex: none; }
.pt26-appbar .appbar-langs a {
  padding: 4px 9px; border-radius: 6px; font: bold 12px/1.3 Arial, sans-serif;
  color: #9a9a9a; text-decoration: none;
}
.pt26-appbar .appbar-langs a:hover { color: #fff; }
.pt26-appbar .appbar-langs a.is-current { color: #fff; background: #2a2a2a; }
.pt26-appbar #header-menu { flex: none; }

/* 980px GPT billboards: center inside the 1040px content area */
#div-gpt-ad-1484284463196-0,
#div-gpt-ad-1484284501927-0,
#div-gpt-ad-1684051038503-0 { text-align: center; }
#div-gpt-ad-1484284463196-0 > div,
#div-gpt-ad-1484284501927-0 > div,
#div-gpt-ad-1684051038503-0 > div { margin: 0 auto; }

/* search strip below the appbar (single EN search; BM/CN via lang switcher) */
.pt26-searchstrip { background: #fff; border-bottom: 1px solid var(--card-line); }
.pt26-searchstrip-in { max-width: var(--wrap-max); margin: 0 auto; padding: 10px var(--wrap-pad); }
.pt26-searchstrip form {
  display: flex; align-items: center; margin: 0;
  background: #fff; border: 1px solid var(--card-line); border-radius: var(--radius-pill);
  box-shadow: var(--shadow-card); padding: 5px 5px 5px 16px;
}
.pt26-searchstrip form:focus-within { border-color: var(--red); box-shadow: 0 0 0 3px rgba(166, 15, 15, .10); }
.pt26-search-ico { display: inline-flex; color: var(--muted); margin-right: 8px; flex: none; }
.pt26-searchstrip input[type="search"] {
  flex: 1; min-width: 0; border: 0; outline: none; background: none;
  font: 16px/1.3 Arial, sans-serif; color: var(--ink); padding: 7px 0;
}
.pt26-searchstrip button {
  flex: none; font: bold 13px/1.2 Arial, sans-serif; color: #fff; background: var(--red);
  border: 0; border-radius: var(--radius-pill); padding: 9px 18px; cursor: pointer;
}
.pt26-searchstrip button:hover { background: var(--red-dark); }

/* dropdown.js inserts ">>" sub-indicators; the clean appbar hides them */
.sf-sub-indicator { display: none !important; }

/* legacy gold post-meta -> muted (must out-!important style.css) */
#content ul.posts div.postmeta p.postmetadata,
#content ul.posts div.postmeta p.postmetadata a { color: var(--muted) !important; }

/* footer: kill legacy dark-band artifacts (text-shadow, orange hover, floats) */
footer, footer p, footer a, footer p.copy { text-shadow: none !important; }
footer { font-size: 12px; }
footer a:hover { color: var(--red); }
footer p.wpzoom { float: none; margin: 0 0 8px; }
footer p.copy { float: none; font-size: 12px; color: var(--muted); }
footer div.pt-footer-usedcars { border-bottom: 1px solid var(--rule-soft) !important; }
footer div.pt-footer-usedcars p.title { color: var(--ink) !important; }
footer div.pt-footer-usedcars p.links { color: var(--muted); }

/* ---- two-column balance: flush both edges, slack becomes the gutter ---- */
#content { margin-left: 0; margin-right: 0; }
#side { float: right; margin-left: 0; }

/* ---- sidebar widget titles: no inherited top margin inside cards ---- */
#side .widget p.title,
#side .widget h3,
#side .widget h4.title { margin-top: 0; }

/* ---- sidebar media stays inside its card ---- */
#side .widget img { max-width: 100%; height: auto; }
#side .widget iframe { max-width: 100%; }

/* ================= phase 4: article pages ================= */

/* the article as a card */
#content article.single {
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-card);
  padding: 24px 28px 26px;
  box-sizing: border-box;
}

/* headline + meta */
#content article.single h1.xlarge {
  font-size: 23px;
  line-height: 1.25;
  color: var(--ink);
  margin: 0 0 8px;
}
#content article.single p.postmetadata {
  color: var(--muted);
  font-size: 12.5px;
  margin: 0 0 16px;
}
#content article.single p.postmetadata a { color: var(--muted); font-weight: bold; }
#content article.single p.postmetadata a:hover { color: var(--red); }

/* body type: readable measure in the new system */
.post-content {
  font-size: 15px;
  line-height: 1.55;
  color: var(--ink);
}
.post-content p { margin: 0 0 1.15em; }
.post-content a { color: var(--red); font-weight: bold; text-decoration: none; }
.post-content a:hover { color: var(--red-dark); text-decoration: underline; }
.post-content h2 { font-size: 22px; line-height: 1.3; }
.post-content h3 { font-size: 18px; line-height: 1.35; }
.post-content img { max-width: 100%; height: auto; border-radius: var(--radius-input); }
.post-content blockquote {
  margin: 18px 0;
  padding: 12px 18px;
  background: var(--chip-bg);
  border-left: 3px solid var(--red);
  border-radius: 0 var(--radius-input) var(--radius-input) 0;
  color: var(--ink);
}

/* tags / filed-under rows */
#content article.single p.tags,
#content article.single p.tags a { color: var(--muted); font-size: 12.5px; }
#content article.single p.tags a:hover { color: var(--red); }

/* ---- comments ---- */
#content ul.commentlist > li {
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-card);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
  padding: 14px 16px;
  margin-bottom: 12px;
  list-style: none;
}
#respond {
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-card);
  padding: 18px 20px;
  margin-top: 18px;
}
#respond input[type="text"],
#respond textarea {
  font: 15px/1.4 Arial, sans-serif;
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-input);
  padding: 10px 12px;
  box-sizing: border-box;
  -webkit-appearance: none;
}
#respond input[type="text"]:focus,
#respond textarea:focus { outline: none; border-color: var(--red); box-shadow: 0 0 0 3px rgba(166, 15, 15, .10); }
#respond textarea { width: 100%; }
#respond input.submit,
#respond input[type="submit"] {
  font: bold 14px/1.2 Arial, sans-serif;
  color: #fff;
  background: var(--red);
  border: 0;
  border-radius: var(--radius-pill);
  padding: 11px 22px;
  cursor: pointer;
  text-shadow: none;
  -webkit-appearance: none;
}
#respond input.submit:hover { background: var(--red-dark); }

/* in-article section headings (carmakersheading strips) */
#content p.title.carmakersheading { margin: 24px 0 12px; }

/* ================= phase 5: archives / search / 404 / pages ================= */

/* archive + search result lists as one card */
#content .pt-search-archive,
.pt-sem-results {
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-card);
  padding: 2px 18px;
  box-sizing: border-box;
}
.pt-search-result { border-bottom: 1px solid var(--rule-soft); }
.pt-search-result:last-child { border-bottom: 0; }
.pt-search-result-title a { color: var(--ink); }
.pt-search-result-title a:hover { color: var(--red); }
.pt-search-result-cat { color: var(--red); }
.pt-search-result-thumb img { border-radius: var(--radius-input); }

/* no-results block as a card */
#content .pt-no-results,
.pt-no-results-section {
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-card);
  padding: 22px 24px;
}

/* pagination -> pill pager */
#content .navigation {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: center;
  margin: 18px 0;
  background: none;
  border: 0;
  padding: 0;
}
#content .navigation .page-numbers {
  font: bold 13px/1.2 Arial, sans-serif;
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-pill);
  padding: 9px 14px;
  text-decoration: none;
  text-shadow: none;
}
#content .navigation .page-numbers:hover { color: var(--red); border-color: var(--red); }
#content .navigation .page-numbers.current { color: #fff; background: var(--red); border-color: var(--red); }
#content .navigation .page-numbers.dots { border: 0; background: none; color: var(--muted); }

/* static pages: article card already applies (article.single); just ensure
   page titles match */
#content article.single h1 { color: var(--ink); }

/* search-results heading: same flat treatment as p.title */
#content .title.titlemedium,
#content p.title.titlemedium {
  background: none;
  text-align: left;
  margin: 18px 0 12px;
}
#content .title.titlemedium span { background: none; color: var(--ink); padding: 0; font-weight: bold; font-size: 22px; }

/* ---- two-column: content 630 + sidebar fills the rest (24px gutter) ---- */
#content { width: 630px; margin: 0; }
#side {
  float: right;
  width: calc(100% - 654px);
  margin: 0;
  box-sizing: border-box;
}
#side .widget { width: auto; }
/* 300px GPT creatives center inside the wider sidebar */
#side div[id^="div-gpt-ad-"] { display: flex; justify-content: center; }
#side #pixel_sidebar_ads, #side #pt_sidebar_ads { text-align: center; }

/* ---- content images: square corners (Paul) ---- */
.post-content img { border-radius: 0; }
#content ul.posts.posts-archive > li div.cover img { border-radius: 0; }

/* ---- headings: undo the legacy normal!important (BebasNeue-era rule) ---- */
#content h1, #content h2, #content h3, #content h4,
#side h3, #side h4 { font-weight: bold !important; }

/* ---- recent-posts loop: story title + meta ---- */
#content ul.posts.posts-archive h2.xlarge { font-size: 23px; line-height: 1.3; margin: 0 0 4px; }
#content ul.posts.posts-archive h2.xlarge a { color: var(--ink); text-decoration: none; }
#content ul.posts.posts-archive h2.xlarge a:hover { color: var(--red); }
#content ul.posts.posts-archive p.postmetadata {
  font-size: 12.5px;
  margin: 0 0 12px;
  color: var(--muted) !important;
}
#content ul.posts.posts-archive p.postmetadata a { font-weight: bold; }

/* loop + article meta links: brand red, not legacy salmon */
#content ul.posts p.postmetadata a,
#content article.single p.postmetadata a { color: var(--red) !important; }
#content ul.posts p.postmetadata a:hover,
#content article.single p.postmetadata a:hover { color: var(--red-dark) !important; }

/* sidebar can carry 360-wide creatives; never shrink below them */
#side { min-width: 360px; }

/* ================= ROS sidebar: single sticky ad ================= */
/* On articles/archives/search the two-column row becomes flex so #side
   stretches to full row height; the ad container then sticks below the
   appbar while the user scrolls. Homepage keeps its float layout. */
body.single #main > div.wrapper,
body.archive #main > div.wrapper,
body.search #main > div.wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  column-gap: 24px;
}
body.single #main > div.wrapper > *,
body.archive #main > div.wrapper > *,
body.search #main > div.wrapper > * { flex: 0 0 100%; box-sizing: border-box; min-width: 0; }
body.single #main > div.wrapper > #content,
body.archive #main > div.wrapper > #content,
body.search #main > div.wrapper > #content { flex: 0 0 630px; float: none; }
body.single #main > div.wrapper > #side,
body.archive #main > div.wrapper > #side,
body.search #main > div.wrapper > #side {
  flex: 1 1 0;
  min-width: 360px;
  float: none;
  width: auto;
  display: flex;
  flex-direction: column;
}
body.single .cleaner, body.archive .cleaner, body.search .cleaner { display: none; }

/* the surviving ROS ad (mrec1_ros) sticks; fuel-price (archives) orders above it */
body.single #side #pixel_sidebar_ads,
body.archive #side #pixel_sidebar_ads,
body.search #side #pixel_sidebar_ads {
  order: 9;
  position: sticky;
  top: 70px;
}

/* ---- mini-hub (ROS sidebar): compact search + tool tiles ---- */
.pt26-mini-hub { padding: 14px 14px 10px; }
.pt26-mini-search { display: flex; gap: 8px; margin-bottom: 12px; }
.pt26-mini-search input[type="search"] {
  flex: 1; min-width: 0; font: 14px/1.2 Arial, sans-serif; color: var(--ink);
  background: #fff; border: 1px solid var(--card-line); border-radius: var(--radius-pill);
  padding: 9px 14px; -webkit-appearance: none;
}
.pt26-mini-search input[type="search"]:focus { outline: none; border-color: var(--red); box-shadow: 0 0 0 3px rgba(166, 15, 15, .10); }
.pt26-mini-search button {
  flex: none; font: bold 13px/1.2 Arial, sans-serif; color: #fff; background: var(--red);
  border: 0; border-radius: var(--radius-pill); padding: 9px 16px; cursor: pointer;
}
.pt26-mini-search button:hover { background: var(--red-dark); }
.pt26-mini-tiles { display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; }
.pt26-mini-tiles .pt-hub-tile { font: bold 10px/1.25 Arial, sans-serif; padding: 6px 2px; gap: 6px; }
.pt26-mini-tiles .pt-hub-tile-ic { width: 38px; height: 38px; border-radius: 12px; }
.pt26-mini-tiles .pt-hub-tile-ic svg { width: 20px; height: 20px; }
.pt26-mini-tiles .pt-hub-badge { font-size: 8px; padding: 2px 5px; white-space: nowrap; transform: translateX(2px); }

/* ---- mini-cars (ROS sidebar): switchable New/Used 2x2 ---- */
.pt26-mini-cars { padding: 2px 14px 12px; }
.pt26-mini-seg { display: flex; gap: 2px; margin: 0 -14px 12px; padding: 0 10px; border-bottom: 1px solid var(--rule-soft); }
.pt26-mini-seg button {
  appearance: none; background: none; border: 0; cursor: pointer;
  font: bold 13px/1.2 Arial, sans-serif; color: var(--muted);
  padding: 11px 10px 9px; border-bottom: 3px solid transparent;
}
.pt26-mini-seg button.on { color: var(--ink); border-bottom-color: var(--red); }
.pt26-mini-panel { display: none; }
.pt26-mini-panel.on { display: block; }
.pt26-mini-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.pt26-mini-grid .pt-hub-lnm { font-size: 11.5px; padding: 7px 9px 1px; }
.pt26-mini-grid .pt-hub-lpr { font-size: 11px; padding: 0 9px 8px; }
.pt26-mini-grid .pt-hub-lskel { min-height: 110px; }
.pt26-mini-cars .pt-hub-adv { margin-top: 10px; }

/* compact sell ribbon under the mini-cars widget */
#side .pt26-mini-sell {
  display: flex; align-items: center; gap: 10px;
  background: #fff; border: 1px solid var(--card-line); border-radius: var(--radius-card);
  box-shadow: var(--shadow-card); padding: 11px 13px; margin-bottom: 14px;
  color: var(--ink); text-decoration: none; transition: box-shadow .15s ease;
}
@media (hover: hover) { #side .pt26-mini-sell:hover { box-shadow: var(--shadow-card-hover); } }
#side .pt26-mini-sell svg { width: 24px; height: 24px; flex: none; }
#side .pt26-mini-sell .pt-hub-sell-t { flex: 1; min-width: 0; }
#side .pt26-mini-sell .pt-hub-sell-t b { display: block; font-size: 13px; line-height: 1.25; }
#side .pt26-mini-sell .pt-hub-sell-t small { display: block; font-size: 10.5px; line-height: 1.3; color: var(--muted); }
#side .pt26-mini-sell .pt-hub-sell-cta { flex: none; background: var(--red); color: #fff; font: bold 11px/1.3 Arial, sans-serif; border-radius: var(--radius-pill); padding: 7px 12px; }

/* SD News widget: header image centered at natural size (Paul) */
#side .SDNewsWidget > a:first-of-type { display: block; text-align: center; }

/* footer bottom row: logo left, copyright beside it */
footer p.wpzoom { float: left; margin: 0 12px 0 0; }
footer p.copy { margin: 0; line-height: 22px; overflow: hidden; }

/* homepage: first sidebar ad breathes below the hub tool strip */
body.home #side > #pixel_sidebar_ads { margin-top: 22px; }

/* hub: Read by make panel — alphabetical chip grid */
.pt-hub-makes {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(134px, 1fr));
  gap: 8px;
  padding: 4px 0 2px;
}
.pt-hub-makes a {
  font: bold 12.5px/1.2 Arial, sans-serif;
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-pill);
  padding: 8px 12px;
  text-decoration: none;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (hover: hover) { .pt-hub-makes a:hover { color: var(--red); border-color: var(--red); } }

/* ---- footer link hub (desktop columns, data from Breezy's hub) ---- */
.pt26-footer-links {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px 28px;
  padding: 4px 0 18px;
  border-bottom: 1px solid var(--rule-soft);
  margin-bottom: 16px;
}
.pt26-footer-links h4 {
  margin: 0 0 8px;
  font: bold 15px/1.3 Arial, sans-serif;
  font-weight: bold !important;
  color: var(--ink);
  text-shadow: none;
}
.pt26-footer-links a {
  display: block;
  font: 12.5px/1.9 Arial, sans-serif;
  color: var(--muted);
  text-decoration: none;
  text-shadow: none;
}
.pt26-footer-links a:hover { color: var(--red); }

/* ---- search strip: narrower bar + social links right ---- */
.pt26-searchstrip-in { display: flex; align-items: center; gap: 20px; }
.pt26-searchstrip form { flex: 1; max-width: 680px; }
.pt26-social { display: flex; gap: 6px; margin-left: auto; flex: none; }
.pt26-social a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 50%;
  color: var(--muted); background: var(--chip-bg);
}
.pt26-social a svg { width: 17px; height: 17px; }
@media (hover: hover) { .pt26-social a:hover { color: #fff; background: var(--red); } }

.pt26-social-label { font: bold 12.5px/1.2 Arial, sans-serif; color: var(--muted); margin-right: 4px; align-self: center; white-space: nowrap; }

/* Read by make: research-style logo tiles (2 rows of 6) + expandable chips */
.pt-hub-make-tiles {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px;
  padding: 4px 0 2px;
}
.pt-hub-make-tiles a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 14px 8px 12px;
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-card);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
  text-decoration: none;
  transition: box-shadow .15s ease;
}
@media (hover: hover) {
  .pt-hub-make-tiles a:hover { box-shadow: var(--shadow-card-hover); }
  .pt-hub-make-tiles a:hover strong { color: var(--red); }
}
.pt-hub-make-logo { display: flex; align-items: center; justify-content: center; width: 64px; height: 40px; }
.pt-hub-make-logo img { width: auto; height: auto; max-width: 60px; max-height: 36px; }
.pt-hub-make-tiles strong { font: bold 13px/1.2 Arial, sans-serif; color: var(--ink); }
.pt-hub-makes-more { margin-top: 12px; }
.pt-hub-makes-toggle {
  display: block;
  margin: 14px auto 2px;
  appearance: none;
  font: bold 12.5px/1.2 Arial, sans-serif;
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-pill);
  padding: 9px 18px;
  cursor: pointer;
}
.pt-hub-makes-toggle:hover { color: var(--red); border-color: var(--red); }

/* the class's display:grid beats the UA [hidden] rule — enforce it */
.pt-hub-makes-more[hidden] { display: none; }

/* homepage videos: 1 large + row of 3 from the same feed */
.pt26-video-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-top: 12px;
}
.pt26-video-row lite-youtube { width: 100%; max-width: none; }

/* hub story tabs: article titles a notch smaller than car names */
.pt-hub-stories .pt-hub-lnm { font-size: 13.5px; }

/* story-tab thumbnails: native 1200x630 ratio, no crop */
.pt-hub-stories .pt-hub-limg img { aspect-ratio: 1200 / 630; }

/* search-strip ghost typewriter (ported from Breezy) */
.pt26-searchstrip form { position: relative; }
.pt26-search-ghost {
  position: absolute;
  left: 42px;
  top: 50%;
  transform: translateY(-50%);
  display: none;
  align-items: center;
  max-width: calc(100% - 140px);
  overflow: hidden;
  white-space: nowrap;
  pointer-events: none;
  font: 16px/1.3 Arial, sans-serif;
  color: #999;
}
.pt26-searchstrip form.is-animating .pt26-search-ghost { display: flex; }
.pt26-search-ghost-caret {
  flex: 0 0 2px;
  width: 2px;
  height: 17px;
  margin-left: 1px;
  background: var(--red);
  animation: pt26-caret-blink 1s step-end infinite;
}
@keyframes pt26-caret-blink { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .pt26-search-ghost { display: none !important; } }

/* ---- width reclaim (Paul): ROS pages side 360 / content 656; slimmer cards ---- */
body.single #main > div.wrapper > #content,
body.archive #main > div.wrapper > #content,
body.search #main > div.wrapper > #content { flex: 0 0 656px; }
body.single #main > div.wrapper > #side,
body.archive #main > div.wrapper > #side,
body.search #main > div.wrapper > #side { flex: 0 0 360px; min-width: 360px; }
#content article.single { padding: 24px 18px 26px; }
#content ul.posts.posts-archive > li { padding: 14px 12px; }

/* ================= audit batch (Paul, 2026-07-22) ================= */

/* #3 keyboard focus: visible red ring on all interactive elements */
.pt-hub-seg button:focus-visible,
.pt26-mini-seg button:focus-visible,
.pt-hub-makes-toggle:focus-visible,
.pt-hub-chips a:focus-visible,
.pt-hub-makes a:focus-visible,
.pt-hub-make-tiles a:focus-visible,
.pt-hub-lcard:focus-visible,
.pt26-social a:focus-visible,
.pt26-btn:focus-visible,
.pt26-searchstrip button:focus-visible,
.pt-hub-sform button:focus-visible,
.pt26-mini-search button:focus-visible,
#respond input:focus-visible,
.pt26-appbar a:focus-visible,
.pt26-footer-links a:focus-visible {
  outline: 2px solid var(--red);
  outline-offset: 2px;
  border-radius: 4px;
}

/* #4 homepage: flex columns like ROS pages; mrec2_home relocates to the
   column end and sticks (mrec1 stays at top) */
body.home #main > div.wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  column-gap: 24px;
}
body.home #main > div.wrapper > * { flex: 0 0 100%; box-sizing: border-box; min-width: 0; }
body.home #main > div.wrapper > #content { flex: 0 0 630px; float: none; }
body.home #main > div.wrapper > #side { flex: 1 1 0; min-width: 360px; float: none; width: auto; display: flex; flex-direction: column; }
body.home .cleaner { display: none; }
/* Paul rev: ads stay in place; the mini-cars widget goes to the column end
   and sticks (its DOM position is sidebar-top, flex order moves it) */
body.home #side .pt26-mini-cars {
  order: 9;
  position: sticky;
  top: 70px;
  margin-top: 14px;
  margin-bottom: 0;
}

/* #5 appbar scroll shadow */
.pt26-appbar.is-scrolled { box-shadow: 0 2px 10px rgba(0, 0, 0, .25); }

/* #6 back-to-top pill (bottom-right, where the smiley lived) */
.pt26-top {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 900;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid var(--card-line);
  background: #fff;
  color: var(--ink);
  font: bold 17px/1 Arial, sans-serif;
  cursor: pointer;
  box-shadow: var(--shadow-card-hover);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease;
}
.pt26-top.is-visible { opacity: 1; pointer-events: auto; }
.pt26-top:hover { color: #fff; background: var(--red); border-color: var(--red); }
.pt26-count { font-style: normal; font-weight: normal; font-size: 15px; color: var(--muted); }

/* homepage: sell ribbon rides at the column end, above the sticky mini-cars */
body.home #side .pt26-mini-sell { order: 8; margin-top: 14px; margin-bottom: 0; }
body.home #side .pt26-mini-cars { margin-top: 14px; }

/* homepage billboard: equalize top/bottom breathing room (inline 15px
   margin + hub 16px stacked to ~31px below vs ~23px above) */
#div-gpt-ad-1484284463196-0 { margin-bottom: 8px !important; }

/* ================= skinner canvas ================= */
/* Skinner campaigns replace the page background; the 2026 design floats
   cards on that background, so without an opaque canvas the content
   gutters go campaign-black (Paul's Chery takeover report). Paint the
   main wrapper in ground colour: invisible normally (grey-on-grey),
   keeps the centre readable under a skin — same role the old 980px
   white panel played. */
#main > div.wrapper {
  background: var(--ground);
}
/* the ROS footer-billboard slot sits between #main and <footer>; continue
   the canvas through it so the skin can't flash through that band */
#div-gpt-ad-1684051038503-0 {
  background: var(--ground);
  max-width: 1080px;
  margin: 0 auto;
  padding: 10px 20px;
  box-sizing: border-box;
}

/* ---- author bio: design-system card (grey gradient box -> white card) ---- */
#content div.author-info {
  background: #fff !important;
  background-image: none !important;
  filter: none;
  border: 1px solid var(--card-line) !important;
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-card);
  padding: 20px;
  margin: 20px 0 !important;
  font-size: 13px;
  line-height: 1.55;
  color: var(--muted);
}
#content div.author-info h3 {
  font-size: 15px;
  color: var(--ink);
  margin: 0 0 6px;
}
#content div.author-info div.thumb img {
  padding: 0;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-card);
  background: none;
}
#content div.author-info a { color: var(--red); font-weight: bold; text-decoration: none; }
#content div.author-info a:hover { color: var(--red-dark); }
#content div.author-info p { margin: 0 0 10px; }
#content div.author-info p:last-child, #content div.author-info p:last-of-type { margin-bottom: 0; }
#content div.author-info div.thumb { margin-bottom: 0; }
#content div.author-info div.thumb img { display: block; }
#content div.author-info::after { content: ""; display: block; clear: both; }

/* story-tab cards: square corners (thumbnail no longer clipped round) */
.pt-hub-stories .pt-hub-lcard { border-radius: 0; }

/* sell ribbon integrated as the mini-cars widget footer (Paul) */
.pt26-mini-cars .pt26-mini-sell {
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0;
  border-top: 1px solid var(--rule-soft) !important;
  margin: 12px -14px 0;
  padding: 12px 14px 4px;
  background: none;
}

/* attachment/gallery pages: single full-width column (original morning
   design) — no sidebar exists, so the card spans and centers */
body.attachment #main > div.wrapper > #content,
body.single-attachment #main > div.wrapper > #content {
  flex: 1 1 100%;
  max-width: 100%;
}
body.attachment #content article.single,
body.single-attachment #content article.single {
  max-width: 980px;
  margin: 0 auto;
}

/* mini-cars widget: tighten vertical rhythm toward the 14px sides */
.pt26-mini-cars { padding: 0 14px 10px; }
.pt26-mini-seg button { padding: 10px 10px 8px; }
.pt26-mini-seg { margin-bottom: 10px; }
.pt26-mini-cars .pt26-mini-sell { padding: 10px 14px 2px; margin-top: 10px; }
.pt26-mini-cars .pt-hub-adv { margin-top: 8px; }

/* footer-widgets wrapper is empty site-wide; its border drew a stray line */
#main div.wrapper-footer { border-top: 0; }

/* logo-less make tile (Lepas until research ships lepas.png) */
.pt-hub-make-logo-text {
  font: bold 13px/1 Arial, sans-serif;
  letter-spacing: .14em;
  color: var(--ink);
}

/* floating Edit post pill for logged-in editors (admin bar is hidden) */
.pt26-edit-post {
  position: fixed;
  top: 68px;
  right: 18px;
  z-index: 950;
  font: bold 12.5px/1.2 Arial, sans-serif;
  color: #fff;
  background: var(--ink);
  border-radius: var(--radius-pill);
  padding: 9px 16px;
  text-decoration: none;
  box-shadow: var(--shadow-card-hover);
  opacity: .85;
}
.pt26-edit-post:hover { opacity: 1; color: #fff; background: var(--red); }

/* ---- article-end tag story list: design-system card ---- */
#content .pt26-tagrel {
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-card);
  padding: 18px 20px 8px;
  margin: 20px 0;
}
#content .pt26-tagrel p.title-small { margin: 4px 0 12px; }
#content .pt26-tagrel p.title-small span a {
  font: bold 16px/1.3 Arial, sans-serif;
  color: var(--ink);
  text-decoration: none;
}
#content .pt26-tagrel p.title-small span a:hover { color: var(--red); }
#content .pt26-tagrel ul.posts-side { margin: 0; padding: 0; list-style: none; }
#content .pt26-tagrel .cover img { width: 100%; height: auto; display: block; }
#content .pt26-tagrel .cover { margin-bottom: 8px; }
#content .pt26-tagrel h2.small { font-size: 13.5px; line-height: 1.35; margin: 0 0 3px; }
#content .pt26-tagrel h2.small a { color: var(--ink); text-decoration: none; }
#content .pt26-tagrel h2.small a:hover { color: var(--red); }
#content .pt26-tagrel .postmetadata { font-size: 11.5px; color: var(--muted); margin: 0 0 14px; }
/* tag-list items: thumb | text grid so dates always sit under titles */
#content .pt26-tagrel li article {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr);
  column-gap: 12px;
}
#content .pt26-tagrel li article .cover { grid-row: 1 / 3; margin: 0; }
#content .pt26-tagrel li article header,
#content .pt26-tagrel li article .postmetadata { grid-column: 2; }
#content .pt26-tagrel li article .cleaner { display: none; }

/* ---- attachment/gallery page polish ---- */
.pt26-gallery-back { text-align: center; padding: 4px 0 12px; }
.pt26-gallery-back .pt26-eyebrow { display: block; margin-bottom: 3px; }
.pt26-gallery-back a { font: bold 16px/1.35 Arial, sans-serif; color: var(--ink); text-decoration: none; }
.pt26-gallery-back a:hover { color: var(--red); }
.pt26-gallery-foot { text-align: center; padding: 16px 0 4px; }
.pt26-gallery-caption { font-size: 12.5px; color: var(--muted); margin: 0 0 12px; }
.pt26-gallery-ad { text-align: center; margin: 18px 0 6px; }
/* gallery chips pick up the pill radius */
.pt-gallery-counter { border-radius: var(--radius-pill); }
.post-content a.pt26-btn { color: #fff; text-decoration: none; }
.post-content a.pt26-btn:hover { color: #fff; }
.pt26-gallery-legal { text-align: center; font-size: 11px; color: var(--muted); margin: 14px 0 2px; }
.pt26-gallery-colophon {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  max-width: 980px;
  margin: 14px auto 4px;
  font-size: 12px;
  color: var(--muted);
}

/* empty footer-widgets wrapper: no phantom spacing either */
#main div.wrapper-footer { padding: 0; margin: 0; }
/* legacy #main min-height:100vh (faux white column era) inflated short
   pages, stranding the footer below the fold */
#main { min-height: 0; }

/* attachment card: tighter vertical rhythm (Paul: top/bottom excessive) */
body.attachment #content article.single,
body.single-attachment #content article.single { padding: 14px 18px 14px; }
.pt26-gallery-back { padding: 2px 0 10px; }
.pt26-gallery-foot { padding: 12px 0 2px; }
/* footer: single padding source (legacy 30px + wrapper 22px stacked to 52px/side) */
footer { padding: 0; }
footer div.wrapper { padding-top: 16px; padding-bottom: 16px; }

/* new-car strips: studio images (white bg, baked margins) contain in the
   16:9 box like research's .card-media — kills the fat gap under the car */
#pt-hub-launches .pt-hub-limg img,
#pt26mc-launches .pt-hub-limg img { object-fit: contain; background: #fff; }

/* #1 all-topics: multi-column category tree (title_li='' -> li direct in .pt26-listcats) */
.pt26-listcats { columns: 4; column-gap: 28px; list-style: none; }
.pt26-listcats li { list-style: none !important; }
.pt26-listcats ul.children li { padding-left: 0; margin-left: 0; }
.pt26-listcats > li { break-inside: avoid; margin-bottom: 14px; }
.pt26-listcats > li > a { font: bold 14px/1.4 Arial, sans-serif; color: var(--ink); text-decoration: none; }
.pt26-listcats > li > a:hover { color: var(--red); }
.pt26-listcats ul.children { margin: 4px 0 0; padding: 0; }
.pt26-listcats ul.children a { display: block; font: 12.5px/1.7 Arial, sans-serif; color: var(--muted); text-decoration: none; }
.pt26-listcats ul.children a:hover { color: var(--red); }

/* #2 CLS: reserve height for the hub car strips + story grids so the
   async fetch doesn't reflow the page under them */
.pt-hub-strip { min-height: 430px; }  /* 2 rows of title+price cards */
.pt26-mini-grid { min-height: 300px; }
/* hub search buttons carry descriptive labels — keep on one line */
.pt-hub-sform button { white-space: nowrap; }

/* homepage loop excerpt links: red like the article body (legacy
   ul.posts a{color:#222!important} was forcing them black — but only
   the excerpt body, NOT the story titles which live outside .post-content) */
#content ul.posts .post-content a { color: var(--red) !important; font-weight: bold; }
#content ul.posts .post-content a:hover { color: var(--red-dark) !important; }
