/*
Author       : theme_ocean
Template Name: Monoline - Design Agency HTML Template
Version      : 1.0
*/
/*=============================================================
    CSS INDEX
    =============================
    01. GENERAL STYLE (body, link color, section-title, preloader btn, overlay, section-padding etc)
    02. START BOOTSTRAP NAVIGATION OVERRIDES
    03. START HOME DESIGN
    04. START ABOUT DESIGN
    05. START COUNTER DESIGN
    06. START WHY CHOOSE US DESIGN
    07. START SERVICE DESIGN
    08. START CASE STUDY DESIGN
    09. START POROFOLIO DESIGN
    10. START SKILL DESIGN
    11. START PROMOTION DESIGN
    12. START TEAM DESIGN
    13. START TESTIMONIALS DESIGN
    14. START PRICING DESIGN
    15. START BLOG DESIGN
    16. START ADDRESS DESIGN
    17. START PARTNER DESIGN
    18. START FOOTER DESIGN
    19. START SECTION TOP DESIGN
  =============================================================*/
/*
* ----------------------------------------------------------------------------------------
* 01.GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/
body {
color: #747474;
font-family: 'Poppins', sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 26px;
background:#fff;
overflow-x:hidden;
}
html,
body { height: 100%;position:relative;  }
html { overflow-x: hidden; }
h1,
h2,
h3,
h4,
h5,
h6 {
  letter-spacing: -0.02em;
  margin-top: 0px; 
  font-family: 'DM Sans', 'Poppins', sans-serif;
  color: #0f172a;
  font-weight: 700;
}
a {
  font-family: 'Poppins', 'DM Sans', sans-serif;
  text-decoration: none;
  -webkit-transition: all 0.2s ease 0s;
  transition: all 0.2s ease 0s;
}
a:hover {
    color: #fff;
    text-decoration: none;
}
a:focus {
    outline: none;
    text-decoration: none;
}
p {
    margin-bottom: 0;
}
ul,
li {
    margin: 0;
    padding: 0;
}

::-webkit-input-placeholder {
  font-weight: 400;
font-family: 'Poppins', sans-serif; }

:-moz-placeholder {
  font-weight: 400;
font-family: 'Poppins', sans-serif;}

::-moz-placeholder {
  font-weight: 400;
font-family: 'Poppins', sans-serif;}

:-ms-input-placeholder {
  font-weight: 400;
font-family: 'Poppins', sans-serif;}
.form-control::placeholder {
	color: #232a34;
	opacity: 1;
}
fieldset {
    border: 0 none;
    margin: 0 auto;
    padding: 0;
}
/*START PRELOADER DESIGN - 2-SECOND LION RUNNING INTRO (WEB & MOBILE)*/
.preloader {
	background: radial-gradient(circle at center, #172554 0%, #0a0f1d 85%);
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 999999;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	overflow: hidden;
}

.lion-intro-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	position: relative;
	z-index: 2;
	width: 90%;
	max-width: 440px;
	padding: 20px 10px;
	margin: auto;
}

/* 4th Edition Badge */
.lion-intro-badge {
	margin-bottom: 8px;
	animation: fadeInDown 0.8s ease-out both;
}

.lion-intro-edition-img {
	max-height: 52px;
	width: auto;
	filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.6));
}

/* Lion Mascot Runner Wrap */
.lion-runner-wrap {
	position: relative;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin-bottom: 16px;
}

/* Running Lion Image with 2-second Sprint/Stride Zoom & Run Animation */
.lion-running-img {
	max-width: 320px;
	width: 70vw;
	height: auto;
	display: block;
	filter: drop-shadow(0 18px 36px rgba(0, 0, 0, 0.75));
	will-change: transform;
	animation: lionPreloadSprint 2s cubic-bezier(0.25, 1, 0.5, 1) both;
}

/* Ground shadow pulsating with strides */
.lion-ground-shadow {
	width: 190px;
	height: 22px;
	background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0) 70%);
	border-radius: 50%;
	margin-top: -10px;
	animation: lionShadowPulse 0.45s infinite alternate ease-in-out;
}

/* 2-Second Sprint / Running Towards Screen Keyframe */
@keyframes lionPreloadSprint {
	0% {
		opacity: 0;
		transform: scale(0.18) translateY(100px) rotate(-8deg);
		filter: blur(8px) brightness(1.3);
	}
	20% {
		opacity: 1;
		filter: blur(0) brightness(1.1);
		transform: scale(0.55) translateY(-25px) rotate(5deg);
	}
	40% {
		transform: scale(0.78) translateY(18px) rotate(-6deg);
	}
	60% {
		transform: scale(0.95) translateY(-20px) rotate(4deg);
	}
	80% {
		transform: scale(1.08) translateY(10px) rotate(-2deg);
	}
	92% {
		transform: scale(0.98) translateY(-6px) rotate(1deg);
	}
	100% {
		opacity: 1;
		transform: scale(1) translateY(0) rotate(0deg);
	}
}

/* Ground shadow pulse */
@keyframes lionShadowPulse {
	0% {
		transform: scale(0.75);
		opacity: 0.4;
	}
	100% {
		transform: scale(1.15);
		opacity: 0.85;
	}
}

/* Title and Tagline under Lion */
.lion-intro-text-wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
}

.lion-intro-title {
	color: #ffffff;
	font-family: 'Oswald', sans-serif;
	font-size: 26px;
	letter-spacing: 2px;
	margin: 0 0 6px 0;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.6);
	font-weight: 700;
}

.lion-intro-tagline {
	color: #ffaa17;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	margin-bottom: 14px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

/* 2-Second Loading Progress Bar */
.lion-loader-bar {
	width: 200px;
	height: 6px;
	background: rgba(255, 255, 255, 0.15);
	border-radius: 10px;
	overflow: hidden;
	position: relative;
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.5);
}

.lion-loader-progress {
	width: 0%;
	height: 100%;
	background: linear-gradient(90deg, #ffaa17, #00a859);
	border-radius: 10px;
	animation: lionProgressFill 2s ease-in-out forwards;
}

@keyframes lionProgressFill {
	0% {
		width: 0%;
	}
	50% {
		width: 55%;
	}
	100% {
		width: 100%;
	}
}

/* Responsive Mobile Alignment & Larger Lion Size */
@media (max-width: 767px) {
	.lion-running-img {
		max-width: 265px;
		width: 76vw;
	}
	.lion-ground-shadow {
		width: 160px;
		height: 18px;
		margin-top: -8px;
	}
	.lion-intro-title {
		font-size: 22px;
		letter-spacing: 1.5px;
	}
	.lion-intro-edition-img {
		max-height: 48px;
	}
	.lion-intro-tagline {
		font-size: 12px;
	}
	.lion-loader-bar {
		width: 160px;
		height: 5px;
	}
}

.spinner {
	display: none;
}

@-webkit-keyframes sk-bounce {
  0%, 100% { -webkit-transform: scale(0.0) }
  50% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bounce {
  0%, 100% { 
    transform: scale(0.0);
    -webkit-transform: scale(0.0);
  } 50% { 
    transform: scale(1.0);
    -webkit-transform: scale(1.0);
  }
}
.status-mes h4 {
color: #f7f7f7;
position:relative;
font-size:24px;
margin-top: 30px;
text-transform: capitalize;
letter-spacing: 1px;
}
.no-padding { padding: 0 }
/*END PRELOADER DESIGN*/
.section-padding {padding:80px 0;}
/*START SECTION TITLE DESIGN*/
.section-title{margin-bottom:60px;}
.section-title  h2 {
font-size: 54px;
font-weight:600;
margin-top: 0;
position: relative;
text-transform: capitalize;
}
h2.section-title-white{
color:#fff;
font-size: 54px;
font-weight:600;
margin-top: 0;
position: relative;
text-transform: capitalize;
}
p.section-title-white{color:#fff;}
.section-title span{
background: #f5325c none repeat scroll 0 0;
display: block;
height: 2px;
margin: 10px auto;
width: 100px;
}

.section-title-white{color:#fff;position:relative;}
.section-title  p{
padding: 0 10px;
width: 60%;
margin: auto;	
}
/*END SECTION TITLE DESIGN*/
/*START SCROLL TO TOP*/
.topcontrol {
background: #ffaa17 none repeat scroll 0 0;
border-radius: 30px;
bottom: 5px;
box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2);
color: #fff;
cursor: pointer;
font-size: 22px;
height: 50px;
line-height: 47px;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
position: fixed;
right: 5px;
text-align: center;
-webkit-transition: all 0.2s ease 0s;
transition: all 0.2s ease 0s;
width: 50px;
}
@media only screen and (max-width:768px) { 
.topcontrol {display:none;}
}
.topcontrol:hover {
    background: #222;
    color: #fff;
}
/*END SCROLL TO TOP*/

/*START BUTTON DESING*/
.btn_one {
	background:#fff;
	border: 2px solid #1b2032;
	color: #1b2032;
	padding: 8px 30px;
	border-radius: 30px;
	transition: 0.3s;
	margin-top: 10px;
	box-shadow: 0 10px 40px -10px rgba(0,64,128,.3);
	display: inline-block;
}
.btn_one:hover {
background:#ffaa17;
border:2px solid #ffaa17;
color:#fff;
}
/*END BUTTON DESING*/
/*
* ----------------------------------------------------------------------------------------
* 01.END GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 02.START BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 02.END BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 03.START HOME DESIGN
* ----------------------------------------------------------------------------------------
*/
.home_bg{height: 700px;position:relative;}
.home_bg::before {
	background:rgba(0,0,0,0.2);
	bottom: 0;
	content: "";
	height: 100%;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
}
.hero-text{
padding-top:250px;
position: relative;
}

.hero-text h2 {
	color: #fff;
	font-size: 56px;
	font-weight: 700;
	text-transform: uppercase;
}
.hero-text p{
	color:#fff;
	margin-bottom: 25px;	
}
.hero-text a{
	background:#ffaa17;
	border: 2px solid #ffaa17;
	color: #fff;
	padding: 8px 30px;
	border-radius: 30px;
	transition: 0.3s;
	margin-top: 10px;
	box-shadow: 0 10px 40px -10px rgba(0,64,128,.3);
	display: inline-block;
}
.hero-text a:hover {
background:none;
border:2px solid #fff;
color:#fff;
}
.home_video{height: 750px;position:relative;}
.home_video:before {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6) none repeat scroll 0 0;
  content: "";
  left: 0;
  top: 0;
}
.html-video {
    top: 0%;
    left: 0%;
    width: 100%;
    overflow: hidden;
    position: relative;
}
.slider-caption {
    position: absolute;
    top: 33%;
    width: 100%;
    left: 0;
    text-align: center;
    z-index: 15;
    -webkit-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
}
video {min-width: 100%;height:100%; }
/*
* ----------------------------------------------------------------------------------------
* 03.END HOME DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 04.START ABOUT DESIGN
* ----------------------------------------------------------------------------------------
*/
.feature_area {
	padding-bottom: 80px;
	position: relative;
	margin-top: -80px;
}
@media only screen and (max-width:768px) { 
.feature_area{
	margin-top:0px;
}
}
.feature_bg{
	padding:60px;
	background: #fff;
	box-shadow: 0 10px 40px -10px rgba(0,64,128,.2);
	border-radius: 10px;
	margin-top:-100px;
}
@media only screen and (max-width:768px) { 
.feature_bg{
	margin-top:0px;
}
}
.single_feature {
	background: #ffffff;
	position: relative;
	padding: 32px 26px;
	border: 1px solid var(--color-slate-200, #e2e8f0);
	border-radius: 16px;
	transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
	box-shadow: 0 10px 30px -8px rgba(15, 23, 42, 0.06);
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.single_feature:hover {
	background: #ffffff;
	border-color: #ffaa17;
	box-shadow: 0 20px 40px -10px rgba(15, 23, 42, 0.14), 0 0 0 1px #ffaa17;
	transform: translateY(-8px);
}
.feature_icon_wrap {
	width: 54px;
	height: 54px;
	border-radius: 14px;
	background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
	color: #ffaa17;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 22px;
	margin-bottom: 18px;
	box-shadow: 0 6px 16px rgba(15, 23, 42, 0.15);
	transition: all 0.3s ease;
}
.single_feature:hover .feature_icon_wrap {
	background: linear-gradient(135deg, #ffaa17 0%, #d97706 100%);
	color: #0f172a;
	transform: scale(1.1) rotate(6deg);
}
.single_feature img {
width:60px;
margin-bottom: 25px;
}
.single_feature h4 {
	margin-bottom: 15px;
	font-size: 20px;
}
.single_feature p{}
.single_about_content {
	margin-top: -60px;
	background: #fff;
	padding: 60px;
	border-radius: 10px;
	box-shadow: 0 10px 40px -10px rgba(0,64,128,.2);
	position: relative;
	margin-bottom: 60px;
}
.single_about_content h2 {
	margin-bottom: 30px;
	font-size: 50px;
	font-weight: 500;
}
.single_about_content p{}

.hire_us_area{background:#f9fcff;}
.hire_img{}
.hire_img img {
	width: 200px;
}
.hire_content{}
.hire_content h2 {
	font-weight: 500;
	font-size: 50px;
	margin-bottom: 20px;
}
.hire_content p {
	margin-bottom: 30px;
}
.hire_content a{}
/*
* ----------------------------------------------------------------------------------------
* 04.END ABOUT DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 05.START COUNTER DESIGN
* ----------------------------------------------------------------------------------------
*/
.counter_feature {
	background: #0f172a !important;
	position: relative;
	margin-bottom: 80px;
}
.single-project {
	border-right: 1px solid #3e3c85;
	position: relative;
}
.single-project-mrnone{border-right:0px;}
.single-project img {
	width:60px;
	margin-bottom: 20px;
}
.single-project h2 {
	font-weight: 700;
	font-size: 50px;
	color:#fff;
}
.single-project h4 {
	margin-bottom: 0;
	font-size:16px;
	color:#fff;
}
.mfp-iframe-holder .mfp-content {
  line-height: 0;
  margin-top: 55px;
  max-width: 900px;
  width: 100%;
}
.video_btn {
	padding:150px 0;
	position: relative;
	border:15px solid #fff;
	margin-top: 100px;
	margin-bottom:-180px;
	box-shadow:0 10px 40px -10px rgba(0,64,128,.2);
}
.video_btn h3 {
	background: #ffaa17;
	padding: 30px;
	margin: 0 40px;
	line-height: 40px;
	margin-bottom: 30px;
	text-transform: capitalize;
	font-weight: 600;
}
.video_btn a {
	background: rgba(255, 255, 255, 0.2) none repeat scroll 0 0;
	border: 4px solid #fff;
	border-radius: 100px;
	color: #fff;
	display: block;
	font-size: 34px;
	height: 100px;
	line-height: 90px;
	margin-bottom: auto;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	width: 100px;
	transition:0.3s;
}
.video_btn a:hover{border: 4px solid #ffaa17;}
/*
* ----------------------------------------------------------------------------------------
* 05.END COUNTER DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 06.START WHY CHOOSE US DESIGN
* ----------------------------------------------------------------------------------------
*/
.why_choose_area {
	margin-top: 180px;
}
.single_why_choose{margin-top:60px;}
.single_why_choose h2 {
	font-size: 60px;
	font-weight: 600;
	line-height: 76px;
	margin-bottom: 30px;
}
.single_why_choose p{margin-bottom: 30px;}
.single_why_choose_img img{}
.single_why_choose a{}
.single_why_choose a:hover{}
/*
* ----------------------------------------------------------------------------------------
* 06.END WHY CHOOSE US DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 07.START SERVICE DESIGN
* ----------------------------------------------------------------------------------------
*/
.service_area{background:#f9fcff;padding-bottom:50px;}
.single_service{
background:#fff;
padding:60px;
box-shadow: 0 10px 40px -10px rgba(0,64,128,.1);
margin-bottom:30px;
}
.single_service img{margin-bottom:20px;}
.single_service h4{margin-bottom:20px;font-size: 22px;}
.single_service p {
	margin-bottom: 20px;
}
/*
* ----------------------------------------------------------------------------------------
* 07.END SERVICE DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 08.START CASE STUDY DESIGN
* ----------------------------------------------------------------------------------------
*/
.case_content_top{}
.case_content_top h2 {
	margin-bottom: 30px;
	font-weight: 500;
	font-size: 46px;
	line-height: 60px;
	padding-right: 60px;
}
.case_content_top p {
	padding-right: 40px;
	margin-bottom: 20px;
}
.case_content_top_img img{}
.case_content_area{}
.case_content{}
.case_content h2{margin-bottom:20px;}
.case_content p {
	margin-bottom: 20px;
	font-size: 18px;
	line-height: 30px;
	padding-right: 40px;
}
/*
* ----------------------------------------------------------------------------------------
* 08.END CASE STUDY DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 09.START POROFOLIO DESIGN
* ----------------------------------------------------------------------------------------
*/
.portfolio_area{overflow: hidden;}
.mix{
	display: none;
}
.portfolio_filter ul {
	list-style: none;
	margin-bottom: 60px;
}
.portfolio_filter ul li {
	font-weight: 500;
	text-transform: capitalize;
	display: inline-block;
	cursor: pointer;
	padding: 0px 15px;
	font-size: 16px;
	color: #252d35;
	transition: .5s;
	margin: 0 3px 0px;
	border-right: 2px solid #eee;
	letter-spacing: 0px;
}
.portfolio_filter ul li:last-child {
	border-right: 0px;
}
.portfolio_filter .active {
	color: #ffaa17;
}
.portfolio-grid{position: relative;}
.single-gallery{
	position: relative;
}
.single-gallery:before{
	position: absolute;
	content: '';
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.4);
	transition: .5s;
	opacity: 0;
	border-radius: 4px;
}
.single-gallery img{
	border-radius: 4px;
}
.gallery_enlarge_icon{
	opacity: 0;
}
.gallery_enlarge_icon{
	background-color: #ffaa17;
	color: #fff;
	width: 50px;
	height: 50px;
	line-height: 50px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	text-align: center;
	border-radius: 50%;
	font-size: 14px;
	transition: .5s;
}

.gallery_enlarge_icon:hover,
.gallery_enlarge_icon:focus{
	background-color: #fff;
	color: #333;
}

.single-gallery h4 {
	position: absolute;
	left: 15px;
	bottom: 10px;
	color: #fff;
	font-size: 17px;
	font-weight: 600;
	opacity: 0;
	transition: .5s;
}
.single-gallery h4 a{color:#fff;}
.single-gallery h4 a:hover{color:#ffaa17;}
.portfolio-item{
	margin-bottom: 30px;
}
.gallery-btn{
	background-color: #fc5b62;
	border: 1px solid #fc5b62;
	border-radius: 4px;
	color: #fff;
	font-size: 15px;
	padding: 13px 30px;
	text-transform: capitalize;
	transition: all 0.3s ease 0s;
	font-weight: 600;
	letter-spacing: 1px;
}
.gallery-btn:hover,
.gallery-btn:focus{
	background-color: #211E3B;
	border-color: #211E3B;
	color: #fff;
}
.single-gallery:hover:before,
.single-gallery:hover .gallery_enlarge_icon,
.single-gallery:hover h4{
	opacity: 1;
}
.portfolio_btn{margin-top: 30px;}
.portfolio_btn a{}
/*START PORTFOLIO SINGLE PAGE DESIGN*/
.portfolio_project_area{background:#f9fcff;padding-bottom: 50px;}
.single_project {
	background: #fff;
	padding: 40px;
	margin-bottom: 30px;
	border-radius: 10px;
	overflow: hidden;
}
.single_project img{
width:500px;
float:left;
margin-right:30px;
}
.single_project h1 {
	font-size: 80px;
	margin-bottom: 10px;
	color: #ffaa17;
}
.single_project h2{margin-bottom:20px;}
.single_project p{margin-bottom:20px;}
.single_project a{}

.single_project_area{background:#f9fcff;padding-bottom:50px;}
.project_dec {
	background: #fff none repeat scroll 0 0;
	box-shadow: 0 10px 40px -10px rgba(0,64,128,.08);
	margin-bottom: 30px;
	padding: 40px;
	border-radius: 10px;
}
.project_dec img {
margin-right: 20px;
width: 600px;
}
.about_project h4 {
	border-bottom: 1px solid #eee;
	padding: 10px 0;
	font-weight: 600;
}
.about_project p {
	margin-bottom: 30px;
}
.about_project_details { margin-bottom: 20px }
.about_project_details ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
.about_project_details ul li { padding: 5px 0 }
.about_project_details ul li i {
    color: #ffaa17;
    margin-right: 10px;
}
.about_project_details ul li a {
    color: #ffaa17;
    font-weight: 700;
}
.about_project_details ul li a:hover {text-decoration: underline;}
/*END PORTFOLIO SINGLE PAGE DESIGN*/
/*
* ----------------------------------------------------------------------------------------
* 09.END POROFOLIO DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 10.START SKILL DESIGN
* ----------------------------------------------------------------------------------------
*/
.skills_area {
	position: relative;
	padding-top: 80px;
	padding-bottom: 0;
	margin-bottom: 80px;
}
.skills_area:before {
    background:#0e5ca6;
	opacity:0.2;
    bottom: 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}
.skill_bg {
	background: #fff;
	padding: 70px;
	border-radius:20px;
	position: relative;
	box-shadow: 0 10px 40px -10px rgba(0,64,128,.2);
	margin-bottom: -80px;
}
.skill_content{}
.skill_content h2 {
	font-size: 40px;
	font-weight: 600;
	margin-bottom: 30px;
}
.skill_content p{
margin-bottom:30px;
}
.skill_bar{
margin-right:30px;
}
.progress-bar-text {
	font-size: 16px;
	margin-bottom: 10px;
	text-transform: capitalize;
	font-weight: 500;
}
.progress-bar-text span { float: right }
.progress-bar {
    background: #e8e8e9 none repeat scroll 0 0;
    -webkit-box-shadow: 0 0 0;
            box-shadow: 0 0 0;
    height: 10px;
    margin: 0 0 20px;
	border-radius: 30px;
    position: relative;
    width: 100%;
}
.progress-bar > span {
    background: #ffaa17 none repeat scroll 0 0;
    display: block;
    height: 100%;
    width: 0;
	border-radius: 30px;
}
/*
* ----------------------------------------------------------------------------------------
* 10.END SKILL DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 11.START PROMOTION DESIGN
* ----------------------------------------------------------------------------------------
*/
.promotional_area{}
.promotional_content{}
.promotional_content img{}
.promotional_content p {
	width: 70%;
	margin: auto;
	margin-top: 40px;
	text-align: center;
	font-size: 20px;
	line-height: 32px;
}
/*
* ----------------------------------------------------------------------------------------
* 11.END PROMOTION DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 12.START TEAM DESIGN
* ----------------------------------------------------------------------------------------
*/
.team_area{}
.team_title {
	color: #fff;
	margin-bottom: 60px;
	text-align: center;
	text-transform: capitalize;
	font-weight: 600;
}
.our-team {margin-bottom: 30px;}
.single-team{margin-bottom:10px;}
.single-team img {
	margin-bottom:15px;
	border-radius:2px;
	border: 10px solid #fff;
}
.single-team h3 {
	margin-bottom:6px;
	font-size:18px;
	font-weight: 600;
}
.single-team p{margin-bottom:0px;}

.our-team .social {
	list-style: none;
	padding: 0;
	margin: 0;
	text-align: center;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}
.our-team .social li{
display: inline-block;
}
.our-team .social li a {
	display: block;
	width: 35px;
	height: 35px;
	line-height: 35px;
	font-size: 15px;
	color: #fff;
	position: relative;
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
	border-radius: 30px;
	margin: 3px;
}
.our-team:hover .social li:nth-child(1) a{
    -webkit-transition-delay: 0.3s;
            transition-delay: 0.3s;
}
.our-team:hover .social li:nth-child(2) a{
    -webkit-transition-delay: 0.2s;
            transition-delay: 0.2s
}
.our-team:hover .social li:nth-child(3) a{
    -webkit-transition-delay: 0.1s;
            transition-delay: 0.1s;
}
.our-team:hover .social li:nth-child(4) a{
    -webkit-transition-delay: 0s;
            transition-delay: 0s;
}
.our-team .social li a:hover{
    -webkit-transition-delay: 0s;
            transition-delay: 0s;
}

.facebook{background: #1C58A1;}
.facebook:hover{background: #fff;color:#1C58A1!important;}
.twitter{background: #0CBCE3;}
.twitter:hover{background: #fff;color:#0CBCE3!important;}
.google{background: #F04537;}
.google:hover{background: #fff;color:#F04537!important;}
/*
* ----------------------------------------------------------------------------------------
* 12.END TEAM DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 13.START TESTIMONIALS DESIGN
* ----------------------------------------------------------------------------------------
*/
.testimonial_area{padding-bottom:30px;}
.single_testimonial {
	margin-bottom: 50px;
}
.testimonial_img{}
.testimonial_img img {
	width: 100px;
	border-radius: 100px;
	margin-right: 20px;
	float: left;
	margin-bottom:60px;
}
.single_testimonial p {
	margin-bottom: 20px;
	overflow: hidden;
}
.single_testimonial h4 {
	overflow: hidden;
	font-size: 20px;
}
.single_testimonial h5 {
	font-family: 'Poppins', sans-serif;
	overflow: hidden;
	font-size: 16px;
}
/*
* ----------------------------------------------------------------------------------------
* 13.END TESTIMONIALS DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
 * ----------------------------------------------------------------------------------------
 * 14.START PRICING DESIGN
 * ----------------------------------------------------------------------------------------
 */
.pricing-table-area{position:relative;}
.pricing_page{background: #f9fcff;}
.pricing-table-area:before {
    background:#0e5ca6;
	opacity:0.1;
    bottom: 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}
.pricingTable {
	color: #fff;
	background: #0e5ca6;
	text-align: center;
	padding: 10px 10px 20px;
	box-shadow: 0 10px 40px -10px rgba(0,64,128,.2);
	overflow: hidden;
	position: relative;
	border-radius: 10px;
}
.pricingTable:before,
.pricingTable:after{
    content: "";
    background: #fff;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 1px solid #692a92;
    box-shadow: 0 0 1px 8px #fff;
    position: absolute;
    top: 100px;
    right: 20px;
}
.pricingTable:after{
    width: 20px;
    height: 20px;
    box-shadow: 0 0 1px 4px #fff;
    top: 35px;
    right: 50px;
}
.pricingTable .pricingTable-header{ margin: 0 0 40px; }
.pricingTable .pricingTable-header:before{
    content: "";
    background: #fff;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    position: absolute;
    top: -30px;
    left: -30px;
}
.pricingTable .price-value{
    color: #0e5ca6;
    background: #fff;
    width: 140px;
    height: 140px;
    padding: 25px 10px;
    border: 3px solid #0e5ca6;
    border-radius: 50%;
    position: relative;
}
.pricingTable .price-value:before{
    content: "";
    border: 2px solid #0e5ca6;
    border-radius: 50%;
    position: absolute;
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
}
.pricingTable .price-value .currency{
    font-size: 35px;
    line-height: 35px;
    display: inline-block;
    vertical-align: top;
    margin: 0 -3px 0 0;
}
.pricingTable .price-value .amount{
    font-size: 52px;
    line-height: 70px;
    display: inline-block;
}
.pricingTable .price-value .duration{
    font-size: 16px;
    text-transform: capitalize;
    display: block;
    margin-top: -7px;
}
.pricingTable .pricing-content{
    border: 2px solid #fff;
    padding: 23px 10px 45px;
    margin: 0 20px;
}
.pricingTable .title {
	font-size: 40px;
	font-weight: 500;
	text-transform: capitalize;
	/* letter-spacing: 1px; */
	margin: 0;
	color: #fff;
	margin-bottom: 30px;
}
.pricingTable .pricing-content ul{
    text-align: left;
    padding: 0;
    margin: 0;
    list-style: none;
    display: inline-block;
}
.pricingTable .pricing-content ul li {
	/* font-size: 17px; */
	font-weight: 300;
	text-transform: capitalize;
	/* letter-spacing: 1px; */
	padding: 0 0 0 20px;
	margin: 0 0 10px;
	position: relative;
}
.pricingTable .pricing-content li:last-child{ margin: 0; }
.pricingTable .pricing-content li:before{
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 2px solid #fff;
    position: absolute;
    top: 7px;
    left: 0;
}
.pricingTable .pricingTable-signup a {
	color: #0e5ca6;
	background: #fff;
	font-size: 20px;
	font-weight: 500;
	line-height: 40px;
	text-transform: capitalize;
	/* letter-spacing: 1px; */
	width: 60%;
	display: block;
	margin: -22px auto 0;
	transition: all 0.3s ease 0s;
}
.pricingTable .pricingTable-signup a:hover{
color:#ffaa17;
}
.pricingTable.blue{ background:#0e5ca6; }
.pricingTable.blue:before,
.pricingTable.blue:after,
.pricingTable.blue .price-value,
.pricingTable.blue .price-value:before{
    border-color: #253e81;
    color: #253e81;
}
.pricingTable.blue .pricingTable-signup a{ color: #253e81; }
.pricingTable.red .pricingTable-signup a{ color: #cc1438; }
/*
 * ----------------------------------------------------------------------------------------
 * 14.END PRICING DESIGN
 * ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 15.START BLOG DESIGN
* ----------------------------------------------------------------------------------------
*/
.blog_area{background:#f9fcff;padding-bottom:50px;}
.home_single_blog{
background:#fff;
margin-bottom:30px;
}
.home_blog_content{padding:30px;border-radius: 10px;}
.blog-img img {
	width: 1000%;
}
.home_single_blog img {
	width: 100%;
}
.blog_title_info {
	border-bottom: 1px solid #eee;
	padding-bottom: 10px;
	margin-bottom: 20px;
}
.blog_title_info h2{}
.blog_title_info h2 a {
	color: #1b2032;
	transition: 0.3s;
	margin-bottom: 5px;
	display: inline-block;
}
.blog_title_info h2 a:hover{color:#ffaa17;}
.blog_title_info span {
	font-size: 14px;
	margin: 0 5px;
}
.blog_title_info span a {
	color: #ffaa17;
	transition: 0.3s;
	letter-spacing: 1px;
}
.blog_title_info span a:hover{color:#1b2032;}
.home_single_blog p{}
.home_b_btn {
	color: #1b2032;
	font-weight: 300;
	margin-top: 10px;
	display: inline-block;
}
.home_b_btn:hover{color:#ffaa17;}

/*START BLOG SIDEBAR DESIGN*/
.contact_form_blog{padding-top:0px!important;}
.blog_sidebar_title {
	border-bottom: 1px solid #eee;
	color: #1b2032;
	font-size: 20px;
	font-weight: 600;
	letter-spacing: x;
	margin-bottom: 15px;
	margin-top: 0;
	padding-bottom: 10px;
	text-transform: capitalize;
}
.blog_search, .latest_blog, .advertisement_post, .video_post, .categories, .tag, .banner {
	margin-bottom: 30px;
	background: #fff;
	padding: 30px 30px;
	border-radius:10px;
	border-top: 3px solid #ffaa17;
	box-shadow:0 10px 40px -10px rgba(0,64,128,.2);
}
.tag{overflow: hidden;}
.blog_search{}
.blog_search input {
background: #f8f4ef none repeat scroll 0 0;
border: 1px solid #eee;
border-radius: 0;
color: #1b2032;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
height: 50px;
}
.blog_search input:focus{border: 1px solid #ffaa17;}
.single_latest_blog {
	overflow: hidden;
	border-bottom: 1px solid #eee;
	padding-bottom: 15px;
	margin-bottom: 20px;
}
.single_latest_blog h4 {
	color: #666;
	font-size: 18px;
	font-weight: 500;
	line-height: 28px;
	margin: 0;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}
.single_latest_blog:hover h4 { color: #ffaa17 }
.single_latest_blog span { color: #161616 }
.single_upcoming_event {margin-bottom: 20px;}
.single_upcoming_event h4 {
	color: #1b2032;
	font-size: 17px;
	font-weight: 600;
	line-height: 28px;
	margin: 10px 0 0;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}
.single_upcoming_event:hover h4 { color: #ffaa17 }
.single_upcoming_event span i{margin-right:5px;color: #ffaa17 }
.single_upcoming_event span { color: #777 }
.categories ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
.categories ul li { }
.categories ul li a {
	color: #1b2032;
	display: block;
	font-size: 14px;
	padding: 5px 0;
	font-family: poppins;
	font-weight: 400;
}
.categories ul li a:hover { color: #ffaa17 }
.categories ul li a i { margin-right: 10px }
.video_post iframe {
    width: 100%;
    height: 100%;
    border: medium none;
}
.tag a {
	border: 2px solid #1b2032;
	border-radius: 30px;
	color: #1b2032;
	display: block;
	float: left;
	font-size: 14px;
	font-weight: 400;
	margin: 6px 4px;
	padding: 3px 20px;
	text-transform: capitalize;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	background: #fff;
}
.tag a:hover {
    background: #ffaa17;
    color: #fff;
    border: 2px solid #ffaa17;
}
/*END BLOG SIDEBAR DESIGN*/
/*START BLOG SINGLE PAGE DESIGN*/
.bc_left {
	padding-left: 30px;
	font-style: italic;
	font-weight: 600;
}
.bc_bottom{margin-bottom:30px;}
.single_blog_post { margin-bottom: 60px }
.single_blog_post img {
    width: 750px;
    height: 455px;
}
.blog_post_text h4 { margin: 30px 0 }
.author_part {
	margin-bottom: 30px;
	overflow: hidden;
	margin-top: 60px;
}
.single_author {
	background: #fff none repeat scroll 0 0;
	padding: 40px;
	border-radius: 10px;
	box-shadow: 0 10px 40px -10px rgba(0,64,128,.08);
	overflow: hidden;
}
.author_part img {
	border: 4px solid #ffaa17;
	border-radius: 100px;
	float: left;
	height: 120px;
	margin-right: 20px;
	width: 120px;
}
.author_part h4 {text-transform: uppercase;
font-size: 16px;
font-weight:700;
letter-spacing: 1px; }
.author_part p { margin-bottom: 0 }
.blog_head_title {
border-bottom: 1px solid #eee;
margin: 0 0 30px;
padding-bottom: 10px;
font-weight: 700;
text-transform: uppercase;
font-size: 18px;
}
.comments_part {
    margin-bottom: 60px;
}
.single_comment {
    margin-bottom: 30px;
    background: #fff;
    padding: 40px;
	border-radius: 10px;
	box-shadow: 0 10px 40px -10px rgba(0,64,128,.08);
	overflow: hidden;
}
.single_comment_mbnone { margin-bottom: 0px }
.single_comment img {
    border: 4px solid #ffaa17;
    border-radius: 100px;
    float: left;
    height: 120px;
    margin-right: 20px;
    width: 120px;
}
.single_comment h4 { font-size: 16px;
font-weight:700;
letter-spacing: 1px;
text-transform: uppercase;}
.single_comment p { margin-bottom: 0 }
.comment-box {
	background: #fff;
	border-radius: 10px;
}
.comment_form input, .comment_form textarea {
	border-bottom: 1px solid #dddd !important;
	border-left: 0px;
	border-right: 0px;
	border-top: 0px;
}
.comment_form textarea {}

/*END BLOG SINGLE PAGE DESIGN*/
/*
* ----------------------------------------------------------------------------------------
* 15.END BLOG DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 16.START ADDRESS DESIGN
* ----------------------------------------------------------------------------------------
*/
.contact_area{
	background: #0f172a !important;
}
.single_address {}
.single_address h4 {
	font-weight: 600;
	font-size: 26px;
	margin-bottom: 20px;
}
.mr_20{margin-bottom:10px;}
.single_address p{}
.single_address p a{color:#1b2032;transition:0.3s;}
.single_address p a:hover{color:#ffaa17;}
.contact input {
	background: #fff;
	border-bottom: 1px solid #fff;
	border-radius: 0px;
	box-shadow: none;
	color: #1b2032;
	font-size: 18px;
	font-weight:400;
	height: 70px;
	padding: 20px;
	width: 100%;
	margin-bottom: 15px;
	font-family: 'Poppins', sans-serif;
}
.contact textarea {
	background: #fff;
	border-bottom: 1px solid #fff;
	border-radius: 0px;
	box-shadow: none;
	color: #1b2032;
	font-size:18px;
	margin-bottom: 15px;
	font-weight:400;
	padding: 20px;
	width: 100%;
	font-family: 'Poppins', sans-serif;
}
.contact input:focus {
	border: 1px solid #f6f6f6;
    box-shadow: none;
	color: #1b2032;
	background: #fff;
    outline: 0 none;
}
.contact textarea:focus {
	border: 1px solid #fff;
    box-shadow: #f6f6f6;
    outline: 0 none;
	color: #1b2032;
	background: #fff;
}
.contact button {
	font-size: 16px;
}
.contact_btn {
	background: #ffaa17;
	display: inline-block;
	color: #fff;
	border: 2px solid #ffaa17;
	padding: 12px 40px;
	0: 0.3s;
}
.contact_btn:hover{
	background: #232a34;
	border: 2px solid #232a34;
}
/*
* ----------------------------------------------------------------------------------------
* 16.END ADDRESS DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
 * ----------------------------------------------------------------------------------------
 * 17.START PARTNER DESIGN
 * ----------------------------------------------------------------------------------------
*/
.partner-logo {padding-bottom: 40px;}
.single_logo {}
.single_logo a img {
	width:100px;
	-webkit-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
}
.single_logo a img:hover{opacity: 1;}

/*
 * ----------------------------------------------------------------------------------------
 * 17.END PARTNER DESIGN
 * ----------------------------------------------------------------------------------------
*/

.map{}
.map iframe{
width:100%;
height:400px;
margin-bottom: -10px;
}

/*
* ----------------------------------------------------------------------------------------
* 18.START FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/
.footer {
	padding-bottom: 30px;
	padding-top: 50px;
	background: #0b1120 !important;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.footer_logo { padding-top: 10px; }
.footer_logo img {
	width: 150px;
}
.footer_logo p {
	color: #94a3b8;
	margin-top: 14px;
	margin-bottom: 20px;
	font-size: 14px;
	line-height: 1.6;
}
.single_footer { padding-top: 10px; }
.single_footer h4 {
	color: #ffffff;
	margin-top: 0;
	margin-bottom: 22px;
	font-weight: 700;
	font-size: 18px;
	letter-spacing: 0.3px;
}
.single_footer p { color: #94a3b8; }
.single_footer ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.single_footer ul li { margin-bottom: 6px; }
.single_footer ul li a {
	color: #cbd5e1;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	line-height: 28px;
	font-size: 14.5px;
	font-weight: 400;
	display: inline-block;
}
.single_footer ul li a:before {
	content: "›";
	font-weight: 700;
	line-height: 1;
	font-size: 16px;
	margin-right: 8px;
	color: #ffaa17;
}
.single_footer ul li a:hover {
	color: #ffaa17;
	transform: translateX(4px);
}

/* START SOCIAL PROFILE CSS */
.newsletter-form { padding-top: 10px; }
.newsletter-form h4 {
	color: #ffffff;
	margin-top: 0;
	margin-bottom: 22px;
	font-weight: 700;
	font-size: 18px;
	letter-spacing: 0.3px;
}
.newsletter-form input {
	width: 100%;
	margin-bottom: 12px;
	height: 48px;
	padding: 12px 16px;
	color: #0f172a;
	background: #ffffff;
	border-radius: 8px;
	border: 1px solid #cbd5e1;
	font-size: 14px;
}
.newsletter-form input:focus {
	outline: none;
	border-color: #ffaa17;
	box-shadow: 0 0 0 3px rgba(255, 170, 23, 0.2);
}
.subs_btn {
	background: #ffaa17;
	border: none;
	color: #0f172a;
	font-weight: 700;
	padding: 12px 24px;
	border-radius: 8px;
	width: 100%;
	font-size: 14px;
	transition: all 0.3s ease;
	cursor: pointer;
}
.subs_btn:hover {
	background: #f59e0b;
	color: #0f172a;
	box-shadow: 0 4px 14px rgba(255, 170, 23, 0.4);
}
.social_profile { margin-top: 15px; }
.social_profile ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 10px;
}
.social_profile ul li a {
	text-align: center;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	font-size: 15px;
	color: #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
}
.social_profile ul li a:hover {
	transform: translateY(-3px);
	box-shadow: 0 6px 16px rgba(255, 170, 23, 0.4);
}
.f_facebook { background: #1877f2; }
.f_twitter { background: #ff0000; }
.f_instagram { background: #e4405f; }
.f_linkedin { background: #25d366; }

.footer_copyright {
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	padding-top: 25px;
	margin-top: 40px;
}
.footer_copyright p {
	color: #94a3b8;
	text-align: center;
	font-size: 13.5px;
} 
/*
* ----------------------------------------------------------------------------------------
* 18.END FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 19.START SECTION TOP DESIGN
* ----------------------------------------------------------------------------------------
*/
.section-top {
    padding-bottom: 90px;
    padding-top: 150px;
	position: relative;
}
.section-top:before {
  position: absolute;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  opacity: 0.95;
  content: "";
  left: 0;
  top: 0;
}
.section-top-title h1 {
color: #fff;
font-weight: 600;
position: relative;
}
/*
* ----------------------------------------------------------------------------------------
* 19.END SECTION TOP DESIGN
* ----------------------------------------------------------------------------------------
*/

/* ----------------------------------------------------------------------------------------
* 20.START FAQ DESIGN
* ----------------------------------------------------------------------------------------
*/
.faq1-area {
  padding: 100px 0 100px;
}


.faq-tab-menus {
  display: block;
  text-align: center;
  border: 0;
  margin: 0 0 100px;
}

.faq-tab-menus .nav-item {
  display: inline-block;
  border: 0;
  margin: 0;
}

.faq-tab-menus .nav-item .nav-link {
  display: inline-block;
  border: 0;
  margin: 0;
  color: #1d293e;
  font-size: 24px;
  line-height: 28px;
  padding: 16px 60px;
  border-radius: 3px;
}

.faq-tab-menus .nav-item .nav-link.active {
  background: #ffaa17;
  color: #ffffff;
  box-shadow: 3.709px 5.936px 51px 0px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 3.709px 5.936px 51px 0px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 3.709px 5.936px 51px 0px rgba(0, 0, 0, 0.2);
  -o-box-shadow: 3.709px 5.936px 51px 0px rgba(0, 0, 0, 0.2);
}

.faq_tab .card {
  border: 1px solid #eee;
  background:#fff;
  box-shadow: 0 10px 40px -10px rgba(0,64,128,.2);
  border-radius: 5px;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  margin-bottom: 20px;
}

.faq_tab .card .card-header {
  border: 0;
  background: transparent;
  padding: 0;
}

.faq_tab .card .card-header .btn {
  display: block;
  width: 100%;
  text-align: left;
  text-decoration: none;
  font-size: 26px;
  line-height: 30px;
  color: #1d293e;
  font-weight:500;
  padding: 24px 46px;
  position: relative;
  white-space: pre-wrap;
}

.faq_tab .card .card-header .btn::after {
  content: "\f077";
  font-family: "fontAwesome";
  font-weight: 900;
  color: #767e92;
  font-size: 14px;
  position: absolute;
  right: 46px;
  top: 30px;
}

.faq_tab .card .card-header .btn.collapsed::after {
  content: "\f078";
}

.faq_tab .card .card-body {
  padding: 6px 46px 40px;
  background: #F0FBFF;
}

.faq_tab .card:hover {
  box-shadow: 5.299px 8.48px 50px 0px rgba(0, 0, 0, 0.08);
  -webkit-box-shadow: 5.299px 8.48px 50px 0px rgba(0, 0, 0, 0.08);
  -moz-box-shadow: 5.299px 8.48px 50px 0px rgba(0, 0, 0, 0.08);
  -o-box-shadow: 5.299px 8.48px 50px 0px rgba(0, 0, 0, 0.08);
}

.faq_tab .card:hover .card-header .btn::after {
  color: #1386fc;
}
/* ----------------------------------------------------------------------------------------
* 20.END FAQ DESIGN
* ----------------------------------------------------------------------------------------
*/

/* ----------------------------------------------------------------------------------------
* 21.START SERVICE PAGES DESIGN
* ----------------------------------------------------------------------------------------
*/
.marketing_area{}
.marketing_content{}
.marketing_content h2 {
	margin-bottom: 40px;
	font-size: 40px;
	font-weight: 600;
}
.marketing_content img{}
.marketing_text{}
.marketing_text p{margin-bottom:20px;}
.single_marketing{margin-bottom: 40px;}
.marketing_icon_img{}
.marketing_icon_img img {
	float: left;
	margin-right: 20px;
	width: 70px;
	margin-bottom: 20px;
}
.single_marketing h3{}
.single_marketing p{overflow: hidden;}
/* ----------------------------------------------------------------------------------------
* 21.END SERVICE PAGES DESIGN
* ----------------------------------------------------------------------------------------
*/

/* ----------------------------------------------------------------------------------------
* 22.START MARATHON EVENT STYLES
* ----------------------------------------------------------------------------------------
*/
.marathon-subheading {
    display: inline-block;
    color: #ffaa17;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 12px;
    background: rgba(27, 32, 50, 0.7);
    padding: 6px 22px;
    border-radius: 30px;
    border: 1px solid rgba(255, 170, 23, 0.5);
}
.hero-desc {
    max-width: 840px;
    margin: 0 auto 25px auto;
    font-size: 18px;
    line-height: 30px;
    color: #f1f1f1;
}
.hero-meta-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-bottom: 25px;
}
.hero-badge {
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    color: #fff;
    padding: 10px 22px;
    border-radius: 30px;
    font-size: 15px;
    font-weight: 500;
    border: 1px solid rgba(255, 255, 255, 0.25);
    display: inline-flex;
    align-items: center;
}
.hero-badge i {
    margin-right: 8px;
    color: #ffaa17;
}
.hero-badge.hero-badge-highlight {
    background: #ffaa17;
    color: #1b2032;
    font-weight: 700;
    border-color: #ffaa17;
}
.hero-badge.hero-badge-highlight i {
    color: #1b2032;
}

/* Notice box for T-shirt distribution */
.tshirt-notice-box {
    background: #fff;
    border-left: 5px solid #ffaa17;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
    padding: 20px 25px;
    margin-top: 30px;
    display: flex;
    align-items: center;
    text-align: left;
}
.tshirt-notice-icon {
    font-size: 28px;
    color: #ffaa17;
    margin-right: 20px;
    min-width: 40px;
}
.tshirt-notice-text strong {
    display: block;
    color: #1b2032;
    font-size: 16px;
    margin-bottom: 4px;
}
.tshirt-notice-text span {
    color: #555;
    font-size: 14px;
    line-height: 22px;
}

/* Venue Section styling */
.venue_area {
    padding: 100px 0;
    background: #fff;
}
.venue-badge {
    display: inline-block;
    background: #ffaa17;
    color: #fff;
    padding: 5px 18px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 15px;
}
.venue-location {
    color: #ffaa17;
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 20px;
}
.venue-location i {
    margin-right: 6px;
}
.venue-features-list {
    list-style: none;
    padding: 0;
    margin: 25px 0;
}
.venue-features-list li {
    font-size: 15px;
    color: #444;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
}
.venue-features-list li i {
    color: #ffaa17;
    margin-right: 12px;
    font-size: 18px;
}
.venue-img-wrap {
    box-shadow: 0 15px 45px rgba(0, 64, 128, 0.15);
    border-radius: 12px;
    overflow: hidden;
    position: relative;
}
.venue-img-wrap img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.4s ease;
}
.venue-img-wrap:hover img {
    transform: scale(1.03);
}

/* Spot Registration Cards */
.spot_reg_area {
    padding: 100px 0;
    background: #f9fcff;
}
.spot-card {
    background: #fff;
    padding: 35px 30px;
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0, 64, 128, 0.08);
    border: 1px solid #edf2f7;
    transition: all 0.3s ease;
    height: 100%;
    position: relative;
    overflow: hidden;
}
.spot-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: #1b2032;
    transition: 0.3s ease;
}
.spot-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 45px rgba(0, 64, 128, 0.16);
    border-color: #ffaa17;
}
.spot-card:hover::before {
    background: #ffaa17;
}
.spot-card-number {
    font-size: 14px;
    font-weight: 700;
    color: #ffaa17;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.spot-card-title {
    font-size: 20px;
    font-weight: 600;
    color: #1b2032;
    margin-bottom: 12px;
    min-height: 48px;
}
.spot-card-timing {
    color: #666;
    font-size: 14px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
}
.spot-card-timing i {
    color: #ffaa17;
    margin-right: 8px;
}
.spot-card-phone {
    display: inline-flex;
    align-items: center;
    background: #f4f7fa;
    color: #1b2032;
    padding: 8px 18px;
    border-radius: 25px;
    font-weight: 600;
    font-size: 15px;
    transition: 0.3s ease;
}
.spot-card-phone i {
    color: #ffaa17;
    margin-right: 8px;
}
.spot-card-phone:hover {
    background: #ffaa17;
    color: #fff;
}
.spot-card-phone:hover i {
    color: #fff;
}

/* WhatsApp CTA */
.whatsapp-cta-box {
    background: #fff;
    padding: 35px;
    border-radius: 12px;
    box-shadow: 0 10px 40px -10px rgba(0, 64, 128, 0.12);
    border: 1px solid #eef2f6;
    margin-top: 40px;
}
.whatsapp-cta-box h4 {
    font-size: 17px;
    color: #1b2032;
    margin-bottom: 18px;
    line-height: 28px;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
}
.whatsapp-btn {
    background: #25d366;
    color: #fff !important;
    padding: 12px 35px;
    border-radius: 30px;
    display: inline-flex;
    align-items: center;
    font-size: 16px;
    font-weight: 600;
    box-shadow: 0 10px 30px -5px rgba(37, 211, 102, 0.4);
    transition: 0.3s ease;
}
.whatsapp-btn i {
    font-size: 20px;
    margin-right: 10px;
}
.whatsapp-btn:hover {
    background: #1eb857;
    transform: translateY(-2px);
    box-shadow: 0 15px 35px -5px rgba(37, 211, 102, 0.6);
}

/* Deliverable Item Icon */
.single_feature .feature_icon_wrap {
    width: 65px;
    height: 65px;
    line-height: 65px;
    text-align: center;
    background: #fff;
    border-radius: 50%;
    margin-bottom: 25px;
    box-shadow: 0 5px 20px rgba(0, 64, 128, 0.1);
    display: inline-block;
    transition: 0.3s;
}
.single_feature:hover .feature_icon_wrap {
    background: #ffaa17;
    color: #fff;
}
.single_feature .feature_icon_wrap i {
    font-size: 26px;
    color: #ffaa17;
    line-height: 65px;
}
.single_feature:hover .feature_icon_wrap i {
    color: #fff;
}
/* ----------------------------------------------------------------------------------------
* 22.END MARATHON EVENT STYLES
* ----------------------------------------------------------------------------------------
*/

/* ----------------------------------------------------------------------------------------
* 23.START MARATHON HERO SLIDER & DEDICATED OVERVIEW STYLES
* ----------------------------------------------------------------------------------------
*/
.marathon_hero_slider {
    position: relative;
    min-height: 720px;
    height: 100vh;
    max-height: 880px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* Template Banner Styling - Exact 658px Template Height */
#kenburns_061 {
    overflow: hidden;
    max-height: 658px !important;
    position: relative;
    background: #000000;
}
#kenburns_061 > .carousel-inner > .carousel-item {
    max-height: 658px !important;
    height: 658px !important;
    overflow: hidden;
}
#kenburns_061 > .carousel-inner > .carousel-item > img {
    width: 100% !important;
    height: 658px !important;
    object-fit: cover !important;
    margin: auto;
    opacity: 0.5;
}
.kenburns_061_slide {
    top: 26% !important;
    left: 8% !important;
    width: 65% !important;
    max-width: 780px;
}
.kenburns_061_slide_right {
    right: 8% !important;
    left: auto !important;
    text-align: right;
}
.kenburns_061_slide_center {
    left: 0 !important;
    right: 0 !important;
    margin: auto !important;
    text-align: center;
}
.kenburns_061_slide > h2 {
    color: #ffffff;
    font-size: 24px;
    font-weight: 600;
    text-transform: capitalize;
    margin: 0 0 6px 0;
    letter-spacing: 0.5px;
}
.kenburns_061_slide > h1 {
    color: #ffffff;
    margin: 6px 0 10px 0;
    font-size: 54px;
    font-weight: 700;
    line-height: 1.15;
    text-transform: capitalize;
    letter-spacing: 0.5px;
}
.kenburns_061_slide > h3 {
    color: #ffffff;
    margin: 0 0 14px 0;
    font-size: 16px;
    font-weight: 400;
    text-transform: capitalize;
    letter-spacing: 0.3px;
    line-height: 1.45;
}

/* Compact Standard Countdown on Banner & Static Hero CTA */
.hero-static-cta-wrap {
    position: absolute;
    left: 8%;
    top: 340px;
    z-index: 25;
    pointer-events: auto;
    text-align: left;
}
.hero-static-cta-wrap .banner-countdown,
.kenburns_061_slide .banner-countdown,
.kenburns_061_slide_right .banner-countdown,
.kenburns_061_slide_center .banner-countdown {
    display: table;
    margin: 8px 0 16px 0;
    padding: 8px 12px;
    background: rgba(10, 15, 29, 0.72);
    border: 1px solid rgba(255, 170, 23, 0.4);
    border-radius: 12px;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.45);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}
.kenburns_061_slide_right .banner-countdown {
    margin-left: auto;
    margin-right: 0;
}
.kenburns_061_slide_center .banner-countdown {
    margin-left: auto;
    margin-right: auto;
}
.hero-static-cta-wrap .countdown-boxes,
.kenburns_061_slide .countdown-boxes,
.kenburns_061_slide_right .countdown-boxes,
.kenburns_061_slide_center .countdown-boxes {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    margin: 0;
    padding: 0;
}
.hero-static-cta-wrap .countdown-box,
.kenburns_061_slide .countdown-box,
.kenburns_061_slide_right .countdown-box,
.kenburns_061_slide_center .countdown-box {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    padding: 6px 14px;
    min-width: 62px;
    text-align: center;
}
.hero-static-cta-wrap .countdown-val,
.kenburns_061_slide .countdown-val,
.kenburns_061_slide_right .countdown-val,
.kenburns_061_slide_center .countdown-val {
    color: #ffaa17;
    font-family: 'Oswald', sans-serif;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
    display: block;
    text-shadow: 0 2px 8px rgba(255, 170, 23, 0.35);
}
.hero-static-cta-wrap .countdown-lbl,
.kenburns_061_slide .countdown-lbl,
.kenburns_061_slide_right .countdown-lbl,
.kenburns_061_slide_center .countdown-lbl {
    color: #cbd5e1;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    display: block;
    margin-top: 2px;
}

/* Standard Banner Register Button (Desktop & Global) */
.hero-static-cta-wrap .btn-banner-register,
.kenburns_061_slide > a,
.kenburns_061_slide > a:visited,
.kenburns_061_slide_right > a,
.kenburns_061_slide_right > a:visited,
.kenburns_061_slide_center > a,
.kenburns_061_slide_center > a:visited {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 160px !important;
    padding: 12px 32px !important;
    background: #ffaa17 !important;
    color: #0b1329 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.8px !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    border-radius: 30px !important;
    box-shadow: 0 4px 18px rgba(255, 170, 23, 0.45) !important;
    transition: all 0.3s ease !important;
    margin-top: 14px !important;
    line-height: 1 !important;
}
.hero-static-cta-wrap .btn-banner-register:hover,
.kenburns_061_slide > a:hover,
.kenburns_061_slide_right > a:hover,
.kenburns_061_slide_center > a:hover {
    background: #e69500 !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 24px rgba(255, 170, 23, 0.6) !important;
}
.hero-static-cta-wrap .btn-banner-register i {
    display: inline-block !important;
    margin-left: 10px !important;
    color: inherit !important;
    font-size: 13px !important;
}
.kenburns_061_slide > a:after,
.kenburns_061_slide_right > a:after,
.kenburns_061_slide_center > a:after {
    content: "\f178" !important;
    font-family: FontAwesome !important;
    position: static !important;
    display: inline-block !important;
    margin-left: 10px !important;
    color: inherit !important;
    font-size: 13px !important;
}
.kenburns_061_slide_center > a:before,
.kenburns_061_slide_right > a:before {
    display: none !important;
    content: none !important;
}

@media only screen and (max-width: 768px) {
    #kenburns_061 {
        max-height: 580px !important;
        height: 580px !important;
        overflow: hidden !important;
    }
    #kenburns_061 > .carousel-inner,
    #kenburns_061 > .carousel-inner > .carousel-item {
        height: 580px !important;
        max-height: 580px !important;
    }
    #kenburns_061 > .carousel-inner > .carousel-item > img {
        height: 580px !important;
        max-height: 580px !important;
        width: 100% !important;
        object-fit: cover !important;
    }
    .kenburns_061_slide,
    .kenburns_061_slide_right,
    .kenburns_061_slide_center {
        top: 145px !important;
        -webkit-transform: none !important;
        transform: none !important;
        left: 0 !important;
        right: 0 !important;
        width: 92% !important;
        max-width: 350px !important;
        margin: 0 auto !important;
        text-align: center !important;
        padding: 0 !important;
    }
    .kenburns_061_slide > h2,
    .kenburns_061_slide_right > h2,
    .kenburns_061_slide_center > h2 {
        font-size: 11.5px !important;
        line-height: 1.3 !important;
        margin: 0 0 3px 0 !important;
        padding-top: 0 !important;
        text-align: center !important;
        letter-spacing: 0.5px !important;
        color: #ffaa17 !important;
        text-transform: uppercase !important;
        text-shadow: 0 1px 4px rgba(0,0,0,0.8) !important;
    }
    .kenburns_061_slide > h1,
    .kenburns_061_slide_right > h1,
    .kenburns_061_slide_center > h1 {
        font-size: 21px !important;
        line-height: 1.2 !important;
        margin: 0 0 5px 0 !important;
        text-align: center !important;
        color: #ffffff !important;
        text-shadow: 0 2px 8px rgba(0,0,0,0.85) !important;
        word-break: break-word !important;
    }
    .kenburns_061_slide > h3,
    .kenburns_061_slide_right > h3,
    .kenburns_061_slide_center > h3 {
        font-size: 11px !important;
        line-height: 1.35 !important;
        margin: 0 auto 6px auto !important;
        max-width: 320px !important;
        text-align: center !important;
        color: #e2e8f0 !important;
        text-shadow: 0 1px 4px rgba(0,0,0,0.8) !important;
    }
    .hero-static-cta-wrap {
        position: absolute;
        top: 355px;
        left: 0;
        right: 0;
        width: 92%;
        max-width: 330px;
        margin: 0 auto;
        text-align: center;
        z-index: 25;
        pointer-events: auto;
    }
    .hero-static-cta-wrap .banner-countdown,
    .kenburns_061_slide .banner-countdown,
    .kenburns_061_slide_right .banner-countdown,
    .kenburns_061_slide_center .banner-countdown {
        display: block !important;
        margin: 0 auto 12px auto !important;
        text-align: center !important;
        width: 100% !important;
        max-width: 310px !important;
        padding: 8px 6px !important;
        background: rgba(10, 15, 29, 0.75) !important;
        border: 1px solid rgba(255, 170, 23, 0.35) !important;
        border-radius: 12px !important;
        box-sizing: border-box !important;
    }
    .hero-static-cta-wrap .countdown-boxes,
    .kenburns_061_slide .countdown-boxes,
    .kenburns_061_slide_right .countdown-boxes,
    .kenburns_061_slide_center .countdown-boxes {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 6px !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .hero-static-cta-wrap .countdown-box,
    .kenburns_061_slide .countdown-box,
    .kenburns_061_slide_right .countdown-box,
    .kenburns_061_slide_center .countdown-box {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        padding: 6px 2px !important;
        border-radius: 8px !important;
        text-align: center !important;
        box-sizing: border-box !important;
        background: rgba(255, 255, 255, 0.08) !important;
    }
    .hero-static-cta-wrap .countdown-val,
    .kenburns_061_slide .countdown-val,
    .kenburns_061_slide_right .countdown-val,
    .kenburns_061_slide_center .countdown-val {
        font-size: 20px !important;
        line-height: 1.1 !important;
        color: #ffaa17 !important;
        display: block !important;
    }
    .hero-static-cta-wrap .countdown-lbl,
    .kenburns_061_slide .countdown-lbl,
    .kenburns_061_slide_right .countdown-lbl,
    .kenburns_061_slide_center .countdown-lbl {
        font-size: 8px !important;
        letter-spacing: 0.8px !important;
        text-transform: uppercase !important;
        color: #cbd5e1 !important;
        margin-top: 2px !important;
        display: block !important;
    }
    .hero-static-cta-wrap .btn-banner-register,
    .kenburns_061_slide > a,
    .kenburns_061_slide_right > a,
    .kenburns_061_slide_center > a {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 4px auto 0 !important;
        text-align: center !important;
        width: auto !important;
        min-width: 140px !important;
        padding: 8px 24px 8px 18px !important;
        background: #ffaa17 !important;
        color: #111827 !important;
        border-radius: 25px !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        letter-spacing: 0.5px !important;
        text-decoration: none !important;
        box-shadow: 0 4px 15px rgba(255, 170, 23, 0.45) !important;
    }
    .kenburns_061_slide > a:after,
    .kenburns_061_slide_right > a:after,
    .kenburns_061_slide_center > a:before,
    .kenburns_061_slide_center > a:after {
        position: static !important;
        display: inline-block !important;
        margin-left: 8px !important;
        content: "\f178" !important;
        font-family: FontAwesome !important;
        color: #111827 !important;
    }
    .kenburns_061_slide_center > a:before {
        display: none !important;
    }
    #kenburns_061 .carousel-control-prev,
    #kenburns_061 .carousel-control-next {
        width: 30px !important;
        opacity: 0.6 !important;
        z-index: 5 !important;
    }
    #kenburns_061 .carousel-control-prev {
        left: 2px !important;
    }
    #kenburns_061 .carousel-control-next {
        right: 2px !important;
    }
}

/* Dedicated Marathon Event Overview Section */
.marathon_overview_area {
    padding: 0 0 90px 0;
    background: #f8fafc;
    position: relative;
}
.overview_main_card {
    background: #fff;
    border-radius: 16px;
    padding: 55px 45px;
    box-shadow: 0 15px 50px rgba(0, 64, 128, 0.12);
    border: 1px solid #edf2f7;
    margin-top: -100px;
    position: relative;
    z-index: 10;
}
.overview_badge_strip {
    display: inline-block;
    background: #1b2032;
    color: #ffaa17;
    padding: 8px 24px;
    border-radius: 30px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    margin-bottom: 20px;
    box-shadow: 0 4px 15px rgba(27, 32, 50, 0.15);
}
.overview_title {
    font-size: 42px;
    font-weight: 700;
    color: #1b2032;
    margin-bottom: 18px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}
.overview_desc {
    font-size: 17px;
    line-height: 30px;
    color: #4a5568;
    max-width: 920px;
    margin: 0 auto 25px auto;
}
.overview_perks_note {
    background: #fff8ee;
    border-left: 4px solid #ffaa17;
    padding: 14px 22px;
    border-radius: 6px;
    display: inline-block;
    color: #975a16;
    font-weight: 500;
    font-size: 15px;
    margin-bottom: 35px;
    text-align: left;
}
.overview_meta_grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    margin-bottom: 35px;
}
.overview_meta_card {
    flex: 1;
    min-width: 260px;
    max-width: 340px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 26px 20px;
    text-align: center;
    transition: all 0.3s ease;
}
.overview_meta_card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 30px rgba(0, 64, 128, 0.1);
    border-color: #ffaa17;
    background: #fff;
}
.overview_meta_card .meta_icon {
    width: 58px;
    height: 58px;
    line-height: 58px;
    border-radius: 50%;
    background: #fff;
    color: #ffaa17;
    font-size: 24px;
    margin: 0 auto 15px auto;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);
    transition: 0.3s;
}
.overview_meta_card:hover .meta_icon {
    background: #ffaa17;
    color: #fff;
}
.overview_meta_card h5 {
    font-size: 18px;
    color: #1b2032;
    margin-bottom: 6px;
    font-weight: 600;
}
.overview_meta_card p {
    font-size: 14px;
    color: #64748b;
    margin-bottom: 0;
}
.overview_meta_card.highlight_fee {
    background: linear-gradient(135deg, #ffaa17 0%, #ff8c00 100%);
    color: #fff;
    border-color: #ffaa17;
}
.overview_meta_card.highlight_fee h5 {
    color: #fff;
    font-size: 22px;
}
.overview_meta_card.highlight_fee p {
    color: #fff;
    opacity: 0.95;
}
.overview_meta_card.highlight_fee .meta_icon {
    color: #ff8c00;
}

@media (max-width: 768px) {
    .marathon_hero_slider {
        min-height: auto;
        height: auto;
        padding: 105px 0 45px 0;
        display: block;
    }
    .hero_content_container {
        padding-top: 15px;
        padding-bottom: 20px;
    }
    .rotary-host-badge {
        font-size: 11px;
        padding: 5px 14px;
        letter-spacing: 1px;
        margin-bottom: 14px;
    }
    .hero-main-title {
        font-size: 19px;
        line-height: 1.4;
        letter-spacing: 0px;
        margin-bottom: 12px;
    }
    .hero-main-title br {
        display: none;
    }
    .hero-main-title .highlight-text {
        font-size: 26px;
        margin-top: 8px;
        display: block;
        letter-spacing: 1px;
    }
    .hero-sub-motto {
        font-size: 12px;
        gap: 5px;
        margin-bottom: 16px;
    }
    .hero-sub-motto .slogan-pill {
        padding: 3px 10px;
        font-size: 11px;
    }
    .hero-actions {
        margin-top: 12px;
        margin-bottom: 0;
    }
    .hero-actions .btn_one {
        padding: 8px 18px;
        font-size: 13px;
        margin: 4px;
        display: inline-block;
    }
    .hero-slider-dots {
        margin-top: 18px;
        gap: 8px;
    }
    .hero-slider-dots .dot {
        width: 10px;
        height: 10px;
    }
    .overview_title {
        font-size: 22px;
    }
    .overview_badge_strip {
        font-size: 12px;
        padding: 6px 14px;
        letter-spacing: 0.5px;
    }
    .overview_main_card {
        padding: 24px 14px;
        margin-top: 25px;
    }
}
/* ----------------------------------------------------------------------------------------
* 23.END MARATHON HERO SLIDER & DEDICATED OVERVIEW STYLES
* ----------------------------------------------------------------------------------------
*/

/* Premium marathon landing-page refinements */
.wow {
    visibility: visible !important;
}
.hero-title-kicker {
    display: block;
    margin-bottom: 9px;
    color: rgba(255, 255, 255, 0.92);
    font-family: 'DM Sans', 'Poppins', sans-serif;
    font-size: clamp(17px, 2vw, 24px);
    font-weight: 500;
    letter-spacing: 0.3px;
    line-height: 1.45;
    text-transform: none;
}
.hero-countdown {
    display: inline-block;
    min-width: min(100%, 360px);
    margin: 2px auto 0;
    padding: 13px 22px 15px;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 16px;
    background: rgba(13, 19, 32, 0.58);
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.22);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    font-family: 'DM Sans', 'Poppins', sans-serif;
}
.countdown-label {
    margin-bottom: 8px;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
}
.countdown-units {
    display: grid;
    grid-template-columns: repeat(4, minmax(48px, 1fr));
    gap: 12px;
}
.countdown-unit {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.1;
}
.countdown-unit span {
    color: #ffaa17;
    font-family: 'Oswald', sans-serif;
    font-size: 30px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}
.countdown-unit small {
    margin-top: 5px;
    color: rgba(255, 255, 255, 0.76);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 1.1px;
    text-transform: uppercase;
}
.countdown-finished {
    margin: 7px 0 0;
    color: #fff;
    font-weight: 600;
}
.hero-main-title .highlight-text {
    font-family: 'Oswald', sans-serif;
}

.race_categories_area {
    padding: 78px 0 90px;
    background: #f8fafc;
}
.feature_area {
    padding: 72px 0;
    background: #f5f7fa;
}
.feature_bg {
    padding: 52px;
    border: 1px solid #e9edf3;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 18px 55px rgba(27, 32, 50, 0.08);
}
.event-benefits-title {
    margin: 6px 0 7px;
    color: #1b2032;
    font-family: 'Oswald', sans-serif;
    font-size: 30px;
    font-weight: 600;
    text-transform: uppercase;
}
.event-benefits-intro {
    color: #6b7280;
    font-family: 'DM Sans', 'Poppins', sans-serif;
    font-size: 15px;
}
.feature_bg > .col-lg-4 {
    padding: 10px;
}
.feature_bg .single_feature {
    height: 100%;
    min-height: 210px;
    padding: 28px 24px;
    border: 1px solid #edf0f4;
    border-radius: 14px;
    background: #fbfcfe;
    box-shadow: 0 6px 20px rgba(27, 32, 50, 0.035);
}
.feature_bg .single_feature:hover {
    border-color: rgba(255, 170, 23, 0.5);
    background: #fff;
    box-shadow: 0 16px 35px rgba(27, 32, 50, 0.1);
}
.feature_bg .single_feature h4 {
    color: #1b2032;
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
}
.feature_bg .single_feature p {
    color: #697386;
    font-family: 'DM Sans', 'Poppins', sans-serif;
    font-size: 14px;
    line-height: 1.7;
}
.feature_bg > .col-lg-12:last-child {
    padding-top: 12px;
}
.counter_feature {
    margin: 0;
    padding: 58px 0;
    background: linear-gradient(120deg, #1b2032 0%, #303c52 100%);
}
.counter_feature .row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 0;
}
.counter_feature .row > div {
    width: auto;
    max-width: none;
    padding: 0 6px;
}
.counter_feature .single-project {
    height: 100%;
    padding: 26px 16px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.055);
}
.counter_feature .single-project h2 {
    margin-bottom: 7px;
    color: #ffaa17;
    font-family: 'Oswald', sans-serif;
    font-size: clamp(30px, 3vw, 42px);
}
.counter_feature .single-project h4 {
    color: rgba(255, 255, 255, 0.86);
    font-family: 'DM Sans', 'Poppins', sans-serif;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
}
.overview_perks_note {
    max-width: 900px;
    font-family: 'DM Sans', 'Poppins', sans-serif;
    line-height: 1.7;
}
.overview_desc,
.overview_meta_card p {
    font-family: 'DM Sans', 'Poppins', sans-serif;
}
.race_categories_area .section-title {
    margin-bottom: 42px;
}
.race_categories_area .section-title h2 {
    margin: 7px 0 12px;
    color: #1b2032;
    font-family: 'Oswald', sans-serif;
    font-size: 42px;
    font-weight: 600;
}
.race_categories_area .section-title p {
    width: min(100%, 650px);
    color: #6b7280;
    font-family: 'DM Sans', 'Poppins', sans-serif;
    font-size: 16px;
    line-height: 1.7;
}
.eyebrow-label {
    display: inline-block;
    width: auto;
    height: auto;
    margin: 0;
    background: transparent;
    color: #e69100;
    font-family: 'DM Sans', 'Poppins', sans-serif;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}
.section-title .eyebrow-label {
    display: inline-block;
    width: auto;
    height: auto;
    margin: 0;
    background: transparent;
}
.race-category-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 26px;
}
.race-category-card {
    overflow: hidden;
    border: 1px solid #e8ebf0;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 12px 36px rgba(27, 32, 50, 0.07);
    transition: transform 0.35s ease, box-shadow 0.35s ease;
}
.race-category-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 24px 52px rgba(27, 32, 50, 0.15);
}
.race-category-image {
    position: relative;
    height: 255px;
    overflow: hidden;
    background: #e8ebf0;
}
.race-category-image::after {
    position: absolute;
    inset: 45% 0 0;
    background: linear-gradient(180deg, transparent, rgba(18, 25, 40, 0.45));
    content: "";
}
.race-category-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.race-category-card:hover .race-category-image img {
    transform: scale(1.06);
}
.race-category-distance {
    position: absolute;
    z-index: 1;
    right: 20px;
    bottom: 18px;
    display: grid;
    width: 66px;
    height: 66px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 50%;
    background: #ffaa17;
    color: #1b2032;
    font-family: 'Oswald', sans-serif;
    font-size: 24px;
    font-weight: 700;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
}
.race-category-content {
    padding: 25px 28px 27px;
    font-family: 'DM Sans', 'Poppins', sans-serif;
}
.race-category-kicker {
    margin-bottom: 5px;
    color: #e69100;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}
.race-category-content h3 {
    margin: 0 0 9px;
    color: #1b2032;
    font-family: 'Oswald', sans-serif;
    font-size: 27px;
    font-weight: 600;
}
.race-category-content > p:not(.race-category-kicker) {
    min-height: 52px;
    color: #697386;
    font-size: 14px;
    line-height: 1.7;
}
.race-category-content ul {
    display: grid;
    gap: 9px;
    margin: 18px 0 20px;
    list-style: none;
}
.race-category-content li {
    color: #374151;
    font-size: 13px;
    line-height: 1.5;
}
.race-category-content li i {
    margin-right: 8px;
    color: #e69100;
}
.race-category-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #1b2032;
    font-size: 13px;
    font-weight: 800;
}
.race-category-link:hover,
.race-category-link:focus {
    color: #e69100;
}

.footer {
    background-color: #303c52;
    background-position: center top;
    font-family: 'DM Sans', 'Poppins', sans-serif;
}
.footer_logo p,
.single_footer ul li a,
.newsletter-form {
    font-family: 'DM Sans', 'Poppins', sans-serif;
}
.single_footer ul li a {
    line-height: 2.1;
}
.footer_copyright {
    border-top-color: rgba(255, 255, 255, 0.16);
}
@media (max-width: 767px) {
    .hero-countdown {
        min-width: 0;
        width: min(100%, 340px);
        padding: 11px 15px 13px;
    }
    .countdown-units {
        gap: 6px;
    }
    .countdown-unit span {
        font-size: 25px;
    }
    .countdown-unit small {
        font-size: 8px;
    }
    .race_categories_area {
        padding: 58px 0 64px;
    }
    .feature_area {
        padding: 44px 0;
    }
    .feature_bg {
        padding: 26px 18px;
        border-radius: 16px;
    }
    .feature_bg > .col-lg-4 {
        padding: 8px 0;
    }
    .feature_bg .single_feature {
        min-height: 0;
        padding: 24px 20px;
    }
    .counter_feature {
        padding: 38px 0;
    }
    .counter_feature .row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }
    .counter_feature .single-project {
        padding: 22px 10px;
    }
    .race_categories_area .section-title {
        margin-bottom: 28px;
    }
    .race_categories_area .section-title h2 {
        font-size: 34px;
    }
    .race-category-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }
    .race-category-image {
        height: 215px;
    }
    .race-category-content {
        padding: 22px 20px 24px;
    }
    .race-category-content > p:not(.race-category-kicker) {
        min-height: 0;
    }
    .footer {
        padding-top: 40px;
        padding-bottom: 25px;
    }
    .footer_logo {
        padding-top: 0;
        margin-bottom: 25px;
    }
    .single_footer,
    .newsletter-form {
        padding-top: 10px;
        margin-bottom: 25px;
    }
    .footer_copyright {
        margin-top: 25px;
        padding-top: 20px;
    }
}
@media (max-width: 767px) {
    .marathon-gallery-area .section-title {
        margin-bottom: 35px;
    }
    .marathon-gallery-area .portfolio-grid .portfolio-item {
        margin-bottom: 24px;
    }
}
@media (max-width: 420px) {
    .hero-title-kicker {
        font-size: 15px;
    }
    .hero-sub-motto {
        padding: 0 8px;
    }
    .hero-sub-motto .slogan-pill {
        white-space: normal;
    }
}
}
@media (prefers-reduced-motion: reduce) {
    .wow,
    .race-category-card,
    .race-category-image img,
    .marathon-gallery-area .single-gallery img {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    .race-category-card:hover,
    .race-category-card:hover .race-category-image img,
    .marathon-gallery-area .single-gallery img,
    .marathon-gallery-area .single-gallery:hover img {
        transition: none;
        transform: none;
    }
}

/* ==========================================================================
   ROUTE MAP SECTION STYLING
   ========================================================================== */
.route_map_area {
  background: #f8fafc;
  position: relative;
}

.route-timeline-wrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.route-timeline-item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  background: #ffffff;
  padding: 18px 20px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
  transition: all 0.3s ease;
}

.route-timeline-item:hover {
  border-color: #ffaa17;
  transform: translateX(6px);
  box-shadow: 0 8px 20px rgba(255, 170, 23, 0.15);
}

.route-icon-box {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  color: #ffaa17;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}

.route-timeline-item:hover .route-icon-box {
  background: linear-gradient(135deg, #ffaa17 0%, #d97706 100%);
  color: #0f172a;
  transform: scale(1.08);
}

.route-info h4 {
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
  margin: 0 0 4px;
}

.route-info p {
  font-size: 13px;
  color: #64748b;
  margin: 0;
}

.route-map-visual-card {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  border-radius: 20px;
  padding: 28px;
  color: #ffffff;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.2);
  border: 1px solid rgba(255, 170, 23, 0.3);
  position: relative;
  overflow: hidden;
}

.route-map-visual-card::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -50%;
  width: 100%;
  height: 100%;
  background: radial-gradient(circle, rgba(255, 170, 23, 0.12) 0%, transparent 60%);
  pointer-events: none;
}

.route-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  padding-bottom: 14px;
}

.route-card-header h3 {
  font-size: 18px;
  font-weight: 700;
  color: #ffffff;
  margin: 0;
}

.route-badge {
  background: linear-gradient(135deg, #ffaa17 0%, #d97706 100%);
  color: #0f172a;
  font-size: 12px;
  font-weight: 800;
  padding: 4px 14px;
  border-radius: 30px;
  letter-spacing: 0.5px;
}

.route-graphic-box {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 14px;
  padding: 20px;
  border: 1px dashed rgba(255, 170, 23, 0.4);
  text-align: center;
  margin-bottom: 20px;
}

.route-svg-path {
  width: 100%;
  max-height: 180px;
  object-fit: contain;
}

.route-stats-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 20px;
}

.route-stat-box {
  background: rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  padding: 12px;
  text-align: center;
}

.route-stat-box span {
  display: block;
  font-size: 11px;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.route-stat-box strong {
  display: block;
  font-size: 15px;
  font-weight: 700;
  color: #ffaa17;
  margin-top: 2px;
}

/* ==========================================================================
   LEGACY & GROWTH TIMELINE SECTION STYLING
   ========================================================================== */
.marathon_legacy_area {
  background: #ffffff;
  position: relative;
}

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

.legacy-card {
  background: #f8fafc;
  border: 1.5px solid #e2e8f0;
  border-radius: 18px;
  padding: 28px 20px;
  text-align: center;
  position: relative;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  overflow: hidden;
}

.legacy-card:hover {
  transform: translateY(-8px);
  border-color: #ffaa17;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.1);
  background: #ffffff;
}

.legacy-card.upcoming-year {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  border-color: #ffaa17;
  color: #ffffff;
  box-shadow: 0 12px 32px rgba(255, 170, 23, 0.2);
}

.legacy-year-badge {
  display: inline-block;
  font-family: 'Poppins', sans-serif;
  font-size: 13px;
  font-weight: 800;
  padding: 4px 14px;
  border-radius: 20px;
  background: #e2e8f0;
  color: #0f172a;
  margin-bottom: 14px;
}

.upcoming-year .legacy-year-badge {
  background: linear-gradient(135deg, #ffaa17 0%, #d97706 100%);
  color: #0f172a;
}

.legacy-count {
  font-family: 'Poppins', sans-serif;
  font-size: 36px;
  font-weight: 800;
  color: #0f172a;
  line-height: 1;
  margin-bottom: 6px;
}

.upcoming-year .legacy-count {
  color: #ffaa17;
}

.legacy-label {
  font-size: 13px;
  font-weight: 700;
  color: #475569;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  margin-bottom: 8px;
}

.upcoming-year .legacy-label {
  color: #e2e8f0;
}

.legacy-sub {
  font-size: 12px;
  color: #94a3b8;
  margin: 0;
}

/* ==========================================================================
   MULTI-TIER SPONSORS SHOWCASE STYLING
   ========================================================================== */
.sponsors_area {
  background: #f8fafc;
}

.sponsor-tier-box {
  margin-bottom: 35px;
}

.sponsor-tier-title {
  text-align: center;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #64748b;
  margin-bottom: 16px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.sponsor-tier-title::before,
.sponsor-tier-title::after {
  content: '';
  height: 1px;
  width: 60px;
  background: #cbd5e1;
}

/* Title Sponsor Card */
.title-sponsor-card {
  background: #ffffff;
  border: 2px solid #ffaa17;
  border-radius: 20px;
  padding: 30px;
  max-width: 480px;
  margin: 0 auto;
  text-align: center;
  box-shadow: 0 12px 32px rgba(255, 170, 23, 0.2);
  transition: all 0.3s ease;
}

.title-sponsor-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 18px 40px rgba(255, 170, 23, 0.3);
}

.sponsor-logo-img {
  max-height: 85px;
  width: auto;
  object-fit: contain;
  margin-bottom: 12px;
}

.sponsor-placeholder-frame {
  height: 90px;
  background: #f8fafc;
  border: 2px dashed #cbd5e1;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 12px;
  transition: all 0.3s ease;
}

.sponsor-placeholder-frame:hover {
  border-color: #ffaa17;
  background: #fffdf5;
}

.sponsor-placeholder-frame i {
  font-size: 24px;
  color: #ffaa17;
  margin-bottom: 4px;
}

.sponsor-placeholder-frame span {
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  font-weight: 800;
  color: #0f172a;
}

.sponsor-placeholder-frame small {
  font-size: 11px;
  color: #64748b;
}

/* Co-Sponsors Grid */
.co-sponsors-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  max-width: 960px;
  margin: 0 auto;
}

.co-sponsor-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 16px;
  text-align: center;
  transition: all 0.3s ease;
}

.co-sponsor-card:hover {
  border-color: #ffaa17;
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
}

@media (max-width: 992px) {
  .legacy-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .co-sponsors-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .legacy-grid {
    grid-template-columns: 1fr;
  }
  .co-sponsors-grid {
    grid-template-columns: 1fr;
  }
  .route-stats-row {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   EXECUTIVE CONTACT PAGE DESIGN (MATCHING SCREENSHOTS)
   ========================================================================== */
.contact-hero-header {
  text-align: center;
  padding: 60px 20px 40px;
  background: #f8fafc;
}

.contact-hero-header h1 {
  font-family: 'Poppins', sans-serif;
  font-size: 42px;
  font-weight: 800;
  color: #84cc16;
  background: linear-gradient(135deg, #a3e635 0%, #ffaa17 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 12px;
  position: relative;
  display: inline-block;
}

.contact-hero-header h1::after {
  content: '';
  display: block;
  width: 60px;
  height: 4px;
  background: #a3e635;
  margin: 10px auto 0;
  border-radius: 4px;
}

.contact-hero-header p {
  font-size: 16px;
  color: #64748b;
  margin: 0;
}

/* 3 Info Cards Grid */
.contact-cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 40px;
}

.contact-info-card {
  background: #ffffff;
  border-radius: 16px;
  padding: 36px 24px;
  text-align: center;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.05);
  border: 1px solid #f1f5f9;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.contact-info-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 45px rgba(255, 170, 23, 0.18);
  border-color: #ffaa17;
}

.contact-card-icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: rgba(255, 170, 23, 0.15);
  color: #ffaa17;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  margin: 0 auto 20px;
  transition: all 0.3s ease;
}

.contact-info-card:hover .contact-card-icon {
  background: #ffaa17;
  color: #ffffff;
  transform: scale(1.1) rotate(6deg);
}

.contact-info-card h3 {
  font-family: 'DM Sans', 'Poppins', sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: #ffaa17;
  margin-bottom: 12px;
}

.contact-info-card p {
  font-size: 14px;
  color: #475569;
  margin: 0 0 6px;
  line-height: 1.6;
}

.contact-info-card a {
  color: #1e293b;
  font-weight: 600;
  text-decoration: none;
  transition: color 0.2s ease;
}

.contact-info-card a:hover {
  color: #ffaa17;
}

/* Embedded Map Section */
.contact-map-wrapper {
  position: relative;
  width: 100%;
  height: 380px;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 12px 36px rgba(15, 23, 42, 0.1);
  margin-bottom: -90px;
  z-index: 1;
}

.contact-map-wrapper iframe {
  width: 100%;
  height: 100%;
  border: none;
  filter: invert(90%) hue-rotate(180deg) brightness(95%) contrast(90%);
  border-radius: 20px;
}

.map-badge-btn {
  position: absolute;
  top: 16px;
  left: 16px;
  background: rgba(15, 23, 42, 0.85);
  backdrop-filter: blur(8px);
  color: #ffffff;
  font-size: 12.5px;
  font-weight: 600;
  padding: 8px 16px;
  border-radius: 30px;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  z-index: 10;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.map-badge-btn:hover {
  background: #ffaa17;
  color: #0f172a;
}

/* Floating Contact Form Card */
.contact-form-overlay-card {
  position: relative;
  z-index: 10;
  background: #ffffff;
  border-radius: 24px;
  padding: 45px 50px;
  box-shadow: 0 20px 60px rgba(15, 23, 42, 0.12);
  border: 1px solid #f1f5f9;
  max-width: 780px;
  margin: 0 auto 60px;
}

.contact-form-overlay-card .form-control {
  background: #f8fafc;
  border: 1.5px solid #e2e8f0;
  border-radius: 12px;
  padding: 14px 18px;
  font-size: 15px;
  color: #0f172a;
  transition: all 0.25s ease;
  height: auto;
}

.contact-form-overlay-card .form-control:focus {
  background: #ffffff;
  border-color: #ffaa17;
  box-shadow: 0 0 0 4px rgba(255, 170, 23, 0.2);
  outline: none;
}

.contact-form-overlay-card textarea.form-control {
  min-height: 140px;
  resize: vertical;
}

.btn-lime-submit,
.btn-gold-submit {
  background: linear-gradient(135deg, #ffaa17 0%, #d97706 100%);
  color: #ffffff !important;
  font-family: 'Poppins', sans-serif;
  font-size: 15px;
  font-weight: 800;
  padding: 14px 40px;
  border-radius: 50px;
  border: none;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(255, 170, 23, 0.35);
  transition: all 0.3s ease;
  display: inline-block;
}

.btn-lime-submit:hover,
.btn-gold-submit:hover {
  background: linear-gradient(135deg, #ffe066 0%, #ffaa17 100%);
  color: #0f172a !important;
  transform: translateY(-3px);
  box-shadow: 0 12px 30px rgba(255, 170, 23, 0.5);
}

.btn-lime-submit:hover {
  background: linear-gradient(135deg, #bef264 0%, #a3e635 100%);
  transform: translateY(-3px);
  box-shadow: 0 12px 30px rgba(132, 204, 22, 0.5);
}

@media (max-width: 992px) {
  .contact-cards-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .contact-form-overlay-card {
    padding: 30px 20px;
    margin-top: 20px;
  }
}

/* Light page header navbar link color fix */
.body-light-header .sticky-wrapper:not(.is-sticky) .site-navbar .site-menu > li > a {
  color: #0f172a !important;
  font-weight: 600;
}
.body-light-header .sticky-wrapper:not(.is-sticky) .site-navbar .site-menu > li.active > a,
.body-light-header .sticky-wrapper:not(.is-sticky) .site-navbar .site-menu > li > a:hover {
  color: #84cc16 !important;
}
.body-light-header .sticky-wrapper:not(.is-sticky) .site-navbar .site-menu-toggle {
  color: #0f172a !important;
}

/* ABOUT PAGE EXECUTIVE STYLES */
.about-hero-header {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: 100px 0 60px;
  text-align: center;
  color: #ffffff;
}

.about-hero-header h1 {
  font-family: 'DM Sans', 'Poppins', sans-serif;
  font-size: 42px;
  font-weight: 800;
  color: #ffffff;
  margin-bottom: 12px;
}

.about-hero-header p {
  color: #94a3b8;
  font-size: 17px;
  max-width: 650px;
  margin: 0 auto;
}

.about-who-we-are {
  padding: 80px 0;
  background: #ffffff;
}

.about-who-sub {
  color: #ffaa17;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  margin-bottom: 8px;
  display: block;
}

.about-who-title {
  font-family: 'DM Sans', 'Poppins', sans-serif;
  font-size: 36px;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 20px;
  line-height: 1.25;
}

.about-who-desc {
  font-size: 15.5px;
  color: #475569;
  line-height: 1.75;
  margin-bottom: 24px;
}

.about-check-list {
  list-style: none;
  padding: 0;
  margin: 0 0 30px;
}

.about-check-list li {
  font-size: 15px;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.about-check-list li i {
  color: #ffaa17;
  font-size: 16px;
  background: rgba(255, 170, 23, 0.15);
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.about-image-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.about-grid-img {
  width: 100%;
  height: 185px;
  object-fit: cover;
  border-radius: 18px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
  transition: all 0.3s ease;
}

.about-grid-img:hover {
  transform: translateY(-5px);
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.16);
}

.about-stats-area {
  padding: 70px 0;
  background: #f8fafc;
}

.about-stat-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 40px 24px;
  text-align: center;
  border: 1.5px solid #e2e8f0;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
  transition: all 0.3s ease;
  height: 100%;
}

.about-stat-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(255, 170, 23, 0.12);
  border-color: #ffaa17;
}

.about-stat-icon {
  font-size: 34px;
  color: #ffaa17;
  margin-bottom: 14px;
}

.about-stat-num {
  font-family: 'DM Sans', 'Poppins', sans-serif;
  font-size: 42px;
  font-weight: 800;
  color: #ffaa17;
  line-height: 1.1;
  margin-bottom: 8px;
}

.about-stat-lbl {
  font-size: 15px;
  font-weight: 600;
  color: #475569;
}

.about-mission-box {
  text-align: center;
  max-width: 820px;
  margin: 60px auto 0;
  padding: 45px 35px;
  background: #ffffff;
  border-radius: 24px;
  box-shadow: 0 14px 45px rgba(15, 23, 42, 0.06);
  border: 1.5px solid #e2e8f0;
}

.about-mission-box h2 {
  font-family: 'DM Sans', 'Poppins', sans-serif;
  font-size: 34px;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 8px;
}

.about-mission-box span.line-accent {
  display: block;
  width: 60px;
  height: 4px;
  background: #ffaa17;
  margin: 0 auto 22px;
  border-radius: 4px;
}

.about-mission-box p {
  font-size: 16.5px;
  color: #475569;
  line-height: 1.75;
}

.about-why-join {
  padding: 85px 0;
  background: #ffffff;
}

.why-join-img-wrap {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.12);
}

.why-join-img-wrap img {
  width: 100%;
  height: 400px;
  object-fit: cover;
  display: block;
}

.btn-marathon-green,
.btn-marathon-gold {
  background: linear-gradient(135deg, #ffaa17 0%, #d97706 100%);
  color: #ffffff !important;
  font-family: 'Poppins', sans-serif;
  font-size: 15px;
  font-weight: 800;
  padding: 13px 36px;
  border-radius: 50px;
  display: inline-block;
  text-decoration: none !important;
  box-shadow: 0 8px 24px rgba(255, 170, 23, 0.35);
  transition: all 0.3s ease;
  border: none;
  margin-top: 10px;
}

.btn-marathon-green:hover,
.btn-marathon-gold:hover {
  background: linear-gradient(135deg, #ffe066 0%, #ffaa17 100%);
  color: #0f172a !important;
  transform: translateY(-3px);
  box-shadow: 0 12px 30px rgba(255, 170, 23, 0.5);
}

/* Dual Overlapping Marathon Images Stack (matching casestudy.html 2-image overlap effect) */
.dual-marathon-stack {
  position: relative;
  width: 100%;
  max-width: 520px;
  height: 420px;
  margin: 0 auto;
}

.dual-marathon-stack .stack-img-back {
  position: absolute;
  top: 45px;
  left: 0;
  width: 78%;
  height: 320px;
  object-fit: cover;
  border-radius: 20px;
  box-shadow: 0 12px 35px rgba(15, 23, 42, 0.15);
  border: 4px solid #ffffff;
  z-index: 1;
  transition: all 0.4s ease;
  animation: floatStackBack 7s ease-in-out infinite alternate;
}

.dual-marathon-stack .stack-img-front {
  position: absolute;
  top: 0;
  right: 0;
  width: 82%;
  height: 340px;
  object-fit: cover;
  border-radius: 24px;
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.22), 0 0 0 1px rgba(255, 170, 23, 0.3);
  border: 4px solid #ffffff;
  z-index: 2;
  transition: all 0.4s ease;
  animation: floatStackFront 6s ease-in-out infinite alternate;
}

.dual-marathon-stack:hover .stack-img-front {
  transform: translateY(-8px) scale(1.02);
  box-shadow: 0 25px 60px rgba(255, 170, 23, 0.35), 0 0 0 2px #ffaa17;
}

.dual-marathon-stack:hover .stack-img-back {
  transform: translateY(6px) translateX(-8px) rotate(-2deg);
}

@keyframes floatStackFront {
  0% { transform: translateY(0px); }
  100% { transform: translateY(-10px); }
}

@keyframes floatStackBack {
  0% { transform: translateY(0px) rotate(0deg); }
  100% { transform: translateY(8px) rotate(-1.5deg); }
}

@media (max-width: 768px) {
  .case_content_top_img > img {
    margin-top: 15px !important;
  }
  .case_content_top_img .dual-marathon-stack img {
    margin-top: 0 !important;
  }

  .dual-marathon-stack {
    position: relative !important;
    width: 100% !important;
    max-width: 330px !important;
    height: 230px !important;
    margin: 10px auto 35px auto !important;
  }

  .dual-marathon-stack .stack-img-back {
    position: absolute !important;
    top: 25px !important;
    left: 6px !important;
    width: 74% !important;
    height: 180px !important;
    object-fit: cover !important;
    border-radius: 16px !important;
    border: 3px solid #ffffff !important;
    box-shadow: 0 10px 25px rgba(15, 23, 42, 0.12) !important;
    margin-top: 0 !important;
    z-index: 1 !important;
  }

  .dual-marathon-stack .stack-img-front {
    position: absolute !important;
    top: 0 !important;
    right: 6px !important;
    width: 78% !important;
    height: 195px !important;
    object-fit: cover !important;
    border-radius: 18px !important;
    border: 3.5px solid #ffffff !important;
    box-shadow: 0 16px 35px rgba(15, 23, 42, 0.22), 0 0 0 1px rgba(255, 170, 23, 0.35) !important;
    margin-top: 0 !important;
    z-index: 2 !important;
  }

  .case_content_top_area.section-padding,
  .case_content_area.section-padding {
    padding: 45px 0 50px !important;
  }

  .case_content,
  .case_content_top {
    padding: 0 10px !important;
    margin-top: 15px !important;
    margin-bottom: 25px !important;
    text-align: left !important;
  }

  .case_content h2,
  .case_content_top h2 {
    font-size: 22px !important;
    line-height: 30px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin-bottom: 14px !important;
    letter-spacing: -0.3px !important;
  }

  .case_content p,
  .case_content_top p {
    font-size: 14px !important;
    line-height: 23px !important;
    color: #475569 !important;
    margin-bottom: 16px !important;
    padding-right: 0 !important;
  }

  .about-check-list {
    padding: 0 !important;
    margin: 0 0 22px 0 !important;
    list-style: none !important;
  }

  .about-check-list li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    font-size: 13.5px !important;
    line-height: 1.5 !important;
    color: #334155 !important;
    margin-bottom: 10px !important;
    padding: 10px 14px !important;
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
  }

  .about-check-list li i {
    color: #ffaa17 !important;
    font-size: 15px !important;
    margin-top: 3px !important;
    flex-shrink: 0 !important;
  }

  .case_content .btn_one {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 290px !important;
    padding: 13px 24px !important;
    font-size: 14.5px !important;
    font-weight: 700 !important;
    color: #090f20 !important;
    background: linear-gradient(135deg, #ffc837 0%, #ff8008 100%) !important;
    border: none !important;
    border-radius: 50px !important;
    box-shadow: 0 6px 20px rgba(255, 170, 23, 0.35) !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
    margin-top: 6px !important;
  }
}


/* ==========================================================================
   NEXT-LEVEL EXECUTIVE ABOUT US PAGE STYLING (PREMIUM REDESIGN)
   ========================================================================== */
.about-hero-section {
  position: relative;
  padding: 135px 0 75px;
  background: linear-gradient(180deg, #070d1e 0%, #0d1733 100%);
  color: #ffffff;
  overflow: hidden;
}

.about-hero-section::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: radial-gradient(circle at 80% 20%, rgba(255, 170, 23, 0.12) 0%, transparent 60%),
              radial-gradient(circle at 10% 80%, rgba(0, 93, 170, 0.15) 0%, transparent 50%);
  pointer-events: none;
}

.about-hero-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 18px;
  background: rgba(255, 170, 23, 0.12);
  border: 1px solid rgba(255, 170, 23, 0.35);
  border-radius: 50px;
  color: #ffaa17;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 18px;
  box-shadow: 0 4px 15px rgba(255, 170, 23, 0.15);
}

.about-hero-title {
  font-family: 'DM Sans', sans-serif;
  font-size: 42px;
  font-weight: 800;
  line-height: 1.2;
  color: #ffffff;
  margin-bottom: 16px;
  letter-spacing: -0.5px;
}

.about-hero-title span {
  background: linear-gradient(135deg, #ffc837 0%, #ff8008 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.about-hero-subtitle {
  font-size: 17px;
  color: #cbd5e1;
  line-height: 1.7;
  max-width: 800px;
  margin: 0 auto 26px;
}

/* Quick Metrics Row in Hero */
.about-hero-metrics {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 15px;
}

.hero-metric-item {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 9px 20px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 50px;
  backdrop-filter: blur(10px);
  color: #ffffff;
  font-size: 13.5px;
  font-weight: 600;
}

.hero-metric-item i {
  color: #ffaa17;
  font-size: 15px;
}

/* Rotary Story & Leadership Section */
.about-story-area {
  padding: 85px 0;
  background: #f8fafc;
  position: relative;
}

.about-story-card {
  background: #ffffff;
  border-radius: 24px;
  padding: 38px;
  border: 1.5px solid #e2e8f0;
  box-shadow: 0 15px 40px rgba(15, 23, 42, 0.05);
}

.about-section-tag {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #d97706;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 10px;
}

.about-story-h2 {
  font-family: 'DM Sans', sans-serif;
  font-size: 32px;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 16px;
  line-height: 1.3;
}

.about-story-p {
  font-size: 16px;
  color: #475569;
  line-height: 1.75;
  margin-bottom: 24px;
}

.about-features-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-top: 24px;
}

.about-feature-box {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px;
  background: #f1f5f9;
  border-radius: 14px;
  border-left: 3.5px solid #ffaa17;
  transition: all 0.3s ease;
}

.about-feature-box:hover {
  background: #ffffff;
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.06);
}

.about-feature-icon {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: rgba(255, 170, 23, 0.15);
  color: #d97706;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}

.about-feature-text h4 {
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
  margin: 0 0 3px 0;
}

.about-feature-text p {
  font-size: 13px;
  color: #64748b;
  margin: 0;
  line-height: 1.45;
}

/* 4-Way Test & Core Values Grid */
.about-values-area {
  padding: 85px 0;
  background: #ffffff;
}

.about-value-card {
  background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%);
  border: 1.5px solid #e2e8f0;
  border-radius: 20px;
  padding: 32px 24px;
  height: 100%;
  transition: all 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);
  position: relative;
  overflow: hidden;
  box-shadow: 0 8px 25px rgba(15, 23, 42, 0.04);
}

.about-value-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #ffaa17, #ff8008);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.about-value-card:hover {
  transform: translateY(-8px);
  border-color: #ffaa17;
  box-shadow: 0 18px 40px rgba(255, 170, 23, 0.18);
}

.about-value-card:hover::before {
  opacity: 1;
}

.about-value-num {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 1px;
  color: #ffaa17;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.about-value-card h3 {
  font-size: 20px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 12px;
}

.about-value-card p {
  font-size: 14.5px;
  color: #64748b;
  line-height: 1.65;
  margin: 0;
}

/* Anti-Drug Awareness Spotlight Card */
.about-cause-spotlight {
  padding: 70px 0;
  background: #f1f5f9;
}

.cause-banner-inner {
  background: linear-gradient(135deg, #090f22 0%, #0e1b3c 100%);
  border: 2px solid rgba(255, 170, 23, 0.4);
  border-radius: 28px;
  padding: 48px 40px;
  color: #ffffff;
  position: relative;
  overflow: hidden;
  box-shadow: 0 20px 50px rgba(9, 15, 34, 0.5);
}

.cause-mascot-img {
  max-height: 220px;
  width: auto;
  object-fit: contain;
  filter: drop-shadow(0 15px 30px rgba(0, 0, 0, 0.6));
}

.cause-badge-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255, 170, 23, 0.2);
  border: 1px solid rgba(255, 170, 23, 0.5);
  color: #ffaa17;
  padding: 5px 16px;
  border-radius: 50px;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  margin-bottom: 14px;
}

.cause-title-text {
  font-size: 28px;
  font-weight: 800;
  color: #ffffff;
  margin-bottom: 14px;
}

.cause-desc-text {
  font-size: 15.5px;
  color: #cbd5e1;
  line-height: 1.7;
  margin-bottom: 22px;
}

/* Runner Goodies & Amenities Showcase */
.about-perks-section {
  padding: 85px 0;
  background: #ffffff;
}

.about-perk-card {
  text-align: center;
  padding: 30px 20px;
  background: #f8fafc;
  border-radius: 18px;
  border: 1.5px solid #e2e8f0;
  height: 100%;
  transition: all 0.3s ease;
}

.about-perk-card:hover {
  background: #ffffff;
  border-color: #ffaa17;
  transform: translateY(-6px);
  box-shadow: 0 15px 35px rgba(255, 170, 23, 0.15);
}

.about-perk-icon {
  width: 58px;
  height: 58px;
  line-height: 58px;
  border-radius: 16px;
  background: linear-gradient(135deg, #ffaa17 0%, #ff8800 100%);
  color: #0b1329;
  font-size: 24px;
  margin: 0 auto 16px;
  box-shadow: 0 6px 18px rgba(255, 170, 23, 0.35);
}

.about-perk-card h4 {
  font-size: 17px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 8px;
}

.about-perk-card p {
  font-size: 13.5px;
  color: #64748b;
  margin: 0;
  line-height: 1.5;
}

/* Call to Action Banner */
.about-cta-banner {
  padding: 75px 0;
  background: linear-gradient(135deg, #070d1e 0%, #111e40 100%);
  color: #ffffff;
  text-align: center;
  position: relative;
}

.about-cta-h2 {
  font-size: 34px;
  font-weight: 800;
  color: #ffffff;
  margin-bottom: 12px;
}

.about-cta-p {
  font-size: 16px;
  color: #94a3b8;
  max-width: 650px;
  margin: 0 auto 28px;
}

@media (max-width: 768px) {
  .about-hero-section {
    padding: 60px 0 45px;
  }
  .about-hero-title {
    font-size: 28px;
  }
  .about-hero-subtitle {
    font-size: 15px;
  }
  .about-story-area,
  .about-values-area,
  .about-perks-section {
    padding: 55px 0;
  }
  .about-story-card {
    padding: 24px 18px;
  }
  .about-features-grid {
    grid-template-columns: 1fr;
  }
  .cause-banner-inner {
    padding: 32px 20px;
    text-align: center;
  }
  .cause-title-text {
    font-size: 22px;
  }
  .about-cta-h2 {
    font-size: 25px;
  }
}

/* Overview Section Logos & Edition Badges */
.overview_logos_wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  margin: 15px auto 22px !important;
  text-align: center !important;
}

.overview_edition_badge_img {
  max-height: 50px !important;
  max-width: 140px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  margin: 0 auto !important;
  display: block !important;
  filter: drop-shadow(0 6px 14px rgba(255, 170, 23, 0.4));
  animation: floatEdition 5s ease-in-out infinite alternate;
}

.overview_marathon_logo_img {
  max-height: 75px !important;
  max-width: 280px !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  margin: 0 auto !important;
  display: block !important;
  filter: drop-shadow(0 8px 20px rgba(15, 23, 42, 0.15));
  transition: transform 0.4s ease;
  animation: floatLogo 6s ease-in-out infinite alternate;
}

.overview_marathon_logo_img:hover {
  transform: scale(1.04);
}

@keyframes floatEdition {
  0% { transform: translateY(0px) scale(1); }
  100% { transform: translateY(-4px) scale(1.02); }
}

@keyframes floatLogo {
  0% { transform: translateY(0px); }
  100% { transform: translateY(-4px); }
}

/* Sponsors Showcase Real Logo Cards & Animations */
.sponsors_area {
  background: #f8fafc;
}

.sponsor-tier-box {
  text-align: center;
  margin-bottom: 35px;
}

.sponsor-tier-title {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 2.5px;
  color: #64748b;
  margin-bottom: 15px;
  text-transform: uppercase;
}

.sponsor-logo-card {
  background: #ffffff;
  border-radius: 18px;
  padding: 18px 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #e2e8f0;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  overflow: hidden;
  margin: 0 auto;
  width: 100%;
}

.sponsor-logo-card:before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 50%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 170, 23, 0.3), transparent);
  transition: all 0.6s ease;
}

.sponsor-logo-card:hover:before {
  left: 100%;
}

.sponsor-logo-card:hover {
  transform: translateY(-6px) scale(1.02);
  box-shadow: 0 16px 36px rgba(255, 170, 23, 0.25);
  border-color: #ffaa17;
}

.sponsor-img-title {
  max-height: 70px !important;
  max-width: 280px !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  transition: transform 0.35s ease;
  display: block !important;
  margin: 0 auto !important;
}

.sponsor-img-powered {
  max-height: 55px !important;
  max-width: 220px !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  transition: transform 0.35s ease;
  display: block !important;
  margin: 0 auto !important;
}

.sponsor-img-co {
  max-height: 45px !important;
  max-width: 170px !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  transition: transform 0.35s ease;
  display: block !important;
  margin: 0 auto !important;
}

.sponsor-logo-card:hover img {
  transform: scale(1.04);
}

.co-sponsors-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
}

.co-sponsor-card {
  flex: 0 1 280px;
  max-width: 280px;
}

/* ==========================================================================
   ULTRA-PREMIUM SCROLL ANIMATIONS & REVEAL SYSTEM
   ========================================================================== */

/* Keyframe Animations */
@keyframes fadeInUpSmooth {
  0% {
    opacity: 0;
    transform: translateY(45px) scale(0.96);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes zoomInSmooth {
  0% {
    opacity: 0;
    transform: scale(0.85);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes slideInLeftSmooth {
  0% {
    opacity: 0;
    transform: translateX(-50px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slideInRightSmooth {
  0% {
    opacity: 0;
    transform: translateX(50px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes pulseGlowRing {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 170, 23, 0.5);
  }
  70% {
    box-shadow: 0 0 0 16px rgba(255, 170, 23, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 170, 23, 0);
  }
}

@keyframes shimmerLightSweep {
  0% {
    left: -120%;
  }
  100% {
    left: 180%;
  }
}

@keyframes badgeFloat {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-4px);
  }
  100% {
    transform: translateY(0px);
  }
}

/* Scroll Reveal Base Classes */
[data-scroll-reveal] {
  opacity: 0;
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

[data-scroll-reveal="fade-up"] {
  transform: translateY(40px) scale(0.97);
}

[data-scroll-reveal="zoom-in"] {
  transform: scale(0.88);
}

[data-scroll-reveal="slide-left"] {
  transform: translateX(50px);
}

[data-scroll-reveal="slide-right"] {
  transform: translateX(-50px);
}

[data-scroll-reveal="flip-up"] {
  transform: rotateX(20deg) translateY(35px);
}

[data-scroll-reveal].revealed,
.wow.animated {
  opacity: 1 !important;
  transform: translateY(0) scale(1) translateX(0) rotateX(0) !important;
}

/* Enhanced WOW.js triggers */
.wow {
  transition: all 0.75s cubic-bezier(0.16, 1, 0.3, 1);
}

/* ==========================================================================
   EVENT INFO & RACE-DAY EXPERIENCE SECTION (ULTRA ENHANCED UI)
   ========================================================================== */
.feature_area {
  background: linear-gradient(180deg, #f8fafc 0%, #ffffff 50%, #f1f5f9 100%);
  position: relative;
  overflow: hidden;
  padding: 95px 0;
}

.feature_area::before {
  content: "";
  position: absolute;
  top: -100px;
  right: -100px;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(255, 170, 23, 0.08) 0%, transparent 70%);
  pointer-events: none;
  border-radius: 50%;
}

.feature_area::after {
  content: "";
  position: absolute;
  bottom: -100px;
  left: -100px;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.06) 0%, transparent 70%);
  pointer-events: none;
  border-radius: 50%;
}

/* Header Pill Badge & Styling */
.event-eyebrow-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255, 170, 23, 0.12);
  color: #d97706;
  border: 1px solid rgba(255, 170, 23, 0.3);
  font-family: 'Poppins', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  padding: 7px 18px;
  border-radius: 30px;
  margin-bottom: 14px;
  animation: badgeFloat 4s ease-in-out infinite;
}

.event-info-main-title {
  font-family: 'DM Sans', 'Poppins', sans-serif;
  font-size: 38px;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -0.5px;
  margin-bottom: 12px;
}

.event-info-sub-desc {
  font-size: 16.5px;
  color: #64748b;
  max-width: 650px;
  margin: 0 auto 20px;
}

.event-benefits-header-title {
  font-family: 'DM Sans', sans-serif;
  font-size: 26px;
  font-weight: 800;
  color: #0f172a;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-top: 15px;
}

.event-benefits-header-title::after {
  content: "";
  display: block;
  width: 50px;
  height: 3.5px;
  background: linear-gradient(90deg, #ffaa17 0%, #ff7b00 100%);
  margin: 8px auto 0;
  border-radius: 4px;
}

/* Race-Day Experience Perk Card */
.single_feature {
  background: #ffffff;
  border: 1.5px solid #e2e8f0;
  border-radius: 22px;
  padding: 32px 26px 28px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.04);
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}

/* Light shimmer sweep on card hover */
.single_feature::before {
  content: "";
  position: absolute;
  top: 0;
  left: -120%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 170, 23, 0.15), transparent);
  transform: skewX(-20deg);
  transition: none;
}

.single_feature:hover::before {
  animation: shimmerLightSweep 0.85s ease-in-out;
}

.single_feature:hover {
  transform: translateY(-10px) scale(1.02);
  box-shadow: 0 22px 48px rgba(255, 170, 23, 0.2), 0 0 0 2px rgba(255, 170, 23, 0.4);
  border-color: #ffaa17;
  background: #ffffff;
}

/* Feature Perk Pill Tag */
.feature-perk-badge {
  position: absolute;
  top: 18px;
  right: 18px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 12px;
  background: #f1f5f9;
  color: #64748b;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.single_feature:hover .feature-perk-badge {
  background: rgba(255, 170, 23, 0.15);
  color: #d97706;
  border-color: rgba(255, 170, 23, 0.3);
}

/* Feature Icon Wrap */
.feature_icon_wrap {
  width: 64px;
  height: 64px;
  border-radius: 18px;
  background: linear-gradient(135deg, #ffaa17 0%, #ff7b00 100%);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  margin-bottom: 20px;
  box-shadow: 0 8px 20px rgba(255, 170, 23, 0.3);
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  flex-shrink: 0;
}

.single_feature:hover .feature_icon_wrap {
  transform: scale(1.12) rotate(8deg);
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  color: #ffaa17;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.25);
}

.single_feature h4 {
  font-family: 'DM Sans', 'Poppins', sans-serif;
  font-size: 21px;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 10px;
  transition: color 0.3s ease;
}

.single_feature:hover h4 {
  color: #d97706;
}

.single_feature p {
  font-size: 14.5px;
  color: #475569;
  line-height: 1.65;
  margin: 0;
}

/* WhatsApp Banner Redesign */
.whatsapp-cta-box {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  border-radius: 24px;
  padding: 42px 32px;
  margin-top: 35px;
  border: 1.5px solid rgba(255, 170, 23, 0.3);
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.2);
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.whatsapp-cta-box::before {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(34, 197, 94, 0.15) 0%, transparent 60%);
  pointer-events: none;
}

.whatsapp-cta-box h4 {
  font-family: 'DM Sans', 'Poppins', sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 20px;
  line-height: 1.4;
  position: relative;
  z-index: 1;
}

.whatsapp-cta-box .whatsapp-btn {
  background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
  color: #ffffff !important;
  font-family: 'Poppins', sans-serif;
  font-size: 15.5px;
  font-weight: 800;
  padding: 14px 34px;
  border-radius: 50px;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  box-shadow: 0 8px 24px rgba(34, 197, 94, 0.4);
  transition: all 0.35s ease;
  position: relative;
  z-index: 1;
  animation: pulseGlowRing 2.5s infinite;
}

.whatsapp-cta-box .whatsapp-btn:hover {
  background: linear-gradient(135deg, #4ade80 0%, #22c55e 100%);
  transform: translateY(-3px) scale(1.03);
  box-shadow: 0 14px 32px rgba(34, 197, 94, 0.55);
}

.whatsapp-cta-box .whatsapp-btn i {
  font-size: 20px;
}

/* ==========================================================================
   EVENT SPONSORS & PARTNERS SECTION (ULTRA ENHANCED UI)
   ========================================================================== */
.sponsors_area {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  padding: 95px 0;
  position: relative;
}

.sponsor-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(15, 23, 42, 0.06);
  color: #0f172a;
  border: 1px solid rgba(15, 23, 42, 0.12);
  font-family: 'Poppins', sans-serif;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 7px 18px;
  border-radius: 30px;
  margin-bottom: 12px;
}

/* 1. Title Sponsor Tier Box */
.sponsor-tier-box-title {
  background: linear-gradient(135deg, #ffffff 0%, #fffbeb 100%);
  border: 2.5px solid #ffaa17;
  border-radius: 26px;
  padding: 35px 30px;
  max-width: 520px;
  margin: 0 auto 35px;
  box-shadow: 0 16px 45px rgba(255, 170, 23, 0.22), inset 0 0 25px rgba(255, 170, 23, 0.05);
  position: relative;
  text-align: center;
  transition: all 0.4s ease;
}

.sponsor-tier-box-title:hover {
  transform: translateY(-6px);
  box-shadow: 0 24px 55px rgba(255, 170, 23, 0.32), inset 0 0 30px rgba(255, 170, 23, 0.08);
}

.badge-title-sponsor {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(135deg, #ffaa17 0%, #d97706 100%);
  color: #ffffff;
  font-family: 'Poppins', sans-serif;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 2.5px;
  padding: 6px 20px;
  border-radius: 30px;
  margin-bottom: 20px;
  box-shadow: 0 6px 18px rgba(255, 170, 23, 0.35);
  text-transform: uppercase;
}

/* 2. Powered By Tier Box */
.sponsor-tier-box-powered {
  background: linear-gradient(135deg, #ffffff 0%, #eff6ff 100%);
  border: 2.5px solid #2563eb;
  border-radius: 24px;
  padding: 30px 26px;
  max-width: 460px;
  margin: 0 auto 35px;
  box-shadow: 0 14px 40px rgba(37, 99, 235, 0.18), inset 0 0 20px rgba(37, 99, 235, 0.04);
  position: relative;
  text-align: center;
  transition: all 0.4s ease;
}

.sponsor-tier-box-powered:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 50px rgba(37, 99, 235, 0.28);
}

.badge-powered-sponsor {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
  color: #ffffff;
  font-family: 'Poppins', sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 2px;
  padding: 5px 18px;
  border-radius: 30px;
  margin-bottom: 18px;
  box-shadow: 0 6px 16px rgba(37, 99, 235, 0.3);
  text-transform: uppercase;
}

/* 3. Co-Sponsors Section Box */
.sponsor-tier-box-cosponsor {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border: 1.5px solid #e2e8f0;
  border-radius: 24px;
  padding: 30px 24px;
  max-width: 720px;
  margin: 0 auto;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.05);
  text-align: center;
}

.badge-cosponsor {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #f1f5f9;
  color: #475569;
  border: 1px solid #cbd5e1;
  font-family: 'Poppins', sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 2px;
  padding: 5px 18px;
  border-radius: 30px;
  margin-bottom: 20px;
  text-transform: uppercase;
}

/* Logo Cards Styling */
.sponsor-logo-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 20px 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid #e2e8f0;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  overflow: hidden;
}

.sponsor-logo-card:hover {
  transform: translateY(-6px) scale(1.03);
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12);
  border-color: #ffaa17;
}

.sponsor-img-title {
  max-height: 75px !important;
  max-width: 290px !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  filter: drop-shadow(0 4px 10px rgba(15, 23, 42, 0.1));
}

.sponsor-img-powered {
  max-height: 60px !important;
  max-width: 230px !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  filter: drop-shadow(0 4px 10px rgba(15, 23, 42, 0.08));
}

.sponsor-img-co {
  max-height: 48px !important;
  max-width: 180px !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}

.sponsor-card-honda {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 16px 20px !important;
}

.sponsor-img-honda-wing {
  max-height: 38px !important;
  max-width: 150px !important;
  height: auto !important;
  width: auto !important;
  object-fit: contain !important;
  filter: drop-shadow(0 2px 6px rgba(220, 38, 38, 0.2));
}

.sponsor-img-honda-tamil {
  max-height: 22px !important;
  max-width: 220px !important;
  height: auto !important;
  width: auto !important;
  object-fit: contain !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .event-info-main-title {
    font-size: 28px;
  }
  .feature_area, .sponsors_area {
    padding: 60px 0;
  }
  .single_feature {
    padding: 24px 20px;
  }
  .sponsor-tier-box-title, .sponsor-tier-box-powered {
    padding: 24px 18px;
  }
}

/* ==========================================================================
   FEATURE PERK CARDS WITH IMAGE & POPUP PREVIEW
   ========================================================================== */
.single_feature_card {
  background: #ffffff;
  border: 1.5px solid #e2e8f0;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.05);
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  height: 100%;
  display: flex;
  flex-direction: column;
}

.single_feature_card:hover {
  transform: translateY(-8px) scale(1.015);
  box-shadow: 0 24px 50px rgba(255, 170, 23, 0.22);
  border-color: #ffaa17;
}

.perk-img-wrapper {
  position: relative;
  width: 100%;
  height: 200px;
  overflow: hidden;
  background: #0f172a;
}

.perk-card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
  display: block;
}

.single_feature_card:hover .perk-card-img {
  transform: scale(1.08);
}

.perk-zoom-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(15, 23, 42, 0.55);
  backdrop-filter: blur(3px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #ffffff !important;
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  font-weight: 700;
  opacity: 0;
  transition: all 0.35s ease;
  text-decoration: none !important;
  z-index: 5;
}

.perk-zoom-overlay i {
  font-size: 24px;
  background: #ffaa17;
  color: #0f172a;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
  transition: transform 0.3s ease;
}

.single_feature_card:hover .perk-zoom-overlay {
  opacity: 1;
}

.single_feature_card:hover .perk-zoom-overlay i {
  transform: scale(1.1);
}

.perk-card-body {
  padding: 24px 22px 20px;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  text-align: left;
}

.perk-card-body .feature_icon_wrap {
  width: 50px;
  height: 50px;
  font-size: 20px;
  margin-bottom: 14px;
  border-radius: 14px;
}

.perk-card-body h4 {
  font-family: 'DM Sans', 'Poppins', sans-serif;
  font-size: 20px;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 8px;
  line-height: 1.3;
}

.perk-card-body p {
  font-size: 14px;
  color: #475569;
  line-height: 1.6;
  margin-bottom: 16px;
  flex-grow: 1;
}

.perk-modal-trigger {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Poppins', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #ffaa17 !important;
  text-decoration: none !important;
  transition: all 0.25s ease;
}

.perk-modal-trigger:hover {
  color: #d97706 !important;
  transform: translateX(4px);
}

/* Eyebrow Label & Badge Fixes (Overriding template span width/height bug) */
.section-title span.event-eyebrow-badge,
.section-title span.sponsor-eyebrow,
.section-title span.eyebrow-label {
  display: inline-flex !important;
  width: auto !important;
  height: auto !important;
  margin: 0 0 14px 0 !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
  padding: 7px 18px !important;
  box-shadow: 0 4px 15px rgba(255, 170, 23, 0.2);
}

/* Custom Lightbox Modal */
.perk-modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(15, 23, 42, 0.82);
  backdrop-filter: blur(8px);
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s ease;
}

.perk-modal-backdrop.active {
  opacity: 1;
  pointer-events: auto;
}

.perk-modal-dialog {
  background: #ffffff;
  border-radius: 24px;
  max-width: 680px;
  width: 100%;
  overflow: hidden;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.4);
  position: relative;
  transform: scale(0.85) translateY(20px);
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.perk-modal-backdrop.active .perk-modal-dialog {
  transform: scale(1) translateY(0);
}

.perk-modal-close {
  position: absolute;
  top: 15px;
  right: 15px;
  background: rgba(15, 23, 42, 0.75);
  color: #ffffff;
  border: none;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s ease;
}

.perk-modal-close:hover {
  background: #ffaa17;
  color: #0f172a;
}

.perk-modal-img-container {
  width: 100%;
  max-height: 420px;
  overflow: hidden;
  background: #0f172a;
}

.perk-modal-img-container img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.perk-modal-caption {
  padding: 24px 28px;
  text-align: center;
  background: #ffffff;
}

.perk-modal-caption h4 {
  font-family: 'DM Sans', sans-serif;
  font-size: 22px;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 10px;
}

/* ==========================================================================
   MAIN BRANDING & LION MASCOT ANIMATIONS (2s ZOOM IN RUNNING EFFECT)
   ========================================================================== */

/* 2-Second Zoom-In + Sprint/Run Entrance Animation for Lion Mascot */
@keyframes lionZoomRunIn {
  0% {
    opacity: 0;
    transform: scale(0.15) translate(220px, 120px) rotate(15deg);
    filter: blur(10px) brightness(1.3);
  }
  35% {
    opacity: 1;
    filter: blur(0) brightness(1.15);
    transform: scale(1.18) translate(-15px, -20px) rotate(-6deg);
  }
  65% {
    transform: scale(0.92) translate(10px, 10px) rotate(3deg);
  }
  85% {
    transform: scale(1.05) translate(-4px, -4px) rotate(-1deg);
  }
  100% {
    opacity: 1;
    transform: scale(1) translate(0, 0) rotate(0deg);
  }
}

/* Continuous Idle Running Rhythm after 2-Second Entry */
@keyframes lionContinuousBounce {
  0%, 100% {
    transform: translateY(0) scale(1) rotate(0deg);
  }
  50% {
    transform: translateY(-14px) scale(1.03) rotate(-1.5deg);
  }
}

/* Glow ring effect behind mascot */
@keyframes mascotGlowPulse {
  0%, 100% {
    box-shadow: 0 0 35px rgba(255, 170, 23, 0.4), 0 0 70px rgba(0, 168, 89, 0.25);
    transform: scale(1);
  }
  50% {
    box-shadow: 0 0 55px rgba(255, 170, 23, 0.75), 0 0 110px rgba(0, 168, 89, 0.5);
    transform: scale(1.05);
  }
}

/* Hero Mascot Container Styling */
.hero-mascot-wrapper {
  position: absolute;
  right: 5%;
  bottom: 6%;
  z-index: 10;
  max-width: 440px;
  width: 36vw;
  text-align: center;
  pointer-events: none;
}

.hero-mascot-img {
  width: 100%;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 20px 35px rgba(0, 0, 0, 0.65));
  will-change: transform, opacity;
  animation: lionZoomRunIn 2s cubic-bezier(0.25, 1.25, 0.5, 1) 0.3s both,
             lionContinuousBounce 3.2s ease-in-out 2.3s infinite;
  pointer-events: auto;
}

.hero-mascot-badge {
  position: absolute;
  top: -15px;
  right: 10px;
  max-width: 110px;
  filter: drop-shadow(0 6px 15px rgba(0, 0, 0, 0.5));
  animation: bounce 2s infinite ease-in-out;
}

/* Gold Main Title Image in Hero Slide */
.hero-title-main-img {
  max-width: 520px;
  width: 100%;
  height: auto;
  display: block;
  margin: 0 0 14px 0;
  filter: drop-shadow(0 8px 25px rgba(0, 0, 0, 0.7));
  animation: fadeInDown 1.2s ease-out;
}

.hero-4th-edition-img {
  max-height: 75px;
  width: auto;
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 10px;
  filter: drop-shadow(0 6px 16px rgba(0, 0, 0, 0.5));
}

/* Dedicated Mascot Spotlight Section on Homepage & Gallery Header */
.mascot-spotlight-section {
  background: linear-gradient(135deg, #0a0f1d 0%, #152238 60%, #0d1627 100%);
  position: relative;
  overflow: hidden;
  padding: 90px 0;
  color: #ffffff;
  border-top: 4px solid #ffaa17;
  border-bottom: 4px solid #00a859;
}

.mascot-spotlight-section::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -20%;
  width: 140%;
  height: 200%;
  background: radial-gradient(circle, rgba(255, 170, 23, 0.12) 0%, rgba(0,0,0,0) 65%);
  pointer-events: none;
}

.mascot-card-box {
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 24px;
  padding: 40px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.4s ease;
}

.mascot-card-box:hover {
  transform: translateY(-8px);
  box-shadow: 0 30px 60px rgba(255, 170, 23, 0.25);
  border-color: rgba(255, 170, 23, 0.4);
}

.mascot-card-img-wrap {
  position: relative;
  text-align: center;
  padding: 20px;
}

.mascot-card-img-wrap::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 260px;
  height: 260px;
  margin-top: -130px;
  margin-left: -130px;
  border-radius: 50%;
  z-index: 0;
  animation: mascotGlowPulse 4s infinite ease-in-out;
}

.mascot-card-img {
  position: relative;
  z-index: 2;
  max-width: 380px;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 15px 30px rgba(0, 0, 0, 0.6));
  transition: transform 0.5s ease;
}

.mascot-card-box:hover .mascot-card-img {
  transform: scale(1.06) rotate(2deg);
}

/* Brand Card Box Matching Mascot Card on Right Side */
.brand-card-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100%;
  height: 100%;
}

.brand-showcase-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 30px;
  width: 100%;
  padding: 10px;
}

.brand-item-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.brand-card-img-edition {
  max-height: 140px;
  max-width: 85%;
  width: auto;
  height: auto;
  filter: drop-shadow(0 12px 25px rgba(0, 0, 0, 0.6));
  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), filter 0.4s ease;
}

.brand-card-img-marathon {
  max-height: 180px;
  max-width: 95%;
  width: auto;
  height: auto;
  filter: drop-shadow(0 14px 30px rgba(0, 0, 0, 0.65));
  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), filter 0.4s ease;
}

/* ==========================================================================
   LION RUNNING FROM INSIDE ANIMATION ("ULLA IRUNTHU ODI VARA MAARI")
   ========================================================================== */
@keyframes lionSprintFromInside {
  0% {
    opacity: 0;
    transform: scale(0.1) translateY(130px) rotate(-12deg);
    filter: blur(14px) brightness(1.35);
  }
  22% {
    opacity: 1;
    filter: blur(0) brightness(1.15);
    transform: scale(0.48) translateY(-40px) rotate(6deg);
  }
  45% {
    transform: scale(0.74) translateY(26px) rotate(-6deg);
  }
  68% {
    transform: scale(1.16) translateY(-18px) rotate(4deg);
  }
  86% {
    transform: scale(0.94) translateY(8px) rotate(-1.5deg);
  }
  100% {
    opacity: 1;
    transform: scale(1) translateY(0) rotate(0deg);
  }
}

/* Continuous energetic stride bounce after charging forward */
@keyframes lionCardRunBounce {
  0%, 100% {
    transform: translateY(0) scale(1) rotate(0deg);
  }
  50% {
    transform: translateY(-16px) scale(1.04) rotate(-2deg);
  }
}

/* Ground shadow animation beneath the running lion */
@keyframes lionCardShadowSprint {
  0% {
    opacity: 0;
    transform: scale(0.15);
  }
  45% {
    opacity: 0.6;
    transform: scale(0.65);
  }
  68% {
    opacity: 0.95;
    transform: scale(1.25);
  }
  100% {
    opacity: 0.75;
    transform: scale(1);
  }
}

@keyframes lionCardShadowBounce {
  0%, 100% {
    transform: scale(1);
    opacity: 0.75;
  }
  50% {
    transform: scale(0.8);
    opacity: 0.45;
  }
}

.lion-charging-mascot {
  will-change: transform, opacity;
  animation: lionSprintFromInside 1.8s cubic-bezier(0.22, 1.25, 0.45, 1) both,
             lionCardRunBounce 3.2s ease-in-out 1.8s infinite;
}

.lion-card-ground-shadow {
  width: 220px;
  height: 24px;
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 70%);
  border-radius: 50%;
  margin: -15px auto 0 auto;
  position: relative;
  z-index: 1;
  animation: lionCardShadowSprint 1.8s cubic-bezier(0.22, 1.25, 0.45, 1) both,
             lionCardShadowBounce 3.2s ease-in-out 1.8s infinite;
}

/* Right Side Logos Burst Zoom-In */
@keyframes brandBurstZoomIn {
  0% {
    opacity: 0;
    transform: scale(0.15);
    filter: blur(10px);
  }
  65% {
    opacity: 1;
    transform: scale(1.12);
    filter: blur(0);
  }
  85% {
    transform: scale(0.96);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.brand-burst-img {
  will-change: transform, opacity;
}

.brand-card-img-edition.brand-burst-img {
  animation: brandBurstZoomIn 1.3s cubic-bezier(0.25, 1.2, 0.5, 1) 0.2s both;
}

.brand-card-img-marathon.brand-burst-img {
  animation: brandBurstZoomIn 1.3s cubic-bezier(0.25, 1.2, 0.5, 1) 0.4s both;
}

/* Hover effects */
.mascot-card-box:hover .lion-charging-mascot {
  transform: scale(1.08) translateY(-10px) rotate(2deg);
  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.brand-card-box:hover .brand-card-img-edition {
  transform: scale(1.1) rotate(-2deg);
}

.brand-card-box:hover .brand-card-img-marathon {
  transform: scale(1.08) rotate(1deg);
}

/* ==========================================================================
   OFFICIAL BRANDING & MASCOT UNIFORM ALIGNED GALLERY CARDS
   ========================================================================== */
.single-gallery.brand-mascot-card {
  height: 330px !important;
  background: linear-gradient(145deg, #090f22 0%, #0e1b3c 100%) !important;
  border: 1.5px solid rgba(255, 170, 23, 0.35) !important;
  border-radius: 20px !important;
  padding: 26px 20px 20px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  align-items: center !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.45) !important;
  position: relative !important;
  overflow: hidden !important;
  transition: all 0.35s cubic-bezier(0.2, 0.8, 0.2, 1) !important;
  cursor: pointer;
}

.single-gallery.brand-mascot-card:before {
  content: '';
  position: absolute;
  top: -50%;
  right: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(255, 170, 23, 0.08) 0%, transparent 60%);
  pointer-events: none;
}

.single-gallery.brand-mascot-card:hover {
  transform: translateY(-8px) !important;
  border-color: #ffaa17 !important;
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.6), 0 0 30px rgba(255, 170, 23, 0.3) !important;
}

.brand-card-img-wrap {
  width: 100%;
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 2;
  padding: 6px 0;
}

.brand-card-img-wrap img {
  max-height: 168px !important;
  max-width: 88% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  filter: drop-shadow(0 10px 22px rgba(0, 0, 0, 0.5));
  transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.single-gallery.brand-mascot-card:hover .brand-card-img-wrap img {
  transform: scale(1.08);
}

.single-gallery.brand-mascot-card .gallery_enlarge_icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.6);
  opacity: 0;
  z-index: 5;
  width: 52px;
  height: 52px;
  line-height: 52px;
  background: linear-gradient(135deg, #ffaa17 0%, #ff8800 100%);
  color: #0b1329;
  border-radius: 50%;
  text-align: center;
  font-size: 18px;
  box-shadow: 0 6px 20px rgba(255, 170, 23, 0.6);
  transition: all 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.single-gallery.brand-mascot-card:hover .gallery_enlarge_icon {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.single-gallery.brand-mascot-card .gallery_enlarge_icon:hover {
  background: #ffffff;
  color: #ffaa17;
  box-shadow: 0 0 25px rgba(255, 255, 255, 0.8);
}

.brand-card-info {
  width: 100%;
  text-align: center;
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  position: relative;
  z-index: 2;
}

.brand-card-tag {
  display: inline-block;
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  color: #ffaa17;
  font-weight: 700;
  margin-bottom: 4px;
}

.brand-card-tag i {
  margin-right: 4px;
}

.brand-card-info h4 {
  position: static !important;
  opacity: 1 !important;
  margin: 0 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  letter-spacing: 0.3px;
}

.brand-card-info h4 a {
  color: #ffffff !important;
  transition: color 0.25s ease;
}

.brand-card-info h4 a:hover {
  color: #ffaa17 !important;
}

@media (max-width: 768px) {
  .single-gallery.brand-mascot-card {
    height: 270px !important;
    padding: 18px 14px 14px !important;
    margin-bottom: 22px;
  }
  .brand-card-img-wrap {
    height: 165px;
  }
  .brand-card-img-wrap img {
    max-height: 150px !important;
  }
  .brand-card-info h4 {
    font-size: 14.5px !important;
  }
}

/* ==========================================================================
   MARATHON LIVE RACE PHOTO SLIDER STREAM (ATTRACTIVE GLIDING ANIMATION)
   ========================================================================== */
.marathon-race-slider-wrapper {
  width: 100%;
  margin: 15px auto 40px auto;
  position: relative;
}

.race-slider-heading-wrap {
  text-align: center;
  margin-bottom: 22px;
}

.race-slider-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255, 170, 23, 0.12);
  border: 1px solid rgba(255, 170, 23, 0.35);
  color: #ffaa17;
  padding: 6px 16px;
  border-radius: 50px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 8px;
  box-shadow: 0 4px 15px rgba(255, 170, 23, 0.15);
}

.race-slider-title {
  font-size: 24px;
  font-weight: 700;
  color: #1e293b;
  margin: 0 0 6px 0;
  letter-spacing: 0.2px;
}

.race-slider-subtitle {
  font-size: 14px;
  color: #64748b;
  margin: 0;
}

.race-photo-stream-container {
  width: 100%;
  overflow: hidden;
  position: relative;
  padding: 12px 0 18px 0;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 5%, black 95%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, black 5%, black 95%, transparent 100%);
}

.race-photo-stream-track {
  display: flex;
  align-items: center;
  gap: 22px;
  width: max-content;
  animation: racePhotoStreamGlide 38s linear infinite;
  will-change: transform;
}

.race-photo-stream-container:hover .race-photo-stream-track {
  animation-play-state: paused;
}

.race-stream-slide {
  flex-shrink: 0;
  width: 320px;
  height: 215px;
}

.race-slide-inner {
  width: 100%;
  height: 100%;
  border-radius: 18px;
  overflow: hidden;
  position: relative;
  background: #090f20;
  border: 2px solid rgba(255, 170, 23, 0.3);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.35);
  transition: all 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);
  cursor: pointer;
}

.race-slide-inner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.65s cubic-bezier(0.2, 0.8, 0.2, 1), filter 0.4s ease;
}

.race-slide-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  padding: 16px;
  background: linear-gradient(to top, rgba(9, 15, 34, 0.92) 0%, rgba(9, 15, 34, 0.45) 50%, rgba(9, 15, 34, 0.05) 100%);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  transition: all 0.35s ease;
}

.race-slide-tag {
  display: inline-block;
  align-self: flex-start;
  background: rgba(255, 170, 23, 0.9);
  color: #0b1329;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  padding: 3px 9px;
  border-radius: 6px;
  margin-bottom: 6px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}

.race-slide-overlay h4 {
  color: #ffffff;
  font-size: 16px;
  font-weight: 700;
  margin: 0;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.7);
  transition: color 0.25s ease;
}

.race-slide-zoom {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 38px;
  height: 38px;
  line-height: 38px;
  text-align: center;
  border-radius: 50%;
  background: rgba(11, 19, 41, 0.75);
  border: 1px solid rgba(255, 170, 23, 0.5);
  color: #ffaa17;
  font-size: 14px;
  opacity: 0;
  transform: scale(0.7);
  transition: all 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.race-slide-inner:hover {
  transform: translateY(-6px) scale(1.02);
  border-color: #ffaa17;
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.55), 0 0 25px rgba(255, 170, 23, 0.35);
}

.race-slide-inner:hover img {
  transform: scale(1.08);
  filter: brightness(1.06);
}

.race-slide-inner:hover .race-slide-zoom {
  opacity: 1;
  transform: scale(1);
}

.race-slide-zoom:hover {
  background: #ffaa17;
  color: #090f20;
  box-shadow: 0 0 15px rgba(255, 170, 23, 0.8);
}

@keyframes racePhotoStreamGlide {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

@media (max-width: 768px) {
  .marathon-race-slider-wrapper {
    margin: 10px auto 30px auto;
  }
  .race-slider-title {
    font-size: 20px;
  }
  .race-slider-subtitle {
    font-size: 13px;
  }
  .race-photo-stream-container {
    padding: 8px 0 14px 0;
  }
  .race-photo-stream-track {
    gap: 16px;
    animation-duration: 26s;
  }
  .race-stream-slide {
    width: 245px;
    height: 165px;
  }
  .race-slide-overlay {
    padding: 12px;
  }
  .race-slide-overlay h4 {
    font-size: 14px;
  }
  .race-slide-tag {
    font-size: 9px;
    padding: 2px 7px;
  }
}



/* ==========================================================================
   GALLERY ZOOM-IN POP-UP EFFECT & HOVER MAGNIFICATION
   ========================================================================== */

.gallery-zoom-popup-card {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  background: #0f172a;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.35);
  transition: transform 0.45s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.45s ease;
  cursor: pointer;
}

.gallery-zoom-popup-card img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 14px;
  transition: transform 0.65s cubic-bezier(0.25, 1, 0.5, 1), filter 0.65s ease;
  will-change: transform;
}

/* Hover Zoom In Pop-Up Effect */
.gallery-zoom-popup-card:hover {
  transform: translateY(-8px) scale(1.02);
  box-shadow: 0 20px 40px rgba(255, 170, 23, 0.35), 0 10px 20px rgba(0, 0, 0, 0.5);
}

.gallery-zoom-popup-card:hover img {
  transform: scale(1.1);
  filter: brightness(1.08) contrast(1.05);
}

.gallery-zoom-popup-card:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.1) 0%, rgba(15, 23, 42, 0.85) 100%);
  opacity: 0;
  transition: opacity 0.4s ease;
  z-index: 2;
  border-radius: 14px;
}

.gallery-zoom-popup-card:hover:before {
  opacity: 1;
}

/* Pop-up Icon with Ripple and Bounce */
.gallery-zoom-popup-card .gallery_enlarge_icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.6);
  opacity: 0;
  z-index: 3;
  width: 58px;
  height: 58px;
  line-height: 58px;
  background: linear-gradient(135deg, #ffaa17 0%, #ff7b00 100%);
  color: #0f172a;
  border-radius: 50%;
  text-align: center;
  font-size: 20px;
  box-shadow: 0 0 0 0 rgba(255, 170, 23, 0.7);
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.gallery-zoom-popup-card:hover .gallery_enlarge_icon {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1.15);
  box-shadow: 0 0 25px rgba(255, 170, 23, 0.8);
  animation: galleryIconPulse 1.8s infinite;
}

@keyframes galleryIconPulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 170, 23, 0.75);
  }
  70% {
    box-shadow: 0 0 0 16px rgba(255, 170, 23, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 170, 23, 0);
  }
}

.gallery-zoom-popup-card h4 {
  position: absolute;
  left: 20px;
  bottom: 18px;
  z-index: 3;
  margin: 0;
  opacity: 0;
  transform: translateY(12px);
  transition: all 0.4s ease;
}

.gallery-zoom-popup-card:hover h4 {
  opacity: 1;
  transform: translateY(0);
}

.gallery-zoom-popup-card h4 a {
  color: #ffffff;
  font-family: 'DM Sans', sans-serif;
  font-size: 18px;
  font-weight: 700;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.7);
}

/* ==========================================================================
   ANIMATED REGISTER BUTTON (ON & ABOVE BANNER SECTION)
   ========================================================================== */

/* Shimmer Light Sweep Keyframe */
@keyframes buttonShimmerSweep {
  0% {
    background-position: -200% center;
  }
  100% {
    background-position: 200% center;
  }
}

/* Pulsing Glow Shadow Keyframe - Subtle and Gentle */
@keyframes buttonGlowPulse {
  0%, 100% {
    box-shadow: 0 2px 8px rgba(255, 170, 23, 0.35);
  }
  50% {
    box-shadow: 0 3px 14px rgba(255, 170, 23, 0.65);
  }
}

/* Top Navbar / Above-Banner Compact Animated Register Button */
.banner-top-register-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 14px;
  font-family: 'Poppins', sans-serif;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #0f172a !important;
  background: #ffaa17;
  border-radius: 16px;
  border: none;
  box-shadow: 0 2px 8px rgba(255, 170, 23, 0.35);
  text-decoration: none !important;
  animation: buttonGlowPulse 2.8s infinite ease-in-out;
  transition: all 0.25s ease;
  vertical-align: middle;
}

.banner-top-register-btn:hover {
  background: #ffc837;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(255, 170, 23, 0.55);
  color: #000000 !important;
}

/* Mobile Top Compact Register Button */
.banner-top-register-btn-mobile {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  font-family: 'Poppins', sans-serif;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  color: #0f172a !important;
  background: #ffaa17;
  border-radius: 12px;
  border: none;
  box-shadow: 0 2px 6px rgba(255, 170, 23, 0.3);
  text-decoration: none !important;
  transition: all 0.2s ease;
  line-height: 1.2;
}

.banner-top-register-btn-mobile:hover,
.banner-top-register-btn-mobile:active {
  background: #ffc837;
  color: #0f172a !important;
}

/* Banner Slider Register Button */
.btn-banner-register {
  animation: buttonGlowPulse 2.8s infinite ease-in-out !important;
}

.btn-banner-register i {
  display: inline-block;
  transition: transform 0.3s ease;
  animation: arrowSlideGlide 1.5s infinite alternate ease-in-out;
}

@keyframes arrowSlideGlide {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(5px);
  }
}

/* Mobile sizing for banner slider button */
@media (max-width: 768px) {
  .btn-banner-register,
  .kenburns_061_slide > a {
    padding: 8px 18px !important;
    font-size: 11px !important;
    letter-spacing: 0.5px !important;
    margin-top: 10px !important;
  }
}

/* ========================================================
   SCROLL POPUP ZOOM ANIMATION FOR CARDS & GALLERY IMAGES
   ======================================================== */
.scroll-popup-zoom {
  opacity: 0;
  transform: scale(0.84) translateY(26px);
  transition: opacity 0.75s cubic-bezier(0.175, 0.885, 0.32, 1.275), 
              transform 0.75s cubic-bezier(0.175, 0.885, 0.32, 1.275),
              box-shadow 0.35s ease;
  will-change: opacity, transform;
}

.scroll-popup-zoom.revealed,
.scroll-popup-zoom.animated,
.wow.animated .scroll-popup-zoom,
.wow.zoomIn.animated {
  opacity: 1 !important;
  transform: scale(1) translateY(0) !important;
}

/* Race Category Cards Scroll Pop-up Effect */
.race-category-card {
  transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.4s ease, opacity 0.7s ease !important;
}

.race-category-card:hover {
  transform: translateY(-8px) scale(1.015) !important;
  box-shadow: 0 20px 48px rgba(15, 23, 42, 0.16) !important;
}

.race-category-image img {
  transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.race-category-card:hover .race-category-image img {
  transform: scale(1.08) !important;
}

/* Gallery Zoom Pop-up Cards */
.gallery-zoom-popup-card {
  transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.4s ease !important;
  border-radius: 14px;
  overflow: hidden;
}

.gallery-zoom-popup-card:hover {
  transform: translateY(-7px) scale(1.025) !important;
  box-shadow: 0 16px 36px rgba(255, 170, 23, 0.25), 0 8px 24px rgba(0, 0, 0, 0.45) !important;
}

.gallery-zoom-popup-card img {
  transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.gallery-zoom-popup-card:hover img {
  transform: scale(1.09);
}

/* ========================================================
   NEAT MODERN RESPONSIVE FOOTER ALIGNMENT
   ======================================================== */
.footer {
  background: #080e1e !important;
  border-top: 2px solid rgba(255, 170, 23, 0.25) !important;
  position: relative;
  z-index: 10;
  width: 100%;
  padding-top: 50px;
  padding-bottom: 55px !important;
}

.footer .footer_logo img {
  max-width: 155px;
  height: auto;
  margin-bottom: 14px;
}

.footer .footer_logo p {
  color: #94a3b8;
  font-size: 13.5px;
  line-height: 1.65;
  margin-bottom: 18px;
}

.footer .single_footer h4,
.footer .newsletter-form h4 {
  color: #ffffff;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.3px;
  margin-bottom: 16px;
  position: relative;
  padding-bottom: 8px;
}

.footer .single_footer h4::after,
.footer .newsletter-form h4::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 32px;
  height: 2px;
  background: #ffaa17;
  border-radius: 2px;
}

.footer .single_footer ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer .single_footer ul li {
  margin-bottom: 8px;
}

.footer .single_footer ul li a {
  color: #cbd5e1;
  font-size: 13.5px;
  display: inline-block;
  transition: all 0.25s ease;
  text-decoration: none;
  line-height: 1.6;
}

.footer .single_footer ul li a:hover {
  color: #ffaa17;
  transform: translateX(4px);
}

.footer .newsletter-form input {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #ffffff;
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 13.5px;
  width: 100%;
  margin-bottom: 10px;
}

.footer .newsletter-form input:focus {
  border-color: #ffaa17;
  outline: none;
  background: rgba(255, 255, 255, 0.12);
}

.footer .newsletter-form .subs_btn {
  background: #ffaa17;
  color: #0b1329;
  font-weight: 700;
  font-size: 13px;
  border: none;
  border-radius: 8px;
  padding: 10px 20px;
  cursor: pointer;
  width: 100%;
  transition: all 0.25s ease;
}

.footer .newsletter-form .subs_btn:hover {
  background: #e69500;
  color: #ffffff;
}

.footer .footer_copyright {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  margin-top: 35px;
  padding-top: 20px;
  text-align: center;
}

.footer .footer_copyright p {
  color: #94a3b8;
  font-size: 12.5px;
  margin: 0;
}

/* Executive Footer Developer Credit */
.footer_developer_credit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 14px;
  margin-bottom: 10px;
  padding: 8px 22px;
  background: linear-gradient(135deg, #0e1e38 0%, #081528 100%);
  border: 1.5px solid rgba(74, 222, 128, 0.45);
  border-radius: 50px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4), 0 0 16px rgba(74, 222, 128, 0.15);
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  max-width: 100%;
}

.footer_developer_credit:hover {
  background: linear-gradient(135deg, #132747 0%, #0b1c36 100%);
  border-color: #22c55e;
  box-shadow: 0 6px 25px rgba(0, 0, 0, 0.5), 0 0 22px rgba(34, 197, 94, 0.35);
  transform: translateY(-2px);
}

.footer_developer_credit .dev_text {
  color: #e2e8f0;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.4px;
}

.footer_developer_credit .dev_brand_highlight {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none !important;
}

.footer_developer_credit .dev_company_name {
  color: #22c55e;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  text-shadow: 0 0 10px rgba(34, 197, 94, 0.3);
  transition: all 0.25s ease;
}

.footer_developer_credit:hover .dev_company_name {
  color: #4ade80;
  text-shadow: 0 0 14px rgba(74, 222, 128, 0.6);
}

.footer_developer_credit .dev_logo_img {
  height: 22px;
  width: auto;
  object-fit: contain;
  background: #ffffff;
  padding: 2px 7px;
  border-radius: 5px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
  display: inline-block;
  vertical-align: middle;
  transition: transform 0.25s ease;
}

.footer_developer_credit:hover .dev_logo_img {
  transform: scale(1.06);
}

@media (max-width: 768px) {
  .footer {
    padding: 35px 0 65px !important;
  }
  .footer .footer_logo {
    text-align: left;
    margin-bottom: 24px;
  }
  .footer .single_footer,
  .footer .newsletter-form {
    margin-bottom: 24px;
  }
  .footer .footer_copyright {
    margin-top: 20px;
    padding-top: 16px;
    padding-bottom: 12px;
  }
}

@media (max-width: 576px) {
  .footer {
    padding: 35px 0 80px !important;
  }
  .footer_developer_credit {
    flex-direction: column;
    gap: 8px;
    padding: 10px 18px;
    border-radius: 16px;
    width: auto;
    max-width: 95%;
  }
  .footer_developer_credit .dev_brand_highlight {
    display: inline-flex;
    align-items: center;
    gap: 8px;
  }
  .footer_developer_credit .dev_company_name {
    font-size: 12px;
  }
  .footer_developer_credit .dev_logo_img {
    height: 20px;
  }
}