/*==================================================
  CTA
  Zen Spa Home
==================================================*/

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

.cta{

    position:relative;

    display:flex;

    align-items:center;

    justify-content:center;

    min-height:700px;

    overflow:hidden;

    text-align:center;

}

/*==============================================
  BACKGROUND
==============================================*/

.cta-background{

    position:absolute;

    inset:0;

    z-index:-3;

}

.cta-background img{

    width:100%;

    height:100%;

    object-fit:cover;

    transform:scale(1.04);

}

/*==============================================
  OVERLAY
==============================================*/

.cta-overlay{

    position:absolute;

    inset:0;

    z-index:-2;

    background:

        linear-gradient(

            rgba(10,10,10,.55),

            rgba(10,10,10,.82)

        );

}

/*==============================================
  CONTENT
==============================================*/

.cta-content{

    max-width:850px;

    margin:auto;

}

.cta-content .section-title{

    margin-bottom:2rem;

}

.cta-content .section-description{

    margin-inline:auto;

    margin-bottom:3rem;

}

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

.cta-buttons{

    display:flex;

    justify-content:center;

    gap:1.25rem;

    flex-wrap:wrap;

}

/*==============================================
  DECORATION
==============================================*/

.cta::before{

    content:"";

    position:absolute;

    width:700px;

    height:700px;

    border-radius:50%;

    background:

        radial-gradient(

            circle,

            rgba(185,145,93,.10),

            transparent 70%

        );

    z-index:-1;

}

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

@media (max-width:992px){

    .cta{

        min-height:600px;

    }

}

@media (max-width:768px){

    .cta{

        min-height:520px;

    }

    .cta-buttons{

        flex-direction:column;

        align-items:center;

    }

    .cta-buttons .btn{

        width:100%;

    }

}