/*
=========================================================
STRUCTURE.CSS
Fase 6 — páginas genéricas, búsqueda y error 404
Maceta y Cortafrío
=========================================================
*/

.generic-page,
.search-page,
.error-page{
	background:var(--white);
}

/* =====================================================
   HERO
===================================================== */

.generic-page .page-header,
.search-page__hero,
.error-page__hero{
	padding:3.5rem 0 2.75rem;
	text-align:center;
	background:linear-gradient(180deg,var(--surface),var(--white));
}

.generic-page .page-header .container,
.search-page__hero .container,
.error-page__hero .container{
	max-width:900px;
}

.generic-page .page-header h1,
.search-page__hero h1,
.error-page__hero h1{
	max-width:17ch;
	margin:0 auto 1rem;
	font-size:clamp(2.5rem,3.8vw,3.8rem);
	line-height:1.05;
	letter-spacing:-.02em;
	text-wrap:balance;
}

.search-page__hero p,
.error-page__lead{
	max-width:700px;
	margin:0 auto;
	color:var(--text-light);
	font-size:1rem;
	line-height:1.7;
}

/* =====================================================
   PÁGINA GENÉRICA
===================================================== */

.generic-page .page-content{
	padding:3.75rem 0;
}

.generic-page .page-content .container{
	max-width:820px;
}

.generic-page .page-content section{
	padding:0;
	margin:0 0 3rem;
}

.generic-page .page-content h2{
	margin:2.5rem 0 1rem;
	font-size:clamp(1.85rem,2.7vw,2.5rem);
	line-height:1.14;
	text-wrap:balance;
}

.generic-page .page-content h3{
	margin:2rem 0 .75rem;
	font-size:clamp(1.3rem,1.8vw,1.65rem);
	line-height:1.25;
}

.generic-page .page-content p,
.generic-page .page-content li{
	line-height:1.75;
}

.generic-page .page-content ul,
.generic-page .page-content ol{
	margin:1rem 0 1.75rem;
	padding-left:1.35rem;
}

/* =====================================================
   BÚSQUEDA
===================================================== */

.search-page__content,
.error-page__content{
	padding:3.5rem 0 5rem;
}

.search-form{
	display:flex;
	gap:.75rem;
	max-width:720px;
	margin:1.75rem auto 0;
}

.search-form__label{
	flex:1;
}

.search-form__field{
	width:100%;
	height:52px;
	padding:0 1rem;
	background:var(--white);
	border:1px solid var(--gray-300);
	border-radius:var(--radius-md);
	color:var(--heading-color);
}

.search-form__field:hover{
	border-color:var(--gray-400);
}

.search-form__field:focus{
	outline:3px solid rgba(197,157,47,.18);
	outline-offset:1px;
	border-color:var(--color-secondary);
}

.search-form__submit{
	min-width:120px;
}

.search-results-grid{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:1.25rem;
	max-width:1000px;
	margin:0 auto;
}

.search-result-card{
	padding:1.5rem;
	background:var(--white);
	border:1px solid var(--gray-200);
	border-radius:var(--radius-lg);
	box-shadow:var(--shadow-sm);
}

.search-result-card__type{
	margin:0 0 .45rem;
	color:var(--color-secondary-dark);
	font-size:.78rem;
	font-weight:var(--weight-semibold);
	letter-spacing:.06em;
	text-transform:uppercase;
}

.search-result-card h2{
	margin-bottom:.65rem;
	font-size:1.3rem;
	line-height:1.3;
	text-wrap:balance;
}

.search-result-card h2 a{
	color:var(--heading-color);
	text-decoration:none;
}

.search-result-card h2 a:hover,
.search-result-card h2 a:focus-visible{
	color:var(--color-secondary-dark);
	text-decoration:underline;
}

.search-result-card p:last-child{
	margin:0;
	color:var(--text-light);
	line-height:1.65;
}

/* =====================================================
   VACÍO / 404
===================================================== */

.empty-state,
.error-page__box{
	max-width:760px;
	margin:0 auto;
	padding:2rem;
	background:var(--surface);
	border:1px solid var(--gray-200);
	border-radius:var(--radius-lg);
	text-align:center;
}

.empty-state h2,
.error-page__box h2{
	margin-bottom:.75rem;
	font-size:clamp(1.7rem,3vw,2.4rem);
}

.error-page__code{
	margin:0 0 .5rem;
	color:var(--color-secondary);
	font-family:var(--font-display);
	font-size:clamp(4rem,10vw,7rem);
	line-height:1;
}

.error-page__links{
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	gap:.75rem;
	margin:1.5rem 0 0;
	padding:0;
	list-style:none;
}

.error-page__links a{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-height:44px;
	padding:.7rem 1rem;
	border:1px solid var(--gray-300);
	border-radius:var(--radius-pill);
	color:var(--heading-color);
	font-weight:var(--weight-semibold);
	text-decoration:none;
}

.error-page__links a:hover,
.error-page__links a:focus-visible{
	border-color:var(--color-secondary);
	color:var(--color-secondary-dark);
}

.error-page__actions{
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	gap:.75rem;
	margin-top:1.5rem;
}

/*
 * La antigua excepción `.generic-page--reformas-accesibles-madrid`
 * se elimina de la arquitectura CSS.
 * Las páginas de servicio deben usar la plantilla Servicio y service.css.
 */

/* =====================================================
   RESPONSIVE
===================================================== */

@media (max-width:700px){
	.generic-page .page-header,
	.search-page__hero,
	.error-page__hero{
		padding:2.75rem 0 2.25rem;
	}

	.generic-page .page-header h1,
	.search-page__hero h1,
	.error-page__hero h1{
		font-size:clamp(2.2rem,10vw,2.9rem);
	}

	.generic-page .page-content,
	.search-page__content,
	.error-page__content{
		padding:3rem 0;
	}

	.search-form{
		flex-direction:column;
	}

	.search-form__submit{
		width:100%;
	}

	.search-results-grid{
		grid-template-columns:1fr;
	}

	.empty-state,
	.error-page__box{
		padding:1.5rem;
	}
}