@font-face {
	font-family:Raleway;
	src:url(/fonts/Raleway-200.woff);
	font-weight:200;
}

@font-face {
	font-family:Raleway;
	src:url(/fonts/Raleway-400.woff);
	font-weight:400;
}

:root {
	--primary:#2D8B7A;
	--primary-rgb:45, 139, 122;
	--ho:#2D8B7A;
	--nav:#2D8B7A;
	--btn:#2D8B7A;
	--bg:#E8F5F2;
	--co:#000;
	--text:#1a1a1a;
	--text-muted:rgba(45, 139, 122, 0.6);
	--border:rgba(45, 139, 122, 0.12);
	--bg-hover:rgba(45, 139, 122, 0.08);
	--bg-card:#ffffff;
	--card:#fff;
	--comment-card:#f8f9fa;
	--muted-text:#6d6d6e;
}

* {
	margin:0;
	padding:0;
}

html, body {
	height:100%;
	font-size:16px;
	font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
}

div.wrapper {
	min-height:100%;
	position:relative;
}

h1 {
	font-size:32px;
	margin-top:0;
}

h2 {
	font-size:24px;
	margin-bottom:5px;
}

h3 {
	font-size:18px;
}

ul {
	padding-left:15px;
}

/* Header
 */
header.header {
	position:sticky;
	top:0;
	background:#fff;
	border-bottom:1px solid rgba(128,128,128,0.08);
	z-index:100;
}

header.header .container {
	display:grid;
	grid-template-columns:auto auto auto auto auto;
	align-items:center;
	justify-content:space-between;
	width:100%;
	max-width:1400px;
	margin:0 auto;
	height:80px;
	padding:16px 24px;
}

header.header .container::before,
header.header .container::after {
	display:none;
}

header.header .container > * {
	display:flex;
	align-items:center;
}

.header-logo {
	display:flex;
	align-items:center;
	text-decoration:none;
	order:1;
}

.header-logo img {
	height:60px;
	width:auto;
}

.header-contact {
	display:flex;
	align-items:center;
	gap:8px;
	order:2;
}

.phone-link {
	font-weight:600;
	color:var(--ho);
	font-size:18px;
	text-decoration:none;
}

.phone-link:hover {
	text-decoration:underline;
	color:#25D366 !important;
}

.phone-link:hover i {
	color:#25D366 !important;
}

.header-icon-inline {
	font-size:20px;
	margin-right:6px;
}

.btn-estimate {
	order:3;
	display:inline-block;
	background:var(--ho);
	color:#fff;
	padding:10px 20px;
	border-radius:50px;
	text-decoration:none;
	font-weight:600;
	font-size:0.95rem;
	transition:all 0.2s ease;
}

.btn-estimate:hover {
	background:#fff;
	color:var(--ho) !important;
	text-decoration:none;
}

.header-social {
	display:flex;
	align-items:center;
	gap:10px;
	order:4;
}

.header-icon {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:36px;
	height:36px;
	border-radius:50%;
	background:#e4e6eb;
	color:#333;
	margin:0 4px;
	transition:background 0.2s, color 0.2s;
	text-decoration:none;
}

.header-icon:hover {
	background:#d8dadf;
	text-decoration:none;
}

.header-icon i {
	font-size:16px;
}

.header-social .header-icon i {
	font-size:20px;
}

.header-social .header-icon .fa-facebook-f {
	color:#1877F2;
}

.header-icon:has(.fa-facebook-f):hover {
	background:#d8dadf;
}

.header-icon:has(.fa-facebook-f):hover i {
	color:#1877F2 !important;
}

.header-icon:has(.fa-x-twitter):hover {
	background:#d8dadf;
}

.header-icon:has(.fa-x-twitter):hover i {
	color:#000 !important;
}

.nav-buttons {
	display:flex;
	gap:8px;
	order:5;
	align-self:center;
}

.nav-buttons .btn {
	padding:6px 12px;
	border-radius:50px;
	font-size:0.75rem;
	font-weight:600;
	cursor:pointer;
	transition:all 0.2s ease;
	border:2px solid var(--ho);
	text-decoration:none;
	display:inline-block;
	line-height:1;
}

.nav-buttons .btn-outline {
	background:transparent;
	color:var(--ho);
}

.nav-buttons .btn-outline:hover {
	background:var(--ho);
	color:#fff !important;
}

.nav-buttons .btn-primary {
	background:var(--ho);
	color:#fff;
}

.nav-buttons .btn-primary:hover {
	background:#fff;
	color:var(--ho) !important;
}

/* Content
 */
div.content div.container {
	padding-top:25px;
	padding-bottom:120px;
	position:relative;
}

/* Footer
 */
.landing-footer {
	background:var(--ho);
	color:#fff;
	padding:32px 24px;
	margin-top:40px;
	font-size:16px;
	position:absolute;
	bottom:0;
	width:100%;
}

.landing-footer .footer-inner {
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:16px;
	text-align:center;
	padding:0;
}

.landing-footer .footer-nav {
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:8px 24px;
}

.landing-footer .footer-nav .footer-link {
	font-size:14px;
}

.landing-footer .footer-contact {
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:24px;
}

.landing-footer .footer-link {
	color:#fff;
	text-decoration:none;
	display:inline-flex;
	align-items:center;
	gap:8px;
	transition:opacity 0.2s;
}

.landing-footer .footer-link i {
	color:#E8F0EA;
}

.landing-footer .footer-link:hover {
	opacity:0.8;
	text-decoration:underline;
}

.landing-footer .footer-copy {
	margin:0;
	font-size:0.9rem;
	opacity:0.8;
}

.landing-footer .footer-admin {
	font-size:12px;
	opacity:0.6;
}

.landing-footer .footer-admin a {
	color:#fff;
	text-decoration:underline;
}

.landing-footer .footer-admin span + span {
	margin-left:16px;
}

/* Tablet
 */
@media (max-width:600px) {
	header.header .container {
		grid-template-columns:1fr 1fr;
		gap:12px;
		padding:12px 24px;
		height:auto;
	}

	.header-logo {
		grid-row:1;
		grid-column:1;
		justify-self:start;
		align-self:center;
	}

	.nav-buttons {
		grid-row:1;
		grid-column:2;
		justify-self:end;
		align-self:center;
	}

	.header-contact {
		grid-row:2;
		grid-column:1;
		justify-self:start;
		align-self:center;
	}

	.header-social {
		grid-row:2;
		grid-column:2;
		justify-self:end;
		align-self:center;
	}

	.btn-estimate {
		grid-row:3;
		grid-column:1 / -1;
		justify-self:center;
		align-self:center;
	}

	div.content div.container {
		padding-bottom:260px;
	}

	.landing-footer .footer-contact {
		flex-direction:column;
		gap:12px;
	}
}

/* Mobile
 */
@media (max-width:425px) {
	header.header .container {
		grid-template-columns:1fr;
		text-align:center;
	}

	.header-logo {
		grid-row:1;
		grid-column:1;
		justify-self:center;
	}

	.header-logo img {
		height:50px;
	}

	.nav-buttons {
		grid-row:2;
		grid-column:1;
		justify-self:center;
		gap:40px;
	}

	.header-contact {
		grid-row:3;
		grid-column:1;
		justify-self:center;
	}

	.header-social {
		grid-row:4;
		grid-column:1;
		justify-self:center;
	}

	.btn-estimate {
		grid-row:5;
		grid-column:1;
		justify-self:center;
	}
}
