h1.title:before, h1.title:after {
    border:0;
}

h2.title:before, h2.title:after {
    border-color:#D4D4D4;
}

.podcast-most-title {
		margin-top:8px;
}

.podcast-most-title:before,.podcast-most-title:after {
		border-color:#C8A78C !important;
}


#posts {
	display: grid;
	grid-template-columns: 1fr; 
	grid-gap: calc( var(--space) * 2 );
	list-style: none;
	margin: 0;
	padding: 0 calc( var(--space) * 2 );
}
#posts li {
	padding: 0;
	position: relative;
	border: 2px solid transparent;
	transition: all .3s ease;
}
#posts li:hover {
	border-color: var(--background1);
}
	#posts a {
		text-decoration: none;
	}
		#posts img {
			max-width: 100%;
			width: 100%;
			height: auto;
		}
		#posts .date {
			position: absolute;
			top: var(--15px);
			left: calc( var(--30px) * -1 );
			border: var(--3px) solid var(--background1);
			background: #fff;
			color: var(--background1);
			text-align: center;
			width: var(--50px);
			height: var(--50px);
			font-size: var(--18px);
			line-height: var(--18px);
			font-weight: 600;
			display: grid;
			align-content: center;
		}
		#posts .month {
			display: block;
			font-weight: 500;
			font-size: var(--16px);
		}
		#posts h3 {
			text-align: center;
			margin: 0 0 var(--15px) 0;
			padding: var(--10px) var(--10px) var(--20px) var(--10px);
			font-size: var(--20px);
			line-height: var(--28px);
			color: #4f4f4f;
			font-weight: 700;
			position: relative;
		}

		#posts h3:after {
			content: " ";
			position: absolute;
			left: calc( 50% - var(--30px) );
			width: var(--60px);
			bottom: 0;
			border-bottom: var(--5px) solid #dddee0;
		}
	
		#posts p {
			text-align: center;
			color: #777;
			padding: 0 var(--15px);
			line-height: var(--21px);
		}

@media (min-width: 768px)
{
	#posts {
		grid-template-columns: 1fr 1fr 1fr;
		padding: 0 var(--space);
	}
		#posts .date {
			border: var(--5px) solid var(--background1);
			width: var(--85px);
			height: var(--85px);
			font-size: var(--26px);
			line-height: var(--28px);
		}
		#posts .month {
			font-size: var(--22px);
		}
		#posts h3 {
			font-size: var(--24px);
			line-height: var(--32px);
		}
		#posts p {
			padding: 0 var(--15px);
			line-height: var(--24px);
		}
	
		.hidden-md {
				display:none;
		}

}

@media all and (max-width:768px)
		{
			
			.hidden-xs {
				display:none;
			}
			#posts {
				padding: 0 calc(var(--space)* 0);
			}
		}			


/* Grid propio: 2 por fila en móvil, 5 por fila en escritorio */
.grid-5 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);   /* móvil: 2 por fila */
  gap: 20px;                                /* espacio entre elementos */
}

/* Anula el "span" que heredan de col-6 / col-md-2 */
.grid-5 > * {
  grid-column: auto;
  width: 100%;
	margin-top:30px;
}

.grid-5 img {
  width: 100%;
  height: auto;
  max-width: 100%;
  display: block;
}


/* Centrar el contenido de cada elemento */
.grid-5 > div {
  text-align: center;
}

/* Título con la rayita encima */
.grid-5 .faq-cat {
  display: block;
  position: relative;
  margin-top: 24px;
  padding-top: 20px;          /* hueco para la rayita */
  font-size: 17px;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: #3a3a3a;
  line-height: 1.25;
}

.grid-5 .faq-cat::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 34px;               /* largo de la rayita */
  height: 2px;               /* grosor */
  background: #e0a48d;       /* mismo tono coral de los círculos; ajústalo */
}


@media (min-width: 1025px) {
  .grid-5 {
    grid-template-columns: repeat(5, 1fr); /* escritorio: 5 por fila */
  }
}

.accordion {
	margin: 0;
	padding: 0;
	list-style: none;
}
	.accordion li {
		padding: 0 0 var(--10px) 0;
	}
	.accordion h3 {
		padding: var(--15px) var(--45px) var(--15px) var(--15px);
		margin: 0;
		background: #eee;
		position: relative;
		cursor: pointer;
		transition: all .3s ease;
		font-weight: 600;
	}
	.accordion h3:hover {
		background: #ddd;
	}
	.accordion h3:after {
		content: "\e913";
		font-family: clinicaplanas;
		font-size: var(--18px);
		position: absolute;
		right: 0;
		top: 0;
		bottom: 0;
		width: var(--45px);
		display: flex;
		align-items: center;
		justify-content: center;
		transition: all .3s ease;
	}
		.accordion li > h3 + div {
			display: none;
			padding: var(--15px) var(--30px);
			border: 1px solid #eee;
		}
		
		.accordion li.open > h3 + div {
			display: block;
		}
		.accordion li.open h3:after {
			transform: rotate(180deg);
		}

	@media all and (max-width: 767px) {

		.accordion h3 {
			font-size: var(--16px);
			line-height: var(--24px);
		}

	}

/* FAQ — mismo estilo que el acordeón de lipoescultura-hd */
.faq-container { margin: 50px 0; padding: 0; list-style: none; }

.faq-item { padding: 0 0 var(--3px) 0; }

/* Barra clicable (tu <button>) */
.faq-question {
	display: block;
	width: 100%;
	margin: 0;
	padding: var(--15px) var(--45px) var(--15px) var(--15px);
	background: #eee;
	border: 0;
	position: relative;
	cursor: pointer;
	text-align: left;
	transition: all .3s ease;
}
.faq-question:hover { background: #ddd; }

/* Texto de la pregunta */
.faq-question-text {
	margin: 0;
	font-family: Montserrat, sans-serif;
	font-weight: 600;
	font-style: italic;
	font-size: 15px;
	line-height: 1.4;
	color: #4c4c4b;
}

/* Sustituyo la flecha ▼ por el icono de la fuente clinicaplanas */
.faq-arrow { display: none; }

.faq-question::after {
	content: "\e913";
	font-family: clinicaplanas;
	font-size: var(--18px);
	position: absolute;
	right: 0; top: 0; bottom: 0;
	width: var(--45px);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform .3s ease;
}

/* Respuesta: colapsada por defecto */
.faq-answer {
	display: none;
	padding: var(--15px) var(--30px);
	border: 1px solid transparent;
}

/* Estado abierto */
.faq-question[aria-expanded="true"] + .faq-answer { display: block; }
.faq-question[aria-expanded="true"]::after { transform: rotate(180deg); }

@media (min-width: 1024px) { .faq-question-text { font-size: var(--22px); } }
@media (max-width: 767px)  { .faq-question-text { font-size: var(--16px); line-height: var(--24px); } }