﻿:root {
	--navy: #0f1c2e;
	--navy-mid: #1a2f46;
	--green: #1f9e5e;
	--green-light: #e3f5ec;
	--green-glow: rgba(31,158,94,.18);
	--amber: #f0a500;
	--cream: #f8f5f0;
	--white: #ffffff;
	--ink: #0f1c2e;
	--ink-soft: #3a4a5c;
	--muted: #7a8898;
	--border: #e0e6ed;
	--ff-display: 'Syne',sans-serif;
	--ff-body: 'Source Serif 4',Georgia,serif;
	--r-sm: 8px;
	--r-md: 16px;
	--r-lg: 24px;
	--r-xl: 36px;
}

html {
	scroll-behavior: smooth;
}

*, *::before, *::after {
	box-sizing: border-box;
}

body {
	font-family: var(--ff-body);
	color: var(--ink);
	background: var(--white);
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--ff-display);
	letter-spacing: -.02em;
}

/* NAVBAR */
.navbar {
	background: var(--white);
	border-bottom: 1px solid var(--border);
	padding: .9rem 0;
}

.navbar-brand {
	font-family: var(--ff-display);
	font-weight: 800;
	font-size: 1.15rem;
	color: var(--navy) !important;
	display: flex;
	align-items: center;
	gap: .65rem;
	letter-spacing: -.01em;
}

	.navbar-brand img {
		height: 38px;
		border-radius: 6px;
		object-fit: contain;
	}

.nav-link {
	font-family: var(--ff-display);
	font-weight: 600;
	font-size: .82rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--ink-soft) !important;
	padding: .4rem .85rem !important;
	border-radius: 6px;
	transition: color .2s,background .2s;
}

	.nav-link:hover {
		color: var(--green) !important;
		background: var(--green-light);
	}

.btn-nav {
	background: var(--green);
	color: var(--white) !important;
	border-radius: var(--r-sm);
	padding: .5rem 1.25rem !important;
	font-size: .82rem;
	font-weight: 700;
	transition: background .2s,transform .15s;
	box-shadow: 0 3px 14px var(--green-glow);
	text-align: center;
}

	.btn-nav:hover {
		background: #178a4f;
		transform: translateY(-1px);
	}

/* HERO */
.hero {
	position: relative;
	min-height: 94vh;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	overflow: hidden;
	background: var(--navy);
}

.hero-photo {
	position: absolute;
	inset: 0;	
	opacity: .38;
}

.hero-grain {
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.06'/%3E%3C/svg%3E");
	pointer-events: none;
	opacity: .5;
}

.hero-bar {
	position: absolute;
	top: 0;
	left: 0;
	width: 6px;
	height: 100%;
	background: var(--green);
}

.hero-content {
	position: relative;
	z-index: 2;
	padding: 3rem 1.5rem;
}

.hero-logo-corner {
	position: absolute;
	top: 2.5rem;
	right: 2.5rem;
	z-index: 3;
	background: rgba(255,255,255,.08);
	border: 1px solid rgba(255,255,255,.16);
	backdrop-filter: blur(16px);
	border-radius: var(--r-lg);
	padding: 1.2rem 1.8rem;
	text-align: center;
}

	.hero-logo-corner img {
		height: 56px;
		border-radius: 8px;
		background: rgba(255,255,255,.9);
		padding: .5rem .75rem;
		display: block;
	}

.hero-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	font-family: var(--ff-display);
	font-size: .7rem;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--green);
	margin-bottom: 1.4rem;
}

	.hero-eyebrow::before {
		content: '';
		display: inline-block;
		width: 28px;
		height: 2px;
		background: var(--green);
	}

.hero h1 {
	font-size: clamp(3rem,7vw,5.5rem);
	font-weight: 800;
	color: var(--white);
	line-height: 1.0;
	margin-bottom: 1.6rem;
	max-width: 780px;
}

	.hero h1 .outline-text {
		-webkit-text-stroke: 2px rgba(255,255,255,.5);
		color: transparent;
	}

	.hero h1 .green-word {
		color: var(--green);
	}

.hero-cta {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
	margin-bottom: 2rem;
}

/* trust strip */
.trust-strip {
	position: relative;
	z-index: 10;
	background: var(--white);
	border-top: 3px solid var(--green);
	box-shadow: 0 -8px 40px rgba(15,28,46,.25);
}

.trust-strip-inner {
	display: flex;
	align-items: stretch;
	gap: 0;
}

.trust-item {
	flex: 1;
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 1.4rem 1.8rem;
	border-right: 1px solid var(--border);
	transition: background .2s;
}

	.trust-item:last-child {
		border-right: none;
	}

	.trust-item:hover {
		background: var(--green-light);
	}

.trust-icon {
	width: 46px;
	height: 46px;
	min-width: 46px;
	border-radius: 10px;
	background: var(--green-light);
	color: var(--green);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.1rem;
	transition: background .2s,color .2s;
}

.trust-item:hover .trust-icon {
	background: var(--green);
	color: var(--white);
}

.trust-num {
	font-family: var(--ff-display);
	font-size: 1.5rem;
	font-weight: 800;
	color: var(--navy);
	line-height: 1;
}

.trust-lbl {
	font-size: .75rem;
	font-family: var(--ff-display);
	font-weight: 600;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--muted);
	margin-top: .15rem;
}

/* buttons */
.btn-hero-main {
	background: var(--green);
	color: var(--white);
	border: none;
	border-radius: var(--r-sm);
	padding: .9rem 2rem;
	font-family: var(--ff-display);
	font-weight: 700;
	font-size: .9rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	transition: background .2s,transform .15s,box-shadow .2s;
	box-shadow: 0 6px 20px var(--green-glow);
}

	.btn-hero-main:hover {
		background: #178a4f;
		transform: translateY(-2px);
		color: var(--white);
		box-shadow: 0 10px 28px var(--green-glow);
	}

.btn-hero-ghost {
	background: transparent;
	color: rgba(255,255,255,.85);
	border: 1.5px solid rgba(255,255,255,.3);
	border-radius: var(--r-sm);
	padding: .88rem 2rem;
	font-family: var(--ff-display);
	font-weight: 600;
	font-size: .9rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	transition: border-color .2s,color .2s,transform .15s;
}

	.btn-hero-ghost:hover {
		border-color: rgba(255,255,255,.7);
		color: var(--white);
		transform: translateY(-2px);
	}

/* SECTION HELPERS */
.sec-pad {
	padding: 96px 0;
}

.sec-tag {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	font-family: var(--ff-display);
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--green);
	margin-bottom: .65rem;
}

	.sec-tag::before {
		content: '';
		width: 22px;
		height: 2px;
		background: var(--green);
		display: inline-block;
	}

.sec-title {
	font-size: clamp(2rem,4.5vw,3rem);
	font-weight: 800;
	color: var(--navy);
	line-height: 1.1;
}

.sec-body {
	font-size: 1.05rem;
	color: var(--muted);
	font-weight: 300;
	font-style: italic;
	max-width: 560px;
	line-height: 1.8;
}

/* SERVICES */
.services-section {
	background: var(--cream);
	position: relative;
	overflow: hidden;
}

.svc-bg-num {
	position: absolute;
	top: -2rem;
	right: -1rem;
	font-family: var(--ff-display);
	font-size: 22rem;
	font-weight: 800;
	color: var(--navy);
	opacity: .035;
	line-height: 1;
	pointer-events: none;
	user-select: none;
}

.svc-accent-bar {
	position: absolute;
	top: 0;
	left: 0;
	width: 5px;
	height: 100%;
	background: linear-gradient(to bottom,var(--green),var(--amber));
}

.svc-card {
	background: var(--white);
	border: 1.5px solid var(--border);
	border-radius: var(--r-md);
	padding: 1.8rem;
	height: 100%;
	position: relative;
	overflow: hidden;
	transition: border-color .25s,box-shadow .25s,transform .2s;
}

	.svc-card::after {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 4px;
		height: 0;
		background: var(--green);
		transition: height .3s ease;
	}

	.svc-card:hover::after {
		height: 100%;
	}

	.svc-card:hover {
		border-color: var(--green);
		box-shadow: 0 12px 36px var(--green-glow);
		transform: translateY(-4px);
	}

.svc-num {
	font-family: var(--ff-display);
	font-size: 2.4rem;
	font-weight: 800;
	color: var(--border);
	line-height: 1;
	margin-bottom: .6rem;
	transition: color .25s;
}

.svc-card:hover .svc-num {
	color: var(--green-light);
}

.svc-icon {
	width: 50px;
	height: 50px;
	border-radius: 12px;
	background: var(--green-light);
	color: var(--green);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.2rem;
	margin-bottom: 1rem;
	transition: background .25s,color .25s;
}

.svc-card:hover .svc-icon {
	background: var(--green);
	color: var(--white);
}

.svc-card h5 {
	font-size: 1rem;
	font-weight: 700;
	color: var(--navy);
	margin-bottom: .4rem;
}

.svc-card p {
	font-size: .88rem;
	color: var(--muted);
	margin: 0;
	line-height: 1.7;
}

/* ABOUT */
.about-section {
	background: var(--white);
}

.about-photo-wrap {
	position: relative;
}

.about-photo {
	width: 100%;
	border-radius: var(--r-xl);
	object-fit: cover;
	display: block;
	aspect-ratio: 4/5;
	box-shadow: 0 24px 60px rgba(15,28,46,.16);
}

.about-badge {
	position: absolute;
	top: 2rem;
	right: -1.5rem;
	background: var(--green);
	color: var(--white);
	border-radius: var(--r-md);
	padding: 1.2rem 1.5rem;
	text-align: center;
	box-shadow: 0 10px 30px var(--green-glow);
	min-width: 100px;
}

.badge-num {
	font-family: var(--ff-display);
	font-size: 2.5rem;
	font-weight: 800;
	line-height: 1;
}

.badge-lbl {
	font-family: var(--ff-display);
	font-size: .65rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	opacity: .8;
	margin-top: .3rem;
}

.about-quote-bar {
	background: var(--amber);
	border-radius: var(--r-md);
	padding: 1.2rem 1.5rem;
	margin-bottom: 2rem;
	display: flex;
	align-items: center;
	gap: 1rem;
}

	.about-quote-bar i {
		font-size: 1.4rem;
		color: var(--navy);
		opacity: .6;
	}

	.about-quote-bar p {
		font-style: italic;
		font-size: .98rem;
		color: var(--navy);
		margin: 0;
		line-height: 1.6;
	}

.feat-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .85rem;
	margin-bottom: 2rem;
}

.feat-item {
	background: var(--cream);
	border-radius: var(--r-md);
	padding: 1rem 1.1rem;
	display: flex;
	align-items: flex-start;
	gap: .85rem;
	border: 1px solid transparent;
	transition: border-color .2s,background .2s;
}

	.feat-item:hover {
		border-color: var(--green);
		background: var(--white);
	}

.feat-ico {
	width: 38px;
	height: 38px;
	min-width: 38px;
	border-radius: 9px;
	background: var(--green-light);
	color: var(--green);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: .9rem;
}

.feat-item h6 {
	font-size: .88rem;
	font-weight: 700;
	color: var(--navy);
	margin-bottom: .1rem;
}

.feat-item p {
	font-size: .78rem;
	color: var(--muted);
	margin: 0;
}

.btn-about {
	background: var(--navy);
	color: var(--white);
	border: none;
	border-radius: var(--r-sm);
	padding: .85rem 1.8rem;
	font-family: var(--ff-display);
	font-weight: 700;
	font-size: .85rem;
	letter-spacing: .05em;
	text-transform: uppercase;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	transition: background .2s,transform .15s;
}

	.btn-about:hover {
		background: #1a2f46;
		transform: translateY(-1px);
		color: var(--white);
	}

/* TESTIMONIALS */
.testi-section {
	background: var(--navy);
	position: relative;
	overflow: hidden;
}

.testi-bg-text {
	position: absolute;
	bottom: -3rem;
	left: -1rem;
	font-family: var(--ff-display);
	font-size: 18rem;
	font-weight: 800;
	color: rgba(255,255,255,.03);
	line-height: 1;
	pointer-events: none;
	user-select: none;
	white-space: nowrap;
}

.testi-section .sec-tag {
	color: var(--green);
}

	.testi-section .sec-tag::before {
		background: var(--green);
	}

.testi-section .sec-title {
	color: var(--white);
}

.testi-section .sec-body {
	color: rgba(255,255,255,.5);
}

.pull-quote {
	background: var(--green);
	border-radius: var(--r-xl);
	padding: 3rem 3.5rem;
	position: relative;
	overflow: hidden;
	margin-bottom: 2rem;
}

	.pull-quote::before {
		content: '\201C';
		position: absolute;
		top: -1.5rem;
		right: 2rem;
		font-family: var(--ff-display);
		font-size: 14rem;
		color: rgba(255,255,255,.12);
		line-height: 1;
	}

	.pull-quote blockquote {
		font-size: clamp(1.3rem,2.5vw,1.8rem);
		font-style: italic;
		font-weight: 300;
		color: var(--white);
		line-height: 1.55;
		margin: 0 0 1.5rem;
		position: relative;
		z-index: 1;
		max-width: 700px;
	}

.pull-quote-author {
	display: flex;
	align-items: center;
	gap: 1rem;
	position: relative;
	z-index: 1;
}

.pq-avatar {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: rgba(255,255,255,.2);
	border: 2px solid rgba(255,255,255,.4);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--white);
}

.pq-name {
	font-family: var(--ff-display);
	font-weight: 700;
	color: var(--white);
	font-size: .95rem;
}

.pq-role {
	font-size: .78rem;
	color: rgba(255,255,255,.65);
}

.pq-stars {
	color: var(--amber);
	font-size: .8rem;
	margin-bottom: .2rem;
}

.mini-t-card {
	background: rgba(255,255,255,.06);
	border: 1px solid rgba(255,255,255,.1);
	border-radius: var(--r-md);
	padding: 1.6rem;
	height: 100%;
	transition: background .25s,border-color .25s,transform .2s;
}

	.mini-t-card:hover {
		background: rgba(255,255,255,.1);
		border-color: var(--green);
		transform: translateY(-3px);
	}

.mini-stars {
	color: var(--amber);
	font-size: .78rem;
	margin-bottom: .8rem;
}

.mini-text {
	font-size: .9rem;
	color: rgba(255,255,255,.8);
	font-style: italic;
	margin-bottom: 1.2rem;
	line-height: 1.75;
	font-weight: 300;
}

.mini-avatar {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: rgba(255,255,255,.12);
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgba(255,255,255,.7);
	font-size: .85rem;
}

.mini-name {
	font-family: var(--ff-display);
	font-size: .88rem;
	font-weight: 700;
	color: var(--white);
}

.mini-role {
	font-size: .75rem;
	color: rgba(255,255,255,.45);
}

/* CONTACT */
.contact-section {
	background: var(--cream);
}

.contact-form-card {
	background: var(--white);
	border-radius: var(--r-xl);
	padding: 2.8rem;
	box-shadow: 0 16px 50px rgba(15,28,46,.1);
}

	.contact-form-card h4 {
		font-size: 1.5rem;
		font-weight: 800;
		color: var(--navy);
		margin-bottom: 1.6rem;
	}

.form-label {
	font-family: var(--ff-display);
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--ink-soft);
	margin-bottom: .4rem;
}

.form-control, .form-select {
	border: 1.5px solid var(--border);
	border-radius: var(--r-sm);
	padding: .75rem 1rem;
	font-family: var(--ff-body);
	font-size: .93rem;
	color: var(--ink);
	background: var(--white);
	transition: border-color .2s,box-shadow .2s;
}

	.form-control:focus, .form-select:focus {
		border-color: var(--green);
		box-shadow: 0 0 0 3px var(--green-glow);
		outline: none;
	}

	.form-control::placeholder {
		color: var(--muted);
		font-style: italic;
	}

textarea.form-control {
	resize: vertical;
	min-height: 140px;
}

.btn-submit {
	background: var(--green);
	color: var(--white);
	border: none;
	border-radius: var(--r-sm);
	padding: .85rem 2rem;
	font-family: var(--ff-display);
	font-weight: 700;
	font-size: .85rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	transition: background .2s,transform .15s,box-shadow .2s;
	box-shadow: 0 4px 16px var(--green-glow);
}

	.btn-submit:hover {
		background: #178a4f;
		transform: translateY(-1px);
		box-shadow: 0 8px 22px var(--green-glow);
	}

.ci-card {
	background: var(--white);
	border: 1.5px solid var(--border);
	border-radius: var(--r-md);
	padding: 1.2rem 1.4rem;
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	transition: border-color .2s,box-shadow .2s;
}

	.ci-card:hover {
		border-color: var(--green);
		box-shadow: 0 6px 20px var(--green-glow);
	}

.ci-icon {
	width: 44px;
	height: 44px;
	min-width: 44px;
	border-radius: 10px;
	background: var(--green-light);
	color: var(--green);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: .95rem;
}

.ci-label {
	font-family: var(--ff-display);
	font-size: .7rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--ink-soft);
	margin-bottom: .2rem;
}

.ci-value {
	font-size: .9rem;
	color: var(--muted);
	margin: 0;
	line-height: 1.65;
}

.contact-photo {
	width: 100%;
	border-radius: var(--r-xl);
	object-fit: cover;
	aspect-ratio: 16/9;
	display: block;
	box-shadow: 0 12px 36px rgba(15,28,46,.12);
}

/* FOOTER */
footer {
	background: var(--navy);
	padding: 1.8rem 0;
	border-top: 3px solid var(--green);
}

.footer-copy {
	font-size: .82rem;
	color: rgba(255,255,255,.38);
}

	.footer-copy a {
		color: rgba(255,255,255,.55);
		text-decoration: none;
	}

		.footer-copy a:hover {
			color: var(--white);
		}

.footer-social {
	display: flex;
	gap: .45rem;
}

	.footer-social a {
		width: 36px;
		height: 36px;
		border-radius: 7px;
		background: rgba(255,255,255,.07);
		color: rgba(255,255,255,.45);
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: .82rem;
		text-decoration: none;
		transition: background .2s,color .2s;
	}

		.footer-social a:hover {
			background: var(--green);
			color: var(--white);
		}

/* ANIMATIONS */
@keyframes fadeUp {
	from {
		opacity: 0;
		transform: translateY(28px)
	}

	to {
		opacity: 1;
		transform: translateY(0)
	}
}

.hero-eyebrow {
	animation: fadeUp .6s ease both;
}

.hero h1 {
	animation: fadeUp .6s .15s ease both;
}

.hero-cta {
	animation: fadeUp .6s .3s ease both;
}

.trust-strip {
	animation: fadeUp .5s .45s ease both;
}

/* RESPONSIVE */
@media(max-width:991.98px) {
	.container {
		padding-left: 1.5rem;
		padding-right: 1.5rem;
	}

	.hero-logo-corner {
		display: none;
	}

	.about-badge {
		right: .75rem;
		top: 1rem;
	}
}

@media(max-width:767.98px) {
	.hero {
		min-height: 85vh;
	}

	.trust-strip-inner {
		flex-direction: column;
	}

	.trust-item {
		border-right: none;
		border-bottom: 1px solid var(--border);
	}

		.trust-item:last-child {
			border-bottom: none;
		}

	.sec-pad {
		padding: 64px 0;
	}

	.pull-quote {
		padding: 2rem;
	}

	.about-badge {
		display: none;
	}

	.feat-grid {
		grid-template-columns: 1fr;
	}
}
