/* Visual layer for the Shchyolkovo Cable Center brand. */
.csc {
	--ink: #101820;
	--muted: #747b86;
	--green: #ff5a00;
	--lime: #ff5a00;
	--orange: #ff5a00;
	--orange-dark: #e84f00;
	--orange-soft: #fff2eb;
	--line: #e8eaee;
	--paper: #fff;
	max-width: 1320px;
	color: var(--ink);
	font-family: Inter, Manrope, Arial, sans-serif;
}

.csc-hero {
	min-height: 330px;
	padding: 58px 62px;
	border: 1px solid var(--line);
	background:
		radial-gradient(circle at 72% 25%, rgba(255, 90, 0, .13), transparent 30%),
		linear-gradient(120deg, #fff 0%, #fff 58%, #f7f8f9 100%);
	color: var(--ink);
	box-shadow: 0 24px 64px rgba(16, 24, 32, .08);
}

.csc-hero::before {
	content: "";
	position: absolute;
	right: 7%;
	top: -85px;
	width: 260px;
	height: 260px;
	border: 1px solid rgba(255, 90, 0, .16);
	border-radius: 50%;
	box-shadow: 0 0 0 38px rgba(255, 90, 0, .035), 0 0 0 76px rgba(255, 90, 0, .025);
}

.csc-hero::after {
	background-image:
		linear-gradient(rgba(16, 24, 32, .025) 1px, transparent 1px),
		linear-gradient(90deg, rgba(16, 24, 32, .025) 1px, transparent 1px);
	mask-image: linear-gradient(90deg, transparent 35%, #000);
}

.csc h1 {
	max-width: 800px;
	margin-top: 20px;
	color: var(--ink);
	font-size: clamp(38px, 5vw, 66px);
	font-weight: 900;
}

.csc-kicker {
	border-color: rgba(255, 90, 0, .28);
	background: var(--orange-soft);
	color: var(--orange-dark);
}

.csc-hero p {
	color: var(--muted);
}

.csc-trust {
	color: var(--ink);
}

.csc-trust span::first-letter {
	color: var(--orange);
}

.csc-cable {
	right: -95px;
	bottom: 42px;
	background: linear-gradient(#24282b, #030506);
	box-shadow: -18px 30px 55px rgba(16, 24, 32, .24);
}

.csc-panel {
	border-color: var(--line);
	border-radius: 22px;
	box-shadow: 0 18px 48px rgba(16, 24, 32, .075);
}

.csc-form,
.csc-result {
	padding: 30px;
}

.csc-step > span {
	background: var(--orange-soft);
	color: var(--orange);
}

.csc-step b {
	color: var(--ink);
	font-size: 20px;
	font-weight: 850;
}

.csc-segment {
	background: #f3f4f6;
}

.csc-segment button {
	color: #6e7580;
	font-family: inherit;
}

.csc-segment button.is-active {
	color: var(--orange);
	box-shadow: 0 4px 16px rgba(16, 24, 32, .08);
}

.csc label {
	color: #343b43;
}

.csc input,
.csc select {
	border-color: #dfe2e7;
	border-radius: 12px;
	color: var(--ink);
	font-family: inherit;
}

.csc input:hover,
.csc select:hover {
	border-color: #c7cbd2;
}

.csc input:focus,
.csc select:focus {
	border-color: var(--orange);
	box-shadow: 0 0 0 4px rgba(255, 90, 0, .11);
}

.csc input[readonly] {
	background: #f5f6f7;
	color: #4c535c;
}

.csc-input em,
.csc-input select {
	background: #f1f2f4;
	color: #555d67;
}

.csc-auto-voltage {
	border-color: #e3e5e9;
	background: #f8f8f9;
}

.csc-auto-voltage input {
	accent-color: var(--orange);
}

.csc-advanced summary {
	color: var(--orange-dark);
}

.csc-calculate {
	min-height: 58px;
	border-radius: 12px;
	background: linear-gradient(105deg, var(--orange), #ff7300);
	font-family: inherit;
	font-size: 14px;
	box-shadow: 0 13px 28px rgba(255, 90, 0, .24);
}

.csc-calculate:hover {
	box-shadow: 0 17px 34px rgba(255, 90, 0, .32);
}

.csc-calculate b {
	background: #fff;
	color: var(--orange);
}

.csc-result {
	background: linear-gradient(180deg, #fff, #fafafa);
}

.csc-lab {
	border-color: #2d3338;
	background:
		radial-gradient(circle at 70% 0%, rgba(255, 90, 0, .16), transparent 40%),
		linear-gradient(145deg, #11161a, #242a2f);
	color: #fff;
	box-shadow: inset 0 0 28px rgba(0, 0, 0, .45);
}

.csc-lab__top {
	color: #ff9a63;
}

.csc-meter span {
	color: #a7adb4;
}

.csc-meter b {
	color: #fff;
}

.csc-meter i {
	background: #ff6a1a;
	box-shadow: 0 0 8px #ff5a00;
}

.csc-wire i {
	background: #fff4ec;
	box-shadow: 0 0 9px 3px #ff6a1a;
}

.csc-lab.is-done {
	border-color: #ff7b35;
	box-shadow: inset 0 0 24px rgba(0, 0, 0, .4), 0 0 0 2px rgba(255, 90, 0, .08);
}

.csc-gauge__value {
	stroke: var(--orange);
}

.csc-gauge__value.is-hot {
	stroke: #d83c22;
}

.csc-gauge div > b {
	color: var(--orange-dark);
}

.csc-result-grid > div {
	border-color: #e7e9ec;
	border-radius: 13px;
}

.csc-result-grid strong {
	color: var(--ink);
}

.csc-checks > div {
	border: 1px solid #ebecef;
	background: #fff;
}

.csc-checks i {
	background: var(--orange);
}

.csc-note {
	border-left-color: var(--orange);
	background: #fff5ef;
	color: #654b3f;
}

.csc-manual-select {
	border-color: #e5e7ea;
}

.csc-manual-select button {
	border-color: var(--orange);
	background: var(--orange-soft);
	color: var(--orange-dark);
	font-family: inherit;
}

.csc-manual-select button:hover:not(:disabled) {
	background: #ffe5d7;
}

.csc-proof {
	border-color: #ffd3bd;
	background: #fffaf7;
}

.csc-toc {
	border-color: #e7e9ed;
	background: #f8f8f9;
}

.csc-toc a,
.csc-seo article span,
.csc-example-note b {
	color: var(--orange-dark);
}

.csc-toc a {
	background: var(--orange-soft);
}

.csc-toc a:hover {
	background: var(--orange);
}

.csc-factors span {
	background: var(--orange-soft);
	color: #9d3905;
}

.csc-method-table caption,
.csc-sources {
	background: #12191f;
}

.csc-method-table th {
	background: #fff2eb;
	color: #8f3506;
}

.csc-example-note {
	border-color: #f2ddd2;
	border-left-color: var(--orange);
	background: #fff8f4;
}

.csc-expert {
	border-color: #f1d6c8;
	background: linear-gradient(135deg, #fff1e9, #fff);
}

.csc-expert > span {
	background: var(--orange);
	box-shadow: 0 7px 16px rgba(255, 90, 0, .22);
}

.csc-links a {
	border-color: #ffc7aa;
	color: var(--orange-dark);
}

.csc-links a.is-primary {
	border-color: var(--orange);
	background: var(--orange);
}

.csc-sources a {
	color: #ffb58e;
}

/* Compact product-tab presentation. */
.csc--product {
	max-width: none;
	margin: 8px auto 18px;
}

.csc-product-intro {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	margin-bottom: 22px;
	padding: 28px 32px;
	border: 1px solid var(--line);
	border-radius: 20px;
	background:
		radial-gradient(circle at 88% 15%, rgba(255, 90, 0, .15), transparent 26%),
		linear-gradient(115deg, #fff, #fafafa);
	box-shadow: 0 14px 38px rgba(16, 24, 32, .06);
}

.csc-product-intro > div {
	max-width: 780px;
}

.csc-product-intro span {
	color: var(--orange);
	font-size: 11px;
	font-weight: 850;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.csc-product-intro h2 {
	margin: 7px 0 8px;
	color: var(--ink);
	font-size: clamp(25px, 3vw, 38px);
	font-weight: 900;
	line-height: 1.08;
	letter-spacing: -.035em;
}

.csc-product-intro p {
	margin: 0;
	color: var(--muted);
	font-size: 15px;
}

.csc-product-intro > i {
	display: grid;
	flex: 0 0 74px;
	height: 74px;
	place-items: center;
	border-radius: 50%;
	background: var(--orange);
	color: #fff;
	font-size: 30px;
	font-style: normal;
	font-weight: 800;
	box-shadow: 0 14px 28px rgba(255, 90, 0, .25);
}

.csc--product .csc-layout {
	margin: 0;
}

.csc--product .csc-panel {
	box-shadow: 0 12px 34px rgba(16, 24, 32, .06);
}

.csc-product-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	margin-top: 18px;
	padding: 20px 24px;
	border: 1px solid var(--line);
	border-radius: 16px;
	background: #fff;
}

.csc-product-footer > div {
	display: grid;
	gap: 3px;
}

.csc-product-footer b {
	font-size: 14px;
}

.csc-product-footer span {
	color: var(--muted);
	font-size: 11px;
}

.csc-product-footer > a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	padding: 0 17px;
	border-radius: 10px;
	background: var(--orange);
	color: #fff !important;
	font-size: 12px;
	font-weight: 800;
	text-decoration: none !important;
	white-space: nowrap;
	transition: transform .2s ease, box-shadow .2s ease;
}

.csc-product-footer > a:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 24px rgba(255, 90, 0, .22);
}

.woocommerce-Tabs-panel--csc_calculator > h2:first-child {
	display: none;
}

@media (max-width: 1050px) {
	.csc-hero {
		padding-inline: 42px;
	}

	.csc-cable {
		right: -180px;
		opacity: .45;
	}
}

@media (max-width: 900px) {
	.csc-hero {
		min-height: 320px;
		padding: 42px 28px;
	}

	.csc--product .csc-layout {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 640px) {
	.csc h1 {
		font-size: 38px;
	}

	.csc-product-intro {
		align-items: flex-start;
		padding: 22px;
	}

	.csc-product-intro > i {
		display: none;
	}

	.csc-product-footer {
		align-items: stretch;
		flex-direction: column;
	}

	.csc-product-footer > a {
		justify-content: center;
		white-space: normal;
	}
}