/* Colores */
:root {
  --vc: #dddfd5;
  --vo: #738061;
}


/* Clean */
html, body, .post, .page {
	margin: 0;
	padding: 0;
}
.entry-header, .current_page_item, .post-thumbnail {
	display: none;
}


/* Base */
body {
	font-family: "Raleway", sans-serif;
	font-weight: 500;
}


/* Cabecera */
.site-header {
	position: relative;
}
header nav {
	position: absolute;
	padding: 0 1rem;
	top: 1rem;
	max-width: 1080px;
	width: 100%;
	right: 50%;
	transform: translateX(50%);
	ul {
		list-style: none;
		display: flex;
		flex-direction: row;
		justify-content: end;
		text-align: right;
		margin: 0;
		padding: 0;
		li {
			margin-left: 1rem;
			a {
				color: white;
				text-decoration: none;
				text-shadow: 1px 1px 1px var(--vo);
			}
			a:hover, a:visited {
				color: white;
			}
		}
	}
}
.cabecera {
	height: 500px;
	background-image: url(https://cantino39lugo.com/wp-content/uploads/2025/09/fondo-cabecera-5.jpg);
	background-size: cover;
	background-position: 50% 60%;
	display: grid;
	div {
		position: relative;
		width: 100%;
		max-width: 1080px;
		margin: 0 auto;
		padding: 0 1rem;
		a {
			position: absolute;
			top: 1rem;
			left: 1rem;
			width: 100px;
			z-index: 20;
		}
		div {
			align-content: center;
			height: 100%;
			padding-bottom: 3rem;
			h1 {
				font-family: "Bodoni Moda", serif;
				color: var(--vo);
			}
			p {
				color: white;
			}			
		}
	}
}
.info-fondo {
	background-image: url(https://cantino39lugo.com/wp-content/uploads/2025/09/cabecera-04.jpg);
	background-position: 90% 35% !important;
	height: 300px;
}
.lugo-fondo {
	background-image: url(https://cantino39lugo.com/wp-content/uploads/2025/09/cabecera-03.jpg);
	background-position: 90% 0% !important;
	height: 300px;
}

/* Galeria */
.galeria {
	background-color: var(--vc);
	padding: 1rem 0;
	> div {
		max-width: 1080px;
		margin: 0 auto;
	}
}


/* Reservas */
.reservas {
	background-color: var(--vc);
/* 	box-shadow: 1px 1px 6px var(--vo); */
	max-width: 1080px;
	margin: 0 auto;
	margin-top: -90px;
	z-index: 10;
	position: relative;
	text-align: center;
	padding: 1rem;
	h2 {
		font-weight: 600;
		color: var(--vo);
		margin-bottom: 1rem;
	}
	a {
		display: inline-block;
		background-color: white;
		padding: .6rem 1rem .6rem 3rem;
		border-radius: 2rem;
		margin: .5rem;
		color: var(--vo);
		text-decoration: none;
		transition: all ease-in-out .2s;
		box-shadow: 1px 1px 2px var(--vo);
	}
	a:hover, a:visited {
		color: var(--vo);
		box-shadow: 0px 0px 1px var(--vo);
	}
	.reserva-airbnb {
		background-image: url(https://cantino39lugo.com/wp-content/uploads/2025/09/reserva-airbnb.png);
	}
	.reserva-booking {
		background-image: url(https://cantino39lugo.com/wp-content/uploads/2025/09/reserva-booking.png);
	}
	.reserva-tel {
		background-image: url(https://cantino39lugo.com/wp-content/uploads/2025/09/reserva-tel.png);
	}
	.reserva-airbnb, .reserva-booking, .reserva-tel {
		background-size: 2rem;
		background-repeat: no-repeat;
		background-position: .5rem center;
	}
}


/* Lugo */
.lugo {
	max-width: 1080px;
	margin: 2rem auto 0;
	> div {
		padding: 1rem 0;
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 2rem;
		align-items: center;
		h2 {
			font-family: "Bodoni Moda", serif;
			color: var(--vo);
		}
		p {
			color: var(--vo);
		}
		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
		}
		div {
			padding: 0 1rem;
		}
	}
}

/* Info */
.info-menu {
	max-width: 1080px;
	margin: 0 auto;
	text-align: center;
	display: flex;
	justify-content: center;
	a {
		text-decoration: none;
		color: var(--vo);
		display: flex;
		align-items: center;
		justify-items: center;
		padding: 0 1rem;
	}
	img {
		width: 32px;
		height: 32px;
		display: inline;
		margin-top: -5px;
	}
	p {
		display: inline;
	}
}
.parking {
	max-width: 1080px;
	margin: 2rem auto 0;
	padding: 0 1rem;
	> div {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 1rem;
		iframe {
			border: 0;
			width: 100%;
			height: 300px;
		}
	}
	h2 {
		font-family: "Bodoni Moda", serif;
		color: var(--vo);
	}
}
.restaurantes {
	max-width: 1080px;
	margin: 2rem auto 0;
	padding: 0 1rem;
	> div div {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr 1fr;
		gap: .5rem;
		p {
			background-color: var(--vc);
			text-align: center;
			padding: 1rem 0;
			margin: 0;
			display: grid;
      		align-content: center;
		}
		a {
			color: var(--vo);
			text-decoration: none;
		}
		a:hover {
			color: white;
		}
	}
	h2 {
		font-family: "Bodoni Moda", serif;
		color: var(--vo);
	}
}



/* Alojamiento*/
.alojamiento {
	max-width: 1080px;
	margin: 2rem auto 0;
	.alojamiento-1, .alojamiento-2, .alojamiento-3 {
		padding: 1rem 0;
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 2rem;
		align-items: center;
		h2 {
			font-family: "Bodoni Moda", serif;
			color: var(--vo);
		}
		p {
			color: var(--vo);
		}
		div {
			padding: 0 1rem;
		}
	}
}

/* Comentarios */
.comentarios {
	max-width: 1080px;
	margin: 0 auto;
	padding: .5rem;
}

/* Mapa */
.mapa {
	iframe {
		width: 100%;
		height: 300px;
		border: 0;
	}
}


/* Políticas */
.politicas {
	max-width: 1080px;
	margin: 0 auto;
	padding: 0 1rem;
}


/* footer */
footer {
	margin: 1rem 0 0 0;
	background-color: var(--vo);
	text-align: center;
	color: white;
	img {
		width: 150px;
		padding: .5rem 0;
	}
	address {
		font-style: normal;
		p {
			line-height: 1.3;
			margin: 0;
		}
	}
	a {
		color: white;
	}
	a:hover, a:visited {
		color: var(--vc);
	}
	.legal {
		font-size: .7rem;
		padding: 0 0 .5rem;
	}
}


@media only screen and (max-width: 600px) {
	.cabecera {
		background-position: bottom left;
	}
	.cabecera h1 {
		font-size: 1.8rem;
		text-align: center;
	}
	.cabecera div a {
		position: absolute;
		top: 1rem;
		left: 50%;
		transform: translatex(-50%);
		width: 130px;
		z-index: 20;
	}
	.info-fondo {
		background-position: 65% 0% !important;
	}
	header nav {
		padding-right: 1rem;
	}
	header nav ul {
		flex-direction: column;
	}
	.alojamiento {
		.alojamiento-1, .alojamiento-2, .alojamiento-3 {
		grid-template-columns: 1fr;
		gap: .5rem;
		}
		.alojamiento-2 {
			div {
				grid-row: 2;
			}
			img {
				grid-row: 1;
			}
		}
	}
	.lugo {
		> div {
			grid-template-columns: 1fr;
			gap: .5rem;
		}
		> div:nth-of-type(even) {
			div {
				grid-row: 2;
			}
			img {
				grid-row: 1;
			}
		}
	}
	.restaurantes > div div {
		grid-template-columns: 1fr 1fr;
	}
	.parking > div {
		grid-template-columns: 1fr;
	}
}