/* Enkelt butikkpanel: toppstripe, åpningstider og enkel visning uten Flatsome. */

.ebp-toppstripe {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px 28px;
}

.ebp-tider {
	display: grid;
	grid-template-columns: auto auto;
	justify-content: start;
	gap: 2px 18px;
	margin: 0;
}

.ebp-tider dt,
.ebp-tider dd {
	margin: 0;
}

.ebp-tider dt {
	font-weight: 600;
}

/* Reserve uten Flatsome */

.ebp-helt,
.ebp-banner {
	position: relative;
	overflow: hidden;
	background: #2b2622;
	color: #fff;
	min-height: 420px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.ebp-helt-bilde,
.ebp-helt-bilde img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ebp-helt-bilde::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(43, 38, 34, 0.3);
}

.ebp-helt-tekst {
	position: relative;
	text-align: center;
	padding: 48px 20px;
	max-width: 760px;
}

.ebp-venstre {
	justify-content: flex-start;
}

.ebp-venstre .ebp-helt-tekst {
	text-align: left;
	margin-left: 8%;
}

.ebp-helt-tekst h1,
.ebp-helt-tekst h3,
.ebp-helt-tekst p {
	color: #fff;
}

.ebp-knapp {
	display: inline-block;
	border: 1px solid currentColor;
	padding: 10px 22px;
	color: inherit;
	text-decoration: none;
}

.ebp-knapp:hover,
.ebp-knapp:focus {
	background: #fff;
	color: #2b2622;
}

.ebp-kontakt-tekst .ebp-knapp:hover,
.ebp-kontakt-tekst .ebp-knapp:focus {
	background: #2b2622;
	color: #fff;
}

.ebp-kategorier {
	text-align: center;
}

.ebp-fliser {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 16px;
}

.ebp-fliser a {
	display: block;
	color: inherit;
	text-decoration: none;
}

.ebp-fliser img {
	width: 100%;
	aspect-ratio: 5 / 6;
	object-fit: cover;
	display: block;
}

.ebp-bannere,
.ebp-tjenester {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 0;
}

.ebp-tjenester {
	gap: 24px;
}

.ebp-tjeneste img {
	width: 100%;
	height: auto;
	display: block;
}

.ebp-kontakt {
	display: grid;
	grid-template-columns: 5fr 7fr;
	gap: 32px;
	align-items: center;
}

.ebp-kontakt img {
	width: 100%;
	height: auto;
	display: block;
}

@media (max-width: 700px) {
	.ebp-kontakt {
		grid-template-columns: 1fr;
	}
}
