/**
 * Home Page Styles — SIFARA Systems
 * Exact match to design file values.
 * @package Skavend
 */

/* ========== HERO SECTION ========== */
.home-hero {
	position: relative;
	width: 100%;
	min-height: 100vh;
	overflow-x: clip;
	overflow-y: visible;
	isolation: isolate;
	display: flex;
	flex-direction: column;
	background:
		radial-gradient(ellipse 60% 70% at 76% 42%, rgba(255,255,255,.9), transparent 70%),
		radial-gradient(ellipse 46% 52% at 104% 78%, rgba(9,58,45,.30), transparent 72%),
		linear-gradient(112deg, #f8f1e7 0%, #f5ede2 46%, #efe6d9 100%);
}

/* Background dark radial — bottom right */
.home-hero__background {
	position: absolute;
	right: -4%;
	bottom: -6%;
	width: 64%;
	height: 66%;
	pointer-events: none;
	opacity: .9;
}

.home-hero__gradient-dark {
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse 70% 70% at 78% 72%, rgba(8,48,37,.5), transparent 66%);
}

/* Wave SVG */
.home-hero__wave {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 70%;
	height: 62%;
	pointer-events: none;
	z-index: 3;
}

/* Sparkles */
.home-hero__sparkles {
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 4;
}

/* Main Container — two-column grid */
.home-hero__main-container {
	position: relative;
	z-index: 20;
	flex: 1;
	width: var(--shell-width, 90%);
	margin-inline: auto;
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
	align-items: center;
	gap: 32px;
	padding-top: 0;
	padding-bottom: 32px;
}

/* ========== LEFT COLUMN ========== */
.home-hero__left {
	padding-top: 0;
	min-width: 0;
	overflow: visible;
}

/* Badge */
.home-hero__badge {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	height: 44px;
	padding: 0 22px;
	border: 1px solid rgba(178,133,74,.42);
	border-radius: 999px;
	background: rgba(255,255,255,.32);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .1em;
	color: #22322b;
}

.home-hero__badge-dot {
	width: 11px;
	height: 11px;
	border-radius: 50%;
	background: #cf9e5c;
	flex-shrink: 0;
}

.home-hero__badge-text {
	white-space: nowrap;
}

/* Title */
.home-hero__title {
	margin: clamp(12px, 2vw, 20px) 0 0;
	font-family: 'Playfair Display', Georgia, serif;
	font-weight: 600;
	font-size: clamp(38px, 4.3vw, 66px);
	line-height: 1.06;
	letter-spacing: -.022em;
	text-wrap: balance;
}

.home-hero__title-dark {
	display: block;
	color: #0c3527;
}

.home-hero__title-gold {
	display: block;
	color: #b58a55;
	margin-top: 6px;
	min-height: 1.1em;
	overflow: visible;
	word-break: normal;
}

/* Typing cursor for animated title */
.home-hero__typing-cursor {
	display: inline-block;
	width: 3px;
	height: 0.85em;
	background: #b58a55;
	margin-left: 4px;
	vertical-align: baseline;
	animation: cursorBlink 1s steps(1) infinite;
}

@keyframes cursorBlink {
	0%, 100% { opacity: 1; }
	50% { opacity: 0; }
}

/* Divider */
.home-hero__divider {
	width: 54px;
	height: 2px;
	background: #c2985c;
	margin-top: 38px;
}

/* Description */
.home-hero__description {
	margin-top: 28px;
	display: flex;
	flex-direction: column;
	gap: 14px;
	font-size: 17px;
	line-height: 1.35;
	color: #404a46;
	letter-spacing: -.004em;
}

.home-hero__description p {
	margin: 0;
}

/* Buttons */
.home-hero__buttons {
	display: flex;
	gap: 22px;
	margin-top: 42px;
}

.home-hero__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	height: 62px;
	border-radius: 10px;
	font-size: 17px;
	font-weight: 500;
	text-decoration: none;
	transition: transform .18s ease, color .18s ease, background .18s ease, box-shadow .18s ease;
	border: none;
	cursor: pointer;
}

.home-hero__btn svg {
	width: 22px;
	height: 22px;
	flex-shrink: 0;
}

.home-hero__btn--primary {
	width: 224px;
	background: linear-gradient(180deg, #0b4232, #07301f);
	color: #f5e8d3;
	box-shadow: 0 14px 28px rgba(6,50,38,.2);
}

.home-hero__btn--primary:hover {
	transform: translateY(-2px);
	color: #fbf1e0;
	text-decoration: none;
	box-shadow: 0 18px 34px rgba(6,50,38,.3);
}

.home-hero__btn--secondary {
	width: 214px;
	background: rgba(255,255,255,.28);
	color: #15291f;
	border: 1px solid rgba(22,44,36,.28);
}

.home-hero__btn--secondary svg {
	width: 24px;
	height: 24px;
}

.home-hero__btn--secondary:hover {
	background: rgba(255,255,255,.62);
	color: #0a4132;
	text-decoration: none;
}

/* Social Proof */
.home-hero__proof {
	margin-top: 44px;
	margin-bottom: 44px;
	display: inline-flex;
	align-items: center;
	gap: 0;
	padding: 18px 26px;
	border: 1px solid rgba(180,150,105,.34);
	border-radius: 18px;
	background: rgba(255,255,255,.42);
	box-shadow: 0 12px 30px rgba(40,56,48,.06);
}

.home-hero__proof-left {
	display: flex;
	align-items: center;
	gap: 14px;
	padding-right: 26px;
}

.home-hero__proof-right {
	display: flex;
	align-items: center;
	gap: 14px;
	padding-left: 26px;
}

.home-hero__avatars {
	display: flex;
}

.home-hero__avatar {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: 2px solid #f7efe4;
	background: repeating-linear-gradient(45deg, #dfd4c2 0 4px, #cfc2ac 4px 8px);
}

.home-hero__avatar + .home-hero__avatar {
	margin-left: -11px;
}

.home-hero__avatar:nth-child(2) {
	background: repeating-linear-gradient(45deg, #d8ccb8 0 4px, #c7b9a2 4px 8px);
}

.home-hero__avatar:nth-child(3) {
	background: repeating-linear-gradient(45deg, #d1c4ae 0 4px, #bfb197 4px 8px);
}

.home-hero__proof-title {
	margin: 0;
	font-size: 14.5px;
	font-weight: 600;
	color: #16261f;
	line-height: 1;
	white-space: nowrap;
}

.home-hero__proof-subtitle {
	margin: 5px 0 0;
	font-size: 12.5px;
	color: #5c6560;
	line-height: 1;
	white-space: nowrap;
}

.home-hero__proof-divider {
	width: 1px;
	height: 44px;
	background: rgba(28,50,41,.16);
	flex-shrink: 0;
}

.home-hero__proof-icon {
	width: 34px;
	height: 34px;
	flex-shrink: 0;
}

/* ========== RIGHT COLUMN ========== */
.home-hero__right {
	position: relative;
	width: min(100%, 500px);
	height: 500px;
	margin-top: 8px;
	margin-left: auto;
	justify-self: end;
}

/* Concentric Circles */
.home-hero__circles {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 500px;
	height: 500px;
	max-width: 100%;
	z-index: 2;
}

/* Center Circle — 258px (scaled ~10% down from the 286px design) */
.home-hero__center-circle {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 176px;
	height: 176px;
	border-radius: 50%;
	z-index: 6;
	background:
		radial-gradient(circle at 36% 26%, rgba(28,92,70,.9) 0%, rgba(9,54,40,0) 58%),
		linear-gradient(160deg, #0c4633, #04241b);
	border: 3px solid #e2c084;
	box-shadow:
		0 0 0 12px rgba(255,250,240,.55),
		0 0 0 15px rgba(214,180,124,.35),
		0 0 70px 18px rgba(240,214,160,.45),
		0 26px 60px rgba(4,40,30,.28);
	display: grid;
	place-items: center;
}

.home-hero__center-circle-border {
	position: absolute;
	inset: 14px;
	border: 1px solid rgba(226,196,140,.28);
	border-radius: 50%;
}

.home-hero__center-logo {
	font: 700 28px/1 'Playfair Display', Georgia, serif;
	color: #eecfa0;
	letter-spacing: 0.14em;
	padding-right: 0;
	text-shadow: 0 4px 22px rgba(0,0,0,.35);
}

/* ========== SERVICE CARDS ========== */
.home-hero__cards {
	position: absolute;
	inset: 0;
	z-index: 12;
}

.home-hero__card {
	position: absolute;
	width: 88px;
	height: 92px;
	margin: -46px 0 0 -44px;
	border-radius: 14px;
	background: rgba(252,248,241,.8);
	border: 1px solid rgba(255,255,255,.9);
	backdrop-filter: blur(9px);
	-webkit-backdrop-filter: blur(9px);
	box-shadow: 0 14px 30px rgba(34,52,44,.09);
	z-index: 12;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 11px;
	text-align: center;
	text-decoration: none;
	color: #11231c;
	transition: box-shadow .3s ease;
}

.home-hero__card b {
	font-size: 11.5px;
	font-weight: 500;
	line-height: 1.3;
	color: #11231c;
}

.home-hero__card:hover {
	animation-play-state: paused !important;
	transform: translateY(-7px) scale(1.04);
	box-shadow: 0 24px 44px rgba(34,52,44,.17);
	color: #0c3527;
	text-decoration: none;
}

/* W letter icon for WordPress */
.home-hero__card-letter {
	width: 27px;
	height: 27px;
	border-radius: 50%;
	background: #0f2a20;
	color: #f6efe4;
	display: grid;
	place-items: center;
	font: 700 18px/1 Georgia, serif;
}

/* GO text for Golang */
.home-hero__card-go {
	font: 700 17px/1 'DM Sans', sans-serif;
	letter-spacing: -.02em;
	color: #123a2c;
}

/* Card Positions — true 7-point polar layout (51.43° apart, r=44%),
   equal gaps with extra clearance from the center logo. */
.home-hero__card--erp {
	left: 50%;
	top: 6%;
	animation: cardFloat 6.5s ease-in-out infinite;
	animation-delay: 0s;
}

.home-hero__card--ai {
	left: 84.2%;
	top: 22.6%;
	animation: cardFloat 6.5s ease-in-out infinite;
	animation-delay: 0.9s;
}

.home-hero__card--golang {
	left: 93.4%;
	top: 60.8%;
	animation: cardFloat 6.5s ease-in-out infinite;
	animation-delay: 1.8s;
}

.home-hero__card--seo {
	left: 69.2%;
	top: 89.8%;
	animation: cardFloat 6.5s ease-in-out infinite;
	animation-delay: 2.7s;
}

.home-hero__card--laravel {
	left: 30.8%;
	top: 89.8%;
	animation: cardFloat 6.5s ease-in-out infinite;
	animation-delay: 3.6s;
}

.home-hero__card--wordpress {
	left: 6.6%;
	top: 60.8%;
	animation: cardFloat 6.5s ease-in-out infinite;
	animation-delay: 4.5s;
}

.home-hero__card--pos {
	left: 15.8%;
	top: 22.6%;
	animation: cardFloat 6.5s ease-in-out infinite;
	animation-delay: 5.4s;
}

/* ========== STATS BAR — full-width inside hero ========== */
.home-stats {
	position: relative;
	z-index: 30;
	width: 100%;
	margin-top: auto;
	background: linear-gradient(102deg, #0a3f30, #062f24 56%, #0a3a2c);
	box-shadow: 0 -4px 30px rgba(4,40,31,.15);
}

.home-stats__inner {
	width: var(--shell-width, 90%);
	margin-inline: auto;
	padding: 30px 0;
}

.home-stats__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
}

.home-stats__item {
	display: flex;
	align-items: center;
	gap: 13px;
	padding: 0 20px;
	border-right: 1px solid rgba(224,191,132,.24);
}

.home-stats__item:first-child {
	padding-left: 0;
}

.home-stats__item:last-child {
	border-right: none;
	padding-right: 0;
}

.home-stats__icon-wrapper {
	position: relative;
	flex: 0 0 52px;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	border: 1.5px solid rgba(226, 189, 128, 0.7);
	background: rgba(255, 255, 255, 0.06);
	display: grid;
	place-items: center;
	color: #e2bd80;
}

.home-stats__icon-wrapper .skavend-icon,
.home-stats__icon,
.home-stats__icon-wrapper svg {
	color: var(--icon-on-dark, #e2bd80) !important;
	stroke: currentColor !important;
	opacity: 1;
}

.home-stats__icon-wrapper svg path,
.home-stats__icon-wrapper svg circle,
.home-stats__icon-wrapper svg line,
.home-stats__icon-wrapper svg polyline {
	stroke: currentColor;
}

.home-stats__ring {
	position: absolute;
	inset: -4px;
	border-radius: 50%;
	border: 1px solid rgba(224,190,130,.55);
	animation: capRing 3.4s ease-out infinite;
	pointer-events: none;
}

.home-stats__item:nth-child(2) .home-stats__ring { animation-delay: 0.85s; }
.home-stats__item:nth-child(3) .home-stats__ring { animation-delay: 1.7s; }
.home-stats__item:nth-child(4) .home-stats__ring { animation-delay: 2.55s; }

.home-stats__content {
	min-width: 0;
}

.home-stats__title {
	margin: 0 0 6px;
	color: #e2bd80;
	font: 600 21px/1.1 'Playfair Display', Georgia, serif;
}

.home-stats__text {
	margin: 0;
	color: #f4ece0;
	font-size: 13px;
	line-height: 1.4;
}

/* ========== ANIMATIONS ========== */

@keyframes cardFloat {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-9px); }
}

@keyframes capPulse {
	0%, 100% { transform: scale(1); opacity: .9; }
	50% { transform: scale(1.09); opacity: 1; }
}

@keyframes capBob {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-3px); }
}

@keyframes capRing {
	0% { transform: scale(.86); opacity: .5; }
	70% { transform: scale(1.2); opacity: 0; }
	100% { transform: scale(1.2); opacity: 0; }
}

@keyframes sparkle {
	0%, 100% { opacity: .15; }
	50% { opacity: .95; }
}

/* ========== RESPONSIVE — 1200px ========== */
@media (max-width: 1200px) {
	.home-hero__main-container {
		grid-template-columns: 1fr;
	}

	.home-hero__right {
		width: min(100%, 460px);
		margin-inline: auto;
		justify-self: center;
	}
}

/* ========== RESPONSIVE — 1024px ========== */
@media (max-width: 1024px) {
	.home-hero {
		min-height: auto;
	}

	.home-hero__main-container {
		width: calc(100% - 48px);
		grid-template-columns: 1fr;
		gap: 20px;
		padding-top: 0;
	}

	.home-hero__left {
		padding-top: 0;
	}

	.home-hero__title {
		margin-top: 12px;
	}

	.home-hero__right {
		width: min(100%, 440px);
		min-height: 440px;
		height: auto;
		aspect-ratio: 1;
		margin-top: 20px;
		margin-inline: auto;
		justify-self: center;
		overflow: visible;
		padding: 18px 0;
	}

	.home-hero__circles {
		width: 100%;
		height: 100%;
		max-width: 420px;
		max-height: 420px;
	}

	.home-hero__center-circle {
		width: 148px;
		height: 148px;
	}

	.home-hero__center-logo {
		font-size: 22px;
	}

	.home-stats__inner {
		padding: 22px 0;
	}

	.home-stats__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

	.home-stats__item {
		border-right: none;
		padding: 0;
	}
}

/* ========== RESPONSIVE — 768px ========== */
@media (max-width: 768px) {
	.home-hero__main-container {
		width: calc(100% - 30px);
		gap: 16px;
		padding-top: 0;
	}

	.home-hero__left {
		padding-top: 0;
	}

	.home-hero__title {
		font-size: clamp(28px, 8vw, 36px);
		margin-top: 6px;
	}

	.home-hero__badge {
		height: 40px;
	}

	.home-hero__title-gold {
		font-size: clamp(26px, 7.5vw, 34px);
	}

	.home-hero__divider {
		margin-top: 18px;
	}

	.home-hero__description {
		margin-top: 16px;
		font-size: 15px;
	}

	.home-hero__buttons {
		flex-direction: column;
		gap: 12px;
		margin-top: 24px;
	}

	.home-hero__btn {
		width: 100% !important;
		height: 52px;
		font-size: 15px;
	}

	.home-hero__proof {
		flex-direction: column;
		gap: 16px;
		padding: 14px 18px;
		margin-top: 24px;
		margin-bottom: 24px;
	}

	.home-hero__proof-left { padding-right: 0; }
	.home-hero__proof-right { padding-left: 0; }
	.home-hero__proof-divider { display: none; }

	.home-hero__right {
		width: min(100%, 380px);
		min-height: 380px;
		height: auto;
		margin-top: 16px;
		overflow: visible;
		padding: 16px 0;
	}

	.home-hero__circles {
		width: 100%;
		height: 100%;
		max-width: 360px;
		max-height: 360px;
		transform: translate(-50%, -50%) scale(0.92);
	}

	.home-hero__center-circle {
		width: 162px;
		height: 162px;
	}

	.home-hero__center-logo {
		font-size: 20px;
		padding-right: 0;
		letter-spacing: 0.12em;
	}

	.home-hero__card {
		width: 80px;
		height: 84px;
		margin: -42px 0 0 -40px;
		border-radius: 12px;
		gap: 8px;
	}

	.home-hero__card--erp { top: 10%; }
	.home-hero__card--ai { left: 82%; top: 24%; }
	.home-hero__card--golang { left: 90%; top: 58%; }
	.home-hero__card--seo { left: 68%; top: 86%; }
	.home-hero__card--laravel { left: 32%; top: 86%; }
	.home-hero__card--wordpress { left: 10%; top: 58%; }
	.home-hero__card--pos { left: 18%; top: 24%; }

	.home-hero__card b { font-size: 10px; }
	.home-hero__card svg { width: 20px !important; height: 20px !important; }

	.home-stats__inner {
		padding: 20px 0;
	}

	.home-stats__grid {
		grid-template-columns: 1fr 1fr;
		gap: 16px;
	}

	.home-stats__item {
		border-right: none;
		padding: 0;
	}
}

/* ========== RESPONSIVE — 480px ========== */
@media (max-width: 480px) {
	.home-hero__main-container {
		width: calc(100% - 20px);
	}

	.home-hero__badge {
		font-size: 11px;
		padding: 0 16px;
		height: 38px;
		gap: 10px;
	}

	.home-hero__title { font-size: 28px; }
	.home-hero__description { font-size: 14px; }

	.home-hero__btn {
		font-size: 14px;
		height: 48px;
		gap: 10px;
	}

	.home-hero__btn svg { width: 18px; height: 18px; }

	.home-hero__right {
		width: min(100%, 320px);
		min-height: 320px;
		height: auto;
		margin-top: 12px;
		overflow: visible;
		padding: 12px 0;
	}

	.home-hero__circles {
		max-width: 300px;
		max-height: 300px;
		transform: translate(-50%, -50%) scale(0.88);
	}

	.home-hero__center-circle { width: 135px; height: 135px; }
	.home-hero__center-logo { font-size: 16px; padding-right: 0; letter-spacing: 0.1em; }

	.home-hero__card {
		width: 68px;
		height: 72px;
		margin: -36px 0 0 -34px;
		gap: 6px;
	}

	.home-hero__card b { font-size: 8.5px; }
	.home-hero__card svg { width: 16px !important; height: 16px !important; }
	.home-hero__card-letter { width: 20px; height: 20px; font-size: 14px; }
	.home-hero__card-go { font-size: 14px; }

	.home-stats__inner { padding: 16px 0; }
	.home-stats__title { font-size: 17px; }
	.home-stats__text { font-size: 12px; }
}

/* ==========================================================================
   ABOUT SECTION
   ========================================================================== */
.home-about {
	position: relative;
	padding-top: 0;
	padding-bottom: 0;
	overflow: hidden;
	background:
		radial-gradient(circle at 72% 38%, rgba(206,170,111,.17), transparent 26%),
		radial-gradient(circle at 18% 18%, rgba(255,255,255,.95), transparent 28%),
		linear-gradient(135deg, #f7f2ea 0%, #ece6dc 48%, #f6f1e9 100%);
}

.home-about__bg-circle {
	position: absolute;
	width: 680px;
	height: 680px;
	right: -210px;
	top: 30px;
	border: 1px solid rgba(201,164,107,.14);
	border-radius: 50%;
	box-shadow: 0 0 0 54px rgba(201,164,107,.035), 0 0 0 108px rgba(201,164,107,.025);
	pointer-events: none;
}

.home-about__container {
	max-width: 1400px;
	margin: auto;
	padding: 0 max(5vw, 36px);
	position: relative;
	z-index: 1;
}

.home-about__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.18fr);
	gap: 54px;
	align-items: center;
}

.home-about__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 10px 20px;
	border: 1px solid rgba(129,105,72,.22);
	border-radius: 999px;
	letter-spacing: .12em;
	font-size: 13px;
	color: #414845;
	background: rgba(255,255,255,.28);
}

.home-about__dot {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: #c9a46b;
	box-shadow: 0 0 14px rgba(201,164,107,.55);
}

.home-about__title {
	margin: 28px 0 18px;
	font-family: 'Playfair Display', Georgia, serif;
	font-size: var(--section-heading-size, clamp(28px, 2.5vw, 36px));
	line-height: var(--section-heading-line, 1.22);
	letter-spacing: -.02em;
	font-weight: 700;
	color: var(--skavend-color-headings);
}

.home-about__title-gold {
	display: block;
	color: #9b784b;
}

.home-about__accent-line {
	width: 42px;
	height: 2px;
	background: #c9a46b;
	margin: 27px 0;
}

.home-about__intro {
	max-width: 580px;
	color: #474e4b;
	font-size: 17px;
	line-height: 1.72;
	margin-bottom: 30px;
}

.home-about__pillars {
	display: grid;
	gap: 0;
	max-width: 590px;
}

.home-about__pillar {
	display: grid;
	grid-template-columns: 78px 1fr;
	gap: 20px;
	align-items: center;
	padding: 13px 0 15px;
	position: relative;
}

.home-about__pillar:not(:last-child)::after {
	content: "";
	position: absolute;
	left: 107px;
	right: 0;
	bottom: 0;
	height: 1px;
	background: linear-gradient(90deg, rgba(129,105,72,.22), transparent);
}

.home-about__pillar:not(:last-child)::before {
	content: "";
	position: absolute;
	left: 37px;
	top: 67px;
	width: 1px;
	height: 22px;
	background: rgba(201,164,107,.65);
}

.home-about__pillar-icon {
	width: 66px;
	height: 66px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: radial-gradient(circle at 35% 30%, #1c4b3e, #082a22 75%);
	color: #d8b980;
	box-shadow: 0 12px 24px rgba(13,48,39,.18);
}

.home-about__pillar-icon svg {
	width: 30px;
	height: 30px;
}

.home-about__pillar h3 {
	margin: 0 0 7px;
	font: 500 21px 'Playfair Display', Georgia, serif;
	color: var(--skavend-color-headings);
}

.home-about__pillar p {
	margin: 0;
	color: #555d5a;
	font-size: 14px;
	line-height: 1.55;
}

.home-about__cta {
	margin-top: 28px;
	display: inline-flex;
	align-items: center;
	gap: 28px;
	padding: 17px 25px;
	border: 0;
	border-radius: 12px;
	background: linear-gradient(135deg, #164538, #082c24);
	color: #ead9b7;
	font-size: 15px;
	letter-spacing: .02em;
	text-decoration: none;
	box-shadow: 0 14px 30px rgba(10,45,36,.22);
	transition: transform .25s, box-shadow .25s;
}

.home-about__cta:hover {
	transform: translateY(-2px);
	box-shadow: 0 18px 35px rgba(10,45,36,.28);
	color: #ead9b7;
	text-decoration: none;
}

.home-about__arrow {
	font-size: 27px;
	line-height: 0;
	font-weight: 300;
}

/* About — Visual Side */
.home-about__visual {
	position: relative;
	padding-bottom: 115px;
}

.home-about__orbit {
	position: absolute;
	width: 230px;
	height: 230px;
	left: -110px;
	top: 180px;
	border-radius: 50%;
	border: 1px solid rgba(201,164,107,.28);
	box-shadow: 0 0 0 14px rgba(201,164,107,.045), 0 0 0 30px rgba(201,164,107,.035);
	z-index: 2;
	display: grid;
	place-items: center;
	background: rgba(9,44,35,.97);
}

.home-about__orbit::before {
	content: "";
	position: absolute;
	inset: -26px;
	border-radius: 50%;
	border: 1px solid rgba(201,164,107,.16);
}

.home-about__mark {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 88px;
	font-weight: 700;
	color: #e5c083;
	text-shadow: 0 0 30px rgba(227,190,128,.3);
	transform: rotate(-3deg);
}

.home-about__photo {
	height: 520px;
	border-radius: 23px;
	overflow: hidden;
	position: relative;
	background:
		linear-gradient(135deg, #1a4a3a 0%, #0d3527 40%, #082a1f 100%);
	box-shadow: 0 30px 60px rgba(66,47,24,.16);
}

.home-about__photo::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(8,39,31,.07), transparent 60%);
}

.home-about__stats {
	position: absolute;
	left: -6%;
	right: 2%;
	bottom: 0;
	min-height: 216px;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	background: rgba(246,243,237,.92);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border: 1px solid rgba(255,255,255,.7);
	border-radius: 20px;
	box-shadow: 0 24px 50px rgba(64,48,29,.13);
	z-index: 4;
}

.home-about__stat {
	padding: 28px 24px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	position: relative;
}

.home-about__stat:not(:last-child)::after {
	content: "";
	position: absolute;
	right: 0;
	top: 28px;
	bottom: 28px;
	width: 1px;
	background: rgba(129,105,72,.22);
}

.home-about__stat-icon {
	width: 60px;
	height: 60px;
	border: 1px solid rgba(201,164,107,.45);
	border-radius: 50%;
	display: grid;
	place-items: center;
	color: #b68c51;
	margin-bottom: 11px;
}

.home-about__stat-icon svg {
	width: 28px;
	height: 28px;
}

.home-about__stat-value,
.home-about__stat strong {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: clamp(34px, 3.2vw, 46px);
	font-weight: 600;
	line-height: 1.05;
	color: #17372e;
}

.home-about__stat-number {
	font: inherit;
	line-height: inherit;
	white-space: nowrap;
}

.home-about__stat span {
	font-size: 15px;
	line-height: 1.55;
	color: #555b58;
	margin-top: 9px;
}

/* ==========================================================================
   CHALLENGE SECTION
   ========================================================================== */
.home-challenge {
	padding-top: 0;
	padding-bottom: 0;
	background: linear-gradient(180deg, #f5efe5 0%, #f8f3eb 100%);
}

.home-challenge__container {
	max-width: 1400px;
	margin: auto;
	padding: 0 max(5vw, 36px);
}

.home-challenge__grid {
	display: grid;
	grid-template-columns: 1fr 1.2fr;
	gap: 60px;
	align-items: start;
}

.home-challenge__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 10px 20px;
	border: 1px solid rgba(129,105,72,.22);
	border-radius: 999px;
	letter-spacing: .12em;
	font-size: 13px;
	color: #414845;
	background: rgba(255,255,255,.28);
}

.home-challenge__dot {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: #c9a46b;
	box-shadow: 0 0 14px rgba(201,164,107,.55);
}

.home-challenge__title {
	margin: 20px 0 14px;
	font-family: 'Playfair Display', Georgia, serif;
	font-size: var(--section-heading-size, clamp(28px, 2.5vw, 36px));
	line-height: var(--section-heading-line, 1.22);
	letter-spacing: -.02em;
	font-weight: 700;
	color: var(--skavend-color-headings);
}

.home-challenge__intro {
	color: #474e4b;
	font-size: 17px;
	line-height: 1.65;
	margin-bottom: 28px;
}

.home-challenge__problems {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 4px 28px;
}

.home-challenge__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: contents;
}

.home-challenge__list li {
	position: relative;
	padding: 8px 0 8px 32px;
	font-size: 15px;
	color: #3a4340;
	line-height: 1.5;
	min-width: 0;
}

.home-challenge__list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 12px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: #164538;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none' stroke='%23e0c080' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m5 9 3 3 5-5'/%3E%3C/svg%3E");
}

/* Challenge — Visual Diagram: sizing/base layer only. Colors, the
   glass hub, node reveal states, and the canvas-drawn wiring live in
   home-enhancements.css (loaded after this file, so it wins the
   cascade) — that file is the single source of truth for this
   section's look; keep new rules there, not here. */
.home-challenge__node-icon svg {
	width: 26px;
	height: 26px;
}

.home-challenge__hub svg {
	width: 20px;
	height: 20px;
}

.home-challenge__hub span {
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0.02em;
	font-family: var(--font-serif, 'Playfair Display', Georgia, serif);
}

.home-challenge__outcomes {
	display: flex;
	justify-content: center;
	gap: 18px;
	flex-wrap: wrap;
}

.home-challenge__outcomes span {
	padding: 12px 22px;
	background: rgba(244,239,231,.85);
	border: 1px solid rgba(129,105,72,.18);
	border-radius: 14px;
	font-size: 14px;
	font-weight: 500;
	color: #2a3c35;
	box-shadow: 0 6px 16px rgba(40,56,48,.06);
}

/* ==========================================================================
   SOLUTION SECTION
   ========================================================================== */
.home-solution {
	padding-top: 0;
	padding-bottom: 0;
	background: linear-gradient(180deg, #f0e9df 0%, #f6f0e7 100%);
}

.home-solution__container {
	max-width: 1400px;
	margin: auto;
	padding: 0 max(5vw, 36px);
}

.home-solution__grid {
	display: grid;
	grid-template-columns: .85fr 1.15fr;
	gap: 60px;
	align-items: center;
}

.home-solution__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 10px 20px;
	border: 1px solid rgba(129,105,72,.22);
	border-radius: 999px;
	letter-spacing: .12em;
	font-size: 13px;
	color: #414845;
	background: rgba(255,255,255,.28);
}

.home-solution__dot {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: #c9a46b;
	box-shadow: 0 0 14px rgba(201,164,107,.55);
}

.home-solution__title {
	margin: 20px 0 14px;
	font-family: 'Playfair Display', Georgia, serif;
	font-size: var(--section-heading-size, clamp(28px, 2.5vw, 36px));
	line-height: var(--section-heading-line, 1.22);
	letter-spacing: -.02em;
	font-weight: 700;
	color: var(--skavend-color-headings);
}

.home-solution__intro {
	max-width: 480px;
	color: #474e4b;
	font-size: 17px;
	line-height: 1.72;
	margin-bottom: 30px;
}

.home-solution__cta {
	display: inline-flex;
	align-items: center;
	gap: 20px;
	padding: 17px 25px;
	border-radius: 12px;
	background: linear-gradient(135deg, #164538, #082c24);
	color: #ead9b7;
	font-size: 15px;
	letter-spacing: .02em;
	text-decoration: none;
	box-shadow: 0 14px 30px rgba(10,45,36,.22);
	transition: transform .25s, box-shadow .25s;
}

.home-solution__cta:hover {
	transform: translateY(-2px);
	box-shadow: 0 18px 35px rgba(10,45,36,.28);
	color: #ead9b7;
	text-decoration: none;
}

.home-solution__arrow {
	font-size: 27px;
	line-height: 0;
	font-weight: 300;
}

/* Solution — Hub Visual */
.home-solution__visual {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 40px;
	min-height: auto;
}

.home-solution__hub-circle {
	width: 240px;
	height: 240px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #1c4b3e, #082a22 75%);
	border: 2px solid #c9a46b;
	box-shadow:
		0 0 0 10px rgba(201,164,107,.12),
		0 0 0 22px rgba(201,164,107,.06),
		0 20px 50px rgba(10,48,36,.2);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	flex-shrink: 0;
}

.home-solution__hub-circle strong {
	font: 700 22px 'Playfair Display', Georgia, serif;
	color: #e5c083;
	letter-spacing: .04em;
	margin-bottom: 8px;
}

.home-solution__hub-circle span {
	font-size: 13px;
	line-height: 1.5;
	color: #c8b594;
}

.home-solution__modules {
	display: flex;
	gap: 260px;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	justify-content: space-between;
	align-items: center;
	pointer-events: none;
}

.home-solution__module {
	display: flex;
	flex-direction: column;
	gap: 18px;
	pointer-events: auto;
}

.home-solution__mod {
	display: flex;
	align-items: center;
	gap: 14px;
}

.home-solution__module--right .home-solution__mod {
	flex-direction: row-reverse;
	text-align: right;
}

.home-solution__mod-icon {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	border: 1px solid rgba(22,69,56,.2);
	display: grid;
	place-items: center;
	color: #164538;
	background: rgba(255,255,255,.5);
	flex-shrink: 0;
}

.home-solution__mod-icon svg {
	width: 24px;
	height: 24px;
}

.home-solution__mod b {
	display: block;
	font-size: 15px;
	font-weight: 700;
	color: #1a3a30;
	line-height: 1.2;
}

.home-solution__mod span {
	display: block;
	font-size: 13px;
	color: #5c625f;
	line-height: 1.4;
}

/* Solution — Bottom Pills */
.home-solution__pills {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: stretch;
	gap: clamp(10px, 1.6vw, 16px);
	margin-top: clamp(20px, 3vw, 32px);
	max-width: 960px;
	margin-inline: auto;
}

.home-solution__pill {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 16px 26px;
	background: rgba(255,255,255,.55);
	border: 1px solid rgba(129,105,72,.18);
	border-radius: 16px;
	font-size: 15px;
	font-weight: 500;
	color: #2a3c35;
	box-shadow: 0 6px 18px rgba(40,56,48,.06);
	flex: 0 1 auto;
	min-width: 0;
}

@media (max-width: 1100px) {
	.home-solution__pills {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px 14px;
		max-width: 100%;
	}

	.home-solution__pill {
		justify-content: center;
		padding: 14px 18px;
	}
}

.home-solution__pill svg {
	width: 24px;
	height: 24px;
	stroke: #164538;
	flex-shrink: 0;
}

/* ==========================================================================
   ABOUT / CHALLENGE / SOLUTION — RESPONSIVE
   ========================================================================== */
@media (max-width: 1100px) {
	.home-about__grid {
		grid-template-columns: 1fr;
		gap: 55px;
	}

	.home-about__visual {
		max-width: 760px;
		margin: auto;
		width: 100%;
	}

	.home-challenge__grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.home-solution__grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.home-solution__visual {
		min-height: 400px;
	}

	.home-solution__modules {
		gap: 200px;
	}
}

@media (max-width: 768px) {
	.home-about {
		padding: 50px 0;
	}

	.home-about__title {
		font-size: clamp(24px, 5vw, 28px);
	}

	.home-about__intro {
		font-size: 16px;
	}

	.home-about__photo {
		height: 400px;
	}

	.home-about__orbit {
		width: 150px;
		height: 150px;
		left: -25px;
		top: 165px;
	}

	.home-about__mark {
		font-size: 58px;
	}

	.home-about__visual {
		padding-bottom: 0;
	}

	.home-about__stats {
		position: relative;
		left: 0;
		right: auto;
		bottom: auto;
		margin-top: -25px;
		grid-template-columns: repeat(2, 1fr);
		min-height: 0;
	}

	.home-about__stat {
		padding: 24px 10px;
	}

	.home-about__stat:nth-child(2)::after {
		display: none;
	}

	.home-about__stat-value {
		font-size: clamp(28px, 6vw, 38px);
	}

	.home-challenge {
		padding: 50px 0;
	}

	.home-challenge__title {
		font-size: clamp(24px, 5vw, 28px);
	}

	.home-challenge__problems {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 4px 16px;
	}

	.home-challenge__list li {
		font-size: 14px;
		padding-left: 28px;
	}

	.home-solution {
		padding: 50px 0;
	}

	.home-solution__title {
		font-size: clamp(24px, 5vw, 28px);
	}

	.home-solution__visual {
		flex-direction: column;
		min-height: auto;
		gap: 30px;
	}

	.home-solution__modules {
		position: relative;
		flex-direction: column;
		gap: 30px;
	}

	.home-solution__module--right .home-solution__mod {
		flex-direction: row;
		text-align: left;
	}

	.home-solution__pills {
		gap: 12px;
	}

	.home-solution__pill {
		padding: 12px 18px;
		font-size: 13px;
	}
}

@media (max-width: 480px) {
	.home-about__container,
	.home-challenge__container,
	.home-solution__container {
		padding: 0 16px;
	}

	.home-challenge__problems {
		gap: 2px 12px;
	}

	.home-challenge__list li {
		font-size: 13px;
		padding: 7px 0 7px 26px;
	}

	.home-challenge__list li::before {
		width: 16px;
		height: 16px;
		top: 10px;
	}

	.home-about__pillar {
		grid-template-columns: 56px 1fr;
		gap: 14px;
	}

	.home-about__pillar-icon {
		width: 52px;
		height: 52px;
	}

	.home-about__pillar-icon svg {
		width: 24px;
		height: 24px;
	}

	.home-about__stat strong {
		font-size: 28px;
	}

	.home-challenge__nodes {
		gap: 16px;
	}

	.home-challenge__node-icon {
		width: 56px;
		height: 56px;
	}

	.home-solution__hub-circle {
		width: 180px;
		height: 180px;
	}

	.home-solution__hub-circle strong {
		font-size: 18px;
	}
}


/**
 * Services Sections Styles
 * Core Capabilities, How We Work, Industries
 *
 * @package Skavend
 */

/* ==========================================
   Shared Section Styles
   ========================================== */
.capabilities-section,
.process-section,
.industries-section {
	padding-top: 0;
	padding-bottom: 0;
	background: transparent;
}

.capabilities-container,
.process-container,
.industries-container {
	width: var(--shell-width, 90%);
	margin: 0 auto;
}

.section-header {
	text-align: center;
	margin-bottom: clamp(28px, 4vw, 40px);
}

.section-eyebrow {
	display: inline-block;
	font: 600 13px/1 var(--font-sans, 'DM Sans', sans-serif);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #0a3d2d;
	margin: 0 0 12px;
}

.section-title {
	font-family: var(--font-serif, 'Playfair Display', Georgia, serif);
	font-size: var(--section-heading-size, clamp(28px, 2.5vw, 36px));
	font-weight: 700;
	line-height: var(--section-heading-line, 1.22);
	color: #1a2e26;
	margin: 0;
	max-width: 700px;
	margin-inline: auto;
}

/* ==========================================
   Section 1: Core Capabilities
   ========================================== */
.capabilities-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	margin-bottom: 0;
}

.capability-card {
	background: #f9f7f4;
	border: 1px solid #e8e3dc;
	border-radius: 12px;
	padding: 32px 20px;
	text-align: center;
	transition: all 0.3s ease;
}

.capability-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 24px rgba(10, 61, 45, 0.08);
	border-color: #d4a95a;
}

.capability-icon {
	width: 56px;
	height: 56px;
	margin: 0 auto 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #ffffff;
	border-radius: 50%;
	border: 1px solid #d4a95a;
	color: #0a3d2d;
}

.capability-icon svg {
	width: 28px;
	height: 28px;
}

.capability-title {
	font: 600 15px/1.3 var(--font-sans, 'DM Sans', sans-serif);
	color: #1a2e26;
	margin: 0 0 8px;
}

.capability-text {
	font: 400 13px/1.5 var(--font-sans, 'DM Sans', sans-serif);
	color: #5a6b63;
	margin: 0;
}

/* ==========================================
   Section 2: How We Work
   ========================================== */
.process-section {
	background: transparent;
}

.process-timeline {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 0;
	max-width: 1200px;
	margin: 0 auto;
}

.process-step {
	flex: 1;
	text-align: center;
	position: relative;
	padding: 0 12px;
}

.process-icon-wrapper {
	position: relative;
	display: flex;
	justify-content: center;
	margin-bottom: 24px;
}

.process-icon {
	width: 64px;
	height: 64px;
	background: #ffffff;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid #e8e3dc;
	color: #0a3d2d;
	box-shadow: 0 4px 12px rgba(10, 61, 45, 0.08);
	position: relative;
	z-index: 2;
}

.process-icon svg {
	width: 28px;
	height: 28px;
}

.process-connector {
	position: absolute;
	top: 50%;
	left: 50%;
	width: calc(100% + 12px);
	height: 2px;
	display: flex;
	align-items: center;
	z-index: 1;
}

.process-connector svg {
	width: 100%;
	height: 2px;
	color: #b8a68f;
}

.process-arrow {
	position: absolute;
	right: -8px;
	font-size: 16px;
	color: #0a3d2d;
	background: #ffffff;
	padding: 2px;
	border-radius: 50%;
}

.process-step--last .process-connector {
	display: none;
}

.process-number {
	display: block;
	font: 600 14px/1 var(--font-sans, 'DM Sans', sans-serif);
	color: #b07f45;
	margin-bottom: 6px;
}

.process-title {
	font: 600 18px/1.3 var(--font-sans, 'DM Sans', sans-serif);
	color: #1a2e26;
	margin: 0 0 12px;
}

.process-text {
	font: 400 13px/1.6 var(--font-sans, 'DM Sans', sans-serif);
	color: #5a6b63;
	margin: 0;
}

/* ==========================================
   Section 3: Industries We Serve
   ========================================== */
.industries-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	margin-bottom: 40px;
}

.industry-card {
	background: #ffffff;
	border: 1px solid #e8e3dc;
	border-radius: 12px;
	padding: 32px 24px;
	text-align: center;
	transition: all 0.3s ease;
}

.industry-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 24px rgba(10, 61, 45, 0.08);
	border-color: #d4a95a;
}

.industry-icon {
	width: 56px;
	height: 56px;
	margin: 0 auto 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #f9f7f4;
	border-radius: 50%;
	border: 1px solid #d4a95a;
	color: #0a3d2d;
}

.industry-icon svg {
	width: 28px;
	height: 28px;
}

.industry-title {
	font: 600 16px/1.3 var(--font-sans, 'DM Sans', sans-serif);
	color: #1a2e26;
	margin: 0 0 8px;
}

.industry-text {
	font: 400 13px/1.5 var(--font-sans, 'DM Sans', sans-serif);
	color: #5a6b63;
	margin: 0;
}

.industries-note,
.skavend-cards-note {
	text-align: center;
	font: 500 15px/1.5 var(--font-sans, 'DM Sans', sans-serif);
	color: #1a2e26;
	margin: 30px auto 0;
	max-width: 720px;
}

/* ==========================================
   Responsive
   ========================================== */
@media (max-width: 1280px) {
	.section-title {
		font-size: clamp(26px, 2.3vw, 32px);
	}
}

@media (max-width: 1024px) {
	.capabilities-grid,
	.capabilities-grid.skavend-wave-grid,
	.skavend-wave-grid--cap {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

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

	.process-timeline {
		flex-wrap: wrap;
		gap: 32px;
	}

	.process-step {
		flex: 0 0 calc(33.333% - 32px);
	}

	.process-step:last-child {
		flex: 0 0 100%;
	}
}

@media (max-width: 768px) {
	.section-title {
		font-size: clamp(24px, 5vw, 28px);
	}

	.process-step {
		flex: 0 0 100%;
	}

	.process-connector {
		display: none;
	}
}

@media (max-width: 680px) {
	.capabilities-grid,
	.capabilities-grid.skavend-wave-grid,
	.skavend-wave-grid--cap {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 480px) {
	.capabilities-grid,
	.industries-grid {
		grid-template-columns: 1fr;
	}

	.section-title {
		font-size: 24px;
	}
}

/**
 * Sections Styles: Case Studies, Technology & Engineering, AI Solutions
 *
 * @package Skavend
 */

/* ==========================================
   Shared Section Styles
   ========================================== */
.case-studies-section,
.tech-section,
.ai-section {
	padding-top: 0;
	padding-bottom: 0;
	background: transparent;
}

.case-studies-container,
.tech-container,
.ai-container {
	width: var(--shell-width, 90%);
	margin: 0 auto;
}

/* ==========================================
   SECTION 1: CASE STUDIES
   ========================================== */
.case-studies-header {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin-bottom: 48px;
}

.case-studies-eyebrow {
	font: 600 13px/1 var(--font-sans, 'DM Sans', sans-serif);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #0a3d2d;
	margin: 0 0 12px;
}

.case-studies-title {
	font: 700 42px/1.2 var(--font-serif, 'Playfair Display', Georgia, serif);
	color: #1a2e26;
	margin: 0;
}

.case-studies-view-all {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font: 600 15px/1 var(--font-sans, 'DM Sans', sans-serif);
	color: #0a3d2d;
	text-decoration: none;
	transition: color 0.2s ease;
}

.case-studies-view-all:hover {
	color: #b07f45;
}

.case-studies-arrow {
	font-size: 18px;
}

.case-studies-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

.case-study-card {
	background: #ffffff;
	border: 1px solid #e8e3dc;
	border-radius: 12px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: all 0.3s ease;
}

.case-study-card:hover {
	box-shadow: 0 12px 24px rgba(10, 61, 45, 0.08);
	transform: translateY(-4px);
}

.case-study-image {
	height: 220px;
	overflow: hidden;
}

.case-study-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.case-study-card:hover .case-study-image img {
	transform: scale(1.05);
}

.case-study-content {
	padding: 24px;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.case-study-category {
	font: 500 13px/1 var(--font-sans, 'DM Sans', sans-serif);
	color: #b07f45;
	margin: 0 0 8px;
}

.case-study-title {
	font: 700 22px/1.3 var(--font-sans, 'DM Sans', sans-serif);
	color: #1a2e26;
	margin: 0 0 12px;
}

.case-study-description {
	font: 400 14px/1.5 var(--font-sans, 'DM Sans', sans-serif);
	color: #5a6b63;
	margin: 0 0 20px;
}

.case-study-stats {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 16px 0;
	border-top: 1px solid #e8e3dc;
	border-bottom: 1px solid #e8e3dc;
	margin-bottom: 20px;
}

.case-study-stat {
	text-align: center;
	flex: 1;
}

.case-study-stat strong {
	display: block;
	font: 700 24px/1 var(--font-sans, 'DM Sans', sans-serif);
	color: #0a3d2d;
	margin-bottom: 4px;
}

.case-study-stat span {
	font: 400 11px/1.3 var(--font-sans, 'DM Sans', sans-serif);
	color: #8a9a93;
}

.case-study-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font: 600 14px/1 var(--font-sans, 'DM Sans', sans-serif);
	color: #0a3d2d;
	text-decoration: none;
	margin-top: auto;
	transition: color 0.2s ease;
}

.case-study-link:hover {
	color: #b07f45;
}

.case-study-link-arrow {
	font-size: 16px;
}

/* ==========================================
   SECTION 2: TECHNOLOGY & ENGINEERING
   ========================================== */
.tech-section {
	background: #f9f7f4;
	border-radius: 24px;
	margin: 0 96px;
}

.tech-header {
	text-align: center;
	margin-bottom: 60px;
}

.tech-eyebrow {
	font: 600 13px/1 var(--font-sans, 'DM Sans', sans-serif);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #b07f45;
	margin: 0 0 12px;
}

.tech-title {
	font: 700 42px/1.2 var(--font-serif, 'Playfair Display', Georgia, serif);
	color: #1a2e26;
	margin: 0;
}

.tech-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 24px;
}

.tech-item {
	background: #ffffff;
	border-radius: 12px;
	padding: 32px 24px;
	text-align: center;
	transition: all 0.3s ease;
}

.tech-item:hover {
	box-shadow: 0 12px 24px rgba(10, 61, 45, 0.08);
	transform: translateY(-4px);
}

.tech-item-icon {
	width: 64px;
	height: 64px;
	margin: 0 auto 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #f9f7f4;
	border-radius: 50%;
	border: 1px solid #d4a95a;
	color: #0a3d2d;
}

.tech-item-icon svg {
	width: 32px;
	height: 32px;
}

.tech-item-title {
	font: 600 15px/1.3 var(--font-sans, 'DM Sans', sans-serif);
	color: #1a2e26;
	margin: 0 0 12px;
}

.tech-item-text {
	font: 400 13px/1.5 var(--font-sans, 'DM Sans', sans-serif);
	color: #5a6b63;
	margin: 0;
}

/* ==========================================
   SECTION 3: AI & INTELLIGENT SOLUTIONS
   ========================================== */
.ai-section {
	background: #ffffff;
	border-radius: 24px;
	margin: 24px 96px;
	padding: 80px 96px;
}

.ai-header {
	text-align: center;
	margin-bottom: 60px;
}

.ai-eyebrow {
	font: 600 13px/1 var(--font-sans, 'DM Sans', sans-serif);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #0a3d2d;
	margin: 0 0 12px;
}

.ai-title {
	font: 700 42px/1.2 var(--font-serif, 'Playfair Display', Georgia, serif);
	color: #1a2e26;
	margin: 0 0 16px;
}

.ai-subtitle {
	font: 400 16px/1.6 var(--font-sans, 'DM Sans', sans-serif);
	color: #5a6b63;
	max-width: 600px;
	margin: 0 auto;
}

.ai-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 16px;
}

.ai-item {
	background: #ffffff;
	border: 1px solid #e8e3dc;
	border-radius: 12px;
	padding: 24px 16px;
	text-align: center;
	transition: all 0.3s ease;
}

.ai-item:hover {
	box-shadow: 0 12px 24px rgba(10, 61, 45, 0.08);
	transform: translateY(-4px);
	border-color: #d4a95a;
}

.ai-item-icon {
	width: 48px;
	height: 48px;
	margin: 0 auto 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #f9f7f4;
	border-radius: 50%;
	border: 1px solid #d4a95a;
	color: #0a3d2d;
}

.ai-item-icon svg {
	width: 24px;
	height: 24px;
}

.ai-item-title {
	font: 600 13px/1.4 var(--font-sans, 'DM Sans', sans-serif);
	color: #1a2e26;
	margin: 0 0 8px;
}

.ai-item-text {
	font: 400 12px/1.5 var(--font-sans, 'DM Sans', sans-serif);
	color: #5a6b63;
	margin: 0;
}

/* ==========================================
   Responsive
   ========================================== */
@media (max-width: 1280px) {
	.case-studies-section,
	.tech-section,
	.ai-section {
		padding: 60px 40px;
	}

	.tech-section,
	.ai-section {
		margin: 0 40px;
	}

	.case-studies-title,
	.tech-title,
	.ai-title {
		font-size: 36px;
	}

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

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

@media (max-width: 1024px) {
	.case-studies-grid {
		grid-template-columns: repeat(2, 1fr);
	}

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

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

@media (max-width: 768px) {
	.case-studies-section,
	.tech-section,
	.ai-section {
		padding: 40px 24px;
	}

	.tech-section,
	.ai-section {
		margin: 0 24px;
	}

	.case-studies-header {
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
	}

	.case-studies-title,
	.tech-title,
	.ai-title {
		font-size: 30px;
	}

	.case-studies-grid,
	.tech-grid,
	.ai-grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 480px) {
	.case-studies-section,
	.tech-section,
	.ai-section {
		padding: 32px 16px;
	}

	.tech-section,
	.ai-section {
		margin: 0 16px;
	}

	.case-studies-title,
	.tech-title,
	.ai-title {
		font-size: 26px;
	}
}

/**
 * Sections Styles: Technology & Engineering, AI Solutions, CTA Banner
 *
 * @package Skavend
 */

/* ==========================================
   SHARED
   ========================================== */
.tech-engineering-section,
.ai-solutions-section,
.cta-banner-section {
	width: 100%;
	background: linear-gradient(135deg, #f7f2ea 0%, #ece6dc 48%, #f6f1e9 100%);
}

.cta-banner-section__wrapper {
	background: transparent;
	border-radius: 0;
	padding: 0;
	position: relative;
	overflow: visible;
}

.tech-engineering-section__wrapper,
.ai-solutions-section__wrapper,
.cta-banner-section__wrapper {
	max-width: 1420px;
	margin: 0 auto;
	padding: 0 40px;
}

/* ==========================================
   SECTION 1: TECHNOLOGY & ENGINEERING
   ========================================== */
.tech-engineering-section {
	padding: 60px 0 20px;
}

.tech-engineering-section__wrapper {
	background: transparent;
	border: 0;
	border-radius: 0;
	padding: 0;
}

.tech-engineering-section__header {
	text-align: center;
	margin-bottom: 48px;
}

.tech-engineering-section__eyebrow {
	font-family: var(--font-sans, 'DM Sans', sans-serif);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #0a3d2d;
	margin: 0 0 12px;
	line-height: 1;
}

.tech-engineering-section__title {
	font-family: var(--font-serif, 'Playfair Display', Georgia, serif);
	font-size: 38px;
	font-weight: 700;
	line-height: 1.2;
	color: #1a2e26;
	margin: 0;
}

.tech-engineering-section__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	align-items: stretch;
}

.tech-engineering-section__item {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 20px 24px;
}

.tech-engineering-section__item--bordered {
	border-left: 1px solid #e8e3dc;
}

.tech-engineering-section__icon {
	width: 56px;
	height: 56px;
	margin-bottom: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0a3d2d;
}

.tech-engineering-section__icon svg {
	width: 28px;
	height: 28px;
}

.tech-engineering-section__item-title {
	font-family: var(--font-sans, 'DM Sans', sans-serif);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	color: #1a2e26;
	margin: 0 0 10px;
}

.tech-engineering-section__item-text {
	font-family: var(--font-sans, 'DM Sans', sans-serif);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.6;
	color: #5a6b63;
	margin: 0;
}

/* ==========================================
   SECTION 2: AI & INTELLIGENT SOLUTIONS
   ========================================== */
.ai-solutions-section {
	padding-top: var(--section-space, 7%);
	padding-bottom: var(--section-space, 7%);
}

.ai-solutions-section__wrapper {
	background: transparent;
	border: 0;
	border-radius: 0;
	padding: 0;
}

.ai-solutions-section__header {
	text-align: center;
	margin-bottom: 48px;
}

.ai-solutions-section__eyebrow {
	font-family: var(--font-sans, 'DM Sans', sans-serif);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #0a3d2d;
	margin: 0 0 12px;
	line-height: 1;
}

.ai-solutions-section__title {
	font-family: var(--font-serif, 'Playfair Display', Georgia, serif);
	font-size: 38px;
	font-weight: 700;
	line-height: 1.2;
	color: #1a2e26;
	margin: 0 0 12px;
}

.ai-solutions-section__subtitle {
	font-family: var(--font-sans, 'DM Sans', sans-serif);
	font-size: 15px;
	font-weight: 400;
	line-height: 1.6;
	color: #5a6b63;
	max-width: 600px;
	margin: 0 auto;
}

.ai-solutions-section__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	align-items: stretch;
}

.ai-solutions-section__item {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 20px 16px;
}

.ai-solutions-section__item--bordered {
	border-left: 1px solid #e8e3dc;
}

.ai-solutions-section__icon {
	width: 48px;
	height: 48px;
	margin-bottom: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0a3d2d;
}

.ai-solutions-section__icon svg {
	width: 28px;
	height: 28px;
}

.ai-solutions-section__item-title {
	font-family: var(--font-sans, 'DM Sans', sans-serif);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	color: #1a2e26;
	margin: 0 0 10px;
}

.ai-solutions-section__item-text {
	font-family: var(--font-sans, 'DM Sans', sans-serif);
	font-size: 12px;
	font-weight: 400;
	line-height: 1.6;
	color: #5a6b63;
	margin: 0;
}

/* ==========================================
   SECTION 3: CTA BANNER
   ========================================== */
.cta-banner-section {
	padding: 20px 0 60px;
}

.cta-banner-section__wrapper {
	background: linear-gradient(135deg, #0a3d2d 0%, #07301f 100%);
	border-radius: 24px;
	padding: 80px 60px;
	position: relative;
	overflow: hidden;
	max-width: 1320px;
	margin: 0 auto;
}

.cta-banner-section__content {
	max-width: 900px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.cta-banner-section__title {
	font-family: var(--font-serif, 'Playfair Display', Georgia, serif);
	font-size: clamp(26px, 3.2vw, 40px);
	font-weight: 700;
	line-height: 1.15;
	color: #ffffff;
	margin: 0 0 12px;
	white-space: normal;
}

.cta-banner-section__text {
	font-family: var(--font-sans, 'DM Sans', sans-serif);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.82);
	margin: 0 auto 24px;
	max-width: 560px;
}

.cta-banner-section__buttons {
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
	justify-content: center;
}

.cta-banner-section__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	height: 52px;
	padding: 0 28px;
	border-radius: 8px;
	font-family: var(--font-sans, 'DM Sans', sans-serif);
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
	transition: all 0.3s ease;
}

.cta-banner-section__btn--primary {
	background: #d4a95a;
	color: #0a3d2d;
	border: none;
}

.cta-banner-section__btn--primary:hover {
	background: #e0bd82;
	transform: translateY(-2px);
}

.cta-banner-section__btn--primary .cta-banner-section__btn-icon {
	width: 18px;
	height: 18px;
}

.cta-banner-section__btn--secondary {
	background: transparent;
	color: #ffffff;
	border: 1px solid rgba(255, 255, 255, 0.4);
}

.cta-banner-section__btn--secondary:hover {
	color: #ffffff;
	border-color: rgba(255, 255, 255, 0.75);
	background: rgba(255, 255, 255, 0.12);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
	transform: translateY(-2px);
}

/* ==========================================
   RESPONSIVE
   ========================================== */
@media (max-width: 1280px) {
	.tech-engineering-section__wrapper,
	.ai-solutions-section__wrapper,
	.cta-banner-section__wrapper {
		padding: 50px 30px;
	}

	.tech-engineering-section__title,
	.ai-solutions-section__title {
		font-size: 32px;
	}

	.cta-banner-section__title {
		font-size: 32px;
	}
}

@media (max-width: 1024px) {
	.tech-engineering-section__grid {
		flex-wrap: wrap;
		gap: 24px;
	}

	.tech-engineering-section__item {
		flex: 0 0 calc(33.333% - 24px);
	}

	.tech-engineering-section__item--bordered {
		border-left: none;
	}

	.ai-solutions-section__grid {
		flex-wrap: wrap;
		gap: 24px;
	}

	.ai-solutions-section__item {
		flex: 0 0 calc(33.333% - 24px);
	}

	.ai-solutions-section__item--bordered {
		border-left: none;
	}
}

@media (max-width: 768px) {
	.tech-engineering-section__wrapper,
	.ai-solutions-section__wrapper,
	.cta-banner-section__wrapper {
		padding: 40px 20px;
	}

	.tech-engineering-section__title,
	.ai-solutions-section__title {
		font-size: 28px;
	}

	.cta-banner-section__title {
		font-size: 28px;
	}

	.tech-engineering-section__item {
		flex: 0 0 calc(50% - 24px);
	}

	.ai-solutions-section__item {
		flex: 0 0 calc(50% - 24px);
	}

	.cta-banner-section__buttons {
		flex-direction: column;
	}

	.cta-banner-section__btn {
		width: 100%;
	}
}

@media (max-width: 480px) {
	.tech-engineering-section__item,
	.ai-solutions-section__item {
		flex: 0 0 100%;
	}

	.tech-engineering-section__title,
	.ai-solutions-section__title,
	.cta-banner-section__title {
		font-size: 24px;
	}
}