/* AUTOBOSS Home — phones (below the tablet breakpoint). */
#abhm { --abhm-cols: 2; }
.abhm-head { margin-bottom: 12px; }
#abhm .abhm-more { font-size: 14px; }
#abhm .abhm-track:not(.abhm-mob-grid):not(.abhm-mob-stack) { margin-inline: calc(-1 * var(--abhm-gutter)); padding-inline: var(--abhm-gutter); scroll-padding-inline: var(--abhm-gutter); }
#abhm .abhm-grid { gap: 16px var(--abhm-gap); }

/* Hero: stacked text over picture; photo slides keep the picture behind the text. */
#abhm .abhm-slide { display: flex; flex-direction: column; align-items: stretch; height: var(--h-m); }
.abhm-slide-text { padding: 24px 20px 12px; }
#abhm .abhm-slide-desc { font-size: 14px; line-height: 20px; }
#abhm .abhm-btns { gap: 8px; margin-top: 16px; }
#abhm .abhm-btn { min-height: 40px; padding: 0 18px; }
.abhm-slide-media { flex: 1; min-height: 0; }
#abhm .abhm-slide-media img { padding: 0 20px 48px; }
.abhm-slide[style*="--fit:cover"] .abhm-slide-text, .abhm-hero-cover .abhm-slide-text { margin-top: auto; padding-bottom: 56px; }
.abhm-slide[style*="--fit:cover"] .abhm-slide-media::after, .abhm-hero-cover .abhm-slide-media::after {
	background: linear-gradient(0deg, var(--bg) 0%, color-mix(in srgb, var(--bg) 72%, transparent) 42%, transparent 75%);
}
.abhm-hero-ctrl { bottom: 12px; left: 50%; transform: translateX(-50%); }
.abhm-hero-in > .abhm-arrow { display: none; }
.abhm-picks { padding: 0 12px 48px; }
#abhm .abhm-picks ul { gap: 8px; }
#abhm .abhm-pick { padding: 6px; border-radius: 8px; }
.abhm-pick-name { font-size: 12px; line-height: 16px; }
.abhm-pick-price { font-size: 14px; }

/* Category tiles: 3-column grid (eBay phone) or swipe row. */
#abhm .abhm-circles > li { width: var(--size-m); }
#abhm .abhm-circles.abhm-mob-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 12px; overflow: visible; scroll-snap-type: none; }
#abhm .abhm-circles.abhm-mob-grid > li { width: auto; }
.abhm-circle-name { font-size: 13px; line-height: 18px; }

/* Brands. */
#abhm .abhm-brands { grid-template-columns: repeat(var(--cols-m), minmax(0, 1fr)); gap: 8px; }
#abhm .abhm-brand { min-height: 76px; padding: 12px 6px; }
.abhm-brand-logo { height: 36px; }
#abhm .abhm-brand-logo img { max-height: 36px; max-width: 88%; }
.abhm-brand-name { font-size: 14px; line-height: 20px; }
#abhm .abhm-brand-links { display: none; }
.abhm-az-body { padding: 16px; columns: 2 120px; column-gap: 16px; }

/* Group cards: swipe row (85% wide) or stacked. */
#abhm .abhm-gcards.abhm-mob-scroll { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
#abhm .abhm-gcards.abhm-mob-scroll > li { flex: 0 0 82%; }
#abhm .abhm-gcards.abhm-mob-stack { grid-template-columns: minmax(0, 1fr); }
.abhm-gcard { padding: 16px; }

/* Promo tiles. */
#abhm .abhm-tiles.abhm-mob-scroll { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
#abhm .abhm-tiles.abhm-mob-scroll > li { flex: 0 0 85%; }
#abhm .abhm-tiles.abhm-mob-stack { grid-template-columns: minmax(0, 1fr); }
#abhm .abhm-tile { height: var(--h-m); }
.abhm-tile-text { padding: 16px 4px 16px 16px; }
.abhm-tile-title { font-size: 18px; line-height: 24px; }
.abhm-tile-desc { font-size: 13px; line-height: 18px; }

/* Tabs keep swiping; the row bleeds to the edges. */
.abhm-tablist { margin-inline: calc(-1 * var(--abhm-gutter)); padding-inline: var(--abhm-gutter); }

/* Services: two columns. */
#abhm .abhm-services { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; }
#abhm .abhm-sv-plain { padding: 16px 0; }
#abhm .abhm-sv { flex-direction: column; gap: 6px; }
#abhm .abhm-sv .abhm-i { width: 24px; height: 24px; }
.abhm-sv strong { font-size: 14px; }
.abhm-sv small { font-size: 12px; line-height: 16px; }

/* Text: folded with a Read more button (added by the script). */
.abhm-text-body { font-size: 14px; line-height: 22px; }
.abhm-text-body.is-folded { max-height: 132px; overflow: hidden; -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent); mask-image: linear-gradient(180deg, #000 55%, transparent); }
#abhm .abhm-fold-btn { display: inline-flex; margin-top: 8px; padding: 0; border: 0; background: none; color: var(--abhm-text); font: inherit; font-size: 14px; font-weight: 700; text-decoration: underline; cursor: pointer; }

/* Phones swipe; arrows would only overlap the cards. */
#abhm .abhm-scroller > .abhm-arrow { display: none; }
