/*----------------------Opening Page---start--------*/

.body-wrapper {
    margin-top: -96px;
}

* {

    box-sizing: border-box;

}

html,

body {

    margin: 0;

    min-height: 100%;

    font-family: Arial, Helvetica, sans-serif;

}



.landing-hero {

    position: relative;

    isolation: isolate;

    min-height: 100svh;

    min-height: 100vh;

    overflow: hidden;

    color: #fff;

    background: #15221e;

    display: flex;

    align-items: center;

    justify-content: center;

}

.hero-video,

.video-shade {

    position: absolute;

    inset: 0;

    width: 100%;

    height: 100%;

    z-index: -2;

}

.hero-video {

    object-fit: cover;

    object-position: center;

}

.video-shade {

    z-index: -1;

    background: linear-gradient(90deg, rgba(0, 0, 0, 0.56), rgba(0, 0, 0, 0.24) 48%, rgba(3, 12, 23, 0.48)),

        linear-gradient(0deg, rgba(0, 0, 0, 0.35), transparent 35%, rgba(0, 0, 0, 0.2));

}

.hero-header {

    position: absolute;

    top: 0;

    left: 0;

    display: flex;

    align-items: flex-start;

    justify-content: space-between;

    padding: 22px clamp(22px, 5.5vw, 86px);

    z-index: 2;

}

.brand {

    display: grid;

    grid-template-columns: auto auto;

    grid-template-rows: auto auto;

    column-gap: 17px;

    align-items: center;

    text-decoration: none;

    color: #fff;

}

.brand-monogram {

    font-family: Georgia, serif;

    font-size: clamp(38px, 4vw, 62px);

    line-height: 1;

    color: #e7b85c;

    letter-spacing: -7px;

    border-right: 1px solid rgba(231, 184, 79, 0.7);

    padding-right: 17px;

    grid-row: 1;

}

.brand-name {

    font-size: clamp(15px, 1.4vw, 22px);

    letter-spacing: 0.17em;

    line-height: 1.28;

}

.brand-tagline {

    grid-column: 1/3;

    font-size: 10px;

    letter-spacing: 0.38em;

    margin-top: 12px;

    white-space: nowrap;

}

.header-note {

    font-size: 10px;

    letter-spacing: 0.42em;

    color: rgba(255, 255, 255, 0.76);

    padding-top: 20px;

}

.header-note span {

    color: #e7b85c;

    padding: 0 8px;

}

.hero-intro {

    position: absolute;

    top: 19%;

    left: 50%;

    transform: translateX(-50%);

    width: min(720px, 70vw);

    z-index: 1;

}

.eyebrow {

    font-size: clamp(10px, 1vw, 14px);

    letter-spacing: 0.34em;

    margin-bottom: 18px;

}

.gold-rule {

    display: block;

    width: 78px;

    height: 2px;

    background: #e7b85c;

    margin: 0 auto 16px;

}

.hero-intro h1 {

    font-family: Georgia, "Times New Roman", serif;

    font-size: clamp(44px, 5.5vw, 82px);

    line-height: 0.98;

    font-weight: 400;

    letter-spacing: -0.035em;

    margin: 0;

}

.hero-intro h1 span {

    color: #e7b85c;

}

.hero-subtitle {

    font-size: clamp(13px, 1.3vw, 19px);

    margin-top: 19px;

}



.choice-card {

    position: absolute;

    top: 25%;

    width: clamp(230px, 22vw, 330px);

    min-height: 340px;

    padding: 28px 25px 25px;

    display: flex;

    flex-direction: column;

    align-items: center;

    text-align: center;

    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.2);

    z-index: 2;

}

.interior-card {

    left: 5.5%;

    background: rgba(246, 234, 211, 0.96);

    color: #151511;

}

.exterior-card {

    right: 5.5%;

    background: rgba(5, 43, 36, 0.94);

    color: #fff;

    border: 1px solid rgba(231, 184, 79, 0.35);

}

.choice-icon {

    height: 92px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 12px;

    color: #e7b85c;

    font-size: 48px;

}

.choice-icon > i:first-child {

    color: inherit;

}

.lamp-icon {

    font-size: 36px;

}

.building-icon {

    font-size: 44px;

}

.tree-icon {

    font-size: 27px;

    align-self: center;

}

.choice-card h2 {

    font-size: clamp(17px, 1.45vw, 22px);

    letter-spacing: 0.22em;

    line-height: 1.5;

    font-weight: 600;

    margin: 3px 0 12px;

}

.choice-card .gold-rule {

    width: 44px;

    margin-bottom: 20px;

}

.choice-card p {

    font-size: 10px;

    letter-spacing: 0.32em;

    line-height: 1.9;

    margin-bottom: 20px;

}

.btn-gold {

    width: 100%;

    margin-top: auto;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 16px;

    min-height: 52px;

    background: linear-gradient(110deg, #e7b34b, #d79a2e);

    color: #111;

    text-decoration: none;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 0.12em;

    box-shadow: 0 5px 16px rgba(0, 0, 0, 0.16);

    transition:

        transform 0.2s,

        filter 0.2s;

}

.btn-gold:hover,

.btn-gold:focus {

    color: #111;

    filter: brightness(1.08);

    transform: translateY(-2px);

}



.bottom-quote {

    position: absolute;

    right: 5.5%;

    bottom: 4%;

    font-family: Georgia, serif;

    font-style: italic;

    font-size: 15px;

    line-height: 1.5;

}

.quote-rule {

    display: block;

    width: 45px;

    height: 1px;

    background: #e7b85c;

    margin: 18px 0 0 auto;

}



@media (max-width: 767.98px) {

    .landing-hero {

        min-height: 100svh;

        min-height: 100vh;

        align-items: flex-start;

        overflow-y: auto;

        padding: 0 0 85px;

    }

    .hero-video {

        object-position: center;

    }

    .video-shade {

        background: linear-gradient(180deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.35) 45%, rgba(0, 0, 0, 0.7));

    }

    .hero-header {

        padding: 18px 18px;

    }

    .brand {

        column-gap: 12px;

    }

    .brand-monogram {

        font-size: 38px;

        padding-right: 12px;

        letter-spacing: -5px;

    }

    .brand-name {

        font-size: 12px;

        letter-spacing: 0.12em;

    }

    .brand-tagline {

        font-size: 7px;

        letter-spacing: 0.23em;

        margin-top: 8px;

    }

    .header-note{

        display: none;

    }

    .hero-intro {

        position: relative;

        top: auto;

        left: auto;

        transform: none;

        width: 100%;

        padding: 132px 20px 0;

    }

    .eyebrow {

        font-size: 9px;

        letter-spacing: 0.22em;

        margin-bottom: 14px;

    }

    .hero-intro h1 {

        font-size: clamp(43px, 12vw, 62px);

    }

    .hero-subtitle {

        font-size: 13px;

        line-height: 1.5;

        margin-top: 14px;

    }

    .choice-card {

        position: relative;

        top: auto;

        left: auto;

        right: auto;

        width: min(84%, 360px);

        min-height: 0;

        margin: 25px auto 0;

        padding: 19px 20px 20px;

    }

    .choice-icon {

        height: 58px;

        font-size: 34px;

    }

    .lamp-icon {

        font-size: 27px;

    }

    .building-icon {

        font-size: 34px;

    }

    .tree-icon {

        font-size: 22px;

    }

    .choice-card h2 {

        font-size: 17px;

        margin: 3px 0 9px;

    }

    .choice-card .gold-rule {

        margin-bottom: 12px;

    }

    .choice-card p {

        font-size: 9px;

        margin-bottom: 14px;

    }

    .btn-gold {

        min-height: 46px;

        font-size: 10px;

    }

    

    .bottom-quote {

        position: relative;

        right: auto;

        bottom: auto;

        text-align: center;

        margin: 25px auto 0;

        font-size: 13px;

    }

    .quote-rule {

        margin: 10px auto 0;

    }

    

}

@media (prefers-reduced-motion: reduce) {

    .btn-gold {

        transition: none;

    }

}



/* Responsive refinement: compact layout for tablets and phones */

@media (max-width: 991.98px) {

    .landing-hero {

        min-height: 100svh;

        display: grid;

        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);

        align-content: start;

        align-items: stretch;

        justify-content: stretch;

        gap: clamp(12px, 2.5vw, 24px);

        padding: 0 4.5% 78px;

        overflow-x: hidden;

        overflow-y: auto;

    }

    .hero-header {

        padding: 18px 4.5%;

    }

    .brand-monogram {

        font-size: clamp(32px, 5vw, 46px);

    }

    .brand-name {

        font-size: clamp(10px, 1.8vw, 15px);

    }

    .brand-tagline {

        font-size: clamp(6px, 1vw, 8px);

        letter-spacing: 0.2em;

    }

    .header-note {

        font-size: 8px;

        letter-spacing: 0.2em;

        padding-top: 14px;

    }

    .hero-intro {

        position: relative;

        top: auto;

        left: auto;

        transform: none;

        grid-column: 1 / -1;

        width: min(100%, 680px);

        justify-self: center;

        padding: 132px 12px 8px;

    }

    .hero-intro h1 {

        font-size: clamp(42px, 7vw, 68px);

    }

    .hero-subtitle {

        font-size: clamp(12px, 1.8vw, 16px);

    }

    

    .choice-card {

        position: relative;

        top: auto;

        left: auto;

        right: auto;

        width: 100%;

        min-width: 0;

        min-height: 0;

        padding: clamp(16px, 2.5vw, 24px) clamp(12px, 2vw, 20px);

        margin: auto;

    }

    .choice-icon {

        height: clamp(42px, 6vw, 65px);

        font-size: clamp(28px, 4.5vw, 40px);

    }

    .lamp-icon {

        font-size: 0.72em;

    }

    .building-icon {

        font-size: clamp(28px, 4vw, 38px);

    }

    .tree-icon {

        font-size: 0.65em;

    }

    .choice-card h2 {

        font-size: clamp(13px, 2vw, 18px);

        letter-spacing: 0.15em;

    }

    .choice-card p {

        font-size: clamp(8px, 1.2vw, 10px);

        letter-spacing: 0.18em;

    }

    .btn-gold {

        min-height: 42px;

        padding: 9px 10px;

        font-size: clamp(8px, 1.1vw, 10px);

        gap: 9px;

        letter-spacing: 0.08em;

    }

    

    .bottom-quote {

        right: 4.5%;

        bottom: 16px;

        font-size: 12px;

    }

    

}



@media (max-width: 575.98px) {

    .landing-hero {

        grid-template-columns: minmax(0, 1fr);

        gap: 12px;

        padding: 0 18px 76px;

    }

    .hero-header {

        padding: 16px 18px;

    }

    .brand {

        column-gap: 9px;

    }

    .brand-monogram {

        font-size: 32px;

        padding-right: 9px;

        letter-spacing: -4px;

    }

    .brand-name {

        font-size: 10px;

        letter-spacing: 0.11em;

    }

    .brand-tagline {

        font-size: 6px;

        letter-spacing: 0.16em;

        margin-top: 6px;

    }

    .header-note {

        display: none;

    }

    .hero-intro {

        padding: 112px 0 8px;

    }

    .eyebrow {

        font-size: 8px;

        letter-spacing: 0.16em;

        line-height: 1.6;

        margin-bottom: 10px;

    }

    .hero-intro .gold-rule {

        margin-bottom: 12px;

        width: 52px;

    }

    .hero-intro h1 {

        font-size: clamp(37px, 10.5vw, 49px);

        line-height: 1;

    }

    .hero-subtitle {

        max-width: 320px;

        margin: 12px auto 0;

        font-size: 12px;

        line-height: 1.45;

    }

    .choice-card {

        width: min(100%, 330px);

        padding: 14px 16px 15px;

    }

    .choice-icon {

        height: 36px;

        font-size: 27px;

    }

    .lamp-icon {

        font-size: 20px;

    }

    .building-icon {

        font-size: 27px;

    }

    .tree-icon {

        font-size: 18px;

    }

    .choice-card h2 {

        font-size: 14px;

        line-height: 1.35;

        letter-spacing: 0.16em;

        margin: 5px 0 7px;

    }

    .choice-card .gold-rule {

        width: 32px;

        margin-bottom: 8px;

    }

    .choice-card p {

        font-size: 8px;

        line-height: 1.6;

        letter-spacing: 0.2em;

        margin-bottom: 10px;

    }

    /* Compact icon-only action buttons on small screens */

    .btn-gold {

        width: 38px;

        min-height: 34px;

        height: 34px;

        margin-top: auto;

        align-self: center;

        padding: 0;

        gap: 0;

        font-size: 0;

        letter-spacing: 0;

    }

    .btn-gold i {

        font-size: 13px;

    }

    .bottom-quote {

        position: relative;

        right: auto;

        bottom: auto;

        grid-column: 1;

        margin: 4px auto 0;

        text-align: center;

        font-size: 12px;

    }

    .quote-rule {

        margin: 8px auto 0;

    }

    

}



@media (max-width: 360px) {

    .hero-intro h1 {

        font-size: 35px;

    }

    .brand-name {

        font-size: 9px;

    }

    .brand-tagline {

        font-size: 5px;

    }

    .choice-card {

        padding-inline: 12px;

    }

}



/*--------------------Opening Page  end-----------*/

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

.about-banner{

    height:400px;

    overflow:hidden;

    margin-top: -96px;

}

.about-banner-img{

    position: absolute;
    inset: 0;

    background-image: url('../../images/about-banner.webp');
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;

}

.about-overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(90deg,
    rgba(76,18,130,.90) 0%,
    rgba(105,45,170,.70) 35%,
    rgba(105,45,170,.15) 70%,
    rgba(105,45,170,0) 100%);

}

.about-title{

    color:#fff;

    font-size:46px;

    font-weight:700;

    letter-spacing:.5px;

}

.breadcrumb{

    background:none;

}

.breadcrumb a{

    color:#fff;

    text-decoration:none;

}

.breadcrumb-item.active{

    color:#f2f2f2;

}

.breadcrumb-item+.breadcrumb-item::before{

    color:#fff;

}



/*==========================
ABOUT INTRO
==========================*/

.about-image{

    border-radius:18px;

    overflow:hidden;

}

.about-image img{

    width:100%;

    display:block;

}

.section-tag{

    color:#7a37d7;

    font-size:13px;

    font-weight:700;

    letter-spacing:1px;

}

.about-heading{

    font-size:42px;

    line-height:1.15;

    font-weight:800;

    color:#212529;

}

.about-text{

    color:#666;

    font-size:17px;

    line-height:1.9;

}


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

@media(max-width:991px){

.about-banner{

    height:220px;

}

.about-title{

    font-size:34px;

}

.about-heading{

    font-size:32px;

}

}

@media(max-width:576px){

.about-banner{

    height:190px;

}

.about-title{

    font-size:28px;

}

.about-heading{

    font-size:26px;

}

.about-text{

    font-size:15px;

}

}



/*--------------slider start-----------------------*/





*{box-sizing:border-box}

html,body{margin:0;min-height:100%;font-family:Arial,Helvetica,sans-serif;}

.hero-slider-wrap{width:100%;min-height:100svh;min-height:100vh;overflow:hidden;background:#17130f; margin-top: -96px;}

.hero-slider,.hero-slider .carousel-inner,.hero-slide{height:100svh;min-height:520px;max-height:1000px}



.slide-two{background-position:center 48%;}.slide-three{background-position:center 60%}

.slide-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(10,9,8,.88) 0%,rgba(10,9,8,.68) 32%,rgba(10,9,8,.18) 68%,rgba(10,9,8,.25) 100%),linear-gradient(0deg,rgba(0,0,0,.38),transparent 38%,rgba(0,0,0,.12))}

.slide-container{height:100%;position:relative;display:flex;align-items:center;padding:7vh clamp(28px,4vw,72px) 12vh}

.slide-copy{max-width:650px;margin-top:5vh}

.eyebrow{display:flex;align-items:center;gap:16px;margin-bottom:22px;color:#f2e8d7;font-size:clamp(10px,.85vw,13px);letter-spacing:.28em;font-weight:500}

.eyebrow i{display:block;width:42px;height:1px;background:#e7b85c}

.slide-copy h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(48px,6.1vw,92px);font-weight:400;line-height:.98;letter-spacing:-.045em;margin:0 0 22px;color:#fff}

.slide-copy h1 em{font-style:normal;color:#e7b85c}

.slide-copy p{font-size:clamp(14px,1.15vw,18px);line-height:1.65;color:rgba(255,255,255,.84);margin:0 0 28px}

.slide-cta{display:inline-flex;align-items:center;gap:22px;min-height:48px;padding:0 20px;border:1px solid #e7b85c;color:#fff;text-decoration:none;font-size:11px;font-weight:600;letter-spacing:.12em;transition:background .25s,color .25s,transform .25s}

.slide-cta i{color:#e7b85c;font-size:14px;transition:transform .25s}

.slide-cta:hover,.slide-cta:focus{background:#e7b85c;color:#15120e;transform:translateY(-2px)}

.slide-cta:hover i,.slide-cta:focus i{color:#15120e;transform:translateX(4px)}

.slide-side-note{position:absolute;right:clamp(28px,4vw,72px);top:40%;font-size:10px;line-height:2.25;letter-spacing:.17em;color:rgba(255,255,255,.86);border-left:1px solid rgba(231,184,92,.8);padding:5px 0 5px 17px}

.hero-controls{position:absolute;z-index:5;left:clamp(28px,4vw,72px);right:clamp(28px,4vw,72px);bottom:42px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}

.slide-pagination,.arrow-controls{display:flex;align-items:center;pointer-events:auto}

.slide-pagination{gap:22px}

.slide-pagination button{border:0;background:none;padding:8px 0;color:rgba(255,255,255,.55);font-size:11px;letter-spacing:.08em;transition:color .2s}

.slide-pagination button.active{color:#fff}

.slide-pagination button.active:after{content:'';display:block;height:1px;width:100%;background:#e7b85c;margin-top:8px}

.pagination-track{display:block;width:74px;height:1px;background:rgba(255,255,255,.3);margin-left:2px;overflow:hidden}

.pagination-track span{display:block;width:33.333%;height:1px;background:#e7b85c}

.arrow-controls{gap:10px}

.hero-arrow{width:42px;height:42px;border-radius:50%;border:1px solid rgba(231,184,92,.85);background:rgba(0,0,0,.2);color:#e7b85c;display:grid;place-items:center;transition:background .2s,color .2s,transform .2s}

.hero-arrow:hover,.hero-arrow:focus{background:#e7b85c;color:#17130f;transform:scale(1.06)}

.carousel-fade .carousel-item{opacity:0;transition:opacity 1s ease-in-out}.carousel-fade .carousel-item.active{opacity:1}

@media(max-width:767.98px){.hero-slider,.hero-slider .carousel-inner,.hero-slide{height:100svh;min-height:600px;max-height:none}.hero-slide{background-position:58% center}.slide-shade{background:linear-gradient(90deg,rgba(8,8,7,.82),rgba(8,8,7,.48) 70%,rgba(8,8,7,.3)),linear-gradient(0deg,rgba(0,0,0,.5),transparent 60%)}.slide-container{align-items:center;padding:0 24px 90px}.slide-copy{margin-top:0;max-width:520px}.eyebrow{font-size:9px;letter-spacing:.19em;gap:11px;margin-bottom:18px}.eyebrow i{width:30px}.slide-copy h1{font-size:clamp(43px,10vw,68px);line-height:1.02;margin-bottom:18px}.slide-copy p{font-size:14px;line-height:1.55;margin-bottom:23px}.slide-cta{min-height:43px;padding:0 14px;gap:14px;font-size:9px}.slide-side-note{display:none}.hero-controls{left:24px;right:24px;bottom:24px}.slide-pagination{gap:16px}.pagination-track{width:42px}.hero-arrow{width:36px;height:36px;font-size:12px}.arrow-controls{gap:7px}}

@media(max-width:380px){.slide-container{padding-left:19px;padding-right:19px}.slide-copy h1{font-size:40px}.hero-controls{left:19px;right:19px}.slide-pagination{gap:12px}.pagination-track{width:28px}}

@media(prefers-reduced-motion:reduce){.carousel-fade .carousel-item,.slide-cta,.slide-cta i,.hero-arrow{transition:none}}



/*-----------slider end-------------------------*/











.base-padding{







  padding: 0 2%;  



}











/*-----nav menu-start------*/



.navbar ul li a

 {

    color: #fff;

   

    font-size: 13px;





    display: flex;

    align-items: center;

    gap: 16px;

   

    color: #f2e8d7;

    font-size: clamp(10px, .85vw, 13px);

    letter-spacing: 1px;

    font-weight: 500;





}









.header-logo-hol img {

    

    z-index: 9999;

    width: auto;

    height: 80px;

    transition: 1s;

}









.scrolled {



box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;

background: #e7b85c;



}

.scrolled .nav-link{

color:#000;



}

.navbar.scrolled img {

    height: 35px;

    width: auto;

    transition: 1s;

    position: relative;

   

}

.scrolled .out-nav{



top: 13px;



transition: 1s;



}



.out-nav {

    margin-right: 5px;

    width: 155px;

    position: absolute;

    top: 30px;

    right: 0;



    transition: 1s;

}







@media (max-width: 550px) {



.header-logo-hol img {

    

    z-index: 9999;

    width: auto;

    height: 60px;

    transition: 1s;

}







    

}







/*-----nav button-start------*/







/* Emergency Button */







.quote-btn{



   display: inline-flex;

    align-items: center;

    gap: 5px;

    min-height: 28px;

    padding: 0 13px;

    border: 1px solid #e7b85c;

    color: #fff;

    text-decoration: none;

    font-size: 11px;

    font-weight: 600;

    letter-spacing: .12em;

    margin-top: 1px;

    transition: background .25s, color .25s, transform .25s;



}







.quote-btn:hover{





   transition: 1s;

    background:#e7b85c;



    color:#000;



    transform:translateY(-2px);







}





.scrolled .quote-btn{



    border:1px solid #fff;

}



.scrolled .quote-btn:hover{



    border:1px solid #000;

}



















    .mob-menu{



        margin-right: 173px;



    }  





@media (max-width:991px){







    .quote-btn{







        padding:5px 5px;







    }











}







@media (max-width:576px){



.quote-btn  {

    margin-left: -64px;

}



    









.out-nav{

width: 60px;

top: 18px;

}



.mob-menu {

  margin-right: 120px;

}



 





}



/*-------- Get a Quote MODAL start ----------*/

.quote-modal {

    background: #171512;

    border: 1px solid rgba(210,169,83,.45);

    border-radius: 3px;

    color: #fff;

}



.quote-modal .modal-header {

    padding: 30px 35px 22px;

    border-bottom: 1px solid rgba(210,169,83,.25);

    align-items: flex-start;

}



.quote-subtitle {

    color: #d9ad56;

    font-size: 10px;

    letter-spacing: 3px;

    font-weight: 700;

}



.quote-modal h3 {

    font-family: Georgia, serif;

    font-size: 29px;

    margin: 12px 0 7px;

}



.quote-modal h3 span {

    color: #dfb353;

}



.quote-modal p {

    color: #aaa49a;

    font-size: 13px;

    margin: 0;

}



.quote-modal .modal-body {

    padding: 28px 35px 32px;

}



.quote-modal .form-label {

    color: #d8b568;

    font-size: 10px;

    letter-spacing: 1.2px;

    font-weight: 700;

    margin-bottom: 9px;

}



.quote-modal .form-control,

.quote-modal .form-select {

    background-color: #211e19;

    color: #fff;

    border: 1px solid #454039;

    border-radius: 2px;

    padding: 12px 13px;

    font-size: 13px;

    box-shadow: none;

}



.quote-modal .form-control::placeholder {

    color: #858078;

}



.quote-modal .form-control:focus,

.quote-modal .form-select:focus {

    border-color: #c99b43;

    box-shadow: 0 0 0 2px rgba(201,155,67,.12);

}



.quote-modal .form-select option {

    background: #211e19;

    color: white;

}



/* PROJECT TYPE OPTIONS */

.quote-option {

    display: block;

    cursor: pointer;

}



.quote-option input {

    display: none;

}



.quote-option span {

    min-height: 66px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

    border: 1px solid #454039;

    color: #d6d0c6;

    font-size: 12px;

    transition: .3s;

    background: #211e19;

}



.quote-option span i {

    color: #c99b43;

    font-size: 17px;

}



.quote-option input:checked + span {

    border-color: #d9ad56;

    color: #e8bd67;

    background: rgba(201,155,67,.10);

}



/* FOOTER */

.quote-footer {

    display: flex;

    justify-content: space-between;

    align-items: center;

    gap: 15px;

    margin-top: 25px;

    padding-top: 22px;

    border-top: 1px solid #39342c;

}



.quote-footer > span {

    font-size: 11px;

    color: #aaa49a;

}



.quote-footer > span i {

    color: #d9ad56;

    margin-right: 5px;

}



.quote-submit {

    background: #d4a94f;

    color: #15120d;

    border: 0;

    padding: 14px 22px;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 1px;

    transition: .3s;

}



.quote-submit:hover {

    background: #f0c66e;

}



.quote-submit i {

    margin-left: 12px;

}



/* MOBILE */

@media(max-width:575px) {

    .quote-modal .modal-header {

        padding: 23px 20px 18px;

    }



    .quote-modal .modal-body {

        padding: 22px 20px;

    }



    .quote-modal h3 {

        font-size: 23px;

    }



    .quote-footer {

        flex-direction: column;

        align-items: stretch;

    }



    .quote-submit {

        width: 100%;

    }



    .quote-option span {

        min-height: 55px;

    }

}



/*-------- Get a Quote MODAL end ----------*/

/*-----nav button-end------*/







/*-----troggle memu-start---*/





  .navbar-toggler:focus {



    outline-style: none;



    box-shadow: none;



    border-color: transparent;



}  



    



    







.navbar-toggler span {



    display: block;



    background-color: #006699;



    height: 3px;



    width: 25px;



    margin-top: 5px;



    margin-bottom: 5px;



    position: relative;



    left: 0;



    opacity: 1;



    transition: all 0.35s ease-out;



    transform-origin: center left;



}















.navbar-toggler span:nth-child(1) {



    margin-top: 0.3em;



}









.navbar-toggler:not(.collapsed) span:nth-child(1) {



    transform: translate(0%, 0%) rotate(0deg) ;



}



/* middle line goes back to regular color and opacity */



.navbar-toggler:not(.collapsed) span:nth-child(2) {



    opacity: 1;



}







.navbar-toggler:not(.collapsed) span:nth-child(3) {



    transform: translate(0%, 0%) rotate(0deg) ;



}











.navbar-toggler span:nth-child(1) {



    transform: translate(15%, -33%) rotate(45deg);



}







.navbar-toggler span:nth-child(2) {



    opacity: 0;



}







.navbar-toggler span:nth-child(3) {



    transform: translate(15%, 33%) rotate(-45deg) ;



}























.navbar-toggler:not(.collapsed) span:nth-child(1) {



    transform: translate(0%, 0%) rotate(0deg) ;



}



/* middle line goes back to regular color and opacity */



.navbar-toggler:not(.collapsed) span:nth-child(2) {



    opacity: 1;



}







.navbar-toggler:not(.collapsed) span:nth-child(3) {



    transform: translate(0%, 0%) rotate(0deg) ;



}



    



    



    



/*-----end of toggle menu-----*/











/*----drop down smooth-start-------*/







    



.dropdown:hover .dropdown-menu {



  display: block;



    



    margin-top: 0px!important;



    border: 0;



}



    



    .dr-hol {



    background: #fff;



    



    display: none;



}



    



    



.dropdown-item:hover{



    color: #0a58ca!important;



} 



    







.dropdown:hover .dr-hol {



    display: block;



    opacity: 1;



   margin-top:20px;



}















    



    



    .dropdown .dropdown-menu{



    display: block;



    opacity: 0;



    background: none;



    -moz-transition:    all 1000ms ease;



    -webkit-transition: all 1000ms ease;



    -o-transition:      all 1000ms ease;



    -ms-transition:     all 1000ms ease;



    transition:         all 1000ms ease;



    border: none;



}



.dropdown:hover .dropdown-menu {



    display: block;



    opacity: 1;



}



   



    



 @media (max-width: 992px) {  



     



     .dropdown .dropdown-menu {



         



         position: absolute;



         top:5px;



         display: none;



         



         



    }



    



   



     



     



    }











/*------drop down smooth--end---------*/



/*-----nav menu-end------*/



















































































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

   CONSULTENT FAQ

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







.faq {

    background: #fff;

}



.faq-subtitle {

    display: inline-block;

    color: #7d3cf4;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 1.5px;

    margin-bottom: 8px;

}



.faq-title {

    color: #24163d;

    font-size: 32px;

    font-weight: 700;

    margin-bottom: 10px;

}



.faq-intro {

    color: #777;

    max-width: 650px;

    margin: 0 auto;

    font-size: 14px;

    line-height: 1.7;

}





/* Accordion */



.faq-accordion {

    max-width: 950px;

    margin: 30px auto 0;

}



.faq-accordion .accordion-item {

    border: 1px solid #eadffb;

    border-radius: 8px;

    overflow: hidden;

    margin-bottom: 12px;

    background: #fff;

}





.faq-accordion .accordion-button {

    background: #fff;

    color: #2d2043;

    font-size: 15px;

    font-weight: 600;

    padding: 18px 20px;

    box-shadow: none;

}





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

    background: #f7f2ff;

    color: #7d3cf4;

    box-shadow: none;

}





.faq-accordion .accordion-button:focus {

    box-shadow: none;

}





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

    background-size: 14px;

}





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

    transform: rotate(-180deg);

}





/* Question Icon */



.faq-question-icon {

    width: 34px;

    height: 34px;



    display: inline-flex;

    align-items: center;

    justify-content: center;



    margin-right: 12px;



    border-radius: 50%;



    background: #f0e8ff;

    color: #7d3cf4;



    flex-shrink: 0;

}





.faq-accordion

.button:not(.collapsed)

.faq-question-icon {

    background: #7d3cf4;

    color: #fff;

}





/* Answer */



.faq-accordion .accordion-body {

    padding: 0 55px 20px 66px;



    color: #666;



    font-size: 14px;



    line-height: 1.8;



    background: #f7f2ff;

}

























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

   BLOG LEFT AREA

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



.event {

    width: 100%;

}



.event .container {

    max-width: 100%;

    padding-left: 0;

    padding-right: 0;

}



.event .row {

    margin-left: -12px;

    margin-right: -12px;

}





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

   BLOG CARD

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



.blog-card {

    height: 100%;

    border: 1px solid #eadfff !important;

    border-radius: 12px !important;

    overflow: hidden;



    background: #ffffff;



    box-shadow: 0 5px 18px rgba(125, 60, 244, 0.07);



    transition: all 0.3s ease;

}



.blog-card:hover {

    transform: translateY(-5px);

    border-color: #d7c1ff !important;



    box-shadow: 0 12px 30px rgba(125, 60, 244, 0.14);

}





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

   BLOG IMAGE

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



.blog-img-arc {

    width: 100%;

    height: 225px;



    overflow: hidden;



    background: #f5f0ff;

}



.blog-img-arc img,

.blog-img-arc .cl-img {

    display: block;



    width: 100%;

    height: 100%;



    object-fit: cover;



    border: 0 !important;

    border-radius: 0 !important;



    padding: 0 !important;



    transition: transform 0.5s ease;

}



.blog-card:hover .blog-img-arc img {

    transform: scale(1.05);

}





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

   BLOG CARD BODY

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



.blog-card .card-body {

    padding: 22px;

}



.blog-card .card-title {

    margin-bottom: 10px;

}





/* Blog Title */



.blog-nm {

    color: #191919;



    font-size: 19px;

    line-height: 1.4;



    font-weight: 600;



    margin-bottom: 10px;

}



.blog-card:hover .blog-nm {

    color: #7d3cf4;

}





/* Description */



.blog-card .card-text {

    color: #777777;



    font-size: 13px;

    line-height: 1.7;



    margin-bottom: 18px;

}





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

   READ ARTICLE BUTTON

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



.sm-read-more {

    display: inline-flex;



    align-items: center;

    justify-content: center;



    gap: 7px;



    padding: 9px 18px !important;



    min-height: 38px;



    color: #7d3cf4 !important;



    background: #ffffff !important;



    border: 1px solid #7d3cf4;



    border-radius: 6px;



    text-decoration: none !important;



    font-size: 12px;

    font-weight: 600;



    transition: all 0.3s ease;

}



.sm-read-more:hover {

    color: #ffffff !important;



    background: #7d3cf4 !important;



    border-color: #7d3cf4;

}



.sm-read-more i {

    font-size: 11px;

}





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

   BLOG SIDEBAR

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



.col-md-3 {

    position: relative;

}



.blog-sidebar {

    width: 100%;

}





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

   SIDEBAR SEARCH

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



.blog-search-box {

    background: #ffffff;



    border: 1px solid #eadfff;



    border-radius: 10px;



    padding: 10px;



    margin-bottom: 22px;



    box-shadow: 0 5px 18px rgba(125, 60, 244, 0.06);

}



.blog-search-box form {

    position: relative;

}



.blog-search-box .form-control {

    height: 44px;



    padding: 0 48px 0 14px;



    border: 1px solid #e5d9ff;



    border-radius: 7px;



    font-size: 13px;



    color: #333333;



    box-shadow: none;

}



.blog-search-box .form-control:focus {

    border-color: #7d3cf4;



    box-shadow: 0 0 0 3px rgba(125, 60, 244, 0.08);

}



.blog-search-box .btn {

    position: absolute;



    top: 0;

    right: 0;



    width: 44px;

    height: 44px;



    border: 0;



    background: transparent;



    color: #7d3cf4;

}



.blog-search-box .btn:hover {

    color: #6024d6;

}





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

   LATEST BLOG

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



.latest-blog {

    background: #ffffff;



    border: 1px solid #eadfff;



    border-radius: 10px;



    overflow: hidden;



    box-shadow: 0 5px 18px rgba(125, 60, 244, 0.07);

}





/* Sidebar heading */



.sidebar-heading {

    display: flex;



    align-items: center;



    gap: 10px;



    padding: 14px 17px;



    background: #7d3cf4;



    color: #ffffff;



    font-size: 15px;



    font-weight: 600;

}



.sidebar-heading i {

    font-size: 15px;

}





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

   LATEST BLOG LIST

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



.latest-blog-list {

    list-style: none;



    padding: 0;

    margin: 0;

}



.latest-blog-item {

    border-bottom: 1px solid #eee7ff;

}



.latest-blog-item:last-child {

    border-bottom: 0;

}



.latest-blog-link {

    display: flex;



    align-items: flex-start;



    gap: 12px;



    padding: 14px;



    background: #ffffff;



    text-decoration: none !important;



    transition: all 0.3s ease;

}



.latest-blog-link:hover {

    background: #faf7ff;

}





/* Latest image */



.latest-blog-image {

    flex: 0 0 78px;



    width: 78px;

    height: 68px;



    overflow: hidden;



    border-radius: 7px;



    background: #f5efff;

}



.latest-blog-image img {

    width: 100%;

    height: 100%;



    object-fit: cover;



    display: block;



    transition: transform 0.35s ease;

}



.latest-blog-link:hover .latest-blog-image img {

    transform: scale(1.06);

}





/* Latest content */



.latest-blog-content {

    flex: 1;



    min-width: 0;

}



.latest-blog-content h4 {

    margin: 0 0 7px;



    color: #222222;



    font-size: 13px;



    line-height: 1.45;



    font-weight: 600;



    display: -webkit-box;



    -webkit-line-clamp: 2;

    -webkit-box-orient: vertical;



    overflow: hidden;

}



.latest-blog-link:hover .latest-blog-content h4 {

    color: #7d3cf4;

}





/* Date */



.latest-blog-date {

    display: flex;



    align-items: center;



    gap: 6px;



    color: #888888;



    font-size: 11px;

}



.latest-blog-date i {

    color: #7d3cf4;

}





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

   PAGINATION

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



.academic-pagination,

.pagination {

    display: flex;



    justify-content: center;



    align-items: center;



    gap: 6px;



    margin-top: 35px;



    margin-bottom: 0;

}



.academic-pagination a,

.pagination .page-link {

    display: inline-flex;



    align-items: center;

    justify-content: center;



    width: 36px;

    height: 36px;



    padding: 0;



    border: 1px solid #e3d6ff;



    border-radius: 6px;



    background: #ffffff;



    color: #7d3cf4;



    font-size: 13px;



    text-decoration: none;



    transition: all 0.3s ease;

}



.academic-pagination a:hover,

.pagination .page-link:hover {

    background: #f5efff;



    border-color: #7d3cf4;



    color: #7d3cf4;

}



.academic-pagination a.active,

.pagination .page-item.active .page-link {

    background: #7d3cf4;



    border-color: #7d3cf4;



    color: #ffffff;

}



.academic-pagination span {

    display: inline-flex;



    align-items: center;

    justify-content: center;



    height: 36px;



    color: #777777;



    font-size: 13px;

}





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

   BLOG PAGE SECTION DIVIDER

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



.hol-pad .border-end {

    border-color: #eee7ff !important;

}





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

   RESPONSIVE - TABLET

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



@media (max-width: 991.98px) {



    .about-banner {

        min-height: 230px;

    }



    .about-title {

        font-size: 34px;

    }



    .hol-pad {

        padding-top: 40px !important;

        padding-bottom: 40px !important;

    }



    .blog-img-arc {

        height: 200px;

    }



    .blog-sidebar {

        margin-top: 30px;

    }



}





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

   RESPONSIVE - MOBILE

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



@media (max-width: 767.98px) {



    .about-banner {

        min-height: 200px;

    }



    .about-title {

        font-size: 28px;

    }



    .about-banner .breadcrumb-item,

    .about-banner .breadcrumb-item a {

        font-size: 12px;

    }



    .hol-pad {

        padding-top: 30px !important;

        padding-bottom: 30px !important;

    }



    .blog-img-arc {

        height: 220px;

    }



    .blog-card .card-body {

        padding: 18px;

    }



    .blog-nm {

        font-size: 17px;

    }



    .blog-card .card-text {

        font-size: 13px;

    }



    .latest-blog-image {

        width: 75px;

        height: 65px;



        flex-basis: 75px;

    }



}





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

   SMALL MOBILE

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



@media (max-width: 575.98px) {



    .about-banner {

        min-height: 180px;

    }



    .about-title {

        font-size: 25px;

    }



    .blog-img-arc {

        height: 200px;

    }



    .blog-card .card-body {

        padding: 16px;

    }



    .academic-pagination,

    .pagination {

        gap: 4px;

    }



    .academic-pagination a,

    .pagination .page-link {

        width: 33px;

        height: 33px;

    }



}



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

   BLOG RIGHT SIDEBAR

   Bootstrap 5 Compatible

   Purple Theme

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





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

   SIDEBAR

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



.blog-sidebar {

    width: 100%;

}





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

   SEARCH

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



.blog-sidebar form {

    position: relative;

    display: flex;

    width: 100%;

    margin-bottom: 25px;

}



.blog-sidebar form .form-control {

    height: 45px;



    padding: 0 50px 0 15px;



    border: 1px solid #e4d7ff;

    border-radius: 7px;



    background: #ffffff;



    color: #333333;



    font-size: 13px;



    box-shadow: 0 3px 12px rgba(125, 60, 244, 0.06);

}



.blog-sidebar form .form-control:focus {

    border-color: #7d3cf4;



    box-shadow: 0 0 0 3px rgba(125, 60, 244, 0.08);

}



.blog-sidebar form .btn {

    position: absolute;



    right: 0;

    top: 0;



    width: 45px;

    height: 45px;



    padding: 0;



    border: 0;



    background: transparent;



    color: #7d3cf4;



    display: flex;

    align-items: center;

    justify-content: center;

}



.blog-sidebar form .btn:hover {

    color: #5f20d5;

}





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

   LATEST BLOG BOX

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



.latest-blog {

    background: #ffffff;



    border: 1px solid #eadfff;



    border-radius: 10px;



    overflow: hidden;



    box-shadow: 0 5px 20px rgba(125, 60, 244, 0.07);

}





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

   LATEST BLOG HEADING

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



.latest-blog h2 {

    margin: 0;



    padding: 15px 18px;



    background: #7d3cf4;



    color: #ffffff;



    font-size: 17px;



    font-weight: 600;



    line-height: 1.4;

}





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

   LIST

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



.latest-blog ul {

    list-style: none;



    padding: 0;

    margin: 0;

}





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

   SINGLE BLOG

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



.latest-blog ul li {

    margin: 0;



    padding: 0;



    border-bottom: 1px solid #eee7ff;

}



.latest-blog ul li:last-child {

    border-bottom: 0;

}





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

   BLOG HOLD

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



.lt-blog-hold {

    display: flex;



    align-items: flex-start;



    gap: 12px;



    padding: 14px;



    background: #ffffff;



    transition: all 0.3s ease;

}



.lt-blog-hold:hover {

    background: #faf7ff;

}





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

   IMAGE

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



.left-sm-blog-img {

    flex: 0 0 85px;



    width: 85px;

    height: 68px;



    overflow: hidden;



    border-radius: 7px;



    background: #f5efff;

}



.left-sm-blog-img a {

    display: block;



    width: 100%;

    height: 100%;



    padding: 0 !important;



    background: transparent !important;

}



.left-sm-blog-img img {

    display: block;



    width: 100%;

    height: 100%;



    object-fit: cover;



    border: 0 !important;



    padding: 0 !important;



    border-radius: 0 !important;



    transition: transform 0.35s ease;

}



.lt-blog-hold:hover .left-sm-blog-img img {

    transform: scale(1.06);

}





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

   BLOG DATE / TEXT

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



.latest-blog .b-date {

    flex: 1;



    min-width: 0;



    padding: 2px 0 0;



    color: #777777;



    font-size: 11px;



    line-height: 1.5;

}





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

   BLOG TITLE

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



/*

   যদি title HTML-এর মধ্যে থাকে, এই CSS কাজ করবে।

*/



.latest-blog .b-date a,

.latest-blog .b-date h3,

.latest-blog .b-date h4 {

    color: #222222;



    font-size: 13px;



    font-weight: 600;



    line-height: 1.45;



    text-decoration: none;

}



.latest-blog .b-date a:hover {

    color: #7d3cf4;

}





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

   COMMENT

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



.latest-blog .b-date span {

    display: block;



    margin-top: 5px;



    color: #888888;



    font-size: 10px;

}



.latest-blog .b-date span b {

    color: #7d3cf4;



    font-weight: 600;

}





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

   SMALL READ MORE / IMAGE LINK

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



.latest-blog .sm-read-more {

    display: block;



    padding: 0 !important;



    background: transparent !important;



    text-decoration: none !important;



    border: 0 !important;

}





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

   SIDEBAR HOVER

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



.latest-blog ul li:hover {

    background: #faf7ff;

}





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

   RESPONSIVE - TABLET

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



@media (max-width: 991.98px) {



    .blog-sidebar {

        margin-top: 30px;

    }



    .left-sm-blog-img {

        width: 90px;

        height: 70px;



        flex-basis: 90px;

    }



}





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

   RESPONSIVE - MOBILE

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



@media (max-width: 767.98px) {



    .blog-sidebar {

        margin-top: 25px;

    }



    .latest-blog h2 {

        font-size: 16px;



        padding: 14px 16px;

    }



    .lt-blog-hold {

        padding: 13px;

    }



    .left-sm-blog-img {

        width: 85px;

        height: 68px;



        flex-basis: 85px;

    }



}





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

   SMALL MOBILE

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



@media (max-width: 575.98px) {



    .blog-sidebar form .form-control {

        height: 43px;

    }



    .blog-sidebar form .btn {

        height: 43px;

        width: 43px;

    }



    .left-sm-blog-img {

        width: 80px;

        height: 65px;



        flex-basis: 80px;

    }



}





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

   BLOG SINGLE PAGE

   Bootstrap 5 Compatible

   Theme Color: #7d3cf4

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





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

   BLOG SINGLE MAIN AREA

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



.hol-pad {

    background: #ffffff;

}



.hol-pad > .row {

    max-width: 1200px;

    margin-left: auto;

    margin-right: auto;

}





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

   MAIN BLOG COLUMN

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



.hol-pad .col-md-9 {

    padding-right: 35px;

}



.hol-pad .border-end {

    border-color: #eee7ff !important;

}





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

   SINGLE BLOG ARTICLE

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



.blog-post {

    background: #ffffff;

    padding: 0;

}





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

   BLOG TITLE

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



.blog-post-title {

    margin: 0 0 10px;



    color: #222222;



    font-size: 32px;

    font-weight: 700;



    line-height: 1.25;

}



.blog-post-title::after {

    content: "";



    display: block;



    width: 55px;

    height: 3px;



    margin-top: 14px;



    background: #7d3cf4;



    border-radius: 5px;

}





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

   BLOG META

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



.blog-post-meta {

    margin: 0 0 22px;



    color: #888888;



    font-size: 13px;



    line-height: 1.6;

}



.blog-post-meta a {

    color: #7d3cf4;



    font-weight: 500;



    text-decoration: none;

}



.blog-post-meta a:hover {

    color: #5f20d5;

}





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

   FEATURED IMAGE

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



.single-blog-hol {

    width: 100%;



    overflow: hidden;



    border-radius: 12px;



    background: #f7f3ff;

}



.single-blog-hol img {

    display: block;



    width: 100%;

    height: auto;



    border-radius: 12px;



    object-fit: cover;

}





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

   BLOG DESCRIPTION

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



.blog-des {

    color: #444444;



    font-size: 15px;



    line-height: 1.85;

}





/* Paragraph */



.blog-des p {

    margin-bottom: 18px;

}





/* Heading from Editor */



.blog-des h1,

.blog-des h2,

.blog-des h3,

.blog-des h4,

.blog-des h5,

.blog-des h6 {

    margin-top: 28px;

    margin-bottom: 12px;



    color: #222222;



    font-weight: 700;



    line-height: 1.4;

}



.blog-des h2 {

    font-size: 25px;

}



.blog-des h3 {

    font-size: 22px;

}



.blog-des h4 {

    font-size: 19px;

}





/* Links */



.blog-des a {

    color: #7d3cf4;



    text-decoration: none;

}



.blog-des a:hover {

    color: #5f20d5;



    text-decoration: underline;

}





/* Strong / Bold */



.blog-des strong,

.blog-des b {

    color: #222222;



    font-weight: 700;

}





/* Lists */



.blog-des ul,

.blog-des ol {

    margin-top: 15px;

    margin-bottom: 20px;



    padding-left: 25px;

}



.blog-des li {

    margin-bottom: 8px;

}





/* Blockquote */



.blog-des blockquote {

    margin: 25px 0;



    padding: 18px 22px;



    background: #faf7ff;



    border-left: 4px solid #7d3cf4;



    border-radius: 6px;



    color: #555555;



    font-style: italic;

}





/* Editor Images */



.blog-des img {

    max-width: 100%;

    height: auto;



    border-radius: 8px;



    margin: 10px 0;

}





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

   RELATED BLOGS

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



.blog-card {

    height: 100%;



    overflow: hidden;



    border: 1px solid #eadfff !important;



    border-radius: 10px !important;



    background: #ffffff;



    box-shadow: 0 5px 18px rgba(125, 60, 244, 0.06);



    transition: all 0.3s ease;

}



.blog-card:hover {

    transform: translateY(-4px);



    border-color: #d7c0ff !important;



    box-shadow: 0 10px 25px rgba(125, 60, 244, 0.12);

}





/* Related Blog Image */



.blog-img-arc {

    width: 100%;



    height: 190px;



    overflow: hidden;



    background: #f6f1ff;

}



.blog-img-arc img {

    width: 100%;

    height: 100%;



    object-fit: cover;



    transition: transform 0.4s ease;

}



.blog-card:hover .blog-img-arc img {

    transform: scale(1.05);

}





/* Related Blog Body */



.blog-card .card-body {

    padding: 18px;

}





/* Related Blog Title */



.blog-nm {

    margin-bottom: 10px;



    color: #222222;



    font-size: 17px;



    font-weight: 600;



    line-height: 1.4;

}





/* Related Blog Description */



.blog-card .card-text {

    margin-bottom: 15px;



    color: #777777;



    font-size: 13px;



    line-height: 1.7;

}





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

   READ MORE BUTTON

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



.sm-read-more {

    display: inline-flex;



    align-items: center;

    justify-content: center;



    gap: 7px;



    min-width: 110px;



    padding: 8px 14px !important;



    background: #7d3cf4 !important;



    border: 1px solid #7d3cf4;



    border-radius: 5px;



    color: #ffffff !important;



    font-size: 12px;



    font-weight: 500;



    line-height: 1.4;



    text-decoration: none !important;



    transition: all 0.3s ease;

}



.sm-read-more:hover {

    background: #5f20d5 !important;



    border-color: #5f20d5;



    color: #ffffff !important;

}





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

   COMMENT FORM

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



.comment-form {

    margin-top: 40px !important;



    padding: 25px;



    background: #faf7ff;



    border: 1px solid #eadfff;



    border-radius: 10px;

}





/* Comment Heading */



.comment-form h3 {

    margin: 0 0 22px;



    color: #222222;



    font-size: 22px;



    font-weight: 700;

}



.comment-form h3::after {

    content: "";



    display: block;



    width: 45px;

    height: 3px;



    margin-top: 10px;



    background: #7d3cf4;



    border-radius: 5px;

}





/* Labels */



.comment-form .form-label {

    margin-bottom: 7px;



    color: #333333;



    font-size: 13px;



    font-weight: 600;

}





/* Inputs */



.comment-form .form-control {

    min-height: 45px;



    padding: 10px 13px;



    border: 1px solid #dfd3f5;



    border-radius: 6px;



    background: #ffffff;



    color: #333333;



    font-size: 13px;



    box-shadow: none;

}



.comment-form textarea.form-control {

    min-height: 120px;



    resize: vertical;

}



.comment-form .form-control:focus {

    border-color: #7d3cf4;



    box-shadow: 0 0 0 3px rgba(125, 60, 244, 0.08);

}





/* Submit */



.comment-form button {

    min-height: 42px;



    border: 1px solid #7d3cf4 !important;



    border-radius: 5px;



    background: #7d3cf4 !important;



    color: #ffffff !important;



    font-size: 13px;



    font-weight: 500;



    transition: all 0.3s ease;

}



.comment-form button:hover {

    background: #5f20d5 !important;



    border-color: #5f20d5 !important;

}





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

   RIGHT SIDEBAR

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



.hol-pad .col-md-3 {

    padding-left: 30px;

}





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

   BREADCRUMB

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



.ltn__breadcrumb-area {

    position: relative;



    min-height: 230px;



    display: flex;



    align-items: center;



    background-size: cover;



    background-position: center;

}



.bk-overlay {

    position: absolute;



    inset: 0;



    background: rgba(125, 60, 244, 0.72);

}



.ltn__breadcrumb-area .container {

    position: relative;



    z-index: 2;

}



.brm-title {

    color: #ffffff !important;

}



.ltn__breadcrumb-inner .page-title {

    margin-bottom: 10px;



    font-size: 34px;



    font-weight: 700;

}





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

   RESPONSIVE - TABLET

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



@media (max-width: 991.98px) {



    .hol-pad .col-md-9 {

        padding-right: 15px;



        border-right: 0 !important;

    }



    .hol-pad .col-md-3 {

        padding-left: 15px;



        margin-top: 35px;

    }



    .blog-post-title {

        font-size: 28px;

    }



}





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

   RESPONSIVE - MOBILE

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



@media (max-width: 767.98px) {



    .hol-pad {

        padding-top: 35px !important;

        padding-bottom: 35px !important;

    }



    .blog-post-title {

        font-size: 24px;

    }



    .blog-post-meta {

        font-size: 12px;

    }



    .blog-des {

        font-size: 14px;



        line-height: 1.8;

    }



    .blog-img-arc {

        height: 180px;

    }



    .comment-form {

        padding: 18px;

    }



    .comment-form h3 {

        font-size: 20px;

    }



    .ltn__breadcrumb-area {

        min-height: 190px;

    }



    .ltn__breadcrumb-inner .page-title {

        font-size: 27px;

    }



}





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

   SMALL MOBILE

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



@media (max-width: 575.98px) {



    .blog-post-title {

        font-size: 22px;

    }



    .single-blog-hol,

    .single-blog-hol img {

        border-radius: 8px;

    }



    .blog-des {

        font-size: 13.5px;

    }



    .blog-img-arc {

        height: 170px;

    }



    .comment-form button {

        width: 160px;

    }



}







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

   EVENT / ALBUM DESIGN

   NSCRI PURPLE THEME

   Bootstrap 5 Compatible

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





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

   ALBUM PAGE INTRO

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



.event-text {

    width: 86%;

    margin: 80px auto 40px auto;

    text-align: center;

}



.event-text h1,

.event-text h2,

.event-text h3 {

    color: #20203a;

    font-weight: 700;

    margin-bottom: 12px;

}



.event-text p {

    color: #77758a;

    max-width: 750px;

    margin: 0 auto;

    line-height: 1.8;

}





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

   EVENT BACKGROUND / BANNER

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



.event-bn-hol {

    position: relative;

    overflow: hidden;

}



.ev-bg {

    position: relative;

    overflow: hidden;

}



.event-bn {

    position: absolute;

    top: 0;

    left: 0;

    right: 0;



    width: 100%;

    height: 100%;



    object-fit: cover;



    z-index: -2;

}





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

   ALBUM SECTION

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



.event {

    position: relative;

}



.event .container,

.event .container-fluid {

    position: relative;

}





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

   ALBUM CARD

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



.event .card {

    position: relative;



    background: #ffffff;



    border: 1px solid #e7ddf5;

    border-radius: 14px;



    overflow: hidden;



    box-shadow:

        0 5px 20px rgba(84, 32, 143, 0.08);



    transition:

        transform 0.35s ease,

        box-shadow 0.35s ease,

        border-color 0.35s ease;



    height: 100%;

}





.event .card:hover {

    transform: translateY(-8px);



    border-color: rgba(116, 41, 217, 0.35);



    box-shadow:

        0 15px 35px rgba(84, 32, 143, 0.16);

}





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

   CARD IMAGE

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



.event .card img {

    display: block;



    width: 100%;

    height: 250px;



    object-fit: cover;



    border-radius: 0;



    transition: transform 0.5s ease;

}



.event .card:hover img {

    transform: scale(1.04);

}





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

   FIXED IMAGE

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



.fixed-size {

    display: block;



    width: 100%;

    height: 250px;



    object-fit: cover;



    border-radius: 0;



    transition:

        transform 0.5s ease,

        filter 0.5s ease;

}



.event .card:hover .fixed-size {

    transform: scale(1.04);

}





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

   IMAGE WRAPPER

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



.gallery-hold {

    position: relative;



    width: 100%;



    overflow: hidden;



    background: #f4edff;



    transition:

        transform 0.35s ease,

        box-shadow 0.35s ease;



    z-index: 1;

}



.gallery-hold:hover {

    transform: scale(1.015);

}





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

   IMAGE OVERLAY

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



.g-overlay {

    position: absolute;



    top: 0;

    left: 0;



    width: 100%;

    height: 100%;



    background:

        linear-gradient(

            135deg,

            rgba(84, 32, 143, 0.78),

            rgba(116, 41, 217, 0.60)

        );



    opacity: 0;



    transition: opacity 0.35s ease;



    z-index: 5;

}



.gallery-hold:hover .g-overlay {

    opacity: 1;

}





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

   GALLERY ICON

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



.g-icon {

    position: absolute;



    top: 50%;

    left: 50%;



    transform:

        translate(-50%, -50%)

        scale(0.7);



    width: 45px;

    height: 45px;



    display: flex;



    align-items: center;

    justify-content: center;



    border-radius: 50%;



    background: #ffffff;



    color: #7429d9;



    font-size: 25px;



    opacity: 0;



    cursor: pointer;



    z-index: 20;



    box-shadow:

        0 8px 25px rgba(0, 0, 0, 0.20);



    transition:

        opacity 0.35s ease,

        transform 0.35s ease;



        line-height: 49px;

    text-align: center;

}



.gallery-hold:hover .g-icon {

    opacity: 1;



    transform:

        translate(-50%, -50%)

        scale(1);

}



.g-icon i {

    line-height: 1;

}





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

   DECORATIVE GOLD CORNERS

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



.g-overlay::before,

.g-overlay::after {

    content: "";



    position: absolute;



    width: 45px;

    height: 45px;



    border-color: #e8c69f;



    border-style: solid;



    transition:

        width 0.5s ease,

        height 0.5s ease;

}





.g-overlay::before {

    top: 14px;

    left: 14px;



    border-width: 2px 0 0 2px;

}





.g-overlay::after {

    right: 14px;

    bottom: 14px;



    border-width: 0 2px 2px 0;

}





.gallery-hold:hover .g-overlay::before,

.gallery-hold:hover .g-overlay::after {

    width: calc(100% - 28px);

    height: calc(100% - 28px);

}





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

   EVENT READ MORE

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



.event-read {

    display: inline-flex;



    align-items: center;

    justify-content: center;



    gap: 7px;



    color: #7429d9 !important;



    font-size: 14px !important;

    font-weight: 600;



    text-decoration: none;



    position: relative;



    z-index: 10;



    transition:

        color 0.3s ease,

        gap 0.3s ease;

}



.event-read:hover {

    color: #c90073 !important;



    gap: 11px;

}





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

   ALBUM TITLE

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



.event .card-title,

.event h4,

.event h5 {

    color: #20203a;



    font-weight: 700;



    line-height: 1.5;



    transition: color 0.3s ease;

}



.event .card:hover .card-title,

.event .card:hover h4,

.event .card:hover h5 {

    color: #7429d9;

}





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

   ALBUM TEXT

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



.event .card p {

    color: #77758a;



    line-height: 1.7;



    font-size: 14px;

}





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

   SINGLE ALBUM PAGE

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



.album-single,

.event-single,

.event-details {

    position: relative;



    padding-top: 60px;

    padding-bottom: 70px;

}





.album-single h1,

.event-single h1,

.event-details h1 {

    color: #20203a;



    font-weight: 700;



    margin-bottom: 15px;

}





.album-single p,

.event-single p,

.event-details p {

    color: #77758a;



    line-height: 1.8;

}





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

   SINGLE PAGE IMAGE

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



.album-single img,

.event-single img,

.event-details img {

    max-width: 100%;



    border-radius: 14px;



    box-shadow:

        0 10px 35px rgba(84, 32, 143, 0.12);

}





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

   GALLERY GRID

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



.event .row {

    --bs-gutter-x: 24px;

    --bs-gutter-y: 24px;

}





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

   GALLERY ITEM

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



.event .gallery-item {

    position: relative;



    overflow: hidden;



    border-radius: 14px;



    background: #ffffff;



    border: 1px solid #e7ddf5;



    box-shadow:

        0 6px 22px rgba(84, 32, 143, 0.08);



    transition:

        transform 0.35s ease,

        box-shadow 0.35s ease;

}



.event .gallery-item:hover {

    transform: translateY(-6px);



    box-shadow:

        0 15px 35px rgba(84, 32, 143, 0.15);

}





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

   GALLERY IMAGE

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



.event .gallery-item img {

    width: 100%;



    height: 250px;



    object-fit: cover;



    border-radius: 0;



    transition: transform 0.5s ease;

}



.event .gallery-item:hover img {

    transform: scale(1.06);

}





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

   IMAGE LIGHTBOX

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



.gallery-hold img {

    cursor: pointer;

}





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

   SINGLE PAGE GALLERY

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



.event-details .gallery-hold,

.album-single .gallery-hold,

.event-single .gallery-hold {

    border-radius: 14px;



    overflow: hidden;



    box-shadow:

        0 8px 28px rgba(84, 32, 143, 0.10);

}





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

   TABLET / LAPTOP

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



@media (max-width: 991.98px) {



    .event-text {

        width: 92%;

        margin-top: 60px;

    }



    .fixed-size,

    .event .card img,

    .event .gallery-item img {

        height: 220px;

    }



}





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

   TABLET

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



@media (max-width: 767.98px) {



    .event-text {

        margin: 50px auto 30px;

    }



    .event-text h1 {

        font-size: 28px;

    }



    .event .row {

        --bs-gutter-x: 16px;

        --bs-gutter-y: 18px;

    }



    .fixed-size,

    .event .card img,

    .event .gallery-item img {

        height: 210px;

    }



    .g-icon {

        width: 52px;

        height: 52px;

        font-size: 20px;

    }



}





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

   MOBILE

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



@media (max-width: 575.98px) {



    .event-text {

        width: 94%;

        margin-top: 40px;

    }



    .event-text h1 {

        font-size: 24px;

    }



    .event-text p {

        font-size: 14px;

    }



    .fixed-size,

    .event .card img,

    .event .gallery-item img {

        height: 200px;

    }



    .event .card {

        border-radius: 12px;

    }



}





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

   CARD BOTTOM ACCENT

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



.event .card::after {

    content: "";



    position: absolute;



    left: 0;

    bottom: 0;



    width: 0;

    height: 3px;



    background:

        linear-gradient(

            90deg,

            #7429d9,

            #c90073

        );



    transition: width 0.35s ease;

}



.event .card:hover::after {

    width: 100%;

}





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

   YOUTUBE CARD

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





.youtube-thumbnail-event {

    position: relative !important;

    overflow: hidden;

   height: 250px;

    z-index: 0;

    background: #000;

     border: 5px solid #fff;

    border-radius: 5px;

    align-content: center;

    text-align: center;

    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;   

}

  

   

    

    

    

    

  .youtube-thumbnail-event img {

    width: 100%;

    height: auto;

    display: block;

}  

    

    

    .ev-play{

        

      color: #fff;

        font-size: 40px;

        position: absolute;

        top:40%;

       

        border-radius: 50%;

       z-index: 1333; 

    }

    

    .ev-play::after{

        content: '';

       background: #000;

        border-radius: 50%;

        height: 30px;

        width: 30px;

        display: block;

        z-index: -1;

       position: absolute;

        top:15%; 

    }









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

   TESTIMONIAL SECTION

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



.testimonial-section {

    padding: 80px 0;

    background: #ffffff;

    border-top: 1px solid #e7ddf5;

}





.testimonial-heading {

    max-width: 750px;

    margin: 0 auto 45px;

}





.testimonial-subtitle {

    display: inline-block;

    margin-bottom: 8px;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 1.5px;

    color: #e7b85c;

}





.testimonial-heading h2 {

    margin: 0 0 12px;

    font-size: 34px;

    font-weight: 700;

    color: #20203a;

}





.testimonial-heading p {

    margin: 0;

    font-size: 15px;

    line-height: 1.7;

    color: #77758a;

}







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

   TESTIMONIAL CARD

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



.testimonial-card {

    height: 100%;

    background: #ffffff;

    border: 1px solid #e7ddf5;

    border-radius: 16px;

    overflow: hidden;

    box-shadow: 0 8px 25px rgba(84, 32, 143, 0.08);

    transition: all 0.3s ease;

}





.testimonial-card:hover {

    transform: translateY(-6px);

    box-shadow: 0 15px 35px rgba(84, 32, 143, 0.14);

}







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

   IMAGE

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



.testimonial-image {

    width: 100%;

    height: 163px;

    overflow: hidden;

}





.testimonial-image img {

    width: 100%;

    height: auto!important;

    object-fit: cover;

    display: block;

    overflow-y: hidden;

}







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

   VIDEO

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



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

   TESTIMONIAL VIDEO

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



.testimonial-video {

    position: relative;

    width: 100%;

    aspect-ratio: 16 / 9;

    background: #20203a;

    overflow: hidden;

    cursor: pointer;

}





.testimonial-video img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    display: block;

}





.testimonial-video iframe {

    position: absolute;

    top: 0;

    left: 0;



    width: 100% !important;

    height: 100% !important;



    border: 0;

    display: block;

}





/* Play Button */



.testimonial-play {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);



    width: 50px;

    height: 50px;



    border-radius: 50%;

    border: 1px solid #000;



    background: #e7b85c;



    color: #000;

    font-size: 24px;



    display: flex;

    align-items: center;

    justify-content: center;



    cursor: pointer;



    transition: all 0.3s ease;

}





.testimonial-play:hover {

    background: #f5dba9;

    transform: translate(-50%, -50%) scale(1.08);

}





.testimonial-play i {

    margin-left: 4px;

}



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

   CONTENT

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



.testimonial-content {

    position: relative;

    padding: 28px 25px 25px;

}





.testimonial-quote {

    position: absolute;

    top: 20px;

    right: 22px;

    width: 42px;

    height: 42px;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #f7f5ed;

    color: #e7b85c;

    font-size: 17px;

}





.testimonial-stars {

    margin-bottom: 14px;

}





.testimonial-stars i {

    margin-right: 3px;

    color: #e8c69f;

    font-size: 13px;

}





.testimonial-message {

    margin: 0 0 25px;

    font-size: 14px;

    line-height: 1.8;

    color: #55556b;

}







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

   PERSON

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



.testimonial-person {

    display: flex;

    align-items: center;

    gap: 12px;

    padding-top: 18px;

    border-top: 1px solid #eee8f7;

}





.testimonial-person img {

    width: 48px;

    height: 48px;

    border-radius: 50%;

    object-fit: cover;

    border: 2px solid #e7ddf5;

}





.testimonial-person h4 {

    margin: 0 0 3px;

    font-size: 15px;

    font-weight: 700;

    color: #20203a;

}





.testimonial-person span {

    display: block;

    font-size: 12px;

    color: #77758a;

}



.trustee-btn{

background:#e7b85c;



border-radius: 5px;

padding: 8px;

color: #000;

margin-top: 10px;

}



.trustee-btn:hover{



    background: #f5dba9;

    color: #000;

}



.read-more{



   color:#e7b85c; 

}



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

   RESPONSIVE

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



@media (max-width: 991px) {



    .testimonial-section {

        padding: 65px 0;

    }



    .testimonial-heading h2 {

        font-size: 30px;

    }





       .testimonial-image {

    width: 100%;

    height: 207px;

    overflow: hidden;

}



}





@media (max-width: 767px) {



    .testimonial-section {

        padding: 55px 0;

    }



    .testimonial-heading {

        margin-bottom: 30px;

    }



    .testimonial-heading h2 {

        font-size: 26px;

    }



    .testimonial-image,

    .testimonial-video {

        height: 220px;

    }



}





@media (max-width: 575px) {



    .testimonial-heading h2 {

        font-size: 24px;

    }



    .testimonial-content {

        padding: 25px 20px 22px;

    }





 



}



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



     FAQ



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











.faq-hero {

    position: relative;

    min-height: 330px;

    display: flex;

    align-items: center;

    overflow: hidden;

    background: linear-gradient(90deg, #f5edff 0%, #f8f3ff 48%, #fff 100%);

}

.faq-hero-bg {

    position: absolute;

    top: 0;

    right: 0;

    width: 58%;

    height: 100%;

    background:

        linear-gradient(90deg, #f5edff 0%, rgba(245, 237, 255, 0.3) 28%, rgba(245, 237, 255, 0) 100%),

        url("images/about-banner.webp") center/cover no-repeat;

    opacity: 0.95;

}

.faq-hero-content {

    position: relative;

    z-index: 2;

    max-width: 650px;

    padding: 55px 0;

}

.faq-hero-line {

    display: block;

    width: 52px;

    height: 3px;

    margin-bottom: 20px;

    background: #7429d9;

    border-radius: 5px;

}

.faq-hero h1 {

    margin: 0 0 18px;

    font-size: 48px;

    line-height: 1.15;

    font-weight: 700;

    color: #20203a;

}

.faq-hero h1 span {

    color: #7429d9;

}

.faq-hero p {

    max-width: 600px;

    margin: 0;

    font-size: 16px;

    line-height: 1.8;

    color: #55556b;

}



.faq-page-section {

    padding: 0 0 80px;

    background: #fff;

}

.faq-category-box {

    position: relative;

    z-index: 5;

    display: flex;

    align-items: stretch;

    justify-content: center;

    margin: -38px auto 55px;

    padding: 0 10px;

    max-width: 1180px;

    background: #fff;

    border: 1px solid #eee6f8;

    border-radius: 16px;

    box-shadow: 0 10px 30px rgba(84, 32, 143, 0.1);

    overflow: hidden;

}

.faq-category-btn {

    position: relative;

    flex: 1;

    min-height: 82px;

    padding: 15px 20px;

    border: 0;

    border-right: 1px solid #eee6f8;

    background: #fff;

    color: #20203a;

    font-size: 15px;

    font-weight: 600;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 12px;

    cursor: pointer;

    transition: 0.3s;

}

.faq-category-btn:last-child {

    border-right: 0;

}

.faq-category-btn i {

    font-size: 25px;

    color: #55556b;

    transition: 0.3s;

}

.faq-category-btn:hover,

.faq-category-btn.active {

    color: #7429d9;

    background: #fbf9ff;

}

.faq-category-btn:hover i,

.faq-category-btn.active i {

    color: #7429d9;

}

.faq-category-btn.active:after {

    content: "";

    position: absolute;

    left: 18px;

    right: 18px;

    bottom: 0;

    height: 3px;

    background: #7429d9;

    border-radius: 5px 5px 0 0;

}



.faq-category-content {

    display: none;

}

.faq-category-content.active {

    display: block;

}

.faq-item {

    height: 100%;

    background: #fff;

    border: 1px solid #e8ddf5;

    border-radius: 10px;

    overflow: hidden;

    transition: 0.3s;

}

.faq-item:hover {

    border-color: #d7c2f1;

    box-shadow: 0 8px 25px rgba(84, 32, 143, 0.08);

}

.faq-question {

    width: 100%;

    min-height: 68px;

    padding: 15px 18px;

    border: 0;

    background: transparent;

    color: #20203a;

    text-align: left;

    display: flex;

    align-items: center;

    gap: 12px;

    font-size: 15px;

    font-weight: 600;

    line-height: 1.5;

}

.faq-question:hover {

    color: #7429d9;

}

.faq-question-icon {

    flex: 0 0 28px;

    width: 28px;

    height: 28px;

    border-radius: 50%;

    background: #f1e7ff;

    color: #7429d9;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 11px;

}

.faq-question-text {

    flex: 1;

}

.faq-arrow {

    flex: 0 0 20px;

    text-align: center;

    color: #77758a;

    font-size: 11px;

    transition: 0.3s;

}

.faq-question:not(.collapsed) .faq-arrow {

    transform: rotate(180deg);

    color: #7429d9;

}

.faq-question:not(.collapsed) .faq-question-icon {

    background: #7429d9;

    color: #fff;

}

.faq-answer {

    padding: 0 58px 22px;

    font-size: 14px;

    line-height: 1.8;

    color: #66657a;

}

.faq-empty {

    padding: 60px 20px;

    text-align: center;

    border: 1px dashed #d8c9ec;

    border-radius: 12px;

    background: #fbf9ff;

}

.faq-empty i {

    margin-bottom: 12px;

    font-size: 35px;

    color: #7429d9;

}

.faq-empty p {

    margin: 0;

    color: #77758a;

}



.faq-contact-box {

    max-width: 1100px;

    margin: 65px auto 0;

    padding: 30px 38px;

    display: flex;

    align-items: center;

    gap: 25px;

    background: linear-gradient(135deg, #fbf6ff 0%, #f6edff 100%);

    border: 1px solid #e5d5f7;

    border-radius: 14px;

}

.faq-contact-icon {

    flex: 0 0 82px;

    width: 82px;

    height: 82px;

    border-radius: 50%;

    background: #eadbff;

    color: #7429d9;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 34px;

}

.faq-contact-text {

    flex: 1;

}

.faq-contact-text h3 {

    margin: 0 0 6px;

    font-size: 23px;

    font-weight: 700;

    color: #7429d9;

}

.faq-contact-text p {

    margin: 0;

    font-size: 14px;

    line-height: 1.7;

    color: #55556b;

}

.faq-contact-button {

    padding-left: 30px;

    border-left: 1px solid #dcc8f1;

}

.faq-btn {

    min-width: 170px;

    padding: 13px 22px;

    border-radius: 7px;

    background: #7429d9;

    color: #fff !important;

    text-decoration: none;

    font-size: 14px;

    font-weight: 600;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 14px;

    transition: 0.3s;

}

.faq-btn:hover {

    background: #54208f;

    transform: translateY(-2px);

}



@media (max-width: 991px) {

    .faq-hero {

        min-height: 300px;

    }

    .faq-hero-bg {

        width: 65%;

        opacity: 0.55;

    }

    .faq-hero h1 {

        font-size: 40px;

    }

    .faq-category-btn {

        min-height: 75px;

        padding: 12px 10px;

        font-size: 13px;

        gap: 8px;

    }

    .faq-category-btn i {

        font-size: 20px;

    }

}

@media (max-width: 767px) {

    .faq-hero {

        min-height: 280px;

    }

    .faq-hero-bg {

        width: 100%;

        opacity: 0.2;

    }

    .faq-hero-content {

        padding: 50px 20px;

    }

    .faq-hero h1 {

        font-size: 32px;

    }

    .faq-category-box {

        margin: -25px 15px 40px;

        flex-wrap: wrap;

        padding: 5px;

    }

    .faq-category-btn {

        flex: 0 0 50%;

        min-height: 65px;

        border: 0;

        border-bottom: 1px solid #eee6f8;

        font-size: 13px;

    }

    .faq-question {

        min-height: 62px;

        padding: 13px 14px;

        font-size: 14px;

    }

    .faq-answer {

        padding: 0 52px 20px;

        font-size: 13px;

    }

    .faq-contact-box {

        margin: 45px 15px 0;

        padding: 25px 20px;

        flex-direction: column;

        text-align: center;

    }

    .faq-contact-button {

        width: 100%;

        padding: 20px 0 0;

        border: 0;

        border-top: 1px solid #dcc8f1;

    }

    .faq-btn {

        width: 100%;

    }

}

@media (max-width: 575px) {

    .faq-hero h1 {

        font-size: 28px;

    }

    .faq-category-btn span {

        font-size: 12px;

    }

    .faq-answer {

        padding-left: 50px;

        padding-right: 18px;

    }

}















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



        FOOTER START



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







.footer-main{



    background:#e7b85c;



    color:#fff;



    padding:60px 0 0;



    font-size:14px;



}







.footer-logo{



    max-width:180px;



}







.footer-about{



    color:#595752;



    line-height:1.8;



    margin-bottom:20px;



}







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



        HEADING



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







.footer-main h5{



    color:#000;



    font-size:18px;



    font-weight:700;



    margin-bottom:20px;



    text-transform:uppercase;



}







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



        LINKS



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







.footer-links{



    list-style:none;



    padding:0;



    margin:0;



}







.footer-links li{



    margin-bottom:10px;



}







.footer-links a{



    color:#000;



    text-decoration:none;



    transition:.3s;



}







.footer-links a:hover{



    color:#595752;



    padding-left:5px;



}







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



      TWO COLUMN



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







.two-column{



    columns:2;



}







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



      CONTACT



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







.footer-contact{



    list-style:none;



    padding:0;



    margin:0;



}







.footer-contact li{



    margin-bottom:14px;



    color:#000;



    line-height:1.7;



}







.footer-contact i{



    width:22px;



    color:#000;



}







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



     SOCIAL ICONS



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







.footer-social a{







    width:38px;



    height:38px;







    display:inline-flex;



    align-items:center;



    justify-content:center;







    border:1px solid #595752;







    border-radius:50%;







    color:#000;







    margin-right:8px;







    transition:.3s;







}







.footer-social a:hover{







    background:#f5dba9;



    border-color:#000;



    transform:translateY(-3px);







}







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



      NEWSLETTER



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







.newsletter-text{



    color:#ddd;



    line-height:1.7;



}







.footer-main .form-control{







    border:none;



    height:48px;







}







.footer-main .btn-light{







    width:55px;







    background:#fff;



    color:#5c26a8;







    border:none;







}







.footer-main .btn-light:hover{







    background:#9f63ff;



    color:#fff;







}







.form-check-label{







    color:#ddd;



    font-size:13px;







}







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



     FOOTER BOTTOM



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







.footer-bottom{







    margin-top:45px;







    background:#f5dba9;







    padding:15px 0;







    font-size:13px;







}







.footer-bottom a{







    color:#000;



    text-decoration:none;



    margin:0 8px;







}







.footer-bottom a:hover{







    text-decoration:underline;







}







.footer-bottom span{







    color:#000;







}







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



       RESPONSIVE



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







@media(max-width:991px){







.footer-main{







    text-align:center;







}







.footer-social{







    margin-bottom:25px;







}







.footer-contact{







    margin-bottom:30px;







}







.two-column{







    columns:1;







}







.footer-bottom{







    text-align:center;







}







.footer-bottom .text-lg-end{







    margin-top:12px;







}







}







@media(max-width:576px){







.footer-main{







    padding-top:40px;







}







.footer-main h5{







    margin-top:20px;







}







.footer-bottom a{







    display:inline-block;



    margin:5px;







}







}











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



        FOOTER END



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