main section.center-container.guias-page{

	position: relative;

	background: linear-gradient(

		360deg,

		rgb(255, 140, 0) 23%,

		rgb(255, 198, 1) 100%

	);

	padding-bottom: 20px;

}



main section.center-container.guias-page::before{

	content: '';

	position: absolute;

	inset: 0;

	background-image: url('../img/fondo.webp');

	background-repeat: repeat-y;

	background-position: center top;

	background-size: 100% auto;

	pointer-events: none;

}



main .guias-page{

	padding-bottom: 24px;

}



main .guias-wraper{

	width: 100%;

	min-height: auto;

	border-width: 7px 5px 5px 5px;

	border-style: solid;

	border-color: rgba(0, 0, 0, 1);

	background: #161313;

	box-sizing: border-box;

	display: flex;

	align-items: stretch;

}



main .guias-layout{

	display: flex;

	width: 100%;

	align-items: stretch;

}



main .guias-sidebar{

	flex: 0 0 390px;

	max-width: 390px;

	border-right: 1px solid black;

	background: #0a0a0a;

}



main .guias-sidebar-head{

	padding: 22px 24px 18px;

	border-bottom: 1px solid rgba(255, 180, 0, 0.25);

}



main .guias-sidebar-head h2{

	margin: 0;

	font-family: 'anime-950', sans-serif;

	font-size: 1.85rem;

	line-height: 1.15;

	color: #ffb400;

	text-transform: uppercase;

	letter-spacing: 0.02em;

}



main .guias-accordion{

	display: flex;

	flex-direction: column;

	gap: 4px;

	padding: 16px 5px 20px;

}



main .guias-accordion-item{

	border: 0;

	border-bottom: 0;

	box-shadow: none;

}



main .guias-accordion-trigger{

	width: 100%;

	display: flex;

	align-items: center;

	gap: 10px;

	padding: 15px 20px;

	border: 0;

	border-bottom: 0;

	box-shadow: none;

	background: #1a1a1a;

	color: #fff;

	text-align: left;

	cursor: pointer;

	transition: background 0.25s ease, color 0.25s ease;

}



main .guias-accordion-trigger:focus,

main .guias-accordion-trigger:focus-visible{

	outline: none;

	box-shadow: none;

}



main .guias-accordion-item.is-open .guias-accordion-trigger{

	background: #ffb400;

	color: #111;

	border: 0;

	border-bottom: 0;

	box-shadow: none;

}



main .guias-accordion-number{

	font-family: 'anime-950', sans-serif;

	font-size: 1rem;

	flex-shrink: 0;

}



main .guias-accordion-title{

	flex: 1;

	font-family: 'quicksand-semibold', sans-serif;

	font-size: 0.8rem;

	line-height: 1.25;

	text-transform: uppercase;

}



main .guias-accordion-icon{

	font-size: 0.85rem;

	transition: transform 0.3s ease;

}



main .guias-accordion-item:not(.is-open) .guias-accordion-icon{

	transform: rotate(180deg);

}



main .guias-accordion-panel{

	display: grid;

	grid-template-rows: 0fr;

	transition: grid-template-rows 0.35s ease;

	overflow: hidden;

}



main .guias-accordion-item.is-open .guias-accordion-panel{

	grid-template-rows: 1fr;

}



main .guias-accordion-panel-inner{

	padding: 0;

	background: transparent;

	min-height: 0;

	overflow: hidden;

}



main .guias-accordion-item.is-open .guias-accordion-panel-inner{

	background: #0a0a0a;

}



main .guias-accordion-item:not(.is-open) .guias-accordion-panel-inner{

	background: transparent;

}



main .guias-accordion-links{

	list-style: none;

	margin: 0;

	padding: 0;

}



main .guias-accordion-item.is-open .guias-accordion-links{

	padding: 8px 0 0;

}



main .guias-accordion-links li{

	margin: 0;

}



main .guias-accordion-links a{

	display: flex;

	align-items: center;

	gap: 12px;

	padding: 11px 20px 11px 26px;

	color: #d8d8d8;

	text-decoration: none;

	font-family: 'popins-light', sans-serif;

	font-size: 0.9rem;

	line-height: 1.4;

	transition: background 0.2s ease, color 0.2s ease;

}



main .guias-accordion-links a:hover,

main .guias-accordion-links li.is-active a,

main .guias-accordion-links a.is-active{

	background: rgba(255, 180, 0, 0.12);

	color: #ffb400;

}



main .guias-item-check{

	width: 24px;

	height: 24px;

	border-radius: 50%;

	border: 2px solid rgba(255, 180, 0, 0.45);

	display: inline-flex;

	align-items: center;

	justify-content: center;

	flex-shrink: 0;

	color: transparent;

	font-size: 0.68rem;

	transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;

}



main .guias-item-check.is-done{

	background: #ff7a00;

	border-color: #ff7a00;

	color: #fff;

}



main .guias-section-status{

	display: flex;

	flex-direction: column;

	align-items: center;

	justify-content: center;

	gap: 6px;

	padding: 12px 18px 0;

}



main .guias-section-status img{

	width: 42px;

	height: auto;

	opacity: 0.9;

}



main .guias-section-status span{

	font-family: 'anime-800', sans-serif;

	font-size: 0.78rem;

	color: #39d66b;

	text-transform: uppercase;

	letter-spacing: 0.04em;

}



main .guias-content{

	flex: 1;

	min-width: 0;

	padding: 0;

	background: #0e0e0e;

}



main .guias-article-panel{

	display: block;

}



main .guias-article-header{

	width: 100%;

	box-sizing: border-box;

	background: #141414;

	border-bottom: 2px solid #040404;

}



main .guias-article-header-body{

	display: flex;

	align-items: center;

	justify-content: space-between;

	gap: 16px;

	padding: 36px 28px;

}



main .guias-article-kicker{

	display: inline-flex;

	align-items: center;

	gap: 8px;

	flex-shrink: 0;

	padding: 5px 12px;

	background: #ffb400;

	color: #111111;

	font-family: 'anime-800', sans-serif;

	font-size: 0.78rem;

	line-height: 1;

	text-transform: uppercase;

	letter-spacing: 0.06em;

}



main .guias-article-title{

	margin: 0;

	flex: 1;

	min-width: 0;

	font-family: 'anime-950', sans-serif;

	font-size: 2rem;

	line-height: 1.15;

	color: #ffffff;

	text-transform: uppercase;

}



main .guias-article-body{

	padding: 15px 28px;

	background: #1c1919;

	min-height: min-content;

	overflow: hidden;

}



main .guias-article-empty{

	display: flex;

	align-items: center;

	gap: 10px;

	margin: 0;

	padding: 18px 0;

	color: #bdbdbd;

	font-family: 'quicksand-medium', sans-serif;

	font-weight: 500;

	font-size: 1rem;

}



main .guias-article-empty i{

	color: #ffb400;

}



@media (max-width: 991px){

	main .guias-wraper{

		flex-direction: column;

	}



	main .guias-layout{

		flex-direction: column;

	}



	main .guias-sidebar,

	main .guias-content{

		flex: 1 1 auto;

		width: 100%;

		max-width: 100%;

		min-width: 0;

	}



	main .guias-sidebar{

		border-right: 0;

		border-bottom: 1px solid rgba(255, 180, 0, 0.35);

	}



	main .guias-accordion-trigger{

		padding: 14px 16px;

	}



	main .guias-accordion-links a{

		padding: 11px 16px 11px 20px;

		font-size: 0.88rem;

	}



	main .guias-article-header-body{

		flex-direction: column;

		align-items: flex-start;

		gap: 12px;

		padding: 28px 16px;

	}



	main .guias-article-kicker{

		align-self: flex-end;

	}



	main .guias-article-body{

		padding: 18px 16px 20px;

	}



	main .guias-article-title{

		font-size: 1.55rem;

	}

}



@media screen and (max-width: 575px){

	main .guias-sidebar-head h2{

		font-size: 1.45rem;

	}



	main .guias-accordion-title{

		font-size: 0.88rem;

	}

}


