/* ========================================
Theme Color
======================================== */

:root{

  --main-color:#c9a06c;

  --sub-color:#f8f4ef;

  --text-color:#6b5b4f;

  --heading-color:#3f352d;

  --border-color:#e8dfd3;

  --card-color:#ffffff;

  --shadow-color:
    rgba(
      0,
      0,
      0,
      .08
    );

}

/* ========================================
Body
======================================== */

body{

  color:
    var(
      --text-color
    );

  background:
    var(
      --sub-color
    );

}

/* ========================================
Headings
======================================== */

.section-title,
.hero-title,
.content-title,
.service-title,
.price-title,
.feature-title{

  color:
    var(
      --heading-color
    );

}

/* ========================================
Links
======================================== */

a{

  color:
    var(
      --main-color
    );

}

/* ========================================
Buttons
======================================== */

.btn-main,
.hero-btn,
.content-btn{

  background:
    var(
      --main-color
    );

  color:#fff;

}

/* ========================================
Cards
======================================== */

.price-card,
.feature-card,
.gallery-card,
.flow-item,
.news-item{

  background:
    var(
      --card-color
    );

  box-shadow:
    0 10px 30px
    var(
      --shadow-color
    );

}

/* ========================================
Table
======================================== */

.content-table{

  background:
    var(
      --card-color
    );

}

.content-table th{

  background:
    rgba(
      201,
      160,
      108,
      .08
    );

}

.content-table th,
.content-table td{

  border-color:
    var(
      --border-color
    );

}

//* ========================================
Hero
======================================== */

.hero-btn{

  background:
    var(
      --main-color
    );

  color:#fff;

}

.hero-btn:hover{

  opacity:.85;

  color:#fff;

}

.hero-card{
  background:
    rgba(
      255,
      255,
      255,
      .85
    );
}



/* ========================================
Hero Overlay
======================================== */
/*
.hero-template-center::before,
.hero-template-left::before,
.hero-template-right::before{

  background:
    rgba(
      0,
      0,
      0,
      .25
    );

}

.hero-template-video::before{

  background:
    rgba(
      0,
      0,
      0,
      .35
    );

}
*?

/* ========================================
Hero Text Color
======================================== */

.hero-text-auto_dark{

  color:#fff;

}

.hero-text-auto_light{

  color:
    var(
      --text-color
    );

}

.hero-text-white{

  color:#fff;

}

.hero-text-black{

  color:
    var(
      --heading-color
    );

}

.hero-text-primary{

  color:
    var(
      --main-color
    );

}

/* ========================================
Hero Card Theme
======================================== */

.hero-template-card_left.hero-text-auto_dark .hero-card,
.hero-template-card_center.hero-text-auto_dark .hero-card,
.hero-template-card_right.hero-text-auto_dark .hero-card{

  background:
    rgba(
      201,
      160,
      108,
      .85
    );

  color:#fff;

}

.hero-template-card_left.hero-text-auto_light .hero-card,
.hero-template-card_center.hero-text-auto_light .hero-card,
.hero-template-card_right.hero-text-auto_light .hero-card{

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

  color:
    var(
      --text-color
    );

}

.hero-template-card_left.hero-text-white .hero-card,
.hero-template-card_center.hero-text-white .hero-card,
.hero-template-card_right.hero-text-white .hero-card{

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

  color:
    var(
      --heading-color
    );

}

.hero-template-card_left.hero-text-black .hero-card,
.hero-template-card_center.hero-text-black .hero-card,
.hero-template-card_right.hero-text-black .hero-card{

  background:
    rgba(
      34,
      34,
      34,
      .85
    );

  color:#fff;

}

/* ========================================
Hero Card Mobile
======================================== */

@media(max-width:768px){

  .hero-template-card_left.hero-text-auto_dark .hero-card,
  .hero-template-card_center.hero-text-auto_dark .hero-card,
  .hero-template-card_right.hero-text-auto_dark .hero-card{

    background:
      rgba(
        201,
        160,
        108,
        .75
      );

  }

  .hero-template-card_left.hero-text-auto_light .hero-card,
  .hero-template-card_center.hero-text-auto_light .hero-card,
  .hero-template-card_right.hero-text-auto_light .hero-card{

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

  }

  .hero-template-card_left.hero-text-white .hero-card,
  .hero-template-card_center.hero-text-white .hero-card,
  .hero-template-card_right.hero-text-white .hero-card{

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

  }

  .hero-template-card_left.hero-text-black .hero-card,
  .hero-template-card_center.hero-text-black .hero-card,
  .hero-template-card_right.hero-text-black .hero-card{

    background:
      rgba(
        34,
        34,
        34,
        .75
      );

  }

}

/* ========================================
Gallery
======================================== */
/* ========================================
Gallery
======================================== */

.gallery-card{

  background:#fff;

}

.gallery-card-body p{

  color:#6b7280;

}

.gallery-modal::before{
  content:'';
	  position:absolute;

  inset:0;
  background:
    rgba(
      30,
      30,
      30,
      .92
    );
  z-index:1;
}

.gallery-modal-close{

  background:#fff;

  color:#333;

}

/* ========================================
News
======================================== */

.news-date{

  color:#999;

}

/* ========================================
Flow
======================================== */

.flow-step{

  background:
    var(
      --main-color
    );

  color:#fff;

}

/* ========================================
Flow
======================================== */

.flow-item{

  background:#fff;

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

}

.flow-item:hover{

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

}

.flow-icon{

  background:#f5f5f5;

}

.flow-step{

  background:
    var(--main-color);

  color:#fff;

}

.flow-item-text{

  color:#666;

}

.flow-item:not(:last-child)::after{

  color:
    var(--main-color);

}

/* ========================================
Price
======================================== */

.price-amount{

  color:
    var(
      --main-color
    );

}

/* ========================================
About
======================================== */

.about-table-wrap{

  background:#fff;

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

}

.about-table tr{

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

}

.about-table tr:last-child{

  border-bottom:none;

}

.about-table th{

  background:#faf7f2;

}

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

.faq-item{

  background:#fff;

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

}

.faq-answer{

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

}

.faq-q{

  background:
    var(--main-color);

  color:#fff;

}

.faq-a{

  background:
    #faf7f2;

  color:
    var(--main-color);

}

.team-section{

  background:#f8f4ee;

}

.team-card{

  background:#fffdf9;

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

}

.team-name{

  color:#5e5245;

}

.team-position{

  color:#b39b7a;

}

.team-description{

  color:#7b7064;

}

/* ========================================
Voice
======================================== */

.voice-card{

  background:#fff;

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

}

.voice-company{

  color:
    rgba(
      0,
      0,
      0,
      .6
    );

}

.voice-stars{

  color:#d4a86a;

}

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

.cta-box{

  background:
    linear-gradient(
      135deg,
      var(--main-color),
      color-mix(
        in srgb,
        var(--main-color) 75%,
        #000
      )
    );

  color:#fff;

}

.cta-box::before{

  background:
    radial-gradient(
      circle at top right,
      rgba(
        255,
        255,
        255,
        .12
      ),
      transparent 40%
    );

}

.cta-box .section-label{

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

  color:#fff;

}

.cta-title{

  color:#fff;

}

.cta-text{

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

}

.cta-box .btn-main{

  background:#fff;

  color:var(--main-color);

}

/* ========================================
Banner
======================================== */

.banner-item img{

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

}

/* ========================================
Fixed Footer
======================================== */

.fixed-footer{

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

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

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

}

.fixed-footer-btn{

  color:
    var(--main-color);

}

.fixed-footer-btn:not(:last-child){

  border-right:
    1px solid
    rgba(
      0,
      0,
      0,
      .06
    );

}

/* ========================================
Contact
======================================== */

.contact-form{

  background:#fff;

  padding:40px;

  border-radius:24px;

  border:1px solid rgba(0,0,0,.06);

}

.required{

  color:#b98a54;

}

.modal-content{

  border-radius:24px;

}