/* /Public/CSS/Routes/Landings/TVRepair.css */
@media (prefers-reduced-motion: no-preference) {
	.tv-fault,
	.tv-how__step {
		transition: transform 0.25s ease, box-shadow 0.25s ease;
	}
	.tv-fault:hover,
	.tv-how__step:hover {
		transform: translateY(-3px);
	}
}


@media all and (max-width: 939px) {
	.first-screen-img {
		aspect-ratio: 4 / 3;
	}
}

/* region faults */
.tv-faults__header {
	margin-top: clamp(1.4rem, 3.5vw, 3rem); /* margin-top heading1 */
}

.tv-faults__lead {
	line-height: 1.5;
	color: var(--text-color2);
	font-size: clamp(1rem, 2.2vw, 1.4285rem);
}

.tv-fault {
	container: tv-fault / inline-size;
}
.tv-fault__container {
	display: flex;
	min-height: 100%;
}

.tv-fault__img {
	border-radius: var(--border-radius);
	aspect-ratio: 171 / 128;
	background: 50% 50% / cover no-repeat;
}
.tv-fault__info {
	container: tv-fault-info / inline-size;
	display: flex;
	flex-direction: column;
}
.tv-fault__title {
	margin-bottom: 0.45em;
	font-size: min(2.14rem, 10cqw);
}

.tv-fault__description {
	margin-bottom: 0.7em;
	line-height: 1.5;
	font-size: clamp(0.95rem, 5.36cqw, 1.14rem);
	color: var(--text-color2);
	flex-grow: 1;
}

.tv-fault__symptoms {
	font-size: clamp(0.85rem, 4.7cqw, 1rem);
	color: var(--text-color3);
}

@media all and (max-width: 767px) {
	.tv-fault {
		width: 100%;
	}
}

@container tv-fault (width < 450px) {
	.tv-fault__container {
		flex-direction: column;
	}
	.tv-fault__img {
		width: min(100%, 171px);
	}
	.tv-fault__info {
		flex-grow: 1;
	}
	.tv-fault__title {
		margin-top: 1em;
	}
}

@container tv-fault (width >= 450px) {
	.tv-fault__container {
		gap: 0 8%;
	}
	.tv-fault__img {
		width: min(34.2%, 171px);
		flex-shrink: 0;
		order: 2;
		align-self: flex-start;
	}
	.tv-fault__info {
		flex: 1;
	}
}

@media all and (max-width: 1379px) {
	.tv-faults__header > .heading1 {
		margin-bottom: 0.5em;
	}
	.tv-faults__lead {
		margin-bottom: clamp(1rem, 2.5vw, 2.1rem);
	}
}

@media all and (min-width: 1380px) {
	.tv-faults__header {
		margin-bottom: clamp(2rem, 5vw, 4.2857rem);
		display: flex;
		gap: 100px;
		justify-content: space-between;
		align-items: center;
	}
	.tv-faults__header > .heading1 {
		flex-shrink: 0;
	}
	.tv-faults__lead {
		text-align: right;
		align-self: flex-end;
	}
}
/* endregion */

/* region how */
.tv-how__num {
	font-size: clamp(2rem, 5vw, 3rem);
	font-weight: 700;
	line-height: 1;
	margin-bottom: 0.55em;
	color: var(--theme-color);
	font-variant-numeric: tabular-nums;
}

.tv-how__text {
	margin-top: 0.7em;
	line-height: 1.5;
	color: var(--text-color2);
	font-size: clamp(0.95rem, 2.2vw, 1.2142rem);
}

@media all and (max-width: 767px) {
	.tv-how__step {
		width: 100%;
	}
}
/* endregion */

/* region consultation */
.consultation-img {
	background: 100% 100% / cover no-repeat;
}
.consultation-info {
	container: consultation-info / inline-size;
}
.consultation-description {
	margin-bottom: 2em;
	font-size: clamp(1rem, 3cqw, 1.4285rem);
}
.consultation-description,
.consultation-feature__description {
	line-height: 1.5;
	color: var(--text-color2);
}
.consultation-feature__description {
	margin-top: 0.7em;
}
.consultation-feature {
	container: consultation-feature / inline-size;
}


@media all and (max-width: 767px) {
	.consultation-feature {
		width: 100%;
	}
	.consultation-feature__description {
		font-size: clamp(0.85rem, 5.5cqw, 1.21rem);
	}
}

@media all and (min-width: 768px) {
	.consultation-feature__description {
		font-size: clamp(0.85rem, 5.5cqw, 1.4285rem);
	}
}

@media all and (max-width: 839px) {
	.consultation-info,
	.consultation-img {
		width: 100%;
	}
	.consultation-img {
		margin-top: 40px;
		aspect-ratio: 4 / 3;
	}
}

@media all and (min-width: 840px) {
	.consultation-info {
		padding-bottom: 80px;
	}
	.consultation-info .heading1 {
		max-width: 10em;
	}
}

@media all and (min-width: 1024px) {
	.consultation-description {
		width: 80%;
	}
}
/* endregion */

/* FAQ */
@media all and (max-width: 1023px) {
	.tv-faq-container {
		gap: 0;
	}
	.tv-faq-header,
	.tv-faq__list {
		width: 100%;
	}
}

@media all and (min-width: 1024px) {
	.tv-faq-header {
		display: flex;
		justify-content: center;
	}
	.tv-faq-header .heading1 {
		max-width: 5em;
	}
}


.tv-faq__list {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.tv-faq__item {
	width: 100%;
}

.tv-faq__question {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75em;
	cursor: pointer;
	list-style: none;
	user-select: none;
}

.tv-faq__question::-webkit-details-marker {
	display: none;
}

.tv-faq__question::after {
	content: "";
	flex-shrink: 0;
	width: 0.55em;
	height: 0.55em;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform 0.2s ease;
	opacity: 0.55;
}

.tv-faq__item[open] > .tv-faq__question {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}

.tv-faq__item[open] > .tv-faq__question::after {
	margin-top: 0.55em;
	transform: rotate(-135deg);
}

.tv-faq__answer {
	line-height: 1.55;
	color: var(--text-color2);
	font-size: clamp(1rem, 2.1vw, 1.2142rem);
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	padding-top: 0;
}

/* region price box */
.price-box {
	container: prices-box / inline-size;
}
.price-box__table {
	color:var(--text-color2);
	font-size: clamp(1rem, 4.5cqw, 1.4285rem);
}
.price-box__table th,
.price-box__table td {
	padding-top: 0.35em;
	padding-bottom: 0.35em;
	vertical-align: bottom;
}
.price-box__table th:after,
.price-box__table td:before {
	content: '';
	display: block;
	position: absolute;
	bottom:0.45em;
	right: 0;
	border-bottom: 1px dashed var(--text-color4);
}
.price-box__table th:after {
	left:2em;
}
.price-box__table td:before {
	left:0;
}
.price-box__table th > span,
.price-box__table td > span {
	background: white;
	z-index: 1;
}
.price-box__table th > span {
	padding-right: 0.1em;
}
.price-box__table th {
	text-align: left;
	font-weight: normal;
	padding-left: 1em;
	padding-right: 1em;
}
.price-box__table th:before {
	content: '—';
	position: absolute;
	left:0;
}
.price-box__table td {
	text-align: right;
	white-space: nowrap;
}


@media all and (max-width: 767px) {
	.price-container {
		gap: 0;
	}
	.price-header,
	.price-box {
		width: 100%;
	}
}

@media all and (min-width: 768px) {
	.price-header .heading1 {
		max-width: 10em;
	}
}
/* endregion */

.contacts-img {
	background-position: 50% 50% !important;
}
/* /Public/CSS/Routes/Repairs/StatusCard.css */
.repair-status-card {
	container: repair-status-card / inline-size;
}

.modal-w__container .repair-status-card__section-title {
	font-size: 1.3em;
	font-weight: bold;
	margin-top: 1.5em;
	margin-bottom: 0.5em;
}

.repair-status-card__text {
	color:var(--text-color2);
}

.repair-status-card__spec-tbl {
	width: 100%;
	border-collapse: collapse;
}

.repair-status-card__spec-tbl td {
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	border-bottom: 1px solid hsl(from var(--theme-bg, var(--theme-bg-light)) h s calc(l - 5));
}
.repair-status-card__spec-tbl td:not(:first-child) {
	padding-left: 0.3571em;
}
.repair-status-card__spec-tbl td:first-child {
	padding-left: 0.1428em;
}
.repair-status-card__spec-tbl td:not(:last-child) {
	padding-right: 0.3571em;
}
.repair-status-card__spec-tbl td:last-child {
	padding-right: 0.1428em;
}

.repair-status-card__spec-tbl thead {
	font-weight: bold;
	font-size: 0.9em;
	color:var(--text-color2);
}
.repair-status-card__spec-tbl tfoot {
	font-weight: bold;
	font-style: italic;
}

/* images */
.repair-status-card-images {
	display: flex;
	flex-wrap: wrap;
	gap:10px;
}
.repair-status-card-img {
	aspect-ratio: 4 / 3;
	border-radius: var(--border-radius);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: cover;
}


@container (max-width: 359px) {
	.repair-status-card-img {
		width: calc(50% - 5px);
	}
}

@container (min-width: 360px) and (max-width: 479px) {
	.repair-status-card-img {
		width: calc((100% - 20px) / 3);
	}
}

@container (min-width: 480px) and (max-width: 599px) {
	.repair-status-card-img {
		width: calc((100% - 30px) / 4);
	}
}

@container (min-width: 600px) {
	.repair-status-card-img {
		width: 150px;
	}
}
/* END images */
/* /Public/CSS/Templates/Contacts.css */
/* region contacts */
.contacts-info {
	font-size: clamp(1rem, 1.7vw, 1.7142rem);
	font-weight: 600;
	padding-bottom: clamp(1.4rem, 3.5vw, 3rem);
}
.contacts-box {
	background: white;
	border-radius: var(--border-radius);
	padding: 0.5em 1em;
	min-height: 3.7em;
	display: flex;
	align-items: center;
	gap:0.7em;
}
.contacts-icon {
	text-align: center;
}
.contacts-phones,
.contacts-messengers {
	display: flex;
}
.contacts-phones .contacts-item {
	flex-grow: 1;
}
.contacts-item .contacts-icon {
	fill: currentColor;
	height: 1.25em;
	width: 1.5em;
}

a.contacts-item:hover {
	background: var(--theme-color);
	color: white;
}

.contacts-messenger {
	display: flex;
	align-items: center;
	justify-content: center;
}

.contacts-messenger .contacts-icon {
	height: 1.5em;
	width: 2em;
}
.contacts-messenger .contacts-icon:not(:hover) svg {
	fill: currentColor;
}

.contacts-messenger.whatsapp svg {
	left:0.05em;
}

.contacts-img {
	background: 100% 0 / cover no-repeat;
	aspect-ratio: 1024 / 670;
}


@media all and (max-width: 429px) {
	.contacts-boxes,
	.contacts-phones,
	.contacts-messengers {
		gap:10px;
	}
	.contacts-phones {
		flex-wrap: wrap;
	}
	.contacts-messengers,
	.contacts-messenger {
		flex-grow: 1;
	}
}

@media all and (min-width: 430px) {
	.contacts-phones,
	.contacts-messengers {
		gap:20px;
	}
}

@media all and (min-width: 430px) and (max-width: 767px) {
	.contacts-boxes {
		gap:20px;
	}
}

@media all and (max-width: 767px) {
	.contacts-info,
	.contacts-img {
		width: 100%;
	}
	.contacts-boxes {
		display: flex;
		flex-wrap: wrap;
	}
	.contacts-row {
		flex-grow: 1;
	}
}

@media all and (min-width: 768px) {
	.contacts-phones {
		margin-bottom: 20px;
	}
	.contacts-row {
		width: min(100%, 25em);
	}
	.contacts-info {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
}
/* endregion */

/* region map */
.address-map {
	height: min(400px, 100vw);
	overflow: hidden;
}
.address-map-loading {
	color:var(--text-color3);
	font-size: clamp(1rem, 1.7vw, 1.4285rem);
	text-align: center;
}
.address-map-container {
	position: absolute;
	inset: 0;
}
/* endregion map */