/* ==========================================================================
   partners.html fixes — loaded AFTER custom.css so these rules win.
   Audit findings: eyebrow badge styling, reduced motion, light-mode card
   override, mobile grid orphan. No colour/identity changes.
   ========================================================================== */

/* --- P0: restore the section eyebrow pill badge -----------------------------
   The eyebrow was demoted <h3> -> <p class="sub-heading"> for correct heading
   order. Re-apply the same pill styling custom.css gives .section-title h3. */
.section-title .sub-heading {
	display: inline-block;
	position: relative;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5em;
	text-transform: capitalize;
	color: var(--primary-color);
	background: var(--secondary-color) url('../images/icon-sub-heading.png') no-repeat;
	background-position: left 20px center;
	background-size: 20px auto;
	border-left: 1px solid var(--accent-color);
	border-right: 1px solid var(--accent-secondary-color);
	border-top: none;
	border-bottom: none;
	border-radius: 100px;
	padding: 8px 20px 8px 50px;
	margin-bottom: 20px;
}

@media (max-width: 767px) {
	.section-title .sub-heading {
		font-size: 14px;
		background-position: left 15px center;
		background-size: 16px auto;
		padding: 8px 15px 8px 40px;
		margin-bottom: 15px;
	}
}

/* --- P3: light-mode partner cards should be white, not the dark-theme grey -- */
[data-theme="light"] .partner-logo-card {
	background-color: #FFFFFF;
	border-color: rgba(0, 0, 0, 0.08);
}

/* The Everpure JPG has heavy internal whitespace, so the mark reads tiny at the
   shared 44px height. Bump it (and crop the baked-in white box) so it matches the
   other logos. */
.partner-logo-card img[src*="Everpure"] {
	height: 84px;
	mix-blend-mode: multiply;
}

/* HyperNext is a JPG with a baked-in white box; blend it into the card so the
   rectangle doesn't show. (Height already handled in custom.css.) */
.partner-logo-card img[src*="hypernext"] {
	mix-blend-mode: multiply;
}

/* --- P3: mobile 2-col grid orphans the 9th logo; centre the trailing odd one - */
@media (max-width: 767px) {
	.partner-logo-grid > [class*="col-"]:last-child:nth-child(odd) {
		margin-left: auto;
		margin-right: auto;
	}
}

/* --- P1: WCAG 2.2.2 — pause the auto-scroll ticker on hover / keyboard focus - */
.scrolling-ticker-box:hover .scrolling-content,
.scrolling-ticker-box:focus-within .scrolling-content {
	animation-play-state: paused;
}

/* --- P1: WCAG 2.2.2 / 2.3.3 — honor reduced-motion: stop ticker + entrances,
   keep WOW-hidden content visible so nothing ships blank. -------------------- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
	.scrolling-content {
		animation: none !important;
	}
	.wow {
		visibility: visible !important;
		animation-name: none !important;
	}
}
