/* ==========================================
   1. GLOBAL BASE & SMOOTH SCROLLING
   ========================================== */
html {
  scroll-behavior: smooth;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: #f8f5ee;
  color: #0f172a;
  overflow-x: hidden;
}

::selection {
  background-color: #b8a89a;
  color: #0f172aff;
}

/* ==========================================
   2. REMOVE HOVER EFFECTS & UNDERLINES FROM TITLES
   ========================================== */
h1, h2, h3, h4, h5, h6,
.elementor-widget-heading,
.elementor-heading-title,
.elementor-heading-title a {
  transform: none !important;
  transition: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

h1:hover, h2:hover, h3:hover, h4:hover, h5:hover, h6:hover,
.elementor-widget-heading:hover,
.elementor-heading-title:hover,
.elementor-heading-title a:hover {
  transform: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  text-decoration: none !important;
}

/* ==========================================
   3. MASSIVE & BOLD BACKGROUND TYPOGRAPHY ("CASA VASTUVIT")
   ========================================== */
.casa-watermark,
.elementor-widget-heading.casa-watermark h2,
.elementor-widget-text-editor.casa-watermark {
  position: absolute !important;
  font-size: clamp(9rem, 24vw, 32rem) !important;
  font-weight: 900 !important;
  color: rgba(184, 168, 154, 0.14) !important;
  z-index: 0 !important;
  pointer-events: none !important;
  white-space: nowrap !important;
  user-select: none !important;
  line-height: 0.7 !important;
  letter-spacing: -0.06em !important;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  text-align: center;
}

/* ==========================================
   4. MASTERY SECTION IMAGE: GRAYSCALE TO COLOR ON HOVER
   ========================================== */
.mastery-section img,
.mastery-grayscale-img img {
  filter: grayscale(100%) contrast(105%);
  transition: filter 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1) !important;
  will-change: filter, transform;
}

.mastery-section:hover img,
.mastery-grayscale-img:hover img {
  filter: grayscale(0%) contrast(100%) !important;
  transform: scale(1.03) !important;
}

/* ==========================================
   5. UNIFIED HOVER OVERLAY & ZOOM FOR "EXPLORE BY SPACE" & "CRAFTED AROUND CLIENT'S VISION"
   ========================================== */
.explore-by-space img,
.crafted-vision img,
.softlite-dynamic-list-item img,
.softlite-dynamic-card-box img,
.nq4mugbi img {
  transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1) !important;
  will-change: transform;
}

.explore-by-space:hover img,
.crafted-vision:hover img,
.softlite-dynamic-list-item:hover img,
.softlite-dynamic-card-box:hover img,
.nq4mugbi:hover img {
  transform: scale(1.08) !important;
}

/* Hidden Overlay Descriptions Animation for Both Sections */
.explore-by-space .z38n0uyu,
.explore-by-space .zip2stx7,
.crafted-vision .z38n0uyu,
.crafted-vision .zip2stx7,
.softlite-dynamic-list-item .z38n0uyu,
.nq4mugbi .zip2stx7 {
  opacity: 0;
  transform: translateY(15px);
  transition: opacity 0.4s ease, transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.explore-by-space:hover .z38n0uyu,
.explore-by-space:hover .zip2stx7,
.crafted-vision:hover .z38n0uyu,
.crafted-vision:hover .zip2stx7,
.softlite-dynamic-list-item:hover .z38n0uyu,
.nq4mugbi:hover .zip2stx7 {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* Card Elevation & Lift */
.explore-by-space,
.crafted-vision,
.latest-insight-card,
.softlite-dynamic-card-box {
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.explore-by-space:hover,
.crafted-vision:hover,
.latest-insight-card:hover,
.softlite-dynamic-card-box:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.15) !important;
}

/* ==========================================
   6. ALL BUTTONS: NO UNDERLINES & REVERSE HOVER EFFECT
   ========================================== */
.elementor-button, 
.luxury-btn,
.z2ts3yh0,
.wpcf7-submit,
.elementor-button *,
.luxury-btn *,
a.elementor-button {
  text-decoration: none !important;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative;
  overflow: hidden;
}

.elementor-button:hover, 
.luxury-btn:hover,
.z2ts3yh0:hover,
.wpcf7-submit:hover,
a.elementor-button:hover {
  background-color: #ffffff !important;
  color: #0f172a !important;
  border-color: #0f172a !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 12px 30px -8px rgba(15, 23, 42, 0.2) !important;
  text-decoration: none !important;
}

/* ==========================================
   7. SECTION ENTRANCE ANIMATIONS
   ========================================== */
.elementor-section {
  animation: fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ==========================================
   8. CUSTOM CONTACT FORM STYLING 
   ========================================== */
.nq3shz4s {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  width: 100%;
}

.by8090fj, .pstpuvnk {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}

@media (max-width: 768px) {
  .by8090fj, .pstpuvnk {
    grid-template-columns: 1fr;
  }
}

.f8gw399v, .ur6gb7oh {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.z927wr16 {
  font-size: 0.875rem;
  font-weight: 600;
  color: #0f172a;
  letter-spacing: 0.02em;
}

.g59atk7x, .n7gzxiqv, .gkww1fpb {
  width: 100%;
  padding: 0.875rem 1rem;
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  color: #0f172a;
  font-size: 1rem;
  font-family: inherit;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.g59atk7x:focus, .n7gzxiqv:focus, .gkww1fpb:focus {
  outline: none;
  border-color: #b8a89a;
  box-shadow: 0 0 0 3px rgba(184, 168, 154, 0.2);
}

.gkww1fpb {
  resize: vertical;
}

.v4tr9fqa {
  display: flex;
  justify-content: flex-start;
  margin-top: 0.5rem;
}

.z2ts3yh0, .wpcf7-submit {
  background-color: #0f172a;
  color: #ffffff;
  font-weight: 600;
  padding: 1rem 2.5rem;
  border: 1px solid #0f172a;
  border-radius: 6px;
  cursor: pointer;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-size: 0.875rem;
}