/**
 * Equipment Page
 *
 * @package Cypros_Core
 */

/* ==========================================================
   PAGE HERO
========================================================== */

.cy-page-hero {
	padding: clamp(2.75rem, 4vw, 4rem) 0 clamp(3rem, 4.5vw, 4.5rem);
	background: var(--cypros-white);
	border-bottom: 1px solid var(--cypros-color-border);
}

.cy-page-hero__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--cypros-black);
}

.cy-page-hero__top p,
.cy-page-hero__top span {
	margin: 0;
	color: var(--cypros-black);
	font-size: var(--cypros-font-size-xs);
	font-weight: var(--cypros-font-weight-bold);
	line-height: 1;
	letter-spacing: var(--cypros-letter-spacing-wide);
	text-transform: uppercase;
}

.cy-page-hero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(20rem, 0.92fr);
	align-items: center;
	gap: clamp(3rem, 6vw, 6rem);
	padding-top: clamp(2.25rem, 3.5vw, 3.5rem);
}

.cy-page-hero__headline h1 {
	max-width: 11ch;
	margin: 0;
	color: var(--cypros-black);
	font-size: clamp(3.4rem, 5.4vw, 5.6rem);
	font-weight: var(--cypros-font-weight-black);
	line-height: 0.9;
	letter-spacing: -0.058em;
	text-transform: uppercase;
}

.cy-page-hero__headline h1 span {
	display: block;
	color: transparent;
	-webkit-text-stroke: 2px var(--cypros-black);
}

.cy-page-hero__content {
	max-width: 33rem;
	padding-bottom: 0.2rem;
}

.cy-page-hero__content p {
	margin: 0;
	color: var(--cypros-graphite);
	font-size: clamp(0.95rem, 1.1vw, 1.05rem);
	line-height: 1.68;
}

.cy-page-hero__content a {
	display: inline-flex;
	align-items: center;
	gap: 0.7rem;
	margin-top: 1.5rem;
	padding-bottom: 0.3rem;
	color: var(--cypros-black);
	border-bottom: 1px solid var(--cypros-black);
	font-size: 0.7rem;
	font-weight: var(--cypros-font-weight-black);
	letter-spacing: 0.1em;
	text-decoration: none;
	text-transform: uppercase;
	transition:
			color var(--cypros-transition-fast),
			border-color var(--cypros-transition-fast);
}

.cy-page-hero__content a:hover,
.cy-page-hero__content a:focus-visible {
	color: var(--cypros-yellow-dark);
	border-color: var(--cypros-yellow-dark);
}

/* ==========================================================
EQUIPMENT INTRO
========================================================== */

.cy-equipment-page {
	padding: clamp(3.5rem, 5vw, 5rem) 0;
	background: var(--cypros-white);
}

.cy-equipment-page__intro {
	display: grid;
	grid-template-columns: minmax(12rem, 0.34fr) minmax(0, 1.66fr);
	align-items: end;
	gap: clamp(2rem, 4vw, 4rem);
	padding-bottom: clamp(1.75rem, 2.5vw, 2.5rem);
}

.cy-equipment-page__eyebrow {
	margin: 0;
	color: var(--cypros-gray-700);
	font-size: var(--cypros-font-size-xs);
	font-weight: var(--cypros-font-weight-bold);
	letter-spacing: var(--cypros-letter-spacing-wide);
	text-transform: uppercase;
}

.cy-equipment-page__intro h2 {
	max-width: 13ch;
	margin: 0;
	color: var(--cypros-black);
	font-size: clamp(2.7rem, 4vw, 4.25rem);
	font-weight: var(--cypros-font-weight-black);
	line-height: 0.95;
	letter-spacing: -0.05em;
}

.cy-equipment-page__intro h2 span {
	display: block;
	color: var(--cypros-gray-600);
}

/* ==========================================================
EQUIPMENT FILTERS
========================================================== */

.cy-equipment-filters {
	display: grid;
	grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
	gap: 2rem 4rem;
	margin-bottom: 2rem;
	padding: 1.5rem 0 2rem;
	border-top: 1px solid var(--cypros-black);
	border-bottom: 1px solid var(--cypros-color-border);
}

.cy-equipment-filters__intro h2 {
	max-width: 16ch;
	margin: 0.4rem 0 0.6rem;
	font-size: clamp(1.7rem, 2.5vw, 2.6rem);
	font-weight: var(--cypros-font-weight-black);
	line-height: 0.98;
	letter-spacing: -0.04em;
}

.cy-equipment-filters__intro > p:last-child {
	max-width: 38rem;
	margin: 0;
	color: var(--cypros-gray-600);
	line-height: 1.6;
}

.cy-equipment-filters__controls {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) repeat(2, minmax(0, 1fr));
	align-items: end;
	gap: 0.75rem;
}

.cy-equipment-filter {
	display: grid;
	gap: 0.45rem;
}

.cy-equipment-filter span {
	color: var(--cypros-gray-700);
	font-size: 0.65rem;
	font-weight: var(--cypros-font-weight-black);
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.cy-equipment-filter input,
.cy-equipment-filter select {
	width: 100%;
	min-width: 0;
	min-height: 3.1rem;
	padding: 0 0.85rem;
	color: var(--cypros-black);
	background: var(--cypros-white);
	border: 1px solid var(--cypros-color-border);
	border-radius: 0;
	font: inherit;
}

.cy-equipment-filter input:focus,
.cy-equipment-filter select:focus {
	border-color: var(--cypros-black);
	outline: 2px solid var(--cypros-yellow);
	outline-offset: 1px;
}

.cy-equipment-filters__reset {
	grid-column: 1 / -1;
	justify-self: start;
	padding: 0.65rem 0;
	color: var(--cypros-black);
	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--cypros-black);
	font-size: 0.65rem;
	font-weight: var(--cypros-font-weight-black);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	cursor: pointer;
}

.cy-equipment-filters__status {
	grid-column: 1 / -1;
	margin: 0;
	color: var(--cypros-gray-600);
	font-size: 0.7rem;
	font-weight: var(--cypros-font-weight-bold);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* ==========================================================
EQUIPMENT SELECTOR
========================================================== */

.cy-equipment-selector {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: 0 0 clamp(1.75rem, 2.5vw, 2.5rem);
	border-top: 1px solid var(--cypros-black);
	border-left: 1px solid var(--cypros-color-border);
	border-bottom: 1px solid var(--cypros-color-border);
}

.cy-equipment-selector__item {
	position: relative;
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-rows: auto auto;
	gap: 0.55rem 0.85rem;
	min-height: 7rem;
	padding: 1.15rem 1.25rem;
	color: var(--cypros-black);
	background: var(--cypros-white);
	border: 0;
	border-right: 1px solid var(--cypros-color-border);
	text-align: left;
	cursor: pointer;
	appearance: none;
	transition:
			background-color var(--cypros-transition-fast),
			color var(--cypros-transition-fast);
}

.cy-equipment-selector__item::after {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: 0.25rem;
	background: var(--cypros-yellow);
	content: "";
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform var(--cypros-transition-fast);
}

.cy-equipment-selector__item:hover,
.cy-equipment-selector__item:focus-visible {
	background: var(--cypros-gray-100);
	outline: none;
}

.cy-equipment-selector__item.is-active {
	color: var(--cypros-white);
	background: var(--cypros-black);
}

.cy-equipment-selector__item.is-active::after {
	transform: scaleX(1);
}

.cy-equipment-selector__number {
	grid-row: 1 / span 2;
	padding-top: 0.1rem;
	color: var(--cypros-gray-500);
	font-size: 0.68rem;
	font-weight: var(--cypros-font-weight-bold);
	line-height: 1;
	letter-spacing: 0.16em;
}

.cy-equipment-selector__item.is-active .cy-equipment-selector__number {
	color: var(--cypros-yellow);
}

.cy-equipment-selector__name {
	align-self: end;
	font-size: clamp(1.25rem, 1.7vw, 1.75rem);
	font-weight: var(--cypros-font-weight-black);
	line-height: 1;
	letter-spacing: -0.035em;
}

.cy-equipment-selector__count {
	align-self: start;
	color: var(--cypros-gray-600);
	font-size: 0.68rem;
	font-weight: var(--cypros-font-weight-bold);
	line-height: 1.3;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.cy-equipment-selector__item.is-active .cy-equipment-selector__count {
	color: rgba(255, 255, 255, 0.58);
}


/* ==========================================================
ACTIVE RANGE PANEL
========================================================== */

.cy-equipment-panels {
	min-width: 0;
}

.cy-equipment-panel[hidden] {
	display: none !important;
}

.cy-equipment-panel {
	animation: cy-equipment-panel-in 220ms ease both;
}

@keyframes cy-equipment-panel-in {
	from {
			opacity: 0;
			transform: translateY(0.5rem);
	}

	to {
			opacity: 1;
			transform: translateY(0);
	}
}

.cy-equipment-panel__overview {
	display: grid;
	grid-template-columns: minmax(18rem, 0.82fr) minmax(0, 1.18fr);
	align-items: center;
	gap: clamp(2.5rem, 5vw, 5rem);
	padding: clamp(1.75rem, 2.5vw, 2.5rem) 0;
	border-top: 1px solid var(--cypros-black);
	border-bottom: 1px solid var(--cypros-color-border);
}

.cy-equipment-panel__identity {
	display: grid;
	grid-template-columns: 3rem minmax(0, 1fr);
	gap: 1rem;
}

.cy-equipment-panel__number {
	padding-top: 0.45rem;
	color: var(--cypros-gray-500);
	font-size: 0.7rem;
	font-weight: var(--cypros-font-weight-bold);
	line-height: 1;
	letter-spacing: 0.16em;
}

.cy-equipment-panel__identity p {
	margin: 0 0 1.25rem;
	color: var(--cypros-gray-700);
	font-size: 0.72rem;
	font-weight: var(--cypros-font-weight-bold);
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.cy-equipment-panel__power {
	display: flex;
	align-items: flex-end;
	flex-wrap: wrap;
	gap: 0.2rem 0.4rem;
	margin: 0;
	color: var(--cypros-black);
	font-size: clamp(3rem, 4.5vw, 4.6rem);
	font-weight: var(--cypros-font-weight-black);
	line-height: 0.88;
	letter-spacing: -0.055em;
}

.cy-equipment-panel__power small {
	padding-bottom: 0.45rem;
	color: var(--cypros-gray-600);
	font-size: 0.72rem;
	font-weight: var(--cypros-font-weight-bold);
	line-height: 1;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.cy-equipment-panel__description {
	max-width: 38rem;
}

.cy-equipment-panel__description > p {
	margin: 0;
	color: var(--cypros-graphite);
	font-size: 1rem;
	line-height: 1.7;
}

.cy-equipment-panel__description ul {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.55rem 1.25rem;
	margin: 1.35rem 0 0;
	padding: 0;
	list-style: none;
}

.cy-equipment-panel__description li {
	position: relative;
	padding-left: 1.15rem;
	color: var(--cypros-gray-700);
	font-size: 0.8rem;
	font-weight: var(--cypros-font-weight-bold);
	line-height: 1.4;
}

.cy-equipment-panel__description li::before {
	position: absolute;
	top: 0.5em;
	left: 0;
	width: 0.35rem;
	height: 0.35rem;
	background: var(--cypros-yellow);
	content: "";
}


/* ==========================================================
EQUIPMENT CATALOG
========================================================== */

.cy-equipment-catalog {
	padding: clamp(1.5rem, 2vw, 2rem) 0 0;
}

.cy-equipment-catalog__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 0.75rem;
	padding-bottom: 0.7rem;
	border-bottom: 1px solid var(--cypros-color-border);
}

.cy-equipment-catalog__header > div {
	display: flex;
	align-items: baseline;
	gap: 0.8rem;
}

.cy-equipment-catalog__index {
	color: var(--cypros-gray-500);
	font-size: 0.7rem;
	font-weight: var(--cypros-font-weight-bold);
	letter-spacing: 0.16em;
}

.cy-equipment-catalog__header h3 {
	display: block;
	margin: 0;
	color: var(--cypros-black);
	font-size: clamp(1.15rem, 1.45vw, 1.5rem);
	font-weight: var(--cypros-font-weight-black);
	line-height: 1;
	letter-spacing: -0.03em;
}

.cy-equipment-catalog__header > p {
	margin: 0;
	color: var(--cypros-gray-600);
	font-size: 0.68rem;
	font-weight: var(--cypros-font-weight-bold);
	letter-spacing: 0.11em;
	text-transform: uppercase;
}

.cy-equipment-catalog__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1px;
	background: var(--cypros-color-border);
	border: 1px solid var(--cypros-color-border);
}

.cy-equipment-catalog__empty {
	grid-column: 1 / -1;
	margin: 0;
	padding: 2rem;
	color: var(--cypros-gray-600);
	background: var(--cypros-white);
}

.cy-equipment-catalog__more-wrap {
	display: flex;
	justify-content: center;
	padding: 1.25rem 0 0;
}

.cy-equipment-catalog__more {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.7rem;
	min-height: 3.2rem;
	padding: 0 1.35rem;
	color: var(--cypros-black);
	background: transparent;
	border: 1px solid var(--cypros-black);
	font-size: 0.68rem;
	font-weight: var(--cypros-font-weight-black);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	cursor: pointer;
	transition:
			color var(--cypros-transition-fast),
			background-color var(--cypros-transition-fast),
			transform var(--cypros-transition-fast);
}

.cy-equipment-catalog__more:hover,
.cy-equipment-catalog__more:focus-visible {
	color: var(--cypros-black);
	background: var(--cypros-yellow);
	outline: none;
	transform: translateY(-2px);
}

.cy-equipment-catalog__more-arrow {
	font-size: 0.95rem;
	line-height: 1;
}

/* ==========================================================
EQUIPMENT PAGE / COMPACT CARD DENSITY
========================================================== */

.cy-equipment-page .cy-equipment-card {
	min-height: 15.5rem;
	padding: 0.95rem 1.05rem 0.9rem;
}

.cy-equipment-page .cy-equipment-card__header {
	padding-bottom: 0.65rem;
}

.cy-equipment-page .cy-equipment-card__title {
	font-size: clamp(1.2rem, 1.5vw, 1.55rem);
}

.cy-equipment-page .cy-equipment-card__power {
	margin-top: 0.75rem;
}

.cy-equipment-page .cy-equipment-card__metric {
	gap: 0.2rem;
	padding: 0 0.65rem 0.7rem 0;
}

.cy-equipment-page .cy-equipment-card__metric + .cy-equipment-card__metric {
	padding-left: 0.75rem;
}

.cy-equipment-page .cy-equipment-card__metric strong {
	font-size: clamp(1.2rem, 1.5vw, 1.55rem);
}

.cy-equipment-page .cy-equipment-card__spec,
.cy-equipment-page .cy-equipment-card__specs > div {
	min-height: 2rem;
	padding: 0.4rem 0;
}

.cy-equipment-page .cy-equipment-card__footer {
	padding-top: 0.65rem;
}


/* ==========================================================
CONFIGURATIONS
========================================================== */

.cy-configurations {
	padding: clamp(3.75rem, 5vw, 5.25rem) 0;
	color: var(--cypros-white);
	background: var(--cypros-black);
}

.cy-configurations__header {
	padding-bottom: clamp(1.25rem, 1.5vw, 1.5rem);
}

.cy-configurations__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.22);
}

.cy-configurations__meta p,
.cy-configurations__meta span {
	margin: 0;
	font-size: var(--cypros-font-size-xs);
	font-weight: var(--cypros-font-weight-bold);
	line-height: 1;
	letter-spacing: var(--cypros-letter-spacing-wide);
	text-transform: uppercase;
}

.cy-configurations__meta span {
	color: rgba(255, 255, 255, 0.48);
}

.cy-configurations__intro {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(18rem, 0.85fr);
	align-items: center;
	gap: clamp(2.5rem, 5vw, 5rem);
	padding-top: clamp(1rem, 1.5vw, 1.5rem);
}

.cy-configurations__intro h2 {
	max-width: 12ch;
	margin: 0;
	font-size: clamp(2.75rem, 4vw, 4.25rem);
	font-weight: var(--cypros-font-weight-black);
	line-height: 0.95;
	letter-spacing: -0.05em;
}

.cy-configurations__intro h2 span {
	display: block;
	color: var(--cypros-yellow);
}

.cy-configurations__intro p {
	max-width: 31rem;
	margin: 0;
	color: rgba(255, 255, 255, 0.64);
	font-size: 1rem;
	line-height: 1.75;
}

.cy-configurations__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	border-top: 1px solid rgba(255, 255, 255, 0.24);
	border-left: 1px solid rgba(255, 255, 255, 0.16);
}

.cy-configurations__item {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 15rem;
	padding: clamp(1.4rem, 2vw, 2rem);
	border-right: 1px solid rgba(255, 255, 255, 0.16);
	border-bottom: 1px solid rgba(255, 255, 255, 0.16);
	overflow: hidden;
	transition:
			background-color var(--cypros-transition-base),
			color var(--cypros-transition-base);
}

.cy-configurations__item::before {
	position: absolute;
	inset: auto 0 0;
	height: 0.25rem;
	background: var(--cypros-yellow);
	content: "";
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform var(--cypros-transition-base);
}

.cy-configurations__item:hover {
	background: rgba(255, 255, 255, 0.035);
}

.cy-configurations__item:hover::before {
	transform: scaleX(1);
}

.cy-configurations__item--accent {
	color: var(--cypros-black);
	background: var(--cypros-yellow);
}

.cy-configurations__item--accent:hover {
	background: var(--cypros-yellow-dark);
}

.cy-configurations__item--accent::before {
	background: var(--cypros-white);
}

.cy-configurations__number {
	color: rgba(255, 255, 255, 0.38);
	font-size: 0.7rem;
	font-weight: var(--cypros-font-weight-bold);
	line-height: 1;
	letter-spacing: 0.16em;
}

.cy-configurations__item--accent .cy-configurations__number {
	color: rgba(17, 17, 17, 0.48);
}

.cy-configurations__item h3 {
	margin: auto 0 1rem;
	color: var(--cypros-white);
	font-size: clamp(1.8rem, 2.3vw, 2.45rem);
	font-weight: var(--cypros-font-weight-black);
	line-height: 0.96;
	letter-spacing: -0.04em;
}

.cy-configurations__item--accent h3 {
	color: var(--cypros-black);
}

.cy-configurations__item p {
	margin: 0;
	color: rgba(255, 255, 255, 0.62);
	font-size: 0.9rem;
	line-height: 1.65;
}

.cy-configurations__item--accent p {
	color: rgba(17, 17, 17, 0.7);
}

.cy-configurations__tag {
	display: inline-flex;
	align-self: flex-start;
	margin-top: 1.35rem;
	padding-top: 0.65rem;
	border-top: 1px solid rgba(255, 255, 255, 0.24);
	color: rgba(255, 255, 255, 0.58);
	font-size: 0.62rem;
	font-weight: var(--cypros-font-weight-bold);
	letter-spacing: 0.13em;
	text-transform: uppercase;
}

.cy-configurations__item--accent .cy-configurations__tag {
	color: rgba(17, 17, 17, 0.7);
	border-color: rgba(17, 17, 17, 0.24);
}

.cy-configurations__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 3rem;
	padding-top: 1.75rem;
}

.cy-configurations__footer p {
	max-width: 42rem;
	margin: 0;
	color: rgba(255, 255, 255, 0.52);
	font-size: 0.9rem;
	line-height: 1.6;
}

.cy-configurations__footer a {
	display: inline-flex;
	align-items: center;
	gap: 0.7rem;
	padding-bottom: 0.35rem;
	color: var(--cypros-white);
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	font-size: 0.7rem;
	font-weight: var(--cypros-font-weight-black);
	letter-spacing: 0.1em;
	text-decoration: none;
	text-transform: uppercase;
	white-space: nowrap;
	transition:
			color var(--cypros-transition-fast),
			border-color var(--cypros-transition-fast);
}

.cy-configurations__footer a span {
	display: inline-block;
	transition: transform var(--cypros-transition-fast);
}

.cy-configurations__footer a:hover,
.cy-configurations__footer a:focus-visible {
	color: var(--cypros-yellow);
	border-color: var(--cypros-yellow);
}

.cy-configurations__footer a:hover span,
.cy-configurations__footer a:focus-visible span {
	transform: translate(0.2rem, -0.2rem);
}

/* ==========================================================
EQUIPMENT CTA
========================================================== */

.cy-equipment-page__cta {
	padding: clamp(3.75rem, 5vw, 5.25rem) 0;
	color: var(--cypros-white);
	background: var(--cypros-black);
	border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.cy-equipment-page__cta-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(18rem, 0.85fr);
	align-items: center;
	gap: clamp(2.5rem, 5vw, 5rem);
}

.cy-equipment-page__cta h2 {
	max-width: 12ch;
	margin: 0;
	font-size: clamp(2.8rem, 4vw, 4.4rem);
	font-weight: var(--cypros-font-weight-black);
	line-height: 0.95;
	letter-spacing: -0.05em;
}

.cy-equipment-page__cta h2 span {
	display: block;
	color: var(--cypros-yellow);
}

.cy-equipment-page__cta-grid > div > p {
	max-width: 31rem;
	margin: 0;
	color: rgba(255, 255, 255, 0.68);
	font-size: 1rem;
	line-height: 1.75;
}

.cy-equipment-page__cta-grid > div > a {
	display: inline-flex;
	align-items: center;
	gap: 0.75rem;
	min-height: 3.8rem;
	margin-top: 2.25rem;
	padding: 0 1.75rem;
	color: var(--cypros-black);
	background: var(--cypros-yellow);
	font-size: 0.75rem;
	font-weight: var(--cypros-font-weight-black);
	letter-spacing: 0.09em;
	text-decoration: none;
	text-transform: uppercase;
	transition:
			background-color var(--cypros-transition-fast),
			transform var(--cypros-transition-fast);
}

.cy-equipment-page__cta-grid > div > a:hover,
.cy-equipment-page__cta-grid > div > a:focus-visible {
	color: var(--cypros-black);
	background: var(--cypros-white);
	transform: translateY(-2px);
}

/* ==========================================================
TABLET
========================================================== */

@media (max-width: 68rem) {
	.cy-page-hero__grid,
	.cy-equipment-page__intro,
	.cy-configurations__intro,
	.cy-equipment-page__cta-grid {
			grid-template-columns: 1fr;
	}

	.cy-page-hero__grid {
			gap: 3rem;
	}

	.cy-page-hero__content {
			max-width: 38rem;
	}

	.cy-equipment-page__intro {
			gap: 1.5rem;
	}

	.cy-equipment-selector {
			grid-template-columns: 1fr;
	}

	.cy-equipment-selector__item {
			min-height: 6.5rem;
	}

	.cy-equipment-panel__overview {
			grid-template-columns: 1fr;
			gap: 2.5rem;
	}

	.cy-equipment-panel__description {
			max-width: 44rem;
	}

	.cy-equipment-catalog__grid {
			grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.cy-configurations__intro {
			gap: 2.5rem;
	}

	.cy-configurations__grid {
			grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.cy-configurations__item {
			min-height: 22rem;
	}

	.cy-equipment-page__cta-grid > div {
			max-width: 38rem;
	}
}

/* ==========================================================
MOBILE
========================================================== */

@media (max-width: 48rem) {
	.cy-page-hero,
	.cy-equipment-page,
	.cy-configurations,
	.cy-equipment-page__cta {
			padding: 4rem 0;
	}

	.cy-page-hero__top,
	.cy-configurations__meta {
			flex-direction: column;
			align-items: flex-start;
			gap: 0.75rem;
			padding-bottom: 1.25rem;
	}

	.cy-page-hero__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 2.5rem;
		padding-top: 3rem;
	}

	.cy-page-hero__headline h1 {
			max-width: none;
			font-size: clamp(2.05rem, 9.5vw, 3.25rem);
			line-height: 0.88;
	}

	.cy-page-hero__headline h1 span {
			-webkit-text-stroke-width: 1px;
	}

	.cy-equipment-filters {
			grid-template-columns: 1fr;
			gap: 1.5rem;
			padding: 1.25rem 0 1.5rem;
	}

	.cy-equipment-filters__controls {
			grid-template-columns: 1fr;
	}

	.cy-equipment-filters__reset {
			grid-column: auto;
	}

	.cy-equipment-page__intro {
		grid-template-columns: 1fr;
		padding-bottom: 3rem;
	}

	.cy-equipment-page__intro h2,
	.cy-configurations__intro h2 {
		min-width: 0;
		max-width: none;
			font-size: clamp(2.5rem, 11vw, 4rem);
	}

	.cy-equipment-selector {
			margin-bottom: 2.5rem;
	}

	.cy-equipment-selector__item {
			grid-template-columns: 2rem minmax(0, 1fr);
			min-height: auto;
			padding: 1.25rem;
	}

	.cy-equipment-selector__name {
			font-size: 1.25rem;
	}

	.cy-equipment-panel__overview {
			gap: 2rem;
			padding: 2.25rem 0;
	}

	.cy-equipment-panel__identity {
			grid-template-columns: 2rem minmax(0, 1fr);
	}

	.cy-equipment-panel__identity h3 {
			font-size: clamp(3rem, 15vw, 4.5rem);
	}

	.cy-equipment-panel__description ul {
			grid-template-columns: 1fr;
			margin-top: 1.5rem;
	}

	.cy-equipment-catalog {
			padding-top: 2.5rem;
	}

	.cy-equipment-catalog__header {
			flex-direction: column;
			align-items: flex-start;
			gap: 0.75rem;
	}

	.cy-equipment-catalog__header > div {
			flex-direction: column;
			align-items: flex-start;
			gap: 0.5rem;
	}

	.cy-equipment-catalog__grid {
			grid-template-columns: 1fr;
	}

	.cy-equipment-catalog__more {
			width: 100%;
	}

	.cy-configurations__header {
			padding-bottom: 1.25rem;
	}

	.cy-configurations__intro {
			grid-template-columns: 1fr;
			gap: 2rem;
			padding-top: 1.5rem;
	}

	.cy-configurations__grid {
			grid-template-columns: 1fr;
			border-left: 0;
	}

	.cy-configurations__item {
			min-height: 20rem;
			border-left: 1px solid rgba(255, 255, 255, 0.16);
	}

	.cy-configurations__footer {
			flex-direction: column;
			align-items: flex-start;
			gap: 1.5rem;
	}

	.cy-equipment-page__cta h2 {
			max-width: none;
			font-size: clamp(2.6rem, 11vw, 4rem);
	}

	.cy-equipment-page__cta-grid > div > a {
			width: 100%;
			justify-content: center;
	}
}

/* ==========================================================
ULTRA-NARROW MOBILE SAFETY
========================================================== */

@media (max-width: 30rem) {
	.cy-page-hero__headline h1,
	.cy-equipment-page__intro h2,
	.cy-configurations__intro h2,
	.cy-equipment-page__cta h2 {
		font-size: clamp(2rem, 10vw, 3rem);
		line-height: 0.94;
		letter-spacing: -0.045em;
		overflow-wrap: anywhere;
	}

	.cy-page-hero__top,
	.cy-configurations__meta,
	.cy-configurations__footer {
		min-width: 0;
	}

	.cy-page-hero__top p,
	.cy-page-hero__top span,
	.cy-configurations__meta p,
	.cy-configurations__meta span {
		max-width: 100%;
		overflow-wrap: anywhere;
	}
}

/* ==========================================================
REDUCED MOTION
========================================================== */

@media (prefers-reduced-motion: reduce) {
	.cy-equipment-selector__item,
	.cy-equipment-selector__item::after,
	.cy-equipment-catalog__more,
	.cy-configurations__item,
	.cy-configurations__item::before,
	.cy-configurations__footer a,
	.cy-configurations__footer a span,
	.cy-equipment-page__cta-grid > div > a {
			transition: none;
	}

	.cy-equipment-catalog__more:hover,
	.cy-equipment-catalog__more:focus-visible,
	.cy-configurations__footer a:hover span,
	.cy-configurations__footer a:focus-visible span,
	.cy-equipment-page__cta-grid > div > a:hover,
	.cy-equipment-page__cta-grid > div > a:focus-visible {
			transform: none;
	}
}

/* ==========================================================
   RANGE LANDING
   Cypros Power — Equipment Range
========================================================== */

.cy-range-page {
    background: var(--cypros-white);
}


/* ==========================================================
   01 / RANGE HERO
   Editorial industrial / compact premium
========================================================== */

.cy-range-hero {
    padding: clamp(2.5rem, 3.5vw, 3.5rem) 0 clamp(3rem, 4vw, 4rem);
    background: var(--cypros-white);
    border-bottom: 1px solid var(--cypros-color-border);
}

.cy-range-hero__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--cypros-black);
}

.cy-range-hero__meta p,
.cy-range-hero__meta span {
    margin: 0;
    color: var(--cypros-black);
    font-size: var(--cypros-font-size-xs);
    font-weight: var(--cypros-font-weight-bold);
    line-height: 1;
    letter-spacing: var(--cypros-letter-spacing-wide);
    text-transform: uppercase;
}

.cy-range-hero__meta span {
    color: var(--cypros-gray-600);
}

.cy-range-hero__grid {
    display: grid;
    grid-template-columns:
        minmax(0, 1.12fr)
        minmax(21rem, 0.88fr);
    gap: clamp(2.5rem, 4.5vw, 5rem);
    align-items: end;
    padding-top: clamp(2.25rem, 3.5vw, 3.5rem);
}

.cy-range-hero h1 {
    max-width: 12ch;
    margin: 0;
    color: var(--cypros-black);
    font-size: clamp(3.35rem, 5vw, 5.2rem);
    font-weight: var(--cypros-font-weight-black);
    line-height: 0.91;
    letter-spacing: -0.055em;
    text-wrap: balance;
}

.cy-range-hero__content {
    width: 100%;
    max-width: 36rem;
    padding-bottom: 0.15rem;
}

.cy-range-hero__content > p {
    max-width: 33rem;
    margin: 0;
    color: var(--cypros-graphite);
    font-size: clamp(1rem, 1.15vw, 1.1rem);
    line-height: 1.68;
}

/* HERO DATA */

.cy-range-hero__stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 2rem;
    background: var(--cypros-color-border);
    border: 1px solid var(--cypros-color-border);
    gap: 1px;
}

.cy-range-hero__stat {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-width: 0;
    min-height: 6.25rem;
    padding: 1.1rem 1.25rem 1.2rem;
    background: var(--cypros-white);
}

.cy-range-hero__stat > span {
    display: block;
    margin: 0 0 1rem;
    color: var(--cypros-gray-600);
    font-size: 0.62rem;
    font-weight: var(--cypros-font-weight-bold);
    line-height: 1.2;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.cy-range-hero__stat strong {
    display: block;
    min-width: 0;
    margin: 0;
    color: var(--cypros-black);
    font-size: clamp(1.45rem, 1.75vw, 1.9rem);
    font-weight: var(--cypros-font-weight-black);
    line-height: 1;
    letter-spacing: -0.035em;
}


/* ==========================================================
   02 / MODELS
========================================================== */

.cy-range-catalog {
    padding: clamp(3.75rem, 5vw, 5.25rem) 0;
    background: var(--cypros-white);
}

.cy-range-catalog__intro {
    display: grid;
    grid-template-columns:
        minmax(12rem, 0.4fr)
        minmax(0, 1.6fr);
    gap: clamp(3rem, 7vw, 7rem);
    align-items: end;
    margin-bottom: clamp(3rem, 5vw, 5rem);
}

.cy-range-catalog__intro > p {
    margin: 0;
    color: var(--cypros-gray-700);
    font-size: var(--cypros-font-size-xs);
    font-weight: var(--cypros-font-weight-bold);
    letter-spacing: var(--cypros-letter-spacing-wide);
    text-transform: uppercase;
}

.cy-range-catalog__intro h2 {
    max-width: 12ch;
    margin: 0;
    color: var(--cypros-black);
    font-size: clamp(3rem, 5vw, 5.25rem);
    font-weight: var(--cypros-font-weight-black);
    line-height: 0.93;
    letter-spacing: -0.055em;
}

.cy-range-catalog .cy-equipment-catalog {
    padding-top: 0;
}


/* ==========================================================
   03 / DIMENSIONAMIENTO
========================================================== */

.cy-range-selection {
    padding: clamp(5rem, 8vw, 8rem) 0;
    color: var(--cypros-white);
    background: var(--cypros-black);
}

.cy-range-selection__grid {
    display: grid;
    grid-template-columns:
        minmax(13rem, 0.42fr)
        minmax(0, 1.58fr);
    gap: clamp(3rem, 7vw, 8rem);
    align-items: start;
}

.cy-range-selection__eyebrow {
    margin: 0;
    padding-top: 0.4rem;
    color: var(--cypros-yellow);
    font-size: var(--cypros-font-size-xs);
    font-weight: var(--cypros-font-weight-bold);
    line-height: 1;
    letter-spacing: var(--cypros-letter-spacing-wide);
    text-transform: uppercase;
}

.cy-range-selection__grid > div {
    min-width: 0;
}

.cy-range-selection h2 {
    max-width: 12ch;
    margin: 0;
    color: var(--cypros-white);
    font-size: clamp(3rem, 5vw, 5.3rem);
    font-weight: var(--cypros-font-weight-black);
    line-height: 0.93;
    letter-spacing: -0.055em;
}

.cy-range-selection h2 span {
    color: var(--cypros-yellow);
}

.cy-range-selection__grid > div > p {
    max-width: 43rem;
    margin: 2rem 0 0;
    color: rgba(255, 255, 255, 0.65);
    font-size: 1rem;
    line-height: 1.75;
}

.cy-range-selection ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    margin: clamp(3rem, 5vw, 4.5rem) 0 0;
    padding: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    list-style: none;
}

.cy-range-selection li {
    position: relative;
    min-height: 8rem;
    padding: 1.5rem 2rem 1.5rem 1.5rem;
    border-right: 1px solid rgba(255, 255, 255, 0.14);
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.86rem;
    font-weight: var(--cypros-font-weight-bold);
    line-height: 1.55;
}

.cy-range-selection li:nth-child(2n) {
    border-right: 0;
}

.cy-range-selection li::before {
    display: block;
    width: 0.45rem;
    height: 0.45rem;
    margin-bottom: 1.25rem;
    background: var(--cypros-yellow);
    content: "";
}


/* ==========================================================
   04 / APPLICATIONS
========================================================== */

.cy-range-applications {
    padding: clamp(5rem, 8vw, 8rem) 0;
    background: var(--cypros-gray-100);
    border-top: 1px solid var(--cypros-color-border);
    border-bottom: 1px solid var(--cypros-color-border);
}

.cy-range-applications__header {
    display: grid;
    grid-template-columns:
        minmax(13rem, 0.4fr)
        minmax(0, 1.6fr);
    gap: clamp(3rem, 7vw, 7rem);
    align-items: end;
    margin-bottom: clamp(3rem, 5vw, 4.5rem);
}

.cy-range-applications__eyebrow {
    margin: 0;
    color: var(--cypros-gray-700);
    font-size: var(--cypros-font-size-xs);
    font-weight: var(--cypros-font-weight-bold);
    line-height: 1;
    letter-spacing: var(--cypros-letter-spacing-wide);
    text-transform: uppercase;
}

.cy-range-applications__header h2 {
    max-width: 12ch;
    margin: 0;
    color: var(--cypros-black);
    font-size: clamp(3rem, 5vw, 5rem);
    font-weight: var(--cypros-font-weight-black);
    line-height: 0.94;
    letter-spacing: -0.055em;
}

.cy-range-applications__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    background: var(--cypros-color-border);
    border: 1px solid var(--cypros-color-border);
}

.cy-range-applications__item {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 18rem;
    padding: clamp(1.75rem, 2.8vw, 2.5rem);
    background: var(--cypros-white);
}

.cy-range-applications__item > span {
    display: block;
    margin: 0 0 auto;
    padding-bottom: 3.5rem;
    color: var(--cypros-yellow-dark);
    font-size: 0.68rem;
    font-weight: var(--cypros-font-weight-black);
    line-height: 1;
    letter-spacing: 0.14em;
}

.cy-range-applications__item h3 {
    max-width: 13ch;
    margin: 0 0 1rem;
    color: var(--cypros-black);
    font-size: clamp(1.55rem, 2.2vw, 2.25rem);
    font-weight: var(--cypros-font-weight-black);
    line-height: 0.98;
    letter-spacing: -0.04em;
}

.cy-range-applications__item p {
    max-width: 31rem;
    margin: 0;
    color: var(--cypros-gray-700);
    font-size: 0.9rem;
    line-height: 1.65;
}


/* ==========================================================
   05 / INTEGRATION
========================================================== */

.cy-range-integration {
    padding: clamp(5rem, 8vw, 8rem) 0;
    background: var(--cypros-white);
}

.cy-range-integration__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    padding-bottom: 1.35rem;
    border-bottom: 1px solid var(--cypros-black);
}

.cy-range-integration__meta p,
.cy-range-integration__meta span {
    margin: 0;
    color: var(--cypros-black);
    font-size: var(--cypros-font-size-xs);
    font-weight: var(--cypros-font-weight-bold);
    line-height: 1;
    letter-spacing: var(--cypros-letter-spacing-wide);
    text-transform: uppercase;
}

.cy-range-integration__meta span {
    color: var(--cypros-gray-600);
}

.cy-range-integration__grid {
    display: grid;
    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(20rem, 0.85fr);
    gap: clamp(4rem, 8vw, 8rem);
    align-items: end;
    padding-top: clamp(3rem, 5vw, 5rem);
}

.cy-range-integration__grid h2 {
    max-width: 11ch;
    margin: 0;
    color: var(--cypros-black);
    font-size: clamp(3rem, 5vw, 5.3rem);
    font-weight: var(--cypros-font-weight-black);
    line-height: 0.93;
    letter-spacing: -0.055em;
}

.cy-range-integration__grid > div {
    min-width: 0;
}

.cy-range-integration__grid > div > p {
    max-width: 34rem;
    margin: 0;
    color: var(--cypros-graphite);
    font-size: 1rem;
    line-height: 1.75;
}

.cy-range-integration__grid a {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 2rem;
    padding-bottom: 0.4rem;
    color: var(--cypros-black);
    border-bottom: 1px solid var(--cypros-black);
    font-size: 0.72rem;
    font-weight: var(--cypros-font-weight-black);
    letter-spacing: 0.1em;
    text-decoration: none;
    text-transform: uppercase;
    transition:
        color var(--cypros-transition-fast),
        border-color var(--cypros-transition-fast);
}

.cy-range-integration__grid a:hover,
.cy-range-integration__grid a:focus-visible {
    color: var(--cypros-yellow-dark);
    border-color: var(--cypros-yellow-dark);
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 68rem) {

    .cy-range-hero__grid,
    .cy-range-catalog__intro,
    .cy-range-selection__grid,
    .cy-range-applications__header,
    .cy-range-integration__grid {
        grid-template-columns: 1fr;
        gap: 2.25rem;
    }

    .cy-range-hero h1,
    .cy-range-catalog__intro h2,
    .cy-range-selection h2,
    .cy-range-applications__header h2,
    .cy-range-integration__grid h2 {
        max-width: 15ch;
    }

    .cy-range-hero__content {
        max-width: 42rem;
    }

    .cy-range-hero__stats {
        max-width: 42rem;
    }

    .cy-range-applications__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cy-range-applications__item {
        min-height: 16rem;
    }
}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 48rem) {

    .cy-range-hero,
    .cy-range-catalog,
    .cy-range-selection,
    .cy-range-applications,
    .cy-range-integration {
        padding: 4rem 0;
    }

    .cy-range-hero__meta,
    .cy-range-integration__meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.7rem;
    }

    .cy-range-hero__grid {
        padding-top: 3rem;
    }

    .cy-range-hero h1 {
        max-width: none;
        font-size: clamp(3rem, 14vw, 4.5rem);
    }

    .cy-range-hero__stats {
        grid-template-columns: 1fr;
        margin-top: 2rem;
    }

    .cy-range-hero__stat {
        min-height: auto;
    }

    .cy-range-hero__stat strong {
        white-space: normal;
    }

    .cy-range-catalog__intro h2,
    .cy-range-selection h2,
    .cy-range-applications__header h2,
    .cy-range-integration__grid h2 {
        max-width: none;
        font-size: clamp(2.5rem, 11vw, 4rem);
    }

    .cy-range-selection ul {
        grid-template-columns: 1fr;
    }

    .cy-range-selection li {
        min-height: auto;
        border-right: 0;
    }

    .cy-range-applications__grid {
        grid-template-columns: 1fr;
    }

    .cy-range-applications__item {
        min-height: auto;
    }

    .cy-range-applications__item > span {
        margin-bottom: 2.5rem;
        padding-bottom: 0;
    }
}


/* ==========================================================
   REDUCED MOTION
========================================================== */

@media (prefers-reduced-motion: reduce) {

    .cy-range-integration__grid a {
        transition: none;
    }
}


/* ==========================================================
   ENGINE BRAND CATALOG
========================================================== */

.cy-equipment-brands { padding: clamp(3.5rem, 7vw, 7rem) 0 2rem; background: var(--cypros-white); }
.cy-equipment-brands__header { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, .65fr); gap: 3rem; align-items: end; }
.cy-equipment-brands__header h2 { margin: .5rem 0 0; max-width: 15ch; }
.cy-equipment-brands__header h2 span { display: block; color: transparent; -webkit-text-stroke: 2px var(--cypros-black); }
.cy-equipment-brands__header > p { margin: 0; max-width: 38rem; color: var(--cypros-graphite); line-height: 1.7; }
.cy-equipment-brands__nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 2.5rem; border-top: 1px solid var(--cypros-black); border-bottom: 1px solid var(--cypros-black); }
.cy-equipment-brands__tab { display:flex; flex-direction:column; gap:.35rem; padding:1.25rem 1rem; color:var(--cypros-black); text-decoration:none; transition:background-color .2s ease,color .2s ease; }
.cy-equipment-brands__tab + .cy-equipment-brands__tab { border-left:1px solid var(--cypros-black); }
.cy-equipment-brands__tab strong { font-size:1.2rem; }
.cy-equipment-brands__tab span { font-size:.85rem; opacity:.7; }
.cy-equipment-brands__tab:hover,.cy-equipment-brands__tab:focus-visible,.cy-equipment-brands__tab.is-active { background:var(--cypros-yellow); }
/* ==========================================================
   ENGINE PLATFORM COMPARISON
========================================================== */

.cy-engine-comparison {
	padding: clamp(3.5rem, 7vw, 7rem) 0;
	background: var(--cypros-gray-100);
	border-top: 1px solid var(--cypros-color-border);
	border-bottom: 1px solid var(--cypros-color-border);
}

.cy-engine-comparison__header h2 {
	max-width: 18ch;
	margin: .5rem 0 2rem;
	font-size: clamp(2.4rem, 4.5vw, 4.8rem);
	line-height: .95;
	letter-spacing: -.055em;
}

.cy-engine-comparison__header h2 span {
	display: block;
	color: var(--cypros-gray-700);
}

.cy-engine-comparison__table-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.cy-engine-comparison__table {
	width: 100%;
	min-width: 36rem;
	border-collapse: collapse;
	background: var(--cypros-white);
}

.cy-engine-comparison__table th,
.cy-engine-comparison__table td {
	padding: 1rem 1.15rem;
	border: 1px solid var(--cypros-color-border);
	text-align: left;
	vertical-align: top;
}

.cy-engine-comparison__table thead th {
	color: var(--cypros-black);
	background: var(--cypros-yellow);
	font-size: .72rem;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.cy-engine-comparison__table tbody th {
	width: 34%;
	color: var(--cypros-gray-700);
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.cy-engine-comparison__table tbody td {
	color: var(--cypros-black);
	font-weight: 700;
}


.cy-equipment-brands__pillar-link {
	margin: 1.25rem 0 0;
	color: var(--cypros-gray-700);
	font-size: .82rem;
	line-height: 1.5;
}

.cy-equipment-brands__pillar-link a {
	font-weight: 800;
	text-decoration: underline;
	text-underline-offset: .2em;
}

.cy-equipment-brands__pillar-link a span {
	color: var(--cypros-yellow-dark);
}


/* V8.9 — Search & discovery controls */
.cy-equipment-filters__controls {
        grid-template-columns: minmax(12rem, 2fr) repeat(3, minmax(10rem, 1fr));
}
.cy-equipment-card__link {
        margin-left: auto;
        color: inherit;
        text-decoration: none;
        font: inherit;
        font-weight: 700;
}
.cy-equipment-card__link:hover,
.cy-equipment-card__link:focus-visible {
        text-decoration: underline;
}
@media (max-width: 68rem) {
        .cy-equipment-filters__controls {
                grid-template-columns: repeat(2, minmax(0, 1fr));
        }
}
@media (max-width: 48rem) {
        .cy-equipment-filters__controls {
                grid-template-columns: 1fr;
        }
}


/* ==========================================================
   V8.22 — ELECTRICAL CATALOG EXPERIENCE
========================================================== */

.cy-page-hero {
	position: relative;
	overflow: hidden;
	background:
		linear-gradient(rgba(17,17,17,.035) 1px, transparent 1px),
		linear-gradient(90deg, rgba(17,17,17,.035) 1px, transparent 1px),
		var(--cypros-white);
	background-size: 72px 72px;
}

.cy-page-hero::after {
	position: absolute;
	top: 0;
	right: 7vw;
	width: 1px;
	height: 44%;
	background: var(--cypros-yellow);
	content: "";
}

.cy-page-hero__content {
	position: relative;
	z-index: 1;
}

.cy-page-hero__system {
	position: relative;
	margin-top: 2rem;
	padding: 1rem 1rem 1.05rem;
	background: var(--cypros-black);
	box-shadow: 12px 12px 0 var(--cypros-yellow);
	color: var(--cypros-white);
}

.cy-page-hero__system::before {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
	background-size: 28px 28px;
	content: "";
	pointer-events: none;
}

.cy-page-hero__system-label,
.cy-page-hero__system-status,
.cy-page-hero__system-flow { position: relative; z-index: 1; }

.cy-page-hero__system-label {
	padding-bottom: .7rem;
	border-bottom: 1px solid rgba(255,255,255,.18);
	font-size: .58rem;
	font-weight: 800;
	letter-spacing: .13em;
	text-transform: uppercase;
}

.cy-page-hero__system-flow {
	display: grid;
	grid-template-columns: auto 1fr auto 1fr auto 1fr auto;
	align-items: center;
	gap: .45rem;
	padding: 1.25rem 0 1rem;
}

.cy-page-hero__system-flow span,
.cy-page-hero__system-flow strong {
	display: grid;
	place-items: center;
	min-width: 2.5rem;
	min-height: 2.5rem;
	padding: .35rem;
	border: 1px solid rgba(255,255,255,.32);
	font-size: .57rem;
	font-style: normal;
	font-weight: 900;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.cy-page-hero__system-flow strong {
	background: var(--cypros-yellow);
	border-color: var(--cypros-yellow);
	color: var(--cypros-black);
}

.cy-page-hero__system-flow i {
	display: block;
	height: 1px;
	background: var(--cypros-yellow);
	box-shadow: 0 0 0 3px rgba(255,214,0,.08);
}

.cy-page-hero__system-status {
	display: flex;
	align-items: center;
	gap: .55rem;
	font-size: .58rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.cy-page-hero__system-status span {
	width: .5rem;
	height: .5rem;
	background: var(--cypros-yellow);
	border-radius: 50%;
	box-shadow: 0 0 0 4px rgba(255,214,0,.12);
}

.cy-equipment-filters {
	position: relative;
	padding: 1.5rem;
	background: var(--cypros-black);
	border: 0;
	color: var(--cypros-white);
}

.cy-equipment-filters::before {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
	background-size: 36px 36px;
	content: "";
	pointer-events: none;
}

.cy-equipment-filters > * { position: relative; z-index: 1; }
.cy-equipment-filters .cy-equipment-page__eyebrow,
.cy-equipment-filters__intro h2 { color: var(--cypros-white); }
.cy-equipment-filters__intro > p:last-child,
.cy-equipment-filters__status { color: rgba(255,255,255,.62); }
.cy-equipment-filter span { color: rgba(255,255,255,.68); }
.cy-equipment-filter input,
.cy-equipment-filter select {
	background: #171717;
	border-color: rgba(255,255,255,.2);
	color: var(--cypros-white);
}
.cy-equipment-filter input::placeholder { color: rgba(255,255,255,.4); }
.cy-equipment-filters__reset { color: var(--cypros-yellow); border-color: var(--cypros-yellow); }

.cy-equipment-selector {
	position: relative;
	box-shadow: inset 0 3px 0 var(--cypros-yellow);
}

@media (max-width: 760px) {
	.cy-page-hero__system { box-shadow: 7px 7px 0 var(--cypros-yellow); }
	.cy-page-hero__system-flow { gap: .25rem; }
	.cy-page-hero__system-flow span,
	.cy-page-hero__system-flow strong { min-width: 2.1rem; min-height: 2.1rem; font-size: .5rem; }
	.cy-equipment-filters { padding: 1.1rem; }
}

/* V8.56 — brand catalog truth surfaced from the live PIM. */
.cy-page-hero__brand-metric {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
	margin: 0.9rem 0 0;
	font-size: 0.82rem;
	line-height: 1.45;
	letter-spacing: 0.02em;
}

.cy-page-hero__brand-metric strong {
	font-weight: 700;
}

.cy-page-hero__brand-metric span {
	opacity: 0.76;
}
