/* =============================================================
   NOVO Spare Parts — Single Product Page CSS
   Scoped to .novo-sps-page wrapper.
   Mirrors spare-part-single-preview.html.
   Uses --novo-* tokens from novo-base.css
   ============================================================= */

/* ── Animations ────────────────────────────────────────────── */
@keyframes ringPulse { 0%,100%{opacity:1;transform:translateY(-50%) scale(1)} 50%{opacity:.35;transform:translateY(-50%) scale(1.05)} }
@keyframes floatOrb  { 0%,100%{transform:translateY(0) scale(1)} 50%{transform:translateY(-28px) scale(1.06)} }
@keyframes blink     { 0%,100%{opacity:1} 50%{opacity:.25} }
@keyframes scanMove  { 0%{top:-2px;opacity:0} 10%{opacity:1} 90%{opacity:.4} 100%{top:100%;opacity:0} }
@keyframes fadeDown  { from{opacity:0;transform:translateY(-18px)} to{opacity:1;transform:translateY(0)} }

/* ── Page wrapper ───────────────────────────────────────────── */
.novo-sps-page {
	background: var(--novo-grey-bg, #F7F8FA);
}

/* ════════════════════════════════════════════════════════
   HERO
════════════════════════════════════════════════════════ */
.novo-sps-page .sp-hero {
	min-height: 80vh;
	background: radial-gradient(ellipse at 60% 40%, #0d4a6b 0%, var(--novo-navy, #0B3954) 42%, #071F2E 100%);
	display: flex;
	align-items: center;
	margin-top: calc(-1 * (var(--novo-topbar-h, 36px) + var(--novo-hdr-h, 72px)));
	padding: calc(var(--novo-topbar-h, 36px) + var(--novo-hdr-h, 72px) + 80px) 0 120px;
	position: relative;
	overflow: hidden;
}
.novo-sps-page .sp-hero::before {
	content: '';
	position: absolute;
	width: 800px; height: 800px;
	border: 1px solid rgba(245,109,13,.08); border-radius: 50%;
	top: 50%; right: -200px; transform: translateY(-50%);
	animation: ringPulse 7s ease-in-out infinite;
	pointer-events: none;
}
.novo-sps-page .sp-hero::after {
	content: '';
	position: absolute;
	width: 500px; height: 500px;
	border: 1px solid rgba(245,109,13,.05); border-radius: 50%;
	top: 50%; right: -50px; transform: translateY(-50%);
	animation: ringPulse 7s ease-in-out infinite .6s;
	pointer-events: none;
}
.novo-sps-page .sp-hero-glow {
	position: absolute; inset: 0; pointer-events: none;
	background:
		radial-gradient(ellipse at 18% 30%, rgba(13,74,107,.55) 0%, transparent 52%),
		radial-gradient(ellipse at 85% 70%, rgba(245,109,13,.08) 0%, transparent 48%);
}
.novo-sps-page .sp-hero-orb {
	position: absolute; border-radius: 50%;
	filter: blur(72px); opacity: .28; pointer-events: none;
	animation: floatOrb 9s ease-in-out infinite;
}
.novo-sps-page .sp-hero-orb-1 { width:360px; height:360px; background:var(--novo-orange,#F56D0D); top:-80px; right:-60px; }
.novo-sps-page .sp-hero-orb-2 { width:220px; height:220px; background:#1A6090; bottom:60px; left:-50px; animation-delay:-4s; }
.novo-sps-page .sp-hero-scanline { position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:1; }
.novo-sps-page .sp-hero-scanline::after {
	content: '';
	position: absolute; left:0; right:0; height:2px;
	background: linear-gradient(90deg,transparent,rgba(245,109,13,.15),rgba(245,109,13,.05),transparent);
	animation: scanMove 8s ease-in-out infinite;
}

.novo-sps-page .sp-hero-layout {
	position: relative; z-index: 2;
	display: grid;
	grid-template-columns: 1fr 500px;
	gap: 64px;
	align-items: center;
}

/* ── Hero text ── */
.novo-sps-page .sp-hero-eyebrow {
	display: inline-flex; align-items: center; gap: 8px;
	background: rgba(245,109,13,.15); border: 1px solid rgba(245,109,13,.32);
	color: var(--novo-orange-lite, #FFAB6E); font-size: 11px; font-weight: 700;
	letter-spacing: 3px; text-transform: uppercase;
	padding: 8px 20px; border-radius: 50px; margin-bottom: 24px;
	animation: fadeDown .6s ease both;
}
.novo-sps-page .sp-hero-partnum {
	font-size: 13px; font-weight: 700; font-family: 'Courier New', monospace;
	color: rgba(255,255,255,.40); letter-spacing: 2px;
	background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12);
	border-radius: 8px; padding: 6px 14px; display: inline-block; margin-bottom: 16px;
	animation: fadeDown .6s ease .05s both;
}
.novo-sps-page .sp-hero-headline {
	font-size: clamp(32px, 4.5vw, 58px);
	font-weight: 900; line-height: 1.06; letter-spacing: -2px;
	color: #fff; margin-bottom: 10px;
	animation: fadeDown .6s ease .1s both;
}
.novo-sps-page .sp-hero-headline span {
	display: block;
	background: linear-gradient(90deg, var(--novo-orange,#F56D0D), var(--novo-orange-lite,#FFAB6E));
	-webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.novo-sps-page .sp-hero-model {
	font-size: 15px; font-weight: 600; color: rgba(255,255,255,.42);
	margin-bottom: 28px;
	animation: fadeDown .6s ease .18s both;
}
.novo-sps-page .sp-hero-model span { color: rgba(255,255,255,.72); }

.novo-sps-page .sp-hero-pills {
	display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 36px;
	animation: fadeDown .6s ease .25s both;
}
.novo-sps-page .sp-pill {
	display: inline-flex; align-items: center; gap: 6px;
	background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
	border-radius: 50px; padding: 7px 16px;
	font-size: 12.5px; font-weight: 700; color: rgba(255,255,255,.75);
}
.novo-sps-page .sp-pill i { color: var(--novo-orange,#F56D0D); font-size: 11px; }
.novo-sps-page .sp-pill.green  { background:rgba(31,164,99,.15); border-color:rgba(31,164,99,.25); color:#5de6a3; }
.novo-sps-page .sp-pill.green i { color:#5de6a3; }
.novo-sps-page .sp-pill.orange { background:rgba(245,109,13,.15); border-color:rgba(245,109,13,.28); color:var(--novo-orange-lite,#FFAB6E); }

.novo-sps-page .sp-hero-btns {
	display: flex; flex-wrap: wrap; gap: 12px;
	animation: fadeDown .6s ease .33s both;
}
.novo-sps-page .sp-hero-micro-trust {
	display: flex; flex-wrap: wrap; gap: 18px; margin-top: 20px;
	animation: fadeDown .6s ease .40s both;
}
.novo-sps-page .sp-hmt-item {
	display: flex; align-items: center; gap: 6px;
	font-size: 12px; font-weight: 600; color: rgba(255,255,255,.40);
}
.novo-sps-page .sp-hmt-item i { color: var(--novo-orange,#F56D0D); font-size: 11px; }

/* ── Hero right — gallery card ── */
.novo-sps-page .sp-hero-card { animation: fadeDown .6s ease .2s both; }
.novo-sps-page .sp-hc-gallery {
	background: linear-gradient(140deg, #f0f4f8 0%, #e2e8ef 100%);
	border-radius: 24px; aspect-ratio: 4/3;
	display: flex; align-items: center; justify-content: center;
	position: relative; overflow: hidden;
	border: 1px solid rgba(255,255,255,.18);
	box-shadow: 0 40px 100px rgba(0,0,0,.40), inset 0 1px 0 rgba(255,255,255,.80);
	cursor: zoom-in; margin-bottom: 14px;
}
.novo-sps-page .sp-hc-gallery::before {
	content: ''; position: absolute; inset: 0; pointer-events: none;
	background: radial-gradient(ellipse at 80% 18%, rgba(245,109,13,.09) 0%, transparent 55%);
}
.novo-sps-page .sp-hc-gallery::after {
	content: ''; position: absolute;
	top:12px; left:12px; width:28px; height:28px;
	border-top: 2px solid rgba(245,109,13,.45);
	border-left: 2px solid rgba(245,109,13,.45);
	border-radius: 4px 0 0 0; pointer-events: none;
}
.novo-sps-page .sp-hc-corner-br {
	position: absolute; bottom:12px; right:12px;
	width:28px; height:28px;
	border-bottom: 2px solid rgba(245,109,13,.45);
	border-right: 2px solid rgba(245,109,13,.45);
	border-radius: 0 0 4px 0; pointer-events: none; z-index: 2;
}
.novo-sps-page .sp-hc-gallery.sp-zoomed {
	position: fixed; inset: 0; z-index: 1000;
	border-radius: 0; aspect-ratio: unset;
	background: rgba(7,31,46,.95); cursor: zoom-out;
	box-shadow: none;
}
.novo-sps-page .sp-hc-gallery.sp-zoomed .sp-hc-gp { transform: scale(1.18); }
.novo-sps-page .sp-hc-gp {
	position: relative; z-index: 1;
	display: flex; flex-direction: column; align-items: center; gap: 18px;
	transition: transform .3s; text-align: center; padding: 40px;
}
.novo-sps-page .sp-hc-icon {
	width: 120px; height: 120px;
	background: #fff;
	border: 1px solid rgba(245,109,13,.20); border-radius: 32px;
	display: flex; align-items: center; justify-content: center;
	font-size: 48px; color: var(--novo-orange,#F56D0D);
	box-shadow: 0 16px 48px rgba(11,57,84,.14);
}
.novo-sps-page .sp-hc-caption { font-size: 12px; font-weight: 600; color: var(--novo-grey-tx,#7A90A0); }
.novo-sps-page .sp-hc-badge-tl {
	position: absolute; top:14px; left:14px; z-index: 2;
	background: var(--novo-green,#1fa463); color: #fff;
	font-size: 10.5px; font-weight: 700; padding: 5px 12px;
	border-radius: 20px; display: flex; align-items: center; gap: 5px;
}
.novo-sps-page .sp-hc-badge-tl::before {
	content: ''; width:6px; height:6px;
	background: rgba(255,255,255,.80); border-radius: 50%;
	animation: blink 1.6s ease infinite;
}
.novo-sps-page .sp-hc-badge-tl.incoming { background: var(--novo-orange, #F56D0D); }
.novo-sps-page .sp-hc-badge-tl.reserved { background: #7A90A0; }
.novo-sps-page .sp-hc-badge-br {
	position: absolute; bottom:14px; right:50px; z-index: 2;
	background: #fff; border: 1px solid var(--novo-border,#EEF2F6);
	border-radius: 8px; padding: 5px 12px;
	font-size: 10.5px; font-weight: 700; color: var(--novo-grey-tx,#7A90A0);
	display: flex; align-items: center; gap: 5px;
	box-shadow: 0 2px 10px rgba(11,57,84,.10);
}
.novo-sps-page .sp-hc-thumbs {
	display: grid; grid-template-columns: repeat(5,1fr); gap: 10px;
	margin-bottom: 16px;
}
.novo-sps-page .sp-hc-thumb {
	background: #fff; border: 2px solid var(--novo-border,#EEF2F6);
	border-radius: 12px; aspect-ratio: 1;
	display: flex; align-items: center; justify-content: center;
	font-size: 18px; color: var(--novo-grey-tx,#7A90A0); cursor: pointer;
	box-shadow: 0 2px 8px rgba(11,57,84,.08);
	transition: border-color .2s, color .2s, background .2s, transform .2s, box-shadow .2s;
}
.novo-sps-page .sp-hc-thumb:hover,
.novo-sps-page .sp-hc-thumb.active {
	border-color: var(--novo-orange,#F56D0D); color: var(--novo-orange,#F56D0D);
	background: rgba(245,109,13,.06); transform: translateY(-2px);
	box-shadow: 0 6px 18px rgba(245,109,13,.18);
}
/* product gallery image in the card */
.novo-sps-page .sp-hc-img {
	width: 100%; height: 100%; object-fit: contain;
	position: absolute; inset: 0;
}

/* ════════════════════════════════════════════════════════
   SEARCH FLOAT CARD
════════════════════════════════════════════════════════ */
.novo-sps-page .sp-trust-wrap { background: var(--novo-grey-bg,#F7F8FA); padding: 0 0 56px; }
.novo-sps-page .sp-search-float-card {
	background: #fff; border-radius: 18px;
	box-shadow: 0 16px 56px rgba(11,57,84,.12);
	margin-top: -34px; position: relative; z-index: 10;
	overflow: hidden;
}
.novo-sps-page .sp-search-float-card::before {
	content: ''; position: absolute; top:0; left:0; right:0; height:3px;
	background: linear-gradient(90deg, var(--novo-orange,#F56D0D), var(--novo-orange-lite,#FFAB6E), var(--novo-orange,#F56D0D));
	border-radius: 18px 18px 0 0; pointer-events: none;
}
.novo-sps-page .sp-sfc-inner {
	display: flex; align-items: center; gap: 24px;
	padding: 18px 28px;
}
.novo-sps-page .sp-sfc-copy { flex-shrink: 0; }
.novo-sps-page .sp-sfc-copy strong { display: block; font-size: 13px; font-weight: 800; color: var(--novo-navy,#0B3954); line-height: 1.2; white-space: nowrap; }
.novo-sps-page .sp-sfc-copy span   { font-size: 11.5px; color: var(--novo-grey-tx,#7A90A0); white-space: nowrap; }
.novo-sps-page .sp-sfc-divider { width:1px; height:32px; background: var(--novo-border,#EEF2F6); flex-shrink: 0; }
.novo-sps-page .sp-sfc-form {
	display: flex; flex: 1;
	background: var(--novo-grey-bg,#F7F8FA);
	border: 1.5px solid var(--novo-border,#EEF2F6); border-radius: 10px; overflow: hidden;
	transition: border-color .2s;
}
.novo-sps-page .sp-sfc-form:focus-within { border-color: var(--novo-orange,#F56D0D); }
.novo-sps-page .sp-sfc-form input {
	flex: 1; padding: 10px 16px; background: transparent; border: none;
	outline: none; font-size: 13.5px; font-family: 'Inter',sans-serif; color: var(--novo-navy,#0B3954);
}
.novo-sps-page .sp-sfc-form input::placeholder { color: var(--novo-grey-tx,#7A90A0); }
.novo-sps-page .sp-sfc-form button {
	padding: 8px 20px; background: var(--novo-orange,#F56D0D); border: none; cursor: pointer;
	font-size: 12.5px; font-weight: 700; color: #fff; font-family: 'Inter',sans-serif;
	display: flex; align-items: center; gap: 7px; margin: 4px; border-radius: 8px;
	transition: background .2s; white-space: nowrap;
}
.novo-sps-page .sp-sfc-form button:hover { background: #e05f00; }

/* ════════════════════════════════════════════════════════
   PRODUCT BODY
════════════════════════════════════════════════════════ */
.novo-sps-page .sp-product-body { background: var(--novo-grey-bg,#F7F8FA); padding-bottom: 88px; }
.novo-sps-page .sp-product-grid {
	display: grid;
	grid-template-columns: 360px 1fr;
	gap: 40px;
	align-items: start;
}

/* ── Sticky summary panel ── */
.novo-sps-page .sp-summary-panel { position: sticky; top: 72px; }
.novo-sps-page .sp-summary-card {
	background: #fff; border-radius: 22px;
	border: 1px solid var(--novo-border,#EEF2F6);
	box-shadow: 0 8px 40px rgba(11,57,84,.10);
	overflow: hidden;
}
.novo-sps-page .sp-summary-card-head {
	padding: 24px 28px 20px;
	border-bottom: 1px solid var(--novo-border,#EEF2F6);
	background: linear-gradient(135deg, var(--novo-navy,#0B3954) 0%, #0d4a6b 100%);
	position: relative; overflow: hidden;
}
.novo-sps-page .sp-summary-card-head::after {
	content: ''; position: absolute; inset: 0;
	background: radial-gradient(ellipse at 90% 10%, rgba(245,109,13,.22) 0%, transparent 55%);
	pointer-events: none;
}
.novo-sps-page .sp-sc-head-badge {
	display: inline-flex; align-items: center; gap: 5px;
	background: rgba(245,109,13,.18); border: 1px solid rgba(245,109,13,.32);
	color: var(--novo-orange-lite,#FFAB6E); font-size: 9.5px; font-weight: 700;
	text-transform: uppercase; letter-spacing: 2px;
	padding: 4px 12px; border-radius: 20px; margin-bottom: 10px;
}
.novo-sps-page .sp-sc-head-partnum {
	font-size: 11px; font-weight: 700; font-family: 'Courier New',monospace;
	color: rgba(255,255,255,.35); letter-spacing: 2px;
	margin-bottom: 6px; position: relative; z-index: 1;
}
.novo-sps-page .sp-sc-head-title {
	font-size: 17px; font-weight: 900; color: #fff; line-height: 1.25;
	letter-spacing: -.5px; margin-bottom: 4px; position: relative; z-index: 1;
}
.novo-sps-page .sp-sc-head-sub {
	font-size: 12px; color: rgba(255,255,255,.45); position: relative; z-index: 1;
}
.novo-sps-page .sp-sc-avail {
	display: inline-flex; align-items: center; gap: 5px; margin-top: 10px;
	background: rgba(31,164,99,.20); border: 1px solid rgba(31,164,99,.30);
	color: #5de6a3; font-size: 11px; font-weight: 700;
	padding: 4px 12px; border-radius: 20px; position: relative; z-index: 1;
}
.novo-sps-page .sp-sc-avail::before { content:''; width:6px; height:6px; background:#5de6a3; border-radius:50%; animation:blink 1.6s ease infinite; }
.novo-sps-page .sp-sc-avail.incoming { background:rgba(245,109,13,.20); border-color:rgba(245,109,13,.30); color:var(--novo-orange-lite,#FFAB6E); }
.novo-sps-page .sp-sc-avail.incoming::before { background:var(--novo-orange-lite,#FFAB6E); }
.novo-sps-page .sp-sc-avail.reserved,
.novo-sps-page .sp-sc-avail.sold { background:rgba(122,144,160,.18); border-color:rgba(122,144,160,.28); color:rgba(255,255,255,.55); }
.novo-sps-page .sp-sc-avail.reserved::before,
.novo-sps-page .sp-sc-avail.sold::before { background:rgba(255,255,255,.55); }

.novo-sps-page .sp-sc-body { padding: 0; }
.novo-sps-page .sp-sc-spec-table { width: 100%; border-collapse: collapse; }
.novo-sps-page .sp-sc-spec-table tr { transition: background .2s; }
.novo-sps-page .sp-sc-spec-table tr:hover { background: rgba(245,109,13,.03); }
.novo-sps-page .sp-sc-spec-table tr:last-child td { border-bottom: none; }
.novo-sps-page .sp-sc-spec-table td {
	padding: 11px 22px; font-size: 13px;
	border-bottom: 1px solid var(--novo-border,#EEF2F6); vertical-align: middle;
}
.novo-sps-page .sp-sc-spec-table td:first-child { color: var(--novo-grey-tx,#7A90A0); font-weight: 600; width: 46%; }
.novo-sps-page .sp-sc-spec-table td:last-child  { color: var(--novo-navy,#0B3954); font-weight: 700; }
.novo-sps-page .sp-sc-spec-table td.sp-good { color: var(--novo-green,#1fa463) !important; font-weight: 700 !important; }
.novo-sps-page .sp-sc-spec-table td.sp-mono { font-family: 'Courier New',monospace; font-size: 12px !important; }

.novo-sps-page .sp-sc-cta {
	padding: 20px 22px; border-top: 1px solid var(--novo-border,#EEF2F6);
	display: flex; flex-direction: column; gap: 10px;
}

.novo-sps-page .sp-sc-team {
	padding: 16px 22px; border-top: 1px solid var(--novo-border,#EEF2F6);
	display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
.novo-sps-page .sp-sc-avatars { display: flex; }
.novo-sps-page .sp-sc-avatar {
	width: 34px; height: 34px; border-radius: 50%;
	background: linear-gradient(135deg, var(--novo-navy,#0B3954) 0%, #0d4a6b 100%);
	border: 2px solid #fff; margin-left: -7px;
	display: flex; align-items: center; justify-content: center;
	font-size: 10px; font-weight: 800; color: #fff; flex-shrink: 0; overflow: hidden;
	box-shadow: 0 2px 6px rgba(11,57,84,.20);
}
.novo-sps-page .sp-sc-avatars .sp-sc-avatar:first-child { margin-left: 0; }
.novo-sps-page .sp-sc-avatar img { width:100%; height:100%; object-fit:cover; border-radius:50%; }
.novo-sps-page .sp-sc-team-copy strong { font-size:12.5px; font-weight:800; color:var(--novo-navy,#0B3954); display:block; }
.novo-sps-page .sp-sc-team-copy span   { font-size:11.5px; color:var(--novo-grey-tx,#7A90A0); }
.novo-sps-page .sp-sc-resp { margin-left: auto; text-align: right; }
.novo-sps-page .sp-sc-resp strong { font-size:11.5px; font-weight:700; color:var(--novo-green,#1fa463); display:block; }
.novo-sps-page .sp-sc-resp span   { font-size:11px; color:var(--novo-grey-tx,#7A90A0); }

.novo-sps-page .sp-sc-trust {
	display: flex; flex-direction: column; gap: 9px;
	padding: 16px 22px; border-top: 1px solid var(--novo-border,#EEF2F6);
}
.novo-sps-page .sp-sc-trust-item {
	display: flex; align-items: center; gap: 9px;
	font-size: 12px; font-weight: 600; color: var(--novo-grey-tx,#7A90A0);
}
.novo-sps-page .sp-sc-trust-item i { color: var(--novo-orange,#F56D0D); font-size: 12px; width: 14px; text-align: center; flex-shrink: 0; }

.novo-sps-page .sp-sc-search-wrap {
	padding: 16px 22px; border-top: 1px solid var(--novo-border,#EEF2F6);
}
.novo-sps-page .sp-sc-search-label {
	font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px;
	color: var(--novo-grey-tx,#7A90A0); margin-bottom: 10px; display: block;
}
.novo-sps-page .sp-sc-search {
	display: flex; align-items: center; gap: 8px;
	background: var(--novo-grey-bg,#F7F8FA); border: 1.5px solid var(--novo-border,#EEF2F6);
	border-radius: 10px; padding: 9px 12px; transition: border-color .2s;
}
.novo-sps-page .sp-sc-search:focus-within { border-color: var(--novo-orange,#F56D0D); }
.novo-sps-page .sp-sc-search i { color: var(--novo-grey-tx,#7A90A0); font-size: 12px; flex-shrink: 0; }
.novo-sps-page .sp-sc-search input {
	flex: 1; border: none; background: transparent; outline: none;
	font-size: 13px; font-family: 'Inter',sans-serif; color: var(--novo-navy,#0B3954);
}
.novo-sps-page .sp-sc-search input::placeholder { color: var(--novo-grey-tx,#7A90A0); }

/* ── Detail area ── */
.novo-sps-page .sp-detail-area { min-width: 0; }
.novo-sps-page .sp-s-eyebrow {
	font-size: 10.5px; font-weight: 700; letter-spacing: 3.5px;
	text-transform: uppercase; color: var(--novo-orange,#F56D0D); margin-bottom: 8px; display: block;
}
.novo-sps-page .sp-s-title {
	font-size: clamp(22px, 3vw, 30px); font-weight: 900; color: var(--novo-navy,#0B3954);
	letter-spacing: -1px; line-height: 1.1; margin-bottom: 6px;
}
.novo-sps-page .sp-s-title span { color: var(--novo-orange,#F56D0D); }
.novo-sps-page .sp-s-divider {
	display: block; width: 44px; height: 4px; border-radius: 2px;
	background: linear-gradient(90deg, var(--novo-orange,#F56D0D), rgba(245,109,13,.20));
	margin-bottom: 28px;
}

/* ── Tabs ── */
.novo-sps-page .sp-tabs-wrap {
	background: #fff; border-radius: 20px; border: 1px solid var(--novo-border,#EEF2F6);
	box-shadow: 0 4px 24px rgba(11,57,84,.10); overflow: hidden; margin-bottom: 28px;
}
.novo-sps-page .sp-tabs-nav { display: flex; border-bottom: 1px solid var(--novo-border,#EEF2F6); }
.novo-sps-page .sp-tab-btn {
	flex: 1; padding: 16px 24px; font-size: 13.5px; font-weight: 700;
	color: var(--novo-grey-tx,#7A90A0); background: transparent; border: none; cursor: pointer;
	font-family: 'Inter',sans-serif; border-bottom: 3px solid transparent;
	transition: color .2s, border-color .2s, background .2s;
}
.novo-sps-page .sp-tab-btn.active {
	color: var(--novo-navy,#0B3954); border-bottom-color: var(--novo-orange,#F56D0D);
	background: rgba(245,109,13,.03);
}
.novo-sps-page .sp-tab-btn:hover:not(.active) { color: var(--novo-navy,#0B3954); background: var(--novo-grey-bg,#F7F8FA); }
.novo-sps-page .sp-tab-pane { display: none; padding: 32px 36px; }
.novo-sps-page .sp-tab-pane.active { display: block; }
.novo-sps-page .sp-tab-pane p { font-size: 15px; color: var(--novo-grey-tx,#7A90A0); line-height: 1.90; margin-bottom: 16px; }
.novo-sps-page .sp-tab-pane p:last-child { margin-bottom: 0; }

/* ── Compat table ── */
.novo-sps-page .sp-compat-wrap { margin-top: 28px; }
.novo-sps-page .sp-compat-title {
	font-size: 16px; font-weight: 900; color: var(--novo-navy,#0B3954);
	display: flex; align-items: center; gap: 8px; margin-bottom: 14px;
}
.novo-sps-page .sp-compat-title i { color: var(--novo-green,#1fa463); }
.novo-sps-page .sp-compat-table {
	width: 100%; border-collapse: collapse;
	background: #fff; border-radius: 14px; overflow: hidden;
	box-shadow: 0 4px 20px rgba(11,57,84,.08); border: 1px solid var(--novo-border,#EEF2F6);
}
.novo-sps-page .sp-compat-table th {
	background: var(--novo-navy,#0B3954); color: rgba(255,255,255,.80);
	font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px;
	padding: 12px 18px; text-align: left;
}
.novo-sps-page .sp-compat-table td {
	padding: 11px 18px; font-size: 13.5px; font-weight: 600;
	border-bottom: 1px solid var(--novo-border,#EEF2F6); color: var(--novo-navy,#0B3954);
}
.novo-sps-page .sp-compat-table tr:last-child td { border-bottom: none; }
.novo-sps-page .sp-compat-table tr:hover td { background: rgba(245,109,13,.03); }
.novo-sps-page .sp-compat-verified {
	display: inline-flex; align-items: center; gap: 5px;
	color: var(--novo-green,#1fa463); font-size: 12px; font-weight: 700;
}

/* ════════════════════════════════════════════════════════
   QA / ENQUIRY SECTION
════════════════════════════════════════════════════════ */
.novo-sps-page .sp-qa-section {
	background: #071F2E; padding: 88px 0;
	position: relative; overflow: hidden;
}
.novo-sps-page .sp-qa-section::before {
	content: ''; position: absolute; inset: 0; pointer-events: none;
	background: radial-gradient(ellipse at 72% 50%, rgba(245,109,13,.18) 0%, transparent 55%);
}
.novo-sps-page .sp-qa-inner {
	position: relative; z-index: 1;
	display: grid; grid-template-columns: 1fr 420px; gap: 64px; align-items: center;
}
.novo-sps-page .sp-qa-eyebrow { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:3px; color:var(--novo-orange-lite,#FFAB6E); margin-bottom:10px; }
.novo-sps-page .sp-qa-title { font-size:clamp(26px,3.5vw,36px); font-weight:900; color:#fff; line-height:1.15; letter-spacing:-.8px; margin-bottom:14px; }
.novo-sps-page .sp-qa-title span { color:var(--novo-orange,#F56D0D); }
.novo-sps-page .sp-qa-sub { font-size:15px; color:rgba(255,255,255,.50); line-height:1.80; }
.novo-sps-page .sp-qa-features { display:flex; flex-direction:column; gap:10px; margin-top:24px; }
.novo-sps-page .sp-qa-feat { display:flex; align-items:center; gap:9px; font-size:13px; font-weight:600; color:rgba(255,255,255,.58); }
.novo-sps-page .sp-qa-feat i { color:var(--novo-orange,#F56D0D); font-size:12px; width:14px; }

.novo-sps-page .sp-qa-card {
	background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.10);
	border-radius: 22px; padding: 30px; backdrop-filter: blur(10px);
}
.novo-sps-page .sp-qa-card-title { font-size:14px; font-weight:800; color:#fff; display:flex; align-items:center; gap:8px; margin-bottom:20px; }
.novo-sps-page .sp-qa-card-title i { color:var(--novo-orange-lite,#FFAB6E); }
.novo-sps-page .sp-qf-label { display:block; font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:1.2px; color:rgba(255,255,255,.40); margin-bottom:5px; }
.novo-sps-page .sp-qf-input {
	width:100%; padding:11px 14px; margin-bottom:12px;
	background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14);
	border-radius:10px; font-size:13.5px; font-family:'Inter',sans-serif; color:#fff;
	outline:none; transition:border-color .2s, background .2s;
}
.novo-sps-page .sp-qf-input::placeholder { color:rgba(255,255,255,.28); }
.novo-sps-page .sp-qf-input:focus { border-color:var(--novo-orange,#F56D0D); background:rgba(255,255,255,.10); }
.novo-sps-page .sp-qf-select {
	width:100%; padding:11px 14px; margin-bottom:12px;
	background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14);
	border-radius:10px; font-size:13.5px; font-family:'Inter',sans-serif; color:rgba(255,255,255,.70);
	outline:none; transition:border-color .2s; appearance:none; cursor:pointer;
}
.novo-sps-page .sp-qf-select:focus { border-color:var(--novo-orange,#F56D0D); }
.novo-sps-page .sp-qa-consent { font-size:11px; color:rgba(255,255,255,.38); display:flex; align-items:flex-start; gap:7px; margin-bottom:14px; line-height:1.55; }
.novo-sps-page .sp-qa-consent input { accent-color:var(--novo-orange,#F56D0D); flex-shrink:0; margin-top:2px; }
.novo-sps-page .sp-qa-consent a { color:var(--novo-orange-lite,#FFAB6E); text-decoration:underline; }
.novo-sps-page .sp-qa-success { display:none; text-align:center; padding:18px 0; }
.novo-sps-page .sp-qa-success i { font-size:28px; color:#5de6a3; display:block; margin-bottom:8px; }
.novo-sps-page .sp-qa-success strong { color:#fff; font-size:14px; display:block; margin-bottom:4px; }
.novo-sps-page .sp-qa-success span   { color:rgba(255,255,255,.42); font-size:12px; }
/* CF7 override inside QA card */
.novo-sps-page .sp-qa-card .wpcf7-form input:not([type=submit]),
.novo-sps-page .sp-qa-card .wpcf7-form select,
.novo-sps-page .sp-qa-card .wpcf7-form textarea { width:100%; }
.novo-sps-page .sp-qa-card .wpcf7-form input[type=submit] { margin-top:8px; width:100%; border-radius:10px; }

/* ════════════════════════════════════════════════════════
   RELATED PARTS
════════════════════════════════════════════════════════ */
.novo-sps-page .sp-related-section { background: #fff; padding: 88px 0; }
.novo-sps-page .sp-related-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.novo-sps-page .sp-r-card {
	background: #fff; border-radius: 20px; overflow: hidden;
	border: 1px solid var(--novo-border,#EEF2F6); box-shadow: 0 4px 24px rgba(11,57,84,.10);
	display: flex; flex-direction: column;
	transition: transform .30s cubic-bezier(.22,.68,0,1.2), box-shadow .30s, border-color .30s;
	cursor: pointer;
	text-decoration: none; color: inherit;
}
.novo-sps-page .sp-r-card:hover { transform:translateY(-7px); box-shadow:0 24px 64px rgba(11,57,84,.14); border-color:rgba(245,109,13,.28); color: inherit; }
.novo-sps-page .sp-r-img {
	background: linear-gradient(135deg, var(--novo-navy,#0B3954) 0%, #0d4a6b 100%);
	aspect-ratio: 16/10; display: flex; align-items: center; justify-content: center;
	font-size: 42px; color: rgba(255,255,255,.55); position: relative; overflow: hidden;
}
.novo-sps-page .sp-r-img::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 75% 22%,rgba(245,109,13,.20) 0%,transparent 55%); }
.novo-sps-page .sp-r-img i { position:relative; z-index:1; transition:transform .3s; }
.novo-sps-page .sp-r-card:hover .sp-r-img i { transform:scale(1.12); }
.novo-sps-page .sp-r-cat  { position:absolute; top:10px; left:10px; z-index:2; background:rgba(255,255,255,.10); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.15); color:rgba(255,255,255,.80); font-size:9.5px; font-weight:700; text-transform:uppercase; letter-spacing:1.5px; padding:3px 9px; border-radius:10px; }
.novo-sps-page .sp-r-stock { position:absolute; bottom:10px; left:10px; z-index:2; background:var(--novo-green,#1fa463); color:#fff; font-size:10px; font-weight:700; padding:3px 9px; border-radius:12px; }
.novo-sps-page .sp-r-stock.incoming { background:var(--novo-orange,#F56D0D); }
.novo-sps-page .sp-r-partnum { position:absolute; bottom:10px; right:10px; z-index:2; background:rgba(0,0,0,.35); color:rgba(255,255,255,.70); font-size:9.5px; font-weight:700; font-family:'Courier New',monospace; padding:3px 9px; border-radius:8px; letter-spacing:1px; }
.novo-sps-page .sp-r-body  { padding:20px; flex:1; display:flex; flex-direction:column; }
.novo-sps-page .sp-r-brand { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:2px; color:var(--novo-orange,#F56D0D); margin-bottom:4px; }
.novo-sps-page .sp-r-name  { font-size:15px; font-weight:800; color:var(--novo-navy,#0B3954); margin-bottom:9px; letter-spacing:-.3px; line-height:1.2; }
.novo-sps-page .sp-r-chips { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px; }
.novo-sps-page .sp-r-chip  { font-size:11px; font-weight:600; color:var(--novo-grey-tx,#7A90A0); background:var(--novo-grey-bg,#F7F8FA); border:1px solid var(--novo-border,#EEF2F6); border-radius:10px; padding:3px 9px; }
.novo-sps-page .sp-r-foot  { margin-top:auto; padding-top:14px; border-top:1px solid var(--novo-border,#EEF2F6); display:flex; align-items:center; justify-content:space-between; gap:10px; }
.novo-sps-page .sp-r-avail { font-size:12px; font-weight:700; color:var(--novo-green,#1fa463); display:flex; align-items:center; gap:5px; }
.novo-sps-page .sp-r-avail::before { content:''; width:6px; height:6px; background:var(--novo-green,#1fa463); border-radius:50%; }

/* ════════════════════════════════════════════════════════
   CTA SECTION
════════════════════════════════════════════════════════ */
.novo-sps-page .sp-cta-section {
	background: var(--novo-navy,#0B3954); padding: 100px 0; text-align: center;
	position: relative; overflow: hidden;
}
.novo-sps-page .sp-cta-section::before {
	content: ''; position: absolute; inset: 0; pointer-events: none;
	background: radial-gradient(ellipse at 50% 140%, rgba(245,109,13,.25) 0%, transparent 55%);
}
.novo-sps-page .sp-cta-section::after {
	content: ''; position: absolute; width:700px; height:700px;
	border: 1px solid rgba(245,109,13,.06); border-radius: 50%;
	top:50%; left:50%; transform:translate(-50%,-50%); pointer-events: none;
}
.novo-sps-page .sp-cta-inner { position: relative; z-index: 1; }
.novo-sps-page .sp-cta-badge {
	display: inline-flex; align-items: center; gap: 7px;
	background: rgba(245,109,13,.14); border: 1px solid rgba(245,109,13,.28);
	color: var(--novo-orange-lite,#FFAB6E); font-size: 10px; font-weight: 700;
	text-transform: uppercase; letter-spacing: 2.5px;
	padding: 6px 16px; border-radius: 20px; margin-bottom: 24px;
}
.novo-sps-page .sp-cta-headline { font-size:clamp(30px,5vw,50px); font-weight:900; color:#fff; line-height:1.08; letter-spacing:-1.5px; margin-bottom:16px; }
.novo-sps-page .sp-cta-headline span { color:var(--novo-orange,#F56D0D); }
.novo-sps-page .sp-cta-sub { font-size:17px; color:rgba(255,255,255,.50); max-width:520px; margin:0 auto 40px; line-height:1.80; }
.novo-sps-page .sp-cta-btns { display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }


/* ════════════════════════════════════════════════════════
   RESPONSIVE
════════════════════════════════════════════════════════ */
@media (max-width: 1100px) {
	.novo-sps-page .sp-hero-layout    { grid-template-columns: 1fr; gap: 48px; }
	.novo-sps-page .sp-product-grid   { grid-template-columns: 1fr; }
	.novo-sps-page .sp-summary-panel  { position: static; }
	.novo-sps-page .sp-qa-inner       { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
	.novo-sps-page .sp-related-grid   { grid-template-columns: 1fr; }
	.novo-sps-page .sp-hc-thumbs      { grid-template-columns: repeat(4,1fr); }
	.novo-sps-page .sp-sfc-inner      { flex-wrap: wrap; }
	.novo-sps-page .sp-sfc-divider    { display: none; }
	.novo-sps-page .sp-sc-resp        { display: none; }
	/* Breadcrumb action buttons hidden on mobile — matches source HTML shared.css */
	.novo-sps-page .sp-bc-actions     { display: none; }
}

/* ════════════════════════════════════════════════════════
   BREADCRUMB BAR
════════════════════════════════════════════════════════ */
.novo-sps-page .sp-bc-bar {
	position: absolute;
	top: calc(var(--novo-topbar-h, 36px) + var(--novo-hdr-h, 72px));
	left: 0;
	right: 0;
	background: transparent;
	padding: 12px 0;
	z-index: 10;
}
.novo-sps-page .sp-bc-inner {
	display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.novo-sps-page .sp-bc {
	display: flex; align-items: center; gap: 7px;
	font-size: 12.5px; color: rgba(255,255,255,.38); flex-wrap: wrap;
}
.novo-sps-page .sp-bc a { color: rgba(255,255,255,.38); transition: color .2s; text-decoration: none; }
.novo-sps-page .sp-bc a:hover { color: var(--novo-orange,#F56D0D); }
.novo-sps-page .sp-bc-sep { font-size: 8px; color: rgba(255,255,255,.18); }
.novo-sps-page .sp-bc-current { color: rgba(255,255,255,.80); font-weight: 600; }
.novo-sps-page .sp-bc-actions { display: flex; gap: 8px; }
.novo-sps-page .sp-bc-btn {
	display: inline-flex; align-items: center; gap: 5px;
	font-size: 11.5px; font-weight: 600; color: rgba(255,255,255,.45);
	background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.10);
	border-radius: 20px; padding: 5px 13px; cursor: pointer; text-decoration: none;
	transition: color .2s, border-color .2s;
}
.novo-sps-page .sp-bc-btn:hover { color: var(--novo-orange,#F56D0D); border-color: rgba(245,109,13,.35); }

/* ── Summary panel supplementary ───────────────────────────── */
.novo-sps-page .sp-sc-avatars {
	display: flex;
}
.novo-sps-page .sp-sc-avatar {
	width: 34px; height: 34px; border-radius: 50%;
	background: linear-gradient(135deg, var(--novo-navy,#0B3954) 0%, #0d4a6b 100%);
	border: 2px solid #fff; margin-left: -7px;
	display: flex; align-items: center; justify-content: center;
	font-size: 10px; font-weight: 800; color: #fff; flex-shrink: 0; overflow: hidden;
	box-shadow: 0 2px 6px rgba(11,57,84,.20);
}
.novo-sps-page .sp-sc-avatars .sp-sc-avatar:first-child { margin-left: 0; }
.novo-sps-page .sp-sc-resp { text-align: right; margin-left: auto; }
.novo-sps-page .sp-sc-resp strong { font-size: 11.5px; font-weight: 700; color: var(--novo-green,#1fa463); display: block; }
.novo-sps-page .sp-sc-resp span   { font-size: 11px; color: var(--novo-grey-tx,#7A90A0); }

/* ── Detail section headings ─────────────────────────────────── */
.novo-sps-page .sp-s-title span { color: var(--novo-orange,#F56D0D); }

/* ── Compat table ok cell ────────────────────────────────────── */
.novo-sps-page .sp-compat-ok { color: var(--novo-green,#1fa463) !important; font-weight: 700 !important; }

/* ── qa section ─────────────────────────────────────────────── */
.novo-sps-page .sp-qa-eyebrow {
	font-size: 10.5px; font-weight: 700; text-transform: uppercase;
	letter-spacing: 3px; color: var(--novo-orange-lite,#FFAB6E); margin-bottom: 10px;
}
.novo-sps-page .sp-qa-title {
	font-size: clamp(26px, 3.5vw, 36px); font-weight: 900;
	color: #fff; line-height: 1.15; letter-spacing: -.8px; margin-bottom: 14px;
}
.novo-sps-page .sp-qa-title span { color: var(--novo-orange,#F56D0D); }
.novo-sps-page .sp-qa-sub { font-size: 15px; color: rgba(255,255,255,.50); line-height: 1.80; }
.novo-sps-page .sp-qa-features { display: flex; flex-direction: column; gap: 10px; margin-top: 24px; }
.novo-sps-page .sp-qa-feat {
	display: flex; align-items: center; gap: 9px;
	font-size: 13px; font-weight: 600; color: rgba(255,255,255,.58);
}
.novo-sps-page .sp-qa-feat i { color: var(--novo-orange,#F56D0D); font-size: 12px; width: 14px; }