/* Adaptare Mobi Design peste stilul original Origin Architects. */
:root {
	--ink: #2f261f;
	--brown: #5c3820;
	--terracotta: #ce4718;
	--orange: #e48a16;
	--green: #66743b;
	--teal: #167f7a;
	--paper: #fffdf8;
	--line: #e4d8c6;
}

* {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	color: var(--ink);
}

.skip-link {
	background: #fff;
	color: #111;
	left: 12px;
	padding: 10px 14px;
	position: fixed;
	top: -60px;
	z-index: 9999;
}

.skip-link:focus {
	top: 12px;
}

.page .home-page,
.page .about-page,
.page .project-page,
.page .blog-page {
	min-height: 1380px;
}

.sidebar a#logo.brand-logo {
	align-items: center;
	background: #231f1c;
	color: #fff;
	display: flex;
	flex-direction: column;
	height: 92px;
	justify-content: center;
	margin: 25px 8px 0;
	text-decoration: none;
	width: 106px;
}

.brand-logo strong {
	border: 2px solid #fff;
	display: block;
	font-family: AbelRegular, Arial, sans-serif;
	font-size: 28px;
	font-weight: 400;
	line-height: 39px;
	text-align: center;
	width: 48px;
}

.brand-logo span {
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	letter-spacing: 0;
	line-height: 13px;
	margin-top: 7px;
	text-align: center;
	text-transform: uppercase;
}

.sidebar ul {
	margin-top: 26px;
}

.sidebar ul li a,
.sidebar ul li.home a,
.sidebar ul li.about a,
.sidebar ul li.projects a,
.sidebar ul li.blog a,
.sidebar ul li.portfolio a,
.sidebar ul li.contact a,
.sidebar ul li.selected a {
	align-items: center;
	background-image: none !important;
	display: flex;
	height: 118px;
	justify-content: center;
	line-height: 22px;
	padding: 0 8px;
	width: 114px;
}

.sidebar ul li.selected a,
.sidebar ul li:hover a {
	width: 122px;
}

.sidebar ul li.home a,
.sidebar ul li.selected.home a,
.sidebar ul li.home:hover a {
	background-color: #7b8846;
}

.sidebar ul li.about a,
.sidebar ul li.selected.about a,
.sidebar ul li.about:hover a {
	background-color: #cba200;
}

.sidebar ul li.projects a,
.sidebar ul li.selected.projects a,
.sidebar ul li.projects:hover a {
	background-color: #aa8d55;
}

.sidebar ul li.blog a,
.sidebar ul li.selected.blog a,
.sidebar ul li.blog:hover a {
	background-color: #8da85a;
}

.sidebar ul li.tgjiu a,
.sidebar ul li.selected.tgjiu a,
.sidebar ul li.tgjiu:hover a {
	background-color: #63734f;
}

.sidebar ul li.portfolio a,
.sidebar ul li.selected.portfolio a,
.sidebar ul li.portfolio:hover a {
	background-color: #167f7a;
}

.sidebar ul li.contact a,
.sidebar ul li.selected.contact a,
.sidebar ul li.contact:hover a {
	background-color: #46784d;
}

.sidebar div.connect {
	bottom: 18px;
	margin: 0;
	position: absolute;
	text-align: center;
	width: 122px;
}

.sidebar div.connect a#fb {
	display: inline-block;
	margin: 0;
}

.body {
	padding-top: 32px;
}

.site-content {
	background: var(--paper);
	margin: 0 5px 0 18px;
	overflow: hidden;
}

.hero {
	align-items: flex-end;
	background-color: #574438;
	background-position: center;
	background-size: cover;
	display: flex;
	height: 470px;
	margin: 0;
	position: relative;
}

.hero::before {
	background: linear-gradient(180deg, rgba(20, 16, 13, 0.08) 25%, rgba(20, 16, 13, 0.86) 100%);
	content: "";
	inset: 0;
	position: absolute;
}

.hero-home {
	background-image: url(../images/lucrari/bucatarie-alba-moderna.jpg);
}

.hero-valcea {
	background-image: url(../images/lucrari/bucatarie-alba-moderna.jpg);
}

.hero-bucuresti {
	background-image: url(../images/lucrari/bucatarie-bucuresti-riflaj.jpg);
}

.hero-sibiu {
	background-image: url(../images/lucrari/bucatarie-sibiu-alb-lemn.jpg);
}

.hero-targu-jiu {
	background-image: url(../images/lucrari/bucatarie-targu-jiu-alb-lemn.jpg);
}

.hero-portfolio {
	background-image: url(../images/lucrari/mobilier-living-alb.jpg);
}

.hero-services {
	background-image: url(../images/lucrari/mobilier-living-alb-2.jpg);
}

.hero-kitchens {
	background-image: url(../images/lucrari/bucatarie-alb-lemn-electrocasnice-incorporate.jpg);
}

.hero-project-kitchen {
	background-image: url(../images/lucrari/bucatarie-alba-moderna.jpg);
}

.hero-guides {
	background-image: url(../images/lucrari/dormitor-pat-tapitat.jpg);
}

.hero-project-dressing {
	background-image: url(../images/lucrari/dressing-bancheta-riflaj-1.jpg);
}

.hero-project-home {
	background-image: url(../images/lucrari/mobilier-living-alb.jpg);
}

.hero-local-project {
	background-position: center 42%;
}

.hero-content {
	color: #fff;
	max-width: 680px;
	padding: 34px 38px 38px;
	position: relative;
	z-index: 1;
}

.hero-kicker {
	color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0;
	margin: 0 0 10px;
	text-transform: uppercase;
}

.hero h1 {
	color: #fff;
	font-family: AbelRegular, Arial, sans-serif;
	font-size: 46px;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 50px;
	margin: 0;
	text-transform: none;
}

.hero p {
	color: #fff;
	font-size: 16px;
	line-height: 25px;
	margin: 14px 0 0;
	max-width: 620px;
}

.hero-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 22px;
}

.button {
	background: var(--terracotta);
	border: 1px solid var(--terracotta);
	color: #fff !important;
	display: inline-block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: 700;
	line-height: 20px;
	padding: 10px 15px;
	text-decoration: none !important;
	text-transform: uppercase;
}

.button:hover,
.button:focus {
	background: #ad3510;
	border-color: #ad3510;
	color: #fff !important;
}

.button-secondary {
	background: rgba(255, 255, 255, 0.12);
	border-color: #fff;
}

.button-secondary:hover,
.button-secondary:focus {
	background: #fff;
	color: var(--brown) !important;
}

.intro-band,
.content-section,
.city-links,
.contact-band {
	padding: 34px 38px;
}

.intro-band {
	background: #fff;
	display: grid;
	gap: 45px;
	grid-template-columns: 0.9fr 1.1fr;
}

.eyebrow {
	color: var(--teal);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: 700;
	margin: 0 0 9px;
	text-transform: uppercase;
}

.intro-band h2,
.content-section h2,
.city-links h2,
.contact-band h2 {
	color: var(--brown);
	font-family: AbelRegular, Arial, sans-serif;
	font-size: 31px;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 37px;
	margin: 0;
	text-transform: none;
}

.intro-band p,
.content-section p,
.city-links p,
.contact-band p,
.service-card p,
.faq-list p {
	color: var(--brown);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 24px;
}

.intro-copy p {
	margin: 0 0 14px;
}

.benefit-strip {
	background: #ede7db;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	list-style: none;
	margin: 0;
	padding: 0;
}

.benefit-strip li {
	border-right: 1px solid #d7c9b5;
	color: var(--brown);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: 700;
	line-height: 18px;
	min-height: 75px;
	padding: 18px 14px;
	text-align: center;
	text-transform: uppercase;
}

.benefit-strip li:last-child {
	border-right: 0;
}

.content-section {
	background: var(--paper);
	border-top: 1px solid var(--line);
}

.breadcrumb-line {
	background: #f3eee5;
	color: var(--brown);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 20px;
	padding: 12px 38px;
}

.breadcrumb-line a {
	color: var(--teal);
	text-decoration: none;
}

.article-grid {
	display: grid;
	gap: 18px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.article-card {
	background: #fff;
	border: 1px solid var(--line);
	border-top: 5px solid var(--teal);
	padding: 20px;
}

.article-card h3 {
	color: var(--green);
	font-family: AbelRegular, Arial, sans-serif;
	font-size: 23px;
	font-weight: 400;
	line-height: 28px;
	margin: 0 0 10px;
}

.article-card p {
	margin: 0 0 14px;
}

.text-link {
	color: var(--terracotta);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: 700;
	text-decoration: none;
	text-transform: uppercase;
}

.text-link:hover,
.text-link:focus {
	text-decoration: underline;
}

.prose {
	max-width: 760px;
}

.prose h2,
.prose h3 {
	color: var(--brown);
	font-family: AbelRegular, Arial, sans-serif;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
}

.prose h2 {
	font-size: 30px;
	line-height: 36px;
	margin: 30px 0 12px;
}

.prose h2:first-child {
	margin-top: 0;
}

.prose h3 {
	font-size: 22px;
	line-height: 28px;
	margin: 24px 0 8px;
}

.prose p,
.prose li {
	color: var(--brown);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 24px;
}

.prose ul,
.prose ol {
	margin: 10px 0 20px;
	padding-left: 22px;
}

.prose-note {
	background: #f3eee5;
	border-left: 6px solid var(--orange);
	margin: 22px 0;
	padding: 18px 20px;
}

.project-gallery {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-top: 22px;
}

.project-gallery-single {
	grid-template-columns: minmax(0, 680px);
}

.project-gallery figure {
	background: #fff;
	border: 1px solid var(--line);
	margin: 0;
	overflow: hidden;
}

.project-gallery img {
	display: block;
	height: 350px;
	object-fit: cover;
	width: 100%;
}

.project-gallery figcaption {
	color: var(--brown);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 19px;
	padding: 11px 13px;
}

.local-project-photo {
	background: #fff;
	border: 1px solid var(--line);
	display: grid;
	grid-template-columns: minmax(260px, 42%) 1fr;
	margin: 22px 0 0;
	overflow: hidden;
}

.local-project-photo img {
	display: block;
	height: 420px;
	object-fit: cover;
	width: 100%;
}

.local-project-photo figcaption {
	align-self: center;
	color: var(--brown);
	font-family: AbelRegular, Arial, sans-serif;
	font-size: 22px;
	line-height: 31px;
	padding: 28px;
}

.fact-list {
	display: grid;
	gap: 12px;
	grid-template-columns: repeat(3, 1fr);
	list-style: none;
	margin: 22px 0 0;
	padding: 0;
}

.fact-list li {
	background: #fff;
	border-left: 5px solid var(--green);
	color: var(--brown);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	line-height: 20px;
	padding: 14px;
}

.section-heading {
	align-items: end;
	display: flex;
	justify-content: space-between;
	margin-bottom: 22px;
}

.section-heading p {
	margin: 0;
	max-width: 330px;
	text-align: right;
}

.project-grid,
.service-grid {
	display: grid;
	gap: 18px;
	grid-template-columns: repeat(3, 1fr);
}

.project-card,
.service-card {
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 4px;
	overflow: hidden;
}

.project-card img {
	display: block;
	height: 190px;
	object-fit: cover;
	width: 100%;
}

.portfolio-grid {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.portfolio-item {
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 4px;
	margin: 0;
	overflow: hidden;
}

.portfolio-item img {
	display: block;
	height: 250px;
	object-fit: cover;
	width: 100%;
}

.portfolio-item figcaption {
	color: var(--green);
	font-family: AbelRegular, Arial, sans-serif;
	font-size: 19px;
	line-height: 24px;
	padding: 13px 15px;
}

.project-card div,
.service-card {
	padding: 17px;
}

.project-card h3,
.service-card h3,
.process-step h3,
.faq-list h3 {
	color: var(--green);
	font-family: AbelRegular, Arial, sans-serif;
	font-size: 21px;
	font-weight: 400;
	line-height: 25px;
	margin: 0 0 8px;
}

.project-card p,
.service-card p {
	margin: 0;
}

.section-action {
	margin: 24px 0 0;
	text-align: center;
}

.portfolio-item a {
	color: inherit;
	display: block;
	text-decoration: none;
}

.portfolio-item a:hover figcaption,
.portfolio-item a:focus figcaption {
	color: var(--terracotta);
}

.service-card {
	border-top: 5px solid var(--orange);
}

.process-grid {
	display: grid;
	gap: 0;
	grid-template-columns: repeat(4, 1fr);
	margin-top: 24px;
}

.process-step {
	border-left: 1px solid var(--line);
	padding: 0 18px;
}

.process-step:first-child {
	border-left: 0;
	padding-left: 0;
}

.process-number {
	color: var(--terracotta);
	display: block;
	font-family: AbelRegular, Arial, sans-serif;
	font-size: 30px;
	line-height: 32px;
	margin-bottom: 8px;
}

.process-step p {
	color: var(--brown);
	font-size: 13px;
	line-height: 21px;
	margin: 0;
}

.city-links {
	background: #f3eee5;
	border-top: 1px solid var(--line);
}

.city-link-grid {
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(3, 1fr);
	margin-top: 22px;
}

.city-link-grid a {
	background: #fff;
	border-left: 6px solid var(--teal);
	color: var(--brown);
	display: block;
	font-family: AbelRegular, Arial, sans-serif;
	font-size: 21px;
	line-height: 25px;
	padding: 18px;
	text-decoration: none;
}

.city-link-grid a:hover,
.city-link-grid a:focus {
	background: var(--teal);
	color: #fff;
}

.local-area {
	background: #fff;
	border-left: 6px solid var(--green);
	margin-top: 24px;
	padding: 20px 22px;
}

.local-area h3 {
	color: var(--green);
	font-family: AbelRegular, Arial, sans-serif;
	font-size: 22px;
	font-weight: 400;
	margin: 0 0 8px;
}

.local-area p {
	margin: 0;
}

.faq-list {
	margin-top: 20px;
}

.faq-list article {
	border-top: 1px solid var(--line);
	padding: 18px 0 4px;
}

.faq-list article:first-child {
	border-top: 0;
}

.faq-list p {
	margin: 0 0 10px;
}

.contact-band {
	background: #2e2722;
	color: #fff;
}

.contact-band h2,
.contact-band p,
.contact-band a:not(.button) {
	color: #fff !important;
}

.contact-band p {
	margin: 12px 0 20px;
	max-width: 620px;
}

.contact-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.contact-meta {
	border-top: 1px solid rgba(255,255,255,.22);
	display: flex;
	flex-wrap: wrap;
	gap: 12px 26px;
	margin-top: 24px;
	padding-top: 18px;
}

.contact-meta span {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

.footer {
	height: auto;
	min-height: 78px;
	overflow: visible;
	padding-top: 26px;
}

.footer p {
	line-height: 18px;
}

.footer ul {
	margin-top: 0;
}

.footer ul li a {
	line-height: 18px;
}

@media (max-width: 980px) {
	.page {
		width: 100%;
	}

	.page .home-page,
	.page .about-page,
	.page .project-page,
	.page .blog-page {
		background: none;
		min-height: 0;
	}

	.sidebar {
		background: #2e2722;
		float: none;
		width: 100%;
	}

	.sidebar a#logo.brand-logo {
		height: 90px;
		margin: 0;
		width: 100%;
	}

	.sidebar ul {
		display: grid;
		grid-template-columns: repeat(7, 1fr);
		margin: 0;
		overflow: hidden;
	}

	.sidebar ul li {
		margin: 0;
	}

	.sidebar ul li a,
	.sidebar ul li.home a,
	.sidebar ul li.about a,
	.sidebar ul li.projects a,
	.sidebar ul li.blog a,
	.sidebar ul li.portfolio a,
	.sidebar ul li.contact a,
	.sidebar ul li.selected a,
	.sidebar ul li:hover a {
		float: none;
		height: 62px;
		min-height: 62px;
		width: 100%;
	}

	.sidebar div.connect {
		display: none;
	}

	.body {
		float: none;
		padding: 0;
		width: 100%;
	}

	.site-content {
		margin: 0;
	}

	.footer {
		background: #2e2722;
		margin: 0;
		padding: 24px 18px;
	}
}

@media (max-width: 720px) {
	#background-green,
	#background-yellow,
	#background-lightyellow,
	#background-lightgreen,
	#background-green2 {
		display: none;
	}

	.sidebar ul {
		grid-template-columns: repeat(3, 1fr);
	}

	.sidebar ul li a,
	.sidebar ul li.home a,
	.sidebar ul li.about a,
	.sidebar ul li.projects a,
	.sidebar ul li.blog a,
	.sidebar ul li.portfolio a,
	.sidebar ul li.contact a,
	.sidebar ul li.selected a,
	.sidebar ul li:hover a {
		font-size: 15px;
		height: 54px;
		min-height: 54px;
	}

	.hero {
		height: 470px;
	}

	.hero-content {
		padding: 28px 22px;
	}

	.hero h1 {
		font-size: 36px;
		line-height: 40px;
	}

	.hero p {
		font-size: 15px;
		line-height: 23px;
	}

	.intro-band,
	.content-section,
	.city-links,
	.contact-band {
		padding: 28px 22px;
	}

	.breadcrumb-line {
		padding: 11px 22px;
	}

	.intro-band,
	.project-grid,
	.service-grid,
	.city-link-grid,
	.article-grid {
		grid-template-columns: 1fr;
	}

	.project-gallery {
		grid-template-columns: 1fr;
	}

	.local-project-photo {
		grid-template-columns: 1fr;
	}

	.local-project-photo img {
		height: 360px;
	}

	.local-project-photo figcaption {
		font-size: 19px;
		line-height: 27px;
		padding: 20px;
	}

	.project-gallery img {
		height: 330px;
	}

	.fact-list {
		grid-template-columns: 1fr;
	}

	.benefit-strip {
		grid-template-columns: repeat(2, 1fr);
	}

	.benefit-strip li:nth-child(2) {
		border-right: 0;
	}

	.benefit-strip li:nth-child(-n+2) {
		border-bottom: 1px solid #d7c9b5;
	}

	.section-heading {
		align-items: start;
		flex-direction: column;
		gap: 10px;
	}

	.section-heading p {
		max-width: none;
		text-align: left;
	}

	.project-card img {
		height: 230px;
	}

	.portfolio-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.process-grid {
		grid-template-columns: 1fr 1fr;
	}

	.process-step,
	.process-step:first-child {
		border-bottom: 1px solid var(--line);
		border-left: 0;
		padding: 18px 14px;
	}

	.footer p,
	.footer ul {
		float: none;
	}

	.footer ul {
		display: flex;
		flex-wrap: wrap;
		margin-top: 14px;
	}
}

@media (max-width: 420px) {
	.portfolio-grid {
		grid-template-columns: 1fr;
	}

	.portfolio-item img {
		height: 260px;
	}

	.hero h1 {
		font-size: 32px;
		line-height: 36px;
	}

	.hero-actions,
	.contact-actions {
		align-items: stretch;
		flex-direction: column;
	}

	.button {
		text-align: center;
	}

	.process-grid {
		grid-template-columns: 1fr;
	}
}