/* =========================================
   RESET / BASE
========================================= */

*{
	margin:0;
	padding:0;
	box-sizing:border-box;
}

:root{
	--bg:#05050a;
	--surface:#0a0a12;
	--text:#ffffff;
	--muted:rgba(255,255,255,.64);
	--muted-strong:rgba(255,255,255,.76);
	--purple:#9d5cff;
	--purple-light:#b785ff;
	--line:rgba(255,255,255,.09);
	--container:min(1600px, calc(100% - 64px));

	--card-radius:24px;
	--card-bg:linear-gradient(135deg, rgba(255,255,255,.055), rgba(255,255,255,.015));
	--card-bg-hover:linear-gradient(135deg, rgba(157,92,255,.12), rgba(255,255,255,.02));
	--card-shadow:0 24px 70px rgba(111,66,255,.18);
	--ease:.35s ease;
}

html{
	scroll-behavior:smooth;
}

body{
	font-family:'Inter', sans-serif;
	background:var(--bg);
	color:var(--text);
	overflow-x:hidden;
}

body.menu-open{
	overflow:hidden;
}

a{
	color:inherit;
}

img,
video,
svg{
	display:block;
}

button{
	font:inherit;
}

.container,
.build-container{
	width:var(--container);
	margin-inline:auto;
}

.section-label,
.section-kicker,
.build-eyebrow,
.why-label{
	display:block;
	color:var(--purple-light);
	text-transform:uppercase;
	letter-spacing:.22em;
	font-size:.78rem;
	font-weight:600;
}

.section-label{
	margin-bottom:22px;
}

h1 em,
h2 em{
	font-family:Georgia, serif;
	font-style:italic;
	color:var(--purple-light);
}

h2{
	font-size:clamp(3rem, 5vw, 6rem);
	font-weight:300;
	line-height:.95;
	letter-spacing:-.065em;
}


/* =========================================
   SHARED COMPONENTS
========================================= */

.btn-outline,
.btn-primary{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:16px;

	text-decoration:none;
	font-size:.82rem;
	font-weight:600;
	letter-spacing:.08em;
	color:white;

	border:1px solid rgba(157,92,255,.42);
	backdrop-filter:blur(14px);

	transition:
		transform var(--ease),
		border-color var(--ease),
		box-shadow var(--ease);
}

.btn-outline{
	height:58px;
	padding:0 28px;
	border-radius:8px;
	background:linear-gradient(to bottom, rgba(255,255,255,.03), rgba(255,255,255,.01));
}

.btn-primary{
	height:70px;
	padding:0 38px;
	border-radius:12px;
	background:linear-gradient(135deg, rgba(157,92,255,.22), rgba(255,255,255,.03));
	box-shadow:0 14px 50px rgba(111,66,255,.18);
}

.btn-outline:hover,
.btn-primary:hover{
	transform:translateY(-3px);
	border-color:rgba(157,92,255,.72);
	box-shadow:0 24px 70px rgba(111,66,255,.28);
}

.build-card,
.why-card{
	position:relative;
	overflow:hidden;

	border:1px solid var(--line);
	border-radius:var(--card-radius);
	background:var(--card-bg);

	transition:
		transform var(--ease),
		border-color var(--ease),
		box-shadow var(--ease),
		background var(--ease);
}

.build-card::before,
.why-card::before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:1px;
	z-index:4;

	background:linear-gradient(90deg, rgba(157,92,255,.35), transparent);
}

.build-card:hover,
.why-card:hover{
	transform:translateY(-6px);
	border-color:rgba(157,92,255,.28);
	box-shadow:var(--card-shadow);
	background:var(--card-bg-hover);
}


/* =========================================
   HERO
========================================= */

.hero{
	position:relative;
	min-height:100vh;
	padding:0px 24px 180px;
	overflow:hidden;
	background:var(--bg);
}

.hero-video{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center center;
	z-index:0;
	pointer-events:none;
}

.hero-overlay{
	position:absolute;
	inset:0;
	z-index:1;
	background:
		linear-gradient(
			90deg,
			rgba(5,5,10,.96) 0%,
			rgba(5,5,10,.88) 22%,
			rgba(5,5,10,.50) 50%,
			rgba(5,5,10,.15) 100%
		),
		linear-gradient(
			180deg,
			rgba(5,5,10,.05) 0%,
			rgba(5,5,10,.28) 62%,
			var(--bg) 100%
		);
}


/* =========================================
   NAVIGATION
========================================= */

.nav-wrap{
	position:fixed;
	top:24px;
	left:0;
	right:0;
	z-index:1005;

	width:var(--container);
	margin-inline:auto;

	transition:top .35s ease;
}

.nav-wrap.is-scrolled{
	top:12px;
}

.nav-wrap.is-scrolled .nav{
	height:82px;
	background:rgba(5,5,10,.72);
	border-color:rgba(255,255,255,.085);
	box-shadow:0 24px 70px rgba(0,0,0,.28);
}

.nav{
	position:relative;
	width:100%;
	height:100px;
	margin:0;
	padding:0 40px;

	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:32px;

	border:1px solid rgba(255,255,255,.055);
	border-radius:24px;

	background:linear-gradient(to bottom, rgba(255,255,255,.035), rgba(255,255,255,.012));
	backdrop-filter:blur(14px);

	z-index:1005;

	transition:
		height .35s ease,
		background .35s ease,
		border-color .35s ease,
		box-shadow .35s ease,
		backdrop-filter .35s ease;
}

.nav-lang{
	display:flex;
	align-items:center;
	height:100%;
	padding:0 16px;

	font-size:.78rem;
	font-weight:600;
	letter-spacing:.16em;
	text-transform:uppercase;

	color:var(--text-muted);
	text-decoration:none;

	transition:
		color .25s ease,
		transform .25s ease;
}

.nav-lang:hover{
	color:var(--accent);
	transform:translateY(-2px);
}

.logo{
	flex:0 0 auto;
	text-decoration:none;
	color:white;
	letter-spacing:.32em;
}

.logo span,
.logo small{
	display:block;
}

.logo span{
	font-size:2.2rem;
	font-weight:300;
	line-height:1;
}

.logo small{
	margin-top:10px;
	font-size:.72rem;
	letter-spacing:.52em;
	color:rgba(255,255,255,.72);
}

.nav-links{
	display:flex;
	align-items:center;
	justify-content:center;
	margin-left:auto;
	margin-right:90px;
	gap:52px;
}

.nav-links a{
	position:relative;
	text-decoration:none;
	font-size:.82rem;
	font-weight:600;
	letter-spacing:.08em;
	color:rgba(255,255,255,.82);
	transition:color .3s ease;
}

.nav-links a:hover{
	color:white;
}

.nav-links a::after{
	content:"";
	position:absolute;
	left:0;
	bottom:-8px;
	width:0;
	height:2px;
	background:var(--purple);
	transition:width .3s ease;
}

.nav-links a:hover::after{
	width:100%;
}

.nav-cta{
	flex:0 0 auto;
}


/* =========================================
   MOBILE NAV
========================================= */

.nav-toggle{
	display:none;
	width:52px;
	height:52px;
	align-items:center;
	justify-content:center;
	flex-direction:column;
	gap:6px;

	background:transparent;
	border:0;
	cursor:pointer;

	position:relative;
	z-index:1006;

	outline:none;
	-webkit-tap-highlight-color:transparent;
}

.nav-toggle:focus{
	outline:none;
}

.nav-toggle:focus-visible{
	outline:1px solid rgba(157,92,255,.6);
	outline-offset:4px;
	border-radius:8px;
}

.nav-toggle span{
	width:24px;
	height:2px;
	background:#fff;
	transition:
		transform .3s ease,
		opacity .3s ease;
}

body.menu-open .nav-toggle span:first-child{
	transform:translateY(4px) rotate(45deg);
}

body.menu-open .nav-toggle span:last-child{
	transform:translateY(-4px) rotate(-45deg);
}

body.menu-open .mobile-menu-label,
body.menu-open .mobile-nav a,
body.menu-open .mobile-lang,
body.menu-open .mobile-cta{
	opacity:1;
	transform:translateY(0);
}

body.menu-open .mobile-lang{
	transition-delay:.1s;
}

body.menu-open .mobile-nav a:nth-child(1){
	transition-delay:.16s;
}

body.menu-open .mobile-nav a:nth-child(2){
	transition-delay:.22s;
}

body.menu-open .mobile-nav a:nth-child(3){
	transition-delay:.28s;
}

body.menu-open .mobile-cta{
	transition-delay:.34s;
}

.mobile-menu{
	position:fixed;
	inset:0;
	z-index:1001;

	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:flex-start;
	gap:32px;

	padding:180px 32px 48px;

	background:
		radial-gradient(circle at top center, rgba(157,92,255,.18), transparent 52%),
		var(--bg);

	opacity:0;
	visibility:hidden;
	pointer-events:none;
	transform:translateY(-30px);

	transition:
		opacity .35s ease,
		visibility .35s ease,
		transform .35s ease;
}

.mobile-menu-label{
	color:var(--purple-light);
	text-transform:uppercase;
	letter-spacing:.22em;
	font-size:.72rem;
	font-weight:600;
	position:relative;
	padding-bottom:18px;
	margin-bottom:10px;

	opacity:0;
	transform:translateY(12px);
	transition:
		opacity .35s ease .08s,
		transform .35s ease .08s;
}

.mobile-menu-label::after{
	content:'';
	position:absolute;
	left:50%;
	bottom:0;

	width:40px;
	height:1px;

	background:rgba(157,92,255,.3);

	transform:translateX(-50%);
}

body.menu-open .mobile-menu{
	opacity:1;
	visibility:visible;
	pointer-events:auto;
	transform:translateY(0);
}

.mobile-nav{
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:22px;
}

.mobile-nav a{
	color:#fff;
	text-decoration:none;
	text-transform:none;
	font-size:3.25rem;
	line-height:1.05;
	font-weight:300;
	letter-spacing:-.045em;
	opacity:0;
	transform:translateY(16px);

	transition:
		color .3s ease,
		opacity .4s ease,
		transform .4s ease;
}

.mobile-nav a:hover,
.mobile-nav a:active{
	color:var(--purple-light);
	transform:translateX(4px);
}

.mobile-nav a{
	-webkit-tap-highlight-color: transparent;
	outline:none;
}

.mobile-nav a:focus{
	outline:none;
}

.mobile-nav a:active{
	outline:none;
}

.mobile-nav a:focus-visible{
	outline:none;
	box-shadow:none;
}

.mobile-cta{
	display:inline-flex;
	align-items:center;
	margin-top:0;
	justify-content:center;
	gap:14px;

	min-height:60px;
	padding:0 30px;

	border:1px solid rgba(157,92,255,.45);
	border-radius:999px;

	color:#fff;
	text-decoration:none;
	font-size:.82rem;
	font-weight:600;
	letter-spacing:.08em;
	text-transform:uppercase;

	opacity:0;
	transform:translateY(16px);

	background:linear-gradient(135deg, rgba(157,92,255,.18), rgba(255,255,255,.03));

	transition:
		transform .4s ease,
		opacity .4s ease,
		border-color var(--ease),
		box-shadow var(--ease);
}

.mobile-cta:hover{
	transform:translateY(-2px);
	border-color:rgba(157,92,255,.65);
	box-shadow:0 0 30px rgba(157,92,255,.18);
}

.mobile-lang{
	display:inline-flex;
	align-items:center;
	justify-content:center;

	width:auto;
	height:auto;
	padding:8px 12px;
	margin-top:-20px;
	margin-bottom:4px;

	border:1px solid rgba(157,92,255,.22);
	border-radius:999px;

	color:var(--purple-light);
	font-size:.7rem;
	font-weight:600;
	letter-spacing:.14em;
	text-decoration:none;

	background:rgba(157,92,255,.06);

	opacity:0;
	transform:translateY(14px);

	transition:
		opacity .35s ease,
		transform .35s ease,
		border-color .25s ease,
		background .25s ease;
}

.mobile-lang:hover,
.mobile-lang:active{
	border-color:rgba(157,92,255,.6);
	background:rgba(157,92,255,.14);
}

/* =========================================
   HERO CONTENT
========================================= */

.hero-content{
	width:var(--container);
	min-height:auto;
	padding-top:160px;
	display:grid;
	align-items:start;
	margin: 0 auto;
	position:relative;
	z-index:5;
}

.eyebrow{
	display:flex;
	align-items:center;
	gap:12px;
	margin-bottom:28px;

	font-size:.78rem;
	font-weight:500;
	letter-spacing:.18em;
	color:#d2c6ff;
}

.eyebrow span{
	width:8px;
	height:8px;
	border-radius:999px;
	background:var(--purple);
	box-shadow:0 0 20px var(--purple);
}

.hero-left h1{
	font-size:clamp(4.5rem, 8vw, 8rem);
	line-height:.95;
	font-weight:300;
	letter-spacing:-.07em;
	margin-bottom:36px;
	text-shadow:0 10px 40px rgba(0,0,0,.4);
}

.hero-left h1 em{
	font-weight:400;
}

.hero-text{
	max-width:640px;
	font-size:1.28rem;
	line-height:1.8;
	color:var(--muted-strong);
	margin-bottom:44px;
}

.footer{
	padding:40px 0 50px;
	border-top:1px solid rgba(255,255,255,.05);
}

.footer-inner{
	width:var(--container);
	margin:auto;

	display:flex;
	align-items:flex-end;
	justify-content:space-between;
	gap:40px;
}

.footer-brand h2{
	font-size:2rem;
	font-weight:300;
	letter-spacing:.12em;
	margin:0;
}

.footer-brand p{
	margin-top:8px;
	font-size:.75rem;
	letter-spacing:.4em;
	color:var(--text-muted);
}

.footer-meta{
	font-size:.8rem;
	color:var(--text-muted);
}

.footer-brand span{
	display:block;
	margin-top:16px;
	font-size:.8rem;
	color:rgba(255,255,255,.45);
}

.footer-brand a{
	color:white;
	text-decoration:none;
}

.footer-tagline{
	color:rgba(255,255,255,.55);
	font-size:.95rem;
}
/* =========================================
   FEATURED PROJECT
========================================= */

.featured-project{
	padding:0 0 140px;
	background:transparent;
}

.project-header{
	max-width:760px;
	margin-bottom:34px;
}

.project-header h2{
	font-size:clamp(3rem, 4vw, 4.5rem);
	margin-bottom:20px;
}

.project-intro{
	max-width:700px;
	font-size:1.15rem;
	line-height:1.9;
	color:var(--muted);
	margin-bottom:28px;
}

.project-showcase{
	display:grid;
	grid-template-columns:1.45fr .55fr;
	gap:72px;
	align-items:start;
}

.project-image{
	position:relative;
	padding-top:40px;
	border:1px solid var(--line);
	border-radius:24px;
	overflow:hidden;
	background:var(--surface);
	max-height:560px;
}

.project-image::before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	right:0;
	height:40px;
	background:#111118;
	border-bottom:1px solid rgba(255,255,255,.06);
}

.project-image::after{
	content:"●  ●  ●";
	position:absolute;
	top:11px;
	left:18px;
	font-size:12px;
	color:rgba(255,255,255,.25);
}

.project-image img{
	width:100%;
	height:440px;
	object-fit:cover;
	object-position:top center;
	transition:transform .5s ease;
}

.project-image:hover img{
	transform:scale(1.02);
}

.project-side{
	padding-top:4px;
}

.project-details{
	margin-bottom:28px;
}

.project-details h3,
.project-outcomes h3{
	font-size:1rem;
	font-weight:600;
	text-transform:uppercase;
	letter-spacing:.18em;
	color:var(--purple-light);
	margin-bottom:28px;
}

.detail-item,
.outcome-item{
	padding:12px 0;
	border-bottom:1px solid var(--line);
}

.detail-item:first-of-type,
.outcome-item:first-of-type{
	border-top:1px solid var(--line);
}

.detail-item span{
	display:block;
	margin-bottom:6px;
	color:rgba(255,255,255,.35);
	font-size:.75rem;
	letter-spacing:.12em;
	text-transform:uppercase;
}

.detail-item p,
.outcome-item p{
	color:rgba(255,255,255,.84);
	line-height:1.7;
}


/* =========================================
   WHAT WE BUILD
========================================= */

.build-section{
	padding:0 0 140px;
	background:transparent;
	position:relative;
	overflow:hidden;
}

.build-header{
	max-width:820px;
	margin-bottom:68px;
}

.build-header h2{
	margin-top:22px;
	font-size:clamp(3rem, 4.5vw, 5.25rem);
	font-weight:300;
	line-height:.95;
	letter-spacing:-.065em;
	color:var(--text);
}

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

.build-card-content{
	position:relative;
	z-index:3;
}

.build-card h3{
	margin:1.8rem 0 1.1rem;
	color:var(--text);
	font-size:clamp(1.85rem, 2vw, 2.4rem);
	line-height:1;
	font-weight:300;
	letter-spacing:-.045em;
}

.build-card p{
	max-width:520px;
	color:rgba(255,255,255,.6);
	font-size:1rem;
	line-height:1.75;
}

.build-card-featured{
	grid-column:span 2;
	min-height:320px;
	padding:40px;
}

.build-card-featured::after{
	content:"";
	position:absolute;
	right:-120px;
	bottom:-120px;
	width:320px;
	height:320px;
	border-radius:50%;

	background:radial-gradient(circle, rgba(157,92,255,.12), transparent 70%);
	opacity:0;
	transition:opacity var(--ease);
}

.build-card-featured:hover::after{
	opacity:1;
}

.build-card-small{
	min-height:260px;
	padding:32px;
}

.build-card-small h3{
	font-size:1.75rem;
}

.build-card-small p{
	font-size:.96rem;
	line-height:1.7;
}

.build-screenshot{
	position:absolute;
	right:18px;
	bottom:-85px;
	width:54%;
	min-width:300px;

	border:1px solid rgba(255,255,255,.12);
	border-radius:18px;
	overflow:hidden;

	opacity:.14;
	transform:rotate(-4deg);

	background:var(--surface);
	box-shadow:0 30px 80px rgba(0,0,0,.35);

	transition:
		opacity var(--ease),
		transform var(--ease);
}

.build-screenshot::before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	right:0;
	height:34px;
	z-index:2;

	background:rgba(12,12,18,.92);
	border-bottom:1px solid rgba(255,255,255,.08);
}

.build-screenshot::after{
	content:"●  ●  ●";
	position:absolute;
	top:9px;
	left:16px;
	z-index:3;

	font-size:11px;
	letter-spacing:3px;
	color:rgba(255,255,255,.25);
}

.build-screenshot img{
	width:100%;
	height:auto;
	padding-top:34px;

	filter:
		brightness(.7)
		saturate(.8)
		contrast(1.05)
		blur(.3px);
}

.build-card:hover .build-screenshot{
	opacity:.25;
	transform:rotate(-2deg) translateY(-8px);
}

.build-ghost-icon{
	position:absolute;
	right:-1.2rem;
	bottom:-1.4rem;
	z-index:1;

	width:11rem;
	height:11rem;

	stroke:var(--purple-light);
	fill:none;
	stroke-width:1.4;
	opacity:.04;

	transition:
		opacity var(--ease),
		transform var(--ease);
}

.build-card-small:hover .build-ghost-icon{
	opacity:.1;
	transform:scale(1.08) translate(-.5rem, -.5rem);
}


/* =========================================
   WHY KAJA
========================================= */

.why-section{
	padding:0 0 140px;
}

.why-header{
	max-width:820px;
	margin-bottom:64px;
}

.why-header h2{
	font-size:clamp(2.6rem, 4vw, 4.5rem);
	margin-bottom:28px;
}

.why-text{
	max-width:640px;
	color:var(--muted);
	font-size:1.15rem;
	line-height:1.9;
}

.why-card-grid{
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	gap:24px;
}

.why-card{
	min-height:320px;
	padding:36px;
}

.why-icon{
	position:absolute;
	inset:0;
	padding:20px;
	pointer-events:none;
}

.why-icon svg{
	position:absolute;
	top:24px;
	right:24px;

	width:160px;
	height:160px;

	opacity:.045;
	pointer-events:none;
	transition:
		opacity var(--ease),
		transform var(--ease);

	stroke:var(--purple-light);
	fill:none;
	stroke-width:1.4;
	stroke-linecap:round;
	stroke-linejoin:round;
}

.why-card:hover .why-icon svg{
	opacity:.08;
	transform:scale(1.1) rotate(-4deg);
}

.why-label{
	margin-bottom:48px;
	font-size:.72rem;
	letter-spacing:.18em;
}

.why-card h3,
.why-card p{
	position:relative;
	z-index:2;
}

.why-card h3{
	margin-top:110px;
	margin-bottom:16px;

	font-size:1.85rem;
	font-weight:300;
	line-height:1.1;
	letter-spacing:-.03em;
}

.why-card p{
	color:rgba(255,255,255,.6);
	line-height:1.75;
}


/* =========================================
   CTA
========================================= */

.final-cta{
	padding:0 0 100px;
}

.cta-panel{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:60px;

	padding:70px;
	border:1px solid var(--line);
	border-radius:28px;

	background:linear-gradient(135deg, rgba(157,92,255,.14), rgba(255,255,255,.025));
}

.cta-panel h2{
	font-size:clamp(2.8rem, 5vw, 5.5rem);
	margin-bottom:24px;
}

.cta-panel p:not(.section-label){
	max-width:640px;
	color:var(--muted);
	font-size:1.1rem;
	line-height:1.8;
}


/* =========================================
   RESPONSIVE
========================================= */

@media(max-width:1200px){
	.project-showcase,
	.build-grid{
		grid-template-columns:1fr;
	}

	.project-side{
		display:grid;
		grid-template-columns:1fr 1fr;
		gap:40px;
	}

	.build-card-featured{
		grid-column:span 1;
	}

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

@media(max-width:1100px){
	.nav-links,
	.nav-lang,
	.nav-cta{
		display:none;
	}

	.nav-toggle{
		display:flex;
	}
}

@media(min-width:1101px){
	.mobile-menu{
		display:none;
	}
}

@media(max-width:800px){
	:root{
		--container:min(100% - 32px, 1600px);
	}
	
	.hero{
		padding:0px 14px 90px;
	}

	.nav{
		height:82px;
		padding:0 18px;
		border-radius:18px;
	}

	.logo span{
		font-size:1.55rem;
	}

	.logo small{
		font-size:.58rem;
	}

	.hero-content{
		min-height:auto;
		padding-top:140px;
		align-items:start;
	}

	.hero-left h1{
		font-size:clamp(3.4rem, 15vw, 5rem);
		letter-spacing:-.065em;
	}

	.hero-text{
		font-size:1.05rem;
	}

	.btn-primary{
		width:100%;
		height:64px;
		padding:0 24px;
	}

	.featured-project,
	.build-section,
	.why-section,
	.final-cta{
		padding-bottom:90px;
	}

	.project-showcase{
		gap:42px;
	}

	.project-side{
		grid-template-columns:1fr;
		gap:0;
	}

	.project-details{
		margin-bottom:42px;
	}

	.project-image{
		max-height:none;
	}

	.project-image img{
		height:auto;
		object-fit:contain;
		object-position:top center;
	}

	.build-header,
	.why-header{
		margin-bottom:52px;
	}

	.build-grid,
	.why-card-grid{
		grid-template-columns:1fr;
		gap:18px;
	}

	.build-card-featured,
	.build-card-small{
		min-height:320px;
		padding:28px;
	}

	.build-screenshot{
		right:14px;
		bottom:-70px;
		width:72%;
		min-width:220px;
		opacity:.14;
	}

	.build-card:hover .build-screenshot{
		opacity:.22;
	}

	.build-ghost-icon{
		width:11rem;
		height:11rem;
	}

	.project-outcomes h3{
		margin-bottom:20px;
	}

	.why-card{
		min-height:260px;
		padding:30px;
	}

	.why-card h3{
		margin-top:90px;
	}

	.cta-panel{
		flex-direction:column;
		align-items:flex-start;
		padding:40px 28px;
	}

	.cta-panel .btn-primary{
		width:100%;
	}
}

@media(max-width:520px){
	.section-label,
	.section-kicker,
	.build-eyebrow,
	.why-label{
		font-size:.7rem;
	}

	h2,
	.build-header h2{
		font-size:clamp(2.8rem, 13vw, 4.5rem);
	}

	.project-header h2{
		font-size:clamp(2.9rem, 13vw, 4.2rem);
	}

	.build-card h3{
		font-size:1.8rem;
	}
}