/*=========================================
HEADER SOCIAL ICONS
=========================================*/

.header-social{

    display:flex;

    align-items:center;

    gap:12px;

    margin-left:20px;

}

.header-social a{

    width:40px;

    height:40px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    text-decoration:none;

    color:#555;

    border:1px solid #e6e6e6;

    transition:.35s;

    font-size:16px;

}

.header-social a:hover{

    color:#fff;

    transform:translateY(-3px);

}

/* Facebook */

.header-social .facebook:hover{

    background:#1877F2;

    border-color:#1877F2;

}

/* Instagram */

.header-social .instagram:hover{

    background:linear-gradient(45deg,#F58529,#DD2A7B,#8134AF,#515BD4);

    border-color:#DD2A7B;

}

/* YouTube */

.header-social .youtube:hover{

    background:#FF0000;

    border-color:#FF0000;

}

/* LinkedIn */

.header-social .linkedin:hover{

    background:#0A66C2;

    border-color:#0A66C2;

}



/*=========================================
MOBILE SOCIAL
=========================================*/

.mobile-social{

    display:flex;

    justify-content:center;

    gap:15px;

    margin-top:35px;

}

.mobile-social a{

    width:46px;

    height:46px;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#FFE44E;

    border:1px solid rgba(255,255,255,.15);

    text-decoration:none;

    transition:.35s;

    font-size:18px;

}

.mobile-social a:hover{

    color:#fff;

    transform:translateY(-4px);

}

.mobile-social .facebook:hover{

    background:#1877F2;

}

.mobile-social .instagram:hover{

    background:linear-gradient(45deg,#F58529,#DD2A7B,#8134AF,#515BD4);

}

.mobile-social .youtube:hover{

    background:#FF0000;

}

.mobile-social .linkedin:hover{

    background:#0A66C2;

}



/* Mobile */

@media(max-width:991px){

.header-social{

    display:none;

}

}
.main-header{
    position:sticky;
    top:0;
    left:0;
    width:100%;
    background:#fff;
    z-index:9999;
    border-bottom:1px solid #ececec;
    box-shadow:0 3px 15px rgba(0,0,0,.05);
}

.main-header .container{
    max-width:1280px;
}
.navbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:88px;
    padding:0!important;
}

.logo{
    display:flex;
    align-items:center;
    text-decoration:none;
    flex-shrink:0;
}

.logo img{
    width:52px;
    height:52px;
    object-fit:contain;
}

.logo span{
    margin-left:12px;
    font-size:30px;
    font-weight:700;
    color:#111;
}
.menu-area{
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:12px;
}

.menu-top{
    display:flex;
    align-items:center;
    gap:28px;
}
.menu-bottom{
    display:flex;
    align-items:center;
    gap:30px;
}
.menu-link{
    position:relative;
    display:flex;
    align-items:center;
    color:#555;
    text-decoration:none;
    font-size:16px;
    font-weight:500;
    transition:.30s;
}

.menu-link:hover{
    color:#d79d00;
}

.menu-link::before{

    content:"";

    position:absolute;

    left:0;

    bottom:-7px;

    width:0;

    height:2px;

    background:#ffd600;

    transition:.30s;

}

.menu-link:hover::before{

    width:100%;

}
.login-btn{

    display:flex;

    align-items:center;

    gap:8px;

    background:#FFE44E;

    color:#111!important;

    text-decoration:none;

    padding:10px 24px;

    border-radius:40px;

    font-weight:600;

    transition:.30s;

}

.login-btn:hover{

    background:#FFD500;

    color:#111!important;

    transform:translateY(-2px);

}
.navbar-toggler{

    display:none;

    border:none;

    background:none;

    padding:0;

    font-size:28px;

    color:#222;

}

.navbar-toggler:focus{

    box-shadow:none;

}
@media(max-width:991.98px){

.menu-area{

    display:none!important;

}

.navbar{

    min-height:72px;

}

.logo img{

    width:42px;

    height:42px;

}

.logo span{

    font-size:24px;

}

.navbar-toggler{

    display:block;

}

}
.dropdown{
    position:relative;
}

.dropdown-toggle::after{

    border:none;

    content:"\f107";

    font-family:"Font Awesome 6 Free";

    font-weight:900;

    font-size:11px;

    margin-left:7px;

    transition:.3s;

    vertical-align:middle;

}

.dropdown:hover>.dropdown-toggle::after{

    transform:rotate(180deg);

}
.astro-dropdown{

    display:block;

    opacity:0;

    visibility:hidden;

    transform:translateY(15px);

    position:absolute;

    top:100%;

    left:0;

    min-width:250px;

    padding:10px 0;

    border:none;

    border-radius:16px;

    background:#fff;

    box-shadow:0 20px 45px rgba(0,0,0,.10);

    border-bottom:5px solid #FFD500;

    transition:.30s;

    z-index:999;

}

@media(min-width:992px){

.dropdown:hover>.astro-dropdown{

    opacity:1;

    visibility:visible;

    transform:translateY(0);

}

}
.astro-dropdown .dropdown-item{

    padding:13px 22px;

    color:#555;

    font-size:15px;

    font-weight:500;

    transition:.30s;

}

.astro-dropdown .dropdown-item:hover{

    background:#FFF8D6;

    color:#111;

    padding-left:30px;

}
.astro-dropdown .dropdown-item::after{

    content:"\f061";

    font-family:"Font Awesome 6 Free";

    font-weight:900;

    float:right;

    opacity:0;

    transition:.30s;

}

.astro-dropdown .dropdown-item:hover::after{

    opacity:1;

}
.calculator-menu{

    width:320px;

    max-height:330px;

    overflow-y:auto;

    overflow-x:hidden;

}

.calculator-menu::-webkit-scrollbar{

    width:6px;

}

.calculator-menu::-webkit-scrollbar-thumb{

    background:#d6d6d6;

    border-radius:20px;

}

.calculator-menu::-webkit-scrollbar-track{

    background:transparent;

}
@media(max-width:991.98px){

.astro-dropdown{

    display:none!important;

}

.dropdown-toggle::after{

    display:none;

}

}
.offcanvas{

    width:340px;

    background:#130d08;

    color:#fff;
z-index: 10524;
    border:none;

}

.offcanvas-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:20px;

    border-bottom:1px solid rgba(255,255,255,.08);

}

.offcanvas-header .logo{

    color:#fff;

}

.offcanvas-header .logo img{

    width:44px;

    height:44px;

}

.offcanvas-header .logo span{

    color:#fff;

    font-size:24px;

}


/*==================================================
                CLOSE BUTTON
==================================================*/

.offcanvas .btn-close{

    filter:invert(1);

    opacity:1;

    box-shadow:none;

}

.offcanvas .btn-close:focus{

    box-shadow:none;

}


/*==================================================
                BODY
==================================================*/

.offcanvas-body{

    padding:22px;

}


/*==================================================
                LOGIN BUTTON
==================================================*/

.mobile-login{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    height:54px;

    border-radius:35px;

    background:#FFE44E;

    color:#111;

    text-decoration:none;

    font-size:16px;

    font-weight:600;

    transition:.30s;

}

.mobile-login:hover{

    background:#FFD500;

    color:#111;

}


/*==================================================
                FREE TEXT
==================================================*/

.free-text{

    margin:14px 0 30px;

    text-align:center;

    font-size:13px;

    color:#999;

}


/*==================================================
                SECTION TITLE
==================================================*/

.mobile-group h6{

    color:#888;

    font-size:12px;

    font-weight:700;

    letter-spacing:1px;

    margin-bottom:14px;

}


/*==================================================
                MOBILE LINKS
==================================================*/

.mobile-links{

    margin-top:25px;

}

.mobile-links a{

    display:flex;

    justify-content:space-between;

    align-items:center;

    color:#ddd;

    text-decoration:none;

    padding:15px 0;

    border-bottom:1px solid rgba(255,255,255,.08);

    transition:.30s;

}

.mobile-links a::after{

    content:"›";

    font-size:20px;

    color:#888;

}

.mobile-links a:hover{

    color:#FFE44E;

    padding-left:8px;

}

.mobile-links a:last-child{

    border-bottom:none;

}


/*==================================================
                SCROLLBAR
==================================================*/

.offcanvas-body::-webkit-scrollbar{

    width:5px;

}

.offcanvas-body::-webkit-scrollbar-thumb{

    background:#444;

    border-radius:30px;

}

.offcanvas-body::-webkit-scrollbar-track{

    background:transparent;

}


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

@media(max-width:576px){

.offcanvas{

    width:88%;

}

.offcanvas-header{

    padding:16px;

}

.offcanvas-body{

    padding:16px;

}

.mobile-login{

    font-size:15px;

    height:50px;

}

}

/*==================================================
            ACCORDION
==================================================*/

.accordion{

    --bs-accordion-bg:transparent;

    --bs-accordion-border-color:transparent;

}

.accordion-item{

    background:#1d1610;

    border:1px solid rgba(255,255,255,.08);

    border-radius:14px!important;

    overflow:hidden;

    margin-bottom:12px;

}

.accordion-button{

    background:#1d1610;

    color:#fff;

    font-size:15px;

    font-weight:500;

    box-shadow:none;

    padding:16px 18px;

}

.accordion-button:focus{

    box-shadow:none;

}

.accordion-button:not(.collapsed){

    background:#261b13;

    color:#FFE44E;

}

.accordion-button::after{

    filter:invert(1);

    transition:.3s;

}

.accordion-body{

    background:#130d08;

    display:flex;

    flex-direction:column;

    padding:8px 18px 16px;

}

.accordion-body a{

    color:#bbb;

    text-decoration:none;

    padding:10px 0;

    border-bottom:1px solid rgba(255,255,255,.05);

    transition:.3s;

}

.accordion-body a:last-child{

    border-bottom:none;

}

.accordion-body a:hover{

    color:#FFE44E;

    padding-left:8px;

}


/*==================================================
            HEADER SCROLL
==================================================*/

.main-header{

    transition:.35s;

}

.main-header.scrolled{

    background:#fff;

    box-shadow:0 8px 30px rgba(0,0,0,.12);

}


/*==================================================
            OFFCANVAS ANIMATION
==================================================*/

.offcanvas{

    transition:transform .35s ease-in-out;

}

.offcanvas.show .mobile-login{

    animation:fadeUp .4s ease;

}

.offcanvas.show .accordion-item{

    animation:fadeUp .45s ease;

}

.offcanvas.show .mobile-links a{

    animation:fadeUp .5s ease;

}


/*==================================================
            ANIMATION
==================================================*/

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(20px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}


/*==================================================
            DESKTOP FIX
==================================================*/

@media(min-width:992px){

.offcanvas{

    display:none!important;

}

.navbar-toggler{

    display:none!important;

}

.menu-area{

    display:flex!important;

}

}


/*==================================================
            MOBILE FIX
==================================================*/

@media(max-width:991.98px){

.menu-area{

    display:none!important;

}

.navbar{

    min-height:72px;

    flex-wrap:nowrap;

}

.logo{

    margin:0;

}

.logo img{

    width:42px;

    height:42px;

}

.logo span{

    font-size:22px;

}

.navbar-toggler{

    display:block!important;

}

}


/*==================================================
            SMALL MOBILE
==================================================*/

@media(max-width:480px){

.offcanvas{

    width:100%;

}

.logo span{

    font-size:20px;

}

.logo img{

    width:38px;

    height:38px;

}

.navbar{

    min-height:66px;

}

.mobile-login{

    height:48px;

    font-size:14px;

}

.mobile-links a{

    font-size:14px;

}

}

/*==========================
ABOUT BANNER
==========================*/

.about-banner {

  position: relative;

  margin-bottom: 180px;
}

.about-banner img {

  width: 100%;

  height: 720px;

  object-fit: cover;

  display: block;
}


/*==========================
COUNTER CARD
==========================*/

.about-counter {

  position: absolute;

  left: 50%;

  bottom: -70px;

  transform: translateX(-50%);

  width: 1100px;

  max-width: 90%;

  background: #f7f4f4;

  border-radius: 36px;

  display: flex;

  justify-content: space-between;

  align-items: center;

  padding: 45px 20px;

  box-shadow: 0 12px 35px rgba(0, 0, 0, .18);
}


/*==========================
BOX
==========================*/

.counter-box {

  flex: 1;

  text-align: center;

  position: relative;
}

.counter-box:not(:last-child)::after {

  content: "";

  position: absolute;

  right: 0;

  top: 50%;

  transform: translateY(-50%);

  width: 1px;

  height: 110px;

  background: #3b3b3b;
}


/*==========================
TEXT
==========================*/

.counter-box h2 {

  margin: 0;

  font-size: 22px;

  font-weight: 700;

  color: #111;

  line-height: 1;
}

.counter-box p {

  margin-top: 18px;

  font-size: 18px;

  font-weight: 400;

  color: #5e5e5e;
}


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

@media(max-width:991px) {

  .about-banner {

    margin-bottom: 260px;
  }

  .about-banner img {

    height: 420px;
  }

  .about-counter {

    width: 92%;

    flex-direction: column;

    gap: 40px;

    padding: 40px 20px;

    bottom: -180px;
  }

  .counter-box {

    width: 100%;
  }

  .counter-box:not(:last-child)::after {

    width: 80%;

    height: 1px;

    left: 50%;

    top: auto;

    bottom: -20px;

    transform: translateX(-50%);
  }

  .counter-box h2 {

    font-size: 38px;
  }

  .counter-box p {

    font-size: 20px;
  }

}

/*==========================
WHO WE ARE
===========================*/

.about-company-section {
  background: #fff;
}

.about-company-container {

  max-width: 1380px;

  margin: auto;

  text-align: center;
}

/*==========================
TITLE
===========================*/

.about-company-title {

  font-size: 34px;

  font-weight: 700;

  color: #000;

  letter-spacing: 3px;

  text-transform: uppercase;
}

.about-company-text-one {

  max-width: 1220px;

  margin: 0 auto 55px;

  font-size: 18px;

  line-height: 1.95;

  color: #000;

  font-weight: 400;
}

.about-company-text-two {

  max-width: 1220px;

  margin: 0 auto;

  font-size: 18px;

  line-height: 1.95;

  color: #000;

  font-weight: 400;
}

@media(max-width:1200px) {

  .about-company-title {

    font-size: 44px;
  }

  .about-company-text-one,
  .about-company-text-two {

    font-size: 22px;
  }

}

@media(max-width:768px) {

  .about-company-section {

    padding: 80px 0 70px;
  }

  .about-company-title {

    font-size: 34px;

    margin-bottom: 35px;
  }

  .about-company-text-one,
  .about-company-text-two {

    font-size: 18px;

    line-height: 1.8;

    margin-bottom: 30px;
  }

}
.what-do-container{
  width: 1220px;
}/*==================================
WHAT WE DO
==================================*/

.what-do-section{
    background:#f7f7f7;
    padding:90px 0;
    overflow:hidden;
}

.what-do-container{
    max-width:1220px;
    width:100%;
    margin:auto;
}

.what-do-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:60px;
}

.what-do-image,
.what-do-content{
    flex:1;
}

.what-do-image img{
    width:100%;
    display:block;
    border-radius:24px;
    object-fit:cover;
    box-shadow:0 10px 30px rgba(0,0,0,.12);
}

.what-do-content h2{
    font-size:34px;
    font-weight:700;
    color:#111;
    margin-bottom:22px;
    line-height:1.2;
}

.what-do-content p{
    font-size:18px;
    color:#555;
    line-height:1.9;
    margin:0;
}


/*==========================
Laptop
==========================*/

@media (max-width:1199px){

    .what-do-row{
        gap:45px;
    }

    .what-do-content h2{
        font-size:30px;
    }

    .what-do-content p{
        font-size:17px;
    }

}


/*==========================
Tablet
==========================*/

@media (max-width:991px){

    .what-do-section{
        padding:70px 0;
    }

    .what-do-row{
        flex-direction:column;
        gap:40px;
        text-align:center;
    }

    .what-do-image,
    .what-do-content{
        width:100%;
        max-width:700px;
    }

    .what-do-content h2{
        font-size:28px;
        margin-bottom:18px;
    }

    .what-do-content p{
        font-size:16px;
        line-height:1.8;
        text-align:center;
    }

}


/*==========================
Mobile
==========================*/

@media (max-width:767px){

    .what-do-section{
        padding:60px 0;
    }

    .what-do-row{
        gap:30px;
    }

    .what-do-image img{
        border-radius:18px;
    }

    .what-do-content h2{
        font-size:24px;
    }

    .what-do-content p{
        font-size:15px;
        line-height:1.7;
    }

}


/*==========================
Small Mobile
==========================*/

@media (max-width:480px){

    .what-do-section{
        padding:50px 0;
    }

    .what-do-content h2{
        font-size:22px;
    }

    .what-do-content p{
        font-size:14px;
        line-height:1.7;
    }

    .what-do-image img{
        border-radius:14px;
    }

}
/*==================================
MISSION & VISION
===================================*/

.mission-vision-section {

  background: #ffffff;

  padding: 110px 0;
}

/*==================================*/

.mission-vision-row {

  display: flex;

  justify-content: center;

  gap: 90px;

  flex-wrap: wrap;
}

/*==================================*/

.mission-card-box,
.vision-card-box {

  width: 560px;

  min-height: 355px;

  background: #ffffff;

  border-radius: 28px;

  padding: 65px 40px;

  box-shadow: 0 5px 18px rgba(0, 0, 0, .18);

  transition: .3s;
}

.mission-card-box:hover,
.vision-card-box:hover {

  transform: translateY(-5px);
}

/*==================================*/

.mission-card-title,
.vision-card-title {

  font-size: 30px;

  font-weight: 700;

  color: #000;

  text-align: center;

  margin-bottom: 38px;

  letter-spacing: .5px;
}

/*==================================*/

.mission-card-text,
.vision-card-text {

  font-size: 20px;

  line-height: 1.9;

  color: #222;

  font-weight: 400;

  margin: 0;
}

/*==================================*/

@media(max-width:991px) {

  .mission-vision-row {

    gap: 40px;
  }

  .mission-card-box,
  .vision-card-box {

    width: 100%;

    min-height: auto;

    padding: 45px 30px;
  }

  .mission-card-title,
  .vision-card-title {

    font-size: 28px;
  }

  .mission-card-text,
  .vision-card-text {

    font-size: 18px;

    line-height: 1.8;
  }

}/*==================================
WE GOT YOUR BACK
==================================*/

.back-support-section{
    background:#f7f7f7;
    padding:90px 0;
    overflow:hidden;
}

.back-container{
    max-width:1220px;
    width:100%;
    margin:auto;
}

.back-support-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:60px;
}

.back-support-content{
    flex:1;
}

.back-support-image{
    flex:1;
}

.back-support-image img{
    width:100%;
    display:block;
    border-radius:24px;
    object-fit:cover;
    box-shadow:0 10px 30px rgba(0,0,0,.12);
}

.back-support-title{
    font-size:34px;
    font-weight:700;
    color:#111;
    margin-bottom:25px;
    line-height:1.2;
}

.back-support-text{
    font-size:18px;
    line-height:1.9;
    color:#555;
    margin:0;
}


/*==========================
Laptop
==========================*/

@media (max-width:1199px){

.back-support-row{
    gap:45px;
}

.back-support-title{
    font-size:30px;
}

.back-support-text{
    font-size:17px;
}

}


/*==========================
Tablet
==========================*/

@media (max-width:991px){

.back-support-section{
    padding:70px 0;
}

.back-support-row{
    flex-direction:column-reverse;
    text-align:center;
    gap:40px;
}

.back-support-content,
.back-support-image{
    width:100%;
    max-width:700px;
}

.back-support-title{
    font-size:28px;
    margin-bottom:18px;
}

.back-support-text{
    font-size:16px;
    line-height:1.8;
    text-align:center;
}

}


/*==========================
Mobile
==========================*/

@media (max-width:767px){

.back-support-section{
    padding:60px 0;
}

.back-support-row{
    gap:30px;
}

.back-support-image img{
    border-radius:18px;
}

.back-support-title{
    font-size:24px;
}

.back-support-text{
    font-size:15px;
    line-height:1.7;
}

}


/*==========================
Small Mobile
==========================*/

@media (max-width:480px){

.back-support-section{
    padding:50px 0;
}

.back-support-title{
    font-size:22px;
}

.back-support-text{
    font-size:14px;
    line-height:1.7;
}

}
/*==================================
OUR STORY
===================================*/

.our-story-section {

  background: #ffffff;

  padding: 110px 0 120px;
}

/*==================================*/

.our-story-wrapper {

  max-width: 1220px;

  margin: auto;
}

/*==================================*/

.our-story-heading {

  font-size: 25px;

  font-weight: 700;

  color: #000;

  text-align: center;

  margin-bottom: 48px;

  letter-spacing: .5px;
}

/*==================================*/

.our-story-para-one {

  max-width: 1220px;

  margin: 0 auto 70px;

  text-align: center;

  color: #000;

  font-size: 18px;

  font-weight: 400;

  line-height: 2.05;
}

/*==================================*/

.our-story-para-two {

  max-width: 1220px;

  margin: 0 auto;

  text-align: center;

  color: #000;

  font-size: 18px;

  font-weight: 400;

  line-height: 2.05;
}

/*==================================
Responsive
===================================*/

@media(max-width:991px) {

  .our-story-section {

    padding: 70px 0;
  }

  .our-story-heading {

    font-size: 28px;

    margin-bottom: 35px;
  }

  .our-story-para-one,
  .our-story-para-two {

    font-size: 17px;

    line-height: 1.9;

    margin-bottom: 35px;
  }

}
/*==================================
WHY ASTROTALK
===================================*/

.why-astrotalk-section {

  background: #ffea00;

  padding: 75px 0 75px;
}

/*==================================*/

.why-astrotalk-wrapper {

  max-width: 1220px;

  margin: auto;
}

/*==================================*/

.why-astrotalk-title {

  text-align: center;

  font-size: 25px;

  font-weight: 700;

  color: #000;

  letter-spacing: 2px;

  margin-bottom: 25px;

  text-transform: uppercase;
}

/*==================================*/

.why-astrotalk-text {

  max-width: 1220px;

  margin: 0 auto;

  text-align: center;

  font-size: 18px;

  font-weight: 400;

  color: #000;

  line-height: 2.0;
}

/*==================================
Responsive
===================================*/

@media(max-width:991px) {

  .why-astrotalk-section {

    padding: 70px 0;
  }

  .why-astrotalk-title {

    font-size: 28px;

    margin-bottom: 35px;
  }

  .why-astrotalk-text {

    font-size: 17px;

    line-height: 1.9;
  }

}/*==================================
LIFE AT ASTROTALK
==================================*/

.life-gallery-section{
    padding:90px 0;
    background:#fff;
    overflow:hidden;
}

.life-container{
    max-width:1220px;
    width:100%;
    margin:auto;
}

.life-gallery-title{
    text-align:center;
    font-size:34px;
    font-weight:700;
    color:#111;
    margin-bottom:55px;
    text-transform:uppercase;
}

.life-gallery-grid{
    display:grid;
    grid-template-columns:1fr 1.4fr 1fr;
    gap:24px;
    align-items:stretch;
}


/*==========================
LEFT
==========================*/

.life-left{
    display:flex;
    flex-direction:column;
    gap:24px;
}

.life-left a{
    display:block;
}

.life-left img{
    width:100%;
    height:220px;
    object-fit:cover;
    border-radius:20px;
    transition:.35s;
}


/*==========================
CENTER
==========================*/

.life-center{
    height:100%;
}

.life-center a{
    display:block;
    height:100%;
}

.life-center img{
    width:100%;
    height:464px;
    object-fit:cover;
    border-radius:20px;
    transition:.35s;
}


/*==========================
RIGHT
==========================*/

.life-right{
    display:flex;
    flex-direction:column;
    gap:24px;
}

.life-right>a{
    display:block;
}

.life-right>a img{
    width:100%;
    height:280px;
    object-fit:cover;
    border-radius:20px;
    transition:.35s;
}

.life-right-bottom{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
}

.life-right-bottom img{
    width:100%;
    height:160px;
    object-fit:cover;
    border-radius:20px;
    transition:.35s;
}


/*==========================
HOVER
==========================*/

.life-gallery-grid a{
    overflow:hidden;
    border-radius:20px;
    display:block;
}

.life-gallery-grid img{
    width:100%;
    display:block;
    transition:.4s;
}

.life-gallery-grid a:hover img{
    transform:scale(1.06);
}


/*==========================
LAPTOP
==========================*/

@media (max-width:1199px){

.life-gallery-grid{
    gap:18px;
}

.life-center img{
    height:420px;
}

.life-left img{
    height:200px;
}

.life-right>a img{
    height:250px;
}

.life-right-bottom img{
    height:140px;
}

}


/*==========================
TABLET
==========================*/

@media (max-width:991px){

.life-gallery-section{
    padding:70px 0;
}

.life-gallery-title{
    font-size:30px;
    margin-bottom:40px;
}

.life-gallery-grid{
    grid-template-columns:1fr 1fr;
}

.life-center{
    grid-column:span 2;
}

.life-center img{
    height:420px;
}

.life-left img,
.life-right>a img{
    height:240px;
}

.life-right-bottom img{
    height:180px;
}

}


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

@media (max-width:767px){

.life-gallery-section{
    padding:60px 0;
}

.life-gallery-title{
    font-size:26px;
    margin-bottom:30px;
}

.life-gallery-grid{
    grid-template-columns:1fr;
    gap:18px;
}

.life-center{
    grid-column:auto;
}

.life-left,
.life-right{
    gap:18px;
}

.life-right-bottom{
    grid-template-columns:1fr 1fr;
    gap:18px;
}

.life-left img,
.life-center img,
.life-right>a img{
    height:250px;
}

.life-right-bottom img{
    height:150px;
}

}


/*==========================
SMALL MOBILE
==========================*/

@media (max-width:480px){

.life-gallery-title{
    font-size:22px;
}

.life-gallery-grid{
    gap:15px;
}

.life-left,
.life-right{
    gap:15px;
}

.life-right-bottom{
    grid-template-columns:1fr;
}

.life-left img,
.life-center img,
.life-right>a img,
.life-right-bottom img{
    height:220px;
    border-radius:16px;
}

}
/*=========================
OUR ASTROLOGERS
==========================*/

.our-astrologers-section {

  background: #ffe600;

  padding: 70px 0 90px;

}

.astro-heading {

  text-align: center;

  font-size:25px;

  font-weight: 700;

  color: #333;

  margin-bottom: 12px;
}

.astro-subheading {

  text-align: center;

  font-size: 20px;

  color: #666;

  margin-bottom: 55px;
}

/* Card */

.astro-card {

  background: #fff;

  border-radius: 18px;

  padding: 18px;

  border: 1px solid #ececec;

  text-align: center;

  transition: .35s;

  height: 275px;

  display: flex;

  flex-direction: column;

  justify-content: center;
}

.astro-card:hover {

  transform: translateY(-6px);

  box-shadow: 0 10px 30px rgba(0, 0, 0, .10);
}

/* Image */

.astro-card img {

  width: 155px;

  height: 155px;

  border-radius: 50%;

  object-fit: cover;

  margin: auto;

  transition: none;

  transform: none;

  box-shadow: none;
}

.astro-card:hover img {

  transform: none;

  box-shadow: none;
}

/* Name */

.astro-card h4 {

  margin-top: 22px;

  font-size: 20px;

  color: #444;

  font-weight: 700;

  margin-bottom: 8px;
}

/* Category */

.astro-card p {

  margin: 0;

  color: #666;

  font-size: 17px;
}

/* Swiper */

.astrologerSwiper {

  position: relative;

  padding: 0 70px;
}

/* Arrows */

.swiper-button-next,
.swiper-button-prev {

  width: 55px;

  height: 55px;

  border-radius: 50%;

  border: 4px solid #6b6b6b;

  background: #ffe600;

  color: #666;

  top: 50%;
}

.swiper-button-next:after,
.swiper-button-prev:after {

  font-size: 22px;

  font-weight: bold;
}

.swiper-button-next:hover,
.swiper-button-prev:hover {

  background: #fff25c;
}

.swiper-button-prev {

  left: 0;
}

.swiper-button-next {

  right: 0;
}

@media(max-width:991px) {

  .astro-heading {

    font-size: 36px;

  }

  .astro-subheading {

    font-size: 18px;

  }

  .astrologerSwiper {

    padding: 0 45px;

  }

}
/*=========================
FOOTER
=========================*/

.astro-footer{

background:#081633;

padding:60px 0 20px;

border-top:1px solid rgba(212,175,55,.18);

}

/*=========================
TOP
=========================*/

.footer-top{

text-align:center;

padding-bottom:40px;

border-bottom:1px solid rgba(255,255,255,.08);

}

.footer-logo{

display:flex;

justify-content:center;

align-items:center;

gap:15px;

margin-bottom:20px;

}

.footer-logo img{

width:60px;

height:60px;

border-radius:50%;

object-fit:cover;

}

.footer-logo h2{

margin:0;

font-size:32px;

color:#fff;

font-weight:700;

}

.footer-top p{

max-width:760px;

margin:auto;

font-size:17px;

line-height:1.9;

color:#d7e0ee;

}

/*=========================
GRID
=========================*/

.footer-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:60px;

padding:45px 0;

}

.footer-grid h3{

color:#D4AF37;

font-size:23px;

margin-bottom:20px;

}

.footer-grid ul{

list-style:none;

padding:0;

margin:0;

}

.footer-grid li{

margin-bottom:14px;

font-size:17px;

color:#d7e0ee;

}

.footer-grid a{

color:#d7e0ee;

text-decoration:none;

transition:.3s;

}

.footer-grid a:hover{

color:#D4AF37;

padding-left:5px;

}

/*=========================
SOCIAL
=========================*/

.footer-social{

display:flex;

gap:15px;

margin-top:15px;

}

.footer-social a{

width:46px;

height:46px;

display:flex;

justify-content:center;

align-items:center;

border-radius:50%;

background:#102B5C;

color:#fff;

border:1px solid rgba(212,175,55,.25);

transition:.3s;

}

.footer-social a:hover{

background:#D4AF37;

color:#081633;

transform:translateY(-5px);

}

/*=========================
COPYRIGHT
=========================*/

.footer-copy{

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

padding-top:20px;

text-align:center;

}

.footer-copy p{

margin:0;

color:#c6d0df;

font-size:15px;

}

.footer-copy a{

color:#D4AF37;

text-decoration:none;

font-weight:600;

}

.footer-copy a:hover{

color:#F2D27A;

}

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

@media(max-width:991px){

.footer-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.footer-grid{

grid-template-columns:1fr;

text-align:center;

gap:35px;

}

.footer-social{

justify-content:center;

}

.footer-logo{

flex-direction:column;

}

.footer-logo h2{

font-size:28px;

}

.footer-top p{

font-size:15px;

}

}
/*=========================
FOOTER PART 1
==========================*/

/*.astro-footer {*/

/*  background: #464646;*/

/*  padding: 45px 0 30px;*/

/*}*/

/*.footer-about-box {*/

/*  margin-bottom: 25px;*/

/*}*/

/*.footer-title {*/

/*  font-size: 24px;*/

/*  color: #fff;*/

/*  font-weight: 700;*/

/*  margin-bottom: 14px;*/

/*  display: inline-block;*/

/*  padding-bottom: 8px;*/

/*  border-bottom: 3px solid #e8d71b;*/

/*}*/

/*.footer-about-text {*/

/*  font-size: 18px;*/

/*  color: #ececec;*/

/*  line-height: 2;*/

/*  margin: 0;*/

/*}*/

/*.footer-divider {*/

/*  border-color: #666;*/

/*  margin: 30px 0 20px;*/

/*}*/

/*.footer-grid {*/

/*  display: grid;*/

/*  grid-template-columns: repeat(4, 1fr);*/

/*  gap: 60px;*/

/*}*/

/*.footer-heading {*/

/*  font-size: 24px;*/

/*  color: #fff;*/

/*  font-weight: 700;*/

/*  margin-bottom: 22px;*/

/*  display: inline-block;*/

/*  border-bottom: 3px solid #e8d71b;*/

/*  padding-bottom: 8px;*/

/*}*/

/*.footer-list {*/

/*  list-style: none;*/

/*  margin: 0;*/

/*  padding: 0;*/

/*}*/

/*.footer-list li {*/

/*  margin-bottom: 18px;*/

/*}*/

/*.footer-list a {*/

/*  text-decoration: none;*/

/*  color: #ececec;*/

/*  font-size: 18px;*/

/*  transition: none;*/
/*}*/

/* Hover bilkul nahi */

/*.footer-list a:hover {*/

/*  color: #ececec;*/

/*}*/

/*@media(max-width:991px) {*/

/*  .footer-grid {*/

/*    grid-template-columns: repeat(2, 1fr);*/

/*    gap: 40px;*/

/*  }*/

/*}*/

/*@media(max-width:576px) {*/

/*  .footer-grid {*/

/*    grid-template-columns: 1fr;*/

/*  }*/

/*  .footer-about-text {*/

/*    font-size: 16px;*/

/*  }*/

/*  .footer-heading {*/

/*    font-size: 22px;*/

/*  }*/

/*}*/





/*=========================
FOOTER PART 2
==========================*/

/*.footer-bottom-area {*/

/*  background: #464646;*/

/*  padding: 15px 0 0;*/

/*}*/

/*.footer-bottom-grid {*/

/*  display: grid;*/

/*  grid-template-columns: repeat(4, 1fr);*/

/*  gap: 55px;*/

/*}*/

/*.footer-box-title {*/

/*  color: #fff;*/

/*  font-size: 24px;*/

/*  font-weight: 700;*/

/*  display: inline-block;*/

/*  border-bottom: 3px solid #e7d718;*/

/*  padding-bottom: 8px;*/

/*  margin-bottom: 22px;*/

/*}*/

/*.footer-space {*/

/*  margin-top: 30px;*/

/*}*/

/*.footer-box-list {*/

/*  list-style: none;*/

/*  padding: 0;*/

/*  margin: 0;*/

/*}*/

/*.footer-box-list li {*/

/*  margin-bottom: 18px;*/

/*}*/

/*.footer-box-list a {*/

/*  color: #ececec;*/

/*  text-decoration: none;*/

/*  font-size: 18px;*/

/*}*/

/*.footer-contact-line {*/

/*  color: #ececec;*/

/*  font-size: 18px;*/

/*  line-height: 1.8;*/

/*}*/

/*.footer-contact-line span {*/

/*  color: #ffe600;*/

/*}*/

/*.footer-mail {*/

/*  color: #fff;*/

/*  font-size: 18px;*/

/*  text-decoration: none;*/

/*}*/

/*.footer-social-icons {*/

/*  display: flex;*/

/*  gap: 18px;*/

/*  margin: 30px 0;*/

/*}*/

/*.footer-social-icons a {*/

/*  width: 48px;*/

/*  height: 48px;*/

/*  border-radius: 50%;*/

/*  display: flex;*/

/*  align-items: center;*/

/*  justify-content: center;*/

/*  font-size: 22px;*/

/*  color: #fff;*/

/*}*/

/*.footer-social-icons a:nth-child(1) {*/

/*  background: #3b5998;*/

/*}*/

/*.footer-social-icons a:nth-child(2) {*/

/*  background: #e1306c;*/

/*}*/

/*.footer-social-icons a:nth-child(3) {*/

/*  background: #0077b5;*/

/*}*/

/*.footer-social-icons a:nth-child(4) {*/

/*  background: #ff0000;*/

/*}*/

/*.secure-item {*/

/*  display: flex;*/

/*  align-items: center;*/

/*  gap: 15px;*/

/*  margin-bottom: 22px;*/

/*}*/

/*.secure-icon {*/

/*  width: 62px;*/

/*  height: 62px;*/

/*  border-radius: 18px;*/

/*  background: #fff;*/

/*  display: flex;*/

/*  align-items: center;*/

/*  justify-content: center;*/

/*  font-size: 24px;*/

/*  color: #444;*/

/*}*/

/*.secure-item span {*/

/*  color: #ececec;*/

/*  font-size: 18px;*/

/*}*/

/*.store-buttons {*/

/*  display: flex;*/

/*  gap: 12px;*/

/*  margin-top: 30px;*/

/*}*/

/*.store-buttons img {*/

/*  width: 150px;*/

/*}*/

/*.copyright-section {*/

/*  background: #000;*/

/*  color: #fff;*/

/*  text-align: center;*/

/*  padding: 20px;*/

/*  font-size: 18px;*/

/*}*/

/*@media(max-width:991px) {*/

/*  .footer-bottom-grid {*/

/*    grid-template-columns: repeat(2, 1fr);*/

/*  }*/

/*}*/

/*@media(max-width:576px) {*/

/*  .footer-bottom-grid {*/

/*    grid-template-columns: 1fr;*/

/*  }*/

/*  .store-buttons {*/

/*    flex-direction: column;*/

/*  }*/

/*}*/
/*.copyright-section a {*/
/*  color: #fff;*/
/*  text-decoration: none;*/
/*  font-weight: 600;*/
/*}*/

/*.copyright-section a:hover {*/
/*  text-decoration: underline;*/
/*}*/
/*.footer-social-icons a {*/

/*  transition: .35s;*/

/*}*/

/*.footer-social-icons a:hover {*/

/*  transform: translateY(-6px) scale(1.08);*/

/*  box-shadow: 0 10px 20px rgba(0, 0, 0, .30);*/

/*}*/
/*.footer-box-title a {*/

/*  color: #fff;*/

/*  text-decoration: none;*/

/*}*/

/*.footer-box-title a:hover {*/

/*  color: #fff;*/

/*}*/
.chat-support-box {

  cursor: pointer;

  transition: .3s;

}

.chat-support-box:hover {

  color: #ffffff;

}

.chat-support-box:hover span {

  color: #ffe600;

  text-decoration: underline;

}
/*=========================
LOGIN MODAL
==========================*/

#chatModal .modal-dialog {

  max-width: 480px;

}

#chatModal .modal-content {

  border: none;

  border-radius: 18px;

  overflow: hidden;

  box-shadow: 0 20px 60px rgba(0, 0, 0, .35);

}

/* Header */

#chatModal .modal-header {

  background: #ffe600 !important;

  border: none;

  padding: 18px 25px;

}

#chatModal .modal-title {

  width: 100%;

  text-align: center;

  font-size: 22px;

  font-weight: 700;

  color: #222;

}

#chatModal .btn-close {

  font-size: 18px;

  opacity: 1;

  box-shadow: none;

}

/* Body */

#chatModal .modal-body {

  padding: 15px 40px;

}

#chatModal .modal-body p {

  font-size: 17px;

  color: #555;

  line-height: 1.6;

}

#chatModal label {

  font-size: 16px;

  color: #444;

  margin-bottom: 10px;

}

/* Phone Input */

#chatModal .input-group {

  background: #f3f3f3;

  border-radius: 14px;

  overflow: hidden;

}

#chatModal .input-group-text {

  background: #f3f3f3;

  border: none;

  font-size: 18px;

  color: #555;

  padding: 16px;

}

#chatModal .form-control {

  border: none;

  background: #f3f3f3;

  box-shadow: none;

  font-size: 17px;

  height: 56px;

}

/* OTP Button */

#chatModal .btn-warning {

  background: #ffe600;

  border: none;

  height: 56px;

  border-radius: 14px;

  font-size: 20px;

  font-weight: 600;

  color: #111;

  transition: .3s;

}

#chatModal .btn-warning:hover {

  background: #ffd500;

}

#chatModal .btn-warning i {

  float: right;

  margin-top: 3px;

}

/* OR */

.modal-or {

  display: flex;

  align-items: center;

  gap: 15px;

  margin: 30px 0;

}

.modal-or::before,

.modal-or::after {

  content: "";

  flex: 1;

  height: 1px;

  background: #ddd;

}

/* Google Button */

.google-btn {

  height: 56px;

  border-radius: 12px;

  border: 1px solid #ddd;

  background: #fff;

  width: 100%;

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 12px;

  font-size: 20px;

  color: #333;

  transition: .3s;

}

.google-btn:hover {

  background: #fafafa;

}

/* Terms */

.modal-terms {

  margin-top: 30px;

  font-size: 16px;

  color: #555;

  line-height: 1.7;

}

.modal-terms a {

  color: #2f67c7;

  text-decoration: none;

}

.modal-terms a:hover {

  text-decoration: underline;

}

/* Responsive */

@media(max-width:576px) {

  #chatModal .modal-body {

    padding: 25px;

  }

  #chatModal .modal-title {

    font-size: 22px;

  }

}
/* Modal Header ke upar aaye */

#chatModal {
  z-index: 10050;
}

#chatModal+.modal-backdrop,
.modal-backdrop {
  z-index: 10040;
}
/*==========================================
ABOUT PAGE PREMIUM NAVY + GOLD OVERRIDE
==========================================*/

/*=====================
HEADER
======================*/

.main-header{
    background:#081633 !important;
    border-bottom:1px solid rgba(212,175,55,.18)!important;
    box-shadow:0 8px 30px rgba(0,0,0,.18)!important;
}

.main-header.scrolled{
    background:#081633!important;
}

.logo span{
    color:#fff!important;
}

.menu-link{
    color:#D7DFEC!important;
}

.menu-link:hover{
    color:#D4AF37!important;
}

.menu-link::before{
    background:#D4AF37!important;
}

.login-btn{
    background:linear-gradient(135deg,#D4AF37,#F2D27A)!important;
    color:#081633!important;
}

.login-btn:hover{
    background:#D4AF37!important;
}

.navbar-toggler{
    color:#fff!important;
}

/*=====================
DESKTOP DROPDOWN
======================*/

.astro-dropdown{

    background:#102B5C!important;

    border-bottom:4px solid #D4AF37!important;

    box-shadow:0 18px 40px rgba(0,0,0,.35);

}

.astro-dropdown .dropdown-item{

    color:#D9E2EF!important;

}

.astro-dropdown .dropdown-item:hover{

    background:#16386E!important;

    color:#D4AF37!important;

}

/*=====================
OFFCANVAS
======================*/

.offcanvas{

    background:#081633!important;

}

.mobile-login{

    background:linear-gradient(135deg,#D4AF37,#F2D27A)!important;

    color:#081633!important;

}

.mobile-links a{

    color:#D6DEEA!important;

}

.mobile-links a:hover{

    color:#D4AF37!important;

}

.accordion-item{

    background:#102B5C!important;

    border-color:rgba(212,175,55,.18)!important;

}

.accordion-button{

    background:#102B5C!important;

    color:#fff!important;

}

.accordion-button:not(.collapsed){

    background:#16386E!important;

    color:#D4AF37!important;

}

.accordion-body{

    background:#081633!important;

}

.accordion-body a{

    color:#D8E1EE!important;

}

.accordion-body a:hover{

    color:#D4AF37!important;

}

/*=====================
ABOUT BANNER
======================*/

.about-counter{

    background:linear-gradient(180deg,#102B5C,#0D2349)!important;

    border:1px solid rgba(212,175,55,.18)!important;

}

.counter-box:not(:last-child)::after{

    background:rgba(212,175,55,.18)!important;

}

.counter-box h2{

    color:#D4AF37!important;

}

.counter-box p{

    color:#cfdef4 !important

}

/*=====================
WHO WE ARE
======================*/

.about-company-section{

    background:transparent!important;

}

.about-company-text-one,
.about-company-text-two{

    color:#4e5f78 !important;

}

/*=====================
WHAT WE DO
======================*/

.what-do-section{

    background:transparent!important;

}

.what-do-content p{

    color:#4e5f78 !important;

}

.what-do-image img{

    box-shadow:0 20px 45px rgba(0,0,0,.25)!important;

}

/*=====================
MISSION & VISION
======================*/

.mission-vision-section{

    background:transparent!important;

}

.mission-card-box,
.vision-card-box{

    background:linear-gradient(180deg,#102B5C,#0D2349)!important;

    border:1px solid rgba(212,175,55,.18)!important;

    box-shadow:0 18px 35px rgba(0,0,0,.22)!important;

}

.mission-card-title,
.vision-card-title{

    color:#D4AF37!important;

}

.mission-card-text,
.vision-card-text{

    color:#D7DFEC!important;

}

/*=====================
WE GOT YOUR BACK
======================*/

.back-support-section{

    background:transparent!important;

}


.back-support-text{

    color:#4e5f78 !important;

}

.back-support-image img{

    box-shadow:0 18px 40px rgba(0,0,0,.25)!important;

}

/*=====================
OUR STORY
======================*/

.our-story-section{

    background:transparent!important;

}

.our-story-heading{

    color:#D4AF37!important;

}

.our-story-para-one,
.our-story-para-two{

    color:#4e5f78  !important;

}

/*=====================
WHY ASTROTALK
======================*/

.why-astrotalk-section{

    background:linear-gradient(135deg,#102B5C,#163A74)!important;

}

.why-astrotalk-title{

    color:#D4AF37!important;

}

.why-astrotalk-text{

    color:#EEF2F8!important;

}

/*=====================
LIFE GALLERY
======================*/

.life-gallery-section{

    background:transparent!important;

}

.life-gallery-grid a{

    border:1px solid rgba(212,175,55,.12)!important;

}

.life-gallery-grid a:hover{

    box-shadow:0 15px 35px rgba(212,175,55,.18);

}

/*=====================
OUR ASTROLOGERS
======================*/

.our-astrologers-section{

    background:transparent!important;

}

.astro-subheading{

    color:#4e5f78 !important;

}

.astro-card{

    background:linear-gradient(180deg,#102B5C,#0D2349)!important;

    border:1px solid rgba(212,175,55,.18)!important;

}

.astro-card:hover{

    border-color:#D4AF37!important;

}

.astro-card h4{

    color:#fff!important;

}

.astro-card p{

    color:#D4AF37!important;

}

.swiper-button-next,
.swiper-button-prev{

    background:#102B5C!important;

    border-color:#D4AF37!important;

    color:#D4AF37!important;

}

.swiper-button-next:hover,
.swiper-button-prev:hover{

    background:#D4AF37!important;

    color:#081633!important;

}


/*==================================
CUSTOMER CARE
==================================*/

.customer-care-section {

  background: #ebd402;

  padding: 70px 0;
}

.customer-care-container {

  max-width: 1220px;
}

/* Row */

.customer-care-row {

  display: flex;

  justify-content: space-between;

  align-items: center;
}

/* Left */

.customer-care-content {

  width: 55%;
}

/* Title */

.customer-care-title {

  font-size: 22px;

  font-weight: 700;

  color: #000;

  margin-bottom: 16px;
}

/* White Line */

.customer-care-line {

  width: 250px;

  height: 9px;

  background: #fff;

  margin-bottom: 25px;
}

/* Text */

.customer-care-text {

  font-size: 22px;

  font-weight: 700;

  color: #333;

  line-height: 1.5;

  margin: 0;
}

/* Right */

.customer-care-image {

  width: 200px;

  text-align: right;
}

.customer-care-image img {

  width: 200px;

  height: 200px;

  object-fit: contain;
}

/* Responsive */

@media(max-width:991px) {

  .customer-care-row {

    flex-direction: column;

    text-align: center;

    gap: 40px;
  }

  .customer-care-content {

    width: 100%;
  }

  .customer-care-line {

    margin: 0 auto 40px;
  }

  .customer-care-image {

    width: 100%;

    text-align: center;
  }

  .customer-care-image img {

    width: 180px;

    height: 180px;
  }

  .customer-care-title {

    font-size: 24px;
  }

  .customer-care-text {

    font-size: 22px;
  }

}
/*=====================================
CONTACT SECTION
======================================*/

.contact-section {

  padding: 65px 0 80px;

  background: #ffffff;
}

/*=====================================
TITLE
======================================*/

.contact-title {

  font-size: 25px;

  font-weight: 700;

  color: #222;

  text-align: center;

  margin-bottom: 10px;
}

/*=====================================
CONTACT INFO
======================================*/

.contact-info {

  width: 100%;

  max-width: 600px;
}

/*=====================================
HEADING
======================================*/

.contact-heading {

  font-size: 20px;

  font-weight: 500;

  color: #222;

  margin-bottom: 10px;
}

/*=====================================
TEXT
======================================*/

.contact-info p {

  font-size: 16px;

  color: #555;

  line-height: 2.2;

  margin-bottom: 0;
}

/*=====================================
EMAIL LINK
======================================*/

.contact-info a {

  color: #555;

  text-decoration: none;

  transition: .3s;
}

.contact-info a:hover {

  color: #111;
}

/*=====================================
PROFILE TITLE
======================================*/

.profile-heading {

  font-size: 24px;

  font-weight: 700;

  color: #222;

  margin-top: 70px;

  margin-bottom: 28px;
}

/*=====================================
SOCIAL ICONS
======================================*/

.profile-icons {

  display: flex;

  align-items: center;

  gap: 22px;
}

.profile-icons a {

  width: 56px;

  height: 56px;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  text-decoration: none;

  font-size: 28px;

  color: #fff;

  transition: .3s;
}

.profile-icons a:nth-child(1) {

  background: #1877f2;
}

.profile-icons a:nth-child(2) {

  background: linear-gradient(45deg, #f9ce34, #ee2a7b, #6228d7);
}

.profile-icons a:nth-child(3) {

  background: #ff0000;
}

.profile-icons a:nth-child(4) {

  background: #0077b5;
}

.profile-icons a:hover {

  transform: translateY(-5px);
}

/*=====================================
BUTTON AREA
======================================*/

.contact-btn-area {

  display: flex;

  justify-content: center;

  margin-top: 90px;
}

/*=====================================
BUTTON
======================================*/

.support-btn {

  background: #ffe600ee;

  border: none;

  border-radius: 12px;

  padding: 16px 38px;

  font-size: 22px;

  font-weight: 500;

  color: #444;

  cursor: pointer;

  transition: .3s;
}

.support-btn:hover {

  background: #ffd800;
}

.support-btn i {

  margin-right: 10px;
}

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

@media(max-width:992px) {

  .contact-section {

    padding: 60px 0;
  }

  .contact-title {

    font-size: 36px;

    margin-bottom: 50px;
  }

  .contact-heading {

    font-size: 22px;
  }

  .contact-info p {

    font-size: 18px;
  }

  .profile-heading {

    font-size: 22px;

    margin-top: 50px;
  }

  .profile-icons {

    gap: 16px;
  }

  .profile-icons a {

    width: 50px;

    height: 50px;

    font-size: 24px;
  }

  .contact-btn-area {

    margin-top: 60px;
  }

  .support-btn {

    width: 100%;

    max-width: 380px;

    font-size: 18px;

    padding: 14px 20px;
  }
}
.contact-btn-area {

  display: flex;

  justify-content: center;

  margin: 30px 0 45px;
}

.support-btn {

  background: #ffe600;
  border-radius: 12px;

  padding: 9px 20px;

  font-size: 15px;

  font-weight: 500;

  color: #444;

  cursor: pointer;

  transition: .3s;
}

.support-btn:hover {

  background: #ffd800;
}
.contact-info {
  max-width: 600px;
}

.contact-btn-area {
  width: 100%;
  display: flex;
  justify-content: center;
}

.profile-area {
  max-width: 600px;
}

.profile-heading {
  font-size: 24px;
  font-weight: 700;
  color: #222;
  margin-bottom: 25px;
}

.profile-icons {
  display: flex;
  gap: 22px;
}
/*=====================================
SERVICE HERO
=====================================*/

.service-hero {

  padding: 90px 0;

  background:
    radial-gradient(circle at right,
      rgba(255, 230, 0, .22) 0%,
      rgba(255, 255, 255, .95) 55%,
      #fff 100%);

  overflow: hidden;
}

/*=====================================
LEFT
=====================================*/

.service-subtitle {

  display: block;

  color: #ffbf00;

  font-size: 22px;

  font-weight: 700;

  letter-spacing: 1px;

  margin-bottom: 18px;
}

.service-title {

  font-size: 68px;

  font-weight: 800;

  line-height: 1.1;

  color: #222;

  margin-bottom: 28px;
}

.service-text {

  font-size: 23px;

  line-height: 1.8;

  color: #555;

  max-width: 520px;

  margin-bottom: 40px;
}

/*=====================================
BUTTONS
=====================================*/

.service-btns {

  display: flex;

  gap: 18px;

  flex-wrap: wrap;
}

.chat-btn {

  background: #ffe600;

  color: #222;

  border: 2px solid #ffe600;

  padding: 15px 36px;

  border-radius: 10px;

  font-size: 20px;

  font-weight: 600;

  text-decoration: none;

  transition: .3s;
}

.chat-btn:hover {

  background: #ffd500;

  color: #222;
}

.calls-btn {

  background: #fff;

  color: #222;

  border: 2px solid #999;

  padding: 15px 36px;

  border-radius: 10px;

  font-size: 20px;

  font-weight: 600;

  text-decoration: none;

  transition: .3s;
}

.call-btn:hover {

  border-color: #222;

  color: #222;
}

.chat-btn i,
.call-btn i {

  margin-right: 10px;
}

/*=====================================
IMAGE
=====================================*/

.service-wheel {

  width: 100%;

  max-width: 560px;

  animation: rotateWheel 45s linear infinite;
}

@keyframes rotateWheel {

  from {

    transform: rotate(0deg);

  }

  to {

    transform: rotate(360deg);

  }

}

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

@media(max-width:991px) {

  .service-hero {

    padding: 70px 0;

    text-align: center;

  }

  .service-title {

    font-size: 48px;

  }

  .service-text {

    margin: auto;

    font-size: 18px;

    margin-bottom: 30px;

  }

  .service-btns {

    justify-content: center;

  }

  .service-wheel {

    margin-top: 45px;

    max-width: 380px;

  }

}

@media(max-width:576px) {

  .service-title {

    font-size: 38px;

  }

  .service-subtitle {

    font-size: 18px;

  }

  .chat-btn,
  .call-btn {

    width: 100%;

    justify-content: center;

    display: flex;

  }

}
.popular-services {
  padding: 100px 0;
  background: #fffdf6;
}

.service-heading {
  text-align: center;
  margin-bottom: 60px;
}

.sub-title {
  color: #f4b400;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.service-heading h2 {
  font-size: 42px;
  font-weight: 700;
  margin: 10px 0;
}

.service-heading p {
  color: #666;
  font-size: 18px;
}

.service-card {

  background: #fff;

  border-radius: 18px;

  overflow: hidden;

  box-shadow: 0 10px 35px rgba(0, 0, 0, .08);

  transition: .35s;

  height: 100%;
}

.service-card:hover {

  transform: translateY(-10px);

  box-shadow: 0 18px 45px rgba(0, 0, 0, .18);
}

.service-image {

  position: relative;
}

.service-image img {

  width: 100%;

  height: 220px;

  object-fit: cover;
}

.service-tag {

  position: absolute;

  top: 15px;

  left: 15px;

  background: #FFD600;

  color: #222;

  padding: 6px 14px;

  border-radius: 30px;

  font-size: 13px;

  font-weight: 700;
}

.service-content {

  padding: 25px;
}

.rating {

  color: #ffb400;

  font-size: 16px;

  margin-bottom: 12px;
}

.rating span {

  color: #777;

  margin-left: 8px;

  font-size: 14px;
}

.service-content h3 {

  font-size: 20px;

  font-weight: 700;

  margin-bottom: 12px;
}

.service-content p {

  color: #666;
  font-size: 14px;
  line-height: 28px;

  margin-bottom: 20px;
}

.service-list {

  padding: 0;

  list-style: none;

  margin-bottom: 20px;
}

.service-list li {

  margin-bottom: 10px;

  color: #555;

  font-size: 15px;
}

.service-list i {

  color: #28a745;

  margin-right: 8px;
}

.price {

  font-size: 28px;

  color: #111;

  font-weight: 700;

  margin-bottom: 20px;
}

.price span {

  font-size: 15px;

  color: #777;

  font-weight: 500;
}
.service-buttons {
  display: flex;
  gap: 12px;
  margin-top: 20px;
}

.call-btn,
.whatsapp-btn {

  flex: 1;

  height: 52px;

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 8px;

  border-radius: 10px;

  text-decoration: none;

  font-size: 18px;

  font-weight: 600;

  white-space: nowrap;

  padding: 0 15px;

  transition: .3s;
}

.call-btn {

  background: #FFD600;

  color: #222;

  border: 2px solid #FFD600;
}

.call-btn:hover {

  background: #ffca00;

  color: #222;
}

.whatsapp-btn {

  background: #25D366;

  color: #fff;

  border: 2px solid #25D366;
}

.whatsapp-btn:hover {

  background: #1fb85a;

  color: #fff;
}

.call-btn i,
.whatsapp-btn i {

  font-size: 18px;

  margin: 0;
}
/*========================================
TABLET (992px)
========================================*/
@media (max-width:991px) {

  .popular-services {
    padding: 70px 0;
  }

  .service-heading {
    margin-bottom: 45px;
  }

  .service-heading h2 {
    font-size: 34px;
  }

  .service-heading p {
    font-size: 16px;
  }

  .service-card {
    margin-bottom: 10px;
  }

  .service-image img {
    height: 220px;
  }

  .service-content {
    padding: 20px;
  }

  .service-content h3 {
    font-size: 22px;
  }

  .rating {
    font-size: 15px;
  }

  .rating span {
    font-size: 13px;
  }

  .service-content p {
    font-size: 15px;
    line-height: 26px;
  }

  .price {
    font-size: 24px;
  }

  .call-btn,
  .whatsapp-btn {

    font-size: 16px;

    height: 48px;

    padding: 0 10px;
  }

}

/*========================================
MOBILE (768px)
========================================*/
@media (max-width:767px) {

  .popular-services {
    padding: 60px 0;
  }

  .service-heading {
    margin-bottom: 35px;
  }

  .sub-title {
    font-size: 14px;
  }

  .service-heading h2 {
    font-size: 28px;
  }

  .service-heading p {
    font-size: 15px;
  }

  .service-image img {
    height: 200px;
  }

  .service-tag {

    font-size: 12px;

    padding: 5px 12px;
  }

  .service-content {
    padding: 18px;
  }

  .service-content h3 {
    font-size: 22px;
  }

  .rating {
    font-size: 14px;
  }

  .rating span {
    display: block;
    margin-left: 0;
    margin-top: 5px;
  }

  .service-content p {

    font-size: 15px;

    line-height: 25px;
  }

  .service-list li {

    font-size: 14px;
  }

  .price {

    font-size: 24px;
  }

  .price span {

    font-size: 14px;
  }

  .service-buttons {

    flex-direction: column;

    gap: 10px;
  }

  .call-btn,
  .whatsapp-btn {

    width: 100%;

    font-size: 16px;

    height: 48px;
  }

}

/*========================================
SMALL MOBILE (576px)
========================================*/
@media (max-width:575px) {

  .popular-services {
    padding: 50px 0;
  }

  .service-heading h2 {
    font-size: 24px;
  }

  .service-heading p {
    font-size: 14px;
  }

  .service-card {
    border-radius: 15px;
  }

  .service-image img {
    height: 190px;
  }

  .service-content {
    padding: 16px;
  }

  .service-content h3 {
    font-size: 20px;
  }

  .service-content p {
    font-size: 14px;
    line-height: 24px;
  }

  .service-list li {
    font-size: 13px;
  }

  .price {
    font-size: 22px;
  }

  .call-btn,
  .whatsapp-btn {

    font-size: 15px;

    height: 46px;
  }

}
      .floating-call{

    position:fixed;

    right:20px;

    bottom:90px;

    width:60px;

    height:60px;

    background:#FFD600;

    color:#111;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:24px;

    z-index:9999;

    text-decoration:none;

    box-shadow:0 8px 20px rgba(0,0,0,.25);

}

.floating-call:hover{

    color:#111;

    transform:scale(1.08);

}
.floating-whatsapp{

    position:fixed;

    right:20px;

    bottom:20px;

    width:60px;

    height:60px;

    background:#25D366;

    color:#fff;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:28px;

    z-index:9999;

    text-decoration:none;

    box-shadow:0 8px 20px rgba(0,0,0,.25);

}

.floating-whatsapp:hover{

    color:#fff;

    transform:scale(1.08);

}
.scroll-toggle-btn{

    position:fixed;

    left:20px;

    bottom:20px;

    width:55px;

    height:55px;

    border:none;

    border-radius:50%;

    background:#FFD600;

    color:#111;

    font-size:22px;

    cursor:pointer;

    z-index:9999;

    box-shadow:0 8px 20px rgba(0,0,0,.20);

    transition:.3s;

}

.scroll-toggle-btn:hover{

    transform:scale(1.08);

    background:#ffca00;

}

@media(max-width:768px){

.scroll-toggle-btn{

    width:48px;

    height:48px;

    left:15px;

    bottom:15px;

    font-size:18px;

}

}
@media (max-width:400px) {

  .service-heading h2 {
    font-size: 22px;
  }

  .service-content h3 {
    font-size: 18px;
  }

  .price {
    font-size: 20px;
  }

  .call-btn,
  .whatsapp-btn {

    font-size: 14px;

    height: 44px;
  }

  .call-btn i,
  .whatsapp-btn i {

    font-size: 15px;
  }

}
.service-container,
.popular-container{
    max-width:1220px;
    width:100%;
    margin:auto;
}
.customer-care-section{

    background:linear-gradient(135deg,#102B5C,#163A74)!important;

}

.customer-care-title{

    color:#D4AF37!important;

}

.customer-care-line{

    background:#D4AF37!important;

}

.customer-care-text{

    color:#EEF2F8!important;

}

/*=====================
CONTACT
======================*/

.contact-section{

    background:transparent!important;

}


.contact-heading{

    color:#D4AF37!important;

}

.contact-info p{

    color:#536a8a  !important;

}

.contact-info a{

    color:#536a8a !important;

}

.contact-info a:hover{

    color:#D4AF37!important;

}
/* Social Icons */

.profile-icons a{

    border:2px solid rgba(212,175,55,.18)!important;

    box-shadow:0 10px 25px rgba(0,0,0,.15);

}

.profile-icons a:hover{

    transform:translateY(-6px);

}

/* Support Button */

.support-btn{

    background:linear-gradient(135deg,#D4AF37,#F2D27A)!important;

    color:#081633!important;

    border:none!important;

    box-shadow:0 10px 25px rgba(212,175,55,.30);

}

.support-btn:hover{

    background:#D4AF37!important;

}

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

.service-hero{

  background: radial-gradient(circle at right, rgb(55 129 212 / 85%), rgba(8, 22, 51, .98) 60%, #081633 100%) !important;

}

.service-subtitle{

    color:#D4AF37!important;

}

.service-title{

    color:#fff!important;

}

.service-text{

    color:#b4cbeb !important

}

/* Hero Buttons */

.chat-btn{

    background:linear-gradient(135deg,#D4AF37,#F2D27A)!important;

    border-color:#D4AF37!important;

    color:#081633!important;

}

.chat-btn:hover{

    background:#D4AF37!important;

}

.calls-btn{

    background:transparent!important;

    border:2px solid rgba(212,175,55,.40)!important;

    color:#D4AF37!important;

}

.calls-btn:hover{

    background:#D4AF37!important;

    color:#081633!important;

}

/*==========================================
POPULAR SERVICES OVERRIDE
==========================================*/

.popular-services{

    background:transparent!important;

}

.sub-title{

    color:#3d5a81 !important;

}

.service-heading p{

    color:#6980a0 !important;

}

/*=====================
SERVICE CARD
======================*/

.service-card{

    background:linear-gradient(180deg,#102B5C,#0D2349)!important;

    border:1px solid rgba(212,175,55,.18)!important;

    box-shadow:0 15px 35px rgba(0,0,0,.18)!important;

}

.service-card:hover{

    transform:translateY(-10px);

    border-color:#D4AF37!important;

    box-shadow:
    0 25px 45px rgba(0,0,0,.30),
    0 0 18px rgba(212,175,55,.12)!important;

}

/* Image */

.service-image{

    background:#081633!important;

}

.service-image img{

    transition:.45s;

}

.service-card:hover .service-image img{

    transform:scale(1.08);

}

/* Tag */

.service-tag{

    background:#D4AF37!important;

    color:#081633!important;

}

/* Rating */

.rating{

    color:#D4AF37!important;

}

.rating span{

    color:#b4cbeb !important;

}

/* Content */

.service-content h3{

    color:#fff!important;

}

.service-content p{

    color:#b4cbeb !important;

}

.service-list li{

    color:#b4cbeb !important;

}

.service-list i{

    color:#D4AF37!important;

}

.price{

    color:#D4AF37!important;

}

.price span{

    color:#CBD5E5!important;

}

/*=====================
BUTTONS
======================*/

.call-btn{

    background:linear-gradient(135deg,#D4AF37,#F2D27A)!important;

    border-color:#D4AF37!important;

    color:#081633!important;

}

.call-btn:hover{

    background:#D4AF37!important;

    color:#081633!important;

}

.whatsapp-btn{

    background:#25D366!important;

    border-color:#25D366!important;

    color:#fff!important;

}

.whatsapp-btn:hover{

    background:#1EBE57!important;

}

/*==========================================
FLOATING BUTTONS
==========================================*/

.floating-call{

    background:#D4AF37!important;

    color:#081633!important;

    box-shadow:0 12px 30px rgba(0,0,0,.30)!important;

}

.floating-call:hover{

    background:#F2D27A!important;

    color:#081633!important;

}

.floating-whatsapp{

    background:#25D366!important;

    color:#fff!important;

    box-shadow:0 12px 30px rgba(0,0,0,.30)!important;

}

.floating-whatsapp:hover{

    background:#1EBE57!important;

}

.scroll-toggle-btn{

    background:#D4AF37!important;

    color:#081633!important;

    box-shadow:0 10px 25px rgba(0,0,0,.25)!important;

}

.scroll-toggle-btn:hover{

    background:#F2D27A!important;

    color:#081633!important;

}