/*=========================================================
INDIANASTROVEDIC
PREMIUM FAQ
PART 1
=========================================================*/

.service-faq{
    position:relative;
    padding:120px 0;
    background:linear-gradient(180deg,#ffffff 0%,#f7f9fc 100%);
    overflow:hidden;
}

.service-faq::before{
    content:"";
    position:absolute;
    top:-220px;
    right:-220px;
    width:520px;
    height:520px;
    border-radius:50%;
    background:rgba(212,175,55,.08);
    filter:blur(90px);
}

.service-faq::after{
    content:"";
    position:absolute;
    bottom:-220px;
    left:-220px;
    width:520px;
    height:520px;
    border-radius:50%;
    background:rgba(8,27,58,.05);
    filter:blur(90px);
}

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

.service-faq .section-title{

position:relative;

z-index:2;

text-align:center;

max-width:900px;

margin:0 auto 70px;

}

.service-faq .section-title span{

display:inline-flex;

align-items:center;

justify-content:center;

padding:12px 28px;

border-radius:60px;

background:#fff;

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

box-shadow:0 15px 40px rgba(0,0,0,.05);

font-size:14px;

font-weight:700;

letter-spacing:1px;

text-transform:uppercase;

color:#081b3a;

margin-bottom:22px;

}

.service-faq .section-title h2{

font-size:52px;

font-weight:800;

color:#081b3a;

line-height:1.2;

margin-bottom:22px;

}

.service-faq .section-title p{

font-size:18px;

line-height:1.9;

color:#667085;

max-width:820px;

margin:auto;

}

/*=========================================================
FAQ WRAPPER
=========================================================*/

.faq-wrapper{

position:relative;

z-index:2;

max-width:980px;

margin:auto;

}

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

.service-faq .accordion{

display:flex;

flex-direction:column;

gap:20px;

}

.service-faq .accordion-item{

border:none;

border-radius:22px;

overflow:hidden;

background:#ffffff;

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

border:1px solid rgba(8,27,58,.06);

transition:.35s;

}

.service-faq .accordion-item:hover{

transform:translateY(-4px);

box-shadow:0 28px 60px rgba(0,0,0,.10);

border-color:rgba(212,175,55,.35);

}

.service-faq .accordion-button{

background:#ffffff;

padding:28px 34px;

font-size:20px;

font-weight:700;

color:#081b3a;

box-shadow:none;

line-height:1.5;

}

.service-faq .accordion-button:not(.collapsed){

background:linear-gradient(135deg,#081b3a,#10386d);

color:#ffffff;

}

.service-faq .accordion-button:focus{

box-shadow:none;

border:none;

}

.service-faq .accordion-button::after{

background-size:22px;

transition:.35s;

}

.service-faq .accordion-button:not(.collapsed)::after{

filter:brightness(0) invert(1);

}
/*=========================================================
FAQ BODY
=========================================================*/

.service-faq .accordion-collapse{

border:0;

}

.service-faq .accordion-body{

padding:30px 34px 34px;

background:#ffffff;

font-size:16px;

line-height:2;

color:#667085;

border-top:1px solid rgba(8,27,58,.06);

}

/*=========================================================
OPEN STATE
=========================================================*/

.service-faq .accordion-item:has(.accordion-button:not(.collapsed)){

border-color:rgba(212,175,55,.45);

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

}

.service-faq .accordion-item:has(.accordion-button:not(.collapsed)) .accordion-body{

background:#ffffff;

}

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

.faq-bottom{

margin-top:90px;

position:relative;

z-index:2;

background:linear-gradient(135deg,#081b3a,#10386d);

border-radius:32px;

padding:55px;

overflow:hidden;

box-shadow:0 35px 80px rgba(8,27,58,.20);

}

.faq-bottom::before{

content:"";

position:absolute;

top:-120px;

right:-120px;

width:320px;

height:320px;

border-radius:50%;

background:rgba(212,175,55,.10);

filter:blur(40px);

}

.faq-content{

position:relative;

z-index:2;

}

.faq-badge{

display:inline-flex;

align-items:center;

gap:10px;

padding:12px 22px;

border-radius:50px;

background:rgba(255,255,255,.10);

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

color:#FFD54A;

font-size:14px;

font-weight:700;

margin-bottom:20px;

}

.faq-content h3{

font-size:36px;

font-weight:800;

color:#ffffff;

line-height:1.3;

margin-bottom:18px;

}

.faq-content p{

font-size:17px;

line-height:1.9;

color:rgba(255,255,255,.82);

margin:0;

}

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

.faq-buttons{

display:flex;

flex-direction:column;

gap:18px;

justify-content:center;

height:100%;

position:relative;

z-index:2;

}

.btn-faq-whatsapp,

.btn-faq-call{

display:flex;

align-items:center;

justify-content:center;

gap:12px;

height:58px;

border-radius:60px;

text-decoration:none;

font-weight:700;

font-size:16px;

transition:.35s;

}

.btn-faq-whatsapp{

background:#25D366;

color:#ffffff;

box-shadow:0 18px 40px rgba(37,211,102,.30);

}

.btn-faq-whatsapp:hover{

transform:translateY(-4px);

color:#ffffff;

}

.btn-faq-call{

background:#FFD54A;

color:#081b3a;

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

}

.btn-faq-call:hover{

transform:translateY(-4px);

color:#081b3a;

}
/*=========================================================
PREMIUM HOVER EFFECTS
=========================================================*/

.service-faq .accordion-item,
.service-faq .accordion-button,
.service-faq .accordion-body,
.btn-faq-whatsapp,
.btn-faq-call{
    transition:all .35s ease;
}

.service-faq .accordion-item:hover .accordion-button{
    color:#0d3b73;
}

.service-faq .accordion-item:hover .accordion-button:not(.collapsed){
    color:#ffffff;
}

.service-faq .accordion-button{
    position:relative;
}

.service-faq .accordion-button::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:5px;
    height:100%;
    background:linear-gradient(180deg,#FFD54A,#D4AF37);
    transform:scaleY(0);
    transform-origin:top;
    transition:.35s;
}

.service-faq .accordion-item:hover .accordion-button::before,
.service-faq .accordion-button:not(.collapsed)::before{
    transform:scaleY(1);
}

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

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

font-size:18px;

transition:.35s;

}

.btn-faq-whatsapp:hover i,
.btn-faq-call:hover i{

transform:translateX(4px);

}

/*=========================================================
GLOW EFFECT
=========================================================*/

.faq-bottom::after{

content:"";

position:absolute;

left:-120px;

bottom:-120px;

width:280px;

height:280px;

border-radius:50%;

background:rgba(255,255,255,.05);

filter:blur(50px);

}

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

@media(max-width:1200px){

.service-faq .section-title h2{

font-size:46px;

}

.faq-bottom{

padding:45px;

}

.faq-content h3{

font-size:32px;

}

}

@media(max-width:991px){

.service-faq{

padding:90px 0;

}

.service-faq .section-title{

margin-bottom:60px;

}

.service-faq .section-title h2{

font-size:38px;

}

.faq-bottom{

text-align:center;

padding:40px;

}

.faq-buttons{

margin-top:35px;

}

}

@media(max-width:767px){

.service-faq{

padding:70px 0;

}

.service-faq .section-title h2{

font-size:30px;

}

.service-faq .section-title p{

font-size:16px;

}

.service-faq .accordion-button{

padding:22px;

font-size:18px;

}

.service-faq .accordion-body{

padding:22px;

font-size:15px;

line-height:1.9;

}

.faq-bottom{

padding:30px 25px;

border-radius:24px;

}

.faq-content h3{

font-size:26px;

}

.faq-content p{

font-size:15px;

}

.btn-faq-whatsapp,
.btn-faq-call{

height:54px;

font-size:15px;

}

}

@media(max-width:480px){

.service-faq .section-title span{

font-size:12px;

padding:10px 18px;

}

.service-faq .section-title h2{

font-size:26px;

}

.service-faq .accordion-button{

font-size:16px;

padding:18px;

}

.service-faq .accordion-body{

padding:18px;

font-size:14px;

}

.faq-content h3{

font-size:22px;

}

.faq-content p{

font-size:14px;

}

.btn-faq-whatsapp,
.btn-faq-call{

width:100%;

}

}

/*=========================================================
END OF FILE
=========================================================*/