@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

body{
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    color: #161616;
}


/* Logo Loader */
/* Loader Background */
#page-loader {
    position: fixed;
    width: 100%;
    height: 100%;
    background: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

/* Wrapper */
.logo-wrapper {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Logo */
.logo-wrapper img {
    width: 160px;
    z-index: 3;
}

/* Rings Base */
.ring {
    position: absolute;
    width: 230px;
    height: 230px;
    border-radius: 50%;
    border: 4px solid transparent;
}

/* Ring 1 – Clockwise */
.ring1 {
    border-top: 4px solid #e10600;
    border-right: 4px solid #e10600;
    animation: spinClock 1.4s linear infinite;
}

/* Ring 2 – Anti-clockwise */
.ring2 {
    width: 200px;
    height: 200px;
    border-bottom: 4px solid #000;
    border-left: 4px solid #000;
    animation: spinAnti 1.8s linear infinite;
}

/* Animations */
@keyframes spinClock {
    100% { transform: rotate(360deg); }
}

@keyframes spinAnti {
    100% { transform: rotate(-360deg); }
}

/* Logo Loader end */

.primary-color
{
    color: #1A9D1A !important;
}
a
{
    text-decoration: none !important;
    color: inherit !important;
    
}
a.primary-color:hover
{
    
    opacity: 0.8;
}
.nav-logo
{
    width: 60px;
}
a.nav-link.active {
    color: #EC2225 !important;
    font-weight: 600;
}


/* Default navbar */
.nav-header {
    position: absolute;
    width: 100%;
    top: 0;
    z-index: 999;
    transition: all 0.3s ease;
}

/* After scroll */
.nav-header.sticky {
    position: fixed;
    background: #ffffff; /* change color if needed */
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    padding: 15px 0px;
}

button.navbar-toggler.custom-toggler.collapsed {
    color: white !important;
}


.navbar-toggler {
    padding: var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);
    font-size: var(--bs-navbar-toggler-font-size);
    line-height: 1;
    color: rgb(0 0 0 / 0%) !important;
    background-color: transparent;
    border: var(--bs-border-width) solid var(--bs-navbar-toggler-border-color);
    border-radius: var(--bs-navbar-toggler-border-radius);
    transition: var(--bs-navbar-toggler-transition);
}

.custom-toggler {
    border: none;
    background: transparent;
    width: 30px;
    height: 22px;
    position: relative;
}

.custom-toggler span {
    position: absolute;
    width: 100%;
    height: 3px;
    background: #EC2225;
    left: 0;
    transition: all 0.3s ease;
}

.custom-toggler span:nth-child(1) { top: 0; }
.custom-toggler span:nth-child(2) { top: 9px; }
.custom-toggler span:nth-child(3) { top: 18px; }

/* Animation when open */
.custom-toggler.active span:nth-child(1) {
    transform: rotate(45deg);
    top: 9px;
}

.custom-toggler.active span:nth-child(2) {
    opacity: 0;
}

.custom-toggler.active span:nth-child(3) {
    transform: rotate(-45deg);
    top: 9px;
}




/* banner */

.banner-section
{
    width: 100%;
    height: 100vh;
    background-image: url(../images/banner-bg-img.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.marqee-img-container
{
    overflow: hidden;
    height: 100vh;
}

.marqee-img-top {
    display: flex;
    flex-direction: column;
    animation: marqueeTop 20s linear infinite;
    
}

/* Animation */
@keyframes marqueeTop {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(-50%);
    }
}


.marqee-img-top:hover {
    animation-play-state: paused;
}



.marqee-img-bottom {
    display: flex;
    flex-direction: column;
    animation: marqueeBottom 20s linear infinite;
}

/* Bottom to Top */
@keyframes marqueeBottom {
    0% {
        transform: translateY(-50%);
    }
    100% {
        transform: translateY(0%);
    }
}



.marqee-img-bottom:hover {
    animation-play-state: paused;
}

h1.banner-heading {
    font-size: 58px;
    font-weight: 800;
    
}

h1.banner-heading span {
    color: #1A9D1A;
    
}

p.banner-text {
    font-size: 20px;
    font-weight: 600;
}

button.btn.btn-primary {
    background-color: #161616;
    border: 2px solid #1A9D1A;
    border-radius: 50px;
    padding: 10px 30px;
    box-shadow: 0 0 15px #1a9d1a81;
}

.marqee-img-top img:hover {
    border: 2px solid #1A9D1A;
    border-radius: 30px;
    box-shadow: 0 0 15px #1a9d1a8c;
}

.marqee-img-top img {
    
    border-radius: 20px;
    
}

.marqee-img-bottom img:hover {
    border: 2px solid #1A9D1A;
    border-radius: 30px;
    box-shadow: 0 0 15px #1a9d1a8c;
}

/* home-page about section */

.about-section
{
    
    background-image: url(../images/black-bg-color.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    color: white;
}
.video-iframe
{
    border-radius: 30px;
}


.gradient-text{
        background: linear-gradient(181deg, #9393936e, #ffffff00);
    -webkit-background-clip: text;
    -webkit-text-fill-color: #9f9f9f00;
    font-weight: 800;
    
}
.h2style {
    font-size: 75px;
    
}

.h2-heading
{
    font-size: 40px;
     font-weight: 800;
}
.margin-top {
    
    margin-top: -50px;
}

.margin-top-personal-trainer-style
{
    margin-top: -100px;
}

.personal-trainer-style
{
    font-size: 138px;
}


h2 span
{
    color: #1A9D1A;
}


/* our solution */
/* Keep your existing style */
.card-body {
    padding: 0;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
}

/* Your existing hover border effect */
.card-body:hover {
    
    border: 2px solid #1A9D1A;
    border-radius: 30px;
    box-shadow: 0 0 15px #1a9d1a8c;
}



/* Overlay style */
/* .card-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 20px;
    color: #fff;
    background: linear-gradient(to top, rgba(156,68,137,0.95), rgba(156,68,137,0));
    transform: translateY(100%);
    transition: 0.4s ease;
} */

.card-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 20px;
    color: #fff;

    /* Glass Effect */
    background: rgb(0 0 0 / 51%);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);

    border-top: 1px solid rgba(255, 255, 255, 0.3);

    transform: translateY(100%);
    transition: 0.4s ease;
}

.primary-color
{
    color: #464990;
}
/* Hover show */
.service-card:hover .card-overlay {
    transform: translateY(0);
}

/* Title */
.card-overlay h3 {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 10px;
}

a
{
    text-decoration: none;
    color: inherit !important;
}

/* Text */
.card-overlay p {
    font-size: 14px;
    margin: 0;
}

.card-overlay span {
    font-weight: 600;
    font-style: italic;
}






.our-solution
{
    background-image: url(../images/me-pg.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.word-break{
    word-break: break-all;
    overflow-wrap: anywhere;
}


/* why-choose-us-section */

.why-choose-us-section
{
    background-color: #EFFFEF;
}


.why-choose-us-body-container{
    background-color: #EFFFEF;
    margin-top: -160px;
    position: relative;
}

.ellipse-blur {
    position: relative;
    top: -30px;
    margin-top: -10px;
}


/* our-process */

.our-process
{
    background-image: url(../images/black-bg-color.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    color: white;
}




.accordion {
  display: flex;
  height: 400px;
  overflow: hidden;
  border-radius: 20px;
  border: 1px solid #c5c9cc8c;
}

/* panels */

.panel {
    flex: 1;
    background: #0d0d0d00;
    padding: 20px;
    cursor: pointer;
    transition: all 0.4s ease;
    border: 1px solid #c5c9cc8c;
    display: flex;
    flex-direction: column;
    justify-content: left;
}

.panel h3 {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  margin: 0 !important;
  padding: 14px;
  padding-right: 0 !important;
  height: 240px;
}

.panel p {
  display: none;
  opacity: 0;
  margin-top: 15px;
  transition: opacity 0.3s ease;
}

/* active panel */

.panel.active {
  flex: 4;
  background: linear-gradient(135deg,#4a3cff,#00b3a4);
  color: white;
}

.panel.active h3 {
  writing-mode: horizontal-tb;
  transform: none;
  padding: 0 !important;
  margin-top: 10px !important;
  height: inherit !important;
}



.panel.active p {
  opacity: 1;
  display: block;
}

/* responsive */

@media(max-width: 900px) {

  .accordion {
    flex-direction: column;
    height: auto;
  }

  .panel h3 {
    writing-mode: horizontal-tb;
    transform: none;
    padding: 0;
    height: 100%;
  }
}


/* scdfa */

.accordion-no
{
    font-size: 32px;
}



/* testimonial */
.card-body1
{
   
    border-radius: 20px 20px 0 0;
    padding: 20px;
    
}

.card-body1:hover
{
    border: 2px solid #1A9D1A;
    border-radius: 30px 30px 0 0;
    padding: 20px;
    box-shadow: 0 0 15px #1a9d1a8c;
}
.card.h-100.shadow-sm.border-0 {
    background-color: #EFFFEF !important;
    color: #161616;
    height: 400px;
    
}

.swiper-button-next , .swiper-button-prev {
    color: #EC2225 !important;
}

.card-footer.bg-white.border-0.d-flex.align-items-center {
    background-color: #EC2225 !important;
    padding: 10px 20px;
    color: white;
    font-weight: 600;
    font-size: 14px;
    
}

/* Cta cta-section */

.cta-section .container
{
    background-image: url(../images/cta-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    color: white;
    border-radius: 30px;
    padding: 60px;
}



p.card-text {
    font-size: 14px;
    line-height: normal;
    font-style: italic;
    text-align: center;
    height: 175px;
    overflow: auto;

    /* Hide scrollbar — Chrome, Safari, Edge */
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge */
}

p.card-text::-webkit-scrollbar {
    display: none; /* Chrome/Safari */
}

small.text-muted {
    color: white !important;
}



.cta-body {
    background-color: #1616168f;
    border-radius: 20px;
    overflow: hidden;
}


/* footer-section */
.footer-section
{
    background-image: url(../images/black-bg-color.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    color: #cbd3e1;
}


.footer-title {
    font-size: 48px;
    font-weight: 700;
    color: #ffffff;
}

.footer-column {
    padding-right: 40px;
    
}

.footer-column:last-child {
    border-right: none;
}

.footer-column h3 {
    color: #1A9D1A;
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 25px;
}

.footer-links {
    list-style: none;
    padding: 0;
}

.footer-links li {
    margin-bottom: 18px;
}

.footer-links a {
    color: #9aa4b2;
    text-decoration: none;
    transition: 0.3s;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-links a::after {
    content: "›";
    font-size: 18px;
    opacity: 0.5;
}

.footer-links a:hover {
    color: #ffffff;
    padding-left: 6px;
}

.footer-desc {
    color: #9aa4b2;
    margin-bottom: 25px;
}

.footer-contact a,
.footer-contact .address {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 18px;
    color: #9aa4b2;
    text-decoration: none;
    transition: 0.3s;
}

.footer-contact a:hover {
    color: #ffffff;
}

.footer-contact i {
    color: #1A9D1A;
    font-size: 18px;
    margin-top: 4px;
}

.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.08);
    padding-top: 25px;
    margin-top: 50px;
    font-size: 14px;
    color: #9aa4b2;
}


.footer-column {
    position: relative;
    padding-right: 40px;
}

.footer-column::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 2px;
    height: 100%;
    background: linear-gradient(
        to bottom,
        transparent,
        rgba(255,255,255,0.4),
        transparent
    );
}

.float-inline-end
{
    float: right !important;
}


/* about page */
.top-empty-container
{
    height: 90px;
}
section.banner-section {
    height: 100%;
    padding-bottom: 30px;
}

/* contact page */

.contact-banner-img
{
    border-radius: 20px;
}



@media screen and (max-width: 1300px) 
{
    .h2style {
        font-size: 60px;
        
    }

    .h2-heading
    {
        font-size: 38px;
        font-weight: 800;
    }
    .margin-top {
        
        margin-top: -40px;
    }

    .margin-top-personal-trainer-style
    {
        margin-top: -70px;
    }

    .personal-trainer-style
    {
        font-size: 120px;
    }

    .marqee-img-left a {
        flex: 0 0 30%;
        padding: 5px;
    }

}
@media screen and (max-width: 900px) {



    /* navbar */
    .nav-header {
    position: static;
    background-color: #ffffff;
    }

    /* banner */

  h1.banner-heading {
        font-size: 34px;
        font-weight: 800;
        
    }

    h1.banner-heading span {
        color: #1A9D1A;
        
    }

    p.banner-text {
        font-size: 16px;
        font-weight: 600;
    }

    .banner-section
    {
        width: 100%;
        height: 100%;
        background-image: url(../images/banner-bg-img.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        padding-bottom: 60px;
        padding-top: 30px;
    }

    .marqee-img-container
    {
        overflow: hidden;
        height: 50vh;
        border-radius: 15px;
    }


    .h2style {
        font-size: 45px;
        
    }

    .h2-heading
    {
        font-size: 30px;
        font-weight: 800;
    }
    .margin-top {
        
        margin-top: -30px;
    }

    .margin-top-personal-trainer-style
    {
        margin-top: -25px;
    }

    .personal-trainer-style
    {
        font-size: 42px;
    }
    p
    {
        font-size: 16px;
    }
    .marqee-img-left a {
        flex: 0 0 45%;
        padding: 5px;
    }

    .marqee-img-left img:hover{
        border: 2px solid #1A9D1A;
        border-radius: 30px;
        box-shadow: 0 0 15px #1a9d1a8c;
    }

    .why-choose-us-body-container
    {
        background-color: #EFFFEF;
        margin-top: -56px;
        position: relative;
    }

    .ellipse-blur {
        position: relative;
        top: -25px;
        margin-top: 10px;
    }


    /* about page */
    .top-empty-container
    {
        display: none;
    }

    section.cta-section{
    padding: 20px;
}

}