.elementor-2949 .elementor-element.elementor-element-8e83060{--display:flex;}.elementor-2949 .elementor-element.elementor-element-180716a{--display:flex;}:root{--page-title-display:none;}/* Start custom CSS *//* =====================================================================
   THE KITCHEN INTERIOR — Projects Page — FINAL Approved Design
   =====================================================================
   Paste this WHOLE file into:
   Elementor → Site Settings (gear icon, bottom-left) → Custom CSS
   (Elementor Pro has this panel; free version doesn't — you now have Pro)

   On each widget you build, go to Advanced tab → CSS Classes, and type
   the class name (no dot) exactly as shown in each comment below.
   ===================================================================== */

:root{
  --tki-bg1:#E7D7BC;
  --tki-bg2:#D9C6A2;
  --tki-panel:#FFFFFF;
  --tki-text:#2A231C;
  --tki-text-dim:#6B6053;
  --tki-brass:#C17F3A;
  --tki-brass-light:#D4AC6E;
  --tki-line: rgba(42,35,28,0.14);
}

/* ---------- Apply "tki-page-bg" to the outermost Section wrapping the whole page content ---------- */
.tki-page-bg{
  background:linear-gradient(150deg, var(--tki-bg1) 0%, var(--tki-bg2) 100%) !important;
  color:var(--tki-text);
}

/* ---------- Apply "tki-hero-heading" to the Section/Heading holding your hero title ---------- */
.tki-hero-heading h1, .tki-hero-heading h2, .tki-hero-heading p{
  color:var(--tki-text) !important;
}
.tki-eyebrow{
  color:var(--tki-brass) !important;
}

/* ---------- Apply "tki-filter-wrap" to the Section holding the Taxonomy Filter widget ---------- */
.tki-filter-wrap{
  position:sticky; top:0; z-index:20;
  background:rgba(231,215,188,0.94) !important;
  border-top:1px solid var(--tki-line); border-bottom:1px solid var(--tki-line);
}

/* ---------- Apply "tki-swatch-tab" to filter buttons (Elementor Pro's Taxonomy Filter items) ---------- */
.tki-filter-wrap .elementor-taxonomy-filter li,
.tki-swatch-tab{
  border:1px solid var(--tki-line) !important;
  background:var(--tki-panel) !important;
  color:var(--tki-text-dim) !important;
  border-radius:2px !important;
}
.tki-filter-wrap .elementor-item-active,
.tki-swatch-tab.active{
  background:var(--tki-text) !important;
  color:var(--tki-bg1) !important;
  border-color:var(--tki-text) !important;
}

/* ---------- Apply "tki-grid" to the Loop Grid widget's container ---------- */
.tki-grid{
  grid-auto-flow: dense !important;
}

/* ---------- Apply "tki-card" to the Loop Item template's outer container ---------- */
.tki-card{
  position:relative; border-radius:4px; overflow:hidden;
  background:var(--tki-panel);
  box-shadow:0 2px 10px rgba(42,35,28,0.08);
  transition:transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s ease;
}
.tki-card:hover{
  transform:scale(1.08);
  box-shadow:0 22px 44px rgba(42,35,28,0.32);
  z-index:5;
}

/* ---------- Apply "tki-card-overlay" to the container holding title + meta text on the card ---------- */
.tki-card-overlay{
  background:linear-gradient(180deg, rgba(20,13,8,0) 40%, rgba(15,10,6,0.85) 100%) !important;
  transition:background .4s ease;
}
.tki-card:hover .tki-card-overlay{
  background:linear-gradient(180deg, rgba(20,13,8,0.1) 30%, rgba(15,10,6,0.9) 100%) !important;
}
.tki-card-overlay h3, .tki-card-overlay .tki-meta{
  color:#FBF8F2 !important;
}

/* ---------- Apply "tki-cat-tag" to the small category-label element on each card ---------- */
.tki-cat-tag{
  color:#F4EEE3 !important;
  background:rgba(15,10,6,0.55) !important;
  border:1px solid rgba(244,238,227,0.2) !important;
}

/* ---------- Apply "tki-cta-btn" to your "Book Free Consultation" button widget ---------- */
.tki-cta-btn{
  background:var(--tki-brass) !important;
  color:#FFF9F0 !important;
  border-radius:2px !important;
}

/* ---------- Apply "tki-cta-section" to the Section wrapping the bottom CTA band ---------- */
.tki-cta-section{
  padding-top:48px !important;
  padding-bottom:48px !important;
}/* End custom CSS */