/* Hardware page overrides — shared system, distinct hardware identity */
.hardware-page {
	--primary-color: var(--accent-magenta);
	--primary-color2: #ff4da6;
	--title-color: var(--accent-magenta);
	--gradient-color: linear-gradient(135deg, #ff0080 0%, #00d4ff 100%);
	--shadow-color: 0 10px 30px rgba(255, 0, 128, 0.18);
}

html,
.hardware-page {
	overflow-x: hidden;
	width: 100%;
}

body.hardware-page {
	background-image:
		linear-gradient(rgba(255, 0, 128, 0.03) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 0, 128, 0.03) 1px, transparent 1px);
}

body.hardware-page::after {
	background: repeating-linear-gradient(
		0deg,
		transparent,
		transparent 2px,
		rgba(255, 0, 128, 0.03) 2px,
		rgba(255, 0, 128, 0.03) 4px
	);
}

.hardware-page .header_area .main-menu .navbar,
.hardware-page .site-main .table-price .table,
.hardware-page .site-main .table-price h2 {
	border-color: rgba(255, 0, 128, 0.18);
}

.hardware-page .header_area .main-menu .navbar {
	border-bottom-color: rgba(255, 0, 128, 0.14);
}

.hardware-page .header_area .main-menu .navbar-nav .active a,
.hardware-page .header_area .main-menu .navbar-nav a:hover,
.hardware-page .site-main .site-banner .site-title h1,
.hardware-page .site-main .table-price h2,
.hardware-page .title-text-black {
	text-shadow: 0 0 12px rgba(255, 0, 128, 0.4);
}

.hardware-page .navbar-toggler {
	border-color: rgba(255, 0, 128, 0.35);
}

.hardware-page .navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,0,128,0.75)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.hardware-page .site-main .site-banner.hardware-banner {
	min-height: calc(100vh - 80px);
	height: auto;
	isolation: isolate;
}

.hardware-page .site-main .site-banner.hardware-banner .overlay {
	background: linear-gradient(
		120deg,
		rgba(10, 10, 15, 0.9) 0%,
		rgba(18, 18, 26, 0.62) 50%,
		rgba(255, 0, 128, 0.18) 100%
	);
}

.hardware-page .site-main .site-banner.hardware-banner .banner-image {
	background:
		radial-gradient(circle at 75% 30%, rgba(255, 0, 128, 0.28), transparent 22%),
		linear-gradient(90deg, rgba(0, 212, 255, 0.08), transparent),
		url("../../images/bg-hardware.webp") no-repeat center center;
	background-size: cover;
	opacity: 0.38;
}

.hardware-page .hardware-circuit {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
}

.hardware-page .circuit-node,
.hardware-page .circuit-line {
	position: absolute;
	display: block;
}

.hardware-page .circuit-node {
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: var(--primary-color);
	box-shadow:
		0 0 0 6px rgba(255, 0, 128, 0.09),
		0 0 18px rgba(255, 0, 128, 0.45);
}

.hardware-page .node-a {
	top: 18%;
	left: 58%;
}

.hardware-page .node-b {
	top: 30%;
	left: 72%;
}

.hardware-page .node-c {
	top: 52%;
	left: 66%;
}

.hardware-page .node-d {
	top: 68%;
	left: 82%;
}

.hardware-page .circuit-line {
	height: 2px;
	background: linear-gradient(
		90deg,
		rgba(255, 0, 128, 0),
		rgba(255, 0, 128, 0.55),
		rgba(0, 212, 255, 0.35)
	);
	transform-origin: left center;
	box-shadow: 0 0 12px rgba(255, 0, 128, 0.18);
}

.hardware-page .line-a {
	top: 19.5%;
	left: 59%;
	width: 12%;
	transform: rotate(22deg);
}

.hardware-page .line-b {
	top: 32%;
	left: 67%;
	width: 10%;
	transform: rotate(78deg);
}

.hardware-page .line-c {
	top: 54%;
	left: 67%;
	width: 15%;
	transform: rotate(26deg);
}

.hardware-page .site-main .site-banner.hardware-banner .site-title {
	position: relative;
	z-index: 3;
}

.hardware-page .site-main .site-banner.hardware-banner .site-title h1 {
	margin-bottom: 1rem;
}

.hardware-page .hardware-hero-title {
	max-width: 11ch;
	line-height: 1.05;
}

.hardware-page .site-main .site-banner.hardware-banner .title-sub {
	margin-top: 0.75rem;
	max-width: 20ch;
}

.hardware-page .hardware-lead {
	max-width: 40rem;
	margin: 0.75rem 0 0;
	font: normal 500 1.05rem / 1.8 var(--mono);
	letter-spacing: 0.5px;
	color: var(--text-light);
	opacity: 0.92;
}

.hardware-page .hardware-hero-actions {
	margin-top: 1.8rem !important;
}

.hardware-page .hardware-secondary-button {
	color: var(--text-light);
	background: rgba(10, 10, 15, 0.48);
	border-color: rgba(255, 0, 128, 0.55);
	box-shadow:
		0 0 0 1px rgba(255, 0, 128, 0.12),
		0 0 24px rgba(255, 0, 128, 0.12);
	backdrop-filter: blur(6px);
}

.hardware-page .hardware-secondary-button:hover,
.hardware-page .hardware-secondary-button:focus,
.hardware-page .hardware-secondary-button:active {
	color: var(--bg-darkest);
	background: var(--primary-color);
	border-color: var(--primary-color);
	box-shadow: 0 0 22px rgba(255, 0, 128, 0.3);
}

.hardware-page .hardware-hero-panel {
	position: relative;
	z-index: 3;
	width: min(100%, 332px);
	padding: 1.25rem;
	border: 1px solid rgba(255, 0, 128, 0.18);
	border-radius: 18px;
	background: linear-gradient(
		155deg,
		rgba(22, 22, 42, 0.82),
		rgba(12, 12, 22, 0.9)
	);
	box-shadow:
		0 0 40px rgba(255, 0, 128, 0.08),
		inset 0 0 0 1px rgba(255, 255, 255, 0.02);
	backdrop-filter: blur(10px);
}

.hardware-page .panel-label {
	font: normal 700 0.78rem / 1.2 var(--mono);
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--primary-color);
	margin-bottom: 1rem;
}

.hardware-page .panel-core {
	height: 164px;
	border-radius: 14px;
	background:
		radial-gradient(circle at 50% 50%, rgba(255, 0, 128, 0.3), transparent 28%),
		linear-gradient(135deg, rgba(255, 0, 128, 0.16), rgba(0, 212, 255, 0.08)),
		repeating-linear-gradient(
			90deg,
			rgba(255, 255, 255, 0.04),
			rgba(255, 255, 255, 0.04) 1px,
			transparent 1px,
			transparent 16px
		),
		repeating-linear-gradient(
			0deg,
			rgba(255, 255, 255, 0.03),
			rgba(255, 255, 255, 0.03) 1px,
			transparent 1px,
			transparent 16px
		);
	border: 1px solid rgba(255, 0, 128, 0.14);
	box-shadow: inset 0 0 24px rgba(255, 0, 128, 0.08);
}

.hardware-page .panel-metrics {
	display: grid;
	gap: 0.65rem;
	margin-top: 1rem;
}

.hardware-page .panel-metrics span {
	padding: 0.68rem 0.85rem;
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.03);
	font: normal 500 0.79rem / 1.35 var(--mono);
	color: var(--text-color);
	border: 1px solid rgba(255, 0, 128, 0.08);
}

.hardware-page .hardware-section-intro {
	max-width: 46rem;
	margin: 1rem auto 0;
}

.hardware-page .site-main .services-area,
.hardware-page .site-main .table-price,
.hardware-page .hardware-cta,
.hardware-page .hardware-about {
	padding-top: 6rem;
	padding-bottom: 6rem;
}

.hardware-page .site-main .table-price {
	padding-top: 5rem;
}

.hardware-page .site-main .table-price .table thead th {
	border-bottom-color: rgba(255, 0, 128, 0.28);
	background: rgba(255, 0, 128, 0.08);
}

.hardware-page .site-main .table-price .table tbody td {
	border-color: rgba(255, 0, 128, 0.06);
}

.hardware-page .site-main .table-price .table tbody tr:hover td {
	background: rgba(255, 0, 128, 0.05);
}

.hardware-page .site-main .table-price .table tbody tr:hover td:last-child {
	text-shadow: 0 0 12px rgba(255, 0, 128, 0.45);
}

.hardware-page
	.site-main
	.table-price
	.table-striped
	> tbody
	> tr:nth-of-type(odd)
	> td {
	background: rgba(255, 0, 128, 0.018);
}

.hardware-page
	.site-main
	.table-price
	.table-striped
	> tbody
	> tr:nth-of-type(odd):hover
	> td {
	background: rgba(255, 0, 128, 0.055);
}

.hardware-page .table-responsive {
	border-radius: 8px;
}

.hardware-page .hardware-cta {
	margin: 0;
	background: linear-gradient(
		180deg,
		rgba(18, 18, 26, 0.92),
		rgba(10, 10, 15, 1)
	);
}

.hardware-page .hardware-cta-panel {
	max-width: 58rem;
	margin: 0 auto;
	padding: 3rem 2rem;
	border: 1px solid rgba(255, 0, 128, 0.18);
	border-radius: 20px;
	background:
		radial-gradient(
			circle at top center,
			rgba(255, 0, 128, 0.09),
			transparent 35%
		),
		linear-gradient(145deg, rgba(26, 26, 46, 0.95), rgba(18, 18, 26, 0.98));
	box-shadow: 0 0 36px rgba(255, 0, 128, 0.08);
}

.hardware-page .hardware-cta-panel h2 {
	margin-top: 1.25rem;
	color: var(--text-light);
}

.hardware-page .hardware-cta-title {
	margin-top: 0;
	margin-bottom: 0.9rem;
	line-height: 1.08;
}

.hardware-page .hardware-about {
	background: var(--bg-dark);
}

.hardware-page .hardware-about-copy {
	max-width: 31rem;
}

.hardware-page .hardware-about-title {
	margin-top: 0;
	margin-bottom: 1.25rem;
	color: var(--text-light);
	line-height: 1.15;
	max-width: 12ch;
}

.hardware-page .hardware-about-board {
	position: relative;
	padding: 0.85rem;
	border: 1px solid rgba(255, 0, 128, 0.14);
	border-radius: 22px;
	background: linear-gradient(
		145deg,
		rgba(22, 22, 42, 0.96),
		rgba(12, 12, 22, 0.98)
	);
	box-shadow: 0 0 34px rgba(255, 0, 128, 0.08);
	overflow: hidden;
}

.hardware-page .hardware-about-board img {
	border-radius: 14px;
	width: 100%;
	display: block;
	filter: saturate(0.9) contrast(1.03);
}

.hardware-page .hardware-about-note {
	position: absolute;
	padding: 0.7rem 1rem;
	border-radius: 999px;
	background: rgba(10, 10, 15, 0.82);
	border: 1px solid rgba(255, 0, 128, 0.16);
	font: normal 600 0.78rem / 1.2 var(--mono);
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--text-light);
	backdrop-filter: blur(8px);
}

.hardware-page .note-a {
	top: 1.5rem;
	left: 1.5rem;
}

.hardware-page .note-b {
	right: 1.5rem;
	bottom: 1.5rem;
}

.hardware-page section[id] {
	scroll-margin-top: 96px;
}

.hardware-page .container {
	padding-left: 0.75rem;
	padding-right: 0.75rem;
}

@media only screen and (max-width: 992px) {
	.hardware-page .site-main .site-banner.hardware-banner {
		min-height: 42rem;
	}

	.hardware-page .hardware-about-copy {
		max-width: none;
	}

	.hardware-page .hardware-about-title {
		max-width: none;
	}
}

@media only screen and (max-width: 792px) {
	.hardware-page .container {
		max-width: 100% !important;
	}

	.hardware-page .site-main .site-banner.hardware-banner {
		min-height: 34rem;
		height: auto;
	}

	.hardware-page .hardware-circuit,
	.hardware-page .hardware-hero-panel {
		display: none;
	}

	.hardware-page .hardware-hero-title {
		max-width: none;
		line-height: 1.08;
	}

	.hardware-page .hardware-hero-title .title-sub {
		max-width: none;
		margin-top: 0.6rem;
		font-size: 1rem;
	}

	.hardware-page .hardware-lead {
		font-size: 0.92rem;
		line-height: 1.65;
		margin-top: 1rem;
	}

	.hardware-page .hardware-hero-actions .d-flex {
		flex-direction: column !important;
		width: 100%;
	}

	.hardware-page .hardware-hero-actions .btn {
		width: 100%;
		text-align: center;
	}

	.hardware-page .hardware-cta-title,
	.hardware-page .hardware-about-title {
		max-width: none;
		line-height: 1.12;
	}

	.hardware-page .site-main .services-area,
	.hardware-page .site-main .table-price,
	.hardware-page .hardware-cta,
	.hardware-page .hardware-about {
		padding-top: 4.5rem;
		padding-bottom: 4.5rem;
	}

	.hardware-page .hardware-cta-panel {
		padding: 2rem 1.2rem;
	}

	.hardware-page .hardware-cta-panel h2 {
		font-size: 1.6rem;
		line-height: 1.15;
	}

	.hardware-page .services-title .title-text-black {
		font-size: 2rem;
		line-height: 1.2;
	}

	.hardware-page .hardware-about-board .hardware-about-note {
		display: none;
	}

	.hardware-page .hardware-about-board {
		padding: 0.65rem;
	}
}

@media only screen and (max-width: 480px) {
	.hardware-page .hardware-hero-title {
		font-size: 2.2rem;
	}

	.hardware-page .hardware-hero-title .title-sub {
		font-size: 0.85rem;
	}

	.hardware-page .hardware-cta-panel h2 {
		font-size: 1.3rem;
	}

	.hardware-page .hardware-cta-panel {
		padding: 1.8rem 0.9rem;
	}

	.hardware-page .hardware-about-title {
		font-size: 1.5rem;
	}
}

@media only screen and (max-width: 340px) {
	.hardware-page .hardware-hero-title {
		font-size: 1.7rem;
	}

	.hardware-page .hardware-hero-title .title-sub {
		font-size: 0.72rem;
	}

	.hardware-page .hardware-lead {
		font-size: 0.78rem;
	}

	.hardware-page .hardware-cta-panel h2 {
		font-size: 1.1rem;
	}

	.hardware-page .hardware-about-title {
		font-size: 1.2rem;
	}
}