.whoopwhoop-hero {
	position: relative;
	width: 100vw;
	height: 100vh;
	background-color: #000000;
	color: #ffffff;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	cursor: default;
}
.section-blog-post-content .text-rich-text a{
	    font-weight: 600;
    text-decoration: underline;
}
.whoopwhoop-mouth-img {
	position: absolute;
	top: 15%;
	left: 5%;
	width: clamp(120px, 15vw, 220px);
	height: auto;
	z-index: 4;
	pointer-events: none;
}
.why-we-started{
	grid-template-rows: 100%;
}
.whoopwhoop-bottom-container {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 5;
}
.section-our-approach-premium {
	background-color: #ffffff;
	position: relative;
	overflow: hidden;
}

/* --- Custom Header Layout --- */
.approach-header-layout {
	display: flex;
	justify-content: space-between;
	align-items: flex-end; /* Keeps text and button aligned to the bottom of the heading */
	gap: 50px;
	width: 100%;
}

.approach-header-left {
	flex: 1; /* Takes up remaining space */
}

.approach-header-right {
	flex: 0 0 auto;
	width: 100%;
	max-width: 450px; /* Keeps the text from spreading too wide */
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 25px;
	margin-bottom: 10px; /* Slight optical adjustment to align with heading baseline */
}

.approach-description {
	color: #4a4a4a;
	margin: 0;
	font-size: 1.1rem;
	line-height: 1.5;
}

/* --- Row Container --- */
.approach-rows-container {
	border-top: 2px solid #000;
	display: flex;
	flex-direction: column;
}

/* Individual Row */
.approach-row {
	position: relative;
	border-bottom: 2px solid #000;
	padding: 60px 0;
	overflow: hidden;
}

/* Dark Background Reveal on Hover */
.approach-row-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	transform: scaleY(0);
	transform-origin: bottom;
	transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
	z-index: 1;
}
.approach-row:hover .approach-row-bg {
	transform: scaleY(1);
	transform-origin: top;
}

/* Content inside Row */
.approach-row-content {
	position: relative;
	z-index: 2;
	display: flex;
	justify-content: space-between;
	align-items: center;
	transition: padding 0.5s cubic-bezier(0.16, 1, 0.3, 1);
	width: 100%;
}
.approach-row:hover .approach-row-content {
	padding: 0 40px;
}

/* Title inside Row */
.row-title {
	font-size: clamp(3.5rem, 7vw, 7rem);
	line-height: 1;
	font-weight: 500;
	color: #000;
	margin: 0;
	text-transform: uppercase;
	transition: color 0.4s ease, transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.approach-row:hover .row-title {
	color: #ffffff;
	transform: translateX(10px);
}

/* Description inside Row */
.row-desc {
	font-size: clamp(1rem, 1.1vw, 1.15rem);
	color: #4a4a4a;
	max-width: 400px;
	text-align: left;
	margin: 0;
	transition: color 0.4s ease;
}
.approach-row:hover .row-desc {
	color: #e0e0e0;
}

/* Reveal Animation on Scroll */
.approach-reveal {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.approach-reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
}


.custom-top-right {
	display: flex;
	flex-direction: column;
	gap: 20px;
	align-items: flex-start;
	justify-content: flex-end;
	width: 100%; 
	max-width: 420px; 
	margin-left: auto; 
	justify-self: end; 
}

.custom-top-desc {
	margin: 0;
	color: #555555;
	font-size: 1.05rem;
	line-height: 1.6;
}

@media screen and (max-width: 991px) {
	.custom-top-right {
		grid-column: 1 / -1;
		margin-top: 30px;
		margin-left: 0; 
		max-width: 100%;
	}
}
/* --- Mobile Responsive Design --- */
@media screen and (max-width: 991px) {
	/* Stack header on mobile perfectly */
	.approach-header-layout {
		flex-direction: column;
		align-items: flex-start;
		gap: 30px;
	}
	.why-we-started{
		grid-template-rows: auto;
	}
	.section-home-why-us .w-layout-grid.top-grid{
		display: block;
	}
	.approach-header-right {
		max-width: 100%;
		margin-bottom: 0;
	}

	/* Adjust row padding and layout */
	.approach-row {
		padding: 40px 0;
	}

	.approach-row-content {
		flex-direction: column;
		align-items: flex-start;
		gap: 20px;
	}

	.approach-row:hover .approach-row-content {
		padding: 20px;
	}

	.row-desc {
		max-width: 100%;
	}
}
.whoopwhoop-bottom-left {
	position: absolute;
	bottom: 40px;
	left: 5%;
	font-size: 14px;
	line-height: 1.6;
	max-width: 400px;
	color: #cccccc;
}

.whoopwhoop-bottom-right {
	position: absolute;
	bottom: 40px;
	right: 5%;
	font-size: 14px;
	line-height: 1.6;
	text-align: right;
	max-width: 300px;
	color: #ffffff;
	font-weight: 600;
}

.whoopwhoop-text-wrapper {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	perspective: 800px;
	z-index: 10;
	width: 100%;
	pointer-events: none;
}

.whoopwhoop-top-text {
	align-self: flex-end;
	margin-right: 15vw;
	font-family: Impact, "Arial Black", sans-serif;
	font-size: clamp(1.5rem, 4.5vw, 6rem);
	color: transparent;
	-webkit-text-stroke: 2px #ffffff;
	line-height: 1;
	text-transform: uppercase;
	transform-origin: center;
	transform: translateX(5vw) rotateY(25deg);
	transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

.whoopwhoop-main-text {
	align-self: center;
	font-family: Impact, "Arial Black", sans-serif;
	font-size: clamp(3rem, 11vw, 17rem);
	color: #ffffff;
	line-height: 0.8;
	text-transform: uppercase;
	letter-spacing: -2px;
	transform-origin: center;
	transform: translateX(-5vw) rotateY(-25deg) scaleY(1.4);
	transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
	white-space: nowrap;
	margin: 8vh 0;
	pointer-events: auto;
	cursor: none;
}

.whoopwhoop-bottom-text {
	align-self: center;
	margin-left: 20vw;
	font-family: Impact, "Arial Black", sans-serif;
	font-size: clamp(2rem, 5.5vw, 7rem);
	color: #ffffff;
	line-height: 1;
	text-transform: uppercase;
	transform-origin: center;
	transform: translateX(5vw) rotateY(20deg);
	transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

.whoopwhoop-hero.is-hovered .whoopwhoop-top-text {
	transform: translateX(0) rotateY(0) scale(0.9);
}

.whoopwhoop-hero.is-hovered .whoopwhoop-main-text {
	transform: translateX(0) rotateY(0) scaleY(1.4);
}

.whoopwhoop-hero.is-hovered .whoopwhoop-bottom-text {
	transform: translateX(0) rotateY(0) scale(0.9);
}

.whoopwhoop-cursor-wrapper {
	position: absolute;
	top: 0;
	left: 0;
	width: 80px;
	height: 80px;
	pointer-events: none;
	z-index: 40;
	mix-blend-mode: difference;
	transform: translate(-100px, -100px);
}

.whoopwhoop-cursor-shape {
	width: 100%;
	height: 100%;
	background-color: #ffffff;
	border-radius: 50%;
	opacity: 0;
	transform: translate(-50%, -50%) scale(1);
	transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease;
}

.whoopwhoop-hero.is-hovered .whoopwhoop-cursor-shape {
	transform: translate(-50%, -50%) scale(6);
	opacity: 1;
}


.logo-wrap{
	height: 3.65rem;
}
.logo-wrap img{
	height: 3.65rem;
}
.footer-logo{
	height:5rem;
}
footer #w-node-_25bed62b-2c8e-3001-ace8-602b5a18dadf-5a18da5f{
	justify-self: center;
}
.cta-container{
	border-radius:unset;
}
.plan-features-dark li::before{
	content: "•" !important;
}
.custom-grid-form {
	width: 100%;
}

.custom-grid-form .form-row {
	display: flex;
	gap: 20px;
	margin-bottom: 20px;
}
.section-about-process{
	border-radius:unset !important;
}
.hide-for-desktop{
	display:none;
}
.custom-grid-form .form-col {
	flex: 1;
	display: flex;
	flex-direction: column;
	position: relative;
}

.custom-grid-form .full-width {
	flex-direction: column;
}

.custom-grid-form label,
.custom-grid-form .form-label {
	margin: 0 !important;
	padding: 0 !important;
}

.wpcf7-form p {
	margin: 0 !important;
}

.wpcf7-form-control-wrap {
	position: relative;
	margin: 0 !important;
}

.custom-grid-form input[type="text"],
.custom-grid-form input[type="email"],
.custom-grid-form input[type="tel"],
.custom-grid-form select {
	height: 52px;
}

.custom-grid-form textarea {
	height: 110px !important;
	resize: none;
}

.wpcf7-spinner {
	display: none !important;
}

/* .wpcf7-response-output {
display: none !important;
} */

.wpcf7-not-valid-tip {
	display: none !important;
}

.wpcf7-not-valid {
	border-color: #ff3b3b !important;
}

.wpcf7-form-control-wrap:has(.wpcf7-not-valid)::after {
	content: "This field is required";
	position: absolute;
	left: 0;
	top: 100%;
	transform: translateY(6px);
	background: #ff3b3b;
	color: #fff;
	font-size: 11px;
	padding: 5px 10px;
	border-radius: 6px;
	white-space: nowrap;
	z-index: 10;
}

.custom-grid-form select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	padding-right: 45px;
	background-color: var(--background-color--background-25) !important;
}

.select-col {
	position: relative;
}

.select-col::after {
	content: "";
	position: absolute;
	right: 20px;
	top: calc(50% + 8px);
	width: 8px;
	height: 8px;
	border-right: 2px solid #aaa;
	border-bottom: 2px solid #aaa;
	transform: rotate(45deg);
	pointer-events: none;
}
.lastbutton, form.wpcf7-form.invalid{
	margin-bottom:0 !important;
}
.background-video-wrap{
	border-radius: 20px;
}

.padding-bottom-0 { padding-bottom: 0 !important; }

/* --- PRICING SECTION SPACING & UI --- */
.section-pricing-dark { 
	padding: 40px 0 100px 0 !important; 
	background-color: #0e0e0e; 
	color: #fff; 
}

.pricing-grid { 
	display: grid; 
	grid-template-columns: repeat(3, 1fr); 
	gap: 30px; 
	margin-top: 50px; 
}

.pricing-card-white { 
	background: #ffffff; 
	color: #000000; 
	border-radius: 15px; 
	padding: 50px 35px; 
	display: flex; 
	flex-direction: column; 
	height: 100%;
	transition: transform 0.3s ease;
}

.pricing-card-white:hover { transform: translateY(-8px); }

.plan-name-dark { 
	font-size: 1.8rem; 
	font-weight: 800; 
	text-transform: uppercase; 
	margin-bottom: 10px; 
	letter-spacing: -0.5px;
}

.plan-price-dark { 
	font-size: 3.2rem; 
	font-weight: 800; 
	margin-bottom: 30px; 
	line-height: 1; 
}

.plan-price-dark span { font-size: 1rem; color: #666; font-weight: 500; }

.plan-features-dark { 
	list-style: none; 
	padding: 0; 
	margin: 0 0 40px 0; 
	flex-grow: 1; 
}

.plan-features-dark li { 
	color: #333; 
	margin-bottom: 14px; 
	font-size: 1rem; 
	display: flex;
	align-items: center;
	gap: 10px;
}

.plan-features-dark li::before { content: "?"; font-weight: bold; }

/* Button Logic for White Card - Fixed Icon visibility */
.pricing-card-white .main-button {
	width: 100%;
	background-color: #000 !important;
	border: 1px solid #000 !important;
	border-radius: 500px !important;
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	gap: 10px;
}
.pricing-card-white .button-text { color: #fff !important; }
.pricing-card-white .button-icon { 

	display: block !important;
	opacity: 1 !important;
	width: 16px !important;
	height: 16px !important;
}
.service-content-grid{
	align-items: center;
}
.service-content{
	margin-left: auto;
}


.custom-footer-layout {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 1rem;
}

.custom-footer-copyright {
	order: 1;
}

.custom-footer-links {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem;
	order: 2;
}

.custom-footer-links a {
	display: inline-block;
	text-decoration: none;
}

@media (max-width: 768px) {
	.custom-footer-layout {
		flex-direction: column;
		justify-content: center;
		align-items: center; 
		text-align: center;
	}

	.custom-footer-copyright {
		order: 2; 
		margin-top: 0.5rem;
		width: 100%;
		display: flex;
		justify-content: center; 
	}

	.custom-footer-links {
		order: 1; 
		justify-content: center;
		gap: 1rem 1.5rem;
		width: 100%;
	}
}

@media (max-width: 991px) {
	.section-pricing-dark { padding-top: 20px !important; }
	.pricing-grid { grid-template-columns: 1fr; gap: 25px; max-width: 450px; margin-left: auto; margin-right: auto; }
	.spacer-huge { display: none !important; }

	.hide-for-mob{
		display:none;
	}
	.hide-for-desktop{
		display:block;
	}
	.service-content-grid {
		display: block !important;
	}
	.service-content{
		margin-left: unset;
	}
	.service-content-item {
		display: block !important;
		margin-bottom: 20px !important;
	}

	.service-image-wrap {
		width: 100% !important;
		height: auto !important;
		margin-bottom: 15px;
	}
	.service-image { width: 100%; height: 100%; object-fit: cover; border-radius: 10px; }
	.padding-section-medium{
		padding-top:20px;
	}
	.whoopwhoop-hero {
		height: auto;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		padding-top: 100px;
		overflow-y: auto;
	}

	.whoopwhoop-cursor-wrapper {
		display: none !important;
	}

	.whoopwhoop-mouth-img {
		top: 150px;
		left: 20px;
		width: 80px;
	}

	.whoopwhoop-text-wrapper {
		position: relative;
		flex: 1;
		display: flex;
		flex-direction: column;
		justify-content: center;
		perspective: none;
		margin: 50px 0;
		z-index: 10;
	}

	.whoopwhoop-top-text {
		align-self: flex-end;
		margin: 0 5% 20px 0;
		transform: none !important;
		font-size: clamp(1.5rem, 5vw, 3rem);
		-webkit-text-stroke: 1px #ffffff;
	}

	.whoopwhoop-main-text {
		align-self: center;
		width: 100%;
		text-align: center;
		font-size: 7vw;
		letter-spacing: 0px;
		margin: 40px 0;
		transform: scale(1, 2.5) !important;
		cursor: auto;
	}

	.whoopwhoop-bottom-text {
		align-self: flex-start;
		margin: 20px 0 0 5%;
		transform: none !important;
		font-size: clamp(2rem, 7vw, 4rem);
	}

	.whoopwhoop-bottom-container {
		position: relative;
		bottom: 0;
		left: 0;
		width: 100%;
		height: auto;
		display: flex;
		flex-direction: column;
		gap: 20px;
		padding: 0 20px 40px 20px;
		z-index: 5;
	}

	.whoopwhoop-bottom-left, .whoopwhoop-bottom-right {
		position: relative;
		bottom: auto;
		left: auto;
		right: auto;
		font-size: 12px;
		line-height: 1.5;
		max-width: 100%;
		text-align: left;
	}
}
@media (max-width: 768px) {
	.custom-grid-form .form-row {
		flex-direction: column;
	}
	.navigation-content-list{
		margin-bottom: 55px;
	}
}