html, body {
	font-family: 'Inter', sans-serif;
	line-height: 1.2;
	color: #171A20;
	font-size: 14px;
}

.bg-black{
	background-color: #171A20;
}

.btn, a.wp-block-button__link {
	padding: 8px 30px;
	font-size: 14px;
	border-radius: 5px;
	border: 1px solid;
	display: flex;
	align-items: center;
	gap: 5px;
}

.btn.bg-white {
	background-color: white;
	border-color: white;
	color: #171A20;
}

.btn.bg-white:hover {
	background-color: #171A20;
	border-color: white;
	color: white;
}

.btn.bg-black {
	background-color: #171A20;
	border-color: #171A20;
	color: white;
}

.btn.bg-black:hover {
	background-color: white;
	border-color: #171A20;
	color: #171A20;
	border-width: 1px;
}

.btn.btn-black-outline{
	background-color: transparent;
	border: 1px solid #171A20;
	color: #171A20;
}

.btn.btn-black-outline:hover{
	background-color: black !important;
	color: white;
}

.btn.btn-white-outline{
	background-color: transparent;
	border: 1px solid white;
	color: white;
}

.btn.btn-white-outline:hover{
	background-color: white !important;
	color: black;
}

.content table.mini.producto td {
	padding-left: 0 !important;
	border-bottom: 1px solid #171A20;
}

.content li::marker, .wp-block-rank-math-toc-block nav ol li::before {
	color: #171A20;
}

.accordion .item {
	border-top: 1px solid var(--lightgrey);
	border-bottom: 1px solid var(--lightgrey);
}

.accordion .item:hover .title, .accordion .item.active .title {
	color: var(--grey);
}

input[type="text"], input[type="email"], input[type="tel"], select {
	font-size: 14px;
	color: #171A20;
	width: 100%;
	padding: 10px 15px;
	border: 1px solid #EFEFEF;
	background-color: #EFEFEF;
	border-radius: 5px;
	height: auto;
}

textarea{
	padding: 10px 15px;
	border: 1px solid #EFEFEF;
	background-color: #EFEFEF;
	border-radius: 5px;
}

form input[type="checkbox"] {
	border: 1px solid #171A20;
}

form [type="checkbox"]::before {
	box-shadow: inset 1em 1em #171A20;
}

input.wpcf7-not-valid{
	border: 2px solid #F48484;
}

.wpcf7-list-item {
	margin: 0;
}

#product #content-product{
	height: calc(100dvh - 100px);
}

#product #content-product .description .imagen-destacada{
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 20px;
}

#product #content-product .description .imagen-destacada img{
	max-width: 50%;
	height: auto
}

#product .confi-footer {
	border: none;
	padding: 20px;
	width: 100%;
	overflow: hidden;
	order: 3;
}

#product .item-sumary{
	width: 100%;
	border-bottom: 1px solid black;
	padding-bottom: 5px;
	font-size: 12px;
}

#product .item-sumary:last-child{
	border-bottom: none;
}

#product .item-sumary .key{
	margin-right: 5px;
}

#product .confi-footer #steps {
	gap: auto;
	width: auto;
	justify-content: space-between;
}

#product .confi-footer #steps mark{
	display: none;
}

#product .confi-footer #steps::before {
	height: 1px;
	background-color: black;
	top: 3px;
}

#product .confi-footer #steps span {
	width: 6px;
	height: 6px;
	background-color: white;
	border: 1px solid black;
}

#product .confi-footer #steps span.active{
	background-color: black;
}

#product #confi-product .options label {
	width: fit-content;
	min-width: auto;
	padding: 10px 25px;
	border: 1px solid black;
	border-radius: 5px;
}

#product #confi-product .options label span:first-of-type::before,
#product #confi-product .options label span.active:first-of-type::after,
#product #confi-product .options label.active span:first-of-type::after {
	display: none !important;
}

#product #confi-product .options label:hover,
#product #confi-product .options label.active {
	background-color: black;
	color: white;
}

#product .confi-footer .button-nav:not(.swiper-button-disabled):hover {
	background-color: white;
	opacity: 0.5;
}

#lading-tesla #visor figure img{
	border-radius: 5px;
}

#lading-tesla #visor .description{
	overflow-x: scroll;
	height: 100%;
	display: flex;
	flex-direction: column;
}

#product #visor figure.pasos_estaticos img {
	max-width: 100%;
	height: auto;
	max-height: calc(100dvh - 20%);
	object-fit: contain;
}

@media screen and (max-width:1024px) {

	#lading-tesla section.h-100,
	#lading-tesla div.h-100{
		height: auto;
	}

	#lading-tesla section.h-100 div figure.absolute.inset,
	#lading-tesla div.h-100 div figure.absolute.inset{
		position: relative;
	}

	#hero{
		padding-top: 150px;
	}

	#lading-tesla #hero .block-2{
		justify-content: center;
	}

	#lading-tesla #hero .block-2 h1{
		font-size: 28px;
	}

	#lading-tesla #visor{
		padding-bottom: 0;
		order: 2;
	}

	#lading-tesla div.max-w-400{
		padding-left: var(--space-30);
		max-width: none;
		width: 100%;
	}

	#lading-tesla section.items-start{
		flex-direction: column;
		gap: var(--space-20);
	}

	#product #content-product {
		height: fit-content;
	}

	#content-product .max-w-400 > .pr-50{
		padding-right: 0;
	}

	#lading-tesla #visor {
		height: fit-content;
		overflow: visible;
	}

	#product #visor #mapa-instalacion {
		height: calc(50vh - 100px);
	}

	#lading-tesla div.items-end{
		align-items: center;
	}

	#lading-tesla section div.h-100{
		height: auto;
	}

	#lading-tesla a.w-full.btn{
		width: fit-content;
	}

	#lading-tesla .grid.grid-cols-2{
		grid-template-columns: repeat(2, 1fr);
		gap: 30px;
	}

	.presupuesto-tesla section > div.flex {
		flex-direction: column;
		gap: 40px;
	}

	.presupuesto-tesla section > div > div.flex{
		display: none;
	}

	.mb-100 {
		margin-bottom: 40px;
	}

	.p-100{
		padding: 40px;
	}

	.p-150{
		padding: 50px;
	}

	.pt-150{
		padding-top: 50px;
	}

	.py-150{
		padding-top: 50px;
		padding-bottom: 50px;
	}

	#lading-tesla.index #hero div.flex.gap-80{
		flex-direction: column;
	}

	#lading-tesla.index #hero div.flex.gap-80 > div{
		align-items: center;
	}

	#lading-tesla.index #hero div.flex.gap-80 img{
		max-width: 120px;
	}

	#lading-tesla.index section:last-child div.items-center{
		flex-direction: column;
	}

}

@media screen and (max-width:640px) {

	header img{
		width: 200px !important;
		margin-right: -20px;
	}

	.py-150{
		padding-top: 25px;
		padding-bottom: 25px;
	}

	#lading-tesla #visor figure img {
		border-radius: 0;
	}

}